/* ═══ LAUREL DESIGN SYSTEM v1.0 — briefings surface (KEEL v2.2 template) ═══
   Upgraded from the KEEL v1.0 scaffold (PR #136) to LAUREL v1.0 + KEEL v2.2.
   Tokens follow docs/canon/DISCIPLES_DESIGN_MASTER_SPEC.md §1 (LAUREL, C11); figures follow §4 (Switzer + tabular
   figures, NEVER JetBrains Mono). Content contract is docs/canon/MEETING_BRIEFING_SPEC.md §D/§E (C38, absorbing KEEL).
   DEPLOYED: serves /briefings (+detail), linked from the tab registry
   (tabs.js). The old "static fixture, not deployed" note predated the
   briefings launch and was stale — corrected D-FABLE-CC2-BUNDLE-2 Unit H. */
:root{
  /* ── SURFACES (LAUREL §1) ── */
  --bg:#161A14; --surface:#1E2419; --elevated:#252D20; --border:#2C3325;
  /* ── TEXT ── */
  --text:#E3DFD3; --text-2:#A39E90; --text-3:#635F54;
  /* ── ACCENT (sage green — NOT amber, NOT gold) ── */
  --accent:#8BAF80; --accent-2:#B8C4AE; --bronze:#9C8A6A;
  /* ── SEMANTIC STATE ── */
  --danger:#B07272;   /* LOSSES ONLY */
  --warning:#C4A55A;  /* unresolved / contested / NOT CONVERGED / Class-4 horizon */
  /* ── DEEP FIELD ── */
  --indigo:#1A1B4B; --twilight:#2A3168;
  /* ── GEOMETRY ── */
  --r:10px;
  /* ── TYPEFACES ── */
  --font-hero:'Satoshi',system-ui,sans-serif;   /* display, headlines, titles */
  --font-body:'Switzer',system-ui,sans-serif;   /* body, labels, annotations, FIGURES */
  /* no --font-mono: FOUNDER LAW 2026-08-04 — no monospace on any Disciples surface */
  /* ── DEPRECATED ALIASES (back-compat with the live :root) — do not use in new rules ── */
  --amber:var(--accent); --gold:var(--accent-2); --healthy:var(--accent); --info:var(--text-2);
}
*{margin:0;padding:0;box-sizing:border-box}
body{color:var(--text-2);font-family:var(--font-body);
  font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
.page{max-width:940px;margin:0 auto;padding:64px 32px 96px}

/* ── NUMERALS (LAUREL §4): Switzer + tabular figures — NEVER mono ──
   §4.2 probe (2026-07-23, direct font-binary read of the Fontshare Switzer TTF):
   the webfont declares NO `tnum` OpenType feature, but its default digit glyphs are
   already uniform-width (all ten = 576/1000 em at 400 & 500), so numeric columns align
   natively and `tabular-nums` is a harmless progressive-enhancement no-op here.
   .fig-cell adds the §4.2 fixed-width fallback where a column must align independent of
   glyph metrics. Mono was NOT used as a fallback (that would be an §0.4 defect). */
.fig{font-family:var(--font-body);font-variant-numeric:tabular-nums;letter-spacing:.01em}
.fig-cell{display:inline-block;text-align:right;
  font-family:var(--font-body);font-variant-numeric:tabular-nums;letter-spacing:.01em}

/* ── masthead (BriefingMasthead) — LAUREL §6.5 ──
   The wordmark treatment is the SHARED /wordmark.css component
   (D-CC2-WATCHLIST-UI-BATCH-1 item 1): briefings.js puts class="wordmark" on
   the h1; the old local gradient copy is gone so the three headers can never
   drift again. */
.mast{text-align:center;margin-bottom:56px}
.mast .tag{font-family:var(--font-body);font-weight:500;font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--text-3);margin-top:12px}
.mast .hr{width:64px;height:1px;background:var(--border);margin:26px auto 0}

.editionbar{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:26px}
.editionbar .lbl{font-family:var(--font-body);font-weight:500;font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--text-3)}
/* Edition selector — LAUREL §6.6: Switzer label + styled native <select> ── */
.selwrap{position:relative;display:inline-block}
.selwrap select{appearance:none;-webkit-appearance:none;
  font-family:var(--font-body);font-size:13px;color:var(--text);
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r);
  padding:10px 40px 10px 18px;cursor:pointer;line-height:1.2}
