/* Ysabeau, self-hosted. SIL Open Font Licence.
   Generated by fetch-fonts.py - do not edit by hand. */
@font-face{font-family:'Ysabeau';font-style:italic;font-weight:300;font-display:swap;src:url('/fonts/Ysabeau-300italic-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Ysabeau';font-style:italic;font-weight:300;font-display:swap;src:url('/fonts/Ysabeau-300italic-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Ysabeau';font-style:italic;font-weight:400;font-display:swap;src:url('/fonts/Ysabeau-400italic-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Ysabeau';font-style:italic;font-weight:400;font-display:swap;src:url('/fonts/Ysabeau-400italic-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Ysabeau';font-style:normal;font-weight:300;font-display:swap;src:url('/fonts/Ysabeau-300-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Ysabeau';font-style:normal;font-weight:300;font-display:swap;src:url('/fonts/Ysabeau-300-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Ysabeau';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/Ysabeau-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Ysabeau';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/Ysabeau-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Ysabeau';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/Ysabeau-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Ysabeau';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/Ysabeau-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Ysabeau';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/Ysabeau-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Ysabeau';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/Ysabeau-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Ysabeau SC';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/YsabeauSC-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Ysabeau SC';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/YsabeauSC-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Ysabeau SC';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/YsabeauSC-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Ysabeau SC';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/YsabeauSC-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* =====================================================================
   Editheria Nature Books — site stylesheet
   Ported verbatim from the approved prototypes. Tokens are the
   design system's own: do not invent values, add them upstream.
   ===================================================================== */
:root{
  --paper-cream:#fbf9f3; --paper-white:#fcfcf8;
  --surface-row:#eff0ee; --surface-field:#e1e3e0;
  --ink-body:#2f2b27; --ink-strong:#232323; --ink-forest:#35452b;
  --ink-quiet:#808080; --ink-hairline:#c9c9c9;
  --green-olive:#6e8a4e; --green-sage:#9ab499; --green-pale:#c9d6a7;
  --status-cr:#b61917; --status-en:#e77b4d; --status-vu:#e5d42d; --status-lc:#68bb53; --status-ink:#232323;

  --surface-page:var(--paper-cream);
  --text-body:var(--ink-body); --text-display:var(--ink-forest);
  --text-caption:var(--ink-quiet); --rule:var(--ink-hairline); --rule-soft:var(--green-sage);

  --font-core:"Ysabeau","Candara","Corbel","Trebuchet MS",system-ui,sans-serif;
  --font-label:"Ysabeau SC","Ysabeau","Candara",system-ui,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --text-micro:10px; --text-caption-sz:12px; --text-small:13px;
  --text-body-sz:15px; --text-body-lg:16px; --text-lead:18px;
  --text-subhead:20px; --text-title:24px; --text-display-sz:32px; --text-display-lg:44px;

  --leading-tight:1.2; --leading-snug:1.35; --leading-body:1.6;
  --tracking-wide:0.06em;

  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:19px;
  --space-6:24px; --space-7:32px; --space-8:38px; --space-9:48px; --space-10:64px;
  --space-11:76px; --space-12:96px;

  --hairline:1px;
  --border-hairline:var(--hairline) solid var(--rule);
  --border-frame:var(--hairline) solid var(--ink-strong);
  --border-soft:var(--hairline) solid var(--green-sage);
  --motion-base:200ms; --easing-standard:cubic-bezier(.4,0,.2,1);

  --measure:1180px; --chrome-ink:#5c665a; --chrome-rule:#d3d8cf;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);
  font:400 var(--text-body-sz)/var(--leading-body) var(--font-core);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;text-wrap:pretty}
/* ---------- THE SLOT ---------- */
.slot{border:1px dashed var(--green-sage);background:var(--paper-white);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:var(--space-2);text-align:center;padding:var(--space-5);width:100%}
.slot__id{font-family:var(--font-mono);font-size:11px;letter-spacing:.02em;
  color:var(--ink-forest);word-break:break-all}
.slot__size{font-family:var(--font-label);font-size:var(--text-micro);
  letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-caption)}
.slot__what{font-size:var(--text-caption-sz);color:var(--text-caption);max-width:32ch;line-height:var(--leading-snug)}
/* A FILLED slot keeps the proportions of its own artwork. The exports are
   cropped to their ink, so the file's shape is the shape the band wants; the
   width/height attributes stamped by build.py reserve the space before the
   image arrives, so nothing jumps. Ratio classes below apply to empty frames
   only, where a box has to be reserved for something that is not there yet. */
.filled{display:block;width:100%;height:auto;max-width:100%}
/* The badge is a vector: without a ceiling width:100% would print it the full
   width of the footer column. Amazon's own proportions are kept. */
.badge{margin-top:var(--space-4)}
.badge .filled{max-width:132px}
video.filled{background:var(--ink-strong)}
.slot--portrait{aspect-ratio:1650/2550}
.slot--spread{aspect-ratio:11/8.5}
.slot--wide{aspect-ratio:3/2}
.slot--video{aspect-ratio:16/9}
/* ---------- a single still where the carousel used to run ---------- */
.still,.gifts{margin:0 0 var(--space-9)}
.still figcaption,.gifts figcaption{margin-top:var(--space-4);
  font-size:var(--text-caption-sz);color:var(--text-caption)}
.gifts{max-width:820px}
.gifts__what{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-8);margin-bottom:var(--space-9)}
@media (max-width:760px){.gifts__what{grid-template-columns:1fr}}

/* ---------- hold a journal page to see it larger ---------- */
.peek{margin:0;cursor:zoom-in;position:relative;outline:none;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
  /* iOS raises a save-image callout on a long press, which is exactly the
     gesture that opens the enlarged view. */
  -webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.peek .filled{transition:transform 160ms ease}
@media (prefers-reduced-motion:reduce){.peek .filled{transition:none}}
.peek:hover .filled,.peek:focus-visible .filled{transform:scale(1.02)}
.peek:focus-visible{outline:1px solid var(--green-olive);outline-offset:6px}
.peek figcaption{margin-top:var(--space-3);text-align:center}
.peek__hint{font-family:var(--font-label);font-size:var(--text-micro);
  letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-caption);
  opacity:.75;transition:opacity 160ms ease}
.peek:hover .peek__hint{opacity:1;color:var(--green-olive)}
.tools--copy{margin-top:var(--space-8)}

/* The enlarged page. Fixed, above everything, and never interactive - it has
   to ignore the pointer or it would steal the mouseleave that dismisses it. */
.peekbox{position:fixed;inset:0;z-index:60;display:flex;align-items:center;
  justify-content:center;padding:var(--space-8);pointer-events:none;
  background:rgba(35,35,35,.55);opacity:0;visibility:hidden;
  transition:opacity 160ms ease,visibility 160ms}
.peekbox[data-shown]{opacity:1;visibility:visible}
@media (prefers-reduced-motion:reduce){.peekbox{transition:none}}
.peekbox figure{margin:0;max-width:min(1100px,92vw);text-align:center}
.peekbox img{display:block;width:100%;height:auto;max-height:82vh;object-fit:contain;
  background:var(--paper-cream);border:var(--border-frame)}
.peekbox figcaption{margin-top:var(--space-4);color:var(--paper-cream);
  font-family:var(--font-label);font-size:var(--text-caption-sz);
  letter-spacing:var(--tracking-wide);text-transform:uppercase}

/* ---------- shared furniture ---------- */
.band{padding:var(--space-11) var(--space-8);border-top:var(--border-hairline)}
.band__inner{max-width:var(--measure);margin:0 auto}
.eyebrow{font-family:var(--font-label);font-size:var(--text-caption-sz);
  letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--green-olive);margin:0 0 var(--space-4)}
.band__title{font-weight:400;font-size:var(--text-display-sz);line-height:var(--leading-tight);
  color:var(--text-display);margin:0 0 var(--space-6);text-wrap:balance;max-width:20ch}
.band__lede{font-size:var(--text-body-lg);max-width:60ch;margin:0 0 var(--space-9)}
h3{font-weight:400;font-size:var(--text-subhead);line-height:var(--leading-tight);
  color:var(--text-display);margin:0 0 var(--space-3)}
p{margin:0 0 var(--space-5)}
p:last-child{margin-bottom:0}
a{color:var(--green-olive);text-decoration:none;border-bottom:1px solid var(--green-pale);
  transition:color var(--motion-base) var(--easing-standard),border-color var(--motion-base) var(--easing-standard)}
a:hover{color:var(--text-display);border-bottom-color:var(--green-olive)}
a:focus-visible{outline:1px solid var(--green-olive);outline-offset:3px}
::selection{background:var(--green-pale);color:var(--ink-strong)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;
  padding:0 var(--space-7);font-family:var(--font-core);font-size:var(--text-body-sz);
  line-height:1;text-decoration:none;border-radius:0;border:1px solid transparent;cursor:pointer;
  transition:background-color var(--motion-base) var(--easing-standard),
             color var(--motion-base) var(--easing-standard),
             border-color var(--motion-base) var(--easing-standard)}
.btn--primary{background:var(--ink-forest);color:var(--paper-cream);border-color:var(--ink-forest)}
.btn--primary:hover{background:var(--green-olive);border-color:var(--green-olive);color:var(--paper-cream)}
.btn--secondary{background:transparent;color:var(--text-display);border-color:var(--rule)}
.btn--secondary:hover{border-color:var(--green-olive);color:var(--green-olive)}
.actions{display:flex;flex-wrap:wrap;gap:var(--space-4)}
.note{font-size:var(--text-caption-sz);color:var(--text-caption);margin-top:var(--space-5)}
.caption{margin-top:var(--space-3);font-size:var(--text-micro);font-family:var(--font-label);
  letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-caption)}
/* ---------- masthead ---------- */
.masthead{position:sticky;top:0;z-index:10;background:var(--surface-page);
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);
  padding:var(--space-5) var(--space-8);border-bottom:var(--border-hairline)}
.masthead__logo{height:38px;width:auto;display:block}
/* The two marks locked up. Sized by height so the pair keeps its proportions,
   and the ceiling on width stops a wide lockup crowding the navigation. */
.masthead__brand{display:block;border-bottom:0;line-height:0}
.masthead__brand .filled{height:62px;width:auto;max-width:430px}
.nav{display:flex;align-items:center;gap:var(--space-7);list-style:none;margin:0;padding:0}
.nav a{color:var(--text-body);font-size:var(--text-small);border-bottom-color:transparent;padding-bottom:2px}
.nav a:hover{color:var(--text-display);border-bottom-color:var(--green-pale)}
.nav .nav__buy{color:var(--text-display);border-bottom-color:var(--green-sage)}
.burger{display:none;align-items:center;gap:var(--space-3);font-size:var(--text-small);color:var(--text-display)}
.burger em{font-style:normal;font-size:var(--text-lead)}
/* ---------- hero ---------- */
/* .62fr was sized for a portrait cover shot flat. The hero artwork is now a
   landscape composition cropped to its own ink, so the image column carries
   nearly the same weight as the copy. */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:var(--space-9);
  align-items:center;padding:var(--space-12) var(--space-8);max-width:var(--measure);margin:0 auto}
/* The closing hero mirrors the opening one: artwork left, copy right. */
.hero--end{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
  border-top:var(--border-hairline)}
/* The artwork is a composition with its own transparent margin, so it can run
   wider than its column without crowding the copy. */
.hero figure{width:106%}
.hero--end figure{margin-left:-6%}
@media (max-width:900px){.hero figure,.hero--end figure{width:100%;margin-left:0}}
.hero__copy{max-width:34em}
.hero__title{font-weight:400;font-size:var(--text-display-lg);line-height:var(--leading-tight);
  color:var(--text-display);margin:0 0 var(--space-4);text-wrap:balance}
.hero__standfirst{font-size:var(--text-lead);font-style:italic;font-weight:300;
  line-height:var(--leading-snug);margin:0 0 var(--space-6)}
.hero__lede{font-size:var(--text-body-lg);margin:0 0 var(--space-8);max-width:32em}
.hero__spec{font-size:var(--text-caption-sz);color:var(--text-caption);margin:var(--space-6) 0 0;
  padding-top:var(--space-4);border-top:var(--border-soft);max-width:30em}
/* ---------- bands ---------- */
.halves{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-10);margin-top:var(--space-9)}
.half__label{font-family:var(--font-label);font-size:var(--text-caption-sz);
  letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-caption);margin:0 0 var(--space-2)}
