/* =====================================================================
   fp1.css — First Principles First
   Design system, revision 2026-09.

   Direction: an instrument record, not a marketing site. The page reads
   as a spec sheet — hairline rules, a strict left-aligned grid, labels in
   the margin, zero corner radius. Colour is semantic and never decorative:
   the only saturated values on the page carry a grade, a state or an
   accountability class.

   Palette   pale cool stone ground, deep petrol ink, institutional green.
   Type      Archivo for headings and interface, Source Serif 4 for reading,
             system mono for notation only (IDs, DOIs, schema paths).

   Mono is notation, not branding. Institutional data — dates, grades,
   confidence, thresholds, percentages — is Archivo with tabular figures.
   ===================================================================== */

:root{
  /* ground and surface */
  --bg:#E9EAE7; --ground:#E9EAE7; --panel:#FFFFFF; --paper:#FFFFFF;
  --sunk:#E0E2DE;

  /* ink */
  --ink:#10171C;
  --t1:rgba(16,23,28,.95); --t2:rgba(16,23,28,.79); --t3:rgba(16,23,28,.56);
  --edge:rgba(16,23,28,.16); --hair:rgba(16,23,28,.085);

  /* semantic colour. Nothing here is used for decoration. */
  --accent:#2E7D63;        /* institutional green: verified, live, accountable */
  --coral:#2E7D63;         /* legacy alias */
  --accent-ink:#1B4D3E;
  --coral-ink:#1B4D3E;     /* legacy alias */
  --ochre:#B8862B;         /* caution, rule-based, contested */
  --gold:#B8862B;          /* legacy alias */
  --ochre-ink:#7A5A12;
  --gold-ink:#7A5A12;      /* legacy alias */
  --brick:#A03328;         /* unsupported, attention */

  /* type */
  --ui:'Archivo',-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  --sans:'Source Serif 4',Georgia,'Times New Roman',serif;          /* reading */
  --serif:'Archivo',-apple-system,'Segoe UI',Helvetica,sans-serif;  /* headings */
  /* Notation only: claim IDs, DOIs, arXiv refs, schema. Never labels or dates. */
  --mono:ui-monospace,SFMono-Regular,'SF Mono',Menlo,Consolas,monospace;
  /* Institutional data + labels. Archivo with tabular figures. */
  --data:'Archivo',-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  --read:760px;

  --wrap:1040px;
  --wrap-system:1200px;
  --r:0px;
  --r-app:4px;   /* only for depicted application UI */
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:76px}
body{margin:0;background:var(--bg);color:var(--t1);font-family:var(--sans);
     font-size:17.5px;line-height:1.62;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent-ink);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
em{font-style:italic}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px}
.wrap-narrow{max-width:660px;margin:0 auto;padding:0 32px}
.wrap-system{max-width:var(--wrap-system);margin:0 auto;padding:0 32px}
@media(max-width:600px){.wrap,.wrap-narrow,.wrap-system{padding:0 20px}}

/* ---------------------------------------------------------------- nav -- */
.site-nav{border-bottom:1px solid var(--ink);position:sticky;top:0;z-index:50;
          background:var(--bg);padding:0;height:auto;display:block}
.site-nav-in{max-width:var(--wrap);margin:0 auto;padding:17px 32px;display:flex;
             align-items:center;justify-content:space-between;gap:24px}
.site-nav-in.wide{max-width:var(--wrap-system)}
@media(max-width:600px){.site-nav-in{padding:12px 20px}}
.brand{display:flex;align-items:center;gap:13px;text-decoration:none;padding-right:18px}
.brand:hover{text-decoration:none}
.brand-logo{width:29px;height:29px;flex-shrink:0;display:block;color:var(--ink)}
.brand-mark{font-family:var(--ui);font-weight:700;font-size:15px;color:var(--ink);
            letter-spacing:-.018em;line-height:1.1;border-left:1px solid var(--edge);padding-left:13px}
.brand-sub{font-family:var(--data);font-size:11px;font-weight:600;letter-spacing:.085em;
           text-transform:uppercase;color:var(--t3)}
.nav-links{display:flex;gap:26px;font-family:var(--ui);font-size:13.5px;font-weight:500}
.nav-links a{color:var(--t2);padding-bottom:2px;border-bottom:1px solid transparent}
.nav-links a:hover{color:var(--ink);text-decoration:none;border-bottom-color:var(--accent)}

.nav-toggle{display:none;background:none;border:0;padding:8px;margin:-8px -4px -8px 0;
            cursor:pointer;align-items:center;justify-content:center}
