@import "https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&family=JetBrains+Mono:wght@500;700&display=swap";:root{--bg-deep:#06080d;--bg-panel:#12161f;--bg-panel-2:#181e2a;--bg-panel-edge:#2a3344;--text:#eef2f8;--text-dim:#8b95a8;--accent:#4aa3ff;--accent-bright:#7ec4ff;--accent-soft:#4aa3ff24;--accent-glow:#4aa3ff59;--grid:#1a1f2b;--danger:#ff5c7a;--ok:#3dd68c;--warn:#f5b942;--team-red:#f87171;--team-blue:#60a5fa;--cell:30px;--radius:12px;--radius-sm:8px;--ease:cubic-bezier(.22, 1, .36, 1);--ease-out:cubic-bezier(.16, 1, .3, 1);--shadow-card:0 14px 40px #00000061;--shadow-lift:0 22px 48px #00000073, 0 0 0 1px #4aa3ff1f;--surface:linear-gradient(165deg, #1a202ef7 0%, #0c0f16fa 100%);--focus-ring:0 0 0 2px var(--bg-deep), 0 0 0 4px var(--accent);--space-1:.35rem;--space-2:.65rem;--space-3:1rem;--space-4:1.5rem;--mode-solo:#4aa3ff;--mode-multi:#ff6b8a;--mode-config:#94a3b8;--mode-account:#2dd4bf;--mode-history:#f5b942;--mode-sprint:#38bdf8;--mode-cheese:#fb923c;--mode-survival:#f87171;--mode-blitz:#fbbf24;--mode-zen:#34d399;--mode-bots:#818cf8}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{color:var(--text);background:radial-gradient(ellipse 100% 70% at 50% -18%, #1c3a5c 0%, transparent 58%), radial-gradient(ellipse 55% 40% at 100% 20%, #2dd4bf12 0%, transparent 50%), radial-gradient(ellipse 50% 38% at 0% 85%, #ff6b8a0f 0%, transparent 45%), radial-gradient(ellipse 70% 45% at 50% 110%, #12101f 0%, transparent 52%), var(--bg-deep);-webkit-font-smoothing:antialiased;background-attachment:fixed;place-items:center;min-height:100dvh;font-family:Outfit,sans-serif;display:grid;overflow:hidden auto}body:before{content:"";pointer-events:none;z-index:0;opacity:.22;background-image:linear-gradient(#4aa3ff0b 1px,#0000 1px),linear-gradient(90deg,#4aa3ff0b 1px,#0000 1px);background-size:28px 28px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(70% 60% at 50% 40%,#000 20%,#0000 75%);mask-image:radial-gradient(70% 60% at 50% 40%,#000 20%,#0000 75%)}#app{z-index:1;flex-direction:column;align-items:center;gap:clamp(1rem,2.6vh,1.75rem);width:100%;max-width:1100px;margin:0 auto;padding:clamp(1rem,3.2vw,2.1rem);display:flex;position:relative}body:has(#screen-play:not(.hidden)){align-content:stretch;place-items:stretch center}body:has(#screen-play:not(.hidden)) #app{justify-content:stretch;gap:.45rem;max-width:1400px;min-height:100dvh;padding:clamp(.55rem,1.4vh,.9rem) clamp(.75rem,2vw,1.5rem) .55rem}body:has(#screen-play:not(.hidden)) .brand{display:none}#screen-play:not(.hidden){flex:1;justify-content:center;gap:.55rem;width:100%;min-height:calc(100dvh - 1.4rem)}#screen-play:not(.hidden) .play-arena{flex:auto;align-items:center;min-height:0}#screen-play:not(.hidden) #controls-hint{flex-shrink:0;margin-top:auto;padding-bottom:.2rem}.brand{text-align:center;-webkit-user-select:none;user-select:none;animation:brand-in .7s var(--ease-out) both;margin-bottom:.35rem}.brand h1{letter-spacing:.26em;background:linear-gradient(115deg,#d7ebff 0%,#4aa3ff 38%,#7ec4ff 68%,#b8dcff 100%);color:#0000;filter:drop-shadow(0 0 32px #4aa3ff52);-webkit-background-clip:text;background-clip:text;margin-left:.26em;font-size:clamp(2.75rem,9vw,4.35rem);font-weight:800;line-height:1}.tagline{letter-spacing:.46em;text-transform:uppercase;color:var(--text-dim);margin-top:.65rem;font-size:clamp(.68rem,1.5vw,.8rem);font-weight:500}@keyframes brand-in{0%{opacity:0;transform:translateY(-10px)scale(.98)}to{opacity:1;transform:none}}.playfield{grid-template-columns:auto auto auto auto;justify-content:center;align-items:stretch;gap:.75rem 1rem;display:grid}.panel{background:var(--bg-panel);border:1px solid var(--bg-panel-edge);border-radius:var(--radius);min-width:108px;padding:.55rem .65rem .7rem}.hold-panel,.next-panel{flex-direction:column;align-self:start;height:fit-content;display:flex}.panel-label,.stat-label{letter-spacing:.18em;color:var(--text-dim);text-align:center;margin-bottom:.2rem;font-size:.58rem;font-weight:600}.board-wrap{background:var(--bg-panel);border:1px solid var(--bg-panel-edge);border-radius:var(--radius);touch-action:none;-webkit-user-select:none;user-select:none;align-self:center;margin:0 16px;padding:4px;position:relative;box-shadow:0 0 0 1px #3d9eff1a,0 24px 64px #00000080,0 0 80px #4aa3ff14}#board-canvas{image-rendering:pixelated;aspect-ratio:1/2;background:#0d1018;width:auto;max-width:min(340px,100vw - 14rem);height:min(72dvh,680px);max-height:calc(100dvh - 6.5rem);display:block}#fx-canvas{pointer-events:none;z-index:3;width:calc(100% - 8px);height:calc(100% - 8px);position:absolute;top:4px;left:4px}.action-text.pop-big{color:#e0f2fe;font-size:1.6rem;animation:1s ease-out forwards action-pop-big}@keyframes action-pop-big{0%{opacity:0;transform:translate(-50%,-30%)scale(.6)}12%{opacity:1;transform:translate(-50%,-50%)scale(1.15)}65%{opacity:1}to{opacity:0;transform:translate(-50%,-85%)scale(1)}}#hold-canvas,#next-canvas{width:100%;max-width:104px;height:auto;margin:0 auto;display:block}#next-canvas{max-height:min(58dvh,520px)}.stats-panel{flex-direction:column;align-self:center;gap:.55rem;min-width:148px;max-width:168px;padding-top:.1rem;display:flex}.stats-primary{border-bottom:1px solid #232a38e6;flex-direction:column;gap:.4rem;padding-bottom:.45rem;display:flex}.stats-secondary{grid-template-columns:1fr 1fr;gap:.35rem .55rem;display:grid}.stats-secondary .stat-value{text-align:left;font-size:.92rem}.stats-secondary .stat-label{text-align:left;letter-spacing:.12em}.stat-value{text-align:right;color:var(--text);font-family:JetBrains Mono,monospace;font-size:1.12rem;font-weight:700;line-height:1.15}.stats-primary .stat-value{font-size:1.22rem}.overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#080a10c7;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;display:flex;position:absolute;inset:4px}.overlay.hidden{display:none}.overlay-title{letter-spacing:.2em;color:var(--text);font-size:1.75rem;font-weight:700}.overlay-title.danger{color:var(--danger)}.overlay-sub{color:var(--text-dim);letter-spacing:.04em;font-size:.8rem}.controls-hint{opacity:.88;flex-wrap:wrap;justify-content:center;align-items:center;gap:.4rem .55rem;max-width:min(920px,96vw);padding:.25rem .25rem .1rem;display:flex}.control-chip{white-space:nowrap;background:#0a0d14b8;border:1px solid #4aa3ff1f;border-radius:8px;align-items:center;gap:.4rem;padding:.28rem .55rem .28rem .35rem;display:inline-flex}.control-keys{align-items:center;gap:.22rem;display:inline-flex}.kbd{min-width:1.55rem;height:1.55rem;color:var(--text);letter-spacing:.02em;background:linear-gradient(#2a3344 0%,#1a2030 100%);border:1px solid #3a4558;border-bottom-width:2px;border-radius:5px;justify-content:center;align-items:center;padding:0 .35rem;font-family:JetBrains Mono,monospace;font-size:.68rem;font-weight:700;line-height:1;display:inline-flex;box-shadow:0 1px #00000059}.kbd-wide{letter-spacing:.04em;min-width:2.4rem;padding:0 .45rem;font-size:.62rem}.control-action{color:var(--text-dim);letter-spacing:.02em;font-size:.72rem;font-weight:600}@media (width<=720px){.play-arena{flex-direction:column;align-items:center}.playfield{order:1}.opponents{flex-flow:wrap;order:2;justify-content:center;max-width:100%;max-height:none}.playfield{grid-template-rows:auto auto auto;grid-template-columns:auto auto}.hold-panel{grid-area:1/1}.next-panel{grid-area:1/2}.board-wrap{grid-area:2/1/auto/-1;justify-self:center}.stats-panel{grid-area:3/1/auto/-1;align-self:stretch;min-width:0;max-width:none}.stats-primary{border-bottom:none;flex-flow:wrap;justify-content:center;gap:.65rem 1rem;padding-bottom:0}.stats-secondary{grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:.45rem .75rem}.stats-primary .stat-value,.stats-secondary .stat-value,.stat-value,.stats-secondary .stat-label,.stat-label{text-align:center}#board-canvas{max-width:min(280px,100vw - 2.5rem);height:min(58dvh,560px)}.board-wrap{margin:0 12px}}.hidden{display:none!important}.screen{flex-direction:column;align-items:center;gap:clamp(1rem,2.5vh,1.5rem);width:100%;display:flex}.menu-actions{flex-direction:column;gap:.75rem;width:100%;min-width:220px;display:flex}.menu-actions.row{flex-flow:wrap;justify-content:center}.btn{letter-spacing:.06em;border-radius:var(--radius-sm);border:1px solid var(--bg-panel-edge);background:var(--bg-panel-2);color:var(--text);cursor:pointer;transition:background .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease), color .2s var(--ease), box-shadow .2s var(--ease);padding:.72rem 1.3rem;font-family:inherit;font-size:.9rem;font-weight:600}.btn:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:0 8px 20px #00000040}.btn:focus-visible{box-shadow:var(--focus-ring);outline:none}.btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;transform:none}.btn-primary{border-color:var(--accent-bright);color:#f5f9ff;background:linear-gradient(#3568a0 0%,#1e3f66 100%);box-shadow:inset 0 1px #ffffff1f,0 8px 22px #286ebe47}.btn-primary:hover{background:linear-gradient(#3f78b4 0%,#244a74 100%);border-color:#a8d6ff}.btn-accent{border-color:var(--accent);background:linear-gradient(135deg,#1e3a5f,#1a2a48)}.btn-ghost{color:var(--text-dim);background:0 0;border-color:#0000}.btn-ghost:hover{color:var(--text);border-color:var(--bg-panel-edge);background:#ffffff0a}.btn-sm{padding:.42rem .75rem;font-size:.75rem}.form-panel{overscroll-behavior:contain;scrollbar-gutter:stable;border-radius:var(--radius);background:var(--surface);width:min(440px,94vw);max-height:calc(100dvh - 7.5rem);box-shadow:var(--shadow-card);scrollbar-width:thin;scrollbar-color:#3a4a66 transparent;animation:panel-in .4s var(--ease-out) both;border:1px solid #4aa3ff29;flex-direction:column;gap:1rem;padding:1.35rem 1.4rem 1.45rem;display:flex;overflow-y:auto}.form-panel::-webkit-scrollbar{width:8px}.form-panel::-webkit-scrollbar-track{background:0 0;margin:6px 0}.form-panel::-webkit-scrollbar-thumb{background:#2f3c54 padding-box padding-box;border:2px solid #0000;border-radius:999px}.form-panel::-webkit-scrollbar-thumb:hover{background:#4aa3ff padding-box padding-box;border:2px solid #0000}.form-panel::-webkit-scrollbar-button{width:0;height:0;display:none}#screen-mp-connect .menu-actions.row{margin-top:.15rem}.join-fields{border:1px solid var(--bg-panel-edge);background:#080a10a6;border-radius:8px;flex-direction:column;gap:.7rem;padding:.85rem .95rem;display:flex}.join-fields code{color:var(--accent);font-family:JetBrains Mono,monospace;font-size:.78rem}.adv-connect{color:var(--text-dim);font-size:.78rem}.adv-connect summary{cursor:pointer;letter-spacing:.04em;margin-bottom:.45rem}.adv-connect[open] summary{color:var(--text);margin-bottom:.65rem}.settings-actions{z-index:2;background:linear-gradient(#0e121a00 0%,#0e121aeb 28%,#0e121afc 55% 100%);border:none;border-radius:0;gap:.55rem;margin:.35rem 0 0;padding:.85rem 0 .1rem;position:sticky;bottom:-.15rem}.settings-actions .btn{letter-spacing:.1em;text-transform:uppercase;flex:1;min-width:0;padding:.7rem .85rem;font-size:.78rem}.settings-actions .btn-primary{flex:1.2}.settings-actions .btn-ghost{border-color:var(--bg-panel-edge);color:var(--text-dim)}.field{letter-spacing:.12em;color:var(--text-dim);text-transform:uppercase;flex-direction:column;gap:.4rem;font-size:.72rem;font-weight:500;display:flex}.field input{border-radius:var(--radius-sm);border:1px solid var(--bg-panel-edge);color:var(--text);letter-spacing:.03em;text-transform:none;transition:border-color .15s var(--ease), box-shadow .15s var(--ease);background:#0a0d14;padding:.68rem .8rem;font-family:JetBrains Mono,monospace;font-size:.95rem}.field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);outline:none}.mode-pick{flex-wrap:wrap;align-items:center;gap:.45rem;font-size:.88rem;display:flex}.field-label{letter-spacing:.18em;width:100%;color:var(--text-dim);text-transform:uppercase;margin-bottom:.15rem;font-size:.62rem;font-weight:600}.radio{color:var(--text);cursor:pointer;letter-spacing:.02em;transition:border-color .15s var(--ease), background .15s var(--ease), color .15s var(--ease), transform .15s var(--ease);background:#0a0d148c;border:1px solid #2a3344f2;border-radius:999px;align-items:center;gap:.35rem;padding:.42rem .72rem;font-size:.82rem;font-weight:500;display:inline-flex}.radio:hover{background:#4aa3ff14;border-color:#4aa3ff66}.radio:has(input:checked){border-color:var(--accent);background:var(--accent-soft);color:#e8f3ff;box-shadow:0 0 0 1px #4aa3ff1f}.radio input{appearance:none;cursor:pointer;width:.55rem;height:.55rem;transition:background .15s var(--ease), box-shadow .15s var(--ease);background:#3a4a66;border:none;border-radius:50%;flex-shrink:0;place-items:center;display:grid}.radio input:after{content:none}.radio input:checked{background:var(--accent-bright);box-shadow:0 0 8px var(--accent-glow)}.radio input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.status-msg{color:var(--text-dim);min-height:1.2em;font-size:.8rem;line-height:1.45}.lobby-series-score{color:var(--accent);min-height:0;font-family:JetBrains Mono,monospace;font-size:.82rem}.match-end-series{text-align:center;color:var(--accent);margin-bottom:.5rem;font-family:JetBrains Mono,monospace}.lobby-header{flex-wrap:wrap;justify-content:space-between;gap:1.5rem;display:flex}.lobby-code{letter-spacing:.25em;color:var(--accent)}.player-list{overscroll-behavior:contain;flex-direction:column;flex:1;gap:.45rem;min-height:0;max-height:none;list-style:none;display:flex;overflow-y:auto}.player-list li{border:1px solid var(--bg-panel-edge);transition:border-color .15s var(--ease);word-break:break-word;background:#080a10bf;border-radius:8px;padding:.6rem .75rem;font-size:.88rem;line-height:1.35}.player-list li.ready{color:#9dffb8;border-color:#3ddc6e55}.player-list li.team-red{border-left:3px solid #ef4444}.player-list li.team-blue{border-left:3px solid #3b82f6}.team-badge{letter-spacing:.08em;text-transform:uppercase;border-radius:3px;margin-right:.35rem;padding:.1rem .35rem;font-size:.65rem;display:inline-block}.team-badge.red{color:#fca5a5;background:#7f1d1d66}.team-badge.blue{color:#93c5fd;background:#1e3a8a66}.team-btn.team-red{color:#fca5a5;border-color:#ef444488}.team-btn.team-blue{color:#93c5fd;border-color:#3b82f688}.team-btn.active{outline:1px solid var(--accent)}.opponents{flex-flow:column wrap;place-content:flex-start;gap:.5rem;max-width:220px;max-height:640px;margin:0;padding-top:.15rem;display:flex;overflow-y:auto}.play-arena{flex-direction:row;justify-content:center;align-items:center;gap:.85rem;width:100%;display:flex}.play-arena:has(.opponents:not(.hidden)){max-width:1200px}.opp-card{background:var(--bg-panel);border:1px solid var(--bg-panel-edge);text-align:center;cursor:pointer;border-radius:8px;flex:none;padding:.4rem .45rem .5rem}.opp-card.focused{outline:2px solid var(--accent,#3d9eff);outline-offset:2px}.opp-card canvas{image-rendering:pixelated;margin:0 auto;display:block}.opp-card.ko-flash{animation:.7s ease-out ko-flash}@keyframes ko-flash{0%{transform:scale(1.06);box-shadow:0 0 0 2px #fb7185,0 0 24px #ef4444}to{box-shadow:none;transform:scale(1)}}.series-hud{text-align:center;letter-spacing:.06em;width:min(720px,96vw);color:var(--accent);background:#0a0e16b8;border:1px solid #4aa3ff38;border-radius:8px;margin-bottom:.15rem;padding:.35rem .75rem;font-family:JetBrains Mono,monospace;font-size:clamp(.78rem,2vw,.95rem);font-weight:700}.match-banner{z-index:6;letter-spacing:.14em;color:#fecaca;text-shadow:0 0 18px #ef4444,0 2px 10px #000;pointer-events:none;opacity:0;white-space:nowrap;font-size:1.15rem;font-weight:700;position:absolute;top:18%;left:50%;transform:translate(-50%,-50%)scale(.85)}.match-banner.show{animation:.95s ease-out forwards match-banner-pop}@keyframes match-banner-pop{0%{opacity:0;transform:translate(-50%,-30%)scale(.7)}18%{opacity:1;transform:translate(-50%,-50%)scale(1.08)}70%{opacity:1}to{opacity:0;transform:translate(-50%,-70%)scale(1)}}.overlay-title.countdown-go{color:#9fd0ff;text-shadow:0 0 24px #4aa3ffa6;letter-spacing:.28em}.overlay-title.countdown-num{letter-spacing:.12em;font-size:3rem}.opp-card.team-red{border-color:#ef444466}.opp-card.team-blue{border-color:#3b82f666}.opp-card.ally{box-shadow:inset 0 0 0 1px #22c55e44}.opp-name{letter-spacing:.08em;color:var(--text-dim);text-overflow:ellipsis;white-space:nowrap;max-width:88px;margin-bottom:.25rem;font-size:.65rem;overflow:hidden}.opp-meta{color:var(--text-dim);margin-top:.2rem;font-family:JetBrains Mono,monospace;font-size:.65rem}.opp-meta.surge-hot{color:#f59e0b;font-weight:600}.replay-bar{background:#00000059;border:1px solid #ffffff14;border-radius:8px;flex-wrap:wrap;align-items:center;gap:.5rem .75rem;width:min(640px,94vw);margin:.75rem auto 0;padding:.5rem .75rem;display:flex}.replay-bar .replay-seek{flex:1;min-width:140px;margin:0}.match-end{z-index:50;border-color:#4aa3ff38;min-width:min(420px,92vw);max-height:min(80vh,560px);display:none;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%);box-shadow:0 28px 70px #0009}.match-end.show{display:flex}body.match-over .play-arena{opacity:.35;pointer-events:none}body.match-over .chat-panel{opacity:.5}.rankings{margin:.5rem 0 .75rem 1.25rem;font-family:JetBrains Mono,monospace;font-size:.85rem;line-height:1.6}.overlay-actions{gap:.5rem;margin-top:.75rem;display:flex}.menu-grid{grid-template-columns:1fr;gap:.85rem;width:min(440px,92vw);display:grid}.menu-grid-home{grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;width:min(720px,94vw)}.menu-grid-home .menu-card--hero{min-height:8.5rem}.menu-grid-home .menu-card--hero .menu-card-title{font-size:clamp(1.35rem,3.2vw,1.65rem)}.menu-grid-2,.menu-grid-modes{grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;width:min(640px,94vw)}@media (width>=860px){.menu-grid-home{grid-template-columns:repeat(6,minmax(0,1fr));width:min(860px,94vw)}.menu-grid-home .menu-card--hero{grid-column:span 3}.menu-grid-home .menu-card--config,.menu-grid-home .menu-card--account,.menu-grid-home .menu-card--history{grid-column:span 2;min-height:6.4rem}}@media (width<=560px){.menu-grid-home,.menu-grid-2,.menu-grid-modes{grid-template-columns:1fr;width:min(420px,92vw)}.menu-grid-home .menu-card--hero{min-height:7.2rem}}.menu-card{--card-accent:var(--accent);isolation:isolate;text-align:left;border-radius:var(--radius);border:1px solid color-mix(in srgb, var(--card-accent) 28%, transparent);background:linear-gradient(145deg, color-mix(in srgb, var(--card-accent) 16%, #1a2233) 0%, #0a0d14fa 72%);color:var(--text);cursor:pointer;transition:border-color .25s var(--ease), transform .25s var(--ease-out), background .25s var(--ease), box-shadow .25s var(--ease);min-height:6.8rem;box-shadow:var(--shadow-card);flex-direction:column;justify-content:flex-end;gap:.2rem;padding:1.25rem 1.3rem 1.35rem;font-family:inherit;display:flex;position:relative;overflow:hidden}.menu-card:before{content:"";background:linear-gradient(180deg, var(--card-accent), transparent 90%);opacity:.95;width:4px;position:absolute;top:0;bottom:0;left:0}.menu-card:after{content:"";background:radial-gradient(circle, color-mix(in srgb, var(--card-accent) 35%, transparent), transparent 68%);opacity:.55;pointer-events:none;z-index:-1;width:140px;height:140px;transition:opacity .3s var(--ease), transform .35s var(--ease-out);border-radius:40%;position:absolute;inset:auto -20% -40% auto;transform:rotate(18deg)}.menu-card:hover{border-color:color-mix(in srgb, var(--card-accent) 70%, white 10%);box-shadow:var(--shadow-lift);transform:translateY(-5px)scale(1.01)}.menu-card:hover:after{opacity:.9;transform:rotate(18deg)scale(1.15)}.menu-card:focus-visible{box-shadow:var(--focus-ring), var(--shadow-lift);outline:none}.menu-card:active{transform:translateY(-1px)scale(.995)}.menu-card-kicker{letter-spacing:.22em;text-transform:uppercase;color:color-mix(in srgb, var(--card-accent) 75%, white 25%);opacity:.9;margin-bottom:.15rem;font-size:.62rem;font-weight:600;display:block}.menu-card-title{letter-spacing:.04em;font-size:clamp(1.12rem,2.6vw,1.32rem);font-weight:700;line-height:1.15;display:block}.menu-card-desc{color:var(--text-dim);letter-spacing:.01em;margin-top:.2rem;font-size:clamp(.72rem,1.7vw,.82rem);line-height:1.4;display:block}.menu-card--solo{--card-accent:var(--mode-solo)}.menu-card--multi{--card-accent:var(--mode-multi)}.menu-card--config{--card-accent:var(--mode-config)}.menu-card--account{--card-accent:var(--mode-account)}.menu-card--history{--card-accent:var(--mode-history)}.menu-card--sprint{--card-accent:var(--mode-sprint)}.menu-card--cheese{--card-accent:var(--mode-cheese)}.menu-card--survival{--card-accent:var(--mode-survival)}.menu-card--blitz{--card-accent:var(--mode-blitz)}.menu-card--zen{--card-accent:var(--mode-zen)}.menu-card--bots{--card-accent:var(--mode-bots)}.garbage-meter{background:#1a1f2b;border-radius:2px;flex-direction:column-reverse;align-items:stretch;width:8px;display:flex;position:absolute;top:4px;bottom:4px;left:-14px;overflow:hidden}.garbage-meter-seg{flex-shrink:0;width:100%;height:0%;transition:height .12s ease-out}.garbage-meter-seg.warning{background:#eab308}.garbage-meter-seg.arming{background:#f97316}.garbage-meter-seg.active{background:#ef4444}.action-text{letter-spacing:.12em;color:#fff;text-shadow:0 0 18px #3d9effd9,0 2px 10px #000;pointer-events:none;opacity:0;white-space:nowrap;z-index:4;font-size:1.35rem;font-weight:700;position:absolute;top:28%;left:50%;transform:translate(-50%,-50%)}.action-text.pop{animation:.85s ease-out forwards action-pop}@keyframes action-pop{0%{opacity:0;transform:translate(-50%,-40%)scale(.85)}15%{opacity:1;transform:translate(-50%,-50%)scale(1.05)}70%{opacity:1}to{opacity:0;transform:translate(-50%,-70%)scale(1)}}.stat-value.hot{color:#ffb347}.settings-section{margin-top:.75rem}.slider-field{color:var(--text-dim);flex-direction:column;gap:.35rem;font-size:.8rem;display:flex}.slider-field span{letter-spacing:.06em;justify-content:space-between;display:flex}.slider-field em{color:var(--text);font-family:JetBrains Mono,monospace;font-style:normal}.slider-field input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:6px}.slider-field input[type=range]::-webkit-slider-runnable-track{background:#1a2230;border:1px solid #2a3448;border-radius:999px;height:6px}.slider-field input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent);border:2px solid #0b1220;border-radius:50%;width:14px;height:14px;margin-top:-5px;box-shadow:0 0 0 1px #4aa3ff59}.slider-field input[type=range]::-moz-range-track{background:#1a2230;border:1px solid #2a3448;border-radius:999px;height:6px}.slider-field input[type=range]::-moz-range-thumb{background:var(--accent);border:2px solid #0b1220;border-radius:50%;width:14px;height:14px}.check-field{color:var(--text);cursor:pointer;align-items:center;gap:.5rem;font-size:.85rem;display:flex}.check-field input[type=checkbox]{appearance:none;cursor:pointer;width:1rem;height:1rem;transition:border-color .15s var(--ease), background .15s var(--ease);background:#0b0e14;border:1px solid #3a4a66;border-radius:4px;flex-shrink:0;place-items:center;display:grid}.check-field input[type=checkbox]:after{content:"";width:.4rem;height:.4rem;transition:transform .12s var(--ease), background .12s var(--ease);background:0 0;border-radius:1px;transform:scale(0)}.check-field input[type=checkbox]:checked{border-color:var(--accent);background:#4aa3ff1f}.check-field input[type=checkbox]:checked:after{background:var(--accent);transform:scale(1)}.check-field input[type=checkbox]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.settings-binds{flex-direction:column;gap:.4rem;display:flex}.bind-row{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.bind-label{color:var(--text-dim);font-size:.8rem}.bind-btn{min-width:140px;font-family:JetBrains Mono,monospace;font-size:.75rem}.bind-btn.listening{border-color:var(--accent);color:var(--accent)}.help-box{border:1px solid var(--bg-panel-edge);color:var(--text-dim);background:#080a10b3;border-radius:8px;margin-top:.35rem;padding:.85rem .95rem;font-size:.78rem;line-height:1.45}.help-box.compact{margin-top:0;padding:.65rem .8rem}.help-box strong{color:var(--text);letter-spacing:.06em;margin-bottom:.4rem;font-size:.7rem;display:block}.help-box ol{margin:.25rem 0 0 1.1rem}.help-box code{color:var(--accent);font-family:JetBrains Mono,monospace;font-size:.72rem}.lobby-share{border-bottom:1px solid var(--bg-panel-edge);flex-wrap:wrap;align-items:end;gap:1rem;margin-bottom:.25rem;padding-bottom:.85rem;display:flex}.share-block .lobby-code,.share-block .lobby-ip{letter-spacing:.2em;color:var(--accent);font-size:1.6rem}.fire-meter{background:#1a1f2b;border-radius:2px;width:8px;position:absolute;top:4px;bottom:4px;right:-14px;overflow:hidden}.fire-meter-fill{background:linear-gradient(#fbbf24,#f97316,#ef4444);height:0%;transition:height .12s ease-out;position:absolute;bottom:0;left:0;right:0}.fire-meter.hot .fire-meter-fill{box-shadow:0 0 12px #f97316}.danger-banner{z-index:5;letter-spacing:.2em;color:#fecaca;text-shadow:0 0 16px #ef4444;pointer-events:none;font-weight:700;animation:.7s ease-in-out infinite alternate danger-pulse;position:absolute;top:12%;left:50%;transform:translate(-50%)}@keyframes danger-pulse{0%{opacity:.55;transform:translate(-50%)scale(.98)}to{opacity:1;transform:translate(-50%)scale(1.04)}}.board-wrap.in-danger{box-shadow:0 0 0 1px #ef444473,0 20px 60px #00000073}.screen.screen-enter:not(.hidden){animation:screen-in .38s var(--ease-out)}.screen.screen-enter:not(.hidden) .menu-card{animation:card-rise .48s var(--ease-out) both}.screen.screen-enter:not(.hidden) .menu-card:first-child{animation-delay:20ms}.screen.screen-enter:not(.hidden) .menu-card:nth-child(2){animation-delay:60ms}.screen.screen-enter:not(.hidden) .menu-card:nth-child(3){animation-delay:.1s}.screen.screen-enter:not(.hidden) .menu-card:nth-child(4){animation-delay:.14s}.screen.screen-enter:not(.hidden) .menu-card:nth-child(5){animation-delay:.18s}.screen.screen-enter:not(.hidden) .menu-card:nth-child(6){animation-delay:.22s}@keyframes screen-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes card-rise{0%{opacity:0;transform:translateY(18px)scale(.97)}to{opacity:1;transform:none}}@keyframes panel-in{0%{opacity:0;transform:translateY(10px)scale(.985)}to{opacity:1;transform:none}}.match-winner{letter-spacing:.12em;text-transform:uppercase;text-align:center;color:#9dffb8;margin-bottom:.75rem;font-size:1.1rem}.match-winner.red{color:#fca5a5}.match-winner.blue{color:#93c5fd}.chat-panel{right:max(.75rem, env(safe-area-inset-right));bottom:max(.75rem, env(safe-area-inset-bottom));border-radius:var(--radius);z-index:40;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:linear-gradient(165deg,#161c28f7,#0c0f16fa);border:1px solid #4aa3ff29;flex-direction:column;width:min(340px,100vw - 1.5rem);max-height:min(440px,48vh);display:flex;position:fixed;box-shadow:0 16px 48px #00000080}.chat-panel.collapsed .chat-log,.chat-panel.collapsed .chat-compose{display:none}.chat-header{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding:.5rem .7rem;display:flex}.chat-header .panel-label{margin:0}.chat-header .btn-ghost{min-width:1.75rem;color:var(--text-dim);padding:.2rem .4rem;line-height:1}.chat-log{scrollbar-width:thin;scrollbar-color:#3a4a66 transparent;flex-direction:column;flex:1;gap:.35rem;min-height:120px;max-height:220px;padding:.55rem .7rem;font-size:.78rem;display:flex;overflow-y:auto}.chat-log::-webkit-scrollbar{width:6px}.chat-log::-webkit-scrollbar-thumb{background:#33425c;border-radius:999px}.chat-line{word-break:break-word;line-height:1.35}.chat-line .chat-meta{color:var(--text-dim);margin-right:.35rem}.chat-line.channel-team .chat-meta{color:#86efac}.chat-line.channel-direct .chat-meta{color:#fbbf24}.chat-compose{border-radius:0 0 var(--radius) var(--radius);background:#080b1259;border-top:1px solid #ffffff0f;flex-direction:column;gap:.45rem;padding:.55rem .65rem .65rem;display:flex}.chat-channel-pick{background:#00000047;border:1px solid #ffffff0d;border-radius:8px;gap:.3rem;padding:.2rem;display:flex}.chat-ch{cursor:pointer;flex:1;margin:0;position:relative}.chat-ch input{opacity:0;pointer-events:none;position:absolute}.chat-ch span{text-align:center;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);transition:color .15s var(--ease), background .15s var(--ease);border-radius:6px;padding:.38rem .35rem;font-size:.72rem;display:block}.chat-ch input:checked+span{color:var(--text);background:#4aa3ff29;box-shadow:inset 0 0 0 1px #4aa3ff59}.chat-ch:hover span{color:var(--text)}.chat-direct-wrap{align-items:center;gap:.45rem;display:flex}.chat-direct-wrap.hidden{display:none}.chat-direct-label{letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim);flex-shrink:0;font-size:.65rem}.chat-direct-to{min-width:0;color:var(--text);font:inherit;appearance:none;cursor:pointer;background-color:#0b0e14;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%238b95a8' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-position:right .65rem center;background-repeat:no-repeat;border:1px solid #2a3448;border-radius:8px;flex:1;padding:.42rem 1.85rem .42rem .6rem;font-size:.8rem}.chat-direct-to::-ms-expand{display:none}.chat-direct-to:focus{border-color:var(--accent);outline:none}.chat-row{align-items:stretch;gap:.4rem;display:flex}.chat-row input{min-width:0;color:var(--text);font:inherit;background:#0b0e14;border:1px solid #2a3448;border-radius:8px;flex:1;padding:.5rem .65rem;font-size:.8rem}.chat-row input::placeholder{color:#5c677a}.chat-row input:focus{border-color:var(--accent);outline:none}.chat-row #btn-chat-send{letter-spacing:.08em;text-transform:uppercase;flex-shrink:0;padding:.5rem .85rem;font-size:.72rem}.lobby-panel{width:min(480px,94vw);max-height:calc(100dvh - 8rem)}.lobby-layout{justify-content:center;align-items:stretch;gap:clamp(.85rem,2vw,1.25rem);width:min(760px,96vw);display:flex}.lobby-players-panel{border-radius:var(--radius);border:1px solid var(--accent-soft);background:linear-gradient(165deg,#161c28f5 0%,#0c0f16fa 100%);flex-direction:column;gap:.65rem;width:min(220px,34vw);min-width:160px;max-height:calc(100dvh - 8rem);padding:1rem .9rem 1.1rem;display:flex;box-shadow:0 18px 50px #00000059}.lobby-players-panel .panel-label{text-align:left;letter-spacing:.18em;margin-bottom:0}.lobby-layout .lobby-panel{flex:auto;width:auto;min-width:0;max-width:480px}@media (width<=720px){.lobby-layout{flex-direction:column;align-items:center;width:min(480px,94vw)}.lobby-players-panel{width:100%;max-height:min(240px,32vh)}}.settings-panel{gap:1rem;width:min(460px,94vw);padding:1.35rem 1.4rem 1.25rem;overflow:hidden auto}body:has(#screen-settings:not(.hidden)){place-items:center;overflow:hidden}@media (width<=480px){.chat-panel{width:auto;max-height:40vh;bottom:.5rem;left:.5rem;right:.5rem}.form-panel{width:min(100%,94vw);max-height:calc(100dvh - 6.5rem);padding:1.1rem 1.05rem 1.2rem}.settings-panel{padding:1.1rem 1.05rem 1.05rem}.btn{padding:.7rem 1.1rem}.menu-actions.row:not(.settings-actions){flex-direction:column}.menu-actions.row:not(.settings-actions) .btn{width:100%}.controls-hint{gap:.4rem .5rem}.control-chip{padding:.22rem .45rem .22rem .28rem}.control-action{font-size:.65rem}.kbd{min-width:1.4rem;height:1.4rem;font-size:.62rem}.playfield{gap:.65rem}}.account-panel{max-width:28rem;margin:0 auto}.account-user{border-radius:var(--radius-sm);background:#080b128c;border:1px solid #2dd4bf2e;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;padding:.85rem;display:grid}.account-user .stat{margin-bottom:0}.account-user .stat-value{text-align:left;font-size:1rem}.account-user .status-msg,.account-user .menu-actions{grid-column:1/-1}.history-list{flex-direction:column;gap:.4rem;max-height:14rem;margin:0 0 1rem;padding:0;list-style:none;display:flex;overflow-y:auto}.history-list li{border-radius:var(--radius-sm);color:var(--text-dim);transition:border-color .15s var(--ease), background .15s var(--ease);background:#ffffff08;border:1px solid #ffffff0a;justify-content:space-between;align-items:center;gap:.75rem;padding:.55rem .7rem;font-size:.82rem;display:flex}.history-list li:hover{background:#4aa3ff0f;border-color:#4aa3ff38}.history-list li strong{color:var(--text);font-weight:600}.history-list .btn-sm{flex-shrink:0}.pick-inline{flex-wrap:wrap;gap:.35rem .75rem;display:inline-flex}.mode-setup-panel{width:min(440px,94vw)}.menu-card.is-selected{border-color:color-mix(in srgb, var(--card-accent) 80%, white 10%);box-shadow:var(--shadow-lift);transform:translateY(-2px)}.menu-card.is-selected:after{opacity:.95}#zen-tools{flex-direction:column;align-items:stretch;gap:.4rem;margin-top:.5rem}#zen-tools .slider-field{margin:0}.replay-graph{background:#00000059;border-radius:4px;width:100%;max-width:36rem;height:60px;margin-top:.35rem;display:block}.match-end-solo-stats{max-width:28rem;margin:.75rem auto 0}#surge-stat.surge-4 .stat-value{color:#fbbf24;text-shadow:0 0 8px #fbbf2473}#surge-stat.surge-8 .stat-value{color:#fb923c;animation:.9s ease-in-out infinite surge-pulse}#surge-stat.surge-12 .stat-value{color:#f87171;font-size:1.15em;animation:.55s ease-in-out infinite surge-pulse}@keyframes surge-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.85;transform:scale(1.08)}}.stats-panel .btn{width:100%}.panel-label{letter-spacing:.16em;font-weight:600}.lobby-players-panel,.lobby-panel.form-panel{animation:panel-in .4s var(--ease-out) both}.opp-card{transition:transform .2s var(--ease), outline-color .2s var(--ease), box-shadow .2s var(--ease)}.opp-card:hover{transform:translateY(-2px)}.opp-card.ko{opacity:.45;filter:grayscale(.55)}.overlay-title{letter-spacing:.18em;font-weight:800}.control-chip{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:border-color .15s var(--ease), background .15s var(--ease)}.control-chip:hover{background:#101622e0;border-color:#4aa3ff59}@media (width<=480px){.account-user{grid-template-columns:1fr}.brand h1{letter-spacing:.18em;margin-left:.18em}.menu-card{min-height:5.8rem;padding:1.05rem 1.1rem 1.15rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.menu-card:hover{transform:none}}@supports not (color:color-mix(in srgb, red, blue)){.menu-card{background:linear-gradient(155deg,#222e44f2 0%,#0c101afa 100%);border-color:#4aa3ff38}.menu-card-kicker{color:var(--accent-bright)}}
