/* ==========================================================================
   Post-Acute Signals — Field Brief design system (v3.2; v3.5 polish pass)
   Grown from the newsletter itself: a briefing, ranked, calm.
   Pearl paper, ink text, hairline rules instead of boxes, gold used like a
   highlighter (key figures, the Board's harm column, the chosen door's rule,
   active states, the reading-progress bar, live tiles on the map).
   One soft shadow in the whole system: the home edition panel.
   Field Mode is the one dark exception, unchanged.

   Layers: 1 tokens · 2 base · 3 layout (margin rail, folio) · 4 chrome ·
           5 components · 6 forms · 7 edition · 8 board · 9 home ·
           10 doors + pricing · 11 app · 12 field mode · 13 motion · 14 print
   ========================================================================== */

/* ---------- 0. Typefaces (v3.5): self-hosted, SIL OFL 1.1 (assets/fonts/OFL.txt), Latin woff2 subsets ----------
   Newsreader SemiBold for headlines, figures and pull-pieces (preloaded); Inter (variable weight) for
   body, labels, tables and UI, with tabular figures wherever numerals carry data. */
@font-face {
  font-family: "Newsreader"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("/assets/fonts/newsreader-latin-600.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: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url("/assets/fonts/inter-latin-wght.woff2") format("woff2-variations"), url("/assets/fonts/inter-latin-wght.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;
}

/* ---------- 1. Tokens ---------- */
:root {
  /* paper */
  --pearl-0: #fbf9f4;           /* one pearl step up: cards, inputs, the edition sheet */
  --field-alt: #fbf9f4;         /* v3.3 amendment: the card tone as a full-width section field (home only) */
  --pearl: #f5f2ea;             /* page ground */
  --pearl-2: #eeeae0;
  --pearl-3: #e4dfd2;
  /* ink */
  --ink: #25282b;               /* headings, key text — 14.2:1 on pearl */
  --ink-2: #44484d;             /* body — 9.0:1 */
  --ink-3: #5f646a;             /* secondary — 5.6:1 */
  --ink-k: #636564;             /* kickers: ink at ~70% (60% measures 3.9:1, under AA) — 5.2:1 */
  --ink-20: #cbcac4;            /* rank numerals, set behind the row */
  --hair: rgba(37, 40, 43, .12);
  --hair-2: rgba(37, 40, 43, .24);
  /* gold */
  --gold: #c9a227;              /* brand gold: rules, bars, washes, active states */
  --gold-fig: #9c7c0e;          /* gold deepened for display figures — 3.5:1, AA for large text */
  --gold-ink: #7a5f06;          /* gold deepened for small text — 5.4:1 */
  --gold-wash: rgba(201, 162, 39, .14);
  --gold-hi: rgba(201, 162, 39, .34);
  /* function colors (forms, change markers) */
  --red-ink: #a3261a;
  --red-wash: rgba(163, 38, 26, .07);
  --amber-ink: #8a5300;
  --amber-wash: rgba(138, 83, 0, .08);
  --green-ink: #1d6b4a;
  --green: #1d6b4a;
  --green-wash: rgba(29, 107, 74, .08);
  /* type */
  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --serif: "Newsreader", "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, "Times New Roman", serif;
  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --t-display: 2.5rem;  --lh-display: 1.05;
  --t-h1: 2rem;         --lh-h1: 1.1;
  --t-h2: 1.5rem;       --lh-h2: 1.2;
  --t-h3: 1.125rem;     --lh-h3: 1.3;
  --t-body: 1rem;       --lh-body: 1.55;
  --t-small: .875rem;   --lh-small: 1.5;
  --t-micro: .75rem;    --lh-micro: 1.4;
  /* geometry */
  --r: 12px;                    /* controls: buttons, inputs, segmented controls */
  --r-card: 12px;               /* v3.5: the ONE card radius (cards, panels, doors, forms, notices, the edition sheet) */
  --focus: var(--gold-fig);     /* v3.5: the one focus ring (gold, 3.5:1 on pearl) */
  --rail-w: 184px;
  --rail-gap: 48px;
  --sec-pad: 64px;
  --home-pad: 96px;             /* v3.3: home section padding (64 on phones) */
  --gutter: max(16px, env(safe-area-inset-left, 0px));
  --gutter-r: max(16px, env(safe-area-inset-right, 0px));
  --head-h: 64px;
  --lift: 0 1px 2px rgba(37, 40, 43, .04), 0 24px 48px -24px rgba(37, 40, 43, .24);
  --ease: cubic-bezier(.2, .7, .2, 1);
  color-scheme: light;
}
@media (max-width: 759px) { :root { --sec-pad: 48px; --home-pad: 64px; } }

/* ---------- 2. Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--head-h) + 64px); background: var(--pearl); }
body {
  margin: 0;
  background: var(--pearl);
  color: var(--ink-2);
  font: 400 var(--t-body)/var(--lh-body) var(--font);
  font-variant-numeric: normal; /* v3.5: tabular figures only where numerals carry data (tables, figures, prices, counts) */
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  counter-reset: sec;
}
img, svg { max-width: 100%; }
a { color: var(--ink); text-underline-offset: 3px; text-decoration-thickness: 1px; text-decoration-color: var(--hair-2); }
a:hover { color: var(--ink); text-decoration-color: var(--ink); }
h1, h2, h3, h4 { color: var(--ink); margin: 0 0 16px; text-wrap: balance; }
h1 { font: 600 var(--t-h1)/var(--lh-h1) var(--serif); letter-spacing: -.01em; }
h2 { font: 600 var(--t-h2)/var(--lh-h2) var(--serif); letter-spacing: -.005em; }
h3 { font: 600 var(--t-h3)/var(--lh-h3) var(--serif); }
h4 { font: 650 var(--t-body)/var(--lh-h3) var(--font); }
p { margin: 0 0 16px; }
ul, ol { padding-left: 1.2em; }
strong, b { color: var(--ink); font-weight: 650; }
code { font-family: var(--mono); font-size: .9em; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; border-radius: 4px; }
::selection { background: var(--gold-hi); color: var(--ink); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
[hidden] { display: none !important; }
.skip-link { position: absolute; left: 16px; top: -64px; z-index: 100; background: var(--ink); color: var(--pearl-0); padding: 8px 16px; border-radius: var(--r); font-weight: 700; }
.skip-link:focus { top: 16px; color: var(--pearl-0); }
.muted { color: var(--ink-3); }
.small { font-size: var(--t-small); line-height: var(--lh-small); }
.mt-0 { margin-top: 0; } .mt-1 { margin-top: 8px; } .mt-2 { margin-top: 24px; } .mt-3 { margin-top: 40px; } .mb-0 { margin-bottom: 0; }
.fig { font-variant-numeric: tabular-nums lining-nums; }

/* Kicker: micro, uppercase, tracked +.12em, ink at ~70%. No ornaments. */
.kicker {
  display: inline-flex; align-items: center; gap: 8px;
  font: 650 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-k);
}
.lede { font-size: var(--t-body); line-height: var(--lh-body); color: var(--ink-2); max-width: 64ch; }

/* ---------- 3. Layout ---------- */
.container { width: 100%; max-width: calc(1184px + 32px); margin: 0 auto; padding-left: var(--gutter); padding-right: var(--gutter-r); }
.container--read { max-width: calc(760px + 32px); }
.section { padding-block: 0 var(--sec-pad); position: relative; }
.section--tight { padding-block: 0 48px; }
.section-head { max-width: 760px; margin-bottom: 32px; }
.section-head h2:last-child, .section-head .lede { margin-bottom: 0; }
.grid { display: grid; gap: 24px; }
.grid > * { min-width: 0; }
.grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
.grid--3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 248px), 1fr)); }
.split { display: grid; gap: 40px; grid-template-columns: 1fr; align-items: start; }
.split > * { min-width: 0; }
@media (min-width: 900px) { .split { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 48px; } }
.row { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.stack > * + * { margin-top: 16px; }

/* Margin Rail: a narrow left rail carries kickers, folio notes and section numbers;
   the main column carries the work. On phones the rail collapses to a top kicker line. */
.rail { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.rail > * { min-width: 0; }
.rail__side { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; }
.rail--n { padding-top: 24px; background: linear-gradient(var(--hair), var(--hair)) no-repeat var(--gutter) 0 / calc(100% - var(--gutter) - var(--gutter-r)) 1px; }
.rail--n > .rail__side::before {
  counter-increment: sec; content: counter(sec, decimal-leading-zero);
  font: 600 var(--t-h1)/1 var(--serif); color: var(--ink); letter-spacing: -.02em; font-variant-numeric: tabular-nums lining-nums;
}
/* Folio plate: the section number set big, a short gold tick under it, then the kicker */
.rail--n > .rail__side::before { flex-basis: 100%; padding-bottom: 16px; margin-bottom: 4px; background: linear-gradient(var(--gold), var(--gold)) no-repeat 0 100% / 24px 2px; }
.rail__note { font-size: var(--t-micro); line-height: var(--lh-micro); color: var(--ink-3); margin: 0; }
@media (min-width: 960px) {
  .rail { grid-template-columns: var(--rail-w) minmax(0, 1fr); column-gap: var(--rail-gap); row-gap: 0; }
  .rail--n { padding-top: 32px; }
  .rail__side { flex-direction: column; align-items: flex-start; flex-wrap: nowrap; gap: 8px; position: sticky; top: calc(var(--head-h) + 32px); align-self: start; }
  .rail--n > .rail__side::before { flex-basis: auto; font-size: var(--t-display); line-height: 1; margin-bottom: 8px; }
}
.rail__main > :last-child { margin-bottom: 0; }
@media (max-width: 959px) { .rail:not(.rail--n) > .rail__side:empty { display: none; } }
/* blocks that open with their own ink rule drop it under a numbered section's hairline */
.rail--n > .rail__main > .bench, .rail--n > .rail__main > .spot, .section--strip .proof { border-top: 0; padding-top: 0; }
.changed-home { margin-bottom: var(--sec-pad); }
.home .changed-home { margin: 48px auto 0; }

/* Home fields (v3.3): sections alternate the pearl ground and the card tone, full width, hairlines kept.
   Home only; Field Mode keeps its single dark ground. */
.home > .section { padding-block: var(--home-pad); }
.home > .field--alt { background: var(--field-alt); }
.home > .folio.hero { padding-bottom: var(--home-pad); }
.changed-home .changed { margin: 0; border-top: 1px solid var(--ink); }
.changed-home .changed + .changed { border-top: 1px solid var(--hair); }
.app-sec { padding-top: 40px; }

/* Folio: kicker, title, a ruled line, one folio line. No hero images, no gradients. */
.folio, .page-head { padding-block: 48px; }
.folio__title { margin: 0; padding-bottom: 16px; border-bottom: 1px solid var(--ink); max-width: none; }
.folio__line { margin: 16px 0 0; max-width: 72ch; color: var(--ink-2); }
.folio .rail__side .kicker + .kicker::before { content: none; }
.folio--compact { padding-block: 32px 24px; }
.folio--compact .folio__title { padding-bottom: 8px; }
.folio--compact .folio__line { margin-top: 8px; }
@media (min-width: 960px) { .folio { padding-block: 64px 48px; } .folio--compact { padding-block: 40px 24px; } }
.folio__extra { margin-top: 16px; }
.folio__extra p { margin: 0; }

/* ---------- 4. Chrome ---------- */
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 60; background: var(--pearl); }
.site-header {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50;
  background: rgba(245, 242, 234, .94);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--ink);
}
.site-header__inner { display: flex; align-items: center; gap: 16px; min-height: var(--head-h); }
.brand { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; color: var(--ink); min-height: 44px; }
.brand:hover { color: var(--ink); }
.brand__mark { width: 32px; height: 32px; flex: none; }
.brand__text { display: flex; flex-direction: column; line-height: 1.1; }
.brand__name { font: 600 1.125rem/1.1 var(--serif); letter-spacing: -.005em; }
.brand__kicker { font-size: var(--t-micro); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); margin-top: 4px; }
.site-nav { margin-left: auto; }
.site-nav ul { display: flex; list-style: none; margin: 0; padding: 0; gap: 4px; }
.site-nav a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; color: var(--ink-2); text-decoration: none; font: 650 var(--t-micro)/1 var(--font); letter-spacing: .12em; text-transform: uppercase; }
.site-nav a:visited { color: var(--ink-2); }
.site-nav a:hover { color: var(--ink); background: rgba(37, 40, 43, .05); text-decoration: none; }
.site-nav a[aria-current="page"] { color: var(--ink); box-shadow: inset 0 -2px 0 var(--gold); }
.header-actions { display: flex; gap: 8px; align-items: center; }
@media (max-width: 759px) {
  .site-header__inner { flex-wrap: wrap; gap: 0 8px; padding-top: 8px; }
  .brand__kicker { display: none; }
  .header-actions { margin-left: auto; }
  .site-nav { order: 3; width: 100%; margin: 0 -8px; }
  .site-nav ul { justify-content: space-between; }
  .site-nav a { padding: 0 8px; }
}

