/* ═══════════════════════════════════════════════════════════════════════
   Lazarus Tracker — Visual System
   Dense + elegant ops UI. Inter type, deep navy on cool white.
   ═══════════════════════════════════════════════════════════════════════ */

:root {
  /* Colors — navy gradient with cool greys */
  --navy-900: #0f1d3a;
  --navy-800: #1a2b50;
  --navy-700: #243964;
  --navy-600: #2f4f8a;
  --navy-500: #3f6bb8;
  --accent: #4f8df7;
  --accent-hover: #2670e8;

  --ink-900: #0a0f1c;
  --ink-700: #1f2937;
  --ink-500: #4b5563;
  --ink-400: #6b7280;
  --ink-300: #9ca3af;
  --ink-200: #d1d5db;
  --ink-100: #e5e7eb;
  --ink-50: #f3f4f6;

  --bg: #f8fafc;
  --bg-alt: #f1f5f9;
  --surface: #ffffff;
  --surface-hover: #f8fafc;

  /* Functional colors */
  --green: #16a34a;
  --green-light: #dcfce7;
  --green-bg: #f0fdf4;
  --red: #dc2626;
  --red-light: #fee2e2;
  --red-bg: #fef2f2;
  --amber: #f59e0b;
  --amber-light: #fef3c7;
  --amber-bg: #fffbeb;
  --purple: #8b5cf6;
  --purple-light: #ede9fe;
  --purple-bg: #faf5ff;

  /* Track colors */
  --t-codebase: #3b82f6;
  --t-codebase-bg: #eff6ff;
  --t-legacy: #f59e0b;
  --t-legacy-bg: #fffbeb;
  --t-questionnaire: #ea580c;
  --t-questionnaire-bg: #fff7ed;
  --t-bd: #be185d;
  --t-bd-bg: #fdf2f8;
  --t-referral: #8b5cf6;
  --t-referral-bg: #faf5ff;

  /* Shadows */
  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.10), 0 1px 2px -1px rgb(0 0 0 / 0.10);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.10), 0 2px 4px -2px rgb(0 0 0 / 0.10);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.10), 0 4px 6px -4px rgb(0 0 0 / 0.10);
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.10), 0 8px 10px -6px rgb(0 0 0 / 0.10);
  --shadow-drawer: -20px 0 60px -10px rgb(0 0 0 / 0.30);

  /* Type scale */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', 'Menlo', 'Monaco', monospace;

  /* Animation */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 120ms;
  --dur: 200ms;
  --dur-slow: 320ms;
}

* { box-sizing: border-box; }
html, body {
  margin: 0; padding: 0;
  min-height: 100vh;   /* themed bg fills the viewport even on short tabs (e.g. Data Requests) */
  font-family: var(--font-sans);
  background: var(--bg);
  color: var(--ink-900);
  font-size: 13px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
}

a { color: var(--accent); text-decoration: none; transition: color var(--dur-fast) var(--ease); }
a:hover { color: var(--accent-hover); }

/* ═══════════════════════════════════════════════════════════════════════
   Topbar — navy gradient, generous height, prominent tabs
   ═══════════════════════════════════════════════════════════════════════ */
.topbar {
  position: sticky; top: 0; z-index: 100;
  background: linear-gradient(180deg, var(--navy-900) 0%, var(--navy-800) 60%, var(--navy-700) 100%);
  box-shadow: var(--shadow-md);
  padding: 0;
}
.topbar-inner {
  display: grid; grid-template-columns: auto 1fr auto;
  align-items: center; gap: 32px;
  padding: 14px 28px;
  max-width: 1800px; margin: 0 auto;
}

