/* dossier.css — the entity-dossier archetype (docs/entity-dossier-template.md).
   Lifted from the agency prototype so every dossier page shares one stylesheet
   and they cannot drift. Layout tokens (--bg, --ink, --ink-faint, --fys0..4 …)
   come from hitch-page.css, which every dossier page must load first. */

/* ── categorical series palette ───────────────────────────────────────────────
   --c1..--c8 are the ranked-bar / score-segment colours. hitch-page.css does
   NOT define them (it carries --fys0..4 for the FYStack year ramp and nothing
   else), so they must live here.

   They were dropped when this file was extracted from the prototype, whose
   :root block sat one line above the range that was lifted. The failure was
   invisible in review: an undefined var makes the whole declaration
   guaranteed-invalid, so `--bc:var(--c1)` falls through to the `var(--bc,
   var(--nd2))` grey and every ranked bar on every page rendered the same
   colour, while the score segments — which have no fallback — rendered fully
   transparent. Nothing errors; it just quietly goes monochrome.

   Values match mockups/agency-v11.html:26-27 so the live pages and the design
   mockups stay the same colours. --c7 is the red reserved for sole-source and
   other adverse bands, which is why the default series order skips it. */
:root{
  --c1:#c4811d; --c2:#1e99db; --c3:#26ae5b; --c4:#8e6fe0;
  --c5:#ff1f8e; --c6:#5ec8c8; --c7:#e07b7b; --c8:#c4c1b6;
}

/* ── the entity-dossier archetype (docs/entity-dossier-template.md) ───────────
   Chrome only. Every number on the page comes from that page's own endpoint. */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--sans,Inter,system-ui,sans-serif);
     font-weight:300;font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--accent);text-decoration:none}
button{font:inherit;cursor:pointer;color:inherit;background:none;border:none}
.up{color:var(--green)} .down{color:var(--red)} .gold{color:var(--accent)}

/* hitch-page.css sets html,body{height:100%} for the board layout, which caps
   the body at ONE viewport height — and a sticky child of body (this header)
   can only stick within its parent's box, so the header quietly scrolled away
   after the first screenful while the tab bar (child of the full-height #wrap)
   kept sticking, leaving a bare strip above it for content to bleed through.
   Dossier pages scroll the document normally, so undo the cap. */
html,body{height:auto;min-height:100%}
header.bh{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:14px;padding:12px 22px;
  background:linear-gradient(90deg,#0c0d10,var(--bg));border-bottom:1px solid var(--line-soft)}
/* The wordmark is the standard escape hatch on a deep page — make it a real
   link, but keep it looking like a wordmark rather than inheriting link amber. */
a.brand{color:var(--ink);text-decoration:none}
.brand{font-family:var(--serif);font-size:1.5rem;line-height:1}.brand i{font-style:italic;color:var(--accent)}
.tag{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim);
  border:1px solid var(--line);border-radius:100px;padding:6px 14px}
.h-actions{margin-left:auto;display:flex;align-items:center;gap:9px}
.btn{background:var(--accent);border:1px solid var(--accent);color:#1a1206;border-radius:100px;padding:8px 16px;
  font-weight:500;font-size:.86rem;transition:.25s}.btn:hover{background:var(--accent-soft)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--ink-dim)}.btn.sm{padding:6px 13px;font-size:.82rem}
.freshpill{font-family:var(--mono);font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-dim);
  border:1px solid var(--line);border-radius:100px;padding:6px 13px;display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.freshpill .fd{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px rgba(107,191,89,.15)}

/* Unknown currency is shown, not implied. Amber dot, no green "all good" halo. */
.freshpill.stale{color:var(--accent-soft);border-color:rgba(232,161,60,.35)}
.freshpill .fd.unknown{background:var(--accent);box-shadow:0 0 0 3px rgba(232,161,60,.15)}

