/* ═══════════════════════════════════════════════════════════════════
   TFL CRM — v3 design system, APPROVED LANGUAGE (from the Destinations
   pilot Kaleb signed off on):
   Plus Jakarta Sans everywhere · white cards on a cool #fafbfc canvas
   (the warm beige is gone) · soft shadows · violet accent · tinted
   status tags · green switches · pill tabs.
   Every page inherits this; the .d3 block at the end of this file is
   the Destinations pilot that defined it.
   Legacy variable aliases (--primary, --bg-card, --pos, …) are kept
   because shared page JS writes inline styles against them.
   ═══════════════════════════════════════════════════════════════════ */

:root, [data-theme="light"]{
  --bg:#fafbfc; --panel:#ffffff; --panel-2:#f4f5f8; --panel-3:#eceef3;
  --border:#e8eaf0; --border-2:#d8dbe5;
  /* text-3 / text-dim are real content (meta rows, labels, hints), so both clear WCAG AA:
     5.8:1 and 4.6:1 on white. The old #8a8fa0 / #b4b8c6 were 3.2:1 / 2.0:1. */
  --text:#15161c; --text-2:#4c505e; --text-3:#5f6577; --text-dim:#6a7082;
  --accent:#6d3fd4; --accent-h:#5b32bb; --accent-soft:#f2ecfe;
  --pos:#12855c; --pos-t:#e7f6f0; --warn:#9a6410; --warn-t:#fdf3e3;
  --neg:#c8342a; --neg-t:#fdeceb; --info:#2c5578; --info-t:#e9f0f6; --gold:#9a6410;
  --shadow-sm:0 1px 2px rgba(20,22,32,.04),0 1px 1px rgba(20,22,32,.03);
  --shadow-menu:0 4px 12px rgba(20,22,32,.08),0 14px 36px rgba(20,22,32,.10);
  --ring:0 0 0 3px rgba(109,63,212,.14);
  --font-ui:'Plus Jakarta Sans',-apple-system,'Segoe UI',sans-serif;
  --font-display:'Plus Jakarta Sans',-apple-system,sans-serif;
  /* legacy aliases */
  --primary:var(--accent); --primary-light:var(--accent);
  --bg-card:var(--panel); --bg-card-hover:var(--panel-2); --bg-input:var(--panel);
  --text-muted:var(--text-3); --success:var(--pos); --danger:var(--neg);
  --warning:var(--warn); --raise:var(--panel-2); --hover:var(--panel-2);
}
[data-theme="dark"]{
  /* Dark = the blue slate the team has used since day one (Pablo 2026-09-18: "not black,
     the blue we had"), with the indigo accent. Every text token clears AA on the panel:
     text-3 5.7:1, text-dim 4.8:1, accent 4.9:1; the primary button keeps dark text (6.2:1). */
  --bg:#0f172a; --panel:#1e293b; --panel-2:#26334a; --panel-3:#334155;
  --border:#334155; --border-2:#475569;
  --text:#f1f5f9; --text-2:#cbd5e1; --text-3:#94a3b8; --text-dim:#8494ad;
  --accent:#818cf8; --accent-h:#a5b4fc; --accent-soft:rgba(99,102,241,.2);
  --pos:#34d399; --pos-t:rgba(16,185,129,.16); --warn:#fbbf24; --warn-t:rgba(245,158,11,.16);
  --neg:#f87171; --neg-t:rgba(239,68,68,.15); --info:#7dd3fc; --info-t:rgba(56,189,248,.15); --gold:#fbbf24;
  --shadow-sm:0 1px 2px rgba(2,6,23,.4);
  --shadow-menu:0 4px 14px rgba(2,6,23,.45),0 16px 40px rgba(2,6,23,.55);
  --ring:0 0 0 3px rgba(129,140,248,.28);
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--font-ui);
  font-size:0.84375rem;line-height:1.5;background:var(--bg);color:var(--text);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
.mono,code{font-family:inherit;font-variant-numeric:tabular-nums;letter-spacing:0}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:2px}
::selection{background:var(--accent-soft)}
svg.ic{width:16px;height:16px;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:-3px}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--border-2);border-radius:6px;border:2px solid var(--bg)}
::-webkit-scrollbar-track{background:transparent}

/* ── Login ─────────────────────────────────────────────────────── */
.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg);padding:20px}
.login-card{width:100%;max-width:384px;background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:38px 34px;box-shadow:var(--shadow-sm)}
.login-card h1{font-size:1.1875rem;font-weight:800;letter-spacing:-.02em;margin-bottom:4px;display:flex;align-items:center;gap:10px}
.login-card>p{font-size:0.8125rem;color:var(--text-3);margin-bottom:24px}
.error-msg{margin-top:12px;font-size:0.78125rem;color:var(--neg)}
.code-input{text-align:center;font-family:'JetBrains Mono',monospace;font-size:1.25rem!important;letter-spacing:.35em}

/* ── Forms ─────────────────────────────────────────────────────── */
.form-group{margin-bottom:13px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
label{display:block;font-size:0.71875rem;font-weight:700;color:var(--text-2);margin-bottom:5px}
input,select,textarea{
  width:100%;padding:8px 12px;font-family:inherit;font-size:0.84375rem;color:var(--text);
  background:var(--panel-2);border:1px solid transparent;border-radius:10px;outline:none;
  transition:border-color .12s,box-shadow .12s,background .12s;
}
input:focus,select:focus,textarea:focus{background:var(--panel);border-color:var(--accent);box-shadow:var(--ring)}
input::placeholder,textarea::placeholder{color:var(--text-dim)}
input[type="checkbox"],input[type="radio"]{width:auto;accent-color:var(--accent)}
input[type="date"]{color-scheme:light}
[data-theme="dark"] input[type="date"]{color-scheme:dark}
select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238a8fa0' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:30px}
input[type="search"]{background-color:var(--panel);border-color:var(--border)}

/* ── Buttons ───────────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  height:34px;padding:0 14px;font-family:inherit;font-size:0.8125rem;font-weight:600;
  color:var(--text-2);background:var(--panel);border:1px solid var(--border-2);
  border-radius:10px;cursor:pointer;white-space:nowrap;text-decoration:none!important;
  transition:background .12s,border-color .12s,color .12s;
}
.btn:hover{background:var(--panel-2);color:var(--text)}
.btn-primary,.btn.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:700;box-shadow:var(--shadow-sm)}
.btn-primary:hover{background:var(--accent-h);border-color:var(--accent-h);color:#fff}
[data-theme="dark"] .btn-primary,[data-theme="dark"] .btn.btn-primary{color:#151122}
.btn-outline{background:var(--panel)}
.btn-success{background:var(--panel);border-color:var(--border-2);color:var(--pos);font-weight:700}
.btn-danger{background:transparent;border-color:transparent;color:var(--neg)}
.btn-danger:hover{background:var(--neg-t);color:var(--neg)}
.btn-ghost{display:inline-flex;align-items:center;gap:5px;height:27px;padding:0 9px;font-family:inherit;font-size:0.78125rem;font-weight:600;color:var(--text-3);background:none;border:none;border-radius:8px;cursor:pointer}
.btn-ghost:hover{background:var(--panel-2);color:var(--text)}
.btn-sm{height:30px;padding:0 12px;font-size:0.78125rem;border-radius:9px}
.btn-xs{height:25px;padding:0 9px;font-size:0.75rem;border-radius:8px}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;border:none;background:none;color:var(--text-3);cursor:pointer}
.icon-btn:hover{background:var(--panel-2);color:var(--text)}

/* ── App shell ─────────────────────────────────────────────────── */
.app{display:flex;min-height:100vh}
.sidebar{
  width:218px;flex:none;display:flex;flex-direction:column;
  padding:16px 12px 12px;background:var(--panel);border-right:1px solid var(--border);
  position:sticky;top:0;height:100vh;overflow:hidden;
}
.sidebar-header{display:flex;align-items:center;gap:10px;padding:2px 8px 18px}
.brand-tile{width:28px;height:28px;flex:none;border-radius:9px;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-size:0.75rem;font-weight:800;letter-spacing:-.02em}
[data-theme="dark"] .brand-tile{color:#151122}
.sidebar-header h2{font-size:0.90625rem;font-weight:800;letter-spacing:-.02em;line-height:1.15}
.sidebar-header small{font-size:0.6875rem;color:var(--text-3);font-weight:600}
.sidebar-nav{flex:1;overflow-y:auto;overscroll-behavior:contain;margin:0 -4px;padding:0 4px}
/* 21 pages in 7 sections: tighter rhythm than the v3 preview's 11-item nav so the whole
   list fits a 900px-tall window without scrolling (row 34px, section gap 10px). */
.nav-section{font-size:0.6875rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-dim);padding:10px 8px 4px}
.nav-section:first-child{padding-top:0}
.nav-item{
  display:flex;align-items:center;gap:10px;padding:7px 10px;margin-bottom:1px;
  font-size:0.84375rem;font-weight:600;color:var(--text-2);border-radius:10px;cursor:pointer;
  transition:background .1s,color .1s;
}
.nav-item svg.ic{color:var(--text-3)}
.nav-item:hover{background:var(--panel-2);color:var(--text)}
.nav-item.active{background:var(--accent-soft);color:var(--accent);font-weight:700}
.nav-item.active svg.ic{color:var(--accent)}
/* Hub sub-menu: chevron on the hub row, indented list with a guide line; only the open hub renders items. */
.nav-item.has-sub::after{content:'';margin-left:auto;width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg) translate(-1px,1px);opacity:.5;transition:transform .15s}
.nav-item.has-sub.open{color:var(--text)}
.nav-item.has-sub.open::after{transform:rotate(45deg) translate(-2px,-1px)}
.nav-sub{display:none;flex-direction:column;gap:1px;margin:2px 0 6px 20px;padding-left:8px;border-left:1px solid var(--border-2)}
.nav-sub.open{display:flex}
.nav-subitem{padding:6px 10px;font-size:0.8125rem;font-weight:500;color:var(--text-3);border-radius:8px;cursor:pointer;transition:background .1s,color .1s}
.nav-subitem:hover{background:var(--panel-2);color:var(--text)}
.nav-subitem.active{background:var(--accent-soft);color:var(--accent);font-weight:700}
.sidebar-footer{padding-top:10px;border-top:1px solid var(--border)}
.user-info{display:flex;align-items:center;gap:9px;padding:4px 6px}
.user-avatar{width:28px;height:28px;flex:none;border-radius:50%;background:var(--panel-3);color:var(--text-2);display:flex;align-items:center;justify-content:center;font-size:0.6875rem;font-weight:800}
.user-name{font-size:0.78125rem;font-weight:700;line-height:1.25}
.user-role{font-size:0.6875rem;color:var(--text-3)}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{
  display:flex;align-items:center;gap:14px;height:56px;padding:0 26px;
  border-bottom:1px solid var(--border);position:sticky;top:0;z-index:40;
  background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(8px);
}
.topbar h1{font-size:0.96875rem;font-weight:800;letter-spacing:-.02em;white-space:nowrap}
.topbar-search{flex:1;display:flex;justify-content:center}
.search-box{max-width:330px;height:34px;padding:0 12px 0 34px;font-size:0.8125rem;background:var(--panel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238a8fa0' stroke-width='2.1' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") no-repeat 12px center;border:1px solid var(--border);border-radius:11px;box-shadow:var(--shadow-sm)}
.topbar-actions{display:flex;align-items:center;gap:4px}
.notif-bell{position:relative;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;color:var(--text-3);cursor:pointer}
.notif-bell:hover{background:var(--panel-2);color:var(--text)}
.notif-badge{position:absolute;top:3px;right:3px;min-width:14px;height:14px;padding:0 3px;border-radius:7px;background:var(--neg);color:#fff;font-size:0.6875rem;font-weight:800;display:flex;align-items:center;justify-content:center;line-height:1}
.content{flex:1;padding:22px 28px 60px;max-width:1480px;width:100%;margin:0 auto}

/* hub sub-tabs strip — pill tabs on the canvas */

/* ── Panels (cards) ────────────────────────────────────────────── */
.card,.panel{background:var(--panel);border:1px solid var(--border);border-radius:15px;padding:18px 20px;margin-bottom:14px;box-shadow:var(--shadow-sm)}
.panel.flush{padding:0;overflow:hidden}
.card-header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}
.card-header h2{font-size:0.90625rem;font-weight:800;letter-spacing:-.015em}
.panel-h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px 12px;border-bottom:1px solid var(--border)}
.panel-h .t{font-size:0.90625rem;font-weight:800;letter-spacing:-.015em}
.panel-h .m{font-size:0.75rem;color:var(--text-3);font-weight:500}
.hd-note{font-size:0.75rem;color:var(--text-3)}
.back-btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 13px 0 10px;font-size:0.78125rem;font-weight:600;color:var(--text-2);background:var(--panel);border:1px solid var(--border);border-radius:9px;cursor:pointer;margin-bottom:16px;width:fit-content}
.back-btn:hover{background:var(--panel-2)}

