/**
 * broadcast.css — "Broadcast" skin for the public leaderboard and signup pages.
 *
 * Borrows from televised golf graphics: navy scorebug panels, tabular white
 * numerals, and the scoreboard convention that red means under par. Yellow
 * marks the leader and primary actions. Loaded last on index.html and
 * signup.html only; admin keeps the base design.
 */

/* ============================================================================
   TOKENS
   ============================================================================ */

:root {
  --bc-navy: #13294b;
  --bc-navy-deep: #0c1d38;
  --bc-navy-raised: #1c3763;
  --bc-navy-line: rgba(255, 255, 255, 0.12);
  --bc-on-navy: #f3f6fa;
  --bc-on-navy-muted: #a3b3c9;

  /* Page chrome (header, hero, ticker, story card, footer) follows the theme */
  --chrome: #ffffff;
  --chrome-deep: #f7f9fc;
  --chrome-ink: #0e1b2c;
  --chrome-muted: #5b6b80;
  --chrome-line: rgba(14, 27, 44, 0.1);
  --chrome-soft: rgba(14, 27, 44, 0.06);
  --bc-yellow: #f5b800;
  --bc-yellow-ink: #1a1400;

  --bc-tile: #13294b;
  --score-under: #d7263d;
  --score-over: #4a5b70;
  --score-even: #4a5b70;

  --color-primary: #13294b;
  --color-primary-dark: #0c1d38;
  --color-primary-light: #24477a;
  --color-secondary: #f5b800;
  --color-secondary-dark: #c99600;
  --color-secondary-light: #ffd34d;

  --color-background: #eef2f7;
  --color-background-alt: #e3e9f1;
  --color-surface: #ffffff;
  --color-surface-hover: #f5f8fb;
  --color-text: #0e1b2c;
  --color-text-secondary: #46576c;
  --color-text-muted: #6e7f95;
  --color-border: #d5dee9;
  --color-border-light: #e4eaf2;

  --color-success: #1f8a4c;
  --color-warning: #c77700;
  --color-danger: #c62839;
  --color-info: #2f6fde;
  --color-active: #1f8a4c;
  --color-cut: #c25e00;
  --color-withdrawn: #6e7f95;
  --color-active-bg: rgba(31, 138, 76, 0.08);
  --color-cut-bg: rgba(194, 94, 0, 0.08);
  --color-withdrawn-bg: rgba(110, 127, 149, 0.1);
  --color-active-border: rgba(31, 138, 76, 0.25);
  --color-cut-border: rgba(194, 94, 0, 0.3);
  --color-withdrawn-border: rgba(110, 127, 149, 0.3);

  --color-accent-gold: #f5b800;
  --color-rank-first: #f5b800;
  --color-rank-second: #a9b6c6;
  --color-rank-third: #c58b5b;

  --rgb-secondary: 245, 184, 0;
  --rgb-success: 31, 138, 76;
  --rgb-danger: 198, 40, 57;
  --rgb-primary: 19, 41, 75;

  --shadow-glow-gold: 0 0 0 2px var(--bc-yellow);
  --shadow-medal: none;
  --shadow-podium-first: 0 1px 0 rgba(14, 27, 44, 0.06);
  --shadow-sm: 0 1px 2px rgba(14, 27, 44, 0.06);
  --shadow-md: 0 2px 6px rgba(14, 27, 44, 0.08);
  --shadow-lg: 0 8px 20px rgba(14, 27, 44, 0.12);
  --shadow-xl: 0 16px 36px rgba(14, 27, 44, 0.16);
  --shadow-card: 0 1px 2px rgba(14, 27, 44, 0.06);
  --shadow-card-hover: 0 4px 12px rgba(14, 27, 44, 0.1);

  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 10px;

  --font-family-display: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', system-ui, sans-serif;
  --font-family-monospace: var(--font-family-main);
}