.halves__close{margin-top:var(--space-9);padding-top:var(--space-5);border-top:var(--border-soft);
  font-style:italic;max-width:56ch}
.carousel{margin:0 0 var(--space-9)}
.carousel__stage{position:relative;aspect-ratio:3/2}
.slide{position:absolute;inset:0;opacity:0;transition:opacity var(--motion-base) var(--easing-standard);
  pointer-events:none}
.slide[data-active]{opacity:1;pointer-events:auto}
.slide .slot{height:100%}
.carousel__bar{display:flex;align-items:center;gap:var(--space-4);margin-top:var(--space-4)}
.carousel__label{flex:1;font-size:var(--text-small)}
.carousel__count{font-size:var(--text-caption-sz);color:var(--text-caption);
  font-variant-numeric:tabular-nums;font-family:var(--font-label)}
.carousel__btn{width:36px;height:36px;border:var(--border-hairline);background:transparent;
  color:var(--text-display);font-size:var(--text-lead);line-height:1;cursor:pointer;border-radius:0;
  font-family:var(--font-core);
  transition:border-color var(--motion-base) var(--easing-standard),color var(--motion-base) var(--easing-standard)}
.carousel__btn:hover{border-color:var(--green-olive);color:var(--green-olive)}
.carousel__btn:focus-visible{outline:1px solid var(--green-olive);outline-offset:2px}
.dots{display:flex;gap:var(--space-2);list-style:none;margin:0;padding:0}
.dots button{width:8px;height:8px;padding:0;border:1px solid var(--green-sage);background:transparent;
  border-radius:999px;cursor:pointer;transition:background-color var(--motion-base) var(--easing-standard)}