/* Colophon footer */
.site-footer { border-top: 1px solid var(--ink); padding-block: 48px 40px; font-size: var(--t-small); line-height: var(--lh-small); color: var(--ink-3); }
.colophon__about { margin: 0 0 24px; max-width: 60ch; color: var(--ink-2); }
.colophon__runs { display: grid; gap: 8px; }
.colophon__run { display: flex; flex-wrap: wrap; align-items: center; gap: 0 16px; padding-block: 8px; border-top: 1px solid var(--hair); }
.site-footer .colophon__h { font: 650 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); margin: 0; min-width: 96px; }
.site-footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 0 16px; }
.site-footer li a { display: inline-flex; min-height: 32px; align-items: center; color: var(--ink-2); text-decoration: none; }
.site-footer li a:hover { color: var(--ink); text-decoration: underline; }
.footer-legal { margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--ink); font-size: var(--t-micro); line-height: var(--lh-micro); }
.footer-legal p { margin: 0; }

.breadcrumb { display: flex; flex-wrap: wrap; gap: 4px 8px; list-style: none; padding: 0; margin: 0; font-size: var(--t-micro); letter-spacing: .04em; align-items: center; color: var(--ink-3); }
.breadcrumb li + li::before { content: "/"; margin-right: 8px; color: var(--ink-3); }
.breadcrumb li { display: inline-flex; align-items: center; }
[tabindex="-1"]:focus { outline: none; }
.breadcrumb a { color: var(--ink-2); text-decoration: none; }
.breadcrumb a:hover { color: var(--ink); text-decoration: underline; }

/* ---------- 5. Components ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 0 24px; border-radius: var(--r);
  background: var(--ink); color: var(--pearl-0); border: 1px solid var(--ink);
  font: 650 var(--t-small)/1 var(--font); letter-spacing: .01em; text-decoration: none; cursor: pointer;
  transition: background .2s ease-out;
}
.btn:hover { background: #45494f; border-color: #45494f; color: var(--pearl-0); }
.btn:active { transform: translateY(1px); }
.btn[disabled], .btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.btn--ghost { background: transparent; color: var(--ink); border-color: var(--hair-2); }
.btn--ghost:hover { background: var(--gold-wash); color: var(--ink); border-color: var(--ink); }
.btn--sm { min-height: 44px; padding: 0 16px; }
.btn--xs { min-height: 44px; padding: 0 16px; font-size: var(--t-micro); }
.btn--block { width: 100%; }
.btn--danger { background: transparent; color: var(--red-ink); border-color: rgba(163, 38, 26, .45); }
.btn--danger:hover { background: var(--red-wash); color: var(--red-ink); }
.text-link { font-weight: 650; color: var(--ink); text-decoration: underline; text-decoration-color: var(--ink); text-underline-offset: 4px; }
.text-link:hover { color: var(--ink-2); }

/* Card: one pearl step up, a hairline edge, radius 16, no shadow. (.glass keeps its v3 name.) */
.glass, .card { background: var(--pearl-0); border: 1px solid var(--hair); border-radius: var(--r-card); position: relative; }
.panel, .card { padding: 24px; }
.card > :last-child, .panel > :last-child { margin-bottom: 0; }

.badge { display: inline-flex; align-items: center; gap: 8px; min-height: 24px; padding: 0 8px; border-radius: 999px;
  font: 700 var(--t-micro)/1 var(--font); letter-spacing: .12em; text-transform: uppercase; border: 1px solid currentColor; white-space: nowrap; }
.badge--live { color: var(--green-ink); }
.badge--live::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.badge--prod, .badge--wave, .badge--wait, .badge--founder { color: var(--ink-3); }
.badge--preview { color: var(--amber-ink); }

/* The harm figure (class kept as .pill): a tabular gold number and a micro label. */
.pill { display: inline-flex; align-items: baseline; gap: 4px; white-space: nowrap; font: 650 var(--t-micro)/1 var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); }
.pill b { font: 600 var(--t-h2)/1 var(--serif); letter-spacing: -.01em; color: var(--gold-fig); font-variant-numeric: tabular-nums lining-nums; }
.pill--pain1 b { background: linear-gradient(transparent 62%, var(--gold-hi) 62%); padding: 0 2px; }

/* Change marker */
.chg { display: inline-flex; align-items: center; gap: 4px; font: 700 var(--t-micro)/1.4 var(--font); letter-spacing: .1em; text-transform: uppercase; padding: 0 8px 0 4px; border-radius: 4px; border: 1px solid currentColor; white-space: nowrap; }
.chg svg { width: 10px; height: 10px; flex: none; }
.chg--new { color: var(--ink); }
.chg--worsened { color: var(--red-ink); }
.chg--improved { color: var(--green-ink); }
.chg--ownership { color: var(--ink-2); }
.chg--other { color: var(--ink-3); }

.skel { display: block; border-radius: 4px; background: rgba(37, 40, 43, .07); }
.load-error { padding: 16px; border-radius: var(--r-card); border: 1px dashed var(--hair-2); color: var(--ink-2); }

/* Readouts: figures separated by hairlines */
.readouts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 152px), 1fr)); list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--ink); }
.readout { padding: 16px 16px 16px 0; display: flex; flex-direction: column; gap: 8px; min-width: 0; border-bottom: 1px solid var(--hair); }
.readout__v { font: 600 var(--t-h1)/1 var(--serif); color: var(--gold-fig); letter-spacing: -.02em; font-variant-numeric: tabular-nums lining-nums; }
.readout__l { font-size: var(--t-small); line-height: var(--lh-small); color: var(--ink-3); }

/* FAQ */
.faq { max-width: 820px; }
.faq details { border-bottom: 1px solid var(--hair); }
.faq details:first-child { border-top: 1px solid var(--ink); }
.faq summary { cursor: pointer; list-style: none; padding: 16px 40px 16px 0; position: relative; font: 650 var(--t-h3)/var(--lh-h3) var(--font); color: var(--ink); min-height: 48px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; position: absolute; right: 8px; top: 50%; width: 8px; height: 8px; border-right: 1.5px solid var(--ink-3); border-bottom: 1.5px solid var(--ink-3); transform: translateY(-70%) rotate(45deg); }
.faq details[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.faq .answer { padding: 0 0 16px; max-width: 68ch; }

/* Status list (coverage): ruled rows, not boxes */
.status-list { list-style: none; padding: 0; margin: 0; display: grid; border-top: 1px solid var(--ink); }
.status-item { padding: 16px 0; border-bottom: 1px solid var(--hair); display: grid; gap: 4px; }
.status-item h3 { margin: 4px 0 0; }
.status-item p { margin: 0; font-size: var(--t-small); color: var(--ink-3); }
.status-item a { font-size: var(--t-small); font-weight: 650; display: inline-flex; min-height: 32px; align-items: center; }
.status-item--live { padding-left: 16px; box-shadow: inset 2px 0 0 var(--ink); }

/* Prose (about, legal) */
.prose { max-width: 70ch; }
.prose h2 { margin-top: 40px; padding-top: 16px; border-top: 1px solid var(--hair); }
.prose h2:first-child { margin-top: 0; }
.prose li { margin-bottom: 8px; }
.rules { list-style: none; padding: 0; counter-reset: r; display: grid; border-top: 1px solid var(--hair); }
.rules li { counter-increment: r; display: grid; grid-template-columns: 48px 1fr; gap: 16px; align-items: baseline; padding: 16px 0; border-bottom: 1px solid var(--hair); margin: 0; }
.rules li::before { content: counter(r, decimal-leading-zero); font: 650 var(--t-h3)/1 var(--font); color: var(--ink); }
.rules strong { display: block; }
.timeline { list-style: none; padding: 0; border-left: 1px solid var(--hair-2); margin-left: 8px; }
.timeline li { position: relative; padding: 0 0 16px 24px; }
.timeline li::before { content: ""; position: absolute; left: -5px; top: 8px; width: 9px; height: 9px; border-radius: 50%; background: var(--pearl); border: 1px solid var(--ink-3); }
.timeline li.is-live::before { background: var(--ink); border-color: var(--ink); }
.timeline li.is-prod::before { background: var(--pearl-3); border-color: var(--ink); }
.timeline strong { display: block; }

/* ---------- 6. Forms ---------- */
.form-card { padding: 24px; }
@media (min-width: 760px) { .form-card { padding: 32px; } }
.form-grid { display: grid; gap: 16px; }
.form-grid--2 { grid-template-columns: 1fr; }
@media (min-width: 640px) { .form-grid--2 { grid-template-columns: 1fr 1fr; } .span-2 { grid-column: 1 / -1; } }
.field { display: grid; gap: 8px; min-width: 0; }
.field label, .field .label { font-size: var(--t-small); font-weight: 650; color: var(--ink); }
.opt { font-weight: 400; color: var(--ink-3); }
.input, .select, .textarea {
  width: 100%; min-height: 48px; padding: 8px 16px; border-radius: var(--r);
  background: var(--pearl-0); color: var(--ink); border: 1px solid var(--hair-2);
  font: 400 var(--t-body)/1.4 var(--font); transition: border-color .2s ease-out, box-shadow .2s ease-out;
}
.textarea { min-height: 128px; resize: vertical; }
.input::placeholder, .textarea::placeholder { color: #80848a; }
.input:focus, .select:focus, .textarea:focus { outline: none; border-color: var(--ink); }
.input:focus-visible, .select:focus-visible, .textarea:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.select { appearance: none; -webkit-appearance: none; padding-right: 40px; background-image: linear-gradient(45deg, transparent 50%, var(--ink-3) 50%), linear-gradient(135deg, var(--ink-3) 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%; background-size: 5px 5px; background-repeat: no-repeat; }
.hint { font-size: var(--t-micro); line-height: var(--lh-micro); color: var(--ink-3); }
.field-error { font-size: var(--t-small); color: var(--red-ink); font-weight: 600; }
.field-error:empty { display: none; }
.has-error .input, .has-error .select, .has-error .textarea { border-color: var(--red-ink); }
.form-foot { display: grid; gap: 8px; margin-top: 16px; }
.form-foot p { font-size: var(--t-micro); line-height: var(--lh-micro); color: var(--ink-3); margin: 0; }
.form-alert { display: none; margin: 16px 0 0; padding: 8px 16px; border-radius: var(--r-card); font-size: var(--t-small); }
.form-alert.is-visible { display: block; }
.form-alert--error { background: var(--red-wash); border: 1px solid rgba(163, 38, 26, .35); color: var(--red-ink); }
.form-alert--error a { color: var(--red-ink); }
.form-success { text-align: left; }
.form-success__icon { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--ink); display: grid; place-items: center; margin-bottom: 16px; }
.form-success__icon path { stroke: var(--ink); }
.form-success h3:focus { outline: none; }
.demo-note { margin-top: 16px; padding: 8px 16px; border-radius: var(--r-card); border: 1px dashed var(--hair-2); font-size: var(--t-small); color: var(--ink-2); }
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.inline-form { display: grid; gap: 8px; grid-template-columns: 1fr; max-width: 560px; }
@media (min-width: 560px) { .inline-form { grid-template-columns: 1fr auto; align-items: start; } .inline-form .form-alert { grid-column: 1 / -1; } }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
legend { font-size: var(--t-small); font-weight: 650; color: var(--ink); margin-bottom: 8px; padding: 0; }
.seg { display: inline-flex; border: 1px solid var(--hair-2); border-radius: var(--r); padding: 4px; gap: 4px; background: var(--pearl-0); }
.seg button { min-height: 44px; padding: 0 16px; border: 0; border-radius: 8px; background: transparent; color: var(--ink-2); font: 650 var(--t-small)/1 var(--font); cursor: pointer; }
.seg button:hover { color: var(--ink); background: rgba(37, 40, 43, .05); }
.seg button[aria-pressed="true"] { background: var(--gold-wash); color: var(--ink); box-shadow: inset 0 -2px 0 var(--gold); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--hair-2); background: transparent; color: var(--ink-2); font: 650 var(--t-micro)/1 var(--font); letter-spacing: .06em; cursor: pointer; text-decoration: none; }
.chip:hover { color: var(--ink); border-color: var(--ink); }
.chip[aria-pressed="true"], .chip.is-active { background: var(--gold-wash); border-color: var(--gold); color: var(--ink); }
.chip .n { font-variant-numeric: tabular-nums; color: var(--ink-3); font-weight: 700; }

/* ---------- 7. Edition: the briefing sheet ---------- */
.edition-shell { padding-block: 16px 64px; }
.edition {
  max-width: 1008px; margin: 0 auto; border-radius: var(--r-card);
  background: var(--pearl-0); border: 1px solid var(--hair);
  color: var(--ink-2); font-size: var(--t-body);
  container-type: inline-size; container-name: sheet;
}
.edition .kicker { color: var(--ink-k); }
/* Edition folio */
.ed-mast { padding: 32px 24px 24px; }
.ed-mast__top { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 16px; }
.ed-title { font: 600 var(--t-h1)/var(--lh-h1) var(--serif); margin: 0; padding-bottom: 16px; border-bottom: 1px solid var(--ink); }
.ed-mast__meta { display: flex; flex-wrap: wrap; gap: 4px 8px; font-size: var(--t-small); color: var(--ink-3); margin: 16px 0 0; }
.ed-mast__meta span + span::before { content: "·"; color: var(--ink-3); margin: 0 8px 0 0; }
.ed-mast__dek { margin: 8px 0 0; color: var(--ink-2); max-width: 64ch; }
.ed-notice { margin: 0 24px 16px; padding: 8px 16px; border-left: 2px solid var(--amber-ink); background: var(--amber-wash); font-size: var(--t-small); color: var(--ink); }
.field-toggle { min-height: 44px; display: inline-flex; align-items: center; gap: 8px; padding: 0 12px; border-radius: var(--r); border: 0; background: transparent; color: var(--ink-3); font: 600 var(--t-small)/1 var(--font); cursor: pointer; }
.field-toggle:hover { color: var(--ink); background: rgba(37, 40, 43, .05); }
.field-toggle[aria-pressed="true"] { color: var(--ink); background: var(--gold-wash); }
.field-toggle svg { width: 16px; height: 16px; }
/* v3.5: the issue control row (one primary group: the lens; Field Mode quiet and secondary), not sticky */
.ed-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding: 8px 24px; border-top: 1px solid var(--hair); }
.ed-controls .seg { margin-right: auto; }
.ed-controls:not(:has(.seg)) { justify-content: flex-end; }
/* v3.5: the scrollspy bar: the page's one sticky element under the header. Pearl at ~85%, a gold hairline
   that fills with reading progress, the section pills. No shadow: a hairline only, so nothing doubles up. */
