/* ==========================================================================
   Craft Politics — Ghost theme "craft" — screen.css
   Tokens follow the brand handoff. Sections:
   1 Fonts · 2 Tokens · 3 Base · 4 Layout · 5 Type primitives · 6 Band & lockup
   7 Header · 8 Buttons, links, forms · 9 Home · 10 Cards & rows · 11 Episode
   12 Essay · 13 Page / host / archive / error · 14 Prose & Ghost cards
   15 Subscribe strip & footer · 16 Responsive · 17 Motion & print
   ========================================================================== */

/* 1 ─ Fonts (self-hosted, real variable files) ---------------------------- */
@font-face {
  font-family: "Anybody";
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 50% 150%;
  font-display: swap;
  src: url("../fonts/anybody-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Anybody";
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 50% 150%;
  font-display: swap;
  src: url("../fonts/anybody-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "DM Serif Display";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/dmserif-italic-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "DM Serif Display";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/dmserif-italic-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/publicsans-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/publicsans-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Public Sans";
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/publicsans-italic-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* 2 ─ Tokens --------------------------------------------------------------- */
:root {
  --cp-bone: #F2EDE4;
  --cp-surface: #FBF9F4;
  --cp-ink: #14100F;
  --cp-ink-secondary: #4A4340;
  --cp-ink-meta: #6E655F;
  --cp-blue: #1F4DFF;
  --cp-pink: #FF2E93;
  --cp-lime: #D6FF3F;
  --cp-rule: rgba(20, 16, 15, .14);
  --cp-rule-strong: rgba(20, 16, 15, .32);
  --cp-rule-bone: rgba(242, 237, 228, .22);
  --cp-rule-bone-strong: rgba(242, 237, 228, .5);

  --cp-space-1: 4px; --cp-space-2: 8px; --cp-space-3: 12px; --cp-space-4: 16px;
  --cp-space-5: 24px; --cp-space-6: 32px; --cp-space-7: 48px; --cp-space-8: 64px;
  --cp-space-9: 96px; --cp-space-10: 144px;

  --cp-display: var(--gh-font-heading, "Anybody"), "Public Sans", "Arial Black", Impact, sans-serif; /* Admin → Design → Typography stays "Theme default" for the brand faces */
  --cp-serif: "DM Serif Display", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --cp-sans: var(--gh-font-body, "Public Sans"), "Helvetica Neue", Helvetica, Arial, sans-serif;

  --fs-display-1: clamp(3.5rem, 9vw, 8.25rem);
  --fs-display-1-split: clamp(3rem, 7.4vw, 7rem);
  --fs-display-2: clamp(2.25rem, 4.5vw, 3.75rem);
  --fs-band: clamp(2rem, 4vw, 3.5rem);
  --fs-standfirst: clamp(1.375rem, 1.1rem + .9vw, 1.625rem);
  --fs-h2: 2rem;
  --fs-h3: 1.375rem;
  --fs-body: 1.1875rem;
  --fs-small: .9375rem;
  --fs-label: .75rem;
  --fs-nav: .8125rem;

  --cp-measure: 42rem;
  --cp-max: 1240px;
  --cp-margin: 20px;
  --cp-gutter: 24px;
  --cp-rule-w: 4px;         /* image leading rule: 4px mobile, 6px desktop */
  --cp-play: 56px;          /* play square: 56 mobile, 64 desktop */
  --cp-ease: 120ms ease-out;
}
@media (min-width: 600px)  { :root { --cp-margin: 32px; } }
@media (min-width: 900px)  { :root { --cp-margin: 40px; --cp-rule-w: 6px; --cp-play: 64px; } }
@media (min-width: 1280px) { :root { --cp-margin: 56px; } }

/* 3 ─ Base ----------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: auto; }
body {
  margin: 0;
  background: var(--cp-bone);
  color: var(--cp-ink);
  font-family: var(--cp-sans);
  font-size: var(--fs-body);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
[hidden] { display: none !important; }
img, video, iframe, embed, object, svg { max-width: 100%; }
img, video { height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: inherit; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--cp-pink); outline-offset: 2px; border-radius: 0; }
.cp-on-pink :focus-visible, .cp-on-lime :focus-visible, .cp-btn--lime:focus-visible, .cp-play:focus-visible { outline-color: var(--cp-ink); }
::selection { background: var(--cp-lime); color: var(--cp-ink); }

.cp-visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.cp-skip { position: absolute; left: 0; top: 0; z-index: 100; transform: translateY(-120%); background: var(--cp-ink); color: var(--cp-lime); padding: 15px 20px; min-height: 44px; font: 500 var(--fs-label)/1.2 var(--cp-sans); letter-spacing: .11em; text-transform: uppercase; text-decoration: none; }
.cp-skip:focus { transform: none; outline-color: var(--cp-lime); }

/* 4 ─ Layout --------------------------------------------------------------- */
.cp-container { width: 100%; max-width: calc(var(--cp-max) + 2 * var(--cp-margin)); margin-inline: auto; padding-inline: var(--cp-margin); }
.cp-container > * { min-width: 0; }
.cp-main { display: block; min-width: 0; }
.cp-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--cp-space-5); flex-wrap: wrap; margin-bottom: var(--cp-space-6); }
.cp-section-head--sub { margin-top: var(--cp-space-9); }
.cp-section-head__link { white-space: nowrap; }

/* 5 ─ Type primitives ------------------------------------------------------ */
.cp-display, .cp-h1, .cp-h2, .cp-h3 {
  font-family: var(--cp-display);
  font-weight: 900;
  font-variation-settings: "wdth" 88;
  text-transform: uppercase;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
.cp-display { font-size: var(--fs-display-1); line-height: .82; letter-spacing: -.035em; }
.cp-h1 { font-size: var(--fs-display-1-split); line-height: .86; letter-spacing: -.03em; }
.cp-h2 { font-size: var(--fs-h2); line-height: .95; letter-spacing: -.02em; }
.cp-h2__em { font-family: var(--cp-serif); font-style: italic; font-weight: 400; text-transform: none; letter-spacing: 0; font-variation-settings: normal; }
.cp-h3 { font-size: var(--fs-h3); line-height: 1.15; letter-spacing: -.01em; font-weight: 800; font-variation-settings: "wdth" 92; }
.cp-display a, .cp-h1 a { text-decoration: none; }
.cp-display a:hover, .cp-h1 a:hover { text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: .06em; text-underline-offset: .08em; }

.cp-standfirst { font-family: var(--cp-serif); font-style: italic; font-size: var(--fs-standfirst); line-height: 1.35; max-width: min(var(--cp-measure), 100%); text-wrap: pretty; }
.cp-label { font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); line-height: 1.2; letter-spacing: .11em; text-transform: uppercase; }
.cp-meta { color: var(--cp-ink-meta); font-size: .875rem; }
.cp-dot { display: inline-block; margin-inline: .55em; opacity: .6; }
.cp-duration { display: inline; }
.cp-duration:empty { display: none; }
.cp-duration::before { content: "·"; display: inline; margin-inline: .55em; opacity: .6; }

/* 6 ─ The band & the lockup ------------------------------------------------ */
.cp-band {
  --band-bleed: 0px;
  display: inline-block;
  position: relative;
  background: var(--cp-pink);
  color: var(--cp-bone);
  font-family: var(--cp-serif);
  font-style: italic;
  font-weight: 400;
  font-size: var(--fs-band);
  line-height: .8;
  letter-spacing: 0;
  text-transform: none;
  white-space: nowrap;
  padding: .16em .55em .24em calc(.45em + var(--band-bleed));
  margin: .22em 0 .45em calc(-1 * var(--band-bleed));
  transform: rotate(-6deg);
  transform-origin: 100% 50%;
  max-width: none;
}
.cp-band__word { display: inline-block; }
.cp-band { max-width: none; }
.cp-band--bleed { --band-bleed: calc(var(--cp-margin) + 40px); }

.cp-lockup { display: inline-flex; align-items: center; gap: .35em; min-height: 44px; text-decoration: none; color: var(--cp-bone); white-space: nowrap; line-height: 1; }
.cp-lockup__word { font-family: var(--cp-display); font-weight: 900; font-variation-settings: "wdth" 88; text-transform: uppercase; letter-spacing: -.035em; font-size: 1.5rem; line-height: .82; }
.cp-lockup__band { display: inline-block; background: var(--cp-pink); color: var(--cp-bone); font-family: var(--cp-serif); font-style: italic; font-size: 1.15rem; line-height: .8; padding: .16em .4em .24em .38em; transform: rotate(-6deg); transform-origin: 100% 50%; margin-left: -.1em; position: relative; top: .06em; }
.cp-lockup--big .cp-lockup__word { font-size: clamp(2.5rem, 6vw, 4.5rem); }
.cp-lockup--big .cp-lockup__band { font-size: clamp(1.9rem, 4.5vw, 3.4rem); }

/* 7 ─ Header --------------------------------------------------------------- */
.cp-header { background: var(--cp-ink); color: var(--cp-bone); position: relative; z-index: 20; }
.cp-header__inner { width: 100%; max-width: calc(var(--cp-max) + 2 * var(--cp-margin)); margin-inline: auto; padding: 0 var(--cp-margin); min-height: 64px; display: flex; align-items: center; gap: var(--cp-space-5); }
.cp-header .cp-lockup { padding: 10px 0; flex: 0 0 auto; }
.cp-nav { flex: 1 1 auto; min-width: 0; }
.cp-nav__list { list-style: none; display: flex; gap: clamp(16px, 2.2vw, 32px); justify-content: flex-end; flex-wrap: wrap; }
.cp-nav__link { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; font-family: var(--cp-sans); font-weight: 600; font-size: var(--fs-nav); letter-spacing: .11em; text-transform: uppercase; color: var(--cp-bone); border-bottom: 2px solid transparent; transition: color var(--cp-ease), border-color var(--cp-ease); }
.cp-nav__link:hover { border-bottom-color: var(--cp-pink); }
.cp-nav__item--current .cp-nav__link,
.tag-hash-episode .cp-nav__link[href$="/episodes/"], .tag-hash-essay .cp-nav__link[href$="/essays/"], .author-template .cp-nav__link[href$="/hosts/"] { color: var(--cp-lime); }
.cp-header__tools { display: flex; gap: var(--cp-space-2); flex: 0 0 auto; margin-left: auto; }
.cp-iconbtn { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 0; color: var(--cp-bone); padding: 0; transition: color var(--cp-ease); }
.cp-iconbtn:hover { color: var(--cp-lime); }
.cp-iconbtn:focus-visible { outline-color: var(--cp-lime); }
.cp-menubtn { display: none; }
.cp-menu__x { display: none; }
.cp-menubtn[aria-expanded="true"] .cp-menu__bars { display: none; }
.cp-menubtn[aria-expanded="true"] .cp-menu__x { display: block; }

/* 8 ─ Buttons, links, forms ------------------------------------------------ */
.cp-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6em;
  min-height: 44px; padding: 0 22px;
  background: var(--cp-ink); color: var(--cp-lime);
  border: 1px solid var(--cp-ink);
  font-family: var(--cp-sans); font-weight: 600; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; text-decoration: none; line-height: 1.2;
  transition: background var(--cp-ease), color var(--cp-ease), border-color var(--cp-ease);
}
.cp-btn:hover { background: var(--cp-pink); color: var(--cp-ink); border-color: var(--cp-pink); }
.cp-btn--lime { background: var(--cp-lime); color: var(--cp-ink); border-color: var(--cp-lime); }
.cp-btn--lime:hover { background: var(--cp-pink); border-color: var(--cp-pink); }
.cp-btn--ghost { background: transparent; color: var(--cp-ink); border-color: var(--cp-ink); }
.cp-btn--ghost:hover { background: var(--cp-pink); border-color: var(--cp-pink); }

