/* FSI Publication System — paper page.
   Direction: the intelligence product, set with a book's care.
   Report-cover title block, keyed judgments, a permanent apparatus gutter.
   Consumes css/paper-tokens.css only. */

.paper{background:var(--p-paper);color:var(--p-ink);font-family:var(--p-body)}
/* Jump targets must land below the sticky header, not behind it. */
.paper [id]{scroll-margin-top:calc(var(--p-header-h) + 1.5rem)}

/* The document is exactly mainline + gap + gutter wide. Nothing is left over. */
.paper-wrap{max-width:var(--p-doc-w);margin:0 auto;padding:0 clamp(1.25rem,5vw,2rem)}
.paper-doc{display:grid;grid-template-columns:var(--p-rail-w) minmax(0,1fr);gap:0 var(--p-rail-gap)}
.paper-body{grid-column:2;min-width:0;max-width:var(--p-body-w)}

/* ---------- Contents rail ---------- */
.paper-rail{grid-column:1;position:sticky;top:calc(var(--p-header-h) + 2rem);align-self:start;padding-top:clamp(2.5rem,6vw,4.5rem);max-height:calc(100vh - var(--p-header-h) - 4rem);overflow-y:auto}
.rail-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:var(--p-s2)}
.rail-head .lab{color:var(--p-navy)}
.rail-toggle{border:0;background:transparent;cursor:pointer;color:var(--p-ink-faint);font:400 1rem/1 var(--p-mono);padding:0 .2rem}
.rail-toggle:hover{color:var(--p-navy)}
.rail-nav{position:relative;padding-left:1rem}
/* The reading-progress spine — how far in you are, held in the rail. */
.rail-nav::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--p-rule-soft)}
.rail-prog{position:absolute;left:0;top:0;width:2px;height:0;background:var(--p-navy);transition:height .12s linear}
.rail-nav ol{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.rail-nav a{
  display:block;font-size:.83rem;line-height:1.35;color:var(--p-ink-faint);
  text-decoration:none;text-wrap:pretty;transition:color .15s ease;
}
.rail-nav a:hover{color:var(--p-navy)}
.rail-nav a[aria-current=true]{color:var(--p-ink);font-weight:600}
.rail-nav a:focus-visible{outline:2px solid var(--p-adopt);outline-offset:2px}
.paper-rail[data-collapsed] .rail-nav{display:none}

/* Mobile: the contents become a persistent picker at the top of the screen. */
body.paper .scroll-progress{display:none}
.rail-mobile{display:none;position:sticky;top:0;z-index:70;background:var(--p-paper);
  padding:.6rem 0;border-bottom:1px solid var(--p-rule)}
.rail-mobile::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;
  background:var(--p-navy);transform-origin:0 50%;
  transform:scaleX(var(--p-read,0));
}
.rail-mobile select{
  width:100%;padding:.7rem 2.2rem .7rem .8rem;border:1px solid var(--p-navy);border-radius:1px;
  background:var(--p-paper);color:var(--p-navy);font:600 var(--p-t-small)/1.2 var(--p-body);
  appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%231c1d5f' stroke-width='1.6'/></svg>");
  background-repeat:no-repeat;background-position:right .8rem center;
}

/* Shared rule-line label, used across every block. */
.lab{
  font-family:var(--p-mono);font-size:var(--p-t-micro);font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;color:var(--p-ink-faint);
}

/* ---------- Title block ---------- */
.paper-masthead{padding:clamp(2.5rem,6vw,4.5rem) 0 0}

.mh-slug{
  max-width:var(--p-measure);
  display:flex;flex-wrap:wrap;gap:.55rem;align-items:baseline;
  padding-bottom:.7rem;
  font-family:var(--p-mono);font-size:var(--p-t-micro);
  letter-spacing:.13em;text-transform:uppercase;color:var(--p-ink-faint);
}
.mh-slug .prog{color:var(--p-adopt);font-weight:600}
[data-program=defend] .mh-slug .prog{color:var(--p-defend)}
[data-program=advance] .mh-slug .prog{color:var(--p-advance)}
.mh-slug .sep{color:var(--p-rule)}
.mh-slug .ref{margin-left:auto;color:var(--p-ink-faint)}

