/* ============================================================
   CYBERVORE://2026 — Hoja de estilos premium (neon noir)
   ============================================================ */
:root{
  --bg-deep:#04060e;
  --bg-panel:rgba(8,14,28,.92);
  --cyan:#00f0ff;
  --magenta:#ff2bd6;
  --violet:#8b5cff;
  --red:#ff3355;
  --orange:#ff9f1c;
  --green:#39ffb4;
  --text:#cfe8ff;
  --dim:#5a7a9c;
  --font-display:'Orbitron',sans-serif;
  --font-mono:'Share Tech Mono',monospace;
}

*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow:hidden}
body{
  background:var(--bg-deep);
  color:var(--text);
  font-family:var(--font-mono);
  -webkit-user-select:none;user-select:none;
  -webkit-tap-highlight-color:transparent;
  touch-action:none;
}

/* ---------- Overlays globales ---------- */
#crt-overlay{
  position:fixed;inset:0;pointer-events:none;z-index:90;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.13) 0 1px,transparent 1px 3px);
  mix-blend-mode:overlay;opacity:.55;
}
#vignette-overlay{
  position:fixed;inset:0;pointer-events:none;z-index:91;
  background:radial-gradient(ellipse at center,transparent 55%,rgba(2,4,10,.75) 100%);
}

/* ---------- Sistema de pantallas ---------- */
.screen{
  position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;transform:scale(1.03);
  transition:opacity .45s ease,transform .45s ease,visibility .45s;
  z-index:10;
}
.screen.active{opacity:1;visibility:visible;transform:scale(1);z-index:20}

/* ---------- Glitch text ---------- */
.glitch{position:relative;display:inline-block}
.glitch::before,.glitch::after{
  content:attr(data-text);position:absolute;inset:0;opacity:.8;
}
.glitch::before{color:var(--cyan);animation:glitchA 3.2s infinite steps(2)}
.glitch::after{color:var(--magenta);animation:glitchB 2.7s infinite steps(2)}
@keyframes glitchA{0%,92%,100%{transform:none;clip-path:none}93%{transform:translate(-3px,1px);clip-path:inset(10% 0 60% 0)}96%{transform:translate(2px,-1px);clip-path:inset(60% 0 5% 0)}}
@keyframes glitchB{0%,90%,100%{transform:none;clip-path:none}91%{transform:translate(3px,-2px);clip-path:inset(40% 0 30% 0)}95%{transform:translate(-2px,2px);clip-path:inset(5% 0 75% 0)}}

/* ---------- Boot screen ---------- */
#boot-screen{background:var(--bg-deep);flex-direction:column}
.boot-core{text-align:center;width:min(480px,86vw)}
.boot-logo{
  font-family:var(--font-display);font-weight:900;font-size:clamp(2.2rem,8vw,4rem);
  letter-spacing:.18em;color:#fff;
  text-shadow:0 0 18px var(--cyan),0 0 60px rgba(0,240,255,.4);
}
.boot-sub{color:var(--dim);letter-spacing:.35em;margin:.6rem 0 2.4rem;font-size:.8rem}
.boot-bar-wrap{height:4px;background:rgba(0,240,255,.12);border-radius:2px;overflow:hidden}
.boot-bar{height:100%;width:0;background:linear-gradient(90deg,var(--cyan),var(--magenta));box-shadow:0 0 12px var(--cyan);transition:width .2s}
.boot-log{margin-top:1.2rem;color:var(--cyan);font-size:.78rem;min-height:1.2em;opacity:.85}

/* ---------- Menú ---------- */
#menu-screen{flex-direction:column}
#menu-bg-canvas{position:absolute;inset:0;width:100%;height:100%}
.menu-core{position:relative;text-align:center;z-index:2;padding:2rem;
  animation:menuIn .8s cubic-bezier(.2,.9,.3,1) both}
