/* ============================================================================
   LEVENHALL / OKLAHOMA — Business Establishment Atlas
   Design language: a land-survey instrument. Oklahoma is a state laid out on a
   township grid; the interface borrows that — hairline rules, plat-paper ground,
   figures set in monospace, red earth as the signature.
   ========================================================================= */

:root {
  color-scheme: light;
  /* Levenhall brand v2026.06 — Deep Navy / Gold master pair, Burgundy editorial accent */
  --navy:#08131F; --navy-2:#0F1F3A; --gold:#C9A961; --gold-deep:#705926;
  --burgundy:#8B1538; --cyan:#38D9C9;
  --paper:#EFE9D9; --paper-2:#E6DFCB; --surface:#F5F1E4; --surface-2:#E6DFCB; --raised:#F8F5EB;
  --ink:#141A22; --ink-2:#2f3b4d; --muted:#5A6472; --muted-2:#606874;
  --rule:#D5CCB4; --rule-soft:#E2DAC5; --rule-strong:#C4B99B;
  --earth:#8B1538; --earth-deep:#6d0f2b; --earth-soft:#f7eaee; --earth-line:#dcb9c4;
  --prairie:#0F1F3A; --prairie-soft:#e7eaf0;
  --gold-soft:#f7f1e2;
  --danger:#8B1538; --danger-soft:#f7eaee;
  --data:#1b3055; --data-soft:#e7eaf0;
  --r-sm:2px; --r:2px; --r-lg:3px;
  --lift-1:0 1px 2px rgba(15,31,58,.07);
  --lift-2:0 2px 4px rgba(15,31,58,.06),0 8px 22px rgba(15,31,58,.08);
  --lift-3:0 4px 10px rgba(15,31,58,.1),0 20px 50px rgba(15,31,58,.16);
  --display:"Fraunces","Iowan Old Style",Georgia,serif;
  --sans:"Source Sans Pro","Source Sans 3",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
  --grid-ink:rgba(15,31,58,.045);
  --map-null:#ddd8cf;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { color-scheme: dark;
    --navy:#0F1F3A; --navy-2:#24395f; --gold:#C9A961; --gold-deep:#e0c288;
    --burgundy:#c9536f; --cyan:#38D9C9;
    --paper:#0b1424; --paper-2:#0f1c30; --surface:#122038; --surface-2:#182a46; --raised:#16263f;
    --ink:#f2f0ea; --ink-2:#cdd4e0; --muted:#a2aec0; --muted-2:#8d9bb0;
    --rule:#24354f; --rule-soft:#1c2b42; --rule-strong:#3b5074;
    --earth:#d9819a; --earth-deep:#e8a2b5; --earth-soft:#2a1420; --earth-line:#5c2a3c;
    --prairie:#C9A961; --prairie-soft:#1e2537;
    --gold-soft:#241f12;
    --danger:#e08a9e; --danger-soft:#2a1420;
    --data:#7fa3d8; --data-soft:#18263c;
    --lift-1:0 1px 2px rgba(0,0,0,.5);
    --lift-2:0 2px 4px rgba(0,0,0,.4),0 8px 22px rgba(0,0,0,.45);
    --lift-3:0 4px 10px rgba(0,0,0,.5),0 20px 50px rgba(0,0,0,.6);
    --grid-ink:rgba(242,240,234,.035); --map-null:#24354f;
  }
}
:root[data-theme="dark"] { color-scheme: dark;
    --navy:#0F1F3A; --navy-2:#24395f; --gold:#C9A961; --gold-deep:#e0c288;
  --burgundy:#c9536f; --cyan:#38D9C9;
  --paper:#0b1424; --paper-2:#0f1c30; --surface:#122038; --surface-2:#182a46; --raised:#16263f;
  --ink:#f2f0ea; --ink-2:#cdd4e0; --muted:#a2aec0; --muted-2:#8d9bb0;
  --rule:#24354f; --rule-soft:#1c2b42; --rule-strong:#3b5074;
  --earth:#d9819a; --earth-deep:#e8a2b5; --earth-soft:#2a1420; --earth-line:#5c2a3c;
  --prairie:#C9A961; --prairie-soft:#1e2537;
  --gold-soft:#241f12;
  --danger:#e08a9e; --danger-soft:#2a1420;
  --data:#7fa3d8; --data-soft:#18263c;
  --lift-1:0 1px 2px rgba(0,0,0,.5);
  --lift-2:0 2px 4px rgba(0,0,0,.4),0 8px 22px rgba(0,0,0,.45);
  --lift-3:0 4px 10px rgba(0,0,0,.5),0 20px 50px rgba(0,0,0,.6);
  --grid-ink:rgba(242,240,234,.035); --map-null:#24354f;
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.6;
  -webkit-font-smoothing:antialiased;background-color:var(--paper);
  background-image:linear-gradient(var(--grid-ink) 1px,transparent 1px),linear-gradient(90deg,var(--grid-ink) 1px,transparent 1px);
  background-size:34px 34px,34px 34px}
a{color:var(--earth);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:2px}
h1,h2,h3,h4{margin:0;line-height:1.16;font-weight:600}
p{margin:0 0 .85em} ul{margin:0 0 .85em;padding-left:1.15em} li{margin-bottom:.35em}
button{font:inherit;color:inherit}
::selection{background:var(--earth);color:#fff}

.num,td.num,.stat b,.kv dd,.bar-val,.lg-lb,.prog-val,.stack-rank .val,.fc-num,.cmp-cell strong,.mono
{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.micro{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-2)}
.skip{position:absolute;left:-9999px;top:0;z-index:300;background:var(--earth);color:#fff;padding:10px 16px}
.skip:focus{left:0}

/* masthead */
.masthead{position:sticky;top:0;z-index:60;background:var(--navy);color:#fff;border-bottom:1px solid var(--navy)}
.masthead-in{display:flex;align-items:center;gap:16px;padding:0 20px;height:52px;max-width:1680px;margin:0 auto}
/* the square-mark masthead this replaced is gone; .brand-mark here sized a 26px
   SVG badge that no page has carried for some time, and it squashed the wordmark
   the moment the mark became a link. The live brand rules are further down. */
.masthead-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.masthead-meta{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:rgba(244,241,234,.45)}
.mh-btn{border:1px solid rgba(244,241,234,.2);background:transparent;color:rgba(244,241,234,.8);height:28px;padding:0 10px;
  border-radius:var(--r-sm);cursor:pointer;display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:11px;letter-spacing:.08em}
.mh-btn:hover{border-color:var(--earth);color:#fff;background:rgba(168,68,42,.3)}
.mh-btn kbd{font:inherit;opacity:.6}
.nav-toggle{display:none}

/* shell */
.shell{display:grid;grid-template-columns:216px minmax(0,1fr);max-width:1680px;margin:0 auto;
  background:linear-gradient(to right,var(--surface) 0 216px,transparent 216px)}
.sidenav{border-right:1px solid var(--rule);padding:18px 0 60px;position:sticky;top:52px;height:calc(100vh - 52px);overflow-y:auto}
.nav-group{margin-bottom:18px}
.nav-group-t{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted-2);
  padding:0 18px 8px;display:flex;align-items:center;gap:8px}
.nav-group-t::after{content:"";flex:1;height:1px;background:var(--rule)}
.sidenav button{display:flex;align-items:center;gap:9px;width:100%;text-align:left;border:0;background:none;
  padding:6px 18px;cursor:pointer;font-size:13.5px;color:var(--muted);line-height:1.4;position:relative}
.sidenav button::before{content:"";width:3px;height:3px;border-radius:50%;background:var(--rule-strong);flex:none;transition:.12s}
.sidenav button:hover{color:var(--ink);background:var(--surface-2)}
.sidenav button[aria-selected="true"]{color:var(--ink);font-weight:600;background:var(--surface-2)}
.sidenav button[aria-selected="true"]::before{background:var(--earth);width:5px;height:5px}
.sidenav button[aria-selected="true"]::after{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--earth)}
.content{padding:0 32px 100px;min-width:0}

/* panels */
.panel{display:none;padding:30px 0 0;animation:rise .22s ease-out}
.panel.active{display:block}
@keyframes rise{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.panel-head{max-width:70ch;margin-bottom:26px}
.panel-head h2{font-family:var(--display);font-size:clamp(26px,2.9vw,36px);font-weight:600;letter-spacing:-.024em;line-height:1.08}
.panel-head p{margin-top:12px;color:var(--muted);font-size:15px}
/* --navy is the light theme's near-black ink; in dark mode it stays #0F1F3A,
   so every section divider in the atlas was black-on-black. */
.section-rule{margin:40px 0 18px;padding-top:14px;border-top:2px solid var(--gold-deep);font-family:var(--mono);
  font-size:10px;letter-spacing:.17em;text-transform:uppercase;color:var(--ink);font-weight:600;display:flex;align-items:baseline;gap:10px}
.section-rule::after{content:"";flex:1;border-bottom:1px dotted var(--rule-strong)}

/* hero */
.hero{padding:12px 0 0}
.kicker{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--earth);
  margin-bottom:18px;display:flex;align-items:center;gap:10px}
.kicker::after{content:"";width:46px;height:2px;background:var(--earth)}
.hero h1{font-family:var(--display);font-size:clamp(34px,5.4vw,66px);font-weight:600;letter-spacing:-.032em;line-height:.98;max-width:15ch}
.hero h1 em{font-style:italic;color:var(--earth)}
.hero .lede{margin-top:20px;max-width:56ch;font-size:17px;color:var(--ink-2);line-height:1.52}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));margin-top:38px;border-top:2px solid var(--navy)}
.stat{padding:14px 16px 14px 0;border-right:1px dotted var(--rule-strong)}
.stat:last-child{border-right:0}
.stat b{display:block;font-size:25px;font-weight:600;line-height:1}
.stat span{font-family:var(--mono);font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);display:block;margin-top:6px;line-height:1.35}