.cp-link-ul { display: inline-flex; align-items: center; min-height: 44px; color: var(--cp-ink); text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 3px; transition: background var(--cp-ease), color var(--cp-ease); }
.cp-link-ul:hover { background: var(--cp-pink); color: var(--cp-bone); text-decoration-color: transparent; }
.cp-link-plain { color: inherit; text-decoration: none; }
.cp-link-plain:hover { text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 3px; }

.cp-form { display: block; min-width: 0; }
.cp-form__label { display: block; margin-bottom: var(--cp-space-3); }
.cp-form__row { display: flex; gap: var(--cp-space-2); min-width: 0; }
.cp-form__input { flex: 1 1 auto; min-width: 0; min-height: 44px; padding: 0 14px; background: var(--cp-surface); color: var(--cp-ink); border: 1px solid var(--cp-ink); border-radius: 0; font-size: 1rem; }
.cp-form__input::placeholder { color: var(--cp-ink-meta); }
.cp-form__input:focus-visible { outline: 3px solid var(--cp-pink); outline-offset: 2px; }
.cp-form__btn { flex: 0 0 auto; }
.cp-form__msg { display: none; margin-top: var(--cp-space-3); font-size: var(--fs-small); line-height: 1.5; }
.cp-form.success .cp-form__row { display: none; }
.cp-form.success .cp-form__msg--success { display: block; background: var(--cp-lime); color: var(--cp-ink); padding: 12px 14px; margin-top: 0; font-weight: 600; }
.cp-form.error .cp-form__msg--error { display: block; color: inherit; }
.cp-form.error .cp-form__input { border: 2px solid var(--cp-pink); }
.cp-form.loading .cp-form__btn { opacity: .6; pointer-events: none; }

/* 9 ─ Home ------------------------------------------------------------------ */
.cp-home-hero { background: var(--cp-bone); overflow-x: clip; }
.cp-home-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr); }
.cp-home-hero__copy { padding: var(--cp-space-7) 0 var(--cp-space-7); min-width: 0; }
.cp-home-hero__kicker { color: var(--cp-ink-meta); margin-bottom: var(--cp-space-5); }
.cp-home-hero__title { font-size: var(--fs-display-1-split); }
.cp-home-hero__title a { color: inherit; }
.cp-home-hero .cp-band { --band-bleed: calc(var(--cp-margin) + 40px); display: block; width: max-content; margin-top: .18em; }
.cp-home-hero__stand { margin-top: var(--cp-space-6); }
.cp-home-hero__cta { margin-top: var(--cp-space-6); display: flex; flex-wrap: wrap; align-items: center; gap: var(--cp-space-3); color: var(--cp-ink-meta); font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; }
.cp-home-hero__cta .cp-duration::before { display: none; }
.cp-home-hero__still { position: relative; display: block; background: var(--cp-ink); border-left: var(--cp-rule-w) solid var(--cp-blue); aspect-ratio: 16 / 9; overflow: hidden; margin-inline: calc(-1 * var(--cp-margin)); }
.cp-home-hero__img { width: 100%; height: 100%; object-fit: cover; display: block; filter: grayscale(1) contrast(104%); }
.cp-home-hero__nostill { position: absolute; inset: 0; display: grid; place-items: center; }
.cp-home-hero__play { position: absolute; left: var(--cp-space-5); bottom: var(--cp-space-5); }
.cp-home-hero__still:hover .cp-play { background: var(--cp-pink); }

.cp-play { display: inline-flex; align-items: center; justify-content: center; width: var(--cp-play); height: var(--cp-play); background: var(--cp-lime); color: var(--cp-ink); border: 0; padding: 0; transition: background var(--cp-ease); flex: 0 0 auto; }
.cp-play .cp-ico { width: 42%; height: 42%; }
.cp-play:hover { background: var(--cp-pink); }
.cp-ico { display: block; width: 24px; height: 24px; }

.cp-home-cards { padding: var(--cp-space-8) 0 var(--cp-space-9); background: var(--cp-bone); border-top: 1px solid var(--cp-rule); }
.cp-statement { background: var(--cp-surface); border-top: 1px solid var(--cp-rule); border-bottom: 1px solid var(--cp-rule); }
.cp-statement__inner { padding: var(--cp-space-8) var(--cp-margin); display: grid; gap: var(--cp-space-6); }
.cp-statement__text { font-family: var(--cp-serif); font-style: italic; font-size: clamp(1.375rem, 1.1rem + 1.4vw, 2rem); line-height: 1.3; max-width: min(48rem, 100%); text-wrap: pretty; }
.cp-statement__hosts { display: flex; gap: var(--cp-space-5); flex-wrap: wrap; }
.cp-statement__host { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; }
.cp-statement__host:hover span { text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.cp-statement__face { width: 40px; height: 50px; object-fit: cover; filter: grayscale(1) contrast(104%); box-shadow: -3px 0 0 var(--cp-blue); background: var(--cp-ink); margin-left: 3px; }
.cp-home-essays { padding-block: var(--cp-space-8) var(--cp-space-9); }

/* 10 ─ Cards & rows -------------------------------------------------------- */
.cp-cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cp-space-5); align-items: stretch; }
.cp-cards > * { min-width: 0; }
.cp-card { display: flex; flex-direction: column; min-width: 0; }
.cp-card__link {
  --spine: 30%;
  display: grid; grid-template-columns: var(--spine) minmax(0, 1fr);
  position: relative; overflow: hidden;
  background: var(--cp-surface); border: 1px solid var(--cp-rule);
  text-decoration: none; color: var(--cp-ink);
  flex: 1 1 auto; min-height: 176px;
  transition: border-color var(--cp-ease);
}
.cp-card__link:hover { border-color: var(--cp-ink); }
.cp-card__spine { background: var(--cp-blue); color: var(--cp-bone); display: block; padding: 10px 8px; min-width: 0; }
.cp-card__num { display: block; font-family: var(--cp-display); font-weight: 900; font-variation-settings: "wdth" 82; font-size: clamp(2.2rem, 2.6vw + 1rem, 3rem); line-height: .82; letter-spacing: -.03em; }
.cp-card__panel { display: block; padding: 16px 18px 18px 20px; min-width: 0; }
.cp-card__title {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  font-family: var(--cp-display); font-weight: 900; font-variation-settings: "wdth" 88; text-transform: uppercase; letter-spacing: -.025em;
  font-size: clamp(1.4rem, 1.1rem + 1vw, 1.75rem); line-height: .95;
  min-height: calc(2 * .95em); /* lock to two lines so bands align across a row */
  overflow-wrap: anywhere;
}
.cp-card .cp-band {
  --band-bleed: calc(var(--spine) / (1 - .3) + 20px + 16px);
  font-size: clamp(1.35rem, 1rem + 1.2vw, 1.75rem);
  margin-top: .3em; margin-bottom: .1em;
  display: block; width: max-content; max-width: none;
}
.cp-card__meta { margin-top: var(--cp-space-3); color: var(--cp-ink-meta); font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; line-height: 1.5; }
.cp-card__type { color: var(--cp-ink-secondary); }

