@font-face { font-family: "Bodoni Moda"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../fonts/bodoni-moda-latin.39716715b3.woff2") format("woff2"); }
@font-face { font-family: "Bodoni Moda"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("../fonts/bodoni-moda-italic-latin.ac73f6e7eb.woff2") format("woff2"); }
@font-face { font-family: "Literata"; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url("../fonts/literata-latin.e12a191d09.woff2") format("woff2"); }
@font-face { font-family: "Literata"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("../fonts/literata-italic-latin.04a3a0ff5a.woff2") format("woff2"); }
@font-face { font-family: "Bodoni Moda Fallback"; font-style: normal; src: local("Times New Roman"), local("TimesNewRomanPSMT");
  size-adjust: 108.2%; ascent-override: 104%; descent-override: 37%; line-gap-override: 0%; }
@font-face { font-family: "Bodoni Moda Fallback"; font-style: italic; src: local("Times New Roman Italic"), local("TimesNewRomanPS-ItalicMT");
  size-adjust: 106.8%; ascent-override: 105.3%; descent-override: 37.4%; line-gap-override: 0%; }
@font-face { font-family: "Literata Fallback"; font-style: normal; src: local("Georgia");
  size-adjust: 105.2%; ascent-override: 111.9%; descent-override: 29.3%; line-gap-override: 0%; }
@font-face { font-family: "Literata Fallback"; font-style: italic; src: local("Georgia Italic"), local("Georgia-Italic");
  size-adjust: 98.1%; ascent-override: 120%; descent-override: 31.4%; line-gap-override: 0%; }

:root {
  --celeste: #75aadb;
  --azure: #3f7db9;
  --paper: #fbf8ea;
  --leather: #2b1d14;
  --shadow: #140d09;
  --on-leather: #f3ecdc;
  --on-leather-muted: #b09f88;
  --bg: var(--paper);
  --fg: #241a12;
  --fg-2: #54483c;
  --muted: #6f6353;
  --rule: #e2d8c3;
  --rule-strong: var(--fg);
  --accent: var(--fg);
  --ornament: var(--celeste);
  --mark: var(--azure);
  --focus: var(--azure);
  --frame: color-mix(in srgb, var(--fg) 50%, transparent);
  --frame-pad: clamp(0.3125rem, 0.25rem + 0.25vw, 0.5rem);
  --font-display: "Bodoni Moda", "Bodoni Moda Fallback", "Times New Roman", serif;
  --font-text: "Literata", "Literata Fallback", Georgia, serif;
  --font-label: var(--font-text);

  --text-credit: 0.8125rem;
  --text-label: 0.78125rem;
  --text-s: 0.9375rem;
  --text-m: clamp(1.09375rem, 1.04rem + 0.24vw, 1.25rem);
  --text-l: clamp(1.1875rem, 1.1rem + 0.4vw, 1.5rem);
  --text-xl: clamp(1.375rem, 1.2rem + 0.8vw, 2rem);
  --display-s: clamp(1.75rem, 1.4rem + 1.5vw, 2.625rem);
  --display-m: clamp(2.25rem, 1.6rem + 2.9vw, 4.25rem);
  --display-l: clamp(2.875rem, 1.8rem + 4.6vw, 6.5rem);
  --display-xl: clamp(3rem, 15vw, 8rem);
  --text-nav: 1.0625rem;
  --display-nav: 1.5rem;
  --display-menu: 1.75rem;
  --track-label: 0.16em;
  --track-caps: 0.06em;
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-s: 1rem;
  --space-m: 1.5rem;
  --space-l: clamp(2rem, 1.6rem + 1.6vw, 3rem);
  --space-xl: clamp(3rem, 2.2rem + 3.4vw, 5rem);
  --space-section: clamp(4rem, 2.6rem + 6vw, 8.5rem);
  --margin: clamp(1.25rem, 5vw, 4.5rem);
  --gap: clamp(1rem, 0.6rem + 1.4vw, 1.75rem);
  --max: 82.5rem;
  --inset: max(var(--margin), (100% - var(--max)) / 2);
  --col: calc((var(--max) - 11 * var(--gap)) / 12);
  --measure: calc(var(--text-m) * 30);
  --header: 3rem;
  --target: 44px;
  --arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 12'%3E%3Cpath d='M0 6h26M21 1l5 5-5 5' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E");
  --arrow-long: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 12' preserveAspectRatio='none'%3E%3Cpath d='M0 6h94M89 1l5 5-5 5' fill='none' stroke='%23000' stroke-width='1.1'/%3E%3C/svg%3E");
  --swell: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 6' preserveAspectRatio='none'%3E%3Cpath d='M0 3C30 0 70 0 100 3C70 6 30 6 0 3Z'/%3E%3C/svg%3E");
  --sprig: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 44 16'%3E%3Cpath d='M3 10Q20 2 36.8 6.5' fill='none' stroke='%23000' stroke-width='1'/%3E%3Cpath d='M5.9 9C6.8 11.7 10 12.8 13.8 12.1C11.5 9 8.4 7.6 5.9 9ZM5.9 9C8.7 8.5 10.4 5.6 10.3 1.7C6.8 3.4 5 6.3 5.9 9ZM12.9 6.8C13.6 9.4 16.5 10.6 20 10.1C18.1 7.1 15.3 5.7 12.9 6.8ZM12.9 6.8C15.6 6.6 17.3 3.9 17.4 0.4C14.1 1.7 12.2 4.2 12.9 6.8ZM19.9 5.4C20.3 7.8 22.8 9.3 26 9.3C24.7 6.3 22.3 4.6 19.9 5.4ZM19.9 5.4C22.4 5.5 24.3 3.3 24.8 0C21.6 0.9 19.6 2.9 19.9 5.4ZM26.9 5C26.9 7.3 28.9 9 31.9 9.5C31.1 6.6 29.2 4.7 26.9 5ZM26.9 5C29.1 5.5 31.2 3.8 32.2 0.9C29.2 1.2 27 2.8 26.9 5ZM34 5.8C33.6 7.9 35.2 9.7 37.7 10.5C37.4 7.8 36 5.9 34 5.8ZM34 5.8C35.9 6.6 37.9 5.3 39.2 2.9C36.5 2.8 34.4 3.8 34 5.8ZM36.8 6.5C37.8 8.5 40.2 9 42.9 8C41 5.8 38.6 5.2 36.8 6.5Z'/%3E%3C/svg%3E");
  --wreath: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-24 36 148 111' fill='none' stroke='%23000'%3E%3Cpath d='M54 132.8A58 70.5 0 0 1 -6.7 47.8M46 132.8A58 70.5 0 0 0 106.7 47.8' stroke-width='.45'/%3E%3Cpath d='M39.9 131.9C39.6 128.4 36.7 125.6 32.3 124C33.7 128.4 36.4 131.5 39.9 131.9ZM39.9 131.9C36.9 131 33.6 132.5 30.7 135.6C34.9 135.9 38.4 134.7 39.9 131.9ZM27.5 127.5C28 124.2 26 120.9 22.5 118.4C22.7 122.8 24.4 126.2 27.5 127.5ZM27.5 127.5C24.9 125.9 21.5 126.5 18.2 128.6C21.9 129.9 25.4 129.6 27.5 127.5ZM16.1 119.7C17.4 116.9 16.3 113.5 13.7 110.4C12.9 114.4 13.6 117.9 16.1 119.7ZM16.1 119.7C14.2 117.7 11 117.5 7.5 118.7C10.6 120.7 13.8 121.2 16.1 119.7ZM6.5 109.1C8.2 106.8 8 103.5 6.2 100.1C4.7 103.6 4.6 106.9 6.5 109.1ZM6.5 109.1C5.2 106.9 2.3 106 -1.2 106.4C1.2 108.8 4 110 6.5 109.1ZM-0.9 96.2C1.1 94.4 1.5 91.3 0.5 87.9C-1.6 90.8 -2.2 93.9 -0.9 96.2ZM-0.9 96.2C-1.7 93.9 -4.2 92.5 -7.4 92.2C-5.7 94.9 -3.3 96.5 -0.9 96.2ZM-5.8 81.6C-3.7 80.3 -2.8 77.6 -3 74.3C-5.4 76.6 -6.6 79.2 -5.8 81.6ZM-5.8 81.6C-6.2 79.4 -8.1 77.7 -11 76.8C-9.9 79.6 -8.1 81.4 -5.8 81.6ZM-7.9 66C-5.8 65.2 -4.5 62.9 -4.2 59.9C-6.7 61.6 -8.2 63.7 -7.9 66ZM-7.9 66C-7.8 64 -9.3 62.1 -11.7 60.8C-11.2 63.5 -9.9 65.5 -7.9 66ZM-7.1 50.3C-5.1 49.9 -3.5 48.1 -2.7 45.4C-5.3 46.5 -7 48.2 -7.1 50.3ZM-7.1 50.3C-6.7 48.4 -7.7 46.5 -9.7 45C-9.7 47.5 -8.8 49.4 -7.1 50.3ZM-6.7 47.8C-5.2 46.5 -4.9 44.1 -5.6 41.4C-7.2 43.7 -7.7 46 -6.7 47.8ZM60.1 131.9C60.4 128.4 63.3 125.6 67.7 124C66.3 128.4 63.6 131.5 60.1 131.9ZM60.1 131.9C63.1 131 66.4 132.5 69.3 135.6C65.1 135.9 61.6 134.7 60.1 131.9ZM72.5 127.5C72 124.2 74 120.9 77.5 118.4C77.3 122.8 75.6 126.2 72.5 127.5ZM72.5 127.5C75.1 125.9 78.5 126.5 81.8 128.6C78.1 129.9 74.6 129.6 72.5 127.5ZM83.9 119.7C82.6 116.9 83.7 113.5 86.3 110.4C87.1 114.4 86.4 117.9 83.9 119.7ZM83.9 119.7C85.8 117.7 89 117.5 92.5 118.7C89.4 120.7 86.2 121.2 83.9 119.7ZM93.5 109.1C91.8 106.8 92 103.5 93.8 100.1C95.3 103.6 95.4 106.9 93.5 109.1ZM93.5 109.1C94.8 106.9 97.7 106 101.2 106.4C98.8 108.8 96 110 93.5 109.1ZM100.9 96.2C98.9 94.4 98.5 91.3 99.5 87.9C101.6 90.8 102.2 93.9 100.9 96.2ZM100.9 96.2C101.7 93.9 104.2 92.5 107.4 92.2C105.7 94.9 103.3 96.5 100.9 96.2ZM105.8 81.6C103.7 80.3 102.8 77.6 103 74.3C105.4 76.6 106.6 79.2 105.8 81.6ZM105.8 81.6C106.2 79.4 108.1 77.7 111 76.8C109.9 79.6 108.1 81.4 105.8 81.6ZM107.9 66C105.8 65.2 104.5 62.9 104.2 59.9C106.7 61.6 108.2 63.7 107.9 66ZM107.9 66C107.8 64 109.3 62.1 111.7 60.8C111.2 63.5 109.9 65.5 107.9 66ZM107.1 50.3C105.1 49.9 103.5 48.1 102.7 45.4C105.3 46.5 107 48.2 107.1 50.3ZM107.1 50.3C106.7 48.4 107.7 46.5 109.7 45C109.7 47.5 108.8 49.4 107.1 50.3ZM106.7 47.8C105.2 46.5 104.9 44.1 105.6 41.4C107.2 43.7 107.7 46 106.7 47.8Z' stroke-width='.4'/%3E%3Cpath d='M39 131L33.8 125.6M38.8 132.4L32.6 134.9M26.9 126.4L23.5 120.2M26.4 127.6L20.1 128.4M15.8 118.6L14.2 112.2M15.1 119.6L9.2 118.9M6.5 108.1L6.3 101.9M5.6 108.8L0.4 106.9M-0.8 95.2L0.2 89.6M-1.7 95.7L-6.1 93M-5.5 80.7L-3.6 75.8M-6.4 81L-9.9 77.8M-7.5 65.3L-4.9 61.1M-8.4 65.4L-11 61.9M-6.6 49.7L-3.6 46.4M-7.4 49.6L-9.2 46M-6.6 47.1L-5.8 42.7M61 131L66.2 125.6M61.2 132.4L67.4 134.9M73.1 126.4L76.5 120.2M73.6 127.6L79.9 128.4M84.2 118.6L85.8 112.2M84.9 119.6L90.8 118.9M93.5 108.1L93.7 101.9M94.4 108.8L99.6 106.9M100.8 95.2L99.8 89.6M101.7 95.7L106.1 93M105.5 80.7L103.6 75.8M106.4 81L109.9 77.8M107.5 65.3L104.9 61.1M108.4 65.4L111 61.9M106.6 49.7L103.6 46.4M107.4 49.6L109.2 46M106.6 47.1L105.8 42.7' stroke-width='.25'/%3E%3C/svg%3E");
}

@media (min-width: 64em) { :root { --display-xl: min(8rem, 8.7vw); } }

*, *::before, *::after { box-sizing: border-box; }
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  color-scheme: light;
  scroll-padding-top: calc(var(--header) + 1rem);
  timeline-scope: --cover;
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font: 400 var(--text-m)/1.6 var(--font-text);
  font-kerning: normal;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  overflow-wrap: break-word;
  counter-reset: folio plate;
}
h1, h2, h3, h4, p, figure, blockquote, dl, dd, ol, ul { margin: 0; }
:where(ol, ul)[class] { padding: 0; list-style: none; }
:where(h1, h2, h3, h4) { font-weight: 400; text-wrap: balance; }
img, svg { display: block; max-width: 100%; height: auto; }
picture { display: contents; }
a {
  color: inherit;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
  text-decoration-color: color-mix(in srgb, currentColor 40%, transparent);
}
a:hover { text-decoration-color: currentColor; }
:where(button) { font: inherit; color: inherit; }
table { border-collapse: collapse; }
abbr[title] { text-decoration: none; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
::selection { background: var(--celeste); color: var(--leather); }

.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}
.skip {
  position: absolute; z-index: 60; left: var(--inset); top: -5rem;
  display: inline-flex; align-items: center; min-height: var(--target); padding: 0 1rem;
  background: var(--leather); color: var(--on-leather);
}
.skip:focus { top: 0.5rem; }
.skip:focus-visible { outline-color: currentColor; outline-offset: -5px; }

