:root {
  --c-brand: #00c3a9;
  --c-brand-hi: #2ad9b8;
  --c-brand-deep: #00a08b;
  --c-brand-wash: #e8faf6;
  --c-brand-ring: rgba(0, 195, 169, 0.28);
  --c-ink: #15161a;
  --c-text: #32343a;
  --c-sub: #65676e;
  --c-mute: #7c7f87;
  --c-faint: #9ea1a8;
  --c-quiet: #6a6b6e;
  --c-line: #d9d9d9;
  --c-line-soft: #ebecee;
  --c-page: #ffffff;
  --c-tint: #f5f5f5;
  --c-desk: #f5f6f7;
  --c-sheet: #ffffff;
  --c-field: #f0f1f3;
  --c-foot: #32343a;
  --c-foot-head: #eeeeee;
  --c-foot-link: rgba(255, 255, 255, 0.65);
  --c-foot-copy: #98999c;
  --c-foot-rule: rgba(255, 255, 255, 0.12);
  --c-rank-1: #087d6e;
  --c-rank-2: #009e89;
  --c-rank-3: #00b49c;
  --c-rank-rest: #eef0f2;
  --c-action: #087d6e;
  --c-action-line: #c9e5de;
  --c-index-hover: #f6faf9;
  --c-on-dark: #ffffff;
  --c-scrim: rgba(21, 22, 26, 0.5);
  --c-shadow: rgba(21, 22, 26, 0.08);
  --c-shadow-lift: rgba(21, 22, 26, 0.16);
  --c-star: #faad14;
  --c-video: #202a2c;
  --c-lockbg: #f2f3f5;
  --c-tile-a1: #2b1d5e;
  --c-tile-a2: #6247b3;
  --c-tile-b1: #10344f;
  --c-tile-b2: #2d78ad;
  --c-tile-c1: #561634;
  --c-tile-c2: #b8467a;
  --c-tile-d1: #173f3a;
  --c-tile-d2: #23917d;
  --c-tile-e1: #3e2a10;
  --c-tile-e2: #aa7330;
  --grad-brand: linear-gradient(90deg, #2ad9b8 0%, #00c3a9 100%);
  --grad-miss: linear-gradient(135deg, #2ad9b8 0%, #00a08b 100%);
  --fold-fade: linear-gradient(#000000 65%, transparent);
  --ff: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --fw-reg: 400;
  --fw-med: 500;
  --fw-semi: 600;
  --fw-bold: 700;
  --fw-heavy: 800;
  --fs-2xs: 12px;
  --logo-h: 32px;
  --logo-h-sm: 28px;
  --logo-foot-h: 36px;
  --fs-xs: 13px;
  --fs-sm: 14px;
  --fs-board: 15px;
  --fs-md: 16px;
  --fs-lg: 17px;
  --fs-xl: 18px;
  --fs-2xl: 20px;
  --fs-3xl: 22px;
  --fs-4xl: 24px;
  --fs-5xl: 26px;
  --fs-6xl: 28px;
  --fs-brand: 30px;
  --fs-label: 24px;
  --fs-code: 96px;
  --lh-none: 1;
  --lh-tight: 1.25;
  --lh-base: 1.5;
  --lh-read: 1.7;
  --lh-blurb: 20px;
  --ls-tight: -0.01em;
  --ls-wide: 0.06em;
  --s-0: 2px;
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-7: 28px;
  --s-8: 32px;
  --s-9: 40px;
  --s-10: 48px;
  --s-11: 56px;
  --s-12: 64px;
  --s-13: 80px;
  --r-xs: 3px;
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 10px;
  --r-xl: 12px;
  --r-2xl: 16px;
  --r-pill: 999px;
  --bw: 1px;
  --bw-2: 2px;
  --bw-3: 3px;
  --shell: 1080px;
  --gutter: 24px;
  --topbar-h: 64px;
  --tap: 44px;
  --board-cover: 84px;
  --board-cover-mobile: 72px;
  --board-column: 320px;
  --strip-cover: 120px;
  --strip-cover-mobile: 88px;
  --strip-title-line: 22px;
  --strip-action: 96px;
  --poster-play: 56px;
  --player-h: 60vh;
  --player-h-stable: 60svh;
  --player-clearance: calc(var(--topbar-h) + var(--tap) + var(--s-2) * 2 + var(--s-6) * 2);
  --catalog-rail: 152px;
  --narrow: 760px;
  --drawer-w: 300px;
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --anim-fast: 0.15s;
  --anim-mid: 0.25s;
  --anim-lift: -2px;
  --anim-zoom: 1.04;
  --z-top: 50;
  --z-scrim: 55;
  --z-drawer: 60;
  --elev-1: 0 2px 8px var(--c-shadow);
  --elev-2: 0 10px 28px var(--c-shadow-lift);
  --elev-cta: 0 4px 12px var(--c-brand-ring);
  --ico-trend: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round' d='M4 17l6-6 4 3 6-9M14 5h6v6'/%3E%3C/svg%3E");
  --ico-new: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round' d='M12 3v6M9 6h6M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-7M8 15h8'/%3E%3C/svg%3E");
  --ico-shelf: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round' d='M4 4h4v14H4zM10 4h4v14h-4zM16 5l3-1 3 13-3 1zM3 21h19'/%3E%3C/svg%3E");
  --ico-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M11 4a7 7 0 1 1 0 14a7 7 0 1 1 0-14zM16.5 16.5L20 20'/%3E%3C/svg%3E");
  --ico-menu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E");
  --ico-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
  --ico-chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M9 5l7 7-7 7'/%3E%3C/svg%3E");
  --ico-left: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M15 5l-7 7 7 7'/%3E%3C/svg%3E");
  --ico-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --ico-up: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M6 15l6-6 6 6M5 4h14'/%3E%3C/svg%3E");
  --ico-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
  --ico-play: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M8 4.8v14.4c0 .8.9 1.3 1.6.9l11.2-7.2c.6-.4.6-1.4 0-1.8L9.6 3.9C8.9 3.5 8 4 8 4.8z'/%3E%3C/svg%3E");
  --ico-lock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M6 11h12v9H6zM8.5 11V8a3.5 3.5 0 0 1 7 0v3'/%3E%3C/svg%3E");
  --ico-star: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2.8l2.8 5.7 6.2.9-4.5 4.4 1.1 6.2L12 17l-5.6 3 1.1-6.2L3 9.4l6.2-.9z'/%3E%3C/svg%3E");
  --ico-list: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M9 6h11M9 12h11M9 18h11M4.5 6h.01M4.5 12h.01M4.5 18h.01'/%3E%3C/svg%3E");
  --ico-info: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 3a9 9 0 1 1 0 18a9 9 0 1 1 0-18zM12 11v6M12 7.5v.01'/%3E%3C/svg%3E");
  --ico-link: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M10 14a4 4 0 0 0 5.7 0l3-3a4 4 0 0 0-5.7-5.7l-1 1M14 10a4 4 0 0 0-5.7 0l-3 3a4 4 0 0 0 5.7 5.7l1-1'/%3E%3C/svg%3E");
  --ico-fb: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M14 8.5h3V4.6h-3.2c-3 0-4.6 1.9-4.6 4.7v2H7v3.9h2.2V22h4.1v-6.8h3l.6-3.9h-3.6V9.6c0-.7.3-1.1.7-1.1z'/%3E%3C/svg%3E");
  --ico-x: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3.5 3.5h5l4.2 5.8 5-5.8h2.3l-6.2 7.2 6.9 9.8h-5l-4.6-6.4-5.6 6.4H3.2l6.6-7.6z'/%3E%3C/svg%3E");
  --ico-wa: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 3.2a8.8 8.8 0 0 0-7.6 13.2L3.3 20.7l4.4-1.1A8.8 8.8 0 1 0 12 3.2z'/%3E%3Cpath fill='black' d='M9.1 7.6c.3 0 .5 0 .7.5l.8 1.9c.1.3 0 .5-.1.7l-.6.7c.6 1.2 1.6 2.2 2.8 2.8l.7-.6c.2-.2.4-.2.7-.1l1.9.8c.4.2.5.4.5.7 0 1.1-1 2-2.2 2-3.6 0-6.9-3.3-6.9-6.9 0-1.2.9-2.5 1.7-2.5z'/%3E%3C/svg%3E");
}

@media (max-width: 1199px) {
  :root {
    --fs-label: 22px;
  }
}

@media (max-width: 767px) {
  :root {
    --gutter: 16px;
    --fs-4xl: 22px;
    --fs-5xl: 22px;
    --fs-6xl: 24px;
    --fs-label: 20px;
    --fs-brand: 26px;
    --fs-code: 72px;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --anim-fast: 0s;
    --anim-mid: 0s;
    --anim-lift: 0px;
    --anim-zoom: 1;
  }
  html {
    scroll-behavior: auto;
  }
}

@font-face {
  font-family: "Inter";
  src: url("../fonts/inter-var.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--topbar-h) + var(--s-4));
}

html.is-locked {
  overflow: hidden;
}

body {
  margin: 0;
  font-family: var(--ff);
  font-size: var(--fs-sm);
  line-height: var(--lh-base);
  color: var(--c-text);
  background: var(--c-page);
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

body > main {
  flex: 1 0 auto;
}

img {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--anim-fast) var(--ease);
}

a:hover {
  color: var(--c-brand);
}

h1,
h2,
h3,
h4 {
  margin: 0;
  color: var(--c-ink);
  font-weight: var(--fw-semi);
  line-height: var(--lh-tight);
}

p,
dl,
dd,
figure,
blockquote {
  margin: 0;
}

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}

input {
  font: inherit;
}

:focus-visible {
  outline: var(--bw-2) solid var(--c-brand);
  outline-offset: var(--bw-2);
}

.u-sr {
  position: absolute !important;
  width: var(--bw) !important;
  height: var(--bw) !important;
  padding: 0 !important;
  margin: calc(var(--bw) * -1) !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.l-shell {
  width: 100%;
  max-width: calc(var(--shell) + var(--gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.l-narrow {
  max-width: var(--narrow);
}

.l-band {
  padding-block: var(--s-10);
}

.l-band--tint {
  background: var(--c-tint);
}

.l-band--joined {
  padding-top: 0;
}

.c-genreband:nth-of-type(even) {
  background: var(--c-tint);
}

.c-glyph {
  --g: 16px;
  display: inline-block;
  flex-shrink: 0;
  width: var(--g);
  height: var(--g);
  background: currentColor;
  -webkit-mask: var(--ico) center / contain no-repeat;
  mask: var(--ico) center / contain no-repeat;
}

.c-glyph--trend { --ico: var(--ico-trend); }
.c-glyph--new { --ico: var(--ico-new); }
.c-glyph--shelf { --ico: var(--ico-shelf); }
.c-glyph--search { --ico: var(--ico-search); --g: 20px; }
.c-glyph--menu { --ico: var(--ico-menu); --g: 24px; }
.c-glyph--close { --ico: var(--ico-close); --g: 22px; }
.c-glyph--chev { --ico: var(--ico-chev); --g: 14px; }
.c-glyph--left { --ico: var(--ico-left); --g: 18px; }
.c-glyph--down { --ico: var(--ico-down); --g: 14px; }
.c-glyph--up { --ico: var(--ico-up); --g: 18px; }
.c-glyph--arrow { --ico: var(--ico-arrow); --g: 16px; }
.c-glyph--play { --ico: var(--ico-play); --g: 16px; }
.c-glyph--lock { --ico: var(--ico-lock); --g: 14px; }
.c-glyph--star { --ico: var(--ico-star); --g: 20px; }
.c-glyph--list { --ico: var(--ico-list); --g: 26px; }
.c-glyph--info { --ico: var(--ico-info); --g: 26px; }
.c-glyph--link { --ico: var(--ico-link); --g: 20px; }
.c-glyph--fb { --ico: var(--ico-fb); --g: 22px; }
.c-glyph--x { --ico: var(--ico-x); --g: 19px; }
.c-glyph--wa { --ico: var(--ico-wa); --g: 22px; }

.c-topbar {
  position: sticky;
  top: 0;
  z-index: var(--z-top);
  background: var(--c-page);
  border-bottom: var(--bw) solid var(--c-line-soft);
}

.c-topbar__row {
  display: flex;
  align-items: center;
  gap: var(--s-8);
  height: var(--topbar-h);
}

.c-wordmark {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  min-height: var(--tap);
  min-width: 0;
  flex-shrink: 0;
  color: var(--c-ink);
}

.c-wordmark:hover {
  color: var(--c-ink);
}

.c-wordmark__icon {
  --mark: 32px;
  width: var(--mark);
  height: var(--mark);
  flex-shrink: 0;
  background: url("../images/logo-mark.svg") center / contain no-repeat;
}

.c-wordmark__img {
  display: block;
  width: auto;
  height: var(--logo-h);
}

.c-closer__logo {
  display: block;
  width: auto;
  height: var(--logo-foot-h);
}

.c-wordmark__name {
  font-size: var(--fs-2xl);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-tight);
  white-space: nowrap;
}

.c-navline {
  flex: 1 1 auto;
  min-width: 0;
}

.c-navline__list {
  display: flex;
  align-items: center;
  gap: var(--s-7);
}

.c-navline__link {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap);
  font-size: var(--fs-md);
  font-weight: var(--fw-semi);
  color: var(--c-text);
  white-space: nowrap;
}

.c-navline__link:hover,
.c-navline__link.is-on {
  color: var(--c-brand);
}

.c-topbar__end {
  display: flex;
  align-items: center;
  gap: var(--s-1);
  margin-left: auto;
}

.c-seek {
  display: flex;
  align-items: center;
  padding-left: var(--s-4);
  background: var(--c-field);
  border: var(--bw) solid transparent;
  border-radius: var(--r-pill);
  transition: border-color var(--anim-fast) var(--ease), background-color var(--anim-fast) var(--ease);
}

.c-seek:focus-within {
  background: var(--c-page);
  border-color: var(--c-brand);
}

.c-seek__field {
  --fw: 180px;
  width: var(--fw);
  min-width: 0;
  height: var(--tap);
  padding: 0;
  border: 0;
  background: transparent;
  font-size: var(--fs-sm);
  color: var(--c-ink);
  outline: 0;
  -webkit-appearance: none;
  appearance: none;
}

.c-seek__field::placeholder {
  color: var(--c-faint);
}

.c-seek__field::-webkit-search-cancel-button {
  -webkit-appearance: none;
}

.c-seek__go {
  display: grid;
  place-items: center;
  width: var(--tap);
  height: var(--tap);
  border-radius: var(--r-pill);
  color: var(--c-text);
}

.c-seek__go:hover {
  color: var(--c-brand);
}

.c-topbar__btn {
  display: none;
  place-items: center;
  width: var(--tap);
  height: var(--tap);
  border-radius: var(--r-md);
  color: var(--c-ink);
}

.c-topbar__btn:hover {
  color: var(--c-brand);
}

.c-topbar__scrim {
  display: none;
}

.c-bandhead {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--s-4);
  margin-bottom: var(--s-7);
}

.c-bandhead__title {
  min-width: 0;
  font-size: var(--fs-5xl);
  font-weight: var(--fw-semi);
  letter-spacing: var(--ls-tight);
}

.c-bandhead__title a,
.c-linkset__title a {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap);
}

.c-bandhead__title a:hover {
  color: var(--c-brand);
}

.c-bandhead__title--solo {
  margin-bottom: var(--s-6);
}

.c-bandhead--sm {
  margin-bottom: var(--s-5);
}

.c-bandhead--sm .c-bandhead__title {
  font-size: var(--fs-2xl);
}

.c-more {
  display: inline-flex;
  align-items: center;
  gap: var(--s-1);
  min-height: var(--tap);
  flex-shrink: 0;
  font-size: var(--fs-md);
  font-weight: var(--fw-med);
  color: var(--c-brand);
  white-space: nowrap;
}

.c-more:hover {
  color: var(--c-brand-deep);
}

.c-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--s-10);
}

.c-board__col {
  min-width: 0;
}

.c-board__head {
  position: relative;
  padding-bottom: var(--s-4);
  border-bottom: var(--bw) solid var(--c-line-soft);
}

.c-board__head::after {
  content: "";
  position: absolute;
  bottom: calc(var(--bw) * -1);
  left: 0;
  width: var(--s-8);
  height: var(--bw-2);
  background: var(--c-brand);
}

.c-board__label {
  display: flex;
  align-items: center;
  gap: var(--s-2);
  font-size: var(--fs-board);
  font-weight: var(--fw-bold);
  line-height: var(--lh-base);
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
}

.c-board__icon {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: var(--s-8);
  height: var(--s-8);
  border-radius: var(--r-md);
  background: var(--c-brand-wash);
  color: var(--c-action);
}

.c-board__icon .c-glyph {
  --g: var(--s-5);
}

.c-board__desc {
  margin-top: var(--s-2);
  color: var(--c-sub);
  font-size: var(--fs-xs);
}

.c-board__list {
  display: grid;
  gap: var(--s-6);
  margin-top: var(--s-6);
  counter-reset: rank;
}

.c-boardrow {
  --cw: var(--board-cover);
  position: relative;
  display: grid;
  grid-template-columns: var(--cw) minmax(0, 1fr);
  gap: var(--s-4);
  counter-increment: rank;
}

.c-boardrow::before,
.c-strips--chart .c-strip::before {
  content: counter(rank);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: grid;
  place-items: center;
  min-width: var(--s-6);
  height: var(--s-6);
  padding-inline: var(--s-1);
  border-radius: var(--r-md) 0 var(--r-md) 0;
  background: var(--c-rank-3);
  color: var(--c-on-dark);
  font-size: var(--fs-2xs);
  font-weight: var(--fw-semi);
  font-variant-numeric: tabular-nums;
  line-height: var(--lh-none);
}

.c-boardrow:nth-child(1)::before,
.c-strips--chart .c-strip:nth-child(1)::before {
  background: var(--c-rank-1);
}

.c-boardrow:nth-child(2)::before,
.c-strips--chart .c-strip:nth-child(2)::before {
  background: var(--c-rank-2);
}

.c-boardrow:nth-child(3)::before,
.c-strips--chart .c-strip:nth-child(3)::before {
  background: var(--c-rank-3);
}

.c-boardrow:nth-child(n + 4)::before,
.c-strips--chart .c-strip:nth-child(n + 4)::before {
  background: var(--c-rank-rest);
  color: var(--c-text);
}

.c-boardrow:nth-child(n + 6)::before,
.c-strips--chart .c-strip:nth-child(n + 6)::before {
  display: none;
}

.c-boardrow__body {
  min-width: 0;
}

.c-boardrow__name {
  display: block;
  overflow: hidden;
  font-size: var(--fs-md);
  font-weight: var(--fw-semi);
  line-height: var(--lh-tight);
  color: var(--c-ink);
  white-space: nowrap;
  text-overflow: ellipsis;
}

.c-boardrow__name::after,
.c-strip__link::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
}