.spybar { position: sticky; top: calc(env(safe-area-inset-top, 0px) + var(--head-h)); z-index: 40; background: rgba(251, 249, 244, .85); border-block: 1px solid var(--hair); }
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) { .spybar { -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); } }
.spybar.is-stuck { border-top-color: transparent; }
.spybar__pills { display: flex; gap: 4px; overflow-x: auto; padding: 4px 24px; scrollbar-width: none; scroll-behavior: smooth; }
.spybar__pills::-webkit-scrollbar { display: none; }
.spybar__pills .chip { flex: none; border-color: transparent; min-height: 44px; }
.spybar__pills .chip:hover { border-color: var(--hair-2); }
.spybar__pills .chip.is-active { color: var(--ink); background: var(--gold-wash); border-color: var(--gold); }
.spybar__fill { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--gold); transform-origin: 0 50%; transform: scaleX(0); pointer-events: none; }
html { scroll-padding-top: var(--spy-offset, calc(var(--head-h) + 64px)); }

.ed-rollup { margin: 0; padding: 16px 24px; border-bottom: 1px solid var(--hair); display: flex; align-items: baseline; gap: 16px; font-size: var(--t-small); color: var(--ink); flex-wrap: wrap; }
.ed-rollup b { font-size: var(--t-micro); letter-spacing: .12em; text-transform: uppercase; color: var(--ink); }
.ed-body { display: flex; flex-direction: column; }
/* This week in numbers: figures separated by hairlines; the key figure carries the gold. */
.ed-stats { list-style: none; margin: 0; padding: 0 24px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ed-stats li { padding: 16px 16px 16px 0; display: grid; gap: 8px; align-content: start; border-bottom: 1px solid var(--hair); }
.ed-stats li:nth-child(odd) { border-right: 1px solid var(--hair); }
.ed-stats li:nth-child(even) { padding-left: 16px; }
.ed-stats b { font: 600 var(--t-h1)/1 var(--serif); letter-spacing: -.02em; color: var(--gold-fig); font-variant-numeric: tabular-nums lining-nums; }
.ed-stats span { font-size: var(--t-small); line-height: var(--lh-small); color: var(--ink-3); text-wrap: balance; }
@container sheet (min-width: 640px) {
  .ed-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ed-stats li, .ed-stats li:nth-child(even) { padding: 24px 16px; border-right: 1px solid var(--hair); }
  .ed-stats li:first-child { padding-left: 0; }
  .ed-stats li:last-child { border-right: 0; }
}
.changed { margin: 0 24px; padding: 16px 0; border-bottom: 1px solid var(--hair); display: grid; gap: 8px; }
.changed__h { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); }
.changed ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px 16px; }
.changed li { display: inline-flex; align-items: center; gap: 8px; font-size: var(--t-small); color: var(--ink); }

/* Sections carry their own margin rail inside the sheet */
.ed-sec { padding: 32px 24px; border-bottom: 1px solid var(--hair); }
.ed-sec__head { margin-bottom: 24px; }
.ed-sec__head .kicker { margin-bottom: 8px; }
.ed-sec-title { font: 600 var(--t-h2)/var(--lh-h2) var(--serif); margin: 0 0 8px; }
.ed-sec__head p { margin: 0; color: var(--ink-3); font-size: var(--t-small); line-height: var(--lh-small); max-width: 64ch; }
@container sheet (min-width: 760px) {
  .ed-mast { padding: 40px 40px 32px; }
  .ed-notice { margin-inline: 40px; }
  .ed-controls, .spybar__pills { padding-inline: 40px; }
  .ed-rollup, .ed-stats { padding-inline: 40px; }
  .changed { margin-inline: 40px; }
  .ed-sec { padding: 40px; display: grid; grid-template-columns: 152px minmax(0, 1fr); column-gap: 40px; }
  .ed-sec > * { grid-column: 2; }
  .ed-sec__head { display: contents; }
  .ed-sec__head .kicker { grid-column: 1; grid-row: 1 / span 2; align-self: start; margin: 4px 0 0; }
  .ed-sec__head .ed-sec-title { grid-column: 2; }
  .ed-sec__head p { grid-column: 2; margin-bottom: 24px; }
  .ed-sec__head .ed-sec-title:last-child { margin-bottom: 24px; }
}
/* Brief Items: number 01–, headline, one body line, why-it-matters as a margin note */
.brief { list-style: none; padding: 0; margin: 0; counter-reset: b; display: grid; border-top: 1px solid var(--ink); }
.brief > li { counter-increment: b; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--hair); }
.brief > li::before { content: counter(b, decimal-leading-zero); font: 650 var(--t-h3)/var(--lh-h3) var(--font); color: var(--ink); font-variant-numeric: tabular-nums; }
.ed-item-title { font: 600 var(--t-h3)/var(--lh-h3) var(--serif); margin: 0 0 4px; }
.brief p { margin: 0 0 8px; }
.brief p:last-child { margin-bottom: 0; }
.why { font-size: var(--t-small); line-height: var(--lh-small); padding-left: 16px; border-left: 1px solid var(--hair-2); color: var(--ink-2); }
.why b { display: block; font-size: var(--t-micro); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); }

.ed-callout { margin: 16px 0 0; font-size: var(--t-small); color: var(--ink-2); }

/* Staffing watch */
.bars { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; position: relative; }
.bar__top { display: flex; justify-content: space-between; gap: 16px; font-size: var(--t-small); }
.bar__name { color: var(--ink); font-weight: 650; min-width: 0; }
.bar__name small { display: block; font-weight: 400; color: var(--ink-3); font-size: var(--t-small); }
.bar__val { color: var(--ink); white-space: nowrap; font-variant-numeric: tabular-nums; font-weight: 650; }
.bar__track { position: relative; height: 8px; margin-top: 8px; border-bottom: 1px solid var(--hair); }
.bar__fill { position: absolute; left: 0; bottom: -1px; height: 3px; background: var(--ink-2); transition: opacity .2s ease-out; }
.bar__fill::after { content: ""; position: absolute; right: -3px; top: -2.5px; width: 8px; height: 8px; border-radius: 50%; background: var(--ink-2); }
.bar__ref { position: absolute; top: -4px; bottom: -8px; width: 0; border-left: 1.5px dashed var(--ink); }
.bars-legend { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 16px 0 0; font-size: var(--t-micro); color: var(--ink-3); }
.bars-legend i { display: inline-block; width: 16px; height: 3px; background: var(--ink-2); vertical-align: middle; margin-right: 8px; }
.bars-legend i.ref { height: 12px; width: 0; border-left: 1.5px dashed var(--ink); background: none; }
/* Market movers: ruled items, not boxes */
.movers { display: grid; gap: 0 32px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 232px), 1fr)); border-top: 1px solid var(--ink); }
.mover { padding: 16px 0; border-bottom: 1px solid var(--hair); min-width: 0; }
.mover p { font-size: var(--t-small); line-height: var(--lh-small); margin: 0; }
.mover .kicker { margin-bottom: 8px; }
.mini-bars { list-style: none; padding: 0; margin: 16px 0 0; display: grid; gap: 8px; }
.mini-bars li { display: grid; grid-template-columns: minmax(0, 96px) 1fr auto; gap: 8px; align-items: center; font-size: var(--t-micro); }
.mini-bars .lbl { color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mini-bars .trk { height: 8px; border-bottom: 1px solid var(--hair); position: relative; }
.mini-bars .fil { position: absolute; left: 0; bottom: -1px; height: 3px; background: var(--ink-3); transition: opacity .2s ease-out; }
.mini-bars .v { color: var(--ink); font-variant-numeric: tabular-nums; }
/* Verification Mark: one line, set like a colophon. Small, ruled, unadorned. */
.ed-verify { margin: 32px 24px 0; padding: 16px 0; border-block: 1px solid var(--ink); text-align: center; }
.ed-verify h2, .ed-verify h3 { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); margin: 0 0 4px; }
.ed-verify p { margin: 0; font-size: var(--t-small); line-height: var(--lh-small); color: var(--ink); }
@container sheet (min-width: 760px) { .ed-verify { margin: 40px 40px 0; } }
.ed-foot { padding: 16px 24px 24px; font-size: var(--t-micro); line-height: var(--lh-micro); color: var(--ink-3); text-align: center; }
.edition-after { max-width: 1008px; margin: 48px auto 0; }

