/* ═══════════════════════════════════════════════════
   SYB ASCEND INTERNAL — FUB x SYB DESIGN SYSTEM
   ═══════════════════════════════════════════════════ */

:root {
  --canvas: #ffffff;
  --canvas-subtle: #fafafa;
  --canvas-muted: #f4f4f5;
  --canvas-emphasis: #e4e4e7;
  --line: #e4e4e7;
  --line-strong: #d4d4d8;
  --line-emphasis: #a1a1aa;
  --ink: #09090b;
  --ink-2: #3f3f46;
  --ink-3: #71717a;
  --ink-4: #a1a1aa;
  --ink-5: #d4d4d8;
  /* Surface / Text aliases (new design tokens) */
  --surface: #ffffff;
  --surface-2: #fafafa;
  --surface-3: #f4f4f5;
  --text: #09090b;
  --text-2: #3f3f46;
  --text-3: #71717a;
  --text-4: #a1a1aa;
  --text-5: #d4d4d8;
  --brand: #16a34a;
  --brand-hover: #15803d;
  --brand-active: #166534;
  --brand-subtle: #f0fdf4;
  --brand-muted: #dcfce7;
  --brand-border: #86efac;
  --brand-text: #166534;
  --brand-glow: rgba(22,163,74,0.1);
  --sidebar-bg: #0c0c0d;
  --sidebar-border: rgba(255,255,255,0.05);
  --sidebar-text: #e5e7eb;
  --sidebar-muted: #6b7280;
  --sidebar-hover: rgba(255,255,255,0.05);
  --sidebar-active-bg: rgba(22,163,74,0.1);
  --sidebar-active-text: #4ade80;
  --sidebar-active-indicator: #16a34a;
  --danger: #ef4444;
  --danger-hover: #dc2626;
  --danger-subtle: #fef2f2;
  --danger-border: #fca5a5;
  --danger-text: #991b1b;
  --warn: #f59e0b;
  --warn-subtle: #fffbeb;
  --warn-border: #fcd34d;
  --warn-text: #92400e;
  --info: #3b82f6;
  --info-subtle: #eff6ff;
  --info-border: #93c5fd;
  --info-text: #1e40af;
  --success: #22c55e;
  --success-subtle: #f0fdf4;
  --success-border: #86efac;
  --success-text: #166534;
  --purple: #8b5cf6;
  --purple-subtle: #f5f3ff;
  --purple-border: #c4b5fd;
  --purple-text: #5b21b6;
  --teal: #14b8a6;
  --teal-subtle: #f0fdfa;
  --teal-border: #99f6e4;
  --teal-text: #115e59;
  --orange: #f97316;
  --orange-subtle: #fff7ed;
  --orange-border: #fdba74;
  --orange-text: #9a3412;
  --shadow-xs: 0 1px 2px rgba(0,0,0,0.04);
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
  --shadow-md: 0 4px 8px rgba(0,0,0,0.07);
  --shadow-lg: 0 8px 20px rgba(0,0,0,0.08);
  --shadow-xl: 0 16px 32px rgba(0,0,0,0.10);
  --shadow-panel: -8px 0 32px rgba(0,0,0,0.08);
  --r-xs: 3px;
  --r-sm: 5px;
  --r: 7px;
  --r-md: 9px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-full: 9999px;
  --font: 'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  --mono: 'JetBrains Mono','Fira Code',ui-monospace,monospace;
  --sidebar-w: 220px;
  --sidebar-collapsed-w: 52px;
  --topbar-h: 48px;
  --panel-w: 460px;
  --t: all 0.12s ease;
  --t-slow: all 0.22s ease;
  --t-panel: all 0.2s cubic-bezier(0.4,0,0.2,1);

  /* Legacy aliases so existing JS color refs keep working */
  --bg: #f5f5f5;
  --bg2: #ffffff;
  --bg3: #f4f4f5;
  --bg4: #e4e4e7;
  --border: #e4e4e7;
  --border2: #d4d4d8;
  --border3: #a1a1aa;
  --text: #09090b;
  --text2: #3f3f46;
  --text3: #3f3f46;
  --muted: #71717a;
  --muted2: #a1a1aa;
  --green: #16a34a;
  --green2: #15803d;
  --green3: #166534;
  --green-light: #f0fdf4;
  --green-mid: #dcfce7;
  --green-border: #86efac;
  --green-glow: rgba(22,163,74,0.1);
  --red: #ef4444;
  --red2: #dc2626;
  --red-light: #fef2f2;
  --red-border: #fca5a5;
  --amber: #f59e0b;
  --amber2: #d97706;
  --amber-light: #fffbeb;
  --amber-border: #fcd34d;
  --blue: #3b82f6;
  --blue2: #2563eb;
  --blue-light: #eff6ff;
  --blue-border: #93c5fd;
  --radius: 7px;
  --radius-sm: 5px;
  --radius-md: 9px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;
  --shadow: 0 1px 3px rgba(0,0,0,0.06);
  --shadow-card: 0 4px 8px rgba(0,0,0,0.07);
  --accent: #16a34a;
  --black: #0c0c0d;
  --placeholder: #d1d5db;
  --brand-light: #f0fdf4;
  --brand-light-2: #dcfce7;
  --border-light: #f1f1f3;
  --blue-text: #1e40af;
}

/* ── Reset ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-family:var(--font);background:var(--canvas-subtle);color:var(--ink);font-size:13px;line-height:1.5;display:flex;min-height:100vh}
a{color:inherit;text-decoration:none}
button{font-family:var(--font)}
input,select,textarea{font-family:var(--font)}

/* ── Scrollbar ── */
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--canvas-emphasis);border-radius:var(--r-full)}
::-webkit-scrollbar-thumb:hover{background:var(--line-strong)}

/* ── Focus ── */
*:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:var(--r-sm)}

/* ── Selection ── */
::selection{background:var(--brand-muted);color:var(--brand-text)}

/* ── Animations ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@keyframes slideRight{from{transform:translateX(100%)}to{transform:translateX(0)}}
@keyframes slideInRight{from{transform:translateX(100%)}to{transform:translateX(0)}}
@keyframes slideInUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pop{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
@keyframes scaleIn{from{opacity:0;transform:scale(0.95)}to{opacity:1;transform:scale(1)}}
.fade-up{animation:fadeUp 0.18s ease forwards}
.animate-fadein{animation:fadeIn 0.2s ease forwards}
.animate-slidein{animation:slideInUp 0.2s ease forwards}
.skeleton{background:linear-gradient(90deg,var(--canvas-muted) 25%,var(--canvas-emphasis) 50%,var(--canvas-muted) 75%);background-size:200% 100%;animation:shimmer 1.4s infinite;border-radius:var(--r)}

/* ── App layout ── */
#app{display:none;width:100%;min-height:100vh}
#app.ready{display:flex}
.view{display:none}
.view.active{display:block}

/* ══════════════════════════════
   SIDEBAR
   ══════════════════════════════ */
