:root {
  /* ─── Brand Palette ──────────────────────────────────────── */
  --brand-1: #37123C;   /* Deep purple — sidebar, primary dark bg */
  --brand-2: #945D5E;   /* Muted mauve — hover/active, highlights */
  --brand-3: #A99F96;   /* Taupe — borders, secondary/muted elements */
  --brand-4: #DDA77B;   /* Warm gold — accent, links on dark bg */
  --brand-5: #DDD8E8;   /* Light mauve — page background */
  --brand-6: #2E8F8A;   /* Teal — network/data visual accents */

  /* ─── Text Colors ────────────────────────────────────────── */
  --text-primary:   #1e293b;  /* Headings, body text */
  --text-secondary: #475569;  /* Descriptions, labels */
  --text-muted:     #94a3b8;  /* Captions, metadata, placeholders */

  /* ─── Surface Colors ─────────────────────────────────────── */
  --surface-card:    #ffffff;  /* Card backgrounds */
  --surface-content: #f8fafc;  /* Secondary surface areas */

  /* ─── Border ─────────────────────────────────────────────── */
  --border-color: #e2e8f0;  /* All borders and dividers */

  /* ─── Action / Indigo (interactive elements) ─────────────── */
  --action-color:  #6366f1;  /* Primary buttons, links */
  --action-hover:  #eef2ff;  /* Button hover backgrounds */
  --action-light:  #e0e7ff;  /* Lighter interactive backgrounds */
  --action-border: #a5b4fc;  /* Interactive element borders */
  --action-ring:   #6366f1;  /* Focus rings */

  /* ─── Semantic — Success ─────────────────────────────────── */
  --success-bg:     #ecfdf5;
  --success-text:   #065f46;
  --success-border: #a7f3d0;

  /* ─── Semantic — Warning ─────────────────────────────────── */
  --warning-bg:     #fffbeb;
  --warning-text:   #92400e;
  --warning-border: #fde68a;

  /* ─── Semantic — Error ───────────────────────────────────── */
  --error-bg:     #fef2f2;
  --error-text:   #991b1b;
  --error-border: #fecaca;

  /* ─── Semantic — Info ────────────────────────────────────── */
  --info-bg:     #eff6ff;
  --info-text:   #1e40af;
  --info-border: #bfdbfe;
}