/* ==========================================================================
   THE THREEFOLD PATH — the numinous-violet register
   Established 2026-08-11. Replaces the engraved dark-plate baseline and the
   light folio reading world with a single system:

     one ground   #f4efe4   digital white, every template
     one ink      #58472f   Numinous Violet, 7.93:1 on white
     one weight   #25221d   Abyssal Violet, 19.43:1, long-form body only

   Artwork is saturated violet tiles with hard rectangular edges. A tile whose
   ground is the identity colour has nothing to dissolve into on a white page,
   so it is an object ON the page rather than a scene masked INTO it. That is
   why nothing here fades, masks or vignettes — the dissolve machinery, the
   matched off-colour rule and the full-bleed treatment all retired with the
   dark ground.

   Intermediate tone comes from opacity, engraved line density and the ordered
   dither baked into each plate. There are no colour gradients in this file.
   The palette admits no blue, cyan, red, green, orange or pink.
   ========================================================================== */

:root {
  --white:     #f4efe4;                 /* the page, every template          */
  --numinous:  #58472f;                 /* the one ink — 7.93:1 on white     */
  --deep:      #25221d;                 /* 19.43:1 — long-form body weight   */
  --pressed:   #3d3021;                 /* 8.69:1 — hover/active, deeper     */

  /* Derived tints. Opacity of the one ink, never a second hue. */
  --rule:      rgba(88,71,47, 0.20); /* hairlines and section rules       */
  --rule-firm: rgba(88,71,47, 0.42); /* card tops, lintels                */
  --quiet:     rgba(88,71,47, 0.62); /* metadata, captions, eyebrows      */

  --font-display: "GFS Didot", "Didot", serif;
  --display-stroke: 0.30px;             /* optical weight for display caps  */
  --font-mono:    "IBM Plex Mono", monospace;
  --font-body:    "Source Serif 4", Georgia, serif;

  --pad: clamp(1.25rem, 4vw, 3rem);
  --max: 1400px;
  --gap: clamp(1.4rem, 3vw, 2.6rem);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--white);
  color: var(--numinous);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; }
a { color: inherit; }

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 400;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: -0.005em;
}

/* GFS Didot ships in one regular weight. A fractional same-colour stroke adds
   enough ink for violet-on-white display caps without changing its proportions. */
h1, h2, h3, h4,
.brand-name,
.colophon-list dt,
.covenant-promises strong,
.kg-bookmark-title,
.lesson-return-nav strong {
  -webkit-text-stroke: var(--display-stroke) currentColor;
  paint-order: stroke fill;
}

:focus-visible { outline: 2px solid var(--numinous); outline-offset: 3px; }

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 100;
  background: var(--numinous); color: var(--white);
  padding: 0.8rem 1.2rem; font-family: var(--font-mono); font-size: 0.7rem;
  letter-spacing: 0.16em; text-transform: uppercase; text-decoration: none;
}
.skip-link:focus { left: 0; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0.01ms !important; }
}

/* ---------- shared type roles -------------------------------------------- */

/* mono is the metadata voice: caps, letterspaced, and never long-form. The
   reference this design follows sets body copy in mono caps too, which reads
   well for a three-line blurb and collapses completely over a lesson. */
.mono-eyebrow {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  line-height: 1.75;
  margin: 0;
  color: var(--quiet);
}

.wrap { max-width: var(--max); margin: 0 auto; padding: 0 var(--pad); }
.rule-line { max-width: var(--max); margin: 0 auto; padding: 0 var(--pad); }
.rule-line span { display: block; border-top: 1px solid var(--rule); }
.section { padding: clamp(3rem, 6vw, 5.5rem) 0 0; }

/* Inner-page title ornament. It belongs on the h1 and nowhere else; the
   homepage deliberately opens without it. */
.title-row { display: flex; gap: clamp(0.8rem, 1.4vw, 1.35rem); align-items: center; }
.rose { flex: none; height: auto; }
.rose--title { width: 38px; }

.section-head {
  max-width: var(--max); margin: 0 auto clamp(1.6rem, 3vw, 2.6rem);
  padding: 0 var(--pad);
}
.section-head h2 { font-size: clamp(1.9rem, 4vw, 3.2rem); line-height: 0.98; }
.section-intro {
  font-size: 1.02rem; line-height: 1.7; color: var(--deep);
  max-width: 58ch; margin: 1.1rem 0 0;
}

/* ---------- controls ------------------------------------------------------ */

.btn-gold,
.btn {
  display: inline-block;
  font-family: var(--font-mono); font-size: 0.7rem;
  letter-spacing: 0.16em; text-transform: uppercase; text-decoration: none;
  padding: 0.95rem 1.6rem;
  background: var(--numinous); color: var(--white);
  border: 1px solid var(--numinous);
  cursor: pointer;
}
.btn-gold:hover, .btn:hover { background: var(--white); color: var(--numinous); }

.btn-text, .btn--ghost { background: none; color: var(--numinous); }
.btn-text:hover, .btn--ghost:hover { background: var(--numinous); color: var(--white); }

.learning-link, .link {
  font-family: var(--font-mono); font-size: 0.7rem;
  letter-spacing: 0.14em; text-transform: uppercase; text-decoration: none;
  border-bottom: 1px solid var(--rule); padding-bottom: 3px;
}
.learning-link:hover, .link:hover { border-bottom-color: var(--numinous); }

/* ---------- tiles --------------------------------------------------------- */

/* Nothing is cropped. These are engravings, not photographs: a plate cut to fit
   a box loses the part of the diagram that was the reason to show it, and a
   circle cropped to a landscape frame stops reading as a circle at all.

   Two ways of not cropping, and the choice is about neighbours, not images:

   .tile--natural — a tile alone in its slot takes the plate's own proportions,
   so the image is whole AND there is no letterbox. Both grids that hold one
   (.plate-hero, .plate-split) align end/center rather than stretch, so a tile
   of any height sits correctly.

   A fixed ratio (.t43 / .t11 / .t167) — for tiles in a card grid, where uneven
   heights would push every row out of line. Here `contain` letterboxes, and it
   costs almost nothing: the band is the same violet as the ground, so the plate
   reads as sitting in a violet field rather than as an image with bars.

   No `image-rendering: pixelated`. Tiles are baked at 880px and displayed near
   440, so they are downscaled, and pixelated on a downscaled halftone aliases
   the dot pattern into moire instead of preserving it. */
