/* =========================================================================
   Cheatonville — design system
   Refactored from the locked Claude Design export (Brand System, Rev. A).
   Restraint standard: civic, institutional, sober. One accent (Ink Navy);
   no verdict colors. Proof levels are differentiated by FORM, never color.
   ========================================================================= */

/* -------------------------------------------------------------------------
   Self-hosted webfonts — OFL (see fonts/*-LICENSE.txt). Only the weights and
   styles actually used are shipped, as latin-subset woff2. font-display:swap
   paints immediately in the fallback, then swaps with no layout shift in the
   metrics-compatible fallbacks. There is no external font request at runtime.
   ------------------------------------------------------------------------- */

/* Newsreader — reading body (400), wordmark + footer brand (500),
   bold prose / § glyph (600), and italic (400: em, governing-text quotes). */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/newsreader-latin-400-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/newsreader-latin-500-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/newsreader-latin-600-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/newsreader-latin-400-italic.woff2') format('woff2');
}

/* Domine — headings (600). */
@font-face {
  font-family: 'Domine';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/domine-latin-600-normal.woff2') format('woff2');
}

/* IBM Plex Mono — the record: labels/nav (400), kicker + badges + titles
   (500), inline citations + source numbers (600). */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/ibm-plex-mono-latin-400-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/ibm-plex-mono-latin-500-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/ibm-plex-mono-latin-600-normal.woff2') format('woff2');
}

:root {
  /* Palette — see Brand System §02. Ink Navy is the only saturated value. */
  --paper:   #FAFAF8;  /* page background          */
  --card:    #FFFFFF;  /* raised surface           */
  --tint:    #F6F6F3;  /* recessed / "headlines"   */
  --ink:     #15191F;  /* body + headlines         */
  --ink-2:   #1C2026;
  --ink-3:   #23292F;  /* reading body             */
  --ink-4:   #3A424C;  /* deks, secondary prose    */
  --navy:    #1F3A5F;  /* THE accent               */
  --slate:   #5E6B7C;  /* meta / muted             */
  --mist:    #9AA6B4;  /* recede / pending         */
  --mute:    #8C96A3;  /* eyebrow labels           */
  --faint:   #B4BBC4;
  --slate-2: #7C8694;

  /* Hairlines & edges */
  --rule:    #E2E3E0;  /* standard hairline        */
  --rule-2:  #EEEEEB;  /* faint inner rule         */
  --rule-3:  #D8D9D6;  /* wordmark divider         */
  --underline: #C9D3DF; /* link underline / navy-tint border */
  --dash:    #C7CDD4;  /* dashed "headlines" border */
  --chip:    #D8DCE1;  /* small chip border        */
  --dot:     #C2C7CD;  /* byline separator dot     */

  /* Type families */
  --serif:   'Newsreader', Georgia, 'Times New Roman', serif;  /* reading body */
  --display: 'Domine', Georgia, serif;                          /* headings     */
  --mono:    'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace; /* the record */

  /* Layout */
  --container: 1180px;
  --measure: 820px;       /* hero / status / single-column blocks */
  --measure-body: 720px;  /* article reading column               */
  --header-offset: 84px;
}

/* ---- Reset / base (from the export's <helmet> base styles) -------------- */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html, body {
  margin: 0;
  padding: 0;
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body {
  color: var(--ink);
  font-family: var(--serif);
  min-height: 100vh;
}
::selection { background: var(--navy); color: var(--paper); }
a { color: inherit; }
img, svg { max-width: 100%; }
[id] { scroll-margin-top: var(--header-offset); }

/* ---- Container ----------------------------------------------------------- */
.wrap {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 40px;
}
.measure { max-width: var(--measure); }

/* Vertical rhythm between the stacked top blocks, matching the export. */
.hero          { padding-top: 54px; }
.section-status { padding-top: 28px; }
.section-block { padding-top: 28px; }
.layout        { padding-top: 48px; }

/* =========================================================================
   Masthead
   ========================================================================= */
.masthead {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(250, 250, 248, 0.92);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--rule);
}
.masthead__inner {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 14px 0;
}
.brand { display: flex; align-items: flex-end; gap: 14px; text-decoration: none; color: inherit; }
.brand__mark {
  font-weight: 500;
  font-size: 23px;
  line-height: 1;
  letter-spacing: -0.015em;
}
.paren { color: var(--mist); font-weight: 400; }
.brand__divider { border-left: 1px solid var(--rule-3); padding-left: 12px; padding-bottom: 1px; }
.brand__tag {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--slate);
  line-height: 1.5;
}
.nav { margin-left: auto; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.nav__link {
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--slate);
  text-decoration: none;
  padding-bottom: 2px;
  border-bottom: 1px solid transparent;
  transition: color 0.15s ease, border-color 0.15s ease;
}
.nav__link:hover { color: var(--navy); }
.nav__link.is-active { color: var(--navy); border-bottom-color: var(--navy); }

/* Hamburger toggle — hidden on desktop and when JS is unavailable; the
   narrow-viewport rules below reveal it only for `.js`. */
.nav-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  width: 44px;
  height: 44px;
  padding: 0;
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: 3px;
  color: var(--slate);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}
.nav-toggle:hover { color: var(--navy); border-color: var(--underline); }
.nav-toggle__bars { position: relative; display: block; width: 18px; height: 1.5px; background: currentColor; }
.nav-toggle__bars::before,
.nav-toggle__bars::after {
  content: "";
  position: absolute;
  left: 0;
  width: 18px;
  height: 1.5px;
  background: currentColor;
  transition: transform 0.15s ease;
}
.nav-toggle__bars::before { top: -5px; }
.nav-toggle__bars::after { top: 5px; }
/* Open: morph to an ✕ */
.nav-open .nav-toggle__bars { background: transparent; }
.nav-open .nav-toggle__bars::before { transform: translateY(5px) rotate(45deg); }
.nav-open .nav-toggle__bars::after { transform: translateY(-5px) rotate(-45deg); }

/* Visible keyboard focus for all interactive elements. */
a:focus-visible,
button:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; border-radius: 1px; }

/* =========================================================================
   Hero (article header)
   ========================================================================= */
.kicker-row { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; flex-wrap: wrap; }
.kicker {
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--paper);
  background: var(--navy);
  border-radius: 2px;
  padding: 4px 9px;
}
.kicker-label {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--slate);
}
.h1 {
  font-family: var(--display);
  font-weight: 600;
  font-size: 39px;
  line-height: 1.22;
  letter-spacing: -0.006em;
  margin: 0 0 22px;
}
.dek {
  font-family: var(--serif);
  font-size: 21px;
  line-height: 1.45;
  color: var(--ink-4);
  margin: 0 0 26px;
  max-width: var(--measure-body);
}
.byline {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  padding: 13px 0;
}
.byline__item { font-family: var(--mono); font-size: 11px; color: var(--slate); letter-spacing: 0.03em; }
.byline__item .hl { color: var(--ink); }
.byline__dot { width: 3px; height: 3px; background: var(--dot); border-radius: 50%; }

/* =========================================================================
   Eyebrow label (shared)
   ========================================================================= */
.eyebrow {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--slate);   /* WCAG AA: --mute (#8C96A3) is ~2.9:1 at this size; --slate (#5E6B7C) clears 4.5:1 on paper/card/tint */
  margin-bottom: 9px;
}
.eyebrow--wide { letter-spacing: 0.16em; margin-bottom: 16px; }

/* =========================================================================
   Status box (proof posture + related + topics)
   ========================================================================= */
.statusbox {
  background: var(--card);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--navy);
  border-radius: 3px;
  padding: 22px 26px;
}
.statusbox__head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border-bottom: 1px solid var(--rule-2);
  padding-bottom: 15px;
  margin-bottom: 16px;
}
.statusbox__mark { width: 9px; height: 9px; background: var(--navy); display: inline-block; flex: none; margin-top: 4px; }
.statusbox__title {
  font-family: var(--mono);
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--navy);
}
.statusbox__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 26px; }
/* When only one of Related/Topics survives (e.g. a brief whose related links are
   all citation-only), let the lone column fill the measure instead of sitting in
   a half-width track with an empty half. */
.statusbox__grid:has(> div:only-child) { grid-template-columns: minmax(0, 1fr); }
.related { display: flex; flex-direction: column; gap: 7px; }
.related__link {
  font-family: var(--serif);
  font-size: 14.5px;
  color: var(--navy);
  text-decoration: none;
  border-bottom: 1px solid var(--underline);
  width: max-content;
  max-width: 100%;
  padding-bottom: 1px;
  transition: border-color 0.15s ease;
}
.related__link:hover { border-bottom-color: var(--navy); }
.topics { display: flex; gap: 7px; flex-wrap: wrap; }
.topic {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--slate);
  border: 1px solid var(--rule);
  border-radius: 2px;
  padding: 3px 9px;
}

/* =========================================================================
   Body grid: left rail + article column
   ========================================================================= */
.layout { display: grid; grid-template-columns: 228px minmax(0, 1fr); gap: 56px; }
.rail__sticky { position: sticky; top: 88px; }

/* Table of contents */
.toc { display: flex; flex-direction: column; gap: 2px; border-left: 1px solid var(--rule); }
.toc__item {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  padding: 7px 0 7px 16px;
  margin-left: -1px;
  border-left: 2px solid transparent;
  transition: border-color 0.15s ease;
}
.toc__item:hover { border-left-color: var(--navy); }
.toc__label { font-family: var(--serif); font-size: 14.5px; color: var(--ink-4); }
.toc__count { font-family: var(--mono); font-size: 10px; color: var(--mist); }

/* Proof marks (shared by toc, legend, provenance chip) — form, not color */
.mark { flex: none; display: inline-block; }
.mark--documented { width: 9px; height: 9px; background: var(--navy); }
.mark--required   { width: 9px; height: 9px; border: 1.5px solid var(--navy); }
.mark--open       { width: 9px; height: 9px; border: 1.5px dashed var(--slate-2); border-radius: 50%; }  /* WCAG 1.4.11 (graphic): --mist ~2.4:1; --slate-2 (#7C8694) clears 3:1 on paper/card */

