/*
  scsl15-stat-vault.bundle.css
  Generated by controlled v4.0 Stat Vault polish sync.
  Final quality fixes are intentionally last for production parity polish.
*/

/* ===== assets/style.css ===== */
:root {
  --bg: #070812;
  --card: rgba(255,255,255,.07);
  --card2: rgba(255,255,255,.11);
  --line: rgba(255,255,255,.13);
  --text: #f7f7fb;
  --muted: #aeb3c7;
  --gold: #f5c76b;
  --blue: #3b82f6;
  --red: #ef4444;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at 15% 0%, rgba(59,130,246,.22), transparent 30%),
    radial-gradient(circle at 85% 5%, rgba(239,68,68,.22), transparent 28%),
    linear-gradient(180deg, #101225 0%, var(--bg) 48%, #05050b 100%);
  min-height: 100vh;
}

.hero {
  padding: 34px 18px 22px;
  border-bottom: 1px solid var(--line);
}

.hero-inner {
  max-width: 1120px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 18px;
}

.logo {
  width: min(520px, 72vw);
  height: auto;
  max-height: 120px;
  object-fit: contain;
  border-radius: 0;
  background: transparent;
  padding: 0;
}

.eyebrow {
  margin: 0 0 4px;
  color: var(--gold);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .16em;
  font-weight: 800;
}

h1 {
  margin: 0;
  font-size: clamp(42px, 8vw, 84px);
  line-height: .9;
  letter-spacing: -.06em;
}

.sub {
  margin: 10px 0 0;
  color: var(--muted);
  max-width: 680px;
  font-size: 15px;
}

main {
  max-width: 1120px;
  margin: 0 auto;
  padding: 18px;
}

.panel {
  background: rgba(255,255,255,.045);
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 18px;
  margin: 18px 0;
  box-shadow: 0 24px 80px rgba(0,0,0,.25);
}

.section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

h2 {
  margin: 0;
  font-size: 24px;
  letter-spacing: -.03em;
}

.section-head p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  text-align: right;
}

.top15-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.card {
  border: 1px solid var(--line);
  background: linear-gradient(180deg, var(--card2), var(--card));
  border-radius: 18px;
  padding: 14px;
}

.rank {
  color: var(--gold);
  font-weight: 950;
  font-size: 13px;
  letter-spacing: .08em;
}

.player {
  margin-top: 4px;
  font-size: 20px;
  font-weight: 900;
  letter-spacing: -.03em;
}

.meta {
  margin-top: 8px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.stats {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px;
}

.pill {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 8px;
  font-size: 12px;
  background: rgba(255,255,255,.06);
}

.table-wrap {
  overflow-x: auto;
}

table.dataTable {
  color: var(--text);
}

table.dataTable th,
table.dataTable td {
  color: var(--text);
  border-color: var(--line);
}

.dt-search input,
.dt-length select {
  color: var(--text) !important;
  background: rgba(255,255,255,.08) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
}

.dt-info,
.dt-length,
.dt-search {
  color: var(--muted) !important;
}

footer {
  color: var(--muted);
  text-align: center;
  font-size: 12px;
  padding: 28px 18px 44px;
}

@media (max-width: 900px) {
  .top15-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .hero-inner {
    align-items: flex-start;
  }

  .logo {
    width: min(420px, 88vw);
    height: auto;
    max-height: 96px;
    border-radius: 0;
  }

  .section-head {
    display: block;
  }

  .section-head p {
    text-align: left;
    margin-top: 4px;
  }

  .top15-grid {
    grid-template-columns: 1fr;
  }

  .panel {
    padding: 14px;
    border-radius: 20px;
  }
}

.search-box {
  width: 100%;
  max-width: 360px;
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.08);
  color: var(--text);
  outline: none;
}

.search-box::placeholder {
  color: var(--muted);
}

#playersTable {
  width: 100%;
  border-collapse: collapse;
  min-width: 980px;
}

#playersTable th,
#playersTable td {
  padding: 10px 9px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  font-size: 13px;
}

#playersTable th {
  color: var(--gold);
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
  background: rgba(255,255,255,.05);
}

#playersTable tr:hover td {
  background: rgba(255,255,255,.045);
}

.formula-panel {
  border-color: rgba(245,199,107,.25);
}

.formula-box {
  border: 1px solid var(--line);
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(245,199,107,.10), rgba(255,255,255,.04));
  padding: 16px;
}

.formula-main {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 14px;
}

.formula-main span {
  color: var(--gold);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.formula-main strong {
  font-size: clamp(22px, 4vw, 36px);
  letter-spacing: -.04em;
}

.formula-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.formula-card {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 12px;
  background: rgba(0,0,0,.18);
}

.formula-label {
  color: var(--gold);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .1em;
}

.formula-value {
  margin-top: 6px;
  font-size: 15px;
  font-weight: 850;
}

.formula-card p,
.formula-note {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

.formula-card p {
  margin: 8px 0 0;
}

.formula-note {
  margin: 14px 0 0;
}

@media (max-width: 900px) {
  .formula-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .formula-grid {
    grid-template-columns: 1fr;
  }
}

/* Clean SCSL15 hero refresh */
.hero {
  padding: 42px 18px 30px;
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.14), transparent 38%),
    linear-gradient(180deg, rgba(0,0,0,.30), rgba(255,255,255,.015));
}

.hero-inner.clean-hero {
  max-width: 980px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
}

.logo.logo-lockup {
  width: min(720px, 92vw);
  height: auto;
  max-height: none;
  object-fit: contain;
  border-radius: 0;
  background: transparent;
  padding: 0;
  filter: drop-shadow(0 18px 34px rgba(0,0,0,.42));
}

.hero-sub {
  max-width: 760px;
  margin: 0;
  color: rgba(247,247,251,.78);
  font-size: 15px;
  line-height: 1.45;
}

.hero-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 4px;
}

.hero-chips span {
  border: 1px solid rgba(245,199,107,.28);
  background: rgba(0,0,0,.24);
  color: rgba(247,247,251,.84);
  border-radius: 999px;
  padding: 7px 10px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
}

.eyebrow {
  margin: 0;
  color: var(--gold);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .22em;
  font-weight: 900;
}

/* tighten page spacing after cleaner hero */
main {
  padding-top: 24px;
}

@media (max-width: 640px) {
  .hero {
    padding: 30px 14px 22px;
  }

  .logo.logo-lockup {
    width: min(520px, 95vw);
  }

  .hero-sub {
    font-size: 13px;
  }

  .hero-chips span {
    font-size: 11px;
    padding: 6px 9px;
  }
}

.music-intro {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 18px;
  background:
    radial-gradient(circle at 25% 10%, rgba(245,199,107,.22), transparent 34%),
    radial-gradient(circle at 80% 20%, rgba(59,130,246,.20), transparent 32%),
    rgba(3,4,10,.88);
  backdrop-filter: blur(14px);
}

.music-intro.hide {
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease;
}

.music-intro-card {
  width: min(560px, 94vw);
  border: 1px solid rgba(245,199,107,.38);
  border-radius: 28px;
  padding: 26px;
  text-align: center;
  background:
    linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.055)),
    rgba(7,8,18,.94);
  box-shadow: 0 30px 120px rgba(0,0,0,.55);
}

.music-intro-kicker {
  color: var(--gold);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.music-intro-card h2 {
  margin: 8px 0 8px;
  font-size: clamp(34px, 7vw, 58px);
  letter-spacing: -.06em;
}

.music-intro-card p {
  margin: 0 auto 18px;
  max-width: 420px;
  color: var(--muted);
  line-height: 1.45;
}

.music-intro-actions {
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

.intro-primary,
.intro-secondary {
  border-radius: 999px;
  padding: 12px 16px;
  font-weight: 950;
  cursor: pointer;
}

.intro-primary {
  border: 1px solid rgba(255,255,255,.55);
  color: #101014;
  background: linear-gradient(180deg, #f5c76b, #b9892f);
}

.intro-secondary {
  border: 1px solid var(--line);
  color: var(--text);
  background: rgba(255,255,255,.08);
}

.music-intro-note {
  margin-top: 14px;
  color: var(--muted);
  font-size: 12px;
}

.music-btn {
  border: 1px solid rgba(245,199,107,.55);
  background: linear-gradient(180deg, rgba(245,199,107,.18), rgba(255,255,255,.06));
  color: var(--text);
  border-radius: 999px;
  padding: 8px 12px;
  font-weight: 850;
  font-size: 12px;
  letter-spacing: .04em;
  cursor: pointer;
  box-shadow: 0 10px 30px rgba(0,0,0,.24);
}

.music-btn.playing {
  color: #111;
  background: linear-gradient(180deg, #f5c76b, #b9892f);
  border-color: rgba(255,255,255,.55);
}

/* ===== SCSL15 CLEAN POLISH PASS ===== */

body {
  background:
    radial-gradient(circle at 50% -10%, rgba(245,199,107,.18), transparent 34%),
    radial-gradient(circle at 15% 0%, rgba(59,130,246,.16), transparent 28%),
    radial-gradient(circle at 85% 0%, rgba(239,68,68,.14), transparent 28%),
    linear-gradient(180deg, #0d0f1d 0%, #070812 48%, #04050a 100%);
}

.hero {
  padding: 34px 18px 26px;
  border-bottom: 1px solid rgba(245,199,107,.18);
}

.hero-inner.hero-centered {
  max-width: 980px;
  margin: 0 auto;
  text-align: center;
  display: grid;
  justify-items: center;
  gap: 10px;
}

.logo.logo-lockup {
  width: min(680px, 92vw);
  max-height: 170px;
  filter: drop-shadow(0 18px 42px rgba(0,0,0,.48));
}

.eyebrow {
  color: var(--gold);
  font-size: 11px;
  letter-spacing: .22em;
  opacity: .95;
}

.hero-sub {
  max-width: 720px;
  margin: 4px auto 0;
  color: rgba(247,247,251,.78);
  font-size: 14px;
}

.hero-chips {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.hero-chips span,
.hero-chips button {
  border: 1px solid rgba(245,199,107,.28);
  background: rgba(255,255,255,.055);
  color: rgba(247,247,251,.88);
  border-radius: 999px;
  padding: 7px 11px;
  font-size: 12px;
  font-weight: 850;
  backdrop-filter: blur(8px);
}

main {
  max-width: 1160px;
  padding-top: 14px;
}

.panel {
  background: rgba(255,255,255,.038);
  border: 1px solid rgba(255,255,255,.105);
  border-radius: 22px;
  padding: 18px;
  box-shadow: 0 22px 70px rgba(0,0,0,.22);
}

.section-head {
  border-bottom: 1px solid rgba(255,255,255,.08);
  padding-bottom: 12px;
}

.section-head h2 {
  font-size: 22px;
}

.section-head p {
  max-width: 520px;
}

.formula-box {
  background: rgba(0,0,0,.18);
  border-color: rgba(245,199,107,.18);
}

.formula-main {
  justify-content: center;
  text-align: center;
}

.formula-main strong {
  font-size: clamp(22px, 3.6vw, 32px);
}

.formula-card {
  background: rgba(255,255,255,.045);
  border-color: rgba(255,255,255,.10);
}

.formula-value {
  color: rgba(255,255,255,.94);
}

.top15-grid {
  gap: 10px;
}

.card {
  position: relative;
  overflow: hidden;
  padding: 14px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.035)),
    rgba(0,0,0,.08);
}

.card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(245,199,107,.16), transparent 34%);
  pointer-events: none;
}

.card > * {
  position: relative;
}

.rank {
  display: inline-flex;
  border: 1px solid rgba(245,199,107,.36);
  background: rgba(245,199,107,.10);
  border-radius: 999px;
  padding: 4px 8px;
}

.player {
  margin-top: 8px;
  line-height: 1.05;
}

.meta {
  font-size: 12.5px;
  color: rgba(184,188,207,.92);
}

.pill {
  background: rgba(0,0,0,.20);
  border-color: rgba(255,255,255,.10);
}

.table-wrap {
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  padding: 10px;
  background: rgba(0,0,0,.14);
}

.search-box {
  max-width: 100%;
  margin-bottom: 10px;
}

#playersTable th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: rgba(15,16,28,.98);
}

#playersTable td {
  color: rgba(247,247,251,.86);
}

#playersTable td:first-child,
#playersTable th:first-child {
  position: sticky;
  left: 0;
  z-index: 3;
  background: rgba(15,16,28,.98);
  font-weight: 850;
}

.music-intro-card {
  max-width: 520px;
  border-radius: 24px;
}

.music-intro-card h2 {
  font-size: clamp(32px, 6vw, 50px);
}

@media (max-width: 640px) {
  .hero {
    padding: 24px 12px 18px;
  }

  .logo.logo-lockup {
    width: min(560px, 96vw);
    max-height: 135px;
  }

  .panel {
    padding: 14px;
    border-radius: 18px;
  }

  .top15-grid {
    gap: 9px;
  }

  .card {
    padding: 13px;
  }

  .table-wrap {
    padding: 8px;
  }
}

.enter-logo {
  display: block;
  width: min(430px, 86vw);
  height: auto;
  margin: 0 auto 14px;
  filter: drop-shadow(0 18px 38px rgba(0,0,0,.42));
}

@media (max-width: 640px) {
  .enter-logo {
    width: min(390px, 88vw);
    margin-bottom: 12px;
  }
}

/* ===== DESKTOP INTRO LANDING POLISH ===== */

.music-intro {
  min-height: 100dvh;
  align-items: center;
  background:
    radial-gradient(circle at 50% 22%, rgba(245,199,107,.18), transparent 28%),
    radial-gradient(circle at 78% 18%, rgba(59,130,246,.18), transparent 32%),
    radial-gradient(circle at 20% 18%, rgba(239,68,68,.10), transparent 28%),
    linear-gradient(180deg, rgba(5,6,12,.78), rgba(4,5,10,.96));
}

.music-intro-card {
  width: min(760px, 92vw);
  min-height: 460px;
  padding: 34px 34px 28px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-radius: 34px;
  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.11), transparent 48%),
    linear-gradient(180deg, rgba(255,255,255,.105), rgba(255,255,255,.045)),
    rgba(7,8,18,.94);
  border: 1px solid rgba(245,199,107,.42);
  box-shadow:
    0 35px 140px rgba(0,0,0,.65),
    inset 0 1px 0 rgba(255,255,255,.12);
}

.enter-logo {
  width: min(640px, 86vw);
  height: 170px;
  object-fit: cover;
  object-position: center;
  margin: 0 auto 26px;
  border-radius: 22px;
  filter:
    drop-shadow(0 18px 42px rgba(0,0,0,.55))
    drop-shadow(0 0 26px rgba(245,199,107,.20));
}

.music-intro-card p {
  font-size: 18px;
  max-width: 560px;
  margin-bottom: 24px;
}

.music-intro-actions {
  gap: 14px;
}

.intro-primary,
.intro-secondary {
  padding: 14px 22px;
  font-size: 15px;
}

.music-intro-note {
  margin-top: 18px;
  font-size: 13px;
  opacity: .86;
}

@media (max-width: 640px) {
  .music-intro-card {
    width: min(94vw, 560px);
    min-height: auto;
    padding: 24px 18px;
    border-radius: 24px;
  }

  .enter-logo {
    width: min(430px, 88vw);
    height: 120px;
    margin-bottom: 18px;
    border-radius: 16px;
  }

  .music-intro-card p {
    font-size: 16px;
    margin-bottom: 18px;
  }

  .intro-primary,
  .intro-secondary {
    padding: 12px 16px;
    font-size: 14px;
  }
}

/* ===== FINAL INTRO EXPERIENCE POLISH ===== */

.music-intro {
  min-height: 100dvh !important;
  padding: 32px !important;
  display: grid !important;
  place-items: center !important;
  background:
    radial-gradient(circle at 50% 20%, rgba(245,199,107,.24), transparent 24%),
    radial-gradient(circle at 80% 12%, rgba(37,99,235,.20), transparent 30%),
    radial-gradient(circle at 18% 12%, rgba(185,28,28,.15), transparent 28%),
    linear-gradient(180deg, rgba(5,6,14,.72), rgba(3,4,10,.97)) !important;
}

.music-intro-card {
  width: min(820px, 92vw) !important;
  min-height: 520px !important;
  padding: 42px 46px 36px !important;
  border-radius: 36px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  background:
    radial-gradient(circle at 50% -5%, rgba(245,199,107,.16), transparent 46%),
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.045)),
    rgba(8,9,18,.96) !important;
  border: 1px solid rgba(245,199,107,.46) !important;
  box-shadow:
    0 42px 150px rgba(0,0,0,.72),
    inset 0 1px 0 rgba(255,255,255,.13) !important;
}

.enter-logo {
  width: min(700px, 82vw) !important;
  height: 190px !important;
  object-fit: cover !important;
  object-position: center !important;
  margin: 0 auto 30px !important;
  border-radius: 24px !important;
  filter:
    drop-shadow(0 22px 50px rgba(0,0,0,.62))
    drop-shadow(0 0 28px rgba(245,199,107,.22)) !important;
}

.music-intro-card p {
  max-width: 620px !important;
  margin: 0 auto 26px !important;
  font-size: 20px !important;
  line-height: 1.42 !important;
  color: rgba(235,238,248,.86) !important;
}

.music-intro-actions {
  gap: 16px !important;
  margin-top: 2px !important;
}

.intro-primary,
.intro-secondary {
  padding: 15px 24px !important;
  font-size: 15px !important;
  min-width: 160px !important;
}

.music-intro-note {
  margin-top: 22px !important;
  font-size: 13px !important;
  color: rgba(184,188,207,.82) !important;
}

@media (max-width: 640px) {
  .music-intro {
    padding: 16px !important;
  }

  .music-intro-card {
    width: 94vw !important;
    min-height: auto !important;
    padding: 24px 18px !important;
    border-radius: 26px !important;
  }

  .enter-logo {
    width: min(430px, 88vw) !important;
    height: 118px !important;
    margin-bottom: 18px !important;
    border-radius: 16px !important;
  }

  .music-intro-card p {
    font-size: 16px !important;
    margin-bottom: 18px !important;
  }

  .intro-primary,
  .intro-secondary {
    min-width: 0 !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
  }
}

/* ===== DESKTOP-ONLY SCSL15 ENTRANCE UPGRADE ===== */

@media (min-width: 900px) {
  .music-intro {
    padding: 48px !important;
    place-items: center !important;
  }

  .music-intro::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
      linear-gradient(90deg, rgba(245,199,107,.08), transparent 18%, transparent 82%, rgba(245,199,107,.08)),
      radial-gradient(circle at 50% 50%, rgba(245,199,107,.14), transparent 34%);
  }

  .music-intro-card {
    width: min(980px, 78vw) !important;
    min-height: 620px !important;
    padding: 58px 72px 48px !important;
    border-radius: 42px !important;
    transform: translateY(-8px);
  }

  .enter-logo {
    width: min(820px, 68vw) !important;
    height: 250px !important;
    object-fit: cover !important;
    object-position: center !important;
    margin-bottom: 34px !important;
    border-radius: 28px !important;
  }

  .music-intro-card p {
    font-size: 22px !important;
    max-width: 680px !important;
    margin-bottom: 30px !important;
  }

  .music-intro-actions {
    gap: 18px !important;
  }

  .intro-primary,
  .intro-secondary {
    min-width: 190px !important;
    padding: 17px 28px !important;
    font-size: 16px !important;
  }

  .music-intro-note {
    margin-top: 26px !important;
    font-size: 14px !important;
  }
}

@media (min-width: 1200px) {
  .music-intro-card {
    width: 980px !important;
  }

  .enter-logo {
    width: 820px !important;
    height: 250px !important;
  }
}

/* ===== FIX INTRO LOGO OVERFLOW / DESKTOP FINAL ===== */

.music-intro-card {
  overflow: hidden !important;
}

@media (min-width: 900px) {
  .music-intro-card {
    width: min(900px, calc(100vw - 140px)) !important;
    max-width: 900px !important;
    min-height: 540px !important;
    padding: 48px 54px 42px !important;
    border-radius: 34px !important;
  }

  .enter-logo {
    display: block !important;
    width: 100% !important;
    max-width: 680px !important;
    height: auto !important;
    max-height: 190px !important;
    object-fit: contain !important;
    object-position: center !important;
    margin: 0 auto 34px !important;
    border-radius: 18px !important;
  }

  .music-intro-card p {
    width: 100% !important;
    max-width: 560px !important;
    margin: 0 auto 28px !important;
    text-align: center !important;
  }

  .music-intro-actions {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 16px !important;
  }

  .intro-primary,
  .intro-secondary {
    width: 180px !important;
    min-width: 180px !important;
  }
}

@media (max-width: 899px) {
  .enter-logo {
    width: min(390px, 88vw) !important;
    height: auto !important;
    max-height: 130px !important;
    object-fit: contain !important;
  }
}

/* ===== FINAL ENTER LOGO SIZE FIX ===== */

@media (min-width: 900px) {
  .music-intro-card {
    width: min(880px, 82vw) !important;
    min-height: 520px !important;
    padding: 48px 56px 40px !important;
  }

  .enter-logo {
    width: min(720px, 70vw) !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    margin: 0 auto 34px !important;
    border-radius: 18px !important;
  }
}

@media (max-width: 899px) {
  .enter-logo {
    width: min(390px, 88vw) !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    margin-bottom: 18px !important;
  }
}

/* ===== assets/polish-v2.css ===== */
/* ===== SCSL15 PREMIUM POLISH V2 ===== */

:root {
  --gold-soft: rgba(245,199,107,.22);
  --gold-line: rgba(245,199,107,.38);
  --glass: rgba(255,255,255,.055);
  --glass-strong: rgba(255,255,255,.095);
  --deep-card: rgba(8,9,18,.72);
}

/* Global page feel */
body {
  background:
    radial-gradient(circle at 50% -4%, rgba(245,199,107,.20), transparent 30%),
    radial-gradient(circle at 15% 8%, rgba(190,42,56,.14), transparent 30%),
    radial-gradient(circle at 84% 7%, rgba(49,104,210,.18), transparent 32%),
    linear-gradient(180deg, #111220 0%, #080912 46%, #04050a 100%) !important;
}

/* Hero */
.hero {
  padding: 46px 18px 38px !important;
  border-bottom: 1px solid rgba(245,199,107,.20) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.15), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,0)) !important;
}

.hero-inner {
  max-width: 1120px !important;
}

.hero-inner.hero-centered,
.hero-inner {
  text-align: center !important;
  display: grid !important;
  justify-items: center !important;
  gap: 10px !important;
}

.logo,
.logo.logo-lockup {
  width: min(640px, 84vw) !important;
  height: auto !important;
  max-height: 190px !important;
  object-fit: contain !important;
  filter:
    drop-shadow(0 22px 48px rgba(0,0,0,.50))
    drop-shadow(0 0 24px rgba(245,199,107,.14)) !important;
}

.eyebrow {
  font-size: 11px !important;
  letter-spacing: .24em !important;
  color: var(--gold) !important;
  opacity: .96 !important;
}

.sub,
.hero-sub {
  max-width: 720px !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
  color: rgba(247,247,251,.74) !important;
}

.hero-chips {
  margin-top: 10px !important;
  gap: 9px !important;
}

.hero-chips span,
.hero-chips button {
  border: 1px solid rgba(245,199,107,.30) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.045)) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.18) !important;
}

/* Main layout */
main {
  max-width: 1180px !important;
  padding: 28px 20px 64px !important;
}

.panel {
  margin: 24px auto !important;
  padding: 22px !important;
  border-radius: 28px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.032)),
    rgba(7,8,18,.52) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  box-shadow:
    0 28px 90px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.section-head {
  padding-bottom: 14px !important;
  margin-bottom: 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.09) !important;
}

.section-head h2 {
  font-size: 25px !important;
  letter-spacing: -.04em !important;
}

.section-head p {
  color: rgba(184,188,207,.82) !important;
}

/* Formula section */
.formula-panel {
  border-color: rgba(245,199,107,.24) !important;
}

.formula-box {
  padding: 20px !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.11), transparent 48%),
    rgba(0,0,0,.18) !important;
  border: 1px solid rgba(245,199,107,.18) !important;
}

.formula-main {
  display: grid !important;
  justify-items: center !important;
  gap: 8px !important;
  margin: 0 0 18px !important;
  padding: 20px 14px !important;
  border-radius: 20px !important;
  background:
    linear-gradient(180deg, rgba(245,199,107,.11), rgba(255,255,255,.035)) !important;
  border: 1px solid rgba(245,199,107,.20) !important;
  text-align: center !important;
}

.formula-main span {
  font-size: 11px !important;
  letter-spacing: .20em !important;
}

.formula-main strong {
  font-size: clamp(25px, 3.2vw, 40px) !important;
  line-height: 1.05 !important;
}

.formula-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

.formula-card {
  min-height: 136px !important;
  border-radius: 20px !important;
  padding: 16px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
}

.formula-label {
  font-size: 11px !important;
  letter-spacing: .14em !important;
}

.formula-value {
  margin-top: 8px !important;
  font-size: 17px !important;
  line-height: 1.25 !important;
}

.formula-card p {
  font-size: 13px !important;
  line-height: 1.45 !important;
}

.formula-note {
  margin-top: 16px !important;
  padding: 14px 16px !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.045) !important;
  border-left: 3px solid rgba(245,199,107,.58) !important;
  color: rgba(220,224,238,.83) !important;
}

/* Selection process */
.panel .formula-box .formula-note + .formula-note {
  margin-top: 10px !important;
}

.panel:not(.formula-panel) .formula-box {
  padding: 18px !important;
}

/* Top 15 cards */
.top15-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

.card {
  border-radius: 22px !important;
  padding: 16px !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.13), transparent 38%),
    linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.035)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 16px 44px rgba(0,0,0,.18) !important;
}

.card:hover {
  transform: translateY(-2px);
  border-color: rgba(245,199,107,.28) !important;
}

.rank {
  background: rgba(245,199,107,.12) !important;
  border: 1px solid rgba(245,199,107,.38) !important;
  border-radius: 999px !important;
  padding: 4px 9px !important;
}

.player {
  font-size: 21px !important;
}

.meta {
  color: rgba(200,205,222,.84) !important;
}

.pill {
  border-color: rgba(255,255,255,.13) !important;
  background: rgba(0,0,0,.22) !important;
}

/* Table */
.table-wrap {
  border-radius: 22px !important;
  padding: 12px !important;
  background: rgba(0,0,0,.18) !important;
  border: 1px solid rgba(255,255,255,.11) !important;
}

.search-box {
  height: 42px !important;
  border-radius: 14px !important;
}

/* Mobile cleanup */
@media (max-width: 900px) {
  main {
    padding: 18px 14px 52px !important;
  }

  .hero {
    padding: 28px 14px 24px !important;
  }

  .logo,
  .logo.logo-lockup {
    width: min(560px, 94vw) !important;
    max-height: 150px !important;
  }

  .formula-grid,
  .top15-grid {
    grid-template-columns: 1fr !important;
  }

  .panel {
    padding: 16px !important;
    border-radius: 22px !important;
  }

  .section-head {
    display: block !important;
  }

  .section-head p {
    margin-top: 6px !important;
    text-align: left !important;
  }

  .formula-main strong {
    font-size: 24px !important;
  }
}

@media (min-width: 901px) and (max-width: 1150px) {
  .formula-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .top15-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* ===== assets/broadcast-v3.css ===== */
/* ===== SCSL15 BROADCAST PACKAGE V3 ===== */

body {
  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.18), transparent 32%),
    radial-gradient(circle at 11% 3%, rgba(196,32,43,.18), transparent 28%),
    radial-gradient(circle at 88% 5%, rgba(31,83,180,.18), transparent 30%),
    linear-gradient(180deg, #0c0d16 0%, #06070d 52%, #030408 100%) !important;
}

/* Top broadcast bar */
.broadcast-bar {
  position: sticky;
  top: 0;
  z-index: 5000;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 18px;
  color: #fff;
  background:
    linear-gradient(90deg, #a90f1d 0%, #171923 38%, #11131b 100%);
  border-bottom: 1px solid rgba(245,199,107,.34);
  box-shadow: 0 12px 34px rgba(0,0,0,.34);
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.broadcast-left,
.broadcast-right {
  display: flex;
  align-items: center;
  gap: 10px;
}

.broadcast-live {
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 10px;
  border-radius: 4px;
  background: #d7192a;
  color: #fff;
  font-weight: 950;
  letter-spacing: .12em;
  box-shadow: 0 0 18px rgba(215,25,42,.35);
}

.broadcast-title {
  font-weight: 950;
  color: rgba(255,255,255,.92);
}

.broadcast-right {
  color: rgba(255,255,255,.68);
}

/* Ticker */
.broadcast-ticker {
  position: sticky;
  top: 42px;
  z-index: 4999;
  height: 34px;
  overflow: hidden;
  display: flex;
  align-items: center;
  background: #05060a;
  border-bottom: 1px solid rgba(255,255,255,.10);
}

.ticker-track {
  display: flex;
  gap: 34px;
  min-width: max-content;
  animation: scslTicker 34s linear infinite;
  color: rgba(247,247,251,.86);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.ticker-track span::before {
  content: "◆";
  color: var(--gold);
  margin: 0 12px 0 0;
}

@keyframes scslTicker {
  from { transform: translateX(100vw); }
  to { transform: translateX(-100%); }
}

/* Hero as broadcast lead package */
.hero {
  position: relative;
  padding-top: 54px !important;
  padding-bottom: 42px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), transparent),
    radial-gradient(circle at 50% 5%, rgba(245,199,107,.18), transparent 34%) !important;
}

.hero::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: min(980px, 88vw);
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(245,199,107,.70), transparent);
}

.eyebrow::before,
.eyebrow::after {
  content: "";
  display: inline-block;
  width: 34px;
  height: 2px;
  margin: 0 10px 4px;
  background: rgba(245,199,107,.72);
}

.logo,
.logo.logo-lockup {
  filter:
    drop-shadow(0 24px 56px rgba(0,0,0,.62))
    drop-shadow(0 0 30px rgba(245,199,107,.18)) !important;
}

/* Stat recap strip */
.broadcast-recap {
  max-width: 1180px;
  margin: 22px auto 4px;
  padding: 0 20px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.recap-card {
  min-height: 96px;
  padding: 14px 16px;
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(196,32,43,.16), rgba(255,255,255,.05) 40%, rgba(245,199,107,.07)),
    rgba(6,7,12,.72);
  border: 1px solid rgba(255,255,255,.11);
  box-shadow: 0 18px 48px rgba(0,0,0,.24);
}

.recap-label {
  color: var(--gold);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.recap-value {
  margin-top: 7px;
  font-size: 26px;
  font-weight: 950;
  letter-spacing: -.04em;
  color: #fff;
  line-height: 1;
}

.recap-name {
  font-size: 22px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.recap-note {
  margin-top: 7px;
  color: rgba(184,188,207,.82);
  font-size: 12px;
  font-weight: 750;
}

/* Section headers feel like broadcast segment headers */
.section-head h2 {
  display: flex;
  align-items: center;
  gap: 10px;
}

.section-head h2::before {
  content: "SCSL";
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border-radius: 4px;
  background: #d7192a;
  color: #fff;
  font-size: 10px;
  letter-spacing: .12em;
  font-weight: 950;
}

.panel {
  border-top: 3px solid rgba(215,25,42,.75) !important;
}

/* Formula lead line stronger */
.formula-main {
  border-left: 4px solid #d7192a !important;
  border-right: 4px solid rgba(245,199,107,.72) !important;
}

.formula-main strong {
  text-transform: none;
}

/* Cards as sports lower-thirds */
.card {
  border-top: 3px solid rgba(245,199,107,.52) !important;
}

.card:nth-child(-n+3) {
  border-top-color: #d7192a !important;
}

.rank {
  color: #fff !important;
  background: linear-gradient(180deg, #d7192a, #83101a) !important;
  border-color: rgba(255,255,255,.18) !important;
}

.player {
  text-transform: none;
}

/* Player database: broadcast stat table */
#playersTable th {
  background: linear-gradient(180deg, #151722, #0b0d14) !important;
  color: #f5c76b !important;
  border-bottom: 2px solid rgba(215,25,42,.75) !important;
}

#playersTable td:first-child,
#playersTable th:first-child {
  border-right: 1px solid rgba(245,199,107,.16);
}

/* Mobile */
@media (max-width: 720px) {
  .broadcast-bar {
    height: 38px;
    padding: 0 10px;
  }

  .broadcast-right {
    display: none;
  }

  .broadcast-title {
    font-size: 11px;
  }

  .broadcast-ticker {
    top: 38px;
    height: 30px;
  }

  .ticker-track {
    font-size: 10px;
  }

  .broadcast-recap {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 0 14px;
    gap: 10px;
  }

  .recap-card {
    min-height: 88px;
    padding: 12px;
  }

  .recap-value {
    font-size: 22px;
  }

  .recap-name {
    font-size: 18px;
  }

  .section-head h2::before {
    display: none;
  }
}

/* ===== assets/fonts-broadcast.css ===== */
/* ===== SCSL15 COOL / CLEAN FONT PACKAGE ===== */

:root {
  --font-body: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Bebas Neue", Impact, "Arial Narrow", sans-serif;
  --font-stat: "Rajdhani", "Inter", ui-sans-serif, system-ui, sans-serif;
}

body {
  font-family: var(--font-body) !important;
  font-feature-settings: "tnum";
}

/* Big social-sports display text */
h1,
h2,
.title,
.player,
.formula-main strong,
.broadcast-live,
.broadcast-title,
.broadcast-right,
.ticker-track,
.section-head h2 {
  font-family: var(--font-display) !important;
  text-transform: uppercase;
  letter-spacing: .035em !important;
  font-weight: 400 !important;
}

/* Stats / pills / tables */
.recap-value,
.formula-value,
.rank,
.pill,
.music-btn,
.intro-primary,
.intro-secondary,
.hero-chips span,
.hero-chips button,
#playersTable th,
#playersTable td:first-child {
  font-family: var(--font-stat) !important;
  text-transform: uppercase;
  font-weight: 700 !important;
}

/* Body readable text */
.meta,
.sub,
.hero-sub,
.formula-card p,
.formula-note,
.recap-note,
.section-head p,
.music-intro-card p,
.music-intro-note,
#playersTable td {
  font-family: var(--font-body) !important;
  text-transform: none !important;
}

/* Font sizing polish */
.section-head h2 {
  font-size: 34px !important;
  line-height: .95 !important;
}

.player {
  font-size: 27px !important;
  line-height: .95 !important;
}

.formula-main strong {
  font-size: clamp(32px, 4.2vw, 54px) !important;
  line-height: .9 !important;
}

.formula-label,
.recap-label,
.eyebrow,
.music-intro-kicker {
  font-family: var(--font-stat) !important;
  letter-spacing: .18em !important;
  font-weight: 700 !important;
  text-transform: uppercase;
}

.recap-value {
  letter-spacing: -.02em !important;
  font-size: 32px !important;
}

.recap-name {
  letter-spacing: .01em !important;
}

.rank {
  letter-spacing: .10em !important;
}

.pill {
  letter-spacing: .04em !important;
}

#playersTable th {
  letter-spacing: .08em !important;
  font-size: 12px !important;
}

#playersTable td:first-child {
  letter-spacing: .05em !important;
}

.broadcast-title {
  font-size: 18px !important;
}

.broadcast-live {
  font-size: 16px !important;
}

.ticker-track {
  font-size: 13px !important;
  letter-spacing: .10em !important;
}

/* Top intro */
.music-intro-card p {
  font-size: 18px !important;
}

.intro-primary,
.intro-secondary {
  letter-spacing: .06em !important;
}

@media (max-width: 640px) {
  .section-head h2 {
    font-size: 29px !important;
  }

  .player {
    font-size: 25px !important;
  }

  .formula-main strong {
    font-size: 32px !important;
  }

  .recap-value {
    font-size: 26px !important;
  }

  .broadcast-title {
    font-size: 15px !important;
  }

  .broadcast-live {
    font-size: 14px !important;
  }
}

/* ===== assets/instagram-vibe.css ===== */
/* ===== SCSL15 INSTAGRAM / 2K COMMUNITY THEME ===== */

:root {
  --ig-purple: #8b5cf6;
  --ig-pink: #ec4899;
  --ig-red: #ef233c;
  --ig-gold: #f5c76b;
  --ig-cyan: #22d3ee;
}

/* Overall vibe */
body {
  background:
    radial-gradient(circle at 20% 0%, rgba(139,92,246,.30), transparent 30%),
    radial-gradient(circle at 80% 5%, rgba(236,72,153,.24), transparent 26%),
    radial-gradient(circle at 50% -8%, rgba(245,199,107,.18), transparent 28%),
    linear-gradient(180deg, #090711 0%, #070812 48%, #03040a 100%) !important;
}

/* Broadcast bar becomes more social/sports page */
.broadcast-bar {
  height: 48px !important;
  background:
    linear-gradient(90deg, #111827 0%, #2b123f 34%, #7f1d1d 68%, #111827 100%) !important;
  border-bottom: 1px solid rgba(245,199,107,.35) !important;
}

.broadcast-live {
  background: linear-gradient(135deg, var(--ig-red), var(--ig-pink)) !important;
  border-radius: 999px !important;
}

.broadcast-title {
  color: rgba(255,255,255,.96) !important;
}

.broadcast-ticker {
  top: 48px !important;
  background: rgba(4,5,10,.92) !important;
  backdrop-filter: blur(12px);
}

.ticker-track span::before {
  color: var(--ig-pink) !important;
}

/* Hero gets more "drop announcement" energy */
.hero {
  padding-top: 62px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.18), transparent 34%),
    radial-gradient(circle at 35% 20%, rgba(139,92,246,.20), transparent 30%),
    radial-gradient(circle at 68% 22%, rgba(236,72,153,.15), transparent 26%) !important;
}

.logo,
.logo.logo-lockup {
  filter:
    drop-shadow(0 26px 60px rgba(0,0,0,.68))
    drop-shadow(0 0 34px rgba(245,199,107,.24))
    drop-shadow(0 0 22px rgba(139,92,246,.20)) !important;
}

.eyebrow {
  color: transparent !important;
  background: linear-gradient(90deg, var(--ig-gold), #fff, var(--ig-pink));
  -webkit-background-clip: text;
  background-clip: text;
}

.hero-chips span,
.hero-chips button,
.music-btn {
  border: 1px solid rgba(255,255,255,.14) !important;
  background:
    linear-gradient(135deg, rgba(139,92,246,.22), rgba(236,72,153,.12)),
    rgba(255,255,255,.06) !important;
  box-shadow:
    0 12px 30px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.10) !important;
}

/* Panels become glassy IG carousel-style sections */
.panel {
  border-radius: 30px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.035)),
    rgba(8,8,18,.72) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow:
    0 30px 100px rgba(0,0,0,.36),
    inset 0 1px 0 rgba(255,255,255,.09) !important;
  overflow: hidden;
}

.panel {
  border-top: 0 !important;
}

.panel::before {
  content: "";
  display: block;
  height: 4px;
  margin: -22px -22px 18px;
  background: linear-gradient(90deg, var(--ig-purple), var(--ig-pink), var(--ig-gold));
}

/* Section headers feel like IG sports posts */
.section-head h2 {
  font-size: 30px !important;
  letter-spacing: -.02em !important;
}

.section-head h2::before {
  content: "DROP" !important;
  background: linear-gradient(135deg, var(--ig-red), var(--ig-pink)) !important;
  border-radius: 999px !important;
  font-size: 10px !important;
}

.section-head p {
  color: rgba(225,229,242,.72) !important;
}

/* Formula section as a premium stat engine block */
.formula-box {
  background:
    radial-gradient(circle at 10% 0%, rgba(139,92,246,.17), transparent 36%),
    radial-gradient(circle at 90% 0%, rgba(236,72,153,.13), transparent 32%),
    rgba(0,0,0,.18) !important;
}

.formula-main {
  border: 1px solid rgba(255,255,255,.12) !important;
  background:
    linear-gradient(135deg, rgba(139,92,246,.18), rgba(245,199,107,.09), rgba(236,72,153,.14)) !important;
}

.formula-main span {
  color: transparent !important;
  background: linear-gradient(90deg, var(--ig-gold), #fff, var(--ig-pink));
  -webkit-background-clip: text;
  background-clip: text;
}

.formula-main strong {
  color: #fff !important;
  text-shadow: 0 0 24px rgba(245,199,107,.18);
}

.formula-card {
  border-radius: 22px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.030)),
    rgba(0,0,0,.12) !important;
}

.formula-label {
  color: var(--ig-gold) !important;
}

/* Top 15 cards look like IG carousel cards */
.top15-grid {
  gap: 16px !important;
}

.card {
  border-radius: 26px !important;
  padding: 18px !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.16), transparent 32%),
    radial-gradient(circle at 100% 0%, rgba(236,72,153,.12), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.035)),
    rgba(7,8,17,.78) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  box-shadow:
    0 22px 60px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.09) !important;
}

.card::before {
  background: linear-gradient(90deg, rgba(139,92,246,.18), transparent 40%) !important;
}

.card:nth-child(-n+3) {
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.23), transparent 34%),
    radial-gradient(circle at 100% 0%, rgba(236,72,153,.15), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.115), rgba(255,255,255,.04)),
    rgba(7,8,17,.82) !important;
  border-color: rgba(245,199,107,.30) !important;
}

.rank {
  background: linear-gradient(135deg, var(--ig-red), var(--ig-pink)) !important;
  box-shadow: 0 10px 24px rgba(236,72,153,.18);
}

.player {
  color: #fff !important;
  text-shadow: 0 0 22px rgba(245,199,107,.10);
}

.pill {
  border: 1px solid rgba(255,255,255,.13) !important;
  background:
    linear-gradient(135deg, rgba(139,92,246,.12), rgba(255,255,255,.045)) !important;
}

/* Database gets cleaner */
.table-wrap {
  border-radius: 24px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.020)),
    rgba(0,0,0,.22) !important;
}

.search-box {
  background: rgba(255,255,255,.075) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
}

#playersTable th {
  background:
    linear-gradient(180deg, rgba(139,92,246,.28), rgba(8,9,18,.98)) !important;
  border-bottom: 2px solid rgba(236,72,153,.55) !important;
}

#playersTable tr:hover td {
  background: rgba(139,92,246,.08) !important;
}

/* Intro overlay becomes more "IG launch screen" */
.music-intro {
  background:
    radial-gradient(circle at 20% 10%, rgba(139,92,246,.34), transparent 30%),
    radial-gradient(circle at 82% 16%, rgba(236,72,153,.26), transparent 30%),
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.18), transparent 28%),
    rgba(3,4,10,.92) !important;
}

.music-intro-card {
  background:
    radial-gradient(circle at 20% 0%, rgba(139,92,246,.18), transparent 34%),
    radial-gradient(circle at 80% 0%, rgba(236,72,153,.14), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.045)),
    rgba(8,9,18,.96) !important;
}

.intro-primary {
  background: linear-gradient(135deg, var(--ig-gold), var(--ig-pink)) !important;
}

.intro-secondary {
  background: rgba(255,255,255,.075) !important;
}

/* Mobile: keep it clean */
@media (max-width: 720px) {
  .broadcast-ticker {
    top: 48px !important;
  }

  .section-head h2 {
    font-size: 26px !important;
  }

  .panel::before {
    margin: -16px -16px 16px;
  }

  .card {
    border-radius: 22px !important;
  }
}

/* ===== assets/scsl-color-fix.css ===== */
/* ===== SCSL15 CLEAN COLOR FIX ===== */
/* Keeps the modern layout/fonts, removes the weird purple/pink theme. */

:root {
  --scsl-black: #05060b;
  --scsl-card: rgba(9, 11, 20, .82);
  --scsl-card-soft: rgba(255,255,255,.055);
  --scsl-gold: #f5c76b;
  --scsl-gold-soft: rgba(245,199,107,.22);
  --scsl-red: #c91f2e;
  --scsl-blue: #2563eb;
  --scsl-line: rgba(255,255,255,.12);
}

body {
  background:
    radial-gradient(circle at 50% -8%, rgba(245,199,107,.18), transparent 30%),
    radial-gradient(circle at 12% 4%, rgba(201,31,46,.18), transparent 28%),
    radial-gradient(circle at 88% 5%, rgba(37,99,235,.16), transparent 28%),
    linear-gradient(180deg, #0b0d16 0%, #070812 50%, #03040a 100%) !important;
}

/* Top bar */
.broadcast-bar {
  background:
    linear-gradient(90deg, #991b1b 0%, #10121d 42%, #111827 100%) !important;
  border-bottom: 1px solid rgba(245,199,107,.35) !important;
}

.broadcast-live {
  background: linear-gradient(180deg, #e11d2e, #991b1b) !important;
  color: #fff !important;
}

.broadcast-ticker {
  background: rgba(3,4,9,.96) !important;
  border-bottom: 1px solid rgba(245,199,107,.14) !important;
}

.ticker-track span::before {
  color: var(--scsl-gold) !important;
}

/* Hero */
.hero {
  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.16), transparent 36%),
    radial-gradient(circle at 18% 12%, rgba(201,31,46,.12), transparent 28%),
    radial-gradient(circle at 82% 12%, rgba(37,99,235,.13), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.035), transparent) !important;
}

.eyebrow {
  color: var(--scsl-gold) !important;
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
}

.hero-chips span,
.hero-chips button,
.music-btn {
  background:
    linear-gradient(180deg, rgba(245,199,107,.13), rgba(255,255,255,.045)) !important;
  border: 1px solid rgba(245,199,107,.28) !important;
  color: rgba(247,247,251,.92) !important;
}

/* Panels */
.panel {
  background:
    linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.030)),
    rgba(6,7,14,.80) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow:
    0 30px 100px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.panel::before {
  background: linear-gradient(90deg, var(--scsl-red), var(--scsl-gold), var(--scsl-blue)) !important;
}

.section-head h2::before {
  background: linear-gradient(180deg, #e11d2e, #991b1b) !important;
}

/* Formula */
.formula-box {
  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.10), transparent 48%),
    rgba(0,0,0,.18) !important;
  border: 1px solid rgba(245,199,107,.18) !important;
}

.formula-main {
  background:
    linear-gradient(135deg, rgba(201,31,46,.13), rgba(245,199,107,.11), rgba(37,99,235,.10)) !important;
  border: 1px solid rgba(245,199,107,.24) !important;
}

.formula-main span,
.formula-label,
.recap-label {
  color: var(--scsl-gold) !important;
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
}

.formula-card {
  background:
    linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.030)),
    rgba(0,0,0,.14) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
}

/* Top 15 cards */
.card {
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.14), transparent 32%),
    radial-gradient(circle at 100% 0%, rgba(37,99,235,.10), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.095), rgba(255,255,255,.035)),
    rgba(7,8,17,.82) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
}

.card::before {
  background: linear-gradient(90deg, rgba(245,199,107,.12), transparent 44%) !important;
}

.card:nth-child(-n+3) {
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.22), transparent 34%),
    radial-gradient(circle at 100% 0%, rgba(201,31,46,.12), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.04)),
    rgba(7,8,17,.86) !important;
  border-color: rgba(245,199,107,.30) !important;
}

.rank {
  background: linear-gradient(180deg, #e11d2e, #991b1b) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(201,31,46,.18) !important;
}

.player {
  color: #fff !important;
  text-shadow: 0 0 22px rgba(245,199,107,.10) !important;
}

.pill {
  background:
    linear-gradient(180deg, rgba(245,199,107,.10), rgba(255,255,255,.040)) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
}

/* Recap cards */
.recap-card {
  background:
    linear-gradient(135deg, rgba(201,31,46,.13), rgba(255,255,255,.045) 42%, rgba(37,99,235,.08)),
    rgba(6,7,12,.76) !important;
}

/* Database */
#playersTable th {
  background:
    linear-gradient(180deg, rgba(17,24,39,.98), rgba(8,9,18,.98)) !important;
  color: var(--scsl-gold) !important;
  border-bottom: 2px solid rgba(201,31,46,.70) !important;
}

#playersTable tr:hover td {
  background: rgba(245,199,107,.055) !important;
}

/* Music intro */
.music-intro {
  background:
    radial-gradient(circle at 50% 12%, rgba(245,199,107,.22), transparent 30%),
    radial-gradient(circle at 18% 10%, rgba(201,31,46,.16), transparent 28%),
    radial-gradient(circle at 82% 10%, rgba(37,99,235,.14), transparent 28%),
    rgba(3,4,10,.92) !important;
}

.music-intro-card {
  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.14), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.045)),
    rgba(8,9,18,.96) !important;
  border-color: rgba(245,199,107,.42) !important;
}

.intro-primary {
  background: linear-gradient(180deg, #f5c76b, #b9892f) !important;
  color: #111 !important;
}

.intro-secondary {
  background: rgba(255,255,255,.075) !important;
  color: #fff !important;
}

/* ===== assets/mobile-flow.css ===== */
/* ===== SCSL15 MOBILE FLOW / LESS BORING SCROLL ===== */

.mobile-jump-nav {
  display: none;
}

@media (max-width: 760px) {
  html {
    scroll-behavior: smooth;
  }

  body {
    overflow-x: hidden;
  }

  .broadcast-ticker {
    display: none !important;
  }

  .mobile-jump-nav {
    position: sticky;
    top: 38px;
    z-index: 4500;
    display: flex;
    gap: 8px;
    padding: 9px 12px;
    background: rgba(4,5,10,.88);
    border-bottom: 1px solid rgba(245,199,107,.18);
    backdrop-filter: blur(14px);
    overflow-x: auto;
  }

  .mobile-jump-nav a {
    flex: 1;
    min-width: 92px;
    text-align: center;
    text-decoration: none;
    color: rgba(247,247,251,.92);
    border: 1px solid rgba(245,199,107,.25);
    border-radius: 999px;
    padding: 8px 10px;
    font-family: var(--font-stat, sans-serif);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-size: 12px;
    background: linear-gradient(180deg, rgba(245,199,107,.12), rgba(255,255,255,.045));
  }

  .hero {
    padding-top: 22px !important;
    padding-bottom: 18px !important;
  }

  .hero-chips {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    max-width: 420px;
  }

  .hero-chips span,
  .hero-chips button {
    text-align: center;
  }

  .broadcast-recap {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    margin-top: 14px !important;
  }

  .recap-card {
    border-radius: 18px !important;
  }

  main {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .panel {
    margin: 14px auto !important;
  }

  .section-head {
    margin-bottom: 12px !important;
  }

  /* Top 15 becomes swipeable cards instead of endless vertical scroll */
  #top15 .top15-grid {
    display: flex !important;
    overflow-x: auto;
    gap: 12px !important;
    scroll-snap-type: x mandatory;
    padding: 2px 2px 14px;
    -webkit-overflow-scrolling: touch;
  }

  #top15 .top15-grid::-webkit-scrollbar {
    height: 6px;
  }

  #top15 .top15-grid::-webkit-scrollbar-thumb {
    background: rgba(245,199,107,.38);
    border-radius: 999px;
  }

  #top15 .card {
    flex: 0 0 84%;
    scroll-snap-align: center;
    min-height: 255px;
  }

  #top15 .section-head::after {
    content: "Swipe the cards →";
    display: block;
    margin-top: 8px;
    color: rgba(245,199,107,.82);
    font-family: var(--font-stat, sans-serif);
    font-weight: 800;
    font-size: 12px;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  /* Formula is still readable but less like a giant wall */
  #formula .formula-grid {
    display: flex !important;
    overflow-x: auto;
    gap: 12px !important;
    scroll-snap-type: x mandatory;
    padding-bottom: 12px;
  }

  #formula .formula-card {
    flex: 0 0 78%;
    scroll-snap-align: center;
    min-height: 150px !important;
  }

  #formula .formula-grid::-webkit-scrollbar {
    height: 6px;
  }

  #formula .formula-grid::-webkit-scrollbar-thumb {
    background: rgba(245,199,107,.38);
    border-radius: 999px;
  }

  .formula-main {
    padding: 16px 12px !important;
  }

  .formula-main strong {
    font-size: 27px !important;
  }

  /* Database: make it feel intentional */
  #database .section-head p::after {
    content: " Tap headers to sort. Swipe table sideways.";
    color: rgba(245,199,107,.86);
  }

  .table-wrap {
    max-height: 78vh;
    overflow: auto;
  }

  #playersTable {
    min-width: 1180px !important;
  }

  #playersTable th,
  #playersTable td {
    padding: 9px 8px !important;
    font-size: 12px !important;
  }

  #playersTable td:first-child,
  #playersTable th:first-child {
    min-width: 155px;
  }

  footer {
    padding-bottom: 86px !important;
  }
}

@media (max-width: 420px) {
  #top15 .card {
    flex-basis: 88%;
  }

  #formula .formula-card {
    flex-basis: 84%;
  }

  .mobile-jump-nav a {
    min-width: 86px;
    font-size: 11px;
  }
}

/* ===== TOP 15 VIEW TOGGLE ===== */

.view-toggle-btn {
  display: none;
}

@media (max-width: 760px) {
  .view-toggle-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    border: 1px solid rgba(245,199,107,.35);
    border-radius: 999px;
    padding: 9px 12px;
    color: rgba(247,247,251,.94);
    background: linear-gradient(180deg, rgba(245,199,107,.16), rgba(255,255,255,.055));
    font-family: var(--font-stat, sans-serif);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .07em;
    font-size: 12px;
    cursor: pointer;
  }

  #top15.show-all-cards .top15-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    overflow-x: visible !important;
    scroll-snap-type: none !important;
    padding-bottom: 0 !important;
  }

  #top15.show-all-cards .card {
    flex: none !important;
    width: 100% !important;
    scroll-snap-align: none !important;
    min-height: auto !important;
  }

  #top15.show-all-cards .section-head::after {
    content: "Showing all cards";
  }
}

/* ===== assets/final-polish.css ===== */
/* ===== FINAL SCSL15 POLISH PASS ===== */

main {
  padding-top: 34px !important;
}

.panel {
  position: relative;
}

/* Top 3 Legacy Spotlight */
.legacy-spotlight {
  margin: 0 0 18px;
  padding: 16px;
  border: 1px solid rgba(245,199,107,.18);
  border-radius: 24px;
  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.13), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.030)),
    rgba(0,0,0,.18);
}

.spotlight-kicker {
  margin-bottom: 12px;
  color: var(--scsl-gold, #f5c76b);
  font-family: var(--font-stat, sans-serif);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.spotlight-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 12px;
  align-items: stretch;
}

.spotlight-card {
  position: relative;
  overflow: hidden;
  min-height: 170px;
  border-radius: 22px;
  padding: 18px;
  border: 1px solid rgba(255,255,255,.13);
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.18), transparent 40%),
    linear-gradient(160deg, rgba(255,255,255,.115), rgba(255,255,255,.035)),
    rgba(8,9,18,.86);
  box-shadow: 0 22px 60px rgba(0,0,0,.28);
}

.spotlight-rank {
  display: inline-flex;
  padding: 5px 10px;
  border-radius: 999px;
  background: linear-gradient(180deg, #e11d2e, #991b1b);
  color: white;
  font-family: var(--font-stat, sans-serif);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .10em;
}

.spotlight-name {
  margin-top: 14px;
  color: #fff;
  font-family: var(--font-display, Impact, sans-serif);
  font-size: clamp(34px, 4.4vw, 54px);
  line-height: .9;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.spotlight-score {
  margin-top: 14px;
  color: var(--scsl-gold, #f5c76b);
  font-family: var(--font-stat, sans-serif);
  font-size: 38px;
  font-weight: 900;
  letter-spacing: -.03em;
  line-height: .9;
}

.spotlight-label {
  color: rgba(247,247,251,.72);
  font-family: var(--font-stat, sans-serif);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .10em;
  text-transform: uppercase;
}

.spotlight-mini {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px;
}

.spotlight-mini span {
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  padding: 5px 8px;
  background: rgba(0,0,0,.22);
  color: rgba(247,247,251,.86);
  font-family: var(--font-stat, sans-serif);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.spotlight-rank-1 {
  border-color: rgba(245,199,107,.38);
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.26), transparent 42%),
    radial-gradient(circle at 100% 0%, rgba(201,31,46,.16), transparent 34%),
    linear-gradient(160deg, rgba(255,255,255,.13), rgba(255,255,255,.04)),
    rgba(8,9,18,.88);
}

#top15 .top15-grid {
  margin-top: 6px;
}

#top15 .card {
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

#top15 .card:hover {
  transform: translateY(-3px);
}

#playersTable tbody tr:nth-child(even) td {
  background: rgba(255,255,255,.018);
}

@media (max-width: 760px) {
  main {
    padding-top: 18px !important;
  }

  .legacy-spotlight {
    padding: 12px;
    border-radius: 20px;
  }

  .spotlight-grid {
    display: flex;
    overflow-x: auto;
    gap: 12px;
    scroll-snap-type: x mandatory;
    padding-bottom: 10px;
  }

  .spotlight-card {
    flex: 0 0 88%;
    min-height: 190px;
    scroll-snap-align: center;
  }

  .spotlight-name {
    font-size: 42px;
  }

  .spotlight-score {
    font-size: 34px;
  }

  #top15 .card {
    min-height: 235px;
  }
}

@media (min-width: 1000px) {
  .top15-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  #top15 .card {
    min-height: 245px;
  }
}

/* ===== DATABASE STAT VAULT POLISH ===== */

#database {
  border-color: rgba(245,199,107,.22) !important;
}

.database-hero {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 12px;
}

.db-stat {
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 18px;
  padding: 14px 15px;
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.13), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.030)),
    rgba(0,0,0,.18);
}

.db-stat.featured {
  border-color: rgba(245,199,107,.32);
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.22), transparent 42%),
    radial-gradient(circle at 100% 0%, rgba(201,31,46,.10), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.035)),
    rgba(0,0,0,.18);
}

.db-label {
  color: var(--scsl-gold, #f5c76b);
  font-family: var(--font-stat, sans-serif);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.db-value {
  margin-top: 6px;
  color: #fff;
  font-family: var(--font-stat, sans-serif);
  font-size: 31px;
  font-weight: 900;
  line-height: 1;
}

.db-note {
  margin-top: 6px;
  color: rgba(184,188,207,.82);
  font-size: 12px;
  font-weight: 700;
}

.database-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 4px 0 12px;
}

.db-chip {
  border: 1px solid rgba(245,199,107,.25);
  border-radius: 999px;
  padding: 8px 11px;
  color: rgba(247,247,251,.90);
  background: rgba(255,255,255,.055);
  font-family: var(--font-stat, sans-serif);
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .07em;
  text-transform: uppercase;
  cursor: pointer;
}

.db-chip:hover,
.db-chip.active {
  color: #111;
  background: linear-gradient(180deg, #f5c76b, #b9892f);
  border-color: rgba(255,255,255,.45);
}

#database .table-wrap {
  margin-top: 4px;
  border-radius: 24px !important;
  padding: 12px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.040), rgba(255,255,255,.018)),
    rgba(0,0,0,.24) !important;
}

#playersTable {
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

#playersTable th {
  white-space: nowrap;
  height: 42px;
}

#playersTable td {
  vertical-align: middle;
}

#playersTable td[data-col="Player"] {
  color: #fff;
  font-weight: 900 !important;
}

#playersTable td[data-col="SCSL15_score"] {
  color: var(--scsl-gold, #f5c76b);
  font-family: var(--font-stat, sans-serif) !important;
  font-size: 16px !important;
  font-weight: 900 !important;
}

#playersTable td[data-col="Award_bonus"],
#playersTable td[data-col="GP_weight_bonus"] {
  color: rgba(245,199,107,.86);
  font-weight: 800;
}

#playersTable td[data-col="Honors"] {
  min-width: 280px;
  max-width: 380px;
  color: rgba(220,224,238,.78);
  line-height: 1.35;
}

#playersTable tbody tr {
  transition: background .16s ease, transform .16s ease;
}

#playersTable tbody tr:hover td {
  background: rgba(245,199,107,.065) !important;
}

/* Mobile database polish */
@media (max-width: 760px) {
  .database-hero {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }

  .db-stat {
    padding: 12px;
    border-radius: 16px;
  }

  .db-value {
    font-size: 25px;
  }

  .database-chips {
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 4px;
  }

  .db-chip {
    flex: 0 0 auto;
    font-size: 11px;
    padding: 8px 10px;
  }

  #database .table-wrap {
    max-height: 72vh;
  }

  #playersTable td[data-col="Honors"] {
    min-width: 240px;
    max-width: 300px;
  }
}

/* ===== FIX DATABASE HEADER WHILE SCROLLING ===== */

/* Desktop: let the page scroll, but keep table headers stuck under the ticker/top bar */
@media (min-width: 761px) {
  #database .table-wrap {
    max-height: none !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
  }

  #playersTable thead th {
    position: sticky !important;
    top: 76px !important;
    z-index: 50 !important;
    background:
      linear-gradient(180deg, rgba(17,24,39,.99), rgba(8,9,18,.99)) !important;
    box-shadow:
      0 2px 0 rgba(201,31,46,.75),
      0 10px 24px rgba(0,0,0,.45) !important;
  }
}

/* Mobile: table scrolls inside the box, header sticks inside that scroll area */
@media (max-width: 760px) {
  #database .table-wrap {
    max-height: 72vh !important;
    overflow: auto !important;
  }

  #playersTable thead th {
    position: sticky !important;
    top: 0 !important;
    z-index: 50 !important;
    background:
      linear-gradient(180deg, rgba(17,24,39,.99), rgba(8,9,18,.99)) !important;
    box-shadow:
      0 2px 0 rgba(201,31,46,.75),
      0 10px 24px rgba(0,0,0,.45) !important;
  }
}

/* Make the stat header easier to read */
#playersTable th {
  color: #f5c76b !important;
  font-size: 11px !important;
  letter-spacing: .08em !important;
  text-align: center !important;
  vertical-align: middle !important;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

#playersTable th[data-key="Player"],
#playersTable th[data-key="Team"],
#playersTable th[data-key="Season"],
#playersTable th[data-key="Honors"] {
  text-align: left !important;
}

/* Add a little glow to the active sort column */
#playersTable th[data-key="SCSL15_score"] {
  color: #fff !important;
  background:
    linear-gradient(180deg, rgba(245,199,107,.28), rgba(8,9,18,.99)) !important;
}

/* Make rows easier to track across the screen */
#playersTable tbody tr:nth-child(odd) td {
  background: rgba(255,255,255,.020) !important;
}

#playersTable tbody tr:nth-child(even) td {
  background: rgba(255,255,255,.045) !important;
}

#playersTable tbody tr:hover td {
  background: rgba(245,199,107,.085) !important;
}

/* Give the database a mini note so users know what to do */
#database .table-wrap::before {
  content: "Scroll sideways for more stats · Column headers stay pinned while scrolling";
  display: block;
  position: sticky;
  left: 0;
  top: 0;
  width: fit-content;
  margin: 0 0 8px;
  padding: 7px 10px;
  border: 1px solid rgba(245,199,107,.24);
  border-radius: 999px;
  color: rgba(247,247,251,.82);
  background: rgba(0,0,0,.34);
  font-family: var(--font-stat, sans-serif);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

/* ===== MOBILE TOP 15 RANKED BOARD REDESIGN ===== */

@media (max-width: 760px) {
  #top15 .section-head {
    margin-bottom: 10px !important;
  }

  #top15 .section-head::after {
    content: "Tap a player to expand details";
    display: block;
    margin-top: 8px;
    color: rgba(245,199,107,.85);
    font-family: var(--font-stat, sans-serif);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  /* Override carousel/card wall behavior */
  #top15 .top15-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
    padding: 0 !important;
  }

  #top15 .card {
    flex: none !important;
    width: 100% !important;
    min-height: 0 !important;
    scroll-snap-align: none !important;
    border-radius: 18px !important;
    padding: 11px 12px !important;
    display: grid !important;
    grid-template-columns: auto 1fr auto;
    grid-template-areas:
      "rank player score"
      "rank stats stats"
      "meta meta meta";
    column-gap: 10px;
    align-items: center;
    cursor: pointer;
    background:
      linear-gradient(90deg, rgba(245,199,107,.10), rgba(255,255,255,.040)),
      rgba(8,9,18,.88) !important;
  }

  #top15 .card::before {
    display: none !important;
  }

  #top15 .rank {
    grid-area: rank;
    width: 42px;
    height: 42px;
    padding: 0 !important;
    display: grid !important;
    place-items: center;
    border-radius: 14px !important;
    font-size: 13px !important;
  }

  #top15 .player {
    grid-area: player;
    margin: 0 !important;
    font-size: 23px !important;
    line-height: .95 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* Hide long why text by default */
  #top15 .meta {
    grid-area: meta;
    display: none;
    margin-top: 10px !important;
    padding-top: 10px;
    border-top: 1px solid rgba(255,255,255,.10);
    font-size: 12.5px !important;
    line-height: 1.45 !important;
  }

  #top15 .stats {
    grid-area: stats;
    display: flex !important;
    gap: 5px !important;
    margin-top: 7px !important;
    overflow: hidden;
  }

  #top15 .pill {
    font-size: 11px !important;
    padding: 4px 7px !important;
    white-space: nowrap;
  }

  /* Default compact view only shows the most important pills */
  #top15 .pill:nth-child(n+4) {
    display: none;
  }

  /* Make the AI score pill pop when present */
  #top15 .pill:has(+ .pill) {
    border-color: rgba(255,255,255,.12) !important;
  }

  #top15 .card.expanded {
    align-items: start;
    background:
      radial-gradient(circle at 0% 0%, rgba(245,199,107,.20), transparent 36%),
      linear-gradient(180deg, rgba(255,255,255,.090), rgba(255,255,255,.035)),
      rgba(8,9,18,.92) !important;
    border-color: rgba(245,199,107,.30) !important;
  }

  #top15 .card.expanded .meta {
    display: block;
  }

  #top15 .card.expanded .stats {
    flex-wrap: wrap;
    overflow: visible;
  }

  #top15 .card.expanded .pill {
    display: inline-flex;
  }

  /* Top 3 get a little extra sauce but still compact */
  #top15 .card:nth-child(1),
  #top15 .card:nth-child(2),
  #top15 .card:nth-child(3) {
    border-color: rgba(245,199,107,.32) !important;
  }

  #top15 .card:nth-child(1) .rank {
    background: linear-gradient(180deg, #f5c76b, #b9892f) !important;
    color: #111 !important;
  }

  /* The old View All button is no longer needed on mobile */
  #top15ViewToggle {
    display: none !important;
  }
}

/* ===== MOBILE LEGACY SCORE VISIBLE BEFORE EXPAND ===== */

.mobile-card-score {
  display: none;
}

@media (max-width: 760px) {
  #top15 .mobile-card-score {
    grid-area: score;
    display: grid;
    justify-items: end;
    align-self: center;
    min-width: 72px;
  }

  #top15 .mobile-card-score strong {
    color: #f5c76b;
    font-family: var(--font-stat, sans-serif);
    font-size: 22px;
    font-weight: 950;
    line-height: .9;
    text-shadow: 0 0 14px rgba(245,199,107,.24);
  }

  #top15 .mobile-card-score span {
    margin-top: 3px;
    color: rgba(247,247,251,.64);
    font-family: var(--font-stat, sans-serif);
    font-size: 8px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
  }

  #top15 .card {
    grid-template-columns: auto minmax(0, 1fr) auto !important;
  }

  #top15 .player {
    padding-right: 4px;
  }
}

/* ===== CLEAN LONG NAMES IN LEGACY SPOTLIGHT ===== */

.spotlight-name {
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  line-height: .92 !important;
}

@media (min-width: 900px) {
  .spotlight-card {
    min-width: 0 !important;
  }

  .spotlight-name {
    font-size: clamp(28px, 2.8vw, 42px) !important;
    max-width: 100% !important;
  }
}

@media (max-width: 760px) {
  .spotlight-name {
    font-size: 38px !important;
  }
}

/* ===== assets/database-scrollbox.css ===== */
/* ===== DATABASE SCROLLBOX FINAL FIX ===== */

/* Keep the database contained in a polished scrollable box */
#database .table-wrap {
  position: relative !important;
  width: 100% !important;
  max-height: 620px !important;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch !important;
  border-radius: 22px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(0,0,0,.24) !important;
  padding: 10px !important;
}

/* Remove the instruction pill that was getting awkward */
#database .table-wrap::before {
  display: none !important;
  content: none !important;
}

/* Clean horizontal table behavior */
#playersTable {
  table-layout: auto !important;
  width: max-content !important;
  min-width: 1450px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

/* Header stays visible inside the scrollbox */
#playersTable thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 20 !important;
  background: linear-gradient(180deg, #171923, #090b12) !important;
  color: #f5c76b !important;
  border-bottom: 2px solid rgba(201,31,46,.85) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.42) !important;
}

/* Disable sticky first column completely to prevent overlap */
#playersTable th:first-child,
#playersTable td:first-child {
  position: static !important;
  left: auto !important;
  z-index: auto !important;
  background: inherit !important;
  border-right: 0 !important;
}

/* General cell polish */
#playersTable th,
#playersTable td {
  white-space: nowrap !important;
  padding: 11px 10px !important;
  vertical-align: middle !important;
  border-bottom: 1px solid rgba(255,255,255,.085) !important;
}

/* Important column widths */
#playersTable th[data-key="Player"],
#playersTable td[data-col="Player"] {
  min-width: 190px !important;
  max-width: 230px !important;
  text-align: left !important;
}

#playersTable th[data-key="SCSL15_score"],
#playersTable td[data-col="SCSL15_score"] {
  min-width: 145px !important;
  text-align: center !important;
  color: #f5c76b !important;
  font-weight: 900 !important;
}

#playersTable th[data-key="Team"],
#playersTable td[data-col="Team"] {
  min-width: 160px !important;
  max-width: 230px !important;
  text-align: left !important;
}

#playersTable th[data-key="Season"],
#playersTable td[data-col="Season"] {
  min-width: 90px !important;
  text-align: center !important;
}

#playersTable th[data-key="Honors"],
#playersTable td[data-col="Honors"] {
  min-width: 360px !important;
  max-width: 460px !important;
  white-space: normal !important;
  line-height: 1.35 !important;
  text-align: left !important;
}

/* Stat columns */
#playersTable th[data-key="GP"],
#playersTable td[data-col="GP"],
#playersTable th[data-key="PPG"],
#playersTable td[data-col="PPG"],
#playersTable th[data-key="RPG"],
#playersTable td[data-col="RPG"],
#playersTable th[data-key="APG"],
#playersTable td[data-col="APG"],
#playersTable th[data-key="EFF_per_g"],
#playersTable td[data-col="EFF_per_g"],
#playersTable th[data-key="GP_weight_bonus"],
#playersTable td[data-col="GP_weight_bonus"],
#playersTable th[data-key="Award_bonus"],
#playersTable td[data-col="Award_bonus"],
#playersTable th[data-key="PTS"],
#playersTable td[data-col="PTS"],
#playersTable th[data-key="REB"],
#playersTable td[data-col="REB"],
#playersTable th[data-key="AST"],
#playersTable td[data-col="AST"],
#playersTable th[data-key="STL"],
#playersTable td[data-col="STL"],
#playersTable th[data-key="BLK"],
#playersTable td[data-col="BLK"],
#playersTable th[data-key="TO"],
#playersTable td[data-col="TO"] {
  min-width: 82px !important;
  text-align: center !important;
}

/* Row readability */
#playersTable tbody tr:nth-child(odd) td {
  background: rgba(255,255,255,.025) !important;
}

#playersTable tbody tr:nth-child(even) td {
  background: rgba(255,255,255,.045) !important;
}

#playersTable tbody tr:hover td {
  background: rgba(245,199,107,.085) !important;
}

/* Search box fits the vault */
#database .search-box {
  position: sticky !important;
  left: 0 !important;
  z-index: 25 !important;
  width: min(480px, 100%) !important;
  margin: 0 0 10px !important;
}

/* Nice scrollbars */
#database .table-wrap::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

#database .table-wrap::-webkit-scrollbar-thumb {
  background: rgba(245,199,107,.45);
  border-radius: 999px;
}

#database .table-wrap::-webkit-scrollbar-track {
  background: rgba(255,255,255,.055);
  border-radius: 999px;
}

/* Mobile scrollbox */
@media (max-width: 760px) {
  #database .table-wrap {
    max-height: 72vh !important;
    padding: 8px !important;
    border-radius: 18px !important;
  }

  #playersTable {
    min-width: 1320px !important;
  }

  #playersTable th,
  #playersTable td {
    padding: 9px 8px !important;
    font-size: 12px !important;
  }

  #playersTable th[data-key="Player"],
  #playersTable td[data-col="Player"] {
    min-width: 165px !important;
  }

  #playersTable th[data-key="Honors"],
  #playersTable td[data-col="Honors"] {
    min-width: 280px !important;
    max-width: 330px !important;
  }
}

/* ===== FINAL DATABASE FREEZE NAME COLUMN + SOLID LEGACY SCORE ===== */

/* Freeze Player column while scrolling sideways */
#playersTable th[data-key="Player"],
#playersTable td[data-col="Player"] {
  position: sticky !important;
  left: 0 !important;
  z-index: 35 !important;
  min-width: 190px !important;
  max-width: 190px !important;
  background: #090b13 !important;
  color: #fff !important;
  box-shadow: 10px 0 18px rgba(0,0,0,.42), 1px 0 0 rgba(245,199,107,.22) !important;
}

/* Player header needs to sit above the frozen player cells */
#playersTable th[data-key="Player"] {
  z-index: 60 !important;
  background: linear-gradient(180deg, #181b28, #090b13) !important;
}

/* Prevent old first-column reset rules from winning */
#playersTable th:first-child,
#playersTable td:first-child {
  position: sticky !important;
  left: 0 !important;
}

/* Keep the sticky name column readable on row hover */
#playersTable tbody tr:nth-child(odd) td[data-col="Player"] {
  background: #090b13 !important;
}

#playersTable tbody tr:nth-child(even) td[data-col="Player"] {
  background: #10131e !important;
}

#playersTable tbody tr:hover td[data-col="Player"] {
  background: #171723 !important;
}

/* Make the AI-LegacyScore database stat card opaque and premium */
.db-stat.featured {
  background:
    linear-gradient(135deg, #1f1820 0%, #14131b 42%, #0b0d16 100%) !important;
  border: 1px solid rgba(245,199,107,.48) !important;
  box-shadow:
    0 20px 60px rgba(0,0,0,.40),
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 0 30px rgba(245,199,107,.08) !important;
}

.db-stat.featured .db-value {
  color: #f5c76b !important;
  text-shadow: 0 0 18px rgba(245,199,107,.22);
}

/* Make AI-LegacyScore column feel like a real score box instead of transparent text */
#playersTable td[data-col="SCSL15_score"] {
  background: #17131a !important;
  color: #f5c76b !important;
  font-weight: 950 !important;
  border-left: 1px solid rgba(245,199,107,.18) !important;
  border-right: 1px solid rgba(245,199,107,.18) !important;
}

#playersTable th[data-key="SCSL15_score"] {
  background: linear-gradient(180deg, #3a2510, #15131a) !important;
  color: #f5c76b !important;
  border-left: 1px solid rgba(245,199,107,.24) !important;
  border-right: 1px solid rgba(245,199,107,.24) !important;
}

/* Hover should not wash out the score column */
#playersTable tbody tr:hover td[data-col="SCSL15_score"] {
  background: #211721 !important;
}

/* ===== LB_399 SCSL LEGEND ROW ===== */

#playersTable tr.legend-row td,
#playersTable tr:has(td[data-col="Player"]:contains("LB_399")) td {
  background: linear-gradient(90deg, rgba(245,199,107,.18), rgba(201,31,46,.10), rgba(37,99,235,.08)) !important;
}

/* Browser-safe class version added by JS below */
#playersTable tr.lb-legend-row td {
  background:
    linear-gradient(90deg, rgba(245,199,107,.20), rgba(201,31,46,.12), rgba(37,99,235,.10)),
    #0d0f18 !important;
  border-top: 1px solid rgba(245,199,107,.35) !important;
  border-bottom: 1px solid rgba(245,199,107,.35) !important;
}

#playersTable tr.lb-legend-row td[data-col="Player"] {
  color: #f5c76b !important;
  background: #15110d !important;
}

#playersTable tr.lb-legend-row td[data-col="SCSL15_score"] {
  color: #111 !important;
  background: linear-gradient(180deg, #f5c76b, #b9892f) !important;
  font-size: 13px !important;
  letter-spacing: .08em !important;
}

#playersTable tr.lb-legend-row td[data-col="Honors"] {
  color: rgba(255,255,255,.92) !important;
}

/* ===== FIX LB HOVER SCORE VISIBILITY ===== */

#playersTable tr.lb-legend-row:hover td[data-col="SCSL15_score"],
#playersTable tr.lb-legend-row td[data-col="SCSL15_score"] {
  color: #f5c76b !important;
  background: #17131a !important;
  text-shadow: 0 0 12px rgba(245,199,107,.35) !important;
}

#playersTable tr.lb-legend-row:hover td[data-col="Player"],
#playersTable tr.lb-legend-row td[data-col="Player"] {
  color: #f5c76b !important;
  background: #090b13 !important;
}

#playersTable tr.lb-legend-row:hover td {
  color: rgba(247,247,251,.92) !important;
}

/* ===== assets/top15-expand-fix.css ===== */
/* ===== TOP 15 MOBILE EXPAND SIGNAL FINAL ===== */

.mobile-expand-hint {
  display: none;
}

@media (max-width: 760px) {
  #top15 .section-head::after {
    content: "The #1 card is open as an example. Tap any player card to open or close details." !important;
    display: block !important;
    margin-top: 8px !important;
    padding: 9px 10px !important;
    border: 1px solid rgba(245,199,107,.26) !important;
    border-radius: 14px !important;
    color: rgba(247,247,251,.88) !important;
    background: rgba(245,199,107,.075) !important;
    font-family: var(--font-stat, sans-serif) !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
  }

  #top15 .card {
    grid-template-areas:
      "rank player score"
      "rank stats stats"
      "hint hint hint"
      "meta meta meta" !important;
    padding-bottom: 10px !important;
  }

  #top15 .card::after {
    display: none !important;
    content: none !important;
  }

  #top15 .mobile-expand-hint {
    grid-area: hint;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 10px;
    padding: 9px 10px;
    border-radius: 14px;
    border: 1px solid rgba(245,199,107,.25);
    background: linear-gradient(90deg, rgba(245,199,107,.13), rgba(255,255,255,.045));
    color: rgba(245,199,107,.95);
    font-family: var(--font-stat, sans-serif);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  #top15 .hint-open {
    display: none;
  }

  #top15 .hint-arrow {
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border-radius: 999px;
    background: rgba(245,199,107,.18);
    color: #f5c76b;
    font-size: 15px;
    line-height: 1;
    transition: transform .18s ease;
  }

  #top15 .card.expanded .mobile-expand-hint {
    background: linear-gradient(180deg, #f5c76b, #b9892f);
    color: #111;
    border-color: rgba(255,255,255,.42);
  }

  #top15 .card.expanded .hint-closed {
    display: none;
  }

  #top15 .card.expanded .hint-open {
    display: inline;
  }

  #top15 .card.expanded .hint-arrow {
    transform: rotate(180deg);
    background: rgba(0,0,0,.18);
    color: #111;
  }
}

/* ===== SOFTER TOP 15 EXPAND LANGUAGE ===== */

@media (max-width: 760px) {
  #top15 .section-head::after {
    content: "Tap a card to see the quick breakdown." !important;
  }

  #top15 .mobile-expand-hint {
    font-size: 10.5px !important;
    letter-spacing: .07em !important;
  }
}

/* ===== assets/desktop-mobile-alignment.css ===== */
/* ===== DESKTOP TOP 15: MOBILE-STYLE ALIGNMENT, DESKTOP POLISH ===== */

@media (min-width: 900px) {
  /* Keep page desktop-sized, but make Top 15 read like a clean ranked board */
  #top15 {
    max-width: 980px;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  #top15 .legacy-spotlight {
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
  }

  #top15 .top15-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    max-width: 980px;
    margin: 8px auto 0 !important;
  }

  #top15 .card {
    min-height: 0 !important;
    padding: 14px 16px !important;
    border-radius: 18px !important;

    display: grid !important;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    grid-template-areas:
      "rank player score"
      "rank stats stats"
      "meta meta meta";
    column-gap: 14px;
    align-items: center;

    background:
      linear-gradient(90deg, rgba(245,199,107,.105), rgba(255,255,255,.038)),
      rgba(8,9,18,.88) !important;
  }

  #top15 .card::before {
    display: none !important;
  }

  #top15 .rank {
    grid-area: rank;
    width: 50px;
    height: 50px;
    padding: 0 !important;
    display: grid !important;
    place-items: center;
    border-radius: 15px !important;
    font-size: 15px !important;
  }

  #top15 .player {
    grid-area: player;
    margin: 0 !important;
    font-size: 30px !important;
    line-height: .95 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  #top15 .mobile-card-score {
    grid-area: score;
    display: grid !important;
    justify-items: end;
    align-self: center;
    min-width: 112px;
  }

  #top15 .mobile-card-score strong {
    color: #f5c76b;
    font-family: var(--font-stat, sans-serif);
    font-size: 28px;
    font-weight: 950;
    line-height: .9;
    text-shadow: 0 0 16px rgba(245,199,107,.22);
  }

  #top15 .mobile-card-score span {
    margin-top: 4px;
    color: rgba(247,247,251,.62);
    font-family: var(--font-stat, sans-serif);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    white-space: nowrap;
  }

  #top15 .stats {
    grid-area: stats;
    display: flex !important;
    flex-wrap: wrap;
    gap: 6px !important;
    margin-top: 8px !important;
  }

  #top15 .pill {
    font-size: 11px !important;
    padding: 4px 8px !important;
  }

  #top15 .meta {
    grid-area: meta;
    margin-top: 10px !important;
    padding-top: 10px;
    border-top: 1px solid rgba(255,255,255,.085);

    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden !important;

    font-size: 12.5px !important;
    line-height: 1.42 !important;
  }

  #top15 .card:hover .meta {
    -webkit-line-clamp: 5;
  }

  #top15 .card:hover {
    transform: translateY(-2px);
    border-color: rgba(245,199,107,.28) !important;
  }

  /* Top 3 still feel special */
  #top15 .card:nth-child(1),
  #top15 .card:nth-child(2),
  #top15 .card:nth-child(3) {
    border-color: rgba(245,199,107,.30) !important;
    background:
      radial-gradient(circle at 0% 0%, rgba(245,199,107,.16), transparent 34%),
      linear-gradient(90deg, rgba(245,199,107,.13), rgba(255,255,255,.040)),
      rgba(8,9,18,.92) !important;
  }

  #top15 .card:nth-child(1) .rank {
    background: linear-gradient(180deg, #f5c76b, #b9892f) !important;
    color: #111 !important;
  }

  /* Hide mobile-only expand hint on desktop */
  #top15 .mobile-expand-hint {
    display: none !important;
  }
}

/* Ultra-wide: still keep it readable, don't stretch */
@media (min-width: 1280px) {
  #top15,
  #top15 .top15-grid,
  #top15 .legacy-spotlight {
    max-width: 1040px !important;
  }
}

/* ===== assets/no-drop-badge.css ===== */
/* ===== REMOVE RED DROP SECTION BADGES ===== */

.section-head h2::before {
  display: none !important;
  content: none !important;
}

.section-head h2 {
  gap: 0 !important;
}

/* ===== assets/topbar-clean.css ===== */
/* ===== CLEAN TOP BAR ===== */

.broadcast-bar {
  height: 44px !important;
  padding: 0 18px !important;
  background:
    linear-gradient(180deg, rgba(10,12,22,.96), rgba(5,6,11,.96)) !important;
  border-bottom: 1px solid rgba(245,199,107,.18) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.28) !important;
  backdrop-filter: blur(14px);
}

.broadcast-left,
.broadcast-right {
  gap: 10px !important;
}

.broadcast-live {
  height: 24px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #f5c76b, #b9892f) !important;
  color: #111 !important;
  box-shadow: none !important;
  font-size: 13px !important;
  letter-spacing: .08em !important;
}

.broadcast-title {
  color: rgba(247,247,251,.88) !important;
  font-size: 15px !important;
  letter-spacing: .09em !important;
}

.broadcast-right {
  color: rgba(245,199,107,.82) !important;
  font-size: 12px !important;
  letter-spacing: .10em !important;
}

/* Since top bar height changed slightly, keep ticker aligned */
.broadcast-ticker {
  top: 44px !important;
}

@media (max-width: 760px) {
  .broadcast-bar {
    height: 40px !important;
    padding: 0 10px !important;
  }

  .broadcast-live {
    height: 22px !important;
    font-size: 12px !important;
    padding: 0 8px !important;
  }

  .broadcast-title {
    font-size: 13px !important;
  }

  .broadcast-right {
    display: none !important;
  }

  .broadcast-ticker {
    top: 40px !important;
  }

  .mobile-jump-nav {
    top: 71px !important;
  }
}

/* ===== assets/top15-legacy-report.css ===== */
/* ===== SCSL15 LEGACY REPORT EXPANSION ===== */

.legacy-details {
  grid-area: meta;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.10);
}

.legacy-details-title {
  margin-bottom: 10px;
  color: #f5c76b;
  font-family: var(--font-stat, sans-serif);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.score-breakdown {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.score-row {
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 14px;
  padding: 9px 10px;
  background: linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.025)), rgba(0,0,0,.18);
}

.score-row span {
  display: block;
  color: rgba(184,188,207,.84);
  font-family: var(--font-stat, sans-serif);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.score-row strong {
  display: block;
  margin-top: 4px;
  color: #fff;
  font-family: var(--font-stat, sans-serif);
  font-size: 20px;
  font-weight: 950;
  line-height: .95;
}

.score-row small {
  display: block;
  margin-top: 3px;
  color: rgba(247,247,251,.58);
  font-family: var(--font-stat, sans-serif);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.score-row.total {
  border-color: rgba(245,199,107,.36);
  background: radial-gradient(circle at 0% 0%, rgba(245,199,107,.20), transparent 42%), linear-gradient(180deg, rgba(245,199,107,.12), rgba(255,255,255,.035)), rgba(0,0,0,.20);
}

.score-row.total strong {
  color: #f5c76b;
}

.legacy-why {
  margin-top: 10px;
  color: rgba(220,224,238,.86);
  font-size: 13px;
  line-height: 1.45;
}

.honor-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.honor-chip {
  border: 1px solid rgba(245,199,107,.22);
  border-radius: 999px;
  padding: 5px 8px;
  background: rgba(245,199,107,.075);
  color: rgba(247,247,251,.88);
  font-family: var(--font-stat, sans-serif);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .05em;
  text-transform: uppercase;
}

@media (max-width: 760px) {
  #top15 .legacy-details {
    display: none;
  }

  #top15 .card.expanded .legacy-details {
    display: block;
  }

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

/* ===== assets/normal-screen-final.css ===== */
/* ===== NORMAL SCREEN FINAL OVERRIDE ===== */
/* Prioritize phones, laptops, 1080p, and 1440p monitors. Ultrawide stays centered. */

@media (min-width: 900px) {
  main {
    max-width: 1040px !important;
    width: min(1040px, calc(100vw - 48px)) !important;
    margin: 0 auto !important;
  }

  .broadcast-recap {
    max-width: 1040px !important;
    width: min(1040px, calc(100vw - 48px)) !important;
  }

  .panel,
  #top15,
  .formula-panel {
    max-width: 960px !important;
    width: 100% !important;
  }

  #database {
    max-width: 1040px !important;
    width: 100% !important;
  }

  .hero {
    padding-top: 34px !important;
    padding-bottom: 28px !important;
  }

  .logo,
  .logo.logo-lockup {
    width: min(560px, 62vw) !important;
    max-height: 145px !important;
  }

  .formula-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  #top15 .top15-grid {
    max-width: 960px !important;
  }

  #top15 .card {
    max-width: 960px !important;
  }
}

/* Do NOT stretch more on ultrawide. Keep it centered and clean. */
@media (min-width: 1350px) {
  main,
  .broadcast-recap,
  #database {
    max-width: 1080px !important;
  }

  .panel,
  #top15,
  .formula-panel {
    max-width: 980px !important;
  }

  .hero {
    max-width: 1080px !important;
    margin: 0 auto !important;
  }
}

/* Laptop-ish screens */
@media (min-width: 900px) and (max-width: 1180px) {
  main {
    width: calc(100vw - 36px) !important;
  }

  .broadcast-recap {
    width: calc(100vw - 36px) !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .formula-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .logo,
  .logo.logo-lockup {
    width: min(520px, 68vw) !important;
  }
}

/* ===== assets/formula-mobile-stable.css ===== */
/* ===== STABLE AI-LEGACYSCORE SECTION ===== */
/* No mobile scroll trap. No sideways formula cards. Clean Apple-ish glass. */

html,
body {
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

.formula-panel {
  overflow: visible !important;
  border-radius: 28px !important;
}

.formula-box {
  overflow: visible !important;
  padding: 16px !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 50% -10%, rgba(245,199,107,.10), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.022)),
    rgba(4,5,12,.44) !important;
  border: 1px solid rgba(245,199,107,.16) !important;
}

.formula-box::before {
  display: none !important;
  content: none !important;
}

/* Main product-card formula */
.formula-main {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  min-height: 220px !important;
  display: grid !important;
  align-content: end !important;
  padding: 24px !important;
  margin-bottom: 14px !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 82% 18%, rgba(245,199,107,.20), transparent 30%),
    radial-gradient(circle at 18% 20%, rgba(201,31,46,.12), transparent 34%),
    radial-gradient(circle at 82% 82%, rgba(37,99,235,.14), transparent 36%),
    linear-gradient(135deg, rgba(255,255,255,.085), rgba(255,255,255,.030)),
    #070912 !important;
  border: 1px solid rgba(245,199,107,.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(245,199,107,.12),
    0 28px 90px rgba(0,0,0,.32) !important;
}

/* Soft glass movement, but cannot block scrolling */
.formula-main::before {
  content: "" !important;
  position: absolute !important;
  inset: -35% !important;
  display: block !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: .75 !important;
  background:
    linear-gradient(
      112deg,
      transparent 0%,
      transparent 22%,
      rgba(255,255,255,.05) 30%,
      rgba(255,255,255,.15) 36%,
      rgba(245,199,107,.18) 42%,
      rgba(255,255,255,.10) 50%,
      transparent 64%,
      transparent 100%
    ) !important;
  mix-blend-mode: screen;
  transform: translateX(-35%) skewX(-7deg);
  animation: stableGlassDrift 7s ease-in-out infinite alternate !important;
}

@keyframes stableGlassDrift {
  from { transform: translateX(-35%) skewX(-7deg); }
  to { transform: translateX(35%) skewX(-7deg); }
}

.formula-main span,
.formula-main strong {
  position: relative !important;
  z-index: 3 !important;
}

.formula-main span {
  display: inline-flex !important;
  width: fit-content !important;
  margin: 0 0 10px !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  color: rgba(245,199,107,.96) !important;
  background: rgba(245,199,107,.08) !important;
  border: 1px solid rgba(245,199,107,.20) !important;
  font-family: var(--font-stat, sans-serif) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
}

.formula-main span::before {
  display: none !important;
  content: none !important;
}

.formula-main strong {
  max-width: 720px !important;
  color: #fff !important;
  font-family: var(--font-display, Impact, sans-serif) !important;
  font-size: clamp(34px, 4.8vw, 62px) !important;
  line-height: .92 !important;
  letter-spacing: .035em !important;
  text-align: left !important;
}

/* AI icon */
.formula-main::after {
  content: "" !important;
  position: absolute !important;
  top: 22px !important;
  right: 22px !important;
  width: 72px !important;
  height: 72px !important;
  border-radius: 24px !important;
  z-index: 4 !important;
  background:
    url("ai-legacy-icon.png") center / 82% 82% no-repeat,
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.045)),
    rgba(0,0,0,.34) !important;
  border: 1px solid rgba(245,199,107,.35) !important;
  box-shadow:
    0 20px 55px rgba(245,199,107,.20),
    0 0 28px rgba(37,99,235,.12),
    inset 0 1px 0 rgba(255,255,255,.24) !important;
}

/* Formula cards: never scroll sideways on mobile */
.formula-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  overflow: visible !important;
  scroll-snap-type: none !important;
  padding: 0 !important;
}

.formula-card {
  position: relative !important;
  min-height: 142px !important;
  padding: 16px 16px 16px 76px !important;
  border-radius: 20px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.024)),
    rgba(0,0,0,.16) !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.formula-card::before {
  display: none !important;
  content: none !important;
}

.formula-card::after {
  content: "" !important;
  position: absolute !important;
  top: 16px !important;
  left: 16px !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 16px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.045)),
    rgba(0,0,0,.26) !important;
  border: 1px solid rgba(245,199,107,.28) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 26px 26px, auto !important;
}

.formula-card:nth-child(1)::after { background-image: url("icons/impact.svg"), linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.045)) !important; }
.formula-card:nth-child(2)::after { background-image: url("icons/longevity.svg"), linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.045)) !important; }
.formula-card:nth-child(3)::after { background-image: url("icons/award.svg"), linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.045)) !important; }
.formula-card:nth-child(4)::after { background-image: url("icons/legacy.svg"), linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.045)) !important; }
.formula-card:nth-child(5)::after { background-image: url("icons/eligibility.svg"), linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.045)) !important; }
.formula-card:nth-child(6)::after { background-image: url("icons/ranking.svg"), linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.045)) !important; }

.formula-label {
  color: #f5c76b !important;
}

.formula-value {
  margin-top: 7px !important;
  color: #fff !important;
  font-size: 17px !important;
}

.formula-card p {
  margin-top: 7px !important;
  color: rgba(205,211,226,.74) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

.formula-note {
  margin-top: 12px !important;
  padding: 12px 14px !important;
  border-radius: 16px !important;
}

/* Mobile: stack formula cards and allow page scroll */
@media (max-width: 760px) {
  .formula-panel,
  .formula-box {
    overflow: visible !important;
  }

  .formula-main {
    min-height: 220px !important;
    padding: 20px 16px !important;
    border-radius: 22px !important;
  }

  .formula-main::after {
    width: 54px !important;
    height: 54px !important;
    border-radius: 19px !important;
    top: 16px !important;
    right: 16px !important;
  }

  .formula-main strong {
    font-size: 36px !important;
    padding-right: 0 !important;
  }

  .formula-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  .formula-card {
    min-height: auto !important;
    padding: 15px 14px 14px 70px !important;
  }

  .formula-card::after {
    top: 15px !important;
    left: 15px !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 15px !important;
    background-size: 24px 24px, auto !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .formula-main::before {
    animation: none !important;
  }
}

/* ===== assets/formula-mobile-final-fix.css ===== */
/* ===== FINAL AI-LEGACYSCORE MOBILE + GLASS FIX ===== */

/* Kill every old horizontal/mobile formula carousel rule */
@media (max-width: 760px) {
  #formula .formula-grid,
  .formula-panel .formula-grid,
  .formula-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    overflow: visible !important;
    overflow-x: visible !important;
    scroll-snap-type: none !important;
    padding: 0 !important;
    gap: 10px !important;
    width: 100% !important;
  }

  #formula .formula-card,
  .formula-panel .formula-card,
  .formula-card {
    flex: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    scroll-snap-align: none !important;
    box-sizing: border-box !important;
  }

  #formula,
  .formula-panel,
  .formula-box {
    overflow: visible !important;
    max-width: 100% !important;
  }

  .formula-main {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* Add the wordmark back above the formula text */
.formula-main span {
  background-image: url("ai-legacy-wordmark.png") !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-size: contain !important;
  width: 260px !important;
  height: 48px !important;
  padding: 0 !important;
  border: 0 !important;
  background-color: transparent !important;
  color: transparent !important;
  overflow: hidden !important;
  text-indent: -9999px !important;
  margin-bottom: 18px !important;
  filter:
    drop-shadow(0 12px 26px rgba(0,0,0,.35))
    drop-shadow(0 0 16px rgba(245,199,107,.12)) !important;
}

@media (max-width: 760px) {
  .formula-main span {
    width: 220px !important;
    height: 42px !important;
    margin-bottom: 16px !important;
  }
}

/* Stronger high-quality glass surface, not a flash */
.formula-main {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;

  background:
    radial-gradient(circle at 80% 18%, rgba(245,199,107,.34), transparent 31%),
    radial-gradient(circle at 18% 18%, rgba(201,31,46,.18), transparent 34%),
    radial-gradient(circle at 84% 86%, rgba(37,99,235,.24), transparent 36%),
    linear-gradient(135deg, rgba(255,255,255,.13), rgba(255,255,255,.032)),
    #060812 !important;

  border: 1px solid rgba(245,199,107,.34) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 -1px 0 rgba(245,199,107,.22),
    inset 0 0 88px rgba(255,255,255,.070),
    0 34px 125px rgba(0,0,0,.44),
    0 0 60px rgba(245,199,107,.12) !important;

  backdrop-filter: blur(24px) saturate(1.45);
  animation: aiPremiumGlassBreath 5.2s ease-in-out infinite alternate !important;
}

/* Wide slow glass pane */
.formula-main::before {
  content: "" !important;
  position: absolute !important;
  inset: -40% !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: .95 !important;

  background:
    linear-gradient(
      112deg,
      transparent 0%,
      transparent 14%,
      rgba(255,255,255,.05) 23%,
      rgba(255,255,255,.20) 32%,
      rgba(245,199,107,.34) 40%,
      rgba(255,255,255,.22) 47%,
      rgba(37,99,235,.12) 55%,
      transparent 68%,
      transparent 100%
    ),
    linear-gradient(
      25deg,
      transparent 0%,
      rgba(255,255,255,.045) 34%,
      rgba(255,255,255,.13) 50%,
      rgba(245,199,107,.08) 62%,
      transparent 74%
    ) !important;

  mix-blend-mode: screen;
  transform: translateX(-42%) skewX(-7deg);
  animation: aiPremiumGlassDrift 5.8s cubic-bezier(.45,0,.2,1) infinite alternate !important;
}

/* soft bottom reflection */
.formula-main .formula-reflection {
  display: none;
}

.formula-main::marker {
  display: none;
}

@keyframes aiPremiumGlassDrift {
  0% {
    transform: translateX(-46%) skewX(-7deg);
    opacity: .58;
  }
  42% {
    opacity: 1;
  }
  100% {
    transform: translateX(46%) skewX(-7deg);
    opacity: .88;
  }
}

@keyframes aiPremiumGlassBreath {
  0% {
    filter: brightness(1) saturate(1);
  }
  100% {
    filter: brightness(1.10) saturate(1.12);
  }
}

/* Keep formula text and icon above the glass layer */
.formula-main span,
.formula-main strong {
  position: relative !important;
  z-index: 3 !important;
}

.formula-main::after {
  z-index: 4 !important;
  background:
    url("ai-legacy-icon.png") center / 82% 82% no-repeat,
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.045)),
    rgba(0,0,0,.34) !important;
  animation: aiIconPremiumBreath 4.2s ease-in-out infinite alternate !important;
}

@keyframes aiIconPremiumBreath {
  0% {
    filter: brightness(1) saturate(1);
    transform: scale(1);
  }
  100% {
    filter:
      brightness(1.18)
      saturate(1.12)
      drop-shadow(0 0 20px rgba(245,199,107,.34));
    transform: scale(1.035);
  }
}

@media (prefers-reduced-motion: reduce) {
  .formula-main,
  .formula-main::before,
  .formula-main::after {
    animation: none !important;
  }
}

/* ===== assets/formula-surrounding-polish.css ===== */
/* ===== FORMULA SECTION POLISH WITHOUT TOUCHING GLASS HERO ===== */
/* This does NOT change .formula-main background, icon, glisten, or animation. */

/* Cleaner outer section */
.formula-panel {
  border-radius: 30px !important;
  padding: 22px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.024)),
    rgba(6,7,14,.70) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow:
    0 28px 90px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.07) !important;
}

/* Cleaner heading area */
.formula-panel .section-head {
  display: block !important;
  padding-bottom: 16px !important;
  margin-bottom: 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}

.formula-panel .section-head h2 {
  font-size: clamp(30px, 3.6vw, 46px) !important;
  line-height: .92 !important;
  max-width: 740px !important;
}

.formula-panel .section-head p {
  margin-top: 8px !important;
  text-align: left !important;
  max-width: 720px !important;
  color: rgba(220,224,238,.70) !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
}

/* Make the container disappear more so the glass hero feels premium */
.formula-box {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.formula-box::before {
  display: none !important;
  content: none !important;
}

/* Keep spacing around the glass hero, but do not alter the effect */
.formula-main {
  margin-bottom: 18px !important;
}

/* Feature cards under the hero */
.formula-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  overflow: visible !important;
  scroll-snap-type: none !important;
  padding: 0 !important;
}

.formula-card {
  position: relative !important;
  min-height: 138px !important;
  padding: 18px 16px 16px 76px !important;
  border-radius: 22px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.024)),
    rgba(8,9,18,.72) !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 14px 40px rgba(0,0,0,.16) !important;
}

/* Keep icons clean and aligned */
.formula-card::after {
  top: 18px !important;
  left: 18px !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 16px !important;
}

.formula-card::before {
  display: none !important;
  content: none !important;
}

.formula-label {
  color: #f5c76b !important;
  font-size: 10.5px !important;
  letter-spacing: .15em !important;
}

.formula-value {
  margin-top: 8px !important;
  color: #fff !important;
  font-size: 17px !important;
  line-height: 1.15 !important;
}

.formula-card p {
  margin-top: 8px !important;
  color: rgba(205,211,226,.74) !important;
  font-size: 12.5px !important;
  line-height: 1.38 !important;
}

/* Bottom note: cleaner, less chunky */
.formula-note {
  margin-top: 14px !important;
  padding: 13px 15px !important;
  border-radius: 18px !important;
  color: rgba(220,224,238,.82) !important;
  background:
    linear-gradient(90deg, rgba(245,199,107,.065), rgba(255,255,255,.030)) !important;
  border: 1px solid rgba(245,199,107,.14) !important;
  border-left: 4px solid rgba(245,199,107,.70) !important;
  font-size: 13px !important;
  line-height: 1.42 !important;
}

/* Laptop/tablet */
@media (min-width: 761px) and (max-width: 1100px) {
  .formula-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile: stack cleanly, no sideways clipping */
@media (max-width: 760px) {
  .formula-panel {
    padding: 16px !important;
    border-radius: 24px !important;
  }

  .formula-panel .section-head h2 {
    font-size: 32px !important;
  }

  .formula-panel .section-head p {
    font-size: 15px !important;
  }

  .formula-grid {
    grid-template-columns: 1fr !important;
    display: grid !important;
    overflow: visible !important;
    gap: 10px !important;
  }

  .formula-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: auto !important;
    padding: 16px 14px 15px 70px !important;
    flex: none !important;
    scroll-snap-align: none !important;
  }

  .formula-card::after {
    top: 16px !important;
    left: 16px !important;
    width: 40px !important;
    height: 40px !important;
  }

  .formula-note {
    font-size: 13px !important;
  }
}

/* ===== assets/ai-logo-fix.css ===== */
/* ===== FIX AI-LEGACYSCORE LOGO TREATMENT ===== */
/* Stop squeezing the full logo/wordmark into the formula hero. Use clean icon only. */

.formula-main span {
  background-image: none !important;
  width: fit-content !important;
  height: auto !important;
  text-indent: 0 !important;
  overflow: visible !important;
  color: rgba(245,199,107,.96) !important;
  filter: none !important;
}

.formula-main::after {
  content: "" !important;
  background:
    url("ai-legacy-icon.png") center / 78% 78% no-repeat,
    linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)),
    rgba(0,0,0,.28) !important;
  color: transparent !important;
  text-indent: -9999px !important;
  overflow: hidden !important;
  border: 1px solid rgba(245,199,107,.34) !important;
  box-shadow:
    0 18px 48px rgba(245,199,107,.18),
    0 0 26px rgba(37,99,235,.10),
    inset 0 1px 0 rgba(255,255,255,.20) !important;
}

@media (min-width: 761px) {
  .formula-main::after {
    width: 72px !important;
    height: 72px !important;
    border-radius: 24px !important;
  }
}

@media (max-width: 760px) {
  .formula-main::after {
    width: 54px !important;
    height: 54px !important;
    border-radius: 18px !important;
  }
}

/* ===== assets/ai-score-brand-hero.css ===== */
/* ===== MAKE AI-LEGACYSCORE™ THE HERO TEXT ===== */

.formula-main {
  align-content: center !important;
  justify-items: start !important;
  padding: 34px 110px 34px 34px !important;
}

/* Make AI-LegacyScore™ the main focus */
.formula-main span {
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  background-image: none !important;
  color: #fff !important;
  text-indent: 0 !important;
  overflow: visible !important;
  filter: none !important;

  font-family: var(--font-display, Impact, sans-serif) !important;
  font-size: clamp(54px, 6vw, 86px) !important;
  line-height: .88 !important;
  letter-spacing: .035em !important;
  text-transform: none !important;
  text-shadow:
    0 0 24px rgba(245,199,107,.18),
    0 12px 34px rgba(0,0,0,.34) !important;
}

/* Make the formula the supporting line */
.formula-main strong {
  display: block !important;
  color: rgba(245,199,107,.92) !important;
  font-family: var(--font-stat, sans-serif) !important;
  font-size: clamp(18px, 2.2vw, 30px) !important;
  line-height: 1.05 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
  max-width: 760px !important;
}

/* Keep icon clean */
.formula-main::after {
  top: 26px !important;
  right: 26px !important;
}

/* Mobile version */
@media (max-width: 760px) {
  .formula-main {
    min-height: 230px !important;
    padding: 24px 76px 24px 18px !important;
    align-content: center !important;
  }

  .formula-main span {
    font-size: 43px !important;
    line-height: .9 !important;
    margin-bottom: 12px !important;
  }

  .formula-main strong {
    font-size: 18px !important;
    line-height: 1.15 !important;
    letter-spacing: .06em !important;
  }

  .formula-main::after {
    top: 18px !important;
    right: 18px !important;
    width: 52px !important;
    height: 52px !important;
  }
}

/* ===== assets/ai-icon-left.css ===== */
/* ===== MOVE AI-LEGACYSCORE HERO ICON TO LEFT ===== */

.formula-main {
  padding-left: 128px !important;
  padding-right: 34px !important;
}

/* Move the AI-LegacyScore icon from right side to left */
.formula-main::after {
  left: 34px !important;
  right: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}

/* Keep the brand text/formula aligned cleanly */
.formula-main span,
.formula-main strong {
  margin-left: 0 !important;
}

/* Mobile */
@media (max-width: 760px) {
  .formula-main {
    padding-left: 86px !important;
    padding-right: 16px !important;
  }

  .formula-main::after {
    left: 18px !important;
    right: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 52px !important;
    height: 52px !important;
  }

  .formula-main span {
    font-size: 38px !important;
  }

  .formula-main strong {
    font-size: 17px !important;
  }
}

/* ===== MAKE AI-LEGACYSCORE HERO ICON BIGGER ===== */

@media (min-width: 761px) {
  .formula-main {
    padding-left: 160px !important;
  }

  .formula-main::after {
    left: 34px !important;
    width: 98px !important;
    height: 98px !important;
    border-radius: 30px !important;
    background-size: 86% 86%, auto !important;
  }
}

@media (max-width: 760px) {
  .formula-main {
    padding-left: 104px !important;
  }

  .formula-main::after {
    left: 18px !important;
    width: 70px !important;
    height: 70px !important;
    border-radius: 22px !important;
    background-size: 86% 86%, auto !important;
  }
}

/* ===== assets/ai-gold-icon-force.css ===== */
/* Force the new gold AI-LegacyScore icon */

.formula-main::after {
  background:
    url("ai-legacy-icon-gold.png") center / 82% 82% no-repeat,
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.045)),
    rgba(0,0,0,.34) !important;
}

/* ===== assets/ai-icon-final-fix.css ===== */
/* ===== FINAL AI-LEGACYSCORE ICON FIT FIX ===== */

.formula-main::after {
  background:
    url("ai-legacy-icon-final-clean-v3.png") center / 92% 92% no-repeat,
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.035)),
    rgba(0,0,0,.20) !important;

  border: 1px solid rgba(245,199,107,.36) !important;
  box-shadow:
    0 18px 48px rgba(245,199,107,.18),
    inset 0 1px 0 rgba(255,255,255,.18) !important;
}

/* Keep the badge clean and proportional */
@media (min-width: 761px) {
  .formula-main::after {
    width: 92px !important;
    height: 92px !important;
    border-radius: 28px !important;
  }
}

@media (max-width: 760px) {
  .formula-main::after {
    width: 66px !important;
    height: 66px !important;
    border-radius: 21px !important;
  }
}

/* ===== assets/ai-criteria-compact-fix.css ===== */
/* ===== FIX AI-LEGACYSCORE CRITERIA CARD BLANK SPACE ===== */
/* Loaded last. Keeps the glass hero, fixes the oversized criteria boxes. */

/* Desktop/tablet: cleaner card height */
.formula-grid {
  align-items: stretch !important;
}

.formula-card {
  min-height: 0 !important;
  height: auto !important;
  padding: 16px 16px 16px 72px !important;
}

.formula-card p {
  margin-bottom: 0 !important;
}

/* Mobile: make criteria into compact list rows */
@media (max-width: 760px) {
  .formula-box {
    padding: 12px !important;
    padding-bottom: 10px !important;
  }

  .formula-main {
    margin-bottom: 10px !important;
  }

  .formula-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
    padding: 0 !important;
  }

  .formula-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    flex: none !important;
    scroll-snap-align: none !important;

    display: grid !important;
    grid-template-columns: 42px 1fr !important;
    grid-template-areas:
      "icon label"
      "icon value"
      "icon desc" !important;
    column-gap: 12px !important;
    align-items: start !important;

    padding: 12px 12px !important;
    border-radius: 16px !important;
  }

  .formula-card::after {
    grid-area: icon !important;
    position: static !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 15px !important;
    background-size: 24px 24px, auto !important;
    margin: 0 !important;
  }

  .formula-card::before {
    display: none !important;
    content: none !important;
  }

  .formula-label {
    grid-area: label !important;
    margin: 0 !important;
    font-size: 10px !important;
    line-height: 1 !important;
    letter-spacing: .13em !important;
  }

  .formula-value {
    grid-area: value !important;
    margin: 5px 0 0 !important;
    font-size: 16px !important;
    line-height: 1.1 !important;
  }

  .formula-card p {
    grid-area: desc !important;
    margin: 5px 0 0 !important;
    font-size: 12.5px !important;
    line-height: 1.28 !important;
    color: rgba(205,211,226,.70) !important;
  }

  /* Make the lower note compact instead of eating the screen */
  .formula-note {
    margin-top: 9px !important;
    padding: 10px 12px !important;
    border-radius: 14px !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
  }
}

/* ===== assets/ai-icon-respect-logo.css ===== */
/* ===== RESPECT THE AI-LEGACYSCORE ICON ===== */
/* No fake badge. No double background. No tiny sticker look. */

.formula-main::after {
  content: "" !important;

  background:
    url("ai-legacy-icon-clean-final-v3.png") center / contain no-repeat !important;

  border: 0 !important;
  box-shadow:
    0 0 22px rgba(245,199,107,.22),
    0 12px 34px rgba(0,0,0,.28) !important;

  border-radius: 0 !important;
  filter: none !important;
  opacity: 1 !important;

  text-indent: -9999px !important;
  overflow: visible !important;
}

@media (min-width: 761px) {
  .formula-main {
    padding-left: 150px !important;
  }

  .formula-main::after {
    left: 34px !important;
    right: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 96px !important;
    height: 96px !important;
  }
}

@media (max-width: 760px) {
  .formula-main {
    padding-left: 104px !important;
  }

  .formula-main::after {
    left: 18px !important;
    right: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 72px !important;
    height: 72px !important;
  }
}

/* ===== assets/ai-icon-gold-match.css ===== */
/* ===== MATCH AI ICON GOLD TO FORMULA ICONS ===== */

.formula-main::after {
  background:
    url("ai-legacy-icon-matched-gold-clean-v3.png") center / contain no-repeat !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow:
    0 0 22px rgba(245,199,107,.26),
    0 12px 34px rgba(0,0,0,.28) !important;
}

/* ===== assets/ai-icon-shield-final.css ===== */
/* ===== FINAL CLEAN AI-LEGACYSCORE SHIELD ICON ===== */
/* Uses the cleaned shield directly. No fake badge, no double box, no tiny sticker look. */

.formula-main::after {
  content: "" !important;
  position: absolute !important;
  left: 32px !important;
  right: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;

  background: url("ai-legacyscore-shield-clean.png") center / contain no-repeat !important;

  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter:
    drop-shadow(0 0 18px rgba(245,199,107,.22))
    drop-shadow(0 16px 28px rgba(0,0,0,.38)) !important;

  text-indent: -9999px !important;
  overflow: visible !important;
  opacity: 1 !important;
  z-index: 4 !important;
}

@media (min-width: 761px) {
  .formula-main {
    padding-left: 170px !important;
  }

  .formula-main::after {
    width: 112px !important;
    height: 112px !important;
  }
}

@media (max-width: 760px) {
  .formula-main {
    padding-left: 104px !important;
  }

  .formula-main::after {
    left: 18px !important;
    width: 74px !important;
    height: 74px !important;
  }
}

/* ===== assets/icon-gold-unify.css ===== */
/* ===== UNIFIED SCSL GOLD ICON SYSTEM ===== */

.formula-main::after {
  background:
    url("ai-legacyscore-shield-gold-match-clean-v3.png") center / contain no-repeat !important;

  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  filter:
    drop-shadow(0 0 18px rgba(245,199,107,.26))
    drop-shadow(0 16px 28px rgba(0,0,0,.38)) !important;

  opacity: 1 !important;
}

/* Formula card icon containers */
.formula-card::after {
  background-color: rgba(0,0,0,.24) !important;
  border: 1px solid rgba(245,199,107,.34) !important;
  box-shadow:
    0 0 18px rgba(245,199,107,.12),
    0 10px 24px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.13) !important;
}

/* Keep all small icons bright enough to match the hero shield */
.formula-card:nth-child(1)::after {
  background-image: url("icons/impact.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important;
}

.formula-card:nth-child(2)::after {
  background-image: url("icons/longevity.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important;
}

.formula-card:nth-child(3)::after {
  background-image: url("icons/award.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important;
}

.formula-card:nth-child(4)::after {
  background-image: url("icons/legacy.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important;
}

.formula-card:nth-child(5)::after {
  background-image: url("icons/eligibility.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important;
}

.formula-card:nth-child(6)::after {
  background-image: url("icons/ranking.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important;
}

/* ===== assets/scsl-league-mark.css ===== */
/* ===== CLEAN SCSL LEAGUE MARK ===== */

.league-mark-wrap {
  margin: 6px auto 4px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.league-mark {
  width: 54px;
  height: auto;
  object-fit: contain;
  opacity: .92;
  filter:
    drop-shadow(0 10px 24px rgba(0,0,0,.42))
    drop-shadow(0 0 10px rgba(245,199,107,.08));
}

/* Optional: make it feel like an official badge */
.league-mark-wrap::before,
.league-mark-wrap::after {
  content: "";
  width: 42px;
  height: 1px;
  margin: 0 10px;
  background: linear-gradient(90deg, transparent, rgba(245,199,107,.42));
}

.league-mark-wrap::after {
  background: linear-gradient(90deg, rgba(245,199,107,.42), transparent);
}

@media (max-width: 760px) {
  .league-mark {
    width: 44px;
  }

  .league-mark-wrap {
    margin-top: 4px;
  }

  .league-mark-wrap::before,
  .league-mark-wrap::after {
    width: 30px;
    margin: 0 8px;
  }
}

/* ===== assets/hof-final-theme.css ===== */
/* =========================================================
   SCSL15 HALL OF FAME FINAL THEME
   Black-tie basketball history. Trophy gold. SCSL red/blue accents.
   Loaded last to unify all previous design experiments.
========================================================= */

:root {
  --hof-black: #050507;
  --hof-obsidian: #0b0d12;
  --hof-panel: rgba(11, 13, 18, .86);
  --hof-card: rgba(18, 20, 29, .88);
  --hof-card-soft: rgba(255,255,255,.045);
  --hof-gold: #f5c76b;
  --hof-gold-deep: #b9892f;
  --hof-platinum: #f3f4f6;
  --hof-muted: #a8afbf;
  --hof-red: #d51f35;
  --hof-blue: #1457b7;
  --hof-line: rgba(255,255,255,.11);
}

/* ---------- global stage ---------- */

html {
  scroll-behavior: smooth;
}

body {
  background:
    radial-gradient(circle at 16% 0%, rgba(213,31,53,.16), transparent 30%),
    radial-gradient(circle at 84% 0%, rgba(20,87,183,.15), transparent 30%),
    radial-gradient(circle at 50% -8%, rgba(245,199,107,.13), transparent 30%),
    linear-gradient(180deg, #0a0b11 0%, #05060a 52%, #020307 100%) !important;
  color: var(--hof-platinum) !important;
}

::selection {
  background: rgba(245,199,107,.28);
  color: white;
}

/* ---------- clean top bar ---------- */

.broadcast-bar {
  height: 44px !important;
  padding: 0 18px !important;
  background:
    linear-gradient(180deg, rgba(9,10,16,.98), rgba(4,5,9,.98)) !important;
  border-bottom: 1px solid rgba(245,199,107,.20) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.30) !important;
  backdrop-filter: blur(14px);
}

.broadcast-live {
  height: 24px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, var(--hof-gold), var(--hof-gold-deep)) !important;
  color: #111 !important;
  box-shadow: none !important;
  font-size: 13px !important;
  letter-spacing: .08em !important;
}

.broadcast-title {
  color: rgba(247,247,251,.88) !important;
  font-size: 15px !important;
  letter-spacing: .10em !important;
}

.broadcast-right {
  color: rgba(245,199,107,.82) !important;
  font-size: 12px !important;
  letter-spacing: .10em !important;
}

/* ticker */
.broadcast-ticker {
  top: 44px !important;
  background: rgba(2,3,6,.98) !important;
  border-bottom: 1px solid rgba(245,199,107,.16) !important;
}

.ticker-label {
  background: linear-gradient(180deg, var(--hof-gold), var(--hof-gold-deep)) !important;
  color: #111 !important;
}

/* ---------- hero / logo ---------- */

.hero {
  padding: 38px 18px 30px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.14), transparent 34%),
    radial-gradient(circle at 18% 22%, rgba(213,31,53,.10), transparent 30%),
    radial-gradient(circle at 82% 22%, rgba(20,87,183,.10), transparent 30%) !important;
  border-bottom: 1px solid rgba(245,199,107,.14) !important;
}

.logo,
.logo.logo-lockup {
  width: min(610px, 78vw) !important;
  max-height: 160px !important;
  filter:
    drop-shadow(0 26px 54px rgba(0,0,0,.58))
    drop-shadow(0 0 26px rgba(245,199,107,.14)) !important;
}

.eyebrow {
  color: var(--hof-gold) !important;
  letter-spacing: .24em !important;
}

.sub,
.hero-sub {
  max-width: 720px !important;
  color: rgba(220,224,238,.74) !important;
  font-size: 14px !important;
}

/* league badge */
.league-mark-wrap {
  margin: 8px auto 4px !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

.league-mark {
  width: 56px !important;
  height: auto !important;
  object-fit: contain;
  filter:
    drop-shadow(0 12px 24px rgba(0,0,0,.46))
    drop-shadow(0 0 12px rgba(245,199,107,.10));
}

.league-mark-wrap::before,
.league-mark-wrap::after {
  content: "";
  width: 44px;
  height: 1px;
  margin: 0 10px;
  background: linear-gradient(90deg, transparent, rgba(245,199,107,.46));
}

.league-mark-wrap::after {
  background: linear-gradient(90deg, rgba(245,199,107,.46), transparent);
}

.hero-chips span,
.hero-chips button {
  border: 1px solid rgba(245,199,107,.28) !important;
  background:
    linear-gradient(180deg, rgba(245,199,107,.12), rgba(255,255,255,.045)) !important;
  color: rgba(247,247,251,.92) !important;
}

/* ---------- layout ---------- */

main {
  max-width: 1060px !important;
  width: min(1060px, calc(100vw - 44px)) !important;
  margin: 0 auto !important;
  padding-top: 24px !important;
}

.panel {
  border-radius: 30px !important;
  padding: 22px !important;
  margin: 22px auto !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.060), rgba(255,255,255,.024)),
    var(--hof-panel) !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  box-shadow:
    0 30px 100px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.07) !important;
}

.panel::before {
  height: 3px !important;
  margin: -22px -22px 18px !important;
  background: linear-gradient(90deg, var(--hof-red), var(--hof-gold), var(--hof-blue)) !important;
  opacity: .95 !important;
}

.section-head {
  padding-bottom: 14px !important;
  margin-bottom: 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}

.section-head h2 {
  color: var(--hof-platinum) !important;
  font-size: clamp(28px, 3.2vw, 40px) !important;
  line-height: .95 !important;
}

.section-head h2::before {
  display: none !important;
  content: none !important;
}

.section-head p {
  color: rgba(184,188,207,.76) !important;
}

/* ---------- recap strip ---------- */

.broadcast-recap {
  max-width: 1060px !important;
  width: min(1060px, calc(100vw - 44px)) !important;
  margin: 18px auto 4px !important;
  gap: 12px !important;
}

.recap-card,
.db-stat {
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.12), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.026)),
    rgba(9,10,16,.86) !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.24) !important;
}

.recap-label,
.db-label {
  color: var(--hof-gold) !important;
}

.recap-value,
.db-value {
  color: var(--hof-platinum) !important;
}

/* =========================================================
   AI-LegacyScore Engine — HOF / product blend
========================================================= */

.formula-panel {
  overflow: hidden !important;
}

.formula-box {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.formula-box::before {
  display: none !important;
  content: none !important;
}

.formula-main {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  min-height: 210px !important;
  display: grid !important;
  align-content: center !important;
  padding: 32px 34px 32px 168px !important;
  margin-bottom: 16px !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 80% 18%, rgba(245,199,107,.22), transparent 30%),
    radial-gradient(circle at 18% 22%, rgba(213,31,53,.13), transparent 34%),
    radial-gradient(circle at 84% 84%, rgba(20,87,183,.16), transparent 36%),
    linear-gradient(135deg, rgba(255,255,255,.095), rgba(255,255,255,.030)),
    #070912 !important;
  border: 1px solid rgba(245,199,107,.26) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(245,199,107,.12),
    0 32px 110px rgba(0,0,0,.38) !important;
}

/* glass drift */
.formula-main::before {
  content: "" !important;
  position: absolute !important;
  inset: -34% !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: .70 !important;
  background:
    linear-gradient(
      112deg,
      transparent 0%,
      transparent 22%,
      rgba(255,255,255,.045) 31%,
      rgba(255,255,255,.15) 38%,
      rgba(245,199,107,.15) 44%,
      rgba(255,255,255,.07) 51%,
      transparent 64%,
      transparent 100%
    ) !important;
  mix-blend-mode: screen;
  animation: hofGlassDrift 7s ease-in-out infinite alternate !important;
}

@keyframes hofGlassDrift {
  from { transform: translateX(-30%) skewX(-6deg); }
  to { transform: translateX(30%) skewX(-6deg); }
}

/* icon */
.formula-main::after {
  content: "" !important;
  position: absolute !important;
  left: 34px !important;
  right: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 112px !important;
  height: 112px !important;
  z-index: 4 !important;
  background: url("ai-legacyscore-shield-gold-match-clean-v3.png") center / contain no-repeat !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter:
    drop-shadow(0 0 20px rgba(245,199,107,.24))
    drop-shadow(0 18px 32px rgba(0,0,0,.42)) !important;
}

.formula-main span,
.formula-main strong {
  position: relative !important;
  z-index: 3 !important;
}

.formula-main span {
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  color: #fff !important;
  text-indent: 0 !important;
  overflow: visible !important;
  filter: none !important;
  font-family: var(--font-display, Impact, sans-serif) !important;
  font-size: clamp(52px, 5.4vw, 76px) !important;
  line-height: .88 !important;
  letter-spacing: .035em !important;
  text-transform: none !important;
  text-shadow:
    0 0 24px rgba(245,199,107,.14),
    0 12px 34px rgba(0,0,0,.34) !important;
}

.formula-main span::before {
  display: none !important;
  content: none !important;
}

.formula-main strong {
  display: block !important;
  color: rgba(245,199,107,.94) !important;
  font-family: var(--font-stat, sans-serif) !important;
  font-size: clamp(17px, 2vw, 28px) !important;
  line-height: 1.08 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

/* criteria cards */
.formula-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  overflow: visible !important;
  scroll-snap-type: none !important;
  padding: 0 !important;
}

.formula-card {
  position: relative !important;
  min-height: 132px !important;
  padding: 16px 16px 16px 72px !important;
  border-radius: 20px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.060), rgba(255,255,255,.024)),
    rgba(10,11,18,.84) !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 14px 40px rgba(0,0,0,.18) !important;
}

.formula-card::before {
  display: none !important;
  content: none !important;
}

.formula-card::after {
  content: "" !important;
  position: absolute !important;
  top: 16px !important;
  left: 16px !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(245,199,107,.30) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 25px 25px, auto !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.25) !important;
}

.formula-card:nth-child(1)::after { background-image: url("icons/impact.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important; }
.formula-card:nth-child(2)::after { background-image: url("icons/longevity.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important; }
.formula-card:nth-child(3)::after { background-image: url("icons/award.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important; }
.formula-card:nth-child(4)::after { background-image: url("icons/legacy.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important; }
.formula-card:nth-child(5)::after { background-image: url("icons/eligibility.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important; }
.formula-card:nth-child(6)::after { background-image: url("icons/ranking.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important; }

.formula-label {
  color: var(--hof-gold) !important;
  font-size: 10.5px !important;
  letter-spacing: .14em !important;
}

.formula-value {
  margin-top: 7px !important;
  color: #fff !important;
  font-size: 17px !important;
}

.formula-card p {
  margin-top: 7px !important;
  color: rgba(205,211,226,.72) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

.formula-note {
  margin-top: 12px !important;
  padding: 12px 14px !important;
  border-radius: 16px !important;
  background:
    linear-gradient(90deg, rgba(245,199,107,.065), rgba(255,255,255,.030)) !important;
  border: 1px solid rgba(245,199,107,.14) !important;
  border-left: 4px solid rgba(245,199,107,.70) !important;
}

/* ---------- Top 15 / induction cards ---------- */

#top15 {
  max-width: 980px !important;
}

.legacy-spotlight {
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.14), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.060), rgba(255,255,255,.024)),
    rgba(9,10,16,.86) !important;
  border: 1px solid rgba(245,199,107,.18) !important;
}

.spotlight-card,
#top15 .card {
  background:
    linear-gradient(180deg, rgba(255,255,255,.062), rgba(255,255,255,.024)),
    rgba(9,10,16,.88) !important;
  border: 1px solid rgba(255,255,255,.105) !important;
}

#top15 .rank,
.spotlight-rank {
  background: linear-gradient(180deg, var(--hof-gold), var(--hof-gold-deep)) !important;
  color: #111 !important;
}

#top15 .mobile-card-score strong,
.spotlight-score {
  color: var(--hof-gold) !important;
}

/* ---------- Stat Vault ---------- */

#database {
  max-width: 1060px !important;
}

.database-chips .db-chip,
.db-chip {
  border-color: rgba(245,199,107,.25) !important;
}

.db-chip.active,
.db-chip:hover {
  background: linear-gradient(180deg, var(--hof-gold), var(--hof-gold-deep)) !important;
  color: #111 !important;
}

#database .table-wrap {
  background:
    linear-gradient(180deg, rgba(255,255,255,.040), rgba(255,255,255,.018)),
    rgba(4,5,10,.76) !important;
  border-color: rgba(255,255,255,.11) !important;
}

#playersTable th {
  background: linear-gradient(180deg, #161821, #090a10) !important;
  color: var(--hof-gold) !important;
}

#playersTable td[data-col="SCSL15_score"] {
  color: var(--hof-gold) !important;
}

/* ---------- mobile ---------- */

@media (max-width: 760px) {
  .broadcast-bar {
    height: 40px !important;
  }

  .broadcast-ticker {
    top: 40px !important;
  }

  .mobile-jump-nav {
    top: 71px !important;
  }

  .hero {
    padding: 24px 12px 20px !important;
  }

  .league-mark {
    width: 44px !important;
  }

  main {
    width: 100% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .broadcast-recap {
    width: 100% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .panel {
    padding: 16px !important;
    border-radius: 24px !important;
  }

  .panel::before {
    margin: -16px -16px 16px !important;
  }

  .formula-main {
    min-height: 170px !important;
    padding: 20px 16px 20px 104px !important;
    border-radius: 22px !important;
  }

  .formula-main::after {
    left: 18px !important;
    width: 72px !important;
    height: 72px !important;
  }

  .formula-main span {
    font-size: 36px !important;
    line-height: .9 !important;
  }

  .formula-main strong {
    font-size: 15px !important;
    line-height: 1.15 !important;
  }

  .formula-grid {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .formula-card {
    min-height: auto !important;
    padding: 12px 12px 12px 64px !important;
  }

  .formula-card::after {
    top: 12px !important;
    left: 12px !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 14px !important;
    background-size: 23px 23px, auto !important;
  }

  .formula-card p {
    font-size: 12px !important;
  }

  .formula-note {
    font-size: 12px !important;
    line-height: 1.32 !important;
  }
}

/* disable motion if needed */
@media (prefers-reduced-motion: reduce) {
  .formula-main::before {
    animation: none !important;
  }
}

/* ===== assets/hof-blackout-final.css ===== */
/* =========================================================
   SCSL15 BLACK HALL OF FAME OVERRIDE
   Much darker. Gold trim. Red/blue used only as subtle accents.
   Loaded dead last.
========================================================= */

:root {
  --blackout-bg: #020307;
  --blackout-bg-2: #05060a;
  --blackout-panel: rgba(5, 6, 10, .92);
  --blackout-card: rgba(8, 9, 14, .94);
  --blackout-card-2: rgba(13, 14, 20, .94);
  --blackout-line: rgba(245,199,107,.16);
  --blackout-line-soft: rgba(255,255,255,.085);
  --blackout-gold: #f5c76b;
  --blackout-gold-deep: #b9892f;
  --blackout-text: #f3f4f6;
  --blackout-muted: #a7adba;
  --blackout-red: #d51f35;
  --blackout-blue: #1457b7;
}

/* Overall stage: way more black */
html,
body {
  background:
    radial-gradient(circle at 50% -12%, rgba(245,199,107,.075), transparent 26%),
    radial-gradient(circle at 0% 0%, rgba(213,31,53,.055), transparent 24%),
    radial-gradient(circle at 100% 0%, rgba(20,87,183,.055), transparent 24%),
    linear-gradient(180deg, #05060a 0%, #030409 42%, #010205 100%) !important;
  color: var(--blackout-text) !important;
}

/* Top bar: black, not red/broadcast */
.broadcast-bar {
  background: linear-gradient(180deg, #06070c, #020307) !important;
  border-bottom: 1px solid rgba(245,199,107,.18) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.55) !important;
}

.broadcast-live {
  background: linear-gradient(180deg, var(--blackout-gold), var(--blackout-gold-deep)) !important;
  color: #111 !important;
}

.broadcast-title {
  color: rgba(243,244,246,.88) !important;
}

.broadcast-right {
  color: rgba(245,199,107,.72) !important;
}

/* Ticker: nearly black */
.broadcast-ticker {
  background: #010205 !important;
  border-bottom: 1px solid rgba(245,199,107,.12) !important;
}

/* Hero: black trophy case */
.hero {
  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.085), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.018), transparent),
    #030409 !important;
  border-bottom: 1px solid rgba(245,199,107,.11) !important;
}

.logo,
.logo.logo-lockup {
  filter:
    drop-shadow(0 28px 60px rgba(0,0,0,.72))
    drop-shadow(0 0 18px rgba(245,199,107,.10)) !important;
}

.eyebrow,
.formula-label,
.recap-label,
.db-label {
  color: var(--blackout-gold) !important;
}

.sub,
.hero-sub,
.section-head p,
.formula-card p,
.formula-note,
.meta,
.recap-note,
.db-note {
  color: rgba(167,173,186,.78) !important;
}

/* League mark stays subtle */
.league-mark {
  opacity: .88 !important;
  filter:
    drop-shadow(0 12px 26px rgba(0,0,0,.60))
    drop-shadow(0 0 8px rgba(245,199,107,.08)) !important;
}

/* Main panels: black glass, not gray/colorful */
.panel {
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
    var(--blackout-panel) !important;
  border: 1px solid rgba(245,199,107,.105) !important;
  box-shadow:
    0 34px 110px rgba(0,0,0,.48),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
}

.panel::before {
  height: 2px !important;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(213,31,53,.55),
    rgba(245,199,107,.72),
    rgba(20,87,183,.55),
    transparent
  ) !important;
  opacity: .85 !important;
}

.section-head {
  border-bottom: 1px solid rgba(245,199,107,.10) !important;
}

.section-head h2 {
  color: var(--blackout-text) !important;
}

/* Stat recap / database stat cards */
.recap-card,
.db-stat {
  background:
    linear-gradient(180deg, rgba(255,255,255,.038), rgba(255,255,255,.012)),
    var(--blackout-card) !important;
  border: 1px solid rgba(245,199,107,.10) !important;
  box-shadow:
    0 22px 70px rgba(0,0,0,.40),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.db-stat.featured {
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.10), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.014)),
    #06070c !important;
  border: 1px solid rgba(245,199,107,.26) !important;
}

/* AI-LegacyScore section: keep glass, make surrounding black */
.formula-panel {
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
    rgba(4,5,9,.94) !important;
  border: 1px solid rgba(245,199,107,.12) !important;
}

.formula-box {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Darker formula feature tiles */
.formula-card {
  background:
    linear-gradient(180deg, rgba(255,255,255,.040), rgba(255,255,255,.012)),
    #07080d !important;
  border: 1px solid rgba(245,199,107,.10) !important;
  box-shadow:
    0 16px 50px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.formula-card::after {
  background-color: rgba(0,0,0,.34) !important;
  border-color: rgba(245,199,107,.22) !important;
}

.formula-value {
  color: #fff !important;
}

/* Top 3 / Top 15 cards: induction plaques */
.legacy-spotlight,
.spotlight-card,
#top15 .card {
  background:
    linear-gradient(180deg, rgba(255,255,255,.040), rgba(255,255,255,.012)),
    var(--blackout-card) !important;
  border: 1px solid rgba(245,199,107,.105) !important;
  box-shadow:
    0 24px 80px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.spotlight-rank-1,
#top15 .card:nth-child(1),
#top15 .card:nth-child(2),
#top15 .card:nth-child(3) {
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.10), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.048), rgba(255,255,255,.014)),
    #07080d !important;
  border-color: rgba(245,199,107,.20) !important;
}

.rank,
.spotlight-rank,
#top15 .rank {
  background: linear-gradient(180deg, var(--blackout-gold), var(--blackout-gold-deep)) !important;
  color: #111 !important;
}

.pill,
.honor-chip,
.spotlight-mini span {
  background: rgba(0,0,0,.28) !important;
  border-color: rgba(245,199,107,.12) !important;
  color: rgba(243,244,246,.88) !important;
}

/* Database / stat vault */
#database {
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
    rgba(4,5,9,.94) !important;
}

#database .table-wrap {
  background: #030409 !important;
  border: 1px solid rgba(245,199,107,.12) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 24px 80px rgba(0,0,0,.35) !important;
}

.search-box {
  background: #080910 !important;
  border-color: rgba(245,199,107,.15) !important;
  color: var(--blackout-text) !important;
}

.db-chip {
  background: #07080d !important;
  border-color: rgba(245,199,107,.16) !important;
  color: rgba(243,244,246,.88) !important;
}

.db-chip.active,
.db-chip:hover {
  background: linear-gradient(180deg, var(--blackout-gold), var(--blackout-gold-deep)) !important;
  color: #111 !important;
}

#playersTable th {
  background: linear-gradient(180deg, #0b0d13, #030409) !important;
  color: var(--blackout-gold) !important;
  border-bottom: 2px solid rgba(245,199,107,.24) !important;
}

#playersTable td {
  background: #05060a !important;
  color: rgba(243,244,246,.86) !important;
}

#playersTable tbody tr:nth-child(even) td {
  background: #080910 !important;
}

#playersTable tbody tr:hover td {
  background: rgba(245,199,107,.075) !important;
}

#playersTable td[data-col="Player"] {
  background: #05060a !important;
}

#playersTable td[data-col="SCSL15_score"] {
  background: #080705 !important;
  color: var(--blackout-gold) !important;
}

/* Music intro: darker ceremony entrance */
.music-intro {
  background:
    radial-gradient(circle at 50% 10%, rgba(245,199,107,.14), transparent 30%),
    rgba(0,0,0,.92) !important;
}

.music-intro-card {
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)),
    #05060a !important;
  border-color: rgba(245,199,107,.24) !important;
}

/* Mobile: keep it black too */
@media (max-width: 760px) {
  .broadcast-bar {
    background: #020307 !important;
  }

  .mobile-jump-nav {
    background: rgba(2,3,7,.96) !important;
    border-bottom-color: rgba(245,199,107,.12) !important;
  }

  .mobile-jump-nav a {
    background: #07080d !important;
    border-color: rgba(245,199,107,.18) !important;
  }

  .panel {
    background:
      linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
      rgba(4,5,9,.94) !important;
  }
}

/* ===== assets/top3-medals.css ===== */
/* ===== TOP 3 MEDAL RANK BADGES ===== */
/* #1 Gold, #2 Silver, #3 Bronze. Everyone else stays red. */

/* Default rank badge: red */
#top15 .rank,
.spotlight-rank {
  color: #fff !important;
  background: linear-gradient(180deg, #e11d2e, #991b1b) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow:
    0 10px 24px rgba(201,31,46,.22),
    inset 0 1px 0 rgba(255,255,255,.18) !important;
}

/* #1 Gold */
#top15 .card:nth-child(1) .rank,
.spotlight-rank-1 .spotlight-rank {
  color: #111 !important;
  background:
    linear-gradient(180deg, #fff3b0 0%, #f5c76b 48%, #b9892f 100%) !important;
  border: 1px solid rgba(255,255,255,.45) !important;
  box-shadow:
    0 0 24px rgba(245,199,107,.30),
    0 12px 28px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.50) !important;
}

/* #2 Silver */
#top15 .card:nth-child(2) .rank,
.spotlight-rank-2 .spotlight-rank {
  color: #111 !important;
  background:
    linear-gradient(180deg, #ffffff 0%, #d7dce5 48%, #8f98a8 100%) !important;
  border: 1px solid rgba(255,255,255,.55) !important;
  box-shadow:
    0 0 22px rgba(215,220,229,.24),
    0 12px 28px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.60) !important;
}

/* #3 Bronze */
#top15 .card:nth-child(3) .rank,
.spotlight-rank-3 .spotlight-rank {
  color: #111 !important;
  background:
    linear-gradient(180deg, #ffd9a0 0%, #c7833d 48%, #7a451d 100%) !important;
  border: 1px solid rgba(255,255,255,.40) !important;
  box-shadow:
    0 0 22px rgba(199,131,61,.24),
    0 12px 28px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.45) !important;
}

/* Make sure #4+ stay red even if older files try to turn them gold */
#top15 .card:nth-child(n+4) .rank {
  color: #fff !important;
  background: linear-gradient(180deg, #e11d2e, #991b1b) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow:
    0 10px 24px rgba(201,31,46,.22),
    inset 0 1px 0 rgba(255,255,255,.18) !important;
}

/* ===== assets/formula-click-details.css ===== */
/* ===== CLICKABLE AI-LEGACYSCORE CRITERIA CARDS ===== */
/* Makes the criteria cards compact until clicked. Loaded last. */

/* The hero glass card stays untouched. This only changes the criteria cards below it. */

.formula-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 9px !important;
  overflow: visible !important;
  scroll-snap-type: none !important;
  padding: 0 !important;
}

.formula-card.formula-detail-card {
  position: relative !important;
  min-height: 0 !important;
  height: auto !important;
  cursor: pointer !important;
  user-select: none;

  display: grid !important;
  grid-template-columns: 42px 1fr auto !important;
  grid-template-areas:
    "icon label hint"
    "icon value hint"
    "desc desc desc" !important;
  column-gap: 11px !important;
  align-items: center !important;

  padding: 12px 12px !important;
  border-radius: 17px !important;
  transition:
    border-color .18s ease,
    background .18s ease,
    transform .18s ease,
    box-shadow .18s ease !important;
}

.formula-card.formula-detail-card:hover {
  border-color: rgba(245,199,107,.28) !important;
  transform: translateY(-1px);
}

.formula-card.formula-detail-card::after {
  grid-area: icon !important;
  position: static !important;
  width: 42px !important;
  height: 42px !important;
  margin: 0 !important;
  border-radius: 15px !important;
  background-size: 24px 24px, auto !important;
}

.formula-card.formula-detail-card::before {
  display: none !important;
  content: none !important;
}

.formula-card.formula-detail-card .formula-label {
  grid-area: label !important;
  margin: 0 !important;
  font-size: 10px !important;
  line-height: 1 !important;
  letter-spacing: .13em !important;
}

.formula-card.formula-detail-card .formula-value {
  grid-area: value !important;
  margin: 5px 0 0 !important;
  font-size: 15px !important;
  line-height: 1.08 !important;
}

.formula-card.formula-detail-card p {
  grid-area: desc !important;
  max-height: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  transition:
    max-height .22s ease,
    opacity .18s ease,
    margin-top .18s ease,
    padding-top .18s ease !important;
}

.formula-card.formula-detail-card.expanded p {
  max-height: 160px !important;
  opacity: 1 !important;
  margin-top: 10px !important;
  padding-top: 10px !important;
  border-top: 1px solid rgba(255,255,255,.09) !important;
  color: rgba(205,211,226,.76) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

.formula-detail-hint {
  grid-area: hint !important;
  align-self: center !important;
  justify-self: end !important;
  white-space: nowrap !important;

  border: 1px solid rgba(245,199,107,.22);
  border-radius: 999px;
  padding: 5px 8px;
  color: rgba(245,199,107,.92);
  background: rgba(245,199,107,.065);
  font-family: var(--font-stat, sans-serif);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.formula-detail-hint .open {
  display: none;
}

.formula-card.formula-detail-card.expanded .formula-detail-hint {
  color: #111;
  background: linear-gradient(180deg, #f5c76b, #b9892f);
  border-color: rgba(255,255,255,.38);
}

.formula-card.formula-detail-card.expanded .formula-detail-hint .closed {
  display: none;
}

.formula-card.formula-detail-card.expanded .formula-detail-hint .open {
  display: inline;
}

/* Mobile: compact list, no scroll trap */
@media (max-width: 760px) {
  .formula-grid {
    grid-template-columns: 1fr !important;
    gap: 7px !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  .formula-card.formula-detail-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    scroll-snap-align: none !important;
    grid-template-columns: 38px 1fr auto !important;
    column-gap: 10px !important;
    padding: 10px 10px !important;
    border-radius: 15px !important;
  }

  .formula-card.formula-detail-card::after {
    width: 38px !important;
    height: 38px !important;
    border-radius: 14px !important;
    background-size: 23px 23px, auto !important;
  }

  .formula-card.formula-detail-card .formula-value {
    font-size: 14px !important;
  }

  .formula-detail-hint {
    font-size: 9px !important;
    padding: 4px 7px !important;
  }

  .formula-card.formula-detail-card.expanded p {
    max-height: 180px !important;
    font-size: 12px !important;
  }
}

/* Tablet: two columns */
@media (min-width: 761px) and (max-width: 1100px) {
  .formula-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* ===== assets/mobile-ai-engine-final.css ===== */
/* ===== FINAL MOBILE AI-LEGACYSCORE ENGINE FIX ===== */
/* Desktop stays unchanged. Mobile criteria cards become compact tappable rows. */

@media (max-width: 760px) {
  /* Keep the AI section contained and clean */
  #formula,
  .formula-panel,
  .formula-box {
    overflow: visible !important;
  }

  .formula-panel {
    padding: 14px !important;
  }

  .formula-panel .section-head {
    margin-bottom: 12px !important;
    padding-bottom: 10px !important;
  }

  .formula-panel .section-head h2 {
    font-size: 30px !important;
    line-height: .95 !important;
  }

  .formula-panel .section-head p {
    font-size: 14px !important;
    line-height: 1.32 !important;
    margin-top: 6px !important;
  }

  .formula-box {
    padding: 10px !important;
    border-radius: 20px !important;
  }

  /* Leave the hero card premium, just reduce its vertical footprint a little */
  .formula-main {
    min-height: 150px !important;
    margin-bottom: 10px !important;
  }

  .formula-main span {
    font-size: 34px !important;
    line-height: .9 !important;
    margin-bottom: 7px !important;
  }

  .formula-main strong {
    font-size: 14px !important;
    line-height: 1.15 !important;
    letter-spacing: .06em !important;
  }

  /* Criteria area becomes a compact list */
  #formula .formula-grid,
  .formula-panel .formula-grid,
  .formula-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 7px !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
    padding: 0 !important;
    width: 100% !important;
  }

  #formula .formula-card,
  #formula .formula-card.formula-detail-card,
  .formula-panel .formula-card,
  .formula-panel .formula-card.formula-detail-card,
  .formula-card,
  .formula-card.formula-detail-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    flex: none !important;
    scroll-snap-align: none !important;
    box-sizing: border-box !important;

    display: grid !important;
    grid-template-columns: 40px minmax(0, 1fr) auto !important;
    grid-template-areas:
      "icon label hint"
      "icon value hint"
      "desc desc desc" !important;
    column-gap: 10px !important;
    align-items: center !important;

    padding: 10px !important;
    border-radius: 15px !important;
  }

  #formula .formula-card::after,
  .formula-panel .formula-card::after,
  .formula-card::after {
    grid-area: icon !important;
    position: static !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    border-radius: 14px !important;
    margin: 0 !important;
    background-size: 23px 23px, auto !important;
  }

  #formula .formula-card::before,
  .formula-panel .formula-card::before,
  .formula-card::before {
    display: none !important;
    content: none !important;
  }

  .formula-label {
    grid-area: label !important;
    margin: 0 !important;
    font-size: 9.5px !important;
    line-height: 1 !important;
    letter-spacing: .13em !important;
  }

  .formula-value {
    grid-area: value !important;
    margin: 5px 0 0 !important;
    font-size: 15px !important;
    line-height: 1.08 !important;
  }

  .formula-detail-hint {
    grid-area: hint !important;
    justify-self: end !important;
    align-self: center !important;
    margin: 0 !important;
    padding: 5px 8px !important;
    font-size: 9px !important;
    white-space: nowrap !important;
  }

  /* Hide explanation text until tapped */
  .formula-card p,
  .formula-card.formula-detail-card p {
    grid-area: desc !important;
    display: block !important;
    max-height: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    font-size: 12px !important;
    line-height: 1.28 !important;
  }

  .formula-card.expanded p,
  .formula-card.formula-detail-card.expanded p {
    max-height: 160px !important;
    opacity: 1 !important;
    margin-top: 9px !important;
    padding-top: 9px !important;
    border-top: 1px solid rgba(255,255,255,.09) !important;
  }

  /* Make the note less bulky on mobile */
  .formula-note {
    margin-top: 9px !important;
    padding: 10px 12px !important;
    border-radius: 14px !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
  }
}

/* ===== assets/ai-engine-glass-button.css ===== */
/* ===== AI-LEGACYSCORE BIG GLASS BUTTON ===== */
/* Loaded last. Makes the hero card the main interactive object. */

/* Hide criteria details until the big glass button is opened */
#formula.ai-engine-button-mode:not(.engine-open) .formula-grid,
#formula.ai-engine-button-mode:not(.engine-open) .formula-note,
.formula-panel.ai-engine-button-mode:not(.engine-open) .formula-grid,
.formula-panel.ai-engine-button-mode:not(.engine-open) .formula-note {
  display: none !important;
}

/* When opened, show details cleanly */
#formula.ai-engine-button-mode.engine-open .formula-grid,
.formula-panel.ai-engine-button-mode.engine-open .formula-grid {
  display: grid !important;
  margin-top: 14px !important;
}

#formula.ai-engine-button-mode.engine-open .formula-note,
.formula-panel.ai-engine-button-mode.engine-open .formula-note {
  display: block !important;
}

/* Big glass button */
#formula .formula-main,
.formula-panel .formula-main {
  cursor: pointer !important;
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  min-height: 230px !important;
  padding: 34px 36px 34px 170px !important;
  border-radius: 30px !important;
  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    filter .18s ease !important;

  background:
    radial-gradient(circle at 80% 18%, rgba(245,199,107,.28), transparent 30%),
    radial-gradient(circle at 16% 18%, rgba(213,31,53,.14), transparent 34%),
    radial-gradient(circle at 85% 86%, rgba(20,87,183,.18), transparent 36%),
    linear-gradient(135deg, rgba(255,255,255,.105), rgba(255,255,255,.032)),
    #060812 !important;

  border: 1px solid rgba(245,199,107,.30) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -1px 0 rgba(245,199,107,.18),
    inset 0 0 64px rgba(255,255,255,.040),
    0 34px 115px rgba(0,0,0,.42),
    0 0 42px rgba(245,199,107,.10) !important;
}

/* Make it feel clickable */
#formula .formula-main:hover,
.formula-panel .formula-main:hover {
  transform: translateY(-2px);
  border-color: rgba(245,199,107,.44) !important;
  filter: brightness(1.06);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.26),
    inset 0 -1px 0 rgba(245,199,107,.22),
    inset 0 0 72px rgba(255,255,255,.050),
    0 38px 128px rgba(0,0,0,.46),
    0 0 60px rgba(245,199,107,.16) !important;
}

/* Premium moving glass reflection */
#formula .formula-main::before,
.formula-panel .formula-main::before {
  content: "" !important;
  position: absolute !important;
  inset: -38% !important;
  pointer-events: none !important;
  z-index: 1 !important;
  opacity: .88 !important;

  background:
    linear-gradient(
      112deg,
      transparent 0%,
      transparent 17%,
      rgba(255,255,255,.045) 25%,
      rgba(255,255,255,.18) 34%,
      rgba(245,199,107,.26) 42%,
      rgba(255,255,255,.14) 50%,
      rgba(20,87,183,.08) 56%,
      transparent 68%,
      transparent 100%
    ),
    linear-gradient(
      25deg,
      transparent 0%,
      rgba(255,255,255,.035) 35%,
      rgba(255,255,255,.10) 50%,
      rgba(245,199,107,.070) 60%,
      transparent 73%
    ) !important;

  mix-blend-mode: screen;
  animation: bigGlassButtonDrift 5.8s cubic-bezier(.45,0,.2,1) infinite alternate !important;
}

@keyframes bigGlassButtonDrift {
  from {
    transform: translateX(-38%) skewX(-7deg);
    opacity: .64;
  }
  to {
    transform: translateX(38%) skewX(-7deg);
    opacity: .96;
  }
}

/* Keep the text and icon above the reflection */
#formula .formula-main span,
#formula .formula-main strong,
#formula .ai-engine-button-hint,
.formula-panel .formula-main span,
.formula-panel .formula-main strong,
.formula-panel .ai-engine-button-hint {
  position: relative !important;
  z-index: 3 !important;
}

/* Icon placement */
#formula .formula-main::after,
.formula-panel .formula-main::after {
  left: 34px !important;
  right: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 112px !important;
  height: 112px !important;
  z-index: 4 !important;
}

/* Main brand text */
#formula .formula-main span,
.formula-panel .formula-main span {
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  color: #fff !important;
  text-indent: 0 !important;
  overflow: visible !important;
  filter: none !important;

  font-family: var(--font-display, Impact, sans-serif) !important;
  font-size: clamp(54px, 5.8vw, 84px) !important;
  line-height: .88 !important;
  letter-spacing: .035em !important;
  text-transform: none !important;
  text-shadow:
    0 0 26px rgba(245,199,107,.16),
    0 12px 34px rgba(0,0,0,.40) !important;
}

#formula .formula-main span::before,
.formula-panel .formula-main span::before {
  display: none !important;
  content: none !important;
}

/* Supporting formula line */
#formula .formula-main strong,
.formula-panel .formula-main strong {
  display: block !important;
  color: rgba(245,199,107,.94) !important;
  font-family: var(--font-stat, sans-serif) !important;
  font-size: clamp(17px, 2vw, 28px) !important;
  line-height: 1.08 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

/* Button hint */
.ai-engine-button-hint {
  display: inline-flex;
  width: fit-content;
  margin-top: 18px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(245,199,107,.28);
  background: rgba(245,199,107,.08);
  color: rgba(245,199,107,.96);
  font-family: var(--font-stat, sans-serif);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .10em;
  text-transform: uppercase;
}

#formula.engine-open .ai-engine-button-hint,
.formula-panel.engine-open .ai-engine-button-hint {
  color: #111;
  background: linear-gradient(180deg, #f5c76b, #b9892f);
  border-color: rgba(255,255,255,.38);
}

/* Open state */
#formula.engine-open .formula-main,
.formula-panel.engine-open .formula-main {
  border-color: rgba(245,199,107,.44) !important;
}

/* Mobile */
@media (max-width: 760px) {
  #formula .formula-main,
  .formula-panel .formula-main {
    min-height: 190px !important;
    padding: 22px 16px 22px 104px !important;
    border-radius: 24px !important;
  }

  #formula .formula-main::after,
  .formula-panel .formula-main::after {
    left: 18px !important;
    width: 72px !important;
    height: 72px !important;
  }

  #formula .formula-main span,
  .formula-panel .formula-main span {
    font-size: 37px !important;
    line-height: .9 !important;
    margin-bottom: 8px !important;
  }

  #formula .formula-main strong,
  .formula-panel .formula-main strong {
    font-size: 14px !important;
    line-height: 1.15 !important;
    letter-spacing: .06em !important;
  }

  .ai-engine-button-hint {
    margin-top: 13px;
    padding: 7px 10px;
    font-size: 10px;
  }

  #formula.ai-engine-button-mode.engine-open .formula-grid,
  .formula-panel.ai-engine-button-mode.engine-open .formula-grid {
    grid-template-columns: 1fr !important;
    gap: 7px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #formula .formula-main::before,
  .formula-panel .formula-main::before {
    animation: none !important;
  }
}

/* ===== assets/database-mobile-compact.css ===== */
/* ===== DATABASE MOBILE COMPACT FINAL ===== */
/* Moves visual priority to Player + AI-LegacyScore and reduces wasted name-column space. */

/* Player column: still frozen, but narrower and cleaner */
#playersTable th[data-key="Player"],
#playersTable td[data-col="Player"] {
  min-width: 150px !important;
  max-width: 150px !important;
  width: 150px !important;
  padding-left: 8px !important;
  padding-right: 8px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* AI score should be next and compact */
#playersTable th[data-key="SCSL15_score"],
#playersTable td[data-col="SCSL15_score"] {
  min-width: 116px !important;
  max-width: 116px !important;
  width: 116px !important;
  padding-left: 7px !important;
  padding-right: 7px !important;
}

/* Team moved later, so make it normal width instead of huge early-column width */
#playersTable th[data-key="Team"],
#playersTable td[data-col="Team"] {
  min-width: 125px !important;
  max-width: 170px !important;
  width: 140px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Keep season small */
#playersTable th[data-key="Season"],
#playersTable td[data-col="Season"] {
  min-width: 76px !important;
  max-width: 76px !important;
  width: 76px !important;
  text-align: center !important;
}

/* Compact common stat columns */
#playersTable th[data-key="GP"],
#playersTable td[data-col="GP"],
#playersTable th[data-key="PPG"],
#playersTable td[data-col="PPG"],
#playersTable th[data-key="RPG"],
#playersTable td[data-col="RPG"],
#playersTable th[data-key="APG"],
#playersTable td[data-col="APG"],
#playersTable th[data-key="EFF_per_g"],
#playersTable td[data-col="EFF_per_g"],
#playersTable th[data-key="Award_bonus"],
#playersTable td[data-col="Award_bonus"],
#playersTable th[data-key="GP_weight_bonus"],
#playersTable td[data-col="GP_weight_bonus"] {
  min-width: 78px !important;
  max-width: 92px !important;
  text-align: center !important;
}

/* Honors can still wrap, but not ridiculously wide */
#playersTable th[data-key="Honors"],
#playersTable td[data-col="Honors"] {
  min-width: 260px !important;
  max-width: 340px !important;
  white-space: normal !important;
  line-height: 1.3 !important;
}

/* Mobile-specific tightening */
@media (max-width: 760px) {
  #playersTable {
    min-width: 1180px !important;
  }

  #playersTable th,
  #playersTable td {
    padding: 8px 7px !important;
    font-size: 11.5px !important;
  }

  #playersTable th[data-key="Player"],
  #playersTable td[data-col="Player"] {
    min-width: 128px !important;
    max-width: 128px !important;
    width: 128px !important;
    padding-left: 7px !important;
    padding-right: 6px !important;
  }

  #playersTable td[data-col="Player"] {
    font-size: 12px !important;
    letter-spacing: .025em !important;
  }

  #playersTable th[data-key="SCSL15_score"],
  #playersTable td[data-col="SCSL15_score"] {
    min-width: 104px !important;
    max-width: 104px !important;
    width: 104px !important;
  }

  #playersTable td[data-col="SCSL15_score"] {
    font-size: 13px !important;
  }

  #playersTable th[data-key="Team"],
  #playersTable td[data-col="Team"] {
    min-width: 118px !important;
    max-width: 145px !important;
    width: 128px !important;
  }

  #playersTable th[data-key="Honors"],
  #playersTable td[data-col="Honors"] {
    min-width: 235px !important;
    max-width: 280px !important;
  }

  #database .table-wrap {
    max-height: 72vh !important;
  }
}

/* ===== assets/final-visual-lock.css ===== */
/* =========================================================
   SCSL15 FINAL VISUAL LOCK
   Goal: cohesive black Hall-of-Fame theme across desktop/mobile.
   Does NOT change stats, scoring, filters, or data logic.
========================================================= */

:root {
  --final-bg: #020306;
  --final-panel: rgba(5, 6, 10, .94);
  --final-card: rgba(8, 9, 15, .94);
  --final-card-2: rgba(12, 13, 20, .96);
  --final-gold: #f5c76b;
  --final-gold-deep: #b9892f;
  --final-white: #f4f5f8;
  --final-muted: #a8afbf;
  --final-red: #d51f35;
  --final-blue: #1457b7;
  --final-line: rgba(245,199,107,.15);
  --final-soft-line: rgba(255,255,255,.09);
}

/* ===== Global black / trophy case stage ===== */

html,
body {
  background:
    radial-gradient(circle at 50% -10%, rgba(245,199,107,.075), transparent 28%),
    radial-gradient(circle at 0% 0%, rgba(213,31,53,.050), transparent 24%),
    radial-gradient(circle at 100% 0%, rgba(20,87,183,.050), transparent 24%),
    linear-gradient(180deg, #05060a 0%, #030409 48%, #010205 100%) !important;
  color: var(--final-white) !important;
  overflow-x: hidden !important;
}

::selection {
  background: rgba(245,199,107,.28);
  color: #fff;
}

/* ===== Top bar / ticker ===== */

.broadcast-bar {
  height: 44px !important;
  background: linear-gradient(180deg, #06070c, #020307) !important;
  border-bottom: 1px solid rgba(245,199,107,.16) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.50) !important;
}

.broadcast-live {
  background: linear-gradient(180deg, var(--final-gold), var(--final-gold-deep)) !important;
  color: #111 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

.broadcast-title {
  color: rgba(244,245,248,.90) !important;
}

.broadcast-right {
  color: rgba(245,199,107,.78) !important;
}

.broadcast-ticker {
  top: 44px !important;
  background: #010205 !important;
  border-bottom: 1px solid rgba(245,199,107,.12) !important;
}

.ticker-label {
  background: linear-gradient(180deg, var(--final-gold), var(--final-gold-deep)) !important;
  color: #111 !important;
}

/* ===== Hero ===== */

.hero {
  padding-top: 34px !important;
  padding-bottom: 28px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.085), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.018), transparent),
    #030409 !important;
  border-bottom: 1px solid rgba(245,199,107,.10) !important;
}

.logo,
.logo.logo-lockup {
  width: min(600px, 78vw) !important;
  max-height: 156px !important;
  filter:
    drop-shadow(0 28px 60px rgba(0,0,0,.70))
    drop-shadow(0 0 18px rgba(245,199,107,.10)) !important;
}

.league-mark {
  opacity: .90 !important;
  filter:
    drop-shadow(0 12px 26px rgba(0,0,0,.55))
    drop-shadow(0 0 10px rgba(245,199,107,.08)) !important;
}

.league-mark-wrap::before,
.league-mark-wrap::after {
  background: linear-gradient(90deg, transparent, rgba(245,199,107,.42)) !important;
}

.league-mark-wrap::after {
  background: linear-gradient(90deg, rgba(245,199,107,.42), transparent) !important;
}

.eyebrow {
  color: var(--final-gold) !important;
}

.sub,
.hero-sub {
  color: rgba(220,224,238,.72) !important;
}

.hero-chips span,
.hero-chips button {
  background:
    linear-gradient(180deg, rgba(245,199,107,.10), rgba(255,255,255,.035)) !important;
  border: 1px solid rgba(245,199,107,.22) !important;
  color: rgba(244,245,248,.90) !important;
}

/* ===== Layout / panels ===== */

main {
  max-width: 1060px !important;
  width: min(1060px, calc(100vw - 44px)) !important;
  margin: 0 auto !important;
  padding-top: 24px !important;
}

.panel {
  border-radius: 30px !important;
  padding: 22px !important;
  margin: 22px auto !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
    var(--final-panel) !important;
  border: 1px solid rgba(245,199,107,.105) !important;
  box-shadow:
    0 34px 110px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.045) !important;
}

.panel::before {
  height: 2px !important;
  margin: -22px -22px 18px !important;
  background:
    linear-gradient(90deg, transparent, rgba(213,31,53,.55), rgba(245,199,107,.78), rgba(20,87,183,.55), transparent) !important;
  opacity: .88 !important;
}

.section-head {
  border-bottom: 1px solid rgba(245,199,107,.10) !important;
  padding-bottom: 14px !important;
  margin-bottom: 18px !important;
}

.section-head h2 {
  color: var(--final-white) !important;
  font-size: clamp(28px, 3.2vw, 40px) !important;
  line-height: .95 !important;
}

.section-head h2::before {
  display: none !important;
  content: none !important;
}

.section-head p,
.meta,
.formula-card p,
.formula-note,
.recap-note,
.db-note {
  color: rgba(168,175,191,.78) !important;
}

/* ===== Recap strip ===== */

.broadcast-recap {
  max-width: 1060px !important;
  width: min(1060px, calc(100vw - 44px)) !important;
  margin: 18px auto 4px !important;
  gap: 12px !important;
}

.recap-card,
.db-stat {
  background:
    linear-gradient(180deg, rgba(255,255,255,.040), rgba(255,255,255,.014)),
    var(--final-card) !important;
  border: 1px solid rgba(245,199,107,.105) !important;
  border-radius: 18px !important;
  box-shadow:
    0 22px 70px rgba(0,0,0,.36),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.recap-label,
.db-label {
  color: var(--final-gold) !important;
}

.recap-value,
.db-value {
  color: var(--final-white) !important;
}

/* ===== AI-LegacyScore section surrounding polish ===== */
/* Do not overrule the glass button animation too heavily. */

.formula-panel {
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
    rgba(4,5,9,.94) !important;
  border: 1px solid rgba(245,199,107,.12) !important;
  overflow: hidden !important;
}

.formula-box {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.formula-box::before {
  display: none !important;
  content: none !important;
}

/* Big glass button stays the star */
.formula-main {
  border-color: rgba(245,199,107,.30) !important;
}

/* Criteria cards below button */
.formula-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 9px !important;
  overflow: visible !important;
  scroll-snap-type: none !important;
}

.formula-card {
  background:
    linear-gradient(180deg, rgba(255,255,255,.040), rgba(255,255,255,.012)),
    #07080d !important;
  border: 1px solid rgba(245,199,107,.10) !important;
  box-shadow:
    0 14px 40px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

.formula-label {
  color: var(--final-gold) !important;
}

.formula-value {
  color: #fff !important;
}

.formula-detail-hint {
  border-color: rgba(245,199,107,.22) !important;
  color: rgba(245,199,107,.94) !important;
  background: rgba(245,199,107,.065) !important;
}

.formula-card.expanded .formula-detail-hint {
  color: #111 !important;
  background: linear-gradient(180deg, var(--final-gold), var(--final-gold-deep)) !important;
}

/* ===== Top 15 / induction cards ===== */

#top15 {
  max-width: 980px !important;
}

.legacy-spotlight,
.spotlight-card,
#top15 .card {
  background:
    linear-gradient(180deg, rgba(255,255,255,.040), rgba(255,255,255,.012)),
    var(--final-card) !important;
  border: 1px solid rgba(245,199,107,.105) !important;
  box-shadow:
    0 24px 80px rgba(0,0,0,.40),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
}

#top15 .card:nth-child(1),
#top15 .card:nth-child(2),
#top15 .card:nth-child(3),
.spotlight-rank-1 {
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.10), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.048), rgba(255,255,255,.014)),
    #07080d !important;
  border-color: rgba(245,199,107,.20) !important;
}

#top15 .mobile-card-score strong,
.spotlight-score {
  color: var(--final-gold) !important;
}

.pill,
.honor-chip,
.spotlight-mini span {
  background: rgba(0,0,0,.28) !important;
  border-color: rgba(245,199,107,.12) !important;
  color: rgba(244,245,248,.88) !important;
}

/* ===== Stat Vault ===== */

#database {
  max-width: 1060px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
    rgba(4,5,9,.94) !important;
}

.database-chips {
  gap: 7px !important;
}

.db-chip {
  background: #07080d !important;
  border-color: rgba(245,199,107,.16) !important;
  color: rgba(244,245,248,.88) !important;
}

.db-chip.active,
.db-chip:hover {
  background: linear-gradient(180deg, var(--final-gold), var(--final-gold-deep)) !important;
  color: #111 !important;
}

#database .table-wrap {
  background: #030409 !important;
  border: 1px solid rgba(245,199,107,.12) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 24px 80px rgba(0,0,0,.35) !important;
}

.search-box {
  background: #080910 !important;
  border-color: rgba(245,199,107,.15) !important;
  color: var(--final-white) !important;
}

#playersTable th {
  background: linear-gradient(180deg, #0b0d13, #030409) !important;
  color: var(--final-gold) !important;
  border-bottom: 2px solid rgba(245,199,107,.24) !important;
}

#playersTable td {
  background: #05060a !important;
  color: rgba(244,245,248,.86) !important;
}

#playersTable tbody tr:nth-child(even) td {
  background: #080910 !important;
}

#playersTable tbody tr:hover td {
  background: rgba(245,199,107,.075) !important;
}

#playersTable td[data-col="Player"] {
  background: #05060a !important;
}

#playersTable td[data-col="SCSL15_score"] {
  background: #080705 !important;
  color: var(--final-gold) !important;
}

/* ===== Mobile refinements ===== */

@media (max-width: 760px) {
  .broadcast-bar {
    height: 40px !important;
  }

  .broadcast-ticker {
    top: 40px !important;
  }

  .mobile-jump-nav {
    top: 71px !important;
    background: rgba(2,3,7,.96) !important;
    border-bottom-color: rgba(245,199,107,.12) !important;
  }

  .mobile-jump-nav a {
    background: #07080d !important;
    border-color: rgba(245,199,107,.18) !important;
  }

  .hero {
    padding: 24px 12px 20px !important;
  }

  .league-mark {
    width: 44px !important;
  }

  main {
    width: 100% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .broadcast-recap {
    width: 100% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .panel {
    padding: 16px !important;
    border-radius: 24px !important;
  }

  .panel::before {
    margin: -16px -16px 16px !important;
  }

  /* AI engine details compact when opened */
  .formula-grid {
    grid-template-columns: 1fr !important;
    gap: 7px !important;
  }

  .formula-card.formula-detail-card {
    grid-template-columns: 40px minmax(0, 1fr) auto !important;
    padding: 10px !important;
    border-radius: 15px !important;
  }

  .formula-card.formula-detail-card::after {
    width: 40px !important;
    height: 40px !important;
    border-radius: 14px !important;
  }

  .formula-card.formula-detail-card .formula-value {
    font-size: 14px !important;
  }

  .formula-detail-hint {
    font-size: 9px !important;
    padding: 4px 7px !important;
  }
}

/* accessibility */
@media (prefers-reduced-motion: reduce) {
  .formula-main::before,
  .ticker-track {
    animation: none !important;
  }
}

/* ===== assets/lb-database-cleanup.css ===== */
/* ===== LB DATABASE OVERLAP CLEANUP ===== */

/* Season column should not smash text into neighboring cells */
#playersTable th[data-key="Season"],
#playersTable td[data-col="Season"] {
  min-width: 88px !important;
  max-width: 96px !important;
  width: 90px !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* LB row should stay readable */
#playersTable tr.lb-legend-row td {
  vertical-align: middle !important;
}

#playersTable tr.lb-legend-row td[data-col="Season"] {
  color: #f5c76b !important;
  font-weight: 900 !important;
  background: #080705 !important;
}

/* Honors can wrap normally instead of visually colliding */
#playersTable tr.lb-legend-row td[data-col="Honors"] {
  white-space: normal !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
}

/* Mobile gets a little more breathing room for Season */
@media (max-width: 760px) {
  #playersTable th[data-key="Season"],
  #playersTable td[data-col="Season"] {
    min-width: 84px !important;
    max-width: 90px !important;
    width: 86px !important;
  }
}

/* ===== assets/hero-chip-polish.css ===== */
/* ===== HERO CHIPS: LABELS VS BUTTON ===== */

/* Non-clickable hero labels */
.hero-chips span {
  cursor: default !important;
  pointer-events: none !important;
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(245,199,107,.16) !important;
  color: rgba(220,224,238,.72) !important;
  box-shadow: none !important;
  opacity: .92;
}

/* Actual clickable music button */
.hero-chips button,
.music-btn {
  cursor: pointer !important;
  border: 1px solid rgba(245,199,107,.42) !important;
  background:
    linear-gradient(180deg, rgba(245,199,107,.18), rgba(255,255,255,.055)) !important;
  color: rgba(247,247,251,.95) !important;
  box-shadow:
    0 10px 28px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.hero-chips button:hover,
.music-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(245,199,107,.65) !important;
  background:
    linear-gradient(180deg, rgba(245,199,107,.28), rgba(255,255,255,.07)) !important;
}

.music-btn.playing {
  color: #111 !important;
  background: linear-gradient(180deg, #f5c76b, #b9892f) !important;
}

/* ===== assets/hero-chip-final-fix.css ===== */
/* ===== HERO CHIPS FINAL FIX ===== */
/* Metadata should look like labels. Only music should look like a button. */

.hero-chips {
  gap: 14px !important;
  align-items: center !important;
}

.hero-chips span {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  cursor: default !important;
  pointer-events: none !important;

  color: rgba(168,175,191,.82) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
}

.hero-chips span:not(:first-child)::before {
  content: "•";
  color: rgba(245,199,107,.55);
  margin-right: 14px;
}

/* Only Legacy Music should read as a clickable button */
.hero-chips button,
.music-btn {
  border-radius: 999px !important;
  padding: 9px 14px !important;
  border: 1px solid rgba(245,199,107,.45) !important;
  background:
    linear-gradient(180deg, rgba(245,199,107,.18), rgba(255,255,255,.055)) !important;
  color: rgba(247,247,251,.95) !important;
  cursor: pointer !important;
  box-shadow:
    0 10px 28px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
}

@media (max-width: 760px) {
  .hero-chips {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 8px 12px !important;
  }

  .hero-chips span {
    font-size: 10.5px !important;
  }

  .hero-chips span:not(:first-child)::before {
    margin-right: 10px;
  }

  .hero-chips button,
  .music-btn {
    margin-top: 2px !important;
  }
}

/* ===== assets/top15-team-display.css ===== */
/* ===== TOP 15 TEAM COLOR ACCENTS — PREMIUM SPLIT TEAM VERSION ===== */

[data-scsl-team-theme] {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;

  border-color: rgba(var(--scsl-team-rgb), .34) !important;
  box-shadow:
    0 18px 48px rgba(0,0,0,.44),
    0 0 0 1px rgba(var(--scsl-team-rgb), .13),
    0 0 24px rgba(var(--scsl-team-rgb), .12),
    inset 0 1px 0 rgba(255,255,255,.07) !important;

  animation: scslTeamCardBreath 4.8s ease-in-out infinite !important;
}

[data-scsl-team-theme] > *:not(.top15-team-wash) {
  position: relative !important;
  z-index: 2 !important;
}

.top15-team-wash {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;

  background:
    radial-gradient(circle at 88% 0%, rgba(var(--scsl-team-rgb), .28), transparent 35%),
    radial-gradient(circle at 0% 14%, rgba(var(--scsl-team-rgb2), .18), transparent 34%),
    linear-gradient(135deg, rgba(var(--scsl-team-rgb), .08), transparent 46%) !important;

  opacity: .86 !important;
  animation: scslTeamGlowDrift 6.5s ease-in-out infinite alternate !important;
}

/* Multi-team cards: true left/right split aura */
[data-scsl-split-team="true"] .top15-team-wash {
  background:
    linear-gradient(
      90deg,
      rgba(var(--scsl-team1-rgb), .20) 0%,
      rgba(var(--scsl-team1-rgb), .105) 44%,
      rgba(245,199,107,.055) 50%,
      rgba(var(--scsl-team2-rgb), .105) 56%,
      rgba(var(--scsl-team2-rgb), .20) 100%
    ),
    radial-gradient(circle at 12% 5%, rgba(var(--scsl-team1-rgb), .34), transparent 34%),
    radial-gradient(circle at 88% 5%, rgba(var(--scsl-team2-rgb), .34), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.035), transparent 52%) !important;
}

/* Animated top accent line */
[data-scsl-team-theme]::after {
  content: "" !important;
  position: absolute !important;
  left: -35% !important;
  right: -35% !important;
  top: 0 !important;
  height: 3px !important;
  z-index: 3 !important;
  pointer-events: none !important;

  background: linear-gradient(
    90deg,
    transparent,
    rgba(var(--scsl-team-rgb), .18),
    var(--scsl-team-primary),
    var(--scsl-team-secondary),
    rgba(var(--scsl-team-rgb), .18),
    transparent
  ) !important;

  opacity: .95 !important;
  animation: scslTeamLightSweep 4.2s ease-in-out infinite !important;
}

/* Multi-team top line: hard split */
[data-scsl-split-team="true"]::after {
  left: 0 !important;
  right: 0 !important;
  background: linear-gradient(
    90deg,
    var(--scsl-team1-primary) 0%,
    var(--scsl-team1-primary) 47%,
    rgba(245,199,107,.92) 50%,
    var(--scsl-team2-primary) 53%,
    var(--scsl-team2-primary) 100%
  ) !important;
  animation: scslSplitLinePulse 3.8s ease-in-out infinite !important;
}

/* premium animated edge glow */
[data-scsl-team-theme]::before {
  content: "" !important;
  position: absolute !important;
  inset: -1px !important;
  z-index: 1 !important;
  pointer-events: none !important;
  border-radius: inherit !important;

  background:
    linear-gradient(120deg,
      transparent 0%,
      rgba(var(--scsl-team-rgb), .00) 28%,
      rgba(var(--scsl-team-rgb), .18) 46%,
      rgba(var(--scsl-team-rgb2), .16) 54%,
      rgba(var(--scsl-team-rgb), .00) 72%,
      transparent 100%
    ) !important;

  opacity: .52 !important;
  mix-blend-mode: screen !important;
  animation: scslTeamAuraSweep 7s ease-in-out infinite !important;
}

/* Multi-team moving glow sweeps across both halves */
[data-scsl-split-team="true"]::before {
  background:
    linear-gradient(100deg,
      transparent 0%,
      rgba(var(--scsl-team1-rgb), .00) 26%,
      rgba(var(--scsl-team1-rgb), .22) 38%,
      rgba(245,199,107,.13) 50%,
      rgba(var(--scsl-team2-rgb), .22) 62%,
      rgba(var(--scsl-team2-rgb), .00) 74%,
      transparent 100%
    ) !important;
}

/* Clean team line */
.top15-team-line {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;

  margin: 2px 0 12px !important;
  padding: 0 !important;

  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  font-size: 11px !important;
  line-height: 1.3 !important;
  font-weight: 750 !important;
  letter-spacing: .025em !important;
  text-transform: none !important;
}

.top15-team-line::before {
  content: "" !important;
  width: 6px !important;
  height: 6px !important;
  flex: 0 0 6px !important;
  border-radius: 999px !important;

  background: linear-gradient(135deg, var(--scsl-team1-primary, var(--scsl-team-primary)), var(--scsl-team2-primary, var(--scsl-team-secondary))) !important;
  box-shadow:
    0 0 10px rgba(var(--scsl-team-rgb), .65),
    0 0 20px rgba(var(--scsl-team-rgb2), .32) !important;

  animation: scslTeamDotPulse 2.8s ease-in-out infinite !important;
}

.top15-team-label,
.top15-team-line span {
  color: rgba(245,199,107,.62) !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  letter-spacing: .11em !important;
  text-transform: uppercase !important;

  margin: 0 1px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Team names are colored, not the word TEAM */
.top15-team-name {
  color: var(--scsl-team-primary) !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: .035em !important;
  text-transform: none !important;

  text-shadow:
    0 0 10px rgba(var(--scsl-team-rgb), .42),
    0 0 22px rgba(var(--scsl-team-rgb), .18) !important;
}

.top15-team-name.team-1 {
  color: var(--scsl-team1-primary, var(--scsl-team-primary)) !important;
  text-shadow:
    0 0 10px rgba(var(--scsl-team1-rgb), .44),
    0 0 22px rgba(var(--scsl-team1-rgb), .18) !important;
}

.top15-team-name.team-2 {
  color: var(--scsl-team2-primary, var(--scsl-team-secondary)) !important;
  text-shadow:
    0 0 10px rgba(var(--scsl-team2-rgb), .44),
    0 0 22px rgba(var(--scsl-team2-rgb), .18) !important;
}

.top15-team-sep {
  color: rgba(245,199,107,.62) !important;
  font-style: normal !important;
  font-weight: 900 !important;
  margin: 0 -2px !important;
}

.top15-team-line::after {
  content: none !important;
  display: none !important;
}

@keyframes scslTeamCardBreath {
  0%, 100% {
    box-shadow:
      0 18px 48px rgba(0,0,0,.44),
      0 0 0 1px rgba(var(--scsl-team-rgb), .12),
      0 0 22px rgba(var(--scsl-team-rgb), .11),
      inset 0 1px 0 rgba(255,255,255,.07);
  }
  50% {
    box-shadow:
      0 20px 54px rgba(0,0,0,.48),
      0 0 0 1px rgba(var(--scsl-team-rgb), .24),
      0 0 36px rgba(var(--scsl-team-rgb), .20),
      inset 0 1px 0 rgba(255,255,255,.09);
  }
}

@keyframes scslTeamGlowDrift {
  0% {
    opacity: .70;
    transform: translate3d(-1.5%, -1%, 0) scale(1);
  }
  100% {
    opacity: .98;
    transform: translate3d(1.5%, 1%, 0) scale(1.035);
  }
}

@keyframes scslTeamLightSweep {
  0%, 100% {
    transform: translateX(-18%);
    opacity: .62;
  }
  50% {
    transform: translateX(18%);
    opacity: 1;
  }
}

@keyframes scslSplitLinePulse {
  0%, 100% {
    opacity: .70;
    filter: brightness(1);
  }
  50% {
    opacity: 1;
    filter: brightness(1.22);
  }
}

@keyframes scslTeamAuraSweep {
  0%, 45% {
    transform: translateX(-42%);
    opacity: .18;
  }
  58% {
    opacity: .55;
  }
  100% {
    transform: translateX(42%);
    opacity: .20;
  }
}

@keyframes scslTeamDotPulse {
  0%, 100% {
    transform: scale(1);
    opacity: .82;
  }
  50% {
    transform: scale(1.28);
    opacity: 1;
  }
}

@media (max-width: 760px) {
  .top15-team-line {
    font-size: 10px !important;
    margin: 1px 0 10px !important;
    gap: 7px !important;
  }

  .top15-team-label,
  .top15-team-line span {
    font-size: 8.5px !important;
  }

  .top15-team-name {
    font-size: 10px !important;
  }
}

/* ===== TOP 15 TEAM LABEL POLISH ===== */
/* Makes TEAM / TEAMS line feel designed instead of like loose text */

.top15-team-line {
  width: fit-content !important;
  max-width: 100% !important;

  margin: 7px 0 14px !important;
  padding: 5px 8px !important;

  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  flex-wrap: wrap !important;

  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)) !important;
  border: 1px solid rgba(245,199,107,.14) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 8px 22px rgba(0,0,0,.16) !important;
}

/* Smaller, cleaner status dot */
.top15-team-line::before {
  width: 4px !important;
  height: 4px !important;
  flex: 0 0 4px !important;
  opacity: .95 !important;
}

/* TEAM / TEAMS should be subtle, not the main attraction */
.top15-team-label,
.top15-team-line span {
  color: rgba(245,199,107,.68) !important;
  font-size: 8px !important;
  font-weight: 950 !important;
  letter-spacing: .13em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  margin-right: 1px !important;
}

/* Actual team names become premium micro-tags */
.top15-team-name {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;

  padding: 3px 7px 3px !important;
  border-radius: 999px !important;

  font-size: 9.5px !important;
  font-weight: 950 !important;
  letter-spacing: .045em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;

  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.025)) !important;
  border: 1px solid currentColor !important;
  box-shadow:
    0 0 14px rgba(var(--scsl-team-rgb), .16),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* Make each team use its own side of the split */
.top15-team-name.team-1 {
  color: var(--scsl-team1-primary, var(--scsl-team-primary)) !important;
  background:
    linear-gradient(180deg, rgba(var(--scsl-team1-rgb), .16), rgba(255,255,255,.025)) !important;
  text-shadow:
    0 0 10px rgba(var(--scsl-team1-rgb), .45),
    0 0 20px rgba(var(--scsl-team1-rgb), .18) !important;
}

.top15-team-name.team-2 {
  color: var(--scsl-team2-primary, var(--scsl-team-secondary)) !important;
  background:
    linear-gradient(180deg, rgba(var(--scsl-team2-rgb), .16), rgba(255,255,255,.025)) !important;
  text-shadow:
    0 0 10px rgba(var(--scsl-team2-rgb), .45),
    0 0 20px rgba(var(--scsl-team2-rgb), .18) !important;
}

/* Separator should feel intentional */
.top15-team-sep {
  color: rgba(245,199,107,.42) !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 950 !important;
  margin: 0 -2px !important;
  transform: translateY(-.5px);
}

@media (max-width: 760px) {
  .top15-team-line {
    margin: 6px 0 12px !important;
    padding: 5px 7px !important;
    gap: 6px !important;
  }

  .top15-team-label,
  .top15-team-line span {
    font-size: 7.5px !important;
  }

  .top15-team-name {
    font-size: 8.75px !important;
    padding: 3px 6px !important;
  }
}

/* ===== assets/universal-button-glass.css ===== */
/* ===== UNIVERSAL BUTTON GLASS EFFECT ===== */
/* Real buttons get glass. AI formula cards are excluded because their ::after is the icon. */

:where(
  button,
  [role="button"]:not(.formula-main):not(.formula-card),
  a.btn,
  a.button,
  .music-btn,
  .filter-btn,
  .jump-nav a,
  .mobile-jump a,
  .mobile-jump-nav a,
  .top15-toggle,
  .expand-toggle,
  .card-toggle,
  .view-toggle-btn,
  .db-chip
):not(.formula-main):not(.formula-card) {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;

  border: 1px solid rgba(245,199,107,.34) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.035) 42%, rgba(0,0,0,.18)),
    linear-gradient(135deg, rgba(245,199,107,.18), rgba(255,255,255,.035)) !important;

  box-shadow:
    0 10px 28px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(245,199,107,.10) !important;

  backdrop-filter: blur(16px) saturate(1.25) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.25) !important;

  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease !important;
}

:where(
  button,
  [role="button"]:not(.formula-main):not(.formula-card),
  a.btn,
  a.button,
  .music-btn,
  .filter-btn,
  .jump-nav a,
  .mobile-jump a,
  .mobile-jump-nav a,
  .top15-toggle,
  .expand-toggle,
  .card-toggle,
  .view-toggle-btn,
  .db-chip
):not(.formula-main):not(.formula-card)::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;

  background:
    linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.055) 32%, transparent 58%),
    linear-gradient(90deg, transparent, rgba(245,199,107,.10), transparent) !important;

  opacity: .78 !important;
}

:where(
  button,
  [role="button"]:not(.formula-main):not(.formula-card),
  a.btn,
  a.button,
  .music-btn,
  .filter-btn,
  .jump-nav a,
  .mobile-jump a,
  .mobile-jump-nav a,
  .top15-toggle,
  .expand-toggle,
  .card-toggle,
  .view-toggle-btn,
  .db-chip
):not(.formula-main):not(.formula-card)::after {
  content: "" !important;
  position: absolute !important;
  top: -60% !important;
  bottom: -60% !important;
  left: -42% !important;
  width: 26% !important;
  z-index: 2 !important;
  pointer-events: none !important;

  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.22),
    rgba(245,199,107,.20),
    transparent
  ) !important;

  transform: skewX(-22deg);
  animation: scslButtonGlassGlint 5.8s ease-in-out infinite;
  opacity: 0;
}

:where(
  button,
  [role="button"]:not(.formula-main):not(.formula-card),
  a.btn,
  a.button,
  .music-btn,
  .filter-btn,
  .jump-nav a,
  .mobile-jump a,
  .mobile-jump-nav a,
  .top15-toggle,
  .expand-toggle,
  .card-toggle,
  .view-toggle-btn,
  .db-chip
):not(.formula-main):not(.formula-card) > * {
  position: relative !important;
  z-index: 3 !important;
}

:where(
  button,
  [role="button"]:not(.formula-main):not(.formula-card),
  a.btn,
  a.button,
  .music-btn,
  .filter-btn,
  .jump-nav a,
  .mobile-jump a,
  .mobile-jump-nav a,
  .top15-toggle,
  .expand-toggle,
  .card-toggle,
  .view-toggle-btn,
  .db-chip
):not(.formula-main):not(.formula-card):hover {
  transform: translateY(-1px);
  border-color: rgba(245,199,107,.58) !important;
  box-shadow:
    0 14px 34px rgba(0,0,0,.34),
    0 0 22px rgba(245,199,107,.13),
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -1px 0 rgba(245,199,107,.15) !important;
}

:where(
  button.active,
  button.is-active,
  .active,
  .is-active,
  [aria-selected="true"],
  [aria-pressed="true"]
):not(.formula-main):not(.formula-card) {
  border-color: rgba(245,199,107,.68) !important;
  background:
    linear-gradient(180deg, rgba(245,199,107,.92), rgba(185,137,47,.86)) !important;
  color: #111 !important;
  box-shadow:
    0 12px 30px rgba(0,0,0,.32),
    0 0 24px rgba(245,199,107,.20),
    inset 0 1px 0 rgba(255,255,255,.34) !important;
}

@keyframes scslButtonGlassGlint {
  0%, 38% {
    transform: translateX(0) skewX(-22deg);
    opacity: 0;
  }
  48% {
    opacity: .9;
  }
  68%, 100% {
    transform: translateX(620%) skewX(-22deg);
    opacity: 0;
  }
}

/* ===== assets/desktop-team-placement-final.css ===== */
/* ===== DESKTOP TEAM PLACEMENT FINAL — NO STACKING ===== */

@media (min-width: 761px) {
  #top15Grid .card .top15-team-line {
    position: relative !important;
    z-index: 8 !important;

    display: inline-flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 5px !important;

    width: auto !important;
    max-width: none !important;

    margin: 5px 0 9px 0 !important;
    padding: 0 !important;

    white-space: nowrap !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  #top15Grid .card .top15-team-line::before {
    content: "" !important;
    width: 4px !important;
    height: 4px !important;
    flex: 0 0 4px !important;
    border-radius: 999px !important;

    background: linear-gradient(
      135deg,
      var(--scsl-team1-primary, var(--scsl-team-primary)),
      var(--scsl-team2-primary, var(--scsl-team-secondary))
    ) !important;

    box-shadow:
      0 0 8px rgba(var(--scsl-team-rgb), .42),
      0 0 14px rgba(var(--scsl-team-rgb2), .20) !important;
  }

  #top15Grid .card .top15-team-label,
  #top15Grid .card .top15-team-line span {
    display: inline-block !important;
    color: rgba(245,199,107,.64) !important;
    font-size: 7.5px !important;
    font-weight: 950 !important;
    letter-spacing: .13em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    margin-right: 2px !important;
    white-space: nowrap !important;
  }

  #top15Grid .card .top15-team-name {
    display: inline-block !important;

    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    font-size: 8px !important;
    font-weight: 950 !important;
    letter-spacing: .055em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }

  #top15Grid .card .top15-team-name.team-1 {
    color: var(--scsl-team1-primary, var(--scsl-team-primary)) !important;
    text-shadow: 0 0 10px rgba(var(--scsl-team1-rgb), .32) !important;
  }

  #top15Grid .card .top15-team-name.team-2 {
    color: var(--scsl-team2-primary, var(--scsl-team-secondary)) !important;
    text-shadow: 0 0 10px rgba(var(--scsl-team2-rgb), .32) !important;
  }

  #top15Grid .card .top15-team-sep {
    display: inline-block !important;
    color: rgba(245,199,107,.38) !important;
    font-size: 8px !important;
    font-style: normal !important;
    font-weight: 950 !important;
    margin: 0 -1px !important;
    white-space: nowrap !important;
  }
}

/* ===== assets/mobile-top15-card-final.css ===== */
/* ===== MOBILE TOP 15 CARD FINAL POLISH ===== */

@media (max-width: 760px) {
  #top15Grid .card {
    position: relative !important;
    display: grid !important;

    grid-template-columns: 74px minmax(0, 1fr) 82px !important;
    grid-template-rows: auto auto auto auto !important;
    column-gap: 10px !important;
    row-gap: 9px !important;

    padding: 24px 18px 18px !important;
    min-height: 0 !important;
  }

  #top15Grid .card .rank {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;

    position: relative !important;
    inset: auto !important;
    transform: none !important;

    align-self: start !important;
    justify-self: center !important;

    margin: 2px 0 0 !important;
    z-index: 5 !important;
  }

  #top15Grid .card .player {
    grid-column: 2 !important;
    grid-row: 1 !important;

    position: relative !important;
    inset: auto !important;
    transform: none !important;

    align-self: end !important;
    justify-self: stretch !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    text-align: left !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;

    font-size: clamp(25px, 7vw, 34px) !important;
    line-height: 1.02 !important;
    letter-spacing: .045em !important;

    z-index: 5 !important;
  }

  #top15Grid .card .mobile-card-score {
    grid-column: 3 !important;
    grid-row: 1 !important;

    position: relative !important;
    inset: auto !important;
    transform: none !important;

    align-self: start !important;
    justify-self: end !important;

    margin: 0 !important;
    text-align: right !important;
    z-index: 5 !important;
  }

  #top15Grid .card .quick-stats,
  #top15Grid .card .stats,
  #top15Grid .card .pills,
  #top15Grid .card .mobile-stats {
    grid-column: 2 / 4 !important;
    grid-row: 2 !important;

    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 7px !important;

    margin: 0 !important;
    padding: 0 !important;
    min-width: 0 !important;
    z-index: 5 !important;
  }

  #top15Grid .card .top15-toggle,
  #top15Grid .card .expand-toggle,
  #top15Grid .card .card-toggle {
    grid-column: 1 / 4 !important;
    grid-row: 3 !important;

    margin: 5px 0 0 !important;
    min-height: 46px !important;
    z-index: 5 !important;
  }

  #top15Grid .card .top15-team-line {
    grid-column: 2 / 4 !important;
    grid-row: 4 !important;

    width: auto !important;
    max-width: 100% !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-self: start !important;
    flex-wrap: nowrap !important;
    gap: 5px !important;

    margin: -1px 0 0 !important;
    padding: 0 !important;

    white-space: nowrap !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    z-index: 5 !important;
  }

  #top15Grid .card .top15-team-line::before {
    width: 4px !important;
    height: 4px !important;
    flex: 0 0 4px !important;
  }

  #top15Grid .card .top15-team-label,
  #top15Grid .card .top15-team-line span {
    font-size: 7px !important;
    letter-spacing: .13em !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  #top15Grid .card .top15-team-name {
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    font-size: 8px !important;
    font-weight: 950 !important;
    letter-spacing: .055em !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  #top15Grid .card .top15-team-sep {
    font-size: 8px !important;
    margin: 0 -1px !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 390px) {
  #top15Grid .card {
    grid-template-columns: 68px minmax(0, 1fr) 76px !important;
    column-gap: 8px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  #top15Grid .card .player {
    font-size: clamp(22px, 6.5vw, 30px) !important;
  }

  #top15Grid .card .top15-team-name {
    font-size: 7.5px !important;
  }
}

/* ===== MOBILE TOP 15 LEFT ALIGNMENT TUNE ===== */
/* Pulls player name, stats, and team row left so cards feel less centered. */

@media (max-width: 760px) {
  #top15Grid .card {
    grid-template-columns: 58px minmax(0, 1fr) 78px !important;
    column-gap: 10px !important;
  }

  #top15Grid .card .rank {
    justify-self: start !important;
    margin-left: 2px !important;
  }

  #top15Grid .card .player {
    grid-column: 2 / 3 !important;
    justify-self: start !important;
    text-align: left !important;
    max-width: 100% !important;
  }

  #top15Grid .card .quick-stats,
  #top15Grid .card .stats,
  #top15Grid .card .pills,
  #top15Grid .card .mobile-stats {
    grid-column: 2 / 4 !important;
    justify-content: flex-start !important;
    padding-left: 0 !important;
  }

  #top15Grid .card .top15-team-line {
    grid-column: 2 / 4 !important;
    justify-self: start !important;
    margin-left: 0 !important;
  }

  #top15Grid .card .mobile-card-score {
    justify-self: end !important;
  }
}

@media (max-width: 390px) {
  #top15Grid .card {
    grid-template-columns: 54px minmax(0, 1fr) 74px !important;
    column-gap: 9px !important;
  }
}

/* ===== assets/no-icon-motion-final.css ===== */
/* ===== AI ENGINE ICON LOCK ===== */
/* Icons stay still. Glass animations around them can still move. */

/* Big AI-LegacyScore shield icon */
#formula .formula-main::after,
.formula-panel .formula-main::after {
  content: "" !important;
  position: absolute !important;
  left: 34px !important;
  right: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;

  width: 112px !important;
  height: 112px !important;
  z-index: 4 !important;

  background: url("ai-legacyscore-shield-gold-match-clean-v3.png") center / contain no-repeat !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter:
    drop-shadow(0 0 18px rgba(245,199,107,.26))
    drop-shadow(0 16px 28px rgba(0,0,0,.38)) !important;

  animation: none !important;
}

/* Formula card icons */
#formula .formula-card.formula-detail-card::after,
.formula-panel .formula-card.formula-detail-card::after,
#formula .formula-card::after,
.formula-panel .formula-card::after {
  content: "" !important;
  grid-area: icon !important;
  position: static !important;

  display: block !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  margin: 0 !important;

  border-radius: 15px !important;
  border: 1px solid rgba(245,199,107,.34) !important;

  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 24px 24px, auto !important;
  background-color: rgba(0,0,0,.24) !important;

  box-shadow:
    0 0 18px rgba(245,199,107,.12),
    0 10px 24px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.13) !important;

  animation: none !important;
  transform: none !important;
}

#formula .formula-card:nth-child(1)::after,
.formula-panel .formula-card:nth-child(1)::after {
  background-image: url("icons/impact.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important;
}

#formula .formula-card:nth-child(2)::after,
.formula-panel .formula-card:nth-child(2)::after {
  background-image: url("icons/longevity.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important;
}

#formula .formula-card:nth-child(3)::after,
.formula-panel .formula-card:nth-child(3)::after {
  background-image: url("icons/award.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important;
}

#formula .formula-card:nth-child(4)::after,
.formula-panel .formula-card:nth-child(4)::after {
  background-image: url("icons/legacy.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important;
}

#formula .formula-card:nth-child(5)::after,
.formula-panel .formula-card:nth-child(5)::after {
  background-image: url("icons/eligibility.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important;
}

#formula .formula-card:nth-child(6)::after,
.formula-panel .formula-card:nth-child(6)::after {
  background-image: url("icons/ranking.svg"), linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important;
}

/* Let glass reflection live on ::before for the big AI button only */
#formula .formula-main::before,
.formula-panel .formula-main::before {
  animation: bigGlassButtonDrift 5.8s cubic-bezier(.45,0,.2,1) infinite alternate !important;
}

/* Mobile sizes */
@media (max-width: 760px) {
  #formula .formula-main::after,
  .formula-panel .formula-main::after {
    left: 18px !important;
    width: 72px !important;
    height: 72px !important;
  }

  #formula .formula-card.formula-detail-card::after,
  .formula-panel .formula-card.formula-detail-card::after,
  #formula .formula-card::after,
  .formula-panel .formula-card::after {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    border-radius: 14px !important;
    background-size: 23px 23px, auto !important;
  }
}

/* ===== assets/final-interaction-polish.css ===== */
/* ===== FINAL INTERACTION POLISH ===== */
/* Actual active classes: .mobile-expand-hint, .music-btn, #top15Grid .rank */

/* Tap For More box: premium glass reflection */
@media (max-width: 760px) {
  #top15 .mobile-expand-hint {
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;

    border: 1px solid rgba(245,199,107,.36) !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.035) 45%, rgba(0,0,0,.18)),
      linear-gradient(135deg, rgba(245,199,107,.20), rgba(255,255,255,.04)) !important;

    box-shadow:
      0 10px 24px rgba(0,0,0,.28),
      inset 0 1px 0 rgba(255,255,255,.18),
      inset 0 -1px 0 rgba(245,199,107,.12) !important;

    backdrop-filter: blur(16px) saturate(1.22) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.22) !important;
  }

  #top15 .mobile-expand-hint::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    pointer-events: none !important;

    background:
      linear-gradient(180deg, rgba(255,255,255,.23), rgba(255,255,255,.06) 34%, transparent 60%),
      linear-gradient(90deg, transparent, rgba(245,199,107,.10), transparent) !important;

    opacity: .78 !important;
  }

  #top15 .mobile-expand-hint::after {
    content: "" !important;
    position: absolute !important;
    top: -65% !important;
    bottom: -65% !important;
    left: -42% !important;
    width: 28% !important;
    z-index: 2 !important;
    pointer-events: none !important;

    background: linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.24),
      rgba(245,199,107,.20),
      transparent
    ) !important;

    transform: skewX(-22deg);
    animation: scslFinalGlassSweep 6.2s ease-in-out infinite !important;
    opacity: 0;
  }

  #top15 .mobile-expand-hint > * {
    position: relative !important;
    z-index: 3 !important;
  }

  #top15 .card.expanded .mobile-expand-hint {
    color: rgba(255,255,255,.94) !important;
    background:
      linear-gradient(180deg, rgba(245,199,107,.28), rgba(185,137,47,.18)),
      linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.035)) !important;
    border-color: rgba(245,199,107,.58) !important;
  }

  #top15 .card.expanded .hint-arrow {
    color: rgba(255,255,255,.94) !important;
    background: rgba(0,0,0,.22) !important;
  }
}

/* Legacy Music button color fix */
#musicToggle.music-btn,
.music-btn {
  color: rgba(255,255,255,.95) !important;
  text-shadow:
    0 0 10px rgba(245,199,107,.20),
    0 8px 18px rgba(0,0,0,.35) !important;

  border-color: rgba(245,199,107,.45) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.035) 42%, rgba(0,0,0,.22)),
    linear-gradient(135deg, rgba(245,199,107,.20), rgba(255,255,255,.04)) !important;

  box-shadow:
    0 10px 28px rgba(0,0,0,.30),
    0 0 20px rgba(245,199,107,.10),
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(245,199,107,.12) !important;
}

#musicToggle.music-btn.playing,
.music-btn.playing {
  color: #fff !important;
  border-color: rgba(245,199,107,.72) !important;
  background:
    linear-gradient(180deg, rgba(245,199,107,.34), rgba(185,137,47,.18)),
    linear-gradient(135deg, rgba(255,255,255,.13), rgba(255,255,255,.035)) !important;

  box-shadow:
    0 12px 32px rgba(0,0,0,.34),
    0 0 28px rgba(245,199,107,.22),
    inset 0 1px 0 rgba(255,255,255,.22) !important;
}

/* #1 / #2 / #3 rank boxes: premium animated medal glow */
#top15Grid .card:nth-child(-n+3) .rank {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  animation: scslMedalBreath 4.8s ease-in-out infinite !important;
}

#top15Grid .card:nth-child(-n+3) .rank::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;

  background:
    linear-gradient(180deg, rgba(255,255,255,.34), rgba(255,255,255,.08) 42%, transparent 65%),
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.28), transparent 55%) !important;

  opacity: .72 !important;
}

#top15Grid .card:nth-child(-n+3) .rank::after {
  content: "" !important;
  position: absolute !important;
  top: -70% !important;
  bottom: -70% !important;
  left: -55% !important;
  width: 34% !important;
  z-index: 2 !important;
  pointer-events: none !important;

  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.38),
    rgba(245,199,107,.26),
    transparent
  ) !important;

  transform: skewX(-22deg);
  animation: scslMedalSweep 5.6s ease-in-out infinite !important;
  opacity: 0;
}

#top15Grid .card:nth-child(-n+3) .rank {
  text-shadow:
    0 1px 0 rgba(255,255,255,.22),
    0 0 12px rgba(255,255,255,.18) !important;
}

/* Different rhythm so 1/2/3 don't sweep at the exact same time */
#top15Grid .card:nth-child(2) .rank::after {
  animation-delay: .75s !important;
}

#top15Grid .card:nth-child(3) .rank::after {
  animation-delay: 1.35s !important;
}

@keyframes scslFinalGlassSweep {
  0%, 38% {
    transform: translateX(0) skewX(-22deg);
    opacity: 0;
  }
  50% {
    opacity: .9;
  }
  72%, 100% {
    transform: translateX(620%) skewX(-22deg);
    opacity: 0;
  }
}

@keyframes scslMedalSweep {
  0%, 42% {
    transform: translateX(0) skewX(-22deg);
    opacity: 0;
  }
  52% {
    opacity: .9;
  }
  76%, 100% {
    transform: translateX(520%) skewX(-22deg);
    opacity: 0;
  }
}

@keyframes scslMedalBreath {
  0%, 100% {
    filter: brightness(1) saturate(1);
  }
  50% {
    filter: brightness(1.12) saturate(1.12);
  }
}

/* ===== assets/final-cleanup-polish.css ===== */
/* ===== FINAL CLEANUP POLISH ===== */

/* Fix intro buttons: universal glass was washing out Enter With Music */
#musicIntro .intro-primary,
#musicIntro .intro-secondary {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  z-index: 5 !important;
  opacity: 1 !important;
}

#musicIntro .intro-primary::before,
#musicIntro .intro-primary::after,
#musicIntro .intro-secondary::before,
#musicIntro .intro-secondary::after {
  display: none !important;
  content: none !important;
}

#musicIntro .intro-primary {
  color: #12100a !important;
  -webkit-text-fill-color: #12100a !important;
  background: linear-gradient(180deg, #ffe28a, #d59b35 58%, #a8721e) !important;
  border: 1px solid rgba(255,235,160,.70) !important;
  box-shadow:
    0 12px 30px rgba(0,0,0,.34),
    0 0 28px rgba(245,199,107,.20),
    inset 0 1px 0 rgba(255,255,255,.42) !important;
}

#musicIntro .intro-secondary {
  color: rgba(255,255,255,.92) !important;
  -webkit-text-fill-color: rgba(255,255,255,.92) !important;
  background: rgba(255,255,255,.075) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
}

/* Remove unnecessary outer Legacy Report box */
#top15Grid .card .legacy-details {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#top15Grid .card .legacy-details::before,
#top15Grid .card .legacy-details::after {
  display: none !important;
  content: none !important;
}

/* Keep player name glass compact, not a giant bar */
#top15Grid .card .player {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;

  width: max-content !important;
  max-width: min(100%, 340px) !important;

  padding: 4px 9px 5px !important;
  border-radius: 11px !important;
}

@media (max-width: 760px) {
  #top15Grid .card .player {
    width: max-content !important;
    max-width: 100% !important;
    padding: 3px 7px 4px !important;
    border-radius: 10px !important;
  }
}

/* ===== assets/font-consistency-final.css ===== */
/* ===== SCSL15 FONT CONSISTENCY FINAL ===== */
/* Final type hierarchy:
   Display: Bebas Neue
   Stats/UI: Rajdhani
   Body: Inter
*/

:root {
  --font-body: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Bebas Neue", Impact, "Arial Narrow", sans-serif;
  --font-stat: "Rajdhani", "Inter", ui-sans-serif, system-ui, sans-serif;
}

/* Body/readable copy */
body,
p,
.copy,
.subcopy,
.description,
.legacy-copy,
#top15Grid .card p,
#top15Grid .card .legacy-details p,
#top15Grid .card .legacy-summary,
#formula p,
#database p {
  font-family: var(--font-body) !important;
  font-weight: 500;
  letter-spacing: normal;
}

/* Big display titles */
h1,
h2,
h3,
.section-title,
.section-kicker,
.hero-title,
.logo-text,
#top15 h2,
#top15Grid .card .player,
#formula h2,
#database h2,
.stat-vault-title {
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  letter-spacing: .045em !important;
  line-height: .95 !important;
}

/* Stats / UI / buttons */
button,
[role="button"],
.music-btn,
.mobile-expand-hint,
.filter-btn,
.db-chip,
.pill,
.chip,
.badge,
.rank,
.score,
.mobile-card-score,
.legacy-score,
.ai-score,
.card-score,
.score-row,
.top15-team-line,
.top15-team-name,
.top15-team-label,
.ticker,
.ticker-wrap,
.leader-ticker,
.stat-ticker,
.table-wrap,
table,
th,
td,
input,
select {
  font-family: var(--font-stat) !important;
  font-weight: 800;
  letter-spacing: .055em;
}

/* Numeric/stat polish */
.score,
.mobile-card-score,
.legacy-score,
.ai-score,
.card-score,
.score-row strong,
.stat-value,
.kpi-value,
.pill,
.chip,
.rank,
table td,
table th {
  font-variant-numeric: tabular-nums !important;
}

/* Player names need display font but not cramped */
#top15Grid .card .player {
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  letter-spacing: .055em !important;
}

/* Top 15 body copy should not inherit stat font */
#top15Grid .card .legacy-details,
#top15Grid .card .legacy-details p,
#top15Grid .card .legacy-details .summary,
#top15Grid .card .legacy-report-copy {
  font-family: var(--font-body) !important;
  letter-spacing: normal !important;
}

/* But labels inside report stay stat-style */
#top15Grid .card .legacy-details .label,
#top15Grid .card .legacy-details small,
#top15Grid .card .score-row span,
#top15Grid .card .score-row label,
#top15Grid .card .score-row .score-label {
  font-family: var(--font-stat) !important;
  font-weight: 800 !important;
  letter-spacing: .075em !important;
  text-transform: uppercase;
}

/* Mobile tuning */
@media (max-width: 760px) {
  #top15Grid .card .player {
    letter-spacing: .04em !important;
    line-height: .98 !important;
  }

  .mobile-expand-hint,
  .pill,
  .chip,
  .top15-team-line,
  .top15-team-name,
  .ticker,
  .ticker-wrap {
    letter-spacing: .06em !important;
  }

  body,
  p,
  #top15Grid .card p {
    line-height: 1.45;
  }
}

/* ===== assets/site-polish-safe-final.css ===== */
/* intentionally empty compatibility file */

/* ===== assets/top15-match-ai-box-final.css ===== */
/* ===== TOP 15 MATCH AI-LEGACYSCORE BOX FINAL ===== */
/* Same family as the AI-LegacyScore™ panel: dark glass, gold reflection, controlled motion. */

/* Restore stable full-width Top 15 layout */
#top15Grid {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#top15Grid::before,
#top15Grid::after {
  display: none !important;
  content: none !important;
}

#top15Grid .card,
#top15Grid .card:nth-child(1),
#top15Grid .card:nth-child(2),
#top15Grid .card:nth-child(3),
#top15Grid .card:nth-child(n+4) {
  width: 100% !important;
  max-width: 100% !important;
  min-height: unset !important;
  grid-column: auto !important;
  box-sizing: border-box !important;
}

/* The actual player card now matches the AI-LegacyScore box */
#top15Grid .card[data-scsl-team-theme] {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;

  border-radius: 22px !important;
  border: 1px solid rgba(245,199,107,.32) !important;

  background:
    radial-gradient(circle at 84% 12%, rgba(245,199,107,.18), transparent 34%),
    radial-gradient(circle at 16% 18%, rgba(var(--scsl-team-rgb), .11), transparent 36%),
    radial-gradient(circle at 88% 82%, rgba(var(--scsl-team-rgb2), .08), transparent 38%),
    linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.020)),
    rgba(6,8,18,.94) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(245,199,107,.10),
    inset 0 0 58px rgba(255,255,255,.026),
    0 24px 66px rgba(0,0,0,.56),
    0 0 28px rgba(245,199,107,.09),
    0 0 24px rgba(var(--scsl-team-rgb), .07) !important;

  backdrop-filter: blur(18px) saturate(1.18) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.18) !important;

  animation: scslAiBoxPlateBreath 6.8s ease-in-out infinite alternate !important;
}

/* Team color becomes restrained, not the main paint */
#top15Grid .card[data-scsl-team-theme] .top15-team-wash {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;

  opacity: .34 !important;
  background:
    radial-gradient(circle at 0% 12%, rgba(var(--scsl-team1-rgb), .18), transparent 34%),
    radial-gradient(circle at 100% 14%, rgba(var(--scsl-team2-rgb), .14), transparent 36%),
    linear-gradient(
      105deg,
      rgba(var(--scsl-team1-rgb), .040) 0%,
      transparent 40%,
      rgba(245,199,107,.020) 50%,
      transparent 60%,
      rgba(var(--scsl-team2-rgb), .040) 100%
    ) !important;

  filter: saturate(.82) brightness(.76) !important;
  animation: scslAiBoxSubtleAura 7.8s ease-in-out infinite alternate !important;
}

/* Same style of broad reflective sheet as the AI box */
#top15Grid .card[data-scsl-team-theme]::before {
  content: "" !important;
  position: absolute !important;
  inset: -42% !important;
  z-index: 3 !important;
  pointer-events: none !important;

  background:
    linear-gradient(
      112deg,
      transparent 0%,
      transparent 16%,
      rgba(255,255,255,.040) 25%,
      rgba(255,255,255,.145) 34%,
      rgba(245,199,107,.210) 42%,
      rgba(255,255,255,.105) 50%,
      rgba(var(--scsl-team-rgb), .060) 58%,
      transparent 70%,
      transparent 100%
    ),
    linear-gradient(
      25deg,
      transparent 0%,
      rgba(255,255,255,.026) 35%,
      rgba(255,255,255,.078) 50%,
      rgba(245,199,107,.040) 60%,
      transparent 74%
    ) !important;

  mix-blend-mode: screen !important;
  opacity: .62 !important;
  transform: translateX(-42%) skewX(-7deg);
  animation: scslAiBoxReflectionDrift 6.2s cubic-bezier(.45,0,.2,1) infinite alternate !important;
}

/* Smaller controlled glint, like the AI button, not a flashlight */
#top15Grid .card[data-scsl-team-theme]::after {
  content: "" !important;
  position: absolute !important;
  top: -65% !important;
  bottom: -65% !important;
  left: -45% !important;
  width: 24% !important;
  z-index: 4 !important;
  pointer-events: none !important;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.18),
      rgba(245,199,107,.16),
      rgba(var(--scsl-team-rgb), .08),
      transparent
    ) !important;

  transform: skewX(-22deg);
  opacity: 0;
  animation: scslAiBoxGlint 7.2s ease-in-out infinite !important;
}

/* Keep content above motion */
#top15Grid .card > *:not(.top15-team-wash) {
  position: relative !important;
  z-index: 6 !important;
}

/* Player name stays sharp and clean */
#top15Grid .card .player {
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;

  color: rgba(255,255,255,.98) !important;
  -webkit-text-fill-color: rgba(255,255,255,.98) !important;

  text-shadow:
    0 0 8px rgba(255,255,255,.14),
    0 0 14px rgba(245,199,107,.08),
    0 8px 20px rgba(0,0,0,.62) !important;

  animation: none !important;
}

#top15Grid .card .player::before,
#top15Grid .card .player::after {
  display: none !important;
  content: none !important;
}

/* Rank boxes: stronger Hall of Fame medal styling */
#top15Grid .card .rank {
  font-family: var(--font-display, "Bebas Neue", Impact, sans-serif) !important;
  font-weight: 400 !important;
  font-size: 19px !important;
  letter-spacing: .02em !important;
  line-height: 1 !important;

  min-width: 48px !important;
  min-height: 44px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 14px !important;

  text-shadow:
    0 1px 0 rgba(255,255,255,.26),
    0 0 10px rgba(0,0,0,.30) !important;

  box-shadow:
    0 14px 32px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.38),
    inset 0 -1px 0 rgba(0,0,0,.20) !important;
}

#top15Grid .card:nth-child(-n+3) .rank {
  animation: scslAiBoxMedalPulse 4.2s ease-in-out infinite alternate !important;
}

/* Final score box uses same restrained AI panel language */
#top15Grid .card .legacy-details {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#top15Grid .card .legacy-details .score-row.total {
  border-color: rgba(245,199,107,.38) !important;

  background:
    radial-gradient(circle at 75% 12%, rgba(245,199,107,.12), transparent 35%),
    linear-gradient(180deg, rgba(255,255,255,.060), rgba(255,255,255,.015) 48%, rgba(0,0,0,.16)),
    rgba(8,10,17,.80) !important;
}

/* Keyframes */
@keyframes scslAiBoxPlateBreath {
  0% {
    filter: brightness(.965) saturate(.96);
    border-color: rgba(245,199,107,.24);
  }

  100% {
    filter: brightness(1.045) saturate(1.08);
    border-color: rgba(245,199,107,.44);
  }
}

@keyframes scslAiBoxSubtleAura {
  0% {
    transform: translate3d(-.7%, -.4%, 0) scale(1);
    opacity: .25;
  }

  100% {
    transform: translate3d(.7%, .4%, 0) scale(1.014);
    opacity: .42;
  }
}

@keyframes scslAiBoxReflectionDrift {
  0% {
    transform: translateX(-42%) skewX(-7deg);
    opacity: .34;
  }

  100% {
    transform: translateX(18%) skewX(-7deg);
    opacity: .64;
  }
}

@keyframes scslAiBoxGlint {
  0%, 42% {
    transform: translateX(0) skewX(-22deg);
    opacity: 0;
  }

  54% {
    opacity: .72;
  }

  76%, 100% {
    transform: translateX(650%) skewX(-22deg);
    opacity: 0;
  }
}

@keyframes scslAiBoxMedalPulse {
  0% {
    filter: brightness(1) saturate(1);
  }

  100% {
    filter: brightness(1.12) saturate(1.08);
  }
}

@media (max-width: 760px) {
  #top15Grid .card .rank {
    font-size: 18px !important;
    min-width: 50px !important;
    min-height: 48px !important;
    border-radius: 14px !important;
  }

  #top15Grid .card[data-scsl-team-theme]::before {
    animation-duration: 7.4s !important;
  }

  #top15Grid .card[data-scsl-team-theme]::after {
    animation-duration: 8.2s !important;
  }
}

/* ===== assets/top15-ai-reflection-max-final.css ===== */
/* ===== TOP 15 EXACT AI-STYLE REFLECTION FINAL ===== */
/* Matches the AI-LegacyScore hero reflection behavior much more closely. */

#top15Grid .card[data-scsl-team-theme] {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
}

/* Same broad reflection sheet behavior as the AI-LegacyScore hero box */
#top15Grid .card[data-scsl-team-theme]::before {
  content: "" !important;
  position: absolute !important;
  inset: -38% !important;
  pointer-events: none !important;
  z-index: 4 !important;
  opacity: .88 !important;

  background:
    linear-gradient(
      112deg,
      transparent 0%,
      transparent 17%,
      rgba(255,255,255,.045) 25%,
      rgba(255,255,255,.18) 34%,
      rgba(245,199,107,.26) 42%,
      rgba(255,255,255,.14) 50%,
      rgba(var(--scsl-team-rgb), .10) 56%,
      transparent 68%,
      transparent 100%
    ),
    linear-gradient(
      25deg,
      transparent 0%,
      rgba(255,255,255,.035) 35%,
      rgba(255,255,255,.10) 50%,
      rgba(245,199,107,.070) 60%,
      transparent 73%
    ) !important;

  mix-blend-mode: screen !important;
  animation: scslTop15ExactAIDrift 5.8s cubic-bezier(.45,0,.2,1) infinite alternate !important;
}

/* Extra visible hero-button glint across the full plate */
#top15Grid .card[data-scsl-team-theme]::after {
  content: "" !important;
  position: absolute !important;
  top: -70% !important;
  bottom: -70% !important;
  left: -46% !important;
  width: 34% !important;
  z-index: 5 !important;
  pointer-events: none !important;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.30),
      rgba(245,199,107,.25),
      rgba(var(--scsl-team-rgb), .16),
      rgba(255,255,255,.12),
      transparent
    ) !important;

  transform: skewX(-22deg);
  opacity: 0;
  animation: scslTop15ExactAIGlint 5.8s ease-in-out infinite !important;
}

/* Keep content above the reflection */
#top15Grid .card > *:not(.top15-team-wash) {
  position: relative !important;
  z-index: 8 !important;
}

#top15Grid .card[data-scsl-team-theme] .top15-team-wash {
  z-index: 1 !important;
  opacity: .36 !important;
}

/* Same movement range as the AI-LegacyScore hero button */
@keyframes scslTop15ExactAIDrift {
  from {
    transform: translateX(-38%) skewX(-7deg);
    opacity: .64;
  }

  to {
    transform: translateX(38%) skewX(-7deg);
    opacity: .96;
  }
}

@keyframes scslTop15ExactAIGlint {
  0%, 34% {
    transform: translateX(0) skewX(-22deg);
    opacity: 0;
  }

  48% {
    opacity: .95;
  }

  74%, 100% {
    transform: translateX(690%) skewX(-22deg);
    opacity: 0;
  }
}

@media (max-width: 760px) {
  #top15Grid .card[data-scsl-team-theme]::before {
    animation-duration: 6.6s !important;
  }

  #top15Grid .card[data-scsl-team-theme]::after {
    animation-duration: 6.2s !important;
  }
}

/* ===== assets/database-hero-bottom-polish.css ===== */
/* ===== DATABASE HERO BOTTOM POLISH ===== */

.database-hero-bottom {
  margin-top: 18px !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(245,199,107,.14) !important;
}

@media (max-width: 760px) {
  .database-hero-bottom {
    margin-top: 14px !important;
    padding-top: 14px !important;
  }
}

/* ===== assets/final-utility-fixes.css ===== */
/* ===== FINAL UTILITY FIXES ===== */

/* Stat Vault summary cards belong below the table */
.database-hero-bottom {
  margin-top: 18px !important;
  padding-top: 16px !important;
  border-top: 1px solid rgba(245,199,107,.14) !important;
}

/* Top AI-LegacyScore explainer */
.ai-context-note {
  max-width: 720px !important;
  margin: 14px auto 0 !important;
  padding: 11px 14px !important;

  color: rgba(226,230,240,.82) !important;
  font-family: var(--font-body, "Inter", sans-serif) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  text-align: center !important;

  border: 1px solid rgba(245,199,107,.18) !important;
  border-radius: 16px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.012)),
    rgba(0,0,0,.18) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 26px rgba(0,0,0,.18) !important;
}

/* Retired: arrow glyphs are owned by button-cleanup-final.css. */
#top15Grid .mobile-expand-hint .hint-arrow::before,
#top15Grid .mobile-expand-hint .hint-arrow::after {
  content: none !important;
}

@media (max-width: 760px) {
  .ai-context-note {
    font-size: 12px !important;
    text-align: left !important;
    margin-top: 12px !important;
  }

  .database-hero-bottom {
    margin-top: 14px !important;
    padding-top: 14px !important;
  }
}

/* ===== assets/rank-font-polish-final.css ===== */
/* ===== RANK BOX POLISH FINAL ===== */
/* #4-#15 are no longer red. Top 3 stay medal. Rest become graphite/platinum HOF plaques. */

/* General rank font improvement */
#top15Grid .card .rank {
  font-family: var(--font-display, "Bebas Neue", Impact, "Arial Narrow", sans-serif) !important;
  font-weight: 400 !important;
  letter-spacing: .025em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

/* #4-#15: graphite / platinum / gold, not red */
#top15Grid .card:nth-child(n+4) .rank {
  color: rgba(245,247,251,.94) !important;

  background:
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.18), transparent 52%),
    linear-gradient(180deg, rgba(255,255,255,.105), rgba(255,255,255,.030) 42%, rgba(0,0,0,.22)),
    linear-gradient(135deg, rgba(53,58,72,.98), rgba(11,13,20,.98)) !important;

  border: 1px solid rgba(245,199,107,.30) !important;

  box-shadow:
    0 12px 28px rgba(0,0,0,.34),
    0 0 18px rgba(245,199,107,.08),
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(245,199,107,.08) !important;

  text-shadow:
    0 1px 0 rgba(0,0,0,.65),
    0 0 10px rgba(255,255,255,.12) !important;
}

/* Slight hover lift on desktop only */
@media (hover: hover) {
  #top15Grid .card:nth-child(n+4):hover .rank {
    border-color: rgba(245,199,107,.46) !important;
    box-shadow:
      0 14px 32px rgba(0,0,0,.38),
      0 0 24px rgba(245,199,107,.13),
      inset 0 1px 0 rgba(255,255,255,.20) !important;
  }
}

/* Keep #1, #2, #3 medal hierarchy strong */
#top15Grid .card:nth-child(1) .rank,
#top15Grid .card:nth-child(2) .rank,
#top15Grid .card:nth-child(3) .rank {
  font-family: var(--font-display, "Bebas Neue", Impact, "Arial Narrow", sans-serif) !important;
  font-weight: 400 !important;
  letter-spacing: .025em !important;
}

/* ===== assets/site-type-spacing-polish-final.css ===== */
/* ===== SITE TYPE + SPACING POLISH FINAL ===== */
/* Keeps the site cohesive without redesigning everything. */

:root {
  --font-body: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Bebas Neue", Impact, "Arial Narrow", sans-serif;
  --font-stat: "Rajdhani", "Inter", ui-sans-serif, system-ui, sans-serif;
}

/* Headline/display hierarchy */
h1,
h2,
h3,
.hero-title,
.section-title,
#top15Grid .player,
.spotlight-name {
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  letter-spacing: .045em !important;
}

/* UI/stat hierarchy */
button,
[role="button"],
.pill,
.chip,
.badge,
.rank,
.score,
.mobile-card-score,
.score-row,
.ticker-track,
.ticker-label,
.top15-team-line,
.top15-team-name,
.db-chip,
table,
th,
td {
  font-family: var(--font-stat) !important;
  font-variant-numeric: tabular-nums !important;
}

/* Body copy readability */
body,
p,
.legacy-details,
.legacy-details p,
.formula-panel p,
.ai-context-note,
.recap-note,
.db-note {
  font-family: var(--font-body) !important;
}

/* Top 15 spacing polish */
#top15Grid .card {
  margin-bottom: 2px !important;
}

#top15Grid .legacy-details {
  line-height: 1.42 !important;
}

#top15Grid .score-row {
  letter-spacing: .045em !important;
}

/* Bottom recap should breathe and not feel duplicated */
.broadcast-recap-bottom {
  margin: 28px auto 18px !important;
  max-width: 1120px !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(245,199,107,.14) !important;
}

/* Remove any empty databaseHero spacing if an old CSS still targets it */
#databaseHero:empty {
  display: none !important;
}

@media (max-width: 760px) {
  #top15Grid .player {
    letter-spacing: .04em !important;
  }

  #top15Grid .card .rank {
    letter-spacing: .02em !important;
  }

  .broadcast-recap-bottom {
    margin-top: 20px !important;
  }
}

/* ===== assets/mobile-top15-card-motion-final.css ===== */
/* ===== MOBILE TOP 15 CARD MOTION FINAL ===== */
/* Mobile: full player plate gets motion. Tap For More stops stealing the show. */

@media (max-width: 760px) {
  #top15Grid .card[data-scsl-team-theme] {
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important;

    border: 1px solid rgba(245,199,107,.42) !important;

    background:
      radial-gradient(circle at 10% 8%, rgba(var(--scsl-team1-rgb), .24), transparent 34%),
      radial-gradient(circle at 92% 10%, rgba(var(--scsl-team2-rgb), .20), transparent 38%),
      linear-gradient(115deg, rgba(255,255,255,.055), rgba(255,255,255,.014)),
      linear-gradient(180deg, rgba(15,17,25,.99), rgba(4,6,12,.995)) !important;

    box-shadow:
      0 24px 66px rgba(0,0,0,.62),
      0 0 0 1px rgba(245,199,107,.12),
      0 0 28px rgba(245,199,107,.11),
      0 0 42px rgba(var(--scsl-team-rgb), .12),
      inset 0 1px 0 rgba(255,255,255,.10),
      inset 0 -1px 0 rgba(245,199,107,.10) !important;

    animation: scslMobilePlatePulse 4.2s ease-in-out infinite alternate !important;
  }

  #top15Grid .card[data-scsl-team-theme] .top15-team-wash {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;

    opacity: .78 !important;

    background:
      radial-gradient(circle at 0% 12%, rgba(var(--scsl-team1-rgb), .28), transparent 35%),
      radial-gradient(circle at 100% 16%, rgba(var(--scsl-team2-rgb), .22), transparent 38%),
      linear-gradient(
        100deg,
        rgba(var(--scsl-team1-rgb), .095) 0%,
        transparent 34%,
        rgba(245,199,107,.040) 50%,
        transparent 66%,
        rgba(var(--scsl-team2-rgb), .095) 100%
      ) !important;

    filter: saturate(.98) brightness(.82) !important;
    animation: scslMobileTeamAuraMove 4.6s ease-in-out infinite alternate !important;
  }

  /* Moving HUD texture across the whole mobile card */
  #top15Grid .card[data-scsl-team-theme]::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 3 !important;
    pointer-events: none !important;

    background:
      repeating-linear-gradient(
        112deg,
        transparent 0px,
        transparent 64px,
        rgba(255,255,255,.060) 82px,
        rgba(245,199,107,.135) 96px,
        rgba(var(--scsl-team-rgb), .105) 112px,
        transparent 140px,
        transparent 232px
      ),
      repeating-linear-gradient(
        90deg,
        rgba(255,255,255,.036) 0px,
        rgba(255,255,255,.036) 1px,
        transparent 1px,
        transparent 28px
      ) !important;

    background-size:
      464px 464px,
      28px 28px !important;

    background-position:
      0px 0px,
      0px 0px !important;

    mix-blend-mode: screen !important;
    opacity: .84 !important;

    animation: scslMobileHudLoop 4.1s linear infinite !important;
  }

  /* Big visible sweep across the whole player plate */
  #top15Grid .card[data-scsl-team-theme]::after {
    content: "" !important;
    position: absolute !important;
    inset: -34% !important;
    z-index: 4 !important;
    pointer-events: none !important;

    background:
      radial-gradient(circle at 20% 28%, rgba(255,255,255,.13), transparent 18%),
      radial-gradient(circle at 72% 34%, rgba(245,199,107,.18), transparent 24%),
      radial-gradient(circle at 44% 74%, rgba(var(--scsl-team-rgb), .18), transparent 28%),
      linear-gradient(
        110deg,
        transparent 0%,
        rgba(255,255,255,.11) 38%,
        rgba(245,199,107,.16) 50%,
        transparent 66%
      ) !important;

    opacity: .86 !important;
    mix-blend-mode: screen !important;

    animation: scslMobileSpotlightAlive 4.8s ease-in-out infinite alternate !important;
  }

  #top15Grid .card > *:not(.top15-team-wash) {
    position: relative !important;
    z-index: 7 !important;
  }

  /* Tap For More should be clean, not the main animation */
  #top15Grid .card .mobile-expand-hint {
    border-color: rgba(245,199,107,.30) !important;

    background:
      linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.012)),
      rgba(0,0,0,.24) !important;

    box-shadow:
      0 8px 20px rgba(0,0,0,.26),
      inset 0 1px 0 rgba(255,255,255,.08) !important;

    animation: none !important;
  }

  #top15Grid .card .mobile-expand-hint::before,
  #top15Grid .card .mobile-expand-hint::after {
    display: none !important;
    content: none !important;
    animation: none !important;
  }

  #top15Grid .card .mobile-expand-hint .hint-arrow::before,
  #top15Grid .card .mobile-expand-hint .hint-arrow::after {
    display: block !important;
  }
}

@keyframes scslMobilePlatePulse {
  0% {
    filter: brightness(.97) saturate(1);
    border-color: rgba(245,199,107,.30);
  }

  100% {
    filter: brightness(1.09) saturate(1.16);
    border-color: rgba(245,199,107,.58);
  }
}

@keyframes scslMobileTeamAuraMove {
  0% {
    transform: translate3d(-1.8%, -1%, 0) scale(1);
    opacity: .52;
  }

  100% {
    transform: translate3d(1.8%, 1%, 0) scale(1.04);
    opacity: .86;
  }
}

@keyframes scslMobileHudLoop {
  0% {
    background-position:
      0px 0px,
      0px 0px;
  }

  100% {
    background-position:
      464px 0px,
      28px 0px;
  }
}

@keyframes scslMobileSpotlightAlive {
  0% {
    transform: translate3d(-3%, -2%, 0) scale(1.02) rotate(-1deg);
    opacity: .52;
  }

  50% {
    opacity: .92;
  }

  100% {
    transform: translate3d(3%, 2%, 0) scale(1.09) rotate(1deg);
    opacity: .70;
  }
}

/* ===== assets/top15-card-shimmer-lock.css ===== */
/* ===== TOP 15 CARD SHIMMER LOCK ===== */
/* Full card reflection/shimmer. Loaded dead last so no older file can hide it. */

#top15Grid .card[data-scsl-team-theme] {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;

  border-color: rgba(245,199,107,.42) !important;

  background:
    radial-gradient(circle at 12% 0%, rgba(var(--scsl-team1-rgb,245,199,107), .16), transparent 35%),
    radial-gradient(circle at 92% 8%, rgba(var(--scsl-team2-rgb,185,137,47), .12), transparent 38%),
    linear-gradient(180deg, rgba(15,17,25,.99), rgba(4,6,12,.995)) !important;

  box-shadow:
    0 26px 74px rgba(0,0,0,.62),
    0 0 0 1px rgba(245,199,107,.12),
    0 0 30px rgba(245,199,107,.12),
    0 0 42px rgba(var(--scsl-team-rgb,245,199,107), .10),
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -1px 0 rgba(245,199,107,.10) !important;

  animation: scslCardPlateBreath 4.4s ease-in-out infinite alternate !important;
}

/* Full-card AI reflection sheet */
#top15Grid .card[data-scsl-team-theme]::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: -52% !important;
  z-index: 4 !important;
  pointer-events: none !important;

  background:
    linear-gradient(
      112deg,
      transparent 0%,
      transparent 12%,
      rgba(255,255,255,.055) 22%,
      rgba(255,255,255,.22) 32%,
      rgba(245,199,107,.34) 41%,
      rgba(255,255,255,.18) 50%,
      rgba(var(--scsl-team-rgb,245,199,107), .13) 58%,
      transparent 72%,
      transparent 100%
    ),
    linear-gradient(
      25deg,
      transparent 0%,
      rgba(255,255,255,.030) 34%,
      rgba(255,255,255,.105) 50%,
      rgba(245,199,107,.060) 60%,
      transparent 74%
    ) !important;

  mix-blend-mode: screen !important;
  opacity: .88 !important;

  transform: translateX(-48%) skewX(-7deg);
  animation: scslCardReflectionSweep 4.8s cubic-bezier(.45,0,.2,1) infinite alternate !important;
}

/* Obvious shimmer slash across the whole plate */
#top15Grid .card[data-scsl-team-theme]::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  top: -75% !important;
  bottom: -75% !important;
  left: -48% !important;
  width: 34% !important;
  z-index: 5 !important;
  pointer-events: none !important;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.30),
      rgba(245,199,107,.24),
      rgba(var(--scsl-team-rgb,245,199,107), .16),
      rgba(255,255,255,.12),
      transparent
    ) !important;

  transform: skewX(-22deg);
  opacity: 0;
  animation: scslCardHardShimmer 5.6s ease-in-out infinite !important;
}

/* Keep the team aura behind the shimmer */
#top15Grid .card[data-scsl-team-theme] .top15-team-wash {
  display: block !important;
  z-index: 1 !important;
  opacity: .52 !important;
  animation: scslCardTeamAura 5.8s ease-in-out infinite alternate !important;
}

/* Make sure content is above the animated plate layers */
#top15Grid .card > *:not(.top15-team-wash) {
  position: relative !important;
  z-index: 8 !important;
}

/* Tap For More should not be the star */
#top15Grid .card .mobile-expand-hint::before,
#top15Grid .card .mobile-expand-hint::after {
  display: none !important;
  content: none !important;
  animation: none !important;
}

@keyframes scslCardPlateBreath {
  0% {
    filter: brightness(.98) saturate(1);
    border-color: rgba(245,199,107,.30);
  }

  100% {
    filter: brightness(1.08) saturate(1.12);
    border-color: rgba(245,199,107,.58);
  }
}

@keyframes scslCardReflectionSweep {
  0% {
    transform: translateX(-48%) skewX(-7deg);
    opacity: .42;
  }

  50% {
    opacity: .95;
  }

  100% {
    transform: translateX(28%) skewX(-7deg);
    opacity: .62;
  }
}

@keyframes scslCardHardShimmer {
  0%, 36% {
    transform: translateX(0) skewX(-22deg);
    opacity: 0;
  }

  48% {
    opacity: .95;
  }

  74%, 100% {
    transform: translateX(700%) skewX(-22deg);
    opacity: 0;
  }
}

@keyframes scslCardTeamAura {
  0% {
    transform: translate3d(-1%, -.5%, 0) scale(1);
  }

  100% {
    transform: translate3d(1%, .5%, 0) scale(1.025);
  }
}

@media (max-width: 760px) {
  #top15Grid .card[data-scsl-team-theme]::before {
    animation-duration: 5.2s !important;
  }

  #top15Grid .card[data-scsl-team-theme]::after {
    animation-duration: 5.8s !important;
  }
}

/* ===== assets/secret-do-not-touch-final.css ===== */
.secret-do-not-touch {
  width: min(100%, 1120px);
  margin: 34px auto 16px;
  padding: 28px 18px 6px;
  text-align: center;
  position: relative;
}

.secret-do-not-touch::before {
  content: "";
  display: block;
  width: min(420px, 72vw);
  height: 1px;
  margin: 0 auto 22px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(245,199,107,.20),
    rgba(255,255,255,.10),
    rgba(245,199,107,.20),
    transparent
  );
}

.secret-do-not-touch-btn {
  appearance: none;
  border: 1px solid rgba(245,199,107,.38);
  border-radius: 999px;
  padding: 12px 22px 11px;
  cursor: pointer;

  font-family: var(--font-stat, "Rajdhani", "Inter", sans-serif);
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(245,231,190,.92);

  background:
    linear-gradient(115deg, rgba(255,255,255,.09), rgba(255,255,255,.02)),
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.18), transparent 55%),
    rgba(8,10,16,.88);

  box-shadow:
    0 14px 36px rgba(0,0,0,.42),
    0 0 22px rgba(245,199,107,.10),
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -1px 0 rgba(245,199,107,.08);

  text-shadow: 0 0 14px rgba(245,199,107,.18);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease;
}

.secret-do-not-touch-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(245,199,107,.62);
  color: #fff3cf;
  box-shadow:
    0 18px 44px rgba(0,0,0,.48),
    0 0 30px rgba(245,199,107,.17),
    inset 0 1px 0 rgba(255,255,255,.16);
}

.secret-do-not-touch-btn:active {
  transform: translateY(1px) scale(.99);
}

.secret-embed-wrap {
  width: 148px;
  min-height: 226px;
  margin: 16px auto 0;
  padding: 12px 10px 10px;
  border-radius: 20px;
  border: 1px solid rgba(245,199,107,.24);

  background:
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.018)),
    rgba(0,0,0,.36);

  box-shadow:
    0 20px 48px rgba(0,0,0,.48),
    0 0 24px rgba(245,199,107,.10),
    inset 0 1px 0 rgba(255,255,255,.10);
}

.secret-embed-wrap iframe {
  display: block;
  margin: 0 auto;
  border-radius: 14px;
  max-width: 100%;
}

.secret-embed-wrap:not([hidden]) {
  animation: secretReveal .28s ease-out both;
}

@keyframes secretReveal {
  from {
    opacity: 0;
    transform: translateY(8px) scale(.97);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@media (max-width: 760px) {
  .secret-do-not-touch {
    margin-top: 24px;
    padding-bottom: 4px;
  }

  .secret-do-not-touch-btn {
    font-size: .78rem;
    padding: 11px 18px 10px;
    letter-spacing: .15em;
  }
}




/* ===== SECRET SITE MELTDOWN EFFECT ===== */
/* Fake 2-second site break when Do Not Touch is clicked. */

html.scsl-secret-meltdown,
html.scsl-secret-meltdown body {
  overflow-x: hidden !important;
}

html.scsl-secret-meltdown body {
  animation: scslSiteMeltdownBody 2100ms cubic-bezier(.18,.9,.18,1) both !important;
  transform-origin: 50% 50%;
}

html.scsl-secret-meltdown body::before,
html.scsl-secret-meltdown body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 2147483000;
}

html.scsl-secret-meltdown body::before {
  background:
    radial-gradient(circle at 50% 45%, rgba(255,255,255,.98) 0%, rgba(245,199,107,.72) 8%, rgba(210,20,20,.48) 22%, transparent 58%),
    linear-gradient(102deg, transparent 0%, rgba(255,255,255,.45) 38%, rgba(245,199,107,.55) 49%, rgba(210,20,20,.22) 55%, transparent 70%),
    repeating-linear-gradient(
      90deg,
      rgba(255,255,255,.11) 0px,
      rgba(255,255,255,.11) 2px,
      transparent 2px,
      transparent 19px
    );
  mix-blend-mode: screen;
  animation: scslMeltdownFlash 2100ms ease-out both !important;
}

html.scsl-secret-meltdown body::after {
  background:
    repeating-linear-gradient(
      0deg,
      rgba(255,255,255,.20) 0px,
      rgba(255,255,255,.20) 1px,
      rgba(245,199,107,.10) 2px,
      transparent 4px,
      transparent 9px
    ),
    radial-gradient(circle at 50% 50%, transparent 0%, transparent 42%, rgba(0,0,0,.72) 100%);
  opacity: 0;
  animation: scslMeltdownScanlines 2100ms steps(10,end) both !important;
}

.scsl-broken-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147483600;
  pointer-events: none;

  display: grid;
  place-items: center;
  padding: 24px;

  background:
    radial-gradient(circle at 50% 50%, rgba(245,199,107,.18), transparent 34%),
    linear-gradient(180deg, rgba(0,0,0,.20), rgba(0,0,0,.68));

  opacity: 1;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  isolation: isolate;
}

.scsl-broken-overlay.scsl-broken-overlay-ready {
  animation: scslBrokenOverlayIn 2350ms ease-out both;
}

.scsl-broken-card {
  width: min(560px, 88vw);
  border: 1px solid rgba(245,199,107,.58);
  border-radius: 24px;
  padding: 22px 20px 19px;

  background:
    linear-gradient(115deg, rgba(255,255,255,.13), rgba(255,255,255,.025)),
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.24), transparent 54%),
    rgba(5,6,10,.88);

  box-shadow:
    0 28px 90px rgba(0,0,0,.72),
    0 0 70px rgba(245,199,107,.22),
    0 0 100px rgba(210,20,20,.18),
    inset 0 1px 0 rgba(255,255,255,.16);

  text-align: center;
  transform: rotate(-1deg);
  animation: scslBrokenCardGlitch 2100ms steps(8,end) both;
}

.scsl-broken-kicker {
  font-family: var(--font-stat, "Rajdhani", "Inter", sans-serif);
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .24em;
  color: rgba(245,199,107,.98);
  text-transform: uppercase;
  margin-bottom: 8px;
}

.scsl-broken-title {
  font-family: var(--font-display, "Bebas Neue", Impact, sans-serif);
  font-size: clamp(2.2rem, 9vw, 5rem);
  line-height: .92;
  letter-spacing: .045em;
  color: #fff4cf;
  text-shadow:
    2px 0 rgba(210,20,20,.72),
    -2px 0 rgba(245,199,107,.55),
    0 0 24px rgba(245,199,107,.34);
  text-transform: uppercase;
}

.scsl-broken-sub {
  margin-top: 9px;
  font-family: var(--font-stat, "Rajdhani", "Inter", sans-serif);
  font-size: .95rem;
  font-weight: 800;
  letter-spacing: .12em;
  color: rgba(255,255,255,.86);
  text-transform: uppercase;
}

.secret-do-not-touch-btn.touched {
  border-color: rgba(255,230,150,.95) !important;
  color: #fff8d8 !important;
  animation: scslSecretPanicButton 2100ms steps(7,end) both !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.18),
    0 0 40px rgba(245,199,107,.42),
    0 0 90px rgba(210,20,20,.28),
    inset 0 1px 0 rgba(255,255,255,.24) !important;
}

@keyframes scslSiteMeltdownBody {
  0% {
    transform: translate3d(0,0,0) rotate(0deg) scale(1);
    filter: none;
  }
  5% {
    transform: translate3d(-8px, 5px, 0) rotate(-.55deg) scale(1.008);
    filter: brightness(1.42) saturate(1.8) contrast(1.15);
  }
  10% {
    transform: translate3d(9px, -6px, 0) rotate(.7deg) scale(1.014);
    filter: brightness(1.7) saturate(2.2) hue-rotate(-12deg);
  }
  18% {
    transform: translate3d(-12px, 3px, 0) rotate(-1deg) scale(1.018);
    filter: brightness(.82) saturate(2.4) contrast(1.45);
  }
  27% {
    transform: translate3d(10px, 7px, 0) rotate(.85deg) scale(1.012);
    filter: invert(.08) brightness(1.35) saturate(2);
  }
  37% {
    transform: translate3d(-7px, -8px, 0) rotate(-.55deg) scale(1.01);
    filter: brightness(.78) contrast(1.55) saturate(1.8);
  }
  50% {
    transform: translate3d(5px, 3px, 0) rotate(.35deg) scale(1.006);
    filter: brightness(1.2) saturate(1.55);
  }
  68% {
    transform: translate3d(-3px, 2px, 0) rotate(-.18deg) scale(1.003);
    filter: brightness(1.08) saturate(1.25);
  }
  100% {
    transform: translate3d(0,0,0) rotate(0deg) scale(1);
    filter: none;
  }
}

@keyframes scslMeltdownFlash {
  0% { opacity: 0; transform: scale(1); }
  4% { opacity: 1; }
  12% { opacity: .94; transform: scale(1.025); }
  22% { opacity: .62; transform: scale(1.045); }
  38% { opacity: .38; }
  64% { opacity: .18; transform: scale(1.08); }
  100% { opacity: 0; transform: scale(1.12); }
}

@keyframes scslMeltdownScanlines {
  0% { opacity: 0; transform: translateY(-18px); }
  6% { opacity: .78; transform: translateY(7px); }
  20% { opacity: .54; transform: translateY(-3px); }
  35% { opacity: .72; transform: translateY(12px); }
  55% { opacity: .36; transform: translateY(22px); }
  100% { opacity: 0; transform: translateY(38px); }
}

@keyframes scslBrokenOverlayIn {
  0% { opacity: 0; transform: translateZ(0) scale(1.015); }
  7% { opacity: 1; transform: translateZ(0) scale(1); }
  84% { opacity: 1; }
  100% { opacity: 0; transform: translateZ(0) scale(.99); }
}

@keyframes scslBrokenCardGlitch {
  0% { transform: translate3d(0, 8px, 0) rotate(-1deg); opacity: 0; }
  8% { transform: translate3d(-6px, 0, 0) rotate(1deg); opacity: 1; }
  15% { transform: translate3d(7px, -3px, 0) rotate(-1deg); }
  25% { transform: translate3d(-4px, 3px, 0) rotate(.65deg); }
  42% { transform: translate3d(5px, 0, 0) rotate(-.35deg); }
  60% { transform: translate3d(-2px, 1px, 0) rotate(.2deg); }
  100% { transform: translate3d(0, 0, 0) rotate(0deg); opacity: 0; }
}

@keyframes scslSecretPanicButton {
  0% { transform: scale(1); }
  8% { transform: scale(1.14) rotate(-2deg); }
  18% { transform: scale(.96) rotate(2deg); }
  30% { transform: scale(1.08) rotate(-1deg); }
  55% { transform: scale(1.02); }
  100% { transform: scale(1); }
}

@media (max-width: 760px) {
  .scsl-broken-card {
    padding: 19px 16px 16px;
    border-radius: 20px;
  }

  .scsl-broken-sub {
    font-size: .78rem;
  }
}

/* ===== END SECRET SITE MELTDOWN EFFECT ===== */

/* Secret button spam guard: prevents repeated taps from stacking the fake break effect. */
.secret-do-not-touch-btn.secret-locked,
.secret-do-not-touch-btn:disabled {
  pointer-events: none !important;
  cursor: default !important;
}


/* ===== iOS-safe secret haptic fallback =====
   iOS Safari does not expose real navigator.vibrate support, so this gives the tap a
   physical-feeling screen/btn rumble without stacking or breaking the page.
*/
html.scsl-secret-ios-rumble body {
  animation: scslSecretIOSRumble 650ms cubic-bezier(.2,.9,.15,1) both !important;
  transform-origin: 50% 50% !important;
}

html.scsl-secret-ios-rumble .secret-do-not-touch-btn {
  animation:
    scslSecretPanicButton 900ms steps(7,end) both,
    scslSecretIOSButtonBuzz 650ms linear both !important;
}

@keyframes scslSecretIOSRumble {
  0% { transform: translate3d(0,0,0); }
  7% { transform: translate3d(-2px,1px,0) rotate(-.08deg); }
  14% { transform: translate3d(2px,-1px,0) rotate(.08deg); }
  21% { transform: translate3d(-3px,0,0) rotate(-.10deg); }
  28% { transform: translate3d(3px,1px,0) rotate(.10deg); }
  35% { transform: translate3d(-2px,-1px,0) rotate(-.07deg); }
  45% { transform: translate3d(2px,0,0) rotate(.07deg); }
  56% { transform: translate3d(-1px,1px,0) rotate(-.04deg); }
  68% { transform: translate3d(1px,-1px,0) rotate(.04deg); }
  100% { transform: translate3d(0,0,0) rotate(0); }
}

@keyframes scslSecretIOSButtonBuzz {
  0% { filter: brightness(1) saturate(1); }
  16% { filter: brightness(1.45) saturate(1.45); }
  34% { filter: brightness(.82) saturate(1.65); }
  56% { filter: brightness(1.22) saturate(1.35); }
  100% { filter: brightness(1) saturate(1); }
}

@media (prefers-reduced-motion: reduce) {
  html.scsl-secret-ios-rumble body,
  html.scsl-secret-ios-rumble .secret-do-not-touch-btn {
    animation: none !important;
  }
}

/* =========================================================
   Final Do Not Touch reveal · cursed LB image overlay
   Keeps the original screen break + haptic behavior.
========================================================= */

.scsl-broken-overlay {
  background:
    radial-gradient(circle at 50% 48%, rgba(210,20,20,.24), transparent 34%),
    radial-gradient(circle at 42% 40%, rgba(245,199,107,.12), transparent 28%),
    linear-gradient(180deg, rgba(0,0,0,.28), rgba(0,0,0,.78)) !important;
}

.scsl-broken-lb {
  display: block;
  width: min(82vw, 720px);
  max-height: min(78vh, 760px);
  object-fit: contain;
  filter:
    drop-shadow(0 0 22px rgba(255,30,45,.42))
    drop-shadow(0 0 58px rgba(245,199,107,.22));
  transform-origin: 50% 50%;
  opacity: 0;
  user-select: none;
  -webkit-user-drag: none;
}

.scsl-broken-lb.scsl-broken-lb-ready {
  animation: scslBrokenLbReveal 2350ms steps(10,end) both;
}

@keyframes scslBrokenLbReveal {
  0% { opacity: 0; transform: translate3d(0, 18px, 0) scale(.88) rotate(-1.4deg); }
  8% { opacity: 1; transform: translate3d(-10px, -3px, 0) scale(1.03) rotate(1.2deg); }
  16% { transform: translate3d(9px, 4px, 0) scale(1.01) rotate(-.8deg); filter: drop-shadow(0 0 34px rgba(255,30,45,.58)) saturate(1.35); }
  30% { transform: translate3d(-6px, 0, 0) scale(1.02) rotate(.5deg); }
  50% { transform: translate3d(4px, 2px, 0) scale(1.005) rotate(-.25deg); }
  76% { opacity: .98; transform: translate3d(0, 0, 0) scale(1); }
  100% { opacity: 0; transform: translate3d(0, -10px, 0) scale(.96); }
}

@media (max-width: 760px) {
  .scsl-broken-lb {
    width: min(96vw, 540px);
    max-height: 76vh;
  }
}

@media (prefers-reduced-motion: reduce) {
  .scsl-broken-lb.scsl-broken-lb-ready {
    animation: scslBrokenOverlayIn 2350ms ease-out both !important;
  }
}

/* ===== assets/top15-photos-v2.css ===== */
/* ===== SCSL15 TOP 15 PHOTOS + FACTS V2 ===== */

#top15Grid .card {
  position: relative !important;
  isolation: isolate !important;
}

#top15Grid .card .player {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#top15Grid .card .top15-player-photo-frame {
  grid-area: photo !important;
  position: relative !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  overflow: hidden !important;
  width: 76px !important;
  height: 76px !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 50% 18%, rgba(var(--scsl-team-rgb, 245,199,107), .35), transparent 44%),
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.035)),
    rgba(0,0,0,.24) !important;
  border: 1px solid rgba(245,199,107,.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.13),
    0 12px 26px rgba(0,0,0,.28),
    0 0 22px rgba(var(--scsl-team-rgb, 245,199,107), .10) !important;
  z-index: 4 !important;
}

#top15Grid .card:nth-child(-n+3) .top15-player-photo-frame {
  border-color: rgba(245,199,107,.42) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 14px 32px rgba(0,0,0,.34),
    0 0 28px rgba(245,199,107,.18) !important;
}

#top15Grid .card .top15-player-photo-frame::after {
  content: "" !important;
  position: absolute !important;
  inset: auto 8px 7px !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(245,199,107,.65), transparent) !important;
  z-index: 2 !important;
}

#top15Grid .card .top15-player-photo {
  display: block !important;
  width: 122% !important;
  height: 122% !important;
  object-fit: contain !important;
  object-position: center bottom !important;
  transform: translateY(3px) !important;
  filter: drop-shadow(0 12px 13px rgba(0,0,0,.42)) !important;
  z-index: 1 !important;
}

#top15Grid .card .legacy-facts {
  margin-top: 12px !important;
  padding: 11px 12px !important;
  border-radius: 15px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.060), rgba(255,255,255,.025)),
    rgba(0,0,0,.16) !important;
  border: 1px solid rgba(245,199,107,.15) !important;
}

#top15Grid .card .legacy-facts-title {
  margin-bottom: 7px !important;
  color: rgba(245,199,107,.94) !important;
  font-family: var(--font-stat, "Rajdhani", "Inter", sans-serif) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
}

#top15Grid .card .legacy-facts-list {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  gap: 6px !important;
}

#top15Grid .card .legacy-facts-list li {
  position: relative !important;
  margin: 0 !important;
  padding-left: 15px !important;
  color: rgba(226,230,243,.88) !important;
  font-size: 12.5px !important;
  line-height: 1.38 !important;
}

#top15Grid .card .legacy-facts-list li::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: .58em !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 999px !important;
  background: rgba(245,199,107,.86) !important;
  box-shadow: 0 0 10px rgba(245,199,107,.24) !important;
}

@media (min-width: 900px) {
  #top15Grid .card {
    grid-template-columns: 56px 82px minmax(0, 1fr) 116px !important;
    grid-template-areas:
      "rank photo player score"
      "rank photo team score"
      "rank photo stats stats"
      "meta meta meta meta" !important;
    column-gap: 14px !important;
    row-gap: 6px !important;
    min-height: 118px !important;
    padding: 16px 18px !important;
    align-items: center !important;
  }

  #top15Grid .card .rank { grid-area: rank !important; }
  #top15Grid .card .player { grid-area: player !important; max-width: 100% !important; }
  #top15Grid .card .mobile-card-score { grid-area: score !important; }
  #top15Grid .card .stats { grid-area: stats !important; }
  #top15Grid .card .top15-team-line { grid-area: team !important; margin: 2px 0 0 !important; }
  #top15Grid .card .legacy-details { grid-area: meta !important; }
}

@media (max-width: 899px) {
  #top15Grid .card {
    grid-template-columns: 52px 54px minmax(0, 1fr) 74px !important;
    grid-template-areas:
      "rank photo player score"
      "rank photo stats stats"
      "rank photo team team"
      "hint hint hint hint"
      "meta meta meta meta" !important;
    column-gap: 9px !important;
    row-gap: 8px !important;
    padding: 16px 14px 15px !important;
    align-items: center !important;
  }

  #top15Grid .card .rank {
    grid-area: rank !important;
    justify-self: start !important;
    align-self: start !important;
    width: 46px !important;
    height: 46px !important;
    margin: 0 !important;
  }

  #top15Grid .card .top15-player-photo-frame {
    width: 52px !important;
    height: 52px !important;
    border-radius: 15px !important;
    align-self: start !important;
  }

  #top15Grid .card .top15-player-photo {
    width: 128% !important;
    height: 128% !important;
    transform: translateY(3px) !important;
  }

  #top15Grid .card .player {
    grid-area: player !important;
    width: auto !important;
    max-width: 100% !important;
    align-self: end !important;
    justify-self: stretch !important;
    min-width: 0 !important;
    font-size: clamp(21px, 6.2vw, 30px) !important;
  }

  #top15Grid .card .mobile-card-score {
    grid-area: score !important;
    align-self: start !important;
    justify-self: end !important;
    min-width: 68px !important;
  }

  #top15Grid .card .stats,
  #top15Grid .card .quick-stats,
  #top15Grid .card .pills,
  #top15Grid .card .mobile-stats {
    grid-area: stats !important;
    align-self: start !important;
    justify-self: stretch !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  #top15Grid .card .top15-team-line {
    grid-area: team !important;
    align-self: start !important;
    justify-self: start !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    margin: -1px 0 0 !important;
  }

  #top15Grid .card .mobile-expand-hint {
    grid-area: hint !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    margin: 2px 0 0 !important;
    z-index: 6 !important;
  }

  #top15Grid .card .legacy-details {
    grid-area: meta !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  #top15Grid .card .score-breakdown {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #top15Grid .card .legacy-facts {
    padding: 10px !important;
  }

  #top15Grid .card .legacy-facts-list li {
    font-size: 12px !important;
  }
}

@media (max-width: 390px) {
  #top15Grid .card {
    grid-template-columns: 48px 50px minmax(0, 1fr) 68px !important;
    column-gap: 8px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  #top15Grid .card .rank {
    width: 42px !important;
    height: 42px !important;
    font-size: 12px !important;
  }

  #top15Grid .card .top15-player-photo-frame {
    width: 48px !important;
    height: 48px !important;
  }

  #top15Grid .card .player {
    font-size: clamp(19px, 5.8vw, 26px) !important;
  }

  #top15Grid .card .mobile-card-score {
    min-width: 62px !important;
  }
}

/* ===== assets/site-v2-mobile-fixes.css ===== */
/* ===== SCSL15 VERSION 2.0 MOBILE/TICKER LOCK ===== */

:root {
  --scsl-fixed-topbar-h: 44px;
  --scsl-fixed-ticker-h: 38px;
  --scsl-fixed-header-h: 82px;
}

html {
  scroll-padding-top: calc(var(--scsl-fixed-header-h) + 18px) !important;
}

body {
  padding-top: var(--scsl-fixed-header-h) !important;
  overflow-x: hidden !important;
}

.broadcast-bar,
.broadcast-ticker {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  width: 100vw !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.broadcast-bar {
  top: 0 !important;
  z-index: 2147483000 !important;
  height: var(--scsl-fixed-topbar-h) !important;
  min-height: var(--scsl-fixed-topbar-h) !important;
}

.broadcast-ticker {
  top: var(--scsl-fixed-topbar-h) !important;
  z-index: 2147482999 !important;
  height: var(--scsl-fixed-ticker-h) !important;
  min-height: var(--scsl-fixed-ticker-h) !important;
  display: flex !important;
  align-items: center !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  contain: layout paint !important;
  isolation: isolate !important;
}

.broadcast-ticker,
.broadcast-ticker * {
  -webkit-text-size-adjust: 100% !important;
}

.ticker-track {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: max-content !important;
  min-width: max-content !important;
  max-width: none !important;
  white-space: nowrap !important;
  visibility: visible !important;
  opacity: 1 !important;
  animation: scslTickerCleanV2 var(--scsl-v2-ticker-duration, 112s) linear infinite !important;
}

.ticker-track > span,
.ticker-track .ticker-label,
.ticker-track em {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.ticker-track em {
  min-width: max-content !important;
  color: rgba(255,255,255,.98) !important;
}

.mobile-jump-nav {
  top: var(--scsl-fixed-header-h) !important;
}

section,
[id] {
  scroll-margin-top: calc(var(--scsl-fixed-header-h) + 22px) !important;
}

#top15Grid .card .top15-player-photo-frame {
  width: 82px !important;
  height: 82px !important;
  min-width: 82px !important;
  align-self: center !important;
  justify-self: center !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  overflow: hidden !important;
}

#top15Grid .card .top15-player-photo {
  width: 106% !important;
  height: 106% !important;
  max-width: none !important;
  object-fit: contain !important;
  object-position: center bottom !important;
  transform: translateY(2px) !important;
}

#top15Grid .card .legacy-facts {
  display: none !important;
}

#top15Grid .card .legacy-details-title {
  letter-spacing: .16em !important;
}

#top15Grid .card .legacy-why {
  margin-top: 12px !important;
  padding: 12px 13px !important;
  border-radius: 15px !important;
  border: 1px solid rgba(245,199,107,.15) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.022)), rgba(0,0,0,.16) !important;
  color: rgba(232,235,246,.92) !important;
  font-size: 13.6px !important;
  line-height: 1.55 !important;
}

@media (max-width: 760px) {
  :root {
    --scsl-fixed-topbar-h: 40px;
    --scsl-fixed-ticker-h: 36px;
    --scsl-fixed-header-h: 76px;
  }

  body {
    padding-top: var(--scsl-fixed-header-h) !important;
  }

  .broadcast-ticker {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .ticker-track {
    --scsl-v2-ticker-duration: 132s;
    font-size: 10.9px !important;
    line-height: 1 !important;
  }

  .ticker-track > span {
    gap: 8px !important;
    margin-right: 34px !important;
  }

  #top15Grid .card {
    grid-template-columns: 48px 62px minmax(0, 1fr) 70px !important;
    column-gap: 9px !important;
  }

  #top15Grid .card .top15-player-photo-frame {
    width: 60px !important;
    height: 60px !important;
    min-width: 60px !important;
    align-self: start !important;
  }

  #top15Grid .card .top15-player-photo {
    width: 107% !important;
    height: 107% !important;
    transform: translateY(2px) !important;
  }

  #top15Grid .card .player {
    font-size: clamp(20px, 5.8vw, 27px) !important;
  }

  #top15Grid .card .mobile-expand-hint {
    text-align: center !important;
  }

  #top15Grid .card .legacy-why {
    padding: 11px 11px !important;
    font-size: 12.7px !important;
    line-height: 1.52 !important;
  }
}

@media (max-width: 390px) {
  #top15Grid .card {
    grid-template-columns: 45px 58px minmax(0, 1fr) 66px !important;
    column-gap: 8px !important;
  }

  #top15Grid .card .top15-player-photo-frame {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
  }
}

/* ===== assets/legacy-intro-modal.css ===== */
/* ===== SCSL15 LEGACY INTRO MODAL ===== */

.legacy-intro-cta {
  display: flex;
  justify-content: center;
  margin: 16px 0 8px;
}

.legacy-intro-btn {
  appearance: none;
  border: 1px solid rgba(245, 199, 107, .46);
  border-radius: 999px;
  padding: 11px 14px 11px 18px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  color: #fff6d7;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .04)),
    radial-gradient(circle at 20% 0%, rgba(245, 199, 107, .26), transparent 38%),
    rgba(8, 9, 15, .88);
  box-shadow:
    0 12px 34px rgba(0, 0, 0, .34),
    0 0 22px rgba(245, 199, 107, .17),
    inset 0 1px 0 rgba(255, 255, 255, .18);
  font-family: var(--font-stat, "Rajdhani", "Inter", sans-serif);
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.legacy-intro-btn:hover,
.legacy-intro-btn:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(255, 231, 163, .75);
  box-shadow:
    0 16px 42px rgba(0, 0, 0, .42),
    0 0 30px rgba(245, 199, 107, .26),
    inset 0 1px 0 rgba(255, 255, 255, .25);
  outline: none;
}

.legacy-intro-btn-main {
  font-size: 13px;
  line-height: 1;
}

.legacy-intro-duration {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 4px 8px 3px;
  border-radius: 999px;
  color: #1a1206;
  background: linear-gradient(180deg, #ffeeb5, #c79432);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), 0 0 14px rgba(245, 199, 107, .2);
  font-size: 10px;
  letter-spacing: .11em;
  white-space: nowrap;
}

.legacy-intro-modal {
  position: fixed;
  inset: 0;
  z-index: 2147483640;
  display: grid;
  place-items: center;
  padding: clamp(16px, 3vw, 34px);
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: opacity .22s ease, visibility .22s ease;
}

.legacy-intro-modal.is-open {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

.legacy-intro-backdrop {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 50% 18%, rgba(245, 199, 107, .13), transparent 28%),
    rgba(0, 0, 0, .88);
  backdrop-filter: blur(16px) saturate(1.1);
  -webkit-backdrop-filter: blur(16px) saturate(1.1);
}

.legacy-intro-shell {
  position: relative;
  width: min(960px, 100%);
  border-radius: 24px;
  padding: clamp(8px, 1.6vw, 12px);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .025)),
    rgba(6, 7, 12, .96);
  border: 1px solid rgba(245, 199, 107, .42);
  box-shadow:
    0 34px 110px rgba(0, 0, 0, .72),
    0 0 42px rgba(245, 199, 107, .18),
    inset 0 1px 0 rgba(255, 255, 255, .16);
  transform: translateY(14px) scale(.985);
  transition: transform .24s ease;
}

.legacy-intro-modal.is-open .legacy-intro-shell {
  transform: translateY(0) scale(1);
}

.legacy-intro-video {
  display: block;
  width: 100%;
  max-height: min(76vh, 720px);
  border-radius: 18px;
  background: #000;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .06);
}

.legacy-intro-close {
  position: absolute;
  top: -15px;
  right: -15px;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 1px solid rgba(245, 199, 107, .45);
  display: grid;
  place-items: center;
  cursor: pointer;
  color: #fff7df;
  background: rgba(7, 8, 13, .92);
  box-shadow: 0 12px 32px rgba(0, 0, 0, .45), 0 0 18px rgba(245, 199, 107, .16);
  font-size: 24px;
  line-height: 1;
  z-index: 2;
}

.legacy-intro-close:hover,
.legacy-intro-close:focus-visible {
  outline: none;
  border-color: rgba(255, 231, 163, .78);
  color: #ffe7a3;
}

body.legacy-intro-open {
  overflow: hidden !important;
}

@media (max-width: 760px) {
  .legacy-intro-cta {
    margin: 14px 0 6px;
  }

  .legacy-intro-btn {
    width: min(100%, 320px);
    justify-content: center;
    padding: 12px 12px 12px 15px;
  }

  .legacy-intro-btn-main {
    font-size: 12px;
  }

  .legacy-intro-modal {
    padding: 14px;
  }

  .legacy-intro-shell {
    border-radius: 20px;
    padding: 7px;
  }

  .legacy-intro-video {
    border-radius: 15px;
    max-height: 72vh;
  }

  .legacy-intro-close {
    top: -10px;
    right: -10px;
    width: 36px;
    height: 36px;
  }
}

/* ===== assets/scsl-v2-user-fixes.css ===== */
/* ===== SCSL15 V2 USER FIXES ===== */
/* League ticker remains independent from Top 15-only copy. */
.broadcast-ticker,
.ticker-track {
  visibility: visible !important;
}

/* Keep every animated card shine behind the actual content. */
#top15Grid .card[data-scsl-team-theme]::before,
#top15Grid .card[data-scsl-team-theme]::after {
  z-index: 2 !important;
}

#top15Grid .card > *:not(.top15-team-wash) {
  position: relative !important;
  z-index: 8 !important;
}

/* Headshots should stay clean: no gold divider/scan line across faces. */
#top15Grid .card .top15-player-photo-frame {
  position: relative !important;
  isolation: isolate !important;
  z-index: 30 !important;
}

#top15Grid .card .top15-player-photo-frame::before,
#top15Grid .card .top15-player-photo-frame::after {
  content: none !important;
  display: none !important;
  background: none !important;
  box-shadow: none !important;
  animation: none !important;
}

#top15Grid .card .top15-player-photo {
  position: relative !important;
  z-index: 3 !important;
}

/* ===== assets/scsl-v2-final-mobile-ebt-fix.css ===== */
/* ===== SCSL15 FINAL MOBILE + EBT CLEANUP PATCH ===== */
/* Loaded last on purpose. This only fixes mobile clipping + keeps headshots clean. */

#top15Grid .card .top15-player-photo-frame::before,
#top15Grid .card .top15-player-photo-frame::after {
  content: none !important;
  display: none !important;
}

#top15Grid .card .top15-player-photo {
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}

@media (max-width: 760px) {
  #top15Grid .card {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  /* Stop long player names from being chopped on iPhone/mobile. */
  #top15Grid .card .player {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    hyphens: none !important;
    font-size: clamp(17px, 4.85vw, 24px) !important;
    line-height: 1.04 !important;
    letter-spacing: .025em !important;
  }

  /* Let long multi-team rows wrap instead of clipping. */
  #top15Grid .card .top15-team-line {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    row-gap: 4px !important;
    line-height: 1.05 !important;
  }

  #top15Grid .card .top15-team-line *,
  #top15Grid .card .top15-team-name,
  #top15Grid .card .top15-team-label,
  #top15Grid .card .top15-team-sep {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    line-height: 1.05 !important;
  }

  #top15Grid .card .top15-team-name {
    font-size: clamp(7px, 2.2vw, 9px) !important;
    letter-spacing: .045em !important;
  }

  #top15Grid .card .top15-team-label {
    flex: 0 0 auto !important;
  }

  /* Keep score readable but give mobile names a little more breathing room. */
  #top15Grid .card .mobile-card-score {
    min-width: 58px !important;
    max-width: 64px !important;
  }

  #top15Grid .card .mobile-card-score strong {
    font-size: clamp(19px, 5.8vw, 27px) !important;
    line-height: .95 !important;
  }

  #top15Grid .card .mobile-card-score span {
    font-size: clamp(6px, 1.8vw, 8px) !important;
    letter-spacing: .08em !important;
  }

  #top15Grid .card .stats,
  #top15Grid .card .quick-stats,
  #top15Grid .card .pills,
  #top15Grid .card .mobile-stats {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  #top15Grid .card .pill {
    white-space: nowrap !important;
  }

  #top15Grid .card .legacy-details,
  #top15Grid .card .legacy-why,
  #top15Grid .card .honor-cloud,
  #top15Grid .card .score-breakdown {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-wrap: break-word !important;
  }
}

@media (max-width: 430px) {
  #top15Grid .card {
    grid-template-columns: 42px 54px minmax(0, 1fr) 60px !important;
    column-gap: 7px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  #top15Grid .card .rank {
    width: 42px !important;
    height: 42px !important;
  }

  #top15Grid .card .top15-player-photo-frame {
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
  }

  #top15Grid .card .player {
    font-size: clamp(16px, 4.55vw, 21px) !important;
    letter-spacing: .018em !important;
  }

  #top15Grid .card .mobile-card-score {
    min-width: 54px !important;
    max-width: 58px !important;
  }
}

/* ===== assets/scsl15-stats-facts-final.css ===== */
/* =========================================================
   SCSL15 V3 — INTEGRATED STATS / ARCHIVE / GEMINI POLISH
   Compact desktop-first archive section with mobile-safe layout.
========================================================= */

:root {
  --scsl-fixed-topbar-h: 44px;
  --scsl-fixed-ticker-h: 0px;
  --scsl-fixed-header-h: 44px;
  --stats-facts-gold: #f5c76b;
  --stats-facts-gold-deep: #b9892f;
  --stats-facts-ink: #05060b;
}

html { scroll-padding-top: calc(var(--scsl-fixed-header-h) + 16px) !important; }
body { padding-top: var(--scsl-fixed-header-h) !important; }

.broadcast-ticker,
.ticker-track {
  display: none !important;
  animation: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  pointer-events: none !important;
}

.broadcast-bar {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: var(--scsl-fixed-topbar-h) !important;
  min-height: var(--scsl-fixed-topbar-h) !important;
  z-index: 2147483000 !important;
}

.mobile-jump-nav { top: var(--scsl-fixed-header-h) !important; }
section, [id] { scroll-margin-top: calc(var(--scsl-fixed-header-h) + 22px) !important; }

/* ---------- AI-LegacyScore + Gemini power strip ---------- */
.formula-powered-archive {
  display: grid;
  grid-template-columns: minmax(160px, .75fr) minmax(260px, 1.4fr) minmax(160px, .75fr);
  align-items: center;
  gap: 14px;
  margin: 16px auto 14px;
  padding: 12px 14px;
  border: 1px solid rgba(245,199,107,.22);
  border-radius: 22px;
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.16), transparent 36%),
    radial-gradient(circle at 100% 0%, rgba(138,180,248,.16), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.028)),
    rgba(5,6,12,.74);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 16px 34px rgba(0,0,0,.22);
}

.formula-powered-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.formula-powered-brand img {
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  object-fit: contain;
  filter: drop-shadow(0 8px 18px rgba(245,199,107,.16));
}

.formula-powered-gemini { justify-content: flex-end; text-align: right; }

.formula-powered-brand span,
.formula-powered-copy p {
  margin: 0;
  color: rgba(238,241,249,.64);
  font-size: 12px;
  line-height: 1.35;
}

.formula-powered-brand strong,
.formula-powered-copy strong {
  display: block;
  color: #fff;
  font-family: var(--font-stat, Inter, sans-serif);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .10em;
  text-transform: uppercase;
}

.formula-powered-copy {
  min-width: 0;
  text-align: center;
}

.formula-powered-copy strong { color: var(--stats-facts-gold); margin-bottom: 4px; }

.formula-powered-copy a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 8px;
  padding: 7px 11px 6px;
  border-radius: 999px;
  border: 1px solid rgba(245,199,107,.24);
  color: #111;
  background: linear-gradient(180deg, var(--stats-facts-gold), var(--stats-facts-gold-deep));
  font-family: var(--font-stat, Inter, sans-serif);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
  box-shadow: 0 9px 20px rgba(245,199,107,.12);
}

/* ---------- Stats & Facts section ---------- */
.stats-facts-panel {
  position: relative !important;
  overflow: hidden !important;
  border-color: rgba(245,199,107,.16) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(201,31,46,.10), transparent 35%),
    radial-gradient(circle at 100% 0%, rgba(31,83,180,.12), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.015)),
    rgba(3,4,9,.88) !important;
  box-shadow: 0 24px 68px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.stats-facts-panel::before {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(120deg, rgba(255,255,255,.07), transparent 28%, transparent 74%, rgba(245,199,107,.06)),
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.055), transparent 44%);
  opacity: .65;
  mix-blend-mode: screen;
}

.stats-facts-panel > * { position: relative; z-index: 2; }

.stats-facts-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .85fr);
  align-items: end;
  gap: 18px !important;
  margin-bottom: 18px !important;
  text-align: left !important;
}

.stats-facts-head h2 { margin: 0 !important; }

.stats-facts-head p {
  max-width: 460px !important;
  justify-self: end;
  margin: 0 !important;
  color: rgba(235,238,248,.68) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  text-align: right;
}

.stats-facts-kicker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  max-width: 100%;
  margin: 0 0 8px;
  padding: 5px 11px 4px;
  border: 1px solid rgba(245,199,107,.28);
  border-radius: 999px;
  color: #160f04;
  background: linear-gradient(180deg, var(--stats-facts-gold), var(--stats-facts-gold-deep));
  font-family: var(--font-stat, Inter, sans-serif);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .13em;
  text-transform: uppercase;
  box-shadow: 0 10px 24px rgba(245,199,107,.12);
}

.stats-facts-grid.sfa-grid {
  display: block;
  width: 100%;
  margin: 0 auto;
}

.stats-facts-loading {
  padding: 16px;
  border: 1px solid rgba(245,199,107,.18);
  border-radius: 18px;
  text-align: center;
  color: rgba(247,247,251,.72);
  background: rgba(0,0,0,.20);
}

.sfa-shell {
  display: grid;
  gap: 14px;
  width: 100%;
  max-width: 1040px;
  margin: 0 auto;
}

.sfa-topline {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 14px;
}

.sfa-title-card {
  flex: 1 1 auto;
  min-width: 0;
  padding: 18px 20px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 22px;
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.10), transparent 40%),
    rgba(0,0,0,.22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.sfa-eyebrow,
.sfa-ask-head span,
.sfa-tabs button,
.sfa-metric span,
.sfa-metric em,
.sfa-receipt-row em,
.sfa-champion-row em,
.sfa-leader-item span,
.sfa-leader-item em {
  font-family: var(--font-stat, Inter, sans-serif);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.sfa-eyebrow,
.sfa-ask-head span,
.sfa-leader-item span { color: rgba(245,199,107,.92); }

.sfa-title-card h3 {
  margin: 7px 0 8px;
  color: #fff;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif);
  font-size: clamp(34px, 4.2vw, 58px);
  line-height: .9;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.sfa-title-card p,
.sfa-pane p,
.sfa-ask-card p {
  margin: 0;
  color: rgba(235,238,248,.72);
  font-size: 14px;
  line-height: 1.5;
}

.sfa-powered-badge {
  flex: 0 0 210px;
  display: grid;
  place-items: center;
  gap: 8px;
  padding: 16px;
  border-radius: 22px;
  border: 1px solid rgba(138,180,248,.22);
  color: #fff;
  text-decoration: none;
  background:
    radial-gradient(circle at 50% 0%, rgba(138,180,248,.20), transparent 46%),
    radial-gradient(circle at 100% 100%, rgba(245,199,107,.12), transparent 50%),
    rgba(0,0,0,.25);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.sfa-powered-badge img { width: 38px; height: 38px; filter: drop-shadow(0 8px 18px rgba(138,180,248,.18)); }
.sfa-powered-badge span { font-size: 11px; font-weight: 950; letter-spacing: .12em; text-transform: uppercase; text-align: center; }

.sfa-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.sfa-metric {
  appearance: none;
  cursor: pointer;
  min-width: 0;
  text-align: left;
  padding: 15px 15px 13px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.11);
  color: #fff;
  background: linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.018)), rgba(0,0,0,.30);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.sfa-metric:hover,
.sfa-metric:focus-visible,
.sfa-metric.active {
  transform: translateY(-1px);
  border-color: rgba(245,199,107,.36);
  background:
    radial-gradient(circle at 20% 0%, rgba(245,199,107,.14), transparent 44%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.025)),
    rgba(0,0,0,.30);
}

.sfa-metric strong {
  display: block;
  margin-bottom: 4px;
  color: var(--stats-facts-gold);
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif);
  font-size: clamp(34px, 4vw, 50px);
  line-height: .88;
  letter-spacing: .04em;
}

.sfa-metric span,
.sfa-metric em {
  display: block;
  min-width: 0;
  color: rgba(239,242,250,.76);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-style: normal;
}

.sfa-metric em { margin-top: 2px; color: rgba(239,242,250,.52); letter-spacing: .07em; }

.sfa-body {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, .82fr);
  gap: 14px;
  align-items: stretch;
}

.sfa-tabs-card,
.sfa-ask-card {
  min-width: 0;
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,.115);
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.015)),
    rgba(4,5,11,.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 42px rgba(0,0,0,.26);
  overflow: hidden;
}

.sfa-tabs {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 10px;
  border-bottom: 1px solid rgba(255,255,255,.09);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.sfa-tabs::-webkit-scrollbar { display: none; }

.sfa-tabs button {
  flex: 0 0 auto;
  appearance: none;
  cursor: pointer;
  padding: 9px 13px 8px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(239,242,250,.66);
  background: rgba(0,0,0,.18);
}

.sfa-tabs button:hover,
.sfa-tabs button:focus-visible,
.sfa-tabs button.active {
  color: #111;
  border-color: rgba(245,199,107,.32);
  background: linear-gradient(180deg, var(--stats-facts-gold), var(--stats-facts-gold-deep));
}

.sfa-pane {
  display: none;
  min-height: 216px;
  padding: 22px 22px 20px;
}

.sfa-pane.active {
  display: grid;
  align-content: start;
  gap: 14px;
  animation: sfaFade .18s ease both;
}

.sfa-pane h4 {
  max-width: 660px;
  margin: 0;
  color: #fff;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif);
  font-size: clamp(32px, 3.6vw, 48px);
  line-height: .94;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.sfa-receipt-row,
.sfa-champion-row,
.sfa-leader-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.sfa-champion-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sfa-leader-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.sfa-receipt-row span,
.sfa-champion-row span,
.sfa-leader-item {
  min-width: 0;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.095);
  background: rgba(0,0,0,.24);
}

.sfa-receipt-row strong,
.sfa-champion-row strong,
.sfa-leader-item strong {
  display: block;
  color: var(--stats-facts-gold);
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif);
  font-size: 28px;
  line-height: .92;
  letter-spacing: .04em;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.sfa-champion-row strong { color: #fff; font-size: 34px; }
.sfa-leader-item strong { color: #fff; font-size: 24px; }
.sfa-receipt-row em,
.sfa-champion-row em,
.sfa-leader-item em { display: block; margin-top: 5px; color: rgba(239,242,250,.58); font-style: normal; line-height: 1.25; }

.sfa-ask-card {
  display: grid;
  align-content: start;
  gap: 13px;
  padding: 22px;
  background:
    radial-gradient(circle at 0% 0%, rgba(138,180,248,.13), transparent 45%),
    radial-gradient(circle at 100% 0%, rgba(245,199,107,.10), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.018)),
    rgba(4,5,11,.76);
}

.sfa-ask-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.sfa-ask-head span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: rgba(245,199,107,.88);
}

.sfa-ask-head img { width: 22px; height: 22px; }

.sfa-ask-head strong {
  max-width: 260px;
  color: #fff;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif);
  font-size: clamp(32px, 4vw, 48px);
  line-height: .88;
  letter-spacing: .035em;
  text-transform: uppercase;
  text-align: right;
}

.sfa-ask-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.sfa-ask-input {
  width: 100%;
  min-width: 0;
  min-height: 48px;
  padding: 0 15px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.13);
  color: #fff;
  background: rgba(0,0,0,.30);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
  font-size: 16px;
  font-weight: 750;
  outline: none;
}

.sfa-ask-input::placeholder { color: rgba(239,242,250,.42); }
.sfa-ask-input:focus { border-color: rgba(245,199,107,.42); box-shadow: 0 0 0 3px rgba(245,199,107,.10), inset 0 1px 0 rgba(255,255,255,.08); }

.sfa-ask-submit,
.sfa-open-vault {
  appearance: none;
  min-height: 48px;
  padding: 0 16px;
  border-radius: 16px;
  border: 1px solid rgba(245,199,107,.24);
  color: #111;
  background: linear-gradient(180deg, var(--stats-facts-gold), var(--stats-facts-gold-deep));
  font-family: var(--font-stat, Inter, sans-serif);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 11px 22px rgba(245,199,107,.13);
}

.sfa-quick-prompts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.sfa-quick-prompts a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 11px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(239,242,250,.72);
  background: rgba(0,0,0,.20);
  font-family: var(--font-stat, Inter, sans-serif);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .10em;
  text-transform: uppercase;
  text-decoration: none;
}

.sfa-open-vault {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: max-content;
  max-width: 100%;
}

@keyframes sfaFade {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 980px) {
  .formula-powered-archive { grid-template-columns: 1fr; text-align: center; }
  .formula-powered-brand,
  .formula-powered-gemini { justify-content: center; text-align: center; }
  .formula-powered-gemini { flex-direction: row-reverse; }
  .stats-facts-head { grid-template-columns: 1fr; text-align: left !important; }
  .stats-facts-head p { justify-self: start; text-align: left; }
  .sfa-topline { flex-direction: column; }
  .sfa-powered-badge { flex: 1 1 auto; grid-template-columns: auto 1fr; justify-content: start; place-items: center start; }
  .sfa-body { grid-template-columns: 1fr; }
  .sfa-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sfa-leader-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  :root {
    --scsl-fixed-topbar-h: 40px;
    --scsl-fixed-ticker-h: 0px;
    --scsl-fixed-header-h: 40px;
  }
  body { padding-top: var(--scsl-fixed-header-h) !important; }
  .broadcast-bar { height: var(--scsl-fixed-topbar-h) !important; min-height: var(--scsl-fixed-topbar-h) !important; }
  .mobile-jump-nav { top: var(--scsl-fixed-header-h) !important; z-index: 2147482500 !important; gap: 7px !important; padding: 8px 10px !important; }
  .mobile-jump-nav a { flex: 0 0 auto !important; min-width: 78px !important; padding: 8px 10px !important; font-size: 11px !important; }
  section, [id] { scroll-margin-top: calc(var(--scsl-fixed-header-h) + 52px) !important; }

  .stats-facts-panel { padding: 18px 14px !important; border-radius: 24px !important; }
  .stats-facts-head { margin-bottom: 13px !important; gap: 8px !important; }
  .stats-facts-head h2 { font-size: clamp(40px, 14vw, 64px) !important; }
  .stats-facts-head p { font-size: 13px !important; }
  .stats-facts-kicker { font-size: 9px; padding: 5px 9px 4px; }

  .sfa-title-card { padding: 15px; border-radius: 20px; }
  .sfa-title-card h3 { font-size: clamp(34px, 12vw, 52px); }
  .sfa-powered-badge { padding: 12px; border-radius: 18px; }

  .sfa-metrics {
    display: flex;
    overflow-x: auto;
    gap: 9px;
    padding-bottom: 2px;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .sfa-metrics::-webkit-scrollbar { display: none; }
  .sfa-metric { flex: 0 0 150px; scroll-snap-align: start; padding: 13px; }
  .sfa-metric strong { font-size: 38px; }

  .sfa-tabs { padding: 8px; }
  .sfa-tabs button { padding: 8px 11px 7px; font-size: 10px; }
  .sfa-pane { min-height: 0; padding: 17px 16px 16px; }
  .sfa-pane h4 { font-size: clamp(30px, 10vw, 42px); }
  .sfa-pane p, .sfa-title-card p, .sfa-ask-card p { font-size: 13px; }
  .sfa-receipt-row, .sfa-champion-row, .sfa-leader-grid { grid-template-columns: 1fr; }

  .sfa-ask-card { padding: 17px; border-radius: 22px; }
  .sfa-ask-head { display: grid; gap: 8px; }
  .sfa-ask-head strong { text-align: left; max-width: none; font-size: clamp(36px, 12vw, 52px); }
  .sfa-ask-form { grid-template-columns: 1fr; }
  .sfa-ask-submit { width: 100%; }
  .sfa-quick-prompts { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .sfa-quick-prompts::-webkit-scrollbar { display: none; }
  .sfa-quick-prompts a { flex: 0 0 auto; }
  .sfa-open-vault { width: 100%; }
}


/* =========================================================
   V3 UI REPAIR — cleaner desktop/mobile Stats & Facts hub
   Compact archive snapshot + full Ask Archive module.
========================================================= */
.stats-facts-panel {
  max-width: min(1120px, calc(100vw - 32px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: clamp(24px, 3.2vw, 42px) !important;
}

.stats-facts-head {
  display: grid !important;
  grid-template-columns: minmax(320px, .9fr) minmax(360px, 1fr) !important;
  align-items: end !important;
  gap: clamp(18px, 3vw, 38px) !important;
  padding-bottom: 20px !important;
  margin-bottom: 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
}

.stats-facts-head h2 {
  max-width: 480px !important;
  margin: 0 !important;
  font-size: clamp(48px, 5.2vw, 82px) !important;
  line-height: .9 !important;
  letter-spacing: .045em !important;
}

.stats-facts-head p {
  max-width: 520px !important;
  justify-self: end !important;
  margin: 0 !important;
  text-align: right !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
}

.sfa-shell.sfa-v4 {
  max-width: 100% !important;
  gap: 16px !important;
}

.sfa-shell.sfa-v4 .sfa-topline,
.sfa-topline { display: none !important; }

.sfa-metrics {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin: 0 !important;
}

.sfa-metric {
  min-height: 118px !important;
  padding: 16px 14px !important;
  border-radius: 22px !important;
  text-align: left !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.22), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.025)),
    rgba(6,7,13,.86) !important;
}

.sfa-metric strong {
  display: block !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif) !important;
  font-size: clamp(42px, 4.2vw, 64px) !important;
  line-height: .86 !important;
  letter-spacing: .035em !important;
  color: #f7ce76 !important;
  text-shadow: 0 14px 28px rgba(0,0,0,.42) !important;
}

.sfa-metric span {
  display: block !important;
  margin-top: 8px !important;
  color: #fff !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
}

.sfa-metric em {
  display: block !important;
  margin-top: 4px !important;
  color: rgba(235,238,248,.54) !important;
  font-size: 9px !important;
  line-height: 1.2 !important;
}

.sfa-body.sfa-body-v4,
.sfa-body {
  display: grid !important;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr) !important;
  gap: 16px !important;
  align-items: stretch !important;
}

.sfa-tabs-card,
.sfa-ask-card {
  min-height: 300px !important;
  border-radius: 26px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.018)),
    rgba(2,3,8,.72) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 22px 48px rgba(0,0,0,.26) !important;
}

.sfa-tabs-card { padding: 14px !important; }
.sfa-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 0 14px !important;
}

.sfa-tabs button {
  flex: 0 0 auto !important;
  min-height: 34px !important;
  padding: 0 13px !important;
  border-radius: 999px !important;
  font-size: 9px !important;
}

.sfa-pane {
  display: none !important;
  min-height: 212px !important;
  padding: clamp(18px, 2.1vw, 26px) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.08), transparent 42%),
    rgba(0,0,0,.22) !important;
}

.sfa-pane.active { display: grid !important; align-content: center !important; }

.sfa-pane h4 {
  max-width: 680px !important;
  margin: 0 0 10px !important;
  color: #fff !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif) !important;
  font-size: clamp(30px, 3.3vw, 54px) !important;
  line-height: .94 !important;
  letter-spacing: .045em !important;
  text-transform: uppercase !important;
}

.sfa-pane p {
  max-width: 720px !important;
  margin: 0 0 18px !important;
  color: rgba(235,238,248,.72) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

.sfa-receipt-row,
.sfa-champion-row,
.sfa-leader-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.sfa-leader-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }

.sfa-receipt-row span,
.sfa-champion-row span,
.sfa-leader-item {
  display: grid !important;
  gap: 4px !important;
  padding: 12px !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.075) !important;
}

.sfa-receipt-row strong,
.sfa-champion-row strong,
.sfa-leader-item strong {
  color: #f7ce76 !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif) !important;
  font-size: clamp(24px, 2.4vw, 34px) !important;
  line-height: .9 !important;
  letter-spacing: .04em !important;
}

.sfa-receipt-row em,
.sfa-champion-row em,
.sfa-leader-item em {
  color: rgba(235,238,248,.62) !important;
  font-size: 9px !important;
  line-height: 1.25 !important;
}

.sfa-ask-card {
  display: grid !important;
  align-content: start !important;
  gap: 14px !important;
  padding: clamp(20px, 2.4vw, 28px) !important;
  background:
    radial-gradient(circle at 90% 0%, rgba(138,180,248,.18), transparent 42%),
    radial-gradient(circle at 0% 100%, rgba(245,199,107,.11), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.018)),
    rgba(3,4,10,.78) !important;
}

.sfa-ask-head {
  display: grid !important;
  gap: 8px !important;
}

.sfa-ask-head span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: max-content !important;
  max-width: 100% !important;
  color: rgba(245,199,107,.90) !important;
}

.sfa-ask-head span img { width: 22px !important; height: 22px !important; }
.sfa-ask-head strong {
  color: #fff !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif) !important;
  font-size: clamp(34px, 3.2vw, 52px) !important;
  line-height: .9 !important;
  letter-spacing: .045em !important;
  text-transform: uppercase !important;
}

.sfa-ask-card p {
  margin: 0 !important;
  color: rgba(235,238,248,.72) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

.sfa-ask-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 8px !important;
}

.sfa-ask-input {
  min-height: 48px !important;
  font-size: 16px !important;
  border-radius: 16px !important;
}

.sfa-ask-submit {
  min-height: 48px !important;
  padding: 0 18px !important;
  border-radius: 16px !important;
}

.sfa-quick-prompts {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.sfa-quick-prompts a,
.sfa-open-vault {
  min-height: 32px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}

.sfa-open-vault {
  justify-self: start !important;
  margin-top: 2px !important;
}

.sfa-powered-badge { display: none !important; }

@media (max-width: 860px) {
  .stats-facts-panel { max-width: calc(100vw - 22px) !important; padding: 22px 14px !important; }
  .stats-facts-head { grid-template-columns: 1fr !important; text-align: left !important; gap: 10px !important; }
  .stats-facts-head h2 { font-size: clamp(42px, 13vw, 68px) !important; }
  .stats-facts-head p { justify-self: start !important; text-align: left !important; font-size: 14px !important; }
  .sfa-metrics { display: flex !important; overflow-x: auto !important; padding-bottom: 4px !important; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
  .sfa-metric { flex: 0 0 148px !important; min-height: 112px !important; scroll-snap-align: start; }
  .sfa-body.sfa-body-v4, .sfa-body { grid-template-columns: 1fr !important; }
  .sfa-tabs { overflow-x: auto !important; flex-wrap: nowrap !important; padding-bottom: 4px !important; }
  .sfa-pane h4 { font-size: clamp(30px, 10vw, 44px) !important; }
  .sfa-receipt-row, .sfa-champion-row, .sfa-leader-grid { grid-template-columns: 1fr !important; }
  .sfa-ask-form { grid-template-columns: 1fr !important; }
  .sfa-ask-submit { width: 100% !important; }
}

/* ===== assets/legacy-score-gpt.css ===== */
/* =========================================================
   LegacyScore-GPT™ · Apple-style archive assistant
   Scoped to the SCSL15 Stat Vault only.
========================================================= */

.legacy-gpt-card {
  position: relative;
  overflow: hidden;
  margin: 16px 0 18px;
  padding: clamp(17px, 2.4vw, 24px);
  border: 1px solid rgba(245,199,107,.20);
  border-radius: 28px;
  background:
    radial-gradient(circle at 10% 0%, rgba(245,199,107,.14), transparent 31%),
    radial-gradient(circle at 92% 8%, rgba(138,180,248,.16), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.072), rgba(255,255,255,.022)),
    rgba(3,4,10,.82);
  box-shadow:
    0 28px 80px rgba(0,0,0,.36),
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 0 50px rgba(245,199,107,.035);
  isolation: isolate;
}

.legacy-gpt-card::before {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  pointer-events: none;
  z-index: -1;
  background:
    linear-gradient(130deg, rgba(255,255,255,.13), transparent 24%, transparent 76%, rgba(245,199,107,.08)),
    radial-gradient(circle at 48% 0%, rgba(255,255,255,.08), transparent 42%);
  opacity: .72;
}

.legacy-gpt-card::after {
  content: "";
  position: absolute;
  top: -48%;
  bottom: -48%;
  left: -52%;
  width: 22%;
  transform: rotate(18deg) translateX(-120%);
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.13), rgba(245,199,107,.10), transparent);
  animation: scslLegacyGptSheen 12s ease-in-out infinite;
}

.legacy-gpt-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
  margin-bottom: 10px;
}

.legacy-gpt-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.legacy-gpt-mark {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.13);
  background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.035));
  box-shadow:
    0 16px 44px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.12);
}

.legacy-gpt-mark img,
.legacy-gpt-input-mark img {
  display: block;
  width: 21px;
  height: 21px;
}

.legacy-gpt-kicker {
  display: inline-flex;
  align-items: center;
  width: max-content;
  max-width: 100%;
  margin: 0 0 5px;
  color: rgba(245,199,107,.90);
  font-family: var(--font-stat, Inter, sans-serif);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.legacy-gpt-card h3 {
  margin: 0;
  color: #fff;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif);
  font-size: clamp(36px, 5.2vw, 58px);
  line-height: .88;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.legacy-gpt-lede,
.legacy-gpt-card p {
  margin: 0;
  color: rgba(232,235,246,.78);
  font-size: 14px;
  line-height: 1.55;
}

.legacy-gpt-lede {
  max-width: 900px;
  margin: 8px 0 15px;
}

.legacy-gpt-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 999px;
  color: rgba(255,255,255,.88);
  background: rgba(255,255,255,.065);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: .10em;
  text-transform: uppercase;
  white-space: nowrap;
}

.legacy-gpt-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  margin-top: 12px;
}

.legacy-gpt-input-shell {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  min-width: 0;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 18px;
  padding: 0 14px;
  background: rgba(0,0,0,.31);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 0 0 1px rgba(245,199,107,0);
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.legacy-gpt-input-shell:focus-within {
  border-color: rgba(245,199,107,.50);
  box-shadow:
    0 0 0 3px rgba(245,199,107,.11),
    inset 0 1px 0 rgba(255,255,255,.08);
  background: rgba(0,0,0,.38);
}

.legacy-gpt-input-mark {
  display: grid;
  place-items: center;
  margin-right: 10px;
  opacity: .88;
}

.legacy-gpt-input {
  width: 100%;
  min-width: 0;
  border: 0;
  padding: 15px 0;
  color: rgba(255,255,255,.94);
  background: transparent;
  font: 760 14px/1.25 var(--font-body, Inter, sans-serif);
  outline: none;
}

.legacy-gpt-input::placeholder {
  color: rgba(232,235,246,.46);
}

.legacy-gpt-submit,
.legacy-gpt-prompt {
  border: 1px solid rgba(245,199,107,.27);
  border-radius: 18px;
  font-family: var(--font-stat, Inter, sans-serif);
  font-weight: 950;
  letter-spacing: .09em;
  text-transform: uppercase;
  cursor: pointer;
}

.legacy-gpt-submit {
  min-height: 52px;
  padding: 0 20px;
  color: #0b0b0e;
  background: linear-gradient(180deg, #f7cf76, #bb8730);
  box-shadow: 0 16px 38px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.35);
  white-space: nowrap;
}

.legacy-gpt-submit:disabled {
  cursor: wait;
  opacity: .72;
}

.legacy-gpt-prompts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.legacy-gpt-prompt {
  padding: 8px 11px;
  border-color: rgba(255,255,255,.12);
  color: rgba(245,199,107,.94);
  background: rgba(255,255,255,.055);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
  font-size: 10.5px;
}

.legacy-gpt-answer {
  margin-top: 14px;
  padding: 15px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 20px;
  background: rgba(0,0,0,.24);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

.legacy-gpt-answer-label {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 7px;
  color: rgba(245,199,107,.92);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.legacy-gpt-answer p {
  margin: 0;
  white-space: pre-wrap;
  color: rgba(245,247,255,.88);
  font-size: 14px;
  line-height: 1.62;
}

.legacy-gpt-answer.loading p::after {
  content: "";
  display: inline-block;
  width: 1.1em;
  text-align: left;
  animation: scslGptDots 1.2s steps(4,end) infinite;
}

.legacy-gpt-footnote {
  display: none !important;
}

@keyframes scslLegacyGptSheen {
  0%, 36% { transform: rotate(18deg) translateX(-130%); opacity: 0; }
  48% { opacity: .42; }
  64% { transform: rotate(18deg) translateX(640%); opacity: 0; }
  100% { transform: rotate(18deg) translateX(640%); opacity: 0; }
}

@keyframes scslGptDots {
  0% { content: ""; }
  25% { content: "."; }
  50% { content: ".."; }
  75%, 100% { content: "..."; }
}

.legacy-gpt-answer.error {
  border-color: rgba(201,31,46,.30);
  background: rgba(201,31,46,.08);
}

.legacy-gpt-answer.error .legacy-gpt-answer-label {
  color: rgba(255,145,145,.94);
}

@media (max-width: 760px) {
  .legacy-gpt-card {
    margin: 14px 0 15px;
    padding: 16px 14px;
    border-radius: 22px;
  }

  .legacy-gpt-head {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .legacy-gpt-brand {
    gap: 10px;
  }

  .legacy-gpt-mark {
    width: 38px;
    height: 38px;
    border-radius: 14px;
  }

  .legacy-gpt-card h3 {
    font-size: clamp(34px, 10.2vw, 46px);
  }

  .legacy-gpt-badge {
    justify-self: start;
    padding: 7px 10px;
    font-size: 10px;
  }

  .legacy-gpt-lede {
    margin-top: 7px;
    margin-bottom: 13px;
    font-size: 13.6px;
  }

  .legacy-gpt-form {
    grid-template-columns: minmax(0, 1fr) 74px;
    gap: 8px;
  }

  .legacy-gpt-input-shell {
    padding: 0 12px;
    border-radius: 17px;
  }

  .legacy-gpt-input-mark {
    margin-right: 8px;
  }

  .legacy-gpt-input-mark img {
    width: 18px;
    height: 18px;
  }

  .legacy-gpt-input {
    padding: 13px 0;
    font-size: 13px;
  }

  .legacy-gpt-submit {
    min-height: 48px;
    padding: 0 10px;
    font-size: 10.5px;
    border-radius: 17px;
  }

  .legacy-gpt-prompts {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0 2px 5px;
    margin-left: -2px;
    margin-right: -2px;
    scrollbar-width: none;
  }

  .legacy-gpt-prompts::-webkit-scrollbar {
    display: none;
  }

  .legacy-gpt-prompt {
    flex: 0 0 auto;
    white-space: nowrap;
    padding: 8px 10px;
  }

  .legacy-gpt-answer {
    padding: 14px;
    border-radius: 18px;
  }
}

@media (max-width: 360px) {
  .legacy-gpt-form {
    grid-template-columns: 1fr;
  }

  .legacy-gpt-submit {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .legacy-gpt-card::after,
  .legacy-gpt-answer.loading p::after {
    animation: none !important;
  }
}

/* =========================================================
   Final language/layout polish · LegacyScore-GPT™
   Product-like, restrained, mobile-safe.
========================================================= */

.legacy-gpt-card {
  margin: 14px 0 18px !important;
  padding: clamp(16px, 2vw, 22px) !important;
  border-radius: 26px !important;
  border-color: rgba(255,255,255,.13) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(245,199,107,.11), transparent 34%),
    radial-gradient(circle at 92% 6%, rgba(125,160,255,.13), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.018)),
    rgba(3,4,10,.84) !important;
}

.legacy-gpt-card::after {
  opacity: .18 !important;
}

.legacy-gpt-head {
  align-items: center !important;
  margin-bottom: 9px !important;
}

.legacy-gpt-mark {
  width: 40px !important;
  height: 40px !important;
  border-radius: 15px !important;
}

.legacy-gpt-card h3 {
  font-size: clamp(34px, 4.7vw, 52px) !important;
  letter-spacing: .032em !important;
}

.legacy-gpt-kicker {
  margin-bottom: 4px !important;
  color: rgba(245,199,107,.84) !important;
  letter-spacing: .13em !important;
}

.legacy-gpt-badge {
  padding: 7px 11px !important;
  color: rgba(235,238,248,.82) !important;
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.10) !important;
}

.legacy-gpt-lede {
  max-width: 760px !important;
  margin: 6px 0 13px !important;
  color: rgba(232,235,246,.72) !important;
}

.legacy-gpt-form {
  grid-template-columns: minmax(0, 1fr) 82px !important;
  gap: 9px !important;
}

.legacy-gpt-input-shell {
  min-width: 0 !important;
  border-radius: 17px !important;
  border-color: rgba(255,255,255,.13) !important;
  background: rgba(0,0,0,.28) !important;
}

.legacy-gpt-input {
  min-width: 0 !important;
  font-weight: 720 !important;
}

.legacy-gpt-submit {
  min-height: 50px !important;
  padding: 0 14px !important;
  border-radius: 17px !important;
  letter-spacing: .075em !important;
}

.legacy-gpt-prompts {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin-top: 11px !important;
  overflow: visible !important;
  padding: 0 !important;
}

.legacy-gpt-prompt {
  padding: 7px 10px !important;
  border-radius: 999px !important;
  border-color: rgba(255,255,255,.11) !important;
  color: rgba(235,238,248,.80) !important;
  background: rgba(255,255,255,.045) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
  font-size: 10.2px !important;
  letter-spacing: .075em !important;
}

.legacy-gpt-prompt:hover {
  border-color: rgba(245,199,107,.28) !important;
  color: rgba(245,199,107,.94) !important;
  background: rgba(245,199,107,.065) !important;
}

.legacy-gpt-answer {
  margin-top: 13px !important;
  padding: 14px !important;
  border-radius: 18px !important;
  background: rgba(0,0,0,.22) !important;
}

.legacy-gpt-answer-label {
  margin-bottom: 6px !important;
  letter-spacing: .13em !important;
}

@media (max-width: 760px) {
  .legacy-gpt-card {
    padding: 15px 13px !important;
    border-radius: 21px !important;
  }

  .legacy-gpt-head {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  .legacy-gpt-card h3 {
    font-size: clamp(30px, 9.8vw, 41px) !important;
  }

  .legacy-gpt-lede {
    font-size: 13.4px !important;
    line-height: 1.48 !important;
  }

  .legacy-gpt-form,
  .legacy-gpt-form:where(*) {
    grid-template-columns: minmax(0, 1fr) 72px !important;
    gap: 8px !important;
  }

  .legacy-gpt-input-shell {
    padding: 0 10px !important;
  }

  .legacy-gpt-input {
    font-size: 12.7px !important;
    padding: 12px 0 !important;
  }

  .legacy-gpt-submit {
    min-height: 46px !important;
    width: auto !important;
    padding: 0 8px !important;
  }

  .legacy-gpt-prompts {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    overflow: visible !important;
    gap: 7px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
  }

  .legacy-gpt-prompt {
    min-width: 0 !important;
    width: 100% !important;
    white-space: nowrap !important;
    text-align: center !important;
    padding: 8px 7px !important;
  }
}

@media (max-width: 360px) {
  .legacy-gpt-form,
  .legacy-gpt-form:where(*) {
    grid-template-columns: minmax(0, 1fr) 68px !important;
  }

  .legacy-gpt-prompt {
    font-size: 9.7px !important;
    letter-spacing: .055em !important;
  }
}

/* ===== assets/opening-screen-button-fix.css ===== */
/* ===== SCSL15 opening screen button fix =====
   Keeps the mobile section jump buttons from covering the music prompt.
   Surgical: only active while #musicIntro exists/open.
*/

#musicIntro.music-intro {
  z-index: 2147483600 !important;
  isolation: isolate !important;
  pointer-events: auto !important;
}

#musicIntro .music-intro-card,
#musicIntro .music-intro-actions,
#musicIntro .intro-primary,
#musicIntro .intro-secondary,
#musicIntro .music-intro-note {
  position: relative !important;
  z-index: 2 !important;
}

body.music-intro-open {
  overflow: hidden !important;
}

body.music-intro-open .mobile-jump-nav,
body:has(#musicIntro:not(.hide)) .mobile-jump-nav {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

@media (max-width: 760px) {
  #musicIntro.music-intro {
    padding: max(12px, env(safe-area-inset-top)) 12px max(18px, env(safe-area-inset-bottom)) !important;
    align-items: center !important;
  }

  #musicIntro .music-intro-card {
    width: min(94vw, 560px) !important;
    max-height: calc(100dvh - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
    padding: 22px 16px 20px !important;
    overflow: hidden !important;
  }

  #musicIntro .enter-logo {
    width: min(390px, 86vw) !important;
    max-height: 128px !important;
    margin-bottom: 16px !important;
  }

  #musicIntro .music-intro-card p {
    font-size: clamp(15px, 4.2vw, 18px) !important;
    line-height: 1.38 !important;
    margin-bottom: 16px !important;
  }

  #musicIntro .music-intro-actions {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  #musicIntro .intro-primary,
  #musicIntro .intro-secondary {
    width: 100% !important;
    min-width: 0 !important;
    padding: 12px 10px !important;
    font-size: clamp(12px, 3.4vw, 14px) !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
  }

  #musicIntro .music-intro-note {
    margin-top: 16px !important;
    font-size: clamp(11px, 3.4vw, 13px) !important;
    line-height: 1.35 !important;
  }
}

@media (max-width: 390px) {
  #musicIntro .music-intro-actions {
    grid-template-columns: 1fr !important;
  }
}

/* ===== Mobile jump nav centering fix =====
   Keeps the four section buttons centered/even on the opening viewport.
   Surgical override for the last linked stylesheet.
*/
@media (max-width: 760px) {
  .mobile-jump-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow-x: visible !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .mobile-jump-nav a {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    max-width: 112px !important;
    text-align: center !important;
  }
}


/* ===== iOS Safari dark chrome hint =====
   The real Safari URL/status UI is system-controlled, but these tags/CSS
   give iOS the strongest dark-site signal and keep overscroll edges black.
*/
:root {
  color-scheme: dark !important;
}

html,
body {
  background-color: #020307 !important;
}

@media (max-width: 760px) {
  html,
  body {
    background: #020307 !important;
    min-height: 100% !important;
  }
}

/* ===== assets/final-consistency-font-polish.css ===== */
/* =========================================================
   SCSL15 FINAL CONSISTENCY + FONT POLISH LOCK
   Last stylesheet only. No rankings, data, music, or effects logic changes.
========================================================= */

:root {
  --font-body: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Bebas Neue", Impact, "Arial Narrow", sans-serif;
  --font-stat: "Rajdhani", "Inter", ui-sans-serif, system-ui, sans-serif;
  --scsl-body-copy: rgba(220, 224, 238, .78);
  --scsl-muted-copy: rgba(176, 183, 202, .76);
  --scsl-gold: #f5c76b;
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
  color-scheme: dark;
  background-color: #020307 !important;
}

body {
  font-family: var(--font-body) !important;
  font-weight: 500;
  letter-spacing: normal;
  background-color: #020307 !important;
}

/* Display type: league/title/player moments */
h1,
h2,
h3,
.section-head h2,
.formula-panel h2,
#top15 h2,
#statsFactsTitle,
#database h2,
#top15Grid .card .player,
.spotlight-name,
.stats-facts-card h3,
.secret-do-not-touch-btn span,
.scsl-broken-title {
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  text-transform: uppercase;
  letter-spacing: .052em !important;
  line-height: .96 !important;
}

/* Body copy stays readable, not stat-font cramped */
p,
.sub,
.hero-sub,
.section-head p,
.formula-note,
.formula-card p,
.legacy-why,
.legacy-details,
.legacy-details p,
.stats-facts-card p,
.stats-facts-loading,
.music-intro-card p,
.music-intro-note,
.ai-context-note,
.recap-note,
footer {
  font-family: var(--font-body) !important;
  font-weight: 500 !important;
  letter-spacing: normal !important;
  line-height: 1.5 !important;
  color: var(--scsl-body-copy) !important;
}

/* Stat/UI type: buttons, labels, chips, table, short HUD text */
button,
[role="button"],
.broadcast-live,
.broadcast-title,
.broadcast-right,
.eyebrow,
.hero-chips span,
.music-btn,
.mobile-jump-nav a,
.legacy-intro-btn,
.intro-primary,
.intro-secondary,
.pill,
.chip,
.badge,
.rank,
.mobile-card-score,
.mobile-card-score span,
.formula-label,
.formula-value,
.formula-detail-hint,
.legacy-details-title,
.score-row,
.score-row span,
.score-row small,
.honor-chip,
.top15-team-line,
.top15-team-label,
.top15-team-name,
.mobile-expand-hint,
.spotlight-kicker,
.spotlight-rank,
.spotlight-score,
.spotlight-label,
.spotlight-mini,
.stats-facts-kicker,
.stats-facts-card-label,
.stats-facts-mini-label,
.stats-facts-mini-value,
.stats-facts-leaders,
.stats-facts-teams,
.stats-rank,
.recap-label,
.recap-value,
.db-chip,
.search-box,
#playersTable,
#playersTable th,
#playersTable td {
  font-family: var(--font-stat) !important;
  font-weight: 800;
  letter-spacing: .065em;
  font-variant-numeric: tabular-nums !important;
}

/* Keep big numeric moments premium and consistent */
.mobile-card-score strong,
.spotlight-score,
.stats-facts-big,
.stats-facts-mini-value,
.recap-value,
#playersTable td[data-col="SCSL15_score"] {
  font-variant-numeric: tabular-nums !important;
  letter-spacing: .035em !important;
}

/* Section rhythm polish */
.panel {
  scroll-margin-top: calc(var(--scsl-fixed-header-h, 44px) + 58px) !important;
}

.section-head {
  gap: 16px !important;
}

.section-head h2 {
  text-wrap: balance;
}

.section-head p {
  max-width: 520px;
}

/* Top 15 cards: protect names/teams from mixed font behavior */
#top15Grid .card .player {
  max-width: 100% !important;
  text-wrap: balance;
  overflow-wrap: anywhere;
  word-break: normal;
}

#top15Grid .card .stats,
#top15Grid .card .top15-team-line,
#top15Grid .card .mobile-card-score {
  text-transform: uppercase;
}

#top15Grid .legacy-details-title {
  color: rgba(255, 233, 170, .92) !important;
}

#top15Grid .legacy-why {
  color: rgba(226, 230, 240, .80) !important;
}

/* AI score/formula consistency */
.formula-main span,
.formula-main strong {
  font-family: var(--font-stat) !important;
  letter-spacing: .08em !important;
}

.formula-card .formula-label,
.stats-facts-card-label {
  color: rgba(245, 199, 107, .82) !important;
}

.formula-card .formula-value {
  color: rgba(255, 248, 224, .96) !important;
}

/* Stats & Facts cards */
.stats-facts-card h3 {
  text-wrap: balance;
}

.stats-facts-leaders li,
.stats-facts-teams li {
  align-items: center;
}

.stats-facts-leaders strong,
.stats-facts-teams strong {
  letter-spacing: .035em !important;
}

/* Database: mobile-safe, consistent stat-vault typography */
#database .search-box {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

#database .database-chips {
  align-items: center !important;
}

#database .table-wrap {
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch !important;
}

#playersTable th {
  text-transform: uppercase;
}

#playersTable td[data-col="Player"] {
  font-weight: 900 !important;
  letter-spacing: .035em !important;
}

#playersTable td[data-col="Honors"] {
  font-family: var(--font-body) !important;
  font-weight: 600 !important;
  letter-spacing: normal !important;
}

/* Opening/music prompt stays on-brand */
#musicIntro .music-intro-card p {
  color: rgba(232, 235, 245, .86) !important;
}

#musicIntro .intro-primary,
#musicIntro .intro-secondary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

/* Mobile polish: center headings, keep nav/buttons even, prevent tiny text drift */
@media (max-width: 760px) {
  body {
    -webkit-text-size-adjust: 100%;
  }

  .broadcast-title {
    letter-spacing: .12em !important;
  }

  .section-head {
    display: block !important;
    text-align: center !important;
  }

  .section-head p {
    max-width: 100% !important;
    margin: 8px auto 0 !important;
    text-align: center !important;
    font-size: 13px !important;
  }

  h2,
  .section-head h2,
  #statsFactsTitle,
  #database h2 {
    font-size: clamp(30px, 9vw, 44px) !important;
    line-height: .92 !important;
    letter-spacing: .055em !important;
  }

  .mobile-jump-nav {
    justify-content: center !important;
    gap: 8px !important;
    padding-left: max(10px, env(safe-area-inset-left)) !important;
    padding-right: max(10px, env(safe-area-inset-right)) !important;
  }

  .mobile-jump-nav a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    min-height: 44px !important;
    padding: 9px 8px !important;
    font-size: clamp(10.5px, 3.05vw, 12px) !important;
    line-height: 1 !important;
    letter-spacing: .075em !important;
    white-space: nowrap !important;
  }

  #top15Grid .card .player {
    font-size: clamp(30px, 7.8vw, 42px) !important;
    line-height: .92 !important;
    letter-spacing: .045em !important;
  }

  .top15-team-line,
  .pill,
  .mobile-card-score span,
  .mobile-expand-hint {
    font-size-adjust: none;
  }

  .stats-facts-card p,
  .legacy-why,
  .formula-card p {
    font-size: 13.5px !important;
    line-height: 1.48 !important;
  }

  #database .database-chips {
    justify-content: center !important;
  }

  #database .search-box {
    font-size: 16px !important; /* prevents iOS input zoom */
    letter-spacing: .025em !important;
  }

  #playersTable th,
  #playersTable td {
    line-height: 1.18 !important;
  }
}

@media (max-width: 390px) {
  .mobile-jump-nav {
    gap: 6px !important;
  }

  .mobile-jump-nav a {
    font-size: 10.5px !important;
    letter-spacing: .06em !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
  }
}


/* =========================================================
   SCSL15 TOP 15 MOBILE TEXT + TEAM DATA POLISH
   Loaded last. Visual/text only: no ranking, scoring, music, or data logic changes.
========================================================= */

#top15Grid .card .player {
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
  hyphens: none !important;
}

@media (max-width: 760px) {
  #top15Grid .card .player {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    overflow-wrap: normal !important;
    word-break: keep-all !important;
    text-wrap: nowrap !important;
    width: 100% !important;
    max-width: 100% !important;
    font-size: clamp(21px, 5.9vw, 31px) !important;
    line-height: .96 !important;
    letter-spacing: .028em !important;
  }

  #top15Grid .card.name-lg .player {
    font-size: clamp(19px, 5.35vw, 29px) !important;
    letter-spacing: .018em !important;
  }

  #top15Grid .card.name-xl .player {
    font-size: clamp(17px, 4.75vw, 26px) !important;
    letter-spacing: .006em !important;
  }

  #top15Grid .card .top15-team-line {
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    text-overflow: clip !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: 1px !important;
    gap: 4px !important;
  }

  #top15Grid .card .top15-team-line::-webkit-scrollbar {
    display: none !important;
  }

  #top15Grid .card .top15-team-line *,
  #top15Grid .card .top15-team-name,
  #top15Grid .card .top15-team-label,
  #top15Grid .card .top15-team-sep {
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: keep-all !important;
    line-height: 1 !important;
  }

  #top15Grid .card .top15-team-name {
    font-size: clamp(6.7px, 1.9vw, 8.4px) !important;
    letter-spacing: .035em !important;
  }

  #top15Grid .card .top15-team-label {
    font-size: clamp(6.5px, 1.85vw, 8px) !important;
  }

  #top15Grid .card .stats {
    gap: 6px !important;
  }

  #top15Grid .card .pill {
    font-size: clamp(10px, 2.85vw, 12px) !important;
    line-height: 1 !important;
    padding: 5px 8px !important;
  }

  #top15Grid .card .legacy-details-title {
    font-size: clamp(10px, 2.8vw, 12px) !important;
    line-height: 1.05 !important;
  }

  #top15Grid .card .legacy-why {
    font-size: 13px !important;
    line-height: 1.48 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }
}

@media (max-width: 430px) {
  #top15Grid .card .player {
    font-size: clamp(19px, 5.35vw, 25px) !important;
  }

  #top15Grid .card.name-lg .player {
    font-size: clamp(17px, 4.85vw, 22px) !important;
  }

  #top15Grid .card.name-xl .player {
    font-size: clamp(15.5px, 4.3vw, 20px) !important;
  }
}

/* ===== TOP 15 TEAM COLOR LOCK =====
   Individual team names now carry their own palette so 3+ team cards
   do not accidentally reuse only the first two team colors.
*/
#top15Grid .card .top15-team-name[style] {
  color: var(--scsl-chip-primary) !important;
  text-shadow:
    0 0 10px rgba(var(--scsl-chip-rgb), .46),
    0 0 22px rgba(var(--scsl-chip-rgb), .20) !important;
}

#top15Grid .card .top15-team-name.is-split-team-chip {
  color: var(--scsl-chip-primary) !important;
  background: linear-gradient(90deg, var(--scsl-chip-primary), var(--scsl-chip-secondary)) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
  filter: drop-shadow(0 0 8px rgba(var(--scsl-chip-rgb), .26)) drop-shadow(0 0 8px rgba(var(--scsl-chip-rgb2), .18));
}

/* ===== assets/scsl15-screen-architecture.css ===== */
/* =========================================================
   SCSL15 screen architecture polish
   - Homepage keeps LegacyScore-GPT visible as a lightweight feature card
   - Stat Vault gets its own screen with full chat/database
   - Mobile Safari input zoom + Do Not Touch safety overrides
========================================================= */

:root {
  --screen-panel-line: rgba(245, 199, 107, .18);
  --screen-soft-line: rgba(255, 255, 255, .12);
  --screen-ink: rgba(246, 247, 255, .92);
  --screen-muted: rgba(224, 228, 240, .68);
  --screen-gold: #f5c76b;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.broadcast-left a.broadcast-live,
footer a {
  color: inherit;
  text-decoration: none;
}

/* ---------- Homepage LegacyScore-GPT teaser ---------- */

.legacy-gpt-preview {
  position: relative !important;
  overflow: hidden !important;
  padding: clamp(18px, 3vw, 28px) !important;
  border-color: rgba(245,199,107,.24) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(245,199,107,.16), transparent 34%),
    radial-gradient(circle at 88% 5%, rgba(90,120,255,.16), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.018)),
    rgba(4,5,12,.88) !important;
}

.legacy-gpt-preview::before {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(125deg, rgba(255,255,255,.12), transparent 25%, transparent 76%, rgba(245,199,107,.08));
}

.legacy-gpt-preview-inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr);
  gap: clamp(18px, 3vw, 32px);
  align-items: center;
}

.legacy-gpt-preview-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  color: rgba(245,199,107,.92);
  font-family: var(--font-stat, Rajdhani, Inter, sans-serif);
  font-size: .76rem;
  font-weight: 950;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.legacy-gpt-preview-kicker img {
  width: 18px;
  height: 18px;
}

.legacy-gpt-preview h2 {
  margin: 0;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif);
  font-size: clamp(3.4rem, 7vw, 6.6rem) !important;
  line-height: .86 !important;
  letter-spacing: .045em !important;
  text-transform: uppercase;
}

.legacy-gpt-preview p {
  margin: 12px 0 0;
  max-width: 720px;
  color: var(--screen-muted);
  font-size: clamp(1rem, 1.3vw, 1.12rem);
  line-height: 1.55;
}

.legacy-gpt-preview-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 24px;
  background: rgba(0,0,0,.26);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
}

.legacy-gpt-preview-input {
  width: 100%;
  min-width: 0;
  border: 0;
  border-radius: 17px;
  padding: 16px 16px;
  color: var(--screen-ink);
  background: rgba(255,255,255,.055);
  outline: none;
  font: 750 16px/1.25 var(--font-body, Inter, sans-serif);
}

.legacy-gpt-preview-input::placeholder {
  color: rgba(225,229,242,.46);
}

.legacy-gpt-preview-submit,
.stat-vault-home-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  border: 1px solid rgba(245,199,107,.34);
  border-radius: 17px;
  padding: 0 20px;
  color: #0b0b0e;
  background: linear-gradient(180deg, #f7cf76, #bd8830);
  box-shadow: 0 16px 38px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.35);
  font-family: var(--font-stat, Rajdhani, Inter, sans-serif);
  font-size: .78rem;
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.legacy-gpt-preview-prompts {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.legacy-gpt-preview-prompts a,
.legacy-gpt-prompt,
.database-chips .db-chip {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  text-decoration: none;
  touch-action: manipulation;
}

.legacy-gpt-preview-prompts a,
.legacy-gpt-prompt {
  border: 1px solid rgba(255,255,255,.13) !important;
  color: rgba(245,199,107,.93) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.035)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
  padding: 9px 13px;
  font-family: var(--font-stat, Rajdhani, Inter, sans-serif);
  font-size: .72rem !important;
  font-weight: 950;
  letter-spacing: .11em !important;
  text-transform: uppercase;
  white-space: nowrap;
}

/* ---------- Homepage Stat Vault CTA ---------- */

.stat-vault-home-card {
  position: relative;
  overflow: hidden;
  border-color: rgba(245,199,107,.18) !important;
}

.stat-vault-home-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: clamp(16px, 2.5vw, 24px);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 22px;
  background: rgba(0,0,0,.22);
}

.stat-vault-home-kicker {
  color: rgba(245,199,107,.92);
  font-family: var(--font-stat, Rajdhani, Inter, sans-serif);
  font-size: .74rem;
  font-weight: 950;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.stat-vault-home-inner h3 {
  margin: 7px 0 6px;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif);
  font-size: clamp(2rem, 4vw, 3.6rem);
  letter-spacing: .04em;
  line-height: .9;
  text-transform: uppercase;
}

.stat-vault-home-inner p {
  margin: 0;
  color: var(--screen-muted);
  line-height: 1.55;
}

/* ---------- Stats & Facts official archive layout ---------- */

.stats-facts-panel {
  padding: clamp(18px, 2.6vw, 28px) !important;
}

.stats-facts-head {
  align-items: center !important;
  gap: 18px !important;
  border-bottom: 1px solid rgba(245,199,107,.16);
  padding-bottom: 16px;
  margin-bottom: 16px !important;
}

.stats-facts-head h2 {
  font-size: clamp(3rem, 5.2vw, 5.4rem) !important;
  line-height: .9 !important;
}

.stats-facts-head p {
  max-width: 520px;
  color: rgba(229,232,242,.68) !important;
}

.stats-facts-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.stats-facts-card {
  min-height: auto !important;
  padding: clamp(15px, 2vw, 20px) !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  border-radius: 22px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.072), rgba(255,255,255,.025)),
    rgba(3,4,10,.70) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.stats-facts-overview-card {
  grid-column: span 2;
}

.stats-facts-overview-layout {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(260px, 1fr);
  gap: 18px;
  align-items: end;
}

.stats-facts-big {
  font-size: clamp(4rem, 8vw, 7rem) !important;
  line-height: .78 !important;
  color: var(--screen-gold) !important;
}

.stats-facts-card h3 {
  margin: 8px 0 8px !important;
  font-size: clamp(1.8rem, 2.6vw, 3rem) !important;
  line-height: .94 !important;
  letter-spacing: .04em !important;
}

.stats-facts-card p,
.stats-facts-small-note {
  color: rgba(229,232,242,.68) !important;
  line-height: 1.48 !important;
}

.stats-facts-mini-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 9px !important;
}

.stats-facts-metric,
.stats-facts-mini-stat {
  border: 1px solid rgba(255,255,255,.105) !important;
  border-radius: 16px !important;
  padding: 11px 12px !important;
  background: rgba(0,0,0,.22) !important;
}

.stats-facts-metric span,
.stats-facts-mini-stat span {
  display: block;
  color: rgba(229,232,242,.55) !important;
  font-size: .68rem !important;
  font-weight: 900 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase;
}

.stats-facts-metric strong,
.stats-facts-mini-stat strong {
  display: block;
  margin-top: 3px;
  color: var(--screen-gold) !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif);
  font-size: clamp(1.55rem, 2.6vw, 2.35rem) !important;
  line-height: .9;
  letter-spacing: .045em;
}

.stats-facts-metric em,
.stats-facts-mini-stat em {
  display: block;
  margin-top: 2px;
  color: rgba(229,232,242,.66) !important;
  font-style: normal;
  font-size: .72rem;
}

.stats-facts-leaders,
.stats-facts-teams {
  display: grid;
  gap: 7px;
  margin: 12px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.stats-facts-leaders li,
.stats-facts-teams li {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center;
  gap: 10px;
  min-height: 40px;
  padding: 8px 10px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 14px !important;
  background: rgba(0,0,0,.20) !important;
}

.stats-facts-teams li {
  grid-template-columns: minmax(0, 1fr) auto !important;
}

.stats-facts-leaders li > span {
  width: 24px;
  height: 24px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  color: #100d08;
  background: linear-gradient(180deg, #f7cf76, #bc872f);
  font-weight: 950;
  font-size: .72rem;
}

.stats-facts-leaders strong,
.stats-facts-teams strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ---------- Full Stat Vault page ---------- */

body.stat-vault-page main {
  padding-top: 24px;
}

.stat-vault-screen {
  padding: clamp(18px, 3vw, 32px) !important;
}

.stat-vault-head .eyebrow {
  margin-bottom: 8px;
}

.stat-vault-head h2 {
  font-size: clamp(3rem, 6vw, 5.8rem) !important;
  line-height: .9 !important;
}

.legacy-gpt-full {
  margin-top: 18px !important;
}

.legacy-gpt-messages {
  display: grid;
  align-content: start;
  gap: 12px;
  max-height: min(52vh, 520px);
  min-height: 190px;
  overflow-y: auto;
  padding: 14px;
  margin: 14px 0 12px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 22px;
  background: rgba(0,0,0,.23);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
  overscroll-behavior: contain;
}

.legacy-gpt-empty {
  align-self: center;
  justify-self: center;
  display: grid;
  gap: 6px;
  max-width: 480px;
  color: rgba(229,232,242,.66);
  text-align: center;
  line-height: 1.45;
}

.legacy-gpt-empty strong {
  color: rgba(255,255,255,.88);
  font-size: 1.05rem;
}

.legacy-gpt-message {
  width: min(88%, 860px);
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  background: rgba(255,255,255,.045);
}

.legacy-gpt-message-user {
  justify-self: end;
  border-color: rgba(245,199,107,.22);
  background: rgba(245,199,107,.08);
}

.legacy-gpt-message-assistant {
  justify-self: start;
}

.legacy-gpt-message.error {
  border-color: rgba(201,31,46,.34);
  background: rgba(201,31,46,.10);
}

.legacy-gpt-message-label {
  margin-bottom: 5px;
  color: rgba(245,199,107,.92);
  font-family: var(--font-stat, Rajdhani, Inter, sans-serif);
  font-size: .68rem;
  font-weight: 950;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.legacy-gpt-message-body {
  white-space: pre-wrap;
  color: rgba(246,247,255,.88);
  font-size: 1rem;
  line-height: 1.58;
}

.legacy-gpt-message.loading .legacy-gpt-message-body::after {
  content: "";
  display: inline-block;
  animation: scslGptDots 1.2s steps(4,end) infinite;
}

/* Mobile Safari input zoom guard */
@media (max-width: 760px) {
  input,
  textarea,
  select,
  .legacy-gpt-input,
  .legacy-gpt-preview-input,
  #database .search-box {
    font-size: 16px !important;
  }
}

/* Do Not Touch iOS safe mode */
html.scsl-secret-meltdown-lite,
html.scsl-secret-meltdown-lite body {
  overflow-x: hidden !important;
}

html.scsl-secret-meltdown-lite body {
  animation: scslSecretIOSRumble 620ms cubic-bezier(.2,.9,.15,1) both !important;
  transform-origin: 50% 50% !important;
}

html.scsl-secret-meltdown-lite .scsl-broken-overlay {
  background:
    radial-gradient(circle at 50% 48%, rgba(210,20,20,.18), transparent 34%),
    linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.66)) !important;
}

html.scsl-secret-meltdown-lite .scsl-broken-lb {
  width: min(92vw, 460px) !important;
  max-height: 68vh !important;
  filter: drop-shadow(0 0 20px rgba(255,30,45,.34)) !important;
  animation: scslSafeLbReveal 1900ms ease-out both !important;
}

@keyframes scslSafeLbReveal {
  0% { opacity: 0; transform: translate3d(0, 10px, 0) scale(.94); }
  12% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
  78% { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: translate3d(0, -6px, 0) scale(.98); }
}

@media (max-width: 900px) {
  .legacy-gpt-preview-inner,
  .stats-facts-overview-layout,
  .stat-vault-home-inner {
    grid-template-columns: 1fr;
  }

  .stats-facts-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .stats-facts-overview-card {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  main {
    padding-left: max(14px, env(safe-area-inset-left)) !important;
    padding-right: max(14px, env(safe-area-inset-right)) !important;
  }

  .legacy-gpt-preview {
    border-radius: 24px !important;
  }

  .legacy-gpt-preview h2,
  .legacy-gpt-card h3,
  .stat-vault-head h2,
  .stats-facts-head h2 {
    font-size: clamp(2.75rem, 13vw, 4.15rem) !important;
    line-height: .9 !important;
    overflow-wrap: anywhere;
  }

  .legacy-gpt-preview-form,
  .legacy-gpt-form {
    grid-template-columns: 1fr !important;
  }

  .legacy-gpt-preview-submit,
  .legacy-gpt-submit,
  .stat-vault-home-button {
    width: 100%;
    min-height: 50px;
  }

  .legacy-gpt-preview-prompts,
  .legacy-gpt-prompts,
  #databaseChips {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    gap: 9px !important;
    padding-bottom: 6px !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
  }

  .legacy-gpt-preview-prompts a,
  .legacy-gpt-prompt,
  #databaseChips .db-chip {
    flex: 0 0 auto;
    scroll-snap-align: start;
    max-width: 82vw;
  }

  .stats-facts-grid {
    grid-template-columns: 1fr !important;
  }

  .stats-facts-head {
    display: block !important;
  }

  .stats-facts-head p {
    text-align: left !important;
    margin-top: 8px !important;
  }

  .stats-facts-mini-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .legacy-gpt-card {
    padding: 16px 14px !important;
    border-radius: 24px !important;
  }

  .legacy-gpt-head {
    grid-template-columns: 1fr !important;
  }

  .legacy-gpt-badge {
    width: max-content;
    max-width: 100%;
  }

  .legacy-gpt-messages {
    max-height: 48vh;
    min-height: 220px;
    padding: 12px;
    border-radius: 20px;
  }

  .legacy-gpt-message {
    width: 100%;
    padding: 11px 12px;
  }

  .legacy-gpt-message-body {
    font-size: .98rem;
    line-height: 1.55;
  }

  #database .table-wrap {
    max-width: 100%;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
}

@media (prefers-reduced-motion: reduce) {
  .legacy-gpt-preview::before,
  .stats-facts-panel::before,
  .legacy-gpt-card::after {
    animation: none !important;
  }
}


/* ---------- Final iPhone Safari safety guard ----------
   Keep the cursed LB reveal and button feedback, but do not animate the whole
   document on iOS. Full-page transforms/filters are what make Safari reload. */
@supports (-webkit-touch-callout: none) {
  html.scsl-secret-ios-rumble body,
  html.scsl-secret-meltdown-lite body {
    animation: none !important;
    transform: none !important;
    filter: none !important;
    overflow-x: hidden !important;
  }

  html.scsl-secret-ios-rumble .secret-do-not-touch-btn {
    animation: scslSecretPanicButton 760ms steps(7,end) both !important;
  }

  html.scsl-secret-meltdown-lite .scsl-broken-overlay {
    opacity: 1;
    animation: scslBrokenOverlayIn 1900ms ease-out both !important;
    transform: translateZ(0) !important;
    -webkit-transform: translateZ(0) !important;
  }

  html.scsl-secret-meltdown-lite .scsl-broken-lb {
    width: min(92vw, 420px) !important;
    max-height: 64vh !important;
    filter: none !important;
  }
}

/* =========================================================
   Final music/page-2 + typography polish
   - Keeps LegacyScore-GPT visible without oversized wrapping
   - Prevents Safari input zoom with final loaded overrides
   - Makes music resume state clearer after moving between screens
========================================================= */

.legacy-gpt-preview-inner {
  grid-template-columns: 1fr !important;
  gap: clamp(14px, 2vw, 22px) !important;
}

.legacy-gpt-preview-copy {
  max-width: 860px !important;
}

.legacy-gpt-preview h2 {
  font-size: clamp(3rem, 5.15vw, 5.15rem) !important;
  line-height: .88 !important;
  letter-spacing: .035em !important;
  max-width: 100% !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

.legacy-gpt-preview p {
  max-width: 760px !important;
  font-size: clamp(.98rem, 1.05vw, 1.06rem) !important;
}

.legacy-gpt-preview-form {
  width: min(100%, 720px) !important;
}

.legacy-gpt-card h3 {
  font-size: clamp(32px, 4.05vw, 50px) !important;
  line-height: .9 !important;
}

.legacy-gpt-preview-input,
.legacy-gpt-input,
#database .search-box {
  font-size: 16px !important;
}

.music-btn.needs-gesture {
  border-color: rgba(245,199,107,.48) !important;
  color: rgba(245,199,107,.96) !important;
}

@media (min-width: 960px) {
  .legacy-gpt-preview-form {
    margin-top: 2px !important;
  }
}

@media (max-width: 760px) {
  .legacy-gpt-preview {
    padding: 17px 14px !important;
  }

  .legacy-gpt-preview h2,
  .legacy-gpt-card h3,
  .stat-vault-head h2,
  .stats-facts-head h2 {
    font-size: clamp(2.45rem, 10.8vw, 3.7rem) !important;
    line-height: .92 !important;
    letter-spacing: .035em !important;
  }

  .legacy-gpt-preview p,
  .legacy-gpt-lede {
    font-size: 14.5px !important;
    line-height: 1.5 !important;
  }

  .legacy-gpt-preview-form {
    gap: 9px !important;
  }

  .legacy-gpt-preview-input,
  .legacy-gpt-input,
  #database .search-box {
    font-size: 16px !important;
    line-height: 1.25 !important;
  }

  .legacy-gpt-input {
    padding: 13px 0 !important;
  }

  .legacy-gpt-prompts {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 390px) {
  .legacy-gpt-preview h2,
  .legacy-gpt-card h3 {
    font-size: clamp(2.25rem, 10.1vw, 3.25rem) !important;
  }

  .legacy-gpt-preview-prompts a,
  .legacy-gpt-prompt {
    letter-spacing: .055em !important;
  }
}


/* =========================================================
   Two-page navigation + Stat Vault mobile cleanup
   - Gives both pages an always-available page switcher
   - Keeps the Stat Vault from feeling like a dead end
   - Tightens LegacyScore-GPT on mobile
========================================================= */

.site-page-tabs {
  position: sticky;
  top: 38px;
  z-index: 4997;
  display: flex;
  justify-content: center;
  padding: 8px 16px;
  background: linear-gradient(180deg, rgba(2,3,7,.94), rgba(2,3,7,.74));
  border-bottom: 1px solid rgba(245,199,107,.16);
  backdrop-filter: blur(18px) saturate(135%);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
}

.site-page-tabs-inner {
  width: min(1120px, 100%);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.site-page-tab {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.70);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: .105em;
  font-family: var(--font-display, 'Rajdhani', sans-serif);
  font-weight: 800;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
  transition: border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease;
}

.site-page-tab span {
  font-size: .88rem;
  line-height: 1;
}

.site-page-tab em {
  font-style: normal;
  font-size: .66rem;
  opacity: .62;
  letter-spacing: .13em;
}

.site-page-tab:hover {
  color: rgba(255,255,255,.92);
  border-color: rgba(245,199,107,.32);
  background: rgba(245,199,107,.075);
  transform: translateY(-1px);
}

.site-page-tab.is-active {
  color: #050506;
  border-color: rgba(245,199,107,.76);
  background: linear-gradient(135deg, rgba(255,211,112,.98), rgba(188,132,48,.90));
  box-shadow: 0 12px 30px rgba(245,199,107,.16), inset 0 1px 0 rgba(255,255,255,.42);
}

.site-page-tab.is-active em {
  opacity: .74;
}

body.stat-vault-page main {
  padding-top: clamp(18px, 2vw, 32px) !important;
}

body.stat-vault-page .stat-vault-screen {
  max-width: 1180px;
}

body.stat-vault-page .legacy-gpt-card.legacy-gpt-full {
  margin-top: 10px !important;
  margin-bottom: 24px !important;
}

body.stat-vault-page .database-hero.database-hero-bottom {
  margin-top: 0 !important;
  margin-bottom: 20px !important;
}

body.stat-vault-page .database-chips {
  margin-top: 4px !important;
}

.legacy-gpt-prompts {
  align-items: stretch;
}

.legacy-gpt-prompt,
.legacy-gpt-preview-prompts a {
  white-space: nowrap;
}

.stats-facts-coverage-card {
  border-color: rgba(245,199,107,.20) !important;
}

@media (max-width: 900px) {
  .site-page-tabs {
    top: 40px;
    justify-content: flex-start;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding: 7px 10px;
    scroll-padding-inline: 10px;
  }

  .site-page-tabs-inner {
    width: max-content;
    min-width: 100%;
    display: flex;
    gap: 8px;
  }

  .site-page-tab {
    flex: 1 0 154px;
    min-height: 42px;
    padding: 9px 12px;
  }

  .site-page-tab span {
    font-size: .78rem;
  }

  .site-page-tab em {
    font-size: .58rem;
  }

  .mobile-jump-nav {
    top: 89px !important;
  }

  .hero {
    padding-top: clamp(28px, 8vw, 54px) !important;
  }

  body.stat-vault-page main {
    padding-top: 12px !important;
  }

  body.stat-vault-page .stat-vault-screen {
    padding: 16px 12px !important;
    border-radius: 24px !important;
  }

  body.stat-vault-page .stat-vault-head {
    display: block !important;
    padding-bottom: 12px !important;
  }

  body.stat-vault-page .stat-vault-head h2 {
    max-width: 100% !important;
  }

  body.stat-vault-page .stat-vault-head p {
    text-align: left !important;
    max-width: 100% !important;
    margin-top: 8px !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
  }

  body.stat-vault-page .legacy-gpt-card.legacy-gpt-full {
    padding: 15px 12px !important;
    border-radius: 24px !important;
    margin: 10px 0 18px !important;
  }

  body.stat-vault-page .legacy-gpt-head {
    gap: 10px !important;
  }

  body.stat-vault-page .legacy-gpt-brand {
    gap: 10px !important;
    align-items: flex-start !important;
  }

  body.stat-vault-page .legacy-gpt-mark {
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;
  }

  body.stat-vault-page .legacy-gpt-kicker {
    font-size: .68rem !important;
    letter-spacing: .14em !important;
  }

  body.stat-vault-page .legacy-gpt-badge {
    display: none !important;
  }

  body.stat-vault-page .legacy-gpt-lede {
    margin-top: 12px !important;
  }

  body.stat-vault-page .legacy-gpt-messages {
    min-height: 188px !important;
    max-height: 42vh !important;
    padding: 10px !important;
    border-radius: 18px !important;
  }

  body.stat-vault-page .legacy-gpt-message {
    padding: 10px 11px !important;
    border-radius: 16px !important;
  }

  body.stat-vault-page .legacy-gpt-message-body {
    font-size: 15px !important;
    line-height: 1.5 !important;
  }

  body.stat-vault-page .legacy-gpt-form {
    gap: 9px !important;
  }

  body.stat-vault-page .legacy-gpt-input-shell {
    min-height: 52px !important;
    border-radius: 18px !important;
  }

  body.stat-vault-page .legacy-gpt-submit {
    min-height: 50px !important;
    border-radius: 18px !important;
    width: 100% !important;
  }

  body.stat-vault-page .legacy-gpt-prompts {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    overflow: visible !important;
  }

  body.stat-vault-page .legacy-gpt-prompt {
    min-width: 0 !important;
    width: 100% !important;
    padding: 10px 8px !important;
    font-size: .68rem !important;
    letter-spacing: .07em !important;
    white-space: normal !important;
    line-height: 1.1 !important;
  }

  body.stat-vault-page .database-hero.database-hero-bottom {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px !important;
    margin: 0 0 14px !important;
  }

  body.stat-vault-page .db-stat {
    padding: 12px 10px !important;
    min-height: 112px !important;
  }

  body.stat-vault-page .db-value {
    font-size: clamp(2.2rem, 12vw, 3.35rem) !important;
  }

  body.stat-vault-page .database-chips {
    display: flex !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    padding: 4px 2px 12px !important;
    gap: 8px !important;
  }

  body.stat-vault-page .db-chip {
    flex: 0 0 auto !important;
    padding: 11px 13px !important;
  }

  body.stat-vault-page .table-wrap {
    border-radius: 20px !important;
  }
}

@media (max-width: 420px) {
  .site-page-tab {
    flex-basis: 142px;
  }

  body.stat-vault-page .legacy-gpt-prompts {
    grid-template-columns: 1fr 1fr !important;
  }

  body.stat-vault-page .database-hero.database-hero-bottom {
    grid-template-columns: 1fr 1fr !important;
  }
}


/* =========================================================
   Version 3.0 · LegacyScore-GPT product language + mobile polish
   - Keeps the two-page architecture clear
   - Makes GPT feel like a legacy/ranking feature without losing archive utility
========================================================= */

.legacy-gpt-preview-copy {
  min-width: 0;
}

.legacy-gpt-preview h2 {
  max-width: 900px;
  font-size: clamp(3.0rem, 6.2vw, 5.85rem) !important;
  line-height: .88 !important;
  letter-spacing: .038em !important;
}

.legacy-gpt-preview p {
  max-width: 760px;
  color: rgba(232,235,246,.80) !important;
}

.legacy-gpt-preview-submit {
  min-width: 136px;
}

.legacy-gpt-preview-prompts a,
.legacy-gpt-prompt {
  transition: border-color .18s ease, background .18s ease, color .18s ease, transform .18s ease;
}

.legacy-gpt-preview-prompts a:hover,
.legacy-gpt-prompt:hover {
  border-color: rgba(245,199,107,.36) !important;
  background: rgba(245,199,107,.085) !important;
  color: rgba(255,229,166,.98) !important;
  transform: translateY(-1px);
}

body.stat-vault-page .legacy-gpt-card h3 {
  font-size: clamp(2.85rem, 6.4vw, 5.6rem) !important;
  line-height: .86 !important;
  letter-spacing: .035em !important;
}

body.stat-vault-page .legacy-gpt-lede {
  max-width: 980px;
  font-size: clamp(.96rem, 1.25vw, 1.08rem) !important;
}

body.stat-vault-page .legacy-gpt-badge {
  color: #050506 !important;
  border-color: rgba(245,199,107,.70) !important;
  background: linear-gradient(135deg, rgba(255,211,112,.98), rgba(188,132,48,.90)) !important;
}

body.stat-vault-page .legacy-gpt-empty strong {
  display: block;
  margin-bottom: 3px;
  color: rgba(255,232,172,.95);
  font-family: var(--font-stat, Rajdhani, Inter, sans-serif);
  font-size: .92rem;
  letter-spacing: .045em;
  text-transform: uppercase;
}

@media (max-width: 900px) {
  .legacy-gpt-preview-inner {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .legacy-gpt-preview h2 {
    font-size: clamp(2.45rem, 13vw, 4.05rem) !important;
    line-height: .90 !important;
    letter-spacing: .03em !important;
  }

  .legacy-gpt-preview p {
    font-size: 15px !important;
    line-height: 1.5 !important;
  }

  .legacy-gpt-preview-form {
    grid-template-columns: 1fr !important;
    padding: 8px !important;
    border-radius: 20px !important;
  }

  .legacy-gpt-preview-submit {
    width: 100%;
    min-height: 50px;
  }

  .legacy-gpt-preview-prompts {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .legacy-gpt-preview-prompts a {
    width: 100%;
    min-width: 0 !important;
    justify-content: center;
    text-align: center;
    white-space: normal !important;
    line-height: 1.12 !important;
    padding: 10px 8px !important;
  }

  body.stat-vault-page .legacy-gpt-card h3 {
    font-size: clamp(2.35rem, 13vw, 3.75rem) !important;
    line-height: .90 !important;
  }

  body.stat-vault-page .legacy-gpt-lede {
    font-size: 14.5px !important;
    line-height: 1.48 !important;
  }

  body.stat-vault-page .legacy-gpt-form {
    grid-template-columns: 1fr !important;
  }

  body.stat-vault-page .legacy-gpt-input {
    font-size: 16px !important;
  }

  body.stat-vault-page .legacy-gpt-submit {
    font-size: .82rem !important;
    letter-spacing: .09em !important;
  }

  body.stat-vault-page .table-wrap {
    max-width: 100%;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 420px) {
  .legacy-gpt-preview-prompts,
  body.stat-vault-page .legacy-gpt-prompts {
    grid-template-columns: 1fr !important;
  }

  body.stat-vault-page .database-hero.database-hero-bottom {
    grid-template-columns: 1fr !important;
  }
}

/* ===== assets/scsl15-stats-desktop-repair.css ===== */
/* =========================================================
   SCSL15 V3 — Final Stats & Facts Desktop Repair
   Purpose: full-width, balanced archive hub that looks clean on desktop and mobile.
========================================================= */

#statsfacts.stats-facts-panel {
  width: min(1120px, calc(100vw - 32px)) !important;
  max-width: min(1120px, calc(100vw - 32px)) !important;
  margin: 22px auto !important;
  padding: clamp(24px, 3vw, 40px) !important;
  overflow: hidden !important;
  border-radius: 30px !important;
  border: 1px solid rgba(245,199,107,.18) !important;
  background:
    radial-gradient(circle at 6% 0%, rgba(201,31,46,.13), transparent 34%),
    radial-gradient(circle at 93% 0%, rgba(40,91,196,.16), transparent 39%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.015)),
    rgba(4,5,11,.92) !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

#statsfacts.stats-facts-panel::before {
  content: "" !important;
  position: absolute !important;
  inset: 1px !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  opacity: .42 !important;
  background:
    linear-gradient(116deg, rgba(255,255,255,.075), transparent 26%, transparent 72%, rgba(245,199,107,.075)),
    radial-gradient(circle at 50% 0%, rgba(245,199,107,.05), transparent 52%) !important;
}

#statsfacts .stats-facts-head {
  display: grid !important;
  grid-template-columns: minmax(300px, .78fr) minmax(360px, 1fr) !important;
  gap: clamp(18px, 3vw, 42px) !important;
  align-items: end !important;
  margin: 0 0 22px !important;
  padding: 0 0 20px !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
  text-align: left !important;
}

#statsfacts .stats-facts-head h2 {
  max-width: 520px !important;
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(56px, 5.4vw, 86px) !important;
  line-height: .88 !important;
  letter-spacing: .045em !important;
  text-align: left !important;
}

#statsfacts .stats-facts-head p {
  justify-self: end !important;
  max-width: 520px !important;
  margin: 0 !important;
  color: rgba(235,238,248,.70) !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
  text-align: right !important;
}

#statsfacts .stats-facts-kicker {
  margin: 0 0 10px !important;
}

#statsfacts .sfa-grid,
#statsfacts .stats-facts-grid.sfa-grid {
  display: block !important;
  width: 100% !important;
}

#statsfacts .sfa-shell.sfa-v5 {
  display: grid !important;
  grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr) !important;
  grid-template-areas:
    "hero metrics"
    "facts ask" !important;
  gap: 16px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

#statsfacts .sfa-hero-card,
#statsfacts .sfa-facts-card,
#statsfacts .sfa-ask-card,
#statsfacts .sfa-metric {
  min-width: 0 !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 45px rgba(0,0,0,.22) !important;
}

#statsfacts .sfa-hero-card {
  grid-area: hero !important;
  display: grid !important;
  align-content: space-between !important;
  gap: 18px !important;
  min-height: 220px !important;
  padding: clamp(20px, 2.6vw, 32px) !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.12), transparent 45%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.018)),
    rgba(2,3,8,.72) !important;
}

#statsfacts .sfa-eyebrow,
#statsfacts .sfa-tabs button,
#statsfacts .sfa-metric span,
#statsfacts .sfa-metric em,
#statsfacts .sfa-ask-head span,
#statsfacts .sfa-receipt-row em,
#statsfacts .sfa-champion-row em,
#statsfacts .sfa-leader-item span,
#statsfacts .sfa-leader-item em,
#statsfacts .sfa-hero-cta,
#statsfacts .sfa-quick-prompts a,
#statsfacts .sfa-open-vault,
#statsfacts .sfa-ask-submit {
  font-family: var(--font-stat, Inter, sans-serif) !important;
  font-weight: 950 !important;
  letter-spacing: .11em !important;
  text-transform: uppercase !important;
}

#statsfacts .sfa-eyebrow,
#statsfacts .sfa-ask-head span,
#statsfacts .sfa-leader-item span {
  color: rgba(245,199,107,.92) !important;
  font-size: 10px !important;
}

#statsfacts .sfa-hero-card h3 {
  max-width: 520px !important;
  margin: 8px 0 12px !important;
  color: #fff !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif) !important;
  font-size: clamp(38px, 4.1vw, 62px) !important;
  line-height: .92 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

#statsfacts .sfa-hero-card p,
#statsfacts .sfa-pane p,
#statsfacts .sfa-ask-card p {
  margin: 0 !important;
  color: rgba(235,238,248,.72) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

#statsfacts .sfa-hero-cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: max-content !important;
  max-width: 100% !important;
  min-height: 38px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(245,199,107,.34) !important;
  color: #111 !important;
  background: linear-gradient(180deg, #f7cf76, #b8872e) !important;
  text-decoration: none !important;
  font-size: 10px !important;
  box-shadow: 0 14px 28px rgba(245,199,107,.12) !important;
}

#statsfacts .sfa-metrics {
  grid-area: metrics !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

#statsfacts .sfa-metric {
  appearance: none !important;
  cursor: pointer !important;
  display: grid !important;
  align-content: center !important;
  min-height: 104px !important;
  padding: 18px !important;
  border-radius: 24px !important;
  text-align: left !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.20), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.022)),
    rgba(6,7,13,.80) !important;
  transition: transform .18s ease, border-color .18s ease, background .18s ease !important;
}

#statsfacts .sfa-metric:hover,
#statsfacts .sfa-metric:focus-visible,
#statsfacts .sfa-metric.active {
  transform: translateY(-2px) !important;
  border-color: rgba(245,199,107,.46) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.28), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.028)),
    rgba(6,7,13,.86) !important;
}

#statsfacts .sfa-metric strong {
  display: block !important;
  margin: 0 0 8px !important;
  color: #f7ce76 !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif) !important;
  font-size: clamp(44px, 4.4vw, 68px) !important;
  line-height: .82 !important;
  letter-spacing: .035em !important;
  text-shadow: 0 16px 30px rgba(0,0,0,.40) !important;
}

#statsfacts .sfa-metric span,
#statsfacts .sfa-metric em {
  display: block !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  line-height: 1.18 !important;
  font-style: normal !important;
}

#statsfacts .sfa-metric span {
  color: rgba(255,255,255,.90) !important;
  font-size: 10px !important;
}

#statsfacts .sfa-metric em {
  margin-top: 3px !important;
  color: rgba(235,238,248,.54) !important;
  font-size: 9px !important;
  letter-spacing: .08em !important;
}

#statsfacts .sfa-facts-card {
  grid-area: facts !important;
  border-radius: 26px !important;
  overflow: hidden !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.014)),
    rgba(2,3,8,.70) !important;
}

#statsfacts .sfa-tabs {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 14px !important;
  margin: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.085) !important;
  overflow: visible !important;
}

#statsfacts .sfa-tabs button {
  flex: 0 0 auto !important;
  min-height: 34px !important;
  padding: 0 13px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  color: rgba(239,242,250,.66) !important;
  background: rgba(0,0,0,.22) !important;
  font-size: 9px !important;
  cursor: pointer !important;
}

#statsfacts .sfa-tabs button:hover,
#statsfacts .sfa-tabs button:focus-visible,
#statsfacts .sfa-tabs button.active {
  color: #111 !important;
  border-color: rgba(245,199,107,.38) !important;
  background: linear-gradient(180deg, #f7cf76, #b8872e) !important;
}

#statsfacts .sfa-pane {
  display: none !important;
  min-height: 278px !important;
  padding: clamp(22px, 2.5vw, 32px) !important;
}

#statsfacts .sfa-pane.active {
  display: grid !important;
  align-content: center !important;
  gap: 16px !important;
  animation: sfaFinalFade .18s ease both !important;
}

#statsfacts .sfa-pane h4 {
  max-width: 720px !important;
  margin: 0 !important;
  color: #fff !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif) !important;
  font-size: clamp(34px, 3.6vw, 56px) !important;
  line-height: .92 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

#statsfacts .sfa-receipt-row,
#statsfacts .sfa-champion-row,
#statsfacts .sfa-leader-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

#statsfacts .sfa-leader-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }

#statsfacts .sfa-receipt-row span,
#statsfacts .sfa-champion-row span,
#statsfacts .sfa-leader-item {
  min-width: 0 !important;
  padding: 13px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.045) !important;
}

#statsfacts .sfa-receipt-row strong,
#statsfacts .sfa-champion-row strong,
#statsfacts .sfa-leader-item strong {
  display: block !important;
  color: #f7ce76 !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif) !important;
  font-size: clamp(28px, 2.5vw, 38px) !important;
  line-height: .88 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  overflow-wrap: anywhere !important;
}

#statsfacts .sfa-receipt-row em,
#statsfacts .sfa-champion-row em,
#statsfacts .sfa-leader-item em {
  display: block !important;
  margin-top: 6px !important;
  color: rgba(235,238,248,.62) !important;
  font-size: 9px !important;
  line-height: 1.25 !important;
  font-style: normal !important;
}

#statsfacts .sfa-ask-card {
  grid-area: ask !important;
  display: grid !important;
  align-content: start !important;
  gap: 14px !important;
  padding: clamp(22px, 2.5vw, 32px) !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 92% 0%, rgba(138,180,248,.22), transparent 44%),
    radial-gradient(circle at 0% 100%, rgba(245,199,107,.13), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.068), rgba(255,255,255,.018)),
    rgba(3,4,10,.78) !important;
}

#statsfacts .sfa-ask-head {
  display: grid !important;
  gap: 8px !important;
}

#statsfacts .sfa-ask-head span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: max-content !important;
  max-width: 100% !important;
}

#statsfacts .sfa-ask-head img {
  width: 25px !important;
  height: 25px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 0 16px rgba(184,156,255,.34)) !important;
}

#statsfacts .sfa-ask-head strong {
  margin: 0 !important;
  max-width: 460px !important;
  color: #fff !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif) !important;
  font-size: clamp(40px, 4.1vw, 64px) !important;
  line-height: .88 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  text-align: left !important;
}

#statsfacts .sfa-ask-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 8px !important;
  margin-top: 4px !important;
}

#statsfacts .sfa-ask-input {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 50px !important;
  padding: 0 16px !important;
  border-radius: 17px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: #fff !important;
  background: rgba(0,0,0,.30) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important;
  font-size: 16px !important;
  font-weight: 760 !important;
  outline: none !important;
}

#statsfacts .sfa-ask-input::placeholder { color: rgba(239,242,250,.42) !important; }
#statsfacts .sfa-ask-input:focus { border-color: rgba(245,199,107,.42) !important; box-shadow: 0 0 0 3px rgba(245,199,107,.10), inset 0 1px 0 rgba(255,255,255,.08) !important; }

#statsfacts .sfa-ask-submit,
#statsfacts .sfa-open-vault {
  min-height: 50px !important;
  padding: 0 18px !important;
  border-radius: 17px !important;
  border: 1px solid rgba(245,199,107,.32) !important;
  color: #111 !important;
  background: linear-gradient(180deg, #f7cf76, #b8872e) !important;
  font-size: 11px !important;
  cursor: pointer !important;
  text-decoration: none !important;
  box-shadow: 0 14px 28px rgba(245,199,107,.13) !important;
}

#statsfacts .sfa-quick-prompts {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

#statsfacts .sfa-quick-prompts a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  color: rgba(239,242,250,.72) !important;
  background: rgba(0,0,0,.22) !important;
  font-size: 10px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

#statsfacts .sfa-open-vault {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: start !important;
  width: max-content !important;
  max-width: 100% !important;
}

@keyframes sfaFinalFade {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 900px) {
  #statsfacts.stats-facts-panel {
    width: calc(100vw - 22px) !important;
    max-width: calc(100vw - 22px) !important;
    padding: 20px 14px !important;
    border-radius: 26px !important;
  }

  #statsfacts .stats-facts-head {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    text-align: left !important;
  }

  #statsfacts .stats-facts-head h2 {
    font-size: clamp(42px, 13vw, 66px) !important;
  }

  #statsfacts .stats-facts-head p {
    justify-self: start !important;
    max-width: 100% !important;
    text-align: left !important;
    font-size: 14px !important;
  }

  #statsfacts .sfa-shell.sfa-v5 {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "hero"
      "metrics"
      "ask"
      "facts" !important;
    gap: 12px !important;
  }

  #statsfacts .sfa-hero-card { min-height: 0 !important; padding: 18px !important; border-radius: 22px !important; }
  #statsfacts .sfa-hero-card h3 { font-size: clamp(34px, 10vw, 52px) !important; }
  #statsfacts .sfa-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 9px !important; }
  #statsfacts .sfa-metric { min-height: 102px !important; padding: 13px !important; border-radius: 18px !important; }
  #statsfacts .sfa-metric strong { font-size: clamp(36px, 11vw, 50px) !important; }
  #statsfacts .sfa-facts-card,
  #statsfacts .sfa-ask-card { border-radius: 22px !important; }
  #statsfacts .sfa-pane { min-height: 0 !important; padding: 18px !important; }
  #statsfacts .sfa-pane h4 { font-size: clamp(30px, 9.5vw, 44px) !important; }
  #statsfacts .sfa-receipt-row,
  #statsfacts .sfa-champion-row,
  #statsfacts .sfa-leader-grid { grid-template-columns: 1fr !important; }
  #statsfacts .sfa-ask-card { padding: 18px !important; }
  #statsfacts .sfa-ask-head strong { font-size: clamp(36px, 11vw, 50px) !important; }
  #statsfacts .sfa-ask-form { grid-template-columns: 1fr !important; }
  #statsfacts .sfa-ask-submit { width: 100% !important; }
  #statsfacts .sfa-open-vault { width: 100% !important; }
}

@media (max-width: 430px) {
  #statsfacts .sfa-metrics { grid-template-columns: 1fr 1fr !important; }
  #statsfacts .sfa-metric span { font-size: 9px !important; }
  #statsfacts .sfa-metric em { font-size: 8px !important; }
  #statsfacts .sfa-tabs { flex-wrap: nowrap !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: none !important; }
  #statsfacts .sfa-tabs::-webkit-scrollbar { display: none !important; }
  #statsfacts .sfa-tabs button { flex: 0 0 auto !important; }
  #statsfacts .sfa-quick-prompts { flex-wrap: nowrap !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; scrollbar-width: none !important; }
  #statsfacts .sfa-quick-prompts::-webkit-scrollbar { display: none !important; }
  #statsfacts .sfa-quick-prompts a { flex: 0 0 auto !important; }
}

/* ===== assets/scsl15-mobile-formula-gemini-fix.css ===== */

/* =========================================================
   SCSL15 V3 — Mobile Formula + Official Gemini Lock
   Keeps AI-LegacyScore™ + Gemini in one product card without mobile bloat.
========================================================= */

#formula .formula-rail-gemini img,
.formula-panel .formula-rail-gemini img,
#statsfacts .sfa-ask-head img,
.legacy-gpt-brand-icon img,
.legacy-gpt-mark img,
.legacy-gpt-input-mark img {
  object-fit: contain !important;
}

#formula .formula-rail-gemini img,
.formula-panel .formula-rail-gemini img {
  filter: drop-shadow(0 0 16px rgba(80, 145, 255, .20)) drop-shadow(0 12px 24px rgba(0,0,0,.18)) !important;
}

@media (max-width: 700px) {
  #formula.formula-panel {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  #formula .formula-box-integrated {
    border-radius: 30px !important;
    overflow: hidden !important;
  }

  #formula .formula-main.formula-main-integrated,
  .formula-panel .formula-main.formula-main-integrated {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    grid-template-areas:
      "ai gemini"
      "core core" !important;
    gap: 12px !important;
    padding: 16px !important;
    min-height: 0 !important;
    align-items: stretch !important;
    text-align: center !important;
    border-radius: 30px !important;
  }

  #formula .formula-rail-ai,
  .formula-panel .formula-rail-ai {
    grid-area: ai !important;
  }

  #formula .formula-rail-gemini,
  .formula-panel .formula-rail-gemini {
    grid-area: gemini !important;
  }

  #formula .formula-core-copy,
  .formula-panel .formula-core-copy {
    grid-area: core !important;
    padding: 10px 0 2px !important;
    gap: 8px !important;
  }

  #formula .formula-rail,
  .formula-panel .formula-rail {
    width: 100% !important;
    min-height: 92px !important;
    align-self: stretch !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    align-content: center !important;
    align-items: center !important;
    justify-items: start !important;
    gap: 3px 9px !important;
    padding: 10px !important;
    border-radius: 20px !important;
    text-align: left !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025)),
      rgba(0,0,0,.18) !important;
  }

  #formula .formula-rail-gemini,
  .formula-panel .formula-rail-gemini {
    grid-template-columns: minmax(0, 1fr) auto !important;
    text-align: right !important;
    justify-items: end !important;
  }

  #formula .formula-rail-ai img,
  .formula-panel .formula-rail-ai img {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 44px !important;
    height: 44px !important;
  }

  #formula .formula-rail-gemini img,
  .formula-panel .formula-rail-gemini img {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    width: 50px !important;
    height: 50px !important;
  }

  #formula .formula-rail-ai span,
  #formula .formula-rail-ai strong,
  .formula-panel .formula-rail-ai span,
  .formula-panel .formula-rail-ai strong {
    grid-column: 2 !important;
  }

  #formula .formula-rail-gemini span,
  #formula .formula-rail-gemini strong,
  .formula-panel .formula-rail-gemini span,
  .formula-panel .formula-rail-gemini strong {
    grid-column: 1 !important;
  }

  #formula .formula-rail span,
  .formula-panel .formula-rail span {
    font-size: 9px !important;
    line-height: 1.05 !important;
    letter-spacing: .055em !important;
  }

  #formula .formula-rail strong,
  .formula-panel .formula-rail strong {
    font-size: 10px !important;
    line-height: 1.1 !important;
    letter-spacing: .095em !important;
    overflow-wrap: anywhere !important;
  }

  #formula .formula-main .formula-score-title,
  .formula-panel .formula-main .formula-score-title {
    font-size: clamp(43px, 14.4vw, 62px) !important;
    line-height: .82 !important;
    letter-spacing: .018em !important;
    white-space: normal !important;
    max-width: 100% !important;
    text-align: center !important;
  }

  #formula .formula-main .formula-equation,
  .formula-panel .formula-main .formula-equation {
    max-width: 100% !important;
    font-size: 13px !important;
    line-height: 1.24 !important;
    letter-spacing: .052em !important;
    text-align: center !important;
  }

  #formula .formula-core-copy em,
  .formula-panel .formula-core-copy em {
    max-width: 310px !important;
    font-size: 10.5px !important;
    line-height: 1.35 !important;
    letter-spacing: .055em !important;
  }

  #formula .formula-main.formula-main-integrated .ai-engine-button-hint,
  .formula-panel .formula-main.formula-main-integrated .ai-engine-button-hint {
    grid-column: 1 / -1 !important;
  }

  #formula .formula-archive-actions {
    margin-top: 16px !important;
  }
}

@media (max-width: 420px) {
  #formula .formula-main.formula-main-integrated,
  .formula-panel .formula-main.formula-main-integrated {
    gap: 10px !important;
    padding: 14px !important;
  }

  #formula .formula-rail,
  .formula-panel .formula-rail {
    min-height: 84px !important;
    padding: 9px !important;
    border-radius: 18px !important;
  }

  #formula .formula-rail-ai img,
  .formula-panel .formula-rail-ai img {
    width: 38px !important;
    height: 38px !important;
  }

  #formula .formula-rail-gemini img,
  .formula-panel .formula-rail-gemini img {
    width: 44px !important;
    height: 44px !important;
  }

  #formula .formula-main .formula-score-title,
  .formula-panel .formula-main .formula-score-title {
    font-size: clamp(39px, 14vw, 54px) !important;
  }

  #formula .formula-main .formula-equation,
  .formula-panel .formula-main .formula-equation {
    font-size: 12.5px !important;
    letter-spacing: .04em !important;
  }
}

@media (max-width: 360px) {
  #formula .formula-rail span,
  .formula-panel .formula-rail span { font-size: 8px !important; }
  #formula .formula-rail strong,
  .formula-panel .formula-rail strong { font-size: 9px !important; }
  #formula .formula-main .formula-score-title,
  .formula-panel .formula-main .formula-score-title { font-size: 36px !important; }
}

/* ===== assets/scsl15-v3-stable-redesign.css ===== */
/* =========================================================
   SCSL15 V3 — Stable Redesign Pass
   Scope: AI-LegacyScore engine card + Stats & Facts archive hub.
   Goal: simple, resilient desktop/mobile layout while keeping the
   AI-LegacyScore reflection animation intact.
========================================================= */

/* ---------- AI-LegacyScore engine: stable product card ---------- */
#formula.formula-panel {
  width: min(1080px, calc(100vw - 32px)) !important;
  max-width: min(1080px, calc(100vw - 32px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: clamp(22px, 3vw, 40px) !important;
}

#formula .section-head {
  display: grid !important;
  grid-template-columns: minmax(0, .85fr) minmax(320px, 1fr) !important;
  align-items: end !important;
  gap: 20px !important;
  margin-bottom: 22px !important;
}

#formula .section-head h2 {
  margin: 0 !important;
  font-size: clamp(42px, 4.4vw, 70px) !important;
  line-height: .9 !important;
}

#formula .section-head p {
  margin: 0 !important;
  max-width: 660px !important;
  justify-self: end !important;
  text-align: right !important;
  font-size: clamp(14px, 1.25vw, 17px) !important;
  line-height: 1.5 !important;
}

#formula .formula-box-integrated {
  padding: clamp(12px, 1.4vw, 18px) !important;
  border-radius: 32px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.012)),
    rgba(0,0,0,.22) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  overflow: visible !important;
}

#formula .formula-main.formula-main-integrated,
.formula-panel .formula-main.formula-main-integrated {
  display: grid !important;
  grid-template-columns: minmax(150px, 190px) minmax(0, 1fr) minmax(150px, 190px) !important;
  grid-template-areas:
    "ai core gemini"
    "ai hint gemini" !important;
  align-items: center !important;
  justify-items: center !important;
  gap: clamp(14px, 2.6vw, 34px) !important;
  min-height: clamp(250px, 26vw, 360px) !important;
  padding: clamp(24px, 4vw, 46px) !important;
  border-radius: 28px !important;
}

#formula .formula-main.formula-main-integrated > *,
.formula-panel .formula-main.formula-main-integrated > * {
  position: relative !important;
  z-index: 3 !important;
}

#formula .formula-rail-ai,
.formula-panel .formula-rail-ai { grid-area: ai !important; }

#formula .formula-rail-gemini,
.formula-panel .formula-rail-gemini { grid-area: gemini !important; }

#formula .formula-core-copy,
.formula-panel .formula-core-copy {
  grid-area: core !important;
  display: grid !important;
  gap: 16px !important;
  justify-items: center !important;
  text-align: center !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
}

#formula .formula-rail,
.formula-panel .formula-rail {
  width: 100% !important;
  min-height: 168px !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto auto auto !important;
  place-items: center !important;
  align-content: center !important;
  gap: 8px !important;
  padding: 18px 14px !important;
  border-radius: 22px !important;
  text-align: center !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.02)),
    rgba(0,0,0,.18) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}

#formula .formula-rail img,
.formula-panel .formula-rail img {
  display: block !important;
  grid-column: auto !important;
  grid-row: auto !important;
  width: 72px !important;
  height: 72px !important;
  object-fit: contain !important;
}

#formula .formula-rail-gemini img,
.formula-panel .formula-rail-gemini img {
  width: 78px !important;
  height: 78px !important;
}

#formula .formula-rail span,
.formula-panel .formula-rail span {
  display: block !important;
  color: rgba(235,238,248,.68) !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
}

#formula .formula-rail strong,
.formula-panel .formula-rail strong {
  display: block !important;
  color: #fff !important;
  font-size: 13px !important;
  line-height: 1.15 !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
  overflow-wrap: anywhere !important;
}

#formula .formula-main .formula-score-title,
.formula-panel .formula-main .formula-score-title {
  display: block !important;
  margin: 0 !important;
  max-width: 100% !important;
  color: #fff !important;
  font-size: clamp(58px, 6.7vw, 106px) !important;
  line-height: .83 !important;
  letter-spacing: .02em !important;
  white-space: normal !important;
  text-wrap: balance !important;
}

#formula .formula-main .formula-equation,
.formula-panel .formula-main .formula-equation {
  display: block !important;
  max-width: min(760px, 100%) !important;
  color: #f5c76b !important;
  font-size: clamp(22px, 2.4vw, 36px) !important;
  line-height: 1.18 !important;
  letter-spacing: .09em !important;
  text-align: center !important;
  white-space: normal !important;
}

#formula .formula-core-copy em,
.formula-panel .formula-core-copy em {
  max-width: 560px !important;
  color: rgba(235,238,248,.78) !important;
  font-size: clamp(12px, 1.15vw, 15px) !important;
  line-height: 1.35 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

#formula .formula-main.formula-main-integrated .ai-engine-button-hint,
.formula-panel .formula-main.formula-main-integrated .ai-engine-button-hint {
  grid-area: hint !important;
  align-self: start !important;
  margin: 2px auto 0 !important;
  position: relative !important;
  z-index: 4 !important;
}

#formula .formula-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

#formula .formula-archive-actions {
  margin-top: 18px !important;
}

/* ---------- Stats & Facts: simple archive hub ---------- */
#statsfacts.stats-facts-panel {
  width: min(1080px, calc(100vw - 32px)) !important;
  max-width: min(1080px, calc(100vw - 32px)) !important;
  margin: 24px auto !important;
  padding: clamp(22px, 3vw, 38px) !important;
  overflow: hidden !important;
  border-radius: 30px !important;
  border: 1px solid rgba(245,199,107,.18) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(201,31,46,.10), transparent 36%),
    radial-gradient(circle at 100% 0%, rgba(40,91,196,.14), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)),
    rgba(4,5,11,.92) !important;
  box-shadow: 0 24px 75px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

#statsfacts .stats-facts-head {
  display: grid !important;
  grid-template-columns: minmax(300px, .78fr) minmax(340px, 1fr) !important;
  gap: clamp(18px, 3vw, 40px) !important;
  align-items: end !important;
  margin: 0 0 22px !important;
  padding-bottom: 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
  text-align: left !important;
}

#statsfacts .stats-facts-head h2 {
  margin: 0 !important;
  max-width: 460px !important;
  color: #fff !important;
  font-size: clamp(54px, 5.2vw, 84px) !important;
  line-height: .9 !important;
  letter-spacing: .045em !important;
  text-align: left !important;
}

#statsfacts .stats-facts-head p {
  justify-self: end !important;
  max-width: 520px !important;
  margin: 0 !important;
  color: rgba(235,238,248,.72) !important;
  font-size: clamp(13px, 1.2vw, 16px) !important;
  line-height: 1.5 !important;
  text-align: right !important;
}

#statsfacts .stats-facts-kicker,
.scsl-facts-eyebrow,
.scsl-facts-ask-kicker,
.scsl-facts-tabs button,
.scsl-facts-prompts a,
.scsl-facts-open-vault,
.scsl-facts-ask-submit,
.scsl-fact-metric span,
.scsl-fact-metric em,
.scsl-facts-receipts em,
.scsl-facts-leader-item span,
.scsl-facts-leader-item em {
  font-family: var(--font-stat, Inter, sans-serif) !important;
  font-weight: 950 !important;
  letter-spacing: .11em !important;
  text-transform: uppercase !important;
}

#statsfacts .scsl-facts-grid {
  width: 100% !important;
  display: block !important;
}

#statsfacts .scsl-facts-console {
  display: grid !important;
  gap: 16px !important;
  width: 100% !important;
}

#statsfacts .scsl-facts-intro {
  display: grid !important;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr) !important;
  gap: 20px !important;
  align-items: end !important;
  padding: clamp(18px, 2.6vw, 28px) !important;
  border-radius: 26px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background:
    linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.018)),
    rgba(2,3,9,.72) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

#statsfacts .scsl-facts-eyebrow,
#statsfacts .scsl-facts-ask-kicker {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: rgba(245,199,107,.94) !important;
  font-size: 10px !important;
}

#statsfacts .scsl-facts-intro h3 {
  margin: 10px 0 0 !important;
  max-width: 720px !important;
  color: #fff !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif) !important;
  font-size: clamp(38px, 4vw, 64px) !important;
  line-height: .92 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

#statsfacts .scsl-facts-intro p,
#statsfacts .scsl-facts-pane p,
#statsfacts .scsl-facts-ask-card p {
  margin: 0 !important;
  color: rgba(235,238,248,.74) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

#statsfacts .scsl-facts-intro p {
  text-align: right !important;
}

#statsfacts .scsl-facts-metrics {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

#statsfacts .scsl-fact-metric {
  appearance: none !important;
  cursor: pointer !important;
  min-width: 0 !important;
  min-height: 118px !important;
  display: grid !important;
  align-content: center !important;
  gap: 5px !important;
  padding: 18px !important;
  border-radius: 22px !important;
  text-align: left !important;
  color: #fff !important;
  border: 1px solid rgba(245,199,107,.22) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(245,199,107,.18), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.025)),
    rgba(3,4,9,.72) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 16px 34px rgba(0,0,0,.22) !important;
}

#statsfacts .scsl-fact-metric:hover,
#statsfacts .scsl-fact-metric:focus-visible,
#statsfacts .scsl-fact-metric.active {
  border-color: rgba(245,199,107,.52) !important;
  transform: translateY(-1px) !important;
}

#statsfacts .scsl-fact-metric strong {
  color: #f7ce76 !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif) !important;
  font-size: clamp(42px, 4vw, 64px) !important;
  line-height: .82 !important;
  letter-spacing: .035em !important;
}

#statsfacts .scsl-fact-metric span {
  color: rgba(255,255,255,.92) !important;
  font-size: 10px !important;
  line-height: 1.16 !important;
}

#statsfacts .scsl-fact-metric em {
  color: rgba(235,238,248,.56) !important;
  font-size: 9px !important;
  line-height: 1.16 !important;
  font-style: normal !important;
}

#statsfacts .scsl-facts-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr) !important;
  gap: 16px !important;
  align-items: stretch !important;
}

#statsfacts .scsl-facts-story-card,
#statsfacts .scsl-facts-ask-card {
  min-width: 0 !important;
  border-radius: 26px !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.016)),
    rgba(2,3,9,.72) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 45px rgba(0,0,0,.24) !important;
  overflow: hidden !important;
}

#statsfacts .scsl-facts-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 14px !important;
  border-bottom: 1px solid rgba(255,255,255,.085) !important;
}

#statsfacts .scsl-facts-tabs button {
  appearance: none !important;
  cursor: pointer !important;
  min-height: 34px !important;
  padding: 0 13px !important;
  border-radius: 999px !important;
  color: rgba(235,238,248,.76) !important;
  background: rgba(255,255,255,.052) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  font-size: 10px !important;
}

#statsfacts .scsl-facts-tabs button.active {
  color: #111 !important;
  background: linear-gradient(180deg, #f7cf76, #b8872e) !important;
  border-color: rgba(245,199,107,.44) !important;
}

#statsfacts .scsl-facts-pane {
  display: none !important;
  padding: clamp(20px, 2.4vw, 30px) !important;
}

#statsfacts .scsl-facts-pane.active {
  display: grid !important;
  gap: 14px !important;
}

#statsfacts .scsl-facts-pane h4,
#statsfacts .scsl-facts-ask-card h4 {
  margin: 0 !important;
  color: #fff !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif) !important;
  font-size: clamp(32px, 3vw, 48px) !important;
  line-height: .94 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

#statsfacts .scsl-facts-receipts,
#statsfacts .scsl-facts-leader-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 4px !important;
}

#statsfacts .scsl-facts-leader-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

#statsfacts .scsl-facts-receipts span,
#statsfacts .scsl-facts-leader-item {
  display: grid !important;
  gap: 3px !important;
  min-width: 0 !important;
  padding: 13px !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.085) !important;
}

#statsfacts .scsl-facts-receipts strong,
#statsfacts .scsl-facts-leader-item strong {
  color: #f7ce76 !important;
  font-family: var(--font-display, Bebas Neue, Impact, sans-serif) !important;
  font-size: clamp(24px, 2vw, 34px) !important;
  line-height: .9 !important;
  letter-spacing: .04em !important;
}

#statsfacts .scsl-facts-receipts em,
#statsfacts .scsl-facts-leader-item span,
#statsfacts .scsl-facts-leader-item em {
  color: rgba(235,238,248,.58) !important;
  font-size: 9px !important;
  line-height: 1.15 !important;
  font-style: normal !important;
}

#statsfacts .scsl-facts-ask-card {
  display: grid !important;
  align-content: start !important;
  gap: 14px !important;
  padding: clamp(20px, 2.4vw, 30px) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(74,133,255,.18), transparent 42%),
    radial-gradient(circle at 0% 100%, rgba(245,199,107,.16), transparent 48%),
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.018)),
    rgba(5,7,14,.78) !important;
}

#statsfacts .scsl-facts-ask-kicker img {
  width: 18px !important;
  height: 18px !important;
  object-fit: contain !important;
}

#statsfacts .scsl-facts-ask-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 10px !important;
  margin-top: 2px !important;
}

#statsfacts .scsl-facts-ask-input {
  min-width: 0 !important;
  height: 46px !important;
  padding: 0 15px !important;
  border-radius: 15px !important;
  color: #fff !important;
  background: rgba(0,0,0,.30) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  font-size: 16px !important;
}

#statsfacts .scsl-facts-ask-submit,
#statsfacts .scsl-facts-open-vault {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 46px !important;
  padding: 0 18px !important;
  border-radius: 15px !important;
  color: #111 !important;
  background: linear-gradient(180deg, #f7cf76, #b8872e) !important;
  border: 1px solid rgba(245,199,107,.44) !important;
  text-decoration: none !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

#statsfacts .scsl-facts-prompts {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

#statsfacts .scsl-facts-prompts a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 32px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  color: rgba(235,238,248,.82) !important;
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  text-decoration: none !important;
  font-size: 9px !important;
}

#statsfacts .scsl-facts-open-vault {
  width: max-content !important;
  max-width: 100% !important;
  margin-top: 2px !important;
}

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
  #formula .section-head,
  #statsfacts .stats-facts-head,
  #statsfacts .scsl-facts-intro,
  #statsfacts .scsl-facts-layout {
    grid-template-columns: 1fr !important;
  }

  #formula .section-head p,
  #statsfacts .stats-facts-head p,
  #statsfacts .scsl-facts-intro p {
    justify-self: start !important;
    text-align: left !important;
  }

  #formula .formula-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  #formula.formula-panel,
  #statsfacts.stats-facts-panel {
    width: min(100%, calc(100vw - 24px)) !important;
    max-width: min(100%, calc(100vw - 24px)) !important;
    padding: 18px !important;
    border-radius: 26px !important;
  }

  #formula .formula-main.formula-main-integrated,
  .formula-panel .formula-main.formula-main-integrated {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    grid-template-areas:
      "core core"
      "ai gemini"
      "hint hint" !important;
    gap: 12px !important;
    min-height: 0 !important;
    padding: 18px !important;
    border-radius: 26px !important;
  }

  #formula .formula-core-copy,
  .formula-panel .formula-core-copy {
    gap: 10px !important;
  }

  #formula .formula-rail,
  .formula-panel .formula-rail {
    min-height: 96px !important;
    padding: 10px !important;
    gap: 5px !important;
    border-radius: 18px !important;
  }

  #formula .formula-rail img,
  .formula-panel .formula-rail img {
    width: 44px !important;
    height: 44px !important;
  }

  #formula .formula-rail-gemini img,
  .formula-panel .formula-rail-gemini img {
    width: 50px !important;
    height: 50px !important;
  }

  #formula .formula-rail span,
  .formula-panel .formula-rail span {
    font-size: 8.5px !important;
    letter-spacing: .07em !important;
  }

  #formula .formula-rail strong,
  .formula-panel .formula-rail strong {
    font-size: 9.5px !important;
    letter-spacing: .09em !important;
  }

  #formula .formula-main .formula-score-title,
  .formula-panel .formula-main .formula-score-title {
    font-size: clamp(42px, 13.8vw, 62px) !important;
    line-height: .84 !important;
  }

  #formula .formula-main .formula-equation,
  .formula-panel .formula-main .formula-equation {
    font-size: clamp(14px, 4.2vw, 18px) !important;
    line-height: 1.25 !important;
    letter-spacing: .052em !important;
  }

  #formula .formula-core-copy em,
  .formula-panel .formula-core-copy em {
    font-size: 10px !important;
    letter-spacing: .055em !important;
  }

  #statsfacts .stats-facts-head h2 {
    font-size: clamp(44px, 13vw, 64px) !important;
  }

  #statsfacts .scsl-facts-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  #statsfacts .scsl-fact-metric {
    min-height: 100px !important;
    padding: 15px !important;
  }

  #statsfacts .scsl-fact-metric strong {
    font-size: clamp(38px, 12vw, 52px) !important;
  }

  #statsfacts .scsl-facts-receipts,
  #statsfacts .scsl-facts-leader-grid {
    grid-template-columns: 1fr !important;
  }

  #statsfacts .scsl-facts-ask-form {
    grid-template-columns: 1fr !important;
  }

  #statsfacts .scsl-facts-ask-submit,
  #statsfacts .scsl-facts-open-vault {
    width: 100% !important;
  }
}

@media (max-width: 420px) {
  #formula.formula-panel,
  #statsfacts.stats-facts-panel {
    width: min(100%, calc(100vw - 18px)) !important;
    max-width: min(100%, calc(100vw - 18px)) !important;
    padding: 14px !important;
  }

  #formula .formula-main.formula-main-integrated,
  .formula-panel .formula-main.formula-main-integrated {
    padding: 14px !important;
  }

  #formula .formula-rail,
  .formula-panel .formula-rail {
    min-height: 88px !important;
  }

  #formula .formula-main .formula-score-title,
  .formula-panel .formula-main .formula-score-title {
    font-size: clamp(36px, 13.2vw, 50px) !important;
  }

  #statsfacts .scsl-facts-metrics {
    gap: 9px !important;
  }

  #statsfacts .scsl-fact-metric {
    border-radius: 18px !important;
    padding: 12px !important;
  }

  #statsfacts .scsl-fact-metric span,
  #statsfacts .scsl-fact-metric em {
    font-size: 8px !important;
  }
}

/* ===== assets/scsl15-presentation-final-polish.css ===== */
/* =========================================================
   SCSL15 — PRESENTATION-GRADE FINAL POLISH
   Loaded LAST. 100% additive. Touches nothing in other files.
   Goals:
     1. Kill the dead space at the very top + align the page tabs.
     2. Make Stats & Facts simpler + smaller (desktop AND mobile, separately).
     3. Add tasteful broadcast-red hints alongside the gold.
     4. Bump the too-small mobile fonts in the AI-LegacyScore box.
     5. Bring back "AI-LegacyScore + Gemini" on the mobile top bar.
     6. General clean-up for an Obama-grade, ESPN/Bleacher-Report finish.
   IMPORTANT: the moving glass reflection (bigGlassButtonDrift on
   .formula-main-integrated::before) is intentionally NOT touched.
========================================================= */

:root {
  --scsl-red: #d51f35; /* broadcast red, matches the SCSL15 bar */
  --scsl-red-soft: rgba(213, 31, 53, .42);
  --scsl-red-line: rgba(213, 31, 53, .30);
}

/* =========================================================
   1. TOP CHROME — remove the "weird space", clean alignment
   The bar is position:fixed (height = --scsl-fixed-header-h) and the
   body is padded by that exact height to reserve room for it. Because
   the body already carries that padding-top, a sticky `top` on the tabs
   gets ADDED on top of it — which is what created the dead band between
   the two bars. Pinning the tabs at top:0 makes them sit flush against
   the body content edge (i.e. immediately under the fixed bar) both at
   rest and while scrolling. No gap, no overlap.
========================================================= */
.site-page-tabs {
  top: 0 !important;
  padding-top: 7px !important;
  padding-bottom: 7px !important;
}

.site-page-tab {
  min-height: 44px !important;
}

.hero {
  padding-top: clamp(14px, 1.8vw, 22px) !important;
  padding-bottom: clamp(18px, 2.2vw, 28px) !important;
}

@media (max-width: 760px) {
  .site-page-tabs {
    top: 0 !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
  .hero {
    padding-top: 14px !important;
    padding-bottom: 16px !important;
  }
}

/* =========================================================
   2. STATS & FACTS — one clean, contained dashboard (DESKTOP)
   The old block repeated the section header inside a large "intro"
   panel, then stacked oversized metrics + a tall two-column board, so
   it overran the screen and read as a wall. We drop the redundant
   intro entirely and tighten the rest so the whole section reads as a
   single high-tech dashboard that fits one screen. All reflections,
   data, and interactivity are untouched.
========================================================= */
/* Redundant intro panel — the section header already says this. Gone. */
#statsfacts .scsl-facts-intro { display: none !important; }

#statsfacts.stats-facts-panel {
  padding: clamp(18px, 2.2vw, 30px) !important;
}

#statsfacts .stats-facts-head {
  margin-bottom: clamp(12px, 1.5vw, 16px) !important;
  padding-bottom: 12px !important;
}

#statsfacts .stats-facts-head h2 {
  font-size: clamp(34px, 3.3vw, 50px) !important;
}

#statsfacts .scsl-facts-console { gap: 12px !important; }
#statsfacts .scsl-facts-layout  { gap: 14px !important; }

/* Compact stat tiles */
#statsfacts .scsl-fact-metric {
  min-height: 76px !important;
  padding: 13px 14px !important;
  gap: 3px !important;
}
#statsfacts .scsl-fact-metric strong {
  font-size: clamp(26px, 2.3vw, 38px) !important;
}

/* Shorter story board, tighter type */
#statsfacts .scsl-facts-pane { min-height: 0 !important; }
#statsfacts .scsl-facts-pane.active {
  padding: clamp(16px, 1.9vw, 24px) !important;
  gap: 11px !important;
}
#statsfacts .scsl-facts-pane h4,
#statsfacts .scsl-facts-ask-card h4 {
  font-size: clamp(22px, 2.0vw, 30px) !important;
}
#statsfacts .scsl-facts-pane p,
#statsfacts .scsl-facts-ask-card p {
  font-size: 13px !important;
  line-height: 1.5 !important;
}
#statsfacts .scsl-facts-receipts strong,
#statsfacts .scsl-facts-leader-item strong {
  font-size: clamp(18px, 1.5vw, 24px) !important;
}
#statsfacts .scsl-facts-receipts span,
#statsfacts .scsl-facts-leader-item {
  padding: 11px !important;
}

/* Tighter archive ask card */
#statsfacts .scsl-facts-ask-card {
  padding: clamp(16px, 1.9vw, 24px) !important;
  gap: 12px !important;
}

/* =========================================================
   2b. STATS & FACTS — one clean, contained dashboard (MOBILE)
========================================================= */
@media (max-width: 720px) {
  #statsfacts.stats-facts-panel {
    padding: 14px !important;
  }
  #statsfacts .stats-facts-head h2 {
    font-size: clamp(28px, 8.6vw, 38px) !important;
  }
  /* on phones the lead-in paragraph just restates the dashboard — drop it
     so the section opens straight into the numbers (smaller + less busy) */
  #statsfacts .stats-facts-head p { display: none !important; }
  #statsfacts .scsl-facts-console { gap: 10px !important; }

  /* let all five view tabs wrap onto two tidy rows instead of a
     cut-off horizontal scroll */
  #statsfacts .scsl-facts-tabs {
    flex-wrap: wrap !important;
    overflow-x: visible !important;
  }
  #statsfacts .scsl-facts-tabs button { flex: 0 0 auto !important; }

  #statsfacts .scsl-facts-metrics { gap: 9px !important; }
  #statsfacts .scsl-fact-metric {
    min-height: 68px !important;
    padding: 11px 12px !important;
  }
  #statsfacts .scsl-fact-metric strong {
    font-size: clamp(25px, 7.8vw, 34px) !important;
  }

  /* receipts + leader grid as tidy 2-up grids instead of tall columns */
  #statsfacts .scsl-facts-receipts,
  #statsfacts .scsl-facts-leader-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  #statsfacts .scsl-facts-pane.active { gap: 10px !important; padding: 14px !important; }
  #statsfacts .scsl-facts-pane h4,
  #statsfacts .scsl-facts-ask-card h4 {
    font-size: clamp(22px, 6.6vw, 28px) !important;
  }
  #statsfacts .scsl-facts-pane p,
  #statsfacts .scsl-facts-ask-card p { font-size: 12.5px !important; }

  /* keep the ask input + button on one row to save a stacked row */
  #statsfacts .scsl-facts-ask-form {
    grid-template-columns: minmax(0, 1fr) auto !important;
  }
  #statsfacts .scsl-facts-ask-submit { width: auto !important; padding: 0 18px !important; }

  /* tidy 2-up prompt chips instead of a cut-off horizontal scroll */
  #statsfacts .scsl-facts-prompts {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
  }
  #statsfacts .scsl-facts-prompts a {
    flex: 1 1 auto !important;
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
  }

  /* nudge the tiniest mobile labels up for legibility */
  #statsfacts .scsl-facts-receipts em,
  #statsfacts .scsl-facts-leader-item span,
  #statsfacts .scsl-facts-leader-item em {
    font-size: 9.6px !important;
  }
}

/* =========================================================
   3. RED HINTS — broadcast red woven in next to the gold
========================================================= */
/* Section dividers go subtly red */
#formula .section-head,
#statsfacts .stats-facts-head {
  border-bottom-color: var(--scsl-red-line) !important;
}

/* Stat metric cards get an ESPN-style red top accent */
#statsfacts .scsl-fact-metric {
  border-top: 2px solid var(--scsl-red-soft) !important;
}

/* Red hairline under the stats tab row */
#statsfacts .scsl-facts-tabs {
  border-bottom-color: var(--scsl-red-line) !important;
}

/* Red hover on archive quick-prompts */
#statsfacts .scsl-facts-prompts a:hover {
  border-color: var(--scsl-red-soft) !important;
  color: #fff !important;
  background: rgba(213, 31, 53, .12) !important;
}

/* Hero eyebrow accent lines: gold -> red gradient */
.eyebrow::before,
.eyebrow::after {
  background: linear-gradient(90deg, rgba(213,31,53,.85), rgba(245,199,107,.85)) !important;
}

/* Footer reads as a broadcast lower-third */
footer {
  border-top: 2px solid var(--scsl-red-line) !important;
}

/* ---------------------------------------------------------
   3b. RED FONT ACCENTS — actual red type next to the gold.
   Tasteful, intentional emphasis: equation operators, the
   "Engine" title line, section ampersands, and the signature
   "15" stat. Gold stays the brand; red is the accent.
--------------------------------------------------------- */
/* Formula equation operators pop red against the gold */
#formula .formula-equation .op,
.formula-panel .formula-equation .op {
  color: var(--scsl-red) !important;
  -webkit-text-fill-color: var(--scsl-red) !important;
  font-weight: 900 !important;
  padding: 0 .04em !important;
}

/* "Engine" line of the AI-LegacyScore title goes broadcast red */
#formula .ai-engine-title-line.is-red,
.formula-panel .ai-engine-title-line.is-red {
  color: var(--scsl-red) !important;
  -webkit-text-fill-color: var(--scsl-red) !important;
}

/* Red ampersand inside the Stats & Facts title */
#statsfacts .stats-facts-head h2 .amp {
  color: var(--scsl-red) !important;
  -webkit-text-fill-color: var(--scsl-red) !important;
}

/* Signature "15 / Made the wall" stat tile in broadcast red */
#statsfacts .scsl-facts-metrics .scsl-fact-metric:nth-of-type(3) strong {
  color: var(--scsl-red) !important;
  -webkit-text-fill-color: var(--scsl-red) !important;
  text-shadow: 0 12px 26px rgba(213, 31, 53, .32) !important;
}
/* keep its red top accent a touch stronger so the tile reads as a set */
#statsfacts .scsl-facts-metrics .scsl-fact-metric:nth-of-type(3) {
  border-top-color: rgba(213, 31, 53, .68) !important;
}

/* =========================================================
   4. AI-LEGACYSCORE BOX — mobile fonts were too small.
   Bump them just enough to read well while still fitting the rails.
========================================================= */
@media (max-width: 720px) {
  #formula .formula-rail span,
  .formula-panel .formula-rail span {
    font-size: 9px !important;
    letter-spacing: .06em !important;
  }
  #formula .formula-rail strong,
  .formula-panel .formula-rail strong {
    font-size: 10px !important;
    letter-spacing: .055em !important;
  }
  #formula .formula-core-copy em,
  .formula-panel .formula-core-copy em {
    font-size: 10px !important;
  }
  #formula .formula-main .formula-equation,
  .formula-panel .formula-main .formula-equation {
    font-size: clamp(13px, 4vw, 16px) !important;
  }
  #formula .formula-main.formula-main-integrated .ai-engine-button-hint,
  .formula-panel .formula-main.formula-main-integrated .ai-engine-button-hint {
    font-size: 9.5px !important;
  }
}

/* =========================================================
   5. MOBILE TOP BAR — restore "AI-LegacyScore + Gemini"
   It was display:none on mobile. Show it, sized to fit cleanly.
========================================================= */
@media (max-width: 760px) {
  .broadcast-bar {
    gap: 8px !important;
  }
  .broadcast-right {
    display: inline-flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
    color: rgba(245, 199, 107, .88) !important;
    font-size: 8.6px !important;
    letter-spacing: .05em !important;
    white-space: nowrap !important;
  }
}

/* On very small phones, drop the redundant "Legacy Project" title
   (it already lives in the tab right below) to guarantee the
   powered-by badge fits without crowding. */
@media (max-width: 430px) {
  .broadcast-title {
    display: none !important;
  }
  .broadcast-right {
    font-size: 8.2px !important;
  }
}

/* =========================================================
   6. FINAL POLISH — small consistency touches
========================================================= */
/* Keep the active page tab unmistakable and crisp */
.site-page-tab.is-active {
  box-shadow: 0 10px 26px rgba(245,199,107,.18),
              inset 0 1px 0 rgba(255,255,255,.42) !important;
}

/* Even rhythm between the stats console blocks */
#statsfacts .scsl-facts-layout {
  gap: 14px !important;
}

/* ===== assets/scsl15-premium-polish.css ===== */
/* =========================================================
   SCSL15 — Premium polish layer (loaded last)
   Additive only. Covers:
   1. Sticky page tabs (pinned under the fixed broadcast bar)
   2. Anchor-jump offsets so targets clear the sticky header stack
   3. Red "Through Season 1 + Season 2" kicker text
   4. Hero call-to-action buttons
   5. Floating "Ask AI" bubble + one-time tooltip
   6. Ask AI chat drawer (corner panel desktop / bottom sheet mobile)
   ========================================================= */

:root {
  --askai-gold: #f5c76b;
  --askai-gold-deep: #b9892f;
  --askai-ink: #120c02;
  --askai-red: #d11f2a;
  --askai-red-deep: #9c0f17;
  --askai-panel: #0a0c15;
  --askai-panel-2: #070912;
  --askai-line: rgba(245, 199, 107, .20);

  /* sticky header stack */
  --scsl-tabs-h: 60px;
  --scsl-jump-h: 0px; /* mobile-jump-nav is hidden on desktop */
  --scsl-anchor-offset: calc(var(--scsl-fixed-header-h, 44px) + var(--scsl-tabs-h) + var(--scsl-jump-h) + 14px);
}

/* =========================================================
   1. STICKY PAGE TABS
   The broadcast bar is position:fixed (height --scsl-fixed-header-h)
   with body padded by that height. Pin the tabs flush UNDER it.

   The base CSS sets overflow-x:hidden on html/body, which the spec
   forces overflow-y to `auto` for — making them scroll containers and
   breaking position:sticky. overflow-x:clip blocks horizontal scroll
   WITHOUT establishing a scroll container, so sticky works again.
   ========================================================= */
html, body {
  overflow-x: clip !important;
  overflow-y: visible !important;
}
.site-page-tabs {
  position: sticky !important;
  top: var(--scsl-fixed-header-h, 44px) !important;
  z-index: 2147482900 !important; /* under the fixed bar (2147483000), above content */
}

/* Keep the section-shortcut bar stacked directly beneath the tabs on mobile */
@media (max-width: 760px) {
  .mobile-jump-nav {
    top: calc(var(--scsl-fixed-header-h, 40px) + var(--scsl-tabs-h)) !important;
    z-index: 2147482800 !important;
  }
}

/* =========================================================
   2. ANCHOR-JUMP OFFSETS
   Targets must clear the fixed bar + sticky tabs (+ jump nav on mobile).
   Use scroll-padding-top on the scroll root ONLY — the base CSS also
   sets scroll-margin-top on sections, and the two ADD up (double gap),
   so we zero the section scroll-margin and let scroll-padding own it.
   ========================================================= */
html {
  scroll-padding-top: var(--scsl-anchor-offset) !important;
  scroll-behavior: smooth;
}
section,
[id],
.panel {
  scroll-margin-top: 0 !important;
}

@media (max-width: 760px) {
  :root {
    --scsl-tabs-h: 58px;
    --scsl-jump-h: 60px; /* section-shortcut bar is visible on phones */
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* =========================================================
   3. RED KICKER TEXT ("Through Season 1 + Season 2")
   Keeps the gold pill, makes the wordmark read in SCSL red.
   ========================================================= */
.stats-facts-kicker,
#statsfacts .stats-facts-kicker {
  color: var(--askai-red) !important;
  -webkit-text-fill-color: var(--askai-red) !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .25);
}

/* =========================================================
   4. HERO CALL-TO-ACTION BUTTONS
   ========================================================= */
.hero-cta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 22px;
}
.stat-vault-head + .hero-cta,
.hero-cta-vault {
  justify-content: flex-start;
  margin-top: 18px;
  margin-bottom: 22px;
}

/* Legacy Intro button relocated into the hero, just under the CTA row */
.hero .legacy-intro-cta.hero-intro-action {
  margin: 14px 0 0;
}

.hero-btn {
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 50px;
  padding: 0 26px;
  border-radius: 999px;
  font-family: var(--font-display, "Rajdhani", sans-serif);
  font-weight: 800;
  font-size: 15px;
  letter-spacing: .085em;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.hero-btn:active { transform: translateY(1px); }

.hero-btn-primary {
  color: #160f04;
  border: 1px solid rgba(245, 199, 107, .85);
  background: linear-gradient(180deg, #fbe0a4, var(--askai-gold) 42%, var(--askai-gold-deep));
  box-shadow: 0 14px 32px rgba(245, 199, 107, .26), inset 0 1px 0 rgba(255, 255, 255, .55);
}
.hero-btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(245, 199, 107, .34), inset 0 1px 0 rgba(255, 255, 255, .6);
}

.hero-btn-ghost {
  color: rgba(247, 247, 251, .92);
  border: 1px solid rgba(245, 199, 107, .42);
  background: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
}
.hero-btn-ghost:hover {
  transform: translateY(-1px);
  border-color: rgba(245, 199, 107, .7);
  background: linear-gradient(180deg, rgba(245, 199, 107, .14), rgba(245, 199, 107, .04));
}

@media (max-width: 760px) {
  .hero-cta { gap: 10px; margin-top: 18px; }
  .hero-btn { flex: 1 1 46%; min-height: 48px; padding: 0 16px; font-size: 14px; }
  .hero-cta-vault .hero-btn { flex: 1 1 46%; }
}

/* =========================================================
   5. FLOATING "ASK AI" BUBBLE + TOOLTIP
   ========================================================= */
.askai-bubble {
  position: fixed;
  right: max(18px, env(safe-area-inset-right));
  bottom: calc(18px + env(safe-area-inset-bottom));
  z-index: 2147483620;
  width: 64px;
  height: 64px;
  padding: 0;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  background: transparent;
  -webkit-tap-highlight-color: transparent;
}

.askai-bubble-face {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  border-radius: 50%;
  color: #1a1203;
  border: 1px solid rgba(255, 255, 255, .5);
  background: radial-gradient(120% 120% at 30% 22%, #ffe7ac 0%, var(--askai-gold) 46%, var(--askai-gold-deep) 100%);
  box-shadow: 0 16px 34px rgba(0, 0, 0, .42), 0 6px 16px rgba(245, 199, 107, .4), inset 0 1px 0 rgba(255, 255, 255, .65);
  transition: transform .2s ease, box-shadow .2s ease;
}
.askai-bubble-word {
  font-family: var(--font-display, "Rajdhani", sans-serif);
  font-weight: 900;
  font-size: 11px;
  letter-spacing: .14em;
  margin-top: -2px;
}
.askai-bubble:hover .askai-bubble-face {
  transform: translateY(-2px) scale(1.03);
  box-shadow: 0 22px 44px rgba(0, 0, 0, .5), 0 10px 24px rgba(245, 199, 107, .5), inset 0 1px 0 rgba(255, 255, 255, .7);
}
.askai-bubble:active .askai-bubble-face { transform: translateY(0) scale(.98); }

.askai-bubble-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  pointer-events: none;
  opacity: 0;
}
.askai-bubble.is-new .askai-bubble-ring {
  opacity: 1;
  box-shadow: 0 0 0 0 rgba(245, 199, 107, .55);
  animation: askaiPulse 2.2s ease-out infinite;
}
@keyframes askaiPulse {
  0%   { box-shadow: 0 0 0 0 rgba(245, 199, 107, .5); }
  70%  { box-shadow: 0 0 0 18px rgba(245, 199, 107, 0); }
  100% { box-shadow: 0 0 0 0 rgba(245, 199, 107, 0); }
}

.askai-tooltip {
  position: fixed;
  right: max(18px, env(safe-area-inset-right));
  bottom: calc(90px + env(safe-area-inset-bottom));
  z-index: 2147483621;
  display: flex;
  align-items: center;
  gap: 9px;
  max-width: min(280px, calc(100vw - 36px));
  padding: 11px 12px 11px 14px;
  border-radius: 14px;
  border: 1px solid var(--askai-line);
  background: linear-gradient(180deg, rgba(16, 18, 28, .98), rgba(8, 10, 18, .98));
  box-shadow: 0 18px 40px rgba(0, 0, 0, .5);
  color: #f4f4f8;
  font-family: var(--font-stat, Inter, sans-serif);
  font-size: 13.5px;
  opacity: 0;
  transform: translateY(8px) scale(.96);
  transform-origin: bottom right;
  pointer-events: none;
  transition: opacity .25s ease, transform .25s ease;
}
.askai-tooltip.is-shown { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.askai-tooltip::after {
  content: "";
  position: absolute;
  right: 26px;
  bottom: -7px;
  width: 13px;
  height: 13px;
  background: inherit;
  border-right: 1px solid var(--askai-line);
  border-bottom: 1px solid var(--askai-line);
  transform: rotate(45deg);
}
.askai-tooltip-text strong { color: var(--askai-gold); }
.askai-tooltip-dot {
  width: 8px; height: 8px; flex: 0 0 auto;
  border-radius: 50%;
  background: var(--askai-gold);
  box-shadow: 0 0 0 4px rgba(245, 199, 107, .18);
}
.askai-tooltip-x {
  flex: 0 0 auto;
  border: none;
  background: transparent;
  color: rgba(255, 255, 255, .55);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  padding: 0 2px;
}
.askai-tooltip-x:hover { color: #fff; }

/* Hide the bubble + tooltip while the music-intro overlay is up */
body.music-intro-open .askai-bubble,
body.music-intro-open .askai-tooltip { display: none !important; }

/* =========================================================
   6. ASK AI DRAWER
   ========================================================= */
.askai-backdrop {
  position: fixed;
  inset: 0;
  z-index: 2147483630;
  background: rgba(3, 4, 9, .22); /* light dim on desktop; corner panel stays in context */
  opacity: 0;
  transition: opacity .24s ease;
}
.askai-backdrop.is-shown { opacity: 1; }

.askai-drawer {
  position: fixed;
  z-index: 2147483640;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  color: #f3f3f7;
  font-family: var(--font-stat, Inter, sans-serif);
  border: 1px solid var(--askai-line);
  background: linear-gradient(180deg, var(--askai-panel), var(--askai-panel-2));
  box-shadow: 0 30px 70px rgba(0, 0, 0, .62);

  /* desktop: corner panel */
  right: max(20px, env(safe-area-inset-right));
  bottom: calc(20px + env(safe-area-inset-bottom));
  width: 390px;
  max-width: calc(100vw - 36px);
  height: min(640px, calc(100vh - 130px));
  border-radius: 22px;
  transform: translateY(18px) scale(.98);
  opacity: 0;
  pointer-events: none;
  transform-origin: bottom right;
  transition: opacity .24s ease, transform .24s ease;
}
.askai-drawer.is-open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }

.askai-grip { display: none; }

.askai-head {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 15px 14px 14px 16px;
  border-bottom: 1px solid var(--askai-line);
  background: linear-gradient(180deg, rgba(245, 199, 107, .12), rgba(245, 199, 107, 0));
}
.askai-head-mark {
  flex: 0 0 auto;
  width: 34px; height: 34px;
  display: grid; place-items: center;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, .14);
  background: rgba(255, 255, 255, .06);
}
.askai-head-mark img { width: 22px; height: 22px; object-fit: contain; display: block; }
.askai-head-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.askai-head-text strong {
  font-family: var(--font-display, "Rajdhani", sans-serif);
  font-weight: 800;
  font-size: 17px;
  letter-spacing: .04em;
  color: #fff;
}
.askai-head-text span {
  font-size: 11.5px;
  letter-spacing: .05em;
  color: rgba(245, 199, 107, .8);
  text-transform: uppercase;
}
.askai-close {
  margin-left: auto;
  flex: 0 0 auto;
  width: 34px; height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .05);
  color: rgba(255, 255, 255, .7);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  transition: background .16s ease, color .16s ease;
}
.askai-close:hover { background: rgba(255, 255, 255, .1); color: #fff; }

.askai-messages {
  flex: 1 1 auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 16px 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  scrollbar-width: thin;
}

.askai-empty {
  margin: auto 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: center;
  padding: 6px 6px 2px;
}
.askai-empty strong { font-size: 17px; color: #fff; }
.askai-empty > span { font-size: 13.5px; color: rgba(235, 236, 245, .68); line-height: 1.5; }
.askai-starters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-top: 10px;
}
.askai-starter {
  cursor: pointer;
  padding: 9px 13px;
  border-radius: 999px;
  border: 1px solid rgba(245, 199, 107, .34);
  background: linear-gradient(180deg, rgba(245, 199, 107, .12), rgba(245, 199, 107, .03));
  color: rgba(245, 226, 188, .96);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .01em;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}
.askai-starter:hover { transform: translateY(-1px); border-color: rgba(245, 199, 107, .65); background: linear-gradient(180deg, rgba(245, 199, 107, .2), rgba(245, 199, 107, .06)); }

.askai-msg { display: flex; flex-direction: column; gap: 4px; max-width: 92%; }
.askai-msg-label {
  font-size: 10.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .42);
}
.askai-msg-body {
  padding: 11px 13px;
  border-radius: 15px;
  font-size: 14px;
  line-height: 1.55;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.askai-msg-user { align-self: flex-end; align-items: flex-end; }
.askai-msg-user .askai-msg-body {
  color: #160f04;
  background: linear-gradient(180deg, #fbe0a4, var(--askai-gold) 55%, var(--askai-gold-deep));
  border-bottom-right-radius: 5px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5);
}
.askai-msg-assistant { align-self: flex-start; }
.askai-msg-assistant .askai-msg-body {
  color: #eef0f6;
  background: rgba(255, 255, 255, .055);
  border: 1px solid rgba(255, 255, 255, .09);
  border-bottom-left-radius: 5px;
}
.askai-msg-assistant.loading .askai-msg-body { color: rgba(245, 199, 107, .9); }
.askai-msg-assistant.loading .askai-msg-body::after {
  content: " ▋";
  animation: askaiBlink 1s steps(2) infinite;
}
@keyframes askaiBlink { 50% { opacity: 0; } }
.askai-msg-assistant.error .askai-msg-body {
  color: #ffc9cd;
  background: rgba(209, 31, 42, .12);
  border-color: rgba(209, 31, 42, .35);
}

.askai-form {
  display: flex;
  gap: 9px;
  padding: 12px 12px calc(12px + env(safe-area-inset-bottom));
  border-top: 1px solid var(--askai-line);
  background: rgba(5, 6, 12, .6);
}
.askai-input-shell { flex: 1 1 auto; display: flex; }
.askai-input {
  flex: 1 1 auto;
  width: 100%;
  min-height: 46px;
  padding: 0 15px;
  border-radius: 13px;
  border: 1px solid rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .05);
  color: #fff;
  font-size: 15px; /* >=16px avoided but keeps zoom minimal; bumped on mobile below */
  font-family: inherit;
  outline: none;
  transition: border-color .16s ease, background .16s ease;
}
.askai-input::placeholder { color: rgba(235, 236, 245, .45); }
.askai-input:focus { border-color: rgba(245, 199, 107, .6); background: rgba(245, 199, 107, .06); }

.askai-send {
  flex: 0 0 auto;
  width: 50px;
  min-height: 46px;
  border-radius: 13px;
  border: 1px solid rgba(245, 199, 107, .8);
  cursor: pointer;
  color: #160f04;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, #fbe0a4, var(--askai-gold) 45%, var(--askai-gold-deep));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55);
  transition: transform .16s ease, box-shadow .16s ease, opacity .16s ease;
}
.askai-send:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(245, 199, 107, .32), inset 0 1px 0 rgba(255, 255, 255, .6); }
.askai-send:disabled { opacity: .55; cursor: default; transform: none; }

/* ---------- mobile: full-width bottom sheet ---------- */
@media (max-width: 760px) {
  .askai-bubble { width: 58px; height: 58px; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); }

  .askai-backdrop {
    background: rgba(3, 4, 9, .58);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
  }

  .askai-drawer {
    right: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    max-width: 100%;
    height: 86vh;
    height: 86dvh;
    border-radius: 22px 22px 0 0;
    border-bottom: none;
    transform: translateY(100%);
    transform-origin: bottom center;
  }
  .askai-drawer.is-open { transform: translateY(0); }
  .askai-grip {
    display: block;
    width: 42px; height: 4px;
    margin: 9px auto 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, .22);
  }
  .askai-input { font-size: 16px; } /* prevent iOS zoom on focus */
  body.askai-open { overflow: hidden !important; }
}

@media (prefers-reduced-motion: reduce) {
  .askai-bubble.is-new .askai-bubble-ring { animation: none; }
  .askai-drawer, .askai-tooltip, .askai-backdrop { transition: opacity .12s ease; }
  .askai-drawer { transform: none; }
}

/* =========================================================
   7. OVERRIDE universal-button-glass.css on the new buttons
   That sheet styles every <button> via
   :where(...):not(.formula-main):not(.formula-card) — the two
   :not()s sit OUTSIDE :where(), giving it specificity (0,2,0)
   plus !important. We must beat that with ID-level specificity.
   ========================================================= */
#askAiBubble {
  position: fixed !important;
  overflow: visible !important;
  isolation: auto !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
#askAiBubble::before, #askAiBubble::after { content: none !important; display: none !important; }
#askAiBubble .askai-bubble-face,
#askAiBubble .askai-bubble-ring { position: absolute !important; z-index: auto !important; }

.hero-cta .hero-btn,
#askAiDrawer .askai-send,
#askAiDrawer .askai-close,
#askAiDrawer .askai-starter,
#askAiTooltip .askai-tooltip-x {
  overflow: visible !important;
  isolation: auto !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.hero-cta button.hero-btn::before, .hero-cta button.hero-btn::after,
#askAiDrawer .askai-send::before, #askAiDrawer .askai-send::after,
#askAiDrawer .askai-close::before, #askAiDrawer .askai-close::after,
#askAiDrawer .askai-starter::before, #askAiDrawer .askai-starter::after,
#askAiTooltip .askai-tooltip-x::before, #askAiTooltip .askai-tooltip-x::after {
  content: none !important;
  display: none !important;
}

.hero-cta .hero-btn-primary {
  border: 1px solid rgba(245, 199, 107, .85) !important;
  background: linear-gradient(180deg, #fbe0a4, var(--askai-gold) 42%, var(--askai-gold-deep)) !important;
  box-shadow: 0 14px 32px rgba(245, 199, 107, .26), inset 0 1px 0 rgba(255, 255, 255, .55) !important;
}
.hero-cta .hero-btn-ghost {
  border: 1px solid rgba(245, 199, 107, .42) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12) !important;
}
#askAiDrawer .askai-send {
  border: 1px solid rgba(245, 199, 107, .8) !important;
  background: linear-gradient(180deg, #fbe0a4, var(--askai-gold) 45%, var(--askai-gold-deep)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55) !important;
}
#askAiDrawer .askai-starter {
  border: 1px solid rgba(245, 199, 107, .34) !important;
  background: linear-gradient(180deg, rgba(245, 199, 107, .12), rgba(245, 199, 107, .03)) !important;
}
#askAiDrawer .askai-close {
  border: 1px solid rgba(255, 255, 255, .12) !important;
  background: rgba(255, 255, 255, .05) !important;
  box-shadow: none !important;
}
#askAiTooltip .askai-tooltip-x {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* ===== assets/final-button-polish.css ===== */
/* ===== SCSL15 FINAL BUTTON POLISH ===== */

:where(
  button,
  [role="button"],
  a.hero-btn,
  a.site-page-tab,
  a.site-drawer-link,
  a.formula-archive-action,
  .mobile-jump-nav a,
  .broadcast-live,
  .db-chip,
  .legacy-gpt-prompt,
  .legacy-gpt-submit,
  .scsl-fact-metric,
  .scsl-facts-ask-submit,
  .scsl-facts-archive-links a,
  .scsl-facts-open-vault,
  #statsfacts .scsl-facts-tabs button
) {
  -webkit-tap-highlight-color: transparent !important;
  touch-action: manipulation !important;
}

:where(
  .hero-btn,
  .legacy-intro-btn,
  .formula-archive-action,
  .mobile-jump-nav a,
  .site-page-tab,
  .site-menu-toggle,
  .site-drawer-link,
  .db-chip,
  .legacy-gpt-prompt,
  .legacy-gpt-submit,
  .scsl-fact-metric,
  .scsl-facts-ask-submit,
  .scsl-facts-archive-links a,
  .scsl-facts-open-vault,
  #statsfacts .scsl-facts-tabs button
) {
  text-decoration: none !important;
  text-wrap: balance !important;
}

:where(
  .hero-btn,
  .legacy-intro-btn,
  .formula-archive-action,
  .mobile-jump-nav a,
  .site-page-tab,
  .site-menu-toggle,
  .site-drawer-link,
  .db-chip,
  .legacy-gpt-prompt,
  .legacy-gpt-submit,
  .scsl-fact-metric,
  .scsl-facts-ask-submit,
  .scsl-facts-archive-links a,
  .scsl-facts-open-vault,
  #statsfacts .scsl-facts-tabs button
):focus-visible {
  outline: 2px solid rgba(255,232,171,.86) !important;
  outline-offset: 3px !important;
  box-shadow:
    0 0 0 5px rgba(245,199,107,.16),
    0 14px 34px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.22) !important;
}

:where(
  .hero-btn,
  .legacy-intro-btn,
  .formula-archive-action,
  .mobile-jump-nav a,
  .site-page-tab,
  .site-menu-toggle,
  .db-chip,
  .legacy-gpt-prompt,
  .legacy-gpt-submit,
  .scsl-fact-metric,
  .scsl-facts-ask-submit,
  .scsl-facts-archive-links a,
  .scsl-facts-open-vault,
  #statsfacts .scsl-facts-tabs button
):active {
  transform: translateY(1px) scale(.99) !important;
}

.legacy-intro-duration {
  border: 1px solid rgba(20,12,2,.22) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.58),
    inset 0 -1px 0 rgba(91,57,9,.22),
    0 0 14px rgba(245,199,107,.18) !important;
}

.site-menu-toggle {
  border-radius: 999px !important;
}

.site-menu-toggle-icon {
  border-color: rgba(245,199,107,.42) !important;
  background:
    radial-gradient(circle at 35% 20%, rgba(255,255,255,.18), transparent 38%),
    rgba(0,0,0,.26) !important;
}

.legacy-gpt-prompt,
.legacy-gpt-submit {
  border-radius: 999px !important;
}

.database-chips,
#databaseChips,
.legacy-gpt-prompts,
#statsfacts .scsl-facts-tabs {
  scroll-padding-left: 12px !important;
  scroll-padding-right: 12px !important;
}

@media (max-width: 760px) {
  .database-chips,
  #databaseChips {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    overflow: visible !important;
    scrollbar-width: none !important;
    white-space: normal !important;
  }

  .database-chips::-webkit-scrollbar,
  #databaseChips::-webkit-scrollbar {
    display: none !important;
  }

  .database-chips .db-chip,
  #databaseChips .db-chip {
    flex: 0 0 auto !important;
    max-width: 100% !important;
  }

  .database-chips .db-chip:first-child,
  #databaseChips .db-chip:first-child,
  .legacy-gpt-prompts .legacy-gpt-prompt:first-child,
  #statsfacts .scsl-facts-tabs button:first-child {
    margin-left: 0 !important;
  }
}

.legacy-gpt-prompt {
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.020)),
    rgba(5,6,12,.34) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 9px 20px rgba(0,0,0,.20) !important;
}

.legacy-gpt-prompt:hover,
.legacy-gpt-prompt:focus-visible {
  border-color: rgba(245,199,107,.60) !important;
  background:
    linear-gradient(180deg, rgba(245,199,107,.15), rgba(245,199,107,.045)),
    rgba(5,6,12,.38) !important;
}

.legacy-gpt-submit,
.scsl-facts-ask-submit {
  min-width: 58px !important;
  background:
    linear-gradient(90deg, rgba(201,31,47,.18), transparent 58%),
    linear-gradient(180deg, #f6dc92, #b9892f) !important;
  color: #171008 !important;
  border-color: rgba(255,255,255,.26) !important;
  box-shadow:
    0 10px 22px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.38) !important;
}

.askai-send svg {
  width: 18px !important;
  height: 18px !important;
}

.askai-close,
.askai-tooltip-x,
.legacy-intro-close {
  display: inline-grid !important;
  place-items: center !important;
  line-height: 1 !important;
}

.askai-tooltip-x {
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  border-radius: 999px !important;
  font-size: 18px !important;
}

@media (min-width: 761px) {
  .site-page-tabs {
    display: block !important;
    position: relative !important;
    z-index: 20 !important;
    padding: 8px 18px !important;
    border-bottom: 1px solid rgba(245,199,107,.16) !important;
    background:
      linear-gradient(180deg, rgba(9,10,16,.94), rgba(4,5,10,.86)) !important;
  }

  .site-page-tabs-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    width: min(100%, 660px) !important;
    margin: 0 auto !important;
  }

  .site-page-tab {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    flex: 1 1 0 !important;
    min-height: 42px !important;
    padding: 0 18px !important;
    border: 1px solid rgba(245,199,107,.28) !important;
    border-radius: 999px !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.020)),
      rgba(5,6,12,.48) !important;
    color: rgba(247,247,251,.90) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.10),
      0 10px 22px rgba(0,0,0,.18) !important;
    font-family: var(--font-stat, Rajdhani, Inter, sans-serif) !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  .site-page-tab span,
  .site-page-tab em {
    display: inline-flex !important;
    align-items: center !important;
    line-height: 1 !important;
  }

  .site-page-tab span {
    font-size: 12px !important;
    font-weight: 950 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
  }

  .site-page-tab em {
    color: rgba(245,199,107,.82) !important;
    font-size: 12px !important;
    font-style: normal !important;
    font-weight: 900 !important;
    letter-spacing: .04em !important;
  }

  .site-page-tab.is-active {
    border-color: rgba(255,255,255,.28) !important;
    background:
      linear-gradient(90deg, rgba(201,31,47,.18), transparent 58%),
      linear-gradient(180deg, #f6dc92, #b9892f) !important;
    color: #171008 !important;
  }

  .site-page-tab.is-active em {
    color: rgba(23,16,8,.78) !important;
  }

  .hero-intro-action .legacy-intro-btn {
    min-height: 40px !important;
    height: auto !important;
    padding: 0 12px 0 16px !important;
    gap: 9px !important;
    border-radius: 999px !important;
    font-size: 12px !important;
  }

  .hero-intro-action .legacy-intro-btn-main {
    font-size: 12px !important;
    line-height: 1 !important;
  }

  .hero-intro-action .legacy-intro-duration {
    min-height: 23px !important;
    padding: 5px 8px 4px !important;
    font-size: 10px !important;
  }
}

@media (max-width: 760px) {
  #top15Grid .card .mobile-expand-hint {
    position: relative !important;
    min-height: 42px !important;
    padding: 0 12px 0 14px !important;
    border-radius: 14px !important;
    border-color: rgba(var(--scsl-team-rgb, 245,199,107), .38) !important;
    background:
      linear-gradient(90deg, rgba(var(--scsl-team1-rgb, 245,199,107), .14), rgba(var(--scsl-team2-rgb, 201,31,47), .08)),
      linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.018)),
      rgba(5,6,12,.34) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.11),
      inset 0 -1px 0 rgba(var(--scsl-team-rgb, 245,199,107), .12),
      0 10px 22px rgba(0,0,0,.18) !important;
    cursor: pointer !important;
    overflow: hidden !important;
    isolation: isolate !important;
  }

  #top15Grid .card .mobile-expand-hint > span {
    position: relative !important;
    z-index: 1 !important;
  }

  #top15Grid .card .hint-closed,
  #top15Grid .card .hint-open {
    max-width: calc(100% - 42px) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  #top15Grid .card .hint-arrow {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 28px !important;
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    margin-left: auto !important;
    border: 1px solid rgba(var(--scsl-team-rgb, 245,199,107), .48) !important;
    border-radius: 999px !important;
    background:
      radial-gradient(circle at 34% 24%, rgba(255,255,255,.20), transparent 36%),
      linear-gradient(180deg, rgba(var(--scsl-team-rgb, 245,199,107), .24), rgba(4,5,9,.34)) !important;
    box-shadow:
      0 7px 15px rgba(0,0,0,.30),
      inset 0 1px 0 rgba(255,255,255,.18) !important;
    color: var(--scsl-team-primary, #f5c76b) !important;
    font-size: 0 !important;
    line-height: 0 !important;
    text-indent: 0 !important;
    text-shadow: none !important;
    transform: none !important;
    rotate: 0deg !important;
    scale: 1 !important;
    overflow: hidden !important;
    transition:
      background .18s ease,
      border-color .18s ease,
      box-shadow .18s ease,
      transform .18s ease !important;
  }

  #top15Grid .card .hint-arrow::before,
  #top15Grid .card .hint-arrow::after {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    display: block !important;
    width: 9px !important;
    height: 2px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: currentColor !important;
    filter:
      drop-shadow(0 0 5px rgba(245,199,107,.30))
      drop-shadow(0 1px 2px rgba(0,0,0,.34)) !important;
  }

  #top15Grid .card .hint-arrow::before {
    left: 7px !important;
    transform: translateY(-50%) rotate(45deg) !important;
  }

  #top15Grid .card .hint-arrow::after {
    right: 7px !important;
    transform: translateY(-50%) rotate(-45deg) !important;
  }

  #top15Grid .card.expanded .mobile-expand-hint,
  #top15Grid .card[aria-expanded="true"] .mobile-expand-hint {
    border-color: rgba(255,255,255,.30) !important;
    color: #171008 !important;
    background:
      linear-gradient(90deg, rgba(201,31,47,.16), transparent 58%),
      linear-gradient(180deg, #f6dc92, #b9892f) !important;
    box-shadow:
      0 12px 26px rgba(0,0,0,.30),
      inset 0 1px 0 rgba(255,255,255,.36),
      inset 0 -1px 0 rgba(84,53,10,.18) !important;
  }

  #top15Grid .card.expanded .mobile-expand-hint .hint-arrow,
  #top15Grid .card[aria-expanded="true"] .mobile-expand-hint .hint-arrow,
  #top15Grid .card.expanded .hint-arrow,
  #top15Grid .card[aria-expanded="true"] .hint-arrow {
    border-color: rgba(22,14,4,.24) !important;
    background:
      radial-gradient(circle at 34% 24%, rgba(255,255,255,.18), transparent 38%),
      rgba(0,0,0,.18) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.20),
      0 6px 12px rgba(0,0,0,.18) !important;
    color: #171008 !important;
    transform: none !important;
  }

  #top15Grid .card.expanded .mobile-expand-hint .hint-arrow::before,
  #top15Grid .card[aria-expanded="true"] .mobile-expand-hint .hint-arrow::before,
  #top15Grid .card.expanded .hint-arrow::before,
  #top15Grid .card[aria-expanded="true"] .hint-arrow::before {
    transform: translateY(-50%) rotate(-45deg) !important;
  }

  #top15Grid .card.expanded .mobile-expand-hint .hint-arrow::after,
  #top15Grid .card[aria-expanded="true"] .mobile-expand-hint .hint-arrow::after,
  #top15Grid .card.expanded .hint-arrow::after,
  #top15Grid .card[aria-expanded="true"] .hint-arrow::after {
    transform: translateY(-50%) rotate(45deg) !important;
  }

  #top15Grid .card:active .mobile-expand-hint {
    transform: translateY(1px) !important;
  }

  .legacy-gpt-prompts {
    gap: 8px !important;
  }

  .legacy-gpt-prompt {
    min-height: 36px !important;
    padding: 0 11px !important;
    white-space: nowrap !important;
  }
}

/* ===== assets/button-cleanup-final.css ===== */
/* ===== SCSL15 BUTTON CLEANUP FINAL =====
   Last-loaded button authority. Keeps old gloss/arrow pseudo-elements from
   stacking over the real controls. */

:root {
  --scsl-button-gold: #f5c76b;
  --scsl-button-gold-deep: #b9892f;
  --scsl-button-ink: #171008;
  --scsl-button-panel: rgba(5, 6, 12, .48);
  --scsl-button-line: rgba(245, 199, 107, .34);
}

:is(
  .hero-btn,
  .legacy-intro-btn,
  .intro-primary,
  .intro-secondary,
  .site-page-tab,
  .site-menu-toggle,
  .site-drawer-close,
  .site-drawer-link,
  .mobile-jump-nav a,
  .broadcast-live,
  .music-btn,
  .db-chip,
  .legacy-gpt-prompt,
  .legacy-gpt-submit,
  .scsl-facts-ask-submit,
  .scsl-facts-open-vault,
  .scsl-facts-archive-links a,
  #statsfacts .scsl-facts-tabs button,
  .askai-starter,
  .askai-send,
  .askai-close,
  .askai-tooltip-x,
  .legacy-intro-close
) {
  box-sizing: border-box !important;
  -webkit-tap-highlight-color: transparent !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  line-height: 1.05 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  touch-action: manipulation !important;
}

:is(
  .hero-btn,
  .legacy-intro-btn,
  .intro-primary,
  .intro-secondary,
  .site-page-tab,
  .site-menu-toggle,
  .site-drawer-close,
  .site-drawer-link,
  .mobile-jump-nav a,
  .broadcast-live,
  .music-btn,
  .db-chip,
  .legacy-gpt-prompt,
  .legacy-gpt-submit,
  .scsl-facts-ask-submit,
  .scsl-facts-open-vault,
  .scsl-facts-archive-links a,
  #statsfacts .scsl-facts-tabs button,
  .askai-starter,
  .askai-send,
  .askai-close,
  .askai-tooltip-x,
  .legacy-intro-close
)::before,
:is(
  .hero-btn,
  .legacy-intro-btn,
  .intro-primary,
  .intro-secondary,
  .site-page-tab,
  .site-menu-toggle,
  .site-drawer-close,
  .site-drawer-link,
  .mobile-jump-nav a,
  .broadcast-live,
  .music-btn,
  .db-chip,
  .legacy-gpt-prompt,
  .legacy-gpt-submit,
  .scsl-facts-ask-submit,
  .scsl-facts-open-vault,
  .scsl-facts-archive-links a,
  #statsfacts .scsl-facts-tabs button,
  .askai-starter,
  .askai-send,
  .askai-close,
  .askai-tooltip-x,
  .legacy-intro-close
)::after {
  content: none !important;
  display: none !important;
}

.hero-cta,
.hero-cta-vault,
.music-intro-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.hero-btn,
.legacy-intro-btn,
.intro-primary,
.intro-secondary {
  display: inline-flex !important;
  min-height: 46px !important;
  padding: 0 19px !important;
  border-radius: 999px !important;
  border: 1px solid var(--scsl-button-line) !important;
  overflow: visible !important;
  white-space: nowrap !important;
  font-family: var(--font-stat, Rajdhani, Inter, sans-serif) !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  letter-spacing: .04em !important;
}

.hero-btn-primary,
.intro-primary,
.legacy-gpt-submit,
.scsl-facts-ask-submit {
  background:
    linear-gradient(90deg, rgba(201, 31, 47, .16), transparent 58%),
    linear-gradient(180deg, #f6dc92, var(--scsl-button-gold-deep)) !important;
  color: var(--scsl-button-ink) !important;
  border-color: rgba(255, 255, 255, .28) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .36),
    0 10px 22px rgba(0, 0, 0, .28) !important;
}

.hero-btn-ghost,
.intro-secondary,
.legacy-intro-btn {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .075), rgba(255, 255, 255, .018)),
    var(--scsl-button-panel) !important;
  color: rgba(247, 247, 251, .92) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .10),
    0 10px 22px rgba(0, 0, 0, .20) !important;
}

.legacy-intro-duration {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 23px !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.site-menu-toggle {
  display: inline-flex !important;
  gap: 8px !important;
  min-height: 38px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  overflow: visible !important;
}

.site-menu-toggle-icon,
.site-menu-toggle-icon span {
  box-sizing: border-box !important;
}

.site-page-tabs-inner {
  min-width: 0 !important;
}

.site-page-tab {
  display: inline-flex !important;
  min-height: 42px !important;
  padding: 0 17px !important;
  gap: 9px !important;
  border-radius: 999px !important;
  border: 1px solid var(--scsl-button-line) !important;
  overflow: visible !important;
  white-space: nowrap !important;
}

.site-page-tab span,
.site-page-tab em {
  min-width: 0 !important;
  line-height: 1 !important;
}

.site-drawer-close,
.site-drawer-link,
.mobile-jump-nav a,
.broadcast-live,
.music-btn,
.db-chip,
.legacy-gpt-prompt,
.askai-starter,
#statsfacts .scsl-facts-tabs button {
  display: inline-flex !important;
  min-height: 38px !important;
  padding: 0 13px !important;
  border-radius: 999px !important;
  border: 1px solid var(--scsl-button-line) !important;
  overflow: visible !important;
  white-space: normal !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .070), rgba(255, 255, 255, .018)),
    rgba(5, 6, 12, .42) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .10),
    0 8px 18px rgba(0, 0, 0, .18) !important;
}

.database-chips,
#databaseChips,
.legacy-gpt-prompts,
.askai-starters,
#statsfacts .scsl-facts-tabs {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.legacy-gpt-form,
.askai-form {
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: stretch !important;
  gap: 8px !important;
}

.legacy-gpt-submit,
.scsl-facts-ask-submit {
  display: inline-grid !important;
  place-items: center !important;
  min-width: 60px !important;
  min-height: 42px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

#askAiBubble::before,
#askAiBubble::after {
  content: none !important;
  display: none !important;
}

.askai-send {
  display: inline-grid !important;
  place-items: center !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  overflow: visible !important;
}

.askai-send svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
}

.askai-close,
.askai-tooltip-x,
.legacy-intro-close {
  display: inline-grid !important;
  place-items: center !important;
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  font-size: 20px !important;
  line-height: 1 !important;
  overflow: visible !important;
}

#playersTable th .sort-indicator {
  display: inline-block !important;
  width: 0 !important;
  height: 0 !important;
  margin-left: 6px !important;
  vertical-align: middle !important;
  border-left: 4px solid transparent !important;
  border-right: 4px solid transparent !important;
}

#playersTable th .sort-indicator.sort-asc {
  border-bottom: 6px solid currentColor !important;
}

#playersTable th .sort-indicator.sort-desc {
  border-top: 6px solid currentColor !important;
}

body.stat-vault-page #database,
body.stat-vault-page .stat-vault-screen {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: clip !important;
}

body.stat-vault-page #database .table-wrap {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
  contain: inline-size !important;
  overscroll-behavior-inline: contain !important;
}

body.stat-vault-page #playersTable {
  width: max-content !important;
  min-width: 1450px !important;
  max-width: none !important;
}

@media (max-width: 760px) {
  body.stat-vault-page #playersTable {
    min-width: 1180px !important;
  }

  body.stat-vault-page .askai-bubble,
  body.stat-vault-page .askai-tooltip {
    display: none !important;
  }

  #top15Grid .card .mobile-expand-hint {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    padding: 7px 10px 7px 14px !important;
    border-radius: 14px !important;
    overflow: visible !important;
    isolation: isolate !important;
    box-sizing: border-box !important;
  }

  #top15Grid .card .mobile-expand-hint::before,
  #top15Grid .card .mobile-expand-hint::after {
    content: none !important;
    display: none !important;
  }

  #top15Grid .card .hint-closed,
  #top15Grid .card .hint-open {
    display: inline-flex !important;
    align-items: center !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 42px) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    line-height: 1 !important;
  }

  #top15Grid .card .hint-open {
    display: none !important;
  }

  #top15Grid .card.expanded .hint-closed,
  #top15Grid .card[aria-expanded="true"] .hint-closed {
    display: none !important;
  }

  #top15Grid .card.expanded .hint-open,
  #top15Grid .card[aria-expanded="true"] .hint-open {
    display: inline-flex !important;
  }

  #top15Grid .card .hint-arrow,
  #top15Grid .mobile-expand-hint .hint-arrow,
  #top15Grid .mobile-expand-hint .arrow,
  #top15Grid .mobile-expand-hint [class*="arrow"] {
    position: relative !important;
    inset: auto !important;
    display: inline-grid !important;
    place-items: center !important;
    flex: 0 0 30px !important;
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
    border: 1px solid rgba(var(--scsl-team-rgb, 245, 199, 107), .50) !important;
    border-radius: 999px !important;
    background:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M9 12.5 15 17.5 21 12.5' fill='none' stroke='%23f5c76b' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") 50% calc(50% - 2px) / 17px 17px no-repeat,
      linear-gradient(180deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .030)),
      rgba(5, 6, 12, .30) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, .14),
      0 7px 14px rgba(0, 0, 0, .24) !important;
    color: var(--scsl-team-primary, var(--scsl-button-gold)) !important;
    font-size: 0 !important;
    line-height: 0 !important;
    text-indent: 0 !important;
    text-shadow: none !important;
    overflow: hidden !important;
    transform: none !important;
    rotate: 0deg !important;
    scale: 1 !important;
  }

  #top15Grid .card .hint-arrow::after,
  #top15Grid .card .hint-arrow::before,
  #top15Grid .mobile-expand-hint .hint-arrow::after,
  #top15Grid .mobile-expand-hint .hint-arrow::before,
  #top15Grid .mobile-expand-hint .arrow::after,
  #top15Grid .mobile-expand-hint .arrow::before,
  #top15Grid .mobile-expand-hint [class*="arrow"]::before,
  #top15Grid .mobile-expand-hint [class*="arrow"]::after {
    content: none !important;
    display: none !important;
  }

  #top15Grid .card.expanded .mobile-expand-hint .hint-arrow,
  #top15Grid .card[aria-expanded="true"] .mobile-expand-hint .hint-arrow,
  #top15Grid .card.expanded .hint-arrow,
  #top15Grid .card[aria-expanded="true"] .hint-arrow {
    color: var(--scsl-button-ink) !important;
    border-color: rgba(22, 14, 4, .28) !important;
    background:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M9 17.5 15 12.5 21 17.5' fill='none' stroke='%23171008' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") 50% calc(50% + 2px) / 17px 17px no-repeat,
      linear-gradient(180deg, rgba(255, 255, 255, .18), rgba(255, 255, 255, .04)),
      rgba(0, 0, 0, .15) !important;
    transform: none !important;
  }

  .hero-btn,
  .legacy-intro-btn,
  .intro-primary,
  .intro-secondary {
    flex: 1 1 150px !important;
    min-height: 44px !important;
    padding: 0 15px !important;
    white-space: normal !important;
    text-align: center !important;
  }

  .site-menu-toggle {
    min-height: 36px !important;
    padding: 0 10px !important;
  }

  .site-drawer-close,
  .site-drawer-link,
  .mobile-jump-nav a,
  .db-chip,
  .legacy-gpt-prompt,
  .askai-starter,
  #statsfacts .scsl-facts-tabs button {
    min-height: 36px !important;
    padding: 0 11px !important;
    font-size: 12px !important;
  }

  .legacy-gpt-form,
  .askai-form {
    gap: 7px !important;
  }

  .askai-send {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
  }

}

/* ===== assets/v36-final-quality-fixes.css ===== */
/* =========================================================
   SCSL15 v3.6 Final QA fixes
   Surgical only: Stat Vault text guard, mobile Ask AI keyboard safety,
   and tiny font/layout protections. No scoring, data, Gemini model,
   rankings, music asset, intro video, or reflection animation changes.
   ========================================================= */

/* The mobile table helper belongs near the database table, not inside the
   Stat Vault hero header. This prevents the "Tap headers" note from stacking
   word-by-word beside the title on narrow screens. */
body.stat-vault-page #database .stat-vault-head p::after {
  content: none !important;
}

body.stat-vault-page .stat-vault-head p {
  overflow-wrap: normal;
  word-break: normal;
  text-wrap: pretty;
}

/* Keep the Stat Vault header readable and intentional on small phones. */
@media (max-width: 760px) {
  body.stat-vault-page .stat-vault-head {
    gap: 10px !important;
  }

  body.stat-vault-page .stat-vault-head > p {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.stat-vault-page .legacy-gpt-card h3 {
    max-width: 100% !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    text-wrap: balance;
  }

  /* Ask AI bottom sheet: use the visible viewport so the keyboard does not
     cover the entry field on iOS/Android. JS keeps these variables current. */
  .askai-drawer {
    bottom: var(--askai-keyboard-offset, 0px) !important;
    height: min(86dvh, calc(var(--askai-visual-height, 86vh) - 8px)) !important;
    max-height: calc(var(--askai-visual-height, 86vh) - 8px) !important;
  }

  .askai-head,
  .askai-form {
    flex: 0 0 auto;
  }

  .askai-messages {
    min-height: 0;
  }

  .askai-head-text {
    min-width: 0;
  }

  .askai-head-text span {
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.askai-open {
    overscroll-behavior: contain;
    touch-action: none;
  }

  body.askai-open #askAiDrawer,
  body.askai-open #askAiDrawer * {
    touch-action: auto;
  }
}

@media (max-width: 430px) {
  body.stat-vault-page .legacy-gpt-card h3 {
    font-size: clamp(2.25rem, 11vw, 3.35rem) !important;
    line-height: .92 !important;
    letter-spacing: .032em !important;
  }
}

@media (max-width: 900px) and (max-height: 480px) {
  .askai-drawer {
    height: calc(var(--askai-visual-height, 100dvh) - 6px) !important;
    max-height: calc(var(--askai-visual-height, 100dvh) - 6px) !important;
    border-radius: 16px 16px 0 0 !important;
  }

  .askai-head {
    padding: 8px 12px !important;
  }

  .askai-grip {
    margin-top: 6px !important;
  }

  .askai-messages {
    padding: 9px 11px !important;
    gap: 9px !important;
  }

  .askai-empty > span {
    display: none;
  }

  .askai-starters {
    gap: 6px !important;
    margin-top: 6px !important;
  }

  .askai-starter {
    padding: 7px 10px !important;
  }

  .askai-form {
    padding-top: 8px !important;
  }
}

/* =========================================================
   SCSL15 menu/button cleanup
   Scope: navigation bars, drawer links, and hero buttons only.
   Leave player/team color systems, reflection animations, data,
   and card effects untouched.
   ========================================================= */

:root {
  --scsl-menu-black: #030407;
  --scsl-menu-ink: #08090e;
  --scsl-menu-glass: rgba(9, 10, 15, .86);
  --scsl-menu-line: rgba(198, 143, 49, .32);
  --scsl-menu-gold: #d7a94b;
  --scsl-menu-gold-light: #f1d384;
  --scsl-menu-gold-dark: #8f6420;
  --scsl-menu-red: #c91f2f;
  --scsl-menu-red-soft: rgba(201, 31, 47, .34);
}

.broadcast-bar {
  background:
    linear-gradient(90deg, rgba(201,31,47,.20), transparent 24%),
    linear-gradient(180deg, rgba(16,17,22,.98), rgba(3,4,7,.98)) !important;
  border-bottom-color: var(--scsl-menu-line) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.34), inset 0 -1px 0 rgba(201,31,47,.18) !important;
}

.broadcast-live {
  background:
    linear-gradient(90deg, rgba(201,31,47,.34), transparent 58%),
    linear-gradient(180deg, var(--scsl-menu-gold-light), var(--scsl-menu-gold-dark)) !important;
  color: #111 !important;
  border: 1px solid rgba(255,255,255,.20) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.32), 0 6px 18px rgba(0,0,0,.24) !important;
}

.broadcast-title {
  color: rgba(247,247,251,.90) !important;
}

.broadcast-right {
  color: rgba(215,169,75,.78) !important;
}

.site-page-tabs {
  background:
    linear-gradient(180deg, rgba(4,5,8,.98), rgba(2,3,6,.98)) !important;
  border-bottom-color: rgba(198,143,49,.24) !important;
}

.site-page-tab {
  background:
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.018)),
    rgba(3,4,8,.86) !important;
  border-color: rgba(198,143,49,.24) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 10px 28px rgba(0,0,0,.24) !important;
}

.site-page-tab::after {
  background: linear-gradient(90deg, transparent, var(--scsl-menu-red-soft), transparent) !important;
}

.site-page-tab.is-active {
  color: #111 !important;
  background:
    linear-gradient(90deg, rgba(201,31,47,.22), transparent 62%),
    linear-gradient(180deg, var(--scsl-menu-gold-light), var(--scsl-menu-gold-dark)) !important;
  border-color: rgba(241,211,132,.50) !important;
}

.hero-btn,
.legacy-intro-btn,
.formula-archive-action {
  border-radius: 999px !important;
  letter-spacing: .075em !important;
}

.hero-cta .hero-btn-primary,
.formula-archive-action {
  background:
    linear-gradient(90deg, rgba(201,31,47,.20), transparent 58%),
    linear-gradient(180deg, var(--scsl-menu-gold-light), var(--scsl-menu-gold-dark)) !important;
  border-color: rgba(241,211,132,.48) !important;
  color: #111 !important;
  box-shadow:
    0 13px 30px rgba(0,0,0,.32),
    0 0 18px rgba(215,169,75,.15),
    inset 0 1px 0 rgba(255,255,255,.34) !important;
}

.hero-cta .hero-btn-ghost,
.legacy-intro-btn {
  background:
    linear-gradient(90deg, rgba(201,31,47,.13), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.082), rgba(255,255,255,.024)),
    rgba(4,5,9,.80) !important;
  border-color: rgba(198,143,49,.38) !important;
  color: rgba(247,247,251,.92) !important;
  box-shadow:
    0 12px 28px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.13) !important;
}

.legacy-intro-duration {
  background:
    linear-gradient(180deg, var(--scsl-menu-gold-light), var(--scsl-menu-gold-dark)) !important;
  color: #111 !important;
  border-color: rgba(255,255,255,.24) !important;
}

.site-menu-toggle {
  display: none;
}

.site-drawer-backdrop,
.site-mobile-drawer {
  display: none;
}

.site-drawer-backdrop[hidden],
.site-mobile-drawer[hidden] {
  display: none !important;
  pointer-events: none !important;
}

@media (max-width: 760px) {
  .broadcast-bar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    height: 42px !important;
    padding: 0 max(12px, env(safe-area-inset-left)) 0 12px !important;
    gap: 10px !important;
  }

  .broadcast-left {
    min-width: 0;
  }

  .broadcast-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .broadcast-right {
    display: none !important;
  }

  .site-menu-toggle {
    min-width: 82px;
    height: 30px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 11px;
    border: 1px solid rgba(198,143,49,.46);
    border-radius: 999px;
    background:
      linear-gradient(90deg, rgba(201,31,47,.16), transparent 60%),
      linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.025)),
      rgba(4,5,9,.76);
    color: rgba(247,247,251,.94);
    font-family: var(--font-stat, Inter, sans-serif);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    line-height: 1;
    text-transform: uppercase;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 8px 18px rgba(0,0,0,.22);
  }

  .site-menu-toggle-icon {
    width: 15px;
    display: grid;
    gap: 4px;
  }

  .site-menu-toggle-icon span {
    display: block;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--scsl-menu-red), var(--scsl-menu-gold-light));
  }

  .site-page-tabs,
  .mobile-jump-nav {
    display: none !important;
  }

  .site-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 2147483100;
    display: block;
    background: rgba(0,0,0,.58);
    backdrop-filter: blur(4px);
  }

  .site-mobile-drawer {
    position: fixed;
    top: calc(52px + env(safe-area-inset-top));
    right: max(10px, env(safe-area-inset-right));
    bottom: max(10px, env(safe-area-inset-bottom));
    z-index: 2147483101;
    width: min(340px, calc(100vw - 24px));
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 14px;
    border: 1px solid rgba(198,143,49,.38);
    border-radius: 20px;
    background:
      radial-gradient(circle at 18% 0%, rgba(201,31,47,.20), transparent 34%),
      linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.018)),
      rgba(3,4,7,.98);
    box-shadow: 0 28px 90px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.12);
    overflow: auto;
  }

  .site-mobile-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(198,143,49,.22);
  }

  .site-mobile-drawer-head strong {
    display: block;
    color: rgba(247,247,251,.96);
    font-family: var(--font-display, Bebas Neue, Impact, sans-serif);
    font-size: 27px;
    font-weight: 900;
    letter-spacing: .055em;
    line-height: .95;
    text-transform: uppercase;
  }

  .site-mobile-drawer-kicker {
    display: block;
    color: var(--scsl-menu-gold-light);
    font-family: var(--font-stat, Inter, sans-serif);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .16em;
    text-transform: uppercase;
  }

  .site-drawer-close {
    height: 32px;
    flex: 0 0 auto;
    padding: 0 12px;
    border: 1px solid rgba(198,143,49,.34);
    border-radius: 999px;
    background: rgba(0,0,0,.24);
    color: rgba(247,247,251,.86);
    font-family: var(--font-stat, Inter, sans-serif);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .site-mobile-drawer-nav {
    display: grid;
    gap: 9px;
  }

  .site-drawer-link {
    position: relative;
    min-height: 46px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 14px;
    border: 1px solid rgba(198,143,49,.22);
    border-radius: 14px;
    background:
      linear-gradient(90deg, rgba(201,31,47,.10), transparent 64%),
      linear-gradient(180deg, rgba(255,255,255,.058), rgba(255,255,255,.015)),
      rgba(8,9,14,.82);
    color: rgba(247,247,251,.92);
    font-family: var(--font-stat, Inter, sans-serif);
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .08em;
    line-height: 1.1;
    text-align: left;
    text-decoration: none;
    text-transform: uppercase;
  }

  button.site-drawer-link {
    cursor: pointer;
  }

  .site-drawer-link::after {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(215,169,75,.42);
    box-shadow: 0 0 0 4px rgba(201,31,47,.06);
  }

  .site-drawer-link.is-active {
    color: #111;
    border-color: rgba(241,211,132,.46);
    background:
      linear-gradient(90deg, rgba(201,31,47,.20), transparent 68%),
      linear-gradient(180deg, var(--scsl-menu-gold-light), var(--scsl-menu-gold-dark));
  }

  .site-drawer-link.is-active::after {
    background: var(--scsl-menu-red);
    box-shadow: 0 0 0 4px rgba(201,31,47,.12);
  }

  body.site-menu-open {
    overflow: hidden;
  }

  body.site-menu-open .askai-bubble,
  body.site-menu-open .askai-tooltip {
    display: none !important;
  }

  .hero {
    padding-top: 22px !important;
  }

  .hero-cta,
  .hero-cta.hero-cta-vault {
    width: min(100%, 348px) !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: 18px !important;
  }

  .hero-cta .hero-btn {
    min-width: 0 !important;
    min-height: 48px !important;
    padding: 0 10px !important;
    white-space: nowrap !important;
    font-size: clamp(10px, 3vw, 12px) !important;
    line-height: 1 !important;
  }

  .hero-intro-action {
    margin-top: 10px !important;
  }

  .hero-intro-action .legacy-intro-btn {
    min-height: 40px !important;
    height: 40px !important;
    max-width: 268px !important;
    padding: 0 10px 0 14px !important;
    gap: 8px !important;
    font-size: 11px !important;
  }

  .hero-intro-action .legacy-intro-btn-main,
  .hero-intro-action .legacy-intro-duration {
    white-space: nowrap !important;
  }

  .hero-intro-action .legacy-intro-duration {
    min-width: 52px !important;
    padding: 5px 8px !important;
    font-size: 10px !important;
  }
}

@media (max-width: 370px) {
  .broadcast-live {
    padding-left: 7px !important;
    padding-right: 7px !important;
    letter-spacing: .06em !important;
  }

  .broadcast-title {
    font-size: 12px !important;
    letter-spacing: .07em !important;
  }

  .site-menu-toggle {
    min-width: 74px;
    padding: 0 9px;
  }

  .site-menu-toggle-label {
    font-size: 10px;
  }

  .hero-cta .hero-btn {
    font-size: 10px !important;
    letter-spacing: .052em !important;
  }
}

/* =========================================================
   SCSL15 mobile Top 15 cleanup
   Mobile-only section framing and carousel alignment. Team color
   variables, card effects, rankings, data, and tap expansion stay intact.
   ========================================================= */

@media (max-width: 760px) {
  main {
    padding-top: 8px !important;
  }

  #top15 {
    width: 100vw !important;
    max-width: 100vw !important;
    margin: 6px 0 18px calc(50% - 50vw) !important;
    padding: 14px 0 18px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  #top15::before,
  #top15::after {
    display: none !important;
    content: none !important;
  }

  #legacySpotlight {
    display: none !important;
  }

  #top15 .section-head {
    display: block !important;
    margin: 0 16px 12px !important;
    padding: 0 !important;
    text-align: left !important;
  }

  #top15 .section-head h2 {
    margin: 0 !important;
    color: rgba(255,255,255,.98) !important;
    font-family: var(--font-display, "Bebas Neue", Impact, sans-serif) !important;
    font-size: 38px !important;
    font-weight: 400 !important;
    letter-spacing: .045em !important;
    line-height: .92 !important;
    text-transform: uppercase !important;
    text-wrap: balance;
  }

  #top15 .section-head p {
    max-width: 330px !important;
    margin: 8px 0 0 !important;
    color: rgba(220,224,238,.78) !important;
    font-family: var(--font-body, Inter, sans-serif) !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    line-height: 1.45 !important;
    text-align: left !important;
  }

  #top15 .section-head::after {
    content: "Swipe cards | tap for the legacy report" !important;
    width: fit-content !important;
    max-width: 100% !important;
    display: inline-flex !important;
    align-items: center !important;
    min-height: 28px !important;
    margin-top: 11px !important;
    padding: 0 11px !important;
    border: 1px solid rgba(245,199,107,.25) !important;
    border-radius: 999px !important;
    background:
      linear-gradient(90deg, rgba(201,31,47,.14), transparent 58%),
      linear-gradient(180deg, rgba(255,255,255,.060), rgba(255,255,255,.018)),
      rgba(3,4,8,.76) !important;
    color: rgba(245,199,107,.92) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 8px 18px rgba(0,0,0,.18) !important;
    font-family: var(--font-stat, Rajdhani, sans-serif) !important;
    font-size: 10.5px !important;
    font-weight: 950 !important;
    letter-spacing: .07em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
  }

  #top15Grid,
  #top15 .top15-grid {
    position: relative !important;
    z-index: 2 !important;
    width: 100vw !important;
    max-width: none !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    grid-template-columns: none !important;
    gap: 12px !important;
    margin: 0 0 0 calc(50% - 50vw) !important;
    padding: 4px 16px 18px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    scroll-padding-left: 16px !important;
    scroll-snap-type: x mandatory !important;
    scrollbar-width: none !important;
    overscroll-behavior-x: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  #top15Grid::-webkit-scrollbar,
  #top15 .top15-grid::-webkit-scrollbar {
    display: none !important;
  }

  #top15Grid::before,
  #top15Grid::after {
    display: none !important;
    content: none !important;
  }

  #top15Grid .card,
  #top15Grid .card:nth-child(1),
  #top15Grid .card:nth-child(2),
  #top15Grid .card:nth-child(3),
  #top15Grid .card:nth-child(n+4) {
    flex: 0 0 calc(100vw - 36px) !important;
    width: calc(100vw - 36px) !important;
    max-width: 408px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    scroll-snap-align: start !important;
    scroll-snap-stop: always !important;
    border-radius: 20px !important;
  }

  #top15Grid .card {
    display: grid !important;
    grid-template-columns: 48px 50px minmax(0, 1fr) 68px !important;
    grid-template-areas:
      "rank photo player score"
      "rank photo stats stats"
      "rank photo team team"
      "hint hint hint hint"
      "meta meta meta meta" !important;
    column-gap: 8px !important;
    row-gap: 8px !important;
    align-items: center !important;
    padding: 14px 12px 13px !important;
  }

  #top15Grid .card .rank {
    grid-area: rank !important;
    align-self: start !important;
    justify-self: start !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    font-size: 13px !important;
  }

  #top15Grid .card:nth-child(1) .rank {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    font-size: 13px !important;
  }

  #top15Grid .card .top15-player-photo-frame {
    grid-area: photo !important;
    width: 50px !important;
    height: 50px !important;
    align-self: start !important;
    justify-self: start !important;
    border-radius: 15px !important;
  }

  #top15Grid .card .player {
    grid-area: player !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    align-self: end !important;
    justify-self: stretch !important;
    overflow: hidden !important;
    text-align: left !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    font-size: 21px !important;
    letter-spacing: .02em !important;
    line-height: .96 !important;
  }

  #top15Grid .card.name-lg .player {
    font-size: 19px !important;
    letter-spacing: .01em !important;
  }

  #top15Grid .card.name-xl .player {
    font-size: 17px !important;
    letter-spacing: 0 !important;
  }

  #top15Grid .card .mobile-card-score {
    grid-area: score !important;
    min-width: 0 !important;
    align-self: start !important;
    justify-self: end !important;
    margin: 0 !important;
    text-align: right !important;
  }

  #top15Grid .card .mobile-card-score strong {
    font-size: 21px !important;
    line-height: .92 !important;
  }

  #top15Grid .card .mobile-card-score span {
    font-size: 7.5px !important;
    letter-spacing: .055em !important;
  }

  #top15Grid .card .stats,
  #top15Grid .card .quick-stats,
  #top15Grid .card .pills,
  #top15Grid .card .mobile-stats {
    grid-area: stats !important;
    min-width: 0 !important;
    margin: 0 !important;
    gap: 5px !important;
    overflow: hidden !important;
  }

  #top15Grid .card .pill {
    padding: 5px 7px !important;
    font-size: 10.5px !important;
    line-height: 1 !important;
  }

  #top15Grid .card .top15-team-line {
    grid-area: team !important;
    max-width: 100% !important;
    margin: -1px 0 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }

  #top15Grid .card .mobile-expand-hint {
    grid-area: hint !important;
    min-height: 34px !important;
    margin: 2px 0 0 !important;
    padding: 0 44px 0 10px !important;
    border-radius: 12px !important;
    font-size: 10px !important;
    letter-spacing: .055em !important;
  }

  #top15Grid .card .legacy-details {
    grid-area: meta !important;
    width: 100% !important;
    min-width: 0 !important;
    margin-top: 2px !important;
  }

  body.top15-in-view:not(.askai-open):not(.site-menu-open) .askai-bubble {
    right: auto !important;
    left: max(12px, env(safe-area-inset-left)) !important;
    top: calc(var(--scsl-fixed-header-h, 42px) + 14px + env(safe-area-inset-top)) !important;
    bottom: auto !important;
    width: 52px !important;
    height: 52px !important;
  }

  body.top15-in-view:not(.askai-open):not(.site-menu-open) .askai-tooltip {
    display: none !important;
  }

  body.top15-in-view:not(.askai-open):not(.site-menu-open) .askai-tooltip::after {
    right: auto !important;
    left: 22px !important;
  }
}

@media (max-width: 390px) {
  #top15 .section-head h2 {
    font-size: 34px !important;
  }

  #top15Grid .card .player {
    font-size: 19px !important;
  }

  #top15Grid .card.name-lg .player {
    font-size: 17px !important;
  }

  #top15Grid .card.name-xl .player {
    font-size: 16px !important;
  }

  #top15Grid .card .mobile-card-score strong {
    font-size: 19px !important;
  }
}

/* Accessible focus polish for the floating Gemini controls. */
.legacy-intro-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

#askAiBubble:focus-visible,
#askAiInput:focus-visible,
#askAiDrawer .askai-send:focus-visible,
#askAiDrawer .askai-close:focus-visible,
.askai-starter:focus-visible,
.askai-tooltip-x:focus-visible {
  outline: 3px solid rgba(245, 199, 107, .88) !important;
  outline-offset: 4px !important;
  box-shadow: 0 0 0 5px rgba(245, 199, 107, .18) !important;
}

#askAiInput:focus-visible {
  border-color: rgba(245, 199, 107, .95) !important;
}

/* Final menu/chevron parity guard.
   Keep the live palette, but make drawer close controls consistent and stop
   the open-state chevron from rotating the whole circular target. */
@media (max-width: 760px) {
  html body button.site-drawer-close[data-site-menu-close] {
    border-color: rgba(216,224,234,.16) !important;
    color: rgba(247,249,255,.94) !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.024)),
      linear-gradient(rgba(5, 9, 20, .68), rgba(5, 9, 20, .68)) !important;
    background-color: rgba(5, 9, 20, .68) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.14),
      0 10px 26px rgba(0,0,0,.22) !important;
  }

  html body button.site-drawer-close[data-site-menu-close]:hover,
  html body button.site-drawer-close[data-site-menu-close]:focus-visible {
    border-color: rgba(255,255,255,.28) !important;
  }

  html body #top15Grid .card .mobile-expand-hint .hint-arrow,
  html body #top15Grid .card .hint-arrow {
    position: absolute !important;
    top: 50% !important;
    right: 13px !important;
    transform: translateY(-50%) !important;
    transform-origin: 50% 50% !important;
    background:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M9 12.5 15 17.5 21 12.5' fill='none' stroke='%23f8fbff' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") 50% 50% / 16px 16px no-repeat,
      radial-gradient(circle at 34% 24%, rgba(255,255,255,.20), transparent 36%),
      linear-gradient(135deg, rgba(229,27,53,.30), rgba(15,93,255,.34)),
      rgba(5, 8, 16, .62) !important;
  }

  html body #top15Grid .card.expanded .mobile-expand-hint .hint-arrow,
  html body #top15Grid .card[aria-expanded="true"] .mobile-expand-hint .hint-arrow,
  html body #top15Grid .card.expanded .hint-arrow,
  html body #top15Grid .card[aria-expanded="true"] .hint-arrow {
    transform: translateY(-50%) !important;
    background:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M9 17.5 15 12.5 21 17.5' fill='none' stroke='%23f8fbff' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") 50% 50% / 16px 16px no-repeat,
      radial-gradient(circle at 34% 24%, rgba(255,255,255,.22), transparent 36%),
      linear-gradient(135deg, rgba(15,93,255,.34), rgba(229,27,53,.28)),
      rgba(5, 8, 16, .66) !important;
  }
}

/* Gemini prompt generation polish.
   Client-side curated prompts only; responses still come from the Netlify
   Gemini function when a prompt is submitted. */
.askai-generator-state,
.legacy-gpt-prompt-status {
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  min-height: 38px !important;
  padding: 9px 13px !important;
  border: 1px solid rgba(216,224,234,.14) !important;
  border-radius: 999px !important;
  color: rgba(235,242,255,.78) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.020)),
    rgba(5, 8, 18, .58) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 10px 24px rgba(0,0,0,.18) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
}

.legacy-gpt-prompt-status {
  width: fit-content !important;
}

.askai-generator-state i,
.legacy-gpt-prompt-status i {
  width: 8px !important;
  height: 8px !important;
  flex: 0 0 8px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #ff4059, #65b8ff) !important;
  box-shadow: 0 0 16px rgba(101,184,255,.42) !important;
  animation: scslPromptPulse 820ms ease-in-out infinite alternate;
}

.askai-starters[aria-busy="true"],
.legacy-gpt-prompts[aria-busy="true"] {
  min-height: 42px !important;
}

.askai-starter.is-generating,
.legacy-gpt-prompt.is-generating {
  opacity: 0 !important;
  transform: translateY(7px) scale(.985) !important;
}

.askai-starter.is-ready,
.legacy-gpt-prompt.is-ready {
  opacity: 1 !important;
  transform: translateY(0) scale(1) !important;
  transition:
    opacity 220ms ease var(--askai-starter-delay, var(--legacy-prompt-delay, 0ms)),
    transform 220ms ease var(--askai-starter-delay, var(--legacy-prompt-delay, 0ms)) !important;
}

@keyframes scslPromptPulse {
  from {
    opacity: .48;
    transform: scale(.78);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .askai-generator-state i,
  .legacy-gpt-prompt-status i {
    animation: none !important;
  }

  .askai-starter.is-generating,
  .legacy-gpt-prompt.is-generating,
  .askai-starter.is-ready,
  .legacy-gpt-prompt.is-ready {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Short mobile landscape menu safety.
   Some phone landscape widths show the compact menu button outside the
   <=760px drawer breakpoint. When JS opens the drawer, keep the panel and
   close control visible instead of leaving only the page behind the button. */
@media (max-width: 900px) and (max-height: 480px) {
  body.site-menu-open .site-drawer-backdrop:not([hidden]) {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483100 !important;
    background: rgba(0,0,0,.58) !important;
    backdrop-filter: blur(4px) !important;
  }

  body.site-menu-open .site-mobile-drawer:not([hidden]) {
    display: flex !important;
    position: fixed !important;
    top: calc(52px + env(safe-area-inset-top)) !important;
    right: max(10px, env(safe-area-inset-right)) !important;
    bottom: max(10px, env(safe-area-inset-bottom)) !important;
    z-index: 2147483101 !important;
    width: min(340px, calc(100vw - 24px)) !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding: 12px !important;
    border: 1px solid rgba(216,224,234,.16) !important;
    border-radius: 18px !important;
    background:
      radial-gradient(circle at 18% 0%, rgba(201,31,47,.18), transparent 34%),
      linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.018)),
      rgba(3,4,7,.98) !important;
    box-shadow: 0 28px 90px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.12) !important;
    overflow-y: auto !important;
  }

  body.site-menu-open .site-mobile-drawer:not([hidden]) .site-mobile-drawer-head,
  body.site-menu-open .site-mobile-drawer:not([hidden]) .site-mobile-drawer-nav {
    display: flex !important;
  }

  body.site-menu-open .site-mobile-drawer:not([hidden]) .site-mobile-drawer-head {
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
  }

  body.site-menu-open .site-mobile-drawer:not([hidden]) .site-mobile-drawer-nav {
    flex-direction: column !important;
    gap: 8px !important;
  }

  body.site-menu-open .site-mobile-drawer:not([hidden]) .site-drawer-close {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 68px !important;
    min-height: 34px !important;
    pointer-events: auto !important;
  }
}

/* Version 4.0 navigation cohesion.
   Keep Stat Vault page identity in the text, but match Home's top-bar chrome,
   SCSL pill, hamburger/menu button, and tab-strip color system. */
html body.stat-vault-page .broadcast-bar {
  background:
    linear-gradient(90deg, rgba(229, 27, 53, .12), transparent 24%, rgba(15, 93, 255, .12)),
    rgba(4, 7, 14, .94) !important;
  border-bottom-color: rgba(229, 27, 53, .46) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.34) !important;
}

html body.stat-vault-page .broadcast-left {
  gap: clamp(9px, 2vw, 17px) !important;
}

html body.stat-vault-page .broadcast-live {
  min-height: 24px !important;
  height: 24px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(216,224,234,.26) !important;
  border-radius: 999px !important;
  color: rgb(246, 248, 255) !important;
  background:
    linear-gradient(135deg, rgba(229, 27, 53, .80), rgba(15, 93, 255, .72)),
    rgba(7, 10, 18, .78) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 0 18px rgba(15, 93, 255, .18),
    0 0 14px rgba(229, 27, 53, .14) !important;
  font-family: Rajdhani, Inter, sans-serif !important;
  font-weight: 900 !important;
}

html body.stat-vault-page .broadcast-title {
  color: rgba(246, 248, 255, .90) !important;
  font-family: Rajdhani, Inter, sans-serif !important;
  font-weight: 700 !important;
}

html body.stat-vault-page .broadcast-right {
  color: rgba(216, 224, 234, .68) !important;
}

html body.stat-vault-page .site-menu-toggle {
  min-height: 38px !important;
  border-color: rgba(216, 224, 234, .34) !important;
  border-radius: 11px !important;
  color: rgba(246, 248, 255, .94) !important;
  background:
    linear-gradient(135deg, rgba(229, 27, 53, .14), rgba(15, 93, 255, .15)),
    linear-gradient(rgba(255, 255, 255, .075), rgba(255, 255, 255, .020)),
    rgba(3, 7, 16, .92) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(53,167,255,.16),
    0 10px 24px rgba(0,0,0,.34),
    0 0 18px rgba(53,167,255,.16) !important;
  font-family: Rajdhani, Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-weight: 950 !important;
}

html body.stat-vault-page .site-page-tabs {
  background:
    linear-gradient(90deg, rgba(229, 27, 53, .08), rgba(15, 93, 255, .08)),
    rgba(2, 5, 12, .86) !important;
  border-bottom-color: rgba(53, 167, 255, .14) !important;
}

html body.stat-vault-page .site-page-tab {
  border-color: rgba(216, 224, 234, .16) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.018)),
    rgba(3, 7, 16, .78) !important;
}

html body.stat-vault-page .site-page-tab.is-active {
  color: rgb(246, 248, 255) !important;
  border-color: rgba(216, 224, 234, .30) !important;
  background:
    linear-gradient(135deg, rgba(229, 27, 53, .70), rgba(15, 93, 255, .66)),
    rgba(7, 10, 18, .86) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 12px 28px rgba(0,0,0,.28),
    0 0 18px rgba(15,93,255,.14) !important;
}

@media (max-width: 760px) {
  html body.stat-vault-page .broadcast-live {
    padding: 0 10px !important;
  }

  html body.stat-vault-page .site-menu-toggle {
    min-height: 38px !important;
  }
}

html body.stat-vault-page button.site-menu-toggle.site-menu-toggle {
  min-height: 38px !important;
  border-color: rgba(216, 224, 234, .34) !important;
  border-radius: 11px !important;
  color: rgba(246, 248, 255, .94) !important;
  background:
    linear-gradient(135deg, rgba(229, 27, 53, .14), rgba(15, 93, 255, .15)),
    linear-gradient(rgba(255, 255, 255, .075), rgba(255, 255, 255, .020)),
    rgba(3, 7, 16, .92) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(53,167,255,.16),
    0 10px 24px rgba(0,0,0,.34),
    0 0 18px rgba(53,167,255,.16) !important;
}

html body.stat-vault-page .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] {
  border-top-color: rgba(216, 224, 234, .34) !important;
  border-right-color: rgba(216, 224, 234, .34) !important;
  border-bottom-color: rgba(216, 224, 234, .34) !important;
  border-left-color: rgba(216, 224, 234, .34) !important;
  background:
    linear-gradient(135deg, rgba(229, 27, 53, .14), rgba(15, 93, 255, .15)),
    linear-gradient(rgba(255, 255, 255, .075), rgba(255, 255, 255, .020)),
    rgba(3, 7, 16, .92) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(53,167,255,.16),
    0 10px 24px rgba(0,0,0,.34),
    0 0 18px rgba(53,167,255,.16) !important;
}

html body.stat-vault-page .site-page-tab.is-active {
  color: rgb(255, 255, 255) !important;
  border-color: rgba(216, 224, 234, .30) !important;
  background:
    linear-gradient(135deg, rgba(229, 27, 53, .94), rgba(15, 93, 255, .88)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    0 12px 28px rgba(0,0,0,.26),
    0 0 18px rgba(15,93,255,.12) !important;
}

@media (min-width: 761px) {
  html body.stat-vault-page .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] {
    height: 42px !important;
    min-height: 42px !important;
    border-radius: 12px !important;
  }
}

@media (max-width: 760px) {
  html body.stat-vault-page .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] {
    height: 38px !important;
    min-height: 38px !important;
    border-radius: 11px !important;
  }
}

/* Final v4.0 navigation parity lock. Must remain after all Stat Vault chrome rules. */
html body.stat-vault-page .site-page-tab.site-page-tab.is-active {
  color: rgb(255, 255, 255) !important;
  border-color: rgba(216, 224, 234, .30) !important;
  background:
    linear-gradient(135deg, rgba(229, 27, 53, .94), rgba(15, 93, 255, .88)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    0 12px 28px rgba(0,0,0,.26),
    0 0 18px rgba(15,93,255,.12) !important;
}

@media (min-width: 761px) {
  html body #top15Grid .card .mobile-expand-hint {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

/* Final v4.0 Gemini response motion polish. */
@keyframes scslGeminiMessageIn {
  0% {
    opacity: 0;
    filter: blur(4px);
    transform: translateY(9px) scale(.985);
  }
  100% {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0) scale(1);
  }
}

@keyframes scslGeminiAnswerReveal {
  0% {
    opacity: .18;
    filter: blur(5px);
    transform: translateY(7px) scale(.99);
  }
  46% {
    opacity: .86;
    filter: blur(1px);
  }
  100% {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0) scale(1);
  }
}

@keyframes scslGeminiThinking {
  0%, 100% {
    opacity: .70;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.12),
      0 0 0 rgba(15,93,255,0);
  }
  50% {
    opacity: 1;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.18),
      0 0 24px rgba(15,93,255,.16);
  }
}

@keyframes scslGeminiSheen {
  0% {
    opacity: 0;
    transform: translateX(-130%);
  }
  20% {
    opacity: .75;
  }
  100% {
    opacity: 0;
    transform: translateX(130%);
  }
}

html body #askAiDrawer .askai-msg,
html body .legacy-gpt-message {
  animation: scslGeminiMessageIn .30s cubic-bezier(.2,.82,.2,1) both;
}

html body #askAiDrawer .askai-msg-body,
html body .legacy-gpt-message {
  transition:
    opacity .18s ease,
    filter .18s ease,
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease !important;
}

html body #askAiDrawer .askai-msg-assistant .askai-msg-body {
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(53,167,255,.13), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.072), rgba(255,255,255,.028)),
    rgba(5, 8, 18, .72) !important;
  border-color: rgba(216,224,234,.14) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.13),
    0 12px 30px rgba(0,0,0,.22) !important;
}

html body .legacy-gpt-message-assistant {
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(53,167,255,.13), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.026)),
    rgba(5, 8, 18, .60) !important;
  border-color: rgba(216,224,234,.14) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 12px 30px rgba(0,0,0,.20) !important;
}

html body #askAiDrawer .askai-msg-assistant.loading .askai-msg-body,
html body .legacy-gpt-message.loading {
  animation: scslGeminiThinking 1.25s ease-in-out infinite !important;
}

html body #askAiDrawer .askai-msg.is-swapping .askai-msg-body,
html body .legacy-gpt-message.is-swapping .legacy-gpt-message-body {
  opacity: .24 !important;
  filter: blur(3px) !important;
  transform: translateY(-2px) scale(.992) !important;
}

html body #askAiDrawer .askai-msg.is-revealing .askai-msg-body,
html body .legacy-gpt-message.is-revealing .legacy-gpt-message-body {
  animation: scslGeminiAnswerReveal .48s cubic-bezier(.2,.82,.2,1) both !important;
}

html body #askAiDrawer .askai-msg-assistant.is-revealing .askai-msg-body::before,
html body .legacy-gpt-message-assistant.is-revealing::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(100deg, transparent 0%, rgba(255,255,255,.16) 46%, transparent 72%) !important;
  transform: translateX(-130%);
  animation: scslGeminiSheen .56s ease-out both !important;
}

html body .legacy-gpt-message-assistant.is-revealing::before {
  border-radius: inherit !important;
}

/* Final v4.0 hero metadata cleanup: remove clunky text bubbles. */
html body .hero .hero-chips {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 8px 12px !important;
  margin: 14px auto 20px !important;
  max-width: min(620px, calc(100vw - 42px)) !important;
}

html body .hero .hero-chips span {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(224, 229, 239, .78) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

html body .hero .hero-chips span::before,
html body .hero .hero-chips span::after {
  display: none !important;
  content: none !important;
}

html body .hero .hero-chips span + span {
  padding-left: 12px !important;
}

html body .hero .hero-chips span + span::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  width: 3px !important;
  height: 3px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, rgba(229, 27, 53, .90), rgba(15, 93, 255, .90)) !important;
  transform: translateY(-50%) !important;
}

@media (max-width: 760px) {
  html body .hero .hero-chips {
    gap: 7px 10px !important;
    margin: 14px auto 22px !important;
  }

  html body .hero .hero-chips span {
    font-size: 10.5px !important;
    letter-spacing: .075em !important;
  }
}

/* Final v4.0 menu chrome cleanup: keep the drawer shape, remove stray gold. */
@media (max-width: 760px) {
  html body .site-mobile-drawer {
    border-color: rgba(216, 224, 234, .18) !important;
    background:
      radial-gradient(circle at 16% 0%, rgba(229, 27, 53, .18), transparent 35%),
      radial-gradient(circle at 96% 8%, rgba(15, 93, 255, .16), transparent 38%),
      linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.018)),
      rgba(3, 4, 7, .98) !important;
    box-shadow:
      0 28px 90px rgba(0,0,0,.62),
      0 0 0 1px rgba(53, 167, 255, .06),
      inset 0 1px 0 rgba(255,255,255,.12) !important;
  }

  html body .site-mobile-drawer-head {
    border-bottom-color: rgba(216, 224, 234, .14) !important;
  }

  html body .site-mobile-drawer-kicker {
    color: rgba(95, 183, 255, .88) !important;
  }

  html body .site-menu-toggle-icon span {
    background: linear-gradient(90deg, rgba(255, 45, 79, .98), rgba(29, 125, 255, .98)) !important;
  }

  html body .site-drawer-link {
    border-color: rgba(216, 224, 234, .16) !important;
    color: rgba(247,249,255,.94) !important;
  }

  html body .site-drawer-link::after {
    background: linear-gradient(135deg, rgba(229, 27, 53, .96), rgba(29, 125, 255, .96)) !important;
    box-shadow: 0 0 0 4px rgba(53, 167, 255, .08) !important;
  }

  html body .site-drawer-link.is-active {
    color: #fff !important;
    border-color: rgba(255,255,255,.22) !important;
    background:
      radial-gradient(circle at 18% 16%, rgba(255,255,255,.16), transparent 28%),
      linear-gradient(135deg, rgba(255, 35, 69, .92), rgba(29, 125, 255, .88)) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.18),
      0 12px 32px rgba(0,0,0,.26),
      0 0 24px rgba(29,125,255,.13) !important;
  }

  html body .site-drawer-link.is-active::after {
    background: rgba(255,255,255,.92) !important;
    box-shadow: 0 0 0 4px rgba(255,255,255,.08) !important;
  }
}

/* Final v4.0 Stat Vault console polish: Apple glass x ESPN precision. */
@keyframes scslGeminiAnswerReveal {
  0% {
    opacity: 0;
    filter: blur(1.2px);
    transform: translateY(5px) scale(.996);
  }
  100% {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0) scale(1);
  }
}

html body #askAiDrawer .askai-msg.is-swapping .askai-msg-body,
html body .legacy-gpt-message.is-swapping .legacy-gpt-message-body {
  opacity: .54 !important;
  filter: blur(1px) !important;
  transform: translateY(-1px) scale(.998) !important;
}

html body #askAiDrawer .askai-msg.is-revealing .askai-msg-body,
html body .legacy-gpt-message.is-revealing .legacy-gpt-message-body {
  animation: scslGeminiAnswerReveal .34s cubic-bezier(.2,.82,.2,1) both !important;
}

html body.stat-vault-page .stat-vault-screen {
  display: grid !important;
  gap: clamp(16px, 2vw, 24px) !important;
  padding: clamp(18px, 2.4vw, 30px) !important;
  border-radius: 24px !important;
  border-color: rgba(216,224,234,.14) !important;
  background:
    radial-gradient(ellipse at 10% 0%, rgba(255,45,73,.10), transparent 34%),
    radial-gradient(ellipse at 92% 10%, rgba(29,125,255,.12), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.014)),
    rgba(3, 6, 14, .78) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.18) !important;
  backdrop-filter: blur(22px) saturate(1.18) !important;
}

html body.stat-vault-page .stat-vault-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 520px) !important;
  align-items: end !important;
  gap: 18px !important;
  padding-bottom: 16px !important;
  border-bottom: 1px solid rgba(216,224,234,.12) !important;
}

html body.stat-vault-page .stat-vault-head h2 {
  font-size: clamp(42px, 6vw, 76px) !important;
  line-height: .86 !important;
}

html body.stat-vault-page .stat-vault-head > p {
  max-width: 520px !important;
  margin: 0 !important;
  color: rgba(232,238,248,.76) !important;
  font-size: clamp(14px, 1.35vw, 16px) !important;
  line-height: 1.45 !important;
}

html body.stat-vault-page .hero-cta-vault {
  margin: -2px 0 2px !important;
}

html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full {
  position: relative !important;
  isolation: isolate !important;
  display: grid !important;
  grid-template-columns: minmax(0, .86fr) minmax(330px, 1.14fr) !important;
  grid-template-areas:
    "head messages"
    "lede messages"
    "form form"
    "prompts prompts" !important;
  gap: 14px 18px !important;
  width: 100% !important;
  margin: 0 0 20px !important;
  padding: clamp(16px, 2.1vw, 24px) !important;
  border: 1px solid rgba(216,224,234,.16) !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(255,45,73,.16), transparent 34%),
    radial-gradient(circle at 96% 4%, rgba(29,125,255,.18), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.084), rgba(255,255,255,.024)),
    rgba(4, 7, 16, .82) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.22) !important;
  backdrop-filter: blur(24px) saturate(1.22) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 20px 52px rgba(0,0,0,.30),
    0 0 38px rgba(15,93,255,.09) !important;
}

html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full::before {
  content: "" !important;
  position: absolute !important;
  inset: 1px !important;
  z-index: 0 !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  background:
    linear-gradient(100deg, transparent 0 36%, rgba(255,255,255,.12) 48%, transparent 61%) !important;
  opacity: .38 !important;
  transform: translateX(-34%) skewX(-16deg) !important;
}

html body.stat-vault-page .legacy-gpt-head {
  grid-area: head !important;
  align-items: flex-start !important;
  gap: 12px !important;
  min-width: 0 !important;
}

html body.stat-vault-page .legacy-gpt-brand {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 12px !important;
  min-width: 0 !important;
}

html body.stat-vault-page .legacy-gpt-mark {
  width: 42px !important;
  height: 42px !important;
  flex: 0 0 42px !important;
  border-radius: 14px !important;
  border-color: rgba(216,224,234,.14) !important;
  background:
    radial-gradient(circle at 32% 26%, rgba(53,167,255,.22), transparent 42%),
    rgba(5, 8, 18, .72) !important;
}

html body.stat-vault-page .legacy-gpt-card h3 {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0 .18em !important;
  margin: 2px 0 0 !important;
  max-width: 520px !important;
  font-size: clamp(36px, 4.7vw, 58px) !important;
  line-height: .88 !important;
  letter-spacing: .018em !important;
  text-wrap: balance !important;
}

html body.stat-vault-page .legacy-gpt-card h3 > span {
  display: inline !important;
}

html body.stat-vault-page .legacy-gpt-kicker {
  color: rgba(171,207,255,.76) !important;
  font-size: 11px !important;
  letter-spacing: .14em !important;
}

html body.stat-vault-page .legacy-gpt-badge {
  align-self: start !important;
  min-height: 30px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  color: rgba(247,249,255,.88) !important;
  border-color: rgba(216,224,234,.14) !important;
  background: rgba(255,255,255,.055) !important;
}

html body.stat-vault-page .legacy-gpt-lede {
  grid-area: lede !important;
  max-width: 46ch !important;
  margin: 0 !important;
  color: rgba(232,238,248,.74) !important;
  font-size: 14.5px !important;
  line-height: 1.45 !important;
}

html body.stat-vault-page #legacyGptMessages.legacy-gpt-messages {
  grid-area: messages !important;
  align-content: start !important;
  min-height: clamp(228px, 26vw, 334px) !important;
  max-height: min(46vh, 420px) !important;
  margin: 0 !important;
  padding: 12px !important;
  border-radius: 18px !important;
  border-color: rgba(216,224,234,.13) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    rgba(2, 5, 12, .62) !important;
  overflow: auto !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 0 0 1px rgba(255,255,255,.025) !important;
}

html body.stat-vault-page .legacy-gpt-empty {
  min-height: 0 !important;
  padding: 16px !important;
  border: 1px solid rgba(216,224,234,.10) !important;
  border-radius: 15px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(255,45,73,.10), transparent 34%),
    rgba(7, 11, 22, .56) !important;
}

html body.stat-vault-page .legacy-gpt-empty strong {
  color: rgba(247,249,255,.94) !important;
  font-size: 12.5px !important;
  letter-spacing: .07em !important;
}

html body.stat-vault-page .legacy-gpt-empty span {
  color: rgba(232,238,248,.68) !important;
  font-size: 13px !important;
  line-height: 1.42 !important;
}

html body.stat-vault-page .legacy-gpt-message {
  padding: 12px 13px !important;
  border-radius: 15px !important;
}

html body.stat-vault-page .legacy-gpt-message-body {
  font-size: 14.5px !important;
  line-height: 1.48 !important;
}

html body.stat-vault-page .legacy-gpt-form {
  grid-area: form !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 92px !important;
  gap: 10px !important;
  margin: 0 !important;
}

html body.stat-vault-page .legacy-gpt-input-shell {
  min-height: 48px !important;
  border-radius: 16px !important;
  border-color: rgba(216,224,234,.15) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.058), rgba(255,255,255,.018)),
    rgba(3, 6, 14, .68) !important;
}

html body.stat-vault-page .legacy-gpt-input {
  font-size: 15.5px !important;
  letter-spacing: 0 !important;
}

html body.stat-vault-page .legacy-gpt-submit {
  min-height: 48px !important;
  border-radius: 16px !important;
}

html body.stat-vault-page .legacy-gpt-prompts {
  grid-area: prompts !important;
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 0 !important;
  overflow: visible !important;
}

html body.stat-vault-page .legacy-gpt-prompt {
  min-width: 0 !important;
  min-height: 38px !important;
  width: 100% !important;
  padding: 0 10px !important;
  border-radius: 14px !important;
  white-space: normal !important;
  font-size: 10.5px !important;
  line-height: 1.08 !important;
  letter-spacing: .04em !important;
}

html body.stat-vault-page .database-hero.database-hero-bottom,
html body.stat-vault-page .table-wrap {
  border-color: rgba(216,224,234,.14) !important;
  background:
    radial-gradient(circle at 6% 0%, rgba(255,45,73,.08), transparent 34%),
    radial-gradient(circle at 100% 0%, rgba(29,125,255,.10), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.012)),
    rgba(3, 6, 14, .74) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.16) !important;
  backdrop-filter: blur(18px) saturate(1.16) !important;
}

html body.stat-vault-page .database-scroll-hint {
  display: block !important;
  margin: -4px 2px 0 !important;
  color: rgba(171,207,255,.72) !important;
  font-size: 11.5px !important;
}

html body.stat-vault-page .dt-search input,
html body.stat-vault-page .dt-length select,
html body.stat-vault-page input[type="search"] {
  min-height: 38px !important;
  border-radius: 12px !important;
  border-color: rgba(216,224,234,.16) !important;
  background: rgba(3, 6, 14, .74) !important;
  color: rgba(247,249,255,.92) !important;
}

@media (max-width: 980px) {
  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "head"
      "lede"
      "messages"
      "form"
      "prompts" !important;
  }

  html body.stat-vault-page .legacy-gpt-prompts {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  html body.stat-vault-page .stat-vault-screen {
    gap: 14px !important;
    max-width: calc(100vw - 22px) !important;
    padding: 14px 12px 18px !important;
    border-radius: 20px !important;
  }

  html body.stat-vault-page .stat-vault-head {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding-bottom: 12px !important;
  }

  html body.stat-vault-page .stat-vault-head h2 {
    font-size: clamp(37px, 11.4vw, 52px) !important;
  }

  html body.stat-vault-page .stat-vault-head > p {
    font-size: 13.5px !important;
    line-height: 1.42 !important;
  }

  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full {
    gap: 11px !important;
    padding: 14px !important;
    border-radius: 18px !important;
  }

  html body.stat-vault-page .legacy-gpt-head {
    display: block !important;
  }

  html body.stat-vault-page .legacy-gpt-brand {
    grid-template-columns: 36px minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  html body.stat-vault-page .legacy-gpt-mark {
    width: 36px !important;
    height: 36px !important;
    border-radius: 12px !important;
  }

  html body.stat-vault-page .legacy-gpt-badge {
    display: none !important;
  }

  html body.stat-vault-page .legacy-gpt-card h3 {
    font-size: clamp(28px, 8.5vw, 37px) !important;
    line-height: .91 !important;
    gap: 0 .16em !important;
  }

  html body.stat-vault-page .legacy-gpt-kicker {
    font-size: 10px !important;
    letter-spacing: .12em !important;
  }

  html body.stat-vault-page .legacy-gpt-lede {
    max-width: none !important;
    font-size: 13.25px !important;
    line-height: 1.40 !important;
  }

  html body.stat-vault-page #legacyGptMessages.legacy-gpt-messages {
    min-height: 126px !important;
    max-height: 36vh !important;
    padding: 9px !important;
    border-radius: 15px !important;
  }

  html body.stat-vault-page .legacy-gpt-empty {
    padding: 13px !important;
  }

  html body.stat-vault-page .legacy-gpt-empty strong {
    font-size: 11.5px !important;
  }

  html body.stat-vault-page .legacy-gpt-empty span {
    font-size: 12.5px !important;
  }

  html body.stat-vault-page .legacy-gpt-form {
    grid-template-columns: minmax(0, 1fr) 62px !important;
    gap: 8px !important;
  }

  html body.stat-vault-page .legacy-gpt-input-shell,
  html body.stat-vault-page .legacy-gpt-submit {
    min-height: 45px !important;
    border-radius: 14px !important;
  }

  html body.stat-vault-page .legacy-gpt-input {
    font-size: 14px !important;
  }

  html body.stat-vault-page .legacy-gpt-submit {
    min-width: 62px !important;
    padding: 0 8px !important;
    font-size: 11px !important;
  }

  html body.stat-vault-page .legacy-gpt-prompts {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }

  html body.stat-vault-page .legacy-gpt-prompt {
    min-height: 34px !important;
    padding: 0 8px !important;
    font-size: 9.8px !important;
  }
}

/* Final v4.0 Stat Vault engagement pass: liquid data surface, no cheap gold. */
html body.stat-vault-page {
  --scsl-vault-red: #ff2d49;
  --scsl-vault-blue: #1d7dff;
  --scsl-vault-cyan: #55bbff;
  --scsl-vault-chrome: #d8e0ea;
  --gold: var(--scsl-vault-cyan) !important;
  --gold-soft: rgba(85,187,255,.16) !important;
  --gold-line: rgba(216,224,234,.18) !important;
  --scsl-prestige-gold: var(--scsl-vault-cyan) !important;
  scroll-behavior: smooth;
}

html body.stat-vault-page #statsfacts.stat-vault-index-panel,
html body.stat-vault-page .database-hero.database-hero-bottom {
  border: 1px solid rgba(216,224,234,.14) !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(255,45,73,.12), transparent 34%),
    radial-gradient(circle at 100% 0%, rgba(29,125,255,.14), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.058), rgba(255,255,255,.016)),
    rgba(3, 6, 14, .80) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.18) !important;
  backdrop-filter: blur(22px) saturate(1.18) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 18px 48px rgba(0,0,0,.28),
    0 0 34px rgba(29,125,255,.08) !important;
}

html body.stat-vault-page #statsfacts.stat-vault-index-panel::before {
  opacity: .18 !important;
}

html body.stat-vault-page .stats-facts-kicker,
html body.stat-vault-page .scsl-facts-tabs button,
html body.stat-vault-page .db-label,
html body.stat-vault-page .dt-info,
html body.stat-vault-page .dataTables_info {
  color: rgba(171,207,255,.78) !important;
}

html body.stat-vault-page .scsl-facts-metrics,
html body.stat-vault-page .database-hero.database-hero-bottom {
  gap: 8px !important;
}

html body.stat-vault-page .scsl-fact-metric,
html body.stat-vault-page .db-stat {
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(216,224,234,.13) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 26% 0%, rgba(255,255,255,.105), transparent 36%),
    linear-gradient(145deg, rgba(255,45,73,.10), rgba(29,125,255,.105)),
    rgba(5, 9, 19, .66) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 10px 24px rgba(0,0,0,.18) !important;
}

html body.stat-vault-page .scsl-fact-metric::after,
html body.stat-vault-page .db-stat::after {
  content: "" !important;
  position: absolute !important;
  left: 10px !important;
  right: 10px !important;
  bottom: 8px !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, rgba(255,45,73,.90), rgba(29,125,255,.90)) !important;
  opacity: .72 !important;
}

html body.stat-vault-page .scsl-fact-metric strong,
html body.stat-vault-page .db-value {
  color: #f8fbff !important;
  text-shadow:
    0 0 18px rgba(85,187,255,.14),
    0 12px 30px rgba(0,0,0,.32) !important;
}

html body.stat-vault-page .scsl-facts-tabs button.active,
html body.stat-vault-page .scsl-facts-tabs button[aria-selected="true"],
html body.stat-vault-page .db-chip.active {
  color: #fff !important;
  border-color: rgba(255,255,255,.22) !important;
  background:
    radial-gradient(circle at 18% 16%, rgba(255,255,255,.16), transparent 28%),
    linear-gradient(135deg, rgba(255,45,73,.92), rgba(29,125,255,.88)) !important;
}

html body.stat-vault-page .stat-vault-index-story,
html body.stat-vault-page .scsl-facts-story-card {
  border-color: rgba(216,224,234,.13) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.048), rgba(255,255,255,.012)),
    rgba(4, 7, 16, .62) !important;
}

html body.stat-vault-page .scsl-facts-pane h4 {
  color: #f8fbff !important;
  letter-spacing: .01em !important;
}

html body.stat-vault-page .scsl-facts-pane p,
html body.stat-vault-page .scsl-facts-pane li {
  color: rgba(232,238,248,.78) !important;
}

html body.stat-vault-page .legacy-gpt-message-user {
  margin-left: auto !important;
  max-width: min(92%, 560px) !important;
  border-color: rgba(255,45,73,.20) !important;
  background:
    linear-gradient(135deg, rgba(255,45,73,.16), rgba(29,125,255,.12)),
    rgba(6, 10, 21, .72) !important;
}

html body.stat-vault-page .legacy-gpt-message-user .legacy-gpt-message-body {
  color: rgba(247,249,255,.94) !important;
  background: transparent !important;
}

html body.stat-vault-page .legacy-gpt-message-assistant {
  border-color: rgba(216,224,234,.13) !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(85,187,255,.10), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.058), rgba(255,255,255,.016)),
    rgba(4, 7, 16, .70) !important;
}

html body.stat-vault-page .legacy-gpt-prompt,
html body.stat-vault-page .db-chip,
html body.stat-vault-page .scsl-facts-tabs button {
  transition:
    transform .16s ease,
    border-color .16s ease,
    background .16s ease,
    box-shadow .16s ease !important;
}

html body.stat-vault-page .legacy-gpt-prompt:hover,
html body.stat-vault-page .legacy-gpt-prompt:focus-visible,
html body.stat-vault-page .db-chip:hover,
html body.stat-vault-page .scsl-facts-tabs button:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(255,255,255,.26) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 12px 28px rgba(0,0,0,.24),
    0 0 20px rgba(29,125,255,.10) !important;
}

html body.stat-vault-page .database-chips {
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
}

html body.stat-vault-page .database-chips::-webkit-scrollbar {
  display: none !important;
}

html body.stat-vault-page .database-chips .db-chip {
  scroll-snap-align: start !important;
}

html body.stat-vault-page #database .table-wrap {
  border-color: rgba(216,224,234,.13) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(255,45,73,.075), transparent 28%),
    radial-gradient(circle at 100% 0%, rgba(29,125,255,.085), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.038), rgba(255,255,255,.010)),
    rgba(2, 5, 12, .86) !important;
}

html body.stat-vault-page #database .table-wrap::before {
  content: none !important;
  display: none !important;
}

html body.stat-vault-page #playersTable thead th,
html body.stat-vault-page #playersTable th {
  background:
    linear-gradient(180deg, rgba(16, 22, 36, .98), rgba(5, 8, 16, .98)) !important;
  color: rgba(247,249,255,.90) !important;
}

html body.stat-vault-page #playersTable tbody tr {
  transition: background .16s ease, transform .16s ease !important;
}

html body.stat-vault-page #playersTable tbody tr:hover td {
  background-color: rgba(29,125,255,.095) !important;
}

html body.stat-vault-page #playersTable td[data-col="Player"],
html body.stat-vault-page #playersTable th[data-key="Player"],
html body.stat-vault-page #playersTable td:first-child,
html body.stat-vault-page #playersTable th:first-child {
  background:
    linear-gradient(90deg, rgba(8, 12, 24, .99), rgba(8, 12, 24, .94)) !important;
}

@media (max-width: 760px) {
  html body.stat-vault-page #statsfacts.stat-vault-index-panel {
    padding: 13px !important;
    border-radius: 18px !important;
  }

  html body.stat-vault-page .scsl-facts-metrics {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }

  html body.stat-vault-page .scsl-fact-metric {
    min-height: 58px !important;
  }

  html body.stat-vault-page .database-hero.database-hero-bottom {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body.stat-vault-page .db-stat {
    min-height: 82px !important;
  }

  html body.stat-vault-page .database-chips {
    display: flex !important;
    gap: 8px !important;
    overflow-x: auto !important;
    padding: 2px 2px 10px !important;
    -webkit-overflow-scrolling: touch !important;
  }

  html body.stat-vault-page .database-chips .db-chip {
    flex: 0 0 auto !important;
  }
}

/* Final v4.0 Stat Vault gold purge: Legacy Index panes and archive stat tiles. */
html body.stat-vault-page .stats-facts-kicker,
html body.stat-vault-page .eyebrow {
  display: inline-flex !important;
  width: fit-content !important;
  min-height: 22px !important;
  align-items: center !important;
  padding: 0 10px !important;
  border: 1px solid rgba(216,224,234,.14) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(135deg, rgba(255,45,73,.20), rgba(29,125,255,.18)),
    rgba(4, 7, 16, .70) !important;
  color: rgba(202,224,255,.88) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 8px 20px rgba(0,0,0,.18) !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-pane,
html body.stat-vault-page #statsfacts .scsl-facts-pane.active,
html body.stat-vault-page #statsfacts [data-stats-pane] {
  border-color: rgba(216,224,234,.10) !important;
  border-top: 1px solid rgba(216,224,234,.10) !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(255,45,73,.10), transparent 32%),
    radial-gradient(circle at 100% 0%, rgba(29,125,255,.12), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.012)),
    rgba(5, 8, 17, .72) !important;
  color: rgba(247,249,255,.88) !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-pane::before,
html body.stat-vault-page #statsfacts .scsl-facts-pane::after {
  background: none !important;
  box-shadow: none !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-pane h4,
html body.stat-vault-page #statsfacts .scsl-facts-pane h4 span,
html body.stat-vault-page #statsfacts .scsl-facts-pane strong {
  color: #f8fbff !important;
  text-shadow: 0 10px 26px rgba(0,0,0,.26) !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-pane h4 .title-red,
html body.stat-vault-page #statsfacts .scsl-facts-pane .title-red {
  color: var(--scsl-vault-red) !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-receipts,
html body.stat-vault-page #statsfacts .scsl-facts-leader-grid {
  display: grid !important;
  gap: 8px !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-receipts span,
html body.stat-vault-page #statsfacts .scsl-facts-leader-item,
html body.stat-vault-page #statsfacts .stats-facts-coverage-card {
  border: 1px solid rgba(216,224,234,.12) !important;
  border-radius: 13px !important;
  background:
    linear-gradient(135deg, rgba(255,45,73,.075), rgba(29,125,255,.085)),
    rgba(3, 6, 14, .62) !important;
  color: rgba(232,238,248,.82) !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-receipts strong,
html body.stat-vault-page #statsfacts .scsl-facts-leader-item strong {
  color: rgba(85,187,255,.94) !important;
}

html body.stat-vault-page .database-hero.database-hero-bottom .db-stat.featured,
html body.stat-vault-page .database-hero.database-hero-bottom .db-stat {
  border-color: rgba(216,224,234,.13) !important;
  background:
    radial-gradient(circle at 22% 0%, rgba(255,255,255,.10), transparent 36%),
    linear-gradient(135deg, rgba(255,45,73,.10), rgba(29,125,255,.11)),
    rgba(5, 9, 19, .68) !important;
}

html body.stat-vault-page .database-hero.database-hero-bottom .db-stat.featured .db-value,
html body.stat-vault-page .database-hero.database-hero-bottom .db-value {
  color: #f8fbff !important;
}

html body.stat-vault-page .database-hero.database-hero-bottom .db-stat.featured .db-label,
html body.stat-vault-page .database-hero.database-hero-bottom .db-label {
  color: rgba(171,207,255,.74) !important;
}

@media (prefers-reduced-motion: reduce) {
  html body #askAiDrawer .askai-msg,
  html body .legacy-gpt-message,
  html body #askAiDrawer .askai-msg-assistant.loading .askai-msg-body,
  html body .legacy-gpt-message.loading,
  html body #askAiDrawer .askai-msg.is-swapping .askai-msg-body,
  html body .legacy-gpt-message.is-swapping .legacy-gpt-message-body,
  html body #askAiDrawer .askai-msg.is-revealing .askai-msg-body,
  html body .legacy-gpt-message.is-revealing .legacy-gpt-message-body,
  html body #askAiDrawer .askai-msg-assistant.is-revealing .askai-msg-body::before,
  html body .legacy-gpt-message-assistant.is-revealing::before {
    animation: none !important;
  }
}


/* Final v4.0 Stat Vault premium finish: liquid glass sports console. */
html body.stat-vault-page {
  background:
    radial-gradient(circle at 18% 0%, rgba(255, 45, 73, .10), transparent 30%),
    radial-gradient(circle at 90% 4%, rgba(29, 125, 255, .12), transparent 32%),
    linear-gradient(180deg, #050711 0%, #02040a 58%, #010205 100%) !important;
}

html body.stat-vault-page .stat-vault-screen {
  border-radius: 26px !important;
  border-color: rgba(216, 224, 234, .18) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(255,255,255,.045),
    0 32px 76px rgba(0,0,0,.42),
    0 0 0 1px rgba(29,125,255,.035) !important;
}

html body.stat-vault-page #statsfacts.stat-vault-index-panel,
html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full,
html body.stat-vault-page #database .table-wrap {
  border-color: rgba(216,224,234,.18) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(255,255,255,.04),
    0 24px 60px rgba(0,0,0,.34),
    0 0 42px rgba(29,125,255,.08) !important;
}

html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full {
  grid-template-columns: minmax(280px, .74fr) minmax(360px, 1.26fr) !important;
  gap: 13px 18px !important;
  padding: clamp(18px, 2vw, 26px) !important;
  background:
    linear-gradient(90deg, rgba(255,45,73,.20), transparent 2px),
    radial-gradient(circle at 11% 0%, rgba(255,45,73,.20), transparent 32%),
    radial-gradient(circle at 99% 2%, rgba(29,125,255,.22), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.095), rgba(255,255,255,.024)),
    rgba(4, 7, 16, .86) !important;
}

html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full::after {
  content: "" !important;
  position: absolute !important;
  left: 18px !important;
  right: 18px !important;
  top: 12px !important;
  height: 1px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, rgba(255,45,73,.72), rgba(255,255,255,.34), rgba(29,125,255,.72)) !important;
  opacity: .62 !important;
  pointer-events: none !important;
}

html body.stat-vault-page .legacy-gpt-head {
  padding-top: 6px !important;
}

html body.stat-vault-page .legacy-gpt-card h3 {
  max-width: 430px !important;
  font-size: clamp(34px, 4.35vw, 54px) !important;
  line-height: .88 !important;
  letter-spacing: .012em !important;
}

html body.stat-vault-page .legacy-gpt-kicker,
html body.stat-vault-page .stats-facts-kicker {
  color: rgba(192, 220, 255, .92) !important;
}

html body.stat-vault-page .legacy-gpt-lede {
  max-width: 43ch !important;
  color: rgba(235, 240, 248, .78) !important;
}

html body.stat-vault-page #legacyGptMessages.legacy-gpt-messages {
  min-height: clamp(190px, 22vw, 286px) !important;
  border-radius: 20px !important;
  background:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px),
    radial-gradient(circle at 15% 0%, rgba(255,45,73,.11), transparent 32%),
    radial-gradient(circle at 100% 0%, rgba(29,125,255,.12), transparent 34%),
    rgba(2, 5, 12, .72) !important;
  background-size: 32px 32px, 32px 32px, auto, auto, auto !important;
}

html body.stat-vault-page .legacy-gpt-empty {
  min-height: 100% !important;
  display: grid !important;
  place-content: center !important;
  gap: 8px !important;
  border-color: rgba(216,224,234,.13) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(85,187,255,.12), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.014)),
    rgba(6, 10, 21, .58) !important;
}

html body.stat-vault-page .legacy-gpt-form {
  align-items: stretch !important;
}

html body.stat-vault-page .legacy-gpt-input-shell {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 12px 28px rgba(0,0,0,.20) !important;
}

html body.stat-vault-page .legacy-gpt-submit {
  background:
    radial-gradient(circle at 25% 18%, rgba(255,255,255,.28), transparent 28%),
    linear-gradient(135deg, rgba(255,45,73,.94), rgba(29,125,255,.92)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.26),
    0 14px 30px rgba(29,125,255,.22),
    0 10px 24px rgba(255,45,73,.16) !important;
}

html body.stat-vault-page .legacy-gpt-prompt,
html body.stat-vault-page .db-chip,
html body.stat-vault-page .scsl-facts-tabs button {
  border-color: rgba(216,224,234,.17) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.072), rgba(255,255,255,.020)),
    rgba(7, 11, 22, .76) !important;
}

html body.stat-vault-page .scsl-facts-metrics,
html body.stat-vault-page .database-hero.database-hero-bottom {
  gap: 10px !important;
}

html body.stat-vault-page .scsl-fact-metric,
html body.stat-vault-page .db-stat {
  border-radius: 18px !important;
  background:
    linear-gradient(90deg, rgba(255,45,73,.16), transparent 2px),
    radial-gradient(circle at 20% 0%, rgba(255,255,255,.12), transparent 34%),
    linear-gradient(145deg, rgba(255,45,73,.10), rgba(29,125,255,.13)),
    rgba(5, 9, 19, .72) !important;
}

html body.stat-vault-page .scsl-fact-metric strong,
html body.stat-vault-page .db-value,
html body.stat-vault-page #playersTable td:nth-child(2),
html body.stat-vault-page #playersTable td:nth-child(3),
html body.stat-vault-page #playersTable td:nth-child(4),
html body.stat-vault-page #playersTable td:nth-child(5) {
  color: #5fc2ff !important;
  text-shadow: 0 0 18px rgba(85,187,255,.18) !important;
}

html body.stat-vault-page .database-scroll-hint {
  width: fit-content !important;
  max-width: 100% !important;
  margin: 0 0 -2px !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(216,224,234,.12) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(135deg, rgba(255,45,73,.10), rgba(29,125,255,.12)),
    rgba(4, 7, 16, .60) !important;
  color: rgba(192,220,255,.82) !important;
}

html body.stat-vault-page #database .table-wrap {
  overflow: auto !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(255,45,73,.105), transparent 30%),
    radial-gradient(circle at 100% 0%, rgba(29,125,255,.11), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.050), rgba(255,255,255,.010)),
    rgba(2, 5, 12, .88) !important;
}

html body.stat-vault-page #playersTable {
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

html body.stat-vault-page #playersTable thead th,
html body.stat-vault-page #playersTable th {
  border-bottom: 1px solid rgba(216,224,234,.18) !important;
  background:
    linear-gradient(90deg, rgba(255,45,73,.14), transparent 2px),
    linear-gradient(180deg, rgba(18, 25, 42, .98), rgba(4, 8, 18, .98)) !important;
}

html body.stat-vault-page #playersTable tbody td {
  border-bottom-color: rgba(216,224,234,.09) !important;
}

html body.stat-vault-page #playersTable tbody tr:nth-child(odd) td {
  background-color: rgba(255,255,255,.018) !important;
}

html body.stat-vault-page #playersTable tbody tr:hover td {
  background:
    linear-gradient(90deg, rgba(255,45,73,.10), rgba(29,125,255,.115)) !important;
}

html body.stat-vault-page #playersTable td:first-child,
html body.stat-vault-page #playersTable th:first-child {
  box-shadow: 8px 0 24px rgba(0,0,0,.30) !important;
}

@media (max-width: 760px) {
  html body.stat-vault-page .stat-vault-screen {
    border-radius: 22px !important;
    padding: 13px 11px 18px !important;
  }

  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full {
    padding: 15px !important;
    border-radius: 21px !important;
    gap: 10px !important;
  }

  html body.stat-vault-page .legacy-gpt-card h3 {
    max-width: 300px !important;
    font-size: clamp(29px, 8vw, 35px) !important;
    line-height: .90 !important;
  }

  html body.stat-vault-page #legacyGptMessages.legacy-gpt-messages {
    min-height: 112px !important;
    max-height: 34vh !important;
    border-radius: 17px !important;
  }

  html body.stat-vault-page .legacy-gpt-empty {
    padding: 12px !important;
  }

  html body.stat-vault-page .legacy-gpt-lede {
    font-size: 13px !important;
  }

  html body.stat-vault-page .database-scroll-hint {
    border-radius: 14px !important;
    line-height: 1.28 !important;
  }

  html body.stat-vault-page #database .table-wrap {
    border-radius: 20px !important;
  }
}


/* Final v4.0 Stat Vault Legacy Index color lock. */
html body.stat-vault-page #statsfacts .scsl-fact-metric strong,
html body.stat-vault-page #statsfacts .scsl-facts-receipts strong,
html body.stat-vault-page #statsfacts .scsl-facts-leader-item strong {
  color: #58c0ff !important;
  text-shadow: 0 0 18px rgba(85,187,255,.18) !important;
}

html body.stat-vault-page #statsfacts .scsl-fact-metric:nth-child(3) strong {
  color: #ff2d49 !important;
  text-shadow: 0 0 18px rgba(255,45,73,.18) !important;
}

html body.stat-vault-page #statsfacts .scsl-fact-metric,
html body.stat-vault-page #statsfacts .scsl-facts-tabs button,
html body.stat-vault-page #statsfacts .scsl-facts-tabs button.active,
html body.stat-vault-page #statsfacts .scsl-facts-tabs button[aria-selected="true"] {
  border-color: rgba(216,224,234,.16) !important;
}

html body.stat-vault-page #statsfacts .scsl-fact-metric {
  background:
    linear-gradient(90deg, rgba(255,45,73,.16), transparent 2px),
    radial-gradient(circle at 20% 0%, rgba(255,255,255,.115), transparent 34%),
    linear-gradient(145deg, rgba(255,45,73,.085), rgba(29,125,255,.125)),
    rgba(5, 9, 19, .74) !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-tabs button.active,
html body.stat-vault-page #statsfacts .scsl-facts-tabs button[aria-selected="true"] {
  color: #fff !important;
  background:
    radial-gradient(circle at 18% 16%, rgba(255,255,255,.18), transparent 28%),
    linear-gradient(135deg, rgba(255,45,73,.92), rgba(29,125,255,.88)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 12px 28px rgba(0,0,0,.26),
    0 0 24px rgba(29,125,255,.14) !important;
}


/* Final v4.0 Stat Vault natural ask input. */
html body.stat-vault-page #legacyGptForm.legacy-gpt-form {
  grid-template-columns: minmax(0, 1fr) 74px !important;
  gap: 8px !important;
  align-items: center !important;
}

html body.stat-vault-page #legacyGptForm .legacy-gpt-input-shell {
  min-height: 46px !important;
  height: 46px !important;
  border-radius: 999px !important;
  padding: 0 14px 0 13px !important;
  border-color: rgba(216,224,234,.18) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.018)),
    rgba(3, 6, 14, .54) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 0 0 1px rgba(255,255,255,.018),
    0 10px 24px rgba(0,0,0,.16) !important;
}

html body.stat-vault-page #legacyGptForm .legacy-gpt-input-shell:focus-within {
  border-color: rgba(88,192,255,.58) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.088), rgba(255,255,255,.024)),
    rgba(5, 10, 22, .76) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 0 0 3px rgba(88,192,255,.12),
    0 14px 30px rgba(0,0,0,.20) !important;
}

html body.stat-vault-page #legacyGptForm .legacy-gpt-input-mark {
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
  margin-right: 9px !important;
  opacity: .95 !important;
}

html body.stat-vault-page #legacyGptForm .legacy-gpt-input {
  height: 44px !important;
  min-width: 0 !important;
  color: rgba(248,251,255,.96) !important;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  text-transform: none !important;
}

html body.stat-vault-page #legacyGptForm .legacy-gpt-input::placeholder {
  color: rgba(214,222,236,.48) !important;
  opacity: 1 !important;
  font-weight: 600 !important;
  text-transform: none !important;
}

html body.stat-vault-page #legacyGptSubmit.legacy-gpt-submit {
  min-width: 0 !important;
  width: 74px !important;
  min-height: 44px !important;
  height: 44px !important;
  border-radius: 999px !important;
  padding: 0 12px !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: .08em !important;
}

@media (max-width: 760px) {
  html body.stat-vault-page #legacyGptForm.legacy-gpt-form {
    grid-template-columns: minmax(0, 1fr) 58px !important;
    gap: 7px !important;
  }

  html body.stat-vault-page #legacyGptForm .legacy-gpt-input-shell {
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 11px !important;
  }

  html body.stat-vault-page #legacyGptForm .legacy-gpt-input-mark {
    width: 20px !important;
    height: 20px !important;
    flex-basis: 20px !important;
    margin-right: 7px !important;
  }

  html body.stat-vault-page #legacyGptForm .legacy-gpt-input {
    height: 42px !important;
    font-size: 13.25px !important;
    font-weight: 620 !important;
  }

  html body.stat-vault-page #legacyGptForm .legacy-gpt-input::placeholder {
    font-size: 13px !important;
  }

  html body.stat-vault-page #legacyGptSubmit.legacy-gpt-submit {
    width: 58px !important;
    min-height: 42px !important;
    height: 42px !important;
    padding: 0 8px !important;
    font-size: 10.5px !important;
  }
}


/* Final v4.0 Stat Vault mobile command field width lock. */
@media (max-width: 520px) {
  html body.stat-vault-page #legacyGptForm.legacy-gpt-form {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
  }

  html body.stat-vault-page #legacyGptForm .legacy-gpt-input-shell {
    width: 100% !important;
    min-height: 48px !important;
    height: 48px !important;
    padding: 0 13px !important;
  }

  html body.stat-vault-page #legacyGptForm .legacy-gpt-input {
    height: 46px !important;
    width: 100% !important;
    font-size: 14.5px !important;
  }

  html body.stat-vault-page #legacyGptSubmit.legacy-gpt-submit {
    justify-self: stretch !important;
    width: 100% !important;
    height: 42px !important;
    min-height: 42px !important;
    border-radius: 14px !important;
  }
}


/* Final v4.0 Stat Vault command field comfort pass. */
html body.stat-vault-page #legacyGptForm .legacy-gpt-input {
  font-size: 15px !important;
  font-weight: 560 !important;
  color: rgba(248,251,255,.95) !important;
}

html body.stat-vault-page #legacyGptForm .legacy-gpt-input::placeholder {
  color: rgba(220,228,240,.52) !important;
  font-weight: 520 !important;
}

@media (max-width: 520px) {
  html body.stat-vault-page #legacyGptForm .legacy-gpt-input-shell {
    min-height: 50px !important;
    height: 50px !important;
    border-radius: 18px !important;
  }

  html body.stat-vault-page #legacyGptForm .legacy-gpt-input {
    height: 48px !important;
    font-size: 15px !important;
    font-weight: 560 !important;
  }

  html body.stat-vault-page #legacyGptForm .legacy-gpt-input::placeholder {
    font-size: 14px !important;
    font-weight: 520 !important;
  }

  html body.stat-vault-page #legacyGptSubmit.legacy-gpt-submit {
    justify-self: end !important;
    width: 96px !important;
    max-width: 42% !important;
    height: 40px !important;
    min-height: 40px !important;
    border-radius: 999px !important;
    letter-spacing: .09em !important;
  }
}


/* Final v4.0 Stat Vault prompt button contrast lock. */
html body.stat-vault-page #legacyGptSubmit.legacy-gpt-submit {
  color: #f8fbff !important;
  text-shadow: 0 1px 12px rgba(0,0,0,.35) !important;
  border-color: rgba(255,255,255,.24) !important;
}

html body.stat-vault-page .legacy-gpt-prompts .legacy-gpt-prompt,
html body.stat-vault-page #legacyScoreGpt .legacy-gpt-prompt {
  color: rgba(236,242,252,.90) !important;
  border-color: rgba(216,224,234,.17) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.072), rgba(255,255,255,.020)),
    rgba(7, 11, 22, .76) !important;
  text-shadow: none !important;
}

html body.stat-vault-page .legacy-gpt-prompts .legacy-gpt-prompt:hover,
html body.stat-vault-page .legacy-gpt-prompts .legacy-gpt-prompt:focus-visible {
  color: #ffffff !important;
  border-color: rgba(88,192,255,.40) !important;
  background:
    radial-gradient(circle at 18% 16%, rgba(255,255,255,.13), transparent 28%),
    linear-gradient(135deg, rgba(255,45,73,.18), rgba(29,125,255,.20)),
    rgba(8, 13, 25, .86) !important;
}


/* Final v4.0 Stat Vault assistant spacing lock. */
html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full {
  row-gap: 12px !important;
}

html body.stat-vault-page #legacyGptMessages.legacy-gpt-messages {
  margin-bottom: 2px !important;
}

html body.stat-vault-page #legacyGptForm.legacy-gpt-form {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

html body.stat-vault-page .legacy-gpt-prompts {
  margin-top: 0 !important;
}

@media (max-width: 520px) {
  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full {
    gap: 12px !important;
    padding: 15px 15px 17px !important;
  }

  html body.stat-vault-page #legacyGptMessages.legacy-gpt-messages {
    min-height: 104px !important;
    padding: 8px !important;
  }

  html body.stat-vault-page .legacy-gpt-empty {
    padding: 10px 12px !important;
    gap: 6px !important;
  }

  html body.stat-vault-page #legacyGptForm.legacy-gpt-form {
    gap: 7px !important;
    margin-top: -2px !important;
  }

  html body.stat-vault-page #legacyGptForm .legacy-gpt-input-shell {
    min-height: 48px !important;
    height: 48px !important;
  }

  html body.stat-vault-page #legacyGptForm .legacy-gpt-input {
    height: 46px !important;
  }

  html body.stat-vault-page #legacyGptSubmit.legacy-gpt-submit {
    margin-top: 0 !important;
  }

  html body.stat-vault-page .legacy-gpt-prompts {
    gap: 7px !important;
    margin-top: 1px !important;
  }

  html body.stat-vault-page .legacy-gpt-prompt {
    min-height: 38px !important;
  }
}


/* Final v4.0 Stat Vault accidental gold purge lock. */
html body.stat-vault-page .site-menu-toggle-icon,
html body.stat-vault-page .site-menu-toggle-icon span {
  border-color: rgba(88,192,255,.34) !important;
}

html body.stat-vault-page .stat-vault-screen,
html body.stat-vault-page #database.panel.stat-vault-screen {
  border-color: rgba(216,224,234,.18) !important;
}

html body.stat-vault-page .hero-cta-vault .hero-btn,
html body.stat-vault-page .hero-cta-vault .music-btn,
html body.stat-vault-page #musicToggle.music-btn {
  color: rgba(248,251,255,.92) !important;
  border-color: rgba(216,224,234,.18) !important;
  background:
    radial-gradient(circle at 18% 16%, rgba(255,255,255,.12), transparent 30%),
    linear-gradient(135deg, rgba(255,45,73,.18), rgba(29,125,255,.18)),
    rgba(7, 11, 22, .74) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 12px 28px rgba(0,0,0,.24),
    0 0 22px rgba(29,125,255,.08) !important;
}

/* Final v4.0 stat tile shine trim: keep the detail, stop it dominating numbers. */
html body.stat-vault-page .scsl-fact-metric::after,
html body.stat-vault-page .db-stat::after {
  left: 32px !important;
  right: 32px !important;
  bottom: 10px !important;
  height: 1px !important;
  opacity: .34 !important;
  background: linear-gradient(90deg, rgba(255,45,73,.48), rgba(29,125,255,.54)) !important;
}

/* Final v4.0 Stat Vault Ask Archive spacing polish. */
html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full > * {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

html body.stat-vault-page #legacyGptMessages.legacy-gpt-messages,
html body.stat-vault-page #legacyGptForm.legacy-gpt-form,
html body.stat-vault-page #legacyScoreGpt .legacy-gpt-prompts {
  justify-self: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

html body.stat-vault-page #legacyGptMessages.legacy-gpt-messages {
  overflow-x: hidden !important;
}

@media (max-width: 520px) {
  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full {
    gap: 14px !important;
    padding: 17px 16px 19px !important;
  }

  html body.stat-vault-page #legacyScoreGpt .legacy-gpt-head {
    padding-top: 4px !important;
  }

  html body.stat-vault-page #legacyScoreGpt .legacy-gpt-lede {
    line-height: 1.44 !important;
  }

  html body.stat-vault-page #legacyGptMessages.legacy-gpt-messages {
    min-height: 132px !important;
    padding: 10px !important;
    border-radius: 18px !important;
  }

  html body.stat-vault-page #legacyScoreGpt .legacy-gpt-empty {
    min-height: 110px !important;
    padding: 13px !important;
  }

  html body.stat-vault-page #legacyGptForm.legacy-gpt-form {
    gap: 10px !important;
    margin-top: 0 !important;
  }

  html body.stat-vault-page #legacyGptForm .legacy-gpt-input-shell {
    width: 100% !important;
    min-height: 52px !important;
    height: 52px !important;
    padding: 0 14px !important;
    border-radius: 18px !important;
  }

  html body.stat-vault-page #legacyGptForm .legacy-gpt-input {
    height: 50px !important;
    font-size: 14.5px !important;
  }

  html body.stat-vault-page #legacyGptSubmit.legacy-gpt-submit {
    justify-self: end !important;
    width: 108px !important;
    max-width: 48% !important;
    height: 42px !important;
    min-height: 42px !important;
  }

  html body.stat-vault-page #legacyScoreGpt .legacy-gpt-prompts {
    gap: 9px !important;
    margin-top: 0 !important;
  }

  html body.stat-vault-page #legacyScoreGpt .legacy-gpt-prompt {
    min-height: 42px !important;
    padding: 0 10px !important;
    border-radius: 15px !important;
    font-size: 10.2px !important;
    line-height: 1.14 !important;
  }
}

html body.stat-vault-page .hero-cta-vault .hero-btn-primary,
html body.stat-vault-page .hero-cta-vault .hero-btn-gemini {
  border-color: rgba(255,255,255,.22) !important;
  background:
    radial-gradient(circle at 22% 18%, rgba(255,255,255,.20), transparent 30%),
    linear-gradient(135deg, rgba(255,45,73,.92), rgba(29,125,255,.88)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 16px 34px rgba(0,0,0,.28),
    0 0 26px rgba(29,125,255,.14) !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-pane,
html body.stat-vault-page #statsfacts .scsl-facts-pane.active,
html body.stat-vault-page #statsfacts [data-stats-pane] {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 14px 32px rgba(0,0,0,.30),
    0 0 24px rgba(29,125,255,.08) !important;
}

html body.stat-vault-page .legacy-gpt-prompts .legacy-gpt-prompt,
html body.stat-vault-page #legacyScoreGpt .legacy-gpt-prompt,
html body.stat-vault-page .database-chips .db-chip,
html body.stat-vault-page .db-chip,
html body.stat-vault-page #database .db-chip {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 10px 24px rgba(0,0,0,.22) !important;
}

html body.stat-vault-page .database-chips .db-chip.active,
html body.stat-vault-page #database .db-chip.active {
  border-color: rgba(255,255,255,.22) !important;
  background:
    radial-gradient(circle at 18% 16%, rgba(255,255,255,.18), transparent 28%),
    linear-gradient(135deg, rgba(255,45,73,.92), rgba(29,125,255,.88)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 12px 28px rgba(0,0,0,.26),
    0 0 22px rgba(29,125,255,.14) !important;
}

html body.stat-vault-page #playerSearch.search-box,
html body.stat-vault-page #database input[type="search"],
html body.stat-vault-page .dt-search input {
  border-color: rgba(216,224,234,.18) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 10px 24px rgba(0,0,0,.18) !important;
}

html body.stat-vault-page #playersTable th,
html body.stat-vault-page #playersTable td {
  border-color: rgba(216,224,234,.10) !important;
}

html body.stat-vault-page #playersTable th:nth-child(2),
html body.stat-vault-page #playersTable td:nth-child(2) {
  border-left-color: rgba(88,192,255,.22) !important;
  border-right-color: rgba(88,192,255,.16) !important;
}

html body.stat-vault-page #playersTable td:first-child,
html body.stat-vault-page #playersTable th:first-child {
  color: rgba(248,251,255,.94) !important;
  border-left-color: rgba(216,224,234,.10) !important;
  border-right-color: rgba(216,224,234,.10) !important;
}

html body.stat-vault-page #playersTable tbody tr:last-child td,
html body.stat-vault-page #playersTable tbody tr:last-child td:first-child {
  color: rgba(248,251,255,.94) !important;
  border-color: rgba(216,224,234,.10) !important;
}


/* Final v4.0 Stat Vault hero CTA icon lock. */
html body.stat-vault-page .hero-cta.hero-cta-vault {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 0 2px !important;
}

html body.stat-vault-page .hero-cta.hero-cta-vault .hero-btn {
  position: relative !important;
  display: inline-flex !important;
  flex: 1 1 156px !important;
  max-width: 220px !important;
  min-height: 46px !important;
  height: 46px !important;
  width: auto !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  padding: 0 14px !important;
  line-height: 1 !important;
}

html body.stat-vault-page .hero-cta.hero-cta-vault .hero-btn-gemini-mark {
  display: inline-grid !important;
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  place-items: center !important;
  border-radius: 9px !important;
  overflow: hidden !important;
  background: rgba(2, 5, 12, .42) !important;
}

html body.stat-vault-page .hero-cta.hero-cta-vault .hero-btn-gemini-mark img,
html body.stat-vault-page .hero-cta.hero-cta-vault .hero-btn img {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  max-width: 18px !important;
  max-height: 18px !important;
  object-fit: contain !important;
  transform: none !important;
}

html body.stat-vault-page .hero-cta.hero-cta-vault .hero-btn-gemini-text,
html body.stat-vault-page .hero-cta.hero-cta-vault .hero-btn {
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}

html body.stat-vault-page .stat-vault-head .eyebrow::before,
html body.stat-vault-page .stat-vault-head .eyebrow::after {
  background: linear-gradient(90deg, rgba(255,45,73,.86), rgba(29,125,255,.86)) !important;
}

@media (max-width: 520px) {
  html body.stat-vault-page .hero-cta.hero-cta-vault {
    justify-content: flex-start !important;
  }

  html body.stat-vault-page .hero-cta.hero-cta-vault .hero-btn {
    flex: 1 1 calc(50% - 6px) !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 10px !important;
    font-size: 11.5px !important;
  }

  html body.stat-vault-page .hero-cta.hero-cta-vault .hero-btn-gemini-mark {
    flex-basis: 22px !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
  }

  html body.stat-vault-page .hero-cta.hero-cta-vault .hero-btn-gemini-mark img,
  html body.stat-vault-page .hero-cta.hero-cta-vault .hero-btn img {
    width: 16px !important;
    height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
  }
}


/* Final v4.0 Stat Vault eyebrow label cleanup. */
html body.stat-vault-page .stat-vault-head .eyebrow {
  display: inline-flex !important;
  width: fit-content !important;
  max-width: 100% !important;
  min-height: 0 !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(180, 208, 248, .86) !important;
  font-family: Rajdhani, Inter, system-ui, sans-serif !important;
  font-size: clamp(12px, 2.8vw, 14px) !important;
  font-weight: 800 !important;
  letter-spacing: .16em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

html body.stat-vault-page .stat-vault-head .eyebrow::before {
  content: "" !important;
  display: inline-block !important;
  width: 22px !important;
  height: 2px !important;
  flex: 0 0 22px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, rgba(255,45,73,.95), rgba(29,125,255,.95)) !important;
  box-shadow: 0 0 12px rgba(29,125,255,.18) !important;
}

html body.stat-vault-page .stat-vault-head .eyebrow::after {
  content: none !important;
  display: none !important;
}

html body.stat-vault-page .stat-vault-head h2 {
  margin-top: 0 !important;
}

@media (max-width: 520px) {
  html body.stat-vault-page .stat-vault-head .eyebrow {
    margin-bottom: 8px !important;
    font-size: 12px !important;
    letter-spacing: .14em !important;
  }

  html body.stat-vault-page .stat-vault-head .eyebrow::before {
    width: 18px !important;
    flex-basis: 18px !important;
  }
}


/* Final v4.0 Stat Vault header alignment lock. */
html body.stat-vault-page .stat-vault-head > div:first-child {
  display: grid !important;
  justify-items: start !important;
  text-align: left !important;
}

html body.stat-vault-page .stat-vault-head .eyebrow {
  justify-self: start !important;
}

/* Final v4.0 official Gemini glow system. */
html body .hero-btn-gemini-mark,
html body .askai-head-mark,
html body .legacy-gpt-mark,
html body .legacy-gpt-input-mark,
html body .formula-archive-gemini-mark,
html body .formula-archive-action img[src*="gemini-official"],
html body img[src*="gemini-official"].formula-archive-gemini-img {
  position: relative !important;
  isolation: isolate !important;
  background:
    radial-gradient(circle at 34% 26%, rgba(255,255,255,.18), transparent 28%),
    linear-gradient(135deg, rgba(255,45,73,.18), rgba(43,104,255,.20) 48%, rgba(36,211,102,.16)),
    rgba(3, 6, 14, .72) !important;
  border: 1px solid rgba(216,224,234,.14) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 0 18px rgba(69,145,255,.22),
    0 0 28px rgba(255,45,73,.10) !important;
}

html body .hero-btn-gemini-mark::after,
html body .askai-head-mark::after,
html body .legacy-gpt-mark::after,
html body .legacy-gpt-input-mark::after {
  content: "" !important;
  position: absolute !important;
  inset: -5px !important;
  z-index: -1 !important;
  border-radius: inherit !important;
  background:
    radial-gradient(circle at 34% 30%, rgba(66,133,244,.22), transparent 44%),
    radial-gradient(circle at 72% 72%, rgba(52,168,83,.14), transparent 42%),
    radial-gradient(circle at 16% 72%, rgba(234,67,53,.14), transparent 42%) !important;
  filter: blur(7px) !important;
  opacity: .82 !important;
  pointer-events: none !important;
}

html body .hero-btn-gemini-mark img,
html body .askai-head-mark img,
html body .legacy-gpt-mark img,
html body .legacy-gpt-input-mark img,
html body .askai-bubble-gemini,
html body img[src*="gemini-official"] {
  filter:
    drop-shadow(0 0 8px rgba(66,133,244,.32))
    drop-shadow(0 0 10px rgba(52,168,83,.18)) !important;
}

html body #askAiBubble.askai-bubble,
html body .askai-bubble.askai-bubble {
  box-shadow:
    0 18px 48px rgba(0,0,0,.34),
    0 0 0 1px rgba(216,224,234,.14),
    0 0 24px rgba(66,133,244,.20),
    0 0 32px rgba(234,67,53,.10) !important;
}

html body #askAiBubble .askai-bubble-face,
html body .askai-bubble .askai-bubble-face {
  background:
    radial-gradient(circle at 30% 22%, rgba(255,255,255,.20), transparent 25%),
    linear-gradient(135deg, rgba(234,67,53,.92), rgba(66,133,244,.92) 52%, rgba(52,168,83,.84)) !important;
}

/* Final v4.0 Gemini drawer menu mark. */
@media (max-width: 760px) {
  html body .site-mobile-drawer .site-drawer-link[data-ask-ai-open] {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
  }

  html body .site-mobile-drawer .site-drawer-link[data-ask-ai-open]::before {
    content: "" !important;
    display: inline-block !important;
    flex: 0 0 22px !important;
    width: 22px !important;
    height: 22px !important;
    border-radius: 9px !important;
    background:
      url("gemini-official.png") center / 15px 15px no-repeat,
      radial-gradient(circle at 34% 26%, rgba(255,255,255,.20), transparent 30%),
      linear-gradient(135deg, rgba(234,67,53,.30), rgba(66,133,244,.34) 52%, rgba(52,168,83,.26)),
      rgba(3,6,14,.70) !important;
    border: 1px solid rgba(216,224,234,.14) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.14),
      0 0 14px rgba(66,133,244,.22),
      0 0 20px rgba(234,67,53,.10) !important;
  }
}

/* Final v4.0 follow-up polish: chrome hint and Stat Vault title spacing. */
html body.stat-vault-page .stat-vault-head h2 {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  justify-content: flex-start !important;
  column-gap: .14em !important;
  row-gap: 0 !important;
}

html body.stat-vault-page .stat-vault-head h2 > span {
  display: inline-block !important;
}

html body.stat-vault-page .stat-vault-head h2 .title-red {
  margin-left: 0 !important;
}

@media (max-width: 760px) {
  html body #top15 .section-head::after {
    border-color: rgba(216,224,234,.18) !important;
    color: rgba(242,246,255,.86) !important;
    background:
      linear-gradient(90deg, rgba(229,27,53,.18), rgba(15,93,255,.14)),
      linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.020)),
      rgba(3,6,14,.74) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.12),
      0 10px 22px rgba(0,0,0,.20),
      0 0 18px rgba(15,93,255,.10) !important;
  }

  html body #top15Grid .card .mobile-expand-hint {
    position: relative !important;
    min-height: 40px !important;
    padding-right: 50px !important;
    border: 1px solid rgba(216,224,234,.16) !important;
    color: rgba(246,248,255,.90) !important;
    background:
      radial-gradient(circle at 9% 0%, rgba(53,167,255,.13), transparent 34%),
      linear-gradient(90deg, rgba(229,27,53,.14), rgba(15,93,255,.13)),
      linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.024)),
      rgba(4,7,16,.72) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.13),
      0 12px 26px rgba(0,0,0,.18),
      0 0 20px rgba(15,93,255,.08) !important;
  }

  html body #top15Grid .card .mobile-expand-hint .hint-closed,
  html body #top15Grid .card .mobile-expand-hint .hint-open {
    color: inherit !important;
    text-shadow: 0 1px 10px rgba(0,0,0,.32) !important;
  }

  html body #top15Grid .card .mobile-expand-hint .hint-arrow,
  html body #top15Grid .card .hint-arrow {
    right: 10px !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    border: 1px solid rgba(216,224,234,.18) !important;
    border-radius: 10px !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.16),
      0 8px 20px rgba(0,0,0,.22),
      0 0 16px rgba(15,93,255,.12) !important;
  }
}

@media (max-width: 760px) {
  html body #top15Grid .card[data-scsl-team-theme] .mobile-expand-hint,
  html body #top15Grid .card.card .mobile-expand-hint.mobile-expand-hint {
    border-color: rgba(216,224,234,.16) !important;
    color: rgba(246,248,255,.90) !important;
    background:
      radial-gradient(circle at 9% 0%, rgba(53,167,255,.13), transparent 34%),
      linear-gradient(90deg, rgba(229,27,53,.14), rgba(15,93,255,.13)),
      linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.024)),
      rgba(4,7,16,.72) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.13),
      0 12px 26px rgba(0,0,0,.18),
      0 0 20px rgba(15,93,255,.08) !important;
  }
}

@media (max-width: 760px) {
  html body .site-mobile-drawer button.site-drawer-link.site-drawer-link[data-ask-ai-open],
  html body .site-mobile-drawer .site-drawer-link.site-drawer-link[data-ask-ai-open] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    border-color: rgba(216,224,234,.18) !important;
    color: rgba(248,250,255,.96) !important;
    background:
      radial-gradient(circle at 23% 18%, rgba(66,133,244,.18), transparent 36%),
      radial-gradient(circle at 72% 78%, rgba(52,168,83,.10), transparent 40%),
      linear-gradient(90deg, rgba(234,67,53,.18), rgba(66,133,244,.16)),
      linear-gradient(180deg, rgba(255,255,255,.072), rgba(255,255,255,.024)),
      rgba(5,8,18,.78) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.14),
      0 12px 26px rgba(0,0,0,.20),
      0 0 20px rgba(66,133,244,.14),
      0 0 24px rgba(234,67,53,.08) !important;
  }

  html body .site-mobile-drawer button.site-drawer-link.site-drawer-link[data-ask-ai-open]::before,
  html body .site-mobile-drawer .site-drawer-link.site-drawer-link[data-ask-ai-open]::before {
    content: none !important;
    display: none !important;
  }

  html body .site-mobile-drawer .site-drawer-gemini-mark {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 22px !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    border-radius: 9px !important;
    background:
      url("gemini-official.png") center / 15px 15px no-repeat,
      radial-gradient(circle at 34% 26%, rgba(255,255,255,.20), transparent 30%),
      linear-gradient(135deg, rgba(234,67,53,.30), rgba(66,133,244,.34) 52%, rgba(52,168,83,.26)),
      rgba(3,6,14,.70) !important;
    border: 1px solid rgba(216,224,234,.14) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.14),
      0 0 14px rgba(66,133,244,.22),
      0 0 20px rgba(234,67,53,.10) !important;
  }

  html body .site-mobile-drawer .site-drawer-gemini-mark img {
    display: block !important;
    width: 15px !important;
    height: 15px !important;
    object-fit: contain !important;
  }
}

/* Final v4.0 menu label and button polish. */
html body .site-menu-toggle {
  min-width: 148px !important;
  height: 54px !important;
  min-height: 54px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 0 14px 0 16px !important;
  border: 1px solid rgba(216,224,234,.22) !important;
  border-radius: 18px !important;
  color: rgba(248,250,255,.98) !important;
  background:
    radial-gradient(circle at 24% 12%, rgba(255,255,255,.14), transparent 28%),
    linear-gradient(105deg, rgba(229,27,53,.24), rgba(15,93,255,.20)),
    linear-gradient(180deg, rgba(255,255,255,.080), rgba(255,255,255,.026)),
    rgba(5,8,18,.78) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 12px 26px rgba(0,0,0,.24),
    0 0 22px rgba(15,93,255,.12) !important;
}

html body .site-menu-toggle-copy {
  display: grid !important;
  justify-items: start !important;
  gap: 2px !important;
  line-height: 1 !important;
}

html body .site-menu-toggle-kicker {
  color: rgba(102,184,255,.90) !important;
  font-family: var(--font-stat, Rajdhani, sans-serif) !important;
  font-size: 9px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

html body .site-menu-toggle-label {
  color: rgba(255,255,255,.98) !important;
  font-family: var(--font-stat, Rajdhani, sans-serif) !important;
  font-size: 20px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  line-height: .95 !important;
  text-transform: uppercase !important;
}

html body .site-menu-toggle-icon {
  width: 36px !important;
  height: 28px !important;
  min-width: 36px !important;
  border: 1px solid rgba(216,224,234,.12) !important;
  border-radius: 12px !important;
  background: rgba(2,5,12,.46) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}

html body .site-menu-toggle[aria-expanded="true"] {
  border-color: rgba(255,255,255,.30) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 14px 30px rgba(0,0,0,.26),
    0 0 26px rgba(255,45,73,.12),
    0 0 28px rgba(15,93,255,.14) !important;
}

@media (max-width: 760px) {
  html body .site-mobile-drawer-nav .site-drawer-link {
    min-height: 54px !important;
    padding: 0 18px !important;
    font-size: 19px !important;
    letter-spacing: 0 !important;
    line-height: 1 !important;
    text-wrap: balance;
  }

  html body .site-menu-toggle {
    min-width: 142px !important;
    height: 52px !important;
    min-height: 52px !important;
    border-radius: 17px !important;
  }

  html body .site-menu-toggle-label {
    font-size: 19px !important;
  }
}

/* Final v4.0 launch polish: Stat Vault rhythm, restrained tile shine, Gemini clamp. */
html body.stat-vault-page .stat-vault-head {
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 12px !important;
}

html body.stat-vault-page .stat-vault-head > p {
  max-width: 760px !important;
  margin: 0 !important;
  text-align: left !important;
  line-height: 1.55 !important;
}

html body.stat-vault-page #statsfacts .section-head p,
html body.stat-vault-page .legacy-gpt-lede {
  line-height: 1.55 !important;
  text-wrap: pretty;
}

html body.stat-vault-page .scsl-fact-metric,
html body.stat-vault-page .db-stat {
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.065), transparent 24%),
    linear-gradient(145deg, rgba(255,45,73,.078), rgba(29,125,255,.095)),
    rgba(5, 9, 19, .68) !important;
}

html body.stat-vault-page .scsl-fact-metric::after,
html body.stat-vault-page .db-stat::after {
  left: 22px !important;
  right: 22px !important;
  bottom: 9px !important;
  height: 1px !important;
  opacity: .52 !important;
  background: linear-gradient(90deg, rgba(255,45,73,.68), rgba(29,125,255,.72)) !important;
}

/* Final v4.0 stat tile reflection trim: keep glass, remove the heavy gray wash. */
html body.stat-vault-page .scsl-fact-metric::after,
html body.stat-vault-page .db-stat::after {
  left: 32px !important;
  right: 32px !important;
  bottom: 10px !important;
  height: 1px !important;
  opacity: .34 !important;
  background: linear-gradient(90deg, rgba(255,45,73,.48), rgba(29,125,255,.54)) !important;
}

html body.stat-vault-page #statsfacts .scsl-fact-metric::before {
  top: 1px !important;
  right: 1px !important;
  bottom: auto !important;
  left: 1px !important;
  width: auto !important;
  height: 42% !important;
  opacity: .42 !important;
  border-radius: inherit !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.040) 42%, rgba(255,255,255,0) 82%),
    linear-gradient(90deg, rgba(0,0,0,0), rgba(91,184,255,.055), rgba(0,0,0,0)) !important;
}

html body.stat-vault-page .scsl-fact-metric,
html body.stat-vault-page .db-stat {
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.040), transparent 22%),
    linear-gradient(145deg, rgba(255,45,73,.070), rgba(29,125,255,.088)),
    rgba(5, 9, 19, .70) !important;
}

html body.stat-vault-page .scsl-fact-metric strong,
html body.stat-vault-page .db-value {
  text-shadow:
    0 0 12px rgba(85,187,255,.12),
    0 10px 24px rgba(0,0,0,.26) !important;
}

@media (min-width: 761px) and (max-width: 900px) {
  html body.stat-vault-page main {
    overflow-x: hidden !important;
  }

  html body.stat-vault-page .panel.stat-vault-screen,
  html body.stat-vault-page #database.panel.stat-vault-screen,
  html body.stat-vault-page #statsfacts.stat-vault-index-panel,
  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card,
  html body.stat-vault-page .database-panel {
    width: min(100%, calc(100vw - 32px)) !important;
    max-width: calc(100vw - 32px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  html body.stat-vault-page .stat-vault-head,
  html body.stat-vault-page .stat-vault-head > div,
  html body.stat-vault-page .stat-vault-head > p,
  html body.stat-vault-page #statsfacts .section-head,
  html body.stat-vault-page #statsfacts .scsl-facts-console,
  html body.stat-vault-page #statsfacts .scsl-facts-metrics,
  html body.stat-vault-page #statsfacts .stat-vault-index-story {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  html body.stat-vault-page .stat-vault-head {
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start !important;
  }

  html body.stat-vault-page .hero-cta.hero-cta-vault {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 10px !important;
  }

  html body.stat-vault-page .hero-cta.hero-cta-vault .hero-btn {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  html body.stat-vault-page .hero-cta.hero-cta-vault .music-btn,
  html body.stat-vault-page .hero-cta.hero-cta-vault #musicToggle {
    grid-column: 1 / -1 !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric {
    width: auto !important;
    min-width: 0 !important;
  }
}

html body #askAiBubble.askai-bubble,
html body .askai-bubble.askai-bubble {
  overflow: hidden !important;
  contain: layout paint !important;
  animation: scslGeminiButtonGlow 2.8s ease-in-out infinite !important;
}

html body #askAiBubble .askai-bubble-face,
html body .askai-bubble .askai-bubble-face {
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  border-radius: 999px !important;
}

html body #askAiBubble .askai-bubble-gemini,
html body .askai-bubble .askai-bubble-gemini {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: 72% !important;
  height: 72% !important;
  max-width: 72% !important;
  max-height: 72% !important;
  object-fit: contain !important;
  transform: none !important;
}

html body .site-drawer-gemini-link,
html body .hero-btn-gemini,
html body .legacy-gpt-submit {
  animation: scslGeminiButtonGlow 2.8s ease-in-out infinite !important;
}

html body.stat-vault-page #legacyScoreGpt .legacy-gpt-prompt,
html body #statsfacts .scsl-facts-ask-chips a,
html body #statsfacts .scsl-facts-ask-prompts a {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  border-color: rgba(216, 224, 234, .20) !important;
  background:
    radial-gradient(circle at 22% 12%, rgba(255,255,255,.105), transparent 30%),
    linear-gradient(135deg, rgba(255,45,73,.075), rgba(29,125,255,.088)),
    rgba(7, 11, 20, .66) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 10px 24px rgba(0,0,0,.22),
    0 0 18px rgba(29,125,255,.075) !important;
  animation: scslGeminiChipBreath 3.8s ease-in-out infinite !important;
}

html body.stat-vault-page #legacyScoreGpt .legacy-gpt-prompt::before,
html body #statsfacts .scsl-facts-ask-chips a::before,
html body #statsfacts .scsl-facts-ask-prompts a::before {
  content: "" !important;
  position: absolute !important;
  inset: 1px !important;
  z-index: 0 !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  background: linear-gradient(108deg, transparent 0%, transparent 34%, rgba(255,255,255,.20) 48%, transparent 64%) !important;
  opacity: .42 !important;
  transform: translateX(-115%) !important;
  animation: scslGeminiChipSheen 4.4s ease-in-out infinite !important;
}

@keyframes scslGeminiChipBreath {
  0%, 100% {
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.13),
      0 10px 24px rgba(0,0,0,.22),
      0 0 14px rgba(29,125,255,.070);
  }
  50% {
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.18),
      0 12px 28px rgba(0,0,0,.26),
      0 0 22px rgba(29,125,255,.13),
      0 0 18px rgba(255,45,73,.075);
  }
}

@keyframes scslGeminiChipSheen {
  0%, 52%, 100% { transform: translateX(-115%); opacity: .18; }
  66% { transform: translateX(115%); opacity: .46; }
}

@keyframes scslGeminiButtonGlow {
  0%, 100% {
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.20),
      0 12px 28px rgba(0,0,0,.30),
      0 0 18px rgba(29,125,255,.18),
      0 0 18px rgba(255,45,73,.12);
  }
  50% {
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.28),
      0 14px 34px rgba(0,0,0,.34),
      0 0 30px rgba(29,125,255,.30),
      0 0 28px rgba(255,45,73,.22);
  }
}

/* Final v4.0 launch safety: closed Gemini drawer must never cover content. */
html body #askAiDrawer.askai-drawer[aria-hidden="true"],
html body #askAiDrawer.askai-drawer:not(.is-open) {
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(18px) scale(.98) !important;
  visibility: hidden !important;
}

html body #askAiDrawer.askai-drawer.is-open,
html body #askAiDrawer.askai-drawer[aria-hidden="false"] {
  opacity: 1 !important;
  pointer-events: auto !important;
  visibility: visible !important;
}

html body #askAiBackdrop.askai-backdrop[hidden],
html body #askAiBackdrop.askai-backdrop:not(.is-shown) {
  opacity: 0 !important;
  pointer-events: none !important;
}

html body.stat-vault-page #statsFactsTitle .title-red {
  margin-left: .12em !important;
}

/* Final v4.0 menu parity lock: Home and Stat Vault share one bar/button system. */
html body .broadcast-bar {
  min-height: 44px !important;
  height: 44px !important;
  padding: 0 18px !important;
  align-items: center !important;
}

html body .broadcast-bar .site-menu-toggle.site-menu-toggle,
html body button.site-menu-toggle.site-menu-toggle {
  width: 152px !important;
  min-width: 152px !important;
  height: 42px !important;
  min-height: 42px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 36px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 0 14px 0 16px !important;
  border-radius: 12px !important;
  border-color: rgba(216,224,234,.34) !important;
  transform: none !important;
  transform-origin: center !important;
}

html body.site-menu-open .broadcast-bar .site-menu-toggle.site-menu-toggle,
html body.site-menu-open button.site-menu-toggle.site-menu-toggle {
  transform: none !important;
}

html body .site-menu-toggle-copy {
  justify-self: start !important;
}

html body .site-menu-toggle-icon {
  justify-self: end !important;
  width: 36px !important;
  min-width: 36px !important;
  height: 28px !important;
}

html body .site-menu-toggle-label {
  font-size: 20px !important;
  letter-spacing: 0 !important;
}

@media (max-width: 760px) {
  html body .broadcast-bar {
    min-height: 54px !important;
    height: 54px !important;
    padding: 0 14px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 112px !important;
    gap: 10px !important;
  }

  html body .broadcast-bar .site-menu-toggle.site-menu-toggle,
  html body button.site-menu-toggle.site-menu-toggle {
    width: 112px !important;
    min-width: 112px !important;
    height: 38px !important;
    min-height: 38px !important;
    grid-template-columns: minmax(0, 1fr) 30px !important;
    gap: 7px !important;
    padding: 0 8px 0 11px !important;
    border-radius: 12px !important;
  }

  html body .site-menu-toggle-kicker {
    font-size: 8.5px !important;
  }

  html body .site-menu-toggle-label {
    font-size: 12px !important;
    letter-spacing: .12em !important;
  }

  html body .site-menu-toggle-icon {
    width: 30px !important;
    min-width: 30px !important;
    height: 24px !important;
    border-radius: 10px !important;
  }
}

/* Final v4.0 desktop drawer fix: desktop menu button must open a usable panel. */
@media (min-width: 761px) {
  html body.site-menu-open {
    overflow: hidden !important;
  }

  html body.site-menu-open .site-drawer-backdrop:not([hidden]) {
    display: block !important;
    position: fixed !important;
    inset: 44px 0 0 0 !important;
    z-index: 2147483100 !important;
    background:
      radial-gradient(circle at 88% 0%, rgba(15, 93, 255, .16), transparent 34%),
      radial-gradient(circle at 12% 12%, rgba(229, 27, 53, .12), transparent 30%),
      rgba(0, 0, 0, .46) !important;
    -webkit-backdrop-filter: blur(10px) saturate(1.10) !important;
    backdrop-filter: blur(10px) saturate(1.10) !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) {
    display: flex !important;
    position: fixed !important;
    top: 58px !important;
    right: 18px !important;
    bottom: auto !important;
    z-index: 2147483101 !important;
    width: min(360px, calc(100vw - 36px)) !important;
    max-height: calc(100vh - 78px) !important;
    flex-direction: column !important;
    gap: 14px !important;
    padding: 14px !important;
    border: 1px solid rgba(216, 224, 234, .22) !important;
    border-radius: 20px !important;
    background:
      radial-gradient(circle at 14% 0%, rgba(229, 27, 53, .20), transparent 38%),
      radial-gradient(circle at 100% 8%, rgba(15, 93, 255, .20), transparent 42%),
      linear-gradient(180deg, rgba(255,255,255,.086), rgba(255,255,255,.024)),
      rgba(3, 6, 14, .96) !important;
    box-shadow:
      0 30px 90px rgba(0,0,0,.58),
      0 0 0 1px rgba(53,167,255,.08),
      inset 0 1px 0 rgba(255,255,255,.14) !important;
    overflow-y: auto !important;
    -webkit-backdrop-filter: blur(24px) saturate(1.22) !important;
    backdrop-filter: blur(24px) saturate(1.22) !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-mobile-drawer-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding-bottom: 12px !important;
    border-bottom: 1px solid rgba(216, 224, 234, .16) !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-mobile-drawer-head strong {
    display: block !important;
    color: rgba(247,249,255,.98) !important;
    font-family: Rajdhani, Inter, sans-serif !important;
    font-size: 22px !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-mobile-drawer-kicker {
    display: block !important;
    margin-bottom: 4px !important;
    color: rgba(102,184,255,.88) !important;
    font-family: Rajdhani, Inter, sans-serif !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    letter-spacing: .10em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-drawer-close {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 72px !important;
    min-height: 34px !important;
    padding: 0 13px !important;
    border-radius: 999px !important;
    pointer-events: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-mobile-drawer-nav {
    display: grid !important;
    gap: 9px !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-drawer-link {
    min-height: 48px !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding: 0 15px !important;
    border-radius: 15px !important;
    text-align: left !important;
    text-decoration: none !important;
    cursor: pointer !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-drawer-gemini-mark {
    display: grid !important;
    place-items: center !important;
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    flex: 0 0 24px !important;
    border-radius: 999px !important;
    overflow: hidden !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-drawer-gemini-mark img {
    display: block !important;
    width: 15px !important;
    height: 15px !important;
    max-width: 15px !important;
    max-height: 15px !important;
    object-fit: contain !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-drawer-gemini-link > span:not(.site-drawer-gemini-mark) {
    min-width: 0 !important;
  }
}

/* Final v4.0 mobile calm: keep the Gemini bubble, remove the helper tooltip overlap. */
@media (max-width: 700px) {
  html body #askAiTooltip.askai-tooltip,
  html body .askai-tooltip {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

/* Final v4.0 hero button surface pass: ESPN energy through Apple-style glass. */
html body .hero:not(#top15) .hero-cta .hero-btn,
html body .hero:not(#top15) .hero-cta .music-btn {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  border-color: rgba(225, 234, 255, .28) !important;
  color: rgba(250, 252, 255, .98) !important;
  background:
    radial-gradient(circle at 18% 8%, rgba(255,255,255,.20), transparent 28%),
    radial-gradient(circle at 90% 92%, rgba(39,128,255,.18), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.105), rgba(255,255,255,.030) 42%, rgba(1,4,12,.26)),
    rgba(5, 9, 20, .74) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    inset 0 -1px 0 rgba(255,255,255,.055),
    0 14px 36px rgba(0,0,0,.30),
    0 0 24px rgba(31,112,255,.12) !important;
  text-shadow: 0 1px 10px rgba(0,0,0,.34) !important;
}

html body .hero:not(#top15) .hero-cta .hero-btn > *,
html body .hero:not(#top15) .hero-cta .music-btn > * {
  position: relative !important;
  z-index: 2 !important;
}

html body .hero:not(#top15) .hero-cta .hero-btn::before,
html body .hero:not(#top15) .hero-cta .music-btn::before {
  content: "" !important;
  position: absolute !important;
  inset: 1px !important;
  z-index: 1 !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.26), rgba(255,255,255,.060) 34%, rgba(255,255,255,0) 58%),
    linear-gradient(106deg, transparent 0%, transparent 34%, rgba(255,255,255,.24) 47%, transparent 61%) !important;
  opacity: .52 !important;
  transform: translateX(-18%) !important;
  animation: scslHeroGlassSweep 4.9s ease-in-out infinite !important;
}

html body .hero:not(#top15) .hero-cta .hero-btn::after,
html body .hero:not(#top15) .hero-cta .music-btn::after {
  content: "" !important;
  position: absolute !important;
  inset: auto 16px 6px !important;
  z-index: 1 !important;
  height: 2px !important;
  border-radius: 999px !important;
  pointer-events: none !important;
  background: linear-gradient(90deg, transparent, rgba(255,45,73,.70), rgba(39,128,255,.76), transparent) !important;
  filter: blur(.15px) !important;
  opacity: .62 !important;
}

html body .hero:not(#top15) .hero-cta .hero-btn-primary.hero-btn-primary {
  border-color: rgba(255,255,255,.34) !important;
  background:
    radial-gradient(circle at 22% 18%, rgba(255,255,255,.28), transparent 26%),
    radial-gradient(circle at 14% 86%, rgba(255,45,73,.50), transparent 38%),
    radial-gradient(circle at 92% 18%, rgba(42,135,255,.58), transparent 40%),
    linear-gradient(112deg, #f31844 0%, #c72a70 36%, #4b57df 66%, #146cff 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -1px 0 rgba(0,0,0,.18),
    0 16px 42px rgba(0,0,0,.32),
    0 0 30px rgba(255,45,73,.22),
    0 0 34px rgba(39,128,255,.22) !important;
}

html body .hero:not(#top15) .hero-cta .hero-btn-ghost.hero-btn-ghost,
html body .hero:not(#top15) .hero-cta #legacyIntroBtn.legacy-intro-btn,
html body .hero:not(#top15) .hero-cta #musicToggle.music-btn {
  border-color: rgba(225,234,255,.26) !important;
  background:
    radial-gradient(circle at 15% 10%, rgba(255,45,73,.16), transparent 32%),
    radial-gradient(circle at 92% 88%, rgba(39,128,255,.18), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.100), rgba(255,255,255,.030) 43%, rgba(0,0,0,.26)),
    rgba(6, 10, 21, .78) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -1px 0 rgba(255,255,255,.050),
    0 14px 34px rgba(0,0,0,.30),
    0 0 24px rgba(39,128,255,.13),
    0 0 22px rgba(255,45,73,.080) !important;
}

html body .hero:not(#top15) .hero-cta .hero-btn-gemini.hero-btn-gemini {
  border-color: rgba(138, 189, 255, .34) !important;
  background:
    radial-gradient(circle at 18% 18%, rgba(255,255,255,.18), transparent 28%),
    radial-gradient(circle at 20% 78%, rgba(234,67,53,.22), transparent 34%),
    radial-gradient(circle at 88% 26%, rgba(66,133,244,.30), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.105), rgba(255,255,255,.030) 42%, rgba(0,0,0,.28)),
    rgba(5, 10, 22, .80) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    0 14px 36px rgba(0,0,0,.30),
    0 0 26px rgba(66,133,244,.19),
    0 0 22px rgba(234,67,53,.11) !important;
}

html body .hero:not(#top15) .hero-cta .hero-btn:hover,
html body .hero:not(#top15) .hero-cta .music-btn:hover,
html body .hero:not(#top15) .hero-cta .hero-btn:focus-visible,
html body .hero:not(#top15) .hero-cta .music-btn:focus-visible {
  border-color: rgba(255,255,255,.40) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.30),
    inset 0 -1px 0 rgba(255,255,255,.075),
    0 18px 44px rgba(0,0,0,.34),
    0 0 34px rgba(39,128,255,.20),
    0 0 28px rgba(255,45,73,.14) !important;
}

@keyframes scslHeroGlassSweep {
  0%, 46%, 100% { transform: translateX(-42%); opacity: .34; }
  62% { transform: translateX(42%); opacity: .68; }
}

/* Final v4.0 wet-glass hero button finish: shinier surface only. */
html body .hero:not(#top15) .hero-cta .hero-btn,
html body .hero:not(#top15) .hero-cta .music-btn {
  border-color: rgba(241, 247, 255, .36) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.42) contrast(1.04) !important;
  backdrop-filter: blur(22px) saturate(1.42) contrast(1.04) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.36),
    inset 0 10px 22px rgba(255,255,255,.060),
    inset 0 -10px 18px rgba(0,0,0,.20),
    0 16px 42px rgba(0,0,0,.34),
    0 0 28px rgba(39,128,255,.17),
    0 0 24px rgba(255,45,73,.11) !important;
}

html body .hero:not(#top15) .hero-cta .hero-btn-primary.hero-btn-primary {
  background:
    radial-gradient(ellipse at 18% 12%, rgba(255,255,255,.48), transparent 24%),
    radial-gradient(circle at 11% 76%, rgba(255,24,68,.72), transparent 42%),
    radial-gradient(circle at 92% 18%, rgba(56,145,255,.72), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.045) 34%, rgba(31,12,42,.22) 64%, rgba(255,255,255,.075)),
    linear-gradient(112deg, #ff244f 0%, #d31f65 34%, #4d55ef 68%, #1174ff 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.48),
    inset 0 11px 18px rgba(255,255,255,.075),
    inset 0 -12px 22px rgba(0,0,0,.22),
    0 18px 46px rgba(0,0,0,.36),
    0 0 34px rgba(255,45,73,.30),
    0 0 38px rgba(39,128,255,.30) !important;
}

html body .hero:not(#top15) .hero-cta .hero-btn-ghost.hero-btn-ghost,
html body .hero:not(#top15) .hero-cta #legacyIntroBtn.legacy-intro-btn,
html body .hero:not(#top15) .hero-cta #musicToggle.music-btn {
  background:
    radial-gradient(ellipse at 18% 13%, rgba(255,255,255,.30), transparent 25%),
    radial-gradient(circle at 14% 82%, rgba(255,45,73,.24), transparent 38%),
    radial-gradient(circle at 92% 18%, rgba(39,128,255,.30), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.145), rgba(255,255,255,.038) 38%, rgba(0,0,0,.30) 72%, rgba(255,255,255,.055)),
    rgba(5, 10, 23, .84) !important;
}

html body .hero:not(#top15) .hero-cta .hero-btn-gemini.hero-btn-gemini {
  background:
    radial-gradient(ellipse at 20% 14%, rgba(255,255,255,.32), transparent 25%),
    radial-gradient(circle at 20% 78%, rgba(234,67,53,.30), transparent 36%),
    radial-gradient(circle at 87% 20%, rgba(66,133,244,.42), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.15), rgba(255,255,255,.040) 38%, rgba(0,0,0,.30) 72%, rgba(255,255,255,.060)),
    rgba(4, 11, 25, .86) !important;
}

html body .hero:not(#top15) .hero-cta .hero-btn::before,
html body .hero:not(#top15) .hero-cta .music-btn::before {
  background:
    radial-gradient(ellipse at 19% 18%, rgba(255,255,255,.48), transparent 23%),
    linear-gradient(180deg, rgba(255,255,255,.40), rgba(255,255,255,.095) 33%, rgba(255,255,255,0) 56%),
    linear-gradient(108deg, transparent 0%, transparent 30%, rgba(255,255,255,.42) 46%, transparent 62%) !important;
  opacity: .76 !important;
  animation: scslHeroWetGlint 3.7s ease-in-out infinite !important;
}

html body .hero:not(#top15) .hero-cta .hero-btn::after,
html body .hero:not(#top15) .hero-cta .music-btn::after {
  inset: auto 18px 6px !important;
  height: 3px !important;
  background: linear-gradient(90deg, transparent, rgba(255,45,73,.92), rgba(255,255,255,.72), rgba(39,128,255,.95), transparent) !important;
  box-shadow:
    0 0 10px rgba(255,45,73,.30),
    0 0 12px rgba(39,128,255,.32) !important;
  opacity: .88 !important;
}

@keyframes scslHeroWetGlint {
  0%, 44%, 100% { transform: translateX(-54%); opacity: .44; }
  59% { transform: translateX(36%); opacity: .86; }
}

/* Final v4.0 hero type sharpening: metadata only. */
html body .hero .sub.hero-sub,
html body .hero-sub.hero-sub {
  font-family: Rajdhani, "Bebas Neue", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: clamp(17px, 1.8vw, 22px) !important;
  font-weight: 900 !important;
  line-height: 1.12 !important;
  letter-spacing: .045em !important;
  text-transform: uppercase !important;
  color: rgba(246, 249, 255, .96) !important;
  text-rendering: geometricPrecision !important;
  -webkit-font-smoothing: antialiased !important;
  text-shadow:
    0 1px 0 rgba(255,255,255,.07),
    0 10px 20px rgba(0,0,0,.50) !important;
}

html body .hero .hero-chips span {
  font-family: Rajdhani, "Bebas Neue", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: clamp(13px, 1.42vw, 17.5px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: .11em !important;
  color: rgba(226, 234, 247, .86) !important;
  text-transform: uppercase !important;
  text-rendering: geometricPrecision !important;
  -webkit-font-smoothing: antialiased !important;
  text-shadow:
    0 1px 0 rgba(255,255,255,.05),
    0 9px 18px rgba(0,0,0,.46) !important;
}

@media (max-width: 560px) {
  html body .hero .sub.hero-sub,
  html body .hero-sub.hero-sub {
    font-size: 17px !important;
    line-height: 1.10 !important;
    letter-spacing: .040em !important;
  }

  html body .hero .hero-chips span {
    font-size: 14px !important;
    letter-spacing: .10em !important;
  }
}

/* Final v4.0 broadcast hero metadata pass. */
html body .hero .sub.hero-sub,
html body .hero-sub.hero-sub {
  font-family: "Bebas Neue", "Arial Narrow", Impact, Rajdhani, sans-serif !important;
  font-size: clamp(23px, 2.55vw, 35px) !important;
  font-weight: 400 !important;
  line-height: .94 !important;
  letter-spacing: .090em !important;
  text-transform: uppercase !important;
  color: #f7f9ff !important;
  max-width: 760px !important;
  text-rendering: geometricPrecision !important;
  -webkit-font-smoothing: antialiased !important;
  text-shadow:
    0 1px 0 rgba(255,255,255,.16),
    0 0 14px rgba(36,124,255,.16),
    0 12px 22px rgba(0,0,0,.60) !important;
}

html body .hero .hero-chips span {
  font-family: Rajdhani, "Arial Narrow", Inter, sans-serif !important;
  font-size: clamp(14px, 1.42vw, 18px) !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: .135em !important;
  text-transform: uppercase !important;
  color: rgba(234, 240, 252, .90) !important;
  text-rendering: geometricPrecision !important;
  -webkit-font-smoothing: antialiased !important;
}

html body .hero .hero-gemini-credit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: fit-content !important;
  margin: 12px auto 0 !important;
  padding: 5px 11px !important;
  border: 1px solid rgba(185, 207, 255, .18) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)),
    rgba(4, 9, 20, .34) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    0 8px 22px rgba(0,0,0,.24),
    0 0 18px rgba(66,133,244,.10) !important;
  color: rgba(225, 233, 247, .74) !important;
  font-family: Rajdhani, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: clamp(11px, .92vw, 13px) !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: .105em !important;
  text-transform: uppercase !important;
  text-rendering: geometricPrecision !important;
  -webkit-font-smoothing: antialiased !important;
}

html body .hero .hero-gemini-credit-mark {
  display: inline-grid !important;
  place-items: center !important;
  width: 15px !important;
  height: 15px !important;
  border-radius: 999px !important;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,.22), transparent 42%),
    rgba(3, 8, 17, .56) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 0 12px rgba(66,133,244,.20) !important;
}

html body .hero .hero-gemini-credit-mark img {
  display: block !important;
  width: 11px !important;
  height: 11px !important;
  object-fit: contain !important;
}

html body .hero .hero-sub.hero-sub-scoreboard {
  display: grid !important;
  justify-items: center !important;
  gap: 4px !important;
  max-width: min(720px, calc(100vw - 36px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

html body .hero .hero-sub.hero-sub-scoreboard span {
  display: block !important;
  white-space: nowrap !important;
}

html body .hero .hero-sub.hero-sub-scoreboard span:first-child {
  font-family: "Bebas Neue", Impact, "Arial Narrow", Rajdhani, sans-serif !important;
  font-size: clamp(43px, 5.7vw, 74px) !important;
  font-weight: 400 !important;
  line-height: .84 !important;
  letter-spacing: .040em !important;
  color: #fff !important;
}

html body .hero .hero-sub.hero-sub-scoreboard span:last-child {
  font-family: "Bebas Neue", Impact, "Arial Narrow", Rajdhani, sans-serif !important;
  font-size: clamp(33px, 4.35vw, 58px) !important;
  font-weight: 400 !important;
  line-height: .86 !important;
  letter-spacing: .055em !important;
  color: rgba(235, 242, 255, .92) !important;
}

@media (max-width: 560px) {
  html body .hero .sub.hero-sub,
  html body .hero-sub.hero-sub {
    font-size: clamp(22px, 6.35vw, 28px) !important;
    line-height: .94 !important;
    letter-spacing: .080em !important;
    max-width: 350px !important;
  }

  html body .hero .hero-chips span {
    font-size: 14px !important;
    letter-spacing: .12em !important;
  }

  html body .hero .hero-gemini-credit {
    margin-top: 10px !important;
    font-size: 11px !important;
    letter-spacing: .095em !important;
  }

  html body .hero .hero-sub.hero-sub-scoreboard {
    gap: 5px !important;
    max-width: 354px !important;
  }

  html body .hero .hero-sub.hero-sub-scoreboard span:first-child {
    font-size: clamp(38px, 10.8vw, 44px) !important;
    letter-spacing: .036em !important;
  }

  html body .hero .hero-sub.hero-sub-scoreboard span:last-child {
    font-size: clamp(30px, 8.6vw, 36px) !important;
    letter-spacing: .044em !important;
  }
}

/* Final v4.0 launch polish: remove stray mobile divider above the first Top 15 card. */
@media (max-width: 700px) {
  html body #top15 .section-head::after {
    display: none !important;
    content: none !important;
  }
}

/* Final v4.0 launch polish: mobile drawer should hug content, not leave a dead panel tail. */
@media (max-width: 700px) {
  html body .site-mobile-drawer,
  html body.site-menu-open .site-mobile-drawer:not([hidden]) {
    bottom: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100svh - 92px) !important;
    overflow-y: auto !important;
    padding-bottom: clamp(18px, 4vh, 30px) !important;
  }
}

/* Final v4.0 launch polish: smaller stat-number shine so the numbers stay crisp. */
html body.stat-vault-page #statsfacts .scsl-fact-metric::before {
  inset: 1px 1px auto 1px !important;
  width: auto !important;
  height: 24% !important;
  opacity: .24 !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.024) 48%, rgba(255,255,255,0) 100%),
    linear-gradient(90deg, rgba(0,0,0,0), rgba(91,184,255,.026), rgba(0,0,0,0)) !important;
}

html body.stat-vault-page .scsl-fact-metric::after,
html body.stat-vault-page .db-stat::after {
  left: 42px !important;
  right: 42px !important;
  bottom: 11px !important;
  opacity: .22 !important;
  background: linear-gradient(90deg, rgba(255,45,73,.34), rgba(29,125,255,.38)) !important;
}

/* Final v4.0 Stat Vault layout repair: desktop and mobile are tuned separately. */
html body.stat-vault-page main {
  width: 100% !important;
  padding-inline: clamp(14px, 2.8vw, 34px) !important;
  box-sizing: border-box !important;
  overflow-x: clip !important;
}

html body.stat-vault-page #database.panel.stat-vault-screen {
  width: min(1120px, calc(100vw - 32px)) !important;
  max-width: min(1120px, calc(100vw - 32px)) !important;
  margin: 8px auto 34px !important;
  padding: clamp(26px, 3vw, 34px) !important;
  border-radius: clamp(22px, 2vw, 28px) !important;
  box-sizing: border-box !important;
}

html body.stat-vault-page .stat-vault-head {
  width: 100% !important;
  max-width: 920px !important;
  gap: 13px !important;
  margin: 0 0 18px !important;
  padding: 0 0 18px !important;
  border-bottom: 1px solid rgba(216, 224, 234, .12) !important;
}

html body.stat-vault-page .stat-vault-head h2 {
  font-size: clamp(50px, 5vw, 76px) !important;
  line-height: .84 !important;
}

html body.stat-vault-page .stat-vault-head > p {
  max-width: 720px !important;
  color: rgba(232, 238, 248, .78) !important;
  font-size: clamp(15px, 1.15vw, 17px) !important;
  line-height: 1.46 !important;
}

html body.stat-vault-page .hero-cta.hero-cta-vault {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  width: 100% !important;
  max-width: 100% !important;
  gap: 10px !important;
  margin: 0 0 clamp(26px, 3.4vw, 42px) !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

html body.stat-vault-page .hero-cta.hero-cta-vault .hero-btn,
html body.stat-vault-page .hero-cta.hero-cta-vault .music-btn,
html body.stat-vault-page .hero-cta.hero-cta-vault #musicToggle {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 48px !important;
  height: 48px !important;
  padding: 0 14px !important;
  box-sizing: border-box !important;
}

html body.stat-vault-page #statsfacts.stat-vault-index-panel {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto clamp(26px, 3vw, 36px) !important;
  padding: clamp(22px, 2.5vw, 30px) !important;
  border-radius: clamp(20px, 1.8vw, 26px) !important;
  box-sizing: border-box !important;
}

html body.stat-vault-page #statsfacts .stats-facts-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  justify-items: start !important;
  align-items: start !important;
  gap: 10px !important;
  margin: 0 0 18px !important;
  padding-bottom: 16px !important;
  text-align: left !important;
}

html body.stat-vault-page #statsfacts .stats-facts-head h2 {
  max-width: 760px !important;
  font-size: clamp(42px, 3.7vw, 58px) !important;
  line-height: .88 !important;
  text-align: left !important;
}

html body.stat-vault-page #statsfacts .stats-facts-head p {
  display: block !important;
  justify-self: start !important;
  max-width: 690px !important;
  color: rgba(232,238,248,.76) !important;
  font-size: clamp(14px, 1vw, 16px) !important;
  line-height: 1.45 !important;
  text-align: left !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-console {
  gap: 14px !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-metrics {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
}

html body.stat-vault-page #statsfacts .scsl-fact-metric {
  min-width: 0 !important;
  min-height: 96px !important;
  padding: 15px 14px !important;
  border-radius: 17px !important;
  align-content: center !important;
}

html body.stat-vault-page #statsfacts .scsl-fact-metric strong {
  font-size: clamp(36px, 3.5vw, 50px) !important;
}

html body.stat-vault-page #statsfacts .scsl-fact-metric span {
  font-size: 9.8px !important;
  line-height: 1.08 !important;
}

html body.stat-vault-page #statsfacts .scsl-fact-metric em {
  font-size: 8.8px !important;
  line-height: 1.08 !important;
}

html body.stat-vault-page #statsfacts .stat-vault-index-story,
html body.stat-vault-page #statsfacts .scsl-facts-story-card {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  border-radius: 21px !important;
  box-sizing: border-box !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 12px !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-tabs::-webkit-scrollbar {
  display: none !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-tabs button {
  flex: 0 0 auto !important;
  min-width: max-content !important;
  min-height: 36px !important;
  padding: 0 14px !important;
  scroll-snap-align: start !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-pane.active {
  gap: 13px !important;
  padding: clamp(18px, 2.1vw, 25px) !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-pane h4 {
  max-width: 780px !important;
  font-size: clamp(31px, 2.7vw, 43px) !important;
  line-height: .93 !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-pane p {
  max-width: 740px !important;
  line-height: 1.47 !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-receipts {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: clamp(26px, 3vw, 38px) !important;
}

@media (min-width: 761px) and (max-width: 1100px) {
  html body.stat-vault-page #statsfacts .scsl-facts-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric:nth-child(4),
  html body.stat-vault-page #statsfacts .scsl-fact-metric:nth-child(5) {
    grid-column: span 1 !important;
  }
}

@media (max-width: 700px) {
  html body.stat-vault-page main {
    padding-inline: 10px !important;
  }

  html body.stat-vault-page #database.panel.stat-vault-screen {
    width: min(100%, calc(100vw - 20px)) !important;
    max-width: min(100%, calc(100vw - 20px)) !important;
    margin: 8px auto 24px !important;
    padding: 14px 12px 16px !important;
    border-radius: 20px !important;
  }

  html body.stat-vault-page .stat-vault-head {
    gap: 10px !important;
    margin-bottom: 14px !important;
    padding-bottom: 14px !important;
  }

  html body.stat-vault-page .stat-vault-head h2 {
    font-size: clamp(38px, 12.2vw, 48px) !important;
    line-height: .86 !important;
    letter-spacing: .045em !important;
  }

  html body.stat-vault-page .stat-vault-head > p {
    font-size: 14px !important;
    line-height: 1.42 !important;
  }

  html body.stat-vault-page .hero-cta.hero-cta-vault {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px !important;
    margin-bottom: 22px !important;
  }

  html body.stat-vault-page .hero-cta.hero-cta-vault .hero-btn {
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 9px !important;
    font-size: 10.5px !important;
    letter-spacing: .085em !important;
  }

  html body.stat-vault-page .hero-cta.hero-cta-vault .music-btn,
  html body.stat-vault-page .hero-cta.hero-cta-vault #musicToggle {
    grid-column: 1 / -1 !important;
    min-height: 43px !important;
    height: 43px !important;
  }

  html body.stat-vault-page #statsfacts.stat-vault-index-panel {
    padding: 14px !important;
    border-radius: 18px !important;
    margin-bottom: 22px !important;
  }

  html body.stat-vault-page #statsfacts .stats-facts-head {
    gap: 8px !important;
    margin-bottom: 13px !important;
    padding-bottom: 13px !important;
  }

  html body.stat-vault-page #statsfacts .stats-facts-head h2 {
    font-size: clamp(36px, 11vw, 44px) !important;
    line-height: .88 !important;
  }

  html body.stat-vault-page #statsfacts .stats-facts-head p {
    display: block !important;
    font-size: 13px !important;
    line-height: 1.38 !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-console {
    gap: 11px !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric {
    min-height: 74px !important;
    padding: 12px !important;
    border-radius: 15px !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric:nth-child(5) {
    grid-column: 1 / -1 !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric strong {
    font-size: clamp(30px, 8.7vw, 37px) !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric span {
    font-size: 8.8px !important;
    letter-spacing: .10em !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric em {
    font-size: 8px !important;
    letter-spacing: .085em !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-tabs {
    margin-inline: -2px !important;
    padding: 10px !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-tabs button {
    min-height: 35px !important;
    padding: 0 13px !important;
    font-size: 9.5px !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-pane.active {
    padding: 14px !important;
    gap: 10px !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-pane h4 {
    font-size: clamp(25px, 7.5vw, 31px) !important;
    line-height: .95 !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-pane p {
    font-size: 12.8px !important;
    line-height: 1.42 !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-receipts {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-receipts span {
    min-height: 58px !important;
    padding: 9px 8px !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-receipts strong {
    font-size: clamp(22px, 6.8vw, 28px) !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-receipts em {
    font-size: 7.7px !important;
    letter-spacing: .08em !important;
  }
}

@media (max-width: 360px) {
  html body.stat-vault-page #statsfacts .scsl-facts-receipts {
    grid-template-columns: 1fr !important;
  }
}

/* Final v4.0 Gemini ad-glow system: louder, glossy, and still controlled. */
html body .hero-btn-gemini,
html body .site-drawer-gemini-link,
html body .legacy-gpt-submit,
html body .scsl-facts-ask-submit,
html body #askAiDrawer .askai-send,
html body #askAiBubble.askai-bubble,
html body .askai-bubble.askai-bubble {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  border-color: rgba(255,255,255,.38) !important;
  background:
    radial-gradient(ellipse at 18% 10%, rgba(255,255,255,.40), transparent 25%),
    radial-gradient(circle at 17% 78%, rgba(234,67,53,.58), transparent 38%),
    radial-gradient(circle at 78% 18%, rgba(66,133,244,.64), transparent 42%),
    radial-gradient(circle at 86% 88%, rgba(52,168,83,.42), transparent 36%),
    linear-gradient(115deg, #ff244f 0%, #d72a76 33%, #4e62ff 68%, #19a1ff 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.52),
    inset 0 12px 22px rgba(255,255,255,.105),
    inset 0 -13px 22px rgba(0,0,0,.24),
    0 16px 42px rgba(0,0,0,.34),
    0 0 34px rgba(255,45,73,.34),
    0 0 46px rgba(66,133,244,.38),
    0 0 30px rgba(52,168,83,.18) !important;
  animation: scslGeminiAdBeacon 1.65s ease-in-out infinite !important;
}

html body .hero-btn-gemini > *,
html body .site-drawer-gemini-link > *,
html body .legacy-gpt-submit > *,
html body .scsl-facts-ask-submit > *,
html body #askAiDrawer .askai-send > *,
html body #askAiBubble.askai-bubble > *,
html body .askai-bubble.askai-bubble > * {
  position: relative !important;
  z-index: 2 !important;
}

html body .hero-btn-gemini::before,
html body .site-drawer-gemini-link::before,
html body .legacy-gpt-submit::before,
html body .scsl-facts-ask-submit::before,
html body #askAiDrawer .askai-send::before,
html body #askAiBubble.askai-bubble::before,
html body .askai-bubble.askai-bubble::before {
  content: "" !important;
  position: absolute !important;
  inset: 1px !important;
  z-index: 1 !important;
  display: block !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.46), rgba(255,255,255,.105) 36%, rgba(255,255,255,0) 60%),
    linear-gradient(106deg, transparent 0%, transparent 30%, rgba(255,255,255,.48) 47%, transparent 64%) !important;
  opacity: .76 !important;
  transform: translateX(-116%) !important;
  animation: scslGeminiAdSweep 2.05s ease-in-out infinite !important;
}

html body .hero-btn-gemini::after,
html body .site-drawer-gemini-link::after,
html body .legacy-gpt-submit::after,
html body .scsl-facts-ask-submit::after,
html body #askAiDrawer .askai-send::after {
  content: "" !important;
  position: absolute !important;
  left: 16px !important;
  right: 16px !important;
  bottom: 6px !important;
  z-index: 1 !important;
  display: block !important;
  height: 3px !important;
  border-radius: 999px !important;
  pointer-events: none !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.82), rgba(66,133,244,.96), rgba(52,168,83,.82), transparent) !important;
  box-shadow:
    0 0 12px rgba(66,133,244,.42),
    0 0 14px rgba(52,168,83,.28) !important;
  opacity: .92 !important;
}

html body.stat-vault-page #legacyScoreGpt .legacy-gpt-prompt,
html body #statsfacts .scsl-facts-prompts a,
html body #statsfacts .scsl-facts-ask-chips a,
html body #statsfacts .scsl-facts-ask-prompts a {
  border-color: rgba(138,189,255,.26) !important;
  background:
    radial-gradient(circle at 20% 14%, rgba(255,255,255,.14), transparent 32%),
    linear-gradient(135deg, rgba(234,67,53,.15), rgba(66,133,244,.16) 56%, rgba(52,168,83,.12)),
    rgba(5, 9, 20, .70) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 10px 24px rgba(0,0,0,.22),
    0 0 20px rgba(66,133,244,.13),
    0 0 18px rgba(234,67,53,.08) !important;
  animation: scslGeminiChipBeacon 2.75s ease-in-out infinite !important;
}

@keyframes scslGeminiAdBeacon {
  0%, 100% {
    filter: saturate(1.04) brightness(1);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.48),
      inset 0 12px 22px rgba(255,255,255,.095),
      inset 0 -13px 22px rgba(0,0,0,.24),
      0 16px 42px rgba(0,0,0,.34),
      0 0 30px rgba(255,45,73,.30),
      0 0 42px rgba(66,133,244,.34),
      0 0 28px rgba(52,168,83,.16);
  }
  50% {
    filter: saturate(1.30) brightness(1.09);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.64),
      inset 0 13px 24px rgba(255,255,255,.14),
      inset 0 -13px 22px rgba(0,0,0,.22),
      0 18px 48px rgba(0,0,0,.38),
      0 0 46px rgba(255,45,73,.48),
      0 0 60px rgba(66,133,244,.54),
      0 0 38px rgba(52,168,83,.27);
  }
}

@keyframes scslGeminiAdSweep {
  0%, 44%, 100% { transform: translateX(-116%); opacity: .40; }
  57% { transform: translateX(116%); opacity: .90; }
}

@keyframes scslGeminiChipBeacon {
  0%, 100% {
    filter: saturate(1) brightness(1);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.14),
      0 10px 24px rgba(0,0,0,.22),
      0 0 16px rgba(66,133,244,.10),
      0 0 14px rgba(234,67,53,.06);
  }
  50% {
    filter: saturate(1.14) brightness(1.04);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.20),
      0 12px 28px rgba(0,0,0,.26),
      0 0 26px rgba(66,133,244,.18),
      0 0 22px rgba(234,67,53,.12);
  }
}

@media (prefers-reduced-motion: reduce) {
  html body .hero-btn-gemini,
  html body .site-drawer-gemini-link,
  html body .legacy-gpt-submit,
  html body .scsl-facts-ask-submit,
  html body #askAiDrawer .askai-send,
  html body #askAiBubble.askai-bubble,
  html body .askai-bubble.askai-bubble,
  html body.stat-vault-page #legacyScoreGpt .legacy-gpt-prompt,
  html body #statsfacts .scsl-facts-prompts a,
  html body #statsfacts .scsl-facts-ask-chips a,
  html body #statsfacts .scsl-facts-ask-prompts a,
  html body .hero-btn-gemini::before,
  html body .site-drawer-gemini-link::before,
  html body .legacy-gpt-submit::before,
  html body .scsl-facts-ask-submit::before,
  html body #askAiDrawer .askai-send::before,
  html body #askAiBubble.askai-bubble::before,
  html body .askai-bubble.askai-bubble::before {
    animation: none !important;
  }
}

/* Final v4.0 Stat Vault entry prominence: make the archive easy to find from Home. */
html body:not(.stat-vault-page) .hero .hero-cta .hero-btn-vault.hero-btn-vault {
  border-color: rgba(216, 224, 234, .34) !important;
  color: rgba(250, 252, 255, .98) !important;
  background:
    radial-gradient(ellipse at 18% 12%, rgba(255,255,255,.32), transparent 26%),
    radial-gradient(circle at 12% 82%, rgba(255,45,73,.34), transparent 38%),
    radial-gradient(circle at 90% 18%, rgba(29,125,255,.42), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.145), rgba(255,255,255,.038) 38%, rgba(0,0,0,.30) 72%, rgba(255,255,255,.055)),
    rgba(5, 10, 23, .88) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.32),
    inset 0 -10px 18px rgba(0,0,0,.18),
    0 16px 38px rgba(0,0,0,.32),
    0 0 26px rgba(29,125,255,.18),
    0 0 22px rgba(255,45,73,.13) !important;
}

html body:not(.stat-vault-page) .site-page-tab[href*="stat-vault"],
html body:not(.stat-vault-page) .site-drawer-vault-link {
  border-color: rgba(216, 224, 234, .24) !important;
  background:
    radial-gradient(circle at 16% 0%, rgba(255,45,73,.16), transparent 36%),
    radial-gradient(circle at 100% 100%, rgba(29,125,255,.18), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.074), rgba(255,255,255,.020)),
    rgba(5, 9, 20, .76) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 10px 24px rgba(0,0,0,.22),
    0 0 18px rgba(29,125,255,.10) !important;
}

html body .vault-motion-cta .vault-motion-main {
  max-width: 22ch !important;
}

@media (max-width: 700px) {
  html body #askAiBubble.askai-bubble,
  html body .askai-bubble.askai-bubble {
    left: auto !important;
    right: max(14px, env(safe-area-inset-right)) !important;
    transform: none !important;
  }

  html body:not(.stat-vault-page) .hero .hero-cta {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    display: grid !important;
  }

  html body:not(.stat-vault-page) .hero .hero-cta .hero-btn,
  html body:not(.stat-vault-page) .hero .hero-cta .legacy-intro-btn {
    width: 100% !important;
    max-width: none !important;
  }

  html body:not(.stat-vault-page) .hero .hero-cta .legacy-intro-btn {
    grid-column: 1 / -1 !important;
  }
}

/* Final v4.0 safety: Gemini glow must not pull the floating bubble into page flow. */
html body #askAiBubble.askai-bubble,
html body .askai-bubble.askai-bubble {
  position: fixed !important;
  left: auto !important;
  right: max(18px, env(safe-area-inset-right)) !important;
  bottom: calc(18px + env(safe-area-inset-bottom)) !important;
  top: auto !important;
  transform: none !important;
}

@media (max-width: 760px) {
  html body #askAiBubble.askai-bubble,
  html body .askai-bubble.askai-bubble {
    right: max(14px, env(safe-area-inset-right)) !important;
    bottom: calc(14px + env(safe-area-inset-bottom)) !important;
  }

  html body.top15-in-view:not(.askai-open):not(.site-menu-open) #askAiBubble.askai-bubble,
  html body.top15-in-view:not(.askai-open):not(.site-menu-open) .askai-bubble.askai-bubble {
    top: calc(66px + env(safe-area-inset-top)) !important;
    right: max(12px, env(safe-area-inset-right)) !important;
    bottom: auto !important;
    left: auto !important;
  }
}

@media (max-width: 700px) {
  html body.stat-vault-page #statsfacts .scsl-facts-tabs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 7px !important;
    overflow: visible !important;
    padding: 10px !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-tabs button {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 6px !important;
    font-size: 8.4px !important;
    letter-spacing: .075em !important;
  }

  html body.stat-vault-page #statsfacts .scsl-facts-tabs button:nth-child(4) {
    grid-column: span 2 !important;
  }
}

html body.stat-vault-page #statsFactsTitle {
  display: block !important;
  max-width: 100% !important;
  white-space: normal !important;
  text-align: left !important;
}

html body.stat-vault-page #statsFactsTitle > span {
  display: inline !important;
}

html body.stat-vault-page #statsFactsTitle .title-red {
  margin-left: .14em !important;
}

@media (max-width: 700px) {
  html body.stat-vault-page #statsFactsTitle {
    font-size: clamp(35px, 10.5vw, 43px) !important;
    line-height: .88 !important;
    letter-spacing: .042em !important;
  }

  html body.stat-vault-page #statsFactsTitle > span {
    display: block !important;
  }

  html body.stat-vault-page #statsFactsTitle .title-red {
    margin-left: 0 !important;
  }
}

/* Final v4.0 launch correction: Stat Vault desktop alignment, clean Gemini mark, exact menu parity. */
html body #askAiDrawer.askai-drawer[aria-hidden="true"],
html body #askAiDrawer.askai-drawer:not(.is-open) {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translate3d(110vw, 0, 0) scale(.98) !important;
}

html body.askai-open #askAiDrawer.askai-drawer.is-open,
html body #askAiDrawer.askai-drawer.is-open[aria-hidden="false"] {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) scale(1) !important;
}

html body .broadcast-bar .site-menu-toggle.site-menu-toggle,
html body button.site-menu-toggle.site-menu-toggle {
  width: 152px !important;
  min-width: 152px !important;
  height: 42px !important;
  min-height: 42px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 36px !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 14px 0 16px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(216, 224, 234, .34) !important;
  color: rgba(248, 250, 255, .98) !important;
  background:
    radial-gradient(circle at 22% 10%, rgba(255,255,255,.16), transparent 30%),
    linear-gradient(105deg, rgba(229,27,53,.25), rgba(15,93,255,.22)),
    linear-gradient(180deg, rgba(255,255,255,.088), rgba(255,255,255,.026)),
    rgba(5, 8, 18, .80) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 12px 26px rgba(0,0,0,.24),
    0 0 22px rgba(15,93,255,.12) !important;
  transform: none !important;
}

html body .site-menu-toggle-copy {
  justify-self: start !important;
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
  line-height: 1 !important;
}

html body .site-menu-toggle-kicker {
  color: rgba(102,184,255,.90) !important;
  font-family: var(--font-stat, Rajdhani, sans-serif) !important;
  font-size: 9px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

html body .site-menu-toggle-label {
  color: rgba(255,255,255,.98) !important;
  font-family: var(--font-stat, Rajdhani, sans-serif) !important;
  font-size: 20px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  line-height: .95 !important;
  text-transform: uppercase !important;
}

html body .site-menu-toggle-icon {
  justify-self: end !important;
  width: 36px !important;
  min-width: 36px !important;
  height: 28px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(216,224,234,.13) !important;
  border-radius: 12px !important;
  background: rgba(2,5,12,.48) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}

html body.stat-vault-page #statsfacts .scsl-facts-metrics {
  align-items: stretch !important;
}

@media (min-width: 900px) {
  html body.stat-vault-page #statsfacts .scsl-facts-metrics {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 930px !important;
    margin-inline: auto !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric {
    grid-column: span 2 !important;
    min-width: 0 !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric:nth-child(4) {
    grid-column: 2 / span 2 !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric:nth-child(5) {
    grid-column: 4 / span 2 !important;
  }
}

@media (max-width: 899px) {
  html body.stat-vault-page #statsfacts .scsl-facts-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    max-width: none !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric:nth-child(5) {
    grid-column: 1 / -1 !important;
  }
}

html body.stat-vault-page #statsfacts .scsl-fact-metric::before {
  inset: 1px 1px auto 1px !important;
  height: 15% !important;
  opacity: .16 !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.018) 52%, rgba(255,255,255,0) 100%),
    linear-gradient(90deg, rgba(0,0,0,0), rgba(91,184,255,.018), rgba(0,0,0,0)) !important;
}

html body.stat-vault-page .scsl-fact-metric::after,
html body.stat-vault-page .db-stat::after {
  left: 46px !important;
  right: 46px !important;
  bottom: 11px !important;
  height: 1px !important;
  opacity: .18 !important;
  background: linear-gradient(90deg, rgba(255,45,73,.28), rgba(29,125,255,.32)) !important;
}

html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "head"
    "lede"
    "messages"
    "form"
    "prompts" !important;
  gap: 14px !important;
  max-width: 100% !important;
}

html body.stat-vault-page #legacyScoreGpt .legacy-gpt-head {
  grid-area: head !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: center !important;
}

html body.stat-vault-page #legacyScoreGpt .legacy-gpt-badge {
  justify-self: start !important;
  max-width: max-content !important;
}

html body.stat-vault-page #legacyScoreGpt .legacy-gpt-brand {
  grid-template-columns: 44px minmax(0, 1fr) !important;
  align-items: center !important;
}

html body.stat-vault-page #legacyScoreGpt .legacy-gpt-mark {
  width: 44px !important;
  height: 44px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  border-color: rgba(255,255,255,.22) !important;
  background:
    radial-gradient(circle at 31% 24%, rgba(255,255,255,.30), transparent 34%),
    radial-gradient(circle at 24% 78%, rgba(234,67,53,.26), transparent 36%),
    radial-gradient(circle at 78% 24%, rgba(66,133,244,.34), transparent 38%),
    rgba(4, 8, 18, .82) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    0 12px 30px rgba(0,0,0,.30),
    0 0 20px rgba(66,133,244,.20) !important;
}

html body.stat-vault-page #legacyScoreGpt .legacy-gpt-mark img {
  width: 24px !important;
  height: 24px !important;
  object-fit: contain !important;
  filter: saturate(1.14) brightness(1.08) !important;
}

html body.stat-vault-page #legacyScoreGpt .legacy-gpt-lede {
  grid-area: lede !important;
  max-width: 72ch !important;
  line-height: 1.52 !important;
}

html body.stat-vault-page #legacyGptMessages.legacy-gpt-messages {
  grid-area: messages !important;
  min-height: clamp(168px, 18vw, 230px) !important;
  max-height: none !important;
  width: 100% !important;
  max-width: 720px !important;
  margin-inline: auto !important;
}

html body.stat-vault-page #legacyScoreGpt .legacy-gpt-form {
  grid-area: form !important;
  grid-template-columns: minmax(0, 1fr) 96px !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 720px !important;
  margin-inline: auto !important;
}

html body.stat-vault-page #legacyScoreGpt .legacy-gpt-input-shell {
  min-height: 54px !important;
  border-radius: 18px !important;
}

html body.stat-vault-page #legacyScoreGpt .legacy-gpt-input {
  font-size: 15px !important;
  line-height: 1.25 !important;
}

html body.stat-vault-page #legacyScoreGpt .legacy-gpt-prompts {
  grid-area: prompts !important;
  grid-template-columns: repeat(3, minmax(128px, 1fr)) !important;
  width: 100% !important;
  max-width: 720px !important;
  margin-inline: auto !important;
}

@media (max-width: 760px) {
  html body .broadcast-bar .site-menu-toggle.site-menu-toggle,
  html body button.site-menu-toggle.site-menu-toggle {
    width: 112px !important;
    min-width: 112px !important;
    height: 38px !important;
    min-height: 38px !important;
    grid-template-columns: minmax(0, 1fr) 30px !important;
    gap: 7px !important;
    padding: 0 8px 0 11px !important;
  }

  html body .site-menu-toggle-label {
    font-size: 12px !important;
    letter-spacing: .12em !important;
  }

  html body .site-menu-toggle-icon {
    width: 30px !important;
    min-width: 30px !important;
    height: 24px !important;
  }

  html body.stat-vault-page #legacyScoreGpt .legacy-gpt-form {
    grid-template-columns: minmax(0, 1fr) 68px !important;
    max-width: none !important;
  }

  html body.stat-vault-page #legacyScoreGpt .legacy-gpt-prompts {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    max-width: none !important;
  }

  html body.stat-vault-page #legacyGptMessages.legacy-gpt-messages {
    max-width: none !important;
  }
}

/* Final v4.0 menu architecture hard lock: identical computed button on Home and Stat Vault. */
html body .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"],
html body.stat-vault-page .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] {
  width: 152px !important;
  min-width: 152px !important;
  height: 42px !important;
  min-height: 42px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 36px !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 14px 0 16px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(216, 224, 234, .34) !important;
  background:
    radial-gradient(circle at 22% 10%, rgba(255,255,255,.16), transparent 30%),
    linear-gradient(105deg, rgba(229,27,53,.25), rgba(15,93,255,.22)),
    linear-gradient(180deg, rgba(255,255,255,.088), rgba(255,255,255,.026)),
    rgba(5, 8, 18, .80) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 12px 26px rgba(0,0,0,.24),
    0 0 22px rgba(15,93,255,.12) !important;
}

html body .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-label.site-menu-toggle-label,
html body.stat-vault-page .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-label.site-menu-toggle-label {
  font-size: 20px !important;
  letter-spacing: 0 !important;
  line-height: .95 !important;
}

html body .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-icon.site-menu-toggle-icon,
html body.stat-vault-page .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-icon.site-menu-toggle-icon {
  width: 36px !important;
  min-width: 36px !important;
  height: 28px !important;
  min-height: 28px !important;
  border-radius: 12px !important;
}

@media (max-width: 760px) {
  html body .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"],
  html body.stat-vault-page .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] {
    width: 112px !important;
    min-width: 112px !important;
    height: 38px !important;
    min-height: 38px !important;
    grid-template-columns: minmax(0, 1fr) 30px !important;
  }

  html body .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-label.site-menu-toggle-label,
  html body.stat-vault-page .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-label.site-menu-toggle-label {
    font-size: 12px !important;
    letter-spacing: .12em !important;
  }

  html body .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-icon.site-menu-toggle-icon,
  html body.stat-vault-page .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-icon.site-menu-toggle-icon {
    width: 30px !important;
    min-width: 30px !important;
    height: 24px !important;
    min-height: 24px !important;
  }
}

/* Final v4.0 Stat Vault containment: keep Ask Archive copy and controls off the right edge. */
html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full #legacyGptMessages.legacy-gpt-messages,
html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full #legacyGptForm.legacy-gpt-form,
html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full .legacy-gpt-prompts {
  width: min(100%, 720px) !important;
  max-width: 720px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full #legacyGptForm.legacy-gpt-form {
  grid-template-columns: minmax(0, 1fr) 92px !important;
}

html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full .legacy-gpt-prompt {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
}

@media (max-width: 760px) {
  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full #legacyGptMessages.legacy-gpt-messages,
  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full #legacyGptForm.legacy-gpt-form,
  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full .legacy-gpt-prompts {
    width: 100% !important;
    max-width: none !important;
  }

  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full #legacyGptForm.legacy-gpt-form {
    grid-template-columns: minmax(0, 1fr) 68px !important;
  }
}

/* Final v4.0 Stat Vault parent lane: prevent the page container from clipping the panel. */
html body.stat-vault-page main {
  width: 100% !important;
  max-width: 1188px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

html body.stat-vault-page #database.panel.stat-vault-screen {
  width: 100% !important;
  max-width: 1120px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.stat-vault-page #statsfacts.stats-facts-panel,
html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full {
  width: 100% !important;
  max-width: 100% !important;
}

@media (max-width: 760px) {
  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full #legacyGptForm.legacy-gpt-form {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
  }

  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full #legacyGptForm .legacy-gpt-input-shell {
    width: 100% !important;
    min-width: 0 !important;
  }

  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full #legacyGptSubmit.legacy-gpt-submit {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 48px !important;
    min-height: 48px !important;
    justify-self: stretch !important;
  }
}

/* Final v4.0 global menu parity: one shared menu bar, icon, and drawer language. */
html body .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-icon.site-menu-toggle-icon {
  display: grid !important;
  grid-template-rows: repeat(2, 4px) !important;
  align-content: center !important;
  justify-items: center !important;
  gap: 5px !important;
}

html body .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-icon.site-menu-toggle-icon span {
  display: block !important;
  position: relative !important;
  inset: auto !important;
  width: 20px !important;
  height: 4px !important;
  min-height: 4px !important;
  opacity: 1 !important;
  visibility: visible !important;
  border-radius: 999px !important;
  transform: none !important;
  background: linear-gradient(90deg, #ff2d49 0%, #ff3a62 48%, #58c0ff 52%, #1d7dff 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.35),
    0 0 12px rgba(88,192,255,.22) !important;
}

html body .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-icon.site-menu-toggle-icon span:last-child {
  width: 18px !important;
}

html body.site-menu-open .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-icon.site-menu-toggle-icon span {
  transform: none !important;
}

@media (max-width: 760px) {
  html body .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-icon.site-menu-toggle-icon {
    grid-template-rows: repeat(2, 4px) !important;
    gap: 4px !important;
  }

  html body .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-icon.site-menu-toggle-icon span {
    width: 19px !important;
  }

  html body .broadcast-bar button.site-menu-toggle.site-menu-toggle[aria-controls="siteMobileDrawer"] .site-menu-toggle-icon.site-menu-toggle-icon span:last-child {
    width: 17px !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-mobile-drawer-nav {
    gap: 13px !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-drawer-link {
    min-height: 54px !important;
    border-radius: 18px !important;
    font-size: 19px !important;
    font-weight: 950 !important;
    letter-spacing: .01em !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.024)),
      rgba(5, 9, 20, .68) !important;
    border: 1px solid rgba(216,224,234,.16) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.12),
      0 10px 26px rgba(0,0,0,.22) !important;
    color: rgba(247,249,255,.94) !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-drawer-link.is-active {
    background:
      radial-gradient(circle at 18% 16%, rgba(255,255,255,.16), transparent 28%),
      linear-gradient(135deg, rgba(255,35,69,.92), rgba(29,125,255,.88)) !important;
    border-color: rgba(255,255,255,.22) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.22),
      0 16px 34px rgba(29,125,255,.18),
      0 12px 32px rgba(255,45,73,.14) !important;
    color: #fff !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-drawer-gemini-link {
    background:
      radial-gradient(circle at 23% 18%, rgba(66,133,244,.18), transparent 36%),
      radial-gradient(circle at 72% 78%, rgba(52,168,83,.10), transparent 40%),
      linear-gradient(90deg, rgba(234,67,53,.18), rgba(66,133,244,.16)),
      linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.024)),
      rgba(5, 8, 18, .78) !important;
    border-color: rgba(216,224,234,.18) !important;
  }

  html body.site-menu-open .site-mobile-drawer:not([hidden]) .site-drawer-close {
    min-width: 66px !important;
    height: 36px !important;
    border-radius: 18px !important;
  }
}

/* Final v4.0 floating Gemini mark lock: the corner bot must read as Gemini, not a generic orb. */
html body #askAiBubble.askai-bubble,
html body .askai-bubble.askai-bubble {
  width: 64px !important;
  height: 64px !important;
  min-width: 64px !important;
  min-height: 64px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(216,224,234,.30) !important;
  background:
    radial-gradient(circle at 32% 20%, rgba(255,255,255,.30), transparent 28%),
    radial-gradient(circle at 18% 76%, rgba(234,67,53,.30), transparent 36%),
    radial-gradient(circle at 78% 24%, rgba(66,133,244,.36), transparent 38%),
    radial-gradient(circle at 72% 80%, rgba(52,168,83,.20), transparent 36%),
    rgba(4, 8, 18, .86) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 -12px 22px rgba(0,0,0,.22),
    0 18px 42px rgba(0,0,0,.34),
    0 0 24px rgba(66,133,244,.30),
    0 0 28px rgba(234,67,53,.18) !important;
}

html body #askAiBubble.askai-bubble::before,
html body .askai-bubble.askai-bubble::before {
  inset: 2px !important;
  z-index: 0 !important;
  border-radius: inherit !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.26), rgba(255,255,255,.075) 42%, transparent 64%),
    linear-gradient(108deg, transparent 0%, transparent 34%, rgba(255,255,255,.28) 49%, transparent 66%) !important;
  opacity: .58 !important;
  transform: translateX(-120%) !important;
}

html body #askAiBubble .askai-bubble-ring,
html body .askai-bubble .askai-bubble-ring {
  position: absolute !important;
  inset: -3px !important;
  z-index: 0 !important;
  border-radius: inherit !important;
  border: 1px solid rgba(88,192,255,.26) !important;
  background: transparent !important;
  box-shadow:
    0 0 18px rgba(66,133,244,.22),
    0 0 22px rgba(234,67,53,.12) !important;
  opacity: .95 !important;
}

html body #askAiBubble .askai-bubble-face,
html body .askai-bubble .askai-bubble-face {
  position: relative !important;
  z-index: 3 !important;
  width: 44px !important;
  height: 44px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  overflow: visible !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.08), transparent 56%),
    rgba(2, 5, 12, .36) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 0 16px rgba(66,133,244,.18) !important;
}

html body #askAiBubble .askai-bubble-gemini,
html body .askai-bubble .askai-bubble-gemini {
  width: 36px !important;
  height: 36px !important;
  max-width: 36px !important;
  max-height: 36px !important;
  object-fit: contain !important;
  opacity: 1 !important;
  transform: none !important;
  filter:
    drop-shadow(0 0 7px rgba(66,133,244,.34))
    drop-shadow(0 0 5px rgba(52,168,83,.18)) !important;
}

@media (max-width: 760px) {
  html body #askAiBubble.askai-bubble,
  html body .askai-bubble.askai-bubble {
    width: 60px !important;
    height: 60px !important;
    min-width: 60px !important;
    min-height: 60px !important;
  }

  html body #askAiBubble .askai-bubble-face,
  html body .askai-bubble .askai-bubble-face {
    width: 42px !important;
    height: 42px !important;
  }

  html body #askAiBubble .askai-bubble-gemini,
  html body .askai-bubble .askai-bubble-gemini {
    width: 35px !important;
    height: 35px !important;
    max-width: 35px !important;
    max-height: 35px !important;
  }
}

/* Final v4.0 Home hero CTA layout: no orphan half-row Gemini button. */
html body:not(.stat-vault-page) .hero .hero-cta {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  justify-content: center !important;
  align-items: center !important;
}

html body:not(.stat-vault-page) .hero .hero-cta .hero-btn-primary,
html body:not(.stat-vault-page) .hero .hero-cta .hero-btn-vault {
  grid-column: auto !important;
  width: 100% !important;
  justify-self: stretch !important;
}

html body:not(.stat-vault-page) .hero .hero-cta .hero-btn-gemini.hero-btn-gemini {
  grid-column: 1 / -1 !important;
  width: min(100%, 430px) !important;
  justify-self: center !important;
}

html body:not(.stat-vault-page) .hero .hero-cta #legacyIntroBtn.legacy-intro-btn,
html body:not(.stat-vault-page) .hero .hero-cta #musicToggle.music-btn {
  grid-column: 1 / -1 !important;
  justify-self: center !important;
}

@media (max-width: 760px) {
  html body:not(.stat-vault-page) .hero .hero-cta {
    gap: 9px !important;
  }

html body:not(.stat-vault-page) .hero .hero-cta .hero-btn-gemini.hero-btn-gemini,
  html body:not(.stat-vault-page) .hero .hero-cta #legacyIntroBtn.legacy-intro-btn,
  html body:not(.stat-vault-page) .hero .hero-cta #musicToggle.music-btn {
    width: min(100%, 318px) !important;
  }
}

/* Final v4.0 Stat Vault fine pass: keep the tiles wet, but stop the shine from overpowering the numbers. */
html body.stat-vault-page #statsfacts .scsl-fact-metric {
  overflow: hidden !important;
  isolation: isolate !important;
}

html body.stat-vault-page #statsfacts .scsl-fact-metric::before {
  inset: 1px 1px auto 1px !important;
  height: 11% !important;
  opacity: .10 !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.014) 56%, rgba(255,255,255,0)) !important;
  pointer-events: none !important;
}

html body.stat-vault-page #statsfacts .scsl-fact-metric::after,
html body.stat-vault-page .db-stat::after {
  left: max(52px, 22%) !important;
  right: max(52px, 22%) !important;
  bottom: 10px !important;
  height: 1px !important;
  opacity: .13 !important;
  background: linear-gradient(90deg, rgba(255,45,73,.24), rgba(29,125,255,.28)) !important;
  pointer-events: none !important;
}

html body.stat-vault-page #statsfacts .scsl-fact-metric strong {
  text-shadow:
    0 1px 0 rgba(255,255,255,.10),
    0 0 8px rgba(91,184,255,.18) !important;
}

@media (max-width: 700px) {
  html body.stat-vault-page #database.panel.stat-vault-screen {
    padding: 14px 12px 18px !important;
  }

  html body.stat-vault-page .stat-vault-head > p {
    font-size: 13.5px !important;
    line-height: 1.40 !important;
  }

  html body.stat-vault-page #statsfacts.stat-vault-index-panel {
    padding: 13px !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric {
    min-height: 72px !important;
    padding: 11px 12px !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric strong {
    font-size: clamp(29px, 8.2vw, 35px) !important;
    line-height: .86 !important;
  }

  html body.stat-vault-page #statsfacts .scsl-fact-metric::after,
  html body.stat-vault-page .db-stat::after {
    left: 38% !important;
    right: 38% !important;
    opacity: .11 !important;
  }
}

/* Final v4.0 Stat Vault mobile: keep in-page Gemini CTAs visible, but prevent the floating bot from covering first-screen stat tiles. */
@media (max-width: 760px) {
  html body.stat-vault-page:not(.askai-open) #askAiBubble.askai-bubble,
  html body.stat-vault-page:not(.askai-open) .askai-bubble.askai-bubble,
  html body.stat-vault-page:not(.askai-open) #askAiTooltip.askai-tooltip,
  html body.stat-vault-page:not(.askai-open) .askai-tooltip.askai-tooltip {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

/* Final v4.0 Gemini bubble cleanup: make the floating bot read as the official Gemini mark. */
html body #askAiBubble.askai-bubble,
html body .askai-bubble.askai-bubble {
  background:
    radial-gradient(circle at 32% 20%, rgba(255,255,255,.28), transparent 30%),
    linear-gradient(145deg, rgba(255,255,255,.11), rgba(255,255,255,.025) 48%, rgba(255,255,255,.09)),
    rgba(3, 7, 17, .76) !important;
  border-color: rgba(216,224,234,.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.30),
    inset 0 -10px 18px rgba(0,0,0,.16),
    0 16px 34px rgba(0,0,0,.34),
    0 0 24px rgba(66,133,244,.36),
    0 0 30px rgba(234,67,53,.16) !important;
}

html body #askAiBubble .askai-bubble-face,
html body .askai-bubble .askai-bubble-face {
  width: 52px !important;
  height: 52px !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #askAiBubble .askai-bubble-gemini,
html body .askai-bubble .askai-bubble-gemini {
  width: 47px !important;
  height: 47px !important;
  max-width: 47px !important;
  max-height: 47px !important;
  filter:
    drop-shadow(0 0 8px rgba(66,133,244,.40))
    drop-shadow(0 0 6px rgba(52,168,83,.18)) !important;
}

@media (max-width: 760px) {
  html body #askAiBubble .askai-bubble-face,
  html body .askai-bubble .askai-bubble-face {
    width: 49px !important;
    height: 49px !important;
  }

  html body #askAiBubble .askai-bubble-gemini,
  html body .askai-bubble .askai-bubble-gemini {
    width: 44px !important;
    height: 44px !important;
    max-width: 44px !important;
    max-height: 44px !important;
  }
}

/* Final v4.0 Gemini bubble optical center lock. */
html body #askAiBubble.askai-bubble,
html body .askai-bubble.askai-bubble {
  display: grid !important;
  place-items: center !important;
}

html body #askAiBubble .askai-bubble-face,
html body .askai-bubble .askai-bubble-face {
  position: absolute !important;
  inset: 50% auto auto 50% !important;
  z-index: 3 !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 0 !important;
  transform: translate(-50%, -50%) !important;
  transform-origin: 50% 50% !important;
}

html body #askAiBubble:hover .askai-bubble-face,
html body .askai-bubble:hover .askai-bubble-face {
  transform: translate(-50%, -50%) scale(1.04) !important;
}

html body #askAiBubble:active .askai-bubble-face,
html body .askai-bubble:active .askai-bubble-face {
  transform: translate(-50%, -50%) scale(.98) !important;
}

html body #askAiBubble .askai-bubble-gemini,
html body .askai-bubble .askai-bubble-gemini {
  position: static !important;
  display: block !important;
  margin: 0 auto !important;
  object-position: 50% 50% !important;
  vertical-align: middle !important;
  transform: translate3d(0, 0, 0) !important;
  transform-origin: 50% 50% !important;
}

/* Final v4.0 Ask Archive motion lift: make the Gemini archive feel visibly alive. */
html body #statsfacts .scsl-facts-ask-card,
html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  border-color: rgba(160, 203, 255, .24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -22px 36px rgba(0,0,0,.18),
    0 18px 50px rgba(0,0,0,.32),
    0 0 32px rgba(66,133,244,.16),
    0 0 26px rgba(255,45,73,.10) !important;
  animation: scslArchivePanelPulse 2.7s ease-in-out infinite !important;
}

html body #statsfacts .scsl-facts-ask-card > *,
html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full > * {
  position: relative !important;
  z-index: 2 !important;
}

html body #statsfacts .scsl-facts-ask-card::before,
html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  background:
    radial-gradient(circle at 16% 8%, rgba(255,255,255,.18), transparent 24%),
    radial-gradient(circle at 8% 76%, rgba(234,67,53,.18), transparent 32%),
    radial-gradient(circle at 88% 18%, rgba(66,133,244,.24), transparent 36%),
    linear-gradient(110deg, transparent 0%, transparent 38%, rgba(255,255,255,.16) 48%, transparent 61%, transparent 100%) !important;
  opacity: .82 !important;
  transform: translateX(-72%) !important;
  animation: scslArchiveGlassSweep 2.35s ease-in-out infinite !important;
}

html body #statsfacts .scsl-facts-ask-card::after,
html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full::after {
  content: "" !important;
  position: absolute !important;
  left: clamp(18px, 4vw, 54px) !important;
  right: clamp(18px, 4vw, 54px) !important;
  bottom: 12px !important;
  z-index: 1 !important;
  height: 2px !important;
  border-radius: 999px !important;
  pointer-events: none !important;
  background: linear-gradient(90deg, transparent, rgba(255,45,73,.72), rgba(66,133,244,.90), rgba(52,168,83,.52), transparent) !important;
  box-shadow:
    0 0 14px rgba(66,133,244,.34),
    0 0 18px rgba(255,45,73,.20) !important;
  opacity: .76 !important;
  animation: scslArchiveUnderGlow 1.75s ease-in-out infinite !important;
}

html body #statsfacts .scsl-facts-ask-kicker img,
html body.stat-vault-page #legacyScoreGpt .legacy-gpt-mark,
html body.stat-vault-page #legacyScoreGpt .legacy-gpt-input-mark {
  animation: scslArchiveGeminiPulse 1.55s ease-in-out infinite !important;
}

html body #statsfacts .scsl-facts-ask-input:focus,
html body.stat-vault-page #legacyScoreGpt .legacy-gpt-input:focus {
  box-shadow:
    0 0 0 1px rgba(129,190,255,.42),
    0 0 24px rgba(66,133,244,.22),
    0 0 18px rgba(255,45,73,.12) !important;
}

html body .legacy-gpt-message.is-swapping .legacy-gpt-message-body,
html body #askAiDrawer .askai-msg.is-swapping .askai-msg-body {
  opacity: .18 !important;
  filter: blur(3px) saturate(1.22) !important;
  transform: translateY(-3px) scale(.992) !important;
}

html body .legacy-gpt-message.is-revealing .legacy-gpt-message-body,
html body #askAiDrawer .askai-msg.is-revealing .askai-msg-body {
  animation: scslArchiveAnswerReveal .60s cubic-bezier(.16,.82,.2,1) both !important;
}

html body .legacy-gpt-message-assistant.is-revealing::before,
html body #askAiDrawer .askai-msg-assistant.is-revealing .askai-msg-body::before {
  background:
    linear-gradient(98deg, transparent 0%, rgba(255,255,255,.10) 30%, rgba(90,174,255,.36) 48%, rgba(255,45,73,.18) 58%, transparent 76%) !important;
  animation: scslArchiveAnswerSweep .62s ease-out both !important;
}

html body .legacy-gpt-message.loading,
html body #askAiDrawer .askai-msg-assistant.loading .askai-msg-body {
  animation: scslArchiveThinking 1.05s ease-in-out infinite !important;
}

@keyframes scslArchivePanelPulse {
  0%, 100% {
    filter: saturate(1.02) brightness(1);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.15),
      inset 0 -22px 36px rgba(0,0,0,.18),
      0 18px 50px rgba(0,0,0,.32),
      0 0 28px rgba(66,133,244,.14),
      0 0 22px rgba(255,45,73,.08);
  }
  50% {
    filter: saturate(1.16) brightness(1.055);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.22),
      inset 0 -22px 36px rgba(0,0,0,.16),
      0 20px 56px rgba(0,0,0,.36),
      0 0 42px rgba(66,133,244,.24),
      0 0 34px rgba(255,45,73,.15);
  }
}

@keyframes scslArchiveGlassSweep {
  0%, 34%, 100% { opacity: .42; transform: translateX(-76%); }
  54% { opacity: .92; transform: translateX(76%); }
}

@keyframes scslArchiveUnderGlow {
  0%, 100% { opacity: .48; transform: scaleX(.82); }
  50% { opacity: .95; transform: scaleX(1); }
}

@keyframes scslArchiveGeminiPulse {
  0%, 100% {
    filter: saturate(1.08) brightness(1.02) drop-shadow(0 0 7px rgba(66,133,244,.28));
    transform: translateZ(0) scale(1);
  }
  50% {
    filter: saturate(1.35) brightness(1.14) drop-shadow(0 0 14px rgba(66,133,244,.48)) drop-shadow(0 0 9px rgba(255,45,73,.20));
    transform: translateZ(0) scale(1.055);
  }
}

@keyframes scslArchiveAnswerReveal {
  0% {
    opacity: 0;
    filter: blur(4px) saturate(1.22);
    transform: translateY(9px) scale(.988);
  }
  62% {
    opacity: 1;
    filter: blur(.5px) saturate(1.12);
    transform: translateY(0) scale(1.004);
  }
  100% {
    opacity: 1;
    filter: blur(0) saturate(1);
    transform: translateY(0) scale(1);
  }
}

@keyframes scslArchiveAnswerSweep {
  0% { opacity: 0; transform: translateX(-126%); }
  22% { opacity: .86; }
  100% { opacity: 0; transform: translateX(126%); }
}

@keyframes scslArchiveThinking {
  0%, 100% {
    filter: saturate(1) brightness(1);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.12),
      0 12px 30px rgba(0,0,0,.20);
  }
  50% {
    filter: saturate(1.22) brightness(1.08);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.18),
      0 14px 34px rgba(0,0,0,.24),
      0 0 26px rgba(66,133,244,.22);
  }
}

@media (prefers-reduced-motion: reduce) {
  html body #statsfacts .scsl-facts-ask-card,
  html body #statsfacts .scsl-facts-ask-card::before,
  html body #statsfacts .scsl-facts-ask-card::after,
  html body #statsfacts .scsl-facts-ask-kicker img,
  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full,
  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full::before,
  html body.stat-vault-page #legacyScoreGpt.legacy-gpt-card.legacy-gpt-full::after,
  html body.stat-vault-page #legacyScoreGpt .legacy-gpt-mark,
  html body.stat-vault-page #legacyScoreGpt .legacy-gpt-input-mark,
  html body .legacy-gpt-message.is-revealing .legacy-gpt-message-body,
  html body .legacy-gpt-message.loading,
  html body #askAiDrawer .askai-msg.is-revealing .askai-msg-body,
  html body #askAiDrawer .askai-msg-assistant.loading .askai-msg-body {
    animation: none !important;
  }
}

/* Final v4.0 visible gold leak cleanup: keep gold for Top 15 prestige, not utility UI. */
html body .site-page-tab.site-page-tab em,
html body.stat-vault-page .site-page-tab.site-page-tab em {
  color: rgba(129, 190, 255, .88) !important;
  -webkit-text-fill-color: rgba(129, 190, 255, .88) !important;
  text-shadow: 0 0 14px rgba(66,133,244,.18) !important;
}

html body .site-page-tab.site-page-tab.is-active em,
html body.stat-vault-page .site-page-tab.site-page-tab.is-active em {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  text-shadow: 0 0 16px rgba(255,255,255,.16) !important;
}

html body #doNotTouchBtn.secret-do-not-touch-btn,
html body .secret-do-not-touch-btn.secret-do-not-touch-btn {
  color: rgba(242, 247, 255, .92) !important;
  border-color: rgba(216,224,234,.22) !important;
  background:
    radial-gradient(circle at 18% 16%, rgba(255,255,255,.12), transparent 30%),
    linear-gradient(135deg, rgba(255,45,73,.18), rgba(29,125,255,.16)),
    rgba(7, 11, 22, .78) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 12px 30px rgba(0,0,0,.30),
    0 0 18px rgba(29,125,255,.10) !important;
}

html body #doNotTouchBtn.secret-do-not-touch-btn span,
html body .secret-do-not-touch-btn.secret-do-not-touch-btn span {
  color: rgba(242, 247, 255, .92) !important;
  text-shadow: 0 0 14px rgba(88,192,255,.14) !important;
}

html body #doNotTouchBtn.secret-do-not-touch-btn:hover,
html body .secret-do-not-touch-btn.secret-do-not-touch-btn:hover {
  border-color: rgba(129,190,255,.38) !important;
  background:
    radial-gradient(circle at 18% 16%, rgba(255,255,255,.16), transparent 30%),
    linear-gradient(135deg, rgba(255,45,73,.24), rgba(29,125,255,.24)),
    rgba(8, 13, 25, .84) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    0 14px 34px rgba(0,0,0,.32),
    0 0 24px rgba(29,125,255,.16) !important;
}

html body #askAiTooltip .askai-tooltip-text strong,
html body .askai-tooltip .askai-tooltip-text strong {
  color: rgba(129, 190, 255, .96) !important;
  -webkit-text-fill-color: rgba(129, 190, 255, .96) !important;
  text-shadow: 0 0 14px rgba(66,133,244,.24) !important;
}

html body #askAiTooltip .askai-tooltip-dot,
html body .askai-tooltip .askai-tooltip-dot {
  background:
    radial-gradient(circle at 45% 38%, rgba(255,255,255,.92), rgba(255,255,255,.10) 18%, transparent 32%),
    linear-gradient(135deg, #ff2d49, #4285f4 58%, #34a853) !important;
  box-shadow:
    0 0 0 4px rgba(66,133,244,.16),
    0 0 18px rgba(66,133,244,.24) !important;
}

/* Final v4.0 Legacy Spotlight color lock: remove old award-gold from the home recap panel. */
html body #legacySpotlight.legacy-spotlight,
html body .legacy-spotlight {
  border-color: rgba(216,224,234,.16) !important;
  background:
    radial-gradient(circle at 9% 0%, rgba(255,45,73,.085), transparent 34%),
    radial-gradient(circle at 92% 0%, rgba(29,125,255,.105), transparent 38%),
    linear-gradient(145deg, rgba(255,45,73,.045), rgba(29,125,255,.070)),
    rgba(5, 8, 17, .78) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 18px 44px rgba(0,0,0,.25) !important;
}

html body #legacySpotlight .spotlight-kicker,
html body .legacy-spotlight .spotlight-kicker {
  color: rgba(129,190,255,.90) !important;
  -webkit-text-fill-color: rgba(129,190,255,.90) !important;
  text-shadow: 0 0 15px rgba(66,133,244,.22) !important;
}

html body #legacySpotlight .spotlight-card,
html body .legacy-spotlight .spotlight-card {
  border-color: rgba(216,224,234,.15) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(255,45,73,.075), transparent 36%),
    radial-gradient(circle at 100% 0%, rgba(29,125,255,.090), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.050), rgba(255,255,255,.016)),
    rgba(7, 10, 19, .76) !important;
}

html body #legacySpotlight .spotlight-rank,
html body .legacy-spotlight .spotlight-rank {
  color: #fff !important;
  background:
    radial-gradient(circle at 34% 18%, rgba(255,255,255,.74), rgba(255,255,255,.14) 31%, transparent 48%),
    linear-gradient(135deg, #ff2d49 0%, #4285f4 72%, #58c0ff 100%) !important;
  box-shadow:
    0 0 22px rgba(66,133,244,.26),
    0 12px 28px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.45) !important;
}

html body #legacySpotlight .spotlight-score,
html body .legacy-spotlight .spotlight-score {
  color: #58c0ff !important;
  -webkit-text-fill-color: #58c0ff !important;
  text-shadow: 0 0 18px rgba(88,192,255,.24) !important;
}

html body #legacySpotlight .spotlight-mini span,
html body .legacy-spotlight .spotlight-mini span {
  color: rgba(238,244,255,.88) !important;
  border-color: rgba(216,224,234,.14) !important;
  background:
    linear-gradient(135deg, rgba(255,45,73,.055), rgba(29,125,255,.075)),
    rgba(7, 11, 22, .68) !important;
}

html body #doNotTouchBtn.secret-do-not-touch-btn,
html body .secret-do-not-touch-btn.secret-do-not-touch-btn {
  text-shadow: 0 0 14px rgba(88,192,255,.14) !important;
}

/* Final v4.0 formula gold purge: AI engine stays premium without yellow UI chrome. */
html body #formula.formula-panel,
html body #formula .formula-box-integrated,
html body #formula .formula-main.formula-main-integrated,
html body #formula .formula-card,
html body #formula .formula-note {
  border-color: rgba(216,224,234,.16) !important;
}

html body #formula.formula-panel {
  background:
    radial-gradient(circle at 9% 0%, rgba(255,45,73,.070), transparent 34%),
    radial-gradient(circle at 92% 0%, rgba(29,125,255,.090), transparent 38%),
    linear-gradient(145deg, rgba(255,45,73,.035), rgba(29,125,255,.060)),
    rgba(4, 7, 15, .80) !important;
}

html body #formula .formula-main.formula-main-integrated {
  background:
    radial-gradient(circle at 18% 0%, rgba(255,45,73,.095), transparent 34%),
    radial-gradient(circle at 88% 0%, rgba(29,125,255,.130), transparent 38%),
    linear-gradient(145deg, rgba(255,45,73,.055), rgba(29,125,255,.080)),
    rgba(8, 11, 20, .78) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.13),
    0 18px 48px rgba(0,0,0,.30),
    0 0 24px rgba(29,125,255,.08) !important;
}

html body #formula .formula-main.formula-main-integrated::before {
  background:
    radial-gradient(circle at 18% 14%, rgba(255,255,255,.12), transparent 28%),
    linear-gradient(90deg, rgba(255,45,73,.20), rgba(29,125,255,.20), rgba(88,192,255,.14)) !important;
  opacity: .42 !important;
}

html body #formula .formula-main.formula-main-integrated::after {
  background: linear-gradient(90deg, transparent, rgba(255,45,73,.55), rgba(29,125,255,.62), transparent) !important;
  box-shadow: 0 0 18px rgba(29,125,255,.18) !important;
  opacity: .72 !important;
}

html body #formula .formula-main .formula-equation,
html body #formula .formula-label,
html body #formula .formula-value,
html body #formula .formula-rail span,
html body #formula .formula-core-copy em,
html body #formula .ai-engine-button-hint {
  color: rgba(129,190,255,.94) !important;
  -webkit-text-fill-color: rgba(129,190,255,.94) !important;
  text-shadow: 0 0 16px rgba(66,133,244,.18) !important;
}

html body #formula .formula-main .formula-equation .op {
  color: #ff2d49 !important;
  -webkit-text-fill-color: #ff2d49 !important;
  text-shadow: 0 0 14px rgba(255,45,73,.18) !important;
}

html body #formula .formula-rail,
html body #formula .formula-card,
html body #formula .ai-engine-button-hint,
html body #formula .formula-note {
  background:
    linear-gradient(135deg, rgba(255,45,73,.050), rgba(29,125,255,.070)),
    rgba(7, 11, 22, .66) !important;
  border-color: rgba(216,224,234,.14) !important;
}

html body #formula .formula-note {
  border-left-color: rgba(255,45,73,.58) !important;
}

html body #formula .formula-rail-ai img {
  filter:
    drop-shadow(0 0 18px rgba(66,133,244,.22))
    drop-shadow(0 0 10px rgba(255,45,73,.12)) !important;
}

html body #formula .formula-main.formula-main-integrated .ai-engine-button-hint,
html body #formula .ai-engine-button-hint.ai-engine-button-hint {
  color: rgba(129,190,255,.96) !important;
  -webkit-text-fill-color: rgba(129,190,255,.96) !important;
  border-color: rgba(129,190,255,.30) !important;
  background:
    linear-gradient(90deg, rgba(255,45,73,.14), rgba(29,125,255,.18)),
    rgba(7, 11, 22, .72) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 0 18px rgba(29,125,255,.14) !important;
  text-shadow: 0 0 14px rgba(66,133,244,.20) !important;
}

/* Final v4.0 launch gold-leak lock: non-Top-15 chrome stays red/blue glass. */
html body .hero::after {
  background: linear-gradient(90deg, transparent, rgba(255,45,73,.56), rgba(29,125,255,.62), transparent) !important;
  box-shadow: 0 0 18px rgba(29,125,255,.16) !important;
}

html body.stat-vault-page #database.panel.stat-vault-screen::before {
  background: linear-gradient(90deg, transparent, rgba(255,45,73,.55), rgba(88,192,255,.68), rgba(20,87,183,.58), transparent) !important;
}

html body.stat-vault-page #statsfacts.stats-facts-panel::before,
html body.stat-vault-page #statsfacts.stat-vault-index-panel::before {
  background:
    linear-gradient(116deg, rgba(255,255,255,.075), transparent 26%, transparent 72%, rgba(88,192,255,.075)),
    radial-gradient(circle at 50% 0%, rgba(66,133,244,.055), transparent 52%) !important;
}

html body #askAiBubble.askai-bubble::after,
html body .askai-bubble.askai-bubble::after {
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), rgba(88,192,255,.20), transparent) !important;
}

@media (max-width: 760px) {
  html body.stat-vault-page #database .section-head p::after {
    color: rgba(129,190,255,.88) !important;
    text-shadow: 0 0 14px rgba(66,133,244,.18) !important;
  }
}