/* The tile ground is parchment, not a colour. Whatever space a plate does not
   fill — the corners of a tondo, the letterbox beside a portrait plate held in
   a square card box — has to read as the sheet the plate is printed on, and
   flat #58472f there reads as an empty panel instead. tile-ground.png is built
   through the same grain and the same Bayer threshold as the blank areas inside
   the plates, so the two meet without a seam. background-size 160 on a 320px
   image puts it at the plates' own scale: they bake at 880 and draw near 440,
   so both are 1:1 on a retina screen. The colour stays underneath as the
   fallback if the image ever fails to load. */
.tile {
  display: block; width: 100%; overflow: hidden;
  background-color: var(--numinous);
  background-image: url("../images/tiles/tile-ground.png");
  background-size: 160px 160px;
}
.tile img { display: block; width: 100%; height: 100%; object-fit: contain; }
.tile--natural { aspect-ratio: auto; }
.tile--natural img { height: auto; }
.t43  { aspect-ratio: 4 / 3; }
.t45  { aspect-ratio: 4 / 5; }   /* the three doors */
.t11  { aspect-ratio: 1 / 1; }
.t167 { aspect-ratio: 16 / 7; }

/* ---------- plate credits and colophon ------------------------------------ */

/* A credit sits under its plate, not on it: an overlay would be a caption
   printed on the artwork, and these plates already carry all the ink they can.
   Quiet enough to stay out of the way, present enough to be a real credit —
   one of these images is CC BY and the licence requires it be readable. */
.plate { margin: 0; }
.plate-credit {
  display: flex; gap: 0.55rem; align-items: baseline;
  margin-top: 0.55rem;
  font-family: var(--font-mono); font-size: 0.6rem; line-height: 1.5;
  letter-spacing: 0.08em; color: var(--quiet);
}
.plate-credit i { font-style: italic; }

/* The sourced-versus-generated distinction, stated. One ink and one screen make
   a public-domain scan and house artwork identical, so it cannot be shown. */
.plate-credit-kind {
  flex: none; text-transform: uppercase; letter-spacing: 0.14em;
  font-size: 0.55rem; padding: 0.1rem 0.34rem;
  border: 1px solid var(--rule-firm); color: var(--numinous);
}

.plate-colophon { border-top: 1px solid var(--rule); margin-top: 3rem; padding-block: 0; }
.colophon-records > summary {
  padding: 1.5rem 0; cursor: pointer; font-family: var(--font-display);
  font-size: clamp(1.25rem, 2.4vw, 1.65rem); line-height: 1.3;
}
.colophon-records > summary:focus-visible { outline: 2px solid var(--numinous); outline-offset: 4px; }
.colophon-records[open] > summary { border-bottom: 1px solid var(--rule); }
.colophon-inner { max-width: var(--max); margin: 0 auto; padding: 1.5rem 0 0; }
.colophon-list {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1.1rem, 2.4vw, 1.9rem); margin-top: clamp(1.4rem, 3vw, 2.2rem);
}
.colophon-list dt {
  font-family: var(--font-display); font-size: 1.02rem; line-height: 1.3;
  color: var(--numinous);
}
.colophon-list dd {
  margin: 0.4rem 0 0;
  font-family: var(--font-mono); font-size: 0.63rem; line-height: 1.8;
  letter-spacing: 0.07em; color: var(--quiet);
}
.colophon-list a { color: var(--numinous); font-size: max(11px, 1em); text-underline-offset: 3px; }
.colophon-list a:hover { color: var(--pressed); }

@media (max-width: 720px) {
  .colophon-list { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- masthead ------------------------------------------------------ */

.site-header { border-bottom: 1px solid var(--rule); }
.header-inner {
  max-width: var(--max); margin: 0 auto; padding: 1.4rem var(--pad);
  display: flex; justify-content: space-between; align-items: center; gap: 1.5rem;
}
.brand { display: flex; align-items: center; text-decoration: none; }
.brand-name {
  font-family: var(--font-display); font-weight: 400;
  text-transform: uppercase; font-size: 1.05rem; letter-spacing: 0.02em;
}
.site-nav ul {
  list-style: none; margin: 0; padding: 0;
  display: flex; gap: 1.6rem; flex-wrap: wrap;
}
.site-nav a {
  text-decoration: none; font-family: var(--font-mono); font-size: 0.7rem;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--quiet);
}
.site-nav a:hover { color: var(--numinous); }

.nav-toggle {
  display: none; background: none; border: 1px solid var(--rule);
  color: var(--numinous); font-family: var(--font-mono); font-size: 0.66rem;
  letter-spacing: 0.16em; text-transform: uppercase; padding: 0.6rem 0.9rem;
}

@media (max-width: 780px) {
  .nav-toggle { display: block; }
  .site-nav { display: none; width: 100%; }
  body.nav-open .site-nav { display: block; }
  .site-nav ul { flex-direction: column; gap: 0.9rem; padding-top: 1rem; }
  .header-inner { flex-wrap: wrap; }
}

/* ---------- hero ---------------------------------------------------------- */

.plate-hero {
  display: grid; grid-template-columns: 1.05fr 0.95fr;
  gap: clamp(1.5rem, 4vw, 3.5rem); align-items: end;
  max-width: var(--max); margin: 0 auto;
  padding: clamp(2.4rem, 5vw, 4.5rem) var(--pad) clamp(2.5rem, 6vw, 4.5rem);
}
.plate-hero-title { font-size: clamp(2.9rem, 8vw, 6.6rem); line-height: 0.92; }
.plate-hero-lede {
  font-family: var(--font-display); text-transform: none;
  font-size: clamp(1.02rem, 1.4vw, 1.22rem); line-height: 1.55;
  max-width: 34ch; margin: 1.6rem 0 2rem; color: var(--deep);
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 0.9rem; }
.plate-hero-note { margin-top: 1.7rem; }

/* ---------- three doors --------------------------------------------------- */

.levels-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap);
  max-width: var(--max); margin: 0 auto; padding: 0 var(--pad);
}
.door { text-decoration: none; display: flex; flex-direction: column; gap: 1.05rem; }
.door h3 { font-size: clamp(1.5rem, 2.5vw, 2.2rem); line-height: 0.98; }
.door-blurb {
  font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.1em;
  text-transform: uppercase; line-height: 1.85; margin: 0;
}
.door-ask {
  font-family: var(--font-mono); font-size: 0.66rem; letter-spacing: 0.02em;
  text-transform: none; font-style: italic; color: var(--quiet); margin: 0;
}