/* Top navigation bar */
.sidebar{width:var(--sidebar-w);height:100vh;background:var(--sidebar-bg);border-right:1px solid var(--sidebar-border);display:flex;flex-direction:column;position:fixed;top:0;left:0;z-index:100;overflow:hidden}
.sidebar-brand{width:100%;padding:12px 14px;display:flex;align-items:center;gap:9px;border-bottom:1px solid var(--sidebar-border);flex-shrink:0}
.brand-icon{width:26px;height:26px;background:var(--brand);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:white;flex-shrink:0;letter-spacing:-0.5px}
.brand-info{min-width:0}
.brand-name{font-size:14px;font-weight:700;color:var(--sidebar-text);letter-spacing:-0.3px;white-space:nowrap}
.brand-tag{font-size:9px;color:var(--sidebar-muted);letter-spacing:0.8px;text-transform:uppercase;display:block;margin-top:1px;white-space:nowrap}
.sidebar-nav{flex:1;display:flex;flex-direction:column;padding:8px 8px;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--sidebar-border) transparent}
.sidebar-nav::-webkit-scrollbar{display:none}
.nav-section{display:contents}
.nav-section-label,.nav-label{display:block;font-size:10px;font-weight:600;color:var(--sidebar-muted);text-transform:uppercase;letter-spacing:.06em;padding:2px 8px;margin-bottom:2px}
.nav-item{display:flex;align-items:center;gap:8px;padding:0 10px;height:34px;border-radius:var(--r);cursor:pointer;color:var(--sidebar-muted);font-size:13px;font-weight:400;transition:var(--t);white-space:nowrap;position:relative;margin-bottom:1px}
.nav-item:hover{background:var(--sidebar-hover);color:var(--sidebar-text)}
.nav-item.active{background:rgba(74,222,128,0.1);color:var(--sidebar-active-text);font-weight:500}
.nav-item i{width:15px;font-size:13px;flex-shrink:0;text-align:center}
.nav-item .nav-icon{width:15px;font-size:13px;flex-shrink:0;text-align:center}
.nav-item.active i{color:var(--sidebar-active-text)}
.nav-text{flex:1}
.nav-badge{background:rgba(255,255,255,0.07);color:var(--sidebar-muted);font-size:10px;font-weight:600;padding:1px 6px;border-radius:var(--r-full);font-family:var(--mono)}
.nav-item.active .nav-badge{background:rgba(74,222,128,0.12);color:var(--sidebar-active-text)}
.sidebar-footer{display:flex;align-items:center;gap:6px;padding:10px 12px;border-top:1px solid var(--sidebar-border);flex-shrink:0}
.user-card{display:flex;align-items:center;gap:8px;padding:4px 8px;border-radius:var(--r);cursor:pointer;transition:var(--t)}
.user-card:hover{background:var(--sidebar-hover)}
.user-avatar{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand-active));display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:white;flex-shrink:0}
.user-info{min-width:0;max-width:130px}
.user-name{font-size:12px;font-weight:500;color:var(--sidebar-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-role{font-size:11px;color:var(--sidebar-muted);white-space:nowrap}
.user-role-text{font-size:10px;color:var(--sidebar-muted);margin-top:1px}
.sign-out-btn,.signout-btn{display:flex;align-items:center;gap:6px;padding:5px 8px;border-radius:var(--r);border:none;background:transparent;color:var(--sidebar-muted);font-size:12px;cursor:pointer;transition:var(--t);font-family:var(--font)}
.sign-out-btn:hover,.signout-btn:hover{background:rgba(239,68,68,0.06);color:#f87171}
.collapse-btn{display:none}

/* ══════════════════════════════
   MAIN / TOPBAR
   ══════════════════════════════ */
.main{margin-left:var(--sidebar-w);margin-top:0;flex:1;display:flex;flex-direction:column;min-height:100vh;background:var(--canvas-subtle);overflow:hidden}
.topbar{height:var(--topbar-h);background:var(--canvas);border-bottom:1px solid var(--line);padding:0 20px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:50;flex-shrink:0}
.topbar-left{display:flex;align-items:center;gap:10px}
.topbar-title h2,.page-title{font-size:14px;font-weight:600;color:var(--ink)}
.topbar-title p,.page-subtitle{font-size:12px;color:var(--ink-3)}
.topbar-sep{width:1px;height:14px;background:var(--line-strong)}
.topbar-right{display:flex;align-items:center;gap:4px;margin-left:auto;position:relative}
.topbar-refresh,.refresh-tag{font-size:11px;color:var(--ink-4);font-family:var(--mono);padding:0 8px}
.icon-btn{width:30px;height:30px;border-radius:var(--r);border:none;background:transparent;color:var(--ink-3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;transition:var(--t);position:relative}
.icon-btn:hover{background:var(--canvas-muted);color:var(--ink)}
.topbar-icon-btn{width:30px;height:30px;border-radius:var(--r);border:1px solid transparent;background:transparent;color:var(--ink-3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;transition:var(--t)}
.topbar-icon-btn:hover{background:var(--canvas-muted);color:var(--ink);border-color:var(--line)}

/* ══════════════════════════════
   CONTENT
   ══════════════════════════════ */
.content{padding:20px;flex:1;overflow-y:auto}
.page-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:20px;gap:12px}
.page-header-left{}
.page-header-title{font-size:18px;font-weight:700;color:var(--ink);letter-spacing:-0.3px}
.page-header-sub{font-size:12px;color:var(--ink-3);margin-top:2px}
.page-header-actions{display:flex;align-items:center;gap:8px}

/* ══════════════════════════════
   STAT CARDS
   ══════════════════════════════ */
.stats-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:16px}
.stat-card{background:var(--canvas);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 18px;position:relative;overflow:hidden;transition:var(--t)}
.stat-card:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}
.stat-card::after{content:'';position:absolute;left:0;top:16px;bottom:16px;width:3px;border-radius:0 var(--r-full) var(--r-full) 0}
.stat-card::before{display:none}
.stat-card.blue::after{background:var(--info)}
.stat-card.green::after{background:var(--brand)}
.stat-card.amber::after{background:var(--warn)}
.stat-card.red::after{background:var(--danger)}
.stat-card.purple::after{background:var(--purple)}
.stat-label{font-size:11px;font-weight:600;color:var(--ink-3);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:8px;display:flex;align-items:center;justify-content:space-between}
.stat-icon{width:24px;height:24px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:11px;flex-shrink:0}
.stat-card.blue .stat-icon{background:var(--info-subtle);color:var(--info)}
.stat-card.green .stat-icon{background:var(--brand-subtle);color:var(--brand)}
.stat-card.amber .stat-icon{background:var(--warn-subtle);color:var(--warn)}
.stat-card.red .stat-icon{background:var(--danger-subtle);color:var(--danger)}
.stat-card.purple .stat-icon{background:var(--purple-subtle);color:var(--purple)}
.stat-val{font-size:26px;font-weight:700;color:var(--ink);letter-spacing:-0.8px;line-height:1;margin-bottom:4px;font-family:var(--mono)}
.stat-meta{font-size:11px;color:var(--ink-4)}
.stat-trend{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:600;padding:2px 6px;border-radius:var(--r-full);margin-top:4px}
.stat-trend.up{background:var(--brand-subtle);color:var(--brand-text)}
.stat-trend.down{background:var(--danger-subtle);color:var(--danger-text)}

/* ══════════════════════════════
   CARDS
   ══════════════════════════════ */
.widget,.card{background:var(--canvas);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;transition:var(--t);padding:18px 20px}
.card-header{padding:12px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:10px}
.card-title,.widget-title{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:14px}
.card-subtitle{font-size:11px;color:var(--ink-3);margin-top:1px}
.card-body{padding:16px}

/* Dashboard grid helpers */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.dashboard-row{display:grid;gap:12px;margin-bottom:12px}
.dashboard-row.two-col{grid-template-columns:3fr 2fr}
.dashboard-row.two-eq{grid-template-columns:1fr 1fr}
.dashboard-row.three-col{grid-template-columns:1fr 1fr 1fr}
.chart-canvas-wrap{position:relative;height:160px;margin-top:8px}

/* ══════════════════════════════
   BUTTONS
   ══════════════════════════════ */
.btn{display:inline-flex;align-items:center;gap:5px;padding:0 12px;height:30px;border-radius:var(--r);font-size:12px;font-weight:500;font-family:var(--font);cursor:pointer;transition:var(--t);border:1px solid transparent;line-height:1;white-space:nowrap}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn i{font-size:11px}
.btn-primary{background:var(--brand);color:white;border-color:var(--brand);display:inline-flex;align-items:center;gap:5px;padding:0 12px;height:30px;border-radius:var(--r);font-size:12px;font-weight:500;font-family:var(--font);cursor:pointer;transition:var(--t);line-height:1;white-space:nowrap;box-shadow:0 1px 2px rgba(22,163,74,.2)}
.btn-primary:hover:not(:disabled){background:var(--brand-hover);box-shadow:0 2px 4px rgba(22,163,74,.25)}
.btn-primary:active:not(:disabled){background:var(--brand-active)}
.btn-secondary{background:var(--canvas);color:var(--ink-2);border:1px solid var(--line-strong);display:inline-flex;align-items:center;gap:5px;padding:0 12px;height:30px;border-radius:var(--r);font-size:12px;font-weight:500;font-family:var(--font);cursor:pointer;transition:var(--t);line-height:1;white-space:nowrap}
.btn-secondary:hover:not(:disabled){background:var(--canvas-muted);border-color:var(--line-emphasis)}
.btn-ghost{background:var(--canvas);color:var(--ink-2);border:1px solid var(--line-strong);display:inline-flex;align-items:center;gap:5px;padding:0 12px;height:30px;border-radius:var(--r);font-size:12px;font-weight:500;font-family:var(--font);cursor:pointer;transition:var(--t)}
.btn-ghost:hover:not(:disabled){background:var(--canvas-muted);border-color:var(--line-emphasis)}
.btn-ghost-sm{background:transparent;color:var(--ink-2);border:1px solid var(--line-strong);border-radius:var(--r-sm);padding:0 9px;height:26px;font-size:11px;font-weight:500;display:inline-flex;align-items:center;gap:4px;cursor:pointer;transition:var(--t);font-family:var(--font)}
.btn-ghost-sm:hover{background:var(--canvas-muted);border-color:var(--line-emphasis)}
.btn-danger{background:var(--danger-subtle);color:var(--danger);border-color:var(--danger-border)}
.btn-danger:hover:not(:disabled){background:#fee2e2}
.btn-sm{height:26px;padding:0 9px;font-size:11px;border-radius:var(--r-sm)}
.btn-lg{height:36px;padding:0 16px;font-size:13px;border-radius:var(--r-md)}
.btn-icon{width:30px;height:30px;padding:0;justify-content:center}
.btn-icon.btn-sm{width:26px;height:26px}

/* ══════════════════════════════
   TABLE
   ══════════════════════════════ */
.table-wrap{overflow-x:auto;background:var(--canvas);border:1px solid var(--line);border-radius:var(--r-lg)}
table{width:100%;border-collapse:collapse;font-size:12px}
thead th{text-align:left;padding:8px 14px;color:var(--ink-3);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;border-bottom:1px solid var(--line);background:var(--canvas-subtle);white-space:nowrap;position:sticky;top:0;z-index:1}
thead th:first-child{width:36px;padding-left:14px}
tbody tr{border-bottom:1px solid var(--line);transition:background 0.08s;cursor:pointer}
tbody tr:last-child{border-bottom:none}
tbody tr:hover{background:var(--canvas-subtle)}
tbody tr:hover .row-actions{opacity:1}
tbody tr.selected{background:var(--brand-subtle)}
tbody tr.selected:hover{background:var(--brand-muted)}
tbody tr.row-stale{border-left:2px solid var(--danger-border)}
tbody td{padding:9px 14px;vertical-align:middle;color:var(--ink-2)}
.cell-primary{font-weight:500;color:var(--ink)}
.lead-cell,.lead-cell-inner{display:flex;align-items:center;gap:9px}
.lead-avatar{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:white;flex-shrink:0}
.lead-name{font-weight:500;color:var(--ink);font-size:12px}
.lead-title-small,.lead-title-text{font-size:11px;color:var(--ink-4);margin-top:1px}
.row-actions{display:flex;gap:4px;opacity:0;transition:opacity 0.1s}
.row-action-btn{width:24px;height:24px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--canvas);color:var(--ink-3);display:flex;align-items:center;justify-content:center;font-size:11px;cursor:pointer;transition:var(--t)}
.row-action-btn:hover{background:var(--canvas-muted);color:var(--ink);border-color:var(--line-strong)}
.cell-mono{font-family:var(--mono);font-size:11px}
.cell-muted{color:var(--ink-4);font-size:11px}
.table-footer{padding:8px 14px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--ink-3);background:var(--canvas-subtle)}
.pagination{display:flex;align-items:center;gap:6px;margin-top:14px;justify-content:flex-end}
.page-btns{display:flex;gap:2px}
.page-btn{width:26px;height:26px;border-radius:var(--r-sm);border:1px solid var(--line);background:var(--canvas);color:var(--ink-3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:11px;font-family:var(--font);transition:var(--t);padding:5px 10px}
.page-btn:hover{border-color:var(--line-strong);color:var(--ink)}
.page-btn.active{background:var(--brand);border-color:var(--brand);color:white}
.page-btn:disabled{opacity:.4;cursor:not-allowed}
.page-info{font-size:12px;color:var(--ink-3);font-family:var(--mono)}

/* ══════════════════════════════
   BADGES
   ══════════════════════════════ */
.badge{display:inline-flex;align-items:center;padding:2px 7px;border-radius:var(--r-full);font-size:11px;font-weight:500;line-height:1.5;white-space:nowrap;border:1px solid transparent}
.badge-new{background:var(--canvas-muted);color:var(--ink-3);border-color:var(--line-strong)}
.badge-discovery{background:var(--info-subtle);color:var(--info-text);border-color:var(--info-border)}
.badge-contacted{background:var(--purple-subtle);color:var(--purple-text);border-color:var(--purple-border)}
.badge-audit{background:var(--teal-subtle);color:var(--teal-text);border-color:var(--teal-border)}
.badge-proposal{background:var(--warn-subtle);color:var(--warn-text);border-color:var(--warn-border)}
.badge-negotiation{background:var(--orange-subtle);color:var(--orange-text);border-color:var(--orange-border)}
.badge-won{background:var(--success-subtle);color:var(--success-text);border-color:var(--success-border)}
.badge-lost{background:var(--danger-subtle);color:var(--danger-text);border-color:var(--danger-border)}
.badge-high{background:var(--danger-subtle);color:var(--danger-text);border-color:var(--danger-border)}
.badge-medium{background:var(--warn-subtle);color:var(--warn-text);border-color:var(--warn-border)}
.badge-low{background:var(--canvas-muted);color:var(--ink-3);border-color:var(--line-strong)}
.badge-admin{background:var(--brand-subtle);color:var(--brand-text);border-color:var(--brand-border)}
.badge-rep{background:var(--canvas-muted);color:var(--ink-3);border-color:var(--line-strong)}
.title-badge{display:inline-flex;align-items:center;padding:2px 6px;border-radius:var(--r-full);font-size:10px;font-weight:700;letter-spacing:.3px;background:rgba(74,222,128,.1);color:#4ade80;border:1px solid rgba(74,222,128,.2)}
.title-badge-rep{background:var(--canvas-muted);color:var(--ink-3);border:1px solid var(--line-strong)}
.score-badge{display:inline-flex;align-items:center;padding:2px 7px;border-radius:var(--r-full);font-size:11px;font-weight:600;white-space:nowrap}

/* ══════════════════════════════
   INPUTS
   ══════════════════════════════ */
.form-input,.form-select,.form-textarea,.search-input,.filter-select{background:var(--canvas);border:1px solid var(--line-strong);border-radius:var(--r);padding:6px 10px;color:var(--ink);font-size:12px;font-family:var(--font);outline:none;transition:var(--t);width:100%}
.form-input:hover,.form-select:hover,.filter-select:hover{border-color:var(--line-emphasis)}
.form-input:focus,.form-select:focus,.form-textarea:focus,.search-input:focus,.filter-select:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow)}
.form-input::placeholder,.form-textarea::placeholder{color:var(--ink-5)}
.form-input.error,.form-select.error{border-color:var(--danger)}
.form-select option{background:var(--canvas)}
.form-textarea{resize:vertical;min-height:72px;line-height:1.5}
.form-label{font-size:11px;font-weight:600;color:var(--ink-2);letter-spacing:.3px;margin-bottom:5px;display:block;text-transform:uppercase}
.required-star{color:var(--danger)}
.form-hint{font-size:11px;color:var(--ink-4);margin-top:3px}
.form-error{font-size:11px;color:var(--danger);margin-top:3px}
.form-error-msg{color:var(--danger);font-size:12px;margin-top:8px;display:none}
.form-error-msg.show{display:block}
.search-wrap{position:relative;flex:1;min-width:200px}
.search-wrap i,.search-icon{position:absolute;left:9px;top:50%;transform:translateY(-50%);color:var(--ink-4);font-size:11px;pointer-events:none}
.search-input{padding-left:28px!important;height:30px}
.filter-select{height:30px;padding:0 9px;font-size:12px;cursor:pointer;width:auto}

/* Form sections */
.form-section{margin-bottom:24px}
.form-section-title{font-size:12px;font-weight:600;color:var(--ink-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.form-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-group{display:flex;flex-direction:column;gap:5px}
.form-group.full{grid-column:1/-1}
.form-actions{display:flex;gap:10px;margin-top:8px}

/* ══════════════════════════════
   TOOLBAR
   ══════════════════════════════ */
.leads-toolbar{padding:10px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--canvas)}
.toolbar-sep{width:1px;height:18px;background:var(--line-strong);margin:0 2px}
.toggle-label{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--ink);white-space:nowrap;cursor:pointer;user-select:none}
.toggle-label input[type="checkbox"]{accent-color:var(--accent);width:14px;height:14px;cursor:pointer}

/* ══════════════════════════════
   DETAIL PANEL
   ══════════════════════════════ */
#detail-panel,.detail-panel{position:fixed;right:0;top:0;bottom:0;width:var(--panel-w);background:var(--canvas);border-left:1px solid var(--line);box-shadow:var(--shadow-panel);z-index:400;display:flex;flex-direction:column;transform:translateX(100%);transition:var(--t-panel);overflow:hidden}
#detail-panel.open,.detail-panel.open{transform:translateX(0)}
#panel-overlay,.panel-overlay{position:fixed;inset:0;background:rgba(17,24,39,.35);backdrop-filter:blur(1px);z-index:300;opacity:0;pointer-events:none;transition:opacity .18s}
#panel-overlay.open,.panel-overlay.open{opacity:1;pointer-events:all}
.panel-header{padding:16px 18px 14px;border-bottom:1px solid var(--line);flex-shrink:0;background:var(--canvas);position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:12px}
.panel-header-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}
.panel-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:white;flex-shrink:0}
.panel-name{font-size:15px;font-weight:700;color:var(--ink);letter-spacing:-0.2px;line-height:1.3}
.panel-sub,.panel-subtitle{font-size:12px;color:var(--ink-3);margin-top:2px}
.panel-close{margin-left:auto;width:26px;height:26px;border-radius:var(--r);border:1px solid var(--line);background:transparent;color:var(--ink-3);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:11px;transition:var(--t);flex-shrink:0}
.panel-close:hover{background:var(--canvas-muted);color:var(--ink)}
.panel-badges{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.panel-body{flex:1;overflow-y:auto;background:var(--canvas)}
.panel-section{padding:14px 18px;border-bottom:1px solid var(--line)}
.panel-section:last-child{border-bottom:none}
.panel-section-title{font-size:10px;font-weight:700;color:var(--ink-4);text-transform:uppercase;letter-spacing:.8px;margin-bottom:10px}
.panel-row{display:flex;align-items:flex-start;gap:8px;margin-bottom:8px}
.panel-row:last-child{margin-bottom:0}
.panel-row-label{font-size:12px;color:var(--ink-4);width:110px;flex-shrink:0;padding-top:1px}
.panel-row-val{font-size:12px;color:var(--ink-2);flex:1;word-break:break-word}
.panel-row-val a{color:var(--accent);display:flex;align-items:center;gap:4px}
.panel-actions{padding:12px 18px;border-top:1px solid var(--line);display:flex;gap:8px;flex-wrap:wrap;background:var(--canvas-subtle);flex-shrink:0}
.panel-btn{flex:1;min-width:80px;padding:8px;font-size:12px;font-weight:600;border-radius:7px;border:1.5px solid var(--line-strong);background:none;color:var(--ink);transition:var(--t);display:flex;align-items:center;justify-content:center;gap:5px;cursor:pointer;font-family:var(--font)}
.panel-btn:hover{background:var(--canvas-muted)}
.panel-btn.won{border-color:var(--brand);color:var(--brand)}
.panel-btn.won:hover{background:var(--brand-subtle)}
.panel-btn.lost{border-color:var(--danger);color:var(--danger)}
.panel-btn.lost:hover{background:var(--danger-subtle)}
.panel-btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.panel-btn.primary:hover{background:var(--brand-hover);border-color:var(--brand-hover)}
.panel-edit-input,.panel-edit-select{background:var(--canvas-muted);border:1.5px solid var(--line-strong);color:var(--ink);border-radius:6px;padding:5px 8px;font-size:13px;outline:none;width:100%;font-family:var(--font)}
.panel-edit-input:focus,.panel-edit-select:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow)}
.detail-val{position:relative;cursor:text}
.detail-val:hover .dv-text{background:var(--canvas-muted);border-radius:4px}
.dv-text{display:inline-block;min-width:60px;padding:2px 4px;border-radius:4px;transition:background .12s;font-size:12px;color:var(--ink-2);cursor:pointer}
.edit-hint{font-style:italic;color:var(--ink-4);font-size:12px}
.detail-val.editing .dv-text{display:none}
.detail-val .dv-input{display:none;width:100%;padding:4px 8px;border:1.5px solid var(--brand);border-radius:6px;font-size:13px;outline:none;background:var(--canvas);font-family:var(--font);box-shadow:0 0 0 3px var(--brand-glow)}