/* Library: a ruled dossier list */
.dlist { list-style: none; padding: 0; margin: 0; display: grid; border-top: 1px solid var(--ink); }
.ed-card, .dl-row { display: grid; gap: 8px; padding: 24px 0; min-width: 0; border-bottom: 1px solid var(--hair); }
.ed-card h3, .dl-row h3 { margin: 0; }
.ed-card .meta { font-size: var(--t-small); color: var(--ink-3); margin: 0; }
.ed-card .tags { display: flex; flex-wrap: wrap; gap: 8px; }
.dl-row p { margin: 0; }
@media (min-width: 760px) {
  .ed-card, .dl-row { grid-template-columns: minmax(0, 1fr) auto; column-gap: 32px; }
  .ed-card > *, .dl-row > * { grid-column: 1; }
  .ed-card > .btn, .dl-row > .btn { grid-column: 2; grid-row: 1 / span 6; align-self: center; }
}
.ed-card--locked h3 { color: var(--ink-2); }
.tag { font: 700 var(--t-micro)/1.4 var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); border: 1px solid var(--hair-2); border-radius: 4px; padding: 0 8px; }
.library-filters { display: grid; gap: 16px; margin-bottom: 24px; }
.library-filters .label { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); margin-bottom: 8px; display: block; }
.empty { padding: 24px 0; border-block: 1px solid var(--hair); text-align: left; color: var(--ink-2); }
.empty h3 { margin-bottom: 8px; }
.empty p:last-child { margin-bottom: 0; }

/* Lookup */
.lookup { padding: 0; background: none; border: 0; border-radius: 0; }
.lookup__box { display: grid; grid-template-columns: 1fr; gap: 8px; }
@media (min-width: 640px) { .lookup__box { grid-template-columns: 1fr auto; } }
.lookup__results { list-style: none; padding: 0; margin: 24px 0 0; display: grid; border-top: 1px solid var(--ink); }
.lookup__item { padding: 16px 0; border-bottom: 1px solid var(--hair); display: grid; gap: 8px; }
.lookup__item h3 { margin: 0; }
.lookup__item .sig { font-size: var(--t-small); color: var(--ink-2); }
.lookup__item .eds { display: flex; flex-wrap: wrap; gap: 8px; }
.lookup__note { font-size: var(--t-micro); color: var(--ink-3); margin: 16px 0 0; }
mark { background: var(--gold-hi); color: inherit; border-radius: 2px; padding: 0 2px; }

/* Tile Map: outlined tiles; live in gold wash, in production hatched */
.coverage { display: grid; gap: 32px; grid-template-columns: 1fr; align-items: start; }
@media (min-width: 1100px) { .coverage { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); } }
.map-panel { padding: 24px; }
.tile-map { width: 100%; height: auto; display: block; }
.tile-map .t rect { fill: none; stroke: var(--hair-2); stroke-width: 1; }
.tile-map .t text { fill: var(--ink-3); font: 600 12px var(--font); text-anchor: middle; dominant-baseline: central; letter-spacing: .04em; }
.tile-map .t.r-wave rect { fill: var(--pearl-2); stroke: var(--ink-3); }
.tile-map .t.s-prod rect { fill: url(#tm-hatch); stroke: var(--ink); }
.tile-map .t.s-prod text { fill: var(--ink); font-weight: 700; }
.tile-map .t.s-live rect { fill: var(--gold-hi); stroke: var(--gold-fig); stroke-width: 1.5; }
.tile-map .t.s-live text { fill: var(--ink); font-weight: 800; }
.tile-map .hatch-line { stroke: var(--ink-3); stroke-width: 1; }
.tile-map .rl { fill: var(--ink-k); font: 700 10.5px var(--font); letter-spacing: 2px; }
.map-legend { list-style: none; padding: 0; margin: 16px 0 0; display: flex; flex-wrap: wrap; gap: 8px 24px; font-size: var(--t-micro); color: var(--ink-3); }
.map-legend li { display: inline-flex; align-items: center; gap: 8px; }
.sw { width: 16px; height: 16px; border-radius: 4px; border: 1px solid var(--hair-2); background: transparent; }
.sw--live { background: var(--gold-hi); border-color: var(--gold-fig); }
.sw--prod { background: repeating-linear-gradient(135deg, var(--ink-3) 0 1px, transparent 1px 4px); border-color: var(--ink); }
.sw--wave { background: var(--pearl-2); border-color: var(--ink-3); }

/* Ruled call to action (no box) */
.cta-panel, .cta-panel.glass { padding: 32px 0 0; display: grid; gap: 16px; background: none; border: 0; border-top: 1px solid var(--ink); border-radius: 0; }
.cta-panel h2 { margin: 0; }
.cta-panel p { margin: 0; max-width: 64ch; }
.notfound { padding-block: 80px; }
.notfound .big { font: 600 6rem/1 var(--serif); color: var(--ink-20); letter-spacing: -.02em; margin: 0 0 24px; font-variant-numeric: tabular-nums lining-nums; }
.notfound h1 { padding-bottom: 16px; border-bottom: 1px solid var(--ink); }

/* ---------- 8. The Board: the ranked target list ---------- */
.targets { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--ink); container-type: inline-size; container-name: board; }
.target {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; row-gap: 8px;
  grid-template-areas: "id meta" "pic pic" "act act";
  padding: 16px 0 16px 48px; border-bottom: 1px solid var(--hair); align-items: start; isolation: isolate;
}
/* Rank numeral: display size, ink 20%, set behind the row content */
.target__rank, .mini-row__n {
  position: absolute; left: 0; top: 8px; z-index: -1;
  font: 600 var(--t-display)/1 var(--serif); color: var(--ink-20); letter-spacing: -.04em; font-variant-numeric: tabular-nums lining-nums;
}
.target__id { grid-area: id; min-width: 0; }
.target__name { font-weight: 650; color: var(--ink); font-size: var(--t-body); line-height: 1.3; }
.target__city { font-size: var(--t-small); color: var(--ink-3); }
.target__meta { grid-area: meta; display: grid; justify-items: end; gap: 4px; text-align: right; }
.target__def { font-size: var(--t-micro); color: var(--ink-3); white-space: nowrap; }
.target__def b { font-size: var(--t-small); }
.target__pic { grid-area: pic; font-size: var(--t-small); line-height: var(--lh-small); margin: 0; color: var(--ink-2); }
.target__marks { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
/* Action line, set like a margin note */
.target__action { grid-area: act; margin: 0; display: grid; gap: 4px; padding-left: 16px; border-left: 1px solid var(--ink); font-size: var(--t-small); line-height: var(--lh-small); color: var(--ink); }
.target__action b { font-size: var(--t-micro); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); }
@container board (min-width: 720px) {
  .target { grid-template-columns: minmax(0, 1fr) 112px minmax(0, 256px); grid-template-areas: "id meta act" "pic meta act"; column-gap: 24px; padding-left: 56px; }
  .target:not(:has(.target__pic)) { grid-template-areas: "id meta act"; }
  .target__action { align-self: stretch; padding-left: 24px; border-left-color: var(--hair-2); }
}
@media (max-width: 519px) { .target { padding-left: 40px; } .target__rank, .mini-row__n { font-size: var(--t-h1); } }

/* ---------- 9. Home ---------- */
.hero .folio__title { font-size: var(--t-display); line-height: var(--lh-display); letter-spacing: -.015em; padding-bottom: 24px; }
.hero .lede { margin: 16px 0 0; max-width: 64ch; }
.hero__fine { font-size: var(--t-small); color: var(--ink-3); margin: 16px 0 0; }
.hero .row { margin-top: 24px; }
@media (max-width: 519px) { .hero .folio__title { font-size: var(--t-h1); line-height: var(--lh-h1); } }

/* Rail folio for the live edition */
.rail__issue { font: 600 var(--t-h2)/var(--lh-h2) var(--serif); color: var(--ink); }
.rail__date { font-size: var(--t-small); color: var(--ink-3); }
.rail__badges { display: flex; flex-wrap: wrap; gap: 8px; }

/* The live edition panel: the single soft shadow in the system */
.live { background: var(--pearl-0); border: 1px solid var(--hair); border-radius: var(--r-card); box-shadow: var(--lift); overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1100px) { .live { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .live__sec--r { border-left: 1px solid var(--hair); } .live__sec--row2 { border-top: 1px solid var(--hair); } }
.live__head { grid-column: 1 / -1; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px 16px; padding: 16px 24px; border-bottom: 1px solid var(--ink); }
.live__pub { font: 600 var(--t-h3)/var(--lh-h3) var(--serif); color: var(--ink); }
.live__pub small { font: 400 var(--t-small)/1 var(--font); color: var(--ink-3); margin-left: 8px; }
.live__sec { padding: 24px; border-bottom: 1px solid var(--hair); min-width: 0; }
@media (min-width: 1100px) { .live__sec { border-bottom: 0; } }
.live__h { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); margin: 0 0 8px; }
.live__h span:last-child { letter-spacing: .04em; text-transform: none; font-weight: 400; color: var(--ink-3); }
.live__brief { list-style: none; margin: 0; padding: 0; counter-reset: b; display: grid; border-top: 1px solid var(--ink); }
.live__brief li { counter-increment: b; display: grid; grid-template-columns: 32px 1fr; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--hair); font-size: var(--t-small); line-height: var(--lh-small); color: var(--ink); }
.live__brief li::before { content: counter(b, decimal-leading-zero); font-weight: 650; color: var(--ink); font-variant-numeric: tabular-nums; }
.mini-board { border-top: 1px solid var(--ink); }
.mini-row { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 16px 0 16px 48px; border-bottom: 1px solid var(--hair); min-height: 64px; }
.mini-row__n { top: 12px; }
.mini-row__name { color: var(--ink); font-weight: 650; font-size: var(--t-small); min-width: 0; }
.mini-row__city { display: block; font-weight: 400; color: var(--ink-3); font-size: var(--t-micro); }
.live__item { display: grid; gap: 4px; min-width: 0; }
.live__hl { color: var(--ink); font-weight: 650; }
.live__body { margin: 0; color: var(--ink-2); }
.live__body b { font-size: var(--t-micro); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); margin-right: 4px; }
.live__note { font-size: var(--t-micro); color: var(--ink-3); margin: 8px 0 0; }
.hprd { font: 600 var(--t-h3)/1 var(--serif); color: var(--gold-fig); font-variant-numeric: tabular-nums lining-nums; }
.staff-list { border-top: 1px solid var(--ink); }
.staff-list .hit:first-child { border-top: 0; }
.live .mover-list li { display: grid; gap: 4px; justify-items: start; }
.live .mover-list li > span:not(.tag):not(.lock-note) { color: var(--ink-2); }
/* Sample depth: what a locked block shows, and its two exits */
.lock-note { display: inline-flex; align-items: center; gap: 8px; font-size: var(--t-micro); line-height: var(--lh-micro); color: var(--ink-3); }
.lock-note svg { flex: none; }
.target--locked .target__city, .mini-row--locked .mini-row__city { color: var(--ink-2); font-size: var(--t-small); }
.target--locked .lock-note, .mini-row--locked .lock-note { margin-top: 4px; }
.mini-row--locked .mini-row__name { font-weight: 400; display: grid; }
.panel-body .exits { margin-top: 16px; }
.exits { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 16px 0 0; font-size: var(--t-small); }
.live__foot { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 8px 16px; align-items: center; padding: 16px 24px; border-top: 1px solid var(--hair); font-size: var(--t-micro); color: var(--ink-3); flex-wrap: wrap; }

