/* ─── Four Majors Theme System ─── */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;800&family=DM+Sans:wght@400;500;600;700&display=swap');

/* ── Semantic tokens ── */
:root {
  --bg-deep:       #0a1f12;
  --bg-dark:       #0e2a18;
  --bg-mid:        #14391f;
  --bg-light:      #1e5230;
  --accent:        #c9a84c;
  --accent-light:  #e2c97e;
  --accent-dim:    #8a6e2e;
  --cream:         #f5f0e8;
  --cream-dim:     #c8bfa8;
  --line:          rgba(201,168,76,.18);
  --line-strong:   rgba(201,168,76,.35);
  --text-primary:  #f0ebe0;
  --text-muted:    #a09882;
  --text-dim:      #6b6050;
  --hatch-color:   rgba(201,168,76,.025);
  --shadow-card:   0 8px 40px rgba(0,0,0,.55), 0 2px 8px rgba(0,0,0,.35);
  --shadow-modal:  0 32px 100px rgba(0,0,0,.65), 0 8px 24px rgba(0,0,0,.4);
  --gold:          var(--accent);
  --gold-light:    var(--accent-light);
  --gold-dim:      var(--accent-dim);
}

/* ── Masters ── */
.majors-page[data-major="masters"] {
  --bg-deep: #0a1f12; --bg-dark: #0e2a18; --bg-mid: #14391f; --bg-light: #1e5230;
  --accent: #c9a84c; --accent-light: #e2c97e; --accent-dim: #8a6e2e;
  --cream: #f5f0e8; --cream-dim: #c8bfa8;
  --line: rgba(201,168,76,.18); --line-strong: rgba(201,168,76,.35);
  --text-primary: #f0ebe0; --text-muted: #a09882; --text-dim: #6b6050;
  --hatch-color: rgba(201,168,76,.025);
}

/* ── PGA ── */
.majors-page[data-major="pga"] {
  --bg-deep: #080f1f; --bg-dark: #0d1730; --bg-mid: #102040; --bg-light: #172d58;
  --accent: #c0392b; --accent-light: #e05a4b; --accent-dim: #7a2318;
  --cream: #edf2fb; --cream-dim: #a8b8d8;
  --line: rgba(192,57,43,.2); --line-strong: rgba(192,57,43,.4);
  --text-primary: #dde8f8; --text-muted: #7a92b8; --text-dim: #4a5878;
  --hatch-color: rgba(192,57,43,.03);
}

/* ── U.S. Open ── */
.majors-page[data-major="usopen"] {
  --bg-deep: #05080f; --bg-dark: #0a0e1a; --bg-mid: #0f1628; --bg-light: #162038;
  --accent: #b8a060; --accent-light: #d4bc82; --accent-dim: #7a6838;
  --cream: #f0eedd; --cream-dim: #b8b098;
  --line: rgba(184,160,96,.18); --line-strong: rgba(184,160,96,.38);
  --text-primary: #e8e4d8; --text-muted: #909080; --text-dim: #585848;
  --hatch-color: rgba(60,80,160,.04);
}

/* ── The Open ── */
.majors-page[data-major="open"] {
  --bg-deep: #0e0e10; --bg-dark: #161618; --bg-mid: #1e1e22; --bg-light: #2a2a30;
  --accent: #8b2035; --accent-light: #b83050; --accent-dim: #5a1020;
  --cream: #e8e0d0; --cream-dim: #a09880;
  --line: rgba(139,32,53,.22); --line-strong: rgba(139,32,53,.45);
  --text-primary: #e0d8c8; --text-muted: #888070; --text-dim: #555048;
  --hatch-color: rgba(139,32,53,.03);
}

/* ── Modal themes ── */
.majors-modal[data-major="masters"],
#pinModal[data-major="masters"] {
  --bg-deep: #0a1f12; --bg-dark: #0e2a18; --bg-mid: #14391f; --bg-light: #1e5230;
  --accent: #c9a84c; --accent-light: #e2c97e; --accent-dim: #8a6e2e;
  --cream: #f5f0e8; --cream-dim: #c8bfa8;
  --line: rgba(201,168,76,.18); --line-strong: rgba(201,168,76,.35);
  --text-primary: #f0ebe0; --text-muted: #a09882; --text-dim: #6b6050;
}

.majors-modal[data-major="pga"],
#pinModal[data-major="pga"] {
  --bg-deep: #080f1f; --bg-dark: #0d1730; --bg-mid: #102040; --bg-light: #172d58;
  --accent: #c0392b; --accent-light: #e05a4b; --accent-dim: #7a2318;
  --cream: #edf2fb; --cream-dim: #a8b8d8;
  --line: rgba(192,57,43,.2); --line-strong: rgba(192,57,43,.4);
  --text-primary: #dde8f8; --text-muted: #7a92b8; --text-dim: #4a5878;
}

.majors-modal[data-major="usopen"],
#pinModal[data-major="usopen"] {
  --bg-deep: #05080f; --bg-dark: #0a0e1a; --bg-mid: #0f1628; --bg-light: #162038;
  --accent: #b8a060; --accent-light: #d4bc82; --accent-dim: #7a6838;
  --cream: #f0eedd; --cream-dim: #b8b098;
  --line: rgba(184,160,96,.18); --line-strong: rgba(184,160,96,.38);
  --text-primary: #e8e4d8; --text-muted: #909080; --text-dim: #585848;
}

.majors-modal[data-major="open"],
#pinModal[data-major="open"] {
  --bg-deep: #0e0e10; --bg-dark: #161618; --bg-mid: #1e1e22; --bg-light: #2a2a30;
  --accent: #8b2035; --accent-light: #b83050; --accent-dim: #5a1020;
  --cream: #e8e0d0; --cream-dim: #a09880;
  --line: rgba(139,32,53,.22); --line-strong: rgba(139,32,53,.45);
  --text-primary: #e0d8c8; --text-muted: #888070; --text-dim: #555048;
}

/* ── Overall ── */
.majors-page[data-major="overall"] {
  --bg-deep: #0c0e14; --bg-dark: #12151e; --bg-mid: #1a1e2a; --bg-light: #252a38;
  --accent: #7c8aab; --accent-light: #a4b0cc; --accent-dim: #4e576e;
  --cream: #e4e6ed; --cream-dim: #9a9eb0;
  --line: rgba(124,138,171,.18); --line-strong: rgba(124,138,171,.35);
  --text-primary: #dcdee6; --text-muted: #7a7f92; --text-dim: #4a4e5c;
  --hatch-color: rgba(124,138,171,.025);
}

/* ─── Base ─── */
body {
  background: var(--bg-deep);
  color: var(--text-primary);
  font-family: 'DM Sans', system-ui, sans-serif;
}

/* ── Pull to refresh ── */
.ptr-indicator {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%) translateY(-20px);
  z-index: 2000;
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--bg-mid);
  border: 1px solid var(--line-strong);
  border-radius: 20px;
  padding: 8px 18px;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--accent-light);
  opacity: 0;
  transition: transform .2s ease, opacity .2s ease;
  pointer-events: none;
}