[data-theme="dark"] {
  --chrome: #13294b;
  --chrome-deep: #0c1d38;
  --chrome-ink: #f3f6fa;
  --chrome-muted: #a3b3c9;
  --chrome-line: rgba(255, 255, 255, 0.12);
  --chrome-soft: rgba(255, 255, 255, 0.08);
  --bc-tile: #2a4d85;
  --score-under: #ff5a6b;
  --score-over: #b3c1d3;
  --score-even: #b3c1d3;

  --color-primary: #7fa6e6;
  --color-primary-dark: #0c1d38;
  --color-primary-light: #a9c4f0;
  --color-secondary: #ffc629;
  --color-secondary-dark: #f5b800;
  --color-secondary-light: #ffd966;

  --color-background: #0a1628;
  --color-background-alt: #0f1e35;
  --color-surface: #132540;
  --color-surface-hover: #1a2f4f;
  --color-text: #eef3f9;
  --color-text-secondary: #b3c1d3;
  --color-text-muted: #8396b0;
  --color-border: #243a5c;
  --color-border-light: #1d3150;

  --color-success: #3ccf7e;
  --color-active: #3ccf7e;
  --color-cut: #ff9a3d;
  --color-danger: #ff5a6b;
  --color-withdrawn: #8396b0;
  --color-active-bg: rgba(60, 207, 126, 0.1);
  --color-cut-bg: rgba(255, 154, 61, 0.1);
  --color-withdrawn-bg: rgba(131, 150, 176, 0.12);
  --color-active-border: rgba(60, 207, 126, 0.3);
  --color-cut-border: rgba(255, 154, 61, 0.35);
  --color-withdrawn-border: rgba(131, 150, 176, 0.35);

  --shadow-card: 0 0 0 1px rgba(255, 255, 255, 0.02);
  --shadow-card-hover: 0 6px 18px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 10px 28px rgba(0, 0, 0, 0.4);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --chrome: #13294b;
    --chrome-deep: #0c1d38;
    --chrome-ink: #f3f6fa;
    --chrome-muted: #a3b3c9;
    --chrome-line: rgba(255, 255, 255, 0.12);
    --chrome-soft: rgba(255, 255, 255, 0.08);
    --bc-tile: #2a4d85;
  --score-under: #ff5a6b;
    --score-over: #b3c1d3;
    --score-even: #b3c1d3;

    --color-primary: #7fa6e6;
    --color-primary-dark: #0c1d38;
    --color-primary-light: #a9c4f0;
    --color-secondary: #ffc629;
    --color-secondary-dark: #f5b800;
    --color-secondary-light: #ffd966;

    --color-background: #0a1628;
    --color-background-alt: #0f1e35;
    --color-surface: #132540;
    --color-surface-hover: #1a2f4f;
    --color-text: #eef3f9;
    --color-text-secondary: #b3c1d3;
    --color-text-muted: #8396b0;
    --color-border: #243a5c;
    --color-border-light: #1d3150;

    --color-success: #3ccf7e;
    --color-active: #3ccf7e;
    --color-cut: #ff9a3d;
    --color-danger: #ff5a6b;
    --color-withdrawn: #8396b0;
    --color-active-bg: rgba(60, 207, 126, 0.1);
    --color-cut-bg: rgba(255, 154, 61, 0.1);
    --color-withdrawn-bg: rgba(131, 150, 176, 0.12);
    --color-active-border: rgba(60, 207, 126, 0.3);
    --color-cut-border: rgba(255, 154, 61, 0.35);
    --color-withdrawn-border: rgba(131, 150, 176, 0.35);

    --shadow-card: 0 0 0 1px rgba(255, 255, 255, 0.02);
    --shadow-card-hover: 0 6px 18px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 10px 28px rgba(0, 0, 0, 0.4);
  }
}

/* ============================================================================
   BASE
   ============================================================================ */

body {
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: antialiased;
}

body::before {
  display: none;
}

h1, h2, h3, h4 {
  font-family: var(--font-family-display);
  letter-spacing: -0.015em;
}

:focus-visible {
  outline: 2px solid var(--bc-yellow);
  outline-offset: 2px;
}

/* ============================================================================
   HEADER — slim bar
   ============================================================================ */

header {
  background: var(--chrome);
  color: var(--chrome-ink);
  border-bottom: 1px solid var(--chrome-line);
}

header::before {
  height: 3px;
  background: var(--bc-yellow);
}

header nav {
  padding: 10px var(--spacing-lg);
}

.brand-mark {
  color: var(--bc-yellow);
}