.cp-rows { list-style: none; border-top: 1px solid var(--cp-rule); }
.cp-rows__head { display: none; }
.cp-row { border-bottom: 1px solid var(--cp-rule); }
.cp-row__link { display: grid; grid-template-columns: 56px minmax(0, 1fr); grid-template-areas: "num title" "num sub"; column-gap: var(--cp-space-4); row-gap: 6px; align-items: center; min-height: 72px; padding: 14px 0; text-decoration: none; color: var(--cp-ink); transition: background var(--cp-ease); }
.cp-row__link:hover { background: var(--cp-surface); }
.cp-row__link:hover .cp-row__grot { text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.cp-row__num { grid-area: num; align-self: start; color: var(--cp-blue); font-family: var(--cp-display); font-weight: 900; font-variation-settings: "wdth" 82; font-size: 1.75rem; line-height: .9; letter-spacing: -.03em; }
.cp-row__num--essay { font-size: 1.5rem; color: var(--cp-blue); }
.cp-row__title { grid-area: title; min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.cp-row__grot { font-family: var(--cp-display); font-weight: 900; font-variation-settings: "wdth" 88; text-transform: uppercase; letter-spacing: -.02em; font-size: 1.125rem; line-height: 1.05; overflow-wrap: anywhere; }
.cp-row__band { font-family: var(--cp-serif); font-style: italic; font-size: 1.25rem; line-height: 1; color: var(--cp-ink); }
.cp-row__stand { flex-basis: 100%; font-family: var(--cp-serif); font-style: italic; font-size: 1.0625rem; line-height: 1.3; color: var(--cp-ink-secondary); }
.cp-row__sub { grid-area: sub; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px var(--cp-space-4); min-width: 0; }
.cp-row__who { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 2px 0; min-width: 0; font-family: var(--cp-sans); font-size: var(--fs-small); line-height: 1.35; color: var(--cp-ink-secondary); }
.cp-row__type { font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; color: var(--cp-ink-meta); white-space: nowrap; }
.cp-row__type + .cp-row__guest::before { content: "·"; margin-inline: .55em; opacity: .6; }
.cp-row__guest { font-weight: 600; color: var(--cp-ink); }
.cp-row__guest + .cp-row__guest::before { content: "& "; font-weight: 400; color: var(--cp-ink-secondary); margin-left: .35em; }
.cp-row__meta { grid-area: meta; color: var(--cp-ink-meta); font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; display: flex; flex-wrap: wrap; gap: 4px 0; min-width: 0; }
.cp-row__meta > * { white-space: nowrap; }
.cp-row__meta > span:not(.cp-duration) + time::before, .cp-row__meta > span:not(.cp-duration) + span:not(.cp-duration)::before { content: "·"; margin-inline: .55em; opacity: .6; }
.cp-pagination { display: flex; justify-content: space-between; align-items: center; gap: var(--cp-space-4); padding: var(--cp-space-6) 0; }

/* 11 ─ Episode --------------------------------------------------------------- */
.cp-episode { padding-top: var(--cp-space-6); }
.cp-hero { margin: 0; }
.cp-hero__frame { position: relative; aspect-ratio: 16 / 9; background: var(--cp-ink); border-left: var(--cp-rule-w) solid var(--cp-blue); overflow: hidden; }
.cp-hero__img { width: 100%; height: 100%; object-fit: cover; display: block; filter: grayscale(1) contrast(104%); }
.cp-hero__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.cp-hero__play { position: absolute; left: var(--cp-space-5); bottom: var(--cp-space-5); z-index: 2; }
.cp-hero__watch { position: absolute; right: var(--cp-space-5); bottom: calc(var(--cp-space-5) + 4px); color: var(--cp-bone); z-index: 2; }
.cp-hero__watch .cp-duration::before { content: "·"; }
.cp-hero--playing .cp-hero__play, .cp-hero--playing .cp-hero__watch, .cp-hero--playing .cp-hero__img { display: none; }

.cp-ink { background: var(--cp-ink); color: var(--cp-bone); padding: var(--cp-space-4) var(--cp-space-5); display: flex; flex-direction: column; gap: var(--cp-space-4); }
.cp-ink__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 0; color: var(--cp-bone); }
.cp-ink__num { color: var(--cp-lime); }
.cp-ink__actions { margin-left: auto; display: inline-flex; gap: var(--cp-space-2); }
.cp-watch { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 16px; margin-block: -12px; background: transparent; color: var(--cp-bone); border: 1px solid var(--cp-rule-bone-strong); font-family: var(--cp-sans); font-weight: 600; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; transition: background var(--cp-ease), color var(--cp-ease), border-color var(--cp-ease); }
.cp-watch .cp-ico { width: 20px; height: 20px; }
.cp-watch:hover { background: var(--cp-lime); color: var(--cp-ink); border-color: var(--cp-lime); }
.cp-watch:focus-visible { outline-color: var(--cp-lime); }
.cp-ink--watching .cp-player { display: none; }

/* A square or portrait feature image (a guest headshot) is fitted on the ink field, right-aligned, instead of being cover-cropped. JS sets data-cp-fit from the image's natural ratio. */
.cp-hero__img[data-cp-fit="contain"], .cp-home-hero__img[data-cp-fit="contain"] { object-fit: contain; object-position: 100% 100%; }
/* On the episode hero the fitted image is confined to the right 48% so the title on the left never sits over a photo's
   pale background (a two-shot on white was unreadable). Bottom-right anchored: a wide two-shot sits on the floor of the frame. */
@media (min-width: 600px) {
  .cp-hero__img[data-cp-fit="contain"] { position: absolute; top: 0; right: 0; bottom: 0; left: auto; width: 48%; height: 100%; }
}
.cp-hero__caption { display: none; position: absolute; left: 0; top: 0; bottom: 0; width: 52%; padding: var(--cp-space-6) var(--cp-space-5) calc(var(--cp-play) + var(--cp-space-7)) var(--cp-space-6); flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: 0; color: var(--cp-bone); z-index: 1; min-width: 0; overflow: hidden; }
.cp-hero__frame:has(> [data-cp-fit="contain"]) .cp-hero__caption, .cp-hero__frame--card .cp-hero__caption { display: flex; }
.cp-hero__frame--card .cp-hero__caption { width: 100%; }
.cp-hero__frame--card .cp-hero__caption-title { max-width: 14ch; }
.cp-hero__frame--card { background: var(--cp-ink) linear-gradient(90deg, rgba(31,77,255,.12), transparent 40%); }
.cp-hero__caption-kicker { position: absolute; top: var(--cp-space-6); left: var(--cp-space-6); color: var(--cp-lime); }
.cp-hero__caption-title { font-family: var(--cp-display); font-weight: 900; font-variation-settings: "wdth" 88; text-transform: uppercase; letter-spacing: -.03em; font-size: clamp(2.25rem, 5.4vw, 5rem); line-height: .86; overflow-wrap: anywhere; text-wrap: balance; max-width: 11ch; }
.cp-hero__caption .cp-band { --band-bleed: calc(var(--cp-space-6) + var(--cp-rule-w) + 24px); font-size: clamp(1.6rem, 3.2vw, 3rem); margin-top: .22em; }
/* the title block below hands the title to the hero (the h1 stays for assistive tech and search) */
@media (min-width: 600px) {
  .cp-episode:has(.cp-hero__img[data-cp-fit="contain"]) .cp-titleblock__title, .cp-episode:has(.cp-hero__frame--card) .cp-titleblock__title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .cp-episode:has(.cp-hero__img[data-cp-fit="contain"]) .cp-titleblock__main > .cp-band, .cp-episode:has(.cp-hero__frame--card) .cp-titleblock__main > .cp-band { display: none; }
  .cp-episode:has(.cp-hero__img[data-cp-fit="contain"]) .cp-titleblock, .cp-episode:has(.cp-hero__frame--card) .cp-titleblock { padding-top: var(--cp-space-7); }
  .cp-episode:has(.cp-hero__img[data-cp-fit="contain"]) .cp-titleblock .cp-standfirst, .cp-episode:has(.cp-hero__frame--card) .cp-titleblock .cp-standfirst { margin-top: 0; }
}
.cp-hero--playing .cp-hero__caption, .cp-hero__frame:has(> [data-cp-fit="contain"]).cp-hero__frame--playing .cp-hero__caption { display: none !important; }
.cp-hero__caption { pointer-events: none; }
.cp-hero__frame iframe { z-index: 3; }
.cp-hero__frame iframe[data-cp-warm] { visibility: hidden; }

/* the player — mobile first: scrub on top, controls one row beneath */
.cp-player { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; grid-template-areas: "scrub scrub scrub scrub" "play skips time rate"; gap: var(--cp-space-3) var(--cp-space-3); align-items: center; padding-top: var(--cp-space-2); border-top: 1px solid var(--cp-rule-bone); }
.cp-player[hidden] { display: none; }
.cp-player__play { grid-area: play; }
.cp-play .cp-ico--pause { display: none; }
.cp-player--playing .cp-ico--play { display: none; }
.cp-player--playing .cp-ico--pause { display: block; }
.cp-player__skips { grid-area: skips; display: flex; gap: 2px; }
.cp-player__skip { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 0; color: var(--cp-bone); padding: 0; transition: color var(--cp-ease); }
.cp-player__skip:hover { color: var(--cp-lime); }
.cp-player__skip .cp-ico { width: 30px; height: 30px; }
.cp-player__skip:focus-visible, .cp-player__rate:focus-visible, .cp-player__range:focus-visible { outline-color: var(--cp-lime); }
.cp-player__scrub { grid-area: scrub; position: relative; height: 44px; display: flex; align-items: center; min-width: 0; }
.cp-player__range { -webkit-appearance: none; appearance: none; width: 100%; height: 44px; margin: 0; background: transparent; cursor: pointer; position: relative; z-index: 2; }
.cp-player__range::-webkit-slider-runnable-track { height: 6px; background: var(--cp-rule-bone-strong); }
.cp-player__range::-moz-range-track { height: 6px; background: var(--cp-rule-bone-strong); }
.cp-player__range::-webkit-slider-thumb { -webkit-appearance: none; width: 16px; height: 16px; margin-top: -5px; background: var(--cp-bone); border: 0; border-radius: 0; }
.cp-player__range::-moz-range-thumb { width: 16px; height: 16px; background: var(--cp-bone); border: 0; border-radius: 0; }
.cp-player__fill { position: absolute; left: 0; top: 50%; height: 6px; transform: translateY(-50%); width: var(--fill, 0%); background: var(--cp-pink); pointer-events: none; z-index: 1; }
.cp-player__time { grid-area: time; font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; font-variant-numeric: tabular-nums; color: var(--cp-bone); white-space: nowrap; justify-self: end; }
.cp-player__sep { margin-inline: .5em; opacity: .5; }
.cp-player__rate { grid-area: rate; min-width: 52px; height: 44px; padding: 0 10px; background: transparent; color: var(--cp-bone); border: 1px solid var(--cp-rule-bone-strong); font-family: var(--cp-sans); font-weight: 600; font-size: var(--fs-label); letter-spacing: .08em; transition: background var(--cp-ease), color var(--cp-ease); }
.cp-player__rate:hover { background: var(--cp-lime); color: var(--cp-ink); border-color: var(--cp-lime); }

.cp-titleblock { padding-top: var(--cp-space-8); overflow-x: clip; }
.cp-episode:has(.cp-hero__img[data-cp-fit="contain"]) .cp-titleblock:not(:has(.cp-standfirst)), .cp-episode:has(.cp-hero__frame--card) .cp-titleblock:not(:has(.cp-standfirst)) { padding-top: 0; }
.cp-titleblock__main { min-width: 0; }
.cp-titleblock__title { max-width: min(20ch, 100%); }
.cp-titleblock .cp-band { --band-bleed: calc(var(--cp-margin) + 40px); display: block; width: max-content; }
.cp-titleblock .cp-standfirst { margin-top: var(--cp-space-6); }
.cp-rail { display: grid; gap: var(--cp-space-5); align-content: start; font-size: var(--fs-small); line-height: 1.5; }
.cp-rail__item { display: grid; gap: 6px; padding-top: var(--cp-space-3); border-top: 1px solid var(--cp-rule); min-width: 0; }
.cp-rail__item .cp-label { color: var(--cp-ink-meta); }
.cp-rail__value { display: flex; flex-direction: column; gap: 2px; min-width: 0; overflow-wrap: anywhere; }
.cp-rail__value a { text-decoration: none; }
.cp-rail__value a:hover { text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.cp-rail__sub { display: block; color: var(--cp-ink-secondary); font-size: .875rem; }

.cp-episode__body { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cp-space-7) var(--cp-space-8); padding-top: var(--cp-space-8); }
.cp-notes__h { color: var(--cp-ink-meta); padding-bottom: var(--cp-space-3); border-bottom: 1px solid var(--cp-rule); margin-bottom: var(--cp-space-4); }
.cp-notes { min-width: 0; }

.cp-xref { margin-top: var(--cp-space-7); padding-top: var(--cp-space-4); border-top: 1px solid var(--cp-rule); max-width: min(var(--cp-measure), 100%); }
.cp-xref__label { color: var(--cp-ink-meta); display: block; margin-bottom: var(--cp-space-3); }
.cp-xref__list { list-style: none; display: grid; gap: var(--cp-space-2); }
.cp-xref__list li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.cp-xref__link { font-family: var(--cp-display); font-weight: 800; font-variation-settings: "wdth" 92; text-transform: uppercase; letter-spacing: -.01em; font-size: 1.125rem; text-decoration: none; }
.cp-xref__link:hover { text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.cp-xref__meta { color: var(--cp-ink-meta); font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; }

.cp-guest { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cp-space-6) var(--cp-space-8); margin-top: var(--cp-space-8); padding: var(--cp-space-8) 0 var(--cp-space-6); border-top: 1px solid var(--cp-rule); }
.cp-guest__portrait { min-width: 0; max-width: 420px; border-left: var(--cp-rule-w) solid var(--cp-blue); background: var(--cp-ink); }
.cp-guest__portrait[hidden] { display: none; }
.cp-guest__img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 18%; filter: grayscale(1) contrast(104%); }
.cp-guest__body { min-width: 0; display: grid; gap: var(--cp-space-4); align-content: start; }
.cp-guest__label { color: var(--cp-ink-meta); }
.cp-guest__name { font-family: var(--cp-display); font-weight: 900; font-variation-settings: "wdth" 88; text-transform: uppercase; letter-spacing: -.02em; font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.25rem); line-height: .95; }
.cp-guest__standing { color: var(--cp-ink-secondary); font-size: var(--fs-small); line-height: 1.5; max-width: 36rem; }

