/* Entry Check — the tool half of Trimtabist, on the publication's own design system.

   Rebuilt 2026-08-29. What changed and why:

   · ONE token block. The file carried nine :root blocks, including a complete dead
     blue palette fully overridden 350 lines later, plus four stacked "appended last,
     reversible" layers. The observatory's tokens (design.js) are now the source and
     the tool's old names are aliases onto them, so a colour is defined once.
   · The observatory's geometry. Measure 62ch (was 66/68/70/72/76/78/82ch); one
     container width (was 720/940/1120 against a 1000px masthead, so the site strip
     and the page it headed did not line up); square corners (was 5/6/8/9/10/11/12/13/
     14/20px); weights 400 and 600 only — the old ladder of 620/640/650/660/670/680
     never rendered, because --f-ui had been redefined to a serif stack that ships one
     bold, so all six resolved to 700.
   · THE MONO RULE. Mono means a machine measured it; serif means a person wrote it.
     The tool's biggest figures — the verdict figure, the hero number, tile values,
     the ladder, line values — were set in serif. They are the numbers the whole
     instrument exists to produce. They are mono now. Judgement stays serif: the
     verdict sentence, the broker questions, the caveats.
   · Everything below the token layer is scoped to `body.ec`. `.door`, `.dot`,
     `.lead`, `.scroll`, `.brand` and bare table/h1/h2/h3 mean different things in the
     two stylesheets; scoping means this file can be loaded beside design.js's CSS
     without silently restyling the publication.

   No external fonts, no CDN. Same-origin stylesheet so a strict `default-src 'self'`
   CSP (which blocks inline <style>) still applies it. */

/* ═══════════════ tokens ═══════════════
   Names and values track /opt/trimtab/design.js. The second half of each block is
   the tool's own vocabulary aliased onto it — var() resolves at use, so redefining
   a source token in a media query carries every alias with it. */
:root{
  /* ground and ink — light is the default, on bare :root */
  --paper:#F7F4EF; --panel:#FFFCF6; --sunk:#EFEAE0;
  --ink:#1A1613; --ink-2:#4A443C; --slate:#635C51;
  --accent:#A83717; --accent-soft:#F2E4DE;
  --rule:#D3CBBC; --rule-2:#E6E0D4;
  --series-2:#6E6659; --returning:#0F5C41; --late:#7A5406;
  --mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
  --serif:Charter,"Iowan Old Style","Palatino Linotype",Georgia,serif;
  /* type scale — 10 steps */
  --t-h1:clamp(26px,4vw,40px); --t-h2:21px; --t-lede:17.5px; --t-body:17px;
  --t-small:15px; --t-data:12.5px; --t-meta:11.5px; --t-label:10px; --t-num:26px;
  /* spacing scale — 8 steps */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:72px;
  --measure:62ch;
  /* geometry: one column, square corners */
  --maxw:1180px; --radius:0;
  --legalbar-h:34px;

  /* tool-only: the settled/positive wash, and the 5-step accent ramp the charts read
     (renamed from --s1…--s5, which collided head-on with the spacing scale). */
  --aqua-soft:#E2EFE8;
  --ramp-1:#E4A98F; --ramp-2:#D67A54; --ramp-3:#BC3E1E; --ramp-4:#97331A; --ramp-5:#6E2614;

  /* aliases — the tool's 19 JS modules and three HTML files speak these names */
  --bg:var(--paper); --surface:var(--panel); --surface2:var(--sunk);
  --ink2:var(--ink-2); --muted:var(--slate); --line:var(--rule);
  --aqua:var(--returning); --neutral:var(--series-2);
  --fg:var(--ink); --blue:var(--accent);
  --f-mono:var(--mono); --f-serif:var(--serif); --f-ui:var(--serif);
}
/* The tool honours an explicit choice in BOTH directions as well as the OS
   preference; the observatory follows the OS only. The tool's is the more complete
   implementation, so it wins the merge rather than losing it. */
@media (prefers-color-scheme:dark){
  :root{
    --paper:#14120F; --panel:#1B1815; --sunk:#100E0C;
    --ink:#EDE7DD; --ink-2:#BFB6A8; --slate:#9C9384;
    --accent:#E8825A; --accent-soft:#2A1D16;
    --rule:#342E26; --rule-2:#241F1A;
    --series-2:#A79D8D; --returning:#4FBE90; --late:#D2A03A;
    --aqua-soft:#14231C;
    --ramp-1:#F0B79C; --ramp-2:#E0855C; --ramp-3:#E0713F; --ramp-4:#B85631; --ramp-5:#8A3F22;
  }
}
:root[data-theme="dark"]{
  --paper:#14120F; --panel:#1B1815; --sunk:#100E0C;
  --ink:#EDE7DD; --ink-2:#BFB6A8; --slate:#9C9384;
  --accent:#E8825A; --accent-soft:#2A1D16;
  --rule:#342E26; --rule-2:#241F1A;
  --series-2:#A79D8D; --returning:#4FBE90; --late:#D2A03A;
  --aqua-soft:#14231C;
  --ramp-1:#F0B79C; --ramp-2:#E0855C; --ramp-3:#E0713F; --ramp-4:#B85631; --ramp-5:#8A3F22;
}
:root[data-theme="light"]{
  --paper:#F7F4EF; --panel:#FFFCF6; --sunk:#EFEAE0;
  --ink:#1A1613; --ink-2:#4A443C; --slate:#635C51;
  --accent:#A83717; --accent-soft:#F2E4DE;
  --rule:#D3CBBC; --rule-2:#E6E0D4;
  --series-2:#6E6659; --returning:#0F5C41; --late:#7A5406;
  --aqua-soft:#E2EFE8;
  --ramp-1:#E4A98F; --ramp-2:#D67A54; --ramp-3:#BC3E1E; --ramp-4:#97331A; --ramp-5:#6E2614;
}

