:root{--bg:#16181c;--panel:#16181cd1;--line:#2a2e35;--text:#e6e6e6;--muted:#8b929c;--player:#3ad7ff;--threat:#ff3a6e;--hit:#ffe45c;--perfect:#5cff9a;--mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);-webkit-user-select:none;user-select:none;margin:0;font:13px/1.4 system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}#app{position:fixed;inset:0}#app canvas.view{width:100%;height:100%;display:block}.hud{pointer-events:none;position:absolute;inset:0}.panel{background:var(--panel);border:1px solid var(--line);padding:10px 12px;position:absolute;top:12px}.panel-info{width:300px;left:12px}.panel-info .title{letter-spacing:.04em;text-transform:uppercase;color:var(--muted);font-size:11px;font-weight:600}.panel-info .phase{color:var(--player);margin-top:4px}.unverified{pointer-events:auto;color:var(--hit);font:inherit;cursor:pointer;background:0 0;border:1px solid #7a5b1c;margin-top:8px;padding:2px 6px;font-size:11px}.panel-stats{font-variant-numeric:tabular-nums;width:280px;right:12px}.panel,.results{contain:layout paint style}.stats-head{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;justify-content:space-between;align-items:baseline;font-size:11px;font-weight:600;display:flex}.shots-line{color:var(--muted);margin-top:8px;font-size:11px}.panel-info .title-row{justify-content:space-between;align-items:center;display:flex}.link-button{pointer-events:auto;border:1px solid var(--line);color:var(--muted);cursor:pointer;background:0 0;padding:1px 8px;font:11px system-ui,sans-serif}.link-button:hover{color:var(--text);border-color:var(--muted)}.panel-info .mode-name{color:#fff;margin-top:2px;font-size:16px;font-weight:700}.panel-info .preset{color:var(--muted);font-size:11px}.toggle-shots{pointer-events:auto;color:var(--threat);font:11px var(--mono);cursor:pointer;background:#1b1e23;border:1px solid #ff3a6e80;margin:2px 0 4px;padding:2px 6px}.toggle-shots:hover{border-color:var(--threat)}.scoreboard{text-align:center;font-variant-numeric:tabular-nums;contain:layout paint style;min-width:240px;position:absolute;top:10px;left:50%;transform:translate(-50%)}.sb-time{font:700 22px / 1 var(--mono);color:var(--text)}.sb-timebar{background:#2a2e35;width:200px;height:3px;margin:5px auto 4px;overflow:hidden}.sb-timebar .fill{background:var(--player);transform-origin:0;will-change:transform;height:100%}.sb-timer.urgent .sb-time{color:var(--threat);text-shadow:0 0 12px #ff3a6eb3}.sb-points{color:#fff;text-shadow:0 0 18px #5cff9a59,0 2px 4px #000;transform-origin:50% 60%;font:800 46px/1.05 system-ui,-apple-system,Segoe UI,sans-serif;display:inline-block}.sb-points.loss{color:var(--threat);text-shadow:0 0 18px #ff3a6e99,0 2px 4px #000}.sb-sub{font:600 11px var(--mono);color:var(--muted);letter-spacing:.12em;text-transform:uppercase;justify-content:center;align-items:center;gap:14px;display:flex}.sb-combo[hidden]{display:none}.sb-combo{transform-origin:0;color:var(--hit);letter-spacing:.06em;text-shadow:0 0 10px #ffe45c99;font-weight:800;display:inline-block}.countdown{color:#fff;text-shadow:0 0 32px #3ad7ffa6,0 4px 8px #000;pointer-events:none;will-change:transform, opacity;font:900 132px/1 system-ui,-apple-system,Segoe UI,sans-serif;position:absolute;top:34%;left:50%}.countdown.go{color:var(--perfect);text-shadow:0 0 32px #5cff9abf,0 4px 8px #000}.hit-flash{pointer-events:none;will-change:opacity;position:absolute;inset:0;box-shadow:inset 0 0 120px 10px #ff3a6e80}.meter{margin:8px 0}.meter-head,.meter-sub{justify-content:space-between;display:flex}.meter-head b{font-size:15px}.meter-sub{color:var(--muted);font-size:11px}.meter-sub .neg{color:var(--threat)}.bar{background:#ff3a6e8c;height:6px;margin:3px 0;overflow:hidden}.bar.empty{background:#1b1e23}.bar .fill{background:var(--text);transform-origin:0;will-change:transform;height:100%;transform:scaleX(0)}.panel-info .camera{color:var(--muted);font-size:11px}.popups{pointer-events:none;contain:strict;position:absolute;inset:0;overflow:hidden}.popup{text-align:center;white-space:nowrap;transform-origin:50% 100%;will-change:transform, opacity;position:absolute;top:0;left:0}.popup .word{letter-spacing:.06em;text-shadow:0 0 1px #000,0 1px 3px #000;font:800 20px/1 system-ui,-apple-system,Segoe UI,sans-serif}.popup.grade-perfect .word{text-shadow:0 0 10px #5cff9ad9,0 0 2px #000;font-size:26px}.popup.shot .word{font-size:24px}.popup.shot-dodge .word{text-shadow:0 0 10px #3ad7ffd9,0 0 2px #000}.popup.shot-hit .word,.popup.grade-bad .word{text-shadow:0 0 8px #ff3a6eb3,0 0 2px #000}.popup .detail{font:600 11px var(--mono);color:var(--text);text-shadow:0 1px 2px #000;margin-top:2px}.popup .pts{color:var(--hit);font-size:13px;font-weight:800}.popup .pts.neg{color:var(--threat)}.popup .pts.zero{color:var(--muted)}.reference{pointer-events:none;height:100%;position:absolute;top:0;left:50%;transform:translate(-50%)}.timeline{width:min(900px,100% - 24px);position:absolute;bottom:36px;left:50%;transform:translate(-50%)}.timeline canvas{width:100%;height:64px;display:block}.legend{color:var(--muted);justify-content:center;gap:12px;font-size:11px;display:flex}.legend span:before{content:"";vertical-align:middle;width:8px;height:8px;margin-right:4px;display:inline-block}.k-windup:before{background:var(--text)}.k-commit:before{background:var(--hit)}.k-cancel:before{background:var(--threat)}.k-ready:before{background:var(--player);clip-path:polygon(50% 100%,0 0,100% 0)}.k-late:before{background:#ff3a6e59}.k-move:before{background:var(--player)}.k-stand:before{background:#3a3f47}.help{text-align:center;color:var(--muted);font-size:11px;position:absolute;bottom:10px;left:0;right:0}.results{z-index:1;border:1px solid var(--line);font-variant-numeric:tabular-nums;pointer-events:auto;background:#101215;width:380px;padding:20px 28px 22px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 12px 40px #0009}.r-title{text-align:center;color:var(--muted);letter-spacing:.16em;text-transform:uppercase;font-size:11px;font-weight:600}.r-hero{justify-content:center;align-items:center;gap:20px;margin:10px 0 14px;display:flex}.r-rank{text-align:center;width:84px;font:900 88px/1 system-ui,-apple-system,Segoe UI,sans-serif}.rank-S{color:var(--hit);text-shadow:0 0 28px #ffe45ca6}.rank-A{color:var(--perfect);text-shadow:0 0 24px #5cff9a80}.rank-B{color:var(--player);text-shadow:0 0 24px #3ad7ff73}.rank-C{color:var(--text)}.rank-D{color:var(--threat)}.r-points{color:#fff;font:800 50px/1 system-ui,-apple-system,Segoe UI,sans-serif}.r-points-label{color:var(--muted);font-size:11px}.r-badges{grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:6px;display:grid}.r-badge{border:1px solid var(--line);text-align:center;padding:6px 4px}.r-badge b{font-size:18px;display:block}.r-badge span{color:var(--muted);letter-spacing:.06em;text-transform:uppercase;font-size:10px}.results .medians{text-align:center;color:var(--muted);margin-top:8px;font-size:11px}.r-actions{gap:8px;margin-top:16px;display:flex}.r-button{border:1px solid var(--line);color:var(--text);cursor:pointer;background:#1b1e23;flex:1;padding:8px;font:600 13px system-ui,sans-serif}.r-button.primary{border-color:var(--player);color:var(--player)}.r-button:hover{background:#23272e}kbd{font:10px var(--mono);opacity:.7;border:1px solid;margin-left:8px;padding:0 4px}.landing{z-index:10;background:radial-gradient(at 50% 38%,#1a1d22db,#0a0b0df7);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.landing[hidden]{display:none}.landing-inner{text-align:center;width:min(720px,100% - 32px)}.brand{color:#fff;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 0 32px #3ad7ff59;margin-bottom:36px;font:900 68px/1 system-ui,-apple-system,Segoe UI,sans-serif}.modes{grid-template-columns:1fr 1fr;gap:16px;display:grid}@media (width<=640px){.modes{grid-template-columns:1fr}}.mode-card{border:1px solid var(--line);color:var(--player);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;background:#1b1e23eb;padding:22px 20px;font:800 22px system-ui,-apple-system,Segoe UI,sans-serif;transition:border-color .12s,transform .12s}.mode-card:hover,.mode-card:focus-visible{border-color:var(--player);outline:none;transform:translateY(-2px)}.mode-challenge{color:var(--threat);border-color:#ff3a6e73}.mode-challenge:hover,.mode-challenge:focus-visible{border-color:var(--threat)}.points-legend{flex-wrap:wrap;justify-content:center;gap:6px 16px;margin:26px 0 12px;font-size:12px;display:flex}.pt-chip b{font:700 13px var(--mono);margin-right:4px}.howto{color:var(--muted);white-space:pre;font-size:13px}.devpanel{border:1px solid var(--line);pointer-events:auto;background:#101215f5;width:420px;max-height:calc(100% - 140px);padding:10px 12px;position:absolute;top:12px;left:50%;overflow:auto;transform:translate(-50%)}.devpanel h3{text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:8px 0 4px;font-size:11px}.devpanel label{grid-template-columns:1fr 110px 74px;align-items:center;gap:8px;padding:2px 0;display:grid}.devpanel input,.devpanel select{width:100%;color:var(--text);border:1px solid var(--line);font:12px var(--mono);background:#0f1114;padding:2px 4px}.devpanel .status{font:10px var(--mono);text-align:right}.status-verified{color:var(--perfect)}.status-candidate{color:var(--hit)}.status-disputed{color:#ff9a3a}.status-design{color:var(--muted)}.status-needed{color:var(--threat)}.devpanel .note{color:var(--muted);margin-top:8px;font-size:11px}.perf-overlay{border:1px solid var(--line);font:11px / 1.5 var(--mono);white-space:pre;pointer-events:none;contain:layout paint style;background:#101215e6;padding:6px 8px;position:absolute;bottom:110px;right:12px}.perf-warning{min-width:280px;max-width:min(560px,100% - 600px);color:var(--hit);pointer-events:none;contain:layout paint style;background:#281e0af2;border:1px solid #7a5b1c;padding:8px 12px;font-size:12px;position:absolute;bottom:132px;left:50%;transform:translate(-50%)}.speeds{flex-wrap:wrap;align-items:center;gap:4px;margin:6px 0 4px;display:flex}.speeds .label{width:100%;color:var(--muted);font-size:11px}.speed-chip{pointer-events:auto;border:1px solid var(--line);color:var(--text);font:11px var(--mono);cursor:pointer;background:#1b1e23;padding:2px 5px}.speed-chip:hover{border-color:var(--muted)}.speed-chip.active{border-color:var(--player);color:var(--player)}.grades{text-align:center;grid-template-columns:44px repeat(5,1fr);gap:2px 4px;margin-top:8px;font-size:11px;display:grid}.grades .beat{text-align:left;color:var(--muted)}.grades .head{font-size:10px}.grades .head .pts{font:9px var(--mono);opacity:.75;display:block}.dummy-hp{pointer-events:none;will-change:transform;contain:layout paint style;text-align:center;width:140px;position:absolute;top:0;left:0}.hp-bar{background:#ff3a6e40;border:1px solid #ff3a6eb3;width:96px;height:10px;margin:0 auto;position:relative;overflow:hidden}.hp-fill{background:var(--threat);transform-origin:0;will-change:transform;height:100%}.hp-text{font:600 8px / 10px var(--mono);color:#fff;text-shadow:0 1px 1px #000;position:absolute;inset:0}.hp-hits{white-space:nowrap;font:600 11px var(--mono);color:var(--text);text-shadow:0 1px 2px #000;margin-top:2px}.sb-timer.urgent .sb-timebar .fill{background:var(--threat)}