*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--neon-cyan: #ff7a18;--neon-amber: #ffc66b;--neon-red: #ff3a3a;--bg: #070504;--panel-bg: rgba(17, 12, 9, .91);--border: rgba(255, 122, 24, .24);--text: #eadbc8;--text-dim: #8f7967}html,body{width:100%;height:100%;overflow:hidden;background:var(--bg);font-family:DIN Alternate,SF Mono,Fira Mono,monospace;color:var(--text)}#app{position:relative;width:100%;height:100%}#ai-video,#canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}#ai-video{object-fit:cover;background:#050403;filter:contrast(1.08) saturate(.94) brightness(.82);z-index:0}#canvas{z-index:1;opacity:0;mix-blend-mode:screen;pointer-events:none}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#040608c7;z-index:10}.overlay.hidden{display:none}.panel{background:var(--panel-bg);border:1px solid var(--border);border-radius:10px;padding:32px 28px;width:min(380px,calc(100vw - 32px));display:flex;flex-direction:column;align-items:center;gap:18px;box-shadow:0 0 46px #ff500014,inset 0 1px #ffffff08}.label{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--neon-cyan);opacity:.7}.hint{font-size:17px;color:var(--text);text-align:center;line-height:1.5}.score-row{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.score-btn{width:36px;height:36px;background:#ff7a180f;border:1px solid rgba(255,122,24,.24);border-radius:8px;color:var(--text);font-size:14px;font-family:inherit;cursor:pointer;transition:all .15s}.score-btn:hover{border-color:var(--neon-cyan);color:var(--neon-cyan)}.score-btn.selected{background:#ff7a182e;border-color:var(--neon-cyan);color:var(--neon-amber);box-shadow:0 0 12px #ff520059}.action-btn{background:#ff7a181a;border:1px solid rgba(255,122,24,.38);border-radius:8px;color:var(--neon-amber);font-family:inherit;font-size:15px;letter-spacing:1px;padding:12px 36px;cursor:pointer;transition:all .2s}.action-btn:disabled{opacity:.35;cursor:not-allowed}.action-btn:not(:disabled):hover{background:#ff7a182e;box-shadow:0 0 18px #ff52003d}.action-btn.small{font-size:13px;padding:9px 24px}#hud{position:absolute;bottom:0;left:0;right:0;display:flex;flex-direction:column;align-items:center;padding-bottom:max(32px,env(safe-area-inset-bottom));gap:12px;z-index:5}#hud.hidden{display:none}#hit-counter{font-size:13px;letter-spacing:2px;color:var(--text-dim)}.hit-btn{position:relative;width:110px;height:110px;border-radius:50%;background:radial-gradient(circle at 36% 34%,#ffa94833,#3212079e 45%,#000000c7);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .1s,box-shadow .2s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.hit-btn:not(:disabled):active{transform:scale(.94)}.hit-btn:disabled{cursor:not-allowed;opacity:.7}.hit-btn:not(:disabled){box-shadow:0 0 28px #ff520047,0 0 10px #ffbe622e inset}#hit-label{position:relative;z-index:1;font-size:16px;color:var(--neon-amber);letter-spacing:1px;pointer-events:none}#progress-ring{position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;width:calc(100% + 8px);height:calc(100% + 8px);transform:rotate(-90deg);pointer-events:none}#progress-ring .track{fill:none;stroke:#ff7a181f;stroke-width:2.5}#progress-ring .fill{fill:none;stroke:var(--neon-cyan);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:163.4;stroke-dashoffset:163.4;transition:stroke-dashoffset .08s linear;filter:drop-shadow(0 0 5px #ff4a00)}#status-text{font-size:12px;letter-spacing:1.5px;color:var(--text-dim);height:18px}#history-panel{position:absolute;bottom:0;left:0;right:0;background:var(--panel-bg);border-top:1px solid var(--border);padding:20px 20px max(20px,env(safe-area-inset-bottom));z-index:5;max-height:55vh;overflow-y:auto;display:flex;flex-direction:column;gap:12px}#history-panel.hidden{display:none}.history-title{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--neon-cyan);opacity:.6}.history-item{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:6px;font-size:12px;color:var(--text-dim);padding:10px 0;border-bottom:1px solid rgba(255,255,255,.05)}.history-item .val{color:var(--text);font-size:14px;font-weight:600}.history-item .key{font-size:10px;letter-spacing:1px}.delta-pos{color:#ffb45c}.delta-neg{color:var(--neon-red)}@media (min-width: 640px){#hud{padding-bottom:48px}.hit-btn{width:130px;height:130px}#hit-label{font-size:18px}}@media (max-width: 640px) and (orientation: portrait){#ai-video{inset:8vh 0 auto 0;height:auto;aspect-ratio:16 / 9;object-fit:contain;object-position:center;filter:contrast(1.08) saturate(.96) brightness(.9)}.overlay{align-items:flex-end;justify-content:flex-start;padding:16px 14px max(86px,env(safe-area-inset-bottom));background:linear-gradient(180deg,#02020261,#040302e6 64%)}.panel{width:min(330px,100%);padding:24px 18px;gap:14px}.score-row{gap:5px}.score-btn{width:31px;height:31px;font-size:12px}.hint{font-size:16px}#hud{padding-bottom:max(26px,env(safe-area-inset-bottom))}.hit-btn{width:104px;height:104px}}