.night, .colophon {
  --bg: var(--leather);
  --fg: var(--on-leather);
  --fg-2: #d5c7b2;
  --muted: var(--on-leather-muted);
  --rule: #4a3527;
  --rule-strong: var(--fg);
  --accent: var(--celeste);
  --mark: var(--celeste);
  --focus: var(--celeste);
  --frame: color-mix(in srgb, var(--fg) 45%, transparent);
  color-scheme: dark;
  background: var(--bg);
  color: var(--fg);
}
.night:has(> .column) {
  --bg: var(--shadow);
  --fg-2: #cdbfaa;
  --muted: #a8977f;
  --rule: #3a2a1f;
  --accent: var(--fg);
  --mark: var(--fg);
  --focus: var(--fg);
  --ornament: var(--muted);
}

.grid, .spread {
  --edge: minmax(calc(var(--margin) - var(--gap)), 1fr);
  display: grid;
  column-gap: var(--gap);
  align-content: start;
  grid-template-columns:
    [full-start] var(--edge)
    [main-start aside-start text-start] minmax(0, var(--max))
    [main-end aside-end text-end] var(--edge) [full-end];
}
:is(.grid, .spread) > * { grid-column: main; min-width: 0; }
.spread { row-gap: var(--space-l); }

@media (min-width: 64em) {
  .grid, .spread {
    grid-template-columns:
      [full-start] var(--edge)
      [main-start aside-start] repeat(4, minmax(0, var(--col))) [aside-end]
      minmax(0, var(--col))
      [text-start] repeat(7, minmax(0, var(--col))) [text-end main-end]
      var(--edge) [full-end];
  }
  .spread { align-items: start; }
  .spread__side { grid-column: aside; }
  .spread__main { grid-column: text; }
  .spread--flip .spread__side { grid-column: 10 / main-end; }
  .spread--flip .spread__main { grid-column: main-start / 9; }
  .spread--halves .spread__side { grid-column: main-start / 8; }
  .spread--halves .spread__main { grid-column: 8 / main-end; }
  .spread--halves.spread--flip .spread__side { grid-column: 8 / main-end; }
  .spread--halves.spread--flip .spread__main { grid-column: main-start / 8; }
  .spread--center { align-items: center; }
  .spread--sticky .spread__side { position: sticky; top: calc(var(--header) + var(--space-l)); align-self: start; }
}
div:is(.spread__side, .spread__main):where(:not(.prose)) > * + * { margin-top: var(--space-l); }
div:is(.spread__side, .spread__main) > :is(.label + *, .title + .dek, .title + .standfirst) { margin-top: var(--space-s); }