/* ══════════════════════════════
   KANBAN
   ══════════════════════════════ */
.kanban-wrap{display:flex;gap:10px;padding:16px;overflow-x:auto;align-items:flex-start;min-height:480px;background:var(--canvas-subtle);padding-bottom:12px;scrollbar-width:thin;scrollbar-color:#d1d5db #f9fafb}
.kanban-wrap::-webkit-scrollbar{height:6px}
.kanban-wrap::-webkit-scrollbar-track{background:#f9fafb}
.kanban-wrap::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}
.kanban-col{min-width:210px;width:210px;flex-shrink:0}
.kanban-header{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;border-radius:var(--r-md) var(--r-md) 0 0;border:1px solid var(--line);border-bottom:none;background:var(--canvas)}
.kanban-header-left{display:flex;align-items:center;gap:6px}
.kanban-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.kanban-col-name{font-size:12px;font-weight:600;color:var(--ink-2)}
.kanban-count{font-size:11px;font-family:var(--mono);background:var(--canvas-muted);color:var(--ink-3);padding:1px 6px;border-radius:var(--r-full);font-weight:600}
.kanban-body{border:1px solid var(--line);border-radius:0 0 var(--r-md) var(--r-md);background:var(--canvas-subtle);min-height:280px;padding:6px;display:flex;flex-direction:column;gap:5px}
.kanban-card{background:var(--canvas);border:1px solid var(--line);border-radius:var(--r);padding:10px 11px;cursor:grab;transition:var(--t);position:relative}
.kanban-card:hover{box-shadow:var(--shadow-md);border-color:var(--line-strong)}
.kanban-card:active{cursor:grabbing}
.kanban-card.dragging{opacity:.35;box-shadow:var(--shadow-xl);cursor:grabbing}
.kanban-body.drag-over{background:var(--brand-subtle);outline:2px dashed var(--brand-border);outline-offset:-3px}
.kanban-card-name{font-size:12px;font-weight:600;color:var(--ink);margin-bottom:2px}
.kanban-card-co{font-size:11px;color:var(--ink-4);margin-bottom:7px}
.kanban-card-footer{display:flex;align-items:center;justify-content:space-between}
.kanban-rep-avatar{width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:7px;font-weight:700;color:white;border:1.5px solid var(--canvas);position:absolute;top:8px;right:8px}
.kanban-more{font-size:11px;color:var(--ink-4);padding:6px;text-align:center;cursor:pointer}
.kanban-more:hover{color:var(--accent)}

/* ══════════════════════════════
   BULK BAR
   ══════════════════════════════ */
.bulk-bar{position:fixed;bottom:0;left:0;right:0;height:52px;background:var(--ink);display:none;align-items:center;padding:0 20px;gap:10px;z-index:300;border-top:1px solid rgba(255,255,255,.08)}
.bulk-bar.visible,.bulk-bar[style*="flex"]{display:flex}
.bulk-bar-left{display:flex;align-items:center;gap:12px}
.bulk-bar-right{display:flex;align-items:center;gap:8px;position:relative}
.bulk-count,.bulk-bar-count{font-size:12px;font-weight:600;color:white;margin-right:4px}
.bulk-btn{display:inline-flex;align-items:center;gap:5px;padding:0 11px;height:28px;border-radius:var(--r);font-size:11px;font-weight:500;cursor:pointer;border:none;transition:var(--t);font-family:var(--font)}
.bulk-btn-primary,.bulk-btn-green{background:var(--brand);color:white}
.bulk-btn-primary:hover,.bulk-btn-green:hover{background:var(--brand-hover)}
.bulk-btn-ghost{background:rgba(255,255,255,.08);color:rgba(255,255,255,.85);border:1px solid rgba(255,255,255,.1)}
.bulk-btn-ghost:hover{background:rgba(255,255,255,.12)}
.bulk-btn-danger,.bulk-btn-red{background:rgba(239,68,68,.15);color:#fca5a5}
.bulk-btn-danger:hover,.bulk-btn-red:hover{background:rgba(239,68,68,.22)}
.bulk-btn-muted{background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.6)}
.bulk-dropdown{position:absolute;bottom:calc(100% + 8px);right:0;background:var(--canvas);border-radius:10px;box-shadow:0 8px 32px rgba(0,0,0,0.18);z-index:301;min-width:180px;overflow:hidden;border:1px solid var(--line)}
.bulk-dd-item{padding:9px 14px;font-size:13px;color:var(--ink);cursor:pointer;transition:background .1s}
.bulk-dd-item:hover{background:var(--canvas-muted)}

/* ══════════════════════════════
   TOAST
   ══════════════════════════════ */
#toast,.toast{position:fixed;bottom:20px;right:20px;background:var(--ink);color:white;border-radius:var(--r-md);padding:10px 14px;font-size:12px;font-weight:500;display:flex;align-items:center;gap:7px;z-index:999;opacity:0;transform:translateY(8px);transition:all .18s cubic-bezier(0.4,0,0.2,1);max-width:300px;box-shadow:var(--shadow-xl);border:1px solid rgba(255,255,255,.06)}
#toast.show,.toast.show{opacity:1;transform:translateY(0)}
#toast i,.toast i{color:#4ade80;flex-shrink:0;font-size:13px}
.toast.toast-error i{color:#f87171}
.toast.toast-warn i{color:#fbbf24}

/* ══════════════════════════════
   LOGIN GATE
   ══════════════════════════════ */
#gate{position:fixed;inset:0;background:var(--canvas-subtle);display:flex;align-items:center;justify-content:center;z-index:9999;overflow:hidden}
#gate::before{content:'';position:absolute;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,var(--brand-subtle) 0%,transparent 65%);top:-100px;right:-100px;pointer-events:none}
#gate::after{content:'';position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,var(--brand-subtle) 0%,transparent 65%);bottom:-50px;left:-50px;pointer-events:none}
.gate-inner{width:100%;max-width:360px;padding:0 20px;position:relative;z-index:1}
.gate-logo{display:flex;align-items:center;gap:10px;margin-bottom:36px}
.gate-logo-icon{width:36px;height:36px;background:var(--brand);border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;color:white;box-shadow:0 0 0 5px var(--brand-subtle),0 0 0 6px var(--brand-muted)}
.gate-logo-name{font-size:16px;font-weight:700;color:var(--ink);letter-spacing:-0.3px}
.gate-logo-sub{font-size:11px;color:var(--ink-3);margin-top:1px}
.gate-heading{font-size:22px;font-weight:700;color:var(--ink);letter-spacing:-0.5px;margin-bottom:5px}
.gate-subheading{font-size:13px;color:var(--ink-3);margin-bottom:24px}
.gate-form{display:flex;flex-direction:column;gap:12px}
.gate-field{}
.gate-label{font-size:12px;font-weight:600;color:var(--ink-2);margin-bottom:5px;display:block}
.gate-input{width:100%;height:38px;padding:0 11px;border:1.5px solid var(--line-strong);border-radius:var(--r-md);background:var(--canvas);color:var(--ink);font-size:13px;font-family:var(--font);outline:none;transition:var(--t)}
.gate-input:hover{border-color:var(--line-emphasis)}
.gate-input:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow)}
.gate-input::placeholder{color:var(--ink-5)}
.gate-pw-wrap{position:relative}
.gate-pw-wrap .gate-input{padding-right:40px}
.gate-pw-toggle{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--ink-4);cursor:pointer;font-size:14px;padding:0;display:flex;align-items:center}
.gate-pw-toggle:hover{color:var(--ink-3)}
.gate-btn{width:100%;height:38px;background:var(--brand);color:white;border:none;border-radius:var(--r-md);font-size:13px;font-weight:600;font-family:var(--font);cursor:pointer;transition:var(--t);margin-top:4px;box-shadow:0 1px 3px rgba(22,163,74,.25)}
.gate-btn:hover{background:var(--brand-hover);box-shadow:0 2px 6px rgba(22,163,74,.3)}
.gate-btn:active{transform:translateY(1px)}
.gate-btn:disabled{opacity:.6;cursor:not-allowed}
.gate-err{font-size:12px;color:var(--danger);font-weight:500;min-height:18px;margin-top:-4px;display:none}
.gate-err.show{display:block}
.gate-error{font-size:12px;color:var(--danger);font-weight:500;display:none}
.gate-error.show{display:block}
.gate-footer{margin-top:24px;text-align:center;font-size:11px;color:var(--ink-4)}