/* ═══════════════ base ═══════════════ */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body.ec{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--serif); font-size:var(--t-body); line-height:1.62;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  padding-bottom:var(--legalbar-h);
}
.ec a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.ec :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.ec .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* THE MONO RULE. Every figure a machine produced, in the machine's face. */
.ec .tnum{font-family:var(--mono);font-variant-numeric:tabular-nums}
.ec .mono{font-family:var(--mono);font-size:.9em;letter-spacing:-.01em}

/* One column, and the masthead above it is the same column. */
.ec .wrap{max-width:var(--maxw);margin:0 auto;padding:var(--s5) var(--s5) var(--s8)}
/* .note / .book still mark which personality is rendering (app.js toggles them, and
   several rules below read them); they no longer change the column width. */
.ec .wrap.note,.ec .wrap.book{max-width:var(--maxw);margin:0 auto;border-left:0;color:inherit;font-size:inherit}

/* ═══════════════ masthead (js/sitenav.js) ═══════════════
   The same masthead as trimtabist.com, rule for rule, on the same column. */
.ec .sitenav{background:var(--paper)}
.ec .sitenav-in{max-width:var(--maxw);margin:0 auto;padding:var(--s6) var(--s5) 0}
.ec .sitenav-brandrow{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s5);flex-wrap:wrap}
.ec .sitenav-brand{font-family:var(--serif);font-size:clamp(32px,6vw,56px);font-weight:400;
  letter-spacing:-.028em;line-height:.95;color:var(--ink);text-decoration:none}
.ec .sitenav-brand i{font-style:normal;color:var(--slate)}
.ec .sitenav-standfirst{font-family:var(--serif);font-size:var(--t-small);line-height:1.5;
  color:var(--ink-2);max-width:38ch;margin:0;padding-bottom:5px}
.ec .sitenav nav{display:flex;gap:var(--s2) var(--s5);margin-top:var(--s4);padding:var(--s1) 0;
  border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);flex-wrap:wrap}
.ec .sitenav nav a{display:flex;align-items:center;min-height:44px;font-family:var(--mono);font-size:11px;
  letter-spacing:.15em;text-transform:uppercase;color:var(--ink-2);text-decoration:none;
  border-bottom:2px solid transparent;white-space:nowrap}
.ec .sitenav nav a[aria-current]{color:var(--ink);border-bottom-color:var(--accent)}
.ec .sitenav nav a:hover{border-bottom-color:var(--rule)}
.ec .sitenav nav a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}

/* ═══════════════ headings and prose ═══════════════
   Hierarchy from size and rules, not weight: the serif ships one bold, so 400 and
   600 are the only two levels that exist. */
.ec h1{font-family:var(--serif);font-size:var(--t-h1);font-weight:400;letter-spacing:-.02em;
  line-height:1.12;margin:var(--s4) 0 var(--s3);text-wrap:balance;max-width:24ch}
.ec h2{font-family:var(--serif);font-size:var(--t-h2);font-weight:400;letter-spacing:-.01em;
  margin:var(--s7) 0 var(--s3);color:var(--ink);display:flex;align-items:baseline;gap:var(--s2)}
.ec h2 .idx{font-family:var(--mono);font-size:var(--t-meta);color:var(--slate);letter-spacing:0}
.ec h3{font-family:var(--serif);font-size:var(--t-small);font-weight:600;margin:0 0 var(--s1)}
/* The section label of a report. A single ink rule above it, as the publication marks
   the top of a stat band or a register. */
.ec h2.note-h{font-family:var(--mono);font-size:var(--t-label);letter-spacing:.19em;text-transform:uppercase;
  color:var(--slate);font-weight:400;display:block;
  margin:var(--s7) 0 var(--s4);padding-top:var(--s4);border-top:1px solid var(--ink)}
.ec .eyebrow{font-family:var(--mono);font-size:var(--t-label);letter-spacing:.19em;
  text-transform:uppercase;color:var(--slate);font-weight:400}
.ec .eyebrow b{color:var(--accent);font-weight:400}
.ec .rule-label{font-family:var(--mono);font-size:var(--t-label);letter-spacing:.16em;
  text-transform:uppercase;color:var(--slate);font-weight:400;margin:0}

.ec .lead{font-size:var(--t-body);color:var(--ink-2);max-width:var(--measure);margin:var(--s3) 0 0}
.ec .sub{font-size:var(--t-small);color:var(--ink-2);max-width:var(--measure);margin:var(--s2) 0 0}
.ec .ssub{font-size:var(--t-small);color:var(--ink-2);max-width:var(--measure);margin:0 0 var(--s3);line-height:1.5}
.ec .lead b,.ec .sub b{color:var(--ink);font-weight:600}
/* Fine print stays SERIF: most of it is judgement (what the tool cannot do, what only
   CBP decides), not measurement. The machine's own fine print — filenames, run stamps,
   citations — carries .mono or .runstamp and is mono. */
.ec .fineprint{font-size:var(--t-data);color:var(--slate);line-height:1.6;max-width:78ch}
.ec .fineprint b{color:var(--ink);font-weight:600}
.ec .runstamp{font-family:var(--mono);font-size:var(--t-meta);color:var(--slate);margin-top:var(--s1)}
.ec .note{font-size:var(--t-small);color:var(--ink-2);border-left:2px solid var(--accent);
  padding:var(--s1) 0 var(--s1) var(--s4);margin:var(--s4) 0;max-width:var(--measure)}
