/* ══════════════════════════════════════════════════════════════════════
   MANUFACTURE TERMINAL — PUBLIC SITE, recast in the EMW Design System
   2026 (Rev 02). MOCK-UP ONLY — the live site is still ./public.

   Shared by the landing page and /explore/. The 404 page carries its own
   copy inline, because it is served at arbitrary paths and cannot rely on
   a relative stylesheet.

   Sections 1 and 2 are copied unchanged from the EMW bundle
   (tokens/tokens.css and the parts of _ds_bundle.css this site uses).
   Section 3 is this site's own layout glue, written as real CSS on the
   tokens — the house forbids utility classes and hex literals in glue.
   ══════════════════════════════════════════════════════════════════════ */


/* ══ 1 · TOKENS ════════════════════════════════════════ unchanged ═══ */

:root{
  --emw-black:#111111;
  --emw-charcoal:#242424;
  --emw-paper:#F5F3ED;
  --emw-white:#FAF9F5;
  --emw-walnut:#49382C;
  --emw-oxblood:#641F28;
  --emw-slate:#59616A;
  --emw-blue:#243A4A;
  --emw-brass:#A48755;
  /* derived for accessibility — see EMW-01 */
  --emw-brass-ink:#7E6539;
  --emw-slate-raised:#9AA1A9;

  /* TYPOGRAPHY */
  --font-sans:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  --font-serif:'Newsreader','Iowan Old Style','Times New Roman',Times,serif;
  --font-mono:'IBM Plex Mono','SFMono-Regular',Menlo,Consolas,monospace;

  /* SPACING — editorial rhythm, not a linear ramp */
  --space-1:4px;  --space-2:8px;   --space-3:16px;  --space-4:24px;
  --space-5:40px; --space-6:64px;  --space-7:104px; --space-8:168px;

  /* RADIUS — capped at 4px. Institutions do not have rounded corners. */
  --radius-none:0px; --radius-sm:2px; --radius-md:4px;

  /* BORDER */
  --border-hairline:1px; --border-thin:1px; --border-strong:2px;

  /* MOTION */
  --motion-fast:160ms; --motion-standard:320ms; --motion-deliberate:640ms;
  --ease-emw:cubic-bezier(.2,.6,.2,1);

  /* LAYOUT */
  --page-max:1440px;
  --rail-w:216px;
  --gutter:24px;
  --margin-x:var(--space-6);
}

/* LIGHT (default) */
:root,[data-theme="light"]{
  --surface-base:#F5F3ED;
  --surface-raised:#FAF9F5;
  --surface-sunken:#EBE7DC;
  --surface-inverse:#111111;
  --ink-primary:#111111;
  --ink-secondary:#3B3B3B;
  --ink-tertiary:#59616A;
  --ink-inverse:#FAF9F5;
  --accent:#A48755;
  --accent-ink:#7E6539;
  --rule-hairline:rgba(17,17,17,.14);
  --rule-thin:rgba(17,17,17,.28);
  --rule-strong:rgba(17,17,17,.72);
  --sem-success:#3D5A45;
  --sem-warning:#8A6A2F;
  --sem-critical:#641F28;
  --sem-info:#243A4A;
  --chart-grid:rgba(17,17,17,.10);
  --focus:#243A4A;
}

/* DARK — the terminal palette. Navy ground, gold accent, ivory ink. */
[data-theme="dark"]{
  --surface-base:#0B1117;
  --surface-raised:#111827;
  --surface-sunken:#16202E;
  --surface-inverse:#F5F0E6;
  --ink-primary:#F5F0E6;
  --ink-secondary:#C9CFD6;
  --ink-tertiary:#A8A29E;
  --ink-inverse:#0B1117;
  --accent:#B08D57;
  --accent-ink:#B08D57;
  --rule-hairline:#23303F;
  --rule-thin:#2C3A4A;
  --rule-strong:#5E6B7A;
  --sem-success:#6FA287;
  --sem-warning:#D99A26;
  --sem-critical:#D2755C;
  --sem-info:#5B8DAE;
  --chart-grid:#23303F;
  --focus:#B08D57;
}


/* ══ 2 · EMW BUNDLE (subset) ═══════════════════════════ unchanged ═══ */

/* RESET & BASE */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  background:var(--surface-base);
  color:var(--ink-primary);
  font-family:var(--font-sans);
  font-size:16px;
  line-height:1.6;
  font-feature-settings:"tnum" 1,"cv05" 1;
  -webkit-font-smoothing:antialiased;
  transition:background var(--motion-standard) var(--ease-emw),color var(--motion-standard) var(--ease-emw);
}
img{max-width:100%;display:block}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
a{color:inherit}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
::selection{background:var(--accent);color:var(--ink-inverse)}
hr{border:0;border-top:var(--border-hairline) solid var(--rule-hairline);margin:0}

/* TYPE SCALE */
.t-display{font-family:var(--font-serif);font-weight:300;font-size:clamp(46px,8.4vw,112px);line-height:.96;letter-spacing:-.022em;margin:0}
.t-h1{font-family:var(--font-serif);font-weight:300;font-size:clamp(34px,5vw,62px);line-height:1.04;letter-spacing:-.018em;margin:0}
.t-h2{font-family:var(--font-sans);font-weight:600;font-size:clamp(21px,2.4vw,30px);line-height:1.22;letter-spacing:-.014em;margin:0}
.t-h3{font-family:var(--font-sans);font-weight:600;font-size:17px;line-height:1.35;letter-spacing:-.008em;margin:0}
.t-lead{font-family:var(--font-sans);font-weight:300;font-size:clamp(17px,1.6vw,21px);line-height:1.55;letter-spacing:-.006em;color:var(--ink-secondary);margin:0}
.t-body{font-size:15.5px;line-height:1.68;color:var(--ink-secondary);margin:0}
.t-small{font-size:13.5px;line-height:1.6;color:var(--ink-secondary);margin:0}
.t-caption{font-size:12.5px;line-height:1.5;color:var(--ink-tertiary);margin:0}
.t-label{font-family:var(--font-mono);font-size:10.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-tertiary);margin:0}
.t-meta{font-family:var(--font-mono);font-size:11px;letter-spacing:.05em;color:var(--ink-tertiary);margin:0}
.t-quote{font-family:var(--font-serif);font-style:italic;font-weight:300;font-size:clamp(22px,3vw,36px);line-height:1.3;letter-spacing:-.012em;margin:0}
.serif{font-family:var(--font-serif)}
.mono{font-family:var(--font-mono)}
.brass{color:var(--accent-ink)}

/* SIGNATURE DEVICE — THE INTERRUPTED RULE (CMP-DIV-01) */
.rule{display:flex;align-items:center;gap:var(--space-3);width:100%}
.rule::before,.rule::after{content:"";flex:1;height:1px;background:var(--rule-hairline)}
.rule > *{flex:0 0 auto}
.rule--left::before{flex:0 0 40px}
.rule-mark{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-tertiary);white-space:nowrap}
.rule-mark .sep{color:var(--accent);padding:0 .35em}