.c-boardrow:hover .c-boardrow__name,
.c-strip:hover .c-strip__link {
  color: var(--c-brand);
}

.c-boardrow:hover .c-cover__img,
.c-strip:hover .c-cover__img {
  transform: scale(var(--anim-zoom));
}

.c-boardrow__blurb {
  display: -webkit-box;
  margin-top: var(--s-2);
  overflow: hidden;
  font-size: var(--fs-sm);
  line-height: var(--lh-blurb);
  color: var(--c-text);
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.c-boardrow__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-2);
  margin-top: var(--s-3);
  font-size: var(--fs-2xs);
  color: var(--c-faint);
}

.c-boardrow__state,
.c-strip__state,
.c-dramahead__state {
  text-transform: capitalize;
}

.c-boardrow__state:empty,
.c-strip__state:empty,
.c-dramahead__state:empty {
  display: none;
}

.c-board__foot {
  display: flex;
  justify-content: center;
  margin-top: var(--s-8);
}

.c-unfold {
  display: inline-flex;
  align-items: center;
  gap: var(--s-1);
  min-height: var(--tap);
  font-size: var(--fs-sm);
  color: var(--c-quiet);
}

.c-pill {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  height: var(--s-5);
  padding-inline: var(--s-2);
  overflow: hidden;
  border: var(--bw) solid var(--c-line);
  border-radius: var(--r-pill);
  font-size: var(--fs-2xs);
  line-height: var(--lh-none);
  color: var(--c-faint);
  white-space: nowrap;
  text-overflow: ellipsis;
}