@keyframes menuIn{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
.game-title{
  font-family:var(--font-display);font-weight:900;
  font-size:clamp(2.6rem,10vw,5.5rem);letter-spacing:.14em;color:#fff;
  text-shadow:0 0 25px var(--cyan),0 0 90px rgba(0,240,255,.45),0 0 140px rgba(255,43,214,.3);
}
.game-subtitle{letter-spacing:.5em;color:var(--dim);margin:.8rem 0 3rem;font-size:clamp(.65rem,2vw,.9rem)}
.game-subtitle .ver{color:var(--magenta)}
.menu-nav{display:flex;flex-direction:column;gap:.9rem;align-items:center}

.menu-btn{
  font-family:var(--font-display);font-weight:700;letter-spacing:.22em;
  font-size:.95rem;color:var(--text);cursor:pointer;
  background:linear-gradient(180deg,rgba(0,240,255,.06),rgba(0,240,255,.02));
  border:1px solid rgba(0,240,255,.35);
  padding:.95rem 2.6rem;min-width:min(340px,80vw);
  clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);
  transition:all .22s ease;position:relative;
}
.menu-btn:hover,.menu-btn:focus-visible{
  color:#fff;border-color:var(--cyan);
  background:linear-gradient(180deg,rgba(0,240,255,.22),rgba(0,240,255,.06));
  box-shadow:0 0 26px rgba(0,240,255,.35),inset 0 0 18px rgba(0,240,255,.12);
  transform:translateY(-2px);outline:none;
}
.menu-btn:active{transform:translateY(1px) scale(.98)}
.menu-btn.primary{border-color:var(--cyan);color:#fff;
  background:linear-gradient(180deg,rgba(0,240,255,.2),rgba(139,92,255,.1));
  box-shadow:0 0 22px rgba(0,240,255,.25)}
.btn-icon{color:var(--cyan);margin-right:.4em}
.menu-footer{margin-top:3rem;display:flex;gap:2.5rem;justify-content:center;color:var(--dim);font-size:.78rem;letter-spacing:.15em}
.blink{animation:blink 1.4s steps(2) infinite;color:var(--green)}
@keyframes blink{50%{opacity:.25}}

/* ---------- Paneles ---------- */
.panel{
  background:var(--bg-panel);border:1px solid rgba(0,240,255,.25);
  box-shadow:0 0 60px rgba(0,240,255,.12),inset 0 0 40px rgba(0,20,40,.6);
  padding:clamp(1.2rem,4vw,2.6rem);max-width:min(860px,94vw);max-height:92vh;overflow-y:auto;
  clip-path:polygon(22px 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%,0 22px);
  text-align:center;
}
.panel-title{
  font-family:var(--font-display);font-weight:700;letter-spacing:.3em;
  color:var(--cyan);font-size:clamp(1rem,3.4vw,1.5rem);margin-bottom:1.6rem;
  text-shadow:0 0 14px rgba(0,240,255,.6);
}

