/* ═══════════════════════════════════════════════════════════════
   VOID BREAKER — Stylesheet
   ═══════════════════════════════════════════════════════════════ */

*{margin:0;padding:0;box-sizing:border-box}
body{overflow:hidden;background:#000;font-family:'Rajdhani',sans-serif;cursor:crosshair;user-select:none}

/* ── Canvases ──────────────────────────────────────────────── */
#gameCanvas{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:1}
#bloomCanvas{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:2;pointer-events:none;mix-blend-mode:screen;opacity:.55}

.hidden{display:none!important}

/* ── Overlays ──────────────────────────────────────────────── */
.overlay{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:rgba(4,4,18,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}

/* ── Menu ──────────────────────────────────────────────────── */
.menu-content{text-align:center;animation:fadeScale .8s ease both}
.title{font-family:'Orbitron',sans-serif;font-size:clamp(3rem,10vw,7rem);font-weight:900;line-height:1.05;letter-spacing:.12em;
  background:linear-gradient(135deg,#00ffff 0%,#ff00ff 50%,#00ffff 100%);background-size:200% 200%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  animation:gradShift 3s ease infinite;
  filter:drop-shadow(0 0 40px rgba(0,255,255,.45)) drop-shadow(0 0 80px rgba(255,0,255,.25))}
.tagline{font-family:'Orbitron',sans-serif;font-size:.85rem;color:rgba(255,255,255,.45);letter-spacing:.55em;margin:1.2rem 0 2.5rem}
.controls-info{color:rgba(255,255,255,.35);font-size:.85rem;line-height:2.2;letter-spacing:.08em;margin-bottom:2.2rem}
.controls-info .key{color:rgba(0,255,255,.7);font-family:'Orbitron',sans-serif;font-size:.72rem;font-weight:700;border:1px solid rgba(0,255,255,.25);padding:2px 8px;border-radius:3px;margin:0 2px}
.highscore{margin-top:1.8rem;font-family:'Orbitron',sans-serif;font-size:.8rem;color:rgba(255,215,0,.65);letter-spacing:.15em}

/* ── Buttons ───────────────────────────────────────────────── */
.neon-btn{font-family:'Orbitron',sans-serif;font-size:1.1rem;font-weight:700;padding:1rem 3.5rem;
  border:2px solid #00ffff;background:transparent;color:#00ffff;cursor:pointer;letter-spacing:.25em;
  text-transform:uppercase;position:relative;transition:all .25s ease;outline:none}
.neon-btn:hover{background:rgba(0,255,255,.12);box-shadow:0 0 35px rgba(0,255,255,.35),inset 0 0 35px rgba(0,255,255,.08);transform:scale(1.06)}
.neon-btn:active{transform:scale(.97)}

/* ── HUD ───────────────────────────────────────────────────── */
#hud{position:fixed;inset:0;z-index:50;pointer-events:none;padding:1.2rem 2rem}
.hud-left{position:absolute;top:1.2rem;left:2rem}
.hud-right{position:absolute;top:1.2rem;right:2rem}
.hud-center{position:absolute;top:45%;left:50%;transform:translate(-50%,-50%)}
.hud-label{display:block;font-family:'Orbitron',sans-serif;font-size:.6rem;color:rgba(255,255,255,.45);letter-spacing:.35em}
.hud-value{display:block;font-family:'Orbitron',sans-serif;font-size:2rem;font-weight:700;color:#fff;text-shadow:0 0 18px rgba(0,255,255,.7)}
.hud-value.wave-val{color:#ff00ff;text-shadow:0 0 18px rgba(255,0,255,.7)}
.combo-text{font-family:'Orbitron',sans-serif;font-size:2rem;font-weight:900;color:#ffd700;text-shadow:0 0 20px rgba(255,215,0,.7);opacity:0;transition:opacity .2s,transform .2s}

.hud-bottom-bar{position:absolute;bottom:1.2rem;left:2rem;display:flex;align-items:center;gap:1.5rem}
.health-bar{display:flex;gap:5px}
.hp-pip{width:26px;height:7px;border-radius:2px;background:#00ffff;box-shadow:0 0 10px rgba(0,255,255,.55);transition:all .25s}
.hp-pip.lost{background:rgba(255,255,255,.08);box-shadow:none}
.resource-group{display:flex;align-items:center;gap:1rem}
.bomb-pips{display:flex;gap:4px}
.bomb-pip{width:11px;height:11px;border-radius:50%;background:#ff00ff;box-shadow:0 0 8px rgba(255,0,255,.55)}
.bomb-pip.used{background:rgba(255,255,255,.08);box-shadow:none}
.dash-bar-wrap{width:55px;height:4px;background:rgba(255,255,255,.08);border-radius:2px;overflow:hidden}
.dash-bar{height:100%;width:100%;background:#00ff88;box-shadow:0 0 6px rgba(0,255,136,.5);transition:width .08s linear}

/* ── Wave Announce ─────────────────────────────────────────── */
.wave-announce{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:60;pointer-events:none}
.wave-announce span{font-family:'Orbitron',sans-serif;font-size:clamp(2rem,5vw,3.5rem);font-weight:900;color:#fff;
  text-shadow:0 0 40px rgba(0,255,255,.7),0 0 80px rgba(255,0,255,.35);letter-spacing:.3em;
  animation:waveAnim 2.2s ease forwards}

/* ── Pause ─────────────────────────────────────────────────── */
.pause-content{text-align:center}
.pause-content h2{font-family:'Orbitron',sans-serif;font-size:3rem;color:#fff;letter-spacing:.35em;margin-bottom:2rem;
  text-shadow:0 0 30px rgba(255,255,255,.3)}

/* ── Game Over ─────────────────────────────────────────────── */
.gameover-content{text-align:center;animation:fadeScale .5s ease both}
.gameover-title{font-family:'Orbitron',sans-serif;font-size:clamp(2.5rem,6vw,4.5rem);font-weight:900;color:#ff3344;
  text-shadow:0 0 50px rgba(255,51,68,.7);letter-spacing:.2em;margin-bottom:2rem}
.final-stats{display:flex;flex-direction:column;gap:.8rem;margin-bottom:2rem}
.stat-row{display:flex;justify-content:space-between;gap:3rem;padding:.5rem 1.5rem;border-bottom:1px solid rgba(255,255,255,.07)}
.stat-label{font-family:'Orbitron',sans-serif;font-size:.65rem;color:rgba(255,255,255,.4);letter-spacing:.2em;align-self:center}
.stat-val{font-family:'Orbitron',sans-serif;font-size:1.15rem;font-weight:700;color:#fff}
.new-hs{font-family:'Orbitron',sans-serif;font-size:1.1rem;color:#ffd700;text-shadow:0 0 20px rgba(255,215,0,.7);margin-bottom:1.8rem;animation:pulse .7s ease infinite alternate}

/* ── Keyframes ─────────────────────────────────────────────── */
@keyframes fadeScale{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}
@keyframes gradShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@keyframes waveAnim{0%{opacity:0;transform:scale(2.5)}15%{opacity:1;transform:scale(1)}75%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.7)}}
@keyframes pulse{from{opacity:.5}to{opacity:1}}