.spin-main { padding: clamp(28px, 5vw, 60px) clamp(22px, 5vw, 72px) 80px; display: grid; gap: 40px; max-width: 920px; }
.spin-stage { padding: 32px; display: grid; gap: 20px; justify-items: center; text-align: center; }
.wheel-ladder { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.wheel-node {
  min-width: 110px;
  padding: 12px 16px;
  border: 1px solid var(--line);
  display: grid;
  gap: 4px;
  opacity: 0.55;
}
.wheel-node span { color: var(--dim); font: 700 10px/1 var(--mono); text-transform: uppercase; }
.wheel-node strong { font: 800 15px/1 var(--display); text-transform: uppercase; }
.wheel-node.active { opacity: 1; border-color: var(--gold); background: var(--gold-soft); }
.wheel-node.done { opacity: 1; border-color: var(--teal); }
.spin-reveal { min-height: 48px; font: 700 18px/1.3 var(--display); text-transform: uppercase; color: var(--gold-hot); }
.spin-button { min-width: 220px; }
.spin-button:disabled { opacity: 0.5; cursor: not-allowed; }

.odds-section h2, .history-section h2 { margin: 0 0 6px; font: 800 22px/1 var(--display); text-transform: uppercase; }
.odds-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin-top: 16px; }
.odds-card { border: 1px solid var(--line); padding: 14px; background: rgba(20, 23, 27, 0.85); }
.odds-card h3 { margin: 0 0 8px; font: 800 14px/1 var(--display); text-transform: uppercase; color: var(--gold); }
.odds-row { display: flex; justify-content: space-between; padding: 4px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.odds-row:last-child { border-bottom: 0; }

.history-list { display: grid; gap: 8px; margin-top: 12px; }
.history-row { display: flex; justify-content: space-between; padding: 10px 12px; border: 1px solid var(--line); font-size: 13px; }
.history-row .h-reward { color: var(--teal); }