/* Strip: exactly three display-size gold figures, separated by hairlines */
.proof { display: grid; grid-template-columns: 1fr; border-block: 1px solid var(--ink); }
@media (min-width: 720px) { .proof { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.proof__item { padding: 24px 0; display: grid; gap: 8px; align-content: start; border-bottom: 1px solid var(--hair); }
.proof__item:last-child { border-bottom: 0; }
@media (min-width: 720px) { .proof__item { padding: 24px; border-bottom: 0; border-left: 1px solid var(--hair); } .proof__item:first-child { border-left: 0; padding-left: 0; } }
.proof__v { font: 600 var(--t-display)/var(--lh-display) var(--serif); color: var(--gold-fig); letter-spacing: -.02em; font-variant-numeric: tabular-nums lining-nums; }
.proof__l { font-size: var(--t-small); line-height: var(--lh-small); color: var(--ink); max-width: 32ch; text-wrap: balance; }
.proof__src { font-size: var(--t-micro); line-height: var(--lh-micro); color: var(--ink-3); margin: 16px 0 0; }

/* One feed, two views */
.lens-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 16px; margin-bottom: 24px; }
.lens-head .section-head { margin-bottom: 0; }
.lens-pane { min-width: 0; }
.lens-note { font-size: var(--t-small); color: var(--ink-3); margin: 16px 0 0; }
.card-h { display: flex; justify-content: space-between; align-items: baseline; gap: 8px 16px; flex-wrap: wrap; margin-bottom: 16px; }
.card-h h2, .card-h h3 { margin: 0; font: 600 var(--t-h3)/var(--lh-h3) var(--serif); }
.card-h .kicker { font-size: var(--t-micro); }
.rollup { display: grid; gap: 32px; grid-template-columns: 1fr; }
@media (min-width: 900px) { .rollup { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); } }
.rollup > * { min-width: 0; }
.agg { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--ink); }
.agg li { padding: 16px 16px 16px 0; display: grid; gap: 4px; align-content: start; border-bottom: 1px solid var(--hair); }
.agg li:nth-child(even) { padding-left: 16px; border-left: 1px solid var(--hair); }
.agg b { font: 600 var(--t-h2)/1.1 var(--serif); letter-spacing: -.01em; color: var(--gold-fig); font-variant-numeric: tabular-nums lining-nums; }
.agg span { font-size: var(--t-micro); color: var(--ink-3); line-height: var(--lh-micro); }
.agg b.agg__name { font: 650 var(--t-body)/1.3 var(--font); letter-spacing: 0; color: var(--ink); }
.top5 { list-style: none; padding: 0; margin: 0; counter-reset: t; border-top: 1px solid var(--ink); }
.top5 li { counter-increment: t; position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 16px 0 16px 48px; border-bottom: 1px solid var(--hair); font-size: var(--t-small); min-height: 64px; }
.top5 li::before { content: counter(t); position: absolute; left: 0; top: 12px; z-index: -1; font: 600 var(--t-display)/1 var(--serif); color: var(--ink-20); letter-spacing: -.04em; }
.top5 li span { color: var(--ink); font-weight: 650; }
.top5 li span small { display: block; color: var(--ink-3); font-size: var(--t-micro); font-weight: 400; }
.mover-list { list-style: none; padding: 0; margin: 0; display: grid; border-top: 1px solid var(--ink); }
.mover-list li { padding: 8px 0; border-bottom: 1px solid var(--hair); font-size: var(--t-small); }
.mover-list b { display: block; }
.board-card { padding: 24px; }
@media (min-width: 760px) { .board-card { padding: 32px; } }

/* Brief Items for features ("What lands every week"), how it works, the benchmark */
.bitems { list-style: none; padding: 0; margin: 0; counter-reset: bi; border-top: 1px solid var(--ink); }
.bitem { counter-increment: bi; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 16px 16px; padding: 32px 0; border-bottom: 1px solid var(--hair); }
.bitem::before { content: counter(bi, decimal-leading-zero); grid-row: 1 / span 2; font: 600 var(--t-h2)/1 var(--serif); color: var(--ink); font-variant-numeric: tabular-nums lining-nums; }
.bitem > * { grid-column: 2; min-width: 0; }
.bitems--ex .bitem { padding-block: 48px; } /* v3.3: a full empty row between feature panels; no two panels touch */
.bitem h3 { margin: 0 0 8px; }
.bitem p { margin: 0; }
.bitem__copy > :last-child { margin-bottom: 0; }
@media (min-width: 1100px) {
  .bitems--ex .bitem { grid-template-columns: 56px minmax(0, .9fr) minmax(0, 1.1fr); column-gap: 32px; align-items: start; }
  .bitems--ex .bitem::before { grid-row: 1; }
  .bitems--ex .bitem > .bitem__copy { grid-column: 2; }
  .bitems--ex .bitem > .feature__panel { grid-column: 3; grid-row: 1; }
}
.ticks { list-style: none; padding: 0; margin: 0 0 24px; display: grid; gap: 8px; font-size: var(--t-small); line-height: var(--lh-small); }
.ticks li { display: grid; grid-template-columns: 16px 1fr; gap: 8px; }
.ticks li::before { content: ""; width: 8px; height: 1px; background: var(--ink); margin-top: .75em; }
.feature__panel { padding: 0; overflow: hidden; }
.feature__panel .targets { border-top: 0; }
.feature__panel .target { padding-right: 24px; padding-left: 64px; }
.feature__panel .target__rank { left: 16px; }
.panel-bar { display: flex; justify-content: space-between; align-items: baseline; gap: 8px 16px; padding: 16px 24px; border-bottom: 1px solid var(--ink); font-size: var(--t-micro); color: var(--ink-3); flex-wrap: wrap; }
.panel-bar b { color: var(--ink); font-weight: 650; font-size: var(--t-small); }
.panel-body { padding: 16px 24px; }
.panel-note { font-size: var(--t-micro); line-height: var(--lh-micro); color: var(--ink-3); padding: 16px 24px; border-top: 1px solid var(--hair); margin: 0; }
.wl-row { display: grid; gap: 8px; margin-bottom: 16px; }
.wl-row .lbl { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); }
.wl-chip { display: inline-flex; align-items: center; min-height: 32px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--hair-2); color: var(--ink); font-size: var(--t-small); font-weight: 600; }
.hit { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; align-items: center; padding: 8px 0; border-top: 1px solid var(--hair); font-size: var(--t-small); }
.hit small { display: block; color: var(--ink-3); font-size: var(--t-micro); }
.feature__panel .panel-body .agg { border-top: 0; }

/* How it works: a three-step numbered brief */
.steps { list-style: none; padding: 0; margin: 0; counter-reset: s; display: grid; border-top: 1px solid var(--ink); }
.steps li { counter-increment: s; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 4px 16px; padding: 24px 0; border-bottom: 1px solid var(--hair); }
.steps li::before { content: counter(s, decimal-leading-zero); grid-row: 1 / span 2; font: 600 var(--t-h2)/1 var(--serif); color: var(--ink); font-variant-numeric: tabular-nums lining-nums; }
.steps h3 { margin: 0; grid-column: 2; }
.steps p { margin: 0; grid-column: 2; }

/* Comparison: a dossier annex */
.vs-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-top: 1px solid var(--ink); }
.vs { border-collapse: collapse; width: 100%; min-width: 560px; font-size: var(--t-small); line-height: var(--lh-small); }
.vs th, .vs td { padding: 16px 16px 16px 0; border-bottom: 1px solid var(--hair); text-align: left; vertical-align: top; }
.vs thead th { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); }
.vs thead th.us { color: var(--ink); }
.vs tbody th { font-weight: 650; color: var(--ink); width: 24%; }
.vs td { width: 38%; }
.vs td.us { color: var(--ink); font-weight: 600; }
.vs td.them { color: var(--ink-3); }

/* Benchmark: a ruled Brief Item */
.bench { display: grid; gap: 24px; grid-template-columns: 1fr; align-items: center; padding: 24px 0; border-block: 1px solid var(--ink); }
@media (min-width: 860px) { .bench { grid-template-columns: minmax(0, 1fr) auto; } }
.bench h2 { margin-bottom: 8px; }
.bench p { margin: 0; max-width: 64ch; }

/* Signal Spotlight: a single Brief Item */
/* Signal Spotlight as a pull-piece: oversize serif harm figure, the facility as headline, ruled top and bottom */
.pull { display: grid; gap: 16px 40px; padding-block: 32px; border-block: 1px solid var(--ink); background: var(--field-alt); }
@media (min-width: 760px) { .pull { grid-template-columns: auto minmax(0, 1fr); align-items: start; } }
.pull__fig { margin: 0; display: grid; gap: 8px; justify-items: start; }
.pull__fig b { font: 600 clamp(5rem, 16vw, 8.5rem)/.82 var(--serif); color: var(--gold-fig); letter-spacing: -.05em; font-variant-numeric: lining-nums; }
.pull__fig span, .pull__kicker { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); margin: 0; }
.pull__body { display: grid; gap: 8px; align-content: start; max-width: 64ch; min-width: 0; }
.pull__head { font: 600 var(--t-h1)/var(--lh-h1) var(--serif); margin: 0; }
.pull__meta { margin: 0; color: var(--ink-3); font-size: var(--t-small); }
.pull .target__action { margin-top: 8px; }
.pull p:last-child { margin: 8px 0 0; }
.spot { padding: 24px 0; border-block: 1px solid var(--ink); display: grid; gap: 8px; }
.spot h3 { font: 600 var(--t-h2)/var(--lh-h2) var(--serif); margin: 0; }
.spot p { margin: 0; }
.spot__meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

/* ---------- 10. Doors + pricing ---------- */
/* Doors: two dossier cards, identical geometry; the chosen one carries the gold rule */
.doors { display: grid; gap: 24px; grid-template-columns: 1fr; }
@media (min-width: 760px) { .doors { grid-template-columns: 1fr 1fr; } }
.door { display: flex; flex-direction: column; gap: 16px; padding: 24px; text-align: left; min-width: 0; color: var(--ink-2); font: inherit; background: var(--pearl-0); border: 1px solid var(--hair); border-radius: var(--r-card); }
@media (min-width: 760px) { .door { padding: 32px; } }
button.door { cursor: pointer; width: 100%; }
button.door:hover { border-color: var(--ink-3); }
.door[aria-pressed="true"], .door.is-chosen { border-color: var(--gold-fig); background: var(--gold-wash); box-shadow: inset 0 4px 0 var(--gold); }
.door[aria-pressed="true"] .door__sel::before { content: ""; display: inline-block; width: 10px; height: 5px; margin: 0 8px 3px 1px; border-left: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); }
.door[aria-pressed="true"] .door__sel::after { content: " · Selected"; }
.door__t { display: grid; gap: 8px; padding-bottom: 16px; border-bottom: 1px solid var(--ink); }
.door__t h3, .door__t h2 { margin: 0; font: 600 var(--t-h2)/var(--lh-h2) var(--serif); }
.door__price { font: 600 var(--t-display)/var(--lh-display) var(--serif); color: var(--ink); white-space: nowrap; letter-spacing: -.02em; font-variant-numeric: tabular-nums lining-nums; }
.door__price small { font: 400 var(--t-small)/1 var(--font); color: var(--ink-3); letter-spacing: 0; }
.door__sel { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); }
.door[aria-pressed="true"] .door__sel { color: var(--ink); }
.door ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; font-size: var(--t-small); line-height: var(--lh-small); }
.door ul li { display: grid; grid-template-columns: 16px 1fr; gap: 8px; }
.door ul li::before { content: ""; width: 8px; height: 1px; background: var(--ink); margin-top: .75em; }
.door ul li.x { color: var(--ink-3); }
.door ul li.x::before { background: var(--ink-3); }
.door__tiers { display: grid; border-top: 1px solid var(--hair); }
.door__tiers a, .door__tiers span.trow { display: flex; justify-content: space-between; gap: 16px; font-size: var(--t-small); color: var(--ink); text-decoration: none; min-height: 44px; align-items: center; border-bottom: 1px solid var(--hair); }
.door__tiers a { margin-inline: -8px; padding-inline: 8px; border-radius: 4px; }
.door__tiers a:hover { background: var(--gold-wash); text-decoration: none; }
.door__tiers b { font-variant-numeric: tabular-nums; }
.door__tiers small { font-weight: 400; color: var(--ink-3); }
.door__cta { margin-top: auto; padding-top: 8px; }
.door__facts { margin-top: auto; }
.door__facts + .door__cta { margin-top: 0; }
.door__facts small { color: var(--ink-3); text-align: right; }
.door-step { margin-top: 24px; }
.picker { display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 216px), 1fr)); margin: 0 0 16px; }
.pick { display: grid; gap: 4px; padding: 16px; border-radius: var(--r-card); border: 1px solid var(--hair-2); background: var(--pearl-0); text-align: left; cursor: pointer; font: inherit; color: var(--ink-2); min-height: 48px; }
.pick:hover { border-color: var(--ink); }
.pick[aria-pressed="true"] { border-color: var(--gold); box-shadow: inset 0 -2px 0 var(--gold); background: var(--gold-wash); }
.pick b { color: var(--ink); font-size: var(--t-small); }
.pick span { font-size: var(--t-micro); color: var(--ink-3); }
.fine { font-size: var(--t-micro); line-height: var(--lh-micro); color: var(--ink-3); margin: 16px 0 0; }
.next-steps { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--hair); font-size: var(--t-small); }