.brand-text {
  min-width: 0;
}

header h1 {
  color: var(--chrome-ink);
  font-size: var(--font-size-lg);
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 34ch;
}

.brand-subtitle {
  text-transform: none;
  letter-spacing: 0;
  color: var(--chrome-muted);
  font-size: var(--font-size-xs);
}

header .nav-links a {
  text-transform: none;
  letter-spacing: 0;
  border-radius: var(--radius-sm);
  color: var(--chrome-muted);
}

header .nav-links a:hover,
header .nav-links a.active {
  color: var(--chrome-ink);
  background-color: var(--chrome-soft);
  border-color: var(--chrome-line);
}

header .live-status,
header .last-update,
header .update-time,
header .refresh-info {
  color: var(--chrome-ink);
  background: var(--chrome-soft);
  border-color: var(--chrome-line);
}

header .refresh-last-update,
header .refresh-countdown {
  color: var(--chrome-muted);
  border-color: var(--chrome-line);
}

header .theme-toggle,
header .settings-toggle {
  color: var(--chrome-ink);
  background: var(--chrome-soft);
  border-color: var(--chrome-line);
}

header .cache-status.cache-live,
header .cache-status.cache-recent,
header .cache-status.cache-stale,
header .cache-status.cache-old {
  color: var(--chrome-ink);
}

/* ============================================================================
   HERO — the scorebug
   ============================================================================ */

.tournament-hero {
  margin-bottom: 0;
  background: var(--chrome);
  color: var(--chrome-ink);
  border-bottom: 1px solid var(--chrome-line);
}

.tournament-hero::before {
  display: none;
}

.hero-terrain,
.hero-fade {
  display: none;
}

.hero-content {
  padding-bottom: var(--spacing-2xl);
}

@media (min-width: 1024px) {
  .hero-content {
    padding: var(--spacing-2xl) var(--spacing-2xl) var(--spacing-2xl);
  }
}

.hero-live-dot {
  background: var(--score-under);
  letter-spacing: 0.04em;
  border-radius: var(--radius-sm);
}

.hero-round-info {
  text-transform: none;
  letter-spacing: 0;
  color: var(--chrome-muted);
  font-size: var(--font-size-sm);
  border-left-color: var(--chrome-line);
}

.hero-tournament-name {
  font-family: var(--font-family-display);
  font-size: clamp(2rem, 6vw, 3.75rem);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 0.98;
  color: var(--chrome-ink);
  text-shadow: none;
}

.hero-name-year {
  font-style: normal;
  color: var(--chrome-muted);
  font-weight: 600;
}

.hero-venue {
  color: var(--chrome-muted);
}

.hero-venue-icon {
  opacity: 0.8;
}

.hero-meta-item + .hero-meta-item {
  border-left-color: var(--chrome-line);
}

.hero-meta-label {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 500;
  font-size: var(--font-size-xs);
  color: var(--chrome-muted);
}

.hero-meta-value {
  font-family: var(--font-family-display);
  font-weight: 800;
  color: var(--chrome-ink);
}

.hero-pool-status {
  text-transform: none;
  letter-spacing: 0;
}

/* Pool leader: a lower-third tag with the score in a scorebug box */
.hero-lead {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: stretch;
  gap: 0;
  padding: 0;
  background: var(--chrome-deep);
  border: 1px solid var(--chrome-line);
  border-left: 4px solid var(--bc-yellow);
  border-radius: var(--radius-sm);
  overflow: hidden;
  max-width: 480px;
}

.hero-lead__label {
  grid-column: 1;
  padding: 10px 16px 0;
  text-transform: none;
  letter-spacing: 0;
  font-size: var(--font-size-xs);
  font-weight: 600;
  color: var(--bc-yellow);
}

.hero-lead__name {
  grid-column: 1;
  padding: 2px 16px 12px;
  font-family: var(--font-family-display);
  font-size: var(--font-size-2xl);
  font-weight: 800;
  color: var(--chrome-ink);
}

.hero-lead__score {
  grid-column: 2;
  grid-row: 1 / span 2;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 96px;
  padding: 0 18px;
  font-family: var(--font-family-display);
  font-size: 2.5rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: #ffffff;
  background: var(--score-under);
  text-shadow: none;
}