/* ── KPI stats ─────────────────────────────────────────────────── */
.stats-grid,.kpi-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:12px;margin-bottom:16px}
.stat-card,.kpi{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:14px 17px 12px;cursor:pointer;box-shadow:var(--shadow-sm);transition:border-color .12s,transform .12s}
.stat-card:hover,.kpi.lnk:hover{border-color:var(--border-2);transform:translateY(-1px)}
.kpi.static{cursor:default}
.stat-card .label,.kpi .label{font-size:0.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);margin-bottom:6px}
.stat-card .value,.kpi .value{font-size:1.5rem;font-weight:800;letter-spacing:-.028em;line-height:1.05;font-variant-numeric:tabular-nums;color:var(--text)!important}
.stat-card .change,.kpi .sub{font-size:0.71875rem;color:var(--text-3);margin-top:4px}
.stat-card .change.down{color:var(--neg)}
.kpi .sub b{font-weight:700;color:var(--text-2)}
.kpi .sub .bad{color:var(--neg);font-weight:700}
/* summary bar → card cells */
.sumbar{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:12px;margin-bottom:16px}
.sumbar>div{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:13px 17px 11px;box-shadow:var(--shadow-sm)}
.sumbar .label{font-size:0.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);margin-bottom:4px}
.sumbar .value{font-size:1.3125rem;font-weight:800;letter-spacing:-.025em;font-variant-numeric:tabular-nums}
.sumbar .sub{font-size:0.71875rem;color:var(--text-3);margin-top:2px}

/* ── Tables ────────────────────────────────────────────────────── */
.table-wrap{overflow-x:auto;margin:0 -20px;padding:0 20px}
.panel.flush .table-wrap,.card.flush .table-wrap{margin:0;padding:0}
table{width:100%;border-collapse:collapse;font-size:0.8125rem}
th{
  text-align:left;padding:9px 12px;font-size:0.71875rem;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);
  background:var(--panel-2);border-bottom:1px solid var(--border);white-space:nowrap;
}
.card th,.panel th{background:transparent}
.panel.flush th,.card.flush th{background:var(--panel-2)}
td{padding:11px 12px;border-bottom:1px solid var(--border);vertical-align:middle;color:var(--text-2);font-variant-numeric:tabular-nums}
td strong{color:var(--text);font-weight:700}
tbody tr{transition:background .08s}
tbody tr:hover{background:var(--panel-2)}
tbody tr:last-child td{border-bottom:none}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
.rowsub{font-size:0.71875rem;color:var(--text-3);font-weight:500;margin-top:1px}
.thsort{cursor:pointer;user-select:none}
.thsort:hover{color:var(--text-2)}
.thsort .ar{color:var(--accent);font-weight:800}
.sect-row td{padding:9px 12px;font-size:0.6875rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-dim);background:var(--bg)}

/* ── Status: tinted tags (the approved language) + dot-words ───── */
.dotw{display:inline-flex;align-items:center;gap:6px;font-size:0.78125rem;font-weight:600;color:var(--text-2);white-space:nowrap}
.dotw::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--text-dim);flex:none}
.dotw.ok::before{background:var(--pos)}
.dotw.info::before{background:var(--info)}
.dotw.warn::before{background:var(--warn)}
.dotw.neg::before{background:var(--neg)}
.dotw.acc::before{background:var(--accent)}
.dotw.warn.txt{color:var(--warn)}
.dotw.neg.txt{color:var(--neg)}
.badge,[class*="badge-"]:not(.notif-badge){
  display:inline-flex;align-items:center;gap:5px;padding:0 9px;height:22px;
  border-radius:7px;font-size:0.6875rem;font-weight:700;line-height:1;
  background:var(--panel-3);color:var(--text-2);white-space:nowrap;border:none;
}
.badge-active,.badge-green,.badge-signed{background:var(--pos-t);color:var(--pos)}
.badge-blue,.badge-sent{background:var(--info-t);color:var(--info)}
.badge-prospect,.badge-viewed{background:var(--accent-soft);color:var(--accent)}
.badge-yellow,.badge-warning,.badge-paused,.badge-medium,.badge-high{background:var(--warn-t);color:var(--warn)}
.badge-red,.badge-urgent,.badge-inactive{background:var(--neg-t);color:var(--neg)}
.badge-low,.badge-draft{background:var(--panel-3);color:var(--text-3)}
.chip{display:inline-flex;align-items:center;gap:4px;padding:0 8px;height:20px;border-radius:7px;font-size:0.6875rem;font-weight:700;background:var(--panel-3);color:var(--text-3);line-height:1}
.code-badge{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:19px;padding:0 6px;border-radius:6px;font-size:0.6875rem;font-weight:800;letter-spacing:.04em;background:var(--panel-3);color:var(--text-2)}
.initials-badge{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;flex:none;border-radius:9px;font-size:0.6875rem;font-weight:800;background:var(--accent-soft);color:var(--accent)}
.tag{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:7px;font-size:0.71875rem;font-weight:700;margin:0 4px 4px 0}
.tag .remove{cursor:pointer;opacity:.55;font-weight:800}
.tag .remove:hover{opacity:1}

/* ── Filter chips / segmented ──────────────────────────────────── */
.filters{display:flex;gap:7px;flex-wrap:wrap}
.filter-btn{
  display:inline-flex;align-items:center;gap:6px;height:31px;padding:0 13px;
  font-family:inherit;font-size:0.78125rem;font-weight:600;color:var(--text-2);
  background:var(--panel);border:1px solid var(--border);border-radius:99px;cursor:pointer;
  transition:all .12s;white-space:nowrap;
}
.filter-btn:hover{border-color:var(--border-2);color:var(--text)}
.filter-btn.active{background:var(--text);border-color:var(--text);color:var(--bg);font-weight:700}
.filter-btn .n{font-size:0.6875rem;opacity:.6;font-weight:700}
.seg{display:inline-flex;gap:3px;padding:4px;background:var(--panel-2);border-radius:11px}
.seg-btn{height:30px;padding:0 14px;font-family:inherit;font-size:0.78125rem;font-weight:600;color:var(--text-3);background:transparent;border:none;border-radius:8px;cursor:pointer;transition:all .12s}
.seg-btn:hover{color:var(--text)}
.seg-btn.active{background:var(--panel);color:var(--text);font-weight:700;box-shadow:var(--shadow-sm)}
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.toolbar .sp{flex:1}