.wrap{max-width:1180px;margin:0 auto;padding:20px 26px 80px}
.crumb{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.78rem;color:var(--ink-dim);margin-bottom:16px;flex-wrap:wrap}
.crumb .sep{color:var(--ink-faint)}
.masthead{display:flex;align-items:flex-end;gap:22px;flex-wrap:wrap;padding-bottom:14px}
.mh-kicker{font-family:var(--mono);font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);
  margin-bottom:8px;display:flex;align-items:center;gap:9px}
.mh-kicker .rule{width:26px;height:1px;background:var(--accent);opacity:.6}
.mh-title{font-family:var(--serif);font-size:3.4rem;line-height:.92}
.mh-byline{margin-top:9px;color:var(--ink-dim);font-size:.86rem;font-family:var(--mono)}
.edition{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:2px 0 4px}
.edition .dl{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.14em;color:var(--ink-faint)}
.dchip{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.78rem;padding:5px 12px;
  border-radius:100px;color:var(--ink);border:1px solid var(--line);background:var(--panel2)}
.dchip.term{color:var(--accent-soft);border-color:rgba(232,161,60,.35);background:rgba(232,161,60,.07)}
/* An undecided set-aside earns a chip — dropping it would leave the Scope row
   reading as though the notice carried no restriction — but it is not a term of
   the deal the way "SDVOSB set-aside" is, so it recedes rather than sits beside
   the codes at full weight. */
.dchip.sa-tbd{color:var(--ink-faint);background:none;border-style:dashed;font-style:italic}
.sidetog{font-family:var(--mono);font-size:.74rem;color:var(--ink-dim);text-transform:uppercase;letter-spacing:.08em}
.sidetog b{color:var(--accent)}

/* auto-fit, not a fixed six: a page emits as many vitals as it can honestly
   compute, and a fixed column count leaves dead grid cells when that number
   is not six. */
.vitals{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:1px;background:var(--line-soft);
  border:1px solid var(--line);border-radius:12px;overflow:hidden;margin:18px 0 6px}
.vital{background:var(--panel);padding:14px 16px;display:flex;flex-direction:column;gap:5px;min-height:82px}
.vital .vl{font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-faint)}
/* One typeface for every vital — see the engine's length-based sizing. `.tight`
   is a SIZE step for long values, never a different face. */
.vital .vv{font-family:var(--serif);font-size:1.55rem;line-height:1.08;font-variant-numeric:lining-nums tabular-nums}
.vital .vv.tight{font-size:1.06rem;line-height:1.28}
.vital .vs{font-family:var(--mono);font-size:.76rem;color:var(--ink-dim)}
.vital.conv{background:linear-gradient(160deg,rgba(232,161,60,.10),rgba(232,161,60,.02))}
.vital.conv .vv{color:var(--accent)}
.cvbar{display:flex;gap:2px;margin-top:4px;background:var(--panel2);border-radius:3px}
.cvbar b{height:6px;border-radius:2px;opacity:.92;cursor:pointer;transition:.2s}
.cvbar b:hover{opacity:1;box-shadow:0 0 0 2px rgba(232,161,60,.25)}

/* The sticky offset tracks the header's REAL height (--hdr-h, set by the
   engine's ResizeObserver): the full pill set wraps the header to two rows on
   narrower screens, and a hard-coded 54px let the header overlap the tabs. */
.tabbar{position:sticky;top:var(--hdr-h,54px);z-index:30;display:flex;gap:0;align-items:center;border-bottom:1px solid var(--line);
  margin:14px 0 22px;background:var(--bg);padding-top:4px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.tabbar::-webkit-scrollbar{display:none}
.tab{font-family:var(--mono);font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-dim);
  padding:12px 15px;border-bottom:2px solid transparent;transition:.2s;white-space:nowrap;position:relative}
