/* Sourced.media: the one stylesheet (generated from styles.css; do not edit by hand). */
/* tokens/fonts.css (the woff2 subsets of fonts.md; rewritten on install by theme.py) */
@font-face{font-family:"Quiche Sans";src:url("/assets/fonts/quiche-sans-200.latin.woff2") format("woff2");font-weight:200;font-style:normal;font-display:swap;unicode-range:U+0020-007E,U+00A0-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2013,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2032-2033,U+2039-203A,U+20AC,U+2122,U+2190-2193,U+21B5,U+2212}
@font-face{font-family:"Quiche Sans";src:url("/assets/fonts/quiche-sans-300.latin.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap;unicode-range:U+0020-007E,U+00A0-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2013,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2032-2033,U+2039-203A,U+20AC,U+2122,U+2190-2193,U+21B5,U+2212}
@font-face{font-family:"Quiche Sans";src:url("/assets/fonts/quiche-sans-400.latin.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0020-007E,U+00A0-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2013,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2032-2033,U+2039-203A,U+20AC,U+2122,U+2190-2193,U+21B5,U+2212}
@font-face{font-family:"Poppins";src:url("/assets/fonts/poppins-400.latin.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0020-007E,U+00A0-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2013,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2032-2033,U+2039-203A,U+20AC,U+2122,U+2190-2193,U+21B5,U+2212}
@font-face{font-family:"Poppins";src:url("/assets/fonts/poppins-500.latin.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0020-007E,U+00A0-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2013,U+2018-201A,U+201C-201E,U+2022,U+2026,U+2032-2033,U+2039-203A,U+20AC,U+2122,U+2190-2193,U+21B5,U+2212}
@font-face{font-family:"Poppins Fallback";src:local("Roboto");size-adjust:111.3%;ascent-override:94.3%;descent-override:31.4%;line-gap-override:9%}
@font-face{font-family:"Poppins Fallback";src:local("Arial");size-adjust:111.5%;ascent-override:94%;descent-override:31.4%;line-gap-override:9%}
@font-face{font-family:"Quiche Sans Fallback";src:local("Georgia");size-adjust:101%;ascent-override:93.6%;descent-override:27.7%;line-gap-override:0%}
/* The five faces a page may load: Quiche Sans 200, 300 and 400; Poppins 400 and 500.
   Design-time sources are the OTF/TTF masters; production ships woff2 latin subsets per fonts.md.
   Quiche Sans Medium stays in assets/fonts for the logo generator only; no page loads it. */

/* tokens/tokens.css */
/* Sourced.media: tokens.css, design v1 round two, settled 28 Sep 2026 by Claude Design.
   Roles exactly as named in the brief's manifest; values settled; additions marked "added".
   Black and white lead. Everything else is derived from the AK guidelines. Fluid values read
   --vw and --svh (1vw and 1svh in production) so a frame of any width renders its own tier. */
:root{
--vw:1vw; /* @kind other */
--svh:1svh; /* @kind other */
/* the two colours */
--sm-black:#111111;
--sm-white:#FFFFFF;
--sm-true-black:#000000; /* added: the stage alone */
/* derived from AK: used, never led with */
--ak-ink:#252836;
--ak-slate-600:#565A6A;
--ak-slate-500:#6B6F7D; /* darker than the draft #757987 so 12px captions pass AA on white and the panel */
--ak-slate-300:#C2C5CE;
--ak-slate-200:#DCDEE4;
--ak-slate-100:#ECEDF1;
--ak-slate-50:#F6F7F9;
--ak-indigo:#0D019E; /* THE accent: links, focus, the active tab. Nothing else. */
--ak-indigo-hover:#0A017A;
--ak-indigo-lift:#8F86FF; /* added: AK indigo lifted for dark grounds, 6.4:1 on the dark page */
--ak-indigo-lift-hover:#ABA4FF;
--ak-blush:#EFD3CE;--ak-peach:#F8D8C0;--ak-mist:#EDF4F6; /* the manage notices, and from round 14b the three audience marks; never a page ground */
--ak-peach-deep:#45301F;--ak-mist-deep:#22323A;--ak-blush-deep:#45302C; /* added, round 14b: the marks' dark-mode values, each 11:1 or better under --dk-text */
/* added: dark surfaces, layered and never flat black */
--dk-page:#0E0E10;
--dk-card:#131316;
--dk-panel:#17181C;
--dk-hover:#1E2023;
--dk-rule:#2A2C31;
--dk-text:#F4F4F4;
--dk-body:#E6E6EA;
--dk-2:#B5B8C2;
--dk-muted:#9094A1; /* 6.4:1 on the dark page, 5.9:1 on the dark panel */
/* type: five files. Quiche Sans by size: Regular below 24px, Light from 24px, Thin only at display sizes */
--font-display:"Quiche Sans","Quiche Sans Fallback",Georgia,serif;
--font-body:"Poppins","Poppins Fallback","Helvetica Neue",-apple-system,system-ui,sans-serif;
--font-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
--fw-thin:200; /* @kind font */
--fw-light:300; /* @kind font */
--fw-regular:400; /* @kind font */
--fw-medium:500; /* @kind font */
--fw-semibold:500; /* @kind font */
--fw-display:200; /* @kind font */
--fw-large:300; /* @kind font */
--fw-text:400; /* @kind font */
--lh-tight:1.02; /* @kind font */
--lh-snug:1.15; /* @kind font */
--lh-normal:1.5; /* @kind font */
--lh-relaxed:1.65; /* @kind font */
--track-tight:-0.02em; /* @kind font */
--track-normal:0; /* @kind font */
--track-wide:0.1em; /* @kind font */
--track-caps:0.16em; /* @kind font */
/* measure and shell (operator rulings, 20 Sep 2026) */
--measure:44rem; /* @kind spacing */
--shell:72rem; /* @kind spacing */
--container:1180px; /* @kind spacing */
/* spacing, 4px base (AK) */
--s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:20px;--s-6:24px;--s-7:32px;--s-8:40px;--s-9:56px;--s-10:72px;--s-11:96px;--s-12:128px;
/* radii: square by default; 4px only on tiles; pills only for the two toggles */
--r-0:0; /* @kind radius */
--r-xs:2px;--r-sm:4px;--r-md:8px;--r-pill:999px;--r-circle:50%;
/* shadows: floating layers only (palette, hover card, menus), never static UI */
--shadow-1:0 1px 2px rgb(17 17 17 / .06),0 1px 1px rgb(17 17 17 / .04);
/* motion (AK easings) */
--ease-standard:cubic-bezier(.4,0,.2,1); /* @kind other */
--ease-out-soft:cubic-bezier(.16,1,.3,1); /* @kind other */
--dur-fast:140ms; /* @kind other */
--dur-base:220ms; /* @kind other */
--dur-slow:420ms; /* @kind other */
/* media tiers (operator ruling 24 Sep 2026): the tier chooses the rendition and the frame together */
--tier-square:40rem; /* @kind spacing */
--tier-landscape:64rem; /* @kind spacing */
--square-max:28rem; /* @kind spacing */
/* added: text and controls over pictures. Burned overlays hold a scrim of at least --scrim-start
   behind the text, raised until white text measures 4.5:1 (never above --scrim-cap) */
--scrim-start:.4; /* @kind other */
--scrim-cap:.72; /* @kind other */
--overlay-chip:rgb(0 0 0 / .66); /* text chips on pictures: 6:1 or better on any picture */
--overlay-control:rgb(0 0 0 / .56); /* icon controls on pictures: 4.3:1 or better */
/* hosted brands: one slot, one mark, one ink */
--host-mark:none; /* @kind other */
--host-name:""; /* @kind other */
color-scheme:light dark;
}
/* fluid values: declared again on .sm-page so a frame that sets --vw renders its own tier */
:root,.sm-page{
--fs-xs:clamp(.75rem,calc(.73rem + .1 * var(--vw)),.8125rem); /* @kind font */
--fs-sm:clamp(.8125rem,calc(.79rem + .12 * var(--vw)),.875rem); /* @kind font */
--fs-base:clamp(1rem,calc(.97rem + .18 * var(--vw)),1.0625rem); /* @kind font */
--fs-md:clamp(1.125rem,calc(1.07rem + .3 * var(--vw)),1.3125rem); /* @kind font */
--fs-lg:clamp(1.375rem,calc(1.26rem + .55 * var(--vw)),1.75rem); /* @kind font */
--fs-xl:clamp(1.625rem,calc(1.4rem + 1.1 * var(--vw)),2.5rem); /* @kind font */
--fs-2xl:clamp(2.25rem,calc(1.7rem + 2.6 * var(--vw)),4rem); /* @kind font */
--fs-3xl:clamp(2.75rem,calc(1.9rem + 4.4 * var(--vw)),5.75rem); /* @kind font */
--fw-lg:400; /* @kind font */ /* Quiche at --fs-lg: Regular while it is under 24px; stack.css sets Light from 43.75rem */
--pad:clamp(1.25rem,calc(4 * var(--vw)),3.5rem); /* @kind spacing */
--portrait-max:min(calc(80 * var(--svh)),40rem); /* @kind spacing */
--hairline:1px solid var(--rule); /* @kind other */
}
/* roles, light */
:root{
--ink:var(--sm-black);--ink-body:var(--ak-ink);--ink-2:var(--ak-slate-600);--muted:var(--ak-slate-500);
--rule:var(--ak-slate-200);--rule-strong:var(--sm-black);
--ground:var(--sm-white);--panel:var(--ak-slate-50);--card:var(--sm-white);--hover:var(--ak-slate-100);
--stage:var(--sm-true-black);--media:var(--ak-slate-100);
--inverse-ink:var(--sm-white);--inverse-ground:var(--sm-black);
--accent:var(--ak-indigo);--accent-hover:var(--ak-indigo-hover);--focus:var(--ak-indigo);
--ok:#2F6B4C;--warn:#8A5A12;--danger:#8E3A2E;
--shadow-2:0 4px 12px rgb(17 17 17 / .08),0 16px 40px rgb(17 17 17 / .10);
--sm-mark-filter:none; /* @kind other */
/* added, round 14b: the audience marks (operator, Q26 to Q29): a thin rule, a kicker ground or a chip in the front door's audience panels, the About rows and the host line only; never a page ground. Text on a mark is --ink: 14.0:1 (shows), 17.0:1 (readers), 13.4:1 (guests and organisations) */
--mark-shows:var(--ak-peach);--mark-readers:var(--ak-mist);--mark-guests:var(--ak-blush);
}
/* roles, dark: layered surfaces; the stage alone is true black */
@media (prefers-color-scheme:dark){:root{
--ink:var(--dk-text);--ink-body:var(--dk-body);--ink-2:var(--dk-2);--muted:var(--dk-muted);
--rule:var(--dk-rule);--rule-strong:var(--dk-text);
--ground:var(--dk-page);--panel:var(--dk-panel);--card:var(--dk-card);--hover:var(--dk-hover);
--stage:var(--sm-true-black);--media:var(--dk-panel);
--inverse-ink:var(--dk-page);--inverse-ground:var(--dk-text);
--accent:var(--ak-indigo-lift);--accent-hover:var(--ak-indigo-lift-hover);--focus:var(--ak-indigo-lift);
--ok:#6FBF94;--warn:#E0B060;--danger:#F08A7A;
--shadow-2:0 4px 12px rgb(0 0 0 / .4),0 16px 40px rgb(0 0 0 / .5);
--sm-mark-filter:invert(1); /* @kind other */
--mark-shows:var(--ak-peach-deep);--mark-readers:var(--ak-mist-deep);--mark-guests:var(--ak-blush-deep); /* under --dk-text: 11.3, 12.0 and 11.2:1 */
}}
/* an explicit choice from the toggle wins over the system setting */
[data-theme="light"]{
--ink:var(--sm-black);--ink-body:var(--ak-ink);--ink-2:var(--ak-slate-600);--muted:var(--ak-slate-500);
--rule:var(--ak-slate-200);--rule-strong:var(--sm-black);
--ground:var(--sm-white);--panel:var(--ak-slate-50);--card:var(--sm-white);--hover:var(--ak-slate-100);
--stage:var(--sm-true-black);--media:var(--ak-slate-100);
--inverse-ink:var(--sm-white);--inverse-ground:var(--sm-black);
--accent:var(--ak-indigo);--accent-hover:var(--ak-indigo-hover);--focus:var(--ak-indigo);
--ok:#2F6B4C;--warn:#8A5A12;--danger:#8E3A2E;
--shadow-2:0 4px 12px rgb(17 17 17 / .08),0 16px 40px rgb(17 17 17 / .10);
--sm-mark-filter:none; /* @kind other */
--mark-shows:var(--ak-peach);--mark-readers:var(--ak-mist);--mark-guests:var(--ak-blush);
color-scheme:light;
}
[data-theme="dark"]{
--ink:var(--dk-text);--ink-body:var(--dk-body);--ink-2:var(--dk-2);--muted:var(--dk-muted);
--rule:var(--dk-rule);--rule-strong:var(--dk-text);
--ground:var(--dk-page);--panel:var(--dk-panel);--card:var(--dk-card);--hover:var(--dk-hover);
--stage:var(--sm-true-black);--media:var(--dk-panel);
--inverse-ink:var(--dk-page);--inverse-ground:var(--dk-text);
--accent:var(--ak-indigo-lift);--accent-hover:var(--ak-indigo-lift-hover);--focus:var(--ak-indigo-lift);
--ok:#6FBF94;--warn:#E0B060;--danger:#F08A7A;
--shadow-2:0 4px 12px rgb(0 0 0 / .4),0 16px 40px rgb(0 0 0 / .5);
--sm-mark-filter:invert(1); /* @kind other */
--mark-shows:var(--ak-peach-deep);--mark-readers:var(--ak-mist-deep);--mark-guests:var(--ak-blush-deep);
color-scheme:dark;
}

/* css/base.css */
/* base: element defaults, the page container, type and control primitives */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:72px}
body{margin:0;background:var(--ground);color:var(--ink-body);font:var(--fw-regular) var(--fs-base)/var(--lh-relaxed) var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.sm-page{container:page/inline-size;position:relative;background:var(--ground);color:var(--ink-body);font:var(--fw-regular) var(--fs-base)/var(--lh-relaxed) var(--font-body)}
body>.sm-page--shell{min-height:100svh}
h1,h2,h3,h4,p,figure,blockquote,ol,ul,dl,dd{margin:0}
ol,ul{padding:0;list-style:none}
h1,h2,h3,h4{color:var(--ink);font-family:var(--font-display);font-weight:var(--fw-text);line-height:var(--lh-snug);text-wrap:balance}
p{text-wrap:pretty}
img,svg,video,iframe{display:block;max-width:100%}
img,video{height:auto}
button,input,select,textarea{font:inherit;color:inherit}
button,summary{cursor:pointer}
strong,b{font-weight:var(--fw-medium)}
hr{border:0;border-top:var(--hairline);margin:0}
::selection{background:var(--ink);color:var(--ground)}
a{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em;text-decoration-color:color-mix(in srgb,currentColor 38%,transparent);transition:color var(--dur-fast) var(--ease-standard),text-decoration-color var(--dur-fast) var(--ease-standard)}
a:hover{color:var(--accent-hover);text-decoration-color:currentColor}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* round twelve, part two: focus moved to the main landmark by script (after a consent choice) draws no ring */
#main:focus{outline:none}
.sm-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* the skip link: hidden until focused, in every frame */
.sm-skip{position:absolute;left:var(--s-4);top:var(--s-3);z-index:100;padding:var(--s-3) var(--s-4);background:var(--ink);color:var(--ground);font:var(--fw-medium) var(--fs-sm)/1 var(--font-body);text-decoration:none}
.sm-skip:not(:focus){width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* kicker: tracked caps after the short black bar (beyondai.media's bar, in ink); it is also the breadcrumb */
.sm-kicker{display:flex;align-items:center;gap:var(--s-3);font:var(--fw-medium) var(--fs-xs)/1.35 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink)}
.sm-kicker::before{content:"";flex:none;width:26px;height:2px;background:var(--rule-strong)}
.sm-kicker ol{display:flex;flex-wrap:wrap;align-items:center}
.sm-kicker li+li::before{content:"\00B7";padding:0 .7em;color:var(--muted)}
.sm-kicker a{color:inherit;text-decoration:none;display:inline-block;padding-block:4px;margin-block:-4px}
.sm-kicker a:hover{color:var(--accent)}
.sm-caps{font:var(--fw-medium) var(--fs-xs)/1.3 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-meta{font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--muted)}
.sm-meta a{color:var(--ink-2)}
.sm-num{font-family:var(--font-display);font-weight:var(--fw-text);font-variant-numeric:lining-nums tabular-nums}
/* icons: Lucide geometry at 1.5px, currentColor; 20px in text, 16px in controls */
.sm-i{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sm-i--sm{width:16px;height:16px}
.sm-i--xs{width:14px;height:14px}
.sm-i--fill{fill:currentColor;stroke:none}
/* kind and shape tags: a Lucide glyph with its label, and the shape. Never an emoji. */
.sm-tag{display:inline-flex;align-items:center;gap:5px;min-width:0;font:var(--fw-medium) 11px/1.2 var(--font-body);letter-spacing:.02em;color:var(--ink-2);white-space:nowrap}
.sm-tag .sm-i{width:14px;height:14px}
.sm-shape{display:inline-grid;place-items:center;flex:none;min-width:30px;height:18px;padding:0 5px;border:var(--hairline);font:var(--fw-medium) 10px/1 var(--font-body);letter-spacing:.02em;color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap}
/* buttons: the base; round 15 (css/r15.css) draws the one button as the outlined pill with its filled tier, so these rules are the fallback alone */
.sm-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);min-height:44px;padding:0 var(--s-5);border:1px solid var(--ink);background:var(--ink);color:var(--ground);font:var(--fw-medium) var(--fs-sm)/1 var(--font-body);text-decoration:none;border-radius:var(--r-0);transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard)}
.sm-btn:hover{background:var(--accent);border-color:var(--accent);color:var(--ground)}
.sm-btn--line{background:transparent;color:var(--ink)}
.sm-btn--line:hover{background:var(--ink);border-color:var(--ink);color:var(--ground)}
.sm-btn--quiet{background:transparent;border-color:transparent;color:var(--ink);padding:0 var(--s-3)}
.sm-btn--quiet:hover{background:var(--hover);border-color:transparent;color:var(--ink)}
.sm-kbd{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border:var(--hairline);border-bottom-width:2px;font:var(--fw-medium) 11px/1 var(--font-body);color:var(--muted);letter-spacing:.02em}
/* segmented pill: the shape toggle and the theme toggle, the only pills in the system */
.sm-seg{display:inline-flex;gap:2px;padding:3px;border:var(--hairline);border-radius:var(--r-pill);background:var(--ground)}
.sm-seg button{position:relative;display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 var(--s-4);border:0;border-radius:var(--r-pill);background:transparent;color:var(--ink-2);font:var(--fw-medium) var(--fs-xs)/1 var(--font-body);letter-spacing:.02em;transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard)}
.sm-seg button:hover{color:var(--ink)}
.sm-seg button[aria-pressed="true"]{background:var(--ink);color:var(--ground)}
.sm-seg button[data-tier]::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent)}
.sm-seg-label{font:var(--fw-medium) var(--fs-xs)/1 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
/* round twelve, part two (finding 101): the theme and Shape segments reach 44px on a phone */
@container page (max-width:39.99rem){.sm-seg button{min-height:44px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* css/chrome.css */
/* chrome: masthead, index menu, breadcrumb, palette, entity chip and hover card, footer, banner, share sheet */
.sm-masthead{position:sticky;top:0;z-index:40;height:78px;background:color-mix(in srgb,var(--ground) 88%,transparent);-webkit-backdrop-filter:saturate(1.2) blur(12px);backdrop-filter:saturate(1.2) blur(12px);border-bottom:var(--hairline)}
.sm-masthead[data-compact="true"]{height:56px}
/* round twelve, part two (finding 70): the shrink is one relayout at the threshold, not a transition of height */
.sm-masthead__in{height:100%;max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding-inline:var(--pad);display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--s-6)}
.sm-brand{display:flex;align-items:center;color:var(--ink);text-decoration:none}
.sm-brand__word{height:26px;width:auto;fill:currentColor}
.sm-masthead[data-compact="true"] .sm-brand__word{height:22px}
.sm-brand__mark{display:none;width:32px;height:32px}
.sm-search{position:relative;justify-self:center;display:flex;align-items:center;gap:var(--s-3);width:100%;max-width:30rem;height:40px;padding:0 var(--s-2) 0 var(--s-4);border:var(--hairline);background:var(--ground);color:var(--muted);font:var(--fw-regular) var(--fs-sm)/1 var(--font-body);text-align:left;transition:border-color var(--dur-fast) var(--ease-standard)}
.sm-search:hover{border-color:var(--ink);color:var(--ink-2)}
.sm-search__ph{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sm-search__short{display:none;flex:1}
.sm-masthead__end{display:flex;align-items:center;gap:var(--s-4)}
.sm-hostmark{display:flex;align-items:center;gap:var(--s-4);text-decoration:none}
.sm-hostmark::before{content:"";width:1px;height:28px;background:var(--rule)}
.sm-hostmark img{width:36px;height:36px;filter:var(--sm-mark-filter)}
.sm-menu-btn{display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 var(--s-2);border:0;background:transparent;color:var(--ink);font:var(--fw-medium) var(--fs-xs)/1 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase}
.sm-menu-btn:hover{color:var(--accent)}
.sm-menu-btn .sm-i{transition:transform var(--dur-fast) var(--ease-standard)}
.sm-menu-btn[aria-expanded="true"] .sm-i{transform:rotate(180deg)}
@container page (max-width:39.99rem){
.sm-masthead{height:56px}
.sm-masthead__in{gap:var(--s-3)}
.sm-brand__word{display:none}.sm-brand__mark{display:block}
.sm-search{height:38px;padding-inline:var(--s-3)}
.sm-search::after{content:"";position:absolute;left:0;right:0;top:50%;height:44px;translate:0 -50%}
.sm-search__ph,.sm-search .sm-kbd{display:none}.sm-search__short{display:block}
.sm-hostmark{gap:var(--s-3)}.sm-hostmark::before{height:22px}.sm-hostmark img{width:28px;height:28px}
.sm-masthead__end{gap:var(--s-2)}
}
/* index menu: the six site indexes; the only navigation menu, on every tier (no hamburger) */
.sm-index{position:absolute;right:var(--pad);top:calc(100% + 8px);z-index:45;width:17rem;background:var(--card);border:var(--hairline);box-shadow:var(--shadow-2);padding:var(--s-2) 0}
.sm-index[hidden]{display:none}
.sm-index a{display:flex;justify-content:space-between;align-items:baseline;padding:10px var(--s-5);color:var(--ink);text-decoration:none;font:var(--fw-regular) var(--fs-sm)/1.3 var(--font-body)}
.sm-index a:hover{background:var(--hover);color:var(--accent)}
.sm-index a .sm-num{color:var(--muted);font-size:var(--fs-sm)}
.sm-index hr{margin:var(--s-2) 0}
.sm-index .sm-seg{margin:var(--s-2) var(--s-5) var(--s-3)}
/* breadcrumb from the graph, for trails deeper than the kicker carries */
.sm-crumbs ol{display:flex;align-items:center;overflow-x:auto;scrollbar-width:none;white-space:nowrap;font:var(--fw-regular) var(--fs-xs)/1.4 var(--font-body);color:var(--muted)}
.sm-crumbs ol::-webkit-scrollbar{display:none}
.sm-crumbs li{display:flex;align-items:center}
.sm-crumbs li+li::before{content:"\203A";padding:0 var(--s-2);color:var(--ak-slate-300)}
.sm-crumbs a{color:var(--ink-2);text-decoration:none;display:inline-block;padding-block:4px;margin-block:-4px}
.sm-crumbs a:hover{color:var(--accent);text-decoration:underline}
.sm-crumbs [aria-current]{color:var(--ink)}
/* command palette: a dialog over search.json, grouped by kind, keyboard first */
.sm-palette{position:fixed;inset:0;z-index:60;display:grid;justify-items:center;align-items:start;padding:12vh var(--pad) var(--pad)}
.sm-palette[hidden]{display:none}
.sm-palette__scrim{position:absolute;inset:0;background:rgb(0 0 0 / .36);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.sm-palette__panel{position:relative;width:100%;max-width:40rem;max-height:70vh;display:flex;flex-direction:column;background:var(--card);border:var(--hairline);box-shadow:var(--shadow-2)}
.sm-palette__field{display:flex;align-items:center;gap:var(--s-3);height:60px;padding:0 var(--s-5);border-bottom:var(--hairline);color:var(--muted)}
.sm-palette__field input{flex:1;min-width:0;height:100%;border:0;background:transparent;outline:0;color:var(--ink);font:var(--fw-regular) var(--fs-md)/1 var(--font-body)}
.sm-palette__field input::placeholder{color:var(--muted)}
/* round twelve, part two (findings 17, 25, 16): the field shows its focus; the selected row carries a 3px accent bar beside its
   ground; the groups are role=group with their label, the count a hidden live line */
.sm-palette__field:focus-within{outline:2px solid var(--focus);outline-offset:-2px}
.sm-palette__group{display:block}
.sm-palette__results{overflow:auto;padding:var(--s-2) 0}
.sm-palette__label{padding:var(--s-4) var(--s-5) var(--s-2);font:var(--fw-medium) 11px/1 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-palette__item{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:var(--s-4);padding:var(--s-2) var(--s-5);min-height:56px;color:var(--ink);text-decoration:none}
.sm-palette__item img{width:40px;height:40px;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);background:var(--media)}
.sm-palette__item img.is-round{border-radius:50%}
/* round ten (the renderer's hook): a row with no picture shows the entry's initials in the picture's place */
.sm-palette__item>.sm-mono{width:40px;height:40px;font-size:13px}
.sm-palette__item>.sm-mono.is-round{border-radius:50%}
.sm-palette__item .t{display:block;font:var(--fw-regular) var(--fs-sm)/1.3 var(--font-body);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sm-palette__item .m{display:block;font:var(--fw-regular) 12px/1.35 var(--font-body);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sm-palette__item .sm-kbd{visibility:hidden}
.sm-palette__item[aria-selected="true"]{background:var(--hover);box-shadow:inset 3px 0 0 var(--accent)}
.sm-palette__item[aria-selected="true"] .t{color:var(--accent)}
.sm-palette__item[aria-selected="true"] .sm-kbd{visibility:visible}
.sm-palette__foot{display:flex;flex-wrap:wrap;gap:var(--s-5);padding:var(--s-3) var(--s-5);border-top:var(--hairline);font:var(--fw-regular) 12px/1 var(--font-body);color:var(--muted)}
.sm-palette__foot span{display:inline-flex;align-items:center;gap:6px}
/* entity chip: every name in our copy is an anchor; hover or focus shows the card: headshot, title
   line, organisation, the count of episodes, and the way to the person's page */
.sm-chip{position:relative}
.sm-hovercard{position:absolute;left:0;top:calc(100% + 8px);z-index:50;width:19rem;display:grid;grid-template-columns:52px minmax(0,1fr);gap:var(--s-3) var(--s-4);padding:var(--s-4);background:var(--card);border:var(--hairline);box-shadow:var(--shadow-2);font:var(--fw-regular) 13px/1.45 var(--font-body);color:var(--ink-2);white-space:normal;text-align:left;text-transform:none;letter-spacing:0}
.sm-hovercard img{width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-hovercard .n{display:block;font:var(--fw-text) 20px/1.15 var(--font-display);color:var(--ink)}
.sm-hovercard .r{display:block;margin-top:3px;color:var(--ink-2)}
.sm-hovercard .o{display:block;color:var(--muted)}
.sm-hovercard .c{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;padding-top:var(--s-3);border-top:var(--hairline);font:var(--fw-medium) 11px/1 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-hovercard .c b{font-weight:var(--fw-medium);color:var(--accent)}
/* footer: quiet, hairline above */
.sm-footer{border-top:var(--hairline);margin-top:var(--s-11)}
.sm-footer__in{max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding:var(--s-9) var(--pad) var(--s-8);display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-7)}
.sm-signature{display:inline-flex;align-items:center;gap:14px;color:var(--ink);text-decoration:none}
.sm-signature svg{fill:currentColor}
.sm-signature .d{width:36px;height:36px}
.sm-signature .w{height:22px;width:auto}
.sm-footer__nav ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3) var(--s-6)}
.sm-footer__nav a,.sm-footer__end a{color:var(--ink);text-decoration:none;font:var(--fw-regular) var(--fs-sm)/1.3 var(--font-body);display:inline-block;padding-block:4px;margin-block:-4px}
.sm-footer__nav a:hover,.sm-footer__end a:hover{color:var(--accent);text-decoration:underline}
.sm-footer__end{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-5)}
.sm-footer__note{font:var(--fw-regular) 12px/1.5 var(--font-body);color:var(--muted)}
@container page (min-width:40rem){.sm-footer__nav ul{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container page (min-width:64rem){.sm-footer__in{grid-template-columns:1.2fr 1.6fr 1fr;align-items:start}.sm-footer__note{grid-column:1/-1;padding-top:var(--s-6);border-top:var(--hairline)}}
/* banner: unreleased and preview pages, noindex; the copy is data */
.sm-banner{position:relative;z-index:41;display:flex;justify-content:center;align-items:center;gap:var(--s-3);min-height:40px;padding:var(--s-2) var(--pad);background:var(--inverse-ground);color:var(--inverse-ink);font:var(--fw-regular) var(--fs-xs)/1.4 var(--font-body);text-align:center}
.sm-banner strong{font-weight:var(--fw-medium);letter-spacing:var(--track-caps);text-transform:uppercase}
.sm-banner::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:currentColor}
.sm-banner a{color:inherit}
/* share and cite sheet */
.sm-sheet{max-width:34rem;background:var(--card);border:var(--hairline);box-shadow:var(--shadow-2)}
.sm-sheet__head{display:flex;justify-content:space-between;align-items:center;padding:var(--s-4) var(--s-5);border-bottom:var(--hairline)}
.sm-sheet__head h2{font:var(--fw-text) 20px/1.2 var(--font-display)}
.sm-sheet dl{display:grid}
.sm-sheet dl>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-1) var(--s-4);align-items:center;padding:var(--s-4) var(--s-5);border-bottom:var(--hairline)}
.sm-sheet dt{grid-column:1/-1;font:var(--fw-medium) 11px/1 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-sheet dd{font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink);overflow-wrap:anywhere}

/* round 14b, item 11: the host line in every footer, plain (no mark), under the signature; from 64rem the signature
   and the line share the first column */
.sm-footer__host{max-width:22rem;margin:0;font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink-2);text-wrap:pretty}
.sm-footer__host a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:3px}
.sm-footer__host a:hover{color:var(--accent);text-decoration-color:currentColor}
@container page (min-width:64rem){.sm-footer__in{grid-template-rows:auto 1fr auto}.sm-footer__in>.sm-signature{grid-column:1;grid-row:1}.sm-footer__host{grid-column:1;grid-row:2;align-self:start}.sm-footer__in>.sm-footer__nav{grid-column:2;grid-row:1/3}.sm-footer__in>.sm-footer__end{grid-column:3;grid-row:1/3}.sm-footer__in>.sm-footer__note{grid-row:3}}

/* css/media.css */
/* media: one asset, three renditions. The tier (the width of the page container) chooses the
   rendition and the frame together: the 9:16 full width under 40rem, the 1:1 at up to 28rem from
   40rem, the 16:9 in the 72rem shell from 64rem. A rendition fills its box: nothing is letterboxed
   and nothing sits black on black. --face-x and --face-y come from CODE's face detection. */
.sm-media{position:relative;z-index:1}
.sm-fig{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-3)}
.sm-fig__frame{position:relative;overflow:hidden;background:var(--media);width:100%;aspect-ratio:9/16;max-width:calc(var(--portrait-max) * 9 / 16);margin-inline:auto}
.sm-fig__frame>picture,.sm-fig__frame>img,.sm-fig__frame>video{position:absolute;inset:0;width:100%;height:100%}
.sm-fig__frame img,.sm-fig__frame video{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-fig__cap{font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink-2);max-width:var(--measure)}
.sm-src{display:block;margin-top:2px;font-size:var(--fs-xs);color:var(--muted)}
.sm-src a{color:var(--ink-2)}
@container page (min-width:40rem){
.sm-fig{grid-template-columns:minmax(0,var(--square-max)) minmax(0,1fr);gap:var(--s-6);align-items:end}
.sm-fig__frame{aspect-ratio:1/1;max-width:var(--square-max);margin-inline:0}
.sm-fig__cap{padding-top:var(--s-3);border-top:var(--hairline)}
}
@container page (min-width:64rem){
.sm-fig{grid-template-columns:minmax(0,1fr);gap:var(--s-4)}
.sm-fig__frame{aspect-ratio:16/9;max-width:var(--shell)}
.sm-fig__cap{border-top:0;padding-top:0;width:100%;max-width:var(--measure);margin-inline:auto}
}
/* the diptych: two clean panels, a 4px gutter in the page ground, eyes on one line, each face
   looking into the frame; side by side in 16:9 and 1:1, stacked in 9:16. Never blended, never mirrored. */
.sm-dip{position:absolute;inset:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px;background:var(--ground)}
.sm-dip>picture,.sm-dip>img{display:block;min-width:0;min-height:0;width:100%;height:100%}
.sm-dip img{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
@container page (max-width:39.99rem){.sm-dip--tier{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,1fr)}}
/* the player: poster first, preload none. The captions toggle drives a text track for the embed;
   the burned captions stay on the file. A transcript folds beneath. */
.sm-player__play{position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:2;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;border:1px solid rgb(255 255 255 / .6);background:var(--overlay-control);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),scale var(--dur-slow) var(--ease-out-soft)}
.sm-player__play .sm-i{width:22px;height:22px;margin-left:3px}
.sm-player:hover .sm-player__play,.sm-player__play:focus-visible{background:#fff;color:var(--sm-true-black);scale:1.06}
.sm-player__bar{position:absolute;left:var(--s-3);right:var(--s-3);bottom:var(--s-3);z-index:2;display:flex;align-items:center;justify-content:space-between;gap:var(--s-2)}
.sm-badge{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:0;background:var(--overlay-chip);color:#fff;font:var(--fw-medium) 11px/1 var(--font-body);letter-spacing:.03em;font-variant-numeric:tabular-nums;white-space:nowrap}
.sm-badge .sm-i{width:14px;height:14px}
button.sm-badge:hover{background:rgb(0 0 0 / .82)}
button.sm-badge[aria-pressed="true"]{background:#fff;color:var(--sm-true-black)}
.sm-transcript{margin-top:var(--s-2)}
.sm-transcript summary{display:inline-flex;align-items:center;gap:8px;min-height:44px;list-style:none;font:var(--fw-medium) var(--fs-sm)/1 var(--font-body);color:var(--ink)}
.sm-transcript summary::-webkit-details-marker{display:none}
.sm-transcript summary:hover{color:var(--accent)}
.sm-transcript summary .sm-i{width:16px;height:16px}
.sm-transcript p{padding:var(--s-4) var(--s-5);background:var(--panel);font:var(--fw-regular) var(--fs-sm)/1.7 var(--font-body);color:var(--ink-2)}
/* facade: YouTube stays behind a poster until pressed; the label sits on a held scrim */
.sm-facade{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--media)}
.sm-facade>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-facade::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgb(0 0 0 / 0) 36%,rgb(0 0 0 / .62) 72%,rgb(0 0 0 / .7))}
.sm-facade__play{position:absolute;inset:0;z-index:1;display:flex;align-items:flex-end;gap:var(--s-4);padding:var(--s-6);border:0;background:transparent;color:#fff;text-align:left}
.sm-facade__play .c{display:grid;place-items:center;width:56px;height:56px;flex:none;border-radius:50%;background:#fff;color:var(--sm-true-black);transition:scale var(--dur-slow) var(--ease-out-soft)}
.sm-facade__play .c .sm-i{margin-left:3px}
.sm-facade__play:hover .c{scale:1.06}
.sm-facade__play .l{font:var(--fw-large) var(--fs-lg)/1.15 var(--font-display)}
.sm-facade__play .l small{display:block;margin-top:4px;font:var(--fw-regular) 12px/1.3 var(--font-body)}
@container page (max-width:39.99rem){.sm-facade__play{padding:var(--s-4);gap:var(--s-3)}.sm-facade__play .c{width:44px;height:44px}.sm-facade__play .l{font:var(--fw-text) var(--fs-md)/1.2 var(--font-display)}.sm-facade__play .l small{display:none}}
/* listen: the Apple player as a lazy iframe behind a quiet control */
.sm-listen{display:flex;flex-direction:column;justify-content:flex-end;gap:var(--s-3);padding:var(--s-5);border:var(--hairline);background:var(--card)}
.sm-listen__t{font:var(--fw-lg) var(--fs-lg)/1.2 var(--font-display);color:var(--ink)}
.sm-listen__play{display:inline-flex;align-items:center;gap:var(--s-3);align-self:flex-start;min-height:44px;padding:0;border:0;background:transparent;color:var(--ink);font:var(--fw-medium) var(--fs-sm)/1 var(--font-body)}
.sm-listen__play .c{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--ground);transition:background var(--dur-fast) var(--ease-standard)}
.sm-listen__play:hover .c{background:var(--accent)}
.sm-listen__play .sm-i{margin-left:2px}
.sm-listen__note{font:var(--fw-regular) 12px/1.45 var(--font-body);color:var(--muted)}
.sm-listen__wave{display:flex;align-items:center;gap:3px;height:28px}
.sm-listen__wave i{flex:1;max-width:3px;background:var(--rule);height:var(--h,40%)}
/* synopsis and listen: paired on a desk, stacked with listen first on a tablet, synopsis first on a phone */
.sm-synopsis{display:grid;gap:var(--s-5)}
@container page (min-width:40rem) and (max-width:63.99rem){.sm-synopsis .sm-listen{order:-1}}
@container page (min-width:64rem){.sm-synopsis{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:var(--s-6);align-items:stretch}.sm-synopsis .sm-fig__frame{max-width:none}}
/* strips and grids: tiles of one shape share one box (1:1 in rows and the viewer grid, 9:16 in
   the shorts rail, 16:9 in the feed). Each tile carries its kind and shape beneath the picture. */
.sm-strip{display:grid;grid-auto-flow:column;grid-auto-columns:8.25rem;gap:var(--s-3);align-items:start;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 2px 4px}
.sm-strip::-webkit-scrollbar{display:none}
.sm-strip--rail{grid-auto-columns:7.75rem} /* round twelve, part two (finding 34): room for the Short video tag and the shape on one line */
@container page (min-width:40rem){.sm-strip{grid-auto-columns:9.5rem}.sm-strip--rail{grid-auto-columns:7.75rem}}
@container page (min-width:64rem){.sm-strip{grid-auto-columns:10.5rem}.sm-strip--rail{grid-auto-columns:8.5rem}}
.sm-tile{display:grid;align-content:start;gap:var(--s-2);min-width:0;color:inherit;text-decoration:none;scroll-snap-align:start}
.sm-tile__box{position:relative;display:block;aspect-ratio:1/1;border-radius:var(--r-sm);overflow:hidden;background:var(--media);transition:opacity var(--dur-base) var(--ease-standard)}
.sm-strip--rail .sm-tile__box,.sm-grid[data-shape="portrait"] .sm-tile__box{aspect-ratio:9/16}
.sm-grid[data-shape="landscape"] .sm-tile__box{aspect-ratio:16/9}
.sm-tile__box>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);transition:scale var(--dur-slow) var(--ease-out-soft)}
.sm-tile:hover .sm-tile__box>img,.sm-tile:hover .sm-dip img{scale:1.03}
.sm-tile .sm-badge{position:absolute;left:6px;bottom:6px;z-index:1;height:22px;padding:0 7px;font-size:10.5px}
.sm-tile .sm-badge .sm-i{width:10px;height:10px}
.sm-tile__label{font:var(--fw-regular) 12.5px/1.35 var(--font-body);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sm-tile__meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-width:0}
.sm-tile__meta .sm-tag{overflow:visible}
.sm-tile:hover .sm-tile__label{color:var(--accent)}
.sm-tile[aria-current="true"] .sm-tile__box{outline:2px solid var(--ink);outline-offset:2px}
.sm-strip:has([aria-current="true"]) .sm-tile:not([aria-current="true"]) .sm-tile__box{opacity:.6}
.sm-strip:has([aria-current="true"]) .sm-tile:hover .sm-tile__box{opacity:1}
.sm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:var(--s-4) var(--s-3)}
.sm-grid[data-shape="landscape"]{grid-template-columns:repeat(auto-fill,minmax(14rem,1fr))}
.sm-grid[data-shape="portrait"]{grid-template-columns:repeat(auto-fill,minmax(7.5rem,1fr))}
/* the in-flow stage: opens in place above its strip, never a modal. The tier's rendition fills the
   frame; opening an item sets its hash (#photo-3), and a shared link opens the stage on that item. */
.sm-stage{display:grid;gap:var(--s-3);margin-bottom:var(--s-5)}
.sm-stage__frame{position:relative;overflow:hidden;background:var(--stage);width:100%;aspect-ratio:9/16;max-width:calc(var(--portrait-max) * 9 / 16);margin-inline:auto}
.sm-stage__frame>img,.sm-stage__frame>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
@container page (min-width:40rem){.sm-stage__frame{aspect-ratio:1/1;max-width:var(--square-max);margin-inline:0}}
@container page (min-width:64rem){.sm-stage__frame{aspect-ratio:16/9;max-width:none}}
.sm-stage__nav{position:absolute;top:50%;translate:0 -50%;z-index:2;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid rgb(255 255 255 / .3);background:var(--overlay-control);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard)}
.sm-stage__nav:hover{background:#fff;color:var(--sm-true-black)}
.sm-stage__prev{left:var(--s-3)}.sm-stage__next{right:var(--s-3)}
.sm-stage__bar{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-3) var(--s-6);align-items:center}
.sm-stage__cap{font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-2)}
.sm-stage__tools{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2) var(--s-3);font:var(--fw-regular) var(--fs-sm)/1 var(--font-body);color:var(--muted)}
.sm-stage__count{margin-right:var(--s-2);font-variant-numeric:tabular-nums}
.sm-stage__count b{font:var(--fw-text) var(--fs-md)/1 var(--font-display);color:var(--ink)}
.sm-stage__tool{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 var(--s-3);border:var(--hairline);background:transparent;color:var(--ink);text-decoration:none;font:var(--fw-medium) 12px/1 var(--font-body)}
.sm-stage__tool:hover{border-color:var(--ink);color:var(--ink)}
.sm-stage__tool .sm-i{width:14px;height:14px}
@container page (min-width:40rem){.sm-stage__bar{grid-template-columns:minmax(0,1fr) auto}}