.dots button[aria-current="true"]{background:var(--green-olive);border-color:var(--green-olive)}
.account-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3) var(--space-9);
  list-style:none;margin:0 0 var(--space-10);padding:0}
.account-list li{padding-bottom:var(--space-3);border-bottom:var(--border-hairline)}
.pill{display:inline-block;border-radius:999px;padding:1px var(--space-2);font-size:var(--text-micro);
  font-family:var(--font-label);letter-spacing:.04em;color:var(--status-ink);vertical-align:2px}
.pill--en{background:var(--status-en)}
.pill--vu{background:var(--status-vu)}
.pill--lc{background:var(--status-lc)}
.stars{font-size:var(--text-body-lg);letter-spacing:.08em;color:var(--ink-forest);white-space:nowrap}
.legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3) var(--space-9);
  margin:var(--space-6) 0 var(--space-10);padding:0;list-style:none}
.legend li{display:flex;gap:var(--space-4);align-items:baseline;padding-bottom:var(--space-3);
  border-bottom:var(--border-hairline)}
.stats{display:flex;flex-wrap:wrap;border-top:var(--border-soft);border-bottom:var(--border-soft);margin:0}
.stats div{flex:1 1 auto;padding:var(--space-5) var(--space-6) var(--space-5) 0;min-width:9rem}
.stats dt{font-size:var(--text-title);color:var(--text-display);line-height:1.1}
.stats dd{margin:var(--space-1) 0 0;font-size:var(--text-caption-sz);color:var(--text-caption);
  font-family:var(--font-label);letter-spacing:var(--tracking-wide);text-transform:uppercase}