/* ══════════════════════════════
   FOLLOW-UP WIDGET
   ══════════════════════════════ */
.followup-widget{background:var(--warn-subtle);border:1px solid var(--warn-border);border-radius:var(--r-lg);padding:12px 14px;margin-bottom:16px}
.followup-widget-header{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--ink);margin-bottom:10px}
.followup-count-badge{margin-left:auto;background:var(--warn);color:white;font-size:10px;font-weight:700;border-radius:var(--r-full);padding:1px 7px}
.followup-list{display:flex;flex-direction:column;gap:6px}
.followup-item{display:flex;align-items:center;gap:9px;padding:7px 10px;background:var(--canvas);border-radius:var(--r);border:1px solid var(--line)}
.followup-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;background:var(--warn)}
.followup-item.overdue .followup-dot{background:var(--danger)}
.followup-info{flex:1;min-width:0}
.followup-lead{font-size:12px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.followup-type{font-size:11px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.followup-date-badge{font-size:10px;font-weight:700;padding:2px 7px;border-radius:var(--r-full);flex-shrink:0}
.followup-today{background:var(--brand-muted);color:var(--brand-text)}
.followup-overdue{background:var(--danger-subtle);color:var(--danger-text)}

/* ══════════════════════════════
   NOTES
   ══════════════════════════════ */
.panel-notes-section .notes-compose{display:flex;gap:7px;margin-bottom:10px;align-items:flex-start}
.notes-compose{display:flex;gap:7px;margin-bottom:10px;align-items:flex-start}
.notes-input{flex:1;padding:7px 10px;border:1px solid var(--line-strong);border-radius:var(--r);font-size:12px;resize:none;outline:none;background:var(--canvas);font-family:var(--font)}
.notes-input:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow)}
.notes-add-btn{background:var(--brand);color:white;border:none;border-radius:var(--r);padding:6px 12px;font-size:12px;font-weight:600;white-space:nowrap;cursor:pointer;font-family:var(--font);transition:var(--t);height:32px;display:flex;align-items:center;gap:4px}
.notes-add-btn:hover{background:var(--brand-hover)}
.notes-feed{display:flex;flex-direction:column;gap:6px}
.note-card{background:var(--canvas-subtle);border-radius:var(--r);padding:9px 11px;border-left:2px solid var(--brand-border)}
.note-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.note-author{font-size:11px;font-weight:600;color:var(--brand-text)}
.note-time{font-size:10px;color:var(--ink-4)}
.note-body{font-size:12px;color:var(--ink-2);line-height:1.5;white-space:pre-wrap}
.notes-empty{font-size:11px;color:var(--ink-4);text-align:center;padding:10px 0;font-style:italic}