/* css/article.css */
/* article: the 44rem measure; at the landscape tier media break out to the 72rem shell and the
   contents box sits in the margin */
.sm-article{position:relative;display:block;max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding-inline:var(--pad)}
.sm-article>*{grid-column:measure;min-width:0}
@container page (min-width:40rem){.sm-article{display:grid;grid-template-columns:[shell-start] minmax(0,1fr) [measure-start] minmax(0,var(--measure)) [measure-end] minmax(0,1fr) [shell-end]}}
@container page (min-width:64rem){.sm-article{grid-template-columns:[shell-start] minmax(12rem,1fr) [measure-start] minmax(0,var(--measure)) [measure-end] minmax(0,1fr) [shell-end]}.sm-article>.sm-media{grid-column:shell}}
/* the head: one statement each. Kicker (the breadcrumb), title, the episode's own title, the byline */
.sm-head{padding-top:var(--s-8)}
.sm-head h1{margin-top:var(--s-5);font:var(--fw-display) var(--fs-2xl)/var(--lh-tight) var(--font-display);letter-spacing:var(--track-tight);max-width:18ch}
.sm-dek{margin-top:var(--s-4);font:var(--fw-lg) var(--fs-lg)/1.25 var(--font-display);color:var(--ink-2);text-wrap:balance}
.sm-byline{margin-top:var(--s-4);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--muted)}
.sm-byline a{color:var(--ink-2)}
/* the trio: an episode is three pages, and the pages are the modes */
.sm-trio{margin-top:var(--s-7);display:flex;gap:var(--s-6);border-bottom:var(--hairline)}
.sm-trio a{position:relative;display:inline-flex;align-items:center;min-height:44px;color:var(--ink-2);text-decoration:none;font:var(--fw-medium) var(--fs-sm)/1 var(--font-body)}
.sm-trio a:hover{color:var(--ink)}
.sm-trio a[aria-current="page"]{color:var(--accent)}
.sm-trio a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:currentColor}
/* participants: guest left, host right, matched headshots, the show between them. Beyond one and
   one, a cluster with a count opens the drawer; nothing else moves. */
.sm-pair{margin-top:var(--s-7);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:var(--s-5)}
.sm-party{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--s-4);min-width:0}
.sm-party--host{grid-template-columns:minmax(0,1fr) auto;text-align:right}
.sm-party--host>.sm-party__face{order:2}
.sm-party__face{display:flex}
.sm-party__face img{width:64px;height:64px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);background:var(--media)}
.sm-party__face img+img{margin-left:-22px;outline:3px solid var(--ground)}
.sm-party--host .sm-party__face{flex-direction:row-reverse}
.sm-party--host .sm-party__face img+img{margin-left:0;margin-right:-22px}
.sm-party--host .sm-hovercard{left:auto;right:0}
.sm-party__n{display:block;padding-block:1px;margin-block:-1px;font:var(--fw-text) 19px/1.2 var(--font-display);color:var(--ink);text-decoration:none}
a.sm-party__n:hover{color:var(--accent)}
.sm-party__r{display:block;margin-top:3px;font:var(--fw-regular) 12.5px/1.45 var(--font-body);color:var(--ink-2)}
.sm-party__o{display:block;font:var(--fw-regular) 12.5px/1.45 var(--font-body);color:var(--muted)}
.sm-party__more{display:inline-flex;align-items:center;gap:4px;margin-top:8px;min-height:30px;padding:0 10px;border:var(--hairline);background:transparent;color:var(--ink);font:var(--fw-medium) 12px/1 var(--font-body)}
.sm-party__more:hover,.sm-party__more[aria-expanded="true"]{border-color:var(--ink)}
.sm-party__more .sm-i{width:14px;height:14px;transition:transform var(--dur-fast) var(--ease-standard)}
.sm-party__more[aria-expanded="true"] .sm-i{transform:rotate(180deg)}
.sm-pair__show{display:grid;justify-items:center;gap:8px;max-width:12rem;color:var(--ink);text-decoration:none;text-align:center;font:var(--fw-medium) 11px/1.35 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase}
.sm-pair__show::before,.sm-pair__show::after{content:"";width:1px;height:20px;background:var(--rule)}
a.sm-pair__show:hover{color:var(--accent)}
@container page (max-width:39.99rem){
.sm-pair{grid-template-columns:minmax(0,1fr);gap:var(--s-4)}
.sm-pair__show{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;justify-items:stretch;max-width:none;gap:var(--s-3)}
.sm-pair__show::before,.sm-pair__show::after{width:auto;height:1px}
.sm-party__face img{width:56px;height:56px}
}
.sm-drawer{margin-top:var(--s-5);padding:var(--s-1) var(--s-5) var(--s-4);border:var(--hairline);background:var(--card)}
.sm-drawer[hidden]{display:none}
.sm-drawer h3{margin:var(--s-4) 0 var(--s-2);font:var(--fw-medium) 11px/1 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-drawer ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));gap:0 var(--s-6)}
.sm-drawer li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:var(--s-3);align-items:center;padding:var(--s-2) 0;border-top:var(--hairline)}
.sm-drawer img{width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-drawer a{color:var(--ink);text-decoration:none;font:var(--fw-regular) var(--fs-sm)/1.3 var(--font-body)}
.sm-drawer a:hover{color:var(--accent)}
.sm-drawer small{display:block;font-size:12px;color:var(--muted)}
.sm-lede{margin-top:var(--s-7);font:var(--fw-regular) var(--fs-md)/1.6 var(--font-body);color:var(--ink-body)}
.sm-source{margin-top:var(--s-6);display:grid;gap:var(--s-2);padding-top:var(--s-4);border-top:var(--hairline);font:var(--fw-regular) var(--fs-sm)/1.45 var(--font-body)}
.sm-source>div{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:var(--s-3)}
.sm-source dt{padding-top:2px;font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-source dd{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-5);color:var(--ink-2)}
.sm-source dd a{display:inline-flex;align-items:center;gap:6px}
.sm-source dd a .sm-i{width:14px;height:14px}
.sm-lead{margin-top:var(--s-9)}
/* contents: the margin rail on a desk, two columns in flow on a tablet, a closed disclosure on a
   phone (nothing floats at rest); while reading on a phone, the dock takes over */
.sm-contents{margin-top:var(--s-9)}
.sm-contents__box>summary{display:flex;align-items:baseline;gap:var(--s-3);list-style:none;margin-bottom:var(--s-3);font:var(--fw-medium) var(--fs-xs)/1 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted);pointer-events:none}
.sm-contents__box>summary::-webkit-details-marker{display:none}
.sm-contents__box>summary .sm-i,.sm-contents__box>summary b{display:none}
.sm-contents ol{display:grid;grid-template-columns:minmax(0,1fr)}
.sm-contents li a{display:grid;grid-template-columns:2rem minmax(0,1fr);gap:var(--s-2);padding:9px 0;border-top:var(--hairline);color:var(--ink);text-decoration:none;font:var(--fw-regular) var(--fs-sm)/1.4 var(--font-body)}
.sm-contents li a::before{content:attr(data-n);font:var(--fw-text) var(--fs-sm)/1.4 var(--font-display);color:var(--muted)}
.sm-contents li a:hover,.sm-contents li a[aria-current="true"],.sm-contents li a[aria-current="true"]::before{color:var(--accent)}
@container page (min-width:40rem) and (max-width:63.99rem){.sm-contents ol{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s-7)}}
@container page (max-width:39.99rem){
.sm-contents{margin-top:var(--s-8);border-block:var(--hairline)}
.sm-contents__box>summary{justify-content:space-between;align-items:center;min-height:52px;margin:0;color:var(--ink);pointer-events:auto}
.sm-contents__box>summary b{display:inline;font:var(--fw-regular) 12.5px/1 var(--font-body);letter-spacing:0;text-transform:none;color:var(--muted)}
.sm-contents__box>summary .sm-i{display:block;width:16px;height:16px;transition:transform var(--dur-fast) var(--ease-standard)}
.sm-contents__box[open]>summary .sm-i{transform:rotate(180deg)}
.sm-contents__box[open] ol{padding-bottom:var(--s-3)}
}
@container page (min-width:64rem){
/* round twelve: the rail from the first screen, top left, level with the head's trail, sticky from the start */
.sm-contents{position:absolute;grid-column:shell-start/measure-start;grid-row:1/auto;inset:0 var(--s-8) 0 0;margin:0;z-index:0}
.sm-contents__in{position:sticky;top:calc(56px + var(--s-7));display:flex;flex-direction:column;max-height:calc(100vh - 120px);padding-top:var(--s-8)}
/* round thirteen, item 2: the contents box is the rail's scroll box, so Back to top stays pinned at the sticky rail's foot however many chapters there are */
.sm-contents__in>.sm-contents__box{flex:1 1 auto;min-height:0;overflow:auto;scrollbar-width:none;overscroll-behavior:contain}
.sm-contents__in>.sm-contents__box::-webkit-scrollbar{display:none}
.sm-contents li a{padding:7px 0;font-size:13px;line-height:1.35;grid-template-columns:1.75rem minmax(0,1fr)}
}
/* the phone dock: docked to the bottom edge above the safe area once the contents has scrolled
   away; it collapses to the number while the reader scrolls */
.sm-dock{display:none}
@container page (max-width:39.99rem){
.sm-dock{position:sticky;bottom:0;z-index:30;display:flex;justify-content:flex-end;margin:var(--s-9) calc(-1 * var(--pad)) 0;padding-bottom:env(safe-area-inset-bottom);pointer-events:none}
.sm-dock__btn,.sm-dock__top{pointer-events:auto}
.sm-dock:not([data-away]){visibility:hidden}
.sm-dock__btn{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;gap:var(--s-3);flex:1;min-width:0;height:52px;padding:0 var(--pad);border:0;border-top:var(--hairline);background:color-mix(in srgb,var(--ground) 94%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--ink);text-align:left;text-decoration:none;font:var(--fw-medium) var(--fs-xs)/1 var(--font-body);transition:width var(--dur-base) var(--ease-standard),margin var(--dur-base) var(--ease-standard)}
.sm-dock__btn .sm-i{width:16px;height:16px}
.sm-dock__n{font:var(--fw-text) 16px/1 var(--font-display);font-variant-numeric:tabular-nums}
.sm-dock__n small{font:var(--fw-regular) 12px/1 var(--font-body);color:var(--muted)}
.sm-dock__t{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:var(--fw-regular);color:var(--ink-2)}
.sm-dock[data-scrolling] .sm-dock__btn{grid-template-columns:1fr;justify-items:center;width:48px;height:48px;padding:0;margin:0 var(--s-3) var(--s-3) 0;border:var(--hairline)}
.sm-dock[data-scrolling] .sm-dock__btn>:not(.sm-dock__n),.sm-dock[data-scrolling] .sm-dock__n small{display:none}
/* round twelve: Back to top beside the dock's button, a square the dock's height; while scrolling it stands aside with the rest */
.sm-dock__top{display:grid;place-items:center;flex:none;width:52px;height:52px;border-top:var(--hairline);border-left:var(--hairline);background:color-mix(in srgb,var(--ground) 94%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--ink)}
.sm-dock__top .sm-i{width:16px;height:16px}
.sm-dock__top:hover{color:var(--accent)}
.sm-dock[data-scrolling] .sm-dock__top{display:none}
}
/* Back to top at the foot of the rail (round twelve): a quiet line under the chapters, the same size as a chapter line */
.sm-contents__top{display:inline-flex;align-items:center;gap:var(--s-2);min-height:44px;margin-top:var(--s-3);color:var(--ink-2);text-decoration:none;font:var(--fw-regular) var(--fs-sm)/1.4 var(--font-body)}
.sm-contents__top .sm-i{width:14px;height:14px}
.sm-contents__top:hover{color:var(--accent)}
@container page (max-width:39.99rem){.sm-contents__top{display:none}}
@container page (min-width:64rem){.sm-contents__top{display:flex;flex:none;margin-top:0;padding-top:var(--s-2);border-top:var(--hairline);font-size:13px}}
/* chapters: the heading is the one link to its insight; the speaker line carries the name */
.sm-chapter{margin-top:var(--s-10);padding-top:var(--s-5);border-top:var(--hairline);scroll-margin-top:80px}
.sm-chapter::before{content:attr(data-n);display:block;margin-bottom:var(--s-4);font:var(--fw-lg) var(--fs-lg)/1 var(--font-display);color:var(--muted)}
.sm-chapter h2{font:var(--fw-lg) var(--fs-lg)/1.2 var(--font-display);letter-spacing:-.005em}
.sm-chapter h2 a{color:var(--ink);text-decoration:none}
.sm-chapter h2 a:hover{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px}
.sm-speaker{margin-top:var(--s-4);display:flex;align-items:center;gap:var(--s-3);font:var(--fw-regular) var(--fs-sm)/1.3 var(--font-body)}
.sm-speaker a{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font-weight:var(--fw-medium)}
.sm-speaker a:hover{color:var(--accent)}
.sm-speaker img{width:28px;height:28px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-chapter>p:not([class]),.sm-prose>p{margin-top:var(--s-5);font:var(--fw-regular) var(--fs-base)/var(--lh-relaxed) var(--font-body);color:var(--ink-body)}
/* pull quote: the only text on the page that is not ours; a clean first word, never an ellipsis */
.sm-pull{position:relative;margin:var(--s-7) 0 var(--s-6)}
.sm-pull::before{content:"\201C";display:block;height:.42em;font:var(--fw-display) calc(var(--fs-xl) * 2.2)/1 var(--font-display);color:var(--muted)}
.sm-pull p{font:var(--fw-large) var(--fs-xl)/1.2 var(--font-display);letter-spacing:-.01em;color:var(--ink);text-wrap:balance}
/* round twelve, part two (finding 35): the hanging mark stays inside the 40px gutter between the rail and the measure */
@container page (min-width:64rem){.sm-pull::before{position:absolute;left:-.42em;top:-.08em;height:auto}}
/* the receipt: one control per insight (play, the moment, Watch this moment), Cite this insight
   beside it, then the passage folded */
.sm-receipt{margin-top:var(--s-5);display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2) var(--s-5)}
.sm-moment{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--accent);text-decoration:none;font:var(--fw-medium) var(--fs-sm)/1 var(--font-body)}
.sm-moment .c{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--accent);color:var(--ground);transition:background var(--dur-fast) var(--ease-standard)}
.sm-moment .c .sm-i{width:12px;height:12px;margin-left:2px}
.sm-moment b{font-weight:var(--fw-medium);font-variant-numeric:tabular-nums}
.sm-moment small{font:var(--fw-medium) 12px/1 var(--font-body);letter-spacing:.02em;font-variant-numeric:tabular-nums}
.sm-moment small::before{content:"\00B7";margin:0 .45em 0 .1em}
.sm-moment:hover{color:var(--accent-hover)}
.sm-moment:hover .c{background:var(--accent-hover)}
.sm-citebtn{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 var(--s-3);border:var(--hairline);background:transparent;color:var(--ink-2);font:var(--fw-medium) 12px/1 var(--font-body)}
.sm-citebtn:hover{border-color:var(--ink);color:var(--ink)}
.sm-citebtn .sm-i{width:14px;height:14px}
.sm-passage{margin-top:var(--s-1)}
.sm-passage summary{display:inline-flex;align-items:center;gap:10px;min-height:44px;list-style:none;font:var(--fw-medium) var(--fs-sm)/1 var(--font-body);color:var(--ink)}
.sm-passage summary::-webkit-details-marker{display:none}
.sm-passage summary::before{content:"";width:12px;height:12px;background:linear-gradient(currentColor,currentColor) center/100% 1.5px no-repeat,linear-gradient(currentColor,currentColor) center/1.5px 100% no-repeat;transition:transform var(--dur-fast) var(--ease-standard)}
.sm-passage[open] summary::before{background:linear-gradient(currentColor,currentColor) center/100% 1.5px no-repeat;transform:rotate(180deg)}
.sm-passage summary:hover{color:var(--accent)}
.sm-passage blockquote{margin-top:var(--s-2);padding:var(--s-5) var(--s-6);background:var(--panel);font:var(--fw-regular) var(--fs-base)/1.7 var(--font-body);color:var(--ink-2)}
/* media inside the article flow. From 64rem a media block spans the shell and so crosses the contents rail's
   column; it is opaque in the page ground (not only its frame), so the rail passes behind its caption too
   (round eight: the synopsis caption and the rail were overlapping) */
.sm-article>.sm-media{margin-top:var(--s-10)}
@container page (min-width:64rem){.sm-article>.sm-media{background:var(--ground)}}
.sm-article>.sm-media+.sm-chapter{margin-top:var(--s-9)}
.sm-watch{margin-top:var(--s-10)}
@container page (min-width:64rem){.sm-article>.sm-watch{grid-column:shell}.sm-watch>h2,.sm-watch>.sm-src{width:100%;max-width:var(--measure);margin-inline:auto}}
.sm-watch h2{margin-bottom:var(--s-5);font:var(--fw-lg) var(--fs-lg)/1.2 var(--font-display)}
.sm-watch .sm-receipt{font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--muted)}
/* more moments (round eight, CODE's note b): after the chapters, the passages not yet written as insights.
   Each row is the speaker, Watch this moment with its time, and the way into the transcript. Nothing is quoted. */
.sm-moments{margin-top:var(--s-10);padding-top:var(--s-5);border-top:var(--hairline)}
.sm-moments h2,.sm-tx>h2{font:var(--fw-lg) var(--fs-lg)/1.2 var(--font-display);letter-spacing:-.005em;color:var(--ink)}
.sm-moments__about,.sm-tx__about{margin-top:var(--s-3);font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink-2);text-wrap:pretty}
.sm-moments ol{margin:var(--s-5) 0 0;padding:0;list-style:none;border-bottom:var(--hairline)}
.sm-moments li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;column-gap:var(--s-5);padding:var(--s-1) 0;border-top:var(--hairline)}
.sm-moments .sm-chip{display:inline-flex;align-items:center;gap:10px;min-height:44px;min-width:0;color:var(--ink);text-decoration:none;font:var(--fw-medium) var(--fs-sm)/1.3 var(--font-body)}
.sm-moments .sm-moment{white-space:nowrap}
.sm-moments .sm-chip:hover{color:var(--accent)}
.sm-moments .sm-chip img{width:28px;height:28px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-moments__tr{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--ink-2);text-decoration:none;font:var(--fw-medium) var(--fs-sm)/1 var(--font-body);white-space:nowrap}
.sm-moments__tr .sm-i{width:14px;height:14px}
.sm-moments__tr:hover{color:var(--ink)}
@container page (max-width:39.99rem){.sm-moments li{grid-template-columns:minmax(0,1fr) auto;padding-top:var(--s-1)}.sm-moments li .sm-chip{grid-column:1;grid-row:1;min-height:40px}.sm-moments li .sm-moments__tr{grid-column:2;grid-row:1;min-height:40px}.sm-moments li .sm-moment{grid-column:1/-1;grid-row:2;min-height:40px;margin-bottom:var(--s-1)}}
/* the transcript record (CODE's note a): the whole conversation after the full episode, labelled Transcript
   (what each speaker meant, in clean English, every point kept; never verbatim or as spoken). The about line
   carries the three downloads; a table of the chapters with their times; then one paragraph per speaker turn,
   the name first and the time a quiet permalink; each chapter a sub-heading with Watch from its time */
.sm-tx{margin-top:var(--s-10);padding-top:var(--s-5);border-top:var(--hairline);scroll-margin-top:80px}
.sm-tx__toc{margin-top:var(--s-6);width:100%;border-collapse:collapse;font:var(--fw-regular) var(--fs-sm)/1.4 var(--font-body);color:var(--ink)}
.sm-tx__toc th{padding:0 0 var(--s-2);text-align:left;font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-tx__toc td{padding:9px 0;border-top:var(--hairline);vertical-align:baseline}
.sm-tx__toc .n{width:2rem;padding-right:var(--s-2);font:var(--fw-text) var(--fs-sm)/1.4 var(--font-display);color:var(--muted)}
.sm-tx__toc .t{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--ink-2)}
.sm-tx__toc td a{color:var(--ink);text-decoration:none;display:inline-block;padding-block:3px;margin-block:-3px}
.sm-tx__toc td a:hover{color:var(--accent)}
.sm-tx__ch{margin-top:var(--s-8);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-1) var(--s-5);padding-top:var(--s-4);border-top:var(--hairline);scroll-margin-top:80px}
.sm-tx__ch h3{font:var(--fw-lg) var(--fs-md)/1.25 var(--font-display);color:var(--ink);text-wrap:balance}
.sm-tx__ch h3 b{margin-right:.5em;font-weight:inherit;color:var(--muted);font-variant-numeric:tabular-nums}
.sm-tx__watch{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--accent);text-decoration:none;font:var(--fw-medium) var(--fs-sm)/1 var(--font-body);font-variant-numeric:tabular-nums;white-space:nowrap}
.sm-tx__watch .sm-i{width:14px;height:14px}
.sm-tx__watch:hover{color:var(--accent-hover)}
.sm-turn{margin-top:var(--s-4);font:var(--fw-regular) var(--fs-base)/var(--lh-relaxed) var(--font-body);color:var(--ink-body);scroll-margin-top:80px}
.sm-tx__ch+.sm-turn{margin-top:var(--s-3)}
.sm-turn__who{font-weight:var(--fw-medium);color:var(--ink)}
/* round twelve, part two (finding 63): the time is a link in running text, so it carries the underline the body's links carry */
.sm-turn__at{margin:0 .55em 0 .5em;color:var(--muted);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em;text-decoration-color:color-mix(in srgb,currentColor 38%,transparent);font:var(--fw-regular) 12.5px/1 var(--font-body);letter-spacing:.02em;font-variant-numeric:tabular-nums}
.sm-turn__at:hover{color:var(--accent);text-decoration-color:currentColor}
.sm-turn:target .sm-turn__at,.sm-turn:target .sm-turn__who{color:var(--accent)}
/* the tail: disclosure and cite line, data-driven copy styled, never rewritten */
.sm-disclosure{margin-top:var(--s-11);padding:var(--s-6);background:var(--panel);font:var(--fw-regular) var(--fs-sm)/1.6 var(--font-body);color:var(--ink-2)}
.sm-disclosure strong{color:var(--ink)}
.sm-disclosure a{display:inline-block;margin-top:var(--s-3)}
.sm-disclosure p+p{margin-top:var(--s-3)}
.sm-cite{margin-top:var(--s-5);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-4);align-items:start;padding-top:var(--s-5);border-top:var(--hairline);font:var(--fw-regular) var(--fs-sm)/1.6 var(--font-body);color:var(--ink-2)}
.sm-cite .lbl{margin-right:var(--s-2);font:var(--fw-medium) 11px/1 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink)}
.sm-cite a{overflow-wrap:anywhere}
.sm-cite .sm-btn{min-height:36px;margin-top:-6px}

/* round 14b, item 14 (the audit of the 14a port): on a phone the open contents box's links take the 44px band of the
   other small controls as their own box (min-height), since a centred hit area would overlap the neighbouring link
   by 3px each side in a list with no gaps; a wrapped link is taller already. The box sits below the first screen */
@container page (max-width:39.99rem){.sm-contents li a{min-height:44px;align-content:center;padding-block:8px}}

/* css/stack.css */
/* the linked-entities stack: the map of the wiki at the foot of every entity page. Fixed order:
   Shows, Episodes, People, Organisations, the media rows, Articles, Insights; the Files last. */
.sm-linked,.sm-files{max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding-inline:var(--pad)}
.sm-page--shell .sm-linked,.sm-page--shell .sm-files{content-visibility:auto;contain-intrinsic-size:auto 1600px}
.sm-linked{margin-top:var(--s-11)}
.sm-linked>.sm-row:first-child{border-top:1px solid var(--rule-strong)}
.sm-row{padding-block:var(--s-7);border-bottom:var(--hairline)}
.sm-row__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-4);margin-bottom:var(--s-5)}
.sm-row__head :is(h2,h3){font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display)}
.sm-seeall{display:inline-flex;align-items:center;gap:6px;flex:none;min-height:24px;color:var(--ink-2);text-decoration:none;font:var(--fw-medium) var(--fs-xs)/1 var(--font-body);letter-spacing:.04em}
.sm-seeall .sm-i{width:14px;height:14px;transition:translate var(--dur-fast) var(--ease-standard)}
.sm-seeall:hover{color:var(--accent)}
.sm-seeall:hover .sm-i{translate:3px 0}
@container page (min-width:64rem){
.sm-row{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:start}
.sm-row__head{flex-direction:column;align-items:flex-start;gap:var(--s-3);margin:0;padding-right:var(--s-6)}
}
/* entity rows */
.sm-list{display:grid}
.sm-item{display:grid;grid-template-columns:6.5rem minmax(0,1fr);gap:var(--s-4);align-items:start;padding-block:var(--s-4);border-top:var(--hairline)}
.sm-item:first-child{border-top:0;padding-top:0}
.sm-item:last-child{padding-bottom:0}
.sm-item__media{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--media)}
.sm-item__media>img{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);transition:scale var(--dur-slow) var(--ease-out-soft)}
.sm-item:hover .sm-item__media img{scale:1.03}
.sm-item__media--mark{width:56px;aspect-ratio:1;border-radius:50%;background:transparent}
.sm-item__media--mark img{filter:var(--sm-mark-filter)}
.sm-item__media--empty{display:grid;place-items:center;padding:var(--s-2);background:var(--panel);color:var(--ink-2);font:var(--fw-text) 12px/1.25 var(--font-display);text-align:center}
.sm-item__t{font:var(--fw-text) 19px/1.3 var(--font-display);color:var(--ink)}
.sm-item__t a{color:inherit;text-decoration:none}
.sm-item__t a:hover{color:var(--accent);text-decoration:underline}
.sm-item__x{margin-top:var(--s-2);font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.sm-item__who{margin-top:var(--s-2);display:flex}
.sm-item__who a{display:inline-flex;align-items:center;gap:8px;min-height:24px;color:var(--ink);text-decoration:none;font:var(--fw-medium) 13px/1.3 var(--font-body)}
.sm-item__who a:hover{color:var(--accent)}
.sm-item__who img{width:22px;height:22px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-item__m{margin-top:var(--s-1);font:var(--fw-regular) 12.5px/1.5 var(--font-body);color:var(--muted)}
.sm-item__m a{color:var(--ink-2);display:inline-block;padding-block:4px;margin-block:-4px}
@container page (min-width:40rem){.sm-item{grid-template-columns:9rem minmax(0,1fr);gap:var(--s-5)}}
.sm-item:has(.sm-item__media--mark){grid-template-columns:56px minmax(0,1fr)}
.sm-item--text{grid-template-columns:minmax(0,1fr)!important}
/* people and organisations: round and named; an organisation shows its mark, monochrome, in the
   same disc when the registry holds one, and its initials only as the fallback */
.sm-people{display:flex;flex-wrap:wrap;gap:var(--s-5) var(--s-6)}
.sm-person{display:grid;justify-items:center;gap:var(--s-2);width:6rem;text-align:center;color:var(--ink);text-decoration:none;font:var(--fw-regular) 13px/1.3 var(--font-body)}
.sm-person img,.sm-person .sm-mono{width:72px;height:72px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);background:var(--media);transition:scale var(--dur-slow) var(--ease-out-soft)}
.sm-person img.is-mark{object-fit:contain;padding:14px;background:var(--panel);filter:var(--sm-mark-filter)}
.sm-person:hover{color:var(--accent)}
.sm-person:hover img,.sm-person:hover .sm-mono{scale:1.05}
/* the hosted mark is drawn at its render size and never zooms */
.sm-item:hover .sm-item__media--mark img,.sm-person:hover img.is-mark{scale:none}
.sm-person small{display:block;font-size:11.5px;color:var(--muted)}
.sm-mono{display:grid;place-items:center;background:var(--ink)!important;color:var(--ground);font:var(--fw-medium) 20px/1 var(--font-body);letter-spacing:.02em}
/* files: the asset wiki. A folder per kind and person shows its name, count and total size closed;
   its rows load when it opens. One row per asset: kind, then a download control per shape. */
.sm-files{padding-block:var(--s-7) 0}
.sm-files__head{margin-bottom:var(--s-5)}
.sm-files__head h2{font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display)}
.sm-files__head p{margin-top:var(--s-2);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--muted)}
@container page (min-width:64rem){.sm-files{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:start}.sm-files__head{padding-right:var(--s-6);margin:0}}
.sm-folders{border-top:1px solid var(--rule-strong)}
.sm-folder{border-bottom:var(--hairline)}
.sm-folder summary{display:grid;grid-template-columns:18px minmax(0,1fr) auto 16px;align-items:center;gap:var(--s-3);min-height:52px;list-style:none;font:var(--fw-regular) var(--fs-sm)/1.35 var(--font-body);color:var(--ink)}
.sm-folder summary::-webkit-details-marker{display:none}
.sm-folder summary>.sm-i{width:18px;height:18px;color:var(--muted)}
.sm-folder summary:hover{color:var(--accent)}
.sm-folder__meta{font:var(--fw-regular) 12.5px/1 var(--font-body);color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.sm-folder__chev{transition:transform var(--dur-fast) var(--ease-standard)}
.sm-folder[open] .sm-folder__chev{transform:rotate(180deg)}
.sm-filelist{padding-bottom:var(--s-3)}
.sm-file{display:grid;grid-template-columns:56px minmax(0,1fr);gap:var(--s-2) var(--s-4);align-items:start;padding-block:var(--s-3);border-top:var(--hairline)}
.sm-file__thumb{grid-row:span 2;display:block;width:56px;aspect-ratio:1/1;overflow:hidden;border-radius:var(--r-sm);background:var(--media)}
.sm-file__thumb img{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-file__t{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-1) var(--s-3);font:var(--fw-regular) var(--fs-sm)/1.4 var(--font-body);color:var(--ink)}
.sm-file__dls{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.sm-dl{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 var(--s-3);border:var(--hairline);color:var(--ink);text-decoration:none;font:var(--fw-regular) 12px/1 var(--font-body);font-variant-numeric:tabular-nums;white-space:nowrap}
.sm-dl:hover{border-color:var(--ink);color:var(--ink)}
.sm-dl .sm-i{width:14px;height:14px}
.sm-dl b{font-weight:var(--fw-medium)}
.sm-dl span{color:var(--muted)}
@container page (min-width:64rem){.sm-file{grid-template-columns:56px minmax(0,1fr) auto;align-items:center}.sm-file__thumb{grid-row:auto}}
/* cards: episode, insight, person, organisation, show (feeds, listings, the front door, hub home) */
.sm-feed{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,19rem),1fr));gap:var(--s-9) var(--s-8)}
.sm-card{position:relative;display:grid;align-content:start;gap:var(--s-4);color:inherit;text-decoration:none}
.sm-card__media{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--media)}
.sm-card__media>img{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);transition:scale var(--dur-slow) var(--ease-out-soft)}
.sm-card:hover .sm-card__media img{scale:1.03}
.sm-card__meta{display:flex;flex-wrap:wrap;gap:4px 12px;font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-card__t{font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink);text-wrap:balance}
.sm-card__t a{color:inherit;text-decoration:none}
.sm-card__t a::after{content:"";position:absolute;inset:0}
.sm-card:hover .sm-card__t{color:var(--accent)}
.sm-card__x{font:var(--fw-regular) var(--fs-sm)/1.6 var(--font-body);color:var(--ink-2)}
.sm-card--lead{grid-column:1/-1}
.sm-card--lead .sm-card__media{aspect-ratio:21/9}
/* a plated picture carries its plate on its top edge: a frame wider than the rendition crops from the bottom
   only, so the wordmark, the name plates and the hosted mark keep their safe area (round six) */