.hero-cta {
  text-transform: none;
  letter-spacing: 0;
  border-radius: var(--radius-sm);
  font-weight: 700;
  box-shadow: none;
}

.hero-cta--primary,
[data-theme="dark"] .hero-cta--primary {
  background: var(--bc-yellow);
  color: var(--bc-yellow-ink);
  border-color: var(--bc-yellow);
}

.hero-cta--primary:hover {
  background: #ffc629;
  box-shadow: none;
  transform: none;
}

.hero-cta--secondary,
[data-theme="dark"] .hero-cta--secondary {
  background: transparent;
  color: var(--chrome-ink);
  border: 1px solid var(--chrome-line);
}

.hero-cta--secondary:hover {
  background: var(--chrome-soft);
}

/* Insight panel on the right: a flat broadcast graphic, no glass */
.hero-story {
  background: var(--chrome-deep);
  border: 1px solid var(--chrome-line);
  border-top: 3px solid var(--bc-yellow);
  border-radius: var(--radius-sm);
  box-shadow: none;
  backdrop-filter: none;
}

.insight-eyebrow {
  text-transform: none;
  letter-spacing: 0;
  color: var(--bc-yellow);
  font-weight: 600;
}

.insight-eyebrow::before {
  display: none;
}

.insight-title {
  font-family: var(--font-family-display);
  font-weight: 800;
  letter-spacing: -0.02em;
  text-shadow: none;
  color: var(--chrome-ink);
}

.insight-body {
  color: var(--chrome-muted);
}

.insight-fact {
  background: var(--chrome-soft);
  border: 1px solid var(--chrome-line);
  border-radius: var(--radius-sm);
  color: var(--chrome-ink);
}

/* ============================================================================
   STATS RAIL — the ticker under the scorebug
   ============================================================================ */

.stats-rail,
[data-theme="dark"] .stats-rail {
  margin-bottom: 0;
  background: var(--chrome-deep);
  border-bottom: 1px solid var(--chrome-line);
  box-shadow: none;
}

.rail-label {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 500;
  color: var(--chrome-muted);
}

.rail-value,
.rail-value--leader {
  color: var(--chrome-ink);
  font-weight: 700;
}

.rail-stat + .rail-stat {
  border-left-color: var(--chrome-line);
}

.rail-value--score {
  border-radius: var(--radius-sm);
  font-weight: 800;
}

.rail-value--score.score-negative {
  color: #ffffff;
  background: var(--score-under);
}

.rail-value--score.score-positive,
.rail-value--score.score-even {
  color: var(--chrome-ink);
  background: var(--chrome-soft);
}

/* ============================================================================
   SECTIONS & LEADERBOARD
   ============================================================================ */

.section-card {
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-card);
}

.leaderboard-header h2 {
  text-transform: none;
  letter-spacing: -0.02em;
  font-weight: 800;
}

.leaderboard-field__eyebrow {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 700;
  font-size: var(--font-size-base);
  color: var(--color-text);
}

.update-indicator {
  text-transform: none;
  letter-spacing: 0;
  background: var(--score-under);
  color: #ffffff;
  border-radius: var(--radius-sm);
}

.leaderboard-card {
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-card);
  background: var(--color-surface);
}

.leaderboard-card:hover {
  box-shadow: var(--shadow-card-hover);
  transform: none;
}

/* Rank: square scorebug tile instead of a medal */
.leaderboard-card__rank {
  background: transparent;
  border-right-color: var(--color-border-light);
}

.leaderboard-card .rank-badge {
  border-radius: var(--radius-sm);
  background: var(--bc-tile);
  color: #ffffff;
  font-family: var(--font-family-display);
  font-weight: 800;
  box-shadow: none;
  border: none;
}

.leaderboard-card .rank-badge--gold {
  background: var(--bc-yellow);
  color: var(--bc-yellow-ink);
}

.leaderboard-card .rank-badge--silver {
  background: var(--color-rank-second);
  color: var(--bc-navy-deep);
}

.leaderboard-card .rank-badge--bronze {
  background: var(--color-rank-third);
  color: #ffffff;
}