.paper-question{
  margin:var(--p-s2) 0 0;max-width:26ch;
  font-family:var(--p-display);font-weight:400;
  font-size:var(--p-t-question);line-height:.98;letter-spacing:-.02em;
  color:var(--p-navy);text-wrap:balance;
}
.paper-stakes{
  margin:var(--p-s3) 0 var(--p-s5);max-width:var(--p-measure);
  font-size:var(--p-t-lede);line-height:1.5;color:var(--p-ink-soft);text-wrap:pretty;
}

/* Metadata strip — the thing that makes it read as a document, not a blog post. */
.mh-meta{
  max-width:var(--p-measure);
  display:grid;grid-template-columns:1fr auto auto auto;gap:var(--p-s3) var(--p-s3);
  align-items:end;padding:var(--p-s3) 0;
  border-top:1px solid var(--p-rule);border-bottom:1px solid var(--p-rule);
}
.mh-field{display:grid;gap:.3rem;min-width:0}
.mh-field .lab{font-size:.62rem;letter-spacing:.14em}
.mh-field .val{font-size:var(--p-t-small);line-height:1.35;color:var(--p-ink);font-weight:600}
.mh-field .sub{font-size:var(--p-t-micro);color:var(--p-ink-faint);font-weight:400}
.mh-actions{display:flex;gap:.5rem;grid-column:4;justify-self:end}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
  line-height:1.2;min-height:2.5rem;
  padding:.55rem .9rem;border:1px solid var(--p-rule);border-radius:1px;
  background:transparent;color:var(--p-navy);cursor:pointer;white-space:nowrap;
  font-family:var(--p-body);font-size:var(--p-t-small);font-weight:600;text-decoration:none;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.btn:hover{background:var(--p-navy);border-color:var(--p-navy);color:#fff}
.btn:focus-visible{outline:2px solid var(--p-adopt);outline-offset:2px}

/* Share popover — sharing is sharing a link, so make the link feel good. */
.share-wrap{position:relative}
.share-pop{
  position:absolute;top:calc(100% + .5rem);right:0;z-index:60;width:16rem;
  padding:.4rem;background:var(--p-paper);border:1px solid var(--p-navy);border-radius:1px;
  box-shadow:0 18px 40px rgba(23,24,69,.14);display:none;
}
.share-pop[data-open]{display:block}
.share-pop button,.share-pop a{
  display:flex;width:100%;align-items:center;gap:.6rem;padding:.6rem .7rem;
  border:0;background:transparent;color:var(--p-ink);cursor:pointer;text-decoration:none;
  font:600 var(--p-t-small)/1.2 var(--p-body);text-align:left;border-radius:1px;
}
.share-pop button:hover,.share-pop a:hover{background:var(--p-paper-tint);color:var(--p-navy)}
.share-pop .k{font-family:var(--p-mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--p-ink-faint);margin-left:auto}
.share-pop .done{color:var(--p-adopt)}

/* ---------- What we found — the 30-second path ---------- */
.findings{margin:var(--p-s5) 0 var(--p-s6);counter-reset:finding}
.findings h2{margin:0 0 var(--p-s3);max-width:var(--p-measure)}
.findings ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--p-rule);max-width:var(--p-measure)}
.findings li{counter-increment:finding;border-bottom:1px solid var(--p-rule-soft)}
.findings a{
  display:grid;grid-template-columns:2.9rem 1fr auto;gap:var(--p-s2);align-items:baseline;
  padding:var(--p-s3) 0;text-decoration:none;color:var(--p-ink);
}
.findings a::before{
  content:"0" counter(finding);
  font-family:var(--p-mono);font-size:var(--p-t-micro);letter-spacing:.06em;color:var(--p-ink-faint);
}
.findings .txt b{font-weight:600;color:var(--p-navy)}
.findings a .txt{font-size:1.1rem;line-height:1.5;text-wrap:pretty}
.findings a .go{
  font-family:var(--p-mono);font-size:var(--p-t-micro);color:var(--p-ink-cue);
  letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;
  transition:color .15s ease;
}
.findings a:hover{color:var(--p-navy)}
.findings a:hover .go,.findings a:focus-visible .go{color:var(--p-adopt)}
.findings a:focus-visible{outline:2px solid var(--p-adopt);outline-offset:3px}