.c-pill:empty {
  display: none;
}

.c-pill--lg {
  position: relative;
  height: var(--s-7);
  padding-inline: var(--s-3);
  font-size: var(--fs-sm);
  color: var(--c-sub);
  overflow: visible;
}

a.c-pill--lg::after {
  content: "";
  position: absolute;
  inset: calc((var(--tap) - var(--s-7)) / -2) 0;
}

a.c-pill--lg:hover {
  border-color: var(--c-brand);
  color: var(--c-brand);
}

.c-pill--tap {
  gap: var(--s-2);
  height: var(--tap);
  padding-inline: var(--s-5);
  background: var(--c-page);
  font-size: var(--fs-md);
  color: var(--c-ink);
}

.c-pill--tap:hover {
  border-color: var(--c-brand);
  color: var(--c-brand);
}

.c-pill__count {
  font-size: var(--fs-2xs);
  color: var(--c-faint);
}

.c-pillset {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-3);
  margin-top: var(--s-5);
}

.c-pillset--cloud {
  margin-top: 0;
}

.c-cover {
  --r-cover: var(--r-md);
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 3 / 4;
  border-radius: var(--r-cover);
  background: var(--c-field);
}

.c-cover--sm {
  aspect-ratio: 3 / 4;
}

.c-cover--md {
  --r-cover: var(--r-lg);
}

.c-cover--cell,
.c-cover--lg {
  --r-cover: var(--r-xl);
}

.c-cover__alt {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--s-2);
  font-size: var(--fs-2xs);
  color: var(--c-mute);
  text-align: center;
}

.c-cover__img {
  position: relative;
  width: 100%;
  height: 100%;
  object-fit: cover;
  color: transparent;
  transition: transform var(--anim-mid) var(--ease);
}

.c-cover__img.is-broken {
  visibility: hidden;
}

.c-cells {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: var(--s-9) var(--s-7);
}

.c-cell {
  min-width: 0;
}

.c-cell__link {
  display: flex;
  flex-direction: column;
  color: var(--c-ink);
}

.c-cell__link:hover .c-cover__img {
  transform: scale(var(--anim-zoom));
}

.c-cell__name {
  display: -webkit-box;
  margin-top: var(--s-3);
  overflow: hidden;
  font-size: var(--fs-xl);
  font-weight: var(--fw-semi);
  line-height: var(--lh-tight);
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.c-cell__link:hover .c-cell__name {
  color: var(--c-brand);
}

.c-cell__sub {
  margin-top: var(--s-2);
  font-size: var(--fs-xs);
  color: var(--c-mute);
}

.c-tiles {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-4);
}

.c-tiles li:nth-child(5n + 1) { --t1: var(--c-tile-a1); --t2: var(--c-tile-a2); }
.c-tiles li:nth-child(5n + 2) { --t1: var(--c-tile-b1); --t2: var(--c-tile-b2); }
.c-tiles li:nth-child(5n + 3) { --t1: var(--c-tile-c1); --t2: var(--c-tile-c2); }
.c-tiles li:nth-child(5n + 4) { --t1: var(--c-tile-d1); --t2: var(--c-tile-d2); }
.c-tiles li:nth-child(5n + 5) { --t1: var(--c-tile-e1); --t2: var(--c-tile-e2); }

.c-tiles__item {
  --tw: 163px;
  --th: 74px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--tw);
  min-height: var(--th);
  padding: var(--s-2) var(--s-3);
  border-radius: var(--r-xl);
  background: linear-gradient(135deg, var(--t1) 0%, var(--t2) 100%);
  box-shadow: var(--elev-1);
  color: var(--c-on-dark);
  font-size: var(--fs-xl);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
  text-align: center;
  transition: transform var(--anim-mid) var(--ease), box-shadow var(--anim-mid) var(--ease);
}

.c-tiles__item:hover {
  color: var(--c-on-dark);
  box-shadow: var(--elev-2);
  transform: translateY(var(--anim-lift));
}

.c-strips {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--s-4) var(--s-8);
}

.c-strip {
  --cw: var(--strip-cover);
  position: relative;
  display: grid;
  grid-template-columns: var(--cw) minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr) var(--tap);
  gap: var(--s-2) var(--s-4);
  min-width: 0;
  padding-bottom: var(--s-4);
  border-bottom: var(--bw) solid var(--c-line-soft);
  transition: background var(--anim-fast) var(--ease);
}