.sm-card--lead .sm-card__media img{object-position:var(--face-x,50%) 0}
.sm-card--lead .sm-card__t{font-weight:var(--fw-display);font-size:var(--fs-2xl);line-height:1.04;letter-spacing:var(--track-tight)}
@container page (min-width:64rem){.sm-card--lead{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:var(--s-8);align-items:end}}
.sm-card--insight{padding-top:var(--s-5);border-top:1px solid var(--rule-strong)}
.sm-card__by{display:flex;align-items:center;gap:var(--s-3);font:var(--fw-regular) 12.5px/1.4 var(--font-body);color:var(--muted)}
.sm-card__by img{width:28px;height:28px;border-radius:50%;object-fit:cover}
.sm-card__by b{font-weight:var(--fw-medium);color:var(--ink)}
.sm-card--entity{justify-items:start;text-align:left;padding-top:var(--s-5);border-top:var(--hairline)}
.sm-card--entity .sm-card__disc{width:88px;height:88px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);background:var(--media)}
.sm-card--entity .sm-card__disc.is-mark{object-fit:contain;padding:16px;background:var(--panel);filter:var(--sm-mark-filter)}
.sm-card--entity .sm-mono{width:88px;height:88px;border-radius:50%;font-size:26px}
.sm-card__counts{font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
/* Quiche Sans by size: the --fs-lg settings cross 24px at 43.75rem and turn Light there */
@container page (min-width:43.75rem){.sm-dek,.sm-chapter::before,.sm-chapter h2,.sm-row__head :is(h2,h3),.sm-files__head h2,.sm-card__t,.sm-listen__t,.sm-watch h2{font-weight:var(--fw-large)}}
/* round eleven (operator, 2 October): on an episode page the stack carries a visible heading, More on Sourced.media,
   and the strong rule opens its first row under it */
.sm-linked__h,.sm-moreon__h{margin-bottom:var(--s-6);font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);letter-spacing:-.005em;color:var(--ink)}
.sm-linked>.sm-linked__h+.sm-row{border-top:1px solid var(--rule-strong)}
@container page (min-width:43.75rem){.sm-linked__h,.sm-moreon__h{font-weight:var(--fw-large)}}
/* round twelve, part two (findings 1 and 121, the operator's ruling Q2): on an episode page the heading More on Sourced.media
   heads the whole block, the Featured module included: div.sm-moreon holds the heading, the module and the stack; the module's
   heading and the rows' headings step down to h3 under it */
.sm-moreon{max-width:calc(var(--shell) + 2 * var(--pad));margin:var(--s-11) auto 0;padding-inline:var(--pad)}
.sm-moreon>.sm-featured,.sm-moreon>.sm-linked{max-width:none;margin-inline:0;padding-inline:0}
.sm-moreon>.sm-moreon__h+.sm-featured{margin-top:0}
.sm-moreon>.sm-moreon__h+.sm-linked{margin-top:0}
.sm-moreon>.sm-featured+.sm-linked{margin-top:var(--s-10)}
.sm-moreon .sm-featured__h{font-size:var(--fs-md)}

/* css/pages.css */
/* pages: what the whole-system pages add (front door, hub home, show, site indexes, search). Round five.
   Only new classes live here, so the approved episode renders exactly as before. */
/* the hero: the wordmark as the nameplate, cropped to its letters (the clear space is the layout's),
   then the strapline and the lede on one hairline */
.sm-hero{max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding:clamp(var(--s-8),calc(5 * var(--vw)),var(--s-10)) var(--pad) 0}
.sm-hero__name{line-height:0}
.sm-hero__name svg{display:block;width:100%;height:auto;fill:currentColor;color:var(--ink)}
.sm-hero__body{display:grid;gap:var(--s-6);margin-top:clamp(var(--s-6),calc(3 * var(--vw)),var(--s-8));padding-top:clamp(var(--s-6),calc(3 * var(--vw)),var(--s-8));border-top:var(--hairline)}
.sm-hero__strap{font:var(--fw-large) clamp(1.75rem,calc(1.2rem + 2.4 * var(--vw)),3.375rem)/1.08 var(--font-display);letter-spacing:-.012em;color:var(--ink);max-width:24ch;text-wrap:balance}
.sm-hero__lede{font:var(--fw-regular) var(--fs-md)/1.6 var(--font-body);color:var(--ink-body);max-width:60ch}
/* round thirteen: the hero carries the approved strapline and lede in one column (.sm-hero__text), the three sides beside them from 64rem */
.sm-hero__text{display:grid;gap:var(--s-5);align-content:start}
/* round twelve: the lede is the three sides; round 14b (item 5): the sides are the three audience panels, shows first (css/panel.css .sm-side) */
@container page (min-width:64rem){.sm-hero__body{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s-9);align-items:start}.sm-hero__strap{font-weight:var(--fw-display)}}
/* sections of a whole-system page: plain rows, no stack. A strong rule opens each; the link goes to the site index */
.sm-sect{max-width:calc(var(--shell) + 2 * var(--pad));margin:clamp(var(--s-9),calc(6.5 * var(--vw)),var(--s-11)) auto 0;padding-inline:var(--pad)}
.sm-sect__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-4);margin-bottom:var(--s-7);padding-top:var(--s-4);border-top:1px solid var(--rule-strong)}
.sm-sect__head h2{font:var(--fw-large) var(--fs-xl)/1.1 var(--font-display);letter-spacing:-.01em}
.sm-sect--pair{display:grid;gap:clamp(var(--s-9),calc(6.5 * var(--vw)),var(--s-11)) var(--s-9)}
.sm-sect--pair>section{min-width:0}
.sm-sect .sm-person{width:7.5rem;overflow-wrap:anywhere}
@container page (min-width:64rem){.sm-sect--pair{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}}
/* feeds: two columns from the square tier (the beyondai.media grid), four for the insight cards on a desk */
.sm-feed--two{grid-template-columns:minmax(0,1fr)}
.sm-feed--four{grid-template-columns:minmax(0,1fr);gap:var(--s-8) var(--s-7)}
@container page (min-width:40rem){.sm-feed--two,.sm-feed--four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container page (min-width:64rem){.sm-feed--four{grid-template-columns:repeat(4,minmax(0,1fr))}}
.sm-card__body{display:grid;align-content:start;gap:var(--s-4)}
/* chips inside a card sit above the card's own link */
.sm-card__chips{position:relative;z-index:1;display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2) var(--s-5)}
.sm-card__host{position:relative;z-index:1;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font:var(--fw-regular) 13px/1.3 var(--font-body);color:var(--muted)}
.sm-card__chips a,.sm-card__host a{display:inline-flex;align-items:center;gap:8px;min-height:24px;color:var(--ink);text-decoration:none;font:var(--fw-medium) 13px/1.3 var(--font-body)}
.sm-card__chips a:hover,.sm-card__host a:hover{color:var(--accent)}
.sm-card__chips img,.sm-card__host img{width:22px;height:22px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,46%);background:var(--media)}
/* the show card: the mark in its own disc (no panel ring, so dark mode inverts the mark alone), then name, host, counts */
.sm-showgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,22rem),1fr));gap:var(--s-7) var(--s-8)}
.sm-card--show{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--s-5);padding-top:var(--s-5);border-top:var(--hairline)}
.sm-card--show .sm-card__body{gap:var(--s-2)}
.sm-card__mark{width:88px;height:88px;border-radius:50%;filter:var(--sm-mark-filter)}
/* round twelve, part two (finding 89): a lone show card spans the row */
.sm-showgrid:has(>:only-child){grid-template-columns:minmax(0,1fr)}
/* the search invitation: the palette's field at page size */
.sm-invite__field{max-width:44rem;height:64px;padding:0 var(--s-3) 0 var(--s-5);font-size:var(--fs-md)}
.sm-invite__field>.sm-i{width:20px;height:20px}
.sm-invite__note{margin-top:var(--s-4);display:flex;flex-wrap:wrap;align-items:center;gap:6px}
@container page (max-width:39.99rem){.sm-invite__field{height:56px;font-size:var(--fs-base)}.sm-invite__field .sm-search__ph{display:block}.sm-invite__field .sm-search__short{display:none}.sm-invite__note{display:none}}
/* a long title never runs past its column (round five: overflow-wrap on every card title) */
.sm-card__t{overflow-wrap:anywhere}
/* the hub hero: the breadcrumb as kicker, the show's mark large beside its name, the host, one line.
   The mark sits in its own disc with no ring, so dark mode inverts the mark alone */
.sm-showhero{max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding:clamp(var(--s-7),calc(4 * var(--vw)),var(--s-9)) var(--pad) 0}
.sm-showhero__in{display:grid;gap:var(--s-6);margin-top:var(--s-6)}
.sm-showhero__mark{width:112px;height:112px;border-radius:50%;filter:var(--sm-mark-filter)}
.sm-showhero h1{font:var(--fw-large) var(--fs-3xl)/1.02 var(--font-display);letter-spacing:var(--track-tight);color:var(--ink);max-width:16ch;text-wrap:balance;overflow-wrap:anywhere}
.sm-showhero__host{margin-top:var(--s-5);display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3);font:var(--fw-regular) var(--fs-sm)/1.4 var(--font-body);color:var(--muted)}
.sm-showhero__host a{display:inline-flex;align-items:center;gap:var(--s-2);color:var(--ink);text-decoration:none;font-weight:var(--fw-medium)}
.sm-showhero__host a:hover{color:var(--accent)}
.sm-showhero__host img{width:28px;height:28px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,46%);background:var(--media)}
.sm-showhero__lede{margin-top:var(--s-6);padding-top:var(--s-6);border-top:var(--hairline);font:var(--fw-regular) var(--fs-md)/1.6 var(--font-body);color:var(--ink-body);max-width:60ch}
/* round twelve: the show's two actions in its head, Commission an episode and Contact the show; Promote on each episode's card */
.sm-showhero__act{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-4);margin-top:var(--s-6)}
.sm-showhero__act .sm-btn .sm-i{width:16px;height:16px}
.sm-card__act{position:relative;z-index:1;display:flex}
.sm-promote{display:inline-flex;align-items:center;gap:var(--s-2);min-height:24px;color:var(--ink-2);text-decoration:none;font:var(--fw-medium) 13px/1.3 var(--font-body)}
.sm-promote .sm-i{width:14px;height:14px;transition:translate var(--dur-fast) var(--ease-standard)}
.sm-promote:hover{color:var(--accent)}
.sm-promote:hover .sm-i{translate:3px 0}
@container page (max-width:39.99rem){.sm-showhero__act .sm-btn{flex:1 1 100%;justify-content:center}}
@container page (min-width:40rem){.sm-showhero__in{grid-template-columns:auto minmax(0,1fr);gap:var(--s-8);align-items:start}.sm-showhero__mark{width:152px;height:152px}}
@container page (min-width:64rem){.sm-showhero__in{gap:var(--s-9)}.sm-showhero__mark{width:216px;height:216px}.sm-showhero h1{font-weight:var(--fw-display)}}
/* people as person cards: two columns on a phone, four on a desk */
.sm-feed--people{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-8) var(--s-6)}
@container page (min-width:64rem){.sm-feed--people{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-8)}}
/* the story: unnumbered sections on the measure, a hairline above each H2 (Light: it is never under 26px) */
.sm-sec{margin-top:var(--s-10);padding-top:var(--s-5);border-top:var(--hairline)}
.sm-article>.sm-media+.sm-sec,.sm-takeaways+.sm-sec{margin-top:var(--s-9)}
.sm-sec h2{font:var(--fw-large) var(--fs-xl)/1.15 var(--font-display);letter-spacing:-.008em;color:var(--ink);text-wrap:balance;overflow-wrap:anywhere}
.sm-sec>p{margin-top:var(--s-5);font:var(--fw-regular) var(--fs-base)/var(--lh-relaxed) var(--font-body);color:var(--ink-body)}
/* the takeaways box: the one off-white panel, a caps label, three to five numbered lines */
.sm-takeaways{margin-top:var(--s-9);padding:var(--s-6) var(--s-6) var(--s-7);background:var(--panel)}
.sm-takeaways h2{font:var(--fw-medium) var(--fs-xs)/1.3 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink)}
.sm-takeaways ol{margin:var(--s-5) 0 0;padding:0;list-style:none;display:grid;gap:var(--s-4)}
.sm-takeaways li{display:grid;grid-template-columns:2.25rem minmax(0,1fr);gap:var(--s-3);font:var(--fw-regular) var(--fs-base)/1.55 var(--font-body);color:var(--ink)}
.sm-takeaways__n{font:var(--fw-regular) var(--fs-base)/1.55 var(--font-display);color:var(--muted);font-variant-numeric:tabular-nums}
.sm-takeaways li+li{padding-top:var(--s-4);border-top:var(--hairline)}
/* the insight: the chapter at page scale. The kicker names the episode; the question is the H1 and the title,
   a step below the episode's name because a question runs to three lines; the answer is the first paragraph;
   the words and their speaker are one figure, then the one receipt and the passage folded */
.sm-head--q h1{font-size:clamp(2rem,calc(1.55rem + 1.9 * var(--vw)),3.5rem);font-weight:var(--fw-large);line-height:1.08;max-width:22ch;overflow-wrap:anywhere}
@container page (min-width:64rem){.sm-head--q h1{font-weight:var(--fw-display)}}
.sm-answer{margin-top:var(--s-6)}
.sm-said{margin-top:var(--s-8)}
.sm-said>.sm-pull{margin:0}
.sm-said>.sm-speaker{margin-top:var(--s-5);flex-wrap:wrap;gap:var(--s-1) var(--s-3)}
.sm-speaker__r{color:var(--muted)}
.sm-said+.sm-receipt{margin-top:var(--s-5)}
/* round twelve, part two (finding 42): a paragraph after the lede, the answer, the figure or the receipt keeps the body's gap */
.sm-lede+p,.sm-answer+p,.sm-said+p,.sm-said+.sm-prose,.sm-article>.sm-receipt+p,.sm-article>p:not([class])+p:not([class]){margin-top:var(--s-5)}
/* from the episode: the trio pointing home; a caps label, then the three pages, none current */
.sm-from{margin-top:var(--s-10)}
.sm-from ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:var(--s-3);border-top:1px solid var(--rule-strong)}
.sm-from a{display:flex;align-items:center;justify-content:space-between;gap:var(--s-2);min-height:56px;padding-right:var(--s-3);border-bottom:var(--hairline);color:var(--ink);text-decoration:none;font:var(--fw-text) var(--fs-md)/1.1 var(--font-display)}
.sm-from li+li a{padding-left:var(--s-4);border-left:var(--hairline)}
.sm-from a:hover{color:var(--accent)}
.sm-from .sm-i{flex:none;width:16px;height:16px;color:var(--muted)}
.sm-from a:hover .sm-i{color:currentColor}
.sm-from+.sm-disclosure{margin-top:var(--s-9)}
/* the person: a banner strip of the person's landscape stills (the tier sets the count: two on a phone,
   three at the square tier, five on a desk; a still keeps its cell, so a short set never stretches),
   the round headshot over the strip's lower edge in a ring of the page ground, clear of every face;
   the name, the title line, then the record. From 64rem the head, the record and the tail sit on the
   stack's ledger (14rem, then the rest), so the name, the facts and every row below start on one line */
.sm-profile{max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding:var(--s-5) var(--pad) 0}
.sm-stills{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
.sm-stills img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);background:var(--media)}
.sm-stills img:nth-child(n+3){display:none}
.sm-profile__head{display:grid;justify-items:start;gap:var(--s-5)}
.sm-profile__face{width:104px;height:104px;margin-top:-32px;padding:4px;border-radius:50%;background:var(--ground);object-fit:cover;object-position:var(--face-x,50%) var(--face-y,46%)}
.sm-profile__head:first-child .sm-profile__face{margin-top:0}
.sm-profile__id{min-width:0}
.sm-profile h1{margin-top:var(--s-5);font:var(--fw-large) clamp(2.5rem,calc(1.5rem + 4.6 * var(--vw)),5.75rem)/1.02 var(--font-display);letter-spacing:var(--track-tight);color:var(--ink);max-width:16ch;text-wrap:balance;overflow-wrap:anywhere}
.sm-profile__title{margin-top:var(--s-4);font:var(--fw-regular) var(--fs-md)/1.5 var(--font-body);color:var(--ink-body);max-width:52ch;text-wrap:pretty}
/* the record: the facts the subject supplies and corrects, a caps label, then term over value; its state
   is one quiet line */
.sm-record{margin-top:var(--s-8);padding-top:var(--s-5);border-top:var(--hairline)}
.sm-record>h2{color:var(--ink)}
.sm-record dl{margin-top:var(--s-5);display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));gap:var(--s-5) var(--s-7)}
.sm-record dt{font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-record dd{margin-top:6px;font:var(--fw-regular) var(--fs-base)/1.45 var(--font-body);color:var(--ink);overflow-wrap:anywhere}
.sm-record .sm-chip{display:inline-flex;align-items:center;gap:8px;vertical-align:top;color:var(--ink);text-decoration:none;font-weight:var(--fw-medium)}
.sm-record .sm-chip:hover{color:var(--accent)}
.sm-record .sm-chip>.sm-mono{width:24px;height:24px;border-radius:50%;font-size:9.5px;letter-spacing:.04em}
.sm-record__self{display:inline-block;margin-left:10px;font-size:var(--fs-sm);color:var(--muted);white-space:nowrap}
.sm-record dd .sm-i{display:inline-block;width:14px;height:14px;margin-left:5px;vertical-align:-1px}
.sm-record__state{margin-top:var(--s-6);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--muted)}
.sm-profile__tail{margin-top:var(--s-9)}
.sm-profile__tail>*{max-width:var(--measure)}
.sm-profile__tail>.sm-disclosure{margin-top:0}
@container page (min-width:40rem){.sm-stills{grid-template-columns:repeat(3,minmax(0,1fr))}.sm-stills img:nth-child(3){display:block}.sm-profile__head{grid-template-columns:auto minmax(0,1fr);gap:var(--s-7)}.sm-profile__face{width:136px;height:136px;margin-top:-40px}.sm-profile__id{padding-top:var(--s-6)}}
@container page (min-width:64rem){.sm-stills{grid-template-columns:repeat(5,minmax(0,1fr))}.sm-stills img:nth-child(-n+5){display:block}.sm-profile__head{grid-template-columns:14rem minmax(0,1fr);gap:0}.sm-profile__face{width:168px;height:168px;margin-top:-48px}.sm-profile__id{padding-top:var(--s-7)}.sm-profile h1{font-weight:var(--fw-display)}.sm-record{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:start}.sm-record dl{margin-top:0;grid-template-columns:repeat(3,minmax(0,1fr))}.sm-record__state{grid-column:2}.sm-profile__tail{padding-left:14rem}}
/* an organisation's chip: its mark, else its initials, in the hover card's disc */
.sm-hovercard>.sm-mono{width:52px;height:52px;border-radius:50%;font-size:17px}
/* a profile with no strip (an organisation; a person without stills): the disc opens the page with the name
   on its centre line. An organisation's disc holds its mark, monochrome on the panel, and its initials only
   as the fallback */
.sm-profile:not(:has(>.sm-stills)){padding-top:clamp(var(--s-7),calc(4 * var(--vw)),var(--s-9))}
.sm-profile:not(:has(>.sm-stills)) .sm-profile__id{padding-top:0}
.sm-profile__face.sm-mono{padding:0;font-size:30px;letter-spacing:.02em}
/* round twelve, part two (finding 33): a fixed inset, never a percentage (18% of the head's column left a 0px content box at 375) */
.sm-profile__face.is-mark{object-fit:contain;padding:22px;background:var(--panel);filter:var(--sm-mark-filter)}
.sm-record .sm-chip>img{width:24px;height:24px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
@container page (min-width:40rem){.sm-profile:not(:has(>.sm-stills)) .sm-profile__head{align-items:center}.sm-profile__face.sm-mono{font-size:40px}.sm-profile__face.is-mark{padding:28px}}
@container page (min-width:64rem){.sm-profile__face.sm-mono{font-size:50px}.sm-profile__face.is-mark{padding:34px}}
/* the show: the hub hero without the masthead's mark, its Episodes, People and Insights drawn as the feed,
   then the disclosure and the cite line at the shell's edge, then the rest of the stack */
.sm-sect--tail>*{max-width:var(--measure)}
.sm-sect--tail>.sm-disclosure{margin-top:0}
/* a row of several people or organisations: a long name breaks inside its own column, never into the next */
.sm-people:has(>.sm-person+.sm-person)>.sm-person{overflow-wrap:anywhere}
/* the disclosure is one line (round twelve, 6 October 2026); an episode in production adds one quiet note under it */
.sm-disclosure__note{margin-top:var(--s-3);color:var(--muted)}
/* the Featured module (round six): one episode, one organisation, one person from the featured pool, in that
   order, each labelled Featured in the eyebrow style, under its own heading, a hairline above and below. After
   the page's own content, before the stack; a page in the pool, or an empty pool, carries none. Three across
   from 40rem (smaller cards at the square tier; the heading in the stack's margin from 64rem), stacked on a phone
   with the organisation and the person as rows */
.sm-featured{max-width:calc(var(--shell) + 2 * var(--pad));margin:var(--s-11) auto 0;padding-inline:var(--pad)}
.sm-featured+.sm-linked{margin-top:var(--s-10)}
.sm-featured__in{padding-block:var(--s-7);border-block:var(--hairline)}
.sm-featured__h{font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink)}
.sm-featured__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-7);margin-top:var(--s-5)}
.sm-card__feat{color:var(--ink)}
/* round twelve, part two (finding 75): under the module's own heading the card's Featured tag would read twice */
.sm-featured .sm-card__feat{display:none}
.sm-featured .sm-card--entity{grid-template-columns:64px minmax(0,1fr);align-items:center;gap:var(--s-4);padding-top:0;border-top:0}
.sm-featured .sm-card--entity .sm-card__disc,.sm-featured .sm-card--entity .sm-mono{width:64px;height:64px;font-size:20px}
.sm-featured .sm-card--entity .sm-card__body{gap:var(--s-2)}
.sm-featured .sm-card__x{overflow-wrap:anywhere}
/* round 14b (the operator, 10 October 2026): on an episode page the module is text alone, since the page carries
   only its own episode's pictures: no picture, no chip thumbnail, no disc */
.sm-featured--text .sm-card--entity{grid-template-columns:minmax(0,1fr)}
@container page (min-width:40rem){.sm-featured__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-6)}.sm-featured .sm-card--entity{grid-template-columns:minmax(0,1fr);align-items:start}.sm-featured .sm-card__t{font-size:var(--fs-md);font-weight:var(--fw-lg)}}
@container page (min-width:64rem){.sm-featured__in{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:start}.sm-featured__h{padding-right:var(--s-6)}.sm-featured__grid{margin-top:0;gap:var(--s-7)}.sm-featured .sm-card--entity .sm-card__disc,.sm-featured .sm-card--entity .sm-mono{width:88px;height:88px;font-size:26px}.sm-featured .sm-card__t{font-size:var(--fs-lg);font-weight:var(--fw-large)}}
/* a feed's lead slot taken by a pool item (the front door, the hub home, the site indexes): the same label */
.sm-person__feat{display:block;font:var(--fw-medium) 10.5px/1.3 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink)}
/* listings (kind 09): the stack's row in full. The kicker names the entity and the H1 is the row's name; a strong
   rule opens the list; from 64rem the count and the order sit in the stack's head column (14rem) with the list
   beside them on the measure, so the list lines up with the stack below. Then the back link, the disclosure and
   the cite line on the same ledger, then the entity's stack without the row the page lists */
.sm-listing{max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding:clamp(var(--s-7),calc(4 * var(--vw)),var(--s-9)) var(--pad) 0}
.sm-listing h1{margin-top:var(--s-5);font:var(--fw-large) clamp(2.5rem,calc(1.5rem + 4.6 * var(--vw)),5.75rem)/1.02 var(--font-display);letter-spacing:var(--track-tight);color:var(--ink);overflow-wrap:anywhere}
.sm-listing__body{margin-top:clamp(var(--s-7),calc(4 * var(--vw)),var(--s-9));padding-top:var(--s-6);border-top:1px solid var(--rule-strong)}
.sm-listing__side{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s-2) var(--s-4);margin-bottom:var(--s-6)}
.sm-listing__count{font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink)}
.sm-listing__order{font:var(--fw-medium) var(--fs-xs)/1.4 var(--font-body);letter-spacing:.04em;color:var(--muted)}
.sm-listing__list{max-width:var(--measure)}
.sm-listing__back{max-width:var(--measure);margin-top:var(--s-7);padding-top:var(--s-5);border-top:var(--hairline)}
.sm-back{display:inline-flex;align-items:center;gap:8px;min-height:24px;color:var(--ink);text-decoration:none;font:var(--fw-medium) var(--fs-sm)/1.3 var(--font-body)}
.sm-back .sm-i{width:14px;height:14px;rotate:180deg;transition:translate var(--dur-fast) var(--ease-standard)}
.sm-back:hover{color:var(--accent)}
.sm-back:hover .sm-i{translate:-3px 0}
.sm-listing__tail{margin-top:var(--s-9)}
.sm-listing__tail>*{max-width:var(--measure)}
.sm-listing__tail>.sm-disclosure{margin-top:0}
@container page (min-width:43.75rem){.sm-listing__count{font-weight:var(--fw-large)}}
@container page (min-width:64rem){.sm-listing h1{font-weight:var(--fw-display)}.sm-listing__body{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:start;padding-top:var(--s-7)}.sm-listing__side{flex-direction:column;align-items:flex-start;gap:var(--s-3);margin:0;padding-right:var(--s-6)}.sm-listing__back{grid-column:2}.sm-listing__tail{padding-left:14rem}}
/* a person or an organisation as a list row: a round disc at the Shows row's mark size, the name, the title line */
.sm-item__media--disc{width:56px;aspect-ratio:1;border-radius:50%}
.sm-item:has(.sm-item__media--disc){grid-template-columns:56px minmax(0,1fr);align-items:center}
.sm-item__media--disc>.sm-mono{width:100%;height:100%;border-radius:50%;font-size:17px}
/* viewers (kind 10): the entity's media rows as tabs, the shape toggle, the grid of uniform tiles and the in-flow
   stage. Auto follows the tier (portrait under 40rem, square from 40rem, landscape from 64rem), the box and the
   rendition together; a chosen shape is stored per viewer. From 64rem the tabs stand in the stack's head column
   and the grid beside them, so the viewer reads as the ledger it opens from */
.sm-viewer__main{min-width:0;margin-top:var(--s-6)}
.sm-tabs{display:flex;gap:var(--s-6);overflow-x:auto;scrollbar-width:none;margin-inline:calc(-1 * var(--pad));padding-inline:var(--pad);border-bottom:var(--hairline)}
.sm-tabs::-webkit-scrollbar{display:none}
/* round twelve, part two (finding 120): while the strip scrolls, a fade at its right edge says so */
@container page (max-width:63.99rem){.sm-tabs{padding-right:calc(var(--pad) + 12px)}.sm-tabs::after{content:"";position:sticky;right:0;flex:none;align-self:stretch;width:28px;margin-left:-28px;background:linear-gradient(90deg,transparent,var(--ground))}}
.sm-tabs a{position:relative;flex:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--ink-2);text-decoration:none;font:var(--fw-medium) var(--fs-sm)/1 var(--font-body);white-space:nowrap}
.sm-tabs a:hover{color:var(--ink)}
.sm-tabs a[aria-current="page"]{color:var(--accent)}
.sm-tabs a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:currentColor}
.sm-tabs .sm-num{font-weight:var(--fw-regular);color:var(--muted);font-variant-numeric:tabular-nums}
.sm-viewer__bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--s-2) var(--s-3);margin-bottom:var(--s-5)}
.sm-shapes button[data-shape="portrait"]::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent)}
.sm-tile__box>picture>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);transition:scale var(--dur-slow) var(--ease-out-soft)}
.sm-tile:hover .sm-tile__box>picture>img{scale:1.03}
.sm-grid[data-shape="auto"]{grid-template-columns:repeat(auto-fill,minmax(7.5rem,1fr))}
.sm-grid[data-shape="auto"] .sm-tile__box{aspect-ratio:9/16}
.sm-grid .sm-shape[data-t]{display:none}
.sm-grid[data-shape="auto"] .sm-shape[data-t="portrait"],.sm-grid[data-shape="portrait"] .sm-shape[data-t="portrait"],.sm-grid[data-shape="square"] .sm-shape[data-t="square"],.sm-grid[data-shape="landscape"] .sm-shape[data-t="landscape"]{display:inline-grid}
.sm-grid:has([aria-current="true"]) .sm-tile:not([aria-current="true"]) .sm-tile__box{opacity:.6}
.sm-grid:has([aria-current="true"]) .sm-tile:hover .sm-tile__box{opacity:1}
@container page (max-width:39.99rem){.sm-viewer__bar .sm-seg-label{display:none}.sm-shapes button{padding:0 var(--s-3)}}
@container page (min-width:40rem){.sm-shapes button[data-shape="portrait"]::after{content:none}.sm-shapes button[data-shape="square"]::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent)}.sm-grid[data-shape="auto"]{grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr))}.sm-grid[data-shape="auto"] .sm-tile__box{aspect-ratio:1/1}.sm-grid[data-shape="auto"] .sm-shape[data-t="portrait"]{display:none}.sm-grid[data-shape="auto"] .sm-shape[data-t="square"]{display:inline-grid}}
@container page (min-width:64rem){.sm-viewer__main{margin-top:0}.sm-tabs{flex-direction:column;gap:0;margin:0;padding:0 var(--s-6) 0 0;border-bottom:0;overflow:visible}.sm-tabs a{justify-content:space-between;min-height:48px;border-bottom:var(--hairline)}.sm-shapes button[data-shape="square"]::after{content:none}.sm-shapes button[data-shape="landscape"]::after{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent)}.sm-grid[data-shape="auto"]{grid-template-columns:repeat(auto-fill,minmax(14rem,1fr))}.sm-grid[data-shape="auto"] .sm-tile__box{aspect-ratio:16/9}.sm-grid[data-shape="auto"] .sm-shape[data-t="square"]{display:none}.sm-grid[data-shape="auto"] .sm-shape[data-t="landscape"]{display:inline-grid}}
/* files (kind 11): the asset wiki, the trio's third page. The episode's head with Files as the H1, the episode's
   stack, then every folder (closed by default), each opening on its Download all, then the disclosure and the
   cite line on the ledger, closing the page */
.sm-files--page{margin-top:var(--s-10)}
.sm-folder__all{padding-block:var(--s-3);border-top:var(--hairline)}
.sm-dl--all{border-color:var(--ink)}
.sm-tail{max-width:calc(var(--shell) + 2 * var(--pad));margin:var(--s-10) auto 0;padding-inline:var(--pad)}
/* site indexes (kind 12): a whole-system page, no stack and no disclosure. The kicker names the front door, the H1
   is the kind, then the count and the search field inviting the palette; the lead slot (a pool item on rotation,
   labelled Featured the same way, and still listed under its letter) and the letters, each a heading over plain
   rows. From 64rem the letters stand in the stack's head column */
.sm-idx__count{margin-top:var(--s-4);font:var(--fw-regular) var(--fs-md)/1.5 var(--font-body);color:var(--muted)}
.sm-idx__search{margin-top:var(--s-7)}
.sm-idx__search .sm-invite__field{margin-inline:0}
.sm-idx{margin-top:clamp(var(--s-8),calc(5 * var(--vw)),var(--s-10));border-top:1px solid var(--rule-strong)}
.sm-idx__group{padding-block:var(--s-6);border-bottom:var(--hairline)}
.sm-idx__letter{display:block;margin-bottom:var(--s-4);font:var(--fw-large) var(--fs-xl)/1 var(--font-display);color:var(--ink)}
.sm-idx__group--lead .sm-idx__letter{display:none}
.sm-idx .sm-list{max-width:var(--measure)}
.sm-item .sm-person__feat{margin-bottom:var(--s-1)}
@container page (min-width:64rem){.sm-idx__group{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:start;padding-block:var(--s-7)}.sm-idx__letter{margin:0;font-weight:var(--fw-display);font-size:var(--fs-2xl)}.sm-idx__group--lead .sm-idx__letter{display:block}}
/* search (kind 13): the palette's full-page form. The field at page size holding the query, the count and the
   keys, then the results grouped by kind in the palette's order, each group's name and count in the stack's head
   column from 64rem and each result its stack row; the first result selected, the arrows move it, Enter opens it */
.sm-find__field{display:flex;align-items:center;gap:var(--s-3);max-width:44rem;height:64px;margin-top:var(--s-7);padding:0 var(--s-5);border:1px solid var(--ink);background:var(--card);color:var(--muted)}
.sm-find__field>.sm-i{flex:none;width:20px;height:20px}
.sm-find__field input{flex:1;min-width:0;height:100%;border:0;background:transparent;outline:0;color:var(--ink);font:var(--fw-regular) var(--fs-md)/1 var(--font-body)}
.sm-find__field input::placeholder{color:var(--muted)}
.sm-find__field:focus-within{outline:2px solid var(--accent);outline-offset:2px}
.sm-find__keys{display:flex;flex-wrap:wrap;gap:var(--s-5);margin-top:var(--s-4);font:var(--fw-regular) 12px/1 var(--font-body);color:var(--muted)}
.sm-find__keys span{display:inline-flex;align-items:center;gap:6px}
.sm-find__head{display:flex;align-items:baseline;gap:var(--s-3);margin-bottom:var(--s-5)}
.sm-find__head h2{font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink)}
.sm-find__head .sm-num{font:var(--fw-regular) var(--fs-sm)/1 var(--font-body);color:var(--muted);font-variant-numeric:tabular-nums}
.sm-find .sm-item[aria-selected="true"],.sm-find .sm-item:focus-within{position:relative;background:var(--hover);box-shadow:0 0 0 var(--s-3) var(--hover)}
.sm-find .sm-item[aria-selected="true"]::before,.sm-find .sm-item:focus-within::before{content:"";position:absolute;left:calc(-1 * var(--s-3));top:calc(-1 * var(--s-3));bottom:calc(-1 * var(--s-3));width:3px;background:var(--accent)}
.sm-find .sm-item[aria-selected="true"] .sm-item__t a,.sm-find .sm-item:focus-within .sm-item__t a{color:var(--accent)}
.sm-find__empty{margin-top:clamp(var(--s-8),calc(5 * var(--vw)),var(--s-10));padding-top:var(--s-6);border-top:1px solid var(--rule-strong);max-width:34ch;font:var(--fw-large) var(--fs-lg)/1.3 var(--font-display);color:var(--ink);text-wrap:pretty}
@container page (max-width:39.99rem){.sm-find__field{height:56px}.sm-find__field input{font-size:var(--fs-base)}.sm-find__keys{display:none}}
@container page (min-width:43.75rem){.sm-find__head h2{font-weight:var(--fw-large)}}
@container page (min-width:64rem){.sm-find__head{flex-direction:column;gap:var(--s-2);margin:0;padding-right:var(--s-6)}}
/* the editorial policy (kind 14): prose on the measure in the story's sections; each state's block as it appears */
.sm-policy h3{margin-top:var(--s-8);font:var(--fw-lg) var(--fs-lg)/1.2 var(--font-display);color:var(--ink)}
.sm-policy h3+p{margin-top:var(--s-3)}
.sm-policy__ex{margin:var(--s-5) 0 0}
.sm-policy__ex .sm-disclosure{margin-top:0}
.sm-policy .sm-cite{margin-top:var(--s-10)}
@container page (min-width:43.75rem){.sm-policy h3{font-weight:var(--fw-large)}}
/* manage (kind 15, private): six screens on the same tokens. The masthead carries Manage as its kicker, the hub's
   mark in its slot and the account; an episode's screens open on the episode as the kicker, the step as the H1,
   the participants and the steps. The AK pastels ground notices here only, their ink dark in both themes */
