/* ============================================================================
   PRIORAXIS theme — components + layout
   Transcribed VERBATIM from the committed prototypes (CO-55):
     front page  → PA_homepage_prototype_v3.0.html  (8a7835f)
     record page → PA_record_page_prototype_v1.2.html (e5d2564)
     long-form   → PA_longform_template_prototype_v1.html (38849ae)
   Deviations from the prototypes are wording/mechanics only and every one is
   logged in DEVIATIONS.md. The three changes visible here:
     - font-family literals → var(--font-*) (D1; the faces are SELF-HOSTED as of
       CO-59 — see tokens.css @font-face, no CDN at render time).
     - the prototype `.ph` dashed-placeholder convention and `.proto-tag` are
       DROPPED (prototype-only), and as of CO-59 so is `.pa-empty`: nothing on a
       public surface renders a placeholder value (hide, never placeholder).
     - a `.skip-link` is ADDED (D3). `.badge--empty` (D4) is DELETED — the badge
       is gated on a real zone now, so an empty badge has no render path.
   Tokens live in tokens.css (Design System §6, single source).
   ============================================================================ */

/* ============ base ============ */
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
html { font-size:16px; }
body {
  background:var(--ground); color:var(--ink);
  font-family:var(--font-sans);
  font-weight:400; line-height:1.6;
  -webkit-font-smoothing:antialiased;
  /* CO-59 item 3: tabular figures GLOBALLY — a column of dates or values must not
     re-flow as digits change width. Applies to Inter and Plex Mono alike. */
  font-variant-numeric:tabular-nums;
  font-feature-settings:'tnum' 1;
}
.mono { font-family:var(--font-mono); }
a { color:var(--link); text-decoration:none; }
a:hover { text-decoration:underline; }
:focus-visible { outline:2px solid var(--ink); outline-offset:2px; border-radius:2px; }
img, svg { display:block; max-width:100%; }
button { font:inherit; cursor:pointer; }

.wrap { max-width:1120px; margin:0 auto; padding:0 24px; }
section { padding:64px 0; }
h1, h2, h3 { color:var(--headline); }
h1 { font-size:2.4375rem; font-weight:600; line-height:1.2; letter-spacing:-.01em; }
h2 { font-size:1.5625rem; font-weight:600; line-height:1.2; letter-spacing:-.01em; }
h3 { font-size:1.25rem; font-weight:500; line-height:1.25; }

/* accessibility: skip link (D3 — added; WP a11y basics) */
.skip-link { position:absolute; left:-9999px; top:0; }
.skip-link:focus { left:8px; top:8px; z-index:50; background:var(--surface); color:var(--ink);
  border:1px solid var(--rule); border-radius:var(--radius-s); padding:8px 12px; }

/* provenance eyebrow — design system component 1 */
.eyebrow {
  font-family:var(--font-mono);
  font-size:.8125rem; font-weight:500;
  text-transform:uppercase; letter-spacing:.06em;
  color:var(--ink-muted);
}

/* ============ nav ============ */
header {
  border-bottom:1px solid var(--rule);
  background:var(--ground);
}
.nav { display:flex; align-items:center; gap:32px; height:64px; }
.nav .logo { font-family:var(--font-mono); font-weight:500; font-size:1rem; letter-spacing:.06em; color:var(--ink); }
.nav ul { display:flex; gap:24px; list-style:none; margin-left:auto; align-items:center; }
.nav ul a { color:var(--ink); font-weight:500; font-size:1rem; }
.btn-primary {
  display:inline-block; background:var(--ink); color:var(--ground);
  border:1px solid var(--ink); border-radius:var(--radius-s);
  padding:8px 16px; font-weight:500; font-size:1rem;
  transition:opacity 150ms ease-out;
}
.btn-primary:hover { opacity:.85; text-decoration:none; }
/* F1 fix (CO-55 render finding): the nav CTA is <a class="btn-primary"> inside
   `.nav ul`, so `.nav ul a` (specificity 0,1,2) out-ranked `.btn-primary`
   (0,1,0) and forced the label to var(--ink) — ink text on the ink button
   background = an invisible label ("empty dark rectangle") in both themes. This
   nav-scoped rule (0,2,2) restores the button's own ground-on-ink label. The
   same latent bug is in the committed prototypes' CSS — see DEVIATIONS D12. */
