:root{--ink: #1b2a1f;--paper: #f6f1e2;--accent: #e0892b;--accent2: #3b7d4f;--a: #d98a2b;--b: #3f7fae}*{box-sizing:border-box}html,body{margin:0;height:100%;height:100dvh;overflow:hidden;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}body{-webkit-text-size-adjust:100%;text-size-adjust:100%;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;overscroll-behavior:none}#scene{position:fixed;inset:0;display:block;width:100%;height:100%;touch-action:none}#ui{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;padding:16px}#ui .panel{pointer-events:auto}.panel{background:#f6f1e2f5;color:var(--ink);border-radius:18px;padding:22px 24px;width:min(440px,94vw);box-shadow:0 18px 50px #00000059;text-align:center;backdrop-filter:blur(3px)}header h1,.winner{margin:0 0 4px;font-size:26px;letter-spacing:.3px}header p{margin:0 0 14px;opacity:.7;font-size:14px}.matchup{display:flex;align-items:center;gap:10px;justify-content:center}.fighter{flex:1}.fighter select{width:100%;font-size:16px;font-weight:600;padding:8px;border-radius:10px;border:2px solid rgba(0,0,0,.15);background:#fff;color:var(--ink)}.vs{font-weight:800;opacity:.5}.count{margin-top:8px;display:flex;align-items:center;justify-content:center;gap:8px}.count button{width:30px;height:30px;border-radius:50%;border:none;background:var(--ink);color:#fff;font-size:18px;cursor:pointer}.count span{min-width:20px;font-weight:700;font-size:18px}.statcard{margin:16px 0}.odds-bar{display:flex;height:26px;border-radius:8px;overflow:hidden;font-size:12px;font-weight:700;color:#fff}.odds-a{background:var(--a);display:flex;align-items:center;padding-left:8px}.odds-b{background:var(--b);display:flex;align-items:center;justify-content:flex-end;padding-right:8px}.statgrid{margin-top:10px;display:grid;gap:5px}.stat-row{display:grid;grid-template-columns:1fr 64px 1fr;align-items:center;gap:6px}.stat-label{font-size:11px;text-transform:uppercase;opacity:.6;letter-spacing:.5px}.stat-bar{height:8px;background:#00000014;border-radius:4px;position:relative}.stat-bar i{position:absolute;top:0;height:100%;border-radius:4px}.stat-bar.left{transform:scaleX(-1)}.stat-bar.left i{left:0;background:var(--a)}.stat-bar.right i{left:0;background:var(--b)}.tier{font-size:13px;opacity:.85;margin-bottom:14px}.tier-btn{border:2px solid rgba(0,0,0,.15);background:#fff;border-radius:8px;padding:5px 12px;margin-left:6px;cursor:pointer;font-weight:600}.tier-btn.on{background:var(--accent2);color:#fff;border-color:var(--accent2)}.tier-btn.chaos.on{background:#d8321a;border-color:#d8321a;box-shadow:0 0 12px #d8321ab3}.actions{display:flex;gap:10px}.actions.wrap{flex-wrap:wrap}.actions button,.bet{flex:1;min-width:120px;padding:13px 12px;border:none;border-radius:12px;font-size:15px;font-weight:700;cursor:pointer;background:var(--accent);color:#fff;transition:transform .05s ease}.actions button:active,.bet:active{transform:translateY(1px)}[data-bet=A]{background:var(--a)}[data-bet=B]{background:var(--b)}.ghost{margin-top:10px;background:none;border:none;color:var(--ink);opacity:.6;cursor:pointer;font-size:13px;text-decoration:underline}.verdict{font-weight:800;margin:2px 0}.verdict.right{color:var(--accent2)}.verdict.wrong{color:#b34a4a}.streak{font-weight:700;margin:2px 0;opacity:.9}.why{font-size:15px;opacity:.85;margin:8px 0 18px}.toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%);z-index:11;background:linear-gradient(150deg,#2b3036,#15181c);color:#fff;font-weight:700;padding:11px 18px;border-radius:10px;border:1px solid var(--edge);text-shadow:0 0 8px var(--neon-glow);box-shadow:inset 0 1px #ffffff1f,0 6px 20px #0000008c,0 0 18px #49d2ff66;opacity:0;transition:opacity .2s;pointer-events:none}.toast.show{opacity:1}#vignette{position:fixed;inset:0;pointer-events:none;z-index:5;box-shadow:inset 0 0 180px 40px #00000073}#flash{position:fixed;inset:0;pointer-events:none;z-index:6;background:radial-gradient(ellipse at center,#fff0c8e6,#ffd27833);opacity:0}#flash.go{animation:flashFade .7s ease-out}@keyframes flashFade{0%{opacity:.85}to{opacity:0}}.compose .wordmark span{color:var(--accent)}.title-screen{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:12vh 4vw 12vh;pointer-events:none;background:linear-gradient(180deg,#00000080,#0000 28% 70%,#0000008c)}.title-top{text-align:center;animation:titleIn 1s ease both}.title-bottom{text-align:center;animation:titleIn 1s ease .15s both}.title-kicker{color:#ffe1a8;font-weight:800;letter-spacing:4px;font-size:14px;text-shadow:0 2px 8px rgba(0,0,0,.7);margin-bottom:6px}.title-main{margin:6px 0 0;font-size:clamp(11px,2.1vw,23px);line-height:.95;font-weight:800;color:#e8edf2;letter-spacing:1px;opacity:.92;text-shadow:0 2px 0 rgba(0,0,0,.3),0 8px 22px rgba(0,0,0,.7)}.title-main span{color:var(--accent);display:inline-block;animation:winGlow 2.4s ease-in-out infinite}@keyframes winGlow{0%,to{text-shadow:0 4px 0 rgba(0,0,0,.35),0 0 18px rgba(224,137,43,.5)}50%{text-shadow:0 4px 0 rgba(0,0,0,.35),0 0 40px rgba(224,137,43,.95);transform:scale(1.04)}}.title-sub{color:#f3ecd9;font-size:clamp(15px,2.4vw,20px);margin:14px 0 28px;text-shadow:0 2px 10px rgba(0,0,0,.8)}.title-play{pointer-events:auto;border:none;cursor:pointer;background:var(--accent);color:#fff;font-weight:800;font-size:20px;padding:16px 30px;border-radius:14px;box-shadow:0 10px 30px #00000073;animation:playPulse 1.8s ease-in-out infinite}.title-play:active{transform:translateY(2px)}@keyframes titleIn{0%{opacity:0;transform:translateY(2vh) scale(.96)}to{opacity:1}}@keyframes playPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}#sound-toggle{position:fixed;top:14px;right:14px;z-index:10;width:42px;height:42px;border-radius:50%;border:none;cursor:pointer;background:#1b2a1fc7;font-size:18px;line-height:42px;box-shadow:0 4px 12px #00000040}#fade{position:fixed;inset:0;background:#000;opacity:0;pointer-events:none;z-index:9;transition:opacity .35s ease}#fade.on{opacity:1}#letterbox{position:fixed;inset:0;pointer-events:none;z-index:7}#letterbox:before,#letterbox:after{content:"";position:absolute;left:0;right:0;height:0;background:#000;transition:height .55s cubic-bezier(.22,1,.36,1)}#letterbox:before{top:0}#letterbox:after{bottom:0}#letterbox.on:before,#letterbox.on:after{height:0}#vs{position:fixed;inset:0;display:none;align-items:center;justify-content:center;pointer-events:none;z-index:8}#vs.show{display:flex}.vs-card{display:flex;align-items:center;gap:clamp(10px,3vw,34px);padding:0 16px}.vs-side{font-weight:900;font-size:clamp(26px,5.5vw,60px);color:#fff;text-shadow:0 4px 24px rgba(0,0,0,.85);text-align:center}.vs-a{color:var(--a);animation:vsInL .55s cubic-bezier(.22,1,.36,1) both}.vs-b{color:var(--b);animation:vsInR .55s cubic-bezier(.22,1,.36,1) both}.vs-mid{font-size:clamp(40px,9vw,104px);font-weight:900;color:var(--accent);text-shadow:0 0 34px rgba(224,137,43,.85);animation:vsPop .5s ease .18s both}@keyframes vsInL{0%{opacity:0;transform:translate(-70px)}to{opacity:1;transform:none}}@keyframes vsInR{0%{opacity:0;transform:translate(70px)}to{opacity:1;transform:none}}@keyframes vsPop{0%{opacity:0;transform:scale(2.4) rotate(-8deg)}to{opacity:1;transform:none}}.panel.result{animation:panelIn .5s cubic-bezier(.22,1,.36,1) both}@keyframes panelIn{0%{opacity:0;transform:translateY(22px) scale(.94)}to{opacity:1;transform:none}}#countdown{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:8;font-weight:900;color:#fff;letter-spacing:2px;text-shadow:0 6px 0 rgba(0,0,0,.4),0 16px 44px rgba(0,0,0,.75)}#countdown.go{font-size:clamp(90px,20vw,220px)}#countdown.fight{color:var(--accent);font-size:clamp(64px,13vw,160px)}#countdown.show{animation:countPop .72s ease both}@keyframes countPop{0%{opacity:0;transform:scale(2.3)}18%{opacity:1;transform:scale(1)}78%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.82)}}#hud{position:fixed;top:18px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:16px;pointer-events:none;background:#1b2a1fc7;color:#fff;padding:8px 18px;border-radius:999px;font-weight:800;font-size:17px;letter-spacing:.3px;box-shadow:0 6px 18px #0000004d}#hud .hud-a{color:var(--a)}#hud .hud-b{color:var(--b)}#hud .hud-vs{opacity:.55;font-size:13px}#hud .out{opacity:.4;text-decoration:line-through}@media (max-width: 480px){.panel{padding:18px 16px}.actions{flex-direction:column}}:root{--metal-1: #2c3036;--metal-2: #15181c;--edge: #41474f;--ink: #e9eef1;--nixie: #ffb35a;--nixie-glow: rgba(255,138,32,.75);--neon: #58e1ff;--neon-glow: rgba(73,210,255,.7)}body{background:#07090b;color:var(--ink)}.panel{position:relative;color:var(--ink);background:repeating-linear-gradient(118deg,rgba(255,255,255,.028) 0 1px,transparent 1px 3px),repeating-linear-gradient(62deg,rgba(0,0,0,.05) 0 1px,transparent 1px 4px),linear-gradient(152deg,var(--metal-1),var(--metal-2));border:1px solid var(--edge);border-radius:16px;box-shadow:inset 0 1px #ffffff24,inset 0 -3px 8px #0000008c,0 20px 60px #000000a6,0 0 0 1px #0009,0 0 30px #28506e40;backdrop-filter:none;overflow:hidden}.panel:after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:16px;background:repeating-linear-gradient(0deg,rgba(0,0,0,.12) 0 1px,transparent 1px 3px),radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.35) 100%)}.panel>*{position:relative;z-index:1}header h1,.winner,.wordmark{color:#fff;text-shadow:0 0 7px var(--nixie-glow),0 0 18px var(--nixie-glow),0 2px 0 rgba(0,0,0,.5)}.wordmark span,.winner{color:var(--nixie)}header p,.title-sub{color:#aeb6bb;text-shadow:0 0 6px rgba(73,210,255,.25)}.fighter select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%2358e1ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 12px center / 12px,linear-gradient(150deg,#20242a,#141619);color:var(--ink);border:1px solid var(--edge);text-shadow:0 0 6px var(--neon-glow);padding-right:34px}.fighter select option{background:#1a1d22;color:#e9eef1}.vs{color:var(--neon);text-shadow:0 0 10px var(--neon-glow)}.count button{background:linear-gradient(#2b3036,#191c20);border:1px solid var(--edge);color:var(--ink);box-shadow:inset 0 1px #ffffff1a}.count span{color:var(--nixie);text-shadow:0 0 8px var(--nixie-glow)}.odds-bar{box-shadow:inset 0 0 8px #0009,0 0 10px #0006}.odds-a{background:linear-gradient(#ffb35a,#e07f1e);box-shadow:0 0 12px var(--nixie-glow)}.odds-b{background:linear-gradient(#58e1ff,#1f8fc4);box-shadow:0 0 12px var(--neon-glow)}.stat-label{color:#8f989d}.actions button,.bet,.ghost.watch,[data-act]{background:linear-gradient(150deg,#343a42,#1c2026);color:var(--ink);border:1px solid var(--edge);text-shadow:0 0 8px rgba(73,210,255,.45);box-shadow:inset 0 1px #ffffff1f,inset 0 -2px 5px #00000080,0 4px #00000073,0 0 16px #285a7859}.actions button:active,.bet:active{transform:translateY(2px);box-shadow:inset 0 1px #ffffff1a,0 1px #00000073}[data-bet=A]{color:#ffd9ad;box-shadow:inset 0 1px #ffffff1f,0 4px #00000073,0 0 18px var(--nixie-glow);border-color:#6a4a28}[data-bet=B]{color:#cdeeff;box-shadow:inset 0 1px #ffffff1f,0 4px #00000073,0 0 18px var(--neon-glow);border-color:#2b5a72}.title-play{background:linear-gradient(150deg,#3a2a18,#1c130a);color:var(--nixie);border:1px solid #6a4a28;text-shadow:0 0 10px var(--nixie-glow);box-shadow:inset 0 1px #ffffff1f,0 6px #00000080,0 0 26px var(--nixie-glow)}#hud{background:linear-gradient(150deg,#1e2227eb,#0c0e11eb);border:1px solid var(--edge);box-shadow:inset 0 1px #ffffff1a,0 0 18px #285a7866}#hud .hud-a{color:var(--nixie);text-shadow:0 0 9px var(--nixie-glow)}#hud .hud-b{color:var(--neon);text-shadow:0 0 9px var(--neon-glow)}#countdown.go{color:#fff;text-shadow:0 0 12px var(--neon-glow),0 0 34px var(--neon-glow)}#countdown.fight{color:var(--nixie);text-shadow:0 0 14px var(--nixie-glow),0 0 40px var(--nixie-glow)}.vs-a{text-shadow:0 0 16px var(--nixie-glow)}.vs-b{text-shadow:0 0 16px var(--neon-glow)}.vs-mid{color:var(--neon);text-shadow:0 0 24px var(--neon-glow)}#sound-toggle{background:linear-gradient(150deg,#2b3036,#15181c);border:1px solid var(--edge);box-shadow:inset 0 1px #ffffff1a,0 0 12px #285a784d}.recap-crown{font-size:clamp(42px,8vw,66px);line-height:1;margin-bottom:2px;filter:drop-shadow(0 0 16px rgba(255,180,80,.75));animation:crownPop .6s cubic-bezier(.22,1,.36,1) both}@keyframes crownPop{0%{opacity:0;transform:scale(0) rotate(-25deg)}to{opacity:1;transform:none}}.recap-stats{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin:4px 0 10px;font-size:13px;color:#aeb6bb}.recap-stats b{color:var(--neon);text-shadow:0 0 8px var(--neon-glow)}.recap-mvp{font-weight:800;margin-bottom:14px;letter-spacing:.3px;color:var(--nixie);text-shadow:0 0 10px var(--nixie-glow)}.recap-mvp .mvp-star{color:#ffd24a}.recap-mvp b{color:#fff}#footer{position:fixed;left:50%;bottom:14px;transform:translate(-50%);display:flex;align-items:stretch;pointer-events:none;z-index:7;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;font-weight:700;background:linear-gradient(150deg,#1e2227f0,#0c0e11f0);border:1px solid var(--edge);border-radius:10px;overflow:hidden;box-shadow:inset 0 1px #ffffff14,inset 0 -2px 5px #00000080,0 0 16px #285a7859}#footer .foot-cell{padding:6px 13px;color:var(--neon);text-shadow:0 0 7px var(--neon-glow);border-right:1px solid rgba(255,255,255,.07);letter-spacing:.6px;white-space:nowrap}#footer .foot-cell:last-child{border-right:none;color:var(--nixie);text-shadow:0 0 7px var(--nixie-glow)}@media (max-width: 560px){#footer{font-size:10px}#footer .foot-cell{padding:5px 8px}}.gl-brand{font-family:ui-monospace,JetBrains Mono,Fira Code,monospace;font-weight:800;letter-spacing:6px;font-size:clamp(18px,3.4vw,30px);background:linear-gradient(90deg,#a855f7,#00e0ff);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 14px rgba(124,77,255,.6));margin-bottom:4px}.foot-brand{background:linear-gradient(90deg,#a855f7,#00e0ff);-webkit-background-clip:text;background-clip:text;color:transparent!important;text-shadow:none!important;font-weight:800}.gl-hero{position:relative;display:inline-block;padding:14px;margin-bottom:8px;background:linear-gradient(135deg,#00e0ff 9px,transparent 9px) top left,linear-gradient(225deg,#a855f7 9px,transparent 9px) top right,linear-gradient(45deg,#30e868 9px,transparent 9px) bottom left,linear-gradient(315deg,#f0b020 9px,transparent 9px) bottom right;background-size:18px 18px;background-repeat:no-repeat}.gl-hero-glow{position:absolute;inset:-12%;pointer-events:none;filter:blur(8px);background:radial-gradient(circle,rgba(168,85,247,.55),transparent 70%)}.gl-hero-icon{position:relative;display:block;width:clamp(96px,15vw,148px);height:auto;filter:drop-shadow(0 0 16px rgba(0,224,255,.45))}.gl-tag{font-family:ui-monospace,JetBrains Mono,monospace;font-weight:800;letter-spacing:5px;font-size:clamp(30px,7vw,62px);line-height:1;color:#fff;margin-top:6px;text-shadow:0 2px 10px rgba(0,0,0,.75),0 0 24px rgba(124,77,255,.55)}.vs-card{display:flex;align-items:center;justify-content:center;gap:clamp(8px,2.4vw,26px);padding:22px clamp(18px,4vw,38px);position:relative;background:repeating-linear-gradient(118deg,rgba(255,255,255,.028) 0 1px,transparent 1px 3px),linear-gradient(152deg,#2c3036,#15181c);border:1px solid #41474f;border-radius:18px;box-shadow:inset 0 1px #ffffff24,inset 0 -3px 8px #0000008c,0 24px 64px #000000b3,0 0 44px #785ac847;animation:vsCardIn .5s cubic-bezier(.22,1,.36,1) both}@keyframes vsCardIn{0%{opacity:0;transform:scale(.82) translateY(10px)}to{opacity:1;transform:none}}.vs-side{font-size:clamp(24px,5vw,54px);font-weight:900;text-align:center;line-height:1;max-width:6em}.vs-mid{display:flex;align-items:center;justify-content:center;width:clamp(54px,11vw,104px);height:clamp(54px,11vw,104px);border-radius:50%;font-size:clamp(26px,6vw,56px);font-weight:900;color:#fff;flex:none;background:radial-gradient(circle,#e0892b4d,#00000073);border:2px solid var(--accent);box-shadow:0 0 26px var(--nixie-glow),inset 0 0 18px #e0892b59;text-shadow:0 0 18px var(--nixie-glow)}@media (max-width: 760px){#letterbox.on:before,#letterbox.on:after{height:0}#vignette{box-shadow:inset 0 0 110px 8px #0000004d}#sound-toggle{top:calc(12px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right))}#hud{top:calc(12px + env(safe-area-inset-top))}#hud .hud-a,#hud .hud-b{white-space:nowrap}#footer{flex-wrap:wrap;justify-content:center;row-gap:4px;padding-bottom:calc(6px + env(safe-area-inset-bottom))}}.recap-collapse{position:absolute;top:10px;right:12px;z-index:2;width:30px;height:30px;border-radius:8px;border:1px solid var(--edge);cursor:pointer;background:linear-gradient(150deg,#2b3036,#15181c);color:#cfd6dd;font-size:17px;line-height:1}.recap-reopen{position:fixed;bottom:20px;left:50%;transform:translate(-50%);z-index:12;display:none;pointer-events:auto;cursor:pointer;font-weight:800;font-size:15px;color:#fff;padding:12px 22px;border-radius:12px;border:1px solid var(--edge);background:linear-gradient(150deg,#343a42,#1c2026);box-shadow:inset 0 1px #ffffff1f,0 6px 20px #00000080,0 0 18px #49d2ff59}#ui.result-collapsed .panel.result{display:none}#ui.result-collapsed .recap-reopen{display:block}:root{--grain: .6;--specks: .5}#grain,#grain-specks{position:fixed;inset:-50%;width:200%;height:200%;pointer-events:none;mix-blend-mode:overlay;will-change:transform}#grain{z-index:2147483646;opacity:var(--grain);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='2.6' intercept='-0.8'/%3E%3CfeFuncG type='linear' slope='2.6' intercept='-0.8'/%3E%3CfeFuncB type='linear' slope='2.6' intercept='-0.8'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:90px 90px;animation:grainShift .5s steps(1) infinite}#grain-specks{z-index:2147483647;opacity:var(--specks);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='s'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.5' numOctaves='1' seed='8' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='discrete' tableValues='.5 .5 .5 .5 .5 .5 .5 .5 .5 .5 .5 .5 .5 0 1 .5'/%3E%3CfeFuncG type='discrete' tableValues='.5 .5 .5 .5 .5 .5 .5 .5 .5 .5 .5 .5 .5 0 1 .5'/%3E%3CfeFuncB type='discrete' tableValues='.5 .5 .5 .5 .5 .5 .5 .5 .5 .5 .5 .5 .5 0 1 .5'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23s)'/%3E%3C/svg%3E");background-size:240px 240px;animation:grainShift .28s steps(1) infinite reverse}@keyframes grainShift{0%{transform:translate(0)}10%{transform:translate(-3%,-4%)}20%{transform:translate(3%,2%)}30%{transform:translate(-4%,3%)}40%{transform:translate(2%,-3%)}50%{transform:translate(-2%,4%)}60%{transform:translate(4%,-1%)}70%{transform:translate(-3%,-3%)}80%{transform:translate(1%,4%)}90%{transform:translate(-4%,-2%)}to{transform:translate(0)}}@media (prefers-reduced-motion: reduce){#grain,#grain-specks{animation:none}}