/* ---------- Tutorial ---------- */
.howto-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.9rem;margin-bottom:1.8rem;text-align:left}
.howto-card{
  border:1px solid rgba(139,92,255,.25);background:rgba(139,92,255,.05);
  padding:.9rem 1rem;transition:all .2s;
}
.howto-card:hover{border-color:var(--violet);background:rgba(139,92,255,.12);transform:translateY(-2px)}
.howto-card h3{font-family:var(--font-display);font-size:.78rem;letter-spacing:.12em;color:#fff;margin-bottom:.45rem}
.howto-card p{font-size:.8rem;line-height:1.5;color:var(--text);opacity:.85}
kbd{
  font-family:var(--font-mono);background:rgba(0,240,255,.12);border:1px solid rgba(0,240,255,.4);
  border-radius:3px;padding:.05em .45em;color:var(--cyan);font-size:.85em;
}
.c-cyan{color:var(--cyan)}.c-magenta{color:var(--magenta)}.c-violet{color:var(--violet)}
.c-red{color:var(--red)}.c-orange{color:var(--orange)}

/* ---------- Juego ---------- */
#game-screen{background:var(--bg-deep)}
#game-viewport{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}
#game-canvas{display:block;max-width:100%;max-height:100%}

/* HUD */
.hud{position:absolute;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:.8rem 1.2rem;pointer-events:none;z-index:30}
#hud-top{top:0}
.hud-block{min-width:120px}
.hud-center{text-align:center}
.hud-right{text-align:right}
.hud-label{font-size:.62rem;letter-spacing:.3em;color:var(--dim)}
.hud-value{
  font-family:var(--font-display);font-weight:700;font-size:clamp(1.1rem,3vw,1.7rem);
  color:#fff;text-shadow:0 0 12px rgba(0,240,255,.7);
}
.hud-combo{
  font-family:var(--font-display);font-weight:700;color:var(--magenta);
  font-size:.95rem;min-height:1.3em;text-shadow:0 0 10px rgba(255,43,214,.8);
  transition:transform .15s;
}
.hud-combo.pop{transform:scale(1.35)}
.hud-lives{display:flex;gap:.4rem;justify-content:flex-end;margin:.2rem 0 .35rem}
.life-core{
  width:14px;height:14px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#bffaff,var(--cyan) 60%,rgba(0,240,255,.2));
  box-shadow:0 0 10px var(--cyan);
}
.life-core.lost{background:rgba(90,122,156,.25);box-shadow:none}
.hud-energy-wrap{width:130px;height:5px;background:rgba(0,240,255,.12);margin-left:auto;border-radius:3px;overflow:hidden}
.hud-energy{height:100%;width:0;background:linear-gradient(90deg,var(--cyan),var(--violet));box-shadow:0 0 8px var(--cyan);transition:width .3s}

/* Habilidades */
#hud-abilities{bottom:0;justify-content:center;gap:clamp(.6rem,2.5vw,1.4rem);padding-bottom:1rem;pointer-events:auto}
.ability{
  position:relative;width:clamp(52px,11vw,64px);height:clamp(52px,11vw,64px);
  background:rgba(8,14,28,.85);border:1px solid rgba(0,240,255,.4);cursor:pointer;
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
  display:flex;align-items:center;justify-content:center;transition:all .2s;
}
.ability svg{width:55%;height:55%;stroke:var(--cyan);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px rgba(0,240,255,.8))}
.ability:hover{border-color:var(--cyan);box-shadow:0 0 16px rgba(0,240,255,.35)}
.ability.ready{animation:abReady 2s ease infinite}
@keyframes abReady{0%,100%{box-shadow:0 0 8px rgba(0,240,255,.25)}50%{box-shadow:0 0 20px rgba(0,240,255,.6)}}
.ability-cd{
  position:absolute;inset:0;background:rgba(2,6,14,.82);transform-origin:bottom;
  transform:scaleY(0);pointer-events:none;
}
.ability-key{
  position:absolute;bottom:-1.15rem;left:50%;transform:translateX(-50%);
  font-size:.58rem;color:var(--dim);letter-spacing:.1em;
}
.ability.emp svg{stroke:var(--magenta);filter:drop-shadow(0 0 5px rgba(255,43,214,.8))}
.ability.emp{border-color:rgba(255,43,214,.45)}
.emp-charge{
  position:absolute;left:4px;right:4px;bottom:4px;height:3px;background:rgba(255,43,214,.15);
}
.emp-charge::after{
  content:'';position:absolute;left:0;top:0;bottom:0;width:var(--charge,0%);
  background:var(--magenta);box-shadow:0 0 6px var(--magenta);transition:width .3s;
}

/* Anuncios in-game */
#game-announce{
  position:absolute;top:34%;left:50%;transform:translate(-50%,-50%);
  font-family:var(--font-display);font-weight:900;letter-spacing:.25em;
  font-size:clamp(1.2rem,5vw,2.6rem);color:#fff;text-align:center;
  text-shadow:0 0 24px var(--cyan);pointer-events:none;opacity:0;z-index:40;
}
#game-announce.show{animation:announce 1.6s ease both}
@keyframes announce{0%{opacity:0;transform:translate(-50%,-50%) scale(1.6);filter:blur(6px)}18%{opacity:1;transform:translate(-50%,-50%) scale(1);filter:none}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-60%)}}

/* Pausa */
.overlay-panel{
  position:absolute;inset:0;z-index:50;display:flex;flex-direction:column;gap:1rem;
  align-items:center;justify-content:center;background:rgba(2,5,12,.85);backdrop-filter:blur(6px);
}
.hidden{display:none!important}