/* LAYOUT */
.shell{max-width:var(--page-max);margin:0 auto;padding:0 var(--margin-x)}
.section{padding:var(--space-8) 0 0;scroll-margin-top:96px}
.section-head{margin-bottom:var(--space-6)}
.section-head .rule{margin-bottom:var(--space-5)}
.sh-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.82fr);gap:var(--space-6);align-items:end}
.sh-num{font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;color:var(--accent-ink);display:block;margin-bottom:var(--space-3)}
.grid{display:grid;gap:var(--gutter)}
.grid>*{min-width:0}
.stack-3>*+*{margin-top:var(--space-3)}
.stack-4>*+*{margin-top:var(--space-4)}
.stack-5>*+*{margin-top:var(--space-5)}

/* INDEX RAIL — persistent document navigation */
.rail{
  position:fixed;top:0;left:0;bottom:0;width:var(--rail-w);
  border-right:var(--border-hairline) solid var(--rule-hairline);
  background:var(--surface-base);
  display:flex;flex-direction:column;
  padding:var(--space-4) 0 var(--space-3);
  z-index:60;
  transition:background var(--motion-standard) var(--ease-emw);
}
.rail-brand{padding:0 var(--space-4) var(--space-4);border-bottom:var(--border-hairline) solid var(--rule-hairline)}
.rail-wordmark{font-family:var(--font-sans);font-weight:600;font-size:19px;letter-spacing:.26em;line-height:1;color:var(--ink-primary)}
.rail-sub{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.18em;color:var(--ink-tertiary);margin-top:8px;text-transform:uppercase}
.rail-list{flex:1;overflow-y:auto;padding:var(--space-3) 0;margin:0;list-style:none;scrollbar-width:thin}
.rail-item{margin:0}
.rail-link{
  display:grid;grid-template-columns:26px 1fr;gap:10px;align-items:baseline;
  padding:6px var(--space-4);text-decoration:none;
  font-size:12.5px;letter-spacing:.01em;color:var(--ink-tertiary);
  border-left:2px solid transparent;
  transition:color var(--motion-fast) var(--ease-emw),border-color var(--motion-fast) var(--ease-emw);
}
.rail-link .n{font-family:var(--font-mono);font-size:10px;letter-spacing:.08em}
.rail-link:hover{color:var(--ink-primary)}
.rail-link[aria-current="true"]{color:var(--ink-primary);border-left-color:var(--accent);font-weight:500}
.rail-foot{padding:var(--space-3) var(--space-4) 0;border-top:var(--border-hairline) solid var(--rule-hairline)}
/* The contrast mark (ThemeToggle). The filled side is the ink the page is
   currently set in. Rotates 180deg on change — the one place a disc is
   allowed to be round. */
.theme-toggle{
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;padding:0;background:transparent;
  border:0;border-radius:50%;color:var(--ink-tertiary);cursor:pointer;
  transition:color var(--motion-fast) var(--ease-emw);
}
.theme-toggle:hover{color:var(--ink-primary)}
.theme-toggle svg{width:18px;height:18px;display:block;transition:transform var(--motion-standard) var(--ease-emw)}
.theme-toggle circle{fill:none;stroke:currentColor;stroke-width:1.5}
.theme-toggle .disc{fill:currentColor;stroke:none}
[data-theme="dark"] .theme-toggle svg{transform:rotate(180deg)}
@media (prefers-reduced-motion: reduce){.theme-toggle svg{transition:none}}
.rail-stamp{margin-top:var(--space-3);font-family:var(--font-mono);font-size:9px;letter-spacing:.1em;color:var(--ink-tertiary);line-height:1.7}

.page{margin-left:var(--rail-w)}
.menu-btn{display:none}

.skip{
  position:absolute;left:-9999px;top:0;z-index:100;
  background:var(--ink-primary);color:var(--ink-inverse);padding:12px 18px;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
}
.skip:focus{left:var(--space-3);top:var(--space-3)}

/* RESPONSIVE — the rail collapses into a document header */
@media (max-width:1140px){
  :root{--margin-x:var(--space-5)}
  .rail{
    position:sticky;top:0;left:auto;bottom:auto;width:100%;
    border-right:0;border-bottom:var(--border-hairline) solid var(--rule-hairline);
    flex-direction:row;align-items:center;gap:var(--space-4);
    padding:0 var(--space-5);height:60px;
  }
  .rail-brand{border-bottom:0;padding:0;display:flex;align-items:baseline;gap:var(--space-3)}
  .rail-sub{margin-top:0}
  .rail-list{
    position:fixed;top:60px;left:0;right:0;bottom:0;
    background:var(--surface-base);padding:var(--space-4) var(--space-5) var(--space-6);
    display:none;overflow-y:auto;
  }
  .rail-list.open{display:block}
  .rail-link{padding:9px 0;font-size:15px;grid-template-columns:34px 1fr;border-left:0;border-bottom:var(--border-hairline) solid var(--rule-hairline)}
  .rail-link[aria-current="true"]{border-left:0}
  .rail-foot{border-top:0;padding:0;margin-left:auto;display:flex;align-items:center;gap:var(--space-3)}
  .rail-stamp{display:none}
  .page{margin-left:0}
  .menu-btn{display:block;font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-primary)}
  .sh-grid{grid-template-columns:1fr;gap:var(--space-4);align-items:start}
}
@media (max-width:720px){
  :root{--margin-x:20px;--space-8:96px;--space-7:64px}
  .rule{flex-wrap:wrap;gap:var(--space-2) var(--space-3)}
  .rule>*{flex:1 1 auto;min-width:0}
  .rule-mark{white-space:normal;min-width:0;word-break:normal;overflow-wrap:anywhere}
  .rule::before,.rule::after{flex:1 1 14px;min-width:10px}
  .rail{padding:0 20px;gap:var(--space-3)}
  .rail-sub{display:none}
  .hero-top{gap:6px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;transition-duration:.001ms !important}
}

/* EMW-00 — HERO, MOT-01 REVEAL, DNA ROW */
.hero{padding:var(--space-7) 0 var(--space-6);border-bottom:var(--border-hairline) solid var(--rule-hairline)}
.hero-top{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-4);flex-wrap:wrap;margin-bottom:var(--space-7)}
.hero-line{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:var(--space-6);align-items:end;margin-top:var(--space-5)}
.hero-tag{font-family:var(--font-serif);font-weight:300;font-size:clamp(24px,3.4vw,42px);line-height:1.14;letter-spacing:-.016em;margin:0}
.hero-tag em{font-style:italic;color:var(--accent-ink)}
.reveal{opacity:0;transform:translateY(14px);transition:opacity var(--motion-deliberate) var(--ease-emw),transform var(--motion-deliberate) var(--ease-emw)}
.reveal.in{opacity:1;transform:none}

.dna{border-top:var(--border-hairline) solid var(--rule-hairline);margin-top:var(--space-6);padding-top:var(--space-5)}
.dna-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:var(--space-4);align-items:stretch}
.dna-cell{position:relative;padding:var(--space-4) 0 0}
.dna-cell::before{content:"";position:absolute;top:0;left:0;width:28px;height:2px;background:var(--rule-strong)}
.dna-cell h4{font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;margin:0 0 10px;color:var(--ink-primary)}
@media (max-width:1140px){
  .dna-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-line{grid-template-columns:1fr}
}
.charlist{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--space-4)}
.chip{
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  border:var(--border-hairline) solid var(--rule-thin);padding:6px 11px;border-radius:var(--radius-sm);
  color:var(--ink-secondary);
}
.state{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-tertiary)}
.state--live{color:var(--sem-success)}
.state--live::before{content:"";display:inline-block;width:5px;height:5px;background:var(--sem-success);margin-right:7px;vertical-align:middle}