main > :is(section, article) { counter-increment: folio; }
.section { margin-block: var(--space-section); }
.section.night { margin-block: 0; padding-block: var(--space-section); }
.section.night + .section.night { padding-top: 0; }
.section.night:has(> .bleed:last-child) { padding-bottom: var(--space-l); }
.section--tight { margin-block: var(--space-xl); }
:where(.label, .skip, .runhead, .more, .masthead__contents, .masthead__dates, .menu__close,
  .cover__dates, .attribution, .figures dt, .stats dt, .monument dt, .ranking dt, .lap__event,
  .drive__meta, .versus__table tbody th, .cast dt, .timeline--season time, .results thead th,
  .colophon__name span, .colophon__foot) {
  font: 500 var(--text-label)/1.45 var(--font-label);
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  text-wrap: balance;
}
:where(.credit, .lifebar, .picture-credits__who, .picture-credits__no),
:where(.plate figcaption, .bleed figcaption, .notes__list li)::before {
  font: 400 var(--text-credit)/1.45 var(--font-text);
  font-style: normal;
  letter-spacing: 0;
  text-transform: none;
  font-variant-numeric: tabular-nums lining-nums;
}
:where(.plate figcaption, .bleed figcaption, .attribution span, .ranking dd + dd, .results__date, .results__shared,
  .results__key, .toc__desc, .picture-credits__what, .colophon__set) {
  font: italic 400 var(--text-s)/1.45 var(--font-text);
  letter-spacing: 0;
  text-transform: none;
}

.label { color: var(--muted); }
.title, .opener__title {
  font: 400 var(--display-m)/1 var(--font-display);
  letter-spacing: -0.01em;
}
.title--chapter, .opener__title { font-size: var(--display-l); line-height: 0.96; letter-spacing: -0.015em; }
@media (min-width: 64em) { :is(.title.spread__side, .spread__side > .title) { font-size: min(var(--display-m), 4.8vw); } }
.dek { font: italic 400 var(--text-l)/1.4 var(--font-text); color: var(--fg-2); text-wrap: pretty; }
.standfirst { font: 350 var(--text-xl)/1.36 var(--font-text); text-wrap: pretty; }
.standfirst, .dek { max-width: 24em; }
.numeral {
  margin-block: var(--space-m) var(--space-s);
  font: 400 var(--display-m)/1 var(--font-display);
  letter-spacing: var(--track-caps);
}
.numeral:first-child { margin-top: 0; }
.numeral::after {
  content: ""; display: block; width: 5.5rem; height: 0.375rem; margin-top: var(--space-s);
  background: var(--ornament);
  -webkit-mask: var(--swell) center / 100% 100% no-repeat;
  mask: var(--swell) center / 100% 100% no-repeat;
}
.runhead {
  display: grid; grid-template-columns: minmax(2.5rem, 1fr) auto minmax(2.5rem, 1fr); align-items: baseline; column-gap: var(--space-s);
  padding-bottom: var(--space-xs);
  margin-bottom: var(--space-m);
  border-bottom: 3px double var(--rule-strong);
  text-align: center;
}
.runhead::before { content: ""; }
.runhead::after { content: counter(folio, decimal-leading-zero) / ""; justify-self: end; color: var(--muted); font-variant-numeric: tabular-nums; letter-spacing: 0.08em; }
.grid > * + .more { margin-top: var(--space-l); }
.more {
  display: inline-block; justify-self: start; vertical-align: top;
  min-height: var(--target); padding-block: 0.8rem;
  text-decoration: none;
}
.more::after {
  content: "\2060"; margin-left: 0.8rem; padding-left: 2.1rem;
  background: currentColor;
  -webkit-mask: var(--arrow) 0 55% / 1.75rem 0.75rem no-repeat;
  mask: var(--arrow) 0 55% / 1.75rem 0.75rem no-repeat;
}
.more:hover, .more:focus-visible { text-decoration: underline; text-underline-offset: 0.35em; }
.more:hover::after, .more:focus-visible::after { -webkit-mask-position: 100% 55%; mask-position: 100% 55%; }
.more--down::after { display: inline-block; width: 1.25rem; height: 0.75rem; padding: 0; rotate: 90deg; -webkit-mask-size: contain; mask-size: contain; }
.more--down:hover::after, .more--down:focus-visible::after { translate: 0 0.25rem; }
.mark {
  display: inline-block; flex: none; width: 2.5rem; height: 0.9rem;
  background: var(--ornament);
  -webkit-mask: var(--sprig) center / contain no-repeat;
  mask: var(--sprig) center / contain no-repeat;
}

.masthead {
  position: sticky; top: 0; z-index: 30;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  height: var(--header);
  padding-inline: var(--inset);
  background: var(--paper);
  border-bottom: 1px solid var(--rule);
  color: var(--fg);
}
.masthead :focus-visible { outline-color: currentColor; outline-offset: 0; }
.masthead__contents {
  justify-self: start;
  display: inline-flex; align-items: center; gap: 0.65rem;
  min-height: var(--target); padding: 0 0.75rem; margin-left: -0.75rem;
  border: 0; background: none; cursor: pointer;
}
.masthead__contents::before { content: ""; width: 1rem; height: 0.5rem; border-block: 1px solid currentColor; }
.masthead__title {
  display: inline-flex; align-items: center; min-height: var(--target);
  font: 400 var(--display-nav)/1 var(--font-display);
  text-decoration: none;
  white-space: nowrap;
}
.masthead__dates { justify-self: end; white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--muted); }
@media (max-width: 39.99em) {
  .masthead { grid-template-columns: 1fr auto; }
  .masthead__dates { display: none; }
}
@media (max-width: 26.99em) { .masthead__contents { gap: 0; padding-inline: 0.875rem; font-size: 0; } }
.masthead--over {
  position: fixed; inset: 0 0 auto;
  background: var(--leather); border-bottom-color: var(--leather); color: var(--on-leather);
}
.masthead--over .masthead__dates { color: var(--on-leather-muted); }
@supports not (animation-timeline: scroll()) { .masthead--over { position: absolute; } }

@supports (animation-timeline: scroll()) {
  .masthead::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px;
    background: var(--azure);
    transform-origin: 0 50%;
    animation: progress linear both;
    animation-timeline: scroll(root);
  }
  .masthead--over, .masthead--over .masthead__dates { animation: masthead-paper step-end both; animation-timeline: --cover; }
  .masthead--over .masthead__dates { animation-name: masthead-paper-dates; }
}
@keyframes progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes masthead-paper { to { background-color: var(--paper); border-bottom-color: var(--rule); color: var(--fg); } }
@keyframes masthead-paper-dates { to { color: var(--muted); } }

.menu {
  background: var(--paper);
  color: var(--fg);
  padding: 0 min(var(--margin), 2.5rem) var(--space-l);
}
.menu__head {
  display: flex; align-items: center; justify-content: space-between;
  min-height: var(--header);
  margin-bottom: var(--space-s);
  border-bottom: 3px double var(--rule-strong);
}
.menu__close { min-height: var(--target); padding: 0 0.75rem; margin-right: -0.75rem; border: 0; background: none; cursor: pointer; }
.menu:focus-visible, .menu :focus-visible { outline-offset: -2px; }
.menu__chapters a {
  display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); align-items: baseline;
  min-height: var(--target); padding-block: 0.35rem 0.45rem;
  border-bottom: 1px solid var(--rule);
  padding-inline: 0.35rem;
  font: 400 var(--display-menu)/1.1 var(--font-display);
  text-decoration: none;
  text-wrap: balance;
  box-shadow: inset 0 -2px transparent;
}
:is(.menu__num, .toc__num) { font: italic 400 var(--text-nav)/1 var(--font-text); color: var(--muted); }
.menu__chapters a:is(:hover, :focus-visible, [aria-current]) { box-shadow: inset 0 -2px var(--mark); }
.menu__chapters a:is(:hover, :focus-visible, [aria-current]) .menu__num { color: var(--fg); }
.menu > .label { margin: var(--space-l) 0 var(--space-xs); }
.menu__seasons {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--rule); border-left: 1px solid var(--rule);
}
.menu__seasons a {
  display: flex; align-items: center; justify-content: center; min-height: 3rem;
  border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
}
.menu__reference { display: flex; flex-wrap: wrap; column-gap: 1.25rem; }
.menu__reference a { display: inline-flex; align-items: center; min-height: var(--target); font-size: var(--text-nav); }

