:root {
  --font-brand: system-ui, sans-serif;
  --font-plain: system-ui, sans-serif;

  --space-0: 0;
  --space-25: 2px;
  --space-50: 4px;
  --space-75: 6px;
  --space-100: 8px;
  --space-125: 10px;
  --space-150: 12px;
  --space-175: 14px;
  --space-200: 16px;
  --space-250: 20px;
  --space-300: 24px;
  --space-350: 28px;
  --space-400: 32px;
  --space-450: 36px;
  --space-500: 40px;
  --space-600: 48px;
  --space-700: 56px;
  --space-800: 64px;
  --space-900: 72px;

  --radius-none: 0;
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-lg-inc: 20px;
  --radius-xl: 28px;
  --radius-xl-inc: 32px;
  --radius-2xl: 48px;
  --radius-full: 9999px;

  --type-display-large: 400 3.5625rem/calc(64 / 57) var(--font-brand);
  --type-display-medium: 400 2.8125rem/calc(52 / 45) var(--font-brand);
  --type-display-small: 400 2.25rem/calc(44 / 36) var(--font-brand);
  --type-headline-large: 400 2rem/calc(40 / 32) var(--font-brand);
  --type-headline-medium: 400 1.75rem/calc(36 / 28) var(--font-brand);
  --type-headline-small: 400 1.5rem/calc(32 / 24) var(--font-brand);
  --type-title-large: 400 1.375rem/calc(28 / 22) var(--font-brand);
  --type-title-medium: 500 1rem/calc(24 / 16) var(--font-plain);
  --type-title-small: 500 0.875rem/calc(20 / 14) var(--font-plain);
  --type-body-large: 400 1rem/calc(24 / 16) var(--font-plain);
  --type-body-medium: 400 0.875rem/calc(20 / 14) var(--font-plain);
  --type-body-small: 400 0.75rem/calc(16 / 12) var(--font-plain);
  --type-label-large: 500 0.875rem/calc(20 / 14) var(--font-plain);
  --type-label-medium: 500 0.75rem/calc(16 / 12) var(--font-plain);
  --type-label-small: 500 0.6875rem/calc(16 / 11) var(--font-plain);

  --track-display-large: -0.25px;
  --track-title-medium: 0.15px;
  --track-title-small: 0.1px;
  --track-body-large: 0.5px;
  --track-body-medium: 0.25px;
  --track-body-small: 0.4px;
  --track-label-large: 0.1px;
  --track-label-medium: 0.5px;
  --track-label-small: 0.5px;

  --state-hover: 0.08;
  --state-focus: 0.1;
  --state-pressed: 0.1;
  --state-drag: 0.16;
  --state-disabled: 0.38;

  --duration-short-1: 50ms;
  --duration-short-2: 100ms;
  --duration-short-3: 150ms;
  --duration-short-4: 200ms;
  --duration-medium-1: 250ms;
  --duration-medium-2: 300ms;
  --duration-medium-3: 350ms;
  --duration-medium-4: 400ms;
  --duration-long-1: 450ms;
  --duration-long-2: 500ms;
  --duration-long-3: 550ms;
  --duration-long-4: 600ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-standard-decelerate: cubic-bezier(0, 0, 0, 1);
  --ease-standard-accelerate: cubic-bezier(0.3, 0, 1, 1);
  --ease-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1);
  --ease-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15);

  --target-min: 48px;
}