.sm-mg-brand{display:flex;align-items:center;gap:var(--s-4)}
.sm-mg-kicker{display:flex;align-items:center;gap:var(--s-4);font:var(--fw-medium) var(--fs-xs)/1 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink)}
.sm-mg-kicker::before{content:"";width:1px;height:28px;background:var(--rule)}
.sm-mg-account{font:var(--fw-medium) var(--fs-sm)/1 var(--font-body);color:var(--ink-2);white-space:nowrap}
.sm-mg{max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding:clamp(var(--s-7),calc(4 * var(--vw)),var(--s-9)) var(--pad) 0}
.sm-mg__head h1{margin-top:var(--s-5);font:var(--fw-large) var(--fs-2xl)/1.04 var(--font-display);letter-spacing:var(--track-tight);color:var(--ink);overflow-wrap:anywhere}
.sm-mg__head .sm-pair{margin-top:var(--s-6);max-width:var(--measure)}
.sm-mg__lede{margin-top:var(--s-4);max-width:60ch;font:var(--fw-regular) var(--fs-md)/1.55 var(--font-body);color:var(--ink-body)}
.sm-steps{display:flex;gap:var(--s-6);margin:var(--s-7) calc(-1 * var(--pad)) 0;padding:0 var(--pad);list-style:none;overflow-x:auto;scrollbar-width:none;border-bottom:var(--hairline)}
.sm-steps::-webkit-scrollbar{display:none}
.sm-steps li{position:relative;flex:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;font:var(--fw-medium) var(--fs-sm)/1 var(--font-body);color:var(--muted);white-space:nowrap}
.sm-steps li span{font:var(--fw-regular) 12px/1 var(--font-body);font-variant-numeric:tabular-nums}
.sm-steps li[data-done]{color:var(--ink-2)}
.sm-steps li[aria-current="step"]{color:var(--accent)}
.sm-steps li[aria-current="step"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:currentColor}
.sm-notice{margin-top:var(--s-7);max-width:var(--measure);padding:var(--s-4) var(--s-5);background:var(--ak-mist);color:var(--ak-ink);font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body)}
.sm-notice strong{font-weight:var(--fw-medium)}
.sm-notice--peach{background:var(--ak-peach)}
.sm-notice--blush{background:var(--ak-blush)}
.sm-mg-sec{margin-top:var(--s-9);padding-top:var(--s-5);border-top:1px solid var(--rule-strong)}
.sm-mg-sec__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--s-2) var(--s-4);margin-bottom:var(--s-5)}
.sm-mg-sec__head h2{font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink)}
.sm-mg-sec__head p{font:var(--fw-regular) var(--fs-sm)/1.3 var(--font-body);color:var(--muted);font-variant-numeric:tabular-nums}
.sm-mg-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3) var(--s-4);margin-top:var(--s-9);padding-top:var(--s-6);border-top:var(--hairline)}
.sm-tagbtn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:0 var(--s-3);border:var(--hairline);background:var(--ground);color:var(--ink);font:var(--fw-medium) 12px/1 var(--font-body);white-space:nowrap}
.sm-tagbtn:hover{border-color:var(--ink)}
.sm-tagbtn[aria-pressed="true"]{border-color:var(--ink);background:var(--ink);color:var(--ground)}
.sm-tile .sm-tagbtn{position:absolute;right:6px;bottom:6px;z-index:2}
.sm-tile:has(.sm-tagbtn[aria-pressed="false"]) .sm-tile__box>img{opacity:.42}
.sm-mg-rows{list-style:none;margin:0;padding:0;max-width:52rem}
.sm-mg-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-3) var(--s-4);align-items:center;padding-block:var(--s-4);border-top:var(--hairline)}
.sm-mg-row:first-child{border-top:0;padding-top:0}
.sm-mg-row--media{grid-template-columns:56px minmax(0,1fr) auto}
.sm-mg-row__thumb{width:56px;aspect-ratio:1;overflow:hidden;border-radius:var(--r-sm);background:var(--media)}
.sm-mg-row__thumb img{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-mg-row__t{font:var(--fw-regular) var(--fs-sm)/1.4 var(--font-body);color:var(--ink)}
.sm-mg-row__m{margin-top:2px;font:var(--fw-regular) 12.5px/1.4 var(--font-body);color:var(--muted)}
.sm-mg-row__ctl{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--s-2)}
.sm-mg-row:has(.sm-tagbtn[data-untag][aria-pressed="true"]) .sm-mg-row__t{color:var(--muted);text-decoration:line-through}
@container page (max-width:39.99rem){.sm-mg-row--media{grid-template-columns:56px minmax(0,1fr)}.sm-mg-row--media .sm-mg-row__ctl{grid-column:2;justify-content:flex-start}}
/* the episode list with its state track (from the retired manage dashboard; .sm-track is the order area's ladder now) */
.sm-mg-eps{list-style:none;margin:var(--s-8) 0 0;padding:0;border-top:1px solid var(--rule-strong)}
.sm-mg-ep{display:grid;grid-template-columns:7.5rem minmax(0,1fr);gap:var(--s-4) var(--s-5);align-items:start;padding-block:var(--s-6);border-bottom:var(--hairline)}
.sm-mg-ep__act{grid-column:2;justify-self:start}
.sm-track{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-4);margin:var(--s-4) 0 0;padding:0;list-style:none;font:var(--fw-regular) 12.5px/1.3 var(--font-body);color:var(--muted)}
.sm-track li{display:inline-flex;align-items:center;gap:6px}
.sm-track li::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;border:1px solid currentColor}
.sm-track li[data-done]{color:var(--ink-2)}
.sm-track li[data-done]::before{background:currentColor}
.sm-track li[aria-current="step"]{color:var(--ink);font-weight:var(--fw-medium)}
.sm-track li[aria-current="step"]::before{border-color:var(--accent);background:var(--accent)}
.sm-track .d{font-weight:var(--fw-regular);color:var(--muted)}
@container page (min-width:40rem){.sm-mg-ep{grid-template-columns:11rem minmax(0,1fr)}}
@container page (min-width:64rem){.sm-mg-ep{grid-template-columns:14rem minmax(0,1fr) auto;align-items:center;gap:var(--s-6)}.sm-mg-ep__act{grid-column:auto;justify-self:end}}
/* the preview: the plain record as it stands, under the preview banner, in a hairline window */
.sm-mg-preview{margin-top:var(--s-7);border:var(--hairline);overflow:hidden}
.sm-mg-preview>.sm-banner{position:static}
.sm-mg-preview .sm-article{padding-bottom:var(--s-8)}
/* pay: the order summary. The commission, then the promotion term as a choice, each with its fee token and
   never a digit, the chosen term marked; the note that Sourced.media confirms the payment; no add-ons */
.sm-order{margin-top:var(--s-8);max-width:var(--measure);border-top:1px solid var(--rule-strong)}
.sm-order__line{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-2) var(--s-5);align-items:baseline;padding-block:var(--s-5);border-bottom:var(--hairline)}
.sm-order__k{grid-column:1/-1;font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-order__what{font:var(--fw-regular) var(--fs-base)/1.45 var(--font-body);color:var(--ink)}
.sm-order__what small{display:block;margin-top:2px;font-size:12.5px;color:var(--muted)}
.sm-fee{font:var(--fw-medium) var(--fs-base)/1 var(--font-body);color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.sm-terms{grid-column:1/-1;display:grid;gap:var(--s-2);margin:0;padding:0;border:0;min-width:0}
.sm-term{display:grid;grid-template-columns:20px minmax(0,1fr) auto;align-items:center;gap:var(--s-3);min-height:56px;padding:var(--s-2) var(--s-4);border:var(--hairline);cursor:pointer}
.sm-term input{appearance:none;display:grid;place-items:center;width:18px;height:18px;margin:0;border:1px solid var(--ink-2);border-radius:50%;background:var(--ground)}
.sm-term input:checked{border-color:var(--ink);background:radial-gradient(circle,var(--ink) 0 4.5px,var(--ground) 5.5px)}
.sm-term:has(input:checked){border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.sm-term__n{font:var(--fw-regular) var(--fs-base)/1.3 var(--font-body);color:var(--ink)}
.sm-term__n small{display:block;margin-top:2px;font-size:12.5px;color:var(--muted)}
.sm-order__line--total .sm-order__what{font-weight:var(--fw-medium)}
/* release: the confirmation and the public link, with Copy link */
.sm-mg-link{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-3) var(--s-4);max-width:var(--measure);margin-top:var(--s-7);padding-block:var(--s-5);border-block:var(--hairline)}
.sm-mg-link a{font:var(--fw-lg) var(--fs-lg)/1.2 var(--font-display);color:var(--ink)}
@container page (min-width:43.75rem){.sm-mg-sec__head h2,.sm-mg-link a{font-weight:var(--fw-large)}}
/* the unreleased and preview banner (kind 16): the inverse panel below the masthead, sticky under it once it compacts */
.sm-masthead+.sm-banner{position:sticky;top:56px}

/* round seven (1 Oct 2026), the notes on the built pages. The Featured module features one promoted episode: the
   episode, its guest's organisation (or, where the guest has none, the show: its mark disc, its name, Hosted by) and
   its guest. The show's disc is the mark at its render size, inverted in dark like every mark, and never zooms */
.sm-featured .sm-card--entity .sm-card__mark{width:64px;height:64px;border-radius:50%;filter:var(--sm-mark-filter)}
.sm-featured .sm-card:hover .sm-card__mark{scale:none;transform:none}
@container page (min-width:64rem){.sm-featured .sm-card--entity .sm-card__mark{width:88px;height:88px}}
/* the disclosure's credit on a commissioned episode and its story: Edited by, the editor's name a chip */
.sm-edited{margin-top:var(--s-4);font:var(--fw-regular) var(--fs-sm)/1.6 var(--font-body);color:var(--ink-2)}
.sm-edited .sm-chip{color:var(--ink)}
/* Files, only on a commissioned episode whose buyer chose public downloads: one quiet re-use line */
.sm-files__head p.sm-files__reuse{color:var(--ink-2)}
.sm-files__reuse--page{margin-top:var(--s-3);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-2)}
/* From the episode: two cells, or three where the files are public */
.sm-from ul{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
/* a solo episode: the host and the show, no guest; the host reads from the left */
.sm-pair--solo{grid-template-columns:minmax(0,max-content) auto;justify-content:start;gap:var(--s-7)}
.sm-pair--solo .sm-party--host{grid-template-columns:auto minmax(0,1fr);text-align:left}
.sm-pair--solo .sm-party--host>.sm-party__face{order:0}
.sm-pair--solo .sm-party--host .sm-hovercard{left:0;right:auto}
@container page (max-width:39.99rem){.sm-pair--solo{grid-template-columns:minmax(0,1fr);gap:var(--s-4)}}
/* audio: the stack's Audio row (after Quote images) and the viewer's Audio tab. The listen card first, then one
   row per file: the play control, the title, the three-name anchor line, the duration. Rows, never tiles */
.sm-audio{display:grid;gap:var(--s-5);align-items:stretch}
.sm-auds{list-style:none;margin:0;padding:0;border-top:var(--hairline)}
.sm-aud{display:grid;grid-template-columns:44px minmax(0,1fr) auto;column-gap:var(--s-4);align-items:center;padding-block:var(--s-3);border-bottom:var(--hairline)}
.sm-aud__play{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:var(--ink);color:var(--ground);cursor:pointer;transition:background var(--dur-fast) var(--ease-standard)}
.sm-aud__play:hover{background:var(--accent)}
.sm-aud__play .sm-i{margin-left:2px}
.sm-aud__t{font:var(--fw-text) var(--fs-md)/1.25 var(--font-display);color:var(--ink);overflow-wrap:anywhere}
.sm-aud__t a{display:inline-block;padding-block:1px;margin-block:-1px}
.sm-aud[aria-current="true"] .sm-aud__t{color:var(--accent)}
.sm-aud__m{margin-top:2px;font:var(--fw-regular) 12.5px/1.45 var(--font-body);color:var(--muted)}
.sm-aud__m a{display:inline-block;padding-block:4px;margin-block:-4px}
.sm-aud__d{font:var(--fw-medium) 12px/1 var(--font-body);color:var(--ink-2);font-variant-numeric:tabular-nums}
@container page (min-width:40rem){.sm-audio{grid-template-columns:minmax(0,17rem) minmax(0,1fr);gap:var(--s-6)}.sm-audio>.sm-listen{min-height:100%}}
.sm-viewer__grid .sm-audio{margin-top:0}

/* round eight (1 Oct 2026): the pairing rule on the page. The trail is the BreadcrumbList in full, set small; the
   kicker under it carries the pair the H1 lacks (brief/ENTITY-NAMING.md, sections 3 and 5) */
.sm-crumbs{margin:0 0 var(--s-3);font:var(--fw-regular) 12px/1.5 var(--font-body);color:var(--ink-2)}
.sm-crumbs ol{display:flex;flex-wrap:wrap;align-items:baseline;margin:0;padding:0;list-style:none;overflow:visible /* round thirteen, item 1: the wrapping trail is no scroll container, so the links' 24px hit band (padding-block 4px, margin-block -4px) is never clipped */}
.sm-crumbs li{min-width:0;overflow-wrap:anywhere}
.sm-crumbs li+li::before{content:"/";padding:0 .45em;color:var(--muted)}
.sm-crumbs a{color:inherit;text-decoration:none;display:inline-block;padding-block:4px;margin-block:-4px}
.sm-crumbs a:hover{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.sm-crumbs [aria-current]{color:var(--ink)}
p.sm-kicker{margin:0}
/* the first sentence names everyone with their pair; its links are the non-branded ones, once per page */
.sm-profile__lede{margin-top:var(--s-4);max-width:40rem;font:var(--fw-regular) var(--fs-sm)/1.6 var(--font-body);color:var(--ink-2);text-wrap:pretty}
.sm-listing__lede{margin-top:var(--s-4);max-width:40rem;font:var(--fw-regular) var(--fs-base)/1.55 var(--font-body);color:var(--ink-2);text-wrap:pretty}
[data-first] a{color:inherit;text-decoration:underline;text-decoration-color:var(--rule-strong);text-decoration-thickness:1px;text-underline-offset:3px}
[data-first] a:hover{color:var(--accent);text-decoration-color:currentColor}
/* every tile carries its caption as text under the picture; two lines in a row, three in a viewer's grid */
.sm-tile__cap{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font:var(--fw-regular) 12.5px/1.4 var(--font-body);color:var(--ink);text-wrap:pretty}
.sm-grid .sm-tile__cap{-webkit-line-clamp:3}
.sm-tile:hover .sm-tile__cap{color:var(--accent)}
/* the short and the synopsis are video in the page: the tier's picture is the poster until play; until then the video is out
   of the tab order too (finding 22) */
.sm-player>.sm-player__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;visibility:hidden;background:#000}
.sm-player.is-playing>.sm-player__video{z-index:3;opacity:1;visibility:visible}
.sm-player.is-playing>picture,.sm-player.is-playing>.sm-player__play,.sm-player.is-playing>.sm-player__bar{visibility:hidden}
/* the full episode: the iframe is in the page, lazy; the facade covers it until pressed */
.sm-facade>.sm-facade__frame{position:absolute;inset:0;width:100%;height:100%;border:0}
.sm-facade.is-open>img,.sm-facade.is-open>.sm-facade__play,.sm-facade.is-open::after{display:none}
.sm-footer__links{display:flex;flex-direction:column;gap:var(--s-3)}

/* See all names its row and its entity, so it wraps: under the heading on a phone, beside it from 40rem */
.sm-seeall{flex:0 1 auto;min-width:0;line-height:1.35;text-wrap:pretty}
@container page (max-width:39.99rem){.sm-row__head{flex-direction:column;align-items:flex-start;gap:var(--s-2)}.sm-seeall{text-align:left}}
@container page (min-width:40rem){.sm-row__head .sm-seeall{max-width:24rem;text-align:right;justify-content:flex-end}}
@container page (min-width:64rem){.sm-row__head .sm-seeall{max-width:none;text-align:left;justify-content:flex-start}}

/* tap targets: every control at least 44px at a phone's width, by a hit area that leaves the layout as it is */
@container page (max-width:39.99rem){
  .sm-brand,.sm-hostmark,.sm-seeall,.sm-chip,.sm-party__n,.sm-back,.sm-moment,.sm-citebtn,.sm-record__claim a,.sm-promote,.sm-signature,button.sm-badge,.sm-cite .sm-btn{position:relative}
  .sm-brand::after,.sm-hostmark::after,.sm-seeall::after,.sm-chip::after,.sm-party__n::after,.sm-back::after,.sm-moment::after,.sm-citebtn::after,.sm-record__claim a::after,.sm-promote::after,.sm-signature::after,button.sm-badge::after,.sm-cite .sm-btn::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:max(100%,44px);translate:-50% -50%}
  .sm-pair__show{padding-block:14px;min-height:44px}
  /* round thirteen, item 4: a chip's 44px hit area reaches 10px above and below its 24px box, so wrapped chips sit 20px apart and the card's action sits 20px under the chips (the body's 16px gap plus 4px), and no hit area paints over another's */
  .sm-card__chips{row-gap:20px}
  .sm-card__chips+.sm-card__act{margin-top:4px}
}

/* round eight verification: the remaining small targets at a phone's width, and the selected search row's meta line */
@container page (max-width:39.99rem){
  .sm-source a,.sm-footer__nav a,.sm-footer__end a,.sm-or-now__x a,.sm-cm-link a,.sm-ck-link a,.sm-panel__nav a{position:relative;display:inline-flex;align-items:center;min-height:44px}
  .sm-check{min-height:44px;align-items:center}
}
.sm-item[aria-selected="true"] .sm-item__m{color:var(--ink-2)}

/* with script off: the facade and the players stand aside, so the iframe and the video are used directly */
html:not(.js) .sm-facade>img,html:not(.js) .sm-facade>.sm-facade__play,html:not(.js) .sm-facade::after{display:none}
html:not(.js) .sm-player>picture,html:not(.js) .sm-player>.sm-player__play,html:not(.js) .sm-player>.sm-player__bar{display:none}
html:not(.js) .sm-player>.sm-player__video{position:static;opacity:1;visibility:visible}

/* consent: the bottom sheet and its settings panel are css/consent.css (round eleven) */
a.sm-search{text-decoration:none;color:inherit}

/* the privacy page's cookie table */
.sm-cookies{width:100%;border-collapse:collapse;font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink-body)}
.sm-cookies th,.sm-cookies td{padding:var(--s-3) var(--s-4) var(--s-3) 0;text-align:left;vertical-align:top;border-top:var(--hairline)}
.sm-cookies thead th{border-top:0;padding-top:0;font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink-2)}
.sm-cookies tbody th{font-weight:var(--fw-medium);color:var(--ink)}
.sm-cookies__go{margin-top:var(--s-5)}
@container page (max-width:39.99rem){.sm-cookies,.sm-cookies tbody,.sm-cookies tr,.sm-cookies th,.sm-cookies td{display:block}.sm-cookies thead{display:none}.sm-cookies tr{padding-block:var(--s-4);border-top:var(--hairline)}.sm-cookies th,.sm-cookies td{padding:0;border:0}.sm-cookies td{margin-top:var(--s-2)}.sm-cookies td[data-col]::before{content:attr(data-col) ": ";font-weight:var(--fw-medium);color:var(--ink)}}
/* two guests: both guests in the participants card's first column */
.sm-pair__guests{display:grid;gap:var(--s-5);align-content:start}
/* the record's last-verified date (round eleven, item 7): one quiet line under the rows, the date as a time element;
   the renderer leaves the line out when no date is recorded, and an empty one draws nothing */
.sm-record__verified{margin-top:var(--s-5);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--muted)}
.sm-record__verified:has(time:empty){display:none}
@container page (min-width:64rem){.sm-record>.sm-record__verified{grid-column:2}}
/* Claim this page (round twelve): one quiet link under the record, to /promote/ with the page carried and Claim preselected;
   a claimed page draws none */
.sm-record__claim{margin-top:var(--s-3);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body)}
.sm-record__claim a{color:var(--ink-2);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:3px}
.sm-record__claim a:hover{color:var(--accent);text-decoration-color:currentColor}
@container page (min-width:64rem){.sm-record>.sm-record__claim{grid-column:2}}
/* Available for (round eleven, item 8): the engagements the person says they are open to, in their own words as a short
   list, marked Self-stated until confirmed; the full width of the record, never a rank and never a topic */
.sm-record dl>.sm-record__avail{grid-column:1/-1}
.sm-avail{display:inline;margin:0;padding:0;list-style:none}
.sm-avail li{display:inline}
.sm-avail li+li::before{content:", "}

/* round twelve, part two (7 October 2026): the findings of 4 October */
/* the 404's links list stands clear of the search field (finding 41) */
.sm-404__links{margin-top:var(--s-6)}
/* targets under 24px that are not inline in a sentence reach 24px by padding that a negative margin takes back, so nothing moves (finding 58) */
a.sm-onsite__n{display:inline-block;padding-block:2px;margin-block:-2px}
.sm-onsite__one{display:inline-block;padding-block:3px;margin-block:-3px}
.sm-record dd>a:not(.sm-chip){display:inline-block;padding-block:1px;margin-block:-1px}
.sm-edited .sm-chip{display:inline-block;padding-block:2px;margin-block:-2px}
/* a coloured mark keeps its colours in dark mode: the registry marks it data-mark="colour" and the invert filter stands aside (finding 40) */
img[data-mark="colour"]{--sm-mark-filter:none /* @kind other */}
/* a show's mark in a record chip inverts like every mark (finding 86) */
.sm-record .sm-chip>img.is-mark{filter:var(--sm-mark-filter)}
/* the Shape pill at 320 (finding 57) */
@container page (max-width:22rem){.sm-shapes button{padding:0 var(--s-2)}}
/* the topic page's People row: the pair under the name, the count as a second small line (finding 3) */
.sm-person small+small{margin-top:calc(2px - var(--s-2))}
/* round 14a (ruling Q49): the hover card's View profile is a real link to the chip's own page. A transparent bridge spans the
   8px between the chip and the card, so the pointer reaches the card before it closes; the link keeps the accent and the caps,
   with a 25px hit band that leaves the card's height as it was */
.sm-hovercard::before{content:"";position:absolute;left:-1px;right:-1px;bottom:100%;height:10px}
.sm-hovercard .c a{display:inline-block;padding-block:7px;margin-block:-7px;color:var(--accent);text-decoration:none}
.sm-hovercard .c a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
/* round 14a (rulings Q39 to Q42): the episode page's tail, on episode pages only. Assets (the media rows), More on Sourced.media,
   Stories and insights (Articles and Insights), each a section with its h2 and its rows at h3 on the stack's ledger; then, where
   the Downloads page exists, Downloads from the episode, one row whose heading is the link */
.sm-dlfoot{margin-top:var(--s-10)}
.sm-dlfoot h2{text-wrap:balance}.sm-dlfoot h2 a{color:var(--ink);text-decoration:none}
.sm-dlfoot h2 a:hover{color:var(--accent)}
.sm-dlfoot h2 .sm-i{display:inline-block;width:20px;height:20px;margin-left:var(--s-2);vertical-align:-2px;transition:translate var(--dur-fast) var(--ease-standard)}
.sm-dlfoot h2 a:hover .sm-i{translate:3px 0}
.sm-dlfoot__m{margin:0;font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--muted)}
/* round 14a (ruling Q43): a story's sections and the Downloads page's folders are the rail's targets, so a jump lands under the masthead */
.sm-sec[id],.sm-takeaways[id],.sm-dfolder[id]{scroll-margin-top:80px}

/* round 14b (10 October 2026), brief/ROUND-14B.md: the visual round */
/* item 1: the show page's strip, the person page's grammar above the head with the show's own stills (each covered
   episode's guest and the host's still from it, newest first); the head stays as drawn under it */
.sm-showhero:has(>.sm-stills){padding-top:var(--s-5)}
.sm-showhero>.sm-stills{margin-bottom:clamp(var(--s-6),calc(3 * var(--vw)),var(--s-8))}
/* item 3: the show page's tail panel, the newest covered episode, organic: from 64rem a 1:1 panel of up to 28rem
   beside the disclosure, the cite line and the host line, top-aligned with the disclosure; below 64rem a band under them */
.sm-sect--tail>.sm-pnl{max-width:none;margin-top:var(--s-8)}
@container page (min-width:64rem){
.sm-sect--tail:has(>.sm-pnl){display:grid;grid-template-columns:minmax(0,var(--measure)) minmax(0,28rem);grid-template-rows:auto auto auto 1fr;justify-content:space-between;column-gap:var(--s-9);align-items:start}
.sm-sect--tail:has(>.sm-pnl)>:not(.sm-pnl){grid-column:1}
.sm-sect--tail>.sm-pnl{grid-column:2;grid-row:1/-1;margin-top:0}
}
/* item 10 (a): the insight page's margin panel, the speaker's own still, sticky in the right margin from 64rem and
   level with the head (the left margin stays free); nothing new below 64rem */
.sm-insight>.sm-margin{display:none}
@container page (min-width:64rem){
.sm-insight>.sm-margin{display:block;position:absolute;grid-column:measure-end/shell-end;grid-row:1/auto;inset:0 0 0 var(--s-8);margin:0;z-index:0}
.sm-margin__in{position:sticky;top:calc(56px + var(--s-7));padding-top:var(--s-8)}
}
/* item 10 (b): the insight cards of the feeds: the speaker's headshot grown from the chip to a 1:1 thumbnail above the
   question; the chip keeps the name. The /insights/ index rows: the same thumbnail as the row's picture */
.sm-card__thumb{display:block;width:88px;aspect-ratio:1/1;overflow:hidden;border-radius:var(--r-sm);background:var(--media)}
.sm-card__thumb img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,46%);transition:scale var(--dur-slow) var(--ease-out-soft)}
.sm-card--insight:hover .sm-card__thumb img{scale:1.03}
.sm-item__media--thumb{width:56px;aspect-ratio:1/1;border-radius:var(--r-sm)}
.sm-item:has(.sm-item__media--thumb){grid-template-columns:56px minmax(0,1fr);align-items:start}
@container page (min-width:40rem){.sm-item__media--thumb{width:72px}.sm-item:has(.sm-item__media--thumb){grid-template-columns:72px minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.sm-card__thumb img{transition:none}.sm-card--insight:hover .sm-card__thumb img{scale:none}}

/* css/commerce.css */
/* commerce (round seven, kinds 17 to 21): the commission page, then the private screens (checkout, the show panel,
   the order area, the editorial queue). The same tokens, hairlines and square corners as the wiki; the ledger's 14rem
   head column from 64rem; fees are tokens, never digits. Nothing here reads as a marketplace */

/* ---------- 17 the commission page, a landing page (round eight): it speaks to the guest and their organisation first;
   the benefits read in seconds, each opens its detail in place, and the button is never far ---------- */
.sm-cm{max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding:clamp(var(--s-7),calc(4 * var(--vw)),var(--s-9)) var(--pad) 0}
.sm-cm-hero{display:grid;gap:var(--s-7);align-items:end;padding-bottom:var(--s-8);border-bottom:1px solid var(--rule-strong)}
.sm-cm-hero h1{margin-top:var(--s-5);max-width:16ch;font:var(--fw-large) var(--fs-3xl)/1.02 var(--font-display);letter-spacing:var(--track-tight);color:var(--ink);text-wrap:balance}
.sm-cm-hero--carried h1{max-width:18ch;font-size:var(--fs-2xl);line-height:1.05}
.sm-cm-hero .sm-dek{margin-top:var(--s-5);max-width:34em;text-wrap:pretty}
.sm-cm-go{margin-top:var(--s-7)}
.sm-card--carry{grid-template-columns:minmax(0,1fr);padding-top:var(--s-5);border-top:var(--hairline);max-width:52rem}
.sm-card--carry .sm-card__media{aspect-ratio:16/9;overflow:hidden;border-radius:var(--r-xs)}
.sm-card--carry .sm-card__t{font-size:var(--fs-lg)}
.sm-card--carry .sm-card__t a{color:inherit;text-decoration:none}
.sm-cm-rows{margin-top:var(--s-10);border-top:1px solid var(--rule-strong)}
.sm-cm-row{padding-block:var(--s-7);border-bottom:var(--hairline)}
.sm-cm-row>h2{margin-bottom:var(--s-5);font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink)}
.sm-cm-p{max-width:40rem;font:var(--fw-regular) var(--fs-md)/1.55 var(--font-body);color:var(--ink-body);text-wrap:pretty}
.sm-cm-steps{list-style:none;margin:0;padding:0}
.sm-cm-steps li{display:grid;grid-template-columns:2rem minmax(0,1fr);gap:var(--s-1) var(--s-3);align-items:baseline;padding-block:var(--s-4);border-top:var(--hairline)}
.sm-cm-steps li:first-child{padding-top:0;border-top:0}
.sm-cm-steps .n{font:var(--fw-regular) 12px/1 var(--font-body);color:var(--muted);font-variant-numeric:tabular-nums}
.sm-cm-steps b{font:var(--fw-text) var(--fs-md)/1.25 var(--font-display);color:var(--ink)}
.sm-cm-steps .x{grid-column:2;font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink-body)}
.sm-cm-prices{max-width:40rem}
.sm-cm-price{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-5);align-items:baseline;padding-block:var(--s-4);border-top:var(--hairline)}
.sm-cm-price:first-child{padding-top:0;border-top:0}
.sm-cm-price__n{font:var(--fw-regular) var(--fs-md)/1.35 var(--font-body);color:var(--ink)}
.sm-cm-price__n small{display:block;margin-top:2px;font-size:12.5px;color:var(--muted)}
.sm-cm-const{max-width:40rem;padding:var(--s-5) var(--s-6);background:var(--panel);font:var(--fw-regular) var(--fs-sm)/1.6 var(--font-body);color:var(--ink-2)}
.sm-cm-link{margin-top:var(--s-4);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body)}
/* from 40rem (round ten: these three had lost their query and squeezed the rows on a phone) */
@container page (min-width:40rem){.sm-card--carry{grid-template-columns:15rem minmax(0,1fr);align-items:center;gap:var(--s-6)}.sm-cm-row{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:start}.sm-cm-row>h2{margin:0;padding-right:var(--s-6)}}
.sm-cm-hero__card .sm-card--carry{grid-template-columns:minmax(0,1fr);max-width:none;padding-top:0;border-top:0}
.sm-cm-bens{padding-top:var(--s-8)}
.sm-bens{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);column-gap:var(--s-7);align-items:start}
.sm-ben{padding:var(--s-6) 0;border-top:var(--hairline)}
.sm-ben h3{font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink);text-wrap:balance}
.sm-ben__k{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:baseline;margin-bottom:var(--s-2);font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink-2)}
.sm-ben__k .sm-fee{letter-spacing:0;text-transform:none}
.sm-ben__x{margin-top:var(--s-3);font:var(--fw-regular) var(--fs-base)/1.55 var(--font-body);color:var(--ink-body);text-wrap:pretty}
.sm-more{margin-top:var(--s-3)}
.sm-more summary{display:inline-flex;align-items:center;gap:var(--s-2);min-height:44px;cursor:pointer;list-style:none;font:var(--fw-medium) var(--fs-sm)/1 var(--font-body);color:var(--ink)}
.sm-more summary::-webkit-details-marker{display:none}
.sm-more summary:hover{color:var(--accent)}
.sm-more__i{position:relative;flex:none;width:18px;height:18px;border:1px solid var(--rule-strong);border-radius:50%}
.sm-more__i::before,.sm-more__i::after{content:"";position:absolute;left:50%;top:50%;width:8px;height:1px;background:currentColor;translate:-50% -50%}
.sm-more__i::after{rotate:90deg;transition:rotate var(--dur-fast) var(--ease-standard)}
.sm-more[open] .sm-more__i::after{rotate:0deg}
.sm-more__b{padding-top:var(--s-1);max-width:34rem;font:var(--fw-regular) var(--fs-sm)/1.6 var(--font-body);color:var(--ink-2);text-wrap:pretty}
.sm-outlets__l{margin-top:var(--s-5);font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink-2)}
.sm-outlets{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-5);margin:var(--s-3) 0 0;padding:0;list-style:none}
.sm-outlet{display:inline-flex;align-items:center;gap:var(--s-2);font:var(--fw-regular) var(--fs-sm)/1.3 var(--font-body);color:var(--ink);white-space:nowrap}
.sm-outlet__logo{flex:none;width:auto;height:20px;filter:var(--sm-mark-filter)}
.sm-cm-show{margin-top:var(--s-8);padding:var(--s-5) 0;border-block:var(--hairline);font:var(--fw-regular) var(--fs-base)/1.55 var(--font-body);color:var(--ink);text-wrap:pretty}
.sm-cm-show a{margin-left:var(--s-2);color:var(--ink-2);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:3px}
.sm-cm-show a:hover{color:var(--accent)}
.sm-cm-rows{margin-top:var(--s-9);border-top:1px solid var(--rule-strong)}
.sm-cm-go--row{margin-top:var(--s-6)}
.sm-cm-bar{position:fixed;left:0;right:0;bottom:0;z-index:45;background:color-mix(in srgb,var(--ground) 94%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:var(--hairline)}
.sm-cm-bar[hidden]{display:none}
.sm-cm-bar__in{max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding:var(--s-3) var(--pad);display:flex;align-items:center;justify-content:space-between;gap:var(--s-5)}
.sm-cm-bar__t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:var(--fw-text) var(--fs-base)/1.2 var(--font-display);color:var(--ink)}
@container page (max-width:39.99rem){.sm-cm-bar__t{display:none}.sm-cm-bar .sm-btn{flex:1;justify-content:center}}
@container page (min-width:40rem){.sm-bens{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container page (min-width:64rem){
  .sm-cm-hero h1{font-weight:var(--fw-thin)}
  .sm-cm-hero--carried{grid-template-columns:minmax(0,1fr) minmax(0,24rem)}
  .sm-bens{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sm-cm-row{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:start}
  .sm-cm-row>h2{margin:0;padding-right:var(--s-6)}
  .sm-cm-bar{top:56px;bottom:auto;border-top:0;border-bottom:var(--hairline)}
}
/* ---------- the private screens: shared parts (fields, ticks, switches, the wide thumbnail) ---------- */
.sm-mg-sec .sm-mg-sec__head h2{font-size:var(--fs-md)}
.sm-field{display:grid;gap:var(--s-2);max-width:32rem}
.sm-field__l{font:var(--fw-medium) 12px/1.3 var(--font-body);color:var(--ink)}
.sm-field input,.sm-field select,.sm-field textarea{width:100%;min-height:44px;padding:0 var(--s-4);border:1px solid var(--rule-strong);border-radius:0;background:var(--ground);color:var(--ink);font:var(--fw-regular) var(--fs-base)/1.4 var(--font-body)}
.sm-field textarea{min-height:6rem;padding-block:var(--s-3);resize:vertical}
.sm-field input::placeholder,.sm-field textarea::placeholder{color:var(--muted)}
.sm-field input:focus,.sm-field select:focus,.sm-field textarea:focus{outline:2px solid var(--focus);outline-offset:1px}
.sm-field__note{font:var(--fw-regular) 12.5px/1.45 var(--font-body);color:var(--muted)}
.sm-check{display:grid;grid-template-columns:20px minmax(0,1fr);gap:var(--s-3);align-items:start;padding-block:var(--s-2);cursor:pointer;max-width:44rem}
.sm-check input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--ink)}
.sm-check__l{font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink)}
.sm-check__l small{display:block;margin-top:2px;font-size:12.5px;color:var(--muted)}
.sm-switch{display:grid;gap:var(--s-2)}
.sm-switch__b{display:inline-flex;align-items:center;gap:var(--s-3);justify-self:start;min-height:44px;padding:0;border:0;background:transparent;color:var(--ink);font:var(--fw-medium) var(--fs-sm)/1.3 var(--font-body);text-align:left}
.sm-switch__t{position:relative;flex:none;width:40px;height:22px;border:1px solid var(--rule-strong);border-radius:var(--r-pill);background:var(--ground);transition:background var(--dur-fast) var(--ease-standard)}
.sm-switch__t::after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:var(--ink-2);transition:transform var(--dur-fast) var(--ease-standard)}
.sm-switch__b[aria-checked="true"] .sm-switch__t{background:var(--ink);border-color:var(--ink)}
.sm-switch__b[aria-checked="true"] .sm-switch__t::after{transform:translateX(18px);background:var(--ground)}
.sm-switch__note{font:var(--fw-regular) 12.5px/1.45 var(--font-body);color:var(--muted)}
.sm-mg-row__thumb--wide{position:relative;display:block;width:96px;aspect-ratio:16/9;overflow:hidden;border-radius:var(--r-xs);background:var(--media)}
.sm-mg-row__thumb--wide img{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-mg-row__thumb--wide .sm-dip{display:grid;grid-template-columns:1fr 1fr;gap:2px;height:100%;background:var(--ground)}
.sm-mg-row__thumb--wide .sm-dip img{min-width:0}
.sm-mg-row--media:has(.sm-mg-row__thumb--wide){grid-template-columns:96px minmax(0,1fr) auto}
.sm-tag--state{display:inline-flex;align-items:center;gap:6px;min-height:24px;padding:0 var(--s-2);border:var(--hairline);font:var(--fw-medium) 11px/1 var(--font-body);color:var(--ink-2);white-space:nowrap}
.sm-tag--state::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.sm-tag--state[data-s="hold"]{color:var(--ink);border-color:var(--ink)}
/* ---------- 18 checkout ---------- */
.sm-ck .sm-steps{margin-top:var(--s-6)}
.sm-ck-carry{display:grid;grid-template-columns:96px minmax(0,1fr);gap:var(--s-4);align-items:center;margin-top:var(--s-6);max-width:var(--measure)}
.sm-ck-carry p{font:var(--fw-text) var(--fs-md)/1.3 var(--font-display);color:var(--ink)}
.sm-ck-carry__k{display:block;margin-bottom:4px;font:var(--fw-medium) 10.5px/1.3 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-ck-carry small{display:block;margin-top:4px;font:var(--fw-regular) 12.5px/1.4 var(--font-body);color:var(--muted)}
.sm-ck-form{max-width:var(--measure)}
.sm-ck-form>.sm-field{margin-top:var(--s-8)}
.sm-ck-note{margin-top:var(--s-4);max-width:40rem;font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink-2)}
.sm-ck-show{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:var(--s-4);align-items:center}
.sm-ck-show img{width:56px;height:56px;border-radius:50%;filter:var(--sm-mark-filter)}
.sm-ck-show p{font:var(--fw-text) var(--fs-md)/1.3 var(--font-display);color:var(--ink)}
.sm-ck-show small{display:block;margin-top:2px;font:var(--fw-regular) 12.5px/1.4 var(--font-body);color:var(--muted)}
.sm-ck-fixed,.sm-ck-applied{display:inline-flex;align-items:center;gap:6px;font:var(--fw-medium) 12px/1 var(--font-body);color:var(--ink-2);white-space:nowrap}
.sm-mg-row.sm-ck-ep{grid-template-columns:minmax(0,1fr)}
.sm-ck-ep__l .sm-mg-row__t,.sm-ck-ep__l .sm-mg-row__m{display:block}
.sm-ck-ep__l{display:grid;grid-template-columns:20px 96px minmax(0,1fr);gap:var(--s-4);align-items:center;cursor:pointer}
.sm-ck-ep__l input{width:18px;height:18px;margin:0;accent-color:var(--ink)}
.sm-ck-ep[data-off] .sm-ck-ep__l{cursor:default}
.sm-ck-ep[data-off] .sm-mg-row__thumb--wide,.sm-ck-ep[data-off] .sm-mg-row__t{opacity:.5}
.sm-ck-choice{border:0;margin:0;padding:0;display:grid}
.sm-ck-code{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--s-3) var(--s-5)}
.sm-ck-code .sm-field{flex:0 1 20rem}
.sm-ck-applied{min-height:44px}
.sm-ck-addon{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-5);align-items:start}
.sm-ck-addon .sm-fee{padding-top:var(--s-2)}
.sm-ck-state{margin-top:var(--s-3);margin-left:32px;max-width:40rem;padding:var(--s-4) var(--s-5);background:var(--panel);font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink-2)}
.sm-order--flat{margin-top:0;border-top:0}
.sm-order--flat .sm-order__line:first-child{padding-top:0}
.sm-cardel{display:grid;gap:var(--s-4);max-width:32rem;padding:var(--s-5);border:var(--hairline);background:var(--card)}
.sm-cardel__two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-4)}
.sm-cardel__by{display:flex;align-items:center;gap:6px;font:var(--fw-regular) 12px/1.4 var(--font-body);color:var(--muted)}
.sm-ck-terms{margin:0;padding:0;list-style:none;max-width:40rem;font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink)}
.sm-ck-terms li{padding-block:var(--s-2);border-top:var(--hairline)}
.sm-ck-terms li:first-child{border-top:0;padding-top:0}
.sm-ck-ticks{display:grid;gap:var(--s-2);margin-top:var(--s-6)}
.sm-ck-link{margin-top:var(--s-4);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body)}
.sm-ck-next{margin:var(--s-8) 0 0;padding:0;list-style:none;max-width:var(--measure);border-top:1px solid var(--rule-strong)}
.sm-ck-next li{display:grid;grid-template-columns:2rem minmax(0,1fr);gap:var(--s-3);padding-block:var(--s-5);border-bottom:var(--hairline);font:var(--fw-regular) var(--fs-md)/1.55 var(--font-body);color:var(--ink-body)}
.sm-ck-next .n{font:var(--fw-regular) 12px/2.1 var(--font-body);color:var(--muted);font-variant-numeric:tabular-nums}
@container page (max-width:39.99rem){.sm-ck-show{grid-template-columns:48px minmax(0,1fr)}.sm-ck-show img{width:48px;height:48px}.sm-ck-fixed{grid-column:2}.sm-ck-ep__l{grid-template-columns:20px 72px minmax(0,1fr);gap:var(--s-3)}.sm-ck-ep__l .sm-mg-row__thumb--wide{width:72px}.sm-ck-carry{grid-template-columns:72px minmax(0,1fr)}.sm-ck-carry .sm-mg-row__thumb--wide{width:72px}.sm-ck-addon{grid-template-columns:minmax(0,1fr)}.sm-ck-addon .sm-fee{padding:0 0 0 32px}.sm-ck-state{margin-left:0}}
@container page (min-width:40rem){.sm-outlet{flex:1 1 0;min-width:0;max-width:none}}