@supports selector(:popover-open) {
  .menu[popover] {
    position: fixed; inset: 0 auto 0 0;
    width: min(30rem, 100%); height: 100dvh; max-width: none; max-height: none;
    margin: 0; border: 0; border-right: 1px solid var(--rule);
    overflow-y: auto; overscroll-behavior: contain;
  }
  .menu[popover]::backdrop { background: color-mix(in srgb, var(--leather) 45%, transparent); }
  @media (prefers-reduced-motion: no-preference) {
    .menu[popover] { translate: -100% 0; }
    .menu[popover]::backdrop { opacity: 0; }
    .menu:is(:popover-open, :modal) { translate: none; }
    .menu:is(:popover-open, :modal)::backdrop { opacity: 1; }
    .menu[popover], .menu[popover]::backdrop { transition: translate 0.4s cubic-bezier(0.2, 0.7, 0.2, 1), opacity 0.4s ease, display 0.4s allow-discrete, overlay 0.4s allow-discrete; }
    @starting-style { .menu:is(:popover-open, :modal) { translate: -100% 0; } .menu:is(:popover-open, :modal)::backdrop { opacity: 0; } }
  }
}
@supports not selector(:popover-open) {
  .menu { display: block; position: static; width: auto; margin: 0; border: 0; }
}

.cover {
  position: relative; display: grid; min-height: 100svh;
  view-timeline: --cover block; view-timeline-inset: var(--header) 0;
}
.cover:has(.cover__portrait) {
  justify-items: center; align-content: center;
  padding: calc(var(--header) + var(--space-l)) var(--margin) var(--space-l);
  text-align: center;
  background: radial-gradient(60% 50% at 50% 45%, color-mix(in srgb, var(--leather), var(--on-leather) 5%), var(--leather));
}
.cover__portrait ~ .cover__text { display: contents; }
.cover__text > :is(.label, .cover__name) { order: -2; }
.cover__portrait { order: -1; }
.cover__text > .label { color: var(--celeste); }
.cover__name {
  display: flex; flex-direction: column; align-items: center;
  margin-block: var(--space-xs) 0;
  font: 400 min(20vw, 10.5rem, 17svh)/0.86 var(--font-display);
  letter-spacing: var(--track-caps); margin-right: calc(-1 * var(--track-caps));
  text-transform: uppercase;
}
.cover__name span:first-child { font-size: max(1.5rem, 0.3em); letter-spacing: 0.3em; margin: 0 -0.3em 0.45em 0; line-height: 1; }
.cover__portrait {
  --medal: min(62vw, 34svh, calc(var(--pw) * 1.25px));
  position: relative; width: var(--medal);
  margin: var(--space-l) 0 calc(var(--medal) * 0.22 + var(--space-m));
}
.cover__portrait img {
  width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: var(--focal, 50% 30%);
  border-radius: 50%;
  outline: 1px solid var(--celeste); outline-offset: 0.4rem;
}
.cover__portrait::after {
  content: ""; position: absolute; inset: 28.8% -24% -17.6%;
  background: var(--celeste);
  -webkit-mask: var(--wreath) center / 100% 100% no-repeat;
  mask: var(--wreath) center / 100% 100% no-repeat;
  pointer-events: none;
}
.cover__dates { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 0.35rem 0.9rem; color: var(--fg-2); }
.cover__dash { width: 2.5rem; height: 1px; background: currentColor; opacity: 0.6; }
.cover__places { margin-top: 0.4rem; font: italic 400 var(--text-nav)/1.4 var(--font-text); color: var(--muted); text-wrap: balance; }
@media (max-width: 22.49em) { .cover__places { font-size: var(--text-s); } }
.cover__standfirst { max-width: 30em; margin: var(--space-m) auto 0; font: 350 var(--text-l)/1.45 var(--font-text); text-wrap: balance; }
.cover__text > .more { justify-self: center; margin-top: var(--space-2xs); }
.cover__text > .credit { max-width: 32em; margin: var(--space-m) auto 0; }
@media (min-width: 40em) {
  .colophon { position: relative; }
  .cover:has(.cover__portrait)::after, .colophon::after {
    content: ""; position: absolute; inset: calc(var(--header) + 0.9rem) 0.9rem 0.9rem;
    border: 1px solid color-mix(in srgb, var(--on-leather) 16%, transparent);
    outline: 1px solid color-mix(in srgb, var(--on-leather) 10%, transparent); outline-offset: -6px;
    pointer-events: none;
  }
}
@media (min-width: 60em) and (orientation: landscape), (orientation: landscape) and (max-height: 30em) {
  .cover:has(.cover__portrait) {
    grid-template-columns: minmax(0, 1fr) auto; column-gap: clamp(1.5rem, 3vw, 4rem);
    align-items: center;
    padding-inline: max(var(--margin), (100% - 110rem) / 2);
  }
  .cover__portrait ~ .cover__text { display: block; grid-area: 1 / 1; justify-self: stretch; container-type: inline-size; }
  .cover__portrait { --medal: min(calc(var(--pw) * 1.25px), 33vw, 40rem, (100svh - var(--header) - 8rem) * 0.8); grid-area: 1 / 2; margin: 0 calc(var(--medal) * 0.24) calc(var(--medal) * 0.22); }
  .cover__name { font-size: min(14rem, 23cqi, 17svh); margin-block: var(--space-s) var(--space-l); }
}
@media (orientation: landscape) and (max-height: 30em) { .cover__portrait { align-self: start; } }
.cover--bleed { align-content: end; min-height: min(100svh, 60rem); }
.cover__photo { position: absolute; inset: 0; margin: 0; }
.cover__photo img { width: 100%; height: 100%; object-fit: cover; object-position: var(--focal, 50% 50%); }
.cover__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, color-mix(in srgb, var(--leather) 50%, transparent), transparent 55%); }
.cover--bleed .cover__text {
  position: relative; grid-column: 1 / -1; margin: 0; padding: 6rem var(--inset) var(--space-l);
  text-align: center;
  background: linear-gradient(transparent, color-mix(in srgb, var(--leather) 92%, transparent) 5rem, color-mix(in srgb, var(--leather) 96%, transparent));
}
.cover--bleed .cover__text .label { color: var(--celeste); letter-spacing: 0.3em; }
.cover__title { margin-block: var(--space-2xs) var(--space-xs); font: 400 var(--display-xl)/0.9 var(--font-display); letter-spacing: -0.015em; }
.cover__title + .cover__standfirst { max-width: none; margin-top: 0; font-style: italic; color: var(--fg-2); }
.cover--bleed .credit { margin-top: var(--space-m); }

.opener { padding-block: var(--space-xl) var(--space-section); row-gap: var(--space-l); text-align: center; }
.opener__text { grid-row: 1; justify-self: center; max-width: 46rem; }
.opener .numeral::after { margin-inline: auto; }
.opener__title { display: block; }
.opener__dek { display: block; margin-top: var(--space-s); font: italic 400 var(--text-xl)/1.3 var(--font-text); color: var(--fg-2); letter-spacing: 0; }
.opener .quote { max-width: 26em; margin: var(--space-l) auto 0; }
.opener__standfirst { max-width: 30em; margin: var(--space-m) auto 0; font: 400 var(--text-l)/1.5 var(--font-text); color: var(--fg-2); text-wrap: pretty; }
.opener--plate { --opener-h: 24rem; row-gap: 0; }
.opener--plate .opener__text { display: contents; }
.opener--plate .opener__text > * { grid-column: main; }
.opener--plate .quote { order: 1; }
.opener--plate .plate { --cap: min(100%, calc(var(--opener-h) * var(--ar) + 2 * var(--pad))); justify-self: center; margin-top: var(--space-l); }
.opener--wide .plate { width: 100%; }
@media (min-width: 64em) {
  .opener--plate { --opener-h: 36rem; }
  .opener--wide .plate { --cap: min(100%, 46rem + 2 * var(--pad)); }
  .opener--plate:not(.opener--wide) { row-gap: var(--space-l); align-items: center; }
  .opener--plate:not(.opener--wide) .opener__text { display: block; grid-column: text; }
  .opener--plate:not(.opener--wide) .plate { grid-column: aside; grid-row: 1; margin-top: 0; }
}