.ptr-arrow {
  font-size: 16px;
  transition: transform .2s ease;
  display: inline-block;
}

/* ─── Page Shell ─── */
.majors-page {
  max-width: min(900px, 96vw);
  margin: 0 auto;
  padding: 0 8px 80px;
}

/* ─── Header ─── */
.hdr.header-card {
  background: linear-gradient(160deg, var(--bg-mid) 0%, var(--bg-dark) 60%, var(--bg-deep) 100%);
  border: 1px solid var(--line-strong);
  border-radius: 16px;
  padding: 20px 24px 18px;
  margin-bottom: 0;
  position: relative;
  overflow: hidden;
}

.hdr.header-card::before {
  content: '';
  position: absolute; inset: 0;
  background: repeating-linear-gradient(-45deg, transparent, transparent 12px, var(--hatch-color) 12px, var(--hatch-color) 13px);
  pointer-events: none;
}

.hdr.header-card::after {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent-light), transparent);
}

.rules-line {
  font-size: 12px;
  color: var(--text-muted);
  letter-spacing: .04em;
  margin-top: 6px;
}

#mainLogo {
  max-height: 100px;
  width: auto;
  max-width: 100%;
  transition: opacity .25s ease;
}

/* ─── Tabs ─── */
.majors-topbar {
  margin: 16px 0 12px;
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--bg-deep);
  padding: 4px 0 8px;
}

.majors-seg {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.majors-seg::-webkit-scrollbar { display: none; }

.major-tab {
  font-family: 'DM Sans', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  border: 1px solid var(--line);
  background: rgba(0,0,0,.25);
  color: var(--text-muted);
  border-radius: 10px;
  padding: 9px 16px;
  cursor: pointer;
  transition: all .2s ease;
  white-space: nowrap;
  flex: 0 0 auto;
  position: relative;
  overflow: hidden;
}

.major-tab:hover {
  border-color: var(--line-strong);
  color: var(--cream-dim);
  background: rgba(0,0,0,.35);
}

.major-tab.active {
  background: linear-gradient(160deg, var(--bg-light), var(--bg-mid));
  border-color: var(--accent-dim);
  color: var(--accent-light);
  box-shadow: 0 0 0 1px rgba(255,255,255,.06) inset, 0 4px 16px rgba(0,0,0,.35);
}

.major-tab.active::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--accent), transparent);
}

/* ─── Table Card ─── */
.table-card {
  background: linear-gradient(180deg, var(--bg-dark) 0%, var(--bg-deep) 100%);
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--shadow-card);
}

.standings-shell-head {
  padding: 16px 20px 14px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255,255,255,.05), transparent);
  position: relative;
}

.standings-shell-head::after {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent-dim), transparent);
}

.standings-shell-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.standings-shell-kicker {
  font-size: 11px; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 2px;
}

/* ─── Count-up animation ─── */
.countup-grand {
  display: inline-block;
  transition: transform .2s ease;
}

.countup-grand.pop {
  transform: scale(1.12);
}

.countdown-wrap {
  text-align: right;
  flex-shrink: 0;
}

.countdown-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 2px;
}

.countdown-timer {
  font-family: 'DM Sans', monospace;
  font-size: 18px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--accent-light);
  letter-spacing: .03em;
}

.standings-shell-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 20px; font-weight: 700;
  color: var(--cream); letter-spacing: .01em;
}

/* ─── View Table (per-major + overall) ─── */
.view-table-wrap {
  overflow-x: auto;
}

.view-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.view-table thead tr {
  border-bottom: 1px solid var(--line);
}

.view-table th {
  font-size: 11px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--accent-dim);
  padding: 10px 12px;
  text-align: left;
  white-space: nowrap;
}

.view-table tbody tr {
  border-bottom: 1px solid rgba(255,255,255,.05);
  transition: background .15s ease;
}

.view-table tbody tr:hover {
  background: rgba(255,255,255,.04);
}

.view-table tbody tr:last-child {
  border-bottom: none;
}

.view-table td {
  padding: 12px 12px;
  font-size: 14px;
  color: var(--text-primary);
  vertical-align: middle;
}

.view-table td strong {
  font-weight: 700;
  color: var(--cream);
}

/* Column alignments */
.col-rank { text-align: center; width: 40px; }
.col-team { white-space: nowrap; }
.col-picks { overflow: visible; }
.col-total { text-align: right; white-space: nowrap; width: 100px; }
.col-running { text-align: right; white-space: nowrap; width: 100px; }
.col-grand { text-align: right; white-space: nowrap; width: 100px; }
.col-major-total { text-align: right; white-space: nowrap; }

/* Team name inside picks cell */
.picks-team-name {
  font-weight: 700;
  font-size: 14px;
  color: var(--cream);
  margin-right: 6px;
  white-space: nowrap;
}

.picks-players {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}

.money {
  font-family: 'DM Sans', sans-serif;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  color: var(--accent-light) !important;
}

.overall-table {
  table-layout: auto;
}

.money-dim {
  font-family: 'DM Sans', sans-serif;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--cream-dim) !important;
}

/* Rank #1 highlight */
.view-table tbody tr:first-child td.col-rank {
  color: var(--accent);
  font-weight: 800;
  font-size: 15px;
}

/* ─── Picks Cell ─── */
.picks-cell {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
  align-items: center;
}

.pick-pill {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 600;
  color: var(--cream);
  background: rgba(255,255,255,.07);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 4px 8px;
  width: 100%;
  box-sizing: border-box;
}

/* ── Pick scorecard rows (Masters scoreboard style) ── */
.pick-sc {
  display: flex;
  align-items: center;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: #1a1a1a;
  background: #f2efe8;
  border: 1px solid #d4cfc4;
  border-radius: 4px;
  padding: 0;
  width: 100%;
  box-sizing: border-box;
  font-variant-numeric: tabular-nums;
  overflow: hidden;
}

.pick-sc-cut { opacity: .45; }

.pick-sc-name {
  font-weight: 800;
  font-size: 11px;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 5px 8px;
  min-width: 0;
  color: #1a1a1a;
}

.pick-sc-pos {
  font-weight: 800;
  font-size: 11px;
  min-width: 30px;
  text-align: center;
  padding: 5px 2px;
  color: #555;
  flex-shrink: 0;
}

.pick-sc-val {
  font-weight: 800;
  font-size: 12px;
  min-width: 34px;
  text-align: center;
  padding: 5px 2px;
  flex-shrink: 0;
}