/* Proof legend box */
.legend {
  margin-top: 24px;
  border: 1px solid var(--rule);
  border-radius: 3px;
  padding: 14px 15px;
  background: var(--card);
}
.legend__title {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--slate);   /* WCAG AA: same lift as .eyebrow — --slate clears 4.5:1 on the --card legend bg */
  margin-bottom: 9px;
}
.legend__row { display: flex; align-items: center; gap: 9px; margin-bottom: 8px; }
.legend__row:last-child { margin-bottom: 0; }
.legend__label { font-family: var(--mono); font-size: 10px; color: var(--slate); letter-spacing: 0.04em; }

/* =========================================================================
   Article column
   ========================================================================= */
.article { max-width: var(--measure-body); }
.section { margin-bottom: 46px; }
.section__eyebrow {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mute);
  margin-bottom: 14px;
}

/* Plain-language summary lead */
.summary p {
  font-family: var(--serif);
  font-size: 20px;
  line-height: 1.58;
  color: var(--ink-3);
  margin: 0 0 16px;
}
.summary p:last-child { margin-bottom: 0; }

/* Section headings + reading prose (markdown output lives in .article) */
.h2 {
  font-family: var(--display);
  font-weight: 600;
  font-size: 25px;
  line-height: 1.25;
  letter-spacing: -0.005em;
  margin: 0 0 18px;
}
.h2--small { font-size: 20px; margin: 0 0 20px; }

.article h2 {
  font-family: var(--display);
  font-weight: 600;
  font-size: 25px;
  line-height: 1.25;
  letter-spacing: -0.005em;
  margin: 0 0 18px;
}
.article p {
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.66;
  color: var(--ink-3);
  margin: 0 0 16px;
}
.article p:last-child { margin-bottom: 0; }
.article strong { font-weight: 600; }
.article em { font-style: italic; }
.article a:not([class]) {
  color: var(--navy);
  text-decoration: none;
  border-bottom: 1px solid var(--underline);
}
.article a:not([class]):hover { border-bottom-color: var(--navy); }

/* A markdown bullet list inside a finding renders as "open points" — the
   dashed open mark, matching the Open-questions section in the export. */
.article ul {
  margin: 0 0 22px;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.article li {
  position: relative;
  padding-left: 26px;
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.6;
  color: var(--ink-3);
}
/* Marker is absolutely positioned (not a grid item) so the item's text — incl.
   a bold lead-in <strong> — flows as normal full-width prose. A grid column
   here collapsed the body text to one word per line once items had inline
   element children. */
.article li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 8px;
  height: 8px;
  border: 1.5px dashed var(--mist);
  border-radius: 50%;
}

/* =========================================================================
   Proof-level badges — solid -> ruled -> dashed (Brand System §04)
   ========================================================================= */
.badge {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border-radius: 2px;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 18px;
}
.badge--documented { padding: 6px 12px 6px 10px; background: var(--navy); color: var(--paper); }
.badge--documented .badge__mark { width: 8px; height: 8px; background: var(--paper); display: inline-block; }
.badge--required { padding: 5px 12px 5px 10px; background: var(--card); color: var(--navy); border: 1.5px solid var(--navy); }
.badge--required .badge__glyph { font-family: var(--serif); font-size: 14px; font-weight: 600; line-height: 0; }
.badge--open { padding: 5px 12px 5px 10px; background: var(--card); color: var(--slate); border: 1.5px dashed var(--mist); }
.badge--open .badge__mark { width: 8px; height: 8px; border: 1.5px solid var(--slate); border-radius: 50%; display: inline-block; }

/* =========================================================================
   Inline source marker
   ========================================================================= */
.cite { font-family: var(--mono); font-size: 10px; font-weight: 600; vertical-align: super; line-height: 0; }
.cite a { color: var(--navy); text-decoration: none; }

/* =========================================================================
   Document-reference card
   ========================================================================= */
.docrefs {
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: 3px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.docref { display: flex; align-items: center; gap: 11px; text-decoration: none; transition: opacity 0.15s ease; }
.docref:hover { opacity: 0.72; }
.docref + .docref { border-top: 1px solid var(--rule-2); padding-top: 10px; }
.docref__glyph {
  width: 22px;
  height: 22px;
  border: 1px solid var(--underline);
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono);
  font-size: 10px;
  color: var(--navy);
  flex: none;
}
.docref__label { font-family: var(--mono); font-size: 12.5px; color: var(--ink); min-width: 0; overflow-wrap: anywhere; }
.docref__meta { font-family: var(--mono); font-size: 10px; color: var(--mute); }
.docref__arrow { margin-left: auto; font-family: var(--mono); font-size: 11px; color: var(--mist); }

/* =========================================================================
   Governing-text quote
   ========================================================================= */
.govquote {
  border-left: 3px solid var(--navy);
  background: var(--tint);
  border-radius: 0 3px 3px 0;
  padding: 20px 24px;
  margin: 0 0 18px;
}
.govquote__text {
  font-family: var(--serif);
  font-style: italic;
  font-size: 18.5px;
  line-height: 1.55;
  color: var(--ink-2);
  margin: 0 0 12px;
}
.govquote__cite { font-family: var(--mono); font-size: 11px; color: var(--slate); letter-spacing: 0.03em; }
.govquote__cite a { color: var(--navy); text-decoration: none; border-bottom: 1px solid var(--underline); }

/* =========================================================================
   Record quote — a direct quotation FROM THE RECORD (what was said / a
   document's own words). Differentiated from .govquote by FORM, not color:
   a hairline white card + quotation-mark glyph + upright text + an attribution
   line, vs govquote's navy left-bar + tint fill + italic. "What was said" must
   never be mistaken for "what the text requires".
   ========================================================================= */
.recordquote {
  position: relative;
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: 3px;
  padding: 18px 22px 16px 48px;
  margin: 0 0 18px;
}
.recordquote::before {
  content: "\201C";                 /* “ — decorative quotation mark */
  position: absolute;
  top: 8px;
  left: 16px;
  font-family: var(--display);
  font-size: 40px;
  line-height: 1;
  color: var(--mist);
}
.recordquote__text {
  font-family: var(--serif);        /* upright, not italic (unlike govquote) */
  font-size: 18.5px;
  line-height: 1.6;
  color: var(--ink-2);
  margin: 0 0 14px;
  overflow-wrap: anywhere;
}
.recordquote__attr {
  border-top: 1px solid var(--rule-2);
  padding-top: 12px;
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--slate);
  line-height: 1.5;
}

/* =========================================================================
   Open records-request note
   ========================================================================= */
.request-open {
  border: 1px dashed var(--dash);
  border-radius: 3px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.request-open__tag {
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--slate);
  border: 1px solid var(--chip);
  border-radius: 2px;
  padding: 3px 8px;
  flex: none;
}
.request-open__text { font-family: var(--mono); font-size: 12px; color: var(--ink-4); line-height: 1.5; }

/* =========================================================================
   Sources list
   ========================================================================= */
.sources { border-top: 1px solid var(--rule); padding-top: 30px; }
.sources__list { display: flex; flex-direction: column; gap: 16px; }
.source { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 14px; }
.source__n { font-family: var(--mono); font-size: 12px; color: var(--navy); font-weight: 600; }
.source__text { font-family: var(--serif); font-size: 15.5px; line-height: 1.5; color: var(--ink-3); overflow-wrap: anywhere; }
.source__text a {
  color: var(--navy);
  font-family: var(--mono);
  font-size: 11.5px;
  text-decoration: none;
  border-bottom: 1px solid var(--underline);
}
.source__status { font-family: var(--mono); font-size: 11px; color: var(--slate); }

/* =========================================================================
   Corrections log
   ========================================================================= */
.corrections {
  background: var(--card);
  border: 1px solid var(--rule);
  border-radius: 3px;
  padding: 20px 22px;
}
.corrections__head {
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--rule-2);
  padding-bottom: 13px;
  margin-bottom: 14px;
}
.corrections__title {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--navy);
}
.corrections__meta { font-family: var(--mono); font-size: 10px; color: var(--mist); margin-left: auto; }
.correction { display: flex; gap: 14px; margin-bottom: 14px; }
.correction:last-child { margin-bottom: 0; }
.correction__date { font-family: var(--mono); font-size: 11px; color: var(--slate); flex: none; white-space: nowrap; }
.correction__text { font-family: var(--serif); font-size: 13.5px; line-height: 1.5; color: var(--ink-4); min-width: 0; overflow-wrap: anywhere; }
.correction-none { display: flex; align-items: center; gap: 11px; }
.correction-none__mark { width: 8px; height: 8px; border: 1.5px solid var(--mist); border-radius: 50%; display: inline-block; flex: none; }
.correction-none__text { font-family: var(--serif); font-size: 15px; color: var(--mist); font-style: italic; }
.corrections__note { font-family: var(--mono); font-size: 11px; color: var(--mute); line-height: 1.6; margin-top: 14px; }
.corrections__note a { color: var(--navy); text-decoration: none; border-bottom: 1px solid var(--underline); }

/* =========================================================================
   Provenance / fidelity block
   ========================================================================= */
.provenance {
  background: var(--card);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--navy);
  border-radius: 3px;
  padding: 22px 26px;
}
.provenance__head {
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--rule-2);
  padding-bottom: 14px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.provenance__title {
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--navy);
}
.provenance__chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: var(--mono);
  font-size: 9.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--slate);
  border: 1px solid var(--underline);
  border-radius: 2px;
  padding: 3px 9px;
}
.provenance__chip .mark--required { width: 7px; height: 7px; }
.provenance__source {
  margin-left: auto;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--navy);
  text-decoration: none;
  border-bottom: 1px solid var(--underline);
  padding-bottom: 1px;
}
.provenance__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 22px; margin-bottom: 16px; }
.provenance__k {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--mute);
  margin-bottom: 6px;
}
.provenance__v { font-family: var(--serif); font-size: 14.5px; color: var(--ink-3); line-height: 1.4; }
.provenance__v .mono { font-family: var(--mono); font-size: 12.5px; color: var(--ink); }
.provenance__v a { font-family: var(--mono); font-size: 12px; color: var(--navy); text-decoration: none; border-bottom: 1px solid var(--underline); }
.provenance__note {
  border-top: 1px solid var(--rule-2);
  padding-top: 14px;
  font-family: var(--serif);
  font-size: 14px;
  line-height: 1.55;
  color: var(--slate);
}

/* =========================================================================
   Closing callout (all-public note)
   ========================================================================= */