/* BUTTONS (CMP-BTN-01) */
.btn{
  display:inline-flex;align-items:center;gap:9px;
  padding:11px 22px;border-radius:var(--radius-sm);
  font-size:13.5px;font-weight:500;letter-spacing:.01em;
  border:var(--border-thin) solid transparent;
  transition:background var(--motion-fast) var(--ease-emw),color var(--motion-fast) var(--ease-emw),border-color var(--motion-fast) var(--ease-emw);
}
.btn--primary{background:var(--ink-primary);color:var(--ink-inverse)}
.btn--primary:hover{background:var(--emw-blue)}
[data-theme="dark"] .btn--primary:hover{background:var(--accent);color:#111}
.btn--secondary{border-color:var(--rule-strong);color:var(--ink-primary)}
.btn--secondary:hover{background:var(--ink-primary);color:var(--ink-inverse);border-color:var(--ink-primary)}
.btn--tertiary{padding-left:0;padding-right:0;color:var(--ink-primary);border-bottom:var(--border-thin) solid var(--accent);border-radius:0}
.btn--tertiary:hover{border-bottom-color:var(--ink-primary)}
.btn .arw{font-family:var(--font-mono);font-size:12px}

/* DATA TABLE (CMP-TBL-01) */
.dtable{width:100%;border-collapse:collapse;font-size:13.5px}
.dtable th{
  text-align:left;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--ink-tertiary);font-weight:500;padding:0 var(--space-3) 9px 0;
  border-bottom:var(--border-thin) solid var(--rule-thin);white-space:nowrap;
}
.dtable td{padding:11px var(--space-3) 11px 0;border-bottom:var(--border-hairline) solid var(--rule-hairline);font-variant-numeric:tabular-nums}
.dtable tbody tr{transition:background var(--motion-fast) var(--ease-emw)}
.dtable tbody tr:hover{background:var(--surface-sunken)}
.dtable .num{text-align:right;font-family:var(--font-mono);font-size:12.5px}
.dtable th.num{text-align:right}
.dtable .name{font-weight:500;color:var(--ink-primary)}

/* FILTERS (CMP-FLT-01) */
.filters{display:flex;flex-wrap:wrap;gap:8px}
.filter{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;
  padding:7px 13px;border:var(--border-hairline) solid var(--rule-thin);border-radius:var(--radius-sm);
  color:var(--ink-secondary);transition:all var(--motion-fast) var(--ease-emw);
}
.filter:hover{border-color:var(--ink-primary);color:var(--ink-primary)}
.filter[aria-pressed="true"]{background:var(--ink-primary);color:var(--ink-inverse);border-color:var(--ink-primary)}

/* STATUS (CMP-STA-01) */
.status{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase}
.status i{width:6px;height:6px;display:block;background:currentColor;border-radius:50%}
.s-ok{color:var(--sem-success)}

/* ALERT (CMP-ALR-01) */
.alert{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-3);padding:var(--space-3) var(--space-4);border:var(--border-hairline) solid var(--rule-hairline);border-left:var(--border-strong) solid var(--a-c,var(--ink-primary));background:var(--surface-base)}
.alert h5{margin:0 0 3px;font-size:13.5px;font-weight:600}
.alert p{margin:0;font-size:13px;color:var(--ink-secondary);line-height:1.55}
.alert .ax{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;color:var(--a-c);text-transform:uppercase;padding-top:2px}

/* QUOTE (CMP-QTE-01) */
.quote{border-left:var(--border-strong) solid var(--accent);padding:var(--space-2) 0 var(--space-2) var(--space-4);margin:0}
.quote footer{margin-top:var(--space-3);font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-tertiary)}

/* INSIGHT — where the page stops reporting and states a view */
.insight{background:var(--surface-sunken);padding:var(--space-5);margin-top:var(--space-5)}
.insight .t-quote{margin:var(--space-3) 0 var(--space-4)}

/* PRINCIPLE CARDS */
.prin{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gutter) var(--space-5);margin-top:var(--space-5)}
.prin-card{border-top:var(--border-hairline) solid var(--rule-thin);padding-top:var(--space-3)}
.prin-num{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.16em;color:var(--accent-ink);display:block;margin-bottom:10px}
.prin-card h4{margin:0 0 6px;font-size:14.5px;font-weight:600;letter-spacing:-.005em}
@media (max-width:1140px){.prin{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.prin{grid-template-columns:1fr}}

/* COLOPHON */
.colophon{margin-top:var(--space-8);padding:var(--space-8) 0 var(--space-6);border-top:var(--border-strong) solid var(--rule-strong);text-align:left}
.colophon .cl{font-family:var(--font-serif);font-weight:300;font-size:clamp(20px,2.8vw,34px);line-height:1.2;letter-spacing:-.012em;margin:0}
.colophon .cl em{font-style:italic;color:var(--accent-ink)}
.colophon-meta{display:flex;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap;margin-top:var(--space-7);padding-top:var(--space-3);border-top:var(--border-hairline) solid var(--rule-hairline)}

/* NAVIGATION PANEL — tiles on a 1px hairline grid */
.navpanel{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--rule-hairline);border:var(--border-hairline) solid var(--rule-hairline);margin-top:var(--space-4)}
.nav-tile{
  background:var(--surface-base);padding:var(--space-4) var(--space-3) var(--space-4);
  text-decoration:none;display:block;position:relative;min-height:118px;
  transition:background var(--motion-fast) var(--ease-emw);
}
.nav-tile::before{content:"";position:absolute;top:0;left:0;width:0;height:2px;background:var(--accent);transition:width var(--motion-standard) var(--ease-emw)}
.nav-tile:hover{background:var(--surface-raised)}
.nav-tile:hover::before{width:44px}
.nav-tile .nt-ref{font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;color:var(--accent-ink);display:block;margin-bottom:var(--space-3)}
.nav-tile .nt-name{font-size:15px;font-weight:600;letter-spacing:-.008em;display:block;margin-bottom:5px;color:var(--ink-primary)}
.nav-tile .nt-scope{font-size:12px;line-height:1.45;color:var(--ink-tertiary);display:block}

/* MOT-05 — PAGE TRANSITION (THE CURTAIN). Behaviour: page-transition.js */
.curtain{position:fixed;inset:0;z-index:900;visibility:hidden;pointer-events:none;--curtain-cols:7;--curtain-stagger:40ms}
html[data-curtain] .curtain{visibility:visible;pointer-events:auto}
.curtain-cols{position:absolute;inset:0;display:flex}
.curtain-col{
  flex:1 1 0;background:var(--surface-base);
  transform:translateY(100%);will-change:transform;
  transition:transform var(--motion-deliberate) var(--ease-emw);
  transition-delay:calc(var(--i) * var(--curtain-stagger));
}
.curtain-col + .curtain-col{border-left:var(--border-hairline) solid var(--rule-hairline)}
html[data-curtain="closed"] .curtain-col{transform:translateY(0)}
html[data-curtain="opening"] .curtain-col{
  transform:translateY(-100%);
  transition-delay:calc((var(--curtain-cols) - 1 - var(--i)) * var(--curtain-stagger));
}
.curtain-label{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  gap:.06em;opacity:0;transition:opacity var(--motion-standard) var(--ease-emw);
}
html[data-curtain="closed"] .curtain-label{opacity:1;transition-delay:200ms}
.curtain-name,.curtain-dot{font-family:var(--font-serif);font-weight:300;font-size:clamp(30px,5.2vw,62px);line-height:1;letter-spacing:-.018em}
.curtain-name{color:var(--ink-primary)}
.curtain-name::before{content:var(--curtain-label,"")}
.curtain-dot{color:var(--accent)}
.curtain:not(.is-animated) .curtain-col,
.curtain:not(.is-animated) .curtain-label{transition:none}
@media (prefers-reduced-motion:reduce){
  .curtain-cols{display:none}
  .curtain{background:var(--surface-base);opacity:0;transition:opacity var(--motion-fast) linear}
  html[data-curtain="closed"] .curtain{opacity:1}
  html[data-curtain="opening"] .curtain{opacity:0}
}