.selwrap select:hover{border-color:var(--accent)}
.selwrap::after{content:'';position:absolute;right:16px;top:50%;
  width:7px;height:7px;border-right:1.5px solid var(--text-3);
  border-bottom:1.5px solid var(--text-3);transform:translateY(-70%) rotate(45deg);
  pointer-events:none}
.selwrap select option{background:var(--surface);color:var(--text)}

/* ── attendee presence line — replaces MembersTabNav (D-FABLE-BRIEFINGS-POLISH-1).
   The old .mtabs buttons carried hover/active affordances (borrowed from LAUREL
   §6.13 Tab nav) with no behavior behind them — per-member views never existed.
   Presence is a stated fact: label + names, §6.7 label grammar, nothing
   interactive, nothing implied. */
.presence{display:flex;justify-content:center;align-items:baseline;gap:12px;
  margin-top:18px;flex-wrap:wrap}
.presence .plbl{font-family:var(--font-body);font-weight:500;font-size:10px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--text-3)}
.presence .pnames{font-family:var(--font-body);font-weight:500;font-size:12px;
  letter-spacing:.04em;text-transform:uppercase;color:var(--text-2)}
.presence .psep{color:var(--text-3)}

/* ── cards ── */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);
  padding:28px 32px;margin-bottom:22px}
/* Eyebrow — LAUREL §6.1: Switzer, 11px, .18em, --accent, uppercase (NOT mono) */
.eyebrow{font-family:var(--font-body);font-weight:500;font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--accent);margin-bottom:18px}
/* Pill badge — LAUREL §6.2 (font-body) */
.pill{display:inline-block;font-family:var(--font-body);font-weight:500;font-size:10.5px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--accent);
  background:rgba(139,175,128,.10);border:1px solid rgba(139,175,128,.28);
  border-radius:6px;padding:4px 10px}

/* Headline — LAUREL §6.3: Satoshi 700 29px, sentence case */
h2{font-family:var(--font-hero);font-weight:700;font-size:29px;letter-spacing:-.015em;
  color:var(--text);line-height:1.2;margin:14px 0 18px}
.sec{margin-top:56px}
p{margin-bottom:15px}
p:last-child{margin-bottom:0}
strong{color:var(--text);font-weight:600}
.lede{font-size:17.5px;line-height:1.65;color:var(--text)}

/* ── SessionStats — LAUREL §6.7: a large figure ABOVE an uppercase label ── */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.stats .stat{display:flex;flex-direction:column;gap:5px}
.stats .v{font-family:var(--font-body);font-variant-numeric:tabular-nums;letter-spacing:.01em;
  color:var(--text);font-size:26px;line-height:1}
.stats .k{font-family:var(--font-body);font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--text-3)}

/* ── RoomThread — LAUREL §6.8 ── */
.thread{display:grid;grid-template-columns:38px 1fr;gap:18px;
  padding:22px 0;border-top:1px solid var(--border)}
.thread:first-of-type{border-top:0;padding-top:6px}
.thread .n{font-family:var(--font-body);font-weight:700;font-size:12px;
  font-variant-numeric:tabular-nums;letter-spacing:.01em;color:var(--accent);padding-top:5px}
.thread h3{font-family:var(--font-hero);font-weight:500;font-size:18px;color:var(--text);
  letter-spacing:-.01em;margin-bottom:4px}

/* annotation lines + room-status verdicts — body face, NOT mono (LAUREL §3.1) */
.anno{font-family:var(--font-body);font-weight:500;font-size:11.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--text-3);margin-bottom:11px}
.verdict{margin-top:11px;font-family:var(--font-body);font-weight:400;font-size:12px;
  letter-spacing:.05em;color:var(--text-3)}
.verdict .k{text-transform:uppercase;letter-spacing:.12em;font-size:11.5px}
.verdict b{font-weight:600;text-transform:uppercase;letter-spacing:.09em;
  color:var(--warning)}
.verdict.agreed b{color:var(--accent)}
.verdict.scored b{color:var(--accent-2)}

/* Bullets — LAUREL §6.4: ✦ diamond in --accent */
ul.pts{list-style:none}
ul.pts li{position:relative;padding-left:22px;margin-bottom:8px;font-size:15px;
  line-height:1.62}