.closing {
  background: var(--tint);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--navy);
  border-radius: 3px;
  padding: 22px 26px;
  margin-bottom: 44px;
}
.closing p { font-family: var(--serif); font-size: 17px; line-height: 1.6; color: var(--ink-2); margin: 0; }
.closing strong { font-weight: 600; }

/* =========================================================================
   Footer
   ========================================================================= */
.footer { margin-top: 64px; padding-bottom: 56px; }
.footer__top { border-top: 1px solid var(--rule); padding-top: 34px; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 48px; }
.footer__brand { font-weight: 500; font-size: 20px; margin-bottom: 14px; }
.footer__about { font-family: var(--serif); font-size: 13.5px; line-height: 1.6; color: var(--slate); max-width: 520px; margin: 0; }
.footer__links { display: flex; flex-direction: column; gap: 9px; }
.footer__link { font-family: var(--serif); font-size: 15px; color: var(--ink-3); text-decoration: none; transition: color 0.15s ease; }
.footer__link:hover { color: var(--navy); }
.footer__bar {
  border-top: 1px solid var(--rule-2);
  margin-top: 30px;
  padding-top: 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.footer__motto { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--mist); }
.footer__copy { font-family: var(--mono); font-size: 10.5px; color: var(--faint); }

/* =========================================================================
   Front-door pages (Home, The Standard, About) — shared bits
   ========================================================================= */
.page-kicker {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--navy);
  margin-bottom: 22px;
}
.lead {
  font-family: var(--serif);
  font-size: 21px;
  line-height: 1.5;
  color: var(--ink-4);
  margin: 0 0 14px;
}
.pullquote {
  border-left: 2px solid var(--navy);
  padding: 6px 0 6px 24px;
  margin: 8px 0 0;
}
.pullquote p {
  font-family: var(--display);
  font-weight: 500;
  font-size: 21px;
  line-height: 1.45;
  color: var(--ink);
  margin: 0;
}

/* ---- Home: hero -------------------------------------------------------- */
.home-hero { border-bottom: 1px solid var(--rule); }
.home-hero .wrap { padding-top: 72px; padding-bottom: 60px; }
.home-hero__title {
  font-family: var(--display);
  font-weight: 600;
  font-size: 54px;
  line-height: 1.1;
  letter-spacing: -0.012em;
  margin: 0 0 32px;
  /* spans the full content width (same as the masthead / how-this-works strip) */
}
.home-hero__body { max-width: 680px; }
.home-hero__body p {
  font-family: var(--serif);
  font-size: 20px;
  line-height: 1.6;
  color: var(--ink-3);
  margin: 0 0 18px;
}
.home-hero__body p:last-child { margin-bottom: 0; }

/* ---- Home: "How this works" strip -------------------------------------- */
.how { background: var(--card); border-bottom: 1px solid var(--rule); }
.how .wrap { padding-top: 48px; padding-bottom: 52px; }
.how__head { display: flex; align-items: baseline; gap: 16px; margin-bottom: 30px; flex-wrap: wrap; }
.how__eyebrow {
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mute);
}
.how__intro { font-family: var(--serif); font-size: 16px; color: var(--ink-4); }
.how__link {
  margin-left: auto;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--navy);
  text-decoration: none;
  border-bottom: 1px solid var(--underline);
  padding-bottom: 2px;
}
.how__link:hover { border-bottom-color: var(--navy); }
.how__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.how__card { border: 1px solid var(--rule); border-radius: 3px; padding: 22px 24px; }
.how__card .badge { margin-bottom: 16px; }
.how__card p { font-family: var(--serif); font-size: 15.5px; line-height: 1.55; color: var(--ink-3); margin: 0; }

/* ---- Home: LATEST feed ------------------------------------------------- */
.feed .wrap { padding-top: 46px; padding-bottom: 0; }
.feed__head {
  display: flex;
  align-items: baseline;
  gap: 16px;
  border-bottom: 1px solid var(--rule);
  padding-bottom: 16px;
  margin-bottom: 6px;
}
.feed__label {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--navy);
  margin: 0;
}
.feed__item {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 28px;
  border-bottom: 1px solid var(--rule);
  padding: 26px 0;
  text-decoration: none;
  color: inherit;
  transition: background-color 0.12s ease;
}
.feed__item:last-child { border-bottom: 0; }
.feed__item:hover { background: #FBFBFA; }
.feed__meta { padding-top: 3px; }
.feed__date { display: block; font-family: var(--mono); font-size: 11px; color: var(--slate); margin-bottom: 10px; }
.feed__title { font-family: var(--display); font-weight: 600; font-size: 21px; line-height: 1.3; letter-spacing: -0.005em; margin: 0 0 9px; }
.feed__dek { font-family: var(--serif); font-size: 16px; line-height: 1.5; color: var(--ink-4); margin: 0 0 13px; max-width: 660px; }
.feed__empty {
  font-family: var(--serif);
  font-size: 17px;
  line-height: 1.6;
  color: var(--slate);
  padding: 30px 0 8px;
  max-width: 660px;
}

/* Type badge (Finding / Overview) */
.type-badge {
  display: inline-block;
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-radius: 2px;
  padding: 3px 8px;
}
/* Findings and briefs are filled navy; meeting coverage (overview/recap/agenda)
   shares the outline treatment. */
.type-badge--finding,
.type-badge--brief { background: var(--navy); color: var(--paper); }
.type-badge--overview,
.type-badge--recap,
.type-badge--agenda { background: var(--card); color: var(--navy); border: 1px solid var(--underline); }

/* Overview cards carry the meeting (body + date) where a finding shows its
   proof signal — overviews have no single proof level. */
.feed__meeting { font-family: var(--mono); font-size: 11px; letter-spacing: 0.03em; color: var(--slate); }
.feed__meeting time { color: var(--ink); }

/* Inline proof-level signal on feed cards */
.feed__signals { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.signal {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.signal__mark { flex: none; display: inline-block; width: 7px; height: 7px; }
.signal--documented { color: var(--navy); }
.signal--documented .signal__mark { background: var(--navy); }
.signal--required { color: var(--navy); }
.signal--required .signal__mark { border: 1.5px solid var(--navy); }
.signal--open { color: var(--slate); }
.signal--open .signal__mark { border: 1.5px dashed var(--mist); border-radius: 50%; }

/* ---- The Standard: the three labels ----------------------------------- */
.std-labels { border-top: 1px solid var(--rule); padding-top: 36px; display: flex; flex-direction: column; }
.std-label { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 32px; align-items: start; padding-top: 30px; border-top: 1px solid var(--rule-2); margin-top: 30px; }
.std-label:first-child { padding-top: 0; border-top: 0; margin-top: 0; }
.std-label__badge { padding-top: 2px; }
.std-label p { font-family: var(--serif); font-size: 17.5px; line-height: 1.6; color: var(--ink-3); margin: 0; }
.std-section { border-top: 1px solid var(--rule); margin-top: 44px; padding-top: 36px; }
.std-section p { font-family: var(--serif); font-size: 18px; line-height: 1.66; color: var(--ink-3); margin: 0 0 16px; }
.std-section p:last-child { margin-bottom: 0; }

/* Corrections pointer (prose only — no link yet) */
.corrections-note {
  background: var(--card);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--navy);
  border-radius: 3px;
  padding: 22px 26px;
  margin-top: 40px;
}
.corrections-note h3 { font-family: var(--display); font-weight: 600; font-size: 18px; margin: 0 0 8px; }
.corrections-note p { font-family: var(--serif); font-size: 16px; line-height: 1.55; color: var(--ink-4); margin: 0; }

/* ---- About ------------------------------------------------------------ */
.prose-page p { font-family: var(--serif); font-size: 19px; line-height: 1.65; color: var(--ink-3); margin: 0 0 20px; }

/* =========================================================================
   Library index (the reading room)
   ========================================================================= */
.lib-intro { max-width: 760px; margin-bottom: 40px; }
.lib-intro .lead { margin-bottom: 8px; }
.lib-intro__note { font-family: var(--serif); font-size: 15px; line-height: 1.55; color: var(--slate); margin: 0; }
/* In-prose links inside the index-page intros (e.g. Meetings' "… in the
   archive") need a real affordance — a class-less <a> here inherits only the
   global `color: inherit`, so it would read as plain text (WCAG 1.4.1). Match
   the in-article / .extlink convention: navy + a hairline underline. */
.lib-intro__note a,
.lib-intro .lead a {
  color: var(--navy);
  text-decoration: none;
  border-bottom: 1px solid var(--underline);
}
.lib-intro__note a:hover,
.lib-intro .lead a:hover { border-bottom-color: var(--navy); }

.lib-group { margin-bottom: 34px; }
.lib-group__head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  border-bottom: 1px solid var(--ink);
  padding-bottom: 10px;
}
.lib-group__title { font-family: var(--display); font-weight: 600; font-size: 19px; letter-spacing: -0.003em; margin: 0; }
.lib-group__count { font-family: var(--mono); font-size: 10px; color: var(--mist); letter-spacing: 0.06em; }

.lib-list { border: 1px solid var(--rule); border-top: none; background: var(--card); }
.lib-entry {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: center;
  padding: 18px 20px;
  border-bottom: 1px solid var(--rule-2);
  transition: background-color 0.12s ease;
}
.lib-entry:last-child { border-bottom: 0; }
.lib-entry:hover { background: #FBFBFA; }
.lib-entry__titlerow { display: flex; align-items: baseline; gap: 10px; margin-bottom: 6px; flex-wrap: wrap; }
.lib-entry__title { font-family: var(--display); font-weight: 600; font-size: 17px; color: var(--ink); text-decoration: none; }
.lib-entry__title:hover { color: var(--navy); }
.lib-entry__type {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--slate); border: 1px solid var(--rule); border-radius: 2px; padding: 2px 7px;
}
.lib-entry__meta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.lib-entry__eff { font-family: var(--mono); font-size: 11px; color: var(--mute); }
.lib-entry__repro {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--navy);
}
.lib-entry__repro .mark--required { width: 7px; height: 7px; }
.lib-entry__source { text-align: right; white-space: nowrap; }
.lib-entry__source a {
  font-family: var(--mono); font-size: 11px; color: var(--navy);
  text-decoration: none; border-bottom: 1px solid var(--underline); padding-bottom: 1px;
}
.lib-entry__source a:hover { border-bottom-color: var(--navy); }
.lib-entry__rr { font-family: var(--mono); font-size: 10.5px; color: var(--mist); letter-spacing: 0.03em; }

