/* Generated pages: episodes, transcripts, creator and tool hubs.
   Built on the tokens in styles.css; one card component throughout. */

.ep-page .page { max-width: 960px; }

.ep-box {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--white-12);
  border-radius: 18px;
}

.muted { color: var(--white-60); }

/* Breadcrumbs */
.crumbs {
  font-family: var(--font-caps);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--white-60);
  margin-bottom: 28px;
}
.crumbs a { color: var(--white-60); text-decoration: none; }
.crumbs a:hover { color: var(--white); }
.crumbs .sep { margin: 0 10px; opacity: 0.5; }
.crumbs [aria-current] { color: var(--white-80); }

/* Hero + player */
.ep-hero .page-title { max-width: 820px; }
.ep-meta { color: var(--white-80); font-size: 14px; margin: -6px 0 26px; }
.ep-meta a, .ep-fine a, .prose a { color: var(--gold-500); }

.player {
  position: relative;
  aspect-ratio: 16 / 9;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid var(--white-12);
  background: #000;
}
.player iframe, .player-facade { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.player-facade { padding: 0; cursor: pointer; background: #000; }
.player-facade img { width: 100%; height: 100%; object-fit: cover; display: block; }
.play-btn {
  position: absolute;
  left: 50%; top: 50%;
  width: 84px; height: 84px;
  margin: -42px 0 0 -42px;
  border-radius: 50%;
  background: var(--gold-500);
  color: var(--purple-990);
  font-size: 28px;
  display: grid;
  place-items: center;
  padding-left: 6px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.45);
  transition: transform 0.2s ease;
}
.player-facade:hover .play-btn { transform: scale(1.06); }

.listen { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.listen .btn { padding: 11px 20px; font-size: 11px; }

/* Sections */
.ep-section { margin-top: 72px; }
.ep-h2 {
  font-weight: 800;
  font-size: clamp(24px, 3vw, 32px);
  line-height: 1.12;
  letter-spacing: -0.01em;
  margin-bottom: 14px;
}
.ep-h3 {
  font-family: var(--font-caps);
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--gold-500);
  margin: 0 0 14px;
}
.ep-lede { color: var(--white-80); font-size: 17px; line-height: 1.7; max-width: 760px; }
.ep-sub { color: var(--white-60); font-size: 14px; line-height: 1.6; margin-bottom: 22px; max-width: 680px; }
.ep-fine { color: var(--white-60); font-size: 12px; line-height: 1.6; margin-top: 14px; }

/* Verdict colours: 1 gold, 2 violet, 3 dim */
.v1 { background: var(--gold-500); }
.v2 { background: var(--violet-500); }
.v3 { background: rgba(255, 255, 255, 0.22); }

/* Scoreboard (also used for creator / tool hub lists) */
.scoreboard { list-style: none; display: grid; gap: 8px; }
.scoreboard a {
  display: grid;
  grid-template-columns: 34px 1fr minmax(120px, 34%) 44px;
  align-items: center;
  gap: 16px;
  padding: 14px 18px;
  color: var(--white);
  text-decoration: none;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--white-12);
  border-radius: 14px;
  transition: border-color 0.2s ease;
}
.scoreboard a:hover { border-color: var(--white-24); }
.sb-rank { font-family: var(--font-caps); font-weight: 700; font-size: 18px; color: var(--gold-500); }
.sb-title { font-weight: 600; font-size: 15px; line-height: 1.3; }
.sb-title small { display: block; font-weight: 400; font-size: 12px; color: var(--white-60); margin-top: 3px; }
.sb-bar, .v-bar { display: flex; height: 8px; border-radius: 99px; overflow: hidden; background: rgba(255, 255, 255, 0.08); }
.sb-bar span, .v-bar span { display: block; height: 100%; }
.sb-score { font-family: var(--font-caps); font-weight: 700; font-size: 20px; text-align: right; }