/* ---------- two-column split ---------------------------------------------- */

.plate-split {
  display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: center; max-width: var(--max); margin: 0 auto; padding: 0 var(--pad);
}
.plate-split h2 {
  font-size: clamp(1.7rem, 3.2vw, 2.6rem); line-height: 1.02; margin-bottom: 1.1rem;
}
.plate-split p { font-size: 1.02rem; line-height: 1.7; color: var(--deep); max-width: 44ch; }

/* ---------- lesson + practice --------------------------------------------- */

.featured-learning-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap);
  max-width: var(--max); margin: 0 auto; padding: 0 var(--pad);
}
.featured-lesson, .featured-practice {
  border-top: 1px solid var(--rule-firm); padding-top: 1.3rem;
  display: flex; flex-direction: column; gap: 0.9rem;
}
.featured-lesson h3, .featured-practice h3 {
  font-size: clamp(1.35rem, 2.2vw, 1.9rem); line-height: 1.02;
}
.featured-lesson p, .featured-practice p {
  margin: 0; font-size: 1rem; line-height: 1.7; color: var(--deep);
}
.practice-purpose {
  font-family: var(--font-display); text-transform: none;
  font-size: 1.1rem; color: var(--numinous) !important; line-height: 1.45;
}
.learning-meta {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
  gap: 0.9rem; margin: 0.4rem 0 0; padding: 0.9rem 0;
  border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
}
.learning-meta div { font-family: var(--font-mono); font-size: 0.64rem; line-height: 1.65; }
.learning-meta dt {
  font-size: 0.56rem; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--quiet); margin-bottom: 0.25rem;
}
.learning-meta dd {
  margin: 0; text-transform: uppercase; letter-spacing: 0.05em; color: var(--deep);
}

/* ---------- the 40-day rhythm --------------------------------------------- */

.preparation-reliquary {
  display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(1.5rem, 4vw, 3.5rem);
  max-width: var(--max); margin: 0 auto; padding: 0 var(--pad); align-items: start;
}
.reliquary-copy {
  font-size: 1.02rem; line-height: 1.7; color: var(--deep); max-width: 44ch;
}
.preparation-blocks {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px; background: var(--rule);
}
.preparation-blocks li {
  background: var(--white); padding: 1rem 0.95rem;
  font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.1em;
  text-transform: uppercase; line-height: 1.6; display: flex; gap: 0.7rem;
}
.preparation-blocks li span { color: var(--quiet); flex: none; }

/* ---------- spiral curriculum --------------------------------------------- */

/* A spiral that returns, never a ladder. No pyramid, locked gate, rank badge,
   level number or progress metric appears anywhere in this theme. */
.spiral-map {
  max-width: var(--max); margin: 0 auto; padding: 0 var(--pad);
  display: grid; grid-template-columns: 1.15fr 0.85fr;
  gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center;
}
.spiral-trace { width: 100%; height: auto; overflow: visible; }
.spiral-trace path {
  fill: none; stroke: var(--numinous); stroke-width: 1.4;
  vector-effect: non-scaling-stroke;
}
.spiral-fields { list-style: none; margin: 0; padding: 0; }
.spiral-fields li {
  display: flex; gap: 1rem; align-items: baseline; padding: 0.75rem 0;
  border-bottom: 1px solid var(--rule);
  font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.12em;
  text-transform: uppercase;
}
.spiral-fields li span { color: var(--quiet); min-width: 2.6rem; }
.spiral-return {
  margin-top: 1.3rem; display: flex; align-items: center; gap: 0.9rem;
  font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.14em;
  text-transform: uppercase;
}

/* ---------- covenant ------------------------------------------------------ */

.learner-covenant {
  display: grid; grid-template-columns: 0.85fr 1.15fr;
  gap: clamp(1.5rem, 4vw, 3.5rem); max-width: var(--max); margin: 0 auto;
  padding: 0 var(--pad); align-items: start;
}
.covenant-intro p {
  font-size: 1.02rem; line-height: 1.7; color: var(--deep); max-width: 42ch;
}
.covenant-promises {
  list-style: none; margin: 0; padding: 0; display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--rule);
}
.covenant-promises li { background: var(--white); padding: 1.15rem 1rem; }
.covenant-promises strong {
  display: block; font-family: var(--font-display); font-weight: 400;
  text-transform: uppercase; font-size: 1.02rem; margin-bottom: 0.4rem;
}
.covenant-promises span {
  font-family: var(--font-mono); font-size: 0.64rem; line-height: 1.8;
  color: var(--deep); display: block;
}

/* ---------- boundary lintel + integrity ----------------------------------- */

.boundary-lintel, .integrity-line {
  max-width: var(--max); margin: 0 auto; padding: 1.3rem var(--pad);
  border-top: 1px solid var(--rule); text-align: center;
}
.boundary-lintel p, .integrity-line p {
  margin: 0; font-family: var(--font-mono); font-size: 0.7rem;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--quiet);
}

/* ---------- the folio ----------------------------------------------------- */

.posts-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap);
  max-width: var(--max); margin: 0 auto; padding: 0 var(--pad);
}
.post-card { display: flex; flex-direction: column; gap: 0.9rem; }
.post-card h3 {
  font-size: 1.25rem; line-height: 1.06; text-transform: none; letter-spacing: 0;
}
.post-card h3 a { text-decoration: none; }
.post-card h3 a:hover { color: var(--pressed); }
.post-excerpt { margin: 0; font-size: 0.95rem; line-height: 1.65; color: var(--deep); }
.post-card-image { display: block; text-decoration: none; }

/* Author-uploaded feature images are arbitrary colour and cannot be screened
   at render time, so they are held to the tile's own proportions and given the
   violet ground behind them. This is the one place the register meets content
   it does not control. */