/* ══ 3 · SITE GLUE ═════════════════════════════════════ this site ═══ */

/* Content stays visible if scripts never run. */
html:not(.js) .reveal{opacity:1;transform:none}

/* The M — the Terminal's brand mark, drawn in the current palette's ink.
   The viewBox is cropped to the stroke's own bounds (miter tips included),
   so the mark sits flush with the text column instead of floating inside
   an empty margin. */
.mark{display:block;width:36px;height:auto;aspect-ratio:92/76;color:var(--ink-primary);flex:none}
.mark path{fill:none;stroke:currentColor;stroke-width:12;stroke-linejoin:miter;stroke-miterlimit:6}
.mark--sm{width:18px}
.mark--lg{width:48px}
.mark--xl{width:clamp(72px,9vw,120px)}

/* The brass full stop — the curtain's own device, carried onto titles. */
.dot{color:var(--accent)}
.t-display em,.statement em{font-style:italic;color:var(--accent-ink)}

.shell > :first-child{margin-top:0}
p{margin:0}

/* ── site bar (landing page) ─────────────────────────────── */
.site-bar{
  position:sticky;top:0;z-index:50;background:var(--surface-base);
  border-bottom:var(--border-hairline) solid var(--rule-hairline);
  transition:background var(--motion-standard) var(--ease-emw);
}
.site-bar .shell{height:60px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4)}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;min-width:0}
.brand-word{font-family:var(--font-sans);font-weight:600;font-size:13px;letter-spacing:.22em;line-height:1;white-space:nowrap;color:var(--ink-primary)}
.brand-sub{font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-tertiary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.bar-end{display:flex;align-items:center;gap:var(--space-4);flex:none}
.bar-end .btn--tertiary{padding-top:4px;padding-bottom:4px;text-decoration:none}
a.btn{text-decoration:none}

/* ── landing ─────────────────────────────────────────────── */
.landing{min-height:100vh;display:flex;flex-direction:column}
/* width is stated, not inherited: main is a flex item with auto side margins,
   so without it the column shrinks to its widest line — the headline */
.landing main{flex:1;width:100%}
.landing .hero{border-bottom:0;padding-bottom:0}
.landing .hero-top{margin-bottom:var(--space-6)}
.landing .mark--lg{margin-bottom:var(--space-5)}
.acts{display:flex;flex-wrap:wrap;gap:var(--space-3);justify-content:flex-end}
.dna-row--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.dna-cell p{margin:0}
.site-foot{border-top:var(--border-hairline) solid var(--rule-hairline);margin-top:var(--space-7)}
.site-foot .shell{
  padding-top:var(--space-4);padding-bottom:var(--space-5);min-height:24px;
  display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--space-3);
}
@media (max-width:1140px){
  .acts{justify-content:flex-start}
  .dna-row--4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  .brand-sub{display:none}
  .acts{flex-direction:column;align-items:stretch}
  .acts .btn{justify-content:space-between}
  .dna-row--4{grid-template-columns:minmax(0,1fr)}
}
/* phones: the hero's own Sign in button is one thumb away */
@media (max-width:480px){
  .brand-word{font-size:12px;letter-spacing:.18em}
  .bar-end .btn--tertiary{display:none}
}

/* ── document rail (explore) ─────────────────────────────── */
.rail-brand a{display:flex;align-items:center;gap:12px;text-decoration:none}
.rail-wordmark--long{font-size:12px;letter-spacing:.22em;line-height:1.5}
.rail-wordmark--long span{display:block}
.rail-part{
  margin:var(--space-3) 0 var(--space-1);padding:0 var(--space-4);
  font-family:var(--font-mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink-tertiary);opacity:.8;
}
.rail-part:first-child{margin-top:0}
.rail-foot-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
.rail-foot-row .btn--tertiary{font-size:12.5px;padding-top:3px;padding-bottom:3px}
@media (max-width:1140px){
  .rail-wordmark--long span{display:inline}
  .rail-part{padding:0;margin-top:var(--space-4)}
  .rail-foot-row{gap:var(--space-4)}
}
@media (max-width:720px){
  .rail-list{padding-left:20px;padding-right:20px}
  .rail-brand .mark{display:none}
  .rail-foot-row .btn--tertiary{display:none}
}

/* ── document hero (explore) ─────────────────────────────── */
.doc-hero .mark--lg{margin-bottom:var(--space-5)}
.doc-hero .hero-line{align-items:start}
.doc-hero .t-lead + .t-lead{margin-top:var(--space-3)}
.doc-hero .alert{margin-top:var(--space-5);--a-c:var(--accent)}
.doc-hero .btn--tertiary{margin-top:var(--space-5)}
.facts td{padding-top:10px;padding-bottom:10px}
.facts td.k{font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-tertiary)}
.facts tr:first-child td{border-top:var(--border-thin) solid var(--rule-thin)}
.facts td.num .status{justify-content:flex-end}

/* ── part dividers ───────────────────────────────────────── */
.part{margin-top:var(--space-8);padding-top:var(--space-4);border-top:var(--border-strong) solid var(--rule-strong);scroll-margin-top:96px}
.part .t-label{color:var(--accent-ink);margin-bottom:var(--space-3)}
.part + .section{padding-top:var(--space-7)}

/* ── section heads and prose ─────────────────────────────── */
.statement{font-family:var(--font-serif);font-weight:300;font-size:clamp(30px,3.6vw,48px);line-height:1.08;letter-spacing:-.018em;margin:0;max-width:20ch}
.sec-body > * + *{margin-top:var(--space-6)}
.prose > * + *{margin-top:var(--space-3)}
.prose .t-body{max-width:66ch}
.kicker{color:var(--ink-primary);border-top:var(--border-hairline) solid var(--rule-hairline);padding-top:var(--space-3);margin-top:var(--space-4) !important}
.block-label{display:block;margin-bottom:var(--space-3)}

.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--space-6);align-items:start}
.split--flip{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}
.split--even{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.split > *{min-width:0}
@media (max-width:1000px){.split,.split--flip,.split--even{grid-template-columns:minmax(0,1fr);gap:var(--space-5)}}

figure{margin:0}
.figcap{
  display:block;margin-top:var(--space-3);
  font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-tertiary);line-height:1.6;
}
.figcap b{color:var(--accent-ink);font-weight:500}
.scroll-x{overflow-x:auto}

