/* ════════════════════════════════════════════════════════════════════
   FROST — the single design-token spine + core kit.
   Two modes: Arclight (dark, default) · Bloom (light).
   Scoped to html so these tokens WIN over every legacy :root
   block (higher specificity) without !important. This one file re-themes
   the whole portal; page-level styles are migrated onto it in later phases.
   Rulebook: frost portal design rules (2026-07-15).
   ════════════════════════════════════════════════════════════════════ */

/* ---- font roles (apply the type system everywhere) ---- */
html{
  --display:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --ui:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif;
  --dc-ui:var(--ui); --rm-ui:var(--ui);
  --mono:ui-monospace,"SF Mono","JetBrains Mono","Roboto Mono",Menlo,monospace;
  --radius-1:8px; --radius-2:12px;
  /* deal-flow chip palette (mode-independent constants — moved here from the
     stray cockpit.css :root so frost.css is the sole token source) */
  --chip-operating:#1e88e5; --chip-hyd:#43a047; --chip-fundraise:#8e24aa;
  --chip-personal:#fb8c00; --chip-unknown:#757575; --chip-stage:#455a64;
  --bd-yellow:#fff8c4; --bd-yellow-fg:#6e5d00;
}

/* ════ ARCLIGHT — dark (default) ════ */
html.theme-dark, :root{
  /* grounds & surfaces */
  --bg:#0C0F17; --bg2:#0E121C; --bg-elevated:#141926; --bg-elev:#141926; --bg-soft:#10141F;
  --surface:#141926; --surface-muted:#1C2233; --dc-bg:#0C0F17;
  --parchment:#141926; --parchment-2:#1C2233; --brand-bg-elev:#141926;
  /* panels / cards */
  --card:#141926; --cardin:#1C2233; --dc-panel:#141926; --panel:#141926; --panel-2:#1C2233; --panel-3:#232B42;
  --dc-panel-2:#1C2233; --rm-panel:#141926; --rm-panel-2:#1C2233; --rm-ink-soft:#C0CADE;
  /* text */
  --fg:#EBEFF8; --ink:#EBEFF8; --dc-ink:#EBEFF8; --rm-ink:#EBEFF8;
  --fg-muted:#C0CADE; --ink-soft:#C0CADE; --soft:#C0CADE; --dc-ink-soft:#C0CADE;
  --ink-dim:#828FA8; --muted:#828FA8; --mut:#828FA8; --dc-muted:#828FA8; --rm-muted:#828FA8; --rm-dim:#828FA8; --faint:#5A6478;
  /* lines */
  --border:rgba(130,160,240,.13); --border-strong:rgba(130,160,240,.24); --brand-border:rgba(130,160,240,.24);
  --line:rgba(130,160,240,.10); --rule:rgba(130,160,240,.10); --rule-soft:rgba(130,160,240,.06);
  --bd:rgba(130,160,240,.13); --dc-line:rgba(130,160,240,.10); --rm-line:rgba(130,160,240,.10);
  /* accent + gold (gold = brand & money only) */
  --accent:#5B8DEF; --accent-h:#82A6F6; --accent-p:#3E6BC4; --brand-accent:#5B8DEF;
  --gold:#D4AF57; --gold-2:#8C7436; --bronze:#D4AF57; --dc-gold:#D4AF57; --rm-gold:#D4AF57;
  --cyan:#48D6E0; --violet:#A98BF5;
  /* semantic */
  --pos:#46E09A; --success:#46E09A; --dc-green:#46E09A; --rm-green:#46E09A;
  --warn:#E7AC52; --dc-amber:#E7AC52; --rm-amber:#E7AC52;
  --danger:#FF6E6E; --neg:#FF6E6E; --crit:#FF6E6E; --dc-red:#FF6E6E; --rm-red:#FF6E6E;
  --pos-b:rgba(70,224,154,.14); --warn-b:rgba(231,172,82,.15); --crit-b:rgba(255,110,110,.14); --acc-b:rgba(91,141,239,.16);
  /* effects */
  --focus:rgba(91,141,239,.55); --hud-glow:0 0 24px rgba(91,141,239,.28);
  --shadow:0 1px 0 rgba(255,255,255,.04),0 14px 38px -18px rgba(0,0,0,.7);
  --shadow-2:0 1px 0 rgba(255,255,255,.04),0 20px 50px -22px rgba(0,0,0,.78);
  color-scheme:dark;
}