.tab+.tab::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);height:13px;width:1px;background:var(--line)}
.tab.on::before,.tab.on+.tab::before{background:transparent}
.tab:hover{color:var(--ink)}.tab.on{color:var(--ink);border-bottom-color:var(--accent)}
/* ── the chapter rail (spec.layout:'rail') ─────────────────────────────────
   The same tab set laid down the side and grouped, for a page that has more
   sections than a single row can hold without scrolling sideways. Everything
   below overrides the row layout above for this one case; the row itself is
   untouched, so the six dossiers that do not opt in are byte-identical.
   The rail keeps `position:sticky` and the same --hdr-h offset the row used —
   losing stickiness would put the whole navigation off-screen on a long
   chapter, which is worse than the horizontal scrolling this replaces. */
.railwrap{display:grid;grid-template-columns:216px minmax(0,1fr);gap:0;
  align-items:start;margin-top:14px}
.tabbar.railbar{position:sticky;top:var(--hdr-h,54px);z-index:30;display:block;
  margin:0;padding:14px 0 24px;border-bottom:0;border-right:1px solid var(--line);
  max-height:calc(100vh - var(--hdr-h,54px));overflow-y:auto;overflow-x:hidden;
  flex-wrap:initial}
/* A HEADING IS A LABEL; A CHAPTER IS THE THING. THEY MUST NOT LOOK ALIKE.
   The first version set both in --mono, 9.6px against 11.5px, both grey — so
   eleven chapters read as eleven near-identical lines and the groups did no
   work at all. Worse, three headings sat directly above a chapter repeating
   the same word ("COMPLIANCE" over "Compliance & Risk"), which the eye reads
   twice and the mind reads once.
   They now differ on FOUR axes at once, which is what makes the hierarchy
   survive a glance: family (mono vs sans), case (upper vs sentence), weight
   (600 vs 450) and size. The hairline rule finishes the heading's line and
   closes the group visually, so the reader sees three blocks rather than one
   list. Singleton groups get no heading at all — see renderSpec.

   ⚠️ SIZE IS NOT THE AXIS TO SPEND HERE, and the first attempt at this fix
   spent it anyway: it raised the chapters to 14px and left the headings at
   9.9px, which differentiated them by making one of them unreadable. A
   heading nobody can read is not a quiet heading, it is a missing one. 12.5px
   is the floor for uppercase mono at this tracking; the contrast between
   heading and chapter comes from the other three axes, which cost nothing in
   legibility. */
.railgrp{font-family:var(--mono);font-size:.78rem;font-weight:600;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ink-dim);padding:0 16px;margin:26px 0 8px;
  display:flex;align-items:center;gap:10px}
/* The rule fills whatever the label leaves. `min-width:14px` is the tell: a
   heading long enough to squeeze it out is a heading that is about to wrap and
   drop the rule onto a second line, which is what "WHAT WE ARE UP AGAINST"
   did at 216px. Keep group names short enough that the rule survives. */
.railgrp::after{content:'';flex:1 1 auto;min-width:14px;height:1px;background:var(--line-soft)}
.railgrp:first-child{margin-top:2px}
/* A group whose heading was suppressed (one chapter, see renderSpec) still
   reads as its own block — the spacing is what groups, the caption only
   names. Without this a lone chapter joins the list above it. */
.railbar .tab+.railsolo{margin-top:22px}
/* An ungrouped tab should look like the mistake it is, not like the
   bottom of the group above it. */
.railgrp.orphan{color:var(--warn)}
.railgrp.orphan::after{background:var(--warn);opacity:.35}
/* THE READING FACE, AT A READING SIZE. Mono at 11.5px is a code face at
   caption size for the one list on the page a reader scans every visit. */
.railbar .tab{display:flex;width:100%;text-align:left;font-family:var(--sans);
  font-size:.88rem;font-weight:450;text-transform:none;letter-spacing:0;
  padding:6px 16px;border-bottom:0;border-left:2px solid transparent;
  white-space:normal;line-height:1.4}