ul.pts li::before{content:'✦';position:absolute;left:0;top:0;color:var(--accent);
  font-size:11px;line-height:1.85}
ul.pts li:last-child{margin-bottom:0}

/* ── ThesisDiagram — LAUREL §6.12 ── */
.thesis{background:var(--elevated);border:1px solid var(--border);border-radius:var(--r);
  padding:24px;margin:22px 0 4px}
.tgrid{display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:center}
.tcol .cap{font-family:var(--font-body);font-weight:500;font-size:10.5px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);margin-bottom:9px}
.tcol .tks{display:flex;flex-wrap:wrap;gap:6px}
/* tickers — LAUREL §4.1: Switzer 500, .04em, --text (NOT mono) */
.tks span{font-family:var(--font-body);font-weight:500;font-size:11.5px;letter-spacing:.04em;
  color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:5px;
  padding:4px 8px}
.tcol.r{text-align:right}
.tcol.r .tks{justify-content:flex-end}
.tmid{text-align:center;padding:0 4px}
.tmid .wall{width:1px;height:34px;background:var(--accent);opacity:.5;margin:0 auto}
.tmid .lab{font-family:var(--font-body);font-weight:500;font-size:10px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin:8px 0;
  white-space:nowrap}
.tfoot{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:16px;
  padding-top:14px;border-top:1px solid var(--border);font-size:13.5px;color:var(--text-3)}
.tfoot div:last-child{text-align:right}

/* ── POSITIONS / WatchlistBand — LAUREL §6.11 banded list, KEEL §4 four fields + R7 ── */
.wl{margin-top:6px}
.wlband{display:flex;align-items:baseline;gap:10px;margin:24px 0 6px}
.wlband .l{font-family:var(--font-body);font-weight:500;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--text-3)}
/* count is band.rows.length — same array rendered below (R2 provenance carve-out) */
.wlband .c{font-family:var(--font-body);font-variant-numeric:tabular-nums;font-size:10.5px;
  letter-spacing:.01em;color:var(--text-3);margin-left:auto}
/* four fields: TICKER · THESIS · HOLDER · HORIZON (KEEL §4) */
.wr{display:grid;grid-template-columns:66px minmax(0,1fr) 92px minmax(122px,auto);
  gap:14px;align-items:baseline;padding:12px 0;border-top:1px solid var(--border)}
.wr .tk{font-family:var(--font-body);font-weight:500;font-size:13px;letter-spacing:.04em;
  color:var(--text);font-variant-numeric:tabular-nums}
.wr .th{font-size:14.5px;line-height:1.5}
.wr .th .instr{display:block;font-size:11.5px;color:var(--text-3);margin-top:3px;
  letter-spacing:.02em}
.wr .who{font-family:var(--font-body);font-size:11.5px;color:var(--text-3);white-space:nowrap}
.wr .hzcell{justify-self:end;text-align:right}

/* ── HORIZON provenance (KEEL R7.2) — the class marker is adjacent, distinct, NOT optional ── */
.hz{font-family:var(--font-body);font-size:12.5px;color:var(--text);
  font-variant-numeric:tabular-nums;display:inline-flex;flex-wrap:wrap;align-items:baseline;
  justify-content:flex-end;gap:6px}
/* Class 1 STATED — verbatim, no marker (R7.2 "none needed") */
.hz-stated{color:var(--text)}
/* Class 2 DERIVED / Class 3 REASONED markers — body face, --text-3, immediately beside the
   value, visually distinct so a reader never mistakes them for the member's own words (R7.3.3) */
.hzmark{font-family:var(--font-body);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--text-3);white-space:nowrap}
.m-contract{border:1px solid var(--border);border-radius:5px;padding:2px 6px}     /* R7.2 class 2 */
.m-model{font-style:normal}                                                        /* R7.3.3 class 3 */
.m-model::before{content:'· '}
/* Class 4 UNRESOLVED — literal string in --warning (R7.2) */
.hz-unresolved{color:var(--warning);font-weight:500;font-size:11px;letter-spacing:.05em;
  text-transform:uppercase}

/* ── LessonBlock — LAUREL §6.10 elevated block ── */
.lesson{background:var(--elevated);border:1px solid var(--border);
  border-left:2px solid var(--accent);border-radius:var(--r);padding:26px 30px}
.lesson p{font-size:17px;line-height:1.7;color:var(--text)}