/* ---------- Mainline ---------- */
.paper-mainline{position:relative;padding-bottom:var(--p-s5)}
.paper-mainline p,.paper-mainline .sec{max-width:var(--p-measure)}
.paper-mainline p{
  margin:0 0 var(--p-s3);font-size:var(--p-t-body);line-height:var(--p-lh-body);
  color:var(--p-ink);text-wrap:pretty;
}
.paper-mainline strong{font-weight:650;color:var(--p-navy)}
.paper-mainline .sec{
  margin:var(--p-s5) 0 var(--p-s3);padding-top:var(--p-s3);
  border-top:1px solid var(--p-rule-soft);
  font-family:var(--p-display);font-weight:400;
  font-size:1.55rem;line-height:1.15;color:var(--p-navy);text-wrap:balance;
}
.paper-mainline .drop::first-letter{
  float:left;font-family:var(--p-display);font-size:3.7em;line-height:.8;
  padding:.05em .1em 0 0;color:var(--p-navy);
}


/* Deep-link flash target */
:target,.is-target{animation:tflash 1.6s ease}
@keyframes tflash{0%,55%{background:rgba(0,173,255,.13)}100%{background:transparent}}
@media (prefers-reduced-motion:reduce){:target,.is-target{animation:none;background:rgba(0,173,255,.1)}}

/* Inline excursion marker */
.ex-mark{
  display:inline-block;vertical-align:super;margin-left:.15em;
  font-family:var(--p-mono);font-size:.6rem;letter-spacing:.02em;
  color:var(--p-adopt);text-decoration:none;
}
.ex-mark:hover,.ex-mark:focus-visible{color:var(--p-navy);text-decoration:underline}

/* ---------- Excursions ---------- */
.excursion{margin:0 0 var(--p-s4);border-top:1px solid var(--p-navy);background:transparent}
.excursion>summary{list-style:none;cursor:pointer;padding:.85rem 0 1rem;display:grid;gap:.5rem}
.excursion>summary::-webkit-details-marker{display:none}
.excursion .kind{
  font-family:var(--p-mono);font-size:.62rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--p-adopt);
}
.excursion .label{
  font-family:var(--p-display);font-size:1.06rem;line-height:1.22;color:var(--p-navy);text-wrap:pretty;
}
/* A preview line, so a desktop reader gets value without clicking.
   Requiring a click on desktop defeats the point of a margin note. */