.ec .note b{color:var(--ink);font-weight:600}
.ec .note.calm{border-left-color:var(--rule)}
.ec .note.settled{border-left-color:var(--returning)}
.ec .note-caution{font-size:var(--t-small);color:var(--ink-2);border-left:2px solid var(--accent);
  padding:var(--s1) 0 var(--s1) var(--s4);margin:var(--s4) 0 0;max-width:var(--measure)}
.ec .note-disclaimer{margin-top:var(--s4)}
.ec .crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-family:var(--mono);
  font-size:var(--t-meta);color:var(--slate);margin:0 0 var(--s2)}
.ec .crumbs button{background:none;border:0;padding:0;font:inherit;color:var(--accent);
  cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.ec .crumbs .sep{color:var(--rule)}
.ec .crumbs .here{color:var(--ink-2)}

/* ═══════════════ buttons, controls, inputs ═══════════════
   The publication has no buttons; an application cannot work without them. These are
   design.js's .btn, extended with the states a tool needs. */
.ec .btn{display:inline-block;font-family:var(--mono);font-size:var(--t-data);letter-spacing:.04em;
  padding:11px 18px;background:var(--accent);color:var(--panel);text-decoration:none;
  border:1px solid var(--accent);border-radius:0;min-height:44px;line-height:1.6;cursor:pointer}
.ec .btn:hover{background:var(--ink);border-color:var(--ink);color:var(--panel)}
.ec .btn.ghost,.ec .btn.primary.ghost{background:transparent;color:var(--accent)}
.ec .btn.ghost:hover{background:var(--accent-soft);color:var(--accent)}
.ec .btn.primary{background:var(--accent);border-color:var(--accent);color:var(--panel)}
/* A disabled "Check these entries" is the landing's most common state; 45% opacity
   explained nothing, so it now reads as an inert control with a cursor to match. */
.ec .btn[disabled],.ec .btn.primary[disabled]{background:transparent;color:var(--slate);
  border-color:var(--rule);cursor:not-allowed}
.ec .btn[disabled]:hover{background:transparent;color:var(--slate);border-color:var(--rule)}
.ec button.danger{color:var(--accent);border-color:var(--accent);background:transparent}
.ec .linklike,.ec .seeline,.ec .morebtn{background:none;border:0;padding:0;font:inherit;
  color:var(--accent);cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.ec .seeline{padding-top:var(--s3);font-size:var(--t-small)}
.ec .morebtn{font-family:var(--mono);font-size:var(--t-meta);padding:var(--s2) 0 0}
.ec .controls{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;margin:0 0 var(--s2)}
.ec .controls input[type="search"],.ec .controls select,.ec input[type="email"]{
  background:var(--panel);border:1px solid var(--rule);color:var(--ink);border-radius:0;
  padding:9px 11px;font-family:var(--mono);font-size:var(--t-data);min-width:0}
.ec .controls input[type="search"]{flex:1;min-width:170px}
.ec input[type="email"]{width:100%;max-width:340px;font-size:var(--t-small)}
.ec .count{font-family:var(--mono);font-size:var(--t-meta);color:var(--slate);font-variant-numeric:tabular-nums}

/* ═══════════════ the verdict ═══════════════ */
.ec .note-head{font-family:var(--mono);font-size:var(--t-meta);color:var(--slate);margin:var(--s2) 0 0}
.ec .verdict{margin:var(--s6) 0 0}
.ec .verdict-head{font-family:var(--serif);font-size:var(--t-h1);font-weight:400;line-height:1.15;
  letter-spacing:-.02em;margin:0;max-width:24ch;text-wrap:balance}
/* The largest number the instrument produces. A machine measured it. */
.ec .verdict-figure{font-family:var(--mono);font-size:clamp(32px,5.4vw,46px);font-weight:600;
  letter-spacing:-.03em;color:var(--accent);font-variant-numeric:tabular-nums;
  line-height:1.05;margin:var(--s3) 0 var(--s1)}
.ec .verdict.hot .verdict-head{color:var(--ink)}
.ec .verdict-body{font-size:var(--t-lede);line-height:1.55;color:var(--ink-2);max-width:var(--measure);margin:var(--s3) 0 0}
.ec .verdict-body b{color:var(--ink);font-weight:600}
.ec .verdict-aside{font-size:var(--t-small);color:var(--slate);max-width:var(--measure);margin:var(--s2) 0 0;font-style:italic}
.ec .subordinate{margin:var(--s5) 0 0;border-top:1px solid var(--rule);padding-top:var(--s3)}
.ec .verdict-sub{font-size:var(--t-small);color:var(--ink-2);max-width:var(--measure);margin:var(--s2) 0 0}
.ec .verdict-sub b{color:var(--ink);font-weight:600}
.ec .recon-line{font-size:var(--t-small);color:var(--ink-2);margin:var(--s4) 0 0;max-width:var(--measure)}

/* ═══════════════ the hero (book) ═══════════════ */
/* One entry, one finding — sits ABOVE the hero so a perfectly-matched entry does
   not open with "100%" directly over the thing the reader came for. Deliberately
   quieter than the heronum: it leads by POSITION, not by size, so the hero keeps
   its denominator restatement (H4.4) intact. Single entry only. */
.ec .finding-first{margin:var(--s5) 0 var(--s3);padding:var(--s3) var(--s4);
  border-left:3px solid var(--accent);background:var(--accent-soft);border-radius:0 4px 4px 0}
.ec .findinglead{font-size:var(--t-lede);color:var(--ink);max-width:var(--measure);margin:0;font-weight:500}
.ec .finding-first + .hero{margin-top:var(--s3)}

.ec .hero{margin:var(--s5) 0 var(--s2)}
.ec .heronum{font-family:var(--mono);font-size:clamp(42px,9vw,72px);line-height:.95;font-weight:600;
  letter-spacing:-.04em;color:var(--ink);font-variant-numeric:tabular-nums}
.ec .herotext{font-size:var(--t-lede);color:var(--ink-2);max-width:var(--measure);margin:var(--s3) 0 0}
.ec .herotext b{color:var(--ink);font-weight:600}

/* ═══════════════ the ladder (schedule vs filed) ═══════════════ */
.ec .ladder{display:flex;flex-direction:column;gap:var(--s2);margin:var(--s1) 0 0;max-width:760px}
.ec .ladder-row{display:grid;grid-template-columns:1fr auto auto;gap:var(--s4);align-items:baseline;font-size:var(--t-body)}
.ec .ladder-what{color:var(--ink)}
.ec .ladder-rate{font-family:var(--mono);color:var(--ink-2);min-width:56px;text-align:right}
.ec .ladder-usd{font-family:var(--mono);color:var(--ink);font-weight:600;min-width:92px;text-align:right}
.ec .ladder-total{font-size:var(--t-small);color:var(--ink-2);margin:var(--s3) 0 0;
  border-top:1px solid var(--rule);padding-top:var(--s3);max-width:760px}
.ec .ladder-total b{color:var(--ink);font-weight:600}
.ec .ladder-base{font-size:var(--t-data);color:var(--ink-2);margin:var(--s3) 0 0}
.ec .ladder-base b{color:var(--ink);font-weight:600}
.ec table.ladder{display:table;width:100%;max-width:760px}
.ec table.ladder tr.lt td{border-top:1px solid var(--ink);padding-top:var(--s2)}
.ec .tier-line{font-size:var(--t-small);color:var(--ink-2);margin:var(--s3) 0 0;max-width:var(--measure)}
.ec .tier-line b{color:var(--ink);font-weight:600}
.ec .dismissals{margin:var(--s1) 0 0;padding-left:20px;font-size:var(--t-small);color:var(--ink-2);max-width:var(--measure)}
.ec .dismissals li{margin:var(--s2) 0;line-height:1.55}
.ec ol.broker{margin:var(--s3) 0;padding-left:22px;font-size:var(--t-body);line-height:1.55}
.ec ol.broker li{margin:0 0 var(--s2);color:var(--ink);max-width:var(--measure)}
/* The action block. Square, a rule and a wash — the publication's .withdrawn shape. */
.ec .broker-box{background:var(--accent-soft);border-left:3px solid var(--accent);
  padding:var(--s4) var(--s5);margin:var(--s2) 0;max-width:calc(var(--measure) + var(--s5) * 3)}
.ec .broker-box > .lead:first-child{margin-top:0}
.ec .cite-i{color:var(--slate);cursor:help;font-size:.85em}

/* ═══════════════ line list and line summary ═══════════════ */
.ec .linelist{display:flex;flex-direction:column}
.ec .lineitem{display:grid;grid-template-columns:auto 1fr auto auto;gap:var(--s3);align-items:baseline;
  width:100%;background:none;border:0;border-bottom:1px solid var(--rule-2);padding:var(--s3) 2px;
  font:inherit;font-size:var(--t-small);color:var(--ink);text-align:left;cursor:pointer}
.ec .lineitem:hover{background:var(--panel)}
.ec .li-desc{color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ec .li-val{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--ink-2)}
.ec .li-read{font-family:var(--mono);font-size:var(--t-meta);color:var(--slate);white-space:nowrap}
.ec .li-read.above{color:var(--accent)}
/* Below-schedule is a real question, not a lesser one — but it is never red and never
   green (Addendum A0): it is the column that carries paperwork, in the accent. */
.ec .li-read.below{color:var(--accent)}
.ec .linehead{margin:calc(-1 * var(--s1)) 0 var(--s3)}
.ec .linesum{width:100%}
.ec .linesum td,.ec .linesum th{padding:var(--s2) var(--s3)}
.ec .linesum .li-read.below,.ec .linesum .li-read.above{color:var(--accent)}
.ec .linesum .li-read.matched{color:var(--slate)}

/* ═══════════════ the lane link — the bridge to the observatory ═══════════════
   Written hidden and revealed only where the measured page really exists. */
.ec a.lanelink{display:inline-block;margin-left:var(--s2);font-family:var(--mono);
  font-size:var(--t-meta);letter-spacing:.04em;color:var(--accent);white-space:nowrap}
.ec a.lanelink[hidden]{display:none}

/* ═══════════════ the ending ═══════════════
   Until 2026-08-29 the report stopped at a disclaimer: no next step, no address, no
   route to the evidence, and no mailto anywhere in the product. */
.ec .ending{margin:var(--s2) 0 0}
.ec .end-acts{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center;margin:0 0 var(--s5)}
.ec .end-save{display:flex;gap:var(--s3);align-items:center;flex-wrap:wrap}
.ec .end-save .em{font-family:var(--mono);font-size:var(--t-data);padding:11px 12px;
  border:1px solid var(--rule);border-radius:0;background:var(--panel);color:var(--ink);width:210px;min-height:44px}
.ec .end-save .msg{font-family:var(--mono);font-size:var(--t-meta);color:var(--slate)}
.ec .ending .lead{margin:0 0 var(--s3)}

/* ═══════════════ tiles and cards ═══════════════
   design.js's .stats band: hairline-divided, no corners, mono values. */
.ec .tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);margin:var(--s5) 0 var(--s2)}
.ec .tile{padding:var(--s4);border-right:1px solid var(--rule-2)}
.ec .tile:last-child{border-right:0}
.ec .tile .k{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--slate);margin-bottom:var(--s2)}
.ec .tile .v{font-family:var(--mono);font-size:var(--t-num);font-weight:600;letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;line-height:1}
.ec .tile .d{font-family:var(--mono);font-size:var(--t-meta);color:var(--slate);margin-top:var(--s2);line-height:1.6}
.ec .tile .foot{font-family:var(--mono);font-size:var(--t-meta);color:var(--slate);margin-top:var(--s2);
  border-top:1px solid var(--rule-2);padding-top:var(--s2)}