/* cards */
.card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:18px 20px}
.grid{display:grid;gap:12px}
.grid.g2{grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.grid.g3{grid-template-columns:repeat(auto-fill,minmax(252px,1fr))}
.jump-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(238px,1fr))}
.jump{text-align:left;background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:16px 17px 14px;
  cursor:pointer;display:flex;flex-direction:column;gap:6px;position:relative;
  transition:transform .14s cubic-bezier(.2,.7,.3,1),box-shadow .14s,border-color .14s}
.jump::after{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:2px;background:var(--earth);opacity:0;transition:.14s;border-radius:var(--r) 0 0 var(--r)}
.jump:hover{transform:translateY(-2px);box-shadow:var(--lift-2);border-color:var(--rule-strong)}
.jump:hover::after{opacity:1}
.jump .jq{font-size:15px;font-weight:620;line-height:1.28;letter-spacing:-.01em}
.jump .ja{font-size:12.8px;color:var(--muted);line-height:1.45}
.jump .jgo{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--earth);margin-top:4px}
.two-col{display:grid;grid-template-columns:1.3fr 1fr;gap:36px;align-items:start}
.risk-list{counter-reset:r;list-style:none;padding:0;margin:0}
.risk-list li{position:relative;padding-left:38px;margin-bottom:16px;font-size:14.2px;color:var(--ink-2);line-height:1.55}
.risk-list li::before{counter-increment:r;content:counter(r,decimal-leading-zero);position:absolute;left:0;top:2px;
  font-family:var(--mono);font-size:10.5px;color:var(--danger);border:1px solid var(--danger);padding:1px 5px;border-radius:2px}
.feature-card{border-color:var(--earth-line);background:var(--earth-soft);position:relative;overflow:hidden}
.feature-card::before{content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border:1px solid var(--earth-line);border-radius:50%;opacity:.5}
.fc-num{font-size:46px;font-weight:600;color:var(--earth);line-height:1;margin-bottom:12px}
.feature-card p{font-size:14px;color:var(--ink-2);line-height:1.55;position:relative}
.fc-sub{font-size:13px!important;color:var(--muted)!important;margin-bottom:0!important}

/* notes */
.note{border-left:2px solid var(--gold);background:var(--gold-soft);padding:12px 16px;font-size:13.6px;margin:12px 0 0;border-radius:0 var(--r-sm) var(--r-sm) 0}
.note.warn{border-left-color:var(--danger);background:var(--danger-soft)}
.note.tip{border-left-color:var(--prairie);background:var(--prairie-soft)}
.note b{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;margin-bottom:5px;opacity:.85}

/* chips */
.chip{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.06em;padding:3px 8px;border-radius:2px;
  background:var(--surface-2);border:1px solid var(--rule);color:var(--muted);white-space:nowrap}
.chip.accent{background:var(--prairie-soft);border-color:var(--prairie);color:var(--prairie)}
/* brass at full chroma is a 2:1 read on cream; the deep tone carries the same
   signal and can actually be read at 10px */
.chip.gold{background:var(--gold-soft);border-color:var(--gold);color:var(--gold-deep)}
.chip.danger{background:var(--danger-soft);border-color:var(--danger);color:var(--danger)}

/* controls */
.controls{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;align-items:center}
input[type="search"],input[type="text"],input[type="number"],select{font:inherit;font-size:13.5px;padding:8px 11px;
  border-radius:var(--r-sm);border:1px solid var(--rule);background:var(--raised);color:var(--ink);min-width:180px}
input:focus,select:focus{outline:2px solid var(--earth);outline-offset:-1px;border-color:var(--earth)}
.result-count{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--muted);margin-left:auto}
.btn-ghost{border:1px solid var(--rule);background:var(--raised);border-radius:var(--r-sm);padding:8px 13px;cursor:pointer;font-size:13.5px;color:var(--muted)}
.btn-ghost:hover{border-color:var(--earth);color:var(--ink)}

/* record cards */
.inc-card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:15px 17px;cursor:pointer;
  display:flex;flex-direction:column;text-align:left;width:100%;position:relative;
  transition:transform .13s cubic-bezier(.2,.7,.3,1),box-shadow .13s,border-color .13s}
.inc-card::after{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:2px;background:var(--earth);opacity:0;transition:.13s;border-radius:var(--r) 0 0 var(--r)}
.inc-card:hover{transform:translateY(-2px);box-shadow:var(--lift-2);border-color:var(--rule-strong)}
.inc-card:hover::after{opacity:1}
.inc-card .lvl{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);margin-bottom:8px}
.inc-card h4{font-size:15px;margin-bottom:7px;letter-spacing:-.012em}
.inc-card .head{font-size:13px;color:var(--ink-2);line-height:1.47;flex:1}
.inc-card .foot{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}
/* a long sunset note ("Sunsets January 1, 2031 (company credit)") pushed the
   card wider than its column; chips inside a card wrap like text */
.inc-card .foot .chip{white-space:normal;text-align:left;max-width:100%}

/* drawer */
.drawer-bg{position:fixed;inset:0;background:rgba(22,19,15,.5);backdrop-filter:blur(2px);z-index:90;opacity:0;pointer-events:none;transition:opacity .18s}
.drawer-bg.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(680px,100%);background:var(--surface);border-left:1px solid var(--rule-strong);
  z-index:91;transform:translateX(100%);transition:transform .26s cubic-bezier(.32,.72,0,1);overflow-y:auto;padding:24px 32px 70px;box-shadow:var(--lift-3)}
.drawer.open{transform:none}
.drawer-close{position:sticky;top:0;float:right;border:1px solid var(--rule);background:var(--raised);border-radius:var(--r-sm);
  width:30px;height:30px;cursor:pointer;font-size:16px;line-height:1;color:var(--muted);z-index:2}
.drawer-close:hover{border-color:var(--earth);color:var(--earth)}
.drawer h3{font-family:var(--display);font-size:27px;letter-spacing:-.022em;margin:2px 0 8px;max-width:25ch}
.drawer .statute{font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.04em;margin-bottom:18px}
.drawer .headline{font-size:15.5px;color:var(--ink);border-left:2px solid var(--earth);padding-left:15px;margin:0 0 22px;line-height:1.5}
.dl{margin:0 0 18px}
.dl dt{font-family:var(--mono);font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.dl dd{margin:0 0 16px;font-size:14px;color:var(--ink-2)}

/* tables */
.tbl-wrap{overflow-x:auto;border:1px solid var(--rule);border-radius:var(--r);background:var(--surface)}
table{border-collapse:collapse;width:100%;font-size:13.2px}
th,td{text-align:left;padding:8px 13px;border-bottom:1px solid var(--rule-soft)}
th{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);background:var(--surface-2);
  position:sticky;top:0;z-index:1;border-bottom:1px solid var(--rule-strong);font-weight:500;white-space:nowrap}