/* ── UnsettledList ── */
.q{padding:16px 0;border-top:1px solid var(--border)}
.q:first-of-type{border-top:0;padding-top:4px}
.q .head{font-family:var(--font-hero);font-weight:500;font-size:16px;color:var(--text);
  line-height:1.45}
.q .note{font-size:14px;line-height:1.6;color:var(--text-3);margin-top:5px}

/* ── DocketList ── */
.dk{display:grid;grid-template-columns:104px 1fr;gap:18px;padding:14px 0;
  border-top:1px solid var(--border)}
.dk:first-of-type{border-top:0;padding-top:4px}
.dk .when{font-family:var(--font-body);font-variant-numeric:tabular-nums;letter-spacing:.01em;
  font-size:11.5px;color:var(--accent);padding-top:2px}
.dk .what{font-size:15px;color:var(--text);font-weight:500}
/* .why/.desc are <span>s in the server renderer — without display:block the
   margin-top is inert and the note runs flush into the title on one line
   (measured on the R7.5-derived rows, D-FABLE-BRIEFINGS-V3-3). CSS-only fix:
   no HTML byte moves, the i18n parity law is untouched. */
.dk .why{display:block;font-size:13.5px;line-height:1.55;color:var(--text-3);margin-top:3px}

/* ── NextList ── */
.nx{display:grid;grid-template-columns:150px 1fr;gap:18px;padding:18px 0;
  border-top:1px solid var(--border)}
.nx:first-of-type{border-top:0;padding-top:4px}
.nx .own{font-family:var(--font-body);font-weight:500;font-size:11.5px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.nx .task{font-family:var(--font-hero);font-weight:500;font-size:16.5px;color:var(--text)}
.nx .desc{display:block;font-size:14px;line-height:1.6;color:var(--text-3);margin-top:4px}

/* ── index list — BLURB-FIRST (D-FABLE-BRIEFINGS-V3-3, §D). The entry's
   header IS its one-line blurb (Satoshi, the reading line); the date is
   metadata beneath in the §6.7 label grammar. The old 120px date column,
   the repeated product-name title (.et) and the trailing .eblurb died with
   the format. ── */
.elist{margin-top:10px}
.erow{display:block;padding:22px 0;
  border-top:1px solid var(--border);text-decoration:none;color:inherit}
.erow:first-of-type{border-top:0;padding-top:8px}
.erow .eh{display:block;font-family:var(--font-hero);font-weight:500;font-size:19px;
  line-height:1.45;letter-spacing:-.01em;color:var(--text);max-width:62ch}
.erow:hover .eh{color:var(--accent)}
.erow .emeta{display:flex;align-items:baseline;gap:8px;margin-top:8px;
  font-family:var(--font-body);font-weight:500;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--text-3);font-variant-numeric:tabular-nums}
.erow .emeta .nomark{color:var(--warning)}

/* ── NO MEETING card (D-CC2-BRIEFINGS-V2-1 item 2) — witty line + a finance
   fact, no stat scaffolding. --warning is the house color for typed-absence
   / provenance states; the reason line reuses it, the line/fact are plain
   text. ── */
.nomeet .line{font-size:17px;line-height:1.7;color:var(--text)}
.nomeet .fact{font-size:14px;line-height:1.65;color:var(--text-3);margin-top:12px}
.nomeet .reason{margin-top:14px;color:var(--warning);font-weight:500;font-size:11px;
  letter-spacing:.05em;text-transform:uppercase}

/* ── empty / error states (KEEL R1: operational defects never render) — LAUREL §6.14 ── */
.empty{color:var(--text-2);padding:40px 0;text-align:center;font-size:14.5px}
/* LAUREL §2 / §0 trap #3: --danger is LOSSES ONLY, never an error state. The error variant
   is distinguished by its copy ("… Please refresh"), not by a danger tint (§7). */
.empty.err{color:var(--text)}

/* Footer — LAUREL §6.15 */
footer{margin-top:64px;padding-top:20px;border-top:1px solid var(--border);
  font-family:var(--font-body);font-weight:500;font-size:11.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--text-3);text-align:center}