/* Podium: flat cards; only first place carries the leader yellow */
.leaderboard-card--first,
.leaderboard-card--second,
.leaderboard-card--third,
[data-theme="dark"] .leaderboard-card--first,
[data-theme="dark"] .leaderboard-card--second,
[data-theme="dark"] .leaderboard-card--third {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-card);
}

.leaderboard-card--first,
[data-theme="dark"] .leaderboard-card--first {
  border-color: var(--bc-yellow);
  box-shadow: inset 0 3px 0 var(--bc-yellow), var(--shadow-card);
}

.leaderboard-card--first .leaderboard-card__rank,
.leaderboard-card--second .leaderboard-card__rank,
.leaderboard-card--third .leaderboard-card__rank {
  background: transparent;
}

.leaderboard-card__name {
  font-family: var(--font-family-display);
  font-weight: 800;
  letter-spacing: -0.015em;
}

.leaderboard-card__score {
  font-family: var(--font-family-display);
  font-weight: 800;
  letter-spacing: -0.03em;
}

.leaderboard-card__score.score-under,
.total-score.under-par {
  color: var(--score-under);
}

.leaderboard-card__score.score-over,
.leaderboard-card__score.score-even,
.total-score.over-par,
.total-score.even-par {
  color: var(--color-text);
}

.leaderboard-card__trophy {
  filter: none;
}

.leaderboard-card-wrapper[data-mine="true"] .leaderboard-card {
  border-color: var(--color-info);
  box-shadow: 0 0 0 2px var(--color-info);
}

/* Golfer chips */
.golfer-chip {
  border-radius: var(--radius-sm);
}

.golfer-chip__score {
  font-weight: 700;
  border-radius: 3px;
}

.golfer-chip__score.score-under {
  color: #ffffff;
  background: var(--score-under);
}

.golfer-chip__score.score-over {
  color: var(--score-over);
  background: transparent;
}

.golfer-chip__score.score-even {
  color: var(--score-even);
  background: transparent;
}

.status-badge {
  text-transform: none;
  letter-spacing: 0;
  border-radius: 3px;
}

/* ============================================================================
   GOLFER TABLE
   ============================================================================ */

.golfer-status-table th {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 600;
  color: var(--color-text-muted);
}

.golfer-status-table .score-col,
.golfer-status-table .today-col {
  font-weight: 700;
}

.today-score.under-par,
.golfer-status-table .under-par {
  color: var(--score-under);
}

.today-score.over-par,
.golfer-status-table .over-par {
  color: var(--score-over);
}

.today-score.even-par,
.golfer-status-table .even-par {
  color: var(--score-even);
}

.filter-btn {
  text-transform: none;
  letter-spacing: 0;
  border-radius: var(--radius-sm);
}

.filter-btn.active {
  background: var(--bc-tile);
  border-color: var(--bc-tile);
  color: #ffffff;
}

/* ============================================================================
   COMPARISON VIEW
   ============================================================================ */

.comparison-view__pick-score.is-under-par,
.comparison-view__participant-score.is-under-par {
  color: var(--score-under);
}

.comparison-view__participant-score.is-over-par,
.comparison-view__participant-score.is-even-par {
  color: var(--color-text);
}

.comparison-view__pick-score.is-over-par,
.comparison-view__pick-score.is-even-par {
  color: var(--score-over);
}

.comparison-view__lead-badge-num {
  font-family: var(--font-family-display);
  font-weight: 800;
  color: var(--color-text);
}

.comparison-view__picks-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.comparison-view__picks-col {
  min-width: 0;
}

/* What it takes to lead: a lower-third under the scores */
.comparison-view__lead-path {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: var(--spacing-md) 0;
  padding: 12px 14px;
  border-left: 4px solid var(--bc-yellow);
  border-radius: var(--radius-sm);
  background: var(--color-background-alt);
}

.comparison-view__lead-path-headline {
  font-family: var(--font-family-display);
  font-size: var(--font-size-base);
  font-weight: 800;
  color: var(--color-text);
}

.comparison-view__lead-path-detail {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}

.comparison-view__lead-path[data-state="locked"],
.comparison-view__lead-path[data-state="final"] {
  border-left-color: var(--color-text-muted);
}