.nav ul a.btn-primary { color:var(--ground); }
.btn-ghost {
  display:inline-block; background:transparent; color:var(--ink);
  border:1px solid var(--rule); border-radius:var(--radius-s);
  padding:7px 12px; font-size:.8125rem; font-family:var(--font-mono);
}
.theme-toggle { margin-left:8px; }

/* ============ hero ============ */
.hero { padding:64px 0 48px; }
.hero .eyebrow { margin-bottom:12px; }
.badge {
  display:inline-flex; align-items:baseline; gap:12px;
  background:var(--z-deep-value-tint); color:var(--z-deep-value-text);
  border-radius:var(--radius-s); padding:8px 16px; margin-bottom:24px;
}
.badge .zone-name { font-weight:600; font-size:1.5625rem; line-height:1.2; }
.badge .badge-date { font-family:var(--font-mono); font-size:.8125rem; color:var(--z-deep-value-text); opacity:.85; }
/* per-zone badge tints (badge colour follows the live zone; single-source tokens) */
.badge.z-dv { background:var(--z-deep-value-tint); color:var(--z-deep-value-text); }
.badge.z-dv .badge-date { color:var(--z-deep-value-text); }
.badge.z-v  { background:var(--z-value-tint); color:var(--z-value-text); }
.badge.z-v  .badge-date { color:var(--z-value-text); }
.badge.z-n  { background:var(--z-neutral-tint); color:var(--z-neutral-text); }
.badge.z-n  .badge-date { color:var(--z-neutral-text); }
.badge.z-e  { background:var(--z-elevated-tint); color:var(--z-elevated-text); }
.badge.z-e  .badge-date { color:var(--z-elevated-text); }
.badge.z-d  { background:var(--z-distribution-tint); color:var(--z-distribution-text); }
.badge.z-d  .badge-date { color:var(--z-distribution-text); }
.hero h1 { max-width:20ch; margin-bottom:16px; }
.hero .sub { color:var(--ink-muted); max-width:52ch; margin-bottom:32px; font-size:1.25rem; }

/* chart frame — holds the pipeline-rendered band chart. The whole card renders
   only when that image exists (CO-59 item 1); there is no stand-in state. */
.chart-frame {
  background:var(--surface); border:1px solid var(--rule);
  border-radius:var(--radius-m);
  padding:24px; position:relative;
}
.chart-frame .eyebrow { margin-bottom:12px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; }
.chart-note { font-family:var(--font-mono); font-size:.8125rem; color:var(--ink-muted); margin-top:12px; }
/* the pipeline-rendered band chart (CO-59: the card renders only when it exists) */
.chart-img { width:100%; height:auto; border-radius:var(--radius-s); }

/* legend */
.legend { display:flex; gap:12px; flex-wrap:wrap; margin-top:16px; }
.legend .chip {
  display:inline-flex; align-items:center; gap:6px;
  font-family:var(--font-mono); font-size:.8125rem;
  padding:3px 8px; border-radius:var(--radius-s);
}
.legend .swatch { width:10px; height:10px; border-radius:2px; }
.chip.z-dv { background:var(--z-deep-value-tint); color:var(--z-deep-value-text); } .chip.z-dv .swatch { background:var(--z-deep-value); }
.chip.z-v  { background:var(--z-value-tint); color:var(--z-value-text); }           .chip.z-v .swatch  { background:var(--z-value); }
.chip.z-n  { background:var(--z-neutral-tint); color:var(--z-neutral-text); }       .chip.z-n .swatch  { background:var(--z-neutral); }
.chip.z-e  { background:var(--z-elevated-tint); color:var(--z-elevated-text); }     .chip.z-e .swatch  { background:var(--z-elevated); }
.chip.z-d  { background:var(--z-distribution-tint); color:var(--z-distribution-text); } .chip.z-d .swatch { background:var(--z-distribution); }

/* verdict chips — design system components 3 & 4, shared geometry */
.flag-chip, .hit-chip {
  display:inline-flex; align-items:center; gap:6px;
  font-family:var(--font-mono); font-size:.8125rem; font-weight:500;
  padding:3px 8px; border-radius:var(--radius-s);
}
.flag-chip { background:var(--v-flag-tint); color:var(--v-flag); border-left:3px solid var(--v-flag); }
.hit-chip  { background:var(--v-hit-tint);  color:var(--v-hit);  border-left:3px solid var(--v-hit); }

