:root {
  --bg: #101421;
  --surface: #171e30;
  --dark: #111827;
  --ink: #f5f5ed;
  --muted: #bfc9dc;
  --quiet: #aab7ce;
  --accent: #def385;
  --line: #36435c;
  --blue: #608fff;
  --paper: #ecece0;
}
body { overflow-wrap: break-word; }
.football-nav { position: sticky; top: 0; z-index: 5; background: var(--bg); border-bottom: 1px solid var(--line); }
.masthead { min-height: 66px; }
.football-nav .masthead { border-bottom: 0; }
.masthead .initials { background: var(--accent); color: #101421; }
.skip { z-index: 6; }
main, section[id], .story-desk article[id] { scroll-margin-top: 5rem; }
.kicker { letter-spacing: .15em; }
.fan-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  align-items: center;
  min-height: clamp(520px, 70vh, 760px);
  overflow: hidden;
  border-bottom: 1px solid var(--line);
  background: #121a30;
}
.cover-photo { position: absolute; z-index: -2; inset: 0 0 0 28%; }
.cover-photo img { width: 100%; height: 100%; max-inline-size: none; object-fit: cover; object-position: center 21%; view-transition-name: football-cover; }
.fan-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(90deg, #111827 4%, #111827 27%, #111827a0 41%, transparent 61%), linear-gradient(0deg, #101421e0, transparent 27%);
}
.fan-hero-content { padding-block: 5rem; }
.cover-copy { max-width: 58%; }
.cover-copy h1, .fan-story h2, .editorial-heading h2 {
  font: 400 clamp(4.25rem, 9.2vw, 10rem)/.83 var(--display);
  letter-spacing: -.012em;
  text-transform: uppercase;
}
.cover-copy h1 { margin: .16em 0 .2em; text-wrap: balance; }
.cover-copy h1 em { color: var(--accent); font-style: normal; }
.cover-copy .deck { color: var(--ink); max-width: 42ch; text-shadow: 0 1px 7px #101421b0; }
.cover-links { display: flex; flex-wrap: wrap; gap: .65rem 1.2rem; align-items: center; margin-top: 1.4rem; }
.cover-links .action { margin: 0; background: var(--accent); color: var(--bg); }
.cover-links .action:hover { background: var(--ink); border-color: var(--ink); }
.quiet-link { color: var(--ink); font-size: .92rem; text-underline-offset: .25em; }
.cover-caption { position: absolute; right: clamp(1rem, 5vw, 5rem); bottom: 1.15rem; font-size: .71rem; letter-spacing: .13em; text-shadow: 0 1px 4px #101421; }
.scope-strip { display: flex; flex-wrap: wrap; gap: .45rem clamp(.75rem, 4vw, 3.8rem); padding-block: .78rem; font-size: .88rem; color: var(--muted); }
.scope-strip strong { font: 400 1.45rem/1 var(--display); color: var(--accent); margin-right: .17em; }
.scope-source { margin-left: auto; align-self: center; font-size: .73rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.fan-story {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #171721;
  padding-block: clamp(2.7rem, 7vw, 6.6rem);
}
.fan-story::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(90deg, #101421eb 2%, #101421e5 24%, #101421cc 40%, #1014213b 58%, transparent 72%),
    linear-gradient(0deg, #101421d6, transparent 18%, transparent 91%, #10142173);
}
.story-text { max-width: min(52%, 38rem); text-shadow: 0 1px 5px #101421; }
.story-backdrop { position: absolute; z-index: -2; inset: 0; pointer-events: none; filter: saturate(.84); }
.story-backdrop img { position: absolute; max-inline-size: none; object-fit: cover; }
.story-cologne {
  left: 0; top: 0; width: 36%; height: 54%;
  object-position: 48% 54%;
}
.story-leipzig {
  left: 0; bottom: 0; width: 36%; height: 50%;
  object-position: 53% 51%;
  mask-image: linear-gradient(180deg, transparent, #000 8%);
}
.story-golden-shoe {
  left: 33%; top: 0; width: 35%; height: 47%;
  object-position: 47% 34%;
  mask-image: linear-gradient(90deg, transparent, #000 8.5%);
}
.story-mainz {
  left: 33%; bottom: 0; width: 35%; height: 57%;
  object-position: 56% 46%;
  mask-image: linear-gradient(90deg, transparent, #000 8.5%), linear-gradient(180deg, transparent, #000 7%);
  mask-composite: intersect;
}
.story-cup {
  right: 0; top: 0; width: 36%; height: 100%;
  object-position: 40% 43%;
  mask-image: linear-gradient(90deg, transparent, #000 11%);
}
.story-text h2, .editorial-heading h2 { font-size: clamp(3.35rem, 6.25vw, 7rem); margin-block: .18em .23em; }
.story-text > p:not(.kicker) { font-size: clamp(1.02rem, 1.4vw, 1.16rem); color: var(--muted); max-width: 64ch; margin-top: .8rem; }
.story-score { display: flex; gap: clamp(1rem, 4vw, 3rem); margin-top: 1.35rem; }
.story-score div { display: grid; grid-template-columns: auto auto; align-items: baseline; column-gap: .48rem; border-top: 1px solid var(--line); min-width: 7.5rem; padding-top: .5rem; }
.story-score span:first-child { grid-column: 1 / -1; font-size: .78rem; letter-spacing: .1em; color: var(--muted); }
.story-score strong { font: 400 clamp(3rem, 6vw, 5.6rem)/1 var(--display); }
.story-score div:last-child strong { color: var(--accent); }
.story-score span:last-child { color: var(--quiet); font-size: .84rem; }
.story-link { display: inline-block; margin-top: 1.2rem; }
.paris-feature { isolation: isolate; position: relative; overflow: hidden; background: #14182e; border-block: 1px solid #3b405d; }
.paris-layout { display: grid; align-items: center; min-height: clamp(27rem, 42vw, 36rem); }
.paris-copy { position: relative; z-index: 1; width: min(36%, 26rem); padding-block: 2.5rem; }
.paris-copy h2, .city-copy h2 { font: 400 clamp(3.4rem, 7.4vw, 7.75rem)/.85 var(--display); text-transform: uppercase; margin-block: .18em .25em; }
.paris-copy .kicker { color: #f8b7cb; }
.paris-copy > p:not(.kicker), .city-copy > p:not(.kicker), .market-note > p { color: var(--muted); max-width: 54ch; }
.paris-copy > p:not(.kicker) { color: #e1e1ea; }
.paris-copy a, .city-copy a, .market-note a { color: var(--accent); text-underline-offset: .2em; }
.paris-photos { position: absolute; inset: 0 0 0 32%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.paris-photos::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, #14182e, #14182ed0 8%, #14182e55 16%, transparent 28%); }
.paris-photos figure, .city-photos figure { position: relative; isolation: isolate; overflow: hidden; background: #172338; }
.paris-photos figure + figure { border-left: 1px solid #d1dbf05c; }
.paris-photos img, .city-photos img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.paris-photos img { object-position: 49% 58%; }
.paris-photos figure::after, .city-photos figure::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, #101421f0, transparent 40%); z-index: -1; }
.paris-photos figcaption, .city-photos figcaption { position: absolute; inset: auto .7rem .6rem; display: flex; align-items: baseline; gap: .35rem .55rem; flex-wrap: wrap; font-size: .75rem; color: #f4f0ee; }
.paris-photos figcaption { left: 35%; }
.paris-photos figcaption strong, .city-photos figcaption strong { font: 400 clamp(1.65rem, 3.25vw, 3rem)/1 var(--display); color: #fff; }
.city-feature { display: grid; grid-template-areas: "photos copy"; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: clamp(1.1rem, 5vw, 5rem); align-items: center; padding-block: clamp(2.6rem, 7vw, 6.2rem); }
.city-copy { grid-area: copy; }
.city-copy .kicker { color: #a9d9ff; }
.city-photos { grid-area: photos; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; padding: .45rem; background: #20324b; border: 1px solid #3e5976; }
.city-photos figure { aspect-ratio: 1.42; }
.city-photos .city-istanbul { grid-column: 1 / -1; aspect-ratio: 1.78; }
.city-photos img { object-position: 51% 46%; }
.city-photos figcaption strong { color: #b8e6ff; }
.city-points { margin: 1.35rem 0 .2rem; }
.city-points figcaption { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .25rem .7rem; color: var(--muted); font-size: .78rem; }
.city-points figcaption span { color: var(--accent); }
.city-points ol { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); align-items: end; gap: .28rem; list-style: none; margin: .75rem 0 0; padding: 0; }
.city-points li { display: grid; justify-items: center; grid-template-rows: 1rem 7.5rem 1rem; align-items: end; gap: .25rem; font-size: clamp(.63rem, 1.3vw, .82rem); font-variant-numeric: tabular-nums; color: var(--muted); }
.city-points-value { color: var(--ink); }
.city-points-bar { height: var(--points); width: 77%; background: var(--blue); }
.city-points li.is-champion .city-points-bar { background: var(--accent); }
.market-note { display: grid; grid-template-columns: 1fr 1.25fr; align-items: center; gap: .8rem 1.65rem; padding-block: 1.4rem; margin-top: 1.7rem; border-top: 1px solid var(--line); }
.market-note h3 { font: 400 clamp(2.3rem, 4.7vw, 4.7rem)/.92 var(--display); text-transform: uppercase; margin-top: .28em; }

.season-room, .replay-section, .momentum-section, .transfer-section, .methods-section { padding-block: clamp(3.1rem, 6.5vw, 6rem); }
.season-room { background: #192238; border-block: 1px solid var(--line); }
.editorial-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .78fr); align-items: end; gap: .85rem 3rem; margin-bottom: 1.6rem; }
.editorial-heading h2 { margin-bottom: 0; }
.editorial-heading > p { font-size: clamp(1rem, 1.4vw, 1.18rem); max-width: 50ch; color: var(--muted); }
.momentum-section { background: var(--paper); color: #151a28; }
.momentum-section .kicker, .momentum-section strong { color: #244bb0; }
.momentum-section .editorial-heading > p, .momentum-section .scope-note { color: #424c60; }
.moment-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(.8rem, 3vw, 2.6rem); }
.moment-grid article { border-top: 1px solid #a6aab5; padding-top: .6rem; }
.moment-grid strong { font: 400 clamp(3.1rem, 6vw, 6rem)/1 var(--display); }
.moment-grid p { max-width: 29ch; font-size: .95rem; }
.more-dashboard .viz-panel { margin-top: .65rem; }
.origins-content { padding: .35rem 0 .65rem; color: var(--muted); }
.origins-content > p { max-width: 64ch; }
.origins-credits { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem 2rem; margin-top: 1.2rem; }
.origins-credits > div { border-top: 1px solid var(--line); padding-top: .65rem; }
.origins-credits h3 { margin-bottom: .42rem; color: var(--ink); font-size: .88rem; }
.origins-credits ul { display: flex; flex-wrap: wrap; gap: .4rem 1rem; list-style: none; margin: 0; padding: 0; }
.origins-credits a { color: var(--accent); text-underline-offset: .2em; }
.origins-school { margin-top: .28rem; font-size: .83rem; }
.footer { font-size: .81rem; }
.footer p:last-child { flex-basis: 100%; }

.season-panel { background: var(--dark); border: 1px solid #40516d; }
.season-toolbar { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: .7rem 1.2rem; padding: 1rem clamp(.8rem, 2.8vw, 1.7rem); border-bottom: 1px solid var(--line); }
.season-controls, .season-player-controls { display: flex; flex-wrap: wrap; align-items: end; gap: .55rem 1rem; }
.season-control { display: inline-grid; gap: .17rem; color: var(--muted); font-size: .77rem; font-weight: 700; }
.season-select, .replay-select {
  max-width: 100%;
  min-height: 2.55rem;
  padding: .35rem .62rem;
  border: 1px solid var(--line);
  background: #202c45;
  color: var(--ink);
}
.season-tabs { display: flex; flex-wrap: wrap; align-items: center; gap: .34rem; }
.season-tab, .replay-play {
  border: 1px solid var(--line);
  padding: .53rem .82rem;
  background: none;
  color: var(--muted);
  font-weight: 700;
  cursor: pointer;
}
.season-tab:hover, .replay-play:hover { color: var(--ink); border-color: var(--blue); }
.season-tab[aria-pressed="true"] { background: var(--accent); color: var(--bg); border-color: var(--accent); }
.season-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid var(--line); }
.season-stat { display: grid; align-content: start; gap: .12rem; padding: .88rem clamp(.6rem, 2.5vw, 1.65rem); }
.season-stat + .season-stat { border-left: 1px solid var(--line); }
.season-stat > span { color: var(--muted); font-size: .8rem; }
.season-stat strong { font: 400 clamp(2.35rem, 4.8vw, 4.1rem)/1 var(--display); color: var(--accent); }
.season-stat small { color: var(--quiet); font-size: .73rem; }
.season-body { padding: clamp(.7rem, 2.7vw, 1.65rem); }
.season-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: 1rem; }
.season-table-wrap { overflow: auto; max-height: 34rem; }
.season-standings-wrap { max-height: none; }
.season-table { border-collapse: separate; border-spacing: 0; width: 100%; text-align: left; font-size: .85rem; }
.season-table caption { color: var(--muted); text-align: left; font-size: .78rem; padding: .28rem 0; }
.season-table :is(th, td) { border-bottom: 1px solid #303c54; padding: .38rem .45rem; white-space: nowrap; }
.season-table thead th { position: sticky; top: 0; z-index: 1; background: #22304b; color: #e1e7f5; font-size: .76rem; }
.season-table tbody tr:nth-child(even) { background: #ffffff05; }
.season-table tbody tr:has(.season-club-button[aria-pressed="true"]) { background: #608fff22; }
.season-position { color: var(--quiet); font-variant-numeric: tabular-nums; }
.season-points { color: var(--accent); font-weight: 700; font-variant-numeric: tabular-nums; }
.season-club-button { display: inline-flex; align-items: center; text-align: left; gap: .45rem; background: none; color: var(--ink); border: 0; padding: .13rem .24rem; cursor: pointer; font-weight: 700; }
.season-club-button:hover { color: var(--accent); }
.season-crest, .season-player-image { position: relative; display: inline-grid; place-items: center; flex: none; width: 1.9rem; height: 1.9rem; background: #253550; border-radius: .35rem; overflow: hidden; }
.season-crest img, .season-player-image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #1c2942; }
.season-image-fallback { color: var(--muted); font-size: .62rem; font-weight: 700; }
.season-club-panel { align-self: start; background: #1c2841; border: 1px solid #415476; padding: clamp(.8rem, 2vw, 1.25rem); min-width: 0; }
.season-club-heading { display: flex; gap: .7rem; align-items: center; }
.season-club-heading .season-crest { width: 3.75rem; height: 3.75rem; }
.season-club-heading h3 { font: 400 clamp(1.9rem, 3.8vw, 3.35rem)/1 var(--display); text-transform: uppercase; }
.season-overline { color: var(--accent); font-size: .68rem; text-transform: uppercase; letter-spacing: .14em; font-weight: 700; }
.season-club-line, .season-note { margin-block: .6rem; color: var(--muted); font-size: .82rem; }
.season-compare-key, .season-mix-key { display: flex; flex-wrap: wrap; gap: .2rem .9rem; list-style: none; margin: .55rem 0; padding: 0; font-size: .75rem; }
.season-compare-key i, .season-mix-key i { display: inline-block; width: .55rem; height: .55rem; background: var(--blue); margin-right: .3rem; }
.season-compare-key li:first-child i { background: var(--accent); }
.season-bars { display: grid; gap: .45rem; }
.season-bar { display: grid; gap: .14rem; font-size: .78rem; }
.season-bar-track { display: flex; position: relative; min-height: 1.06rem; background: #0c1426; overflow: hidden; }
.season-bar-track span { display: block; height: 100%; min-height: 1.06rem; background: var(--accent); opacity: .56; }
.season-bar-track b { position: absolute; inset: 0 .34rem 0 auto; color: white; text-shadow: 0 1px 3px #111827; font-size: .74rem; }
.season-bar-reference span { background: var(--blue); }
.season-history { margin-top: .8rem; color: var(--muted); font-size: .82rem; }
.season-history svg { width: 100%; height: auto; color: var(--accent); }
.season-history-axis { stroke: var(--line); }
.season-history-series { stroke: currentColor; fill: currentColor; }
.season-history-series line { stroke-width: 2; }
.season-history svg text { fill: var(--muted); stroke: none; font-size: 10px; }
.season-mix { margin-bottom: .8rem; font-size: .82rem; }
.season-mix-track { display: flex; height: .53rem; background: #26324a; }
.season-mix-track span { display: block; }
.season-mix-home, .season-mix-key .season-mix-home { background: var(--accent); }
.season-mix-draw, .season-mix-key .season-mix-draw { background: #7789aa; }
.season-mix-away, .season-mix-key .season-mix-away { background: var(--blue); }
.season-player-controls { margin-bottom: .75rem; }
.season-player { display: flex; align-items: center; gap: .5rem; }
.season-player > span:last-child { display: grid; }
.season-player small { color: var(--quiet); }
.season-player-image { width: 2.45rem; height: 2.45rem; border-radius: 50%; }
.season-player-image img { object-fit: cover; }
.season-clock-lead { color: var(--muted); margin-block: .42rem 1rem; }
.season-clock-bars { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); list-style: none; padding: 0; gap: .45rem; margin: .55rem 0; }
.season-clock-bar { display: grid; justify-items: center; gap: .3rem; font-size: .78rem; }
.season-clock-count { font-weight: 700; }
.season-clock-track { position: relative; width: min(100%, 4.2rem); height: 7rem; background: #25314a; display: flex; align-items: end; }
.season-clock-track > span { width: 100%; background: var(--blue); }
.season-clock-bar.is-peak .season-clock-track > span { background: var(--accent); }
.season-clock-time { color: var(--muted); }
.season-states { margin-top: 1.25rem; }

@media (max-width: 860px) {
  .season-grid { grid-template-columns: minmax(0, 1fr); }
  .cover-copy { max-width: 72%; }
}
@media (max-width: 720px) {
  .story-text { max-width: 36rem; }
  .fan-story { padding-top: clamp(12rem, 48vw, 19rem); }
  .fan-story::after { background: linear-gradient(0deg, #101421ed 2%, #101421e0 64%, #1014214d 84%, #1014211a 96%); }
  .story-cologne { height: 29%; object-position: 50% 43%; }
  .story-leipzig { height: 75%; }
  .story-golden-shoe { height: 26%; object-position: 42% 40%; }
  .story-mainz { height: 78%; }
  .story-cup { object-position: 45% 20%; }
  .paris-layout { width: 100%; min-height: 0; }
  .paris-copy { width: auto; padding: 2rem clamp(1rem, 5vw, 2.5rem); }
  .paris-copy h2 br, .city-copy h2 br { display: none; }
  .paris-photos { position: relative; inset: auto; min-height: 13rem; }
  .paris-photos::after { background: linear-gradient(180deg, #14182e99, transparent 26%); }
  .paris-photos figcaption { left: .7rem; }
  .city-feature { grid-template-areas: "copy" "photos"; grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .masthead nav { gap: .3rem .7rem; }
  main, section[id], .story-desk article[id] { scroll-margin-top: 6.5rem; }
  .cover-photo { inset: 0 0 auto; height: 58%; }
  .cover-photo img { object-position: center 40%; }
  .fan-hero::after { background: linear-gradient(0deg, #111827 43%, #111827d5 56%, #1118271f 92%); }
  .fan-hero { min-height: 590px; align-items: end; }
  .fan-hero-content { padding-block: 13rem 3.45rem; }
  .cover-copy { max-width: none; }
  .cover-caption { right: auto; left: 1rem; font-size: .58rem; bottom: .95rem; }
  .cover-copy h1 { font-size: clamp(4.35rem, 13.5vw, 6.65rem); }
  .scope-source { margin-left: 0; }
  .market-note, .editorial-heading, .origins-credits { grid-template-columns: minmax(0, 1fr); }
  .story-score { gap: .75rem; }
  .story-score div { min-width: 0; flex: 1; column-gap: .25rem; }
  .story-score span:last-child { font-size: .71rem; }
  .moment-grid { grid-template-columns: minmax(0, 1fr); }
  .season-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .season-stat:nth-child(3) { border-left: 0; }
  .season-stat:nth-child(n+3) { border-top: 1px solid var(--line); }
  .season-table :is(th, td) { padding-inline: .28rem; }
  .season-club-button { white-space: normal; }
  .season-clock-time { font-size: .67rem; }
}

.replay-panel { background: var(--dark); border: 1px solid #40516d; }
.replay-topline, .replay-controls, .replay-moments, .replay-log { padding-inline: clamp(.85rem, 3vw, 2.1rem); }
.replay-topline { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: .75rem 1rem; padding-block: .95rem; border-bottom: 1px solid var(--line); }
.replay-fixture { display: grid; color: var(--muted); font-size: .8rem; font-weight: 700; gap: .2rem; }
.replay-fixture select { min-height: 2.5rem; padding: .3rem .58rem; border: 1px solid var(--line); background: #202c45; color: var(--ink); }
.replay-venue { font-size: .83rem; color: var(--muted); }
.replay-story {
  padding: .65rem clamp(.85rem, 3vw, 2.1rem);
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: .9rem;
}
.replay-story a { color: var(--accent); white-space: nowrap; margin-inline-start: .4rem; }
.replay-scoreboard {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: clamp(.5rem, 3vw, 2rem);
  padding: clamp(1.1rem, 4vw, 2.55rem);
  background: linear-gradient(120deg, #243559, #151c2d 54%, #51252c);
  border-bottom: 1px solid var(--line);
}
.replay-team { display: flex; align-items: center; gap: .55rem 1rem; }
.replay-team--away { flex-direction: row-reverse; text-align: right; }
.replay-team-name { font: 400 clamp(1.45rem, 4.1vw, 3.5rem)/.95 var(--display); text-transform: uppercase; }
.replay-formation { color: var(--muted); font-size: .78rem; margin-top: .26rem; }
.replay-crest { width: clamp(2.1rem, 6.5vw, 5rem); height: auto; flex: none; }
.replay-score-group { min-width: 6.2rem; text-align: center; }
.replay-score { font: 400 clamp(3rem, 8vw, 6rem)/.95 var(--display); font-variant-numeric: tabular-nums; color: var(--accent); }
.replay-clock { text-transform: uppercase; font-weight: 700; color: var(--muted); letter-spacing: .11em; font-size: .73rem; }
.replay-controls { display: flex; gap: 1rem; align-items: end; padding-block: .9rem; }
.replay-play { min-width: 5.1rem; background: var(--accent); color: #101421; border-color: var(--accent); }
.replay-play:hover { background: var(--ink); color: #101421; border-color: var(--ink); }
.replay-slider { flex: 1; display: grid; gap: .35rem; color: var(--muted); font-size: .78rem; }
.replay-slider input { width: 100%; accent-color: var(--accent); margin: 0; }
.replay-moments { display: flex; align-items: center; flex-wrap: wrap; gap: .38rem; padding-bottom: .8rem; color: var(--muted); font-size: .8rem; }
.replay-moments > span { margin-right: .3rem; }
.replay-jump { min-width: 2.6rem; min-height: 2rem; background: #202b43; color: var(--ink); border: 1px solid var(--line); cursor: pointer; }
.replay-jump:hover { border-color: var(--accent); }
.replay-log { border-top: 1px solid var(--line); padding-block: .8rem 1rem; min-height: 10rem; }
.replay-log h3 { font-size: 1rem; margin-bottom: .35rem; }
.replay-empty, .replay-event-team { color: var(--quiet); font-size: .81rem; }
.replay-events { margin: 0; padding: 0; list-style: none; max-height: 15rem; overflow: auto; }
.replay-event { display: grid; grid-template-columns: 2.15rem 6.6rem minmax(0, 1fr) minmax(5rem, .45fr); gap: .5rem; padding: .32rem .2rem; align-items: baseline; border-bottom: 1px solid var(--line); font-size: .84rem; }
.replay-event[hidden], .replay-empty[hidden] { display: none; }
.replay-event[aria-current] { background: #ffffff0a; }
.replay-minute, .replay-event--goal .replay-event-icon { color: var(--accent); font-weight: 700; }
.replay-event--card .replay-event-icon { color: #f1d76e; }

@media (max-width: 560px) {
  .replay-team, .replay-team--away { flex-direction: column; align-items: center; text-align: center; }
  .replay-score-group { min-width: 4rem; }
  .replay-scoreboard { padding-inline: .65rem; }
  .replay-event { grid-template-columns: 1.8rem 5.15rem minmax(0, 1fr); gap: .3rem; font-size: .76rem; }
  .replay-event-team { grid-column: 3; font-size: .72rem; }
}

.season-loading { min-height: 12rem; padding: 1rem; border: 1px solid var(--line); color: var(--muted); }

.season-current-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .8rem;
  border-bottom: 1px solid var(--line);
  background: #1a253d;
  padding: .63rem clamp(.8rem, 2.8vw, 1.7rem);
  color: var(--muted);
  font-size: .83rem;
}
.season-current-meta[hidden] { display: none; }
.season-current-meta a, .season-analysis-meta a, .story-text a { color: var(--accent); text-underline-offset: .2em; }
.season-current-badge {
  padding: .16rem .42rem;
  background: var(--accent);
  color: var(--bg);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.season-current-fixtures { margin-top: .8rem; border-block: 1px solid var(--line); padding-block: .7rem; }
.season-current-fixtures h4 { margin: 0; font-size: .86rem; }
.season-form ol { display: flex; flex-wrap: wrap; gap: .3rem; padding: 0; margin: .37rem 0 .65rem; list-style: none; }
.season-form li { display: grid; place-items: center; min-width: 1.68rem; min-height: 1.68rem; font-size: .77rem; font-weight: 700; }
.season-form-w { background: #d8f485; color: #172029; }
.season-form-d { background: #52617a; color: white; }
.season-form-l { background: #7d3142; color: #ffe7ed; }
.season-recent-results ul { display: grid; gap: .28rem; list-style: none; margin: .35rem 0 0; padding: 0; }
.season-recent-results li { display: grid; grid-template-columns: 4.8rem minmax(0, 1fr) auto; gap: .35rem; font-size: .78rem; }
.season-recent-results time { color: var(--quiet); }
.season-recent-results b { font-variant-numeric: tabular-nums; }
.season-next { margin-top: .64rem; color: var(--muted); font-size: .8rem; }
.season-availability { max-width: 38rem; padding-block: .8rem; }
.season-availability .season-tab { margin-top: .5rem; }
.season-analysis-meta { display: flex; flex-wrap: wrap; gap: .3rem .9rem; margin-bottom: .9rem; color: var(--muted); font-size: .82rem; }
.season-table-wrap { overscroll-behavior-inline: contain; }
.season-table-cue { display: none; }
@media (max-width: 640px) {
  .season-table-cue { display: block; margin-block: .35rem; color: var(--quiet); font-size: .75rem; }
}

@media (min-width: 1100px) {
  .season-standings-wrap { overflow: visible; }
}