.cp-platforms { background: var(--cp-ink); color: var(--cp-bone); padding: var(--cp-space-8) 0; margin-top: var(--cp-space-9); }
.cp-platforms__inner { width: 100%; max-width: calc(var(--cp-max) + 2 * var(--cp-margin)); margin-inline: auto; padding-inline: var(--cp-margin); }
.cp-platforms__h { font-family: var(--cp-display); font-weight: 800; font-variation-settings: "wdth" 92; text-transform: uppercase; letter-spacing: -.01em; font-size: var(--fs-h3); line-height: 1.15; margin-bottom: var(--cp-space-5); max-width: 30ch; }
.cp-platforms__list { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--cp-space-3); max-width: 42rem; }
.cp-tile { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; aspect-ratio: 1 / 1; border: 1px solid var(--cp-rule-bone-strong); color: var(--cp-bone); text-decoration: none; padding: 12px; min-height: 44px; transition: background var(--cp-ease), color var(--cp-ease), border-color var(--cp-ease); }
.cp-tile:hover { background: var(--cp-pink); color: var(--cp-ink); border-color: var(--cp-pink); }
.cp-tile:focus-visible { outline-color: var(--cp-lime); }
.cp-tile__mark { display: block; width: 46%; aspect-ratio: 1; background-color: currentColor; -webkit-mask: var(--mark) center / contain no-repeat; mask: var(--mark) center / contain no-repeat; }
.cp-tile__mark--apple { --mark: url("../icons/apple.svg"); }
.cp-tile__mark--spotify { --mark: url("../icons/spotify.svg"); }
.cp-tile__mark--youtube { --mark: url("../icons/youtube.svg"); }
.cp-tile__label { display: none; font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; text-align: center; }
.cp-platforms__rss { margin-top: var(--cp-space-5); font-size: var(--fs-small); color: var(--cp-bone); }
.cp-platforms__rss a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; }
.cp-platforms__rss .cp-ico { width: 18px; height: 18px; }

.cp-related { padding: var(--cp-space-9) 0; background: var(--cp-bone); }
.cp-related__inner { width: 100%; max-width: calc(var(--cp-max) + 2 * var(--cp-margin)); margin-inline: auto; padding-inline: var(--cp-margin); }
.cp-related__h { margin-bottom: var(--cp-space-6); }
.cp-related__all { margin-top: var(--cp-space-6); font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; }