/* email capture */
.capture { margin-top:32px; max-width:480px; }
.capture form { display:flex; gap:8px; }
.capture input[type="email"] {
  flex:1; padding:10px 12px; font:inherit;
  background:var(--surface); color:var(--ink);
  border:1px solid var(--rule); border-radius:var(--radius-s);
}
.capture .qualifier {
  margin-top:8px; font-family:var(--font-mono);
  font-size:.8125rem; color:var(--ink-muted);
}

/* ============ gap block ============ */
.gap { border-top:1px solid var(--rule); }
.gap .lead { max-width:60ch; color:var(--ink-muted); margin-top:16px; font-size:1.25rem; }
.reasons { margin:24px 0 8px; padding-left:20px; max-width:60ch; display:flex; flex-direction:column; gap:8px; }
.gap .capture { margin-top:24px; }
.gap-repeat { padding:48px 0; }
.record-link { margin-top:24px; }
.trust .lead { max-width:60ch; color:var(--ink-muted); margin-top:16px; font-size:1.25rem; }

/* ============ trust block ============ */
.trust { border-top:1px solid var(--rule); }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:32px; }
.card {
  background:var(--surface); border:1px solid var(--rule);
  border-radius:var(--radius-m);
  padding:24px; display:flex; flex-direction:column; gap:12px;
}
.card h3 { font-weight:500; }
.card p { color:var(--ink-muted); font-size:1rem; }
.card .verify {
  margin-top:auto; font-family:var(--font-mono); font-size:.8125rem;
}

/* ============ origin ============ */
.origin { border-top:1px solid var(--rule); }
.origin blockquote {
  font-family:var(--font-sans); font-style:italic; font-size:1.5625rem; line-height:1.45;
  max-width:34ch; margin-top:16px;
}
.origin .attrib { margin-top:16px; }

/* ============ monday post ============ */
.post { border-top:1px solid var(--rule); }
.post-card {
  display:grid; grid-template-columns:1fr; gap:32px; margin-top:32px;
  background:var(--surface); border:1px solid var(--rule);
  border-radius:var(--radius-m); padding:32px;
}
.post-card .excerpt { font-size:1.25rem; line-height:1.6; margin:12px 0 16px; }

/* ============ method teaser ============ */
.method { border-top:1px solid var(--rule); }
.method .lead { max-width:60ch; color:var(--ink-muted); margin-top:16px; font-size:1.25rem; }
.method .mono-link { display:inline-block; margin-top:16px; font-family:var(--font-mono); font-size:.8125rem; }

/* ============ explainer library ============ */
.library { border-top:1px solid var(--rule); }
.lib-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:32px; }
.lib-item {
  background:var(--surface); border:1px solid var(--rule); border-radius:var(--radius-s);
  padding:16px 20px; display:flex; align-items:baseline; gap:16px;
  transition:border-color 150ms ease-out;
}
.lib-item:hover { border-color:var(--ink-muted); text-decoration:none; }
.lib-item .idx { font-family:var(--font-mono); font-size:.8125rem; color:var(--ink-muted); }
.lib-item .t { color:var(--ink); font-weight:500; }
.lib-note { margin-top:16px; font-size:.8125rem; font-family:var(--font-mono); color:var(--ink-muted); }

/* ============ footer ============ */
footer { border-top:1px solid var(--rule); padding:48px 0 64px; }
.boundary {
  font-family:var(--font-sans); font-style:italic;
  font-size:1.25rem; max-width:44ch;
}
.footer-lines { margin-top:24px; display:flex; flex-direction:column; gap:8px; }
.footer-lines .line { font-family:var(--font-mono); font-size:.8125rem; color:var(--ink-muted); }

/* ============ record page ============ */
.pinned {
  background:var(--surface); border:1px solid var(--rule);
  border-left:3px solid var(--ink); border-radius:var(--radius-s);
  padding:16px 20px; margin-top:24px; max-width:72ch;
  font-family:var(--font-mono); font-size:.8125rem; line-height:1.6;
}
.record-table { width:100%; border-collapse:collapse; margin-top:32px;
  background:var(--surface); border:1px solid var(--rule); border-radius:var(--radius-m);
  overflow:hidden; }