/* ── disclosure rows ─────────────────────────────────────── */
.disc{border-top:var(--border-thin) solid var(--rule-thin)}
.disc details{border-bottom:var(--border-hairline) solid var(--rule-hairline)}
.disc summary{
  list-style:none;cursor:pointer;
  display:grid;grid-template-columns:40px minmax(0,200px) minmax(0,1fr) 20px;
  gap:var(--space-4);align-items:baseline;padding:var(--space-3) 0;
  transition:padding-left var(--motion-standard) var(--ease-emw);
}
.disc summary::-webkit-details-marker{display:none}
.disc summary:hover{padding-left:var(--space-2)}
.disc summary:focus-visible{outline-offset:-2px}
.disc .n{font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;color:var(--accent-ink)}
.disc .k{font-size:15px;font-weight:600;letter-spacing:-.005em;color:var(--ink-primary)}
.disc .q{font-size:15px;color:var(--ink-secondary)}
.disc .pm{font-family:var(--font-mono);font-size:14px;color:var(--ink-tertiary);text-align:right}
.disc details:not([open]) .pm::before{content:"+"}
.disc details[open] .pm::before{content:"\2212"}
.disc details[open] .pm{color:var(--accent-ink)}
.disc .body{padding:0 0 var(--space-4) calc(40px + var(--space-4));max-width:calc(80ch + 64px)}
.disc .body .t-label{display:block;color:var(--accent-ink);margin-bottom:var(--space-2)}
.disc .is-pivot .k{color:var(--accent-ink)}
.disc--short summary{grid-template-columns:40px minmax(0,1fr) 20px}
.disc--short .is-gate .k{color:var(--accent-ink)}
@media (max-width:720px){
  .disc summary{grid-template-columns:28px minmax(0,1fr) 16px;gap:var(--space-1) var(--space-3)}
  .disc summary .q{grid-column:2 / 3;grid-row:2;font-size:14px}
  .disc--short summary{grid-template-columns:28px minmax(0,1fr) 16px}
  .disc .body{padding-left:calc(28px + var(--space-3))}
}

/* chains of chips, joined by the mono arrow */
.chain{display:flex;flex-wrap:wrap;align-items:center;gap:8px 9px;margin-top:var(--space-3)}
.chain .arw{font-family:var(--font-mono);font-size:12px;color:var(--ink-tertiary)}
.chain .t-label{flex-basis:100%;margin-bottom:-2px}
.chain--now .chip{border-color:var(--accent);color:var(--ink-primary)}

/* ── 01 · before / after ─────────────────────────────────── */
.compare td{font-size:15px;color:var(--ink-tertiary);vertical-align:baseline}
.compare td.name{color:var(--ink-primary);font-weight:400}
.compare td.arw,.compare th.arw{width:48px;text-align:center;font-family:var(--font-mono);color:var(--accent)}
.compare th.to{color:var(--accent-ink)}

/* ── 02 · the loop ───────────────────────────────────────── */
.loop{display:block;width:100%;max-width:520px;height:auto;margin:0 auto}
.loop .ring{fill:none;stroke:var(--rule-thin);stroke-width:1.5}
.loop .arc{fill:none;stroke:var(--accent);stroke-width:2}
.loop .chev{fill:var(--ink-tertiary)}
.loop .chev--acc{fill:var(--accent)}
.loop .node{fill:var(--surface-base);stroke:var(--ink-primary);stroke-width:1.5}
.loop .node--acc{fill:var(--accent);stroke:var(--accent)}
.loop .lbl{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.14em;fill:var(--ink-primary)}
.loop .ctr{font-family:var(--font-serif);font-style:italic;font-weight:300;font-size:22px;fill:var(--ink-secondary)}

/* ── 03 · module grid ────────────────────────────────────── */
.legend{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);align-items:baseline}
.navpanel--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.nav-tile{display:flex;flex-direction:column}
.nav-tile .nt-scope{font-size:13px;color:var(--ink-secondary);flex:1}
.nav-tile .state{margin-top:var(--space-3)}
.nav-tile--static:hover{background:var(--surface-base)}
.nav-tile--static:hover::before{width:0}
.nav-tile .nt-go{display:block;margin-top:var(--space-2);font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-ink)}
@media (max-width:1300px){.navpanel--5{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.navpanel--5{grid-template-columns:minmax(0,1fr)}.nav-tile{min-height:0}}

/* ── 04 · design framework ───────────────────────────────── */
.frame{list-style:none;margin:0;padding:0;border-top:var(--border-thin) solid var(--rule-thin)}
.frame li{
  display:grid;grid-template-columns:56px minmax(0,220px) minmax(0,1fr);gap:var(--space-4);
  align-items:baseline;padding:var(--space-4) 0;border-bottom:var(--border-hairline) solid var(--rule-hairline);
}
.frame .n{font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;color:var(--accent-ink)}
.frame .v{font-size:15px;line-height:1.65;color:var(--ink-secondary);max-width:72ch}
.frame .is-out{background:var(--surface-sunken);box-shadow:inset 2px 0 0 var(--accent);padding-left:var(--space-3);padding-right:var(--space-3)}
.frame .is-out .t-h3{color:var(--accent-ink)}
@media (max-width:900px){
  .frame li{grid-template-columns:40px minmax(0,1fr);gap:var(--space-1) var(--space-3)}
  .frame .v{grid-column:2}
}

.decomp{display:block;width:100%;height:auto;border:var(--border-hairline) solid var(--rule-hairline);background:var(--surface-raised)}
.dc-box{fill:var(--surface-base);stroke:var(--rule-thin);stroke-width:1}
.dc-box--lead{stroke:var(--rule-strong)}
.dc-box--mute{fill:none;stroke:var(--rule-thin);stroke-dasharray:3 3}
.dc-box--hot{fill:var(--accent);fill-opacity:.08;stroke:var(--accent)}
.dc-t{font-family:var(--font-sans);font-size:15px;font-weight:500;fill:var(--ink-primary)}
.dc-t--mute{fill:var(--ink-tertiary)}
.dc-t--hot{fill:var(--accent-ink)}
.dc-s{font-family:var(--font-mono);font-size:11px;fill:var(--ink-tertiary);letter-spacing:.04em}
.dc-step{font-family:var(--font-mono);font-size:10px;fill:var(--accent-ink);letter-spacing:.16em}
.dc-note{font-family:var(--font-mono);font-size:10.5px;fill:var(--ink-tertiary);letter-spacing:.05em}
.dc-sum{font-family:var(--font-serif);font-size:19px;font-weight:300;fill:var(--ink-primary)}
.dc-l{stroke:var(--rule-strong);stroke-width:1;fill:none}
.dc-l--hot{stroke:var(--accent);stroke-width:1.4}
.dc-rule{stroke:var(--rule-hairline);stroke-width:1}
.dc-tick{stroke:var(--accent);stroke-width:2}
@media (max-width:700px){.dc-t{font-size:19px}.dc-s,.dc-note{font-size:14px}.dc-step{font-size:13px}.dc-sum{font-size:22px}}

.shot{width:100%;height:auto;display:block;border:var(--border-hairline) solid var(--rule-thin)}

/* ── 05 · two architectures ──────────────────────────────── */
.arch{display:grid;grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr);border-top:var(--border-thin) solid var(--rule-thin)}
.arch-side{padding-top:var(--space-4);min-width:0}
.arch-side > .t-label{margin-bottom:var(--space-3)}
.arch-side--lead > .t-label{color:var(--accent-ink)}
.steps{list-style:none;margin:0;padding:0}
.steps li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:var(--space-3);padding:var(--space-3) 0;border-bottom:var(--border-hairline) solid var(--rule-hairline)}
.steps .n{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;color:var(--ink-tertiary);padding-top:2px}
.arch-side--lead .steps .n{color:var(--accent-ink)}
.steps .t-small{margin-top:2px}
.seam{position:relative}
.seam::before{content:"";position:absolute;left:50%;top:0;bottom:0;border-left:var(--border-hairline) dashed var(--accent)}
.seam span{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-90deg);
  font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--accent-ink);background:var(--surface-base);padding:6px 10px;white-space:nowrap;
}
@media (max-width:900px){
  .arch{grid-template-columns:minmax(0,1fr)}
  .seam{height:48px}
  .seam::before{left:0;right:0;top:50%;bottom:auto;border-left:0;border-top:var(--border-hairline) dashed var(--accent)}
  .seam span{transform:translate(-50%,-50%)}
}