.post-card-image .tile img { object-fit: cover; }

/* ---------- weekly letter ------------------------------------------------- */

.subscribe-block { max-width: var(--max); margin: 0 auto; padding: 0 var(--pad); }
.subscribe-inner { text-align: center; }
.subscribe-inner h2 { font-size: clamp(1.9rem, 4vw, 3rem); margin: 0.9rem 0 0; }
.subscribe-inner > p {
  font-size: 1.05rem; line-height: 1.7; color: var(--deep);
  max-width: 46ch; margin: 1.1rem auto 1.8rem;
}
.subscribe-inner .title-row { justify-content: center; }

/* ---------- return to ordinary life --------------------------------------- */

.return-block { max-width: var(--max); margin: 0 auto; padding: 0 var(--pad); text-align: center; }
.return-block p {
  font-family: var(--font-display); text-transform: none;
  font-size: clamp(1.15rem, 2.2vw, 1.55rem); line-height: 1.5;
  color: var(--numinous); max-width: 36ch; margin: 0 auto;
}

/* ---------- mission-first homepage -------------------------------------- */

.home-template {
  --home-space-macro: clamp(5.5rem, 10vw, 9rem);
  --home-space-section: clamp(2.5rem, 5vw, 4rem);
  --home-space-local: clamp(0.9rem, 2vw, 1.5rem);
}

.tfp-movement { margin-top: var(--home-space-macro); }
.tfp-threshold-movement {
  display: flex; flex-direction: column; margin-top: 0;
}
.tfp-threshold-movement .tfp-marker { order: -1; }

.tfp-marker {
  display: grid; grid-template-columns: auto auto 1fr; align-items: center;
  gap: 0.8rem; max-width: var(--max); width: 100%; margin: 0 auto var(--home-space-section);
  padding: 0 var(--pad);
}
.tfp-threshold-movement .tfp-marker {
  margin-bottom: 0; padding-top: clamp(2rem, 4vw, 3rem);
}
.tfp-marker span {
  font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.16em;
}
.tfp-marker h2 {
  font-size: clamp(1.25rem, 2.4vw, 1.85rem); line-height: 1; white-space: nowrap;
}
.tfp-marker i { height: 1px; background: var(--rule-firm); }

.tfp-mission-hero { align-items: center; }
.tfp-mission-hero .title-row { align-items: flex-start; margin-top: 0.75rem; }
.tfp-mission-hero .plate-hero-title {
  max-width: 13ch; font-size: clamp(2.55rem, 5.7vw, 5.5rem); line-height: 0.94;
}
.tfp-mission-hero .plate-hero-lede { max-width: 43ch; margin-bottom: 1.15rem; }
.tfp-centerline {
  max-width: 43ch; margin: 0 0 1.8rem; padding-left: 1rem;
  border-left: 1px solid var(--numinous); color: var(--deep);
  font-family: var(--font-display); font-size: clamp(1rem, 1.5vw, 1.2rem); line-height: 1.55;
}

.tfp-rhythm {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
  max-width: var(--max); width: calc(100% - (2 * var(--pad))); margin: 0 auto;
  border-top: 1px solid var(--rule-firm); border-bottom: 1px solid var(--rule);
}
.tfp-rhythm span {
  padding: 0.9rem 0.75rem; border-right: 1px solid var(--rule);
  font-family: var(--font-mono); font-size: 0.61rem; line-height: 1.55;
  letter-spacing: 0.1em; text-transform: uppercase; text-align: center;
}
.tfp-rhythm span:last-child { border-right: 0; }

.tfp-synthesis-head,
.tfp-two-part-head {
  display: grid; grid-template-columns: 1.1fr 0.9fr; gap: var(--gap); align-items: end;
}
.tfp-synthesis-head .section-intro,
.tfp-two-part-head .section-intro { margin-top: 0; }
.tfp-synthesis-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: var(--max); margin: 0 auto; padding: 0 var(--pad);
  border-top: 1px solid var(--rule-firm); border-bottom: 1px solid var(--rule);
}
.tfp-synthesis-grid article {
  min-width: 0; padding: 1.35rem clamp(1rem, 2vw, 1.8rem) 1.6rem;
  border-right: 1px solid var(--rule);
}
.tfp-synthesis-grid article:first-child { padding-left: 0; }
.tfp-synthesis-grid article:last-child { border-right: 0; padding-right: 0; }
.tfp-synthesis-grid h3 {
  font-size: clamp(1.7rem, 3vw, 2.5rem); line-height: 1; margin: 1.5rem 0 0.8rem;
}
.tfp-synthesis-grid strong {
  display: block; font-family: var(--font-display); font-weight: 400;
  font-size: 1.06rem; line-height: 1.35; color: var(--numinous);
}
.tfp-synthesis-grid article > p:last-child {
  margin: 0.75rem 0 0; color: var(--deep); font-size: 0.96rem; line-height: 1.7;
}

.tfp-method-movement,
.tfp-deepening-movement,
.tfp-covenant-movement { padding-top: 0; }
.tfp-method-intro,
.tfp-featured-learning,
.tfp-tests { width: min(calc(100% - (2 * var(--pad))), 1120px); }
.tfp-method-intro,
.tfp-featured-learning { padding-left: 0; padding-right: 0; }
.tfp-method-intro h3 {
  font-size: clamp(2rem, 4vw, 3.4rem); line-height: 0.98; margin: 0.75rem 0 1.1rem;
}
.tfp-method-intro p { max-width: 48ch; }
.tfp-claim-modes { margin-top: 1.25rem; }

.tfp-tests {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
  margin: var(--home-space-section) auto 0; border-top: 1px solid var(--rule-firm);
  border-bottom: 1px solid var(--rule);
}
.tfp-tests article {
  min-width: 0; padding: 1.15rem 0.9rem 1.35rem; border-right: 1px solid var(--rule);
}
.tfp-tests article:first-child { padding-left: 0; }
.tfp-tests article:last-child { border-right: 0; padding-right: 0; }
.tfp-tests span {
  display: block; font-family: var(--font-mono); font-size: 0.58rem;
  letter-spacing: 0.16em; color: var(--quiet); margin-bottom: 1.4rem;
}
.tfp-tests strong {
  display: block; min-height: 2.5em; font-family: var(--font-display);
  font-weight: 400; font-size: 1.02rem; line-height: 1.2; text-transform: uppercase;
}
.tfp-tests p { margin: 0.65rem 0 0; color: var(--deep); font-size: 0.87rem; line-height: 1.6; }
.tfp-featured-learning { margin-top: var(--home-space-section); }

