/* ------------------------------------------------------------------ */
/* Tokens                                                              */
/* The theme is always resolved to data-theme="dark" | "light" by      */
/* renderer.js ("System Auto" follows the OS), so each palette lives   */
/* in exactly one place.                                               */
/* ------------------------------------------------------------------ */
:root {
  color-scheme: dark;

  --radius: 24px;
  --text: #ffffff;
  --muted: rgba(255, 255, 255, 0.85);
  --faint: rgba(255, 255, 255, 0.68);
  --glass: rgba(38, 40, 44, 0.42);
  --glass-full: rgba(30, 32, 36, 0.86);
  --glass-solid: rgba(42, 44, 48, 0.94);
  --glass-border: rgba(255, 255, 255, 0.18);
  --specular: rgba(255, 255, 255, 0.28);
  --sheen: rgba(255, 255, 255, 0.14);
  --card: rgba(48, 50, 54, 0.34);
  --card-border: rgba(255, 255, 255, 0.14);
  --hover: rgba(255, 255, 255, 0.12);
  --pill-track: rgba(45, 47, 52, 0.40);
  --pill-thumb: rgba(255, 255, 255, 0.18);
  --pill-hint: rgba(255, 255, 255, 0.05);
  --scroll: rgba(255, 255, 255, 0.22);
  --option-bg: #1c1c24;
  --option-text: #ffffff;
  --scoring-bg: rgba(10, 132, 255, 0.16);
  --green: #30d158;
  --red: #ff453a;
  --gold: #ffd60a;
  --accent: #0a84ff;
  --error: #ff8f87;

  /* Keeps white text readable over bright wallpapers behind the glass. */
  --text-shadow: 0 1px 3px rgba(0, 0, 0, 0.85), 0 0 8px rgba(0, 0, 0, 0.45);

  --gold-soft: color-mix(in srgb, var(--gold) 20%, transparent);
  --gold-edge: color-mix(in srgb, var(--gold) 55%, transparent);
}

/* Light frosted: a near-white tint that stays opaque enough that dark text
   keeps its contrast over any wallpaper, and no text-shadow (a dark shadow
   under dark text is what made this theme look muddy). */
:root[data-theme="light"] {
  color-scheme: light;

  --text: #0a0c12;
  --muted: rgba(10, 12, 18, 0.76);
  --faint: rgba(10, 12, 18, 0.62);
  --glass: rgba(246, 247, 251, 0.86);
  --glass-full: rgba(244, 245, 250, 0.96);
  --glass-solid: rgba(247, 248, 252, 0.98);
  --glass-border: rgba(10, 12, 18, 0.16);
  --specular: rgba(255, 255, 255, 0.95);
  --sheen: rgba(255, 255, 255, 0.6);
  --card: rgba(255, 255, 255, 0.62);
  --card-border: rgba(10, 12, 18, 0.1);
  --hover: rgba(10, 12, 18, 0.06);
  --pill-track: rgba(10, 12, 18, 0.07);
  --pill-thumb: rgba(255, 255, 255, 0.96);
  --pill-hint: rgba(10, 12, 18, 0.06);
  --scroll: rgba(10, 12, 18, 0.28);
  --option-bg: #ffffff;
  --option-text: #0a0c12;
  --scoring-bg: rgba(10, 99, 209, 0.09);
  --green: #148a3a;
  --red: #d62a20;
  --gold: #b45309;
  --accent: #0a63d1;
  --error: #b42318;

  --text-shadow: none;
}

html.mode-acrylic {
  --radius: 8px;
}

/* ------------------------------------------------------------------ */
/* Base                                                                */
/* ------------------------------------------------------------------ */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html,
body {
  height: 100%;
  background: transparent;
  overflow: hidden;
  color: var(--text);
  font-family: -apple-system, "Segoe UI Variable Display", "Segoe UI Variable Text", "Segoe UI", Inter, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  user-select: none;
  -webkit-user-select: none;
  cursor: default;
}

button,
select,
input {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  cursor: pointer;
}

input[type="checkbox"] {
  accent-color: var(--accent);
}

.drag {
  -webkit-app-region: drag;
}

.no-drag {
  -webkit-app-region: no-drag;
}

/* ------------------------------------------------------------------ */
/* Glass shell                                                         */
/* ------------------------------------------------------------------ */
.shell {
  position: relative;
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--glass);
  backdrop-filter: blur(25px) saturate(180%);
  -webkit-backdrop-filter: blur(25px) saturate(180%);
  border: 1px solid var(--glass-border);
  box-shadow:
    inset 0 1px 0 var(--specular),
    inset 0 -1px 0 rgba(255, 255, 255, 0.05),
    inset 0 0 22px rgba(255, 255, 255, 0.04);
  text-shadow: var(--text-shadow);
}

.shell::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(
    158deg,
    var(--sheen) 0%,
    rgba(255, 255, 255, 0) 30%,
    rgba(255, 255, 255, 0) 72%,
    rgba(255, 255, 255, 0.05) 100%
  );
}

html.mode-acrylic .shell {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* ------------------------------------------------------------------ */
/* Header                                                              */
/* ------------------------------------------------------------------ */
.header {
  position: relative;
  flex: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 12px 6px 18px;
}

.title {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}

.title-main {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.title-sub {
  font-size: 11px;
  color: var(--muted);
  white-space: nowrap;
  transition: color 0.2s ease;
}

.title-sub.error {
  color: var(--error);
}

.actions {
  display: flex;
  align-items: center;
  gap: 2px;
}

.icon-btn {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--muted);
  transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.icon-btn:hover {
  background: var(--hover);
  color: var(--text);
}

.icon-btn:active {
  transform: scale(0.92);
}

.icon-btn svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.icon-btn.active {
  color: var(--text);
}

#pin.active svg {
  fill: currentColor;
  transform: rotate(0deg);
}

#pin:not(.active) svg {
  transform: rotate(45deg);
}

#pin svg {
  transition: transform 0.25s ease;
}

.icon-btn.spin svg {
  animation: spin 0.8s linear infinite;
}

/* ------------------------------------------------------------------ */
/* Date Navigator Bar (Past / Today / Future)                          */
/* ------------------------------------------------------------------ */
.date-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 2px 14px 6px;
  padding: 3px 6px;
  border-radius: 12px;
  background: var(--pill-track);
  border: 1px solid var(--card-border);
}

.date-nav-btn {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: var(--muted);
  transition: background 0.15s ease, color 0.15s ease;
}

.date-nav-btn:hover {
  background: var(--hover);
  color: var(--text);
}

.date-nav-btn svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.date-center {
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
}

.date-label-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 8px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text);
  transition: background 0.15s ease;
}

.date-label-btn:hover {
  background: var(--hover);
}

.cal-icon {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: var(--muted);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.date-input-hidden {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 0;
  height: 0;
}

/* The Today shortcut is intentionally removed from the date bar. */
#todayBtn, .today-pill {
  display: none !important;
}

.today-pill {
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 700;
  background: var(--accent);
  color: #fff;
  letter-spacing: 0.02em;
  text-shadow: none;
}

.today-pill[hidden] {
  display: none;
}

/* ------------------------------------------------------------------ */
/* Segmented pill (6 tabs: Favs, NBA, NFL, CBB, CFB, Live)                       */
/* ------------------------------------------------------------------ */
.segmented {
  position: relative;
  flex: none;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  height: 34px;
  margin: 0 14px 10px;
  padding: 3px;
  border-radius: 999px;
  background: var(--pill-track);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12);
}

.thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: calc((100% - 6px) / 6);
  height: calc(100% - 6px);
  border-radius: 999px;
  background: var(--pill-thumb);
  box-shadow:
    0 1px 3px rgba(0, 0, 0, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.25);
  transition: transform 0.35s cubic-bezier(0.3, 1.25, 0.5, 1);
}

.segmented[data-index="1"] .thumb { transform: translateX(100%); }
.segmented[data-index="2"] .thumb { transform: translateX(200%); }
.segmented[data-index="3"] .thumb { transform: translateX(300%); }
.segmented[data-index="4"] .thumb { transform: translateX(400%); }
.segmented[data-index="5"] .thumb { transform: translateX(500%); }

.seg {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--muted);
  transition: color 0.2s ease;
}

.seg.active {
  color: var(--text);
}

.fav-star {
  color: var(--gold);
  font-size: 11px;
}

.fav-count {
  font-size: 10px;
  padding: 0 5px;
  border-radius: 99px;
  background: var(--gold-soft);
  color: var(--gold);
  font-weight: 700;
}

.fav-count[hidden] {
  display: none;
}

.seg-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--green);
  animation: pulse-green 1.6s ease-out infinite;
}

.seg-dot[hidden] {
  display: none;
}

/* ------------------------------------------------------------------ */
/* Game list                                                           */
/* ------------------------------------------------------------------ */
.list {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 2px 12px 16px;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 18px), transparent);
  mask-image: linear-gradient(to bottom, #000 calc(100% - 18px), transparent);
  transition: opacity 0.14s ease, transform 0.14s ease;
}

.list.leaving {
  opacity: 0;
  transform: translateY(6px);
}

.list::-webkit-scrollbar,
.overlay-body::-webkit-scrollbar,
.team-chip-grid::-webkit-scrollbar {
  width: 4px;
}

.list::-webkit-scrollbar-thumb,
.overlay-body::-webkit-scrollbar-thumb,
.team-chip-grid::-webkit-scrollbar-thumb {
  background: var(--scroll);
  border-radius: 4px;
}

.list.entering .card,
.list.entering .empty {
  animation: rise 0.35s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

/* ------------------------------------------------------------------ */
/* Game card                                                           */
/* ------------------------------------------------------------------ */
.card {
  flex: none;
  padding: 9px 12px 8px;
  border-radius: 16px;
  background: var(--card);
  border: 1px solid var(--card-border);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
  cursor: pointer;
  transition: background 0.16s ease, border-color 0.16s ease, transform 0.14s ease;
}

.card:hover {
  background: var(--hover);
  border-color: var(--glass-border);
}

.card.fav-card {
  border-color: color-mix(in srgb, var(--gold) 35%, transparent);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--gold) 15%, transparent);
}

body.compact .card {
  padding: 6px 11px 6px;
  border-radius: 13px;
}

body.compact .team {
  height: 26px;
}

.card-top {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 16px;
  margin-bottom: 4px;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: var(--muted);
  text-transform: uppercase;
}

.dot {
  display: none;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex: none;
}

.dot.live {
  display: block;
  background: var(--green);
  animation: pulse-green 1.6s ease-out infinite;
}

.dot.break {
  display: block;
  background: var(--red);
  animation: pulse-red 1.6s ease-out infinite;
}

.stats-pill-hint {
  margin-left: auto;
  font-size: 9.5px;
  font-weight: 600;
  color: var(--faint);
  letter-spacing: 0.03em;
  padding: 1px 6px;
  border-radius: 99px;
  background: var(--pill-hint);
}

.plays-pill {
  transition: background 0.15s ease, color 0.15s ease;
}

.plays-pill + .stats-pill-hint {
  margin-left: 4px;
}

.plays-pill[hidden] + .stats-pill-hint {
  margin-left: auto;
}

.plays-pill:hover {
  background: var(--hover);
  color: var(--text);
}

.tag {
  color: var(--faint);
  font-size: 10px;
}

.team {
  display: grid;
  grid-template-columns: 20px 24px minmax(42px, auto) 1fr auto auto;
  align-items: center;
  column-gap: 7px;
  height: 30px;
  border-radius: 8px;
  padding: 0 4px;
  margin: 0 -4px;
  transition: background 0.15s ease, box-shadow 0.15s ease;
}

.team:hover {
  background: rgba(255,255,255,.055);
}

.team:hover .abbr {
  color: var(--accent);
  text-shadow: 0 0 10px color-mix(in srgb, var(--accent) 22%, transparent);
}

 .game-watch-btn {
  border: 1px solid var(--glass-border);
  background: rgba(255,255,255,.045);
  color: var(--muted);
  border-radius: 7px;
  min-width: 92px;
  height: 28px;
  padding: 0 10px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .06em;
  cursor: pointer;
  margin-left: auto;
  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}

.game-watch-btn:hover:not(:disabled) {
  background: var(--hover);
  color: var(--text);
  border-color: color-mix(in srgb, var(--accent) 45%, var(--glass-border));
  transform: translateY(-1px);
}

.game-watch-btn:disabled,
.game-watch-btn[hidden] {
  display: none;
}

.star-btn {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-size: 13px;
  color: var(--faint);
  transition: color 0.15s ease, transform 0.15s ease;
}

.star-btn:hover {
  color: var(--gold);
  transform: scale(1.18);
}

.star-btn.starred {
  color: var(--gold);
}

.logo {
  width: 24px;
  height: 24px;
  object-fit: contain;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.25));
}

.logo.broken {
  visibility: hidden;
}

.abbr {
  font-size: 14.5px;
  font-weight: 650;
  letter-spacing: 0.02em;
  color: var(--text);
}

.record {
  font-size: 11px;
  color: var(--faint);
}

body.hide-records .record {
  display: none;
}

.score {
  min-width: 30px;
  text-align: right;
  font-size: 20px;
  line-height: 1;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  color: var(--text);
  opacity: 0.72;
}

.score.lead {
  font-weight: 800;
  opacity: 1;
}

.score.bump {
  animation: bump 0.8s ease;
}

/* Quick player leader strip at bottom of card */
.card-leaders {
  margin-top: 5px;
  padding-top: 5px;
  border-top: 1px solid var(--card-border);
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  font-size: 10.5px;
  color: var(--muted);
}

body.hide-leaders .card-leaders,
.card-leaders:empty {
  display: none;
}

.leader-chip strong {
  color: var(--text);
  font-weight: 600;
}

.empty {
  margin: auto;
  max-width: 240px;
  padding: 24px 8px;
  text-align: center;
  font-size: 13px;
  line-height: 1.45;
  color: var(--muted);
}

.empty strong {
  display: block;
  margin-bottom: 4px;
  font-size: 14px;
  color: var(--text);
}

.empty-retry-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 12px;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: var(--card);
  color: var(--text);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

/* ------------------------------------------------------------------ */
/* Overlays: game drawer (box score + play-by-play) & settings         */
/* ------------------------------------------------------------------ */
.overlay {
  position: absolute;
  inset: 0;
  z-index: 20;
  display: flex;
  flex-direction: column;
  background: var(--glass-solid);
  backdrop-filter: blur(28px) saturate(190%);
  -webkit-backdrop-filter: blur(28px) saturate(190%);
  border-radius: var(--radius);
  animation: slideIn 0.22s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.overlay[hidden] {
  display: none !important;
}

.overlay-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px 10px;
  border-bottom: 1px solid var(--card-border);
}

.back-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px 4px 4px;
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted);
}

.back-btn:hover {
  background: var(--hover);
  color: var(--text);
}

.back-btn svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
}

.overlay-title {
  font-size: 13.5px;
  font-weight: 700;
}

.header-spacer {
  width: 48px;
}

.overlay-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 10px 12px 18px;
}

/* Hero */
.stats-hero {
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 10px 14px;
  background: var(--card);
  border-bottom: 1px solid var(--card-border);
}

.hero-team {
  display: flex;
  align-items: center;
  gap: 8px;
}

.hero-team img {
  width: 28px;
  height: 28px;
  object-fit: contain;
}

.hero-score {
  font-size: 22px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

.hero-status {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  text-align: center;
}

/* Box score / play-by-play switch */
.detail-tabs {
  flex: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  padding: 8px 12px 0;
}

.detail-tab,
.stats-tab-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 700;
  background: var(--card);
  color: var(--muted);
  border: 1px solid var(--card-border);
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.detail-tab:hover,
.stats-tab-btn:hover {
  background: var(--hover);
  color: var(--text);
}

.detail-tab.active,
.stats-tab-btn.active {
  background: var(--pill-thumb);
  color: var(--text);
  border-color: var(--glass-border);
}

.detail-panes {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.pane {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

#statsDrawer[data-view="box"] .pane-pbp,
#statsDrawer[data-view="pbp"] .pane-box {
  display: none;
}

.stats-team-tabs {
  flex: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  padding: 8px 12px 4px;
}

/* Box score table */
.stat-group-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  margin: 10px 0 5px;
}

.stat-table-wrap {
  overflow-x: auto;
  border-radius: 10px;
  background: var(--card);
  border: 1px solid var(--card-border);
  margin-bottom: 10px;
}

.stat-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

.stat-table th,
.stat-table td {
  padding: 5px 6px;
  text-align: right;
  border-bottom: 1px solid var(--card-border);
  white-space: nowrap;
}

.stat-table th:first-child,
.stat-table td:first-child {
  text-align: left;
  position: sticky;
  left: 0;
  background: var(--glass-solid);
  font-weight: 600;
}

.stat-table th {
  font-size: 10px;
  color: var(--faint);
  font-weight: 700;
}

.player-pos {
  margin-left: 4px;
  font-size: 9.5px;
  color: var(--faint);
  font-weight: 500;
}

.dnp-text {
  color: var(--faint);
  font-style: italic;
  text-align: left !important;
}

/* ------------------------------------------------------------------ */
/* Play-by-play                                                        */
/* ------------------------------------------------------------------ */
.pbp-toolbar {
  flex: none;
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 8px 12px 6px;
  overflow-x: auto;
  scrollbar-width: none;
}

.pbp-toolbar::-webkit-scrollbar {
  display: none;
}

.pbp-chip {
  flex: none;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: var(--pill-track);
  border: 1px solid var(--card-border);
  color: var(--muted);
  transition: background 0.14s ease, color 0.14s ease, border-color 0.14s ease;
}

.pbp-chip:hover {
  background: var(--hover);
  color: var(--text);
}

.pbp-chip.active {
  background: var(--pill-thumb);
  color: var(--text);
  border-color: var(--glass-border);
}

.pbp-chip.scoring.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  text-shadow: none;
}

.pbp-chip.sort {
  margin-left: auto;
}

#pbpBody {
  padding-top: 0;
}

.pbp-period {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 8px 4px 5px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--muted);
  background: var(--glass-solid);
  border-bottom: 1px solid var(--card-border);
}

.play {
  display: grid;
  grid-template-columns: 44px 20px 1fr auto;
  column-gap: 8px;
  align-items: start;
  padding: 7px 6px;
  border-bottom: 1px solid var(--card-border);
  font-size: 12px;
  line-height: 1.35;
}

.play.no-logo {
  grid-template-columns: 44px 1fr auto;
}

.play-clock {
  padding-top: 1px;
  font-size: 11px;
  color: var(--faint);
  font-variant-numeric: tabular-nums;
}

.play-logo {
  width: 20px;
  height: 20px;
  object-fit: contain;
}

.play-logo.broken {
  visibility: hidden;
}

.play-situation {
  display: block;
  font-size: 10.5px;
  font-weight: 600;
  color: var(--faint);
}

.play-score {
  min-width: 46px;
  text-align: right;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  color: var(--muted);
  white-space: nowrap;
}

.play-pts {
  display: block;
  font-size: 12px;
  font-weight: 800;
  color: var(--green);
}

.play.scoring {
  margin: 2px 0;
  border-radius: 10px;
  border-bottom-color: transparent;
  background: var(--scoring-bg);
}

.play.scoring .play-text {
  font-weight: 650;
}

.play-marker {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 4px;
  font-size: 11px;
  font-weight: 600;
  color: var(--faint);
}

.play-marker::before,
.play-marker::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--card-border);
}

/* NFL drives */
.drive {
  margin-top: 10px;
  border-radius: 14px;
  overflow: hidden;
  background: var(--card);
  border: 1px solid var(--card-border);
}

.drive-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--card-border);
}

.drive-head img {
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.drive-head img.broken {
  visibility: hidden;
}

.drive-title {
  font-size: 12.5px;
  font-weight: 700;
}

.drive-result {
  margin-left: 6px;
  font-weight: 600;
  color: var(--muted);
}

.drive.scored .drive-result,
.drive.live .drive-result {
  color: var(--green);
}

.drive-meta {
  font-size: 11px;
  color: var(--faint);
}

.drive .play {
  padding-left: 10px;
  padding-right: 10px;
}

.drive .play:last-child {
  border-bottom: 0;
}

/* ------------------------------------------------------------------ */
/* Settings controls                                                   */
/* ------------------------------------------------------------------ */
.settings-group {
  margin-bottom: 14px;
  padding: 10px 12px;
  border-radius: 14px;
  background: var(--card);
  border: 1px solid var(--card-border);
}

.settings-group-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}

.settings-group-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
  margin-bottom: 8px;
}

.settings-group-header .settings-group-title {
  margin-bottom: 0;
}

.settings-hint {
  font-size: 11px;
  color: var(--faint);
  margin-bottom: 8px;
  line-height: 1.35;
}

.setting-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 0;
  font-size: 12.5px;
  border-bottom: 1px solid var(--card-border);
}

.setting-row:last-child {
  border-bottom: 0;
}

.glass-select {
  padding: 4px 8px;
  border-radius: 8px;
  background: var(--pill-track);
  border: 1px solid var(--card-border);
  font-size: 12px;
  color: var(--text);
}

.glass-select option {
  background: var(--option-bg);
  color: var(--option-text);
}

.league-mini-switch {
  display: inline-flex;
  background: var(--pill-track);
  border-radius: 8px;
  padding: 2px;
}

.mini-tab {
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 700;
  border-radius: 6px;
  color: var(--muted);
}

.mini-tab.active {
  background: var(--pill-thumb);
  color: var(--text);
}

.team-chip-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 5px;
  max-height: 170px;
  overflow-y: auto;
  padding-right: 2px;
}

.team-chip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 5px 4px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
  background: var(--pill-track);
  border: 1px solid var(--card-border);
  color: var(--muted);
  transition: all 0.14s ease;
}

.team-chip:hover {
  background: var(--hover);
  color: var(--text);
}

.team-chip.active {
  background: var(--gold-soft);
  border-color: var(--gold-edge);
  color: var(--text);
}

/* ------------------------------------------------------------------ */
/* Motion                                                              */
/* ------------------------------------------------------------------ */
@keyframes spin {
  to { transform: rotate(360deg); }
}

@keyframes rise {
  from { opacity: 0; transform: translateY(10px) scale(0.98); }
  to { opacity: 1; transform: none; }
}

@keyframes slideIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: none; }
}

@keyframes pulse-green {
  0% { box-shadow: 0 0 0 0 rgba(48, 209, 88, 0.6); }
  70% { box-shadow: 0 0 0 6px rgba(48, 209, 88, 0); }
  100% { box-shadow: 0 0 0 0 rgba(48, 209, 88, 0); }
}

@keyframes pulse-red {
  0% { box-shadow: 0 0 0 0 rgba(255, 69, 58, 0.6); }
  70% { box-shadow: 0 0 0 6px rgba(255, 69, 58, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 69, 58, 0); }
}

@keyframes bump {
  0% { transform: scale(1); }
  30% { transform: scale(1.28); color: var(--green); }
  100% { transform: scale(1); }
}

.detail-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  padding: 6px 12px 4px;
  border-bottom: 1px solid var(--card-border);
}

.detail-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 9px;
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
  background: var(--card);
  border: 1px solid var(--card-border);
}

.detail-tab.active {
  background: var(--pill-thumb);
  color: var(--text);
  border-color: var(--glass-border);
}

.detail-panes {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.pane {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

#statsDrawer[data-view="box"] .pane-pbp { display: none; }
#statsDrawer[data-view="pbp"] .pane-box { display: none; }

.pbp-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px 4px;
}

.pbp-row {
  padding: 7px 10px;
  margin-bottom: 6px;
  border-radius: 10px;
  background: var(--card);
  border: 1px solid var(--card-border);
  font-size: 11.5px;
}

.pbp-row.scoring {
  border-color: rgba(48, 209, 88, 0.45);
  background: rgba(48, 209, 88, 0.1);
}

.pbp-meta {
  font-size: 10px;
  font-weight: 700;
  color: var(--muted);
  margin-bottom: 2px;
}

.pbp-text {
  color: var(--text);
  line-height: 1.35;
}

.pbp-score {
  margin-top: 4px;
  font-size: 10.5px;
  font-weight: 800;
  color: var(--green);
}

.clickable-row {
  cursor: pointer;
  transition: background 0.14s ease;
}

.clickable-row:hover,
.clickable-row:hover td {
  background: var(--hover) !important;
}

.player-modal {
  position: absolute;
  inset: 0;
  z-index: 30;
  display: flex;
  flex-direction: column;
  background: var(--glass-solid);
  backdrop-filter: blur(28px) saturate(190%);
  -webkit-backdrop-filter: blur(28px) saturate(190%);
  border-radius: var(--radius);
  animation: slideIn 0.2s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.player-modal[hidden] {
  display: none !important;
}

.player-bio-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  margin-bottom: 10px;
  border-radius: 14px;
  background: var(--card);
  border: 1px solid var(--card-border);
}

.player-headshot,
.player-headshot-fallback {
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255, 255, 255, 0.08);
}
.player-headshot-fallback {
  display: grid;
  place-items: center;
  color: var(--muted);
  border: 1px solid var(--card-border);
  font-size: 15px;
  font-weight: 850;
}

.player-bio-name {
  font-size: 15px;
  font-weight: 800;
  color: var(--text);
}

.player-bio-sub {
  font-size: 11px;
  color: var(--muted);
  margin-top: 2px;
}

/* ------------------------------------------------------------------ */
/* Global Player Search Bar                                            */
/* ------------------------------------------------------------------ */
.search-wrap {
  position: relative;
  margin: 2px 14px 6px;
  z-index: 10;
}

.search-box {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 5px 10px;
  border-radius: 12px;
  background: var(--pill-track);
  border: 1px solid var(--card-border);
  transition: border-color 0.16s ease, background 0.16s ease;
}

.search-box:focus-within {
  border-color: var(--accent);
  background: var(--card);
}

.search-ico {
  width: 13.5px;
  height: 13.5px;
  flex: none;
  fill: none;
  stroke: var(--muted);
  stroke-width: 2.2;
}

.search-input {
  flex: 1;
  min-width: 0;
  font-size: 12px;
  color: var(--text);
  outline: none;
  cursor: text;
}

.search-input::placeholder {
  color: var(--faint);
}

.search-clear {
  font-size: 11px;
  color: var(--muted);
  padding: 2px 5px;
  border-radius: 6px;
}

.search-clear:hover {
  background: var(--hover);
  color: var(--text);
}

.search-results {
  position: absolute;
  top: calc(100% + 5px);
  left: 0;
  right: 0;
  max-height: 290px;
  overflow-y: auto;
  border-radius: 14px;
  background: var(--glass-solid);
  backdrop-filter: blur(28px) saturate(190%);
  -webkit-backdrop-filter: blur(28px) saturate(190%);
  border: 1px solid var(--glass-border);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45);
  padding: 5px;
}

.search-results[hidden] {
  display: none !important;
}

/* Search game results reuse the same matchup hero card as the home feature. */
.search-results.has-search-game-results {
  max-height: min(72vh, 560px);
  padding: 8px;
}
.search-game-card-result {
  width: 100%;
  min-width: 0;
  min-height: 166px;
  margin: 5px 0 8px;
  padding: 14px 16px;
  gap: 10px;
  border-color: rgba(255,255,255,.13);
  background: radial-gradient(ellipse at 50% 5%, rgba(113,89,219,.17), transparent 58%), linear-gradient(130deg, rgba(37,42,54,.96), rgba(23,27,36,.96));
}
.search-game-card-result .featured-heading {
  min-height: 14px;
  font-size: 9px;
}
.search-game-card-result .featured-matchup {
  grid-template-columns: minmax(0,1fr) minmax(66px,100px) minmax(0,1fr);
  min-height: 72px;
  gap: 7px;
}
.search-game-card-result .featured-side {
  gap: 7px;
  flex-wrap: wrap;
}
.search-game-card-result .featured-logo {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
}
.search-game-card-result .featured-name {
  font-size: clamp(11px,1.1vw,14px);
}
.search-game-card-result .featured-record {
  font-size: 9px;
}
.search-game-card-result .featured-score {
  font-size: 22px;
}
.search-game-card-result .featured-status {
  white-space: nowrap;
}
.search-game-card-result .featured-actions {
  gap: 7px;
}
.search-game-card-result .featured-open,
.search-game-card-result .featured-watch {
  min-width: 96px;
  min-height: 28px;
  font-size: 9px;
}
.search-featured-event-info {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
}
.search-featured-event-name {
  color: #fff;
  font-size: 14px;
  text-align: center;
}
.search-featured-team-logo-frame {
  width: 48px;
  height: 48px;
}
@media (max-width: 520px) {
  .search-game-card-result {
    padding: 12px 10px;
  }
  .search-game-card-result .featured-matchup {
    grid-template-columns: minmax(0,1fr) 64px minmax(0,1fr);
    gap: 3px;
  }
  .search-game-card-result .featured-logo {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
  }
  .search-game-card-result .featured-side {
    gap: 4px;
  }
  .search-game-card-result .featured-name {
    font-size: 10px;
  }
  .search-game-card-result .featured-status {
    max-width: 64px;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 4px 5px;
    font-size: 8px;
  }
}


.search-item {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 6px 8px;
  border-radius: 10px;
  text-align: left;
  transition: background 0.14s ease;
}

.search-item:hover {
  background: var(--hover);
}

.search-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255, 255, 255, 0.08);
  flex: none;
}

.search-avatar-placeholder {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 9.5px;
  font-weight: 800;
  background: var(--card);
  color: var(--muted);
  flex: none;
}

.search-meta {
  flex: 1;
  min-width: 0;
}

.search-name {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.search-sub {
  font-size: 10.5px;
  color: var(--muted);
}

.search-badge {
  font-size: 10px;
  font-weight: 700;
  color: var(--accent);
  padding: 2px 6px;
  border-radius: 99px;
  background: rgba(10, 132, 255, 0.14);
}

.search-empty {
  padding: 14px 10px;
  text-align: center;
  font-size: 12px;
  color: var(--muted);
}


/* Search now covers both players and games. */
.search-section-title {
  padding: 7px 8px 4px;
  color: var(--faint);
  font-size: 8.5px;
  font-weight: 850;
  letter-spacing: .09em;
}

.search-game-logos {
  width: 36px;
  flex: 0 0 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  min-height: 32px;
}

.search-game-logo {
  width: 26px;
  height: 26px;
  object-fit: contain;
  border-radius: 50%;
  background: rgba(255,255,255,.04);
}

.search-game-logo + .search-game-logo {
  margin-left: -7px;
}

.search-game-meta {
  min-width: 0;
}

.search-game-matchup {
  display: flex;
  align-items: center;
  gap: 2px;
  min-width: 0;
  color: var(--text);
  font-size: 12.5px;
  font-weight: 750;
  white-space: nowrap;
}

.search-game-matchup > span:first-child,
.search-game-matchup > span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
}

.search-game-divider {
  color: var(--faint);
  flex: none;
}

.search-live-badge {
  color: var(--green);
  background: color-mix(in srgb, var(--green) 14%, transparent);
}

/* Leader cards: keep the player's full name readable and put the
   headshot beside the stat instead of squeezing everything into one line. */
.card-leaders.team-leader-layout .card-leader-stats {
  grid-template-columns: 1fr;
  gap: 5px;
}

.card-leaders.team-leader-layout .leader-chip {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 1px 0;
}

.card-leaders.team-leader-layout .leader-headshot {
  width: 28px;
  height: 28px;
  flex: none;
}

.card-leaders.team-leader-layout .leader-copy {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 5px;
}

.card-leaders.team-leader-layout .leader-name {
  min-width: 0;
  max-width: none;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  line-height: 1.15;
}

.card-leaders.team-leader-layout .leader-number {
  justify-self: end;
}

.card-leaders .football-leader-chip {
  min-width: 0;
  max-width: 100%;
}

.card-leaders .football-leader-chip .leader-name {
  min-width: 0;
  max-width: 160px;
  overflow: visible;
  white-space: normal;
  line-height: 1.15;
}

@media (min-width: 1500px) {
  .list {
    gap: 10px;
  }

  .card {
    padding: 11px 14px 10px;
  }

  .team {
    height: 34px;
    grid-template-columns: 22px 28px auto minmax(0, 1fr) auto;
  }

  .logo { width: 28px; height: 28px; }
  .abbr { font-size: 16px; }
  .score { font-size: 22px; }
  .leader-name { font-size: 10.5px; }
}



/* ------------------------------------------------------------------ */
/* 3-Tab Detail Drawer & Interactive SVG Shot Chart                    */
/* ------------------------------------------------------------------ */
.detail-tabs {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 5px;
  padding: 6px 12px 4px;
}

#statsDrawer[data-view="box"] .pane-shots,
#statsDrawer[data-view="box"] .pane-pbp { display: none; }

#statsDrawer[data-view="shots"] .pane-box,
#statsDrawer[data-view="shots"] .pane-pbp { display: none; }

#statsDrawer[data-view="pbp"] .pane-box,
#statsDrawer[data-view="pbp"] .pane-shots { display: none; }

.shot-summary-strip {
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: 8px;
  margin-bottom: 8px;
}

.shot-stat-pill {
  flex: 1;
  text-align: center;
  padding: 5px 8px;
  border-radius: 10px;
  font-size: 11.5px;
  font-weight: 700;
  background: var(--card);
  border: 1px solid var(--card-border);
}

.shot-court-svg {
  width: 100%;
  max-height: 290px;
  display: block;
  margin: 0 auto;
  border-radius: 12px;
}

.shot-marker {
  cursor: pointer;
  transition: transform 0.12s ease;
}

.shot-marker:hover {
  filter: drop-shadow(0 0 5px #fff);
}

.shot-legend {
  display: flex;
  justify-content: center;
  gap: 18px;
  margin-top: 6px;
  font-size: 11px;
  font-weight: 700;
}

.legend-made { color: var(--green); }
.legend-miss { color: var(--red); }

.shot-hover-info {
  margin-top: 6px;
  padding: 6px 10px;
  border-radius: 9px;
  background: var(--card);
  border: 1px solid var(--card-border);
  font-size: 11px;
  color: var(--muted);
  text-align: center;
  min-height: 28px;
}


/* Compact shot detail card: shooter portrait, result and play description. */
.shot-detail-card {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  grid-template-areas:
    "portrait copy result"
    "portrait description description";
  align-items: center;
  gap: 3px 9px;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  margin: 7px 0;
  padding: 7px 9px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(255,255,255,.065), rgba(255,255,255,.025));
}

.shot-detail-card.has-player { cursor: pointer; }
.shot-detail-card.has-player:active { transform: scale(.995); }
.shot-detail-portrait {
  grid-area: portrait;
  position: relative;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  overflow: hidden;
  display: grid;
  place-items: center;
  background: var(--card);
  border: 1px solid var(--card-border);
}
.shot-detail-headshot {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
.shot-detail-initials {
  font-size: 12px;
  font-weight: 900;
  color: var(--text);
}
.shot-detail-copy { grid-area: copy; min-width: 0; }
.shot-detail-player {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11.5px;
  line-height: 1.2;
  font-weight: 850;
  color: var(--text);
}
.shot-detail-meta {
  margin-top: 2px;
  font-size: 9px;
  line-height: 1.2;
  color: var(--muted);
}
.shot-detail-result {
  grid-area: result;
  justify-self: end;
  white-space: nowrap;
  border-radius: 6px;
  padding: 4px 6px;
  font-size: 9px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .25px;
}
.shot-detail-result.made {
  color: #30d158;
  background: rgba(48,209,88,.12);
  border: 1px solid rgba(48,209,88,.25);
}
.shot-detail-result.miss {
  color: #ff6b65;
  background: rgba(255,69,58,.12);
  border: 1px solid rgba(255,69,58,.25);
}
.shot-detail-description {
  grid-area: description;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.25;
}
.shot-detail-empty {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 10px;
}
@media (max-width: 420px) {
  .shot-detail-card { grid-template-columns: 34px minmax(0, 1fr) auto; gap: 3px 7px; padding: 6px 7px; }
  .shot-detail-portrait { width: 34px; height: 34px; }
  .shot-detail-player { font-size: 10.5px; }
  .shot-detail-description { font-size: 8.5px; }
  .shot-detail-result { font-size: 8px; padding: 4px 5px; }
}

.player-bio-draft {
  font-size: 10.5px;
  color: var(--gold);
  margin-top: 3px;
  font-weight: 600;
}

.career-total-row td {
  font-weight: 800 !important;
  color: var(--gold) !important;
  border-top: 1.5px solid var(--glass-border);
}

.on-court-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--green);
  margin-right: 5px;
  vertical-align: middle;
}

/* ------------------------------------------------------------------ */
/* Qualifying Player League Rank Cards & Inline Rank Pills             */
/* ------------------------------------------------------------------ */
.rank-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin-bottom: 12px;
}

.rank-stat-card {
  padding: 7px 9px;
  border-radius: 11px;
  background: var(--card);
  border: 1px solid var(--card-border);
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.rank-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
}

.rank-cat-abbr {
  font-size: 10px;
  font-weight: 800;
  color: var(--muted);
  letter-spacing: 0.04em;
}

.rank-card-val {
  font-size: 16px;
  font-weight: 800;
  color: var(--text);
  font-variant-numeric: tabular-nums;
  line-height: 1.15;
}

.rank-card-sub {
  font-size: 9.5px;
  color: var(--faint);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rank-badge,
.inline-rank-pill {
  display: inline-block;
  padding: 1px 5px;
  border-radius: 99px;
  font-size: 9.5px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
}

.inline-rank-pill {
  margin-top: 2px;
  font-size: 9px;
  padding: 0.5px 4.5px;
}

/* Top 10 in League -> Gold */
.tier-elite {
  background: rgba(255, 214, 10, 0.22);
  color: var(--gold);
  border: 1px solid rgba(255, 214, 10, 0.45);
}

/* Top 30 in League -> Green */
.tier-star {
  background: rgba(48, 209, 88, 0.2);
  color: var(--green);
  border: 1px solid rgba(48, 209, 88, 0.4);
}

/* Top 75 in League -> Accent Blue */
.tier-starter {
  background: rgba(10, 132, 255, 0.2);
  color: #5eb0ff;
  border: 1px solid rgba(10, 132, 255, 0.4);
}

/* Other Qualifying Ranks -> Muted Glass */
.tier-qual {
  background: rgba(255, 255, 255, 0.08);
  color: var(--muted);
  border: 1px solid var(--card-border);
}

/* ------------------------------------------------------------------ */
/* Friendlier, Larger Player Stats Typography & Sub-Tabs               */
/* ------------------------------------------------------------------ */
.player-bio-card {
  padding: 13px 14px !important;
  gap: 14px !important;
  margin-bottom: 10px !important;
}

.player-headshot {
  width: 62px !important;
  height: 62px !important;
  border: 2px solid var(--glass-border);
}

.player-bio-name {
  font-size: 17.5px !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em;
}

.player-bio-sub {
  font-size: 12.5px !important;
  color: var(--muted) !important;
  margin-top: 3px !important;
}

.player-bio-draft {
  font-size: 12px !important;
  margin-top: 4px !important;
}

.player-subtabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin-bottom: 12px;
  padding: 3px;
  border-radius: 12px;
  background: var(--pill-track);
  border: 1px solid var(--card-border);
}

.player-subtab-btn {
  padding: 7px 6px;
  border-radius: 9px;
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
  transition: all 0.15s ease;
  text-align: center;
}

.player-subtab-btn:hover {
  color: var(--text);
}

.player-subtab-btn.active {
  background: var(--pill-thumb);
  color: var(--text);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}

.friendly-title {
  font-size: 12.5px !important;
  margin: 12px 0 7px !important;
  color: var(--text) !important;
  opacity: 0.9;
}

.rank-cards-grid {
  gap: 8px !important;
  margin-bottom: 14px !important;
}

.rank-stat-card {
  padding: 9px 11px !important;
  border-radius: 13px !important;
  gap: 3px !important;
}

.rank-cat-abbr {
  font-size: 11.5px !important;
}

.rank-card-val {
  font-size: 19px !important;
  margin: 1px 0;
}

.rank-card-sub {
  font-size: 11px !important;
}

.rank-badge {
  font-size: 11px !important;
  padding: 2px 7px !important;
}

.inline-rank-pill {
  font-size: 10.5px !important;
  padding: 1px 6px !important;
  margin-top: 3px !important;
}

/* Larger, more readable Box Score & Player Tables */
.stat-table,
.friendly-table {
  font-size: 13px !important;
}

.stat-table th,
.friendly-table th {
  font-size: 11.5px !important;
  padding: 8px 10px !important;
  color: var(--muted) !important;
  background: rgba(255, 255, 255, 0.04);
}

.stat-table td,
.friendly-table td {
  padding: 8px 10px !important;
}

.friendly-table tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.03);
}

.cell-main-val {
  font-weight: 600;
}

.gamelog-date {
  color: var(--muted);
  font-size: 11.5px;
  margin-right: 4px;
}

.gamelog-opp {
  color: var(--text);
  font-weight: 700;
}

.wl-badge {
  display: inline-block;
  width: 18px;
  height: 18px;
  line-height: 18px;
  text-align: center;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 800;
}

.wl-badge.win {
  background: rgba(48, 209, 88, 0.22);
  color: var(--green);
}

.wl-badge.loss {
  background: rgba(255, 69, 58, 0.22);
  color: var(--red);
}

.friendly-news {
  font-size: 13px !important;
  line-height: 1.45 !important;
}

.search-wrap[hidden] { display: none !important; }

.mvp-row {
  background: rgba(255, 214, 10, 0.12) !important;
  border-left: 3.5px solid var(--gold) !important;
}

.mvp-badge {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 5px;
  border-radius: 99px;
  font-size: 9px;
  font-weight: 800;
  background: rgba(255, 214, 10, 0.25);
  color: var(--gold);
  border: 1px solid rgba(255, 214, 10, 0.5);
  vertical-align: middle;
}

/* ------------------------------------------------
   SMALL SCREENS
   ------------------------------------------------ */




/* ================================================================
   GLASS SCORES — FINAL FULLSCREEN HOME SCREEN
   ================================================================ */

/*
   The fullscreen window is a complete dashboard.
   Header stays fixed at the top.
   Search/date/navigation stay visible.
   Game cards consume the remaining viewport.
*/

html,
body {
  width: 100%;
  min-width: 0;
}

/* ------------------------------------------------
   DESKTOP / LARGE MONITORS
   ------------------------------------------------ */





/* ------------------------------------------------
   SMALLER SCREENS
   ------------------------------------------------ */



/* ------------------------------------------------
   VERY WIDE FULLSCREEN — DON'T LET CONTENT FLOAT
   ------------------------------------------------ */




/* ================================================================
   GLASS SCORES — FINAL FULLSCREEN HOME SCREEN
   ================================================================ */

/*
   The fullscreen window is a complete dashboard.
   Header stays fixed at the top.
   Search/date/navigation stay visible.
   Game cards consume the remaining viewport.
*/

html,
body {
  width: 100%;
  min-width: 0;
}

/* ------------------------------------------------
   DESKTOP / LARGE MONITORS
   ------------------------------------------------ */





/* ------------------------------------------------
   SMALLER SCREENS
   ------------------------------------------------ */



/* ------------------------------------------------
   VERY WIDE FULLSCREEN — DON'T LET CONTENT FLOAT
   ------------------------------------------------ */



#fsSettings {
  color: var(--muted);
}

#fsSettings:hover {
  color: var(--text);
}

.window-btn {
  width: 38px;
  height: 34px;

  display: grid;
  place-items: center;

  border-radius: 8px;

  color: var(--muted);

  background: transparent;

  transition:
    background .15s ease,
    color .15s ease;
}

.window-btn:hover {
  background: var(--hover);
  color: var(--text);
}

.window-btn.close-btn:hover {
  background: rgba(255,69,58,0.85);
  color: #fff;
}

.window-btn svg {
  width: 16px;
  height: 16px;

  fill: none;

  stroke: currentColor;
  stroke-width: 1.8;

  stroke-linecap: round;
  stroke-linejoin: round;
}

/* The native Electron window animates its bounds; these transitions keep the
   glass surface and chrome feeling continuous while the bounds move. */
.shell {
  transition: border-radius 220ms ease, box-shadow 220ms ease, background-color 220ms ease;
}


/* Small screens */



/*
 * Back arrow in the normal game drawer.
 */

#statsDrawer .overlay-header {
  position: relative !important;
  z-index: 50 !important;
}

#statsDrawer #closeStatsBtn {
  position: relative !important;

  z-index: 100 !important;

  pointer-events: auto !important;

  cursor: pointer !important;

  -webkit-app-region: no-drag !important;
}


/*
 * Keep the drawer interactive when it is open normally.
 */

#statsDrawer {
  pointer-events: auto !important;
}

#statsDrawer button {
  pointer-events: auto !important;
}


/*
 * Normal PBP tab.
 *
 * Keep the three tabs visible when NOT fullscreen.
 */

body:not(.fullscreen) #statsDrawer .detail-tabs {
  display: grid !important;

  grid-template-columns:
    repeat(3, 1fr)
    !important;
}


/*
 * Normal PBP pane.
 */

body:not(.fullscreen) #statsDrawer[data-view="pbp"] .pane-box,
body:not(.fullscreen) #statsDrawer[data-view="pbp"] .pane-shots {
  display: none !important;
}

body:not(.fullscreen) #statsDrawer[data-view="pbp"] .pane-pbp {
  display: flex !important;

  flex: 1 1 auto !important;

  min-height: 0 !important;
}


/*
 * PBP scrolling.
 */

body:not(.fullscreen) #pbpBody {
  flex: 1 1 auto !important;

  min-height: 0 !important;

  overflow-y: auto !important;

  overflow-x: hidden !important;
}


/*
 * Make the PBP rows easier to read.
 */

body:not(.fullscreen) #pbpBody .pbp-row {
  display: block !important;

  width: 100% !important;

  box-sizing: border-box !important;
}


/*
 * Large monitors.
 */




/*
 * Smaller screens.
 */




/*
 * Back arrow in the normal game drawer.
 */

#statsDrawer .overlay-header {
  position: relative !important;
  z-index: 50 !important;
}

#statsDrawer #closeStatsBtn {
  position: relative !important;

  z-index: 100 !important;

  pointer-events: auto !important;

  cursor: pointer !important;

  -webkit-app-region: no-drag !important;
}


/*
 * Keep the drawer interactive when it is open normally.
 */

#statsDrawer {
  pointer-events: auto !important;
}

#statsDrawer button {
  pointer-events: auto !important;
}


/*
 * Normal PBP tab.
 *
 * Keep the three tabs visible when NOT fullscreen.
 */

body:not(.fullscreen) #statsDrawer .detail-tabs {
  display: grid !important;

  grid-template-columns:
    repeat(3, 1fr)
    !important;
}


/*
 * Normal PBP pane.
 */

body:not(.fullscreen) #statsDrawer[data-view="pbp"] .pane-box,
body:not(.fullscreen) #statsDrawer[data-view="pbp"] .pane-shots {
  display: none !important;
}

body:not(.fullscreen) #statsDrawer[data-view="pbp"] .pane-pbp {
  display: flex !important;

  flex: 1 1 auto !important;

  min-height: 0 !important;
}


/*
 * PBP scrolling.
 */

body:not(.fullscreen) #pbpBody {
  flex: 1 1 auto !important;

  min-height: 0 !important;

  overflow-y: auto !important;

  overflow-x: hidden !important;
}


/*
 * Make the PBP rows easier to read.
 */

body:not(.fullscreen) #pbpBody .pbp-row {
  display: block !important;

  width: 100% !important;

  box-sizing: border-box !important;
}


/*
 * Large monitors.
 */




/*
 * Smaller screens.
 */



/* ============================================================
   SHOT MOTION
   ============================================================ */

.shot-animation-ball {
  filter: drop-shadow(0 2px 5px rgba(0,0,0,0.45));
  pointer-events: none;
}

.shot-animation-name {
  fill: var(--text);
  font-size: 13px;
  font-weight: 800;
  paint-order: stroke;
  stroke: rgba(0,0,0,0.75);
  stroke-width: 4px;
  stroke-linejoin: round;
  pointer-events: none;
}

.shot-marker.shot-newest {
  animation: shotNewestPulse 900ms ease-out;
  transform-box: fill-box;
  transform-origin: center;
}

@keyframes shotNewestPulse {
  0% {
    opacity: 1;
    transform: scale(1);
  }

  35% {
    opacity: 1;
    transform: scale(1.8);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .shot-marker.shot-newest {
    animation: none !important;
  }
}

/* Large fullscreen displays */


/* Smaller windows */



/* Ensure shot markers receive hover events */
.shot-marker {
  cursor: pointer;
  pointer-events: all;
}

.shot-animation-ball,
.shot-animation-name {
  pointer-events: none;
}

.shot-animation-name {
  fill: #ffffff;
  font-size: 13px;
  font-weight: 700;
  paint-order: stroke;
  stroke: rgba(0,0,0,0.85);
  stroke-width: 3px;
}

/* ------------------------------------------------------------------ */
/* Watch Live: embedded HLS player                                     */
/* ------------------------------------------------------------------ */
#statsDrawer .detail-tabs {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

#statsDrawer .detail-tab {
  min-width: 0;
  padding-left: 5px;
  padding-right: 5px;
  white-space: nowrap;
  font-size: 11px;
}

#statsDrawer .pane-watch {
  display: none !important;
  min-height: 0;
  flex-direction: column;
  overflow: hidden;
}

#statsDrawer[data-view="watch"] .pane-box,
#statsDrawer[data-view="watch"] .pane-shots,
#statsDrawer[data-view="watch"] .pane-pbp {
  display: none !important;
}

#statsDrawer[data-view="watch"] .pane-watch {
  display: flex !important;
}

.watch-stage {
  position: relative;
  display: flex;
  flex: 1 1 auto;
  min-height: 0;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #050608;
  border: 1px solid var(--card-border);
  border-radius: 14px;
}

.watch-stage video {
  display: none !important;
}

.watch-launcher {
  min-height: 260px;
  padding: 34px;
  flex-direction: column;
  text-align: center;
  gap: 10px;
  background: radial-gradient(circle at center, rgba(80,130,220,.10), transparent 58%), #050608;
}

.watch-launcher-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(120,180,255,.42);
  border-radius: 50%;
  background: rgba(42,117,215,.22);
  color: #f5f8ff;
  font: inherit;
  font-size: 21px;
  font-weight: 800;
  padding: 0 0 0 3px;
  cursor: pointer;
  pointer-events: auto;
  box-shadow: 0 4px 18px rgba(0,0,0,.22);
  transition: transform .16s ease, background .16s ease, border-color .16s ease, opacity .16s ease;
}
.watch-launcher-icon:hover:not(:disabled) {
  transform: scale(1.06);
  background: rgba(42,117,215,.42);
  border-color: rgba(140,195,255,.78);
}
.watch-launcher-icon:active:not(:disabled) { transform: scale(.97); }
.watch-launcher-icon:disabled {
  opacity: .42;
  cursor: default;
}
.watch-launcher-icon:focus-visible {
  outline: 2px solid rgba(140,195,255,.95);
  outline-offset: 4px;
}

.watch-launcher-title {
  color: var(--text);
  font-size: 15px;
  font-weight: 800;
}

.watch-launcher .watch-status {
  position: static;
  max-width: 620px;
  margin: 0;
  background: transparent;
  border: 0;
  padding: 0;
  color: var(--muted);
}

.watch-status {
  position: absolute;
  left: 12px;
  right: 12px;
  top: 12px;
  max-height: 45%;
  overflow: auto;
  padding: 9px 11px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 10px;
  background: rgba(8,10,14,.82);
  color: #fff;
  font-size: 12px;
  line-height: 1.45;
  white-space: pre-wrap;
  user-select: text;
  -webkit-user-select: text;
  pointer-events: none;
}

.watch-meta {
  flex: 0 0 auto;
  min-height: 30px;
  padding: 7px 3px 2px;
  color: var(--muted);
  font-size: 11px;
}


/* Watch Live source picker */
.watch-source-row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 12px 2px;
  box-sizing: border-box;
}
.watch-source-row label {
  flex: 0 0 auto;
  color: var(--muted, #9ca3af);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.watch-source-row .watch-source-select,
.watch-source-row select {
  min-width: 0;
  flex: 1 1 auto;
}
.watch-source-row select:disabled {
  opacity: .65;
  cursor: default;
}
.watch-resolution-label {
  flex: 0 0 auto;
  color: var(--muted, #9ca3af);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}
.watch-resolution-badge {
  flex: 0 0 auto;
  min-width: 54px;
  padding: 5px 8px;
  border: 1px solid rgba(120,180,255,.28);
  border-radius: 7px;
  background: rgba(42,117,215,.12);
  color: #f5f8ff;
  font-size: 10px;
  font-weight: 800;
  text-align: center;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}


/* ---------------------------------------------------------------
   Team-specific top scorers and rebounders on basketball game cards
   --------------------------------------------------------------- */
.card-leaders.team-leader-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
  gap: 6px 14px;
}

.card-leader-side {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  min-width: 0;
}

.card-leader-side.home {
  align-items: flex-end;
  text-align: right;
}

.card-leader-heading {
  color: var(--faint);
  font-size: 8.5px;
  font-weight: 800;
  letter-spacing: .07em;
}

.card-leader-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 9px;
  min-width: 0;
}

.card-leader-side.home .card-leader-stats {
  justify-content: flex-end;
}

.card-leaders.team-leader-layout .leader-chip {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
  font-size: 10px;
}

.card-leaders.team-leader-layout .leader-label {
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .03em;
}

.card-leaders.team-leader-layout .leader-name {
  max-width: 104px;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--text);
}

.card-leaders.team-leader-layout .leader-number {
  color: var(--text);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 520px) {
  .card-leaders.team-leader-layout {
    gap: 5px 7px;
  }

  .card-leaders.team-leader-layout .leader-chip {
    gap: 3px;
    font-size: 9px;
  }

  .card-leaders.team-leader-layout .leader-name {
    max-width: 72px;
  }
}

/* ================================================================
   DESKTOP PLAYER PRESENTATION
   ================================================================ */
.card-leaders.team-leader-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
}

.card-leader-side {
  min-width: 0;
  padding: 7px 9px;
  border: 1px solid var(--card-border);
  border-radius: 11px;
  background: rgba(255,255,255,0.025);
}

.card-leader-heading {
  display: block;
  margin-bottom: 5px;
  color: var(--faint);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.card-leader-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

.leader-chip {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 2px 0;
}

.leader-headshot {
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255,255,255,.08);
}

.leader-copy {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 4px;
}

.leader-label {
  color: var(--accent);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .04em;
}

.leader-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text);
  font-size: 10px;
  font-weight: 700;
}

.leader-number {
  color: var(--text);
  font-size: 11px;
  font-weight: 850;
  font-variant-numeric: tabular-nums;
}

.roster-player-cell {
  display: flex !important;
  align-items: center;
  gap: 10px;
  min-width: 260px;
}

.roster-headshot {
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.08);
}

.roster-headshot-placeholder {
  display: inline-block;
}

.roster-player-identity {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.roster-player-name {
  color: var(--text);
  font-size: 14px;
  font-weight: 800;
  white-space: nowrap;
}

.roster-jersey {
  margin-left: 6px;
  color: var(--faint);
  font-size: 11px;
  font-weight: 600;
}

.roster-player-meta {
  color: var(--muted);
  font-size: 10px;
  white-space: nowrap;
}

.roster-detail {
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
}





/* Readability on very large fullscreen displays. */




/* Final leader/search layout overrides */
.card-leaders.team-leader-layout .leader-chip {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 1px 0;
}

.card-leaders.team-leader-layout .leader-headshot {
  width: 28px;
  height: 28px;
  flex: none;
}

.card-leaders.team-leader-layout .leader-copy {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 5px;
}

.card-leaders.team-leader-layout .leader-name {
  min-width: 0;
  max-width: none;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  line-height: 1.15;
}

.card-leaders.team-leader-layout .leader-number {
  justify-self: end;
}



/* ------------------------------------------------------------------ */
/* Full-name player presentation for desktop score cards + box score */
/* ------------------------------------------------------------------ */
.card-leaders.team-leader-layout .leader-chip {
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 8px;
  min-height: 34px;
}

.card-leaders.team-leader-layout .leader-headshot {
  width: 34px;
  height: 34px;
}

.card-leaders.team-leader-layout .leader-copy {
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "label value"
    "name value";
  align-items: center;
  gap: 1px 7px;
}

.card-leaders.team-leader-layout .leader-label { grid-area: label; }
.card-leaders.team-leader-layout .leader-name {
  grid-area: name;
  font-size: 11px;
  font-weight: 800;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: anywhere;
}
.card-leaders.team-leader-layout .leader-number {
  grid-area: value;
  align-self: center;
  white-space: nowrap;
}

.boxscore-player-cell {
  min-width: 250px;
  width: 34%;
  padding: 5px 10px !important;
  white-space: normal !important;
}

.boxscore-headshot {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  object-fit: cover;
  object-position: center top;
  background: rgba(255,255,255,.07);
  vertical-align: middle;
  margin-right: 9px;
  display: inline-block;
}

.boxscore-headshot-placeholder {
  border: 1px solid var(--card-border);
}

.boxscore-player-identity {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  vertical-align: middle;
  max-width: calc(100% - 50px);
  min-width: 0;
}

.boxscore-player-name {
  display: block;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.15;
  white-space: normal;
  overflow-wrap: anywhere;
}

.boxscore-jersey {
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
  margin-left: 5px;
}

.boxscore-player-meta {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 650;
  line-height: 1.1;
}

@media (min-width: 1500px) {
  .card-leaders.team-leader-layout .leader-name { font-size: 12px; }
  .boxscore-player-cell { min-width: 310px; }
  .boxscore-headshot { width: 38px; height: 38px; }
  .boxscore-player-name { font-size: 14px; }
  .boxscore-player-meta { font-size: 10px; }
}

@media (min-width: 1800px) {
  .card-leaders.team-leader-layout .leader-chip { min-height: 40px; }
  .card-leaders.team-leader-layout .leader-headshot { width: 40px; height: 40px; }
  .boxscore-player-cell { min-width: 360px; }
  .boxscore-headshot { width: 42px; height: 42px; }
  .boxscore-player-name { font-size: 15px; }
  .boxscore-player-meta { font-size: 10.5px; }
}

@media (min-width: 2200px) {
  .boxscore-player-cell { min-width: 420px; }
  .boxscore-player-name { font-size: 16px; }
  .boxscore-headshot { width: 46px; height: 46px; }
}


/* FIX: horizontal, non-wrapping team leader rows */
.card-leaders.team-leader-layout {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 8px !important;
  width: 100%;
  min-width: 0;
}

.card-leaders.team-leader-layout .card-leader-side,
.card-leaders.team-leader-layout .card-leader-side.home {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  min-width: 0 !important;
  width: 100%;
  box-sizing: border-box;
  text-align: left !important;
}

.card-leaders.team-leader-layout .card-leader-side.home .card-leader-heading {
  align-self: flex-end;
  text-align: right;
}

.card-leaders.team-leader-layout .card-leader-stats,
.card-leaders.team-leader-layout .card-leader-side.home .card-leader-stats {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  justify-content: stretch !important;
  align-content: start;
  gap: 5px !important;
  width: 100%;
  min-width: 0;
}

.card-leaders.team-leader-layout .leader-chip {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box;
  white-space: nowrap !important;
  position: static !important;
}

.card-leaders.team-leader-layout .leader-headshot {
  display: block;
  width: 24px !important;
  height: 24px !important;
  flex: 0 0 24px !important;
  margin: 0 !important;
  border-radius: 50%;
  object-fit: cover;
}

.card-leaders.team-leader-layout .leader-copy {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: row !important;
  align-items: baseline !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  position: static !important;
}

.card-leaders.team-leader-layout .leader-label {
  display: inline-block;
  flex: 0 0 auto !important;
  white-space: nowrap !important;
  font-size: 8px;
  line-height: 1.2;
}

.card-leaders.team-leader-layout .leader-name {
  display: block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  line-height: 1.2;
  position: static !important;
}

.card-leaders.team-leader-layout .leader-number {
  display: block;
  flex: 0 0 auto !important;
  flex-shrink: 0 !important;
  margin-left: auto !important;
  padding-left: 2px;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums;
  font-weight: 800 !important;
  text-align: right;
  position: static !important;
  inset: auto !important;
  transform: none !important;
}

@media (max-width: 520px) {
  .card-leaders.team-leader-layout { gap: 6px !important; }
  .card-leaders.team-leader-layout .card-leader-side { padding: 6px !important; }
  .card-leaders.team-leader-layout .leader-chip { gap: 4px !important; }
  .card-leaders.team-leader-layout .leader-headshot {
    width: 20px !important;
    height: 20px !important;
    flex-basis: 20px !important;
  }
  .card-leaders.team-leader-layout .leader-copy { gap: 3px !important; }
  .card-leaders.team-leader-layout .leader-label { font-size: 7px; }
  .card-leaders.team-leader-layout .leader-name { font-size: 9px; }
  .card-leaders.team-leader-layout .leader-number { font-size: 9px; }
}

@media (min-width: 1200px) {
  .card-leaders.team-leader-layout .leader-headshot {
    width: 28px !important;
    height: 28px !important;
    flex-basis: 28px !important;
  }
  .card-leaders.team-leader-layout .leader-name { font-size: 12px; }
  .card-leaders.team-leader-layout .leader-number { font-size: 12px; }
}


/* Header spacing and alignment cleanup. */
.header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  padding: 10px 16px 8px;
  box-sizing: border-box;
}

.header .title {
  flex: 1 1 auto;
  min-width: 0;
  line-height: 1.2;
}

.header .actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
}

.overlay-header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 50px;
  padding: 9px 14px;
  box-sizing: border-box;
  overflow: visible;
}

.overlay-header .back-btn {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  min-height: 34px;
  white-space: nowrap;
}

.overlay-header-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin-left: auto;
}

.overlay-header-actions .icon-btn {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
}

/* There is deliberately no repeated matchup title in the drawer toolbar;
   the central score hero already identifies both teams. */
#statsDrawer .overlay-header .overlay-title {
  display: none;
}

@media (max-width: 420px) {
  .header {
    gap: 8px;
    padding: 8px 12px 6px;
  }

  .overlay-header {
    gap: 8px;
    padding: 8px 10px;
  }

  .overlay-header-actions {
    gap: 4px;
  }
}


/* Startup safety: keep the live scores dashboard visible when no drawer is open. */
#statsDrawer[hidden],
#settingsDrawer[hidden],
#playerModal[hidden] {
  display: none !important;
}
body:not(.game-detail-open) #list {
  visibility: visible;
}


/* Inline Games pill beside the Team badge on each team search result. */
.search-team-result {
  width: 100%;
  margin: 2px 0;
  border-radius: 10px;
  overflow: hidden;
}
.search-team-row {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  border-radius: 10px;
}
.search-team-main {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  background: transparent;
  border: 0;
  padding: 6px 8px;
  border-radius: 9px;
}
.search-team-main:hover {
  background: var(--hover);
}
.search-team-games-toggle {
  flex: 0 0 auto;
  margin: 0 7px 0 0;
  padding: 3px 8px;
  border: 0;
  border-radius: 99px;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 14%, transparent);
  font: inherit;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
  cursor: pointer;
  white-space: nowrap;
}
.search-team-games-toggle:hover,
.search-team-games-toggle[aria-expanded="true"] {
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 23%, transparent);
}
.search-team-games-panel {
  margin: 2px 6px 7px 42px;
  padding: 6px 0 2px;
  border-top: 1px solid var(--glass-border);
}
.search-team-games-panel[hidden] {
  display: none !important;
}
/* Compact styling for game cards rendered inside team-search dropdowns.
   The dashboard's responsive featured-game rules use !important, so scope
   this override to the search panel and explicitly reset those dimensions. */
#searchResults .search-team-games-heading {
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;
  margin: 4px 0 5px !important;
  padding: 3px 8px !important;
  border: 0 !important;
  border-radius: 99px !important;
  color: var(--accent) !important;
  background: color-mix(in srgb, var(--accent) 14%, transparent) !important;
  font-size: 9px !important;
  font-weight: 750 !important;
  letter-spacing: .02em !important;
  line-height: 1.35 !important;
}
#searchResults .search-team-games-panel .search-game-card-result {
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  flex: 0 0 auto !important;
  margin: 3px 0 5px !important;
  padding: 6px 8px !important;
  gap: 4px !important;
  border-radius: 9px !important;
}
#searchResults .search-team-games-panel .search-game-card-result > * {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
#searchResults .search-team-games-panel .search-game-card-result .featured-heading {
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 7.5px !important;
  line-height: 1.1 !important;
  letter-spacing: .07em !important;
  gap: 4px !important;
}
#searchResults .search-team-games-panel .search-game-card-result .featured-live-dot {
  width: 6px !important;
  height: 6px !important;
  flex: 0 0 6px !important;
}
#searchResults .search-team-games-panel .search-game-card-result .featured-matchup {
  grid-template-columns: minmax(0,1fr) minmax(48px,62px) minmax(0,1fr) !important;
  min-height: 34px !important;
  height: auto !important;
  gap: 3px !important;
}
#searchResults .search-team-games-panel .search-game-card-result .featured-side {
  gap: 3px !important;
  flex-wrap: nowrap !important;
}
#searchResults .search-team-games-panel .search-game-card-result .featured-logo {
  width: 25px !important;
  height: 25px !important;
  flex: 0 0 25px !important;
}
#searchResults .search-team-games-panel .search-game-card-result .featured-name {
  min-width: 0 !important;
  font-size: 9px !important;
  line-height: 1.1 !important;
  font-weight: 750 !important;
}
#searchResults .search-team-games-panel .search-game-card-result .featured-record {
  font-size: 7px !important;
}
#searchResults .search-team-games-panel .search-game-card-result .featured-score {
  font-size: 15px !important;
  line-height: 1 !important;
}
#searchResults .search-team-games-panel .search-game-card-result .featured-versus {
  font-size: 8px !important;
}
#searchResults .search-team-games-panel .search-game-card-result .featured-status {
  max-width: 62px !important;
  padding: 2px 4px !important;
  font-size: 7px !important;
  line-height: 1.1 !important;
}
#searchResults .search-team-games-panel .search-game-card-result .featured-actions {
  gap: 4px !important;
  margin: 0 !important;
}
#searchResults .search-team-games-panel .search-game-card-result .featured-open,
#searchResults .search-team-games-panel .search-game-card-result .featured-watch {
  min-width: 66px !important;
  min-height: 21px !important;
  height: 21px !important;
  padding: 0 7px !important;
  font-size: 7px !important;
  line-height: 21px !important;
  border-radius: 6px !important;
}
@media (max-width: 520px) {
  .search-team-games-panel {
    margin-left: 8px;
  }
}

/* Team-first search results and drill-down schedule view */
.search-team-logo,
.search-team-header-logo {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  object-fit: contain;
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.045);
  padding: 3px;
  box-sizing: border-box;
}

.search-team-badge {
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 14%, transparent);
}

.search-team-toolbar {
  display: flex;
  align-items: center;
  padding: 3px 4px 7px;
}

.search-team-back {
  border: 1px solid var(--glass-border);
  background: rgba(255, 255, 255, 0.045);
  color: var(--muted);
  border-radius: 8px;
  font: inherit;
  font-size: 10px;
  font-weight: 700;
  padding: 5px 8px;
  cursor: pointer;
}

.search-team-back:hover {
  background: var(--hover);
  color: var(--text);
}

.search-team-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 8px 11px;
  margin-bottom: 3px;
  border-bottom: 1px solid var(--glass-border);
}

.search-team-header-logo {
  width: 42px;
  height: 42px;
  flex-basis: 42px;
}

.search-team-header-name {
  color: var(--text);
  font-size: 13px;
  font-weight: 850;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.search-results {
  overscroll-behavior: contain;
  scrollbar-width: thin;
}


/* Reliable team-logo frames: cycle through ESPN URL variants, then show an abbreviation fallback. */
.team-logo-frame {
  position: relative;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  overflow: hidden;
  vertical-align: middle;
}
.team-logo-frame > img {
  display: block;
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  object-fit: contain;
  min-width: 0;
  min-height: 0;
}
.team-logo-fallback {
  grid-area: 1 / 1;
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(145deg, rgba(91, 121, 170, .9), rgba(39, 52, 78, .95));
  border: 1px solid rgba(255,255,255,.18);
  font-size: 9px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -.03em;
  text-align: center;
}
.team-logo-fallback[hidden] { display: none !important; }
.card-team-logo-frame { width: 24px; height: 24px; }
.hero-team-logo-frame { width: 28px; height: 28px; }
.search-team-logo-frame { width: 34px; height: 34px; border-radius: 9px; background: rgba(255,255,255,.045); padding: 3px; box-sizing: border-box; }
.search-team-header-logo-frame { width: 42px; height: 42px; border-radius: 9px; background: rgba(255,255,255,.045); padding: 3px; box-sizing: border-box; }
.search-game-logo-frame { width: 24px; height: 24px; }
.search-game-logo-frame .team-logo-fallback { font-size: 7px; }
.search-team-logo-frame .team-logo-fallback,
.search-team-header-logo-frame .team-logo-fallback { border-radius: 8px; }
@media (min-width: 1200px) {
  .card-team-logo-frame { width: 30px; height: 30px; }
  .hero-team-logo-frame { width: 36px; height: 36px; }
}

.search-game-logo-frame + .search-game-logo-frame { margin-left: -7px; }
.search-game-logo-frame > img { border-radius: 50%; background: rgba(255,255,255,.04); }



/* ------------------------------------------------------------------
   Compact 380–420px widget layout (application fullscreen removed)
   ------------------------------------------------------------------ */
#statsDrawer .detail-tabs {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
  padding: 6px 8px 5px !important;
  min-width: 0;
}
#statsDrawer .detail-tab {
  min-width: 0 !important;
  width: 100%;
  padding: 5px 2px !important;
  gap: 2px !important;
  font-size: 11px !important;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#statsDrawer .detail-tab .seg-dot { width: 5px; height: 5px; flex: 0 0 5px; }
#statsDrawer .detail-panes,
#statsDrawer .pane,
#statsDrawer .overlay-body { min-width: 0; }
#statsDrawer .stat-table-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
#statsDrawer .stat-table {
  width: max-content;
  min-width: 100%;
  table-layout: auto;
}
#statsDrawer .stat-table th:first-child,
#statsDrawer .stat-table td:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  background: var(--glass-solid);
}
/* The roster has exactly three columns, so fit it to the compact viewport. */
#statsDrawer .stat-table.roster-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}
#statsDrawer .roster-table th:nth-child(1),
#statsDrawer .roster-table td:nth-child(1) { width: 57%; }
#statsDrawer .roster-table th:nth-child(2),
#statsDrawer .roster-table td:nth-child(2) { width: 15%; }
#statsDrawer .roster-table th:nth-child(3),
#statsDrawer .roster-table td:nth-child(3) { width: 28%; }
#statsDrawer .roster-table th,
#statsDrawer .roster-table td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 5px 4px;
}
#statsDrawer .roster-player-cell {
  display: flex !important;
  align-items: center;
  gap: 5px;
  width: auto;
  min-width: 0 !important;
  max-width: 100%;
  overflow: hidden;
}
#statsDrawer .roster-headshot {
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
}
#statsDrawer .roster-player-identity { min-width: 0; flex: 1 1 auto; overflow: hidden; }
#statsDrawer .roster-player-name,
#statsDrawer .roster-player-meta,
#statsDrawer .roster-detail {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#statsDrawer .roster-player-name { font-size: 10px; line-height: 1.2; }
#statsDrawer .roster-player-meta { font-size: 8px; line-height: 1.2; }
#statsDrawer .roster-jersey { margin-left: 3px; font-size: 8px; }
#statsDrawer .roster-detail { font-size: 9px; }

/* Keep the scoreboard leader panels compact and readable. */
.card-leaders.team-leader-layout {
  gap: 5px !important;
  margin-top: 4px !important;
  padding-top: 4px !important;
}
.card-leaders.team-leader-layout .card-leader-side {
  min-width: 0;
  padding: 5px 6px !important;
  border-radius: 9px;
}
.card-leaders.team-leader-layout .card-leader-heading {
  margin-bottom: 3px !important;
  font-size: 8px !important;
  line-height: 1.1;
}
.card-leaders.team-leader-layout .card-leader-stats { gap: 2px !important; }
.card-leaders.team-leader-layout .leader-chip { gap: 4px !important; padding: 1px 0 !important; }
.card-leaders.team-leader-layout .leader-headshot {
  width: 21px !important; height: 21px !important; flex-basis: 21px !important;
}
.card-leaders.team-leader-layout .leader-copy { min-width: 0; gap: 3px !important; }
.card-leaders.team-leader-layout .leader-name { font-size: 9px !important; }
.card-leaders.team-leader-layout .leader-number { font-size: 10px !important; }

/* Favorite Teams: searchable all-league directory. */
.favorite-search-wrap {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  margin: 7px 0 6px;
  padding: 7px 9px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: var(--pill-track);
}
.favorite-search-wrap svg {
  width: 14px; height: 14px; flex: 0 0 14px;
  fill: none; stroke: var(--faint); stroke-width: 2; stroke-linecap: round;
}
.favorite-search-wrap input {
  flex: 1 1 auto; min-width: 0; width: 100%; outline: none;
  cursor: text; font-size: 11px; color: var(--text);
}
.favorite-search-wrap input::placeholder { color: var(--faint); }
.favorite-search-wrap button { flex: 0 0 18px; font-size: 15px; color: var(--muted); }
.favorite-search-wrap button[hidden] { display: none; }
.fav-league-filters { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 4px; margin-bottom: 6px; }
.fav-league-pill {
  min-width: 0; padding: 5px 2px; border-radius: 7px;
  background: var(--pill-track); border: 1px solid var(--card-border);
  color: var(--muted); font-size: 9px; font-weight: 800;
}
.fav-league-pill.active { background: var(--pill-thumb); color: var(--text); border-color: var(--glass-border); }
.favorite-directory-count { color: var(--faint); font-size: 9px; font-weight: 600; }
.team-chip-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 5px !important;
  max-height: 210px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  min-width: 0;
}
.team-picker-item {
  display: flex; align-items: center; gap: 5px; min-width: 0;
  padding: 5px 5px; border-radius: 8px;
  background: var(--pill-track); border: 1px solid var(--card-border);
  text-align: left; color: var(--muted);
}
.team-picker-item.active { background: var(--gold-soft); border-color: var(--gold-edge); color: var(--text); }
.team-picker-logo-frame { width: 22px; height: 22px; flex: 0 0 22px; }
.team-picker-logo { width: 22px; height: 22px; object-fit: contain; }
.team-picker-meta { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; gap: 1px; }
.team-picker-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 9px; font-weight: 750; }
.team-picker-sub { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 7px; color: var(--faint); }
.team-picker-star { flex: 0 0 auto; font-size: 11px; color: var(--gold); }
.favorite-team-empty { grid-column: 1 / -1; padding: 12px 4px; text-align: center; color: var(--faint); font-size: 10px; }

/* Two compact, horizontally scrollable rows for Live filters. */
.live-filters {
  flex: 0 0 auto; display: flex; flex-direction: column; gap: 4px;
  padding: 0 10px 6px; min-width: 0; overflow: hidden;
}
.live-filters[hidden] { display: none !important; }
.live-filter-line { display: flex; align-items: center; gap: 5px; min-width: 0; overflow: hidden; }
.live-filter-label { flex: 0 0 32px; color: var(--faint); font-size: 7px; font-weight: 850; letter-spacing: .06em; }
.live-filter-pills {
  display: flex; align-items: center; gap: 4px; min-width: 0;
  overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none;
}
.live-filter-pills::-webkit-scrollbar { display: none; }
.live-filter-pill {
  display: inline-flex; align-items: center; justify-content: center; gap: 3px;
  flex: 0 0 auto; padding: 4px 6px; border-radius: 7px;
  border: 1px solid var(--card-border); background: var(--pill-track);
  color: var(--muted); font-size: 8px; font-weight: 750; white-space: nowrap;
}
.live-filter-pill.active { background: var(--pill-thumb); border-color: var(--glass-border); color: var(--text); }
.live-filter-count {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 12px; height: 12px; padding: 0 3px; border-radius: 7px;
  background: rgba(48,209,88,.18); color: var(--green); font-size: 7px; font-weight: 900;
}
.live-filter-count[hidden] { display: none; }
.live-league-heading {
  flex: 0 0 auto; padding: 2px 3px 0; color: var(--faint);
  font-size: 8px; font-weight: 900; letter-spacing: .08em;
}

@media (min-width: 381px) and (max-width: 420px) {
  #statsDrawer .detail-tab { font-size: 11px !important; }
}

/* Compact game box score: readable player column + horizontally accessible stats.
   No stat column is clipped; users can swipe/scroll to every value on 380–420px windows. */
#statsDrawer .compact-stat-scroll {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-x: contain;
  overscroll-behavior-y: auto;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x pan-y;
  scrollbar-width: thin;
  scrollbar-color: var(--scroll) transparent;
  border-radius: 9px;
  outline-offset: 2px;
}
#statsDrawer .compact-stat-scroll::-webkit-scrollbar { height: 5px; }
#statsDrawer .compact-stat-scroll::-webkit-scrollbar-track { background: transparent; }
#statsDrawer .compact-stat-scroll::-webkit-scrollbar-thumb {
  background: var(--scroll);
  border-radius: 99px;
}
#statsDrawer .compact-stat-table {
  table-layout: fixed !important;
  border-collapse: separate;
  border-spacing: 0;
  max-width: none !important;
  font-size: 10px !important;
  font-variant-numeric: tabular-nums;
}
#statsDrawer .compact-stat-table thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  height: 26px;
  padding: 4px 3px !important;
  text-align: center !important;
  white-space: nowrap;
  background: var(--glass-solid);
  font-size: 8px !important;
  letter-spacing: .02em;
}
#statsDrawer .compact-stat-table thead th:first-child {
  left: 0;
  z-index: 5;
  width: var(--boxscore-player-column-width, 132px);
  min-width: var(--boxscore-player-column-width, 132px);
  text-align: left !important;
  padding-left: 8px !important;
}
#statsDrawer .compact-stat-table tbody td {
  width: var(--boxscore-stat-column-width, 46px);
  min-width: var(--boxscore-stat-column-width, 46px);
  max-width: var(--boxscore-stat-column-width, 46px);
  height: 48px;
  padding: 5px 2px !important;
  text-align: center !important;
  white-space: nowrap;
  font-size: 10px !important;
  line-height: 1.15;
}
#statsDrawer .compact-stat-table tbody td:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  width: var(--boxscore-player-column-width, 132px);
  min-width: var(--boxscore-player-column-width, 132px);
  max-width: var(--boxscore-player-column-width, 132px);
  text-align: left !important;
  padding: 4px 6px !important;
  background: var(--glass-solid);
  box-shadow: 5px 0 8px rgba(0, 0, 0, .16);
}
#statsDrawer .compact-stat-table tbody tr:nth-child(even) td { background-color: rgba(255,255,255,.025); }
#statsDrawer .compact-stat-table tbody tr:nth-child(even) td:first-child { background: var(--glass-solid); }
#statsDrawer .compact-stat-table .boxscore-player-cell {
  min-width: 0 !important;
  width: var(--boxscore-player-column-width, 132px) !important;
  max-width: var(--boxscore-player-column-width, 132px) !important;
  white-space: normal !important;
}
#statsDrawer .compact-stat-table .boxscore-headshot {
  width: 30px !important;
  height: 30px !important;
  margin-right: 5px !important;
  vertical-align: middle;
}
#statsDrawer .compact-stat-table .boxscore-player-identity {
  display: inline-flex;
  width: calc(100% - 40px);
  max-width: calc(100% - 40px);
  min-width: 0;
  vertical-align: middle;
  overflow: hidden;
}
#statsDrawer .compact-stat-table .boxscore-player-name {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  font-size: 9px !important;
  line-height: 1.15;
}
#statsDrawer .compact-stat-table .boxscore-jersey { font-size: 7px; margin-left: 2px; }
#statsDrawer .compact-stat-table .boxscore-player-meta { font-size: 7px !important; }
#statsDrawer .compact-stat-table td.dnp-text {
  text-align: left !important;
  white-space: nowrap;
}
.stat-scroll-hint {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin: -1px 1px 4px;
  color: var(--faint);
  font-size: 7px;
  line-height: 1.2;
  letter-spacing: .035em;
  text-transform: uppercase;
}
.stat-scroll-hint span:first-child { color: var(--muted); font-weight: 850; }
.stat-scroll-hint span:last-child { white-space: nowrap; }
.boxscore-team-summary {
  margin: 0 0 8px;
  min-width: 0;
  padding: 7px 7px 6px;
  border: 1px solid var(--card-border);
  border-radius: 9px;
  background: rgba(0,0,0,.12);
}
.boxscore-team-summary-title {
  margin: 0 0 5px;
  color: var(--faint);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .06em;
}
.boxscore-team-stat-track {
  display: flex;
  gap: 0;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--scroll) transparent;
}
.boxscore-team-stat {
  display: flex;
  flex: 0 0 48px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-height: 38px;
  border-right: 1px solid var(--card-border);
}
.boxscore-team-stat:last-child { border-right: 0; }
.boxscore-team-stat-value {
  font-size: 12px;
  line-height: 1;
  font-weight: 850;
  font-variant-numeric: tabular-nums;
}
.boxscore-team-stat-label {
  max-width: 46px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--faint);
  font-size: 7px;
  line-height: 1;
  text-transform: uppercase;
}
@media (max-width: 420px) {
  #statsDrawer .overlay-body { padding: 7px 7px 12px !important; }
  #statsDrawer .stats-team-tabs { padding: 6px 7px 3px !important; gap: 5px; }
  #statsDrawer .stats-tab-btn { min-width: 0; padding: 5px 3px !important; font-size: 9px !important; }
  #statsDrawer .stat-group-title { margin: 7px 0 3px; font-size: 9px; }
  #statsDrawer .compact-stat-table tbody td { height: 45px; }
  #statsDrawer .compact-stat-table .boxscore-headshot { width: 28px !important; height: 28px !important; }
  #statsDrawer .compact-stat-table .boxscore-player-identity { width: calc(100% - 36px); max-width: calc(100% - 36px); }
}
.boxscore-team-summary-title-row {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  margin-bottom: 5px;
}
.boxscore-team-summary-logo {
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  object-fit: contain;
}
.boxscore-team-summary-title-row .boxscore-team-summary-title { margin: 0; }

/* Pregame basketball roster: season averages use the same compact horizontal
   box-score layout as live games. The player identity stays pinned while every
   stat remains reachable by swiping/scrolling horizontally. */
#statsDrawer .pregame-season-scroll {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0 0 9px;
  overflow-x: auto !important;
  overflow-y: auto !important;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x pan-y;
}
#statsDrawer .pregame-season-table {
  table-layout: fixed !important;
  border-collapse: separate;
  border-spacing: 0;
  max-width: none !important;
  font-variant-numeric: tabular-nums;
}
#statsDrawer .pregame-season-table thead th {
  height: 25px;
  padding: 4px 2px !important;
  font-size: 8px !important;
  text-align: center !important;
  white-space: nowrap;
  background: var(--glass-solid);
}
#statsDrawer .pregame-season-table thead th:first-child,
#statsDrawer .pregame-season-table tbody td:first-child {
  position: sticky;
  left: 0;
  z-index: 4;
  width: var(--boxscore-player-column-width, 136px);
  min-width: var(--boxscore-player-column-width, 136px);
  max-width: var(--boxscore-player-column-width, 136px);
  text-align: left !important;
  background: var(--glass-solid);
  box-shadow: 4px 0 8px rgba(0,0,0,.16);
}
#statsDrawer .pregame-season-table tbody td {
  width: var(--boxscore-stat-column-width, 44px);
  min-width: var(--boxscore-stat-column-width, 44px);
  max-width: var(--boxscore-stat-column-width, 44px);
  height: 48px;
  padding: 4px 2px !important;
  text-align: center !important;
  white-space: nowrap;
  font-size: 10px !important;
}
#statsDrawer .pregame-season-table tbody tr:nth-child(even) td {
  background-color: rgba(255,255,255,.025);
}
#statsDrawer .pregame-season-table tbody tr:nth-child(even) td:first-child {
  background: var(--glass-solid);
}
#statsDrawer .pregame-season-table .pregame-player-cell {
  display: flex !important;
  align-items: center;
  gap: 5px;
  overflow: hidden;
  white-space: normal !important;
}
#statsDrawer .pregame-season-table .boxscore-headshot {
  width: 29px !important;
  height: 29px !important;
  flex: 0 0 29px;
  border-radius: 50%;
  object-fit: cover;
}
#statsDrawer .pregame-season-table .boxscore-player-identity {
  display: grid;
  flex: 1 1 auto;
  width: auto;
  max-width: none;
  min-width: 0;
  overflow: hidden;
  gap: 2px;
}
#statsDrawer .pregame-season-table .pregame-player-name {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap !important;
  font-size: 9px !important;
  line-height: 1.15;
}
#statsDrawer .pregame-season-table .pregame-player-meta {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 7px !important;
  line-height: 1.1;
}
#statsDrawer .pregame-season-table .pregame-season-value {
  font-size: 10px !important;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}
#statsDrawer .pregame-season-table .boxscore-jersey {
  margin-left: 2px;
  font-size: 7px;
}
#statsDrawer .pregame-roster-loading {
  padding: 8px 2px;
  color: var(--muted);
  font-size: 9px;
}
#statsDrawer .pregame-season-scroll:focus-visible {
  outline: 1px solid var(--accent);
  outline-offset: 2px;
}


/* Team Center + live game momentum */
.team-center-overlay { z-index: 60; }
.team-center-body { padding-bottom: 28px; }
.team-center-hero { display:flex; align-items:center; gap:12px; padding:10px 0 14px; }
.team-center-logo-frame { width:48px; height:48px; flex:0 0 48px; }
.team-center-logo { width:42px; height:42px; object-fit:contain; }
.team-center-hero-copy { display:flex; flex-direction:column; gap:3px; min-width:0; }
.team-center-hero-copy strong { font-size:16px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.team-center-hero-copy span { color:var(--muted); font-size:11px; }
.team-center-hero-copy small { color:var(--muted); font-size:10px; line-height:1.35; }
.team-center-section { margin-top:10px; }
.team-center-game { width:100%; display:grid; grid-template-columns:28px minmax(0,1fr) auto; gap:8px; align-items:center; text-align:left; padding:8px 9px; margin:4px 0; border:1px solid var(--line); border-radius:10px; background:rgba(255,255,255,.035); color:inherit; cursor:pointer; }
.team-center-game:hover, .team-center-news:hover { background:rgba(255,255,255,.07); }
.team-center-opp-frame { width:26px; height:26px; }
.team-center-opp-logo { width:23px; height:23px; object-fit:contain; }
.team-center-game-copy { min-width:0; font-size:11px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.team-center-game-result { font-size:11px; white-space:nowrap; }
.team-center-injury { padding:8px 9px; border:1px solid var(--line); border-radius:10px; margin:4px 0; }
.team-center-injury strong { display:block; font-size:12px; }
.injury-status { display:inline-block; margin-top:3px; font-size:10px; text-transform:uppercase; letter-spacing:.04em; color:var(--accent, #f59e0b); }
.team-center-news { width:100%; display:block; text-align:left; color:inherit; padding:9px; border:1px solid var(--line); border-radius:10px; margin:4px 0; background:rgba(255,255,255,.035); cursor:pointer; }
.team-center-news strong { display:block; font-size:12px; line-height:1.3; }
.team-center-news > span { display:block; margin-top:3px; color:var(--muted); font-size:10px; }
.momentum-card { margin:0 0 12px; padding:10px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,.035); }
.momentum-title-row, .momentum-footer, .momentum-current { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.momentum-title-row { margin-bottom:7px; font-size:11px; letter-spacing:.05em; }
.momentum-live { font-size:9px; padding:2px 6px; border-radius:999px; background:rgba(239,68,68,.15); color:#f87171; }
.momentum-current { font-size:10px; color:var(--muted); }
.momentum-current strong { font-size:14px; color:var(--text); }
.momentum-current span:last-child { max-width:130px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.momentum-bar { display:flex; gap:2px; height:12px; margin:9px 0 7px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.05); }
.momentum-segment { min-width:3px; display:block; opacity:.9; }
.momentum-segment.away { background:rgba(96,165,250,.75); }
.momentum-segment.home { background:rgba(248,113,113,.75); }
.momentum-footer { font-size:9px; color:var(--muted); }
body.team-center-open .search-wrap { visibility:hidden; }

/* Favorite teams: always show each team's next scheduled game, even when it is not today. */
.favorite-next-games {
  flex: none;
  margin-bottom: 8px;
  padding: 9px 10px 8px;
  border: 1px solid var(--card-border);
  border-radius: 14px;
  background: rgba(255,255,255,.025);
}

.favorite-next-games-heading {
  margin: 0 2px 6px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .12em;
}

.favorite-next-game {
  width: 100%;
  min-height: 42px;
  display: grid;
  grid-template-columns: 32px minmax(0,1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 6px 7px;
  margin: 3px 0;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.favorite-next-game:hover {
  background: var(--hover);
  border-color: var(--glass-border);
}

.favorite-next-logo-frame {
  width: 30px;
  height: 30px;
}

.favorite-next-logo {
  width: 25px;
  height: 25px;
  object-fit: contain;
}

.favorite-next-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.favorite-next-copy strong {
  font-size: 11.5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.favorite-next-copy span {
  color: var(--muted);
  font-size: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.favorite-next-opponent {
  color: var(--text);
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}

@media (max-width: 420px) {
  .favorite-next-game {
    grid-template-columns: 30px minmax(0,1fr);
  }
  .favorite-next-opponent {
    grid-column: 2;
    margin-top: -4px;
  }
}


/* ================================================================
   Glass Scores expanded dashboard — responsive glass layout
   ================================================================ */
.shell {
  display: flex;
  flex-direction: column;
  width: 100vw;
  height: 100vh;
  min-width: 0;
  min-height: 0;
  border-radius: 20px;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(8, 13, 29, .94), rgba(5, 13, 24, .91));
}
body.is-fullscreen .shell { border-radius: 0; }
body.is-fullscreen .dashboard-layout { margin-bottom: 0; }
.header {
  min-height: 58px;
  flex: 0 0 58px;
  padding: 9px 16px;
  border-bottom: 1px solid var(--glass-border);
  background: rgba(7, 10, 23, .58);
}
.header .title-main { font-size: 16px; letter-spacing: .03em; font-weight: 800; }
.header .title-sub { font-size: 10px; color: var(--faint); }
.header .actions { gap: 7px; }
.header .icon-btn { width: 34px; height: 34px; flex-basis: 34px; }
#fullscreen.active { color: #fff; background: rgba(128, 108, 255, .27); border-color: rgba(174, 151, 255, .65); }
.segmented {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  gap: 4px;
  height: 48px;
  flex: 0 0 48px;
  margin: 0 14px 10px;
  padding: 5px 7px;
  overflow-x: auto;
  overflow-y: hidden;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(9, 13, 28, .75);
  scrollbar-width: none;
}
.segmented::-webkit-scrollbar { display: none; }
.segmented .thumb { display: none; }
.seg {
  flex: 1 0 auto;
  min-width: 78px;
  padding: 0 15px;
  border-radius: 9px;
  font-size: 12px;
  color: rgba(235,238,255,.7);
  transition: background .16s ease, color .16s ease;
}
.seg.active {
  color: #fff;
  background: linear-gradient(180deg, rgba(141,119,255,.24), rgba(105,89,208,.12));
  box-shadow: inset 0 -2px 0 rgba(170,145,255,.8);
}
.dashboard-layout {
  display: grid;
  grid-template-columns: 54px 208px minmax(0,1fr) 250px;
  gap: 12px;
  flex: 1 1 auto;
  min-height: 0;
  margin: 0 14px 14px;
  overflow: hidden;
}
.app-rail, .league-sidebar, .right-rail {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(14, 20, 37, .76);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.app-rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 11px;
  padding: 12px 5px;
  border-radius: 16px;
}
.rail-btn {
  display: grid;
  place-items: center;
  width: 39px;
  height: 39px;
  flex: 0 0 39px;
  border-radius: 13px;
  color: rgba(240,242,255,.76);
  font-size: 19px;
  transition: background .16s ease, color .16s ease;
}
.rail-btn:hover, .rail-btn.active { background: rgba(142,120,255,.25); color: #fff; box-shadow: inset 0 0 0 1px rgba(173,153,255,.28); }
#railSettings { margin-top: auto; }
.league-sidebar {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 8px 0;
  border-radius: 16px;
  overflow-y: auto;
  scrollbar-width: thin;
}
.sidebar-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 39px;
  padding: 0 13px;
  color: #f7f7ff;
  font-size: 12px;
  font-weight: 700;
}
.sidebar-secondary-heading { border-top: 1px solid rgba(255,255,255,.09); margin-top: 7px; }
.sidebar-caret, .league-chevron { color: rgba(230,232,255,.55); }
.league-link {
  display: grid;
  grid-template-columns: 25px minmax(0,1fr) 14px;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 43px;
  padding: 0 12px;
  border-top: 1px solid rgba(255,255,255,.055);
  color: rgba(245,246,255,.82);
  font-size: 11px;
  text-align: left;
  transition: background .15s ease;
}
.league-link:hover, .league-link.active { background: linear-gradient(90deg, rgba(138,115,255,.25), rgba(138,115,255,.05)); color: #fff; }
.league-link.active { box-shadow: inset 3px 0 0 #a995ff; }
.league-mark { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: rgba(255,255,255,.12); font-size: 13px; font-weight: 800; }

.dashboard-main {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border-radius: 16px;
}
.main-view-tabs {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 42px;
  flex: 0 0 42px;
  padding: 0 4px 8px;
}
.main-view-tab {
  min-height: 31px;
  padding: 0 13px;
  border-radius: 9px;
  color: rgba(239,241,255,.67);
  font-size: 11px;
  font-weight: 650;
}
.main-view-tab:hover, .main-view-tab.active { color: #fff; background: rgba(144,124,255,.2); }
.home-view-panel { min-height: 0; flex: 1 1 auto; overflow: hidden; }
.home-view-panel[hidden] { display: none !important; }
#scoresPanel[hidden], #standingsPanel[hidden], #streamsPanel[hidden], #motorsportsPanel[hidden], #playoffPanel[hidden] {
  display: none !important;
}
.scores-panel { display: flex; flex-direction: column; gap: 10px; }
.score-controls { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; min-width: 0; }
.score-controls .search-wrap { flex: 1 1 auto; min-width: 120px; }
.score-controls .search-box { min-height: 40px; border-radius: 11px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.10); }
.score-controls .search-input { font-size: 12px; }
.date-bar { flex: 0 0 190px; max-width: 190px; min-width: 150px; }
.featured-game {
  display: flex;
  flex-direction: column;
  gap: 15px;
  flex: 0 0 auto;
  min-height: 170px;
  padding: 18px 20px;
  border: 1px solid rgba(177,160,255,.2);
  border-radius: 16px;
  background: radial-gradient(ellipse at 50% 5%, rgba(113,89,219,.27), transparent 58%), linear-gradient(130deg, rgba(24,34,61,.95), rgba(10,17,33,.92));
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 12px 30px rgba(0,0,0,.18);
}
.featured-heading { display: flex; align-items: center; gap: 7px; color: rgba(244,245,255,.9); font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.featured-live-dot { width: 7px; height: 7px; border-radius: 50%; background: #ff5d67; box-shadow: 0 0 0 4px rgba(255,93,103,.12); }
.featured-meta { margin-left: auto; color: #c2b3ff; font-size: 10px; letter-spacing: .04em; }
.featured-matchup { display: grid; grid-template-columns: minmax(0,1fr) 120px minmax(0,1fr); align-items: center; gap: 9px; min-height: 82px; }
.featured-side { display: flex; align-items: center; justify-content: center; gap: 11px; min-width: 0; }
.featured-side:last-child { flex-direction: row-reverse; }
.featured-logo { width: 58px; height: 58px; object-fit: contain; filter: drop-shadow(0 7px 12px rgba(0,0,0,.25)); }
.featured-name { min-width: 0; color: #fff; font-size: clamp(12px,1.2vw,17px); line-height: 1.25; text-align: center; overflow-wrap: anywhere; }
.featured-record { color: rgba(229,232,255,.62); font-size: 10px; }
.featured-score { color: #fff; font-size: clamp(23px,2vw,31px); font-weight: 850; font-variant-numeric: tabular-nums; }
.featured-versus { display: flex; flex-direction: column; align-items: center; gap: 7px; }
.featured-vs { color: rgba(235,236,255,.55); font-size: 12px; font-weight: 800; }
.featured-status { max-width: 120px; padding: 5px 8px; border-radius: 99px; background: rgba(44,207,111,.15); color: #74e7a0; font-size: 9px; font-weight: 800; text-align: center; }
.featured-actions { display: flex; justify-content: center; gap: 8px; }
.featured-open, .featured-watch { min-width: 100px; min-height: 29px; padding: 0 12px; border-radius: 8px; border: 1px solid rgba(255,255,255,.14); color: #f8f8ff; font-size: 10px; font-weight: 700; background: rgba(255,255,255,.08); }
.featured-open:hover, .featured-watch:hover { background: rgba(142,119,255,.25); }
.featured-watch { background: rgba(44,207,111,.15); border-color: rgba(44,207,111,.27); }
.list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 245px), 1fr));
  align-content: start;
  align-items: stretch;
  gap: 10px;
  flex: 1 1 0;
  min-height: 0;
  padding: 0 2px 9px;
  overflow-y: auto;
  -webkit-mask-image: none;
  mask-image: none;
}
.list > .card, .list > .empty { width: 100%; min-width: 0; max-width: none; }
.list > .empty { grid-column: 1 / -1; }
.card { min-width: 0; }
.right-rail {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 13px 11px;
  border-radius: 16px;
  overflow-y: auto;
  scrollbar-width: thin;
}
.right-rail-heading { display: flex; align-items: center; justify-content: space-between; gap: 6px; color: #f7f7ff; font-size: 11px; font-weight: 750; }
.rail-status-pill { padding: 4px 8px; border-radius: 99px; background: rgba(255,255,255,.09); color: #c9beff; font-size: 8px; letter-spacing: .08em; }
.right-player-details { display: grid; gap: 7px; }
.right-player-card { display: grid; grid-template-columns: 44px minmax(0,1fr); gap: 8px; align-items: center; min-height: 60px; padding: 7px; border: 1px solid rgba(255,255,255,.09); border-radius: 10px; background: rgba(255,255,255,.045); cursor: pointer; }
.right-player-card:hover { background: rgba(139,117,255,.15); }
.right-player-headshot { width: 42px; height: 46px; border-radius: 8px; object-fit: cover; background: rgba(255,255,255,.08); }
.right-player-copy { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.right-player-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.right-player-copy span { color: rgba(230,232,255,.58); font-size: 9px; }
.right-rail-divider { height: 1px; flex: 0 0 1px; background: rgba(255,255,255,.09); margin: 3px 0; }
.view-all-btn { color: #b8a8ff; font-size: 9px; }
.right-standings { display: grid; gap: 6px; }
.right-standing-row { display: grid; grid-template-columns: 18px minmax(0,1fr) auto; align-items: center; gap: 7px; padding: 5px 3px; border-bottom: 1px solid rgba(255,255,255,.06); color: rgba(241,242,255,.76); font-size: 9px; }
.right-standing-row strong { color: #fff; font-variant-numeric: tabular-nums; }
.right-rail-empty { color: rgba(230,232,255,.53); font-size: 10px; line-height: 1.55; padding: 5px 2px; }
.hub-panel { display: flex; flex-direction: column; gap: 13px; overflow-y: auto; padding: 8px 6px 12px; scrollbar-width: thin; }
.hub-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.hub-panel-heading h1 { margin: 3px 0 4px; color: #fff; font-size: clamp(22px,2.5vw,30px); letter-spacing: -.03em; }
.eyebrow { color: #b6a5ff; font-size: 9px; font-weight: 850; letter-spacing: .15em; }
.hub-subtitle { color: rgba(231,234,255,.61); font-size: 10px; line-height: 1.5; }
.hub-league-select { min-width: 150px; min-height: 36px; padding: 0 10px; border: 1px solid rgba(255,255,255,.13); border-radius: 10px; background: rgba(255,255,255,.08); font-size: 11px; }
.standings-content, .playoff-content { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,340px),1fr)); gap: 11px; align-content: start; }
.standings-group, .playoff-group { min-width: 0; padding: 12px; border-radius: 13px; border: 1px solid rgba(255,255,255,.09); background: rgba(255,255,255,.045); }
.standings-group-title { margin-bottom: 9px; color: #fff; font-size: 12px; font-weight: 800; }
.standings-table { display: grid; gap: 2px; }
.standings-row { display: grid; grid-template-columns: 24px minmax(0,1fr) 58px 50px 37px; align-items: center; gap: 6px; width: 100%; min-height: 31px; padding: 4px 5px; border-radius: 6px; text-align: left; color: rgba(243,244,255,.78); font-size: 9px; font-variant-numeric: tabular-nums; }
button.standings-row:hover { background: rgba(138,115,255,.17); }
.standings-header { min-height: 22px; color: rgba(224,226,255,.45); font-size: 8px; font-weight: 850; letter-spacing: .06em; }
.standing-rank { color: #b5a5ff; font-weight: 850; }
.standing-team { display: flex; align-items: center; gap: 7px; min-width: 0; }
.standing-logo { width: 18px; height: 18px; object-fit: contain; flex: 0 0 auto; }
.standing-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #fff; font-weight: 650; }
.standing-record, .standing-pct, .standing-gb { text-align: right; white-space: nowrap; }
.playoff-seed-list { display: grid; gap: 5px; }
.playoff-row { display: grid; grid-template-columns: 30px minmax(0,1fr) auto; gap: 8px; align-items: center; min-height: 45px; padding: 6px 8px; border: 1px solid rgba(255,255,255,.06); border-radius: 9px; background: rgba(255,255,255,.025); }
.playoff-row.clinched { border-left: 3px solid #55d88a; }
.playoff-row.playin { border-left: 3px solid #f0bd5e; }
.playoff-row.outside { border-left: 3px solid rgba(255,255,255,.17); }
.playoff-seed { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; background: rgba(255,255,255,.08); color: #d2c5ff; font-size: 11px; font-weight: 850; }
.playoff-team-copy { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.playoff-team-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.playoff-team-copy span { color: rgba(231,234,255,.55); font-size: 9px; }
.playoff-status { color: rgba(231,234,255,.65); font-size: 8px; font-weight: 850; text-align: right; letter-spacing: .04em; }
#statsDrawer .detail-tabs { grid-template-columns: repeat(5,minmax(0,1fr)); }
#statsDrawer .pane-prob { display: none; min-height: 0; flex: 1; overflow: hidden; }
#statsDrawer[data-view="prob"] .pane-box,
#statsDrawer[data-view="prob"] .pane-shots,
#statsDrawer[data-view="prob"] .pane-pbp,
#statsDrawer[data-view="prob"] .pane-watch { display: none !important; }
#statsDrawer[data-view="prob"] .pane-prob { display: flex !important; flex-direction: column; }
#statsDrawer:not([data-view="prob"]) .pane-prob { display: none !important; }
.probability-empty { display: grid; place-items: center; min-height: 180px; padding: 24px; color: rgba(230,232,255,.62); text-align: center; font-size: 12px; line-height: 1.5; }
.probability-heading { margin-bottom: 15px; }
.probability-heading h2 { margin: 5px 0; font-size: 23px; }
.probability-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: center; margin-bottom: 12px; }
.probability-team { display: flex; flex-direction: column; gap: 5px; padding: 11px; border: 1px solid rgba(255,255,255,.10); border-radius: 10px; background: rgba(255,255,255,.05); }
.probability-team strong { font-size: 22px; font-variant-numeric: tabular-nums; }
.probability-team-name { color: rgba(231,234,255,.62); font-size: 10px; font-weight: 750; }
.probability-bar { display: flex; grid-column: 1 / -1; height: 11px; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.08); }
.probability-away-fill { background: #7a86ff; }
.probability-home-fill { background: #a58cff; }
.probability-chart-wrap { width: 100%; padding: 8px 4px; border: 1px solid rgba(255,255,255,.08); border-radius: 11px; background: rgba(255,255,255,.035); }
.probability-chart-wrap svg { display: block; width: 100%; height: auto; }
.probability-gridline { stroke: rgba(255,255,255,.10); stroke-width: 1; }
.probability-axis-label { fill: rgba(232,234,255,.5); font-size: 10px; }
.probability-line { fill: none; stroke: #b5a1ff; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.probability-point { fill: #fff; stroke: #a58cff; stroke-width: 3; }
.probability-footnote { margin-top: 11px; color: rgba(231,234,255,.5); font-size: 9px; line-height: 1.5; }
.ufc-fight-detail { display: grid; gap: 10px; padding: 12px; }
.ufc-fight-detail h2 { font-size: 22px; }
.fighter-result { color: #6fe2a0 !important; font-size: 10px !important; font-weight: 850; }
.fighter-row .team-name { max-width: 190px; }
.empty { min-width: 0; }
@media (max-width: 1180px) {
  .dashboard-layout { grid-template-columns: 48px 185px minmax(0,1fr); }
  .right-rail { display: none; }
  .seg { min-width: 65px; padding: 0 10px; }
}
@media (max-width: 900px) {
  .dashboard-layout { grid-template-columns: 46px minmax(0,1fr); }
  .league-sidebar { display: none; }
  .featured-game { min-height: 150px; padding: 12px; }
  .featured-matchup { grid-template-columns: minmax(0,1fr) 80px minmax(0,1fr); }
  .featured-logo { width: 42px; height: 42px; }
  .date-bar { flex-basis: 160px; }
  .seg { min-width: 58px; }
}
@media (max-width: 640px) {
  .header .title-main { font-size: 13px; }
  .header .title-sub { display: none; }
  .header .icon-btn { width: 30px; height: 30px; flex-basis: 30px; }
  .dashboard-layout { grid-template-columns: 40px minmax(0,1fr); gap: 7px; margin: 0 8px 8px; }
  .app-rail { padding: 8px 3px; }
  .rail-btn { width: 33px; height: 33px; flex-basis: 33px; }
  .segmented { margin-left: 8px; margin-right: 8px; }
  .seg { min-width: 54px; padding: 0 7px; font-size: 10px; }
  .score-controls { flex-wrap: wrap; }
  .score-controls .search-wrap { flex-basis: 100%; }
  .date-bar { flex: 1 1 100%; max-width: none; }
  .featured-matchup { grid-template-columns: 1fr 55px 1fr; }
  .featured-side { flex-direction: column; gap: 4px; }
  .featured-side:last-child { flex-direction: column; }
  .featured-name { max-width: 100%; font-size: 10px; }
  .featured-logo { width: 34px; height: 34px; }
  .featured-score { font-size: 18px; }
  #statsDrawer .detail-tabs { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

/* Fullscreen visual state and standings status accents. */
.playoff-row.playoff { border-left: 3px solid #76a7ff; }
body.is-fullscreen .dashboard-layout { margin: 0; gap: 14px; padding: 12px 16px 16px; }
body.is-fullscreen .shell { border: 0; }
body.is-fullscreen .header { min-height: 54px; flex-basis: 54px; }
@media (max-height: 700px) {
  .featured-game { min-height: 136px; gap: 9px; padding: 12px 16px; }
  .featured-matchup { min-height: 60px; }
  .right-player-card { min-height: 50px; }
}

.probability-summary.three-way { grid-template-columns: repeat(3,minmax(0,1fr)); }
.probability-summary.three-way .probability-bar { grid-column: 1 / -1; }
.probability-team.draw { align-items: center; text-align: center; }
.probability-draw-fill { background: #7e879a; }

/* Keep hidden controls hidden even when component display styles are set. */
.featured-game[hidden],
.detail-tab[hidden],
.stats-team-tabs[hidden] { display: none !important; }
#statsDrawer .detail-tabs { grid-template-columns: repeat(5,minmax(0,1fr)) !important; }
#statsDrawer.no-shot-chart .detail-tabs { grid-template-columns: repeat(4,minmax(0,1fr)) !important; }
#statsDrawer.fighter-game .detail-tabs { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
@media (max-width: 640px) {
  #statsDrawer .detail-tabs { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
  #statsDrawer.no-shot-chart .detail-tabs { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
}

/* ================================================================
   Glass Scores: charcoal translucency, sidebar navigation & themes
   ================================================================ */
.segmented[hidden] { display: none !important; }
.theme-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.theme-toggle { border: 1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.035); }

/* Neutral charcoal glass is the default dark appearance. */
.shell {
  background: linear-gradient(145deg, rgba(48,50,55,.76), rgba(28,30,34,.72));
  backdrop-filter: blur(24px) saturate(125%);
  -webkit-backdrop-filter: blur(24px) saturate(125%);
}
.header { background: rgba(48,50,55,.36); }
.app-rail, .league-sidebar, .right-rail {
  background: rgba(52,54,59,.38);
  border-color: rgba(255,255,255,.12);
  backdrop-filter: blur(22px) saturate(130%);
  -webkit-backdrop-filter: blur(22px) saturate(130%);
}
.dashboard-main {
  background: rgba(40,42,47,.20);
  border: 1px solid rgba(255,255,255,.07);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.sidebar-heading { color: rgba(248,249,250,.84); letter-spacing: .04em; font-size: 10px; }
.sidebar-secondary-heading { border-top-color: rgba(255,255,255,.07); }
.sidebar-caret { display: none !important; }
.league-link { grid-template-columns: 25px minmax(0,1fr) auto; }
.league-link .fav-count { min-width: 18px; text-align: center; }
.league-link .seg-dot { justify-self: end; }
.favorites-mark { color: #f4cc66; }
.live-mark { color: #52d889; font-size: 10px; text-shadow: 0 0 9px rgba(82,216,137,.45); }
.league-link.active { background: linear-gradient(90deg, rgba(178,180,190,.17), rgba(178,180,190,.035)); box-shadow: inset 3px 0 0 rgba(224,226,233,.76); }
.league-link:hover { background: rgba(255,255,255,.07); }
.rail-btn:hover, .rail-btn.active { background: rgba(255,255,255,.11); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.13); }
.main-view-tab:hover, .main-view-tab.active { color: #fff; background: rgba(255,255,255,.10); }
.score-controls .search-box { background: rgba(255,255,255,.055); border-color: rgba(255,255,255,.11); }
.featured-game {
  border-color: rgba(255,255,255,.13);
  background: radial-gradient(ellipse at 50% 5%, rgba(184,188,196,.12), transparent 60%), linear-gradient(130deg, rgba(72,74,80,.58), rgba(35,37,42,.58));
  box-shadow: inset 0 1px rgba(255,255,255,.09), 0 12px 30px rgba(0,0,0,.14);
}
.featured-meta { color: rgba(238,239,243,.73); }
.playoff-row { background: rgba(255,255,255,.035); border-color: rgba(255,255,255,.08); }
.standings-group, .playoff-group { background: rgba(255,255,255,.035); border-color: rgba(255,255,255,.09); }
.right-player-card { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.08); }

/* Light mode applies to the complete home dashboard, not only old token-based cards. */
:root[data-theme="light"] .shell {
  background: linear-gradient(145deg, rgba(236,238,241,.82), rgba(219,222,227,.74));
}
:root[data-theme="light"] .header { background: rgba(245,246,248,.58); }
:root[data-theme="light"] .app-rail,
:root[data-theme="light"] .league-sidebar,
:root[data-theme="light"] .right-rail {
  background: rgba(248,249,251,.58);
  border-color: rgba(35,39,45,.12);
}
:root[data-theme="light"] .dashboard-main { background: rgba(250,251,252,.34); border-color: rgba(35,39,45,.08); }
:root[data-theme="light"] .sidebar-heading,
:root[data-theme="light"] .right-rail-heading,
:root[data-theme="light"] .main-view-tab,
:root[data-theme="light"] .featured-heading,
:root[data-theme="light"] .featured-name,
:root[data-theme="light"] .featured-score,
:root[data-theme="light"] .hub-panel-heading h1,
:root[data-theme="light"] .standings-group-title,
:root[data-theme="light"] .standing-name,
:root[data-theme="light"] .playoff-team-copy strong {
  color: #25282e !important;
  text-shadow: none !important;
}
:root[data-theme="light"] .title-main { color: #25282e; text-shadow: none; }
:root[data-theme="light"] .title-sub,
:root[data-theme="light"] .right-rail-empty,
:root[data-theme="light"] .right-player-copy span,
:root[data-theme="light"] .hub-subtitle,
:root[data-theme="light"] .playoff-team-copy span,
:root[data-theme="light"] .playoff-status,
:root[data-theme="light"] .featured-record,
:root[data-theme="light"] .featured-vs,
:root[data-theme="light"] .standing-rank,
:root[data-theme="light"] .right-standing-row {
  color: rgba(38,42,48,.68) !important;
  text-shadow: none !important;
}
:root[data-theme="light"] .league-link { color: rgba(34,38,44,.82); border-top-color: rgba(35,39,45,.07); }
:root[data-theme="light"] .league-link.active { color: #202329; background: rgba(42,47,54,.09); box-shadow: inset 3px 0 0 rgba(65,70,78,.65); }
:root[data-theme="light"] .league-link:hover,
:root[data-theme="light"] .rail-btn:hover,
:root[data-theme="light"] .rail-btn.active,
:root[data-theme="light"] .main-view-tab:hover,
:root[data-theme="light"] .main-view-tab.active { color: #202329; background: rgba(40,44,50,.09); box-shadow: none; }
:root[data-theme="light"] .theme-toggle { background: rgba(40,44,50,.06); border-color: rgba(35,39,45,.13); }
:root[data-theme="light"] .card,
:root[data-theme="light"] .right-player-card,
:root[data-theme="light"] .standings-group,
:root[data-theme="light"] .playoff-group,
:root[data-theme="light"] .playoff-row {
  color: #282c32;
  background: rgba(255,255,255,.55);
  border-color: rgba(35,39,45,.11);
  box-shadow: inset 0 1px rgba(255,255,255,.65);
}
:root[data-theme="light"] .card:hover,
:root[data-theme="light"] .right-player-card:hover { background: rgba(255,255,255,.82); }
:root[data-theme="light"] .score-controls .search-box,
:root[data-theme="light"] .probability-chart-wrap {
  background: rgba(255,255,255,.62);
  border-color: rgba(35,39,45,.13);
}
:root[data-theme="light"] .featured-game {
  background: linear-gradient(135deg, rgba(255,255,255,.78), rgba(224,227,232,.68));
  border-color: rgba(35,39,45,.13);
  box-shadow: 0 10px 25px rgba(30,34,40,.08), inset 0 1px rgba(255,255,255,.9);
}
:root[data-theme="light"] .featured-open,
:root[data-theme="light"] .featured-watch { color: #25282e; border-color: rgba(35,39,45,.16); background: rgba(255,255,255,.55); }
:root[data-theme="light"] .hub-league-select { color: #25282e; background: rgba(255,255,255,.72); border-color: rgba(35,39,45,.16); }
:root[data-theme="light"] .standing-name { color: #25282e; }
:root[data-theme="light"] .standing-record,
:root[data-theme="light"] .standing-pct,
:root[data-theme="light"] .standing-gb { color: rgba(35,39,45,.75); }
:root[data-theme="light"] .standings-header { color: rgba(35,39,45,.53); }
:root[data-theme="light"] .right-standing-row strong { color: #24282e; }
:root[data-theme="light"] .right-rail-divider { background: rgba(35,39,45,.12); }
:root[data-theme="light"] .league-mark { background: rgba(35,39,45,.08); }
:root[data-theme="light"] .live-mark { color: #18874b; }
:root[data-theme="light"] .featured-score { color: #202329; }
:root[data-theme="light"] .featured-status { color: #126f3a; }
:root[data-theme="light"] .date-label-btn,
:root[data-theme="light"] .date-nav-btn,
:root[data-theme="light"] .today-pill { color: #25282e; }
:root[data-theme="light"] .main-view-tabs { border-bottom-color: rgba(35,39,45,.10); }

@media (max-width: 900px) {
  .league-sidebar { display: flex; }
  .dashboard-layout { grid-template-columns: 46px 178px minmax(0,1fr); }
  .right-rail { display: none; }
}
@media (max-width: 640px) {
  .dashboard-layout { grid-template-columns: 40px minmax(0,1fr); }
  .league-sidebar { display: none; }
}



/* ================================================================
   Right rail: complete player names, portraits and two-team stats
   ================================================================ */
#segmented,
.segmented[hidden] { display: none !important; }

.right-player-card {
  grid-template-columns: 52px minmax(0,1fr);
  align-items: center;
  min-height: 68px;
  padding: 7px;
}
.right-player-headshot,
.right-player-headshot-fallback {
  width: 50px;
  height: 56px;
  border-radius: 8px;
  object-fit: cover;
  flex: 0 0 50px;
  background: linear-gradient(145deg, rgba(255,255,255,.13), rgba(255,255,255,.035));
}
.right-player-headshot-fallback {
  display: grid;
  place-items: center;
  color: rgba(245,246,250,.9);
  font-size: 15px;
  font-weight: 800;
  letter-spacing: .03em;
}
.right-player-copy { gap: 5px; }
.right-player-copy .right-player-fullname {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow: visible;
  white-space: normal;
  text-overflow: clip;
  overflow-wrap: anywhere;
  line-height: 1.25;
  font-size: 10px;
  color: rgba(250,251,255,.96);
}
.right-player-copy .right-player-meta {
  display: block;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.35;
  font-size: 8.5px;
}
.right-team-comparison { display: grid; gap: 8px; min-width: 0; }
.right-team-comparison-head {
  display: grid;
  grid-template-columns: minmax(0,1fr) 22px minmax(0,1fr);
  align-items: center;
  gap: 3px;
  padding: 3px 1px 7px;
  border-bottom: 1px solid rgba(255,255,255,.09);
}
.right-team-identity { display: flex; align-items: center; gap: 6px; min-width: 0; }
.right-team-identity.home { justify-content: flex-end; }
.right-team-identity strong { min-width: 0; overflow-wrap: anywhere; color: rgba(246,247,251,.92); font-size: 9px; font-weight: 800; }
.right-team-vs { color: rgba(226,229,238,.45); font-size: 8px; font-weight: 800; text-align: center; }
.right-team-logo-frame { display: inline-grid; place-items: center; width: 22px; height: 22px; flex: 0 0 22px; border-radius: 7px; background: rgba(255,255,255,.07); }
.right-team-logo { width: 19px; height: 19px; object-fit: contain; }
.right-team-logo-frame .team-logo-fallback { font-size: 7px; }
.right-team-stat-list { display: grid; gap: 1px; }
.right-team-stat-row {
  display: grid;
  grid-template-columns: minmax(32px,.8fr) minmax(58px,1.25fr) minmax(32px,.8fr);
  align-items: center;
  gap: 5px;
  min-height: 27px;
  padding: 3px 2px;
  border-bottom: 1px solid rgba(255,255,255,.055);
}
.right-team-stat-value { color: rgba(248,249,252,.95); font-size: 10px; font-weight: 800; font-variant-numeric: tabular-nums; }
.right-team-stat-value.away { text-align: left; }
.right-team-stat-value.home { text-align: right; }
.right-team-stat-label { color: rgba(225,228,238,.58); font-size: 8px; line-height: 1.2; text-align: center; overflow-wrap: anywhere; }
.league-mark.basketball-mark,
.league-mark.football-mark,
.league-mark.ufc-mark { font-size: 15px; line-height: 1; background: rgba(255,255,255,.075); }

:root[data-theme="light"] .right-player-copy .right-player-fullname,
:root[data-theme="light"] .right-team-identity strong,
:root[data-theme="light"] .right-team-stat-value { color: #25282e; }
:root[data-theme="light"] .right-team-stat-label,
:root[data-theme="light"] .right-team-vs { color: rgba(38,42,48,.60); }
:root[data-theme="light"] .right-team-stat-row,
:root[data-theme="light"] .right-team-comparison-head { border-color: rgba(35,39,45,.11); }
:root[data-theme="light"] .right-player-headshot-fallback { color: #343840; background: rgba(35,39,45,.08); }
/* Glass Scores light-theme readability update: warm off-white glass + dark, bold text. */
:root[data-theme="light"] {
  color-scheme: light;
  --text: #08090b;
  --muted: #17181a;
  --faint: #252629;
  --glass: rgba(229, 228, 222, 0.90);
  --glass-full: rgba(225, 224, 218, 0.96);
  --glass-solid: rgba(234, 233, 227, 0.97);
  --glass-border: rgba(25, 27, 30, 0.20);
  --specular: rgba(255, 255, 255, 0.52);
  --sheen: rgba(255, 255, 255, 0.24);
  --card: rgba(236, 235, 229, 0.84);
  --card-border: rgba(28, 30, 33, 0.16);
  --hover: rgba(18, 20, 23, 0.075);
  --pill-track: rgba(18, 20, 23, 0.10);
  --pill-thumb: rgba(220, 219, 213, 0.96);
  --pill-hint: rgba(18, 20, 23, 0.07);
  --scroll: rgba(18, 20, 23, 0.34);
  --option-bg: #e9e8e2;
  --option-text: #08090b;
  --text-shadow: none;
}

/* Near-black text and semibold weight throughout light mode. */
:root[data-theme="light"] body,
:root[data-theme="light"] body *:not(img):not(video):not(canvas) {
  color: #08090b !important;
  font-weight: 600 !important;
  text-shadow: none !important;
}
:root[data-theme="light"] input::placeholder,
:root[data-theme="light"] textarea::placeholder {
  color: #252629 !important;
  opacity: 1 !important;
  font-weight: 600 !important;
}
:root[data-theme="light"] select option {
  color: #08090b !important;
  background: #e9e8e2 !important;
  font-weight: 600 !important;
}

/* Warm-grey translucency instead of stark-white surfaces. */
:root[data-theme="light"] .shell {
  background: linear-gradient(145deg, rgba(231, 230, 224, 0.88), rgba(215, 214, 208, 0.84)) !important;
}
:root[data-theme="light"] .header {
  background: rgba(231, 230, 224, 0.82) !important;
  border-color: rgba(26, 28, 31, 0.15) !important;
}
:root[data-theme="light"] .app-rail,
:root[data-theme="light"] .league-sidebar,
:root[data-theme="light"] .right-rail {
  background: rgba(226, 225, 219, 0.86) !important;
  border-color: rgba(26, 28, 31, 0.16) !important;
}
:root[data-theme="light"] .dashboard-main {
  background: rgba(232, 231, 225, 0.48) !important;
  border-color: rgba(26, 28, 31, 0.12) !important;
}
:root[data-theme="light"] .card,
:root[data-theme="light"] .right-player-card,
:root[data-theme="light"] .standings-group,
:root[data-theme="light"] .playoff-group,
:root[data-theme="light"] .playoff-row {
  background: rgba(235, 234, 228, 0.88) !important;
  border-color: rgba(25, 27, 30, 0.16) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.38), 0 5px 16px rgba(28, 30, 34, 0.055) !important;
}
:root[data-theme="light"] .card:hover,
:root[data-theme="light"] .right-player-card:hover {
  background: rgba(241, 240, 234, 0.94) !important;
}
:root[data-theme="light"] .featured-game {
  background: linear-gradient(135deg, rgba(235, 234, 228, 0.94), rgba(216, 215, 209, 0.90)) !important;
  border-color: rgba(25, 27, 30, 0.17) !important;
  box-shadow: 0 10px 24px rgba(30, 32, 36, 0.08), inset 0 1px rgba(255, 255, 255, 0.42) !important;
}
:root[data-theme="light"] .score-controls .search-box,
:root[data-theme="light"] .probability-chart-wrap,
:root[data-theme="light"] .hub-league-select,
:root[data-theme="light"] .featured-open,
:root[data-theme="light"] .featured-watch {
  background: rgba(231, 230, 224, 0.88) !important;
  border-color: rgba(25, 27, 30, 0.18) !important;
}
:root[data-theme="light"] .league-link,
:root[data-theme="light"] .rail-btn,
:root[data-theme="light"] .main-view-tab,
:root[data-theme="light"] .theme-toggle {
  background-color: rgba(30, 32, 35, 0.045);
  border-color: rgba(25, 27, 30, 0.13) !important;
}
:root[data-theme="light"] .league-link.active,
:root[data-theme="light"] .rail-btn.active,
:root[data-theme="light"] .main-view-tab.active {
  background: rgba(28, 30, 33, 0.12) !important;
  box-shadow: inset 3px 0 0 rgba(20, 22, 25, 0.65) !important;
}
:root[data-theme="light"] .right-rail-divider,
:root[data-theme="light"] .right-team-stat-row,
:root[data-theme="light"] .right-team-comparison-head,
:root[data-theme="light"] .main-view-tabs {
  border-color: rgba(25, 27, 30, 0.16) !important;
}
:root[data-theme="light"] .right-player-headshot-fallback,
:root[data-theme="light"] .league-mark {
  background: rgba(25, 27, 30, 0.09) !important;
}
:root[data-theme="light"] button:disabled,
:root[data-theme="light"] input:disabled,
:root[data-theme="light"] select:disabled { opacity: 0.72; }


/* Glass Scores: responsive readability, NFL team leaders and Open Match v1 */
.stats-pill-hint.open-match-pill {
  appearance: none; min-height: 25px; margin-left: auto; padding: 4px 10px;
  border: 1px solid var(--card-border); border-radius: 8px; background: var(--pill-hint);
  color: var(--text); font: inherit; font-size: 10px; font-weight: 850; letter-spacing: .055em;
  line-height: 1; white-space: nowrap; cursor: pointer;
  transition: background .15s ease, border-color .15s ease, transform .15s ease;
}
.stats-pill-hint.open-match-pill:hover { background: var(--hover); border-color: var(--accent); transform: translateY(-1px); }
.stats-pill-hint.open-match-pill:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.card-leaders.football-team-leader-layout { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
.football-team-leader-layout .card-leader-stats { grid-template-columns: minmax(0,1fr); gap: 5px; }
.football-team-leader-layout .leader-chip { display: grid; grid-template-columns: 30px minmax(0,1fr) auto; align-items: center; gap: 6px; min-width: 0; }
.football-team-leader-layout .leader-headshot { width: 28px; height: 28px; }
.football-team-leader-layout .leader-copy { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; gap: 2px; }
.football-team-leader-layout .leader-label { font-size: 9px; line-height: 1.1; }
.football-team-leader-layout .leader-name { display: block; max-width: none; white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; font-size: 10px; line-height: 1.2; }
.football-team-leader-layout .leader-number { font-size: 11px; white-space: nowrap; }
.right-football-leader-team { display: grid; gap: 5px; min-width: 0; padding: 1px 0 7px; }
.right-football-leader-team + .right-football-leader-team { padding-top: 7px; border-top: 1px solid rgba(255,255,255,.09); }
.right-football-team-heading { color: rgba(239,241,248,.82); font-size: 10px; font-weight: 850; letter-spacing: .08em; }
.right-football-leader-team .right-player-card { grid-template-columns: 42px minmax(0,1fr); min-height: 54px; padding: 5px; }
.right-football-leader-team .right-player-headshot, .right-football-leader-team .right-player-headshot-fallback { width: 40px; height: 44px; }
:root[data-theme="light"] .right-football-team-heading { color: #111317; }
:root[data-theme="light"] .right-football-leader-team + .right-football-leader-team { border-top-color: rgba(25,27,30,.15); }

/* Fluid desktop type: increase readability on wide displays without changing compact layouts. */
@media (min-width: 1440px) {
  .header .title-main { font-size: clamp(15px,.88vw,19px); }
  .sidebar-heading, .sidebar-secondary-heading { font-size: clamp(12px,.72vw,15px); }
  .league-link { min-height: clamp(35px,2.45vw,48px); font-size: clamp(12px,.72vw,15px); }
  .main-view-tab { min-height: clamp(36px,2.45vw,48px); font-size: clamp(12px,.72vw,15px); }
  .card { padding: clamp(11px,.78vw,16px); gap: clamp(7px,.52vw,11px); }
  .card-top .status, .card-top .tag { font-size: clamp(10px,.62vw,13px); }
  .stats-pill-hint.open-match-pill { min-height: clamp(28px,1.8vw,34px); padding-inline: clamp(10px,.7vw,15px); font-size: clamp(11px,.68vw,14px); }
  .team .abbr { font-size: clamp(12px,.78vw,16px); }
  .team .record { font-size: clamp(10px,.62vw,13px); }
  .score { min-width: clamp(34px,2.3vw,46px); font-size: clamp(23px,1.5vw,31px); }
  .card-leaders { gap: clamp(6px,.45vw,10px); font-size: clamp(11px,.68vw,14px); }
  .card-leader-heading { font-size: clamp(10px,.62vw,13px); }
  .leader-name { font-size: clamp(11px,.69vw,14px); }
  .leader-label { font-size: clamp(9px,.56vw,12px); }
  .leader-number { font-size: clamp(12px,.74vw,15px); }
  .right-rail-heading { font-size: clamp(13px,.78vw,16px); }
  .right-player-copy .right-player-fullname { font-size: clamp(12px,.74vw,15px); }
  .right-player-copy .right-player-meta { font-size: clamp(10px,.62vw,13px); }
  .right-team-stat-value { font-size: clamp(12px,.74vw,15px); }
  .right-team-stat-label { font-size: clamp(9px,.58vw,12px); }
  .featured-game { padding: clamp(14px,1vw,20px); gap: clamp(10px,.75vw,15px); }
  .featured-name { font-size: clamp(13px,.82vw,17px); }
  .featured-score { font-size: clamp(25px,1.6vw,34px); }
  .featured-status, .featured-record, .featured-vs { font-size: clamp(10px,.62vw,13px); }
  .standings-row, .playoff-team-copy strong { font-size: clamp(11px,.7vw,14px); }
  .playoff-team-copy span, .playoff-status { font-size: clamp(10px,.6vw,12px); }
}
@media (min-width: 1920px) {
  .dashboard-layout { gap: clamp(14px,.9vw,22px); }
  .league-sidebar { padding: clamp(12px,.75vw,18px); }
  .card { border-radius: clamp(12px,.85vw,18px); }
  .team .abbr { font-size: clamp(14px,.82vw,18px); }
  .team .record { font-size: clamp(11px,.64vw,14px); }
  .score { font-size: clamp(26px,1.55vw,36px); }
  .stats-pill-hint.open-match-pill { font-size: clamp(12px,.7vw,15px); }
  .leader-name { font-size: clamp(12px,.72vw,16px); }
  .right-player-card { min-height: clamp(66px,4.3vw,90px); }
  .right-player-headshot { width: clamp(50px,3.25vw,68px); height: clamp(54px,3.6vw,76px); }
  .right-player-copy .right-player-fullname { font-size: clamp(13px,.78vw,17px); }
  .right-player-copy .right-player-meta { font-size: clamp(11px,.64vw,14px); }
}



/* Live dashboard: keep standings and playoff navigation in the vertical rail only. */
.main-view-tabs { display: none !important; }

/* Small cards: no player photos; the details/profile screens retain headshots. */
.card-leaders .leader-headshot { display: none !important; }

/* Pinned-game affordance and custom right-click menu. */
.card.pinned-game-card { border-color: rgba(245, 190, 85, .46); box-shadow: 0 0 0 1px rgba(245, 190, 85, .10), var(--card-shadow, 0 7px 18px rgba(0,0,0,.14)); }
.card-pinned-badge {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  padding: 3px 6px; border: 1px solid rgba(245,190,85,.28); border-radius: 99px;
  background: rgba(245,190,85,.12); color: #edc36f; font-size: 7px; line-height: 1;
  font-weight: 900; letter-spacing: .07em;
}
.card-pinned-badge[hidden] { display: none !important; }
.game-context-menu {
  position: fixed; z-index: 100000; display: grid; gap: 3px; min-width: 184px;
  padding: 5px; border: 1px solid rgba(255,255,255,.15); border-radius: 10px;
  background: rgba(24,27,35,.97); color: #f4f5f8;
  box-shadow: 0 12px 32px rgba(0,0,0,.38); backdrop-filter: blur(16px);
  -webkit-app-region: no-drag;
}
.game-context-menu-item {
  display: block; width: 100%; min-height: 34px; padding: 7px 10px; border: 0;
  border-radius: 7px; background: transparent; color: inherit; text-align: left;
  font: inherit; font-size: 11px; font-weight: 700; cursor: pointer;
  -webkit-app-region: no-drag;
}
.game-context-menu-item:hover, .game-context-menu-item:focus-visible { background: rgba(145,121,255,.22); outline: none; }
:root[data-theme="light"] .game-context-menu {
  border-color: rgba(30,34,40,.16); background: rgba(250,250,252,.98); color: #202329;
  box-shadow: 0 12px 32px rgba(0,0,0,.18);
}
:root[data-theme="light"] .card-pinned-badge { color: #855b05; background: rgba(221,165,42,.13); border-color: rgba(175,126,16,.24); }

/* Playoff logos are intentionally compact and cannot grow with their source image. */
.playoff-row { grid-template-columns: 30px 24px minmax(0,1fr) auto; }
.playoff-team-logo-frame { width: 24px !important; height: 24px !important; min-width: 24px; max-width: 24px; flex: 0 0 24px !important; overflow: hidden; }
.playoff-team-logo { width: 100% !important; height: 100% !important; max-width: 24px; max-height: 24px; object-fit: contain; }
.playoff-team-logo-frame .team-logo-fallback { font-size: 7px; }

/* Pinned matchups occupy the large featured slot above the live score grid. */
.featured-heading { min-height: 20px; }
.featured-pinned-dot { background: #e9b84f; box-shadow: 0 0 0 4px rgba(233,184,79,.13); }
.featured-unpin {
  margin-left: auto; min-height: 22px; padding: 0 9px; border-radius: 7px;
  border: 1px solid rgba(233,184,79,.30); background: rgba(233,184,79,.11);
  color: #f0ce82; font: inherit; font-size: 8px; font-weight: 850; letter-spacing: .08em;
  cursor: pointer;
}
.featured-unpin:hover { background: rgba(233,184,79,.22); }
:root[data-theme="light"] .featured-unpin { color: #805d12; border-color: rgba(145,103,14,.25); }



/* Hide player and team statistics unless the selected feed has an active game. */
.right-rail[hidden] { display: none !important; }
.dashboard-layout.right-rail-hidden { grid-template-columns: 54px 208px minmax(0,1fr); }

/* Add readable labels beneath the main navigation rail icons. */
.app-rail { gap: 6px; padding: 10px 4px; }
.rail-btn {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  width: 100%; max-width: 44px; height: auto; min-height: 49px; flex: 0 0 49px;
  padding: 3px 1px; font-size: 17px; line-height: 1;
}
.rail-btn::after {
  display: block; color: inherit; font-size: 7px; font-weight: 800; line-height: 1.05;
  letter-spacing: 0; text-align: center; white-space: nowrap;
}
.rail-btn[data-home-view="scores"]::after { content: "Scores"; }
.rail-btn[data-home-view="standings"]::after { content: "Standings"; }
.rail-btn[data-home-view="playoffs"]::after { content: "Playoffs"; }
#railSettings::after { content: "Settings"; }

@media (max-width: 1180px) {
  .dashboard-layout.right-rail-hidden { grid-template-columns: 48px 185px minmax(0,1fr); }
}
@media (max-width: 900px) {
  .dashboard-layout.right-rail-hidden { grid-template-columns: 46px 178px minmax(0,1fr); }
  .rail-btn { max-width: 40px; min-height: 47px; flex-basis: 47px; }
  .rail-btn::after { font-size: 6.5px; }
}
@media (max-width: 640px) {
  .dashboard-layout.right-rail-hidden { grid-template-columns: 40px minmax(0,1fr); }
  .rail-btn { max-width: 34px; min-height: 45px; flex-basis: 45px; }
  .rail-btn::after { font-size: 6px; }
}


/* ================================================================
   Soccer Match Timeline, Tactical Formation & Lineups Polish
   ================================================================ */
.soccer-timeline-section,
.soccer-lineup-section {
  margin: 0 0 12px;
}
.soccer-timeline-list {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.soccer-event-row {
  display: grid;
  grid-template-columns: 46px 34px 44px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 10px;
  background: var(--card);
  border: 1px solid var(--card-border);
  font-size: 11.5px;
}
.soccer-event-row.kind-goal,
.soccer-event-row.kind-penalty-goal {
  border-color: rgba(48, 209, 88, 0.38);
  background: rgba(48, 209, 88, 0.09);
}
.soccer-event-row.kind-red-card {
  border-color: rgba(255, 69, 58, 0.42);
  background: rgba(255, 69, 58, 0.09);
}
.soccer-event-clock {
  font-weight: 800;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
  font-size: 11px;
}
.soccer-event-icon {
  font-size: 12px;
  text-align: center;
}
.soccer-event-team {
  font-size: 10px;
  font-weight: 800;
  color: var(--muted);
  letter-spacing: 0.04em;
}
.soccer-event-copy {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.soccer-event-player {
  font-size: 12px;
  font-weight: 750;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.soccer-event-sub {
  font-size: 10.5px;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.soccer-lineup-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(165px, 1fr));
  gap: 6px;
  margin-bottom: 8px;
}
.soccer-lineup-player {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
  padding: 6px 9px;
  border-radius: 9px;
  background: var(--card);
  border: 1px solid var(--card-border);
  font-size: 11px;
}
.soccer-player-num {
  color: var(--muted);
  font-weight: 800;
  font-size: 10px;
  font-variant-numeric: tabular-nums;
}
.soccer-player-name {
  color: var(--text);
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.soccer-player-pos {
  color: var(--faint);
  font-size: 9.5px;
  font-weight: 750;
}


/* ================================================================
   Football Card Leaders: Last Name + Compact Stat Line (No Clipping)
   ================================================================ */
.card-leaders.football-team-leader-layout .football-card-leader-side {
  overflow: hidden !important;
  padding: 6px 7px !important;
}
.card-leaders.football-team-leader-layout .football-card-leader-side .card-leader-heading {
  font-size: 8.5px !important;
  margin-bottom: 4px !important;
  align-self: flex-start !important;
  text-align: left !important;
}
.card-leaders.football-team-leader-layout .football-card-leader-side .card-leader-stats {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  width: 100% !important;
  min-width: 0 !important;
}
.card-leaders.football-team-leader-layout .football-card-leader-side .leader-chip.football-stat-row {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 1px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow: hidden !important;
  padding: 1px 0 !important;
}
.card-leaders.football-team-leader-layout .football-card-leader-side .football-leader-lastname {
  display: block !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  font-size: 9.5px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  color: var(--accent) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-align: left !important;
}
.card-leaders.football-team-leader-layout .football-card-leader-side .football-leader-statline {
  display: block !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
  font-size: 8.5px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: var(--text) !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  text-align: left !important;
  font-variant-numeric: tabular-nums;
}
@media (min-width: 1440px) {
  .card-leaders.football-team-leader-layout .football-card-leader-side .football-leader-lastname {
    font-size: clamp(9.5px, 0.58vw, 11.5px) !important;
  }
  .card-leaders.football-team-leader-layout .football-card-leader-side .football-leader-statline {
    font-size: clamp(8.5px, 0.52vw, 10.5px) !important;
  }
}


/* ================================================================
   Standings Playoff Highlighting, UFC Divisional Rankings & Player Pages
   ================================================================ */
.standings-playoff-legend {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  padding: 8px 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.09);
  font-size: 11px;
  font-weight: 700;
}
.standings-playoff-legend .legend-item.playoff { color: #52d889; }
.standings-playoff-legend .legend-item.playin { color: #ffd60a; }
.standings-playoff-legend .legend-item.relegation { color: #ff6b6b; }

.standings-row.standings-row-clinched,
.standings-row.standings-row-playoff {
  border-left: 3px solid #30d158;
  background: rgba(48, 209, 88, 0.08);
}
.standings-row.standings-row-playin {
  border-left: 3px solid #ffd60a;
  background: rgba(255, 214, 10, 0.07);
}
.standings-row.standings-row-relegation {
  border-left: 3px solid #ff453a;
  background: rgba(255, 69, 58, 0.07);
}
.standing-playoff-pill {
  margin-left: 6px;
  padding: 2px 6px;
  border-radius: 999px;
  font-size: 7.5px;
  font-weight: 850;
  letter-spacing: 0.05em;
  flex: 0 0 auto;
  text-transform: uppercase;
}
.standing-playoff-pill.pill-clinched,
.standing-playoff-pill.pill-playoff {
  background: rgba(48, 209, 88, 0.20);
  color: #52d889;
  border: 1px solid rgba(48, 209, 88, 0.35);
}
.standing-playoff-pill.pill-playin {
  background: rgba(255, 214, 10, 0.18);
  color: #ffd60a;
  border: 1px solid rgba(255, 214, 10, 0.35);
}
.standing-playoff-pill.pill-relegation {
  background: rgba(255, 69, 58, 0.18);
  color: #ff6b6b;
  border: 1px solid rgba(255, 69, 58, 0.35);
}

/* UFC Divisional Rankings & Weight Class Filter in Standings */
.ufc-weight-filter-bar {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.09);
}
.ufc-weight-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ufc-divisions-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr));
  gap: 12px;
  align-content: start;
}
.ufc-rankings-header,
.ufc-fighter-row {
  grid-template-columns: 32px minmax(0, 1fr) 74px 44px !important;
}
.ufc-fighter-row {
  min-height: 42px !important;
  padding: 5px 7px !important;
  cursor: pointer;
}
.ufc-rank-badge.is-champ {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 6px;
  background: rgba(255, 214, 10, 0.22);
  color: #ffd60a !important;
  border: 1px solid rgba(255, 214, 10, 0.45);
  font-weight: 900;
}
.ufc-fighter-avatar,
.ufc-fighter-avatar-fallback {
  width: 30px !important;
  height: 30px !important;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255, 255, 255, 0.09);
  flex: 0 0 30px;
}
.ufc-fighter-avatar-fallback {
  display: inline-grid;
  place-items: center;
  font-size: 10px;
  font-weight: 800;
  color: var(--text);
}
.ufc-fighter-name-wrap {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 1px;
}
.ufc-fighter-nickname {
  font-size: 8.5px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* UFC Fight Detail Fighter Profile Cards */
.ufc-fighters-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
  margin-top: 8px;
}
.ufc-fighter-profile-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--card);
  border: 1px solid var(--card-border);
  text-align: left;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
.ufc-fighter-profile-card:hover {
  background: var(--hover);
  border-color: var(--accent);
  transform: translateY(-1px);
}
.ufc-fighter-card-headshot {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255, 255, 255, 0.08);
  flex: 0 0 56px;
}
.ufc-fighter-card-info {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.ufc-fighter-card-name {
  font-size: 14px;
  font-weight: 800;
  color: var(--text);
}
.ufc-fighter-card-record {
  font-size: 11px;
  color: var(--muted);
}
.ufc-fighter-card-cta {
  font-size: 10px;
  font-weight: 800;
  color: var(--accent);
  margin-top: 2px;
}

/* Soccer Lineup Headshots & Clickable Player Cards */
.soccer-lineup-player {
  text-align: left;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.soccer-lineup-player:hover {
  background: var(--hover);
  border-color: var(--accent);
}
.soccer-player-headshot {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255, 255, 255, 0.08);
}

/* Keep finished games on a separate row below all live games */
#list > .finished-queue-heading {
    grid-column: 1 / -1 !important;
    width: 100%;
    box-sizing: border-box;
}

/* Card header responsive wrapping fix */
.card-top {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    height: auto !important;
    min-height: 16px;
    row-gap: 5px !important;
    overflow: visible !important;
    width: 100%;
    box-sizing: border-box;
}

.card-top > .status {
    min-width: 0;
    white-space: nowrap;
    flex: 0 1 auto;
}

.card-top > .stats-pill-hint.open-match-pill {
    flex: 0 0 auto;
    margin-left: auto;
}

.card-top > .tag,
.card-top > .card-pinned-badge {
    flex: 0 0 auto;
}

.card-top > .game-watch-btn {
    flex: 0 0 auto;
    min-width: 68px !important;
    margin-left: auto;
}

/* Featured WATCH LIVE unavailable state */
.featured-watch:disabled,
.featured-watch.stream-unavailable {
    background: rgba(125, 130, 140, 0.16) !important;
    border-color: rgba(160, 165, 175, 0.22) !important;
    color: rgba(210, 215, 225, 0.48) !important;
    opacity: 0.62;
    filter: grayscale(1);
    cursor: not-allowed !important;
    pointer-events: none !important;
    box-shadow: none !important;
    transform: none !important;
}

.featured-watch.stream-available:not(:disabled) {
    background: rgba(44, 207, 111, 0.15);
    border-color: rgba(44, 207, 111, 0.27);
    color: #f8f8ff;
    opacity: 1;
    filter: none;
    cursor: pointer;
    pointer-events: auto;
}

/* Live catalog test: disabled featured Watch button */
.featured-watch:disabled,
.featured-watch.stream-unavailable {
    background: rgba(125, 130, 140, 0.16) !important;
    border-color: rgba(160, 165, 175, 0.22) !important;
    color: rgba(210, 215, 225, 0.48) !important;
    opacity: 0.62;
    filter: grayscale(1);
    cursor: not-allowed !important;
    pointer-events: none !important;
    box-shadow: none !important;
    transform: none !important;
}

.featured-watch.stream-available:not(:disabled) {
    background: rgba(44, 207, 111, 0.15);
    border-color: rgba(44, 207, 111, 0.27);
    color: #f8f8ff;
    opacity: 1;
    filter: none;
    cursor: pointer;
    pointer-events: auto;
}

/* All Sports Streams live catalog events */
.watch-stage.live-catalog-mode {
    display: block !important;
    position: relative;
    overflow: hidden;
    padding: 0;
    text-align: left;
}

.watch-stage.live-catalog-mode .watch-launcher-icon,
.watch-stage.live-catalog-mode .watch-launcher-title {
    display: none !important;
}

.watch-stage.live-catalog-mode .watch-status {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 3;
    max-width: none;
    margin: 0;
    padding: 12px 16px 9px;
    text-align: left;
    background: #171a20;
    border-bottom: 1px solid var(--card-border);
    box-sizing: border-box;
}

.live-catalog-events {
    position: absolute;
    inset: 49px 0 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr));
    align-content: start;
    gap: 8px;
    padding: 12px;
    overflow-y: auto;
    box-sizing: border-box;
}

.live-catalog-list-heading {
    grid-column: 1 / -1;
    color: var(--muted);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .08em;
    padding: 2px 3px 5px;
}

.live-catalog-event {
    display: grid;
    grid-template-columns: 27px minmax(0,1fr) auto;
    align-items: center;
    gap: 9px;
    min-width: 0;
    width: 100%;
    min-height: 58px;
    padding: 9px 11px;
    color: var(--text);
    text-align: left;
    background: rgba(255,255,255,.045);
    border: 1px solid var(--card-border);
    border-radius: 9px;
    cursor: pointer;
}

.live-catalog-event:hover,
.live-catalog-event.selected {
    background: rgba(75,130,220,.14);
    border-color: var(--accent);
}

.live-catalog-event-number {
    display: grid;
    place-items: center;
    width: 25px;
    height: 25px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 850;
    border-radius: 7px;
    background: rgba(255,255,255,.075);
}

.live-catalog-event-copy {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.live-catalog-event-title {
    color: var(--text);
    font-size: 11px;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.live-catalog-event-meta {
    color: var(--muted);
    font-size: 9px;
    line-height: 1.35;
}

.live-catalog-event-status {
    color: var(--muted);
    font-size: 8px;
    font-weight: 850;
    white-space: nowrap;
}

.live-catalog-event-status.has-streams {
    color: #68d99a;
}

.live-catalog-empty {
    grid-column: 1 / -1;
    padding: 20px;
    color: var(--muted);
    text-align: center;
}

/* NFL RedZone channel tile */
.nfl-redzone-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 11px;
    min-height: 132px;
    padding: 14px;
    border-color: rgba(235, 74, 74, .42);
    background: linear-gradient(145deg, rgba(105, 30, 35, .18), rgba(255,255,255,.025));
}

.nfl-redzone-card .card-top {
    display: flex;
    align-items: center;
    gap: 8px;
}

.nfl-redzone-title {
    font-size: 14px;
    font-weight: 950;
    letter-spacing: .06em;
}

.nfl-redzone-description {
    color: var(--muted);
    font-size: 10px;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.nfl-redzone-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.nfl-redzone-btn {
    padding: 8px 11px;
    border: 1px solid var(--card-border);
    border-radius: 7px;
    background: rgba(255,255,255,.07);
    color: var(--text);
    font-size: 9px;
    font-weight: 900;
    cursor: pointer;
}

.nfl-redzone-btn.primary {
    border-color: rgba(85, 180, 125, .55);
    background: rgba(35, 130, 75, .24);
}

.nfl-redzone-btn:disabled {
    opacity: .55;
    cursor: wait;
}

.nfl-redzone-btn:hover:not(:disabled) {
    filter: brightness(1.2);
}

/* Home sport columns - chronological layout */
.home-sports-layout {
    display: flex;
    flex-direction: column;
    gap: 22px;
    grid-column: 1 / -1;
    width: 100%;
    min-width: 0;
}

.home-sport-section {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    min-width: 0;
}

.home-sport-section-heading {
    padding: 0 2px 7px;
    border-bottom: 1px solid var(--card-border);
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .12em;
}

.home-sport-columns {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 285px), 1fr));
    align-items: start;
    gap: 12px;
    width: 100%;
    min-width: 0;
}

.home-sport-column {
    display: flex;
    flex-direction: column;
    gap: 9px;
    min-width: 0;
    padding: 11px;
    border: 1px solid var(--card-border);
    border-radius: 11px;
    background: rgba(255,255,255,.025);
}

.home-sport-column-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 2px 2px 9px;
    border-bottom: 1px solid var(--card-border);
    color: var(--text);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .045em;
}

.home-sport-count {
    display: grid;
    place-items: center;
    min-width: 23px;
    height: 21px;
    padding: 0 6px;
    border-radius: 6px;
    background: rgba(255,255,255,.08);
    color: var(--muted);
    font-size: 10px;
    font-weight: 850;
}

.home-sport-subheading {
    padding: 4px 2px 0;
    color: var(--muted);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .1em;
}

.home-sport-date-group {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.home-sport-date-heading {
    color: var(--muted);
    font-size: 9px;
    font-weight: 850;
}

.home-sport-date-cards {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.home-sport-column .card {
    width: 100%;
    min-width: 0;
    margin: 0;
}

.home-sport-empty {
    padding: 15px 4px;
    color: var(--muted);
    font-size: 10px;
    text-align: center;
}

/* Home horizontal game layout */

/* Keep each sport as a full-width row inside its section. */
.home-sport-columns,
.home-sport-columns-college {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    width: 100%;
}

/* Each sport gets the full available width. */
.home-sport-column {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

/* Games within each date are displayed horizontally. */
.home-sport-date-cards {
    display: grid;
    grid-template-columns: repeat(
        auto-fill,
        minmax(min(100%, 300px), 1fr)
    );
    grid-auto-flow: row;
    align-items: start;
    gap: 10px;
    width: 100%;
    min-width: 0;
}

/* Cards fill their own horizontal grid cell. */
.home-sport-date-cards > .card {
    width: 100%;
    min-width: 0;
    margin: 0;
    box-sizing: border-box;
}

@media (max-width: 700px) {
    .home-sport-date-cards {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* GLASS SCORES - LARGE DISPLAY ROSTER READABILITY */
@media (min-width: 1200px) {
  #statsDrawer .pregame-season-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
  }

  #statsDrawer .pregame-season-table thead th {
    height: 36px;
    padding: 8px 7px !important;
    font-size: 12px !important;
    font-weight: 850;
  }

  #statsDrawer .pregame-season-table tbody td {
    height: 58px;
    padding: 8px 7px !important;
    font-size: 13px !important;
  }

  #statsDrawer .pregame-season-table .boxscore-headshot {
    width: 40px !important;
    height: 40px !important;
    flex: 0 0 40px !important;
  }

  #statsDrawer .pregame-season-table .pregame-player-name {
    font-size: 13px !important;
    line-height: 1.25;
  }

  #statsDrawer .pregame-season-table .pregame-player-meta {
    font-size: 10px !important;
    line-height: 1.25;
  }

  #statsDrawer .pregame-season-table .boxscore-player-identity {
    gap: 4px;
  }

  #statsDrawer .pregame-season-table .pregame-season-value {
    font-size: 13px !important;
    font-weight: 800;
  }

  #statsDrawer .stat-group-title {
    font-size: 13px;
    line-height: 1.3;
    margin: 13px 0 7px;
  }

  #statsDrawer .stat-scroll-hint {
    font-size: 11px;
  }
}

@media (min-width: 1600px) {
  #statsDrawer .pregame-season-table thead th {
    font-size: 13px !important;
    height: 40px;
  }

  #statsDrawer .pregame-season-table tbody td {
    font-size: 14px !important;
    height: 62px;
  }

  #statsDrawer .pregame-season-table .pregame-player-name {
    font-size: 14px !important;
  }

  #statsDrawer .pregame-season-table .pregame-player-meta {
    font-size: 11px !important;
  }

  #statsDrawer .pregame-season-table .pregame-season-value {
    font-size: 14px !important;
  }
}
/* GLASS SCORES - LARGE DISPLAY LIVE BOXSCORE */
@media (min-width: 1000px) {

  #statsDrawer .compact-stat-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overflow-y: auto !important;
  }

  #statsDrawer .compact-stat-table {
    font-size: 14px !important;
    font-variant-numeric: tabular-nums;
  }

  #statsDrawer .compact-stat-table thead th {
    height: 40px;
    padding: 9px 7px !important;
    font-size: 12px !important;
    font-weight: 850;
    letter-spacing: .035em;
  }

  #statsDrawer .compact-stat-table tbody td {
    height: 66px;
    padding: 9px 8px !important;
    font-size: 14px !important;
    line-height: 1.25;
  }

  #statsDrawer .compact-stat-table .boxscore-player-cell {
    display: flex !important;
    align-items: center;
    gap: 10px;
  }

  #statsDrawer .compact-stat-table .boxscore-headshot {
    width: 44px !important;
    height: 44px !important;
    margin-right: 0 !important;
    flex: 0 0 44px !important;
    border-radius: 50%;
    object-fit: cover;
  }

  #statsDrawer .compact-stat-table .boxscore-player-identity {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    width: calc(100% - 54px);
    max-width: calc(100% - 54px);
    min-width: 0;
  }

  #statsDrawer .compact-stat-table .boxscore-player-name {
    font-size: 15px !important;
    line-height: 1.2;
    font-weight: 800;
  }

  #statsDrawer .compact-stat-table .boxscore-player-meta {
    font-size: 11px !important;
    line-height: 1.2;
  }

  #statsDrawer .compact-stat-table .boxscore-jersey {
    font-size: 11px !important;
  }

  #statsDrawer .stat-group-title {
    font-size: 14px !important;
    line-height: 1.35;
    margin: 14px 0 8px;
  }

  #statsDrawer .stat-scroll-hint {
    font-size: 11px !important;
    line-height: 1.3;
  }

  #statsDrawer .boxscore-team-summary {
    padding: 12px;
    margin-bottom: 12px;
  }

  #statsDrawer .boxscore-team-summary-title {
    font-size: 11px !important;
    margin-bottom: 9px;
  }

  #statsDrawer .boxscore-team-stat {
    flex-basis: 76px;
    min-height: 55px;
    gap: 5px;
  }

  #statsDrawer .boxscore-team-stat-value {
    font-size: 16px !important;
  }

  #statsDrawer .boxscore-team-stat-label {
    max-width: 72px;
    font-size: 10px !important;
    line-height: 1.15;
  }
}

@media (min-width: 1600px) {
  #statsDrawer .compact-stat-table thead th {
    font-size: 13px !important;
    height: 44px;
  }

  #statsDrawer .compact-stat-table tbody td {
    font-size: 15px !important;
    height: 72px;
  }

  #statsDrawer .compact-stat-table .boxscore-player-name {
    font-size: 16px !important;
  }

  #statsDrawer .compact-stat-table .boxscore-player-meta {
    font-size: 12px !important;
  }

  #statsDrawer .compact-stat-table .boxscore-headshot {
    width: 48px !important;
    height: 48px !important;
    flex-basis: 48px !important;
  }
}
/* GLASS SCORES - SOCCER MATCH BOX SCORE */
#statsDrawer .soccer-team-stats-section {
  width: 100%;
  min-width: 0;
  margin: 10px 0 16px;
}

#statsDrawer .soccer-team-stats-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
}

#statsDrawer .soccer-team-stats-table {
  width: 100%;
  min-width: 380px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}

#statsDrawer .soccer-team-stats-table th,
#statsDrawer .soccer-team-stats-table td {
  height: 42px;
  padding: 8px 12px !important;
  font-size: 12px !important;
  font-variant-numeric: tabular-nums;
  text-align: center !important;
  white-space: nowrap;
}

#statsDrawer .soccer-team-stats-table thead th {
  background: var(--glass-solid);
  color: var(--text);
  font-weight: 850;
}

#statsDrawer .soccer-team-stats-table thead th:first-child,
#statsDrawer .soccer-team-stats-table tbody th {
  width: 40%;
  text-align: left !important;
}

#statsDrawer .soccer-team-stats-table tbody th {
  color: var(--muted);
  font-weight: 750;
}

#statsDrawer .soccer-team-stats-table tbody td {
  font-weight: 800;
  font-size: 13px !important;
}

#statsDrawer .soccer-team-stats-table tbody tr:nth-child(even) th,
#statsDrawer .soccer-team-stats-table tbody tr:nth-child(even) td {
  background: rgba(255,255,255,.035);
}

@media (min-width: 1200px) {
  #statsDrawer .soccer-team-stats-table th,
  #statsDrawer .soccer-team-stats-table td {
    height: 48px;
    padding: 10px 16px !important;
    font-size: 14px !important;
  }

  #statsDrawer .soccer-team-stats-table tbody td {
    font-size: 15px !important;
  }
}

/* GLASS SCORES - SOCCER MATCH CENTER REDESIGN */

#statsDrawer .detail-tab[hidden] {
  display: none !important;
}

#statsDrawer .pane-soccer-stats,
#statsDrawer .pane-soccer-lineups,
#statsDrawer .pane-soccer-timeline,
#statsDrawer .pane-soccer-players {
  display: none !important;
  min-height: 0;
  flex: 1 1 auto;
  overflow: hidden;
}

#statsDrawer.soccer-game .detail-tabs {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 6px;
  padding: 8px 12px;
}

#statsDrawer.soccer-game .detail-tab {
  min-width: 0;
  min-height: 36px;
  padding: 7px 5px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#statsDrawer.soccer-game .stats-team-tabs {
  display: none !important;
}

#statsDrawer.soccer-game[data-view="box"] .pane:not(.pane-box),
#statsDrawer.soccer-game[data-view="soccer-stats"] .pane:not(.pane-soccer-stats),
#statsDrawer.soccer-game[data-view="soccer-lineups"] .pane:not(.pane-soccer-lineups),
#statsDrawer.soccer-game[data-view="soccer-timeline"] .pane:not(.pane-soccer-timeline),
#statsDrawer.soccer-game[data-view="soccer-players"] .pane:not(.pane-soccer-players),
#statsDrawer.soccer-game[data-view="watch"] .pane:not(.pane-watch) {
  display: none !important;
}

#statsDrawer.soccer-game[data-view="box"] .pane-box,
#statsDrawer.soccer-game[data-view="soccer-stats"] .pane-soccer-stats,
#statsDrawer.soccer-game[data-view="soccer-lineups"] .pane-soccer-lineups,
#statsDrawer.soccer-game[data-view="soccer-timeline"] .pane-soccer-timeline,
#statsDrawer.soccer-game[data-view="soccer-players"] .pane-soccer-players,
#statsDrawer.soccer-game[data-view="watch"] .pane-watch {
  display: flex !important;
  flex-direction: column;
  min-height: 0;
}

/* Match overview */

.soccer-overview-scorecard {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  padding: 20px 16px;
  margin-bottom: 14px;
  border: 1px solid var(--card-border);
  border-radius: 14px;
  background: var(--card);
}

.soccer-overview-team {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  gap: 5px;
  text-align: center;
}

.soccer-overview-logo {
  width: 58px;
  height: 58px;
  object-fit: contain;
}

.soccer-overview-team-name {
  font-size: 15px;
  font-weight: 850;
}

.soccer-overview-abbr {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.soccer-overview-score {
  font-size: 31px;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
}

.soccer-overview-status {
  grid-column: 2;
  grid-row: 1;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-align: center;
  white-space: nowrap;
}

.soccer-overview-details {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 16px;
}

.soccer-overview-detail {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: var(--card);
  min-width: 0;
}

.soccer-overview-detail-label {
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .06em;
}

.soccer-overview-detail-value {
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.soccer-overview-highlights {
  margin: 10px 0 16px;
}

.soccer-highlight-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

.soccer-highlight-card {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
  padding: 13px;
  border: 1px solid var(--card-border);
  border-radius: 11px;
  background: var(--card);
}

.soccer-highlight-label {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

.soccer-highlight-value {
  font-size: 20px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.soccer-highlight-teams {
  color: var(--muted);
  font-size: 9px;
}

.soccer-overview-event {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 40px;
  padding: 9px 10px;
  border-bottom: 1px solid var(--card-border);
}

.soccer-overview-event-time,
.soccer-overview-event-team {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.soccer-pane-heading {
  padding: 12px 0 15px;
}

.soccer-pane-heading h2 {
  margin: 5px 0;
  font-size: 22px;
  font-weight: 900;
}

/* Team statistics */

.soccer-stats-table-wrap,
.soccer-player-stats-wrap {
  width: 100%;
  max-width: 100%;
  overflow: auto;
}

.soccer-stats-table {
  width: 100%;
  min-width: 440px;
  table-layout: fixed;
}

.soccer-stats-table th,
.soccer-stats-table td {
  height: 45px;
  padding: 9px 14px !important;
  font-size: 13px !important;
  font-variant-numeric: tabular-nums;
  text-align: center !important;
}

.soccer-stats-table thead th {
  font-weight: 900;
  background: var(--card);
}

.soccer-stats-table thead th:first-child,
.soccer-stats-table tbody th {
  width: 42%;
  text-align: left !important;
}

.soccer-stats-table tbody th {
  font-weight: 750;
}

.soccer-stats-table tbody td {
  font-weight: 900;
}

.soccer-stats-table tbody tr:nth-child(even) {
  background: rgba(255,255,255,.035);
}

/* Lineups */

.soccer-lineup-team {
  padding: 14px;
  margin-bottom: 14px;
  border: 1px solid var(--card-border);
  border-radius: 12px;
  background: var(--card);
}

.soccer-lineup-team-title {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 14px;
}

.soccer-lineup-team-logo {
  width: 30px;
  height: 30px;
  object-fit: contain;
}

.soccer-lineup-team-title strong {
  font-size: 15px;
  font-weight: 900;
}

.soccer-lineup-team-title span {
  margin-left: auto;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
}

.soccer-lineup-player-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 16px;
}

.soccer-lineup-player-card {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  min-height: 56px;
  padding: 8px;
  border: 1px solid var(--card-border);
  border-radius: 9px;
  background: rgba(255,255,255,.035);
  color: var(--text);
  text-align: left;
  cursor: pointer;
}

.soccer-lineup-player-card:hover {
  background: rgba(255,255,255,.09);
}

.soccer-lineup-player-image,
.soccer-lineup-player-placeholder {
  width: 37px;
  height: 37px;
  flex: 0 0 37px;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255,255,255,.08);
}

.soccer-lineup-player-placeholder {
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 900;
}

.soccer-lineup-player-copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 4px;
}

.soccer-lineup-player-copy strong {
  font-size: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.soccer-lineup-player-copy span {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.25;
}

/* Timeline */

.soccer-match-timeline {
  display: flex;
  flex-direction: column;
  gap: 7px;
  max-width: 1000px;
}

.soccer-match-event {
  display: grid;
  grid-template-columns: 65px 35px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 10px 12px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: var(--card);
}

.soccer-match-event-clock {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

.soccer-match-event-icon {
  display: grid;
  place-items: center;
  font-size: 17px;
}

.soccer-match-event-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  font-size: 12px;
}

.soccer-match-event-team,
.soccer-match-event-detail {
  color: var(--muted);
  font-size: 10px;
}

.soccer-event-goal,
.soccer-event-penalty-goal {
  border-left: 3px solid #30d158;
}

.soccer-event-red-card {
  border-left: 3px solid #ff453a;
}

.soccer-event-yellow-card {
  border-left: 3px solid #ffd60a;
}

/* Player statistics */

.soccer-player-stats-team {
  margin-bottom: 22px;
}

.soccer-player-stats-team-title {
  padding: 12px 0;
  font-size: 14px;
  font-weight: 900;
}

.soccer-player-stats-table {
  min-width: max-content;
}

.soccer-player-stats-table th,
.soccer-player-stats-table td {
  min-width: 64px;
  height: 42px;
  padding: 7px 9px !important;
  font-size: 11px !important;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.soccer-player-stats-table th:first-child,
.soccer-player-stats-table td:first-child {
  position: sticky;
  left: 0;
  z-index: 1;
  min-width: 180px;
  text-align: left;
  background: var(--card);
}

.soccer-player-stats-name {
  white-space: nowrap;
  font-weight: 800;
}

.soccer-player-stats-headshot {
  width: 28px;
  height: 28px;
  margin-right: 7px;
  vertical-align: middle;
  border-radius: 50%;
  object-fit: cover;
}

.soccer-match-leaders-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.soccer-match-leader-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 13px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: var(--card);
  color: var(--text);
  text-align: left;
  cursor: pointer;
}

.soccer-match-leader-team {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
}

.soccer-match-leader-value {
  font-size: 19px;
  font-weight: 900;
}

/* Large displays */

@media (min-width: 1400px) {
  #statsDrawer.soccer-game .detail-tab {
    min-height: 40px;
    font-size: 13px;
  }

  .soccer-overview-team-name {
    font-size: 17px;
  }

  .soccer-overview-logo {
    width: 68px;
    height: 68px;
  }

  .soccer-stats-table th,
  .soccer-stats-table td {
    height: 51px;
    font-size: 14px !important;
  }

  .soccer-lineup-player-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Narrow screens */

@media (max-width: 760px) {
  #statsDrawer.soccer-game .detail-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .soccer-overview-details,
  .soccer-highlight-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .soccer-lineup-player-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .soccer-overview-scorecard {
    gap: 6px;
    padding: 12px 7px;
  }

  .soccer-overview-team-name {
    font-size: 11px;
  }

  .soccer-overview-logo {
    width: 40px;
    height: 40px;
  }

  .soccer-overview-score {
    font-size: 23px;
  }

  .soccer-match-leaders-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* GLASS SCORES - MMA DIVISION HEADING READABILITY */

/* Show all rankings in a clean responsive grid. */

.ufc-divisions-grid {
  display: grid;
  grid-template-columns: repeat(
    auto-fit,
    minmax(min(100%, 420px), 1fr)
  );
  align-items: start;
  gap: 18px;
  width: 100%;
}

.ufc-rankings-group {
  min-width: 0;
  width: 100%;
}

/* More visible division and weight-class headings. */

.ufc-rankings-group > .standings-group-title {
  display: flex;
  align-items: center;
  min-height: 54px;
  margin: 0 0 13px !important;
  padding: 15px 18px !important;

  color: var(--text);
  font-size: clamp(18px, 1.4vw, 25px) !important;
  font-weight: 950 !important;
  line-height: 1.2;
  letter-spacing: .045em;
  text-transform: uppercase;

  white-space: normal;
  overflow-wrap: anywhere;

  background: var(--card);
  border: 1px solid var(--card-border);
  border-left: 5px solid var(--accent, #d6b46a);
  border-radius: 10px;
}

/* Improve ranking card spacing. */

.ufc-rankings-group .ufc-rankings-table {
  width: 100%;
  min-width: 0;
}

.ufc-rankings-group .ufc-rankings-header {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .04em;
}

.ufc-rankings-group .ufc-fighter-row {
  min-height: 54px;
}

.ufc-rankings-group .ufc-fighter-avatar {
  flex: 0 0 auto;
  object-fit: cover;
}

.ufc-rankings-group .ufc-fighter-name-wrap {
  min-width: 0;
}

/* Large desktop and laptop displays. */

@media (min-width: 1200px) {
  .ufc-divisions-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }

  .ufc-rankings-group > .standings-group-title {
    min-height: 64px;
    margin-bottom: 15px !important;
    padding: 18px 21px !important;
    font-size: clamp(22px, 1.55vw, 30px) !important;
    line-height: 1.15;
    border-left-width: 6px;
  }

  .ufc-rankings-group .ufc-rankings-header {
    font-size: 12px;
  }

  .ufc-rankings-group .ufc-fighter-row {
    min-height: 61px;
  }

  .ufc-rankings-group .standing-name {
    font-size: 14px;
    font-weight: 850;
  }

  .ufc-rankings-group .standing-rank {
    font-size: 14px;
    font-weight: 900;
  }

  .ufc-rankings-group .standing-record,
  .ufc-rankings-group .standing-gb {
    font-size: 13px;
  }
}

/* Extra-wide monitors. */

@media (min-width: 1800px) {
  .ufc-divisions-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
  }

  .ufc-rankings-group > .standings-group-title {
    min-height: 72px;
    padding: 20px 24px !important;
    font-size: clamp(25px, 1.45vw, 34px) !important;
    letter-spacing: .05em;
  }

  .ufc-rankings-group .ufc-fighter-row {
    min-height: 65px;
  }

  .ufc-rankings-group .standing-name {
    font-size: 15px;
  }

  .ufc-rankings-group .ufc-fighter-avatar {
    width: 43px;
    height: 43px;
  }
}

/* Smaller screens. */

@media (max-width: 760px) {
  .ufc-divisions-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 13px;
  }

  .ufc-rankings-group > .standings-group-title {
    min-height: 45px;
    padding: 11px 13px !important;
    font-size: 16px !important;
  }
}


/* GLASS SCORES - MMA FIGHTER PROFILE REDESIGN */

#playerModalBody .ufc-profile-hero {
  display: flex;
  align-items: center;
  gap: 22px;
  width: 100%;
  min-height: 145px;
  padding: 20px;
  margin: 0 0 16px;
  border: 1px solid var(--card-border);
  border-radius: 14px;
  background: var(--card);
}

#playerModalBody .ufc-profile-headshot {
  width: 112px;
  height: 112px;
  flex: 0 0 112px;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255,255,255,.07);
  border: 2px solid var(--card-border);
}

#playerModalBody .ufc-profile-identity {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 10px;
}

#playerModalBody .ufc-profile-eyebrow {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .1em;
}

#playerModalBody .ufc-profile-name {
  margin: 0;
  font-size: clamp(23px, 2vw, 34px);
  line-height: 1.1;
  font-weight: 950;
}

#playerModalBody .ufc-profile-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

#playerModalBody .ufc-profile-badge {
  display: inline-flex;
  align-items: center;
  min-height: 27px;
  padding: 5px 10px;
  border: 1px solid var(--card-border);
  border-radius: 7px;
  background: rgba(255,255,255,.055);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .035em;
}

#playerModalBody .ufc-profile-badge.champion {
  color: #f0c75e;
  border-color: rgba(240,199,94,.4);
  background: rgba(240,199,94,.09);
}

#playerModalBody .ufc-profile-badge.ranking {
  color: #83b6ff;
  border-color: rgba(131,182,255,.35);
}

#playerModalBody .ufc-profile-badge.record {
  color: #63d99a;
  border-color: rgba(99,217,154,.35);
}

#playerModalBody .ufc-profile-tabs {
  width: 100%;
  margin: 0 0 18px;
}

#playerModalBody .ufc-profile-section-head {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 21px 0 12px;
}

#playerModalBody .ufc-profile-section-head h3 {
  margin: 0;
  font-size: 17px;
  font-weight: 950;
}

#playerModalBody .ufc-profile-section-head p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
}

/* Professional record cards */

#playerModalBody .ufc-profile-metrics,
#playerModalBody .ufc-profile-record-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 10px;
  width: 100%;
}

#playerModalBody .ufc-profile-metric {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 83px;
  min-width: 0;
  gap: 8px;
  padding: 13px;
  border: 1px solid var(--card-border);
  border-radius: 11px;
  background: var(--card);
}

#playerModalBody .ufc-profile-metric.record-card {
  border-left: 4px solid var(--accent, #d6b46a);
}

#playerModalBody .ufc-profile-metric-label {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .07em;
}

#playerModalBody .ufc-profile-metric-value {
  font-size: 21px;
  line-height: 1.15;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

/* Physical profile details */

#playerModalBody .ufc-profile-details {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

#playerModalBody .ufc-profile-detail-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 68px;
  min-width: 0;
  gap: 7px;
  padding: 12px 14px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: var(--card);
}

#playerModalBody .ufc-profile-detail-label {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

#playerModalBody .ufc-profile-detail-value {
  font-size: 14px;
  font-weight: 850;
  overflow-wrap: anywhere;
}

/* Career statistics */

#playerModalBody .ufc-profile-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(125px, 1fr));
  gap: 9px;
}

#playerModalBody .ufc-profile-stat-card {
  display: flex;
  flex-direction: column;
  min-height: 76px;
  justify-content: center;
  gap: 7px;
  padding: 12px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: var(--card);
}

#playerModalBody .ufc-profile-stat-label {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
}

#playerModalBody .ufc-profile-stat-value {
  font-size: 20px;
  font-weight: 950;
}

/* Fight history */

#playerModalBody .ufc-profile-fight-list {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

#playerModalBody .ufc-profile-fight-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  min-height: 76px;
  padding: 13px 16px;
  border: 1px solid var(--card-border);
  border-radius: 11px;
  background: var(--card);
}

#playerModalBody .ufc-profile-fight-main,
#playerModalBody .ufc-profile-fight-result {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

#playerModalBody .ufc-profile-fight-date,
#playerModalBody .ufc-profile-fight-phase {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}

#playerModalBody .ufc-profile-fight-opponent {
  font-size: 14px;
  font-weight: 900;
}

#playerModalBody .ufc-profile-result-badge {
  display: inline-flex;
  justify-content: center;
  min-width: 78px;
  padding: 6px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 950;
}

#playerModalBody .ufc-profile-result-badge.win {
  color: #65dfa0;
  background: rgba(56,190,120,.13);
}

#playerModalBody .ufc-profile-result-badge.loss {
  color: #ff8686;
  background: rgba(235,75,75,.13);
}

#playerModalBody .ufc-profile-result-badge.other {
  color: var(--text);
  background: rgba(255,255,255,.08);
}

/* Career record table */

#playerModalBody .ufc-profile-career-table-wrap {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--card-border);
  border-radius: 11px;
}

#playerModalBody .ufc-profile-career-table {
  width: 100%;
  border-collapse: collapse;
}

#playerModalBody .ufc-profile-career-table th,
#playerModalBody .ufc-profile-career-table td {
  padding: 12px 15px;
  border-bottom: 1px solid var(--card-border);
  text-align: left;
  font-size: 13px;
}

#playerModalBody .ufc-profile-career-table th {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
}

#playerModalBody .ufc-profile-career-table tbody tr:last-child td {
  border-bottom: 0;
}

#playerModalBody .ufc-profile-career-value {
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

#playerModalBody .ufc-profile-empty {
  padding: 19px;
  margin-top: 12px;
  border: 1px dashed var(--card-border);
  border-radius: 11px;
  color: var(--muted);
  background: rgba(255,255,255,.025);
  font-size: 13px;
  line-height: 1.6;
}

/* Large displays */

@media (min-width: 1200px) {
  #playerModalBody .ufc-profile-hero {
    min-height: 165px;
    padding: 24px;
    gap: 26px;
  }

  #playerModalBody .ufc-profile-headshot {
    width: 130px;
    height: 130px;
    flex-basis: 130px;
  }

  #playerModalBody .ufc-profile-details {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  #playerModalBody .ufc-profile-metric {
    min-height: 95px;
    padding: 16px;
  }

  #playerModalBody .ufc-profile-metric-value {
    font-size: 24px;
  }

  #playerModalBody .ufc-profile-detail-card {
    min-height: 80px;
    padding: 15px;
  }

  #playerModalBody .ufc-profile-detail-value {
    font-size: 16px;
  }
}

@media (min-width: 1800px) {
  #playerModalBody .ufc-profile-hero {
    min-height: 185px;
  }

  #playerModalBody .ufc-profile-headshot {
    width: 145px;
    height: 145px;
    flex-basis: 145px;
  }

  #playerModalBody .ufc-profile-metrics {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  #playerModalBody .ufc-profile-details {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  #playerModalBody .ufc-profile-section-head h3 {
    font-size: 20px;
  }
}

/* Smaller windows */

@media (max-width: 700px) {
  #playerModalBody .ufc-profile-hero {
    gap: 12px;
    padding: 13px;
  }

  #playerModalBody .ufc-profile-headshot {
    width: 76px;
    height: 76px;
    flex-basis: 76px;
  }

  #playerModalBody .ufc-profile-details {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #playerModalBody .ufc-profile-metrics,
  #playerModalBody .ufc-profile-record-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* GLASS SCORES - TEAM CENTER RECORD AND ROSTER */

.team-center-record-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(115px, 1fr));
  gap: 10px;
  width: 100%;
}

.team-center-record-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 7px;
  min-height: 76px;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: var(--card);
}

.team-center-record-card.featured {
  border-left: 4px solid var(--accent, #d6b46a);
}

.team-center-record-label {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .055em;
}

.team-center-record-value {
  font-size: 21px;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
}

.team-center-data-source {
  margin-top: 7px;
  color: var(--muted);
  font-size: 9px;
}

.team-center-roster-subtitle {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}

.team-center-roster-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid var(--card-border);
  border-radius: 11px;
  background: var(--card);
}

.team-center-roster-table {
  width: 100%;
  min-width: 450px;
  border-collapse: collapse;
  table-layout: fixed;
}

.team-center-roster-table thead th {
  height: 38px;
  padding: 9px 12px;
  color: var(--muted);
  background: rgba(255,255,255,.035);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .05em;
  text-align: left;
  border-bottom: 1px solid var(--card-border);
}

.team-center-roster-table thead th:first-child {
  width: 48%;
}

.team-center-roster-table thead th:nth-child(2) {
  width: 22%;
}

.team-center-roster-table thead th:nth-child(n+3) {
  width: 10%;
  text-align: center;
}

.team-center-roster-table tbody tr {
  min-height: 55px;
  border-bottom: 1px solid var(--card-border);
  transition: background .15s ease;
}

.team-center-roster-table tbody tr:last-child {
  border-bottom: 0;
}

.team-center-roster-table tbody tr.clickable-row {
  cursor: pointer;
}

.team-center-roster-table tbody tr.clickable-row:hover {
  background: rgba(255,255,255,.065);
}

.team-center-roster-table td {
  padding: 9px 12px;
  font-size: 12px;
  vertical-align: middle;
}

.team-center-roster-player {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.team-center-roster-headshot {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255,255,255,.06);
}

.team-center-roster-player-copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 4px;
}

.team-center-roster-player-copy strong {
  overflow: hidden;
  font-size: 12px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.team-center-roster-player-copy span {
  overflow: hidden;
  color: var(--muted);
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.team-center-roster-position {
  color: var(--muted);
  font-weight: 750;
}

.team-center-roster-gp {
  font-size: 14px !important;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  text-align: center;
}

/* Large displays */

@media (min-width: 1200px) {
  .team-center-record-grid {
    grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
    gap: 13px;
  }

  .team-center-record-card {
    min-height: 91px;
    padding: 15px 17px;
  }

  .team-center-record-label {
    font-size: 11px;
  }

  .team-center-record-value {
    font-size: 25px;
  }

  .team-center-roster-table thead th {
    height: 46px;
    font-size: 12px;
  }

  .team-center-roster-table tbody tr {
    min-height: 64px;
  }

  .team-center-roster-table td {
    padding: 11px 15px;
    font-size: 14px;
  }

  .team-center-roster-headshot {
    width: 46px;
    height: 46px;
    flex-basis: 46px;
  }

  .team-center-roster-player-copy strong {
    font-size: 14px;
  }

  .team-center-roster-player-copy span {
    font-size: 10px;
  }

  .team-center-roster-gp {
    font-size: 16px !important;
  }
}

@media (max-width: 650px) {
  .team-center-record-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .team-center-roster-table {
    min-width: 390px;
  }

  .team-center-roster-table thead th:first-child {
    width: 55%;
  }

  .team-center-roster-table thead th:nth-child(2) {
    width: 27%;
  }

  .team-center-roster-table thead th:last-child {
    width: 18%;
  }
}


/* GLASS SCORES - PROGRAM-WIDE LARGE DISPLAY READABILITY V2 */

/* Preserve the existing visual design while improving readability. */

/* ==========================================================
   DESKTOP: 1200px AND ABOVE
========================================================== */

@media (min-width: 1200px) {

  body {
    font-size: 14px;
    line-height: 1.45;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }

  button,
  input,
  select,
  textarea {
    font-family: inherit;
  }

  /* Navigation */

  .sidebar-heading,
  .sidebar-secondary-heading {
    font-size: 12px !important;
    line-height: 1.4;
    letter-spacing: .045em;
  }

  .league-link {
    min-height: 43px;
    font-size: 13px !important;
    line-height: 1.4;
  }

  .league-mark {
    font-size: 19px;
  }

  .sidebar-footer-note {
    font-size: 11px !important;
    line-height: 1.5;
  }

  .rail-btn {
    min-width: 42px;
    min-height: 42px;
  }

  .main-view-tab {
    min-height: 42px;
    padding: 9px 14px;
    font-size: 13px !important;
    font-weight: 800;
  }

  /* Search and date navigation */

  .search-box {
    min-height: 44px;
  }

  .search-input {
    font-size: 14px !important;
  }

  .search-item {
    min-height: 56px;
  }

  .search-name,
  .search-result-name {
    font-size: 13px !important;
    line-height: 1.4;
  }

  .search-meta,
  .search-sub {
    font-size: 11px !important;
    line-height: 1.45;
  }

  .date-nav-btn {
    width: 42px;
    height: 42px;
  }

  .date-label-btn {
    min-height: 42px;
    font-size: 14px !important;
    font-weight: 850;
  }

  /* Game cards */

  .card {
    padding: 13px;
  }

  .card-top {
    min-height: 29px;
    gap: 8px;
  }

  .card-top .status {
    font-size: 12px !important;
    line-height: 1.4;
    font-weight: 850;
  }

  .card .team {
    min-height: 58px;
    gap: 9px;
  }

  .card .team .logo {
    width: 36px;
    height: 36px;
  }

  .card .team .abbr {
    font-size: 14px !important;
    font-weight: 850;
    line-height: 1.35;
  }

  .card .team .record {
    font-size: 11.5px !important;
    line-height: 1.4;
    color: var(--muted) !important;
  }

  .card .team .score {
    font-size: 23px !important;
    font-weight: 950;
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
  }

  .stats-pill-hint,
  .open-match-pill {
    min-height: 29px;
    padding: 5px 10px;
    font-size: 10.5px !important;
    font-weight: 850;
  }

  .game-watch-btn {
    min-height: 32px;
    padding: 6px 11px;
    font-size: 11px !important;
    font-weight: 900;
  }

  .leader-chip {
    min-height: 33px;
    padding: 6px 9px;
  }

  .leader-name,
  .leader-label {
    font-size: 11px !important;
    line-height: 1.4;
  }

  .leader-number {
    font-size: 13px !important;
    font-weight: 900;
  }

  /* Featured games */

  .featured-heading {
    font-size: 13px !important;
  }

  .featured-logo {
    width: 64px;
    height: 64px;
  }

  .featured-record,
  .featured-meta {
    font-size: 11.5px !important;
    line-height: 1.45;
    color: var(--muted) !important;
    opacity: 1 !important;
  }

  .featured-vs {
    font-size: 13px !important;
  }

  .featured-status {
    font-size: 11px !important;
  }

  .featured-open,
  .featured-watch {
    min-width: 112px;
    min-height: 36px;
    font-size: 12px !important;
  }

  /* Right-side player panels */

  .right-player-card {
    min-height: 64px;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 11px;
    padding: 10px;
  }

  .right-player-headshot {
    width: 46px;
    height: 50px;
  }

  .right-player-copy strong {
    font-size: 13px !important;
    line-height: 1.4;
  }

  .right-player-copy span {
    font-size: 11px !important;
    line-height: 1.45;
    color: var(--muted) !important;
  }

  .right-team-identity strong {
    font-size: 13px !important;
  }

  .right-team-vs {
    font-size: 10.5px !important;
    color: var(--muted) !important;
  }

  .right-team-stat-value {
    font-size: 13px !important;
    font-weight: 900;
  }

  .right-team-stat-label {
    font-size: 10px !important;
    color: var(--muted) !important;
  }

  .right-standing-row {
    min-height: 38px;
    font-size: 12px !important;
  }

  .right-rail-empty {
    font-size: 12px !important;
    line-height: 1.5;
    color: var(--muted) !important;
  }

  /* Shared headings and secondary text */

  .eyebrow {
    font-size: 11px !important;
    line-height: 1.4;
    letter-spacing: .075em;
  }

  .hub-subtitle {
    font-size: 12px !important;
    line-height: 1.5;
    color: var(--muted) !important;
  }

  .stat-group-title,
  .friendly-title {
    margin-top: 15px;
    margin-bottom: 10px;
    font-size: 14px !important;
    line-height: 1.4;
    font-weight: 900;
    letter-spacing: .035em;
  }

  .settings-hint,
  .empty {
    font-size: 13px !important;
    line-height: 1.55;
    color: var(--muted) !important;
  }

  .stat-scroll-hint,
  .legend-item {
    font-size: 11px !important;
    line-height: 1.45;
  }

  /* Standings */

  .standings-group,
  .playoff-group {
    padding: 15px;
  }

  .standings-group-title {
    font-size: 15px !important;
    line-height: 1.4;
    font-weight: 900;
  }

  .standings-header {
    min-height: 30px;
    font-size: 11px !important;
    line-height: 1.4;
    color: var(--muted) !important;
  }

  .standings-row {
    min-height: 44px;
    gap: 8px;
  }

  .standing-rank {
    font-size: 13px !important;
    font-weight: 900;
  }

  .standing-team,
  .standing-name {
    font-size: 12.5px !important;
    font-weight: 800;
    line-height: 1.4;
  }

  .standing-record,
  .standing-pct,
  .standing-gb {
    font-size: 12px !important;
    font-variant-numeric: tabular-nums;
  }

  .playoff-row {
    min-height: 49px;
    gap: 9px;
    padding: 8px 10px;
  }

  .playoff-seed {
    width: 29px;
    height: 29px;
    font-size: 12px !important;
    font-weight: 900;
  }

  .playoff-team-copy {
    font-size: 13px !important;
    line-height: 1.4;
  }

  .playoff-team-copy span {
    font-size: 11px !important;
    color: var(--muted) !important;
  }

  .playoff-status {
    font-size: 10px !important;
    font-weight: 850;
  }

  .hub-league-select {
    min-width: 170px;
    min-height: 41px;
    font-size: 13px !important;
  }

  /* Momentum and team comparisons */

  .momentum-card {
    padding: 14px;
    margin-bottom: 15px;
  }

  .momentum-live {
    font-size: 10px !important;
    padding: 4px 8px;
  }

  .momentum-bar {
    height: 15px;
    margin: 11px 0 9px;
  }

  .boxscore-team-summary-title {
    font-size: 14px !important;
  }

  .boxscore-team-stat {
    min-width: 70px;
    padding: 11px;
  }

  .boxscore-team-stat-value {
    font-size: 18px !important;
    font-weight: 950;
  }

  .boxscore-team-stat-label {
    font-size: 10.5px !important;
  }

  /* Game details and tables */

  .detail-tab {
    min-height: 42px;
    padding: 9px 12px;
    font-size: 12.5px !important;
    font-weight: 850;
    line-height: 1.35;
  }

  .stats-tab-btn {
    min-height: 36px;
    font-size: 12px !important;
  }

  #statsDrawer .stat-table th,
  #playerModalBody .stat-table th {
    padding: 9px 11px;
    font-size: 11.5px !important;
    line-height: 1.4;
    font-weight: 900;
  }

  #statsDrawer .stat-table td,
  #playerModalBody .stat-table td {
    padding: 9px 11px;
    font-size: 12.5px !important;
    line-height: 1.4;
  }

  #statsDrawer .compact-stat-table tbody tr {
    min-height: 43px;
  }

  #statsDrawer .compact-stat-table .cell-main-val {
    font-size: 13px !important;
    font-weight: 850;
  }

  #statsDrawer .boxscore-player-name {
    font-size: 12.5px !important;
    font-weight: 850;
  }

  #statsDrawer .boxscore-player-meta {
    font-size: 10.5px !important;
    line-height: 1.4;
    color: var(--muted) !important;
  }

  #statsDrawer .boxscore-headshot {
    width: 34px;
    height: 34px;
  }

  .pbp-row {
    min-height: 49px;
    padding: 10px 12px;
  }

  .pbp-text {
    font-size: 12.5px !important;
    line-height: 1.5;
  }

  .pbp-meta {
    font-size: 11px !important;
    line-height: 1.4;
  }

  .probability-team-name {
    font-size: 12px !important;
  }

  .probability-footnote {
    font-size: 11px !important;
    line-height: 1.5;
    color: var(--muted) !important;
  }

  .probability-axis-label {
    font-size: 12px !important;
  }

  /* Overlays and Team Center */

  .overlay-header {
    min-height: 50px;
    padding: 9px 15px;
  }

  .overlay-title {
    font-size: 15px !important;
    font-weight: 900;
    line-height: 1.4;
  }

  .back-btn {
    min-height: 35px;
    padding: 7px 10px;
    font-size: 12.5px !important;
    font-weight: 850;
  }

  .overlay-body {
    font-size: 14px;
    line-height: 1.5;
  }

  .team-center-hero {
    min-height: 88px;
    gap: 15px;
    padding: 15px;
  }

  .team-center-hero-copy strong {
    font-size: 20px !important;
    line-height: 1.3;
  }

  .team-center-hero-copy span {
    font-size: 12px !important;
    line-height: 1.45;
  }

  .team-center-section {
    margin-bottom: 17px;
  }

  .team-center-game {
    min-height: 49px;
    padding: 9px 12px;
    grid-template-columns: 35px minmax(0, 1fr) auto;
    gap: 10px;
    font-size: 12.5px !important;
  }

  .team-center-game-copy {
    font-size: 12.5px !important;
    line-height: 1.45;
  }

  .team-center-game-result {
    font-size: 12px !important;
    font-weight: 900;
  }

  .team-center-injury,
  .team-center-news {
    font-size: 13px !important;
    line-height: 1.5;
  }

  .injury-status {
    font-size: 11px !important;
    font-weight: 850;
  }

  .team-center-record-label {
    font-size: 10px !important;
  }

  .team-center-record-value {
    font-size: 22px !important;
  }

  .team-center-roster-table th {
    font-size: 11px !important;
  }

  .team-center-roster-table td {
    font-size: 12.5px !important;
  }

  .team-center-roster-player-copy strong {
    font-size: 12.5px !important;
  }

  .team-center-roster-player-copy span {
    font-size: 10px !important;
  }

  .team-center-roster-gp {
    font-size: 14px !important;
  }

  /* Player profiles */

  .player-bio-card {
    min-height: 105px;
    padding: 17px;
    gap: 14px;
  }

  .player-headshot {
    width: 74px;
    height: 74px;
  }

  .player-bio-name {
    font-size: 20px !important;
    line-height: 1.3;
    font-weight: 900;
  }

  .player-bio-sub {
    font-size: 12px !important;
    line-height: 1.5;
    color: var(--muted) !important;
  }

  .player-bio-draft {
    font-size: 11.5px !important;
    line-height: 1.5;
  }

  .player-subtab-btn {
    min-height: 41px;
    padding: 9px 13px;
    font-size: 12.5px !important;
    font-weight: 850;
  }

  .rank-stat-card {
    min-height: 100px;
    padding: 13px;
  }

  .rank-cat-abbr,
  .rank-badge {
    font-size: 11px !important;
  }

  .rank-card-val {
    font-size: 22px !important;
    font-weight: 950;
  }

  .rank-card-sub {
    font-size: 11px !important;
  }

  .gamelog-date,
  .gamelog-opp {
    font-size: 12px !important;
    line-height: 1.45;
  }

  .wl-badge {
    font-size: 11px !important;
  }

  .friendly-news {
    font-size: 13px !important;
    line-height: 1.55;
  }

  /* Soccer */

  .soccer-overview-detail-label,
  .soccer-highlight-label,
  .soccer-highlight-teams {
    font-size: 11px !important;
  }

  .soccer-overview-detail-value {
    font-size: 13px !important;
    line-height: 1.45;
  }

  .soccer-highlight-value {
    font-size: 22px !important;
  }

  .soccer-stats-table th,
  .soccer-stats-table td {
    font-size: 13px !important;
  }

  .soccer-match-event {
    min-height: 61px;
    padding: 11px 13px;
  }

  .soccer-match-event-clock {
    font-size: 12px !important;
  }

  .soccer-match-event-copy {
    font-size: 13px !important;
    line-height: 1.45;
  }

  .soccer-match-event-team,
  .soccer-match-event-detail {
    font-size: 11px !important;
  }

  .soccer-lineup-player-copy strong {
    font-size: 12.5px !important;
  }

  .soccer-lineup-player-copy span {
    font-size: 10.5px !important;
  }

  /* MMA */

  .ufc-fighter-card-name,
  .ufc-fighter-name-wrap {
    font-size: 13px !important;
  }

  .ufc-fighter-card-record,
  .ufc-fighter-card-cta,
  .ufc-fighter-nickname {
    font-size: 11px !important;
  }

  .ufc-profile-name {
    font-size: 25px !important;
  }

  .ufc-profile-detail-value {
    font-size: 14px !important;
  }

  .ufc-profile-metric-value {
    font-size: 22px !important;
  }

  /* Settings */

  .settings-group-title {
    font-size: 13px !important;
    line-height: 1.45;
  }

  .setting-row {
    min-height: 46px;
    font-size: 13px !important;
    line-height: 1.45;
  }

  .toggle-row {
    min-height: 46px;
  }

  .glass-select,
  .icon-btn,
  .fav-league-pill,
  .live-filter-pill {
    min-height: 36px;
    font-size: 11.5px !important;
  }

  /* Stream catalog */

  .live-catalog-event-title {
    font-size: 12px !important;
    line-height: 1.45;
  }

  .live-catalog-event-meta {
    font-size: 11px !important;
    line-height: 1.5;
    color: var(--muted) !important;
  }

  .live-catalog-event-status {
    font-size: 10px !important;
    line-height: 1.4;
  }

  .live-catalog-empty {
    font-size: 13px !important;
    line-height: 1.5;
  }

  .watch-launcher-title {
    font-size: 15px !important;
  }

  .watch-status,
  .watch-meta,
  .watch-resolution-label {
    font-size: 11.5px !important;
    line-height: 1.5;
  }

  /* Consistent secondary text contrast */

  .hub-subtitle,
  .settings-hint,
  .right-rail-empty,
  .featured-meta,
  .featured-record,
  .right-player-copy span,
  .right-team-vs,
  .standing-gb,
  .standings-header,
  .playoff-team-copy span,
  .probability-footnote,
  .team-center-roster-subtitle,
  .team-center-data-source {
    color: var(--muted) !important;
    opacity: 1 !important;
  }

  /* Prevent clipping when text is enlarged */

  .overlay-title,
  .team-center-hero-copy,
  .team-center-game-copy,
  .right-player-copy,
  .player-bio-info,
  .boxscore-player-identity {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  /* Visible keyboard focus */

  button:focus-visible,
  a:focus-visible,
  input:focus-visible,
  select:focus-visible,
  textarea:focus-visible {
    outline: 2px solid var(--accent, #a997ff);
    outline-offset: 3px;
  }
}

/* ==========================================================
   WIDE DESKTOP: 1800px AND ABOVE
========================================================== */

@media (min-width: 1800px) {

  body {
    font-size: 15px;
    line-height: 1.5;
  }

  .league-link {
    min-height: 47px;
    font-size: 14px !important;
  }

  .sidebar-heading,
  .sidebar-secondary-heading {
    font-size: 13px !important;
  }

  .main-view-tab {
    min-height: 46px;
    font-size: 14px !important;
  }

  .search-input {
    font-size: 15px !important;
  }

  .date-label-btn {
    min-height: 45px;
    font-size: 15px !important;
  }

  .card {
    padding: 15px;
  }

  .card-top .status {
    font-size: 13px !important;
  }

  .card .team {
    min-height: 65px;
    gap: 11px;
  }

  .card .team .logo {
    width: 40px;
    height: 40px;
  }

  .card .team .abbr {
    font-size: 15px !important;
  }

  .card .team .record {
    font-size: 12px !important;
  }

  .card .team .score {
    font-size: 26px !important;
  }

  .stat-group-title,
  .friendly-title {
    font-size: 15px !important;
  }

  .standings-group,
  .playoff-group {
    padding: 17px;
  }

  .standings-row {
    min-height: 49px;
  }

  .standings-header {
    font-size: 12px !important;
  }

  .standing-rank,
  .standing-team,
  .standing-name {
    font-size: 14px !important;
  }

  .standing-record,
  .standing-pct,
  .standing-gb {
    font-size: 13px !important;
  }

  .playoff-row {
    min-height: 55px;
  }

  .playoff-team-copy {
    font-size: 14px !important;
  }

  .playoff-team-copy span {
    font-size: 12px !important;
  }

  .overlay-header {
    min-height: 56px;
  }

  .overlay-title {
    font-size: 17px !important;
  }

  .overlay-body {
    font-size: 15px;
  }

  .team-center-hero {
    min-height: 100px;
    padding: 18px;
  }

  .team-center-hero-copy strong {
    font-size: 23px !important;
  }

  .team-center-hero-copy span {
    font-size: 13px !important;
  }

  .team-center-game {
    min-height: 56px;
    font-size: 14px !important;
  }

  .team-center-game-copy {
    font-size: 14px !important;
  }

  #statsDrawer .detail-tab {
    min-height: 46px;
    font-size: 13.5px !important;
  }

  #statsDrawer .stat-table th,
  #playerModalBody .stat-table th {
    font-size: 12.5px !important;
    padding: 11px 13px;
  }

  #statsDrawer .stat-table td,
  #playerModalBody .stat-table td {
    font-size: 13.5px !important;
    padding: 11px 13px;
  }

  #statsDrawer .compact-stat-table tbody tr {
    min-height: 48px;
  }

  #statsDrawer .boxscore-player-name {
    font-size: 13.5px !important;
  }

  #statsDrawer .boxscore-player-meta {
    font-size: 11.5px !important;
  }

  .player-bio-name {
    font-size: 23px !important;
  }

  .player-bio-sub {
    font-size: 13px !important;
  }

  .player-subtab-btn {
    min-height: 45px;
    font-size: 13.5px !important;
  }

  .right-player-copy strong {
    font-size: 14px !important;
  }

  .right-player-copy span {
    font-size: 12px !important;
  }

  .team-center-injury,
  .team-center-news {
    font-size: 14px !important;
  }

  .team-center-roster-table td {
    font-size: 14px !important;
    padding: 11px 15px;
  }

  .team-center-roster-player-copy strong {
    font-size: 14px !important;
  }

  .team-center-roster-gp {
    font-size: 16px !important;
  }

  .setting-row {
    min-height: 51px;
    font-size: 14px !important;
  }

  .settings-hint,
  .empty {
    font-size: 13.5px !important;
  }
}

/* ==========================================================
   ULTRA-WIDE: 2400px AND ABOVE
========================================================== */

@media (min-width: 2400px) {

  body {
    font-size: 16px;
  }

  .league-link {
    min-height: 51px;
    font-size: 15px !important;
  }

  .main-view-tab {
    min-height: 49px;
    font-size: 15px !important;
  }

  .card .team {
    min-height: 70px;
  }

  .card .team .abbr {
    font-size: 16px !important;
  }

  .card .team .record {
    font-size: 13px !important;
  }

  .card .team .score {
    font-size: 29px !important;
  }

  .card-top .status {
    font-size: 14px !important;
  }

  .stat-group-title,
  .friendly-title {
    font-size: 16px !important;
  }

  .standings-row {
    min-height: 54px;
  }

  .standing-name,
  .standing-team,
  .standing-rank {
    font-size: 15px !important;
  }

  .standing-record,
  .standing-pct,
  .standing-gb {
    font-size: 14px !important;
  }

  #statsDrawer .stat-table th,
  #playerModalBody .stat-table th {
    font-size: 13px !important;
  }

  #statsDrawer .stat-table td,
  #playerModalBody .stat-table td {
    font-size: 14px !important;
  }

  .overlay-title {
    font-size: 18px !important;
  }

  .team-center-game {
    min-height: 61px;
  }

  .team-center-game-copy {
    font-size: 15px !important;
  }

  .team-center-hero-copy strong {
    font-size: 25px !important;
  }

  .team-center-hero-copy span {
    font-size: 14px !important;
  }

  .player-bio-name {
    font-size: 25px !important;
  }

  .player-subtab-btn {
    font-size: 14px !important;
    min-height: 48px;
  }

  .settings-hint,
  .empty {
    font-size: 14px !important;
  }
}

/* ==========================================================
   ACCESSIBILITY
========================================================== */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}


/* GLASS SCORES - NFL SCORE CARD LEGIBILITY FIX */

/*
  NFL game cards use a dedicated passing/rushing leader layout.
  These rules specifically target those compact football rows.
*/

/* Team names and current records. */

.card .team .abbr {
  color: var(--text) !important;
  font-size: 14px !important;
  line-height: 1.4;
  font-weight: 950 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.card .team .record {
  color: var(--text) !important;
  font-size: 12px !important;
  line-height: 1.4;
  font-weight: 750 !important;
  opacity: .96 !important;
  text-shadow: none !important;
}

.card .team .score {
  font-size: 22px !important;
  line-height: 1.2;
  font-weight: 950 !important;
  font-variant-numeric: tabular-nums;
}

/* The two NFL passing/rushing leader columns. */

.card .football-team-leader-layout {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 9px;
  width: 100%;
  min-width: 0;
}

.card .football-team-leader-layout .football-card-leader-side {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 76px;
  padding: 10px 11px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  overflow: hidden;
}

/* Opaque leader panels improve contrast over the glass background. */

:root:not([data-theme="light"])
.card .football-team-leader-layout .football-card-leader-side {
  color: #ffffff;
  background: rgba(17, 20, 27, .96);
  border-color: rgba(255, 255, 255, .20);
}

:root[data-theme="light"]
.card .football-team-leader-layout .football-card-leader-side {
  color: #191d24;
  background: rgba(249, 250, 253, .97);
  border-color: rgba(20, 25, 34, .19);
}

/* Team abbreviation heading above each team's leaders. */

.card .football-team-leader-layout .card-leader-heading {
  display: block;
  min-height: 22px;
  margin-bottom: 7px;
  color: var(--text) !important;
  font-size: 12px !important;
  line-height: 1.4;
  font-weight: 950 !important;
  letter-spacing: .055em;
  opacity: 1 !important;
}

/* Passing and rushing player rows. */

.card .football-team-leader-layout .card-leader-stats {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
  width: 100%;
}

.card .football-team-leader-layout .football-stat-row {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 3px;
  min-width: 0;
  min-height: 36px;
  width: 100%;
  padding: 4px 0;
  border: 0;
  background: transparent;
}

/* Player names. */

.card .football-team-leader-layout .football-leader-lastname {
  display: block;
  max-width: 100%;
  color: var(--text) !important;
  font-size: 13.5px !important;
  line-height: 1.35;
  font-weight: 950 !important;
  opacity: 1 !important;
  overflow-wrap: anywhere;
  text-shadow: none !important;
}

/* Passing and rushing statistic strings. */

.card .football-team-leader-layout .football-leader-statline {
  display: block;
  width: 100%;
  max-width: 100%;
  color: var(--text) !important;
  font-size: 12px !important;
  line-height: 1.5;
  font-weight: 850 !important;
  letter-spacing: .005em;
  opacity: 1 !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: normal;
  text-shadow: none !important;
}

/* NFL cards on wide desktop displays. */

@media (min-width: 1200px) {
  .card .team .abbr {
    font-size: 15px !important;
  }

  .card .team .record {
    font-size: 13px !important;
  }

  .card .football-team-leader-layout {
    gap: 11px;
  }

  .card .football-team-leader-layout .football-card-leader-side {
    min-height: 88px;
    padding: 12px 14px;
  }

  .card .football-team-leader-layout .card-leader-heading {
    min-height: 25px;
    font-size: 13px !important;
  }

  .card .football-team-leader-layout .football-leader-lastname {
    font-size: 15px !important;
  }

  .card .football-team-leader-layout .football-leader-statline {
    font-size: 13px !important;
    line-height: 1.5;
  }
}

/* Extra-wide desktop displays. */

@media (min-width: 1800px) {
  .card .team .abbr {
    font-size: 16px !important;
  }

  .card .team .record {
    font-size: 14px !important;
  }

  .card .football-team-leader-layout .football-card-leader-side {
    min-height: 96px;
    padding: 14px 16px;
  }

  .card .football-team-leader-layout .card-leader-heading {
    font-size: 14px !important;
  }

  .card .football-team-leader-layout .football-leader-lastname {
    font-size: 16px !important;
  }

  .card .football-team-leader-layout .football-leader-statline {
    font-size: 14px !important;
  }
}

/* Keep both teams readable in narrow windows. */

@media (max-width: 620px) {
  .card .football-team-leader-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .card .football-team-leader-layout .football-card-leader-side {
    min-height: 65px;
  }
}

/* The separate NFL player-leader cards in the right rail. */

.right-football-leader-team {
  padding: 10px;
  margin-bottom: 10px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
}

:root:not([data-theme="light"]) .right-football-leader-team {
  background: rgba(17, 20, 27, .94);
}

:root[data-theme="light"] .right-football-leader-team {
  background: rgba(249, 250, 253, .96);
}

.right-football-team-heading {
  display: block;
  margin-bottom: 8px;
  color: var(--text) !important;
  font-size: 13px !important;
  line-height: 1.4;
  font-weight: 950 !important;
  opacity: 1 !important;
}

.right-football-leader-team .right-player-card {
  min-height: 69px;
  padding: 9px;
  background: transparent;
}

.right-football-leader-team .right-player-headshot {
  width: 46px;
  height: 50px;
  object-fit: cover;
}

.right-football-leader-team .right-player-fullname {
  color: var(--text) !important;
  font-size: 13.5px !important;
  line-height: 1.4;
  font-weight: 950 !important;
  opacity: 1 !important;
}

.right-football-leader-team .right-player-meta {
  color: var(--text) !important;
  font-size: 12px !important;
  line-height: 1.5;
  font-weight: 750 !important;
  opacity: 1 !important;
  white-space: normal;
  overflow-wrap: anywhere;
}

/* More legible game status and action text on score cards. */

.card .card-top .status {
  font-size: 12px !important;
  line-height: 1.4;
  font-weight: 900 !important;
  opacity: 1 !important;
}

.card .stats-pill-hint,
.card .open-match-pill {
  min-height: 30px;
  padding: 6px 11px;
  font-size: 11px !important;
  font-weight: 900 !important;
}


/* GLASS SCORES - SCORE CARD TEAM LOGO CONTAINMENT FIX */

/*
  Keep team crests fully visible inside a stable logo frame.
  This fixes clipping caused by flex shrinking and image cropping.
*/

.card .team {
  align-items: center;
}

.card .team-logo-frame.card-team-logo-frame {
  display: inline-grid !important;
  place-items: center !important;
  position: relative;
  box-sizing: border-box;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  flex: 0 0 40px !important;
  padding: 0 !important;
  margin: 0 2px;
  overflow: visible !important;
  line-height: 0;
  vertical-align: middle;
}

.card .team-logo-frame.card-team-logo-frame > img.logo {
  display: block !important;
  box-sizing: border-box;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 100% !important;
  max-height: 100% !important;
  padding: 1px;
  margin: 0;
  object-fit: contain !important;
  object-position: center center !important;
  overflow: visible !important;
  border-radius: 0 !important;
  clip-path: none !important;
  transform: none !important;
}

.card .team-logo-frame.card-team-logo-frame > .team-logo-fallback {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  overflow: visible;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}

.card .team-logo-frame.card-team-logo-frame > .team-logo-fallback[hidden] {
  display: none !important;
}

@media (min-width: 1200px) {
  .card .team-logo-frame.card-team-logo-frame {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    flex-basis: 44px !important;
  }
}

.card .team-logo-frame.card-team-logo-frame,
.card .team-logo-frame.card-team-logo-frame > img.logo {
  flex-shrink: 0 !important;
}

/* SCORES AND STREAMS - TEAM LOGO GRID OVERLAP FIX */
@media (min-width: 1200px) {
  .card .team:not(.fighter-row) {
    grid-template-columns: max-content 30px max-content minmax(0, 1fr) auto;
    column-gap: 7px;
    min-width: 0;
  }

  .card .team:not(.fighter-row) > .card-team-logo-frame {
    width: 30px;
    height: 30px;
    min-width: 30px;
    box-sizing: border-box;
    justify-self: center;
  }

  .card .team:not(.fighter-row) > .abbr {
    min-width: 0;
    white-space: nowrap;
  }

  .card .team:not(.fighter-row) > .record {
    min-width: 0;
    white-space: nowrap;
  }

  .card .team:not(.fighter-row) > .score {
    min-width: 30px;
    justify-self: end;
  }
}

/* ==========================================================
   GLASS_SCORES_ACTION_BUTTON_POLISH_V1
   Coordinated Open Match + Watch button treatment
   ========================================================== */

/* OPEN MATCH — refined secondary glass action */
.stats-pill-hint.open-match-pill,
.featured-open {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 30px;
  padding: 0 12px;
  border: 1px solid rgba(205, 211, 232, .25);
  border-radius: 9px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, .13),
    rgba(255, 255, 255, .055)
  );
  color: rgba(247, 248, 255, .94);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .075em;
  text-transform: uppercase;
  white-space: nowrap;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .12),
    0 3px 10px rgba(0, 0, 0, .13);
  transition:
    background .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

.stats-pill-hint.open-match-pill {
  min-width: 96px;
}

.featured-open {
  min-width: 116px;
  min-height: 35px;
  font-size: 10px;
}

.stats-pill-hint.open-match-pill::after,
.featured-open::after {
  content: '\2197';
  font-size: 12px;
  line-height: 1;
  opacity: .72;
}

.stats-pill-hint.open-match-pill:hover,
.featured-open:hover {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, .19),
    rgba(255, 255, 255, .085)
  );
  border-color: rgba(179, 165, 255, .58);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .16),
    0 5px 15px rgba(0, 0, 0, .19);
  transform: translateY(-1px);
}

/* WATCH — prominent live-play action */
.game-watch-btn,
.featured-watch {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 78px;
  min-height: 30px;
  padding: 0 12px;
  border: 1px solid rgba(72, 222, 147, .44);
  border-radius: 9px;
  background: linear-gradient(
    135deg,
    rgba(44, 207, 111, .29),
    rgba(20, 145, 88, .20)
  );
  color: #c8ffdf;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .085em;
  text-transform: uppercase;
  white-space: nowrap;
  text-shadow: 0 1px 5px rgba(0, 0, 0, .2);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .15),
    0 3px 12px rgba(20, 185, 105, .12);
  transition:
    background .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

.game-watch-btn::before,
.featured-watch::before {
  content: '\25B6';
  font-size: 8px;
  line-height: 1;
  color: #85f5b4;
}

.featured-watch {
  min-width: 116px;
  min-height: 35px;
  font-size: 10px;
}

.game-watch-btn:hover:not(:disabled),
.featured-watch:hover:not(:disabled) {
  background: linear-gradient(
    135deg,
    rgba(44, 220, 121, .43),
    rgba(20, 165, 98, .32)
  );
  border-color: rgba(106, 255, 174, .72);
  color: #ffffff;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .19),
    0 5px 17px rgba(20, 205, 115, .22);
  transform: translateY(-1px);
}

.game-watch-btn:active:not(:disabled),
.featured-watch:active:not(:disabled),
.stats-pill-hint.open-match-pill:active,
.featured-open:active {
  transform: translateY(0) scale(.97);
}

.game-watch-btn:focus-visible,
.featured-watch:focus-visible,
.stats-pill-hint.open-match-pill:focus-visible,
.featured-open:focus-visible {
  outline: 2px solid rgba(157, 145, 255, .9);
  outline-offset: 3px;
}

.featured-watch:disabled {
  opacity: .48;
  cursor: not-allowed;
  filter: grayscale(.35);
}

/* LIGHT THEME */
:root[data-theme="light"] .stats-pill-hint.open-match-pill,
:root[data-theme="light"] .featured-open {
  color: #292d35;
  border-color: rgba(47, 52, 65, .19);
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, .92),
    rgba(233, 235, 241, .80)
  );
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .95),
    0 3px 9px rgba(30, 35, 45, .08);
}

:root[data-theme="light"] .game-watch-btn,
:root[data-theme="light"] .featured-watch {
  color: #12643c;
  border-color: rgba(26, 151, 86, .35);
  background: linear-gradient(
    135deg,
    rgba(91, 220, 145, .28),
    rgba(44, 174, 105, .17)
  );
  text-shadow: none;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .75),
    0 3px 10px rgba(30, 130, 75, .08);
}

:root[data-theme="light"] .game-watch-btn::before,
:root[data-theme="light"] .featured-watch::before {
  color: #16854d;
}


/* GLASS_SCORES_SPORT_SECTION_HEADER_V2_START */

/*
   Sport section divider

   Makes NBA / NFL / MLB / SOCCER / UFC / CBB / CFB
   stand out as major sections between groups of games.
*/

.live-league-heading {
  width: 100% !important;
  box-sizing: border-box !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 14px !important;

  margin: 18px 0 10px !important;
  padding: 7px 4px !important;

  color: var(--text) !important;

  font-size: 14px !important;
  line-height: 1.25 !important;
  font-weight: 900 !important;

  letter-spacing: .14em !important;
  text-transform: uppercase !important;

  text-align: center !important;

  background: transparent !important;
  border: 0 !important;
}

/*
   Left and right divider lines
*/

.live-league-heading::before,
.live-league-heading::after {
  content: "" !important;

  display: block !important;

  flex: 1 1 auto !important;

  height: 1px !important;

  background: rgba(255, 255, 255, .20) !important;
}

/*
   Fade the outside edges of the dividers
*/

.live-league-heading::before {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, .20)
  ) !important;
}

.live-league-heading::after {
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, .20),
    transparent
  ) !important;
}

/*
   First sport gets less top spacing.
*/

.live-league-heading:first-child {
  margin-top: 5px !important;
}

/*
   Give the games immediately below a little breathing room.
*/

.live-league-heading + .game-card {
  margin-top: 2px !important;
}

/*
   LIGHT THEME
*/

:root[data-theme="light"] .live-league-heading {
  color: #252932 !important;
}

:root[data-theme="light"] .live-league-heading::before,
:root[data-theme="light"] .live-league-heading::after {
  background: rgba(40, 45, 55, .18) !important;
}

/* GLASS_SCORES_SPORT_SECTION_HEADER_V2_END */


/* GLASS_SCORES_SPORT_ROW_FIX_START */

/*
   SPORT ROW SEPARATION

   Each sport heading occupies the entire game-grid row.

   Example:

   ───────────── NBA ─────────────

   [ NBA GAME ] [ NBA GAME ]

   ───────────── NFL ─────────────

   [ NFL GAME ] [ NFL GAME ]

   This prevents one sport from sharing a row with
   another sport's games.
*/

.live-league-heading {
  /*
     CRITICAL:
     Force the sport heading across every grid column.
  */
  grid-column: 1 / -1 !important;

  /*
     Keep the heading immediately above its games.
  */
  width: 100% !important;
  box-sizing: border-box !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 14px !important;

  margin: 14px 0 4px !important;
  padding: 7px 6px !important;

  color: var(--text) !important;

  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 900 !important;

  letter-spacing: .14em !important;
  text-transform: uppercase !important;

  text-align: center !important;

  background: transparent !important;
  border: 0 !important;
}

/*
   Divider lines.
*/

.live-league-heading::before,
.live-league-heading::after {
  content: "" !important;

  display: block !important;
  flex: 1 1 auto !important;

  height: 1px !important;

  background: rgba(255, 255, 255, .20) !important;
}

.live-league-heading::before {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, .20)
  ) !important;
}

.live-league-heading::after {
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, .20),
    transparent
  ) !important;
}

/*
   The first sport should sit closer to the top.
*/

.live-league-heading:first-child {
  margin-top: 4px !important;
}

/*
   The first game after a heading stays close to it.
*/

.live-league-heading + .game-card {
  margin-top: 0 !important;
}

/*
   Make sure the heading itself never behaves like
   an individual game tile.
*/

.live-league-heading {
  min-width: 0 !important;
  min-height: 0 !important;
}

/*
   LIGHT THEME
*/

:root[data-theme="light"] .live-league-heading {
  color: #252932 !important;
}

:root[data-theme="light"] .live-league-heading::before,
:root[data-theme="light"] .live-league-heading::after {
  background: rgba(40, 45, 55, .18) !important;
}

/* GLASS_SCORES_SPORT_ROW_FIX_END */


/* PWA touch layout */
.mobile-sports-nav { display: none; }
.pwa-web body { min-height: 100dvh; }
.pwa-web .shell { min-height: 100dvh; }
.pwa-web .header { padding-top: max(8px, env(safe-area-inset-top)); }
.pwa-web .header #minimize,
.pwa-web .header #close,
.pwa-web .header #pin { display: none !important; }
.pwa-web button,
.pwa-web select,
.pwa-web input { touch-action: manipulation; }
.pwa-web button { -webkit-tap-highlight-color: transparent; }

@media (max-width: 640px) {
  .pwa-web .mobile-sports-nav {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
    width: 100%;
    box-sizing: border-box;
    padding: 8px 12px 9px;
    background: rgba(15, 18, 25, .96);
    border-bottom: 1px solid rgba(255,255,255,.08);
  }

  .pwa-web .mobile-sport-picker-label {
    flex: 0 0 auto;
    color: rgba(230,232,255,.65);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .13em;
  }

  .pwa-web .mobile-sports-select-wrap {
    position: relative;
    display: block;
    flex: 1 1 auto;
    min-width: 0;
  }

  .pwa-web .mobile-sports-select {
    appearance: none;
    display: block;
    width: 100%;
    min-height: 40px;
    box-sizing: border-box;
    padding: 0 42px 0 13px;
    border: 1px solid var(--card-border);
    border-radius: 11px;
    color: var(--text);
    background: var(--card);
    font-family: inherit;
    font-size: 13px;
    font-weight: 850;
    outline: none;
    cursor: pointer;
  }

  .pwa-web .mobile-sports-select-wrap::after {
    content: '\25BE';
    position: absolute;
    top: 50%;
    right: 14px;
    transform: translateY(-58%);
    color: var(--text);
    font-size: 18px;
    font-weight: 800;
    pointer-events: none;
  }

  .pwa-web .mobile-sports-select:focus-visible {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px rgba(52,135,255,.24);
  }

  .pwa-web .mobile-sports-select option {
    color: #f7f8fb;
    background: #1c2028;
  }

  :root[data-theme="light"] .pwa-web .mobile-sport-picker-label {
    color: rgba(34,38,44,.62);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-select option {
    color: #25282e;
    background: #ffffff;
  }
  .pwa-web .dashboard-layout {
    flex: 1 1 auto;
    min-height: 0;
    grid-template-columns: minmax(0,1fr) !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 0 max(8px, env(safe-area-inset-bottom)) !important;
  }
  .pwa-web .app-rail,
  .pwa-web .league-sidebar,
  .pwa-web .right-rail { display: none !important; }
  .pwa-web .dashboard-main {
    width: 100%;
    min-width: 0;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
    padding-left: 10px;
    padding-right: 10px;
  }
  .pwa-web .main-view-tabs {
    position: sticky;
    top: 0;
    z-index: 8;
    padding-top: 6px;
    background: var(--glass-full);
  }
  .pwa-web .score-controls { gap: 8px; }
  .pwa-web .score-controls .search-wrap { min-width: 0; }
  .pwa-web .featured-game { border-radius: 14px; }
  .pwa-web .header .actions { gap: 5px; }
  .pwa-web .header .icon-btn { width: 36px; height: 36px; flex-basis: 36px; }
  .pwa-web #statsDrawer,
  .pwa-web .player-modal { max-height: calc(100dvh - env(safe-area-inset-top) - 10px); }
}

.pwa-web .shell {
  height: 100dvh;
  min-height: 100dvh;
  border-radius: 0;
}
.pwa-web body {
  height: 100dvh;
  min-height: 100dvh;
  overscroll-behavior: none;
}
@supports (-webkit-touch-callout: none) {
  .pwa-web .shell { padding-bottom: env(safe-area-inset-bottom); }
}

/* GLASS_SCORES_PWA_MOBILE_LOGO_GRID_FIX_V2
   Prevent team logos from overlapping abbreviations on mobile. */

@media (max-width: 640px) {
  .pwa-web .card .team:not(.fighter-row) {
    display: grid !important;
    grid-template-columns: 18px 28px max-content minmax(0, 1fr) minmax(32px, auto) !important;
    grid-auto-flow: row !important;
    align-items: center !important;
    column-gap: 5px !important;
    row-gap: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 44px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 2px !important;
  }

  .pwa-web .card .team:not(.fighter-row) > .star-btn {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;
    justify-self: center !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .pwa-web .card .team:not(.fighter-row) > .card-team-logo-frame {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: inline-grid !important;
    place-items: center !important;
    position: relative !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
    flex: 0 0 28px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .pwa-web .card .team:not(.fighter-row) > .card-team-logo-frame > img.logo {
    display: block !important;
    position: static !important;
    grid-area: 1 / 1 !important;
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
    min-height: 26px !important;
    max-width: 26px !important;
    max-height: 26px !important;
    box-sizing: border-box !important;
    object-fit: contain !important;
    object-position: center !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    clip-path: none !important;
  }

  .pwa-web .card .team:not(.fighter-row) > .abbr {
    grid-column: 3 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    max-width: 4.5ch !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    margin: 0 !important;
  }

  .pwa-web .card .team:not(.fighter-row) > .record {
    grid-column: 4 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    margin: 0 !important;
    font-size: 10px !important;
  }

  .pwa-web .card .team:not(.fighter-row) > .score {
    grid-column: 5 !important;
    grid-row: 1 !important;
    min-width: 32px !important;
    justify-self: end !important;
    text-align: right !important;
    white-space: nowrap !important;
    margin: 0 !important;
  }
}

@media (max-width: 360px) {
  .pwa-web .card .team:not(.fighter-row) {
    grid-template-columns: 16px 24px max-content minmax(0, 1fr) minmax(29px, auto) !important;
    column-gap: 4px !important;
  }

  .pwa-web .card .team:not(.fighter-row) > .star-btn {
    width: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
  }

  .pwa-web .card .team:not(.fighter-row) > .card-team-logo-frame {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
    max-width: 24px !important;
    max-height: 24px !important;
    flex-basis: 24px !important;
  }

  .pwa-web .card .team:not(.fighter-row) > .card-team-logo-frame > img.logo {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    max-width: 22px !important;
    max-height: 22px !important;
  }

  .pwa-web .card .team:not(.fighter-row) > .score {
    min-width: 29px !important;
  }
}
/* GLASS_SCORES_APP_PICKER_STYLE_V1
   Premium mobile sport selector and installed-app polish. */

@media (max-width: 640px) {
  .pwa-web .mobile-sports-nav {
    display: flex;
    width: 100%;
    box-sizing: border-box;
    padding: 9px 12px 10px;
    background: rgba(15, 18, 25, .96);
    border-bottom: 1px solid rgba(255,255,255,.07);
  }

  .pwa-web .mobile-sports-picker {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    gap: 11px;
    width: 100%;
    min-width: 0;
    min-height: 60px;
    padding: 8px 11px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 16px;
    background:
      radial-gradient(circle at 0% 0%, rgba(10,132,255,.17), transparent 58%),
      linear-gradient(145deg, rgba(44,48,58,.98), rgba(26,29,37,.98));
    box-shadow:
      0 7px 20px rgba(0,0,0,.20),
      inset 0 1px 0 rgba(255,255,255,.08);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
    transition: border-color .18s ease, box-shadow .18s ease;
  }

  .pwa-web .mobile-sports-picker-icon {
    display: grid;
    flex: 0 0 42px;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 13px;
    background: linear-gradient(145deg, rgba(10,132,255,.34), rgba(10,132,255,.12));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
    font-size: 21px;
    line-height: 1;
  }

  .pwa-web .mobile-sports-picker-copy {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    min-width: 0;
  }

  .pwa-web .mobile-sports-picker-eyebrow {
    color: rgba(224,231,244,.57);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .16em;
    line-height: 1.2;
  }

  .pwa-web .mobile-sports-picker-copy strong {
    overflow: hidden;
    color: #fff;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .pwa-web .mobile-sports-picker-change {
    flex: 0 0 auto;
    padding: 6px 8px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 8px;
    color: rgba(235,240,250,.66);
    background: rgba(255,255,255,.045);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .09em;
  }

  .pwa-web .mobile-sports-picker-arrow {
    display: grid;
    flex: 0 0 29px;
    place-items: center;
    width: 29px;
    height: 29px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 50%;
    color: #fff;
    background: rgba(255,255,255,.075);
    transition: background .18s ease, transform .18s ease;
  }

  .pwa-web .mobile-sports-picker-arrow svg {
    display: block;
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  /* Invisible native select keeps the platform's familiar picker menu. */
  .pwa-web .mobile-sports-picker .mobile-sports-select {
    position: absolute;
    z-index: 5;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    min-height: 100%;
    padding: 0;
    opacity: 0;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    border-radius: inherit;
    background: transparent;
    cursor: pointer;
  }

  .pwa-web .mobile-sports-picker:focus-within {
    border-color: var(--accent);
    box-shadow:
      0 0 0 2px rgba(10,132,255,.22),
      0 7px 20px rgba(0,0,0,.20);
  }

  .pwa-web .mobile-sports-picker:focus-within .mobile-sports-picker-arrow {
    background: rgba(10,132,255,.28);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-nav {
    background: rgba(244,245,250,.97);
    border-bottom-color: rgba(20,25,35,.08);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-picker {
    border-color: rgba(20,25,35,.10);
    background:
      radial-gradient(circle at 0% 0%, rgba(10,99,209,.10), transparent 58%),
      linear-gradient(145deg, rgba(255,255,255,.98), rgba(239,242,248,.98));
    box-shadow:
      0 7px 18px rgba(20,30,50,.08),
      inset 0 1px 0 rgba(255,255,255,.95);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-picker-eyebrow {
    color: rgba(20,28,40,.52);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-picker-copy strong {
    color: #171c25;
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-picker-change {
    color: rgba(20,28,40,.62);
    border-color: rgba(20,28,40,.08);
    background: rgba(20,28,40,.035);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-picker-arrow {
    color: #1b2535;
    border-color: rgba(20,28,40,.10);
    background: rgba(20,28,40,.055);
  }
}

/* Installed launch mode: use the full device surface and safe areas. */
html.pwa-installed .shell {
  width: 100%;
  height: 100dvh;
  min-height: 100dvh;
  max-height: 100dvh;
  border-radius: 0;
}

html.pwa-installed body {
  width: 100%;
  height: 100dvh;
  min-height: 100dvh;
  overscroll-behavior: none;
}

@supports (-webkit-touch-callout: none) {
  html.pwa-installed .header {
    padding-top: max(12px, env(safe-area-inset-top));
  }

  html.pwa-installed .dashboard-layout {
    padding-bottom: max(12px, env(safe-area-inset-bottom));
  }
}

/* GLASS_SCORES_APP_PICKER_STYLE_V1_END */
/* GLASS_SCORES_MOBILE_DRAWER_V1
   Mobile navigation tab and desktop-style league drawer. */

.mobile-sports-nav,
.mobile-sports-backdrop,
.mobile-sports-drawer {
  display: none;
}

@media (max-width: 640px) {
  .pwa-web .mobile-sports-nav {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    padding: 6px 12px 8px;
    background: rgba(15,18,25,.94);
    border-bottom: 1px solid rgba(255,255,255,.06);
  }

  .pwa-web .mobile-sports-tab {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    min-width: 0;
    min-height: 39px;
    padding: 0 11px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 11px;
    color: var(--text);
    background: linear-gradient(135deg, rgba(55,60,72,.85), rgba(30,34,43,.92));
    text-align: left;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
  }

  .pwa-web .mobile-sports-tab-icon {
    display: grid;
    flex: 0 0 25px;
    place-items: center;
    width: 25px;
    height: 25px;
    border-radius: 8px;
    color: #fff;
    background: rgba(10,132,255,.22);
  }

  .pwa-web .mobile-sports-tab-icon svg {
    display: block;
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
  }

  .pwa-web .mobile-sports-tab-label {
    color: rgba(230,235,245,.64);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .11em;
  }

  .pwa-web .mobile-sports-tab-divider {
    width: 1px;
    height: 19px;
    flex: 0 0 1px;
    background: rgba(255,255,255,.15);
  }

  .pwa-web .mobile-sports-tab strong {
    min-width: 0;
    overflow: hidden;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .pwa-web .mobile-sports-tab-arrow {
    margin-left: auto;
    color: rgba(235,240,250,.68);
    font-size: 22px;
    line-height: 1;
  }

  .pwa-web .mobile-sports-tab:active {
    background: rgba(10,132,255,.18);
    border-color: rgba(10,132,255,.5);
  }

  .pwa-web .mobile-sports-backdrop {
    display: block;
    position: absolute;
    z-index: 1100;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    background: rgba(3,6,12,.62);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    opacity: 1;
    transition: opacity .22s ease;
  }

  .pwa-web .mobile-sports-backdrop[hidden] {
    display: none !important;
  }

  .pwa-web .mobile-sports-drawer {
    display: flex !important;
    position: absolute;
    z-index: 1101;
    top: 0;
    bottom: 0;
    left: 0;
    flex-direction: column;
    gap: 0;
    width: min(290px, 86vw);
    max-width: calc(100% - 38px);
    height: 100%;
    box-sizing: border-box;
    padding: max(12px, env(safe-area-inset-top)) 0 max(14px, env(safe-area-inset-bottom));
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 1px solid rgba(255,255,255,.12);
    border-left: 0;
    border-radius: 0 18px 18px 0;
    color: var(--text);
    background: rgba(31,35,44,.985);
    box-shadow: 14px 0 45px rgba(0,0,0,.32);
    -webkit-backdrop-filter: blur(24px);
    backdrop-filter: blur(24px);
    transform: translateX(-105%);
    visibility: hidden;
    pointer-events: none;
    transition:
      transform .26s cubic-bezier(.2,.75,.25,1),
      visibility .26s ease;
  }

  .pwa-web .mobile-sports-drawer.is-open {
    transform: translateX(0);
    visibility: visible;
    pointer-events: auto;
  }

  .pwa-web .mobile-sports-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 0 0 auto;
    padding: 8px 14px 15px;
    margin-bottom: 5px;
    border-bottom: 1px solid rgba(255,255,255,.09);
  }

  .pwa-web .mobile-sports-drawer-brand {
    display: flex;
    flex-direction: column;
    gap: 3px;
  }

  .pwa-web .mobile-sports-drawer-brand > span {
    color: rgba(220,228,242,.55);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .16em;
  }

  .pwa-web .mobile-sports-drawer-brand > strong {
    color: #fff;
    font-size: 19px;
    font-weight: 850;
    letter-spacing: -.02em;
  }

  .pwa-web .mobile-sports-close {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 10px;
    color: rgba(245,247,255,.9);
    background: rgba(255,255,255,.07);
    font-size: 15px;
  }

  .pwa-web .mobile-sports-drawer .sidebar-heading {
    min-height: 36px;
    padding: 0 15px;
    color: rgba(237,241,250,.72);
    font-size: 9px;
    letter-spacing: .06em;
  }

  .pwa-web .mobile-sports-drawer .sidebar-secondary-heading {
    margin-top: 8px;
    border-top-color: rgba(255,255,255,.09);
  }

  .pwa-web .mobile-sports-drawer .league-link {
    min-height: 48px;
    padding: 0 15px;
    grid-template-columns: 28px minmax(0,1fr) 14px;
    gap: 10px;
    border-top-color: rgba(255,255,255,.055);
    color: rgba(245,247,255,.86);
    font-size: 12px;
    font-weight: 650;
  }

  .pwa-web .mobile-sports-drawer .league-mark {
    width: 25px;
    height: 25px;
    background: rgba(255,255,255,.09);
    font-size: 14px;
  }

  .pwa-web .mobile-sports-drawer .league-link.active {
    color: #fff;
    background: linear-gradient(90deg, rgba(10,132,255,.23), rgba(10,132,255,.045));
    box-shadow: inset 3px 0 0 var(--accent);
  }

  .pwa-web .mobile-sports-drawer .league-link:active {
    background: rgba(10,132,255,.18);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-nav {
    background: rgba(244,245,250,.97);
    border-bottom-color: rgba(20,25,35,.08);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-tab {
    border-color: rgba(20,25,35,.10);
    color: #202630;
    background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(235,239,247,.98));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.95);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-tab-label {
    color: rgba(20,28,40,.56);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-tab strong {
    color: #171c25;
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-tab-divider {
    background: rgba(20,25,35,.13);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-tab-arrow {
    color: rgba(20,28,40,.65);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-drawer {
    border-color: rgba(20,25,35,.12);
    background: rgba(246,247,251,.99);
    box-shadow: 14px 0 45px rgba(20,30,50,.18);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-drawer-brand > span {
    color: rgba(20,28,40,.48);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-drawer-brand > strong {
    color: #171c25;
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-close {
    border-color: rgba(20,25,35,.10);
    color: #28303c;
    background: rgba(20,25,35,.05);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-drawer .sidebar-heading {
    color: rgba(20,28,40,.62);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-drawer .sidebar-secondary-heading {
    border-top-color: rgba(20,25,35,.09);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-drawer .league-link {
    color: rgba(25,31,42,.84);
    border-top-color: rgba(20,25,35,.06);
  }

  :root[data-theme="light"] .pwa-web .mobile-sports-drawer .league-link.active {
    color: #14253d;
    background: linear-gradient(90deg, rgba(10,99,209,.13), rgba(10,99,209,.025));
    box-shadow: inset 3px 0 0 var(--accent);
  }
}

/* GLASS_SCORES_MOBILE_DRAWER_V1_END */
/* GLASS_SCORES_CROSS_SPORT_TYPE_V1
   Shared visual hierarchy for NBA, NFL and other team leader cards. */

.card .card-leaders.team-leader-layout .card-leader-side,
.card .card-leaders.football-team-leader-layout .football-card-leader-side {
  min-height: 0 !important;
  box-sizing: border-box !important;
  padding: 5px 6px !important;
  border: 1px solid var(--card-border) !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.025) !important;
  box-shadow: none !important;
}

.card .card-leaders.team-leader-layout .card-leader-heading,
.card .card-leaders.football-team-leader-layout .card-leader-heading {
  display: block !important;
  min-height: 0 !important;
  margin: 0 0 4px !important;
  color: var(--faint) !important;
  font-size: 8.5px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase;
}

.card .card-leaders.team-leader-layout .card-leader-stats,
.card .card-leaders.football-team-leader-layout .card-leader-stats {
  gap: 3px !important;
}

.card .card-leaders.team-leader-layout .leader-chip {
  min-height: 0 !important;
  gap: 4px !important;
  padding: 1px 0 !important;
  font-size: 9px !important;
  line-height: 1.2 !important;
}

.card .card-leaders.team-leader-layout .leader-label,
.card .card-leaders.football-team-leader-layout .leader-label {
  flex: 0 0 auto;
  color: var(--accent) !important;
  font-size: 7.5px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
  letter-spacing: .035em;
}

.card .card-leaders.team-leader-layout .leader-name,
.card .card-leaders.football-team-leader-layout .football-leader-lastname {
  color: var(--text) !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: 0;
}

.card .card-leaders.team-leader-layout .leader-number,
.card .card-leaders.football-team-leader-layout .football-leader-statline {
  color: var(--text) !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  line-height: 1.25 !important;
  font-variant-numeric: tabular-nums;
}

/* Put NFL category and player on the first line,
   with the stat summary consistently below. */

.card .football-team-leader-layout .football-stat-row {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 2px !important;
  min-height: 0 !important;
  padding: 1px 0 !important;
}

.card .football-team-leader-layout .football-leader-copy {
  display: flex !important;
  flex-direction: row !important;
  align-items: baseline !important;
  gap: 4px !important;
  width: 100%;
  min-width: 0;
}

.card .football-team-leader-layout .football-leader-lastname {
  display: block !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  color: var(--text) !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.card .football-team-leader-layout .football-leader-statline {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--text) !important;
  font-size: 8.5px !important;
  font-weight: 750 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  text-align: left !important;
}

/* Keep both sides aligned in narrow mobile score cards. */

@media (max-width: 640px) {
  .card .card-leaders.team-leader-layout .card-leader-side,
  .card .card-leaders.football-team-leader-layout .football-card-leader-side {
    padding: 5px 6px !important;
  }

  .card .card-leaders.team-leader-layout .card-leader-heading,
  .card .card-leaders.football-team-leader-layout .card-leader-heading {
    font-size: 8px !important;
  }

  .card .card-leaders.team-leader-layout .leader-label,
  .card .card-leaders.football-team-leader-layout .leader-label {
    font-size: 7px !important;
  }

  .card .card-leaders.team-leader-layout .leader-name,
  .card .card-leaders.football-team-leader-layout .football-leader-lastname {
    font-size: 8.5px !important;
  }

  .card .card-leaders.team-leader-layout .leader-number,
  .card .card-leaders.football-team-leader-layout .football-leader-statline {
    font-size: 8.5px !important;
  }
}

/* GLASS_SCORES_CROSS_SPORT_TYPE_V1_END */
/* GLASS_SCORES_SCROLL_REPAIR_V1
   Keep the sports drawer out of document flow and restore feed scrolling. */

#mobileSportsDrawer[hidden],
#mobileSportsBackdrop[hidden] {
  display: none !important;
}

#mobileSportsDrawer:not(.is-open) {
  visibility: hidden;
  pointer-events: none;
}

.pwa-web .dashboard-layout {
  flex: 1 1 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

.pwa-web .dashboard-main {
  min-height: 0 !important;
  overflow: hidden !important;
}

.pwa-web .home-view-panel {
  min-height: 0 !important;
}

.pwa-web .scores-panel {
  display: flex !important;
  flex: 1 1 0 !important;
  flex-direction: column !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

.pwa-web #list.list {
  display: grid !important;
  flex: 1 1 0 !important;
  min-height: 0 !important;
  width: 100%;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  scrollbar-width: thin;
}

@media (max-width: 640px) {
  .pwa-web .mobile-sports-drawer.is-open {
    display: flex !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 1101 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateX(0) !important;
  }
}

@media (min-width: 641px) {
  .mobile-sports-nav,
  .mobile-sports-drawer,
  .mobile-sports-backdrop {
    display: none !important;
  }
}

/* GLASS_SCORES_SCROLL_REPAIR_V1_END */
/* GLASS_SCORES_BIG_DISPLAY_READABILITY_V1
   Prioritize readable score cards on large desktop displays. */

@media (min-width: 1500px) {

  /* Five-ish wider cards rather than a dense wall of small cards. */
  #list.list {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)) !important;
    align-content: start !important;
    align-items: stretch !important;
    gap: 14px !important;
    padding: 2px 5px 18px !important;
  }

  #list.list > .card {
    min-width: 0;
    padding: 14px 15px 13px !important;
    border-radius: 16px !important;
  }

  /* More readable game header and controls. */
  #list.list .card-top {
    min-height: 25px !important;
    height: auto !important;
    margin-bottom: 8px !important;
    gap: 8px !important;
  }

  #list.list .card-top .status {
    font-size: 13px !important;
    line-height: 1.35 !important;
    font-weight: 900 !important;
  }

  #list.list .card-top .tag {
    font-size: 11px !important;
    font-weight: 800 !important;
  }

  #list.list .stats-pill-hint.open-match-pill {
    min-height: 32px !important;
    padding: 6px 12px !important;
    font-size: 11.5px !important;
  }

  #list.list .game-watch-btn {
    min-height: 35px !important;
    padding: 7px 12px !important;
    font-size: 11.5px !important;
  }

  /* Consistent team rows across every sport. */
  #list.list .card .team {
    min-height: 62px !important;
    height: auto !important;
    column-gap: 9px !important;
  }

  #list.list .card .team .abbr {
    font-size: 17px !important;
    line-height: 1.3 !important;
    font-weight: 900 !important;
  }

  #list.list .card .team .record {
    font-size: 13px !important;
    line-height: 1.3 !important;
  }

  #list.list .card .team .score {
    min-width: 36px !important;
    font-size: 27px !important;
    line-height: 1.15 !important;
    font-weight: 950 !important;
  }

  /* Shared NBA, CBB and NFL leader panels. */
  #list.list .card-leaders.team-leader-layout,
  #list.list .card-leaders.football-team-leader-layout {
    gap: 9px !important;
    margin-top: 9px !important;
    padding-top: 9px !important;
  }

  #list.list .card-leaders.team-leader-layout .card-leader-side,
  #list.list .card-leaders.football-team-leader-layout .football-card-leader-side {
    padding: 9px 10px !important;
    border-radius: 11px !important;
  }

  #list.list .card-leaders.team-leader-layout .card-leader-heading,
  #list.list .card-leaders.football-team-leader-layout .card-leader-heading {
    min-height: 0 !important;
    margin-bottom: 7px !important;
    font-size: 10px !important;
    line-height: 1.3 !important;
    font-weight: 900 !important;
  }

  #list.list .card-leaders.team-leader-layout .leader-chip {
    gap: 6px !important;
    padding: 3px 0 !important;
    font-size: 11px !important;
  }

  #list.list .card-leaders.team-leader-layout .leader-label,
  #list.list .card-leaders.football-team-leader-layout .leader-label {
    font-size: 9px !important;
    line-height: 1.25 !important;
  }

  #list.list .card-leaders.team-leader-layout .leader-name,
  #list.list .card-leaders.football-team-leader-layout .football-leader-lastname {
    font-size: 11.5px !important;
    line-height: 1.3 !important;
  }

  #list.list .card-leaders.team-leader-layout .leader-number,
  #list.list .card-leaders.football-team-leader-layout .football-leader-statline {
    font-size: 11px !important;
    line-height: 1.35 !important;
  }

  /* Other sports' matchup-wide leader strips. */
  #list.list .card-leaders:not(.team-leader-layout) .leader-chip {
    gap: 7px !important;
    font-size: 11.5px !important;
  }

  #list.list .card-leaders:not(.team-leader-layout) .leader-name,
  #list.list .card-leaders:not(.team-leader-layout) .leader-label {
    font-size: 11px !important;
    line-height: 1.35 !important;
  }

  #list.list .card-leaders:not(.team-leader-layout) .leader-number {
    font-size: 13px !important;
  }

  /* More prominent featured game. */
  .featured-game {
    min-height: 200px !important;
    padding: 22px 24px !important;
    gap: 18px !important;
    border-radius: 18px !important;
  }

  .featured-heading {
    font-size: 12px !important;
  }

  .featured-matchup {
    min-height: 100px !important;
    gap: 14px !important;
  }

  .featured-name {
    font-size: 16px !important;
    font-weight: 850 !important;
  }

  .featured-score {
    font-size: 31px !important;
    font-weight: 950 !important;
  }

  .featured-record,
  .featured-status,
  .featured-vs {
    font-size: 12px !important;
  }

  .featured-open,
  .featured-watch {
    min-height: 34px !important;
    font-size: 11.5px !important;
  }

  /* Search, date selector and navigation. */
  .header .title-main {
    font-size: 19px !important;
  }

  .score-controls .search-box {
    min-height: 46px !important;
  }

  .score-controls .search-input {
    font-size: 14px !important;
  }

  .date-label-btn,
  .date-nav-btn {
    min-height: 43px !important;
    font-size: 13px !important;
  }

  .league-sidebar {
    padding-top: 12px !important;
  }

  .sidebar-heading,
  .sidebar-secondary-heading {
    font-size: 11px !important;
  }

  .league-link {
    min-height: 46px !important;
    font-size: 13px !important;
  }

  .league-mark {
    width: 26px !important;
    height: 26px !important;
    font-size: 17px !important;
  }
}

/* Extra-wide displays: keep a deliberate six-column ceiling. */
@media (min-width: 2200px) {
  #list.list {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 16px !important;
  }

  #list.list > .card {
    padding: 16px 17px 15px !important;
  }

  #list.list .card .team {
    min-height: 68px !important;
  }

  #list.list .card .team .abbr {
    font-size: 19px !important;
  }

  #list.list .card .team .record {
    font-size: 14px !important;
  }

  #list.list .card .team .score {
    font-size: 30px !important;
  }

  #list.list .card-leaders.team-leader-layout .leader-name,
  #list.list .card-leaders.football-team-leader-layout .football-leader-lastname {
    font-size: 12.5px !important;
  }

  #list.list .card-leaders.team-leader-layout .leader-number,
  #list.list .card-leaders.football-team-leader-layout .football-leader-statline {
    font-size: 12px !important;
  }
}

/* GLASS_SCORES_BIG_DISPLAY_READABILITY_V1_END */
/* GLASS_SCORES_UFC_RANKINGS_NO_RECORDS_V1
   UFCalendar rankings do not include records in the board response. */

.ufc-rankings-table.no-records .ufc-rankings-header,
.ufc-rankings-table.no-records .ufc-fighter-row {
  grid-template-columns: 32px minmax(0, 1fr) 48px !important;
}

.ufc-rankings-table.no-records .standing-gb {
  justify-self: end;
  text-align: right;
}

/* GLASS_SCORES_UFC_RANKINGS_NO_RECORDS_V1_END */


/* Scores and Streams: search/future football roster layout */

/* Scores and Streams: search/future football roster layout */

.pregame-football-roster {
  width: 100%;
  min-width: 0;
}

.pregame-football-roster-subtitle {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.3;
  margin: -2px 0 8px;
}

.pregame-football-roster-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: auto;
  margin: 0;
  border: 1px solid var(--card-border);
  border-radius: 8px;
}

.pregame-football-roster-table {
  width: 100%;
  min-width: 680px;
  table-layout: fixed;
  border-collapse: collapse;
}

.pregame-football-roster-table thead th {
  height: 30px;
  padding: 6px 8px;
  text-align: left;
  color: var(--text);
  background: rgba(255,255,255,.035);
  border-bottom: 1px solid var(--card-border);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .03em;
}

.pregame-football-roster-table thead th:nth-child(2),
.pregame-football-roster-table thead th:nth-child(3) {
  text-align: center;
}

.pregame-football-roster-row {
  min-height: 60px;
  border-bottom: 1px solid var(--card-border);
}

.pregame-football-roster-row:last-child {
  border-bottom: 0;
}

.pregame-football-roster-row:hover {
  background: rgba(255,255,255,.035);
}

.pregame-football-roster-row td {
  height: 58px;
  padding: 6px 8px;
  vertical-align: middle;
  box-sizing: border-box;
}

.pregame-football-player-cell {
  display: flex !important;
  align-items: center;
  gap: 10px;
  min-width: 0;
  text-align: left !important;
}

.pregame-football-headshot {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 50%;
  object-fit: cover;
  object-position: center top;
  background: rgba(255,255,255,.08);
}

.pregame-football-headshot-placeholder {
  border: 1px solid var(--card-border);
}

.pregame-football-player-identity {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.pregame-football-player-name {
  display: block;
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pregame-football-player-meta {
  display: block;
  color: var(--muted);
  font-size: 9px;
  font-weight: 650;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pregame-football-position,
.pregame-football-gp {
  text-align: center !important;
  color: var(--text);
  font-size: 11px;
  font-weight: 750;
  white-space: nowrap;
}

.pregame-football-gp {
  font-variant-numeric: tabular-nums;
}

@media (min-width: 1200px) {
  .pregame-football-roster-table {
    min-width: 0;
  }

  .pregame-football-headshot {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
  }

  .pregame-football-player-name {
    font-size: 13px;
  }

  .pregame-football-player-meta {
    font-size: 10px;
  }

  .pregame-football-position,
  .pregame-football-gp {
    font-size: 12px;
  }
}

@media (min-width: 1800px) {
  .pregame-football-roster-table thead th {
    font-size: 10px;
  }

  .pregame-football-roster-row td {
    height: 64px;
  }

  .pregame-football-headshot {
    width: 46px;
    height: 46px;
    flex-basis: 46px;
  }

  .pregame-football-player-name {
    font-size: 14px;
  }

  .pregame-football-player-meta {
    font-size: 10px;
  }
}

/* GLASS_SCORES_MOBILE_FEATURED_COMPACT_V1
   Keep the Featured Game compact on phones while preserving
   the larger desktop presentation. */

@media (max-width: 640px) {

  .featured-game {
    min-height: 0 !important;
    height: auto !important;
    padding: 10px 11px !important;
    gap: 7px !important;
    border-radius: 12px !important;
  }

  .featured-heading {
    font-size: 8.5px !important;
    line-height: 1.1 !important;
    margin: 0 0 2px !important;
  }

  .featured-matchup {
    min-height: 52px !important;
    height: auto !important;
    gap: 7px !important;
  }

  .featured-name {
    font-size: 10px !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
  }

  .featured-score {
    font-size: 22px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
  }

  .featured-record,
  .featured-status,
  .featured-vs {
    font-size: 8.5px !important;
    line-height: 1.1 !important;
  }

  .featured-open,
  .featured-watch {
    min-height: 28px !important;
    height: 28px !important;
    padding: 0 10px !important;
    font-size: 9px !important;
    line-height: 28px !important;
    border-radius: 7px !important;
  }

  /* Prevent the Featured Game from inheriting large desktop
     spacing from the general home-card rules. */
  .featured-game > * {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

/* Extra-small phones */
@media (max-width: 380px) {

  .featured-game {
    padding: 8px 9px !important;
    gap: 5px !important;
    border-radius: 10px !important;
  }

  .featured-matchup {
    min-height: 46px !important;
    gap: 5px !important;
  }

  .featured-name {
    font-size: 9px !important;
  }

  .featured-score {
    font-size: 20px !important;
  }

  .featured-record,
  .featured-status,
  .featured-vs {
    font-size: 7.5px !important;
  }

  .featured-open,
  .featured-watch {
    min-height: 26px !important;
    height: 26px !important;
    font-size: 8.5px !important;
    line-height: 26px !important;
  }
}

/* GLASS_SCORES_MOBILE_FEATURED_COMPACT_V1_END */

/* ============================================================
   GLASS_SCORES_PREGAME_ROSTER_V2
   Team Center-style football roster for Match View
   ============================================================ */

.pregame-roster-title {
  margin-bottom: 4px;
}

.pregame-football-roster-subtitle {
  margin: -2px 0 14px;
  padding: 0 2px;
  font-size: 12px;
  line-height: 1.4;
  color: rgba(255,255,255,.56);
  font-weight: 650;
}

.pregame-football-roster-wrap {
  width: 100%;
  overflow-x: auto;
  border-radius: 14px;
}

.pregame-football-roster-table {
  width: 100%;
  min-width: 620px;
  table-layout: fixed;
}

.pregame-football-roster-table th:nth-child(1) {
  width: 58%;
}

.pregame-football-roster-table th:nth-child(2) {
  width: 24%;
}

.pregame-football-roster-table th:nth-child(3) {
  width: 18%;
}

.pregame-football-roster-row {
  min-height: 68px;
}

.pregame-football-roster-row td {
  vertical-align: middle;
  padding: 12px 14px;
}

.pregame-football-roster-player-cell {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.pregame-football-roster-headshot {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  object-fit: cover;
  object-position: center top;
  border-radius: 10px;
  background: rgba(255,255,255,.07);
}

.pregame-football-roster-headshot-placeholder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.pregame-football-roster-identity {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.pregame-football-roster-name {
  min-width: 0;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  line-height: 1.25;
  font-weight: 800;
}

.pregame-football-roster-meta {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  line-height: 1.25;
  color: rgba(255,255,255,.52);
}

.pregame-football-roster-position {
  font-size: 13px;
  font-weight: 750;
  white-space: nowrap;
}

.pregame-football-roster-gp {
  font-size: 13px;
  font-weight: 800;
  text-align: center;
  white-space: nowrap;
}

.pregame-football-roster-row.clickable-row:hover {
  background: rgba(255,255,255,.055);
}

@media (max-width: 700px) {
  .pregame-football-roster-table {
    min-width: 540px;
  }

  .pregame-football-roster-row td {
    padding: 9px 10px;
  }

  .pregame-football-roster-headshot {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
  }

  .pregame-football-roster-name {
    font-size: 12px;
  }

  .pregame-football-roster-meta {
    font-size: 9px;
  }

  .pregame-football-roster-position,
  .pregame-football-roster-gp {
    font-size: 11px;
  }
}


/* Crisp vector icons for the narrow left navigation rail. */
.app-rail .rail-btn {
  font-size: 0;
}
.app-rail .rail-btn .rail-icon {
  display: block;
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.app-rail .rail-btn .rail-icon-settings {
  width: 16px;
  height: 16px;
  flex-basis: 16px;
}


/* ================================================================
   Match Center: show only the selected pane and let it use the full
   available height. This is the canonical web + desktop pane layout.
   ================================================================ */
#statsDrawer .detail-panes {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
}

#statsDrawer .detail-panes > .pane {
  display: none !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

#statsDrawer[data-view="box"] .detail-panes > .pane-box,
#statsDrawer[data-view="shots"] .detail-panes > .pane-shots,
#statsDrawer[data-view="pbp"] .detail-panes > .pane-pbp,
#statsDrawer[data-view="prob"] .detail-panes > .pane-prob,
#statsDrawer[data-view="watch"] .detail-panes > .pane-watch,
#statsDrawer.soccer-game[data-view="soccer-stats"] .detail-panes > .pane-soccer-stats,
#statsDrawer.soccer-game[data-view="soccer-lineups"] .detail-panes > .pane-soccer-lineups,
#statsDrawer.soccer-game[data-view="soccer-timeline"] .detail-panes > .pane-soccer-timeline,
#statsDrawer.soccer-game[data-view="soccer-players"] .detail-panes > .pane-soccer-players {
  display: flex !important;
}

#statsDrawer .detail-panes > .pane > .overlay-body {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  box-sizing: border-box !important;
}

#statsDrawer .pane-shots > #shotsToolbar,
#statsDrawer .pane-pbp > #pbpToolbar {
  flex: 0 0 auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

#statsDrawer .pane-shots > #shotsBody,
#statsDrawer .pane-pbp > #pbpBody,
#statsDrawer .pane-box > #statsBody,
#statsDrawer .pane-prob > #probabilityBody {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
}

#statsDrawer .pane-watch > #watchStatus,
#statsDrawer .pane-watch > #watchProvider {
  flex: 0 0 auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}


/* UFC fighter portraits: keep a consistent avatar when no photo is published. */
#playerModalBody .ufc-profile-headshot-fallback {
  display: inline-grid;
  place-items: center;
  width: 112px;
  height: 112px;
  flex: 0 0 112px;
  border-radius: 50%;
  border: 2px solid var(--card-border);
  background: radial-gradient(circle at 35% 25%, rgba(150,130,255,.28), rgba(255,255,255,.06) 70%);
  color: var(--text);
  font-size: 29px;
  font-weight: 950;
  letter-spacing: .03em;
}
.ufc-fighter-card-headshot-fallback {
  display: inline-grid;
  place-items: center;
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 25%, rgba(150,130,255,.28), rgba(255,255,255,.06) 70%);
  border: 1px solid var(--card-border);
  color: var(--text);
  font-size: 15px;
  font-weight: 900;
}


/* Watch Live stage layout: centered launch control with a fixed source bar. */
#statsDrawer[data-view="watch"] .pane-watch {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  align-items: stretch !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  padding: 0 !important;
  gap: 0 !important;
  overflow: hidden !important;
}
#statsDrawer[data-view="watch"] .watch-stage {
  display: flex !important;
  position: relative !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  min-height: 220px !important;
  width: 100% !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: radial-gradient(ellipse at center, #080b10 0%, #030405 66%, #010203 100%) !important;
}
#statsDrawer[data-view="watch"] .watch-launcher {
  display: flex !important;
  flex: 1 1 auto !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 24px !important;
  gap: 10px !important;
  flex-direction: column !important;
  text-align: center !important;
  background: transparent !important;
}
#statsDrawer[data-view="watch"] #watchPlayBtn {
  display: grid !important;
  place-items: center !important;
  width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  min-height: 54px !important;
  margin: 0 0 2px !important;
  padding: 0 0 0 3px !important;
  border-radius: 50% !important;
  font-size: 21px !important;
  line-height: 1 !important;
}
#statsDrawer[data-view="watch"] #watchPlayBtn:disabled {
  opacity: .48 !important;
  cursor: not-allowed !important;
}
#statsDrawer[data-view="watch"] .watch-launcher-title {
  margin-top: 0 !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  color: #f5f7fb !important;
}
#statsDrawer[data-view="watch"] #watchStatus {
  position: static !important;
  display: block !important;
  flex: 0 1 auto !important;
  max-width: min(650px, 100%) !important;
  max-height: 110px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  overflow: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: rgba(238,241,248,.84) !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
  text-align: center !important;
  white-space: pre-wrap !important;
}
#statsDrawer[data-view="watch"] .watch-source-row {
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  min-width: 0 !important;
  min-height: 52px !important;
  width: 100% !important;
  gap: 10px !important;
  padding: 9px 10px 4px !important;
  border-top: 1px solid var(--card-border) !important;
  background: rgba(27,29,33,.92) !important;
  box-sizing: border-box !important;
}
#statsDrawer[data-view="watch"] .watch-source-row label,
#statsDrawer[data-view="watch"] .watch-resolution-label {
  flex: 0 0 auto !important;
  margin: 0 !important;
  color: rgba(240,242,248,.82) !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  letter-spacing: .035em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}
#statsDrawer[data-view="watch"] #watchSourceSelect {
  display: block !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 36px !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 9px !important;
  background: #292b30 !important;
  color: #d8dbe2 !important;
  font-size: 11px !important;
}
#statsDrawer[data-view="watch"] #watchSourceResolution {
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  min-width: 50px !important;
  min-height: 32px !important;
  padding: 4px 9px !important;
  border: 1px solid rgba(120,180,255,.24) !important;
  border-radius: 8px !important;
  background: rgba(42,117,215,.12) !important;
  color: #e7edf9 !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}
#statsDrawer[data-view="watch"] .watch-meta {
  flex: 0 0 auto !important;
  min-height: 22px !important;
  padding: 2px 10px 5px !important;
  background: rgba(27,29,33,.92) !important;
  color: rgba(220,224,232,.62) !important;
  font-size: 10px !important;
}
#statsDrawer[data-view="watch"] .watch-launcher[hidden],
#statsDrawer[data-view="watch"] .watch-launcher-icon[hidden],
#statsDrawer[data-view="watch"] .watch-launcher-title[hidden] {
  display: none !important;
}
@media (max-width: 620px) {
  #statsDrawer[data-view="watch"] .watch-source-row {
    gap: 6px !important;
    padding-left: 7px !important;
    padding-right: 7px !important;
  }
  #statsDrawer[data-view="watch"] .watch-source-row label,
  #statsDrawer[data-view="watch"] .watch-resolution-label {
    font-size: 8px !important;
  }
  #statsDrawer[data-view="watch"] #watchSourceSelect {
    font-size: 10px !important;
    padding-left: 8px !important;
  }
  #statsDrawer[data-view="watch"] #watchSourceResolution {
    min-width: 40px !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
}


/* UFC ESPN fight-history event and finish details. */
#playerModalBody .ufc-profile-fight-event {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}
#playerModalBody .ufc-profile-fight-method {
  color: #d8dce5;
  font-size: 10px;
  font-weight: 750;
  text-align: right;
}
#playerModalBody .ufc-profile-result-badge.draw {
  color: #f3c969;
  border-color: rgba(243,201,105,.35);
  background: rgba(243,201,105,.09);
}


/* ================================================================
   Sports Streams hub: addon-driven sports and 24/7 catalog browser
   ================================================================ */
.streams-panel {
  display: flex;
  flex-direction: column;
  flex: 1 1 0;
  min-width: 0;
  min-height: 0;
  gap: 12px;
  padding: 12px 4px 10px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.streams-hub-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
}
.streams-hub-heading { min-width: 0; }
.streams-hub-heading h1 {
  margin: 0;
  font-size: clamp(18px, 2vw, 24px);
  line-height: 1.2;
  font-weight: 900;
  color: var(--text);
}
.streams-hub-heading p {
  margin: 5px 0 0;
  max-width: 760px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}
.streams-refresh-btn,
.stream-catalog-more button,
.stream-source-retry {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid var(--card-border);
  border-radius: 9px;
  background: var(--card);
  color: var(--text);
  font-size: 10px;
  font-weight: 850;
  cursor: pointer;
  white-space: nowrap;
}
.streams-refresh-btn:hover,
.stream-catalog-more button:hover,
.stream-source-retry:hover { border-color: var(--accent); background: var(--hover); }
.stream-category-nav {
  display: flex;
  align-items: stretch;
  gap: 7px;
  width: 100%;
  min-width: 0;
  padding: 2px 1px 7px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
}
.stream-category-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  gap: 7px;
  min-height: 37px;
  padding: 0 12px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: var(--card);
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.stream-category-btn:hover { color: var(--text); border-color: rgba(150,130,255,.55); }
.stream-category-btn.active {
  color: var(--text);
  background: rgba(144,124,255,.17);
  border-color: rgba(144,124,255,.58);
  box-shadow: inset 0 0 0 1px rgba(144,124,255,.1);
}
.stream-category-icon { font-size: 15px; line-height: 1; }
.stream-category-label { max-width: 160px; overflow: hidden; text-overflow: ellipsis; }
.stream-hub-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}
#streamCatalogSearch {
  flex: 1 1 260px;
  min-width: 120px;
  height: 37px;
  padding: 0 12px;
  border: 1px solid var(--card-border);
  border-radius: 9px;
  outline: none;
  background: var(--card);
  color: var(--text);
  font-size: 11px;
}
#streamCatalogSearch:focus { border-color: var(--accent); }
.stream-type-filters { display: flex; align-items: center; gap: 5px; flex: 0 0 auto; }
.stream-type-filter {
  min-height: 30px;
  padding: 0 9px;
  border: 1px solid var(--card-border);
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  cursor: pointer;
  white-space: nowrap;
}
.stream-type-filter.active { border-color: rgba(144,124,255,.58); background: rgba(144,124,255,.17); color: var(--text); }
.stream-catalog-status {
  min-height: 15px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.4;
}
.stream-catalog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
  align-content: start;
  align-items: start;
  gap: 10px;
  min-width: 0;
}
.stream-catalog-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  padding: 11px;
  border: 1px solid var(--card-border);
  border-radius: 12px;
  background: var(--card);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.stream-catalog-card-head {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.stream-catalog-poster {
  display: block;
  width: 56px;
  height: 70px;
  flex: 0 0 56px;
  border-radius: 8px;
  background: rgba(255,255,255,.07);
  object-fit: cover;
}
.stream-catalog-card-copy {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}
.stream-catalog-badges { display: flex; flex-wrap: wrap; gap: 5px; }
.stream-catalog-badge {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  padding: 2px 6px;
  border: 1px solid var(--card-border);
  border-radius: 5px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .045em;
  text-transform: uppercase;
}
.stream-catalog-badge.always-on {
  border-color: rgba(68,210,144,.36);
  background: rgba(68,210,144,.11);
  color: #6fe0aa;
}
.stream-catalog-title {
  display: block;
  min-width: 0;
  color: var(--text);
  font-size: 12px;
  line-height: 1.3;
  font-weight: 850;
  overflow-wrap: anywhere;
}
.stream-catalog-description {
  display: -webkit-box;
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.4;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.stream-catalog-actions { display: flex; justify-content: flex-end; }
.stream-catalog-open-btn {
  min-height: 29px;
  padding: 0 10px;
  border: 1px solid rgba(144,124,255,.36);
  border-radius: 8px;
  background: rgba(144,124,255,.12);
  color: var(--text);
  font-size: 9px;
  font-weight: 900;
  cursor: pointer;
}
.stream-catalog-open-btn:hover { background: rgba(144,124,255,.24); border-color: var(--accent); }
.stream-catalog-open-btn:disabled { opacity: .55; cursor: wait; }
.stream-catalog-sources {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding-top: 9px;
  border-top: 1px solid var(--card-border);
}
.stream-source-empty,
.stream-source-note,
.stream-hub-empty {
  padding: 12px;
  border: 1px dashed var(--card-border);
  border-radius: 8px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.5;
}
.stream-source-note { border: 0; padding: 0; font-size: 9px; }
.stream-source-group { display: flex; flex-direction: column; gap: 6px; }
.stream-source-group-title {
  color: var(--muted);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .08em;
}
.stream-source-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  min-width: 0;
  min-height: 42px;
  padding: 7px 9px;
  border: 1px solid var(--card-border);
  border-radius: 8px;
  background: rgba(255,255,255,.025);
  color: var(--text);
  text-align: left;
  cursor: pointer;
}
.stream-source-option:hover { border-color: var(--accent); background: var(--hover); }
.stream-source-option-copy { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.stream-source-option-copy strong {
  font-size: 10px;
  font-weight: 850;
  overflow-wrap: anywhere;
}
.stream-source-option-copy small { color: var(--muted); font-size: 8px; font-weight: 700; }
.stream-source-play {
  flex: 0 0 auto;
  color: #75d9a5;
  font-size: 9px;
  font-weight: 900;
}
.stream-catalog-more { display: flex; justify-content: center; padding: 5px 0 10px; }
.stream-hub-empty { grid-column: 1 / -1; text-align: center; padding: 24px; }

@media (max-width: 720px) {
  .streams-panel { gap: 10px; padding: 8px 2px; }
  .streams-hub-header { align-items: center; }
  .streams-hub-heading p { font-size: 9px; }
  .streams-refresh-btn { min-height: 31px; padding: 0 8px; font-size: 9px; }
  .stream-hub-toolbar { align-items: stretch; flex-direction: column; }
  #streamCatalogSearch { flex: 0 0 36px; width: 100%; box-sizing: border-box; }
  .stream-type-filters { justify-content: flex-start; }
  .stream-catalog-grid { grid-template-columns: minmax(0, 1fr); }
}

:root[data-theme="light"] .streams-hub-heading h1,
:root[data-theme="light"] .stream-catalog-title { color: #25282e; }
:root[data-theme="light"] .stream-catalog-badge.always-on { color: #16784c; }


/* Keep every compatible stream-type filter reachable on narrow screens. */
.stream-type-filters {
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}
.stream-type-filter {
  flex: 0 0 auto;
}


/* Live Sports Streams navigation in the left vertical league sidebar. */
.stream-sidebar-categories { display:flex; flex-direction:column; width:100%; min-width:0; }
.stream-sidebar-category { min-height:39px; grid-template-columns:25px minmax(0,1fr) 14px; font-size:10px; }
.stream-sidebar-icon { background:rgba(255,255,255,.10); font-size:12px; }
.stream-sidebar-category.active { background:linear-gradient(90deg,rgba(80,185,135,.20),rgba(80,185,135,.04)); box-shadow:inset 3px 0 0 #53d69a; }
#streamSidebarHeading[hidden] { display:none !important; }
.stream-category-nav { display:none !important; }
.stream-catalog-badge.live-now { border-color:rgba(68,210,144,.38); background:rgba(68,210,144,.12); color:#6fe0aa; }
.stream-source-option { width:100%; box-sizing:border-box; }
.stream-source-option-copy { flex:1 1 auto; width:100%; max-width:100%; }
.stream-source-option-copy strong,
.stream-source-option-copy small { white-space:normal !important; overflow:visible !important; text-overflow:clip !important; overflow-wrap:anywhere !important; word-break:break-word; }
.stream-source-option-copy .stream-source-option-url { display:block; max-width:100%; padding-top:2px; color:var(--muted); font-size:8px; line-height:1.45; white-space:normal !important; overflow-wrap:anywhere !important; word-break:break-all !important; user-select:text; }



/* ================================================================
   Motorsports: standalone Formula 1 sport page (ESPN data)
   ================================================================ */
.motorsports-sport-link .motorsports-mark {
  background: rgba(255, 255, 255, .10);
  font-size: 13px;
}
.motorsports-panel {
  display: flex;
  flex-direction: column;
  flex: 1 1 0;
  min-width: 0;
  min-height: 0;
  gap: 12px;
  padding: 14px 10px 16px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.motorsports-panel[hidden] { display: none !important; }
.motorsports-active .main-view-tabs { display: none !important; }
.motorsports-page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex: 0 0 auto;
}
.motorsports-eyebrow {
  color: #f05b5b;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .16em;
}
.motorsports-page-title h1 {
  margin: 4px 0 0;
  color: var(--text);
  font-size: clamp(22px, 2.4vw, 30px);
  font-weight: 950;
  letter-spacing: -.04em;
}
.motorsports-page-title p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}
.motorsports-refresh-btn {
  flex: 0 0 auto;
  min-height: 35px;
  padding: 0 12px;
  border: 1px solid var(--card-border);
  border-radius: 9px;
  background: var(--card);
  color: var(--text);
  font-size: 10px;
  font-weight: 850;
  cursor: pointer;
}
.motorsports-refresh-btn:hover { border-color: #e85b5b; background: var(--hover); }
.motorsports-status {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
  min-height: 14px;
}
.motorsports-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.motorsports-stat-card,
.motorsports-section {
  min-width: 0;
  border: 1px solid var(--card-border);
  border-radius: 13px;
  background: var(--card);
  box-shadow: inset 0 1px rgba(255,255,255,.025);
}
.motorsports-stat-card { padding: 11px 12px; }
.motorsports-stat-label {
  color: var(--faint);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .1em;
}
.motorsports-stat-value {
  margin-top: 6px;
  color: var(--text);
  font-size: clamp(13px, 1.5vw, 18px);
  font-weight: 900;
  line-height: 1.15;
  overflow-wrap: anywhere;
}
.motorsports-stat-detail {
  margin-top: 4px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
}
.motorsports-feature-grid,
.motorsports-standings-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
  min-width: 0;
}
.motorsports-section { padding: 12px; }
.motorsports-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  margin-bottom: 10px;
}
.motorsports-section-heading h2 {
  margin: 0;
  color: var(--text);
  font-size: 12px;
  font-weight: 900;
}
.motorsports-section-heading span {
  color: var(--faint);
  font-size: 7px;
  font-weight: 900;
  letter-spacing: .11em;
  white-space: nowrap;
}
.motorsports-next-race-content { min-height: 132px; }
.motorsports-next-race-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 126px;
  padding: 17px;
  border-radius: 10px;
  background: radial-gradient(ellipse at 90% 10%, rgba(231,55,55,.19), transparent 55%), linear-gradient(125deg, rgba(75,34,38,.55), rgba(28,30,34,.28));
  border: 1px solid rgba(230,80,80,.23);
}
.motorsports-next-race-kicker {
  color: #f27676;
  font-size: 8px;
  font-weight: 950;
  letter-spacing: .16em;
}
.motorsports-next-race-name {
  margin-top: 7px;
  color: var(--text);
  font-size: clamp(17px, 2vw, 24px);
  font-weight: 950;
  line-height: 1.15;
}
.motorsports-next-race-dates {
  margin-top: 7px;
  color: var(--text);
  font-size: 11px;
  font-weight: 800;
}
.motorsports-next-race-note {
  margin-top: 7px;
  color: var(--muted);
  font-size: 9px;
}
.motorsports-results-subheading {
  margin: 0 0 7px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
}
.motorsports-table-scroll { width: 100%; overflow-x: auto; }
.motorsports-data-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  font-variant-numeric: tabular-nums;
}
.motorsports-data-table th {
  padding: 7px 6px;
  border-bottom: 1px solid var(--card-border);
  color: var(--faint);
  font-size: 7px;
  font-weight: 900;
  letter-spacing: .08em;
  white-space: nowrap;
}
.motorsports-data-table td {
  padding: 8px 6px;
  border-bottom: 1px solid rgba(255,255,255,.045);
  color: var(--muted);
  font-size: 9px;
  font-weight: 650;
  white-space: nowrap;
}
.motorsports-data-table tbody tr:last-child td { border-bottom: 0; }
.motorsports-data-table tbody tr:hover { background: rgba(255,255,255,.035); }
.motorsports-data-table td.motorsports-position {
  width: 28px;
  color: var(--faint);
  font-weight: 900;
}
.motorsports-data-table td.motorsports-points {
  color: var(--text);
  font-weight: 950;
}
.motorsports-calendar-section { flex: 0 0 auto; }
.motorsports-calendar-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}
.motorsports-calendar-card {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--card-border);
  border-radius: 9px;
  background: rgba(255,255,255,.025);
}
.motorsports-calendar-card.completed { opacity: .63; }
.motorsports-calendar-date {
  color: #f27676;
  font-size: 8px;
  font-weight: 900;
}
.motorsports-calendar-name {
  margin-top: 5px;
  color: var(--text);
  font-size: 9px;
  font-weight: 850;
  line-height: 1.35;
}
.motorsports-calendar-state {
  margin-top: 6px;
  color: var(--faint);
  font-size: 7px;
  font-weight: 850;
  letter-spacing: .08em;
}
.motorsports-empty {
  padding: 18px 10px;
  color: var(--muted);
  font-size: 9px;
  text-align: center;
}
:root[data-theme="light"] .motorsports-next-race-card {
  background: linear-gradient(125deg, rgba(255,237,237,.94), rgba(246,240,240,.86));
}
:root[data-theme="light"] .motorsports-data-table td { border-bottom-color: rgba(25,27,30,.08); }

@media (max-width: 1000px) {
  .motorsports-summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .motorsports-calendar-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 720px) {
  .motorsports-panel { padding: 8px 2px 12px; gap: 9px; }
  .motorsports-feature-grid,
  .motorsports-standings-grid { grid-template-columns: minmax(0,1fr); }
  .motorsports-calendar-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .motorsports-page-title p { max-width: 320px; }
  .motorsports-section { padding: 9px; }
}
@media (max-width: 420px) {
  .motorsports-page-header { align-items: flex-start; }
  .motorsports-refresh-btn { min-height: 31px; padding: 0 8px; font-size: 9px; }
  .motorsports-summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .motorsports-stat-card { padding: 9px; }
  .motorsports-calendar-grid { grid-template-columns: minmax(0,1fr); }
}


/* Motorsports-only stream catalog embedded inside the Motorsports sport page. */
.motorsports-streams-section { display:flex; flex-direction:column; gap:10px; min-width:0; }
.motorsports-streams-heading { align-items:flex-start; }
.motorsports-streams-heading > div { min-width:0; }
.motorsports-streams-heading p { margin:4px 0 0; color:var(--muted); font-size:9px; }
.motorsports-stream-toolbar { align-items:center; }
.motorsports-streams-section .stream-catalog-grid { max-height:560px; overflow-y:auto; overscroll-behavior:contain; }
.motorsports-streams-section .stream-catalog-card { background:rgba(255,255,255,.025); }
:root[data-theme="light"] .motorsports-streams-section .stream-catalog-card { background:rgba(30,34,40,.035); }
.motorsports-session-schedule { display:flex; flex-direction:column; gap:6px; margin-top:14px; padding-top:10px; border-top:1px solid rgba(255,255,255,.10); }
.motorsports-session-schedule-title { margin-bottom:2px; color:var(--faint); font-size:8px; font-weight:950; letter-spacing:.1em; }
.motorsports-session-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:5px 0; }
.motorsports-session-name { color:var(--text); font-size:9px; font-weight:800; }
.motorsports-session-time { color:var(--muted); font-size:9px; font-weight:750; text-align:right; white-space:nowrap; }
@media (max-width:720px) {
  .motorsports-streams-heading { flex-direction:column; align-items:stretch; }
  .motorsports-stream-toolbar { align-items:stretch; }
  .motorsports-session-row { align-items:flex-start; }
}


/* F1 calendar: race start time, meeting location and weekend sessions. */
.motorsports-race-start {
  margin-top: 11px;
  padding: 8px 10px;
  border: 1px solid rgba(240,91,91,.28);
  border-radius: 8px;
  background: rgba(240,91,91,.09);
  color: var(--text);
  font-size: 10px;
  font-weight: 900;
}
.motorsports-calendar-card.next {
  border-color: rgba(240,91,91,.52);
  box-shadow: inset 3px 0 0 rgba(240,91,91,.75);
}
.motorsports-calendar-location {
  margin-top: 5px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 650;
  line-height: 1.35;
}
.motorsports-calendar-race-time {
  margin-top: 8px;
  color: var(--text);
  font-size: 9px;
  font-weight: 900;
}
.motorsports-calendar-sessions {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 7px;
}
.motorsports-calendar-session-pill {
  display: inline-flex;
  padding: 3px 5px;
  border: 1px solid var(--card-border);
  border-radius: 5px;
  color: var(--muted);
  font-size: 7px;
  font-weight: 750;
  line-height: 1.3;
}
.motorsports-calendar-state { margin-top: 8px; }
@media (max-width: 720px) {
  .motorsports-calendar-sessions { gap: 3px; }
  .motorsports-calendar-session-pill { font-size: 7px; }
}


/* F1 session chips are real controls so they can drive the shared date bar. */
.motorsports-session-select,
.motorsports-calendar-session-pill {
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 7px;
  background: rgba(255,255,255,.055);
  color: var(--text);
  cursor: pointer;
  font: inherit;
  text-align: left;
}
.motorsports-session-select { padding: 4px 7px; }
.motorsports-session-select:hover,
.motorsports-calendar-session-pill:hover {
  border-color: rgba(240,91,91,.55);
  background: rgba(240,91,91,.12);
}
.motorsports-calendar-session-pill { padding: 4px 6px; }
:root[data-theme="light"] .motorsports-session-select,
:root[data-theme="light"] .motorsports-calendar-session-pill {
  border-color: rgba(25,27,30,.14);
  background: rgba(25,27,30,.045);
}


/* Prevent the shared date selector from clipping its date label. */
#dateBar {
  min-height: 54px !important; box-sizing: border-box; overflow: visible !important;
  align-items: center !important; padding: 5px 8px !important;
}
#dateBar .date-center { min-width: 0; min-height: 42px; align-items: center; justify-content: center; }
#dateBar .date-label-btn {
  min-height: 42px !important; height: auto !important; box-sizing: border-box;
  display: inline-flex; align-items: center; justify-content: center;
  white-space: nowrap !important; line-height: 1.25 !important;
  padding: 7px 9px !important; overflow: visible !important;
}
#dateBar #dateLabel { display: inline-block; white-space: nowrap !important; line-height: 1.25 !important; }
#dateBar .date-nav-btn { flex: 0 0 30px; width: 30px; height: 36px; min-height: 36px; }

/* Shared date selector: keep "Wed, Nov 4" on one line (never wraps the day number). */
@media (min-width: 1001px) {
  .score-controls .date-bar { flex: 0 0 220px; min-width: 210px; max-width: 220px; }
}
#dateBar .date-center { flex: 1 1 auto; white-space: nowrap; }
#dateBar .date-label-btn { flex: 0 0 auto; white-space: nowrap !important; }
#dateBar #dateLabel { white-space: nowrap !important; }

/* Standings page header (title, subtitle and sport selector). */
.standings-page-header {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 14px;
  padding: 4px 2px 14px;
}
.standings-page-title h1 { margin: 0 0 4px; font-size: 26px; line-height: 1.1; font-weight: 900; }
.standings-page-title .hub-subtitle { margin: 0; font-size: 11px; }
.standings-league-select {
  min-height: 38px; padding: 0 12px; border-radius: 10px; font-weight: 800; font-size: 12px;
  color: inherit; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12);
}
.standings-league-select option { color: #111; background: #fff; }
.standings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 11px; align-content: start; }
@media (max-width: 620px) {
  .standings-page-header { flex-direction: column; align-items: stretch; }
}


/* GLASS_SCORES_MOBILE_PINNED_FEATURED_COMPACT_V1 */
@media (max-width: 900px) {
  /* A pinned matchup is a shortcut, not a second hero banner.
     Keep it compact so the live scoreboard remains visible sooner. */
  .featured-game.is-pinned {
    min-height: 0 !important;
    height: auto !important;
    padding: 10px 13px !important;
    gap: 7px !important;
    border-radius: 13px !important;
  }

  .featured-game.is-pinned .featured-heading {
    min-height: 14px !important;
    margin: 0 !important;
    font-size: 9px !important;
    line-height: 1.1 !important;
  }

  .featured-game.is-pinned .featured-matchup {
    min-height: 54px !important;
    height: auto !important;
    gap: 7px !important;
  }

  .featured-game.is-pinned .featured-logo {
    width: 38px !important;
    height: 38px !important;
  }

  .featured-game.is-pinned .featured-name {
    font-size: 11px !important;
    line-height: 1.15 !important;
  }

  .featured-game.is-pinned .featured-score {
    font-size: 23px !important;
    line-height: 1 !important;
  }

  .featured-game.is-pinned .featured-record,
  .featured-game.is-pinned .featured-status,
  .featured-game.is-pinned .featured-vs {
    font-size: 9px !important;
    line-height: 1.1 !important;
  }

  .featured-game.is-pinned .featured-actions {
    gap: 7px !important;
  }

  .featured-game.is-pinned .featured-open,
  .featured-game.is-pinned .featured-watch {
    min-height: 29px !important;
    height: 29px !important;
    padding: 0 11px !important;
    font-size: 9px !important;
    line-height: 29px !important;
  }

  .featured-game.is-pinned .f1-featured-race {
    gap: 4px !important;
    padding: 4px 0 !important;
  }

  .featured-game.is-pinned .f1-featured-race-name {
    font-size: 17px !important;
  }
}

/* If a team has no usable logo, use its readable school name as a wordmark. */
.team-logo-frame.team-logo-text-fallback {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  width: auto !important;
  min-width: 0;
  max-width: 104px;
  height: auto !important;
  min-height: 18px;
  overflow: visible;
  flex: 0 1 auto;
}
.team-logo-frame.team-logo-text-fallback .team-logo-fallback {
  display: block;
  width: auto;
  height: auto;
  max-width: 104px;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--text);
  font-size: 8px;
  line-height: 1.15;
  font-weight: 900;
  letter-spacing: 0;
  text-align: left;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.team-logo-frame.team-logo-text-fallback .team-logo-fallback[hidden] { display: none !important; }

/* Final override: legacy PWA/card selectors force logo images to display:block.
   A failed logo must be fully removed so the text wordmark is unobstructed. */
.card .team-logo-frame.team-logo-text-fallback > img.logo,
.pwa-web .card .team-logo-frame.team-logo-text-fallback > img.logo,
.card .team .abbr[hidden] {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 0 !important;
  max-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* WATCH AVAILABILITY SEMANTICS
   Neutral means not checked or no compatible stream found.
   Green is reserved exclusively for a confirmed playable source. */
.game-watch-btn,
.featured-watch {
  border-color: rgba(190, 198, 210, .22) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.045)) !important;
  color: rgba(235, 239, 246, .78) !important;
  text-shadow: none !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
  filter: none !important;
}
.game-watch-btn::before,
.featured-watch::before {
  color: rgba(205, 214, 226, .72) !important;
}
.game-watch-btn.stream-available,
.featured-watch.stream-available {
  border-color: rgba(72, 222, 147, .58) !important;
  background: linear-gradient(135deg, rgba(44,207,111,.32), rgba(20,145,88,.23)) !important;
  color: #c8ffdf !important;
  text-shadow: 0 1px 5px rgba(0,0,0,.2) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 3px 12px rgba(20,185,105,.16) !important;
}
.game-watch-btn.stream-available::before,
.featured-watch.stream-available::before {
  color: #85f5b4 !important;
}
.game-watch-btn.stream-unavailable,
.featured-watch.stream-unavailable {
  border-color: rgba(190,198,210,.18) !important;
  background: rgba(255,255,255,.035) !important;
  color: rgba(205,211,221,.58) !important;
  box-shadow: none !important;
}
.game-watch-btn.stream-unavailable::before,
.featured-watch.stream-unavailable::before {
  color: rgba(185,193,205,.55) !important;
}
.game-watch-btn:hover:not(:disabled):not(.stream-available),
.featured-watch:hover:not(:disabled):not(.stream-available) {
  border-color: rgba(190,198,210,.34) !important;
  background: rgba(255,255,255,.10) !important;
  box-shadow: none !important;
}

/* A previous no-source result is informational, not a permanent lockout.
   Keep the featured button clickable so users can re-check later. */
.featured-watch.stream-unavailable {
  pointer-events: auto !important;
  cursor: pointer !important;
  opacity: 1 !important;
  filter: none !important;
}

/* FULL TEAM NAMES WHEN A SCORECARD TEAM HAS NO LOGO
   The logo is hidden by renderer.js in this state, so reclaim its grid column
   and give the full team name the available width instead of truncating it. */
.card .team.team-no-logo {
  grid-template-columns: 20px minmax(0, 1fr) auto auto !important;
  column-gap: 7px !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 34px;
  align-items: center !important;
}
.card .team.team-no-logo > .card-team-logo-frame {
  display: none !important;
}
.card .team.team-no-logo > .abbr {
  grid-column: 2 !important;
  min-width: 0 !important;
  max-width: none !important;
  width: auto !important;
  overflow: visible !important;
  white-space: normal !important;
  text-overflow: clip !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  line-height: 1.2 !important;
}
.card .team.team-no-logo > .record {
  grid-column: 3 !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}
.card .team.team-no-logo > .score {
  grid-column: 4 !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}

/* PWA FIX: the compact mobile team-row rule caps every abbreviation at 4.5ch.
   For teams without a logo, restore the full-name column and reclaim the logo
   column. This selector intentionally outranks the earlier PWA !important rule. */
@media (max-width: 900px) {
  .pwa-web .card .team.team-no-logo:not(.fighter-row) {
    display: grid !important;
    grid-template-columns: 18px minmax(0, 1fr) auto minmax(32px, auto) !important;
    column-gap: 6px !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 44px !important;
    align-items: center !important;
  }

  .pwa-web .card .team.team-no-logo:not(.fighter-row) > .star-btn {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  .pwa-web .card .team.team-no-logo:not(.fighter-row) > .card-team-logo-frame {
    display: none !important;
    grid-column: 2 !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .pwa-web .card .team.team-no-logo:not(.fighter-row) > .abbr {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    line-height: 1.2 !important;
    margin: 0 !important;
  }

  .pwa-web .card .team.team-no-logo:not(.fighter-row) > .record {
    grid-column: 3 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
  }

  .pwa-web .card .team.team-no-logo:not(.fighter-row) > .score {
    grid-column: 4 !important;
    grid-row: 1 !important;
    min-width: 32px !important;
    justify-self: end !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 360px) {
  .pwa-web .card .team.team-no-logo:not(.fighter-row) {
    grid-template-columns: 16px minmax(0, 1fr) auto minmax(29px, auto) !important;
    column-gap: 4px !important;
  }

  .pwa-web .card .team.team-no-logo:not(.fighter-row) > .star-btn {
    width: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
  }

  .pwa-web .card .team.team-no-logo:not(.fighter-row) > .score {
    min-width: 29px !important;
  }
}

/* College scorecards always show the normalized full school name, not the
   compact abbreviation. This must override the PWA 4.5ch abbreviation cap. */
.card .team.team-college-row {
  min-width: 0 !important;
  height: auto !important;
  min-height: 34px;
}
.card .team.team-college-row > .abbr {
  min-width: 0 !important;
  max-width: none !important;
  width: auto !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  line-height: 1.2 !important;
}
@media (max-width: 640px) {
  .pwa-web .card .team.team-college-row:not(.fighter-row) {
    grid-template-columns: 18px 28px minmax(0, 1fr) auto minmax(32px, auto) !important;
    min-height: 44px !important;
    height: auto !important;
    align-items: center !important;
    column-gap: 5px !important;
  }
  .pwa-web .card .team.team-college-row:not(.fighter-row) > .abbr {
    grid-column: 3 !important;
    grid-row: 1 !important;
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
  }
  .pwa-web .card .team.team-college-row.team-no-logo:not(.fighter-row) {
    grid-template-columns: 18px minmax(0, 1fr) auto minmax(32px, auto) !important;
  }
  .pwa-web .card .team.team-college-row.team-no-logo:not(.fighter-row) > .card-team-logo-frame {
    display: none !important;
  }
  .pwa-web .card .team.team-college-row.team-no-logo:not(.fighter-row) > .abbr {
    grid-column: 2 !important;
  }
  .pwa-web .card .team.team-college-row.team-no-logo:not(.fighter-row) > .record {
    grid-column: 3 !important;
  }
  .pwa-web .card .team.team-college-row.team-no-logo:not(.fighter-row) > .score {
    grid-column: 4 !important;
  }
}
@media (max-width: 360px) {
  .pwa-web .card .team.team-college-row:not(.fighter-row) {
    grid-template-columns: 16px 24px minmax(0, 1fr) auto minmax(29px, auto) !important;
    column-gap: 4px !important;
  }
  .pwa-web .card .team.team-college-row.team-no-logo:not(.fighter-row) {
    grid-template-columns: 16px minmax(0, 1fr) auto minmax(29px, auto) !important;
  }
}

/* ------------------------------------------------------------------
   Settings drawer: complete, responsive controls for the web/PWA build.
   ------------------------------------------------------------------ */
#settingsDrawer .settings-drawer-body {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  padding: 16px 18px 28px;
}
.settings-content {
  display: flex;
  flex-direction: column;
  gap: 13px;
  width: 100%;
  max-width: 820px;
  min-width: 0;
  margin: 0 auto;
}
.settings-intro {
  padding: 4px 2px 7px;
}
.settings-intro-kicker {
  color: var(--accent);
  font-size: 9px;
  line-height: 1.4;
  font-weight: 950;
  letter-spacing: .15em;
}
.settings-intro-title {
  margin: 5px 0 4px;
  color: var(--text);
  font-size: clamp(21px, 2.4vw, 28px);
  line-height: 1.12;
  font-weight: 950;
}
.settings-intro-copy {
  max-width: 620px;
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}
.settings-group.settings-panel-group {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 14px 16px;
  border-radius: 15px;
}
.settings-panel-group > .settings-group-title {
  margin: 0 0 5px;
  color: var(--text);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .09em;
}
.settings-panel-group > .settings-hint {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.45;
}
.settings-panel-group .setting-row {
  gap: 16px;
  min-width: 0;
  min-height: 54px;
  padding: 9px 0;
  border-bottom-color: var(--card-border);
}
.settings-panel-group .setting-row:last-child {
  border-bottom: 0;
  padding-bottom: 2px;
}
.settings-copy {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.settings-label {
  color: var(--text);
  font-size: 12px;
  line-height: 1.3;
  font-weight: 850;
}
.settings-description {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.4;
  font-weight: 550;
}
.settings-select-row .glass-select {
  flex: 0 0 auto;
  min-width: 155px;
  max-width: 48%;
  min-height: 36px;
  padding: 6px 30px 6px 10px;
  border-radius: 9px;
  font-size: 11px;
  font-weight: 750;
}
.settings-toggle-row {
  cursor: pointer;
}
.settings-toggle-row:focus-within {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 7px;
}
.settings-toggle {
  appearance: none;
  -webkit-appearance: none;
  position: relative;
  flex: 0 0 43px;
  width: 43px;
  height: 25px;
  margin: 0 2px 0 0;
  border: 1px solid var(--card-border);
  border-radius: 999px;
  background: var(--pill-track);
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease;
}
.settings-toggle::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: var(--muted);
  transition: transform .16s ease, background .16s ease;
}
.settings-toggle:checked {
  border-color: color-mix(in srgb, var(--accent) 65%, transparent);
  background: color-mix(in srgb, var(--accent) 34%, var(--pill-track));
}
.settings-toggle:checked::before {
  transform: translateX(18px);
  background: var(--accent);
}
.settings-toggle:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}
.settings-favorite-search {
  box-sizing: border-box;
  width: 100%;
  min-height: 40px;
  margin: 10px 0 8px;
  padding: 0 10px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: var(--pill-track);
}
.favorite-search-icon {
  flex: 0 0 18px;
  color: var(--muted);
  font-size: 21px;
  line-height: 1;
}
.settings-favorite-search input {
  background: transparent;
  color: var(--text);
  font-size: 12px;
}
.settings-favorite-search input::placeholder { color: var(--faint); }
.settings-favorite-search button {
  color: var(--muted);
  font-size: 20px;
}
.settings-panel-group .fav-league-filters {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 5px;
  margin: 8px 0;
}
.settings-panel-group .fav-league-pill {
  min-height: 32px;
  padding: 5px 4px;
  font-size: 10px;
}
.settings-favorites-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 24px;
  margin: 3px 0 6px;
}
.settings-panel-group .team-chip-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
  max-height: 360px !important;
  padding: 1px 2px 3px 0;
}
.settings-panel-group .team-picker-item {
  min-height: 42px;
  padding: 6px 8px;
}
.settings-panel-group .team-picker-name {
  color: var(--text);
  font-size: 10px;
}
.settings-panel-group .team-picker-sub {
  font-size: 8px;
}
.settings-footer-note {
  margin: 0;
  padding: 2px 3px 10px;
  color: var(--faint);
  font-size: 9px;
  line-height: 1.5;
  text-align: center;
}

@media (max-width: 640px) {
  #settingsDrawer .settings-drawer-body {
    padding: 13px 11px calc(24px + env(safe-area-inset-bottom));
  }
  .settings-content { gap: 10px; }
  .settings-intro { padding: 3px 3px 6px; }
  .settings-intro-title { font-size: 23px; }
  .settings-intro-copy { font-size: 11px; }
  .settings-group.settings-panel-group { padding: 12px; border-radius: 13px; }
  .settings-panel-group .settings-group-title { font-size: 11px; }
  .settings-panel-group > .settings-hint { font-size: 9px; }
  .settings-panel-group .setting-row { min-height: 57px; gap: 10px; }
  .settings-label { font-size: 11px; }
  .settings-description { font-size: 8px; }
  .settings-select-row .glass-select {
    min-width: 132px;
    max-width: 48%;
    min-height: 38px;
    font-size: 10px;
  }
  .settings-panel-group .team-chip-grid { max-height: 330px !important; }
}

@media (max-width: 380px) {
  .settings-panel-group .setting-row { align-items: flex-start; }
  .settings-select-row { flex-direction: column; align-items: stretch !important; gap: 7px !important; }
  .settings-select-row .glass-select { width: 100%; max-width: none; }
  .settings-panel-group .fav-league-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .settings-panel-group .team-chip-grid { grid-template-columns: minmax(0, 1fr) !important; }
}


/* Soccer competition selector */
.soccer-competition-select {
  flex: 0 1 190px;
  min-width: 145px;
  max-width: 220px;
  min-height: 38px;
  padding: 0 30px 0 11px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: rgba(255,255,255,.07);
  color: var(--text);
  font-size: 11px;
  font-weight: 800;
  outline: none;
}
.soccer-competition-select option { color: #111; background: #fff; }
@media (max-width: 760px) {
  .soccer-competition-select { flex: 1 1 100%; width: 100%; max-width: none; min-height: 36px; }
}


/* Custom Soccer competition picker */
.soccer-competition-picker {
  position: relative;
  flex: 0 1 218px;
  min-width: 172px;
  max-width: 235px;
  z-index: 40;
}
.soccer-competition-trigger {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 48px;
  padding: 7px 12px;
  border: 1px solid rgba(150, 170, 205, .22);
  border-radius: 13px;
  background: linear-gradient(145deg, rgba(39, 48, 65, .92), rgba(21, 26, 37, .96));
  color: var(--text, #f4f6fb);
  text-align: left;
  cursor: pointer;
  box-shadow: 0 5px 18px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.055);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.soccer-competition-trigger:hover,
.soccer-competition-picker.open .soccer-competition-trigger {
  border-color: rgba(111, 157, 255, .62);
  box-shadow: 0 0 0 3px rgba(91, 135, 255, .10), 0 8px 24px rgba(0,0,0,.22);
}
.soccer-picker-icon {
  display: grid;
  place-items: center;
  flex: 0 0 31px;
  width: 31px;
  height: 31px;
  border-radius: 10px;
  background: rgba(92, 139, 255, .14);
  font-size: 16px;
}
.soccer-picker-copy { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 2px; }
.soccer-picker-kicker { color: var(--muted, #9aa6b9); font-size: 8px; font-weight: 850; letter-spacing: .13em; line-height: 1; }
.soccer-picker-copy strong { overflow: hidden; color: var(--text, #f4f6fb); font-size: 12px; font-weight: 800; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.soccer-picker-chevron { width: 17px; height: 17px; flex: 0 0 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; opacity: .72; transition: transform .18s ease; }
.soccer-competition-picker.open .soccer-picker-chevron { transform: rotate(180deg); }
.soccer-competition-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 1000;
  width: min(290px, calc(100vw - 32px));
  max-height: min( min(62vh, 520px), calc(100dvh - 150px) );
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 7px;
  border: 1px solid rgba(151, 169, 204, .22);
  border-radius: 16px;
  background: rgba(18, 22, 31, .98);
  box-shadow: 0 18px 48px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.045);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
  scrollbar-width: thin;
  scrollbar-color: rgba(145, 161, 190, .38) transparent;
}
.soccer-competition-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 43px;
  padding: 9px 11px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: var(--text, #edf1f8);
  font-size: 12px;
  font-weight: 650;
  text-align: left;
  cursor: pointer;
  transition: background .14s ease, border-color .14s ease, color .14s ease;
}
.soccer-competition-option:hover,
.soccer-competition-option:focus-visible { outline: none; background: rgba(255,255,255,.075); border-color: rgba(255,255,255,.07); }
.soccer-competition-option.active { background: linear-gradient(100deg, rgba(77, 125, 245, .22), rgba(77, 125, 245, .09)); border-color: rgba(105, 149, 255, .24); color: #fff; }

/* Calendar-style availability dots in the soccer competition picker */
.soccer-competition-game-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  flex: 0 0 6px;
  margin-left: auto;
  border-radius: 50%;
  background: var(--accent, #1688f8);
  box-shadow: 0 0 7px rgba(22,136,248,.55);
}
.soccer-competition-option.active .soccer-competition-game-dot {
  background: #a9c2ff;
  box-shadow: 0 0 7px rgba(169,194,255,.65);
}
.soccer-competition-option.no-games .soccer-competition-game-dot { display: none; }

.soccer-competition-option-check { display: grid; place-items: center; width: 20px; height: 20px; flex: 0 0 20px; border-radius: 50%; color: #a9c2ff; font-size: 13px; font-weight: 900; }
.soccer-competition-select { display: none !important; }
@media (max-width: 760px) {
  .soccer-competition-picker { flex: 1 1 100%; width: 100%; max-width: none; }
  .soccer-competition-trigger { min-height: 44px; }
  .soccer-competition-menu { left: 0; right: auto; width: 100%; max-height: min(55dvh, 430px); }
}
@media (prefers-reduced-motion: reduce) {
  .soccer-competition-trigger, .soccer-picker-chevron, .soccer-competition-option { transition: none; }
}


/* First-launch favorite team onboarding */
.favorite-onboarding-banner {
  margin: 4px 0 18px;
  padding: 20px;
  border: 1px solid rgba(160, 175, 200, .16);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(48, 50, 56, .72), rgba(35, 37, 42, .92));
  box-shadow: 0 12px 30px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.035);
}
.favorite-onboarding-kicker { display:block; margin-bottom:8px; color:var(--muted, #aab4c5); font-size:9px; font-weight:900; letter-spacing:.16em; }
.favorite-onboarding-title { margin:0; color:var(--text, #f5f7fb); font-size:clamp(21px, 4vw, 28px); font-weight:850; letter-spacing:-.035em; }
.favorite-onboarding-copy { max-width:620px; margin:9px 0 0; color:var(--muted, #aab4c5); font-size:13px; line-height:1.55; }
.favorite-onboarding-actions { display:flex; align-items:center; justify-content:flex-end; gap:10px; margin:18px 0 2px; }
.favorite-onboarding-actions button { min-height:44px; padding:0 17px; border:1px solid rgba(160,175,200,.22); border-radius:11px; background:rgba(255,255,255,.055); color:var(--text, #f1f3f6); font-size:12px; font-weight:800; cursor:pointer; transition:background .16s ease, border-color .16s ease; }
.favorite-onboarding-actions button:hover { background:rgba(255,255,255,.095); border-color:rgba(190,200,215,.32); }
.favorite-onboarding-actions button:active { background:rgba(255,255,255,.12); }
.favorite-onboarding-actions button:focus-visible { outline:2px solid var(--muted, #aab4c5); outline-offset:3px; }
[aria-label="Favorite teams"][hidden] { display:none !important; }
@media (max-width:600px) {
  .favorite-onboarding-banner { padding:16px; border-radius:15px; }
  .favorite-onboarding-actions { position:static; padding:0; background:none; }
  .favorite-onboarding-actions button { flex:1; }
}


/* Native Android date dialogs cannot inherit website styling. Use this
   responsive, fully themed in-app calendar on every platform instead. */
.custom-date-picker[hidden] { display:none !important; }
.custom-date-picker { position:fixed; inset:0; z-index:10050; display:flex; align-items:center; justify-content:center; padding:18px; }
.custom-date-picker-backdrop { position:absolute; inset:0; width:100%; height:100%; border:0; background:rgba(3,5,10,.76); backdrop-filter:blur(9px); -webkit-backdrop-filter:blur(9px); }
.custom-date-dialog { position:relative; z-index:1; width:min(100%,390px); max-height:min(88dvh,680px); overflow:auto; padding:22px; border:1px solid var(--card-border,rgba(255,255,255,.12)); border-radius:24px; background:var(--panel, #171a20); color:var(--text,#f2f4f8); box-shadow:0 24px 80px rgba(0,0,0,.5); }
.custom-date-header { padding:2px 2px 20px; }
.custom-date-eyebrow { color:var(--muted,#9ba4b3); font-size:10px; font-weight:850; letter-spacing:.16em; }
.custom-date-selected-label { margin-top:9px; color:var(--muted,#9ba4b3); font-size:13px; font-weight:650; }
.custom-date-selected-value { margin-top:5px; font-size:clamp(23px,6vw,30px); line-height:1.2; font-weight:800; letter-spacing:-.04em; }
.custom-date-month-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0 14px; border-top:1px solid var(--card-border,rgba(255,255,255,.09)); }
.custom-date-month-label { padding:7px 0; color:var(--text,#f2f4f8); font-size:15px; font-weight:750; }
.custom-date-nav { display:flex; gap:8px; }
.custom-date-nav button { width:38px; height:38px; border:1px solid var(--card-border,rgba(255,255,255,.1)); border-radius:12px; color:var(--text,#f2f4f8); font-size:25px; line-height:1; }
.custom-date-weekdays,.custom-date-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:5px; text-align:center; }
.custom-date-weekdays { padding:7px 0 9px; color:var(--muted,#9ba4b3); font-size:11px; font-weight:750; }
.custom-date-day { position:relative; display:grid; place-items:center; width:100%; aspect-ratio:1; min-height:36px; border:1px solid transparent; border-radius:13px; color:var(--text,#f2f4f8); font-size:14px; font-weight:650; }
.custom-date-day.has-games { font-weight:800; }
.custom-date-game-dot { position:absolute; left:50%; bottom:5px; width:5px; height:5px; border-radius:50%; background:var(--accent,#1688f8); transform:translateX(-50%); box-shadow:0 0 7px rgba(22,136,248,.48); pointer-events:none; }
.custom-date-day.selected .custom-date-game-dot { background:#fff; box-shadow:0 0 5px rgba(255,255,255,.55); }
.custom-date-day.outside-month .custom-date-game-dot { opacity:.35; }
.custom-date-day.outside-month { color:var(--faint,#657080); opacity:.48; }
.custom-date-day.today:not(.selected) { border-color:var(--accent,#6688df); color:var(--accent,#8ba8ff); }
.custom-date-day.selected { background:var(--accent,#647fce); color:#fff; box-shadow:0 5px 18px rgba(72,103,190,.3); }
.custom-date-day:active,.custom-date-nav button:active { transform:scale(.95); }
.custom-date-footer { display:flex; align-items:center; justify-content:space-between; margin-top:17px; padding-top:14px; border-top:1px solid var(--card-border,rgba(255,255,255,.09)); }
.custom-date-footer button { padding:9px 12px; border-radius:11px; color:var(--text,#f2f4f8); font-size:13px; font-weight:750; }
.custom-date-today { color:var(--accent,#8ba8ff) !important; }
.custom-date-cancel { color:var(--muted,#9ba4b3) !important; }
:root[data-theme="light"] .custom-date-dialog { background:#f7f8fb; border-color:rgba(25,35,55,.12); color:#202633; }
:root[data-theme="light"] .custom-date-month-label,:root[data-theme="light"] .custom-date-nav button,:root[data-theme="light"] .custom-date-day,:root[data-theme="light"] .custom-date-footer button { color:#202633; }
:root[data-theme="light"] .custom-date-day.selected { color:#fff; }
@media(max-width:480px) {
 .custom-date-picker { align-items:flex-end; padding:0; }
 .custom-date-dialog { width:100%; max-width:none; max-height:min(82dvh,650px); padding:20px 19px calc(20px + env(safe-area-inset-bottom)); border-radius:25px 25px 0 0; animation:customCalendarRise .2s ease-out; }
 .custom-date-day { min-height:39px; font-size:14px; border-radius:12px; }
 .custom-date-weekdays,.custom-date-grid { gap:4px; }
}
@keyframes customCalendarRise { from { transform:translateY(22px); opacity:.6; } to { transform:translateY(0); opacity:1; } }

.favorite-sport-section-label{margin:9px 0 4px;font-size:10px;letter-spacing:.04em;text-transform:uppercase;opacity:.8}
.favorite-sport-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.favorite-sport-pill{min-height:34px;white-space:normal}


/* Sport-first individual league selector in Favorites / first-launch setup */
.favorite-league-sport-select {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-height: 42px;
  margin: 8px 0 10px;
  padding: 8px 36px 8px 12px;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: var(--pill-track);
  color: var(--text);
  font-size: 12px;
  font-weight: 750;
}
.favorite-league-sport-select option { color: #171a20; background: #fff; }
#favoriteLeagueGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 0;
}
#favoriteLeagueGrid .fav-league-pill {
  min-width: 0;
  min-height: 36px;
  white-space: normal;
}


/* Explicit confirmation for the staged favorite sport and league choices */
.favorite-selection-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 13px;
  padding-top: 12px;
  border-top: 1px solid var(--card-border);
}
.favorite-selection-status {
  min-width: 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.45;
}
.favorite-selection-confirm {
  flex: 0 0 auto;
  min-height: 39px;
  padding: 0 16px;
  border: 1px solid rgba(150, 170, 205, .25);
  border-radius: 10px;
  background: rgba(255,255,255,.09);
  color: var(--text);
  font-size: 11px;
  font-weight: 850;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, opacity .16s ease;
}
.favorite-selection-confirm:not(:disabled):hover {
  background: rgba(255,255,255,.15);
  border-color: rgba(170, 190, 225, .42);
}
.favorite-selection-confirm:disabled {
  cursor: default;
  opacity: .45;
}
.favorite-selection-confirm:focus-visible {
  outline: 2px solid var(--muted);
  outline-offset: 3px;
}
@media (max-width: 480px) {
  .favorite-selection-actions { align-items: stretch; flex-direction: column; }
  .favorite-selection-confirm { width: 100%; }
}


/* Favorite sports: expand individual leagues directly beneath the chosen sport */
#favoriteSportGrid.favorite-sport-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 8px;
}
.favorite-sport-option {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 7px;
}
.favorite-sport-option.expanded {
  grid-column: 1 / -1;
  padding: 9px;
  border: 1px solid var(--card-border);
  border-radius: 12px;
  background: rgba(255,255,255,.025);
}
.favorite-sport-option > .favorite-sport-pill {
  width: 100%;
  min-height: 39px;
  text-align: center;
}
.favorite-sport-option > .favorite-sport-pill.expanded {
  border-color: rgba(160,180,220,.4);
}
.favorite-sport-leagues {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.favorite-sport-all-pill {
  width: 100%;
  min-height: 35px;
  border-style: dashed;
}
.favorite-sport-league-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}
.favorite-sport-league-pill {
  min-width: 0;
  min-height: 36px;
  padding: 6px 7px;
  white-space: normal;
  line-height: 1.25;
}
.favorite-inline-league-hint {
  margin-top: 2px;
}
@media (max-width: 420px) {
  #favoriteSportGrid.favorite-sport-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .favorite-sport-option.expanded {
    grid-column: 1;
  }
  .favorite-sport-league-list {
    grid-template-columns: minmax(0, 1fr);
  }
}


/* Interactive player-centered play-by-play feed — NFL and NBA. */
#statsDrawer #pbpBody {
  display: flex;
  flex-direction: column;
  gap: 9px;
  overflow-x: hidden;
}
#pbpBody .pbp-featured-play {
  position: sticky;
  top: 0;
  z-index: 4;
  display: grid;
  gap: 8px;
  width: 100%;
  box-sizing: border-box;
  padding: 11px;
  border: 1px solid var(--glass-border);
  border-radius: 13px;
  background: linear-gradient(140deg, var(--glass-solid), var(--card));
  box-shadow: 0 8px 24px rgba(0,0,0,.16);
  backdrop-filter: blur(16px);
}
.pbp-featured-heading,
.pbp-row-heading,
.pbp-drive-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}
.pbp-featured-heading-copy { display: grid; gap: 2px; min-width: 0; }
.pbp-featured-eyebrow {
  color: var(--muted);
  font-size: 8px;
  line-height: 1.1;
  font-weight: 850;
  letter-spacing: .11em;
}
.pbp-featured-action {
  color: var(--text);
  font-size: 13px;
  line-height: 1.2;
  font-weight: 900;
  letter-spacing: .02em;
}
.pbp-featured-time {
  flex: none;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.2;
  font-weight: 800;
  text-align: right;
}
.pbp-featured-description {
  color: var(--text);
  font-size: 11px;
  line-height: 1.45;
}
.pbp-featured-players {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 6px;
}
.pbp-player-chip {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  max-width: 100%;
  padding: 6px 7px;
  color: var(--text);
  text-align: left;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: rgba(255,255,255,.035);
  cursor: pointer;
  transition: background .14s ease, border-color .14s ease, transform .14s ease;
}
.pbp-player-chip:hover:not(:disabled) {
  background: var(--hover);
  border-color: var(--glass-border);
}
.pbp-player-chip:active:not(:disabled) { transform: scale(.985); }
.pbp-player-chip:disabled { cursor: default; opacity: .92; }
.pbp-player-card-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.pbp-player-card-name {
  display: block;
  overflow: hidden;
  color: var(--text);
  font-size: 10px;
  line-height: 1.2;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pbp-player-card-meta {
  display: block;
  overflow: hidden;
  color: var(--muted);
  font-size: 8px;
  line-height: 1.15;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pbp-player-avatar {
  position: relative;
  display: inline-grid;
  place-items: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  overflow: hidden;
  border: 1px solid var(--card-border);
  border-radius: 50%;
  background: var(--pill-track);
}
.pbp-player-avatar.small { flex-basis: 25px; width: 25px; height: 25px; }
.pbp-player-avatar.large { flex-basis: 38px; width: 38px; height: 38px; }
.pbp-avatar-fallback {
  color: var(--text);
  font-size: 10px;
  line-height: 1;
  font-weight: 900;
}
.pbp-player-avatar.small .pbp-avatar-fallback { font-size: 8px; }
.pbp-avatar-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
.pbp-featured-context {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.35;
  font-weight: 750;
}
.pbp-featured-score {
  color: var(--green);
  font-size: 10px;
  line-height: 1.2;
  font-weight: 900;
}
.pbp-featured-no-players,
.pbp-featured-empty {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.4;
}
.pbp-feed { display: grid; gap: 8px; min-width: 0; }
.pbp-drive-group { display: grid; gap: 5px; min-width: 0; }
.pbp-drive-heading {
  padding: 7px 2px 3px;
  border-bottom: 1px solid var(--card-border);
}
.pbp-drive-title {
  color: var(--text);
  font-size: 10px;
  line-height: 1.25;
  font-weight: 850;
}
.pbp-drive-meta {
  flex: none;
  color: var(--muted);
  font-size: 8px;
  line-height: 1.2;
  font-weight: 800;
  text-align: right;
}
#pbpBody .pbp-row {
  display: grid !important;
  gap: 5px;
  width: 100% !important;
  min-width: 0;
  box-sizing: border-box;
  padding: 9px 10px;
  margin: 0;
  border: 1px solid var(--card-border);
  border-radius: 10px;
  background: var(--card);
  cursor: pointer;
  transition: border-color .14s ease, background .14s ease;
}
#pbpBody .pbp-row:hover,
#pbpBody .pbp-row:focus-visible {
  border-color: var(--glass-border);
  background: var(--hover);
  outline: none;
}
#pbpBody .pbp-row.scoring {
  border-color: rgba(48,209,88,.42);
  background: rgba(48,209,88,.075);
}
#pbpBody .pbp-row.turnover { border-left: 3px solid #ff9f0a; }
#pbpBody .pbp-meta {
  min-width: 0;
  margin: 0;
  font-size: 9px;
  line-height: 1.25;
}
.pbp-action-tag {
  flex: none;
  padding: 3px 6px;
  border: 1px solid var(--card-border);
  border-radius: 6px;
  color: var(--muted);
  background: var(--pill-track);
  font-size: 7px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .045em;
}
.pbp-action-tag.scoring {
  color: var(--green);
  border-color: rgba(48,209,88,.3);
  background: rgba(48,209,88,.09);
}
.pbp-action-tag.turnover {
  color: #ffb454;
  border-color: rgba(255,159,10,.28);
  background: rgba(255,159,10,.08);
}
#pbpBody .pbp-text {
  font-size: 10.5px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.pbp-row-players {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  min-width: 0;
  margin-top: 1px;
}
.pbp-player-chip.compact {
  flex: 0 1 auto;
  max-width: min(48%, 190px);
  gap: 5px;
  padding: 3px 6px 3px 3px;
  border-radius: 999px;
  background: rgba(255,255,255,.025);
}
.pbp-player-chip.compact .pbp-player-card-name { font-size: 8px; }
.pbp-player-chip.compact .pbp-player-card-meta { font-size: 7px; }
.pbp-more-players {
  color: var(--muted);
  font-size: 8px;
  font-weight: 850;
}
#pbpBody .pbp-score { margin-top: 0; font-size: 9px; }
@media (max-width: 480px) {
  .pbp-featured-players { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #pbpBody .pbp-featured-play { padding: 9px; }
  .pbp-featured-action { font-size: 12px; }
  .pbp-player-chip.compact { max-width: 100%; }
}


/* Explicit NBA scoring-assist attribution in the play spotlight. */
.pbp-assist-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  min-width: 0;
  padding-top: 7px;
  border-top: 1px solid var(--card-border);
}
.pbp-assist-label {
  flex: none;
  color: var(--green);
  font-size: 8px;
  line-height: 1.2;
  font-weight: 950;
  letter-spacing: .08em;
}
.pbp-assist-label.muted { color: var(--muted); }
.pbp-assist-players {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
}
.pbp-row-assist {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  padding-top: 4px;
}
.pbp-row-assist .pbp-assist-label { font-size: 7px; }


/* Soccer game detail uses the shared player-card play-by-play feed. */
#statsDrawer.soccer-game .detail-tabs {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
#statsDrawer.soccer-game[data-view="pbp"] .detail-panes > .pane:not(.pane-pbp) {
  display: none !important;
}
#statsDrawer.soccer-game[data-view="pbp"] .detail-panes > .pane-pbp {
  display: flex !important;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}
#statsDrawer.soccer-game[data-view="pbp"] #pbpToolbar {
  flex: 0 0 auto !important;
  min-height: 0;
  overflow: visible !important;
}
#statsDrawer.soccer-game[data-view="pbp"] #pbpBody {
  flex: 1 1 auto !important;
  min-width: 0;
  min-height: 0;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
#statsDrawer.soccer-game #pbpBody .pbp-featured-play {
  border-left: 3px solid rgba(48,209,88,.45);
}


/* ================================================================
   Soccer Overview Refresh — glass score centre, stat meters, events
   ================================================================ */
#statsDrawer.soccer-game #statsBody {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 14px 16px 20px;
}

#statsDrawer.soccer-game .soccer-overview-scorecard {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 132px minmax(0, 1fr);
  align-items: center;
  min-height: 174px;
  gap: 12px;
  padding: 20px clamp(12px, 3vw, 30px);
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid var(--glass-border, var(--card-border));
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.075), transparent 48%),
    linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.018)),
    var(--card);
  box-shadow: 0 12px 28px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.035);
}

#statsDrawer.soccer-game .soccer-overview-scorecard.is-live {
  border-color: rgba(48,209,88,.28);
}

#statsDrawer.soccer-game .soccer-overview-scorecard::before {
  position: absolute;
  z-index: -1;
  content: "";
  width: 280px;
  height: 180px;
  top: -115px;
  left: calc(50% - 140px);
  border-radius: 50%;
  background: rgba(255,255,255,.045);
  filter: blur(24px);
  pointer-events: none;
}

#statsDrawer.soccer-game .soccer-overview-team {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  gap: 5px;
  text-align: center;
}

#statsDrawer.soccer-game .soccer-overview-team-away {
  grid-column: 1;
  grid-row: 1;
}

#statsDrawer.soccer-game .soccer-overview-team-home {
  grid-column: 3;
  grid-row: 1;
}

#statsDrawer.soccer-game .soccer-overview-logo {
  width: 64px;
  height: 64px;
  object-fit: contain;
  filter: drop-shadow(0 5px 8px rgba(0,0,0,.2));
}

#statsDrawer.soccer-game .soccer-overview-logo-fallback {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: rgba(255,255,255,.07);
  color: var(--text);
  font-size: 15px;
  font-weight: 900;
}

#statsDrawer.soccer-game .soccer-overview-team-name {
  max-width: 100%;
  color: var(--text);
  font-size: clamp(13px, 1.25vw, 17px);
  line-height: 1.2;
  font-weight: 900;
  overflow-wrap: anywhere;
}

#statsDrawer.soccer-game .soccer-overview-abbr {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .09em;
}

#statsDrawer.soccer-game .soccer-overview-score {
  color: var(--text);
  font-size: clamp(32px, 3.2vw, 42px);
  line-height: 1;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 2px 18px rgba(0,0,0,.16);
}

#statsDrawer.soccer-game .soccer-overview-status-wrap {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
}

#statsDrawer.soccer-game .soccer-overview-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  max-width: 100%;
  padding: 7px 11px;
  border: 1px solid var(--card-border);
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  color: var(--text);
  font-size: 10px;
  font-weight: 900;
  text-align: center;
  white-space: nowrap;
}

#statsDrawer.soccer-game .soccer-overview-status-dot {
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: #30d158;
  box-shadow: 0 0 0 4px rgba(48,209,88,.12), 0 0 12px rgba(48,209,88,.45);
  animation: soccer-live-pulse 1.8s ease-in-out infinite;
}

#statsDrawer.soccer-game .soccer-overview-status-caption {
  color: var(--faint);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .13em;
  text-align: center;
}

@keyframes soccer-live-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .5; }
}

#statsDrawer.soccer-game .soccer-overview-details {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  margin: 0;
}

#statsDrawer.soccer-game .soccer-overview-detail {
  min-width: 0;
  min-height: 67px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  padding: 11px 13px;
  border: 1px solid var(--card-border);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.018)), var(--card);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}

#statsDrawer.soccer-game .soccer-overview-detail-label {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .075em;
}

#statsDrawer.soccer-game .soccer-overview-detail-icon {
  color: var(--accent);
  font-size: 12px;
  line-height: 1;
}

#statsDrawer.soccer-game .soccer-overview-detail-value {
  color: var(--text);
  font-size: 12px;
  line-height: 1.35;
  font-weight: 800;
  overflow-wrap: anywhere;
}

#statsDrawer.soccer-game .soccer-overview-highlights,
#statsDrawer.soccer-game .soccer-overview-events {
  min-width: 0;
  margin: 0;
}

#statsDrawer.soccer-game .soccer-overview-highlights > .stat-group-title,
#statsDrawer.soccer-game .soccer-overview-events > .stat-group-title {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 2px 0 9px;
  color: var(--text);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .075em;
}

#statsDrawer.soccer-game .soccer-highlight-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 9px;
}

#statsDrawer.soccer-game .soccer-highlight-card {
  min-width: 0;
  padding: 12px 13px;
  gap: 9px;
  border: 1px solid var(--card-border);
  border-radius: 13px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.045), transparent 65%),
    var(--card);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}

#statsDrawer.soccer-game .soccer-highlight-label {
  color: var(--muted);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .075em;
  text-transform: uppercase;
}

#statsDrawer.soccer-game .soccer-highlight-value-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}

#statsDrawer.soccer-game .soccer-highlight-away,
#statsDrawer.soccer-game .soccer-highlight-home {
  color: var(--text);
  font-size: 21px;
  line-height: 1;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
}

#statsDrawer.soccer-game .soccer-highlight-separator {
  color: var(--faint);
  font-size: 12px;
  font-weight: 800;
}

#statsDrawer.soccer-game .soccer-highlight-meter {
  display: flex;
  width: 100%;
  height: 5px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}

#statsDrawer.soccer-game .soccer-highlight-meter-away {
  background: var(--accent, #70aaff);
}

#statsDrawer.soccer-game .soccer-highlight-meter-home {
  background: var(--muted, #858b96);
}

#statsDrawer.soccer-game .soccer-highlight-teams {
  color: var(--faint);
  font-size: 9px;
  font-weight: 750;
}

#statsDrawer.soccer-game .soccer-overview-event-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px;
}

#statsDrawer.soccer-game .soccer-overview-event {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 9px;
  min-width: 0;
  min-height: 108px;
  padding: 11px 12px;
  border: 1px solid var(--card-border);
  border-radius: 12px;
  background: linear-gradient(140deg, rgba(255,255,255,.04), transparent 72%), var(--card);
}

#statsDrawer.soccer-game .soccer-overview-event-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

#statsDrawer.soccer-game .soccer-overview-event-time {
  color: var(--accent);
  font-size: 10px;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
}

#statsDrawer.soccer-game .soccer-overview-event-type {
  color: var(--muted);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .07em;
}

#statsDrawer.soccer-game .soccer-overview-event-copy {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

#statsDrawer.soccer-game .soccer-overview-event-headshot {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  object-fit: cover;
  object-position: center top;
  border-radius: 50%;
  background: rgba(255,255,255,.08);
}

#statsDrawer.soccer-game .soccer-overview-event-text {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

#statsDrawer.soccer-game .soccer-overview-event-player {
  color: var(--text);
  font-size: 12px;
  font-weight: 850;
  overflow-wrap: anywhere;
}

#statsDrawer.soccer-game .soccer-overview-event-detail {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.35;
}

#statsDrawer.soccer-game .soccer-overview-event-team {
  align-self: flex-end;
  color: var(--faint);
  font-size: 9px;
  font-weight: 900;
}

#statsDrawer.soccer-game .soccer-overview-event-goal,
#statsDrawer.soccer-game .soccer-overview-event-penalty-goal {
  border-color: rgba(48,209,88,.28);
}

#statsDrawer.soccer-game .soccer-overview-event-red-card {
  border-color: rgba(255,69,58,.32);
}

#statsDrawer.soccer-game .soccer-overview-event-yellow-card {
  border-color: rgba(255,214,10,.26);
}

#statsDrawer.soccer-game .soccer-overview-events-empty {
  padding: 15px;
  border: 1px dashed var(--card-border);
  border-radius: 11px;
  color: var(--muted);
  font-size: 11px;
  text-align: center;
}

@media (max-width: 760px) {
  #statsDrawer.soccer-game #statsBody {
    padding: 10px;
    gap: 11px;
  }

  #statsDrawer.soccer-game .soccer-overview-scorecard {
    grid-template-columns: minmax(0, 1fr) 90px minmax(0, 1fr);
    min-height: 145px;
    padding: 14px 8px;
    gap: 5px;
  }

  #statsDrawer.soccer-game .soccer-overview-logo {
    width: 46px;
    height: 46px;
  }

  #statsDrawer.soccer-game .soccer-overview-status {
    padding: 6px 8px;
    font-size: 9px;
  }

  #statsDrawer.soccer-game .soccer-overview-details {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #statsDrawer.soccer-game .soccer-highlight-grid,
  #statsDrawer.soccer-game .soccer-overview-event-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 440px) {
  #statsDrawer.soccer-game .soccer-highlight-grid,
  #statsDrawer.soccer-game .soccer-overview-event-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}


/* College Basketball glass schedule picker */
.cbb-schedule-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
  margin: 0 0 2px;
  padding: 8px 10px 8px 13px;
  border: 1px solid rgba(150, 170, 205, .16);
  border-radius: 13px;
  background: linear-gradient(120deg, rgba(37, 43, 54, .64), rgba(25, 29, 37, .78));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
.cbb-schedule-toolbar-copy {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.cbb-schedule-toolbar-label {
  color: var(--text, #eef1f6);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .13em;
}
.cbb-schedule-toolbar-subtitle {
  color: var(--muted, #a4adbc);
  font-size: 10px;
  font-weight: 550;
}
.cbb-schedule-picker {
  position: relative;
  flex: 0 1 285px;
  min-width: 215px;
  max-width: 330px;
  z-index: 45;
}
.cbb-schedule-trigger {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  padding: 6px 11px;
  border: 1px solid rgba(150, 170, 205, .22);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(43, 50, 63, .94), rgba(25, 30, 40, .97));
  color: var(--text, #f4f6fb);
  text-align: left;
  cursor: pointer;
  box-shadow: 0 5px 18px rgba(0,0,0,.15), inset 0 1px 0 rgba(255,255,255,.055);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.cbb-schedule-trigger:hover,
.cbb-schedule-picker.open .cbb-schedule-trigger {
  border-color: rgba(111, 157, 255, .62);
  box-shadow: 0 0 0 3px rgba(91, 135, 255, .10), 0 8px 24px rgba(0,0,0,.22);
}
.cbb-schedule-picker-icon {
  display: grid;
  place-items: center;
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  border: 1px solid rgba(135, 158, 205, .16);
  border-radius: 9px;
  background: rgba(92, 139, 255, .13);
  font-size: 15px;
}
.cbb-schedule-picker-copy {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.cbb-schedule-picker-kicker {
  color: var(--muted, #9aa6b9);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .13em;
  line-height: 1;
}
.cbb-schedule-picker-copy strong {
  overflow: hidden;
  color: var(--text, #f4f6fb);
  font-size: 11px;
  font-weight: 850;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cbb-schedule-chevron {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .72;
  transition: transform .18s ease;
}
.cbb-schedule-picker.open .cbb-schedule-chevron { transform: rotate(180deg); }
.cbb-schedule-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 1000;
  width: min(340px, calc(100vw - 32px));
  max-height: min( min(64vh, 560px), calc(100dvh - 140px) );
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 8px;
  border: 1px solid rgba(151, 169, 204, .22);
  border-radius: 16px;
  background: rgba(18, 22, 31, .985);
  color: var(--text, #edf1f8);
  box-shadow: 0 18px 48px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.045);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
  scrollbar-width: thin;
  scrollbar-color: rgba(145, 161, 190, .38) transparent;
}
.cbb-schedule-menu[hidden] { display: none !important; }
.cbb-schedule-menu-heading {
  padding: 9px 10px 6px;
  color: var(--muted, #9aa6b9);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .15em;
}
.cbb-schedule-menu-heading:not(:first-child) {
  margin-top: 6px;
  border-top: 1px solid rgba(255,255,255,.07);
}
.cbb-schedule-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 43px;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: var(--text, #edf1f8);
  text-align: left;
  cursor: pointer;
  transition: background .14s ease, border-color .14s ease, color .14s ease;
}
.cbb-schedule-option:hover,
.cbb-schedule-option:focus-visible {
  outline: none;
  background: rgba(255,255,255,.075);
  border-color: rgba(255,255,255,.07);
}
.cbb-schedule-option.active {
  background: linear-gradient(100deg, rgba(77, 125, 245, .22), rgba(77, 125, 245, .09));
  border-color: rgba(105, 149, 255, .24);
  color: #fff;
}
.cbb-schedule-option-copy {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.cbb-schedule-option-main {
  overflow: hidden;
  font-size: 11px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cbb-schedule-option-detail {
  overflow: hidden;
  color: var(--muted, #9aa6b9);
  font-size: 9px;
  font-weight: 550;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cbb-schedule-option-check {
  display: grid;
  place-items: center;
  width: 21px;
  height: 21px;
  flex: 0 0 21px;
  border-radius: 50%;
  color: #a9c2ff;
  font-size: 13px;
  font-weight: 900;
}
.cbb-schedule-native-select { display: none !important; }
.team.team-cbb-row {
  grid-template-columns: 20px 24px minmax(0,1fr) auto auto auto;
}
.card .team.team-cbb-row {
  grid-template-columns: 20px 24px minmax(0,1fr) auto auto auto;
}
.team-rank-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 23px;
  padding: 2px 5px;
  border: 1px solid rgba(105,157,255,.30);
  border-radius: 7px;
  background: rgba(81,133,235,.15);
  color: #a9caff;
  font-size: 10px;
  font-weight: 950;
  line-height: 1.25;
  font-variant-numeric: tabular-nums;
}
.team-rank-badge[hidden] { display: none !important; }
.featured-rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 7px;
  border: 1px solid rgba(105,157,255,.30);
  border-radius: 7px;
  background: rgba(81,133,235,.16);
  color: #a9caff;
  font-size: 11px;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
}
@media (min-width: 1500px) {
  .card .team.team-cbb-row {
    grid-template-columns: 22px 28px minmax(0,1fr) auto auto auto;
  }
}
@media (max-width: 760px) {
  .cbb-schedule-toolbar {
    align-items: stretch;
    flex-direction: column;
    gap: 8px;
  }
  .cbb-schedule-picker {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    max-width: none;
  }
  .cbb-schedule-menu {
    left: 0;
    right: auto;
    width: 100%;
    max-height: min(58dvh, 470px);
  }
  .cbb-schedule-toolbar-copy {
    flex-direction: row;
    align-items: baseline;
    justify-content: space-between;
  }
}
@media (prefers-reduced-motion: reduce) {
  .cbb-schedule-trigger,
  .cbb-schedule-chevron,
  .cbb-schedule-option { transition: none; }
}


/* Preserve the CBB rank badge in the six-column college team row on PWA screens. */
@media (max-width: 640px) {
  .pwa-web .card .team.team-cbb-row:not(.fighter-row) {
    grid-template-columns: 18px 28px minmax(0,1fr) auto auto minmax(32px,auto) !important;
    min-height: 44px !important;
    height: auto !important;
    align-items: center !important;
    column-gap: 5px !important;
  }
  .pwa-web .card .team.team-cbb-row:not(.fighter-row) > .abbr {
    grid-column: 3 !important;
    grid-row: 1 !important;
  }
  .pwa-web .card .team.team-cbb-row:not(.fighter-row) > .team-rank-badge {
    grid-column: 4 !important;
    grid-row: 1 !important;
  }
  .pwa-web .card .team.team-cbb-row:not(.fighter-row) > .record {
    grid-column: 5 !important;
    grid-row: 1 !important;
  }
  .pwa-web .card .team.team-cbb-row:not(.fighter-row) > .score {
    grid-column: 6 !important;
    grid-row: 1 !important;
  }
  .pwa-web .card .team.team-cbb-row.team-no-logo:not(.fighter-row) {
    grid-template-columns: 18px minmax(0,1fr) auto auto minmax(32px,auto) !important;
  }
  .pwa-web .card .team.team-cbb-row.team-no-logo:not(.fighter-row) > .card-team-logo-frame {
    display: none !important;
  }
  .pwa-web .card .team.team-cbb-row.team-no-logo:not(.fighter-row) > .abbr { grid-column: 2 !important; }
  .pwa-web .card .team.team-cbb-row.team-no-logo:not(.fighter-row) > .team-rank-badge { grid-column: 3 !important; }
  .pwa-web .card .team.team-cbb-row.team-no-logo:not(.fighter-row) > .record { grid-column: 4 !important; }
  .pwa-web .card .team.team-cbb-row.team-no-logo:not(.fighter-row) > .score { grid-column: 5 !important; }
}
@media (max-width: 360px) {
  .pwa-web .card .team.team-cbb-row:not(.fighter-row) {
    grid-template-columns: 16px 24px minmax(0,1fr) auto auto minmax(29px,auto) !important;
    column-gap: 4px !important;
  }
  .pwa-web .card .team.team-cbb-row.team-no-logo:not(.fighter-row) {
    grid-template-columns: 16px minmax(0,1fr) auto auto minmax(29px,auto) !important;
  }
}


/* NFL RedZone live stream access card */
.nfl-redzone-panel {
  margin: 10px 14px 14px;
  padding: 13px;
  border: 1px solid rgba(226,65,80,.34);
  border-radius: 15px;
  background: linear-gradient(125deg,rgba(141,32,48,.17),rgba(36,40,48,.42) 56%,rgba(40,45,54,.32));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045);
}
.nfl-redzone-panel[hidden] { display: none !important; }
.nfl-redzone-header { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.nfl-redzone-header h2 { margin:3px 0 4px; color:var(--text); font-size:15px; font-weight:950; letter-spacing:.015em; }
.nfl-redzone-header p { margin:0; color:var(--muted); font-size:10px; line-height:1.4; }
.nfl-redzone-eyebrow { color:#ff7883; font-size:8px; font-weight:950; letter-spacing:.14em; }
.nfl-redzone-refresh {
  flex:0 0 auto; min-height:31px; padding:0 10px; border:1px solid rgba(255,105,120,.34);
  border-radius:8px; background:rgba(148,34,50,.2); color:#ffc1c7; font-size:9px; font-weight:950;
}
.nfl-redzone-status { margin-top:9px; color:var(--muted); font-size:10px; line-height:1.45; }
.nfl-redzone-sources { display:flex; flex-wrap:wrap; gap:7px; margin-top:9px; }
.nfl-redzone-source {
  display:inline-flex; align-items:center; justify-content:space-between; gap:13px;
  min-height:37px; max-width:100%; padding:6px 10px;
  border:1px solid rgba(255,255,255,.14); border-radius:9px;
  background:rgba(15,19,26,.55); color:var(--text); text-align:left;
}
.nfl-redzone-source strong { font-size:10px; font-weight:900; }
.nfl-redzone-source small { display:block; margin-top:2px; color:var(--muted); font-size:8px; }
.nfl-redzone-source .stream-source-play { color:#ff9ba4; white-space:nowrap; font-size:9px; font-weight:950; }
.nfl-redzone-source:disabled, .nfl-redzone-refresh:disabled { opacity:.55; cursor:wait; }
@media (max-width:640px) {
  .nfl-redzone-panel { margin:9px 9px 12px; padding:11px; }
  .nfl-redzone-header h2 { font-size:14px; }
}

.nfl-redzone-entry {
  display:flex; flex-direction:column; gap:8px; min-width:0;
  margin-top:8px; padding:10px; border:1px solid rgba(255,255,255,.1);
  border-radius:10px; background:rgba(11,15,21,.32);
}
.nfl-redzone-entry-copy { display:flex; flex-direction:column; gap:3px; min-width:0; }
.nfl-redzone-entry-copy strong { color:var(--text); font-size:11px; font-weight:950; }
.nfl-redzone-entry-copy small { color:var(--muted); font-size:8px; }
.nfl-redzone-find {
  align-self:flex-start; min-height:31px; padding:0 11px;
  border:1px solid rgba(255,105,120,.36); border-radius:8px;
  background:rgba(148,34,50,.24); color:#ffc1c7; font-size:9px; font-weight:950;
}
.nfl-redzone-find:hover { background:rgba(166,42,58,.42); }
.nfl-redzone-source-list { display:flex; flex-wrap:wrap; gap:7px; }
.nfl-redzone-source-copy { display:flex; flex-direction:column; min-width:0; gap:3px; }
.nfl-redzone-source-copy strong { max-width:100%; overflow-wrap:anywhere; font-size:9px; }
.nfl-redzone-source-copy small { color:var(--muted); font-size:8px; }
.nfl-redzone-play { color:#ff9ba4; white-space:nowrap; font-size:9px; font-weight:950; }


/* Formula 1 dashboard alignment with shared sport panels. */
.motorsports-panel { gap: 10px; padding: 12px 10px 16px; }
.motorsports-page-header { align-items: center; }
.motorsports-header-controls { display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.motorsports-season-control { display:flex; align-items:center; gap:7px; color:var(--faint); font-size:8px; font-weight:900; letter-spacing:.1em; }
.motorsports-season-control select {
  min-height:34px; padding:0 24px 0 10px; border:1px solid var(--card-border);
  border-radius:9px; background:var(--card); color:var(--text); font:inherit; font-size:10px;
}
.motorsports-championship-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; }
.motorsports-championship-heading h2 { margin:0; color:var(--text); font-size:12px; font-weight:950; }
.motorsports-championship-heading span { display:block; margin-top:4px; color:var(--faint); font-size:8px; font-weight:850; letter-spacing:.08em; }
.motorsports-mode-switch { display:flex; gap:3px; padding:3px; border:1px solid var(--card-border); border-radius:9px; background:rgba(0,0,0,.12); }
.motorsports-mode-switch button { min-height:29px; padding:0 10px; border:0; border-radius:7px; background:transparent; color:var(--muted); font-size:8px; font-weight:950; letter-spacing:.04em; cursor:pointer; }
.motorsports-mode-switch button.active { background:var(--hover); color:var(--text); box-shadow:inset 0 0 0 1px var(--card-border); }
.motorsports-championship-panel .motorsports-table-scroll { max-height:430px; }
.motorsports-championship-panel .motorsports-data-table td { padding:8px 7px; }
.motorsports-championship-panel .motorsports-data-table tbody tr:first-child td.motorsports-position { color:#f3c64e; }
.motorsports-championship-panel .motorsports-data-table tbody tr:nth-child(2) td.motorsports-position { color:#c7d1dc; }
.motorsports-championship-panel .motorsports-data-table tbody tr:nth-child(3) td.motorsports-position { color:#bd875d; }
.motorsports-stat-card { min-height:76px; }
.motorsports-stat-value { overflow-wrap:anywhere; }
.motorsports-calendar-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
@media (max-width:1000px) {
  .motorsports-feature-grid, .motorsports-standings-grid { grid-template-columns:minmax(0,1fr); }
  .motorsports-calendar-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:640px) {
  .motorsports-page-header { align-items:stretch; flex-direction:column; }
  .motorsports-header-controls { width:100%; justify-content:space-between; }
  .motorsports-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .motorsports-calendar-grid { grid-template-columns:minmax(0,1fr); }
  .motorsports-championship-heading { align-items:flex-start; flex-direction:column; }
  .motorsports-mode-switch { width:100%; }
  .motorsports-mode-switch button { flex:1; }
  .motorsports-data-table th, .motorsports-data-table td { padding:7px 5px; font-size:8px; }
}


/* Constructor and driver identity treatments. */

.motorsports-driver-cell, .motorsports-constructor-cell { display:inline-flex; align-items:center; gap:7px; min-width:0; }
.motorsports-driver-cell { white-space:nowrap; }
.motorsports-driver-headshot { width:25px; height:25px; flex:0 0 25px; border-radius:50%; object-fit:cover; background:rgba(255,255,255,.06); }
.motorsports-team-color { width:3px; height:22px; flex:0 0 3px; border-radius:3px; background:#707987; }
.motorsports-driver-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text); font-weight:800; }
.motorsports-constructor-cell strong { color:var(--text); font-weight:850; }
.motorsports-data-table tbody tr td:first-child { font-weight:900; }


/* Only show the schedule picker for the selected college sport. */
.cbb-schedule-toolbar[hidden] { display: none !important; }


/* Hard guard: show only the schedule picker belonging to the active college sport. */
html:not([data-active-sport="CBB"]) #cbbScheduleToolbar,
html:not([data-active-sport="CFB"]) #cfbScheduleToolbar,
html:not([data-home-view="scores"]) #cbbScheduleToolbar,
html:not([data-home-view="scores"]) #cfbScheduleToolbar {
  display: none !important;
}
html[data-active-sport="CBB"] #cfbScheduleToolbar,
html[data-active-sport="CFB"] #cbbScheduleToolbar {
  display: none !important;
}


/* MultiView stays inside the app instead of opening a separate browser tab. */
.multiview-inapp {
  position: fixed;
  z-index: 100000;
  inset: 0;
  display: flex;
  flex-direction: column;
  padding: 0;
  background: #080b11;
}
.multiview-inapp[hidden] { display: none !important; }
.multiview-inapp iframe {
  display: block;
  flex: 1 1 auto;
  width: 100%;
  height: 100%;
  min-height: 0;
  border: 0;
  background: #080b11;
}
.multiview-inapp-close {
  position: absolute;
  z-index: 3;
  top: max(8px, env(safe-area-inset-top));
  right: max(8px, env(safe-area-inset-right));
  width: 40px;
  height: 40px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 12px;
  background: rgba(18,24,34,.94);
  color: #fff;
  font-size: 26px;
  line-height: 1;
}


/* NFL RedZone now uses the same compact footprint as regular game cards. */
.nfl-redzone-card {
  min-height: 0;
  height: auto;
  justify-content: flex-start;
  gap: 9px;
  padding: 13px;
  border-color: rgba(235, 74, 74, .34);
  background: var(--card-bg, rgba(255,255,255,.035));
  box-sizing: border-box;
}
.nfl-redzone-card .nfl-redzone-title {
  font-size: 13px;
  line-height: 1.25;
  letter-spacing: .045em;
}
.nfl-redzone-card .nfl-redzone-description {
  font-size: 10px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.nfl-redzone-card .nfl-redzone-btn {
  align-self: flex-start;
  min-height: 30px;
  padding: 7px 11px;
}


/* Explicit refresh control for the Watch Live source list. */
.watch-source-refresh {
  flex: 0 0 auto;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid rgba(101,157,232,.48);
  border-radius: 8px;
  background: rgba(45,91,145,.28);
  color: #dceaff;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .045em;
  white-space: nowrap;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, opacity .15s ease;
}
.watch-source-refresh:hover:not(:disabled) {
  background: rgba(55,111,176,.42);
  border-color: rgba(130,180,245,.72);
}
.watch-source-refresh:disabled {
  opacity: .55;
  cursor: wait;
}
@media (max-width: 760px) {
  .watch-source-row { flex-wrap: wrap; }
  .watch-source-row .watch-source-select { flex: 1 1 calc(100% - 100px); }
  .watch-source-refresh { min-height: 32px; }
}


.nfl-redzone-multiview-btn {
  border: 1px solid rgba(91,160,255,.48);
  background: rgba(42,103,174,.24);
  color: #dceaff;
}
.nfl-redzone-multiview-btn:hover {
  border-color: rgba(135,188,255,.8);
  background: rgba(42,103,174,.42);
}
.nfl-redzone-entry .nfl-redzone-multiview-btn {
  align-self: flex-start;
  margin-top: 7px;
}