.railbar .tab+.tab::before{display:none}
.railbar .tab:hover{color:var(--ink)}
.railbar .tab.on{border-bottom-color:transparent;border-left-color:var(--accent);
  background:var(--row,rgba(244,241,234,.02));font-weight:600;color:var(--ink)}
/* LOCKED MUST STILL BE LEGIBLE. `.tab.locked{opacity:.45}` computed to a 2.22
   contrast ratio against the page — below WCAG AA's 4.5 for small text and
   below even the 3.0 for large — so the four capture chapters were ghosts.
   A lock is not an invitation to stop reading: the padlock says it is shut,
   the colour keeps it readable, and the row is the same height as its
   neighbours so the rail's rhythm does not break around it. */
.railbar .tab.locked{opacity:1;color:var(--ink-faint);font-weight:450}
.railbar .tab.locked::after{filter:grayscale(1);opacity:.7;font-size:.78em;margin-left:6px}
.railmain{min-width:0;padding:22px 0 0 26px}   /* the 14px the retired
   contents line used to contribute, now owned by the column itself */
/* Below the breakpoint the rail becomes the horizontally-scrolling row it
   replaced, rather than a screen and a half of menu above the content. */
@media(max-width:860px){
  .railwrap{display:block}
  .tabbar.railbar{display:flex;align-items:center;border-right:0;border-bottom:1px solid var(--line);
    max-height:none;overflow-x:auto;overflow-y:hidden;padding:4px 0 0;margin:0 0 22px;flex-wrap:nowrap}
  .railgrp{display:none}
  .railbar .tab{display:inline-block;width:auto;white-space:nowrap;border-left:0;
    border-bottom:2px solid transparent;padding:12px 15px;font-size:.8rem;text-transform:uppercase;
    letter-spacing:.05em}
  .railbar .tab.on{border-left-color:transparent;border-bottom-color:var(--accent);background:none}
  .railmain{padding-left:0}
}
.panel{display:none;animation:fade .3s ease}.panel.on{display:block}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* align-items:start, not stretch: the stamp is a seal, not a column — it
   should be exactly as tall as its own words. */
.callrow{display:grid;grid-template-columns:auto minmax(0,1.3fr) minmax(0,.95fr);gap:22px;align-items:start;margin:6px 0 24px}
/* The lede's second paragraph: who the company is (the website read), under
   how they're doing. Filled async once enrichment returns. */
.call-desc{display:block;margin-top:12px;font-size:.86rem;color:var(--ink-dim);line-height:1.65;font-family:var(--sans)}
.call-desc .src{display:block;font-size:.68rem;color:var(--ink-faint);margin-top:6px}
/* No judgement -> no stamp; the row becomes two columns so the read takes the
   space rather than leaving a hole where a call would be. */
.callrow.nocall{grid-template-columns:minmax(0,1.5fr) minmax(0,.95fr)}
.callstamp{border:1.5px solid var(--accent);border-radius:12px;padding:17px 19px;text-align:center;min-width:158px;
  background:radial-gradient(circle at 50% 0%,rgba(232,161,60,.10),transparent 70%)}
.callstamp .cl{font-family:var(--mono);font-size:.62rem;letter-spacing:.2em;color:var(--ink-faint);text-transform:uppercase}
.callstamp .cw{font-family:var(--serif);font-size:2.1rem;color:var(--accent);line-height:1;margin:7px 0 3px}
.callstamp .cn{font-family:var(--mono);font-size:.78rem;color:var(--ink-dim)}
.verdict{font-family:var(--serif);font-size:2.2rem;line-height:1.08;margin-bottom:10px}
.read{font-size:.95rem;line-height:1.7;color:var(--nd);max-width:64ch}
/* Multi-paragraph prose INSIDE a card — the work tab's description of what a company
   does. Set at body scale, not the display scale of .verdict: this is a narrative to
   read through, and a narrative set in display type is a poster. Wider measure than
   .read because it runs to several paragraphs and .read is a single standfirst. */
