:root{--bg: #04040a;--neon: #38e1ff;--neon2: #ff3df0;--rim: #ffd400;--txt: #cfefff}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;background:var(--bg);color:var(--txt);font-family:Segoe UI,system-ui,sans-serif;overflow:hidden}#app{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}#hud{position:fixed;top:0;left:0;right:0;display:flex;gap:1.4rem;justify-content:center;padding:.5rem 1rem;font-variant-numeric:tabular-nums;letter-spacing:.08em;font-size:.95rem;text-shadow:0 0 8px var(--neon);pointer-events:none;z-index:5}#hud .lbl{opacity:.6;margin-right:.3rem}canvas{display:block;background:radial-gradient(circle at 50% 45%,#0a0a18,#04040a 70%);image-rendering:auto;touch-action:none}#overlay{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;text-align:center;background:#020208c7;z-index:10}#overlay.hidden{display:none}#overlay h1{font-size:3rem;margin:0;letter-spacing:.25em;color:var(--neon);text-shadow:0 0 18px var(--neon),0 0 40px var(--neon2)}#overlay p{margin:.2rem;max-width:30rem;line-height:1.5;opacity:.85}#overlay button{margin-top:.6rem;padding:.7rem 1.8rem;font-size:1.1rem;letter-spacing:.15em;color:var(--bg);background:var(--neon);border:none;border-radius:4px;cursor:pointer;box-shadow:0 0 16px var(--neon)}#overlay button:hover{background:var(--neon2);box-shadow:0 0 22px var(--neon2)}.keys{font-size:.85rem;opacity:.6}