:root{--neon-cyan: #33fff2;--neon-pink: #ff3ad6;--neon-purple: #8a3aff;--neon-yellow: #fff54c;--bg-deep: #05030f;--panel-bg: rgba(10, 8, 30, .92);color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0;background:radial-gradient(ellipse at 50% -10%,#1a0f3a 0%,var(--bg-deep) 60%);color:#e9e6ff;font-family:Segoe UI,system-ui,-apple-system,sans-serif;height:100%;overflow:hidden}#app{display:flex;flex-direction:column;height:100vh;width:100vw}.topbar{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;background:linear-gradient(180deg,#140a2df2,#0a0619b3);border-bottom:1px solid rgba(255,255,255,.08);z-index:5}.logo{font-size:1.1rem;letter-spacing:.12em;margin:0;font-weight:800;text-shadow:0 0 8px var(--neon-cyan)}.logo span{color:var(--neon-pink);text-shadow:0 0 8px var(--neon-pink)}.hud{display:flex;align-items:center;gap:1rem}.hud-item{display:flex;flex-direction:column;align-items:center;line-height:1.1}.hud-label{font-size:.6rem;letter-spacing:.15em;color:#9a92d8}.hud-value{font-size:1.2rem;font-weight:700;color:var(--neon-yellow);text-shadow:0 0 6px rgba(255,245,76,.6);font-variant-numeric:tabular-nums}.icon-btn{background:#ffffff0f;border:1px solid rgba(255,255,255,.15);border-radius:50%;width:2.2rem;height:2.2rem;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem;transition:background .15s,transform .1s}.icon-btn:hover{background:#ffffff26}.icon-btn:active{transform:scale(.92)}.icon-btn .icon-muted,.icon-btn[aria-pressed=true] .icon-unmuted{display:none}.icon-btn[aria-pressed=true] .icon-muted{display:inline}.stage{position:relative;flex:1;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:0}#game-canvas{background:#060314;width:min(100%,960px);height:100%;max-height:100%;aspect-ratio:960 / 600;display:block;box-shadow:0 0 40px #8a3aff40 inset,0 0 30px #33fff214;touch-action:none}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#03020cc7;backdrop-filter:blur(3px);z-index:10;padding:1rem}.overlay.hidden{display:none}.panel{background:var(--panel-bg);border:1px solid rgba(138,58,255,.4);border-radius:14px;padding:1.5rem 1.75rem;max-width:460px;width:100%;max-height:90vh;overflow-y:auto;text-align:center;box-shadow:0 0 40px #8a3aff59,0 0 80px #33fff214}.panel h2{margin:0 0 .25rem;font-size:1.7rem;letter-spacing:.08em;color:var(--neon-cyan);text-shadow:0 0 10px var(--neon-cyan)}.tagline{color:#b8b0f0;margin:.25rem 0 1rem;font-size:.9rem}.controls-hint{font-size:.8rem;color:#cfc8ff;background:#ffffff0a;border-radius:8px;padding:.6rem .8rem;margin-bottom:1rem;display:grid;gap:.3rem;text-align:left}.primary-btn{background:linear-gradient(135deg,var(--neon-pink),var(--neon-purple));color:#fff;border:none;border-radius:8px;padding:.7rem 1.5rem;font-size:1rem;font-weight:700;letter-spacing:.05em;cursor:pointer;box-shadow:0 0 18px #ff3ad673;transition:transform .1s,box-shadow .15s;width:100%}.primary-btn:hover{box-shadow:0 0 26px #ff3ad6b3}.primary-btn:active{transform:scale(.97)}.secondary-btn{margin-top:.75rem;background:transparent;border:1px solid var(--neon-cyan);color:var(--neon-cyan);border-radius:8px;padding:.6rem 1.4rem;font-weight:600;letter-spacing:.05em;cursor:pointer;width:100%}.secondary-btn:hover{background:#33fff21a}.leaderboard-section{margin-top:1.25rem;text-align:left}.leaderboard-section h3{font-size:.85rem;letter-spacing:.1em;color:var(--neon-yellow);margin:0 0 .5rem}.leaderboard{list-style:none;margin:0;padding:0;font-size:.85rem;max-height:220px;overflow-y:auto}.leaderboard ol{margin:0;padding:0;list-style:none}.leaderboard li{display:flex;justify-content:space-between;padding:.3rem .4rem;border-bottom:1px solid rgba(255,255,255,.06)}.leaderboard li:nth-child(odd){background:#ffffff05}.lb-rank{color:#8f88c9;width:1.6rem;display:inline-block}.lb-name{flex:1;color:#e9e6ff;text-align:left;margin-left:.4rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-score{color:var(--neon-cyan);font-weight:700}.lb-loading,.lb-empty,.lb-error{color:#9a92d8;font-size:.8rem;padding:.4rem}.lb-error{color:#ff8080}.score-form{display:flex;flex-direction:column;gap:.5rem;margin:1rem 0}.score-form label{font-size:.75rem;color:#b8b0f0;text-align:left}.score-form input{background:#ffffff0f;border:1px solid rgba(255,255,255,.2);border-radius:6px;padding:.55rem .7rem;color:#fff;font-size:1rem}.score-form input:focus{outline:none;border-color:var(--neon-cyan);box-shadow:0 0 8px #33fff266}.submit-status{min-height:1.2rem;font-size:.8rem;color:#9a92d8}.submit-status.ok{color:#6ef29b}.submit-status.error{color:#ff8080}.final-score{font-size:1.1rem;color:var(--neon-yellow);margin:.25rem 0 .75rem}.final-score span{font-weight:800}.footer{text-align:center;font-size:.7rem;color:#6a638f;padding:.3rem;background:#05030fcc}.touch-controls{position:absolute;bottom:0;left:0;right:0;display:none;justify-content:space-between;align-items:flex-end;padding:1.2rem;pointer-events:none;z-index:8}.stick-zone{width:120px;height:120px;pointer-events:auto}.stick-base{width:100%;height:100%;border-radius:50%;background:#ffffff14;border:2px solid rgba(51,255,242,.4);display:flex;align-items:center;justify-content:center;position:relative}.stick-nub{width:48px;height:48px;border-radius:50%;background:radial-gradient(circle,var(--neon-cyan),var(--neon-purple));box-shadow:0 0 14px #33fff299;position:absolute;transition:transform .05s linear}.fire-btn{width:84px;height:84px;border-radius:50%;background:radial-gradient(circle,var(--neon-pink),var(--neon-purple));border:2px solid rgba(255,58,214,.6);color:#fff;font-weight:800;letter-spacing:.05em;box-shadow:0 0 18px #ff3ad680;pointer-events:auto;font-size:.8rem}.fire-btn:active{transform:scale(.92)}@media (max-width: 720px),(pointer: coarse){.touch-controls{display:flex}.controls-hint{display:none}}@media (max-width: 480px){.logo{font-size:.9rem}.hud-value{font-size:1rem}.panel{padding:1.1rem 1rem}}