.brand { display: flex; align-items: center; gap: 14px; }
.brand-logo { height: 24px; width: auto; display: block; }
.brand-divider { width: 1px; height: 26px; background: rgba(255,255,255,0.22); }
.brand-mark {
  font-size: 28px; line-height: 1; color: var(--accent);
  filter: drop-shadow(0 0 12px rgba(79, 141, 247, 0.45));
}
.brand-text { display: flex; flex-direction: column; line-height: 1.1; }
.brand-title { font-weight: 700; color: #fff; font-size: 17px; letter-spacing: -0.01em; }
.brand-sub { color: rgba(255,255,255,0.55); font-size: 11px; text-transform: uppercase; letter-spacing: 0.12em; }

/* Tab nav — large, prominent, satisfying */
.tab-nav {
  display: inline-flex; align-self: center; justify-self: center;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 10px;
  padding: 4px;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.30);
}
.tab-btn {
  background: transparent; border: none; cursor: pointer;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 18px;
  font: inherit; font-size: 13px; font-weight: 500;
  color: rgba(255,255,255,0.65);
  border-radius: 7px;
  transition: color var(--dur-fast) var(--ease),
              background var(--dur-fast) var(--ease),
              transform var(--dur-fast) var(--ease);
}
.tab-btn:hover { color: #fff; background: rgba(255,255,255,0.08); }
.tab-btn:active { transform: scale(0.97); }
.tab-btn.active {
  background: linear-gradient(180deg, var(--accent) 0%, #3b78d8 100%);
  color: #fff;
  box-shadow: 0 1px 3px rgba(0,0,0,0.20), inset 0 1px 0 rgba(255,255,255,0.18);
  font-weight: 600;
}
.tab-icon { font-size: 15px; line-height: 1; }
.tab-text { letter-spacing: -0.01em; }

/* Topbar actions */
.topbar-actions { display: flex; align-items: center; gap: 8px; }
.badge-count {
  background: rgba(79, 141, 247, 0.22); color: rgba(255,255,255,0.95);
  font-variant-numeric: tabular-nums; font-weight: 600; font-size: 12px;
  padding: 5px 11px; border-radius: 999px;
  border: 1px solid rgba(79, 141, 247, 0.35);
}
.refreshed-text { color: rgba(255,255,255,0.55); font-size: 11px; }
.operator-input {
  background: rgba(255,255,255,0.10); color: #fff;
  border: 1px solid rgba(255,255,255,0.15);
  padding: 5px 11px; border-radius: 999px;
  font: inherit; font-size: 12px; width: 130px;
  transition: background var(--dur-fast) var(--ease);
}
.operator-input::placeholder { color: rgba(255,255,255,0.45); }
.operator-input:focus { background: rgba(255,255,255,0.18); border-color: var(--accent); outline: none; }
.operator-input.has-value { background: rgba(79, 141, 247, 0.22); border-color: rgba(79, 141, 247, 0.45); }

.icon-btn {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.85);
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 7px; cursor: pointer; font-size: 15px;
  transition: all var(--dur-fast) var(--ease);
}
.icon-btn:hover { background: rgba(255,255,255,0.14); color: #fff; border-color: rgba(255,255,255,0.20); transform: translateY(-1px); }
.icon-btn:active { transform: translateY(0); }
/* Light-surface variant: .icon-btn above is tuned for the navy topbar, but the
   class is reused in modal headers (close X) and table cells (QA "Open lead" ↗),
   which are white in light mode — the white-alpha colors were invisible there.
   Declared before the body.dark .icon-btn override so dark mode still wins. */
.modal-header .icon-btn, td .icon-btn {
  color: var(--ink-500);
  border-color: var(--ink-200);
  background: var(--ink-50);
}
.modal-header .icon-btn:hover, td .icon-btn:hover {
  color: var(--ink-700);
  border-color: var(--ink-300);
  background: var(--ink-100);
}

.btn-primary {
  background: linear-gradient(180deg, var(--accent) 0%, #3b78d8 100%);
  color: #fff; border: none; font: inherit; font-weight: 600;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 16px; border-radius: 7px; cursor: pointer;
  font-size: 13px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.20);
  transition: all var(--dur-fast) var(--ease);
}
.btn-primary:hover { background: linear-gradient(180deg, #5e9bff 0%, #4683e8 100%); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(79, 141, 247, 0.35); }
.btn-primary:active { transform: translateY(0); }
.refresh-icon { display: inline-block; transition: transform 0.4s var(--ease-out); }
.btn-primary:hover .refresh-icon { transform: rotate(180deg); }

.btn-ghost {
  background: transparent; border: 1px solid var(--ink-200);
  color: var(--ink-500); font: inherit; font-size: 12px;
  padding: 6px 12px; border-radius: 6px; cursor: pointer;
  transition: all var(--dur-fast) var(--ease);
}
.btn-ghost:hover { background: var(--ink-50); border-color: var(--ink-300); color: var(--ink-700); }

/* ═══════════════════════════════════════════════════════════════════════
   Tab panes
   ═══════════════════════════════════════════════════════════════════════ */
.tab-pane { animation: fadeIn var(--dur-slow) var(--ease-out); }
.tab-pane.hidden { display: none; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ═══════════════════════════════════════════════════════════════════════
   Filter bar
   ═══════════════════════════════════════════════════════════════════════ */
.filterbar {
  display: flex; flex-wrap: wrap; gap: 18px; align-items: flex-end;
  background: var(--surface); padding: 14px 28px;
  border-bottom: 1px solid var(--ink-100);
  position: sticky; top: 60px; z-index: 50;
}
.filter-group { display: flex; flex-direction: column; gap: 5px; }
.filter-group.hidden { display: none; } /* Board Tag filter hides on non-BD boards (no generic .hidden rule exists). */
.filter-grow { flex: 1; min-width: 250px; }
.filter-label {
  font-size: 10px; text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--ink-400); font-weight: 600;
}

.chip-row { display: flex; gap: 6px; flex-wrap: wrap; }
.chip {
  border: 1px solid var(--ink-200); background: var(--surface); color: var(--ink-700);
  padding: 5px 12px; border-radius: 999px;
  font: inherit; font-size: 12px; cursor: pointer;
  transition: all var(--dur-fast) var(--ease);
  white-space: nowrap;
}
.chip:hover { background: var(--ink-50); border-color: var(--ink-300); transform: translateY(-1px); }
.chip:active { transform: translateY(0); }
.chip.active {
  background: var(--navy-900); color: #fff; border-color: var(--navy-900);
  font-weight: 600;
  box-shadow: 0 2px 6px rgba(15, 29, 58, 0.25);
}

.search, .select {
  border: 1px solid var(--ink-200); background: var(--surface);
  padding: 7px 12px; border-radius: 7px; font: inherit; font-size: 13px;
  min-width: 220px;
  transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}
.search:focus, .select:focus {
  outline: none; border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(79, 141, 247, 0.18);
}
.select { min-width: 170px; cursor: pointer; }
.search { width: 100%; }

/* ═══════════════════════════════════════════════════════════════════════
   Content + status banner
   ═══════════════════════════════════════════════════════════════════════ */
.content { padding: 18px 28px 60px; }
.status-banner {
  padding: 10px 16px; border-radius: 8px; margin-bottom: 14px;
  display: none; font-size: 13px;
}
.status-banner.show { display: block; animation: slideDown var(--dur) var(--ease-out); }
.status-banner.error { background: var(--red-bg); border: 1px solid var(--red-light); color: var(--red); }
.status-banner.info { background: #eef6ff; border: 1px solid #c6dbff; color: #1e40af; }
@keyframes slideDown { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

.banner-info {
  margin: 12px 28px 0;
  padding: 11px 16px; border-radius: 8px;
  background: var(--amber-bg); border-left: 3px solid var(--amber); color: #92400e;
  font-size: 12px;
}
.banner-info strong { color: #78350f; }

/* ═══════════════════════════════════════════════════════════════════════
   Stats bar (Leads tab)
   ═══════════════════════════════════════════════════════════════════════ */
.stats-bar {
  display: flex; gap: 8px; padding: 14px 28px;
  background: var(--surface); border-bottom: 1px solid var(--ink-100);
  overflow-x: auto;
}
.stat-card {
  display: flex; flex-direction: column; gap: 2px;
  padding: 8px 14px; border-radius: 8px;
  background: var(--bg-alt); border: 1px solid var(--ink-100);
  min-width: 100px;
  transition: all var(--dur-fast) var(--ease);
}
.stat-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.stat-card .stat-label { font-size: 10px; color: var(--ink-400); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600; }
.stat-card .stat-value { font-size: 18px; font-weight: 700; color: var(--ink-900); font-variant-numeric: tabular-nums; }

.stat-card.t-Codebase, .stat-card.t-Codebase-Modern { background: var(--t-codebase-bg); border-color: rgba(59, 130, 246, 0.25); }
.stat-card.t-Codebase-Legacy { background: var(--t-legacy-bg); border-color: rgba(245, 158, 11, 0.25); }
.stat-card.t-Legacy-Questionnaire { background: var(--t-questionnaire-bg); border-color: rgba(234, 88, 12, 0.25); }
.stat-card.t-Business-Data { background: var(--t-bd-bg); border-color: rgba(190, 24, 93, 0.25); }
.stat-card.t-Referral { background: var(--t-referral-bg); border-color: rgba(139, 92, 246, 0.25); }

/* ═══════════════════════════════════════════════════════════════════════
   Tables
   ═══════════════════════════════════════════════════════════════════════ */
.table-wrap {
  background: var(--surface);
  border: 1px solid var(--ink-100); border-radius: 10px;
  overflow: auto; box-shadow: var(--shadow-sm);
}
table { width: 100%; border-collapse: collapse; table-layout: fixed; }
tbody td { overflow: hidden; text-overflow: ellipsis; }
tbody td .cell-email { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
tbody td .cell-context, tbody td .connectors-list { white-space: normal; overflow: visible; }
thead th {
  background: var(--navy-900); color: rgba(255,255,255,0.95); text-align: left;
  padding: 10px 14px;
  font-size: 10px; text-transform: uppercase; letter-spacing: 0.08em;
  position: sticky; top: 0; z-index: 5;
  white-space: nowrap; font-weight: 600;
  border-bottom: 1px solid var(--navy-700);
}

.density-compact tbody td { padding: 7px 14px; font-size: 12.5px; line-height: 1.35; }
.density-comfortable tbody td { padding: 12px 14px; font-size: 13px; line-height: 1.5; }
tbody td { border-bottom: 1px solid var(--ink-100); vertical-align: middle; }
tbody tr {
  transition: background var(--dur-fast) var(--ease);
  cursor: pointer;
}
tbody tr:hover {
  background: var(--bg-alt);
  box-shadow: inset 3px 0 0 var(--accent);
}
tbody tr.placeholder { color: var(--ink-300); text-align: center; cursor: default; }
tbody tr.placeholder td { padding: 60px 16px; font-size: 14px; }
tbody tr.placeholder:hover { background: var(--surface); box-shadow: none; }

/* Row tints by track */
tbody tr.r-Codebase, tbody tr.r-Codebase-Modern { background: rgba(239, 246, 255, 0.45); }
tbody tr.r-Codebase-Legacy { background: rgba(255, 251, 235, 0.55); }
tbody tr.r-Legacy-Questionnaire { background: rgba(255, 247, 237, 0.55); }
tbody tr.r-Business-Data { background: rgba(253, 242, 248, 0.55); }
tbody tr.r-Referral { background: rgba(250, 245, 255, 0.55); }
tbody tr.fresh-24h td:first-child { box-shadow: inset 3px 0 0 var(--accent); }
tbody tr.stale-30d { opacity: 0.7; }

/* Type pill */
.type-pill {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 9px; border-radius: 999px;
  font-size: 10.5px; font-weight: 700;
  white-space: nowrap; letter-spacing: 0.01em;
  text-transform: none;
}
.type-Codebase, .type-Codebase-Modern { background: var(--t-codebase-bg); color: var(--t-codebase); border: 1px solid rgba(59, 130, 246, 0.25); }
.type-Codebase-Legacy { background: var(--t-legacy-bg); color: var(--t-legacy); border: 1px solid rgba(245, 158, 11, 0.30); }
.type-Legacy-Questionnaire { background: var(--t-questionnaire-bg); color: var(--t-questionnaire); border: 1px solid rgba(234, 88, 12, 0.30); }
.type-Business-Data { background: var(--t-bd-bg); color: var(--t-bd); border: 1px solid rgba(190, 24, 93, 0.30); }
.type-Referral { background: var(--t-referral-bg); color: var(--t-referral); border: 1px solid rgba(139, 92, 246, 0.30); }
.type-Unknown { background: var(--ink-50); color: var(--ink-500); border: 1px solid var(--ink-200); }

/* Columns sized */
.col-type { width: 140px; }
.col-founder { width: 210px; }
.col-company { width: 180px; }
.col-industry { width: 130px; }
.col-fte { width: 70px; text-align: right; }
.col-payout { width: 110px; }
.col-repos { width: 65px; text-align: right; }
.col-prs { width: 65px; text-align: right; }
.col-connectors { width: 220px; }
.col-signals { width: 160px; }
.col-inbound { width: 145px; white-space: nowrap; }
.col-actions { width: 80px; text-align: center; }

.cell-name { font-weight: 600; color: var(--ink-900); }
.cell-email { font-size: 11px; color: var(--ink-400); margin-top: 1px; }
.cell-na { color: var(--ink-300); }

.badge {
  display: inline-block; padding: 1.5px 7px; border-radius: 6px;
  font-size: 10px; font-weight: 600; margin-right: 4px; margin-bottom: 2px;
}
.b-bd { background: var(--t-bd-bg); color: var(--t-bd); }
.b-code { background: var(--t-codebase-bg); color: var(--t-codebase); }
.b-artifact { background: var(--green-light); color: var(--green); }
.b-stale { background: var(--red-light); color: var(--red); }
.b-fresh { background: #dbeafe; color: #1d4ed8; }
.b-missing { background: var(--ink-50); color: var(--ink-500); }
.connectors-list { font-size: 11px; line-height: 1.45; color: var(--ink-700); }
.cell-context { font-size: 11.5px; line-height: 1.45; color: var(--ink-700); white-space: normal; }
.inbound-date { font-variant-numeric: tabular-nums; color: var(--ink-700); font-size: 11.5px; }
.inbound-rel { font-size: 10px; color: var(--ink-400); margin-top: 1px; }

.actions-cell { display: flex; gap: 3px; justify-content: center; }
.actions-cell a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 5px;
  color: var(--ink-500); font-size: 13px;
  transition: all var(--dur-fast) var(--ease);
}
.actions-cell a:hover { background: var(--ink-50); color: var(--accent); transform: scale(1.1); }

/* ═══════════════════════════════════════════════════════════════════════
   Control surface
   ═══════════════════════════════════════════════════════════════════════ */
.ctl-funnel { width: 130px; }
.ctl-auto { width: 130px; }
.ctl-manual { width: 145px; }
.ctl-reason { width: 160px; }
.ctl-final { width: 150px; }
.ctl-preview { width: 220px; }
.ctl-notes { width: 200px; }

.funnel-pill {
  display: inline-block; padding: 3px 10px; border-radius: 6px;
  font-size: 11px; font-weight: 600; white-space: nowrap;
  border: 1px solid transparent;
}
.f-intake { background: var(--ink-50); color: var(--ink-500); border-color: var(--ink-100); }
.f-awaiting_verdict { background: var(--amber-bg); color: #92400e; border-color: rgba(245, 158, 11, 0.25); }
.f-decision_pending { background: #fff7ed; color: #c2410c; border-color: rgba(234, 88, 12, 0.25); }
.f-outcome_set { background: var(--green-bg); color: var(--green); border-color: rgba(22, 163, 74, 0.25); }
.f-closed { background: var(--ink-50); color: var(--ink-700); border-color: var(--ink-200); }

.ctl-select, .ctl-text {
  border: 1px solid var(--ink-200); background: var(--surface); padding: 5px 9px;
  border-radius: 6px; font: inherit; font-size: 12px; width: 100%;
  transition: all var(--dur-fast) var(--ease);
  color: var(--ink-700);
}
.ctl-select { cursor: pointer; }
.ctl-select:hover, .ctl-text:hover { border-color: var(--accent); }
.ctl-select:focus, .ctl-text:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(79, 141, 247, 0.15); }
/* "Set" just adds weight; colour comes from the semantic tone classes below. */
.ctl-select.dirty { font-weight: 600; }

/* Semantic tone palette for control dropdowns (makeSelect + bulk selects).
   Soft, low-saturation fills matched to the app's QA-stage / priority colours
   so a value reads at a glance without being garish. */
.ctl-select.tone-neutral,  .ctl-bulk-select.tone-neutral  { background: rgba(100, 116, 139, 0.10); border-color: rgba(100, 116, 139, 0.40); color: #475569; }
.ctl-select.tone-progress, .ctl-bulk-select.tone-progress { background: rgba(99, 102, 241, 0.10); border-color: rgba(99, 102, 241, 0.40); color: #4338ca; }
.ctl-select.tone-positive, .ctl-bulk-select.tone-positive { background: rgba(34, 197, 94, 0.10); border-color: rgba(34, 197, 94, 0.38); color: #15803d; }
.ctl-select.tone-warn,     .ctl-bulk-select.tone-warn     { background: rgba(245, 158, 11, 0.11); border-color: rgba(245, 158, 11, 0.44); color: #b45309; }
.ctl-select.tone-negative, .ctl-bulk-select.tone-negative { background: rgba(244, 63, 94, 0.10); border-color: rgba(244, 63, 94, 0.42); color: #be123c; }
body.dark .ctl-select.tone-neutral,  body.dark .ctl-bulk-select.tone-neutral  { background: rgba(148, 163, 184, 0.14); border-color: rgba(148, 163, 184, 0.42); color: #cbd5e1; }
body.dark .ctl-select.tone-progress, body.dark .ctl-bulk-select.tone-progress { background: rgba(129, 140, 248, 0.16); border-color: rgba(129, 140, 248, 0.46); color: #c7d2fe; }
body.dark .ctl-select.tone-positive, body.dark .ctl-bulk-select.tone-positive { background: rgba(34, 197, 94, 0.16); border-color: rgba(34, 197, 94, 0.46); color: #86efac; }
body.dark .ctl-select.tone-warn,     body.dark .ctl-bulk-select.tone-warn     { background: rgba(245, 158, 11, 0.16); border-color: rgba(245, 158, 11, 0.50); color: #fcd34d; }
body.dark .ctl-select.tone-negative, body.dark .ctl-bulk-select.tone-negative { background: rgba(244, 63, 94, 0.17); border-color: rgba(244, 63, 94, 0.50); color: #fda4af; }

/* Read-only QA-stage pill — qa_stage is derived from QA items (owned by the QA
   tab), so Control shows it as a chip instead of an editable select. */
.ctl-qa-readout { display: inline-block; padding: 5px 9px; border-radius: 6px; font-size: 12px; font-weight: 600; line-height: 1.3; white-space: nowrap; border: 1px solid rgba(100, 116, 139, 0.30); background: rgba(100, 116, 139, 0.08); color: #475569; }
.ctl-qa-readout.is-mixed { font-weight: 500; font-style: italic; color: var(--ink-500); }
.ctl-qa-readout.ctl-locked { cursor: not-allowed; border-style: dashed; }
/* Codebase "→ QA" hand-off button (BD reaches QA via its pass_to_qa dropdown). */
.ctl-handoff-btn { padding: 5px 10px; border-radius: 6px; font-size: 12px; font-weight: 600; line-height: 1.3; cursor: pointer; white-space: nowrap; border: 1px solid var(--accent); background: rgba(79, 141, 247, 0.12); color: var(--accent); }
.ctl-handoff-btn:hover { background: rgba(79, 141, 247, 0.22); }
.ctl-qa-readout.tone-neutral  { background: rgba(100, 116, 139, 0.10); border-color: rgba(100, 116, 139, 0.40); color: #475569; }
.ctl-qa-readout.tone-progress { background: rgba(99, 102, 241, 0.10); border-color: rgba(99, 102, 241, 0.40); color: #4338ca; }
.ctl-qa-readout.tone-positive { background: rgba(34, 197, 94, 0.10); border-color: rgba(34, 197, 94, 0.38); color: #15803d; }
.ctl-qa-readout.tone-warn     { background: rgba(245, 158, 11, 0.11); border-color: rgba(245, 158, 11, 0.44); color: #b45309; }
.ctl-qa-readout.tone-negative { background: rgba(244, 63, 94, 0.10); border-color: rgba(244, 63, 94, 0.42); color: #be123c; }
body.dark .ctl-qa-readout { border-color: rgba(148, 163, 184, 0.30); background: rgba(148, 163, 184, 0.10); color: #cbd5e1; }
body.dark .ctl-qa-readout.tone-neutral  { background: rgba(148, 163, 184, 0.14); border-color: rgba(148, 163, 184, 0.42); color: #cbd5e1; }
body.dark .ctl-qa-readout.tone-progress { background: rgba(129, 140, 248, 0.16); border-color: rgba(129, 140, 248, 0.46); color: #c7d2fe; }
body.dark .ctl-qa-readout.tone-positive { background: rgba(34, 197, 94, 0.16); border-color: rgba(34, 197, 94, 0.46); color: #86efac; }
body.dark .ctl-qa-readout.tone-warn     { background: rgba(245, 158, 11, 0.16); border-color: rgba(245, 158, 11, 0.50); color: #fcd34d; }
body.dark .ctl-qa-readout.tone-negative { background: rgba(244, 63, 94, 0.17); border-color: rgba(244, 63, 94, 0.50); color: #fda4af; }

.email-preview {
  font-size: 10.5px; line-height: 1.35;
  padding: 6px 10px; background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
  border-left: 3px solid var(--accent); border-radius: 4px;
  color: #1e3a8a;
}
.email-preview.muted { background: var(--ink-50); border-left-color: var(--ink-200); color: var(--ink-400); font-style: italic; }
.email-preview .template-name { font-weight: 700; margin-bottom: 1px; }

.auto-badge {
  display: inline-block; padding: 3px 10px; border-radius: 6px;
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.01em;
}
.av-pending { background: var(--ink-50); color: var(--ink-500); }
.av-accept, .av-qualifying { background: var(--green-light); color: var(--green); }
.av-reject, .av-likely_reject { background: var(--red-light); color: var(--red); }
.av-on_hold, .av-borderline { background: var(--amber-light); color: #92400e; }
.av-unknown { background: var(--ink-50); color: var(--ink-300); font-style: italic; font-weight: 500; }

/* ═══════════════════════════════════════════════════════════════════════
   Overview / Metrics page
   ═══════════════════════════════════════════════════════════════════════ */
.metrics-content { padding: 22px 28px 60px; max-width: 1800px; margin: 0 auto; }

.page-intro { margin-bottom: 20px; }
.page-title { font-size: 22px; font-weight: 700; margin: 0; color: var(--ink-900); letter-spacing: -0.02em; }
.page-sub { font-size: 13px; color: var(--ink-500); margin: 4px 0 0; }

/* KPIs */
.kpi-row { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 24px; }
.kpi-card {
  background: var(--surface); border: 1px solid var(--ink-100); border-radius: 10px;
  padding: 14px 16px; display: flex; flex-direction: column; gap: 4px;
  position: relative; overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: all var(--dur-fast) var(--ease);
}
.kpi-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.kpi-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--accent), #2670e8);
}
.kpi-card.k-bd::before { background: linear-gradient(90deg, var(--t-bd), #831843); }
.kpi-card.k-codebase::before { background: linear-gradient(90deg, var(--t-codebase), var(--navy-700)); }
.kpi-card.k-warm::before { background: linear-gradient(90deg, var(--amber), #d97706); }
.kpi-card.k-stale::before { background: linear-gradient(90deg, var(--red), #991b1b); }
.kpi-card.k-closed::before { background: linear-gradient(90deg, var(--green), #15803d); }
.kpi-label { font-size: 10px; text-transform: uppercase; color: var(--ink-400); letter-spacing: 0.08em; font-weight: 600; }
.kpi-value { font-size: 28px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ink-900); letter-spacing: -0.02em; }
.kpi-sub { font-size: 11px; color: var(--ink-400); margin-top: 1px; }

/* Section heads */
.metrics-section { margin-bottom: 30px; }
.metrics-title {
  display: flex; align-items: center; gap: 10px;
  font-size: 17px; margin: 0 0 14px; color: var(--ink-900);
  padding-bottom: 8px; border-bottom: 1px solid var(--ink-100);
  font-weight: 600; letter-spacing: -0.01em;
}
.metrics-dot { display: inline-block; width: 11px; height: 11px; border-radius: 50%; }
.d-bd { background: var(--t-bd); }
.d-codebase { background: var(--t-codebase); }
.d-engage { background: var(--amber); }
.d-funnel { background: linear-gradient(135deg, var(--navy-700), var(--accent)); }

/* Funnel section — clickable stage cards */
.funnel-block { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; }
.funnel-stage {
  background: var(--surface); border: 1px solid var(--ink-100); border-radius: 10px;
  padding: 12px; cursor: pointer; transition: all var(--dur-fast) var(--ease);
  display: flex; flex-direction: column; gap: 4px; position: relative;
  overflow: hidden;
}
.funnel-stage:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: var(--accent); }
.funnel-stage::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
}
.funnel-stage.f-intake::before { background: var(--ink-300); }
.funnel-stage.f-awaiting_verdict::before { background: var(--amber); }
.funnel-stage.f-decision_pending::before { background: #ea580c; }
.funnel-stage.f-in_qa::before { background: var(--accent); }
.funnel-stage.f-outcome_set::before { background: #16a34a; }
.funnel-stage.f-purchased::before { background: linear-gradient(90deg, #16a34a, #047857); }
.funnel-stage.f-closed::before { background: var(--ink-400); }
.funnel-label { font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ink-500); font-weight: 600; }
.funnel-count { font-size: 22px; font-weight: 700; color: var(--ink-900); font-variant-numeric: tabular-nums; }
.funnel-sub { font-size: 10.5px; color: var(--ink-400); line-height: 1.35; }
.funnel-stage[data-empty="1"] { opacity: 0.55; cursor: default; }
.funnel-stage[data-empty="1"]:hover { transform: none; box-shadow: var(--shadow-sm); border-color: var(--ink-100); }

/* KPI drilldown affordance */
.kpi-card.drillable { cursor: pointer; }
.kpi-card.drillable:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: var(--accent); }
.kpi-card.drillable::after {
  content: '↗'; position: absolute; top: 8px; right: 12px;
  font-size: 12px; color: var(--ink-300);
  transition: color var(--dur-fast) var(--ease);
}
.kpi-card.drillable:hover::after { color: var(--accent); }

.metric-card-sub { font-size: 10px; font-weight: 400; text-transform: none; color: var(--ink-400); margin-left: 4px; letter-spacing: 0; }
.ctl-qa { width: 130px; }

/* Funnel filter banner on Leads tab */
.funnel-filter-banner {
  background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
  border: 1px solid rgba(79, 141, 247, 0.3);
  border-radius: 8px; padding: 9px 14px;
  margin-bottom: 12px;
  display: flex; align-items: center; gap: 10px;
  font-size: 12.5px; color: #1e3a8a;
}
.funnel-filter-banner.hidden { display: none; }
.funnel-filter-banner .ff-label { font-weight: 600; }
.funnel-filter-banner .ff-clear {
  margin-left: auto;
  background: transparent; border: 1px solid rgba(30, 58, 138, 0.25); color: #1e3a8a;
  padding: 4px 10px; border-radius: 6px; cursor: pointer; font-size: 11.5px;
  transition: all var(--dur-fast) var(--ease);
}
.funnel-filter-banner .ff-clear:hover { background: rgba(79, 141, 247, 0.10); border-color: var(--accent); }
.funnel-filter-banner .ff-chip {
  display: inline-flex; align-items: center;
  background: rgba(255, 255, 255, 0.65);
  border: 1px solid rgba(30, 58, 138, 0.25);
  color: #1e3a8a; font-weight: 500;
  padding: 3px 9px; border-radius: 999px;
  font-size: 11.5px; letter-spacing: 0.1px;
}

@media (max-width: 1400px) { .funnel-block { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 800px)  { .funnel-block { grid-template-columns: repeat(2, 1fr); } }

.metrics-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 14px; }
.metric-card {
  background: var(--surface); border: 1px solid var(--ink-100); border-radius: 10px;
  padding: 14px 16px; min-height: 220px;
  box-shadow: var(--shadow-sm);
  transition: box-shadow var(--dur-fast) var(--ease);
}
.metric-card:hover { box-shadow: var(--shadow); }
.metric-card-wide { grid-column: span 2; }
.metric-card-title {
  font-size: 11px; text-transform: uppercase; color: var(--ink-500);
  letter-spacing: 0.08em; margin: 0 0 12px; font-weight: 600;
}

/* Bar charts */
.chart { display: flex; flex-direction: column; gap: 5px; font-size: 11.5px; }
.chart-row {
  display: grid; grid-template-columns: 120px 1fr 50px;
  align-items: center; gap: 10px;
  transition: background var(--dur-fast) var(--ease);
  padding: 1px 0;
}
.chart-row:hover { background: var(--bg-alt); border-radius: 4px; }
.chart-label { color: var(--ink-700); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chart-bar { height: 16px; border-radius: 4px; position: relative; transition: filter var(--dur-fast) var(--ease); }
.chart-row:hover .chart-bar { filter: brightness(1.05); }
.chart-bar.bd { background: linear-gradient(90deg, #fce7f3, var(--t-bd)); }
.chart-bar.code { background: linear-gradient(90deg, #dbeafe, var(--t-codebase)); }
.chart-bar.warm { background: linear-gradient(90deg, #fef3c7, var(--amber)); }
.chart-bar.green { background: linear-gradient(90deg, #d1fae5, var(--green)); }
.chart-bar.red { background: linear-gradient(90deg, #fee2e2, var(--red)); }
.chart-bar.grey { background: linear-gradient(90deg, var(--ink-100), var(--ink-300)); }
.chart-count { text-align: right; color: var(--ink-900); font-variant-numeric: tabular-nums; font-weight: 600; }
.chart-empty { color: var(--ink-300); font-style: italic; padding: 24px 0; text-align: center; }

.list-block { font-size: 12px; max-height: 260px; overflow-y: auto; }
.list-row {
  display: grid; grid-template-columns: 1fr 1fr 80px;
  padding: 7px 0; border-bottom: 1px solid var(--ink-100); gap: 8px;
  font-size: 11.5px;
  transition: background var(--dur-fast) var(--ease);
}
.list-row:hover { background: var(--bg-alt); }
.list-row .lr-name { font-weight: 600; color: var(--ink-900); }
.list-row .lr-company { color: var(--ink-500); }
.list-row .lr-meta { color: var(--ink-400); text-align: right; }

/* ═══════════════════════════════════════════════════════════════════════
   Drawer — decision-relevant summary, not raw JSON
   ═══════════════════════════════════════════════════════════════════════ */
.drawer-overlay {
  position: fixed; inset: 0;
  background: rgba(15, 29, 58, 0.45);
  backdrop-filter: blur(4px);
  z-index: 200;
  opacity: 0; pointer-events: none;
  transition: opacity var(--dur) var(--ease);
}
.drawer-overlay.show { opacity: 1; pointer-events: auto; }

.drawer {
  position: fixed; top: 0; right: 0;
  width: min(640px, 96vw); height: 100vh;
  background: var(--surface);
  z-index: 210;
  box-shadow: var(--shadow-drawer);
  display: flex; flex-direction: column;
  transform: translateX(110%);
  transition: transform var(--dur-slow) var(--ease-out);
}
.drawer.show { transform: none; }
.drawer.hidden { transform: translateX(110%); }
.drawer-overlay.hidden { display: block; opacity: 0; pointer-events: none; }

.drawer-header {
  padding: 18px 22px;
  background: linear-gradient(180deg, var(--navy-900) 0%, var(--navy-800) 100%);
  color: #fff;
  display: flex; align-items: flex-start; justify-content: space-between; gap: 18px;
}
.drawer-header-text { flex: 1; }
.drawer-type {
  display: inline-block; padding: 3px 9px; border-radius: 999px;
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.04em;
  background: rgba(255,255,255,0.10); color: #fff;
  margin-bottom: 8px;
}
.drawer-header h2 { margin: 0 0 4px; font-size: 19px; font-weight: 700; letter-spacing: -0.01em; }
.drawer-sub { color: rgba(255,255,255,0.65); font-size: 12.5px; }
.close-btn { background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.15); width: 32px; height: 32px; font-size: 22px; }
.close-btn:hover { background: rgba(255,255,255,0.18); }

.drawer-body { padding: 22px; overflow-y: auto; flex: 1; font-size: 13px; line-height: 1.5; }

/* Drawer content blocks */
.drawer-section { margin-bottom: 24px; }
.drawer-section:last-child { margin-bottom: 0; }
.drawer-section-title {
  font-size: 10px; text-transform: uppercase; letter-spacing: 0.10em;
  color: var(--ink-400); font-weight: 700; margin: 0 0 10px;
  display: flex; align-items: center; gap: 8px;
}
.drawer-section-title::after { content: ''; flex: 1; height: 1px; background: var(--ink-100); }

.fitness-card {
  padding: 16px 18px; border-radius: 10px;
  border: 1px solid var(--ink-100);
  background: linear-gradient(180deg, var(--bg-alt) 0%, var(--surface) 100%);
}
.fitness-card.qualifying, .fitness-card.accept { border-color: var(--green); background: linear-gradient(180deg, #f0fdf4 0%, #ffffff 100%); }
.fitness-card.borderline, .fitness-card.on_hold { border-color: var(--amber); background: linear-gradient(180deg, #fffbeb 0%, #ffffff 100%); }
.fitness-card.likely_reject, .fitness-card.reject { border-color: var(--red); background: linear-gradient(180deg, #fef2f2 0%, #ffffff 100%); }
.fitness-card.fcs { border-color: #6d28d9; background: linear-gradient(180deg, #f5f3ff 0%, #ffffff 100%); }
.fitness-card.research { border-color: #0d9488; background: linear-gradient(180deg, #f0fdfa 0%, #ffffff 100%); }
.fitness-card.experimental { border-color: #ea580c; background: linear-gradient(180deg, #fff7ed 0%, #ffffff 100%); }
.fitness-verdict { display: flex; align-items: center; gap: 10px; }
.fitness-icon { font-size: 22px; line-height: 1; }
.fitness-label { font-size: 17px; font-weight: 700; color: var(--ink-900); }
.fitness-reason { margin-top: 10px; color: var(--ink-700); font-size: 12.5px; line-height: 1.55; }

.fact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.fact {
  padding: 10px 12px; border-radius: 8px;
  background: var(--bg-alt); border: 1px solid var(--ink-100);
  display: flex; flex-direction: column; gap: 2px;
}
.fact-label { font-size: 10px; color: var(--ink-400); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 600; }
.fact-value { font-size: 14px; font-weight: 600; color: var(--ink-900); }
.fact-value.muted { color: var(--ink-300); font-weight: 500; }
.fact-link { font-size: 12px; word-break: break-all; }

/* A3 — Qualifying metrics panel (pinned top of the BD drawer). */
.qualifying-metrics-panel { border-left: 3px solid var(--accent); padding-left: 12px; }
.qm-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.qm-tile {
  padding: 10px 12px; border-radius: 8px;
  background: var(--bg-alt); border: 1px solid var(--ink-100);
  display: flex; flex-direction: column; gap: 3px;
}
.qm-tile-wide { grid-column: 1 / -1; margin-top: 10px; }
.qm-label { font-size: 10px; color: var(--ink-400); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 600; }
.qm-value { font-size: 14px; font-weight: 600; color: var(--ink-900); }
.qm-tile-wide .qm-value { font-weight: 500; line-height: 1.45; white-space: pre-wrap; }
.qm-missing { color: var(--ink-300); font-weight: 500; font-style: italic; }
.qm-status { display: inline-block; align-self: flex-start; padding: 1px 9px; border-radius: 999px; font-size: 12px; }
.qm-status.is-active { background: rgba(34, 197, 94, 0.14); color: #16a34a; }
.qm-status.is-wound  { background: rgba(148, 163, 184, 0.18); color: #64748b; }
body.dark .qm-label { color: var(--ink-500); }
body.dark .qm-missing { color: var(--ink-400); }
body.dark .qm-status.is-active { background: rgba(34, 197, 94, 0.20); color: #4ade80; }
body.dark .qm-status.is-wound  { background: rgba(148, 163, 184, 0.22); color: #cbd5e1; }

/* Research-task drawer — Artifact Profile chip grid (teal research accent). */
.research-profile { border-left: 3px solid #0d9488; padding-left: 12px; }
.rp-grid { display: flex; flex-direction: column; gap: 8px; }
.rp-row { display: grid; grid-template-columns: 130px 1fr; gap: 10px; align-items: start; }
.rp-label { font-size: 10px; color: var(--ink-400); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 600; padding-top: 3px; }
.rp-vals { display: flex; flex-wrap: wrap; gap: 6px; }
.rp-chip {
  display: inline-block; padding: 2px 9px; border-radius: 999px;
  font-size: 12px; font-weight: 600;
  background: rgba(13, 148, 136, 0.10); color: #0d9488; border: 1px solid rgba(13, 148, 136, 0.25);
}
.rp-chip--muted { background: var(--bg-alt); color: var(--ink-300); border-color: var(--ink-100); font-weight: 500; font-style: italic; }
.rp-chip--domain { background: #0d9488; color: #fff; border-color: #0d9488; }
.rp-chip--link { text-decoration: none; }
.rp-chip--link:hover { background: #0d9488; color: #fff; }
.rp-note { margin-top: 10px; display: flex; flex-direction: column; gap: 3px; }
.rp-note-body { font-size: 13px; line-height: 1.45; color: var(--ink-700); white-space: pre-wrap; }
body.dark .rp-chip { background: rgba(20, 184, 166, 0.15); color: #5eead4; border-color: rgba(20, 184, 166, 0.35); }
body.dark .rp-chip--domain { background: #0d9488; color: #fff; }
body.dark .rp-chip--muted { background: var(--bg-alt); color: var(--ink-400); border-color: var(--ink-100); }

/* "Research Task" type pill (replaces the Business Data pill on these leads). */
.type-research-task { background: rgba(13, 148, 136, 0.10); color: #0d9488; border: 1px solid rgba(13, 148, 136, 0.30); }
body.dark .type-research-task { background: rgba(20, 184, 166, 0.15); color: #5eead4; border-color: rgba(20, 184, 166, 0.35); }
/* Research toggle auto-lit (classified from the intake form, not a manual tag). */
.research-toggle.active.auto { border-style: dashed; }

.repo-list, .connectors-grid { display: flex; flex-direction: column; gap: 6px; margin-top: 6px; }
.repo-row {
  display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center;
  padding: 8px 12px; background: var(--bg-alt); border: 1px solid var(--ink-100); border-radius: 6px;
  font-size: 12px;
}
.repo-row.passing { background: var(--green-bg); border-color: rgba(22, 163, 74, 0.20); }
.repo-row.holding { background: var(--amber-bg); border-color: rgba(245, 158, 11, 0.25); }
.repo-row.rejected { background: var(--red-bg); border-color: rgba(220, 38, 38, 0.20); }
.repo-name { font-family: var(--font-mono); font-size: 11px; color: var(--ink-700); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.repo-meta { font-size: 10.5px; color: var(--ink-500); }

/* Task 9: lead drawer's Asset Grade repo list (plain tr/th/td, not thead/tbody,
   so it doesn't inherit the leads-table rules keyed off those wrappers). */
.drawer-repo-table { margin-top: 6px; font-size: 12px; }
.drawer-repo-table th { text-align: left; padding: 6px 10px; font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-500); border-bottom: 1px solid var(--ink-100); }
.drawer-repo-table td { padding: 6px 10px; border-bottom: 1px solid var(--ink-100); color: var(--ink-700); }
.drawer-repo-table tr:last-child td { border-bottom: none; }
.repo-status {
  font-size: 10px; padding: 2px 7px; border-radius: 999px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.04em;
}
.repo-status.passing { background: var(--green); color: #fff; }
.repo-status.holding { background: var(--amber); color: #fff; }
.repo-status.rejected { background: var(--red); color: #fff; }

.connector-pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; background: var(--bg-alt); border: 1px solid var(--ink-100);
  border-radius: 999px; font-size: 11.5px; color: var(--ink-700);
}
.connector-pill .ck { font-weight: 600; color: var(--ink-900); }
.connector-list { display: flex; flex-wrap: wrap; gap: 6px; }

.drawer-actions {
  display: flex; flex-wrap: wrap; gap: 8px; padding: 14px 22px;
  background: var(--bg-alt); border-top: 1px solid var(--ink-100);
}
/* Every action-row variant (primary / ghost / danger, plus the email <a class="btn-ghost">)
   shares one sizing rule so the row reads coherently: equal width, same height,
   centered icon+label, identical font-size. btn-danger was previously excluded.
   Buttons wrap at ~3 per row (6 actions on manual leads with email = two tidy
   rows of three; fewer buttons grow to fill a single row), labels never wrap. */
.drawer-actions > .btn-primary,
.drawer-actions > .btn-ghost,
.drawer-actions > .btn-danger {
  flex: 1 1 calc(33.333% - 8px); white-space: nowrap;
  display: inline-flex; align-items: center; justify-content: center;
  gap: 6px; padding: 9px 14px; font-size: 12px; text-align: center;
}

.signal-list { display: flex; flex-wrap: wrap; gap: 5px; }
.signal-pill {
  padding: 3px 9px; border-radius: 999px;
  font-size: 11px; font-weight: 600;
}
.signal-good { background: var(--green-light); color: var(--green); }
.signal-warn { background: var(--amber-light); color: #92400e; }
.signal-neutral { background: var(--ink-50); color: var(--ink-500); }
.signal-info { background: #dbeafe; color: #1d4ed8; }

.timeline {
  display: flex; flex-direction: column; gap: 6px;
  font-size: 12px; color: var(--ink-700);
}
.timeline-row { display: grid; grid-template-columns: 130px 1fr; gap: 10px; padding: 5px 0; border-bottom: 1px solid var(--ink-100); }
.timeline-row:last-child { border-bottom: none; }
.timeline-k { color: var(--ink-400); font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; font-weight: 600; }
.timeline-v { color: var(--ink-900); }
.timeline-v.na { color: var(--ink-300); font-style: italic; font-weight: 500; }

/* Tooltips — rendered as a single body-attached element (.lz-tooltip) positioned
   with position:fixed by JS (see initTooltips() in tracker.js). A pure-CSS
   ::after bubble can't escape an ancestor with overflow:hidden/auto (e.g. the
   leads table), so it would clip; a fixed, body-level element never clips. */
.lz-tooltip {
  position: fixed; z-index: 100000;
  background: var(--navy-900); color: #fff;
  padding: 6px 10px; border-radius: 6px;
  font-size: 11px; white-space: nowrap; max-width: 360px;
  box-shadow: var(--shadow-md);
  pointer-events: none;
  animation: fadeIn 100ms var(--ease-out);
}

/* Scrollbar polish */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--ink-200); border-radius: 5px; border: 2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover { background: var(--ink-300); }

/* Hide on small screens — operator surface only */
@media (max-width: 1100px) {
  .kpi-row { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
  .topbar-inner { grid-template-columns: 1fr; gap: 14px; }
  .tab-nav { justify-self: stretch; }
  .kpi-row { grid-template-columns: repeat(2, 1fr); }
}

/* ─── Manual lead modal ─────────────────────────────────────────────── */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(15, 23, 42, 0.55);
  /* Above the drawer (200/210) AND the command palette (300/301): modals like
     Add-manual-lead / QA Add-sample can be opened from the palette. */
  z-index: 310; backdrop-filter: blur(2px);
  transition: opacity var(--dur-base) var(--ease);
}
.modal-overlay.hidden { display: none; }
.modal {
  position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: min(640px, 92vw); max-height: 88vh; overflow-y: auto;
  background: #fff; border-radius: 14px; z-index: 311;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.25);
}
.modal.hidden { display: none; }
.modal-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 22px; border-bottom: 1px solid var(--ink-100);
}
.modal-header h3 { margin: 0; font-size: 16px; font-weight: 600; color: var(--ink-900); }
.modal-body { padding: 18px 22px 22px; }
.modal-sub { font-size: 12.5px; color: var(--ink-500); margin: 0 0 14px; line-height: 1.55; }
.form-row {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px;
}
.form-row:last-child { margin-bottom: 0; }
.form-field { display: flex; flex-direction: column; gap: 5px; }
.form-field-wide { grid-column: 1 / -1; }
.form-field label {
  font-size: 11.5px; font-weight: 600; color: var(--ink-600);
  text-transform: uppercase; letter-spacing: 0.4px;
}
.form-field input,
.form-field select,
.form-field textarea {
  width: 100%; padding: 8px 11px; border: 1px solid var(--ink-200);
  border-radius: 7px; font-size: 13px; font-family: inherit; color: var(--ink-900);
  background: #fff; transition: border-color var(--dur-fast) var(--ease);
}
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  outline: none; border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(79, 141, 247, 0.12);
}
.form-field textarea { resize: vertical; min-height: 64px; }
.form-actions {
  display: flex !important; grid-template-columns: none !important;
  gap: 10px; justify-content: flex-end; margin-top: 8px;
}
.form-actions .btn-primary,
.form-actions .btn-ghost { padding: 8px 18px; }
.form-status { font-size: 12.5px; margin-top: 8px; padding: 6px 10px; border-radius: 6px; min-height: 18px; }
.form-status.error { background: #fef2f2; color: #b91c1c; }
.form-status.info { background: #eff6ff; color: #1e40af; }
.form-status.success { background: #ecfdf5; color: #047857; }

/* ─── Drawer "Mark touched" affordance ──────────────────────────────── */
.mark-touch-row {
  display: flex; gap: 8px; align-items: center; margin-top: 10px;
  padding: 8px 10px; background: var(--ink-50);
  border: 1px dashed var(--ink-200); border-radius: 7px;
}
.mark-touch-note {
  flex: 1; padding: 6px 10px; border: 1px solid var(--ink-200);
  border-radius: 6px; font-size: 12px; background: #fff; font-family: inherit;
}
.mark-touch-note:focus { outline: none; border-color: var(--accent); }
.mark-touch-btn { white-space: nowrap; padding: 6px 12px; font-size: 12px; }

.btn-danger {
  background: transparent; border: 1px solid var(--red-light);
  color: var(--red); font: inherit; font-size: 12px; font-weight: 500;
  padding: 7px 14px; border-radius: 7px; cursor: pointer;
  transition: all var(--dur-fast) var(--ease);
}
.btn-danger:hover { background: var(--red-bg); border-color: var(--red); color: var(--red); }

/* ─── Inline filter count strip (above each table) ─────────────────── */
.count-strip {
  display: flex; align-items: center; justify-content: flex-end;
  padding: 4px 4px 8px;
  font-size: 12.5px; color: var(--ink-500);
}
.count-inline {
  font-variant-numeric: tabular-nums; font-weight: 500;
  background: var(--ink-50); border: 1px solid var(--ink-100);
  padding: 4px 11px; border-radius: 999px;
}
.count-strip { justify-content: space-between; }
.trash-toggle-btn {
  font-size: 12px; font-weight: 600; cursor: pointer;
  background: var(--ink-50); border: 1px solid var(--ink-200); color: var(--ink-600);
  padding: 4px 12px; border-radius: 999px; transition: background .12s, color .12s;
}
.trash-toggle-btn:hover { background: var(--ink-100); color: var(--ink-800); }
.trash-toggle-btn.active { background: #b42318; border-color: #b42318; color: #fff; }
.trash-toggle-btn.hidden { display: none; }
.restore-btn { font-size: 12px; padding: 4px 10px; }

/* Bump the topbar pill so it doesn't disappear next to a noisy nav */
.badge-count {
  font-size: 13.5px !important; padding: 6px 14px !important;
  font-weight: 700 !important;
  background: rgba(79, 141, 247, 0.32) !important;
  border-color: rgba(79, 141, 247, 0.55) !important;
}

/* ─── LLM upload card inside manual-lead modal ─────────────────────── */
.llm-upload {
  background: linear-gradient(180deg, #f7f4ff 0%, #f0ecff 100%);
  border: 1px solid #ddd6fe;
  border-radius: 10px; padding: 12px 14px;
  margin-bottom: 14px;
}
.llm-upload-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 8px; }
.llm-upload-title { font-weight: 600; color: #5b21b6; font-size: 13.5px; }
.llm-upload-sub { font-size: 11.5px; color: var(--ink-500); line-height: 1.4; }
.llm-upload-row { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(220px, 1.4fr) auto; gap: 9px; align-items: center; }
.llm-upload-row input[type="file"] {
  font-size: 12px; padding: 6px 8px; border: 1px solid var(--ink-200);
  background: #fff; border-radius: 6px; cursor: pointer;
}
.llm-upload-row input[type="text"] {
  padding: 7px 10px; border: 1px solid var(--ink-200);
  border-radius: 6px; font-size: 12.5px; font-family: inherit;
}
.llm-upload-row input[type="text"]:focus { outline: none; border-color: #8b5cf6; box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.15); }
.llm-parse-btn {
  background: linear-gradient(180deg, #8b5cf6 0%, #7c3aed 100%) !important;
  white-space: nowrap; padding: 7px 16px !important;
}
.llm-parse-btn:hover { background: linear-gradient(180deg, #a78bfa 0%, #8b5cf6 100%) !important; box-shadow: 0 4px 12px rgba(139, 92, 246, 0.35) !important; }
.llm-parse-btn:disabled { opacity: 0.6; cursor: not-allowed; }

#m-parse-status { margin-top: 8px; margin-bottom: 0; }

/* form-divider between LLM section and manual fields */
.form-divider {
  display: flex; align-items: center; gap: 10px;
  font-size: 11px; color: var(--ink-400);
  text-transform: uppercase; letter-spacing: 0.6px;
  margin: 14px 0 12px;
}
.form-divider::before, .form-divider::after {
  content: ''; flex: 1; height: 1px; background: var(--ink-100);
}

@media (max-width: 720px) {
  .llm-upload-row { grid-template-columns: 1fr; }
}

/* ════════════════════════════════════════════════════════════════════════
   v2 polish — visual upgrade pass (2026-06)
   Targeted overrides for hero/KPIs/funnel/tables/drawer/modal/empty states.
   Only adds depth and breathing room; no structural HTML changes.
   ════════════════════════════════════════════════════════════════════════ */

:root {
  --display-font: 'Inter', system-ui, sans-serif;
  --grad-blue: linear-gradient(135deg, #4f8df7 0%, #6e60ff 100%);
  --grad-rose: linear-gradient(135deg, #f472b6 0%, #ef4444 100%);
  --grad-amber: linear-gradient(135deg, #fbbf24 0%, #f97316 100%);
  --grad-emerald: linear-gradient(135deg, #34d399 0%, #10b981 100%);
  --grad-violet: linear-gradient(135deg, #a78bfa 0%, #7c3aed 100%);
  --grad-slate: linear-gradient(135deg, #94a3b8 0%, #64748b 100%);
  --glass: rgba(255, 255, 255, 0.72);
  --glass-border: rgba(255, 255, 255, 0.5);
  --shadow-glass: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 24px -8px rgba(15, 23, 42, 0.10);
  --shadow-glass-lifted: 0 4px 8px rgba(15, 23, 42, 0.08), 0 24px 48px -12px rgba(15, 23, 42, 0.18);
}

/* ─── Page intro — bigger, gradient title, breathing room ──────────── */
.page-intro {
  margin: 18px 0 26px;
  padding: 22px 26px;
  background: var(--glass);
  backdrop-filter: blur(16px);
  border: 1px solid var(--ink-100);
  border-radius: 14px;
  box-shadow: var(--shadow-glass);
  display: flex; flex-direction: column; gap: 6px;
}
.page-title {
  margin: 0;
  font-size: 28px; font-weight: 700;
  letter-spacing: -0.025em;
  background: linear-gradient(135deg, var(--navy-900) 0%, var(--navy-600) 80%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: var(--navy-900);
}
.page-sub {
  margin: 0;
  font-size: 14px;
  color: var(--ink-500);
  letter-spacing: -0.01em;
  line-height: 1.5;
}

/* ─── KPI cards v2 — bolder numbers, soft tonal backgrounds ────────── */
.kpi-row {
  gap: 14px !important;
  margin-bottom: 28px;
}
.kpi-card {
  position: relative;
  background: var(--surface) !important;
  border: 1px solid var(--ink-100) !important;
  border-radius: 14px !important;
  padding: 18px 20px !important;
  box-shadow: var(--shadow-glass);
  transition: transform var(--dur) var(--ease-out),
              box-shadow var(--dur) var(--ease-out),
              border-color var(--dur) var(--ease);
  overflow: hidden;
}
.kpi-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--grad-slate);
  opacity: 0.85;
}
.kpi-card.k-warm::before { background: var(--grad-amber); }
.kpi-card.k-codebase::before { background: var(--grad-blue); }
.kpi-card.k-bd::before { background: var(--grad-rose); }
.kpi-card.k-closed::before { background: var(--grad-emerald); }
.kpi-card.k-stale::before { background: var(--grad-violet); }
.kpi-card.drillable {
  cursor: pointer;
}
.kpi-card.drillable:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-glass-lifted);
  border-color: var(--accent) !important;
}
.kpi-card.drillable:hover::before { opacity: 1; height: 4px; }
.kpi-label {
  display: block;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--ink-500) !important;
  margin-bottom: 8px !important;
}
.kpi-value {
  display: block;
  font-size: 34px !important;
  font-weight: 700 !important;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.025em;
  line-height: 1.05 !important;
  color: var(--ink-900);
  margin-bottom: 6px !important;
}
.kpi-sub {
  display: block;
  font-size: 11.5px !important;
  color: var(--ink-400) !important;
  letter-spacing: -0.005em;
}

/* ─── Funnel — true funnel shape, progressive width ────────────────── */
.funnel-block {
  gap: 10px !important;
  padding: 2px;
}
.funnel-stage {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--ink-100);
  border-radius: 12px;
  padding: 16px 14px 14px !important;
  box-shadow: var(--shadow-sm);
  transition: transform var(--dur) var(--ease-out),
              box-shadow var(--dur) var(--ease-out),
              border-color var(--dur) var(--ease);
  cursor: pointer;
  overflow: hidden;
}
.funnel-stage[data-empty="1"] { opacity: 0.55; cursor: default; }
.funnel-stage::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 4px;
  background: var(--grad-slate);
  transition: height var(--dur-fast) var(--ease);
}
.funnel-stage.f-intake::after { background: var(--grad-slate); }
.funnel-stage.f-awaiting_verdict::after { background: var(--grad-amber); }
.funnel-stage.f-decision_pending::after { background: var(--grad-violet); }
.funnel-stage.f-in_qa::after { background: var(--grad-blue); }
.funnel-stage.f-outcome_set::after { background: var(--grad-rose); }
.funnel-stage.f-purchased::after { background: var(--grad-emerald); }
.funnel-stage.f-closed::after { background: linear-gradient(135deg, #6b7280 0%, #374151 100%); }
.funnel-stage:not([data-empty="1"]):hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
  border-color: var(--accent);
}
.funnel-stage:not([data-empty="1"]):hover::after { height: 6px; }
.funnel-label {
  font-size: 11px; font-weight: 600;
  letter-spacing: 0.5px; text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 6px;
}
.funnel-count {
  display: block;
  font-size: 28px; font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  color: var(--ink-900);
  margin-bottom: 4px;
  line-height: 1.05;
}
.funnel-sub {
  font-size: 11px;
  color: var(--ink-400);
}

/* ─── Metric section titles — softer ───────────────────────────────── */
.metrics-title {
  font-size: 17px !important;
  letter-spacing: -0.015em !important;
  margin-bottom: 14px !important;
  display: flex; align-items: center; gap: 9px;
}
.metrics-dot {
  width: 9px; height: 9px; border-radius: 50%;
  box-shadow: 0 0 0 3px rgba(79, 141, 247, 0.18);
}
.metrics-dot.d-funnel { background: #4f8df7; }
.metrics-dot.d-bd { background: #f472b6; }
.metrics-dot.d-codebase { background: #6e60ff; }
.metrics-dot.d-engage { background: #34d399; }

/* ─── Metric cards (charts) — refined ──────────────────────────────── */
.metric-card {
  background: var(--surface) !important;
  border: 1px solid var(--ink-100) !important;
  border-radius: 14px !important;
  padding: 18px 18px 14px !important;
  box-shadow: var(--shadow-sm);
  transition: box-shadow var(--dur) var(--ease);
}
.metric-card:hover { box-shadow: var(--shadow-md); }
.metric-card-title {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--ink-700) !important;
  letter-spacing: -0.005em;
  margin: 0 0 12px !important;
}
.metric-card-sub {
  font-size: 11px; font-weight: 400; color: var(--ink-400);
  margin-left: 6px;
}

/* ─── Chart bars — gradient + smoother hover ───────────────────────── */
.chart .bar-row { margin-bottom: 7px !important; }
.chart .bar-track {
  height: 22px !important;
  background: var(--ink-50) !important;
  border-radius: 7px !important;
  overflow: hidden;
  position: relative;
}
.chart .bar {
  height: 100%;
  border-radius: 7px !important;
  background: var(--grad-blue) !important;
  transition: width 600ms var(--ease-out);
  position: relative;
}
.chart .bar.bd { background: var(--grad-rose) !important; }
.chart .bar.code { background: var(--grad-blue) !important; }
.chart .bar.warm { background: var(--grad-amber) !important; }
.chart .bar-label {
  font-size: 11.5px !important;
  font-weight: 500 !important;
  color: var(--ink-700) !important;
}
.chart .bar-value {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  font-variant-numeric: tabular-nums;
  color: var(--ink-500);
}

/* ─── Tab nav — subtle glow on active ──────────────────────────────── */
.tab-btn.active {
  box-shadow: 0 2px 8px rgba(79, 141, 247, 0.40),
              inset 0 1px 0 rgba(255,255,255,0.20) !important;
}
.tab-btn { letter-spacing: -0.005em; }

/* ─── Tables — sticky header + smoother hover ──────────────────────── */
.table-wrap {
  border-radius: 12px !important;
  border: 1px solid var(--ink-100);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  overflow: auto;
  max-height: calc(100vh - 240px);
}
#grid thead th,
#control-grid thead th {
  position: sticky; top: 0; z-index: 5;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--ink-500) !important;
  padding: 11px 12px !important;
  border-bottom: 1px solid var(--ink-100) !important;
  backdrop-filter: blur(10px);
}
#grid tbody tr,
#control-grid tbody tr {
  transition: background var(--dur-fast) var(--ease);
}
#grid tbody tr:nth-child(even) td,
#control-grid tbody tr:nth-child(even) td {
  background: rgba(248, 250, 252, 0.55);
}
#grid tbody tr:hover td,
#control-grid tbody tr:hover td {
  background: rgba(79, 141, 247, 0.06) !important;
}
#grid tbody td,
#control-grid tbody td {
  padding: 10px 12px !important;
  font-size: 12.5px;
  border-bottom: 1px solid var(--ink-100) !important;
}

/* ─── Filter chips — softer with active glow ───────────────────────── */
.chip {
  border-radius: 999px !important;
  padding: 6px 13px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  background: var(--surface) !important;
  border: 1px solid var(--ink-200) !important;
  color: var(--ink-700) !important;
  transition: all var(--dur-fast) var(--ease);
}
.chip:hover { border-color: var(--accent) !important; color: var(--accent-hover) !important; background: rgba(79, 141, 247, 0.06) !important; }
.chip.active {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(79, 141, 247, 0.32);
  font-weight: 600 !important;
}

/* ─── Filterbar — softer container ─────────────────────────────────── */
.filterbar {
  background: var(--surface);
  border: 1px solid var(--ink-100);
  border-radius: 14px;
  padding: 14px !important;
  margin-bottom: 14px;
  box-shadow: var(--shadow-sm);
}
.filter-label {
  font-size: 10.5px !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--ink-500) !important;
  margin-bottom: 4px !important;
}

/* ─── Drawer — bigger title, airier sections ───────────────────────── */
.drawer { width: min(720px, 95vw) !important; box-shadow: var(--shadow-drawer) !important; }
.drawer-header {
  padding: 20px 24px 18px !important;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border-bottom: 1px solid var(--ink-100);
}
#drawer-title {
  font-size: 22px !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em;
  margin: 4px 0 !important;
  background: linear-gradient(135deg, var(--ink-900) 0%, var(--navy-700) 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.drawer-body { padding: 22px 24px !important; }
.drawer-section { margin-bottom: 28px !important; }
.drawer-section-title {
  font-size: 11.5px !important;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--ink-500) !important;
  margin-bottom: 12px !important;
  font-weight: 600 !important;
}

/* ─── Topbar — subtle glass + better depth ─────────────────────────── */
.topbar {
  background: linear-gradient(180deg, #0a1429 0%, #1a2b50 60%, #243964 100%) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  backdrop-filter: blur(20px);
}

/* ─── Status banner — refined ──────────────────────────────────────── */
.status-banner.show {
  border-radius: 10px !important;
  padding: 11px 16px !important;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: -0.005em;
  box-shadow: var(--shadow-sm);
  margin-bottom: 14px;
}

/* ─── Loading skeleton (replaces "Loading..." text feel) ───────────── */
@keyframes shimmer {
  0%   { background-position: -200px 0; }
  100% { background-position: calc(200px + 100%) 0; }
}
.skeleton {
  display: inline-block;
  background: linear-gradient(90deg, var(--ink-100) 0%, var(--ink-50) 50%, var(--ink-100) 100%);
  background-size: 200px 100%; background-repeat: no-repeat;
  border-radius: 6px;
  animation: shimmer 1.6s ease infinite;
}

/* ─── Stagger fade-in on card mount ────────────────────────────────── */
@keyframes fade-in-up {
  0% { opacity: 0; transform: translateY(8px); }
  100% { opacity: 1; transform: translateY(0); }
}
#kpi-row .kpi-card,
#funnel-block .funnel-stage,
.metrics-grid .metric-card {
  animation: fade-in-up 460ms var(--ease-out) backwards;
}
#kpi-row .kpi-card:nth-child(1) { animation-delay: 0ms; }
#kpi-row .kpi-card:nth-child(2) { animation-delay: 40ms; }
#kpi-row .kpi-card:nth-child(3) { animation-delay: 80ms; }
#kpi-row .kpi-card:nth-child(4) { animation-delay: 120ms; }
#kpi-row .kpi-card:nth-child(5) { animation-delay: 160ms; }
#kpi-row .kpi-card:nth-child(6) { animation-delay: 200ms; }
#kpi-row .kpi-card:nth-child(7) { animation-delay: 240ms; }
#kpi-row .kpi-card:nth-child(8) { animation-delay: 280ms; }
#kpi-row .kpi-card:nth-child(9) { animation-delay: 320ms; }
#funnel-block .funnel-stage:nth-child(1) { animation-delay: 100ms; }
#funnel-block .funnel-stage:nth-child(2) { animation-delay: 150ms; }
#funnel-block .funnel-stage:nth-child(3) { animation-delay: 200ms; }
#funnel-block .funnel-stage:nth-child(4) { animation-delay: 250ms; }
#funnel-block .funnel-stage:nth-child(5) { animation-delay: 300ms; }
#funnel-block .funnel-stage:nth-child(6) { animation-delay: 350ms; }
#funnel-block .funnel-stage:nth-child(7) { animation-delay: 400ms; }
.metrics-grid .metric-card { animation-delay: 100ms; }

/* ─── Banner-info ("email not sent yet") — refined card ────────────── */
.banner-info {
  background: linear-gradient(135deg, #fef3c7 0%, #fef9c3 100%);
  border: 1px solid #fde68a;
  border-radius: 11px;
  padding: 12px 16px;
  margin: 0 0 14px;
  font-size: 12.5px;
  color: #78350f;
  box-shadow: 0 1px 2px rgba(120, 53, 15, 0.06);
}
.banner-info strong { color: #78350f; }

/* ─── Stats bar on Leads ──────────────────────────────────────────── */
.stats-bar { gap: 8px !important; margin-bottom: 12px; }
.stat-card {
  background: var(--surface) !important;
  border: 1px solid var(--ink-100) !important;
  border-radius: 10px !important;
  padding: 10px 14px !important;
  box-shadow: var(--shadow-sm);
}
.stat-label {
  font-size: 10.5px !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--ink-500) !important;
}
.stat-value {
  font-size: 17px !important;
  font-weight: 700 !important;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  color: var(--ink-900);
}

/* ─── Modal — softer shadow + entry animation ──────────────────────── */
.modal {
  box-shadow: 0 32px 64px -16px rgba(15, 23, 42, 0.30),
              0 2px 8px rgba(15, 23, 42, 0.08) !important;
  animation: modal-in 280ms var(--ease-out);
}
@keyframes modal-in {
  0% { opacity: 0; transform: translate(-50%, calc(-50% + 12px)) scale(0.96); }
  100% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

/* ─── Count-up animation prep ──────────────────────────────────────── */
.counting { color: var(--accent); transition: color 0.6s var(--ease-out); }

/* ─── Scrollbar refinement ─────────────────────────────────────────── */
::-webkit-scrollbar { width: 8px !important; height: 8px !important; }
::-webkit-scrollbar-thumb { background: var(--ink-200) !important; }
::-webkit-scrollbar-thumb:hover { background: var(--ink-400) !important; }

/* ─── Responsive bumps ─────────────────────────────────────────────── */
@media (max-width: 1400px) {
  .kpi-row { grid-template-columns: repeat(4, 1fr) !important; }
}
@media (max-width: 900px) {
  .kpi-row { grid-template-columns: repeat(2, 1fr) !important; }
  .page-title { font-size: 22px; }
}

/* Seed essentials grid inside the LLM upload card */
.seed-grid {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px;
  margin-bottom: 12px;
}
.seed-grid .form-field label {
  color: #5b21b6 !important;
  font-size: 10.5px !important;
}
.seed-grid .form-field input {
  background: rgba(255, 255, 255, 0.9);
  border-color: #ddd6fe !important;
}
.seed-grid .form-field input:focus {
  border-color: #8b5cf6 !important;
  box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.15) !important;
}
@media (max-width: 720px) {
  .seed-grid { grid-template-columns: 1fr; }
}

/* Research-task modal — chip-group fields (#r-fields) */
.research-field-group { margin-bottom: 14px; }
.research-field-group > .filter-label { display: block; margin-bottom: 6px; }
.research-field-group .chip-row { gap: 6px; }
.research-field-group input[type="text"],
.research-field-group textarea {
  width: 100%; margin-top: 8px; box-sizing: border-box;
}

/* Numbered section headings inside modal */
.section-heading {
  margin: 18px 0 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.005em;
  color: var(--ink-900);
  display: flex; align-items: baseline; gap: 10px;
}
.section-heading:first-child { margin-top: 4px; }
.section-heading .section-sub {
  font-weight: 500;
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: var(--ink-400);
}

/* Inline "optional" badge in field label + help text */
.form-field label .field-hint {
  font-weight: 500;
  font-size: 9.5px;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: var(--ink-400);
  background: var(--ink-50);
  padding: 1px 6px;
  border-radius: 999px;
  margin-left: 6px;
}
.field-help {
  display: block;
  font-size: 10.5px;
  color: var(--ink-400);
  line-height: 1.4;
  margin-top: 4px;
}

/* ════════════════════════════════════════════════════════════════════════
   Wave 1 — Command palette, dark mode, sparklines, queue, bulk, saved views
   ════════════════════════════════════════════════════════════════════════ */

/* ─── Dark mode tokens ────────────────────────────────────────────── */
body.dark {
  --bg: #0a1226;
  --bg-alt: #0f1a35;
  --surface: #131e3d;
  --surface-hover: #1a2647;
  --ink-900: #f1f5fb;
  --ink-700: #cbd5e1;
  --ink-500: #94a3b8;
  --ink-400: #7c8aa1;
  --ink-300: #5a6a82;
  --ink-200: #364260;
  --ink-100: #1f2a47;
  --ink-50: #161f3a;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.40);
  --shadow: 0 1px 3px rgba(0, 0, 0, 0.55), 0 1px 2px -1px rgba(0, 0, 0, 0.45);
  --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.45);
  --shadow-glass: 0 1px 3px rgba(0, 0, 0, 0.50), 0 12px 28px -10px rgba(0, 0, 0, 0.55);
  --glass: rgba(19, 30, 61, 0.85);
  --glass-border: rgba(255, 255, 255, 0.06);
}
body.dark .topbar {
  background: linear-gradient(180deg, #050b1d 0%, #0a1226 60%, #131e3d 100%) !important;
}
body.dark .page-title {
  background: linear-gradient(135deg, #f1f5fb 0%, #4f8df7 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
body.dark .kpi-card,
body.dark .funnel-stage,
body.dark .metric-card,
body.dark .filterbar,
body.dark .stat-card,
body.dark .table-wrap,
body.dark .page-intro {
  background: var(--surface) !important;
  border-color: var(--ink-100) !important;
}
body.dark #grid thead th,
body.dark #control-grid thead th {
  background: linear-gradient(180deg, #0f1a35 0%, #131e3d 100%) !important;
  color: var(--ink-500) !important;
  border-bottom-color: var(--ink-100) !important;
}
body.dark #grid tbody tr:nth-child(even) td,
body.dark #control-grid tbody tr:nth-child(even) td { background: rgba(255,255,255,0.02); }
body.dark #grid tbody tr:hover td,
body.dark #control-grid tbody tr:hover td { background: rgba(79, 141, 247, 0.10) !important; }
body.dark .chip {
  background: var(--ink-100) !important;
  border-color: var(--ink-200) !important;
  color: var(--ink-700) !important;
}
body.dark .chip:hover { background: rgba(79, 141, 247, 0.12) !important; }
body.dark .modal { background: var(--surface) !important; color: var(--ink-900); }
body.dark .modal-sub { color: var(--ink-500); }
body.dark .form-field input,
body.dark .form-field select,
body.dark .form-field textarea {
  background: var(--bg-alt) !important;
  border-color: var(--ink-200) !important;
  color: var(--ink-900);
}
body.dark .form-field input:focus,
body.dark .form-field select:focus,
body.dark .form-field textarea:focus {
  border-color: var(--accent) !important;
}
body.dark .drawer { background: var(--surface) !important; }
body.dark .drawer-header { background: linear-gradient(180deg, var(--bg-alt) 0%, var(--surface) 100%) !important; border-color: var(--ink-100); }
body.dark #drawer-title { background: linear-gradient(135deg, #f1f5fb 0%, #94a3b8 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
body.dark .timeline-k { color: var(--ink-500); }
body.dark .timeline-v { color: var(--ink-900); }
body.dark .fact-label { color: var(--ink-500); }
body.dark .fact-value { color: var(--ink-900); }
body.dark .banner-info {
  background: linear-gradient(135deg, rgba(254, 243, 199, 0.10) 0%, rgba(254, 249, 195, 0.06) 100%);
  border-color: rgba(253, 230, 138, 0.35);
  color: #fbbf24;
}
body.dark .badge-count { background: rgba(79, 141, 247, 0.45) !important; }
body.dark .count-inline { background: var(--ink-100); border-color: var(--ink-200); color: var(--ink-500); }
body.dark .llm-upload { background: linear-gradient(180deg, rgba(139, 92, 246, 0.10) 0%, rgba(124, 58, 237, 0.05) 100%); border-color: rgba(139, 92, 246, 0.25); }

/* ─── Command palette ─────────────────────────────────────────────── */
.cmdk-overlay {
  position: fixed; inset: 0;
  background: rgba(10, 18, 38, 0.55);
  backdrop-filter: blur(6px);
  /* Must sit ABOVE the lead drawer (z 200/210) — same tier as the seller picker. */
  z-index: 300;
}
.cmdk-overlay.hidden { display: none; }
.cmdk-modal {
  position: fixed; top: 80px; left: 50%; transform: translateX(-50%);
  width: min(620px, 92vw);
  background: var(--surface);
  border: 1px solid var(--ink-100);
  border-radius: 14px;
  z-index: 301;
  box-shadow: 0 32px 72px -16px rgba(0, 0, 0, 0.45),
              0 4px 12px rgba(0, 0, 0, 0.15);
  overflow: hidden;
  animation: cmdk-in 240ms var(--ease-out);
}
.cmdk-modal.hidden { display: none; }
@keyframes cmdk-in {
  0% { opacity: 0; transform: translate(-50%, -8px) scale(0.97); }
  100% { opacity: 1; transform: translate(-50%, 0) scale(1); }
}
.cmdk-search-wrap {
  display: flex; align-items: center; gap: 10px;
  padding: 16px 18px; border-bottom: 1px solid var(--ink-100);
}
.cmdk-icon {
  font-size: 12px; font-weight: 700;
  color: var(--accent); letter-spacing: 0.5px;
  background: rgba(79, 141, 247, 0.10);
  padding: 4px 9px; border-radius: 6px;
}
#cmdk-input {
  flex: 1;
  border: none; outline: none; background: transparent;
  font: inherit; font-size: 15px; color: var(--ink-900);
}
.cmdk-hint { font-size: 11px; color: var(--ink-400); }
.cmdk-hint kbd, .cmdk-footer kbd {
  display: inline-block;
  font-family: var(--font-mono); font-size: 10px;
  background: var(--ink-100); color: var(--ink-700);
  border: 1px solid var(--ink-200);
  padding: 2px 5px; border-radius: 4px;
  min-width: 18px; text-align: center;
  margin: 0 2px;
}
.cmdk-results {
  max-height: 460px; overflow-y: auto;
  padding: 8px 0;
}
.cmdk-result {
  display: flex; align-items: center; gap: 12px;
  padding: 9px 18px;
  cursor: pointer;
  font-size: 13px;
  border-left: 2px solid transparent;
  transition: background var(--dur-fast) var(--ease);
}
.cmdk-result:hover,
.cmdk-result.active {
  background: rgba(79, 141, 247, 0.08);
  border-left-color: var(--accent);
}
.cmdk-result-kind {
  font-size: 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.5px;
  color: var(--ink-500);
  background: var(--ink-50);
  padding: 2px 7px; border-radius: 4px;
  min-width: 60px; text-align: center;
}
.cmdk-result-kind.k-action { background: rgba(79, 141, 247, 0.12); color: var(--accent); }
.cmdk-result-kind.k-view { background: rgba(139, 92, 246, 0.12); color: #8b5cf6; }
.cmdk-result-label { flex: 1; color: var(--ink-900); font-weight: 500; }
.cmdk-result-sub { font-size: 11.5px; color: var(--ink-400); }
.cmdk-empty {
  padding: 30px 20px; text-align: center;
  color: var(--ink-400); font-size: 12.5px;
}
.cmdk-section-label {
  font-size: 10px; font-weight: 700; letter-spacing: 0.8px;
  color: var(--ink-400); text-transform: uppercase;
  padding: 12px 18px 4px;
}
.cmdk-footer {
  display: flex; gap: 16px;
  padding: 10px 18px;
  background: var(--bg-alt);
  border-top: 1px solid var(--ink-100);
  font-size: 11px; color: var(--ink-500);
}

/* ─── Today's queue strip ─────────────────────────────────────────── */
.today-queue {
  margin-bottom: 24px;
  padding: 18px 22px;
  background: linear-gradient(135deg, rgba(251, 191, 36, 0.10) 0%, rgba(239, 68, 68, 0.06) 100%);
  border: 1px solid rgba(251, 191, 36, 0.30);
  border-radius: 14px;
  animation: fade-in-up 460ms var(--ease-out) backwards;
}
.today-queue.hidden { display: none; }
.today-queue-title {
  margin: 0 0 14px;
  font-size: 14px; font-weight: 700;
  color: #b45309;
  letter-spacing: -0.005em;
}
body.dark .today-queue-title { color: #fbbf24; }
.today-queue-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}
.queue-card {
  background: rgba(255, 255, 255, 0.65);
  border: 1px solid rgba(251, 191, 36, 0.20);
  border-radius: 10px;
  padding: 12px 14px;
  cursor: pointer;
  transition: all var(--dur-fast) var(--ease);
}
body.dark .queue-card { background: rgba(20, 30, 60, 0.6); border-color: rgba(251, 191, 36, 0.25); }
.queue-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
  border-color: #f59e0b;
}
.queue-card-count { font-size: 22px; font-weight: 700; color: #b45309; line-height: 1; font-variant-numeric: tabular-nums; }
body.dark .queue-card-count { color: #fbbf24; }
.queue-card-label { font-size: 11.5px; font-weight: 600; color: var(--ink-700); margin-top: 4px; }
.queue-card-sub { font-size: 10.5px; color: var(--ink-500); margin-top: 2px; }

/* ─── Sparkline + comparison on KPI cards ─────────────────────────── */
.kpi-card { padding-bottom: 16px !important; }
.kpi-sparkline {
  display: block;
  margin-top: 8px;
  width: 100%; height: 22px;
  pointer-events: none;
}
.kpi-sparkline path { fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.kpi-sparkline .area { stroke: none; opacity: 0.18; }
.kpi-card .kpi-delta {
  font-size: 11px; font-weight: 600;
  font-variant-numeric: tabular-nums;
  display: inline-block;
  padding: 1px 7px; border-radius: 999px;
  margin-left: 6px;
}
.kpi-card .kpi-delta.up { background: rgba(34, 197, 94, 0.12); color: #16a34a; }
.kpi-card .kpi-delta.down { background: rgba(239, 68, 68, 0.12); color: #dc2626; }
.kpi-card .kpi-delta.flat { background: var(--ink-50); color: var(--ink-500); }

/* ─── Bulk action bar ─────────────────────────────────────────────── */
.bulk-bar {
  position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%);
  display: flex; align-items: center; gap: 14px;
  padding: 12px 18px;
  background: var(--surface);
  border: 1px solid var(--accent);
  border-radius: 999px;
  box-shadow: 0 12px 32px -8px rgba(15, 23, 42, 0.30),
              0 0 0 4px rgba(79, 141, 247, 0.15);
  z-index: 70;
  animation: bulk-in 240ms var(--ease-out);
}
.bulk-bar.hidden { display: none; }
@keyframes bulk-in {
  0% { opacity: 0; transform: translate(-50%, 12px); }
  100% { opacity: 1; transform: translate(-50%, 0); }
}
.bulk-count {
  font-size: 12.5px; font-weight: 600; color: var(--accent);
  padding-right: 14px; border-right: 1px solid var(--ink-100);
  font-variant-numeric: tabular-nums;
}
.bulk-actions { display: flex; gap: 6px; }
.bulk-btn {
  background: transparent; border: 1px solid var(--ink-200);
  color: var(--ink-700); font: inherit; font-size: 12px; font-weight: 500;
  padding: 6px 12px; border-radius: 7px; cursor: pointer;
  transition: all var(--dur-fast) var(--ease);
}
.bulk-btn:hover { background: var(--ink-50); border-color: var(--accent); color: var(--accent); }

/* Row checkboxes */
.row-check { width: 24px !important; }
.row-check input[type="checkbox"] { cursor: pointer; }
tr.selected td { background: rgba(79, 141, 247, 0.10) !important; }

/* ─── Snooze + reaction + assignee pills in drawer ─────────────────── */
.drawer-meta-row {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-bottom: 14px;
}
.meta-pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  background: var(--ink-50); border: 1px solid var(--ink-100);
  border-radius: 999px;
  font-size: 11.5px;
  color: var(--ink-700);
  cursor: pointer;
  transition: all var(--dur-fast) var(--ease);
}
.meta-pill:hover { border-color: var(--accent); color: var(--accent); }
.meta-pill.active { background: rgba(79, 141, 247, 0.10); border-color: var(--accent); color: var(--accent); font-weight: 600; }
.meta-pill .meta-icon { font-size: 13px; }
.reaction-row { display: inline-flex; gap: 4px; }
.reaction-btn {
  background: var(--ink-50); border: 1px solid var(--ink-100);
  font-size: 14px; cursor: pointer;
  padding: 3px 8px; border-radius: 999px;
  transition: all var(--dur-fast) var(--ease);
}
.reaction-btn:hover { background: rgba(79, 141, 247, 0.10); border-color: var(--accent); transform: scale(1.15); }
.reaction-btn.active { background: rgba(79, 141, 247, 0.18); border-color: var(--accent); }

/* ─── Inline GradeX + BD panels in drawer ─────────────────────────── */
.inline-data-panel {
  background: var(--bg-alt);
  border: 1px solid var(--ink-100);
  border-radius: 10px;
  padding: 12px 14px;
  margin-top: 10px;
}
.inline-data-row {
  display: grid; grid-template-columns: 130px 1fr;
  gap: 8px; padding: 4px 0;
  font-size: 12px;
  border-bottom: 1px dashed var(--ink-100);
}
.inline-data-row:last-child { border-bottom: none; }
.inline-data-key { color: var(--ink-500); font-weight: 500; }
.inline-data-val { color: var(--ink-900); font-variant-numeric: tabular-nums; }
.inline-data-val.muted { color: var(--ink-400); }
.repo-pill {
  display: inline-block;
  font-family: var(--font-mono); font-size: 11px;
  background: var(--surface);
  border: 1px solid var(--ink-200);
  padding: 2px 9px; border-radius: 999px;
  margin: 2px 4px 2px 0;
}
.repo-pill.accept { background: rgba(34, 197, 94, 0.10); border-color: #22c55e; color: #15803d; }
.repo-pill.reject { background: rgba(239, 68, 68, 0.10); border-color: #ef4444; color: #b91c1c; }
.repo-pill.on_hold { background: rgba(251, 191, 36, 0.10); border-color: #f59e0b; color: #b45309; }
body.dark .repo-pill.accept { color: #4ade80; }
body.dark .repo-pill.reject { color: #f87171; }
body.dark .repo-pill.on_hold { color: #fbbf24; }

/* ─── Activity feed in drawer ─────────────────────────────────────── */
.activity-feed { margin-top: 10px; }
.activity-entry {
  display: grid; grid-template-columns: 14px 1fr auto;
  gap: 10px; padding: 6px 0;
  font-size: 12px;
  border-left: 1px dashed var(--ink-100); padding-left: 12px;
  position: relative;
}
.activity-entry::before {
  content: ''; position: absolute; left: -5px; top: 11px;
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--accent);
}
.activity-dot { color: var(--accent); }
.activity-text { color: var(--ink-700); }
.activity-time { color: var(--ink-400); font-size: 11px; white-space: nowrap; }
/* DR activity log shows full values (no char cap) — break long URLs/notes so
   they wrap instead of forcing horizontal scroll. */
.dr-activity .activity-text { overflow-wrap: anywhere; }

/* ─── Pricing widget in drawer ────────────────────────────────────── */
.price-widget {
  background: linear-gradient(135deg, rgba(34, 197, 94, 0.08) 0%, rgba(16, 185, 129, 0.04) 100%);
  border: 1px solid rgba(34, 197, 94, 0.25);
  border-radius: 10px;
  padding: 14px;
  margin-top: 10px;
}
.price-row {
  display: flex; align-items: baseline; justify-content: space-between;
  padding: 4px 0;
  font-size: 12.5px;
}
.price-row .price-label { color: var(--ink-700); }
.price-row .price-amount { font-weight: 600; color: var(--ink-900); font-variant-numeric: tabular-nums; }
.price-total {
  margin-top: 8px; padding-top: 10px; border-top: 1px dashed rgba(34, 197, 94, 0.30);
  font-size: 14px;
}
.price-total .price-amount { font-size: 17px; color: #15803d; font-weight: 700; }
body.dark .price-total .price-amount { color: #4ade80; }

/* ─── mNDA / Calendly status pills ────────────────────────────────── */
.status-pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 9px;
  font-size: 11px; font-weight: 600;
  border-radius: 999px;
  border: 1px solid;
}
.status-pill.signed { background: rgba(34, 197, 94, 0.10); color: #15803d; border-color: rgba(34, 197, 94, 0.35); }
.status-pill.booked { background: rgba(79, 141, 247, 0.10); color: var(--accent); border-color: rgba(79, 141, 247, 0.35); }
.status-pill.pending { background: var(--ink-50); color: var(--ink-500); border-color: var(--ink-200); }
body.dark .status-pill.signed { color: #4ade80; }
body.dark .status-pill.booked { color: #93c5fd; }

/* ─── Saved views menu ────────────────────────────────────────────── */
.saved-views-menu {
  position: relative;
  display: inline-block;
}
.saved-views-menu-btn {
  background: var(--surface); border: 1px solid var(--ink-200);
  color: var(--ink-700); font: inherit; font-size: 12px;
  padding: 6px 12px; border-radius: 7px; cursor: pointer;
  display: inline-flex; align-items: center; gap: 5px;
}
.saved-views-menu-btn:hover { border-color: var(--accent); color: var(--accent); }
.saved-views-dropdown {
  position: absolute; top: calc(100% + 4px); right: 0;
  min-width: 240px;
  background: var(--surface); border: 1px solid var(--ink-100);
  border-radius: 10px;
  box-shadow: var(--shadow-md);
  padding: 6px; z-index: 50;
}
.saved-views-dropdown.hidden { display: none; }
.saved-view-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 7px 10px; border-radius: 6px;
  cursor: pointer; font-size: 12.5px;
}
.saved-view-row:hover { background: var(--ink-50); }
.saved-view-row .sv-name { font-weight: 500; color: var(--ink-900); }
.saved-view-row .sv-del { background: none; border: none; color: var(--ink-400); cursor: pointer; font-size: 14px; padding: 0 4px; }
.saved-view-row .sv-del:hover { color: var(--red); }
.saved-view-add {
  display: flex; gap: 6px; padding: 8px 6px 4px;
  border-top: 1px solid var(--ink-100); margin-top: 6px;
}
.saved-view-add input {
  flex: 1; padding: 6px 9px;
  border: 1px solid var(--ink-200); border-radius: 6px;
  font-size: 12px; font-family: inherit; background: var(--surface);
}
.saved-view-add button {
  padding: 6px 12px; background: var(--accent); color: #fff;
  border: none; border-radius: 6px; cursor: pointer;
  font-size: 12px; font-weight: 600;
}

/* ─── Recent leads in topbar ──────────────────────────────────────── */
.recent-leads-btn { position: relative; }
.recent-leads-dropdown {
  position: absolute; top: calc(100% + 8px); right: 0;
  min-width: 240px; max-width: 320px;
  background: var(--surface); border: 1px solid var(--ink-100);
  border-radius: 10px; box-shadow: var(--shadow-md);
  padding: 6px; z-index: 50;
}
.recent-leads-dropdown.hidden { display: none; }
.recent-lead-row {
  display: flex; flex-direction: column; gap: 2px;
  padding: 7px 10px; border-radius: 6px; cursor: pointer;
}
.recent-lead-row:hover { background: var(--ink-50); }
.recent-lead-name { font-size: 12.5px; font-weight: 500; color: var(--ink-900); }
.recent-lead-sub { font-size: 11px; color: var(--ink-400); }

/* ─── Snoozed row treatment ──────────────────────────────────────── */
tr.snoozed td:first-child { box-shadow: inset 3px 0 0 #f59e0b; opacity: 0.65; }
tr.snoozed td:first-child::after { content: ' 💤'; }

/* ════════════════════════════════════════════════════════════════════════
   Color overhaul (2026-06-05) — light + dark contrast pass.
   Goal: pass WCAG AA on every text/background pair, eliminate "faint text"
   and the dark-mode unreadability. Token-driven so future surfaces inherit.
   ════════════════════════════════════════════════════════════════════════ */

/* Light mode — tighter contrast on secondary inks (was too washed) */
:root {
  --ink-900: #0a0f1c;
  --ink-700: #1f2937;
  --ink-600: #2f3a4d;
  --ink-500: #3d4756;   /* was #4b5563 — bumped */
  --ink-400: #525d6e;   /* was #6b7280 — bumped */
  --ink-300: #7b8597;   /* was #9ca3af — bumped */
  --ink-200: #c2cad7;
  --ink-100: #dde3ec;
  --ink-50:  #f1f4f9;
  --surface: #ffffff;
  --surface-hover: #f5f8fc;
  --bg: #f6f9fd;
  --bg-alt: #ebf0f7;
}

/* Dark mode — Linear/Notion-style: deep navy bg, near-white primary text */
body.dark {
  --bg:         #0b1120;
  --bg-alt:     #0f172a;
  --surface:    #182238;
  --surface-hover: #1f2c47;
  --ink-900:    #f8fafc;   /* primary text — near white */
  --ink-700:    #e2e8f0;   /* body text */
  --ink-600:    #cbd5e1;
  --ink-500:    #a8b3c5;   /* labels */
  --ink-400:    #8b96aa;   /* hints */
  --ink-300:    #6a7793;
  --ink-200:    #3a4660;
  --ink-100:    #29344a;
  --ink-50:     #1b2540;
  --accent:     #6ba1ff;
  --accent-hover: #8db8ff;
  --glass:      rgba(24, 34, 56, 0.85);
  --glass-border: rgba(255, 255, 255, 0.08);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.45);
  --shadow:    0 1px 3px rgba(0, 0, 0, 0.55), 0 1px 2px -1px rgba(0, 0, 0, 0.45);
  --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.50);
  --shadow-glass: 0 1px 3px rgba(0, 0, 0, 0.50), 0 12px 28px -10px rgba(0, 0, 0, 0.60);
}

/* Body text + background always reads from tokens */
body { background: var(--bg); color: var(--ink-900); }

/* === Light + dark sweeps: kill literal colors that don't switch ====== */

/* Topbar text in both modes */
.topbar .brand-title { color: #ffffff !important; }
.topbar .brand-sub   { color: rgba(255,255,255,0.65) !important; }
.tab-btn { color: rgba(255,255,255,0.72); }
.tab-btn:hover { color: #ffffff; }
.tab-btn.active { color: #ffffff !important; }

/* Page intro — use background-image (not the shorthand) so background-clip
   is preserved and the gradient stays clipped to text shape. */
.page-title { color: var(--ink-900); }
body:not(.dark) .page-title {
  background-image: linear-gradient(135deg, #0a0f1c 0%, #2f4f8a 80%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
body.dark .page-title {
  background-image: linear-gradient(135deg, #ffffff 0%, #93b8ff 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.page-sub { color: var(--ink-500); }

/* KPI cards — text colors via tokens */
.kpi-label { color: var(--ink-500) !important; }
.kpi-value { color: var(--ink-900) !important; }
.kpi-sub   { color: var(--ink-400) !important; }
body.dark .kpi-card { background: var(--surface) !important; border-color: var(--ink-200) !important; }
body.dark .kpi-card.drillable:hover { border-color: var(--accent) !important; }

/* Funnel cards */
.funnel-label { color: var(--ink-500); }
.funnel-count { color: var(--ink-900); }
.funnel-sub   { color: var(--ink-400); }
body.dark .funnel-stage { background: var(--surface); border-color: var(--ink-200); }

/* Metric chart cards */
body.dark .metric-card { background: var(--surface) !important; border-color: var(--ink-200) !important; }
.metric-card-title { color: var(--ink-900) !important; }
.metric-card-sub   { color: var(--ink-400) !important; }
.chart .bar-label  { color: var(--ink-900) !important; }
.chart .bar-value  { color: var(--ink-500) !important; }
body.dark .chart .bar-track { background: var(--ink-100) !important; }
.chart-empty       { color: var(--ink-400); }

/* Section titles + metric dots */
.metrics-title { color: var(--ink-900); }

/* Drawer body text colors all token-driven */
.drawer { background: var(--surface) !important; color: var(--ink-900); }
.drawer-header { background: var(--bg-alt) !important; border-color: var(--ink-100); }
.drawer-type   { color: var(--accent); }
#drawer-title  { color: var(--ink-900); }
.drawer-sub    { color: var(--ink-500); }
.drawer-section-title { color: var(--ink-500); }
.drawer-section-title::after { background: var(--ink-100); }
.fact-label    { color: var(--ink-500); }
.fact-value    { color: var(--ink-900); }
.fact-value.muted { color: var(--ink-400); }
.timeline-k    { color: var(--ink-500); }
.timeline-v    { color: var(--ink-900); }
.timeline-v.na { color: var(--ink-400); }
.fitness-reason { color: var(--ink-500); }
.connector-pill { background: var(--bg-alt); border: 1px solid var(--ink-100); color: var(--ink-700); }
.connector-pill .ck { color: var(--ink-400); }
.repo-name     { color: var(--ink-900); }
.repo-meta     { color: var(--ink-500); }
body.dark #drawer-title {
  background: linear-gradient(135deg, #ffffff 0%, #cbd5e1 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}

/* Filterbar + chips + saved-views + count-strip */
.filterbar { background: var(--surface); border-color: var(--ink-100); }
.filter-label { color: var(--ink-500) !important; }
.chip { background: var(--surface) !important; border-color: var(--ink-200) !important; color: var(--ink-700) !important; }
.chip:hover { background: var(--bg-alt) !important; border-color: var(--accent) !important; color: var(--accent) !important; }
.chip.active { background: var(--accent) !important; color: #ffffff !important; border-color: var(--accent) !important; }
body.dark .chip { background: var(--surface) !important; }
body.dark .chip:hover { background: var(--surface-hover) !important; }
.count-inline { background: var(--bg-alt); border-color: var(--ink-100); color: var(--ink-700); }
.search, .select {
  background: var(--surface);
  border-color: var(--ink-200);
  color: var(--ink-900);
}
.search::placeholder, input::placeholder { color: var(--ink-400); }
.search:focus, .select:focus { border-color: var(--accent); }

/* Table — light + dark */
.table-wrap { background: var(--surface); border-color: var(--ink-100); }
#grid thead th, #control-grid thead th {
  background: var(--bg-alt) !important;
  color: var(--ink-500) !important;
  border-bottom-color: var(--ink-100) !important;
}
body.dark #grid thead th, body.dark #control-grid thead th {
  background: var(--surface-hover) !important;
}
#grid tbody td, #control-grid tbody td { color: var(--ink-900); border-bottom-color: var(--ink-100) !important; }
#grid tbody tr:nth-child(even) td, #control-grid tbody tr:nth-child(even) td { background: rgba(0,0,0,0.015); }
body.dark #grid tbody tr:nth-child(even) td, body.dark #control-grid tbody tr:nth-child(even) td { background: rgba(255,255,255,0.025); }
#grid tbody tr:hover td, #control-grid tbody tr:hover td { background: rgba(79, 141, 247, 0.07) !important; }
body.dark #grid tbody tr:hover td, body.dark #control-grid tbody tr:hover td { background: rgba(107, 161, 255, 0.12) !important; }
.cell-na { color: var(--ink-400); }

/* Modal text colors */
.modal { background: var(--surface) !important; color: var(--ink-900); }
.modal-header { border-bottom-color: var(--ink-100); }
.modal-header h3 { color: var(--ink-900); }
.modal-sub { color: var(--ink-500); }
.form-field label { color: var(--ink-600); }
.form-field input, .form-field select, .form-field textarea {
  background: var(--surface) !important;
  border-color: var(--ink-200) !important;
  color: var(--ink-900) !important;
}
body.dark .form-field input,
body.dark .form-field select,
body.dark .form-field textarea {
  background: var(--bg-alt) !important;
}
.form-field input::placeholder, .form-field textarea::placeholder { color: var(--ink-400); }
.form-status.info  { background: var(--bg-alt); color: var(--accent); }
.form-status.error { background: rgba(220, 38, 38, 0.10); color: #dc2626; }
.form-status.success { background: rgba(22, 163, 74, 0.10); color: #16a34a; }
body.dark .form-status.error { background: rgba(220, 38, 38, 0.20); color: #fca5a5; }
body.dark .form-status.success { background: rgba(22, 163, 74, 0.20); color: #86efac; }

/* LLM upload section — readable in both modes */
.llm-upload {
  background: linear-gradient(180deg, rgba(139, 92, 246, 0.08) 0%, rgba(124, 58, 237, 0.04) 100%);
  border: 1px solid rgba(139, 92, 246, 0.25);
}
body.dark .llm-upload {
  background: linear-gradient(180deg, rgba(139, 92, 246, 0.14) 0%, rgba(124, 58, 237, 0.08) 100%);
  border-color: rgba(139, 92, 246, 0.40);
}
.llm-upload-title { color: #6d28d9; }
.llm-upload-sub   { color: var(--ink-500); }
body.dark .llm-upload-title { color: #c4b5fd; }
.section-heading  { color: var(--ink-900); }
.section-heading .section-sub { color: var(--ink-400); }
.field-help       { color: var(--ink-400); }
.form-field label .field-hint { background: var(--bg-alt); color: var(--ink-500); }
.seed-grid .form-field label { color: #6d28d9 !important; }
body.dark .seed-grid .form-field label { color: #c4b5fd !important; }
.seed-grid .form-field input { border-color: rgba(139, 92, 246, 0.35) !important; }
body.dark .seed-grid .form-field input { background: var(--bg-alt) !important; }

/* Mark-touched row */
.mark-touch-row { background: var(--bg-alt); border-color: var(--ink-100); }
.mark-touch-note { background: var(--surface); border-color: var(--ink-200); color: var(--ink-900); }

/* Status banner — light + dark */
.status-banner.info  { background: rgba(79, 141, 247, 0.12); color: var(--accent); border: 1px solid rgba(79, 141, 247, 0.30); }
.status-banner.error { background: rgba(220, 38, 38, 0.12); color: #b91c1c; border: 1px solid rgba(220, 38, 38, 0.30); }
.status-banner.success { background: rgba(22, 163, 74, 0.12); color: #15803d; border: 1px solid rgba(22, 163, 74, 0.30); }
body.dark .status-banner.error { color: #fca5a5; }
body.dark .status-banner.success { color: #86efac; }

/* Banner-info ("email not being sent yet") */
.banner-info { color: #78350f; background: linear-gradient(135deg, #fef3c7 0%, #fef9c3 100%); border-color: #fde68a; }
body.dark .banner-info { color: #fcd34d; background: linear-gradient(135deg, rgba(254, 243, 199, 0.10) 0%, rgba(254, 249, 195, 0.06) 100%); border-color: rgba(253, 230, 138, 0.30); }
.banner-info strong { color: inherit; }

/* Stats bar */
.stat-card { background: var(--surface) !important; border-color: var(--ink-100) !important; }
.stat-label { color: var(--ink-500) !important; }
.stat-value { color: var(--ink-900); }

/* KPI delta pills (already had colors, but make sure they read on dark) */
.kpi-card .kpi-delta.up   { background: rgba(34, 197, 94, 0.16); color: #15803d; }
.kpi-card .kpi-delta.down { background: rgba(220, 38, 38, 0.16); color: #b91c1c; }
.kpi-card .kpi-delta.flat { background: var(--bg-alt); color: var(--ink-500); }
body.dark .kpi-card .kpi-delta.up   { color: #86efac; }
body.dark .kpi-card .kpi-delta.down { color: #fca5a5; }

/* Funnel-filter banner */
.funnel-filter-banner {
  background: linear-gradient(180deg, rgba(79, 141, 247, 0.10) 0%, rgba(79, 141, 247, 0.04) 100%);
  border-color: rgba(79, 141, 247, 0.30);
  color: var(--accent);
}
body.dark .funnel-filter-banner {
  background: linear-gradient(180deg, rgba(107, 161, 255, 0.18) 0%, rgba(107, 161, 255, 0.08) 100%);
  border-color: rgba(107, 161, 255, 0.45);
  color: #c2dafd;
}
.funnel-filter-banner .ff-label { color: inherit; }
.funnel-filter-banner .ff-chip { background: var(--surface); border-color: var(--ink-200); color: var(--ink-700); }
body.dark .funnel-filter-banner .ff-chip { background: var(--surface-hover); }
.funnel-filter-banner .ff-clear { background: transparent; border-color: var(--ink-200); color: inherit; }

/* Drawer meta pills */
.meta-pill { background: var(--bg-alt); border-color: var(--ink-100); color: var(--ink-700); }
.meta-pill:hover { background: var(--surface-hover); }
.meta-pill.active { background: rgba(79, 141, 247, 0.14); border-color: var(--accent); color: var(--accent); }
body.dark .meta-pill { background: var(--surface-hover); }
body.dark .meta-pill.active { background: rgba(107, 161, 255, 0.22); color: #c2dafd; }
.reaction-btn { background: var(--bg-alt); border-color: var(--ink-100); }
.reaction-btn:hover { background: var(--surface-hover); }
.reaction-btn.active { background: rgba(79, 141, 247, 0.18); border-color: var(--accent); }
body.dark .reaction-btn { background: var(--surface-hover); }

/* Activity feed */
.activity-text { color: var(--ink-700); }
.activity-time { color: var(--ink-400); }
.activity-entry { border-left-color: var(--ink-100); }

/* Inline data panel + repo pills */
.inline-data-panel { background: var(--bg-alt); border-color: var(--ink-100); }
.inline-data-row { border-bottom-color: var(--ink-100); }
.inline-data-key { color: var(--ink-500); }
.inline-data-val { color: var(--ink-900); }
.inline-data-val.muted { color: var(--ink-400); }
.repo-pill { background: var(--surface); border-color: var(--ink-200); color: var(--ink-700); }

/* Price widget */
.price-widget {
  background: linear-gradient(135deg, rgba(34, 197, 94, 0.10) 0%, rgba(16, 185, 129, 0.05) 100%);
  border-color: rgba(34, 197, 94, 0.30);
}
body.dark .price-widget { background: linear-gradient(135deg, rgba(34, 197, 94, 0.16) 0%, rgba(16, 185, 129, 0.08) 100%); border-color: rgba(34, 197, 94, 0.40); }
.price-label { color: var(--ink-700); }
.price-amount { color: var(--ink-900); }
.price-total .price-label { color: var(--ink-900); font-weight: 600; }
.price-total .price-amount { color: #15803d; }
body.dark .price-total .price-amount { color: #86efac; }

/* Status pills */
.status-pill.signed  { background: rgba(34, 197, 94, 0.14); color: #15803d; border-color: rgba(34, 197, 94, 0.40); }
.status-pill.booked  { background: rgba(79, 141, 247, 0.14); color: var(--accent); border-color: rgba(79, 141, 247, 0.40); }
.status-pill.pending { background: var(--bg-alt); color: var(--ink-500); border-color: var(--ink-200); }
body.dark .status-pill.signed  { color: #86efac; }
body.dark .status-pill.booked  { color: #c2dafd; }

/* Today's queue strip */
.today-queue {
  background: linear-gradient(135deg, rgba(251, 191, 36, 0.10) 0%, rgba(239, 68, 68, 0.05) 100%);
  border-color: rgba(251, 191, 36, 0.30);
}
body.dark .today-queue { background: linear-gradient(135deg, rgba(251, 191, 36, 0.16) 0%, rgba(239, 68, 68, 0.08) 100%); border-color: rgba(251, 191, 36, 0.45); }
.today-queue-title { color: #92400e; }
body.dark .today-queue-title { color: #fcd34d; }
.queue-card { background: rgba(255, 255, 255, 0.78); border-color: rgba(251, 191, 36, 0.30); }
body.dark .queue-card { background: rgba(24, 34, 56, 0.75); border-color: rgba(251, 191, 36, 0.40); }
.queue-card-count { color: #b45309; }
body.dark .queue-card-count { color: #fcd34d; }
.queue-card-label { color: var(--ink-900); }
.queue-card-sub { color: var(--ink-500); }

/* Command palette body text */
.cmdk-modal { background: var(--surface); border-color: var(--ink-200); }
#cmdk-input { color: var(--ink-900); }
.cmdk-result-label { color: var(--ink-900); }
.cmdk-result-sub   { color: var(--ink-400); }
.cmdk-section-label { color: var(--ink-500); }
.cmdk-empty { color: var(--ink-400); }
.cmdk-footer { background: var(--bg-alt); border-color: var(--ink-100); color: var(--ink-500); }
.cmdk-hint kbd, .cmdk-footer kbd { background: var(--bg-alt); border-color: var(--ink-200); color: var(--ink-700); }
.cmdk-result.active { background: rgba(79, 141, 247, 0.10); border-left-color: var(--accent); }
body.dark .cmdk-result.active { background: rgba(107, 161, 255, 0.18); border-left-color: var(--accent); }

/* Saved views dropdown */
.saved-views-menu-btn { background: var(--surface); border-color: var(--ink-200); color: var(--ink-700); }
.saved-views-dropdown { background: var(--surface); border-color: var(--ink-100); }
.saved-view-row .sv-name { color: var(--ink-900); }
.saved-view-row:hover { background: var(--bg-alt); }

/* Recent leads dropdown */
.recent-leads-dropdown { background: var(--surface); border-color: var(--ink-100); }
.recent-lead-name { color: var(--ink-900); }
.recent-lead-sub  { color: var(--ink-400); }
.recent-lead-row:hover { background: var(--bg-alt); }

/* btn-ghost in dark */
body.dark .btn-ghost { background: var(--surface); border-color: var(--ink-200); color: var(--ink-700); }
body.dark .btn-ghost:hover { background: var(--surface-hover); color: var(--ink-900); }
body.dark .btn-danger { color: #fca5a5; border-color: rgba(220, 38, 38, 0.30); }
body.dark .btn-danger:hover { background: rgba(220, 38, 38, 0.16); border-color: #fca5a5; }

/* Bulk bar (when it ships) */
.bulk-bar { background: var(--surface); border-color: var(--accent); }
.bulk-btn { background: var(--surface); border-color: var(--ink-200); color: var(--ink-700); }

/* Connector pills + form helpers */
body.dark .connector-pill { background: var(--surface-hover); border-color: var(--ink-200); color: var(--ink-900); }
body.dark .connector-pill .ck { color: var(--ink-400); }

/* GradeX repo list inside drawer */
.repo-list .repo-row { border-bottom: 1px solid var(--ink-100); }
.repo-row .repo-status.passing  { background: rgba(34, 197, 94, 0.14); color: #15803d; }
.repo-row .repo-status.holding  { background: rgba(251, 191, 36, 0.16); color: #b45309; }
.repo-row .repo-status.rejected { background: rgba(220, 38, 38, 0.14); color: #b91c1c; }
body.dark .repo-row .repo-status.passing  { color: #86efac; }
body.dark .repo-row .repo-status.holding  { color: #fcd34d; }
body.dark .repo-row .repo-status.rejected { color: #fca5a5; }

/* Scrollbar in dark */
body.dark ::-webkit-scrollbar-thumb { background: var(--ink-200) !important; }
body.dark ::-webkit-scrollbar-thumb:hover { background: var(--ink-300) !important; }

/* ════════════════════════════════════════════════════════════════════════
   Readability pass v3 (2026-06-05) — table density, type pills,
   Decision Fitness card legibility (light + dark), fact grid in dark.
   ════════════════════════════════════════════════════════════════════════ */

/* ── Table cells: bigger text, more padding, stronger zebra ────────── */
#grid tbody td,
#control-grid tbody td {
  padding: 13px 14px !important;
  font-size: 13.5px !important;
  line-height: 1.45 !important;
  color: var(--ink-900) !important;
}
#grid thead th,
#control-grid thead th {
  padding: 13px 14px !important;
  font-size: 11.5px !important;
}
#grid tbody tr:nth-child(even) td,
#control-grid tbody tr:nth-child(even) td {
  background: rgba(15, 23, 42, 0.025) !important;
}
body.dark #grid tbody tr:nth-child(even) td,
body.dark #control-grid tbody tr:nth-child(even) td {
  background: rgba(255, 255, 255, 0.035) !important;
}
#grid tbody tr:hover td,
#control-grid tbody tr:hover td {
  background: rgba(79, 141, 247, 0.10) !important;
}
body.dark #grid tbody tr:hover td,
body.dark #control-grid tbody tr:hover td {
  background: rgba(107, 161, 255, 0.16) !important;
}
.cell-name { font-size: 13.5px; font-weight: 600; }
.cell-email { font-size: 11.5px; }
.cell-context { font-size: 12.5px !important; line-height: 1.5 !important; color: var(--ink-700) !important; }
.cell-na { color: var(--ink-400) !important; font-style: italic; }

/* Table-wrap subtle elevation in light, dark-friendly border */
.table-wrap {
  background: var(--surface) !important;
  border: 1px solid var(--ink-100) !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04), 0 4px 12px -4px rgba(15, 23, 42, 0.06);
}
body.dark .table-wrap {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.40);
  border-color: var(--ink-200) !important;
}

/* ── Type pill: stronger contrast in both modes ──────────────────── */
.type-pill {
  font-size: 11px !important;
  padding: 4px 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
}
.type-Codebase, .type-Codebase-Modern {
  background: rgba(59, 130, 246, 0.14) !important;
  color: #1d4ed8 !important;
  border: 1px solid rgba(59, 130, 246, 0.45) !important;
}
body.dark .type-Codebase, body.dark .type-Codebase-Modern { color: #93c5fd !important; background: rgba(59, 130, 246, 0.22) !important; }
.type-Codebase-Legacy {
  background: rgba(245, 158, 11, 0.16) !important;
  color: #b45309 !important;
  border: 1px solid rgba(245, 158, 11, 0.50) !important;
}
body.dark .type-Codebase-Legacy { color: #fcd34d !important; background: rgba(245, 158, 11, 0.24) !important; }
.type-Legacy-Questionnaire {
  background: rgba(234, 88, 12, 0.14) !important;
  color: #c2410c !important;
  border: 1px solid rgba(234, 88, 12, 0.45) !important;
}
body.dark .type-Legacy-Questionnaire { color: #fdba74 !important; background: rgba(234, 88, 12, 0.24) !important; }
.type-Business-Data {
  background: rgba(190, 24, 93, 0.14) !important;
  color: #9d174d !important;
  border: 1px solid rgba(190, 24, 93, 0.45) !important;
}
body.dark .type-Business-Data { color: #f9a8d4 !important; background: rgba(190, 24, 93, 0.28) !important; }
.type-Referral {
  background: rgba(139, 92, 246, 0.14) !important;
  color: #6d28d9 !important;
  border: 1px solid rgba(139, 92, 246, 0.45) !important;
}
body.dark .type-Referral { color: #c4b5fd !important; background: rgba(139, 92, 246, 0.24) !important; }
.type-Unknown { background: var(--ink-50) !important; color: var(--ink-500) !important; border-color: var(--ink-200) !important; }

/* ── Row type tints in dark mode (the existing pastel rows blow out) ── */
body.dark tbody tr.r-Codebase,
body.dark tbody tr.r-Codebase-Modern { background: rgba(59, 130, 246, 0.04); }
body.dark tbody tr.r-Codebase-Legacy { background: rgba(245, 158, 11, 0.04); }
body.dark tbody tr.r-Legacy-Questionnaire { background: rgba(234, 88, 12, 0.04); }
body.dark tbody tr.r-Business-Data { background: rgba(190, 24, 93, 0.04); }
body.dark tbody tr.r-Referral { background: rgba(139, 92, 246, 0.04); }
body:not(.dark) tbody tr.r-Codebase,
body:not(.dark) tbody tr.r-Codebase-Modern { background: rgba(59, 130, 246, 0.03); }
body:not(.dark) tbody tr.r-Codebase-Legacy { background: rgba(245, 158, 11, 0.04); }
body:not(.dark) tbody tr.r-Legacy-Questionnaire { background: rgba(234, 88, 12, 0.04); }
body:not(.dark) tbody tr.r-Business-Data { background: rgba(190, 24, 93, 0.03); }
body:not(.dark) tbody tr.r-Referral { background: rgba(139, 92, 246, 0.03); }
body.dark tbody tr.stale-30d { opacity: 0.55; }

/* ── Decision Fitness card — real visual treatment, dark-safe ──────── */
.fitness-card {
  padding: 20px 22px !important;
  border-radius: 14px !important;
  border: 1.5px solid var(--ink-100) !important;
  background: linear-gradient(180deg, var(--bg-alt) 0%, var(--surface) 100%) !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05), 0 8px 24px -10px rgba(15, 23, 42, 0.10);
  position: relative;
  overflow: hidden;
  margin-bottom: 4px;
}
.fitness-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, #94a3b8 0%, #64748b 100%);
}

/* Score-specific card styling (light) */
.fitness-card.qualifying, .fitness-card.accept {
  border-color: rgba(34, 197, 94, 0.45) !important;
  background: linear-gradient(180deg, #ecfdf5 0%, #ffffff 60%) !important;
}
.fitness-card.qualifying::before, .fitness-card.accept::before {
  background: linear-gradient(90deg, #16a34a 0%, #10b981 100%);
}
.fitness-card.borderline, .fitness-card.on_hold {
  border-color: rgba(245, 158, 11, 0.55) !important;
  background: linear-gradient(180deg, #fffbeb 0%, #ffffff 60%) !important;
}
.fitness-card.borderline::before, .fitness-card.on_hold::before {
  background: linear-gradient(90deg, #f59e0b 0%, #f97316 100%);
}
.fitness-card.likely_reject, .fitness-card.reject {
  border-color: rgba(239, 68, 68, 0.50) !important;
  background: linear-gradient(180deg, #fef2f2 0%, #ffffff 60%) !important;
}
.fitness-card.likely_reject::before, .fitness-card.reject::before {
  background: linear-gradient(90deg, #dc2626 0%, #ef4444 100%);
}
/* Classification tiers — stand apart from the green/amber/red verdict scale.
   FCS violet, Research blue, Experimental purple (match the drawer toggles). */
.fitness-card.fcs {
  border-color: rgba(109, 40, 217, 0.45) !important;
  background: linear-gradient(180deg, #f5f3ff 0%, #ffffff 60%) !important;
}
.fitness-card.fcs::before { background: linear-gradient(90deg, #6d28d9 0%, #8b5cf6 100%); }
.fitness-card.research {
  border-color: rgba(13, 148, 136, 0.45) !important;
  background: linear-gradient(180deg, #f0fdfa 0%, #ffffff 60%) !important;
}
.fitness-card.research::before { background: linear-gradient(90deg, #0d9488 0%, #2dd4bf 100%); }
.fitness-card.experimental {
  border-color: rgba(234, 88, 12, 0.45) !important;
  background: linear-gradient(180deg, #fff7ed 0%, #ffffff 60%) !important;
}
.fitness-card.experimental::before { background: linear-gradient(90deg, #ea580c 0%, #fb923c 100%); }

/* Score-specific card styling (dark) — translucent overlays so text reads */
body.dark .fitness-card {
  background: linear-gradient(180deg, var(--bg-alt) 0%, var(--surface) 100%) !important;
  border-color: var(--ink-200) !important;
}
body.dark .fitness-card.qualifying, body.dark .fitness-card.accept {
  background: linear-gradient(180deg, rgba(22, 163, 74, 0.18) 0%, rgba(24, 34, 56, 0.95) 70%) !important;
  border-color: rgba(34, 197, 94, 0.55) !important;
}
body.dark .fitness-card.borderline, body.dark .fitness-card.on_hold {
  background: linear-gradient(180deg, rgba(245, 158, 11, 0.18) 0%, rgba(24, 34, 56, 0.95) 70%) !important;
  border-color: rgba(245, 158, 11, 0.55) !important;
}
body.dark .fitness-card.likely_reject, body.dark .fitness-card.reject {
  background: linear-gradient(180deg, rgba(220, 38, 38, 0.18) 0%, rgba(24, 34, 56, 0.95) 70%) !important;
  border-color: rgba(239, 68, 68, 0.55) !important;
}
body.dark .fitness-card.fcs {
  background: linear-gradient(180deg, rgba(139, 92, 246, 0.20) 0%, rgba(24, 34, 56, 0.95) 70%) !important;
  border-color: rgba(139, 92, 246, 0.55) !important;
}
body.dark .fitness-card.research {
  background: linear-gradient(180deg, rgba(20, 184, 166, 0.20) 0%, rgba(24, 34, 56, 0.95) 70%) !important;
  border-color: rgba(20, 184, 166, 0.55) !important;
}
body.dark .fitness-card.experimental {
  background: linear-gradient(180deg, rgba(251, 146, 60, 0.20) 0%, rgba(24, 34, 56, 0.95) 70%) !important;
  border-color: rgba(251, 146, 60, 0.55) !important;
}

.fitness-verdict { display: flex; align-items: center; gap: 12px; }
.fitness-icon { font-size: 26px; line-height: 1; filter: drop-shadow(0 1px 2px rgba(0,0,0,0.15)); }
.fitness-label {
  font-size: 19px !important;
  font-weight: 700 !important;
  color: var(--ink-900) !important;
  letter-spacing: -0.015em !important;
}
.fitness-reason {
  margin-top: 12px !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  color: var(--ink-700) !important;
}
body.dark .fitness-reason { color: var(--ink-600) !important; }

/* Verdict label color by tier */
.fitness-card.qualifying .fitness-label,
.fitness-card.accept .fitness-label { color: #15803d !important; }
.fitness-card.borderline .fitness-label,
.fitness-card.on_hold .fitness-label { color: #b45309 !important; }
.fitness-card.likely_reject .fitness-label,
.fitness-card.reject .fitness-label { color: #b91c1c !important; }
.fitness-card.fcs .fitness-label { color: #6d28d9 !important; }
body.dark .fitness-card.fcs .fitness-label { color: #c4b5fd !important; }
.fitness-card.research .fitness-label { color: #0d9488 !important; }
body.dark .fitness-card.research .fitness-label { color: #5eead4 !important; }
.fitness-card.experimental .fitness-label { color: #ea580c !important; }
body.dark .fitness-card.experimental .fitness-label { color: #fdba74 !important; }
body.dark .fitness-card.qualifying .fitness-label,
body.dark .fitness-card.accept .fitness-label { color: #86efac !important; }
body.dark .fitness-card.borderline .fitness-label,
body.dark .fitness-card.on_hold .fitness-label { color: #fcd34d !important; }
body.dark .fitness-card.likely_reject .fitness-label,
body.dark .fitness-card.reject .fitness-label { color: #fca5a5 !important; }

/* ── Fact grid — readable cards in dark ──────────────────────────── */
body.dark .fact {
  background: var(--surface-hover) !important;
  border-color: var(--ink-200) !important;
}
.fact-label { font-size: 10.5px !important; }
.fact-value { font-size: 14.5px !important; }
.fact-value.muted { color: var(--ink-400) !important; }

/* ── Connector pills + repo rows in dark ─────────────────────────── */
body.dark .connector-pill { background: var(--surface-hover) !important; border-color: var(--ink-200) !important; }
body.dark .repo-row { background: var(--surface-hover); border-color: var(--ink-200); }
.repo-row { padding: 9px 14px !important; font-size: 12.5px !important; }
.repo-name { font-size: 12.5px !important; font-weight: 600; }
.repo-meta { color: var(--ink-500) !important; }

/* ── Stats bar on Leads tab — better contrast ─────────────────────── */
.stat-card {
  padding: 11px 16px !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
body.dark .stat-card { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.30); }

/* ── Filter chips: bigger touch target + clearer text ─────────────── */
.chip {
  padding: 7px 14px !important;
  font-size: 12.5px !important;
}

/* ── Search input: larger, more visible ──────────────────────────── */
.search, .select {
  padding: 8px 12px !important;
  font-size: 13px !important;
}

/* ── Banner-info — better contrast in dark ────────────────────────── */
body.dark .banner-info {
  background: linear-gradient(135deg, rgba(254, 243, 199, 0.14) 0%, rgba(254, 249, 195, 0.08) 100%) !important;
  border-color: rgba(253, 230, 138, 0.40) !important;
  color: #fde68a !important;
}
.banner-info { padding: 13px 17px !important; font-size: 13px !important; }

/* ════════════════════════════════════════════════════════════════════════
   Dark mode v2 — dark.design inspiration (pure-black + white-opacity surfaces).
   Replaces the navy-tinted palette with the classic gallery aesthetic:
   - Background: pure black
   - Surfaces: rgba(255,255,255,X) overlays for elevation
   - Text hierarchy via opacity tiers, not lightness scale
   ════════════════════════════════════════════════════════════════════════ */
body.dark {
  /* Surfaces — pure black base + translucent-white overlays */
  --bg:            #000000;
  --bg-alt:        #0a0a0a;          /* near-black for slight separation */
  --surface:       rgba(255, 255, 255, 0.045);
  --surface-hover: rgba(255, 255, 255, 0.075);

  /* Text — pure white at descending opacities */
  --ink-900: rgba(255, 255, 255, 1.0);    /* primary */
  --ink-700: rgba(255, 255, 255, 0.78);   /* body */
  --ink-600: rgba(255, 255, 255, 0.68);
  --ink-500: rgba(255, 255, 255, 0.56);   /* labels */
  --ink-400: rgba(255, 255, 255, 0.40);   /* hints */
  --ink-300: rgba(255, 255, 255, 0.28);   /* icons */
  --ink-200: rgba(255, 255, 255, 0.12);   /* borders */
  --ink-100: rgba(255, 255, 255, 0.07);   /* dividers */
  --ink-50:  rgba(255, 255, 255, 0.035);  /* faint */

  --accent:        #6ba1ff;
  --accent-hover:  #93b8ff;
  --glass:         rgba(0, 0, 0, 0.80);
  --glass-border:  rgba(255, 255, 255, 0.08);
  --shadow-sm:     0 1px 2px rgba(0, 0, 0, 0.60);
  --shadow:        0 1px 3px rgba(0, 0, 0, 0.75);
  --shadow-md:     0 8px 24px -10px rgba(0, 0, 0, 0.80);
  --shadow-glass:  0 1px 3px rgba(0, 0, 0, 0.60), 0 24px 48px -16px rgba(0, 0, 0, 0.85);
  --shadow-drawer: -24px 0 64px -8px rgba(0, 0, 0, 0.85);
}

/* Force pure-black body in dark — no navy bleed */
body.dark { background: #000000 !important; color: var(--ink-900); }

/* Topbar — frosted black glass (dark.design's signature) */
body.dark .topbar {
  background: rgba(0, 0, 0, 0.85) !important;
  backdrop-filter: blur(24px) saturate(160%);
  border-bottom: 1px solid var(--ink-100);
}

/* Cards / surfaces use the new white-overlay tokens automatically.
   These rules override the v1 dark-mode rules that hardcoded surface hex. */
body.dark .kpi-card,
body.dark .funnel-stage,
body.dark .metric-card,
body.dark .filterbar,
body.dark .stat-card,
body.dark .page-intro,
body.dark .modal,
body.dark .drawer,
body.dark .cmdk-modal,
body.dark .saved-views-dropdown,
body.dark .recent-leads-dropdown,
body.dark .table-wrap {
  background: var(--surface) !important;
  border-color: var(--ink-200) !important;
  backdrop-filter: blur(8px);
}

/* Drawer header has its own sheet — slightly heavier overlay */
body.dark .drawer-header {
  background: rgba(255, 255, 255, 0.06) !important;
  border-bottom: 1px solid var(--ink-100);
}

/* Modal body / cmdk footer — slight tint */
body.dark .cmdk-footer { background: rgba(255, 255, 255, 0.025) !important; }

/* Topbar inputs / chips / buttons */
body.dark .form-field input,
body.dark .form-field select,
body.dark .form-field textarea,
body.dark .search,
body.dark .select,
body.dark .mark-touch-note {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: var(--ink-200) !important;
  color: var(--ink-900) !important;
}
body.dark .chip {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: var(--ink-200) !important;
}
body.dark .chip:hover { background: rgba(255, 255, 255, 0.08) !important; border-color: var(--accent) !important; color: var(--ink-900) !important; }
body.dark .chip.active { background: var(--accent) !important; color: #000 !important; }
body.dark .saved-views-menu-btn,
body.dark .btn-ghost {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: var(--ink-200) !important;
}
body.dark .btn-ghost:hover { background: rgba(255, 255, 255, 0.08) !important; }
body.dark .icon-btn {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--ink-200);
  color: var(--ink-700);
}
body.dark .icon-btn:hover { background: rgba(255, 255, 255, 0.10); color: #fff; }

/* Tables on pure black */
body.dark #grid thead th,
body.dark #control-grid thead th {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--ink-500) !important;
  border-bottom: 1px solid var(--ink-200) !important;
}
body.dark #grid tbody td,
body.dark #control-grid tbody td {
  color: var(--ink-900) !important;
  border-bottom: 1px solid var(--ink-100) !important;
  background: transparent !important;
}
body.dark #grid tbody tr:nth-child(even) td,
body.dark #control-grid tbody tr:nth-child(even) td {
  background: rgba(255, 255, 255, 0.020) !important;
}
body.dark #grid tbody tr:hover td,
body.dark #control-grid tbody tr:hover td {
  background: rgba(107, 161, 255, 0.10) !important;
}

/* Row-type tints in dark — barely-visible color hint */
body.dark tbody tr.r-Codebase,
body.dark tbody tr.r-Codebase-Modern { background: rgba(59, 130, 246, 0.035); }
body.dark tbody tr.r-Codebase-Legacy { background: rgba(245, 158, 11, 0.035); }
body.dark tbody tr.r-Legacy-Questionnaire { background: rgba(234, 88, 12, 0.035); }
body.dark tbody tr.r-Business-Data { background: rgba(236, 72, 153, 0.035); }
body.dark tbody tr.r-Referral { background: rgba(139, 92, 246, 0.035); }

/* Type pills — pastel-on-translucent (dark.design uses this pattern) */
body.dark .type-Codebase, body.dark .type-Codebase-Modern {
  background: rgba(59, 130, 246, 0.18) !important; color: #93c5fd !important;
  border: 1px solid rgba(59, 130, 246, 0.40) !important;
}
body.dark .type-Codebase-Legacy {
  background: rgba(245, 158, 11, 0.18) !important; color: #fde68a !important;
  border: 1px solid rgba(245, 158, 11, 0.40) !important;
}
body.dark .type-Legacy-Questionnaire {
  background: rgba(234, 88, 12, 0.18) !important; color: #fed7aa !important;
  border: 1px solid rgba(234, 88, 12, 0.40) !important;
}
body.dark .type-Business-Data {
  background: rgba(236, 72, 153, 0.22) !important; color: #fbcfe8 !important;
  border: 1px solid rgba(236, 72, 153, 0.45) !important;
}
body.dark .type-Referral {
  background: rgba(139, 92, 246, 0.20) !important; color: #ddd6fe !important;
  border: 1px solid rgba(139, 92, 246, 0.40) !important;
}
body.dark .type-Unknown {
  background: rgba(255, 255, 255, 0.05) !important; color: var(--ink-500) !important;
  border: 1px solid var(--ink-200) !important;
}

/* Decision Fitness card — on pure black, use colored overlay not gradient */
body.dark .fitness-card {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: var(--ink-200) !important;
}
body.dark .fitness-card.qualifying,
body.dark .fitness-card.accept {
  background: linear-gradient(180deg, rgba(34, 197, 94, 0.16) 0%, rgba(255, 255, 255, 0.04) 70%) !important;
  border-color: rgba(34, 197, 94, 0.45) !important;
}
body.dark .fitness-card.borderline,
body.dark .fitness-card.on_hold {
  background: linear-gradient(180deg, rgba(245, 158, 11, 0.16) 0%, rgba(255, 255, 255, 0.04) 70%) !important;
  border-color: rgba(245, 158, 11, 0.45) !important;
}
body.dark .fitness-card.likely_reject,
body.dark .fitness-card.reject {
  background: linear-gradient(180deg, rgba(220, 38, 38, 0.16) 0%, rgba(255, 255, 255, 0.04) 70%) !important;
  border-color: rgba(239, 68, 68, 0.45) !important;
}
body.dark .fitness-card.qualifying .fitness-label,
body.dark .fitness-card.accept .fitness-label { color: #86efac !important; }
body.dark .fitness-card.borderline .fitness-label,
body.dark .fitness-card.on_hold .fitness-label { color: #fde68a !important; }
body.dark .fitness-card.likely_reject .fitness-label,
body.dark .fitness-card.reject .fitness-label { color: #fca5a5 !important; }
body.dark .fitness-card .fitness-label { color: #ffffff !important; }
body.dark .fitness-card .fitness-reason { color: var(--ink-700) !important; }

/* Fact grid cards in dark — translucent overlays */
body.dark .fact {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: var(--ink-200) !important;
}
body.dark .fact-value { color: var(--ink-900) !important; }
body.dark .fact-label { color: var(--ink-500) !important; }

/* Connector pills, repo rows in dark */
body.dark .connector-pill,
body.dark .repo-row,
body.dark .inline-data-panel,
body.dark .meta-pill,
body.dark .reaction-btn {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: var(--ink-200) !important;
}
body.dark .meta-pill.active {
  background: rgba(107, 161, 255, 0.18) !important;
  border-color: var(--accent) !important;
  color: #c2dafd !important;
}
body.dark .reaction-btn.active { background: rgba(107, 161, 255, 0.22) !important; border-color: var(--accent) !important; }

/* Repo status badges (passing/holding/rejected) — translucent-on-black */
body.dark .repo-row .repo-status.passing  { background: rgba(34, 197, 94, 0.18); color: #86efac; }
body.dark .repo-row .repo-status.holding  { background: rgba(245, 158, 11, 0.18); color: #fcd34d; }
body.dark .repo-row .repo-status.rejected { background: rgba(220, 38, 38, 0.18); color: #fca5a5; }

/* Status pills */
body.dark .status-pill.signed  { background: rgba(34, 197, 94, 0.20) !important; color: #86efac !important; border-color: rgba(34, 197, 94, 0.45) !important; }
body.dark .status-pill.booked  { background: rgba(107, 161, 255, 0.20) !important; color: #c2dafd !important; border-color: rgba(107, 161, 255, 0.45) !important; }
body.dark .status-pill.pending { background: rgba(255, 255, 255, 0.05) !important; color: var(--ink-500) !important; border-color: var(--ink-200) !important; }

/* KPI delta pills */
body.dark .kpi-card .kpi-delta.up   { background: rgba(34, 197, 94, 0.22); color: #86efac; }
body.dark .kpi-card .kpi-delta.down { background: rgba(220, 38, 38, 0.22); color: #fca5a5; }
body.dark .kpi-card .kpi-delta.flat { background: rgba(255, 255, 255, 0.05); color: var(--ink-500); }

/* Today's queue strip — dim warm orange overlay on black */
body.dark .today-queue {
  background: linear-gradient(135deg, rgba(251, 191, 36, 0.10) 0%, rgba(239, 68, 68, 0.06) 100%) !important;
  border-color: rgba(251, 191, 36, 0.35) !important;
}
body.dark .today-queue-title { color: #fcd34d !important; }
body.dark .queue-card { background: rgba(255, 255, 255, 0.05) !important; border-color: rgba(251, 191, 36, 0.30) !important; }
body.dark .queue-card-count { color: #fcd34d !important; }

/* Funnel filter banner */
body.dark .funnel-filter-banner {
  background: linear-gradient(180deg, rgba(107, 161, 255, 0.16) 0%, rgba(107, 161, 255, 0.06) 100%) !important;
  border-color: rgba(107, 161, 255, 0.45) !important;
  color: #c2dafd !important;
}
body.dark .funnel-filter-banner .ff-chip { background: rgba(255, 255, 255, 0.06) !important; border-color: var(--ink-200) !important; color: var(--ink-700) !important; }

/* Banner-info (yellow "email not sent yet") */
body.dark .banner-info {
  background: linear-gradient(135deg, rgba(254, 243, 199, 0.08) 0%, rgba(254, 249, 195, 0.05) 100%) !important;
  border-color: rgba(253, 230, 138, 0.30) !important;
  color: #fde68a !important;
}

/* LLM upload card */
body.dark .llm-upload {
  background: linear-gradient(180deg, rgba(139, 92, 246, 0.12) 0%, rgba(124, 58, 237, 0.06) 100%) !important;
  border-color: rgba(139, 92, 246, 0.35) !important;
}
body.dark .llm-upload-title { color: #c4b5fd !important; }
body.dark .seed-grid .form-field input { background: rgba(255, 255, 255, 0.04) !important; }
body.dark .seed-grid .form-field label { color: #c4b5fd !important; }

/* Mark-touched row */
body.dark .mark-touch-row { background: rgba(255, 255, 255, 0.04) !important; border-color: var(--ink-200) !important; }

/* Status banners */
body.dark .status-banner.info { background: rgba(107, 161, 255, 0.14) !important; color: #c2dafd !important; border-color: rgba(107, 161, 255, 0.35) !important; }
body.dark .status-banner.error { background: rgba(220, 38, 38, 0.18) !important; color: #fca5a5 !important; border-color: rgba(220, 38, 38, 0.40) !important; }
body.dark .status-banner.success { background: rgba(34, 197, 94, 0.18) !important; color: #86efac !important; border-color: rgba(34, 197, 94, 0.40) !important; }

/* Count strip pill */
body.dark .count-inline { background: rgba(255, 255, 255, 0.06) !important; border-color: var(--ink-200) !important; color: var(--ink-700) !important; }

/* Topbar text + badge in dark */
body.dark .badge-count {
  background: rgba(107, 161, 255, 0.30) !important;
  border-color: rgba(107, 161, 255, 0.55) !important;
  color: #ffffff !important;
}

/* Page title gradient on dark — use background-image not shorthand */
body.dark .page-title {
  background-image: linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0.65) 100%) !important;
  background-color: transparent !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* Drawer title — bright white gradient */
body.dark #drawer-title {
  background-image: linear-gradient(135deg, #ffffff 0%, rgba(255, 255, 255, 0.65) 100%) !important;
  background-color: transparent !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* Charts bars - keep bright but on black */
body.dark .chart .bar-track { background: rgba(255, 255, 255, 0.05) !important; }

/* KPI card top-accent stripes stay bright */
body.dark .kpi-card::before { opacity: 0.95; }

/* Scrollbar in dark */
body.dark ::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.12) !important; border: 2px solid #000 !important; }
body.dark ::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.20) !important; }

/* Price widget on black */
body.dark .price-widget {
  background: linear-gradient(135deg, rgba(34, 197, 94, 0.14) 0%, rgba(16, 185, 129, 0.06) 100%) !important;
  border-color: rgba(34, 197, 94, 0.40) !important;
}
body.dark .price-total .price-amount { color: #86efac !important; }

/* Activity feed dotted line — white at low opacity */
body.dark .activity-entry { border-left-color: var(--ink-100) !important; }

/* Form labels in dark */
body.dark .form-field label { color: var(--ink-700) !important; }
body.dark .form-field label .field-hint { background: rgba(255, 255, 255, 0.06); color: var(--ink-500); }

/* Refresh button stays brand blue */
body.dark .btn-primary {
  background: linear-gradient(180deg, #6ba1ff 0%, #4f8df7 100%);
  color: #000;
  font-weight: 700;
}
body.dark .btn-primary:hover { background: linear-gradient(180deg, #93b8ff 0%, #6ba1ff 100%); }

/* GradeX button busy spinner */
.icon-btn.busy span {
  display: inline-block;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* Status banner: only render the box when .show is present (no empty box). */
.status-banner { display: none; }
.status-banner.show { display: block; }

/* Page intro — strip the redundant glass card framing. Title + subtitle now
   sit inline on the page background. */
.page-intro {
  margin: 22px 0 24px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

/* Higher-specificity override to beat body.dark .page-intro */
body .page-intro,
body.dark .page-intro {
  margin: 22px 0 24px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

/* ════════════════════════════════════════════════════════════════════════
   Wave 1B + Wave 2 styles
   ════════════════════════════════════════════════════════════════════════ */

/* ─── Multi-select checkbox column ──────────────────────────────────── */
.row-check { width: 30px !important; text-align: center; }
.row-check input { cursor: pointer; width: 14px; height: 14px; accent-color: var(--accent); }
tr.row-selected td { background: rgba(79, 141, 247, 0.12) !important; }
body.dark tr.row-selected td { background: rgba(107, 161, 255, 0.20) !important; }
.row-check-head { width: 30px !important; }
.row-check-head input { cursor: pointer; width: 14px; height: 14px; accent-color: var(--accent); }

/* ─── Bulk bar (already styled earlier — augment with action button polish) */
.bulk-btn-danger {
  background: rgba(220, 38, 38, 0.10) !important;
  color: #b91c1c !important;
  border-color: rgba(220, 38, 38, 0.30) !important;
}
.bulk-btn-danger:hover { background: rgba(220, 38, 38, 0.16) !important; }
body.dark .bulk-btn-danger { color: #fca5a5 !important; }

/* ─── Person-centric grouped view ──────────────────────────────────── */
.grouped-list {
  display: flex; flex-direction: column; gap: 10px;
}
/* View-mode toggle (Individual table <-> By-seller cards) on Leads/Control/QA.
   Without these, the `hidden` class JS toggles had no effect — there is no
   generic `.hidden{display:none}` — so a populated table could never be hidden
   and the toggle appeared one-directional (F-f). */
.table-wrap.hidden,
.grouped-list.hidden { display: none; }
.founder-card {
  background: var(--surface);
  border: 1px solid var(--ink-100);
  border-radius: 12px;
  padding: 14px 18px;
  cursor: pointer;
  transition: all var(--dur-fast) var(--ease);
}
.founder-card:hover { border-color: var(--accent); box-shadow: var(--shadow-md); }
.founder-card-head { display: flex; align-items: center; gap: 14px; }
.founder-card-name { font-size: 15px; font-weight: 600; color: var(--ink-900); }
.founder-card-meta { font-size: 12px; color: var(--ink-500); margin-top: 2px; }
.founder-card-counts { margin-left: auto; display: flex; gap: 6px; }
.founder-card-count {
  display: inline-flex; align-items: center;
  font-size: 11px; font-weight: 600;
  padding: 3px 9px; border-radius: 999px;
  background: var(--ink-50); color: var(--ink-700);
  border: 1px solid var(--ink-200);
}
.founder-card-submissions {
  margin-top: 10px; padding-top: 10px;
  border-top: 1px dashed var(--ink-100);
  display: none;
}
.founder-card.expanded .founder-card-submissions { display: block; }
.founder-card.expanded .founder-card-collapse { transform: rotate(90deg); }
.founder-card-collapse {
  font-size: 10px; color: var(--ink-400);
  transition: transform var(--dur-fast) var(--ease);
}
.sub-row {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 10px; margin-top: 4px;
  border-radius: 6px; font-size: 12.5px;
  cursor: pointer;
}
.sub-row:hover { background: var(--bg-alt); }
.sub-row-type { min-width: 130px; }
.sub-row-co { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sub-row-stage { min-width: 120px; flex-shrink: 0; }
.sub-row-date { color: var(--ink-500); font-size: 11.5px; margin-left: auto; }

/* ─── Asset Grade matrix (Modern board only) ───────────────────────
   Priority (P0/P1/P2) x GradeX Quality grid + drill list. Spec 2026-08-25. */
.asset-grade-panel {
  background: var(--surface);
  border: 1px solid var(--ink-100);
  border-radius: 12px;
  padding: 16px 18px;
  margin-bottom: 14px;
}
.asset-grade-panel.hidden { display: none; }
.asset-grade-title {
  font-size: 14px; font-weight: 700; color: var(--ink-900);
  margin-bottom: 6px;
}
.asset-grade-lead {
  font-size: 12.5px; line-height: 1.5; color: var(--ink-700);
  max-width: 900px; margin-bottom: 6px; font-weight: 600;
}
.asset-grade-bullets {
  list-style: disc; margin: 0 0 12px; padding-left: 18px;
  font-size: 12px; line-height: 1.6; color: var(--ink-500);
  max-width: 900px;
}
.asset-grade-bullets li { margin-bottom: 2px; }
.asset-grade-bullets strong { color: var(--ink-800); font-weight: 600; }
.asset-grade-grid {
  border-collapse: collapse;
  font-size: 12.5px;
  margin-bottom: 4px;
}
.asset-grade-grid th, .asset-grade-grid td {
  padding: 8px 16px;
  text-align: center;
  border: 1px solid var(--ink-100);
}
.asset-grade-grid th {
  color: var(--ink-500); font-weight: 600; text-transform: uppercase; font-size: 10.5px;
  background: var(--bg-alt);
}
.asset-grade-grid th:first-child, .asset-grade-grid td:first-child { text-align: left; }
.ag-cell {
  cursor: pointer;
  font-weight: 600;
  color: var(--ink-900);
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.ag-cell:hover { background: rgba(79, 141, 247, 0.10); }
.ag-cell.ag-selected {
  background: var(--accent);
  color: #fff;
}
.ag-cell.ag-selected:hover { background: var(--accent-hover); }
.ag-cell.ag-zero {
  cursor: default;
  color: var(--ink-300);
  background: var(--bg-alt);
}
.ag-cell.ag-zero:hover { background: var(--bg-alt); }
.ag-total { font-weight: 700; color: var(--ink-700); background: var(--bg-alt); }
.asset-grade-drill { margin-top: 14px; border-top: 1px solid var(--ink-100); padding-top: 12px; }
.ag-drill-head {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 12px; color: var(--ink-500); margin-bottom: 8px;
}
.ag-clear {
  padding: 4px 10px; font-size: 11.5px; font-weight: 600;
  border: 1px solid var(--ink-200); border-radius: 6px;
  background: var(--surface); color: var(--ink-700);
  cursor: pointer;
}
.ag-clear:hover { border-color: var(--accent); color: var(--accent); }
.ag-drill-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.ag-drill-table th, .ag-drill-table td {
  padding: 7px 12px; text-align: left; vertical-align: top;
  border-bottom: 1px solid var(--ink-200);
}
.ag-drill-table th { color: var(--ink-500); font-weight: 600; text-transform: uppercase; font-size: 10px; border-bottom-width: 2px; }
.ag-drill-data-row:hover td { background: rgba(79, 141, 247, 0.06); }
.ag-repo-cell { font-weight: 600; color: var(--ink-900); }
/* Seller section header: clear divider between groups. */
.ag-drill-seller-row td {
  background: var(--bg-alt);
  padding: 9px 12px;
  border-top: 2px solid var(--ink-200);
  border-bottom: 1px solid var(--ink-200);
  border-left: 3px solid var(--accent);
}
.ag-seller-name { font-weight: 700; color: var(--ink-900); font-size: 12.5px; }
.ag-seller-count { color: var(--ink-500); font-weight: 500; font-size: 11px; }

/* ─── Kanban board ──────────────────────────────────────────────── */
.kanban-board {
  display: grid;
  grid-template-columns: repeat(7, minmax(220px, 1fr));
  gap: 12px;
  overflow-x: auto;
  padding: 4px;
  align-items: start;
}
.kanban-col {
  background: var(--surface);
  border: 1px solid var(--ink-100);
  border-radius: 12px;
  min-height: 200px;
  display: flex; flex-direction: column;
  transition: all var(--dur-fast) var(--ease);
}
.kanban-col.drop-target { border-color: var(--accent); background: rgba(79, 141, 247, 0.08); }
body.dark .kanban-col.drop-target { background: rgba(107, 161, 255, 0.10); }
.kanban-col-head {
  padding: 12px 14px;
  border-bottom: 1px solid var(--ink-100);
  display: flex; align-items: center; justify-content: space-between;
  font-size: 11.5px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.5px; color: var(--ink-500);
}
.kanban-col-head .kanban-count {
  font-size: 11px; font-weight: 700;
  background: var(--ink-50); color: var(--ink-700);
  padding: 2px 7px; border-radius: 999px;
}
.kanban-col-body {
  padding: 10px;
  display: flex; flex-direction: column; gap: 8px;
  max-height: calc(100vh - 280px); overflow-y: auto;
}
.kanban-card {
  background: var(--bg-alt);
  border: 1px solid var(--ink-100);
  border-radius: 8px;
  padding: 10px 12px;
  cursor: grab;
  transition: all var(--dur-fast) var(--ease);
}
.kanban-card:hover { border-color: var(--accent); transform: translateY(-1px); box-shadow: var(--shadow-sm); }
.kanban-card.dragging { opacity: 0.5; cursor: grabbing; }
.kanban-card-name { font-size: 12.5px; font-weight: 600; color: var(--ink-900); line-height: 1.3; }
.kanban-card-company { font-size: 11px; color: var(--ink-500); margin-top: 2px; }
.kanban-card-foot {
  margin-top: 8px;
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  font-size: 10px; color: var(--ink-400);
}
/* A5 — notes marker: sits with the age at the right edge of the foot. */
.kanban-card-note-flag { margin-left: auto; font-size: 11px; line-height: 1; cursor: default; }
.kanban-card-note-flag + .kanban-card-age { margin-left: 0; }

/* A5 — free-text notes editor in the lead drawer. */
.drawer-notes-input {
  width: 100%; box-sizing: border-box; resize: vertical; min-height: 76px;
  padding: 8px 10px; font: inherit; font-size: 13px; line-height: 1.45;
  border: 1px solid var(--ink-200); border-radius: 8px;
  background: var(--surface); color: var(--ink-900);
}
.drawer-notes-input:focus { outline: none; border-color: var(--accent); }
body.dark .drawer-notes-input { background: var(--surface); border-color: var(--ink-200); color: var(--ink-900); }
/* A2 — decision-fitness badge on the card face. Colors mirror the drawer's
   .fitness-label so the badge reads as the same verdict, at a glance. */
.kanban-card-badge {
  display: inline-block;
  margin-top: 6px;
  padding: 1px 7px;
  border-radius: 999px;
  font-size: 9.5px; font-weight: 700; letter-spacing: 0.02em;
  line-height: 1.6;
  border: 1px solid transparent;
}
.kanban-card-badge--fcs { color: #fff; background: #7c3aed; border-color: #7c3aed; }
.kanban-card-badge--fcs::before { content: '★ '; }
.kanban-card-badge--research { color: #fff; background: #0d9488; border-color: #0d9488; }
.kanban-card-badge--research::before { content: '◈ '; }
.kanban-card-badge--experimental { color: #fff; background: #ea580c; border-color: #ea580c; }
.kanban-card-badge--experimental::before { content: '⚗ '; }
.kanban-card-badge--qualified { color: #15803d; background: #f0fdf4; border-color: rgba(22,163,74,0.35); }
.kanban-card-badge--review { color: #b45309; background: #fffbeb; border-color: rgba(245,158,11,0.35); }
.kanban-card-badge--not-qualified { color: #b91c1c; background: #fef2f2; border-color: rgba(220,38,38,0.35); }
body.dark .kanban-card-badge--fcs { color: #fff; background: #7c3aed; border-color: #8b5cf6; }
body.dark .kanban-card-badge--research { color: #fff; background: #0d9488; border-color: #14b8a6; }
body.dark .kanban-card-badge--experimental { color: #fff; background: #ea580c; border-color: #fb923c; }
body.dark .kanban-card-badge--qualified { color: #4ade80; background: rgba(22,163,74,0.12); border-color: rgba(22,163,74,0.4); }
body.dark .kanban-card-badge--review { color: #fbbf24; background: rgba(245,158,11,0.12); border-color: rgba(245,158,11,0.4); }
body.dark .kanban-card-badge--not-qualified { color: #f87171; background: rgba(220,38,38,0.12); border-color: rgba(220,38,38,0.4); }

/* A2 — compact classification chip (★ FCS / ◈ Research / ⚗ Experimental), the
   live output of the drawer toggles, reused on every dense surface (tables,
   cmdk, QA, recent) so the class is legible without opening the drawer. Colors
   match the drawer classification toggles. Icon per variant via ::before. */
.class-chip {
  display: inline-block;
  margin-left: 6px;
  padding: 0 6px;
  border-radius: 999px;
  font-size: 9px; font-weight: 700; letter-spacing: 0.03em;
  line-height: 1.7; vertical-align: middle;
  border: 1px solid transparent;
  white-space: nowrap;
}
/* Solid fills in three far-apart hues so the classes are unmistakable at a
   glance: FCS violet, Research teal, Experimental orange. */
.class-chip--fcs { color: #fff; background: #7c3aed; border-color: #7c3aed; }
.class-chip--fcs::before { content: '★ '; }
.class-chip--research { color: #fff; background: #0d9488; border-color: #0d9488; }
.class-chip--research::before { content: '◈ '; }
.class-chip--experimental { color: #fff; background: #ea580c; border-color: #ea580c; }
.class-chip--experimental::before { content: '⚗ '; }
.class-chip--dev-shop { color: #fff; background: #475569; border-color: #475569; }
body.dark .class-chip--fcs { color: #fff; background: #7c3aed; border-color: #8b5cf6; }
body.dark .class-chip--research { color: #fff; background: #0d9488; border-color: #14b8a6; }
body.dark .class-chip--experimental { color: #fff; background: #ea580c; border-color: #fb923c; }
body.dark .class-chip--dev-shop { color: #fff; background: #64748b; border-color: #94a3b8; }

/* color the column accents to match funnel-stage colors
   (stage keys = the three derive.js board column sets: new, qualifying,
   warm_hold, sampling, in_qa, qa_passed, accepted, gradex_review,
   purchased, closed) */
.kanban-col[data-stage="new"]           .kanban-col-head { color: #64748b; }
.kanban-col[data-stage="qualifying"]    .kanban-col-head { color: #6366f1; }
.kanban-col[data-stage="warm_hold"]     .kanban-col-head { color: #f59e0b; }
.kanban-col[data-stage="sampling"]      .kanban-col-head { color: #14b8a6; }
.kanban-col[data-stage="research_task"] .kanban-col-head { color: #0d9488; }
.kanban-col[data-stage="research_task"] .kanban-col-head span:first-child::before { content: '◈ '; }
.kanban-card--locked { cursor: default; }
.kanban-col[data-stage="in_qa"]         .kanban-col-head { color: #3b82f6; }
.kanban-col[data-stage="qa_loi"]        .kanban-col-head { color: #7c3aed; }
.kanban-col[data-stage="qa_passed"]     .kanban-col-head { color: #22c55e; }
.kanban-col[data-stage="accepted"]      .kanban-col-head { color: #16a34a; }
.kanban-col[data-stage="gradex_review"] .kanban-col-head { color: #8b5cf6; }
.kanban-col[data-stage="purchased"]     .kanban-col-head { color: #10b981; }
.kanban-col[data-stage="closed"]        .kanban-col-head { color: #71717a; }
body.dark .kanban-col[data-stage="qualifying"] .kanban-col-head { color: #a5b4fc; }
body.dark .kanban-col[data-stage="warm_hold"] .kanban-col-head { color: #fcd34d; }
body.dark .kanban-col[data-stage="qa_loi"] .kanban-col-head { color: #c4b5fd; }
body.dark .kanban-col[data-stage="sampling"] .kanban-col-head { color: #5eead4; }
body.dark .kanban-col[data-stage="in_qa"] .kanban-col-head { color: #93c5fd; }
body.dark .kanban-col[data-stage="qa_passed"] .kanban-col-head { color: #4ade80; }
body.dark .kanban-col[data-stage="accepted"] .kanban-col-head { color: #86efac; }
body.dark .kanban-col[data-stage="gradex_review"] .kanban-col-head { color: #c4b5fd; }
body.dark .kanban-col[data-stage="purchased"] .kanban-col-head { color: #86efac; }

/* ─── Research Tasks tab ─────────────────────────────────────────────── */
.research-stage-board { }
/* Per-stage accent for the independent research funnel (mirrors the main board). */
#research-stage-board .kanban-col[data-stage="new"]         .kanban-col-head { color: var(--ink-500); }
#research-stage-board .kanban-col[data-stage="interested"]  .kanban-col-head { color: #6366f1; }
#research-stage-board .kanban-col[data-stage="sampling"]    .kanban-col-head { color: #14b8a6; }
#research-stage-board .kanban-col[data-stage="in_qa"]       .kanban-col-head { color: #3b82f6; }
#research-stage-board .kanban-col[data-stage="qa_approved"] .kanban-col-head { color: #22c55e; }
#research-stage-board .kanban-col[data-stage="warm_hold"]   .kanban-col-head { color: #f59e0b; }
#research-stage-board .kanban-col[data-stage="rejected"]    .kanban-col-head { color: #71717a; }
body.dark #research-stage-board .kanban-col[data-stage="interested"]  .kanban-col-head { color: #a5b4fc; }
body.dark #research-stage-board .kanban-col[data-stage="sampling"]    .kanban-col-head { color: #5eead4; }
body.dark #research-stage-board .kanban-col[data-stage="in_qa"]       .kanban-col-head { color: #93c5fd; }
body.dark #research-stage-board .kanban-col[data-stage="qa_approved"] .kanban-col-head { color: #4ade80; }
body.dark #research-stage-board .kanban-col[data-stage="warm_hold"]   .kanban-col-head { color: #fcd34d; }

.research-section-head {
  display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap;
  margin: 0 0 12px; padding-bottom: 6px; border-bottom: 1px solid var(--ink-100);
}
.research-section-title {
  font-size: 12px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.6px; color: var(--ink-700);
}
.research-section-head .page-sub { margin: 0; font-size: 12px; }

.research-domain-grid {
  display: grid; gap: 12px;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
}
.research-domain-col {
  background: var(--surface); border: 1px solid var(--ink-100);
  border-radius: 12px; display: flex; flex-direction: column; min-height: 90px;
  transition: all var(--dur-fast) var(--ease);
}
.research-domain-col.drop-target { border-color: var(--accent); background: rgba(79, 141, 247, 0.08); }
body.dark .research-domain-col.drop-target { background: rgba(107, 161, 255, 0.10); }
.research-domain-head {
  padding: 10px 12px; border-bottom: 1px solid var(--ink-100);
  display: flex; align-items: center; justify-content: space-between;
  font-size: 11.5px; font-weight: 700; letter-spacing: 0.3px; color: var(--ink-700);
}
.research-domain-head .kanban-count {
  font-size: 11px; font-weight: 700; background: var(--ink-50);
  color: var(--ink-700); padding: 2px 7px; border-radius: 999px;
}
.research-domain-body {
  padding: 10px; display: flex; flex-direction: column; gap: 8px;
  max-height: 340px; overflow-y: auto;
}
.research-domain-col[data-domain="finance"]      .research-domain-head { color: #16a34a; }
.research-domain-col[data-domain="legal"]        .research-domain-head { color: #7c3aed; }
.research-domain-col[data-domain="healthcare"]   .research-domain-head { color: #e11d48; }
.research-domain-col[data-domain="design"]       .research-domain-head { color: #d97706; }
.research-domain-col[data-domain="construction"] .research-domain-head { color: #0891b2; }
.research-domain-col[data-domain="devtools"]     .research-domain-head { color: #2563eb; }

.research-domain-select {
  cursor: pointer; font: inherit; font-size: 11px;
  padding: 3px 6px; border-radius: 999px;
  border: 1px solid var(--ink-200); background: var(--surface); color: var(--ink-700);
}
.research-domain-select.auto { border-style: dashed; color: var(--ink-500); }

/* ─── @mentions bell ─────────────────────────────────────────────── */
.bell-btn { position: relative; }
.bell-count {
  position: absolute; top: -2px; right: -2px;
  min-width: 14px; height: 14px;
  background: #dc2626; color: #ffffff;
  font-size: 9px; font-weight: 700;
  border-radius: 999px; padding: 0 4px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 2px solid var(--navy-900);
}
.bell-count.hidden { display: none; }
.bell-dropdown {
  position: fixed; top: 64px; right: 16px;
  width: min(380px, 90vw); max-height: 70vh; overflow-y: auto;
  background: var(--surface); border: 1px solid var(--ink-200);
  border-radius: 12px;
  box-shadow: 0 24px 60px -16px rgba(15, 23, 42, 0.30);
  z-index: 95;
}
.bell-dropdown.hidden { display: none; }
.bell-dropdown-head {
  padding: 12px 16px; border-bottom: 1px solid var(--ink-100);
  display: flex; align-items: center; justify-content: space-between;
  font-size: 13px; font-weight: 600; color: var(--ink-900);
}
.bell-dropdown-empty {
  padding: 24px; text-align: center; font-size: 12.5px; color: var(--ink-400);
}
.mention-row {
  display: flex; flex-direction: column; gap: 4px;
  padding: 12px 16px; border-bottom: 1px solid var(--ink-100);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease);
}
.mention-row:hover { background: var(--bg-alt); }
.mention-row:last-child { border-bottom: none; }
.mention-meta { font-size: 11px; color: var(--ink-400); }
.mention-snippet { font-size: 12.5px; color: var(--ink-700); line-height: 1.4; }
.mention-snippet .mention-tag { color: var(--accent); font-weight: 600; }
body.dark .mention-row:hover { background: rgba(255, 255, 255, 0.05); }

/* ─── Anomaly strip on Overview ─────────────────────────────────── */
.anomaly-strip {
  margin-bottom: 22px;
  padding: 14px 20px;
  background: linear-gradient(135deg, rgba(79, 141, 247, 0.10) 0%, rgba(139, 92, 246, 0.06) 100%);
  border: 1px solid rgba(79, 141, 247, 0.30);
  border-left: 4px solid var(--accent);
  border-radius: 10px;
  display: flex; flex-direction: column; gap: 8px;
}
.anomaly-strip.hidden { display: none; }
body.dark .anomaly-strip {
  background: linear-gradient(135deg, rgba(107, 161, 255, 0.16) 0%, rgba(139, 92, 246, 0.10) 100%);
  border-color: rgba(107, 161, 255, 0.40);
}
.anomaly-title { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; color: var(--accent); }
.anomaly-row { font-size: 13px; color: var(--ink-900); display: flex; gap: 8px; align-items: baseline; }
.anomaly-row .anomaly-delta { font-weight: 700; font-variant-numeric: tabular-nums; }
.anomaly-row .anomaly-delta.up { color: #15803d; }
.anomaly-row .anomaly-delta.down { color: #b91c1c; }
body.dark .anomaly-row .anomaly-delta.up { color: #86efac; }
body.dark .anomaly-row .anomaly-delta.down { color: #fca5a5; }

/* ─── Cohort retention table ─────────────────────────────────────── */
.cohort-table {
  display: grid;
  font-size: 11.5px;
  border: 1px solid var(--ink-100);
  border-radius: 8px;
  overflow: hidden;
  background: var(--bg-alt);
}
.cohort-row {
  display: grid;
  grid-template-columns: 130px repeat(6, 1fr);
  border-bottom: 1px solid var(--ink-100);
}
.cohort-row:last-child { border-bottom: none; }
.cohort-row.head { background: var(--surface); font-weight: 700; color: var(--ink-500); }
.cohort-cell {
  padding: 8px 10px;
  border-right: 1px solid var(--ink-100);
  font-variant-numeric: tabular-nums;
  text-align: center;
}
.cohort-cell:last-child { border-right: none; }
.cohort-cell.label { text-align: left; font-weight: 500; color: var(--ink-700); }
.cohort-cell.empty { color: var(--ink-300); }
/* heatmap intensity (0-100) */
.cohort-cell.heat-0  { background: transparent; color: var(--ink-300); }
.cohort-cell.heat-1  { background: rgba(34, 197, 94, 0.06); color: var(--ink-700); }
.cohort-cell.heat-2  { background: rgba(34, 197, 94, 0.14); color: var(--ink-900); }
.cohort-cell.heat-3  { background: rgba(34, 197, 94, 0.24); color: var(--ink-900); }
.cohort-cell.heat-4  { background: rgba(34, 197, 94, 0.36); color: #064e3b; }
.cohort-cell.heat-5  { background: rgba(34, 197, 94, 0.50); color: #022c22; font-weight: 600; }
body.dark .cohort-cell.heat-4 { color: #86efac; }
body.dark .cohort-cell.heat-5 { color: #d1fae5; }

/* ─── Template editor in drawer ──────────────────────────────────── */
.template-editor { margin-top: 10px; }
.template-editor textarea {
  width: 100%; min-height: 110px; resize: vertical;
  padding: 12px 14px;
  background: var(--bg-alt);
  border: 1px solid var(--ink-200);
  border-radius: 8px;
  font: inherit; font-size: 12.5px; line-height: 1.5;
  color: var(--ink-900);
}
.template-editor textarea:focus { outline: none; border-color: var(--accent); }
.template-editor-actions {
  display: flex; gap: 8px; margin-top: 8px;
  justify-content: flex-end;
}
.template-editor-actions button {
  font-size: 11.5px; padding: 6px 12px;
}
.template-editor .template-meta {
  font-size: 11px; color: var(--ink-400);
  margin-bottom: 6px;
}

/* ─── Onboarding name prompt (one-time) ─────────────────────────────── */
.onboard-overlay {
  position: fixed; inset: 0;
  background: rgba(0, 0, 0, 0.75);
  backdrop-filter: blur(12px);
  z-index: 99;
}
.onboard-overlay.hidden { display: none; }
.onboard-modal {
  position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: min(460px, 92vw);
  background: var(--surface);
  border: 1px solid var(--ink-200);
  border-radius: 16px;
  padding: 32px 32px 24px;
  z-index: 100;
  box-shadow: 0 40px 80px -20px rgba(0, 0, 0, 0.50),
              0 4px 12px rgba(0, 0, 0, 0.15);
  animation: onboard-in 320ms var(--ease-out);
  text-align: center;
}
.onboard-modal.hidden { display: none; }
@keyframes onboard-in {
  0% { opacity: 0; transform: translate(-50%, calc(-50% + 12px)) scale(0.96); }
  100% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}
.onboard-mark {
  font-size: 38px; line-height: 1; color: var(--accent);
  filter: drop-shadow(0 0 16px rgba(79, 141, 247, 0.55));
  margin-bottom: 14px;
}
.onboard-title {
  margin: 0 0 8px;
  font-size: 22px; font-weight: 700;
  letter-spacing: -0.02em; color: var(--ink-900);
}
.onboard-sub {
  margin: 0 0 22px;
  font-size: 13.5px; line-height: 1.55; color: var(--ink-500);
}
.onboard-input-wrap { margin-bottom: 16px; }
#onboard-name {
  width: 100%; padding: 12px 14px;
  font: inherit; font-size: 15px;
  background: var(--bg-alt); border: 1px solid var(--ink-200);
  border-radius: 10px; color: var(--ink-900);
  text-align: center;
}
#onboard-name:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(79, 141, 247, 0.18); }
body.dark #onboard-name { background: rgba(255, 255, 255, 0.04); }
.onboard-submit { width: 100%; padding: 11px 18px !important; font-size: 14px !important; }
.onboard-foot { margin: 12px 0 0; font-size: 11.5px; color: var(--ink-400); }

.activity-actor { color: var(--accent); font-weight: 500; font-size: 11px; }

/* ─── Multi-file staged list + batch review pane ─────────────────── */
.file-list {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-top: 10px;
}
.file-list:empty { display: none; }
.file-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 9px;
  background: rgba(139, 92, 246, 0.10);
  border: 1px solid rgba(139, 92, 246, 0.30);
  border-radius: 999px;
  font-size: 11.5px;
  color: #6d28d9;
}
body.dark .file-chip { color: #c4b5fd; background: rgba(139, 92, 246, 0.18); }
.file-chip-x {
  background: none; border: none; cursor: pointer;
  font-size: 14px; color: inherit; padding: 0; line-height: 1;
}
.file-chip-x:hover { opacity: 0.6; }

.batch-review {
  margin-top: 14px;
  padding: 14px;
  background: linear-gradient(180deg, rgba(79, 141, 247, 0.06) 0%, rgba(79, 141, 247, 0.02) 100%);
  border: 1px solid rgba(79, 141, 247, 0.30);
  border-radius: 10px;
}
body.dark .batch-review {
  background: linear-gradient(180deg, rgba(107, 161, 255, 0.10) 0%, rgba(107, 161, 255, 0.04) 100%);
  border-color: rgba(107, 161, 255, 0.35);
}
.batch-review.hidden { display: none; }
.batch-review-head { margin-bottom: 12px; }
.batch-review-title { display: block; font-size: 12.5px; font-weight: 700; color: var(--accent); text-transform: uppercase; letter-spacing: 0.4px; }
.batch-review-sub { display: block; font-size: 11.5px; color: var(--ink-500); margin-top: 3px; }
.batch-row {
  display: grid;
  grid-template-columns: 22px 1.5fr 1fr 1.5fr auto;
  gap: 8px; align-items: center;
  padding: 8px 0;
  border-bottom: 1px dashed var(--ink-100);
}
.batch-row:last-child { border-bottom: none; }
.batch-row-num {
  font-size: 11px; font-weight: 700; color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
.batch-row input, .batch-row select {
  width: 100%;
  padding: 6px 9px;
  background: var(--surface);
  border: 1px solid var(--ink-200);
  border-radius: 6px;
  font: inherit; font-size: 12px; color: var(--ink-900);
}
body.dark .batch-row input, body.dark .batch-row select { background: rgba(255, 255, 255, 0.04); }
.batch-row input:focus, .batch-row select:focus { outline: none; border-color: var(--accent); }
.batch-row-del {
  background: none; border: 1px solid var(--ink-200);
  width: 24px; height: 24px;
  border-radius: 6px; cursor: pointer;
  font-size: 12px; color: var(--ink-500);
  display: inline-flex; align-items: center; justify-content: center;
}
.batch-row-del:hover { border-color: var(--red); color: var(--red); }
.batch-row.row-error { background: rgba(220, 38, 38, 0.06); }
.batch-row.row-success { opacity: 0.5; }
.batch-row .batch-row-status {
  font-size: 10.5px; color: var(--ink-400);
  grid-column: 2 / -1; padding-left: 0;
}
.batch-review-actions {
  display: flex; gap: 8px; justify-content: flex-end;
  margin-top: 12px;
}

/* ─── Batch card v2: richer per-file fields ──────────────────────── */
.batch-card {
  background: var(--surface);
  border: 1px solid var(--ink-100);
  border-radius: 10px;
  padding: 14px 16px;
  margin-bottom: 10px;
}
body.dark .batch-card { background: rgba(255, 255, 255, 0.03); border-color: var(--ink-200); }
.batch-card.row-error { border-color: var(--red-light); background: rgba(220, 38, 38, 0.05); }
.batch-card-head {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px dashed var(--ink-100);
}
.batch-card-file {
  flex: 1;
  font-size: 11.5px; color: var(--ink-500);
  font-family: var(--font-mono);
}
.batch-card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 10px;
}
.batch-field { display: flex; flex-direction: column; gap: 4px; }
.batch-field-label {
  font-size: 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.5px;
  color: var(--ink-500);
  margin-top: 6px;
}
.batch-input, .batch-textarea {
  width: 100%;
  padding: 7px 10px;
  background: var(--bg-alt);
  border: 1px solid var(--ink-200);
  border-radius: 6px;
  font: inherit; font-size: 12.5px; color: var(--ink-900);
}
body.dark .batch-input,
body.dark .batch-textarea { background: rgba(255, 255, 255, 0.04); }
.batch-input:focus, .batch-textarea:focus { outline: none; border-color: var(--accent); }
.batch-textarea { font-family: inherit; line-height: 1.4; resize: vertical; min-height: 38px; }

@media (max-width: 720px) {
  .batch-card-grid { grid-template-columns: 1fr; }
}

/* File chip status variants */
.file-chip.chip-busy {
  background: rgba(245, 158, 11, 0.16);
  border-color: rgba(245, 158, 11, 0.50);
  color: #b45309;
}
body.dark .file-chip.chip-busy { color: #fcd34d; background: rgba(245, 158, 11, 0.20); }
.file-chip.chip-done {
  background: rgba(34, 197, 94, 0.14);
  border-color: rgba(34, 197, 94, 0.45);
  color: #15803d;
}
body.dark .file-chip.chip-done { color: #86efac; background: rgba(34, 197, 94, 0.20); }
.file-chip.chip-err {
  background: rgba(220, 38, 38, 0.14);
  border-color: rgba(220, 38, 38, 0.45);
  color: #b91c1c;
}
body.dark .file-chip.chip-err { color: #fca5a5; background: rgba(220, 38, 38, 0.20); }

/* Removed the parse-button row; use a clean stacked layout */
.llm-upload-row-v2 {
  display: grid; grid-template-columns: 1fr; gap: 8px;
}
.llm-upload-row-v2 input[type="file"] {
  font-size: 12px; padding: 6px 8px;
  border: 1px solid var(--ink-200);
  background: var(--surface);
  border-radius: 6px; cursor: pointer;
}
body.dark .llm-upload-row-v2 input[type="file"] { background: rgba(255, 255, 255, 0.04); }
.llm-upload-row-v2 input[type="text"] {
  padding: 8px 11px;
  background: var(--surface);
  border: 1px solid var(--ink-200);
  border-radius: 6px;
  font: inherit; font-size: 12.5px; color: var(--ink-900);
}
body.dark .llm-upload-row-v2 input[type="text"] { background: rgba(255, 255, 255, 0.04); }
.llm-upload-row-v2 input[type="text"]:focus { outline: none; border-color: var(--accent); }

/* ═══ QA tab ═══════════════════════════════════════════════════════════ */
.qa-section-title {
  font-size: 15px; font-weight: 650; color: var(--ink-900);
  display: flex; align-items: center; gap: 9px; margin: 0 0 12px;
}
.qa-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.qa-dot-bd { background: var(--purple); }
.qa-dot-legacy { background: var(--t-codebase); }
.qa-section-count {
  font-size: 12px; font-weight: 600; color: var(--ink-400);
  background: var(--bg-alt); border-radius: 10px; padding: 1px 9px;
}
/* Fixed layout so the <colgroup> widths apply and Stage/Verdict stay readable. */
.qa-table { table-layout: fixed; width: 100%; }
.qa-table th, .qa-table td { vertical-align: top; overflow: hidden; }
.qa-table td > select, .qa-table td > .qa-input, .qa-table td > input { width: 100%; box-sizing: border-box; max-width: 100%; }
.qa-table .qa-company, .qa-table .qa-founder, .qa-table .qa-shared { overflow-wrap: anywhere; }
.qa-company { font-weight: 600; color: var(--ink-900); }
.muted-text, .qa-founder, .qa-shared { color: var(--ink-400); font-size: 11.5px; }
.qa-shared { font-size: 10.5px; margin-top: 2px; }
.qa-input {
  width: 100%; box-sizing: border-box; padding: 5px 7px;
  border: 1px solid var(--ink-200); border-radius: 6px;
  font: inherit; font-size: 12px; color: var(--ink-900); background: var(--surface);
  resize: vertical;
}
.qa-input:focus { outline: none; border-color: var(--accent); }
.qa-date { min-width: 130px; }
body.dark .qa-input { background: rgba(255,255,255,0.04); color: #e8eefb; border-color: rgba(255,255,255,0.12); }

/* Coloured selects (left accent bar) */
.qa-prio-P0 { border-left: 4px solid var(--red); }
.qa-prio-P1 { border-left: 4px solid var(--amber); }
.qa-prio-P2 { border-left: 4px solid var(--t-codebase); }
.qa-prio-P3 { border-left: 4px solid var(--ink-300); }
.qa-stage-blocking { border-left: 4px solid var(--red); }
.qa-stage-in_progress { border-left: 4px solid var(--amber); }
.qa-stage-received { border-left: 4px solid var(--t-codebase); }
.qa-stage-done { border-left: 4px solid var(--green); }
.qa-verdict-accept { border-left: 4px solid var(--green); }
.qa-verdict-reject { border-left: 4px solid var(--red); }
.qa-verdict-partial { border-left: 4px solid var(--amber); }
.qa-verdict-pending { border-left: 4px solid var(--ink-300); }

.qa-row-done { opacity: 0.62; }
/* Whole-row tint by QA stage (received / in progress / blocking / done) so a
   submission's state is distinguishable at a glance. Double-class beats
   .qa-row-done specificity for done rows. */
.qa-row.qa-rowstage-received    > td { background: rgba(148, 163, 184, 0.10); }
.qa-row.qa-rowstage-in_progress > td { background: rgba(59, 130, 246, 0.13); }
.qa-row.qa-rowstage-blocking    > td { background: rgba(239, 68, 68, 0.14); }
.qa-row.qa-rowstage-done        > td { background: rgba(34, 197, 94, 0.10); }
.qa-row.qa-rowstage-in_progress:hover > td { background: rgba(59, 130, 246, 0.20); }
.qa-row.qa-rowstage-blocking:hover    > td { background: rgba(239, 68, 68, 0.22); }
.qa-row.qa-rowstage-received:hover    > td { background: rgba(148, 163, 184, 0.18); }
.qa-row.qa-rowstage-done:hover        > td { background: rgba(34, 197, 94, 0.18); }
/* Theme is class-based (body.dark), not OS-based — keep these in sync with it. */
body.dark .qa-row.qa-rowstage-received    > td { background: rgba(148, 163, 184, 0.14); }
body.dark .qa-row.qa-rowstage-in_progress > td { background: rgba(59, 130, 246, 0.20); }
body.dark .qa-row.qa-rowstage-blocking    > td { background: rgba(239, 68, 68, 0.22); }
body.dark .qa-row.qa-rowstage-done        > td { background: rgba(34, 197, 94, 0.16); }
body.dark .qa-row.qa-rowstage-received:hover    > td { background: rgba(148, 163, 184, 0.22); }
body.dark .qa-row.qa-rowstage-in_progress:hover > td { background: rgba(59, 130, 246, 0.28); }
body.dark .qa-row.qa-rowstage-blocking:hover    > td { background: rgba(239, 68, 68, 0.30); }
body.dark .qa-row.qa-rowstage-done:hover        > td { background: rgba(34, 197, 94, 0.24); }
.qa-group-row td {
  background: var(--bg-alt); font-size: 11px; font-weight: 650;
  text-transform: uppercase; letter-spacing: 0.04em; color: var(--ink-400);
  padding: 6px 14px !important;
}
.qa-actions { white-space: nowrap; }

/* Attachments */
.qa-att-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 5px; }
.qa-att-chip {
  display: inline-flex; align-items: center; gap: 4px;
  background: var(--bg-alt); border-radius: 6px; padding: 2px 6px; font-size: 11px; max-width: 100%;
}
.qa-att-chip a { color: var(--accent); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qa-att-chip a:hover { text-decoration: underline; }
.qa-att-x {
  border: none; background: none; cursor: pointer; color: var(--ink-400);
  font-size: 14px; line-height: 1; padding: 0 2px;
}
.qa-att-x:hover { color: var(--red); }
.qa-att-add {
  border: 1px dashed var(--ink-200); background: none; cursor: pointer;
  color: var(--ink-400); font-size: 11px; border-radius: 6px; padding: 2px 8px;
}
.qa-att-add:hover { color: var(--accent); border-color: var(--accent); }
.qa-att-form { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; align-items: center; }
.qa-att-form .qa-input { width: auto; flex: 1 1 120px; }
.qa-att-form.hidden { display: none; }
.qa-att-save { padding: 4px 10px; font-size: 11px; }

/* ─── Control tab: By-founder grouped view ─────────────────────── */
.ctl-grouped {
  display: flex; flex-direction: column; gap: 10px;
}
.ctl-grouped.hidden { display: none; }
.ctl-founder-card { cursor: default; }
.ctl-founder-card .founder-card-head { cursor: pointer; }

.ctl-bulk-row {
  display: flex; flex-wrap: wrap; gap: 6px;
  align-items: flex-end;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed var(--ink-100);
}
.ctl-bulk-btn {
  background: var(--bg-alt);
  border: 1px solid var(--ink-200);
  color: var(--ink-700);
  font: inherit; font-size: 11.5px; font-weight: 500;
  padding: 5px 10px; border-radius: 6px;
  cursor: pointer;
  transition: all var(--dur-fast) var(--ease);
}
.ctl-bulk-btn:hover {
  background: var(--surface-hover);
  border-color: var(--accent); color: var(--accent);
}
body.dark .ctl-bulk-btn { background: rgba(255, 255, 255, 0.04); }
body.dark .ctl-bulk-btn:hover { background: rgba(107, 161, 255, 0.14); }
.ctl-bulk-select {
  background: var(--bg-alt);
  border: 1px solid var(--ink-200);
  color: var(--ink-700);
  font: inherit; font-size: 11.5px;
  padding: 5px 9px; border-radius: 6px;
  cursor: pointer;
  max-width: 140px;
}
body.dark .ctl-bulk-select { background: rgba(255, 255, 255, 0.04); }
.ctl-bulk-select:hover { border-color: var(--accent); }

/* By-seller card: collapsed shows only the seller header; the submission rows
   and the bulk "Apply to all" row live together in the expand-gated section. */
.ctl-apply-all-label {
  display: inline-flex; align-items: center;
  font-size: 10.5px; font-weight: 700; color: var(--ink-500);
  text-transform: uppercase; letter-spacing: 0.04em;
  margin-right: 4px; white-space: nowrap;
}
/* Bulk row sits above the submission rows inside the expand-gated section. The
   parent already draws the top divider, so drop the bulk row's own top border
   and instead divide it from the submission rows below. */
.ctl-seller-detail > .ctl-bulk-row:first-child {
  margin-top: 0; padding-top: 0; border-top: none;
  padding-bottom: 10px; margin-bottom: 6px;
  border-bottom: 1px dashed var(--ink-100);
}
/* a.ctl-sub-link (element+class) so the accent colour wins over .ctl-sub-co,
   which is defined later in this file. */
a.ctl-sub-link { color: var(--accent); text-decoration: none; cursor: pointer; }
a.ctl-sub-link:hover { text-decoration: underline; }
/* Per-submission "last activity" readout (distinct from explicit "last touch"). */
.ctl-sub-edited { font-size: 11px; color: var(--ink-400); white-space: nowrap; }
/* Labeled dropdowns — per-submission rows and the bulk "Apply to all" row. */
.ctl-sub-field, .ctl-bulk-field { display: inline-flex; flex-direction: column; gap: 2px; }
.ctl-sub-field-label, .ctl-bulk-field-label {
  font-size: 9.5px; font-weight: 700; color: var(--ink-400);
  text-transform: uppercase; letter-spacing: 0.04em;
}
/* Bulk select reading back accumulated state. Colour comes from the tone
   classes; is-set only adds weight, is-mixed reads as a muted italic. */
.ctl-bulk-select.is-set { font-weight: 600; }
.ctl-bulk-select.is-mixed { font-style: italic; color: var(--ink-500); }

.ctl-sub-row {
  display: grid;
  grid-template-columns: minmax(280px, 1.5fr) minmax(360px, 2fr) auto;
  gap: 10px;
  padding: 8px 10px;
  align-items: center;
  border-bottom: 1px dashed var(--ink-100);
  font-size: 12px;
}
.ctl-sub-row:last-child { border-bottom: none; }
.ctl-sub-id { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ctl-sub-co { font-weight: 500; color: var(--ink-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ctl-sub-funnel {
  font-size: 11px; color: var(--ink-500);
  background: var(--bg-alt); border: 1px solid var(--ink-100);
  padding: 2px 7px; border-radius: 999px; white-space: nowrap;
}
body.dark .ctl-sub-funnel { background: rgba(255, 255, 255, 0.04); }
.ctl-sub-edits { display: flex; gap: 6px; flex-wrap: wrap; }
.ctl-sub-edits select {
  background: var(--surface); border: 1px solid var(--ink-200);
  color: var(--ink-900); font: inherit; font-size: 11.5px;
  padding: 4px 7px; border-radius: 5px; min-width: 110px;
}
body.dark .ctl-sub-edits select { background: rgba(255, 255, 255, 0.04); }
.ctl-sub-open {
  background: transparent; border: 1px solid var(--ink-200);
  color: var(--ink-500); font: inherit; font-size: 11px;
  padding: 4px 9px; border-radius: 5px; cursor: pointer;
  white-space: nowrap;
}
.ctl-sub-open:hover { border-color: var(--accent); color: var(--accent); }

@media (max-width: 900px) {
  .ctl-sub-row { grid-template-columns: 1fr; }
}

/* ─── QA tab: By-founder grouped view ─────────────────────────── */
.qa-grouped { display: flex; flex-direction: column; gap: 10px; margin-top: 4px; }
.qa-grouped.hidden { display: none; }
.qa-founder-card {}

.qa-track-badge {
  display: inline-flex; align-items: center;
  padding: 3px 9px; border-radius: 999px;
  font-size: 10.5px; font-weight: 700;
  letter-spacing: 0.4px; text-transform: uppercase;
  border: 1px solid;
}
.qa-track-bd {
  background: rgba(190, 24, 93, 0.14);
  color: #9d174d;
  border-color: rgba(190, 24, 93, 0.45);
}
.qa-track-legacy {
  background: rgba(234, 88, 12, 0.14);
  color: #c2410c;
  border-color: rgba(234, 88, 12, 0.45);
}
body.dark .qa-track-bd { color: #f9a8d4; background: rgba(190, 24, 93, 0.28); }
body.dark .qa-track-legacy { color: #fdba74; background: rgba(234, 88, 12, 0.24); }

.qa-sub-row .ctl-sub-edits select { min-width: 90px; }

/* QA grouped view — attachment pills under each sub-row */
.qa-sub-attachments {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  padding: 4px 10px 6px;
  font-size: 11px;
  border-bottom: 1px dashed var(--ink-100);
}
.qa-sub-attachments-label {
  font-size: 11px; color: var(--ink-400);
  margin-right: 2px;
}
.qa-attachment-pill {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 9px;
  font-size: 11px; font-weight: 500;
  background: rgba(79, 141, 247, 0.10);
  color: var(--accent);
  border: 1px solid rgba(79, 141, 247, 0.30);
  border-radius: 999px;
  text-decoration: none;
  transition: all var(--dur-fast) var(--ease);
  max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.qa-attachment-pill:hover {
  background: rgba(79, 141, 247, 0.18);
  border-color: var(--accent);
  transform: translateY(-1px);
}
body.dark .qa-attachment-pill {
  background: rgba(107, 161, 255, 0.14);
  color: #c2dafd;
  border-color: rgba(107, 161, 255, 0.35);
}
body.dark .qa-attachment-pill:hover {
  background: rgba(107, 161, 255, 0.22);
}

/* Requested Samples section dot — amber to distinguish from BD pink + Legacy orange */
.qa-dot.qa-dot-sampling { background: #f59e0b; box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.18); }

/* ─── Priority pills (P0=red, P1=orange, P2=amber, P3=neutral) ────── */
.priority-pill {
  font-weight: 700; letter-spacing: 0.5px;
  display: inline-flex; align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  border: 1px solid;
}
.priority-p0 {
  background: rgba(220, 38, 38, 0.16); color: #991b1b;
  border-color: rgba(220, 38, 38, 0.50);
}
body.dark .priority-p0 { color: #fca5a5; background: rgba(220, 38, 38, 0.26); }
.priority-p1 {
  background: rgba(245, 158, 11, 0.16); color: #b45309;
  border-color: rgba(245, 158, 11, 0.50);
}
body.dark .priority-p1 { color: #fcd34d; background: rgba(245, 158, 11, 0.24); }
.priority-p2 {
  background: rgba(202, 138, 4, 0.14); color: #854d0e;
  border-color: rgba(202, 138, 4, 0.45);
}
body.dark .priority-p2 { color: #fde047; background: rgba(202, 138, 4, 0.22); }
.priority-p3 {
  background: var(--ink-50); color: var(--ink-500);
  border-color: var(--ink-200);
}
.priority-none {
  background: transparent;
  color: var(--ink-400);
  border-color: var(--ink-200);
  border-style: dashed;
}

/* FCS toggle pill */
.fcs-toggle {
  background: var(--bg-alt);
  border-color: var(--ink-200);
}
.fcs-toggle.active {
  background: linear-gradient(135deg, rgba(109, 40, 217, 0.16), rgba(139, 92, 246, 0.12));
  border-color: rgba(109, 40, 217, 0.55);
  color: #6d28d9; font-weight: 700;
}
/* auto = derived from the Obi criteria, not a stored tag: dashed to read as
   "computed, click to pin". */
.fcs-toggle.active.auto { border-style: dashed; }
body.dark .fcs-toggle.active { color: #c4b5fd; }

/* Research Task toggle pill */
.research-toggle {
  background: var(--bg-alt);
  border-color: var(--ink-200);
}
.research-toggle.active {
  background: linear-gradient(135deg, rgba(13, 148, 136, 0.16), rgba(45, 212, 191, 0.12));
  border-color: rgba(13, 148, 136, 0.55);
  color: #0d9488; font-weight: 700;
}
body.dark .research-toggle.active { color: #5eead4; }

/* Experimental / one-off toggle pill */
.experimental-toggle {
  background: var(--bg-alt);
  border-color: var(--ink-200);
}
.experimental-toggle.active {
  background: linear-gradient(135deg, rgba(234, 88, 12, 0.16), rgba(251, 146, 60, 0.12));
  border-color: rgba(234, 88, 12, 0.55);
  color: #ea580c; font-weight: 700;
}
body.dark .experimental-toggle.active { color: #fdba74 !important; }

/* Dev Shop (seller-type) toggle pill — steel/slate, distinct from the
   FCS/Research/Experimental dataset-classification pills. */
.dev-shop-toggle {
  background: var(--bg-alt);
  border-color: var(--ink-200);
}
.dev-shop-toggle.active {
  background: linear-gradient(135deg, rgba(71, 85, 105, 0.16), rgba(100, 116, 139, 0.12));
  border-color: rgba(71, 85, 105, 0.55);
  color: #475569; font-weight: 700;
}
body.dark .dev-shop-toggle.active { color: #cbd5e1 !important; }

/* ─── QA Status card in drawer ──────────────────────────────────── */
.qa-status-card { background: rgba(79, 141, 247, 0.04); border: 1px solid rgba(79, 141, 247, 0.18); border-radius: 12px; padding: 16px; }
body.dark .qa-status-card { background: rgba(107, 161, 255, 0.06); border-color: rgba(107, 161, 255, 0.25); }
.qa-status-item {
  background: var(--surface);
  border: 1px solid var(--ink-100);
  border-radius: 10px;
  padding: 14px 16px;
  margin-top: 10px;
}
.qa-status-item:first-child { margin-top: 0; }
.qa-status-head {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.qa-status-label { flex: 1; min-width: 200px; font-size: 14px; font-weight: 600; color: var(--ink-900); }
.qa-status-owner { font-size: 11.5px; color: var(--ink-500); }

/* 4-step stage progress bar */
.qa-stage-progress {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px;
  margin-bottom: 12px;
}
.qa-stage-step {
  display: flex; align-items: center; gap: 6px;
  padding: 9px 8px;
  background: var(--ink-50);
  border: 1px solid var(--ink-100);
  border-radius: 8px;
  cursor: pointer;
  transition: all var(--dur-fast) var(--ease);
  font-size: 11px;
  color: var(--ink-500);
}
.qa-stage-step:hover { border-color: var(--accent); color: var(--accent); }
.qa-stage-step.done {
  background: rgba(34, 197, 94, 0.12);
  border-color: rgba(34, 197, 94, 0.40);
  color: #15803d;
}
body.dark .qa-stage-step.done { color: #86efac; }
.qa-stage-step.current {
  background: rgba(79, 141, 247, 0.18);
  border-color: var(--accent);
  color: var(--accent);
  font-weight: 700;
  box-shadow: 0 2px 8px rgba(79, 141, 247, 0.20);
}
.qa-stage-step.current.is-blocking {
  background: rgba(220, 38, 38, 0.16);
  border-color: rgba(220, 38, 38, 0.50);
  color: #991b1b;
}
body.dark .qa-stage-step.current.is-blocking { color: #fca5a5; }
.qa-stage-step.future { opacity: 0.65; }
.qa-stage-step-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--ink-100);
  font-weight: 700; font-size: 10px;
  color: var(--ink-700);
}
.qa-stage-step.done .qa-stage-step-num { background: rgba(34, 197, 94, 0.30); color: #15803d; }
.qa-stage-step.current .qa-stage-step-num { background: var(--accent); color: #fff; }
.qa-stage-step.current.is-blocking .qa-stage-step-num { background: #dc2626; color: #fff; }

/* Action button row */
.qa-status-actions {
  display: flex; gap: 6px; flex-wrap: wrap;
  margin-bottom: 10px;
}
.qa-action-btn {
  padding: 7px 14px;
  border: 1px solid var(--ink-200);
  background: var(--surface);
  color: var(--ink-700);
  border-radius: 7px;
  font: inherit; font-size: 12px; font-weight: 500;
  cursor: pointer;
  transition: all var(--dur-fast) var(--ease);
}
.qa-action-btn:hover { background: var(--surface-hover); border-color: var(--accent); }
.qa-action-btn.primary {
  background: linear-gradient(180deg, var(--accent) 0%, #3b78d8 100%);
  color: #fff; border-color: var(--accent); font-weight: 600;
}
.qa-action-btn.primary:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(79, 141, 247, 0.30); }
.qa-action-btn.accept { color: #15803d; border-color: rgba(34, 197, 94, 0.40); }
.qa-action-btn.accept.active { background: rgba(34, 197, 94, 0.18); border-color: rgba(34, 197, 94, 0.65); }
.qa-action-btn.reject { color: #991b1b; border-color: rgba(220, 38, 38, 0.40); }
.qa-action-btn.reject.active { background: rgba(220, 38, 38, 0.18); border-color: rgba(220, 38, 38, 0.65); }
.qa-action-btn.partial { color: #b45309; border-color: rgba(245, 158, 11, 0.40); }
.qa-action-btn.partial.active { background: rgba(245, 158, 11, 0.18); border-color: rgba(245, 158, 11, 0.65); }
.qa-action-btn.warning { color: #b45309; border-color: rgba(245, 158, 11, 0.40); }
.qa-action-btn.warning:hover { background: rgba(245, 158, 11, 0.12); }
.qa-action-btn.warning.active { background: rgba(245, 158, 11, 0.18); border-color: rgba(245, 158, 11, 0.65); }
/* A6 decision gate: the four outcomes; LOI lane gets its own accent so a
   conditional-LOI pass reads distinctly from a standard QA pass. */
.decision-gate-actions .qa-action-btn { flex: 1 1 calc(50% - 6px); text-align: center; }
/* Reject-with-email panel: reason picker + live preview of the seller email. */
.reject-panel { margin-top: 10px; padding: 12px; border: 1px solid rgba(220, 38, 38, 0.35); border-radius: 9px; background: rgba(220, 38, 38, 0.04); }
.reject-panel-title { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: #991b1b; margin-bottom: 8px; }
.reject-reason-select { width: 100%; padding: 7px 10px; border: 1px solid var(--ink-200); border-radius: 7px; font: inherit; font-size: 12.5px; background: var(--surface); color: var(--ink-700); }
.reject-preview { margin-top: 10px; border: 1px solid var(--ink-100); border-radius: 7px; background: var(--surface); overflow: hidden; }
.reject-preview-subject { padding: 8px 12px; border-bottom: 1px solid var(--ink-100); font-size: 12.5px; font-weight: 600; color: var(--ink-900); background: var(--ink-50); }
.reject-preview-body { padding: 12px; font-size: 12.5px; line-height: 1.55; color: var(--ink-700); max-height: 300px; overflow-y: auto; }
.reject-send-note { margin-top: 8px; font-size: 11.5px; color: var(--ink-500); font-style: italic; }
.reject-panel-actions { margin-top: 10px; }
.reject-undo-banner { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; padding: 8px 12px; border: 1px solid rgba(245, 158, 11, 0.45); border-radius: 8px; background: rgba(245, 158, 11, 0.10); }
.reject-undo-text { font-size: 12px; color: #92400e; }
.qa-action-btn:disabled { opacity: 0.45; cursor: not-allowed; }
.qa-action-btn:disabled:hover { background: var(--surface); border-color: rgba(220, 38, 38, 0.40); transform: none; box-shadow: none; }
.qa-action-btn.primary.active { box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.55); }
.qa-action-btn.loi {
  color: #6d28d9; border-color: rgba(124, 58, 237, 0.45);
  background: rgba(124, 58, 237, 0.06); font-weight: 600;
}
.qa-action-btn.loi:hover { background: rgba(124, 58, 237, 0.14); border-color: #7c3aed; }
.qa-action-btn.loi.active { background: rgba(124, 58, 237, 0.20); border-color: rgba(124, 58, 237, 0.70); }
body.dark .qa-action-btn.loi { color: #c4b5fd; }
body.dark .qa-action-btn.accept { color: #86efac; }
body.dark .qa-action-btn.reject { color: #fca5a5; }
body.dark .qa-action-btn.partial { color: #fcd34d; }
body.dark .qa-action-btn.warning { color: #fcd34d; }

.qa-status-attachments {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  margin-top: 10px; padding-top: 10px;
  border-top: 1px dashed var(--ink-100);
}
.qa-status-meta {
  display: flex; flex-wrap: wrap; gap: 14px;
  margin-top: 10px; padding-top: 10px;
  border-top: 1px dashed var(--ink-100);
  font-size: 11.5px; color: var(--ink-500);
}
.qa-status-meta .verdict-accept { color: #15803d; font-weight: 600; }
.qa-status-meta .verdict-reject { color: #991b1b; font-weight: 600; }
.qa-status-meta .verdict-partial { color: #b45309; font-weight: 600; }
body.dark .qa-status-meta .verdict-accept { color: #86efac; }
body.dark .qa-status-meta .verdict-reject { color: #fca5a5; }
body.dark .qa-status-meta .verdict-partial { color: #fcd34d; }

/* Also color the existing QA grouped sub-row priority chip */
.ctl-sub-funnel.priority-p0,
.ctl-sub-funnel.priority-p1,
.ctl-sub-funnel.priority-p2,
.ctl-sub-funnel.priority-p3 {
  /* already set above */
}

/* ─── QA grouped: clean sub-card layout (replaces stacked dropdowns) ─── */
.qa-sub-card {
  display: flex; flex-direction: column; gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--ink-100);
  background: transparent;
  transition: background 0.12s;
}
.qa-sub-card:last-child { border-bottom: none; }
.qa-sub-card:hover { background: rgba(99, 102, 241, 0.04); }
body.dark .qa-sub-card:hover { background: rgba(99, 102, 241, 0.08); }

.qa-sub-card-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; flex-wrap: wrap;
}
.qa-sub-title {
  display: flex; align-items: center; gap: 8px;
  flex: 1; min-width: 0;
  font-size: 13px;
}
.qa-sub-title:hover .qa-sub-co { color: var(--accent); text-decoration: underline; }
.qa-sub-title .qa-sub-co {
  font-weight: 600; color: var(--ink-900);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 380px;
}
.qa-sub-meta {
  display: flex; align-items: center; gap: 14px;
  font-size: 11.5px; color: var(--ink-500);
  white-space: nowrap;
}
.qa-sub-open-link:hover { text-decoration: underline; }

/* Stage chip — color by stage */
.qa-stage-chip {
  display: inline-block;
  padding: 2px 8px; border-radius: 999px;
  font-size: 10.5px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.4px;
  border: 1px solid;
}
.qa-stage-received { background: rgba(99, 102, 241, 0.12); color: #4338ca; border-color: rgba(99, 102, 241, 0.45); }
.qa-stage-in_progress { background: rgba(245, 158, 11, 0.14); color: #b45309; border-color: rgba(245, 158, 11, 0.50); }
.qa-stage-blocking { background: rgba(220, 38, 38, 0.14); color: #991b1b; border-color: rgba(220, 38, 38, 0.55); }
.qa-stage-done { background: rgba(34, 197, 94, 0.14); color: #15803d; border-color: rgba(34, 197, 94, 0.45); }
body.dark .qa-stage-received { color: #c7d2fe; }
body.dark .qa-stage-in_progress { color: #fcd34d; }
body.dark .qa-stage-blocking { color: #fca5a5; }
body.dark .qa-stage-done { color: #86efac; }

.qa-verdict-chip {
  display: inline-block;
  padding: 2px 8px; border-radius: 999px;
  font-size: 10.5px; font-weight: 600;
  text-transform: uppercase;
  border: 1px solid;
}
.qa-verdict-chip.verdict-accept { background: rgba(34, 197, 94, 0.14); color: #15803d; border-color: rgba(34, 197, 94, 0.45); }
.qa-verdict-chip.verdict-reject { background: rgba(220, 38, 38, 0.14); color: #991b1b; border-color: rgba(220, 38, 38, 0.55); }
.qa-verdict-chip.verdict-partial { background: rgba(245, 158, 11, 0.14); color: #b45309; border-color: rgba(245, 158, 11, 0.50); }

/* Inline labeled selects (Stage/Verdict/Priority on a single row) */
.qa-sub-controls {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
  padding-left: 4px;
}
.qa-labeled-select {
  display: inline-flex; flex-direction: column; gap: 2px;
  font-size: 10.5px;
}
.qa-labeled-select-label {
  font-size: 10px; color: var(--ink-400);
  text-transform: uppercase; letter-spacing: 0.4px;
  font-weight: 600;
}
.qa-labeled-select-input {
  background: var(--surface); border: 1px solid var(--ink-200);
  color: var(--ink-900); font: inherit; font-size: 12px;
  padding: 4px 22px 4px 8px; border-radius: 6px;
  min-width: 110px;
  cursor: pointer;
}
body.dark .qa-labeled-select-input { background: rgba(255, 255, 255, 0.05); }
.qa-labeled-select-input:hover { border-color: var(--accent); }
.qa-labeled-select-input:focus { outline: 2px solid rgba(99, 102, 241, 0.30); outline-offset: 0; }
/* Per-submission QA select tones — same 5-tone palette as the Control bulk row. */
.qa-labeled-select-input.tone-neutral  { background: rgba(100, 116, 139, 0.10); border-color: rgba(100, 116, 139, 0.40); color: #475569; }
.qa-labeled-select-input.tone-progress { background: rgba(99, 102, 241, 0.10); border-color: rgba(99, 102, 241, 0.40); color: #4338ca; }
.qa-labeled-select-input.tone-positive { background: rgba(34, 197, 94, 0.10); border-color: rgba(34, 197, 94, 0.38); color: #15803d; }
.qa-labeled-select-input.tone-warn     { background: rgba(245, 158, 11, 0.11); border-color: rgba(245, 158, 11, 0.44); color: #b45309; }
.qa-labeled-select-input.tone-negative { background: rgba(244, 63, 94, 0.10); border-color: rgba(244, 63, 94, 0.42); color: #be123c; }
body.dark .qa-labeled-select-input.tone-neutral  { background: rgba(148, 163, 184, 0.14); border-color: rgba(148, 163, 184, 0.42); color: #cbd5e1; }
body.dark .qa-labeled-select-input.tone-progress { background: rgba(129, 140, 248, 0.16); border-color: rgba(129, 140, 248, 0.46); color: #c7d2fe; }
body.dark .qa-labeled-select-input.tone-positive { background: rgba(34, 197, 94, 0.16); border-color: rgba(34, 197, 94, 0.46); color: #86efac; }
body.dark .qa-labeled-select-input.tone-warn     { background: rgba(245, 158, 11, 0.16); border-color: rgba(245, 158, 11, 0.50); color: #fcd34d; }
body.dark .qa-labeled-select-input.tone-negative { background: rgba(244, 63, 94, 0.17); border-color: rgba(244, 63, 94, 0.50); color: #fda4af; }

.qa-sub-att-inline {
  display: flex; align-items: center; gap: 6px;
  font-size: 11px;
  margin-left: auto;
}
.qa-sub-att-label { color: var(--ink-400); }

/* (Requested Samples still uses .qa-sub-row; QA grouped now uses .qa-sub-card) */

/* ─── BD drawer: per-category vendor breakdown ─── */
.bd-category-list {
  display: flex; flex-direction: column; gap: 8px;
  margin-top: 4px;
}
.bd-category-row {
  display: grid; grid-template-columns: 130px 1fr; gap: 12px;
  align-items: flex-start;
  padding: 6px 0;
  border-bottom: 1px dashed var(--ink-100);
}
.bd-category-row:last-child { border-bottom: none; }
.bd-category-label {
  font-size: 11px; font-weight: 600;
  color: var(--ink-500);
  text-transform: uppercase; letter-spacing: 0.4px;
  padding-top: 4px;
}
.bd-vendor-pills {
  display: flex; flex-wrap: wrap; gap: 5px;
}
.bd-vendor-pill {
  display: inline-flex; align-items: center;
  padding: 3px 9px; border-radius: 999px;
  background: rgba(99, 102, 241, 0.10);
  border: 1px solid rgba(99, 102, 241, 0.30);
  color: var(--accent);
  font-size: 11.5px; font-weight: 500;
  white-space: nowrap;
}
body.dark .bd-vendor-pill { background: rgba(99, 102, 241, 0.18); color: #c7d2fe; }

.bd-notes-block {
  margin-top: 12px; padding: 10px 12px;
  background: var(--bg-alt);
  border: 1px solid var(--ink-100);
  border-radius: 6px;
}
body.dark .bd-notes-block { background: rgba(255, 255, 255, 0.03); }
.bd-notes-label {
  font-size: 11px; font-weight: 600;
  color: var(--ink-500);
  text-transform: uppercase; letter-spacing: 0.4px;
  margin-bottom: 4px;
}
.bd-notes-body {
  font-size: 12px;
  color: var(--ink-700);
  line-height: 1.55;
  white-space: pre-wrap;
  max-height: 240px;
  overflow-y: auto;
}

/* ─── Requested Samples: flat card per lead (no founder grouping) ─── */
.sampling-flat-card {
  display: flex; flex-direction: column; gap: 6px;
  padding: 12px 14px;
  background: var(--surface);
  border: 1px solid var(--ink-100);
  border-radius: 8px;
  margin-bottom: 8px;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s, transform 0.05s;
}
body.dark .sampling-flat-card { background: rgba(255, 255, 255, 0.025); }
.sampling-flat-card:hover {
  border-color: var(--accent);
  background: rgba(99, 102, 241, 0.05);
}
.sampling-flat-card:active { transform: translateY(1px); }
.sampling-flat-top {
  display: flex; align-items: center; gap: 12px;
  flex-wrap: wrap;
}
.sampling-flat-co {
  font-weight: 600; font-size: 13.5px;
  color: var(--ink-900);
  flex: 1; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sampling-flat-founder {
  font-size: 11.5px; color: var(--ink-500);
}
.sampling-flat-meta {
  display: flex; align-items: center; gap: 16px;
  font-size: 11.5px; color: var(--ink-500);
  flex-wrap: wrap;
}
.sampling-flat-open {
  margin-left: auto;
  color: var(--accent);
  font-weight: 500;
}
.sampling-flat-card:hover .sampling-flat-open { text-decoration: underline; }

/* ─── Cross-tab navigation: flash-highlight when scrolled into view ─── */
@keyframes rowFlash {
  0%   { background: rgba(99, 102, 241, 0.40); }
  60%  { background: rgba(99, 102, 241, 0.20); }
  100% { background: transparent; }
}
.row-flash {
  animation: rowFlash 2.2s ease-out;
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

/* ─── Seller (By-seller) view: merge variants + duplicate flags ─────────── */
.seller-variants { font-size: 11px; font-weight: 400; color: var(--muted, #8a8f98); margin-left: 6px; }
.founder-card-count.dup-badge { background: #fdecec; color: #b4232a; border-color: #f3c4c4; }
.sub-row .dup-tag { font-size: 10.5px; font-weight: 600; color: #b4232a; background: #fdecec; border-radius: 4px; padding: 1px 5px; margin-left: 6px; }
.sub-row.has-dup { box-shadow: inset 2px 0 0 #e0a3a3; }
/* Theme is class-based (body.dark), not OS-based — keep these in sync with it. */
body.dark .founder-card-count.dup-badge { background: #3a1c1e; color: #f0a0a4; border-color: #5a2a2d; }
body.dark .sub-row .dup-tag { background: #3a1c1e; color: #f0a0a4; }

/* ─── "Move to seller" picker (reuses .modal / .modal-header / .modal-body) ── */
/* Opened from the lead drawer (z-index 210), so it must sit ABOVE it. */
#seller-picker-overlay { z-index: 300; }
.seller-picker.modal { z-index: 301; }
.seller-picker { width: min(560px, 92vw); }
.seller-picker-current { font-size: 11.5px; color: var(--ink-500, #8a8f98); margin: -6px 0 12px; }
.seller-picker-search { width: 100%; margin: 4px 0 8px; }
.seller-picker-fixed { display: flex; flex-direction: column; gap: 5px; margin-bottom: 10px; }
.seller-picker-list { display: flex; flex-direction: column; gap: 3px; }
.seller-picker-opt { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left;
  width: 100%; padding: 9px 11px; border: 1px solid var(--ink-100, #e2e5ea); border-radius: 8px;
  background: var(--surface, #fff); color: var(--ink-900, inherit); cursor: pointer; font: inherit; transition: background 120ms, border-color 120ms; }
.seller-picker-opt:hover { background: var(--accent-soft, rgba(99,102,241,0.10)); border-color: var(--accent, #6366f1); }
.seller-picker-name { font-weight: 600; font-size: 13px; }
.seller-picker-meta { font-size: 11px; color: var(--ink-500, #8a8f98); }
.seller-picker-detach { color: var(--accent, #6366f1); font-weight: 600; }
.seller-picker-reset { color: var(--ink-500, #8a8f98); }
.seller-picker-empty { font-size: 12.5px; color: var(--ink-500, #8a8f98); padding: 12px 2px; }

/* ─── Editable identity: seller rename + per-submission edit ─────────────── */
.seller-edit-btn {
  flex: 0 0 auto; margin-left: 8px; padding: 4px 8px; border-radius: 6px;
  border: 1px solid var(--ink-100, #e2e5ea); background: var(--surface, #fff);
  color: var(--ink-500, #8a8f98); cursor: pointer; font-size: 13px; line-height: 1;
  opacity: 0; transition: opacity 120ms, background 120ms, color 120ms;
}
.founder-card:hover .seller-edit-btn { opacity: 1; }
.seller-edit-btn:hover { background: var(--accent-soft, rgba(99,102,241,0.10)); color: var(--accent, #6366f1); border-color: var(--accent, #6366f1); }
.seller-renamed { font-size: 11px; color: var(--accent, #6366f1); margin-left: 6px; font-weight: 400; }

/* Identity edit modal — opened from the drawer (z 210) / card, so sits above. */
#identity-modal-overlay { z-index: 300; }
.identity-modal.modal { z-index: 301; width: min(440px, 92vw); }
.identity-label { display: block; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.03em; color: var(--ink-500, #8a8f98); margin: 10px 0 4px; }
.identity-input { width: 100%; }
.identity-modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }

/* ─── Expanded "Edit submission" modal (submission-edit-modal) ──────────── */
.submission-edit-modal { max-width: 560px; }
.submission-edit-modal .modal-body { max-height: 70vh; overflow-y: auto; }
.edit-group-title { margin: 14px 0 6px; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; opacity: .6; }
.edit-group-title:first-of-type { margin-top: 4px; }
.field-reset-btn { margin-left: 8px; border: none; background: none; cursor: pointer; opacity: .6; font-size: 12px; }
.field-reset-btn:hover { opacity: 1; }
.submission-edit-modal textarea.identity-input { resize: vertical; font: inherit; }
/* Scan-a-document box inside the edit modal */
.edit-scan-box { border: 1px dashed var(--accent, #6366f1); border-radius: 8px; padding: 10px 12px; margin: 4px 0 16px; background: var(--accent-soft, rgba(99,102,241,0.06)); }
.edit-scan-title { font-size: 12px; font-weight: 600; margin-bottom: 8px; opacity: .8; }
.edit-scan-file { display: block; font-size: 12px; margin-bottom: 8px; max-width: 100%; }
.edit-scan-text { width: 100%; resize: vertical; font: inherit; margin-bottom: 8px; }
.edit-scan-status:empty { display: none; }
.edit-scan-status { min-height: 14px; margin-top: 4px; }
/* A field the scan proposed changing — operator reviews before Save */
.identity-input.field-proposed { border-color: var(--accent, #6366f1) !important; background: var(--accent-soft, rgba(99,102,241,0.10)); box-shadow: 0 0 0 2px rgba(99,102,241,0.15); }

/* ─── Overview revamp: dual funnels + clickable bars + new tags ──────────── */
.funnel-split { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
@media (max-width: 760px) { .funnel-split { grid-template-columns: 1fr; } }
.funnel-col-title { font-size: 12px; font-weight: 600; color: var(--ink-500, #8a8f98); margin: 0 0 8px; text-transform: uppercase; letter-spacing: 0.03em; }
.funnel-block { display: flex; flex-direction: column; gap: 4px; }
.funnel-row { display: grid; grid-template-columns: 130px 1fr 34px; align-items: center; gap: 8px; padding: 4px 6px; border-radius: 6px; }
.funnel-row-click { cursor: pointer; }
.funnel-row-click:hover { background: var(--accent-soft, rgba(99,102,241,0.10)); }
.funnel-row-label { font-size: 12px; color: var(--ink-700, inherit); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.funnel-row-track { background: var(--ink-50, #f1f3f5); border-radius: 4px; height: 16px; overflow: hidden; }
.funnel-row-bar { height: 100%; border-radius: 4px; min-width: 2px; }
.funnel-row-bar.bd { background: var(--accent, #6366f1); }
.funnel-row-bar.code { background: #0ea5e9; }
.funnel-row-count { font-size: 12px; font-weight: 600; text-align: right; color: var(--ink-900, inherit); }
.funnel-aside { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.funnel-aside-chip { font-size: 11px; padding: 3px 9px; border-radius: 999px; background: var(--ink-50, #f1f3f5); color: var(--ink-500, #8a8f98); border: 1px solid var(--ink-100, #e2e5ea); }
.funnel-aside-click { cursor: pointer; }
.funnel-aside-click:hover { border-color: var(--accent, #6366f1); color: var(--accent, #6366f1); }
.chart-row-click { cursor: pointer; border-radius: 5px; }
.chart-row-click:hover { background: var(--accent-soft, rgba(99,102,241,0.10)); }
.meta-pill.tag-toggle { cursor: pointer; }
.meta-pill.tag-toggle.active { background: var(--accent-soft, rgba(99,102,241,0.14)); border-color: var(--accent, #6366f1); color: var(--accent, #6366f1); }

/* ─── Goals tab (F85): coverage vs GTM targets ─────────────────────────── */
.goals-wrap { padding: 18px 22px; max-width: 1000px; }
.goals-header { display: flex; flex-direction: column; gap: 7px; margin-bottom: 20px; }
.goals-head-primary { display: flex; align-items: baseline; gap: 10px; }
.goals-headline-num { font-size: 2rem; font-weight: 800; line-height: 1; }
.goals-headline-label { font-size: .95rem; color: var(--ink-700, #4b5563); }
.goals-head-breakdown { display: flex; gap: 20px; font-size: .9rem; color: var(--ink-700, #4b5563); }
.goals-chip { display: inline-flex; align-items: center; gap: 5px; }
.goals-chip b { font-weight: 700; }
.goals-head-targets { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: .82rem; color: var(--text-dim, #8a8f98); margin-top: 3px; }
.goals-target-chip { background: rgba(128, 128, 128, .12); border-radius: 6px; padding: 2px 9px; font-weight: 600; color: var(--ink-700, #4b5563); }
.goals-updated { margin-left: auto; font-size: .76rem; color: var(--text-dim, #8a8f98); }
.goals-excluded-note { margin-top: 6px; font-size: .78rem; color: var(--text-dim, #8a8f98); }
.goals-excluded-note b { color: var(--ink-700, #4b5563); font-weight: 600; }
.goals-section { margin-bottom: 28px; }
.goals-section-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.goals-section-head h3 { margin: 0; font-size: .9rem; text-transform: uppercase; letter-spacing: .05em; }
/* Shared column template — the header row and every data row use this so the
   columns line up: Name | Coverage bar | 4 band counts | Have | Goal. */
.goals-grid { display: grid; grid-template-columns: 168px minmax(120px, 1fr) 62px 62px 62px 62px 50px 62px; gap: 12px; align-items: center; }
/* Column-header row: titled, muted, not interactive. */
.goals-head-row { padding: 0 10px 7px; margin-bottom: 3px; border-bottom: 1px solid var(--ink-100, #e5e7eb); cursor: default; }
.goals-head-row .gh { font-size: .66rem; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-400, #6b7280); font-weight: 700; }
.gh-num, .gh-have, .gh-goal { justify-self: end; text-align: right; display: inline-flex; align-items: center; gap: 4px; }
.gh-num i.goals-dot { width: 8px; height: 8px; margin: 0; }
.goals-row { padding: 8px 10px; border-radius: 10px; cursor: pointer; border: 1px solid transparent; transition: background .15s ease, box-shadow .15s ease, transform .12s ease, border-color .15s ease; }
/* Hover uses the site's glass treatment (translucent + blur), not a flat white. */
.goals-row:hover { background: var(--glass); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border-color: var(--glass-border); box-shadow: var(--shadow-glass-lifted); transform: translateX(3px); }
.goals-row:hover .goals-row-name { color: var(--accent, #4a90d9); }
.goals-row:hover .goals-bar { box-shadow: inset 0 0 0 1px rgba(128, 128, 128, .14); }
.goals-row-name { font-weight: 600; font-size: .86rem; transition: color .15s ease; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.goals-row.unclassified .goals-row-name { color: var(--text-dim, #8a8f98); font-style: italic; }
.goals-bar { position: relative; height: 18px; background: rgba(128, 128, 128, .12); border-radius: 5px; transition: box-shadow .15s ease; }
.goals-bar-seg { position: absolute; top: 0; bottom: 0; box-shadow: inset -2px 0 0 var(--card-bg, #fff); cursor: pointer; transition: filter .12s ease, box-shadow .12s ease, transform .12s ease; transform-origin: center; }
.goals-bar-seg:first-child { border-radius: 5px 0 0 5px; }
/* Refined, evenly-spaced quartet — calmer than primaries, still four clearly
   different hues: blue → gold → lavender → green. */
.goals-bar-sampling { background: #5a8dd6; }       /* blue     = sampling  */
.goals-bar-in_qa { background: #e0a13c; }           /* gold     = in QA     */
.goals-bar-qa_passed { background: #f48fb1; }       /* light pink = QA passed */
.goals-bar-purchased { background: #46ad79; }       /* green    = purchased */
.goals-bar-seg:hover { filter: brightness(1.1) saturate(1.06); box-shadow: inset -2px 0 0 var(--card-bg, #fff), 0 0 0 2px rgba(0, 0, 0, .2); transform: scaleY(1.2); z-index: 3; border-radius: 3px; }
.goals-bar-target { position: absolute; top: -4px; bottom: -4px; width: 2px; background: var(--ink-900, #0a0f1c); opacity: .65; pointer-events: none; }
/* Per-band number columns + Have/Goal, aligned under the titled headers. */
.goals-num { justify-self: end; text-align: right; font-variant-numeric: tabular-nums; font-size: .82rem; font-weight: 600; color: var(--ink-700, #1f2937); }
.goals-num.goals-num-zero { opacity: .28; font-weight: 400; }
.goals-have { justify-self: end; text-align: right; font-variant-numeric: tabular-nums; font-weight: 800; font-size: .9rem; }
.goals-goal { justify-self: end; text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; font-size: .82rem; color: var(--ink-500, #4b5563); white-space: nowrap; }
.goals-goal.met { color: #2e9e5b; }
.goals-goal.met-pipeline { color: #c98a2a; }
.goals-goal.goals-goal-na { color: var(--ink-300, #9ca3af); }
/* Stage pill (Leads table): one color family per board stage so any drill
   destination shows where each lead sits in the funnel. */
.stage-pill { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: .72rem; font-weight: 600; white-space: nowrap; border: 1px solid transparent; }
.stage-new { background: rgba(128,128,128,.16); color: var(--text-dim, #6b7280); }
.stage-qualifying { background: rgba(99,102,241,.16); color: #6366f1; }
.stage-warm_hold { background: rgba(168,85,247,.16); color: #a855f7; }
.stage-sampling { background: rgba(63,127,196,.18); color: #3f7fc4; }
.stage-gradex_review { background: rgba(63,127,196,.18); color: #3f7fc4; }
.stage-in_qa { background: rgba(224,138,43,.18); color: #c2741b; }
.stage-qa_passed { background: rgba(31,157,87,.16); color: #1f9d57; }
.stage-accepted { background: rgba(31,157,87,.16); color: #1f9d57; }
.stage-purchased { background: #1f9d57; color: #fff; }
.stage-closed { background: rgba(220,53,69,.14); color: #c23a47; }
.goals-target-input { width: 52px; justify-self: end; }
/* Legend sits at the top of the tab (under the header strip), larger type. */
.goals-legend { display: flex; gap: 22px; align-items: center; color: var(--ink-700, #4b5563); font-size: .92rem; font-weight: 500; margin: 0 0 20px; padding-bottom: 14px; border-bottom: 1px solid var(--ink-100, rgba(128, 128, 128, .16)); }
.goals-dot { display: inline-block; width: 13px; height: 13px; border-radius: 3px; vertical-align: -2px; margin-right: 6px; }

/* ── Bespoke drawer (2026-06-17): long text, repo groups, links ───────── */
.drawer-longtext { font-size: 12px; line-height: 1.45; color: var(--ink-700, #4b5563); background: var(--ink-50, #f8fafc); border-radius: 7px; padding: 7px 9px; }
.repo-group-head { cursor: pointer; font-size: 11px; font-weight: 700; text-transform: capitalize; padding: 4px 0; color: var(--ink-700, #4b5563); }
.repo-group-head::before { content: '▸ '; }
.repo-group-head.open::before { content: '▾ '; }
.repo-group-body.hidden { display: none; }
.repo-search { width: 100%; box-sizing: border-box; margin: 4px 0; padding: 4px 7px; font-size: 11px; border: 1px solid var(--ink-200, #d7dce3); border-radius: 6px; }
.repo-more { margin-top: 4px; font-size: 11px; }
.link-group { margin: 6px 0; }
.link-group-label { font-size: 9.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-400, #94a3b8); font-weight: 700; }
.link-row { display: flex; align-items: center; gap: 6px; border: 1px solid var(--ink-100, #eef1f5); border-radius: 8px; padding: 5px 8px; margin: 3px 0; font-size: 12px; }
.link-anchor { flex: 1; color: var(--brand, #1d4ed8); font-weight: 600; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.link-meta { color: var(--ink-400, #94a3b8); font-size: 9.5px; white-space: nowrap; }
.link-remove { color: var(--ink-300, #cbd5e1); cursor: pointer; font-weight: 700; }
.link-remove:hover { color: #b91c1c; }
.link-add-form { border: 1px dashed var(--ink-200, #c7cdd6); border-radius: 9px; padding: 8px; margin-top: 8px; }
.link-add-form .link-in { width: 100%; box-sizing: border-box; border: 1px solid var(--ink-200, #d7dce3); border-radius: 6px; padding: 5px 7px; font-size: 12px; margin-bottom: 6px; }
.link-add-row { display: flex; gap: 6px; }
.link-add-row > * { flex: 1; }

/* ─── Data Requests tab (F90-F97) — ported from three-board-split ─── */
/* ─── Data Requests tab (F90+) ─────────────────────────────────────── */
.dr-wrap { padding: 0; }
.dr-topbar { display: flex; align-items: center; gap: 10px; padding: 10px 14px; }
.dr-search { flex: 1; padding: 7px 12px; border-radius: 6px; border: 1px solid var(--ink-200); background: var(--surface); color: var(--text, #cdd5df); }
.dr-subtabs { display: flex; gap: 6px; padding: 4px 14px 12px; border-bottom: 1px solid var(--ink-100); }
.dr-subtab { padding: 9px 18px; background: var(--surface); border: 1px solid var(--ink-200); border-radius: 8px; color: var(--ink-500); cursor: pointer; font-size: 13.5px; font-weight: 600; transition: background .12s, color .12s, border-color .12s; }
.dr-subtab:hover { color: var(--ink-900); border-color: var(--ink-300); }
.dr-subtab.active { background: var(--accent, #4f8df7); border-color: var(--accent, #4f8df7); color: #fff; font-weight: 700; }
.dr-subpane { padding: 12px 14px; }
.dr-subpane.hidden { display: none; }
.dr-empty { color: var(--ink-500); padding: 20px; text-align: center; }

.dr-table, .dr-vtable { width: 100%; border-collapse: collapse; font-size: 12px; }
.dr-table th, .dr-table td, .dr-vtable th, .dr-vtable td { padding: 6px 9px; border-bottom: 1px solid var(--ink-200); text-align: left; }
.dr-table th, .dr-vtable th { color: var(--ink-500); font-size: 10px; text-transform: uppercase; letter-spacing: .04em; }
.dr-row, .dr-vrow, .dr-board-row { cursor: pointer; }
.dr-row.open, .dr-vrow.open, .dr-board-row.open { background: var(--bg-alt); }
.dr-caret { color: var(--accent, #5aa9ff); width: 12px; }
.dr-demand { color: var(--text, #cdd5df); }
.dr-supply { color: #46d17a; font-weight: 600; }
.dr-link { color: var(--accent, #5aa9ff); }
.dr-spill { font-size: 10px; padding: 1px 8px; border-radius: 999px; background: #2a2f3a; color: #9aa4b2; }
.dr-status-sourcing, .dr-status-open { background: #12243b; color: #5aa9ff; }
.dr-status-won { background: #123b1e; color: #46d17a; }
.dr-status-lost { background: #3b1620; color: #e0637a; }
.dr-status-on_hold { background: #3b2f12; color: #f0c040; }
.dr-marg-good { color: #46d17a; font-weight: 700; }
.dr-marg-thin { color: #f0c040; font-weight: 700; }
.dr-marg-neg { color: #e0637a; font-weight: 700; }

.dr-ebox { display: grid; grid-template-columns: 1fr 1.2fr; gap: 18px; padding: 12px 16px; background: var(--bg-alt); }
.dr-flab { color: var(--ink-500); font-size: 10px; text-transform: uppercase; letter-spacing: .04em; display: block; margin: 8px 0 4px; }
.dr-ro { color: var(--text, #cdd5df); font-size: 11.5px; line-height: 1.5; }
.dr-edit-row { display: flex; align-items: center; gap: 8px; margin: 4px 0; }
.dr-input { background: var(--surface); border: 1px solid #355; border-radius: 5px; padding: 4px 7px; color: var(--text, #cdd5df); }
.dr-notes { width: 100%; min-height: 44px; box-sizing: border-box; }
.dr-qgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.dr-qbox { border: 1px solid var(--ink-200); border-radius: 6px; padding: 8px; background: var(--surface); }
.dr-qbox.dr-add { color: var(--ink-500); display: flex; align-items: center; justify-content: center; cursor: pointer; }
.dr-qline { display: flex; gap: 6px; margin: 4px 0; }
.dr-qline .dr-input { width: 50%; }
.dr-qcomputed { font-size: 11px; color: #46d17a; margin-top: 4px; }
.dr-margin-line { margin-top: 8px; font-weight: 700; }

.dr-board-row { display: flex; align-items: center; gap: 14px; padding: 9px 12px; border-bottom: 1px solid var(--ink-200); }
.dr-board-row b { color: var(--text, #e6ebf2); }
.dr-col { font-size: 11px; color: #9aa4b2; }
.dr-poc { margin-left: auto; }
.dr-funnel { display: flex; gap: 7px; padding: 10px 12px; overflow-x: auto; background: #0b0e13; }
.dr-fcol { flex: 1; min-width: 132px; background: var(--surface); border: 1px solid var(--ink-200); border-radius: 8px; padding: 7px; }
.dr-fcol.drop { border-color: var(--accent, #5aa9ff); background: #0e1722; }
.dr-fcol-won { border-color: #1f5132; } .dr-fcol-lost { border-color: #5a2330; } .dr-fcol-rejected { border-color: #4a3a12; }
.dr-fhead { display: flex; justify-content: space-between; font-size: 9.5px; text-transform: uppercase; color: var(--ink-500); margin-bottom: 7px; padding-bottom: 5px; border-bottom: 1px solid var(--ink-200); }
.dr-fcount { background: #20252f; color: #9aa4b2; border-radius: 999px; padding: 0 6px; }
.dr-vcard { background: var(--bg-alt); border: 1px solid var(--ink-200); border-radius: 6px; padding: 7px; margin-bottom: 7px; cursor: grab; }
.dr-vcard b { color: var(--text, #e6ebf2); }
.dr-vmeta { font-size: 10.5px; color: #9aa4b2; margin-top: 4px; }
.dr-fempty { color: #39404c; font-size: 10px; text-align: center; padding: 8px 0; }

.dr-chips { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 4px 0 16px; font-size: 12.5px; }
.dr-chip { font-size: 12px; padding: 5px 13px; border-radius: 999px; border: 1px solid var(--ink-200); color: #9aa4b2; cursor: pointer; }
.dr-chip.on { background: #12243b; border-color: var(--accent, #5aa9ff); color: var(--accent, #5aa9ff); }
.dr-count { margin-left: auto; }
.dr-cap { text-align: center; }
.dr-cap-yes { color: #46d17a; font-weight: 700; }
.dr-cap-partial { color: #f0c040; font-weight: 700; }
.dr-cap-no { color: #39404c; }
.dr-fresh-hot { color: #46d17a; } .dr-fresh-warm { color: #9aa4b2; } .dr-fresh-cold { color: #c46; } .dr-fresh-none { color: #5a6472; }
.dr-rel-preferred { color: #46d17a; } .dr-rel-blacklisted { color: #e0637a; } .dr-rel-none { color: #5a6472; }
.dr-vtype { font-size: 10px; padding: 1px 7px; border-radius: 999px; background: #2a2f3a; color: #9aa4b2; }

/* ── Vendor directory table — uniform rows, icon strip, badges (2026-07) ── */
.dr-vtable { table-layout: fixed; }                                     /* widths below hold */
.dr-vtable td { height: 50px; vertical-align: middle; }                 /* fixed row height */
.dr-vtable th:nth-child(1), .dr-vtable td:nth-child(1) { width: 22%; }  /* Vendor */
.dr-vtable th:nth-child(2), .dr-vtable td:nth-child(2) { width: 9%; }   /* Domain / data */
.dr-vtable th:nth-child(3), .dr-vtable td:nth-child(3) { width: auto; } /* Capabilities — takes the slack */
.dr-vtable th:nth-child(4), .dr-vtable td:nth-child(4) { width: 62px; white-space: nowrap; }  /* Samples */
.dr-vtable th:nth-child(5), .dr-vtable td:nth-child(5) { width: 118px; white-space: nowrap; } /* Status */
.dr-vtable th:nth-child(6), .dr-vtable td:nth-child(6) { width: 92px; white-space: nowrap; }  /* Relationship */
.dr-vtable th:nth-child(7), .dr-vtable td:nth-child(7) { width: 54px; white-space: nowrap; }  /* View */
.dr-vrow { transition: background .12s; }
.dr-vrow:hover { background: var(--surface-hover); }
.dr-vname { font-weight: 700; color: var(--ink-900); font-size: 12.5px; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; }
.dr-vdomain-tag { font-size: 10px; font-weight: 600; padding: 2px 8px; border-radius: 999px; background: var(--ink-100); color: var(--ink-500); white-space: nowrap; }
.dr-capstrip { display: flex; gap: 5px; }
.dr-capi { flex: 1 1 0; min-width: 0; height: 40px; border-radius: 6px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; }
.dr-capi .ci { font-size: 13px; font-weight: 700; line-height: 1; }
.dr-capi .cl { font-size: 9.5px; font-weight: 600; letter-spacing: -.01em; opacity: .9; }
.dr-capi-yes { background: rgba(34, 197, 94, .16); color: #16a34a; }
.dr-capi-partial { background: rgba(245, 158, 11, .18); color: #d97706; }
.dr-capi-no { background: var(--ink-100); color: var(--ink-300); }
.dr-dealstage { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 600; padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.dr-dealstage::before { content: ''; width: 6px; height: 6px; border-radius: 50%; }
.ds-msa { background: rgba(34, 197, 94, .14); color: #16a34a; }  .ds-msa::before { background: #16a34a; }
.ds-nda { background: rgba(79, 141, 247, .18); color: #4f8df7; } .ds-nda::before { background: #4f8df7; }
.ds-none { background: rgba(245, 158, 11, .18); color: #d97706; } .ds-none::before { background: #f59e0b; }
.ds-other { background: var(--ink-100); color: var(--ink-500); } .ds-other::before { background: var(--ink-400); }
.dr-relpill { font-size: 10.5px; font-weight: 600; padding: 3px 9px; border-radius: 6px; }
.dr-relpill.dr-rel-preferred { background: rgba(139, 92, 246, .18); color: #8b5cf6; }
.dr-relpill.dr-rel-active { background: rgba(34, 197, 94, .16); color: #16a34a; }
.dr-relpill.dr-rel-blacklisted { background: rgba(244, 63, 94, .16); color: #e0637a; }
.dr-relpill.dr-rel-none { color: var(--ink-300); }
.dr-viewcue { text-align: right; color: var(--accent, #4f8df7); font-weight: 600; font-size: 11px; opacity: .45; transition: opacity .12s; white-space: nowrap; }
.dr-vrow:hover .dr-viewcue { opacity: 1; }
.dr-vnotes-hero { font-size: 13.5px; line-height: 1.6; padding: 14px 15px; color: var(--ink-900); border-left: 3px solid var(--accent, #4f8df7); }
.dr-ntbl { width: 100%; border-collapse: collapse; margin-top: 5px; }
.dr-ntbl th, .dr-ntbl td { border: 1px solid var(--ink-200); padding: 4px 7px; font-size: 11px; text-align: left; }
.dr-ndr { width: 130px; color: var(--accent, #5aa9ff); }
.dr-ntoggle { color: var(--accent, #5aa9ff); font-size: 11px; margin-top: 5px; cursor: pointer; }

.dr-newreq { margin: 0 0 10px; }
.dr-newreq-form { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-top: 8px; }
.dr-newreq-form .dr-input { width: 150px; }

.dr-vn-row { display: flex; align-items: center; gap: 6px; }
.dr-vn-row .dr-vn { flex: 1; }
.dr-vremove { color: var(--ink-300, #cbd5e1); cursor: pointer; font-weight: 700; padding: 0 2px; }
.dr-vremove:hover { color: #b91c1c; }

.dr-stats { display: flex; gap: 20px; align-items: baseline; margin: 0 0 10px; padding: 8px 12px; background: var(--ink-50, #f8fafc); border-radius: 8px; }
.dr-stat b { font-size: 16px; color: var(--ink-900, #0f172a); }
.dr-stat-lbl { font-size: 11px; color: var(--ink-500, #64748b); }
/* Explicit segmented filter — reads unmistakably as a set of filter buttons. */
.dr-segfilter { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; }
.dr-seg-label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-400, #94a3b8); }
.dr-segfilter { border: 0; }
.dr-seg { cursor: pointer; display: inline-flex; align-items: baseline; gap: 6px; padding: 5px 12px;
  font-size: 12px; font-weight: 600; color: var(--ink-600, #475569);
  background: var(--surface, #fff); border: 1px solid var(--ink-200, #d7dee8); border-radius: 999px;
  transition: background .12s, border-color .12s, color .12s, box-shadow .12s, transform .06s; }
.dr-seg:hover { border-color: var(--accent, #5aa9ff); background: var(--ink-100, #eef2f7); box-shadow: 0 2px 6px rgba(15,23,42,.10); }
.dr-seg:active { transform: translateY(1px); }
.dr-seg .dr-seg-n { font-size: 11px; font-variant-numeric: tabular-nums; opacity: .7; }
.dr-seg.active { background: var(--accent, #5aa9ff); border-color: var(--accent, #5aa9ff); color: #fff; box-shadow: 0 2px 8px rgba(90,169,255,.35); }
.dr-seg.active .dr-seg-n { opacity: .9; }
.dr-row-click { cursor: pointer; }
.dr-open-hint { color: var(--ink-300, #cbd5e1); font-weight: 700; text-align: right; }
.dr-row-click:hover { background: var(--ink-50, #f6f8fb); }
/* Req id is an opaque Salesforce key — keep it compact so Client can breathe. */
.dr-table td.dr-reqid { max-width: 72px; width: 72px; white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; font-size: 11px; font-variant-numeric: tabular-nums; }
.dr-table td.dr-client { font-weight: 600; }
.dr-table td.dr-date { white-space: nowrap; font-variant-numeric: tabular-nums; }
.dr-view-btn { display: inline-block; padding: 2px 8px; border-radius: 6px; font-size: 11px;
  font-weight: 600; color: var(--brand-600, #2b5ce6); background: var(--brand-50, #eef2ff);
  border: 1px solid var(--brand-100, #dbe3ff); }
.dr-row-click:hover .dr-view-btn { background: var(--brand-100, #dbe3ff); }
/* Click-to-sort headers on the Requests table. */
.dr-table th.dr-sortable { cursor: pointer; user-select: none; white-space: nowrap; }
.dr-table th.dr-sortable:hover { color: var(--ink-700, #334155); }
.dr-table th.dr-sortable.sorted { color: var(--brand-600, #2b5ce6); }
.dr-sort-arrow { font-size: 9px; color: var(--ink-300, #cbd5e1); opacity: .8; }
.dr-table th.dr-sortable:hover .dr-sort-arrow { color: var(--ink-500, #64748b); }
.dr-sort-arrow.active { color: var(--brand-600, #2b5ce6); opacity: 1; }

/* DR status-board column header colors (mirror the main board pattern) */
.kanban-col[data-stage="open"] .kanban-col-head { color: #64748b; }
.kanban-col[data-stage="sourcing"] .kanban-col-head { color: #3b82f6; }
.kanban-col[data-stage="on_hold"] .kanban-col-head { color: #f59e0b; }
.kanban-col[data-stage="won"] .kanban-col-head { color: #16a34a; }
.kanban-col[data-stage="lost"] .kanban-col-head { color: #71717a; }

/* ── QA stage board ─────────────────────────────────────────────────────── */
.qa-board { display: grid; grid-template-columns: repeat(4, minmax(250px, 360px)); gap: 14px; align-items: start; justify-content: start; }
.qa-col-empty { font-size: 12px; color: var(--ink-300); text-align: center; padding: 18px 8px; border: 1px dashed var(--ink-100); border-radius: 8px; }
.qa-card-eta { cursor: pointer; }
.qa-card-eta.qa-eta-empty { color: var(--ink-300); }
.qa-col { background: var(--bg-alt); border: 1px solid var(--ink-100); border-radius: 11px; padding: 9px; min-height: 120px; }
.qa-col-head { display: flex; justify-content: space-between; align-items: center; font-size: 12px; font-weight: 700; color: var(--ink-700); padding: 3px 5px 10px; }
.qa-col-count { color: var(--ink-400); font-weight: 600; }
.qa-col-title { font-weight: 700; }
.qa-col-body { display: flex; flex-direction: column; min-height: 60px; }
.qa-col.drag-over { outline: 2px dashed var(--accent); outline-offset: -2px; }
.qa-card { position: relative; background: var(--surface); border: 1px solid var(--ink-100); border-radius: 10px; padding: 11px 12px 10px; margin-bottom: 9px; box-shadow: var(--shadow-sm); cursor: pointer; }
.qa-card:hover { border-color: var(--accent); }
.qa-card.track-bd { border-left: 4px solid var(--t-bd); }
.qa-card.track-legacy { border-left: 4px solid var(--t-legacy); }
.qa-card-head { display: flex; align-items: center; gap: 7px; padding-right: 36px; }
.qa-card-head .qa-track-badge { flex: none; }
.qa-card-co { font-weight: 600; font-size: 13.5px; color: var(--ink-700); }
.qa-card-fo { font-size: 11.5px; color: var(--ink-400); margin-top: 1px; }
.qa-card-lbl { font-size: 11px; color: var(--ink-300); font-style: italic; margin-top: 2px; }
.qa-card .priority-pill { position: absolute; top: 11px; right: 12px; }
/* "+N new sample" badge — bright, attention-grabbing; clears when the operator opens the item. */
.qa-new-badge { display: inline-block; margin-top: 7px; padding: 2px 8px; border-radius: 999px; background: var(--amber); color: #fff; font-size: 10.5px; font-weight: 700; letter-spacing: .2px; box-shadow: 0 1px 3px rgba(245, 158, 11, .4); }
/* Primary "Open latest sample" link on the card face. */
.qa-latest-link { display: inline-flex; align-items: center; gap: 4px; margin-top: 7px; margin-left: 8px; color: var(--accent); font-weight: 600; font-size: 11.5px; text-decoration: none; }
.qa-latest-link:hover { text-decoration: underline; }
.qa-card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 9px; font-size: 11.5px; color: var(--ink-400); }
.qa-card-eta.overdue { color: var(--red); font-weight: 600; }
.qa-folder-chip { display: inline-flex; align-items: center; gap: 4px; color: var(--accent); font-weight: 600; background: var(--bg-alt); padding: 2px 7px; border-radius: 6px; cursor: pointer; }
.qa-owner { margin-left: auto; width: 22px; height: 22px; border-radius: 50%; background: var(--navy-700); color: #fff; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.qa-folder-pop { position: absolute; z-index: 40; background: var(--surface); border: 1px solid var(--ink-100); border-radius: 9px; box-shadow: var(--shadow-md); min-width: 220px; overflow: hidden; }
.qa-folder-pop a { display: block; padding: 8px 11px; font-size: 12.5px; border-bottom: 1px solid var(--ink-50); color: var(--accent); }
.qa-folder-pop a:last-child { border-bottom: 0; }
.qa-side-overlay { position: fixed; inset: 0; background: rgba(15, 29, 58, 0.45); backdrop-filter: blur(4px); z-index: 50; }
.qa-side-panel { position: fixed; top: 0; right: 0; height: 100vh; width: 420px; max-width: 92vw; background: var(--surface); box-shadow: var(--shadow-drawer); z-index: 51; padding: 22px; overflow-y: auto; transform: translateX(100%); transition: transform .18s ease; }
.qa-side-panel.open { transform: translateX(0); }
.qa-side-panel.hidden, .qa-side-overlay.hidden { display: none; }

/* ── Auth gate overlay ───────────────────────────────────────────── */
#auth-gate {
  position: fixed; inset: 0; z-index: 99999;
  display: flex; align-items: center; justify-content: center;
  background: #0f1d3a; visibility: visible;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
#auth-gate .auth-card { width: 380px; max-width: calc(100vw - 32px); background: #fff; border-radius: 16px; padding: 28px; box-shadow: 0 24px 60px rgba(0,0,0,.45); }
#auth-gate .auth-brand { font-size: 18px; font-weight: 700; color: #0f1d3a; margin-bottom: 18px; }
#auth-gate .auth-brand span { color: #4f8df7; }
#auth-gate h2 { margin: 0 0 6px; font-size: 19px; color: #0a0f1c; }
#auth-gate .auth-sub { margin: 0 0 16px; font-size: 13px; color: #4b5563; line-height: 1.5; }
#auth-gate input { width: 100%; box-sizing: border-box; padding: 11px 13px; margin-bottom: 12px; border: 1px solid #d1d5db; border-radius: 9px; font-size: 15px; }
#auth-gate #auth-code { text-align: center; letter-spacing: 8px; font-family: "Courier New", monospace; font-size: 20px; }
#auth-gate .auth-btn { width: 100%; padding: 11px; border: 0; border-radius: 9px; cursor: pointer; background: #4f8df7; color: #fff; font-size: 15px; font-weight: 600; }
#auth-gate .auth-btn:hover { background: #2670e8; }
#auth-gate .auth-link { width: 100%; margin-top: 10px; background: none; border: 0; cursor: pointer; color: #4f8df7; font-size: 13px; }
#auth-gate .auth-link[disabled] { color: #9ca3af; cursor: default; }
#auth-gate .auth-banner { margin-bottom: 14px; padding: 11px 13px; border-radius: 9px; background: #eff6ff; border: 1px solid #4f8df7; color: #1f2937; font-size: 13px; line-height: 1.45; }
#auth-gate .auth-msg { margin-top: 10px; font-size: 12.5px; color: #6b7280; min-height: 16px; }
#auth-gate .auth-blocked h2 { color: #dc2626; }

/* ─── DR-only site (dr.turingcentral.com) ──────────────────────────────────
   Same deploy as the full tracker; index.html sets html[data-app="dr"] before
   boot when the host is dr.* (see js/app-select.mjs, js/dr-main.mjs). These
   rules hide the tracker-only chrome so the page is the Data Requests tab and
   nothing else. Every selector is guarded by [data-app="dr"] so the full
   tracker (no attribute) is completely untouched. */
html[data-app="dr"] .tab-nav { display: none; }
html[data-app="dr"] #gradex-btn { display: none; }
html[data-app="dr"] #export-btn { display: none; }
html[data-app="dr"] #cmdk-btn { display: none; }
html[data-app="dr"] #bell-btn { display: none; }
html[data-app="dr"] #refresh-btn { display: none; }
html[data-app="dr"] #row-count { display: none; }
html[data-app="dr"] #refreshed-at { display: none; }

/* A1: company-name-missing placeholder. Company is always the headline; when
   it is absent we show a muted, italic "Company name missing" marker so the gap
   is obvious and never mistaken for a real value or a person's name. */
.title-missing { color: var(--ink-400); font-style: italic; font-weight: 500; }
/* Drawer title is an #id (and a gradient text-fill in dark mode) — override both. */
#drawer-title.title-missing { color: var(--ink-400); background: none; -webkit-text-fill-color: var(--ink-400); font-style: italic; }
body.dark #drawer-title.title-missing { background: none; -webkit-text-fill-color: var(--ink-400); }

/* ── Overview: weekly BD + QA chart (WoW), paged 5 weeks at a time ───────── */
.wbd-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.wbd-nav { display: flex; align-items: center; gap: 10px; }
.wbd-range { font-size: 13px; color: var(--ink-700); font-weight: 600; font-variant-numeric: tabular-nums; }
.wbd-arrow { font-size: 13px; font-weight: 600; color: var(--ink-700); background: var(--bg-alt); border: 1px solid var(--ink-100); border-radius: 6px; padding: 6px 12px; cursor: pointer; transition: background var(--dur-fast) var(--ease); }
.wbd-arrow:hover:not(:disabled) { background: var(--ink-100); }
.wbd-arrow:disabled { opacity: .4; cursor: default; }
.wbd-chart { padding: 4px 2px 0; }
.wbd-plot { display: flex; align-items: flex-end; justify-content: center; gap: 22px; padding: 26px 10px 0; border-bottom: 2px solid var(--ink-100); }
.wbd-group { display: flex; flex-direction: column; align-items: center; gap: 11px; width: 72px; }
.wbd-total { font-size: 16px; font-weight: 700; color: var(--ink-900); font-variant-numeric: tabular-nums; line-height: 1; }
.wbd-total-zero { color: var(--ink-300); font-weight: 600; }
.wbd-cols { display: flex; align-items: flex-end; justify-content: center; height: 240px; width: 100%; }
.wbd-col { display: flex; flex-direction: column; justify-content: flex-end; align-items: stretch; width: 60px; height: 100%; border-radius: 7px 7px 0 0; overflow: hidden; }
.wbd-click { cursor: pointer; }
/* Each rendered (non-zero) segment gets a minimum height so even 1-lead slices
   are a real click/hover target — bars are intentionally not strictly to-scale. */
.wbd-seg { width: 100%; min-height: 15px; cursor: pointer; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5); transition: filter var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease); }
.wbd-seg:first-child { box-shadow: none; }
.wbd-seg:hover { filter: brightness(1.08); box-shadow: inset 0 0 0 2px rgba(15, 23, 42, .65); z-index: 1; }
.wbd-axis { display: flex; justify-content: center; gap: 22px; padding: 9px 10px 0; }
.wbd-xlabel { width: 72px; text-align: center; font-size: 12.5px; font-weight: 600; color: var(--ink-400); font-variant-numeric: tabular-nums; white-space: nowrap; }
.seg-new { background: var(--ink-200, #cbd5e1); color: var(--ink-900); }
.seg-pre_qa { background: #94a3b8; }
.seg-pre_qa_reject { background: #f59e0b; color: #3a2a00; }
.seg-in_qa { background: #60a5fa; }
.seg-qa_pass_partial { background: var(--green); }
.seg-qa_reject { background: var(--red); }
.wbd-legend { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 14px; font-size: 13px; color: var(--ink-700); }
.wbd-legend-item { display: flex; align-items: center; gap: 6px; }
.wbd-swatch { width: 13px; height: 13px; border-radius: 3px; display: inline-block; }

/* ─── Research dataset PDF export (research-export.mjs) ─────────────────────── */
.research-title-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
/* Compact themed action button (btn-primary provides the accent gradient + hover). */
.research-export-btn { padding: 8px 16px; font-size: 13px; border-radius: 8px; white-space: nowrap; }

/* Selection dialog. The modal surface flips with the theme (body.dark .modal),
   so every color here uses a token that stays legible on both surfaces — never a
   hardcoded #fff bg or a non-existent token (this theme has no --ink-600). */
.rx-modal { width: min(680px, 94vw); display: flex; flex-direction: column; }
.rx-toolbar { display: flex; align-items: center; gap: 12px; margin: 4px 0 12px; }
.rx-toolbar .search { flex: 1; }
.rx-seg { display: inline-flex; border: 1px solid var(--ink-200); border-radius: 8px; overflow: hidden; background: var(--surface); }
.rx-seg-btn { border: none; background: transparent; padding: 7px 14px; font-size: 12.5px; font-weight: 600; color: var(--ink-700); cursor: pointer; }
.rx-seg-btn + .rx-seg-btn { border-left: 1px solid var(--ink-200); }
.rx-seg-btn:hover { background: var(--surface-hover); }
.rx-seg-btn.active { background: var(--accent); color: #fff; }
.rx-list { max-height: 46vh; overflow-y: auto; border: 1px solid var(--ink-100); border-radius: 10px; padding: 6px; }
.rx-empty { padding: 24px; text-align: center; color: var(--ink-500); font-size: 13px; }
.rx-group-head { padding: 8px 8px 4px; margin-top: 6px; border-top: 1px solid var(--ink-100); }
.rx-group-head:first-child { border-top: none; margin-top: 0; }
.rx-group-name { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; color: var(--ink-700); }
.rx-check { display: flex; align-items: center; gap: 9px; cursor: pointer; }
.rx-item { padding: 6px 8px 6px 22px; border-radius: 7px; }
.rx-item:hover { background: var(--surface-hover); }
.rx-item-title { font-size: 13px; color: var(--ink-900); }
.rx-item-meta { font-size: 11.5px; color: var(--ink-500); margin-left: auto; }
.rx-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 22px; border-top: 1px solid var(--ink-100); }
.rx-count { font-size: 12.5px; color: var(--ink-500); }

/* Layout hardening: keep the tracker fluid on large monitors and stable under
   browser zoom. Dense surfaces scroll inside themselves instead of widening the
   whole page. */
html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

.topbar-inner,
.metrics-content,
.content,
.stats-bar,
.filterbar,
#pane-data-requests {
  width: 100%;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.topbar {
  width: 100%;
}

.topbar-inner {
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap;
  gap: clamp(10px, 1.25vw, 24px);
  padding: 12px clamp(14px, 1.45vw, 28px);
}

.brand {
  flex: 0 0 auto;
  min-width: 0;
}

.tab-nav {
  flex: 1 1 auto;
  justify-self: auto;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}

.tab-nav::-webkit-scrollbar,
.topbar-actions::-webkit-scrollbar {
  display: none;
}

.tab-btn {
  flex: 0 0 auto;
  padding-left: clamp(10px, 0.9vw, 18px);
  padding-right: clamp(10px, 0.9vw, 18px);
}

.topbar-actions {
  flex: 0 1 auto;
  justify-content: flex-end;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}

#pane-data-requests {
  min-width: 0;
}

.dr-topbar {
  flex-wrap: wrap;
  align-items: stretch;
  gap: 10px;
  padding-left: clamp(14px, 1.45vw, 28px);
  padding-right: clamp(14px, 1.45vw, 28px);
}

.dr-search {
  flex: 1 1 520px;
  min-width: min(100%, 320px);
}

.dr-subtabs {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
}

.dr-subtab {
  flex: 0 0 auto;
}

.dr-subpane {
  max-width: 100%;
  overflow-x: auto;
  padding-left: clamp(14px, 1.45vw, 28px);
  padding-right: clamp(14px, 1.45vw, 28px);
  overscroll-behavior-x: contain;
}

.dr-table,
.dr-vtable {
  width: 100%;
  min-width: 1180px;
}

.dr-vtable {
  min-width: 1280px;
}

@media (max-width: 1800px) {
  .topbar-inner {
    flex-wrap: wrap;
  }

  .brand {
    flex: 1 0 auto;
  }

  .topbar-actions {
    flex: 0 1 auto;
  }

  .tab-nav {
    order: 3;
    flex-basis: 100%;
    justify-content: flex-start;
  }
}

@media (max-width: 900px) {
  .topbar-actions {
    flex-basis: 100%;
    justify-content: flex-start;
  }

  .operator-input {
    flex: 1 1 140px;
    width: auto;
  }

  .dr-search,
  .dr-subtabs {
    flex-basis: 100%;
  }
}