.pick-sc-val.sc-under { color: #c0392b; }
.pick-sc-val.sc-even  { color: #1a6b3a; }
.pick-sc-val.sc-over  { color: #1a6b3a; }

.pick-sc-thru, .pick-sc-today {
  font-size: 11px;
  min-width: 30px;
  text-align: center;
  padding: 5px 2px;
  color: #666;
  flex-shrink: 0;
}

.pick-sc-today { font-weight: 700; }
.pick-sc-today.sc-under { color: #c0392b; }
.pick-sc-today.sc-even  { color: #1a6b3a; }
.pick-sc-today.sc-over  { color: #1a6b3a; }

/* Summary pick rows — table-style alignment */
.pick-sc-mobile {
  display: grid !important;
  grid-template-columns: 32px 1fr 42px 46px 42px;
  align-items: center;
}

.pick-sc-mobile .pick-sc-val,
.pick-sc-mobile .pick-sc-thru,
.pick-sc-mobile .pick-sc-today {
  border-left: 1px solid #d4cfc4;
}

.pick-sc-header {
  background: #e0dcd0 !important;
  border: 1px solid #c4bfb0 !important;
  border-radius: 4px 4px 0 0 !important;
  margin-bottom: -1px;
  padding: 2px 0 !important;
}

.pick-sc-header span {
  font-size: 9px !important;
  font-weight: 700 !important;
  color: #666 !important;
  letter-spacing: .06em;
  text-transform: uppercase;
  text-align: center;
  padding: 2px !important;
}

/* Desktop: hole-by-hole mini scorecard */
.pick-sc-desktop {
  gap: 0;
}

.pick-sc-desktop .pick-sc-name {
  flex: 0 0 auto;
  min-width: 100px;
  max-width: 130px;
  border-right: 1px solid #d4cfc4;
}

.pick-sc-desktop .pick-sc-val {
  flex: 0 0 34px;
  border-right: 1px solid #d4cfc4;
}

.pick-sc-holes {
  display: flex;
  flex: 1;
  border-right: 1px solid #d4cfc4;
}

.pick-sc-hole {
  width: 20px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 700;
  flex-shrink: 0;
  border-right: 1px solid #e8e4da;
}

.pick-sc-hole.sc-under { color: #c0392b; }
.pick-sc-hole.sc-even  { color: #1a6b3a; }

.pick-sc-rounds {
  display: flex;
  flex-shrink: 0;
}

.pick-sc-rd {
  width: 24px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 600;
  color: #555;
  border-right: 1px solid #e8e4da;
}

.pick-sc-rd.pick-sc-tot {
  font-weight: 800;
  color: #1a1a1a;
  border-right: none;
}

.pick-owgr {
  font-size: 10px;
  font-weight: 500;
  color: var(--text-muted);
  opacity: .7;
}

.pick-empty {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-dim);
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 20px;
  padding: 2px 10px;
}

.pick-hidden {
  font-size: 12px;
  font-weight: 600;
  font-style: italic;
  color: var(--text-dim);
  opacity: .6;
}

.pick-btn-inline {
  font-family: 'DM Sans', sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  border: 1px solid var(--line);
  background: rgba(0,0,0,.3);
  color: var(--cream-dim);
  border-radius: 6px;
  padding: 3px 10px;
  cursor: pointer;
  transition: all .18s ease;
  white-space: nowrap;
}

.pick-btn-inline:hover {
  border-color: var(--accent-dim);
  color: var(--accent-light);
  background: rgba(255,255,255,.06);
}

.reset-btn {
  border-color: rgba(248,113,113,.3) !important;
  color: #fca5a5 !important;
}
.reset-btn:hover {
  border-color: rgba(248,113,113,.5) !important;
  background: rgba(248,113,113,.1) !important;
}

.locked-label {
  font-size: 10px;
  font-weight: 600;
  color: var(--text-dim);
  letter-spacing: .04em;
}

/* ─── Overall Cards (mobile only) ─── */
.overall-cards {
  display: none;
}

/* ─── Modal ─── */
.majors-modal[hidden] { display: none; }

.majors-modal {
  position: fixed; inset: 0; z-index: 3000;
}

.majors-modal-backdrop {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(6px);
}

.majors-modal-card {
  position: relative;
  width: min(1100px, 94vw);
  max-height: 88dvh;
  overflow: visible;
  margin: 4dvh auto 0;
  background: linear-gradient(180deg, var(--bg-dark), var(--bg-deep));
  border: 1px solid var(--line-strong);
  border-radius: 20px;
  box-shadow: var(--shadow-modal);
  display: flex;
  flex-direction: column;
}

.majors-modal-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent-light), transparent);
  z-index: 1;
}

.majors-modal-head {
  padding: 20px 22px;
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  background: linear-gradient(180deg, rgba(255,255,255,.05), transparent);
}

.sched-kicker {
  display: flex; align-items: center; gap: 6px;
  font-size: 11px; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 4px;
}

.sched-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--accent); display: inline-block;
}

.majors-modal-head h3 {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 20px; font-weight: 700;
  color: var(--cream); margin: 0 0 4px;
}

.majors-modal-head .muted.small {
  font-size: 12px; color: var(--text-muted);
}

.iconBtn {
  background: rgba(255,255,255,.06);
  border: 1px solid var(--line);
  color: var(--text-muted);
  border-radius: 8px;
  width: 32px; height: 32px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px;
  transition: all .15s;
  flex-shrink: 0;
}

.iconBtn:hover {
  background: rgba(255,255,255,.1);
  color: var(--text-primary);
}

.majors-modal-body {
  padding: 16px;
  display: grid;
}

/* ─── Tier Card ─── */
.tier-card {
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
  background: rgba(255,255,255,.02);
  transition: border-color .2s;
}

.tier-card:hover { border-color: var(--line-strong); }

.tier-head {
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.2));
}

.tier-title {
  font-size: 11px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--accent);
}

.tier-picked {
  margin-top: 4px;
  color: var(--text-muted);
  font-size: 12px;
}

.tier-list {
  overflow-y: auto;
}

body.modal-open { overflow: hidden; }

.player-opt {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 10px; align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  cursor: pointer;
  transition: background .12s;
}

.player-opt:last-child { border-bottom: none; }
.player-opt:hover { background: rgba(255,255,255,.04); }
.player-opt.selected { background: rgba(255,255,255,.06); box-shadow: inset 3px 0 0 var(--accent); }
.player-opt.locked { opacity: .4; cursor: not-allowed; }

.player-name { font-weight: 600; font-size: 13px; color: var(--cream); }
.player-meta { color: var(--text-muted); font-size: 12px; }

.lock-pill {
  display: inline-block; padding: 2px 8px; border-radius: 999px;
  font-size: 11px; font-weight: 600;
  background: rgba(180,40,40,.25); color: #fca5a5;
  border: 1px solid rgba(180,40,40,.3);
}

/* ─── Modal Foot ─── */
.majors-modal-foot {
  padding: 14px 18px;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  gap: 10px;
  background: rgba(0,0,0,.3);
}

.majors-modal-foot button {
  font-family: 'DM Sans', sans-serif;
  font-size: 13px; font-weight: 600;
  height: 40px; padding: 0 18px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,.3);
  color: var(--cream-dim);
  cursor: pointer;
  transition: all .18s;
  letter-spacing: .03em;
}

.majors-modal-foot button:hover {
  border-color: var(--accent-dim);
  color: var(--accent-light);
}

#saveMajorPicksBtn {
  background: linear-gradient(160deg, var(--bg-light), var(--bg-mid));
  border-color: var(--accent-dim);
  color: var(--accent-light);
}