/* Takeaways */
.takeaways { list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.takeaways li { padding: 20px 22px; display: flex; gap: 16px; }
.tk-n { font-family: var(--font-caps); font-weight: 700; color: var(--gold-500); font-size: 15px; padding-top: 2px; }
.takeaways p { color: var(--white-80); font-size: 14px; line-height: 1.6; }

/* Pieces */
.piece {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  gap: 28px;
  padding: 22px;
  margin-bottom: 16px;
  scroll-margin-top: 24px;
}
.piece-media { min-width: 0; }
.embed-facade {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 16 / 10;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--white-12);
  background: radial-gradient(circle at 30% 20%, rgba(139, 61, 240, 0.35), transparent 60%), var(--purple-950);
  color: var(--white);
  cursor: pointer;
  padding: 0;
  font: inherit;
}
.embed-none { cursor: default; }
.embed-facade img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.75; }
.facade-label {
  position: relative;
  font-family: var(--font-caps);
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  background: rgba(20, 8, 48, 0.82);
  border: 1px solid var(--white-24);
  border-radius: 999px;
  padding: 10px 16px;
}
.embed-facade:not(.embed-none):hover .facade-label { background: var(--gold-500); color: var(--purple-990); border-color: var(--gold-500); }
.embed-frame { width: 100%; border: 0; border-radius: 12px; background: #fff; display: block; }
.embed-frame.kind-youtube, .embed-frame.kind-vimeo { aspect-ratio: 16 / 9; background: #000; }
.embed-frame.kind-x, .embed-frame.kind-linkedin { height: 560px; }
.embed-frame.kind-instagram { height: 640px; max-width: 420px; margin: 0 auto; }

.piece-n { font-family: var(--font-caps); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--white-60); margin-bottom: 8px; }
.piece-title { font-weight: 800; font-size: 22px; line-height: 1.2; margin-bottom: 6px; }
.piece-by { font-size: 14px; color: var(--white-80); margin-bottom: 12px; }
.piece-by a { color: var(--white); }
.piece-take { color: var(--white-80); font-size: 14px; line-height: 1.7; margin-bottom: 14px; }
.piece-quote { border-left: 2px solid var(--gold-500); padding-left: 14px; font-size: 14px; line-height: 1.6; margin-bottom: 14px; }
.piece-quote cite { display: block; font-style: normal; font-size: 12px; color: var(--white-60); margin-top: 6px; }
.piece-link { font-size: 13px; margin-top: 12px; }
.piece-link a { color: var(--gold-500); text-decoration: none; }

.ts {
  font-family: var(--font-caps);
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--gold-500);
  text-decoration: none;
  white-space: nowrap;
}
.ts:hover { color: var(--white); }

.chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.chip {
  font-size: 12px;
  color: var(--white-80);
  text-decoration: none;
  border: 1px solid var(--white-24);
  border-radius: 999px;
  padding: 5px 12px;
}
.chip:hover { color: var(--white); border-color: var(--white); }
.chip small { color: var(--white-60); margin-left: 4px; }
.chips-big .chip { font-size: 14px; padding: 8px 16px; }

/* Verdict block inside a piece */
.verdict { margin-top: 4px; }
.v-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; }
.v-label { font-family: var(--font-caps); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--white-60); }
.v-score { font-family: var(--font-caps); font-weight: 700; font-size: 22px; }
.v-score small { font-size: 12px; color: var(--white-60); margin-left: 2px; }
.v-keys { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 8px; font-size: 12px; color: var(--white-80); }
.v-keys i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; }
.k1 { background: var(--gold-500); }
.k2 { background: var(--violet-500); }
.k3 { background: rgba(255, 255, 255, 0.3); }
.v-note { font-size: 11px; color: var(--white-60); margin-top: 6px; }
.verdict-none .v-note { display: inline; margin-left: 10px; }

/* Quotes */
.quotes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.quote { padding: 22px; display: flex; flex-direction: column; justify-content: space-between; gap: 16px; }
.quote blockquote { font-size: 16px; line-height: 1.55; font-weight: 500; }
.quote figcaption { font-size: 12px; color: var(--white-60); display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
.quote figcaption strong { color: var(--white); font-family: var(--font-caps); letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; }

/* Chapters */
.chapters { list-style: none; columns: 2; column-gap: 28px; }
.chapters li { break-inside: avoid; }
.chapters a {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--white-12);
  color: var(--white-80);
  text-decoration: none;
  font-size: 14px;
  line-height: 1.4;
}
.chapters a:hover { color: var(--white); }
.ch-t { font-family: var(--font-caps); color: var(--gold-500); font-size: 13px; letter-spacing: 0.06em; }

