/* assets/slotmachine-game.css — v1.3.75 */
html, body {
  margin:0; padding:0; height:100%;
  background:#000; color:#fff;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
.slot-machine {
  box-sizing:border-box;
  width:100%; min-height:100vh;
  display:flex; flex-direction:column;
  align-items:center; justify-content:flex-start;
  padding:12px;
  background:#000;
  overflow-x:hidden;
}
.title { margin:10px 0; color:#fff; text-align:center; }
.jackpot { color:#fff; margin:6px 0 12px; font-weight:700; }
.last-win, #lastWin { color:#fff; margin:4px 0 10px; text-align:center; font-weight:600; }

/* Reels */
.reels { display:flex; justify-content:center; align-items:center; gap:10px; margin:10px 0 12px; }
.reel {
  width:120px; height:120px; background:#111;
  display:flex; align-items:center; justify-content:center;
  border:2px solid #444; border-radius:8px; overflow:hidden;
}
.reel img.sym { width:84%; height:84%; object-fit:contain; background:transparent; }

/* Controls — force ROW */
.controls { display:flex; flex-direction:row; gap:10px; margin:8px 0 12px; align-items:center; justify-content:center; width:100%; flex-wrap:wrap; }
#slotMachine .controls, #slot-machine-root .controls, .slot-machine .controls {
  display:flex !important; flex-direction:row !important;
}
.controls button{
  appearance:none; border:1px solid #777; background:#222; color:#fff;
  padding:8px 14px; border-radius:6px; cursor:pointer; font-size:14px; line-height:1.2;
}
.controls button:hover{ background:#2b2b2b; }

/* World High + Recent Wins */
.world-high { color:#fff; margin:6px 0 8px; text-align:center; font-weight:600; }

/* Center Recent Wins */
.recent-wins { color:#fff; margin:8px 0 0; text-align:center; width:100%; max-width:860px; }
.recent-wins h3{ margin:6px 0 8px; }

/* Center the list contents */
.recent-wins ul{
  list-style:none; padding:0; margin:0 auto; max-height:220px; overflow:auto;
  text-align:center; /* centered now */
  width:100%; max-width:520px;
}
.recent-wins ul li{ padding:4px 8px; border-bottom:1px dashed #444; }

/* Red for wins */
.recent-wins ul li.win { color:#ff4d4d; font-weight:700; }
#lastWin.win { color:#ff4d4d; }

/* Popup */
.popup { position:fixed; inset:0; background:rgba(0,0,0,0.7); display:none; align-items:center; justify-content:center; z-index:9999; }
.popup[aria-hidden="false"]{ display:flex; }
.popup-content{
  background:#fff; color:#111; padding:18px; border-radius:10px; max-width:560px; width:92%;
  box-shadow:0 10px 30px rgba(0,0,0,0.5); position:relative;
}
.close-button, #rulesClose {
  position:absolute; top:8px; right:10px;
  font-size:20px; border:none; background:#000; color:#fff;
  border-radius:6px; width:28px; height:28px; cursor:pointer; line-height:26px; text-align:center;
}

/* Responsive */
@media (max-width:520px){
  .reel{ width:96px; height:96px; }
  .controls button{ font-size:13px; padding:7px 12px; }
}