.record-table th {
  text-align:left; font-family:var(--font-mono); font-size:.8125rem;
  font-weight:500; text-transform:uppercase; letter-spacing:.06em;
  color:var(--ink-muted); padding:12px 16px; border-bottom:1px solid var(--rule);
}
.record-table td { padding:14px 16px; vertical-align:top; font-size:1rem; }
.record-table td.num, .record-table td.date {
  font-family:var(--font-mono); font-size:.8125rem;
  font-variant-numeric:tabular-nums; white-space:nowrap; color:var(--ink);
}
.record-table tbody tr:nth-child(even) { background:var(--surface-alt); }
.record-table tbody tr { border-bottom:1px solid var(--rule); }
.zone-chip { display:inline-block; font-family:var(--font-mono);
  font-size:.8125rem; font-weight:500; padding:3px 8px; border-radius:var(--radius-s); }
.zc-dv { background:var(--z-deep-value-tint); color:var(--z-deep-value-text); }
.zc-v  { background:var(--z-value-tint); color:var(--z-value-text); }
.zc-e  { background:var(--z-elevated-tint); color:var(--z-elevated-text); }
.zc-d  { background:var(--z-distribution-tint); color:var(--z-distribution-text); }
.ungraded-chip { display:inline-flex; align-items:center; gap:6px;
  font-family:var(--font-mono); font-size:.8125rem; font-weight:500;
  padding:3px 8px; border-radius:var(--radius-s);
  background:var(--z-neutral-tint); color:var(--z-neutral-text);
  border-left:3px solid var(--z-neutral); }
.row-note { display:block; margin-top:6px; font-family:var(--font-mono);
  font-size:.8125rem; color:var(--ink-muted); }
.pre-badge { display:inline-flex; align-items:center; gap:6px;
  font-family:var(--font-mono); font-size:.8125rem; font-weight:500;
  padding:3px 8px; border-radius:var(--radius-s);
  background:var(--surface-alt); color:var(--ink-muted); border:1px dashed var(--ink-muted); }
.stats { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; margin-top:32px; max-width:720px; }
.stat { background:var(--surface); border:1px solid var(--rule); border-radius:var(--radius-m);
  padding:20px 24px; }
.stat .n { font-family:var(--font-mono); font-size:1.9375rem; font-weight:500; }
.stat .l { color:var(--ink-muted); font-size:.8125rem; font-family:var(--font-mono);
  text-transform:uppercase; letter-spacing:.06em; margin-top:4px; }
.era-table { margin-top:24px; }
.how-to-read { max-width:68ch; color:var(--ink-muted); margin-top:16px; font-size:1.25rem; }

/* ============ long-form (Method / Explainer / About) ============ */
.article { max-width:68ch; }
.article .lead { font-size:1.25rem; color:var(--ink-muted); margin-top:16px; }
.article-body { font-size:1.25rem; line-height:1.7; margin-top:32px; }
/* ============================================================================
   PAGE-CONTENT TYPOGRAPHY — WordPress-generated markup (D13)
   ----------------------------------------------------------------------------
   Scope: every wrapper that receives `the_content()` — `.article-body`
   (long-form + the index.php fallback), `.how-to-read` (Record framing), and
   `.entry-content` defensively, in case a WP setup emits the conventional class.

   Why this exists: the prototypes styled only their own hand-written markup, and
   the long-form prototype's `.article-body` contained a single placeholder
   paragraph and the verify-box — it never exercised an h2, a list, or a
   blockquote. The D9 em-dash empty-states meant no page rendered real WP block
   output until the operator populated Record and Method, at which point headings
   fell back to near-body-size and the global reset's `margin:0` / `padding:0`
   left paragraphs unspaced and list markers unindented.

   Selectors are wrapper-scoped (specificity 0,1,1), which comfortably beats
   WordPress core's `:where()`-wrapped global styles (specificity 0,0,0).
   Sizes are Design System §2 scale steps (13/16/20/25/31/39/49); spacing is the
   §3 scale (4px base). Where the DS is silent — long-form heading sizes, list
   and blockquote treatment, prose link underlines — the choice is logged in
   DEVIATIONS.md as D13.
   ========================================================================== */

/* --- block rhythm (all direct children) --- */
.article-body > *, .how-to-read > *, .entry-content > * { margin-bottom:24px; }
.article-body p, .how-to-read p, .entry-content p { margin-bottom:24px; }
.article-body > :first-child, .how-to-read > :first-child, .entry-content > :first-child { margin-top:0; }
.article-body > :last-child, .how-to-read > :last-child, .entry-content > :last-child { margin-bottom:0; }

