:root{color-scheme:dark;--bg: #070709;--panel: #101116;--line: rgba(255, 255, 255, .07);--text: #f5f4f0;--muted: #8b909c;--accent: #d6ff3c;--accent-ink: #10140a;--live: #3dff9a;--down: #ff5d4e;--us: #79b4ff;--vc: #ff6248}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;min-height:100dvh;background:radial-gradient(900px 480px at 100% -20%,rgba(214,255,60,.09),transparent 50%),radial-gradient(720px 420px at -10% 10%,rgba(121,180,255,.08),transparent 46%),var(--bg);color:var(--text);font-family:Manrope,Segoe UI,sans-serif;text-rendering:optimizeLegibility}body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.app{max-width:1180px;margin:0 auto;padding:28px 24px 96px}.top,.row,.card-head{display:flex;justify-content:space-between;gap:16px;align-items:center}.top{margin-bottom:40px;align-items:center}.brand{display:flex;align-items:center;min-width:0}.brand h1{font-size:clamp(22px,3vw,30px);line-height:1.05;text-wrap:balance}.kicker,.meta,.empty{color:var(--muted);font-size:13px;margin:0}h1{margin:0;font-family:Syne,sans-serif;font-size:34px;letter-spacing:-.07em;font-weight:800}h2{margin:0;font-family:Syne,sans-serif;font-size:22px;letter-spacing:-.04em}nav,.server-form,.stack,.grid{display:flex;gap:12px}nav{background:#ffffff08;border:1px solid var(--line);padding:4px;border-radius:999px}.grid{display:grid;grid-template-columns:1fr;gap:16px}.stack{flex-direction:column;gap:16px}button,input{font:inherit;color:var(--text)}button{background:var(--accent);color:var(--accent-ink);border:0;min-height:40px;padding:10px 16px;border-radius:999px;font-weight:700;cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button.ghost,nav button{background:transparent;color:var(--text);border:0}nav button{min-height:36px;padding:8px 16px}nav button.active,button:disabled{background:var(--accent);color:var(--accent-ink)}button:disabled{opacity:.55;cursor:wait}.card,.empty-card,.banner{background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 72px),var(--panel);border:1px solid var(--line);padding:24px;border-radius:24px;box-shadow:inset 0 1px #ffffff0a}.banner{margin-bottom:18px;color:var(--accent)}.empty-card{max-width:560px}.empty-card p,.empty-card label{margin-top:12px}.empty-card button{margin-top:18px}.dot{width:8px;height:8px;border-radius:50%;background:var(--down);flex:0 0 auto}.dot.on{background:var(--live);box-shadow:0 0 12px var(--live)}.status-row{display:flex;gap:8px;align-items:center;margin-bottom:10px}.pill{font-size:11px;letter-spacing:.04em;text-transform:uppercase;padding:3px 8px;border:1px solid var(--line);border-radius:999px;color:var(--muted)}.pill.live{color:var(--live);border-color:#3dff9a59}.match-card .card-head{display:block}.map{margin:22px 0 6px;font-family:Syne,sans-serif;font-size:clamp(36px,6vw,68px);letter-spacing:-.06em;line-height:.92;overflow-wrap:anywhere}.mode{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 22px;color:var(--accent);font-family:IBM Plex Mono,ui-monospace,monospace;font-size:13px;letter-spacing:.08em;text-transform:uppercase}.mode em{color:var(--muted);font-style:normal}.roster{list-style:none;margin:0;padding:0}.roster li{display:grid;grid-template-columns:28px 1fr auto auto;gap:12px;align-items:center;padding:14px 0;border-top:1px solid var(--line)}.roster-index{color:var(--muted);font-family:IBM Plex Mono,ui-monospace,monospace;font-size:12px}.roster-name{min-width:0;font-weight:700;font-size:16px;overflow-wrap:anywhere}.roster-stats{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:flex-end;font-family:IBM Plex Mono,ui-monospace,monospace;font-size:13px;font-variant-numeric:tabular-nums;color:var(--muted)}.roster-stats b,.roster-stats span{white-space:nowrap}.roster-stats b{color:var(--text);font-weight:600;min-width:1.5ch;text-align:right}.team{display:inline-flex;min-width:36px;justify-content:center;padding:2px 8px;border-radius:999px;font-family:IBM Plex Mono,ui-monospace,monospace;font-size:11px}.team-us{color:var(--us);background:#79b4ff1f}.team-vc{color:var(--vc);background:#ff62481f}.team-spec{color:var(--muted);background:#ffffff0f}.team-none{color:var(--muted)}.matchup{margin-top:8px}.matchup-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:16px 4px 20px}.matchup-bar .side{display:flex;align-items:baseline;gap:12px}.matchup-bar .side.vc{justify-content:flex-end}.matchup-bar span{font-size:13px;letter-spacing:.08em;text-transform:uppercase}.matchup-bar .us span{color:var(--us)}.matchup-bar .vc span{color:var(--vc)}.matchup-bar b{font-family:Manrope,sans-serif;font-size:40px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}.matchup-bar .us b{color:var(--us)}.matchup-bar .vc b{color:var(--vc)}.matchup-label{color:var(--muted);font-size:11px}.matchup-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px}.team-col.us{border-top:2px solid var(--us)}.team-col.vc{border-top:2px solid var(--vc)}.team-col.spec,.team-col.unknown{margin-top:16px;border-top:2px solid var(--line)}.team-col .kicker{margin:10px 0 6px}label{display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:12px;flex:1}input{background:#07080c;border:1px solid var(--line);min-height:44px;padding:10px 12px;border-radius:12px;font-size:16px}.server-form{flex-wrap:wrap;align-items:end;margin:12px 0}.hostline{margin:6px 0 0;font-family:IBM Plex Mono,ui-monospace,monospace;font-size:12px;color:var(--muted)}.board{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}.board-side{display:flex;flex-direction:column;gap:16px;position:sticky;top:16px}.side-card h2{margin-bottom:4px}.side-card .roster li{grid-template-columns:22px minmax(0,1fr);gap:2px 8px}.side-card .roster-stats{grid-column:2;justify-content:flex-start;font-size:12px}.timer{font-family:IBM Plex Mono,ui-monospace,monospace;font-size:13px;font-variant-numeric:tabular-nums;color:var(--accent);letter-spacing:.04em}.game-list{list-style:none;margin:12px 0 0;padding:0}.game-row{display:flex;flex-direction:column;gap:4px;padding:12px 0;border-top:1px solid var(--line)}.game-row strong{display:block;font-size:15px}.game-row span,.game-top{color:var(--muted);font-size:12px}.game-meta{display:flex;flex-wrap:wrap;gap:8px 14px;font-family:IBM Plex Mono,ui-monospace,monospace}.game-top{margin:0}@media(pointer:coarse){nav button,button{min-height:44px}}@media(max-width:800px){.app{padding:16px 16px calc(92px + env(safe-area-inset-bottom))}.top{flex-direction:column;align-items:stretch;gap:14px;margin-bottom:22px}.brand h1{font-size:clamp(22px,6.4vw,28px)}nav{position:fixed;z-index:20;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:calc(10px + env(safe-area-inset-bottom));width:auto;justify-content:stretch;padding:4px;background:#101116eb;border:1px solid var(--line);box-shadow:0 10px 40px #00000073;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}nav button{flex:1}.board{grid-template-columns:1fr}.board-side{position:static}.card,.empty-card,.banner{padding:18px 16px;border-radius:20px}.map{font-size:clamp(34px,11vw,52px)}.matchup-bar b{font-size:32px}.matchup-cols{grid-template-columns:1fr;gap:8px}.server-form{flex-direction:column;align-items:stretch}.roster li{grid-template-columns:24px minmax(0,1fr);gap:2px 10px}.roster-name,.roster-stats,.team{grid-column:2}.roster-stats{justify-content:flex-start}.team{justify-self:start}}@media(prefers-reduced-motion:reduce){.dot.on{box-shadow:none}}