#saveMajorPicksBtn:hover {
  border-color: var(--accent);
  color: var(--accent-light);
}

/* ─── Home Button ─── */
.home-btn {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 600;
  color: var(--text-muted); text-decoration: none;
  padding: 8px 14px; border-radius: 10px;
  border: 1px solid var(--line);
  margin: 12px 0 12px 2vw;
  transition: all .18s;
}

.home-btn:hover {
  color: var(--accent-light);
  border-color: var(--accent-dim);
}

/* ─── Scrollbar ─── */
.tier-list::-webkit-scrollbar,
.majors-modal-body::-webkit-scrollbar { width: 4px; }
.tier-list::-webkit-scrollbar-track,
.majors-modal-body::-webkit-scrollbar-track { background: transparent; }
.tier-list::-webkit-scrollbar-thumb,
.majors-modal-body::-webkit-scrollbar-thumb {
  background: var(--accent-dim); border-radius: 2px;
}

/* ─── Wizard (all sizes) ─── */
.wizard-nav {
  display: block;
  padding: 10px 16px 8px;
  border-bottom: 1px solid var(--line);
  background: rgba(0,0,0,.2);
}

.wizard-steps {
  display: flex; justify-content: center; align-items: center;
  gap: 8px; padding-bottom: 6px;
}

.wizard-step-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: rgba(255,255,255,.18); transition: all .2s;
}

.wizard-step-dot.active {
  background: var(--accent); width: 22px; border-radius: 4px;
}

.wizard-step-dot.done { background: var(--accent-dim); }

.wizard-step-label {
  font-size: 11px; font-weight: 700;
  letter-spacing: .10em; text-transform: uppercase;
  color: var(--text-muted); text-align: center;
}

/* Wizard: one tier at a time */
.majors-modal-body {
  grid-template-columns: 1fr;
  gap: 0;
  overflow: hidden;
  flex: 1;
  min-height: 0;
}

.tier-card {
  display: none;
  flex-direction: column;
  height: 100%;
}

.tier-card.wizard-active {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.tier-list {
  max-height: none;
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* Wizard footer: show back/next, hide save until last step */
.majors-modal-foot {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

#saveMajorPicksBtn { display: none; }
#saveMajorPicksBtn.wizard-last { display: block; }
#clearMajorPicksBtn { display: none; }
.wizard-back-btn, .wizard-next-btn { display: block !important; }
.wizard-next-btn.wizard-hide { display: none !important; }

/* ══════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════ */

@media (max-width: 760px) {
  .majors-page {
    padding: 0 4px 40px;
  }

  .hdr.header-card {
    padding: 14px 16px;
    border-radius: 12px;
  }

  .rules-line { font-size: 11px; }

  #mainLogo { max-height: 70px; }

  .majors-topbar { margin: 10px 0 8px; padding: 2px 0 6px; }

  .major-tab {
    font-size: 11px;
    padding: 7px 12px;
  }

  .standings-shell-head { padding: 12px 14px 10px; }
  .standings-shell-title { font-size: 17px; }

  .table-card { border-radius: 12px; }

  /* Per-major table: stack picks vertically */
  .view-table th, .view-table td {
    padding: 8px 8px;
    font-size: 13px;
  }

  .col-rank { width: 30px; }

  .pick-pill {
    font-size: 10px;
    padding: 1px 6px;
  }

  .pick-btn-inline {
    font-size: 9px;
    padding: 2px 8px;
  }

  /* Overall: hide table, show cards */
  .overall-table { display: none; }

  .overall-cards {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
  }

  .overall-card {
    background: rgba(255,255,255,.03);
    border: 1px solid var(--line);
    border-radius: 12px;
    overflow: hidden;
  }

  .overall-card-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
    background: linear-gradient(180deg, rgba(255,255,255,.04), transparent);
  }

  .overall-card-rank {
    font-size: 14px;
    font-weight: 800;
    color: var(--accent);
    min-width: 24px;
    text-align: center;
  }

  .overall-card-name {
    font-weight: 700;
    font-size: 15px;
    color: var(--cream);
    flex: 1;
  }

  .overall-card-total {
    font-size: 15px;
  }

  .overall-card-majors {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1px;
    background: var(--line);
  }

  .overall-card-major {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 14px;
    background: var(--bg-dark);
  }

  .overall-card-label {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--text-muted);
  }

  .overall-card-val {
    font-size: 13px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--cream-dim);
  }
}

/* ─── Small mobile: picks column becomes stacked ─── */
@media (max-width: 520px) {
  .view-table th.col-picks,
  .view-table td.col-picks {
    min-width: 0;
  }

  .picks-cell {
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
  }

  .pick-pill {
    white-space: nowrap;
  }

  .col-total, .col-running, .col-grand {
    font-size: 12px !important;
  }

  .view-table th, .view-table td {
    padding: 8px 6px;
    font-size: 12px;
  }
}