/* ---------- Pantallas finales ---------- */
#gameover-screen,#victory-screen{background:rgba(4,6,14,.96)}
.end-panel{min-width:min(560px,92vw)}
.end-title{
  font-family:var(--font-display);font-weight:900;letter-spacing:.15em;
  font-size:clamp(1.4rem,5.5vw,2.6rem);margin-bottom:1.6rem;
}
.end-title.c-red{text-shadow:0 0 24px rgba(255,51,85,.7)}
.end-title.c-cyan{text-shadow:0 0 24px rgba(0,240,255,.7)}
.victory-sub{color:var(--dim);letter-spacing:.2em;font-size:.8rem;margin-bottom:1.4rem}
.end-stats{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-bottom:1.8rem}
.end-stat{
  border:1px solid rgba(0,240,255,.18);background:rgba(0,240,255,.04);padding:.8rem;
}
.end-stat span{display:block;font-size:.62rem;letter-spacing:.25em;color:var(--dim);margin-bottom:.3rem}
.end-stat strong{font-family:var(--font-display);font-size:1.4rem;color:#fff;text-shadow:0 0 10px rgba(0,240,255,.6)}
.new-record{
  font-family:var(--font-display);font-weight:900;color:var(--green);letter-spacing:.3em;
  margin-bottom:1.4rem;text-shadow:0 0 16px rgba(57,255,180,.8);animation:blink 1s steps(2) infinite;
}
.end-panel .menu-btn{margin:.35rem auto;display:block}

/* ---------- Power-ups HUD ---------- */
.hud-powerups{
  position:absolute;top:72px;left:50%;transform:translateX(-50%);
  display:flex;gap:.6rem;z-index:30;pointer-events:none;
}
.pu-chip{
  display:flex;align-items:center;gap:.4rem;padding:.3rem .7rem;
  border:1px solid currentColor;background:rgba(8,14,28,.8);
  font-family:var(--font-display);font-size:.62rem;letter-spacing:.12em;
  clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);
  animation:puIn .3s ease both;position:relative;overflow:hidden;
}
@keyframes puIn{from{opacity:0;transform:translateY(-8px) scale(.9)}to{opacity:1;transform:none}}
.pu-chip .pu-bar{position:absolute;left:0;bottom:0;height:2px;background:currentColor;box-shadow:0 0 6px currentColor}

