:root {
  /* Brand */
  --brand-blue:      #1E4B8F;  --brand-blue-hover: #163A70;
  --brand-blue-bg:   #EEF2F9;  --brand-blue-bd:    #B8CDE8;
  --brand-green:     #8BC53F;  --brand-green-hover:#6DA030;
  --brand-green-bg:  #EEF7E1;  --brand-green-bd:   #C3E08A;
  --brand-financial: #6D28D9;  --brand-fin-bg: #F5F3FF;  --brand-fin-bd: #DDD6FE;

  /* Semantic (status) */
  --c-success: #5A9E1F; --c-success-bg: #EEF7E1; --c-success-bd: #C3E08A;
  --c-warn:    #D97706; --c-warn-bg:    #FEF3C7; --c-warn-bd:    #FCD34D;
  --c-critical:#DC2626; --c-critical-bg:#FEE2E2; --c-critical-bd:#FCA5A5;
  --c-info:    #1E4B8F; --c-info-bg:    #EEF2F9; --c-info-bd:    #B8CDE8;
  --c-neutral: #475569; --c-neutral-bg: #F8FAFC; --c-neutral-bd: #E2E8F0;

  /* Surfaces & text */
  --surface-page:   #F4F5F7;  --surface-card:  #FFFFFF;
  --surface-sunken: #F8FAFC;  --surface-hover: #F1F5F9;
  --surface-border: #E5E7EB;  --surface-border-strong: #CBD5E1;
  --text-primary: #0F172A; --text-secondary: #475569; --text-muted: #64748B;

  /* Typography */
  --t-display: 22px;
  --t-h1: 18px;
  --t-h2: 15px;
  --t-h3: 13px;
  --t-label: 11px;
  --t-body: 13px;
  --t-body-sm: 12px;
  --t-caption: 11px;
  --t-metric: 20px;
  --t-metric-sm: 16px;

  /* Spacing, radius, elevation */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px;
  --radius-sm: 6px; --radius-md: 8px; --radius-lg: 10px; --radius-xl: 14px; --radius-pill: 999px;
  --shadow-1: 0 1px 3px rgba(15,23,42,.05), 0 1px 2px rgba(15,23,42,.03);
  --shadow-2: 0 2px 6px rgba(15,23,42,.07);
  --shadow-3: 0 10px 24px rgba(15,23,42,.10);
  --focus-ring: 0 0 0 3px var(--brand-blue-bd);
}

/* ── Mobile type-scale floor (Phase 3 — design-system unification) ──
   Raises sub-14px tokens on narrow viewports so small text meets the
   14px readability floor on phones without touching desktop density. */
@media (max-width: 767px) {
  :root {
    --t-display:  18px;  /* 22 → 18: narrower headline on phones */
    --t-body:     14px;  /* 13 → 14: body text floor */
    --t-body-sm:  13px;  /* 12 → 13 */
    --t-caption:  12px;  /* 11 → 12: minimum on mobile */
    --t-label:    12px;  /* 11 → 12 */
    --t-h3:       14px;  /* 13 → 14 */
  }
}

[data-theme="dark"] {
  /* Dark mode stub */
}