.excursion .peek{
  font-size:.83rem;line-height:1.55;color:var(--p-ink-soft);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.excursion>summary{grid-template-columns:1fr auto;grid-template-areas:"kind plus" "label plus" "peek peek"}
.excursion .kind{grid-area:kind}
.excursion .label{grid-area:label}
.excursion .peek{grid-area:peek}
.excursion .open-cue{
  grid-area:plus;align-self:start;justify-self:end;
  width:1.35rem;height:1.35rem;display:grid;place-items:center;
  border:1px solid var(--p-rule);border-radius:1px;
  font:400 1rem/1 var(--p-mono);color:var(--p-ink-faint);
}
.excursion .open-cue::before{content:"+"}
.excursion[open] .open-cue::before{content:"\2212"}
.excursion>summary:hover .label,.excursion>summary:focus-visible .label{color:var(--p-adopt)}
.excursion>summary:hover .open-cue{color:var(--p-adopt);border-color:var(--p-adopt)}
.excursion>summary:focus-visible{outline:2px solid var(--p-adopt);outline-offset:3px}
.excursion[open] .peek{display:none}

.excursion .ex-body p{margin:0 0 .9rem;font-size:.88rem;line-height:1.62;color:var(--p-ink-soft);max-width:none}
.excursion .ex-body{padding-bottom:.4rem}
.excursion.is-flash{background:rgba(0,173,255,.07)}

@media (min-width:1100px){
  .paper-mainline,.has-gutter{padding-right:calc(var(--p-margin-w) + var(--p-margin-gap))}
  .has-gutter{position:relative}
  .has-gutter::after{content:"";display:block;clear:both}
  .excursion{
    position:relative;
    float:right;clear:right;width:var(--p-margin-w);
    margin-right:calc(-1 * (var(--p-margin-w) + var(--p-margin-gap)));
    margin-bottom:var(--p-s4);
  }
  .paper-mainline::after{content:"";display:block;clear:both}

  /* The gutter expands into its own layer. An excursion is a float, so growing
     it in flow lengthens the article and pushes the entire page below it down —
     opening a side note must never move the text you are reading. The card keeps
     its collapsed footprint and the body renders as a panel hung beneath it. */
  .excursion[open]{z-index:40}
  .excursion[open] .ex-body{
    position:absolute;top:100%;left:0;width:100%;
    padding:0 0 var(--p-s3);
    /* Opaque because it is a layer, and otherwise nothing: a margin note is
       typography, not a popover. No box, no shadow, no tint — the text aligns
       flush with the label above it, the way Tufte and Distill set them. */
    background:var(--p-paper);
    border-bottom:1px solid var(--p-rule-soft);
  }
  .excursion[open] .ex-body p:first-child{margin-top:0}
}
@media (max-width:1439px){
  .paper-doc{display:block}
  .paper-rail{display:none}
  .paper-body{max-width:var(--p-body-w);margin:0 auto}
  .rail-mobile{display:block}
}
@media (max-width:1099px){
  .fig{max-width:none}
  .excursion{border-top:1px solid var(--p-navy);border-bottom:1px solid var(--p-rule-soft);background:transparent;padding:0}
  .excursion .peek{display:none}
}

/* Reveal is progressive enhancement: visible by default, animated only when
   JS explicitly marks a card pending. No JS never means no excursion. */
@media (prefers-reduced-motion:no-preference){
  @media (min-width:1100px){
    .excursion.is-pending{opacity:0;transform:translateY(10px)}
    .excursion.is-in{opacity:1;transform:none;transition:opacity .45s ease,transform .45s ease}
  }
}

/* ---------- Contact ---------- */
.paper-contact{margin:0 0 var(--p-s6);padding:var(--p-s5) 0;border-top:1px solid var(--p-navy)}
.paper-contact h2{
  margin:0 0 var(--p-s2);font-family:var(--p-display);font-weight:400;
  font-size:1.55rem;line-height:1.2;color:var(--p-navy);max-width:none;text-wrap:balance;
}
.paper-contact p{margin:0 0 var(--p-s4);font-size:var(--p-t-body);line-height:1.6;color:var(--p-ink-soft);max-width:38rem;text-wrap:pretty}
.paper-contact .cta{
  display:inline-flex;align-items:center;gap:.6rem;padding:.8rem 1.5rem;
  background:var(--p-navy);color:#fff;text-decoration:none;border-radius:1px;
  font-size:var(--p-t-small);font-weight:600;
}
.paper-contact .cta:hover{background:var(--p-adopt)}

/* ---------- Foot matter ---------- */
.paper-foot{padding:0 0 var(--p-s6)}

.paper-foot h2{margin:0 0 var(--p-s2)}
.related{list-style:none;margin:0 0 var(--p-s6);padding:0;border-top:1px solid var(--p-rule)}
.related li{border-bottom:1px solid var(--p-rule-soft)}
.related a{
  display:grid;grid-template-columns:1fr auto;align-items:center;gap:.35rem var(--p-s3);
  padding:var(--p-s3) 0;text-decoration:none;color:var(--p-ink);
}
.related a::after{
  content:"\2192";grid-row:1 / span 2;grid-column:2;
  font-family:var(--p-body);font-size:1.05rem;color:var(--p-rule);
  transition:transform .18s ease,color .18s ease;
}
.related a:hover::after,.related a:focus-visible::after{color:var(--p-adopt);transform:translateX(4px)}
.related a:focus-visible{outline:2px solid var(--p-adopt);outline-offset:3px}
.related a:hover .rq,.related a:focus-visible .rq{color:var(--p-adopt)}
.related .rk{grid-column:1;font-family:var(--p-mono);font-size:var(--p-t-micro);letter-spacing:.13em;text-transform:uppercase;color:var(--p-ink-faint)}
.related .rq{grid-column:1;font-family:var(--p-display);font-size:1.2rem;line-height:1.25;color:var(--p-navy);text-wrap:pretty}
.related-note{font-size:var(--p-t-small);line-height:1.6;color:var(--p-ink-soft);margin:1.2rem 0 0;max-width:var(--p-measure)}
.related-note b{color:var(--p-ink);font-weight:600}
.cite-head{display:block;margin-top:var(--p-s4)}
.citation{
  max-width:var(--p-measure);padding:var(--p-s3);border:1px solid var(--p-rule-soft);border-radius:1px;background:var(--p-paper-tint);
  font-family:var(--p-mono);font-size:.76rem;line-height:1.7;color:var(--p-ink-soft);
}

/* ---------- Inline links — quiet, underlined, never a button ---------- */
.paper-mainline a.in{
  color:inherit;text-decoration:underline;text-decoration-thickness:1px;
  text-underline-offset:.16em;text-decoration-color:var(--p-rule);
  transition:color .15s ease,text-decoration-color .15s ease;
}
.paper-mainline a.in:hover{color:var(--p-adopt);text-decoration-color:var(--p-adopt)}

/* ---------- Figures ---------- */
.fig{margin:0 0 var(--p-s4)}
.fig figcaption{display:grid;gap:.3rem;padding-top:.6rem;border-top:1px solid var(--p-rule-soft)}
.fig .fig-no{font-family:var(--p-mono);font-size:.62rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--p-adopt)}
.fig .fig-cap{font-size:.85rem;line-height:1.5;color:var(--p-ink);text-wrap:pretty}
/* Every figure states its source. No exceptions — this is a credibility surface. */
.fig .fig-src{font-family:var(--p-mono);font-size:.66rem;line-height:1.5;color:var(--p-ink-faint)}
.fig-art{background:var(--p-paper-tint);border:1px solid var(--p-rule-soft);padding:var(--p-s2)}
.fig-art svg{display:block;width:100%;height:auto}