.tools{display:grid;gap:var(--space-9);margin:var(--space-9) 0}
.tools{grid-template-columns:repeat(3,minmax(0,1fr))}
.pillars{display:flex;flex-wrap:wrap;border-top:var(--border-soft);margin:var(--space-9) 0 var(--space-6)}
.pillars div{flex:1 1 14rem;padding:var(--space-5) var(--space-6) var(--space-5) 0}
.pillars dt{font-family:var(--font-label);letter-spacing:var(--tracking-wide);text-transform:uppercase;
  font-size:var(--text-caption-sz);color:var(--text-display)}
.pillars dd{margin:var(--space-2) 0 0;font-size:var(--text-small)}
.authors{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-10)}
.author{display:grid;grid-template-columns:170px 1fr;gap:var(--space-6);align-items:start}
.author img{width:100%;height:auto;display:block;border:var(--border-frame);background:var(--paper-white)}
.author blockquote{margin:0 0 var(--space-4);font-size:var(--text-body-lg);font-style:italic;
  line-height:var(--leading-snug)}
.author__name{font-size:var(--text-body-lg);color:var(--text-display);margin:0}
.author__role{font-size:var(--text-caption-sz);color:var(--text-caption);margin:var(--space-1) 0 var(--space-3)}
.press{margin-top:var(--space-9);padding-top:var(--space-5);border-top:var(--border-soft);
  font-size:var(--text-small);color:var(--text-caption)}