/* 12 ─ Essay ----------------------------------------------------------------- */
.cp-marker { background: var(--cp-blue); color: var(--cp-bone); }
.cp-marker__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px var(--cp-space-5); min-height: 44px; padding-block: 12px; }
.cp-marker__word { font-weight: 700; }
.cp-marker__meta a { color: inherit; text-decoration: none; }
.cp-marker__meta a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.cp-marker .cp-dot { opacity: .75; }
.cp-essay__head { padding-top: var(--cp-space-8); }
.cp-essay__title { font-size: var(--fs-display-2); max-width: min(24ch, 100%); }
.cp-essay__stand { margin-top: var(--cp-space-6); max-width: min(30em, 100%); }
.cp-essay__body { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cp-space-7) var(--cp-space-8); padding-top: var(--cp-space-8); }
.cp-essay__rail { align-content: start; }
.cp-essay__col { min-width: 0; }
.cp-prose--essay { line-height: 1.8; }
.cp-prose--essay > * { max-width: min(68ch, 100%); }
.cp-essay__foot { padding-block: var(--cp-space-8) 0; }
.cp-essay__rule { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px var(--cp-space-5); padding: var(--cp-space-4) 0; border-top: 1px solid var(--cp-rule-strong); border-bottom: 1px solid var(--cp-rule); color: var(--cp-ink-meta); }
.cp-essay__rule a { color: var(--cp-ink); }
.cp-essay .cp-strip { margin-top: var(--cp-space-9); }
/* cf. margin references (JS-lifted from inline cross-links, wide screens only) */
.cp-cf { display: none; }

/* 13 ─ Page, host, archive, error ------------------------------------------- */
.cp-pagehead { padding-top: var(--cp-space-8); overflow-x: clip; }
.cp-pagehead__title { font-size: var(--fs-display-1); }
.cp-pagehead .cp-band { --band-bleed: calc(var(--cp-margin) + 40px); display: block; width: max-content; }
.cp-pagehead .cp-standfirst { margin-top: var(--cp-space-6); }
.cp-pagehead__meta { margin-top: var(--cp-space-5); color: var(--cp-ink-meta); }
.cp-page__body { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cp-space-7) var(--cp-space-8); padding-block: var(--cp-space-8) var(--cp-space-9); }
.cp-page__rail { align-content: start; }

.cp-host { background: var(--cp-ink); color: var(--cp-bone); overflow-x: clip; }
.cp-host__inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cp-space-6) var(--cp-space-8); }
.cp-host__copy { padding: var(--cp-space-7) 0 var(--cp-space-7); min-width: 0; }
.cp-host__label { color: var(--cp-lime); display: block; margin-bottom: var(--cp-space-5); }
.cp-host__name { font-family: var(--cp-display); font-weight: 900; font-variation-settings: "wdth" 88; text-transform: uppercase; letter-spacing: -.03em; font-size: clamp(2.75rem, 2rem + 3vw, 4.375rem); line-height: .86; max-width: 12ch; }
.cp-host__bio { margin-top: var(--cp-space-6); font-family: var(--cp-serif); font-style: italic; font-size: var(--fs-standfirst); line-height: 1.35; max-width: min(28em, 100%); color: var(--cp-bone); }
.cp-host__standing { display: flex; flex-wrap: wrap; gap: var(--cp-space-6); margin: var(--cp-space-7) 0 0; padding-top: var(--cp-space-4); border-top: 1px solid var(--cp-rule-bone-strong); }
.cp-host__standing div { display: grid; gap: 6px; }
.cp-host__standing dt { color: var(--cp-rule-bone-strong); color: rgba(242,237,228,.7); }
.cp-host__standing dd { margin: 0; font-size: var(--fs-small); }
.cp-host__standing a { color: inherit; }
.cp-host__portrait { margin-inline: calc(-1 * var(--cp-margin)); border-left: var(--cp-rule-w) solid var(--cp-blue); background: var(--cp-ink); }
.cp-host__img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; filter: grayscale(1) contrast(104%); }
.cp-host__episodes { padding-block: var(--cp-space-8) var(--cp-space-9); }

.cp-archive__head--lime { background: var(--cp-lime); color: var(--cp-ink); }
.cp-archive__head-inner { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--cp-space-4) var(--cp-space-6); padding-block: var(--cp-space-6) var(--cp-space-6); }
.cp-archive__title { font-size: var(--fs-display-1); }
.cp-archive__head-inner .cp-label:first-child { display: block; margin-bottom: var(--cp-space-3); }
.cp-archive__count { color: var(--cp-ink); }
.cp-archive__head-plain { padding-block: var(--cp-space-8) var(--cp-space-6); }
.cp-archive .cp-rows--archive { margin-top: 0; }
.cp-archive > .cp-container { padding-bottom: var(--cp-space-9); }
.cp-archive__head--lime + .cp-container { padding-top: var(--cp-space-6); }

.cp-error { padding: var(--cp-space-9) var(--cp-margin); display: grid; gap: var(--cp-space-6); justify-items: start; overflow-x: clip; }
.cp-error .cp-band { --band-bleed: calc(var(--cp-margin) + 40px); }

/* 14 ─ Prose & Ghost cards --------------------------------------------------- */
.cp-prose { font-size: var(--fs-body); line-height: 1.65; color: var(--cp-ink); min-width: 0; max-width: 100%; overflow-wrap: break-word; }
.cp-prose > * { max-width: min(var(--cp-measure), 100%); }
.cp-prose > .kg-width-wide, .cp-prose > .kg-width-full, .cp-prose > .kg-embed-card, .cp-prose > .kg-gallery-card, .cp-prose > .youtube-wrap { max-width: 100%; }
.cp-prose p, .cp-prose ul, .cp-prose ol, .cp-prose pre, .cp-prose table, .cp-prose figure, .cp-prose .kg-card { margin: 0 0 1.4em; }
.cp-prose > :last-child { margin-bottom: 0; }
.cp-prose h1, .cp-prose h2, .cp-prose h3, .cp-prose h4, .cp-prose h5, .cp-prose h6 { font-family: var(--cp-display); font-weight: 900; font-variation-settings: "wdth" 88; text-transform: uppercase; letter-spacing: -.02em; line-height: .95; margin: 2.2em 0 .6em; text-wrap: balance; }
.cp-prose h1 { font-size: var(--fs-display-2); }
.cp-prose h2 { font-size: var(--fs-h2); }
.cp-prose h3 { font-size: var(--fs-h3); font-weight: 800; font-variation-settings: "wdth" 92; line-height: 1.15; letter-spacing: -.01em; }
.cp-prose h4, .cp-prose h5, .cp-prose h6 { font-size: 1.125rem; font-weight: 800; font-variation-settings: "wdth" 92; line-height: 1.2; }
.cp-prose > h1:first-child, .cp-prose > h2:first-child, .cp-prose > h3:first-child, .cp-prose > h4:first-child { margin-top: 0; }
.cp-prose a:not(.kg-btn):not(.kg-bookmark-container):not(.kg-product-card-button):not(.kg-file-card-container) { color: var(--cp-ink); text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 3px; transition: background var(--cp-ease), color var(--cp-ease); }
.cp-prose a:not(.kg-btn):not(.kg-bookmark-container):not(.kg-product-card-button):not(.kg-file-card-container):visited { text-decoration-color: rgba(255, 46, 147, .45); }
.cp-prose a:not(.kg-btn):not(.kg-bookmark-container):not(.kg-product-card-button):not(.kg-file-card-container):hover { background: var(--cp-pink); color: var(--cp-bone); text-decoration-color: transparent; }
.cp-prose strong, .cp-prose b { font-weight: 700; }
.cp-prose em, .cp-prose i { font-style: italic; }
.cp-prose small { font-size: var(--fs-small); }
.cp-prose hr { border: 0; border-top: 1px solid var(--cp-rule-strong); margin: 3em 0; width: 100%; }
.cp-prose code { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: .875em; background: var(--cp-surface); border: 1px solid var(--cp-rule); padding: .1em .35em; }
.cp-prose pre { background: var(--cp-ink); color: var(--cp-bone); padding: var(--cp-space-5); overflow-x: auto; font-size: .875rem; line-height: 1.5; max-width: 100%; }
.cp-prose pre code { background: none; border: 0; padding: 0; font-size: inherit; }
.cp-prose sup, .cp-prose sub { line-height: 0; }
.cp-prose img { display: block; max-width: 100%; height: auto; }
.cp-prose figure img { width: 100%; }
.cp-prose figcaption, .cp-prose .kg-card figcaption { margin-top: var(--cp-space-3); color: var(--cp-ink-meta); font-size: var(--fs-small); line-height: 1.5; text-align: left; }
.cp-prose figcaption a { color: inherit; }
.cp-prose table { display: block; width: 100%; max-width: 100%; overflow-x: auto; border-collapse: collapse; font-size: var(--fs-small); line-height: 1.5; }
.cp-prose th, .cp-prose td { text-align: left; vertical-align: top; padding: 10px 14px 10px 0; border-bottom: 1px solid var(--cp-rule); }
.cp-prose th { font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; color: var(--cp-ink-meta); }

/* House conventions — lists with dash markers, never browser discs */
.cp-prose ul { list-style: none; padding-left: 1.5em; }
.cp-prose ul > li { position: relative; margin-bottom: .45em; }
.cp-prose ul > li::before { content: "—"; position: absolute; left: -1.5em; top: 0; color: var(--cp-ink-secondary); }
.cp-prose ol { list-style: none; counter-reset: cp-ol; padding-left: 2.2em; }
.cp-prose ol > li { position: relative; counter-increment: cp-ol; margin-bottom: .45em; }
.cp-prose ol > li::before { content: counter(cp-ol, decimal-leading-zero); position: absolute; left: -2.2em; top: .2em; font-family: var(--cp-sans); font-weight: 600; font-size: var(--fs-label); letter-spacing: .06em; color: var(--cp-blue); font-variant-numeric: tabular-nums; }
.cp-prose li > ul, .cp-prose li > ol { margin: .45em 0 .6em; }
.cp-prose li > p { margin-bottom: .45em; }
.cp-prose li > strong:first-child { font-weight: 700; }