.story{font-size:.92rem;line-height:1.75;color:var(--nd);max-width:74ch;margin-bottom:12px}
.story:last-child{margin-bottom:0}
.story b{color:var(--ink);font-weight:500}
.story .dim{color:var(--ink-faint)}
/* The hero card runs the full board width, so prose alone leaves the right half of it
   empty — which is what made the section read as unfinished. The second column carries
   the same figures the prose states, as a scan column: read it or find it. */
.story-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(190px,250px);gap:30px;align-items:start}
@media (max-width:860px){.story-grid{grid-template-columns:1fr;gap:18px}}
.story-rail{display:grid;gap:1px;background:var(--line-soft);border:1px solid var(--line-soft);
  border-radius:10px;overflow:hidden}
/* Non-generic inner names on purpose. These were .r/.rk/.rv/.rs, and a single-letter
   class is a collision waiting to happen even when it is scoped: a bare `.rv{padding}`
   defined anywhere later has lower specificity for the properties this rule sets but
   full effect on every property it does not — which is how the rail's value box grew to
   172px tall with a one-line figure in it. */
.story-rail .srow{background:var(--panel2);padding:12px 14px}
.story-rail .srk{font-family:var(--mono);font-size:.58rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-faint)}
.story-rail .srv{font-family:var(--serif);font-size:1.5rem;line-height:1.04;margin-top:6px;
  color:var(--ink);font-variant-numeric:tabular-nums}
.story-rail .srs{font-size:.71rem;line-height:1.5;color:var(--ink-dim);margin-top:4px}
/* The head's right slot is .c-head .r, which this file has always styled; the engine
   now emits it from card({headRight}). No new class. */
/* Two ways of writing the same facts, so a segmented control rather than a toggle: a
   switch implies on/off, and neither of these is the absence of the other. */
.segswitch{display:inline-flex;border:1px solid var(--line);border-radius:100px;overflow:hidden;
  background:var(--panel2)}
.segswitch .seg{font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-faint);padding:5px 12px;background:none;border:none;transition:.15s;white-space:nowrap}
.segswitch .seg:hover{color:var(--ink-dim)}
.segswitch .seg.on{background:var(--accent);color:#1a1206}
.segswitch .seg:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.cite{color:var(--accent-soft);border-bottom:1px dashed rgba(232,161,60,.4);cursor:pointer;font-variant-numeric:tabular-nums}
.cite:hover{border-bottom-style:solid}
.cmm{font-family:var(--mono);font-size:.8rem;color:var(--ink-dim);margin-top:12px;padding-left:12px;border-left:2px solid var(--line);line-height:1.65}
.cmm b{color:var(--accent-soft);font-weight:500}
.askbox{background:linear-gradient(165deg,rgba(232,161,60,.09),var(--panel) 62%);border:1px solid rgba(232,161,60,.32);
  border-radius:12px;padding:15px 16px;display:flex;flex-direction:column;gap:11px;min-height:180px}
.ask-head{font-family:var(--serif);font-size:1.28rem;display:flex;align-items:center;gap:8px;line-height:1}
.ask-head i{font-style:italic;color:var(--accent)}.ask-head .ask-orb{color:var(--accent);font-size:1rem}
.ask-head .ask-sub{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-faint);margin-left:auto}
.ask-starters{display:flex;flex-direction:column;gap:7px}
.ask-chip{text-align:left;font-size:.86rem;color:var(--ink-dim);background:var(--panel2);border:1px solid var(--line);
  border-radius:8px;padding:8px 11px;transition:.15s;line-height:1.4}
.ask-chip:hover{border-color:rgba(232,161,60,.5);color:var(--ink)}
.ask-inrow{display:flex;gap:7px;margin-top:auto}
.ask-inrow input{flex:1;min-width:0;background:var(--panel2);border:1px solid var(--line);border-radius:8px;
  padding:9px 12px;color:var(--ink);font:inherit;font-size:.88rem;outline:none}