.video{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:var(--space-10);align-items:center}
.attrib{font-size:var(--text-small);color:var(--text-caption);margin-top:var(--space-6);
  padding-top:var(--space-4);border-top:var(--border-soft)}
.subscribe{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-10);align-items:start}
.field{display:block;width:100%;min-height:44px;padding:0 var(--space-4);border:var(--border-hairline);
  border-radius:0;background:var(--paper-white);font:inherit;color:var(--text-body)}
.field:focus-visible{outline:1px solid var(--green-olive);border-color:var(--green-olive)}
.consent{display:flex;gap:var(--space-3);align-items:flex-start;margin-top:var(--space-4);
  font-size:var(--text-caption-sz);color:var(--text-caption)}
.consent input{accent-color:var(--green-olive);margin-top:3px}
.form-row{display:flex;gap:var(--space-3);margin-top:var(--space-5)}
.form-row .field{flex:1}
.sig{max-width:190px;height:auto;display:block;margin:var(--space-6) 0 0}
.footer{border-top:var(--border-hairline);padding:var(--space-10) var(--space-8) var(--space-9)}
.footer__grid{max-width:var(--measure);margin:0 auto;display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-9)}
.footer h4{font-family:var(--font-label);font-size:var(--text-caption-sz);letter-spacing:var(--tracking-wide);
  text-transform:uppercase;color:var(--text-display);margin:0 0 var(--space-3);font-weight:500}
.footer p{font-size:var(--text-small);margin:0 0 var(--space-2)}
.footer__base{max-width:var(--measure);margin:var(--space-9) auto 0;padding-top:var(--space-5);
  border-top:var(--border-hairline);display:flex;flex-wrap:wrap;gap:var(--space-4);
  align-items:center;justify-content:space-between;font-size:var(--text-caption-sz);color:var(--text-caption)}
.footer__logo{height:46px;width:auto;display:block}
@media (max-width:900px){
  .nav{display:none} .burger{display:inline-flex}
  .masthead__logo{height:30px}
  .masthead__brand .filled{height:40px;max-width:270px}
  .hero{grid-template-columns:1fr;gap:var(--space-8);padding:var(--space-9) var(--space-6);text-align:center}
  .hero__copy,.hero__lede,.hero__spec{max-width:none}
  .hero__title{font-size:var(--text-title)}
  .hero figure{order:-1}
  .band{padding:var(--space-10) var(--space-6)}
  .band__title{font-size:var(--text-title)}
  .halves,.tools,.authors,.video,.subscribe,.footer__grid,
  .account-list,.legend{grid-template-columns:1fr}
  .author{grid-template-columns:120px 1fr}
  .actions .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms !important}}
/* ---------- shared page furniture ---------- */
.page{padding:var(--space-8)}
.masthead{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);
  padding-bottom:var(--space-5);border-bottom:var(--border-hairline);margin-bottom:var(--space-9)}
.masthead__nav{display:flex;gap:var(--space-6);font-size:var(--text-small)}
/* The inner pages carry a shorter header than the landing, so the same lockup
   sits a little smaller there rather than dominating a page of body text. */