.tfp-christ-field {
  display: grid; grid-template-columns: 0.85fr 1.15fr; gap: var(--gap);
  max-width: var(--max); margin: 0 auto; padding: clamp(2.2rem, 5vw, 4.5rem) var(--pad);
  background: var(--numinous); color: var(--white);
}
.tfp-christ-field .mono-eyebrow { color: var(--white); }
.tfp-christ-field h3 {
  max-width: 13ch; color: var(--white); font-size: clamp(2.2rem, 4.8vw, 4.4rem); line-height: 0.94;
}
.tfp-christ-field > div:last-child > p {
  max-width: 55ch; margin: 0 0 1rem; color: var(--white); font-size: 1.03rem; line-height: 1.72;
}
.tfp-christ-field .tfp-conviction-note {
  margin-top: 1.7rem; padding-top: 1rem; border-top: 1px solid var(--white);
  font-family: var(--font-mono); font-size: 0.62rem; line-height: 1.65;
  letter-spacing: 0.12em; text-transform: uppercase;
}

.tfp-deepening-grid {
  display: grid; grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(2rem, 5vw, 4rem); max-width: var(--max); margin: var(--home-space-section) auto 0;
  padding: var(--home-space-section) var(--pad); border-top: 1px solid var(--rule-firm);
  border-bottom: 1px solid var(--rule); align-items: start;
}
.tfp-deepening-copy h3 {
  font-size: clamp(2rem, 4vw, 3.4rem); line-height: 0.96; margin: 0.75rem 0 1.1rem;
}
.tfp-deepening-copy > p { color: var(--deep); font-size: 1rem; line-height: 1.7; }
.tfp-deepening-copy > p:last-child { margin-top: 1.5rem; }
.tfp-fibonacci { margin: 0 0 var(--home-space-local); color: var(--numinous); }
.tfp-fibonacci svg { display: block; width: 100%; height: auto; overflow: visible; }
.tfp-fib-grid {
  fill: none; stroke: var(--rule); stroke-width: 1; vector-effect: non-scaling-stroke;
}
.tfp-fib-path {
  fill: none; stroke: var(--numinous); stroke-width: 2; vector-effect: non-scaling-stroke;
}
.tfp-fib-dot { fill: var(--numinous); }
.tfp-fib-caption { display: flex; align-items: center; gap: 0.8rem; margin-top: 0.65rem; }
.tfp-fib-caption::before { content: ""; width: 3rem; height: 1px; background: var(--numinous); }
.tfp-registers { display: grid; grid-template-columns: 13fr 8fr; gap: 0; }
.tfp-register:first-child { padding-right: var(--home-space-local); }
.tfp-register + .tfp-register {
  padding-left: var(--home-space-local); border-left: 1px solid var(--rule);
}
.tfp-register h3 { font-size: 1.4rem; margin-bottom: 0.8rem; }
.tfp-register .preparation-blocks { grid-template-columns: 1fr; }
.tfp-register .preparation-blocks li { padding: 0.62rem 0; }
.tfp-register .spiral-fields li { padding: 0.62rem 0; }

.tfp-covenant {
  width: min(calc(100% - (2 * var(--pad))), var(--max)); padding-left: 0; padding-right: 0;
  grid-template-columns: 0.72fr 1.28fr;
}
.tfp-covenant .covenant-intro h3 {
  max-width: 14ch; font-size: clamp(2.5rem, 5.6vw, 5rem); line-height: 0.92; margin: 0.75rem 0 1.1rem;
}
.tfp-covenant .covenant-promises { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.tfp-folio {
  max-width: var(--max); margin: var(--home-space-section) auto 0; padding: 0 var(--pad);
}
.tfp-folio-head {
  display: flex; justify-content: space-between; align-items: end; gap: 1.5rem;
  padding-bottom: 1rem; border-bottom: 1px solid var(--rule-firm);
}
.tfp-folio-head h3 { font-size: clamp(2rem, 4vw, 3.2rem); line-height: 0.98; }
.tfp-index-row {
  display: grid; grid-template-columns: 7rem minmax(10rem, 0.8fr) 1.2fr 1.4rem;
  gap: 1.1rem; align-items: baseline; padding: 1rem 0; border-bottom: 1px solid var(--rule);
  text-decoration: none;
}
.tfp-index-row h3 { font-size: 1.3rem; line-height: 1.08; text-transform: none; }
.tfp-index-row p:not(.mono-eyebrow) { margin: 0; color: var(--deep); font-size: 0.92rem; line-height: 1.55; }
.tfp-index-row:hover h3 { color: var(--pressed); }

.tfp-closing {
  display: grid; grid-template-columns: 1fr 0.85fr; gap: var(--gap); align-items: center;
  max-width: var(--max); margin: var(--home-space-section) auto 0; padding: var(--home-space-section) var(--pad);
  border-top: 1px solid var(--rule-firm); border-bottom: 1px solid var(--rule);
}
.tfp-closing h3 { font-size: clamp(2.2rem, 4.5vw, 3.7rem); margin: 0.5rem 0 1rem; }
.tfp-closing p { color: var(--deep); font-size: 1rem; line-height: 1.65; }
.tfp-closing .tfp-return {
  margin: 0; color: var(--numinous); font-family: var(--font-display);
  font-size: clamp(1.35rem, 2.6vw, 2rem); line-height: 1.45;
}

/* ---------- site footer --------------------------------------------------- */

.site-footer { border-top: 1px solid var(--rule); margin-top: clamp(3rem, 6vw, 5rem); }
.footer-integrity {
  max-width: var(--max); margin: 0 auto; padding: 1.5rem var(--pad) 0;
  font-family: var(--font-mono); font-size: 0.7rem; line-height: 1.8;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--quiet);
}
.footer-inner {
  max-width: var(--max); margin: 0 auto; padding: 1.1rem var(--pad) 2rem;
  display: flex; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap;
}
.footer-inner nav { display: flex; gap: 1.4rem; flex-wrap: wrap; }
.footer-inner a { text-decoration: none; }
.footer-copy { margin: 0; }