.ask-inrow input:focus{border-color:var(--accent)}

/* Shown in place of an answer when the shelf is not on this origin — the box
   must never appear to accept a question it cannot send. */
.askbox .ask-note{font-size:.78rem;line-height:1.55;color:var(--accent-soft);
  border-top:1px solid rgba(232,161,60,.25);padding-top:9px;margin-top:2px}
.askbox .ask-note code{font-family:var(--mono);font-size:.74rem}
.board{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 17px;position:relative}
.card.span2{grid-column:1/-1}
.card.hl{border-color:rgba(232,161,60,.35);box-shadow:0 0 0 1px rgba(232,161,60,.12),0 8px 40px rgba(232,161,60,.05)}
.c-head{display:flex;align-items:center;gap:9px;margin-bottom:14px}
.c-head .ic{font-size:.9rem;color:var(--accent);opacity:.8}
.c-head h3{font-size:.95rem;font-weight:500}
.c-head .r{margin-left:auto;display:flex;align-items:center;gap:7px}
.srcbadge{font-family:var(--mono);font-size:.6rem;text-transform:uppercase;letter-spacing:.07em;padding:4px 10px;
  border-radius:100px;color:var(--ink-dim);border:1px solid var(--line);white-space:nowrap}
.srcbadge.live{color:var(--green);border-color:rgba(107,191,89,.4);background:rgba(107,191,89,.06)}
.callout{font-size:.8rem;color:var(--ink-dim);margin-top:13px;line-height:1.6}
.fold{font-size:.76rem;color:var(--ink-faint);margin-top:15px;line-height:1.6}
.sub-h{font-family:var(--mono);font-size:.64rem;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-faint);
  margin:16px 0 10px;padding-top:12px;border-top:1px solid var(--line-soft)}

.bar-row{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;margin-bottom:11px}
.bar-row .bl{font-size:.84rem}.bar-row .bl small{color:var(--ink-faint);font-size:.68rem;margin-left:6px}
.bar-val{font-family:var(--mono);font-size:.78rem;color:var(--ink-dim);text-align:right}
.bar-track{grid-column:1/-1;height:7px;background:var(--panel2);border-radius:100px;overflow:hidden}
/* A ranked-row label that links to the entity's own page. Inherits the row's
   colour rather than the global link amber, so a list of eight links does not
   read as eight warnings; the underline only appears on hover. */
.bar-row .bl a.blink{color:inherit;text-decoration:none;border-bottom:1px solid transparent}
.bar-row .bl a.blink:hover{color:var(--accent);border-bottom-color:rgba(232,161,60,.5)}
.bar-fill{height:100%;border-radius:100px;background:var(--bc,var(--nd2))}
.pctbar{display:flex;height:14px;border-radius:100px;overflow:hidden;margin:5px 0 10px}.pctbar i{height:100%}
.mixleg{display:flex;flex-wrap:wrap;gap:10px 18px;font-size:.76rem;color:var(--ink-dim)}
.mixleg .sw{width:10px;height:10px;border-radius:3px;display:inline-block;margin-right:6px;vertical-align:middle}
.mixlab{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.64rem;text-transform:uppercase;
  letter-spacing:.09em;color:var(--ink-faint);margin-top:8px}.mixlab b{color:var(--ink)}