.ec .tile.settled .v{color:var(--returning)}
.ec .card{background:var(--panel);border:1px solid var(--rule);border-radius:0;
  padding:var(--s4) var(--s5);margin:var(--s4) 0}
.ec .card.settled{border-color:var(--returning)}
.ec .card > table{display:block;overflow-x:auto;max-width:100%}
/* An x-only scroller. design.js's .scroll also clips at 440px vertically, which would
   cut the report's own tall surfaces in half — hence the scope. */
.ec .scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ═══════════════ pills ═══════════════ */
.ec .pill{display:inline-block;font-family:var(--mono);font-size:9.5px;font-weight:400;letter-spacing:.14em;
  text-transform:uppercase;padding:2px 6px;border-radius:0;border:1px solid var(--slate);
  color:var(--slate);line-height:1.35;white-space:nowrap}
.ec .pill.hot{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
.ec .pill.free{border-color:var(--returning);color:var(--returning);background:var(--aqua-soft)}
.ec .pill.calm{border-color:var(--rule);color:var(--slate)}
.ec .pill.rev{border-color:var(--accent);color:var(--accent)}

/* ═══════════════ tables ═══════════════ */
.ec table{width:100%;border-collapse:collapse;font-size:var(--t-data);margin-top:var(--s2)}
.ec th,.ec td{text-align:left;padding:var(--s2) var(--s3);border-bottom:1px solid var(--rule-2);vertical-align:middle}
.ec th{font-family:var(--mono);font-size:var(--t-label);letter-spacing:.14em;text-transform:uppercase;
  color:var(--slate);font-weight:400;position:sticky;top:0;background:var(--paper);z-index:1}
.ec td.n,.ec th.n{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
.ec tbody tr:last-child td{border-bottom:none}
.ec tr.drill{cursor:pointer}
.ec tr.drill:hover td{background:var(--panel)}
.ec tr.drill:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.ec tr.drill td:first-child{position:relative}
.ec tr.drill .chev{color:var(--slate);font-family:var(--mono);font-size:var(--t-meta);padding-left:6px}
.ec tr.drill:hover .chev{color:var(--accent)}
.ec .accentnum{font-family:var(--mono);color:var(--accent);font-weight:600;font-variant-numeric:tabular-nums}
.ec .aquanum{font-family:var(--mono);color:var(--returning);font-weight:600;font-variant-numeric:tabular-nums}
/* A sticky <th> in a border-collapse table sizes to content and misaligns these short
   report tables. Sticky stays for the long book table only. */
.ec .surface table th,.ec table.ladder th,.ec .e-grid th,.ec .linesum th,.ec .conflict table th{
  position:static;background:transparent}
.ec .surface table,.ec .e-grid,.ec .conflict table{width:100%}
.ec .surface table{max-width:860px}
.ec .surface table td,.ec .surface table th{padding-right:var(--s3)}

/* ═══════════════ bars and meters ═══════════════ */
.ec .covbar{height:20px;display:flex;gap:2px;margin:var(--s5) 0 var(--s2);overflow:hidden}
.ec .covbar>span{display:block;height:100%;min-width:2px}
.ec .covlegend{display:flex;gap:var(--s4);flex-wrap:wrap;font-family:var(--mono);font-size:var(--t-meta);color:var(--ink-2)}
.ec .dot{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:6px;vertical-align:1px}
.ec .minibar{height:8px;border-radius:2px;background:var(--accent);min-width:2px}
.ec .split{display:flex;height:8px;border-radius:2px;overflow:hidden;gap:1px;min-width:60px}

/* ═══════════════ the authority surface (S5) ═══════════════
   The declared-duty bar, its legend, the class chip and the correction rail.
   Every colour on these comes from JS, out of fmt.js::AUTHORITY_TONE, so a
   class is the same colour on the bar, the calendar, the table chip and the
   drawer — and a theme flip carries all four at once because they all read the
   same custom property. Nothing here hardcodes a hue. */
.ec .authbar{height:34px;display:flex;gap:2px;margin:var(--s5) 0 var(--s3);overflow:hidden}
.ec .authbar>.authseg{display:block;height:100%;min-width:3px;position:relative}
.ec .authseg-t{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:var(--t-meta);color:var(--panel);letter-spacing:.02em}
.ec .authlegend{display:grid;gap:var(--s2) var(--s5);
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.ec .authrow{display:grid;grid-template-columns:auto 1fr auto;gap:0 var(--s2);align-items:baseline;
  padding-bottom:var(--s2);border-bottom:1px solid var(--rule-2)}
.ec .authrow-l{font-size:var(--t-small);color:var(--ink)}
.ec .authrow-n{font-family:var(--mono);font-size:var(--t-small);color:var(--ink);text-align:right}
.ec .authrow-d{grid-column:2/4;font-family:var(--mono);font-size:var(--t-meta);color:var(--slate)}
.ec .authchip{display:inline-block;font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;
  text-transform:uppercase;border:1px solid var(--rule);padding:2px 7px;white-space:nowrap}
.ec table.authrows{width:100%;border-collapse:collapse}
.ec table.authrows td{vertical-align:top;padding:var(--s2) var(--s2) var(--s2) 0;
  border-bottom:1px solid var(--rule-2);font-size:var(--t-data)}
.ec table.authrows td.n{text-align:right;white-space:nowrap}
/* The projection is an estimate and is never allowed to look like a reading. */
.ec .fineprint.muted-note{color:var(--slate);border-left:1px solid var(--rule);
  padding-left:var(--s3);margin-top:var(--s3)}

/* the correction clock, book scope — three rails, never one stacked bar */
.ec .clockrail{margin:var(--s4) 0 var(--s3)}
.ec .railrow{margin-bottom:var(--s4)}
.ec .rail-k{font-family:var(--mono);font-size:var(--t-meta);letter-spacing:.1em;
  text-transform:uppercase;color:var(--slate);margin-bottom:var(--s2)}
.ec .rail-b{height:12px;display:flex;gap:2px;overflow:hidden}
.ec .rail-b>span{display:block;height:100%;min-width:2px}
.ec .rail-l{display:flex;gap:var(--s4);flex-wrap:wrap;margin-top:var(--s2);
  font-family:var(--mono);font-size:var(--t-meta);color:var(--ink-2)}
.ec .rail-f{font-family:var(--mono);font-size:var(--t-meta);color:var(--slate);margin-top:var(--s1)}

/* ═══════════════ svg / charts ═══════════════ */
.ec svg{max-width:100%;height:auto;display:block}
/* Axis labels are machine output. They were set in the person font because --f-ui had
   been redefined to the serif stack. */
.ec .axislbl{font-family:var(--mono);font-size:11px;fill:var(--slate)}
.ec .axislbl.ink{fill:var(--ink-2)}
.ec .axislbl[style*="9.5px"]{font-size:10px}

/* ═══════════════ the drawer (line detail) ═══════════════ */
.ec .scrim{position:fixed;inset:0;background:rgba(8,10,14,.42);z-index:50;opacity:0;
  pointer-events:none;transition:opacity .18s ease}
.ec .scrim.open{opacity:1;pointer-events:auto}
.ec .drawer{position:fixed;top:0;right:0;bottom:0;width:min(560px,100vw);z-index:60;
  background:var(--panel);border-left:1px solid var(--ink);overflow-y:auto;
  transform:translateX(100%);transition:transform .22s ease;box-shadow:-18px 0 46px rgba(8,10,14,.16)}
.ec .drawer.open{transform:none}
@media (prefers-reduced-motion:reduce){.ec .drawer,.ec .scrim{transition:none}}
.ec .drawer-head{position:sticky;top:0;background:var(--panel);border-bottom:1px solid var(--rule);
  padding:var(--s3) var(--s5);display:flex;align-items:flex-start;gap:var(--s3);z-index:2}
.ec .drawer-head .t{flex:1;min-width:0}
.ec .drawer-body{padding:var(--s4) var(--s5) var(--s8)}
.ec .closebtn{background:var(--sunk);border:1px solid var(--rule);color:var(--ink-2);border-radius:0;
  width:32px;height:32px;font-size:15px;line-height:1;cursor:pointer;flex:none}
.ec .closebtn:hover{color:var(--accent);border-color:var(--accent)}
.ec .surface{border-top:1px solid var(--rule);padding:var(--s5) 0 var(--s2)}
.ec .surface:first-child{border-top:none;padding-top:var(--s1)}
.ec .surface .stitle{display:flex;align-items:baseline;gap:var(--s2);margin-bottom:var(--s2)}
.ec .surface .stitle .n{font-family:var(--mono);font-size:var(--t-meta);color:var(--slate)}
.ec .surface .stitle h3{font-size:16px}
.ec .kv{display:grid;grid-template-columns:auto 1fr;gap:var(--s1) var(--s4);
  font-family:var(--mono);font-size:var(--t-data);margin:var(--s2) 0 0;max-width:560px}
.ec .kv dt{color:var(--slate)}
.ec .kv dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}
/* An empty surface that says WHY it is empty — the one place the suppression rules
   allow an absence to render. */
.ec .empty{font-size:var(--t-data);color:var(--slate);background:var(--sunk);
  border:1px dashed var(--rule);border-radius:0;padding:var(--s3) var(--s4);margin:var(--s2) 0 0}

/* The collapsed form of the two national checks when neither has anything to
   say. Deliberately quiet: it is a receipt that the check ran, not a finding.
   Sits on the left rule so it reads as subordinate to the line above it. */
.ec .note.urgent{border-left:2px solid var(--accent);padding-left:var(--s3);
  background:var(--accent-soft)}

.ec .quietpair{font-size:var(--t-data);color:var(--slate);
  border-left:2px solid var(--rule);padding:2px 0 2px var(--s3);
  margin:var(--s3) 0 0;line-height:1.5}

/* ═══════════════ upload doors ═══════════════ */
.ec .doors{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--s4);margin:var(--s5) 0 0}
.ec .door{background:var(--panel);border:1px dashed var(--rule);border-radius:0;padding:var(--s5);
  text-align:left;transition:border-color .15s ease,background .15s ease}
.ec .door.hot{border-color:var(--accent);border-style:solid;background:var(--accent-soft)}
.ec .door .ttl{font-size:var(--t-lede);font-weight:600;margin-bottom:var(--s1)}
.ec .door .desc{font-size:var(--t-small);color:var(--ink-2)}
.ec .door .files{margin:var(--s3) 0 0;font-family:var(--mono);font-size:var(--t-data);color:var(--ink-2)}
.ec .door .files li{margin:2px 0;font-variant-numeric:tabular-nums}
.ec .door input[type="file"]{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
/* A CONTROL, NOT A LINK. 2026-08-30. Underlined accent text reads as navigation, so the
   one thing the visitor is here to do looked like a footnote. Same weight as the primary
   buttons elsewhere on the site, and a 44px target. */
.ec .filepick{display:inline-block;margin-top:var(--s3);font-family:var(--mono);font-size:var(--t-data);
  letter-spacing:.04em;color:var(--accent);cursor:pointer;padding:11px 18px;min-height:44px;
  line-height:1.6;border:1px solid var(--accent);background:transparent;
  transition:background .15s ease,color .15s ease}
.ec .filepick:hover,.ec .filepick:focus-visible{background:var(--accent);color:var(--panel)}
/* The door says "drop" — so say it where the eye already is, and only while nothing is
   staged. Once a file is in, the door has better things to show. */
.ec .door .filepick + .dropnote{display:block;margin-top:var(--s2);font-size:var(--t-small);color:var(--slate)}
.ec .door.staged .filepick + .dropnote{display:none}
/* The submit moves INTO the door that has the files, so the next action is where the last
   one happened rather than at the foot of the page. */
.ec .door .uploadbar{margin-top:var(--s4);padding-top:var(--s4);border-top:1px solid var(--rule)}
.ec .door.staged{border-style:solid;border-color:var(--rule)}
.ec .files .rmfile{background:none;border:0;color:var(--slate);cursor:pointer;font-size:15px;
  line-height:1;padding:0 4px;margin-left:4px}
.ec .files .rmfile:hover{color:var(--accent)}
.ec .consent{display:flex;gap:var(--s3);align-items:flex-start;background:var(--sunk);
  border:1px solid var(--rule);border-radius:0;padding:var(--s3) var(--s4);margin:var(--s4) 0 0;
  font-size:var(--t-data);color:var(--ink-2);max-width:78ch}
.ec .consent input{margin:3px 0 0;width:16px;height:16px;accent-color:var(--accent);flex:none}
.ec .consent b{color:var(--ink);font-weight:600}
.ec .uploadbar{display:flex;align-items:center;gap:var(--s4);flex-wrap:wrap;margin:var(--s4) 0 0}
.ec .status{font-size:var(--t-data);color:var(--ink-2);max-width:70ch;overflow-wrap:anywhere}
.ec .status.err{color:var(--accent);font-weight:600}
/* The escape from the auto-send countdown. Must read as a control, not as prose, because
   it is the only thing standing between a reader adding a second 7501 and the first one
   going on its own. 2026-08-30. */
.ec .status .autostop{background:none;border:0;border-bottom:1px solid var(--accent);
  color:var(--accent);cursor:pointer;font:inherit;padding:2px 0;margin-left:2px}
.ec .status .autostop:hover{background:var(--accent-soft)}
/* The server's failure text is instructional prose, not a code: it needs a block that
   can hold two sentences. */
.ec .uploaderr{margin:var(--s3) 0 0;max-width:78ch;background:var(--panel);border:1px solid var(--rule);
  border-left:3px solid var(--accent);border-radius:0;padding:var(--s3) var(--s4);
  font-size:var(--t-small);color:var(--ink-2)}
.ec .uploaderr b{color:var(--ink);font-weight:600}
.ec .uploaderr p{margin:var(--s2) 0 0;overflow-wrap:anywhere}
.ec .uploaderr .fineprint{margin-top:var(--s2)}
.ec .skeleton{font-family:var(--mono);font-size:var(--t-data);color:var(--slate);padding:var(--s7) 0}

/* ═══════════════ the scope note (R36) ═══════════════
   Quiet by construction: it is the part of the report that says what the report
   cannot do, and it must be legible without competing with a finding. */
.ec .scopenote{margin:var(--s6) 0 var(--s2);padding:var(--s4) var(--s5);border:1px solid var(--rule);
  border-radius:0;background:var(--panel);max-width:calc(var(--measure) + var(--s5) * 3)}
.ec .scopenote .note-h{margin:0 0 var(--s1);padding-top:0;border-top:0}
.ec .scope-lead{margin:0 0 var(--s3);color:var(--slate);font-size:var(--t-small)}
.ec .scope-line{margin:0 0 var(--s2);font-size:var(--t-small);line-height:1.6;color:var(--ink-2);max-width:var(--measure)}
.ec .scope-line:last-child{margin-bottom:0}
.ec .scope-adds{margin:calc(-1 * var(--s1)) 0 var(--s3) 18px;padding:0;font-size:var(--t-small);color:var(--slate)}
.ec .scope-adds li{margin:3px 0}

/* ═══════════════ the cross-entry contradiction (R57) ═══════════════ */
.ec .xcard{border-left:3px solid var(--accent)}
.ec .xhead{font-size:var(--t-h2);font-weight:400;margin:var(--s2) 0}
.ec .xlead{margin:0 0 var(--s2)}
.ec .xbasis{margin:0 0 var(--s2);border-top:1px solid var(--rule);padding-top:var(--s2)}
.ec .xentries{display:flex;flex-wrap:wrap;gap:6px;margin:var(--s1) 0 var(--s3)}
.ec .xentry{border:1px solid var(--rule);background:transparent;color:var(--ink);border-radius:0;
  padding:4px 9px;font-family:var(--mono);font-size:var(--t-meta);cursor:pointer}
.ec .xentry:hover{border-color:var(--accent);color:var(--accent)}
.ec .xpointer{margin:var(--s3) 0 var(--s2);padding:var(--s2) var(--s3);border-left:2px solid var(--rule);
  font-size:var(--t-small);color:var(--slate)}
.ec .xpointer .mono{color:var(--ink)}
/* The clean-importer lead (K1): the most reassuring true sentence in the report. */
.ec .cleanlead .lead{margin:0 0 var(--s2);font-size:var(--t-lede)}
.ec .cleanlead .fineprint{margin:0 0 var(--s2)}

/* ═══════════════ the intra-entry contradiction ═══════════════ */
.ec .conflict{background:var(--accent-soft);border-left:3px solid var(--accent);
  border-radius:0;padding:var(--s4) var(--s5);margin:var(--s2) 0;max-width:1000px}
.ec .cf-rows{margin:var(--s3) 0}
.ec .cf-row{display:grid;grid-template-columns:66px 1fr auto;gap:var(--s3);align-items:baseline;
  padding:var(--s2) 0;border-top:1px solid var(--rule)}
.ec .cf-line{font-family:var(--mono);font-weight:600;color:var(--ink)}
.ec .cf-codes{font-family:var(--mono);font-size:var(--t-data)}
.ec .cf-rate{font-family:var(--mono);font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.ec .conflict-at{font-size:var(--t-lede);color:var(--ink);margin:var(--s3) 0 0}
.ec .conflict-at b{color:var(--accent)}
/* The relevant 7501 lines reproduced as they sit on the form, the diff highlighted. */
.ec .entry-repro{margin:var(--s3) 0;overflow-x:auto;border:1px solid var(--rule);border-radius:0}
.ec .e-grid{width:100%;border-collapse:collapse;font-size:var(--t-data)}
.ec .e-grid th{text-align:left;font-family:var(--mono);font-size:var(--t-label);letter-spacing:.14em;
  text-transform:uppercase;color:var(--slate);font-weight:400;padding:var(--s2) var(--s3);
  border-bottom:1px solid var(--rule);white-space:nowrap}
.ec .e-grid td{padding:var(--s2) var(--s3);border-bottom:1px solid var(--rule-2);vertical-align:top}
.ec .e-grid tbody tr:last-child td{border-bottom:0}
.ec .e-grid .e-line{font-family:var(--mono);font-weight:600;color:var(--ink)}
.ec .e-grid .tnum{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.ec .e-codes{white-space:nowrap}
.ec .c99{font-family:var(--mono);color:var(--ink-2)}
.ec .c99.diff,.ec .e-grid td.diff{color:var(--accent);font-weight:600;
  background:color-mix(in srgb,var(--accent) 12%,transparent);padding:1px 5px}
.ec .repro-point{font-size:var(--t-small);line-height:1.55;color:var(--ink-2);margin:0;padding:var(--s3)}
.ec .repro-point b{color:var(--ink);font-weight:600}

/* ═══════════════ your book (book.html + js/mybook.js) ═══════════════
   This page used to carry a THIRD design system — inline sans-serif, its own blue
   palette, 14px corners — and did not load this file at all. */
.ec .wrap-inner{max-width:var(--measure);margin:0}
.ec .muted{color:var(--slate);font-size:var(--t-data)}
.ec .row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s3);
  padding:var(--s3) 0;border-bottom:1px solid var(--rule-2)}
.ec .row:last-child{border-bottom:0}
.ec .bar{display:flex;gap:var(--s3);flex-wrap:wrap;margin-top:var(--s4)}
.ec .hist{margin:var(--s2) 0 0;padding:var(--s2) var(--s3);border-left:2px solid var(--rule);
  font-size:var(--t-small);color:var(--ink-2)}
.ec .change{font-size:var(--t-data);color:var(--ink-2)}
.ec .change b{color:var(--ink);font-weight:600}
.ec .center{text-align:center;padding:var(--s7) 0}

/* ═══════════════ the persistent legal bar ═══════════════
   CONTRACT-level: the disclaimer is on screen at all times, not only in a footer. */
.ec .legalbar{position:fixed;left:0;right:0;bottom:0;z-index:70;height:var(--legalbar-h);
  display:flex;align-items:center;justify-content:center;
  background:color-mix(in srgb,var(--panel) 94%,transparent);backdrop-filter:blur(8px);
  border-top:1px solid var(--rule);font-family:var(--mono);font-size:var(--t-meta);
  color:var(--slate);padding:0 var(--s4);text-align:center}
.ec .legalbar b{color:var(--ink-2);font-weight:400}
.ec .footer,.ec .note-footer{margin-top:var(--s7);border-top:1px solid var(--ink);padding-top:var(--s4)}

/* ═══════════════ responsive ═══════════════ */
@media (max-width:768px){
  .ec .tile{border-right:0;border-bottom:1px solid var(--rule-2)}
  .ec .tile:last-child{border-bottom:0}
}
@media (max-width:640px){
  .ec .wrap{padding:var(--s4) var(--s4) var(--s7)}
  .ec .sitenav-in{padding:var(--s5) var(--s4) 0}
  .ec .sitenav nav{gap:0 var(--s4)}
  .ec .lineitem{grid-template-columns:auto 1fr;row-gap:3px}
  .ec .li-val,.ec .li-read{grid-column:2;justify-self:start}
  .ec h2.note-h{margin-top:var(--s6)}
  .ec .drawer{width:100vw}
  .ec .kv{grid-template-columns:1fr auto}
  .ec .end-acts{gap:var(--s2)}
  .ec .end-save .em{width:100%}
  :root{--legalbar-h:44px}
  .ec .legalbar{line-height:1.25}
}
/* A broker prints this to take to a client. */
@media print{
  .ec .legalbar,.ec .btn,.ec .drawer,.ec .scrim,.ec .vc-sess,.ec .end-acts{display:none!important}
  body.ec{padding:0;background:#fff}
}