/* FAQ */
.faq { display: grid; gap: 10px; }
.faq details { padding: 0 22px; }
.faq summary { cursor: pointer; list-style: none; padding: 18px 0; display: flex; justify-content: space-between; gap: 16px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-size: 22px; line-height: 1; color: var(--gold-500); }
.faq details[open] summary::after { content: "−"; }
.faq summary h3 { font-size: 16px; font-weight: 600; line-height: 1.4; }
.faq details p { color: var(--white-80); font-size: 14px; line-height: 1.7; padding-bottom: 20px; }

.prose p { color: var(--white-80); font-size: 15px; line-height: 1.75; margin-bottom: 14px; max-width: 760px; }

/* Facts + people */
.ep-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; }
.facts { padding: 8px 22px; }
.facts dl > div { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--white-12); }
.facts dl > div:last-child { border-bottom: 0; }
.facts dt { font-family: var(--font-caps); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--white-60); }
.facts dd { font-weight: 600; font-size: 14px; text-align: right; }
.facts-side .ep-h3 + .chips { margin-bottom: 26px; }
.people { list-style: none; display: grid; gap: 12px; }
.people li { display: flex; align-items: center; gap: 12px; }
.people img, .avatar-letter { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex: none; }
.avatar-letter { display: grid; place-items: center; background: var(--purple-950); border: 1px solid var(--white-24); font-weight: 700; }
.people strong { display: block; font-size: 14px; }
.people small { font-size: 12px; color: var(--white-60); }

/* CTA + pager */
.ep-cta { padding: 34px; text-align: center; }
.ep-cta p { color: var(--white-80); font-size: 15px; }
.ep-cta .listen { justify-content: center; }
.ep-pager { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 28px; }
.ep-pager a { padding: 18px 22px; text-decoration: none; color: var(--white); }
.ep-pager a:last-child { text-align: right; }
.ep-pager small { display: block; font-family: var(--font-caps); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--white-60); margin-bottom: 6px; }
.ep-pager span { font-weight: 600; font-size: 15px; }

/* Episode index grid */
.ep-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ep-card { overflow: hidden; text-decoration: none; color: var(--white); display: flex; flex-direction: column; transition: border-color 0.2s ease, transform 0.2s ease; }
.ep-card:hover { border-color: var(--white-24); transform: translateY(-3px); }
.ep-card img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.ep-card-body { padding: 16px 18px 20px; display: grid; gap: 6px; }
.ep-card small { font-family: var(--font-caps); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--white-60); }
.ep-card strong { font-size: 16px; line-height: 1.3; }
.ep-card em { font-style: normal; font-size: 12px; color: var(--gold-500); }

/* Transcript */
.transcript p { color: var(--white-80); font-size: 15px; line-height: 1.75; margin-bottom: 16px; max-width: 760px; }
.transcript .ts { margin-right: 8px; }
.transcript .ep-h3 { margin-top: 40px; scroll-margin-top: 24px; }

/* Mobile */
@media (max-width: 760px) {
  .ep-section { margin-top: 56px; }
  .ep-lede { font-size: 16px; }
  .play-btn { width: 64px; height: 64px; margin: -32px 0 0 -32px; font-size: 22px; }
  .scoreboard a { grid-template-columns: 26px 1fr 40px; gap: 6px 12px; padding: 12px 14px; }
  .sb-bar { grid-column: 2 / 3; grid-row: 2; }
  .sb-score { grid-row: 1 / 3; grid-column: 3; }
  .takeaways, .quotes, .ep-facts, .ep-pager { grid-template-columns: 1fr; }
  .ep-pager a:last-child { text-align: left; }
  .piece { grid-template-columns: 1fr; gap: 18px; padding: 16px; }
  .chapters { columns: 1; }
  .ep-grid { grid-template-columns: 1fr; }
  .ep-cta { padding: 26px 18px; }
  .embed-frame.kind-x, .embed-frame.kind-linkedin { height: 520px; }
}

@media (min-width: 761px) and (max-width: 980px) {
  .ep-grid { grid-template-columns: repeat(2, 1fr); }
}