/* ---------- Boss bar ---------- */
.boss-bar{
  position:absolute;top:60px;left:50%;transform:translateX(-50%);
  width:min(420px,82vw);z-index:31;text-align:center;pointer-events:none;
  animation:puIn .4s ease both;
}
.boss-bar-label{
  font-family:var(--font-display);font-weight:700;letter-spacing:.2em;
  color:var(--red);font-size:.7rem;text-shadow:0 0 12px rgba(255,51,85,.8);margin-bottom:.3rem;
}
.boss-bar-track{height:9px;background:rgba(255,51,85,.15);border:1px solid rgba(255,51,85,.4);
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.boss-bar-fill{height:100%;width:100%;background:linear-gradient(90deg,var(--red),var(--orange));
  box-shadow:0 0 12px var(--red);transition:width .3s}

/* ---------- Ranking global ---------- */
.scores-panel,.settings-panel{min-width:min(560px,92vw)}
.leaderboard{margin-bottom:1.6rem;text-align:left;min-height:120px}
.lb-head,.lb-row{
  display:grid;grid-template-columns:42px 1fr 110px 56px;gap:.5rem;align-items:center;
  padding:.5rem .7rem;font-size:.82rem;
}
.lb-head{color:var(--dim);font-size:.62rem;letter-spacing:.2em;border-bottom:1px solid rgba(0,240,255,.2)}
.lb-row{border-bottom:1px solid rgba(0,240,255,.07)}
.lb-row:nth-child(2){color:#fff}
.lb-rank{font-family:var(--font-display);color:var(--cyan);text-align:center}
.lb-name{font-family:var(--font-mono);letter-spacing:.05em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-score{font-family:var(--font-display);color:#fff;text-align:right}
.lb-sec{text-align:center;color:var(--dim)}
.lb-row.me{background:rgba(0,240,255,.1);border-left:2px solid var(--cyan)}
.lb-offline{color:var(--dim);letter-spacing:.1em;text-align:center;padding:2rem 0}

/* ---------- Ajustes ---------- */
.settings-list{display:flex;flex-direction:column;gap:.7rem;margin-bottom:1.8rem}
.setting-row{
  display:flex;justify-content:space-between;align-items:center;
  background:rgba(0,240,255,.04);border:1px solid rgba(0,240,255,.2);
  padding:.85rem 1.1rem;cursor:pointer;color:var(--text);font-family:var(--font-mono);
  font-size:.85rem;letter-spacing:.05em;transition:all .2s;
}
.setting-row:hover{border-color:var(--cyan);background:rgba(0,240,255,.1)}
.toggle{
  font-family:var(--font-display);font-weight:700;letter-spacing:.15em;font-size:.75rem;
  padding:.2rem .8rem;border:1px solid var(--dim);color:var(--dim);
}
.toggle[data-on="true"]{color:var(--cyan);border-color:var(--cyan);box-shadow:0 0 10px rgba(0,240,255,.3)}

/* ---------- Envío de score ---------- */
.go-submit{margin-bottom:1.2rem;border:1px solid rgba(0,240,255,.2);background:rgba(0,240,255,.04);padding:1rem}
.go-submit-label{display:block;font-size:.62rem;letter-spacing:.2em;color:var(--dim);margin-bottom:.6rem}
.go-submit-row{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap}
#go-name{
  font-family:var(--font-mono);background:rgba(2,6,14,.8);border:1px solid rgba(0,240,255,.4);
  color:#fff;padding:.7rem 1rem;font-size:1rem;letter-spacing:.15em;text-transform:uppercase;
  width:min(220px,60vw);text-align:center;
}
#go-name:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 14px rgba(0,240,255,.35)}
.go-submit-btn{min-width:auto!important;padding:.7rem 1.4rem!important}
.go-submit-status{margin-top:.6rem;font-size:.75rem;letter-spacing:.1em;color:var(--green);min-height:1.1em}
.go-submit.sent{opacity:.6;pointer-events:none}

/* ---------- Reloj contrarreloj ---------- */
.hud-timer{
  position:absolute;top:60px;left:50%;transform:translateX(-50%);text-align:center;z-index:31;pointer-events:none;
}
.hud-timer-label{display:block;font-size:.6rem;letter-spacing:.3em;color:var(--dim)}
.hud-timer-value{
  font-family:var(--font-display);font-weight:900;font-size:clamp(1.4rem,4vw,2rem);color:#7fd4ff;
  text-shadow:0 0 14px rgba(127,212,255,.8);
}
.hud-timer.low .hud-timer-value{color:var(--red);text-shadow:0 0 16px rgba(255,51,85,.9);animation:blink .5s steps(2) infinite}

/* ---------- Selección de modo ---------- */
.mode-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-bottom:1.6rem}
.mode-card{
  display:flex;flex-direction:column;align-items:center;gap:.5rem;cursor:pointer;
  background:rgba(0,240,255,.04);border:1px solid rgba(0,240,255,.25);padding:1.6rem 1rem;
  color:var(--text);transition:all .2s;text-align:center;
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);
}
.mode-card:hover,.mode-card.active{border-color:var(--cyan);background:rgba(0,240,255,.12);
  box-shadow:0 0 24px rgba(0,240,255,.25);transform:translateY(-3px)}
.mode-icon{font-size:2.2rem;color:var(--cyan);text-shadow:0 0 14px var(--cyan)}
.mode-name{font-family:var(--font-display);font-weight:700;letter-spacing:.12em;font-size:.9rem;color:#fff}
.mode-desc{font-size:.74rem;line-height:1.4;color:var(--text);opacity:.78}

/* ---------- Garaje ---------- */
.garage-panel{min-width:min(720px,94vw)}
.garage-bytes{font-family:var(--font-display);color:var(--violet);letter-spacing:.18em;margin-bottom:1.2rem;
  text-shadow:0 0 12px rgba(139,92,255,.6)}
.garage-layout{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-bottom:1.6rem}
.garage-preview{display:flex;flex-direction:column;align-items:center;gap:1rem}
#skin-preview{border:1px solid rgba(0,240,255,.2);background:rgba(2,6,14,.6);
  clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px)}