tbody tr:hover{background:var(--surface-2)}
tbody tr.clickable{cursor:pointer}
td.num{text-align:right}
tr:last-child td{border-bottom:0}
.cellbar{display:flex;align-items:center;gap:8px;justify-content:flex-end}
.cellbar-track{width:56px;height:6px;background:var(--rule-soft);border-radius:2px;overflow:hidden;flex:none}
.cellbar-fill{height:100%;background:var(--data);border-radius:2px}
.cellbar-fill.earth{background:var(--earth)}
.cellbar-v{min-width:60px;text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}

/* county detail */
.county-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:4px}
.county-head h3{font-family:var(--display);font-size:28px;letter-spacing:-.022em}
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));margin:22px 0;border-top:2px solid var(--navy)}
.kv>div{padding:12px 14px 12px 0;border-right:1px dotted var(--rule-strong)}
.kv>div:last-child{border-right:0}
.kv dt{font-family:var(--mono);font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.kv dd{margin:0;font-size:19px;font-weight:600}
.kv dd small{display:block;font-family:var(--sans);font-size:11px;font-weight:400;letter-spacing:0;color:var(--muted);margin-top:3px}

/* stacking */
.stack-picker{display:grid;gap:6px;grid-template-columns:repeat(auto-fill,minmax(258px,1fr))}
.stack-opt{display:flex;gap:9px;align-items:flex-start;padding:9px 12px;border:1px solid var(--rule);border-radius:var(--r-sm);
  background:var(--surface);cursor:pointer;font-size:13px}
.stack-opt:hover{border-color:var(--rule-strong)}
.stack-opt input{margin-top:3px;accent-color:var(--earth);flex:none}
.stack-opt.conflict{border-color:var(--danger);background:var(--danger-soft)}
.verdict{padding:16px 19px;border-radius:var(--r);margin-bottom:18px;border:1px solid var(--rule);background:var(--surface)}
.verdict.ok{border-color:var(--prairie);background:var(--prairie-soft)}
.verdict.bad{border-color:var(--danger);background:var(--danger-soft)}
.verdict h4{font-size:16px;margin-bottom:6px}
.verdict p{font-size:13.8px;margin-bottom:0;color:var(--ink-2)}
.conflict-item{border-top:1px solid var(--rule);padding:12px 0;font-size:13.6px}
.conflict-item:first-of-type{border-top:0}
.conflict-item b{color:var(--danger)}

/* model */
.model-grid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:26px;align-items:start}
.model-inputs{position:sticky;top:66px;max-height:calc(100vh - 90px);overflow-y:auto;padding:16px 18px}
.field-group{margin-bottom:18px}
.field-group:last-child{margin-bottom:0}
.fg-title{font-family:var(--mono);font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);
  padding-bottom:7px;margin-bottom:11px;border-bottom:1px solid var(--rule)}
.field-group label{display:block;font-size:11.5px;color:var(--muted);margin-bottom:10px}
.field-group label input,.field-group label select{display:block;width:100%;margin-top:4px;min-width:0;font-size:13.5px;font-family:var(--mono)}
.field-group label.cbx{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink)}
.field-group label.cbx input{width:auto;margin:0;accent-color:var(--earth)}
.stack-rank{border:1px solid var(--rule);border-radius:var(--r);background:var(--surface);padding:13px 16px;margin-bottom:8px;
  display:grid;grid-template-columns:28px 1fr auto;gap:14px;align-items:center}
.stack-rank.top{border-color:var(--earth);background:var(--earth-soft)}
.stack-rank .pos{font-family:var(--mono);font-size:10.5px;color:var(--muted);border:1px solid var(--rule);border-radius:2px;text-align:center;padding:2px 0}
.stack-rank.top .pos{background:var(--gold);color:#1a1408;border-color:var(--gold);font-weight:600}
.stack-rank .names{font-size:13.4px;line-height:1.42}
.stack-rank .val{font-size:19px;font-weight:600;text-align:right;white-space:nowrap}
.stack-rank .val small{display:block;font-family:var(--mono);font-size:9px;font-weight:400;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-top:2px}
.prog{border:1px solid var(--rule);border-left-width:2px;border-radius:var(--r);background:var(--surface);padding:13px 16px;margin-bottom:8px}
.prog.yes{border-left-color:var(--prairie)}
.prog.no{border-left-color:var(--danger);opacity:.78}
.prog-head{display:flex;justify-content:space-between;gap:14px;align-items:baseline;flex-wrap:wrap}
.prog-head h4{font-size:14.4px}
.prog-val{font-size:17px;font-weight:600;white-space:nowrap}
.prog-meta{font-family:var(--mono);font-size:10px;letter-spacing:.05em;color:var(--muted);margin-top:4px}
.prog-basis{font-size:12.6px;color:var(--ink-2);margin-top:8px;line-height:1.5}
.prog-fail{font-size:12.6px;color:var(--danger);margin-top:7px;line-height:1.5}
.prog-warn{font-size:12.6px;color:var(--gold);margin-top:7px;line-height:1.5}
.naics-box{border:1px solid var(--rule);border-radius:var(--r);background:var(--surface);padding:14px 17px;margin-bottom:18px}
.naics-line{font-size:13px;padding:6px 0;border-top:1px solid var(--rule-soft)}
.naics-line:first-of-type{border-top:0}

/* map */
.map-holder{display:grid;grid-template-columns:minmax(0,1fr) 196px;gap:24px;align-items:start}
.map-wrap{position:relative;background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:10px}
.map-svg{width:100%;height:auto;display:block}
.mapc{stroke:var(--surface);stroke-width:1.2;cursor:pointer;transition:opacity .1s}
.mapc:hover{opacity:.74}
.mapc:focus{outline:none;stroke:var(--ink);stroke-width:2.4}
.map-lbl{font-family:var(--mono);font-size:7.2px;fill:var(--ink);opacity:.5;pointer-events:none}
.map-tip{position:absolute;transform:translate(-50%,-100%);pointer-events:none;background:var(--ink);color:var(--paper);
  padding:6px 10px;border-radius:var(--r-sm);font-size:12px;white-space:nowrap;z-index:5;box-shadow:var(--lift-2)}
.map-tip strong{display:block;font-size:12.5px}
.map-tip span{opacity:.8;font-size:11.5px;font-family:var(--mono)}
.map-legend{position:sticky;top:70px}
.lg-title{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.lg-steps{display:flex;flex-direction:column;gap:1px}
.lg-step{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted)}
.lg-sw{width:20px;height:12px;border-radius:1px;flex:none}
.lg-step:last-child .lg-lb{margin-left:28px}
.lg-foot{font-size:11px;color:var(--muted-2);margin-top:14px;line-height:1.45}
.sm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(224px,1fr));gap:12px}
.sm-cell{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:11px}
.sm-cell h5{font-family:var(--mono);font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin:0 0 8px;font-weight:500}
.sm-cell svg{width:100%;height:auto;display:block}
.sm-cell .mapc{stroke-width:.7;cursor:default}

/* bars */
.bars{display:flex;flex-direction:column;gap:7px}
.bar-row{display:grid;grid-template-columns:152px minmax(0,1fr) 78px;gap:12px;align-items:center}
.bar-lb{font-size:12.6px;color:var(--muted);line-height:1.3}
.bar-track{height:18px;background:var(--surface-2);border-radius:2px;overflow:hidden}
.bar-fill{height:100%;background:var(--data);border-radius:0 2px 2px 0;transition:width .35s cubic-bezier(.2,.7,.3,1)}
.bar-row.hi .bar-lb{color:var(--ink);font-weight:620}
.bar-row.hi .bar-fill{background:var(--earth)}
.bar-val{font-size:12.6px;font-weight:600;text-align:right}
.chart-note{font-size:11.6px;color:var(--muted);margin-top:12px;line-height:1.45}