.ep-page .site-footer .socials { justify-content: center; margin-bottom: 8px; }

/* ——— Creator Sessions (flagship pages) ——— */

.cs-dek { font-size: clamp(17px, 2vw, 21px); line-height: 1.5; color: var(--white-80); max-width: 760px; margin: -6px 0 18px; }
.chip-gold { border-color: var(--gold-500); color: var(--gold-500); }
.aka { font-weight: 500; color: var(--white-60); font-size: 0.55em; white-space: nowrap; }

/* Guest card + profile hero */
.guest-card { display: grid; grid-template-columns: 132px 1fr; gap: 28px; padding: 28px; align-items: start; }
.guest-card + .guest-card { margin-top: 12px; }
.guest-av { width: 132px; height: 132px; border-radius: 50%; object-fit: cover; border: 2px solid var(--white-24); }
.guest-av-big { width: 168px; height: 168px; }
.guest-hero { display: grid; grid-template-columns: 168px 1fr; gap: 34px; align-items: center; }
.guest-bio { color: var(--white-80); font-size: 15px; line-height: 1.7; margin-bottom: 16px; }
.guest-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 24px; margin-bottom: 16px; }
.guest-facts-wide { grid-template-columns: repeat(3, 1fr); padding: 6px 22px; }
.guest-facts div { padding: 10px 0; border-bottom: 1px solid var(--white-12); }
.guest-facts dt { font-family: var(--font-caps); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--white-60); margin-bottom: 3px; }
.guest-facts dd { font-weight: 600; font-size: 14px; }

/* Stat tiles */
.stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.stat-tile { padding: 20px; display: flex; flex-direction: column; gap: 6px; }
.stat-tile strong { font-weight: 800; font-size: clamp(26px, 3vw, 34px); line-height: 1.05; color: var(--gold-500); letter-spacing: -0.01em; }
.stat-tile span { color: var(--white-80); font-size: 13px; line-height: 1.45; }
.stat-tile small { color: var(--white-60); font-size: 11px; }
.stat-tile .ts { margin-top: auto; padding-top: 6px; }

/* Narration */
.nar-headline { font-weight: 900; font-size: clamp(34px, 5vw, 60px); line-height: 1; letter-spacing: -0.02em; text-transform: uppercase; margin-bottom: 18px; }
.run { padding: 18px 22px; margin-top: 26px; }
.run ol { list-style: none; columns: 2; column-gap: 28px; }
.run li { break-inside: avoid; }
.run a { display: grid; grid-template-columns: 64px 1fr; gap: 10px; padding: 8px 0; color: var(--white-80); text-decoration: none; font-size: 14px; border-bottom: 1px solid var(--white-12); }
.run a:hover { color: var(--white); }
.nar { margin-top: 84px; scroll-margin-top: 24px; max-width: 780px; }
.nar-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; font-family: var(--font-caps); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--white-60); margin-bottom: 10px; }
.nar-n { font-size: 34px; font-weight: 700; color: var(--gold-500); letter-spacing: 0; line-height: 1; }
.nar-label { color: var(--white-80); }
.nar-title { font-weight: 900; font-size: clamp(28px, 3.8vw, 44px); line-height: 1.04; letter-spacing: -0.015em; text-transform: uppercase; margin-bottom: 22px; }
.nar > p { color: var(--white-80); font-size: 16px; line-height: 1.8; margin-bottom: 16px; }
.pull { margin: 26px 0; padding: 4px 0 4px 22px; border-left: 3px solid var(--gold-500); }
.pull p { font-size: 19px; line-height: 1.5; font-weight: 600; color: var(--white); }
.pull-big p { font-size: clamp(22px, 2.6vw, 30px); font-weight: 800; text-transform: uppercase; line-height: 1.2; letter-spacing: -0.005em; }
.pull cite { display: flex; gap: 12px; align-items: baseline; margin-top: 8px; font-style: normal; }
.pull cite strong { font-family: var(--font-caps); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--white-60); font-weight: 600; }
.pins { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 22px; padding-top: 16px; border-top: 1px dashed var(--white-24); }
.pins span { font-family: var(--font-caps); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--white-60); margin-right: 4px; }
.pins a { font-size: 12px; color: var(--gold-500); text-decoration: none; border: 1px solid rgba(233, 197, 95, 0.4); border-radius: 999px; padding: 5px 12px; }