/* ── 06 · system flow ────────────────────────────────────── */
.sys{border-top:var(--border-thin) solid var(--rule-thin)}
.sys-row{display:grid;grid-template-columns:168px minmax(0,1fr);gap:var(--space-4);align-items:center;padding:var(--space-4) 0;border-bottom:var(--border-hairline) solid var(--rule-hairline)}
.nodes{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.nodes > .arw{font-family:var(--font-mono);font-size:12px;color:var(--ink-tertiary)}
.node{
  border:var(--border-hairline) solid var(--rule-thin);border-radius:var(--radius-sm);
  background:var(--surface-raised);padding:9px 13px;
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-primary);line-height:1.35;
}
.node small{display:block;margin-top:3px;font-size:10px;letter-spacing:.03em;text-transform:none;color:var(--ink-tertiary)}
.node--gate{border-color:var(--accent)}
.node--out{border-style:dashed;border-color:var(--accent);background:transparent;color:var(--accent-ink)}
.fork{display:flex;flex-direction:column;gap:6px;padding-left:12px;border-left:var(--border-hairline) solid var(--rule-thin)}
@media (max-width:720px){.sys-row{grid-template-columns:minmax(0,1fr);gap:var(--space-3)}}

.prin--4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1300px){.prin--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.prin--4{grid-template-columns:minmax(0,1fr)}}
.dash{list-style:none;margin:var(--space-3) 0 0;padding:0}
.dash li{position:relative;padding:4px 0 4px 16px;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.04em;line-height:1.5;color:var(--ink-tertiary)}
.dash li::before{content:"";position:absolute;left:0;top:12px;width:8px;height:1px;background:var(--accent)}
.prin-card .t-caption{margin-top:var(--space-3);padding-top:var(--space-2);border-top:var(--border-hairline) solid var(--rule-hairline)}
.alert--brass{--a-c:var(--accent);max-width:820px}

/* ── 07 · control tower ──────────────────────────────────── */
.ticks{list-style:none;margin:0;padding:0;border-top:var(--border-hairline) solid var(--rule-hairline)}
.ticks li{position:relative;padding:var(--space-3) 0 var(--space-3) 20px;border-bottom:var(--border-hairline) solid var(--rule-hairline);font-size:15px;line-height:1.6;color:var(--ink-secondary)}
.ticks li::before{content:"";position:absolute;left:0;top:27px;width:9px;height:1px;background:var(--accent)}
.ticks strong{color:var(--ink-primary);font-weight:600}

.synth{border:var(--border-hairline) solid var(--rule-hairline);background:var(--surface-raised);padding:var(--space-5) var(--space-4)}
.synth .charlist{justify-content:center;margin-top:0;gap:6px}
.synth .chip{font-size:9.5px;padding:5px 9px;background:var(--surface-base)}
.fan{display:block;width:100%;height:56px;margin:var(--space-2) 0}
.fan path{stroke:var(--rule-thin);stroke-width:1;fill:none}
.tower{border:var(--border-hairline) solid var(--rule-thin);border-top:var(--border-strong) solid var(--accent);background:var(--surface-base);padding:var(--space-4)}
.tower .t-label{color:var(--accent-ink)}
.tower ul{list-style:none;margin:var(--space-3) 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px}
.tower li{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-primary);border-bottom:var(--border-hairline) solid var(--rule-thin);padding-bottom:4px}
.drop{display:block;margin:0 auto;width:12px;height:40px}
.drop path{stroke:var(--rule-strong);stroke-width:1}
.drop polygon{fill:var(--accent)}
.out{border:var(--border-hairline) solid var(--rule-thin);background:var(--surface-base);padding:var(--space-3) var(--space-4);text-align:center}
.out .o1{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-primary)}
.out .t-meta{margin-top:4px}
.out--decision{border-color:var(--accent)}
.out--decision .o1{color:var(--accent-ink)}

.dl{
  position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--space-4);align-items:center;
  border:var(--border-hairline) solid var(--rule-thin);background:var(--surface-raised);padding:var(--space-4);
  text-decoration:none;transition:border-color var(--motion-fast) var(--ease-emw);
}
.dl::before{content:"";position:absolute;top:-1px;left:-1px;width:34px;height:2px;background:var(--accent)}
.dl:hover{border-color:var(--rule-strong)}
.dl-icon{width:34px;height:42px;display:block}
.dl-icon .pg{fill:none;stroke:var(--rule-strong);stroke-width:1.5}
.dl-icon .ar{fill:none;stroke:var(--accent);stroke-width:1.5}
.dl .t-label{display:block;color:var(--accent-ink);margin-bottom:6px}
.dl .t-small{margin-top:6px;max-width:72ch}
.dl-end{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.dl:hover .btn--secondary{background:var(--ink-primary);color:var(--ink-inverse);border-color:var(--ink-primary)}
@media (max-width:900px){
  .dl{grid-template-columns:auto minmax(0,1fr)}
  .dl-end{grid-column:1 / -1;flex-direction:row;align-items:center;justify-content:space-between}
}

/* ── 08 / 09 · layered stacks ────────────────────────────── */
.layers{border:var(--border-hairline) solid var(--rule-hairline);background:var(--surface-raised);padding:var(--space-4)}
.layer{position:relative;border:var(--border-hairline) solid var(--rule-thin);background:var(--surface-base);padding:14px 18px;text-align:center}
.layer + .layer{margin-top:24px}
.layer + .layer::before{content:"";position:absolute;left:50%;top:-24px;height:24px;border-left:var(--border-hairline) solid var(--rule-thin)}
.layer .lt{display:block;font-family:var(--font-mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-primary)}
.layer .t-meta{display:block;margin-top:4px}
.layer--open{border-style:dashed;border-color:var(--accent);background:transparent}
.layer--open .lt{color:var(--accent-ink)}

.contractwrap{margin-top:var(--space-5);border:var(--border-hairline) solid var(--rule-thin)}
.contractwrap > summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;gap:var(--space-3);
  padding:var(--space-3) var(--space-4);
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-primary);
  transition:background var(--motion-fast) var(--ease-emw);
}
.contractwrap > summary::-webkit-details-marker{display:none}
.contractwrap > summary:hover{background:var(--surface-raised)}
.contractwrap .pm{margin-left:auto;font-size:14px;color:var(--ink-tertiary)}
.contractwrap:not([open]) .pm::before{content:"+"}
.contractwrap[open] .pm::before{content:"\2212"}
.contractwrap-body{padding:0 var(--space-4) var(--space-4)}
.contractwrap-body > .t-small{margin-bottom:var(--space-4)}
.contract-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-5)}
.contract-cols .t-label{margin-bottom:var(--space-2)}
.contract-cols .to{color:var(--accent-ink)}
.contract-cols ul{list-style:none;margin:0;padding:0}
.contract-cols li{padding:10px 0;border-top:var(--border-hairline) solid var(--rule-hairline);font-size:14px;line-height:1.55;color:var(--ink-secondary)}
@media (max-width:720px){.contract-cols{grid-template-columns:minmax(0,1fr);gap:var(--space-4)}}