/* ════ BLOOM — light ════ */
html.theme-light{
  --bg:#EEF3F5; --bg2:#F1F5F8; --bg-elevated:#FFFFFF; --bg-elev:#FFFFFF; --bg-soft:#F3F7F9;
  --surface:#FFFFFF; --surface-muted:#F3F7F9; --dc-bg:#EEF3F5;
  --parchment:#FFFFFF; --parchment-2:#F3F7F9; --brand-bg-elev:#FFFFFF;
  --card:#FFFFFF; --cardin:#F3F7F9; --dc-panel:#FFFFFF; --panel:#FFFFFF; --panel-2:#F3F7F9; --panel-3:#E6EEF3;
  --dc-panel-2:#F3F7F9; --rm-panel:#FFFFFF; --rm-panel-2:#F3F7F9; --rm-ink-soft:#3A505C;
  --fg:#132029; --ink:#132029; --dc-ink:#132029; --rm-ink:#132029;
  --fg-muted:#3A505C; --ink-soft:#3A505C; --soft:#3A505C; --dc-ink-soft:#3A505C;
  --ink-dim:#68798A; --muted:#68798A; --mut:#68798A; --dc-muted:#68798A; --rm-muted:#68798A; --rm-dim:#68798A; --faint:#95A6B2;
  --border:rgba(20,50,70,.13); --border-strong:rgba(20,50,70,.22); --brand-border:rgba(20,50,70,.22);
  --line:rgba(20,50,70,.11); --rule:rgba(20,50,70,.11); --rule-soft:rgba(20,50,70,.06);
  --bd:rgba(20,50,70,.13); --dc-line:rgba(20,50,70,.11); --rm-line:rgba(20,50,70,.11);
  --accent:#1E86A6; --accent-h:#146A88; --accent-p:#0F5A76; --brand-accent:#1E86A6;
  --gold:#9A7A28; --gold-2:#C6A24C; --bronze:#9A7A28; --dc-gold:#9A7A28; --rm-gold:#9A7A28;
  --cyan:#1596A6; --violet:#7A50C0;
  --pos:#12915A; --success:#12915A; --dc-green:#12915A; --rm-green:#12915A;
  --warn:#B0741A; --dc-amber:#B0741A; --rm-amber:#B0741A;
  --danger:#C8302A; --neg:#C8302A; --crit:#C8302A; --dc-red:#C8302A; --rm-red:#C8302A;
  --pos-b:rgba(18,145,90,.12); --warn-b:rgba(176,116,26,.13); --crit-b:rgba(200,48,42,.11); --acc-b:rgba(30,134,166,.12);
  --focus:rgba(30,134,166,.5); --hud-glow:0 0 22px rgba(30,134,166,.18);
  --shadow:0 1px 2px rgba(20,40,55,.05),0 14px 34px -18px rgba(20,50,70,.24);
  --shadow-2:0 1px 2px rgba(20,40,55,.06),0 20px 46px -22px rgba(20,50,70,.28);
  color-scheme:light;
}

/* ---- base ---- */
html body{
  background:var(--bg); color:var(--fg); font-family:var(--ui);
  -webkit-font-smoothing:antialiased;
  background-image:radial-gradient(1100px 520px at 84% -10%, color-mix(in oklab,var(--accent) 8%,transparent), transparent 60%);
  background-attachment:fixed;
}
html h1,html h2,html h3.display,
html .display,html .brand-lockup,html .wordmark{font-family:var(--display)}
html .num,html [class*="__val"],html .amt,html .money{font-variant-numeric:tabular-nums;font-family:var(--mono)}