.ledger{display:grid;grid-template-columns:1fr 1fr 1fr;gap:11px}
.led{background:var(--panel2);border:1px solid var(--line-soft);border-radius:9px;padding:14px}
.led .ll{font-family:var(--mono);font-size:.62rem;text-transform:uppercase;letter-spacing:.09em;color:var(--ink-faint)}
.led .lv{font-family:var(--serif);font-size:1.55rem;margin-top:6px;line-height:1}
.led .ld{font-family:var(--mono);font-size:.68rem;color:var(--ink-dim);margin-top:5px}
.led.up{border-color:rgba(107,191,89,.35);background:rgba(107,191,89,.04)}.led.up .lv{color:var(--green)}
.led.dn{border-color:rgba(224,123,123,.35);background:rgba(224,123,123,.04)}.led.dn .lv{color:var(--red)}
/* A ledger label that IS a link — the budget card's line -> its public budget
   page (budget-link.js). Same treatment as the ranked-list .blink above: the
   label keeps its own colour and earns an underline on hover, because a row
   whose neighbours are plain text must not read as a different kind of row. */
.led .ll a.blink{color:inherit;text-decoration:none;border-bottom:1px solid rgba(232,161,60,.28)}
.led .ll a.blink:hover{color:var(--accent);border-bottom-color:rgba(232,161,60,.6)}
.buckets{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.bkt{background:var(--panel2);border:1px solid var(--line-soft);border-radius:9px;padding:13px;text-align:center}
.bkt.hot{border-color:rgba(224,123,123,.45);background:rgba(224,123,123,.07)}
.bkt .bv{font-family:var(--serif);font-size:1.45rem}.bkt.hot .bv{color:var(--red)}
.bkt .bl{font-family:var(--mono);font-size:.62rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-faint);margin-top:5px}

.glide{position:relative;height:230px;margin:6px 0 4px;padding:20px 8px 30px}
.gp-bars{position:absolute;inset:20px 8px 30px;display:flex;align-items:flex-end;gap:4%;justify-content:space-around}
.gp-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;position:relative}
.gp-bar{width:100%;background:linear-gradient(180deg,rgba(232,161,60,.6),rgba(232,161,60,.16));border-radius:6px 6px 0 0;border-top:2px solid var(--accent)}
.gp-col.partial .gp-bar{background:repeating-linear-gradient(135deg,rgba(232,161,60,.16),rgba(232,161,60,.16) 5px,transparent 5px,transparent 10px);
  border:1px dashed rgba(232,161,60,.5);border-bottom:none}
.gp-v{font-family:var(--mono);font-size:.7rem;margin-bottom:7px;white-space:nowrap}
.gp-l{font-family:var(--mono);font-size:.64rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-faint);position:absolute;bottom:-23px}

.section{display:flex;align-items:center;gap:12px;margin:30px 0 14px}
.section .sk{font-family:var(--mono);font-size:.8rem;color:var(--accent)}
.section .sn{font-family:var(--serif);font-size:1.35rem}
.section .rule{flex:1;height:1px;background:var(--line-soft)}
.fronts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.front{background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:15px 16px;text-align:left;
  transition:.2s;display:flex;flex-direction:column;gap:8px;min-height:124px;border-top:2px solid var(--fc,var(--line))}
.front:hover{border-color:var(--accent);transform:translateY(-2px)}
.front .fk{font-family:var(--mono);font-size:.62rem;text-transform:uppercase;letter-spacing:.11em;color:var(--fc,var(--accent));display:flex;justify-content:space-between;gap:8px}
.front .fk .fn{color:var(--ink-faint)}
.front .ff{font-family:var(--serif);font-size:1.3rem;line-height:1}
.front .fd{font-size:.78rem;color:var(--ink-dim);line-height:1.5}
.front .fgo{font-family:var(--mono);font-size:.62rem;text-transform:uppercase;letter-spacing:.09em;color:var(--accent);margin-top:auto}

.flash{animation:flash 1.4s ease}
@keyframes flash{0%,100%{box-shadow:none}30%{box-shadow:0 0 0 2px var(--accent),0 8px 40px rgba(232,161,60,.2)}}
.foot-note{margin-top:44px;padding-top:18px;border-top:1px solid var(--line-soft);font-size:.76rem;color:var(--ink-faint);line-height:1.75}
.foot-note b{color:var(--ink-dim);font-weight:500}
/* Boot: the Ask Hitch joyful-loading treatment — sphere + fading words +
   elapsed. The pre-JS fallback text inherits the same centered layout. */
