/* Seeds of Renaissance design tokens
   Extracted from the home and manifesto mockups (Seeds Polyamine Pages v7, 2026-10-02).
   Feel: grounded hope. Ink and paper, a little off-centre; colour comes from photographs.
   One fixed brand world: there is no dark mode. Night is a section, not a theme.
   Load order: fonts.css, tokens.css, components.css. */

:root {
  /* ── Grounds (backgrounds only) ─────────────────────────────── */
  --white: #ffffff;      /* pure white sections: openness, the page at its most awake */
  --paper: #fbfaf6;      /* the default page: warm near-white */
  --sunlight: #fbefc4;   /* pale yellow: background only, never text, never highlight */
  --night: #171613;      /* at most one night section per page, plus the footer */

  /* ── Ink (text, rules, buttons) ─────────────────────────────── */
  --ink: #1b1916;        /* all text on light grounds, and every button */
  --muted: #5d584f;      /* secondary text, captions, labels */
  --rule: #e0dacf;       /* hairlines on light grounds */

  /* ── On night ───────────────────────────────────────────────── */
  --chalk: #ece7dc;      /* text on night */
  --night-muted: #a49e93;
  --night-rule: #38342e;

  /* ── The one accent ─────────────────────────────────────────── */
  --red: #e5201c;        /* the logo red: only an occasional link in running text, and footnote marks */

  /* ── Illustration inks (woodcut graphics only: never text, buttons or grounds) ── */
  --print-blue: #03296f;    /* cobalt */
  --print-green: #1f3d2b;   /* deep green */
  --print-mustard: #c9a227; /* mustard yellow */

  /* ── Type families ──────────────────────────────────────────── */
  --font-display: "Polyamine", "Fraunces", Georgia, serif;          /* headlines, titles, wordmark: anything up to ~10 words */
  --font-quote: "Restora", "Fraunces", Georgia, serif;              /* display text that runs longer than ~10 words: pull quotes, standout passages */
  --font-body: "Bricolage Grotesque", system-ui, sans-serif;        /* everything you read */
  --font-label: "Apfel Grotezk", "Hanken Grotesk", system-ui, sans-serif; /* eyebrows, buttons, dates, captions numbers */
  --font-poem: "Restora", "Fraunces", Georgia, serif;               /* the poetic voice: Restora italic. Four faces only; Fraunces is just the fallback */

  /* ── Type scale (fluid; cqi falls back to viewport width outside a container) ── */
  --t-hero: clamp(40px, 7cqi, 96px);        /* one statement per page, 5–10 words */
  --t-title: clamp(40px, 6cqi, 84px);       /* page title on inner pages */
  --t-section: clamp(36px, 5cqi, 64px);     /* a section headline */
  --t-band: clamp(30px, 4.4cqi, 56px);
  --t-card: clamp(24px, 2.5cqi, 32px);      /* card and pathway titles */
  --t-item: 26px;                            /* list item titles (calendar, contents) */
  --t-interlude: clamp(26px, 3.4cqi, 42px); /* a poetic line set alone */
  --t-quote: clamp(26px, 3.4cqi, 38px);     /* pull quote */
  --t-lead: clamp(20px, 2.4cqi, 28px);      /* statement paragraphs, light weight */
  --t-intro: clamp(17px, 1.9cqi, 21px);     /* hero standfirst */
  --t-reading: 19px;                         /* long-form article text */
  --t-body: 17px;
  --t-small: 15px;
  --t-caption: 14px;
  --t-button: 13px;
  --t-label: 12px;
  --t-meta: 11px;

  --lh-display: .95;
  --lh-heading: 1.1;
  --lh-body: 1.55;
  --lh-reading: 1.65;

  --track-label: .16em;  /* uppercase labels */
  --track-button: .12em;
  --track-meta: .14em;

  /* ── Space ──────────────────────────────────────────────────── */
  --gutter: clamp(16px, 4cqi, 56px);           /* page side padding */
  --section: clamp(44px, 7cqi, 96px);          /* vertical padding of a section */
  --gap-s: 12px;
  --gap-m: clamp(16px, 2.6cqi, 32px);          /* between cards */
  --gap-l: clamp(24px, 5cqi, 72px);            /* between columns */
  --measure: 680px;                            /* long-form reading width */

  /* ── Material ───────────────────────────────────────────────── */
  --tear-height: 22px;
  --shadow-print: 0 18px 40px -22px rgb(27 25 22 / .55);   /* a photograph laid on the page */
  --shadow-object: 0 30px 50px -30px rgb(27 25 22 / .7);   /* a printed object: magazine, book */
  --tilt: 1.6deg;                                          /* prints sit slightly off-square */
  --grain-opacity: .14;
}

/* ── Thumbnails (fixed 1280×720 artboard) ─────────────────────────
   Video thumbnails are fixed-size images, so the fluid cqi scale above does not apply.
   Sizes are px at 1280×720; the same artboard is scaled down whole for previews (.thumb-frame).
   YouTube shows it at ~360px wide (×0.28): a 96px title reads as ~27px, a 28px label as ~8px.
   Keep titles to two to six words; labels are secondary and may not survive feed size. */