/* ---------- 19 to 21: the order area, the show panel, the editorial queue ---------- */
.sm-btn--sm{min-height:36px;padding:0 var(--s-3);font-size:12px}
.sm-mg-actions--tight{margin-top:var(--s-5);padding-top:0;border-top:0}
.sm-ladder{margin-top:var(--s-6);max-width:var(--shell)}
.sm-order-meta{font-size:var(--fs-sm);color:var(--muted)}
.sm-or-intro{margin-top:var(--s-8);max-width:var(--measure);font:var(--fw-regular) var(--fs-md)/1.55 var(--font-body);color:var(--ink-body)}
.sm-mg-dl{display:grid;gap:0;max-width:40rem;margin:0}
.sm-mg-dl>div{display:grid;grid-template-columns:11rem minmax(0,1fr);gap:var(--s-4);padding-block:var(--s-3);border-top:var(--hairline)}
.sm-mg-dl>div:first-child{border-top:0;padding-top:0}
.sm-mg-dl dt{font:var(--fw-medium) 12px/1.5 var(--font-body);color:var(--ink-2)}
.sm-mg-dl dd{margin:0;font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink)}
.sm-mg-dl dd small{display:block;color:var(--muted);font-size:12.5px}
/* keep or leave: one control per row, the receipt's style (a disc and a word) */
.sm-keep{display:inline-flex;align-items:center;gap:var(--s-2);min-height:44px;padding:0 var(--s-2) 0 0;border:0;background:transparent;color:var(--ink);font:var(--fw-medium) var(--fs-sm)/1 var(--font-body);white-space:nowrap}
.sm-keep .c{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--ground);transition:background var(--dur-fast) var(--ease-standard)}
.sm-keep[aria-pressed="false"]{color:var(--ink-2)}
.sm-keep[aria-pressed="false"] .c{background:transparent;border:1px solid var(--rule-strong);color:var(--ink-2)}
.sm-keep:hover .c{background:var(--accent);border-color:var(--accent);color:var(--ground)}
.sm-choose{grid-template-columns:56px minmax(0,1fr) auto;align-items:start}
.sm-choose--text{grid-template-columns:minmax(0,1fr) auto}
.sm-choose .sm-keep{margin-top:-8px}
.sm-choose.is-out .sm-mg-row__thumb,.sm-choose.is-out .sm-mg-row__t{opacity:.5}
.sm-choose__b{display:grid;gap:2px;min-width:0}
.sm-note{display:block;margin-top:var(--s-3);max-width:28rem}
.sm-note input{width:100%;min-height:36px;padding:0 var(--s-3);border:var(--hairline);border-radius:0;background:var(--ground);color:var(--ink);font:var(--fw-regular) 12.5px/1.4 var(--font-body)}
.sm-note input::placeholder{color:var(--muted)}
.sm-mg-row__thumb--page{display:grid;place-items:center;background:var(--panel);color:var(--ink-2)}
/* the assets: two sets in the files layout, present from the moment production lands */
.sm-assets__line{margin-bottom:var(--s-4);max-width:40rem;font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-2)}
.sm-tabs--sets{margin-bottom:var(--s-4)}
.sm-assets .sm-filelist{margin-top:0}
.sm-review{display:grid;gap:var(--s-5)}
.sm-review__c{display:grid;align-content:start;gap:var(--s-4);padding:var(--s-6);border:var(--hairline);background:var(--card)}
.sm-review__c h3{font:var(--fw-text) var(--fs-md)/1.25 var(--font-display);color:var(--ink)}
.sm-review__c p{font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink-body)}
.sm-review__c .sm-btn{justify-self:start}
.sm-datef{position:relative;display:block}
.sm-datef .sm-i{position:absolute;left:var(--s-4);top:50%;translate:0 -50%;color:var(--ink-2)}
.sm-datef input{padding-left:calc(var(--s-4) + 24px)}
.sm-golive{margin-top:var(--s-7);max-width:var(--measure)}
.sm-quiet{margin-top:var(--s-4);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--muted)}
.sm-or-pair{display:grid;gap:0}
.sm-press__draft{padding:var(--s-5);border:var(--hairline);background:var(--card);font:var(--fw-regular) var(--fs-sm)/1.6 var(--font-body);color:var(--ink-body)}
.sm-press__draft .sm-caps{margin-bottom:var(--s-2)}
.sm-press__k{margin-top:var(--s-6);margin-bottom:var(--s-3);font:var(--fw-medium) 12px/1.3 var(--font-body);color:var(--ink)}
.sm-links{list-style:none;margin:0 0 var(--s-5);padding:0;border-top:var(--hairline)}
.sm-link{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);min-height:44px;border-bottom:var(--hairline);font:var(--fw-regular) var(--fs-sm)/1.4 var(--font-body);color:var(--ink)}
.sm-link>span:first-child{display:inline-flex;align-items:center;gap:var(--s-2)}
.sm-press__when{margin-top:var(--s-5);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-2)}
.sm-msgs{list-style:none;margin:0;padding:0;max-width:var(--measure)}
.sm-msg{padding-block:var(--s-4);border-top:var(--hairline)}
.sm-msg:first-child{border-top:0;padding-top:0}
.sm-msg__w{display:flex;flex-wrap:wrap;gap:var(--s-2);font:var(--fw-regular) 12.5px/1.4 var(--font-body);color:var(--muted)}
.sm-msg__w b{font-weight:var(--fw-medium);color:var(--ink)}
.sm-msg__t{margin-top:var(--s-1);font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink-body)}
.sm-compose{margin-top:var(--s-5);max-width:var(--measure)}
.sm-compose .sm-field{max-width:none}
.sm-compose__end{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);margin-top:var(--s-3)}
/* the show panel */
.sm-panel__nav a{position:relative;flex:none;display:inline-flex;align-items:center;min-height:44px;font:var(--fw-medium) var(--fs-sm)/1 var(--font-body);color:var(--ink-2);text-decoration:none;white-space:nowrap}
.sm-panel__nav a:hover{color:var(--ink)}
.sm-qs{list-style:none;margin:var(--s-6) 0 0;padding:0}
.sm-q{display:grid;gap:var(--s-4);padding-block:var(--s-6);border-top:var(--hairline)}
.sm-q__ep{display:grid;grid-template-columns:96px minmax(0,1fr);gap:var(--s-4);align-items:center}
.sm-q__ep small{display:block;margin-top:2px;font-size:12.5px;color:var(--muted)}
.sm-q__dl{max-width:44rem}
.sm-q__words{margin-right:var(--s-3)}
.sm-q__ctl{display:inline-flex;gap:var(--s-2);vertical-align:middle}
.sm-q__act{display:flex;flex-wrap:wrap;gap:var(--s-3)}
.sm-codes{display:grid;gap:var(--s-5);max-width:44rem}
.sm-codes__pct{border:0;margin:0;padding:0;display:grid;gap:var(--s-2)}
.sm-codes__pct .sm-seg{flex-wrap:wrap;justify-self:start}
.sm-codes__cap{padding:var(--s-4) var(--s-5);background:var(--panel);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink)}
.sm-codes__list{margin-top:var(--s-6)}
.sm-brandpack{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(10rem,1fr));gap:var(--s-5)}
.sm-brandpack li{display:grid;gap:var(--s-2);justify-items:start}
.sm-brandpack li p{font:var(--fw-regular) var(--fs-sm)/1.4 var(--font-body);color:var(--ink)}
.sm-brandpack__p{display:grid;place-items:center;width:100%;aspect-ratio:4/3;border:var(--hairline);background:#FFFFFF}
.sm-brandpack__p img{border-radius:50%}
.sm-brandpack__p--dark{background:#111111}
.sm-brandpack__p--dark img.inv{filter:invert(1)}
.sm-brandpack__p--empty{background:var(--ground);border-style:dashed;color:var(--muted)}
.sm-brandpack__p--marks{grid-auto-flow:column;gap:var(--s-4);align-items:center;justify-content:center}
.sm-brandpack__p--sw{background:var(--ground);grid-auto-flow:column;gap:var(--s-2);padding:var(--s-3)}
.sm-brandpack__p--sw i{display:grid;place-items:end start;width:100%;height:100%;padding:4px;border:var(--hairline);font:var(--fw-regular) 9.5px/1.2 var(--font-body);font-style:normal;color:var(--muted);overflow:hidden}
.sm-rel{grid-template-columns:96px minmax(0,1fr) auto;align-items:start}
.sm-check--inline{padding-block:var(--s-1) 0}
.sm-rels__send{display:grid;gap:var(--s-2);margin-top:var(--s-6)}
.sm-st{width:100%;max-width:44rem;border-collapse:collapse;font:var(--fw-regular) var(--fs-sm)/1.45 var(--font-body);color:var(--ink)}
.sm-st th,.sm-st td{padding:var(--s-3) var(--s-4) var(--s-3) 0;text-align:left;border-top:var(--hairline);font-variant-numeric:tabular-nums}
.sm-st thead th{padding-top:0;border-top:0;font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink-2)}
.sm-st tbody th{font:var(--fw-medium) 12px/1.5 var(--font-body);color:var(--ink-2);width:11rem}
.sm-led tbody tr:first-child>*{border-top:0;padding-top:0}
.sm-panel__h3{margin-top:var(--s-7);margin-bottom:var(--s-4);font:var(--fw-text) var(--fs-md)/1.25 var(--font-display);color:var(--ink)}
/* the editorial queue */
.sm-eq__list .sm-mg-row[aria-current="true"] .sm-mg-row__t{color:var(--accent)}
.sm-eq__open{margin-top:var(--s-9);padding-top:var(--s-6);border-top:1px solid var(--rule-strong)}
.sm-eq__open>.sm-caps{color:var(--ink)}
.sm-eq__note{margin-top:var(--s-3);padding:var(--s-3) var(--s-4);background:var(--panel);font:var(--fw-regular) 12.5px/1.5 var(--font-body);color:var(--ink-body)}
.sm-eq__note b{display:block;font-weight:var(--fw-medium);color:var(--ink)}
@container page (min-width:40rem){.sm-review{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@container page (min-width:64rem){
  .sm-or-pair{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:var(--s-8);align-items:start}
  .sm-q{grid-template-columns:minmax(0,18rem) minmax(0,1fr) auto;align-items:start;gap:var(--s-6)}
  .sm-q__ep{grid-template-columns:minmax(0,1fr)}
  .sm-q__ep .sm-mg-row__thumb--wide{width:100%}
  .sm-q__act{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-3)}
}
@container page (max-width:39.99rem){
  .sm-mg-dl>div{grid-template-columns:minmax(0,1fr);gap:2px}
  .sm-choose{grid-template-columns:48px minmax(0,1fr)}
  .sm-choose .sm-keep{grid-column:2;margin-top:0}
  .sm-choose--text{grid-template-columns:minmax(0,1fr)}
  .sm-choose--text .sm-keep{grid-column:1}
  .sm-choose .sm-mg-row__thumb{width:48px}
  .sm-rel{grid-template-columns:72px minmax(0,1fr)}
  .sm-rel .sm-mg-row__thumb--wide{width:72px}
  .sm-rel>.sm-tag--state{grid-column:2;justify-self:start}
  .sm-mg-row--media:has(.sm-mg-row__thumb--wide){grid-template-columns:72px minmax(0,1fr)}
  .sm-mg-row--media .sm-mg-row__thumb--wide{width:72px}
  .sm-mg-row--media>.sm-tag--state{grid-column:2;justify-self:start}
  .sm-st thead{display:none}
  .sm-compose__end{flex-direction:column;align-items:flex-start}
}

/* round eight: checkout's two steps, the order area's one template, the thread by email */
.sm-steps li small{display:block;margin-top:2px;font:var(--fw-regular) 11px/1.3 var(--font-body);color:var(--muted)}
.sm-ck-other{margin:var(--s-2) 0 var(--s-2) 32px}
.sm-ck-other[hidden],[data-third-party][hidden]{display:none}
.sm-ck-preview{margin-top:var(--s-4);max-width:40rem;padding:var(--s-5) var(--s-6);background:var(--panel)}
.sm-ck-preview .sm-caps{margin-bottom:var(--s-2)}
.sm-ck-preview__l{font:var(--fw-regular) var(--fs-sm)/1.6 var(--font-body);color:var(--ink-2)}
.sm-ck-preview__l [data-credit-preview]{color:var(--ink);font-weight:var(--fw-medium)}
.sm-ck-preview__n{display:block;margin-top:var(--s-2)}
.sm-reply{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3) var(--s-5);margin-top:var(--s-5)}
.sm-or-now{margin-top:var(--s-7);padding:var(--s-6);border:1px solid var(--ink);background:var(--card)}
.sm-or-now[hidden],[data-from][hidden]{display:none}
.sm-or-now h2{margin-top:var(--s-2);font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink)}
.sm-or-now__x{margin-top:var(--s-3);max-width:var(--measure);font:var(--fw-regular) var(--fs-base)/1.55 var(--font-body);color:var(--ink-body)}
.sm-or-now .sm-mg-sec:first-of-type{margin-top:var(--s-6)}
.sm-ladder li[hidden]{display:none}
.sm-panel__later{margin-top:var(--s-8);padding-top:var(--s-5);border-top:var(--hairline)}
.sm-file__thumb--audio{display:grid;place-items:center;background:var(--panel);color:var(--ink-2)}
@container page (max-width:39.99rem){.sm-or-now{padding:var(--s-5)}.sm-ck-other{margin-left:0}}

/* css/share.css */
/* share cards (round eight): one 1200 by 630 raster per public page kind, rendered from this markup by the build and
   named in the page's og:image and twitter:image. Composed from the page's lead picture (its unbranded source, so the
   lockup appears once) with the SOURCED.MEDIA lockup and the show's mark; every word at 4.5:1 or better; nothing within
   5 per cent of an edge (the inset is 64px, the outer 5 per cent is 60 by 31.5). A card has no theme: light roles always. */
.sm-share{position:relative;box-sizing:border-box;display:grid;width:1200px;height:630px;overflow:hidden;background:var(--ground);color:var(--ink);font-family:var(--font-body)}
.sm-share *{box-sizing:border-box}
.sm-share a{color:inherit;text-decoration:none}
.sm-share--split{grid-template-columns:minmax(0,1fr) 560px}
.sm-share__panel{position:relative;z-index:1;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:28px;padding:64px;min-width:0}
.sm-share__lockup{display:block;width:auto;height:40px;color:var(--ink)} /* the wordmark is hairline-thin: 40px here so it survives a feed's downscale to half size */
.sm-share__body{align-self:center;display:grid;gap:16px;min-width:0}
.sm-share__k{font:var(--fw-medium) 16px/1.3 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-share__t{font:var(--fw-large) 54px/1.06 var(--font-display);letter-spacing:-.01em;color:var(--ink);text-wrap:balance;overflow-wrap:anywhere}
.sm-share__l{font:var(--fw-regular) 21px/1.4 var(--font-body);color:var(--ink-2);text-wrap:pretty}
.sm-share__l b{font-weight:var(--fw-medium);color:var(--ink)}
.sm-share__foot{display:flex;align-items:center;gap:16px;font:var(--fw-medium) 16px/1.3 var(--font-body);color:var(--ink)}
.sm-share__foot small{display:block;font:var(--fw-regular) 15px/1.3 var(--font-body);color:var(--muted)}
.sm-share__mark{flex:none;width:56px;height:56px;border-radius:50%}
.sm-share__pic{position:relative;overflow:hidden;background:var(--media)}
.sm-share__pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
/* a big disc in the body: the show's mark, or an organisation's mark (its initials as the fallback) */
.sm-share__disc{width:128px;height:128px;border-radius:50%}
.sm-share__disc--mono{display:grid;place-items:center;background:var(--ink);color:var(--ground);font:var(--fw-medium) 44px/1 var(--font-body);letter-spacing:.04em} /* the initials are data (<organisation_initials>); the card shows Pacific Direct's */
/* the quote card (an insight): the mark of quotation, the quote in the display face, the speaker under it */
.sm-share--quote .sm-share__t{font-size:40px;line-height:1.18;letter-spacing:-.005em}
.sm-share__q::before{content:"\201C";display:block;height:.46em;font:var(--fw-display) 120px/1 var(--font-display);color:var(--muted)}
.sm-share__who{display:flex;align-items:center;gap:14px;font:var(--fw-medium) 18px/1.3 var(--font-body);color:var(--ink)}
.sm-share__who img{flex:none;width:48px;height:48px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,46%)}
.sm-share__who small{display:block;font:var(--fw-regular) 16px/1.3 var(--font-body);color:var(--ink-2)}
/* bleed (an episode, a story): the picture fills the card under protection; white type in the band; the show's mark
   top right. Round ten (the renderer's reply): until the build measures the type against the picture, the protection is
   fixed and deep enough for any picture: never under 56 per cent black anywhere on the card, 64 at the top and 80 at the
   foot, so white type measures at least 4.9:1 over the brightest pixel. Once the measurement is built it may lighten
   the protection where the picture allows, never below 4.5:1, as the composer does for the plates (contrast.json) */
.sm-share--bleed{grid-template-columns:minmax(0,1fr)}
.sm-share--bleed .sm-share__pic{position:absolute;inset:0}
.sm-share--bleed .sm-share__pic::after{content:"";position:absolute;inset:0;background:linear-gradient(rgb(0 0 0 / .64),rgb(0 0 0 / .56) 30%,rgb(0 0 0 / .56) 50%,rgb(0 0 0 / .8))}
.sm-share--bleed .sm-share__panel{grid-template-rows:auto minmax(0,1fr);color:#FFFFFF}
.sm-share--bleed .sm-share__lockup,.sm-share--bleed .sm-share__k,.sm-share--bleed .sm-share__t,.sm-share--bleed .sm-share__l,.sm-share--bleed .sm-share__l b{color:#FFFFFF}
.sm-share--bleed .sm-share__body{align-self:end;max-width:860px}
.sm-share--bleed .sm-share__mark{position:absolute;top:64px;right:64px;z-index:2;width:64px;height:64px}
/* the topic card (round twelve, part two, finding 122): a split panel, the topic and its counts on the ground, the people who
   speak about it as headshots in the right panel: two side by side, three with the first full height, four as a square */
.sm-share__faces{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:4px;background:var(--ground)}
.sm-share__faces img{position:static;width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-share__faces[data-n="2"]{grid-template-rows:minmax(0,1fr)}
.sm-share__faces[data-n="3"] img:first-child{grid-row:span 2}
.sm-share__faces[data-n="1"]{grid-template-columns:minmax(0,1fr)}
/* the site card: the fallback for every kind without a card of its own */
.sm-share--site{grid-template-columns:minmax(0,1fr)}
.sm-share--site .sm-share__lockup{height:72px;color:var(--ink)}

/* css/promote-panel.css */
/* the Promote panel (round ten as the commission panel; placed by the operator's ruling of 2 October 2026; round twelve,
   6 October, renames the action): a plain episode's one action, the whole panel inside the first screen at every tier,
   down to a 375 by 667 phone. It sits in the head after the byline and before the tab strip: the one disclosure line,
   then Promote this episode as the system's one primary button with its arrow, to /promote/?episode=<episode_id>. The
   panel ground sets it apart from the editorial; the button is the strongest thing on the first screen. On a phone the
   panel is a full-width band and the button spans it. Never on a promoted episode in any state; the one line at the
   foot stands alone. The class names stay (.sm-cpanel), so the renderer's port is a text change. */
.sm-cpanel{margin-top:var(--s-6);display:grid;gap:var(--s-4);padding:var(--s-5) var(--s-6);background:var(--panel)}
.sm-cpanel__const{font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-2);text-wrap:pretty}
.sm-cpanel__go{justify-self:start;min-height:52px;padding:0 var(--s-5) 0 var(--s-6);gap:var(--s-3);font-size:var(--fs-base)}
.sm-cpanel__go .sm-i{width:18px;height:18px;transition:translate var(--dur-fast) var(--ease-standard)}
.sm-cpanel__go:hover .sm-i{translate:3px 0}
.sm-cpanel+.sm-trio{margin-top:var(--s-6)}
@container page (min-width:40rem){.sm-cpanel{grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:var(--s-7)}.sm-cpanel__go{white-space:nowrap}}
@container page (max-width:39.99rem){.sm-cpanel{margin:var(--s-4) calc(-1 * var(--pad)) 0;padding:12px var(--pad) 14px;gap:10px}.sm-cpanel__const{font-size:var(--fs-xs);line-height:1.45}.sm-cpanel__go{justify-self:stretch;min-height:48px}.sm-cpanel+.sm-trio{margin-top:var(--s-4)}}
/* to keep the whole panel inside a 375 by 667 first screen with a long name or two guests, a head that carries it sets
   its lines a step closer on a phone (the masthead at rest, the trail, the kicker, the title, the dek, the byline); round
   eleven sets the line at the small size there, so the panel ends above the consent sheet on a first visit */
@container page (max-width:39.99rem){.sm-head:has(>.sm-cpanel){padding-top:var(--s-6)}.sm-head:has(>.sm-cpanel)>.sm-crumbs{margin-bottom:var(--s-2)}.sm-head:has(>.sm-cpanel) h1{margin-top:var(--s-4)}.sm-head:has(>.sm-cpanel)>.sm-dek,.sm-head:has(>.sm-cpanel)>.sm-byline{margin-top:var(--s-3)}}
/* round thirteen, item 3: under 22rem (a 320 by 640 phone) the title steps down one size and the panel closes up (44px button,
   10 and 12px of padding), so the button clears the consent sheet on a first visit: measured at 320 by 640 the panel ended at
   550px against a sheet from 519px; with this it ends above the sheet (reference-art/_fold.html?small&sheet) */
@container page (max-width:22rem){.sm-head:has(>.sm-cpanel) h1{font-size:var(--fs-xl)}.sm-head:has(>.sm-cpanel)>.sm-dek{font-size:var(--fs-md)}.sm-cpanel{padding:10px var(--pad) 12px;gap:8px}.sm-cpanel__go{min-height:44px}}
@media (prefers-reduced-motion:reduce){.sm-cpanel__go .sm-i{transition:none}.sm-cpanel__go:hover .sm-i{translate:none}}

/* css/featured-placement.css */
/* featured placement (round ten): one signal for every placement, the panel ground and the Featured kicker, so a
   placement never reads as the page's own entry or as editorial. Promotion changes placement, never words.
   (a) the strip at the top of an index (/people/, /organisations/, /shows/, /episodes/), after the search and before
   the letters; the item is also listed under its letter, since an index is complete.
   (b) the promotional panel on a person or an organisation page: one commissioned episode, its still, the pair line
   and the Featured kicker; never on the featured episode's own pages. */
.sm-placement,.sm-promo__in{position:relative;background:var(--panel)}
.sm-placement__k,.sm-promo__k{font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink)}
/* (a) the index strip: bleeds a step past the ledger so its content lines up with the letters and rows below */
.sm-placement{margin:clamp(var(--s-8),calc(5 * var(--vw)),var(--s-10)) calc(-1 * var(--pad)) 0;padding:var(--s-5) var(--pad) var(--s-6)}
.sm-placement+.sm-idx{margin-top:var(--s-7)}
.sm-placement__item{position:relative;margin-top:var(--s-4);display:grid;grid-template-columns:64px minmax(0,1fr);gap:var(--s-4);align-items:center;max-width:var(--measure)}
.sm-placement__disc{width:64px;height:64px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,46%);background:var(--media)}
.sm-placement__disc.sm-mono{font-size:20px}
.sm-placement__mark{width:64px;height:64px;filter:var(--sm-mark-filter)}
.sm-placement__media{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--media)}
.sm-placement__media img{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);transition:scale var(--dur-slow) var(--ease-out-soft)}
.sm-placement__item--episode{grid-template-columns:minmax(0,1fr);align-items:start}
.sm-placement__meta{margin-bottom:var(--s-2);font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-placement__t{font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink);text-wrap:balance;overflow-wrap:anywhere}
.sm-placement__t a{color:inherit;text-decoration:none}
.sm-placement__t a::after{content:"";position:absolute;inset:0}
.sm-placement__item:hover .sm-placement__t{color:var(--accent)}
.sm-placement__item:hover .sm-placement__media img{scale:1.03}
.sm-placement__x{margin-top:var(--s-1);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-2);text-wrap:pretty}
@container page (min-width:40rem){
.sm-placement{margin-inline:calc(-1 * var(--s-6));padding:var(--s-6)}
.sm-placement__item{grid-template-columns:88px minmax(0,1fr);gap:var(--s-5)}
.sm-placement__disc,.sm-placement__mark{width:88px;height:88px}.sm-placement__disc.sm-mono{font-size:26px}
.sm-placement__item--episode{grid-template-columns:minmax(0,16rem) minmax(0,1fr);align-items:center}
}
@container page (min-width:64rem){
.sm-placement{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:center;padding-block:var(--s-7)}
.sm-placement__item{margin-top:0}
.sm-placement__item--episode{grid-template-columns:minmax(0,18rem) minmax(0,1fr);max-width:none}
}
/* (b) the promotional panel: after the profile's tail, before the stack */
.sm-promo{max-width:calc(var(--shell) + 2 * var(--pad));margin:var(--s-11) auto 0;padding-inline:var(--pad)}
.sm-promo+.sm-linked{margin-top:var(--s-10)}
.sm-promo__in{display:grid;grid-template-areas:"k" "m" "t";gap:var(--s-4);margin-inline:calc(-1 * var(--pad));padding:var(--s-5) var(--pad) var(--s-6)}
.sm-promo__k{grid-area:k}
.sm-promo__media{grid-area:m;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--media)}
.sm-promo__media img{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);transition:scale var(--dur-slow) var(--ease-out-soft)}
.sm-promo__t{grid-area:t;font:var(--fw-lg) var(--fs-lg)/1.2 var(--font-display);color:var(--ink);text-wrap:balance;overflow-wrap:anywhere}
.sm-promo__t a{color:inherit;text-decoration:none}
.sm-promo__t a::after{content:"";position:absolute;inset:0}
.sm-promo__in:hover .sm-promo__t{color:var(--accent)}
.sm-promo__in:hover .sm-promo__media img{scale:1.03}
@container page (min-width:40rem){.sm-promo__in{grid-template-columns:minmax(0,16rem) minmax(0,1fr);grid-template-areas:"m k" "m t";grid-template-rows:auto 1fr;column-gap:var(--s-6);row-gap:var(--s-3);margin-inline:calc(-1 * var(--s-6));padding:var(--s-6)}.sm-promo__k{align-self:end}.sm-promo__t{align-self:start}}
@container page (min-width:64rem){.sm-promo__in{grid-template-columns:14rem minmax(0,20rem) minmax(0,1fr);grid-template-areas:"k m t";grid-template-rows:auto;column-gap:0;align-items:center;padding-block:var(--s-7)}.sm-promo__k,.sm-promo__t{align-self:center}.sm-promo__t{padding-left:var(--s-7);max-width:32rem}}
/* round 14b, item 8 (Q12): on a person or an organisation page the panel is text alone, the Featured kicker and the
   episode's pair-line title, so the page never carries another person's picture (the editor's page keeps its strip) */
.sm-promo--text .sm-promo__in{grid-template-areas:"k" "t";gap:var(--s-3)}
@container page (min-width:40rem){.sm-promo--text .sm-promo__in{grid-template-columns:minmax(0,1fr);grid-template-areas:"k" "t";grid-template-rows:auto}.sm-promo--text .sm-promo__t{max-width:36rem}}
@container page (min-width:64rem){.sm-promo--text .sm-promo__in{grid-template-columns:14rem minmax(0,1fr);grid-template-areas:"k t"}.sm-promo--text .sm-promo__t{padding-left:0;max-width:40rem}}

/* css/person-blocks.css */
/* person page blocks (round ten). On Sourced.media: what the site covers (Episodes, Shows, Guests on a host's page,
   Insights) and the topics line, as numerals under their terms, so the block reads alike for one episode and for fifty;
   a count of one names and links its item, a larger count links its listing, a count of none is not drawn.
   The record stays as drawn (.sm-record): the rows the subject supplies and corrects.
   From the recordings: the person's insights grouped by episode, one section per recording in the grammar the
   organisation page shares (there each row adds its speaker's chip). */
.sm-onsite{margin-top:var(--s-8);padding-top:var(--s-5);border-top:var(--hairline)}
.sm-onsite>h2{color:var(--ink)}
.sm-onsite dl{margin-top:var(--s-4);display:grid;grid-template-columns:minmax(0,1fr)}
.sm-onsite dl>div{display:grid;grid-template-columns:6.5rem minmax(0,1fr);gap:var(--s-3);align-items:baseline;padding-block:var(--s-3);border-top:var(--hairline)}
.sm-onsite dl>div:first-child{padding-top:0;border-top:0}
.sm-onsite dt{font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-onsite dd{min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s-1) var(--s-3)}
.sm-onsite__n{font:var(--fw-text) var(--fs-md)/1.1 var(--font-display);color:var(--ink);font-variant-numeric:lining-nums tabular-nums;text-decoration:none}
a.sm-onsite__n:hover{color:var(--accent)}
.sm-onsite__one{font:var(--fw-regular) var(--fs-sm)/1.45 var(--font-body);color:var(--ink-2);text-decoration:none;overflow-wrap:anywhere}
.sm-onsite__one:hover{color:var(--accent);text-decoration:underline}
.sm-onsite__tl{display:flex;flex-wrap:wrap;margin:0;padding:0;list-style:none;font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink)}
.sm-onsite__tl li+li::before{content:"\00B7";padding:0 .55em;color:var(--muted)}
@container page (min-width:40rem){
.sm-onsite dl{grid-template-columns:repeat(auto-fill,minmax(min(100%,8rem),10rem));gap:var(--s-5) var(--s-6)}
.sm-onsite dl>div{display:block;padding:0;border:0}
.sm-onsite dd{margin-top:var(--s-2);display:grid;gap:var(--s-2)}
.sm-onsite__n{font:var(--fw-large) var(--fs-xl)/1 var(--font-display)}
.sm-onsite dl>.sm-onsite__topics{grid-column:1/-1;padding-top:var(--s-4);border-top:var(--hairline)}
.sm-onsite__topics dd{display:block}
}
@container page (min-width:64rem){.sm-onsite{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:start}.sm-onsite dl{margin-top:0}}
/* From the recordings: the episode as the stack's Episodes row (its 16:9 lead, <guest_name> on <show_name>, the season
   and date), then its insights, each the question and its one receipt control */