/* Pricing: free vs paid, then the ladder as dossier rungs */
.freepaid { display: grid; grid-template-columns: 1fr; border-block: 1px solid var(--ink); margin-bottom: 40px; }
@media (min-width: 720px) { .freepaid { grid-template-columns: 1fr 1fr; } }
.freepaid > div { padding: 16px 0; }
.freepaid > div + div { border-top: 1px solid var(--hair); }
@media (min-width: 720px) { .freepaid > div + div { border-top: 0; border-left: 1px solid var(--hair); padding-left: 24px; } }
.freepaid__t { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); margin-bottom: 8px; }
.freepaid p { margin: 0; color: var(--ink); }
.ladder { display: grid; gap: 16px; }
.tier { display: flex; flex-direction: column; padding: 24px; min-width: 0; }
.tier__group { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); }
.tier__flag { display: inline-block; margin-top: 4px; font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink); box-shadow: inset 0 -2px 0 var(--gold); }
.tier h3 { margin: 8px 0 0; font: 600 var(--t-h2)/var(--lh-h2) var(--serif); }
.tier__price { display: flex; align-items: baseline; gap: 4px; margin: 0; }
.tier__price .amt { font: 600 var(--t-display)/var(--lh-display) var(--serif); color: var(--ink); letter-spacing: -.02em; font-variant-numeric: tabular-nums lining-nums; }
.tier__price .per { color: var(--ink-3); font-size: var(--t-small); }
.tier__terms { font-size: var(--t-micro); color: var(--ink-3); margin: 4px 0 0; }
.tier__who { font-size: var(--t-small); color: var(--ink); margin: 0 0 8px; }
.tier__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; font-size: var(--t-small); line-height: var(--lh-small); }
.tier__list li { display: grid; grid-template-columns: 16px 1fr; gap: 8px; }
.tier__list li::before { content: ""; width: 8px; height: 1px; background: var(--ink); margin-top: .75em; }
.tier__cta { margin-top: auto; }
.tier__cta-note { font-size: var(--t-micro); color: var(--ink-3); margin: 8px 0 0; }
.ladder .tier { display: grid; grid-template-columns: 1fr; gap: 16px; }
.ladder .tier__fig { padding-top: 16px; border-top: 1px solid var(--ink); }
@media (min-width: 640px) and (max-width: 1099px) {
  .ladder .tier { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "id fig" "body body" "cta cta"; column-gap: 24px; }
  .ladder .tier__id { grid-area: id; } .ladder .tier__fig { grid-area: fig; border-top: 0; padding-top: 0; text-align: right; }
  .ladder .tier__fig .tier__price { justify-content: flex-end; }
  .ladder .tier__body { grid-area: body; padding-top: 16px; border-top: 1px solid var(--ink); }
  .ladder .tier__cta { grid-area: cta; }
}
@media (min-width: 1100px) {
  .ladder .tier { grid-template-columns: 168px 168px minmax(0, 1fr) 224px; column-gap: 24px; align-items: start; padding: 24px 32px; }
  .ladder .tier__cta .btn { white-space: nowrap; padding-inline: 16px; }
  .ladder .tier__fig { border-top: 0; padding: 0 0 0 24px; border-left: 1px solid var(--hair); }
  .ladder .tier__body { padding-left: 24px; border-left: 1px solid var(--hair); }
  .ladder .tier__cta { margin-top: 0; }
}
.compare-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-top: 1px solid var(--ink); }
.compare { border-collapse: collapse; width: 100%; min-width: 864px; font-size: var(--t-small); }
.compare th, .compare td { padding: 16px 8px; border-bottom: 1px solid var(--hair); text-align: center; }
.compare thead th { font-size: var(--t-micro); line-height: var(--lh-micro); color: var(--ink); vertical-align: bottom; height: 72px; text-wrap: balance; }
.compare thead th .p { display: block; color: var(--ink-3); font-weight: 650; margin-top: 4px; }
.compare tbody th { text-align: left; font-weight: 650; color: var(--ink); position: sticky; left: 0; background: var(--pearl); min-width: 168px; }
.compare .yes { display: inline-block; width: 14px; height: 8px; border-left: 2px solid var(--ink); border-bottom: 2px solid var(--ink); transform: rotate(-45deg) translateY(-2px); }
.compare .no { color: var(--ink-3); }
.scroll-hint { font-size: var(--t-micro); color: var(--ink-3); margin-top: 8px; }
@media (min-width: 1100px) { .scroll-hint { display: none; } }
.notes { display: grid; gap: 0 32px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); margin-top: 40px; border-top: 1px solid var(--ink); }
.notes > div { padding: 24px 0; border-bottom: 1px solid var(--hair); }
.notes h3 { margin-bottom: 8px; }
.notes p { margin-bottom: 8px; }

/* ---------- 11. App (account / admin): the same folio and rail language, denser ---------- */
.app-boot { padding: 24px; }
.app-shell { display: grid; gap: 24px; }
.app-shell > .app-folio, .app-folio { padding: 0 0 16px; border: 0; border-bottom: 1px solid var(--ink); border-radius: 0; background: none; }
.app-grid { display: grid; gap: 24px; grid-template-columns: 1fr; }
@media (min-width: 980px) { .app-grid { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); } }
.app-grid > * { min-width: 0; display: grid; gap: 24px; align-content: start; }
[data-app] h1 { font: 600 var(--t-h1)/var(--lh-h1) var(--serif); }
[data-app] h2 { font: 600 var(--t-h3)/var(--lh-h3) var(--serif); }
.id-card { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: center; }
.id-card h1 { margin: 0; }
.avatar { width: 48px; height: 48px; border-radius: var(--r); display: grid; place-items: center; background: var(--pearl-0); border: 1px solid var(--ink); color: var(--ink); font: 600 1.25rem/1 var(--serif); }
.id-card .email { color: var(--ink); font-weight: 650; overflow-wrap: anywhere; }
.list-rows { list-style: none; padding: 0; margin: 0; display: grid; }
.list-rows > li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 16px; padding: 16px 0; border-bottom: 1px solid var(--hair); align-items: center; }
.list-rows > li:first-child { border-top: 1px solid var(--ink); }
.list-rows .t { color: var(--ink); font-weight: 650; overflow-wrap: anywhere; }
.list-rows .s { font-size: var(--t-small); color: var(--ink-3); }
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-top: 1px solid var(--ink); }
.dtable { border-collapse: collapse; width: 100%; font-size: var(--t-small); }
.dtable th, .dtable td { text-align: left; padding: 8px 16px 8px 0; border-bottom: 1px solid var(--hair); vertical-align: top; }
.dtable thead th { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); background: var(--pearl-0); position: sticky; top: 0; white-space: nowrap; }
.dtable tbody tr:hover { background: rgba(37, 40, 43, .03); }
.dtable td { color: var(--ink-2); }
.dtable td.wrap { min-width: 224px; max-width: 416px; overflow-wrap: anywhere; }
.dtable .mono { font-family: var(--mono); font-size: var(--t-micro); }
.dtable tr:last-child td { border-bottom: 0; }
.copybox { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: stretch; margin-top: 8px; }
.copybox input { font-family: var(--mono); font-size: var(--t-small); }
.notice { padding: 16px; border-radius: var(--r-card); border: 1px solid var(--hair-2); background: var(--pearl); font-size: var(--t-small); color: var(--ink-2); }
.notice--ok { border-color: rgba(29, 107, 74, .4); background: var(--green-wash); }
.notice--warn { border-color: rgba(138, 83, 0, .4); background: var(--amber-wash); }
.notice--err { border-color: rgba(163, 38, 26, .4); background: var(--red-wash); color: var(--red-ink); }
.notice--gold { border-color: var(--ink); }
.notice > :last-child { margin-bottom: 0; }
.confirm { margin-top: 8px; padding: 16px; border-radius: var(--r-card); border: 1px solid rgba(163, 38, 26, .4); background: var(--red-wash); display: grid; gap: 8px; color: var(--ink); }
.progress-track { position: relative; height: 32px; margin: 16px 8px 8px; }
.progress-track .rail { position: absolute; left: 0; right: 0; top: 15px; height: 2px; background: var(--hair-2); display: block; border: 0; padding: 0; }
.progress-track .fillr { position: absolute; left: 0; top: 15px; height: 2px; background: var(--ink); }
.progress-track .ms { position: absolute; top: 9px; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: var(--pearl-0); border: 1.5px solid var(--hair-2); }
.progress-track .ms.is-on { border-color: var(--ink); background: var(--ink); }
.progress-track .ms span { position: absolute; top: 20px; left: 50%; transform: translateX(-50%); font-size: var(--t-micro); color: var(--ink-3); white-space: nowrap; }
.milestones { list-style: none; padding: 0; margin: 24px 0 0; display: grid; border-top: 1px solid var(--ink); }
.milestones li { display: grid; grid-template-columns: 48px 1fr auto; gap: 8px; align-items: center; font-size: var(--t-small); padding: 8px 0; border-bottom: 1px solid var(--hair); }
.milestones .at { color: var(--ink); font-weight: 650; font-variant-numeric: tabular-nums; }
.alert-item { display: grid; gap: 4px; padding: 16px 0; border-bottom: 1px solid var(--hair); }
.alert-item:first-child { border-top: 1px solid var(--ink); }
.alert-item .top { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: var(--t-micro); color: var(--ink-3); }
.alert-item h4 { margin: 0; color: var(--ink); }
.alert-item p { margin: 0; font-size: var(--t-small); }
.chip-input { display: flex; flex-wrap: wrap; gap: 8px; padding: 8px; min-height: 48px; border-radius: var(--r); border: 1px solid var(--hair-2); background: var(--pearl-0); cursor: text; }
.chip-input:focus-within { border-color: var(--ink); outline: 2px solid var(--focus); outline-offset: 2px; }
.chip-input input { flex: 1 1 120px; min-width: 80px; border: 0; background: transparent; color: var(--ink); font: 400 var(--t-body) var(--font); padding: 4px 8px; min-height: 32px; }
.chip-input input:focus { outline: none; }
.chip-x { display: inline-flex; align-items: center; gap: 4px; padding: 0 4px 0 8px; min-height: 32px; border-radius: 999px; background: var(--pearl-2); border: 1px solid var(--hair-2); color: var(--ink); font-size: var(--t-small); }
.chip-x button { width: 28px; height: 28px; border: 0; background: transparent; color: var(--ink-3); border-radius: 50%; cursor: pointer; font-size: 1rem; line-height: 1; }
.chip-x button:hover { background: rgba(37, 40, 43, .08); color: var(--ink); }
.cap { font-size: var(--t-micro); color: var(--ink-3); font-variant-numeric: tabular-nums; }
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--hair); margin-bottom: 16px; overflow-x: auto; }
.tabs button, .tabs a { min-height: 44px; padding: 0 16px; border: 0; background: transparent; color: var(--ink-3); font: 650 var(--t-small) var(--font); cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; text-decoration: none; display: inline-flex; align-items: center; }
.tabs [aria-selected="true"], .tabs [aria-current="page"] { color: var(--ink); border-bottom-color: var(--gold); }
.admin-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 16px; padding-bottom: 16px; margin-bottom: 24px; border-bottom: 1px solid var(--ink); }
.admin-head h1 { margin: 8px 0 0; }
.admin-layout { display: grid; gap: 24px; grid-template-columns: 1fr; }
@media (min-width: 1040px) { .admin-layout { grid-template-columns: var(--rail-w) minmax(0, 1fr); column-gap: var(--rail-gap); } }
.admin-nav { display: flex; gap: 4px; overflow-x: auto; padding-bottom: 4px; }
@media (min-width: 1040px) { .admin-nav { flex-direction: column; position: sticky; top: calc(var(--head-h) + 24px); align-self: start; border-top: 1px solid var(--ink); padding-top: 8px; } }
.admin-nav a { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: 0 8px; border-radius: 8px; text-decoration: none; color: var(--ink-2); font-weight: 650; font-size: var(--t-small); white-space: nowrap; border: 1px solid transparent; }
.admin-nav a:hover { background: rgba(37, 40, 43, .05); color: var(--ink); }
.admin-nav a[aria-current="page"] { background: var(--gold-wash); color: var(--ink); box-shadow: inset 2px 0 0 var(--gold); border-radius: 0 8px 8px 0; }
.admin-nav kbd { font-family: var(--mono); font-size: var(--t-micro); color: var(--ink-3); border: 1px solid var(--hair-2); border-radius: 4px; padding: 0 4px; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 144px), 1fr)); border-top: 1px solid var(--ink); }
.kpi { padding: 16px 16px 16px 0; display: grid; gap: 4px; border-bottom: 1px solid var(--hair); }
.kpi .v { font: 650 var(--t-h1)/1 var(--font); color: var(--ink); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.kpis--traffic .v--text { font: 650 var(--t-h3)/1.3 var(--font); letter-spacing: 0; overflow-wrap: anywhere; }
/* Admin Traffic: daily bars in plain CSS, no chart library */
.tbars { margin: 8px 0 16px; }
.tbars__plot { height: 160px; display: flex; align-items: flex-end; gap: 2px; border-bottom: 1px solid var(--ink); }
.tbars--dense .tbars__plot { gap: 1px; }
.tbars__bar { flex: 1 1 0; min-width: 0; background: var(--ink-3); }
.tbars__bar.is-today { background: var(--gold); }
.tbars__axis { display: flex; justify-content: space-between; gap: 8px; margin-top: 8px; font-size: var(--t-micro); color: var(--ink-3); }
.traffic-grid { display: grid; gap: 32px; margin-top: 32px; }
.traffic-grid > * { min-width: 0; }
.traffic-grid h3 { margin-bottom: 8px; }
@media (min-width: 900px) { .traffic-grid { grid-template-columns: 1fr 1fr; } }
.traffic-grid .dtable { width: 100%; }
.traffic-grid .dtable td.wrap { min-width: 0; }
.dtable .num { text-align: right; white-space: nowrap; }
.d-block { display: block; }
.kpi .l { font-size: var(--t-micro); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); }
.ops { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.ops .item { padding: 16px 0; border-top: 1px solid var(--ink); display: grid; gap: 8px; }
.ops .item dl { margin: 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 16px; font-size: var(--t-small); }
.ops dt { color: var(--ink-3); }
.ops dd { margin: 0; color: var(--ink); overflow-wrap: anywhere; font-family: var(--mono); font-size: var(--t-micro); }
.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 8px; vertical-align: middle; }
.dot--ok { background: var(--green-ink); } .dot--warn { background: var(--amber-ink); } .dot--err { background: var(--red-ink); } .dot--idle { background: var(--ink-3); }
pre.digest { white-space: pre-wrap; overflow-wrap: anywhere; font-family: var(--mono); font-size: var(--t-micro); line-height: 1.55; color: var(--ink-2); background: var(--pearl); border: 1px solid var(--hair); border-radius: var(--r-card); padding: 16px; margin: 8px 0 0; max-height: 416px; overflow: auto; }
details.digest-item { border-bottom: 1px solid var(--hair); padding: 8px 0; }
details.digest-item summary { cursor: pointer; display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; min-height: 32px; align-items: center; color: var(--ink); font-weight: 650; }
.inline-edit { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.inline-edit .input { min-height: 40px; padding: 4px 8px; width: 152px; font-size: var(--t-small); }
.inline-edit .input--num { width: 96px; }
.signals-top { list-style: none; padding: 0; margin: 0; display: grid; border-top: 1px solid var(--ink); }
.signals-top li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--hair); font-size: var(--t-small); color: var(--ink); }
.signals-top small { display: block; color: var(--ink-3); }
.lock-line { font-size: var(--t-small); display: grid; grid-template-columns: 16px 1fr; gap: 8px; color: var(--ink-2); }
.lock-line svg { margin-top: 4px; }
.brief-list { list-style: none; padding: 0; margin: 0; counter-reset: b; border-top: 1px solid var(--ink); }
.brief-list li { counter-increment: b; display: grid; grid-template-columns: 32px 1fr; gap: 8px; padding: 16px 0; border-bottom: 1px solid var(--hair); }
.brief-list li::before { content: counter(b, decimal-leading-zero); font-weight: 650; color: var(--ink); font-variant-numeric: tabular-nums; }
.brief-list h4 { margin: 0 0 4px; }
.brief-list p { margin: 0; font-size: var(--t-small); }

