:root{--bg-true:#0a0f17;--card:#121826;--card-soft:#192233;--border:#2b3850;--text-bright:#f8fbff;--text-dim:#d0d9e8;--accent:#4cc2ff;--win:#69f0ae;--danger:#ff6b6b;--cell:72px}
@media (max-width:992px){:root{--cell:64px}}@media (max-width:520px){:root{--cell:56px}}
.bg-dark-true{background:var(--bg-true); color:var(--text-bright)}
.bg-gradient-dark{background:linear-gradient(90deg,#0d1320,#0b1020)}

.card.dark-card{background:var(--card);border:1px solid var(--border);border-radius:12px}
.border-soft{border:1px solid var(--border)!important}
.text-bright{color:var(--text-bright)} .text-dim{color:var(--text-dim)}
.link-bright{color:var(--accent)!important}

.slot-grid{position:relative;background:#0f1626;padding:12px;display:grid;gap:8px;height:calc(var(--cell)*3 + 24px);align-items:start;border-radius:14px}
.reel{position:relative;overflow:hidden;height:calc(var(--cell)*3);border-radius:12px;background:radial-gradient(120px 180px at 50% -20%,#203052,#0f1726 60%)}
.reel .strip{will-change:transform;transform:translateY(0)}
.cell{font-size:calc(var(--cell)*.7);height:var(--cell);line-height:var(--cell);display:flex;align-items:center;justify-content:center;text-shadow:0 2px 4px rgba(0,0,0,.35)}
.win-cell{outline:3px solid var(--win);border-radius:6px}
.row-guides{pointer-events:none;position:absolute;left:12px;right:12px;top:12px;bottom:12px;display:grid;grid-template-rows:repeat(3,var(--cell))}

.controls{position:fixed;left:0;right:0;bottom:0;background:linear-gradient(180deg,rgba(13,20,36,.85),rgba(9,14,28,.95));backdrop-filter:blur(10px);padding:10px 12px;border-top:1px solid var(--border)}
.ctrl-row{display:grid;grid-template-columns:repeat(5,minmax(0,120px)) 1fr auto;gap:10px;align-items:end}
.ctrl-group label{font-size:12px;color:var(--text-dim);margin-bottom:2px;display:block}
.pill{background:#0f1522;border:1px solid var(--border);border-radius:999px;padding:6px 10px;min-width:64px;text-align:center;color:var(--text-bright)}

.machine.theme-slot-neon .slot-grid{background:#071427; box-shadow:0 0 12px #00d8ff66 inset}
.machine.theme-slot-neon .reel{background:radial-gradient(120px 180px at 50% -20%,#0ff6,#041225 70%); box-shadow:0 0 20px #00d8ff40 inset}

.machine.theme-slot-gold .slot-grid{background:#1a1209; border:1px solid #6b4a20}
.machine.theme-slot-gold .reel{background:linear-gradient(180deg,#2a1b0d,#1a1209); box-shadow:inset 0 0 0 1px #6b4a20}

.machine.theme-slot-highcontrast .slot-grid{background:#000}
.machine.theme-slot-highcontrast .reel{background:#111}

@media (max-width:576px){
  .btn, .form-control, .form-select { font-size: 1rem; }
  .controls { padding-bottom: calc(16px + env(safe-area-inset-bottom)); }
  .ctrl-row { gap: 8px; grid-template-columns:repeat(2,minmax(0,120px)) 1fr auto }
}

.form-control-contrast{background:#0f1522!important;color:#f8fbff!important;border:1px solid #2b4b78}