/* ---- footer menu (migrated from onehouse.css) ---- */
html .footer{width:100%;margin:48px 0 0;padding:16px 22px 18px;border-top:1px solid var(--border);color:var(--muted);font-size:13px;display:flex;flex-direction:column;gap:14px;background:var(--bg-elevated);box-sizing:border-box;box-shadow:0 -1px 0 color-mix(in oklab,var(--gold) 24%,transparent)}
html .footer__row{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap}
html .footer__menu{display:grid;grid-template-columns:repeat(4,minmax(140px,220px));gap:24px;justify-content:center;margin:0 auto;width:100%;max-width:1280px}
html .footer__col{display:flex;flex-direction:column;gap:6px}
html .footer__col-head{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:var(--gold);margin-bottom:4px}
html .footer__col a{color:var(--muted);text-decoration:none;font-size:13px;padding:1px 0}
html .footer__col a:hover{color:var(--fg);text-decoration:underline}
html .footer__row--meta{border-top:1px solid var(--border);padding-top:10px;margin-top:4px;font-size:11.5px;color:var(--muted)}
@media(max-width:900px){html .footer__menu{grid-template-columns:repeat(2,minmax(140px,1fr))}}

/* ---- mode toggle button (top bar) ---- */
html .frost-mode{cursor:pointer;width:34px;height:32px;border-radius:8px;border:1px solid var(--border);background:var(--card);color:var(--muted);display:inline-grid;place-items:center;font-size:15px;line-height:1;transition:.15s}
html .frost-mode:hover{color:var(--fg);border-color:var(--border-strong)}
html .frost-mode:focus-visible{outline:2px solid var(--focus);outline-offset:2px}

/* ---- signature infographic base classes (kit) ---- */
html .fx-glass{background:linear-gradient(160deg,color-mix(in oklab,var(--card) 92%,transparent),var(--card));border:1px solid var(--border-strong);border-radius:14px;box-shadow:inset 0 1px 0 rgba(255,255,255,.05),var(--shadow)}
html .fx-glow{text-shadow:var(--hud-glow)}
html .fx-gauge-track{stroke:var(--panel-3);fill:none}
html .fx-gauge-val{stroke:var(--accent);fill:none;stroke-linecap:round;filter:drop-shadow(0 0 6px color-mix(in oklab,var(--accent) 60%,transparent))}
html .fx-live{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--muted)}
html .fx-live .p{width:7px;height:7px;border-radius:50%;background:var(--pos);animation:fx-pulse 2.4s infinite}
@keyframes fx-pulse{0%{box-shadow:0 0 0 0 color-mix(in oklab,var(--pos) 60%,transparent)}70%{box-shadow:0 0 0 7px transparent}100%{box-shadow:0 0 0 0 transparent}}
html .fx-grid-bg{background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:34px 34px}
@media(prefers-reduced-motion:reduce){html *{animation:none!important;transition:none!important}}

