/* The homepage supplies the shared palette, masthead and editorial typography.
   Keep these schedule-specific rules scoped away from the other legacy pages. */
.schedule-page {
  --bg: var(--paper);
  --text: var(--ink);
  --surface: #fff;
  --accent: var(--green);
  --accent-strong: var(--green);
  --warm: var(--green);
  --shadow: none;
  --r: 8px;
  --r-sm: 6px;
  --schedule-highlight: #c5ef78;
  --schedule-soft: #eaf3df;
  --schedule-selected: #172c2b;
  --schedule-selected-text: #fff;
  background: var(--paper);
  color: var(--ink);
}
.schedule-page .page-shell { width: 100%; max-width: 1360px; padding: 0 40px; }
.schedule-page .page-title {
  font-family: Georgia, serif;
  font-size: clamp(36px, 4.6vw, 62px);
  font-weight: 700;
  line-height: 1.08;
  letter-spacing: -2px;
  margin: 0 0 10px;
}
.schedule-daily-link {
  border: 1px solid var(--line);
  background: var(--surface);
  border-radius: 6px;
  padding: 10px 17px;
  font-size: 14px;
  font-weight: 650;
  flex-shrink: 0;
}
.schedule-page .day-nav {
  border-block: 1px solid var(--line);
  padding: 15px 3px;
  gap: 7px;
  margin-bottom: 22px;
  scrollbar-width: thin;
}
.schedule-page .day-nav::-webkit-scrollbar { display: block; height: 4px; }
.schedule-page .day-chip,
.schedule-page .filter-chip,
.schedule-page .quick-filter-chip {
  padding: 7px 13px;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--ink);
  font-size: 14px;
  border-radius: 30px;
}
.schedule-page .day-chip[aria-current="page"],
.schedule-page .filter-chip.is-active,
.schedule-page .quick-filter-chip.is-active,
.schedule-page .favorites-button.is-active {
  background: var(--schedule-selected);
  color: var(--schedule-selected-text);
  border-color: var(--schedule-selected);
}
.schedule-page .main-panel { padding: 0; border: 0; background: transparent; box-shadow: none; }
.schedule-page .app-controls { gap: 16px; margin-bottom: 28px; }
.schedule-page .toolbar-actions { flex-wrap: wrap; justify-content: flex-start; gap: 8px; }
.schedule-page .view-mode-toggle { background: var(--surface); box-shadow: none; border-radius: 6px; }
.schedule-page .view-mode-btn { padding: 9px 15px; font-size: 14px; color: var(--muted); }
.schedule-page .view-mode-btn.is-active { background: var(--schedule-selected); color: var(--schedule-selected-text); box-shadow: none; }
.schedule-page .favorites-button,
.schedule-page .watchlist-export-button {
  padding: 8px 12px;
  font-size: 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  color: var(--ink);
}
.schedule-page .jump-now-button {
  padding: 9px 15px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 750;
  background: var(--schedule-highlight);
  color: #172c2b;
}
.schedule-page .toolbar { padding-block: 20px; margin-bottom: 16px; border-block: 1px solid var(--line); gap: 18px; align-items: flex-start; }
.schedule-page .filter-bar-wrapper { flex: 1 1 600px; min-width: 0; }
.schedule-page .filter-bar, .schedule-page .quick-filters { gap: 7px; flex-wrap: wrap; }
.schedule-page .quick-filters { margin-top: 12px; }
.schedule-page .toolbar-search { flex: 1 1 280px; min-width: 0; }
.schedule-page .schedule-search { padding: 12px 14px; background: var(--surface); border-radius: 6px; font-size: 16px; }
.schedule-page .spotlight-panel { min-height: 0; margin-bottom: 26px; }
.schedule-page .spotlight-panel.is-empty { display: none; }
.schedule-page .spotlight-head { margin-bottom: 16px; }
.schedule-page .spotlight-head h2,
.schedule-page .watchlist-head h2,
.schedule-page .favorite-tracker-head h2,
.schedule-page .conflict-head h2 { font-size: 22px; letter-spacing: -.6px; }
.schedule-page .eyebrow { color: var(--green); font-size: 12px; letter-spacing: 1px; margin-bottom: 6px; }
.schedule-page .spotlight-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); gap: 12px; }
.schedule-page .spotlight-card {
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: none;
  border-radius: 8px;
  padding: 18px;
  color: var(--ink);
}
.schedule-page .spotlight-card h3 { font-family: Georgia, serif; font-size: 20px; line-height: 1.25; margin: 12px 0; }
.schedule-page .spotlight-card .spotlight-rank,
.schedule-page .spotlight-card .spotlight-score { color: var(--green); font-size: 12px; }
.schedule-page .spotlight-card .spotlight-sport,
.schedule-page .spotlight-card .spotlight-meta,
.schedule-page .spotlight-card .spotlight-buzz { color: var(--muted); font-size: 13px; }
.schedule-page .spotlight-meter { background: var(--line); height: 4px; }
.schedule-page .spotlight-card .spotlight-meter-fill { background: var(--green); }
.schedule-page .spotlight-card:is(.is-top-hype, .is-top-story) { background: #203b34; color: #fff; border-color: #203b34; }
.schedule-page .spotlight-card:is(.is-top-hype, .is-top-story) :is(.spotlight-rank, .spotlight-score, .spotlight-sport) { color: var(--schedule-highlight); }
.schedule-page .spotlight-card:is(.is-top-hype, .is-top-story) :is(.spotlight-meta, .spotlight-buzz, .recap-final-score) { color: #dbe5df; }
.schedule-page .spotlight-card:is(.is-top-hype, .is-top-story) .spotlight-meter-fill { background: var(--schedule-highlight); }
.schedule-page .spotlight-card:is(.is-top-hype, .is-top-story) :is(.importance-tag, .recap-label) { color: #d3eeae; background: #30452b; border-color: #4c6556; }
.schedule-page .watchlist-panel,
.schedule-page .favorite-tracker-panel,
.schedule-page .conflict-panel { background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 20px; margin-bottom: 20px; }
.schedule-page .status-banner { background: transparent; border: 0; padding: 0; font-size: 14px; }
.schedule-page .progress-card { background: transparent; border: 0; box-shadow: none; padding: 0; }
.schedule-page .progress-track { background: var(--line); height: 3px; }
.schedule-page .progress-fill { background: var(--green); }
.schedule-page .progress-text { font-size: 13px; color: var(--muted); }
.schedule-page .event-list { gap: 10px; }
.schedule-page .hour-divider { margin: 20px 0 7px; }
.schedule-page .hour-divider-tick { position: static; transform: none; font-size: 12px; text-align: left; color: var(--green); }
.schedule-page .hour-divider-line { flex: 1; background: var(--line); }
.schedule-page .schedule-row {
  grid-template-columns: 90px 85px minmax(190px, 1.4fr) minmax(170px, 1fr) minmax(120px, .7fr);
  padding: 20px;
  gap: 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
}
.schedule-page .schedule-row:hover { border-color: var(--green); background: var(--surface); }
.schedule-page .schedule-row:is(.now-target, .is-favorite-game) { border-color: var(--green); box-shadow: inset 3px 0 var(--green); }
.schedule-page .row-matchup h3 { font-size: 18px; line-height: 1.35; }
.schedule-page .row-time-value { font-size: 16px; line-height: 1.3; }
.schedule-page :is(.row-date-value, .event-sport, .watch-label, .status-pill, .league-pill, .importance-tag, .recap-label) { font-size: 12px; }
.schedule-page :is(.watch-value, .odds-line, .odds-total, .event-detail, .event-bracket-link) { font-size: 14px; }
.schedule-page :is(.watch-note, .odds-book) { font-size: 13px; }
.schedule-page .importance-tag { background: var(--schedule-soft); color: var(--green); border-color: var(--line); border-radius: 3px; white-space: normal; }
.schedule-page :is(.channel-group-card, .betting-card, .shortcuts-dialog) { background: var(--surface); border-color: var(--line); border-radius: 8px; box-shadow: none; }
.schedule-page .channel-group-header { background: var(--surface); border-color: var(--line); }
.schedule-page .betting-card:hover { box-shadow: none; border-color: var(--green); }
.schedule-page :is(a, button, input, [role="link"]):focus-visible { outline: 3px solid #168876; outline-offset: 4px; }
.schedule-page .skip:focus { background: var(--surface); }
@media (max-width: 1100px) {
  .schedule-page .schedule-row { grid-template-columns: 85px 70px minmax(160px, 1.3fr) minmax(135px, 1fr); gap: 14px; }
  .schedule-page .row-odds { grid-column: 3 / -1; border: 0; padding: 0; }
}
@media (max-width: 900px) {
  .schedule-page .page-shell { padding: 0 22px; }
  .schedule-page .schedule-row { grid-template-columns: 90px minmax(0, 1fr); }
  .schedule-page .row-sport { align-items: flex-start; }
  .schedule-page .row-matchup, .schedule-page .row-watch, .schedule-page .row-odds { grid-column: 1 / -1; }
  .schedule-page .row-watch { border-top: 1px solid var(--line); padding-top: 14px; }
  .schedule-page .toolbar-search, .schedule-page .filter-bar-wrapper { flex-basis: 100%; }
}
@media (max-width: 650px) {
  .schedule-page .page-shell { padding: 0 18px; }
  .schedule-page .page-title { letter-spacing: -1px; }
  .schedule-page .heading { flex-wrap: wrap; }
  .schedule-page .schedule-daily-link { padding: 8px 12px; }
  .schedule-page .toolbar-actions { justify-content: flex-start; }
  .schedule-page .toolbar-search, .schedule-page .filter-bar-wrapper { flex-basis: auto; width: 100%; }
  .schedule-page .schedule-row { padding: 16px; }
  .schedule-page .watchlist-head-actions { min-width: 0; }
  .schedule-page .watchlist-export-actions { flex-wrap: wrap; }
}
@media (prefers-color-scheme: dark) {
  .schedule-page {
    --surface: #1a2824;
    --schedule-soft: #30452b;
    --schedule-selected: #c5ef78;
    --schedule-selected-text: #172c2b;
  }
}
@media (prefers-reduced-motion: reduce) {
  .schedule-page *, .schedule-page *::before, .schedule-page *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
