:root{--bg-void:#0a0a0f;--bg-deep:#0e0e16;--surface-1:#1618228c;--surface-2:#1e212eb8;--surface-stroke:#ffffff14;--grid-line:#ffffff0b;--grid-line-strong:#ffffff17;--accent:#4de1ff;--accent-hot:#7c5cff;--accent-glow:#4de1ff73;--good:#46e5a0;--warn:#ffc24d;--spike:#ff7a3d;--danger:#ff4d6d;--text-hi:#f2f4ff;--text-mid:#aeb4c8;--text-lo:#6b7185;--text-on-accent:#07121a;--p-I:#22d3ee;--p-O:#fbd24b;--p-T:#a855f7;--p-S:#34d399;--p-Z:#fb5e6b;--p-J:#3b7bff;--p-L:#fb923c;--garbage:#565b6e;--ease-out-expo:cubic-bezier(.16, 1, .3, 1);--ease-out-back:cubic-bezier(.34, 1.56, .64, 1);--ease-snappy:cubic-bezier(.22, 1, .36, 1);--cta:linear-gradient(135deg, #4de1ff 0%, #7c5cff 100%);--radius:14px;--radius-sm:8px;--font-ui:"Space Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%}body{background:radial-gradient(120% 120% at 50% 0%, var(--bg-deep), var(--bg-void));min-height:100svh;color:var(--text-hi);font-family:var(--font-ui);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;margin:0;font-size:16px;line-height:1.45;overflow:hidden}#root{height:100%}button{cursor:pointer;font-family:inherit}.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.gv-root{flex-direction:column;height:100%;display:flex;overflow:hidden}.gv-topbar{flex:none;justify-content:space-between;align-items:center;padding:10px 16px;display:flex}.gv-mode{color:var(--text-lo);letter-spacing:.18em;font-size:12px}.gv-stage{flex:auto;justify-content:center;align-items:center;gap:clamp(10px,1.6vw,22px);min-height:0;padding:0 16px 16px;display:flex}.gv-rail{flex-direction:column;flex:none;align-items:center;gap:12px;width:clamp(124px,14vw,168px);min-width:0;display:flex}.gv-slot-label{letter-spacing:.14em;color:var(--text-mid);text-align:center;width:100%;font-size:11px}.gv-slot{aspect-ratio:1;background:var(--surface-1);border:1px solid var(--surface-stroke);border-radius:var(--radius);-webkit-backdrop-filter:blur(14px)saturate(140%);backdrop-filter:blur(14px)saturate(140%)}.gv-hold{width:clamp(82px,11vh,116px)}.gv-next{width:clamp(54px,8.2vh,90px)}.gv-next-0{border-color:#4de1ff40}.gv-next-1,.gv-next-2,.gv-next-3,.gv-next-4{opacity:.78}.gv-board-wrap{flex:none;justify-content:center;align-items:center;display:flex;position:relative}.gv-board{border-radius:var(--radius-sm);box-shadow:0 0 0 1px var(--surface-stroke), 0 18px 60px #0000008c;background:#08080d99;display:block}.gv-danger{background:#ffffff0d;border-radius:3px;flex-direction:column-reverse;width:6px;display:flex;position:absolute;top:0;bottom:0;left:-14px;overflow:hidden}.gv-danger-fill{width:100%;transition:height .18s var(--ease-snappy), background .2s linear;box-shadow:0 0 10px}.gv-overlay{z-index:5;border-radius:var(--radius-sm);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.gv-glass{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#08080d8c}.gv-count{color:var(--accent);text-shadow:0 0 40px var(--accent-glow);animation:gv-pop .7s var(--ease-out-back);font-size:clamp(64px,14vh,130px);font-weight:700}@keyframes gv-pop{0%{opacity:0;transform:scale(1.5)}40%{opacity:1}to{opacity:.85;transform:scale(1)}}.gv-panel{background:var(--surface-2);border:1px solid var(--surface-stroke);border-radius:var(--radius);text-align:center;flex-direction:column;align-items:center;gap:12px;min-width:220px;padding:28px 34px;display:flex}.gv-panel h2{margin:0;font-size:26px;font-weight:700}.gv-panel p{color:var(--text-mid);margin:0;font-size:22px}.gv-over-danger h2{color:var(--danger)}.gv-over-good h2{color:var(--good)}.gv-wait,.gv-panel .gv-wait{color:var(--text-lo);font-size:13px}.gv-rank{color:var(--accent);letter-spacing:.04em;margin:0;font-size:14px}.gv-flashes{pointer-events:none;z-index:6;flex-direction:column;align-items:center;gap:6px;display:flex;position:absolute;top:18%;left:50%;transform:translate(-50%)}.gv-flash{letter-spacing:.02em;animation:gv-flash .85s var(--ease-out-back) forwards;text-shadow:0 0 18px;font-size:clamp(20px,3.4vh,34px);font-weight:700}.gv-flash-accent{color:var(--accent)}.gv-flash-hot{color:var(--accent-hot)}.gv-flash-good{color:var(--good)}.gv-flash-warn{color:var(--warn)}@keyframes gv-flash{0%{opacity:0;transform:scale(.6)}35%{opacity:1;transform:scale(1.06)}to{opacity:0;transform:scale(1)}}.gv-opponents{flex-flow:column wrap;align-content:flex-start;gap:12px;width:clamp(90px,12vw,150px);max-height:80vh;display:flex}.gv-opp{flex-direction:column;gap:4px;display:flex}.gv-opp-board{border:1px solid var(--surface-stroke);background:#08080d80;border-radius:6px;width:100%}.gv-opp-dead .gv-opp-board{border-color:var(--danger)}.gv-opp-name{color:var(--text-mid);justify-content:space-between;font-size:11px;display:flex}.gv-opp-nm{text-overflow:ellipsis;white-space:nowrap;max-width:70%;overflow:hidden}.gv-opp-lines{color:var(--accent)}@media (prefers-reduced-motion:reduce){.gv-count,.gv-flash{opacity:1;animation:none}}.screen{width:min(960px,100%);color:var(--text-hi);flex-direction:column;gap:28px;margin:0 auto;padding:clamp(20px,4vw,48px);display:flex}.screen-head{align-items:center;gap:16px;display:flex}.screen-title{font-family:var(--font-ui);letter-spacing:-.01em;margin:0;font-size:clamp(20px,3vw,28px);font-weight:600}.back-link{appearance:none;border:1px solid var(--surface-stroke);background:var(--surface-1);color:var(--text-mid);font:inherit;cursor:pointer;transition:color .18s var(--ease-snappy), border-color .18s var(--ease-snappy);border-radius:999px;padding:6px 12px;font-size:13px}.back-link:hover{color:var(--text-hi);border-color:var(--accent-glow)}.glass{background:var(--surface-1);border:1px solid var(--surface-stroke);border-radius:var(--radius);-webkit-backdrop-filter:blur(18px)saturate(1.2)}.panel{padding:clamp(18px,2.4vw,28px)}.panel-title{font-family:var(--font-ui);margin:0 0 4px;font-size:16px;font-weight:600}.panel-sub{color:var(--text-lo);margin:0;font-size:13px}.muted{color:var(--text-lo);font-weight:400}.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}.btn{--btn-bg:var(--surface-2);appearance:none;border:1px solid var(--surface-stroke);border-radius:var(--radius-sm);background:var(--btn-bg);min-height:46px;color:var(--text-hi);font-family:var(--font-ui);letter-spacing:.01em;cursor:pointer;transition:transform .16s var(--ease-snappy), box-shadow .2s var(--ease-snappy), border-color .2s var(--ease-snappy), filter .16s var(--ease-snappy);justify-content:center;align-items:center;padding:0 22px;font-size:15px;font-weight:600;display:inline-flex;position:relative}.btn-label{z-index:1;position:relative}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:active:not(:disabled){filter:brightness(.96);transform:translateY(0)}.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:var(--cta);color:var(--text-on-accent);border-color:#0000}.btn-primary:hover:not(:disabled){box-shadow:0 8px 30px -8px var(--accent-glow)}.btn-ghost{background:var(--surface-1);color:var(--text-hi)}.btn-ghost:hover:not(:disabled){border-color:var(--accent-glow);color:var(--text-hi)}.btn-danger{background:color-mix(in srgb, var(--danger) 16%, transparent);border-color:color-mix(in srgb, var(--danger) 50%, transparent);color:var(--danger)}.btn-danger:hover:not(:disabled){background:color-mix(in srgb, var(--danger) 26%, transparent)}.piece-glyph{gap:2px;line-height:0;display:inline-grid}.pg-cell{background:0 0;border-radius:14%}.pg-on{background:var(--pg-color);box-shadow:inset 0 1px #ffffff52,inset 0 -2px 3px #00000052}.piece-glyph-glow .pg-on{box-shadow:inset 0 1px 0 #ffffff52, inset 0 -2px 3px #00000052, 0 0 12px color-mix(in srgb, var(--pg-color) 70%, transparent)}.drop-in{animation:drop-in .5s var(--ease-out-back) both;animation-delay:calc(var(--i,0) * 60ms)}@keyframes drop-in{0%{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:none}}.landing{text-align:center;justify-content:center;align-items:center;gap:0;min-height:100%;position:relative}.landing-hero{flex-direction:column;align-items:center;gap:14px;padding:clamp(40px,8vh,96px) 0;display:flex}.landing-chip{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.18em;color:var(--accent);border:1px solid color-mix(in srgb, var(--accent) 30%, var(--surface-stroke));background:color-mix(in srgb, var(--accent) 8%, transparent);border-radius:999px;padding:5px 14px;font-size:11px}.wordmark{font-family:var(--font-ui);letter-spacing:-.04em;color:var(--text-hi);background:linear-gradient(180deg, #fff 0%, var(--accent) 130%);-webkit-text-fill-color:transparent;text-shadow:0 0 48px var(--accent-glow);-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(64px,15vw,148px);font-weight:700;line-height:.9}.tagline{color:var(--text-mid);letter-spacing:.02em;margin:0;font-size:clamp(14px,2vw,18px)}.landing-cta{flex-wrap:wrap;justify-content:center;gap:14px;margin-top:24px;display:flex}.landing-cta .btn-primary{min-width:200px;min-height:58px;box-shadow:0 10px 36px -10px var(--accent-glow);font-size:17px}.landing-cta .btn-primary:hover:not(:disabled){box-shadow:0 14px 44px -8px var(--accent-glow)}.landing-stats{letter-spacing:.16em;color:var(--text-lo);margin:18px 0 0;font-size:12px}.landing-foot{color:var(--text-lo);letter-spacing:.02em;align-items:center;gap:8px;font-size:12px;display:flex;position:absolute;bottom:clamp(12px,4vh,32px)}.landing-foot .dot{background:var(--good);width:6px;height:6px;box-shadow:0 0 8px var(--good);border-radius:50%}.landing-bg{pointer-events:none;z-index:-1;position:absolute;inset:0;overflow:hidden}.drift{top:-60px;left:calc(8% + var(--i) * 12%);opacity:.05;width:56px;height:56px;animation:26s linear infinite drift-fall;animation-delay:calc(var(--i) * -3.4s);border-radius:6px;position:absolute}.drift-I{background:var(--p-I)}.drift-O{background:var(--p-O)}.drift-T{background:var(--p-T)}.drift-S{background:var(--p-S)}.drift-Z{background:var(--p-Z)}.drift-J{background:var(--p-J)}.drift-L{background:var(--p-L)}@keyframes drift-fall{0%{transform:translateY(0)rotate(0)}to{transform:translateY(120vh)rotate(220deg)}}.modeselect{justify-content:center;gap:clamp(28px,5vh,48px);min-height:100%;position:relative}.modeselect-back,.createjoin-back{position:absolute;top:clamp(20px,4vw,48px);left:clamp(20px,4vw,48px)}.modeselect-head,.createjoin-head{text-align:center;flex-direction:column;align-items:center;gap:8px;display:flex}.mode-eyebrow{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.2em;color:var(--accent);font-size:12px}.modeselect-title,.createjoin-title{font-family:var(--font-ui);letter-spacing:-.02em;margin:0;font-size:clamp(28px,5vw,52px);font-weight:700;line-height:1.02}.mode-grid{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}@media (width<=760px){.mode-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}.mode-card{appearance:none;text-align:left;border:1px solid var(--surface-stroke);border-radius:var(--radius);background:var(--surface-1);-webkit-backdrop-filter:blur(18px)saturate(1.2);min-height:clamp(280px,44vh,400px);color:var(--text-hi);cursor:pointer;transition:transform .22s var(--ease-snappy), box-shadow .24s var(--ease-snappy), border-color .24s var(--ease-snappy);flex-direction:column;justify-content:space-between;gap:18px;padding:clamp(20px,2.4vw,28px);display:flex}.mode-card:hover{border-color:var(--accent-glow);box-shadow:0 22px 56px -22px var(--accent-glow);transform:translateY(-4px)scale(1.02)}.mode-card:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.mode-card-accent{background:linear-gradient(160deg, color-mix(in srgb, var(--accent-hot) 16%, var(--surface-1)), var(--surface-1));border-color:color-mix(in srgb, var(--accent-hot) 32%, var(--surface-stroke))}.mode-card-accent:hover{border-color:color-mix(in srgb, var(--accent-hot) 55%, transparent);box-shadow:0 22px 56px -22px color-mix(in srgb, var(--accent-hot) 60%, transparent)}.mode-glyph{filter:saturate()brightness();transition:filter .22s var(--ease-snappy), transform .22s var(--ease-snappy);display:inline-flex}.mode-card:hover .mode-glyph{filter:brightness(1.25)}.mode-body{flex-direction:column;gap:8px;display:flex}.mode-kicker{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.16em;color:var(--accent);font-size:11px}.mode-kicker-online{color:var(--accent-hot)}.mode-name{font-family:var(--font-ui);letter-spacing:-.01em;font-size:clamp(22px,2.6vw,28px);font-weight:700}.mode-desc{color:var(--text-mid);font-size:14px;line-height:1.45}.mode-stat{letter-spacing:.08em;text-transform:uppercase;color:var(--text-lo);justify-content:space-between;align-items:center;gap:8px;font-size:11px;display:flex}.mode-arrow{color:var(--accent);transition:transform .22s var(--ease-snappy);font-size:16px}.mode-card-accent .mode-arrow{color:var(--accent-hot)}.mode-card:hover .mode-arrow{transform:translate(5px)}.createjoin{justify-content:center;gap:clamp(24px,4vh,40px);min-height:100%;position:relative}.cj-panels{grid-template-columns:1.1fr .9fr;align-items:start;gap:18px;display:grid}@media (width<=760px){.cj-panels{grid-template-columns:1fr}}.cj-create,.cj-join{flex-direction:column;gap:16px;display:flex}.cj-accentline{position:relative;overflow:hidden}.cj-accentline:before{content:"";background:var(--cta);opacity:.85;height:2px;position:absolute;inset:0 0 auto}.mode-pick-group{grid-template-columns:1fr 1fr;gap:10px;display:grid}.mode-pick{appearance:none;text-align:left;border:1px solid var(--surface-stroke);border-radius:var(--radius-sm);background:var(--surface-1);color:var(--text-mid);cursor:pointer;transition:transform .16s var(--ease-snappy), border-color .18s var(--ease-snappy), box-shadow .18s var(--ease-snappy), background .18s var(--ease-snappy), color .18s var(--ease-snappy);flex-direction:column;gap:6px;padding:14px;display:flex;position:relative}.mode-pick:hover{transform:translateY(-2px)}.mode-pick:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.mode-pick-glyph{display:inline-flex}.mode-pick-name{font-family:var(--font-ui);color:var(--text-hi);font-size:15px;font-weight:600}.mode-pick-sub{letter-spacing:.06em;text-transform:uppercase;color:var(--text-lo);font-size:11px}.mode-pick-check{border:1px solid var(--surface-stroke);width:14px;height:14px;transition:background .18s var(--ease-snappy), border-color .18s var(--ease-snappy), box-shadow .18s var(--ease-snappy);background:0 0;border-radius:50%;position:absolute;top:10px;right:10px}.mode-pick-on .mode-pick-check{border-color:#0000}.mode-pick-versus.mode-pick-on{border-color:var(--accent-hot);background:color-mix(in srgb, var(--accent-hot) 12%, var(--surface-1));box-shadow:inset 0 0 0 1px var(--accent-hot), 0 0 22px -6px var(--accent-hot)}.mode-pick-versus.mode-pick-on .mode-pick-check{background:var(--accent-hot);box-shadow:0 0 8px var(--accent-hot)}.mode-pick-sprint.mode-pick-on{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, var(--surface-1));box-shadow:inset 0 0 0 1px var(--accent), 0 0 22px -6px var(--accent)}.mode-pick-sprint.mode-pick-on .mode-pick-check{background:var(--accent);box-shadow:0 0 8px var(--accent)}.mode-toggle{border:1px solid var(--surface-stroke);border-radius:var(--radius-sm);background:#00000040;gap:4px;padding:4px;display:inline-flex}.seg{appearance:none;color:var(--text-mid);font:inherit;cursor:pointer;transition:background .18s var(--ease-snappy), color .18s var(--ease-snappy);background:0 0;border:none;border-radius:6px;padding:8px 18px;font-size:14px;font-weight:600}.seg-on{background:var(--cta);color:var(--text-on-accent)}.mode-blurb{color:var(--text-mid);min-height:2.6em;margin:0;font-size:13px;line-height:1.5}.cj-caption{letter-spacing:.04em;color:var(--text-lo);margin:-6px 0 0;font-size:11px}.cj-join-field{flex-direction:column;gap:10px;display:flex}.cj-code-label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.16em;color:var(--text-lo);font-size:11px}.code-input{gap:8px;display:flex}.code-box{aspect-ratio:3/4;text-align:center;text-transform:uppercase;width:100%;min-width:0;font-family:var(--font-mono);color:var(--text-hi);border:1px solid var(--surface-stroke);border-radius:var(--radius-sm);caret-color:var(--accent);transition:border-color .16s var(--ease-snappy), box-shadow .16s var(--ease-snappy), background .16s var(--ease-snappy);background:#0000004d;font-size:clamp(20px,5vw,28px);font-weight:600}.code-box:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow);outline:none}.code-input-ready .code-box{border-color:color-mix(in srgb, var(--good) 55%, transparent);background:color-mix(in srgb, var(--good) 8%, #0000004d)}.code-input-ready .code-box:focus{border-color:var(--good);box-shadow:0 0 0 3px color-mix(in srgb, var(--good) 40%, transparent)}.form-error{color:var(--danger);margin:0;font-size:13px}.lobby-body{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:18px;display:grid}@media (width<=720px){.lobby-body{grid-template-columns:1fr}}.lobby-code{flex-direction:column;gap:14px;display:flex}.code-display{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.code-text{font-family:var(--font-mono);letter-spacing:.22em;color:var(--text-hi);text-shadow:0 0 28px var(--accent-glow);font-size:clamp(34px,7vw,52px);font-weight:700}.copy-btn{appearance:none;border:1px solid var(--surface-stroke);background:var(--surface-2);color:var(--text-mid);font:inherit;cursor:pointer;transition:color .16s var(--ease-snappy), border-color .16s var(--ease-snappy);border-radius:999px;padding:8px 14px;font-size:12px}.copy-btn:hover{color:var(--text-hi);border-color:var(--accent-glow)}.lobby-meta{align-items:center;gap:12px;display:flex}.mode-pill{text-transform:uppercase;letter-spacing:.14em;border:1px solid var(--surface-stroke);border-radius:999px;padding:4px 10px;font-size:11px;font-weight:700}.mode-pill-versus{color:var(--accent-hot);background:color-mix(in srgb, var(--accent-hot) 14%, transparent)}.mode-pill-sprint{color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, transparent)}.ready-status{color:var(--text-mid);font-size:13px}.lobby-players{flex-direction:column;gap:12px;display:flex}.player-list{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex}.player-row{border-radius:var(--radius-sm);transition:background .16s var(--ease-snappy);align-items:center;gap:12px;padding:10px 12px;display:flex}.player-me{background:color-mix(in srgb, var(--accent) 9%, transparent)}.ready-pip{background:var(--text-lo);width:10px;height:10px;transition:background .2s var(--ease-snappy), box-shadow .2s var(--ease-snappy);border-radius:50%;flex:none}.ready-pip-on{background:var(--good);box-shadow:0 0 10px var(--good)}.player-name{text-overflow:ellipsis;white-space:nowrap;flex:1;font-weight:500;overflow:hidden}.player-name-edit{min-width:0;font-family:var(--font-ui);color:var(--text-hi);border:none;border-bottom:1px dashed color-mix(in srgb, var(--accent) 45%, transparent);caret-color:var(--accent);transition:background .16s var(--ease-snappy), border-color .16s var(--ease-snappy);background:0 0;flex:1;padding:2px 2px 3px;font-size:15px;font-weight:500}.player-name-edit:hover{background:color-mix(in srgb, var(--accent) 8%, transparent)}.player-name-edit:focus{background:color-mix(in srgb, var(--accent) 12%, transparent);border-bottom-color:var(--accent);outline:none}.host-tag,.you-tag{text-transform:uppercase;letter-spacing:.12em;border-radius:999px;flex:none;padding:2px 7px;font-size:10px}.host-tag{color:var(--warn);background:color-mix(in srgb, var(--warn) 16%, transparent)}.you-tag{color:var(--accent);background:color-mix(in srgb, var(--accent) 16%, transparent);margin-left:8px}.lobby-actions,.results-actions{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.hud{width:100%;color:var(--text-hi);flex-direction:column;gap:12px;padding:16px;display:flex}.hud-stat{flex-direction:column;gap:2px;min-width:0;display:flex}.hud-row{gap:16px;display:flex}.hud-row .hud-stat{flex:1;min-width:0}.hud-label{text-transform:uppercase;letter-spacing:.16em;color:var(--text-lo);font-size:10px}.hud-value{color:var(--text-hi);font-size:30px;font-weight:700;line-height:1.05}.hud-value-sm{font-size:18px;font-weight:600}.hud-sep{color:var(--text-lo);font-weight:400}.hud-time{letter-spacing:.02em}.hud-badges{flex-wrap:wrap;gap:8px;min-height:26px;display:flex}.badge{border:1px solid #0000;border-radius:999px;align-items:center;gap:4px;padding:4px 9px;font-size:13px;font-weight:700;display:inline-flex}.badge-tag{text-transform:uppercase;letter-spacing:.12em;opacity:.8;font-size:9px}.badge-combo{color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, transparent);border-color:color-mix(in srgb, var(--accent) 30%, transparent)}.badge-b2b{color:var(--accent-hot);background:color-mix(in srgb, var(--accent-hot) 16%, transparent);border-color:color-mix(in srgb, var(--accent-hot) 34%, transparent)}.badge-incoming{color:var(--spike);background:color-mix(in srgb, var(--spike) 14%, transparent);border-color:color-mix(in srgb, var(--spike) 32%, transparent)}.results{align-items:stretch}.winner-banner{border-radius:var(--radius);text-align:center;border:1px solid var(--surface-stroke);background:linear-gradient(160deg, color-mix(in srgb, var(--accent-hot) 12%, var(--surface-1)), var(--surface-1));flex-direction:column;align-items:center;gap:4px;padding:28px;display:flex}.winner-banner.winner-me{border-color:var(--accent-glow);box-shadow:0 16px 50px -20px var(--accent-glow)}.winner-kicker{text-transform:uppercase;letter-spacing:.18em;color:var(--accent);font-size:12px}.winner-name{font-family:var(--font-ui);letter-spacing:-.01em;font-size:clamp(24px,5vw,38px);font-weight:700}.results-panel{overflow-x:auto}.placement-table{border-collapse:collapse;width:100%;font-size:14px}.placement-table th{text-align:left;text-transform:uppercase;letter-spacing:.14em;color:var(--text-lo);border-bottom:1px solid var(--surface-stroke);padding:0 12px 12px;font-size:10px;font-weight:600}.placement-table td{border-bottom:1px solid var(--grid-line);padding:12px}.placement-table tbody tr:last-child td{border-bottom:none}.col-num{text-align:right}.col-place{white-space:nowrap;width:1%;color:var(--text-mid);font-weight:700}.placement-table tbody tr:first-child .col-place{color:var(--warn)}.col-name{font-weight:500}.row-me{background:color-mix(in srgb, var(--accent) 8%, transparent)}.leaderboard{width:min(680px,100%)}.lb-tabs{grid-template-columns:1fr 1fr;gap:10px;display:grid}.lb-tab{appearance:none;border:1px solid var(--surface-stroke);border-radius:var(--radius-sm);background:var(--surface-1);color:var(--text-mid);font-family:var(--font-ui);cursor:pointer;transition:border-color .16s var(--ease-snappy), color .16s var(--ease-snappy), background .16s var(--ease-snappy);flex-direction:column;align-items:center;gap:2px;padding:12px;font-size:15px;font-weight:600;display:flex}.lb-tab:hover{color:var(--text-hi)}.lb-tab-on{color:var(--text-hi);border-color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, transparent)}.lb-tab-sub{text-transform:uppercase;letter-spacing:.14em;color:var(--text-lo);font-size:10px}.lb-panel{min-height:220px}.lb-empty{text-align:center;color:var(--text-lo);margin:0;padding:40px 0}.lb-list{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.lb-row{border-bottom:1px solid var(--grid-line);grid-template-columns:44px 1fr auto;align-items:center;gap:12px;padding:10px 8px;display:grid}.lb-row:last-child{border-bottom:none}.lb-top{background:color-mix(in srgb, var(--accent) 5%, transparent)}.lb-place{text-align:center;color:var(--text-lo);font-weight:700}.lb-top-1 .lb-place{color:#ffd35a}.lb-top-2 .lb-place{color:#cbd2e0}.lb-top-3 .lb-place{color:#e0a06a}.lb-name{text-overflow:ellipsis;white-space:nowrap;font-weight:500;overflow:hidden}.lb-value{color:var(--accent);font-size:15px;font-weight:700}.modal-backdrop{z-index:50;-webkit-backdrop-filter:blur(6px);animation:fade-in .18s var(--ease-out-expo);background:#05060ca8;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal{width:min(720px,100%);max-height:86vh;animation:pop-in .22s var(--ease-out-back);padding:clamp(20px,3vw,32px);overflow-y:auto}.modal-head{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.modal-title{font-family:var(--font-ui);margin:0;font-size:22px;font-weight:700}.modal-close{appearance:none;border:1px solid var(--surface-stroke);background:var(--surface-2);color:var(--text-mid);cursor:pointer;width:34px;height:34px;transition:color .16s var(--ease-snappy), border-color .16s var(--ease-snappy);border-radius:8px;font-size:14px}.modal-close:hover{color:var(--text-hi);border-color:var(--accent-glow)}.howto-cols{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px;display:grid}.howto-sub{text-transform:uppercase;letter-spacing:.14em;color:var(--accent);margin:0 0 12px;font-size:13px}.kv-list{flex-direction:column;gap:10px;margin:0;display:flex}.kv-row{grid-template-columns:96px 1fr;align-items:baseline;gap:12px;display:grid}.kv-row dd{color:var(--text-mid);margin:0;font-size:13px;line-height:1.4}.kv-row-rule{grid-template-columns:120px 1fr}.rule-name{color:var(--text-hi);font-size:13px;font-weight:600}.key{font-family:var(--font-mono);color:var(--text-hi);border:1px solid var(--surface-stroke);white-space:nowrap;background:#00000059;border-bottom-width:2px;border-radius:6px;padding:3px 8px;font-size:12px;display:inline-block}@keyframes fade-in{0%{opacity:0}}@keyframes pop-in{0%{opacity:0;transform:translateY(8px)scale(.98)}}@media (prefers-reduced-motion:reduce){*,.btn,.mode-card,.drift,.modal,.modal-backdrop,.drop-in,.app-avatar{transition-duration:.01ms!important;animation:none!important}.drop-in{animation:.01ms both drop-in!important}.btn:hover:not(:disabled),.mode-card:hover,.mode-card:hover .mode-glyph,.mode-card:hover .mode-arrow,.mode-pick:hover{transform:none}}.app-center{justify-content:center;align-items:center;height:100%;display:flex}.app-connecting{color:var(--text-mid);letter-spacing:.08em;font-size:18px}.app-mp{flex-direction:column;justify-content:safe center;align-items:center;gap:18px;height:100%;padding:clamp(16px,4vh,40px) 24px;display:flex;overflow-y:auto}.app-name{background:var(--surface-1);border:1px solid var(--surface-stroke);-webkit-backdrop-filter:blur(18px)saturate(1.2);width:100%;max-width:360px;transition:border-color .18s var(--ease-snappy), box-shadow .18s var(--ease-snappy);border-radius:999px;align-items:center;gap:10px;margin-top:4px;padding:8px 14px 8px 8px;display:flex}.app-name:focus-within{border-color:var(--accent-glow);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent)}.app-avatar{background:var(--p-I);width:30px;height:30px;box-shadow:inset 0 1px 0 #ffffff4d, inset 0 -2px 4px #00000052, 0 0 14px color-mix(in srgb, var(--p-I) 60%, transparent);animation:app-avatar-pulse 2.6s var(--ease-snappy) infinite;border-radius:8px;flex:none}.app-name-tag{font-family:var(--font-mono);letter-spacing:.16em;color:var(--text-lo);flex:none;font-size:10px}.app-name input{min-width:0;font-family:var(--font-mono);color:var(--text-hi);caret-color:var(--accent);background:0 0;border:none;flex:1;padding:6px 4px;font-size:16px}.app-name input:focus{outline:none}@keyframes app-avatar-pulse{0%,to{box-shadow:inset 0 1px 0 #ffffff4d, inset 0 -2px 4px #00000052, 0 0 12px color-mix(in srgb, var(--p-I) 45%, transparent)}50%{box-shadow:inset 0 1px 0 #ffffff4d, inset 0 -2px 4px #00000052, 0 0 20px color-mix(in srgb, var(--p-I) 80%, transparent)}}