img,
video,
iframe {
  max-inline-size: 100%;
  block-size: auto;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

:root {
  --font-brand: "Manrope", system-ui, sans-serif;
  --font-plain: "Manrope", system-ui, sans-serif;
  --font-display: "Cormorant Garamond", Georgia, serif;

  --color-surface: #141213;
  --color-surface-container: #1d1918;
  --color-surface-container-high: #262019;
  --color-on-surface: #d5b6a0;
  --color-heading: #f0e9df;
  --color-primary: #b53700;
  --color-title-note: #f44336;
  --color-footer-mail: var(--color-on-primary);
  --color-footer-mail-bg: var(--color-primary);
  --color-related-code: var(--color-primary);
  --color-on-primary: #fff;
  --color-secondary-container: #2a2422;
  --color-on-secondary-container: #f0e9df;
  --color-btn-glass: rgb(42 36 34 / 50%);
  --color-stroke: rgba(138, 125, 112, 0.22);
  --color-scrim: rgb(12 9 8 / 78%);
  --color-scrim-clear: rgb(12 9 8 / 0%);
  --color-on-scrim: #fff;
  --color-on-scrim-variant: var(--color-on-surface);
  --color-edge-back: #1d1916;
  --color-edge-footer-back: var(--color-surface-container);
  --color-mark: rgb(181 55 0 / 22%);
  --color-backdrop-top: rgb(20 18 19 / 35%);
  --color-backdrop-episode: rgb(20 18 19 / 70%);
  --color-list-bg: rgb(20 18 19 / 72%);
  --color-era-1: var(--color-primary);
  --color-era-2: #7d8fa8;
  --color-era-3: #b08f55;
  --color-era-4: #6f9ea3;
  --color-on-era: var(--color-surface);
  --color-on-era-1: var(--color-on-primary);
  --color-blob: rgb(181 55 0 / 55%);
  --color-tape-1-label: var(--color-primary);
  --color-tape-1-stripe: var(--color-heading);
  --color-tape-1-reel: var(--color-heading);
  --color-tape-2-label: var(--color-on-surface);
  --color-tape-2-stripe: var(--color-primary);
  --color-tape-2-reel: var(--color-primary);
  --color-tape-3-label: var(--color-heading);
  --color-tape-3-stripe: var(--color-surface-container-high);
  --color-tape-3-reel: var(--color-primary);
  --color-tape-4-label: var(--color-secondary-container);
  --color-tape-4-stripe: var(--color-on-surface);
  --color-tape-4-reel: var(--color-on-surface);
  --color-hero-fade: var(--color-surface-container-high);
  --color-hero-fade-clear: rgb(38 32 25 / 0%);
  --color-hero-glow: rgb(213 182 160 / 35%);
}

:root {
  --h1-weight: 700;
  --stroke-width: 1px;
  --stroke: var(--stroke-width) solid var(--color-stroke);
  --shape: var(--radius-xs);
  --focus-width: var(--space-25);
  --content-max: 75rem;
  --measure: 62ch;
  --ratio-frame: 16 / 9;
  --ratio-poster: 2 / 3;
  --ratio-portrait: 1;
  --ratio-tape: 48 / 30;
  --photo-gray: 1;
  --person-photo-share: 80%;
  --pane-fixed-expanded: 360px;
  --pane-fixed-large: 412px;
  --lines-card: 2;
  --turn-half: 180deg;
  --blob-turn-1: 8deg;
  --blob-turn-2: -10deg;
  --blob-turn-3: 12deg;
  --blob-turn-4: -7deg;
  --blob-turn-5: 9deg;
  --blob-turn-6: -12deg;
  --footer-col-min: 15rem;
  --season-menu-columns: 3;
  --menu-columns: 2;
}

:root {
  --page-margin: var(--space-200);
  --section-gap: var(--space-400);
  --grid-gap: var(--space-200);

  --type-label-phone: 500 0.8125rem/calc(18 / 13) var(--font-plain);
  --type-title-phone: 400 1.3125rem/calc(28 / 21) var(--font-brand);

  --btn-s-height: var(--space-400);
  --btn-s-pad: var(--space-150);
  --btn-s-gap: var(--space-50);
  --btn-s-icon: var(--space-200);
  --btn-s-font: var(--type-label-phone);
  --btn-s-track: var(--track-label-large);

  --btn-m-height: var(--space-500);
  --btn-m-pad: var(--space-200);
  --btn-m-gap: var(--space-100);
  --btn-m-icon: var(--space-250);
  --btn-m-font: var(--type-label-phone);
  --btn-m-track: var(--track-label-large);

  --btn-l-height: var(--space-500);
  --btn-l-pad: var(--space-200);
  --btn-l-gap: var(--space-100);
  --btn-l-icon: var(--space-250);
  --btn-l-font: var(--type-label-phone);
  --btn-l-track: var(--track-label-large);

  --menu-btn-m-font: var(--type-label-large);
  --menu-btn-s-font: var(--type-label-large);

  --head-pad: var(--space-100);
  --head-gap-row: var(--space-100);
  --head-gap-col: var(--space-200);
  --logo-height: var(--space-250);
  --brand-gap: var(--space-50);
  --brand-font: var(--type-body-small);
  --brand-track: var(--track-body-small);  --menu-gap: var(--space-100);
  --menu-toggle-size: var(--space-500);
  --menu-toggle-icon: var(--space-300);
  --drop-offset: var(--space-100);
  --drop-pad: var(--space-50);
  --drop-gap: var(--space-50);

  --hero-pad-start: var(--space-400);
  --hero-pad-end: var(--space-300);
  --hero-gap: var(--space-150);
  --hero-title-font: var(--type-headline-small);
  --episode-title-font: var(--type-title-phone);
  --hero-text-font: var(--type-body-medium);
  --hero-text-track: var(--track-body-medium);
  --hero-actions-gap: var(--space-100);
  --hero-actions-pad: var(--space-50);
  --edge-height: var(--space-500);
  --hero-glow-blur: var(--space-200);

  --section-title-font: var(--type-title-large);
  --section-head-gap-row: var(--space-100);
  --section-head-gap-col: var(--space-200);

  --tabs-gap: var(--space-50);

  --ep-gap: var(--space-150);
  --ep-badge-inset: var(--space-100);
  --ep-num-size: var(--space-400);
  --ep-num-font: var(--type-label-large);
  --ep-num-track: var(--track-label-large);
  --ep-score-height: var(--space-400);
  --ep-score-pad: var(--space-100);
  --ep-score-gap: var(--space-50);
  --ep-score-icon: var(--space-200);
  --ep-check-icon: var(--space-250);
  --ep-caption-fade: var(--space-500);
  --ep-caption-pad-inline: var(--space-200);
  --ep-caption-pad-end: var(--space-150);
  --ep-title-font: var(--type-title-large);
  --ep-sub-font: var(--type-body-small);
  --ep-sub-track: var(--track-body-small);
  --ep-text-font: var(--type-body-medium);
  --ep-text-track: var(--track-body-medium);

  --belt-gap: var(--space-150);
  --poster-gap: var(--space-50);
  --poster-name-font: var(--type-title-small);
  --poster-name-track: var(--track-title-small);
  --poster-meta-font: var(--type-body-small);
  --poster-meta-track: var(--track-body-small);
  --belt-bar-height: var(--space-50);

  --about-gap: var(--space-100);
  --about-font: var(--type-body-medium);
  --about-track: var(--track-body-medium);
  --facts-pad-block: var(--space-50);
  --facts-pad-inline: var(--space-150);
  --facts-row-pad: var(--space-100);
  --facts-row-gap-row: var(--space-25);
  --facts-row-gap-col: var(--space-100);
  --facts-term-font: var(--type-title-small);
  --facts-term-track: var(--track-title-small);

  --perk-pad: var(--space-200);
  --perk-gap: var(--space-150);
  --perk-mark-size: calc(2 * var(--space-600));
  --perk-title-font: var(--type-title-large);
  --perk-text-font: var(--type-body-medium);
  --perk-text-track: var(--track-body-medium);

  --road-num-size: var(--space-500);
  --road-num-font: var(--type-headline-large);
  --road-col-gap: var(--space-150);
  --road-gap: var(--space-50);
  --road-line-width: var(--space-25);
  --road-line-inset: var(--space-100);
  --road-title-font: var(--type-title-large);
  --road-text-font: var(--type-body-medium);
  --road-text-track: var(--track-body-medium);

  --tape-art: var(--space-800);
  --tape-col-gap: var(--space-200);
  --tape-gap: var(--space-50);
  --tape-pad: var(--space-200);
  --tape-title-font: var(--type-title-large);
  --tape-text-font: var(--type-body-medium);
  --tape-text-track: var(--track-body-medium);

  --watched-dim: 0.1;
  --tip-gap: var(--space-50);
  --tip-pad-block: var(--space-50);
  --tip-pad-inline: var(--space-100);
  --tip-font: var(--type-label-medium);
  --tip-track: var(--track-label-medium);
  --progress-height: var(--space-75);

  --season-gap: var(--space-100);
  --season-lines: 3;
  --season-measure: 80ch;
  --season-grid: minmax(0, 1fr);
  --season-poster: var(--space-500);
  --season-poster-align: start;
  --season-poster-self: start;
  --season-poster-ratio: var(--ratio-poster);
  --season-poster-contain: none;
  --season-poster-max: none;
  --season-over-font: var(--type-label-large);
  --season-over-track: var(--track-label-large);
  --season-tagline-font: var(--type-title-large);

  --backdrop-height: 30rem;
  --backdrop-blur: var(--space-500);
  --backdrop-opacity: 0.9;
  --backdrop-saturate: 1.4;
  --backdrop-scale: 1.2;

  --cast-nav-columns: 5;
  --cast-link-photo: 100%;
  --dossier-grid: minmax(0, 1fr);
  --dossier-grid-flip: var(--dossier-grid);
  --dossier-photo: 12rem;
  --dossier-flip-order: 0;
  --quote-pad: var(--space-200);
  --music-columns: 1;

  --podium-columns: 1;
  --podium-rank-font: var(--type-display-small);
  --seal-mini: var(--space-400);
  --top-row-grid: 2rem minmax(0, 1fr) auto auto;
  --top-rank-size: var(--space-400);
  --top-row-gap: var(--space-100);
  --top-seal: var(--space-300);
  --top-score-gap: var(--space-50);
  --top-score-font: var(--type-title-medium);
  --top-eye-size: var(--space-300);
  --top-eye-icon: var(--space-250);
  --top-thumb-display: none;

  --tracker-intro-grid: minmax(0, 1fr);
  --tracker-grid: minmax(0, 1fr);
  --tracker-pad: var(--space-200);
  --tracker-ring: var(--space-900);
  --tracker-ring-line: 8;
  --tracker-percent-font: var(--type-headline-large);
  --tracker-row-pad: var(--space-150);
  --track-head-grid: minmax(0, 1fr) auto;
  --track-progress-col: 1 / -1;
  --track-progress-order: 3;
  --cell-size: var(--space-400);

  --episode-grid: minmax(0, 1fr);
  --episode-gap: var(--space-200);
  --frames-template: none;
  --frames-track: 66%;
  --frames-overflow: auto;
  --list-eps-height: calc(8 * var(--target-min));
  --list-ep-num: var(--space-300);
  --list-ep-icon: var(--space-200);
  --list-ep-pad: var(--space-150);
  --side-lift: 0px;
  --scrollbar-size: var(--space-75);
  --seal-size: var(--space-800);
  --seal-ring: 4;
  --seal-line: 1.5;
  --scores-font: var(--type-headline-large);
  --monster-icon: var(--space-250);
  --monster-gap: var(--space-75);
  --track-pad: var(--space-150);
  --related-pad: var(--space-100);
  --related-code: var(--space-500);
  --related-gap: var(--space-150);
  --related-code-font: var(--type-label-medium);
  --related-code-track: var(--track-label-medium);
  --related-text-font: var(--type-body-medium);
  --related-text-track: var(--track-body-medium);

  --era-gap: var(--space-150);
  --era-tab-columns: 2;
  --era-tab-gap: var(--space-100);
  --era-tab-inner-gap: var(--space-25);
  --era-tab-pad: var(--space-150);
  --era-tab-indicator: 3px;
  --era-tab-name-font: var(--type-title-medium);
  --era-tab-note-font: var(--type-label-medium);
  --era-tab-note-track: var(--track-label-medium);
  --era-over-font: var(--type-label-large);
  --era-over-track: var(--track-label-large);
  --era-pad: var(--space-200);
  --era-body-gap: var(--space-150);
  --era-title-font: var(--type-headline-small);
  --era-chip-gap: var(--space-100);
  --era-chip-pad-block: var(--space-50);
  --era-chip-pad-inline: var(--space-100);
  --era-text-font: var(--type-body-medium);
  --era-text-track: var(--track-body-medium);

  --duo-gap: var(--space-400);
  --fact-gap: var(--space-200);
  --fact-dot: var(--space-150);
  --fact-dot-offset: var(--space-100);
  --fact-col-gap: var(--space-150);
  --fact-inner-gap: var(--space-50);
  --fact-title-font: var(--type-title-large);
  --fact-text-font: var(--type-body-medium);
  --fact-text-track: var(--track-body-medium);
  --faq-gap: var(--space-200);
  --faq-pad: var(--space-150);
  --faq-icon: var(--space-250);
  --faq-question-font: var(--type-title-large);
  --faq-answer-font: var(--type-body-medium);
  --faq-answer-track: var(--track-body-medium);

  --person-gap: var(--space-100);
  --person-name-font: var(--type-title-small);
  --person-name-track: var(--track-title-small);

  --note-pad: var(--space-150);
  --note-gap: var(--space-100);
  --note-title-font: var(--type-title-large);

  --footer-pad-end: var(--space-200);
  --footer-col-gap: var(--space-100);
  --footer-title-font: var(--type-title-medium);
  --footer-links-gap: var(--space-0);
  --footer-link-height: var(--space-400);
  --footer-end-pad-start: var(--space-150);
  --footer-end-pad-end: var(--space-200);
  --footer-end-gap: var(--space-100);
  --footer-mail-pad-block: var(--space-25);
  --footer-mail-pad-inline: var(--space-100);
  --footer-mail-radius: var(--radius-xs);
  --footer-end-font: var(--type-body-small);
  --footer-end-track: var(--track-body-small);

  --hero-grid: minmax(0, 1fr);
  --hero-pic-scale: 1;
  --about-grid: minmax(0, 1fr);
  --tiles-columns: 1;
  --season-tiles-columns: 1;
  --notes-columns: 1;
  --perks-columns: 1;
  --duo-columns: 1;
  --top-lead-span: 1;
  --road-columns: 1;
  --tapes-columns: 1;
  --cast-columns: 3;
  --belt-count: 3;
}

@media (width >= 37.5em) {
  :root {
    --page-margin: var(--space-300);
    --section-gap: var(--space-600);
    --grid-gap: var(--space-300);

    --btn-s-height: var(--space-350);
    --btn-s-pad: var(--space-125);
    --btn-s-gap: var(--space-50);
    --btn-s-icon: var(--space-200);
    --btn-s-font: var(--type-label-medium);
    --btn-s-track: var(--track-label-medium);

    --btn-m-height: var(--space-400);
    --btn-m-pad: var(--space-150);
    --btn-m-gap: var(--space-50);
    --btn-m-icon: var(--space-200);
    --btn-m-font: var(--type-label-large);
    --btn-m-track: var(--track-label-large);

    --btn-l-height: var(--space-500);
    --btn-l-pad: var(--space-200);
    --btn-l-gap: var(--space-100);
    --btn-l-icon: var(--space-250);
    --btn-l-font: var(--type-label-large);
    --btn-l-track: var(--track-label-large);

    --menu-btn-m-font: var(--btn-m-font);
    --menu-btn-s-font: var(--btn-s-font);

    --head-pad: var(--space-150);
    --head-gap-row: var(--space-150);
    --head-gap-col: var(--space-300);
    --logo-height: var(--space-300);
    --brand-gap: var(--space-50);
    --menu-gap: var(--space-100);
    --drop-pad: var(--space-100);
    --drop-gap: var(--space-50);

    --hero-pad-start: var(--space-500);
    --hero-pad-end: var(--space-400);
    --hero-gap: var(--space-200);
    --hero-title-font: var(--type-headline-medium);
    --episode-title-font: var(--hero-title-font);
    --hero-text-font: var(--type-body-large);
    --hero-text-track: var(--track-body-large);
    --hero-actions-gap: var(--space-150);
    --hero-actions-pad: var(--space-100);
    --edge-height: var(--space-600);

    --section-title-font: var(--type-headline-small);
    --section-head-gap-row: var(--space-100);
    --section-head-gap-col: var(--space-200);

    --tabs-gap: var(--space-50);

    --ep-gap: var(--space-150);
    --ep-badge-inset: var(--space-100);
    --ep-num-size: var(--space-400);
    --ep-num-font: var(--type-label-large);
    --ep-num-track: var(--track-label-large);
    --ep-score-height: var(--space-400);
    --ep-score-pad: var(--space-100);
    --ep-score-gap: var(--space-50);
    --ep-score-icon: var(--space-200);
    --ep-caption-fade: var(--space-500);
    --ep-caption-pad-inline: var(--space-200);
    --ep-caption-pad-end: var(--space-150);

    --belt-gap: var(--space-200);
    --poster-gap: var(--space-50);
    --belt-bar-height: var(--space-75);

    --about-gap: var(--space-150);
    --about-font: var(--type-body-large);
    --about-track: var(--track-body-large);
    --facts-pad-block: var(--space-100);
    --facts-pad-inline: var(--space-200);
    --facts-row-pad: var(--space-150);
    --facts-row-gap-row: var(--space-50);
    --facts-row-gap-col: var(--space-100);

    --person-gap: var(--space-150);

    --note-pad: var(--space-200);
    --note-gap: var(--space-100);

    --footer-pad-end: var(--space-300);
    --footer-col-gap: var(--space-150);
    --footer-links-gap: var(--space-50);
    --footer-link-height: var(--space-400);
    --footer-end-pad-start: var(--space-200);
    --footer-end-pad-end: var(--space-300);

    --perk-pad: var(--space-250);

    --era-tab-columns: 4;
    --podium-columns: 3;
    --top-row-grid: 3rem 8rem minmax(0, 1fr) auto auto;
    --top-rank-size: var(--space-500);
    --top-row-gap: var(--space-200);
    --top-seal: var(--space-400);
    --top-score-gap: var(--space-100);
    --top-score-font: var(--type-title-large);
    --top-eye-size: var(--space-400);
    --top-eye-icon: var(--space-250);
    --top-thumb-display: block;
    --track-head-grid: 7rem minmax(0, 1fr) auto;
    --track-progress-col: auto;
    --cell-size: var(--space-450);
    --track-progress-order: 0;
    --dossier-grid: minmax(0, 15rem) minmax(0, 1fr);
    --dossier-photo: 100%;
    --frames-template: repeat(3, minmax(0, 1fr));
    --frames-track: auto;
    --frames-overflow: visible;
    --scores-font: var(--type-display-small);
    --seal-size: var(--space-900);
    --episode-gap: var(--space-300);
    --season-poster: 12.5rem;
    --related-pad: var(--space-150);
    --related-code: var(--space-600);
    --related-gap: var(--space-200);
    --related-code-font: var(--type-label-large);
    --related-code-track: var(--track-label-large);
    --related-text-font: var(--type-body-large);
    --related-text-track: var(--track-body-large);
    --season-gap: var(--space-150);
    --fact-gap: var(--space-300);
    --faq-pad: var(--space-200);
    --era-tab-pad: var(--space-200);
    --era-pad: var(--space-300);
    --era-tab-name-font: var(--type-title-large);
    --era-title-font: var(--type-headline-medium);
    --era-text-font: var(--type-body-large);
    --era-text-track: var(--track-body-large);

    --road-num-size: var(--space-600);
    --road-col-gap: var(--space-200);
    --road-gap: var(--space-100);

    --tape-art: var(--space-900);
    --tape-col-gap: var(--space-300);
    --tape-gap: var(--space-100);
    --tape-pad: var(--space-250);

    --tiles-columns: 2;
    --season-tiles-columns: 2;
    --notes-columns: 2;
    --perks-columns: 2;
    --top-lead-span: 2;
    --belt-count: 4;
  }
}

@media (width >= 52.5em) {
  :root {
    --section-gap: var(--space-800);

    --btn-s-height: var(--space-400);
    --btn-s-pad: var(--space-150);
    --btn-s-gap: var(--space-50);
    --btn-s-icon: var(--space-200);
    --btn-s-font: var(--type-label-large);
    --btn-s-track: var(--track-label-large);

    --btn-m-height: var(--space-500);
    --btn-m-pad: var(--space-200);
    --btn-m-gap: var(--space-100);
    --btn-m-icon: var(--space-250);

    --btn-l-height: var(--space-600);
    --btn-l-pad: var(--space-250);
    --btn-l-gap: var(--space-100);
    --btn-l-icon: var(--space-250);

    --head-pad: var(--space-200);
    --head-gap-row: var(--space-200);
    --brand-gap: var(--space-100);
    --menu-gap: var(--space-150);

    --hero-pad-start: var(--space-800);
    --hero-pad-end: var(--space-700);
    --hero-title-font: var(--type-display-small);
    --edge-height: var(--space-800);
    --hero-glow-blur: var(--space-300);

    --section-title-font: var(--type-headline-medium);
    --section-head-gap-col: var(--space-300);

    --tabs-gap: var(--space-100);

    --ep-badge-inset: var(--space-150);

    --belt-bar-height: var(--space-100);

    --about-gap: var(--space-200);

    --person-gap: var(--space-150);

    --note-pad: var(--space-300);
    --note-gap: var(--space-150);

    --perk-pad: var(--space-300);
    --perk-gap: var(--space-200);
    --perk-mark-size: calc(2 * var(--space-800));

    --road-num-font: var(--type-display-small);

    --era-gap: var(--space-200);
    --era-pad: var(--space-500);
    --era-title-font: var(--type-headline-large);
    --top-row-gap: var(--space-300);
    --top-score-gap: var(--space-150);
    --top-score-font: var(--type-headline-small);
    --season-poster: 15rem;
    --related-pad: var(--space-200);
    --related-code: var(--space-700);
    --season-poster-align: end;
    --season-poster-self: stretch;
    --season-poster-ratio: auto;
    --season-poster-contain: size;
    --season-poster-max: 22.5rem;
    --tracker-intro-grid: minmax(0, 1fr) var(--pane-fixed-expanded);
    --tracker-ring: calc(2 * var(--space-600));
    --tracker-percent-font: var(--type-display-small);
    --tracker-pad: var(--space-300);
    --cast-nav-columns: 10;
    --dossier-grid: minmax(0, 18rem) minmax(0, 1fr);
    --dossier-flip-order: 1;
    --dossier-grid-flip: minmax(0, 1fr) minmax(0, 18rem);
    --backdrop-height: 42rem;
    --episode-grid: minmax(0, 1fr) var(--pane-fixed-expanded);
    --side-lift: calc(var(--space-400) + var(--season-gap));
    --list-eps-height: calc(10 * var(--target-min));
    --season-grid: minmax(0, 1fr) var(--season-poster);
    --season-tagline-font: var(--type-headline-small);
    --duo-gap: var(--space-600);
    --era-min-height: calc(5 * var(--space-900));
    --era-text-share: 11fr;
    --era-shot-share: 9fr;
    --era-shot-fade: 35%;    --road-gap: var(--space-150);
    --road-line-inset: var(--space-150);

    --tape-art: calc(2 * var(--space-500));
    --tape-pad: var(--space-300);

    --footer-links-gap: var(--space-50);
    --footer-link-height: var(--space-300);

    --tapes-columns: 2;
    --duo-columns: 2;
    --hero-grid: minmax(0, 7fr) minmax(0, 6fr);
    --hero-pic-scale: 1.1;
    --about-grid: minmax(0, 1fr) var(--pane-fixed-expanded);
    --cast-columns: 6;
    --belt-count: 6;
  }
}

@media (width >= 75em) {
  :root {
    --about-grid: minmax(0, 1fr) var(--pane-fixed-large);
    --tracker-intro-grid: minmax(0, 1fr) var(--pane-fixed-large);
    --tiles-columns: 4;
    --season-tiles-columns: 3;
    --notes-columns: 3;
    --perks-columns: 3;
    --road-columns: 4;
    --episode-grid: minmax(0, 1fr) var(--pane-fixed-large);
    --belt-count: 8;
  }
}