/* ============================================================
   podcast.css — native LFG podcast / editorial article pages.
   Article-only styles; nav, footer, rail, theme toggle and the
   design tokens all come from styles.css. Every class is namespaced
   .pod-* and scoped under .pod-main so nothing collides with the
   directory/editorial styles. Reads the same tokens, so Earth mode
   is inherited for free.
   Generated pages: podcast-*.html + podcast.html (see _gen_podcast.py).
   ============================================================ */
.pod-main{
  --pod-serif:'Fraunces',Georgia,'Times New Roman',serif;
  --pod-sans:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --pod-col:860px;
  --pod-shadow:0 24px 60px rgba(0,0,0,.45);
  --pod-radius:16px;
  max-width:1180px;
}
html[data-mode="earth"] .pod-main{ --pod-shadow:0 20px 50px rgba(58,44,96,.16); }

.pod-main a{color:inherit}

/* ---------- masthead ---------- */
.pod-article{padding:38px 0 6px}
.pod-kicker{
  display:flex; align-items:center; gap:9px; flex-wrap:wrap;
  font-family:var(--pod-sans); font-size:12.5px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:var(--dim-2); margin:0 0 18px;
}
.pod-kicker .pod-dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);
  box-shadow:0 0 0 4px rgba(var(--cyan-rgb),.15)}
.pod-kicker b{color:var(--text); font-weight:700}
.pod-masthead{display:grid; grid-template-columns:1fr auto; gap:32px; align-items:start}
.pod-title{
  font-family:var(--pod-serif); font-weight:600; font-optical-sizing:auto;
  font-size:clamp(31px,5vw,52px); line-height:1.04; letter-spacing:-.015em;
  margin:0 0 18px; text-wrap:balance;
}
.pod-dek{font-family:var(--pod-sans); font-size:19px; line-height:1.5; color:var(--dim);
  max-width:70ch; margin:0}
