:root {
  /* Brand — sampled from logo.png RGB(0,102,179). Validated against
     vnpt.vn 2026-07-02: user confirmed the site is white/blue only, no
     orange accent — do not introduce an orange token. */
  --color-primary: #0066B3;
  --color-primary-dark: #004E8A;   /* hover/active */
  --color-primary-light: #E6F0FA;  /* tint backgrounds, selected rows */
  --color-accent: #0080D6;         /* brighter blue — CTA/highlight emphasis, same hue family as primary */
  --color-accent-dark: #005FA3;

  /* Neutrals */
  --color-text: #1E293B;
  --color-text-secondary: #475569;
  --color-text-muted: #64748B;
  --color-border: #CBD5E1;
  --color-divider: #E2E8F0;
  --color-surface: #F8FAFC;
  --color-bg: #FFFFFF;

  /* Semantic (status) — never used alone, always paired with icon+text */
  --color-success: #16A34A;
  --color-success-bg: #F0FDF4;
  --color-danger: #DC2626;
  --color-danger-bg: #FEF2F2;
  --color-warning: #D97706;
  --color-warning-bg: #FFFBEB;
  --color-info: #0284C7;

  /* Typography — system font stack only, no network fonts */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 2rem;
  --line-height-base: 1.5;

  /* Spacing (4/8pt scale) */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --radius: 8px;
  --radius-sm: 4px;
}