/* ==========================================================================
   THE READING WORLD — posts and pages
   Same ground, same ink. The frontispiece-and-interior split is gone; there is
   no dark world to cross into and no second identity to reconcile.
   ========================================================================== */

.folio-article { max-width: 40rem; margin: 0 auto; padding: clamp(2rem, 5vw, 3.5rem) var(--pad) 0; }
.folio-header { margin-bottom: 2.2rem; }
.folio-title { font-size: clamp(2rem, 4.4vw, 3.2rem); line-height: 1.02; margin: 0.8rem 0 0; }

.folio-feature { margin: 2rem 0; }
.folio-feature img { width: 100%; height: auto; }

/* One compact orientation row; evidence distinctions and cautions live with the teaching. */
.lesson-lintel {
  padding: 0 0 1rem; margin: -0.7rem 0 2rem;
  border-bottom: 1px solid var(--rule);
}
.lesson-context {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.4rem 1.5rem;
  margin: 0; font-family: var(--font-mono); font-size: 0.7rem; line-height: 1.7;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--numinous);
}

.gh-content { font-size: 1.075rem; line-height: 1.78; color: var(--deep); }
.gh-content p { margin: 0 0 1.35rem; }
.gh-content > p:first-of-type::first-letter {
  font-family: var(--font-display); float: left;
  font-size: 4.2rem; line-height: 0.82; padding: 0.12rem 0.5rem 0 0;
  color: var(--numinous);
}
/* a lesson opening with an emphasised line should not take the drop cap */
.gh-content > p:first-of-type em::first-letter { all: unset; }

.gh-content h2, .gh-content h3, .gh-content h4 {
  color: var(--numinous); margin: 2.3rem 0 0.85rem; padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--rule);
}
.gh-content h2 { font-size: 1.6rem; }
.gh-content h3 { font-size: 1.3rem; }
.gh-content h4 { font-size: 1.1rem; }

.gh-content a {
  color: var(--numinous); text-decoration: underline;
  text-decoration-thickness: 1px; text-underline-offset: 2px;
}
.gh-content a:hover { color: var(--pressed); }

.gh-content blockquote {
  margin: 1.9rem 0; padding: 0.1rem 0 0.1rem 1.35rem;
  border-left: 2px solid var(--numinous);
  font-family: var(--font-display); text-transform: none;
  font-size: 1.16rem; line-height: 1.58; color: var(--numinous);
}
.gh-content blockquote p { margin: 0.4em 0; }

/* ---------- the threshold -------------------------------------------------
   The article's opening blockquote is the threshold dialogue. It is the one
   blockquote on the page that is not a quotation, so it sheds the quotation
   treatment entirely: no left bar, a hairline chamber instead, and a versal.

   The two voices are told apart by position, never by colour. The seeker takes
   the odd paragraphs and the answering voice the even ones. Tinting the answer
   was tried and rejected: --quiet composites to rgb(117,102,79), a ratio of
   3.43:1 on white, under the 4.5:1 AA floor for body text, and at the rendered
   18.56px unbolded it does not reach the large-text exemption. Both voices
   therefore stay at --numinous, 7.93:1.
   ------------------------------------------------------------------------- */
.gh-content > blockquote:first-child {
  border: 1px solid var(--rule);
  padding: 2.1rem 2rem;
  margin: 0 0 2.6rem;
  font-family: var(--font-display);
  font-size: 1.16rem;
  line-height: 1.6;
  color: var(--numinous);
  text-transform: none;
}
.gh-content > blockquote:first-child p { margin: 0 0 1.15rem; }
.gh-content > blockquote:first-child p:last-child { margin-bottom: 0; }

/* Editorial draft status is separate from the inward dialogue and teaching. */
.gh-content > .lecture-draft-note {
  margin: 0 0 1.8rem;
  padding: 0.9rem 1rem;
  border-left: 2px solid var(--numinous);
  color: var(--deep);
}
.gh-content > .lecture-draft-note p {
  margin: 0;
  font-family: var(--font-body);
  font-size: 0.85rem;
  line-height: 1.65;
}

/* the versal, on the opening word */
.gh-content > blockquote:first-child p:first-child::first-letter {
  font-family: var(--font-display);
  float: left;
  font-size: 3.1rem;
  line-height: 0.8;
  padding: 0.1rem 0.42rem 0 0;
  color: var(--numinous);
  -webkit-text-stroke: var(--display-stroke) currentColor;
  paint-order: stroke fill;
}

/* the voice that answers: set in, behind a hairline */
.gh-content > blockquote:first-child p:nth-child(even) {
  margin: 0 0 1.35rem 1.9rem;
  padding-left: 1.1rem;
  border-left: 1px solid var(--rule-firm);
}

.gh-content ul, .gh-content ol { padding-left: 1.15rem; }
.gh-content li { margin: 0.45rem 0; }
.gh-content li::marker { color: var(--numinous); }
.gh-content ol li::marker { font-family: var(--font-mono); font-size: 0.85em; }
.gh-content strong { color: var(--numinous); }
.gh-content hr { border: 0; border-top: 1px solid var(--rule); margin: 2.4rem 0; }
.gh-content img { width: 100%; height: auto; }
.gh-content figcaption {
  font-family: var(--font-mono); font-size: 0.64rem; line-height: 1.85;
  color: var(--quiet); margin-top: 0.85rem; text-align: center;
}

/* ---------- the three closing sections ------------------------------------
   Set as apparatus, not as more teaching. Their headings are mono and quiet,
   the same register as the lintel labels, so they do not compete with the
   author's own h2 headings above them.
   ------------------------------------------------------------------------- */
.tfp-plain,
.tfp-practices,
.tfp-library {
  margin-top: 2.8rem;
  padding-top: 0.2rem;
  border-top: 1px solid var(--rule-firm);
}

.tfp-plain > h2,
.tfp-practices > h2,
.tfp-library > h2 {
  border-bottom: 0;
  padding-bottom: 0;
  margin: 1.2rem 0 1rem;
  font-family: var(--font-mono);
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  color: var(--quiet);
  -webkit-text-stroke: 0;
}

