/* ============================================================
   Carbon Ledger — shared chrome.
   Tokens, app shell, sidebar, account menu, theme registry,
   cards, forms, tables, tabs, alerts, overlays.
   ============================================================ */
:root{
  --bg:#f6f7f8; --panel:#ffffff; --ink:#12181d; --muted:#5d6b78; --faint:#8a97a3;
  --line:#e3e8ec; --line2:#eef2f5; --accent:#0f6b63; --accent-soft:#e6f2f0;
  --warn:#a3560c; --warn-bg:#fdf3e6; --warn-line:#f0d4ab;
  --danger:#9b2226; --danger-bg:#fdeced; --danger-line:#f3c4c6;
  --ok:#1d6a3d; --ok-bg:#e9f5ee; --ok-line:#c5e3d1;
  --info:#1e558f; --info-bg:#e3eefb; --info-line:#c2d8f2;
  --side:#f0f2f4; --side-ink:#12181d;
  --radius:7px; --shadow:0 1px 2px rgba(16,24,32,.05),0 6px 18px rgba(16,24,32,.05);
  /* Zebra tint. Mixed from the theme's own ink so it lands correctly on cream,
     navy and black alike rather than being a fixed grey. 4% was invisible in
     testing; 7% reads without competing with the selected-row and hover states. */
  --stripe:rgba(128,128,128,.07);
  --stripe:color-mix(in srgb, var(--ink) 7%, transparent);
}
.dark{--bg:#0e1215;--panel:#161c21;--ink:#e7edf1;--muted:#93a3b0;--faint:#6d7d8a;
  --line:#252e35;--line2:#1d252b;--accent:#38bfae;--accent-soft:#12302d;
  --warn:#e0a35c;--warn-bg:#2a2015;--warn-line:#4a3a22;--danger:#e8848a;--danger-bg:#2a1618;--danger-line:#4d2529;
  --ok:#63c98d;--ok-bg:#122318;--ok-line:#1f3d29;--info:#7fb2e8;--info-bg:#132435;--info-line:#1f3c58;
  --side:#11171b;--side-ink:#e7edf1;--shadow:0 1px 2px rgba(0,0,0,.3),0 6px 18px rgba(0,0,0,.25)}
.theme-sepia{--bg:#f5edda;--panel:#fdf8ec;--ink:#3b2f21;--muted:#6d5c47;--faint:#98876f;
  --line:#e2d5bb;--line2:#eee4d1;--accent:#8a5a2b;--accent-soft:#f0e2cd;--side:#efe3ca;--side-ink:#3b2f21}
.theme-comfort{--bg:#fbedd4;--panel:#fff8ea;--ink:#3d3222;--muted:#6f6148;--faint:#9a8b70;
  --line:#e8d7b6;--line2:#f3e7cf;--accent:#a8620d;--accent-soft:#f6e3c6;--side:#f5e4c4;--side-ink:#3d3222}
.theme-softgray{--bg:#e8e8e6;--panel:#f7f7f6;--ink:#232323;--muted:#5b5b5a;--faint:#8a8a88;
  --line:#d5d5d2;--line2:#e4e4e1;--accent:#4a5d54;--accent-soft:#dfe5e2;--side:#e0e0dd;--side-ink:#232323}
.theme-solarized{--bg:#fdf6e3;--panel:#fffbf0;--ink:#073642;--muted:#586e75;--faint:#93a1a1;
  --line:#e6dcc2;--line2:#f2ebd8;--accent:#268bd2;--accent-soft:#dceaf5;--side:#f5eed9;--side-ink:#073642}
.theme-paper{--bg:#f7f3ee;--panel:#ffffff;--ink:#1c1917;--muted:#57534e;--faint:#8a827c;
  --line:#e3ddd5;--line2:#efeae4;--accent:#c2551f;--accent-soft:#fbe6da;--side:#f0eae2;--side-ink:#1c1917}
.theme-contrast{--bg:#ffffff;--panel:#ffffff;--ink:#000;--muted:#1a1a1a;--faint:#3d3d3d;
  --line:#000;--line2:#c9c9c9;--accent:#0000cc;--accent-soft:#dcdcff;--side:#f0f0f0;--side-ink:#000}
.theme-amoled{--bg:#000;--panel:#0a0a0a;--ink:#f2f2f2;--muted:#9a9a9a;--faint:#6e6e6e;
  --line:#232323;--line2:#161616;--accent:#39d3c0;--accent-soft:#0d2b28;--side:#000;--side-ink:#f2f2f2;
  --ok:#63c98d;--ok-bg:#0d1f14;--ok-line:#1d3a26;--warn:#e0a35c;--warn-bg:#241b11;--warn-line:#453520;
  --danger:#e8848a;--danger-bg:#241315;--danger-line:#472226;--info:#7fb2e8;--info-bg:#0f1c2b;--info-line:#1b3350}
.theme-midnight{--bg:#0b1124;--panel:#111a35;--ink:#e3e9f7;--muted:#94a3c4;--faint:#6d7c9e;
  --line:#222f52;--line2:#182242;--accent:#6aa8ff;--accent-soft:#16264a;--side:#080e1e;--side-ink:#e3e9f7;
  --ok:#63c98d;--ok-bg:#10241a;--ok-line:#1e3d2b;--warn:#e0a35c;--warn-bg:#2a2115;--warn-line:#4a3a22;
  --danger:#e8848a;--danger-bg:#2a1719;--danger-line:#4d262a;--info:#7fb2e8;--info-bg:#13233d;--info-line:#223c62}
.theme-slate{--bg:#1e293b;--panel:#273449;--ink:#e2e8f0;--muted:#a0aec4;--faint:#7d8ba3;
  --line:#3a4a63;--line2:#2f3e55;--accent:#7dd3fc;--accent-soft:#1d3c50;--side:#172033;--side-ink:#e2e8f0;
  --ok:#6ee7a8;--ok-bg:#16301f;--ok-line:#245239;--warn:#e8b06a;--warn-bg:#33281a;--warn-line:#544025;
  --danger:#f19aa0;--danger-bg:#331d20;--danger-line:#553034;--info:#93c5fd;--info-bg:#1c3050;--info-line:#2c4670}
.theme-forest{--bg:#16231c;--panel:#1d2f25;--ink:#e0efe5;--muted:#9ab8a6;--faint:#749683;
  --line:#2c4436;--line2:#24382c;--accent:#6ede9f;--accent-soft:#173322;--side:#111c16;--side-ink:#e0efe5;
  --ok:#6ede9f;--ok-bg:#15301f;--ok-line:#245238;--warn:#e0b46a;--warn-bg:#2e2717;--warn-line:#4d4023;
  --danger:#eb939a;--danger-bg:#2e1c1e;--danger-line:#4e2e32;--info:#8fc0e8;--info-bg:#15283a;--info-line:#22415e}
.theme-espresso{--bg:#271c15;--panel:#33251c;--ink:#f0e6dc;--muted:#bda893;--faint:#95806c;
  --line:#4a382b;--line2:#3c2c22;--accent:#e0a86a;--accent-soft:#3d2c1c;--side:#1d140f;--side-ink:#f0e6dc;
  --ok:#8fce9c;--ok-bg:#1f2d1f;--ok-line:#35472f;--warn:#e0b46a;--warn-bg:#33271a;--warn-line:#524024;
  --danger:#ec9a98;--danger-bg:#331e1c;--danger-line:#54302e;--info:#9dbfe0;--info-bg:#1f2a36;--info-line:#33455a}
.theme-ion{--bg:#faf7f7;--panel:#fff;--ink:#1a1414;--muted:#5c4f4f;--faint:#8d7d7d;
  --line:#e6dcdc;--line2:#f0e9e9;--accent:#c1121f;--accent-soft:#fbe0e2;--side:#f3ecec;--side-ink:#1a1414}
.theme-facet{--bg:#f6faf6;--panel:#fff;--ink:#152016;--muted:#4d5f4f;--faint:#7e8f80;
  --line:#dce7dd;--line2:#e9f1ea;--accent:#2e7d32;--accent-soft:#dcefdd;--side:#eaf2ea;--side-ink:#152016}
.theme-badge{--bg:#f5fafb;--panel:#fff;--ink:#0f1c1f;--muted:#48605f;--faint:#7a9092;
  --line:#d8e6e8;--line2:#e7f0f1;--accent:#0e7490;--accent-soft:#d7edf3;--side:#e8f2f3;--side-ink:#0f1c1f}
.theme-berlin{--bg:#fbf7f4;--panel:#fff;--ink:#1e1611;--muted:#5f5148;--faint:#8f8177;
  --line:#e9ddd4;--line2:#f2eae4;--accent:#c2410c;--accent-soft:#fbe2d3;--side:#f3ebe4;--side-ink:#1e1611}
.theme-amethyst{--bg:#f9f7fd;--panel:#fff;--ink:#1a1526;--muted:#544c68;--faint:#867d9c;
  --line:#e4dcf2;--line2:#efe9f8;--accent:#7c3aed;--accent-soft:#e9defc;--side:#efeaf9;--side-ink:#1a1526}
.theme-marigold{--bg:#fdfaf0;--panel:#fff;--ink:#1f1a0c;--muted:#5e5540;--faint:#8f866c;
  --line:#eae2c9;--line2:#f4eeda;--accent:#a16207;--accent-soft:#f8ebc7;--side:#f6efdb;--side-ink:#1f1a0c}
.theme-integral{--bg:#080d10;--panel:#101a1e;--ink:#dff4f8;--muted:#8fb2ba;--faint:#688a92;
  --line:#1d3138;--line2:#15252b;--accent:#22d3ee;--accent-soft:#0e2e35;--side:#050a0c;--side-ink:#dff4f8;
  --ok:#5fd9a0;--ok-bg:#0c2419;--ok-line:#194433;--warn:#e0b46a;--warn-bg:#28231a;--warn-line:#453b24;
  --danger:#ef8f95;--danger-bg:#2a181a;--danger-line:#4a2a2e;--info:#7fc4e8;--info-bg:#0f2330;--info-line:#1b3a4e}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:14px/1.45 ui-sans-serif,system-ui,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased}
.spacer{flex:1}
a{color:var(--accent)}

/* ---------- shell ---------- */
.shell{display:flex;min-height:100vh}
.side{width:246px;flex:none;background:var(--side);color:var(--side-ink);border-right:1px solid var(--line);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.side .brand{display:flex;align-items:center;gap:9px;padding:14px 16px;border-bottom:1px solid var(--line);
  font-weight:650;letter-spacing:-.2px;font-size:14px}
.side .brand .mark{width:24px;height:24px;border-radius:6px;background:var(--accent);display:grid;
  place-items:center;color:#fff;font-size:11px;font-weight:700;flex:none}
.side .brand small{display:block;font-size:11px;font-weight:450;color:var(--faint);letter-spacing:0}
.nav{flex:1;overflow-y:auto;padding:8px}
.navgrp>button{width:100%;display:flex;align-items:center;gap:9px;padding:7px 9px;border:0;border-radius:6px;
  background:none;color:inherit;font:inherit;font-size:13px;font-weight:560;cursor:pointer;text-align:left}
.navgrp>button:hover{background:var(--line2)}
.navgrp.cur>button{color:var(--accent)}
.navgrp>button .ic{width:15px;text-align:center;font-size:12px;opacity:.75;flex:none}
.navgrp>button .cv{margin-left:auto;font-size:9px;color:var(--faint);transition:transform .16s}
.navgrp.open>button .cv{transform:rotate(90deg)}
.navgrp .kids{display:none;padding:1px 0 4px 30px}
.navgrp.open .kids{display:block}
.kids a{display:flex;align-items:center;gap:7px;padding:5px 9px;border-radius:5px;font-size:12.5px;
  color:var(--muted);text-decoration:none}
.kids a:hover{background:var(--line2);color:var(--ink)}
.kids a.active{background:var(--accent-soft);color:var(--accent);font-weight:600}
.main{flex:1;min-width:0}
.topbar{display:flex;align-items:center;gap:14px;padding:0 20px;height:52px;background:var(--panel);
  border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.crumb{color:var(--faint);font-size:13px}
.crumb b{color:var(--muted);font-weight:500}
.tenant{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);
  border:1px solid var(--line);border-radius:99px;padding:4px 11px 4px 5px}
.tenant .av{width:20px;height:20px;border-radius:99px;background:#1a4e8a;color:#fff;display:grid;
  place-items:center;font-size:10px;font-weight:700}
.wrap{max-width:1240px;margin:0 auto;padding:22px 20px 70px}
.pagehead{display:flex;align-items:flex-end;gap:16px;margin-bottom:18px}
h1{font-size:20px;margin:0 0 3px;letter-spacing:-.3px}
.sub{color:var(--muted);font-size:13px;margin:0;max-width:78ch}

/* ---------- account ---------- */
.acct{position:relative;border-top:1px solid var(--line);padding:10px}
.acctBtn{width:100%;display:flex;align-items:center;gap:10px;padding:6px 8px;border:0;border-radius:7px;
  background:none;color:inherit;font:inherit;cursor:pointer;text-align:left}
.acctBtn:hover{background:var(--line2)}
.acctBtn .av{width:34px;height:34px;border-radius:99px;background:var(--accent-soft);color:var(--accent);
  display:grid;place-items:center;font-weight:650;font-size:14px;flex:none}
.acctBtn .who{flex:1;min-width:0}
.acctBtn .who b{display:block;font-size:13px;font-weight:560;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acctBtn .who span{display:block;font-size:11.5px;color:var(--faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acctBtn .cv{font-size:9px;color:var(--faint);transition:transform .16s;flex:none}
.acct.open .acctBtn .cv{transform:rotate(180deg)}
.pop{position:absolute;bottom:100%;left:10px;right:10px;margin-bottom:8px;background:var(--panel);
  border:1px solid var(--line);border-radius:11px;padding:6px;box-shadow:0 12px 34px rgba(0,0,0,.18);display:none;z-index:40}
.acct.open .pop{display:block}
.pop .mail{padding:7px 11px;font-size:11.5px;color:var(--faint);overflow:hidden;text-overflow:ellipsis}
.pop hr{border:0;border-top:1px solid var(--line2);margin:5px 0}
.pop button,.pop a{display:flex;align-items:center;gap:9px;width:100%;padding:7px 11px;border:0;border-radius:6px;
  background:none;color:var(--ink);font:inherit;font-size:13px;cursor:pointer;text-align:left;text-decoration:none}
.pop button:hover,.pop a:hover{background:var(--line2)}
.pop .ic{width:14px;text-align:center;font-size:12px;opacity:.7}
.pop .danger{color:var(--danger)}
.pop .arrow{margin-left:auto;font-size:9px;color:var(--faint)}
.sub-wrap{position:relative}
.sub-wrap .flyout{position:absolute;left:calc(100% + 6px);bottom:-6px;min-width:190px;background:var(--panel);
  border:1px solid var(--line);border-radius:11px;padding:6px;box-shadow:0 12px 34px rgba(0,0,0,.18);display:none;z-index:41}
.sub-wrap.open .flyout{display:block}
.sub-wrap.open>#btnSettings{background:var(--line2)}

/* ---------- cards + forms ---------- */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);margin-bottom:16px}
.card>h2{font-size:12px;text-transform:uppercase;letter-spacing:.7px;color:var(--faint);margin:0;
  padding:13px 16px;border-bottom:1px solid var(--line2);font-weight:600;display:flex;align-items:center;gap:8px}
.card .body{padding:16px}
.row{display:grid;grid-template-columns:repeat(12,1fr);gap:13px}
.f{grid-column:span 6;display:flex;flex-direction:column;gap:5px;min-width:0}
.f.s2{grid-column:span 2}.f.s3{grid-column:span 3}.f.s4{grid-column:span 4}.f.s5{grid-column:span 5}
.f.s7{grid-column:span 7}.f.s8{grid-column:span 8}.f.s9{grid-column:span 9}.f.s12{grid-column:span 12}
label{font-size:12px;font-weight:560;color:var(--muted)}
label .req{color:var(--danger);margin-left:2px}
label .hint{font-weight:400;color:var(--faint);margin-left:5px}
input,select,textarea{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:6px;
  background:var(--bg);color:var(--ink);font:inherit;font-size:13.5px}
.dark input,.dark select,.dark textarea,.theme-amoled input,.theme-amoled select,.theme-amoled textarea,
.theme-integral input,.theme-integral select,.theme-integral textarea{background:var(--bg)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:transparent}
input[readonly],input:disabled,select:disabled{color:var(--muted);background:var(--line2);cursor:default}
input.derived{background:var(--ok-bg);border-color:var(--ok-line);color:var(--ink)}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--faint) 50%),
  linear-gradient(135deg,var(--faint) 50%,transparent 50%);
  background-position:calc(100% - 15px) 52%,calc(100% - 10px) 52%;background-size:5px 5px,5px 5px;
  background-repeat:no-repeat;padding-right:30px}
.inline{display:flex;gap:16px;padding-top:5px;flex-wrap:wrap}
.inline label{display:flex;align-items:center;gap:6px;font-weight:450;color:var(--ink);font-size:13px}
input[type=radio],input[type=checkbox]{width:auto;accent-color:var(--accent)}
.seg{display:flex;border:1px solid var(--line);border-radius:6px;overflow:hidden;width:100%}
.seg button{flex:1;background:var(--bg);border:0;border-right:1px solid var(--line);padding:8px 10px;
  font:inherit;font-size:13px;color:var(--muted);cursor:pointer;white-space:nowrap}
.seg button:last-child{border-right:0}
.seg button[aria-pressed=true]{background:var(--accent);color:#fff;font-weight:560}
.subhead{display:flex;align-items:center;gap:10px;margin:18px 0 12px}
.subhead span{font-size:11px;text-transform:uppercase;letter-spacing:.7px;color:var(--faint);font-weight:650}
.subhead i{flex:1;height:1px;background:var(--line2)}
.note{font-size:12px;color:var(--faint);margin:6px 0 0}
.linkbtn{background:none;border:0;padding:0;font:inherit;font-size:12px;color:var(--accent);cursor:pointer;
  text-decoration:underline;text-underline-offset:2px}
.btn{padding:8px 16px;border-radius:6px;font:inherit;font-size:13.5px;font-weight:560;cursor:pointer;
  border:1px solid var(--line);background:var(--panel);color:var(--ink)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.ghost{background:transparent;border-color:transparent;color:var(--muted)}
.btn.sm{padding:5px 11px;font-size:12.5px}

/* ---------- tabs ---------- */
.tabs{display:flex;gap:2px;padding:0 16px;border-bottom:1px solid var(--line2);background:var(--panel);
  border-radius:var(--radius) var(--radius) 0 0;overflow-x:auto}
.tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:13px 14px 11px;font:inherit;
  font-size:13.5px;font-weight:560;color:var(--muted);cursor:pointer;white-space:nowrap;display:flex;align-items:center;gap:7px}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-selected=true]{color:var(--accent);border-bottom-color:var(--accent)}
.tabs .dot{width:7px;height:7px;border-radius:99px;background:var(--danger);display:none}
.tabs .dot.on{display:block}
.tabs .num{font-size:11px;font-weight:700;color:var(--faint);border:1px solid var(--line);border-radius:99px;
  width:17px;height:17px;display:grid;place-items:center}
.tabs button[aria-selected=true] .num{color:var(--accent);border-color:var(--accent)}
.tabpanel{display:none}
.tabpanel.on{display:block;animation:fade .18s ease}
@keyframes fade{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
.cond{display:none}.cond.on{display:block}

/* ---------- pills, alerts, status ---------- */
.pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:3px 9px;
  border-radius:99px;background:var(--accent-soft);color:var(--accent)}
.pill.grey{background:var(--line2);color:var(--muted)}
.pill.ok{background:var(--ok-bg);color:var(--ok)}
.pill.warn{background:var(--warn-bg);color:var(--warn)}
.pill.danger{background:var(--danger-bg);color:var(--danger)}
.pill.info{background:var(--info-bg);color:var(--info)}
.alert{display:flex;gap:10px;padding:11px 13px;border-radius:6px;font-size:13px;line-height:1.5;margin-bottom:13px}
.alert .ic{flex:none;width:18px;height:18px;border-radius:99px;display:grid;place-items:center;font-size:11px;
  font-weight:700;color:#fff;margin-top:1px}
.alert.warn{background:var(--warn-bg);border:1px solid var(--warn-line);color:var(--warn)}
.alert.warn .ic{background:var(--warn)}
.alert.danger{background:var(--danger-bg);border:1px solid var(--danger-line);color:var(--danger)}
.alert.danger .ic{background:var(--danger)}
.alert.info{background:var(--info-bg);border:1px solid var(--info-line);color:var(--info)}
.alert.info .ic{background:var(--info)}
.alert.ok{background:var(--ok-bg);border:1px solid var(--ok-line);color:var(--ok)}
.alert.ok .ic{background:var(--ok)}
.alert b{display:block;margin-bottom:2px}
.prov{display:flex;align-items:center;gap:7px;font-size:12px;margin:2px 0 0}
.prov .tick{width:15px;height:15px;border-radius:99px;display:grid;place-items:center;font-size:9px;
  font-weight:700;color:#fff;flex:none}
.prov.ok{color:var(--ok)}.prov.ok .tick{background:var(--ok)}
.prov.miss{color:var(--faint)}.prov.miss .tick{background:var(--faint)}
.prov.local{color:var(--warn)}.prov.local .tick{background:var(--warn)}
.status{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;padding:7px 11px;
  border-radius:6px;border:1px solid var(--line);background:var(--line2);color:var(--muted);height:35px}
.status.cert{background:var(--ok-bg);border-color:var(--ok-line);color:var(--ok)}
.status.val{background:var(--ok-bg);border-color:var(--ok-line);color:var(--ok)}
.status.end{background:var(--info-bg);border-color:var(--info-line);color:var(--info)}
.status.pend{background:var(--warn-bg);border-color:var(--warn-line);color:var(--warn)}

/* ---------- KPI + stat ---------- */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-bottom:16px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow)}
.kpi .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--faint);font-weight:650}
.kpi .val{font-size:23px;font-weight:680;letter-spacing:-.5px;font-variant-numeric:tabular-nums;margin:6px 0 2px}
.kpi .cap{font-size:12px;color:var(--muted)}
.kv{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:13px;border-bottom:1px solid var(--line2)}
.kv:last-child{border-bottom:0}
.kv span{color:var(--muted)}
.kv b{font-weight:600;font-variant-numeric:tabular-nums;text-align:right}
.bar{height:6px;border-radius:99px;background:var(--line2);overflow:hidden;margin:9px 0 5px}
.bar i{display:block;height:100%;background:var(--accent);border-radius:99px}
.bar i.warn{background:var(--warn)}.bar i.danger{background:var(--danger)}
.pos{color:var(--ok)}.neg{color:var(--danger)}
.mixed{color:var(--faint);font-weight:450;font-style:italic}

/* ---------- tables ---------- */
/* Row shading and zoom. --z scales type and padding together so a zoomed grid
   stays proportioned rather than just getting bigger text in the same box. */
.zoomWrap{--z:1}
table.t{width:100%;border-collapse:separate;border-spacing:0;font-size:calc(13px * var(--z,1))}
table.t th{position:sticky;top:0;z-index:2;background:var(--panel);text-align:left;
  font-size:calc(11px * var(--z,1));
  text-transform:uppercase;letter-spacing:.55px;color:var(--faint);font-weight:650;
  padding:calc(9px * var(--z,1)) calc(12px * var(--z,1));
  border-bottom:1px solid var(--line);white-space:nowrap;cursor:pointer}
table.t th:hover{color:var(--accent)}
table.t th.num,table.t td.num{text-align:right;font-variant-numeric:tabular-nums}
table.t td{padding:calc(8px * var(--z,1)) calc(12px * var(--z,1));
  border-bottom:1px solid var(--line2);white-space:nowrap}
/* Zebra: a tint of the theme's own ink, so it lands correctly on every theme
   rather than being a fixed grey that disappears on cream and glares on black. */
table.t tbody:not(.bRow) tr:nth-child(even) td{background:var(--stripe)}
table.t tbody.bRow tr.det.alt td{background:var(--stripe)}
tr.grp td{background:var(--line2);font-weight:650;cursor:pointer;border-bottom:1px solid var(--line)}
table.t tbody.bRow tr.det.alt:hover td,
table.t tbody:not(.bRow) tr:nth-child(even):hover td,
table.t tbody tr:hover td{background:var(--accent-soft)}
tr.grp:hover td{background:var(--accent-soft)}
tr.grp .tw{display:inline-block;width:12px;color:var(--faint);font-size:9px}
tr.grp .cnt{font-weight:450;color:var(--faint);font-size:12px;margin-left:7px}
tr.grp.d1 td:first-child{padding-left:12px}
tr.grp.d2 td:first-child{padding-left:30px}
tr.grp.d3 td:first-child{padding-left:48px}
tr.det td:first-child{padding-left:18px}
.tScroll{overflow:auto;max-height:62vh;border-top:1px solid var(--line2)}
/* The totals row lives inside the table now, so it cannot drift out of column
   alignment with the body or ignore the zoom setting. */
tfoot.tFootIn td{position:sticky;bottom:0;background:var(--panel);border-top:1px solid var(--line);
  font-weight:680;padding:calc(11px * var(--z,1)) calc(12px * var(--z,1));white-space:nowrap;z-index:3}
tfoot.tFootIn td.num{text-align:right;font-variant-numeric:tabular-nums}
.grpAgg{float:right;font-variant-numeric:tabular-nums}
.tFoot{border-top:1px solid var(--line);background:var(--panel)}
table.tf{width:100%;border-collapse:separate;border-spacing:0;font-size:13px;font-weight:680}
table.tf td{padding:11px 12px;white-space:nowrap}
table.tf td.num{text-align:right;font-variant-numeric:tabular-nums}
.empty{padding:40px;text-align:center;color:var(--faint);font-size:13px}
.xbtn{background:none;border:1px solid var(--line);border-radius:5px;width:28px;height:32px;color:var(--faint);
  cursor:pointer;font-size:14px;line-height:1}
.xbtn:hover{color:var(--danger);border-color:var(--danger)}
.addrow{margin-top:2px;background:none;border:1px dashed var(--line);border-radius:6px;padding:7px 12px;
  font:inherit;font-size:13px;color:var(--muted);cursor:pointer;width:100%}
.addrow:hover{border-color:var(--accent);color:var(--accent)}
.recon{font-variant-numeric:tabular-nums;font-weight:650}
.recon.bad{color:var(--danger)}.recon.good{color:var(--ok)}

/* ---------- toolbar ---------- */
.bar{display:flex;align-items:center;gap:9px;padding:11px 16px;border-bottom:1px solid var(--line2);
  flex-wrap:wrap;background:var(--bg)}
.bar input[type=search]{width:230px;padding:6px 10px;font-size:13px}
.tool{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:6px 11px;font:inherit;
  font-size:13px;color:var(--ink);cursor:pointer;display:flex;align-items:center;gap:6px}
.tool:hover{border-color:var(--accent);color:var(--accent)}
.tool[aria-expanded=true]{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
.barlbl{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--faint);font-weight:650}
.zoomer{display:flex;gap:0;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:var(--panel)}
.zoomer .tool{border:0;border-radius:0;border-right:1px solid var(--line);padding:6px 10px}
.zoomer .tool:last-child{border-right:0}
.zoomer .zLvl{min-width:52px;justify-content:center;font-variant-numeric:tabular-nums;color:var(--muted)}
.bCols{font-weight:600}
.chips{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);color:var(--accent);
  border:1px solid transparent;border-radius:99px;padding:4px 6px 4px 11px;font-size:12.5px;font-weight:560}
.chip button{background:none;border:0;color:inherit;cursor:pointer;font-size:13px;line-height:1;opacity:.65;padding:0 3px}
.chip button:hover{opacity:1}
.chip .ord{font-size:10px;opacity:.7;font-weight:700}
.panel{border-bottom:1px solid var(--line2);background:var(--bg);padding:14px 16px;display:none}
.panel.on{display:block}
.panel h4{margin:0 0 4px;font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--faint);font-weight:650}
.hintline{font-size:12px;color:var(--faint);margin:0 0 10px}

/* ---------- column chooser ---------- */
.transfer{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:start}
.pane{min-width:0}
.paneHead{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--accent);font-weight:700;margin-bottom:6px}
.paneList{border:1px solid var(--line);border-radius:7px;background:var(--panel);height:250px;overflow-y:auto;padding:5px}
.paneList:empty::before{content:attr(data-empty);color:var(--faint);font-size:13px;padding:8px;display:block}
.mid{display:flex;flex-direction:column;gap:7px;padding-top:26px}
.ordBar{display:flex;gap:7px;justify-content:center;margin-top:8px}
.mv{width:38px;height:30px;border:1px solid var(--line);border-radius:6px;background:var(--bg);color:var(--muted);
  font:inherit;font-size:13px;cursor:pointer}
.mv:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
.colitem{display:flex;align-items:center;gap:9px;padding:6px 9px;border:1px solid transparent;border-radius:5px;
  font-size:13px;cursor:pointer;background:none;user-select:none}
.colitem:hover{background:var(--line2)}
.colitem.sel{background:var(--accent-soft);color:var(--accent);font-weight:560}
.colitem.req{color:var(--faint);cursor:default}
.colitem.dragging{opacity:.35}
.colitem.over{box-shadow:inset 0 2px 0 var(--accent)}
.colitem .grip{color:var(--faint);font-size:11px;letter-spacing:-1px;flex:none;cursor:grab}
.colitem .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.colitem .nm[contenteditable=true]:focus{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
.colitem .tag{margin-left:auto;font-size:10px;color:var(--faint);text-transform:uppercase;letter-spacing:.5px;flex:none}
.colitem .renamed{margin-left:auto;font-size:10px;color:var(--accent);flex:none}

/* ---------- overlays ---------- */
.ov{position:fixed;inset:0;background:rgba(10,15,20,.45);z-index:60;display:none;align-items:center;
  justify-content:center;padding:26px}
.ov.on{display:flex}
.ovBox{background:var(--panel);border:1px solid var(--line);border-radius:11px;width:640px;max-width:100%;
  max-height:100%;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.3)}
.ovBox header{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line)}
.ovBox header h3{margin:0;font-size:15px}
.ovBody{padding:16px 18px;overflow:auto}
.ovBody h4{margin:0 0 8px;font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--faint);font-weight:650}
.ovBody .themeGrid+h4,.ovBody h4+h4{margin-top:18px}
.closeX{background:none;border:1px solid var(--line);border-radius:6px;width:30px;height:30px;color:var(--muted);
  font-size:16px;cursor:pointer;line-height:1}
.closeX:hover{color:var(--danger);border-color:var(--danger)}
.themeGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}
.themeOpt{display:flex;align-items:center;gap:9px;padding:8px 10px;border:1px solid var(--line);border-radius:7px;
  background:var(--bg);cursor:pointer;font:inherit;font-size:13px;color:var(--ink);text-align:left}
.themeOpt:hover{border-color:var(--accent)}
.themeOpt[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft);color:var(--accent);font-weight:600}
.themeOpt .sw{width:18px;height:18px;border-radius:5px;border:1px solid rgba(128,128,128,.35);flex:none}
.themeOpt .tick{margin-left:auto;font-size:11px;display:none}
.themeOpt[aria-pressed=true] .tick{display:block}

/* ---------- connections ---------- */
.connSplit{display:grid;grid-template-columns:312px minmax(0,1fr);min-height:430px}
.connList{border-right:1px solid var(--line);overflow-y:auto;max-height:520px;padding:8px}
.connGrp{font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--faint);font-weight:700;padding:11px 10px 5px}
.connRow{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:1px solid transparent;
  border-radius:7px;background:none;color:var(--ink);font:inherit;font-size:13px;cursor:pointer;text-align:left}
.connRow:hover{background:var(--line2)}
.connRow[aria-current=true]{background:var(--accent-soft);border-color:var(--accent)}
.connRow .lg{width:26px;height:26px;border-radius:6px;display:grid;place-items:center;flex:none;font-size:10px;
  font-weight:700;background:var(--line2);color:var(--muted)}
.connRow[aria-current=true] .lg{background:var(--accent);color:#fff}
.connRow .tx{flex:1;min-width:0}
.connRow .tx b{display:block;font-weight:560;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.connRow .tx span{display:block;font-size:11.5px;color:var(--faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dotst{width:8px;height:8px;border-radius:99px;flex:none}
.dotst.ok{background:var(--ok)}.dotst.off{background:var(--faint)}
.dotst.err{background:var(--danger)}.dotst.warn{background:var(--warn)}
.connDetail{padding:16px 18px;overflow-y:auto;max-height:520px}
.connHead{display:flex;align-items:center;gap:12px;margin-bottom:4px}
.connHead h4{margin:0;font-size:15px;letter-spacing:-.2px;text-transform:none;color:var(--ink)}
.stpill{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;padding:3px 10px;
  border-radius:99px;background:var(--line2);color:var(--muted)}
.stpill.ok{background:var(--ok-bg);color:var(--ok)}
.stpill.err{background:var(--danger-bg);color:var(--danger)}
.stpill.warn{background:var(--warn-bg);color:var(--warn)}
.connDesc{font-size:12.5px;color:var(--faint);margin:0 0 14px;max-width:62ch}
.secret{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px dashed var(--line);border-radius:6px;
  font-size:12.5px;color:var(--muted);background:var(--bg)}
.secret code{font-family:ui-monospace,Consolas,monospace;font-size:12px;color:var(--ink)}
.scope{display:inline-flex;font-size:11px;padding:2px 8px;border-radius:99px;background:var(--line2);
  color:var(--muted);margin:0 5px 5px 0}

/* ---------- misc ---------- */
.split{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;align-items:start}
@media(max-width:1080px){.split{grid-template-columns:1fr}}
.actions{position:sticky;bottom:0;background:var(--panel);border-top:1px solid var(--line);padding:12px 20px;
  display:flex;gap:10px;align-items:center;margin:0 -20px -70px;box-shadow:0 -4px 14px rgba(16,24,32,.05);z-index:10}
.trace{font-size:12px;color:var(--faint)}
.chev{margin-left:auto;transition:transform .18s ease;font-size:10px;color:var(--faint)}
.card.open .chev{transform:rotate(180deg)}
.collapse{display:none}
.card.open .collapse{display:block}
.launch{width:100%;margin-top:12px;padding:8px 12px;border-radius:6px;border:1px solid var(--accent);
  background:var(--accent-soft);color:var(--accent);font:inherit;font-size:13px;font-weight:600;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:7px;text-decoration:none}
.launch:hover{background:var(--accent);color:#fff}
.clickable{cursor:pointer;user-select:none}

/* ---------- charts ----------
   Categorical slots: the validated 8-slot default, first six. Dark steps are
   the same hues re-stepped for a dark surface, not an automatic flip. */
.viz{--s1:#2a78d6;--s2:#eb6834;--s3:#1baf7a;--s4:#eda100;--s5:#e87ba4;--s6:#008300}
.dark .viz,.theme-amoled .viz,.theme-midnight .viz,.theme-slate .viz,
.theme-forest .viz,.theme-espresso .viz,.theme-integral .viz{
  --s1:#3987e5;--s2:#d95926;--s3:#199e70;--s4:#c98500;--s5:#d55181;--s6:#008300}
.vizPanelWrap{margin-bottom:16px}
.vizPanel{display:none;margin-top:12px;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}
.vizPanel.on{display:block;animation:fade .2s ease}
.vizSvg{width:100%;height:auto;display:block;overflow:visible}
.vizHead{display:flex;align-items:baseline;gap:12px;margin-bottom:10px}
.vizTitle{font-size:13px;font-weight:600}
.vizNote{font-size:12px;color:var(--faint)}
.vizHead .vizToggle{margin-left:auto;padding:4px 10px;font-size:12px}
.vTrack{fill:var(--line2)}
.vFill{fill:var(--accent)}
.vFill.ok{fill:var(--ok)}.vFill.warn{fill:var(--warn)}.vFill.danger{fill:var(--danger)}
.vTarget{stroke:var(--ink);stroke-width:2;opacity:.55}
.vGrid{stroke:var(--line2);stroke-width:1}
.vLabel{font-size:12px;fill:var(--ink)}
.vSub{font-size:11px;fill:var(--faint)}
.vAxis{font-size:10.5px;fill:var(--faint)}
.vValue{font-size:12.5px;font-weight:650;fill:var(--ink)}
.vValue.ok{fill:var(--ok)}.vValue.warn{fill:var(--warn)}.vValue.danger{fill:var(--danger)}
.vSegLabel{font-size:11.5px;font-weight:650;fill:#fff}
.vRunway{stroke:var(--line);stroke-width:2}
.vRunway.warn{stroke:var(--warn);opacity:.5}.vRunway.danger{stroke:var(--danger);opacity:.5}
.vDot{fill:var(--accent);stroke:var(--panel);stroke-width:2}
.vDot.ok{fill:var(--ok)}.vDot.warn{fill:var(--warn)}.vDot.danger{fill:var(--danger)}
.vLegend{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:12px;font-size:12.5px;color:var(--muted)}
.vLeg{display:inline-flex;align-items:center;gap:7px}
.vLeg i{width:11px;height:11px;border-radius:3px;flex:none}
.vLeg b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.vizTable{margin-top:4px}
.vizTip{position:fixed;z-index:200;pointer-events:none;background:var(--panel);color:var(--ink);
  border:1px solid var(--line);border-radius:7px;padding:8px 11px;font-size:12.5px;line-height:1.5;
  box-shadow:0 8px 24px rgba(0,0,0,.18);opacity:0;transition:opacity .1s;max-width:280px}
.vizTip.on{opacity:1}
.vizTip b{display:block;margin-bottom:2px}

/* archive */
.archTick{width:15px;height:15px;accent-color:var(--accent);cursor:pointer}
tr.archived td{opacity:.5}
.archBar{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--muted)}