/* =========================================================================
   Document reading-view
   ========================================================================= */
.doc-head .wrap, .doc-head { } /* spacing handled by .doc-head padding below */
.doc-head { padding-top: 48px; }
.doc-measure { max-width: 860px; }
.doc-crumb {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.04em; color: var(--mute); margin-bottom: 20px;
}
.doc-crumb a { color: var(--navy); text-decoration: none; }
.doc-crumb a:hover { text-decoration: underline; }
.doc-crumb__sep { color: var(--rule); }
.doc-crumb__current { color: var(--slate); }
.doc-titlerow { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; margin-bottom: 24px; }
.doc-title { font-family: var(--display); font-weight: 600; font-size: 33px; line-height: 1.2; letter-spacing: -0.006em; margin: 0; }
.doc-typetag {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--slate); border: 1px solid var(--rule); border-radius: 2px; padding: 3px 9px;
}
.doc-provenance .provenance__line { font-family: var(--serif); font-size: 14px; color: var(--ink-4); margin-top: 14px; }
.doc-provenance .provenance__k--inline {
  display: inline; margin: 0 6px 0 0; font-family: var(--mono); font-size: 9px; letter-spacing: 0.13em; text-transform: uppercase; color: var(--mute);
}
.doc-provenance .provenance__notelink { color: var(--navy); text-decoration: none; border-bottom: 1px solid var(--underline); }

/* Reading grid: rail + body */
.doc-grid { display: grid; grid-template-columns: 236px minmax(0, 1fr); gap: 56px; padding-top: 40px; }
.doc-rail__sticky { position: sticky; top: 92px; }
.doc-rail__source {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  text-decoration: none; border: 1px solid var(--underline); border-radius: 2px; padding: 9px 12px; margin-bottom: 18px;
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--navy);
}
.doc-rail__source:hover { background: var(--card); }
.doc-rail__label {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--mute); margin-bottom: 14px;
}
.doc-toc { display: flex; flex-direction: column; gap: 1px; border-left: 1px solid var(--rule); max-height: calc(100vh - 160px); overflow-y: auto; }
.doc-toc__item {
  text-decoration: none; margin-left: -1px; border-left: 2px solid transparent;
  transition: border-color 0.12s ease, color 0.12s ease;
}
.doc-toc__item:hover { border-left-color: var(--navy); color: var(--navy); }
.doc-toc__item--l2 { padding: 6px 0 6px 16px; font-family: var(--serif); font-size: 14px; font-weight: 500; color: var(--ink); margin-top: 6px; }
.doc-toc__item--l3 { padding: 5px 0 5px 26px; font-family: var(--mono); font-size: 12px; color: var(--slate); }
.doc-toc__item--l4 { padding: 4px 0 4px 38px; font-family: var(--mono); font-size: 11.5px; color: var(--slate); }

/* Contents disclosure. The <details> wrapper lets the rail collapse on mobile
   (see the mobile block); on desktop it is a plain always-open list — the
   summary acts as the static "Contents" label and the list is forced visible. */
.doc-toc-disc > summary { list-style: none; }
.doc-toc-disc > summary::-webkit-details-marker { display: none; }
@media (min-width: 881px) {
  .doc-toc-disc > summary { cursor: default; pointer-events: none; }
  .doc-toc-disc > .doc-toc { display: flex !important; }   /* override closed-details hiding */
  .doc-toc-disc::details-content { content-visibility: visible !important; }  /* newer engines */
}

/* Document body — reading typography for the verbatim reproduction */
.doc-body { max-width: 720px; }
.doc-body h2 { font-family: var(--display); font-weight: 600; font-size: 24px; line-height: 1.25; letter-spacing: -0.005em; color: var(--ink); margin: 40px 0 12px; }
.doc-body h2:first-child { margin-top: 0; }
.doc-body h3 { font-family: var(--display); font-weight: 600; font-size: 18px; line-height: 1.3; color: var(--ink); margin: 30px 0 8px; }
.doc-body h4 { font-family: var(--serif); font-weight: 600; font-size: 16.5px; line-height: 1.4; color: var(--ink); margin: 22px 0 6px; }
.doc-body h5 { font-family: var(--mono); font-weight: 600; font-size: 12.5px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--slate); margin: 18px 0 6px; }
.doc-body p { font-family: var(--serif); font-size: 16.5px; line-height: 1.62; color: var(--ink-3); margin: 0 0 14px; }
.doc-body ul, .doc-body ol { margin: 0 0 14px; padding-left: 26px; }
.doc-body li { font-family: var(--serif); font-size: 16.5px; line-height: 1.62; color: var(--ink-3); margin-bottom: 6px; }
.doc-body strong { font-weight: 600; color: var(--ink); }
.doc-body em { font-style: italic; }
.doc-body a { color: var(--navy); text-decoration: none; border-bottom: 1px solid var(--underline); }
.doc-body blockquote {
  border-left: 3px solid var(--navy); background: var(--tint); border-radius: 0 3px 3px 0;
  margin: 0 0 16px; padding: 14px 20px;
}
.doc-body blockquote p { margin: 0; font-style: italic; color: var(--ink-2); }
.doc-body hr { border: 0; border-top: 1px solid var(--rule); margin: 28px 0; }
/* Monospace treatment for inline defined terms / section numbers in code spans */
.doc-body code {
  font-family: var(--mono); font-size: 0.86em; color: var(--ink-4);
  background: var(--tint); border: 1px solid var(--rule-2); border-radius: 2px; padding: 1px 5px;
}
/* Tables (e.g. threshold tables) */
.doc-body table { width: 100%; border-collapse: collapse; margin: 4px 0 18px; font-family: var(--serif); }
.doc-body thead th {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--slate);
  text-align: left; padding: 9px 12px; background: var(--tint); border: 1px solid var(--rule);
}
.doc-body tbody td { font-size: 15px; line-height: 1.45; color: var(--ink-3); padding: 9px 12px; border: 1px solid var(--rule); }
.doc-body tbody tr:nth-child(even) td { background: #FCFCFB; }

.doc-endnote {
  border-top: 1px solid var(--rule); margin-top: 34px; padding-top: 18px; padding-bottom: 8px;
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px;
}
.doc-endnote span { font-family: var(--mono); font-size: 10.5px; color: var(--mute); letter-spacing: 0.04em; }
.doc-endnote a { font-family: var(--mono); font-size: 11px; color: var(--navy); text-decoration: none; border-bottom: 1px solid var(--underline); padding-bottom: 1px; }

/* Deep-link highlight on arrival (JS wraps the targeted section) */
.linked-section {
  background: #EDF1F5;            /* pale navy tint — the design's highlight */
  box-shadow: inset 3px 0 0 var(--navy);
  border-radius: 0 3px 3px 0;
  padding: 14px 16px 6px 20px;
  margin: 18px 0;
  scroll-margin-top: 92px;
}
.linked-section > :first-child { margin-top: 0; }
.linked-pill {
  display: inline-flex; align-items: center; gap: 7px;
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--navy); background: var(--card); border: 1px solid var(--underline); border-radius: 2px;
  padding: 4px 9px; margin-bottom: 12px;
}

/* =========================================================================
   External-link treatment — leaves the site (e.g. to Online Sunshine).
   Visually distinct from internal links: a trailing ↗ glyph.
   ========================================================================= */
.extlink { color: var(--navy); text-decoration: none; border-bottom: 1px solid var(--underline); padding-bottom: 1px; }
.extlink:hover { border-bottom-color: var(--navy); }
.extlink__arrow { font-family: var(--mono); }

/* =========================================================================
   Florida Statutes reference index
   ========================================================================= */
.stat-intro { max-width: 760px; margin-bottom: 40px; }
.stat-intro .doc-crumb { margin-bottom: 18px; }

.stat-list { display: flex; flex-direction: column; gap: 14px; margin-bottom: 8px; }
.statute {
  background: var(--card);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--navy);
  border-radius: 3px;
  padding: 20px 24px;
  max-width: 820px;
}
.statute__head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.statute__cite {
  font-family: var(--mono); font-size: 14px; font-weight: 600; color: var(--navy);
  letter-spacing: 0.01em; flex: none;
}
.statute__title { font-family: var(--display); font-weight: 600; font-size: 18px; line-height: 1.3; color: var(--ink); margin: 0; }
.statute__chapter {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--slate); border: 1px solid var(--rule); border-radius: 2px; padding: 2px 7px; margin-left: auto;
}
.statute__summary { font-family: var(--serif); font-size: 16px; line-height: 1.55; color: var(--ink-3); margin: 0 0 14px; }
.statute__why { border-top: 1px solid var(--rule-2); padding-top: 12px; margin-bottom: 14px; }
.statute__whylabel {
  font-family: var(--mono); font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--mute); margin-bottom: 6px;
}
.statute__rel { font-family: var(--serif); font-size: 15px; line-height: 1.55; color: var(--ink-4); margin: 0; }
.statute__link { display: inline-flex; align-items: center; gap: 7px; font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.02em; }

.stat-foot {
  max-width: 820px; margin-top: 28px;
  font-family: var(--serif); font-size: 13.5px; line-height: 1.6; color: var(--slate);
}

/* Library index → statutes reference section (distinct from reproduced docs) */
.lib-refs {
  display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  background: var(--tint);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--navy);
  border-radius: 3px;
  padding: 22px 26px;
  margin-top: 14px;
}
.lib-refs__body { flex: 1; min-width: 300px; }
.lib-refs__title { font-family: var(--display); font-weight: 600; font-size: 19px; letter-spacing: -0.003em; margin: 0 0 8px; }
.lib-refs__note { font-family: var(--serif); font-size: 15px; line-height: 1.55; color: var(--ink-4); margin: 0; max-width: 600px; }
.lib-refs__link {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--paper); background: var(--navy); border-radius: 2px; padding: 11px 18px;
  text-decoration: none; white-space: nowrap; flex: none;
}
.lib-refs__link:hover { opacity: 0.92; }