.c-strip:hover,
.c-strip:focus-within {
  background: var(--c-index-hover);
}

.c-strip > .c-cover {
  grid-column: 1;
  grid-row: 1 / span 2;
  align-self: start;
  width: var(--cw);
}

.c-strip__body {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}

.c-strip__name {
  display: -webkit-box;
  max-height: calc(var(--strip-title-line) * 2);
  overflow: hidden;
  font-size: var(--fs-md);
  font-weight: var(--fw-semi);
  line-height: var(--strip-title-line);
  overflow-wrap: anywhere;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.c-strip__link {
  display: block;
  color: var(--c-ink);
}

.c-strip__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-2);
  min-height: var(--s-5);
  font-size: var(--fs-2xs);
  color: var(--c-sub);
}

.c-strip__meta .c-pill {
  color: var(--c-sub);
}

.c-strip__blurb {
  display: -webkit-box;
  max-height: calc(var(--lh-blurb) * 2);
  margin-top: var(--s-2);
  overflow: hidden;
  font-size: var(--fs-sm);
  line-height: var(--lh-blurb);
  color: var(--c-sub);
  overflow-wrap: anywhere;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.c-strip__go {
  position: relative;
  z-index: 3;
  grid-column: 2;
  grid-row: 2;
  align-self: end;
  justify-self: start;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--s-2);
  min-width: var(--strip-action);
  min-height: var(--tap);
  padding-inline: var(--s-2);
  border: var(--bw) solid var(--c-action-line);
  border-radius: var(--r-md);
  background: var(--c-page);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semi);
  color: var(--c-action);
  transition: background var(--anim-fast) var(--ease), border-color var(--anim-fast) var(--ease);
}

.c-strip__go:hover,
.c-strip__go:focus-visible {
  border-color: var(--c-action);
  background: var(--c-brand-wash);
  color: var(--c-action);
}

.c-strip__go .c-glyph {
  --g: var(--s-3);
}

.c-strip__state--footer {
  grid-column: 2;
  grid-row: 2;
  justify-self: end;
  align-self: center;
  max-width: calc(100% - var(--strip-action) - var(--s-2));
  overflow: hidden;
  color: var(--c-sub);
  font-size: var(--fs-2xs);
  white-space: nowrap;
  text-overflow: ellipsis;
}

.c-strips--pair {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.c-strips--chart {
  counter-reset: rank;
}

.c-strips--chart .c-strip {
  counter-increment: rank;
}

.c-trail {
  padding-block: var(--s-2);
}

.c-trail__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  font-size: var(--fs-xs);
  color: var(--c-mute);
}

.c-trail__item {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  max-width: 100%;
}

.c-trail__item + .c-trail__item::before {
  content: "";
  flex-shrink: 0;
  width: var(--s-3);
  height: var(--s-3);
  margin-inline: var(--s-2);
  background: currentColor;
  -webkit-mask: var(--ico-chev) center / contain no-repeat;
  mask: var(--ico-chev) center / contain no-repeat;
}

.c-trail__link {
  display: inline-flex;
  align-items: center;
  min-width: var(--s-6);
  min-height: var(--tap);
}

.c-trail__item[aria-current] {
  display: block;
  overflow: hidden;
  color: var(--c-ink);
  white-space: nowrap;
  text-overflow: ellipsis;
}

.c-trail__item[aria-current]::before {
  display: inline-block;
  vertical-align: middle;
}

.c-listpage {
  padding-bottom: var(--s-12);
}

.c-pagehead {
  margin: var(--s-2) 0 var(--s-6);
}

.c-listpage > .c-pagehead:first-child {
  margin-top: var(--s-8);
}

.c-pagehead__title {
  font-size: var(--fs-3xl);
  font-weight: var(--fw-semi);
}

.c-pagehead__desc {
  margin-top: var(--s-2);
  font-size: var(--fs-sm);
  color: var(--c-sub);
}

.c-pagehead--catalog .c-pagehead__title {
  font-size: var(--fs-4xl);
  letter-spacing: var(--ls-tight);
}

.c-pagehead--catalog .c-pagehead__desc {
  max-width: var(--narrow);
}

.c-tabs {
  display: flex;
  gap: var(--s-2);
  max-width: 100%;
  margin-top: var(--s-6);
  overflow-x: auto;
  border-bottom: var(--bw) solid var(--c-line-soft);
  overscroll-behavior-x: contain;
}

.c-tabs__item {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-width: var(--tap);
  min-height: var(--s-10);
  padding-inline: var(--s-4);
  border-bottom: var(--bw-2) solid transparent;
  font-size: var(--fs-sm);
  font-weight: var(--fw-semi);
  color: var(--c-sub);
  white-space: nowrap;
}

.c-tabs__item:hover {
  color: var(--c-action);
  background: var(--c-index-hover);
}

.c-tabs__item.is-on {
  border-bottom-color: var(--c-brand);
  color: var(--c-action);
}

.c-pagenav {
  display: flex;
  justify-content: center;
  margin-top: var(--s-10);
}

.c-pagelinks {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--s-2);
}

.c-pagelinks__a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--tap);
  height: var(--tap);
  padding-inline: var(--s-3);
  border: var(--bw) solid var(--c-line);
  border-radius: var(--r-md);
  font-size: var(--fs-sm);
  color: var(--c-text);
}

.c-pagelinks__a:hover {
  border-color: var(--c-brand);
  color: var(--c-brand);
}

.c-pagelinks__a.is-on {
  background: var(--c-brand);
  border-color: var(--c-brand);
  color: var(--c-on-dark);
}

.c-void {
  --vw: 440px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--s-2);
  padding: var(--s-12) var(--s-4);
  text-align: center;
}

.c-void__icon {
  --vi: 64px;
  display: grid;
  place-items: center;
  width: var(--vi);
  height: var(--vi);
  border-radius: var(--r-pill);
  background: var(--c-brand-wash);
}

.c-void__icon::after {
  content: "";
  width: 45%;
  height: 45%;
  background: var(--c-brand);
  -webkit-mask: var(--ico-play) center / contain no-repeat;
  mask: var(--ico-play) center / contain no-repeat;
}

.c-void__title {
  margin-top: var(--s-2);
  font-size: var(--fs-xl);
  font-weight: var(--fw-semi);
  color: var(--c-ink);
}

.c-void__desc {
  max-width: var(--vw);
  font-size: var(--fs-sm);
  color: var(--c-sub);
}

.c-void__act {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--s-3);
  margin-top: var(--s-4);
}

.c-void__seek {
  display: flex;
  gap: var(--s-2);
  width: min(100%, var(--vw));
  margin-top: var(--s-4);
}

.c-void__seek .c-seek__field {
  flex: 1 1 auto;
  width: auto;
  height: var(--tap);
  padding-inline: var(--s-4);
  border: var(--bw) solid var(--c-line);
  border-radius: var(--r-pill);
  background: var(--c-page);
}

.c-void__seek .c-seek__field:focus {
  border-color: var(--c-brand);
}

.c-cta {
  --cta-w: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--s-2);
  min-width: var(--cta-w);
  min-height: var(--tap);
  padding-inline: var(--s-7);
  border-radius: var(--r-pill);
  background: var(--grad-brand);
  box-shadow: var(--elev-cta);
  color: var(--c-on-dark);
  font-size: var(--fs-md);
  font-weight: var(--fw-semi);
  white-space: nowrap;
  transition: transform var(--anim-fast) var(--ease), box-shadow var(--anim-fast) var(--ease);
}

.c-cta:hover {
  color: var(--c-on-dark);
  transform: translateY(var(--anim-lift));
}

.c-cta--block {
  width: 100%;
}

.c-cta.is-busy,
.c-ghostbtn.is-busy,
.c-strip__go.is-busy {
  opacity: 0.7;
  pointer-events: none;
}

.c-ghostbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--s-2);
  min-height: var(--tap);
  padding-inline: var(--s-5);
  border: var(--bw) solid var(--c-line);
  border-radius: var(--r-pill);
  background: var(--c-page);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semi);
  color: var(--c-text);
  white-space: nowrap;
}

.c-ghostbtn:hover {
  border-color: var(--c-brand);
  color: var(--c-brand);
}

.c-ghostbtn--brand {
  border-color: var(--c-brand);
  color: var(--c-brand);
}