/* Films screened inline */
.film { padding: 14px; margin: 26px 0; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 18px; align-items: center; }
.film figcaption { display: grid; gap: 6px; font-size: 13px; color: var(--white-80); line-height: 1.5; }
.film figcaption strong { font-size: 18px; color: var(--white); line-height: 1.25; }
.film-k { font-family: var(--font-caps); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--white-60); }
.film figcaption a:not(.ts) { color: var(--gold-500); text-decoration: none; font-size: 13px; }

/* Explainer modules */
.mod { padding: 24px; margin: 28px 0; }
.mod-kicker { font-family: var(--font-caps); font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--gold-500); margin-bottom: 6px; }
.mod-title { font-weight: 800; font-size: 20px; line-height: 1.2; margin-bottom: 8px; }
.mod-intro { color: var(--white-80); font-size: 14px; line-height: 1.6; margin-bottom: 16px; }
.mod-caption, .mod-fine { color: var(--white-60); font-size: 12px; line-height: 1.5; margin-top: 14px; }

.cmp { display: grid; gap: 0; font-size: 14px; }
.cmp-row { display: grid; grid-template-columns: minmax(110px, 0.8fr) repeat(var(--cols), minmax(0, 1fr)); gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--white-12); align-items: start; color: var(--white-80); line-height: 1.45; }
.cmp-head { border-bottom-color: var(--white-24); }
.cmp-head strong { display: block; color: var(--white); font-size: 15px; }
.cmp-head small { display: block; color: var(--white-60); font-size: 12px; }
.cmp-label { font-family: var(--font-caps); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--white-60); padding-top: 2px; }
.cmp-now { color: var(--white); }

.steps { list-style: none; display: grid; gap: 8px; counter-reset: s; }
.steps li { display: grid; grid-template-columns: 40px 1fr; gap: 12px; align-items: start; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--white-12); background: rgba(255, 255, 255, 0.02); animation: stepGlow calc(var(--n) * 1.6s) infinite; animation-delay: calc(var(--i) * 1.6s); }
.st-n { font-family: var(--font-caps); font-weight: 700; color: var(--gold-500); font-size: 16px; }
.steps strong { display: block; font-size: 15px; }
.steps small { display: block; color: var(--white-80); font-size: 13px; line-height: 1.5; margin-top: 3px; }
@keyframes stepGlow { 0%, 100% { border-color: var(--white-12); } 4%, 12% { border-color: var(--gold-500); background: rgba(233, 197, 95, 0.06); } 18% { border-color: var(--white-12); background: rgba(255, 255, 255, 0.02); } }

.bars { display: grid; gap: 12px; }
.bar-row { display: grid; grid-template-columns: minmax(130px, 0.9fr) 2fr minmax(70px, auto); gap: 14px; align-items: center; font-size: 14px; }
.bar-label small { display: block; color: var(--white-60); font-size: 12px; }
.bar-track { height: 12px; border-radius: 99px; background: rgba(255, 255, 255, 0.08); overflow: hidden; }
.bar-fill { display: block; height: 100%; width: var(--w); border-radius: 99px; background: var(--violet-500); transform-origin: left; animation: growBar 1.4s ease-out both; }
.bar-hi .bar-fill { background: var(--gold-500); }
.bar-val { font-family: var(--font-caps); font-weight: 700; font-size: 15px; text-align: right; }
@keyframes growBar { from { transform: scaleX(0); } }

.dotsets { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 18px; }
.dotset-head { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 10px; font-size: 13px; }
.dotset-head span { font-family: var(--font-caps); font-weight: 700; color: var(--gold-500); font-size: 15px; }
.dots { display: flex; flex-wrap: wrap; gap: 4px; }
.dots i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255, 255, 255, 0.16); }
.dots i.keep { background: var(--gold-500); box-shadow: 0 0 0 3px rgba(233, 197, 95, 0.25); animation: keepPulse 2s infinite; }
.dotset small { display: block; margin-top: 8px; color: var(--white-60); font-size: 12px; line-height: 1.45; }
@keyframes keepPulse { 50% { box-shadow: 0 0 0 6px rgba(233, 197, 95, 0.08); } }