/* ─── Mobile Wizard (modal) ─── */
@media (max-width: 640px) {
  .majors-modal-card {
    width: 100vw; height: 100dvh; max-height: 100dvh;
    margin: 0; border-radius: 0; border: none; overflow: hidden;
  }

  .tier-card {
    border-radius: 0; border: none;
    border-top: 1px solid var(--line);
  }

  .majors-modal-body {
    padding: 0;
  }

  .majors-modal-foot {
    padding: 10px 14px;
    padding-bottom: max(10px, env(safe-area-inset-bottom));
  }

  .majors-modal-foot button { width: 100%; }
}
.admin-btn {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 100;
  background: var(--card-bg, #1a2535);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  padding: .4rem .75rem;
  color: inherit;
  cursor: pointer;
  font-size: .85rem;
  opacity: .4;
  transition: opacity .2s;
}
.admin-btn:hover { opacity: 1; }
.is-admin .admin-btn {
  opacity: 1;
  border-color: var(--accent, #3b82f6);
  color: var(--accent, #3b82f6);
}
.admin-modal {
  position: fixed; inset: 0; z-index: 300;
  display: none;
  align-items: center; justify-content: center;
}
.admin-modal:not([hidden]) {
  display: flex;
}
.admin-backdrop {
  position: absolute; inset: 0; background: rgba(0,0,0,.6);
}
.admin-card {
  position: relative;
  background: var(--card-bg, #1a2535);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 16px;
  padding: 2rem;
  width: 280px;
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
.admin-modal-title {
  margin: 0;
  font-size: 1.1rem;
  text-align: center;
}
.admin-pw-input {
  width: 100%;
  padding: .65rem .75rem;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(255,255,255,.05);
  color: inherit;
  font-size: 1rem;
  box-sizing: border-box;
  outline: none;
}
.admin-pw-input:focus {
  border-color: var(--accent, #3b82f6);
}
.admin-pw-error {
  color: #f87171;
  font-size: .8rem;
  text-align: center;
}
.admin-modal-btns {
  display: flex;
  gap: .5rem;
  justify-content: flex-end;
}
.admin-cancel-btn {
  padding: .5rem 1rem;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.15);
  background: transparent;
  color: inherit;
  cursor: pointer;
}
.admin-submit-btn {
  padding: .5rem 1rem;
  border-radius: 8px;
  border: none;
  background: var(--accent, #3b82f6);
  color: #fff;
  cursor: pointer;
  font-weight: 600;
}

/* ─── PIN Modal ─── */
.pin-card {
  width: 300px;
  text-align: center;
}

.pin-digits {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin: 8px 0 4px;
}

.pin-digit {
  width: 48px;
  height: 56px;
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  font-family: 'DM Sans', sans-serif;
  border-radius: 10px;
  border: 2px solid rgba(255,255,255,.15);
  background: rgba(255,255,255,.05);
  color: var(--cream, #f5f0e8);
  outline: none;
  transition: border-color .2s;
  caret-color: var(--accent);
}

.pin-digit:focus {
  border-color: var(--accent, #c9a84c);
  box-shadow: 0 0 0 3px rgba(201,168,76,.2);
}

.pin-digit.pin-error {
  border-color: #f87171;
  animation: pin-shake .4s ease;
}

@keyframes pin-shake {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-4px); }
  40%, 80% { transform: translateX(4px); }
}

/* ─── Clickable row ─── */
tr.row-pickable {
  cursor: pointer;
}

tr.row-pickable:hover {
  background: rgba(255,255,255,.06) !important;
}

/* ─── Welcome Modal ─── */
.welcome-card {
  width: 340px;
  text-align: left;
  background: linear-gradient(180deg, #14391f, #0e2a18);
  border: 1px solid rgba(201,168,76,.35);
}

.welcome-title {
  margin: 0 0 16px;
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 18px;
  font-weight: 700;
  color: #f5f0e8;
  text-align: center;
}

.welcome-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, #e2c97e, transparent);
}

.welcome-steps {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 14px;
}

.welcome-step {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: #f0ebe0;
  line-height: 1.4;
}

.welcome-num {
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #c9a84c;
  color: #0a1f12;
  font-size: 12px;
  font-weight: 800;
}

.welcome-note {
  font-size: 11px;
  color: #a09882;
  margin: 0 0 14px;
  line-height: 1.4;
}

.welcome-btn {
  width: 100%;
  padding: .6rem 1rem;
  font-size: 14px;
  background: #c9a84c;
  color: #0a1f12;
  font-weight: 700;
  border: none;
}

.welcome-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.6);
}

.team-pin {
  font-size: 10px;
  font-weight: 600;
  color: var(--text-dim);
  letter-spacing: .08em;
  margin-left: 6px;
  font-family: 'DM Sans', monospace;
}

/* ═══════════════════════════════════════════════
   LIVE TOURNAMENT — Status Badge
   ═══════════════════════════════════════════════ */
.tournament-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 4px;
  margin-left: 8px;
  vertical-align: middle;
  animation: badge-pulse 2s ease-in-out infinite;
}

.status-active {
  background: rgba(74,222,128,.2);
  color: #4ade80;
  border: 1px solid rgba(74,222,128,.35);
}

.status-post-cut {
  background: rgba(250,204,21,.15);
  color: #facc15;
  border: 1px solid rgba(250,204,21,.3);
}

.status-complete {
  background: rgba(96,165,250,.15);
  color: #60a5fa;
  border: 1px solid rgba(96,165,250,.3);
  animation: none;
}

@keyframes badge-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .6; }
}

.last-update {
  font-size: 10px;
  color: var(--text-dim);
  margin-top: 2px;
}

/* ═══════════════════════════════════════════════
   LIVE TOURNAMENT — Rank Arrows
   ═══════════════════════════════════════════════ */
.rank-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
}

.rank-arrow {
  font-size: 10px;
  line-height: 1;
  animation: arrow-pop .5s ease;
  margin-left: 2px;
}

.rank-arrow.rank-up {
  color: #4ade80;
  filter: drop-shadow(0 0 3px rgba(74,222,128,.4));
}

.rank-arrow.rank-down {
  color: #f87171;
  filter: drop-shadow(0 0 3px rgba(248,113,113,.4));
}

@keyframes arrow-pop {
  0% { transform: scale(0); opacity: 0; }
  50% { transform: scale(1.6); }
  100% { transform: scale(1); opacity: 1; }
}

/* Row flash on rank change */
tr.rank-changed {
  animation: rank-flash 1.5s ease;
}

tr.rank-up {
  animation: rank-slide-up .6s ease;
}

tr.rank-down {
  animation: rank-slide-down .6s ease;
}

@keyframes rank-flash {
  0% { background: rgba(255,255,255,.08); }
  100% { background: transparent; }
}

@keyframes rank-slide-up {
  0% { transform: translateY(6px); opacity: .7; }
  100% { transform: translateY(0); opacity: 1; }
}

@keyframes rank-slide-down {
  0% { transform: translateY(-6px); opacity: .7; }
  100% { transform: translateY(0); opacity: 1; }
}

/* ═══════════════════════════════════════════════
   LIVE TOURNAMENT — Earnings Animation
   ═══════════════════════════════════════════════ */
.earnings-cell {
  transition: color .3s ease;
}

.earnings-up {
  color: #4ade80 !important;
  text-shadow: 0 0 12px rgba(74,222,128,.4);
}

.earnings-down {
  color: #f87171 !important;
  text-shadow: 0 0 12px rgba(248,113,113,.4);
}

/* ═══════════════════════════════════════════════
   LIVE TOURNAMENT — Pick Pills (Live Mode)
   ═══════════════════════════════════════════════ */
.pick-pill-live {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 600;
  color: var(--cream);
  background: rgba(255,255,255,.05);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 4px 8px 4px 4px;
  width: 100%;
  box-sizing: border-box;
}

.pick-pill-pos {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  padding: 2px 6px;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  background: rgba(255,255,255,.08);
  color: var(--cream-dim);
}

.pick-pos-gold {
  background: linear-gradient(135deg, rgba(201,168,76,.3), rgba(226,201,126,.2));
  color: #e2c97e;
  border: 1px solid rgba(201,168,76,.35);
}

.pick-pos-top10 {
  background: rgba(74,222,128,.15);
  color: #4ade80;
  border: 1px solid rgba(74,222,128,.2);
}

.pick-pos-top25 {
  background: rgba(96,165,250,.12);
  color: #93bbfc;
  border: 1px solid rgba(96,165,250,.18);
}

.pick-pill-name {
  font-weight: 600;
  color: var(--cream);
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pick-pill-score {
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--accent-light);
  opacity: .85;
}

.pick-thru {
  font-size: 9px;
  font-weight: 600;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* Cut / Missed Cut */
.pick-pill-cut {
  opacity: .4;
  border-style: dashed;
}

.pick-pill-cut .pick-pill-name {
  text-decoration: line-through;
  color: var(--text-muted);
}

.pick-pos.pick-cut {
  font-size: 9px;
  font-weight: 800;
  padding: 1px 6px;
  border-radius: 3px;
  background: rgba(248,113,113,.15);
  color: #fca5a5;
  border: 1px solid rgba(248,113,113,.2);
  letter-spacing: .06em;
}

/* ─── Earnings column (live) ─── */
.earnings-amount {
  display: block;
}

.earnings-projected-tag {
  display: block;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-dim);
  margin-top: 1px;
}

