/* Approved season header: dots 4/10, glow 3/10, background 2/10.
   Setup, static hubs, and active seasons share the same layers and color math. */
:is(.index-hero[data-season-dots], .sim-dots-hero.sim-dots-hero[data-season-dots], [data-simulator-route] .vqs[data-vqs-theme] [data-season-dots]) {
  position:relative; isolation:isolate;
  --ink:#e7edf4; --muted:#afbdcc; --link:#a5c9ec; --line:#344455;
  --hero-ink:var(--ink); --hero-muted:var(--muted);
  --season-dot:#306077; --season-glow:57 207 255;
  color:var(--ink);
  background:color-mix(in srgb,#0b1724,#17364f var(--dots-background-tint,11.11111111111111%));
  border-block:1px solid var(--line);
}
:is(.index-hero[data-season-dots], .sim-dots-hero.sim-dots-hero[data-season-dots], [data-simulator-route] .vqs[data-vqs-theme] [data-season-dots])::before {
  content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:1;
  background:radial-gradient(circle,var(--season-dot) .6px,transparent .9px) 0 0/24px 24px;
  filter:brightness(var(--dots-brightness,.8));
}
:is(.index-hero[data-season-dots], .sim-dots-hero.sim-dots-hero[data-season-dots], [data-simulator-route] .vqs[data-vqs-theme] [data-season-dots]) > [data-season-dots-wash] {
  display:block; position:absolute; inset:0; z-index:-2; pointer-events:none;
  --combined-glow:calc(.75 * var(--glow-intensity,.6));
  border:0; box-shadow:none;
  background:linear-gradient(to bottom,rgb(var(--season-glow) / calc(.070588 * var(--combined-glow))),transparent 72px,transparent calc(100% - 72px),rgb(var(--season-glow) / calc(.070588 * var(--combined-glow))));
}
:is(.index-hero[data-season-dots], .sim-dots-hero.sim-dots-hero[data-season-dots], [data-simulator-route] .vqs[data-vqs-theme] [data-season-dots]) > [data-season-dots-wash]::before {
  content:''; position:absolute; inset:0;
  border-block:1px solid rgb(var(--season-glow) / calc(.2 * var(--combined-glow)));
  box-shadow:inset 0 6px 12px -10px rgb(var(--season-glow) / calc(.501961 * var(--combined-glow))),inset 0 -6px 12px -10px rgb(var(--season-glow) / calc(.501961 * var(--combined-glow)));
}
/* The embedded scoreboard previously sat on pale dots; retain readable labels. */
.vqs .qsa-game-view[data-season-dots] :is(.qsa-club-abbr, .qsa-club-score > strong, .qsa-center-clock > strong, .qsa-field-possession) { color:#e7edf4; }
.vqs .qsa-game-view[data-season-dots] .qsa-club-abbr { -webkit-text-stroke:0; text-shadow:none; }
.vqs .qsa-game-view[data-season-dots] :is(.qsa-club-record, .qsa-clock-caption) { color:#afbdcc; }
.vqs .qsa-game-view[data-season-dots] .qsa-pace-message.accelerating { color:#a5c9ec; }
.vqs .qsa-game-view[data-season-dots] .qsa-pace-message.slowing { color:#efc18d; }
.vqs .qsa-game-view[data-season-dots] .qsa-clock-tint.accelerating { animation-name:season-clock-fast; }
.vqs .qsa-game-view[data-season-dots] .qsa-clock-tint.slowing { animation-name:season-clock-slow; }
@keyframes season-clock-fast { 0%,25% { color:#a5c9ec; } 100% { color:#e7edf4; } }
@keyframes season-clock-slow { 0%,25% { color:#efc18d; } 100% { color:#e7edf4; } }
/* Finish-season setup and the magazine study can preview the light theme. */
.sim-dots-hero.sim-dots-hero[data-season-dots][data-tone="light"],
html[data-index-tone="light"] body.design-magazine .index-hero[data-season-dots] {
  --ink:#223748; --muted:#526779; --link:#285b7e; --line:#d4dfe7; --season-glow:0 156 207;
  background:color-mix(in srgb,#eff7fa,#edfaff var(--dots-background-tint,11.11111111111111%));
}
.sim-dots-hero.sim-dots-hero[data-season-dots][data-tone="light"]::before,
html[data-index-tone="light"] body.design-magazine .index-hero[data-season-dots]::before {
  filter:none;
  --season-dot:rgb(calc(239 - 71 * var(--dots-brightness,.8)) calc(247 - 58 * var(--dots-brightness,.8)) calc(250 - 48 * var(--dots-brightness,.8)));
}
/* Setups have no ornamental dots on phones; keep their existing mobile shell. */
@media(max-width:767px) {
  .sim-dots-hero.sim-dots-hero[data-season-dots][data-tone] { background:transparent; border:0; }
  .sim-dots-hero.sim-dots-hero[data-season-dots][data-tone]::before { content:none; }
  .sim-dots-hero.sim-dots-hero[data-season-dots][data-tone] > [data-season-dots-wash] { display:none; }
}