:root {
  /* Brand & Core Colors */
  --color-primary: #0F4C81;
  --color-primary-hover: #0A365C;
  --color-primary-light: #EBF3FA;
  --color-primary-subtle: #F0F7FF;
  --color-secondary: #0F172A;
  --color-secondary-light: #1E293B;
  --color-accent: #0D9488;
  --color-accent-hover: #0F766E;
  --color-accent-light: #CCFBF1;
  --color-gold: #D97706;
  --color-gold-light: #FEF3C7;

  /* Surface, Text & Border */
  --bg-body: #F8FAFC;
  --bg-surface: #FFFFFF;
  --bg-subtle: #F1F5F9;
  --bg-muted: #E2E8F0;
  --text-primary: #0F172A;
  --text-secondary: #334155;
  --text-muted: #64748B;
  --text-light: #94A3B8;
  --border-color: #E2E8F0;
  --border-strong: #CBD5E1;
  --focus-ring: 0 0 0 3px rgba(15, 76, 129, 0.22);

  /* Status & Semantic Tokens */
  --status-success-fg: #15803D;
  --status-success-bg: #DCFCE7;
  --status-success-border: #86EFAC;

  --status-warning-fg: #B45309;
  --status-warning-bg: #FEF3C7;
  --status-warning-border: #FCD34D;

  --status-danger-fg: #B91C1C;
  --status-danger-bg: #FEE2E2;
  --status-danger-border: #FCA5A5;

  --status-info-fg: #1D4ED8;
  --status-info-bg: #DBEAFE;
  --status-info-border: #93C5FD;

  --status-neutral-fg: #475569;
  --status-neutral-bg: #F1F5F9;
  --status-neutral-border: #CBD5E1;

  /* Typography */
  --font-sans: 'Be Vietnam Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', 'Courier New', monospace;

  --text-display: 2.35rem;
  --text-h1: 1.75rem;
  --text-h2: 1.35rem;
  --text-h3: 1.125rem;
  --text-h4: 1rem;
  --text-base: 0.9375rem;
  --text-sm: 0.84375rem;
  --text-xs: 0.75rem;

  /* Spacing Scale (8px base rhythm) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* Border Radius */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 18px;
  --radius-pill: 9999px;

  /* Shadows */
  --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.05);
  --shadow-sm: 0 2px 8px -2px rgba(15, 23, 42, 0.08), 0 1px 3px -1px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 10px 20px -5px rgba(15, 23, 42, 0.12), 0 4px 6px -2px rgba(15, 23, 42, 0.05);
  --shadow-lg: 0 20px 30px -10px rgba(15, 23, 42, 0.2);

  /* Layout Dimensions */
  --sidebar-width: 268px;
  --header-height: 66px;
  --topbar-height: 38px;
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 220ms cubic-bezier(0.4, 0, 0.2, 1);
}