/* ─── Better row spacing during live mode ─── */
.picks-players {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}

/* ═══════════════════════════════════════════════
   CELEBRATION OVERLAY
   ═══════════════════════════════════════════════ */
.celebration-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,.85);
  backdrop-filter: blur(10px);
  opacity: 0;
  transition: opacity .6s ease;
  pointer-events: none;
}

.celebration-overlay.celebration-active {
  opacity: 1;
  pointer-events: auto;
}

#confettiCanvas {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.celebration-content {
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  animation: celebration-entrance .8s ease .3s both;
}

@keyframes celebration-entrance {
  0% { transform: scale(.5) translateY(40px); opacity: 0; }
  60% { transform: scale(1.05) translateY(-5px); }
  100% { transform: scale(1) translateY(0); opacity: 1; }
}

.trophy-wrap {
  width: 120px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 600px;
}

.trophy-spin {
  font-size: 80px;
  animation: trophy-rotate 3s ease-in-out infinite;
  filter: drop-shadow(0 0 30px rgba(201,168,76,.5));
}

@keyframes trophy-rotate {
  0% { transform: rotateY(0deg) scale(1); }
  25% { transform: rotateY(90deg) scale(1.1); }
  50% { transform: rotateY(180deg) scale(1); }
  75% { transform: rotateY(270deg) scale(1.1); }
  100% { transform: rotateY(360deg) scale(1); }
}

.celebration-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--accent-light, #e2c97e);
  opacity: .8;
}

.celebration-winner {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 42px;
  font-weight: 800;
  color: #f5f0e8;
  text-shadow: 0 0 40px rgba(201,168,76,.4);
  animation: winner-glow 2s ease-in-out infinite alternate;
}

@keyframes winner-glow {
  0% { text-shadow: 0 0 20px rgba(201,168,76,.3); }
  100% { text-shadow: 0 0 50px rgba(201,168,76,.6), 0 0 80px rgba(201,168,76,.2); }
}

.celebration-earnings {
  font-family: 'DM Sans', sans-serif;
  font-size: 28px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--accent, #c9a84c);
}

.celebration-dismiss {
  margin-top: 16px;
  font-family: 'DM Sans', sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 12px 36px;
  border-radius: 12px;
  border: 1px solid rgba(201,168,76,.4);
  background: rgba(201,168,76,.15);
  color: #e2c97e;
  cursor: pointer;
  transition: all .2s ease;
}

.celebration-dismiss:hover {
  background: rgba(201,168,76,.25);
  border-color: rgba(201,168,76,.6);
  transform: scale(1.05);
}

/* Responsive celebration */
@media (max-width: 520px) {
  .celebration-winner {
    font-size: 28px;
  }
  .celebration-earnings {
    font-size: 22px;
  }
  .trophy-spin {
    font-size: 60px;
  }
}

/* ═══════════════════════════════════════════════
   MASTERS SCOREBOARD DRAWER
   ═══════════════════════════════════════════════ */

.lb-drawer {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: min(900px, 96vw);
  max-height: 100vh;
  max-height: 100dvh;
  z-index: 1500;
  display: flex;
  flex-direction: column;
  pointer-events: none;
  box-sizing: border-box;
}

/* ── Full-width curved arch (always visible as header) ── */
.lb-drawer-arch {
  pointer-events: auto;
  cursor: pointer;
  user-select: none;
  width: 100%;
  height: 48px;
  background: #f2efe8;
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: 8px;
  box-shadow: 0 -6px 24px rgba(0,0,0,.18);
  position: relative;
  z-index: 2;
  flex-shrink: 0;
  transition: height .3s ease;
}

.lb-drawer-arch:hover {
  height: 48px;
}

.lb-drawer-arch::before {
  content: '';
  position: absolute;
  top: 6px; left: 8%; right: 8%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.9), transparent);
  pointer-events: none;
}

.lb-drawer-label {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 17px;
  font-weight: 800;
  color: #1a1a1a;
  letter-spacing: .18em;
  text-transform: uppercase;
}

/* ── Flip-tile scoreboard animations ── */

/* Flip cell wrapper */
.cell-flip {
  perspective: 120px;
}