.nav-toggle svg{width:22px;height:22px;stroke:var(--ink);stroke-width:1.6;stroke-linecap:square;fill:none;display:block}
.nav-toggle .x{display:none}
.site-nav.open .nav-toggle .bars{display:none}
.site-nav.open .nav-toggle .x{display:block}
@media(max-width:900px){
  .nav-toggle{display:flex}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;
             gap:0;background:var(--bg);border-bottom:1px solid var(--ink);padding:4px 0 10px}
  .site-nav.open .nav-links{display:flex}
  .nav-links a{padding:13px 32px;font-size:16px;border-bottom:1px solid var(--hair)}
  .nav-links a:last-child{border-bottom:none}
}
@media(max-width:600px){.nav-links a{padding:13px 20px}}

/* -------------------------------------------------------- typography -- */
h1,h2,h3,h4{font-family:var(--serif);color:var(--ink);font-weight:600;margin:0;
            letter-spacing:-.022em;text-wrap:balance}
h1{font-size:clamp(2.15rem,5.2vw,3.6rem);line-height:1.02;letter-spacing:-.034em;
   margin-top:18px;max-width:19ch}
h2{font-size:clamp(1.6rem,3.4vw,2.3rem);line-height:1.08;letter-spacing:-.028em;max-width:24ch}
h3{font-size:1.1rem;line-height:1.28;font-weight:600;letter-spacing:-.012em}
h4{font-size:.95rem;font-weight:600}

/* Section mark: a rule and a small monospaced label, in place of the
   tracked-out marketing eyebrow. Reads as a spec sheet, not a banner. */
.eyebrow{font-family:var(--data);font-size:11.5px;font-weight:600;letter-spacing:.085em;
         text-transform:uppercase;color:var(--t3);display:block;padding-top:13px;
         border-top:1px solid var(--ink);width:fit-content;min-width:150px;position:relative}
/* threshold notation: the recurring FP1 mark. A rule, and a tick where it is crossed. */
.eyebrow::before{content:"";position:absolute;left:0;top:-4px;width:2px;height:9px;background:var(--accent)}
.thr-rule{position:relative;border-top:1px solid var(--ink)}
.thr-rule::before{content:"";position:absolute;left:0;top:-4px;width:2px;height:9px;background:var(--accent)}
/* provenance spine: a record's fields hang off one line, ticked where graded */
.spine{position:relative;padding-left:26px}
.spine::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:1px;background:var(--edge)}
.spine > .claim-field{position:relative}
.spine > .claim-field::before{content:"";position:absolute;left:-26px;top:20px;width:9px;height:1px;background:var(--edge)}
.spine > .claim-field.is-graded::before{background:var(--accent);height:2px;top:19px;width:13px}

.dek{font-size:19.5px;line-height:1.58;color:var(--t2);max-width:56ch;margin-top:20px}
.sub{font-size:17px;line-height:1.64;color:var(--t2);max-width:62ch;margin-top:14px}
section{padding:72px 0;border-top:1px solid var(--edge)}
@media(max-width:700px){section{padding:48px 0}}
.hero{padding:72px 0 56px;border-top:none}
@media(max-width:700px){.hero{padding:44px 0 36px}}
@media(max-width:700px){.hero>.hero-inner{padding-left:24px;padding-right:24px}}
.meta{font-family:var(--data);font-size:12px;color:var(--t3);margin-top:26px;
      padding-top:14px;border-top:1px solid var(--hair)}

/* ------------------------------------------------------------ buttons -- */
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border:1px solid var(--ink);
     border-radius:var(--r);background:var(--ink);color:#fff;font-family:var(--ui);
     font-size:14px;font-weight:600;letter-spacing:-.005em;cursor:pointer;
     transition:background .14s,color .14s,border-color .14s}
.btn:hover{background:var(--accent-ink);border-color:var(--accent-ink);color:#fff;text-decoration:none}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--edge)}
.btn-ghost:hover{background:transparent;color:var(--accent-ink);border-color:var(--accent-ink)}
.btn-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}

/* ------------------------------------------------------ cards + grids -- */
.card{background:var(--panel);border:1px solid var(--edge);border-radius:var(--r);
      padding:30px 32px;margin-top:26px;box-shadow:none}
.card-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.card-title{font-family:var(--data);font-size:11.5px;font-weight:500;letter-spacing:.085em;
            text-transform:uppercase;color:var(--t2)}
.card-note{font-family:var(--data);font-size:11.5px;color:var(--t3)}

