:root{color-scheme:dark;font-family:Arial Narrow,Roboto Condensed,system-ui,sans-serif;background:#080c12;color:#eef5fb;font-synthesis:none;--top: #3ba7ff;--bottom: #ff6b35;--line: rgba(158, 188, 218, .18)}*{box-sizing:border-box}html,body,#app{margin:0;min-width:320px;width:100%;height:100%}html,body{overflow:hidden;overscroll-behavior:none}body{min-height:100dvh;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}button{font:inherit;touch-action:manipulation}.shell{min-height:100dvh;display:grid;grid-template-rows:52px minmax(0,1fr) 38px;background:linear-gradient(#05080dd1,#05080df0),var(--arena-image),#080c12;background-size:cover;background-position:center;isolation:isolate}.topbar,.statusbar{display:flex;align-items:center;justify-content:space-between;padding:0 22px;border-bottom:1px solid var(--line);background:#05090ed6;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;position:relative;z-index:4}.statusbar{border-top:1px solid var(--line);border-bottom:0;color:#8291a0;letter-spacing:.08em}.brand{font-size:16px;font-weight:700;letter-spacing:.2em}.brand i{font-style:normal;color:var(--top)}.brand span{color:#677787;font-size:9px;letter-spacing:.16em;margin-left:10px}.top-actions{display:flex;gap:8px}.icon-button{width:32px;height:30px;border:1px solid var(--line);background:#0c131c;color:#c9d6df;display:grid;place-items:center;cursor:pointer;border-radius:3px}.icon-button:hover{border-color:#526a7e;color:#fff}.icon-button:active,.primary:active{transform:translateY(1px)}.arena-layout{min-height:0;display:grid;grid-template-columns:minmax(180px,1fr) minmax(320px,390px) minmax(180px,1fr);max-width:1180px;width:100%;margin:0 auto;padding:12px 20px;gap:24px}.hud{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:16px}.hud.bottom{text-align:right}.player-tag{display:flex;align-items:center;gap:10px;color:#8da0b0;font:500 10px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.18em;text-transform:uppercase}.hud.bottom .player-tag{justify-content:flex-end}.player-tag:before{content:"";width:24px;height:2px;background:var(--top);box-shadow:0 0 12px var(--top)}.hud.bottom .player-tag:before{order:2;background:var(--bottom);box-shadow:0 0 12px var(--bottom)}.callsign{font-size:clamp(30px,4vw,52px);line-height:.85;font-weight:700;letter-spacing:-.05em;text-transform:uppercase}.hud.top .callsign{color:var(--top)}.hud.bottom .callsign{color:var(--bottom)}.mobile-callsign,.mobile-next,.mobile-pause{display:none}.mobile-next{color:#8da0b0;font:600 10px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.12em;text-transform:uppercase}.mobile-next b{color:var(--bottom)}.mobile-pause{width:44px;height:44px;border:1px solid var(--line);background:#0c131c;color:#dce8ef;place-items:center}.round-pips{display:flex;gap:6px}.hud.bottom .round-pips{justify-content:flex-end}.pip{width:22px;height:4px;background:#1b2732}.hud.top .pip.on{background:var(--top);box-shadow:0 0 10px #3ba7ff80}.hud.bottom .pip.on{background:var(--bottom);box-shadow:0 0 10px #ff6b3580}.module{border-top:1px solid var(--line);padding-top:10px}.module-label{color:#637384;font:500 9px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.18em;text-transform:uppercase;margin-bottom:8px}.queue{display:flex;gap:5px;flex-wrap:wrap}.hud.bottom .queue{justify-content:flex-end}.queue span{width:28px;height:28px;display:grid;place-items:center;border:1px solid var(--line);background:#0c131c;color:#81909e;font:600 12px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.metric{font:500 12px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#8695a4}.metric strong{color:#fff;font-size:18px;margin-right:5px}.submetric{margin-top:5px;color:#738596;font:600 10px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;text-transform:uppercase;letter-spacing:.08em}.hud.top .submetric b{color:var(--top)}.hud.bottom .submetric b{color:var(--bottom)}.board-host{min-width:320px;min-height:0;height:100%;position:relative}.board-host canvas{width:100%;height:100%;display:block}.board-label{position:absolute;left:50%;transform:translate(-50%);z-index:2;pointer-events:none;color:#526273;font:500 9px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.2em;text-transform:uppercase}.board-label.top{top:4px}.board-label.bottom{bottom:4px}.signature-banner{position:absolute;left:8px;right:8px;top:50%;z-index:3;pointer-events:none;transform:translateY(-50%) scaleX(.84);opacity:0;padding:10px 4px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;background:#05090ee0;text-align:center;color:#eef5fb;font:800 clamp(18px,4vw,34px)/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.18em;text-transform:uppercase;transition:opacity 90ms ease,transform .22s cubic-bezier(.16,1,.3,1)}.signature-banner.active{opacity:1;transform:translateY(-50%) scaleX(1)}.signature-banner.top{color:var(--top)}.signature-banner.bottom{color:var(--bottom)}.overlay{position:fixed;inset:0;z-index:20;display:grid;place-items:center;background:#04070bb8;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);transition:opacity .2s ease}.overlay.hidden{opacity:0;pointer-events:none}.panel{width:min(720px,calc(100vw - 32px));border:1px solid rgba(116,147,173,.3);background:#080d14f0;box-shadow:0 30px 90px #00000080;padding:clamp(24px,5vw,52px);position:relative;overflow:hidden}.panel:after{content:"";position:absolute;inset:auto 0 0;height:3px;background:linear-gradient(90deg,var(--top) 0 49%,transparent 49% 51%,var(--bottom) 51%)}.eyebrow{font:500 10px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#7790a3;letter-spacing:.2em;text-transform:uppercase;margin:0 0 18px}.title{font-size:clamp(58px,12vw,118px);line-height:.72;letter-spacing:-.075em;text-transform:uppercase;margin:0 0 28px}.title .top-ink{color:var(--top)}.title .bottom-ink{color:var(--bottom)}.lead{max-width:54ch;color:#9aa9b5;font:400 14px/1.7 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;margin:0 0 26px}.controls{display:grid;grid-template-columns:1fr 1fr;gap:18px;border-top:1px solid var(--line);padding-top:18px;margin-bottom:28px}.control-set{color:#788795;font:400 10px/1.8 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.control-set strong{display:block;margin-bottom:5px;font-size:11px;color:#fff;letter-spacing:.1em}kbd{border:1px solid #31404e;background:#101923;color:#d9e5ec;border-radius:2px;padding:2px 5px;font:500 9px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.primary{border:0;background:#eef5fb;color:#080c12;min-width:180px;padding:13px 22px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;white-space:nowrap}.primary:hover{background:#fff}.primary:disabled{cursor:wait;opacity:.45}.countdown{font:700 clamp(110px,25vw,240px)/.8 "Arial Narrow",system-ui,sans-serif;letter-spacing:-.08em;text-shadow:0 0 55px rgba(255,255,255,.18)}.end-title{font-size:clamp(48px,9vw,90px);line-height:.9;letter-spacing:-.05em;margin:0 0 14px;text-transform:uppercase}.result-pips{display:flex;justify-content:space-between;margin:18px 0 22px}.result-pips>span{display:flex;gap:6px}.result-pips>span:first-child .pip.on{background:var(--top)}.result-pips>span:last-child .pip.on{background:var(--bottom)}.match-stats{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:16px 0 22px}.match-stat{min-width:0;border-top:2px solid var(--line);padding-top:9px}.match-stat:first-child{border-color:var(--top)}.match-stat:last-child{border-color:var(--bottom)}.match-stat h3{margin:0 0 8px;font-size:15px;text-transform:uppercase;letter-spacing:.12em}.match-stat dl{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;margin:0}.match-stat dl div{min-width:0}.match-stat dt{color:#708294;font:500 8px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;text-transform:uppercase}.match-stat dd{margin:2px 0 0;font:700 15px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.match-stat .prominent{grid-column:1 / -1;background:#ffffff0a;padding:6px}.match-stat .prominent dd{font-size:22px}.touch-deck,.touch-guide{display:none}.touch-deck{width:100%;min-width:0}.touch-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#a9b7c3;font:600 11px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.08em;text-transform:uppercase;padding:0 2px 5px}.touch-meta span{white-space:nowrap}.touch-mini-pips{display:inline-flex;gap:3px;vertical-align:middle}.touch-mini-pips .pip{display:block;width:10px;height:3px}.blue .touch-mini-pips .pip.on{background:var(--top)}.orange .touch-mini-pips .pip.on{background:var(--bottom)}.combo-live{display:inline-block;transform:scale(1.22);color:#eef5fb!important;text-shadow:0 0 10px currentColor}.touch-player{color:#fff}.blue .touch-player,.blue .touch-meta b{color:var(--top)}.orange .touch-player,.orange .touch-meta b{color:var(--bottom)}.touch-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;touch-action:none}.touch-key{min-width:56px;min-height:64px;padding:4px 2px;border:1px solid rgba(158,188,218,.28);border-bottom-width:3px;background:#0c131cf5;color:#dce8ef;display:grid;place-content:center;gap:1px;cursor:pointer;border-radius:4px;transition:transform 70ms ease,border-color 70ms ease,background 70ms ease}.touch-key span{font-size:20px;line-height:1}.touch-key small{font:700 7px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.08em;text-transform:uppercase}.touch-key.pressed,.touch-key:active{transform:translateY(2px);border-bottom-width:1px;background:#1a2a39}.blue .touch-key.pressed,.blue .touch-key:active{border-color:var(--top);box-shadow:inset 0 0 20px #3ba7ff2e}.orange .touch-key.pressed,.orange .touch-key:active{border-color:var(--bottom);box-shadow:inset 0 0 20px #ff6b352e}.slam-key{color:#fff;background:#192735}.touch-guide{border-top:1px solid var(--line);padding-top:14px;margin-bottom:18px;color:#91a2b0;font:500 11px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.touch-guide strong,.touch-guide span{display:block}.touch-guide strong{color:#fff;margin-bottom:4px}.landscape-nudge{color:var(--top);margin-top:7px}@media(max-width:1024px),(pointer:coarse){.shell{height:100dvh;min-height:100dvh;grid-template-rows:calc(42px + env(safe-area-inset-top)) minmax(0,1fr) calc(24px + env(safe-area-inset-bottom))}.topbar{padding:env(safe-area-inset-top) max(8px,env(safe-area-inset-right)) 0 max(8px,env(safe-area-inset-left))}.statusbar{padding:0 max(8px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(8px,env(safe-area-inset-left))}.topbar,.statusbar{font-size:9px}.brand{font-size:14px}.brand span,.statusbar span:nth-child(2){display:none}.icon-button{width:44px;height:36px}.touch-deck,.touch-guide{display:block}.desktop-guide{display:none}.player-tag,.hud>.module{display:none}.callsign{font-size:22px;line-height:1}.hud{justify-content:center;gap:4px}.round-pips,.desktop-callsign{display:none}.mobile-callsign,.mobile-next{display:inline}.mobile-pause{display:grid}.arena-layout{max-width:none}.board-host{min-width:0}.board-label{display:none}.panel{max-height:calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;padding:22px}.title{font-size:clamp(50px,16vw,84px);margin-bottom:18px}.lead{font-size:11px;line-height:1.55;margin-bottom:16px}.eyebrow{margin-bottom:12px}.primary{min-width:0;width:100%;min-height:48px}.match-stats{grid-template-columns:1fr}}@media(max-width:600px)and (orientation:portrait){.shell{grid-template-rows:minmax(0,1fr)}.topbar,.statusbar{display:none}.arena-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:56px minmax(0,1fr) 120px;padding:max(4px,env(safe-area-inset-top)) max(4px,env(safe-area-inset-right)) max(4px,env(safe-area-inset-bottom)) max(4px,env(safe-area-inset-left));gap:4px}.hud{position:relative}.hud.top{order:1}.board-host{order:2}.hud.bottom{order:3}.hud.top{display:grid;grid-template-columns:auto auto 1fr 44px;align-items:center;justify-content:stretch;gap:8px;text-align:left}.hud.top .callsign{display:block;font-size:16px}.hud.top .round-pips{display:flex}.hud.top .mobile-next{display:block;text-align:right}.hud.bottom .callsign{display:none}.touch-key{min-width:56px;min-height:64px}.touch-key span{font-size:24px}.touch-key small{font-size:8px}.touch-meta{height:30px;padding-bottom:6px}.touch-meta span:nth-child(2),.touch-meta span:nth-child(5){display:none}.board-label{font-size:7px}.panel{width:calc(100vw - 16px)}}@media(max-width:360px)and (orientation:portrait){.arena-layout{grid-template-rows:52px minmax(0,1fr) 116px}.touch-key{min-height:60px}.touch-meta{font-size:10px;gap:5px}}@media(max-width:1024px)and (orientation:landscape),(pointer:coarse)and (orientation:landscape){.shell{grid-template-rows:minmax(0,1fr)}.topbar,.statusbar{display:none}.arena-layout{grid-template-columns:minmax(190px,1fr) minmax(170px,240px) minmax(190px,1fr);padding:max(3px,env(safe-area-inset-top)) max(5px,env(safe-area-inset-right)) max(3px,env(safe-area-inset-bottom)) max(5px,env(safe-area-inset-left));gap:6px}.hud{position:relative}.hud .callsign{font-size:17px}.hud.top .round-pips{display:flex}.hud.top .mobile-next{display:block}.hud.top .mobile-pause{display:grid}.touch-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.touch-key{min-width:56px;min-height:56px}.touch-meta{flex-wrap:wrap;justify-content:flex-start;font-size:10px;line-height:14px}.touch-meta span:nth-child(1),.touch-meta span:nth-child(2),.touch-meta span:nth-child(5){display:none}.touch-player{width:100%}.hud.bottom .touch-meta{justify-content:flex-end}.hud.bottom .touch-player{text-align:right}.landscape-nudge{display:none!important}.panel{width:min(680px,calc(100vw - 24px))}.panel .title{font-size:clamp(44px,12vh,72px)}}@media(max-height:420px)and (orientation:landscape){.hud.top .callsign{display:block;font-size:16px}.touch-key{min-height:56px}.touch-meta{font-size:10px}.panel{padding:14px 20px}.panel .lead{margin-bottom:10px}.touch-guide{padding-top:9px;margin-bottom:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}@media(prefers-reduced-transparency:reduce){.topbar,.statusbar,.overlay{-webkit-backdrop-filter:none;backdrop-filter:none;background:#080c12}}