/* ── Progress ──────────────────────────────────────────────────── */
.bar{height:6px;border-radius:99px;background:var(--panel-3);overflow:hidden;min-width:40px}
.bar>i{display:block;height:100%;border-radius:99px;background:var(--accent)}
.bar>i.ok{background:var(--pos)}.bar>i.warn{background:var(--warn)}.bar>i.neg{background:var(--neg)}.bar>i.dim{background:var(--border-2)}
.pace-bar{height:6px;border-radius:99px;background:var(--panel-3);overflow:hidden}
.pace-bar>div{height:100%;background:var(--accent);border-radius:99px}
.pace-bar.pace-neg>div{background:var(--neg)}
.dlvcell{display:flex;align-items:center;gap:10px;min-width:0}
.dlvcell .dn{font-size:0.8125rem;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap}
.dlvcell .dn span{font-weight:500;color:var(--text-dim)}
.dlvcell .bar{flex:1;max-width:150px}
.sdot{width:7px;height:7px;border-radius:50%;background:var(--text-dim);flex:none;display:inline-block}
.sdot.ok{background:var(--pos)}.sdot.info{background:var(--info)}.sdot.warn{background:var(--warn)}.sdot.neg{background:var(--neg)}

/* ── Feed ──────────────────────────────────────────────────────── */
.feed-i{display:flex;gap:11px;padding:12px 18px;border-bottom:1px solid var(--border)}
.feed-i:last-child{border-bottom:none}
.feed-i .fdot{width:7px;height:7px;border-radius:50%;background:var(--text-dim);flex:none;margin-top:6px}
.feed-i .fdot.acc{background:var(--accent)}.feed-i .fdot.ok{background:var(--pos)}.feed-i .fdot.info{background:var(--info)}.feed-i .fdot.warn{background:var(--warn)}
.feed-i .fb{flex:1;min-width:0}
.feed-i .ft{font-size:0.8125rem;font-weight:700;color:var(--text)}
.feed-i .fd{font-size:0.78125rem;color:var(--text-3);margin-top:1px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.feed-i .fm{font-size:0.71875rem;color:var(--text-dim);white-space:nowrap;flex:none;padding-top:1px}
.showmore{display:block;width:100%;padding:11px;text-align:center;font-family:inherit;font-size:0.78125rem;font-weight:700;color:var(--text-3);background:none;border:none;border-top:1px solid var(--border);cursor:pointer}
.showmore:hover{color:var(--accent);background:var(--panel-2)}
.timeline-item{display:flex;gap:11px;padding:11px 0;border-bottom:1px solid var(--border)}
.timeline-item:last-child{border-bottom:none}
.timeline-icon{width:8px;height:8px;flex:none;border-radius:50%;background:var(--text-dim);margin-top:6px;font-size:0;color:transparent;overflow:hidden}
.timeline-icon.contract,.timeline-icon.proposal{background:var(--accent)}
.timeline-icon.inbound,.timeline-icon.website_form{background:var(--pos)}
.timeline-icon.call,.timeline-icon.meeting,.timeline-icon.demo{background:var(--info)}
.timeline-content{flex:1;min-width:0}
.timeline-content .title{font-size:0.8125rem;font-weight:700;color:var(--text);text-transform:capitalize}
.timeline-content .desc{font-size:0.78125rem;color:var(--text-3);margin-top:1px}
.timeline-content .time{font-size:0.71875rem;color:var(--text-dim);margin-top:3px}

/* ── Kebab menus ───────────────────────────────────────────────── */
.kebab{position:relative;display:inline-block}
.kebab>button{display:inline-flex;align-items:center;justify-content:center;width:27px;height:27px;border:none;border-radius:8px;background:none;color:var(--text-dim);cursor:pointer;font-size:0.9375rem;line-height:1;letter-spacing:1px}
.kebab>button:hover{background:var(--panel-3);color:var(--text)}
.menu{position:absolute;top:calc(100% + 4px);right:0;z-index:80;min-width:184px;padding:5px;background:var(--panel);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-menu)}
.menu button,.menu a{display:flex;width:100%;align-items:center;gap:8px;padding:8px 11px;font-family:inherit;font-size:0.78125rem;font-weight:600;color:var(--text-2);background:none;border:none;border-radius:8px;cursor:pointer;text-align:left;text-decoration:none!important;white-space:nowrap}
.menu button:hover,.menu a:hover{background:var(--panel-2);color:var(--text)}
.menu button.neg{color:var(--neg)}
.menu button.neg:hover{background:var(--neg-t)}
.menu .sep{height:1px;background:var(--border);margin:4px 6px}
.menu .mlabel{padding:6px 10px 3px;font-size:0.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim)}

/* ── Switch (green, from the pilot) ────────────────────────────── */
.switch{position:relative;display:inline-block;width:38px;height:22px;flex:none}
.switch input{opacity:0;width:0;height:0}
.slider{position:absolute;inset:0;background:var(--border-2);border-radius:99px;cursor:pointer;transition:background .15s}
.slider:before{content:'';position:absolute;width:18px;height:18px;left:2px;top:2px;background:#fff;border-radius:50%;transition:transform .15s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.switch input:checked+.slider{background:var(--pos)}
.switch input:checked+.slider:before{transform:translateX(16px)}
.switch-cell{display:flex;align-items:center;gap:8px}
.switch-label{font-size:0.78125rem;color:var(--text-2);font-weight:600;min-width:44px}
body .switch .slider{background:var(--border-2)}
body .switch input:checked+.slider{background:var(--pos)}

/* ── Modals ────────────────────────────────────────────────────── */
.modal-overlay{position:fixed;inset:0;background:rgba(21,22,28,.4);z-index:200;display:none;align-items:flex-start;justify-content:center;padding:5vh 20px;overflow-y:auto;backdrop-filter:blur(2px)}
[data-theme="dark"] .modal-overlay{background:rgba(0,0,0,.6)}
.modal-overlay.show{display:flex}
.modal{width:100%;max-width:620px;background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:22px 24px;box-shadow:var(--shadow-menu)}
.modal h2,.modal h3{font-size:1rem;font-weight:800;letter-spacing:-.02em;margin-bottom:16px}
.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}

/* ── Tabs (in-page) ────────────────────────────────────────────── */
.tabs{display:flex;gap:5px;background:var(--panel-2);padding:4px;border-radius:11px;width:fit-content;border-bottom:none}
.tab{padding:0 15px;height:32px;display:inline-flex;align-items:center;font-size:0.8125rem;font-weight:600;color:var(--text-3);cursor:pointer;border-radius:8px;margin-bottom:0;border-bottom:none}
.tab:hover{color:var(--text)}
.tab.active{color:var(--text);font-weight:700;background:var(--panel);box-shadow:var(--shadow-sm);border-bottom:none}

/* ── Kanban ────────────────────────────────────────────────────── */
.kanban{display:flex;gap:12px;overflow-x:auto;padding-bottom:16px;align-items:flex-start}
.kanban-col{min-width:234px;width:234px;flex:none;background:var(--panel-2);border:1px solid var(--border);border-radius:14px;padding:8px;border-top-width:3px}
.kanban-header{display:flex;align-items:center;gap:7px;padding:6px 8px 9px;font-size:0.78125rem;font-weight:700;color:var(--text-2)!important;background:none!important}
.kanban-header .kdot{width:8px;height:8px;border-radius:50%;flex:none}
.kanban-header .kn{margin-left:auto;font-size:0.6875rem;font-weight:700;color:var(--text-3);background:var(--panel-3);border-radius:99px;padding:1px 8px}
.kanban-body{min-height:48px;display:flex;flex-direction:column;gap:7px;border-radius:8px}
.kanban-card{background:var(--panel);border:1px solid var(--border);border-radius:11px;padding:10px 12px;cursor:pointer;box-shadow:var(--shadow-sm)}
.kanban-card:hover{border-color:var(--border-2)}
.kanban-card .firm-name{font-size:0.8125rem;font-weight:700;color:var(--text)}
.kanban-card .firm-meta{font-size:0.71875rem;color:var(--text-3);margin-top:3px}