.grid{display:grid;gap:1px;margin-top:30px;background:var(--edge);border:1px solid var(--edge)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.grid-3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.grid-2,.grid-3{grid-template-columns:1fr}}
.tile{background:var(--panel);border:none;border-radius:var(--r);padding:26px 28px;
      transition:background .14s;display:block}
a.tile:hover{background:var(--sunk);text-decoration:none;transform:none}
.tile-kicker{font-family:var(--data);font-size:11px;font-weight:600;letter-spacing:.085em;
             text-transform:uppercase;color:var(--t3)}
.tile-title{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--ink);
            margin:10px 0 8px;line-height:1.22;letter-spacing:-.018em}
.tile-body{font-size:15.5px;line-height:1.58;color:var(--t2)}
.tile-more{display:inline-block;margin-top:14px;font-family:var(--ui);font-size:13px;
           font-weight:600;color:var(--accent-ink);border-bottom:1px solid var(--accent);padding-bottom:1px}

/* ------------------------------------------------------------- stats -- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:26px;
       background:var(--edge);border:1px solid var(--edge);border-radius:var(--r);overflow:hidden}
@media(max-width:680px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat{background:var(--panel);padding:20px 22px}
.stat-label{font-family:var(--data);font-size:11px;font-weight:600;letter-spacing:.085em;
            text-transform:uppercase;color:var(--t3)}
.stat-value{font-family:var(--data);font-size:30px;font-weight:500;color:var(--ink);
            line-height:1;margin-top:10px;font-variant-numeric:tabular-nums}
.stat-value .accent{color:var(--accent-ink)}
.stat-value small{font-size:13px;color:var(--t3);margin-left:4px}

/* ------------------------------------------------------------ roster -- */
.roster{margin-top:26px;border-top:2px solid var(--ink)}
.roster-row{display:grid;grid-template-columns:200px 1fr;gap:32px;padding:22px 0;
            border-bottom:1px solid var(--hair);align-items:baseline}
.roster-name{font-family:var(--serif);font-size:17px;font-weight:600;color:var(--ink);
             line-height:1.2;letter-spacing:-.018em}
.roster-role{font-family:var(--data);font-size:11px;font-weight:600;letter-spacing:.085em;
             text-transform:uppercase;color:var(--t3);margin-top:5px}
.roster-body{font-size:16px;line-height:1.6;color:var(--t2);max-width:62ch}
@media(max-width:720px){.roster-row{grid-template-columns:1fr;gap:8px;padding:18px 0}}

/* ---------------------------------------------------------- numbered -- */
.numbered{margin-top:26px;border-top:2px solid var(--ink)}
.num-row{display:flex;gap:24px;padding:20px 0;border-bottom:1px solid var(--hair);align-items:baseline}
.num-idx{flex:0 0 40px;font-family:var(--data);font-size:16px;font-weight:500;color:var(--t3)}
.num-main{flex:1}
.num-title{font-family:var(--serif);font-size:17px;font-weight:600;color:var(--ink);letter-spacing:-.015em}
.num-body{font-size:15px;line-height:1.58;color:var(--t2);margin-top:4px;max-width:70ch}
.num-tag{flex:0 0 auto;text-align:right;font-family:var(--data);font-size:11.5px;color:var(--t3);white-space:nowrap}
@media(max-width:640px){.num-row{flex-wrap:wrap}.num-tag{flex-basis:100%;text-align:left;margin-top:6px}}

/* --------------------------------------------------------- pullquote -- */
.pullquote{font-family:var(--serif);font-size:clamp(1.25rem,2.3vw,1.6rem);font-style:normal;
           font-weight:600;line-height:1.24;letter-spacing:-.022em;color:var(--ink);max-width:26ch;
           margin-top:40px;padding-left:22px;border-left:2px solid var(--accent)}
.pullquote cite{display:block;font-family:var(--data);font-style:normal;font-size:11px;
                font-weight:500;letter-spacing:.085em;text-transform:uppercase;color:var(--t3);margin-top:14px}

/* ------------------------------------------------------------- prose -- */
.prose{max-width:var(--read)}
.prose p{font-size:18px;line-height:1.72;color:var(--t2);margin:0 0 22px}
.prose h2{font-size:1.5rem;margin:44px 0 14px}
.prose h3{font-size:1.12rem;margin:32px 0 8px}
.prose ul,.prose ol{font-size:18px;line-height:1.66;color:var(--t2);padding-left:22px;margin:0 0 22px}
.prose li{margin-bottom:9px}
.prose blockquote{margin:28px 0;padding-left:20px;border-left:2px solid var(--accent);
                  font-family:var(--serif);font-style:normal;font-weight:600;font-size:1.15rem;
                  letter-spacing:-.018em;color:var(--ink)}