/* In plain terms: a rule instead of a bullet, so the recap reads as a summary
   rather than as another list inside the teaching. */
.tfp-plain ul { padding-left: 0; list-style: none; }
.tfp-plain li { position: relative; padding-left: 1.4rem; font-size: 1.02rem; }
.tfp-plain li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.62em;
  width: 0.7rem;
  height: 1px;
  background: var(--numinous);
}

/* The practices: each gets a hairline and its own block. */
.tfp-practices > h2 { margin-bottom: 1.4rem; }
.tfp-practice {
  display: grid;
  grid-template-columns: 1px 1fr;
  gap: 0 1.2rem;
  margin: 0 0 1.6rem;
}
.tfp-practice::before { content: ""; display: block; background: var(--rule-firm); }
.tfp-practice h3 {
  border-bottom: 0;
  padding-bottom: 0;
  margin: 0 0 0.4rem;
  font-size: 1.05rem;
}
.tfp-practice p { margin: 0; font-size: 1rem; }

/* The Library. */
.tfp-library ul { list-style: none; padding-left: 0; }
.tfp-library li { margin: 0.6rem 0; font-size: 1rem; }

/* ---------- Koenig editor cards ------------------------------------------- */

/* Ghost's editor emits these classes for wide/full images, galleries and
   bookmark cards. The previous theme styled only the two width classes, so a
   bookmark or gallery dropped out of the design entirely — twelve of these were
   already unstyled before this register existed. All fourteen are covered here.

   Bookmarks get the tile treatment: a violet keyline and a violet thumbnail
   ground, so an embedded link reads as an object on the page like every plate
   does, rather than as a card borrowed from somewhere else. */

.kg-width-wide { max-width: 58rem; margin-left: 50%; transform: translateX(-50%); }
.kg-width-full { max-width: 100vw; margin-left: 50%; transform: translateX(-50%); }

.kg-gallery-container { display: flex; flex-direction: column; gap: 0.7rem; }
.kg-gallery-row { display: flex; gap: 0.7rem; }
.kg-gallery-image img { width: 100%; height: 100%; object-fit: cover; display: block; }

.kg-bookmark-card { margin: 1.9rem 0; }
.kg-bookmark-container {
  display: flex; text-decoration: none; color: var(--deep);
  border: 1px solid var(--rule-firm); min-height: 8rem;
}
.kg-bookmark-container:hover { border-color: var(--numinous); }
.kg-bookmark-content { flex: 1 1 auto; padding: 1.1rem 1.2rem; order: 1; }
.kg-bookmark-title {
  font-family: var(--font-display); text-transform: uppercase;
  font-size: 1.05rem; line-height: 1.15; color: var(--numinous);
}
.kg-bookmark-description {
  font-size: 0.92rem; line-height: 1.6; color: var(--deep);
  margin-top: 0.5rem; display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; overflow: hidden;
}
.kg-bookmark-metadata {
  display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem;
  margin-top: 0.85rem; font-family: var(--font-mono); font-size: 0.6rem;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--quiet);
}
.kg-bookmark-icon { width: 14px; height: 14px; }
.kg-bookmark-author, .kg-bookmark-publisher { white-space: nowrap; }
.kg-bookmark-publisher::before { content: "·"; margin-right: 0.5rem; }
.kg-bookmark-thumbnail {
  order: 2; flex: 0 0 33%; background: var(--numinous); overflow: hidden;
}
.kg-bookmark-thumbnail img { width: 100%; height: 100%; object-fit: cover; display: block; }

@media (max-width: 640px) {
  .kg-bookmark-container { flex-direction: column; }
  .kg-bookmark-thumbnail { flex-basis: 10rem; order: 0; }
  .kg-gallery-row { flex-direction: column; }
}

.folio-footer { max-width: 40rem; margin: 2.6rem auto 0; padding: 0 var(--pad); }
.folio-footer .rule-line span { border-top: 1px solid var(--rule); }

/* ---------- lesson return ------------------------------------------------- */

.lesson-return {
  max-width: 40rem; margin: 3rem auto 0; padding: 0 var(--pad);
}
.lesson-return-nav {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
  gap: 1px; background: var(--rule); margin-top: 1.8rem;
}
.lesson-return-nav a {
  background: var(--white); padding: 1.05rem 1rem; text-decoration: none;
  display: block;
}
.lesson-return-nav a:hover { background: rgba(88,71,47, 0.05); }
.lesson-return-nav span {
  display: block; font-family: var(--font-mono); font-size: 0.56rem;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--quiet);
  margin-bottom: 0.3rem;
}
.lesson-return-nav strong {
  font-family: var(--font-display); font-weight: 400; text-transform: uppercase;
  font-size: 1rem;
}

/* ==========================================================================
   ARCHIVES — index and tag
   The three pillars are told apart by subject and plate, never by hue. The old
   per-pillar colour coding (orange Body, teal Balance, blue Being) is gone:
   the brief differentiates them through subject, geometry, light distribution
   and engraving density, not separate brand colours.
   ========================================================================== */

.archive-head {
  max-width: var(--max); margin: 0 auto; padding: clamp(2.4rem, 5vw, 4rem) var(--pad) 0;
}
.archive-head h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); line-height: 0.98; }
.tag-description {
  font-size: 1.05rem; line-height: 1.7; color: var(--deep);
  max-width: 52ch; margin: 1.1rem 0 0;
}

.pagination {
  max-width: var(--max); margin: 3rem auto 0; padding: 1.3rem var(--pad);
  border-top: 1px solid var(--rule);
  display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.14em;
  text-transform: uppercase;
}
.pagination a { text-decoration: none; }
.page-number { color: var(--quiet); }

/* ---------- responsive ---------------------------------------------------- */