.leaderboard-card__compare {
  min-height: 32px;
  padding: 4px 12px;
  border: 1px solid var(--bc-tile);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--color-text);
  font: inherit;
  font-size: var(--font-size-sm);
  font-weight: 700;
  cursor: pointer;
}

.leaderboard-card__compare:hover {
  background: var(--bc-tile);
  color: #ffffff;
}

/* ============================================================================
   WATCHLIST
   ============================================================================ */

.featured-watchlist__eyebrow,
.featured-player-card__kicker {
  text-transform: none;
  letter-spacing: 0;
}

.featured-player-card,
[data-theme="dark"] .featured-player-card {
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  box-shadow: var(--shadow-card);
}

.featured-player-card__score {
  font-family: var(--font-family-display);
  font-weight: 800;
}

/* ============================================================================
   BUTTONS & FOOTER
   ============================================================================ */

.btn,
.btn-primary {
  text-transform: none;
  letter-spacing: 0;
  border-radius: var(--radius-sm);
}

.btn-primary {
  background: var(--bc-navy);
  border-color: var(--bc-navy);
  color: #ffffff;
}

[data-theme="dark"] .btn-primary {
  background: var(--bc-yellow);
  border-color: var(--bc-yellow);
  color: var(--bc-yellow-ink);
}

footer {
  background: var(--chrome);
  color: var(--chrome-muted);
  border-top: 1px solid var(--chrome-line);
}

/* ============================================================================
   SIGNUP
   ============================================================================ */

/* Group markers follow the leaderboard's podium colors: A gold, B silver, C bronze */
.tier-panel--a .tier-panel__header { border-left-color: var(--color-rank-first); }
.tier-panel--b .tier-panel__header { border-left-color: var(--color-rank-second); }
.tier-panel--c .tier-panel__header { border-left-color: var(--color-rank-third); }

.tier-panel__title {
  font-weight: 800;
}

.golfer-card {
  border-radius: var(--radius-md);
}

.golfer-card--selected,
.golfer-card--selected:hover,
[data-theme="dark"] .golfer-card--selected {
  border-color: var(--bc-tile);
  background: var(--bc-tile);
  color: #ffffff;
}

.golfer-card--selected .golfer-card__name,
.golfer-card--selected .golfer-card__rank {
  color: #ffffff;
}

.golfer-card--selected .golfer-card__check {
  color: var(--bc-yellow);
}

.selection-summary__group h4 {
  text-transform: none;
  letter-spacing: 0;
  color: var(--color-text-muted);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) .golfer-card--selected {
    border-color: var(--bc-tile);
    background: var(--bc-tile);
  }
}

/* ============================================================================
   LAYOUT — scorebug band, standings table, sidebar
   ============================================================================ */

/* Scorebug band: title left, leader tag right; the ticker below carries the stats */
.hero-content {
  padding: var(--spacing-lg) var(--spacing-md) var(--spacing-lg);
}

.hero-meta-grid,
.hero-cta--secondary {
  display: none;
}

.hero-tournament-name {
  font-size: clamp(1.75rem, 5vw, 3rem);
  margin-bottom: 6px;
}

.hero-venue {
  margin-bottom: var(--spacing-md);
}

.hero-lead {
  margin-bottom: var(--spacing-md);
}

.hero-cta-row {
  margin: 0;
}

.hero-cta {
  width: auto;
  min-height: 40px;
  padding: 8px 16px;
}

@media (min-width: 768px) {
  .hero-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
    grid-template-rows: none;
    column-gap: var(--spacing-xl);
    align-items: center;
    padding: var(--spacing-xl) var(--spacing-lg);
  }

  .hero-content > * {
    grid-column: 1;
  }

  .hero-content > .hero-lead {
    grid-column: 2;
    grid-row: 1 / span 4;
    align-self: center;
    margin: 0;
    width: 100%;
  }

  .hero-venue {
    margin-bottom: var(--spacing-sm);
  }
}

@media (min-width: 1024px) {
  .hero-content {
    padding: var(--spacing-xl) var(--spacing-2xl);
  }
}

/* Page: standings with a sidebar on wide screens */
main {
  background: var(--color-background);
  padding-top: var(--spacing-lg);
}