/* =========================================================================
   Meetings index — coverage records list, in the Library records-index style.
   Reuses .lib-entry rows; a meeting is descriptive (body/type/date) with its
   coverage as links, so the title is a span and the right column holds links.
   ========================================================================= */
.meet-list { border: 1px solid var(--rule); background: var(--card); }
.meet-title { font-family: var(--display); font-weight: 600; font-size: 17px; color: var(--ink); }
.meet-coverage { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; text-align: right; }
.meet-coverage a {
  font-family: var(--mono); font-size: 11px; color: var(--navy); white-space: nowrap;
  text-decoration: none; border-bottom: 1px solid var(--underline); padding-bottom: 1px;
}
.meet-coverage a:hover { border-bottom-color: var(--navy); }

/* =========================================================================
   Meeting overview — the pre-meeting agenda-preview format.
   Reuses the hero's kicker-row / .h1 / .dek / .byline for the meeting header;
   the rail + per-item agenda blocks below are specific to this page type.
   No proof-level badges here (findings-only).
   ========================================================================= */
.ov-head { padding-top: 54px; }
.ov-measure { max-width: var(--measure); }

/* Outline "Before the meeting" pill — distinct from the finding's solid kicker. */
.ov-kicker {
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--navy);
  border: 1px solid var(--underline);
  border-radius: 2px;
  padding: 4px 9px;
}

/* Recap + packet links beneath the meeting byline. */
.ov-actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 18px; }
.ov-recap {
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--navy);
  text-decoration: none;
  border-bottom: 1px solid var(--underline);
  padding-bottom: 2px;
  transition: border-color 0.15s ease;
}
.ov-recap:hover { border-bottom-color: var(--navy); }
.ov-actions__label {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--mute);
}
.ov-actions .extlink { font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.02em; }

/* Agenda grid: index rail + body, matching the article rail rhythm. */
.ov-grid { display: grid; grid-template-columns: 228px minmax(0, 1fr); gap: 56px; padding-top: 46px; }
.ov-rail__sticky { position: sticky; top: 88px; }
.ov-rail__label {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--mute); margin-bottom: 16px;
}
.ov-toc { display: flex; flex-direction: column; gap: 2px; border-left: 1px solid var(--rule); }
.ov-toc__item {
  display: block;
  text-decoration: none;
  padding: 8px 0 8px 16px;
  margin-left: -1px;
  border-left: 2px solid transparent;
  font-family: var(--serif);
  font-size: 14px;
  line-height: 1.3;
  color: var(--ink-3);
  min-width: 0;
  overflow-wrap: anywhere;
  transition: border-color 0.15s ease, color 0.15s ease;
}
.ov-toc__item:hover { border-left-color: var(--navy); color: var(--navy); }

/* Agenda body — reading typography. Each "##" item heading gets a top rule so
   it reads as a discrete agenda block; the first one opens the list. */
.ov-body { max-width: var(--measure-body); }
.ov-body > p:first-child {
  font-family: var(--serif);
  font-size: 18.5px;
  line-height: 1.55;
  color: var(--ink-4);
  margin: 0 0 4px;
}
.ov-body h2 {
  font-family: var(--display);
  font-weight: 600;
  font-size: 25px;
  line-height: 1.25;
  letter-spacing: -0.005em;
  color: var(--ink);
  border-top: 1px solid var(--rule);
  margin: 44px 0 16px;
  padding-top: 22px;
}
.ov-body h2:first-of-type { border-top: 2px solid var(--ink); }
.ov-body p {
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.66;
  color: var(--ink-3);
  margin: 0 0 20px;
}
.ov-body p:last-child { margin-bottom: 0; }
.ov-body strong { font-weight: 600; color: var(--ink); }
.ov-body em { font-style: italic; }
.ov-body a {
  color: var(--navy);
  text-decoration: none;
  border-bottom: 1px solid var(--underline);
  overflow-wrap: anywhere;
}
.ov-body a:hover { border-bottom-color: var(--navy); }
.ov-body hr { border: 0; border-top: 1px solid var(--rule); margin: 40px 0 24px; }
/* Lists in a recap/overview body (e.g. itemized vote outcomes) — match the
   reading-prose scale rather than browser defaults. */
.ov-body ul { margin: 0 0 20px; padding-left: 22px; }
.ov-body li { font-family: var(--serif); font-size: 18px; line-height: 1.6; color: var(--ink-3); margin: 0 0 8px; }
.ov-body li::marker { color: var(--mist); }
.ov-body li:last-child { margin-bottom: 0; }

/* =========================================================================
   Responsive — the export is desktop-only; collapse gracefully on narrow.
   ========================================================================= */
/* Single "narrow" mode below 880px. The export was desktop-only, so this block
   is the deliberate mobile spec — every page type inherits it. */