@media (max-width:720px){
  .page{padding:40px 18px 64px}
  .card{padding:22px 20px}
  h2{font-size:24px}
  .thread{grid-template-columns:1fr;gap:6px}
  .thread .n{padding-top:0}
  .tgrid{grid-template-columns:1fr;gap:16px}
  .tcol.r,.tcol.r .tks{text-align:left;justify-content:flex-start}
  .tmid .wall{height:1px;width:40px}
  .tfoot{grid-template-columns:1fr}
  .tfoot div:last-child{text-align:left}
  /* POSITIONS row stacks; horizon left-aligns under the thesis (R7.1 row still whole) */
  .wr{grid-template-columns:1fr;gap:4px}
  .wr .hzcell{justify-self:start;text-align:left}
  .hz{justify-content:flex-start}
  .dk,.nx{grid-template-columns:1fr;gap:3px}
  .stats{grid-template-columns:repeat(2,1fr)}
  /* item A3 (D-CC2-MOBILE-UI-BATCH-2): the edition bar wraps rather than
     squeezing the native select (LAUREL §6.6 keeps the native control). The
     44px member-tab rule died with the tabs (D-FABLE-BRIEFINGS-POLISH-1) —
     the presence line is not a touch target. */
  .editionbar{flex-wrap:wrap;gap:8px 12px}
  /* the native edition select measured 37px in-engine at 390px — LAUREL §6.6
     keeps the native control, so it gets the height rather than a replacement */
  .selwrap select{min-height:44px}
  /* the index list and the docket are the only tappable rows on these pages */
  .erow{padding:14px 0;min-height:44px}
}

/* ═══ PHONE VIEW — D-CC2-MOBILE-UI-BATCH-2 item A ═══
   The 720px tier above already collapses every multi-column grid, so the phone
   tier is about AIR, not structure: at 390px the page gutter, the card padding
   and the elevated blocks were still carrying desktop values, and .lesson /
   .thesis never dropped their padding at all — the lesson block was 22px
   narrower inside than the card that follows it. 560px is the same restructure
   line the watchlist surface uses, so the site has two numbers, not five. */
@media (max-width:560px){
  .page{padding:32px 14px 56px}
  .card{padding:18px 16px}
  h2{font-size:21px;margin:12px 0 14px}
  .sec{margin-top:40px}
  .lede{font-size:16px}
  .mast{margin-bottom:38px}
  /* .lesson and .thesis kept desktop padding through the 720 tier */
  .lesson{padding:20px 18px}
  .lesson p{font-size:15.5px}
  .thesis{padding:18px}
  .stats{gap:14px}
  .stats .v{font-size:23px}
  .wr{padding:14px 0}
  .dk,.nx{padding:14px 0;gap:3px}
  footer{margin-top:44px;letter-spacing:.06em}
}

/* Guard rail at EVERY width: every string on this page is innerHTML out of the
   briefing payload — thesis text, lesson prose, docket copy. One long unbroken
   token used to push the page sideways with nothing to catch it. */
.lede,.q .head,.q .note,.dk .what,.dk .why,.nx .task,.nx .desc,.wr .th,
.erow .eh,.erow .emeta,.lesson p,.verdict,.anno,p{overflow-wrap:anywhere}
img{max-width:100%;height:auto}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
*:focus-visible{outline:1px solid var(--accent);outline-offset:2px}

/* ══════════════════════════════════════════════════════════════════════════
   D-FABLE-BRIEFINGS-E2E-1 — server-rendered surface additions.
   Tokens only, no new palette values, no monospace (LAUREL v1.1 struck the
   last carve-out). Every rule below exists because the server renderer can
   now render a state the client scaffold never could.
   ══════════════════════════════════════════════════════════════════════════ */

/* TYPED ABSENCE (MEETING_BRIEFING_SPEC §I completeness). The scaffold
   interpolated raw payload values, so an absent thesis, holder, owner or due
   date rendered as a blank cell or the word "undefined" — a silent drop
   wearing the costume of a rendered row. Every non-key field now renders its
   value or a labelled gap, in the same --warning treatment Class-4 horizons
   already use, so the two read as one grammar rather than two conventions. */
.absent{color:var(--warning);font-weight:500;letter-spacing:.05em;
  text-transform:uppercase;font-size:11px}
.wr .th .absent,.wr .who .absent{font-size:11px}
.nx .own .absent{font-size:10.5px}
/* A missing SESSION figure keeps the figure's size so the four-cell grid does
   not reflow around the gap (§D "four figures only"). */