/* competitor */
#cmp-table table{font-size:12.6px;min-width:980px}
#cmp-table td,#cmp-table th{vertical-align:top;padding:11px 12px}
.cmp-cell strong{font-size:13.2px;display:block}
.cmp-note{font-size:11.6px;color:var(--muted);margin-top:5px;line-height:1.45}
.cmp-best{background:var(--prairie-soft)}
.cmp-best strong{color:var(--prairie)}
.cmp-poor{background:var(--danger-soft)}
.cmp-poor strong{color:var(--danger)}
th.cmp-ok{background:var(--navy);color:#fff}
td.cmp-ok{box-shadow:inset 2px 0 0 var(--earth),inset -2px 0 0 var(--earth)}

/* pathways */
.pathway-picker{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-bottom:30px}
.pathway-btn{text-align:left;background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:15px 16px;cursor:pointer;transition:.13s}
.pathway-btn:hover{border-color:var(--rule-strong)}
.pathway-btn[aria-pressed="true"]{border-color:var(--earth);background:var(--earth-soft)}
.pathway-btn b{display:block;font-size:14.4px;margin-bottom:3px}
.pathway-btn span{font-size:12.2px;color:var(--muted);line-height:1.42}
.step{display:grid;grid-template-columns:40px minmax(0,1fr);gap:18px;padding:20px 0;border-top:1px solid var(--rule-soft)}
.step:first-child{border-top:0}
.step-n{font-family:var(--mono);font-size:11.5px;color:var(--earth);border:1px solid var(--earth-line);background:var(--earth-soft);
  border-radius:2px;text-align:center;padding:4px 0;height:fit-content}
.step h4{font-size:15.6px;margin-bottom:4px;letter-spacing:-.012em}
.step .agency{font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted-2);margin-bottom:9px}
.step p{color:var(--ink-2);font-size:14px}
.meta-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
/* fee notes run long ("For-profit corporation one-tenth of 1% of authorised
   capital, $50 minimum"); a nowrap chip pushed the step past the column */
.meta-row .chip{white-space:normal;text-align:left;max-width:100%}

/* calendar */
.cal-item{display:grid;grid-template-columns:200px 1fr;gap:20px;padding:15px 0;border-top:1px solid var(--rule-soft)}
.cal-item:first-child{border-top:0}
.cal-when{font-family:var(--mono);font-size:12.2px;font-weight:600;letter-spacing:-.01em}
.cal-who{font-size:11.6px;color:var(--muted);margin-top:4px}
.cal-what{font-size:13.8px;color:var(--ink-2)}

/* command palette */
.cmdk-bg{position:fixed;inset:0;background:rgba(22,19,15,.55);backdrop-filter:blur(3px);z-index:200;opacity:0;pointer-events:none;transition:opacity .14s}
.cmdk-bg.open{opacity:1;pointer-events:auto}
.cmdk{position:fixed;top:13vh;left:50%;transform:translateX(-50%) scale(.98);width:min(620px,calc(100% - 32px));
  background:var(--raised);border:1px solid var(--rule-strong);border-radius:var(--r-lg);z-index:201;box-shadow:var(--lift-3);
  opacity:0;pointer-events:none;transition:opacity .14s,transform .14s cubic-bezier(.2,.7,.3,1);overflow:hidden}
.cmdk.open{opacity:1;pointer-events:auto;transform:translateX(-50%) scale(1)}
.cmdk-in{display:flex;align-items:center;gap:11px;padding:14px 18px;border-bottom:1px solid var(--rule)}
.cmdk-in svg{color:var(--muted-2);flex:none}
.cmdk-in input{flex:1;border:0;background:none;font-size:16px;padding:0;min-width:0;outline:none;color:var(--ink)}
.cmdk-list{max-height:52vh;overflow-y:auto;padding:6px}
.cmdk-sec{font-family:var(--mono);font-size:9px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted-2);padding:10px 12px 5px}
.cmdk-item{display:flex;align-items:center;gap:11px;padding:8px 12px;border-radius:var(--r-sm);cursor:pointer;font-size:13.6px}
.cmdk-item[aria-selected="true"]{background:var(--earth-soft);box-shadow:inset 2px 0 0 var(--earth)}
.cmdk-kind{font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-2);
  border:1px solid var(--rule);padding:2px 5px;border-radius:2px;flex:none;min-width:64px;text-align:center}
.cmdk-t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmdk-meta{font-family:var(--mono);font-size:10.5px;color:var(--muted);flex:none}
.cmdk-empty{padding:28px 16px;text-align:center;color:var(--muted);font-size:13.5px}
.cmdk-foot{border-top:1px solid var(--rule);padding:8px 16px;display:flex;gap:16px;font-family:var(--mono);font-size:9.5px;
  letter-spacing:.08em;color:var(--muted-2);text-transform:uppercase}

/* footer */
.foot{border-top:2px solid var(--navy);background:var(--surface);padding:30px 32px 50px;font-size:12.6px;color:var(--muted)}
.foot .cols{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));max-width:1680px;margin:0 auto}
.foot strong{color:var(--ink-2)}
.empty{padding:38px 0;text-align:center;color:var(--muted);font-size:13.6px}

@media (max-width:1150px){
  .two-col{grid-template-columns:1fr;gap:24px}
  .map-holder{grid-template-columns:1fr}
  .map-legend{position:static}
  .lg-steps{flex-direction:row;flex-wrap:wrap;gap:12px}
  .model-grid{grid-template-columns:260px minmax(0,1fr)}
}
@media (max-width:900px){
  .shell{grid-template-columns:1fr;background:none}
  .nav-toggle{display:inline-flex}
  .sidenav{position:fixed;top:52px;left:0;width:216px;height:calc(100vh - 52px);z-index:55;background:var(--surface);
    transform:translateX(-102%);transition:transform .2s;box-shadow:var(--lift-3)}
  .sidenav.open{transform:none}
  .content{padding:0 18px 70px}
  .masthead-meta{display:none}
  .model-grid{grid-template-columns:1fr}
  .model-inputs{position:static;max-height:none}
}
@media (max-width:640px){
  .step{grid-template-columns:1fr;gap:8px}
  .cal-item{grid-template-columns:1fr;gap:5px}
  .drawer{padding:20px 20px 50px}
  .bar-row{grid-template-columns:108px minmax(0,1fr) 66px}
}
@media print{
  .masthead,.sidenav,.drawer,.drawer-bg,.controls,.cmdk,.cmdk-bg,.skip{display:none!important}
  .shell{grid-template-columns:1fr;background:none}
  .content{padding:0}
  .panel{display:block!important;animation:none;break-inside:avoid-page}
  .card,.inc-card,.stack-rank,.prog{break-inside:avoid}
  body{background:#fff;background-image:none;font-size:10.5pt}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:8pt;color:#555}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---------------- brand marks ---------------- */
.brand-logo{height:15px;width:auto;display:block}
.brand-div{color:var(--gold);opacity:.95;font-size:14px;line-height:1}
.brand-name{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.19em;text-transform:uppercase;color:rgba(255,255,255,.82)}
.foot-logo{display:block;margin-bottom:12px;height:auto}
.mh-btn:hover{border-color:var(--gold);color:#fff;background:rgba(201,169,97,.18)}

/* ---------------- flags ---------------- */
.flag-row{display:grid;grid-template-columns:340px minmax(0,1fr);gap:28px;align-items:start;
  padding:26px 0;border-top:1px solid var(--rule-soft)}
.flag-row:first-child{border-top:0;padding-top:6px}
.flag-art{border:1px solid var(--rule-strong);border-radius:var(--r);overflow:hidden;background:var(--surface);box-shadow:var(--lift-2)}
.flag-art svg{display:block;width:100%;height:auto}
.flag-yrs{font-family:var(--mono);font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:8px}
.flag-body h3{font-family:var(--display);font-size:24px;letter-spacing:-.02em;margin-bottom:6px}
.flag-adopted{font-family:var(--mono);font-size:11px;color:var(--muted);margin-bottom:14px}
.flag-body p{font-size:14.4px;color:var(--ink-2);line-height:1.6}
.medallion{width:46px;height:46px;border-radius:50%;border:1.5px solid var(--rule-strong);
  display:grid;place-items:center;font-family:var(--mono);font-size:12px;font-weight:600;
  color:var(--navy);background:var(--surface-2);flex:none;letter-spacing:.02em}
/* this was a selector list left dangling in front of an at-rule, so neither
   half applied and the medallion kept the light theme's near-black ink */
:root[data-theme="dark"] .medallion{color:var(--gold)}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]) .medallion{color:var(--gold)} }
.brandblock{display:grid;grid-template-columns:200px minmax(0,1fr);gap:26px;align-items:center}
.brandblock img{width:100%;height:auto;background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:18px}
.swatches{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:10px;margin-top:14px}
.sw{border:1px solid var(--rule);border-radius:var(--r);overflow:hidden;background:var(--surface)}
.sw-chip{height:46px}
.sw-meta{padding:8px 10px;font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;line-height:1.5}
.sw-meta b{display:block;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}
@media (max-width:820px){.flag-row{grid-template-columns:1fr;gap:16px}.brandblock{grid-template-columns:1fr}}

/* ---------------- journey ---------------- */
.btn-primary{background:var(--navy);color:#fff;border:1px solid var(--navy);border-radius:var(--r);
  padding:11px 22px;font-size:14.5px;font-weight:600;cursor:pointer;margin-top:26px;
  transition:background .14s,transform .14s}