/* ══════════════════════════════
   ACTIVITY TIMELINE
   ══════════════════════════════ */
.timeline-feed{display:flex;flex-direction:column}
.timeline-empty{font-size:12px;color:var(--ink-4);text-align:center;padding:14px 0;font-style:italic}
.timeline-item{display:flex;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.timeline-item:last-child{border-bottom:none}
.timeline-icon{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.timeline-content{flex:1;min-width:0}
.timeline-header{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:2px}
.timeline-type{font-size:12px;font-weight:600;color:var(--ink)}
.timeline-outcome{font-size:11px;font-weight:500}
.timeline-time{font-size:10px;color:var(--ink-4);margin-left:auto;white-space:nowrap}
.timeline-rep{font-size:11px;color:var(--ink-3);margin-bottom:3px}
.timeline-notes{font-size:11px;color:var(--ink-2);line-height:1.5;background:var(--canvas-subtle);border-radius:var(--r-sm);padding:5px 8px;margin-top:4px}
.timeline-followup{font-size:11px;color:var(--info);margin-top:3px}
.timeline-count-badge{display:inline-flex;align-items:center;justify-content:center;background:var(--canvas-muted);color:var(--ink-3);font-size:10px;font-weight:700;border-radius:var(--r-full);padding:1px 7px;margin-left:4px}
.timeline-log-btn{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;background:var(--brand);color:#fff;border:none;border-radius:var(--r);font-size:11px;font-weight:600;cursor:pointer;font-family:var(--font)}
.timeline-log-btn:hover{background:var(--brand-hover)}
.timeline-form{background:var(--canvas-subtle);border-radius:var(--r);padding:10px;margin-top:8px;display:flex;flex-direction:column;gap:8px;border:1px solid var(--line)}
.timeline-form-row{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.timeline-form select,.timeline-form-textarea,.timeline-form input[type=date],.timeline-form textarea,.timeline-form input{width:100%;padding:6px 9px;border:1px solid var(--line-strong);border-radius:var(--r);font-size:12px;font-family:var(--font);background:var(--canvas);outline:none;color:var(--ink)}
.timeline-form select:focus,.timeline-form-textarea:focus,.timeline-form input:focus,.timeline-form textarea:focus{border-color:var(--brand)}
.timeline-form-actions{display:flex;gap:7px;justify-content:flex-end}

/* ══════════════════════════════
   GLOBAL SEARCH
   ══════════════════════════════ */
.topbar-search-wrap{display:flex;align-items:center;gap:0;position:relative}
.topbar-search-input{width:0;max-width:240px;opacity:0;border:none;outline:none;background:var(--canvas-subtle);border-radius:var(--r);padding:5px 10px;font-size:12px;color:var(--ink);transition:width .2s,opacity .15s,padding .2s;overflow:hidden;pointer-events:none;font-family:var(--font)}
.topbar-search-input.open{width:200px;opacity:1;pointer-events:auto;border:1px solid var(--line-strong);margin-left:5px}
.topbar-search-input.open:focus{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand-glow)}
.search-results-dropdown{position:absolute;top:calc(100% + 5px);right:0;width:320px;background:var(--canvas);border-radius:var(--r-lg);box-shadow:var(--shadow-xl);z-index:500;overflow:hidden;border:1px solid var(--line)}
.search-result-item{display:flex;align-items:center;gap:9px;padding:9px 12px;cursor:pointer;transition:background .08s}
.search-result-item:hover,.search-result-item.selected{background:var(--canvas-subtle)}
.search-result-avatar{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:10px;font-weight:700;flex-shrink:0}
.search-result-info{flex:1;min-width:0}
.search-result-name{font-size:12px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.search-result-sub{font-size:11px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.search-result-stage{flex-shrink:0}
.search-result-item mark{background:var(--brand-muted);color:var(--brand-text);border-radius:2px;padding:0 1px}
.search-no-results{padding:12px;font-size:12px;color:var(--ink-3);text-align:center}

/* ══════════════════════════════
   REP PERFORMANCE
   ══════════════════════════════ */
.rep-perf-table,.rep-perf-wrap{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;margin-top:10px}
.rep-perf-header{display:grid;grid-template-columns:200px repeat(6,1fr);padding:8px 14px;background:var(--canvas-subtle);border-bottom:1px solid var(--line)}
.rep-perf-header div{font-size:10px;font-weight:700;color:var(--ink-3);text-transform:uppercase;letter-spacing:.6px}
.rep-perf-row{display:grid;grid-template-columns:200px repeat(6,1fr);padding:10px 14px;border-bottom:1px solid var(--line);align-items:center;transition:background .08s;cursor:pointer}
.rep-perf-row:last-child{border-bottom:none}
.rep-perf-row:hover{background:var(--canvas-subtle)}
.rep-perf-name{display:flex;align-items:center;gap:9px}
.rep-avatar-sm{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:9px;font-weight:700;flex-shrink:0}
.rep-perf-stat{font-size:12px;color:var(--ink-2);font-family:var(--mono)}
.dash-section-title{font-size:11px;font-weight:700;color:var(--ink-3);text-transform:uppercase;letter-spacing:.6px;margin-bottom:10px;margin-top:18px}

/* ══════════════════════════════
   PIPELINE
   ══════════════════════════════ */
.pipeline-stage-row{display:grid;grid-template-columns:120px 1fr 50px 65px;gap:10px;align-items:center;margin-bottom:7px}
.pipeline-stage-name{font-size:12px;color:var(--ink-3);font-weight:500}
.pipeline-bar-bg{height:5px;background:var(--canvas-muted);border-radius:var(--r-full);overflow:hidden}
.pipeline-bar-fill{height:100%;border-radius:var(--r-full);transition:width .5s cubic-bezier(0.4,0,0.2,1)}
.pipeline-count{font-size:11px;font-family:var(--mono);color:var(--ink-2);text-align:right}
.pipeline-value{font-size:11px;color:var(--ink-4);font-family:var(--mono);text-align:right}

/* ══════════════════════════════
   SAVED VIEWS
   ══════════════════════════════ */
.saved-views-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:7px 16px;border-bottom:1px solid var(--line);background:var(--canvas-subtle)}
.saved-views-label{font-size:10px;color:var(--ink-3);font-weight:600;text-transform:uppercase;letter-spacing:.5px;flex-shrink:0}
.saved-view-pill{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:var(--r-full);background:var(--brand-subtle);border:1px solid var(--brand-border);color:var(--brand-text);font-size:11px;font-weight:500;cursor:pointer;transition:var(--t)}
.saved-view-pill:hover{background:var(--brand-muted)}
.pill-x{font-size:10px;color:var(--brand-text);margin-left:2px;cursor:pointer;padding:0 1px;opacity:.6}
.pill-x:hover{color:var(--danger);opacity:1}
.save-view-modal{background:var(--canvas);border:1px solid var(--line-strong);border-radius:var(--r-md);padding:10px 12px;box-shadow:var(--shadow-lg);display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.save-view-input{flex:1;min-width:140px;padding:5px 9px;border:1px solid var(--line-strong);border-radius:var(--r);font-size:12px;outline:none;font-family:var(--font)}
.save-view-input:focus{border-color:var(--brand)}

/* ══════════════════════════════
   CONTACTED BADGES
   ══════════════════════════════ */
.contacted-badge{display:inline-flex;align-items:center;padding:2px 7px;border-radius:var(--r-full);font-size:10px;font-weight:600;white-space:nowrap}
.contacted-today{background:var(--success-subtle);color:var(--success-text)}
.contacted-recent{background:var(--brand-subtle);color:var(--brand-text)}
.contacted-warn{background:var(--warn-subtle);color:var(--warn-text)}
.contacted-stale{background:var(--danger-subtle);color:var(--danger-text)}
.contacted-never{background:var(--canvas-muted);color:var(--ink-4)}
.leads-table tr.row-stale{border-left:2px solid var(--danger-border)}

/* ══════════════════════════════
   MISC UI
   ══════════════════════════════ */
.bell-badge{position:absolute;top:3px;right:3px;background:var(--danger);color:white;font-size:8px;font-weight:700;border-radius:var(--r-full);padding:1px 4px;line-height:1.3;pointer-events:none;min-width:14px;text-align:center}

/* Stage grid (dashboard) */
.stage-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px;margin-top:10px}
.stage-col{background:var(--canvas-subtle);border:1px solid var(--line);border-radius:var(--r-md);padding:10px;text-align:center}
.stage-col-name{font-size:10px;font-weight:600;color:var(--ink-3);text-transform:uppercase;letter-spacing:.4px;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stage-count{font-size:22px;font-weight:700;font-family:var(--mono);line-height:1;margin-bottom:2px}
.prob-bar{height:3px;background:var(--canvas-emphasis);border-radius:var(--r-full);overflow:hidden;margin:6px 0 3px}
.prob-fill{height:100%;border-radius:var(--r-full)}
.prob-pct{font-size:9px;color:var(--ink-4);font-family:var(--mono)}

/* Source/Priority rows (dashboard) */
.source-row{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.source-label{font-size:12px;color:var(--ink-3);width:110px;flex-shrink:0}
.source-bar-wrap{flex:1;height:5px;background:var(--canvas-muted);border-radius:3px}
.source-bar-fill{height:100%;border-radius:3px;background:var(--accent);transition:width .3s}
.source-count{font-size:12px;font-family:var(--mono);color:var(--ink-3);width:28px;text-align:right;flex-shrink:0}
.priority-row{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.priority-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.priority-name{font-size:12px;width:52px;color:var(--ink)}
.priority-bar-wrap{flex:1;height:5px;background:var(--canvas-muted);border-radius:3px}
.priority-bar-fill{height:100%;border-radius:3px;transition:width .3s}
.priority-pct{font-size:12px;font-family:var(--mono);color:var(--ink-3);width:36px;text-align:right}

/* Loading overlay */
#loading-overlay{position:absolute;inset:0;background:rgba(255,255,255,.92);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:100;gap:16px}
.spinner{width:36px;height:36px;border:3px solid var(--line-strong);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}
#loading-overlay p{color:var(--ink-3);font-size:14px}

/* Autocomplete */
.autocomplete-list{position:absolute;top:100%;left:0;right:0;background:var(--canvas);border:1px solid var(--line-strong);border-radius:8px;max-height:200px;overflow-y:auto;z-index:50;display:none;box-shadow:var(--shadow-md)}
.autocomplete-list.open{display:block}
.autocomplete-item{padding:8px 12px;font-size:13px;cursor:pointer;transition:background var(--t);color:var(--ink)}
.autocomplete-item:hover{background:var(--canvas-muted)}
.ac-wrap{position:relative}

/* Empty State */
.empty-state{text-align:center;padding:60px 20px;color:var(--ink-3)}
.empty-state i{font-size:40px;margin-bottom:12px;opacity:.3;display:block}
.empty-state p{font-size:14px}
.leads-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 20px;gap:16px;text-align:center}
.leads-empty-state i{font-size:48px;color:var(--ink-3);opacity:.3}
.leads-empty-state h3{font-size:18px;font-weight:700;color:var(--ink)}
.leads-empty-state p{color:var(--ink-3);font-size:14px}
.leads-empty-state .empty-actions{display:flex;gap:10px;margin-top:4px}

/* Activity Log */
.activity-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.activity-log-form{background:var(--canvas);border:1px solid var(--line-strong);border-radius:var(--r);padding:20px;margin-bottom:20px;display:none;box-shadow:var(--shadow-sm)}
.activity-log-form.show{display:block}
.activity-list{display:flex;flex-direction:column;gap:10px}
.activity-item{background:var(--canvas);border:1px solid var(--line);border-radius:var(--r);padding:14px;display:flex;gap:12px;align-items:flex-start;box-shadow:var(--shadow-sm)}
.activity-icon{width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
.activity-icon.call{background:var(--info-subtle);color:var(--info)}
.activity-icon.email{background:var(--brand-subtle);color:var(--brand)}
.activity-icon.meeting{background:var(--purple-subtle);color:var(--purple)}
.activity-icon.follow{background:var(--warn-subtle);color:var(--warn)}
.activity-icon.demo{background:var(--teal-subtle);color:var(--teal)}
.activity-icon.proposal{background:var(--danger-subtle);color:var(--danger)}
.activity-icon.other{background:var(--canvas-muted);color:var(--ink-3)}
.activity-body{flex:1}
.activity-type{font-size:13px;font-weight:600;color:var(--ink)}
.activity-meta{font-size:12px;color:var(--ink-3);margin-top:2px}
.activity-notes{font-size:12px;color:var(--ink);margin-top:6px}
.activity-time{font-size:11px;color:var(--ink-4);font-family:var(--mono);flex-shrink:0}

/* Packages */
.packages-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px}
.package-card{background:var(--canvas);border:1.5px solid var(--line);border-radius:var(--r-lg);padding:20px;position:relative;box-shadow:var(--shadow-sm)}
.package-card.featured{border-color:var(--accent)}
.package-card.custom{border-style:dashed}
.package-badge{position:absolute;top:12px;right:12px;background:var(--accent);color:#fff;font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px}
.package-name{font-size:16px;font-weight:700;margin-bottom:4px;color:var(--ink)}
.package-price{font-size:22px;font-weight:700;font-family:var(--mono);color:var(--accent);margin-bottom:4px}
.package-sub{font-size:12px;color:var(--ink-3);margin-bottom:12px}
.package-divider{height:1px;background:var(--line);margin:14px 0}
.package-features{list-style:none;display:flex;flex-direction:column;gap:7px}
.package-features li{font-size:12px;color:var(--ink-3);display:flex;gap:8px;align-items:center}
.package-features li::before{content:'\f00c';font-family:'Font Awesome 6 Free';font-weight:900;font-size:10px;color:var(--accent);flex-shrink:0}
.package-footer{margin-top:14px;font-size:11px;color:var(--ink-3);display:flex;gap:14px}
.qual-table-wrap{overflow-x:auto}
.qual-table{width:100%;border-collapse:collapse}
.qual-table th{font-size:11px;font-weight:600;color:var(--ink-3);text-transform:uppercase;letter-spacing:.5px;padding:8px 12px;text-align:left;border-bottom:1px solid var(--line);background:var(--canvas-subtle)}
.qual-table td{padding:10px 12px;font-size:12px;border-bottom:1px solid var(--line);color:var(--ink)}
.qual-table tr:hover td{background:var(--canvas-subtle)}
.qual-high{color:var(--accent);font-weight:600}
.qual-med{color:var(--warn)}
.qual-low{color:var(--danger)}

/* Import CSV */
.stepper{display:flex;align-items:center;margin-bottom:32px}
.step{display:flex;align-items:center;gap:8px;flex-shrink:0}
.step-num{width:30px;height:30px;border-radius:50%;border:2px solid var(--line-strong);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--ink-3);flex-shrink:0;transition:all .2s}
.step.active .step-num{border-color:var(--accent);background:var(--accent);color:#fff}
.step.done .step-num{border-color:var(--accent);background:var(--accent);color:#fff}
.step-label{font-size:13px;font-weight:500;color:var(--ink-3)}
.step.active .step-label{color:var(--ink);font-weight:600}
.step.done .step-label{color:var(--accent)}
.step-connector{flex:1;height:1px;background:var(--line-strong);margin:0 16px}
.step-connector.done{background:var(--accent)}
.upload-zone{border:2px dashed var(--line-strong);border-radius:var(--r);padding:48px 24px;text-align:center;cursor:pointer;transition:all .2s;background:var(--canvas)}
.upload-zone:hover,.upload-zone.drag-over{border-color:var(--accent);background:var(--brand-subtle)}
.upload-zone-icon{font-size:40px;color:var(--accent);margin-bottom:14px;display:block}
.upload-zone-title{font-size:15px;font-weight:600;margin-bottom:6px;color:var(--ink)}
.upload-zone-sub{font-size:13px;color:var(--ink-3)}
.upload-file-info{background:var(--canvas-muted);border:1px solid var(--line-strong);border-radius:8px;padding:12px 16px;display:flex;align-items:center;gap:12px}
.file-name{font-weight:600;font-size:13px;color:var(--ink)}
.file-meta{font-size:12px;color:var(--ink-3)}
.mapping-table{width:100%;border-collapse:collapse;margin-bottom:16px}
.mapping-table th{font-size:11px;font-weight:600;color:var(--ink-3);text-transform:uppercase;letter-spacing:.5px;padding:8px 12px;text-align:left;border-bottom:1px solid var(--line);background:var(--canvas-subtle)}
.mapping-table td{padding:8px 12px;border-bottom:1px solid var(--line);font-size:13px;vertical-align:middle;color:var(--ink)}
.mapping-table tr:hover td{background:var(--canvas-subtle)}
.map-select{background:var(--canvas);border:1px solid var(--line-strong);color:var(--ink);border-radius:6px;padding:5px 8px;font-size:12px;outline:none;width:100%;font-family:var(--font)}
.map-select:focus{border-color:var(--accent)}
.map-select.mapped{border-color:var(--accent);color:var(--brand-text)}
.preview-table-wrap{overflow-x:auto;max-height:200px;overflow-y:auto;margin-top:12px}
.preview-table{width:100%;border-collapse:collapse;font-size:12px}
.preview-table th{font-size:10px;font-weight:600;color:var(--ink-3);text-transform:uppercase;padding:5px 8px;background:var(--canvas-subtle);position:sticky;top:0;white-space:nowrap}
.preview-table td{padding:5px 8px;border-bottom:1px solid var(--line);white-space:nowrap;max-width:160px;overflow:hidden;text-overflow:ellipsis;color:var(--ink-3)}
.review-summary{background:var(--canvas-muted);border:1px solid var(--line);border-radius:var(--r);padding:20px;margin-bottom:16px;display:flex;align-items:center;gap:20px}
.review-count{font-size:32px;font-weight:700;font-family:var(--mono);color:var(--accent)}
.review-label{font-size:13px;color:var(--ink-3)}
.warning-box{background:var(--warn-subtle);border:1px solid rgba(245,158,11,0.3);border-radius:8px;padding:12px 16px;font-size:13px;color:var(--warn-text);margin-bottom:12px;display:flex;align-items:flex-start;gap:10px}
.import-progress-bar{background:var(--canvas-emphasis);border-radius:8px;height:6px;overflow:hidden;margin:8px 0}
.import-progress-fill{height:100%;background:var(--accent);border-radius:8px;transition:width .3s}
.import-success{text-align:center;padding:48px 20px}
.import-success .success-icon{font-size:48px;color:var(--accent);margin-bottom:16px;display:block}
.import-success h3{font-size:20px;font-weight:700;margin-bottom:8px;color:var(--ink)}
.import-success p{color:var(--ink-3);font-size:14px;margin-bottom:24px}
.import-history-item{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--canvas);border:1px solid var(--line);border-radius:8px;margin-bottom:6px}
.import-history-meta{font-size:12px;color:var(--ink-3);margin-top:2px}
.import-step{display:none}
.import-step.active{display:block}

/* Team */
.team-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.team-card{background:var(--canvas);border:1px solid var(--line);border-radius:var(--r);padding:20px;display:flex;flex-direction:column;gap:14px}

/* Modals */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.4);z-index:400;display:flex;align-items:center;justify-content:center}
.modal-card{background:var(--canvas);border-radius:12px;padding:28px;width:100%;max-width:440px;box-shadow:0 20px 60px rgba(0,0,0,0.15)}
.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.modal-title{font-size:16px;font-weight:700;color:var(--ink)}
.modal-close{background:none;border:none;color:var(--ink-3);font-size:16px;cursor:pointer;font-family:var(--font)}
.modal-close:hover{color:var(--ink)}
.modal-actions{display:flex;gap:10px;margin-top:20px}

/* Reports */
.reports-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:20px}
.reports-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:20px}
.report-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.report-rank{width:20px;text-align:right;font-size:12px;font-weight:600;color:var(--ink-3);flex-shrink:0}
.report-name{font-size:13px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100px;flex-shrink:0}
.report-bar-wrap{flex:1}
.report-bar-bg{background:var(--canvas-emphasis);border-radius:4px;height:8px;overflow:hidden}
.report-bar-fill{height:100%;background:var(--accent);border-radius:4px;transition:width .3s}
.report-num{font-size:12px;color:var(--ink-3);white-space:nowrap;min-width:80px;text-align:right;flex-shrink:0}

/* Email Templates */
.email-templates-grid{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.email-template-btn{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border:1px solid var(--line-strong);border-radius:6px;background:var(--canvas-muted);color:var(--ink);font-size:12px;cursor:pointer;transition:all .12s;font-family:var(--font)}
.email-template-btn:hover{border-color:var(--green);color:var(--green);background:var(--brand-subtle)}

/* Rep Dashboard */
.rep-dashboard{max-width:880px}
.rep-welcome{margin-bottom:24px}
.rep-welcome-name{font-size:24px;font-weight:700;color:var(--ink)}
.rep-welcome-sub{font-size:14px;color:var(--ink-3);margin-top:4px}
.rep-kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.rep-kpi-card{background:var(--canvas);border-radius:var(--r);padding:18px 20px;box-shadow:var(--shadow-sm);border:1px solid var(--line)}
.rep-kpi-card.rep-kpi-alert{border-color:var(--warn);background:var(--warn-subtle)}
.rep-kpi-val{font-size:32px;font-weight:700;color:var(--ink);line-height:1;font-family:var(--mono)}
.rep-kpi-label{font-size:12px;color:var(--ink-3);margin-top:6px;font-weight:500}
.rep-stage-row{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.rep-stage-name{font-size:12px;color:var(--ink);width:120px;flex-shrink:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rep-stage-bar-bg{flex:1;height:8px;background:var(--line);border-radius:4px;overflow:hidden}
.rep-stage-bar-fill{height:100%;background:var(--green);border-radius:4px;transition:width .3s}
.rep-stage-count{font-size:12px;font-weight:600;color:var(--ink-3);width:20px;text-align:right;flex-shrink:0}
.rep-activity-row{display:flex;align-items:flex-start;gap:10px;padding:8px 0;border-bottom:1px solid var(--line);cursor:default}
.rep-activity-row:last-child{border-bottom:none}
.rep-activity-dot{width:8px;height:8px;border-radius:50%;background:var(--green);flex-shrink:0;margin-top:4px}
.rep-activity-info{flex:1;min-width:0}
.rep-activity-type{font-size:13px;font-weight:600;color:var(--ink)}
.rep-activity-notes{font-size:12px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.rep-activity-time{font-size:11px;color:var(--ink-4);margin-top:2px}
.card-section{background:var(--canvas);border-radius:var(--r);padding:18px 20px;box-shadow:var(--shadow-sm);border:1px solid var(--line)}
.section-title{font-size:13px;font-weight:600;color:var(--ink);text-transform:uppercase;letter-spacing:.4px}

/* ══════════════════════════════
   MOBILE
   ══════════════════════════════ */
.mobile-menu-btn{display:none}
.mobile-bottom-nav{position:fixed;bottom:0;left:0;right:0;height:56px;background:var(--sidebar-bg);border-top:1px solid var(--sidebar-border);display:none;z-index:500;align-items:stretch}
.mobile-nav-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:rgba(255,255,255,.4);font-size:10px;cursor:pointer;padding:6px 4px;transition:var(--t)}
.mobile-nav-item i{font-size:16px}
.mobile-nav-item.active{color:var(--sidebar-active-text)}
.hide-mobile{display:table-cell}
.mobile-sidebar-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:599}

@media(max-width:768px){
  .sidebar{display:none}
  .nav-text{display:none}
  .brand-tag{display:none}
  .user-info{display:none}
  .signout-btn span{display:none}
  .main{margin-top:0!important;margin-left:0!important}
  .topbar{padding:0 12px}
  .mobile-menu-btn{display:none!important}
  .mobile-bottom-nav{display:flex!important}
  .content{padding:14px 12px;padding-bottom:72px}
  .stats-grid{grid-template-columns:repeat(2,1fr);gap:8px}
  .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  table{min-width:560px}
  .kanban-wrap{overflow-x:auto}
  .kanban-col{min-width:190px}
  #detail-panel,.detail-panel{width:100%!important}
  .rep-kpi-row{grid-template-columns:repeat(2,1fr)}
  .bulk-bar{left:0!important}
  .hide-mobile{display:none!important}
  .dashboard-row.two-col,.dashboard-row.two-eq{grid-template-columns:1fr}
  .packages-grid{grid-template-columns:1fr}
  .rep-perf-row,.rep-perf-header{grid-template-columns:1fr 1fr 1fr}
}

/* ── Projects ── */
.project-status-active{display:inline-block;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;background:#dcfce7;color:#15803d}
.project-status-paused{display:inline-block;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;background:#fef3c7;color:#d97706}
.project-status-completed{display:inline-block;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;background:#ede9fe;color:#7c3aed}
.project-status-cancelled{display:inline-block;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;background:#fee2e2;color:#dc2626}
.milestone-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border)}
.milestone-row:last-child{border-bottom:none}
.milestone-cb{width:16px;height:16px;cursor:pointer;accent-color:var(--accent)}
.milestone-title{flex:1;font-size:13px}
.milestone-title.done{text-decoration:line-through;color:var(--muted)}
.milestone-due{font-size:11px;color:var(--muted);font-family:'DM Mono',monospace}
.panel-docs-item{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid var(--border);font-size:12px}
.panel-docs-item:last-child{border-bottom:none}
.panel-docs-title{flex:1;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── Messages ── */
.msg-layout{display:flex;height:calc(100vh - 120px);min-height:0;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--border);background:var(--canvas)}
.msg-thread-list{width:300px;min-width:220px;border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;background:var(--canvas-subtle)}
.msg-thread-item{padding:12px 16px;cursor:pointer;border-bottom:1px solid var(--border);transition:background .15s}
.msg-thread-item:hover,.msg-thread-item.active{background:var(--canvas-muted)}
.msg-thread-name{font-weight:600;font-size:13px;display:flex;align-items:center;gap:6px;margin-bottom:2px}
.msg-thread-company{font-size:11px;color:var(--muted)}
.msg-thread-preview{font-size:12px;color:var(--ink-2);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msg-unread-badge{background:var(--accent);color:#fff;border-radius:var(--r-full);font-size:10px;font-weight:700;padding:1px 6px;margin-left:auto;flex-shrink:0}
.msg-feed-wrap{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}
.msg-feed-header{padding:12px 16px;border-bottom:1px solid var(--border);background:var(--canvas);flex-shrink:0}
.msg-feed-name{font-weight:600;font-size:14px}
.msg-feed{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:4px}
.msg-compose{display:flex;gap:8px;padding:12px 16px;border-top:1px solid var(--border);background:var(--canvas);flex-shrink:0;align-items:flex-end}
.msg-compose-input{flex:1;resize:none;font-family:var(--font);font-size:13px;padding:8px 12px;border-radius:var(--r);border:1px solid var(--border);background:var(--canvas-subtle);color:var(--ink);outline:none}
.msg-compose-input:focus{border-color:var(--accent)}
.msg-bubble-wrap{display:flex;flex-direction:column;max-width:70%}
.msg-bubble-wrap.internal{align-self:flex-end;align-items:flex-end}
.msg-bubble-wrap.client{align-self:flex-start;align-items:flex-start}
.msg-bubble{padding:8px 12px;border-radius:var(--r-lg);font-size:13px;line-height:1.5;white-space:pre-wrap;word-break:break-word}
.msg-bubble.internal{background:var(--brand);color:#fff;border-bottom-right-radius:4px}
.msg-bubble.client{background:var(--canvas);border:1px solid var(--border);color:var(--ink);border-bottom-left-radius:4px}
.msg-time{font-size:10px;color:var(--muted);margin-top:3px}
.msg-date-sep{text-align:center;font-size:11px;color:var(--muted);font-family:var(--mono);margin:8px 0;flex-shrink:0}

/* ══════════════════════════════
   LEAD DETAIL FULL PAGE
   ══════════════════════════════ */
.ld-backbar{display:flex;align-items:center;gap:10px;padding:10px 20px;background:var(--canvas);border-bottom:1px solid var(--line);flex-shrink:0}
.ld-back-btn{display:inline-flex;align-items:center;gap:6px;padding:0 11px;height:28px;border-radius:var(--r);font-size:12px;font-weight:500;font-family:var(--font);color:var(--ink-3);background:transparent;border:1px solid var(--line-strong);cursor:pointer;transition:var(--t)}
.ld-back-btn:hover{background:var(--canvas-muted);color:var(--ink)}
.ld-breadcrumb{flex:1;font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ld-backbar-actions{display:flex;align-items:center;gap:6px;margin-left:auto}

.ld-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:20px 24px;background:var(--canvas);border-bottom:1px solid var(--line);flex-wrap:wrap}
.ld-hero-left{display:flex;align-items:flex-start;gap:16px}
.ld-hero-avatar{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:white;flex-shrink:0;letter-spacing:-0.5px}
.ld-hero-name{font-size:20px;font-weight:700;color:var(--ink);letter-spacing:-0.3px;margin-bottom:4px}
.ld-hero-meta{font-size:12px;color:var(--ink-3);margin-bottom:8px}
.ld-hero-badges{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.ld-hero-right{display:flex;align-items:center;gap:24px}
.ld-stat{text-align:right}
.ld-stat-val{font-size:20px;font-weight:700;color:var(--ink);font-family:var(--mono);letter-spacing:-0.5px;line-height:1}
.ld-stat-label{font-size:10px;color:var(--ink-4);text-transform:uppercase;letter-spacing:.5px;margin-top:3px}

.ld-tab-bar{display:flex;align-items:stretch;padding:0 20px;background:var(--canvas);border-bottom:1px solid var(--line);gap:2px;overflow-x:auto;scrollbar-width:none;flex-shrink:0}
.ld-tab-bar::-webkit-scrollbar{display:none}
.ld-tab{display:inline-flex;align-items:center;gap:6px;padding:0 14px;height:42px;border-bottom:2px solid transparent;background:transparent;border-left:none;border-right:none;border-top:none;color:var(--ink-3);font-size:13px;font-weight:500;font-family:var(--font);cursor:pointer;transition:var(--t);white-space:nowrap}
.ld-tab:hover{color:var(--ink);background:var(--canvas-subtle)}
.ld-tab.active{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
.ld-tab i{font-size:12px}

.ld-tab-panels{flex:1;overflow-y:auto;background:var(--canvas-subtle)}
.ld-tab-panel{display:none;padding:20px 24px;animation:fadeIn 0.14s ease}
.ld-tab-panel.active{display:block}

.ld-two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ld-section{background:var(--canvas);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 20px}
.ld-section-title{font-size:11px;font-weight:700;color:var(--ink-3);text-transform:uppercase;letter-spacing:.6px;margin-bottom:14px;display:flex;align-items:center;gap:6px}
.ld-section-title i{font-size:12px}
.ld-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.ld-section-header .ld-section-title{margin-bottom:0}

.ld-field{display:grid;grid-template-columns:110px 1fr;gap:8px;align-items:start;padding:6px 0;border-bottom:1px solid var(--line)}
.ld-field:last-child{border-bottom:none}
.ld-field-label{font-size:11px;color:var(--ink-4);font-weight:500;padding-top:2px;white-space:nowrap}
.ld-field-val{font-size:12px;color:var(--ink-2)}
.ld-field .detail-val{cursor:pointer}
.ld-field .dv-text{display:inline-block;padding:1px 4px;border-radius:4px;transition:background .1s;min-width:40px}
.ld-field .detail-val:hover .dv-text{background:var(--canvas-muted)}

.ld-doc-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.ld-doc-row:last-child{border-bottom:none}
.ld-doc-icon{width:32px;height:32px;border-radius:var(--r);background:var(--canvas-subtle);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
.ld-doc-info{flex:1;min-width:0}
.ld-doc-name{font-size:12px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ld-doc-meta{font-size:11px;color:var(--ink-4);margin-top:2px;display:flex;align-items:center;gap:5px}
.ld-doc-actions{display:flex;align-items:center;gap:5px;flex-shrink:0}

.ld-file-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.ld-file-row:last-child{border-bottom:none}
.ld-file-info{flex:1;min-width:0}
.ld-file-name{font-size:12px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ld-file-meta{font-size:11px;color:var(--ink-4);margin-top:2px}
.ld-file-actions{display:flex;align-items:center;gap:5px;flex-shrink:0}

@media(max-width:768px){
  .ld-two-col{grid-template-columns:1fr}
  .ld-hero{flex-direction:column;gap:12px}
  .ld-hero-right{align-self:flex-start;gap:16px}
  .ld-tab-bar{padding:0 12px}
  .ld-tab-panel{padding:14px 12px}
}

/* ── view-lead-detail layout ── */
#view-lead-detail{display:none;flex-direction:column;height:calc(100vh - var(--topbar-h));overflow:hidden}
#view-lead-detail.active{display:flex}
@media(max-width:640px){.msg-thread-list{width:120px;min-width:100px}.msg-thread-company,.msg-thread-preview{display:none}}

/* Sidebar nav scroll improvements */
.sidebar-nav {
  overflow-y: auto;
  overflow-x: hidden;
}

/* Collapsed sidebar — show tooltips on hover */
.sidebar.collapsed .nav-item {
  position: relative;
  justify-content: center;
  padding: 8px 0;
}
.sidebar.collapsed .nav-item::after {
  content: attr(data-tooltip);
  position: absolute;
  left: calc(100% + 8px);
  top: 50%;
  transform: translateY(-50%);
  background: var(--text);
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  padding: 5px 10px;
  border-radius: var(--r);
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .15s;
  z-index: 999;
  box-shadow: var(--shadow-md);
}
.sidebar.collapsed .nav-item:hover::after {
  opacity: 1;
}
.sidebar.collapsed .nav-section-label {
  display: none;
}
.sidebar.collapsed .sidebar-brand img {
  width: 28px;
  height: 28px;
  object-fit: cover;
  object-position: left center;
  border-radius: 4px;
}

/* ── Deal Flow Modal ── */
.deal-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  flex: 1;
}
.deal-step-num {
  width: 28px;
  height: 28px;
  border-radius: var(--r-full);
  background: var(--surface-3);
  color: var(--text-4);
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .2s;
  border: 2px solid var(--border);
}
.deal-step-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-4);
  white-space: nowrap;
}
.deal-step.active .deal-step-num {
  background: var(--brand);
  color: #fff;
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(22,163,74,.15);
}
.deal-step.active .deal-step-label { color: var(--brand-text); }
.deal-step.done .deal-step-num {
  background: var(--brand-light-2);
  color: var(--brand);
  border-color: var(--brand-light-2);
}
.deal-step.done .deal-step-label { color: var(--brand-text); }
.deal-step-line {
  flex: 1;
  height: 2px;
  background: var(--border);
  margin-bottom: 18px;
  transition: background .2s;
}

/* ══════════════════════════════════════════════════════
   COMMAND PALETTE
   ══════════════════════════════════════════════════════ */

#cmd-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(9,9,11,.55);
  z-index: 2000;
  backdrop-filter: blur(3px);
  animation: fadeIn .12s ease;
}

#cmd-palette {
  display: none;
  position: fixed;
  top: 80px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 620px;
  z-index: 2001;
  padding: 0 16px;
  animation: cmdSlideIn .15s cubic-bezier(.4,0,.2,1);
}

@keyframes cmdSlideIn {
  from { opacity: 0; transform: translateX(-50%) translateY(-8px); }
  to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}

.cmd-inner {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: 0 25px 60px -12px rgba(0,0,0,.22), 0 0 0 1px rgba(0,0,0,.04);
  overflow: hidden;
}

.cmd-search-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
}

.cmd-search-icon {
  color: var(--text-4);
  font-size: 14px;
  flex-shrink: 0;
}

#cmd-input {
  flex: 1;
  border: none;
  outline: none;
  font-size: 15px;
  font-family: var(--font);
  color: var(--text);
  background: none;
  font-weight: 500;
}

#cmd-input::placeholder {
  color: var(--text-5);
  font-weight: 400;
}

.cmd-esc-key {
  font-size: 10px;
  font-weight: 600;
  color: var(--text-4);
  background: var(--surface-3);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 2px 6px;
  font-family: var(--mono);
  flex-shrink: 0;
}

#cmd-results {
  max-height: 420px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--border) transparent;
}

.cmd-section-label {
  font-size: 10px;
  font-weight: 700;
  color: var(--text-4);
  text-transform: uppercase;
  letter-spacing: .7px;
  padding: 10px 16px 4px;
}

.cmd-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 16px;
  cursor: pointer;
  transition: background .08s;
  border-radius: 0;
}

.cmd-item:hover, .cmd-item.selected {
  background: var(--surface-2);
}

.cmd-item.selected {
  background: var(--brand-light);
}

.cmd-item-icon {
  width: 32px;
  height: 32px;
  border-radius: var(--r);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  flex-shrink: 0;
}

.cmd-item-body {
  flex: 1;
  min-width: 0;
}

.cmd-item-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cmd-item-sub {
  font-size: 11px;
  color: var(--text-4);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 1px;
}

.cmd-item-badge {
  font-size: 10px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: var(--r-full);
  flex-shrink: 0;
}

.cmd-footer {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 9px 16px;
  border-top: 1px solid var(--border);
  background: var(--surface-2);
}

.cmd-footer span {
  font-size: 11px;
  color: var(--text-4);
  display: flex;
  align-items: center;
  gap: 4px;
}

.cmd-footer kbd {
  font-size: 10px;
  font-weight: 600;
  color: var(--text-3);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 3px;
  padding: 1px 5px;
  font-family: var(--mono);
}

.cmd-empty {
  text-align: center;
  padding: 32px 20px;
  color: var(--text-4);
  font-size: 13px;
}

.cmd-divider {
  height: 1px;
  background: var(--border);
  margin: 4px 0;
}

@media (max-width: 640px) {
  #cmd-palette { top: 20px; }
  .cmd-inner { border-radius: 12px; }
}