/* ── Misc ──────────────────────────────────────────────────────── */
.empty{padding:30px 18px;text-align:center;font-size:0.8125rem;color:var(--text-3)}
.def-grid{display:grid;grid-template-columns:auto 1fr;column-gap:18px;row-gap:8px;font-size:0.8125rem}
.def-grid dt{font-size:0.75rem;font-weight:600;color:var(--text-3);white-space:nowrap;padding-top:1px}
.def-grid dd{color:var(--text-2);min-width:0;overflow-wrap:anywhere}
.ent-link{color:var(--text);font-weight:700;cursor:pointer;border-radius:3px}
.ent-link:hover{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.note-box{padding:11px 13px;background:var(--panel-2);border-radius:11px;font-size:0.78125rem;color:var(--text-2);line-height:1.55}
.info-line{display:flex;align-items:center;gap:8px;padding:9px 12px;border:1px dashed var(--border-2);border-radius:10px;font-size:0.78125rem;color:var(--text-3)}
.toast{position:fixed;bottom:22px;right:22px;z-index:400;display:none;padding:11px 16px;background:var(--text);color:var(--bg);border-radius:12px;font-size:0.8125rem;font-weight:600;box-shadow:var(--shadow-menu)}
.toast.error{background:var(--neg);color:#fff}
.toast.success{background:var(--text);color:var(--bg)}
.imper-banner{position:fixed;bottom:0;left:0;right:0;z-index:300;display:flex;align-items:center;justify-content:center;gap:12px;padding:8px 16px;background:var(--warn);color:#fff;font-size:0.78125rem;font-weight:600}
.imper-banner button{height:24px;padding:0 10px;border:1px solid rgba(255,255,255,.5);border-radius:7px;background:transparent;color:#fff;font-size:0.75rem;font-weight:700;cursor:pointer}
body.imper .content{padding-bottom:100px}
details.disc>summary{list-style:none;cursor:pointer;font-size:0.78125rem;font-weight:600;color:var(--text-3);display:inline-flex;align-items:center;gap:5px;border-radius:7px;padding:2px 4px}
details.disc>summary:hover{color:var(--text)}
details.disc>summary::-webkit-details-marker{display:none}
details.disc>summary::before{content:'';width:0;height:0;border-left:4px solid currentColor;border-top:3.5px solid transparent;border-bottom:3.5px solid transparent;transition:transform .12s}
details.disc[open]>summary::before{transform:rotate(90deg)}
.detl{font-size:0.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);margin-bottom:3px}
.rowdet td{background:var(--panel-2);padding:12px 16px;font-size:0.78125rem;color:var(--text-2)}
.rowdet .dl{display:flex;gap:26px;flex-wrap:wrap}
.rowdet .dl b{display:block;font-size:0.6875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--text-dim);margin-bottom:2px}

/* ── Activity ledger (dashboard) ───────────────────────────────── */
.atag{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:7px;font-size:0.6875rem;font-weight:700;white-space:nowrap;flex:none;letter-spacing:.02em}
.atag.v{background:var(--accent-soft);color:var(--accent)}
.atag.g{background:var(--pos-t);color:var(--pos)}
.atag.b{background:var(--info-t);color:var(--info)}
.atag.a{background:var(--warn-t);color:var(--warn)}
.atag.r{background:var(--neg-t);color:var(--neg)}
.atag.n{background:var(--panel-3);color:var(--text-3)}
.act-day{padding:9px 18px 5px;font-size:0.6875rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-dim);background:var(--bg);border-bottom:1px solid var(--border)}
.act-row{display:flex;align-items:center;gap:10px;padding:9px 18px;border-bottom:1px solid var(--border);cursor:pointer}
.act-row:last-child{border-bottom:none}
.act-row:hover{background:var(--panel-2)}
.act-row:hover .act-f{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.act-t{width:58px;flex:none;font-size:0.71875rem;color:var(--text-dim);font-variant-numeric:tabular-nums}
.act-f{font-size:0.8125rem;font-weight:700;color:var(--text);white-space:nowrap;flex:none}
.act-g{flex:1;min-width:0;font-size:0.78125rem;color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ── Tasks (urgency groups + expandable rows) ──────────────────── */
.tk{border-bottom:1px solid var(--border)}
.tk:last-child{border-bottom:none}
.tk-row{display:flex;align-items:center;gap:10px;padding:11px 18px;cursor:pointer}
.tk-row:hover{background:var(--panel-2)}
.tk-row input[type=checkbox]{width:16px;height:16px;flex:none;cursor:pointer}
.tk-title{font-size:0.84375rem;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.tk-title.done{text-decoration:line-through;opacity:.55}
.tk-sp{flex:1}
.tk-who{font-size:0.75rem;color:var(--text-3);white-space:nowrap}
.tk-due{font-size:0.75rem;font-weight:600;color:var(--text-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.tk-due.late{color:var(--neg)}
.tk-due.dim{color:var(--text-dim);font-weight:500}
.tk-chev{color:var(--text-dim);font-size:0.6875rem;flex:none;transition:transform .12s}
.tk.open .tk-chev{transform:rotate(90deg)}
.tk-det{display:none;padding:2px 18px 13px 44px}
.tk.open .tk-det{display:block}
.tk-lead{font-size:0.78125rem;color:var(--text-2);margin-bottom:8px;max-width:640px}
.tk-kv{display:flex;gap:8px 22px;flex-wrap:wrap}
.tk-kv>div{font-size:0.78125rem;color:var(--text-2)}
.tk-kv>div>span{display:block;font-size:0.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);margin-bottom:1px}
.tk-hr{color:var(--neg)!important}
.tk-ha{color:var(--warn)!important}

/* ── Shared design components: skins ───────────────────────────── */
body .dest-chip{border-radius:99px;height:31px;font-size:0.78125rem;border:1px solid var(--border);background:var(--panel);color:var(--text-2)}
body .dest-chip.on{background:var(--text);border-color:var(--text);color:var(--bg)}
body .dest-chip.on b{color:var(--bg)}
body .stat-box{border:1px solid var(--border);border-radius:14px;background:var(--panel)}
body .ent-link{font-weight:700;color:var(--text)}
body .ent-link:hover{color:var(--accent)}

/* ── Responsive ────────────────────────────────────────────────── */
/* Phone / narrow: the sidebar slides in over the page from a menu button in the topbar
   (toggleSidebar in core.js); a backdrop closes it, so does picking a page or Esc. */
.nav-toggle{display:none}
.sidebar-backdrop{display:none;position:fixed;inset:0;background:rgba(2,6,23,.5);z-index:99}
@media (max-width:980px){
  .sidebar{position:fixed;left:-240px;top:0;bottom:0;z-index:100;transition:left .2s;box-shadow:var(--shadow-menu)}
  .sidebar.open{left:0}
  .nav-toggle{display:inline-flex}
  body.nav-open .sidebar-backdrop{display:block}
  body.nav-open{overflow:hidden}
  .main{margin-left:0;min-width:0}
  .content{padding:16px 14px 60px}
  .topbar{padding:0 12px;gap:8px}
  .topbar h1{font-size:0.9rem;overflow:hidden;text-overflow:ellipsis}
  .topbar-search{display:none}
  .form-row,.form-row-3{grid-template-columns:1fr}
  /* pages that lay out in columns on desktop */
  #dd2Controls{flex-wrap:wrap}
  #dd2Kpis{grid-template-columns:1fr 1fr!important}
  #dd2Panels{grid-template-columns:1fr!important}
  #retSendPage{grid-template-columns:1fr!important}
  #retSummary{position:static!important}
  .stats-grid{grid-template-columns:1fr 1fr}
  .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
}
@media (prefers-reduced-motion:reduce){.sidebar{transition:none}}
@media print{.sidebar,.topbar{display:none}}

/* ═══════════════════════════════════════════════════════════════════
   DESTINATIONS v3.3 (.d3 scope) — Kaleb's picked blend:
   Style 2's visual language (Plus Jakarta Sans, white cards, soft
   shadows, violet accent, tinted tags) + Style 4's action-first
   grouped LIST (with a Tiles toggle) + Style 5's bar reborn as
   ACTIVE-IO FULFILLMENT with quota-met / rebill notices.
   Light-first; usable in dark via remapped tokens.
   ═══════════════════════════════════════════════════════════════════ */
.d3{
  --dbg:#fafbfc; --dw:#ffffff; --dsoft:#f4f5f8; --dline:#e8eaf0; --dline2:#d8dbe5;
  --dtx:#15161c; --dtx2:#4c505e; --dtx3:#8a8fa0; --dtx4:#b4b8c6;
  --dvi:#6d3fd4; --dvih:#5b32bb; --dvit:#f2ecfe;
  --dgr:#12855c; --dgrt:#e7f6f0; --dam:#9a6410; --damt:#fdf3e3; --drd:#c8342a; --drdt:#fdeceb;
  --dbl:#2c5578; --dblt:#e9f0f6;
  --fj:'Plus Jakarta Sans',-apple-system,'Segoe UI',sans-serif;
  --dsh:0 1px 2px rgba(20,22,32,.04),0 1px 1px rgba(20,22,32,.03);
  --dshh:0 4px 12px rgba(20,22,32,.07),0 1px 3px rgba(20,22,32,.05);
  font-family:var(--fj);color:var(--dtx);
}
[data-theme="dark"] .d3{
  --dbg:transparent; --dw:#17171b; --dsoft:#212127; --dline:#26262d; --dline2:#34343d;
  --dtx:#f2f2f4; --dtx2:#c3c3cc; --dtx3:#8a8a96; --dtx4:#5e5e69;
  --dvi:#9d7bea; --dvih:#b094f0; --dvit:rgba(157,123,234,.16);
  --dgr:#3ecf97; --dgrt:rgba(62,207,151,.14); --dam:#e0a648; --damt:rgba(224,166,72,.14);
  --drd:#ef7266; --drdt:rgba(239,114,102,.13); --dbl:#7ba2c4; --dblt:rgba(123,162,196,.14);
  --dsh:0 1px 2px rgba(0,0,0,.3); --dshh:0 4px 14px rgba(0,0,0,.4);
}
.d3 .hd{display:flex;align-items:center;gap:16px;margin:2px 0 20px}
.d3 .hd .pgtitle{font-family:var(--fj);font-size:1.625rem;font-weight:800;letter-spacing:-.028em}
.d3 .hd .pgsub{font-size:0.8125rem;color:var(--dtx3);margin-top:2px}
/* buttons */
.d3 .b-vi{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 17px;font-family:var(--fj);font-size:0.84375rem;font-weight:700;color:#fff;background:var(--dvi);border:none;border-radius:11px;cursor:pointer;box-shadow:var(--dsh);text-decoration:none!important;white-space:nowrap}
.d3 .b-vi:hover{background:var(--dvih)}
[data-theme="dark"] .d3 .b-vi{color:#151122}
.d3 .b-gh{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 15px;font-family:var(--fj);font-size:0.8125rem;font-weight:600;color:var(--dtx2);background:var(--dw);border:1px solid var(--dline2);border-radius:11px;cursor:pointer;text-decoration:none!important;white-space:nowrap}
.d3 .b-gh:hover{background:var(--dsoft);color:var(--dtx)}
.d3 .b-vi.sm,.d3 .b-gh.sm{height:33px;padding:0 13px;font-size:0.78125rem;border-radius:9px}
.d3 .b-vi.xs,.d3 .b-gh.xs{height:27px;padding:0 10px;font-size:0.75rem;border-radius:8px}
/* KPI summary cards */
.d3 .sumrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:12px;margin-bottom:18px}
.d3 .sum{background:var(--dw);border:1px solid var(--dline);border-radius:14px;padding:14px 17px 12px;box-shadow:var(--dsh)}
.d3 .sum .l{font-size:0.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--dtx4)}
.d3 .sum .v{font-size:1.5rem;font-weight:800;letter-spacing:-.028em;margin-top:3px;font-variant-numeric:tabular-nums;line-height:1.05}
.d3 .sum .v.warn{color:var(--dam)}
.d3 .sum .s{font-size:0.71875rem;color:var(--dtx3);margin-top:3px}
/* toolbar */
.d3 .tbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.d3 .srch{position:relative;flex:0 1 300px;min-width:220px}
.d3 .srch svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--dtx4)}
.d3 .srch input{width:100%;height:40px;padding:0 14px 0 37px;font-family:var(--fj);font-size:0.84375rem;color:var(--dtx);background:var(--dw);border:1px solid var(--dline);border-radius:11px;outline:none;box-shadow:var(--dsh)}
.d3 .srch input:focus{border-color:var(--dvi);box-shadow:0 0 0 3px var(--dvit)}
.d3 .vseg{display:inline-flex;gap:3px;padding:4px;background:var(--dsoft);border-radius:11px}
.d3 .vseg button{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 13px;font-family:var(--fj);font-size:0.78125rem;font-weight:600;color:var(--dtx3);background:none;border:none;border-radius:8px;cursor:pointer}
.d3 .vseg button:hover{color:var(--dtx)}
.d3 .vseg button.on{background:var(--dw);color:var(--dtx);font-weight:700;box-shadow:var(--dsh)}
/* tags (style 2) */
.d3 .tag{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 9px;border-radius:7px;font-size:0.6875rem;font-weight:700;background:var(--dsoft);color:var(--dtx2);white-space:nowrap}
.d3 .tag.v{background:var(--dvit);color:var(--dvi)}
.d3 .tag.g{background:var(--dgrt);color:var(--dgr)}
.d3 .tag.a{background:var(--damt);color:var(--dam)}
.d3 .tag.r{background:var(--drdt);color:var(--drd)}
.d3 .tag.b{background:var(--dblt);color:var(--dbl)}
.d3 .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--dline2);flex:none}
.d3 .dot.on{background:var(--dgr);box-shadow:0 0 0 3px var(--dgrt)}
/* fulfillment bar — refined: slim, rounded, quota-aware */
.d3 .fulf{min-width:0}
.d3 .fulf .fl{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:0.71875rem;margin-bottom:5px}
.d3 .fulf .fl .fn{font-weight:700;color:var(--dtx2);font-variant-numeric:tabular-nums}
.d3 .fulf .fl .fn span{font-weight:500;color:var(--dtx4)}
.d3 .fbar{height:6px;border-radius:99px;background:var(--dsoft);overflow:hidden}
.d3 .fbar>i{display:block;height:100%;border-radius:99px;background:var(--dvi)}
.d3 .fbar>i.met{background:var(--dgr)}
.d3 .fbar>i.soon{background:var(--dam)}
.d3 .fulf .fnote{font-size:0.6875rem;font-weight:700;margin-top:5px}
.d3 .fulf .fnote.met{color:var(--dgr)}
.d3 .fulf .fnote.soon{color:var(--dam)}
.d3 .fulf .none{font-size:0.75rem;color:var(--dtx4)}
/* group containers (style 4 flow in style 2 skin) */
.d3 .grp{background:var(--dw);border:1px solid var(--dline);border-radius:15px;box-shadow:var(--dsh);margin-bottom:14px;overflow:hidden}
.d3 .grp .gh{display:flex;align-items:center;gap:11px;padding:14px 18px;cursor:pointer;user-select:none}
.d3 .grp .gh .chev{color:var(--dtx4);font-size:0.6875rem;width:10px;flex:none}
.d3 .grp .gh .t{font-size:0.90625rem;font-weight:800;letter-spacing:-.015em}
.d3 .grp .gh .n{display:inline-flex;align-items:center;justify-content:center;min-width:23px;height:21px;padding:0 8px;border-radius:7px;background:var(--dsoft);font-size:0.71875rem;font-weight:700;color:var(--dtx2)}
.d3 .grp .gh .d{font-size:0.75rem;color:var(--dtx3);font-weight:500}
.d3 .grp .gh .side{margin-left:auto;display:flex;align-items:center;gap:14px;font-size:0.71875rem;color:var(--dtx4)}
.d3 .grp .gh .side b{font-weight:700;color:var(--dtx2);font-variant-numeric:tabular-nums}
.d3 .grp.at .gh .t{color:var(--dam)}
.d3 .grp.at .gh .n{background:var(--damt);color:var(--dam)}
.d3 .gbody{border-top:1px solid var(--dline)}
/* list rows */
.d3 .lrow{display:grid;grid-template-columns:1.45fr minmax(150px,1.05fr) 108px 74px 60px 96px 1fr 30px;gap:14px;align-items:center;padding:13px 18px;border-bottom:1px solid var(--dline);cursor:pointer}
.d3 .lrow:last-child{border-bottom:none}
.d3 .lrow:hover{background:var(--dbg)}
[data-theme="dark"] .d3 .lrow:hover{background:var(--dsoft)}
.d3 .lrow .nm{font-size:0.875rem;font-weight:700;letter-spacing:-.012em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.d3 .lrow .sub{font-size:0.71875rem;color:var(--dtx3);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.d3 .cl{font-size:0.6875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--dtx4)}
.d3 .cv{font-size:0.875rem;font-weight:700;font-variant-numeric:tabular-nums;margin-top:1px}
.d3 .cv.dim{color:var(--dtx4);font-weight:500}
.d3 .cv.neg{color:var(--drd)}
.d3 .acts{display:flex;flex-wrap:wrap;gap:5px;justify-content:flex-end}
.d3 .kb{background:none;border:none;font-size:1rem;letter-spacing:1px;color:var(--dtx4);cursor:pointer;line-height:1;padding:2px}
.d3 .kb:hover{color:var(--dtx)}
.d3 .lhead{display:grid;grid-template-columns:1.45fr minmax(150px,1.05fr) 108px 74px 60px 96px 1fr 30px;gap:14px;padding:9px 18px;border-bottom:1px solid var(--dline);background:var(--dbg)}
[data-theme="dark"] .d3 .lhead{background:var(--dsoft)}
.d3 .lhead span{font-size:0.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--dtx4)}
/* tiles */
.d3 .tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:13px;padding:15px 18px 17px}
.d3 .tile{background:var(--dw);border:1px solid var(--dline);border-radius:15px;padding:16px 17px 14px;box-shadow:var(--dsh);cursor:pointer;transition:box-shadow .14s,transform .14s,border-color .14s}
.d3 .tile:hover{box-shadow:var(--dshh);transform:translateY(-2px);border-color:var(--dline2)}
.d3 .tile .top{display:flex;align-items:flex-start;gap:10px;margin-bottom:13px}
.d3 .tile .tnm{font-size:0.96875rem;font-weight:700;letter-spacing:-.015em;line-height:1.25;flex:1;min-width:0}
.d3 .tile .tst{display:flex;align-items:center;gap:6px;font-size:0.71875rem;font-weight:600;color:var(--dtx3);white-space:nowrap;padding-top:2px}
.d3 .tmets{display:flex;margin:13px -17px 0;padding:12px 17px 0;border-top:1px solid var(--dline)}
.d3 .tmets>div{flex:1}
.d3 .tmets .l{font-size:0.6875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--dtx4)}
.d3 .tmets .v{font-size:0.9375rem;font-weight:700;font-variant-numeric:tabular-nums;margin-top:1px}
.d3 .tmets .v span{font-weight:500;color:var(--dtx4);font-size:0.75rem}
.d3 .tile .tags2{display:flex;gap:5px;flex-wrap:wrap;margin-top:12px}
/* detail page */
.d3 .bk{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 13px 0 10px;font-family:var(--fj);font-size:0.78125rem;font-weight:600;color:var(--dtx2);background:var(--dw);border:1px solid var(--dline);border-radius:9px;cursor:pointer;margin-bottom:16px}
.d3 .bk:hover{background:var(--dsoft)}
.d3 .dhd{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.d3 .dhd h2{font-size:1.625rem;font-weight:800;letter-spacing:-.028em}
.d3 .dhd .ds{font-size:0.8125rem;color:var(--dtx3);margin-top:2px}
/* Balance chip: same 40px / radius-11 geometry as the buttons beside it, so the
   header reads as one row of controls instead of a stray card. */
.d3 .balc{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 15px;background:var(--dw);
  border:1px solid var(--dline2);border-radius:11px;white-space:nowrap}
.d3 .balc .l{font-size:0.6875rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--dtx4)}
.d3 .balc .v{font-size:1rem;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.d3 .balc .v.neg{color:var(--drd)}
.d3 .balc.owed{border-color:color-mix(in oklab,var(--drd) 55%,var(--dline2))}
.d3 .owe-banner{margin:12px 0 2px;padding:11px 15px;border:1px solid color-mix(in oklab,var(--drd) 45%,var(--dline));
  border-radius:11px;background:color-mix(in oklab,var(--drd) 6%,var(--dw));
  font-size:0.8125rem;color:var(--dtx);line-height:1.5}
.d3 .dtabs{display:flex;gap:5px;margin-bottom:18px;background:var(--dsoft);padding:4px;border-radius:12px;width:fit-content}
.d3 .dtabs button{height:34px;padding:0 17px;font-family:var(--fj);font-size:0.8125rem;font-weight:600;color:var(--dtx3);background:none;border:none;border-radius:9px;cursor:pointer}
.d3 .dtabs button:hover{color:var(--dtx)}
.d3 .dtabs button.on{background:var(--dw);color:var(--dtx);font-weight:700;box-shadow:var(--dsh)}
.d3 .kgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:13px;margin-bottom:15px}
.d3 .kpi2{background:var(--dw);border:1px solid var(--dline);border-radius:14px;padding:14px 17px;box-shadow:var(--dsh)}
.d3 .kpi2 .l{font-size:0.71875rem;font-weight:600;color:var(--dtx3);margin-bottom:4px}
.d3 .kpi2 .v{font-size:1.5rem;font-weight:800;letter-spacing:-.028em;font-variant-numeric:tabular-nums;line-height:1.05}
.d3 .kpi2 .v.neg{color:var(--drd)}
.d3 .kpi2 .s{font-size:0.71875rem;color:var(--dtx4);margin-top:4px}
.d3 .cols{display:grid;grid-template-columns:1.05fr 1fr;gap:14px;align-items:start}
.d3 .card2{background:var(--dw);border:1px solid var(--dline);border-radius:15px;box-shadow:var(--dsh);margin-bottom:14px;overflow:hidden}
.d3 .card2 .ch{display:flex;align-items:center;gap:10px;padding:14px 18px 12px;border-bottom:1px solid var(--dline)}
.d3 .card2 .ch .t{font-size:0.90625rem;font-weight:800;letter-spacing:-.015em;flex:1}
.d3 .card2 .ch .x{font-size:0.75rem;color:var(--dtx3);font-weight:500}
.d3 .cb2{padding:15px 18px}
.d3 .fg2{display:grid;grid-template-columns:1fr 1fr;gap:12px 13px}
.d3 .lb2{display:block;font-size:0.71875rem;font-weight:700;color:var(--dtx2);margin-bottom:5px;text-transform:none;letter-spacing:0}
.d3 .in2{width:100%;height:38px;padding:0 12px;font-family:var(--fj);font-size:0.84375rem;color:var(--dtx);background:var(--dsoft);border:1px solid transparent;border-radius:10px;outline:none}
.d3 .in2:focus{background:var(--dw);border-color:var(--dvi);box-shadow:0 0 0 3px var(--dvit)}
.d3 select.in2{cursor:pointer}
.d3 .srw{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--dline)}
.d3 .srw:last-child{border-bottom:none}
.d3 .srw .sl{font-size:0.8125rem;font-weight:700}
.d3 .srw .sh{font-size:0.75rem;color:var(--dtx3);margin-top:1px;max-width:400px;font-weight:400}
.d3 .tg{position:relative;display:inline-block;width:38px;height:22px;flex:none}
.d3 .tg input{opacity:0;width:0;height:0}
.d3 .tgs{position:absolute;inset:0;background:var(--dline2);border-radius:99px;cursor:pointer;transition:background .15s}
.d3 .tgs:before{content:'';position:absolute;width:18px;height:18px;left:2px;top:2px;background:#fff;border-radius:50%;transition:transform .15s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.d3 .tg input:checked+.tgs{background:var(--dgr)}
.d3 .tg input:checked+.tgs:before{transform:translateX(16px)}
.d3 .irow{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--dline)}
.d3 .irow:last-child{border-bottom:none}
.d3 .irow .m{flex:1;min-width:0}
.d3 .irow .n2{font-size:0.84375rem;font-weight:700}
.d3 .irow .s2{font-size:0.75rem;color:var(--dtx3);margin-top:1px}
.d3 .irow .side{display:flex;align-items:center;gap:9px;font-size:0.75rem;color:var(--dtx3);white-space:nowrap;flex-wrap:wrap;justify-content:flex-end}
.d3 table{width:100%;border-collapse:collapse;font-size:0.8125rem}
.d3 th{padding:10px 18px;text-align:left;font-size:0.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--dtx4);background:var(--dbg);white-space:nowrap;border-bottom:1px solid var(--dline)}
[data-theme="dark"] .d3 th{background:var(--dsoft)}
.d3 td{padding:11px 18px;border-bottom:1px solid var(--dline);color:var(--dtx2);font-variant-numeric:tabular-nums}
.d3 tr:last-child td{border-bottom:none}
.d3 th.r,.d3 td.r{text-align:right}
.d3 .empty2{border:1px dashed var(--dline2);border-radius:13px;padding:34px 18px;text-align:center;margin:4px 0}
.d3 .empty2 .et{font-size:0.9375rem;font-weight:800;margin-bottom:4px}
.d3 .empty2 .es{font-size:0.78125rem;color:var(--dtx3);max-width:400px;margin:0 auto}
.d3 .empty2 a{color:var(--dvi);font-weight:700;cursor:pointer}
.d3 .mini-form{display:none;margin-top:12px;padding:14px;background:var(--dsoft);border-radius:12px}
.d3 .mini-form.open{display:block}
.d3 .mf-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.d3 .mf-grid input,.d3 .mf-grid select{height:37px;padding:0 12px;font-size:0.8125rem;font-family:var(--fj);background:var(--dw);border:1px solid var(--dline);border-radius:9px;color:var(--dtx)}
.d3 .mf-grid .mf-full{grid-column:1/-1}
.d3 .mf-err{display:none;font-size:0.78125rem;color:var(--drd);margin-top:8px}
.d3 .mf-err.show{display:block}
.d3 .mf-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}
.d3 .gempty{padding:20px 18px;font-size:0.78125rem;color:var(--dtx4)}
@media(max-width:1080px){.d3 .lrow,.d3 .lhead{grid-template-columns:1.4fr minmax(140px,1fr) 100px 1fr 30px}.d3 .h4,.d3 .h5,.d3 .h6{display:none}}
@media(max-width:860px){.d3 .cols{grid-template-columns:1fr}.d3 .fg2{grid-template-columns:1fr}}
/* popovers (append to body) */
.dest-pop{background:var(--panel);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-menu);padding:5px;position:absolute;z-index:120;min-width:200px}
.dest-pop button{display:flex;width:100%;align-items:center;gap:8px;padding:8px 11px;font-family:inherit;font-size:0.8125rem;font-weight:500;color:var(--text-2);background:none;border:none;border-radius:8px;cursor:pointer;text-align:left;white-space:nowrap}
.dest-pop button:hover{background:var(--panel-2);color:var(--text)}
.dest-pop button.danger{color:var(--neg)}
.dest-pop .dest-pop-div{height:1px;background:var(--border);margin:4px 6px}