/* --- headings: section hierarchy for long-form prose ---
   h2 = 31px (DS scale step above the 25px UI h2). Against 20px serif body that
   is a ~1.55x step, which reads as a section break; the inherited 25px UI h2 was
   only 1.25x over body and reported as "body text size". h3 = 25px/500 sits
   between. Sans per DS §2 (UI & headings), max weight 600 — DS forbids 700.

   Rhythm 24 / 48 / 12 (operator ruling, live review 2026-07-18): 24px between
   paragraphs, 48px ABOVE a heading, 12px BELOW it. The asymmetry is the point —
   a heading binds to the section it introduces rather than floating midway
   between two, so the space below is half the paragraph gap.
   Margin-collapse note: 12px is the FINAL rendered gap, not a value that gets
   collapsed away — the following paragraph carries `margin-top:0`, so there is
   no opposing margin to collapse against (unlike the 48px above, which IS a
   collapse of the previous block's 24px bottom against this 48px top). Both
   verified by measurement, not inspection. */
.article-body h2, .how-to-read h2, .entry-content h2 {
  font-family:var(--font-sans); font-size:1.9375rem; font-weight:600;
  line-height:1.2; letter-spacing:-.01em; color:var(--ink);
  margin-top:48px; margin-bottom:12px;
}
.article-body h3, .how-to-read h3, .entry-content h3 {
  font-family:var(--font-sans); font-size:1.5625rem; font-weight:500;
  line-height:1.25; color:var(--ink);
  margin-top:32px; margin-bottom:12px;
}

/* --- lists: the global reset zeroes padding, which clips the markers --- */
.article-body ul, .article-body ol,
.how-to-read ul, .how-to-read ol,
.entry-content ul, .entry-content ol { margin-bottom:24px; padding-left:24px; }
.article-body li, .how-to-read li, .entry-content li { margin-bottom:8px; }
.article-body li:last-child, .how-to-read li:last-child, .entry-content li:last-child { margin-bottom:0; }

/* --- blockquote: hairline rail, matching the verify-box idiom (borders over shadows, DS §3) --- */
.article-body blockquote, .how-to-read blockquote, .entry-content blockquote {
  border-left:3px solid var(--rule); padding-left:24px;
  color:var(--ink-muted); font-style:italic; margin-bottom:24px;
}

/* --- prose links: underlined. The global `a` rule drops the underline for UI
   chrome, but body prose must not signal a link by colour alone (WCAG 1.4.1). --- */
.article-body a, .how-to-read a, .entry-content a {
  text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:1px;
}

/* --- strong: 600, the DS ceiling (no 700). Note DS §2 lists the long-form serif
   at 400/400i only, so until IBM Plex Serif SemiBold is vendored the bold is
   synthesised by the fallback stack — already covered by D1. --- */
.article-body strong, .how-to-read strong, .entry-content strong { font-weight:600; }
.verify-box { background:var(--surface); border:1px solid var(--rule); border-left:3px solid var(--ink);
  border-radius:var(--radius-s); padding:16px 20px; font-family:var(--font-mono);
  font-size:.8125rem; line-height:1.6; }
.verify-box a { display:block; margin-top:6px; }
.shelf-mark { font-family:var(--font-mono); color:var(--ink-muted); font-size:.8125rem; margin-bottom:8px; }

/* ============ responsive ============ */
@media (max-width: 860px) {
  .cards { grid-template-columns:1fr; }
  .post-card { grid-template-columns:1fr; }
  .lib-grid { grid-template-columns:1fr; }
  .nav ul { gap:16px; }
  .nav ul li.hide-m { display:none; }
  h1 { font-size:1.9375rem; }
  section { padding:48px 0; }
  .record-table { display:block; overflow-x:auto; }
  .stats { grid-template-columns:1fr; }
}
@media (max-width: 520px) {
  .capture form { flex-direction:column; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration:0ms !important; }
}

/* --- Copy V3 (2026-07-22) additions. See DEVIATIONS D14. --- */
/* Connective strip: single ruled sentence bridging Lens -> Engine. Deliberately
   quiet — it is a bridge, not a section: no eyebrow, no heading, centred, short
   measure. Existing tokens + scale steps only; no new tokens. (CO-59: the serif
   is deleted, so the bridge reads in sans at the same size and colour.) */
.connective { border-top:1px solid var(--rule); padding:32px 0; }
.connective p {
	max-width:52ch; margin:0 auto; text-align:center;
	font-size:1.25rem; line-height:1.5;
	color:var(--ink-muted);
}
/* Flag line: sits above the footer boundary sentence. Mono, uppercase-free,
   quiet — it must not out-shout the boundary sentence below it. */