.prose a{color:var(--accent-ink);text-decoration:underline;text-underline-offset:3px}

/* ------------------------------------------------------------- forms -- */
.field{margin-bottom:16px}
.field label{display:block;font-family:var(--data);font-size:10.5px;font-weight:500;
             letter-spacing:.085em;text-transform:uppercase;color:var(--t3);margin-bottom:7px}
.field input,.field textarea{width:100%;padding:12px 14px;border:1px solid var(--edge);
     border-radius:var(--r);font-family:var(--sans);font-size:16px;color:var(--ink);
     background:var(--panel);outline:none;transition:border-color .14s,box-shadow .14s}
.field input:focus,.field textarea:focus{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.field textarea{resize:vertical;min-height:104px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px;margin-top:26px;align-items:start}
@media(max-width:760px){.form-grid{grid-template-columns:1fr;gap:28px}}

/* ------------------------------------------------------------ footer -- */
.site-footer{border-top:2px solid var(--ink);padding:44px 0 60px}
.footer-in{max-width:var(--wrap);margin:0 auto;padding:0 32px;display:flex;
           justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:32px}
.footer-in.wide{max-width:var(--wrap-system)}
@media(max-width:600px){.footer-in{padding:0 20px}}
.footer-brand{font-family:var(--ui);font-size:15px;font-weight:700;color:var(--ink);letter-spacing:-.018em}
.footer-motto{font-family:var(--data);font-size:11.5px;color:var(--t3);margin-top:7px;letter-spacing:.02em}
.footer-links{display:flex;gap:8px 22px;flex-wrap:wrap;font-family:var(--ui);font-size:13px;
              margin-top:20px;max-width:660px}
.footer-links a{color:var(--t2)}
.footer-meta{font-family:var(--data);font-size:11.5px;color:var(--t3);text-align:right;line-height:1.8}
@media(max-width:720px){.footer-in{flex-direction:column}.footer-meta{text-align:left}}

/* ----------------------------------------------------------- utility -- */
.center{text-align:center}
.mono,.mono-num,.num{font-family:var(--data);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.notation{font-family:var(--mono);font-size:.92em;letter-spacing:-.01em;overflow-wrap:anywhere;word-break:break-word}
.divider{height:1px;background:var(--hair);border:none;margin:0}

/* ------------------------------------------------ article / dispatch -- */
.article-head{padding:52px 0 0}
.article-head .breadcrumb,.article-breadcrumb{font-family:var(--data);font-size:11.5px;color:var(--t3)}
.article-head .breadcrumb a,.article-breadcrumb a{color:var(--t3)}
.article-kicker,.article-edition{font-family:var(--data);font-size:11px;font-weight:500;
     letter-spacing:.085em;text-transform:uppercase;color:var(--t3)}
.article-title{font-family:var(--serif);font-weight:600;font-size:clamp(1.9rem,4vw,2.9rem);
               line-height:1.06;letter-spacing:-.03em;color:var(--ink);margin:16px 0 0;max-width:20ch}
.article-lead,.article-signal{font-size:19px;line-height:1.56;color:var(--t2);margin-top:18px;
                              max-width:58ch;font-family:var(--sans)}
.article-byline{margin-top:22px;padding-top:14px;border-top:1px solid var(--hair);
                font-family:var(--data);font-size:11.5px;color:var(--t3);display:flex;gap:14px;
                flex-wrap:wrap;align-items:baseline}
.article-byline b{color:var(--ink);font-weight:500}
.article-body{padding:40px 0 20px}
.article-closing{margin-top:36px;padding-top:20px;border-top:1px solid var(--hair);
                 font-family:var(--serif);font-weight:600;font-size:1.12rem;color:var(--ink);
                 line-height:1.35;letter-spacing:-.018em}
.issue-line{margin-top:24px;font-family:var(--data);font-size:11.5px;letter-spacing:.04em;
            text-transform:uppercase;color:var(--t3)}
.article-banner{margin:28px 0}
.article-banner img{border-radius:var(--r);width:100%}
.signal-box{background:var(--panel);border:1px solid var(--edge);border-left:2px solid var(--accent);
            padding:20px 24px;margin:26px 0;font-size:16px;line-height:1.6;color:var(--t2)}
table.transition-table{width:100%;border-collapse:collapse;margin:22px 0;font-size:15px}
table.transition-table th{text-align:left;font-family:var(--data);font-size:10.5px;font-weight:600;
     letter-spacing:.085em;text-transform:uppercase;color:var(--t3);padding:12px 14px 12px 0;
     border-bottom:2px solid var(--ink);background:transparent}
table.transition-table td{padding:13px 14px 13px 0;border-bottom:1px solid var(--hair);
     color:var(--t2);vertical-align:top}

.dispatch{margin:2.5rem 0;padding:2rem 0;border-top:1px solid var(--hair)}
.dispatch:first-of-type{border-top:none;padding-top:0}
.dispatch-header{display:flex;align-items:center;gap:.7rem;margin-bottom:.4rem}
.dispatch-avatar{width:34px;height:34px;border-radius:0;overflow:hidden;border:1px solid var(--edge);
                 flex-shrink:0;display:flex;align-items:center;justify-content:center;
                 background:var(--panel);font-family:var(--serif);font-weight:600;font-size:14px;
                 color:var(--ink);line-height:1}
.dispatch-avatar img{width:100%;height:100%;object-fit:cover;margin:0}
.dispatch-name{font-family:var(--data);font-size:10.5px;color:var(--accent-ink);letter-spacing:.085em;
               text-transform:uppercase;font-weight:500;display:block;line-height:1.2}
.dispatch-desk{font-family:var(--data);font-size:10.5px;color:var(--t3);display:block;margin-top:3px}
.dispatch-title{font-family:var(--serif);font-size:1.1rem;font-weight:600;color:var(--ink);
                margin:.6rem 0 1rem;line-height:1.25;letter-spacing:-.018em}
.confidence-high{font-weight:600;color:var(--accent-ink)}
.confidence-medium{font-weight:600;color:var(--ochre-ink)}
.confidence-low{font-weight:600;color:var(--brick)}

/* =====================================================================
   PRODUCT LAYER — analytical objects. Colour here is load-bearing.
   ===================================================================== */

.chip{display:inline;font-family:var(--data);font-size:11px;font-weight:600;letter-spacing:.085em;
      text-transform:uppercase;color:var(--t3);border:0;background:none;padding:0;white-space:nowrap}
.chip::before{content:"";display:inline-block;width:5px;height:5px;background:var(--t3);
              margin-right:8px;vertical-align:2px}
.chip-live{color:var(--accent-ink)}
.chip-live::before{background:var(--accent)}
.chip-proto{color:var(--ochre-ink)}
.chip-proto::before{background:var(--ochre)}
.chip-dev{color:var(--t3)}
.chip-dev::before{background:none;box-shadow:inset 0 0 0 1px var(--t3)}
.chip-research{color:var(--t2)}
.chip-research::before{background:var(--ink);opacity:.35}
.chip-row{display:flex;gap:6px 26px;flex-wrap:wrap;align-items:baseline;margin-top:16px}
@media(max-width:600px){.chip-row{min-width:0;max-width:100%}.chip{max-width:100%;white-space:normal;overflow-wrap:anywhere}}

.acct{display:inline-block;padding:3px 8px;border-radius:var(--r);font-family:var(--data);
      font-size:10px;font-weight:600;letter-spacing:.085em;text-transform:uppercase;white-space:nowrap}
.acct-auto{background:rgba(16,23,28,.07);color:var(--t3)}
.acct-rule{background:rgba(184,134,43,.18);color:var(--ochre-ink)}
.acct-human{background:rgba(46,125,99,.16);color:var(--accent-ink)}
.acct-key{display:flex;gap:12px 26px;flex-wrap:wrap;margin-top:22px;font-family:var(--ui);
          font-size:12.5px;color:var(--t3)}
.acct-key span{display:flex;align-items:center;gap:9px}

.proof{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:38px;
       background:var(--edge);border-top:1px solid var(--edge);border-bottom:1px solid var(--edge)}
.proof div{background:var(--bg);padding:20px 22px 20px 0;font-size:14.5px;line-height:1.5;color:var(--t2)}
.proof div:not(:first-child){padding-left:22px}
.proof b{display:block;font-family:var(--serif);font-size:15px;font-weight:600;color:var(--ink);
         margin-bottom:6px;letter-spacing:-.015em}
@media(max-width:860px){.proof{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.proof{grid-template-columns:1fr}.proof div{padding-left:0 !important}}

.pipe{margin-top:32px;border-top:2px solid var(--ink);border-bottom:1px solid var(--edge)}
.pipe-row{display:grid;grid-template-columns:44px minmax(150px,1fr) 1.2fr 150px;gap:20px;
          align-items:baseline;padding:16px 0;border-bottom:1px solid var(--hair)}
.pipe-row:last-child{border-bottom:none}
.pipe-row.is-judgment{background:rgba(46,125,99,.055);box-shadow:inset 3px 0 0 var(--accent);
                      padding-left:14px;padding-right:14px}
.pipe-n{font-family:var(--data);font-size:14px;font-weight:500;color:var(--t3);font-variant-numeric:tabular-nums}
.pipe-t{font-family:var(--serif);font-size:16px;font-weight:600;color:var(--ink);
        line-height:1.24;letter-spacing:-.015em}
.pipe-b{font-size:14.5px;line-height:1.5;color:var(--t2)}
.pipe-a{text-align:right}
@media(max-width:880px){
  .pipe-row{grid-template-columns:36px 1fr;gap:4px 14px}
  .pipe-b{grid-column:2}
  .pipe-a{grid-column:2;text-align:left;margin-top:8px}
}
.pipe-note{margin-top:26px;padding:22px 26px;border:1px solid var(--edge);
           border-left:2px solid var(--accent);background:var(--panel)}
.pipe-note b{font-family:var(--serif);font-size:17px;font-weight:600;color:var(--ink);letter-spacing:-.018em}
.pipe-note p{font-size:15.5px;line-height:1.58;color:var(--t2);margin:9px 0 0;max-width:68ch}

.flow{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;margin-top:30px;
      background:var(--edge);border:1px solid var(--edge)}
.flow-step{background:var(--panel);padding:20px}
.flow-k{font-family:var(--data);font-size:10px;font-weight:600;letter-spacing:.085em;
        text-transform:uppercase;color:var(--accent-ink)}
.flow-t{font-family:var(--serif);font-size:15.5px;font-weight:600;color:var(--ink);
        margin-top:10px;line-height:1.24;letter-spacing:-.015em}
.flow-b{font-size:14px;line-height:1.5;color:var(--t2);margin-top:8px}
@media(max-width:940px){.flow{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.flow{grid-template-columns:1fr}}

.claim{background:var(--panel);border:1px solid var(--ink);border-radius:var(--r);
       overflow:hidden;margin-top:28px}
.claim-top{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;
           padding:13px 24px;background:var(--ink)}
.claim-id{font-family:var(--data);font-size:11px;letter-spacing:.085em;text-transform:uppercase;
          color:rgba(255,255,255,.62)}
.claim-src{font-family:var(--data);font-size:11px;color:rgba(255,255,255,.62)}
.claim-src b{color:#fff;font-weight:500}
.claim-body{padding:26px 24px 28px}
.claim-text{font-family:var(--serif);font-size:clamp(1.15rem,2.4vw,1.5rem);line-height:1.22;
            font-weight:600;letter-spacing:-.024em;color:var(--ink);max-width:36ch}
.claim-ts{display:inline-block;margin-top:14px;font-family:var(--data);font-size:11.5px;color:var(--t3)}
.claim-field{margin-top:24px;padding-top:18px;border-top:1px solid var(--hair)}
.claim-k,.claim-field .dl-k{font-family:var(--data);font-size:10.5px;font-weight:600;
        letter-spacing:.085em;text-transform:uppercase;color:var(--t3);display:block}
.claim-v{font-size:15.5px;line-height:1.58;color:var(--t2);margin-top:9px;max-width:72ch}
.claim-sources{list-style:none;padding:0;margin:12px 0 0;border-top:1px solid var(--hair)}
.claim-sources li{display:grid;grid-template-columns:1fr 200px 128px;gap:16px;align-items:baseline;
                  padding:11px 0;border-bottom:1px solid var(--hair);font-size:14.5px;color:var(--t2)}
.claim-sources .cs-ind{font-family:var(--data);font-size:11.5px;color:var(--t3)}
.claim-sources .cs-grade{text-align:right;font-family:var(--data);font-size:11.5px;
                         font-weight:500;color:var(--ink)}
.claim-sources .cs-no,.claim-sources .cs-grade.cs-no,.claim-sources .cs-ind.cs-no{color:var(--brick)}
@media(max-width:820px){
  .claim-sources li{grid-template-columns:1fr;gap:3px}
  .claim-sources .cs-grade{text-align:left}
}
.assess{display:inline-flex;align-items:center;gap:8px;padding:6px 13px;border-radius:var(--r);
        font-family:var(--ui);font-size:14px;font-weight:600}
.assess-sup{background:rgba(46,125,99,.15);color:var(--accent-ink)}
.assess-con{background:rgba(184,134,43,.22);color:var(--ochre-ink)}
.assess-ctx{background:rgba(16,23,28,.08);color:var(--t2)}
.assess-uns{background:rgba(160,51,40,.14);color:var(--brick)}

/* citation trail */
.chain{margin-top:12px;border-top:1px solid var(--hair)}
.chain-row{display:grid;grid-template-columns:104px 1fr;gap:18px;padding:13px 0;
           border-bottom:1px solid var(--hair);align-items:baseline}
.chain-y{font-family:var(--data);font-size:11.5px;color:var(--t3);font-variant-numeric:tabular-nums}
.chain-t{font-size:14.5px;line-height:1.52;color:var(--t2)}
.chain-t b{color:var(--ink);font-weight:600}
@media(max-width:600px){.chain-row{grid-template-columns:1fr;gap:3px}}

.lens{background:var(--panel);border:1px solid var(--edge);border-radius:var(--r);
      padding:26px 28px;margin-top:16px}
.lens-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;
           padding-bottom:14px;border-bottom:2px solid var(--ink)}
.lens-name{font-family:var(--serif);font-size:21px;font-weight:600;color:var(--ink);letter-spacing:-.022em}
.lens-role{font-family:var(--data);font-size:11px;font-weight:600;letter-spacing:.085em;
           text-transform:uppercase;color:var(--t3)}
.lens-q{font-family:var(--serif);font-weight:600;font-size:17px;letter-spacing:-.018em;
        color:var(--ink);margin-top:16px;max-width:46ch}
.lens-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:20px;
             padding-top:18px;border-top:1px solid var(--hair)}
.lens-fields > div .claim-k{margin-bottom:8px}
.lens-fields p{font-size:14.5px;line-height:1.52;color:var(--t2);margin:0}
@media(max-width:820px){.lens-fields{grid-template-columns:1fr;gap:18px}}
.lens-note{margin-top:18px;font-size:14px;line-height:1.55;color:var(--t3);max-width:74ch}

.regtable-wrap{margin-top:26px;overflow-x:auto;-webkit-overflow-scrolling:touch}
table.regtable{width:100%;border-collapse:collapse;font-size:14.5px;min-width:740px}
table.regtable th{text-align:left;padding:12px 16px 12px 0;font-family:var(--data);font-size:10.5px;
                  font-weight:600;letter-spacing:.085em;text-transform:uppercase;color:var(--t3);
                  border-bottom:2px solid var(--ink);white-space:nowrap}
table.regtable td{padding:15px 16px 15px 0;border-bottom:1px solid var(--hair);
                  color:var(--t2);vertical-align:top}
table.regtable tr:last-child td{border-bottom:1px solid var(--edge)}
table.regtable td:first-child{color:var(--ink);font-weight:600}
.verdict{font-family:var(--data);font-size:11px;font-weight:600;letter-spacing:.085em;text-transform:uppercase}
.v-held{color:var(--accent-ink)}
.v-watch{color:var(--ochre-ink)}
.v-tripped{color:var(--brick)}
.v-pending{color:var(--t3)}

.prov{margin-top:18px;font-family:var(--data);font-size:13.5px;line-height:1.65;
      color:var(--t3);max-width:88ch;font-variant-numeric:tabular-nums}
.prov a{color:var(--t3);text-decoration:underline;text-underline-offset:3px}
.prov a:hover{color:var(--ink)}

.sec-head{display:flex;justify-content:space-between;align-items:flex-start;gap:28px;flex-wrap:wrap}
.sec-head .chip-row{margin-top:14px}

.uiframe{margin-top:28px;border:1px solid var(--ink);border-radius:var(--r);overflow:hidden;background:var(--panel)}
.uiframe img{width:100%;display:block}

/* ------------------------------------------------------- a11y floor -- */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px}
button,input:not([type="hidden"]),select,textarea,summary{min-height:24px}
.site-nav a,.site-footer a,.actions a,.article-breadcrumb a,.article-nav a{min-height:24px}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;transition-duration:.001ms !important}
}
@media(max-width:680px){
  body .register-status,body .dm-locates,body .rtl-lsub,body .rtl-hint,
  body .rtl-play,body .bs-label,body .tl-sub,body .time-hint,
  body .readout-tier{font-size:10px !important}
}
.skip{position:absolute;left:-9999px}
.skip:focus{position:static;display:inline-block;margin:8px 32px;padding:8px 14px;background:var(--ink);color:#fff}

/* ------------------------------- legacy page hardening (mobile QA) -- */
@media(max-width:760px){
  [style*="grid-template-columns:1fr 1fr"],[style*="grid-template-columns:1.7fr 1fr"],
  [style*="grid-template-columns:1.5fr 1fr"],[style*="grid-template-columns:2fr 1fr"],
  [style*="grid-template-columns:200px 1fr"],[style*="grid-template-columns:180px 1fr"],
  [style*="grid-template-columns:160px 1fr"],[style*="grid-template-columns:150px 1fr"],
  [style*="grid-template-columns:repeat(2"],[style*="grid-template-columns:repeat(3"],
  [style*="grid-template-columns:repeat(4"],[style*="grid-template-columns:repeat(5"]{
    grid-template-columns:1fr !important}
  [style*="display:grid"]>*,[style*="display:flex"]>*{min-width:0}
  [class*="card"],[class*="panel"],[class*="box"],[class*="figure"]{overflow-wrap:break-word}
}


/* ---------------------------------------------------- hero instrument --
   The current state of every running surface, in the hero. It is the most
   characteristic object FP1 owns, so it goes first rather than being
   described first. Values here are the published readings, nothing else. */
.hero-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.85fr);
           gap:64px;align-items:start}
