/* ============================================================
   COBALT SALES AGENT — design system (ported from /v2 cbv2 shell)
   Cobalt blue #0B1F8F · Inter + Outfit · #F6F7FB canvas
   ============================================================ */
:root{
  --cb:#0B1F8F; --cb-dark:#061566; --cb-soft:#E7EAFB; --cb-glow:#4D70FF;
  --bg:#F6F7FB; --surface:#FFFFFF; --surface-mute:#F1F2F7;
  --border:#E5E7EE; --border-soft:#EEF0F5;
  --ink:#0B1226; --ink-mute:#5B6072; --ink-dim:#8A8FA3;
  --good:#16a34a; --good-soft:#DCFCE7; --warn:#D97706; --warn-soft:#FEF3C7;
  --risk:#dc2626; --risk-soft:#FEE2E2; --info:#0EA5E9; --info-soft:#E0F2FE;
  --purple:#7c3aed;
  --sb-w:236px; --tb-h:64px;
  --shadow-sm:0 1px 2px rgba(11,18,38,.05);
  --shadow:0 4px 16px rgba(11,18,38,.06);
  --shadow-lg:0 16px 48px rgba(11,18,38,.16);
}
*,*::before,*::after{ box-sizing:border-box; }
html,body{ margin:0; }
body{
  font-family:Outfit, 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  color:var(--ink); background:var(--bg); font-size:14px;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
.mono{ font-family:'Outfit','Inter',system-ui,sans-serif;  font-variant-numeric:tabular-nums; }
.tnum{ font-variant-numeric:tabular-nums; }
button{ font-family:inherit; cursor:pointer; border:0; background:transparent; padding:0; color:inherit; }
a{ color:inherit; text-decoration:none; }
input,select,textarea{ font-family:inherit; font-size:14px; color:var(--ink); }
/* Global icon safety net: any SVG without an explicit size rule defaults to 18px
   (class rules like .nav svg / .btn svg have higher specificity and still win),
   preventing unconstrained icons from ballooning to their 300px intrinsic size. */
svg{ width:18px; height:18px; flex-shrink:0; }
::-webkit-scrollbar{ width:9px; height:9px; }
::-webkit-scrollbar-thumb{ background:#d7dae5; border-radius:5px; border:2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover{ background:#c2c6d6; }

/* ===== Shell ===== */
.shell{ display:flex; min-height:100vh; }
.sidebar{
  width:var(--sb-w); flex-shrink:0; background:var(--surface);
  border-right:1px solid var(--border); display:flex; flex-direction:column;
  position:fixed; inset:0 auto 0 0; z-index:40; transition:transform .22s ease;
}
.main{ margin-left:var(--sb-w); flex:1; min-width:0; display:flex; flex-direction:column; }
.content{ flex:1; padding:26px 30px 60px; }
/* Leads screen fills the viewport below the topbar and scrolls internally (table body), so the window itself never gets a second scrollbar. */
.content.leads-fill{ flex:none; height:calc(100vh - var(--tb-h)); padding:18px 30px 0; overflow:hidden; display:flex; flex-direction:column; }

/* Brand */
.brand{ display:flex; align-items:center; gap:11px; padding:18px 18px 12px; }
.brand-badge{ width:36px; height:36px; border-radius:11px; background:linear-gradient(135deg,#0B1F8F,#061566); display:grid; place-items:center; color:#fff; box-shadow:var(--shadow-sm); }
.brand-badge svg{ width:20px; height:20px; }
.brand-name{ font-weight:800; font-size:17px;  line-height:1; display:block; }
.brand-sub{ font-size:9px; font-weight:800;  color:var(--cb); margin-top:4px; display:block; }

/* Nav */
.nav{ padding:8px 12px; display:flex; flex-direction:column; gap:2px; overflow-y:auto; flex:1; }
.nav-label{ font-size:10px; font-weight:800;  color:var(--ink-dim); padding:8px 8px; text-transform:uppercase; }
.nav a{ display:flex; align-items:center; gap:12px; padding:6px 11px; border-radius:10px; font-size:14px; font-weight:500; color:var(--ink-mute); cursor:pointer; }
.nav a:hover{ background:var(--surface-mute); color:var(--ink); }
.nav a.active{ background:var(--cb-soft); color:var(--cb); font-weight:600; }
.nav svg{ width:19px; height:19px; flex-shrink:0; color:var(--ink-dim); }
.nav a:hover svg,.nav a.active svg{ color:var(--cb); }
.nav-badge{ margin-left:auto; background:var(--cb); color:#fff; font-size:11px; font-weight:700; min-width:20px; height:20px; border-radius:10px; display:grid; place-items:center; padding:0 6px; }

/* Profile footer */
.profile{ border-top:1px solid var(--border-soft); padding:10px 12px 12px; }
.admin-link{ display:flex; align-items:center; gap:10px; padding:9px 11px; border-radius:10px; font-size:13px; font-weight:600; color:var(--ink-mute); margin-bottom:6px; cursor:pointer; }
.admin-link:hover{ background:var(--surface-mute); color:var(--cb); }
.admin-link.active{ background:var(--cb-soft); color:var(--cb); }
.admin-link svg{ width:18px; height:18px; }
.profile-row{ display:flex; align-items:center; gap:11px; padding:8px; border-radius:11px; cursor:pointer; }
.profile-row:hover{ background:var(--surface-mute); }
.profile-row.active{ background:var(--surface-mute); }
.avatar{ width:36px; height:36px; border-radius:50%; background:var(--cb-soft); color:var(--cb); display:grid; place-items:center; font-weight:700; font-size:13px; flex-shrink:0; }
.profile-name{ font-weight:600; font-size:13px; line-height:1.25; display:block; }
.profile-sub{ font-size:11px; color:var(--ink-dim); }
.profile-row .chev{ margin-left:auto; color:var(--ink-dim); }
.profile-row .chev svg{ width:16px; height:16px; }

/* Topbar */
.topbar{ height:var(--tb-h); background:var(--surface); border-bottom:1px solid var(--border); display:flex; align-items:center; gap:14px; padding:0 24px; position:sticky; top:0; z-index:30; }
.menu-toggle{ display:none; width:38px; height:38px; border-radius:9px; background:var(--surface-mute); place-items:center; }
.menu-toggle svg{ width:20px; height:20px; }
.search{ flex:1; max-width:540px; height:40px; background:var(--surface-mute); border:1px solid transparent; border-radius:11px; display:flex; align-items:center; gap:10px; padding:0 14px; color:var(--ink-dim); transition:.15s; }
.search:focus-within{ background:var(--surface); border-color:var(--cb-soft); box-shadow:0 0 0 3px rgba(11,31,143,.07); }
.search svg{ width:17px; height:17px; flex-shrink:0; }
.search input{ flex:1; border:0; background:transparent; outline:none; }
.kbd{ font-size:11px; font-weight:600; color:var(--ink-dim); background:var(--surface); border:1px solid var(--border); border-radius:6px; padding:2px 7px; }
.topbar-spacer{ flex:1; }
.roleswitch{ display:inline-flex; background:var(--surface-mute); border:1px solid var(--border); border-radius:10px; padding:3px; }
.roleswitch button{ height:30px; padding:0 12px; border-radius:7px; font-size:12px; font-weight:700; color:var(--ink-mute); display:inline-flex; align-items:center; gap:6px; }
.roleswitch button.active{ background:var(--cb); color:#fff; }
.roleswitch button svg{ width:14px; height:14px; }
.iconbtn{ width:40px; height:40px; border-radius:11px; background:var(--surface-mute); display:grid; place-items:center; color:var(--ink-mute); position:relative; }
.iconbtn:hover{ background:var(--border); color:var(--ink); }
.iconbtn svg{ width:19px; height:19px; }
.iconbtn .dot{ position:absolute; top:9px; right:11px; width:7px; height:7px; border-radius:50%; background:var(--risk); border:2px solid var(--surface-mute); }
.iconbtn .badge{ position:absolute; top:3px; right:3px; background:var(--cb); color:#fff; font-size:10px; font-weight:700; min-width:17px; height:17px; border-radius:9px; display:grid; place-items:center; padding:0 4px; border:2px solid var(--surface); }

/* Shared utility classes */
.btn-primary{ height:40px; padding:0 16px; border-radius:11px; background:var(--cb); color:#fff; font-weight:600; font-size:13px; display:inline-flex; align-items:center; gap:7px; white-space:nowrap; }
.btn-primary:hover{ background:var(--cb-dark); }
.btn-primary svg{ width:16px; height:16px; }
.btn{ height:38px; padding:0 14px; border-radius:10px; border:1px solid var(--border); background:var(--surface); font-weight:600; font-size:13px; color:var(--ink-mute); display:inline-flex; align-items:center; gap:7px; white-space:nowrap; }
.btn:hover{ background:var(--surface-mute); color:var(--ink); }
.btn svg{ width:16px; height:16px; }
.card{ background:var(--surface); border:1px solid var(--border); border-radius:16px; }
.page-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:20px; flex-wrap:wrap; }
.page-title{ font-size:25px; font-weight:800;  margin:0; }
.page-sub{ font-size:13px; color:var(--ink-mute); margin-top:4px; }
.pill{ display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border-radius:999px; font-size:11px; font-weight:700; }
.seg{ display:inline-flex; background:var(--surface); border:1px solid var(--border); border-radius:11px; padding:3px; }
.seg button{ padding:0 16px; height:34px; border-radius:8px; font-size:13px; font-weight:600; color:var(--ink-mute); }
.seg button.active{ background:var(--cb); color:#fff; }
.empty{ padding:24px; text-align:center; color:var(--ink-dim); font-size:13px; }
.hide{ display:none !important; }

/* ===== App launcher + surface chrome ===== */
.launcher-panel{ position:fixed; z-index:80; background:var(--surface); border:1px solid var(--border); border-radius:16px; box-shadow:var(--shadow-lg); padding:10px; width:340px; animation:pop .16s ease; }
.launcher-panel .lp-h{ font-size:10px; font-weight:800;  color:var(--ink-dim); padding:6px 8px 8px; text-transform:uppercase; }
.launcher-grid{ display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.launcher-item{ display:flex; align-items:center; gap:10px; padding:10px; border-radius:11px; text-align:left; cursor:pointer; }
.launcher-item:hover{ background:var(--surface-mute); }
.launcher-item.active{ background:var(--cb-soft); }
.launcher-item .li-badge{ width:32px; height:32px; border-radius:9px; display:grid; place-items:center; color:#fff; flex-shrink:0; }
.launcher-item .li-badge svg{ width:17px; height:17px; }
.launcher-item .li-name{ font-size:12.5px; font-weight:700; line-height:1.15; }
.launcher-item .li-sub{ font-size:9px; font-weight:700;  color:var(--ink-dim); margin-top:2px; }
.surface-chip{ display:inline-flex; align-items:center; gap:7px; height:32px; padding:0 12px; border-radius:9px; background:var(--surface-mute); font-size:12.5px; font-weight:700; color:var(--ink-mute); }
.surface-chip .sc-dot{ width:8px; height:8px; border-radius:50%; }
/* sidebar app links */
.nav a.nav-app{ gap:10px; }
.nav-app-badge{ width:24px; height:24px; border-radius:7px; display:grid; place-items:center; color:#fff; flex-shrink:0; }
.nav-app-badge svg{ width:14px; height:14px; color:#fff; }
.nav a.nav-app.active{ background:var(--surface-mute); color:var(--ink); font-weight:600; }
.nav a.nav-app .nav-app-here{ margin-left:auto; color:var(--cb); font-size:18px; line-height:1; }
.nav a.nav-app:hover .nav-app-badge svg, .nav a.nav-app.active .nav-app-badge svg{ color:#fff; }

/* === Agent Panel sidebar (Cobalt): dark theme + expandable nav === */
.sidebar.sb-dark{ background:#0B1020; border-right-color:rgba(255,255,255,.07); }
.sidebar.sb-dark .brand{ border-bottom:1px solid rgba(255,255,255,.06); padding-bottom:14px; }
.sidebar.sb-dark .brand-name{ color:#fff; }
.sidebar.sb-dark .brand-sub{ color:#8494b8; }
.sidebar.sb-dark .nav-label{ color:#5a6b8c; }
.sidebar.sb-dark .nav a{ color:#c3cde0; }
.sidebar.sb-dark .nav a:hover{ background:rgba(255,255,255,.06); color:#fff; }
.sidebar.sb-dark .nav a.active{ background:rgba(77,112,255,.20); color:#fff; font-weight:600; }
.sidebar.sb-dark .nav svg{ color:#7f8fb3; }
.sidebar.sb-dark .nav a:hover svg,.sidebar.sb-dark .nav a.active svg{ color:#fff; }
.sidebar.sb-dark .nav-badge{ background:var(--cb-glow); }
/* top account switcher */
.sb-account{ margin:12px 14px 4px; padding:9px 11px; border-radius:11px; display:flex; align-items:center; gap:10px; cursor:pointer; background:var(--surface-mute); border:1px solid var(--border-soft); }
.sb-account:hover{ background:var(--border-soft); }
.sidebar.sb-dark .sb-account{ background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.05); }
.sidebar.sb-dark .sb-account:hover{ background:rgba(255,255,255,.09); }
.sb-account .av{ width:28px; height:28px; border-radius:50%; background:linear-gradient(135deg,#4f46e5,#a78bfa); color:#fff; display:grid; place-items:center; font-weight:700; font-size:11px; flex-shrink:0; }
.sb-account .who{ flex:1; min-width:0; }
.sb-account .who .n{ display:block; font-size:12.5px; font-weight:600; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sb-account .who .r{ display:block; font-size:11px; color:var(--ink-dim); }
.sb-account .cv{ color:var(--ink-dim); }
.sidebar.sb-dark .sb-account .who .n{ color:#fff; }
.sidebar.sb-dark .sb-account .who .r,.sidebar.sb-dark .sb-account .cv{ color:#8494b8; }
.sb-account .cv svg{ width:14px; height:14px; }
/* expandable parent */
.nav-parent{ display:flex; align-items:center; gap:12px; padding:6px 11px; border-radius:10px; font-size:14px; font-weight:500; color:var(--ink-mute); cursor:pointer; }
.nav-parent:hover{ background:var(--surface-mute); color:var(--ink); }
.sidebar.sb-dark .nav-parent{ color:#c3cde0; }
.sidebar.sb-dark .nav-parent:hover{ background:rgba(255,255,255,.06); color:#fff; }
.nav-parent > svg:first-child{ width:19px; height:19px; flex-shrink:0; color:var(--ink-dim); }
.sidebar.sb-dark .nav-parent > svg:first-child{ color:#7f8fb3; }
.nav-parent .np-lbl{ flex:1; }
.nav-parent .np-badge{ background:var(--cb); color:#fff; font-size:11px; font-weight:700; min-width:20px; height:20px; border-radius:10px; display:grid; place-items:center; padding:0 6px; }
.sidebar.sb-dark .nav-parent .np-badge{ background:var(--cb-glow); }
.nav-parent .np-chev{ color:var(--ink-dim); transition:transform .18s ease; display:grid; }
.nav-parent .np-chev svg{ width:15px; height:15px; }
.nav-parent.open .np-chev{ transform:rotate(90deg); }
.sidebar.sb-dark .nav-parent .np-chev{ color:#5a6b8c; }
/* sub items */
.nav-sub-wrap{ margin-left:1rem; /* border-left:1px solid var(--border); */ display:flex; flex-direction:column; gap:1px; }
.sidebar.sb-dark .nav-sub-wrap{ border-left-color:rgba(255,255,255,.08); }
.nav .nav-sub{ display:flex; align-items:center; gap:9px; padding:7px 10px; border-radius:8px; font-size:13px; font-weight:500; color:var(--ink-mute); cursor:pointer; }
.nav-sub:hover{ background:var(--surface-mute); color:var(--ink); }
.nav-sub.active{ background:var(--cb-soft); color:var(--cb); font-weight:600; }
.sidebar.sb-dark .nav-sub{ color:#9fabc7; }
.sidebar.sb-dark .nav-sub:hover{ background:rgba(255,255,255,.06); color:#fff; }
.sidebar.sb-dark .nav-sub.active{ background:rgba(77,112,255,.20); color:#fff; }
.nav-sub .bull{ width:5px; height:5px; border-radius:50%; background:#94a0b8; flex-shrink:0; }
.sidebar.sb-dark .nav-sub .bull{ background:#475569; }
.nav-sub.active .bull{ background:var(--cb); box-shadow:0 0 0 3px rgba(77,112,255,.22); }
.sidebar.sb-dark .nav-sub.active .bull{ background:var(--cb-glow); }
.nav-sub .ns-lbl{ flex:1; }
.nav-sub .ns-count{ font-family:'Outfit',sans-serif; font-size:11px; color:var(--ink-dim); }
.sidebar.sb-dark .nav-sub .ns-count{ color:#647089; }
.nav-sub.active .ns-count{ color:var(--cb); }
.sidebar.sb-dark .nav-sub.active .ns-count{ color:#c7d2fe; }
.nav-kbd{ font-family:'Outfit',sans-serif; font-size:10px; font-weight:600; color:var(--ink-dim); border:1px solid var(--border); border-radius:5px; padding:1px 5px; }
.sidebar.sb-dark .nav-kbd{ color:#8494b8; border-color:rgba(255,255,255,.14); }
/* version footer */
.sb-version{ display:flex; align-items:center; gap:8px; padding:12px 18px; font-size:11.5px; color:var(--ink-dim); border-top:1px solid var(--border-soft); }
.sidebar.sb-dark .sb-version{ color:#8494b8; border-top-color:rgba(255,255,255,.06); }
.sb-version .live{ width:7px; height:7px; border-radius:50%; background:#22c55e; box-shadow:0 0 0 3px rgba(34,197,94,.18); }
.sidebar.sb-dark .profile{ border-top-color:rgba(255,255,255,.06); }
.sidebar.sb-dark .admin-link{ color:#c3cde0; }
.sidebar.sb-dark .admin-link:hover{ background:rgba(255,255,255,.06); color:#fff; }
.sidebar.sb-dark .admin-link svg{ color:#7f8fb3; }
.sidebar.sb-dark .admin-link:hover svg{ color:#fff; }
/* generic reusable list/table helpers for new surfaces */
.tbl{ width:100%; border-collapse:collapse; background:var(--surface); border:1px solid var(--border); border-radius:16px; overflow:hidden; }
.tbl th{ text-align:left; font-size:10.5px; font-weight:700;  color:var(--ink-dim); text-transform:uppercase; padding:12px 16px; border-bottom:1px solid var(--border); background:var(--surface-mute); }
.tbl td{ padding:12px 16px; border-bottom:1px solid var(--border-soft); font-size:13.5px; }
.tbl tr:last-child td{ border-bottom:0; }
.tbl tbody tr.clk{ cursor:pointer; } .tbl tbody tr.clk:hover{ background:var(--surface-mute); }
.statgrid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.statcard{ background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:18px; }
.statcard .sl{ font-size:10px; font-weight:700;  text-transform:uppercase; color:var(--ink-dim); }
.statcard .sv{ font-size:26px; font-weight:800;  margin-top:8px; }
.statcard .ss{ font-size:11.5px; color:var(--ink-mute); margin-top:3px; }
.chipbar{ display:flex; gap:7px; flex-wrap:wrap; }
.fchip{ border:1px solid var(--border); background:var(--surface); color:var(--ink-mute); padding:7px 13px; border-radius:999px; font-size:12.5px; font-weight:600; cursor:pointer; display:inline-flex; align-items:center; gap:6px; }
.fchip.active{ background:var(--ink); color:#fff; border-color:var(--ink); }
.sbadge{ display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border-radius:999px; font-size:11px; font-weight:700; }
.sbadge .d{ width:7px; height:7px; border-radius:50%; }
@media (max-width:520px){ .launcher-panel{ width:calc(100vw - 24px); } .statgrid{ grid-template-columns:repeat(2,1fr); } }

/* ===== My Proposals ===== */
.pp-kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:16px; }
.pp-kpi{ background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:16px; }
.pp-kpi .ic{ width:38px; height:38px; border-radius:11px; display:grid; place-items:center; margin-bottom:10px; } .pp-kpi .ic svg{ width:19px; height:19px; }
.pp-kpi .v{ font-size:26px; font-weight:800;  } .pp-kpi .l{ font-size:12.5px; color:var(--ink-mute); font-weight:600; margin-top:2px; } .pp-kpi .t{ font-size:11px; font-weight:700; margin-top:5px; } .pp-kpi .t.up{ color:var(--good); } .pp-kpi .t.dn{ color:var(--warn); }
.pp-tabs{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px; }
.pp-tab{ height:34px; padding:0 13px; border-radius:9px; border:1px solid var(--border); background:var(--surface); font-size:13px; font-weight:600; color:var(--ink-mute); display:inline-flex; align-items:center; gap:7px; } .pp-tab.on{ background:var(--cb); color:#fff; border-color:var(--cb); } .pp-tab .ct{ font-size:11px; font-weight:700; background:var(--surface-mute); color:var(--ink-mute); border-radius:999px; padding:1px 7px; } .pp-tab.on .ct{ background:rgba(255,255,255,.22); color:#fff; }
.pp-table{ width:100%; border-collapse:collapse; }
.pp-table th{ text-align:left; font-size:10.5px; font-weight:700;  text-transform:uppercase; color:var(--ink-dim); padding:12px 16px; border-bottom:1px solid var(--border); background:var(--surface-mute); }
.pp-table td{ padding:12px 16px; border-bottom:1px solid var(--border-soft); font-size:13.5px; }
.pp-table tbody tr{ cursor:pointer; } .pp-table tbody tr:hover{ background:var(--surface-mute); }
.pp-merch{ display:flex; align-items:center; gap:11px; } .pp-mav{ width:38px; height:38px; border-radius:50%; color:#fff; display:grid; place-items:center; font-size:13px; font-weight:700; flex-shrink:0; } .pp-mname{ font-weight:600; } .pp-msub{ font-size:11.5px; color:var(--ink-dim); }
.pp-stage{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; } .pp-stage .d{ width:8px; height:8px; border-radius:50%; }
.pp-code{ font-family:'Outfit',monospace; font-size:12.5px; font-weight:700; color:var(--cb); background:var(--cb-soft); padding:3px 9px; border-radius:7px; } .pp-code.none{ color:var(--ink-dim); background:var(--surface-mute); font-weight:600; }
.pp-chiprate{ font-size:12.5px; font-weight:600; color:var(--ink-mute); background:var(--surface-mute); padding:3px 9px; border-radius:999px; }
.pp-rating{ color:#E0A400; font-size:13px;  }
.pp-due{ font-size:12px; font-weight:600; } .pp-due.today{ color:var(--risk); } .pp-due.soon{ color:var(--ink-mute); } .pp-due.over{ color:var(--risk); }
/* proposal drawer */
.pp-hd-wrap{ background:var(--surface); border-bottom:1px solid var(--border); }
.pp-hd{ display:flex; align-items:center; gap:14px; padding:18px 22px 12px; }
.pp-h2{ font-size:21px; font-weight:800;  margin:0; } .pp-meta{ display:flex; gap:7px; align-items:center; flex-wrap:wrap; font-size:12px; color:var(--ink-mute); margin-top:3px; }
.pp-hd-actions{ display:flex; gap:6px; } .pp-hd-actions button{ width:34px; height:34px; border-radius:9px; background:var(--surface-mute); display:grid; place-items:center; color:var(--ink-mute); } .pp-hd-actions button:hover{ background:var(--border); color:var(--ink); } .pp-hd-actions svg{ width:17px; height:17px; }
.pp-kpistrip{ display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--border-soft); border-top:1px solid var(--border-soft); }
.pp-kpistrip .cell{ background:var(--surface); padding:11px 16px; } .pp-kpistrip .l{ font-size:9.5px; font-weight:700;  text-transform:uppercase; color:var(--ink-dim); } .pp-kpistrip .v{ font-size:16px; font-weight:800; margin-top:3px; } .pp-kpistrip .s{ font-size:10.5px; color:var(--ink-mute); margin-top:1px; }
.pp-stagewrap{ padding:12px 22px; } .pp-stagehd{ display:flex; justify-content:space-between; font-size:11px; color:var(--ink-dim); font-weight:600; margin-bottom:7px; }
.pp-stages{ display:flex; gap:4px; } .pp-stagebtn{ flex:1; height:30px; border-radius:7px; font-size:11.5px; font-weight:700; background:var(--surface-mute); color:var(--ink-mute); border:1px solid var(--border-soft); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 6px; } .pp-stagebtn.done{ background:var(--cb-soft); color:var(--cb); border-color:transparent; } .pp-stagebtn.cur{ background:var(--cb); color:#fff; border-color:var(--cb); }
.pp-actionbar{ display:flex; gap:7px; padding:0 22px 14px; flex-wrap:wrap; } .pp-actionbar button{ height:34px; padding:0 13px; border-radius:9px; border:1px solid var(--border); background:var(--surface); font-size:12.5px; font-weight:600; color:var(--ink-mute); display:inline-flex; align-items:center; gap:6px; } .pp-actionbar button svg{ width:15px; height:15px; } .pp-actionbar button.primary{ background:var(--cb); color:#fff; border-color:var(--cb); } .pp-actionbar button.adv{ background:var(--ink); color:#fff; border-color:var(--ink); }
.pp-tabsrow{ display:flex; gap:2px; padding:0 16px; overflow-x:auto; }
.pp-tabbtn{ padding:12px 13px; font-size:13px; font-weight:600; color:var(--ink-mute); border-bottom:2px solid transparent; white-space:nowrap; } .pp-tabbtn.on{ color:var(--cb); border-bottom-color:var(--cb); } .pp-tabbtn .tc{ font-size:10px; font-weight:700; background:var(--surface-mute); border-radius:8px; padding:1px 6px; margin-left:5px; }
.pp-body{ flex:1; overflow-y:auto; padding:18px 22px; }
.pp-grid2{ display:grid; grid-template-columns:1fr 1fr; gap:14px; } .pp-grid2 .full{ grid-column:1/-1; }
.pp-c{ background:var(--surface); border:1px solid var(--border); border-radius:14px; } .pp-c .hd{ display:flex; align-items:center; justify-content:space-between; padding:12px 15px; border-bottom:1px solid var(--border-soft); font-size:13px; } .pp-c .hd .ed{ font-size:12px; color:var(--cb); font-weight:600; cursor:pointer; background:none; } .pp-c .bd{ padding:13px 15px; }
.pp-kv{ display:flex; justify-content:space-between; gap:12px; padding:7px 0; border-top:1px solid var(--border-soft); font-size:13px; } .pp-kv:first-child{ border-top:0; } .pp-kv .k{ color:var(--ink-mute); } .pp-kv .v{ font-weight:600; text-align:right; }
.pp-empty{ text-align:center; color:var(--ink-dim); font-size:13px; padding:20px; }
.pp-banner{ display:flex; gap:10px; background:var(--cb-soft); border-radius:12px; padding:12px 14px; font-size:12.5px; color:var(--cb); line-height:1.45; margin-bottom:14px; } .pp-banner svg{ width:17px; height:17px; flex-shrink:0; margin-top:1px; }
.pp-sec{ background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:15px; margin-bottom:14px; } .pp-sec-h{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; } .pp-sec-t{ font-size:13px; font-weight:700; display:flex; align-items:center; gap:7px; } .pp-sec-t svg{ width:16px; height:16px; color:var(--cb); }
.pp-fld label{ font-size:11px; font-weight:600; color:var(--ink-mute); display:block; margin-bottom:5px; } .pp-req{ color:var(--risk); }
.pp-in{ width:100%; height:38px; border:1px solid var(--border); border-radius:9px; padding:0 12px; font-size:13px; outline:none; background:var(--surface); } .pp-in:focus{ border-color:var(--cb); } .pp-in.inv{ border-color:var(--risk); }
.pp-struct{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:14px; } .pp-structopt{ border:1.5px solid var(--border); border-radius:11px; padding:11px; cursor:pointer; } .pp-structopt.on{ border-color:var(--cb); background:var(--cb-soft); } .pp-structopt .st-t{ font-size:13px; font-weight:700; } .pp-structopt .st-s{ font-size:11px; color:var(--ink-mute); margin-top:2px; }
.pp-formlbl{ font-size:11px; font-weight:700;  text-transform:uppercase; color:var(--ink-dim); margin:14px 0 8px; } .pp-formlbl-hint{ color:var(--ink-dim); font-weight:600; text-transform:none;  }
.pp-grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; } .pp-g2{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.pp-feewrap{ position:relative; } .pp-feeaffix{ position:absolute; top:50%; transform:translateY(-50%); font-size:12px; color:var(--ink-dim); font-weight:600; } .pp-feeaffix.pre{ left:11px; } .pp-feeaffix.suf{ right:11px; }
.pp-customrow{ display:flex; gap:8px; margin-bottom:8px; } .pp-li-x{ width:32px; height:38px; border-radius:9px; background:var(--surface-mute); color:var(--ink-mute); display:grid; place-items:center; flex-shrink:0; } .pp-li-x:hover{ background:var(--risk-soft); color:var(--risk); } .pp-li-x svg{ width:15px; height:15px; }
.pp-sel{ height:38px; border:1px solid var(--border); border-radius:9px; padding:0 8px; background:var(--surface); font-size:13px; }
.pp-additem{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; color:var(--cb); background:none; padding:6px 0; } .pp-additem svg{ width:15px; height:15px; }
.pp-hwhead{ display:grid; grid-template-columns:2fr 1fr 1fr .6fr 1fr .8fr 32px; gap:8px; font-size:10px; font-weight:700;  text-transform:uppercase; color:var(--ink-dim); padding-bottom:6px; }
.pp-hwrow{ display:grid; grid-template-columns:2fr 1fr 1fr .6fr 1fr .8fr 32px; gap:8px; margin-bottom:8px; align-items:center; } .pp-hwqty{ text-align:center; padding:0 4px; }
.pp-seg2{ display:inline-flex; border:1px solid var(--border); border-radius:8px; overflow:hidden; } .pp-seg2 button{ height:36px; padding:0 10px; font-size:12px; font-weight:600; color:var(--ink-mute); background:var(--surface); } .pp-seg2 button.on{ background:var(--cb); color:#fff; }
.pp-hwfinal{ font-size:13px; font-weight:700; } .pp-hwfinal span{ font-size:10px; color:var(--ink-dim); font-weight:600; }
.pp-summary{ background:linear-gradient(135deg,var(--cb),var(--cb-dark)); border-radius:14px; padding:16px; color:#fff; margin-bottom:14px; } .pp-sum-t{ font-size:12px; font-weight:700; opacity:.85; display:flex; align-items:center; gap:7px; margin-bottom:12px; } .pp-sum-t svg{ width:15px; height:15px; } .pp-sum-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; } .pp-sum-cell .l{ font-size:10px; opacity:.7; font-weight:700;  text-transform:uppercase; } .pp-sum-cell .v{ font-size:20px; font-weight:800; margin-top:3px; } .pp-sum-cell .v .sm{ font-size:12px; opacity:.8; font-weight:600; }
/* code box */
.pp-code-top{ }
.pp-codebox{ border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.pp-cb-head{ display:flex; justify-content:space-between; gap:12px; padding:14px 16px; background:linear-gradient(135deg,#0A1230,#0B1F8F); color:#fff; }
.pp-cb-left .lbl{ font-size:11px; opacity:.75; font-weight:700; } .pp-cb-left .code{ font-family:'Outfit',monospace; font-size:24px; font-weight:800;  margin:3px 0; } .pp-cb-left .link{ font-size:12px; opacity:.85; text-decoration:underline; cursor:pointer; }
.pp-cb-stats{ display:flex; gap:18px; text-align:right; } .pp-cb-stats .st span{ font-size:10px; opacity:.7; display:block; font-weight:700; } .pp-cb-stats .st b{ font-size:14px; } .pp-cb-stats .st b.exp{ color:#FCA5A5; }
.pp-code-warn{ display:flex; gap:9px; padding:11px 16px; background:var(--warn-soft); color:#92600a; font-size:12.5px; line-height:1.45; align-items:flex-start; } .pp-code-warn svg{ width:16px; height:16px; flex-shrink:0; margin-top:1px; }
.pp-cb-foot{ display:flex; justify-content:space-between; gap:12px; padding:12px 16px; flex-wrap:wrap; align-items:center; }
.pp-expiry-seg{ display:inline-flex; border:1px solid var(--border); border-radius:8px; overflow:hidden; } .pp-expiry-seg button{ height:32px; padding:0 12px; font-size:12px; font-weight:600; color:var(--ink-mute); background:var(--surface); } .pp-expiry-seg button.on{ background:var(--cb); color:#fff; }
.pp-expiry-row{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:10px 0; } .pp-expiry-row label{ font-size:12px; font-weight:600; color:var(--ink-mute); } .pp-expiry-date{ font-size:12px; color:var(--ink-mute); font-weight:600; }
.pp-code-ready{ display:flex; align-items:center; gap:7px; font-size:13px; font-weight:600; color:var(--good); } .pp-code-ready svg{ width:16px; height:16px; }
.pp-code-cta{ display:flex; gap:8px; } .pp-code-actions{ display:flex; gap:7px; flex-wrap:wrap; }
.pp-btn{ height:36px; padding:0 13px; border-radius:9px; border:1px solid var(--border); background:var(--surface); font-size:12.5px; font-weight:600; color:var(--ink-mute); display:inline-flex; align-items:center; gap:6px; } .pp-btn:hover{ background:var(--surface-mute); } .pp-btn svg{ width:15px; height:15px; }
.pp-btn-primary{ height:36px; padding:0 14px; border-radius:9px; background:var(--cb); color:#fff; font-size:12.5px; font-weight:700; display:inline-flex; align-items:center; gap:6px; } .pp-btn-primary:hover{ background:var(--cb-dark); } .pp-btn-primary:disabled{ opacity:.5; } .pp-btn-primary svg{ width:15px; height:15px; }
.pp-code-locked .lock-row{ display:flex; gap:11px; align-items:center; margin-bottom:12px; } .pp-code-locked .lock-ic{ width:34px; height:34px; border-radius:10px; background:var(--surface-mute); color:var(--ink-mute); display:grid; place-items:center; } .pp-code-locked .lock-ic svg{ width:17px; height:17px; } .pp-code-locked .lock-t{ font-size:13.5px; font-weight:700; } .pp-code-locked .lock-s{ font-size:12px; color:var(--ink-mute); }
.pp-checklist{ display:flex; flex-direction:column; gap:7px; } .pp-check{ display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--ink-mute); } .pp-check .ck{ width:18px; height:18px; border-radius:50%; border:2px solid var(--border); display:grid; place-items:center; } .pp-check.done{ color:var(--ink); } .pp-check.done .ck{ background:var(--good); border-color:var(--good); color:#fff; } .pp-check .ck svg{ width:11px; height:11px; }
.pp-tl{ display:flex; flex-direction:column; gap:0; } .pp-tli{ display:grid; grid-template-columns:32px 1fr auto; gap:10px; padding:10px 0; border-top:1px solid var(--border-soft); align-items:start; } .pp-tli:first-child{ border-top:0; } .pp-tli .dot{ width:30px; height:30px; border-radius:8px; background:var(--cb-soft); color:var(--cb); display:grid; place-items:center; } .pp-tli .dot svg{ width:15px; height:15px; } .pp-tli .who{ font-size:13px; font-weight:600; } .pp-tli .desc{ font-size:12px; color:var(--ink-mute); grid-column:2; } .pp-tli .tm{ font-size:11px; color:var(--ink-dim); }
.pp-note{ padding:10px 0; border-top:1px solid var(--border-soft); } .pp-note:first-child{ border-top:0; } .pp-note .top{ display:flex; justify-content:space-between; font-size:12px; margin-bottom:3px; } .pp-note .top span{ color:var(--ink-dim); } .pp-note .tx{ font-size:13px; }
/* history */
.pp-funnel{ display:flex; align-items:center; margin-bottom:14px; } .hf-step{ display:flex; flex-direction:column; align-items:center; flex:1; position:relative; } .hf-dot{ width:30px; height:30px; border-radius:50%; background:var(--surface-mute); color:var(--ink-dim); display:grid; place-items:center; font-size:12px; font-weight:700; z-index:1; } .hf-step.done .hf-dot{ background:var(--good); color:#fff; } .hf-dot svg{ width:15px; height:15px; } .hf-l{ font-size:10.5px; font-weight:600; color:var(--ink-mute); margin-top:5px; text-align:center; } .hf-bar{ position:absolute; top:15px; left:50%; width:100%; height:3px; background:var(--border); z-index:0; } .hf-bar.on{ background:var(--good); }
.pp-metrics{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; } .hm .l{ font-size:10px; font-weight:700;  text-transform:uppercase; color:var(--ink-dim); } .hm .v{ font-size:14px; font-weight:700; margin-top:3px; }
.pp-stall{ display:flex; gap:10px; align-items:center; background:var(--warn-soft); color:#92600a; border-radius:11px; padding:12px 14px; font-size:12.5px; margin-top:12px; } .pp-stall svg{ width:17px; height:17px; flex-shrink:0; } .pp-stall button{ margin-left:auto; height:30px; padding:0 11px; border-radius:8px; background:#92600a; color:#fff; font-size:12px; font-weight:600; display:inline-flex; align-items:center; gap:5px; white-space:nowrap; } .pp-stall button svg{ width:13px; height:13px; }
.pp-attr{ display:flex; gap:20px; flex-wrap:wrap; } .ha{ display:flex; gap:9px; align-items:center; } .ha-ic{ width:34px; height:34px; border-radius:9px; display:grid; place-items:center; } .ha-ic svg{ width:16px; height:16px; } .ha-n{ font-size:16px; font-weight:800; } .ha-l{ font-size:11px; color:var(--ink-mute); }
.pp-histbar{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin:14px 0; flex-wrap:wrap; } .pp-chips{ display:flex; gap:6px; flex-wrap:wrap; } .hch{ height:28px; padding:0 11px; border-radius:999px; border:1px solid var(--border); background:var(--surface); font-size:12px; font-weight:600; color:var(--ink-mute); display:inline-flex; align-items:center; gap:6px; } .hch.on{ background:var(--ink); color:#fff; border-color:var(--ink); } .hch-dot{ width:7px; height:7px; border-radius:50%; }
.pp-day{ margin-bottom:16px; } .pp-daylbl{ display:flex; align-items:center; gap:8px; margin-bottom:8px; } .pp-daylbl span:first-child{ font-size:12.5px; font-weight:700; } .pp-daydate{ font-size:11px; color:var(--ink-dim); }
.pp-histtl{ display:flex; flex-direction:column; gap:0; }
.pp-hevt{ display:grid; grid-template-columns:34px 1fr; gap:11px; padding:11px 0; border-top:1px solid var(--border-soft); } .pp-hevt:first-child{ border-top:0; } .he-dot{ width:34px; height:34px; border-radius:9px; border:1px solid; display:grid; place-items:center; } .he-dot svg{ width:16px; height:16px; } .he-top{ display:flex; justify-content:space-between; gap:8px; } .he-t{ font-size:13px; font-weight:600; } .he-time{ font-size:11px; color:var(--ink-dim); } .he-desc{ font-size:12px; color:var(--ink-mute); margin-top:2px; } .he-meta{ display:flex; gap:7px; flex-wrap:wrap; margin-top:6px; } .he-chan{ font-size:10.5px; font-weight:700; padding:1px 7px; border-radius:6px; } .he-m{ font-size:10.5px; color:var(--ink-dim); display:inline-flex; align-items:center; gap:4px; } .he-m svg{ width:12px; height:12px; } .he-src{ font-size:10px; color:var(--ink-dim); background:var(--surface-mute); padding:1px 6px; border-radius:5px; }
.pp-doc{ display:flex; align-items:center; gap:11px; padding:10px 0; border-top:1px solid var(--border-soft); } .pp-doc:first-child{ border-top:0; } .pp-doc .ic{ width:32px; height:32px; border-radius:8px; background:var(--surface-mute); display:grid; place-items:center; } .pp-doc .ic svg{ width:16px; height:16px; } .pp-doc .n{ font-size:13px; font-weight:600; } .pp-doc .m{ font-size:11px; color:var(--ink-dim); } .pp-doc .dl{ margin-left:auto; font-size:12px; font-weight:600; color:var(--cb); background:none; }
.pp-add{ font-size:12.5px; font-weight:600; color:var(--cb); background:none; display:inline-flex; align-items:center; gap:6px; } .pp-add svg{ width:15px; height:15px; }
@media (max-width:980px){ .pp-kpis{ grid-template-columns:repeat(2,1fr); } .pp-grid2{ grid-template-columns:1fr; } .pp-kpistrip{ grid-template-columns:repeat(2,1fr); } .pp-sum-grid,.pp-metrics{ grid-template-columns:1fr 1fr; } }

/* Skeleton loading */
.skel-wrap{ padding:4px 0; }
.skel{ background:linear-gradient(90deg,var(--surface-mute) 25%,#e9ebf2 37%,var(--surface-mute) 63%); background-size:400% 100%; animation:skel 1.1s ease infinite; border-radius:10px; }
@keyframes skel{ 0%{ background-position:100% 50%;} 100%{ background-position:0 50%;} }

/* Toast */
#toast-host{ position:fixed; bottom:24px; right:24px; z-index:1000; display:flex; flex-direction:column; gap:10px; }
.toast{ background:var(--ink); color:#fff; padding:12px 16px; border-radius:11px; font-size:13px; font-weight:500; box-shadow:var(--shadow-lg); animation:pop .2s ease; max-width:360px; }
.toast.good{ background:var(--good); } .toast.risk{ background:var(--risk); }
@keyframes pop{ from{ opacity:0; transform:translateY(10px);} to{ opacity:1; transform:none;} }
@keyframes fade{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:none;} }
.route-fade{ animation:fade .22s ease; }

/* Generic modal */
.modal-scrim{ position:fixed; inset:0; background:rgba(11,18,38,.4); z-index:70; display:none; align-items:center; justify-content:center; padding:20px; }
.modal-scrim.open{ display:flex; }
.modal{ background:var(--surface); border-radius:16px; width:100%; max-width:460px; padding:22px; box-shadow:var(--shadow-lg); animation:pop .18s ease; max-height:90vh; overflow-y:auto; }
.modal h3{ margin:0 0 14px; font-size:17px; font-weight:700; }
.modal .foot{ display:flex; gap:8px; justify-content:flex-end; margin-top:16px; }
.field{ margin-bottom:12px; }
.field label{ font-size:11px; font-weight:700;  text-transform:uppercase; color:var(--ink-dim); display:block; margin-bottom:5px; }
.field input,.field select,.field textarea{ width:100%; border:1px solid var(--border); border-radius:10px; padding:10px 12px; font-size:13px; outline:none; background:var(--surface); }
.field input:focus,.field select:focus,.field textarea:focus{ border-color:var(--cb); }
.field .err{ color:var(--risk); font-size:11px; margin-top:5px; font-weight:600; display:none; }
.field.invalid input,.field.invalid select,.field.invalid textarea{ border-color:var(--risk); }
.field.invalid .err{ display:block; }

/* Scrim for mobile sidebar */
.scrim{ display:none; position:fixed; inset:0; background:rgba(11,18,38,.4); z-index:35; }

/* ===== Login ===== */
#login{ min-height:100vh; display:grid; grid-template-columns:1.05fr 1fr; }
#login .lo-brandside{ background:linear-gradient(150deg,#0B1F8F,#061566 70%); color:#fff; padding:56px; display:flex; flex-direction:column; justify-content:space-between; position:relative; overflow:hidden; }
#login .lo-blob{ position:absolute; border-radius:50%; filter:blur(3px); }
#login .lo-blob.a{ width:340px; height:340px; right:-90px; top:-100px; background:rgba(77,112,255,.24); }
#login .lo-blob.b{ width:240px; height:240px; left:-70px; bottom:-70px; background:rgba(77,112,255,.16); }
#login .lo-badge{ width:46px; height:46px; border-radius:13px; background:rgba(255,255,255,.14); display:grid; place-items:center; position:relative; }
#login .lo-badge svg{ width:26px; height:26px; }
#login .lo-brandtxt{ font-weight:800; font-size:22px;  }
#login .lo-brandtxt small{ display:block; font-size:10px; font-weight:800;  opacity:.7; margin-top:3px; }
#login h1{ font-size:38px; font-weight:800;  line-height:1.1; position:relative; }
#login .lo-lead{ font-size:15px; opacity:.85; margin-top:14px; max-width:400px; line-height:1.55; position:relative; }
#login .lo-stats{ display:flex; gap:30px; position:relative; }
#login .lo-stat .v{ font-size:26px; font-weight:800; }
#login .lo-stat .l{ font-size:12px; opacity:.7; }
#login .lo-formside{ display:flex; align-items:center; justify-content:center; padding:40px; }
#login .lo-form{ width:100%; max-width:380px; }
#login .lo-form h2{ font-size:24px; font-weight:800;  margin:0 0 4px; }
#login .lo-form p{ color:var(--ink-mute); font-size:13.5px; margin:0 0 26px; }
#login .lo-field{ margin-bottom:15px; }
#login .lo-field label{ font-size:12px; font-weight:600; color:var(--ink-mute); display:block; margin-bottom:6px; }
#login .lo-field input{ width:100%; height:46px; border:1px solid var(--border); border-radius:11px; padding:0 14px; outline:none; transition:.15s; }
#login .lo-field input:focus{ border-color:var(--cb-soft); box-shadow:0 0 0 3px rgba(11,31,143,.08); }
#login .lo-field.invalid input{ border-color:var(--risk); }
#login .lo-err{ color:var(--risk); font-size:12px; margin-top:6px; font-weight:600; display:none; }
#login .lo-field.invalid .lo-err{ display:block; }
#login .lo-row{ display:flex; align-items:center; justify-content:space-between; margin:6px 0 22px; font-size:13px; }
#login .lo-check{ display:flex; align-items:center; gap:8px; color:var(--ink-mute); cursor:pointer; }
#login .lo-link{ color:var(--cb); font-weight:600; cursor:pointer; }
#login .lo-submit{ width:100%; height:47px; border-radius:12px; background:var(--cb); color:#fff; font-weight:700; font-size:14.5px; display:flex; align-items:center; justify-content:center; gap:8px; }
#login .lo-submit:hover{ background:var(--cb-dark); }
#login .lo-submit svg{ width:18px; height:18px; flex-shrink:0; }
#login .lo-check input{ width:15px; height:15px; }
#login .lo-alt{ text-align:center; margin-top:22px; font-size:13px; color:var(--ink-mute); }
#login .lo-demo{ margin-top:20px; padding:12px 14px; border-radius:11px; background:var(--cb-soft); font-size:12px; color:var(--cb); line-height:1.5; }
@media (max-width:860px){ #login{ grid-template-columns:1fr; } #login .lo-brandside{ display:none; } }

/* ===== Today ===== */
.today{ display:flex; flex-direction:column; gap:18px; }
.today .greet{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.today .greet h1{ font-size:27px; font-weight:800;  margin:0; }
.today .greet p{ font-size:13.5px; color:var(--ink-mute); margin:4px 0 0; }
.today .greet-actions{ display:flex; gap:9px; }
.today .hero{ display:grid; grid-template-columns:1.45fr 1fr; gap:16px; }
.quota{ position:relative; overflow:hidden; border-radius:18px; padding:24px; color:#fff; background:linear-gradient(135deg,#0B1F8F,#061566); }
.quota .blob{ position:absolute; border-radius:50%; filter:blur(2px); }
.quota .blob.a{ width:180px; height:180px; right:-40px; top:-60px; background:rgba(77,112,255,.22); }
.quota .blob.b{ width:130px; height:130px; right:30px; bottom:-70px; background:rgba(77,112,255,.14); }
.quota .eyebrow{ font-size:10px; font-weight:700;  opacity:.72; position:relative; }
.quota .big{ display:flex; align-items:baseline; gap:12px; margin:6px 0 2px; position:relative; }
.quota .big .pct{ font-size:54px; font-weight:800; line-height:1;  }
.quota .big .pace{ font-size:13px; font-weight:600; color:#7DEAB0; }
.quota .of{ font-size:13px; opacity:.8; position:relative; }
.quota .track{ height:8px; border-radius:5px; background:rgba(255,255,255,.22); margin:14px 0 16px; overflow:hidden; position:relative; }
.quota .track i{ display:block; height:100%; border-radius:5px; background:#7DEAB0; }
.quota .mini{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; position:relative; }
.quota .mini .lbl{ font-size:9px; font-weight:700;  opacity:.66; }
.quota .mini .v{ font-size:16px; font-weight:700; margin-top:3px; }
.quota .qbtn{ margin-top:16px; display:inline-flex; align-items:center; gap:6px; padding:8px 13px; border-radius:9px; background:rgba(255,255,255,.16); color:#fff; font-size:12px; font-weight:600; position:relative; }
.quota .qbtn:hover{ background:rgba(255,255,255,.26); }
.donow{ border-radius:18px; padding:20px; background:var(--surface); border:1px solid var(--border); display:flex; flex-direction:column; }
.donow .head{ display:flex; align-items:center; gap:9px; margin-bottom:12px; }
.donow .spark{ width:30px; height:30px; border-radius:9px; background:var(--cb-soft); color:var(--cb); display:grid; place-items:center; }
.donow .spark svg{ width:17px; height:17px; }
.donow .kicker{ font-size:10px; font-weight:800;  color:var(--cb); }
.donow .name{ font-size:17px; font-weight:700; }
.donow .reason{ font-size:12.5px; color:var(--ink-mute); margin-top:3px; }
.donow .aibox{ margin-top:12px; background:#FAF7FF; border:1px solid var(--cb-soft); border-radius:10px; padding:11px 12px; font-size:12.5px; color:var(--cb); line-height:1.45; display:flex; align-items:flex-start; gap:7px; }
.donow .aibox svg{ width:15px; height:15px; flex-shrink:0; margin-top:1px; }
.donow .foot{ margin-top:auto; padding-top:14px; display:flex; gap:8px; }
.tag{ display:inline-flex; align-items:center; height:18px; padding:0 7px; border-radius:5px; font-size:10px; font-weight:700;  }
.kstrip{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.kpi{ background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:18px; text-align:left; display:block; cursor:pointer; }
.kpi:hover{ box-shadow:var(--shadow); }
.kpi .top{ display:flex; align-items:center; justify-content:space-between; }
.kpi .tile{ width:38px; height:38px; border-radius:11px; display:grid; place-items:center; }
.kpi .tile svg{ width:19px; height:19px; }
.kpi .top .chev{ color:var(--ink-dim); } .kpi .top .chev svg{ width:16px; height:16px; }
.kpi .val{ font-size:27px; font-weight:800;  margin-top:12px; }
.kpi .lbl{ font-size:12.5px; font-weight:600; margin-top:2px; }
.kpi .sub{ font-size:11px; color:var(--ink-dim); margin-top:3px; }
.today .body{ display:grid; grid-template-columns:1.6fr 1fr; gap:22px; }
.seclabel{ display:flex; align-items:center; justify-content:space-between; margin:2px 0 11px; }
.seclabel .t{ font-size:13px; font-weight:700; display:flex; align-items:center; gap:7px; }
.seclabel .t .dot{ width:8px; height:8px; border-radius:50%; background:var(--cb); }
.seclabel a, .seclabel .r{ font-size:12px; font-weight:600; color:var(--ink-mute); cursor:pointer; }
.prow{ background:var(--surface); border:1px solid var(--border); border-left-width:3px; border-radius:14px; padding:13px 15px; margin-bottom:10px; display:block; }
.prow:hover{ box-shadow:var(--shadow); }
.prow .r1{ display:flex; align-items:center; gap:9px; }
.prow .r1 .nm{ font-size:14px; font-weight:700; }
.prow .r1 .due{ margin-left:auto; font-size:11px; font-weight:600; color:var(--ink-mute); }
.prow .reason{ font-size:12.5px; color:var(--ink-mute); margin-top:7px; }
.prow .foot{ display:flex; gap:8px; margin-top:11px; }
.prow .pbtn{ height:32px; padding:0 12px; border-radius:8px; font-size:12px; font-weight:600; display:inline-flex; align-items:center; gap:6px; }
.prow .pbtn svg{ width:14px; height:14px; }
.prow .pbtn.pri{ background:var(--cb); color:#fff; } .prow .pbtn.ghost{ border:1px solid var(--border); color:var(--ink-mute); }
.stagebar{ display:flex; height:12px; border-radius:6px; overflow:hidden; margin-bottom:14px; background:var(--surface-mute); }
.stagebar i{ display:block; height:100%; }
.stagerow{ display:flex; align-items:center; gap:10px; padding:9px 0; border-top:1px solid var(--border-soft); font-size:13px; cursor:pointer; }
.stagerow:first-of-type{ border-top:0; }
.stagerow .dot{ width:9px; height:9px; border-radius:50%; }
.stagerow .cnt{ margin-left:auto; color:var(--ink-mute); font-size:12px; }
.stagerow .amt{ width:66px; text-align:right; font-weight:700; }
.rcard{ background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:16px; margin-bottom:16px; }
.ag{ display:flex; align-items:center; gap:11px; padding:8px 0; }
.ag .tm{ width:46px; font-size:12px; font-weight:700; color:var(--ink-mute); } .ag .tm small{ font-weight:600; color:var(--ink-dim); }
.ag .kbar{ width:3px; align-self:stretch; border-radius:2px; min-height:26px; }
.ag .ti{ font-size:13px; font-weight:600; } .ag .wh{ font-size:11px; color:var(--ink-dim); }
.lb{ display:flex; align-items:center; gap:10px; padding:7px 0; }
.lb .rk{ width:18px; font-size:12px; font-weight:700; color:var(--ink-dim); }
.lb .av{ width:28px; height:28px; border-radius:50%; background:var(--cb-soft); color:var(--cb); display:grid; place-items:center; font-size:11px; font-weight:700; }
.lb .nm{ font-size:13px; font-weight:600; }
.lb .pct{ margin-left:auto; font-size:13px; font-weight:700; }
.lb.me{ background:#EEF0FB; border-radius:10px; padding:7px 8px; margin:2px -8px; }
.win{ display:flex; align-items:center; gap:10px; padding:9px 0; border-top:1px solid var(--border-soft); }
.win:first-of-type{ border-top:0; } .win .nm{ font-size:13px; font-weight:600; } .win .mt{ font-size:11px; color:var(--ink-dim); }
.win .amt{ margin-left:auto; font-weight:700; color:var(--good); }
@media (max-width:980px){ .today .hero, .today .body, .kstrip{ grid-template-columns:1fr; } }

/* ===== Pipeline ===== */
.pipe{ display:flex; flex-direction:column; gap:16px; }
.pipe .head{ display:flex; align-items:center; gap:14px; }
.pipe .head .sub{ color:var(--ink-mute); font-size:13px; margin-top:3px; }
.pipe .filterbtn{ width:40px; height:40px; border-radius:11px; border:1px solid var(--border); background:var(--surface); display:grid; place-items:center; color:var(--ink-mute); position:relative; }
.pipe .filterbtn.on{ background:var(--cb); color:#fff; border-color:var(--cb); }
.pipe .filterbtn svg{ width:18px; height:18px; }
.pipe .caption{ font-size:12px; color:var(--ink-dim); }
.board{ display:flex; gap:12px; overflow-x:auto; padding-bottom:10px; }
.bcol{ width:266px; flex-shrink:0; }
.bcol-h{ display:flex; align-items:center; gap:8px; padding:4px 4px 10px; }
.bcol-h .dot{ width:9px; height:9px; border-radius:50%; }
.bcol-h .lab{ font-size:14px; font-weight:700; }
.bcol-h .meta{ margin-left:auto; font-size:11px; color:var(--ink-mute); }
.bcol-body{ background:var(--surface-mute); border-radius:14px; padding:8px; min-height:90px; display:flex; flex-direction:column; gap:8px; transition:.12s; }
.bcol-body.drop{ outline:2px dashed; outline-offset:-3px; }
.bcol-body .bempty{ text-align:center; color:var(--ink-dim); font-size:12px; padding:18px 8px; }
.dcard{ background:var(--surface); border:1px solid var(--border-soft); border-radius:10px; padding:11px 12px; cursor:grab; }
.dcard:hover{ box-shadow:var(--shadow); }
.dcard.dragging{ opacity:.4; }
.dcard .r1{ display:flex; align-items:flex-start; gap:8px; }
.dcard .nm{ font-size:13px; font-weight:600; line-height:1.25; }
.dcard .sc{ margin-left:auto; font-size:11px; font-weight:700; padding:1px 6px; border-radius:5px; }
.dcard .who{ font-size:11px; color:var(--ink-mute); margin-top:3px; }
.dcard .r3{ display:flex; align-items:center; justify-content:space-between; margin-top:8px; }
.dcard .amt{ font-size:13px; font-weight:700; } .dcard .lt{ font-size:10px; color:var(--ink-dim); }
.addd{ border:1px dashed var(--border); background:transparent; border-radius:9px; padding:9px; color:var(--ink-mute); font-size:12px; font-weight:600; text-align:center; }
.addd:hover{ background:var(--surface); }
.lgroup{ margin-bottom:16px; }
.lgroup-h{ display:flex; align-items:center; gap:8px; margin:2px 2px 8px; }
.lgroup-h .dot{ width:9px; height:9px; border-radius:50%; } .lgroup-h .lab{ font-size:12.5px; font-weight:700; } .lgroup-h .meta{ margin-left:auto; font-size:12px; color:var(--ink-mute); }
.lrow{ display:flex; align-items:center; gap:12px; padding:11px 14px; border-top:1px solid var(--border-soft); }
.lrow:first-child{ border-top:0; }
.lrow .av{ width:32px; height:32px; border-radius:50%; background:var(--cb-soft); color:var(--cb); display:grid; place-items:center; font-size:12px; font-weight:700; flex-shrink:0; }
.lrow .nm{ font-size:13px; font-weight:600; } .lrow .who{ font-size:11px; color:var(--ink-dim); } .lrow .amt{ font-weight:700; font-size:13px; width:64px; text-align:right; }
.stagepill{ display:inline-flex; align-items:center; gap:6px; height:26px; padding:0 10px; border-radius:999px; font-size:11px; font-weight:700; cursor:pointer; }
.stagepill .dot{ width:6px; height:6px; border-radius:50%; }
.pop{ position:absolute; z-index:60; background:var(--surface); border:1px solid var(--border); border-radius:11px; box-shadow:var(--shadow-lg); padding:6px; min-width:180px; animation:pop .14s; }
.pop button{ display:flex; align-items:center; gap:9px; width:100%; padding:8px 10px; border-radius:8px; font-size:13px; font-weight:500; text-align:left; }
.pop button:hover{ background:var(--surface-mute); }
.pop .dot{ width:8px; height:8px; border-radius:50%; }
.fc{ display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
.fc .span2{ grid-column:1 / -1; }
.fc-card{ background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:18px; }
.fc-card h3{ font-size:13px; font-weight:700; margin:0 0 14px; }
.s3{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.s3 .lbl{ font-size:9px; font-weight:700;  color:var(--ink-dim); } .s3 .v{ font-size:22px; font-weight:800; margin-top:4px; } .s3 .s{ font-size:11px; color:var(--ink-dim); margin-top:2px; }
.segbar{ display:flex; height:12px; border-radius:6px; overflow:hidden; margin:16px 0 10px; background:var(--surface-mute); } .segbar i{ display:block; height:100%; }
.legend{ display:flex; flex-wrap:wrap; gap:10px; } .legend span{ font-size:11px; color:var(--ink-mute); display:inline-flex; align-items:center; gap:5px; } .legend .dot{ width:8px; height:8px; border-radius:50%; }
.frow{ display:flex; align-items:center; gap:10px; padding:9px 0; border-top:1px solid var(--border-soft); font-size:13px; } .frow:first-of-type{ border-top:0; } .frow .dot{ width:9px; height:9px; border-radius:50%; } .frow .r{ margin-left:auto; font-weight:700; }
.prog{ height:6px; border-radius:3px; background:var(--surface-mute); overflow:hidden; margin-top:6px; } .prog i{ display:block; height:100%; }
.risk{ background:linear-gradient(135deg,#FEF2F2,#FFFAFA); border:1px solid #FECACA; }
@media (max-width:920px){ .fc{ grid-template-columns:1fr; } }

/* ===== Leads ===== */
.leads .toolbar{ display:flex; gap:10px; align-items:center; margin-bottom:14px; flex-wrap:wrap; }
.leads .lsearch{ flex:1; min-width:240px; height:40px; background:var(--surface); border:1px solid var(--border); border-radius:11px; display:flex; align-items:center; gap:10px; padding:0 14px; color:var(--ink-dim); }
.leads .lsearch input{ border:0; outline:none; flex:1; background:transparent; } .leads .lsearch svg{ width:17px; height:17px; }
.chips{ display:flex; gap:7px; flex-wrap:wrap; }
.chip{ border:1px solid var(--border); background:var(--surface); color:var(--ink-mute); padding:7px 13px; border-radius:999px; font-size:12.5px; font-weight:600; display:inline-flex; gap:7px; align-items:center; cursor:pointer; }
.chip.active{ background:var(--ink); color:#fff; border-color:var(--ink); }
.chip .ct{ background:var(--surface-mute); color:var(--ink-mute); padding:1px 7px; border-radius:999px; font-size:11px; font-weight:700; }
.chip.active .ct{ background:rgba(255,255,255,.2); color:#fff; }
.ltable{ width:100%; border-collapse:collapse; background:var(--surface); border:1px solid var(--border); border-radius:16px; overflow:hidden; }
.ltable th{ text-align:left; font-size:10.5px; font-weight:700;  color:var(--ink-dim); text-transform:uppercase; padding:13px 16px; border-bottom:1px solid var(--border); cursor:pointer; user-select:none; background:var(--surface-mute); }
.ltable th .ar{ opacity:.4; } .ltable th.sorted .ar{ opacity:1; color:var(--cb); }
.ltable td{ padding:13px 16px; border-bottom:1px solid var(--border-soft); font-size:13.5px; }
.ltable tr:last-child td{ border-bottom:0; }
.ltable tbody tr{ cursor:pointer; } .ltable tbody tr:hover{ background:var(--surface-mute); }
.ltable .co{ display:flex; align-items:center; gap:11px; }
.ltable .av{ width:36px; height:36px; border-radius:50%; background:var(--cb-soft); color:var(--cb); display:grid; place-items:center; font-size:13px; font-weight:700; flex-shrink:0; }
.ltable .co .nm{ font-weight:600; } .ltable .co .ow{ font-size:11.5px; color:var(--ink-dim); }
.stagecell{ display:inline-flex; align-items:center; gap:7px; font-weight:600; font-size:12.5px; } .stagecell .dot{ width:8px; height:8px; border-radius:50%; }
.sc-badge{ font-size:12px; font-weight:700; padding:2px 8px; border-radius:6px; }
.pager{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:14px; flex-wrap:wrap; }
.pager .info{ font-size:12.5px; color:var(--ink-mute); } .pager .info strong{ color:var(--ink); font-weight:700; }
.pager .pg{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.pgbtn{ min-width:34px; height:34px; padding:0 10px; border:1px solid var(--border); background:var(--surface); border-radius:9px; font-size:13px; font-weight:600; color:var(--ink-mute); display:inline-flex; align-items:center; justify-content:center; gap:6px; }
.pgbtn:hover:not(:disabled){ background:var(--surface-mute); color:var(--ink); } .pgbtn.active{ background:var(--cb); color:#fff; border-color:var(--cb); } .pgbtn:disabled{ opacity:.45; cursor:default; }
/* Drawer */
.dscrim{ position:fixed; inset:0; background:rgba(11,18,38,.32); z-index:60; opacity:0; pointer-events:none; transition:opacity .25s; }
.dscrim.open{ opacity:1; pointer-events:auto; }
.drawer{ position:fixed; top:0; right:0; bottom:0; width:min(940px,86vw); background:var(--bg); z-index:61; box-shadow:-14px 0 44px rgba(11,18,38,.18); transform:translateX(100%); transition:transform .28s cubic-bezier(.4,0,.2,1); display:flex; flex-direction:column; overflow:hidden; }
.drawer.open{ transform:none; }
.dhead{ background:var(--surface); border-bottom:1px solid var(--border); padding:18px 24px; }
.dhead .top{ display:flex; align-items:center; gap:14px; }
.dhead .bk{ width:32px; height:32px; border-radius:9px; background:var(--surface-mute); display:grid; place-items:center; } .dhead .bk svg{ width:18px; height:18px; }
.dhead .av{ width:54px; height:54px; border-radius:14px; background:var(--cb-soft); color:var(--cb); display:grid; place-items:center; font-size:18px; font-weight:700; }
.dhead h2{ font-size:21px; font-weight:800; margin:0;  } .dhead .ownr{ font-size:13px; color:var(--ink-mute); }
.dhead .acts{ margin-left:auto; display:flex; gap:8px; }
.track{ display:flex; gap:4px; margin-top:16px; }
.track .seg2{ flex:1; height:6px; border-radius:3px; background:var(--surface-mute); cursor:pointer; }
.track-row{ display:flex; align-items:center; justify-content:space-between; margin-top:7px; } .track-row .st{ font-size:13px; font-weight:700; } .track-row .lk{ font-size:12px; color:var(--ink-mute); }
.dtabs{ display:flex; gap:2px; padding:0 16px; background:var(--surface); border-bottom:1px solid var(--border); overflow-x:auto; }
.dtab{ padding:13px 14px; font-size:13px; font-weight:600; color:var(--ink-mute); border-bottom:2px solid transparent; white-space:nowrap; } .dtab.active{ color:var(--cb); border-bottom-color:var(--cb); }
.dbody{ flex:1; overflow-y:auto; padding:22px 24px; }
.dgrid{ display:grid; grid-template-columns:1.4fr 1fr; gap:16px; align-items:start; }
.fcard{ background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:16px; margin-bottom:14px; }
.fcard h4{ font-size:11px; font-weight:700;  text-transform:uppercase; color:var(--ink-dim); margin:0 0 12px; }
.kv{ display:flex; justify-content:space-between; gap:12px; padding:8px 0; border-top:1px solid var(--border-soft); font-size:13px; } .kv:first-of-type{ border-top:0; } .kv .key{ color:var(--ink-mute); } .kv .val{ font-weight:600; text-align:right; }
.kv .val[contenteditable]{ outline:none; border-bottom:1px dashed transparent; min-width:40px; } .kv .val[contenteditable]:focus{ border-bottom-color:var(--cb); }
.ifclose{ background:linear-gradient(135deg,#0B1F8F,#061566); color:#fff; border:0; } .ifclose .big{ font-size:28px; font-weight:800; }
.li{ display:flex; gap:11px; padding:12px 0; border-top:1px solid var(--border-soft); } .li:first-child{ border-top:0; }
.li .ic{ width:30px; height:30px; border-radius:8px; background:var(--surface-mute); display:grid; place-items:center; flex-shrink:0; font-size:14px; } .li .mt{ font-size:11px; color:var(--ink-dim); margin-top:2px; } .li .del{ margin-left:auto; color:var(--ink-dim); font-size:12px; cursor:pointer; }
.comp{ display:flex; gap:8px; margin-top:12px; }
.comp textarea, .comp input, .comp select{ width:100%; border:1px solid var(--border); border-radius:10px; padding:10px 12px; font-size:13px; outline:none; background:var(--surface); }
@media (max-width:900px){ .dgrid{ grid-template-columns:1fr; } }

/* ===== Add lead / Quote / Earnings / Leaderboard / Me ===== */
.addlead{ max-width:760px; margin:0 auto; }
.addlead .subbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; } .addlead .subbar h1{ font-size:18px; font-weight:800; margin:0; }
.modes{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:18px; }
.mode{ border:1px solid var(--border); background:var(--surface); border-radius:14px; padding:16px; text-align:center; font-weight:700; font-size:13px; color:var(--ink-mute); } .mode svg{ width:20px; height:20px; display:block; margin:0 auto 7px; } .mode.active{ background:var(--cb); color:#fff; border-color:var(--cb); }
.addlead .field2{ margin-bottom:16px; } .addlead label{ font-size:11px; font-weight:700;  text-transform:uppercase; color:var(--ink-dim); display:block; margin-bottom:6px; }
.addlead input{ width:100%; height:44px; border:1px solid var(--border); border-radius:10px; padding:0 14px; font-size:14px; outline:none; background:var(--surface); } .addlead input:focus{ border-color:var(--cb); box-shadow:0 0 0 3px rgba(11,31,143,.08); }
.addlead .field2.invalid input{ border-color:var(--risk); } .addlead .ferr{ color:var(--risk); font-size:11px; margin-top:5px; font-weight:600; display:none; } .addlead .field2.invalid .ferr{ display:block; }
.vpills{ display:flex; flex-wrap:wrap; gap:8px; } .vpill{ border:1px solid var(--border); background:var(--surface); border-radius:999px; padding:8px 14px; font-size:13px; font-weight:600; color:var(--ink-mute); } .vpill.active{ background:var(--cb); color:#fff; border-color:var(--cb); }
.scan{ background:#1a1d2e; border-radius:16px; padding:30px; text-align:center; color:#fff; } .scan .frame{ width:260px; max-width:90%; height:150px; margin:0 auto; border-radius:12px; border:2px dashed rgba(77,112,255,.6); display:grid; place-items:center; color:rgba(255,255,255,.55); font-size:12px; }
.mic{ width:96px; height:96px; border-radius:50%; background:var(--cb); display:grid; place-items:center; margin:24px auto; color:#fff; animation:pulse 1.6s infinite; } .mic svg{ width:34px; height:34px; }
@keyframes pulse{ 0%,100%{ box-shadow:0 0 0 10px rgba(11,31,143,.12);} 50%{ box-shadow:0 0 0 20px rgba(11,31,143,.05);} }
.note{ background:var(--warn-soft); color:#92600a; border-radius:10px; padding:11px 14px; font-size:12.5px; margin-top:14px; }
.earn{ } .earn .grid{ display:grid; grid-template-columns:1.2fr 1fr; gap:20px; align-items:start; }
.earn .hero{ position:relative; overflow:hidden; border-radius:18px; padding:24px; color:#fff; background:linear-gradient(135deg,var(--cb),var(--cb-dark)); margin-bottom:16px; } .earn .hero .blob{ position:absolute; width:160px; height:160px; right:-40px; top:-40px; border-radius:50%; background:rgba(77,112,255,.18); }
.earn .hero .eyebrow{ font-size:10px; font-weight:700;  opacity:.7; position:relative; } .earn .hero .big{ font-size:44px; font-weight:800;  line-height:1; margin:7px 0 6px; position:relative; } .earn .hero .ytd{ font-size:12px; opacity:.8; position:relative; }
.earn .hero .track3{ height:8px; border-radius:4px; background:rgba(255,255,255,.22); overflow:hidden; margin-top:14px; } .earn .hero .track3 i{ display:block; height:100%; border-radius:4px; background:#7DEAB0; }
.tier-row{ display:flex; align-items:center; gap:12px; padding:12px 16px; border-top:1px solid var(--border-soft); } .tier-row .ic{ width:30px; height:30px; border-radius:50%; display:grid; place-items:center; flex-shrink:0; font-size:13px; font-weight:700; } .tier-row .ic svg{ width:16px; height:16px; } .tier-row .ic.hit{ background:#DCFCE7; color:var(--good); } .tier-row .ic.idx{ background:var(--surface-mute); color:var(--ink-dim); } .tier-row .rate{ margin-left:auto; font-size:14px; font-weight:700; } .tier-row.cur{ background:var(--cb-soft); } .tier-row .sub{ font-size:11px; color:var(--ink-dim); }
.crow{ display:flex; align-items:center; gap:10px; padding:14px; border-top:1px solid var(--border-soft); } .crow:first-of-type{ border-top:0; } .crow .av{ width:32px; height:32px; border-radius:50%; background:var(--surface-mute); color:var(--ink-mute); display:grid; place-items:center; font-size:11px; font-weight:700; } .crow .rt{ margin-left:auto; text-align:right; } .crow .amt{ font-size:14px; font-weight:700; } .crow .amt.pend{ color:var(--warn); } .crow .ts{ font-size:11px; color:var(--ink-mute); }
.ctag{ display:inline-flex; align-items:center; height:18px; padding:0 6px; border-radius:4px; font-size:10px; font-weight:700;  margin-top:4px; text-transform:uppercase; } .ctag.paid{ background:var(--good-soft); color:var(--good); } .ctag.pend{ background:var(--warn-soft); color:var(--warn); }
.board3{ } .board3 .grid{ display:grid; grid-template-columns:1.4fr 1fr; gap:20px; align-items:start; }
.podium{ background:linear-gradient(180deg,#F8FAFF 0%,#fff 100%); padding:22px 18px 0; } .pod-wrap{ display:flex; align-items:flex-end; justify-content:center; gap:16px; } .pod{ display:flex; flex-direction:column; align-items:center; } .pod .pav{ border-radius:50%; display:grid; place-items:center; font-weight:700; } .pod .pnm{ font-size:12px; font-weight:600; margin-top:8px; } .pod .ppct{ font-size:14px; font-weight:700; margin-top:2px; } .pod .ped{ width:78px; border-radius:8px 8px 0 0; display:flex; align-items:flex-start; justify-content:center; padding-top:8px; color:#fff; font-weight:800; font-size:15px; margin-top:10px; }
.rrow{ display:flex; align-items:center; gap:10px; padding:12px 16px; border-top:1px solid var(--border-soft); } .rrow:first-of-type{ border-top:0; } .rrow .rk{ width:22px; font-size:11px; font-weight:700; color:var(--ink-dim); } .rrow .rav{ width:32px; height:32px; border-radius:50%; background:var(--cb-soft); color:var(--cb); display:grid; place-items:center; font-size:11px; font-weight:700; } .rrow .rpct{ margin-left:auto; font-size:14px; font-weight:700; } .rrow.me{ background:rgba(231,234,251,.6); }
.seclbl{ font-size:10px; font-weight:700;  color:var(--ink-dim); padding:0 4px 8px; text-transform:uppercase; margin-top:18px; }
.me{ max-width:760px; } .me .phead{ display:flex; align-items:center; gap:14px; margin-bottom:18px; } .me .phead .pav{ width:64px; height:64px; border-radius:50%; background:var(--cb-soft); color:var(--cb); display:grid; place-items:center; font-size:23px; font-weight:700; } .me .phead .nm{ font-size:20px; font-weight:700; } .me .phead .role{ font-size:12px; color:var(--ink-mute); margin-top:1px; }
.me .stat-card{ padding:16px; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; } .me .stat .lbl{ font-size:9px; font-weight:700;  color:var(--ink-dim); text-transform:uppercase; } .me .stat .v{ font-size:20px; font-weight:700; margin-top:4px; } .me .stat .s{ font-size:11px; color:var(--ink-mute); margin-top:2px; }
.me .frow2{ margin-bottom:14px; } .me .frow2.two{ display:grid; grid-template-columns:1fr 1fr; gap:14px; } .me label{ display:block; font-size:11px; font-weight:600; color:var(--ink-mute); margin-bottom:6px; } .me input{ width:100%; height:40px; border:1px solid var(--border); border-radius:10px; padding:0 12px; background:var(--surface); outline:none; } .me input:focus{ border-color:var(--cb-soft); box-shadow:0 0 0 3px rgba(11,31,143,.07); }
.me .nrow{ display:flex; align-items:center; gap:12px; padding:14px 16px; border-top:1px solid var(--border-soft); cursor:pointer; } .me .nrow:first-of-type{ border-top:0; } .me .nrow:hover{ background:var(--surface-mute); } .me .nrow .ic{ width:32px; height:32px; border-radius:10px; background:var(--cb-soft); color:var(--cb); display:grid; place-items:center; } .me .nrow .ic svg{ width:17px; height:17px; } .me .nrow .chev{ margin-left:auto; color:var(--ink-dim); }
.me .logout-row{ width:100%; display:flex; align-items:center; gap:12px; padding:14px 16px; color:var(--risk); font-size:14px; font-weight:600; } .me .logout-row:hover{ background:var(--risk-soft); } .me .logout-row .ic{ width:32px; height:32px; border-radius:10px; background:var(--risk-soft); color:var(--risk); display:grid; place-items:center; }
@media (max-width:980px){ .earn .grid, .board3 .grid{ grid-template-columns:1fr; } }

/* ===== Partners / Followups ===== */
.pkpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:16px; }
.pkpi{ background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:16px; } .pkpi .lbl{ font-size:11px; font-weight:700;  text-transform:uppercase; color:var(--ink-dim); } .pkpi .v{ font-size:26px; font-weight:800; margin-top:6px; } .pkpi .s{ font-size:11px; color:var(--ink-dim); margin-top:2px; }
.attn{ background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:14px 16px; margin-bottom:16px; } .attn .h{ display:flex; align-items:center; gap:9px; margin-bottom:10px; } .attn .badge2{ width:26px; height:26px; border-radius:8px; background:var(--warn-soft); color:var(--warn); display:grid; place-items:center; } .attn .t{ font-weight:700; font-size:13.5px; } .attn .ct{ background:var(--warn); color:#fff; font-size:11px; font-weight:700; border-radius:999px; padding:1px 8px; } .attn .rail{ display:flex; gap:10px; overflow-x:auto; padding-bottom:4px; }
.attncard{ flex-shrink:0; min-width:190px; border:1px solid var(--border); border-radius:11px; padding:10px 12px; display:flex; align-items:center; gap:10px; cursor:pointer; } .attncard:hover{ background:var(--surface-mute); } .attncard>div{ display:flex; flex-direction:column; gap:2px; min-width:0; } .attncard .av{ width:30px; height:30px; border-radius:50%; display:grid; place-items:center; color:#fff; font-size:11px; font-weight:700; flex-shrink:0; } .attncard .nm{ line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .attncard .due{ font-size:11px; font-weight:600; line-height:1.2; } .attncard .due.over{ color:var(--risk); } .attncard .due.today{ color:var(--warn); }
.ptoolbar{ display:flex; gap:10px; align-items:center; margin-bottom:14px; flex-wrap:wrap; } .ptoolbar .lsearch{ flex:1; min-width:220px; } .ptoolbar select{ height:40px; border:1px solid var(--border); border-radius:10px; padding:0 12px; background:var(--surface); font-size:13px; color:var(--ink-mute); }
.ptable{ width:100%; border-collapse:collapse; background:var(--surface); border:1px solid var(--border); border-radius:16px; overflow:hidden; } .ptable th{ text-align:left; font-size:10.5px; font-weight:700;  color:var(--ink-dim); text-transform:uppercase; padding:12px 16px; border-bottom:1px solid var(--border); background:var(--surface-mute); cursor:pointer; } .ptable td{ padding:12px 16px; border-bottom:1px solid var(--border-soft); font-size:13.5px; } .ptable tbody tr{ cursor:pointer; } .ptable tbody tr:hover{ background:var(--surface-mute); } .ptable .co{ display:flex; align-items:center; gap:11px; } .ptable .av{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center; color:#fff; font-size:12px; font-weight:700; position:relative; flex-shrink:0; } .ptable .av .hd{ position:absolute; right:-1px; bottom:-1px; width:11px; height:11px; border-radius:50%; border:2px solid var(--surface); } .ptable .nm{ font-weight:600; } .ptable .sub2{ font-size:11px; color:var(--ink-dim); }
.ptable tbody tr.pa-inactive{ opacity:.6; } .ptable tbody tr.pa-inactive:hover{ opacity:1; }
.pstat{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; } .pstat .dot{ width:8px; height:8px; border-radius:50%; }
.pboard{ display:flex; gap:12px; overflow-x:auto; padding-bottom:10px; } .pbcol{ width:250px; flex-shrink:0; } .pbcol-h{ display:flex; align-items:center; gap:8px; padding:4px 4px 10px; } .pbcol-h .dot{ width:9px; height:9px; border-radius:50%; } .pbcol-h .lab{ font-size:13px; font-weight:700; } .pbcol-h .meta{ margin-left:auto; font-size:11px; color:var(--ink-mute); } .pbcol-body{ background:var(--surface-mute); border-radius:14px; padding:8px; min-height:80px; display:flex; flex-direction:column; gap:8px; } .pbcol-body.drop{ outline:2px dashed; outline-offset:-3px; } .pcard{ background:var(--surface); border:1px solid var(--border-soft); border-radius:10px; padding:11px; cursor:grab; } .pcard .nm{ font-size:13px; font-weight:600; } .pcard .r{ display:flex; justify-content:space-between; margin-top:6px; font-size:11px; color:var(--ink-mute); }
.lbrow{ display:flex; align-items:center; gap:12px; padding:12px 16px; border-bottom:1px solid var(--border-soft); cursor:pointer; } .lbrow .rk{ width:26px; font-weight:800; font-size:15px; color:var(--ink-dim); } .lbrow .av{ width:36px; height:36px; border-radius:50%; display:grid; place-items:center; color:#fff; font-size:12px; font-weight:700; }
.feeditem{ display:flex; gap:11px; padding:12px 16px; border-bottom:1px solid var(--border-soft); } .feeditem .ic{ width:30px; height:30px; border-radius:8px; background:var(--surface-mute); display:grid; place-items:center; flex-shrink:0; }
.pdkpi{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:16px; } .pdkpi .c{ background:var(--surface-mute); border-radius:10px; padding:10px 12px; } .pdkpi .l{ font-size:9px; font-weight:700;  color:var(--ink-dim); } .pdkpi .v{ font-size:17px; font-weight:800; margin-top:3px; }
.pdactions{ display:flex; gap:7px; flex-wrap:wrap; margin-top:14px; } .pdactions button, .pdactions select{ height:34px; padding:0 12px; border-radius:9px; border:1px solid var(--border); background:var(--surface); font-size:12.5px; font-weight:600; color:var(--ink-mute); display:inline-flex; align-items:center; gap:6px; } .pdactions button:hover{ background:var(--surface-mute); }
/* Followups */
.fu{ display:flex; flex-direction:column; gap:18px; } .fu-counts{ display:flex; gap:10px; flex-wrap:wrap; } .fu-count{ background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:10px 14px; min-width:96px; } .fu-count .n{ font-size:22px; font-weight:800;  line-height:1; } .fu-count .l{ font-size:11px; font-weight:600; color:var(--ink-mute); margin-top:4px; display:flex; align-items:center; gap:5px; } .fu-count .l .d{ width:7px; height:7px; border-radius:50%; }
.fu-glabel{ font-size:11px; font-weight:800;  text-transform:uppercase; color:var(--ink-dim); margin:0 4px 9px; display:flex; align-items:center; gap:8px; } .fu-glabel .gc{ font-size:11px; font-weight:700; color:var(--ink-dim); background:var(--surface-mute); border-radius:9px; padding:1px 8px; }
.fu-row{ display:flex; gap:12px; padding:14px; border-top:1px solid var(--border-soft); align-items:flex-start; transition:opacity .2s; } .fu-row:first-child{ border-top:0; } .fu-row.done{ opacity:.45; }
.fu-cb{ width:22px; height:22px; border-radius:50%; border:2px solid var(--border); flex-shrink:0; display:grid; place-items:center; margin-top:1px; background:var(--surface); } .fu-cb:hover{ border-color:var(--good); } .fu-cb svg{ width:13px; height:13px; color:#fff; opacity:0; } .fu-row.done .fu-cb{ background:var(--good); border-color:var(--good); } .fu-row.done .fu-cb svg{ opacity:1; }
.fu-acc{ margin-top:18px; } .fu-acc-h{ width:100%; cursor:pointer; background:none; border:0; text-align:left; padding:2px 4px 9px; } .fu-acc-h .fu-acc-chev{ margin-left:auto; display:inline-flex; align-items:center; transition:transform .15s; } .fu-acc-h .fu-acc-chev svg{ width:15px; height:15px; } .fu-acc-h.open .fu-acc-chev{ transform:rotate(90deg); } #fuDoneBody .fu-lead{ cursor:pointer; }
.fu-title{ font-size:13.5px; font-weight:500; line-height:1.4; } .fu-row.done .fu-title{ text-decoration:line-through; } .fu-meta{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:6px; } .fu-prio{ display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:600; } .fu-prio .d{ width:7px; height:7px; border-radius:50%; } .fu-due{ font-size:11px; color:var(--ink-mute); } .fu-lead{ font-size:11px; font-weight:600; color:var(--cb); cursor:pointer; } .fu-act{ width:30px; height:30px; border-radius:8px; background:var(--surface-mute); color:var(--ink-mute); display:grid; place-items:center; } .fu-act:hover{ background:var(--border); color:var(--ink); } .fu-act svg{ width:15px; height:15px; }
@media (max-width:980px){ .pkpis{ grid-template-columns:repeat(2,1fr); } }

/* ===== Inbox / Calendar ===== */
.inbox{ display:flex; flex-direction:column; }
.ix-pills{ display:flex; gap:6px; flex-wrap:wrap; } .ix-pill{ height:30px; padding:0 13px; border-radius:999px; font-size:12.5px; font-weight:600; background:var(--surface-mute); color:var(--ink-mute); display:inline-flex; align-items:center; gap:6px; border:1px solid transparent; } .ix-pill:hover{ background:var(--border); color:var(--ink); } .ix-pill.active{ background:var(--cb); color:#fff; } .ix-pill .pc{ width:7px; height:7px; border-radius:50%; }
.ix-grid{ display:grid; grid-template-columns:380px 1fr; gap:16px; align-items:stretch; min-height:560px; }
.ix-list{ background:var(--surface); border:1px solid var(--border); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; max-height:calc(100vh - 210px); }
.ix-list-scroll{ overflow-y:auto; flex:1; }
.ix-thread{ display:flex; gap:12px; padding:14px; width:100%; text-align:left; border-top:1px solid var(--border-soft); align-items:flex-start; cursor:pointer; } .ix-thread:first-child{ border-top:0; } .ix-thread:hover{ background:var(--surface-mute); } .ix-thread.sel{ background:var(--cb-soft); }
.ix-av{ width:40px; height:40px; border-radius:50%; background:var(--cb-soft); color:var(--cb); display:grid; place-items:center; font-weight:700; font-size:13px; flex-shrink:0; }
.ix-r1{ display:flex; align-items:center; gap:8px; } .ix-name{ font-size:14px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .ix-ts{ margin-left:auto; font-size:10px; color:var(--ink-dim); flex-shrink:0; }
.ix-r2{ display:flex; align-items:center; gap:6px; margin-top:2px; } .ix-biz{ font-size:11px; color:var(--ink-mute); } .ix-chan{ font-size:9px; font-weight:700;  text-transform:uppercase; } .ix-prev{ font-size:12.5px; color:var(--ink-mute); margin-top:5px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; line-height:1.4; }
.ix-conv{ background:var(--surface); border:1px solid var(--border); border-radius:16px; display:flex; flex-direction:column; max-height:calc(100vh - 210px); overflow:hidden; }
.ix-conv-head{ display:flex; align-items:center; gap:11px; padding:14px 16px; border-bottom:1px solid var(--border); flex-shrink:0; } .ix-conv-head .ix-av{ width:36px; height:36px; } .ix-conv-title{ font-size:14px; font-weight:700; } .ix-conv-sub{ font-size:11px; color:var(--ink-mute); }
.ix-conv-scroll{ flex:1; overflow-y:auto; padding:18px 16px; display:flex; flex-direction:column; gap:9px; }
.ix-bub{ max-width:78%; padding:10px 14px; border-radius:16px; font-size:13px; line-height:1.45; box-shadow:var(--shadow-sm); } .ix-bub .ix-meta{ font-size:9px; opacity:.62; margin-top:5px; display:flex; align-items:center; gap:5px; } .ix-bub.out{ align-self:flex-end; background:var(--cb); color:#fff; border-bottom-right-radius:4px; } .ix-bub.in{ align-self:flex-start; background:var(--surface); color:var(--ink); border:1px solid var(--border-soft); border-bottom-left-radius:4px; } .ix-chip{ font-size:8px; font-weight:700;  text-transform:uppercase; padding:1px 5px; border-radius:4px; background:rgba(255,255,255,.2); } .ix-bub.in .ix-chip{ background:var(--surface-mute); color:var(--ink-mute); }
.ix-composer{ border-top:1px solid var(--border); padding:11px 12px; flex-shrink:0; } .ix-chanrow{ display:flex; gap:5px; margin-bottom:8px; } .ix-chanbtn{ height:28px; padding:0 11px; border-radius:8px; font-size:11.5px; font-weight:600; background:var(--surface-mute); color:var(--ink-mute); display:inline-flex; align-items:center; gap:5px; } .ix-chanbtn svg{ width:13px; height:13px; } .ix-chanbtn.active{ background:var(--cb); color:#fff; }
.ix-inputrow{ display:flex; gap:8px; align-items:flex-end; } .ix-ta{ flex:1; min-height:38px; max-height:120px; border:1px solid var(--border); border-radius:11px; padding:9px 12px; outline:none; resize:none; font-size:13px; line-height:1.4; } .ix-ta:focus{ border-color:var(--cb-soft); box-shadow:0 0 0 3px rgba(11,31,143,.07); } .ix-sendbtn{ width:42px; height:42px; border-radius:50%; background:var(--surface-mute); color:var(--ink-dim); display:grid; place-items:center; flex-shrink:0; } .ix-sendbtn.on{ background:var(--cb); color:#fff; } .ix-sendbtn svg{ width:18px; height:18px; }
.cal{ display:flex; flex-direction:column; } .cal-nav{ display:flex; align-items:center; gap:8px; } .cal-navbtn{ width:34px; height:34px; border-radius:9px; border:1px solid var(--border); background:var(--surface); display:grid; place-items:center; color:var(--ink-mute); } .cal-navbtn:hover{ background:var(--surface-mute); color:var(--ink); } .cal-navbtn svg{ width:17px; height:17px; }
.cal-month-wrap{ display:grid; grid-template-columns:1fr 320px; gap:16px; align-items:start; }
.cal-grid{ background:var(--surface); border:1px solid var(--border); border-radius:16px; overflow:hidden; } .cal-dow{ display:grid; grid-template-columns:repeat(7,1fr); background:var(--surface-mute); } .cal-dow span{ font-size:11px; font-weight:700;  text-transform:uppercase; color:var(--ink-mute); padding:9px 0 9px 9px; } .cal-weeks{ display:grid; grid-template-rows:repeat(6,minmax(92px,1fr)); } .cal-week{ display:grid; grid-template-columns:repeat(7,1fr); border-top:1px solid var(--border-soft); } .cal-cell{ border-left:1px solid var(--border-soft); padding:6px 7px 8px; min-width:0; cursor:pointer; display:flex; flex-direction:column; gap:3px; } .cal-cell:first-child{ border-left:0; } .cal-cell:hover{ background:var(--surface-mute); } .cal-cell.sel{ background:var(--cb-soft); box-shadow:inset 0 0 0 2px var(--cb); } .cal-cell.out .cal-daynum{ color:var(--ink-dim); } .cal-daynum{ min-width:22px; height:22px; border-radius:11px; display:inline-grid; place-items:center; font-size:12px; font-weight:600; align-self:flex-start; } .cal-cell.today .cal-daynum{ background:var(--cb); color:#fff; font-weight:800; } .cal-chip{ font-size:10.5px; font-weight:600; padding:2px 6px; border-radius:4px; border-left:3px solid; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.3; } .cal-more{ font-size:10px; font-weight:600; color:var(--ink-mute); }
.cal-agenda{ background:var(--surface); border:1px solid var(--border); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; max-height:calc(100vh - 190px); } .cal-agenda-head{ padding:16px 18px; border-bottom:1px solid var(--border-soft); } .cal-agenda-kicker{ font-size:10px; font-weight:800;  color:var(--cb); } .cal-agenda-date{ font-size:20px; font-weight:800;  margin-top:3px; } .cal-agenda-count{ font-size:12px; color:var(--ink-mute); margin-top:3px; } .cal-agenda-list{ flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:8px; } .cal-ag-item{ display:flex; gap:10px; align-items:flex-start; } .cal-ag-time{ width:52px; flex-shrink:0; text-align:right; font-size:12px; font-weight:700; color:var(--cb); padding-top:8px; } .cal-eventblock{ flex:1; min-width:0; text-align:left; border-radius:9px; padding:8px 11px; border-left:3px solid; } .cal-eventblock .eb-t{ font-size:12.5px; font-weight:600; } .cal-eventblock .eb-w{ font-size:10.5px; color:var(--ink-mute); margin-top:2px; } .cal-agenda-foot{ padding:12px; border-top:1px solid var(--border-soft); } .cal-agenda-foot .btn{ width:100%; justify-content:center; }
@media (max-width:980px){ .ix-grid{ grid-template-columns:1fr; } .cal-month-wrap{ grid-template-columns:1fr; } }

/* ===== Admin console ===== */
.adm{ display:flex; flex-direction:column; gap:16px; }
.adm-banner{ display:flex; align-items:center; gap:11px; background:#0A1230; color:#E7EAF7; border-radius:13px; padding:12px 16px; font-size:12.5px; font-weight:500; } .adm-banner svg{ width:17px; height:17px; color:#9FB4FF; flex-shrink:0; } .adm-banner a{ color:#9FB4FF; font-weight:600; text-decoration:underline; cursor:pointer; } .adm-banner-pill{ margin-left:auto; display:inline-flex; align-items:center; gap:6px; flex-shrink:0; background:rgba(220,38,38,.18); color:#FCA5A5; font-size:11px; font-weight:700; padding:4px 10px; border-radius:8px; } .adm-banner-pill svg{ width:13px; height:13px; color:#FCA5A5; }
.adm-tabs{ display:flex; flex-wrap:wrap; gap:6px; } .adm-tab{ padding:7px 13px; border-radius:9px; font-size:13px; font-weight:600; color:var(--ink-mute); background:var(--surface); border:1px solid var(--border); cursor:pointer; } .adm-tab:hover{ background:var(--surface-mute); color:var(--ink); } .adm-tab.active{ background:var(--cb); color:#fff; border-color:var(--cb); }
.adm-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-top:2px; } .adm-head h1{ font-size:22px; font-weight:800;  margin:0; } .adm-head p{ font-size:12.5px; color:var(--ink-mute); margin:4px 0 0; max-width:640px; }
.adm-panel{ background:var(--surface); border:1px solid var(--border-soft); border-radius:16px; overflow:hidden; } .adm-panel-h{ display:flex; align-items:center; gap:10px; padding:13px 16px; border-bottom:1px solid var(--border-soft); } .adm-panel-t{ font-family:'Outfit',sans-serif; font-size:10.5px; font-weight:700;  text-transform:uppercase; color:var(--ink-dim); } .adm-panel-h .actions{ margin-left:auto; display:flex; align-items:center; gap:8px; } .adm-panel-b{ padding:16px; } .adm-panel-b.flush{ padding:0; }
.adm-kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; } .adm-kpi{ background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:18px; border-top:3px solid var(--cb); cursor:pointer; } .adm-kpi .kh{ display:flex; align-items:center; gap:9px; } .adm-kpi .chip{ width:30px; height:30px; border-radius:9px; display:grid; place-items:center; } .adm-kpi .chip svg{ width:16px; height:16px; } .adm-kpi .kl{ font-family:'Outfit',sans-serif; font-size:10px; font-weight:700;  text-transform:uppercase; color:var(--ink-dim); } .adm-kpi .kv{ font-size:26px; font-weight:800;  margin-top:12px; } .adm-kpi .ks{ font-size:11.5px; color:var(--ink-mute); margin-top:3px; }
.tgl{ width:34px; height:20px; border-radius:11px; background:var(--border); position:relative; flex-shrink:0; transition:background .15s; cursor:pointer; display:inline-block; } .tgl::after{ content:''; position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:50%; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.2); transition:transform .15s; } .tgl.on{ background:var(--cb); } .tgl.on::after{ transform:translateX(14px); }
.sdot{ display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:600; } .sdot .d{ width:8px; height:8px; border-radius:50%; }
.rolepill{ display:inline-flex; align-items:center; padding:3px 9px; border-radius:6px; font-size:11px; font-weight:700; }
.atbl{ width:100%; } .atbl-h, .atbl-r{ display:grid; align-items:center; gap:12px; padding:0 16px; } .atbl-h{ background:var(--surface-mute); height:38px; } .atbl-h span{ font-family:'Outfit',sans-serif; font-size:9.5px; font-weight:700;  text-transform:uppercase; color:var(--ink-dim); } .atbl-r{ min-height:54px; padding:9px 16px; border-top:1px solid var(--border-soft); } .atbl-r:first-of-type{ border-top:0; } .atbl-r:hover{ background:var(--surface-mute); } .acell{ display:flex; align-items:center; gap:11px; min-width:0; } .acell .nm{ font-size:13px; font-weight:600; line-height:1.25; } .acell .sub{ font-size:11px; color:var(--ink-mute); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.aav{ border-radius:50%; background:var(--cb-soft); color:var(--cb); display:grid; place-items:center; font-weight:700; flex-shrink:0; width:32px; height:32px; font-size:12px; }
.mtag{ display:inline-flex; align-items:center; height:18px; padding:0 7px; border-radius:5px; font-size:10px; font-weight:700;  background:var(--surface-mute); color:var(--ink-mute); }
.abar{ width:120px; height:6px; border-radius:3px; background:var(--surface-mute); overflow:hidden; } .abar i{ display:block; height:100%; border-radius:3px; }
.amore{ width:28px; height:28px; border-radius:8px; display:grid; place-items:center; color:var(--ink-mute); } .amore:hover{ background:var(--border); color:var(--ink); } .amore svg{ width:18px; height:18px; }
.setrow{ display:flex; align-items:center; gap:14px; padding:14px 16px; border-top:1px solid var(--border-soft); } .setrow:first-of-type{ border-top:0; } .setrow .lbl{ font-size:13.5px; font-weight:600; } .setrow .sub{ font-size:11.5px; color:var(--ink-mute); margin-top:2px; }
@media (max-width:1000px){ .adm-kpis{ grid-template-columns:repeat(2,1fr); } }

/* ============================================================
   PPD — Partner Profile Drawer (faithful port, Cobalt-recolored)
   Scoped under #ppdRoot.ppd so class names don't collide.
   ============================================================ */
.ppd{
  --accent:#0B1F8F; --accent-hover:#061566; --accent-soft:#E7EAFB;
  --accent-softer:#D8DEF7; --accent-fg:#0B1F8F; --accent-ring:#B9C3F3;
  --ink:#0B1226; --ink-hover:#1c2540;
  --bg-surface:#FFFFFF; --bg-soft:#F6F7FB; --bg-softer:#F1F2F7;
  --border:#E5E7EE; --border-soft:#EEF0F5; --border-input:#DfE2EC; --border-strong:#CBD0DE;
  --text-primary:#0B1226; --text-secondary:#3f4457; --text-muted:#5B6072; --text-faint:#8A8FA3; --text-empty:#b6bacb;
  --text-on-dark:#e2e8f5; --text-on-dark-muted:#8494b8;
  --ok:#16a34a; --ok-soft:#DCFCE7; --warn:#D97706; --warn-soft:#FEF3C7; --danger:#dc2626; --danger-soft:#FEE2E2; --info:#0369a1; --info-soft:#E0F2FE;
  --hot:#ea580c; --hot-soft:#ffedd5;
  --tier-cashdisc:#7c3aed; --tier-cashdisc-soft:#F1ECFE; --tier-iso:#0B1F8F; --tier-iso-soft:#E7EAFB;
  --tier-bevly:#0d9488; --tier-bevly-soft:#CCFBF1; --tier-c25:#b45309; --tier-c25-soft:#FEF3C7; --tier-c35:#c2410c; --tier-c35-soft:#FFEDD5;
  --r-1:6px; --r-2:8px; --r-3:10px; --r-4:14px; --r-pill:999px;
  --sh-1:0 1px 2px rgba(11,18,38,.06); --sh-2:0 6px 22px rgba(11,18,38,.12); --sh-drawer:-14px 0 44px rgba(11,18,38,.20);
}
.ppd .avatar{ width:34px; height:34px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:#fff; font-weight:600; font-size:12.5px; flex-shrink:0; background:#94a3b8;  }
.ppd .avatar--md{ width:28px; height:28px; font-size:10.5px; } .ppd .avatar--xl{ width:64px; height:64px; font-size:20px; border-radius:16px; }
.ppd .tier{ display:inline-flex; align-items:center; gap:5px; padding:2px 8px; border-radius:var(--r-pill); font-size:11px; font-weight:600; white-space:nowrap; line-height:1.3; }
.ppd .tier .dot{ width:5px; height:5px; border-radius:50%; }
.ppd .tier--cashdisc{ background:var(--tier-cashdisc-soft); color:var(--tier-cashdisc); } .ppd .tier--cashdisc .dot{ background:var(--tier-cashdisc); }
.ppd .tier--iso{ background:var(--tier-iso-soft); color:var(--tier-iso); } .ppd .tier--iso .dot{ background:var(--tier-iso); }
.ppd .tier--bevly{ background:var(--tier-bevly-soft); color:var(--tier-bevly); } .ppd .tier--bevly .dot{ background:var(--tier-bevly); }
.ppd .tier--c25{ background:var(--tier-c25-soft); color:var(--tier-c25); } .ppd .tier--c25 .dot{ background:var(--tier-c25); }
.ppd .tier--c35{ background:var(--tier-c35-soft); color:var(--tier-c35); } .ppd .tier--c35 .dot{ background:var(--tier-c35); }
.ppd .status{ display:inline-flex; align-items:center; gap:6px; padding:3px 9px; border-radius:var(--r-pill); font-size:11.5px; font-weight:600; white-space:nowrap; line-height:1.3; }
.ppd .status .dot{ width:6px; height:6px; border-radius:50%; }
.ppd .status--intro{ background:#f1f5f9; color:#475569; } .ppd .status--intro .dot{ background:#94a3b8; }
.ppd .status--docusign{ background:var(--warn-soft); color:var(--warn); } .ppd .status--docusign .dot{ background:var(--warn); }
.ppd .status--signed-noactivity{ background:var(--info-soft); color:var(--info); } .ppd .status--signed-noactivity .dot{ background:var(--info); }
.ppd .status--signed-5{ background:#ecfdf5; color:#047857; } .ppd .status--signed-5 .dot{ background:#10b981; }
.ppd .status--signed-10{ background:#d1fae5; color:#065f46; } .ppd .status--signed-10 .dot{ background:#059669; }
.ppd .status--signed-15{ background:#a7f3d0; color:#065f46; } .ppd .status--signed-15 .dot{ background:#047857; }
.ppd .status--hot{ background:linear-gradient(135deg,#ffedd5,#fed7aa); color:#b91c1c; } .ppd .status--hot .dot{ background:var(--hot); box-shadow:0 0 0 3px rgba(234,88,12,.2); }
.ppd .status--lost{ background:#f3f4f6; color:#6b7280; text-decoration:line-through; } .ppd .status--lost .dot{ background:#9ca3af; }
.ppd .tag{ display:inline-flex; align-items:center; gap:5px; padding:2px 8px; background:var(--bg-soft); border:1px solid var(--border); border-radius:var(--r-pill); font-size:11.5px; color:var(--text-secondary); font-weight:500; }
.ppd .mono{ font-family:'Outfit','Inter',ui-monospace,monospace; font-variant-numeric:tabular-nums; }
/* overlay + drawer */
.ppd .drawer-overlay{ position:fixed; inset:0; background:rgba(11,18,38,.5); z-index:1090; opacity:0; pointer-events:none; transition:opacity .15s; }
.ppd .drawer-overlay.is-open{ opacity:1; pointer-events:auto; }
.ppd .drawer{ position:fixed; top:0; right:0; bottom:0; width:var(--drawer-w,min(1050px,96vw)); background:var(--bg-soft); z-index:1091; box-shadow:var(--sh-drawer); transform:translateX(100%); transition:transform .26s cubic-bezier(.16,1,.3,1); display:flex; flex-direction:column; overflow:hidden; }
.ppd .drawer.is-open{ transform:translateX(0); }
.ppd .drawer__head{ padding:16px 24px 0; border-bottom:1px solid var(--border); background:var(--bg-surface); flex-shrink:0; }
.ppd .drawer__topbar{ display:flex; align-items:center; gap:8px; margin-bottom:12px; }
.ppd .drawer__topbar .crumb{ display:flex; align-items:center; gap:6px; font-size:12px; color:var(--text-faint); }
.ppd .drawer__topbar .crumb b{ color:var(--text-primary); font-weight:600; }
.ppd .drawer__topbar .spacer{ flex:1; }
.ppd .drawer__topbar .pid{ font-family:'Outfit',monospace; font-size:11.5px; color:var(--text-muted); background:var(--bg-soft); border:1px solid var(--border); padding:2px 8px; border-radius:var(--r-pill); }
.ppd .icon-btn{ width:30px; height:30px; border-radius:var(--r-1); display:inline-flex; align-items:center; justify-content:center; color:var(--text-muted); }
.ppd .icon-btn:hover{ background:var(--bg-soft); color:var(--text-primary); }
.ppd .drawer__hero{ display:flex; align-items:flex-start; gap:14px; padding:4px 0 14px; }
.ppd .drawer__hero .info{ flex:1; min-width:0; }
.ppd .drawer__hero h2{ font-size:20px; font-weight:800;  margin:0 0 6px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; color:var(--text-primary); }
.ppd .drawer__hero .meta{ color:var(--text-muted); font-size:13px; display:flex; gap:12px; flex-wrap:wrap; }
.ppd .drawer__hero .meta span{ display:inline-flex; align-items:center; gap:5px; }
.ppd .drawer__hero .meta b{ color:var(--text-primary); font-weight:600; }
.ppd .drawer__kpis{ display:grid; grid-template-columns:repeat(4,1fr); background:var(--bg-soft); border:1px solid var(--border); border-radius:var(--r-3); margin-bottom:14px; }
.ppd .drawer__kpis .cell{ padding:10px 14px; border-right:1px solid var(--border); }
.ppd .drawer__kpis .cell:last-child{ border-right:0; }
.ppd .drawer__kpis .l{ font-size:10px; font-weight:600; color:var(--text-faint); text-transform:uppercase;  }
.ppd .drawer__kpis .v{ font-size:18px; font-weight:700; color:var(--text-primary); margin-top:2px; font-variant-numeric:tabular-nums; display:flex; align-items:baseline; gap:4px; }
.ppd .drawer__kpis .s{ font-size:11px; color:var(--text-muted); margin-top:2px; } .ppd .drawer__kpis .s.up{ color:var(--ok); }
.ppd .stages{ display:flex; gap:0; padding:0 0 14px; }
.ppd .stage{ flex:1; border:0; padding:7px 12px 7px 18px; font-size:11px; font-weight:600; color:#94a3b8; background:#eef2f6; white-space:nowrap; clip-path:polygon(0 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,0 100%,8px 50%); margin-left:-4px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; transition:filter .12s; }
.ppd .stage:hover{ filter:brightness(1.04); }
.ppd .stage:first-child{ margin-left:0; clip-path:polygon(0 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,0 100%); padding-left:12px; }
.ppd .stage:last-child{ clip-path:polygon(0 0,100% 0,100% 100%,0 100%,8px 50%); }
.ppd .stage.reached{ color:#1e293b; background:var(--accent-soft); }
.ppd .stage.current{ color:#fff; background:var(--accent); }
.ppd .stage.lost{ background:#fee2e2; color:#991b1b; }
.ppd .drawer__actbar{ background:var(--bg-surface); padding:10px 24px; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:8px; flex-shrink:0; flex-wrap:wrap; position:relative; }
.ppd .actbtn{ display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border-radius:var(--r-2); border:1px solid var(--border-input); background:var(--bg-surface); color:var(--text-secondary); font-size:13px; font-weight:500; transition:.12s; }
.ppd .actbtn:hover{ background:var(--bg-soft); color:var(--text-primary); }
.ppd .actbtn.primary{ background:var(--ink); color:#fff; border-color:var(--ink); } .ppd .actbtn.primary:hover{ background:var(--ink-hover); }
.ppd .actbtn.accent{ background:var(--accent); color:#fff; border-color:var(--accent); } .ppd .actbtn.accent:hover{ background:var(--accent-hover); }
.ppd .over-menu{ position:absolute; top:calc(100% + 6px); right:24px; width:220px; background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--r-3); box-shadow:var(--sh-2); z-index:1100; padding:6px; }
.ppd .over-menu .item{ padding:7px 10px; border-radius:var(--r-1); font-size:13px; display:flex; align-items:center; gap:9px; cursor:pointer; color:var(--text-primary); }
.ppd .over-menu .item:hover{ background:var(--bg-soft); } .ppd .over-menu .item.danger{ color:var(--danger); } .ppd .over-menu .item.danger:hover{ background:var(--danger-soft); }
.ppd .over-menu .sep{ height:1px; background:var(--border-soft); margin:4px 0; } .ppd .over-menu .item .ic{ color:var(--text-muted); display:inline-flex; } .ppd .over-menu .item.danger .ic{ color:var(--danger); }
.ppd .drawer__tabs{ display:flex; align-items:center; padding:0 20px; background:var(--bg-surface); border-bottom:1px solid var(--border); flex-shrink:0; overflow-x:auto; }
.ppd .drawer__tab{ padding:12px 14px; font-size:13px; font-weight:500; color:var(--text-muted); border-bottom:2px solid transparent; margin-bottom:-1px; cursor:pointer; display:inline-flex; align-items:center; gap:7px; transition:.12s; white-space:nowrap; }
.ppd .drawer__tab:hover{ color:var(--text-primary); }
.ppd .drawer__tab.is-active{ color:var(--text-primary); border-color:var(--accent); font-weight:600; }
.ppd .drawer__tab .ct{ font-family:'Outfit',monospace; font-size:10px; background:#f1f5f9; padding:1px 6px; border-radius:var(--r-pill); color:var(--text-muted); font-weight:700; }
.ppd .drawer__tab.is-active .ct{ background:var(--accent-soft); color:var(--accent-fg); }
.ppd .drawer__body{ flex:1; overflow-y:auto; padding:18px 20px 60px; }
.ppd .dgrid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; } .ppd .dgrid .full{ grid-column:1 / -1; }
.ppd .dcard{ background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--r-4); overflow:hidden; }
.ppd .dcard__head{ padding:11px 16px; border-bottom:1px solid var(--border-soft); display:flex; align-items:center; gap:8px; }
.ppd .dcard__head h3{ font-size:13px; font-weight:600; margin:0;  display:flex; align-items:center; gap:6px; }
.ppd .dcard__head .spacer{ flex:1; }
.ppd .dcard__head .actlink{ font-size:12px; color:var(--accent); font-weight:500; display:inline-flex; align-items:center; gap:4px; cursor:pointer; }
.ppd .dcard__head .actlink:hover{ text-decoration:underline; }
.ppd .dcard__body{ padding:14px 16px; } .ppd .dcard__body.tight{ padding:6px 16px; }
.ppd .ai-card{ background:linear-gradient(135deg,#eef1ff 0%,#f3ecff 100%); border:1px solid var(--accent-ring); border-radius:var(--r-4); padding:14px 16px; position:relative; overflow:hidden; }
.ppd .ai-card__head{ display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.ppd .ai-card__head .badge{ display:inline-flex; align-items:center; gap:5px; padding:3px 8px; background:rgba(255,255,255,.7); border:1px solid var(--accent-ring); border-radius:var(--r-pill); font-size:10.5px; font-weight:700; color:var(--accent-fg); text-transform:uppercase;  }
.ppd .ai-card__title{ font-weight:700; font-size:14px; color:var(--text-primary); }
.ppd .ai-card__body{ font-size:13px; color:var(--text-secondary); line-height:1.5; margin-top:2px; }
.ppd .ai-card__actions{ display:flex; gap:6px; margin-top:10px; align-items:center; }
.ppd .ai-card__actions .actbtn{ font-size:12.5px; padding:5px 10px; }
.ppd .kv{ display:grid; grid-template-columns:110px 1fr; gap:8px 14px; padding:7px 0; border-bottom:1px solid var(--border-soft); align-items:center; }
.ppd .kv:last-child{ border-bottom:0; }
.ppd .kv .k{ font-size:12px; color:var(--text-faint); font-weight:500; }
.ppd .kv .v{ font-size:13px; color:var(--text-primary); font-weight:500; display:flex; align-items:center; gap:6px; }
.ppd .kv .v.mono{ font-family:'Outfit',monospace; } .ppd .kv .v a{ color:var(--accent); }
.ppd .kv .v.editable{ cursor:text; border-radius:var(--r-1); padding:2px 6px; margin:-2px -6px; transition:.12s; }
.ppd .kv .v.editable:hover{ background:var(--accent-soft); box-shadow:inset 0 0 0 1px var(--accent-ring); }
.ppd .inline-input{ width:100%; padding:6px 9px; font-size:13px; border:1px solid var(--accent); border-radius:var(--r-2); outline:none; background:var(--bg-surface); color:var(--text-primary); box-shadow:0 0 0 3px var(--accent-ring); font-family:inherit; }
.ppd select.inline-input{ cursor:pointer; }
.ppd .stars{ color:#f59e0b;  font-size:13px; } .ppd .stars .empty{ color:#e5e7eb; }
.ppd .timeline{ position:relative; padding-left:22px; }
.ppd .timeline::before{ content:""; position:absolute; left:8px; top:4px; bottom:0; width:1.5px; background:var(--border); }
.ppd .tline{ position:relative; padding:0 0 16px; } .ppd .tline:last-child{ padding-bottom:0; }
.ppd .tline__dot{ position:absolute; left:-22px; top:2px; width:18px; height:18px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:var(--bg-surface); border:1.5px solid var(--border); color:var(--text-muted); }
.ppd .tline__dot.tl-call{ border-color:var(--info); color:var(--info); background:var(--info-soft); }
.ppd .tline__dot.tl-email{ border-color:var(--accent); color:var(--accent); background:var(--accent-soft); }
.ppd .tline__dot.tl-note{ border-color:var(--warn); color:var(--warn); background:var(--warn-soft); }
.ppd .tline__dot.tl-status{ border-color:var(--ok); color:var(--ok); background:var(--ok-soft); }
.ppd .tline__dot.tl-lead{ border-color:var(--tier-cashdisc); color:var(--tier-cashdisc); background:var(--tier-cashdisc-soft); }
.ppd .tline__dot.tl-doc{ border-color:var(--tier-bevly); color:var(--tier-bevly); background:var(--tier-bevly-soft); }
.ppd .tline__head{ display:flex; align-items:center; gap:8px; font-size:12.5px; }
.ppd .tline__head .who{ font-weight:600; color:var(--text-primary); } .ppd .tline__head .act{ color:var(--text-muted); }
.ppd .tline__head .when{ color:var(--text-faint); margin-left:auto; font-family:'Outfit',monospace; font-size:11px; }
.ppd .tline__body{ font-size:13px; color:var(--text-secondary); margin-top:4px; line-height:1.5; }
.ppd .tline__body.qt{ background:var(--bg-soft); border-left:2px solid var(--border-strong); padding:8px 12px; border-radius:0 var(--r-1) var(--r-1) 0; margin-top:6px; }
.ppd .subtable{ width:100%; border-collapse:collapse; font-size:13px; }
.ppd .subtable th{ font-size:10.5px; text-transform:uppercase;  color:var(--text-faint); text-align:left; padding:8px 14px; font-weight:600; border-bottom:1px solid var(--border); background:var(--bg-softer); }
.ppd .subtable td{ padding:10px 14px; border-bottom:1px solid var(--border-soft); } .ppd .subtable tr:last-child td{ border-bottom:0; }
.ppd .subtable .tnum{ text-align:right; font-family:'Outfit',monospace; font-weight:600; }
.ppd .composer{ border:1px solid var(--border-input); border-radius:var(--r-3); background:var(--bg-surface); overflow:hidden; }
.ppd .composer textarea{ width:100%; min-height:70px; border:0; outline:0; padding:12px 14px; resize:vertical; font-size:13.5px; background:transparent; font-family:inherit; }
.ppd .composer__foot{ display:flex; align-items:center; gap:6px; padding:8px 10px; border-top:1px solid var(--border-soft); background:var(--bg-soft); }
.ppd .composer__foot select{ height:28px; padding:0 8px; border:1px solid var(--border-input); background:var(--bg-surface); border-radius:var(--r-1); font-size:12px; color:var(--text-secondary); }
.ppd .composer__foot .spacer{ flex:1; }
.ppd .tpl-list{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.ppd .tpl{ border:1px solid var(--border-input); border-radius:var(--r-3); padding:10px 12px; cursor:pointer; background:var(--bg-surface); transition:.12s; }
.ppd .tpl:hover{ border-color:var(--accent); background:var(--accent-soft); }
.ppd .tpl .n{ font-size:13px; font-weight:600; color:var(--text-primary); margin-bottom:3px; display:flex; align-items:center; gap:6px; }
.ppd .tpl .s{ font-size:11.5px; color:var(--text-muted); line-height:1.4; }
.ppd .cmsn-split{ display:flex; gap:4px; margin:6px 0 10px; width:100%; }
.ppd .cmsn-split .seg{ flex:var(--w,1); padding:8px 12px; font-size:11px; font-weight:600; color:#fff; background:var(--c,var(--accent)); text-align:center; display:inline-flex; align-items:center; justify-content:center; gap:6px; }
.ppd .cmsn-split .seg:first-child{ border-radius:var(--r-1) 0 0 var(--r-1); } .ppd .cmsn-split .seg:last-child{ border-radius:0 var(--r-1) var(--r-1) 0; } .ppd .cmsn-split .seg:only-child{ border-radius:var(--r-1); }
.ppd .cmsn-split .seg .pct{ font-family:'Outfit',monospace; font-weight:700; }
.ppd .chart-row{ display:flex; align-items:flex-end; gap:5px; height:80px; padding:8px 0; } .ppd .chart-row.with-labels{ height:102px; }
.ppd .chart-bar{ flex:1; background:var(--accent-softer); border-radius:3px 3px 0 0; position:relative; min-height:4px; transition:background .15s; }
.ppd .chart-bar:hover{ background:var(--accent); } .ppd .chart-bar.zero{ background:var(--border-soft); }
.ppd .chart-bar .lbl{ position:absolute; bottom:-18px; left:0; right:0; text-align:center; font-size:10px; color:var(--text-faint); font-family:'Outfit',monospace; }
.ppd .chart-bar .val{ position:absolute; top:-16px; left:0; right:0; text-align:center; font-size:10px; color:var(--text-muted); font-family:'Outfit',monospace; opacity:0; transition:.12s; }
.ppd .chart-bar:hover .val{ opacity:1; }
.ppd .doc-row{ display:flex; align-items:center; gap:12px; padding:10px 12px; border:1px solid var(--border-soft); border-radius:var(--r-3); margin-bottom:8px; background:var(--bg-surface); }
.ppd .doc-row .ic{ width:32px; height:38px; background:var(--bg-soft); border:1px solid var(--border); border-radius:4px; display:inline-flex; align-items:center; justify-content:center; color:var(--accent); font-family:'Outfit',monospace; font-size:9px; font-weight:700; }
.ppd .doc-row .info{ flex:1; min-width:0; } .ppd .doc-row .info .n{ font-weight:600; font-size:13px; } .ppd .doc-row .info .m{ font-size:11.5px; color:var(--text-faint); font-family:'Outfit',monospace; }
.ppd .empty{ padding:44px 20px; text-align:center; color:var(--text-faint); }
.ppd .empty .ic{ width:56px; height:56px; margin:0 auto 14px; border-radius:50%; background:var(--bg-soft); display:inline-flex; align-items:center; justify-content:center; color:var(--text-muted); }
.ppd .empty .t{ font-size:14px; font-weight:600; color:var(--text-primary); margin-bottom:4px; }
/* modals */
.ppd .modal-overlay{ position:fixed; inset:0; background:rgba(11,18,38,.55); z-index:1200; display:flex; align-items:center; justify-content:center; padding:24px; animation:ppdfade .14s ease; }
@keyframes ppdfade{ from{ opacity:0; } to{ opacity:1; } }
.ppd .modal{ background:var(--bg-surface); border-radius:var(--r-4); box-shadow:0 20px 60px rgba(11,18,38,.3); width:100%; max-width:var(--modal-w,560px); max-height:calc(100vh - 48px); display:flex; flex-direction:column; overflow:hidden; animation:ppdmodal .18s cubic-bezier(.16,1,.3,1); }
@keyframes ppdmodal{ from{ transform:translateY(8px) scale(.99); opacity:0; } to{ transform:none; opacity:1; } }
.ppd .modal--lg{ --modal-w:720px; } .ppd .modal--xl{ --modal-w:880px; }
.ppd .modal__head{ padding:16px 20px; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:10px; }
.ppd .modal__head h3{ font-size:15px; font-weight:700; margin:0; color:var(--text-primary); flex:1;  }
.ppd .modal__head .meta{ font-size:12px; color:var(--text-muted); }
.ppd .modal__head .x{ width:30px; height:30px; display:inline-flex; align-items:center; justify-content:center; border-radius:var(--r-1); color:var(--text-muted); }
.ppd .modal__head .x:hover{ background:var(--bg-soft); color:var(--text-primary); }
.ppd .modal__body{ padding:16px 20px; overflow-y:auto; flex:1; }
.ppd .modal__foot{ padding:12px 20px; background:var(--bg-soft); border-top:1px solid var(--border); display:flex; align-items:center; gap:8px; justify-content:flex-end; flex-shrink:0; }
.ppd .modal__foot .left{ margin-right:auto; }
.ppd .modal-for-partner{ display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--bg-soft); border:1px solid var(--border); border-radius:var(--r-2); margin-bottom:14px; }
.ppd .modal-for-partner .n{ font-size:13px; font-weight:600; } .ppd .modal-for-partner .s{ font-size:11.5px; color:var(--text-muted); }
.ppd .field{ display:flex; flex-direction:column; gap:4px; margin-bottom:12px; }
.ppd .field .lbl{ font-size:11px; font-weight:600; color:var(--text-muted); text-transform:uppercase;  display:flex; align-items:center; gap:6px; }
.ppd .field .lbl .req{ color:var(--danger); } .ppd .field .lbl .hint{ font-size:11px; color:var(--text-faint); font-weight:400; text-transform:none;  margin-left:auto; }
.ppd .field input,.ppd .field textarea,.ppd .field select{ width:100%; padding:8px 12px; font-size:13px; border:1px solid var(--border-input); border-radius:var(--r-2); outline:none; background:var(--bg-surface); color:var(--text-primary); transition:border-color .12s; }
.ppd .field input:focus,.ppd .field textarea:focus,.ppd .field select:focus{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-ring); }
.ppd .field textarea{ resize:vertical; min-height:90px; font-family:inherit; } .ppd .field .help{ font-size:11px; color:var(--text-faint); margin-top:2px; }
.ppd .field-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.ppd .seg-ctl{ display:inline-flex; gap:2px; background:var(--bg-soft); border:1px solid var(--border-input); border-radius:var(--r-2); padding:2px; }
.ppd .seg-ctl button{ padding:6px 12px; font-size:12.5px; font-weight:500; border-radius:5px; color:var(--text-muted); }
.ppd .seg-ctl button.is-active{ background:var(--bg-surface); color:var(--text-primary); box-shadow:var(--sh-1); }
.ppd .seg-ctl.dark button.is-active{ background:var(--ink); color:#fff; }
.ppd .tpl-pick{ display:flex; flex-direction:column; gap:6px; }
.ppd .tpl-pick-row{ border:1px solid var(--border-input); border-radius:var(--r-2); padding:10px 12px; cursor:pointer; display:flex; align-items:center; gap:10px; background:var(--bg-surface); transition:.12s; }
.ppd .tpl-pick-row:hover,.ppd .tpl-pick-row.is-active{ border-color:var(--accent); background:var(--accent-soft); }
.ppd .tpl-pick-row .ic{ width:28px; height:28px; flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; border-radius:var(--r-2); background:var(--accent-soft); color:var(--accent); }
.ppd .tpl-pick-row .info{ flex:1; min-width:0; } .ppd .tpl-pick-row .info .n{ font-size:13px; font-weight:600; } .ppd .tpl-pick-row .info .s{ font-size:11.5px; color:var(--text-muted); }
.ppd .tpl-pick-row .tagm{ font-size:10px; padding:1px 7px; border-radius:var(--r-pill); background:#f1f5f9; color:var(--text-muted); font-weight:700; }
.ppd .email-preview{ border:1px solid var(--border); border-radius:var(--r-3); overflow:hidden; background:var(--bg-surface); }
.ppd .email-preview__head{ padding:12px 16px; border-bottom:1px solid var(--border-soft); display:flex; flex-direction:column; gap:6px; }
.ppd .email-preview__head .row{ display:flex; align-items:center; gap:8px; font-size:13px; }
.ppd .email-preview__head .row .k{ font-size:11px; color:var(--text-faint); font-weight:600; text-transform:uppercase;  width:56px; }
.ppd .email-preview__head .row .v{ color:var(--text-primary); font-weight:500; }
.ppd .email-preview__head .row .v.subj{ font-weight:700; font-size:14.5px; }
.ppd .email-preview__body{ padding:16px 18px; font-size:13.5px; color:var(--text-primary); line-height:1.6; white-space:pre-wrap; min-height:200px; max-height:320px; overflow-y:auto; }
.ppd .email-preview__body .mf,.ppd .subj .mf{ background:var(--accent-soft); color:var(--accent-fg); padding:1px 5px; border-radius:4px; font-weight:500; border-bottom:1px dashed var(--accent); }
.ppd .sms-phone{ background:linear-gradient(135deg,#1e293b,#334155); padding:20px; border-radius:var(--r-4); display:flex; flex-direction:column; gap:8px; position:relative; min-height:220px; }
.ppd .sms-bubble{ align-self:flex-end; max-width:80%; background:var(--accent); color:#fff; padding:8px 12px; border-radius:16px 16px 4px 16px; font-size:13.5px; line-height:1.4; white-space:pre-wrap; box-shadow:0 2px 6px rgba(0,0,0,.2); }
.ppd .sms-bubble.them{ align-self:flex-start; background:rgba(255,255,255,.92); color:#0f172a; border-radius:16px 16px 16px 4px; }
.ppd .sms-meta{ align-self:flex-end; font-size:11px; color:rgba(255,255,255,.55); display:flex; align-items:center; gap:8px; font-family:'Outfit',monospace; }
.ppd .sms-meta .dot{ width:4px; height:4px; border-radius:50%; background:rgba(255,255,255,.4); }
.ppd .cal{ background:var(--bg-surface); border:1px solid var(--border); border-radius:var(--r-3); padding:12px; }
.ppd .cal__head{ display:flex; align-items:center; gap:8px; margin-bottom:8px; } .ppd .cal__head h4{ margin:0; font-size:13px; font-weight:700; flex:1; }
.ppd .cal__head button{ width:24px; height:24px; border-radius:6px; display:inline-flex; align-items:center; justify-content:center; color:var(--text-muted); } .ppd .cal__head button:hover{ background:var(--bg-soft); color:var(--text-primary); }
.ppd .cal__grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:2px; }
.ppd .cal__dow{ text-align:center; padding:6px 0; font-size:10px; font-weight:600; color:var(--text-faint); text-transform:uppercase;  }
.ppd .cal__day{ height:32px; border-radius:var(--r-1); display:inline-flex; align-items:center; justify-content:center; font-size:12.5px; cursor:pointer; font-variant-numeric:tabular-nums; color:var(--text-primary); }
.ppd .cal__day:hover{ background:var(--bg-soft); } .ppd .cal__day.muted{ color:var(--text-empty); } .ppd .cal__day.today{ font-weight:700; color:var(--accent); }
.ppd .cal__day.selected{ background:var(--accent); color:#fff; font-weight:600; }
.ppd .dispos{ display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.ppd .dispos label{ display:flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid var(--border-input); border-radius:var(--r-2); cursor:pointer; font-size:12.5px; transition:.12s; }
.ppd .dispos label:hover{ background:var(--bg-soft); } .ppd .dispos label.is-on{ border-color:var(--accent); background:var(--accent-soft); color:var(--accent-fg); font-weight:600; }
.ppd .dispos label input{ width:14px; height:14px; margin:0; }
.ppd .ref-link{ display:flex; align-items:center; border:1px solid var(--border-input); border-radius:var(--r-2); overflow:hidden; background:var(--bg-soft); }
.ppd .ref-link .url{ flex:1; padding:9px 12px; font-family:'Outfit',monospace; font-size:12.5px; color:var(--text-primary); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ppd .ref-link .cpy{ padding:10px 14px; background:var(--ink); color:#fff; font-size:12.5px; font-weight:600; display:inline-flex; align-items:center; gap:6px; align-self:stretch; }
.ppd .tile-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.ppd .tile{ background:var(--bg-soft); border:1px solid var(--border); border-radius:var(--r-2); padding:10px 12px; }
.ppd .tile .l{ font-size:10.5px; color:var(--text-faint); text-transform:uppercase;  font-weight:600; } .ppd .tile .v{ font-size:18px; font-weight:700; font-variant-numeric:tabular-nums; margin-top:2px; }
.ppd .toast-rack{ position:fixed; top:80px; right:24px; z-index:3000; display:flex; flex-direction:column; gap:8px; }
.ppd .toast{ display:flex; align-items:center; gap:10px; padding:10px 14px; background:var(--ink); color:#fff; border-radius:var(--r-2); box-shadow:0 4px 16px rgba(0,0,0,.2); font-size:13px; min-width:240px; animation:ppdslide .2s ease-out; }
@keyframes ppdslide{ from{ transform:translateY(10px); opacity:0; } to{ transform:none; opacity:1; } }
.ppd .toast--success{ border-left:3px solid #22c55e; } .ppd .toast--warn{ border-left:3px solid #f59e0b; } .ppd .toast--danger{ background:var(--danger); }
.ppd svg{ width:auto; height:auto; }
/* Add Partner drawer */
.ppd .avatar--sm{ width:22px; height:22px; font-size:9.5px; }
.ppd .add-drawer{ --drawer-w:min(720px,94vw); }
.ppd .add-drawer .drawer__body{ padding-bottom:20px; }
.ppd .form-sec{ margin-bottom:22px; }
.ppd .form-sec:last-child{ margin-bottom:0; }
.ppd .form-sec__title{ font-size:11px; font-weight:700; color:var(--text-muted); text-transform:uppercase;  padding-bottom:10px; margin-bottom:14px; border-bottom:1px solid var(--border); }
/* display:block keeps an errored input VISIBLE — the general rule `.field .err{display:none}`
   (an error-message convention) also matches these inputs and would otherwise hide the whole
   field on a validation error, leaving only the message. This more-specific rule wins. */
.ppd .field input.err,.ppd .field textarea.err{ border-color:var(--danger); background:var(--danger-soft); display:block; }
.ppd .field-err{ font-size:11.5px; color:var(--danger); margin-top:3px; font-weight:500; }
.ppd .req{ color:var(--danger); }
.ppd .readonly-field{ padding:8px 12px; border:1px solid var(--border); border-radius:var(--r-2); background:var(--bg-soft); display:flex; align-items:center; min-height:38px; }
.ppd .tag-input{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; padding:7px 10px; border:1px solid var(--border-input); border-radius:var(--r-2); background:var(--bg-surface); min-height:38px; }
.ppd .tag-input:focus-within{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-ring); }
.ppd .tag-input input{ flex:1; min-width:120px; border:0; outline:0; padding:2px; font-size:13px; background:transparent; }
.ppd .tag-chip{ display:inline-flex; align-items:center; gap:5px; padding:3px 6px 3px 9px; background:var(--accent-soft); color:var(--accent-fg); border-radius:var(--r-pill); font-size:12px; font-weight:600; }
.ppd .tag-chip button{ width:15px; height:15px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:rgba(11,31,143,.14); color:var(--accent-fg); }
.ppd .tag-chip button:hover{ background:rgba(11,31,143,.28); }
.ppd .dup-warn{ border:1px solid #fcd34d; background:#fffbeb; border-radius:var(--r-3); padding:12px 14px; margin-bottom:18px; }
.ppd .dup-warn__head{ display:flex; align-items:center; gap:7px; font-size:12.5px; color:#92400e; margin-bottom:10px; }
.ppd .dup-warn__head b{ color:#78350f; } .ppd .dup-warn__head span{ color:#b45309; }
.ppd .dup-row{ display:flex; align-items:center; gap:10px; padding:7px 0; border-top:1px solid #fde68a; }
.ppd .add-drawer__foot{ flex-shrink:0; padding:12px 24px; background:var(--bg-surface); border-top:1px solid var(--border); display:flex; align-items:center; gap:8px; justify-content:flex-end; box-shadow:0 -4px 16px rgba(15,24,40,.05); }
.ppd .add-drawer__foot .left{ margin-right:auto; }
@media (max-width:900px){ .ppd .dgrid{ grid-template-columns:1fr; } .ppd .drawer__kpis{ grid-template-columns:1fr 1fr; } }

/* Agent Agenda overlay iframe */
#agendaFrame.open{ inset:0 !important; right:0; bottom:0; width:100% !important; height:100% !important; }

/* ===== Global search palette ===== */
.gs-panel{ position:fixed; z-index:120; background:var(--surface); border:1px solid var(--border); border-radius:14px; box-shadow:var(--shadow-lg); padding:6px; max-height:70vh; overflow:auto; display:none; }
.gs-panel.open{ display:block; animation:pop .14s ease; }
.gs-group{ font-size:10px; font-weight:800;  text-transform:uppercase; color:var(--ink-dim); padding:8px 10px 4px; }
.gs-item{ display:flex; align-items:center; gap:11px; padding:8px 10px; border-radius:10px; cursor:pointer; }
.gs-item:hover, .gs-item.sel{ background:var(--cb-soft); }
.gs-ic{ width:30px; height:30px; border-radius:8px; display:grid; place-items:center; flex-shrink:0; }
.gs-ic svg{ width:16px; height:16px; }
.gs-txt{ flex:1; min-width:0; display:flex; flex-direction:column; }
.gs-title{ font-size:13.5px; font-weight:600; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gs-title mark{ background:#fde68a; color:inherit; border-radius:2px; padding:0 1px; }
.gs-sub{ font-size:11.5px; color:var(--ink-mute); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gs-kind{ font-size:10px; font-weight:700; text-transform:uppercase;  flex-shrink:0; }
.gs-empty{ padding:26px 16px; text-align:center; color:var(--ink-mute); }
.gs-empty svg{ width:22px; height:22px; opacity:.5; }
.gs-empty div{ font-size:13.5px; font-weight:600; color:var(--ink); margin-top:8px; }
.gs-empty span{ font-size:12px; color:var(--ink-dim); display:block; margin-top:3px; }
.gs-foot{ display:flex; gap:14px; padding:9px 12px 5px; border-top:1px solid var(--border-soft); margin-top:5px; font-size:11px; color:var(--ink-dim); }
.gs-foot kbd{ font-family:'Outfit',monospace; font-size:10px; background:var(--bg-soft); border:1px solid var(--border); border-radius:4px; padding:1px 5px; margin-right:2px; }

/* ===== Empty states ===== */
.empty-state{ text-align:center; padding:48px 24px; color:var(--ink-mute); }
/* ===== Inline-edit rows (My Leads drawer) ===== */
.ie-row{ display:grid; grid-template-columns:130px 1fr; gap:10px; padding:7px 10px 7px 0; border-bottom:1px solid var(--border-soft); align-items:center; cursor:pointer; border-radius:6px; transition:background .12s; }
.ie-row:hover{ background:var(--bg-soft); }
.ie-label{ font-size:12px; color:var(--ink-mute); font-weight:500; padding-left:4px; }
.ie-val{ font-size:13px; color:var(--ink); font-weight:500; display:flex; align-items:center; gap:6px; min-height:24px; }
.ie-val svg{ width:14px; height:14px; }
.ie-pencil{ opacity:0; color:var(--ink-dim); display:inline-flex; margin-left:auto; transition:opacity .12s; flex-shrink:0; }
.ie-row:hover .ie-pencil{ opacity:.55; }
.ie-pending, .ie-pending:hover{ background:var(--cb-soft); }
.ie-dot{ color:var(--cb); font-size:8px; vertical-align:middle; }
/* Overview "two-up" fields: stacked label/value cells in a 2-column grid so the
   Business Information and Pipeline & Attribution cards are ~half the height. */
.ie-grid2{ display:grid; grid-template-columns:1fr 1fr; gap:0 18px; }
.ie-row--stack{ display:block; padding:7px 8px; align-items:stretch; }
.ie-row--stack .ie-label{ display:block; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.02em; color:var(--ink-dim); padding-left:0; }
.ie-row--stack .ie-val{ font-size:13px; margin-top:2px; min-height:20px; }
.ie-row--stack .ie-pencil{ margin-left:auto; }
.ie-row.ie-ro{ cursor:default; }
.ie-row.ie-ro:hover{ background:transparent; }
/* Address / City / State / ZIP / Google packed into one row at the foot of the card. */
.ie-loc5{ display:grid; grid-template-columns:1.3fr .9fr .62fr .72fr .85fr; gap:0 11px; }
/* Address / City / State / ZIP row (Google moved up into the Verticals row above). */
.ie-loc4{ display:grid; grid-template-columns:1.7fr .9fr .62fr .72fr; gap:0 11px; }
@media(max-width:640px){ .ie-grid2{ grid-template-columns:1fr; } .ie-loc5{ grid-template-columns:1fr 1fr; } .ie-loc4{ grid-template-columns:1fr 1fr; } }
/* A long street address stays on its single row and truncates with an ellipsis
   rather than wrapping or widening the cell. */
.ie-loc5 [data-ie="address"] .ie-val,
.ie-loc4 [data-ie="address"] .ie-val{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* Fractional Google-rating stars: a grey 5-star base with a gold overlay clipped
   to --cbpct (rating/5) so 4.5 shows 4½ stars. */
.cbstars{ position:relative; display:inline-block; font-size:12px; color:var(--border); line-height:1; white-space:nowrap; vertical-align:middle; }
.cbstars::before{ content:"★★★★★"; position:absolute; left:0; top:0; width:var(--cbpct,0%); overflow:hidden; color:#f5a524; }
/* Street-address autocomplete dropdown (body-appended, position:fixed). */
.ie-ac{ position:fixed; z-index:1200; background:var(--surface); border:1px solid var(--border); border-radius:10px; box-shadow:0 12px 32px rgba(11,18,38,.18); padding:4px; max-height:280px; overflow-y:auto; max-width:min(440px,92vw); }
.ie-ac-item{ padding:8px 10px; border-radius:7px; cursor:pointer; display:flex; flex-direction:column; gap:1px; }
.ie-ac-item:hover, .ie-ac-item.on{ background:var(--cb-soft); }
.ie-ac-main{ font-size:13px; font-weight:600; color:var(--ink); }
.ie-ac-sub{ font-size:11.5px; color:var(--ink-dim); }
.empty-state .es-ic{ width:52px; height:52px; border-radius:14px; background:var(--cb-soft); color:var(--cb); display:grid; place-items:center; margin:0 auto 14px; }
.empty-state .es-ic svg{ width:26px; height:26px; }
.empty-state h3{ font-size:16px; font-weight:700; color:var(--ink); margin:0 0 5px; }
.empty-state p{ font-size:13px; color:var(--ink-mute); margin:0 auto 16px; max-width:340px; line-height:1.5; }
.empty-state .btn-primary, .empty-state .btn{ display:inline-flex; }

/* ===== Mobile pass (all surfaces: RFP, Payouts, SA admin, Social, console) ===== */
@media (max-width:820px){
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns:1fr 1.2fr"],
  [style*="grid-template-columns:1.2fr 1fr"],
  [style*="grid-template-columns:1.3fr 1fr"],
  [style*="grid-template-columns:1.5fr 1fr"],
  [style*="grid-template-columns:1.6fr 1fr"],
  [style*="grid-template-columns:2fr 1fr"],
  [style*="grid-template-columns:repeat(2,1fr)"],
  [style*="grid-template-columns:repeat(3,1fr)"],
  [style*="grid-template-columns:repeat(4,1fr)"]{ grid-template-columns:1fr !important; }
  .statgrid{ grid-template-columns:repeat(2,1fr) !important; }
  .adm-kpis{ grid-template-columns:repeat(2,1fr) !important; }
  .adm-panel{ overflow-x:auto; }
  .adm-panel .tbl, .adm-panel table{ min-width:560px; }
  .page-head{ flex-wrap:wrap; gap:12px; }
  .adm-tabs{ overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch; }
  .adm-tab{ white-space:nowrap; }
  .seg{ flex-wrap:wrap; }
}
@media (max-width:560px){
  .statgrid, .adm-kpis{ grid-template-columns:1fr !important; }
  .main{ padding:16px 14px !important; }
  .page-title{ font-size:20px !important; }
  .gs-panel{ width:calc(100vw - 20px) !important; left:10px !important; }
}

/* == PAGE CSS END == */

/* ===== Notifications: bell dropdown ===== */
.bell-panel{ position:fixed; z-index:90; width:380px; max-width:calc(100vw - 24px); background:var(--surface); border:1px solid var(--border); border-radius:16px; box-shadow:var(--shadow-lg); overflow:hidden; animation:pop .16s ease; }
.bell-panel .bp-head{ display:flex; align-items:center; gap:10px; padding:13px 15px; border-bottom:1px solid var(--border-soft); }
.bell-panel .bp-title{ font-weight:800; font-size:14.5px;  }
.bell-panel .bp-count{ font-size:11px; font-weight:800; color:#fff; background:var(--cb); border-radius:999px; padding:2px 8px; }
.bell-panel .bp-mark{ margin-left:auto; font-size:12px; font-weight:700; color:var(--cb); }
.bell-panel .bp-mark:hover{ text-decoration:underline; }
.bell-panel .bp-list{ max-height:404px; overflow-y:auto; }
.bell-panel .bp-item{ display:flex; gap:11px; align-items:flex-start; width:100%; text-align:left; padding:12px 15px; border-bottom:1px solid var(--border-soft); position:relative; }
.bell-panel .bp-item:hover{ background:var(--surface-mute); }
.bell-panel .bp-item.unread{ background:linear-gradient(90deg,rgba(11,31,143,.045),transparent 60%); }
.bell-panel .bp-ic{ width:34px; height:34px; border-radius:10px; display:grid; place-items:center; flex-shrink:0; }
.bell-panel .bp-ic svg{ width:17px; height:17px; }
.bell-panel .bp-body{ min-width:0; display:flex; flex-direction:column; gap:2px; flex:1; }
.bell-panel .bp-t{ font-size:13px; font-weight:700; color:var(--ink); line-height:1.3; }
.bell-panel .bp-d{ font-size:12px; color:var(--ink-mute); line-height:1.4; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.bell-panel .bp-time{ font-size:10.5px; font-weight:600; color:var(--ink-dim); margin-top:2px; }
.bell-panel .bp-dot{ width:8px; height:8px; border-radius:50%; background:var(--cb); flex-shrink:0; margin-top:6px; }
.bell-panel .bp-empty{ padding:38px 20px; text-align:center; color:var(--ink-mute); font-size:13px; }
.bell-panel .bp-foot{ padding:10px 12px; border-top:1px solid var(--border-soft); background:var(--surface-mute); }
.bell-panel .bp-viewall{ width:100%; height:38px; border-radius:10px; background:var(--surface); border:1px solid var(--border); font-weight:700; font-size:13px; color:var(--cb); }
.bell-panel .bp-viewall:hover{ background:var(--cb-soft); }

/* ===== Notifications center ===== */
.nc-group{ font-size:10.5px; font-weight:800;  text-transform:uppercase; color:var(--ink-dim); padding:14px 20px 8px; }
.nc-row{ display:flex; gap:13px; align-items:flex-start; padding:14px 20px; border-top:1px solid var(--border-soft); cursor:pointer; position:relative; }
.nc-row:hover{ background:var(--surface-mute); }
.nc-row.unread::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--cb); }
.nc-row.unread{ background:linear-gradient(90deg,rgba(11,31,143,.04),transparent 55%); }
.nc-ic{ width:40px; height:40px; border-radius:11px; display:grid; place-items:center; flex-shrink:0; }
.nc-ic svg{ width:19px; height:19px; }
.nc-main{ flex:1; min-width:0; }
.nc-t{ font-size:14px; font-weight:700; color:var(--ink); line-height:1.35; }
.nc-new{ font-size:9px; font-weight:800;  color:#fff; background:var(--cb); border-radius:5px; padding:1px 5px; vertical-align:middle; margin-left:5px; }
.nc-d{ font-size:12.5px; color:var(--ink-mute); line-height:1.45; margin-top:2px; }
.nc-meta{ font-size:11px; color:var(--ink-dim); margin-top:5px; }
.nc-act{ display:flex; align-items:center; gap:6px; flex-shrink:0; }
.nc-row .nc-open{ height:30px; padding:0 12px; opacity:0; }
.nc-row:hover .nc-open{ opacity:1; }
.nc-x{ width:32px; height:32px; border-radius:9px; display:grid; place-items:center; color:var(--ink-dim); background:var(--surface-mute); }
.nc-x:hover{ background:var(--border); color:var(--cb); }
.nc-x svg{ width:16px; height:16px; }
.nc-empty{ padding:70px 20px; text-align:center; color:var(--ink-dim); }
.nc-empty svg{ width:38px; height:38px; margin-bottom:12px; color:var(--border); }
.nc-empty .t{ font-size:16px; font-weight:700; color:var(--ink-mute); }
.nc-empty span{ display:block; font-size:13px; margin-top:4px; }

/* ===== Admin notification rules ===== */
.nsel{ width:100%; border:1px solid var(--border); border-radius:9px; padding:7px 9px; font-size:12px; font-weight:600; color:var(--ink); background:var(--surface); outline:none; }
.nsel:focus{ border-color:var(--cb); }
.prio{ display:inline-flex; align-items:center; justify-content:center; min-width:64px; height:26px; padding:0 10px; border-radius:999px; font-size:11px; font-weight:800;  cursor:pointer; border:1px solid transparent; }
.prio-high{ background:var(--risk-soft); color:var(--risk); }
.prio-normal{ background:var(--cb-soft); color:var(--cb); }
.prio-low{ background:var(--surface-mute); color:var(--ink-mute); }
.prio:hover{ filter:brightness(.97); }
@media (max-width:1100px){ .bell-panel{ width:340px; } }


/* ===== Live push banners (OS-style) ===== */
#pushHost{ position:fixed; top:0; left:0; right:0; z-index:200; display:flex; flex-direction:column; align-items:center; gap:10px; padding:12px 12px 0; pointer-events:none; }
.push-banner{ pointer-events:auto; width:420px; max-width:calc(100vw - 24px); display:flex; gap:12px; align-items:flex-start; padding:13px 14px; border-radius:20px; cursor:pointer; position:relative;
  background:rgba(255,255,255,.82); backdrop-filter:blur(22px) saturate(1.4); -webkit-backdrop-filter:blur(22px) saturate(1.4);
  border:1px solid rgba(255,255,255,.6); box-shadow:0 12px 40px rgba(11,18,38,.24), 0 2px 6px rgba(11,18,38,.10);
  transform:translateY(-140%); opacity:0; transition:transform .34s cubic-bezier(.22,1,.36,1), opacity .34s ease; }
.push-banner.in{ transform:translateY(0); opacity:1; }
.push-banner.out{ transform:translateY(-140%); opacity:0; }
.push-banner .pb-app{ width:36px; height:36px; border-radius:10px; background:linear-gradient(135deg,#0B1F8F,#061566); color:#fff; display:grid; place-items:center; flex-shrink:0; box-shadow:0 2px 6px rgba(11,31,143,.35); }
.push-banner .pb-app svg{ width:20px; height:20px; }
.push-banner .pb-main{ flex:1; min-width:0; }
.push-banner .pb-top{ display:flex; align-items:center; gap:8px; margin-bottom:2px; }
.push-banner .pb-app-name{ font-size:10px; font-weight:800;  color:var(--ink-dim); }
.push-banner .pb-now{ margin-left:auto; font-size:10.5px; font-weight:700; color:var(--ink-dim); }
.push-banner .pb-t{ font-size:13.5px; font-weight:800; color:var(--ink); line-height:1.3;  }
.push-banner .pb-d{ font-size:12.5px; color:var(--ink-mute); line-height:1.4; margin-top:2px; }
.push-banner .pb-grip{ position:absolute; top:6px; left:50%; transform:translateX(-50%); width:34px; height:4px; border-radius:3px; background:rgba(11,18,38,.14); }

/* ===== Intrusive alert modal ===== */
.intr-scrim{ position:fixed; inset:0; z-index:210; background:rgba(6,12,32,.55); backdrop-filter:blur(4px); display:grid; place-items:center; padding:20px; opacity:0; transition:opacity .24s ease; }
.intr-scrim.in{ opacity:1; }
.intr-card{ width:400px; max-width:100%; background:var(--surface); border-radius:22px; padding:26px 24px 22px; text-align:center; box-shadow:var(--shadow-lg); transform:scale(.9); transition:transform .28s cubic-bezier(.22,1.4,.4,1); }
.intr-scrim.in .intr-card{ transform:scale(1); }
.intr-pulse{ width:74px; height:74px; border-radius:50%; display:grid; place-items:center; margin:0 auto 16px; animation:intrpulse 1.8s ease-out infinite; }
.intr-ic{ width:52px; height:52px; border-radius:50%; color:#fff; display:grid; place-items:center; }
.intr-ic svg{ width:26px; height:26px; }
@keyframes intrpulse{ 0%{ box-shadow:0 0 0 0 rgba(11,31,143,.22);} 100%{ box-shadow:0 0 0 20px rgba(11,31,143,0);} }
.intr-kicker{ font-size:10.5px; font-weight:800;  color:var(--ink-dim); }
.intr-t{ font-size:20px; font-weight:800;  margin-top:6px; }
.intr-d{ font-size:13.5px; color:var(--ink-mute); line-height:1.5; margin-top:8px; }
.intr-btns{ display:flex; flex-direction:column; gap:8px; margin-top:20px; }
.intr-btns .btn-primary,.intr-btns .btn{ width:100%; justify-content:center; height:44px; }
.intr-dismiss{ border:0 !important; background:transparent !important; color:var(--ink-dim) !important; height:36px !important; }

/* filter chip unread badge */
.fchip-badge{ margin-left:7px; min-width:17px; height:17px; padding:0 5px; border-radius:9px; background:var(--cb); color:#fff; font-size:10.5px; font-weight:800; display:inline-grid; place-items:center; }
.fchip.active .fchip-badge{ background:#fff; color:var(--ink); }


/* ===== Admin notif rules — categories & push-style ===== */
.cat-band{ display:flex; align-items:center; gap:9px; padding:8px 20px; font-size:11px; font-weight:800;  text-transform:uppercase; border-top:1px solid var(--border-soft); }
.cat-dot{ width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.atbl-r.rule-off{ opacity:.5; }
.atbl-r.rule-off .nm{ text-decoration:line-through; text-decoration-color:var(--border); }
.pstyle-seg{ display:inline-flex; gap:0; border:1px solid var(--border); border-radius:9px; overflow:hidden; height:30px; }
.pstyle-seg button{ flex:1; padding:0 10px; font-size:11.5px; font-weight:700; color:var(--ink-mute); background:var(--surface); border-right:1px solid var(--border); white-space:nowrap; }
.pstyle-seg button:last-child{ border-right:0; }
.pstyle-seg button.on{ background:var(--cb); color:#fff; }
.pstyle-seg button[disabled]{ opacity:.4; cursor:not-allowed; }
.pstyle-seg button:not(.on):not([disabled]):hover{ background:var(--cb-soft); color:var(--cb); }


/* rules table horizontal scroll — keeps push-style/priority/on reachable at any width */
.atbl-scroll{ overflow-x:auto; overflow-y:hidden; }
.atbl-scroll .atbl-min{ min-width:720px; }
.atbl-scroll .cat-band{ position:sticky; left:0; }


/* ===== Notif settings: save bar, priority & style selects ===== */
.save-bar{ display:none; align-items:center; gap:12px; background:var(--ink); color:#fff; border-radius:14px; padding:12px 16px; margin-bottom:16px; box-shadow:var(--shadow-lg); position:sticky; top:8px; z-index:40; }
.save-bar.show{ display:flex; animation:pop .18s ease; }
.save-bar .sb-dot{ width:9px; height:9px; border-radius:50%; background:#FBBF24; box-shadow:0 0 0 4px rgba(251,191,36,.25); flex-shrink:0; }
.save-bar .sb-msg{ font-size:13.5px; font-weight:700; }
.save-bar .btn{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.2); color:#fff; }
.save-bar .btn:hover{ background:rgba(255,255,255,.2); }
.save-bar .btn-primary{ background:#fff; color:var(--ink); }
.save-bar .btn-primary:hover{ background:#fff; filter:brightness(.94); }
.prio-sel{ font-weight:800 !important; }
.prio-sel.prio-high{ color:var(--risk); border-color:color-mix(in srgb, var(--risk) 40%, var(--border)); }
.prio-sel.prio-normal{ color:var(--cb); border-color:color-mix(in srgb, var(--cb) 35%, var(--border)); }
.prio-sel.prio-low{ color:var(--ink-mute); }
.psel{ font-weight:700 !important; }
.prio-legend{ font-size:12px; color:var(--ink-mute); line-height:1.6; padding:14px 20px 4px; border-top:1px solid var(--border-soft); }
.prio-legend strong{ color:var(--ink); }
.prio-tag{ display:inline-block; font-size:10.5px; font-weight:800; padding:1px 7px; border-radius:999px; }
.prio-tag.prio-high{ background:var(--risk-soft); color:var(--risk); }
.prio-tag.prio-normal{ background:var(--cb-soft); color:var(--cb); }
.prio-tag.prio-low{ background:var(--surface-mute); color:var(--ink-mute); }


/* ===== Delivery cell (priority-driven) ===== */
.stylecell{ display:flex; align-items:center; }
.deliv-chip{ display:inline-flex; align-items:center; height:26px; padding:0 11px; border-radius:8px; font-size:11.5px; font-weight:700; }
.deliv-banner{ background:var(--cb-soft); color:var(--cb); }
.deliv-quiet{ background:var(--surface-mute); color:var(--ink-mute); }
.deliv-toggle{ display:inline-flex; border:1px solid var(--border); border-radius:9px; overflow:hidden; height:30px; }
.deliv-toggle button{ padding:0 12px; font-size:11.5px; font-weight:700; color:var(--ink-mute); background:var(--surface); border-right:1px solid var(--border); }
.deliv-toggle button:last-child{ border-right:0; }
.deliv-toggle button.on{ background:var(--cb); color:#fff; }
.deliv-toggle button:not(.on):hover{ background:var(--cb-soft); color:var(--cb); }
.deliv-lock{ display:inline-flex; align-items:center; gap:6px; height:30px; padding:0 11px; border:1px dashed var(--border); border-radius:9px; font-size:11.5px; font-weight:700; color:var(--ink-dim); background:var(--surface-mute); }
.deliv-lock svg{ width:14px; height:14px; opacity:.7; }
.deliv-lock:hover{ border-color:var(--cb); color:var(--cb); }


/* ===== Mobile App control center ===== */
.rel-chip{ font-size:11.5px; font-weight:700; color:var(--cb); background:var(--cb-soft); border-radius:999px; padding:5px 12px; }
.mtabs{ display:flex; gap:4px; flex-wrap:wrap; margin-bottom:16px; border-bottom:1px solid var(--border-soft); padding-bottom:0; }
.mtab{ padding:9px 13px; font-size:12.5px; font-weight:700; color:var(--ink-mute); border-bottom:2px solid transparent; margin-bottom:-1px; white-space:nowrap; }
.mtab:hover{ color:var(--cb); }
.mtab.on{ color:var(--cb); border-bottom-color:var(--cb); }
.gate-sel{ font-weight:700 !important; }
.gate-sel.gate-none{ color:var(--ink-dim); border-color:var(--border); }
.gate-sel.gate-view{ color:#D97706; border-color:color-mix(in srgb,#D97706 35%,var(--border)); }
.gate-sel.gate-full{ color:#16a34a; border-color:color-mix(in srgb,#16a34a 35%,var(--border)); }
.role-sys,.role-custom{ font-size:9.5px; font-weight:800;  padding:2px 7px; border-radius:5px; margin-left:8px; }
.role-sys{ background:var(--surface-mute); color:var(--ink-mute); }
.role-custom{ background:var(--cb-soft); color:var(--cb); }
.perm-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px; }
.perm-pill{ display:flex; align-items:center; gap:6px; font-size:12px; font-weight:600; padding:8px 11px; border-radius:9px; background:var(--surface-mute); color:var(--ink-dim); border:1px solid var(--border-soft); }
.perm-pill svg{ width:14px; height:14px; }
.perm-pill.on{ background:var(--cb-soft); color:var(--cb); border-color:transparent; }
.perm-pill.toggleable{ cursor:pointer; }
.perm-pill.toggleable:hover{ border-color:var(--cb); }
.notif-roles{ display:flex; align-items:center; gap:7px; flex-wrap:wrap; padding:9px 16px 13px 30px; border-bottom:1px solid var(--border-soft); background:var(--surface-mute); }
.nr-lbl{ font-size:11px; font-weight:800;  color:var(--ink-dim); text-transform:uppercase; }
.rolechip{ font-size:11.5px; font-weight:700; padding:4px 10px; border-radius:999px; background:var(--surface); border:1px solid var(--border); color:var(--ink-mute); }
.rolechip.on{ background:var(--cb); color:#fff; border-color:var(--cb); }
.rolechip:not(.on):hover{ border-color:var(--cb); color:var(--cb); }
.nr-team{ font-size:11.5px; color:var(--ink-dim); margin-left:auto; }
.prov-ok,.prov-off{ font-size:11px; font-weight:800; padding:3px 9px; border-radius:999px; margin-left:8px; }
.prov-ok{ background:#DCFCE7; color:#16a34a; }
.prov-off{ background:var(--surface-mute); color:var(--ink-dim); }
.lockbox{ display:flex; gap:9px; align-items:flex-start; margin-top:12px; padding:11px 13px; border-radius:11px; background:var(--surface-mute); font-size:12px; color:var(--ink-mute); line-height:1.45; }
.lockbox svg{ width:16px; height:16px; flex-shrink:0; margin-top:1px; opacity:.7; }
.audit-act{ font-size:10.5px; font-weight:800;  padding:2px 8px; border-radius:6px; text-transform:capitalize; }
.audit-updated{ background:var(--cb-soft); color:var(--cb); }
.audit-enabled{ background:#DCFCE7; color:#16a34a; }
.audit-disabled{ background:var(--surface-mute); color:var(--ink-mute); }