@import url('../_shared/arcade.css?v=20260607c');
:root{ --accent:#b16cff; --accent2:#29e7ff; --gold:#ffd24a; --hot:#ff3b9d; }
.game-shell{ background:radial-gradient(circle at 50% 8%,#2a0f4d 0%,#140a36 44%,#070418 100%); }

/* Three.js canvas fills the play area */
.game-wrap{display:block;background:#070418}
#game-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}

/* Floating score / pickup text overlay */
.fx-layer{position:absolute;inset:0;z-index:11;pointer-events:none;overflow:hidden}
.fx-float{position:absolute;transform:translate(-50%,-50%);font-weight:1000;font-size:.92rem;
  text-shadow:0 0 10px rgba(0,0,0,.9);white-space:nowrap;will-change:transform,opacity;animation:fxrise .9s ease-out forwards}
@keyframes fxrise{0%{opacity:0;transform:translate(-50%,-30%) scale(.6)}16%{opacity:1}100%{opacity:0;transform:translate(-50%,-160%) scale(1.1)}}

/* Active powerup chips */
.pw-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:2px;justify-content:flex-start}
.pw-chip{display:flex;align-items:center;gap:4px;font-size:.64rem;font-weight:900;letter-spacing:.04em;
  padding:.2rem .5rem;border-radius:999px;background:rgba(10,6,28,.6);border:1px solid var(--c,rgba(255,255,255,.2));
  color:var(--c,#fff);backdrop-filter:blur(6px);box-shadow:0 0 12px -2px var(--c)}
.pw-chip .pw-t{opacity:.85;font-variant-numeric:tabular-nums}

.hud-banner{color:#fff;text-shadow:0 0 30px rgba(177,108,255,.85),0 0 8px rgba(0,0,0,.6);font-weight:1000}
.hud-hint{margin-top:auto;margin-bottom:max(6px,var(--safe-bottom));align-self:center}

/* Damage vignette flash */
.dmg-flash{position:absolute;inset:0;z-index:13;pointer-events:none;opacity:0;
  box-shadow:inset 0 0 120px 34px rgba(255,59,157,.7);transition:opacity .08s}
.dmg-flash.show{opacity:1}

/* New-best ribbon on game over */
.newbest-tag{display:inline-block;margin:2px 0 6px;padding:.22rem .7rem;border-radius:999px;font-weight:1000;
  font-size:.66rem;letter-spacing:.16em;color:#0a0420;background:linear-gradient(90deg,var(--gold),#ffe89a);
  box-shadow:0 0 22px -4px var(--gold)}

@media (max-width:560px){.player-pill{display:none}.hud-chip b{font-size:.92rem}}