/* ── line walk (landing) ─────────────────────────────────────
   "One terminal for the whole plant" — and here is the plant. The drawing
   is line-walk-quiet.html; what EMW supplies is every colour. The source's
   cream, amber and blue become tokens, so the scene turns with the palette
   and holds no hex of its own: line work in ink, steel and glass as the
   raised and sunken surfaces, brass wherever the source was amber, and
   water as the info blue let down into the ground.
   Built by linewalk.js; without script the figure is not shown at all. */
.linewalk{
  margin:var(--space-6) 0 0;
  --lw-line:var(--ink-secondary);
  --lw-faint:var(--rule-thin);
  --lw-steel:var(--surface-raised);
  --lw-glass:var(--surface-sunken);
  --lw-water:var(--sem-info);
  --lw-carton:var(--surface-sunken);
  --lw-cycle:.9s;
}
@supports (color:color-mix(in srgb,red,blue)){
  .linewalk{
    --lw-water:color-mix(in srgb,var(--sem-info) 52%,var(--surface-base));
    --lw-carton:color-mix(in srgb,var(--accent) 36%,var(--surface-base));
  }
}
html:not(.js) .linewalk{display:none}
/* the page's two actions sit under the scene, at its right-hand end —
   at every width until they stack on a phone */
.lw-acts{margin-top:var(--space-4);justify-content:flex-end}
@media (max-width:1140px){.lw-acts{justify-content:flex-end}}
/* A laptop-height screen: the same page with the air let out, so the
   headline, the plant and both actions share the first view. The headline
   keeps its size; only the gaps and the scene's height give. */
@media (min-width:721px) and (max-height:960px){
  .landing .hero{padding-top:var(--space-6)}
  .landing .hero-top{margin-bottom:var(--space-5)}
  .landing .mark--lg{margin-bottom:var(--space-4)}
  .linewalk{margin-top:var(--space-5)}
  .linewalk .lw-scene{height:clamp(190px,26vh,300px)}   /* outranks the base rule, which comes later */
}
html:not(.js) .lw-acts{margin-top:var(--space-6);justify-content:flex-start}
.linewalk > .rule{margin-bottom:var(--space-4)}

.lw-scene{
  position:relative;height:clamp(190px,21vw,300px);overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 96%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 96%,transparent 100%);
}
.lw-layer{position:absolute;left:0;top:0;height:100%;max-width:none;will-change:transform;overflow:visible}
.lw-walker{position:absolute;overflow:visible;z-index:2}