.page .masthead__brand .filled{height:48px;max-width:330px}
@media (max-width:760px){.page .masthead__brand .filled{height:36px;max-width:240px}}
.runhead{font-family:var(--font-label);font-size:var(--text-caption-sz);
  letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-caption);
  margin:0 0 var(--space-5)}
h1{font-weight:400;font-size:var(--text-display-sz);line-height:var(--leading-tight);
  color:var(--text-display);margin:0 0 var(--space-5);text-wrap:balance}
h2{font-weight:400;font-size:var(--text-title);line-height:var(--leading-tight);
  color:var(--text-display);margin:0 0 var(--space-4)}
.lede{font-size:var(--text-body-lg);max-width:60ch}
.small{font-size:var(--text-caption-sz);color:var(--text-caption)}
.btn--full{width:100%}
/* ---------- the gate form ---------- */
.gate{border-top:var(--border-soft);border-bottom:var(--border-soft);
  padding:var(--space-8) 0;margin:var(--space-8) 0}
.f{margin-bottom:var(--space-5)}
.f label{display:block;font-size:var(--text-caption-sz);color:var(--text-caption);margin-bottom:var(--space-2)}
.check{display:flex;gap:var(--space-3);align-items:flex-start;font-size:var(--text-caption-sz);
  color:var(--text-caption);line-height:var(--leading-snug);margin-bottom:var(--space-5)}
.check input{accent-color:var(--green-olive);margin-top:3px;flex:none}
.turnstile{border:var(--border-hairline);background:var(--surface-row);padding:var(--space-4);
  display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-small);margin-bottom:var(--space-3)}
.turnstile span:first-child{width:18px;height:18px;border:1px solid var(--green-sage);flex:none}
/* ---------- what you receive ---------- */
.receive{display:grid;grid-template-columns:1fr;gap:var(--space-9);margin-top:var(--space-9)}
.gift{display:grid;grid-template-columns:190px 1fr;gap:var(--space-6);align-items:start}
.slot{border:1px dashed var(--green-sage);background:var(--paper-white);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:var(--space-2);text-align:center;padding:var(--space-4);width:100%;aspect-ratio:1650/2550}
.gift ul{margin:var(--space-3) 0 0;padding:0;list-style:none;font-size:var(--text-small)}
.gift li{padding:var(--space-2) 0;border-bottom:var(--border-hairline)}
.pagefoot{margin-top:var(--space-10);padding-top:var(--space-5);border-top:var(--border-hairline);
  display:flex;flex-wrap:wrap;gap:var(--space-4);justify-content:space-between;
  font-size:var(--text-caption-sz);color:var(--text-caption)}
/* A holding page has one thing to say, so it is set at reading width rather
   than the full page measure. */
.page--narrow{max-width:640px}
.hold{margin:var(--space-8) 0}
.hold p{font-size:var(--text-body-lg)}

/* ---------- the read-sample viewer ---------- */
/* Without JavaScript the pages simply stack and stay readable. The script
   turns the stack into one page at a time; everything below that depends on
   the script is scoped to [data-paged], which only the script sets. */
.sample{margin-top:var(--space-9)}
.sample__stage{display:flex;flex-direction:column;gap:var(--space-6)}
.sample__page{display:block;width:100%;height:auto;max-width:900px;margin:0 auto;
  background:var(--paper-white);border:var(--border-frame)}
.sample[data-paged] .sample__stage{display:block;position:relative}
.sample[data-paged] .sample__page{display:none;margin:0 auto}
.sample[data-paged] .sample__page[data-current]{display:block}
.sample__bar{display:none;align-items:center;gap:var(--space-4);
  margin-top:var(--space-5);padding-top:var(--space-4);border-top:var(--border-hairline)}
.sample[data-paged] .sample__bar{display:flex}
.sample__btn{width:40px;height:40px;border:var(--border-hairline);background:transparent;
  color:var(--ink-forest);font-size:var(--text-lead);line-height:1;cursor:pointer}
.sample__btn:hover:not(:disabled){border-color:var(--green-olive);color:var(--green-olive)}
.sample__btn:disabled{opacity:.35;cursor:default}
.sample__count{font-family:var(--font-label);font-size:var(--text-caption-sz);
  letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-caption)}
