.game-screen { background: #020204; }
#gameCanvas { display:block; width:100%; height:100%; touch-action:none; }
.hud { position:absolute; top:0; left:0; right:0; display:grid; grid-template-columns: 1fr auto 1fr; gap:20px; padding: max(18px, env(safe-area-inset-top)) 26px 16px; background: linear-gradient(180deg, rgba(0,0,0,.84), transparent); pointer-events:none; }
.hud-block { display:flex; flex-direction:column; gap:4px; }
.hud-block span, .hud-center { color: var(--muted); font-size:.72rem; letter-spacing:.18em; }
.hud-block strong { font-size:clamp(1.3rem,3vw,2.2rem); letter-spacing:.08em; }
.hud-temp { text-align:right; }
.hud-center { align-self:center; color:#b9ffc8; text-shadow:0 0 14px rgba(80,255,130,.45); }
.temperature-track { position:absolute; top:86px; left:26px; right:26px; height:8px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); overflow:hidden; }
.safe-zone { position:absolute; left:30%; width:40%; inset-block:0; background:rgba(55,255,145,.22); border-inline:1px solid rgba(55,255,145,.55); }
.temperature-fill { position:absolute; inset:0 auto 0 0; width:50%; background:linear-gradient(90deg,#41dfff,#ffb000,#ff3900); box-shadow:0 0 18px rgba(255,100,0,.7); transition:width .2s ease; }
.ghost-button { position:absolute; left:24px; bottom:max(22px, env(safe-area-inset-bottom)); padding:10px 14px; border:1px solid var(--line); background:rgba(0,0,0,.35); color:#cbd0d5; letter-spacing:.12em; font-size:.72rem; cursor:pointer; backdrop-filter:blur(8px); }
.build-label { position:absolute; right:24px; bottom:max(26px, env(safe-area-inset-bottom)); color:rgba(255,255,255,.36); font-size:.65rem; letter-spacing:.12em; pointer-events:none; }
@media (max-width: 650px) {
  .hud { padding-inline:14px; gap:8px; }
  .hud-center { display:none; }
  .hud { grid-template-columns:1fr 1fr; }
  .temperature-track { left:14px; right:14px; top:80px; }
  .ghost-button { left:14px; }
  .build-label { right:14px; }
}
.hud-center { display:flex; flex-direction:column; align-items:center; gap:5px; }
#comboValue { color:#ffd27a; font-size:.7rem; letter-spacing:.18em; min-height:.8rem; text-shadow:0 0 12px rgba(255,138,0,.65); }
.temperature-fill.is-critical { animation: criticalPulse .42s ease-in-out infinite alternate; }
@keyframes criticalPulse { from { filter:brightness(1); } to { filter:brightness(1.8); } }
.game-over-overlay { position:absolute; inset:0; display:grid; place-items:center; padding:24px; background:rgba(0,0,0,.64); backdrop-filter:blur(10px); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .28s ease, visibility .28s; }
.game-over-overlay.is-visible { opacity:1; visibility:visible; pointer-events:auto; }
.game-over-panel { width:min(560px,92vw); padding:34px; border:1px solid rgba(255,106,0,.5); background:linear-gradient(145deg,rgba(18,8,7,.96),rgba(5,5,8,.94)); box-shadow:0 0 70px rgba(255,70,0,.22); text-align:center; }
.game-over-panel h2 { margin:0; font-size:clamp(2rem,5vw,4rem); line-height:.95; }
.game-over-reason { margin:16px 0 26px; color:#ff9b76; letter-spacing:.16em; font-size:.82rem; }
.game-over-stats { display:flex; justify-content:center; gap:42px; margin-bottom:28px; color:var(--muted); font-size:.72rem; letter-spacing:.14em; }
.game-over-stats span { display:flex; flex-direction:column; gap:6px; }
.game-over-stats strong { color:#fff; font-size:1.45rem; }
.game-over-actions { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; }
.secondary-button { padding:15px 24px; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.04); color:#fff; letter-spacing:.16em; font-weight:800; cursor:pointer; }
@media (max-width:650px) { .game-over-panel { padding:26px 20px; } .game-over-stats { gap:24px; } }

/* BUILD 0004 polish */
#scoreValue { display:inline-block; transform-origin:center; }
#scoreValue.score-bump { animation: scoreBump .18s ease-out; }
@keyframes scoreBump { 0%{transform:scale(1)} 45%{transform:scale(1.22);text-shadow:0 0 18px rgba(255,154,0,.9)} 100%{transform:scale(1)} }
.game-screen::after { content:""; position:absolute; inset:0; pointer-events:none; opacity:0; box-shadow:inset 0 0 120px rgba(255,40,0,.8); transition:opacity .25s ease; }
.game-screen.is-danger::after { opacity:.48; animation:dangerVignette .55s ease-in-out infinite alternate; }
@keyframes dangerVignette { from{opacity:.22} to{opacity:.62} }
.game-over-overlay.is-visible .game-over-panel { animation:panelImpact .42s cubic-bezier(.2,.9,.25,1.25) both; }
@keyframes panelImpact { from{opacity:0;transform:scale(.82)} to{opacity:1;transform:scale(1)} }


/* BUILD 0006 — Reactor Record ceremony */
.record-celebration { display:none; position:relative; margin:2px auto 24px; padding:22px 22px 18px; overflow:hidden; border:1px solid rgba(255,190,55,.75); background:radial-gradient(circle at 50% 0,rgba(255,169,0,.25),rgba(55,16,0,.72) 48%,rgba(5,5,8,.92)); box-shadow:0 0 42px rgba(255,126,0,.26),inset 0 0 28px rgba(255,174,0,.1); }
.record-celebration.is-visible { display:block; animation:recordReveal .72s .18s cubic-bezier(.15,.9,.2,1.18) both; }
.record-celebration::before,.record-celebration::after { content:""; position:absolute; width:170px; height:170px; top:-115px; border:1px solid rgba(255,208,95,.35); transform:rotate(45deg); animation:recordSpin 9s linear infinite; }
.record-celebration::before { left:-85px; } .record-celebration::after { right:-85px; animation-direction:reverse; }
.record-stars { color:#ffd06a; font-size:1rem; letter-spacing:.55em; padding-left:.55em; text-shadow:0 0 16px #ff7a00; animation:starsPulse .75s ease-in-out infinite alternate; }
.record-kicker { margin:9px 0 2px; color:#fff3cb; font-size:clamp(1rem,2.4vw,1.45rem); font-weight:900; letter-spacing:.26em; text-shadow:0 0 20px rgba(255,150,0,.9); }
.record-score { display:block; color:#fff; font-size:clamp(2.7rem,8vw,5.4rem); line-height:1; letter-spacing:.06em; text-shadow:0 0 10px #fff,0 0 30px #ff8a00,0 0 58px rgba(255,55,0,.8); animation:recordNumber .55s .62s cubic-bezier(.2,1.4,.35,1) both; }
.record-comparison { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:17px; }
.record-comparison > span { display:flex; flex-direction:column; gap:5px; padding:10px; border-top:1px solid rgba(255,255,255,.14); color:#a9a9ad; font-size:.58rem; letter-spacing:.13em; }
.record-comparison b { color:#fff; font-size:1rem; letter-spacing:.08em; }
.record-margin { min-height:1em; margin:12px 0 0; color:#ffd16d; font-size:.68rem; font-weight:800; letter-spacing:.18em; }
.has-new-record .game-over-stats { opacity:.62; transform:scale(.92); margin-bottom:19px; }
.has-new-record { border-color:rgba(255,190,55,.75); box-shadow:0 0 100px rgba(255,94,0,.34); }
@keyframes recordReveal { from{opacity:0;transform:translateY(18px) scale(.85);filter:brightness(2)} to{opacity:1;transform:none;filter:brightness(1)} }
@keyframes recordNumber { from{opacity:0;transform:scale(.55)} to{opacity:1;transform:scale(1)} }
@keyframes starsPulse { from{opacity:.55;transform:scale(.96)} to{opacity:1;transform:scale(1.08)} }
@keyframes recordSpin { to{transform:rotate(405deg)} }
@media (max-width:650px) { .record-celebration{padding:18px 13px 14px;margin-bottom:18px}.record-comparison{gap:4px}.record-kicker{letter-spacing:.18em}.game-over-panel.has-new-record{padding-top:22px} }
@media (prefers-reduced-motion:reduce) { .record-celebration,.record-stars,.record-score,.record-celebration::before,.record-celebration::after{animation:none!important} }