.cell-flip .cell-tile {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 20px;
  border-radius: 2px;
  background: linear-gradient(180deg, #faf8f2 0%, #edeae2 100%);
  box-shadow: inset 1px 1px 2px rgba(255,255,255,.6),
              inset -1px -1px 2px rgba(0,0,0,.06);
  transform-origin: center center;
  animation: flipTileIn var(--flip-dur, .45s) cubic-bezier(.3,.1,.3,1) var(--flip-delay, 0s) both;
  backface-visibility: hidden;
}

@keyframes flipTileIn {
  0%   { transform: rotateX(90deg); background: #d8d3c6; }
  40%  { transform: rotateX(-8deg); }
  70%  { transform: rotateX(3deg); }
  100% { transform: rotateX(0deg); }
}

/* Loading cascade — blank tiles flipping */
.cell-loading .cell-tile {
  animation: flipCascade .5s cubic-bezier(.3,.1,.3,1) var(--flip-delay, 0s) infinite alternate;
  background: linear-gradient(180deg, #e8e4da 0%, #ddd8cc 100%);
}

@keyframes flipCascade {
  0%   { transform: rotateX(0deg); }
  100% { transform: rotateX(85deg); background: #c8c3b6; }
}

/* Score update flip */
.cell-update .cell-tile {
  animation: flipUpdate .5s cubic-bezier(.3,.1,.3,1) both;
}

@keyframes flipUpdate {
  0%   { transform: rotateX(0deg); }
  45%  { transform: rotateX(90deg); }
  55%  { transform: rotateX(90deg); }
  100% { transform: rotateX(0deg); }
}

/* ── Toolbar (toggle + nine nav) ── */
.lb-toolbar {
  pointer-events: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 1;
  background: #f2efe8;
  padding: 4px 8px 2px;
  border-bottom: 1px solid #d4cfc4;
}

.lb-view-toggle {
  display: flex;
  gap: 2px;
}

.lb-toggle-btn {
  background: #e4e0d6;
  border: 1px solid #c4bfb0;
  color: #888;
  font-size: 14px;
  width: 34px;
  height: 26px;
  border-radius: 5px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .15s;
}

.lb-toggle-btn:hover { background: #d8d3c6; color: #555; }

.lb-toggle-btn.active {
  background: #1a6b3a;
  color: #fff;
  border-color: #145228;
}

/* Front 9 / Back 9 toggle */
.lb-nine-toggle {
  display: flex;
  gap: 2px;
}

.lb-refresh-btn {
  position: absolute;
  left: 10px;
  background: none;
  border: 1px solid #c4bfb0;
  color: #888;
  font-size: 16px;
  width: 26px;
  height: 26px;
  border-radius: 5px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .2s;
}

.lb-refresh-btn:hover { background: #e4e0d6; color: #333; }
.lb-refresh-btn.spinning { animation: lb-refresh-spin .8s linear infinite; }

@keyframes lb-refresh-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.lb-nine-btn {
  position: absolute;
  right: 10px;
  background: #e4e0d6;
  border: 1px solid #c4bfb0;
  color: #777;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .06em;
  padding: 4px 10px;
  height: 26px;
  border-radius: 5px;
  cursor: pointer;
  transition: all .15s;
}

.lb-nine-btn:hover { background: #d8d3c6; color: #444; }

.lb-nine-btn.active {
  background: #1a6b3a;
  color: #fff;
  border-color: #145228;
}

/* ── Panel (the scoreboard content below the arch) ── */
.lb-drawer-panel {
  pointer-events: auto;
  width: 100%;
  max-height: 0;
  overflow: hidden;
  background: #f2efe8;
  box-shadow: 0 0 24px rgba(0,0,0,.25);
  transition: max-height .5s cubic-bezier(.4,0,.2,1);
}

.lb-drawer.open .lb-drawer-panel {
  max-height: 70vh;
}
@supports (height: 1dvh) {
  .lb-drawer.open .lb-drawer-panel { max-height: 70dvh; }
}

/* ── Scoreboard body ── */
.lb-drawer-body {
  overflow-x: auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  max-height: calc(70vh - 40px);
  background: #f2efe8;
  border-top: 2px solid #c4bfb0;
  scrollbar-width: thin;
  scrollbar-color: #c4bfb0 transparent;
}

.lb-drawer-body::-webkit-scrollbar { width: 6px; height: 6px; }
.lb-drawer-body::-webkit-scrollbar-thumb { background: #c4bfb0; border-radius: 3px; }

/* ── Masters grid table ── */
.lb-board {
  border-collapse: collapse;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 13px;
  width: 100%;
  white-space: nowrap;
}

/* Grid POS column */
.lb-board:not(.lb-board-summary) .col-pos {
  text-align: center;
  font-weight: 800;
  font-size: 12px;
  color: #1a1a1a;
  width: 36px;
  min-width: 36px;
  padding: 0 2px;
}

.lb-board:not(.lb-board-summary) thead th.col-pos {
  font-size: 8px;
  line-height: 1.1;
  color: #666;
}

/* Sticky columns for hole-by-hole grid */
.lb-board:not(.lb-board-summary) .col-star,
.lb-board:not(.lb-board-summary) .col-pos,
.lb-board:not(.lb-board-summary) .col-name {
  position: sticky;
  z-index: 3;
  background: #f2efe8;
}
.lb-board:not(.lb-board-summary) .col-star { left: 0; }
.lb-board:not(.lb-board-summary) .col-pos  { left: 28px; }
.lb-board:not(.lb-board-summary) .col-name { left: 64px; }

.lb-board:not(.lb-board-summary) thead .col-star,
.lb-board:not(.lb-board-summary) thead .col-pos,
.lb-board:not(.lb-board-summary) thead .col-name {
  z-index: 5;
  background: #e0dcd0;
}

/* ── Header row ── */
.lb-board thead th {
  background: #e0dcd0;
  color: #1a1a1a;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  text-align: center;
  padding: 4px 0;
  border: 1px solid #c4bfb0;
  position: sticky;
  top: 0;
  z-index: 4;
}

.lb-board thead th.col-name {
  text-align: left;
  padding-left: 8px;
  min-width: 140px;
  font-size: 13px;
  letter-spacing: .12em;
}

.lb-board thead th.col-star {
  width: 28px;
  min-width: 28px;
  padding: 0;
}

.lb-board thead th.col-hole {
  width: 28px;
  min-width: 28px;
}

.lb-board thead th.col-out,
.lb-board thead th.col-in,
.lb-board thead th.col-tot {
  width: 34px;
  min-width: 34px;
  font-weight: 800;
}

/* ── PAR row ── */
.lb-board .par-row th,
.lb-board .par-row td {
  background: #e0dcd0;
  font-weight: 800;
  font-size: 13px;
  text-align: center;
  padding: 4px 0;
  border: 1px solid #c4bfb0;
  color: #1a1a1a;
}

.lb-board .par-row .col-name {
  text-align: left;
  padding-left: 8px;
  letter-spacing: .18em;
}

/* ── Player rows ── */
.lb-board tbody td {
  border: 1px solid #d4cfc4;
  padding: 3px 0;
  text-align: center;
  vertical-align: middle;
  height: 28px;
  font-variant-numeric: tabular-nums;
  background: #f2efe8;
  transition: background .15s;
}

/* Cell inner for 3D beveled look */
.lb-board tbody td .cell {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 20px;
  border-radius: 2px;
  background: linear-gradient(180deg, #faf8f2 0%, #edeae2 100%);
  box-shadow: inset 1px 1px 2px rgba(255,255,255,.6),
              inset -1px -1px 2px rgba(0,0,0,.06);
  margin: 0 1px;
}

/* Player name cell */
.lb-board tbody .col-name {
  text-align: left;
  padding-left: 8px;
  font-weight: 800;
  font-size: 12px;
  color: #1a1a1a;
  letter-spacing: .02em;
  text-transform: uppercase;
  background: #f2efe8;
}

/* Star / favorite column */
.lb-board tbody .col-star {
  background: #f2efe8;
  text-align: center;
  padding: 0;
  width: 28px;
  min-width: 28px;
}

.lb-fav-star {
  cursor: pointer;
  font-size: 15px;
  color: #ccc5b4;
  transition: color .15s, transform .15s;
  line-height: 1;
  display: inline-block;
}

.lb-fav-star:hover {
  color: #c9a84c;
  transform: scale(1.25);
}

.lb-fav-star.lb-fav-active {
  color: #c9a84c;
}

/* Favorite row highlight */
.lb-board tbody tr.lb-fav-row td {
  background: #ece8da;
}

.lb-board tbody tr.lb-fav-row .col-star,
.lb-board tbody tr.lb-fav-row .col-name {
  background: #ece8da;
}

/* Thicker separator after favorites */
.lb-board .fav-sep td {
  height: 6px;
  background: #bfb89e;
}

/* Score colors */
/* Under par = red (birdie or better) */
.lb-score-under {
  color: #c0392b;
  font-weight: 700;
}

/* Even or over par = green */
.lb-score-even {
  color: #1a6b3a;
  font-weight: 700;
}

/* Legacy classes kept for summary view */
.lb-score-eagle {
  color: #c9a84c;
  font-weight: 800;
  background: transparent;
  border-radius: 50%;
  width: 20px; height: 20px;
  display: inline-flex; align-items: center; justify-content: center;
}

.lb-score-birdie {
  color: #c0392b;
  font-weight: 700;
}

.lb-score-bogey {
  color: #1a1a1a;
  font-weight: 700;
}

.lb-score-double {
  color: #1a1a1a;
  font-weight: 800;
  background: #d8d3c6;
  border-radius: 3px;
  width: 20px; height: 20px;
  display: inline-flex; align-items: center; justify-content: center;
}

.lb-score-par {
  color: #1a6b3a;
  font-weight: 600;
}

/* Out / In / Total cells */
.lb-board tbody .col-out,
.lb-board tbody .col-in,
.lb-board tbody .col-tot {
  font-weight: 800;
  font-size: 13px;
  color: #1a1a1a;
  background: #eae7de;
}

/* Group separator rows */
.lb-board .group-sep td {
  height: 4px;
  padding: 0;
  border-left: none;
  border-right: none;
  background: #d8d3c6;
}

/* ── Summary board ── */
.lb-board-summary {
  width: 100%;
  table-layout: auto;
}

.lb-board-summary thead th {
  white-space: nowrap;
}

.lb-board-summary .col-star {
  width: 30px;
  min-width: 30px;
}

.lb-board-summary .col-pos {
  text-align: center;
  font-weight: 800;
  font-size: 14px;
  color: #1a1a1a;
  width: 48px;
}

.lb-board-summary thead th.col-name {
  text-align: left;
  padding-left: 8px;
}

.lb-board-summary .col-topar {
  text-align: center;
  font-weight: 700;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
  width: 62px;
}

.lb-topar-under { color: #c0392b; font-weight: 800; }
.lb-topar-even  { color: #1a6b3a; font-weight: 700; }
.lb-topar-over  { color: #1a1a1a; }

.lb-board-summary .col-thru {
  text-align: center;
  color: #555;
  font-variant-numeric: tabular-nums;
  width: 50px;
}

.lb-board-summary .col-today {
  text-align: center;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: #333;
  width: 56px;
}

.lb-board-summary .col-rd {
  text-align: center;
  font-variant-numeric: tabular-nums;
  color: #555;
  width: 42px;
}

/* Mobile: tighten summary columns to fit without scroll */
@media (max-width: 700px) {
  .lb-board-summary { table-layout: fixed; }
  .lb-board-summary .col-star { width: 20px; }
  .lb-board-summary .col-pos { width: 26px; font-size: 10px; }
  .lb-board-summary thead th.col-name { max-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: 10px; }
  .lb-board-summary tbody .col-name { font-size: 9px; max-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .lb-board-summary .col-topar { width: 36px; font-size: 11px; }
  .lb-board-summary .col-thru { width: 34px; font-size: 10px; }
  .lb-board-summary .col-today { width: 38px; font-size: 10px; }
  .lb-board-summary .col-rd { width: 30px; font-size: 10px; }
  .lb-board-summary .col-rd div.cell { aspect-ratio: 1; display: flex; align-items: center; justify-content: center; }
}

/* Picked player highlight */
.lb-board tbody tr.lb-picked .col-name {
  color: #006340;
}

/* ── Responsive ── */
@media (max-width: 700px) {
  .lb-drawer { width: 100%; padding: 0; }
  .lb-drawer-arch { height: 48px; padding-bottom: 6px; margin-bottom: -4px; }
  .lb-drawer-arch:hover { height: 52px; }
  .lb-drawer-label { font-size: 14px; }
  .lb-board { font-size: 11px; }
  .lb-board thead th { font-size: 9px; }
  .lb-board:not(.lb-board-summary) thead th.col-name { font-size: 10px; min-width: 70px; }
  .lb-board:not(.lb-board-summary) tbody .col-name { font-size: 9px; min-width: 70px; max-width: 80px; overflow: hidden; text-overflow: ellipsis; }
  .lb-board:not(.lb-board-summary) .col-pos { width: 28px; min-width: 28px; font-size: 10px; }
  .lb-board:not(.lb-board-summary) .col-star { width: 22px; min-width: 22px; }
  .lb-board:not(.lb-board-summary) .col-pos  { left: 22px; }
  .lb-board:not(.lb-board-summary) .col-name { left: 50px; }
  .lb-board thead th.col-hole,
  .lb-board tbody td { width: 24px; min-width: 24px; }
  .lb-board tbody td { height: 24px; }
  .lb-drawer.open .lb-drawer-panel { max-height: 70dvh; max-height: 70vh; }
  .lb-drawer-body { max-height: calc(70dvh - 40px); max-height: calc(70vh - 40px); padding-bottom: 80px; }
  @supports (height: 1dvh) {
    .lb-drawer.open .lb-drawer-panel { max-height: 70dvh; }
    .lb-drawer-body { max-height: calc(70dvh - 40px); }
  }
}

/* ── Expandable player rows ── */
.lb-expandable { cursor: pointer; }
.lb-expandable:hover .col-name { text-decoration: underline; }
.lb-expanded { background: #e8e4d8 !important; }

/* ── Inline scorecard row ── */
.lb-scorecard-row { background: #f0ece0; }
.lb-scorecard-row td { padding: 0 !important; }
.lb-sc-loading {
  text-align: center;
  font-size: 11px;
  color: #888;
  padding: 10px 0 !important;
  font-style: italic;
}
.lb-sc-wrap { padding: 8px 10px 10px !important; overflow-x: auto; }
.lb-sc-table {
  width: 100%;
  border-collapse: collapse;
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 11px;
  text-align: center;
}
.lb-sc-table th,
.lb-sc-table td {
  padding: 3px 2px;
  min-width: 22px;
  border: 1px solid #d8d3c6;
}
.lb-sc-holes-header th {
  background: #1a6b3a;
  color: #fff;
  font-weight: 700;
  font-size: 9px;
}
.lb-sc-par-row td {
  background: #e8e4d8;
  font-weight: 600;
  color: #666;
  font-size: 10px;
}
.lb-sc-score-row td { background: #fff; font-weight: 700; }
.lb-sc-sum { font-weight: 700 !important; background: #e8e4d8 !important; }
.lb-sc-holes-header .lb-sc-sum { background: #145228 !important; }

/* Scorecard color coding */
.lb-sc-eagle  { background: #ffd700; color: #333; border-radius: 50%; display: inline-block; width: 20px; height: 20px; line-height: 20px; }
.lb-sc-birdie { background: #c0392b; color: #fff; border-radius: 50%; display: inline-block; width: 20px; height: 20px; line-height: 20px; }
.lb-sc-par    { color: #333; }
.lb-sc-bogey  { background: #2b7fc0; color: #fff; border-radius: 3px; display: inline-block; width: 20px; height: 20px; line-height: 20px; }
.lb-sc-dbl    { background: #1a4f80; color: #fff; border-radius: 3px; display: inline-block; width: 20px; height: 20px; line-height: 20px; }

@media (max-width: 700px) {
  .lb-sc-table { font-size: 9px; }
  .lb-sc-table th, .lb-sc-table td { min-width: 18px; padding: 2px 1px; }
  .lb-sc-eagle, .lb-sc-birdie, .lb-sc-bogey, .lb-sc-dbl { width: 16px; height: 16px; line-height: 16px; font-size: 9px; }
}