.c-ghostbtn--brand:hover {
  background: var(--c-brand-wash);
}

.c-textlink {
  color: var(--c-brand);
  text-decoration: underline;
  text-underline-offset: var(--s-0);
}

.c-dramahead {
  padding-bottom: var(--s-8);
  background: var(--c-desk);
}

.c-dramahead__grid {
  --pw: 208px;
  display: grid;
  grid-template-columns: var(--pw) minmax(0, 1fr);
  gap: var(--s-8);
  align-items: start;
  margin-top: var(--s-3);
}

.c-dramahead__poster {
  position: relative;
}

.c-dramahead__play {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  width: var(--poster-play);
  height: var(--poster-play);
  border: var(--bw-2) solid var(--c-on-dark);
  border-radius: var(--r-pill);
  background: var(--c-action);
  color: var(--c-on-dark);
  box-shadow: var(--elev-1);
  transform: translate(-50%, -50%);
}

.c-dramahead__play:hover,
.c-dramahead__play:focus-visible {
  background: var(--c-brand-deep);
}

.c-dramahead__poster .c-cover {
  box-shadow: var(--elev-2);
}

.c-dramahead__info {
  min-width: 0;
  padding-top: var(--s-2);
}

.c-dramahead__title {
  font-size: var(--fs-6xl);
  font-weight: var(--fw-semi);
  letter-spacing: var(--ls-tight);
  overflow-wrap: anywhere;
}

.c-dramahead__line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 var(--s-2);
  margin-top: var(--s-1);
  font-size: var(--fs-sm);
  color: var(--c-mute);
}

.c-dramahead__line > :not(:empty) ~ :not(:empty)::before {
  content: "\00b7";
  margin-right: var(--s-2);
}

.c-dramahead__genre {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap);
  color: var(--c-sub);
}

.c-stats {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-3) var(--s-8);
  margin-top: var(--s-5);
  padding-top: var(--s-3);
  border-top: var(--bw) solid var(--c-line-soft);
}

.c-stats__item {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-width: 0;
}

.c-stats__key {
  font-size: var(--fs-xs);
  color: var(--c-mute);
}

.c-stats__val {
  display: flex;
  align-items: center;
  gap: var(--s-1);
  min-height: var(--tap);
  font-size: var(--fs-md);
  font-weight: var(--fw-semi);
  line-height: var(--lh-tight);
  color: var(--c-text);
}

.c-stats__val a {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap);
}

.c-stats__val a:hover {
  color: var(--c-brand);
}

.c-stats__val--text {
  font-size: var(--fs-md);
  font-weight: var(--fw-semi);
}

.c-stats__val .c-glyph--star {
  color: var(--c-star);
}

.c-dramahead__act {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: var(--s-4);
  margin-top: var(--s-3);
}

.c-dramahead__act .c-cta {
  --cta-w: 260px;
}

.c-sharebar {
  display: flex;
  align-items: center;
  gap: var(--s-1);
  font-size: var(--fs-sm);
  color: var(--c-sub);
}

.c-sharebar__label {
  margin-right: var(--s-2);
}

.c-sharebar__btn {
  display: grid;
  place-items: center;
  width: var(--tap);
  height: var(--tap);
  border-radius: var(--r-pill);
  color: var(--c-sub);
  transition: background-color var(--anim-fast) var(--ease), color var(--anim-fast) var(--ease);
}

.c-sharebar__btn:hover,
.c-sharebar__btn.is-done {
  background: var(--c-page);
  color: var(--c-brand);
}

.c-drama__body {
  padding-bottom: var(--s-12);
}

.c-block {
  margin-top: var(--s-10);
}

.c-block__title {
  margin-bottom: var(--s-5);
  font-size: var(--fs-4xl);
  font-weight: var(--fw-semi);
}

.c-block--inset {
  margin-top: var(--s-9);
}

.c-block--inset .c-block__title {
  font-size: var(--fs-2xl);
}

.c-copy {
  --fold-h: 280px;
  font-size: var(--fs-md);
  line-height: var(--lh-read);
  color: var(--c-sub);
}

.c-copy p + p {
  margin-top: var(--s-3);
}

.c-copy a {
  color: var(--c-brand);
}

.c-copy h2,
.c-copy h3 {
  margin: var(--s-6) 0 var(--s-3);
  font-size: var(--fs-2xl);
}

.c-copy ul,
.c-copy ol {
  margin-top: var(--s-3);
  padding-left: var(--s-6);
  list-style: disc;
}

.c-copy.is-folded {
  max-height: var(--fold-h);
  overflow: hidden;
  -webkit-mask-image: var(--fold-fade);
  mask-image: var(--fold-fade);
}

.c-copy--page {
  color: var(--c-text);
}

.c-foldbtn {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap);
  font-weight: var(--fw-semi);
  color: var(--c-brand);
}

.c-epgrid {
  --ep-w: 64px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--ep-w), 1fr));
  gap: var(--s-3);
}

.c-epbox {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--s-1);
  width: 100%;
  height: var(--tap);
  border: var(--bw) solid var(--c-line);
  border-radius: var(--r-md);
  background: var(--c-page);
  font-size: var(--fs-md);
  font-weight: var(--fw-semi);
  color: var(--c-text);
  transition: border-color var(--anim-fast) var(--ease), color var(--anim-fast) var(--ease);
}

a.c-epbox:hover,
.c-epbox:hover {
  border-color: var(--c-brand);
  color: var(--c-brand);
}

.c-epbox--locked {
  border-color: transparent;
  background: var(--c-lockbg);
  color: var(--c-mute);
}

.c-epbox--locked::after {
  content: "";
  width: var(--s-3);
  height: var(--s-3);
  background: currentColor;
  -webkit-mask: var(--ico-lock) center / contain no-repeat;
  mask: var(--ico-lock) center / contain no-repeat;
}

.c-epbox.is-current {
  border-color: var(--c-brand);
  background: var(--c-brand);
  color: var(--c-on-dark);
}

.c-notes {
  display: grid;
  gap: var(--s-7);
}

.c-notes__head {
  display: flex;
  align-items: baseline;
  gap: var(--s-3);
  font-size: var(--fs-xl);
  font-weight: var(--fw-semi);
}

.c-notes__tag {
  flex-shrink: 0;
  padding: var(--s-0) var(--s-2);
  border-radius: var(--r-sm);
  background: var(--c-brand-wash);
  color: var(--c-brand-deep);
  font-size: var(--fs-2xs);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-wide);
}

.c-notes__text {
  margin-top: var(--s-2);
  font-size: var(--fs-lg);
  line-height: var(--lh-read);
  color: var(--c-text);
}

.c-notes__more {
  margin-top: var(--s-5);
}

.c-notes__more .c-textlink {
  display: inline-flex;
  align-items: center;
  gap: var(--s-1);
  min-height: var(--tap);
  font-weight: var(--fw-semi);
  text-decoration: none;
}

.c-people {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--s-4);
}

.c-people__card {
  padding: var(--s-5);
  border: var(--bw) solid var(--c-line-soft);
  border-radius: var(--r-xl);
  background: var(--c-page);
}

.c-people__name {
  font-size: var(--fs-md);
  font-weight: var(--fw-semi);
  color: var(--c-ink);
}

.c-people__role {
  margin-top: var(--s-1);
  font-size: var(--fs-xs);
  font-weight: var(--fw-med);
  color: var(--c-brand-deep);
}

.c-people__about {
  margin-top: var(--s-2);
  font-size: var(--fs-sm);
  line-height: var(--lh-read);
  color: var(--c-sub);
}

.c-sayings {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--s-4);
}

.c-saying {
  padding: var(--s-4) var(--s-5);
  border-left: var(--bw-3) solid var(--c-brand);
  border-radius: 0 var(--r-md) var(--r-md) 0;
  background: var(--c-tint);
}

.c-saying__text {
  font-size: var(--fs-md);
  font-style: italic;
  line-height: var(--lh-read);
  color: var(--c-ink);
}

.c-saying__by {
  margin-top: var(--s-2);
  font-size: var(--fs-xs);
  color: var(--c-mute);
}

.c-source {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-4);
  padding: var(--s-5) var(--s-6);
  border: var(--bw) solid var(--c-line-soft);
  border-radius: var(--r-xl);
}