/* ---------- 12. Field Mode (unchanged palette; extended to v3.2 classes) ---------- */
/* The deliberate exception: a high-contrast dark reading theme on edition and sample pages,
   larger type, gold as its accent. All key text holds 7:1 or better. */
html.field-mode, html.field-mode body { background: #131416; }
html.field-mode body::before { background: #131416; }
html.field-mode .site-header, html.field-mode .spybar { background: rgba(19, 20, 22, .9); border-color: #34373b; }
html.field-mode .spybar.is-stuck { border-top-color: transparent; }
html.field-mode .ed-controls { border-color: #3a3d42; }
html.field-mode .spybar__pills .chip { background: transparent; border-color: transparent; }
html.field-mode .spybar__pills .chip.is-active { background: rgba(240, 207, 98, .16); border-color: #f0cf62; color: #fff; }
html.field-mode .spybar__fill { background: #f0cf62; }
html.field-mode .brand, html.field-mode .site-nav a, html.field-mode .site-nav a[aria-current="page"], html.field-mode .page-head h1, html.field-mode .folio h1, html.field-mode .breadcrumb a { color: #f3f0e8; }
html.field-mode .brand__kicker, html.field-mode .breadcrumb, html.field-mode .page-head .kicker, html.field-mode .folio .kicker, html.field-mode .rail--n > .rail__side::before { color: #cfcac0; }
html.field-mode .page-head, html.field-mode .page-head .lede, html.field-mode .folio .folio__line { color: #e8e4da; border-color: #34373b; }
html.field-mode .folio__title { border-color: #5a5e63; }
html.field-mode .site-footer { background: #17191b; border-color: #34373b; color: #cfcac0; }
html.field-mode .site-footer li a, html.field-mode .site-footer .colophon__h, html.field-mode .colophon__about, html.field-mode .site-footer .brand { color: #e8e4da; }
html.field-mode .colophon__run, html.field-mode .footer-legal { border-color: #34373b; }
html.field-mode .header-actions .btn { background: #f3f0e8; color: #131416; border-color: #f3f0e8; }
html.field-mode .header-actions .btn--ghost { background: transparent; color: #f3f0e8; border-color: #5a5e63; }
html.field-mode .edition { background: #1a1c1f; color: #ece8df; border-color: #3a3d42; font-size: 1.16rem; }
html.field-mode .edition h1, html.field-mode .edition h2, html.field-mode .edition h3, html.field-mode .edition h4,
html.field-mode .edition strong, html.field-mode .edition b, html.field-mode .target__name, html.field-mode .bar__name,
html.field-mode .bar__val, html.field-mode .mini-bars .v, html.field-mode .ed-stats b, html.field-mode .brief > li::before,
html.field-mode .changed li, html.field-mode .ed-verify p, html.field-mode .target__action, html.field-mode .ed-title { color: #ffffff; }
html.field-mode .edition, html.field-mode .edition p, html.field-mode .why, html.field-mode .target__pic, html.field-mode .mover p, html.field-mode .ed-mast__dek { color: #ece8df; }
html.field-mode .edition .kicker, html.field-mode .why b, html.field-mode .ed-verify h2, html.field-mode .ed-verify h3, html.field-mode .changed__h, html.field-mode .target__action b, html.field-mode .ed-rollup b, html.field-mode .edition .ed-stats b, html.field-mode .pill b, html.field-mode .edition .fig { color: #f0cf62; }
html.field-mode .target__city, html.field-mode .target__def, html.field-mode .ed-stats span, html.field-mode .ed-sec__head p, html.field-mode .bar__name small, html.field-mode .bars-legend, html.field-mode .ed-foot, html.field-mode .mini-bars .lbl, html.field-mode .ed-callout, html.field-mode .ed-mast__meta, html.field-mode .pill { color: #d2cdc3; }
html.field-mode .target__rank { color: #3e4247; }
html.field-mode .pill--pain1 b { background: linear-gradient(transparent 62%, rgba(240, 207, 98, .28) 62%); }
html.field-mode .ed-title { border-bottom-color: #f0cf62; }
html.field-mode .edition a { color: #f0cf62; }
html.field-mode .ed-sec, html.field-mode .ed-stats li, html.field-mode .target, html.field-mode .targets, html.field-mode .changed, html.field-mode .bar__track, html.field-mode .mini-bars .trk, html.field-mode .why, html.field-mode .brief, html.field-mode .brief > li, html.field-mode .movers, html.field-mode .mover, html.field-mode .ed-rollup { border-color: #3a3d42; }
html.field-mode .ed-verify { border-color: #8a8f96; }
html.field-mode .target__action { border-left-color: #f0cf62; }
html.field-mode .bar__fill, html.field-mode .bar__fill::after, html.field-mode .bars-legend i, html.field-mode .mini-bars .fil { background: #ece8df; }
html.field-mode .bar__ref, html.field-mode .bars-legend i.ref { border-left-color: #f0cf62; }
html.field-mode .ed-notice { background: #2a2310; color: #fff; border-color: #5a4a1a; }
html.field-mode .ed-rollup { background: #24210f; color: #fff; }
html.field-mode .chg--new { color: #ffffff; } html.field-mode .chg--worsened { color: #ffa797; } html.field-mode .chg--improved { color: #8fe3bd; } html.field-mode .chg--ownership { color: #f0cf62; } html.field-mode .chg--other { color: #d2cdc3; }
html.field-mode .badge--live { color: #8fe3bd; }
html.field-mode .badge--preview { color: #ffd27a; }
html.field-mode .seg, html.field-mode .chip { background: #1f2124; border-color: #4a4e53; color: #ece8df; }
html.field-mode .field-toggle { background: transparent; color: #d2cdc3; }
html.field-mode .seg button { color: #ece8df; }
html.field-mode .seg button[aria-pressed="true"], html.field-mode .field-toggle[aria-pressed="true"] { background: rgba(240, 207, 98, .16); color: #fff; box-shadow: inset 0 0 0 1px #f0cf62; border-color: #f0cf62; }
html.field-mode .edition-after .cta-panel { border-color: #5a5e63; color: #ece8df; }
html.field-mode .edition-after h2 { color: #fff; }
html.field-mode .edition-after p { color: #ece8df; }
html.field-mode .edition-after .btn { background: #f3f0e8; color: #131416; border-color: #f3f0e8; }
html.field-mode .edition-after .btn--ghost { background: transparent; color: #f3f0e8; border-color: #5a5e63; }
html.field-mode .edition-after .kicker { color: #d2cdc3; }
html.field-mode .skel { background: rgba(255, 255, 255, .08); }
html.field-mode :focus-visible { outline-color: #f0cf62; }

/* ---------- 13. Motion: 200ms ease-out fade/rise on first view, once. No loops, parallax or carousels. ---------- */
.fx { opacity: 0; transform: translateY(8px); transition: opacity .2s ease-out, transform .2s ease-out; }
.fx.fx-in { opacity: 1; transform: none; }
.reveal-bars .bar__fill, .reveal-bars .fil { opacity: 0; }
.reveal-bars.is-in .bar__fill, .reveal-bars.is-in .fil { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .fx { opacity: 1; transform: none; }
  .reveal-bars .bar__fill, .reveal-bars .fil { opacity: 1; }
}
html.reduce-motion .fx, html.reduce-motion .reveal-bars .bar__fill, html.reduce-motion .reveal-bars .fil { opacity: 1; transform: none; transition: none; }

/* ---------- 14. Print ---------- */
@media print {
  body { background: #fff; color: #000; }
  .site-header, .site-footer, .ed-controls, .spybar, .preview-bar, .edition-after, .skip-link { display: none !important; }
  .edition, .live { box-shadow: none; background: #fff; }
  .fx { opacity: 1 !important; transform: none !important; }
  .rail__side { position: static; }
}

/* Touch: every tap target at least 44px */
@media (pointer: coarse), (max-width: 759px) {
  .chip, .btn--xs, .site-footer li a, .status-item a, .breadcrumb a, .text-link, .door__tiers a { min-height: 44px; display: inline-flex; align-items: center; }
  .door__tiers a { display: flex; }
  .chip-x button { width: 44px; height: 44px; margin: -8px -8px -8px 0; }
  .seg button { min-height: 44px; }
}
@media (max-width: 759px) {
  .spybar { top: calc(env(safe-area-inset-top, 0px) + 104px); }
  .spybar__pills { padding-inline: 16px; }
  .ed-controls { padding-inline: 16px; }
}

/* Stacked table rows on phones (members table) */
@media (max-width: 639px) {
  .dtable--stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .dtable--stack, .dtable--stack tbody, .dtable--stack tr, .dtable--stack td { display: block; width: 100%; }
  .dtable--stack tr { padding: 8px 0; border-bottom: 1px solid var(--hair); }
  .dtable--stack tr[hidden] { display: none; }
  .dtable--stack td { border: 0; padding: 4px 0; display: flex; gap: 8px; align-items: center; }
  .dtable--stack td::before { content: attr(data-label); flex: 0 0 64px; font-size: var(--t-micro); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); }
  .dtable--stack td.wrap { min-width: 0; max-width: none; }
  .table-wrap:has(.dtable--stack) { overflow: visible; }
}
[tabindex="-1"]:focus:not(:focus-visible) { outline: none; }

/* Comparison annex: stack rows on phones so nothing is cut off */
@media (max-width: 600px) {
  .vs-wrap { overflow: visible; }
  .vs { min-width: 0; }
  .vs thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .vs tr, .vs th, .vs td { display: block; width: auto; }
  .vs tbody tr { padding: 16px 0; border-bottom: 1px solid var(--hair); display: grid; gap: 8px; }
  .vs tbody tr:last-child { border-bottom: 0; }
  .vs tbody th, .vs td { padding: 0; border: 0; }
  .vs tbody th { width: auto; font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); }
  .vs td::before { content: attr(data-label); display: block; font-size: var(--t-micro); font-weight: 650; letter-spacing: .06em; color: var(--ink-3); margin-bottom: 4px; }
  .vs td.us { padding-left: 16px; box-shadow: inset 2px 0 0 var(--ink); }
  .vs td.them { padding-left: 16px; box-shadow: inset 1px 0 0 var(--hair-2); }
}

/* ==========================================================================
   15. v3.5 — generalized edition, trust strip, sign-in, seats, referrals, preview, polish
   ========================================================================== */
/* One figure system (audit #2): Newsreader, deepened gold, tabular — home Strip and edition pages alike */
.fig, .counts .fig { font: 600 var(--t-h1)/1 var(--serif); color: var(--gold-fig); letter-spacing: -.02em; font-variant-numeric: tabular-nums lining-nums; }
.ed-stats li, .proof__item { grid-template-rows: auto 1fr; }
.ed-stats b, .proof__v { display: block; }

/* Generalized depth: counts, figures, trends */
.counts { display: grid; gap: 0; border-top: 1px solid var(--ink); }
.counts__item { margin: 0; padding: 16px 0; display: grid; grid-template-columns: minmax(64px, auto) minmax(0, 1fr); gap: 16px; align-items: baseline; border-bottom: 1px solid var(--hair); }
.counts__item span { font-size: var(--t-small); line-height: var(--lh-small); color: var(--ink); text-wrap: balance; }
.counts + .lock-line { margin-top: 16px; }
.trends { list-style: none; padding: 0; margin: 0; counter-reset: tr; display: grid; gap: 0 32px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); border-top: 1px solid var(--ink); }
.trends li { counter-increment: tr; padding: 16px 0; border-bottom: 1px solid var(--hair); display: grid; gap: 4px; }
.trends__t { font: 600 var(--t-h3)/var(--lh-h3) var(--serif); color: var(--ink); }
.trends p { margin: 0; font-size: var(--t-small); line-height: var(--lh-small); color: var(--ink-2); }
.brief--gen > li { padding-block: 12px; }
.brief--gen + .lock-line, .mover-list--gen + .lock-line { margin-top: 16px; }
.mover-list--gen li { display: grid; gap: 4px; justify-items: start; }
.ed-depth { margin: 0 24px; padding: 16px 0; border-bottom: 1px solid var(--hair); display: flex; flex-wrap: wrap; gap: 8px 24px; align-items: baseline; justify-content: space-between; font-size: var(--t-small); }
.ed-depth p { margin: 0; max-width: 64ch; }
@container sheet (min-width: 760px) { .ed-depth { margin-inline: 40px; } }
html.field-mode .ed-depth, html.field-mode .counts, html.field-mode .counts__item, html.field-mode .trends, html.field-mode .trends li { border-color: #3a3d42; }
html.field-mode .counts__item span, html.field-mode .trends p, html.field-mode .ed-depth { color: #ece8df; }
html.field-mode .trends__t { color: #fff; }
/* the home panel at generalized depth: trends across the top */
.live__sec--full { grid-column: 1 / -1; border-bottom: 1px solid var(--hair); }
@media (min-width: 1100px) { .live__sec.live__sec--full { border-bottom: 1px solid var(--hair); } .live__sec--full .trends { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.live__depth { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink); }
.tag--depth { color: var(--gold-ink); border-color: var(--gold); }
html[data-depth="paid"] .edition-after { display: none; }

/* Trust strip: under both doors on home, pricing and subscribe; summarised on the privacy page */
.trust { list-style: none; padding: 0; margin: 32px 0 0; display: grid; grid-template-columns: 1fr; border-top: 1px solid var(--ink); font-size: var(--t-small); line-height: var(--lh-small); color: var(--ink-2); }
.trust li { display: grid; gap: 4px; padding: 16px 0; border-bottom: 1px solid var(--hair); }
.trust__k { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); }
@media (min-width: 900px) { .trust { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 32px; } .trust li { border-bottom: 0; padding-bottom: 0; } .trust li + li { padding-left: 32px; border-left: 1px solid var(--hair); } }
.trust-summary { margin: 0 0 40px; }
.trust-summary__h { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); margin: 0 0 8px; }
.prose .trust { margin: 0; }
.prose .trust li { margin: 0; }
@media (min-width: 900px) { .prose .trust { grid-template-columns: 1fr; } .prose .trust li { padding-bottom: 16px; border-bottom: 1px solid var(--hair); } .prose .trust li + li { padding-left: 0; border-left: 0; } }

/* Sign-in */
.signin-alt { margin: 16px 0 0; }
.signin-alt.row { gap: 8px 16px; }
.linkish { background: none; border: 0; padding: 0; min-height: 44px; font: 650 var(--t-small)/1.2 var(--font); color: var(--ink); text-decoration: underline; text-decoration-color: var(--hair-2); text-underline-offset: 4px; cursor: pointer; }
.linkish:hover { text-decoration-color: var(--ink); }
.input--code { font: 600 1.5rem/1 var(--font); letter-spacing: .4em; font-variant-numeric: tabular-nums; max-width: 14ch; }
.kv { margin: 0; display: grid; border-top: 1px solid var(--ink); }
.kv > div { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 16px; padding: 8px 0; border-bottom: 1px solid var(--hair); align-items: center; font-size: var(--t-small); }
.kv dt { color: var(--ink-3); }
.kv dd { margin: 0; color: var(--ink); display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; justify-content: space-between; overflow-wrap: anywhere; }
.kv + .hint { display: block; margin-top: 8px; }

/* Seats and referrals */
.seats { margin: 0; font-size: var(--t-small); color: var(--ink); font-variant-numeric: tabular-nums; }
form[aria-disabled="true"] { opacity: .6; }
.ref-rule { margin: 0 0 8px; padding: 8px 0 8px 16px; border-left: 2px solid var(--gold); color: var(--ink); }
.ref-figs { display: grid; gap: 4px; }
.plans-door { border-color: var(--hair-2); }

/* Founder preview */
.preview-bar { position: relative; z-index: 45; background: var(--ink); color: var(--pearl-0); font-size: var(--t-small); }
.preview-bar .container { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; min-height: 44px; }
.preview-bar b { color: var(--gold); }
.preview-bar a { color: var(--pearl-0); font-weight: 650; display: inline-flex; align-items: center; min-height: 44px; }
.preview-ctl { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: -8px 0 24px; }
.preview-ctl .label { font: 700 var(--t-micro)/var(--lh-micro) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-k); }

/* Hover states (audit #11, #12): full-row links and tier rows */
.ladder .tier { transition: border-color .2s ease-out; }
.ladder .tier:hover { border-color: var(--ink-3); }
.list-rows a.t:hover, .ed-card h3 a:hover { text-decoration-color: var(--ink); }
.status-item a:hover, .site-footer li a:hover { color: var(--ink); text-decoration: underline; text-decoration-color: var(--ink); }
.pick:hover { background: var(--pearl); }

/* Targets ≥ 44px everywhere (audit #29) */
.site-footer li a, .status-item a, .breadcrumb a, .text-link, .faq summary { min-height: 44px; }
.breadcrumb a, .text-link { display: inline-flex; align-items: center; }
.inline-edit .input { min-height: 44px; }
.chip-x button { width: 44px; height: 44px; margin: -8px -8px -8px 0; }
.exits .text-link, .live__foot .text-link { min-height: 44px; }

/* About: rules span the column, aligned with the footer's rules (audit #9) */
.prose { max-width: none; }
.prose > p, .prose > ul, .prose > ol.timeline { max-width: 70ch; }

/* Phone finish (audit #26–28) */
@media (max-width: 959px) {
  .rail--n > .rail__side { flex-wrap: nowrap; align-items: baseline; gap: 12px; }
  .rail--n > .rail__side::before { flex-basis: auto; font-size: var(--t-h2); padding: 0 0 4px; margin: 0; background-size: 100% 2px; }
}
@media (max-width: 639px) {
  .hero .row { flex-direction: column; align-items: stretch; }
  .hero .row .btn { width: 100%; }
  .cta-panel .row, .notes .row { flex-direction: column; align-items: stretch; }
  .ladder .tier__fig { border-top: 0; padding-top: 0; }
  .ladder .tier__body { padding-top: 16px; border-top: 1px solid var(--hair); }
  .freepaid > div + div { border-top: 1px solid var(--hair); }
  .door__cta .btn, .tier__cta .btn { width: 100%; }
  .trust { margin-top: 24px; }
}
@media print { .spybar, .ed-controls, .preview-bar { display: none !important; } }

/* Tabular figures where numerals carry data */
.dtable, .compare, .vs, .kpi, .cap, .door__tiers, .tier__price, .live__h, .ed-mast__meta, .target__def, .mini-row__city, .bar__val, .mini-bars, .milestones, .seats, .ref-figs, .tbars__axis, .proof__src { font-variant-numeric: tabular-nums; }