@media (max-width: 880px) {
  .wrap { padding: 0 22px; }

  /* Two-column finding grid -> single column; the rail (TOC + proof legend)
     reflows in flow, above the article. */
  .layout { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .rail__sticky { position: static; }

  /* Structured blocks stack to one column. */
  .statusbox__grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .provenance__grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .footer__top { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .h1 { font-size: 31px; }
  .dek { font-size: 18px; }

  /* ---- Navigation: collapse the masthead nav into a stacked panel -------- */
  .masthead__inner { flex-wrap: wrap; row-gap: 0; }
  .nav {
    flex-basis: 100%;
    width: 100%;
    margin: 12px 0 0;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    border-top: 1px solid var(--rule);
    padding-top: 2px;
  }
  .nav__link {
    display: block;
    padding: 13px 2px;        /* ≥44px tap target */
    font-size: 12.5px;
    border-bottom: 1px solid var(--rule-2);
  }
  .nav__link:last-child { border-bottom: 0; }
  .nav__link.is-active { color: var(--navy); border-bottom-color: var(--rule-2); }
  .nav__link.is-active::before {
    content: "";
    display: inline-block;
    width: 6px; height: 6px;
    background: var(--navy);
    margin-right: 9px;
    vertical-align: middle;
  }

  /* JS present: an icon-only toggle that opens a full-screen navy overlay.
     The toggle sits above the overlay (same corner) and morphs to an ✕.
     (No-JS keeps the stacked panel above — links stay reachable.) */
  .js .nav-toggle { display: inline-flex; position: relative; z-index: 1001; }

  .js .nav {
    position: fixed;
    inset: 0;
    z-index: 1000;
    width: auto;
    margin: 0;
    border-top: 0;
    padding: 84px 32px 48px;
    background: var(--navy);   /* the one full navy surface — intentional */
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: stretch;
    gap: 0;
    overflow-y: auto;
    display: none;             /* hidden from first paint (no flash) */
  }
  .js.nav-open .nav { display: flex; }
  /* The masthead's backdrop-filter would otherwise make it the containing
     block for the fixed overlay, trapping it inside the bar — drop it while
     open so the overlay fills the viewport. */
  .js.nav-open .masthead { backdrop-filter: none; -webkit-backdrop-filter: none; }

  /* Overlay links: white, large, generous tap targets. */
  .js .nav__link {
    display: block;
    color: var(--paper);
    font-family: var(--mono);
    font-size: 19px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 18px 2px;
    border-bottom: 1px solid rgba(250, 250, 248, 0.14);
  }
  .js .nav__link:first-of-type { border-top: 1px solid rgba(250, 250, 248, 0.14); }
  .js .nav__link:hover { color: var(--paper); }
  .js .nav__link.is-active { color: var(--paper); border-bottom-color: rgba(250, 250, 248, 0.14); }
  .js .nav__link.is-active::before {
    content: "";
    display: inline-block;
    width: 7px; height: 7px;
    background: var(--paper);
    margin-right: 12px;
    vertical-align: middle;
  }

  /* Toggle becomes a white ✕ on the navy field. */
  .js.nav-open .nav-toggle { background: transparent; border-color: transparent; color: var(--paper); }

  /* Lock the page behind the overlay. */
  .nav-open, .nav-open body { overflow: hidden; }

  .footer__link { padding: 4px 0; }   /* roomier touch target */
}

/* Front-door pages — narrow layout. */
@media (max-width: 880px) {
  .home-hero .wrap { padding-top: 52px; padding-bottom: 44px; }
  .home-hero__title { font-size: 34px; margin-bottom: 24px; }
  .home-hero__body p { font-size: 18px; }
  .how__grid { grid-template-columns: minmax(0, 1fr); }
  .feed__item { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .feed__meta { display: flex; align-items: center; gap: 12px; padding-top: 0; }
  .feed__date { margin-bottom: 0; }
  .std-label { grid-template-columns: minmax(0, 1fr); gap: 14px; }

  /* Library / document reading-view collapse to single column. */
  .doc-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; padding-top: 32px; }
  .doc-rail__sticky { position: static; }
  .doc-toc { max-height: none; }
  .doc-title { font-size: 27px; }

  /* Contents becomes a collapsible disclosure (closed by default) so the
     document body is immediately reachable; entries are full 44px tap targets
     once expanded. */
  .doc-toc-disc { border: 1px solid var(--rule); border-radius: 3px; background: var(--card); }
  .doc-toc-disc > summary {
    cursor: pointer;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0;
    padding: 0 14px;
  }
  .doc-toc-disc > summary::after {
    content: "\25BE";
    font-family: var(--mono);
    font-size: 11px;
    color: var(--slate);
    transition: transform 0.15s ease;
  }
  .doc-toc-disc[open] > summary { border-bottom: 1px solid var(--rule); }
  .doc-toc-disc[open] > summary::after { transform: rotate(180deg); }
  /* Base .doc-toc sets display:flex, which (as an author rule) overrides the
     UA's closed-<details> hiding — so collapse it explicitly when closed. */
  .doc-toc-disc:not([open]) > .doc-toc { display: none; }
  .doc-toc-disc > .doc-toc { border-left: 0; gap: 8px; padding: 10px 14px 12px; }
  .doc-toc__item { min-height: 44px; display: flex; align-items: center; }
  .doc-toc__item--l2 { margin-top: 0; }
  .lib-entry { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .lib-entry__source { text-align: left; white-space: normal; }
  .meet-coverage { align-items: flex-start; text-align: left; }

  /* Meeting overview collapses the same way: rail reflows above the agenda. */
  .ov-head { padding-top: 40px; }
  .ov-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; padding-top: 32px; }
  .ov-rail__sticky { position: static; }
}

/* Small phones — tighten the hero and gutters. */
@media (max-width: 430px) {
  .wrap { padding: 0 18px; }
  .h1 { font-size: 27px; }
  .dek { font-size: 17.5px; }
  .home-hero__title { font-size: 30px; }
}

/* =========================================================================
   Mobile tap-target & hit-area fixes (≤880px) — touch ergonomics only.
   Every rule is inside this query, so desktop is unchanged. Reference
   minimum is 44px (WCAG 2.5.5). Two patterns the audit found already correct
   are left untouched: the home feed cards (full-card <a>) and the open-nav
   overlay links. The document TOC (50+ nested entries) is intentionally NOT
   padded here — see the audit note.
   ========================================================================= */
@media (max-width: 880px) {
  /* (1) Statute cards — the whole card taps through to its single outbound
     link, mirroring the feed-card stretched-link pattern (no nested anchor). */
  .statute { position: relative; }
  .statute .statute__link::after { content: ""; position: absolute; inset: 0; }

  /* (2) Library document rows — the whole row taps through to the reproduced
     document; "Official source ↗" stays independently tappable on top.
     Scoped to .lib-list so it never affects the Meetings rows (also .lib-entry). */
  .lib-list .lib-entry { position: relative; }
  .lib-list .lib-entry__title::after { content: ""; position: absolute; inset: 0; }
  .lib-list .lib-entry__source { position: relative; z-index: 1; }
  .lib-list .lib-entry__source a { display: inline-flex; align-items: center; min-height: 44px; }

  /* (3) Meetings rows — two co-equal destinations, so NOT a single row target:
     render coverage as buttons and drop the whole-row hover cue. */
  .meet-list .lib-entry:hover { background: var(--card); }
  .meet-coverage { gap: 10px; }
  .meet-coverage a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 11px 16px;
    border: 1px solid var(--underline);
    border-radius: 2px;
    width: max-content;
    max-width: 100%;
  }

  /* (4) Overview / recap "On this agenda" rail — ≥44px targets, ≥8px apart. */
  .ov-toc { gap: 8px; }
  .ov-toc__item { display: flex; align-items: center; min-height: 44px; }

  /* (5) Standalone action links — pad to a ≥44px tap target. */
  .how__link,
  .ov-actions .ov-recap,
  .ov-actions .extlink,
  .lib-refs__link,
  .doc-rail__source,
  .provenance__source,
  .doc-crumb a,
  .footer__link,
  .feed__archive-link,            /* home/meetings "See … in the archive →" */
  .agenda-sources .extlink,       /* agenda packet / workshop-packet links */
  .error-action .related__link {  /* the 404 "Return to the homepage →" CTA */
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
  /* Inline links inside prose — grow the hit area vertically without shifting
     the line box (negative margin cancels the padding); keep wrapping so the
     larger target can never force horizontal overflow. */
  .ov-body a,
  .stat-foot .extlink,
  .provenance__notelink,
  .lib-intro__note a,
  .lib-intro .lead a {
    display: inline-block;
    padding-top: 12px;
    padding-bottom: 12px;
    margin-top: -12px;
    margin-bottom: -12px;
    overflow-wrap: anywhere;
  }

  /* (6) Finding article page (layouts/finding.njk) — not in the original pass.
     Block-level targets to 44px; in-text links (the "On this page" rail aside)
     get the same inline-block hit-area growth. */
  .toc { gap: 8px; }
  .toc__item { min-height: 44px; }
  .related { gap: 8px; }
  /* Scoped to the status-box .related container — .related__link is also used
     standalone on the 404 page, which this fix should not touch. */
  .related .related__link { display: inline-flex; align-items: center; min-height: 44px; }
  .docref { min-height: 44px; }
  /* Body prose, source-list, govquote-citation and inline cite-marker links are
     all class-less <a> inside the article column — grow each one's hit area
     vertically without shifting the line box (matches the in-prose pattern above;
     inline targets are size-exempt under WCAG, but this still enlarges them). */
  .article a:not([class]) {
    display: inline-block;
    padding-top: 12px;
    padding-bottom: 12px;
    margin-top: -12px;
    margin-bottom: -12px;
    overflow-wrap: anywhere;
  }

  /* (7) Archive filter chips (archive.njk) — interactive <button>s added after
     the original pass; the small mono chips sat ~25px tall. Grow each to a full
     44px touch target. A bordered control's hit area IS its visible button, so
     enlarging the button itself is the correct fix (not an invisible overlay). */
  .archive-chip { display: inline-flex; align-items: center; min-height: 44px; }

  /* (8) Inline source/ref superscripts (.cite a — {% cite %}/{% ref %} markers,
     the legal-gauge ref, the contrast-row ref). The super-shrunk digit sat far
     under 44px. Grow the hit area with symmetric padding + equal negative
     margins so the line box — and the visual super position — never shift. The
     `.article .cite a` selector overrides the generic in-prose link rule above
     for body cites; the bare `.cite a` covers cites outside the article column
     (e.g. the legal-gauge strip, which is not inside .article). */
  .cite a,
  .article .cite a {
    display: inline-block;
    line-height: 1;
    padding: 17px 12px;
    margin: -17px -12px;
    overflow-wrap: anywhere;
    border-bottom: 0;   /* the enlarged hit area would otherwise float the inherited
                           .article-link underline ~17px below the super-numeral; the
                           navy superscript is the citation affordance on its own */
  }
}

/* =========================================================================
   Screen-reader-only utility — visible to assistive tech, removed from the
   visual layout. Used by the recorded-votes matrix so glyph cells and greyed
   columns carry text the eye doesn't need but a screen reader does.
   ========================================================================= */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* =========================================================================
   Recorded-votes matrix (recaps) — the meeting "scoreboard". Same vocabulary
   as the record components: hairline --rule borders, --tint headers, mono
   labels, navy as the only accent (Brand System §02). DESKTOP renders the full
   member-by-vote matrix; ≤880px (the site's collapse breakpoint) drops the
   member columns for a quick-hit list. The component renders `result` verbatim —
   it never computes pass/fail. Pass/fail is carried by the WORD, never by colour
   alone, and the glyphs (✓ / ✕ / –) differ by SHAPE so the matrix reads in
   greyscale; each glyph cell also carries a visually-hidden text label.
   ========================================================================= */
.votematrix { margin: 40px 0 0; }              /* resets the UA <figure> side margins */

/* ---- Desktop matrix ---- */
.vm-tablewrap { overflow-x: auto; }            /* contain a wide many-member matrix; no scrollbar until needed */
.vm-table { width: 100%; border-collapse: collapse; font-family: var(--serif); }
/* Scoped under .votematrix so the recap's .ov-body p/ul/li element rules
   (and the findings' .article p) don't win on specificity and reskin these. */
.vm-caption,
.votematrix .vm-scoreboard__title {
  caption-side: top;
  text-align: left;
  font-family: var(--mono);
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--navy);
  margin: 0 0 12px;
}
.vm-th {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--slate);
  background: var(--tint);
  border: 1px solid var(--rule);
  padding: 9px 8px;
}
.vm-th--member, .vm-th--result { text-align: center; white-space: nowrap; }
.vm-th--corner { text-align: left; }
.vm-th--absent { color: var(--slate); font-style: italic; }  /* italic (+ blank cells + sr-only) marks absence; --slate keeps the name legible (AA) */
.vm-th--row {
  font-family: var(--serif);
  font-size: 14.5px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.4;
  color: var(--ink);
  background: var(--card);
  text-align: left;
  overflow-wrap: anywhere;
}
.vm-cell {
  border: 1px solid var(--rule);
  padding: 9px 8px;
  text-align: center;
  vertical-align: middle;
}
.vm-glyph { font-size: 15px; line-height: 1; display: inline-block; }
.vm-cell--aye .vm-glyph { color: var(--navy); }
.vm-cell--nay .vm-glyph { color: var(--ink-3); }
.vm-cell--abstain .vm-glyph { color: var(--slate); }  /* lightest of the three glyphs, but AA-legible (the dash is the only visual abstain cue) */
.vm-cell--absent, .vm-cell--blank { background: var(--tint); }
.vm-result {
  border: 1px solid var(--rule);
  padding: 9px 10px;
  text-align: center;
  font-family: var(--serif);
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}
.vm-result--passed { color: var(--navy); }
.vm-result--failed { color: var(--slate); }
/* Failed rows recede with a neutral tint (value, not hue) — the WORD still carries it. */
.vm-row--failed .vm-th--row,
.vm-row--failed .vm-cell,
.vm-row--failed .vm-result { background: var(--tint); }

/* ---- Mobile scoreboard (hidden until ≤880px) ---- */
.vm-scoreboard { display: none; }
.votematrix .vm-sb { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.votematrix .vm-sb__row {
  display: flex;
  gap: 14px;
  justify-content: space-between;
  align-items: baseline;
  margin: 0;
  padding: 12px 0;
  border-bottom: 1px solid var(--rule);
}
.vm-sb__id {
  flex: 1 1 auto;
  min-width: 0;
  font-family: var(--serif);
  font-size: 16px;
  line-height: 1.4;
  color: var(--ink-3);
  overflow-wrap: anywhere;
}
.vm-sb__result {
  flex: none;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.vm-sb__result--passed { color: var(--navy); }
.vm-sb__result--failed { color: var(--slate); }

/* ---- Footnote (both layouts) ---- */
.votematrix .vm-note {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--slate);   /* substantive disclaimer — kept quiet but AA-legible (--mute fails contrast at 11px) */
  line-height: 1.6;
  margin: 14px 0 0;
}

/* The matrix is a scoreboard, not a spreadsheet: at the site's collapse
   breakpoint the member columns disappear and the quick-hit list takes over —
   no horizontal scroll. */
@media (max-width: 880px) {
  .vm-tablewrap { display: none; }
  .vm-scoreboard { display: block; }
}

/* =========================================================================
   Briefs — plain-language context pieces. Ported from the Context Brief export,
   built entirely on the shared tokens (--navy the only accent). Reuses
   .kicker/.h1/.dek/.byline (hero), .statusbox/.related/.topic (context box),
   .legend (reading key), .toc (rail), .sources, corrections-log. NEW here: the
   "why" lead, the what-it-is / isn't cards, the legal-gauge strip, the contrast
   row, and the brief body's section rules + closing highlight box.
   ========================================================================= */
.brief-why { font-family: var(--serif); font-size: 16px; line-height: 1.5; color: var(--ink-2); }

/* What it is / What it is not */
.whatis-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.whatis { border-radius: 3px; padding: 24px 26px; }
.whatis--is { background: var(--card); border: 1px solid var(--rule); border-left: 3px solid var(--navy); }
.whatis--isnot { background: var(--tint); border: 1px dashed var(--dash); }
.whatis__head { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 16px; }
.whatis__label { font-family: var(--mono); font-size: 10.5px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; }
.whatis--is .whatis__label { color: var(--navy); }
.whatis--isnot .whatis__label { color: var(--slate); }
.whatis__text { font-family: var(--serif); font-size: 16.5px; line-height: 1.6; margin: 0 0 16px; }
.whatis--is .whatis__text { color: var(--ink-3); }
.whatis--isnot .whatis__text { color: var(--ink-4); }
.whatis__specs { display: flex; flex-direction: column; gap: 8px; padding-top: 14px; }
.whatis--is .whatis__specs { border-top: 1px solid var(--rule-2); }
.whatis--isnot .whatis__specs { border-top: 1px solid var(--rule); }
.whatis__spec { display: flex; justify-content: space-between; gap: 12px; }
.whatis__spec-label { font-family: var(--serif); font-size: 14px; }
.whatis__spec-value { font-family: var(--mono); font-size: 13px; text-align: right; }
.whatis--is .whatis__spec-label { color: var(--slate); }
.whatis--is .whatis__spec-value { color: var(--ink); }
.whatis--isnot .whatis__spec-label { color: var(--slate); }
.whatis--isnot .whatis__spec-value { color: var(--slate); }

/* Legal-gauge strip */
.legalgauge { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; background: var(--card); border: 1px solid var(--rule); border-radius: 3px; padding: 15px 20px; margin-top: 18px; }
.legalgauge__badge { flex: none; font-family: var(--mono); font-size: 9.5px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: var(--navy); border: 1px solid var(--underline); border-radius: 2px; padding: 4px 9px; }
.legalgauge__text { flex: 1; min-width: 280px; font-family: var(--serif); font-size: 15.5px; line-height: 1.5; color: var(--ink-3); }

/* Contrast row — "In the headlines" (dashed, tint) vs "Here, on the record"
   (white, navy left border). Emitted by the {% contrast %} shortcode. */
.contrast { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 0 0 18px; }
.contrast__side { border-radius: 3px; padding: 15px 17px; }
.contrast__side--headline { background: var(--tint); border: 1px dashed var(--dash); }
.contrast__side--record { background: var(--card); border: 1px solid var(--rule); border-left: 3px solid var(--navy); }
.contrast__label { font-family: var(--mono); font-size: 9px; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 8px; }
.contrast__side--headline .contrast__label { color: var(--slate); }
.contrast__side--record .contrast__label { color: var(--navy); }
.contrast__text { font-family: var(--serif); font-size: 15px; line-height: 1.5; }
.contrast__side--headline .contrast__text { color: var(--ink-4); }
.contrast__side--record .contrast__text { color: var(--ink-3); }

/* Brief body — a section rule on each ## heading and the closing highlight box.
   Scoped to direct-child h2 so the nested Sources heading keeps its own rule. */
.brief-body > h2 { border-top: 1px solid var(--rule); margin-top: 42px; padding-top: 24px; }
.brief-body > :first-child { margin-top: 0; }
.brief-body blockquote { background: var(--tint); border-left: 3px solid var(--navy); border-radius: 3px; padding: 22px 26px; margin: 28px 0 0; }
.brief-body blockquote p { font-family: var(--serif); font-size: 17px; line-height: 1.6; color: var(--ink-2); margin: 0; }
.brief-body .sources { margin-top: 42px; }
.brief-body .section { margin-top: 28px; margin-bottom: 0; }

/* Briefs on narrow screens: the side-by-side cards and contrast rows stack;
   the legal-gauge text never forces overflow. (The body rail collapses via the
   shared .layout rule.) */
@media (max-width: 880px) {
  .whatis-grid { grid-template-columns: minmax(0, 1fr); }
  .contrast { grid-template-columns: minmax(0, 1fr); }
  .legalgauge__text { min-width: 0; }
  /* The brief's source-list citation link lands at ~42px under the shared
     in-prose rule; nudge it to a full 44px hit area (brief-scoped, so findings'
     shared .article a:not([class]) rule is untouched). Net line box is unchanged
     — the extra padding is cancelled by the equal negative margin. */
  .brief-body .source__text a {
    padding-top: 14px;
    padding-bottom: 14px;
    margin-top: -14px;
    margin-bottom: -14px;
  }
}

/* =========================================================================
   Archive — the full reverse-chron index with Type + Topic filters. Ported
   from the Archive export to tokens. Reuses .type-badge (row type), .topic
   (row topic chips), .mark--documented/--open (proof column). NEW: the filter
   chips, the index grid, and the proof column.
   ========================================================================= */
.archive-filters { border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); padding: 18px 0; margin-bottom: 8px; display: flex; flex-direction: column; gap: 14px; }
.archive-filterrow { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.archive-filterlabel { flex: none; width: 54px; font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--slate); }
.archive-chip { font-family: var(--mono); font-size: 11px; letter-spacing: 0.06em; color: var(--slate); background: var(--card); border: 1px solid var(--rule); border-radius: 2px; padding: 6px 13px; cursor: pointer; }
.archive-chip--type { text-transform: uppercase; }
.archive-chip--topic { letter-spacing: 0.02em; }
.archive-chip:hover { border-color: var(--underline); }
.archive-chip--type.is-active { color: var(--paper); background: var(--navy); border-color: var(--navy); }
.archive-chip--topic.is-active { color: var(--ink); background: var(--tint); border-color: var(--underline); }
.archive-count { font-family: var(--mono); font-size: 10.5px; color: var(--slate); letter-spacing: 0.04em; padding: 14px 0 4px; }

.archive-head { display: grid; grid-template-columns: 110px 104px 1fr 150px; gap: 18px; background: var(--tint); border: 1px solid var(--rule); border-bottom: none; padding: 9px 18px; }
.archive-head > div { font-family: var(--mono); font-size: 9px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--slate); }