/* Figures are inline, always. They sit in the reading column and never enter
   the gutter — the gutter belongs to excursions alone. */
.fig{max-width:var(--p-measure);clear:both;margin:var(--p-s5) 0 var(--p-s5)}

/* Interactive chart — full colour at rest, isolate on hover. */
.chart{position:relative}
.chart svg text{font-family:var(--p-mono);fill:var(--p-ink-faint)}
.chart .grid line{stroke:var(--p-fig-grid);stroke-width:1}
.chart .band{fill:var(--p-fig-band)}
.chart .med{stroke:var(--p-fig-med);stroke-width:2.5}
.chart .cat{transition:opacity .18s ease}
.chart .cat .hit{fill:transparent;cursor:pointer}
.chart[data-focus] .cat{opacity:.22}
.chart[data-focus] .cat.is-on{opacity:1}
.chart .cat.is-on .band{fill:var(--p-fig-hi-band)}
.chart .cat.is-on .med{stroke:var(--p-fig-hi-med)}
.chart .cat.is-on .xlab{fill:var(--p-ink);font-weight:600}
.chart .cat:focus-visible .hit{outline:2px solid var(--p-adopt)}
.chart-tip{
  position:absolute;z-index:5;min-width:12.5rem;padding:.7rem .8rem;pointer-events:none;
  background:var(--p-paper);border:1px solid var(--p-navy);border-radius:1px;
  box-shadow:0 14px 34px rgba(23,24,69,.16);opacity:0;transform:translateY(4px);
  transition:opacity .14s ease,transform .14s ease;
}
.chart-tip[data-open]{opacity:1;transform:none}
.chart-tip .t-name{font-family:var(--p-body);font-size:var(--p-t-small);font-weight:700;color:var(--p-navy);margin-bottom:.4rem}
.chart-tip dl{display:grid;grid-template-columns:auto auto;gap:.2rem .9rem;margin:0}
.chart-tip dt{font-family:var(--p-mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--p-ink-faint)}
.chart-tip dd{margin:0;font-family:var(--p-mono);font-size:.72rem;color:var(--p-ink);text-align:right}
.chart-legend{display:flex;flex-wrap:wrap;gap:.45rem 1.3rem;padding:.75rem 0 .2rem;font-family:var(--p-mono);font-size:.64rem;letter-spacing:.08em;text-transform:uppercase;color:var(--p-ink-faint)}
.chart-legend i{display:inline-block;width:.85rem;height:.55rem;margin-right:.35rem;vertical-align:middle;background:var(--p-fig-band)}
.chart-legend i.m{height:2px;background:var(--p-fig-med)}