.epigraph { padding-inline: var(--margin); text-align: center; }
.statement { row-gap: var(--space-m); text-align: center; }
.statement > :not(.runhead) { justify-self: center; }
.statement .figures { justify-content: center; margin-top: var(--space-s); }
.statement .figures dt { margin-inline: auto; }

:is(.grid, .spread) > .prose { grid-column: text; }
.prose {
  hyphens: auto; -webkit-hyphens: auto;
  hyphenate-limit-chars: 9 3 4; -webkit-hyphenate-limit-before: 3; -webkit-hyphenate-limit-after: 4;
}
:where(.prose) > * { max-width: var(--measure); }
.prose p { text-wrap: pretty; }
.prose :is(p, p + .plate--aside, p + .quote--aside) + p { text-indent: 1.5em; }
.prose h2 { clear: both; margin-block: var(--space-xl) var(--space-s); font: 400 var(--display-s)/1.08 var(--font-display); hyphens: manual; }
.prose h3 { margin-block: var(--space-l) var(--space-3xs); font: 600 var(--text-m)/1.35 var(--font-text); hyphens: manual; }
.prose > :first-child { margin-top: 0; }
.prose :is(ul, ol) { margin-block: 1em; padding-left: 1.25em; }
.prose li + li { margin-top: 0.35em; }
.prose > :is(figure, .quote, .figures, table) { margin-block: var(--space-l); }
.prose > :last-child { margin-bottom: 0; }
.prose .lede { font-size: var(--text-l); line-height: 1.52; hyphens: manual; }
.lede::first-line { font-variant-caps: small-caps; letter-spacing: 0.03em; }
.lede::first-letter { float: left; margin: 0.06em 0.08em 0 0; font: 400 4.2em/0.8 var(--font-display); font-variant-caps: normal; letter-spacing: 0; }
@supports (initial-letter: 3) or (-webkit-initial-letter: 3) {
  .lede::first-letter { float: none; margin: 0 0.12em 0 0; font-size: 1em; line-height: 1; -webkit-initial-letter: 3; initial-letter: 3; }
}

.note-ref { font: 500 max(0.66em, 0.75rem)/0 var(--font-text); vertical-align: super; }
.note-ref a { padding-inline: 0.12em; text-decoration: none; color: var(--muted); }
.note-ref a:hover { color: var(--fg); }
:is(.note-ref a, .notes__back, .picture-credits__who a) { position: relative; }
:is(.note-ref a, .notes__back, .picture-credits__who a)::after { content: ""; position: absolute; inset: -0.9rem -0.3rem; }

@media (min-width: 64em) {
  .prose :is(.plate--aside, .quote--aside, .plate--wide) { --c: calc((100% - 6 * var(--gap)) / 7); }
  .prose :is(.plate--aside, .quote--aside) {
    float: left; clear: left;
    width: calc(4 * var(--c) + 3 * var(--gap));
    margin: 0.4em 0 var(--space-m) calc(-5 * (var(--c) + var(--gap)));
  }
  .prose .plate--wide {
    clear: both;
    width: calc(100% + 5 * (var(--c) + var(--gap)));
    max-width: calc(var(--pw, 9999) * 1.25px + 2 * var(--pad));
    margin-left: calc(-5 * (var(--c) + var(--gap)));
  }
}

.plate {
  --pad: var(--frame-pad);
  --cap: 100%;
  counter-increment: plate;
  max-width: min(var(--cap), calc(var(--pw, 9999) * 1.25px + 2 * var(--pad)));
}
.plate img {
  width: 100%;
  padding: calc(var(--pad) - 1px);
  border: 1px solid var(--frame);
  outline: 1px solid var(--frame); outline-offset: calc(-1 * var(--pad));
}
:where(.prose) > .plate { --cap: var(--measure); }
.plate--flush, .plate--wide, .plate--frame { --pad: 0px; }
:is(.plate--flush, .plate--wide, .plate--frame) img { padding: 0; border: 0; outline: 0; }
@media (min-width: 40em) and (max-width: 63.99em) {
  :where(.spread__side, .grid, .spread) > .plate:where(:not(.plate--flush)), :where(.prose) > .plate--aside { --cap: 26rem; }
}
.plate--small { --cap: 20rem; }
.plate--medium { --cap: 30rem; }
.plate--center { width: 100%; margin-inline: auto; }

.plate figcaption, .bleed figcaption {
  max-width: 34rem;
  margin: var(--space-xs) auto 0;
  color: var(--fg-2);
  text-align: center;
  text-wrap: balance;
}
.plate figcaption::before, .bleed figcaption::before { content: counter(plate, decimal-leading-zero) "\2002"; color: var(--fg); }
.credit { display: block; margin-top: 0.2rem; color: var(--muted); hyphens: manual; -webkit-hyphens: manual; }

.bleed {
  counter-increment: plate;
  grid-column: full;
  width: 100%;
  max-width: calc(var(--pw, 99999) * 1.25px);
  margin-inline: auto;
}
.bleed img { width: 100%; aspect-ratio: var(--ratio-narrow, 3 / 2); object-fit: cover; object-position: var(--focal, 50% 50%); }
.bleed figcaption { padding-inline: var(--margin); max-width: calc(34rem + 2 * var(--margin)); }
:is(.column, .prose) + .bleed, .bleed + :is(.column, .prose) { margin-top: var(--space-xl); }
.grid > .prose + * { margin-top: var(--space-xl); }
@media (min-width: 48em) { .bleed img { aspect-ratio: var(--ratio, 2.39); } }