.page-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--spacing-lg);
}

@media (min-width: 1024px) {
  .page-layout {
    grid-template-columns: minmax(0, 1fr) 320px;
    align-items: start;
  }

  .page-wide {
    grid-column: 1 / -1;
  }
}

.page-standings {
  padding: 0;
  overflow: hidden;
}

.page-sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-lg);
  min-width: 0;
}

.page-sidebar .hero-story {
  grid-column: auto;
  grid-row: auto;
  margin: 0;
  color: var(--chrome-ink);
}

.page-sidebar .featured-watchlist {
  margin: 0;
}

.page-sidebar .featured-watchlist__inner {
  padding: 0;
}

.page-sidebar .featured-watchlist__jump {
  display: none;
}

.page-sidebar .featured-watchlist__title {
  font-size: var(--font-size-lg);
}

.page-sidebar .featured-watchlist__rail {
  grid-template-columns: repeat(6, minmax(200px, 1fr));
}

@media (min-width: 1024px) {
  .page-sidebar .featured-watchlist__rail {
    grid-template-columns: minmax(0, 1fr);
    overflow: visible;
  }

  .page-sidebar .featured-player-card {
    min-height: 0;
  }
}

/* Standings header */
.page-standings .leaderboard-header {
  padding: var(--spacing-md) var(--spacing-md) var(--spacing-sm);
  margin: 0;
  border-bottom: 1px solid var(--color-border);
}

.picks-toggle {
  min-height: 36px;
  padding: 6px 12px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  color: var(--color-text);
  font: inherit;
  font-size: var(--font-size-sm);
  font-weight: 600;
  cursor: pointer;
}

.picks-toggle:hover {
  background: var(--color-surface-hover);
}

.picks-toggle[aria-pressed="true"] {
  background: var(--bc-tile);
  border-color: var(--bc-tile);
  color: #ffffff;
}

/* Standings table: every participant is one row, picks open on demand */
.leaderboard-grid {
  display: block;
  padding: 0;
}

.leaderboard-podium,
.leaderboard-field {
  display: block;
  padding: 0;
  margin: 0;
  border: 0;
}