/* ---------- About the authors ---------- */
.authors{padding:var(--p-s5) 0;border-top:1px solid var(--p-navy)}
.authors h2{margin:0 0 var(--p-s4);font-family:var(--p-display);font-weight:400;font-size:1.7rem;color:var(--p-navy)}
.authors ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--p-s4) var(--p-s5)}
@media (min-width:900px){.authors ul{grid-template-columns:1fr 1fr}}
.authors li{display:grid;grid-template-columns:64px 1fr;gap:var(--p-s3);align-items:start}
.authors .shot{width:64px;height:64px;border-radius:1px;object-fit:cover;filter:grayscale(1);background:var(--p-paper-tint);
  border:1px solid var(--p-rule-soft);display:grid;place-items:center;
  font-family:var(--p-mono);font-size:.8rem;letter-spacing:.06em;color:var(--p-ink-faint)}
.authors .a-name{display:block;font-size:1rem;font-weight:700;color:var(--p-navy);margin-bottom:.15rem}
.authors .a-role{display:block;font-family:var(--p-mono);font-size:.64rem;letter-spacing:.13em;text-transform:uppercase;color:var(--p-ink-faint);margin-bottom:.45rem}
.authors .a-bio{margin:0;font-size:.9rem;line-height:1.6;color:var(--p-ink-soft);text-wrap:pretty}



/* ---------- Series hub ----------
   A hub is an index, not a document. It carries no apparatus: no contents rail,
   no gutter, no excursions, no PDF — those belong to the papers it points at.
   Its whole job is (1) who wrote this, (2) the argument in a line, (3) what is
   published and what is coming, (4) how to reach him. Reporters arrive here
   from a quote elsewhere, so the person comes first. */
.hub{max-width:var(--p-body-w);margin:0 auto}

.hub-head{padding:clamp(2.5rem,6vw,4.5rem) 0 0}
.hub-title{
  margin:var(--p-s2) 0 0;max-width:20ch;
  font-family:var(--p-display);font-weight:400;
  font-size:var(--p-t-question);line-height:.98;letter-spacing:-.02em;
  color:var(--p-navy);text-wrap:balance;
}
.hub-claim{
  margin:var(--p-s3) 0 var(--p-s5);max-width:42rem;
  font-size:var(--p-t-lede);line-height:1.5;color:var(--p-ink-soft);text-wrap:pretty;
}

/* The byline is the masthead here, not a footnote. */
.hub-by{
  display:grid;grid-template-columns:88px minmax(0,1fr);gap:var(--p-s3);align-items:center;
  padding:var(--p-s3) 0;border-top:1px solid var(--p-rule);border-bottom:1px solid var(--p-rule);
}
.hub-by img{width:88px;height:88px;object-fit:cover;border-radius:1px;filter:grayscale(1)}
.hub-by .n{display:block;font-family:var(--p-display);font-size:1.5rem;line-height:1.15;color:var(--p-navy)}
.hub-by .r{display:block;font-family:var(--p-mono);font-size:var(--p-t-micro);letter-spacing:.13em;text-transform:uppercase;color:var(--p-ink-faint);margin:.3rem 0 .5rem}
.hub-by .b{margin:0;font-size:.92rem;line-height:1.55;color:var(--p-ink-soft);max-width:34rem;text-wrap:pretty}
/* The name is the link to the biography — a button for it was one box too
   many, and stretching it to fill left a giant "Biography" beside a small
   "Share". Share is the only control here. */
.hub-by .n a{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .15s ease,color .15s ease}
.hub-by .n a:hover{color:var(--p-adopt);border-bottom-color:var(--p-adopt)}
.hub-by .n a:focus-visible{outline:2px solid var(--p-adopt);outline-offset:3px}