.day-track { position: relative; height: 34px; border-radius: 10px; background: rgba(255, 255, 255, 0.06); overflow: hidden; }
.day-b { position: absolute; top: 0; bottom: 0; }
.day-work { background: var(--violet-500); }
.day-admin { background: rgba(139, 61, 240, 0.5); }
.day-walk, .day-rest { background: var(--gold-500); }
.day-sleep { background: rgba(255, 255, 255, 0.1); }
.day-hours { position: relative; height: 20px; margin-top: 6px; }
.day-hours span { position: absolute; transform: translateX(-50%); font-family: var(--font-caps); font-size: 10px; letter-spacing: 0.1em; color: var(--white-60); }
.day-hours span:first-child { transform: none; }
.day-key { list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 18px; margin-top: 14px; font-size: 13px; color: var(--white-80); }
.day-key i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 8px; vertical-align: -1px; }
.day-key strong { color: var(--white); margin-right: 4px; }

/* Lesson ledger */
.filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 18px; }
.filters .chip { background: none; cursor: pointer; font: inherit; font-size: 12px; }
.filters .chip.is-on { border-color: var(--gold-500); color: var(--gold-500); }
.lessons { list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.lesson { padding: 20px 22px; display: flex; flex-direction: column; gap: 10px; scroll-margin-top: 24px; }
.lesson[hidden] { display: none; }
.lesson-top { display: flex; justify-content: space-between; align-items: center; }
.lesson-cat { font-family: var(--font-caps); font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--white-60); border: 1px solid var(--white-24); border-radius: 999px; padding: 3px 10px; }
.lesson h3 { font-weight: 800; font-size: 17px; line-height: 1.25; text-transform: uppercase; letter-spacing: 0.01em; }
.lesson blockquote { font-size: 14px; line-height: 1.55; color: var(--white-80); }
.lesson cite { display: flex; gap: 10px; align-items: baseline; font-style: normal; font-family: var(--font-caps); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--white-60); margin-top: 6px; }
.lesson-do { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--white-12); font-size: 14px; line-height: 1.55; }
.lesson-do span { display: block; font-family: var(--font-caps); font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--gold-500); margin-bottom: 4px; }

/* Toolkit */
.toolkit { list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.toolkit li { padding: 18px 20px; display: flex; flex-direction: column; gap: 8px; }
.toolkit li > div { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.toolkit .tk-name, .toolkit a:not(.ts) { color: var(--white); font-weight: 700; font-size: 16px; text-decoration: none; }
.toolkit p { color: var(--white-80); font-size: 13px; line-height: 1.55; }
.tk-verdict { font-family: var(--font-caps); font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; border-radius: 999px; padding: 3px 10px; border: 1px solid var(--white-24); color: var(--white-80); white-space: nowrap; }
.tk-verdict.v-core { border-color: var(--gold-500); color: var(--gold-500); }
.tk-verdict.v-mixed, .tk-verdict.v-workaround { border-color: var(--violet-500); color: #c9a6ff; }

@media (max-width: 760px) {
  .guest-card, .guest-hero { grid-template-columns: 1fr; gap: 18px; padding: 20px; }
  .guest-hero { padding: 0; }
  .guest-av, .guest-av-big { width: 104px; height: 104px; }
  .guest-facts, .guest-facts-wide { grid-template-columns: 1fr; }
  .run ol { columns: 1; }
  .nar { margin-top: 64px; }
  .nar > p { font-size: 15px; }
  .film { grid-template-columns: 1fr; }
  .cmp-row { grid-template-columns: 1fr; gap: 4px; }
  .cmp-head { display: none; }
  .cmp-row span:not(.cmp-label)::before { content: attr(data-col); display: block; font-family: var(--font-caps); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold-500); margin-top: 6px; }
  .bar-row { grid-template-columns: 1fr auto; }
  .bar-track { grid-column: 1 / -1; grid-row: 2; }
  .lessons, .toolkit { grid-template-columns: 1fr; }
  .day-key { grid-template-columns: 1fr; }
  .stats { grid-template-columns: repeat(2, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .steps li, .bar-fill, .dots i.keep { animation: none; }
}