footer .flag {
	font-family:var(--font-mono); font-size:.8125rem; letter-spacing:.02em;
	color:var(--ink-muted); margin-bottom:16px;
}

/* ── Brand wordmark in the nav (2026-07-24, /brand/ identity source) ─────────────
   Replaces the text logo. Modest height (letters + axis + centred dot lockup);
   light wordmark on the light theme, paper wordmark under the dark toggle.
   Height is a single tunable value if the operator wants it larger/smaller. */
.nav .logo { display:inline-flex; align-items:center; line-height:0; }
.nav .logo .logo-mark { height:40px; width:auto; display:block; }
.nav .logo .logo-dark { display:none; }
[data-theme="dark"] .nav .logo .logo-light { display:none; }
[data-theme="dark"] .nav .logo .logo-dark { display:block; }

/* ============================================================================
   CO-58 · About "Who runs this" — founder portrait frame (2026-07-24).
   The live theme gains the Who-runs section (previously warm-only, W7): a
   restrained square portrait framed with a single hairline — classic/minimal
   register (borders over shadows, DS §3), distinct from the warm theme's 6px
   bone border. Rendered only when a page sets pa_portrait=on (About). The photo
   fills the frame (object-fit:cover). Existing tokens + DS scale steps only.
   ============================================================================ */
.who-runs { border-top:1px solid var(--rule); margin-top:48px; padding-top:40px; }
.who-runs > h2 { font-family:var(--font-sans); font-size:1.9375rem; font-weight:600;
  line-height:1.2; letter-spacing:-.01em; margin-bottom:24px; }
.who-grid { display:grid; grid-template-columns:180px 1fr; gap:32px; align-items:start; }
.who-body { max-width:56ch; font-size:1.25rem; line-height:1.7; color:var(--ink-muted); }
.who-body > * + * { margin-top:20px; }
.portrait-frame {
  width:180px; height:180px; border-radius:var(--radius-m);
  border:1px solid var(--rule); background:var(--surface-alt);
  overflow:hidden;
}
.portrait-frame img { width:100%; height:100%; object-fit:cover; display:block; }
@media (max-width:860px){
  .who-grid { grid-template-columns:1fr; }
  .portrait-frame { margin:0 auto; }
}

/* ============================================================================
   CO-59 · the three-rung ladder + the micro-states carried over from the
   archived warmth exploration (2026-07-25).

   `.rung-label` is the only new component: the one-line "Free, on this page." /
   "Free, by email." / "For members." qualifier under each rung kicker. Mono,
   quiet, and deliberately NOT a badge — a rung's price position is a fact stated
   in passing, not a label competing with the zone badge for the page's one
   colour moment.

   MICRO-STATES (carried from the archived prioraxis-warm W4, the only visual
   work the commission keeps besides the portrait frame): calm, user-initiated
   `transition:` on hover/focus, 140–200ms ease-out. Reconciled with item 3's
   "no motion": there is no @keyframes, no `animation:`, nothing that plays on
   its own — a settle on a hover is the opposite of manufactured urgency, and
   pa_ui_scan classes it [polite], not a hit.
   ============================================================================ */
.rung-label {
  font-family:var(--font-mono); font-size:.8125rem; color:var(--ink-muted);
  margin-top:var(--s-1);
}
.rung .lead { max-width:60ch; color:var(--ink-muted); margin-top:var(--s-4); font-size:1.25rem; }
.rung h2 { margin-top:var(--s-5); }

a { transition:color 160ms ease-out; }
.card { transition:border-color 180ms ease-out; }
.card:hover { border-color:var(--link); }
.lib-item { transition:border-color 160ms ease-out, background-color 160ms ease-out; }
.lib-item:hover { border-color:var(--link); background:var(--surface-alt); }
.record-table tbody tr { transition:background-color 140ms ease-out; }
.btn-primary { transition:opacity 160ms ease-out, background-color 160ms ease-out; }
.btn-ghost { transition:border-color 160ms ease-out, color 160ms ease-out; }
.btn-ghost:hover { border-color:var(--link); color:var(--link); }
.capture input[type="email"] { transition:border-color 160ms ease-out; }
.capture input[type="email"]:focus { border-color:var(--link); }