:root {
  --thumb-w: 1280px;
  --thumb-h: 720px;
  --thumb-title-xl: 110px;   /* podcast: short title in the paper column (three lines at most) */
  --thumb-title-l: 122px;    /* talk: title over a photo */
  --thumb-title: 104px;      /* gathering: title on the torn white strip */
  --thumb-title-m: 96px;     /* manifesto: a sentence-length quote */
  --thumb-byline: 52px;      /* "with Guest Name", Polyamine */
  --thumb-label: 28px;       /* Apfel labels: series, date */
  --thumb-label-s: 24px;     /* footer labels beside the logo */
  --thumb-meta: 20px;        /* figure number on a photo */
  --thumb-pad: 64px;         /* outer margin for text */
  --thumb-inset: 46px;       /* corner inset for logo and marks */
  --thumb-logo: 116px;       /* logo on white or paper */
  --thumb-tear: 34px;        /* torn edge depth at artboard scale */
}

/* ── Podcast guest thumbnail (podcast episode cover) ───
   Sizes px at 1280×720, as the --thumb-* block above. Labels that must be read at feed
   size (×0.28 at 360px, ×0.13 at 168px) are 40px or more; smaller labels are decoration. */
:root {
  --thumb-label-l: 40px;     /* a label that must read at feed size: the podcast name */
  --thumb-name: 64px;      /* guest name, Bricolage semibold */
  --thumb-guest-w: 680px;    /* width of the greyscale portrait on the right */
  --thumb-disc: 92px;        /* logo on its white disc, bottom left */
}

/* ── YouTube channel art (fixed artboards) ───────────────────────
   Banner: upload 2560×1440. TVs show it all; desktop shows the centred 2560×423 strip;
   phones crop to the centred 1546×423 safe area, so everything that must be seen lives there.
   Avatar 800×800, shown as a circle down to 24px. Watermark 150×150. Lower third drawn on a 1920×1080 frame. */
:root {
  --yt-banner-w: 2560px;
  --yt-banner-h: 1440px;
  --yt-strip-h: 423px;       /* the desktop strip, full width */
  --yt-safe-w: 1546px;       /* the safe area: what phones show */
  --yt-avatar: 800px;
  --yt-watermark: 150px;
  --yt-video-w: 1920px;
  --yt-video-h: 1080px;
  --yt-wordmark: 112px;      /* "Seeds of / Renaissance" on the banner, Polyamine, two lines */
  --yt-tagline: 50px;        /* banner tagline, the poem voice */
  --yt-banner-logo: 236px;   /* logo on the banner */
  --yt-l3-label: 30px;       /* lower third: series label */
  --yt-l3-name: 76px;        /* lower third: guest name, Polyamine */
  --yt-l3-role: 36px;        /* lower third: role or one line about the guest */
}

/* ── Print (papers: A4, fixed point sizes) ───────────────────────
   Set with the print mockups (archive/print-mockups-2026-10.html, design-34t.22); approved 2026-10-08.
   The Typst sor style in pdf-report-publishing reads these values. pt and mm are real
   sizes on paper. Rules and the finished pages: print.md, examples/print/.
   No grain overlay and no page tint: the paper has its own. */
:root {
  --print-page: #ffffff;    /* pages are white, unfilled: the PDF is read on screen, and if printed the stock gives any warmth */
  --print-w: 210mm;          /* A4. US Letter is 215.9 × 279.4mm with the same margins */
  --print-h: 297mm;
  --print-m-top: 22mm;       /* to the top of the text block; running head sits in it */
  --print-m-bottom: 26mm;    /* folio sits in it */
  --print-m-inner: 24mm;
  --print-m-outer: 20mm;     /* text block 166mm wide at A4: two-thirds of it is the measure */
  --print-measure: 118mm;    /* about 70 characters at body size */
  --print-margin-col: 38mm;  /* side column beside the measure: notes on figures, pull quotes hang into it */

  --print-cover-title: 46pt; /* Polyamine, the cover only */
  --print-title: 30pt;       /* Polyamine: cover, title page, contents and chapter titles. Nowhere else inside */
  --print-h2: 19pt;          /* Restora, sentence case: section heads in the run of text (all-caps Polyamine tires at length) */
  --print-h3: 14pt;          /* Restora medium: sub-sections in the run of text */
  --print-standfirst: 13pt;  /* Restora: subtitle, chapter summary */
  --print-quote: 15pt;       /* Restora italic: pull quotes */
  --print-epigraph: 11.5pt;  /* Restora italic */
  --print-body: 10.5pt;      /* Bricolage, light-regular */
  --print-lh: 14.5pt;        /* the baseline: everything sits on multiples of it */
  --print-summary: 9.5pt;    /* section summary box */
  --print-caption: 8.5pt;
  --print-note: 8pt;         /* footnotes, line height 11pt */
  --print-label: 7pt;        /* Apfel uppercase: running heads, folios, figure numbers, series line */
  --print-track: .16em;
}