.c-source__who {
  display: flex;
  align-items: center;
  gap: var(--s-3);
}

.c-source__icon {
  display: grid;
  place-items: center;
  width: var(--tap);
  height: var(--tap);
  border-radius: var(--r-pill);
  background: var(--c-brand-wash);
  color: var(--c-brand);
}

.c-source__name {
  font-size: var(--fs-md);
  font-weight: var(--fw-semi);
  color: var(--c-ink);
}

.c-source__sub {
  font-size: var(--fs-xs);
  color: var(--c-mute);
}

.c-askbox {
  border-top: var(--bw) solid var(--c-line-soft);
}

.c-askbox__item {
  border-bottom: var(--bw) solid var(--c-line-soft);
}

.c-askbox__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-4);
  min-height: var(--s-11);
  padding-block: var(--s-3);
  font-size: var(--fs-md);
  font-weight: var(--fw-semi);
  color: var(--c-ink);
  cursor: pointer;
  list-style: none;
}

.c-askbox__q::-webkit-details-marker {
  display: none;
}

.c-askbox__q::after {
  content: "";
  flex-shrink: 0;
  width: var(--s-4);
  height: var(--s-4);
  background: var(--c-mute);
  -webkit-mask: var(--ico-down) center / contain no-repeat;
  mask: var(--ico-down) center / contain no-repeat;
  transition: transform var(--anim-mid) var(--ease);
}

.c-askbox__item[open] .c-askbox__q::after {
  transform: rotate(180deg);
}

.c-askbox__a {
  padding-bottom: var(--s-4);
  font-size: var(--fs-sm);
  line-height: var(--lh-read);
  color: var(--c-sub);
}

.c-where {
  padding: var(--s-6);
  border-radius: var(--r-xl);
  background: var(--c-tint);
}

.c-where__title {
  margin-bottom: var(--s-3);
  font-size: var(--fs-2xl);
}

.c-where__text {
  font-size: var(--fs-sm);
  line-height: var(--lh-read);
  color: var(--c-sub);
}

.c-where__text + .c-where__text {
  margin-top: var(--s-2);
}

.c-where .c-ghostbtn {
  margin-top: var(--s-4);
}

.c-desk {
  --sheet-w: 850px;
  --tool-w: 80px;
  padding-bottom: var(--s-12);
  background: var(--c-desk);
}

.c-desk__mini {
  display: flex;
  align-items: center;
  gap: var(--s-3);
  max-width: var(--sheet-w);
  margin-top: var(--s-4);
}

.c-desk__thumb {
  --tw: 42px;
  width: var(--tw);
  height: auto;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: var(--r-xs);
  background: var(--c-field);
}

.c-desk__who {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.c-desk__show {
  display: block;
  line-height: var(--tap);
  overflow: hidden;
  font-size: var(--fs-sm);
  font-weight: var(--fw-semi);
  color: var(--c-ink);
  white-space: nowrap;
  text-overflow: ellipsis;
}

.c-desk__genre {
  font-size: var(--fs-2xs);
  color: var(--c-sub);
}

.c-desk__grid {
  display: grid;
  grid-template-columns: var(--tool-w) minmax(0, var(--sheet-w)) var(--tap);
  justify-content: center;
  align-items: start;
  gap: var(--s-3);
}

.c-desk__tools,
.c-desk__rail {
  position: sticky;
  top: calc(var(--topbar-h) + var(--s-4));
  display: grid;
  gap: var(--s-3);
}

.c-tool {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--s-2);
  width: var(--tool-w);
  height: var(--tool-w);
  border-radius: var(--r-sm);
  background: var(--c-sheet);
  font-size: var(--fs-2xs);
  color: var(--c-sub);
}

.c-tool .c-glyph {
  color: var(--c-text);
}

.c-tool:hover,
.c-tool:hover .c-glyph {
  color: var(--c-brand);
}

.c-desk__sheet {
  min-width: 0;
  padding: var(--s-6);
  border-radius: var(--r-sm);
  background: var(--c-sheet);
}

.c-desk__heading {
  margin-top: var(--s-5);
}

.c-desk__title {
  font-size: var(--fs-4xl);
  font-weight: var(--fw-semi);
  overflow-wrap: anywhere;
}

.c-desk__facts {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-4);
  margin-top: var(--s-2);
  font-size: var(--fs-xs);
  color: var(--c-mute);
}

.c-desk__fact b {
  font-weight: var(--fw-semi);
  color: var(--c-text);
  text-transform: capitalize;
}

.c-player {
  display: flex;
  justify-content: center;
  overflow: hidden;
  border-radius: var(--r-md);
  background: var(--c-video);
}

.c-player__video {
  display: block;
  width: 100%;
  height: var(--player-h);
  height: var(--player-h-stable);
  max-height: calc(100vh - var(--player-clearance));
  max-height: calc(100svh - var(--player-clearance));
  object-fit: contain;
  background: var(--c-video);
}

.c-desk__sub {
  margin-top: var(--s-8);
  font-size: var(--fs-2xl);
  font-weight: var(--fw-semi);
}

.c-desk__text {
  margin-top: var(--s-3);
  font-size: var(--fs-lg);
  line-height: var(--lh-read);
  color: var(--c-text);
}

.c-desk__nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: var(--s-3);
  margin-top: var(--s-4);
}

.c-desk__nav .c-cta {
  --cta-w: 200px;
}

.c-railbtn {
  display: grid;
  place-items: center;
  width: var(--tap);
  height: var(--tap);
  border-radius: var(--r-sm);
  background: var(--c-sheet);
  color: var(--c-text);
}

.c-railbtn:hover {
  color: var(--c-brand);
}

.c-gate {
  --gw: 400px;
  position: fixed;
  width: min(var(--gw), calc(100vw - var(--gutter) * 2));
  padding: var(--s-6);
  border: 0;
  border-radius: var(--r-2xl);
  background: var(--c-page);
  box-shadow: var(--elev-2);
  color: var(--c-text);
}

.c-gate::backdrop {
  background: var(--c-scrim);
}

.c-gate__shut {
  position: absolute;
  top: var(--s-2);
  right: var(--s-2);
  margin: 0;
}

.c-gate__x {
  display: grid;
  place-items: center;
  width: var(--tap);
  height: var(--tap);
  border-radius: var(--r-pill);
  color: var(--c-mute);
}

.c-gate__x:hover {
  color: var(--c-ink);
}

.c-gate__top {
  display: flex;
  align-items: center;
  gap: var(--s-4);
  padding-right: var(--s-9);
}

.c-gate__poster {
  --pw: 96px;
  width: var(--pw);
  height: auto;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: var(--r-md);
  background: var(--c-field);
}

.c-gate__head {
  min-width: 0;
}

.c-gate__ep {
  display: flex;
  align-items: center;
  gap: var(--s-1);
  font-size: var(--fs-xs);
  font-weight: var(--fw-semi);
  color: var(--c-brand-deep);
}

.c-gate__title {
  margin-top: var(--s-1);
  font-size: var(--fs-xl);
  font-weight: var(--fw-semi);
  line-height: var(--lh-tight);
  color: var(--c-ink);
}

.c-gate__text {
  margin: var(--s-5) 0 var(--s-4);
  font-size: var(--fs-sm);
  color: var(--c-sub);
}

.c-gate__note {
  margin-top: var(--s-2);
  font-size: var(--fs-2xs);
  color: var(--c-faint);
  text-align: center;
}

.c-miss {
  --vw: 440px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-block: var(--s-13);
  text-align: center;
}

.c-miss__code {
  font-size: var(--fs-code);
  font-weight: var(--fw-heavy);
  line-height: var(--lh-none);
  background: var(--grad-miss);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.c-miss__title {
  margin-top: var(--s-4);
  font-size: var(--fs-4xl);
}

.c-miss__desc {
  max-width: var(--vw);
  margin-top: var(--s-2);
  font-size: var(--fs-md);
  color: var(--c-sub);
}

.c-miss__act {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--s-3);
  margin-top: var(--s-6);
}

.c-linkset {
  margin-top: var(--s-8);
}

.c-linkset__feeds {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-3);
  margin-top: var(--s-4);
}

.c-linkset__title {
  margin-bottom: var(--s-3);
  font-size: var(--fs-2xl);
}

.c-linkset__title a:hover {
  color: var(--c-brand);
}

.c-linkset__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 var(--s-6);
}