.sm-recs{margin-top:var(--s-9);padding-top:var(--s-5);border-top:var(--hairline)}
.sm-recs>h2{font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink)}
.sm-recs__body{margin-top:var(--s-5);min-width:0}
.sm-rec+.sm-rec{margin-top:var(--s-7);padding-top:var(--s-6);border-top:var(--hairline)}
.sm-rec__head{display:grid;grid-template-columns:6.5rem minmax(0,1fr);gap:var(--s-4);align-items:center}
.sm-rec__media{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--media)}
.sm-rec__media img{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);transition:scale var(--dur-slow) var(--ease-out-soft)}
.sm-rec__media:hover img{scale:1.03}
.sm-rec__t{font:var(--fw-text) var(--fs-md)/1.25 var(--font-display);color:var(--ink);text-wrap:balance;overflow-wrap:anywhere}
.sm-rec__t a{color:inherit;text-decoration:none}
.sm-rec__t a:hover{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px}
.sm-rec__m{margin-top:var(--s-1);font:var(--fw-regular) 12.5px/1.5 var(--font-body);color:var(--muted)}
.sm-rec__list{margin:var(--s-4) 0 0;padding:0;list-style:none;border-bottom:var(--hairline)}
.sm-rec__i{padding-block:var(--s-4) var(--s-2);border-top:var(--hairline)}
.sm-rec__q{font:var(--fw-text) 19px/1.3 var(--font-display);color:var(--ink);text-decoration:none;text-wrap:pretty}
.sm-rec__q:hover{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px}
.sm-rec__i .sm-receipt{margin-top:var(--s-1);column-gap:var(--s-4)}
.sm-rec__i .sm-moment,.sm-recs__all .sm-seeall{white-space:nowrap}
.sm-rec__i .sm-chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--ink);text-decoration:none;font:var(--fw-medium) 13px/1.3 var(--font-body)}
.sm-rec__i .sm-chip:hover{color:var(--accent)}
.sm-rec__i .sm-chip img{width:22px;height:22px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-recs__all{margin-top:var(--s-5)}
@container page (min-width:40rem){.sm-rec__head{grid-template-columns:9rem minmax(0,1fr);gap:var(--s-5)}.sm-rec__list,.sm-recs__all{margin-left:calc(9rem + var(--s-5))}}
@container page (min-width:43.75rem){.sm-recs>h2{font-weight:var(--fw-large)}}
@container page (min-width:64rem){.sm-recs{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:start;padding-top:var(--s-7)}.sm-recs>h2{padding-right:var(--s-6)}.sm-recs__body{margin-top:0;max-width:calc(var(--measure) + 9rem + var(--s-5))}}
/* round eleven (the port, 3 October): the organisation page's rows are the editorial layer's lines, the facts said
   about the organisation on the recording, each with its speaker's chip and the receipt; the stack keeps its Insights row */
.sm-rec__line{font:var(--fw-regular) var(--fs-base)/1.55 var(--font-body);color:var(--ink);text-wrap:pretty}
/* Topics, two levels (round eleven, item 9): each high-level topic, linked to its page once two people share it (plain
   until then), with its fine topics under it as the line was drawn */
.sm-topics{display:grid;gap:var(--s-3);margin:0;padding:0;list-style:none}
.sm-topics__t{font:var(--fw-medium) var(--fs-sm)/1.45 var(--font-body);color:var(--ink)}
a.sm-topics__t{text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:3px}
a.sm-topics__t:hover{color:var(--accent);text-decoration-color:currentColor}
.sm-topics .sm-onsite__tl{margin-top:2px;color:var(--ink-2)}
@container page (min-width:40rem){.sm-topics{grid-template-columns:repeat(auto-fill,minmax(min(100%,15rem),1fr));gap:var(--s-4) var(--s-6)}}

/* round twelve, part two (finding 88): a guest's page leads to the Promote page from each recording's head */
.sm-rec__head .sm-card__act{margin-top:var(--s-2)}
/* round 14a: the organisation's source line under From the recordings, in the approved words; from 64rem it opens the body column */
.sm-recs__src{margin:var(--s-3) 0 0;max-width:var(--measure);font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink-2);text-wrap:pretty}
@container page (min-width:64rem){.sm-recs:has(>.sm-recs__src)>h2{grid-row:1/3}.sm-recs>.sm-recs__src{grid-column:2;margin:0 0 var(--s-5)}.sm-recs:has(>.sm-recs__src)>.sm-recs__body{grid-column:2}}

/* css/downloads.css */
/* downloads (round ten), replacing the file folders: folders by kind and subject only, closed, their rows in the page;
   one row per asset: the 1:1 thumbnail, the title, the pairing line, then one button per shape (16:9, 1:1, 9:16), each
   with its size, each downloading that shape's file. The thumbnail and the title open the viewer on the item at the
   reader's chosen shape. Audio and transcript rows have one button each. On a phone the buttons are a row of three
   under the title (the shape over its size), so every one keeps 44px. */
.sm-downloads{max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding:var(--s-7) var(--pad) 0}
.sm-downloads__head{margin-bottom:var(--s-5)}
.sm-downloads__head h2{font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink)}
.sm-downloads__head p{margin-top:var(--s-2);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--muted);text-wrap:pretty}
.sm-downloads__head p a{color:var(--ink-2)}
.sm-dfolders{border-top:1px solid var(--rule-strong)}
.sm-dfolder{border-bottom:var(--hairline)}
.sm-dfolder>summary{display:grid;grid-template-columns:18px minmax(0,1fr) auto 16px;align-items:center;gap:var(--s-3);min-height:52px;list-style:none;cursor:pointer;font:var(--fw-regular) var(--fs-sm)/1.35 var(--font-body);color:var(--ink)}
.sm-dfolder>summary::-webkit-details-marker{display:none}
.sm-dfolder>summary>.sm-i{width:18px;height:18px;color:var(--muted)}
.sm-dfolder>summary:hover{color:var(--accent)}
.sm-dfolder__c{font:var(--fw-regular) 12.5px/1 var(--font-body);color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.sm-dfolder__chev{transition:transform var(--dur-fast) var(--ease-standard)}
.sm-dfolder[open] .sm-dfolder__chev{transform:rotate(180deg)}
.sm-drows{margin:0;padding:0 0 var(--s-3);list-style:none}
.sm-drow{display:grid;grid-template-columns:56px minmax(0,1fr);gap:var(--s-3) var(--s-4);align-items:center;padding-block:var(--s-3);border-top:var(--hairline)}
.sm-drow__thumb{display:block;width:56px;height:56px;overflow:hidden;border-radius:var(--r-sm);background:var(--media)}
.sm-drow__thumb img{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);transition:scale var(--dur-slow) var(--ease-out-soft)}
.sm-drow__thumb:hover img{scale:1.03}
.sm-drow__thumb--glyph{display:grid;place-items:center;background:var(--panel);color:var(--ink-2)}
.sm-drow__body{min-width:0}
.sm-drow__t{font:var(--fw-medium) var(--fs-sm)/1.35 var(--font-body);color:var(--ink);overflow-wrap:anywhere}
.sm-drow__t a{color:inherit;text-decoration:none;display:inline-block;padding-block:4px;margin-block:-4px}
.sm-drow__t a:hover{color:var(--accent);text-decoration:underline}
/* round twelve: the pairing line once per folder, under its summary, not on every row */
.sm-dfolder__pair{margin:0 0 var(--s-2);padding-left:calc(18px + var(--s-3));font:var(--fw-regular) 12.5px/1.45 var(--font-body);color:var(--ink-2);overflow-wrap:anywhere}
.sm-drow__pair{margin-top:2px;font:var(--fw-regular) 12.5px/1.45 var(--font-body);color:var(--ink-2);overflow-wrap:anywhere} /* unclamped (finding 66) */
.sm-drow__btns{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-2)}
.sm-drow--one .sm-drow__btns{grid-template-columns:minmax(0,1fr)}
.sm-dbtn{display:grid;justify-items:center;align-content:center;gap:4px;min-height:48px;padding:6px var(--s-2);border:var(--hairline);color:var(--ink);text-decoration:none;font:var(--fw-medium) 12px/1 var(--font-body);font-variant-numeric:tabular-nums;white-space:nowrap;transition:border-color var(--dur-fast) var(--ease-standard)}
.sm-dbtn:hover{border-color:var(--ink);color:var(--ink)}
.sm-dbtn .sm-i{display:none;width:14px;height:14px}
.sm-dbtn b{font-weight:var(--fw-medium)}
.sm-dbtn span:not(.sm-vh){font-weight:var(--fw-regular);color:var(--muted)}
@container page (min-width:40rem){
.sm-drow__btns{grid-column:2;display:flex;flex-wrap:wrap}
.sm-dbtn{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 var(--s-3)}
.sm-dbtn .sm-i{display:block}
}
/* the Downloads page's Shape control (the renderer's [data-dl-shapes]): the shape the viewer opens at from a row's
   thumbnail or title; the viewer's own control under its label, before the folders. Not drawn on a person page. */
.sm-downloads__bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2) var(--s-4);margin-bottom:var(--s-5)}
.sm-downloads__bar .sm-seg-label{font:var(--fw-regular) var(--fs-sm)/1.3 var(--font-body);color:var(--ink-2)}
@container page (max-width:39.99rem){.sm-downloads__bar{display:grid;gap:var(--s-2)}.sm-downloads__bar .sm-seg{justify-self:start}}
@container page (min-width:43.75rem){.sm-downloads__head h2{font-weight:var(--fw-large)}}
@container page (min-width:64rem){
.sm-downloads{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:start}
.sm-downloads__head{margin:0;padding-right:var(--s-6)}
.sm-drow{grid-template-columns:56px minmax(0,1fr) auto}
.sm-drow__btns{grid-column:auto;flex-wrap:nowrap;justify-content:flex-end}
.sm-downloads:has(>.sm-downloads__bar){grid-template-rows:auto 1fr}
.sm-downloads:has(>.sm-downloads__bar)>.sm-downloads__head{grid-row:1/3}
.sm-downloads__bar{grid-column:2;justify-content:flex-end}
}
/* on the Downloads page the list follows the page's head, under the heading Folders and its count, before the stack */
.sm-downloads--page{padding-top:var(--s-8)}
/* round 14a (ruling Q43): the Downloads page's rail. Its folders by name (the files-* ids) in the contents box, open at rest at
   every width, with the dock on a phone; from 64rem the head column holds the heading and the count and, under them, the rail,
   sticky, with Back to top pinned at its foot; the Shape control rides beside it, sticky at the top of the folders' column on
   the page ground, so the choice and the folders stay in view down a long list */
.sm-downloads>.sm-contents{margin-top:var(--s-5)}
.sm-downloads>.sm-contents+.sm-downloads__main{margin-top:var(--s-6)}
.sm-downloads>.sm-dock{margin-top:var(--s-8)}
@container page (min-width:64rem){
.sm-downloads--page:has(>.sm-contents){grid-template-rows:auto 1fr}
.sm-downloads--page:has(>.sm-contents)>.sm-downloads__head{grid-column:1;grid-row:1}
.sm-downloads>.sm-contents{position:static;grid-column:1;grid-row:2;align-self:stretch;inset:auto;z-index:auto;margin:var(--s-5) 0 0;padding-right:var(--s-6)}
.sm-downloads>.sm-contents>.sm-contents__in{top:calc(56px + var(--s-6));padding-top:0}
.sm-downloads>.sm-contents+.sm-downloads__main{grid-column:2;grid-row:1/3;min-width:0;margin-top:0}
.sm-downloads__main>.sm-downloads__bar{position:sticky;top:56px;z-index:2;justify-content:flex-end;margin:0;padding-block:var(--s-3) var(--s-4);background:var(--ground)}
}

/* css/episode-nav.css */
/* the episode's pages and its contents (round ten). The strip (Episode, Story, and Downloads where the episode has
   public downloads) stays where the template has it, under the byline; it is made more visible inside the template:
   the labels at the body size in ink, a hairline above and below, 52px cells, and on a phone three equal cells across
   the screen. The current page keeps the accent and its 2px rule. */
.sm-trio{gap:var(--s-7);border-top:var(--hairline)}
.sm-trio a{min-height:52px;color:var(--ink);font:var(--fw-medium) var(--fs-base)/1 var(--font-body)}
.sm-trio a:hover{color:var(--accent)}
@container page (max-width:39.99rem){.sm-trio{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:0;margin-inline:calc(-1 * var(--pad))}.sm-trio a{justify-content:center;padding-inline:var(--s-2)}.sm-trio a+a{border-left:var(--hairline)}}
/* the contents gains a second group after the chapters, On this page: the sections after the chapters, each with
   its kind glyph where the chapters have their number. An item whose section is not on the page is not drawn. */
.sm-contents__h{display:block;margin:var(--s-6) 0 var(--s-3);font:var(--fw-medium) var(--fs-xs)/1 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-onpage{display:grid;grid-template-columns:minmax(0,1fr);margin:0;padding:0;list-style:none}
.sm-onpage li a{align-items:center}
.sm-onpage li a::before{content:none}
.sm-onpage .sm-i{width:16px;height:16px}
.sm-onpage a:not(:hover):not([aria-current="true"]) .sm-i{color:var(--muted)}
/* Downloads is its own page (/<hub>/<episode_slug>/downloads/), so its item leaves this one: a trailing arrow says so,
   and the script never marks it as the section in view */
.sm-onpage a.sm-onpage__out{grid-template-columns:2rem minmax(0,1fr) auto}
.sm-onpage__go{width:14px;height:14px;align-self:center}
@container page (max-width:39.99rem){.sm-onpage a.sm-onpage__out{grid-template-columns:1.75rem minmax(0,1fr) auto}}
@container page (min-width:40rem) and (max-width:63.99rem){.sm-onpage{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s-7)}}
@container page (max-width:39.99rem){.sm-contents__box[open] .sm-onpage{padding-bottom:var(--s-3)}.sm-contents__h{margin-top:var(--s-4)}}
/* the phone dock carries it: in a chapter, the number and the chapter; past the chapters, the item's glyph and its
   name (data-onpage, set by js/sm.js); while scrolling, the number or the glyph alone */
.sm-dock__g{display:none}
.sm-dock__n{white-space:nowrap}
@container page (max-width:39.99rem){
.sm-dock[data-onpage] .sm-dock__n{display:none}
.sm-dock[data-onpage] .sm-dock__g{display:block}
.sm-dock[data-onpage][data-scrolling] .sm-dock__btn>.sm-dock__g{display:block}
}
/* round eleven (the port): On this page leads the box and the chapters follow under their own label, so a long run
   of chapters never takes the group out of the rail's window (the window less 120px, its scrollbar hidden) */
.sm-contents__box>summary+.sm-contents__h{margin-top:var(--s-3)}
.sm-contents__box>.sm-onpage+.sm-contents__h{margin-top:var(--s-6)}
@container page (max-width:39.99rem){.sm-contents__box>.sm-onpage+.sm-contents__h{margin-top:var(--s-4)}}

/* css/viewer-stage.css */
/* the viewer's stage (round ten): the Shape control (Auto, Landscape, Square, Portrait) chooses the rendition and the
   frame together; Auto follows the tier. js/sm.js writes the shape shown on the stage (data-shape): its frame is that
   shape's box and its file is that shape's rendition, so nothing is cropped from another shape's file. Landscape takes
   the column; Square is at most 28rem; Portrait is at most 80svh tall. From 64rem a square or portrait stage has its
   caption and tools beside it, as a square figure has its caption. A stage without data-shape keeps the tier rules. */
.sm-stage[data-shape] .sm-stage__frame{max-width:none;margin-inline:0}
.sm-stage[data-shape="landscape"] .sm-stage__frame{aspect-ratio:16/9;width:100%}
.sm-stage[data-shape="square"] .sm-stage__frame{aspect-ratio:1/1;width:min(100%,var(--square-max))}
.sm-stage[data-shape="portrait"] .sm-stage__frame{aspect-ratio:9/16;width:min(100%,calc(var(--portrait-max) * 9 / 16))}
@container page (max-width:39.99rem){.sm-stage[data-shape] .sm-stage__frame{margin-inline:auto}}
@container page (min-width:64rem){
.sm-stage:is([data-shape="square"],[data-shape="portrait"]){grid-template-columns:auto minmax(0,1fr);align-items:end;column-gap:var(--s-6)}
.sm-stage[data-shape="square"] .sm-stage__frame{width:var(--square-max)}
.sm-stage[data-shape="portrait"] .sm-stage__frame{width:calc(var(--portrait-max) * 9 / 16)}
.sm-stage:is([data-shape="square"],[data-shape="portrait"]) .sm-stage__bar{grid-template-columns:minmax(0,1fr);gap:var(--s-4);padding-top:var(--s-3);border-top:var(--hairline)}
}
/* the tiles under the stage: a tile's box is its own file's shape, sized from the width and height of the file shown
   (with script, the chosen shape's file, Auto resolving to the tier; without script, the file the <picture> chose), so
   no tile crops one shape's file into another's box. A diptych keeps its frame: its two panels are cut for it. */
.sm-grid .sm-tile__box:not(:has(.sm-dip)){aspect-ratio:auto}
.sm-grid .sm-tile__box:not(:has(.sm-dip))>picture{display:block}
.sm-grid .sm-tile__box:not(:has(.sm-dip))>picture>img,.sm-grid .sm-tile__box:not(:has(.sm-dip))>img{position:static;display:block;width:100%;height:auto}
@container page (max-width:39.99rem){.sm-grid[data-shape="landscape"]{grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr))}}
/* a chosen shape sets a diptych's panels as the tier would: side by side in 16:9 and 1:1, stacked in 9:16 */
.sm-grid:is([data-shape="landscape"],[data-shape="square"]) .sm-dip{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:none}
.sm-grid[data-shape="portrait"] .sm-dip{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,1fr)}
/* round 14a: a mixed grid. A tile with one shape only carries data-fixed="<shape>": it keeps its own file and box while the grid
   shows another shape (js/sm.js leaves it as drawn), and its tag names its own shape; the Shape control is offered when any
   tile has a shape to choose */
.sm-grid .sm-tile[data-fixed] .sm-shape[data-t]{display:none}
.sm-grid .sm-tile[data-fixed="landscape"] .sm-shape[data-t="landscape"],.sm-grid .sm-tile[data-fixed="square"] .sm-shape[data-t="square"],.sm-grid .sm-tile[data-fixed="portrait"] .sm-shape[data-t="portrait"]{display:inline-grid}

/* css/consent.css */
/* consent (round eleven, item 1): the banner is a bottom sheet over the page. Fixed to the foot, it covers the page
   without moving it: the page ground behind it is unmoved, nothing reflows when it opens or closes, and the masthead,
   the head and the commission panel keep their places. Accept and Reject alike, Settings opens the panel inside the
   sheet. A floating layer, so it carries the floating shadow. On a phone it is a compact band (the line at the small
   size, the three controls on one row) so a plain episode's commission panel still ends above it on a 375 by 667
   screen. It slides up in 220ms, and not at all under reduced motion. */
.sm-consent{position:fixed;left:0;right:0;bottom:0;z-index:50;max-height:calc(100svh - 72px);overflow-y:auto;overscroll-behavior:contain;background:var(--panel);border-top:var(--hairline);box-shadow:var(--shadow-2);padding-bottom:env(safe-area-inset-bottom,0px)}
.sm-consent[hidden]{display:none}
.sm-consent:not([hidden]){animation:sm-sheet-in var(--dur-base) var(--ease-out-soft)}
@keyframes sm-sheet-in{from{transform:translateY(100%)}to{transform:none}}
.sm-consent__in{max-width:calc(var(--shell) + 2 * var(--pad));margin-inline:auto;padding:var(--s-4) var(--pad);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-3) var(--s-6)}
.sm-consent__t{flex:1 1 24rem;max-width:44rem;font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:var(--ink);text-wrap:pretty}
.sm-consent__act{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3)}
.sm-consent__act .sm-btn{min-width:7.5rem;justify-content:center}
.sm-consent__set{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);font:var(--fw-medium) var(--fs-sm)/1 var(--font-body);text-decoration:underline;text-underline-offset:3px}
.sm-consent__set:hover{color:var(--accent)}
.sm-consent__act--page{margin-top:var(--s-5)}
.sm-consent__now{margin-top:var(--s-4);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-2)}
/* the settings panel, inside the sheet */
.sm-consent__panel{flex:1 1 100%;display:grid;gap:var(--s-4);padding-top:var(--s-4);border-top:var(--hairline)}
.sm-consent__panel[hidden]{display:none}
.sm-consent__rows{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-3);max-width:44rem}
.sm-consent__row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-5);align-items:center;font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink)}
.sm-consent__on{font:var(--fw-medium) 12px/1 var(--font-body);color:var(--ink-2);white-space:nowrap}
@container page (max-width:39.99rem){
.sm-consent__in{padding:var(--s-2) var(--pad) 10px;gap:6px var(--s-2)}
.sm-consent__t{flex-basis:100%;font-size:var(--fs-xs);line-height:1.45}
.sm-consent__in>.sm-consent__act{flex-wrap:nowrap;width:100%;gap:var(--s-2)}
.sm-consent__in>.sm-consent__act .sm-btn{flex:1 1 0;min-width:0;min-height:44px;padding-inline:var(--s-3)}
.sm-consent__in>.sm-consent__act .sm-consent__set{flex:none;padding-inline:var(--s-2)}
.sm-consent__panel{padding-top:var(--s-3);gap:var(--s-3)}
.sm-consent__row{gap:var(--s-4);font-size:var(--fs-xs)}
.sm-consent__panel .sm-consent__act .sm-btn{flex:1 1 0;min-width:0}
}
@media (prefers-reduced-motion:reduce){.sm-consent:not([hidden]){animation:none}}

/* css/promote-form.css */
/* the Promote form's parts (round eleven as the commission enquiry; round twelve, 6 October 2026, the one form at /promote/):
   the fields in a two-column grid from 40rem, the system's one primary button with a turning ring while sending (still
   under reduced motion), the error line above the button (the words stay in the fields), the privacy line, and the sent
   block. The form itself, its purposes and the carried thing are css/promote.css. */
.sm-ask{scroll-margin-top:var(--s-4)}
.sm-ask__lede{max-width:40rem;font:var(--fw-regular) var(--fs-base)/1.6 var(--font-body);color:var(--ink-body);text-wrap:pretty}
.sm-ask__form{margin-top:var(--s-6);display:grid;gap:var(--s-5);max-width:40rem}
.sm-ask__form[hidden]{display:none}
.sm-ask__ep{display:grid;gap:var(--s-2);padding:var(--s-4) var(--s-5);background:var(--panel)}
.sm-ask__ep p{font:var(--fw-regular) var(--fs-base)/1.45 var(--font-body);color:var(--ink);overflow-wrap:anywhere}
.sm-ask__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-5)}
.sm-ask__grid .sm-field{max-width:none}
.sm-ask .sm-field__l small{margin-left:var(--s-2);font:var(--fw-regular) 12px/1.3 var(--font-body);color:var(--muted)}
.sm-ask .sm-field textarea{min-height:calc(2 * 1.4em + 2 * var(--s-3) + 2px)}
.sm-ask__go{display:flex}
.sm-ask__btn{position:relative;min-height:52px;padding:0 var(--s-5) 0 var(--s-6);gap:var(--s-3);font-size:var(--fs-base)}
.sm-ask__btn .sm-i{width:18px;height:18px;transition:translate var(--dur-fast) var(--ease-standard)}
.sm-ask__btn:hover .sm-i{translate:3px 0}
.sm-ask__spin{display:none;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:sm-ask-spin .8s linear infinite}
@keyframes sm-ask-spin{to{transform:rotate(1turn)}}
.sm-ask__form[data-state="sending"] .sm-ask__btn{pointer-events:none;opacity:.78}
.sm-ask__form[data-state="sending"] .sm-ask__btn .sm-i{display:none}
.sm-ask__form[data-state="sending"] .sm-ask__spin{display:block}
.sm-ask__err{display:flex;align-items:flex-start;gap:var(--s-3);padding:var(--s-3) var(--s-4);background:var(--panel);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--danger)}
.sm-ask__err[hidden]{display:none}
.sm-ask__err .sm-i{flex:none;width:18px;height:18px;margin-top:1px}
.sm-ask__privacy{font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-2)}
.sm-ask__privacy a{color:inherit;text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:3px}
.sm-ask__privacy a:hover{color:var(--accent);text-decoration-color:currentColor}
.sm-ask__sent{margin-top:var(--s-6);display:grid;gap:var(--s-3);max-width:40rem;padding:var(--s-6);background:var(--panel)}
.sm-ask__sent[hidden]{display:none}
.sm-ask__sent:focus{outline:none}
.sm-ask__sent:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.sm-ask__sent>.sm-i{width:28px;height:28px;color:var(--ok)}
.sm-ask__sent-t{font:var(--fw-lg) var(--fs-lg)/1.2 var(--font-display);color:var(--ink);text-wrap:balance}
.sm-ask__promise{font:var(--fw-regular) var(--fs-base)/1.55 var(--font-body);color:var(--ink-2)}
@container page (min-width:40rem){.sm-ask__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sm-ask__wide{grid-column:1/-1}}
@container page (min-width:43.75rem){.sm-ask__sent-t{font-weight:var(--fw-large)}}
@container page (max-width:39.99rem){.sm-ask__btn{flex:1;justify-content:center;min-height:48px}.sm-ask__sent{padding:var(--s-5)}}
/* on a desk the bar sits under the masthead, so the form's row stops below both */
@container page (min-width:64rem){.sm-ask{scroll-margin-top:var(--s-10)}}
@media (prefers-reduced-motion:reduce){.sm-ask__spin{animation:none;border-right-color:currentColor;opacity:.55}.sm-ask__btn .sm-i{transition:none}.sm-ask__btn:hover .sm-i{translate:none}}

/* css/promote.css */
/* the Promote page and the About page (round twelve, 6 October 2026): the simplification. /promote/ replaces
   /commission/: one short page, one form, one queue. The head names the thing carried from the address (an episode:
   its pair line and show; a show; a person or an organisation); the purpose is the form's first control (Promote this
   episode, Commission an episode, Claim this page, Contact the show; preselected when carried); then name, organisation,
   work email, a note or a message, the list (an opt-in for Promote and Commission; required for Claim and Contact, whose
   email is confirmed before the claim or the message counts), the one primary button and the privacy line; one link to
   the About page's offer. No cards, no ladder, no prices. The sent state is its own address, /promote/sent/. The About
   page holds the full language in the ledger rows the commission page used (css/commerce.css .sm-cm-row). */
.sm-pm-hero{display:grid;gap:var(--s-6);align-items:start}
.sm-pm-hero h1{max-width:18ch}
.sm-pm-hero .sm-dek{margin-top:var(--s-4)}
/* the thing: one row under the title, the picture or disc then the two lines; hidden blocks are the other carries */
.sm-pm-thing{display:grid;grid-template-columns:56px minmax(0,1fr);gap:var(--s-4);align-items:center;max-width:40rem;padding-top:var(--s-5);border-top:var(--hairline)}
.sm-pm-thing[hidden]{display:none}
.sm-pm-thing--episode{grid-template-columns:6.5rem minmax(0,1fr)}
.sm-pm-thing__media{display:block;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:var(--r-xs);background:var(--media)}
.sm-pm-thing__media img{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-pm-thing__disc{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;overflow:hidden;background:var(--media)}
.sm-pm-thing__disc img{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,46%)}
.sm-pm-thing__disc--mark img{filter:var(--sm-mark-filter)}
.sm-pm-thing__disc .sm-mono{width:56px;height:56px;font-size:16px}
.sm-pm-thing__k{font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink-2)}
.sm-pm-thing__t{margin-top:2px;font:var(--fw-text) var(--fs-md)/1.3 var(--font-display);color:var(--ink);overflow-wrap:anywhere}
.sm-pm-thing__t a{color:inherit;text-decoration:none}
.sm-pm-thing__t a:hover{color:var(--accent)}
.sm-pm-thing__x{margin-top:2px;font:var(--fw-regular) var(--fs-sm)/1.45 var(--font-body);color:var(--ink-2)}
@container page (min-width:40rem){.sm-pm-thing--episode{grid-template-columns:15rem minmax(0,1fr);gap:var(--s-6)}}
/* the form: the row the enquiry held, without the ledger's head column (the page is short) */
.sm-pm__form{margin-top:var(--s-8)}
.sm-pm__form .sm-ask__form{margin-top:0}
.sm-purpose{border:0;margin:0;padding:0;display:grid;gap:0}
.sm-purpose>legend{padding:0;margin-bottom:var(--s-2)}
.sm-choice{display:grid;grid-template-columns:20px minmax(0,1fr);gap:var(--s-3);align-items:center;min-height:48px;padding-block:var(--s-2);border-top:var(--hairline);cursor:pointer}
.sm-choice:first-of-type{border-top:0}
.sm-choice input{width:18px;height:18px;margin:0;accent-color:var(--ink)}
.sm-choice__l{font:var(--fw-regular) var(--fs-base)/1.4 var(--font-body);color:var(--ink)}
.sm-choice:has(input:checked) .sm-choice__l{font-weight:var(--fw-medium)}
.sm-ask__grid [data-for][hidden],.sm-pm__list[hidden],[data-list-note][hidden],[data-list-optin][hidden],[data-note-l][hidden],[data-message-l][hidden],.sm-ask__closed[hidden]{display:none}
.sm-pm__list{max-width:none;padding-block:var(--s-2)}
.sm-pm__list .sm-check__l small{color:var(--ink-2)}
.sm-ask__closed{max-width:40rem;padding:var(--s-5) var(--s-6);background:var(--panel);font:var(--fw-regular) var(--fs-base)/1.55 var(--font-body);color:var(--ink-2)}
.sm-pm__offer{margin-top:var(--s-7);font:var(--fw-regular) var(--fs-base)/1.5 var(--font-body)}
.sm-pm__offer a{display:inline-flex;align-items:center;gap:var(--s-2);min-height:44px;color:var(--ink);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:3px}
.sm-pm__offer a:hover{color:var(--accent);text-decoration-color:currentColor}
.sm-pm__offer .sm-i{width:16px;height:16px}
/* the sent page: the check, the sentence, the promise, and the confirmation line when the purpose needed the sign-up */
.sm-pm-sent{margin-top:var(--s-7)}
.sm-pm-sent .sm-ask__sent{margin-top:0}
.sm-ask__confirm{font:var(--fw-regular) var(--fs-base)/1.55 var(--font-body);color:var(--ink)}
.sm-ask__confirm[hidden]{display:none}
.sm-pm-sent__back{margin-top:var(--s-6);display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-6);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body)}
.sm-pm-sent__back a[hidden]{display:none}
.sm-pm-sent__back a{color:var(--ink-2);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:3px}
.sm-pm-sent__back a:hover{color:var(--accent)}
/* the About page: the mission as the dek; the offer, the partnering and the words as ledger rows */
.sm-about .sm-cm-hero{border-bottom:0;padding-bottom:var(--s-4)}
.sm-about .sm-cm-rows{margin-top:var(--s-8)}
.sm-about .sm-cm-hero .sm-dek{max-width:40em;font:var(--fw-regular) var(--fs-md)/1.6 var(--font-body);color:var(--ink-body)}
.sm-about__list{list-style:none;margin:0;padding:0;max-width:40rem;border-top:var(--hairline)}
.sm-about__list li{padding-block:var(--s-3);border-bottom:var(--hairline);font:var(--fw-regular) var(--fs-base)/1.5 var(--font-body);color:var(--ink)}
.sm-about__p{margin-top:var(--s-5);max-width:40rem;font:var(--fw-regular) var(--fs-base)/1.6 var(--font-body);color:var(--ink-body);text-wrap:pretty}
.sm-about__p:first-child{margin-top:0}
.sm-about__sides{display:grid;gap:var(--s-5);margin:0;max-width:40rem}
.sm-about__sides>div{padding-top:var(--s-4);border-top:var(--hairline)}
.sm-about__sides dt{font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink-2)}
.sm-about__sides dd{margin:var(--s-2) 0 0;font:var(--fw-regular) var(--fs-base)/1.55 var(--font-body);color:var(--ink-body);text-wrap:pretty}
.sm-about__acts{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-4);margin-top:var(--s-6)}
.sm-about__acts .sm-btn{white-space:nowrap}
.sm-about__acts .sm-btn .sm-i{width:16px;height:16px}
.sm-about .sm-outlets__l{margin-top:var(--s-5)}
.sm-about .sm-outlet{white-space:normal}
/* round thirteen (8 October 2026): the approved copy's parts. The form's heading; the notice Contact shows and the note printed without
   script; on the About page the lead line before the two lists (the pages, the assets), the outlets' sentence and the note under them */
.sm-ask__h{margin-bottom:var(--s-5);font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink)}
.sm-ask__notice,.sm-ask__note{max-width:40rem;font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-2);text-wrap:pretty}
.js .sm-ask__note{display:none} /* the fields note prints only without script (2.12) */
.sm-about__lead{margin-top:var(--s-6)}
.sm-about__p+.sm-about__list{margin-top:var(--s-4)}
.sm-about__list+.sm-about__list{margin-top:var(--s-5)}
.sm-about .sm-outlets{margin-top:var(--s-4)}
.sm-about__note{margin-top:var(--s-3);max-width:40rem;font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-2)}
@container page (min-width:64rem){.sm-about__sides{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-7);max-width:none}}
@container page (max-width:39.99rem){.sm-about__acts .sm-btn{flex:1 1 100%;justify-content:center}.sm-pm__form{margin-top:var(--s-7)}}
/* round twelve, part two (finding 8): anything the script or the renderer hides inside the form stays hidden, whatever its display */
.sm-ask [hidden]{display:none}
/* the honeypot (finding 5): off-screen, never hidden from the parser, out of the tab order */
.sm-ask__hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.sm-ask__err:focus{outline:none}
/* round 14a (ruling Q45): a bare ?purpose=claim shows this line in the form's place, with its two links to the indexes */
.sm-ask__bare{max-width:40rem;padding:var(--s-5) var(--s-6);background:var(--panel);font:var(--fw-regular) var(--fs-base)/1.55 var(--font-body);color:var(--ink-2)}
.sm-ask__bare[hidden]{display:none}

/* round 14b, item 6 (Q22, Q34, Q35, Q53, Q54): the About rows in the new order (the mission, then For shows, For readers,
   For guests and organisations, Who writes this). An audience row's head is its label in its mark (the kicker) over the
   approved heading; For readers has no other heading, so its label is its heading. A row's button follows its first
   paragraph, so on landing at /about/#shows the Partner button is in view at 1440 by 900 and at 390 by 844. The row's
   picture: at its foot on a phone (16:9), under the head from 40rem (1:1), beside the copy from 64rem (1:1) */
.sm-about .sm-cm-row[id]{scroll-margin-top:56px}
.sm-cm-row__head{display:grid;gap:var(--s-3);align-content:start;justify-items:start;min-width:0}
.sm-cm-row__head>h2{margin:0;font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink);text-wrap:balance}
.sm-cm-row__head>h2.sm-mark{font:var(--fw-medium) 11px/1.3 var(--font-body);letter-spacing:var(--track-caps)}
.sm-about .sm-cm-row:has(>.sm-cm-row__head){grid-template-areas:"head" "body" "pic"}
.sm-about .sm-cm-row__head{grid-area:head;margin-bottom:var(--s-5)}
.sm-about .sm-cm-row:has(>.sm-cm-row__head)>.sm-cm-row__body{grid-area:body}
.sm-about__pic{grid-area:pic;margin:var(--s-7) 0 0;min-width:0}
.sm-about__pic img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);background:var(--media)}
.sm-about__pic figcaption{margin-top:var(--s-2);font:var(--fw-regular) 12.5px/1.4 var(--font-body);color:var(--ink-2);text-wrap:pretty}
.sm-about__p+.sm-about__acts{margin-top:var(--s-5)}
.sm-about__acts+.sm-about__p{margin-top:var(--s-7)}
.sm-about .sm-outlet__logo{width:auto;height:22px}
@container page (min-width:40rem){
.sm-about .sm-cm-row:has(>.sm-cm-row__head){grid-template-areas:"head body" "pic body";grid-template-rows:auto 1fr}
.sm-about .sm-cm-row__head{margin:0;padding-right:var(--s-6)}
.sm-about__pic{margin-top:var(--s-6);padding-right:var(--s-6);align-self:start}
.sm-about__pic img{aspect-ratio:1/1}
}
@container page (min-width:64rem){
.sm-about .sm-cm-row:has(>.sm-cm-row__head){grid-template-columns:14rem minmax(0,40rem) minmax(0,1fr);grid-template-areas:"head body pic";grid-template-rows:auto}
.sm-about__pic{margin:0 0 0 var(--s-8);padding-right:0}
}
/* round 14b, item 13 (the audit of the 14a port): the way back from /promote/sent/ is a 24px target, as the trail's
   links are; the line keeps its place */
.sm-pm-sent__back a{display:inline-block;padding-block:4px;margin-block:-4px}

/* css/topic.css */
/* topic pages (round eleven, item 9). A topic page exists at the high level only, from the moment two people share it,
   at /topics/<topic_slug>/: the head (the topic as the H1, the count line), then the people who speak about it in the
   stack's People row grammar with each person's count on the topic, the insights grouped by person in the index's row
   grammar with each one's receipt, the shows, the cite line. The sections stand on the ledger as the stack's rows do,
   the heading in the head column from 64rem. /topics/ is the index, A to Z with the counts, in the site index's grammar. */
