/* Crash: a night-sky chart with the curve and rocket, a huge live multiplier on top, recent crash points below. */
.crash-screen { align-content: stretch; gap: 12px; }
.crash-stage { position: relative; width: 100%; height: clamp(260px, 30vw, 380px); border-radius: 14px; overflow: hidden;
  background: radial-gradient(80% 60% at 80% 10%, rgba(255, 61, 110, 0.12), transparent 70%), rgba(0, 0, 0, 0.18); box-shadow: 0 0 0 1px var(--line) inset; }
.crash-stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.crash-read { position: absolute; left: 0; right: 0; top: 16%; display: grid; justify-items: center; gap: 6px; pointer-events: none; }
.crash-mult { font: 800 clamp(48px, 6.4vw, 92px)/1 var(--display); letter-spacing: -0.03em; color: #d9d3ff; text-shadow: 0 0 30px rgba(177, 140, 255, 0.4); font-variant-numeric: tabular-nums; }
.crash-mult.is-live { color: #fff; }
.crash-mult.is-win { color: var(--win); text-shadow: 0 0 26px rgba(31, 224, 138, 0.6); }
.crash-mult.is-lose { color: var(--lose); text-shadow: 0 0 26px rgba(255, 61, 110, 0.6); }
.crash-status { padding: 5px 14px; border-radius: 999px; font-weight: 800; font-size: var(--step--1); color: var(--mute); background: rgba(10, 9, 24, 0.6); }
.crash-status.is-win { color: var(--win); box-shadow: 0 0 0 1px rgba(31, 224, 138, 0.4) inset; }
.crash-status.is-lose { color: var(--lose); box-shadow: 0 0 0 1px rgba(255, 61, 110, 0.4) inset; }
.auto-row { display: grid; grid-template-columns: minmax(90px, 140px) minmax(0, 1fr); gap: 10px; align-items: center; }
.auto-row input { font-size: 1.1rem; font-weight: 800; }
.play-crash .field-profit .readonly { color: var(--gold); background: rgba(255, 201, 64, 0.07); box-shadow: 0 0 0 1px rgba(255, 201, 64, 0.3) inset; }
@media (max-width: 560px) {
  .crash-stage { height: 240px; }
  .auto-row { grid-template-columns: minmax(0, 1fr); }
}