:root {
  /* core accents (fall palette) */
  --jeopardy-blue: #b2420f;        /* deep burnt-orange accent, replaces old blue */
  --jeopardy-blue-dark: #170a04;   /* near-black warm background */
  --jeopardy-gold: #f0c36d;        /* warm gold for primary actions / highlights */
  --jeopardy-white: #fff3e0;       /* warm off-white */
  --panel-bg: #170b05;
  --panel-bg-light: #2d1a0f;
  --text-muted: #c9a679;
  --correct: #6fb24a;
  --incorrect: #d1392b;

  /* board pill theme */
  --gold-text: #ffe9c2;
  --gold-line: #e8b84b;
  --cell-top: #ffb95f;
  --cell-mid: #f2793c;
  --cell-bottom: #c2411c;
  --catpill-top: #3a1a08;
  --catpill-bottom: #1f0e04;
  --board-bg-1: #5c2a12;
  --board-bg-2: #2b1206;
  --board-bg-3: #110602;
  --logo-gold-1: #fff3c4;
  --logo-gold-2: #e8b84b;
  --logo-gold-3: #a9711f;

  /* seat identity colors, used for buzz-in flashes */
  --seat-0: #e63946;
  --seat-1: #ffd166;
  --seat-2: #f4743b;

  --font-display: 'Oswald', 'Arial Narrow', Arial, sans-serif;
  --font-logo: 'Playfair Display', Georgia, serif;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  background: var(--jeopardy-blue-dark);
  color: var(--jeopardy-white);
  font-family: Helvetica, Arial, sans-serif;
  overflow: hidden;
}

button {
  font-family: inherit;
  cursor: pointer;
  border: none;
  border-radius: 6px;
  padding: 8px 14px;
  font-size: 14px;
  background: var(--panel-bg-light);
  color: var(--jeopardy-white);
}
button:hover { filter: brightness(1.2); }
button:disabled { opacity: 0.4; cursor: default; }
button.primary { background: var(--jeopardy-gold); color: #2a1300; font-weight: bold; }
button.danger { background: var(--incorrect); }
button.success { background: var(--correct); }

input, select, textarea {
  font-family: inherit;
  background: var(--panel-bg-light);
  color: var(--jeopardy-white);
  border: 1px solid #5a3a22;
  border-radius: 4px;
  padding: 6px 8px;
  font-size: 14px;
}

h1, h2, h3 { font-family: var(--font-display); margin: 0; }

.scorebar {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
  padding: 10px;
}
.scorebar .player {
  background: var(--panel-bg-light);
  border-radius: 10px;
  padding: 10px 20px;
  text-align: center;
  min-width: 140px;
  border: 3px solid transparent;
  transition: border-color 0.15s, transform 0.15s;
}
.scorebar .player.control { border-color: var(--jeopardy-gold); }
.scorebar .player.buzzed-in { transform: scale(1.06); }
.scorebar .player .name { font-weight: bold; font-size: 1.1em; }
.scorebar .player .score { font-family: var(--font-display); font-size: 1.6em; }
.scorebar .player .score.negative { color: var(--incorrect); }
.scorebar .player .buzz-dot {
  display: inline-block; width: 10px; height: 10px; border-radius: 50%;
  background: #6b4a30; margin-left: 6px;
}
.scorebar .player .buzz-dot.on { background: var(--correct); box-shadow: 0 0 8px var(--correct); }

/* ---- shared game-control UI (used by both the desktop host and the mobile
   host remote, via public/shared/gameControls.js) ---- */
.mini-board {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.mini-row { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; align-items: center; gap: 4px; }
.mini-cell {
  background: linear-gradient(180deg, var(--cell-top), var(--cell-bottom));
  border-radius: 999px;
  margin: 2px 0;
  max-height: 60px;
  padding: 8px 4px;
  text-align: center;
  font-size: 0.85em;
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mini-cell.cat {
  background: linear-gradient(180deg, var(--catpill-top), var(--catpill-bottom));
  border: 1px solid var(--gold-line);
  color: var(--gold-text);
  font-weight: bold;
  font-size: 0.75em;
  text-transform: uppercase;
  aspect-ratio: 2.2 / 1;
  max-height: 54px;
  overflow: hidden;
}
.mini-cell.clue { cursor: pointer; font-family: var(--font-display); font-weight: 600; color: var(--gold-text); }
.mini-cell.clue.answered { background: #241208; color: #6b4a30; cursor: default; }
.mini-cell.clue.dd::after { content: ' ★'; font-size: 0.7em; }

.clue-panel {
  margin-top: 16px;
  background: var(--panel-bg-light);
  border-radius: 10px;
  padding: 16px;
}
.clue-panel .clue-text { font-size: 1.3em; margin: 10px 0; }
.clue-panel .answer-text { color: var(--jeopardy-gold); margin: 10px 0; }
.clue-panel .actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
.buzz-order { display: flex; gap: 8px; margin: 10px 0; }
.buzz-chip { background: var(--panel-bg-light); border-radius: 6px; padding: 6px 10px; }
.buzz-chip.active { background: var(--jeopardy-gold); color: #2a1300; font-weight: bold; }
.buzz-chip.tried { opacity: 0.4; text-decoration: line-through; }

.player-row {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--panel-bg-light);
  border-radius: 8px;
  padding: 10px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}
.player-row input[type=text] { width: 140px; }
.buzzer-status { font-size: 0.85em; color: var(--text-muted); }
.buzzer-status.connected { color: var(--correct); }