/* Press affordance. Anthropic puts press inquiries at the top of the newsroom;
   press-page practice says it belongs in one of the most prominent areas. On a
   page whose entire premise is a reporter arriving from a quote, burying it at
   the bottom was backwards. Typographic, not more buttons — the byline already
   carries the only control it can hold. */
.hub-press{
  display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.5rem;
  padding:var(--p-s3) 0;border-bottom:1px solid var(--p-rule);
}
.hub-press .k{
  font-family:var(--p-mono);font-size:var(--p-t-micro);font-weight:600;
  letter-spacing:.15em;text-transform:uppercase;color:var(--p-ink-faint);
}
.hub-press .mail{font-size:1.02rem;font-weight:600;color:var(--p-navy);text-decoration:none;border-bottom:1px solid var(--p-rule)}
.hub-press .kit{font-size:.88rem;color:var(--p-ink-soft);text-decoration:none;border-bottom:1px solid var(--p-rule)}
.hub-press a:hover{color:var(--p-adopt);border-bottom-color:var(--p-adopt)}
.hub-press .share-wrap{margin-left:auto}
@media (max-width:760px){ .hub-press .share-wrap{margin-left:0;width:100%} .hub-press .share-wrap .btn{width:100%} }

.hub-sec{margin:var(--p-s6) 0 0}
/* An ongoing page has to say it is ongoing. */
.hub-sec-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem 1rem;margin-bottom:var(--p-s2)}
.hub-sec-head .lab{margin:0}
.hub-updated{padding-left:1rem;border-left:1px solid var(--p-rule);font-family:var(--p-mono);font-size:var(--p-t-micro);letter-spacing:.12em;text-transform:uppercase;color:var(--p-ink-cue)}


@media (max-width:760px){
  .hub-title{max-width:none}
  .hub-by{grid-template-columns:64px minmax(0,1fr);gap:var(--p-s2) var(--p-s3);align-items:start}
  .hub-by img{width:64px;height:64px}
}

/* The published paper is the anchor of the hub, not one row in a list. It was
   buried at the bottom by a newest-first order that only makes sense once
   there is a stream of published work — with two of three unwritten, the page
   led with placeholders. Paper first; what is coming follows, in the order it
   will happen. */
.lead-entry{padding:var(--p-s4) 0 var(--p-s5);border-top:1px solid var(--p-navy)}
.lead-entry .dek:first-child{margin-top:0}
.lead-entry h2{
  margin:0 0 var(--p-s3);max-width:18ch;
  font-family:var(--p-display);font-weight:400;font-size:clamp(1.9rem,3vw,2.5rem);
  line-height:1.06;letter-spacing:-.01em;color:var(--p-navy);text-wrap:balance;
}
.lead-entry .dek{
  margin:0 0 var(--p-s4);max-width:40rem;
  font-size:1.18rem;line-height:1.6;color:var(--p-ink);text-wrap:pretty;
}
.lead-entry .actions{display:flex;flex-wrap:wrap;gap:.6rem}
.btn-lead{background:var(--p-navy);border-color:var(--p-navy);color:#fff}
.btn-lead:hover{background:var(--p-adopt);border-color:var(--p-adopt);color:#fff}
@media (max-width:760px){
  .lead-entry h2{max-width:none}
  .lead-entry .actions .btn{flex:1;min-width:9rem}
}

.entries{list-style:none;margin:0;padding:0;border-top:1px solid var(--p-navy)}
.entry{border-bottom:1px solid var(--p-rule-soft);padding:var(--p-s4) 0}
.entry-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:.55rem;margin-bottom:.7rem}
.entry-kind{font-family:var(--p-mono);font-size:var(--p-t-micro);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--p-adopt)}
.entry-date{font-family:var(--p-mono);font-size:var(--p-t-micro);letter-spacing:.12em;text-transform:uppercase;color:var(--p-ink-faint)}
.entry-head .sep{color:var(--p-rule)}
.entry h2{
  margin:0 0 .6rem;max-width:var(--p-measure);
  font-family:var(--p-display);font-weight:400;font-size:1.72rem;line-height:1.14;
  color:var(--p-navy);text-wrap:balance;
}
.entry .dek{margin:0 0 var(--p-s3);max-width:var(--p-measure);font-size:var(--p-t-body);line-height:1.6;color:var(--p-ink-soft);text-wrap:pretty}
.entry .actions{display:flex;flex-wrap:wrap;gap:.5rem}
.entry-state{
  font-family:var(--p-mono);font-size:var(--p-t-micro);letter-spacing:.12em;text-transform:uppercase;
  color:var(--p-ink-cue);padding:.15rem .45rem;border:1px solid var(--p-rule);border-radius:1px;
}
/* A slot is a promise, not a stub — quieter, but it still says what is coming. */
.entry[data-state="scheduled"] .entry-kind{color:var(--p-ink-faint)}
.entry[data-state="scheduled"] h2{color:var(--p-ink-faint);font-size:1.45rem}
.entry[data-state="scheduled"] .dek{color:var(--p-ink-faint)}
.entry[data-state="published"] .entry-state{color:var(--p-adopt);border-color:rgba(0,173,255,.4)}