/* the drawing's vocabulary */
.lw-s{fill:none;stroke:var(--lw-line);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.lw-f{fill:var(--lw-steel);stroke:var(--lw-line);stroke-width:1.3;stroke-linejoin:round}
.lw-fp{fill:var(--surface-base);stroke:var(--lw-line);stroke-width:1.3;stroke-linejoin:round}
.lw-gl{fill:var(--lw-glass);stroke:var(--lw-line);stroke-width:1.3}
.lw-thin{stroke-width:.9}
.lw-am{fill:var(--accent)}
.lw-amf{fill:var(--accent);stroke:var(--lw-line);stroke-width:1.3;stroke-linejoin:round}
.lw-wa{fill:var(--lw-water)}
.lw-waf{fill:var(--lw-water);stroke:var(--lw-line);stroke-width:1.2}
.lw-ct{fill:var(--lw-carton);stroke:var(--lw-line);stroke-width:1.2}
.lw-gal{fill:var(--lw-water);fill-opacity:.6;stroke:var(--lw-line);stroke-width:1.2}
.lw-h{fill:none;stroke:var(--lw-faint);stroke-width:1.2;stroke-linejoin:round;stroke-linecap:round}
.lw-hf{fill:var(--surface-base);stroke:var(--lw-faint);stroke-width:1.2;stroke-linejoin:round}
.lw-walk{stroke:var(--accent);stroke-width:2;stroke-dasharray:16 10}
.lw-web{fill:none;stroke:var(--accent);stroke-width:2.4}
.lw-tag{font:500 5.5px/1 var(--font-mono);letter-spacing:.04em;fill:var(--ink-tertiary);text-anchor:middle}
.lw-tag.lw-on{fill:var(--emw-black)}                 /* set on brass, in either palette */

/* the plant's own clocks */
.lw-flow{fill:none;stroke:var(--lw-water);stroke-width:2.4;stroke-dasharray:6 8;animation:lw-dash 1.1s linear infinite}
.lw-spin{transform-box:fill-box;transform-origin:center;animation:lw-spin 4s linear infinite}
.lw-spin.lw-slow{animation-duration:7s}
.lw-blink{animation:lw-blink 2.4s var(--ease-emw) infinite}
.lw-glow{animation:lw-glow 2.6s ease-in-out infinite alternate}
.lw-row{animation:lw-flow .7s linear infinite}
.lw-fork{animation:lw-fork 7s ease-in-out infinite}
@keyframes lw-dash{to{stroke-dashoffset:-14}}
@keyframes lw-spin{to{transform:rotate(360deg)}}
@keyframes lw-blink{0%,100%{opacity:1}50%{opacity:.28}}   /* EMW's status pulse, not a hard flash */
@keyframes lw-glow{from{opacity:.35}to{opacity:.85}}
@keyframes lw-flow{to{transform:translateX(16px)}}
@keyframes lw-fork{0%,18%{transform:translateX(0)}45%,62%{transform:translateX(-26px)}88%,100%{transform:translateX(0)}}

/* the worker: hip, knee and shoulder, no sprite sheet */
.lw-walker .lw-j,.lw-walker .lw-fore{transform-box:view-box}
.lw-bob{animation:lw-bob var(--lw-cycle) ease-in-out infinite}
.lw-legA,.lw-legB{transform-origin:30px 62px;animation:lw-leg var(--lw-cycle) linear infinite}
.lw-shinA,.lw-shinB{transform-origin:30px 82px;animation:lw-shin var(--lw-cycle) linear infinite}
.lw-armA,.lw-armB{transform-origin:30px 37px;animation:lw-arm var(--lw-cycle) ease-in-out infinite}
.lw-legB,.lw-shinB,.lw-armB{animation-delay:calc(var(--lw-cycle) * -.5)}
.lw-fore{transform-origin:30px 52px;transform:rotate(-18deg)}
.lw-limb{stroke:var(--ink-primary);stroke-linecap:round;fill:none}
.lw-leg{stroke-width:6.5}
.lw-arm{stroke-width:5}
.lw-limb.lw-far{stroke:var(--ink-tertiary)}
.lw-far-fill{fill:var(--ink-tertiary)}
.lw-body{fill:var(--ink-primary)}
.lw-torso{fill:var(--ink-secondary)}
.lw-vest,.lw-hat{fill:var(--accent)}
.lw-stripe{stroke:var(--surface-base);stroke-width:1.6}
.lw-pocket{fill:var(--surface-base)}
@keyframes lw-bob{0%,50%,100%{transform:translateY(3px)}25%,75%{transform:translateY(-.5px)}}
@keyframes lw-leg{0%,100%{transform:rotate(-22deg)}50%{transform:rotate(22deg)}}
@keyframes lw-shin{0%,100%{transform:rotate(0)}30%{transform:rotate(6deg)}50%{transform:rotate(12deg)}72%{transform:rotate(48deg)}90%{transform:rotate(10deg)}}
@keyframes lw-arm{0%,100%{transform:rotate(18deg)}50%{transform:rotate(-18deg)}}

/* On the Segway. Legs still, both hands brought forward to the grip, and
   the whole unit — rider, post, deck — lifted by the wheel's height and
   leaned into its travel, pivoting on the axle. The lean breathes a couple
   of degrees, the way a self-balancer does; it does not bounce. */
.linewalk:not(.lw-seg) .lw-seg-part{display:none}
.lw-bob{transform-box:view-box;transform-origin:31px 107px}
.lw-seg .lw-bob{animation:lw-ride 1.9s ease-in-out infinite alternate}
.lw-seg .lw-legA,.lw-seg .lw-legB,.lw-seg .lw-shinA,.lw-seg .lw-shinB,
.lw-seg .lw-armA,.lw-seg .lw-armB{animation:none}
.lw-seg .lw-legA{transform:rotate(-3deg)}
.lw-seg .lw-legB{transform:rotate(4deg)}
.lw-seg .lw-shinA,.lw-seg .lw-shinB{transform:rotate(3deg)}
.lw-seg .lw-armA{transform:rotate(-35deg)}
.lw-seg .lw-armA .lw-fore{transform:rotate(-40deg)}
.lw-seg .lw-armB{transform:rotate(-28deg)}
.lw-seg .lw-armB .lw-fore{transform:rotate(-47deg)}
.lw-post{stroke:var(--ink-primary);stroke-width:2.2;stroke-linecap:round;fill:none}
.lw-grip{stroke:var(--accent);stroke-width:2.8;stroke-linecap:round;fill:none}
.lw-deck{fill:var(--ink-primary)}
.lw-tyre{fill:var(--surface-base);stroke:var(--ink-primary);stroke-width:2.6}
.lw-spoke{stroke:var(--ink-primary);stroke-width:.9;fill:none}
.lw-hub{fill:var(--accent)}
.lw-wheel{transform-origin:31px 107px;animation:lw-spin var(--lw-wheel,.3s) linear infinite}
@keyframes lw-ride{
  from{transform:translateY(-11.5px) rotate(4deg)}
  to{transform:translateY(-11.5px) rotate(6.5deg)}
}

/* Pushing the pallet jack. The legs keep their cycle, stretched to the
   slower pace so the feet still match the floor; the arms stop swinging and
   go out to the handle; and he leans into the load from the hip. The jack
   itself stands outside the group that bobs, so the cartons ride level.
   Its body is brass for the same reason real ones are yellow. */
.linewalk:not(.lw-jack) .lw-jack-part{display:none}
.linewalk.lw-jack{--lw-cycle:var(--lw-push-cycle,1.5s)}
.lw-jack .lw-bob{transform-origin:30px 62px;animation:lw-push var(--lw-cycle) ease-in-out infinite}
.lw-jack .lw-armA,.lw-jack .lw-armB{animation:none}
.lw-jack .lw-armA{transform:rotate(-42deg)}
.lw-jack .lw-armA .lw-fore{transform:rotate(11deg)}
.lw-jack .lw-armB{transform:rotate(-36deg)}
.lw-jack .lw-armB .lw-fore{transform:rotate(3deg)}
.lw-pal{fill:var(--lw-steel);stroke:var(--lw-line);stroke-width:.9;stroke-linejoin:round}
.lw-jack-body{fill:var(--accent)}
.lw-jack-loop{fill:none;stroke:var(--ink-primary);stroke-width:2}
.lw-tyre--sm{stroke-width:1.8}
.lw-jackwheel{transform-origin:52px 100.5px;animation:lw-spin var(--lw-jackwheel,.6s) linear infinite}
@keyframes lw-push{
  0%,50%,100%{transform:translateY(3px) rotate(5deg)}
  25%,75%{transform:translateY(-.5px) rotate(5deg)}
}

/* Night shift. Nothing to press: it is the dark palette. A moon and a few
   stars that do not scroll (they are too far away to), windows lit in
   brass, and a beam under the yard lamp. Each fades in on the deliberate
   duration, so flipping the palette reads as dusk rather than a switch. */
.lw-nightsky{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;
  opacity:0;transition:opacity var(--motion-deliberate) var(--ease-emw)}
.lw-star{fill:var(--ink-tertiary)}
.lw-star:nth-child(3n){animation:lw-blink 4.8s var(--ease-emw) infinite}
.lw-star:nth-child(4n){animation:lw-blink 6.4s var(--ease-emw) -2s infinite}
.lw-moon{fill:var(--ink-primary)}
.lw-moon-cut{fill:var(--surface-base)}
.lw-beam{fill:var(--accent);opacity:0;transition:opacity var(--motion-deliberate) var(--ease-emw)}
.lw-win{transition:fill var(--motion-deliberate) var(--ease-emw),fill-opacity var(--motion-deliberate) var(--ease-emw)}
[data-theme="dark"] .lw-nightsky{opacity:1}
[data-theme="dark"] .lw-beam{opacity:.13}
[data-theme="dark"] .lw-win{fill:var(--accent);fill-opacity:.62}
[data-theme="dark"] .lw-far-win{fill-opacity:.26}

/* he can be waved at */
.lw-walker{cursor:pointer}

/* off screen, and under reduced motion, all of it holds */
.lw-off .lw-scene *{animation-play-state:paused !important}
@media (prefers-reduced-motion:reduce){
  .lw-scene *{animation:none !important}
  .lw-seg .lw-bob{transform:translateY(-11.5px) rotate(5deg)}
  .lw-jack .lw-bob{transform:rotate(5deg)}
  .lw-walker{cursor:default}
}

/* how he gets around: three toggles at the far end of the rule */
.lw-rule .lw-modes{order:2;flex:0 0 auto;display:flex;gap:6px}

/* ── close ───────────────────────────────────────────────── */
.colophon .mark--xl{margin-bottom:var(--space-5)}
.colophon .t-h1{margin-bottom:var(--space-3)}
.colophon .acts{justify-content:flex-start;margin-top:var(--space-5)}
.colophon .prin{margin-top:var(--space-6)}
.colophon-meta a{text-decoration:none;border-bottom:var(--border-hairline) solid var(--rule-thin);padding-bottom:2px;transition:border-color var(--motion-fast) var(--ease-emw)}
.colophon-meta a:hover{border-bottom-color:var(--accent)}
.colophon-meta .t-meta{text-transform:uppercase;letter-spacing:.12em}