.pair { display: flex; flex-direction: column; gap: var(--space-l) var(--gap); }
.pair > .plate { margin: 0; }
@media (min-width: 40em) {
  .pair { flex-direction: row; align-items: flex-start; }
  .pair > .plate { flex: var(--ar, 1) 1 calc(2 * var(--pad)); min-width: 0; }
}
.contact-sheet { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-l) var(--space-s); align-items: start; }
.plate--frame img { aspect-ratio: 3 / 2; object-fit: cover; object-position: var(--focal, 50% 35%); }
@media (hover: hover) { .contact-sheet:has(img:hover) img:not(:hover) { opacity: 0.45; } }
@media (min-width: 64em) { .contact-sheet { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.quote blockquote { font: italic 400 var(--display-s)/1.16 var(--font-display); letter-spacing: -0.005em; text-wrap: balance; hyphens: manual; -webkit-hyphens: manual; quotes: "\201C" "\201D"; }
.quote:not(.quote--inscription) blockquote p:first-child { text-indent: var(--hang, -0.46em); }
.quote:not(.quote--inscription) blockquote p:first-child::before { content: open-quote; color: var(--accent); }
.quote:not(.quote--inscription) blockquote p:last-child::after { content: close-quote; color: var(--accent); }
.quote:not(.quote--about) blockquote p::before, .quote:not(.quote--about) blockquote p::after { font-family: var(--font-text); letter-spacing: 0; }
.quote blockquote:lang(es) { quotes: "\AB" "\BB"; --hang: -0.5em; }
.quote blockquote p + p { margin-top: 0.4em; }

.quote--about { --hang: -0.47em; }
.quote--about blockquote:lang(es) { --hang: -0.49em; }
.quote--about blockquote { font: 300 var(--text-xl)/1.36 var(--font-text); letter-spacing: 0; }

.quote--epigraph blockquote { max-width: 17em; margin-inline: auto; font-size: clamp(2rem, 1.3rem + 3vw, 4rem); line-height: 1.1; }
.quote--statement blockquote { max-width: 14em; margin-inline: auto; font-size: var(--display-l); line-height: 1.04; }

.quote__translation { margin-top: var(--space-s); font: italic 400 var(--text-l)/1.42 var(--font-text); color: var(--fg-2); text-wrap: balance; }

.attribution {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.2rem 0.6rem;
  margin-top: var(--space-m);
}
.attribution::before { content: ""; flex: none; align-self: center; width: 1.75rem; height: 1px; background: currentColor; }
.attribution span { color: var(--muted); }
:is(.quote--epigraph, .quote--statement, .column, .opener) .attribution { justify-content: center; }
:is(.quote--epigraph, .quote--statement, .column, .opener) .attribution::before { display: none; }

.figures { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-s) clamp(2.5rem, 6vw, 6rem); }
.figures > div { display: flex; flex-direction: column; }
.figures dd { order: -1; font: 400 clamp(4.5rem, 2.8rem + 6.5vw, 9rem)/0.9 var(--font-display); letter-spacing: -0.02em; }
.figures dd i { font-size: max(1.5rem, 0.32em); letter-spacing: 0; color: var(--muted); }
.figures dt { margin-top: var(--space-xs); color: var(--muted); max-width: 12em; }
.figures--progress > div:first-child { order: 1; }
.figures--progress > div:last-child { order: 3; }
.figures--progress::after {
  content: ""; order: 2; align-self: center;
  width: clamp(2.5rem, 8vw, 6rem); height: 0.75rem; margin-top: -2rem;
  background: currentColor;
  -webkit-mask: var(--arrow-long) right center / 100% 100% no-repeat;
  mask: var(--arrow-long) right center / 100% 100% no-repeat;
}
.lap { border-top: 1px solid var(--rule-strong); }
.lap li {
  display: grid; grid-template-columns: 5rem minmax(0, 1fr); align-items: baseline;
  padding-block: 0.4rem;
  border-bottom: 1px solid var(--rule);
}
.lap__pos {
  font: 400 calc(2.25rem + var(--i, 0) * 0.75rem)/0.9 var(--font-display);
  color: color-mix(in srgb, var(--fg) calc(55% + var(--i, 0) * 11.25%), var(--bg));
}
.lap__event { color: var(--fg-2); }
.lap li:last-child .lap__event { color: var(--fg); }
@media (min-width: 48em) {
  .lap { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: var(--gap); border: 0; }
  .lap li { display: flex; flex-direction: column; justify-content: flex-end; gap: var(--space-xs); padding: var(--space-xs) 0 0; border: 0; border-top: 1px solid var(--rule-strong); }
  .lap li:last-child { border-top: 6px solid var(--mark); padding-top: calc(var(--space-xs) - 5px); }
  .lap__pos { font-size: calc(3rem + var(--i, 0) * 1.9rem); line-height: 0.8; }
}
.lap li:last-child .lap__pos { color: var(--mark); }
.stats { display: flex; flex-wrap: wrap; gap: var(--space-l) var(--gap); }
.stats > div { flex: 1 1 clamp(calc(25% - var(--gap)), (36rem - 100%) * 999, calc(50% - var(--gap))); display: flex; flex-direction: column; padding-top: var(--space-xs); border-top: 1px solid var(--rule-strong); }
.stats dd { order: -1; font: 400 var(--display-m)/0.92 var(--font-display); }
.stats dt { margin-top: var(--space-2xs); color: var(--muted); }
@media (max-width: 22.49em) { .stats dt { letter-spacing: 0.08em; } }
.grid > .title + * { margin-top: var(--space-s); }
.grid > .stats + .cast { margin-top: var(--space-l); }
.monument { display: flex; flex-direction: column; }
.monument dd:first-of-type {
  order: -1;
  font: 400 clamp(12rem, 5rem + 24vw, 27rem)/0.76 var(--font-display);
  letter-spacing: -0.03em; margin-left: -0.04em;
  color: var(--accent);
}
.monument dt { margin-top: var(--space-l); padding-top: var(--space-s); border-top: 1px solid var(--mark); max-width: 14rem; }
.monument dd + dd { margin-top: 0.35rem; font: italic 400 var(--text-l)/1.3 var(--font-text); color: var(--muted); }

.ranking { border-bottom: 1px solid var(--rule); }
.ranking > div {
  display: grid; grid-template-columns: 2.4em minmax(0, 1fr); align-items: baseline; column-gap: var(--space-m);
  padding-block: var(--space-xs);
  border-top: 1px solid var(--rule);
  font-size: clamp(2.25rem, 1.6rem + 2.6vw, 3.75rem);
}
.ranking dd:first-of-type { order: -1; font: 400 1em/1 var(--font-display); text-align: right; white-space: nowrap; }
.ranking dd + dd { grid-column: 2; color: var(--muted); }

.timeline { display: grid; grid-template-columns: max-content minmax(0, 1fr); column-gap: var(--space-m); }
.timeline li { display: grid; grid-column: 1 / -1; grid-template-columns: subgrid; align-items: baseline; padding-block: 0.3rem; }
.timeline time { text-align: right; white-space: nowrap; }
.timeline:not(.timeline--season) time { font: 400 var(--display-s)/1.05 var(--font-display); }
.timeline p { font-size: var(--text-m); line-height: 1.42; text-wrap: pretty; }
.timeline .is-title time { color: var(--accent); text-decoration: underline 2px var(--mark); text-underline-offset: 0.16em; text-decoration-skip-ink: none; }
.night .timeline .is-title time { text-decoration: none; }
.timeline--season { grid-template-columns: minmax(0, 1fr); }
.timeline--season time { text-align: left; }
.timeline p a { text-decoration-color: var(--rule); }
.timeline p a:is(:hover, :focus-visible) { text-decoration-color: currentColor; }
@media (min-width: 40em) {
  .timeline--season { grid-template-columns: minmax(10rem, max-content) minmax(0, 1fr); }
  .timeline--season time { text-align: right; }
}
.timeline--ruled li { padding-block: var(--space-xs); border-top: 1px solid var(--rule); }
.timeline--split li { break-inside: avoid; }
@media (min-width: 64em) {
  .timeline--split { display: block; columns: 2; column-gap: var(--gap); }
  .timeline--split li { grid-template-columns: 2.6em minmax(0, 1fr); column-gap: var(--space-m); font-size: var(--display-s); }
  .timeline--split p { font-size: var(--text-m); }
}

.lifebar {
  --span: calc(var(--to) - var(--from));
  --axis: 2.25rem;
  position: relative; height: 4.75rem;
  color: var(--muted);
}
.lifebar::before { content: ""; position: absolute; left: 0; right: 0; top: var(--axis); height: 1px; background: var(--fg); }
.lifebar__tick { position: absolute; top: calc(var(--axis) - 6px); left: calc((var(--at) - var(--from)) / var(--span) * 100%); width: 1px; height: 13px; background: var(--fg); }
.lifebar__tick--title { top: calc(var(--axis) - 10px); width: 5px; height: 21px; margin-left: -2px; background: var(--mark); }
.lifebar__range {
  position: absolute; top: calc(var(--axis) - 3px); height: 7px;
  left: calc((var(--start) - var(--from)) / var(--span) * 100%);
  right: calc((var(--to) - var(--end)) / var(--span) * 100%);
  background: var(--fg);
}
.lifebar__range span { position: absolute; left: 0; bottom: calc(100% + 0.9rem); white-space: nowrap; color: var(--fg); }
@media (max-width: 22.49em) { .lifebar__range span { left: auto; right: 0; } }
.lifebar__edge { position: absolute; top: calc(var(--axis) + 1.25rem); font-variant-numeric: tabular-nums; }
.lifebar__edge:last-child { right: 0; }

.results { --cell: 0.3rem; max-width: 52rem; }
.results caption { caption-side: top; padding-bottom: var(--space-s); text-align: left; }
.results table { width: 100%; font: 400 var(--text-s)/1.35 var(--font-text); font-variant-numeric: tabular-nums lining-nums; hyphens: manual; -webkit-hyphens: manual; }
.results thead th {
  padding: 0 var(--cell) 0.5rem; border-bottom: 3px double var(--rule-strong);
  color: var(--muted); text-align: left; white-space: nowrap; vertical-align: bottom;
  letter-spacing: 0.08em;
}
.results :is(td, tbody th, tfoot th) { padding: 0.65rem var(--cell); border-bottom: 1px solid var(--rule); vertical-align: baseline; text-align: left; }
.results tbody th { font-weight: 400; width: 100%; }
.results :is(th, td):first-child { padding-left: 0.7rem; }
.results td:first-child { color: var(--muted); }
.results :is(th, td):last-child { padding-right: 0; }
.results th[scope="row"] ~ td, .results thead th:nth-child(n + 3), .results:has(tbody th:first-child) thead th:nth-child(n + 2) { text-align: right; }
.results__race { display: block; font-size: var(--text-nav); }
.results__date { display: block; color: var(--muted); }
.results th .results__note { display: block; }
.results .has-note > * { border-bottom: 0; padding-bottom: 0.15rem; }
.results .results__more > * { padding-top: 0; }
.results .is-win > :first-child { box-shadow: inset 3px 0 var(--mark); }
.results .is-shared > :first-child {
  --dash: var(--muted);
  box-shadow: none;
  background: repeating-linear-gradient(var(--dash) 0 7px, transparent 0 11px) 0 0 / 3px 100% no-repeat;
}
.results .is-shared.is-win > :first-child { --dash: var(--mark); }
.results__shared { display: block; color: var(--fg-2); }
.results__shared::before {
  content: ""; display: inline-block; width: 0.72em; height: 0.72em; margin-right: 0.45em; vertical-align: -0.04em;
  border: 1px solid currentColor; border-radius: 50%;
  background: linear-gradient(90deg, currentColor 50%, transparent 0);
}
@media (max-width: 22.49em) { .results { --cell: 0.15rem; } .results thead th { letter-spacing: 0; } }
.results .is-pole td:nth-child(3) { font-weight: 700; color: var(--fg); }
.results__fl { position: absolute; margin: 0.28em 0 0 0.3em; font-size: 0.8em; letter-spacing: 0.08em; color: var(--muted); }
.results:has(.results__fl) td:nth-last-child(2) { padding-right: 1.9em; }
.results tfoot :is(th, td) { padding-top: var(--space-xs); border-top: 3px double var(--rule-strong); border-bottom: 0; font-weight: 600; }
.results__key { margin-top: var(--space-s); color: var(--muted); }
@media (min-width: 40em) { .results { --cell: 0.75rem; } }
.drive__head { container-type: inline-size; }
.drive__place { margin-top: var(--space-xs); font: 400 min(12rem, 16.5cqi)/0.88 var(--font-display); letter-spacing: -0.015em; }
.drive__meta { margin-top: var(--space-s); }
.drive__text { max-width: 28em; font-size: var(--text-l); line-height: 1.52; text-wrap: pretty; }
.drive { margin-top: var(--space-section); }
@media (min-width: 64em) {
  .drive:not(.spread--flip) > .more { grid-column: text; }
  .drive:not(.drive--card) > div:is(.spread__main, .spread__side) { display: contents; }
  .drive:not(.drive--card) .drive__head { grid-row: 1; grid-column: main; }
  .drive:not(.drive--card) :is(.drive__text, .spread__side > :not(.plate)) { grid-column: text; margin-top: 0; }
  .drive:not(.drive--card) .drive__text { grid-row: 2; }
  .drive:not(.drive--card) .spread__side > :not(.plate) { grid-row: 3; align-self: end; }
  .drive:not(.drive--card) .spread__side > .plate { grid-column: aside; grid-row: 2 / span 2; margin-top: 0; }
  .drive.spread--flip:not(.drive--card) :is(.drive__text, .spread__side > :not(.plate)) { grid-column: main-start / 9; }
  .drive.spread--flip:not(.drive--card) .spread__side > .plate { grid-column: 10 / main-end; }
  .drive:not(.drive--card) > .lap { grid-row: 4; }
  .drive:not(.drive--card) > .more { grid-row: 5; }
}
.drive--card .drive__head { text-align: center; }
.drive .numeral {
  display: grid; place-items: center; width: 1.5em; aspect-ratio: 1; margin: 0;
  border: 1px solid var(--fg); border-radius: 50%;
  outline: 3px solid var(--ornament); outline-offset: 4px;
  letter-spacing: 0;
}
.drive .numeral::after { display: none; }
.drive--card .numeral { margin-inline: auto; }
.versus__head { container-type: inline-size; padding-bottom: 0.15em; }
.versus__title { display: flex; align-items: baseline; justify-content: space-between; white-space: nowrap; font: 400 min(18rem, var(--fit, 14) * 1cqi)/0.9 var(--font-display); font-variation-settings: "opsz" 96; letter-spacing: -0.02em; }
.versus__amp { font-style: italic; font-size: max(1.5rem, 0.8em); color: var(--mark); }
.versus__table { width: 100%; font-variant-numeric: tabular-nums; }
.versus__table thead :is(th, td) { padding-bottom: var(--space-xs); border-bottom: 3px double var(--rule-strong); font: 400 var(--display-s)/1 var(--font-display); }
.versus__table :is(td, th) { padding: var(--space-xs) 0.25rem; border-bottom: 1px solid var(--rule); vertical-align: baseline; }
.versus__table :is(td, th):first-child { text-align: left; padding-left: 0; }
.versus__table :is(td, th):last-child { text-align: right; padding-right: 0; }
.versus__table tbody th { width: 38%; text-align: center; color: var(--muted); }
@media (max-width: 39.99em) { .versus__table tbody th { letter-spacing: 0.06em; } }
.versus__table td { font: 400 var(--text-l)/1.2 var(--font-text); }
@media (max-width: 23.74em) { .versus__table thead :is(th, td) { font-size: 1.5rem; } .versus__table :is(td, th) { padding-inline: 0.1rem; } .versus__table tbody th { letter-spacing: 0.03em; } }

.cast { border-bottom: 1px solid var(--rule); }
.cast > div { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); align-items: baseline; padding-block: var(--space-xs); border-top: 1px solid var(--rule); }
.cast dt { color: var(--muted); font-variant-numeric: tabular-nums; }
.cast dd { font: 400 max(1.5rem, var(--text-xl))/1.15 var(--font-display); text-wrap: balance; }
.cast--season > div { grid-template-columns: 7.5rem minmax(0, 1fr); column-gap: var(--space-xs); }
.cast--season dd { font: 400 var(--text-l)/1.35 var(--font-text); text-wrap: pretty; }
@media (max-width: 22.49em) { .cast--season dd { font-size: var(--text-m); } }