.sm-topic__count{margin-top:var(--s-4);font:var(--fw-regular) var(--fs-md)/1.5 var(--font-body);color:var(--muted)}
.sm-topic__sec{margin-top:var(--s-9);padding-top:var(--s-5);border-top:var(--hairline)}
.sm-topic .sm-listing__head+.sm-topic__sec{margin-top:clamp(var(--s-7),calc(4 * var(--vw)),var(--s-9));border-top:1px solid var(--rule-strong)}
.sm-topic__sec>h2{font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink)}
.sm-topic__body{margin-top:var(--s-5);min-width:0}
.sm-topic__group+.sm-topic__group{margin-top:var(--s-7)}
.sm-topic__who{display:flex;flex-wrap:wrap;align-items:center;gap:0 var(--s-3);padding-bottom:var(--s-2);border-bottom:var(--hairline);font:var(--fw-regular) var(--fs-sm)/1.4 var(--font-body);color:var(--ink-2)}
.sm-topic__who .sm-chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--ink);text-decoration:none;font:var(--fw-medium) var(--fs-base)/1.3 var(--font-body)}
.sm-topic__who .sm-chip:hover{color:var(--accent)}
.sm-topic__who .sm-chip img{width:28px;height:28px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-topic__group .sm-list>.sm-item:first-child{padding-top:var(--s-4)}
.sm-topic__group .sm-receipt{margin-top:var(--s-2)}
.sm-topic .sm-listing__tail{margin-top:var(--s-9)}
@container page (min-width:43.75rem){.sm-topic__sec>h2{font-weight:var(--fw-large)}}
@container page (min-width:64rem){.sm-topic__sec{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:start;padding-top:var(--s-7)}.sm-topic__sec>h2{padding-right:var(--s-6)}.sm-topic__body{margin-top:0;max-width:calc(var(--measure) + 9rem)}.sm-listing h1+.sm-topic__count{margin-top:var(--s-5)}}

/* css/order-proof.css */
/* the proof in the order area (round eleven, item 12): what the commission did, for the commissioner to read, from Live on.
   Pages live (each page, its address, the date), Downloads (the counts by kind), Syndication (the outlet, the date, the
   link; only with the add-on), Cited by AI (the measurement vendor's rows: the platform, the date, the question's context
   in one line, a usefulness score), with its empty state as a slot. Tables on the ledger; stacked rows on a phone. No
   money anywhere. */
.sm-proof__part{margin-top:var(--s-6)}
.sm-proof__part:first-of-type{margin-top:var(--s-4)}
.sm-proof__part>h3{margin-bottom:var(--s-3);font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--muted)}
.sm-proof__t{width:100%;border-collapse:collapse;font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-body)}
.sm-proof__t[hidden]{display:none}
.sm-proof__t th,.sm-proof__t td{padding:var(--s-3) var(--s-4) var(--s-3) 0;text-align:left;vertical-align:top;border-top:var(--hairline)}
.sm-proof__t th:last-child,.sm-proof__t td:last-child{padding-right:0}
.sm-proof__t thead th{padding-top:0;border-top:0;font:var(--fw-medium) 12px/1.3 var(--font-body);color:var(--ink-2)}
.sm-proof__t tbody th{font-weight:var(--fw-medium);color:var(--ink)}
.sm-proof__t a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:3px;overflow-wrap:anywhere}
/* a link in a table cell keeps its line and gains a 44px hit area on a phone */
.sm-proof__t a{display:inline-block;padding-block:13px;margin-block:-13px}
.sm-proof__t a:hover{color:var(--accent);text-decoration-color:currentColor}
.sm-proof__score{font-variant-numeric:lining-nums tabular-nums;color:var(--ink)}
.sm-proof__counts{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,8rem),1fr));gap:var(--s-4) var(--s-5);margin:0}
.sm-proof__counts dt{font:var(--fw-regular) 12.5px/1.4 var(--font-body);color:var(--muted)}
.sm-proof__counts dd{margin:var(--s-1) 0 0;font:var(--fw-text) var(--fs-md)/1.1 var(--font-display);color:var(--ink);font-variant-numeric:lining-nums tabular-nums}
.sm-proof__empty{padding:var(--s-4) var(--s-5);background:var(--panel);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-2)}
.sm-proof__empty[hidden]{display:none}
@container page (max-width:39.99rem){.sm-proof__t,.sm-proof__t tbody,.sm-proof__t tr,.sm-proof__t th,.sm-proof__t td{display:block}.sm-proof__t thead{display:none}.sm-proof__t tr{padding-block:var(--s-3);border-top:var(--hairline)}.sm-proof__t th,.sm-proof__t td{padding:0;border:0}.sm-proof__t td{margin-top:var(--s-1)}.sm-proof__t td[data-col]::before{content:attr(data-col) ": ";color:var(--muted)}}
/* the expert's own view (round eleven, item 13): pages/person-own.html, reached by the person's signed link. Their page
   as the public sees it, their counts and topics (the On Sourced.media block), their share cards to download, and one
   action, Ask to commission an episode, in the head */
.sm-own__go{margin-top:var(--s-6)}
.sm-own__ask{min-height:52px;padding:0 var(--s-5) 0 var(--s-6);gap:var(--s-3);font-size:var(--fs-base)}
.sm-own__ask .sm-i{width:18px;height:18px}
.sm-own__page{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-5);align-items:center}
.sm-own__face{width:96px;height:96px;border-radius:50%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
.sm-own__t{font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink)}
.sm-own__t a{color:inherit;text-decoration:none}
.sm-own__t a:hover{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px}
.sm-own__x{margin-top:var(--s-1);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-2)}
.sm-own__u{margin-top:var(--s-1);font:var(--fw-regular) 12.5px/1.4 var(--font-body);color:var(--muted);overflow-wrap:anywhere}
.sm-own .sm-onsite{display:block}
.sm-own .sm-onsite dl{margin-top:var(--s-4)}
.sm-own__cards{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-6);margin:var(--s-4) 0 0;padding:0;list-style:none}
.sm-own__card{display:grid;gap:var(--s-3);align-content:start}
.sm-own__shot{display:block;aspect-ratio:1200/630;overflow:hidden;border:var(--hairline);background:var(--media)}
.sm-own__shot img{display:block;width:100%;height:100%;object-fit:cover}
.sm-own__cap{font:var(--fw-regular) var(--fs-sm)/1.45 var(--font-body);color:var(--ink)}
.sm-own__card .sm-dbtn{justify-self:start}
@container page (min-width:40rem){.sm-own__cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container page (max-width:39.99rem){.sm-own__ask{width:100%;justify-content:center;min-height:48px}.sm-own__face{width:72px;height:72px}}

/* css/panel.css */
/* Sourced.media: panel.css, round 14b (10 October 2026), brief/ROUND-14B.md items 2, 4, 5, 7 and 11.
   The audience marks, the panel family, the Shows banner, the front door's audience panels and the host line.
   Text is text: every word is live HTML over or beside a picture, never burned into it. */

/* item 7, the audience marks: the three AK tints as a kicker ground or a chip, never a page ground. Shows peach,
   readers mist, guests and organisations blush; text on a mark is --ink (light 14.0, 17.0, 13.4:1; dark 11.3,
   12.0, 11.2:1), never the accent */
.sm-mark{display:inline-flex;align-items:center;justify-self:start;max-width:100%;min-height:22px;margin:0;padding:3px 8px;background:var(--panel);color:var(--ink);font:var(--fw-medium) 11px/1.3 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase}
.sm-mark--shows{background:var(--mark-shows)}
.sm-mark--readers{background:var(--mark-readers)}
.sm-mark--guests{background:var(--mark-guests)}

/* item 4, the panel family: one item (an episode, a person or an organisation, the show, a story) in 16:9, 1:1 or
   9:16. The slot's own width chooses the shape (the panel is its own size container: under 18rem portrait, from
   34rem landscape, square between; on a phone every auto panel is the landscape band), or the slot names it with
   data-shape. The picture is an existing rendition with its focal point; the words are a kicker, the pair-line title
   and one call to action. One treatment in every slot, the frame (b) (the operator, 10 October 2026; the bleed is
   retired): .sm-pnl--frame, the picture top or left, the words in a solid frame below or beside it, the inverse panel's
   ground and ink. Organic and promoted are one family on one ground: a promoted panel's kicker leads with Featured,
   and nothing else differs. The whole panel is the hit area (the title's link, stretched); the call to action is its
   visible verb. */
.sm-pnl{position:relative;container:pnl/inline-size;min-width:0;margin:0}
.sm-pnl__in{position:relative;display:grid;grid-template-columns:minmax(0,1fr);overflow:hidden}
.sm-pnl__pic{position:relative;display:block;overflow:hidden;background:var(--media)}
.sm-pnl__pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);transition:scale var(--dur-slow) var(--ease-out-soft)}
.sm-pnl:hover .sm-pnl__pic img{scale:1.03}
.sm-pnl__body{position:relative;display:grid;grid-template-rows:auto auto 1fr;align-content:start;gap:var(--s-3);min-width:0;padding:var(--s-5)}
.sm-pnl__k{display:flex;flex-wrap:wrap;gap:4px 12px;margin:0;font:var(--fw-medium) 11px/1.4 var(--font-body);letter-spacing:var(--track-caps);text-transform:uppercase}
.sm-pnl__t{margin:0;color:inherit;font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);text-wrap:balance;overflow-wrap:anywhere}
.sm-pnl__t a{color:inherit;text-decoration:none}
.sm-pnl__t a::after{content:"";position:absolute;inset:0;z-index:2}
.sm-pnl__t a:focus-visible{outline:none}
.sm-pnl:has(.sm-pnl__t a:focus-visible){outline:2px solid var(--focus);outline-offset:3px}
.sm-pnl__go{display:inline-flex;align-items:center;align-self:end;justify-self:start;gap:10px;min-height:40px;margin:var(--s-2) 0 0;padding:0 var(--s-4);border:1px solid currentColor;font:var(--fw-medium) 13px/1 var(--font-body);letter-spacing:.01em;white-space:nowrap;transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard)}
.sm-pnl__go .sm-i{width:16px;height:16px;transition:translate var(--dur-fast) var(--ease-standard)}
.sm-pnl:hover .sm-pnl__go .sm-i{translate:3px 0}
@container page (min-width:43.75rem){.sm-pnl__t{font-weight:var(--fw-large)}}
/* the frame */
.sm-pnl--frame .sm-pnl__pic{aspect-ratio:1/1}
.sm-pnl--frame .sm-pnl__body{background:var(--inverse-ground);color:var(--inverse-ink)}
.sm-pnl--frame:hover .sm-pnl__go{background:var(--inverse-ink);color:var(--inverse-ground)}
/* the shape */
.sm-pnl--frame[data-shape="portrait"] .sm-pnl__pic{aspect-ratio:9/16}
.sm-pnl--frame[data-shape="landscape"] .sm-pnl__pic{aspect-ratio:16/9}
@container pnl (max-width:17.99rem){.sm-pnl--frame:not([data-shape]) .sm-pnl__pic{aspect-ratio:9/16}}
@container pnl (min-width:34rem){.sm-pnl--frame:not([data-shape]) .sm-pnl__pic{aspect-ratio:16/9}}
@container page (max-width:39.99rem){.sm-pnl--frame:not([data-shape]) .sm-pnl__pic{aspect-ratio:16/9}}
/* a wide frame (from 44rem) sets its words beside the picture; a narrower landscape panel stacks them under it */
@container pnl (min-width:44rem){
.sm-pnl--frame:is([data-shape="landscape"],:not([data-shape])) .sm-pnl__in{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.sm-pnl--frame:is([data-shape="landscape"],:not([data-shape])) .sm-pnl__pic{align-self:stretch}
.sm-pnl--frame:is([data-shape="landscape"],:not([data-shape])) .sm-pnl__body{padding:var(--s-6)}
}
/* a narrow panel takes the smaller title */
@container pnl (max-width:17.99rem){.sm-pnl__t{font-size:var(--fs-md);font-weight:var(--fw-text)}.sm-pnl__body{gap:var(--s-2);padding:var(--s-4)}.sm-pnl__go{min-height:36px;padding:0 var(--s-3);gap:8px}}
@media (prefers-reduced-motion:reduce){.sm-pnl__pic img,.sm-pnl__go,.sm-pnl__go .sm-i{transition:none}.sm-pnl:hover .sm-pnl__pic img{scale:none}.sm-pnl:hover .sm-pnl__go .sm-i{translate:none}}

/* item 2, the Shows banner: the show card is its head, then the host's still and the latest two covered episodes'
   leads (three across from 64rem, the host and one episode from 40rem, a scrolling strip below); every tile keeps
   its visible caption */
.sm-showbanner{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-6)}
.sm-showbanner+.sm-showbanner{margin-top:var(--s-8);padding-top:var(--s-6);border-top:var(--hairline)}
.sm-showbanner>.sm-card--show{padding-top:0;border-top:0}
.sm-showbanner__tiles{display:grid;grid-auto-flow:column;grid-auto-columns:80%;gap:var(--s-3);margin:0 calc(-1 * var(--pad));padding:0 var(--pad);list-style:none;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);scrollbar-width:none}
.sm-showbanner__tiles::-webkit-scrollbar{display:none}
.sm-showbanner__tiles>li{min-width:0;scroll-snap-align:start}
.sm-showbanner .sm-tile__box{aspect-ratio:16/9}
@container page (min-width:40rem){.sm-showbanner__tiles{grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-5);margin:0;padding:0;overflow:visible}.sm-showbanner__tiles>li:nth-child(n+3){display:none}}
@container page (min-width:64rem){.sm-showbanner{grid-template-columns:minmax(0,18rem) minmax(0,1fr);gap:var(--s-8);align-items:start}.sm-showbanner__tiles{grid-template-columns:repeat(3,minmax(0,1fr))}.sm-showbanner__tiles>li:nth-child(3){display:block}}

/* item 5, the front door's audience panels: the list "Who Sourced.media is for", shows first and heaviest (the
   host's picture across the column), then readers, then guests and organisations (a 1:1 picture beside the line);
   the label is the kicker in its mark, the line's lead clause the one link, stretched over the panel */
.sm-hero__sides{list-style:none;margin:0;padding:0;display:grid;min-width:0}
.sm-side{position:relative;display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:var(--s-4);align-items:start;padding-block:var(--s-4);border-top:var(--hairline)}
.sm-side:last-child{border-bottom:var(--hairline)}
.sm-side__pic{display:block;aspect-ratio:1/1;overflow:hidden;background:var(--media)}
.sm-side__pic img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%);transition:scale var(--dur-slow) var(--ease-out-soft)}
.sm-side:hover .sm-side__pic img{scale:1.03}
.sm-side__body{display:grid;align-content:start;gap:var(--s-2);min-width:0}
.sm-side__t{margin:0;font:var(--fw-regular) var(--fs-base)/1.5 var(--font-body);color:var(--ink-body);text-wrap:pretty}
.sm-side__t a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:3px}
.sm-side__t a::after{content:"";position:absolute;inset:0}
.sm-side:hover .sm-side__t a{color:var(--accent);text-decoration-color:currentColor}
.sm-side--shows{grid-template-columns:minmax(0,1fr);padding-top:0;border-top:0}
.sm-side--shows .sm-side__pic{aspect-ratio:16/9}
.sm-side--shows .sm-side__body{gap:var(--s-3)}
.sm-side--shows .sm-side__t{font-size:var(--fs-md);line-height:1.45}
@container page (min-width:40rem) and (max-width:63.99rem){.sm-side.sm-side--shows{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:var(--s-6);align-items:center;padding-bottom:var(--s-5)}.sm-side{grid-template-columns:7rem minmax(0,1fr);gap:var(--s-5)}}
@container page (min-width:64rem){.sm-side{grid-template-columns:6.5rem minmax(0,1fr)}.sm-side.sm-side--shows{grid-template-columns:minmax(0,1fr);padding-bottom:var(--s-5)}}
@media (prefers-reduced-motion:reduce){.sm-side__pic img{transition:none}.sm-side:hover .sm-side__pic img{scale:none}}

/* item 11, the host line: the site's own call, one line at the tail of the show page and every episode page, its
   link in the shows mark; the footer carries it plain (css/chrome.css) */
.sm-hostline{margin:var(--s-8) 0 0;padding-top:var(--s-5);border-top:var(--hairline);font:var(--fw-regular) var(--fs-base)/1.7 var(--font-body);color:var(--ink-body);text-wrap:pretty}
.sm-hostline a{position:relative;padding:3px 8px;background:var(--mark-shows);color:var(--ink);text-decoration:none;font-weight:var(--fw-medium);-webkit-box-decoration-break:clone;box-decoration-break:clone}
.sm-hostline a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
/* on an episode page the line follows the article on the article's own grid, so it starts on the measure */
.sm-hostline--ep{max-width:calc(var(--shell) + 2 * var(--pad));margin:var(--s-8) auto 0;padding:0 var(--pad);border-top:0}
.sm-hostline--ep>p{margin:0;padding-top:var(--s-5);border-top:var(--hairline)}
@container page (min-width:40rem){.sm-hostline--ep{display:grid;grid-template-columns:[shell-start] minmax(0,1fr) [measure-start] minmax(0,var(--measure)) [measure-end] minmax(0,1fr) [shell-end]}.sm-hostline--ep>p{grid-column:measure}}
@container page (min-width:64rem){.sm-hostline--ep{grid-template-columns:[shell-start] minmax(12rem,1fr) [measure-start] minmax(0,var(--measure)) [measure-end] minmax(0,1fr) [shell-end]}}
@container page (max-width:39.99rem){.sm-hostline a::after{content:"";position:absolute;left:0;right:0;top:50%;height:44px;transform:translateY(-50%)}}

/* css/r15.css */
/* Sourced.media: r15.css, round 15 (16 October 2026), brief/ROUND-15.md and brief/ROUND-15-REFERENCES.md. Lean,
   streamlined, slick: the icon family and its badge, the one button in two tiers, the quiet link, the stat card, the panel
   family's slots and shapes, the Insights index by topic, the topic row, the Assets rail, the external-link marker, and
   the proposals of item 7 behind page attributes (data-links, data-about, data-hero, data-kicker, data-motion), so the
   operator chooses on the boards and nothing else moves. No token, type or colour changes. Imported last by styles.css. */

/* item 2, the icon family: fourteen kinds at one stroke (Lucide geometry, 1.5px, round caps): show, episode, person,
   organisation, insight, article and topic join photo, group photo, quote image, short video, video, audio and transcript
   in assets/icons.svg. Bare at 16px (.sm-kind) or 24px (.sm-kind--lg); an icon marks a kind only: where a picture of the
   person, organisation or episode exists, the picture leads and the icon never stands in for it */
.sm-kind{width:16px;height:16px;flex:none;color:var(--ink-2)}
.sm-kind--lg{width:24px;height:24px}
.sm-kicker .sm-kind,.sm-pnl__k .sm-kind,.sm-card__meta .sm-kind{color:currentColor}
/* item 7, the badge: the icon inside a thin circle at the family's stroke, its label beneath; the Assets rail and the
   Downloads folders only. As a link the ring fills on hover and the label takes the underline, nothing else moves */
.sm-kbadge{display:inline-grid;justify-items:center;align-content:start;gap:var(--s-2);min-width:4.5rem;color:var(--ink);text-decoration:none;text-align:center}
.sm-kbadge__ring{display:grid;place-items:center;width:48px;height:48px;border:1.5px solid currentColor;border-radius:var(--r-circle);color:var(--ink);transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard)}
.sm-kbadge__ring .sm-i{width:24px;height:24px}
.sm-kbadge__l{font:var(--fw-medium) 12px/1.3 var(--font-body);color:var(--ink);text-wrap:balance}
.sm-kbadge__c{display:block;font:var(--fw-regular) 11.5px/1.3 var(--font-body);color:var(--muted);font-variant-numeric:tabular-nums}
a.sm-kbadge:hover .sm-kbadge__ring{background:var(--ink);color:var(--ground)}
a.sm-kbadge:hover .sm-kbadge__l{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
/* the ring alone where the label stands beside it (a Downloads folder's summary) */
.sm-kbadge__ring--sm{width:36px;height:36px}
.sm-kbadge__ring--sm .sm-i{width:18px;height:18px}

/* item 3 and ruling B2: the one button for actions, line-drawn at the family's stroke, the accent reserved for it. Two
   tiers of one component: .sm-btn, the outlined pill, for every action; .sm-btn--fill, the same pill filled, for a page's
   single primary action (Partner on About, Watch on an episode). Rest, hover (the outline fills), focus (the ring as now),
   pressed (the darker accent), disabled (a hairline in the muted ink). The approved verbs only. The pill joins the two
   toggles as the system's rounded shapes; corners stay square everywhere else. Replaces the square filled button sitewide */
.sm-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:40px;padding:0 18px;border:1.5px solid currentColor;border-radius:var(--r-pill);background:transparent;color:var(--accent);font:var(--fw-medium) 13px/1 var(--font-body);letter-spacing:.01em;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard)}
.sm-btn .sm-i{width:16px;height:16px}
.sm-btn:hover,.sm-btn.is-hover{background:var(--accent);border-color:var(--accent);color:var(--ground)}
.sm-btn:active,.sm-btn.is-pressed{background:var(--accent-hover);border-color:var(--accent-hover);color:var(--ground)}
.sm-btn.is-focus{outline:2px solid var(--focus);outline-offset:2px}
.sm-btn--fill{background:var(--accent);border-color:var(--accent);color:var(--ground)}
.sm-btn--fill:hover,.sm-btn--fill.is-hover,.sm-btn--fill:active,.sm-btn--fill.is-pressed{background:var(--accent-hover);border-color:var(--accent-hover);color:var(--ground)}
.sm-btn--line{background:transparent;color:var(--accent)}
.sm-btn--line:hover{background:var(--accent);border-color:var(--accent);color:var(--ground)}
.sm-btn--quiet{border-color:transparent;color:var(--ink);padding:0 var(--s-3)}
.sm-btn--quiet:hover{background:var(--hover);border-color:transparent;color:var(--ink)}
.sm-btn:disabled,.sm-btn[aria-disabled="true"],.sm-btn.is-disabled{color:var(--muted);border-color:var(--rule);background:transparent;pointer-events:none}
/* the system's one large button keeps its size (the Promote panel) */
.sm-cpanel__go{min-height:48px;padding:0 22px}
@container page (max-width:39.99rem){.sm-btn{min-height:44px}}
/* inside the inverse frame the button is in the frame's ink: the accent is not read on black */
.sm-pnl--frame .sm-btn{color:var(--inverse-ink)}
.sm-pnl--frame .sm-btn:hover,.sm-pnl--frame:hover .sm-btn{background:var(--inverse-ink);border-color:var(--inverse-ink);color:var(--inverse-ground)}
.sm-pnl--frame .sm-btn--fill{background:var(--inverse-ink);border-color:var(--inverse-ink);color:var(--inverse-ground)}
/* a button inside a card sits above the card's own link and in the same place: the card's foot */
.sm-card__act .sm-btn{position:relative;z-index:1}
.sm-card__go{position:relative;z-index:1;display:flex;margin-top:var(--s-2)}
/* the front door's audience panels: the button is the panel's action and its one link, stretched over the panel */
.sm-side__go{position:static;margin-top:var(--s-2);justify-self:start}
.sm-side__go::after{content:"";position:absolute;inset:0}
.sm-side:hover .sm-side__go{background:var(--accent);border-color:var(--accent);color:var(--ground)}
.sm-side:has(.sm-side__go:focus-visible){outline:2px solid var(--focus);outline-offset:3px}
.sm-side .sm-side__go:focus-visible{outline:none}

/* item 6c (the operator's ruling): every off-site link shows the external-link marker, the family's i-external after the
   words in the link's own ink (the words "(opens in a new tab)" stay for screen readers); in a button it takes the icon's
   place and size; in an index row it follows the title */
.sm-ext{display:inline-block;width:.8em;height:.8em;margin-left:.3em;vertical-align:-.06em;flex:none}
.sm-btn .sm-ext{width:15px;height:15px;margin-left:0;vertical-align:0}
.sm-item__t .sm-ext{width:14px;height:14px;color:var(--ink-2)}
/* the source line's two actions as buttons (item 3): Watch the primary on an episode page (ruling B2), Listen beside it */
.sm-source__acts{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-3);margin-top:var(--s-1)}

/* ruling B1, the site's link rule (the operator, 17 October 2026; ported round 16, item 1; data-links="quiet" is no longer
   read): the quiet link in running text. Ink, a hairline underline at rest, the full underline and the accent on hover and
   focus; the links stay as they are, for search and AI. Chips, buttons and controls are untouched */
:is(p,li,dd,figcaption,blockquote,.sm-prose) a:not([class]),[data-first] a,.sm-side__t a,.sm-about__p a,.sm-cm-p a{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:var(--rule);text-underline-offset:.22em}
:is(p,li,dd,figcaption,blockquote,.sm-prose) a:not([class]):is(:hover,:focus-visible),[data-first] a:is(:hover,:focus-visible),.sm-side__t a:is(:hover,:focus-visible),.sm-about__p a:is(:hover,:focus-visible),.sm-cm-p a:is(:hover,:focus-visible){color:var(--accent);text-decoration-color:currentColor}
/* the board draws the hover state */
[data-first] a.is-hover{color:var(--accent);text-decoration-color:currentColor}

/* item 7, the stat card: a big number and a short label in a hairline box, for the show page's head and the About rows;
   the numbers are the page's counts as tokens and the labels words the site already has */
.sm-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(7.5rem,1fr));gap:var(--s-3);margin-top:var(--s-6);list-style:none;padding:0}
.sm-stat{display:grid;align-content:start;gap:var(--s-1);min-width:0;padding:var(--s-4) var(--s-5) var(--s-5);border:var(--hairline)}
.sm-stat__n{font:var(--fw-large) var(--fs-2xl)/1 var(--font-display);letter-spacing:var(--track-tight);color:var(--ink);font-variant-numeric:lining-nums tabular-nums;overflow-wrap:anywhere}
.sm-stat__l{font:var(--fw-regular) var(--fs-sm)/1.35 var(--font-body);color:var(--ink-2)}
.sm-showhero__in .sm-stats{max-width:34rem}
@container page (min-width:64rem){.sm-stat__n{font-weight:var(--fw-display)}}

/* item 5, the family's slots and shapes (css/panel.css is the base). The slots: the picture (.sm-pnl__pic), the kicker
   (.sm-pnl__k: the kind with its glyph and its number; Featured first on a sold placement), the title (.sm-pnl__t: the name),
   the pair line (.sm-pnl__pair, ordinary text) and the button (.sm-pnl__go, item 3's button in the frame's ink, the whole
   panel its hit area). The shapes: tall (data-shape="portrait", 9:16, sticky in a margin), row (data-shape="landscape", the
   words beside the picture from 44rem, under it below) and square (data-shape="square"). A panel with no picture
   (.sm-pnl--text) is the words alone in the frame, where a page's context rule allows no other subject's picture. An asset
   panel (data-kind="photo", "short", "quote") carries the asset itself */
.sm-pnl__body{grid-template-rows:none;gap:var(--s-2)}
.sm-pnl__k{align-items:center;gap:4px 10px}
.sm-pnl__k .sm-kind{width:14px;height:14px}
.sm-pnl__feat::after{content:"\00B7";margin-left:10px;opacity:1}
.sm-pnl__pair{margin:0;font:var(--fw-regular) 13px/1.45 var(--font-body);color:inherit;text-wrap:pretty}
.sm-pnl__go{margin-top:var(--s-3)}
.sm-pnl--text .sm-pnl__pic{display:none}
.sm-pnl--text .sm-pnl__in{grid-template-columns:minmax(0,1fr)!important}
.sm-pnl--sticky{position:sticky;top:calc(56px + var(--s-7))}
@container pnl (max-width:17.99rem){.sm-pnl__go.sm-btn{min-height:36px;padding:0 14px;gap:8px;font-size:12.5px}.sm-pnl__pair{font-size:12.5px}}
.sm-pnl--frame[data-shape="landscape"].sm-pnl--text .sm-pnl__body{padding:var(--s-6)}
/* a row in a ledger column (More on Sourced.media, a profile's promotional slot) spans the measure from 64rem */
.sm-moreon>.sm-pnl,.sm-promo--pnl>.sm-pnl{max-width:none;margin-top:var(--s-7)}
.sm-promo--pnl>.sm-pnl{margin-top:0}
@container page (min-width:64rem){.sm-moreon>.sm-pnl,.sm-promo--pnl>.sm-pnl{margin-left:14rem}}
/* a row at the foot of a hero (the front door, the show page), in the hero's own shell */
.sm-hero__pnl{margin-top:clamp(var(--s-9),calc(6.5 * var(--vw)),var(--s-11))}
.sm-showhero>.sm-hero__pnl{margin-top:clamp(var(--s-8),calc(5 * var(--vw)),var(--s-10))}
/* a square in a card grid's cell: the feed's lead keeps its row */
.sm-feed--two>.sm-pnl{margin:0}
/* a square at a profile's tail, beside the disclosure and the cite line, as the show page's tail panel sits */
.sm-profile__tail>.sm-pnl{max-width:none;margin-top:var(--s-8)}
@container page (min-width:64rem){
.sm-profile__tail:has(>.sm-pnl){display:grid;grid-template-columns:minmax(0,var(--measure)) minmax(0,24rem);grid-template-rows:auto auto auto 1fr;justify-content:space-between;column-gap:var(--s-9);align-items:start}
.sm-profile__tail:has(>.sm-pnl)>:not(.sm-pnl){grid-column:1}
.sm-profile__tail>.sm-pnl{grid-column:2;grid-row:1/-1;margin-top:0}
}
/* the tall panel in an article's right margin (the insight page's grammar, css/pages.css), on any article page */
.sm-article>.sm-margin{display:none}
@container page (min-width:64rem){
.sm-article>.sm-margin{display:block;position:absolute;grid-column:measure-end/shell-end;grid-row:1/auto;inset:0 0 0 var(--s-8);margin:0;z-index:0}
}
/* round 15b (17 October 2026, brief/ROUND-15B.md): the house panel, a house kind of the family. The three front-door panels
   (For shows, For readers, For guests and organisations) in the family's row and square shapes, for where a row of cards ends
   short, beside the home paragraph, and as an episode's tail. The slots are the family's: the picture, the kicker (the audience
   label in its mark), the words (.sm-pnl__w: the approved line, whole, in the title's place), and the button (the approved
   label, outlined; the panel's one link, stretched over it, as the front door's panels end in the button). At most one per
   page outside the home page and the episode tail; never in the index strips */
.sm-pnl--house .sm-pnl__w{margin:0;color:inherit;font:var(--fw-text) var(--fs-md)/1.35 var(--font-display);text-wrap:pretty;overflow-wrap:anywhere}
.sm-pnl--house .sm-pnl__go{position:static}
.sm-pnl--house .sm-pnl__go::after{content:"";position:absolute;inset:0;z-index:2}
/* found on the way: the body was positioned, so a stretched link covered the words alone; static, it covers the picture too, as
   the family has always said (the whole panel is the hit area) */
.sm-pnl__body{position:static}
.sm-pnl--house .sm-pnl__go:focus-visible{outline:none}
.sm-pnl--house:has(.sm-pnl__go:focus-visible){outline:2px solid var(--focus);outline-offset:3px}
/* squares in a row of like cells stand equal: the kicker at the top, the words take the slack, the button at the foot */
.sm-pnl--house[data-shape="square"]{display:grid}
.sm-pnl--house[data-shape="square"] .sm-pnl__in{grid-template-rows:auto 1fr}
.sm-pnl--house[data-shape="square"] .sm-pnl__body{grid-template-rows:auto 1fr auto}
@container pnl (max-width:17.99rem){.sm-pnl--house .sm-pnl__w{font-size:var(--fs-base)}}
/* a text-only row keeps the words in two columns from 44rem: the kicker and title, then the pair line and the button */
@container pnl (min-width:44rem){.sm-pnl--text.sm-pnl--frame .sm-pnl__body{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);grid-template-rows:auto auto;column-gap:var(--s-7);align-items:start}.sm-pnl--text.sm-pnl--frame .sm-pnl__k{grid-column:1}.sm-pnl--text.sm-pnl--frame .sm-pnl__t{grid-column:1}.sm-pnl--text.sm-pnl--frame .sm-pnl__pair{grid-column:2;grid-row:1/2;align-self:end}.sm-pnl--text.sm-pnl--frame .sm-pnl__go{grid-column:2;grid-row:2;justify-self:start;margin-top:0}}

/* item 1, the Insights index by topic (/insights/, pages/site-index-insights.html): the topics as a list with their counts
   (two columns on a phone, three at the square tier, the persistent rail sticky in the head column from 64rem), then each
   topic's insights under its heading and count; a row is the question, its one-line answer, the speaker, the show and the
   date; an insight under two topics carries the other topic with the topic glyph, so it never reads as a duplicate. A
   topic with no insight is not drawn. The flat list, newest first, is one link from the head */