.stats .v.absent{font-size:inherit;letter-spacing:.01em;text-transform:none}

/* NOSCRIPT edition list. The <select> needs script to navigate; these are the
   same editions as real links, so the surface stays navigable with JS off. */
.ednav{display:block;margin-top:10px;font-size:13px;color:var(--text-2)}
.ednav a{color:var(--text-2);text-decoration:none;border-bottom:1px solid var(--border)}
.ednav a:hover{color:var(--text)}

/* UNSETTLED settled-since tag (§H: `settledTag` marks a question resolved
   since the session). Bound in the payload contract, never rendered before. */
.q .head .settled{margin-left:8px;font-family:var(--font-body);font-size:9.5px;
  letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);
  border:1px solid var(--border);border-radius:5px;padding:2px 6px;white-space:nowrap}

/* MEASURE CONTROL — transferred from the watchlist surface, the most recently
   hardened page in the repo, which caps every prose run (.lede 64ch, .claim
   68ch, .falsif 52ch). Briefings capped nothing, so lede and lesson prose ran
   the full ~876px content box, well past the comfortable reading measure.
   Caps only; no font, colour or spacing token changes. */
.lede{max-width:64ch}
.lesson p{max-width:68ch}
.q .note,.dk .why,.nx .desc{max-width:72ch}

/* ══════════════════════════════════════════════════════════════════════════
   D-FABLE-BRIEFINGS-V3-3 — THIS WEEK IN MARKET HISTORY (§SECTION-LAW).
   The one section that is not a record of the room, and it reads that way:
   a bronze dateline (the archival register), a claim-shaped headline, a
   pull-quote rail when the record left one, a single lesson line on the
   accent rail THE LESSON already owns, and the recurring sign-off. Tokens
   only — bronze is the house archival color, accent stays the room's. ── */
.histdateline{font-family:var(--font-body);font-weight:600;font-size:11.5px;
  letter-spacing:.24em;text-transform:uppercase;color:var(--bronze);margin-top:14px}
.history h2{margin-top:8px}
.histbody{max-width:68ch;font-size:15.5px;line-height:1.68;color:var(--text)}
.pull{border-left:2px solid var(--bronze);margin:20px 0;padding:4px 0 4px 20px;
  font-family:var(--font-hero);font-weight:500;font-size:17.5px;line-height:1.5;
  letter-spacing:-.01em;color:var(--text);max-width:56ch}
.pull .attr{display:block;margin-top:8px;font-family:var(--font-body);font-weight:500;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-3)}
.histlesson{border-left:2px solid var(--accent);background:var(--surface);
  border-radius:0 var(--r) var(--r) 0;margin-top:20px;padding:16px 20px;
  font-size:15.5px;line-height:1.6;color:var(--text);max-width:68ch}
.histbody,.histlesson,.pull{overflow-wrap:anywhere}
.signoff{margin-top:16px;font-family:var(--font-body);font-weight:500;font-size:11px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--bronze)}
@media (max-width:560px){
  .pull{font-size:16px;padding-left:16px}
  .histlesson{padding:14px 16px}
}

/* ═══ PHONE TYPE FLOOR (MOBILE-SITE-1) — ≤720px only; the ≥721px briefing is
   unchanged. The 720/560 tiers above already stack every grid (positions,
   docket, next, thesis diagram); what a 390px reader still met was 9.5–11px
   tracked labels and meta lines. Labels step up to 12px, meta to 12.5–13px,
   reading text stays where it was (15–17px). Long thread points clamp to four
   lines with More / Less through reading-tools.js (data-clamp, set by
   lib/briefings/render_page.js). ═══ */
@media (max-width:720px){
  .mast .tag,.editionbar .lbl,.presence .plbl,.eyebrow,.stats .k,.pill,
  .anno,.verdict .k,.tcol .cap,.tmid .lab,.wlband .l,.wlband .c,.nx .own,
  .erow .emeta,.nomeet .reason,.absent,.wr .th .absent,.wr .who .absent,
  .nx .own .absent,.hz-unresolved,.hzmark,.q .head .settled,.pull .attr,
  .signoff,.histdateline,footer{font-size:12px}
  .tks span,.wr .th .instr,.wr .who,.dk .when{font-size:12.5px}
  .selwrap select{font-size:16px}
  .verdict{font-size:13px}
  ul.pts li{font-size:15.5px}
}