.display-list { border-bottom: 1px solid var(--rule); }
.display-list li { padding-block: 0.3em 0.4em; border-top: 1px solid var(--rule); font: 400 var(--display-s)/1.1 var(--font-display); text-wrap: balance; }

.toc__part { margin: var(--space-l) 0 var(--space-xs); }
.toc__list { border-bottom: 1px solid var(--rule); }
.toc__list a {
  display: grid; grid-template-columns: 3rem minmax(0, 1fr); align-items: baseline; column-gap: 0.25rem;
  min-height: var(--target); padding-block: 0.8rem 0.9rem;
  border-top: 1px solid var(--rule);
  text-decoration: none;
}
.toc__title { font: 400 var(--display-s)/1.08 var(--font-display); text-wrap: balance; }
.toc__title, :is(.menu__seasons, .menu__reference) a { text-decoration: underline 0.07em transparent; text-underline-offset: 0.16em; text-decoration-skip-ink: none; }
.toc__leader { display: none; }
.toc__desc { grid-column: 2 / -1; margin-top: 0.3rem; color: var(--fg-2); }
:is(.toc__list a:is(:hover, :focus-visible) .toc__title, :is(.menu__seasons, .menu__reference) a:is(:hover, :focus-visible, [aria-current])) { text-decoration-color: var(--mark); }
@media (min-width: 48em) {
  .toc__list a { grid-template-columns: 4rem auto minmax(2rem, 1fr); }
  .toc__leader { display: block; height: 0.5em; margin-left: 0.9rem; background: radial-gradient(circle, var(--muted) 0.07rem, transparent 0.1rem) 100% 100% / 0.6rem 0.3rem repeat-x; }
}

