/* ============================================================
   KW Catalyst Partners — Marketing Ops Dashboard
   DESIGN TOKENS  (single source of truth)

   OFFICIAL KWCP BRAND — locked from brand palette:
     charcoal  #141414   champagne #b8956a   red #B5121B
     cream     #f7f3ec   line rgba(20,20,20,.12)   muted #6b6b6b

   Brand hierarchy:
     • KW red (--brand)      = primary actions, alerts, the one hot accent
     • Champagne (--champagne) = refined secondary — gold accents on charcoal,
                                 nav active marker, brand mark, decorative
     • Charcoal / cream      = the calm, premium foundation

   To re-skin everything, edit ONLY this file — every screen reads these vars.
   ============================================================ */
:root {
  /* ---- neutral surfaces (warm, cream-led brand canvas) ---- */
  --bg:            #f7f3ec;            /* cream — official brand canvas */
  --surface:       #ffffff;            /* cards pop on cream */
  --surface-2:     #fbf8f2;            /* hover / subtle fill */
  --surface-3:     #f0e9dd;            /* tracks, wells, deeper warm */
  --fg:            #141414;            /* charcoal — official */
  --muted:         #6b6b6b;            /* official muted */
  --faint:         #9a9389;            /* warm low-emphasis */
  --border:        rgba(20,20,20,0.12);/* official hairline */
  --border-strong: rgba(20,20,20,0.22);

  /* ---- KW red (primary brand accent — use sparingly) ---- */
  --brand:       #B5121B;              /* official KW red */
  --brand-ink:   #8d0d14;             /* hover / active */
  --brand-tint:  color-mix(in oklch, var(--brand) 9%, white);
  --on-brand:    #ffffff;

  /* ---- Champagne (refined secondary accent) ---- */
  --champagne:     #b8956a;            /* official champagne gold */
  --champagne-ink: #9c7b50;           /* deeper gold */
  --champagne-tint: color-mix(in oklch, var(--champagne) 16%, white);
  --on-champagne:  #141414;           /* charcoal reads on gold */

  /* ---- pipeline status (kept distinct, warmed to sit on cream) ---- */
  --st-scheduled: oklch(56% 0.13 250);   /* blue */
  --st-process:   oklch(70% 0.155 72);   /* amber (distinct from champagne) */
  --st-executed:  oklch(55% 0.13 152);   /* green */
  --st-draft:     #8c867c;

  /* ---- channels ---- */
  --ch-social:   oklch(52% 0.15 285);    /* indigo/plum */
  --ch-email:    oklch(55% 0.10 220);    /* slate-teal */
  --ch-text:     oklch(62% 0.16 40);     /* terracotta (harmonizes w/ brand) */

  /* ---- social platforms (recognizable, tuned to sit on cream) ---- */
  --pf-facebook:  oklch(54% 0.17 258);   /* FB blue */
  --pf-instagram: oklch(58% 0.20 5);     /* IG magenta */
  --pf-linkedin:  oklch(50% 0.12 245);   /* LinkedIn blue */
  --pf-youtube:   oklch(56% 0.21 25);    /* YouTube red */
  --pf-tiktok:    oklch(34% 0.03 250);   /* TikTok near-black */

  /* ---- audience segments ----
     type/lifecycle = distinct hues; production bands = champagne→brand ramp */
  --seg-kwcp:   var(--champagne);        /* current agents — brand gold */
  --seg-unlic:  oklch(58% 0.13 230);     /* prospect blue */
  --seg-newlic: oklch(56% 0.14 175);     /* teal-green */
  --seg-p0:     oklch(80% 0.05 80);      /* palest — <$1M entry tier */
  --seg-p1:     oklch(72% 0.085 75);     /* light gold */
  --seg-p2:     oklch(64% 0.105 62);     /* gold */
  --seg-p3:     oklch(56% 0.135 45);     /* amber-bronze */
  --seg-p4:     oklch(48% 0.16 32);      /* deep bronze-red (top tier) */

  /* ---- production status (retention signal) ---- */
  --ps-active:  oklch(55% 0.13 152);     /* green */
  --ps-slowing: oklch(70% 0.155 72);     /* amber */
  --ps-dormant: oklch(58% 0.03 60);      /* grey-warm */
  --ps-capping: var(--brand);            /* KW red — retention critical */

  /* ---- deltas ---- */
  --pos:         oklch(52% 0.13 152);
  --neg:         var(--brand);

  /* ---- dark nav rail (true brand charcoal, faint warm cast) ---- */
  --nav-bg:      #141414;             /* charcoal — official */
  --nav-bg-2:    #232220;            /* hover / active row */
  --nav-fg:      #f7f3ec;            /* cream text */
  --nav-muted:   #9a948a;
  --nav-border:  rgba(255,255,255,0.09);

  /* ---- radii ---- */
  --r-sm: 7px;
  --r-md: 11px;
  --r-lg: 16px;
  --r-pill: 999px;

  /* ---- elevation (restrained, warm shadow) ---- */
  --sh-1: 0 1px 2px rgba(20,20,20,0.05), 0 1px 1px rgba(20,20,20,0.04);
  --sh-2: 0 4px 16px rgba(20,20,20,0.08), 0 1px 3px rgba(20,20,20,0.06);
  --sh-pop: 0 12px 40px rgba(20,20,20,0.18);

  /* ---- type ---- */
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;
  --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", system-ui, sans-serif;
  --font-mono: "SF Mono", ui-monospace, "JetBrains Mono", Menlo, monospace;

  /* ---- spacing rhythm ---- */
  --gap: 18px;
  --pad: 20px;
}

/* <$1M production band — entry tier below $1-5M; derived so it harmonizes with the existing scale */
:root { --seg-p0: color-mix(in oklch, var(--seg-p1) 48