/* ============================================================
   Podcast pages — unified theme layer (light + dark)
   Loaded on /podcast/ and all /podcast/<guest>/ pages.

   Design goals:
   - Unify the standalone summary pages with the site's editorial
     "Anthropic sand" look (Playfair Display + Plus Jakarta Sans).
   - Add a real light/dark mode that follows the rest of the site.
   - Stay responsive on small screens.

   Safety model: every dark rule is scoped under html[data-theme="dark"],
   so light mode is never altered by anything in this file beyond the
   small, intentional unification overrides. The bulk of the per-component
   dark overrides are auto-generated and appended below this header.
   ============================================================ */

/* Editorial type, matching the site home page */
/* Fonts are bundled and self-hosted by PodcastHead.astro. */

:root {
  --pf-display: 'Playfair Display', "Source Han Serif SC", "Noto Serif CJK SC", "Songti SC", Georgia, serif;
  --pf-body: 'Plus Jakarta Sans', system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, sans-serif;
  --pf-mono: "JetBrains Mono", Consolas, monospace;
}

/* ---- Light token unification (nudge the page palette toward the home) ---- */
html[data-theme="light"] {
  --ink: #191613;
  --muted: #6e675d;
  --paper: #fbf9f6;
  --panel: #ffffff;
  --line: #e8e2d5;
  --clay: #b2573f;
  --moss: #326b55;
  --shadow: 0 1px 3px rgba(25,22,19,.05), 0 14px 38px rgba(82,75,65,.08);
}

/* ---- Dark theme tokens (mirrors the site's obsidian-sand dark palette) ---- */
html[data-theme="dark"] {
  --ink: #f3ece0;
  --muted: #a89e90;
  --paper: #12100e;
  --panel: #1b1713;
  --line: #322c25;
  --clay: #e0a184;
  --moss: #8fad88;
  --blue: #84b6d6;
  --gold: #e4c07d;
  --rose: #db93ad;
  --shadow: 0 1px 4px rgba(0,0,0,.35), 0 18px 46px rgba(0,0,0,.5);
}

/* ---- Typography unification (applies to both themes) ---- */
html body { font-family: var(--pf-body); }
html h1, html h2, html h3, html h4,
html .nav-brand,
html .detail-title-row h3,
html .takeaway aside b,
html .mind-core { font-family: var(--pf-display); }
html .site-podcast-nav .nav-brand { font-family: var(--pf-display); letter-spacing: .04em; font-weight: 700; }