.pager { display: grid; grid-template-columns: 1fr 1fr; border-block: 3px double var(--rule-strong); }
.pager a { display: flex; flex-direction: column; gap: 0.4rem; min-height: var(--target); padding-block: var(--space-m); text-decoration: none; }
.pager a + a, .pager__next { grid-column: 2; align-items: flex-end; text-align: right; padding-left: var(--gap); border-left: 1px solid var(--rule); }
.pager__prev { padding-right: var(--gap); }
.pager__title { font: 400 var(--display-s)/1.04 var(--font-display); }
.pager a:hover .pager__title, .pager a:focus-visible .pager__title { font-style: italic; }

.notes { max-width: 40rem; font-size: var(--text-s); line-height: 1.55; }
.notes__list { counter-reset: note; border-bottom: 1px solid var(--rule); }
.notes__list li { counter-increment: note; display: grid; grid-template-columns: 2rem minmax(0, 1fr); padding-block: var(--space-2xs); border-top: 1px solid var(--rule); scroll-margin-top: calc(var(--header) + 2rem); }
.notes__list li::before { content: counter(note); line-height: 1.9; color: var(--muted); }
.notes__list p, .sources p { text-wrap: pretty; }
.notes__list li:target { background: color-mix(in srgb, var(--celeste) 18%, transparent); }
.notes__back { margin-left: 0.35em; text-decoration: none; }
.sources li { padding-left: 1.5em; text-indent: -1.5em; margin-bottom: var(--space-2xs); }

.picture-credits { border-bottom: 1px solid var(--rule); font-size: var(--text-s); line-height: 1.45; }
.picture-credits li {
  display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); column-gap: var(--space-s); row-gap: 0.15rem;
  padding-block: var(--space-xs); border-top: 1px solid var(--rule);
}
.picture-credits__no { grid-row: span 2; line-height: 1.9; }
.picture-credits__what { color: var(--fg-2); }
.picture-credits__who { color: var(--muted); }
@media (min-width: 48em) {
  .picture-credits li { grid-template-columns: 3rem minmax(0, 3fr) minmax(0, 2fr); align-items: baseline; }
  .picture-credits__no { grid-row: auto; }
  .picture-credits__who { text-align: right; }
}

.column { max-width: 40rem; margin-inline: auto; padding-inline: var(--margin); text-align: center; }
.column > * + * { margin-top: var(--space-l); }
.column :is(.plate, .plate figcaption) { margin-inline: auto; }
.column .quote { margin-top: var(--space-xl); }
.column > p:not([class]) { font-size: var(--text-l); line-height: 1.55; text-wrap: pretty; }

.colophon { padding-block: var(--space-xl) var(--space-l); row-gap: var(--space-xl); }
.colophon::after { top: 0.9rem; }
.colophon__name { font: 400 var(--display-m)/0.95 var(--font-display); }
.colophon__name span { display: block; margin-top: 0.6rem; color: var(--muted); }
.colophon__nav { display: grid; gap: var(--space-l) var(--gap); }
.colophon__nav .label { margin-bottom: var(--space-2xs); }
.colophon__nav a { display: inline-flex; align-items: center; min-height: var(--target); font-size: var(--text-nav); text-decoration: none; }
.colophon__nav a:hover { text-decoration: underline; }
:is(.colophon__seasons, .menu__seasons) a { font: 400 var(--display-nav)/1 var(--font-display); }
.colophon__chapters { columns: 2; column-gap: var(--gap); }
.colophon__seasons { display: grid; grid-template-columns: repeat(3, minmax(3.75rem, 1fr)); column-gap: var(--space-s); max-width: 18rem; }
.colophon__set { max-width: 34em; color: var(--fg-2); }
.colophon__foot {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2xs) var(--space-m);
  padding-top: var(--space-s); border-top: 3px double var(--rule);
  color: var(--muted);
}
.colophon__foot a { display: inline-flex; align-items: center; gap: 0.75rem; min-height: var(--target); color: var(--fg); text-decoration: none; }
@media (min-width: 48em) { .colophon__nav { grid-template-columns: 2fr 1fr 1fr; } }

@media screen and (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  html { scroll-behavior: smooth; }
  .cover__portrait img { animation: fade-in 1.8s ease both; }
  .cover__portrait::after { animation: fade-in 2.4s 0.4s ease both; }
  .cover__text > * { animation: rise 1s cubic-bezier(0.2, 0.7, 0.2, 1) both; }
  .cover__text > :nth-child(n + 3) { animation-delay: 0.15s; }
  .toc__title, :is(.menu__seasons, .menu__reference) a { transition: text-decoration-color 0.25s ease; }
  .menu__chapters a { transition: grid-template-columns 0.3s ease, box-shadow 0.3s ease; }
  .menu__chapters a:is(:hover, :focus-visible) { grid-template-columns: 3.25rem minmax(0, 1fr); }
  .menu__num { transition: color 0.3s ease; }
  .contact-sheet img { transition: opacity 0.4s ease; }
  .more::after { transition: -webkit-mask-position 0.25s ease, mask-position 0.25s ease, translate 0.25s ease; }

  @supports (animation-timeline: view()) {
    .plate--colour img { animation: develop linear both; animation-timeline: view(); animation-range: entry 10% entry 100%; }
    .versus__title > :first-child { animation: converge-left linear both; animation-timeline: view(); animation-range: entry 0% cover 40%; }
    .versus__title > :last-child { animation: converge-right linear both; animation-timeline: view(); animation-range: entry 0% cover 40%; }
  }
}
@keyframes fade-in { from { opacity: 0; } }
@keyframes rise { from { translate: 0 1.5rem; } }
@keyframes develop { from, 33% { filter: grayscale(1) contrast(1.06); } }
@keyframes converge-left { from { translate: calc(-1 * min(10cqi, var(--margin))) 0; } }
@keyframes converge-right { from { translate: min(10cqi, var(--margin)) 0; } }

@media (forced-colors: active) {
  .more::after, .figures--progress::after, .cover__dash, .attribution::before, .numeral::after, .mark,
  .cover__portrait::after, .lifebar::before, .lifebar__tick, .lifebar__range { forced-color-adjust: none; background: CanvasText; }
  .results__shared::before { forced-color-adjust: none; color: CanvasText; }
  .lifebar__range span { forced-color-adjust: auto; }
  .menu__chapters a:is(:hover, :focus-visible, [aria-current]) { text-decoration: underline; }
  .results .is-win > :first-child { border-left: 3px solid; }
  .results .is-shared > :first-child { background: none; border-left: 3px dashed; }
  .lap li:last-child { border-top-color: CanvasText; }
  .lap li:last-child .lap__pos { color: CanvasText; }
  :is(:is(.menu__seasons, .menu__reference) a:not(:hover, :focus-visible, [aria-current]), .toc__list a:not(:hover, :focus-visible) .toc__title) { text-decoration-line: none; }
  .toc__leader { forced-color-adjust: none; background-image: radial-gradient(circle, CanvasText 0.07rem, transparent 0.1rem); }
  :is(.cover__name, .title, .opener__title, .drive__place, .versus__title, .versus__amp,
    .monument dd:first-of-type, .figures dd, .figures dd i, .lap__pos) { forced-color-adjust: none; color: CanvasText; }
}

@media print {
  .masthead { position: static; }
  .skip, .menu, .pager, .more { display: none; }
  .masthead__contents { visibility: hidden; }
  .masthead::after { display: none; }
  .cover:not(.cover--bleed) { min-height: 0; }
  .cover__portrait { --medal: min(62vw, 26svh); margin-bottom: var(--space-m); }
  .cover__portrait::after { display: none; }
  :is(h1, h2, h3, .runhead, .label, .numeral, .drive__head, .opener__text) { break-after: avoid; break-inside: avoid; }
  :is(figure, .figures, .monument, .lap li, .stats > div, .ranking > div, .cast > div, .timeline li, .toc__list li, .colophon, .versus__table) { break-inside: avoid; }
  .spread { display: flex; flex-direction: column; padding-inline: var(--margin); }
  .drive__head { padding-top: 0.5rem; }
  :is(.night, .colophon, .masthead--over, .numeral, .attribution, .figures--progress, .lifebar, .results, .toc) { print-color-adjust: exact; }
}