@media(max-width:1040px){.hero-grid{grid-template-columns:1fr;gap:40px}}

.state{border:1px solid var(--ink);background:var(--panel)}
.state-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
           padding:11px 18px;background:var(--ink)}
.state-top span{font-family:var(--data);font-size:10.5px;letter-spacing:.085em;
                text-transform:uppercase;color:rgba(255,255,255,.62)}
.state-top span:first-child{color:#fff;font-weight:500}
.state-grp{padding:16px 18px;border-bottom:1px solid var(--hair)}
.state-grp:last-child{border-bottom:none}
.state-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.state-h b{font-family:var(--serif);font-size:14.5px;font-weight:600;color:var(--ink);letter-spacing:-.015em}
.state-h i{font-family:var(--data);font-size:10.5px;font-style:normal;letter-spacing:.085em;
           text-transform:uppercase;color:var(--t3)}
.state-row{display:flex;justify-content:space-between;align-items:baseline;gap:14px;margin-top:9px}
.state-row em{font-style:normal;font-size:13.5px;color:var(--t2)}
.state-row var{font-style:normal;font-family:var(--data);font-size:12.5px;color:var(--ink);
               font-variant-numeric:tabular-nums;text-align:right}
.state-row var.on{color:var(--accent-ink);font-weight:500}
.state-row var.wait{color:var(--ochre-ink)}
.state-foot{padding:12px 18px;background:var(--sunk)}
.state-foot p{margin:0;font-family:var(--data);font-size:10.5px;line-height:1.6;color:var(--t3)}

/* Wide data tables get their own horizontal scroll on narrow screens rather
   than pushing the page sideways. Applied at the table, so legacy pages that
   never wrapped their tables are covered too. */
@media(max-width:820px){
  table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  table.regtable{min-width:0}
  .regtable-wrap table.regtable{min-width:740px}

  /* Historical research pages carried 8–10 px metadata from the prior visual
     system. Keep the notation compact, but not below a readable mobile floor. */
  .confidence-tag,.annotation-header,.concept-box-label,.falsification-label,
  .article-edition,.pi-pattern,.card-phase,.entry-num,.entry-correspondent,
  .cta-label,.era-label,.label{font-size:10.5px !important;line-height:1.35}
  .entry-meta{font-size:11px !important}
  .evidence-table th{font-size:10.5px !important}
}


/* ---------------------------------------------- shared page components --
   Used by more than one page, so they live here rather than in a single
   template. Previously defined only in page_index and therefore undefined
   on engage.html — caught by the CSS coverage gate. */
.sys-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}

/* integration rows: a compact register, not a card wall */
.integ{margin-top:30px;border-top:2px solid var(--ink)}
.integ-r{display:grid;grid-template-columns:290px 1fr;gap:40px;padding:20px 0;
         border-bottom:1px solid var(--hair);align-items:baseline}
.integ-r b{font-family:var(--serif);font-size:17px;font-weight:600;
           letter-spacing:-.018em;color:var(--ink)}
.integ-r span{display:block;font-family:var(--data);font-size:11px;font-weight:600;
              letter-spacing:.085em;text-transform:uppercase;color:var(--t3);margin-top:5px}
.integ-r p{margin:0;font-size:16px;line-height:1.6;color:var(--t2);max-width:66ch}
@media(max-width:780px){.integ-r{grid-template-columns:1fr;gap:8px}}

/* roster identity column */
.roster-id{min-width:0}