/* ============================================================================
   CO-60 · The Monday Read — index/archive list, single edition (2026-07-25).
   Hairline rows, no cards: an index is a list of editions, and a grid of boxes
   would out-shout the reading itself. Existing tokens + the 4px scale only.
   ============================================================================ */
.monday-list { margin-top:var(--s-6); border-top:1px solid var(--rule); }
.monday-row { border-bottom:1px solid var(--rule); padding:var(--s-6) 0; }
.monday-row h2 { margin-top:var(--s-2); }
.monday-row h2 a { color:var(--headline); }
.monday-row h2 a:hover { color:var(--link); text-decoration:none; }
.monday-row .excerpt { margin-top:var(--s-3); max-width:68ch; color:var(--ink-muted); font-size:1.125rem; }
.monday-row .verify { display:inline-block; margin-top:var(--s-3); }

/* single edition */
.post-meta { margin-top:var(--s-3); display:flex; align-items:center; gap:var(--s-2); flex-wrap:wrap; }
.post-nav {
  display:flex; justify-content:space-between; gap:var(--s-4); flex-wrap:wrap;
  border-top:1px solid var(--rule); margin-top:var(--s-7); padding-top:var(--s-4);
}

/* pagination — WP prints .nav-links; keep it quiet and mono */
.pagination, .nav-links {
  display:flex; gap:var(--s-3); flex-wrap:wrap; align-items:center;
  font-family:var(--font-mono); font-size:.8125rem; margin-top:var(--s-6);
}
.nav-links .page-numbers { color:var(--ink-muted); padding:var(--s-1) var(--s-2); border-radius:var(--radius-s); }
.nav-links .page-numbers.current { color:var(--headline); border:1px solid var(--rule); }
.nav-links a.page-numbers:hover { color:var(--link); }

/* Rung-2 waitlist path (ruled 2026-07-25). Deliberately the quietest link on the
   section: mono at the qualifier's size, muted, no border, no button. The email
   capture above it stays the primary action — this line is a door, not a push. */
.capture-aside {
  margin-top:var(--s-3); max-width:52ch;
  font-family:var(--font-mono); font-size:.8125rem; line-height:1.5;
  color:var(--ink-muted);
}

/* Stage-A legal row (ruled 2026-07-25). The quietest line on the site by design:
   it sits below the doctrine stack so the boundary sentence keeps the last word,
   and it is chrome, not argument. Mono at the small step, muted, middot-separated;
   links take --ink-muted too and only reveal themselves on hover, so the row reads
   as one grey line rather than four blue ones. */
.footer-legal {
  margin-top:var(--s-5); padding-top:var(--s-4);
  border-top:1px solid var(--rule);
  font-family:var(--font-mono); font-size:.8125rem; line-height:1.8;
  color:var(--ink-muted);
}
.footer-legal a { color:var(--ink-muted); }
.footer-legal a:hover { color:var(--link); }

/* ---------------------------------------------------------------------------
   Pricing page — two blocks, hairline-separated (#16 ruling 2026-07-26).
   Plain lines only: no icons, no comparison matrix, no badges, no "most
   popular". Tokens and the 4px scale, nothing else. The separation between
   tiers is a hairline and vertical space — the same devices the rest of the
   site uses to separate sections, so pricing does not get a visual language
   of its own.
--------------------------------------------------------------------------- */
.tier-block { padding: 48px 0; }
.tier-block h2 { margin: 0 0 24px; }

.tier-lines { list-style: none; margin: 0 0 32px; padding: 0; }
.tier-lines li { padding: 8px 0; border-bottom: 1px solid var(--hairline); }
.tier-lines li:last-child { border-bottom: 0; }

.price-block { margin: 0 0 32px; }
.price-line { margin: 0 0 12px; }
.price-figure { font-family: var(--font-mono); }
.price-founding { margin: 0 0 12px; }
.price-refund { margin: 0; color: var(--ink-muted); }

/* Pricing — EEA availability sentence, directly under the price block (#7-17 item 2).
   Muted like .price-refund and spaced like .price-block's own trailing margin: it is a
   condition of sale, not a selling line, and must not compete with the figures above it. */
.tier-note { margin: 0 0 32px; color: var(--ink-muted); }

.tier-cta { margin: 0; }

/* Pricing — closing line below both blocks (operator verbatim, 2026-07-26). */
.tier-close { padding: 48px 0; }
.tier-close .lead { margin: 0; }