html,body{margin:0;padding:0;overflow:hidden;width:100%;height:100%;background:#0a0a2e}canvas{display:block;width:100%;height:100%}#hud{position:fixed;right:24px;bottom:24px;z-index:2;padding:12px 20px;background:#0a0a2ebf;border:1px solid rgba(0,255,255,.3);border-radius:8px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);box-shadow:0 0 20px #00ffff26;box-sizing:border-box;user-select:none;pointer-events:none}#score-hud{position:fixed;right:24px;top:24px;z-index:2;padding:12px 20px;background:#0a0a2ebf;border:1px solid rgba(0,255,255,.3);border-radius:8px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);box-shadow:0 0 20px #00ffff26;box-sizing:border-box;user-select:none;pointer-events:none;text-align:right}.hud-text{font-family:Segoe UI,Courier New,monospace;color:#0ff;letter-spacing:2px;font-size:20px;font-weight:600;text-shadow:0 0 8px rgba(0,255,255,.6);line-height:1.4;margin:0}.hud-label{font-size:12px;opacity:.8;letter-spacing:2px;text-transform:uppercase;margin:0 0 2px}#vignette{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1;pointer-events:none;background:radial-gradient(ellipse at center,#0000 55%,#00000059)}.ui-overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:auto;box-sizing:border-box;font-family:Segoe UI,Courier New,monospace;color:#0ff;user-select:none}.ui-hidden{display:none!important}.ui-visible{display:flex}.ui-fade-in{animation:uiFadeIn .3s ease-out forwards}@keyframes uiFadeIn{0%{opacity:0}to{opacity:1}}.ui-menu-overlay{background:#0a0a2ed9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);gap:24px;padding:40px}.ui-title{font-size:3.5rem;font-weight:700;letter-spacing:6px;text-align:center;color:#0ff;text-shadow:0 0 10px rgba(0,255,255,.8),0 0 20px rgba(0,255,255,.5),0 0 40px rgba(0,255,255,.3),0 0 80px rgba(0,255,255,.2);margin:0}.ui-button{font-family:Segoe UI,Courier New,monospace;font-size:16px;font-weight:600;letter-spacing:3px;text-transform:uppercase;padding:14px 36px;border-radius:6px;cursor:pointer;transition:all .25s ease;outline:none;border:1px solid #00ffff}.ui-button-primary{background:#0ff;color:#0a0a2e;border-color:#0ff;box-shadow:0 0 10px #00ffff80,0 0 20px #00ffff4d,0 0 40px #0ff3}.ui-button-primary:hover{background:#6ff;box-shadow:0 0 15px #0ffc,0 0 30px #00ffff80,0 0 60px #00ffff4d;transform:translateY(-2px)}.ui-button-primary:active{transform:translateY(0);box-shadow:0 0 8px #0ff6,0 0 16px #0ff3}.ui-button-secondary{background:transparent;color:#0ff;border-color:#0ff9}.ui-button-secondary:hover{background:#00ffff1a;border-color:#0ff;box-shadow:0 0 10px #0ff6,0 0 20px #0ff3;transform:translateY(-2px)}.ui-button-secondary:active{transform:translateY(0);box-shadow:0 0 6px #00ffff4d}.ui-how-to-play{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;max-width:420px}.ui-how-to-play-toggle{font-family:Segoe UI,Courier New,monospace;font-size:13px;font-weight:600;letter-spacing:2px;text-transform:uppercase;padding:10px 24px;border-radius:6px;cursor:pointer;transition:all .25s ease;outline:none;background:transparent;color:#0ff;border:1px solid rgba(0,255,255,.4)}.ui-how-to-play-toggle:hover{background:#00ffff1a;border-color:#0ff;box-shadow:0 0 10px #00ffff4d}.ui-how-to-play-content{background:#0a0a2ecc;border:1px solid rgba(0,255,255,.3);border-radius:8px;padding:16px 24px;margin-top:4px;width:100%;box-sizing:border-box;box-shadow:0 0 20px #00ffff1a}.ui-how-to-play-content.ui-hidden{display:none}.ui-controls-list{display:flex;flex-direction:column;gap:8px}.ui-control-item{font-size:14px;letter-spacing:1px;color:#0ff;text-shadow:0 0 6px rgba(0,255,255,.4);margin:0;line-height:1.6}.ui-countdown-overlay{background:transparent;pointer-events:none}.ui-countdown-number{font-size:8rem;font-weight:700;letter-spacing:8px;color:#0ff;text-shadow:0 0 15px rgba(0,255,255,.9),0 0 30px rgba(0,255,255,.6),0 0 60px rgba(0,255,255,.4),0 0 120px rgba(0,255,255,.2);opacity:0}.ui-countdown-anim{animation:uiCountdownPop .9s ease-out forwards}@keyframes uiCountdownPop{0%{opacity:0;transform:scale(.5)}60%{opacity:1;transform:scale(1.2)}to{opacity:1;transform:scale(1)}}.ui-pause-overlay{background:#0009;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);gap:32px;padding:40px}.ui-heading{font-size:3rem;font-weight:700;letter-spacing:6px;text-align:center;color:#0ff;text-shadow:0 0 10px rgba(0,255,255,.8),0 0 20px rgba(0,255,255,.5),0 0 40px rgba(0,255,255,.3);margin:0}.ui-button-container{display:flex;flex-direction:column;gap:16px;align-items:center;width:100%;max-width:320px}.ui-button-container .ui-button{width:100%;box-sizing:border-box;text-align:center}.ui-gameover-overlay{background:#000000b3;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);gap:32px;padding:40px}.ui-final-score{display:flex;flex-direction:column;align-items:center;gap:8px}.ui-final-score-label{font-size:14px;letter-spacing:4px;text-transform:uppercase;color:#00ffffb3;text-shadow:0 0 6px rgba(0,255,255,.3)}.ui-final-score-value{font-size:4rem;font-weight:700;letter-spacing:4px;color:#0ff;text-shadow:0 0 10px rgba(0,255,255,.8),0 0 20px rgba(0,255,255,.5),0 0 40px rgba(0,255,255,.3)}@media(max-width:768px){.ui-title{font-size:2.2rem;letter-spacing:4px}.ui-countdown-number{font-size:5rem}.ui-heading{font-size:2.2rem}.ui-final-score-value{font-size:3rem}.ui-button{font-size:14px;padding:12px 28px}.ui-menu-overlay,.ui-pause-overlay,.ui-gameover-overlay{padding:24px}}.ui-subtitle-text{font-size:16px;letter-spacing:3px;color:#0ff9;text-shadow:0 0 8px rgba(0,255,255,.3);text-transform:uppercase;user-select:none;margin-top:-8px}