.archive-list { border: 1px solid var(--rule); background: var(--card); }
.archive-row { display: grid; grid-template-columns: 110px 104px 1fr 150px; gap: 18px; padding: 18px; border-bottom: 1px solid var(--rule-2); text-decoration: none; color: inherit; align-items: start; }
.archive-row:last-child { border-bottom: 0; }
.archive-row:hover { background: #FBFBFA; }
.archive-row__date { font-family: var(--mono); font-size: 11px; color: var(--slate); padding-top: 2px; }
.archive-row__type { padding-top: 1px; }
.archive-title { font-family: var(--display); font-weight: 600; font-size: 16.5px; line-height: 1.35; letter-spacing: -0.003em; color: var(--ink); margin-bottom: 8px; }
.archive-row__topics { display: flex; gap: 6px; flex-wrap: wrap; }
.archive-row__topics .topic { font-size: 10px; padding: 2px 7px; }
.archive-row__proof { display: flex; flex-direction: column; gap: 6px; padding-top: 2px; }
.archive-proof { display: inline-flex; align-items: center; gap: 6px; font-family: var(--mono); font-size: 9px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; }
.archive-proof .mark { width: 7px; height: 7px; }
.archive-proof--documented { color: var(--navy); }
.archive-proof--open { color: var(--slate); }
.archive-proof--none { font-family: var(--mono); font-size: 11px; color: var(--dot); }
.archive-empty { font-family: var(--serif); font-size: 16px; color: var(--slate); padding: 28px 4px 8px; }

/* Archive on narrow screens: the 4-col grid stacks — [date · type], then
   [title + topics], then [proof] — with NO horizontal scroll. Filters wrap
   already (flex-wrap). */
@media (max-width: 880px) {
  .archive-head { display: none; }
  .archive-row {
    grid-template-columns: auto 1fr;
    grid-template-areas: "date type" "item item" "proof proof";
    gap: 6px 12px;
    row-gap: 12px;
  }
  .archive-row__date { grid-area: date; align-self: center; padding-top: 0; }
  .archive-row__type { grid-area: type; align-self: center; }
  .archive-row__item { grid-area: item; }
  .archive-row__proof { grid-area: proof; flex-direction: row; gap: 14px; padding-top: 0; }
  .archive-filterlabel { width: auto; }
}

/* "How to read this site" — relocated into the About page as its own section. */
.about-howto { border-top: 1px solid var(--rule); margin-top: 48px; padding-top: 40px; }

/* Home feed → archive link, below the 5 latest cards. */
.feed__archive-link {
  display: inline-flex;
  align-items: center;
  margin-top: 22px;
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--navy);
  text-decoration: none;
  border-bottom: 1px solid var(--underline);
  padding-bottom: 2px;
}
.feed__archive-link:hover { border-bottom-color: var(--navy); }

/* =========================================================================
   Agenda preview (rich) + Library document — both built on the shared tokens.
   Reuses .kicker/.h1/.dek/.byline (hero), .statusbox (short-version box),
   .layout/.rail/.toc/.legend + .mark--* (index rail + posture key), .h2/.article
   (item prose), .topic (chips), .extlink (packet links).
   ========================================================================= */

/* Hero pill — outline variant of the filled .kicker (navy on transparent). */
.kicker--outline { background: transparent; color: var(--navy); border: 1px solid var(--underline); }

/* Short-version meeting box: When / Your window / Topics. */
.agenda-meta { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 22px; }
.agenda-meta__val { font-family: var(--serif); font-size: 14.5px; line-height: 1.4; color: var(--ink-3); }
.agenda-meta__sub { font-family: var(--mono); font-size: 11px; color: var(--slate); }

/* Index rail: each row is a label + a mono posture sub-note. */
.agenda-toc__item { display: block; }
.agenda-toc__note { display: block; font-family: var(--mono); font-size: 9px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--slate); margin-top: 3px; }