.boot{min-height:62vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
  padding:34px 0 40px;text-align:center;font-family:var(--mono);font-size:.82rem;color:var(--ink-faint)}
.boot-sph{width:116px;height:116px;display:block}
.boot-msg{font-family:var(--serif);font-size:1.06rem;color:var(--ink);letter-spacing:.01em;
  min-height:1.3em;transition:opacity .3s}
.boot-sub{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.err{background:rgba(224,123,123,.07);border:1px solid rgba(224,123,123,.3);border-radius:10px;padding:14px 16px;color:var(--red);font-size:.86rem}
/* Ambiguous key picker — a shared order number resolved to several real
   contracts. Not an error state: the answer is a choice, so it reads like the
   page it will become, not like a warning. */
.ambig{margin:26px 0 40px}
.ambig-h{font-family:var(--serif);font-size:1.6rem;color:var(--ink);margin-bottom:6px}
.ambig-h b{font-family:var(--mono);font-size:1.25rem;color:var(--accent);font-weight:400}
.ambig-s{font-size:.88rem;color:var(--ink-dim);margin-bottom:18px}
.ambig-s b{font-family:var(--mono);color:var(--ink)}
.ambig-list{display:grid;gap:1px;background:var(--line-soft);border:1px solid var(--line);
  border-radius:12px;overflow:hidden}
.ambig-c{display:block;padding:12px 15px;background:var(--panel);text-decoration:none;transition:background .18s}
.ambig-c:hover{background:var(--panel2)}
.ambig-cp{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;color:var(--accent);margin-bottom:3px}
.ambig-cn{font-size:.86rem;color:var(--ink);line-height:1.35}
.ambig-f{margin-top:14px;font-size:.8rem;color:var(--ink-faint)}
/* No LIVE pills on dossier pages (owner) — also silences the badge any shared
   component (FYStack et al.) brings along. */
.srcbadge{display:none}
/* The platform module nav + account chip — same classes and look as
   index.html/people.html so the header is literally the same everywhere
   (owner). */
.modnav{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.modnav a,.modnav .cur{font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap;color:var(--ink-dim);border:1px solid var(--line);border-radius:100px;padding:4px 10px;text-decoration:none}
.modnav a:hover{color:var(--ink);border-color:var(--ink-dim)}
.modnav .cur{color:var(--accent);border-color:rgba(232,161,60,.5)}
/* the lit pill is a link now (back to its module's landing screen) — hovering it
   must not wash the selection out to the plain-link colors, so it stays accent
   and only the border warms. Must follow `.modnav a:hover` to win on order. */
.modnav a.cur:hover{color:var(--accent);border-color:rgba(232,161,60,.85)}
.acctchip{display:inline-flex;align-items:center;gap:8px;padding:5px 12px;margin-left:8px;border:1px solid var(--line);border-radius:100px;background:transparent;color:var(--ink);font-size:.8rem;cursor:pointer;white-space:nowrap}
.acctchip b{color:var(--accent);font-weight:600;text-transform:uppercase;font-size:.66rem;letter-spacing:.08em;font-family:var(--mono)}
.acctchip:hover{border-color:var(--ink-dim)}
@media(max-width:1000px){.callrow{grid-template-columns:1fr}.askbox{min-height:0}}
@media(max-width:900px){.vitals{grid-template-columns:1fr 1fr}.board{grid-template-columns:1fr}.card.span2{grid-column:auto}
  .fronts{grid-template-columns:1fr}.mh-title{font-size:2.5rem}.ledger,.buckets{grid-template-columns:1fr 1fr}}
@media(max-width:700px){header.bh{flex-wrap:wrap;row-gap:9px}.h-actions{margin-left:0;width:100%;flex-wrap:wrap}.freshpill{order:3}}