.leaderboard-field__header {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.leaderboard-columns {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  padding: 8px var(--spacing-md) 8px 0;
  font-size: var(--font-size-xs);
  font-weight: 600;
  color: var(--color-text-muted);
  background: var(--color-background-alt);
  border-bottom: 1px solid var(--color-border);
}

.leaderboard-columns span:first-child {
  text-align: center;
}

.leaderboard-columns span:last-child {
  padding-right: 32px;
}

.leaderboard-card-wrapper {
  position: relative;
}

.leaderboard-card,
.leaderboard-card--first,
.leaderboard-card--second,
.leaderboard-card--third,
[data-theme="dark"] .leaderboard-card--first,
[data-theme="dark"] .leaderboard-card--second,
[data-theme="dark"] .leaderboard-card--third {
  border: 0;
  border-bottom: 1px solid var(--color-border-light);
  border-radius: 0;
  box-shadow: none;
  transform: none;
  background: var(--color-surface);
  cursor: pointer;
  min-height: 0;
}

.leaderboard-card:hover,
[data-theme="dark"] .leaderboard-card:hover {
  background: var(--color-surface-hover);
  box-shadow: none;
}

.leaderboard-card:focus-visible {
  outline-offset: -2px;
}

.leaderboard-card--first,
[data-theme="dark"] .leaderboard-card--first {
  box-shadow: inset 4px 0 0 var(--bc-yellow);
}

.leaderboard-card__rank {
  align-items: flex-start;
  border-right: 0;
  padding: 10px 0;
}

.leaderboard-card .rank-badge {
  min-width: 34px;
  height: 34px;
}

.leaderboard-card__trophy {
  display: none;
}

.leaderboard-card__info {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 24px;
  grid-template-areas:
    "name score chevron"
    "summary score chevron"
    "breakdown breakdown breakdown";
  column-gap: var(--spacing-md);
  row-gap: 2px;
  align-items: center;
  align-self: center;
  padding: 10px var(--spacing-sm) 10px 0;
  border-bottom: 0;
}

.leaderboard-card__name {
  grid-area: name;
  font-size: var(--font-size-base);
}

.leaderboard-card__summary {
  grid-area: summary;
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.leaderboard-card__score-container {
  grid-area: score;
  margin: 0;
  justify-content: flex-end;
}

.leaderboard-card__score {
  font-size: 1.625rem;
  line-height: 1;
}

.leaderboard-card__breakdown {
  grid-area: breakdown;
  display: none;
  padding-top: 4px;
  font-size: var(--font-size-xs);
  color: var(--color-text-secondary);
}

.leaderboard-card__expand-hint,
.leaderboard-card__expand-hint:is(*) {
  grid-area: chevron;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  color: var(--color-text-muted);
}

.leaderboard-card__expand-hint .hint-text {
  display: none;
}

.leaderboard-card__expand-hint::after {
  content: '';
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform var(--transition-fast);
}

.leaderboard-card--expanded .leaderboard-card__expand-hint::after {
  transform: rotate(-135deg) translateY(-2px);
}

.leaderboard-card .leaderboard-card__golfers {
  display: none;
  padding: 0 var(--spacing-md) 12px 0;
}

.leaderboard-card.leaderboard-card--expanded .leaderboard-card__golfers {
  display: flex;
}

.leaderboard-card--expanded .leaderboard-card__breakdown {
  display: block;
}

.leaderboard-card.leaderboard-card--expanded .leaderboard-card__rank::after {
  content: none;
}

.leaderboard-card-wrapper .rank-chart-container {
  display: none;
}

.leaderboard-card--expanded + .rank-chart-container {
  display: block;
  padding: 0 var(--spacing-md) 12px 52px;
  background: var(--color-surface);
  border-bottom: 1px solid var(--color-border-light);
}

/* Viewer's own row */
.leaderboard-card-wrapper[data-mine="true"] .leaderboard-card {
  background: rgba(47, 111, 222, 0.07);
  box-shadow: inset 4px 0 0 var(--color-info);
}

.leaderboard-card-wrapper[data-mine="true"]::before,
[data-theme="dark"] .leaderboard-card-wrapper[data-mine="true"]::before {
  content: 'You';
  top: 4px;
  left: 6px;
  padding: 0 5px;
  font-size: 0.625rem;
  letter-spacing: 0;
  color: #ffffff;
  background: var(--color-info);
  border-radius: 3px;
  box-shadow: none;
}

@media (min-width: 768px) {
  .leaderboard-card__info {
    grid-template-columns: minmax(0, 1fr) minmax(0, auto) auto 24px;
    grid-template-areas:
      "name summary score chevron"
      "breakdown breakdown breakdown breakdown";
  }
}

/* ============================================================================
   SLIM MOBILE HEADER
   ============================================================================ */

@media (max-width: 767px) {
  header nav {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: var(--spacing-sm);
    padding: 8px var(--spacing-md);
  }

  header nav .header-brand {
    order: -1;
    flex: 1;
    min-width: 0;
  }

  header nav .live-status {
    order: 0;
    flex: none;
    width: auto;
    flex-wrap: nowrap;
    align-items: center;
    gap: 6px;
    padding: 0;
    border: 0;
    background: transparent;
  }

  header nav .nav-links {
    order: 1;
    flex: none;
  }

  header .refresh-controls {
    flex: none;
    width: auto;
    border: 0;
    background: transparent;
    padding: 0;
  }

  .brand-subtitle,
  header .nav-links > a,
  header .refresh-info,
  header .cache-status,
  header .last-update {
    display: none;
  }

  header h1 {
    font-size: var(--font-size-base);
  }

  /* Standings header: controls in two compact rows */
  .page-standings .leaderboard-header h2 {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }

  .page-standings .leaderboard-info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-sm);
  }

  .page-standings .leaderboard-info .my-pick-control {
    flex: 1 1 100%;
  }

  .page-standings .participant-count {
    display: none;
  }

  /* Standings sit right below once play starts; the button only matters pre-tournament */
  .tournament-hero[data-hero-mode="live"] .hero-cta-row,
  .tournament-hero[data-hero-mode="final"] .hero-cta-row {
    display: none;
  }
}