:root{--bg: #05060d;--ink: #d7e2ff;--accent: #58e0ff;--warn: #ff7a59}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:Segoe UI,system-ui,sans-serif;-webkit-user-select:none;user-select:none}#app{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:16px}h1{margin:0;font-size:22px;letter-spacing:3px;color:var(--accent);text-shadow:0 0 12px rgba(88,224,255,.4)}.wrap{position:relative;border:2px solid #1b2440;border-radius:10px;box-shadow:0 0 40px #0009;background:#02030a}canvas{display:block;border-radius:8px}.hud{display:flex;flex-wrap:wrap;gap:16px;font-size:14px;font-variant-numeric:tabular-nums}.hud b{color:var(--accent)}.help{max-width:720px;font-size:12px;line-height:1.6;color:#8da0c8;text-align:center}.help kbd{background:#141d33;border:1px solid #2a3858;border-radius:4px;padding:1px 6px;color:#cfe;font-family:inherit}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:#02040cd1;border-radius:8px;text-align:center}.overlay.hidden{display:none}.overlay h2{margin:0;font-size:28px;color:var(--accent);letter-spacing:2px}.overlay p{margin:0;color:#aab8da}button.btn{background:var(--accent);color:#04121a;border:none;border-radius:8px;padding:10px 22px;font-size:15px;font-weight:700;letter-spacing:1px;cursor:pointer}button.btn:hover{filter:brightness(1.1)}