:root {
  --bg: #0e1f1a;
  --panel: #17352c;
  --gold: #d4a017;
  --cream: #f4ead2;
  --muted: #9bb8ab;
  --hit: #2ecc71;
  --free: #c0392b;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--cream); font-family: Georgia, "Times New Roman", serif; }
.shell { max-width: 520px; margin: 0 auto; padding: 16px; }
.top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.brand { display: flex; gap: 10px; align-items: center; }
.maya-mark { width: 48px; height: 48px; object-fit: contain; filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.35)); }
.brand span { display: block; color: var(--muted); font-size: 12px; letter-spacing: 0.08em; }
.wallet { text-align: right; }
.wallet .label { display: block; font-size: 11px; color: var(--muted); text-transform: uppercase; }
#balance { font-size: 22px; color: var(--gold); }
.status-bar { background: var(--panel); padding: 10px 12px; border-radius: 8px; font-size: 14px; margin-bottom: 12px; }
.board-wrap { background: #1f4a3d; padding: 12px; border-radius: 12px; border: 2px solid var(--gold); }
.letters { display: grid; grid-template-columns: repeat(5, 1fr); text-align: center; color: var(--gold); font-weight: 700; margin-bottom: 8px; }
.card { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.cell {
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  background: var(--cream);
  color: #14352a;
  border-radius: 8px;
  font-weight: 700;
}
.cell.hit { background: var(--hit); color: #fff; }
.cell.free { background: var(--free); color: #fff; font-size: 11px; }
.draw { margin: 16px 0; text-align: center; }
.current { font-size: 42px; color: var(--gold); }
.history { min-height: 28px; color: var(--muted); font-size: 13px; word-break: break-word; }
.actions { display: flex; gap: 8px; }
button {
  flex: 1;
  padding: 12px;
  border: 0;
  border-radius: 8px;
  font-size: 16px;
  cursor: pointer;
  font-family: inherit;
}
#buyBtn { background: var(--gold); color: #14352a; font-weight: 700; }
#buyBtn:disabled { opacity: 0.45; cursor: not-allowed; }
#exitBtn { background: transparent; color: var(--cream); border: 1px solid var(--muted); }
.hint { color: var(--muted); font-size: 12px; line-height: 1.4; }