.c-linkset__list a {
  display: flex;
  align-items: center;
  min-height: var(--tap);
  border-bottom: var(--bw) solid var(--c-line-soft);
  font-size: var(--fs-sm);
  color: var(--c-text);
}

.c-linkset__list a:hover {
  color: var(--c-brand);
}

.c-page {
  padding-bottom: var(--s-10);
}

.c-copy--page h2 {
  font-size: var(--fs-2xl);
}

.c-sidecard {
  padding: var(--s-5);
  border: var(--bw) solid var(--c-line-soft);
  border-radius: var(--r-xl);
}

.c-sidecard__title {
  margin-bottom: var(--s-2);
  font-size: var(--fs-md);
}

.c-sidecard__link {
  display: flex;
  align-items: center;
  min-height: var(--tap);
  font-size: var(--fs-sm);
}

.c-chart {
  padding-bottom: var(--s-12);
}

.c-chart__grid {
  display: grid;
  grid-template-columns: var(--catalog-rail) minmax(0, 1fr);
  gap: var(--s-8);
  align-items: start;
}

.c-chart__menu {
  position: sticky;
  top: calc(var(--topbar-h) + var(--s-4));
  min-width: 0;
  padding-block: var(--s-2);
  border-top: var(--bw) solid var(--c-action-line);
}

.c-chart__menutitle {
  margin-bottom: var(--s-2);
  font-size: var(--fs-2xs);
  font-weight: var(--fw-semi);
  letter-spacing: var(--ls-wide);
  text-transform: uppercase;
  color: var(--c-sub);
}

.c-chart__menulist {
  display: grid;
  gap: var(--s-1);
}

.c-chart__menulink {
  display: flex;
  align-items: center;
  min-width: var(--s-6);
  min-height: var(--s-10);
  padding-inline: var(--s-2);
  border-radius: var(--r-sm);
  font-size: var(--fs-sm);
  color: var(--c-text);
  overflow-wrap: anywhere;
}

.c-chart__menulink:hover,
.c-chart__menulink:focus-visible {
  background: var(--c-index-hover);
  color: var(--c-action);
  font-weight: var(--fw-semi);
}

.c-chart__main {
  min-width: 0;
}

.c-chart__group + .c-chart__group {
  margin-top: var(--s-10);
}

.c-chart__group .c-bandhead {
  align-items: center;
  margin-bottom: var(--s-4);
  border-bottom: var(--bw) solid var(--c-line-soft);
}

.c-chart__group .c-bandhead__title {
  font-size: var(--fs-md);
}

.c-chart__group .c-more {
  font-size: var(--fs-sm);
  color: var(--c-action);
}

.c-tale__hero {
  --pw: 208px;
  display: grid;
  grid-template-columns: var(--pw) minmax(0, 1fr);
  gap: var(--s-8);
  margin-top: var(--s-2);
  padding: var(--s-8);
  border-radius: var(--r-xl);
  background: var(--c-desk);
}

.c-tale__poster {
  display: block;
}

.c-tale__intro {
  min-width: 0;
}

.c-tale__kicker {
  font-size: var(--fs-xs);
  font-weight: var(--fw-bold);
  color: var(--c-brand-deep);
  text-transform: uppercase;
  letter-spacing: var(--ls-wide);
}

.c-tale__title {
  margin-top: var(--s-2);
  font-size: var(--fs-6xl);
}

.c-tale__lede {
  margin-top: var(--s-3);
  font-size: var(--fs-md);
  line-height: var(--lh-read);
  color: var(--c-sub);
}

.c-tale__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-4);
  margin-top: var(--s-3);
  font-size: var(--fs-xs);
  color: var(--c-mute);
}

.c-tale__act {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-3);
  margin-top: var(--s-6);
}

.c-tale__grid {
  --iw: 260px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--iw);
  gap: var(--s-12);
  align-items: start;
  margin-top: var(--s-10);
}

.c-steps {
  position: relative;
  display: grid;
  gap: var(--s-8);
  padding-left: var(--s-12);
}

.c-steps::before {
  content: "";
  position: absolute;
  top: var(--s-2);
  bottom: var(--s-2);
  left: calc(var(--s-5) - var(--bw));
  width: var(--bw-2);
  background: var(--c-line-soft);
}

.c-steps__item,
.c-steps__break,
.c-steps__end {
  position: relative;
}

.c-steps__n {
  position: absolute;
  top: 0;
  left: calc(var(--s-12) * -1);
  display: grid;
  place-items: center;
  width: var(--s-9);
  height: var(--s-9);
  border-radius: var(--r-pill);
  background: var(--c-brand);
  color: var(--c-on-dark);
  font-size: var(--fs-sm);
  font-weight: var(--fw-bold);
}

.c-steps__title {
  font-size: var(--fs-2xl);
  font-weight: var(--fw-semi);
}

.c-steps__text {
  margin-top: var(--s-3);
  font-size: var(--fs-lg);
  line-height: var(--lh-read);
  color: var(--c-text);
}

.c-steps__text p + p {
  margin-top: var(--s-3);
}

.c-steps__dot {
  position: absolute;
  top: var(--s-2);
  left: calc(var(--s-12) * -1 + var(--s-3));
  width: var(--s-4);
  height: var(--s-4);
  border-radius: var(--r-pill);
  background: var(--c-brand);
}

.c-steps__dot--hollow {
  border: var(--bw-2) solid var(--c-brand);
  background: var(--c-page);
}

.c-steps__breakbox {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-3);
  padding: var(--s-4) var(--s-5);
  border-radius: var(--r-xl);
  background: var(--c-brand-wash);
}

.c-steps__breaktext {
  font-weight: var(--fw-semi);
  color: var(--c-ink);
}

.c-steps__endtext {
  font-size: var(--fs-sm);
  color: var(--c-mute);
}

.c-tale__index {
  position: sticky;
  top: calc(var(--topbar-h) + var(--s-4));
  padding: var(--s-5);
  border: var(--bw) solid var(--c-line-soft);
  border-radius: var(--r-xl);
}

.c-tale__indextitle {
  margin-bottom: var(--s-2);
  font-weight: var(--fw-semi);
  color: var(--c-ink);
}

.c-tale__indexlink {
  display: flex;
  align-items: center;
  gap: var(--s-2);
  min-height: var(--tap);
  font-size: var(--fs-sm);
  color: var(--c-text);
}

.c-tale__indexn {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: var(--s-6);
  height: var(--s-6);
  border-radius: var(--r-pill);
  background: var(--c-tint);
  font-size: var(--fs-2xs);
  font-weight: var(--fw-bold);
}

.c-tale__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-5);
  margin-top: var(--s-10);
  padding: var(--s-6);
  border-radius: var(--r-xl);
  background: var(--c-tint);
}

.c-tale__foottitle {
  font-size: var(--fs-xl);
  font-weight: var(--fw-semi);
  color: var(--c-ink);
}

.c-tale__footcopy {
  margin-top: var(--s-1);
  color: var(--c-sub);
}

.c-closer {
  padding-top: var(--s-10);
  background: var(--c-foot);
  color: var(--c-foot-link);
}

.c-closer__grid {
  --bw-brand: 320px;
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--s-8);
}

.c-closer__name {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap);
  font-size: var(--fs-brand);
  font-weight: var(--fw-bold);
  letter-spacing: var(--ls-tight);
  color: var(--c-brand);
}

.c-closer__name:hover {
  color: var(--c-brand-hi);
}

.c-closer__line {
  max-width: var(--bw-brand);
  margin-top: var(--s-2);
  font-size: var(--fs-sm);
}

.c-closer__head {
  margin-bottom: var(--s-2);
  font-size: var(--fs-2xl);
  font-weight: var(--fw-semi);
  color: var(--c-foot-head);
}

.c-closer__link {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap);
  font-size: var(--fs-sm);
  color: var(--c-foot-link);
}

.c-closer__link:hover {
  color: var(--c-on-dark);
}

.c-closer__copy {
  margin-top: var(--s-8);
  padding-block: var(--s-5);
  border-top: var(--bw) solid var(--c-foot-rule);
  font-size: var(--fs-2xs);
  color: var(--c-foot-copy);
}

@media (max-width: 1439px) {
  .c-board {
    gap: var(--s-10);
  }
}