@media (max-width: 1000px) {
  .levels-grid, .posts-grid { grid-template-columns: 1fr 1fr; }
  .plate-hero, .plate-split, .featured-learning-grid,
  .preparation-reliquary, .spiral-map, .learner-covenant {
    grid-template-columns: 1fr;
  }
  .plate-hero { align-items: start; }
  .tfp-synthesis-head, .tfp-two-part-head,
  .tfp-christ-field, .tfp-deepening-grid, .tfp-closing {
    grid-template-columns: 1fr;
  }
  .tfp-tests { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tfp-tests article:nth-child(2) { border-right: 0; }
  .tfp-tests article:nth-child(3) { padding-left: 0; }
  .tfp-tests article:last-child { border-right: 0; }
  .tfp-covenant .covenant-promises { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .levels-grid, .posts-grid,
  .preparation-blocks, .covenant-promises { grid-template-columns: 1fr; }
  .home-template {
    --home-space-macro: clamp(4rem, 18vw, 5rem);
    --home-space-section: clamp(1.75rem, 9vw, 2.5rem);
    --home-space-local: clamp(0.75rem, 4vw, 1.25rem);
  }
  .tfp-marker { grid-template-columns: auto 1fr; }
  .tfp-marker i { grid-column: 1 / -1; }
  .tfp-marker h2 { white-space: normal; }
  .tfp-mission-hero .title-row { gap: 0.75rem; }
  .tfp-mission-hero .plate-hero-title { font-size: clamp(2.25rem, 12vw, 3.35rem); }
  .tfp-rhythm { grid-template-columns: 1fr 1fr; }
  .tfp-rhythm span { border-bottom: 1px solid var(--rule); }
  .tfp-rhythm span:nth-child(even) { border-right: 0; }
  .tfp-rhythm span:last-child { grid-column: 1 / -1; border-bottom: 0; }
  .tfp-synthesis-grid { grid-template-columns: 1fr; }
  .tfp-synthesis-grid article,
  .tfp-synthesis-grid article:first-child,
  .tfp-synthesis-grid article:last-child {
    padding: 1.25rem 0 1.5rem; border-right: 0; border-bottom: 1px solid var(--rule);
  }
  .tfp-synthesis-grid article:last-child { border-bottom: 0; }
  .levels-grid .door {
    display: grid; grid-template-columns: 6.5rem minmax(0, 1fr);
    grid-template-areas:
      "plate label"
      "plate title"
      "plate blurb"
      "credit ask";
    column-gap: 1rem; row-gap: 0.35rem; padding-bottom: 1.4rem;
    border-bottom: 1px solid var(--rule);
  }
  .levels-grid .door > .mono-eyebrow { grid-area: label; }
  .levels-grid .door > h3 { grid-area: title; margin: 0.15rem 0 0.35rem; }
  .levels-grid .door > .tile { grid-area: plate; align-self: start; }
  .levels-grid .door > .plate-credit { grid-area: credit; display: block; font-size: 0.5rem; }
  .levels-grid .door > .door-blurb { grid-area: blurb; }
  .levels-grid .door > .door-ask { grid-area: ask; }
  .tfp-tests { grid-template-columns: 1fr; }
  .tfp-tests article,
  .tfp-tests article:first-child,
  .tfp-tests article:nth-child(3),
  .tfp-tests article:last-child {
    padding: 1rem 0 1.2rem; border-right: 0; border-bottom: 1px solid var(--rule);
  }
  .tfp-tests article:last-child { border-bottom: 0; }
  .tfp-tests span { margin-bottom: 0.75rem; }
  .tfp-tests strong { min-height: 0; }
  .tfp-christ-field h3 { margin-bottom: 1.4rem; }
  .tfp-covenant .covenant-promises { grid-template-columns: 1fr; }
  .tfp-folio-head { align-items: start; flex-direction: column; }
  .tfp-index-row { grid-template-columns: 5.2rem 1fr 1.2rem; gap: 0.65rem; }
  .tfp-index-row p:not(.mono-eyebrow) { display: none; }
}

@media (max-width: 440px) {
  .tfp-registers { grid-template-columns: 1fr; }
  .tfp-register:first-child { padding-right: 0; }
  .tfp-register + .tfp-register {
    padding-left: 0; margin-top: var(--home-space-local); border-left: 0;
  }
}

/* ==========================================================================
   THE ALEXANDRIAN LIBRARY — one record per source
   ========================================================================== */

.library-meta {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: 1rem; margin: 0 0 2rem; padding: 1.1rem 0;
  border-top: 1px solid var(--numinous); border-bottom: 1px solid var(--rule);
}
.library-meta div { font-family: var(--font-mono); font-size: 0.66rem; line-height: 1.7; }
.library-meta dt {
  font-size: 0.58rem; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--quiet); margin-bottom: 0.3rem;
}
.library-meta dd { margin: 0; color: var(--deep); }

/* an arc test is the author's own words about a source's reach, so it is set apart */
.library-summary blockquote {
  margin: 0.6rem 0 1.6rem; padding: 0 0 0 1.1rem;
  border-left: 2px solid var(--numinous);
  font-size: 0.97rem; line-height: 1.7; color: var(--deep);
}
.library-summary h3 {
  font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--quiet); margin: 2rem 0 0; padding: 0; border: 0;
}
.library-draft-note {
  font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--quiet);
  border: 1px solid var(--rule); padding: 0.5rem 0.75rem; margin: 0 0 1.5rem;
}
.library-return { margin: 2.5rem 0 0; padding-top: 1.1rem; border-top: 1px solid var(--rule); }

/* Sourced plate rendered as an ASCII halftone in the one ink. Used by the
   homepage threshold and by each school's door plate.

   The <img> is the fallback: it stays visible until a render succeeds, and is
   then hidden with visibility rather than display, because a plate sized from
   its own natural aspect would collapse to zero height if the image left the
   flow. The canvas carries the image's alt text as its aria-label. */
[data-ascii-plate] {
  --ascii-ink: #58472f;
  --ascii-paper: #f4efe4;
  position: relative;
  display: block;
}
.tfp-ascii-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
}
[data-ascii-plate].is-ascii img { visibility: hidden; }
[data-ascii-plate].is-ascii::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid var(--rule);
  pointer-events: none;
}
/* Ghost's bundled welcome image is a setup placeholder, not an authored plate.
   Suppress its whole mount in readings and archives; keep stored content intact. */
:is(.folio-feature, .post-card-image):has(img[src="https://static.ghost.org/v4.0.0/images/feature-image.jpg"]) {
  display: none;
}