
:root {
  color-scheme: dark;
  --bg: #07110d;
  --surface: #101d17;
  --surface-2: #172820;
  --surface-3: #20352a;
  --text: #f5f8f6;
  --muted: #91a49a;
  --green: #69e596;
  --green-strong: #38d678;
  --red: #ff7b74;
  --gold: #f8cd66;
  --border: rgba(255, 255, 255, 0.10);
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.34);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
  overscroll-behavior: none;
  background:
    radial-gradient(circle at 85% -10%, rgba(105, 229, 150, 0.18), transparent 34%),
    radial-gradient(circle at -10% 110%, rgba(105, 229, 150, 0.08), transparent 34%),
    var(--bg);
  color: var(--text);
}

button,
input { font: inherit; }

button {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

button:focus-visible,
input:focus-visible {
  outline: 3px solid rgba(105, 229, 150, 0.45);
  outline-offset: 2px;
}

.app-shell {
  width: min(100%, 1180px);
  height: 100svh;
  height: 100dvh;
  margin: 0 auto;
  padding:
    max(10px, env(safe-area-inset-top))
    max(10px, env(safe-area-inset-right))
    max(10px, env(safe-area-inset-bottom))
    max(10px, env(safe-area-inset-left));
}

.view { width: 100%; height: 100%; }
.is-hidden { display: none !important; }

.card {
  border: 1px solid var(--border);
  border-radius: 22px;
  background: rgba(16, 29, 23, 0.94);
  box-shadow: var(--shadow);
  backdrop-filter: blur(16px);
}

.eyebrow {
  margin: 0;
  color: var(--green);
  font-size: clamp(0.62rem, 1.8vw, 0.76rem);
  font-weight: 900;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

h1, h2, p { margin-top: 0; }

.button {
  min-height: 52px;
  border-radius: 15px;
  padding: 0 18px;
  border: 0;
  font-weight: 900;
  cursor: pointer;
  transition: transform 120ms ease, filter 120ms ease, opacity 120ms ease;
}

.button:active { transform: translateY(1px) scale(0.99); }
.button:disabled { cursor: not-allowed; opacity: 0.34; }
.button-primary { background: linear-gradient(180deg, var(--green), var(--green-strong)); color: #041109; }
.button-secondary { border: 1px solid var(--border); background: var(--surface-2); color: var(--text); }
.button-compact { min-height: 40px; padding: 0 13px; font-size: 0.83rem; }

/* Setup */
.setup-view {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: clamp(10px, 2.2vh, 20px);
}

.setup-brand {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 4px 4px 0;
}

.target-logo {
  position: relative;
  flex: 0 0 auto;
  width: clamp(48px, 11vw, 72px);
  aspect-ratio: 1;
  border: clamp(4px, 1vw, 6px) solid var(--green);
  border-radius: 50%;
  box-shadow: inset 0 0 0 5px var(--bg), inset 0 0 0 9px rgba(105, 229, 150, 0.42);
}

.target-logo::before,
.target-logo::after,
.target-logo span {
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  translate: -50% -50%;
  border-radius: 50%;
}
.target-logo::before { width: 42%; aspect-ratio: 1; border: 3px solid rgba(105, 229, 150, 0.7); }
.target-logo::after { width: 12%; aspect-ratio: 1; background: var(--red); }

.setup-brand h1 {
  margin: 3px 0 4px;
  font-size: clamp(2.1rem, 9vw, 4.6rem);
  line-height: 0.93;
  letter-spacing: -0.065em;
}
.subcopy { margin: 0; color: var(--muted); font-size: clamp(0.78rem, 2vw, 1rem); }

.setup-form {
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: clamp(8px, 1.8vh, 16px);
}

.mode-picker {
  min-width: 0;
  margin: 0;
  padding: 8px;
}
.mode-picker legend {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
.segmented { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.mode-button {
  min-height: clamp(58px, 10vh, 84px);
  border: 1px solid transparent;
  border-radius: 16px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}
.mode-button strong { display: block; font-size: clamp(1.35rem, 5vw, 2rem); color: var(--text); }
.mode-button span { display: block; margin-top: 2px; font-size: 0.72rem; font-weight: 750; }
.mode-button.is-selected {
  border-color: rgba(105, 229, 150, 0.58);
  background: linear-gradient(145deg, rgba(105, 229, 150, 0.18), rgba(105, 229, 150, 0.06));
  color: var(--green);
}

.players-setup {
  min-height: 0;
  padding: clamp(10px, 2vh, 18px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: clamp(8px, 1.5vh, 14px);
}
.section-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.section-row h2 { margin: 3px 0 0; font-size: clamp(1.05rem, 4vw, 1.5rem); letter-spacing: -0.035em; }

.stepper {
  display: grid;
  grid-template-columns: 44px 44px 44px;
  align-items: stretch;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface-2);
}
.stepper button,
.stepper output {
  min-width: 0;
  min-height: 42px;
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: var(--text);
  font-weight: 900;
}
.stepper button { cursor: pointer; font-size: 1.35rem; }

.player-inputs {
  min-height: 0;
  display: grid;
  grid-template-rows: repeat(var(--player-count, 2), minmax(40px, 1fr));
  gap: clamp(5px, 1vh, 9px);
}
.player-field { position: relative; min-height: 0; }
.player-field span {
  position: absolute;
  z-index: 1;
  left: 12px;
  top: 50%;
  translate: 0 -50%;
  width: 26px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(105, 229, 150, 0.14);
  color: var(--green);
  font-size: 0.72rem;
  font-weight: 900;
}
.player-field input {
  width: 100%;
  height: 100%;
  min-height: 40px;
  border: 1px solid var(--border);
  border-radius: 13px;
  padding: 0 12px 0 48px;
  background: var(--surface-2);
  color: var(--text);
  font-weight: 750;
}
.player-field input::placeholder { color: #778a80; }
.start-button { width: 100%; min-height: clamp(54px, 8vh, 68px); font-size: clamp(1rem, 3vw, 1.15rem); }

/* Game */
.game-view {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: clamp(7px, 1.2vh, 12px);
}

.game-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 52px;
  padding: 0 3px;
}
.game-header h1 {
  margin: 1px 0 0;
  font-size: clamp(2rem, 8vw, 3.8rem);
  line-height: 0.86;
  letter-spacing: -0.07em;
}
.icon-button {
  width: clamp(46px, 11vw, 58px);
  aspect-ratio: 1;
  border: 1px solid var(--border);
  border-radius: 50%;
  background: var(--surface);
  color: var(--text);
  font-size: 1.45rem;
  font-weight: 900;
  cursor: pointer;
}

.game-main {
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: clamp(7px, 1.2vh, 12px);
}
.score-column {
  min-height: 0;
  display: grid;
  grid-template-rows: auto auto;
  gap: clamp(6px, 1vh, 10px);
}

.scoreboard {
  --score-columns: 2;
  display: grid;
  grid-template-columns: repeat(var(--score-columns), minmax(0, 1fr));
  gap: clamp(5px, 1vw, 9px);
}
.player-card {
  position: relative;
  min-width: 0;
  min-height: clamp(62px, 10.5vh, 94px);
  padding: clamp(8px, 1.8vh, 14px) clamp(7px, 1.8vw, 13px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
  border: 1px solid var(--border);
  border-radius: clamp(14px, 3vw, 20px);
  background: rgba(16, 29, 23, 0.90);
  overflow: hidden;
}
.player-card.is-active {
  border-color: rgba(105, 229, 150, 0.72);
  background: linear-gradient(145deg, #17442b, var(--surface));
  box-shadow: 0 10px 28px rgba(38, 162, 90, 0.12);
}
.player-card.is-finished { opacity: 0.62; }
.player-details { min-width: 0; }
.player-name {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  font-size: clamp(0.7rem, 2.7vw, 0.94rem);
  font-weight: 850;
}
.is-active .player-name { color: var(--green); }
.player-status { display: block; margin-top: 3px; color: #71857a; font-size: clamp(0.58rem, 2vw, 0.72rem); font-weight: 750; }
.player-score {
  flex: 0 0 auto;
  font-size: clamp(1.7rem, 7.5vw, 3rem);
  line-height: 0.9;
  letter-spacing: -0.06em;
}
.place-badge {
  position: absolute;
  top: 5px;
  right: 5px;
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--gold);
  color: #211a04;
  font-size: clamp(0.52rem, 1.8vw, 0.68rem);
  font-weight: 950;
}

.turn-card {
  min-height: clamp(62px, 9vh, 84px);
  padding: clamp(9px, 1.7vh, 15px) clamp(13px, 2.6vw, 20px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  box-shadow: none;
}
.turn-card h2 {
  max-width: 60vw;
  margin: 3px 0 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: clamp(1.1rem, 4.7vw, 1.65rem);
  letter-spacing: -0.04em;
}
.remaining-block { text-align: right; }
.remaining-block span { display: block; color: var(--muted); font-size: 0.68rem; font-weight: 750; }
.remaining-block strong { font-size: clamp(1.75rem, 7vw, 2.75rem); line-height: 0.95; letter-spacing: -0.06em; }

.scoring-card {
  min-height: 0;
  padding: clamp(8px, 1.5vh, 14px);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  gap: clamp(6px, 1.1vh, 10px);
}
.score-entry-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; padding: 0 3px; }
.score-hint { margin: 3px 0 0; color: var(--muted); font-size: clamp(0.62rem, 2vw, 0.78rem); }
.turn-score { font-size: clamp(2.6rem, 12vw, 4.6rem); font-weight: 950; line-height: 0.82; letter-spacing: -0.075em; }
.turn-score.is-invalid { color: var(--red); }

.quick-scores {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 5px;
}
.quick-score {
  min-height: clamp(32px, 5.1vh, 44px);
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-2);
  color: var(--muted);
  font-size: clamp(0.66rem, 2vw, 0.8rem);
  font-weight: 850;
  cursor: pointer;
}

.keypad {
  min-height: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(4, minmax(0, 1fr));
  gap: clamp(6px, 1.1vh, 10px);
}
.key-button {
  min-height: 0;
  border: 1px solid var(--border);
  border-radius: clamp(12px, 2.8vw, 17px);
  background: linear-gradient(180deg, #1b2d24, #15241d);
  color: var(--text);
  font-size: clamp(1.2rem, 5vw, 1.8rem);
  font-weight: 900;
  cursor: pointer;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.035);
}
.key-button.is-utility { color: var(--gold); font-size: clamp(0.9rem, 3.2vw, 1.15rem); }
.key-button:active { background: var(--surface-3); transform: translateY(1px); }

.score-actions {
  display: grid;
  grid-template-columns: minmax(105px, 0.42fr) minmax(0, 1fr);
  gap: clamp(7px, 1.2vw, 11px);
}
.score-actions .button { min-height: clamp(54px, 8.5vh, 70px); font-size: clamp(0.95rem, 3vw, 1.08rem); }

/* Modal */
.modal {
  position: fixed;
  z-index: 50;
  inset: 0;
  display: grid;
  place-items: center;
  padding: max(12px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom));
  background: rgba(2, 7, 5, 0.84);
  backdrop-filter: blur(12px);
}
.modal-card {
  width: min(100%, 520px);
  max-height: 100%;
  overflow: hidden;
  padding: clamp(15px, 3vw, 25px);
  display: grid;
  grid-template-rows: auto auto auto auto minmax(0, 1fr) auto;
  text-align: center;
}
.finish-mark { font-size: clamp(2.2rem, 8vw, 3.5rem); }
.modal-card h2 { margin: 4px 0 5px; font-size: clamp(1.35rem, 5vw, 2rem); letter-spacing: -0.045em; }
.modal-copy { margin: 0 0 10px; color: var(--muted); font-size: 0.86rem; }
.order-presets { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-bottom: 8px; }
.next-order { min-height: 0; display: grid; gap: 6px; overflow: auto; overscroll-behavior: contain; }
.order-row {
  min-height: 51px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 6px 7px 6px 11px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-2);
  text-align: left;
}
.order-place { color: var(--gold); font-size: 0.78rem; font-weight: 950; }
.order-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 850; }
.order-buttons { display: flex; gap: 5px; }
.order-buttons button {
  width: 38px;
  height: 38px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-3);
  color: var(--text);
  font-weight: 950;
  cursor: pointer;
}
.order-buttons button:disabled { opacity: 0.25; }
.modal-actions { display: grid; gap: 7px; margin-top: 10px; }

.toast {
  position: fixed;
  z-index: 80;
  left: 50%;
  bottom: max(12px, env(safe-area-inset-bottom));
  translate: -50% 0;
  max-width: calc(100% - 24px);
  padding: 10px 15px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: #1d3026;
  box-shadow: 0 14px 50px rgba(0, 0, 0, 0.48);
  font-size: 0.82rem;
  font-weight: 850;
  text-align: center;
}
.toast.is-error { background: #4a201d; }

/* Short phones */
@media (max-height: 650px) and (max-width: 700px) {
  .app-shell { padding-top: max(6px, env(safe-area-inset-top)); padding-bottom: max(6px, env(safe-area-inset-bottom)); }
  .setup-view, .game-view, .game-main, .score-column, .scoring-card { gap: 5px; }
  .setup-brand { gap: 10px; }
  .setup-brand h1 { font-size: 2rem; }
  .target-logo { width: 44px; }
  .subcopy { font-size: 0.7rem; }
  .mode-picker { padding: 5px; }
  .mode-button { min-height: 50px; }
  .mode-button strong { font-size: 1.25rem; }
  .mode-button span { font-size: 0.62rem; }
  .players-setup { padding: 8px; }
  .section-row h2 { font-size: 1rem; }
  .stepper { grid-template-columns: 38px 38px 38px; }
  .stepper button, .stepper output { min-height: 36px; }
  .start-button { min-height: 48px; }
  .game-header { min-height: 43px; }
  .game-header h1 { font-size: 2rem; }
  .icon-button { width: 42px; }
  .player-card { min-height: 54px; padding: 6px 7px; }
  .turn-card { min-height: 54px; padding: 7px 11px; }
  .score-hint { display: none; }
  .quick-score { min-height: 28px; }
  .scoring-card { padding: 6px; }
  .score-actions .button { min-height: 48px; }
}

/* Tablet and desktop */
@media (min-width: 700px) {
  .app-shell { padding: clamp(14px, 2vw, 24px); }
  .setup-view { width: min(100%, 820px); margin: 0 auto; }
  .player-inputs { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; align-content: stretch; }
  .player-field { min-height: 48px; }
  .game-main { grid-template-columns: minmax(300px, 0.86fr) minmax(390px, 1.14fr); grid-template-rows: minmax(0, 1fr); }
  .score-column { grid-template-rows: minmax(0, 1fr) auto; }
  .scoreboard { grid-template-columns: 1fr !important; align-content: stretch; }
  .player-card { min-height: 96px; }
  .scoring-card { padding: clamp(14px, 2vw, 22px); }
  .quick-scores { gap: 8px; }
  .keypad { gap: clamp(9px, 1.2vw, 14px); }
  .score-actions { gap: 12px; }
}

@media (min-width: 980px) {
  .game-main { grid-template-columns: minmax(430px, 0.95fr) minmax(460px, 1.05fr); }
  .scoreboard { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .player-card { min-height: 112px; }
  .player-name { font-size: 1rem; }
  .player-score { font-size: 3.2rem; }
  .key-button { font-size: 1.85rem; }
}

@media (orientation: landscape) and (max-height: 650px) and (min-width: 700px) {
  .game-header { min-height: 40px; }
  .game-header h1 { font-size: 2rem; }
  .game-main { grid-template-columns: 0.92fr 1.08fr; }
  .player-card { min-height: 72px; }
  .turn-card { min-height: 58px; }
  .quick-score { min-height: 28px; }
  .score-actions .button { min-height: 48px; }
}

  
.game-header-actions{display:flex;align-items:center;gap:8px}.new-game-button{min-height:44px;padding:0 14px;font-size:.82rem}.game-header .button-secondary{box-shadow:none}@media(max-width:420px){.new-game-button{min-height:40px;padding:0 11px;font-size:.74rem}}

/* v9 game-night additions */
.setup-footer{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:10px;min-height:0}
.voice-toggle{min-height:54px;display:flex;align-items:center;gap:10px;padding:8px 12px;cursor:pointer;box-shadow:none}
.voice-toggle input{position:absolute;opacity:0;pointer-events:none}
.voice-toggle .voice-icon{flex:0 0 auto;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:var(--surface-3);font-size:1rem}
.voice-toggle strong,.voice-toggle small{display:block}.voice-toggle strong{font-size:.78rem}.voice-toggle small{margin-top:2px;color:var(--muted);font-size:.64rem}
.voice-toggle:has(input:checked){border-color:rgba(105,229,150,.42)}.voice-toggle:has(input:not(:checked)) .voice-icon{filter:grayscale(1);opacity:.6}
.game-header-actions{display:flex;align-items:center;gap:6px;min-width:0}.header-text-button{min-height:40px;padding:0 10px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text);font-weight:850;font-size:.72rem;cursor:pointer}.danger-text{color:#ffaaa5}.small-icon{width:40px;font-size:1rem}.small-icon.is-muted{opacity:.62}
.game-title-block{min-width:0}.game-title-block .eyebrow{white-space:nowrap}
.player-meta{display:block;margin-top:3px;color:#a7b8af;font-size:clamp(.54rem,1.7vw,.68rem);font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.turn-player{min-width:0}.turn-stats{display:flex;align-items:center;gap:14px}.night-points-block{text-align:right}.night-points-block span{display:block;color:var(--muted);font-size:.62rem;font-weight:750}.night-points-block strong{font-size:clamp(1.15rem,4.6vw,1.7rem);line-height:.95;color:var(--gold)}
.visit-tools{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px}.darts-picker{min-width:0;margin:0;padding:0;border:0}.darts-picker legend{margin:0 0 4px;color:var(--muted);font-size:.62rem;font-weight:800;text-align:center}.darts-buttons{display:grid;grid-template-columns:repeat(3,36px);gap:4px}.darts-buttons button{height:34px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);color:var(--muted);font-weight:900;cursor:pointer}.darts-buttons button.is-selected{border-color:rgba(105,229,150,.72);background:rgba(105,229,150,.15);color:var(--green)}
.finish-modal-card{width:min(100%,580px);overflow:auto;grid-template-rows:none;text-align:left}.finish-head{display:flex;align-items:center;gap:12px}.finish-head h2{margin:2px 0 0}.game-results{display:grid;gap:6px;margin:4px 0 12px}.result-row{min-height:52px;display:grid;grid-template-columns:46px minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px 9px;border:1px solid var(--border);border-radius:13px;background:var(--surface-2)}.result-place{color:var(--gold);font-size:.75rem;font-weight:950}.result-main{min-width:0}.result-main strong,.result-main small{display:block}.result-main strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.result-main small{margin-top:2px;color:var(--muted);font-size:.68rem}.result-points{text-align:right}.result-points strong,.result-points small{display:block}.result-points strong{color:var(--green);font-size:1rem}.result-points small{margin-top:1px;color:var(--muted);font-size:.62rem}
.order-section{min-height:0}.order-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}.order-presets{display:flex;gap:5px;margin:0}.mini-button{min-height:32px;padding:0 9px;border:1px solid var(--border);border-radius:9px;background:var(--surface-2);color:var(--text);font-size:.67rem;font-weight:800;cursor:pointer}.grab{color:#63766c;font-weight:900;letter-spacing:-.2em}.order-row{grid-template-columns:28px minmax(0,1fr) auto}.split-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.finish-actions{margin-top:12px}
.night-modal-card,.final-night-card{width:min(100%,560px);overflow:auto;grid-template-rows:none;text-align:left}.night-modal-head{display:flex;align-items:start;justify-content:space-between;gap:10px}.night-modal-head h2{margin:3px 0 2px}.night-standings{display:grid;gap:7px;margin:8px 0}.night-row{min-height:58px;display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:9px;padding:8px 10px;border:1px solid var(--border);border-radius:13px;background:var(--surface-2)}.night-rank{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--surface-3);color:var(--gold);font-size:.72rem;font-weight:950}.night-main{min-width:0}.night-main strong,.night-main small{display:block}.night-main strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.night-main small{margin-top:2px;color:var(--muted);font-size:.67rem}.night-score{color:var(--green);font-size:1rem;white-space:nowrap}.points-legend{padding:8px 10px;border-radius:11px;background:rgba(248,205,102,.08);color:var(--muted);font-size:.68rem;text-align:center}.points-legend b{color:var(--gold)}.final-night-card{text-align:center}.final-night-card .night-standings{text-align:left}

@media(max-width:560px){
  .setup-footer{grid-template-columns:1fr}.voice-toggle{min-height:48px}.setup-footer .start-button{min-height:52px}
  .game-header-actions{gap:4px}.header-text-button{min-height:38px;padding:0 8px;font-size:.66rem}.small-icon{width:38px;height:38px}.game-title-block .eyebrow{font-size:.56rem}
  .turn-stats{gap:8px}.night-points-block{display:none}
  .player-status{display:none}.player-meta{font-size:.52rem}
  .visit-tools{grid-template-columns:minmax(0,1fr) auto}.darts-buttons{grid-template-columns:repeat(3,32px)}.darts-buttons button{height:32px}.darts-picker legend{font-size:.56rem}
  .result-row{grid-template-columns:40px minmax(0,1fr) auto}.order-heading{align-items:flex-start;flex-direction:column}.order-presets{width:100%}.mini-button{flex:1}
}

@media(max-height:690px) and (max-width:700px){
  .setup-footer{grid-template-columns:.8fr 1.2fr}.voice-toggle{min-height:44px;padding:5px 9px}.voice-toggle .voice-icon{width:30px;height:30px}.voice-toggle small{display:none}
  .player-card{min-height:58px}.player-name{font-size:.68rem}.player-meta{font-size:.48rem;margin-top:2px}.player-score{font-size:1.55rem}
  .quick-scores{display:none}.visit-tools{grid-template-columns:1fr;justify-items:end}.darts-picker{display:flex;align-items:center;gap:6px}.darts-picker legend{margin:0}.darts-buttons button{height:30px}
  .scoring-card{grid-template-rows:auto auto minmax(0,1fr) auto}.score-entry-header{min-height:34px}.turn-score{font-size:2.35rem}
  .result-row{min-height:46px;padding:5px 8px}.result-main small{font-size:.61rem}.game-results{gap:4px;margin-bottom:8px}.order-row{min-height:44px}.order-buttons button{width:34px;height:34px}.finish-modal-card{padding:10px}.finish-head .finish-mark{font-size:1.8rem}.modal-copy{font-size:.72rem;margin-bottom:6px}.finish-actions{margin-top:8px}.finish-actions .button{min-height:44px}
}

@media(min-width:700px){
  .setup-footer{grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr)}
  .player-card{padding-left:15px;padding-right:15px}.player-meta{font-size:.68rem}
  .visit-tools{gap:12px}.darts-buttons{grid-template-columns:repeat(3,44px)}.darts-buttons button{height:40px}
}

/* v11 compact mobile scoring layout */
.quick-scores,.quick-score{display:none!important}
.visit-tools{display:flex;justify-content:flex-end;align-items:center;min-height:34px}
.scoring-card{grid-template-rows:auto auto minmax(0,1fr) auto}

@media(max-width:699px){
  .scoreboard.many-players{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px}
  .scoreboard.many-players .player-card{
    min-height:64px;
    padding:7px 8px;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto auto;
    align-content:center;
    column-gap:5px;
    row-gap:2px;
    border-radius:14px;
  }
  .scoreboard.many-players .player-details{grid-row:1/3;align-self:center}
  .scoreboard.many-players .player-name{font-size:.66rem;line-height:1.05}
  .scoreboard.many-players .player-status{display:none}
  .scoreboard.many-players .player-meta{font-size:.45rem;line-height:1.15;margin-top:3px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .scoreboard.many-players .player-score{font-size:1.55rem;line-height:1;align-self:center}
  .scoreboard.many-players .place-badge{top:3px;right:3px;font-size:.48rem;padding:1px 4px}
  .turn-card{min-height:56px;padding:8px 12px}
  .turn-card h2{font-size:1.05rem;margin-top:1px}
  .remaining-block span{font-size:.58rem}
  .remaining-block strong{font-size:1.8rem}
  .scoring-card{padding:8px;gap:6px}
  .score-entry-header{min-height:38px;align-items:center}
  .score-hint{font-size:.58rem;margin-top:1px}
  .turn-score{font-size:2.75rem}
  .darts-picker{display:flex;align-items:center;gap:7px}
  .darts-picker legend{margin:0;font-size:.56rem}
  .darts-buttons{grid-template-columns:repeat(3,34px);gap:4px}
  .darts-buttons button{height:32px}
  .keypad{gap:7px}
  .key-button{font-size:1.5rem;border-radius:13px;min-height:46px}
  .score-actions .button{min-height:54px}
}

@media(max-width:699px) and (max-height:760px){
  .game-view,.game-main,.score-column,.scoring-card{gap:5px}
  .game-header{min-height:42px}
  .game-header h1{font-size:2rem}
  .scoreboard.many-players .player-card{min-height:58px;padding:5px 7px}
  .scoreboard.many-players .player-score{font-size:1.42rem}
  .scoreboard.many-players .player-meta{font-size:.42rem}
  .turn-card{min-height:50px;padding:6px 10px}
  .turn-card h2{font-size:.98rem}
  .remaining-block strong{font-size:1.65rem}
  .score-entry-header{min-height:30px}
  .score-hint{display:none}
  .turn-score{font-size:2.35rem}
  .visit-tools{min-height:30px}
  .darts-buttons button{height:29px}
  .key-button{min-height:42px;font-size:1.4rem}
  .score-actions .button{min-height:49px}
}

@media(max-width:340px){
  .scoreboard.many-players .player-card{min-height:56px;padding:5px 6px}
  .scoreboard.many-players .player-name{font-size:.61rem}
  .scoreboard.many-players .player-meta{font-size:.39rem}
  .scoreboard.many-players .player-score{font-size:1.28rem}
}

/* v13 player stats popup */
.player-card-button{cursor:pointer;color:inherit;text-align:left;outline:none}
.player-card-button:focus-visible{border-color:var(--green);box-shadow:0 0 0 3px rgba(105,229,150,.18)}
.player-name-row{display:flex;align-items:center;gap:5px;min-width:0}
.player-name-row .player-name{min-width:0;flex:1}
.player-info-icon{flex:0 0 auto;color:var(--green);font-size:.72rem;opacity:.75}
.player-stats-card{width:min(100%,520px);overflow:auto;grid-template-rows:none;text-align:left;padding:18px}
.player-stats-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.player-stats-head h2{margin:3px 0 0;font-size:1.7rem;letter-spacing:-.04em}
.player-stats-content{display:grid;gap:14px;margin-top:12px}
.stats-section h3{margin:0 0 7px;font-size:.78rem;text-transform:uppercase;letter-spacing:.11em;color:var(--muted)}
.stats-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.stat-tile{min-width:0;min-height:72px;padding:10px 11px;border:1px solid var(--border);border-radius:13px;background:var(--surface-2);display:flex;flex-direction:column;justify-content:center}
.stat-tile span{color:var(--muted);font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.stat-tile strong{margin-top:3px;font-size:1.35rem;line-height:1.05;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stat-tile small{margin-top:3px;color:var(--green);font-size:.58rem;font-weight:800}
.stats-footnote{margin:12px 0 0;color:var(--muted);font-size:.65rem;line-height:1.35}

/* Stats moved out of cards: reclaim scoreboard height */
.player-meta{display:none!important}
@media(max-width:699px){
  .scoreboard.many-players .player-card{min-height:54px;padding:5px 7px;grid-template-rows:1fr}
  .scoreboard.many-players .player-details{grid-row:auto}
  .scoreboard.many-players .player-name{font-size:.69rem}
  .scoreboard.many-players .player-score{font-size:1.5rem}
  .player-info-icon{font-size:.62rem}
}
@media(max-width:699px) and (max-height:760px){
  .scoreboard.many-players .player-card{min-height:50px;padding:4px 6px}
  .scoreboard.many-players .player-score{font-size:1.38rem}
}
@media(max-width:340px){
  .scoreboard.many-players .player-card{min-height:48px}
  .scoreboard.many-players .player-name{font-size:.63rem}
  .scoreboard.many-players .player-score{font-size:1.25rem}
  .stats-grid{gap:5px}
  .stat-tile{min-height:64px;padding:8px}
}

/* v15 camera scoring */
.camera-score-button{
  min-height:34px;
  padding:0 10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  border:1px solid rgba(105,229,150,.28);
  border-radius:10px;
  background:rgba(105,229,150,.08);
  color:var(--green);
  font-size:.64rem;
  font-weight:900;
  cursor:pointer;
  white-space:nowrap;
}
.camera-score-button.is-active{background:rgba(105,229,150,.18);border-color:rgba(105,229,150,.72)}
.camera-card{
  width:min(100%,760px);
  max-height:100%;
  overflow:auto;
  display:block;
  text-align:left;
  padding:14px;
}
.camera-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.camera-head h2{margin:3px 0 4px;font-size:clamp(1.2rem,4.8vw,1.8rem);letter-spacing:-.035em}
.camera-head .modal-copy{margin:0}
.camera-stage{
  position:relative;
  width:100%;
  min-height:180px;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:16px;
  background:#020806;
}
.camera-stage video{display:block;width:100%;height:auto;max-height:48vh;object-fit:contain;background:#000}
.camera-stage canvas{position:absolute;left:0;top:0;width:0;height:0;touch-action:none;cursor:crosshair}

.camera-alignment-panel{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;padding:9px 10px;border:1px solid rgba(105,229,150,.3);border-radius:13px;background:rgba(105,229,150,.07)}
.camera-alignment-copy{min-width:0}.camera-alignment-copy strong,.camera-alignment-copy span{display:block}.camera-alignment-copy strong{color:var(--green);font-size:.72rem}.camera-alignment-copy span{margin-top:2px;color:var(--muted);font-size:.64rem;line-height:1.35}.camera-alignment-panel .button{flex:0 0 auto;min-height:40px;padding:0 12px;font-size:.7rem}
.camera-placeholder{position:absolute;inset:0;display:grid;place-content:center;gap:5px;padding:24px;text-align:center;color:var(--muted);background:linear-gradient(180deg,#09140f,#050a08)}
.camera-placeholder strong{color:var(--text);font-size:1rem}.camera-placeholder span{font-size:.72rem;line-height:1.4}
.camera-visit-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:9px;padding:9px 11px;border:1px solid var(--border);border-radius:13px;background:var(--surface-2)}
.camera-visit-bar>div{min-width:0}.camera-visit-bar>div>span{display:block;color:var(--muted);font-size:.6rem;font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.camera-visit-bar>strong{font-size:2rem;line-height:1;color:var(--green)}
.camera-hit-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px;min-height:21px;align-items:center}.camera-hit-chips small{color:var(--muted);font-size:.68rem}
.camera-hit-chip{padding:3px 7px;border-radius:999px;background:var(--surface-3);color:var(--text);font-size:.66rem;font-weight:850}
.camera-suggestion{margin-top:9px;padding:10px;border:1px solid rgba(248,205,102,.28);border-radius:13px;background:rgba(248,205,102,.07);display:grid;gap:8px}
.camera-suggestion>div:first-child span,.camera-suggestion>div:first-child small{display:block}.camera-suggestion>div:first-child span{color:var(--muted);font-size:.6rem;font-weight:850;text-transform:uppercase;letter-spacing:.08em}.camera-suggestion>div:first-child strong{display:block;margin-top:2px;font-size:1.3rem}.camera-suggestion>div:first-child small{margin-top:2px;color:var(--gold);font-size:.64rem;font-weight:800}
.camera-suggestion-actions{display:flex;flex-wrap:wrap;gap:6px}.camera-suggestion-actions .button{flex:1 1 120px}
.camera-status{min-height:34px;margin:9px 2px 0;color:var(--muted);font-size:.72rem;line-height:1.4}.camera-status.is-error{color:#ffaaa5}
.camera-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:9px}.camera-actions .button{min-height:48px}.camera-actions .button:only-child{grid-column:1/-1}
.camera-secondary-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;margin-top:7px}
.camera-footnote{margin:9px 2px 0;color:var(--muted);font-size:.6rem;line-height:1.4}

@media(max-width:699px){
  .visit-tools{justify-content:space-between!important;width:100%}
  .camera-score-button{min-height:32px;padding:0 8px;font-size:.6rem}
  .camera-card{padding:9px;border-radius:16px}
  .camera-head{margin-bottom:7px}.camera-head h2{font-size:1.15rem}.camera-head .modal-copy{font-size:.65rem}
  .camera-stage{min-height:150px;border-radius:13px}.camera-stage video{max-height:38vh}
  .camera-alignment-panel{padding:7px 8px;gap:7px}.camera-alignment-copy span{font-size:.59rem}.camera-alignment-panel .button{min-height:36px;padding:0 9px;font-size:.64rem}
  .camera-visit-bar{padding:7px 9px;margin-top:7px}.camera-visit-bar>strong{font-size:1.65rem}
  .camera-actions{gap:5px;margin-top:7px}.camera-actions .button{min-height:44px;padding:0 10px;font-size:.76rem}
  .camera-suggestion{padding:8px;margin-top:7px}.camera-suggestion-actions .button{min-height:40px;font-size:.7rem}
  .camera-status{margin-top:7px;min-height:30px;font-size:.66rem}
}

@media(max-width:360px){
  .camera-score-button{padding:0 7px}.camera-score-button span{display:none}
  .camera-stage video{max-height:34vh}
  .camera-actions{grid-template-columns:1fr}
}
