/* ── Winner overlay ── */
.winner-overlay { position: fixed; inset: 0; background: var(--dart-bg-screen);
  display: none; align-items: stretch; justify-content: flex-start; z-index: 100;
  flex-direction: column; text-align: center; max-height: 100vh; overflow: hidden; }
.winner-overlay.visible { display: flex; }
.btn-new-game { padding: 14px 36px; background: var(--dart-gold); border: none; border-radius: 10px;
  font-family: 'Bebas Neue', sans-serif; font-size: 22px; letter-spacing: 2px; color: #000; cursor: pointer; }

/* ── Winner overlay tab system ── */
.winner-tab-bar { display: flex; flex-shrink: 0; background: #08080A;
  border-bottom: 1px solid var(--dart-border); }
.winner-tab-btn { flex: 1; padding: 14px 8px 11px; border: none; background: transparent;
  color: var(--dart-text-muted); font-family: 'Bebas Neue', sans-serif; font-size: 17px;
  letter-spacing: 2px; cursor: pointer; border-bottom: 3px solid transparent; transition: color .2s, border-color .2s; }
.winner-tab-btn.winner-tab-active { color: var(--dart-gold); border-bottom-color: var(--dart-gold);
  background: rgba(212,175,55,0.04); }
.winner-tab-premium { background: var(--dart-gold); color: #000; font-size: 9px; padding: 1px 6px;
  border-radius: 8px; vertical-align: middle; margin-left: 5px; font-weight: 700; font-family: sans-serif; }
.winner-tab-pane { flex: 1; min-height: 0; overflow-y: auto; display: flex;
  align-items: flex-start; justify-content: center; }
.winner-tab-hidden { display: none !important; }
.winner-tab-scroll { width: 100%; max-width: 560px; padding: 14px 16px 20px;
  box-sizing: border-box; text-align: center; }

/* ── Video Session (Second Screen) ── */
.vidsession-backdrop { display:none;position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:500;align-items:center;justify-content:center; }
.vidsession-backdrop.visible { display:flex; }
.vidsession-modal { background:#08080A;border:1px solid rgba(212,175,55,.19);border-radius:16px;padding:28px 20px;width:92%;max-width:340px;text-align:center;color:var(--dart-text); }
.vidsession-code { font-family:'Bebas Neue',sans-serif;font-size:56px;letter-spacing:8px;color:var(--dart-gold);margin:8px 0; }
.vidsession-qr { margin:12px auto;width:180px;height:180px;border-radius:8px;background:#08080A;display:block; }
.vidsession-status { font-size:13px;color:var(--dart-text-sec);margin:10px 0; }
.vidsession-status.connected { color:var(--dart-success); }

/* Phone remote screen */
#video-remote { align-items:center;justify-content:center;background:#08080A; }
.vr-card { background:#08080A;border:1px solid rgba(212,175,55,.19);border-radius:16px;padding:24px 20px;width:92%;max-width:360px;text-align:center;color:var(--dart-text); }
.vr-title { font-family:'Bebas Neue',sans-serif;font-size:22px;letter-spacing:2px;color:var(--dart-gold);margin-bottom:16px; }
.vr-preview { width:100%;border-radius:8px;max-height:220px;background:#000;display:block;margin:10px 0; }
.vr-btn { width:100%;padding:14px;border:none;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;margin-top:8px; }
.vr-btn-record { background:var(--dart-danger);color:var(--dart-text); }
.vr-btn-stop { background:var(--dart-bg-chip);color:var(--dart-text); }
.vr-btn-send { background:var(--dart-gold);color:var(--dart-bg-card); }
.vr-status { font-size:13px;color:var(--dart-text-sec);margin-top:10px;min-height:20px; }

/* ── TV Sport Comparison Overlay ── */
.tv-overlay-wrap { width:100%; text-align:center; }
.tv-leg-label { font-family:'Bebas Neue',sans-serif; font-size:13px; letter-spacing:3px; color:var(--dart-gold); margin-bottom:14px; }
.tv-header { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:14px; gap:6px; }
.tv-player { flex:1; display:flex; flex-direction:column; align-items:center; gap:5px; min-width:0; }
.tv-player-r { align-items:center; }
.tv-player-center { align-items:center; }
.tv-avatar-img { width:72px; height:72px; border-radius:10px; object-fit:cover; border:2px solid rgba(255,255,255,0.15); flex-shrink:0; }
.tv-avatar-init { width:72px; height:72px; border-radius:10px; background:rgba(255,255,255,0.08); display:flex; align-items:center; justify-content:center; font-family:'Bebas Neue',sans-serif; font-size:26px; color:var(--dart-text); border:2px solid rgba(255,255,255,0.15); flex-shrink:0; }
.tv-avatar-winner { border-color:var(--dart-gold) !important; box-shadow:0 0 12px rgba(212,175,55,0.4); }
.tv-pname { font-family:'Bebas Neue',sans-serif; font-size:14px; letter-spacing:1px; color:var(--dart-text); max-width:110px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tv-winner-badge { font-size:8px; font-weight:700; letter-spacing:2px; color:var(--dart-gold); background:rgba(212,175,55,0.15); border:1px solid rgba(212,175,55,0.5); padding:2px 8px; border-radius:10px; white-space:nowrap; }
.tv-winner-badge-ph { height:16px; }
.tv-result { flex:0 0 auto; padding:0 6px; display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:72px; }
.tv-result-score { font-family:'Bebas Neue',sans-serif; font-size:44px; color:var(--dart-text); line-height:1; }
.tv-result-sep { color:var(--dart-text-sec); margin:0 3px; font-size:32px; vertical-align:middle; }
.tv-result-label { font-size:9px; letter-spacing:3px; color:var(--dart-text-sec); margin-top:2px; }
.tv-stats-table { border-top:1px solid rgba(255,255,255,0.08); padding:4px 0 6px; margin-bottom:14px; }
.tv-stat-row { display:grid; grid-template-columns:1fr 44% 1fr; align-items:center; gap:0; padding:5px 0 3px; border-bottom:1px solid rgba(255,255,255,0.05); }
.tv-stat-row:last-child { border-bottom:none; }
.tv-val-left { text-align:right; font-family:'Bebas Neue',sans-serif; font-size:19px; color:rgba(255,255,255,0.35); padding-right:10px; line-height:1; }
.tv-val-right { text-align:left; font-family:'Bebas Neue',sans-serif; font-size:19px; color:rgba(255,255,255,0.35); padding-left:10px; line-height:1; }
.tv-val-win { color:var(--dart-gold) !important; font-size:21px !important; }
.tv-val-dim { color:rgba(255,255,255,0.22) !important; }
.tv-bar-label-col { display:flex; flex-direction:column; gap:3px; align-items:stretch; }
.tv-bar-track { display:flex; height:3px; border-radius:2px; overflow:hidden; }
.tv-bar-seg { min-width:2px; }
.tv-bar-gold { background:var(--dart-gold); }
.tv-bar-fade { background:rgba(255,255,255,0.1); }
.tv-bar-neutral { background:rgba(255,255,255,0.18); }
.tv-bar-gap { width:2px; background:var(--dart-bg-screen); flex-shrink:0; }
.tv-stat-label { font-size:8px; letter-spacing:1.5px; color:var(--dart-text-muted); text-align:center; text-transform:uppercase; }
.tv-boards-row { display:flex; gap:16px; justify-content:center; padding:6px 0 2px; }
.tv-board-col { display:flex; flex-direction:column; align-items:center; gap:4px; }
.tv-mini-board { width:120px; height:120px; display:block; }
.tv-board-name { font-size:10px; letter-spacing:1px; color:var(--dart-text-sec); font-family:'Bebas Neue',sans-serif; }
/* Single-player variant */
.tv-single-row { display:flex; justify-content:space-between; align-items:center; padding:7px 0; border-bottom:1px solid rgba(255,255,255,0.06); gap:8px; }
.tv-single-row:last-child { border-bottom:none; }
.tv-single-label { font-size:9px; letter-spacing:1.5px; color:var(--dart-text-sec); text-transform:uppercase; text-align:left; }
.tv-single-val { font-family:'Bebas Neue',sans-serif; font-size:20px; color:var(--dart-text); flex-shrink:0; }
/* ── Large variant for MATCH tab ── */
.tv-lg .tv-avatar-img { width:96px; height:96px; border-radius:12px; }
.tv-lg .tv-avatar-init { width:96px; height:96px; font-size:34px; border-radius:12px; }
.tv-lg .tv-result-score { font-size:64px; }
.tv-lg .tv-result-sep { font-size:48px; }
.tv-lg .tv-result { min-width:96px; }
.tv-lg .tv-pname { font-size:17px; max-width:130px; }
.tv-lg .tv-winner-badge { font-size:9px; padding:3px 10px; }
.tv-lg .tv-winner-badge-ph { height:18px; }
.tv-lg .tv-header { margin-bottom:16px; }
.tv-lg .tv-val-left, .tv-lg .tv-val-right { font-size:23px; }
.tv-lg .tv-val-win { font-size:26px !important; }
.tv-lg .tv-bar-track { height:5px; border-radius:3px; }
.tv-lg .tv-stat-row { padding:8px 0 5px; }
.tv-lg .tv-stat-label { font-size:9px; letter-spacing:2px; }
.tv-lg .tv-mini-board { width:140px; height:140px; }
.tv-lg .tv-boards-row { gap:20px; padding:10px 0 4px; }
.tv-lg .tv-single-val { font-size:24px; }
.tv-lg .tv-single-label { font-size:10px; }

/* ── MATCH tab + LEG tab: content scrolls, button pinned at absolute bottom ── */
#winner-tab-match, #leg-tab-match {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  overflow: hidden;
}
#winner-tab-match > .winner-tab-scroll,
#leg-tab-match > .winner-tab-scroll {
  flex: 1 1 0;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  width: 100%;
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
  padding: 14px 16px 8px;
  box-sizing: border-box;
  text-align: center;
}
.match-new-game-bar {
  flex: 0 0 auto;
  align-self: stretch;
  width: 100%;
  padding: 10px 16px 14px;
  background: var(--dart-bg-screen);
  border-top: 1px solid rgba(255,255,255,0.06);
  box-sizing: border-box;
}
/* ── Winner/Leg boards: JS measures remaining space, sets --winner-board-size ── */
#winner-tab-match .tv-mini-board,
#leg-tab-match .tv-mini-board {
  width: var(--winner-board-size, 140px);
  height: var(--winner-board-size, 140px);
  transition: width .2s ease, height .2s ease;
}
/* ── Landscape: compact header+stats to maximise board space ── */
@media (orientation: landscape) {
  #winner-tab-match > .winner-tab-scroll,
  #leg-tab-match > .winner-tab-scroll {
    max-width: min(98vw, 900px);
  }
  /* Avatars in landscape — big enough to read, boards adapt via JS */
  #winner-tab-match .tv-lg .tv-avatar-img,
  #winner-tab-match .tv-lg .tv-avatar-init,
  #leg-tab-match .tv-lg .tv-avatar-img,
  #leg-tab-match .tv-lg .tv-avatar-init {
    width: 175px;
    height: 175px;
  }
  #winner-tab-match .tv-lg .tv-avatar-init,
  #leg-tab-match .tv-lg .tv-avatar-init { font-size: 60px; border-radius: 18px; }
  #winner-tab-match .tv-lg .tv-result-score,
  #leg-tab-match .tv-lg .tv-result-score { font-size: 44px; }
  #winner-tab-match .tv-lg .tv-result-sep,
  #leg-tab-match .tv-lg .tv-result-sep { font-size: 34px; }
  #winner-tab-match .tv-lg .tv-result,
  #leg-tab-match .tv-lg .tv-result { min-width: 72px; }
  #winner-tab-match .tv-lg .tv-pname,
  #leg-tab-match .tv-lg .tv-pname { font-size: 13px; }
  #winner-tab-match .tv-lg .tv-header,
  #leg-tab-match .tv-lg .tv-header { margin-bottom: 8px; }
  /* Compact stat rows (13→6px padding frees ~42px over 6 rows) */
  #winner-tab-match .tv-lg .tv-stat-row,
  #leg-tab-match .tv-lg .tv-stat-row { padding: 4px 0 2px; }
  #winner-tab-match .tv-lg .tv-val-left,
  #winner-tab-match .tv-lg .tv-val-right,
  #leg-tab-match .tv-lg .tv-val-left,
  #leg-tab-match .tv-lg .tv-val-right { font-size: 17px; }
  #winner-tab-match .tv-lg .tv-val-win,
  #leg-tab-match .tv-lg .tv-val-win { font-size: 19px !important; }
  #winner-tab-match .tv-boards-row,
  #leg-tab-match .tv-boards-row {
    gap: 20px;
    padding: 10px 0 4px;
  }
  #winner-tab-match .tv-board-name,
  #leg-tab-match .tv-board-name {
    font-size: 12px;
    letter-spacing: 1px;
  }
}