@media (max-width:760px){ .entry h2{font-size:1.4rem} }

/* ---------- Sample marker ----------
   Not the old workshop bar. One quiet line above the page, plus a stamp in the
   slug so a screenshot of the masthead carries the warning too. Anything with
   placeholder body copy that leaves the building must say so on its face —
   Susan reads words for a living and these are not the Institute's. */
.sample-note{
  background:var(--p-navy);color:#fff;
  font-family:var(--p-mono);font-size:.68rem;letter-spacing:.05em;line-height:1.5;
}
.sample-note div{
  max-width:var(--p-doc-w);margin:0 auto;padding:.55rem clamp(1.25rem,5vw,2rem);
}
.sample-note b{font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.sample-note span{color:rgba(255,255,255,.72)}
.mh-slug .stamp{
  padding:.15rem .45rem;
  border:1px solid var(--p-rule);border-radius:1px;
  color:var(--p-ink-faint);letter-spacing:.14em;
}
@media print{ .sample-note{display:none} }

/* ---------- Mobile ---------- */
@media (max-width:760px){
  .paper-question{max-width:none;font-size:clamp(2.15rem,8.5vw,2.9rem)}
  .paper-stakes{max-width:none;margin-bottom:var(--p-s4)}
  /* Program takes its own line; the rest of the slug stays one wrapped row. */
  .mh-slug{gap:.4rem .55rem}
  .mh-slug .prog{flex:0 0 100%}
  .mh-slug .prog + .sep{display:none}
  .mh-slug .ref{margin-left:0}
  .mh-slug .ref::before{content:"/";color:var(--p-rule);margin-right:.55rem}
  .findings{margin:var(--p-s5) 0}
  .mh-meta{max-width:none;grid-template-columns:1fr 1fr;gap:var(--p-s3) var(--p-s2);align-items:start}
  .mh-meta .mh-field:first-child{grid-column:1 / -1}
  .mh-actions{grid-column:1 / -1;justify-self:stretch;display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.4rem}
  .mh-actions .btn{width:100%}
  .share-pop{left:0;right:auto;width:100%}
  .findings a{grid-template-columns:2.4rem 1fr;gap:.75rem}
  .findings a .go{display:none}
  .findings a .txt{font-size:1.02rem}
  .authors li{grid-template-columns:52px 1fr;gap:var(--p-s2)}
  .authors .shot{width:52px;height:52px}
  .chart-tip{min-width:0;width:calc(100% - 1.5rem)}
}

/* ---------- Print ---------- */
@media print{
  .mh-actions,.share-pop,[data-partial],.paper-rail,.rail-mobile,.chart-tip{display:none!important}
  .paper-wrap{max-width:none}
  .paper-doc{display:block}
  .fig{break-inside:avoid}
  .fig{max-width:none;margin:1rem 0}
  .paper-mainline{padding-right:0}
  .excursion{float:none;width:auto;margin:var(--p-s3) 0;break-inside:avoid;opacity:1;transform:none;border:1px solid #999;padding:0 .6rem}
  .excursion .ex-body{display:block!important;position:static;border:0;box-shadow:none;padding:0}
  .excursion .peek{display:none}
  .excursion>summary{cursor:default}
  .paper-question{font-size:26pt}
  body{font-size:10.5pt}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:.75em;color:#555}
}