.sm-insidx__all{margin-top:var(--s-5);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body)}
.sm-insidx__all a{display:inline-flex;align-items:center;gap:6px;color:var(--ink-2)}
.sm-insidx__all a:hover{color:var(--accent)}
.sm-insidx__body{margin-top:clamp(var(--s-8),calc(5 * var(--vw)),var(--s-10));border-top:1px solid var(--rule-strong)}
.sm-topicnav{padding-block:var(--s-5) var(--s-6);border-bottom:var(--hairline)}
.sm-topicnav__h{margin-bottom:var(--s-2)}
.sm-topicnav ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--s-6);margin:0;padding:0;list-style:none}
.sm-topicnav a{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);min-width:0;min-height:40px;border-bottom:var(--hairline);color:var(--ink);text-decoration:none;font:var(--fw-regular) var(--fs-sm)/1.3 var(--font-body);overflow-wrap:anywhere}
.sm-topicnav a:hover{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.sm-topicnav a[aria-current="true"]{color:var(--accent)}
.sm-topicnav .sm-num{flex:none;font:var(--fw-regular) 12px/1 var(--font-body);color:var(--muted);font-variant-numeric:tabular-nums}
.sm-tgroup{padding-block:var(--s-7);border-bottom:var(--hairline);scroll-margin-top:72px}
.sm-tgroup__h{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s-2) var(--s-3);font:var(--fw-lg) var(--fs-lg)/1.15 var(--font-display);color:var(--ink)}
.sm-tgroup__h a{color:inherit;text-decoration:none}
.sm-tgroup__h a:hover{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.sm-tgroup__c{font:var(--fw-regular) var(--fs-sm)/1 var(--font-body);color:var(--muted);font-variant-numeric:tabular-nums}
.sm-tgroup .sm-list{margin-top:var(--s-5);max-width:var(--measure)}
.sm-item__d{margin-top:var(--s-2);font:var(--fw-regular) var(--fs-sm)/1.5 var(--font-body);color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.sm-item__also{margin-top:var(--s-2);display:flex;align-items:center;gap:6px;font:var(--fw-regular) 12.5px/1.4 var(--font-body);color:var(--muted)}
.sm-item__also a{color:var(--ink-2);text-decoration:none;display:inline-block;padding-block:4px;margin-block:-4px}
.sm-item__also a:hover{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.sm-item__also .sm-kind{color:var(--muted)}
@container page (min-width:40rem){.sm-topicnav ol{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container page (min-width:43.75rem){.sm-tgroup__h{font-weight:var(--fw-large)}}
@container page (min-width:64rem){
.sm-insidx__body{display:grid;grid-template-columns:14rem minmax(0,1fr);align-items:start}
.sm-insidx__body>.sm-topicnav{position:sticky;top:calc(56px + var(--s-5));grid-column:1;align-self:start;padding:var(--s-7) var(--s-6) var(--s-7) 0;border-bottom:0}
.sm-topicnav ol{grid-template-columns:minmax(0,1fr);gap:0}
.sm-insidx__groups{grid-column:2;min-width:0}
.sm-tgroup{padding-block:var(--s-7)}
.sm-insidx__groups>.sm-tgroup:first-child{padding-top:var(--s-7)}
}
/* a person's or an organisation's topics, from their insights (item 1): a short row of topic links, each with its count,
   in On Sourced.media on a person page and under the record on an organisation page */
.sm-topicrow{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);margin:0;padding:0;list-style:none}
.sm-topicrow a{display:inline-flex;align-items:center;gap:6px;min-height:24px;color:var(--ink);text-decoration:none;font:var(--fw-medium) 13px/1.3 var(--font-body)}
.sm-topicrow a:hover{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.sm-topicrow .sm-num{font:var(--fw-regular) 12px/1 var(--font-body);color:var(--muted);font-variant-numeric:tabular-nums}
.sm-topicrow .sm-kind{color:var(--muted)}
.sm-record__topics{margin-top:var(--s-6);padding-top:var(--s-5);border-top:var(--hairline)}
.sm-record__topics>h3{margin-bottom:var(--s-3)}
@container page (min-width:64rem){.sm-record>.sm-record__topics{grid-column:2}}
@container page (max-width:39.99rem){.sm-topicrow{row-gap:20px}.sm-topicrow a{position:relative}.sm-topicrow a::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:44px;translate:-50% -50%}}

/* item 6a, the episode's Assets block, shorter. A rail of the kinds' badges opens it, each a jump to its row with the count,
   so the block reads in one line; then the rows compact: the kind and See all in the head column, the strip beside with
   one-line captions and no tags (the row names the kind; the tiles of a row share one shape). Photos, Group photos and
   Quote images stay distinct and named as before; a video tile still opens on the stage and plays on press */
.sm-assetrail{display:flex;gap:var(--s-4) var(--s-5);margin:var(--s-5) calc(-1 * var(--pad)) 0;padding:0 var(--pad) var(--s-6);list-style:none;overflow-x:auto;scrollbar-width:none}
.sm-assetrail::-webkit-scrollbar{display:none}
.sm-assetrail>li{flex:none}
.sm-moreon--assets .sm-linked{margin-top:0}
.sm-moreon--assets .sm-row{padding-block:var(--s-5)}
.sm-moreon--assets .sm-row__head :is(h2,h3){font-size:var(--fs-md)}
.sm-moreon--assets .sm-row__head{margin-bottom:var(--s-4)}
.sm-moreon--assets .sm-tile__meta{display:none}
.sm-moreon--assets .sm-tile__cap{-webkit-line-clamp:1}
.sm-moreon--assets .sm-strip{grid-auto-columns:7rem}
.sm-moreon--assets .sm-strip--rail{grid-auto-columns:6rem}
@container page (min-width:40rem){.sm-moreon--assets .sm-strip{grid-auto-columns:8rem}.sm-moreon--assets .sm-strip--rail{grid-auto-columns:6.5rem}}
@container page (min-width:64rem){.sm-assetrail{margin:var(--s-6) 0 0;padding:0 0 var(--s-6);gap:var(--s-6)}.sm-moreon--assets .sm-strip{grid-auto-columns:9rem}.sm-moreon--assets .sm-strip--rail{grid-auto-columns:7rem}.sm-moreon--assets .sm-row__head{margin:0}}

/* item 6b, the Downloads page's folders: the kind in its ring (the badge without a second label: the folder's name is the
   label), and each Contents link opens the folder it points to (js/sm.js) */
.sm-dfolder>summary{grid-template-columns:36px minmax(0,1fr) auto 16px}
.sm-dfolder>summary>.sm-kbadge__ring{color:var(--ink-2)}
.sm-dfolder>summary:hover>.sm-kbadge__ring{color:var(--accent)}
.sm-dfolder__pair{padding-left:calc(36px + var(--s-3))}

/* item 4, the About rows rebalanced: two proposals behind data-about on the page, from 64rem (below it the rows stand as
   approved). (a) the picture joins the head column under the heading, taller (4:5), with the row's stat card beneath it,
   so the left column carries the mark, the heading, the picture and a number against the copy. (b) the picture opens the row
   across the head and the copy with the heading under it, Mode's one photograph with one headline, then the copy beside */
@container page (min-width:64rem){
[data-about="a"] .sm-about .sm-cm-row:has(>.sm-cm-row__head){grid-template-columns:minmax(0,19rem) minmax(0,40rem);grid-template-areas:"head body" "pic body";grid-template-rows:auto 1fr;column-gap:var(--s-9)}
[data-about="a"] .sm-about__pic{margin:var(--s-6) 0 0;padding-right:0}
[data-about="a"] .sm-about__pic img{aspect-ratio:4/5}
[data-about="a"] .sm-about__pic .sm-stats{margin-top:var(--s-5);grid-template-columns:repeat(2,minmax(0,1fr))}
[data-about="b"] .sm-about .sm-cm-row:has(>.sm-cm-row__head){grid-template-columns:14rem minmax(0,40rem);grid-template-areas:"pic pic" "head body";grid-template-rows:auto auto;row-gap:var(--s-7)}
[data-about="b"] .sm-about__pic{margin:0;padding:0}
[data-about="b"] .sm-about__pic img{aspect-ratio:21/9}
}
@container page (max-width:63.99rem){.sm-about__pic .sm-stats{margin-top:var(--s-5);grid-template-columns:repeat(2,minmax(0,1fr))}}

/* item 7, the home opening: data-hero="open". The headline alone first, then the picture row (the three audience panels
   as one row, shows first and widest), then the paragraph; at every tier the paragraph follows the first row */
[data-hero="open"] .sm-hero__text{display:contents}
[data-hero="open"] .sm-hero__strap{order:1}
[data-hero="open"] .sm-hero__sides{order:2}
[data-hero="open"] .sm-hero__lede{order:3}
@container page (min-width:64rem){
[data-hero="open"] .sm-hero__body{grid-template-columns:minmax(0,1fr);gap:var(--s-8)}
[data-hero="open"] .sm-hero__strap{max-width:30ch}
[data-hero="open"] .sm-hero__sides{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-6);align-items:start}
[data-hero="open"] .sm-side,[data-hero="open"] .sm-side.sm-side--shows{grid-template-columns:minmax(0,1fr);padding:0;border:0}
[data-hero="open"] .sm-side__pic{aspect-ratio:16/9}
[data-hero="open"] .sm-side__t{font-size:var(--fs-base);line-height:1.5}
[data-hero="open"] .sm-hero__lede{max-width:60ch}
}

/* item 7, the kicker as kind and number: data-kicker="short" on the page draws "Episode · <season_episode>" with the kind's
   glyph above the title, and the pair line in ordinary text under it (.sm-pairline); the long form stays in the markup */
.sm-pairline{margin-top:var(--s-3);font:var(--fw-regular) var(--fs-md)/1.5 var(--font-body);color:var(--ink-2);text-wrap:pretty}
.sm-pairline+.sm-dek{margin-top:var(--s-3)}
.sm-kicker--short .sm-kind{color:var(--ink)}
[data-kicker="short"] .sm-head>.sm-kicker:not(.sm-kicker--short),[data-kicker="short"] .sm-pairline[hidden]{display:none}
.sm-head>.sm-kicker--short,.sm-head>.sm-pairline{display:none}
[data-kicker="short"] .sm-head>.sm-kicker--short{display:flex}
[data-kicker="short"] .sm-head>.sm-pairline{display:block}

/* item 7, the motion rule (off for launch: the operator, 17 October 2026; brief/DECISIONS.md): one motion as a block enters
   (.sm-reveal, set by js/sm.js on the page's blocks and released once, never again), and on hover an underline or an outline
   fill, nothing else: data-motion="rule" stands the hover zooms and the arrow nudges down. Nothing moves under reduced motion.
   Round 15b: redrawn without opacity, for later. The fade-up set every block below the fold to opacity 0 until it entered,
   which a scanner and a rendering crawler read mid-fade (126 contrast findings in axe, 0 with the rule off); now a block
   rises 12px as it enters and is never faded, so it reads at full contrast at every moment */
.js .sm-reveal{translate:0 12px;transition:translate var(--dur-slow) var(--ease-out-soft)}
.js .sm-reveal.is-in{translate:none}
[data-motion="rule"] :is(.sm-tile:hover .sm-tile__box>img,.sm-tile:hover .sm-tile__box>picture>img,.sm-tile:hover .sm-dip img,.sm-pnl:hover .sm-pnl__pic img,.sm-side:hover .sm-side__pic img,.sm-item:hover .sm-item__media img,.sm-card--insight:hover .sm-card__thumb img,.sm-placement__item:hover .sm-placement__media img,.sm-promo__in:hover .sm-promo__media img,.sm-drow__thumb:hover img,.sm-card:hover .sm-card__media img){scale:none}
[data-motion="rule"] :is(.sm-seeall:hover .sm-i,.sm-promote:hover .sm-i,.sm-back:hover .sm-i,.sm-pnl:hover .sm-pnl__go .sm-i,.sm-dlfoot h2 a:hover .sm-i){translate:none}
[data-motion="rule"] .sm-player:hover .sm-player__play{scale:none}
@media (prefers-reduced-motion:reduce){.js .sm-reveal{translate:none;transition:none}}

/* css/r16b.css */
/* Sourced.media: r16b.css, round 16: the banner family and the white space (18 October 2026), brief/ROUND-16-BANNERS-LOG.md.
   Step 1 of the look-and-feel pass. Every featured segment on the site is one family of banners, the frame of css/panel.css
   (the picture, then the black body with white words and the white button), in two sub-templates: promoted and ordinary.
   The home's foot, the Covered episodes lead, the index strips as the family's row, the About page's portrait renditions and
   the readers' button, the index rows' pictures. No token, type or colour changes. Imported last by styles.css. */

/* point 1, the family. Promoted (.sm-pnl--promoted, a sold placement): the kicker leads with Featured and the button takes
   the filled tier. Ordinary (the house's own feature, set where a space would otherwise stand empty): the kind alone in the
   kicker, the button outlined. Nothing else differs; both are black with white words in light mode and swap with the page in
   dark mode, as every inverse surface does. The body is a column: the kicker, the title, the pair line, the dek (the wide
   row's alone, since its body stands as tall as its picture) and the button at the foot, so a tall body ends in its button */
.sm-pnl--frame:not(.sm-pnl--house,.sm-pnl--text) .sm-pnl__body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-2)}
.sm-pnl--frame:not(.sm-pnl--house,.sm-pnl--text) .sm-pnl__go{align-self:flex-start;margin-top:auto;padding-top:0;padding-bottom:0}
.sm-pnl--frame:not(.sm-pnl--house,.sm-pnl--text) .sm-pnl__body>:nth-last-child(2){margin-bottom:var(--s-4)}
.sm-pnl--frame:not(.sm-pnl--house,.sm-pnl--text) .sm-pnl__body>.sm-pnl__k{margin-bottom:var(--s-1)}
.sm-pnl__d{display:none;margin:0;max-width:34rem;font:var(--fw-regular) var(--fs-sm)/1.55 var(--font-body);color:inherit;text-wrap:pretty}
.sm-pnl__pair{max-width:34rem}
/* the wide row: the words beside the picture from 44rem of the panel's own width. The picture keeps its 16:9 at the column's
   width and never widens (a stretched box with an aspect ratio takes its width from its height); the frame's ground runs
   under it, so a body taller than the picture ends on black. From 60rem the row takes the larger title and the dek */
.sm-pnl--frame .sm-pnl__in{background:var(--inverse-ground)}
@container pnl (min-width:44rem){
.sm-pnl--frame:is([data-shape="landscape"],:not([data-shape])) .sm-pnl__pic{align-self:start}
.sm-pnl--frame:is([data-shape="landscape"],:not([data-shape])):not(.sm-pnl--house) .sm-pnl__body{padding:var(--s-7)}
}
@container pnl (min-width:60rem){
.sm-pnl--frame:is([data-shape="landscape"],:not([data-shape])) .sm-pnl__d{display:block}
.sm-pnl--frame:is([data-shape="landscape"],:not([data-shape])) .sm-pnl__t{font-size:var(--fs-xl);line-height:1.08}
}
/* the filled tier inside the frame: white on black, and on hover the frame's ink stays (nothing else moves) */
.sm-pnl--frame .sm-btn--fill,.sm-pnl--frame:hover .sm-btn--fill{background:var(--inverse-ink);border-color:var(--inverse-ink);color:var(--inverse-ground)}
/* squares in a row of like cells stand equal (the row-balance rule), the body taking the slack and the button at the foot */
.sm-pnl--frame[data-shape="square"]{display:grid}
.sm-pnl--frame[data-shape="square"] .sm-pnl__in{grid-template-rows:auto 1fr}

/* the organisation's logo in its banner, wherever the banner is shown (the operator, 18 October): the mark in a disc on the
   frame's ink (the initials as the fallback, the registry's mark when it holds one), in one of three places for the operator
   to choose: (a) above the kicker, the logo opening the words; (b) beside the name, as the show card sets its mark; (c) on
   the seam between the picture and the body, half on each */
.sm-pnl__mark{display:grid;place-items:center;flex:none;width:56px;height:56px;border-radius:50%;overflow:hidden}
.sm-pnl--frame .sm-pnl__mark.sm-mono{background:var(--inverse-ink)!important;color:var(--inverse-ground);font-size:18px}
.sm-pnl--frame .sm-pnl__mark img{display:block;width:100%;height:100%;object-fit:contain;padding:10px;background:var(--inverse-ink)}
.sm-pnl--mark-a .sm-pnl__mark{margin-bottom:var(--s-3)}
.sm-pnl__trow{display:flex;align-items:center;gap:var(--s-4);min-width:0;max-width:100%}
.sm-pnl__trow .sm-pnl__mark{width:48px;height:48px;font-size:16px}
.sm-pnl__trow .sm-pnl__t{min-width:0}
.sm-pnl--mark-c .sm-pnl__mark{position:absolute;z-index:1;width:64px;height:64px;left:var(--s-5);top:calc(56.25cqi - 32px)}
.sm-pnl--mark-c[data-shape="square"] .sm-pnl__mark{top:calc(100cqi - 32px)}
.sm-pnl--mark-c .sm-pnl__body{padding-top:calc(32px + var(--s-4))}
@container pnl (min-width:44rem){
.sm-pnl--mark-c:is([data-shape="landscape"],:not([data-shape])) .sm-pnl__mark{left:calc(57.45cqi - 32px);top:var(--s-7)}
.sm-pnl--mark-c:is([data-shape="landscape"],:not([data-shape])) .sm-pnl__body{padding-top:var(--s-7);padding-left:calc(32px + var(--s-6))}
}

/* point 2, the home's opening as the page's default (the operator's ruling of 17 October 2026, ported): data-hero="open" in
   the markup. The row balance rule for the three panels: one picture ratio across the row (the square), every cell the same
   height, the kicker at the top, the words taking the slack and the button pinned to the foot */
@container page (min-width:64rem){
[data-hero="open"] .sm-hero__sides{align-items:stretch}
[data-hero="open"] .sm-side,[data-hero="open"] .sm-side.sm-side--shows{grid-template-rows:auto minmax(0,1fr)}
[data-hero="open"] .sm-side__pic,[data-hero="open"] .sm-side--shows .sm-side__pic{aspect-ratio:1/1}
[data-hero="open"] .sm-side__body{grid-template-rows:auto minmax(0,1fr) auto;height:100%}
[data-hero="open"] .sm-side__go{align-self:end}
}
/* the hero's foot: the paragraph with the newest episode beside it as an ordinary banner, so the opening ends in a picture and
   not in white; one column on a phone (the picture the 16:9 band), two from 64rem (the 1:1 picture, the words beside it) */
.sm-hero__foot{display:grid;gap:var(--s-7);margin-top:clamp(var(--s-8),calc(5 * var(--vw)),var(--s-10))}
.sm-hero__foot>.sm-pnl{margin:0}
.sm-hero__foot .sm-hero__lede{order:0;max-width:60ch}
@container page (max-width:63.99rem){.sm-hero__foot .sm-pnl--frame .sm-pnl__pic{aspect-ratio:16/9}}
@container page (min-width:64rem){
.sm-hero__foot{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:var(--s-9);align-items:start}
.sm-hero__foot .sm-pnl--frame .sm-pnl__in{grid-template-columns:minmax(0,42fr) minmax(0,58fr)}
.sm-hero__foot .sm-pnl--frame .sm-pnl__pic{align-self:start}
.sm-hero__foot .sm-pnl--frame .sm-pnl__body{padding:var(--s-6)}
.sm-hero__foot .sm-pnl--frame .sm-pnl__d{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
}

/* point 3, the Covered episodes lead: the family's row across the feed's two columns */
.sm-feed>.sm-pnl--lead{grid-column:1/-1;margin:0}

/* points 5 to 10, the index strips: the featured row at the top of an index is the family's row, in the ledger's shell, after
   the search and before the letters (the item stays under its letter, since an index is complete); on /topics/ and /insights/
   the row links to the promoted episode about that topic or holding that insight. It replaces the panel-ground strip
   (css/featured-placement.css .sm-placement) and the Shows banner (css/panel.css .sm-showbanner) wherever they stood */
.sm-featrow{margin-top:clamp(var(--s-8),calc(5 * var(--vw)),var(--s-10))}
.sm-featrow>.sm-pnl{margin:0}
.sm-featrow+.sm-idx,.sm-featrow+.sm-insidx__body{margin-top:var(--s-7)}
.sm-sect .sm-featrow{margin-top:0}
/* the organisation page's featured area (the operator, 18 October): a related organisation as the family's promoted row with its
   logo, in the promotional slot; from 64rem the row sits in the ledger's content column as a grid track (a definite width for
   the panel's own container query), not by a margin */
.sm-promo--pnl>.sm-pnl{margin-left:0}
@container page (min-width:64rem){.sm-promo--pnl{padding-left:calc(var(--pad) + 14rem)}.sm-promo--pnl>.sm-pnl{margin-left:0}}
/* change 3 (the operator, 18 October): the promotion rules. A plain episode page's Featured module is the promoted episode's row,
   leading to its story, in the module's slot (the ledger's content column from 64rem); the host's recordings open with the
   promoted episode's row; a page linked to a live promotion carries no promotional slot */
.sm-featured--pnl>.sm-pnl{margin:0}
@container page (min-width:64rem){.sm-featured--pnl{padding-left:calc(var(--pad) + 14rem)}}
.sm-recs__feat{margin:var(--s-6) 0 var(--s-8)}
.sm-recs__feat>.sm-pnl{margin:0}
/* change 4 (the operator, 18 October): the episode tail. The host line in its mark leaves every episode page; on a plain episode
   the tail is the promoted episode's row (to its story) across the article's shell, as the figures break out to it; a promoted
   episode's own pages end on the cite line */
.sm-tailrow{max-width:calc(var(--shell) + 2 * var(--pad));margin:var(--s-9) auto 0;padding:0 var(--pad)}
.sm-tailrow>.sm-pnl{margin:0}
/* change 5 (the operator, 18 October): the show page's tail. The disclosure and the cite line keep the measure as one full row;
   under them the featured guest of an active promotion on one of the show's episodes, the family's promoted row across the
   shell; a show with no promoted episode carries no panel. On the topic page the featured insight, guest and show take the
   search page's Featured label and stand first in their lists */
.sm-tail__row{max-width:calc(var(--shell) + 2 * var(--pad));margin:var(--s-8) auto 0;padding:0 var(--pad)}
.sm-tail__row>.sm-pnl{margin:0}
.sm-tail__row+.sm-linked{margin-top:var(--s-10)}
.sm-topic__who .sm-person__feat{width:100%;margin-bottom:var(--s-1)}

/* points 8 to 10, the ordinary rows: a person's row carries their still from a related episode, an organisation's and an
   episode's the host and guest together (the group photo or the pair), in the ledger row's 16:9 box (css/stack.css
   .sm-item__media, the pair as on /episodes/); the shows' rows keep the mark. An organisation's row (the operator, 18 October)
   opens with its logo in the row's disc (the initials as the fallback), then the host-and-guest still, then the details;
   the whole row is the organisation's link */
.sm-item.sm-item--org{grid-template-columns:56px 5.5rem minmax(0,1fr);gap:var(--s-3);align-items:center}
.sm-item--org .sm-item__media--disc{align-self:center}
@container page (min-width:40rem){.sm-item.sm-item--org{grid-template-columns:56px 9rem minmax(0,1fr);gap:var(--s-5)}}

/* point 4, About: the head column's picture is the portrait rendition itself from 64rem (9:16, nothing cut), the 1:1 from
   40rem and the 16:9 on a phone, each in its own box; the body copy at the home paragraph's size; the readers' row takes the
   Editorial policy button under its first paragraph, as the home has it */
.sm-about__p{font-size:var(--fs-md);line-height:1.6}
@container page (min-width:40rem) and (max-width:63.99rem){.sm-about__pic img{aspect-ratio:1/1}}
@container page (min-width:64rem){[data-about="a"] .sm-about__pic img{aspect-ratio:9/16}}


/* Sourced.media: the renderer's additions to Design's stylesheet (appended after site.css on install).
   site.css is Design's round twelve as generated (r55, pulled 7 Oct 2026, byte for byte): Part One and Part Two are in
   it, so the rules this file carried that r55 now draws are gone: More on Sourced.media (finding 1), the form's two
   hidden guards (finding 8) and its honeypot (finding 5), the 404's links (41), the organisation's mark padding (33),
   the topic page's pair line (3), the insight's paragraph gaps (42), the consent sheet's interim scroll padding (14,
   now the script's alone), the show's actions, Claim this page and the About page's list (Design's classes now), and
   the form's own interim parts Design's promote page replaces (the carried line, the purpose's legend, the rows' rule,
   the sent state's onward link, the card's Promote). What stays is the RENDERER'S OWN, each with the reason it stays.
   Tokens only; no new colour or size. */

/* ---- RENDERER'S OWN: the transcript lane's parts in Design's record (render_web flavour "sm"). Stays: r55 draws no
   rule for .sm-tx__sec, .sm-tx__span, .pair or .sm-turn__p; the one rule on an r55 class, .sm-turn .sm-turn__at, zeroes
   r55's side margins on the time link on purpose, because the renderer prints the parentheses around the time itself
   ("(0:00):", spans of .sm-turn__p) and r55's margins would open gaps inside them (the fixer of part D, finding S-2). The chapter number from data-n (the heading's text stays the chapter title, which the transcript lint
   reads), the chapter's time span, the speaker's pair, the punctuation around the time kept in the text for a reader
   that strips tags and set quiet beside it */
.sm-tx__sec{scroll-margin-top:80px}
.sm-tx__ch h3[data-n]::before{content:attr(data-n);margin-right:.5em;color:var(--muted);font-variant-numeric:tabular-nums}
.sm-tx__span{margin-top:var(--s-1);font:var(--fw-regular) 12.5px/1.45 var(--font-body);color:var(--muted);font-variant-numeric:tabular-nums}
.sm-tx__span+.sm-turn{margin-top:var(--s-3)}
.sm-turn .pair{color:var(--ink-2)}
.sm-turn .sm-turn__at{margin:0}
.sm-turn__p{color:var(--muted);font:var(--fw-regular) 12.5px/1 var(--font-body)}

/* ---- RENDERER'S OWN (operator, v1 review, 2 Oct 2026, Q2): the jump to More on Sourced.media (id more, at the foot
   of an episode page) lands clear of the sticky masthead, as On this page's link and the transcript's skip link need.
   Stays: Design's round twelve draws the block (findings 1 and 121) with no scroll margin of its own, where its
   chapters and transcript keep 80px */
#more{scroll-margin-top:80px}

/* ---- RENDERER'S OWN: the featured module's episode card (the episode, story and insight pages keep the three cards)
   takes its picture by tier, the landscape from 64rem and the square below. Stays: r55 draws the card's single img,
   not a <picture> */
.sm-card__media>picture{display:block;width:100%;height:100%}
.sm-card__media>picture>img{width:100%;height:100%;object-fit:cover;object-position:var(--face-x,50%) var(--face-y,40%)}
@container page (max-width:63.99rem){.sm-featured .sm-card:not(.sm-card--entity) .sm-card__media{aspect-ratio:1/1}}

/* ---- RENDERER'S OWN (7 Oct 2026, the approved copy, HANDOFFS/2026-10-07-build.md C.R 2): Partner's show hint under
   its label, in the field note's face, read as the field's description. Stays: Design's round-thirteen form puts the
   hint inside the label, where it would join the field's name. (The fields note's own rules retired into r56, which
   draws .sm-ask__note and hides it under .js.) */
.sm-field__hint{font:var(--fw-regular) 12.5px/1.45 var(--font-body);color:var(--muted)}

/* ---- RENDERER'S OWN (step 1 verification, 6 Oct 2026, finding BR-1): a field the form flags (aria-invalid, set by
   js/sm.js for an invalid post and by the Worker's no-script line) is drawn in the error colour its line uses. Stays:
   r55 marks the field for assistive technology only (finding 28) and draws nothing for it */
.sm-ask .sm-field [aria-invalid="true"]{border-color:var(--danger);box-shadow:inset 0 0 0 1px var(--danger)}

/* ---- RENDERER'S OWN (7 Oct 2026, the approved 1.16a): the outlets' note under their list, small, closer to the list.
   Stays: Design's About page has no note under the outlets. In the policy grammar (.sm-sec) and in Design's About
   (.sm-about) alike */
.sm-about .sm-about__note,.sm-sec>.sm-about__note{margin-top:var(--s-3);font-size:var(--fs-sm);color:var(--ink-2)}

/* ---- RENDERER'S OWN (6 Oct 2026, step 1): a section other pages link by its id (/privacy/#form, the form's privacy
   line; the policy's sections) lands clear of the masthead, as Design's chapters and transcript do. Stays: r55 gives the
   policy's sections no scroll margin */
.sm-policy>.sm-sec[id]{scroll-margin-top:80px}

/* ---- RENDERER'S OWN (quality round 1, 4 Oct 2026; finding perf:youtube-iframe-loads-without-click): the full
   episode's player loads on press (theme.facade, js/sm.js). Stays: r55 hides the poster and the control without script
   but draws nothing for the <noscript> frame, which plays in the facade's box, nor hides the waiting frame, which has no
   address */
html:not(.js) .sm-facade>noscript>.sm-facade__frame{position:absolute;inset:0;width:100%;height:100%;border:0}
html:not(.js) .sm-facade>.sm-facade__frame[data-src]{display:none}

/* ---- RENDERER'S OWN (quality round 1, 4 Oct 2026; finding a11y:tab-stops-transcript): the skip link at the head of
   the transcript, past its time links, keeping .sm-skip's look and its hiding until focused but in the flow of the
   record. Stays: r55's .sm-skip is the page's own, at the top */
.sm-skip.sm-skip--tx{position:relative;left:auto;top:auto;display:inline-block;margin-bottom:var(--s-3)}

/* ---- RENDERER'S OWN (the 7 October verification, finding BR7-3): an Audio row's play button while its file plays
   (aria-pressed, set by sm.js) takes the accent colour Design gives the button on hover. Stays: r55 has no pressed
   state, and its script does not play the rows */
.sm-aud__play[aria-pressed="true"]{background:var(--accent)}

/* ---- RENDERER'S OWN (the 7 October build, part D, lane P1): the About page in Design's ledger rows (round twelve,
   pages/about.html) carries the approved offer's two lists, the pages and the assets, after a paragraph and after each
   other, where Design draws one list first in its row: a list after a paragraph or after a list keeps the paragraphs'
   gap, so the two read as two; and the cite line that closes the page sits under the last row's rule rather than
   drawing a second one. Stays: r55 sets the list at margin 0 and draws no cite line on the About page */
.sm-about .sm-about__p+.sm-about__list,.sm-about .sm-about__list+.sm-about__list{margin-top:var(--s-5)}
.sm-about .sm-cm-rows+.sm-cite{margin-top:0;border-top:0}

/* ---- RENDERER'S OWN (10 October 2026, the operator's Q48 with the stills run held at its gates): a viewer tile that
   has one shape only is marked data-fixed with it and keeps its own box while the grid shows another shape; its picture
   is left alone by the script (thumbOf finds no file for the chosen shape). Stays until every tile carries three shapes */
.sm-grid[data-shape="square"] .sm-tile[data-fixed="landscape"] .sm-tile__box,.sm-grid[data-shape="portrait"] .sm-tile[data-fixed="landscape"] .sm-tile__box,.sm-grid[data-shape="auto"] .sm-tile[data-fixed="landscape"] .sm-tile__box{aspect-ratio:16/9}
.sm-grid[data-shape="square"] .sm-tile[data-fixed="portrait"] .sm-tile__box,.sm-grid[data-shape="landscape"] .sm-tile[data-fixed="portrait"] .sm-tile__box{aspect-ratio:9/16}
.sm-grid[data-shape="landscape"] .sm-tile[data-fixed="square"] .sm-tile__box,.sm-grid[data-shape="portrait"] .sm-tile[data-fixed="square"] .sm-tile__box,.sm-grid[data-shape="auto"] .sm-tile[data-fixed="square"] .sm-tile__box{aspect-ratio:1/1}

/* ---- THE HOST LINE'S LINK ON ONE LINE (RENDERER'S OWN, the operator's ruling of 11 October 2026: "keep 'Partner your
   show' on one line on a phone, in site-additions.css, and note it for Design"): the tail strip's link in the shows mark
   broke after "Partner" at 390; the sentence may wrap before the link, never inside it. A ruled override of Design's own
   selectors (tests/test_r12_s.py RULED_OVERRIDES). Stays until Design draws its own answer
   (HANDOFFS/2026-10-11-notes-for-design.md, note 1) */
.sm-hostline a,.sm-footer__host a{white-space:nowrap}

/* ---- THE WHOLE FRAME IN FULL SCREEN (RENDERER'S OWN, his finding of 15 October 2026, before launch: "the Sourced.media
   title top left and the show mark top right are cropped; they should sit inside the safe area at every size"): Design
   fits a framed video by cover, so a 16:9 file on a 16:10 screen lost its sides in full screen, the burned title and
   mark with them. In full screen the file is contained, whole and centred, at every size. Stays until Design draws its
   own full-screen rule (round 15). One rule per prefix, since a browser drops a list that holds a pseudo-class it does
   not know. */
.sm-stage__frame>video:fullscreen,.sm-player video:fullscreen{object-fit:contain!important;object-position:50% 50%!important}
.sm-stage__frame>video:-webkit-full-screen,.sm-player video:-webkit-full-screen{object-fit:contain!important;object-position:50% 50%!important}

/* ---- THE STAGE'S CONTROLS STAY UNDER THE POINTER (RENDERER'S OWN, his finding of 15 October 2026, before launch: "the
   controls disappear when the pointer moves onto them; they should stay while the pointer is over the player"): once
   Play swaps the still for the video, Design's duration badge still lay over the foot of the frame, so the pointer
   moving onto the video's own controls landed on the badge, the video lost the hover and hid them. With a video in the
   frame the badge goes (the controls show the time). Stays until Design draws the playing stage (round 15). */
.sm-stage__frame>video~.sm-player__bar{display:none}

/* ---- RENDERER'S OWN (round 15b, item 1; the operator's rules of 17 October 2026 from his look at the built site): ROW
   BALANCE. Every row of like cells equal height (the feeds stretch their cells); the kicker at the top; the button or the
   meta line pinned to the bottom; the home row's three pictures one ratio (portrait, 3:4,
   from the 9:16 renditions). Stays: Design's sheet lays the cards as grids aligned to the start, with no pin and no
   clamp, and draws the home row's pictures at 16:9. Tokens only. */
.sm-feed.sm-feed--two,.sm-feed.sm-feed--four,.sm-feed.sm-feed--people{align-items:stretch}
.sm-feed>.sm-card.sm-card{display:flex;flex-direction:column}
.sm-feed>.sm-card>.sm-card__body{display:flex;flex-direction:column;flex:1 1 auto;gap:var(--s-4)}
.sm-feed>.sm-card>.sm-card__body>.sm-card__act,.sm-feed>.sm-card>.sm-card__body>.sm-card__chips:last-child{margin-top:auto}
.sm-feed>.sm-card--insight>.sm-card__go,.sm-feed>.sm-card--insight>.sm-card__x:last-child,.sm-feed>.sm-card--insight>.sm-card__chips:last-child{margin-top:auto}
.sm-feed>.sm-card--entity>.sm-card__x:last-child{margin-top:auto}
/* no clamp on a card's title (the operator, 17 October 2026, 15b: "a question is never cut on a card; let the row grow,
   equal height still holds") */
.sm-card__thumb--mark{display:grid;place-items:center;background:var(--ground)}
.sm-card__thumb--mark>img{width:72px;height:72px}
/* (the home row's rules of round 15b, his corrections 1 and 2, retired 18 October 2026: Design's round 16 draws the row
   at one ratio, the square, and the hero's foot; his decision 6) */

/* ---- RENDERER'S OWN (round 15b, items 4 and 5): the kind icon beside a strip's or a row's label, in the heading's own
   ink; the topic row's block on an episode page (opening More on Sourced.media) and a show page (under the stat cards).
   Stays: Design draws no glyph in a strip's heading and no topic block on those two pages. */
.sm-sect__head h2>.sm-kind,.sm-row__head :is(h2,h3)>.sm-kind{color:currentColor;vertical-align:-.12em;margin-right:.35em}
.sm-sect__head h2>.sm-kind--lg{width:24px;height:24px}
.sm-topics--episode{margin:0 0 var(--s-6);padding:0;border-top:0}
.sm-topics--show{margin-top:var(--s-6)}

/* ---- RENDERER'S OWN (the operator, 17 October 2026, round 15b): on a person's or an organisation's page the Featured
   panel keeps the rule that the page never carries another person's picture, but is not text only: its picture slot
   falls back to the show's mark, centred in the media box. Stays: Design draws the slot's picture as a 16:9 lead. */
.sm-promo--mark .sm-promo__media{display:grid;place-items:center;background:var(--ground);border:var(--hairline)}
.sm-promo--mark .sm-promo__media>img{width:40%;max-width:160px;height:auto;aspect-ratio:1/1;object-fit:contain}
/* the renderer's placing of it on the episode tail: in the host line's aside, on the measure as the line stood */
.sm-hostline--house>.sm-pnl{margin:0}
@container page (min-width:40rem){.sm-hostline--house>.sm-pnl{grid-column:measure}}
/* the house row beside its words (from 44rem of the panel's width): the picture fills its column at the row's height, so a
   row whose words run taller than the picture's 16:9 never widens the picture over them (measured on the episode tail at
   1440: the 16:9 grew to 447px in a 404px column and covered the words' first letters) */
@container pnl (min-width:44rem){.sm-pnl--house[data-shape="landscape"] .sm-pnl__pic{aspect-ratio:auto;min-width:0}}

/* ---- RENDERER'S OWN, THE FRONT-END FIXES OF 18 OCTOBER 2026 (HANDOFFS/2026-10-18-state-of-play.md, FE1 to FE11; his
   decisions of that evening). Stays until Design's sheet draws its own answer; Design is frozen for v1. Tokens only. */
/* FE1: a panel's title link keeps the frame's own colour. The quiet-link rule (running text: ink, a hairline underline)
   reached a title printed as a <p> (the insight margin's tall panel), painting the name in the frame's ground on 52 pages,
   both themes */
.sm-pnl .sm-pnl__t a:not([class]),.sm-pnl .sm-pnl__t a:not([class]):is(:hover,:focus-visible){color:inherit;text-decoration:none}
/* FE4: a topic with no page of its own (the topic links rule, decision 14) prints as a span; it takes the link's face, the
   icon beside the words and the count on the line */
.sm-topicrow li>span{display:inline-flex;align-items:center;gap:6px;min-height:24px;color:var(--ink);font:var(--fw-medium) 13px/1.3 var(--font-body)}
/* FE6: the kind icon beside a strip's or a row's label, not above it (Design's base draws every svg as a block) */
.sm-sect__head h2>.sm-kind,.sm-row__head :is(h2,h3)>.sm-kind{display:inline-block}
/* FE6, the part A pre-run of 28 October 2026: in the stack's 14rem column at 1440 the icon (24px) and "Organisations"
   (189px) did not fit the column's 200px of content, so the word wrapped under its icon; the label never breaks between
   the icon and the word, and runs into the column's own padding (Design's sheet: the column is 14rem with s-6 of padding) */
@container page (min-width:64rem){.sm-row>.sm-row__head>:is(h2,h3){white-space:nowrap}}
/* the show page's Topics head is the first heading after its h1 (the part A pre-run, axe heading-order): an h2 in the
   caps face, as the episode and person pages' record blocks have theirs */
.sm-record__topics>h2{margin-bottom:var(--s-3)}
/* FE11, his decision 4: the hover zoom and the arrow nudge off for launch ("nothing else moves"), without the motion switch,
   which also carries the fade-up he left off: Design's own cancelling rule of css/r15.css, keyed on the page */
:root :is(.sm-tile:hover .sm-tile__box>img,.sm-tile:hover .sm-tile__box>picture>img,.sm-tile:hover .sm-dip img,.sm-pnl:hover .sm-pnl__pic img,.sm-side:hover .sm-side__pic img,.sm-item:hover .sm-item__media img,.sm-card--insight:hover .sm-card__thumb img,.sm-placement__item:hover .sm-placement__media img,.sm-promo__in:hover .sm-promo__media img,.sm-drow__thumb:hover img,.sm-card:hover .sm-card__media img,.sm-person:hover img,.sm-person:hover .sm-mono,.sm-rec__media:hover img){scale:none}
:root :is(.sm-seeall:hover .sm-i,.sm-promote:hover .sm-i,.sm-back:hover .sm-i,.sm-pnl:hover .sm-pnl__go .sm-i,.sm-dlfoot h2 a:hover .sm-i){translate:none}
:root .sm-player:hover .sm-player__play{scale:none}
/* FE3: the show page's stat cards shrink to the column on a phone (three at 120px and two gaps were 384px in a 350px
   column, and the page scrolled sideways at 390) */
.sm-stats{grid-template-columns:repeat(auto-fit,minmax(min(7.5rem,100%),1fr))}
@container page (max-width:39.99rem){.sm-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* FE10: the 404's links clear the search box */
.sm-idx__search+.sm-cm-steps{margin-top:var(--s-7)}

/* ---- RENDERER'S OWN, THE WORDING PASS (his approval of 19 October 2026, HANDOFFS/2026-10-18-wording-pass.md): a label
   set in small caps where a colon had joined it to its line. Stays: Design's sheet draws neither the story's From the
   recording list, the synopsis caption's label, nor a takeaway's head. Tokens only. */
.sm-src--rec>.sm-caps{margin:0 0 var(--s-1)}
.sm-src--rec>ul{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-4);margin:0;padding:0;list-style:none}
.sm-fig__label{display:block;margin-bottom:var(--s-1)}
.sm-takeaways__h{display:block;font-weight:var(--fw-medium)}

/* ---- RENDERER'S OWN, THE FRONT DOOR'S TWO PANELS (the 29 October review round, item 3: the guests and organisations
   panel comes off the front door): from 64rem the row of panels shares its width between the two left, as Design's three
   did, so no empty third column stands at the right. Stays: Design's sheet draws the row for three panels
   ([data-hero="open"] .sm-hero__sides, repeat(3)) and Design is frozen for v1. Tokens only. (The Promote panel's
   Edited by cell of 27 October retires with the panel.) */
@container page (min-width:64rem){[data-hero="open"] .sm-hero__body>.sm-hero__sides:has(>.sm-side:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}}