/* ---- Page background per theme (refined warm mesh / obsidian mesh) ---- */
html[data-theme="light"] body {
  background:
    radial-gradient(circle at top left, rgba(178,87,63,.10), transparent 34rem),
    radial-gradient(circle at 80% 8%, rgba(50,107,85,.07), transparent 32rem),
    linear-gradient(135deg, #fbf9f6 0%, #f4efe5 52%, #eef3ee 100%);
  color: var(--ink);
}
html[data-theme="dark"] body {
  background:
    radial-gradient(circle at top left, rgba(224,161,132,.10), transparent 34rem),
    radial-gradient(circle at 80% 8%, rgba(143,173,136,.06), transparent 32rem),
    linear-gradient(160deg, #15120e 0%, #100e0b 55%, #0f1311 100%);
  color: var(--ink);
}

/* Film grain reads as subtle light specks on the dark canvas */
html[data-theme="dark"] .grain {
  opacity: .05;
  mix-blend-mode: screen;
  background-image:
    linear-gradient(90deg, #fff 1px, transparent 1px),
    linear-gradient(#fff 1px, transparent 1px);
}

/* Two components use var(--ink) as a *background* (dark chip / primary button).
   Since --ink flips to cream in dark mode, repaint them with the clay accent. */
html[data-theme="dark"] .idea-tag,
html[data-theme="dark"] .tool-btn.primary {
  background: var(--clay);
  border-color: var(--clay);
  color: #1a1410;
}

/* Generic safety: media + code never overflow on small screens */
html img, html svg, html video, html canvas { max-width: 100%; height: auto; }
html pre { overflow-x: auto; }
html body { transition: background-color .3s ease, color .3s ease; }

/* ============================================================
   Injected UI: theme toggle, reading progress, back-to-top, TOC
   ============================================================ */
.pod-progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 0; z-index: 60;
  background: linear-gradient(90deg, var(--clay), var(--gold));
  transition: width .12s linear; pointer-events: none;
}

.pod-theme-toggle {
  appearance: none; cursor: pointer; display: inline-flex; align-items: center; gap: .4rem;
  border: 1px solid var(--line); background: var(--panel); color: var(--ink);
  font: inherit; font-size: .82rem; font-weight: 600; line-height: 1;
  padding: .42rem .72rem; border-radius: 999px; transition: all .15s ease; white-space: nowrap;
}
.pod-theme-toggle:hover { border-color: var(--clay); color: var(--clay); }
.pod-theme-toggle .pod-ico { font-size: .95rem; }

.pod-totop {
  position: fixed; right: 1.1rem; bottom: 1.1rem; z-index: 60;
  width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--line); background: var(--panel); color: var(--clay);
  box-shadow: var(--shadow); border-radius: 50%; cursor: pointer; font-size: 1.15rem;
  opacity: 0; transform: translateY(10px); pointer-events: none; transition: all .2s ease;
}
.pod-totop.is-visible { opacity: 1; transform: none; pointer-events: auto; }
.pod-totop:hover { background: var(--clay); border-color: var(--clay); color: #fff; }

.pod-toc {
  position: fixed; right: 1.2rem; top: 50%; transform: translateY(-50%); z-index: 55;
  width: 224px; max-height: 72vh; overflow: auto;
  background: color-mix(in srgb, var(--panel) 92%, transparent);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border: 1px solid var(--line); border-radius: 12px; padding: .85rem .7rem;
  box-shadow: var(--shadow); font-family: var(--pf-body); font-size: .82rem;
}
.pod-toc h4 {
  margin: 0 0 .55rem; font-size: .68rem; letter-spacing: .14em; text-transform: uppercase;
  color: var(--clay); font-family: var(--pf-body); font-weight: 700;
}
.pod-toc a {
  display: block; padding: .3rem .5rem; margin-bottom: .1rem; border-radius: 6px;
  color: var(--muted); text-decoration: none; line-height: 1.35;
  border-left: 2px solid transparent; transition: all .15s ease;
}
.pod-toc a:hover { color: var(--ink); background: color-mix(in srgb, var(--clay) 12%, transparent); }
.pod-toc a.is-current { color: var(--clay); border-left-color: var(--clay); font-weight: 700; }

/* TOC would overlap content on narrower viewports — desktop only */
@media (max-width: 1280px) { .pod-toc { display: none; } }

/* ---- Extra responsive polish on top of each page's own media queries ---- */
@media (max-width: 980px) {
  .site-podcast-nav { padding: .7rem 1rem; }
  .site-podcast-nav .nav-links { gap: .55rem .9rem; }
  .pod-theme-toggle { padding: .35rem .6rem; font-size: .78rem; }
}
@media (max-width: 640px) {
  .site-podcast-nav { gap: .4rem .8rem; }
  .site-podcast-nav .nav-links { font-size: .82rem; }
  .pod-totop { right: .8rem; bottom: .8rem; width: 40px; height: 40px; }
}

/* ============================================================
   AUTO-GENERATED per-component dark overrides appended below.
   ============================================================ */

/* 85 auto-generated dark-mode component overrides (property-aware, dark-only) */
html[data-theme="dark"] .site-podcast-nav { background:rgba(38,32,26,.82); }
html[data-theme="dark"] .subtitle { color:#c6bba8; }
html[data-theme="dark"] .player-panel { background:rgba(38,32,26,.78); }
html[data-theme="dark"] .chapter-card,
html[data-theme="dark"] .idea-card,
html[data-theme="dark"] .term { background:rgba(38,32,26,.88); }
html[data-theme="dark"] .chapter-card p,
html[data-theme="dark"] .idea-card p,
html[data-theme="dark"] .term p { color:#c6bba8; }
html[data-theme="dark"] .timestamp { background:#2a2113; color:#e6b98c; }
html[data-theme="dark"] .timestamp:hover,
html[data-theme="dark"] .timestamp:focus-visible { background:#3a2c12; }
html[data-theme="dark"] .map-rail,
html[data-theme="dark"] .map-detail,
html[data-theme="dark"] .toolbox { background:rgba(38,32,26,.9); }
html[data-theme="dark"] .map-rail-head { background:#1f1a13; }
html[data-theme="dark"] .map-filter-tags span,
html[data-theme="dark"] .node-tags span,
html[data-theme="dark"] .level-pill { border:1px solid #333a45; background:#181f2a; color:#8fb6dc; }
html[data-theme="dark"] .map-node:hover,
html[data-theme="dark"] .map-node.is-active { background:#172230; }
html[data-theme="dark"] .map-node-time { color:#7db2ec; }
html[data-theme="dark"] .detail-summary { color:#a9b3c0; }
html[data-theme="dark"] .detail-stats span { background:#19212c; color:#a3b1c1; }
html[data-theme="dark"] .explain-card { background:#191f29; }
html[data-theme="dark"] .explain-card.warm { background:#241d10; border-color:#3a2d12; }
html[data-theme="dark"] .explain-card p,
html[data-theme="dark"] .detail-block p { color:#a9b3c0; }
html[data-theme="dark"] .detail-block { background:rgba(38,32,26,.55); }
html[data-theme="dark"] .timeline-clues li { border-bottom:1px solid #34302a; }
html[data-theme="dark"] .learning-questions { color:#a3b1c1; }
html[data-theme="dark"] .toolbox-tab { border:1px solid #333a45; background:#1d1915; color:#9fb2c6; }
html[data-theme="dark"] .tool-card { background:#1d1915; }
html[data-theme="dark"] .tool-card p { color:#a3b1c1; }
html[data-theme="dark"] .recall-card { background:rgba(38,32,26,.66); }
html[data-theme="dark"] .recall-card ol,
html[data-theme="dark"] .recall-card ul { color:#a9b3c0; }
html[data-theme="dark"] .mind-map { border:1px solid #3a3426; background:linear-gradient(135deg, #241d10, #181f2a); }
html[data-theme="dark"] .mind-branch { background:rgba(38,32,26,.75); color:#9fb2c6; }
html[data-theme="dark"] .best-list li { background:rgba(38,32,26,.58); }
html[data-theme="dark"] .caveats { background:#1f1a12; }
html[data-theme="dark"] .transcript-block { background:rgba(38,32,26,0.65); }
html[data-theme="dark"] .transcript-block summary:hover { background:#191f29; }
html[data-theme="dark"] .transcript-block p { color:#c6bba8; border-top:1px dashed #333a45; }
html[data-theme="dark"] .tool-btn { background:#1a212c; color:#c6bba8; border:1px solid #34302a; }
html[data-theme="dark"] .tool-btn:hover { background:#2e2a23; }
html[data-theme="dark"] .timestamp.play-btn { background:#1a212c; color:#aab4c1; }
html[data-theme="dark"] .timestamp.play-btn:hover { background:#1a212c; }
html[data-theme="dark"] h1 { color:#ece5d8; }
html[data-theme="dark"] .player-panel { background:rgba(38,32,26,0.85); }
html[data-theme="dark"] .chapter-card,
html[data-theme="dark"] .idea-card,
html[data-theme="dark"] .term { background:rgba(38,32,26,0.9); }
html[data-theme="dark"] .timestamp { background:#1a212c; color:#aab4c1; }
html[data-theme="dark"] .timestamp:hover,
html[data-theme="dark"] .timestamp:focus-visible { background:#1a212c; }
html[data-theme="dark"] .map-rail,
html[data-theme="dark"] .map-detail,
html[data-theme="dark"] .toolbox { background:rgba(38,32,26,0.9); }
html[data-theme="dark"] .map-rail-head { background:#191f29; }
html[data-theme="dark"] .map-filter-tags span,
html[data-theme="dark"] .node-tags span,
html[data-theme="dark"] .level-pill { border:1px solid #2e2a23; background:#1a212c; color:#c6bba8; }
html[data-theme="dark"] .map-node:hover,
html[data-theme="dark"] .map-node.is-active { background:#1a212c; }
html[data-theme="dark"] .detail-summary { color:#c6bba8; }
html[data-theme="dark"] .detail-stats span { background:#1a212c; color:#a9b3c0; }
html[data-theme="dark"] .explain-card.warm { background:#221d11; border-color:#3a2d10; }
html[data-theme="dark"] .detail-block { background:rgba(38,32,26,0.6); }
html[data-theme="dark"] .timeline-clues li { border-bottom:1px solid #333a45; }
html[data-theme="dark"] .learning-questions { color:#c6bba8; }
html[data-theme="dark"] .toolbox-tab { border:1px solid #34302a; background:#1d1915; color:#c6bba8; }
html[data-theme="dark"] .toolbox-tab:hover { background:#191f29; }
html[data-theme="dark"] .tool-card p { color:#a9b3c0; }
html[data-theme="dark"] .recall-card { background:rgba(38,32,26,0.7); }
html[data-theme="dark"] .recall-card ol,
html[data-theme="dark"] .recall-card ul { color:#c6bba8; }
html[data-theme="dark"] .mind-map { border:1px solid #2e2a23; background:linear-gradient(135deg, #221d11, #16242a); }
html[data-theme="dark"] .mind-branch { background:rgba(38,32,26,0.85); color:#aab4c1; }
html[data-theme="dark"] .best-list li { background:rgba(38,32,26,0.6); }
html[data-theme="dark"] .caveats { background:#2a2210; border:1px solid #3a2d10; color:#c6bba8; }
html[data-theme="dark"] .caveats h3 { color:#c6bba8; }
html[data-theme="dark"] .timestamp { background:#1d1915; color:#e3a988; }
html[data-theme="dark"] .timestamp:hover,
html[data-theme="dark"] .timestamp:focus-visible { background:#1d1915; }
html[data-theme="dark"] .mind-map { border:1px solid #2e2a23; background:linear-gradient(135deg, #221d11, #152019); }
html[data-theme="dark"] .mind-branch { background:rgba(38,32,26,0.85); color:#c6bba8; }
html[data-theme="dark"] .moment-card { background:#241c12; }
html[data-theme="dark"] .detail-point { background:rgba(38,32,26,.78); }
html[data-theme="dark"] .detail-point p { color:#a9b3c0; }
html[data-theme="dark"] .idea-card { background:rgba(38,32,26,0.9); }
html[data-theme="dark"] .final-summary li { border:1px solid #333a45; background:rgba(38,32,26,.06); }
html[data-theme="dark"] .final-summary .timestamp { background:#2a2210; border-color:#34302a; color:#ece5d8; }
html[data-theme="dark"] .explain-card,
html[data-theme="dark"] .detail-block { background:#191f29; }
html[data-theme="dark"] .level-list span { color:#a9b3c0; }
html[data-theme="dark"] .timestamp.play-btn:hover,
html[data-theme="dark"] .timestamp.play-btn:focus-visible { background:#1a212c; }
html[data-theme="dark"] .idea-card,
html[data-theme="dark"] .term { background:rgba(38,32,26,.88); }
html[data-theme="dark"] .idea-card p,
html[data-theme="dark"] .term p { color:#c6bba8; }
html[data-theme="dark"] .recall-card,
html[data-theme="dark"] .explain-card,
html[data-theme="dark"] .detail-block { background:rgba(38,32,26,.66); }
html[data-theme="dark"] .recall-card ol,
html[data-theme="dark"] .recall-card ul,
html[data-theme="dark"] .learning-questions { color:#a9b3c0; }
html[data-theme="dark"] .player-panel { background:rgba(38,32,26,.8); }
html[data-theme="dark"] .map-rail,
html[data-theme="dark"] .map-detail,
html[data-theme="dark"] .toolbox { background:rgba(38,32,26,.92); }
html[data-theme="dark"] .explain-card,
html[data-theme="dark"] .detail-block,
html[data-theme="dark"] .recall-card { background:#191f29; }
html[data-theme="dark"] .idea-card,
html[data-theme="dark"] .term { background:rgba(38,32,26,.9); }
html[data-theme="dark"] .transcript-block { background:rgba(38,32,26,.65); }
html[data-theme="dark"] .player-panel,
html[data-theme="dark"] .map-rail,
html[data-theme="dark"] .map-detail,
html[data-theme="dark"] .toolbox,
html[data-theme="dark"] .chapter-card,
html[data-theme="dark"] .idea-card,
html[data-theme="dark"] .term { background:rgba(38,32,26,.88); }
html[data-theme="dark"] .mind-map { border:1px solid #3a3426; background:linear-gradient(135deg,#241d10,#181f2a); }

/* A compact, shared navigation leaves space for the actual interview. */
.site-podcast-nav.garden-nav { position:sticky; top:0; z-index:70; display:flex; align-items:center; justify-content:space-between; flex-wrap:nowrap; gap:1rem; min-height:64px; padding:.6rem max(1rem,calc((100vw - 1400px)/2)); border-bottom:1px solid var(--line); background:color-mix(in srgb,var(--paper) 94%,transparent); backdrop-filter:blur(12px); }
.garden-nav .nav-brand { color:var(--ink); text-decoration:none; white-space:nowrap; font-size:1rem; letter-spacing:0; }
.garden-nav .nav-brand span { font:400 .65rem/1 var(--pf-mono); color:var(--muted); letter-spacing:.08em; }
.garden-nav-actions { display:flex; align-items:center; gap:.8rem; }
.garden-nav-index { color:var(--muted); text-decoration:none; font-size:.85rem; white-space:nowrap; }
.episode-menu { position:relative; margin:0; padding:0; background:transparent; border:0; border-radius:0; }
.episode-menu > summary { display:flex; align-items:center; justify-content:space-between; gap:.6rem; min-height:44px; padding:.5rem .8rem; border:1px solid var(--line); border-radius:8px; list-style:none; cursor:pointer; font-size:.85rem; color:var(--ink); }
.episode-menu > summary::-webkit-details-marker { display:none; }
.episode-menu-list { position:absolute; right:0; top:calc(100% + .65rem); width:min(340px,calc(100vw - 2rem)); max-height:65vh; overflow-y:auto; overscroll-behavior:contain; background:var(--panel); border:1px solid var(--line); box-shadow:var(--shadow); padding:.5rem; border-radius:10px; }
.episode-menu-list a { display:flex; gap:.8rem; align-items:baseline; min-height:44px; padding:.65rem; color:var(--ink); font-size:.85rem; text-decoration:none; border-radius:5px; }
.episode-menu-list strong { flex:0 0 3.5rem; }
.episode-menu-list a span { color:var(--muted); font-size:.75rem; }
.episode-menu-list a:hover, .episode-menu-list a[aria-current=page] { background:color-mix(in srgb,var(--clay) 12%,transparent); color:var(--clay); }
.garden-nav .pod-theme-toggle { min-height:44px; }
.pod-skip-link { position:fixed; top:-100px; left:1rem; z-index:100; background:var(--panel); color:var(--ink); padding:.8rem; border:2px solid var(--clay); }
.pod-skip-link:focus { top:1rem; }
html :is(a,button,summary,input,select):focus-visible { outline:2px solid var(--clay); outline-offset:3px; }
#pod-main, #pod-main > section { scroll-margin-top:5.5rem; }
.hero h1 { text-wrap:balance; overflow-wrap:anywhere; }
.hero-inner > *, .learning-map > *, .meta-grid > *, .podcast-card > * { min-width:0; }
.metric b { overflow-wrap:anywhere; }

/* The floating TOC needs a real gutter; at laptop widths use an inline TOC. */
.pod-mobile-toc { display:none; margin:0 0 2rem; border:1px solid var(--line); border-radius:10px; background:var(--panel); }
.pod-mobile-toc > summary { cursor:pointer; padding:1rem; font-size:.9rem; color:var(--ink); }
.pod-mobile-toc-links { display:grid; gap:.15rem; padding:0 .75rem .75rem; }
.pod-mobile-toc-links h4 { display:none; }
.pod-mobile-toc-links a { display:block; padding:.7rem; color:var(--muted); text-decoration:none; font-size:.85rem; border-radius:5px; }
.pod-mobile-toc-links a:hover { background:color-mix(in srgb,var(--clay) 10%,transparent); color:var(--clay); }
@media(max-width:1880px) { .pod-toc { display:none; } .pod-mobile-toc { display:block; } }
@media(max-width:980px) {
  #learning-map .map-rail { position:static; max-height:none; }
  #learning-map #chapter-list { max-height:20rem; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; border-top:1px solid var(--line); }
}
@media(max-width:640px) {
  .site-podcast-nav.garden-nav { flex-wrap:wrap; gap:.2rem .6rem; padding:.65rem 1rem; }
  .garden-nav .nav-brand { flex:1 0 100%; font-size:.9rem; }
  .garden-nav .nav-brand span { font-size:.6rem; }
  .garden-nav-actions { width:100%; gap:.6rem; }
  .garden-nav-index { margin-right:auto; }
  #pod-main, #pod-main > section { scroll-margin-top:8rem !important; }
  html .podcast-dashboard { padding:1.5rem 1rem 3rem; }
  html .podcast-card { padding:1.4rem; min-height:0; }
  html .podcast-card-footer { flex-wrap:wrap; gap:1rem; }
  html .podcast-card-footer .podcast-btn { width:100%; min-height:44px; }
  html .podcast-card-meta { flex-wrap:wrap; gap:.4rem; }
  html .podcast-tagbar { flex-wrap:nowrap; overflow-x:auto; padding-bottom:.4rem; }
  html .podcast-tag-chip { flex-shrink:0; min-height:40px; }
  html .dashboard-header h1 { font-size:2rem; line-height:1.35; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto !important; }
  *, *::before, *::after { animation:none !important; transition:none !important; }
}

/* Mobile adaptation: navigation, reading panels and native chapter controls. */
:root { --pod-nav-height:64px; }
.pod-chapter-picker { display:none; }
@media(min-width:981px) and (max-width:1399px) {
  #learning-map .learning-map { grid-template-columns:240px minmax(0,1fr); }
  #learning-map .toolbox { grid-column:1 / -1; position:static; max-height:none; }
  #learning-map .map-rail { top:calc(var(--pod-nav-height) + .75rem); max-height:calc(100dvh - var(--pod-nav-height) - 1.5rem); }
  .detail-title-row, .mind-map-body { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:980px) {
  #learning-map.has-mobile-chapters .map-rail { display:none; }
  #learning-map .learning-map { grid-template-columns:minmax(0,1fr); min-height:0; }
  #learning-map .toolbox { position:static; max-height:none; }
  .pod-chapter-picker { position:sticky; top:var(--pod-nav-height); z-index:40; display:grid; grid-template-columns:44px minmax(0,1fr) 44px; gap:.4rem .5rem; padding:.65rem; margin-bottom:.75rem; border:1px solid var(--line); border-radius:8px; background:var(--panel); box-shadow:0 4px 16px #0001; }
  .pod-chapter-picker label { grid-column:1 / -1; font-size:.75rem; line-height:1.5; color:var(--muted); }
  .pod-chapter-picker select { width:100%; min-width:0; height:44px; padding:.4rem; font:400 16px/1.4 var(--pf-body); color:var(--ink); background:var(--paper); border:1px solid var(--line); border-radius:5px; text-overflow:ellipsis; }
  .pod-chapter-picker button { min-width:44px; height:44px; font:400 1.1rem/1 var(--pf-body); color:var(--clay); background:var(--paper); border:1px solid var(--line); border-radius:5px; cursor:pointer; }
  .pod-chapter-picker button:disabled { opacity:.35; cursor:default; }
  #learning-map .map-detail { scroll-margin-top:calc(var(--pod-nav-height) + 110px); }
  #pod-main, #pod-main > section { scroll-margin-top:calc(var(--pod-nav-height) + 16px) !important; }
}
@media(max-width:640px) {
  html { -webkit-text-size-adjust:100%; }
  .garden-nav-actions { position:relative; }
  .garden-nav .episode-menu { position:static; }
  .garden-nav .episode-menu-list { left:0; right:0; width:auto; max-height:calc(100dvh - var(--pod-nav-height) - 2rem); }
  .garden-nav .episode-menu-list a { min-height:48px; }
  .garden-nav .episode-menu-list a span { overflow-wrap:anywhere; }
  html .hero { padding:1.75rem 1rem 2rem; }
  html .hero-inner { gap:1.25rem; }
  html .hero h1 { font-size:clamp(1.65rem,7.5vw,2.35rem); line-height:1.4; margin:.7rem 0; }
  html .subtitle { font-size:1rem; line-height:1.85; }
  html .eyebrow { gap:.35rem; }
  html .eyebrow span { max-width:100%; overflow-wrap:anywhere; font-size:.7rem; }
  html .player-panel { padding:1rem; }
  html audio { min-width:0; max-width:100%; }
  html .meta-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; }
  html .metric b { font-size:.85rem; }
  html #pod-main { padding:1.5rem 1rem 3rem; }
  html #pod-main > section { margin-bottom:2.25rem; }
  html #pod-main .section-head { display:flex; flex-direction:column; align-items:flex-start; gap:.5rem; }
  html #pod-main .section-head h2 { font-size:1.45rem; line-height:1.45; }
  html .section-note { font-size:.88rem; line-height:1.7; margin:0; }
  html :is(.map-detail,.toolbox,.idea-card,.term,.takeaway .lead,.takeaway aside) { padding:1rem; }
  html .detail-title-row h3 { font-size:1.4rem; line-height:1.45; }
  html .detail-title-row, html .timeline-clues li, html .best-list li { grid-template-columns:minmax(0,1fr); }
  html .detail-summary { font-size:1rem; line-height:1.85; }
  html :is(.timestamp,.timestamp.tiny,.tool-btn,.toolbox-tab,.pod-theme-toggle,.podcast-tag-chip) { min-height:44px; }
  html .timestamp { display:inline-flex; align-items:center; justify-content:center; white-space:normal; }
  html :is(.filter,.podcast-search input,.podcast-sort select) { min-width:0; font-size:16px; min-height:44px; }
  html .transcript-tools .filter { flex-basis:100%; width:100%; }
  html .transcript-tools .tool-btn { flex:1 1 100px; }
  html .transcript-block summary { flex-wrap:wrap; gap:.65rem; padding:.9rem; }
  html .transcript-block-title { flex:1 1 100%; min-width:0; line-height:1.7; }
  html .transcript-block .seg-body { padding:.8rem .9rem 1rem; }
  html :is(.detail-stats span,.level-pill,.map-filter-tags span,.node-tags span) { white-space:normal; overflow-wrap:anywhere; }
  html :is(.mind-core,.mind-branch,.recall-card,.explain-card,.detail-block,.seg-quote,.term,.idea-card) { min-width:0; overflow-wrap:anywhere; }
  html .pod-totop { width:44px; height:44px; right:max(.75rem,env(safe-area-inset-right)); bottom:max(.75rem,env(safe-area-inset-bottom)); }
  html .podcast-toolbar { gap:.75rem; padding:1rem; }
  html .podcast-header-top { flex-wrap:wrap; gap:.75rem; }
}
@media(hover:none) { html .podcast-card:hover, html .timestamp:hover { transform:none; } }