body[data-theme="default"]{
  --primary:#3b82f6;
}

body[data-theme="yahtzee"]{
  --primary:#dc2626;
  background:
    radial-gradient(circle at top, rgba(220,38,38,.25), transparent 60%),
    #0b1020;
}

/* ===== YAHTZEE SCORECARD ===== */

.yahtzee-title{
  text-align:center;
  letter-spacing:2px;
  margin-bottom:12px;
}

.yahtzee-card{
  background:#f8fafc;
  color:#111;
  border-radius:12px;
  padding:16px;
  border:3px solid #dc2626;
}

.yahtzee-card h3{
  margin:12px 0 8px;
  color:#dc2626;
}

.yahtzee-card .row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:6px 0;
  border-bottom:1px solid #e5e7eb;
}

.yahtzee-card input{
  width:70px;
  text-align:center;
  font-weight:bold;
}

.yahtzee-card .total{
  font-weight:600;
  background:#fee2e2;
  padding:6px;
}

.grand-total{
  margin-top:12px;
  padding:10px;
  text-align:center;
  font-size:18px;
  font-weight:bold;
  background:#dc2626;
  color:white;
  border-radius:8px;
}

/* ===== YAHTZEE INPUT FIX ===== */

.yahtzee-card input{
  background:#ffffff;          /* wit papier */
  color:#111111;               /* zwarte cijfers */
  border:2px solid #dc2626;    /* rode rand */
  border-radius:6px;
  padding:6px;
  font-size:16px;
  font-weight:700;
}

.yahtzee-card input::placeholder{
  color:#9ca3af;
}

.yahtzee-card input:focus{
  outline:none;
  border-color:#b91c1c;
  background:#fff7f7;
}

/* ===== MULTI PLAYER YAHTZEE ===== */

.player-bar{
  display:flex;
  gap:12px;
  margin-bottom:10px;
}

.player-name{
  flex:1;
  text-align:center;
  font-weight:600;
  color:#dc2626;
}

.yahtzee-table{
  overflow-x:auto;
}

.row.multi{
  display:grid;
  grid-template-columns: 1fr repeat(auto-fit, minmax(70px, 1fr));
  gap:8px;
}

.row.multi input,
.row.multi strong{
  text-align:center;
}

/* ===== PLAYER CONTROLS ===== */
.player-controls{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:12px;
}

.player-pill{
  display:flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  background:#fee2e2;
  color:#7f1d1d;
  font-weight:600;
}

.player-pill button{
  background:none;
  border:none;
  cursor:pointer;
  font-size:14px;
}

.add-player{
  padding:6px 10px;
  border-radius:999px;
  background:#dc2626;
  color:white;
  font-weight:700;
}