.btn-primary:hover{background:var(--navy-2);transform:translateY(-1px)}
.btn-primary:disabled{opacity:.4;cursor:not-allowed;transform:none}
.jr-time{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted-2);margin-top:14px}
.jr-progress{height:3px;background:var(--rule-soft);border-radius:2px;overflow:hidden;margin:6px 0 20px}
.jr-bar{height:100%;background:var(--gold);width:0;transition:width .3s cubic-bezier(.2,.7,.3,1)}
.jr-stepmeta{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-deep);margin-bottom:14px}
.jr-card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-lg);padding:30px 32px}
.jr-card h2{font-family:var(--display);font-size:28px;letter-spacing:-.022em;margin-bottom:8px}
.jr-help{font-size:14.2px;color:var(--muted);margin-bottom:24px;max-width:64ch}
.jr-opts{display:grid;gap:9px;grid-template-columns:repeat(auto-fit,minmax(268px,1fr))}
.jr-opt{text-align:left;background:var(--raised);border:1px solid var(--rule);border-radius:var(--r);
  padding:14px 16px;cursor:pointer;display:flex;gap:12px;align-items:flex-start;transition:.13s}
.jr-opt:hover{border-color:var(--gold);box-shadow:var(--lift-1)}
.jr-opt[aria-pressed="true"]{border-color:var(--navy);background:var(--prairie-soft);box-shadow:inset 0 0 0 1px var(--navy)}
.jr-tick{width:18px;height:18px;border:1.5px solid var(--rule-strong);border-radius:50%;flex:none;margin-top:2px;
  display:grid;place-items:center;font-size:10px;color:#fff}
.jr-opt[aria-pressed="true"] .jr-tick{background:var(--navy);border-color:var(--navy)}
.jr-opt b{display:block;font-size:14.4px;font-weight:600;margin-bottom:2px}
.jr-opt span{font-size:12.6px;color:var(--muted);line-height:1.42}
.jr-fields{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.jr-fields label{display:block;font-size:12.5px;color:var(--muted)}
.jr-fields input,.jr-fields select{width:100%;margin-top:5px;font-family:var(--mono);font-size:14.5px}
.jr-nav{display:flex;justify-content:space-between;gap:12px;margin-top:20px}
.jr-nav .btn-primary,.jr-nav .btn-ghost{margin-top:0}

/* plan output */
.plan-hd{background:var(--navy);color:#fff;border-radius:var(--r-lg);padding:30px 34px;margin-bottom:24px;position:relative;overflow:hidden}
.plan-hd::after{content:"";position:absolute;right:-40px;top:-40px;width:180px;height:180px;
  border:1px solid rgba(201,169,97,.3);border-radius:50%}
.plan-hd .micro{color:var(--gold);margin-bottom:12px}
.plan-hd h2{font-family:var(--display);font-size:clamp(24px,3vw,34px);letter-spacing:-.024em;margin-bottom:14px;max-width:24ch}
.plan-hd .plan-val{font-family:var(--mono);font-size:40px;font-weight:600;letter-spacing:-.03em;color:var(--gold);line-height:1}
.plan-hd .plan-combo{font-size:14px;color:rgba(255,255,255,.78);margin-top:10px;line-height:1.5;max-width:60ch}
.plan-sec{margin-bottom:12px}
.finding{border-left:3px solid var(--gold);background:var(--gold-soft);padding:15px 18px;border-radius:0 var(--r) var(--r) 0;margin-bottom:12px}
.finding.critical{border-left-color:var(--burgundy);background:var(--earth-soft)}
.finding h4{font-size:15.5px;margin-bottom:6px}
.finding p{font-size:13.8px;color:var(--ink-2);line-height:1.55;margin:0}
.phase{border:1px solid var(--rule);border-radius:var(--r);background:var(--surface);margin-bottom:12px;overflow:hidden}
.phase-hd{background:var(--surface-2);padding:11px 18px;display:flex;justify-content:space-between;align-items:baseline;
  border-bottom:1px solid var(--rule)}
.phase-hd b{font-size:14.5px}
.phase-hd span{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.act{display:grid;grid-template-columns:26px 1fr;gap:13px;padding:14px 18px;border-top:1px solid var(--rule-soft)}
.act:first-of-type{border-top:0}
.act-n{width:20px;height:20px;border:1px solid var(--rule-strong);border-radius:50%;font-family:var(--mono);
  font-size:10px;display:grid;place-items:center;color:var(--muted);margin-top:2px}
.act b{display:block;font-size:14.2px;font-weight:600;margin-bottom:4px;line-height:1.35}
.act .act-meta{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--gold-deep);margin-bottom:5px}
.act .act-why{font-size:13px;color:var(--muted);line-height:1.5}
.loc{border:1px solid var(--rule);border-radius:var(--r);background:var(--surface);padding:16px 18px;margin-bottom:10px}
.loc.top{border-color:var(--navy);box-shadow:inset 3px 0 0 var(--gold)}
.loc h4{font-size:15.5px;margin-bottom:3px}
.loc .loc-place{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-2);margin-bottom:10px}
.loc ul{margin:0;padding-left:18px}
.loc li{font-size:13.2px;color:var(--ink-2);line-height:1.5;margin-bottom:5px}
.plan-actions{display:flex;gap:10px;flex-wrap:wrap;margin:26px 0 0}
@media (max-width:700px){.jr-card{padding:22px 20px}.plan-hd{padding:22px 22px}}
@media print{.jr-nav,.plan-actions,#jr-intro,#jr-wizard{display:none!important}}

/* ---------------- app shell: survive an auto-height iframe ----------------
   Artifact/embed contexts size the frame to document scrollHeight, which makes
   100vh resolve to the whole document — sticky columns become thousands of px
   tall and fixed overlays land off-screen. Locking the document to a measured
   viewport height with internal scrolling keeps sticky and fixed honest in both
   embedded and standalone use. --appvh is set in JS, capped to the real screen. */
html, body { height: var(--appvh, 100vh); overflow: hidden; }
.shell { height: calc(var(--appvh, 100vh) - 52px); align-items: stretch; }
.sidenav { height: 100%; position: sticky; top: 0; }
.scroller { height: 100%; overflow-y: auto; overflow-x: hidden; min-width: 0; }
.model-inputs { max-height: calc(var(--appvh, 100vh) - 120px); }
.drawer { height: var(--appvh, 100vh); }
.cmdk { top: max(48px, calc(var(--appvh, 100vh) * 0.12)); }
.cmdk-list { max-height: calc(var(--appvh, 100vh) * 0.5); }
@media (max-width: 900px) {
  .sidenav { position: fixed; top: 52px; height: calc(var(--appvh, 100vh) - 52px); }
}
@media print {
  html, body { height: auto; overflow: visible; }
  .shell { height: auto; }
  .scroller { height: auto; overflow: visible; }
}

/* ---------------- kiosk ----------------
   Full-bleed, touch-first, read from two metres. Overlays the whole app when
   engaged; the atlas stays underneath for an adviser to drill into afterwards. */
.kiosk { position: fixed; inset: 0; z-index: 150; background: var(--navy);
  color: #fff; display: none; flex-direction: column; }
.kiosk.open { display: flex; }
.kiosk-bar { display: flex; align-items: center; gap: 16px; padding: 16px 28px;
  border-bottom: 1px solid rgba(255,255,255,.12); flex: none; }
.kiosk-bar img { height: 17px; }
.kiosk-bar .micro { color: rgba(255,255,255,.5); }
.kiosk-exit { margin-left: auto; border: 1px solid rgba(255,255,255,.25); background: none;
  color: rgba(255,255,255,.8); border-radius: var(--r-sm); padding: 8px 14px; cursor: pointer;
  font-family: var(--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.kiosk-exit:hover { border-color: var(--gold); color: #fff; }

/* attract loop */
.kiosk-attract { flex: 1; display: grid; place-items: center; text-align: center; padding: 40px;
  cursor: pointer; }
.kiosk-attract h1 { font-family: var(--display); font-size: clamp(38px, 6vw, 84px);
  letter-spacing: -.032em; line-height: .98; max-width: 16ch; margin: 0 auto 24px; }
.kiosk-attract h1 em { font-style: italic; color: var(--gold); }
.kiosk-attract p { font-size: clamp(17px, 1.7vw, 23px); color: rgba(255,255,255,.72);
  max-width: 52ch; margin: 0 auto 40px; line-height: 1.45; }
.kiosk-cta { display: inline-flex; align-items: center; gap: 14px; background: var(--gold);
  color: var(--navy); border: 0; border-radius: 100px; padding: 20px 42px; font-size: 19px;
  font-weight: 700; cursor: pointer; animation: pulse 2.6s ease-in-out infinite; }
@keyframes pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(201,169,97,.45); } 55% { box-shadow: 0 0 0 26px rgba(201,169,97,0); } }

/* engaged split */
.kiosk-stage { flex: 1; display: grid; grid-template-columns: minmax(0,5fr) minmax(0,6fr);
  gap: 0; min-height: 0; }
.kiosk-left { display: flex; flex-direction: column; min-height: 0;
  border-right: 1px solid rgba(255,255,255,.12); }
.kiosk-video { flex: none; aspect-ratio: 4/3; background: #08111f; position: relative; overflow: hidden; }
.tavus-frame { width: 100%; height: 100%; border: 0; display: block; }
.tavus-sim { position: absolute; inset: 0; display: grid; place-items: center; }
.tavus-sim-face { position: relative; width: 132px; height: 132px; display: grid; place-items: center; }
.tsf-ring { position: absolute; inset: 0; border: 2px solid var(--gold); border-radius: 50%;
  opacity: .3; animation: ring 2.4s ease-out infinite; }
@keyframes ring { 0% { transform: scale(.72); opacity: .55; } 100% { transform: scale(1.25); opacity: 0; } }
.tsf-core { width: 74px; height: 74px; border-radius: 50%;
  background: radial-gradient(circle at 35% 32%, #dcc084, var(--gold) 62%, #8d7233); }
.tavus-sim-cap { position: absolute; bottom: 14px; left: 0; right: 0; text-align: center;
  font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase;
  color: rgba(255,255,255,.4); }
.kiosk-say { flex: 1; overflow-y: auto; padding: 22px 26px; min-height: 0; }
.say { margin-bottom: 16px; font-size: 17px; line-height: 1.5; max-width: 46ch; }
.say.replica { color: #fff; }
.say.user { color: var(--gold); text-align: right; margin-left: auto; }
.say .who { font-family: var(--mono); font-size: 9.5px; letter-spacing: .16em;
  text-transform: uppercase; color: rgba(255,255,255,.42); display: block; margin-bottom: 5px; }

/* touch answers */
.kiosk-answers { flex: none; padding: 18px 26px 26px; border-top: 1px solid rgba(255,255,255,.12); }
.kiosk-answers .micro { color: rgba(255,255,255,.45); margin-bottom: 12px; display: block; }
.ka-grid { display: grid; gap: 9px; grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); }
.ka { text-align: left; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.18);
  color: #fff; border-radius: var(--r); padding: 14px 16px; cursor: pointer; font-size: 15.5px;
  line-height: 1.3; transition: .13s; }
.ka:hover, .ka:focus-visible { background: rgba(201,169,97,.2); border-color: var(--gold); outline: none; }
.ka small { display: block; font-size: 12.5px; color: rgba(255,255,255,.55); margin-top: 3px; }
.ka-fields { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(150px,1fr)); }
.ka-fields label { font-size: 12.5px; color: rgba(255,255,255,.6); }
.ka-fields input, .ka-fields select { width: 100%; margin-top: 5px; background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.2); color: #fff; font-family: var(--mono); font-size: 16px; padding: 10px 12px; }
.ka-next { margin-top: 14px; background: var(--gold); color: var(--navy); border: 0;
  border-radius: var(--r); padding: 13px 26px; font-size: 16px; font-weight: 700; cursor: pointer; }

/* live plan */
.kiosk-right { overflow-y: auto; padding: 26px 30px 40px; min-height: 0; background: rgba(0,0,0,.16); }
.kp-step { display: grid; grid-template-columns: 22px 1fr; gap: 13px; padding: 13px 0;
  border-bottom: 1px solid rgba(255,255,255,.09); opacity: .34; transition: opacity .3s; }
.kp-step.done, .kp-step.active { opacity: 1; }
.kp-tick { width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.3);
  display: grid; place-items: center; font-size: 10px; margin-top: 3px; }
.kp-step.done .kp-tick { background: var(--gold); border-color: var(--gold); color: var(--navy); }
.kp-step.active .kp-tick { border-color: var(--gold); animation: pulse2 1.4s ease-in-out infinite; }
@keyframes pulse2 { 0%,100% { opacity: 1; } 50% { opacity: .35; } }
.kp-q { font-size: 14px; color: rgba(255,255,255,.62); }
.kp-a { font-size: 16.5px; font-weight: 600; margin-top: 2px; }
.kp-verdict { background: rgba(201,169,97,.12); border: 1px solid var(--gold); border-radius: var(--r-lg);
  padding: 24px 26px; margin-top: 22px; }
.kp-verdict .micro { color: var(--gold); }
.kp-val { font-family: var(--mono); font-size: 46px; font-weight: 600; letter-spacing: -.03em;
  color: var(--gold); line-height: 1; margin: 10px 0 12px; }
.kp-combo { font-size: 15px; color: rgba(255,255,255,.82); line-height: 1.5; }
.kp-list { margin-top: 20px; }
.kp-list h4 { font-family: var(--mono); font-size: 10px; letter-spacing: .16em; text-transform: uppercase;
  color: rgba(255,255,255,.5); margin-bottom: 10px; }
.kp-item { padding: 10px 0; border-top: 1px solid rgba(255,255,255,.09); font-size: 15px; line-height: 1.45; }
.kp-item b { color: var(--gold); }
.kiosk-done { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 26px; }
.kiosk-done button { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.25);
  color: #fff; border-radius: var(--r); padding: 13px 22px; font-size: 15px; cursor: pointer; }
.kiosk-done button:hover { border-color: var(--gold); }
.kiosk-idle { position: absolute; bottom: 18px; left: 28px; font-family: var(--mono); font-size: 10px;
  letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.3); }
@media (max-width: 1000px) {
  .kiosk-stage { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .kiosk-left { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.12); }
  .kiosk-video { aspect-ratio: 16/9; }
}

/* ---------------- kiosk vertical budget ----------------
   The left column has three stacked regions competing for height. Without an
   explicit budget the video eats the column and the transcript — the thing the
   visitor is actually reading — gets clipped to a couple of lines. Cap the video,
   guarantee the transcript a floor, and let the answer panel scroll internally. */
.kiosk-left { overflow: hidden; }

.kiosk-video {
  flex: 0 0 auto;
  aspect-ratio: auto;
  height: clamp(150px, calc(var(--appvh, 100vh) * 0.30), 320px);
}

.kiosk-say {
  flex: 1 1 auto;
  min-height: 118px;               /* never collapses below ~3 lines */
  scroll-behavior: smooth;
  display: flex; flex-direction: column; justify-content: flex-end;
}
.say { font-size: clamp(15px, 1.35vw, 19px); }
/* The newest line is the one being spoken — give it presence, recede the rest. */
.say:not(:last-child) { opacity: .45; font-size: clamp(13.5px, 1.1vw, 16px); }
.say:last-child { opacity: 1; }

.kiosk-answers {
  flex: 0 0 auto;
  max-height: min(46%, calc(var(--appvh, 100vh) * 0.42));
  overflow-y: auto;
  padding-bottom: 20px;
}
.ka { padding: 12px 14px; font-size: clamp(14px, 1.1vw, 16px); }
.ka small { font-size: clamp(11.5px, .85vw, 13px); }

/* Short screens: drop the sub-labels and tighten, so six options still fit. */
@media (max-height: 780px) {
  .kiosk-video { height: clamp(130px, calc(var(--appvh, 100vh) * 0.24), 220px); }
  .ka small { display: none; }
  .ka { padding: 11px 13px; }
  .kiosk-say { min-height: 96px; padding: 16px 26px; }
  .kiosk-answers { padding: 14px 26px 18px; }
}
/* Portrait kiosk pillars (e.g. 1080×1920): stack, give the plan the lower half. */
@media (orientation: portrait) and (min-height: 900px) {
  .kiosk-stage { grid-template-columns: 1fr; grid-template-rows: minmax(0,1fr) minmax(0,1fr); }
  .kiosk-left { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.12); }
  .kiosk-video { height: clamp(200px, calc(var(--appvh, 100vh) * 0.22), 420px); }
}

/* The confirm action must never scroll out of reach — at a kiosk an off-screen
   primary button is a dead end. The options scroll; the action stays pinned. */
.kiosk-answers { display: flex; flex-direction: column; overflow: hidden; }
.kiosk-answers > .micro { flex: 0 0 auto; }
.ka-grid, .ka-fields { flex: 1 1 auto; min-height: 0; overflow-y: auto; align-content: start; }
.ka-next {
  flex: 0 0 auto; margin-top: 12px; width: 100%;
  box-shadow: 0 -14px 18px -12px rgba(15,31,58,.9);
}

/* Size the video against its own column, not the viewport — in portrait the left
   column is half the screen, so a viewport-derived height overflows it. */
.kiosk-video { max-height: 36%; }
@media (orientation: portrait) and (min-height: 900px) {
  .kiosk-video { height: auto; min-height: 170px; max-height: 34%; aspect-ratio: 16/9; }
}

/* ---------------- national layer ---------------- */
.state-switch{font-family:var(--mono);font-size:11px;letter-spacing:.06em;background:rgba(255,255,255,.06);color:#fff;
  border:1px solid rgba(244,241,234,.22);border-radius:var(--r-sm);height:28px;padding:0 8px;min-width:0;max-width:190px}
.state-switch:hover{border-color:var(--gold)}
/* The option list is drawn by the OS on a white popup, so it cannot follow the
   theme: --ink is near-white in dark mode, which left every state name invisible
   in the dropdown wherever the browser honours author colours. */
.state-switch option{color:#141A22;background:#fff}
.cov{display:flex;align-items:flex-start;gap:10px;margin:18px 0 0;padding:11px 14px;border-radius:var(--r);
  font-size:13px;line-height:1.5;border:1px solid var(--rule);background:var(--surface)}
.cov b{white-space:nowrap;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase}
.cov-dot{width:9px;height:9px;border-radius:50%;flex:none;margin-top:6px}
.cov-full .cov-dot{background:var(--prairie)} .cov-full{border-color:var(--prairie)}
.cov-headline .cov-dot{background:var(--gold)} .cov-headline{border-color:var(--gold);background:var(--gold-soft)}
.cov-extended .cov-dot{background:var(--prairie)} .cov-extended{border-color:var(--gold);background:var(--gold-soft)}
.cov-scaffold .cov-dot{background:var(--rule-strong)} .cov-scaffold{color:var(--muted)}
.usst.cur{stroke:var(--burgundy);stroke-width:2.4}
.usst:hover{opacity:.8}

/* ---- wayfinding out of a state ------------------------------------------------
   The wordmark used to be an inert div, so once you were inside a state there was
   no way back to the index at all. It is now a link, and sits beside an explicit
   exit, because a clickable logo is a convention people know but do not look for. */
/* ---- breadcrumb masthead -------------------------------------------------------
   The way back used to be a logo — a convention people know but do not look for —
   plus a button that the mobile layout had to hide, leaving no visible exit from a
   state on a phone. The masthead is now the trail itself: Levenhall / United
   States / Oklahoma, with every step before this one a labelled link. */
.brand{display:flex;align-items:center;gap:9px;min-width:0}
.brand-mark{display:flex;align-items:center;border-radius:3px;transition:opacity .2s ease}
.brand-mark:hover{opacity:.78}
.brand-up{
  font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:rgba(255,255,255,.62);text-decoration:none;
  white-space:nowrap;padding:3px 2px;border-radius:2px;
  transition:color .18s ease}
.brand-up:hover{color:var(--gold)}
.brand-up:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media (max-width:900px){ .masthead-meta{display:none} }
/* On a phone the masthead has room for four things. Keep the mark, the state
   you are in, and search; the way back to the index moves into the drawer,
   where it reads as the first item rather than as a fifth cramped button. */
.nav-home{display:none}
@media (max-width:900px){
  .nav-home{display:block;margin:0 0 6px;padding:11px 16px;text-decoration:none;
    font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
    color:var(--gold-deep);border-bottom:1px solid var(--rule)}
  .nav-home:hover{background:var(--surface-2);color:var(--ink)}
}
@media (max-width:560px){
  /* the wordmark, the trail and five controls do not fit. The wordmark goes and
     the trail stays, because a labelled way back matters more on a phone than a
     logo does — and the state is still named by the selector beside it. */
  .brand-logo,.brand-div,.brand-name{display:none}
  #kiosk-btn,#theme-btn{display:none}
  .brand-up::before{content:"\2190\00a0"}
  .brand-up{font-size:11px;letter-spacing:.1em;color:rgba(255,255,255,.86)}
  .masthead-in{gap:7px;padding-left:10px;padding-right:10px}
  .masthead-right{gap:6px;min-width:0}
  #cmdk-btn{padding:0 9px}
  #cmdk-btn kbd{display:none}
  #cmdk-btn .cmdk-word{position:absolute;left:-9999px}
  .state-switch{max-width:108px;min-width:0}
  /* the coverage note is a flex row; on a phone that squeezed the sentence into
     a column two words wide beside the label. Let it flow as one paragraph. */
  .cov{display:block}
  .cov-dot{display:inline-block;margin:0 7px 1px 0;vertical-align:middle}
  .cov b{white-space:normal}
}

/* ---- sequential pager ---------------------------------------------------------
   Carries the previous and next section at the foot of every panel so the atlas
   reads as a document. Labelled with the nav group so you can tell where the next
   step sits in the whole, not just what it is called. */
.pager{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:56px 0 0;
  padding-top:22px;border-top:1px solid var(--rule)}
.pg{display:flex;flex-direction:column;gap:5px;padding:15px 17px;cursor:pointer;
  background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-sm);
  text-align:left;transition:border-color .2s ease, background .2s ease}
.pg:hover{border-color:var(--navy);background:var(--surface-2)}
.pg-next{text-align:right;align-items:flex-end}
.pg-k{font-family:var(--mono);font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--muted-2)}
.pg-t{font-family:var(--display);font-size:17px;font-weight:600;letter-spacing:-.018em;
  color:var(--ink)}
a.pg{text-decoration:none}
.pg-prev .pg-t::before{content:"\2190\00a0"}
.pg-next .pg-t::after{content:"\00a0\2192"}
@media (max-width:600px){ .pager{grid-template-columns:1fr} .pg-next{text-align:left;align-items:flex-start} }

/* ============================================================================
   FINISH — brought into line with the landing's engraved-volume language.
   Structure is unchanged; this is the finish: Fraunces with its WONK axis,
   mono labels tracked out in brass, hairline rules instead of rounded cards,
   and the ink binding in the chrome.
   ========================================================================= */
.masthead{background:var(--navy);border-bottom:1px solid rgba(201,169,97,.22)}
.brand-name{font-family:var(--mono);font-size:10.5px;letter-spacing:.26em;color:var(--gold)}
.brand-div{color:rgba(201,169,97,.8)}
.masthead-meta{font-family:var(--mono);font-size:9px;letter-spacing:.18em;color:rgba(201,169,97,.5)}
.masthead .mh-btn{background:none;border:1px solid rgba(201,169,97,.3);border-radius:1px;
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#EFE9D9}
.masthead .mh-btn:hover{border-color:var(--gold);background:rgba(201,169,97,.1);color:#E3C88A}
.state-switch{background:rgba(201,169,97,.08);border:1px solid rgba(201,169,97,.3);border-radius:1px;
  color:#EFE9D9;font-family:var(--sans);font-size:13px;padding:6px 9px}
.state-switch:focus{outline:none;border-color:var(--gold)}

/* display type gets the quirked cut, matching the landing */
.panel-head h2,.hero h1,.sec-title,.step h3{
  font-family:var(--display);font-variation-settings:"opsz" 96,"SOFT" 0,"WONK" 1;
  letter-spacing:-.034em}
.hero h1{font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 1}
.hero h1 em{font-style:normal;color:var(--gold-deep);
  font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 0}
.panel-head h2 em{font-style:normal;color:var(--gold-deep)}
.kicker,.micro,.nav-group-t{font-family:var(--mono);letter-spacing:.2em;color:var(--gold-deep)}

/* the sidebar reads as an index, not a set of buttons */
.sidenav{background:var(--paper);border-right:1px solid var(--rule)}
.sidenav button{border-radius:0;font-size:14.5px}
.sidenav button:hover{background:var(--surface-2)}
.sidenav button[aria-selected="true"]{background:var(--surface-2);
  box-shadow:inset 3px 0 0 var(--gold-deep)}
/* one selection marker, not two — the earlier burgundy rule painted a second
   bar on top of the gold inset */
.sidenav button[aria-selected="true"]::after{display:none}
.sidenav button[aria-selected="true"]::before{background:var(--gold-deep)}

/* ---- mobile navigation drawer ------------------------------------------------
   The drawer used to slide over live content with nothing behind it, so a tap
   outside did nothing and the page underneath still read as the foreground. */
.nav-scrim{position:fixed;inset:52px 0 0;z-index:54;background:rgba(8,19,31,.5);
  opacity:0;pointer-events:none;transition:opacity .2s var(--ease, ease)}
.nav-scrim.on{opacity:1;pointer-events:auto}
@media (min-width:901px){ .nav-scrim{display:none} }

/* figures are set as figures throughout */
.num,.mono,td.num,.cell-n{font-variant-numeric:tabular-nums lining-nums}

/* ---- disclosure -------------------------------------------------------------
   The honesty notice has to be present and has to be findable, but two full
   warning blocks were consuming the first screen before anyone reached the tool.
   Folded into a single line that opens on demand. */
.disclose{max-width:66ch;margin-top:24px;border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);padding:2px 0}
.disclose summary{cursor:pointer;list-style:none;display:flex;flex-wrap:wrap;
  align-items:baseline;gap:4px 12px;padding:11px 2px}
.disclose summary::-webkit-details-marker{display:none}
.disclose summary::after{content:"+";margin-left:auto;font-family:var(--mono);
  color:var(--gold-deep);font-size:14px;line-height:1}
.disclose[open] summary::after{content:"\2212"}
.disclose-k{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold-deep)}
.disclose-s{font-size:14px;color:var(--muted)}
.disclose p{margin:0 0 14px;padding:0 2px;font-size:14px;line-height:1.62;
  color:var(--muted);max-width:64ch}
.disclose summary:hover .disclose-s{color:var(--ink)}

/* ---- Paged tables ------------------------------------------------------ */
.more-row td{
  padding:16px 12px !important; text-align:center;
  background:var(--surface); border-top:1px solid var(--rule);
}
.more-btn{
  font:600 12px/1 var(--mono); letter-spacing:.09em; text-transform:uppercase;
  color:var(--ink); background:transparent; cursor:pointer;
  border:1px solid var(--rule); border-radius:2px; padding:9px 18px;
  transition:border-color .18s, color .18s, background .18s;
}
.more-btn:hover{ border-color:var(--gold-deep); color:var(--gold-deep); background:rgba(201,169,97,.06); }
.more-note{
  display:block; margin-top:8px;
  font:400 11px/1 var(--mono); letter-spacing:.08em; color:var(--muted-2);
}

/* ---- one selection colour ------------------------------------------------
   Selection was burgundy in the sidebar, the pathway picker and the command
   palette, while the rest of the finish had moved to brass. Two accent
   colours for the same meaning makes a reader work out which one is "you are
   here". Burgundy stays for the seal and for warnings; brass marks selection. */
.pathway-btn[aria-pressed="true"]{border-color:var(--gold);background:var(--gold-soft)}
.cmdk-item[aria-selected="true"]{background:var(--gold-soft);box-shadow:inset 2px 0 0 var(--gold)}
/* the best lawful stack is a result, not a warning — brass, like the top of
   every other ranking in the atlas */
.bar-row.hi .bar-fill{background:var(--gold)}

/* agency phone numbers and domains, made reachable */
.lk{color:inherit;text-decoration:none;border-bottom:1px solid var(--rule-strong);
  transition:color .16s ease, border-color .16s ease}
.lk:hover{color:var(--ink);border-bottom-color:var(--gold)}

/* ---- structure that survives the dark theme ---------------------------------
   --navy is the light theme's near-black; in dark it stays #0F1F3A, so every
   rule and control drawn in it disappeared into the paper. These are the same
   engraved hairlines and the same primary action in both themes. */
.stats,.kv,.foot{border-top-color:var(--gold-deep)}
.pg:hover{border-color:var(--gold-deep)}
.loc.top{border-color:var(--gold)}
.jr-opt[aria-pressed="true"]{border-color:var(--gold);background:var(--gold-soft);
  box-shadow:inset 0 0 0 1px var(--gold)}
.jr-opt[aria-pressed="true"] .jr-tick{background:var(--gold);border-color:var(--gold)}
/* the primary action, in the brass the landing already uses for it */
.btn-primary{background:var(--gold);color:#1a1408;border-color:var(--gold);font-weight:600}
.btn-primary:hover{background:var(--gold-deep);border-color:var(--gold-deep);color:#fff}

/* a stat row of two should not stretch each figure across half the page */
.stats{display:flex;flex-wrap:wrap}
.stat{flex:1 1 96px;max-width:230px}
.more-cards{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:20px 0 4px}

/* ---- the project carried in from the map --------------------------------------
   States plainly what was inherited, and offers the way out of it. */
.carried{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:10px 14px;
  margin:18px 0 0; padding:12px 15px;
  background:var(--gold-soft); border:1px solid var(--gold); border-radius:var(--r);
}
.carried-k{
  font-family:var(--mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold-deep); flex:none;
}
.carried-v{ font-size:14px; color:var(--ink); flex:1 1 auto; min-width:0 }
.carried-x{
  flex:none; cursor:pointer; background:transparent; color:var(--muted);
  border:1px solid var(--rule); border-radius:2px; padding:5px 11px;
  font-family:var(--mono); font-size:10px; letter-spacing:.09em; text-transform:uppercase;
  transition:color .16s, border-color .16s;
}
.carried-x:hover{ color:var(--ink); border-color:var(--gold-deep) }
@media (max-width:560px){ .carried{gap:7px} .carried-v{flex:1 1 100%} }

/* the discount rate is the one model input a reader cannot infer from its name */
.fld-hint{display:block;margin-top:7px;font-family:var(--sans);font-size:11.5px;
  line-height:1.45;letter-spacing:0;text-transform:none;color:var(--muted);font-weight:400}

/* a second figure alongside a bar's own value — sector pay beside sector employment */
.bar-meta{display:block;margin-top:2px;font-family:var(--mono);font-size:10.5px;
  color:var(--muted);font-weight:400}

/* ---- what the state says about itself -----------------------------------------
   Set as quotation, not as copy. The reader should never be in doubt that these
   are the agency's words rather than the atlas's findings. */
.edo-lede{max-width:74ch;color:var(--muted);font-size:14.5px;margin:0 0 20px}
.edo-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:14px}
.edo{margin:0;padding:16px 18px;background:var(--surface);border:1px solid var(--rule);
  border-left:2px solid var(--gold-deep);border-radius:var(--r)}
.edo-theme{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-deep);margin-bottom:9px}
.edo blockquote{margin:0;font-family:var(--display);font-size:15px;line-height:1.52;
  color:var(--ink);font-style:italic}
.edo blockquote::before{content:"\201C"}
.edo blockquote::after{content:"\201D"}
.edo-checks{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px;
  padding-top:12px;border-top:1px solid var(--rule-soft)}
/* an "atlas adds" note carries a whole clause, not a figure, so it wraps */
.edo-check{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;width:100%;min-width:0}
.edo-check .chip{white-space:normal;text-align:left;max-width:100%}
.edo-check-l{font-family:var(--mono);font-size:10px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted)}
.edo-note{margin:12px 0 0;padding-top:11px;border-top:1px solid var(--rule-soft);
  font-size:13px;line-height:1.5;color:var(--muted)}

/* ---- the project brief --------------------------------------------------------
   The agency's own form, filled as far as the atlas can fill it. Lines the
   company alone can answer are marked outstanding rather than guessed at, which
   is what makes the brief useful as a checklist and honest as a document. */
.brief-lede{max-width:74ch;color:var(--muted);font-size:14.5px;margin:0 0 18px}
.brief{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px}
.brief-sec{padding:16px 18px;background:var(--surface);border:1px solid var(--rule);
  border-radius:var(--r)}
.brief-sec h4{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-deep);margin:0 0 12px}
.brief-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:10px;
  padding:7px 0;border-top:1px solid var(--rule-soft);align-items:baseline}
.brief-sec .brief-row:first-of-type{border-top:0}
.brief-l{font-size:12.8px;color:var(--muted);line-height:1.4}
.brief-v{font-size:13.4px;color:var(--ink);line-height:1.4;font-variant-numeric:tabular-nums}
.brief-need .brief-v{font-family:var(--mono);font-size:11px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--gold-deep)}
@media (max-width:520px){ .brief-row{grid-template-columns:1fr;gap:2px} }
@media print{ .brief-sec{break-inside:avoid} }
.brief-hint{display:block;margin-top:4px;font-family:var(--sans);font-size:11.5px;
  letter-spacing:0;text-transform:none;color:var(--muted);line-height:1.4}