/* Per-item blocks. First item gets a 2px ink rule; the rest a 1px hairline. */
.agenda-item { border-top: 1px solid var(--rule); padding-top: 22px; margin-bottom: 44px; }
.agenda-item--first { border-top: 2px solid var(--ink); }
.agenda-item:last-of-type { margin-bottom: 8px; }
.agenda-item__head { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.agenda-item__range { font-family: var(--mono); font-size: 12px; font-weight: 600; color: var(--navy); }

/* Posture chips (per item). flagged = filled navy; consent = navy outline;
   notInPacket = dashed grey. Differentiated by FORM as well as fill. */
.agenda-chip { display: inline-flex; align-items: center; gap: 7px; border-radius: 2px; padding: 3px 10px; font-family: var(--mono); font-size: 10px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; }
.agenda-chip--flagged { background: var(--navy); color: var(--paper); padding: 4px 10px; }
.agenda-chip--flagged .agenda-chip__sq { width: 7px; height: 7px; background: var(--paper); display: inline-block; flex: none; }
.agenda-chip--consent { background: var(--card); color: var(--navy); border: 1.5px solid var(--navy); }
.agenda-chip--notinpacket { background: var(--card); color: var(--slate); border: 1.5px dashed var(--mist); }
.agenda-chip--notinpacket .agenda-chip__dot { width: 7px; height: 7px; border: 1.5px solid var(--slate); border-radius: 50%; display: inline-block; flex: none; }

/* Fair-question box — dashed border + mono title; the list reuses the .article
   "open points" dashed bullets, just tightened inside the box. */
.fairq { border: 1px dashed var(--dash); border-radius: 3px; padding: 16px 18px; margin-top: 18px; }
.fairq__title { font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.13em; text-transform: uppercase; color: var(--slate); margin-bottom: 11px; }
.fairq ul { margin: 0; }
.fairq li { font-size: 16.5px; }

/* Participate block — an --ink dark surface (ported from the Agenda Preview
   export, which uses #15191F = --ink). It borrows the nav overlay's translucent
   hairline token for the facts rule. Text colors are tokens that clear AA on
   --ink (--paper / --mist). */
.participate { background: var(--ink); border-radius: 4px; padding: 34px 36px; margin-top: 44px; }
.participate__eyebrow { font-family: var(--mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--mist); margin-bottom: 14px; }
.participate__headline { font-family: var(--display); font-weight: 600; font-size: 24px; line-height: 1.3; letter-spacing: -0.005em; color: var(--paper); margin: 0 0 16px; }
/* Scoped under .participate so the off-white wins over the agenda body's
   `.article p` color rule (which is more specific than a single class). */
.participate .participate__body { font-family: var(--serif); font-size: 18px; line-height: 1.62; color: var(--paper); margin: 0 0 20px; max-width: 600px; }
.participate__facts { display: flex; gap: 24px; flex-wrap: wrap; border-top: 1px solid rgba(250, 250, 248, 0.14); padding-top: 18px; }
.participate__label { font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--mist); margin-bottom: 5px; }
.participate__val { font-family: var(--mono); font-size: 13px; color: var(--paper); }
.participate .participate__closing { font-family: var(--serif); font-size: 16px; font-style: italic; line-height: 1.55; color: var(--mist); margin: 20px 0 0; }

/* Packet sources footer. */
.agenda-sources { border-top: 1px solid var(--rule); margin-top: 44px; padding-top: 18px; }
.agenda-sources .legend__title { margin-bottom: 12px; }
.agenda-sources__links { display: flex; flex-direction: column; gap: 9px; align-items: flex-start; }

/* Library document (resolution year-pages) — the body carries its own h1. */
.library-doc-body h1 { font-family: var(--display); font-weight: 600; font-size: 30px; line-height: 1.2; letter-spacing: -0.008em; color: var(--ink); margin: 0 0 20px; }
/* The wide Index table scrolls inside this focusable wrapper (added by the
   wrapResolutionTables transform) — never the page; the table keeps its
   semantics. overflow-x:auto shows a scrollbar only when it actually overflows
   (so desktop, where the table fits, is unaffected). */
.library-doc-tablewrap { overflow-x: auto; }

@media (max-width: 880px) {
  .agenda-meta { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .participate { padding: 26px 22px; }
}

/* =========================================================================
   Corrections page (/corrections/) — the public, site-wide corrections log
   (aggregated across every item via collections.correctionsLog) plus the
   submit-correction form. Ported from the "Corrections" design export to the
   shared tokens; --navy the only accent. Distinct from the per-item resting
   log (.corrections). Mono labels use --slate (the export's --mute/--mist fail
   WCAG AA at these sizes — same lift as .eyebrow/.legend__title).
   ========================================================================= */
.corrections-page { max-width: 760px; }
.csection { border-top: 1px solid var(--rule); padding-top: 30px; margin-top: 48px; }
.csection--last { margin-bottom: 8px; }

/* Aggregate log table: Date | What changed | On */
.clog { background: var(--card); border: 1px solid var(--rule); border-radius: 3px; overflow: hidden; }
.clog__head { display: grid; grid-template-columns: 120px minmax(0, 1fr) 150px; background: var(--tint); border-bottom: 1px solid var(--rule); }
.clog__h { padding: 9px 16px; font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--slate); }
.clog__row { display: grid; grid-template-columns: 120px minmax(0, 1fr) 150px; border-bottom: 1px solid var(--rule-2); }
.clog__row:last-child { border-bottom: 0; }
.clog__date { padding: 15px 16px; font-family: var(--mono); font-size: 11.5px; color: var(--slate); white-space: nowrap; }
.clog__what { padding: 15px 16px; font-family: var(--serif); font-size: 15px; line-height: 1.5; color: var(--ink-3); min-width: 0; overflow-wrap: anywhere; }
.clog__what strong { font-weight: 600; }
.clog__on { padding: 15px 16px; min-width: 0; }
.clog__on a { font-family: var(--mono); font-size: 11px; color: var(--navy); text-decoration: none; border-bottom: 1px solid var(--underline); overflow-wrap: anywhere; }
.clog__on a:hover { border-bottom-color: var(--navy); }
.clog__on-plain { font-family: var(--mono); font-size: 11px; color: var(--slate); }
.clog__count { font-family: var(--mono); font-size: 11px; color: var(--slate); letter-spacing: 0.03em; margin: 12px 0 0; }

/* Empty state (launch resting state — no sample rows) */
.clog--empty { display: flex; align-items: center; gap: 11px; padding: 18px 22px; }
.clog__empty-text { font-family: var(--serif); font-size: 15px; font-style: italic; color: var(--slate); }

/* Submit-correction card */
.cform__intro { font-family: var(--serif); font-size: 16px; line-height: 1.55; color: var(--slate); margin: 0 0 24px; max-width: 620px; }
.cform { background: var(--card); border: 1px solid var(--rule); border-radius: 3px; padding: 28px 30px; max-width: 680px; }
.cform__field { margin-bottom: 22px; }
.cform__label { display: flex; align-items: baseline; gap: 8px; margin-bottom: 9px; flex-wrap: wrap; }
.cform__label-text { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--slate); }
.cform__label-text--req { color: var(--navy); }
.cform__badge { font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.04em; color: var(--slate); }  /* export used --mist (fails AA); --slate is legible */
.cform__input {
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--chip);
  border-radius: 2px;
  padding: 11px 14px;
  font-family: var(--serif);
  font-size: 15.5px;
  color: var(--ink);
  background: #FCFCFB;
}
.cform__textarea { line-height: 1.5; padding: 12px 14px; resize: vertical; }
.cform__input::placeholder { color: var(--faint); }
.cform__input:focus { outline: none; border-color: var(--navy); box-shadow: 0 0 0 1px var(--navy); }
.cform__hp { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
/* The Turnstile widget is a fixed ~300px iframe (no data-size). On the narrowest
   phones the form card's inner width drops below 300px, so contain it the same
   way wide tables are contained (.vm-tablewrap / .library-doc-tablewrap) — the
   widget scrolls inside its own box rather than forcing horizontal PAGE scroll.
   A scrollbar appears only when the viewport is actually too narrow (≈≤388px);
   wider phones and desktop are unaffected. */
.cform__turnstile { margin-bottom: 22px; overflow-x: auto; }
.cform__actions { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.cform__submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--paper);
  background: var(--navy);
  border: none;
  border-radius: 2px;
  padding: 0 24px;
  cursor: pointer;
  transition: background-color 0.15s ease;
}
.cform__submit:hover { background: var(--ink-2); }
.cform__submit:disabled { opacity: 0.55; cursor: default; }
.cform__reassure { font-family: var(--serif); font-size: 13.5px; font-style: italic; color: var(--slate); }
/* Inline error — on-brand (navy keyline, no red introduced). */
.cform__error { font-family: var(--serif); font-size: 14px; line-height: 1.5; color: var(--ink-2); border-left: 2px solid var(--navy); padding-left: 12px; margin: 18px 0 0; }
/* Thank-you swap */
.cform__thanks { display: flex; align-items: flex-start; gap: 11px; }
/* The mark reuses .correction-none__mark (a hollow "open/unresolved" circle);
   on a SUCCESS confirmation fill it navy — the site's "established/on the
   record" idiom. Scoped so the empty-log resting mark is unaffected. */
.cform__thanks .correction-none__mark { margin-top: 7px; background: var(--navy); border-color: var(--navy); }
.cform__thanks p { font-family: var(--serif); font-size: 16px; line-height: 1.55; color: var(--ink-3); margin: 0; }
.cform__thanks:focus { outline: none; }
/* The `hidden` attribute must always win: .cform__thanks/.cform__error set a
   `display:` (flex / —) that would otherwise beat the UA [hidden] display:none
   and reveal the thank-you (and error) on a fresh load before any submit. This
   (0,2,0) guard sits after the base rules so it wins on specificity + order. */
.cform__thanks[hidden],
.cform__error[hidden] { display: none; }

/* Corrections page on narrow screens: the log table stacks (header hidden, each
   row becomes date · what · on), the form card tightens, and the "On" links get
   a 44px touch target. 0px horizontal overflow at 360/390. */
@media (max-width: 880px) {
  .clog__head { display: none; }
  .clog__row { display: block; padding: 14px 16px; }
  .clog__date { padding: 0; margin-bottom: 6px; }
  .clog__what { padding: 0; margin-bottom: 8px; }
  .clog__on { padding: 0; }
  .clog__on a { display: inline-flex; align-items: center; min-height: 44px; }
  .cform { padding: 22px 20px; }
}