/* ── Cross-navigation affordances + the confirm/edit sheet ─────────── */
/* A tag or figure that navigates says so on hover; one that doesn't stays inert. */
.d3 .tag.act,.d3 .cv.act{cursor:pointer;transition:filter .12s,box-shadow .12s}
.d3 .tag.act:hover{filter:brightness(.96);box-shadow:0 0 0 2px var(--dline2)}
.d3 .cv.act:hover{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:2px}
.d3 .lnk,.d3 .flnk{cursor:pointer;font-weight:700;color:var(--dvi)}
.d3 .lnk:hover,.d3 .flnk:hover{text-decoration:underline}
.d3 .ch .lnk{font-size:0.75rem;white-space:nowrap}
.d3 .ch .b-gh.xs{margin-left:auto}
.d3 .ch .b-gh.xs+.lnk{margin-left:10px}
.d3 .warnt{color:var(--dam);font-weight:700}
.d3 .irow .side .kebab{margin-left:2px}
.d3 .irow .n2 .ent-link{cursor:pointer}
.d3 .irow .n2 .ent-link:hover{color:var(--dvi);text-decoration:underline}

/* Focus banner: why this list is short, and the way back to all of it. */
.focusbar{display:flex;align-items:center;gap:10px;padding:11px 16px;background:var(--accent-soft,#f2ecfe);border-bottom:1px solid var(--border);font-family:'Plus Jakarta Sans',-apple-system,'Segoe UI',sans-serif;font-size:0.8125rem;font-weight:600;color:var(--text-2)}
.focusbar .fb-dot{width:7px;height:7px;border-radius:50%;background:var(--accent,#6d3fd4);flex:none}
.focusbar .fb-t{flex:1;min-width:0}
.focusbar .fb-t b{color:var(--text);font-weight:800}
.focusbar .fb-x{height:28px;padding:0 12px;font-family:inherit;font-size:0.75rem;font-weight:700;color:var(--accent,#6d3fd4);background:var(--panel,#fff);border:1px solid var(--border);border-radius:8px;cursor:pointer;white-space:nowrap}
.focusbar .fb-x:hover{background:var(--panel-2)}

.v3sh-wrap{position:fixed;inset:0;z-index:400;background:rgba(16,17,24,.42);display:flex;align-items:flex-start;justify-content:center;padding:60px 20px 20px;overflow-y:auto;backdrop-filter:blur(2px)}
.v3sh{width:100%;max-width:480px;background:#fff;border-radius:16px;box-shadow:0 20px 50px rgba(16,17,24,.28),0 2px 6px rgba(16,17,24,.12);overflow:hidden;font-family:'Plus Jakarta Sans',-apple-system,'Segoe UI',sans-serif;color:#15161c;animation:v3shIn .16s ease}
@keyframes v3shIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
[data-theme="dark"] .v3sh{background:#17171b;color:#f2f2f4;box-shadow:0 20px 50px rgba(0,0,0,.6)}
.v3sh-h{padding:18px 20px 14px;border-bottom:1px solid #e8eaf0}
[data-theme="dark"] .v3sh-h{border-color:#26262d}
.v3sh-t{font-size:1.0625rem;font-weight:800;letter-spacing:-.02em}
.v3sh.danger .v3sh-t{color:#c8342a}
[data-theme="dark"] .v3sh.danger .v3sh-t{color:#ef7266}
.v3sh-l{font-size:0.78125rem;color:#8a8fa0;margin-top:3px}
.v3sh-b{padding:16px 20px 18px;font-size:0.8125rem}
.v3sh-b .lb2{display:block;font-size:0.71875rem;font-weight:700;color:#4c505e;margin-bottom:5px}
[data-theme="dark"] .v3sh-b .lb2{color:#c3c3cc}
.v3sh-b .in2{width:100%;height:38px;padding:0 12px;font-family:inherit;font-size:0.84375rem;color:inherit;background:#f4f5f8;border:1px solid transparent;border-radius:10px;outline:none}
[data-theme="dark"] .v3sh-b .in2{background:#212127}
.v3sh-b .in2:focus{background:#fff;border-color:#6d3fd4;box-shadow:0 0 0 3px #f2ecfe}
[data-theme="dark"] .v3sh-b .in2:focus{background:#17171b;border-color:#9d7bea;box-shadow:0 0 0 3px rgba(157,123,234,.16)}
.v3sh-b .fg2{display:grid;grid-template-columns:1fr 1fr;gap:12px 13px}
.v3sh-b .dimc{color:#b4b8c6;font-weight:500}
.v3sh-note{padding:11px 13px;border-radius:11px;background:#f4f5f8;font-size:0.78125rem;line-height:1.6;color:#4c505e}
[data-theme="dark"] .v3sh-note{background:#212127;color:#c3c3cc}
.v3sh-note b{color:#15161c}
[data-theme="dark"] .v3sh-note b{color:#f2f2f4}
.v3sh-note.bad{background:#fdeceb;color:#8f2a22}
[data-theme="dark"] .v3sh-note.bad{background:rgba(239,114,102,.13);color:#ef7266}
.v3sh-note.good{background:#e7f6f0;color:#0e6b4b}
[data-theme="dark"] .v3sh-note.good{background:rgba(62,207,151,.14);color:#3ecf97}
.v3sh-note.bad div+div,.v3sh-note div+div{margin-top:5px}
.v3sh-facts{display:grid;grid-template-columns:1fr 1fr;gap:9px 14px;margin-bottom:14px}
.v3sh-facts>div{display:flex;flex-direction:column;gap:2px}
.v3sh-facts span{font-size:0.6875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#b4b8c6}
.v3sh-facts b{font-size:0.8125rem;font-weight:700;font-variant-numeric:tabular-nums}
.v3sh-err{margin-top:11px;font-size:0.78125rem;font-weight:600;color:#c8342a}
[data-theme="dark"] .v3sh-err{color:#ef7266}
.v3sh-f{display:flex;justify-content:flex-end;gap:8px;padding:13px 20px;background:#fafbfc;border-top:1px solid #e8eaf0}
[data-theme="dark"] .v3sh-f{background:#1c1c21;border-color:#26262d}
.v3sh-f .b-vi,.v3sh-f .b-gh,.v3sh-f .b-dg{display:inline-flex;align-items:center;height:34px;padding:0 15px;font-family:inherit;font-size:0.8125rem;font-weight:700;border-radius:9px;cursor:pointer;border:none}
.v3sh-f .b-vi{color:#fff;background:#6d3fd4}
.v3sh-f .b-vi:hover{background:#5b32bb}
.v3sh-f .b-dg{color:#fff;background:#c8342a}
.v3sh-f .b-dg:hover{background:#ac2b22}
.v3sh-f .b-gh{color:#4c505e;background:#fff;border:1px solid #d8dbe5;font-weight:600}
.v3sh-f .b-gh:hover{background:#f4f5f8}
[data-theme="dark"] .v3sh-f .b-gh{color:#c3c3cc;background:#17171b;border-color:#34343d}
.v3sh-f button:disabled{opacity:.55;cursor:default}
@media(max-width:520px){.v3sh-b .fg2,.v3sh-facts{grid-template-columns:1fr}}
/* The row a per-state handoff landed on. */
.gp-hit>td{background:var(--accent-soft,#f2ecfe)!important;transition:background 1.2s}
.gp-hit>td:first-child{box-shadow:inset 3px 0 0 var(--accent,#6d3fd4)}

/* ── IO list status cell ───────────────────────────────────────────── */
/* Four modes share one shell: a compact figure line plus either a hairline bar
   (consumption / month elapsed) or the Draft→Sent→Signed→Paid stepper. Sized to
   sit inside a table row without changing its height. */
.iost{min-width:132px;line-height:1.25}
.iost-l{font-size:0.71875rem;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--text-2)}
.iost-l b{font-weight:700;color:var(--text)}
.iost-k{font-size:0.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim)}
.iost-sep{color:var(--text-dim);margin:0 3px}
.iost-dim{color:var(--text-3)}
.iost-bar{height:4px;border-radius:99px;background:var(--panel-3,var(--panel-2));overflow:hidden;margin-top:4px}
.iost-bar>i{display:block;height:100%;border-radius:99px;background:var(--accent)}
/* Filling up is delivery working, so it greens as it completes; amber is the
   ambiguous middle where pacing is worth a look. */
.iost-bar>i.mid{background:var(--warn)}
.iost-bar>i.full{background:var(--pos)}

.iost-steps{display:flex;align-items:center;gap:0}
.iost-s{display:inline-flex;align-items:center;gap:3px;padding:1px 6px;border-radius:99px;
  border:1px solid var(--border-2,var(--border));color:var(--text-dim);
  font-size:0.6875rem;font-weight:700;white-space:nowrap;background:transparent}
.iost-s.on{background:var(--pos);border-color:var(--pos);color:#fff}
[data-theme="dark"] .iost-s.on{color:#0b1a13}
.iost-c{width:9px;height:1px;flex:none;background:var(--border-2,var(--border))}
.iost-c.on{background:var(--pos)}
.iost-cap{font-size:0.6875rem;color:var(--text-dim);margin-top:3px;white-space:nowrap}

/* Row badges: a consolidated shell and a pro-rated allocation both change how the
   numbers on that row should be read, so they are stated on the row itself. */
.iotag{display:inline-block;vertical-align:middle;margin-left:5px;padding:1px 6px;border-radius:8px;
  font-size:0.6875rem;font-weight:800;letter-spacing:.04em;white-space:nowrap}
.iotag.cons{background:var(--accent);color:#fff}
[data-theme="dark"] .iotag.cons{color:#151122}
.iotag.pro{background:color-mix(in oklab,var(--warn) 16%,transparent);color:var(--warn);cursor:pointer}
.iotag.pro:hover{background:color-mix(in oklab,var(--warn) 26%,transparent)}

/* ── Finance, second pass ──────────────────────────────────────────── */
.d3.fin .finload{position:fixed;top:70px;right:26px;z-index:50;padding:7px 13px;font-size:0.75rem;font-weight:700;color:var(--dvi);background:var(--dvit);border-radius:9px}
.d3.fin .dimc{color:var(--dtx4);font-weight:500}
.d3.fin .uwarn,.d3.fin .warnt{color:var(--dam);font-weight:700}
.d3.fin .finfoot{font-size:0.75rem;color:var(--dtx3);line-height:1.65;margin:2px 0 18px;padding:0 2px}
.d3.fin .finfoot b{color:var(--dtx2);font-weight:700}
.d3.fin .flnk{cursor:pointer;font-weight:700;color:var(--dvi)}
.d3.fin .flnk:hover{text-decoration:underline}
.d3.fin .finnote{padding:12px 15px;border-radius:12px;background:var(--damt);color:var(--dtx2);font-size:0.78125rem;line-height:1.6;margin-bottom:15px}
.d3.fin .finnote b{color:var(--dtx)}

/* The verdict: the whole point of the page, stated once, at the top. */
.d3.fin .verdict{background:var(--dw);border:1px solid var(--dline);border-radius:16px;box-shadow:var(--dsh);padding:22px 24px 18px;margin-bottom:14px;position:relative;overflow:hidden}
.d3.fin .verdict:before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--dline2)}
.d3.fin .verdict.win:before{background:var(--dgr)}
.d3.fin .verdict.lose:before{background:var(--drd)}
.d3.fin .vd-top{display:flex;align-items:flex-start;gap:26px;flex-wrap:wrap}
.d3.fin .vd-when{font-size:0.6875rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--dtx4);margin-bottom:7px}
.d3.fin .vd-say{font-size:1.3125rem;font-weight:600;letter-spacing:-.02em;line-height:1.4;color:var(--dtx2);max-width:640px}
.d3.fin .vd-say b{font-weight:800;color:var(--dtx)}
.d3.fin .vd-num{margin-left:auto;text-align:right;flex:none}
.d3.fin .vd-big{font-size:2.375rem;font-weight:800;letter-spacing:-.035em;line-height:1;font-variant-numeric:tabular-nums}
.d3.fin .verdict.win .vd-big{color:var(--dgr)}
.d3.fin .verdict.lose .vd-big{color:var(--drd)}
.d3.fin .vd-sub{font-size:0.78125rem;font-weight:600;color:var(--dtx3);margin-top:6px}
.d3.fin .vb{margin:20px 0 4px;display:flex;flex-direction:column;gap:9px}
.d3.fin .vb-row{display:grid;grid-template-columns:120px 1fr 130px;gap:14px;align-items:center}
.d3.fin .vb-l{font-size:0.75rem;font-weight:700;color:var(--dtx3);text-align:right}
.d3.fin .vb-track{height:26px;background:var(--dsoft);border-radius:7px;overflow:hidden}
.d3.fin .vb-fill{height:100%;border-radius:7px}
.d3.fin .vb-fill.sp{background:var(--dline2)}
.d3.fin .vb-fill.dv{background:var(--dvi)}
.d3.fin .vb-v{font-size:0.9375rem;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.d3.fin .vd-foot{display:flex;gap:22px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--dline);font-size:0.78125rem;color:var(--dtx3)}
.d3.fin .vd-foot b{color:var(--dtx);font-weight:700;font-variant-numeric:tabular-nums}

/* Cash strip: the same period read as a bank account, not as performance. */
.d3.fin .cash-strip{display:flex;align-items:stretch;gap:0;background:var(--dw);border:1px solid var(--dline);border-radius:15px;box-shadow:var(--dsh);padding:15px 6px;margin-bottom:15px;flex-wrap:wrap}
.d3.fin .cs-i{flex:1 1 170px;min-width:150px;padding:2px 18px}
.d3.fin .cs-i.wide{flex:1.5 1 230px}
.d3.fin .cs-l{font-size:0.6875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--dtx4);margin-bottom:4px}
.d3.fin .cs-v{font-size:1.375rem;font-weight:800;letter-spacing:-.028em;font-variant-numeric:tabular-nums;line-height:1.1}
.d3.fin .cs-v.good{color:var(--dbl)}
.d3.fin .cs-v.warn{color:var(--dam)}
.d3.fin .cs-s{font-size:0.71875rem;color:var(--dtx3);margin-top:4px;line-height:1.45}
.d3.fin .cs-op{display:flex;align-items:center;font-size:0.8125rem;font-weight:700;color:var(--dtx4);padding:0 2px}

/* Monthly paired columns: spend beside delivered, ratio underneath. */
.d3.fin .fc-leg{display:flex;gap:14px;font-size:0.71875rem;font-weight:600;color:var(--dtx3);flex-wrap:wrap}
.d3.fin .fc-leg span{display:inline-flex;align-items:center;gap:6px}
.d3.fin .fc-leg i{width:10px;height:10px;border-radius:3px;flex:none}
.d3.fin .fc-leg i.k-sp{background:var(--dline2)}
.d3.fin .fc-leg i.k-dv{background:var(--dvi)}
.d3.fin .tc-wrap{display:flex;gap:6px;align-items:flex-end;padding:26px 18px 14px;overflow-x:auto}
.d3.fin .tc{flex:1 1 0;min-width:74px;display:flex;flex-direction:column;align-items:center}
.d3.fin .tc-plot{width:100%;display:flex;align-items:flex-end;justify-content:center}
.d3.fin .tc-bars{display:flex;align-items:flex-end;justify-content:center;gap:5px;width:100%}
.d3.fin .tc-b{position:relative;flex:1 1 0;max-width:30px;min-width:9px;border-radius:6px 6px 0 0}
.d3.fin .tc-b.sp{background:var(--dline2)}
.d3.fin .tc-b.dv{background:var(--dvi)}
.d3.fin .tc-v{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:4px;font-size:0.6875rem;font-weight:700;color:var(--dtx4);white-space:nowrap;font-variant-numeric:tabular-nums}
.d3.fin .tc-b.dv .tc-v{color:var(--dtx2);font-weight:800}
.d3.fin .tc-r{margin-top:9px;font-size:0.8125rem;font-weight:800;font-variant-numeric:tabular-nums}
.d3.fin .tc-r.ok{color:var(--dgr)}
.d3.fin .tc-r.bad{color:var(--drd)}
.d3.fin .tc-r.na{color:var(--dtx4)}
.d3.fin .tc-x{margin-top:2px;font-size:0.71875rem;font-weight:600;color:var(--dtx3);white-space:nowrap}

/* Cash timeline: one lane per month, a dot per payment on the day it landed. */
.d3.fin .cl-wrap{padding:16px 18px 18px;display:flex;flex-direction:column;gap:2px}
.d3.fin .cl-row{display:grid;grid-template-columns:62px 1fr 108px 128px;gap:14px;align-items:center;padding:7px 0;border-bottom:1px solid var(--dline)}
.d3.fin .cl-row:last-child{border-bottom:none}
.d3.fin .cl-mo{font-size:0.75rem;font-weight:700;color:var(--dtx2)}
.d3.fin .cl-lane{position:relative;height:32px;background:linear-gradient(var(--dsoft),var(--dsoft)) center/100% 2px no-repeat;border-radius:4px}
.d3.fin .cd{position:absolute;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:var(--dvi);border:2px solid var(--dw);cursor:pointer;transition:transform .12s}
.d3.fin .cd:hover{transform:translate(-50%,-50%) scale(1.22);z-index:2}
.d3.fin .cd.wallet{background:var(--dvi)}
.d3.fin .cd.split{background:var(--dbl)}
.d3.fin .cd.io{background:var(--dgr)}
.d3.fin .cl-none{position:absolute;left:0;top:50%;transform:translateY(-50%);font-size:0.71875rem;color:var(--dtx4);background:var(--dw);padding-right:6px}
.d3.fin .cl-amt{font-size:0.875rem;font-weight:800;text-align:right;font-variant-numeric:tabular-nums}
.d3.fin .cl-del{font-size:0.71875rem;color:var(--dtx3);text-align:right;font-variant-numeric:tabular-nums}

/* Sources: provenance, stated plainly, away from the numbers. */
.d3.fin .src-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:13px;padding:16px 18px}
.d3.fin .src{background:var(--dbg);border:1px solid var(--dline);border-radius:12px;padding:13px 15px}
[data-theme="dark"] .d3.fin .src{background:var(--dsoft)}
.d3.fin .src-h{display:flex;flex-direction:column;gap:2px;margin-bottom:7px}
.d3.fin .src-t{font-size:0.84375rem;font-weight:800;letter-spacing:-.012em}
.d3.fin .src-s{font-size:0.6875rem;color:var(--dvi);font-weight:700}
.d3.fin .src-n{font-size:0.75rem;color:var(--dtx3);line-height:1.6}

/* Tables */
.d3.fin .mo{font-weight:700;color:var(--dtx)}
.d3.fin td.em{font-weight:800;color:var(--dtx)}
.d3.fin td.pos{color:var(--dgr);font-weight:700}
.d3.fin td.neg{color:var(--drd);font-weight:700}
.d3.fin .rx{display:inline-block;min-width:48px;padding:2px 8px;border-radius:7px;font-size:0.71875rem;font-weight:800;font-variant-numeric:tabular-nums;text-align:center}
.d3.fin .rx.ok{background:var(--dgrt);color:var(--dgr)}
.d3.fin .rx.bad{background:var(--drdt);color:var(--drd)}
.d3.fin .rx.na{background:var(--dsoft);color:var(--dtx4)}
.d3.fin .fb-nm{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:0.84375rem;font-weight:700;color:var(--dtx);letter-spacing:-.012em}
.d3.fin .fb-nm .tag{height:19px;padding:0 7px;font-size:0.6875rem;flex:none}
.d3.fin tbody tr:hover{background:var(--dbg)}
.d3.fin tfoot td{padding:12px 18px;border-top:1px solid var(--dline2);background:var(--dbg);font-variant-numeric:tabular-nums;font-weight:700}
[data-theme="dark"] .d3.fin tfoot td{background:var(--dsoft)}
.d3.fin .fbar{height:5px}
.d3.fin .losers{border-color:var(--drd)}
.d3.fin .losers .ch .t{color:var(--drd)}
.d3.fin .ent-link{cursor:pointer;font-weight:700;color:var(--dtx)}
.d3.fin .ent-link:hover{color:var(--dvi);text-decoration:underline}
@media(max-width:900px){
  .d3.fin .vd-big{font-size:1.875rem}
  .d3.fin .vd-say{font-size:1.125rem}
  .d3.fin .vb-row{grid-template-columns:96px 1fr 100px;gap:9px}
  .d3.fin .cs-op{display:none}
  .d3.fin .cl-row{grid-template-columns:52px 1fr 92px}
  .d3.fin .cl-del{display:none}
}

/* ── Carried over from the retired app.css (shared page JS still emits these) ── */
.form-input{display:block;width:100%;margin-top:4px;padding:8px 12px;background:var(--panel);border:1px solid var(--border-2);border-radius:9px;color:var(--text);font-size:0.8125rem;font-family:inherit;box-sizing:border-box}
.form-input:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
.btn-warning{background:var(--warn-t);border-color:transparent;color:var(--warn)}

/* Dark: the active nav label on the tinted accent chip was 4.0:1; the lighter accent reads at 6.5:1. */
[data-theme="dark"] .nav-item.active,[data-theme="dark"] .nav-subitem.active{color:var(--accent-h)}
[data-theme="dark"] .nav-item.active svg.ic{color:var(--accent-h)}