/* radial gauge — wrapper + centred readout (SVG uses .fx-gauge-track/-val) */
html .fx-gauge{position:relative;display:inline-grid;place-items:center;line-height:1}
html .fx-gauge svg{display:block;transform:rotate(-90deg)}
html .fx-gauge__c{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
html .fx-gauge__num{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:700;color:var(--fg);letter-spacing:-.01em}
html .fx-gauge__lbl{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-top:2px}
html .fx-gauge-val--gold{stroke:var(--gold);filter:drop-shadow(0 0 6px color-mix(in oklab,var(--gold) 55%,transparent))}
html .fx-gauge-val--pos{stroke:var(--pos);filter:drop-shadow(0 0 6px color-mix(in oklab,var(--pos) 55%,transparent))}
html .fx-gauge-val--warn{stroke:var(--warn);filter:drop-shadow(0 0 6px color-mix(in oklab,var(--warn) 55%,transparent))}
html .fx-gauge-val--crit{stroke:var(--crit);filter:drop-shadow(0 0 6px color-mix(in oklab,var(--crit) 55%,transparent))}
@media(prefers-reduced-motion:no-preference){
  html .fx-gauge-val{transition:stroke-dashoffset 1.1s cubic-bezier(.22,1,.36,1)}
}

/* ════════════════════════════════════════════════════════════════════
   COMPONENT KIT — reusable, token-only, ADD-ONLY class names.
   Everything resolves through the Arclight/Bloom token spine above, so
   both modes are covered automatically and no legacy page can break.
   ════════════════════════════════════════════════════════════════════ */

/* ---- buttons ---- */
html .fbtn{
  --_bg:var(--card); --_fg:var(--fg); --_bd:var(--border-strong);
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  padding:9px 16px;border-radius:var(--radius-1);border:1px solid var(--_bd);
  background:var(--_bg);color:var(--_fg);font:600 13px/1 var(--ui);
  cursor:pointer;text-decoration:none;white-space:nowrap;
  transition:transform .12s,box-shadow .15s,border-color .15s,background .15s,filter .15s;
}
html .fbtn:hover{transform:translateY(-1px);border-color:var(--accent);box-shadow:var(--shadow)}
html .fbtn:active{transform:translateY(0)}
html .fbtn:disabled,html .fbtn[aria-disabled="true"]{opacity:.5;pointer-events:none}
html .fbtn--primary{--_bd:transparent;color:#fff;
  background:linear-gradient(135deg,var(--accent-h),var(--accent) 55%,var(--accent-p));
  box-shadow:0 6px 18px -8px color-mix(in oklab,var(--accent) 70%,transparent)}
html .fbtn--primary:hover{filter:brightness(1.06);border-color:transparent}
html .fbtn--gold{--_bd:transparent;color:#1a1406;
  background:linear-gradient(135deg,color-mix(in oklab,var(--gold) 86%,#fff),var(--gold) 60%,var(--gold-2));
  box-shadow:0 6px 18px -8px color-mix(in oklab,var(--gold) 66%,transparent)}
html .fbtn--gold:hover{filter:brightness(1.05);border-color:transparent}
html .fbtn--ghost{--_bg:transparent;--_bd:var(--border);color:var(--fg-muted)}
html .fbtn--ghost:hover{color:var(--fg);background:color-mix(in oklab,var(--accent) 8%,transparent)}
html .fbtn--danger{--_bd:transparent;color:#fff;
  background:linear-gradient(135deg,color-mix(in oklab,var(--danger) 88%,#fff),var(--danger))}
html .fbtn--danger:hover{filter:brightness(1.05);border-color:transparent}
html .fbtn--sm{padding:6px 11px;font-size:12px;border-radius:7px;gap:5px}

/* ---- card ---- */
html .fcard{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-2);
  padding:16px 18px;box-shadow:var(--shadow)}
html .fcard--pad-lg{padding:22px 24px}
html a.fcard,html .fcard--link{text-decoration:none;color:inherit;display:block;transition:border-color .12s,transform .12s}
html a.fcard:hover,html .fcard--link:hover{border-color:var(--accent);transform:translateY(-1px)}

/* ---- KPI (label + mono value) ---- */
html .fkpi{display:flex;flex-direction:column;gap:5px;min-width:0}
html .fkpi__lbl{font:600 10px/1.1 var(--ui);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
html .fkpi__val{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:700;
  font-size:clamp(18px,1.9vw,26px);line-height:1.04;color:var(--fg);letter-spacing:-.01em;overflow-wrap:anywhere}
html .fkpi__val small{font-size:13px;font-weight:600;color:var(--muted)}
html .fkpi__sub{font:400 11px/1.25 var(--ui);color:var(--muted)}
html .fkpi--pos .fkpi__val{color:var(--pos)}
html .fkpi--warn .fkpi__val{color:var(--warn)}
html .fkpi--crit .fkpi__val{color:var(--crit)}
html .fkpi--gold .fkpi__val{color:var(--gold)}

/* ---- pill / status chip ---- */
html .fpill{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;
  font:600 11px/1.5 var(--ui);border:1px solid var(--border);background:var(--card);color:var(--fg-muted)}
html .fpill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
html .fpill--pos{color:var(--pos);background:var(--pos-b);border-color:transparent}
html .fpill--warn{color:var(--warn);background:var(--warn-b);border-color:transparent}
html .fpill--crit{color:var(--crit);background:var(--crit-b);border-color:transparent}
html .fpill--acc{color:var(--accent);background:var(--acc-b);border-color:transparent}
html .fpill--plain::before{display:none}

/* ---- inputs ---- */
html .finput{width:100%;padding:9px 12px;border-radius:var(--radius-1);border:1px solid var(--border-strong);
  background:var(--cardin);color:var(--fg);font:400 13px/1.4 var(--ui);transition:border-color .15s,box-shadow .15s}
html .finput::placeholder{color:var(--faint)}
html .finput:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in oklab,var(--accent) 22%,transparent)}
html select.finput{appearance:none;cursor:pointer}
html textarea.finput{resize:vertical;line-height:1.5}

/* ---- table ---- */
html .ftable{width:100%;border-collapse:collapse;font:400 13px/1.5 var(--ui)}
html .ftable th{text-align:left;font:600 10px/1.1 var(--ui);text-transform:uppercase;letter-spacing:.07em;
  color:var(--muted);padding:9px 12px;border-bottom:1px solid var(--border-strong);white-space:nowrap}
html .ftable td{padding:10px 12px;border-bottom:1px solid var(--line);color:var(--fg)}
html .ftable tbody tr:hover{background:color-mix(in oklab,var(--accent) 6%,transparent)}
html .ftable .num,html .ftable td.num{font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right}

/* ---- tabs ---- */
html .ftabs{display:flex;gap:2px;border-bottom:1px solid var(--border);flex-wrap:wrap}
html .ftab{padding:9px 14px;font:600 13px/1 var(--ui);color:var(--muted);text-decoration:none;
  border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .12s,border-color .12s;cursor:pointer}
html .ftab:hover{color:var(--fg)}
html .ftab--active,html .ftab[aria-selected="true"]{color:var(--fg);border-bottom-color:var(--accent)}

/* ---- focus visibility everywhere (a11y) ---- */
html a:focus-visible,html button:focus-visible,html input:focus-visible,
html select:focus-visible,html textarea:focus-visible,html [tabindex]:focus-visible{
  outline:2px solid var(--focus);outline-offset:2px;border-radius:4px;
}

/* ---- Wave-0 cross-cutting utilities (2026-07-18 audit) ---- */
/* Wrap any wide table so it scrolls inside its own box instead of forcing the
   page body to scroll sideways on mobile. Usage: <div class="table-scroll">…</div> */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.table-scroll > table{min-width:max-content}

/* Semantic status-pill tints — restored after the dark-theme find/replace
   flattened them to one neutral (audit theme T5). Keyed by data-state so a pill
   reads live/ok/warn/bad/dark at a glance, in both Arclight and Bloom. */
.status-pill{display:inline-block;padding:2px 9px;border-radius:999px;
  font:700 10.5px/1.5 var(--ui,-apple-system,sans-serif);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.status-pill[data-state="live"],.status-pill[data-state="ok"],.status-pill[data-state="good"],
.status-pill[data-state="paid"],.status-pill[data-state="done"],.status-pill[data-state="resolved"]{
  color:var(--ok,#1f9d5c);background:color-mix(in srgb,var(--ok,#1f9d5c) 15%,transparent)}
.status-pill[data-state="warn"],.status-pill[data-state="stale"],.status-pill[data-state="pending"],
.status-pill[data-state="due"],.status-pill[data-state="open"]{
  color:var(--warn,#b8860b);background:color-mix(in srgb,var(--warn,#b8860b) 16%,transparent)}
.status-pill[data-state="bad"],.status-pill[data-state="dark"],.status-pill[data-state="overdue"],
.status-pill[data-state="escalated"],.status-pill[data-state="failed"],.status-pill[data-state="unpaid"]{
  color:var(--bad,#c23b3f);background:color-mix(in srgb,var(--bad,#c23b3f) 15%,transparent)}