:root{
  --panel:#141622;
  --panel-2:#1b1d2a;
  --text:#e9e9f2;
  --muted:#9aa0b5;
  --accent:#8f5bff;
  --accent-2:#15e1a7;
  --win:#15e1a7;
  --lose:#ff7878;
}

.crash-wrap{max-width:1200px;margin:0 auto;padding:18px 16px 64px}
.crash-stage{
  position:relative;
  background:linear-gradient(180deg,#121424,#0f1016);
  border:1px solid rgba(255,255,255,.06);
  border-radius:16px; box-shadow:0 10px 30px rgba(0,0,0,.35);
  overflow:hidden;
}
#crashChart{display:block;width:100%;height:auto}

.crash-hud{
  position:absolute; left:16px; top:16px; display:flex; gap:12px; align-items:center;
}
.multiplier{
  font-size:28px; font-weight:800; padding:6px 10px; border-radius:10px;
  background:rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.08);
}
.round-status{color:var(--muted); font-weight:600}

.crash-controls{
  margin-top:14px; display:grid; grid-template-columns: 2fr 2fr 3fr; gap:12px;
}
.control-card{
  background:var(--panel); border:1px solid rgba(255,255,255,.08); border-radius:12px; padding:12px;
}
.control-card.action{display:flex; align-items:center; gap:10px; justify-content:space-between}
.lbl{font-size:12px;color:var(--muted);display:block;margin-bottom:6px}

.input-group{display:flex; align-items:center; gap:8px}
.input{
  background:#1e2234; color:#fff; border:1px solid rgba(255,255,255,.12); border-radius:10px;
  padding:10px 12px; min-width:120px; width:120px; text-align:center;
}
.suffix{color:var(--muted)}

.btn{
  padding:10px 14px; border-radius:10px; border:1px solid rgba(255,255,255,.12);
  background:#2a2f4a; color:#fff; cursor:pointer; font-weight:600;
}
.btn.sm{padding:6px 10px}
.btn.primary{background:#2d365f}
.btn.success{background:#1f493e; border-color:#2a6f5f}
.btn:disabled{opacity:.6; cursor:not-allowed}

.section{margin-top:18px}
.history-row{display:flex; gap:8px; flex-wrap:wrap}
.history-chip{
  padding:6px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.08);
  background:var(--panel-2); font-weight:700;
}
.history-chip.win{color:var(--win)}
.history-chip.lose{color:var(--lose)}

@media (max-width: 900px){
  .crash-controls{grid-template-columns: 1fr; }
  .control-card.action{justify-content:flex-start}
}