/* ── Health Check Modal ── */
.health-modal-backdrop { display:none;position:fixed;inset:0;background:rgba(0,0,0,.80);z-index:400;align-items:center;justify-content:center; }
.health-modal-backdrop.visible { display:flex; }
.health-modal { background:#08080A;border:1px solid rgba(212,175,55,.19);border-radius:16px;padding:24px 20px;width:92%;max-width:360px;color:var(--dart-text);font-family:'Segoe UI',sans-serif; }
.health-modal h3 { font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:1px;color:var(--dart-gold);margin:0 0 16px;text-align:center; }
.health-row { margin-bottom:14px; }
.health-row label { display:block;font-size:12px;color:var(--dart-text-sec);letter-spacing:1px;margin-bottom:6px; }
.health-chips { display:flex;gap:6px;flex-wrap:wrap; }
.health-chip { padding:6px 12px;border-radius:20px;border:1px solid rgba(212,175,55,.19);background:#08080A;color:var(--dart-text-sec);font-size:13px;cursor:pointer;transition:all .15s; }
.health-chip.active { background:var(--dart-gold);border-color:var(--dart-gold);color:var(--dart-bg-card);font-weight:700; }
.health-modal-btns { display:flex;gap:10px;margin-top:18px; }
.health-modal-btns button { flex:1;padding:12px;border-radius:10px;border:none;font-size:14px;font-weight:700;cursor:pointer; }
.health-skip-btn { background:var(--dart-bg-chip);color:var(--dart-text-sec); }
.health-save-btn { background:var(--dart-gold);color:var(--dart-bg-card); }