.pod-epno{
  font-family:var(--pod-serif); font-weight:500; font-size:clamp(84px,12vw,146px);
  line-height:.8; letter-spacing:-.03em; justify-self:end; user-select:none;
  background:linear-gradient(150deg,var(--cyan),var(--violet) 70%,var(--magenta));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.pod-epno small{display:block; font-family:var(--pod-sans); color:var(--dim-2);
  -webkit-text-fill-color:var(--dim-2); font-size:12px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; margin-top:6px; text-align:right}
@media(max-width:720px){
  .pod-masthead{grid-template-columns:1fr}
  .pod-epno{justify-self:start; margin-top:8px}
  .pod-epno small{text-align:left}
}

.pod-byline{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  margin:26px 0 0; padding:15px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  font-family:var(--pod-sans); font-size:14px; color:var(--dim-2);
}
.pod-byline .pod-who{display:flex;align-items:center;gap:10px; color:var(--text); font-weight:600}
.pod-byline .pod-av{width:30px;height:30px;border-radius:50%;flex:0 0 auto;
  background:linear-gradient(135deg,var(--violet),var(--cyan))}
.pod-byline .pod-sep{width:4px;height:4px;border-radius:50%;background:var(--dim-2)}
.pod-byline .pod-spread{margin-left:auto; display:flex; gap:8px}
.pod-chip{border:1px solid var(--line-2); border-radius:999px; padding:5px 12px; font-size:12.5px;
  font-weight:600; color:var(--dim); text-decoration:none}
.pod-chip:hover{color:var(--text); border-color:var(--cyan)}

/* ---------- video ---------- */
.pod-video{margin:26px 0 6px}
.pod-embed{position:relative; aspect-ratio:16/9; width:100%; border-radius:var(--pod-radius);
  overflow:hidden; border:1px solid var(--line-2); box-shadow:var(--pod-shadow); background:#000}
.pod-embed iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.pod-facade{
  position:relative; aspect-ratio:16/9; width:100%; border-radius:var(--pod-radius);
  overflow:hidden; border:1px solid var(--line-2); box-shadow:var(--pod-shadow);
  display:grid; place-items:center; text-align:center; cursor:pointer; text-decoration:none;
  background:
    radial-gradient(70% 90% at 50% 0%, rgba(var(--violet-rgb),.28), transparent 60%),
    radial-gradient(80% 90% at 50% 120%, rgba(var(--cyan-rgb),.22), transparent 60%),
    linear-gradient(180deg,var(--bg-3),var(--bg-2));
}
.pod-facade .pod-play{width:74px;height:74px;border-radius:50%;
  background:linear-gradient(135deg,var(--cyan),var(--violet));
  display:grid;place-items:center; box-shadow:0 10px 30px rgba(0,0,0,.4); transition:transform .15s}
.pod-facade:hover .pod-play{transform:scale(1.06)}
.pod-facade .pod-play svg{width:28px;height:28px;margin-left:4px;fill:#0c0912}
.pod-facade .pod-ptop{position:absolute; left:18px; top:16px; font-family:var(--pod-sans);
  font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--dim-2)}
.pod-facade .pod-pcap{position:absolute; left:0; right:0; bottom:16px; font-family:var(--pod-sans);
  font-size:13px; color:var(--dim); font-weight:500; padding:0 16px}

/* ---------- write-up ---------- */
.pod-body-head{max-width:var(--pod-col); margin:44px auto 0; font-family:var(--pod-serif);
  font-weight:600; font-size:23px; letter-spacing:-.01em; color:var(--text)}
.pod-body{max-width:var(--pod-col); margin:0 auto; padding:14px 0 8px; font-family:var(--pod-sans)}
.pod-body p{margin:0 0 20px; font-size:18px; line-height:1.66; color:var(--dim)}
.pod-body p.pod-lede{font-size:20px; color:var(--text)}
.pod-body .pod-drop{font-family:var(--pod-serif); font-weight:500; float:left; font-size:62px;
  line-height:.72; padding:6px 12px 0 0; color:var(--cyan-deep)}
.pod-pullquote{margin:30px 0; padding:6px 0 6px 24px; border-left:3px solid var(--cyan);
  font-family:var(--pod-serif); font-weight:500; font-size:25px; line-height:1.32; color:var(--text);
  letter-spacing:-.01em}
.pod-pullquote cite{display:block; margin-top:12px; font-family:var(--pod-sans); font-style:normal;
  font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--dim-2)}
.pod-body .pod-list{margin:0 0 20px; padding-left:1.2em}
.pod-body .pod-list li{font-size:18px; line-height:1.55; color:var(--dim); margin:0 0 8px}

/* ---------- transcript ---------- */
.pod-divider{max-width:var(--pod-col); margin:34px auto 0; border-top:1px solid var(--line)}
.pod-transcript{max-width:var(--pod-col); margin:0 auto; padding:28px 0 10px; font-family:var(--pod-sans)}
.pod-transcript>summary{list-style:none}
.pod-transcript>summary::-webkit-details-marker{display:none}
.pod-tsum{cursor:pointer; display:flex; align-items:center; justify-content:center; gap:12px;
  padding:15px 22px; border:1px solid var(--line-2); border-radius:999px; background:var(--bg-2);
  font-family:var(--pod-sans); font-weight:700; font-size:15px; letter-spacing:.01em; color:var(--text);
  transition:border-color .15s, background .15s}
.pod-tsum:hover{border-color:var(--cyan); background:var(--bg-3)}
.pod-tchev svg{width:18px; height:18px; display:block; color:var(--cyan); transition:transform .2s}
.pod-transcript[open] .pod-tchev svg{transform:rotate(180deg)}
.pod-transcript[open] .pod-lbl-closed{display:none}
.pod-transcript:not([open]) .pod-lbl-open{display:none}
.pod-tmeta{display:flex; flex-wrap:wrap; gap:8px 22px; margin:16px 0 6px; padding:14px 16px;
  background:var(--bg-2); border:1px solid var(--line); border-radius:12px; font-size:13.5px; color:var(--dim)}
.pod-tmeta b{color:var(--text)}
.pod-tnote{display:flex; gap:11px; align-items:flex-start; margin:14px 0 0; padding:12px 15px;
  border:1px solid var(--line); border-left:3px solid var(--violet); border-radius:10px;
  background:rgba(var(--violet-rgb),.06); font-size:13px; line-height:1.5; color:var(--dim-2)}
.pod-tnote svg{width:16px;height:16px;flex:0 0 auto;margin-top:1px;fill:var(--violet)}
.pod-tbody{padding:20px 0 0}
.pod-turn{margin:0 0 18px}
.pod-turn .pod-spk{display:block; font-size:12.5px; font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; margin:0 0 4px}
.pod-turn.host .pod-spk{color:var(--cyan-deep)}
.pod-turn.guest .pod-spk{color:var(--violet)}
.pod-turn p{margin:0; color:var(--dim); line-height:1.62}
.pod-turn.host p{color:var(--text)}

/* YouTube subscribe button (beneath the write-up) */
.pod-ytsub{max-width:var(--pod-col); margin:22px auto 4px; font-family:var(--pod-sans)}
.pod-main a.pod-ytbtn,.pod-ytbtn{display:inline-flex; align-items:center; gap:11px; text-decoration:none;
  background:#FF0000; color:#fff; font-weight:700; font-size:15.5px; letter-spacing:.01em;
  padding:13px 22px; border-radius:999px; box-shadow:0 10px 30px rgba(255,0,0,.26);
  transition:transform .15s, box-shadow .15s}
.pod-ytbtn:hover{transform:translateY(-1px); box-shadow:0 14px 36px rgba(255,0,0,.34)}
.pod-ytbtn-ic{display:inline-flex; align-items:center; justify-content:center; width:27px; height:19px;
  background:#fff; border-radius:5px; flex:0 0 auto}
.pod-ytbtn-ic svg{width:13px; height:13px; margin-left:1px; fill:#FF0000; display:block}
/* Earth mode: a deeper, muted red so it doesn't read as neon on the cream palette */
html[data-mode="earth"] .pod-ytbtn{background:#A6382B; box-shadow:0 10px 26px rgba(166,56,43,.20)}
html[data-mode="earth"] .pod-ytbtn:hover{box-shadow:0 14px 32px rgba(166,56,43,.28)}
html[data-mode="earth"] .pod-ytbtn-ic svg{fill:#A6382B}

/* ---------- listen CTA ---------- */
.pod-listen{max-width:var(--pod-col); margin:36px auto 0; font-family:var(--pod-sans)}
.pod-listen h3{font-family:var(--pod-serif); font-weight:600; font-size:22px; margin:0 0 16px}
.pod-cards{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.pod-lcard{display:block; text-decoration:none; padding:18px; border-radius:14px;
  border:1px solid var(--line-2); background:var(--bg-2); transition:transform .15s, border-color .15s}
.pod-lcard:hover{transform:translateY(-2px)}
.pod-lcard .pod-lk{font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--dim-2)}
.pod-lcard .pod-lt{font-family:var(--pod-serif); font-size:19px; font-weight:600; margin:8px 0 4px; color:var(--text)}
.pod-lcard .pod-lu{font-size:13.5px; color:var(--dim)}
.pod-lcard.yt:hover{border-color:var(--cyan)}
.pod-lcard.nl:hover{border-color:var(--violet)}
@media(max-width:600px){ .pod-cards{grid-template-columns:1fr} }

/* ---------- podcast index (podcast.html) ---------- */
.pod-index{max-width:1180px; padding:40px 0 20px}
.pod-index .pod-ihead{font-family:var(--pod-serif); font-weight:600; font-size:clamp(30px,4.5vw,46px);
  letter-spacing:-.015em; margin:0 0 8px}
.pod-index .pod-isub{font-family:var(--pod-sans); font-size:18px; color:var(--dim); max-width:60ch; margin:0 0 30px}
.pod-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:16px}
.pod-ecard{display:block; text-decoration:none; padding:22px; border-radius:14px;
  border:1px solid var(--line); background:var(--bg-2); transition:transform .15s, border-color .15s}
.pod-ecard:hover{transform:translateY(-3px); border-color:var(--cyan)}
.pod-ecard .pod-etag{font-family:var(--pod-sans); font-size:11.5px; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--dim-2)}
.pod-ecard .pod-et{font-family:var(--pod-serif); font-size:21px; font-weight:600; line-height:1.16;
  letter-spacing:-.01em; margin:10px 0 8px; color:var(--text)}
.pod-ecard .pod-eg{font-family:var(--pod-sans); font-size:14px; color:var(--dim)}
.pod-ecard .pod-em{font-family:var(--pod-sans); font-size:12.5px; color:var(--dim-2); margin-top:12px}
@media(prefers-reduced-motion:reduce){ .pod-main *{transition:none!important} }

/* ============================================================
   Fintech PR Unfiltered interview pages (_gen_pr.py). Q&A layout,
   magenta stream accent. Same tokens/shell as the podcast pages.
   ============================================================ */
.pr-main{
  --pr-serif:'Fraunces',Georgia,'Times New Roman',serif;
  --pr-sans:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --pr-col:860px;
  --pr-shadow:0 24px 60px rgba(0,0,0,.45);
  max-width:var(--pr-col);
}
html[data-mode="earth"] .pr-main{ --pr-shadow:0 20px 50px rgba(58,44,96,.16); }
.pr-main a{color:inherit}
.pr-article{padding:38px 0 6px; font-family:var(--pr-sans)}
.pr-kicker{display:flex; align-items:center; gap:9px; font-size:12.5px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:var(--dim-2); margin:0 0 18px}
.pr-kicker .pr-dot{width:7px;height:7px;border-radius:50%;background:var(--magenta);
  box-shadow:0 0 0 4px rgba(var(--magenta-rgb),.15)}
.pr-name{font-family:var(--pr-serif); font-weight:600; font-optical-sizing:auto;
  font-size:clamp(34px,5.5vw,56px); line-height:1.02; letter-spacing:-.015em; margin:0 0 6px; text-wrap:balance}
.pr-role{font-family:var(--pr-sans); font-size:16px; font-weight:600; color:var(--magenta); margin:0 0 16px;
  letter-spacing:.01em}
html[data-mode="earth"] .pr-role{color:var(--magenta)}
.pr-dek{font-family:var(--pr-sans); font-size:20.5px; line-height:1.5; color:var(--text); font-weight:400; max-width:62ch; margin:0}
.pr-meta{display:flex; gap:12px; align-items:center; margin:22px 0 0; padding:14px 0;
  border-top:1px solid var(--line); border-bottom:1px solid var(--line); font-size:14px; color:var(--dim-2)}

.pr-photo{margin:26px 0 8px; text-align:center}
.pr-photo img{width:100%; height:auto; border-radius:16px;
  border:1px solid var(--line-2); box-shadow:var(--pr-shadow)}
.pr-photo figcaption{font-family:var(--pr-sans); font-size:13.5px; color:var(--dim); margin-top:10px}

/* series intro: a white banner across the text column, LFG mark centred on top */
.pr-intro{margin:30px 0 10px; padding:26px 30px 24px; background:#fff; border-radius:14px;
  text-align:center; box-shadow:0 16px 44px rgba(0,0,0,.30)}
.pr-intro .pr-intro-logo{height:30px; width:auto; display:block; margin:0 auto 16px}
.pr-intro p{font-family:var(--pr-sans); font-weight:400; font-size:17.5px; line-height:1.56;
  color:#241F38; margin:0 auto 10px; max-width:62ch}
.pr-intro p:last-child{margin:0 auto; color:#5C5478; font-weight:600}

/* pull quote: editorial rules, centred, with quotation marks */
.pr-pullquote{margin:34px 0; padding:24px 0; border-top:1px solid var(--line-2); border-bottom:1px solid var(--line-2);
  text-align:center; font-family:var(--pr-serif); font-weight:500; font-size:26px; line-height:1.36;
  color:var(--text); letter-spacing:-.01em}
.pr-pullquote::before{content:"\201C"; color:var(--magenta)}
.pr-pullquote::after{content:"\201D"; color:var(--magenta)}

.pr-qa{margin:14px 0 0}
.pr-item{padding:24px 0; border-top:1px solid var(--line)}
.pr-item:first-child{border-top:none}
.pr-q{font-family:var(--pr-serif); font-weight:600; font-size:28px; line-height:1.22; letter-spacing:-.01em;
  color:var(--text); margin:0 0 14px}
.pr-a p{font-family:var(--pr-sans); font-size:19px; line-height:1.7; color:var(--text); margin:0 0 15px}
.pr-a p:last-child{margin:0}

.pr-note{margin:28px 0 0; padding:14px 16px; border:1px solid var(--line); border-left:3px solid var(--magenta);
  border-radius:10px; background:rgba(var(--magenta-rgb),.05); font-family:var(--pr-sans); font-size:13.5px;
  line-height:1.5; color:var(--dim-2)}
.pr-note a{color:var(--magenta); text-decoration:none}

.pr-listen{margin:36px 0 0; font-family:var(--pr-sans)}
.pr-listen h3{font-family:var(--pr-serif); font-weight:600; font-size:22px; margin:0 0 16px}
.pr-cards{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.pr-lcard{display:block; text-decoration:none; padding:18px; border-radius:14px; border:1px solid var(--line-2);
  background:var(--bg-2); transition:transform .15s, border-color .15s}
.pr-lcard:hover{transform:translateY(-2px)}
.pr-lcard .pr-lk{font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--dim-2)}
.pr-lcard .pr-lt{font-family:var(--pr-serif); font-size:19px; font-weight:600; margin:8px 0 4px; color:var(--text)}
.pr-lcard .pr-lu{font-size:13.5px; color:var(--dim)}
.pr-lcard.nl:hover{border-color:var(--violet)}
.pr-lcard.pr:hover{border-color:var(--magenta)}
@media(max-width:600px){ .pr-cards{grid-template-columns:1fr} }
.pr-inline{margin:18px 0 4px}
.pr-inline img{width:100%; height:auto; display:block; border-radius:12px;
  border:1px solid var(--line-2); box-shadow:var(--pr-shadow)}
.pr-inline figcaption{font-family:var(--pr-sans); font-size:13.5px; color:var(--dim); margin-top:9px}

/* ============================================================
   Fintech Scout profile pages (_gen_scout.py). Founder Q&A + a
   "Basics" facts panel + the LFG quiz. Violet stream accent.
   ============================================================ */
.sc-main{--sc-serif:'Fraunces',Georgia,serif; --sc-sans:'Hanken Grotesk',system-ui,sans-serif;
  --sc-col:860px; --sc-shadow:0 24px 60px rgba(0,0,0,.45); max-width:var(--sc-col)}
html[data-mode="earth"] .sc-main{--sc-shadow:0 20px 50px rgba(58,44,96,.16)}
.sc-main a{color:inherit}
.sc-article{padding:38px 0 6px; font-family:var(--sc-sans)}
.sc-kicker{display:flex; align-items:center; gap:9px; font-size:12.5px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:var(--dim-2); margin:0 0 18px}
.sc-kicker .sc-dot{width:7px;height:7px;border-radius:50%;background:var(--violet);
  box-shadow:0 0 0 4px rgba(var(--violet-rgb),.15)}
.sc-name{font-family:var(--sc-serif); font-weight:600; font-optical-sizing:auto;
  font-size:clamp(36px,6vw,60px); line-height:1.02; letter-spacing:-.015em; margin:0 0 6px; text-wrap:balance}
.sc-loc{font-family:var(--sc-sans); font-size:16px; font-weight:600; color:var(--violet); margin:0 0 16px}
.sc-dek{font-family:var(--sc-sans); font-size:20.5px; line-height:1.5; color:var(--text); font-weight:400; max-width:66ch; margin:0}
.sc-meta{display:flex; gap:12px; align-items:center; margin:22px 0 0; padding:14px 0;
  border-top:1px solid var(--line); border-bottom:1px solid var(--line); font-size:14px; color:var(--dim-2)}
.sc-photo{margin:26px 0 8px; text-align:center}
.sc-photo img{width:100%; height:auto; border-radius:16px; border:1px solid var(--line-2); box-shadow:var(--sc-shadow)}
.sc-photo figcaption{font-family:var(--sc-sans); font-size:13.5px; color:var(--dim); margin-top:10px}

/* white series-intro banner with the LFG mark on top */
.sc-intro{margin:30px 0 10px; padding:26px 30px 24px; background:#fff; border-radius:14px;
  text-align:center; box-shadow:0 16px 44px rgba(0,0,0,.30)}
.sc-intro .sc-intro-logo{height:30px; width:auto; display:block; margin:0 auto 16px}
.sc-intro p{font-family:var(--sc-sans); font-weight:400; font-size:17.5px; line-height:1.56;
  color:#241F38; margin:0 auto 10px; max-width:64ch}
.sc-intro p:last-child{margin:0 auto; color:#5C5478; font-weight:600}
.sc-intro a{color:#7A3E8F; text-decoration:underline}

/* The Basics panel */
.sc-basics{margin:30px 0 8px; padding:24px 26px; border:1px solid var(--line-2); border-radius:16px; background:var(--bg-2)}
.sc-basics-h{font-family:var(--sc-serif); font-weight:600; font-size:21px; letter-spacing:-.01em; color:var(--text); margin:0 0 18px}
.sc-facts{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:18px 24px}
.sc-fact span{display:block; font-size:11.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--dim-2); margin:0 0 5px}
.sc-fact b{font-family:var(--sc-serif); font-weight:600; font-size:19px; color:var(--text)}
.sc-lbl{font-size:11.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--dim-2)}
.sc-defn{margin-top:22px; padding-top:20px; border-top:1px solid var(--line)}
.sc-defn p{font-family:var(--sc-sans); font-size:16.5px; line-height:1.6; color:var(--dim); margin:7px 0 0}
.sc-topquote{position:relative; margin:20px 0 0; padding-left:20px; border-left:3px solid var(--violet);
  font-family:var(--sc-serif); font-weight:500; font-size:20px; line-height:1.36; color:var(--text)}
.sc-topquote::before{content:"\201C"; color:var(--violet)}
.sc-topquote::after{content:"\201D"; color:var(--violet)}

/* Going Deeper Q&A */
.sc-section-h{font-family:var(--sc-serif); font-weight:600; font-size:26px; letter-spacing:-.01em; color:var(--text); margin:40px 0 4px}
.sc-qa{margin:6px 0 0}
.sc-item{padding:24px 0; border-top:1px solid var(--line)}
.sc-item:first-child{border-top:none}
.sc-q{font-family:var(--sc-serif); font-weight:600; font-size:26px; line-height:1.22; letter-spacing:-.01em; color:var(--text); margin:0 0 13px}
.sc-a p{font-family:var(--sc-sans); font-size:19px; line-height:1.7; color:var(--text); margin:0 0 15px}
.sc-a p:last-child{margin:0}
.sc-inline{margin:18px 0 4px}
.sc-inline img{width:100%; height:auto; display:block; border-radius:12px; border:1px solid var(--line-2); box-shadow:var(--sc-shadow)}
.sc-inline figcaption{font-family:var(--sc-sans); font-size:13.5px; color:var(--dim); margin-top:9px}

/* quiz callout */
.sc-quiz{margin:34px 0 0; padding:24px 26px; border-radius:16px; display:flex; align-items:center;
  justify-content:space-between; gap:22px; flex-wrap:wrap;
  background:linear-gradient(135deg,rgba(var(--violet-rgb),.16),rgba(var(--cyan-rgb),.06));
  border:1px solid rgba(var(--violet-rgb),.26)}
.sc-quiz-txt h3{font-family:var(--sc-serif); font-weight:600; font-size:21px; margin:0 0 4px; color:var(--text)}
.sc-quiz-txt p{font-family:var(--sc-sans); font-size:14.5px; color:var(--dim); margin:0; max-width:46ch}
.sc-main button.sc-quiz-btn{cursor:pointer; border:none; text-decoration:none; white-space:nowrap;
  background:linear-gradient(135deg,var(--violet),var(--cyan)); color:#0c0912;
  font-family:var(--sc-sans); font-weight:700; font-size:15px; letter-spacing:.01em;
  padding:14px 24px; border-radius:999px; box-shadow:0 10px 30px rgba(var(--violet-rgb),.28); transition:transform .15s}
.sc-main button.sc-quiz-btn:hover{transform:translateY(-1px)}

.sc-web{margin:26px 0 0; font-family:var(--sc-sans); font-size:15px; color:var(--dim-2)}
.sc-web a{color:var(--violet); text-decoration:none; font-weight:600}
.sc-web a:hover{text-decoration:underline}
.sc-note{margin:22px 0 0; padding:14px 16px; border:1px solid var(--line); border-left:3px solid var(--violet);
  border-radius:10px; background:rgba(var(--violet-rgb),.05); font-family:var(--sc-sans); font-size:13.5px;
  line-height:1.5; color:var(--dim-2)}
.sc-note a{color:var(--violet); text-decoration:none}

.sc-listen{margin:36px 0 0; font-family:var(--sc-sans)}
.sc-listen h3{font-family:var(--sc-serif); font-weight:600; font-size:22px; margin:0 0 16px}
.sc-cards{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.sc-lcard{display:block; text-decoration:none; padding:18px; border-radius:14px; border:1px solid var(--line-2);
  background:var(--bg-2); transition:transform .15s, border-color .15s}
.sc-lcard:hover{transform:translateY(-2px)}
.sc-lcard .sc-lk{font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--dim-2)}
.sc-lcard .sc-lt{font-family:var(--sc-serif); font-size:19px; font-weight:600; margin:8px 0 4px; color:var(--text)}
.sc-lcard .sc-lu{font-size:13.5px; color:var(--dim)}
.sc-lcard.nl:hover{border-color:var(--violet)}
.sc-lcard.sc:hover{border-color:var(--cyan)}
@media(max-width:600px){ .sc-cards{grid-template-columns:1fr} .sc-quiz{flex-direction:column; align-items:flex-start} }

/* ============================================================
   Long Reads / Editorial article pages (.lr-*)  — see _gen_longreads.py
   Ian Horne byline (the only stream with one). House gradient is the
   editorial signature; big Fraunces headline + drop cap lead the page.
   ============================================================ */
.lr-main{
  --lr-serif:'Fraunces',Georgia,'Times New Roman',serif;
  --lr-sans:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --lr-col:760px;
  --lr-shadow:0 24px 60px rgba(0,0,0,.45);
  max-width:1180px;
}
html[data-mode="earth"] .lr-main{ --lr-shadow:0 20px 50px rgba(58,44,96,.16); }
.lr-main a{color:var(--cyan); text-decoration:none; border-bottom:1px solid rgba(var(--cyan-rgb),.35)}
.lr-main a:hover{border-bottom-color:var(--cyan)}

.lr-article{max-width:var(--lr-col); margin:0 auto; padding:38px 0 6px}

/* masthead */
.lr-kicker{display:flex; align-items:center; gap:9px; flex-wrap:wrap;
  font-family:var(--lr-sans); font-size:12.5px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:var(--dim-2); margin:0 0 18px}
.lr-kicker .lr-dot{width:8px; height:8px; border-radius:50%;
  background:linear-gradient(135deg,var(--cyan),var(--violet) 55%,var(--magenta));
  box-shadow:0 0 0 4px rgba(var(--violet-rgb),.14)}
.lr-kicker b{color:var(--text); font-weight:700}
.lr-title{font-family:var(--lr-serif); font-weight:600; font-optical-sizing:auto;
  font-size:clamp(32px,5.2vw,54px); line-height:1.03; letter-spacing:-.018em;
  margin:0 0 18px; text-wrap:balance}
.lr-dek{font-family:var(--lr-sans); font-size:20px; line-height:1.5; color:var(--dim); margin:0; max-width:60ch}

/* byline (editorial only) */
.lr-byline{display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  margin:24px 0 0; padding:15px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  font-family:var(--lr-sans); font-size:14px; color:var(--dim-2)}
.lr-av{display:grid; place-items:center; width:36px; height:36px; border-radius:50%;
  background:linear-gradient(135deg,var(--cyan),var(--violet) 55%,var(--magenta));
  color:#0d0a14; font-weight:800; font-size:13px; letter-spacing:.02em}
.lr-by-name{color:var(--text); font-weight:700}
.lr-by-meta{margin-left:auto; color:var(--dim-2)}

/* hero */
.lr-hero{margin:26px 0 8px; text-align:center}
.lr-hero img{width:100%; height:auto; border-radius:16px; border:1px solid var(--line-2); box-shadow:var(--lr-shadow)}
.lr-hero figcaption{font-family:var(--lr-sans); font-size:13.5px; color:var(--dim); margin-top:10px}

/* body */
.lr-body{margin:22px 0 0}
.lr-p{font-family:var(--lr-sans); font-size:19px; line-height:1.75; color:var(--text); margin:0 0 22px}
.lr-p.lead::first-letter{font-family:var(--lr-serif); font-weight:600; float:left;
  font-size:3.4em; line-height:.82; padding:6px 12px 0 0;
  background:linear-gradient(135deg,var(--cyan),var(--violet) 55%,var(--magenta));
  -webkit-background-clip:text; background-clip:text; color:transparent}
.lr-sub{font-family:var(--lr-serif); font-weight:600; font-size:27px; line-height:1.18;
  letter-spacing:-.012em; color:var(--text); margin:40px 0 16px}
.lr-list{margin:0 0 22px; padding-left:22px}
.lr-list li{font-family:var(--lr-sans); font-size:19px; line-height:1.7; color:var(--text); margin:0 0 10px}
.lr-fig{margin:26px 0 22px; text-align:center}
.lr-fig img{width:100%; height:auto; display:block; border-radius:14px; border:1px solid var(--line-2); box-shadow:var(--lr-shadow)}
.lr-fig figcaption{font-family:var(--lr-sans); font-size:13.5px; color:var(--dim); margin-top:10px}
.lr-quote{position:relative; margin:30px 0; padding:2px 0 2px 22px; border-left:3px solid var(--violet);
  font-family:var(--lr-serif); font-weight:500; font-size:25px; line-height:1.34; color:var(--text)}

@media (max-width:820px){
  .lr-by-meta{margin-left:0; width:100%}
}