:root{--bg: #0a0a14;--panel: #14142208;--panel-border: #2a2a44;--text: #e8e8f2;--muted: #9a9ab2;--accent: #8066e6;--accent-soft: #8066e633;--good: #4ade80;--bad: #f87171;--meh: #fbbf24}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,sans-serif;line-height:1.55;min-height:100vh}.wrap{max-width:680px;margin:0 auto;padding:28px 16px 60px}header h1{font-size:1.6rem;letter-spacing:.01em}.accent{color:var(--accent);font-weight:400}.sub{color:var(--muted);font-size:.92rem;margin-top:6px}.sub code{color:var(--text);font-size:.85em}.stage{position:relative;margin-top:18px;border:1px solid var(--panel-border);border-radius:10px;overflow:hidden;background:#000}#game{display:block;width:100%;aspect-ratio:3 / 2;cursor:crosshair;touch-action:manipulation}.banner{position:absolute;left:0;right:0;bottom:0;padding:7px 14px;font-size:.9rem;background:#0a0a14b8;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:var(--text);border-top:1px solid #ffffff14}.banner.good{color:var(--good)}.banner.bad{color:var(--bad)}.banner.meh{color:var(--meh)}.hud{display:flex;gap:18px;align-items:stretch;margin-top:14px;flex-wrap:wrap}.hud-left{display:flex;flex-direction:column;gap:8px;justify-content:center}.stat{display:flex;align-items:baseline;gap:10px}.stat-label{color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;width:44px}.stat-value{font-size:1.25rem;font-variant-numeric:tabular-nums;min-width:60px}.qpanel{flex:1;min-width:260px;display:flex;flex-direction:column;gap:5px;padding:10px 12px;border:1px solid var(--panel-border);border-radius:10px}.qrow{display:flex;align-items:center;gap:8px}.qname{width:38px;font-size:.75rem;color:var(--muted)}.qtrack{flex:1;height:10px;background:#ffffff0d;border-radius:5px;overflow:hidden}.qfill{height:100%;width:0%;background:#55557a;border-radius:5px;transition:width 60ms linear}.qfill.chosen{background:var(--accent)}.qval{width:52px;text-align:right;font-size:.72rem;color:var(--muted);font-variant-numeric:tabular-nums}.controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px}.mode-group{display:flex;border:1px solid var(--panel-border);border-radius:8px;overflow:hidden}.mode-group .btn{border:none;border-radius:0}.btn{background:transparent;border:1px solid var(--panel-border);border-radius:8px;color:var(--text);padding:8px 14px;font-size:.85rem;cursor:pointer;transition:background .12s,border-color .12s}.btn:hover{background:var(--accent-soft);border-color:var(--accent)}.btn.active{background:var(--accent);color:#fff}.check{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:.85rem;cursor:pointer;-webkit-user-select:none;user-select:none}.check input{accent-color:var(--accent)}.touch-controls{display:flex;gap:10px;margin-top:12px;justify-content:center}.touch-controls.hidden,.hidden{display:none}.btn.touch{flex:1;max-width:140px;padding:14px 0;font-size:1rem;touch-action:none}.about{margin-top:34px;border-top:1px solid var(--panel-border);padding-top:18px}.about h2{font-size:1.05rem;margin-bottom:8px}.about p{color:var(--muted);font-size:.9rem;margin-bottom:10px}.about em{color:var(--text)}