/* Run-in subheads: a paragraph that is entirely one bold line */
.cp-prose p.cp-subhead { margin-top: 2.2em; margin-bottom: .35em; font-family: var(--cp-display); font-weight: 800; font-variation-settings: "wdth" 92; text-transform: uppercase; letter-spacing: -.01em; font-size: var(--fs-h3); line-height: 1.15; }
.cp-prose p.cp-subhead strong, .cp-prose p.cp-subhead b { font-weight: inherit; }
.cp-prose > p.cp-subhead:first-child { margin-top: 0; }
.cp-prose p.cp-subhead + p, .cp-prose p.cp-subhead + ul, .cp-prose p.cp-subhead + ol { margin-top: 0; }

/* Quotes: symmetric air above and below (block flow — margins collapse to 48px each side) */
.cp-prose blockquote { margin: var(--cp-space-7) 0; padding: 0 0 0 var(--cp-space-5); border-left: 3px solid var(--cp-pink); font-family: var(--cp-serif); font-style: italic; font-size: var(--fs-standfirst); line-height: 1.35; color: var(--cp-ink); max-width: min(var(--cp-measure), 100%); text-wrap: pretty; }
.cp-prose blockquote p { margin: 0 0 .6em; }
.cp-prose blockquote p:last-child { margin-bottom: 0; }
.cp-prose blockquote cite, .cp-prose blockquote .cp-cite { display: block; margin-top: .75em; font-family: var(--cp-sans); font-style: normal; font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; color: var(--cp-ink-meta); }
.cp-prose blockquote.kg-blockquote-alt { text-align: left; border: 0; padding: var(--cp-space-6) var(--cp-space-6); background: var(--cp-blue); color: var(--cp-bone); font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2rem); line-height: 1.25; max-width: 100%; }
.cp-prose blockquote.kg-blockquote-alt .cp-cite, .cp-prose blockquote.kg-blockquote-alt cite { color: var(--cp-bone); opacity: .8; }
.cp-prose > blockquote:first-child { margin-top: 0; }
.cp-prose > blockquote:last-child { margin-bottom: 0; }

/* Video: every iframe by src match — Ghost embed cards, raw HTML cards, Substack imports */
.cp-prose iframe[src*="youtube.com/embed"], .cp-prose iframe[src*="youtube-nocookie.com/embed"], .cp-prose iframe[src*="player.vimeo.com"], .cp-prose iframe[src*="youtube.com/"], .cp-prose iframe[src*="youtu.be"], .cp-prose iframe[src*="wistia"], .cp-prose iframe[src*="loom.com"] { display: block; width: 100% !important; max-width: 100%; aspect-ratio: 16 / 9; height: auto !important; border: 0; position: static !important; }
.cp-prose .youtube-wrap, .cp-prose .youtube-inner, .cp-prose .kg-embed-card > div[style] { padding: 0 !important; height: auto !important; position: static !important; max-width: 100%; }
.cp-prose .kg-embed-card { max-width: 100%; }
.cp-prose .kg-embed-card iframe, .cp-prose .kg-video-card video, .cp-prose .kg-audio-card audio { max-width: 100%; }
.cp-prose iframe:not([src*="youtube"]):not([src*="vimeo"]):not([src*="wistia"]):not([src*="loom"]) { max-width: 100%; }
.cp-prose .kg-embed-card iframe[src*="spotify.com"], .cp-prose iframe[src*="spotify.com"] { width: 100% !important; border-radius: 0; }
/* X / Twitter embeds: widgets.js replaces the blockquote with an iframe when it can load. When it can't (content blockers,
   Safari privacy settings, X outages) the blockquote stays — so it is styled as a quoted post, never plain text. */
.cp-prose blockquote.twitter-tweet { font-family: var(--cp-sans); font-style: normal; font-size: 1.0625rem; line-height: 1.55; color: var(--cp-ink); background: var(--cp-surface); border: 1px solid var(--cp-rule-strong); border-left: 3px solid var(--cp-ink); padding: 18px 22px 16px; max-width: min(34rem, 100%); margin: var(--cp-space-7) 0; }
.cp-prose blockquote.twitter-tweet::before { content: "Posted on X"; display: block; margin-bottom: 10px; font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; color: var(--cp-ink-meta); }
.cp-prose blockquote.twitter-tweet p { margin: 0 0 12px; font: inherit; }
.cp-prose blockquote.twitter-tweet > a { display: inline-flex; align-items: center; min-height: 32px; font-weight: 600; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; }
.cp-prose .twitter-tweet-rendered { margin: var(--cp-space-7) 0; }
.cp-prose .kg-embed-card blockquote:not(.twitter-tweet) { border: 0; padding: 0; font: inherit; }

/* Ghost cards (card_assets provides base behaviour; these are palette/typography overrides) */
.cp-prose .kg-image-card img { width: 100%; }
.cp-prose .kg-width-wide img, .cp-prose .kg-width-full img { width: 100%; }
.cp-prose .kg-gallery-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cp-prose .kg-bookmark-card, .cp-prose .kg-bookmark-container { text-decoration: none !important; background: none !important; color: inherit !important; }
.cp-prose .kg-bookmark-container { display: flex; flex-wrap: wrap; border: 1px solid var(--cp-rule-strong) !important; background: var(--cp-surface) !important; border-radius: 0 !important; box-shadow: none !important; overflow: hidden; min-width: 0; }
.cp-prose .kg-bookmark-container:hover { border-color: var(--cp-ink) !important; }
.cp-prose .kg-bookmark-content { flex: 1 1 260px; min-width: 0; padding: 18px 20px; display: flex; flex-direction: column; gap: 6px; }
.cp-prose .kg-bookmark-title { font-family: var(--cp-display); font-weight: 800; font-variation-settings: "wdth" 92; text-transform: uppercase; letter-spacing: -.01em; font-size: 1.125rem; line-height: 1.15; color: var(--cp-ink); }
.cp-prose .kg-bookmark-description { color: var(--cp-ink-secondary); font-size: var(--fs-small); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cp-prose .kg-bookmark-metadata { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 8px; font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; color: var(--cp-ink-meta); }
.cp-prose .kg-bookmark-icon { width: 16px; height: 16px; }
.cp-prose .kg-bookmark-thumbnail { flex: 0 0 200px; position: relative; min-height: 120px; border-left: var(--cp-rule-w) solid var(--cp-blue); background: var(--cp-ink); }
.cp-prose .kg-bookmark-thumbnail img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(104%); }
.cp-prose .kg-callout-card { border-radius: 0 !important; background: var(--cp-surface) !important; border: 1px solid var(--cp-rule-strong); padding: var(--cp-space-5); }
.cp-prose .kg-callout-card-accent { background: var(--cp-lime) !important; color: var(--cp-ink) !important; border-color: var(--cp-lime); }
.cp-prose .kg-callout-card-blue { background: var(--cp-blue) !important; color: var(--cp-bone) !important; border-color: var(--cp-blue); }
.cp-prose .kg-callout-card-pink { background: var(--cp-pink) !important; color: var(--cp-ink) !important; border-color: var(--cp-pink); }
.cp-prose .kg-callout-text { font-size: 1.0625rem; line-height: 1.55; }
.cp-prose .kg-toggle-card { border-radius: 0 !important; background: var(--cp-surface) !important; border: 1px solid var(--cp-rule-strong); }
.cp-prose .kg-toggle-heading-text { font-family: var(--cp-display); font-weight: 800; font-variation-settings: "wdth" 92; text-transform: uppercase; letter-spacing: -.01em; font-size: 1.125rem !important; }
.cp-prose .kg-toggle-content { font-size: 1.0625rem; }
.cp-prose .kg-btn, .cp-prose .kg-button-card .kg-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 22px; background: var(--cp-ink) !important; color: var(--cp-lime) !important; border-radius: 0 !important; font-family: var(--cp-sans) !important; font-weight: 600 !important; font-size: var(--fs-label) !important; letter-spacing: .11em; text-transform: uppercase; text-decoration: none; }
.cp-prose .kg-btn:hover { background: var(--cp-pink) !important; color: var(--cp-ink) !important; }
.cp-prose .kg-header-card { border-radius: 0 !important; }
.cp-prose .kg-header-card h2, .cp-prose .kg-header-card h3 { font-family: var(--cp-display); text-transform: uppercase; }
.cp-prose .kg-product-card-container, .cp-prose .kg-file-card-container, .cp-prose .kg-audio-card, .cp-prose .kg-video-card { border-radius: 0 !important; box-shadow: none !important; }
.cp-prose .kg-file-card-container { border: 1px solid var(--cp-rule-strong) !important; background: var(--cp-surface) !important; }
.cp-prose .kg-file-card-title { font-family: var(--cp-display); font-weight: 800; text-transform: uppercase; }
.cp-prose .kg-audio-card { background: var(--cp-ink) !important; color: var(--cp-bone) !important; }
.cp-prose .kg-audio-title { color: var(--cp-bone) !important; }
.cp-prose .kg-video-card video { width: 100%; height: auto; }
.cp-prose .kg-signup-card, .cp-prose .kg-cta-card { border-radius: 0 !important; }
.cp-prose .kg-nft-card-container { border-radius: 0 !important; }
.cp-prose .kg-embed-card figcaption { text-align: left; }

