:root{--font-primary:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace;--font-hero:"Inter", -apple-system, BlinkMacSystemFont, sans-serif;--bg-base:#0a0907;--surface-elevated:#11100d;--surface-card:#161411;--surface-overlay:#0a0907f0;--accent-gold:#d4a03c;--accent-gold-bright:#eec05a;--accent-glow:#d4a03c2e;--border-subtle:#fff8e612;--border-medium:#fff8e624;--border-accent:#d4a03c8c;--text-primary:#f0ebe0;--text-body:#968c7e;--text-muted:#5a544a;--status-warning:#ef4444;--status-success:#4ade80}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;margin:0;padding:0}body{background-color:var(--bg-base);color:var(--text-primary);font-family:var(--font-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;width:100vw;height:100vh;overflow:hidden}.gym-arena{background:radial-gradient(at 50% 15%,#d4a03c0d 0%,#0000 65%),linear-gradient(#0a0907 0%,#11100d 100%);flex-direction:column;width:100vw;height:100vh;display:flex;position:relative}.arcade-header{z-index:50;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--border-subtle);background:linear-gradient(#0a0907f5 0%,#0a0907bf 80%,#0a090700 100%);justify-content:space-between;align-items:center;width:100%;padding:18px 36px;display:flex;position:absolute;top:0;left:0}.brand-badge{align-items:center;gap:14px;display:flex}.brand-title{font-family:var(--font-primary);letter-spacing:-.02em;background:linear-gradient(135deg, #fff 0%, var(--accent-gold-bright) 50%, var(--accent-gold) 100%);-webkit-text-fill-color:transparent;text-shadow:0 0 20px var(--accent-glow);-webkit-background-clip:text;font-size:22px;font-weight:800}.brand-pill{font-family:var(--font-mono);letter-spacing:.1em;color:var(--accent-gold);border:1px solid var(--border-accent);box-shadow:0 0 12px var(--accent-glow);background:#d4a03c14;border-radius:4px;padding:4px 10px;font-size:10px;font-weight:600}.header-headline{font-family:var(--font-mono);letter-spacing:.12em;color:var(--text-primary);text-align:center;text-shadow:0 0 15px var(--accent-glow);border-bottom:1px solid var(--border-subtle);padding:6px 18px;font-size:12px;font-weight:600}.header-actions{align-items:center;gap:10px;display:flex}.action-btn{border:1px solid var(--border-medium);color:var(--text-primary);font-family:var(--font-primary);letter-spacing:.03em;text-transform:uppercase;cursor:pointer;background:#161411bf;border-radius:6px;align-items:center;gap:6px;padding:9px 16px;font-size:11px;font-weight:700;transition:all .2s ease-in-out;display:flex}.action-btn:hover{color:var(--accent-gold-bright);border-color:var(--border-accent);box-shadow:0 0 16px var(--accent-glow);background:#d4a03c1f}.action-btn.action-btn-menu{border-color:var(--border-accent);color:var(--accent-gold-bright);background:linear-gradient(135deg,#d4a03c38 0%,#d4a03c14 100%)}.action-btn.action-btn-menu:hover{box-shadow:0 0 20px var(--accent-glow);background:linear-gradient(135deg,#d4a03c59 0%,#d4a03c26 100%)}.viewport-stage{flex:1;width:100%;height:100%;position:relative;overflow:hidden}#webcam-video{display:none}#game-canvas{object-fit:cover;z-index:10;width:100%;height:100%;position:absolute;top:0;left:0}.instruction-banner{background:var(--surface-overlay);border:1px solid var(--border-accent);font-family:var(--font-mono);color:var(--text-body);z-index:35;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);letter-spacing:.04em;border-radius:20px;padding:6px 22px;font-size:11.5px;font-weight:500;position:absolute;top:76px;left:50%;transform:translate(-50%);box-shadow:0 4px 18px #0009}.splash-modal{opacity:0;pointer-events:none;text-align:center;z-index:60;transition:all .28s cubic-bezier(.16,1,.3,1);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(.88)}.splash-modal.active{opacity:1;transform:translate(-50%,-50%)scale(1)}.splash-main-text{font-family:var(--font-hero);letter-spacing:-.03em;color:var(--text-primary);text-shadow:0 4px 28px #000000e6, 0 0 35px var(--accent-glow);font-size:clamp(52px,7vw,96px);font-weight:800;line-height:.95}.splash-sub-text{font-family:var(--font-mono);color:var(--accent-gold);letter-spacing:.2em;text-transform:uppercase;margin-top:12px;font-size:14px;font-weight:700}.menu-overlay-gate{background:var(--surface-overlay);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:100;justify-content:center;align-items:center;width:100vw;height:100vh;padding:24px;animation:.25s ease-out fadeInMenu;display:flex;position:fixed;top:0;left:0}@keyframes fadeInMenu{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.academy-menu-card{border:1px solid var(--border-accent);width:94%;max-width:820px;max-height:90vh;box-shadow:0 28px 70px #000000e6, 0 0 45px var(--accent-glow);background:linear-gradient(#161411 0%,#11100d 100%);border-radius:18px;padding:36px 42px;overflow-y:auto}.academy-menu-card::-webkit-scrollbar{width:6px}.academy-menu-card::-webkit-scrollbar-thumb{background:var(--border-medium);border-radius:3px}.menu-header{text-align:center;border-bottom:1px solid var(--border-subtle);margin-bottom:28px;padding-bottom:18px}.menu-title{font-family:var(--font-hero);letter-spacing:-.03em;background:linear-gradient(135deg, #fff 0%, var(--accent-gold-bright) 50%, var(--accent-gold) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin:4px 0 8px;font-size:clamp(52px,7vw,96px);font-weight:800;line-height:.95}.menu-body-grid{grid-template-columns:1fr 1fr;gap:22px 28px;display:grid}@media (width<=680px){.menu-body-grid{grid-template-columns:1fr}}.menu-section{flex-direction:column;display:flex}.section-title{font-family:var(--font-mono);letter-spacing:.12em;color:var(--accent-gold);text-transform:uppercase;margin-bottom:10px;font-size:11px;font-weight:600}.selector-pills{flex-direction:column;gap:8px;display:flex}.menu-pill{border:1px solid var(--border-subtle);text-align:left;cursor:pointer;background:#fff8e606;border-radius:10px;flex-direction:column;gap:3px;padding:12px 16px;transition:all .2s;display:flex}.menu-pill:hover{border-color:var(--border-medium);background:#fff8e60d}.menu-pill.active{border-color:var(--border-accent);box-shadow:0 0 16px var(--accent-glow);background:linear-gradient(135deg,#d4a03c29 0%,#d4a03c0a 100%)}.pill-name{font-family:var(--font-primary);color:var(--text-primary);letter-spacing:-.01em;font-size:14px;font-weight:700}.menu-pill.active .pill-name{color:var(--accent-gold-bright)}.pill-desc{font-family:var(--font-primary);color:var(--text-body);font-size:12px;font-weight:400;line-height:1.4}.selector-stacked{flex-direction:column;gap:8px;display:flex}.menu-stack-btn{border:1px solid var(--border-subtle);cursor:pointer;background:#fff8e606;border-radius:10px;justify-content:space-between;align-items:center;padding:12px 16px;transition:all .2s;display:flex}.menu-stack-btn:hover{border-color:var(--border-medium);background:#fff8e60d}.menu-stack-btn.active{border-color:var(--border-accent);box-shadow:0 0 16px var(--accent-glow);background:linear-gradient(135deg,#d4a03c29 0%,#d4a03c0a 100%)}.stack-name{font-family:var(--font-primary);color:var(--text-primary);font-size:13.5px;font-weight:700}.menu-stack-btn.active .stack-name{color:var(--accent-gold-bright)}.stack-badge{font-family:var(--font-mono);letter-spacing:.05em;color:var(--text-muted);text-transform:uppercase;font-size:10px;font-weight:600}.menu-stack-btn.active .stack-badge{color:var(--accent-gold)}.swatches-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.glove-swatch{border:1px solid var(--border-subtle);cursor:pointer;text-align:left;background:#fff8e606;border-radius:10px;align-items:center;gap:10px;padding:11px 13px;transition:all .2s;display:flex}.glove-swatch:hover{border-color:var(--border-medium);background:#fff8e60d}.glove-swatch.active{border-color:var(--border-accent);box-shadow:0 0 14px var(--accent-glow);background:#d4a03c1f}.swatch-color{border:1px solid #ffffff59;border-radius:50%;flex-shrink:0;width:14px;height:14px}.swatch-color.swatch-none{border:1px dashed var(--text-muted);background:0 0}.swatch-label{font-family:var(--font-primary);color:var(--text-primary);font-size:12px;font-weight:600}.glove-swatch.active .swatch-label{color:var(--accent-gold-bright)}.motion-guidance-badge{background:#d4a03c0d;border:1px solid #d4a03c40;border-radius:10px;align-items:center;gap:12px;margin-top:24px;padding:12px 18px;display:flex}.guidance-icon{color:var(--accent-gold);font-size:14px}.guidance-text{font-family:var(--font-primary);color:var(--text-body);font-size:12px;font-weight:500;line-height:1.5}.menu-actions{gap:14px;margin-top:26px;display:flex}.menu-action-btn{font-family:var(--font-primary);letter-spacing:.03em;cursor:pointer;text-align:center;text-transform:uppercase;border-radius:10px;flex:1;padding:15px 26px;font-size:13px;font-weight:800;transition:all .22s ease-in-out}.menu-action-btn.primary{background:linear-gradient(135deg, var(--accent-gold-bright) 0%, var(--accent-gold) 100%);color:#0a0907;border:none;box-shadow:0 4px 22px #d4a03c66}.menu-action-btn.primary:hover{transform:translateY(-2px);box-shadow:0 8px 30px #d4a03c99}.menu-action-btn.secondary{border:1px solid var(--border-accent);color:var(--text-primary);background:#fff8e60a}.menu-action-btn.secondary:hover{color:var(--accent-gold-bright);background:#d4a03c24}.match-over-modal{background:var(--surface-overlay);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);z-index:95;justify-content:center;align-items:center;width:100vw;height:100vh;animation:.28s ease-out fadeInModal;display:flex;position:fixed;top:0;left:0}@keyframes fadeInModal{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}.match-card{border:1px solid var(--border-accent);text-align:center;width:92%;max-width:740px;max-height:90vh;box-shadow:0 28px 70px #000000e6, 0 0 45px var(--accent-glow);background:linear-gradient(#161411 0%,#11100d 100%);border-radius:18px;padding:36px 38px;overflow-y:auto}.match-card::-webkit-scrollbar{width:6px}.match-card::-webkit-scrollbar-thumb{background:var(--border-medium);border-radius:3px}.match-badge{color:var(--accent-gold);font-family:var(--font-mono);letter-spacing:.12em;border:1px solid var(--border-accent);text-transform:uppercase;background:#d4a03c14;border-radius:4px;margin-bottom:12px;padding:4px 14px;font-size:11px;font-weight:600;display:inline-block}.match-title{font-family:var(--font-hero);letter-spacing:-.03em;color:var(--text-primary);text-shadow:0 0 20px var(--accent-glow);font-size:clamp(38px,5.5vw,64px);font-weight:800;line-height:1.05}.match-subtitle{font-family:var(--font-primary);color:var(--text-body);letter-spacing:.01em;margin-top:6px;font-size:13px;font-weight:400}.match-stats-row{border:1px solid var(--border-subtle);background:#fff8e608;border-radius:12px;justify-content:space-around;margin:24px 0 26px;padding:16px 12px;display:flex}.match-stat{flex-direction:column;align-items:center;display:flex}.m-stat-val{font-family:var(--font-primary);letter-spacing:-.02em;color:var(--accent-gold-bright);font-size:28px;font-weight:800}.m-stat-label{font-family:var(--font-mono);color:var(--text-muted);letter-spacing:.1em;text-transform:uppercase;margin-top:4px;font-size:10px;font-weight:600}.summary-breakdown-grid{text-align:left;grid-template-columns:1fr 1fr;gap:20px;display:grid}@media (width<=640px){.summary-breakdown-grid{grid-template-columns:1fr}}.summary-col{border:1px solid var(--border-subtle);background:#fff8e606;border-radius:12px;padding:18px 20px}.summary-col-title{font-family:var(--font-mono);letter-spacing:.12em;color:var(--accent-gold);border-bottom:1px solid var(--border-subtle);text-transform:uppercase;margin-bottom:14px;padding-bottom:8px;font-size:11px;font-weight:700}.summary-metric{margin-bottom:14px}.summary-metric-header{font-family:var(--font-mono);letter-spacing:.06em;color:var(--text-body);justify-content:space-between;align-items:baseline;font-size:11px;font-weight:600;display:flex}.summary-metric-val{font-family:var(--font-mono);color:var(--accent-gold-bright);font-size:18px;font-weight:700}.summary-meter-container{border:1px solid var(--border-subtle);background:#fff8e60f;border-radius:4px;height:8px;margin-top:6px;overflow:hidden}.summary-meter-fill{background:linear-gradient(90deg, #b88628 0%, var(--accent-gold) 50%, var(--accent-gold-bright) 100%);width:100%;height:100%;box-shadow:0 0 10px var(--accent-glow);transition:width .4s}.summary-status-row{border:1px solid var(--border-subtle);background:#fff8e605;border-radius:8px;justify-content:space-between;align-items:center;margin-top:10px;padding:10px 14px;display:flex}.summary-status-label{font-family:var(--font-mono);color:var(--text-body);letter-spacing:.06em;text-transform:uppercase;font-size:11px;font-weight:500}.summary-status-badge{font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;padding:0;font-size:13px;font-weight:700;box-shadow:none!important;background:0 0!important;border:none!important}.summary-status-badge.status-warning{color:#ef4444;text-shadow:0 0 10px #ef444440;box-shadow:none!important;background:0 0!important;border:none!important}.summary-status-badge.status-good{color:#4ade80;text-shadow:0 0 10px #4ade8040;box-shadow:none!important;background:0 0!important;border:none!important}.registry-row{border-bottom:1px solid #fff8e60a;justify-content:space-between;align-items:center;padding:8px 0;display:flex}.registry-row:last-child{border-bottom:none}.registry-name{font-family:var(--font-primary);color:var(--text-body);font-size:13px;font-weight:400}.registry-val{font-family:var(--font-mono);color:var(--accent-gold-bright);font-size:14px;font-weight:600}.summary-actions{gap:14px;margin-top:26px;display:flex}.summary-btn{font-family:var(--font-primary);letter-spacing:.03em;cursor:pointer;text-align:center;text-transform:uppercase;border-radius:10px;flex:1;padding:15px 24px;font-size:13px;font-weight:800;transition:all .22s ease-in-out}.summary-btn.primary{background:linear-gradient(135deg, var(--accent-gold-bright) 0%, var(--accent-gold) 100%);color:#0a0907;border:none;box-shadow:0 4px 22px #d4a03c66}.summary-btn.primary:hover{transform:translateY(-2px);box-shadow:0 8px 30px #d4a03c99}.summary-btn.secondary{border:1px solid var(--border-accent);color:var(--text-primary);background:#fff8e60a}.summary-btn.secondary:hover{color:var(--accent-gold-bright);background:#d4a03c24}