.garage-info{text-align:center}
.garage-info h3{font-family:var(--font-display);color:#fff;letter-spacing:.1em;font-size:1rem;margin-bottom:.4rem}
.garage-info p{font-size:.78rem;color:var(--text);opacity:.8;margin-bottom:.9rem;min-height:2.4em}
#btn-skin-action{min-width:auto!important;padding:.7rem 1.6rem!important}
#btn-skin-action.disabled{opacity:.45;pointer-events:none;border-color:var(--dim)}
.garage-list{display:flex;flex-direction:column;gap:.5rem;max-height:340px;overflow-y:auto;text-align:left}
.skin-item{
  display:flex;align-items:center;gap:.8rem;cursor:pointer;
  background:rgba(0,240,255,.03);border:1px solid rgba(0,240,255,.15);padding:.6rem .8rem;
  color:var(--text);transition:all .18s;
}
.skin-item:hover{border-color:rgba(0,240,255,.5)}
.skin-item.sel{border-color:var(--cyan);background:rgba(0,240,255,.12)}
.skin-item.equipped .skin-item-status{color:var(--green)}
.skin-dot{width:26px;height:26px;border-radius:50%;flex-shrink:0;box-shadow:0 0 10px rgba(255,255,255,.3)}
.skin-meta{display:flex;flex-direction:column}
.skin-item-name{font-family:var(--font-display);font-size:.74rem;letter-spacing:.08em;color:#fff}
.skin-item-status{font-size:.66rem;color:var(--violet);letter-spacing:.08em}

/* ---------- Logros ---------- */
.ach-panel{min-width:min(680px,94vw)}
.ach-progress{font-family:var(--font-display);color:var(--cyan);letter-spacing:.18em;margin-bottom:1.2rem;font-size:.8rem}
.ach-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:.7rem;margin-bottom:1.6rem;text-align:left}
.ach-card{display:flex;align-items:center;gap:.8rem;padding:.7rem .9rem;border:1px solid rgba(0,240,255,.15);background:rgba(0,240,255,.03)}
.ach-card.unlocked{border-color:rgba(57,255,180,.4);background:rgba(57,255,180,.06)}
.ach-card.locked{opacity:.55}
.ach-icon{font-size:1.4rem;flex-shrink:0}
.ach-card.unlocked .ach-icon{color:var(--green);text-shadow:0 0 12px rgba(57,255,180,.7)}
.ach-meta{display:flex;flex-direction:column}
.ach-name{font-family:var(--font-display);font-size:.74rem;letter-spacing:.08em;color:#fff}
.ach-desc{font-size:.72rem;color:var(--text);opacity:.78}

/* ---------- Toasts ---------- */
#toast-stack{position:fixed;top:1rem;right:1rem;z-index:120;display:flex;flex-direction:column;gap:.6rem;pointer-events:none}
.toast{
  display:flex;align-items:center;gap:.7rem;min-width:240px;max-width:340px;
  background:rgba(8,14,28,.95);border:1px solid rgba(0,240,255,.4);padding:.7rem .9rem;
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
  transform:translateX(120%);opacity:0;transition:transform .4s cubic-bezier(.2,.9,.3,1),opacity .4s;
  box-shadow:0 0 24px rgba(0,240,255,.18);
}
.toast.in{transform:translateX(0);opacity:1}
.toast.out{transform:translateX(120%);opacity:0}
.toast-achievement{border-color:rgba(57,255,180,.5);box-shadow:0 0 24px rgba(57,255,180,.25)}
.toast-bytes{border-color:rgba(139,92,255,.5);box-shadow:0 0 24px rgba(139,92,255,.25)}
.toast-icon{font-size:1.4rem;flex-shrink:0}
.toast-achievement .toast-icon{color:var(--green);text-shadow:0 0 10px var(--green)}
.toast-bytes .toast-icon{color:var(--violet);text-shadow:0 0 10px var(--violet)}
.toast-icon{color:var(--cyan)}
.toast-body{display:flex;flex-direction:column}
.toast-title{font-family:var(--font-display);font-weight:700;font-size:.74rem;letter-spacing:.08em;color:#fff}
.toast-sub{font-size:.7rem;color:var(--text);opacity:.8}

/* ---------- Accesibilidad: reducir glow / fx ---------- */
body.reduce-glow #boot-screen .boot-logo,
body.reduce-glow .game-title,
body.reduce-glow .panel-title{text-shadow:none}
body.reduce-fx #crt-overlay{display:none}

/* ---------- Responsive ---------- */
@media (max-width:640px){
  .hud-block{min-width:84px}
  .hud-energy-wrap{width:84px}
  .menu-footer{gap:1.2rem;flex-wrap:wrap}
  .end-stats{grid-template-columns:1fr 1fr}
  .garage-layout{grid-template-columns:1fr}
  #toast-stack{left:1rem;right:1rem}
  .toast{max-width:none}
}