@media (max-width: 1199px) {
  .c-topbar__row {
    gap: var(--s-5);
  }
  .c-navline__list {
    gap: var(--s-5);
  }
  .c-seek__field {
    --fw: 130px;
  }
  .c-board {
    gap: var(--s-8);
  }
  .c-cells {
    gap: var(--s-8) var(--s-5);
  }
  .c-desk__sheet {
    padding: var(--s-6);
  }
}

@media (max-width: 991px) {
  .c-topbar__btn {
    display: grid;
  }
  .c-topbar__row {
    gap: var(--s-2);
  }
  .c-navline {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: var(--z-drawer);
    width: min(var(--drawer-w), 84vw);
    padding: var(--s-6) var(--s-5);
    overflow-y: auto;
    background: var(--c-page);
    box-shadow: var(--elev-2);
    visibility: hidden;
    transform: translateX(-100%);
    transition: transform var(--anim-mid) var(--ease), visibility 0s linear var(--anim-mid);
  }
  .c-topbar.is-nav-open .c-navline {
    visibility: visible;
    transform: none;
    transition: transform var(--anim-mid) var(--ease);
  }
  .c-navline__list {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }
  .c-navline__link {
    width: 100%;
    min-height: var(--s-11);
    border-bottom: var(--bw) solid var(--c-line-soft);
  }
  .c-topbar__scrim {
    position: fixed;
    inset: 0;
    z-index: var(--z-scrim);
    display: block;
    background: var(--c-scrim);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--anim-mid) var(--ease);
  }
  .c-topbar.is-nav-open .c-topbar__scrim {
    opacity: 1;
    pointer-events: auto;
  }
  .c-seek {
    position: absolute;
    top: calc(var(--topbar-h) + var(--s-2));
    right: var(--gutter);
    left: var(--gutter);
    display: none;
    background: var(--c-page);
    border-color: var(--c-line);
    box-shadow: var(--elev-2);
  }
  .c-topbar.is-seek-open .c-seek {
    display: flex;
  }
  .c-seek__field {
    flex: 1 1 auto;
    width: auto;
  }
  .c-board {
    grid-auto-flow: column;
    grid-template-columns: none;
    grid-auto-columns: var(--board-column);
    gap: var(--s-6);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: var(--s-2);
  }
  .c-board__col {
    scroll-snap-align: start;
  }
  .c-cells {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .c-strips {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .c-dramahead__grid {
    --pw: 168px;
    gap: var(--s-6);
  }
  .c-dramahead__info {
    padding-top: 0;
  }
  .c-people {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .c-desk__grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .c-desk__tools,
  .c-desk__rail {
    display: none;
  }
  .c-desk__mini {
    max-width: none;
  }
  .c-desk__sheet {
    padding: var(--s-6);
  }
  .c-chart__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--s-6);
  }
  .c-chart__menu {
    position: static;
    padding: 0;
    border: 0;
  }
  .c-chart__menutitle {
    display: none;
  }
  .c-chart__menulist {
    display: flex;
    gap: var(--s-2);
    max-width: 100%;
    overflow-x: auto;
    border-bottom: var(--bw) solid var(--c-line-soft);
    overscroll-behavior-x: contain;
  }
  .c-chart__menulist > li {
    flex: 0 0 auto;
  }
  .c-chart__menulink {
    padding-inline: var(--s-4);
    border-left: 0;
    border-bottom: var(--bw-2) solid transparent;
    white-space: nowrap;
  }
  .c-tale__grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .c-tale__index {
    position: static;
    order: -1;
  }
  .c-closer__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .c-closer__brand {
    grid-column: 1 / -1;
  }
}

@media (max-width: 767px) {
  .l-band {
    padding-block: var(--s-9);
  }
  .c-bandhead {
    margin-bottom: var(--s-5);
  }
  .c-trail__list {
    flex-wrap: nowrap;
  }
  .c-trail__item {
    flex: 0 1 auto;
  }
  .c-trail__item:first-child {
    flex-shrink: 0;
  }
  .c-trail__item[aria-current] {
    flex-shrink: 0;
    max-width: 55%;
  }
  .c-trail__link {
    display: block;
    overflow: hidden;
    line-height: var(--tap);
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .c-board {
    grid-auto-columns: 92%;
    gap: var(--s-6);
    overscroll-behavior-x: contain;
  }
  .c-board__list {
    gap: var(--s-6);
    margin-top: var(--s-6);
  }
  .c-boardrow {
    --cw: var(--board-cover-mobile);
    gap: var(--s-4);
  }
  .c-boardrow__name {
    font-size: var(--fs-md);
  }
  .c-cells {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--s-6) var(--s-3);
  }
  .c-cell__name {
    margin-top: var(--s-2);
    font-size: var(--fs-sm);
  }
  .c-cell__sub {
    margin-top: var(--s-1);
    font-size: var(--fs-2xs);
  }
  .c-tiles {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--s-3);
  }
  .c-tiles__item {
    --th: 64px;
    width: 100%;
    font-size: var(--fs-md);
  }
  .c-strips,
  .c-strips--pair {
    grid-template-columns: minmax(0, 1fr);
  }
  .c-strip {
    --cw: var(--strip-cover-mobile);
    row-gap: var(--s-1);
  }
  .c-strip__blurb {
    margin-top: var(--s-1);
    max-height: var(--lh-blurb);
    -webkit-line-clamp: 1;
  }
  .c-dramahead__grid {
    --pw: 112px;
    gap: var(--s-2) var(--s-4);
  }
  .c-dramahead__poster {
    grid-row: 1 / span 2;
  }
  .c-dramahead__info {
    display: contents;
  }
  .c-dramahead__title {
    grid-column: 2;
    align-self: end;
  }
  .c-dramahead__line {
    grid-column: 2;
    align-self: start;
  }
  .c-stats,
  .c-dramahead__act {
    grid-column: 1 / -1;
  }
  .c-dramahead__act {
    flex-direction: column;
    align-items: stretch;
    margin-top: var(--s-3);
  }
  .c-dramahead__act .c-cta {
    --cta-w: 100%;
  }
  .c-sharebar {
    justify-content: center;
  }
  .c-stats {
    gap: var(--s-2) var(--s-6);
  }
  .c-stats__val {
    font-size: var(--fs-md);
  }
  .c-stats__val--text {
    font-size: var(--fs-md);
  }
  .c-block {
    margin-top: var(--s-9);
  }
  .c-people,
  .c-sayings {
    grid-template-columns: minmax(0, 1fr);
  }
  .c-epgrid {
    --ep-w: 52px;
    gap: var(--s-2);
  }
  .c-desk__sheet {
    padding: 0 var(--s-4) var(--s-6);
  }
  .c-desk__title {
    font-size: var(--fs-2xl);
  }
  .c-desk .c-trail__list {
    flex-wrap: nowrap;
  }
  .c-player {
    margin-inline: calc(var(--s-4) * -1);
    border-radius: 0;
  }
  .c-desk__nav .c-cta,
  .c-desk__nav .c-ghostbtn {
    flex: 1 1 100%;
  }
  .c-tale__hero {
    --pw: 112px;
    gap: var(--s-4);
    padding: var(--s-5);
  }
  .c-steps {
    padding-left: var(--s-11);
  }
  .c-steps__n {
    left: calc(var(--s-11) * -1);
  }
  .c-steps__dot {
    left: calc(var(--s-11) * -1 + var(--s-3));
  }
  .c-linkset__list {
    grid-template-columns: minmax(0, 1fr);
  }
  .c-miss {
    padding-block: var(--s-12);
  }
}

@media (max-width: 575px) {
  .c-wordmark__img {
    height: var(--logo-h-sm);
  }
  .c-wordmark__name {
    font-size: var(--fs-xl);
  }
  .c-cells {
    gap: var(--s-5) var(--s-2);
  }
  .c-dramahead__title {
    font-size: var(--fs-2xl);
  }
  .c-dramahead__grid {
    --pw: 100px;
  }
  .c-sharebar__label {
    display: none;
  }
  .c-source {
    padding: var(--s-4);
  }
  .c-source .c-ghostbtn {
    width: 100%;
  }
  .c-where {
    padding: var(--s-5);
  }
  .c-tale__hero {
    grid-template-columns: minmax(0, 1fr);
  }
  .c-tale__poster {
    width: var(--pw);
  }
  .c-closer__grid {
    gap: var(--s-6);
  }
}