.sample__hint{margin-left:auto;font-size:var(--text-caption-sz);color:var(--text-caption)}
@media (max-width:600px){.sample__hint{display:none}}

.btn:disabled{opacity:.45;cursor:not-allowed}
.btn:disabled:hover{background:var(--ink-forest);border-color:var(--ink-forest)}
/* Honeypot: off-screen rather than display:none, which some bots skip. */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.gate-hint{margin-top:var(--space-3);color:var(--text-caption);text-align:center}
.gate-error{margin-top:var(--space-3);color:var(--status-cr);text-align:center}

/* ---------- modals ---------- */
.overlay{position:fixed;inset:0;background:rgba(47,43,39,.42);display:none;
  align-items:center;justify-content:center;padding:var(--space-6);z-index:40}
.overlay[data-shown]{display:flex}
.modal{background:var(--surface-page);border:var(--border-frame);max-width:520px;width:100%;
  padding:var(--space-9);position:relative;max-height:90vh;overflow-y:auto}
.modal__close{position:absolute;top:var(--space-4);right:var(--space-4);width:32px;height:32px;
  border:1px solid var(--rule);background:transparent;color:var(--text-body);cursor:pointer;
  font-size:var(--text-lead);line-height:1;border-radius:0;font-family:var(--font-core)}
.modal__close:hover{border-color:var(--green-olive);color:var(--green-olive)}
.modal__brand{margin-bottom:var(--space-6)}
.modal__brand .filled{height:44px;width:auto;max-width:100%}
.modal ul{margin:0 0 var(--space-6);padding:0;list-style:none;font-size:var(--text-body-sz)}
.modal li{padding:var(--space-2) 0;border-bottom:var(--border-hairline)}
.modal .actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-6)}
/* ---------- legal ---------- */
.legal{display:grid;grid-template-columns:210px 1fr;gap:var(--space-10);align-items:start}
.rail{position:sticky;top:var(--space-6);font-size:var(--text-small)}
.rail h4{font-family:var(--font-label);font-size:var(--text-caption-sz);letter-spacing:var(--tracking-wide);
  text-transform:uppercase;color:var(--text-display);margin:0 0 var(--space-3);font-weight:500}
.rail ol{margin:0;padding:0;list-style:none;counter-reset:c}
.rail li{counter-increment:c;padding:var(--space-1) 0}
.rail a{border-bottom:none;color:var(--text-body)}
.rail a::before{content:counter(c) " · ";color:var(--text-caption);font-variant-numeric:tabular-nums}
.rail a:hover{color:var(--green-olive)}
.clauses{counter-reset:cl}
.clause{counter-increment:cl;padding-bottom:var(--space-7);margin-bottom:var(--space-7);
  border-bottom:var(--border-hairline);scroll-margin-top:var(--space-9)}
.clause:last-child{border-bottom:0}
.clause h3::before{content:counter(cl) " · ";color:var(--text-caption);font-variant-numeric:tabular-nums}
.clause ul{margin:0 0 var(--space-5);padding:0;list-style:none}
.clause li{padding:var(--space-2) 0;border-bottom:var(--border-hairline);font-size:var(--text-body-sz)}
.shortver{border:var(--border-soft);padding:var(--space-6);margin-bottom:var(--space-9)}
.shortver h4{font-family:var(--font-label);font-size:var(--text-caption-sz);letter-spacing:var(--tracking-wide);
  text-transform:uppercase;color:var(--text-display);margin:0 0 var(--space-3);font-weight:500}
.shortver ul{margin:0;padding:0;list-style:none}
.shortver li{padding:var(--space-2) 0;border-bottom:var(--border-hairline);font-size:var(--text-small)}
.shortver li:last-child{border-bottom:0}
@media (max-width:820px){
  .legal{grid-template-columns:1fr;gap:var(--space-8)}
  .rail{position:static}
  .gift{grid-template-columns:1fr}
  .gift .slot,.gift .peek{max-width:220px}
  .page{padding:var(--space-6)}
  .btn{width:100%}
  .masthead__nav{display:none}
}