/* Substack import hygiene */
.cp-prose .captioned-image-container figure { margin: 0; }
.cp-prose .image-link { display: block; }
.cp-prose .subscription-widget, .cp-prose .subscribe-widget, .cp-prose .button-wrapper { display: none; }
.cp-prose .pullquote { border-left: 3px solid var(--cp-pink); padding-left: var(--cp-space-5); font-family: var(--cp-serif); font-style: italic; font-size: var(--fs-standfirst); }

/* Timecodes written in the show notes (00:00, 1:02:15) become seek buttons when the player is present */
.cp-tc { display: inline; font: inherit; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--cp-pink); background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.cp-tc:hover { background: var(--cp-pink); color: var(--cp-bone); text-decoration-color: transparent; }
.cp-tc--active { color: var(--cp-ink); }

/* guest card (episode rail) */
.cp-guestcard { gap: 10px; }
.cp-guestcard__link { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 14px; align-items: center; text-decoration: none; color: var(--cp-ink); }
.cp-guestcard__text { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.cp-guestcard__link:hover .cp-guestcard__name { text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.cp-guestcard__photo { display: block; width: 84px; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 18%; background: var(--cp-ink); border-left: 3px solid var(--cp-blue); filter: grayscale(1) contrast(104%); }
.cp-guestcard__name { font-family: var(--cp-display); font-weight: 900; font-variation-settings: "wdth" 88; text-transform: uppercase; letter-spacing: -.02em; font-size: 1.375rem; line-height: .95; overflow-wrap: anywhere; }
.cp-guestcard__standing { color: var(--cp-ink-secondary); font-size: .875rem; line-height: 1.4; }
.cp-guestcard__bio { color: var(--cp-ink); font-size: var(--fs-small); line-height: 1.55; margin-top: 4px; }
.cp-guestcard__more { display: inline-flex; align-items: center; min-height: 44px; margin-top: 2px; font-family: var(--cp-sans); font-weight: 600; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; color: var(--cp-ink); text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.cp-guestcard__more:hover { background: var(--cp-pink); color: var(--cp-bone); text-decoration-color: transparent; }

/* guest directory tiles */
.cp-gtiles { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cp-space-7) var(--cp-space-5); padding-block: var(--cp-space-8) var(--cp-space-9); }
.cp-gtiles > * { min-width: 0; }
.cp-gtile { display: flex; flex-direction: column; gap: 8px; }
.cp-gtile__link { display: block; text-decoration: none; color: var(--cp-ink); }
.cp-gtile__photo { display: block; aspect-ratio: 4 / 5; background: var(--cp-ink); border-left: var(--cp-rule-w) solid var(--cp-blue); overflow: hidden; margin-bottom: var(--cp-space-4); }
.cp-gtile__photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; filter: grayscale(1) contrast(104%); transition: filter var(--cp-ease); }
.cp-gtile__link:hover .cp-gtile__photo img { filter: grayscale(1) contrast(110%); }
.cp-gtile__name { font-family: var(--cp-display); font-weight: 900; font-variation-settings: "wdth" 88; text-transform: uppercase; letter-spacing: -.02em; font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); line-height: .95; overflow-wrap: anywhere; }
.cp-gtile__link:hover .cp-gtile__name { text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.cp-gtile__text { display: flex; flex-direction: column; gap: 6px; }
.cp-gtile__standing { color: var(--cp-ink-secondary); font-size: var(--fs-small); line-height: 1.45; }
.cp-gtile__bio { font-size: var(--fs-small); line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.cp-gtile__meta { color: var(--cp-ink-meta); margin-top: 4px; }
.cp-gtile__meta a { display: inline-flex; align-items: center; min-height: 44px; margin-block: -14px; color: var(--cp-ink); text-decoration: none; }
.cp-gtile__meta a:hover { text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.cp-host__text { margin-top: var(--cp-space-5); font-size: var(--fs-small); line-height: 1.6; max-width: 34rem; color: rgba(242, 237, 228, .85); }

/* tag pages: when the tag is a guest, the generic list is redundant */
body:has(.cp-guestpage) .cp-tagfallback, body:has(.cp-guestpage) .cp-taglist { display: none; }

/* AI disclosure sign-off: quiet apparatus under the prose */
.cp-ai { margin-top: var(--cp-space-7); padding-top: var(--cp-space-3); border-top: 1px solid var(--cp-rule); width: min(9rem, 100%); white-space: nowrap; font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; color: var(--cp-ink-meta); }
.cp-ai__link { display: inline-block; padding: 14px 0; margin: -14px 0; color: inherit; text-decoration: none; }
.cp-ai__link:hover { color: var(--cp-ink); text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.cp-ai + .cp-ai { display: none; }

/* 15 ─ Subscribe strip & footer -------------------------------------------- */
.cp-strip { background: var(--cp-blue); color: var(--cp-bone); }
.cp-strip__inner { width: 100%; max-width: calc(var(--cp-max) + 2 * var(--cp-margin)); margin-inline: auto; padding: var(--cp-space-7) var(--cp-margin); display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cp-space-6) var(--cp-space-8); align-items: center; }
.cp-strip__h { font-family: var(--cp-display); font-weight: 900; font-variation-settings: "wdth" 88; text-transform: uppercase; letter-spacing: -.02em; font-size: var(--fs-h2); line-height: .95; }
.cp-strip__p { margin-top: var(--cp-space-3); font-size: var(--fs-small); line-height: 1.55; max-width: 34rem; }
.cp-strip .cp-form__input { border-color: var(--cp-blue); }
.cp-strip .cp-form__input:focus-visible { outline-color: var(--cp-lime); }
.cp-strip .cp-btn--lime:focus-visible { outline-color: var(--cp-bone); }
.cp-strip .cp-form.error .cp-form__input { border-color: var(--cp-pink); }
.cp-strip .cp-form__msg--error { color: var(--cp-bone); }

.cp-footer { background: var(--cp-ink); color: var(--cp-bone); border-top: 2px solid var(--cp-blue); }
.cp-footer__inner { width: 100%; max-width: calc(var(--cp-max) + 2 * var(--cp-margin)); margin-inline: auto; padding: var(--cp-space-7) var(--cp-margin) var(--cp-space-6); display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cp-space-7) var(--cp-space-8); }
.cp-footer__inner > * { min-width: 0; }
.cp-footer__line { margin-top: var(--cp-space-5); font-size: var(--fs-small); line-height: 1.5; max-width: 30rem; }
.cp-footer__meta { margin-top: 6px; font-size: var(--fs-small); color: rgba(242, 237, 228, .7); }
.cp-footer__nav ul { list-style: none; display: grid; gap: 6px; }
.cp-footer__nav a { display: inline-flex; align-items: center; min-height: 32px; color: var(--cp-bone); text-decoration: none; font-family: var(--cp-sans); font-weight: 600; font-size: var(--fs-nav); letter-spacing: .11em; text-transform: uppercase; }
.cp-footer__nav a:hover { color: var(--cp-lime); }
.cp-footer__nav a:focus-visible { outline-color: var(--cp-lime); }
.cp-footer .cp-form__input { border-color: var(--cp-ink); }
.cp-footer .cp-form__input:focus-visible { outline-color: var(--cp-lime); }
.cp-footer__legal { width: 100%; max-width: calc(var(--cp-max) + 2 * var(--cp-margin)); margin-inline: auto; padding: var(--cp-space-4) var(--cp-margin) var(--cp-space-6); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px var(--cp-space-5); font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); letter-spacing: .11em; text-transform: uppercase; color: rgba(242, 237, 228, .6); border-top: 1px solid var(--cp-rule-bone); }
body:has(.cp-strip) .cp-footer__form { display: none; }

/* 16 ─ Responsive ------------------------------------------------------------ */
/* Hosts page (page-hosts.hbs) */
.cp-hosts__intro { padding-top: var(--cp-space-6); }
.cp-hosts__intro + .cp-container .cp-hostgrid { padding-top: var(--cp-space-5); }
.cp-hosts__prose { max-width: 40rem; }
.cp-hostgrid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cp-space-8) var(--cp-space-7); padding-block: var(--cp-space-7) var(--cp-space-9); }
.cp-hostcard { display: flex; flex-direction: column; gap: var(--cp-space-4); min-width: 0; }
.cp-hostcard__link { display: block; text-decoration: none; color: var(--cp-ink); }
.cp-hostcard__photo { display: block; aspect-ratio: 4 / 5; background: var(--cp-ink); border-left: var(--cp-rule-w) solid var(--cp-blue); overflow: hidden; margin-bottom: var(--cp-space-5); }
.cp-hostcard__photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; filter: grayscale(1) contrast(104%); }
.cp-hostcard__name { font-family: var(--cp-display); font-weight: 900; font-variation-settings: "wdth" 88; text-transform: uppercase; letter-spacing: -.03em; font-size: clamp(2rem, 1.5rem + 2vw, 3rem); line-height: .9; overflow-wrap: anywhere; }
.cp-hostcard__link:hover .cp-hostcard__name { text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.cp-hostcard__bio { font-family: var(--cp-serif); font-style: italic; font-size: var(--fs-standfirst); line-height: 1.35; max-width: 26em; }
.cp-hostcard__standing { display: flex; flex-wrap: wrap; gap: var(--cp-space-5) var(--cp-space-6); margin: var(--cp-space-3) 0 0; padding-top: var(--cp-space-4); border-top: 1px solid var(--cp-rule); }
.cp-hostcard__standing div { display: grid; gap: 6px; }
.cp-hostcard__standing dt { color: var(--cp-ink-meta); }
.cp-hostcard__standing dd { margin: 0; font-size: var(--fs-small); }
.cp-hostcard__more { align-self: flex-start; display: inline-flex; align-items: center; min-height: 44px; font-family: var(--cp-sans); font-weight: 600; font-size: var(--fs-nav); letter-spacing: .11em; text-transform: uppercase; color: var(--cp-ink); text-decoration: underline; text-decoration-color: var(--cp-pink); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.cp-hostcard__more:hover { text-decoration-color: var(--cp-ink); }
@media (min-width: 600px) { .cp-hostgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599.98px) {
  .cp-menubtn { display: inline-flex; }
  .cp-nav { position: absolute; left: 0; right: 0; top: 100%; background: var(--cp-ink); padding: 0 var(--cp-margin) var(--cp-space-4); display: none; border-top: 1px solid var(--cp-rule-bone); }
  .cp-nav--open { display: block; }
  .cp-nav__list { flex-direction: column; gap: 0; }
  .cp-nav__link { min-height: 48px; width: 100%; border-bottom: 1px solid var(--cp-rule-bone); }
  .cp-header .cp-lockup__word { font-size: 1.25rem; }
  .cp-header .cp-lockup__band { font-size: .95rem; }
  .cp-form__row { flex-direction: column; }
  .cp-form__btn { width: 100%; }
  .cp-ink { padding-inline: var(--cp-space-4); }
  .cp-hero__play, .cp-home-hero__play { left: var(--cp-space-4); bottom: var(--cp-space-4); }
  .cp-hero__watch { right: var(--cp-space-4); bottom: calc(var(--cp-space-4) + 4px); }
  .cp-tile { aspect-ratio: auto; min-height: 88px; }
  .cp-card__link { min-height: 150px; }
  .cp-hero__frame:has(> [data-cp-fit="contain"]) { aspect-ratio: 1 / 1; }
  .cp-episode__rail { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--cp-space-4); }
  .cp-guestcard { grid-column: 1 / -1; }
  .cp-ink__actions { flex-basis: 100%; margin-left: 0; margin-top: 6px; }
  .cp-watch { margin-block: 0; }
  .cp-hero__frame:not(.cp-hero__frame--card) .cp-hero__caption { display: none !important; }
  .cp-hero__frame--card { aspect-ratio: 4 / 3; }
  .cp-hero__frame--card .cp-hero__caption { padding: var(--cp-space-4); padding-bottom: var(--cp-space-5); }
  .cp-hero__frame--card .cp-hero__caption-kicker { top: var(--cp-space-4); left: var(--cp-space-4); }
  .cp-hero__frame--card .cp-hero__caption-title { font-size: 2rem; }
  .cp-hero__frame--card .cp-band { font-size: 1.5rem; }
  .cp-episode:has(.cp-hero__frame--card) .cp-titleblock__title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .cp-episode:has(.cp-hero__frame--card) .cp-titleblock__main > .cp-band { display: none; }
  .cp-episode:has(.cp-hero__frame--card) .cp-titleblock { padding-top: var(--cp-space-6); }
  .cp-episode:has(.cp-hero__frame--card) .cp-titleblock .cp-standfirst { margin-top: 0; }
  .cp-episode:has(.cp-hero__frame--card) .cp-titleblock:not(:has(.cp-standfirst)) { padding-top: 0; }
  .cp-tile__mark { width: 40px; }
  .cp-footer__inner { gap: var(--cp-space-6); padding-block: var(--cp-space-6) var(--cp-space-5); }
  .cp-footer__nav ul { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px var(--cp-space-5); }
  /* Guests directory: one row per guest instead of a full-width 4:5 portrait per guest. */
  .cp-gtiles { gap: var(--cp-space-5); padding-top: var(--cp-space-6); }
  .cp-gtile { gap: 10px; padding-bottom: var(--cp-space-5); border-bottom: 1px solid var(--cp-rule); }
  .cp-gtile:last-child { border-bottom: 0; }
  .cp-gtile__link { display: grid; grid-template-columns: 96px minmax(0, 1fr); column-gap: var(--cp-space-4); align-items: center; }
  .cp-gtile__photo { margin-bottom: 0; }
  .cp-gtile__name { font-size: 1.375rem; }
  .cp-gtile__bio { -webkit-line-clamp: 3; }
}
@media (min-width: 600px) {
  .cp-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cp-gtiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cp-row__link { grid-template-columns: 72px minmax(0, 1fr) minmax(0, 30%) 7.5rem; grid-template-areas: "num title who meta"; row-gap: 0; }
  .cp-row__num { align-self: center; }
  .cp-row__sub { display: contents; }
  .cp-row__who { grid-area: who; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
  .cp-row__type + .cp-row__guest::before { content: none; margin: 0; }
  .cp-row__meta { justify-content: flex-end; text-align: right; }
  .cp-row--essay .cp-row__link { grid-template-columns: 72px minmax(0, 1fr) auto; grid-template-areas: "num title meta"; }
  .cp-row--essay .cp-row__meta { justify-content: flex-start; text-align: left; }
  .cp-rows__head { display: grid; grid-template-columns: 72px minmax(0, 1fr) minmax(0, 30%) 7.5rem; column-gap: var(--cp-space-4); padding: 0 0 var(--cp-space-3); color: var(--cp-ink-meta); }
  .cp-rows__head > :last-child { text-align: right; }
  .cp-footer__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .cp-footer__form { grid-column: 1 / -1; }
  .cp-strip__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .cp-tile { min-height: 0; }
  .cp-guest { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
}
@media (min-width: 900px) {
  .cp-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cp-gtiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cp-home-hero__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .cp-home-hero__copy { padding: var(--cp-space-8) var(--cp-space-8) var(--cp-space-8) 0; }
  .cp-home-hero__still { margin-inline: 0 calc(-1 * var(--cp-margin)); align-self: stretch; aspect-ratio: auto; min-height: 420px; }
  .cp-home-hero__img { position: absolute; inset: 0; }
  .cp-episode__body { grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); }
  .cp-episode__rail { grid-column: 1; }
  .cp-episode__body .cp-notes { grid-column: 2; }
  .cp-essay__body { grid-template-columns: minmax(0, 2fr) minmax(0, 10fr); }
  .cp-page__body { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); }
  .cp-page__rail { border-left: 1px solid var(--cp-rule); padding-left: var(--cp-space-5); }
  .cp-page__rail .cp-rail__item:first-child { border-top: 0; padding-top: 0; }
  .cp-host__inner { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
  .cp-host__copy { padding: var(--cp-space-8) 0; }
  .cp-host__portrait { margin-inline: 0 calc(-1 * var(--cp-margin)); align-self: stretch; }
  .cp-host__img { height: 100%; aspect-ratio: auto; min-height: 460px; }
  .cp-player { grid-template-columns: var(--cp-play) auto minmax(0, 1fr) auto auto; grid-template-areas: "play skips scrub time rate"; gap: var(--cp-space-4); padding-top: var(--cp-space-3); }
  .cp-player__time { justify-self: auto; }
  .cp-tile__label { display: block; }
  .cp-statement__inner { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); align-items: end; }
  .cp-statement__hosts { justify-content: flex-end; }
  .cp-footer__inner { grid-template-columns: minmax(0, 5fr) minmax(0, 3fr) minmax(0, 4fr); }
  .cp-footer__form { grid-column: auto; }
  .cp-episode { padding-top: var(--cp-space-7); }
}
@media (min-width: 1280px) {
  .cp-prose--essay p { position: relative; }
  .cp-cf { display: block; position: absolute; left: calc(100% + var(--cp-space-6)); top: .25em; width: 180px; font-family: var(--cp-sans); font-weight: 500; font-size: var(--fs-label); letter-spacing: .06em; text-transform: none; line-height: 1.4; color: var(--cp-ink-meta); }
  .cp-cf em { font-style: italic; }
  .cp-cf a { color: inherit; text-decoration: none; }
  .cp-cf a:hover { text-decoration: underline; text-decoration-color: var(--cp-pink); }
}
@media (min-width: 1600px) {
  .cp-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .cp-gtiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* 17 ─ Motion & print ------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
  .cp-player__fill { transition: none; }
}
@media print {
  .cp-header, .cp-footer, .cp-strip, .cp-platforms, .cp-player, .cp-related, .cp-hero__play { display: none !important; }
  body { background: #fff; color: #000; }
}