:root {
  /* ── New Design System (Clean Light Theme) ── */
  --bg-base: #000e28;
  --bg-surface: #00172f;
  --bg-active: #0ea5e9;
  --bg-icon-badge: #0284c7;
  --text-primary: #ffffff;
  --text-secondary: #8ea6c0;
  --text-muted: #617694;
  --accent-blue: #0ea5e9;
  --border: #e2e8f0;

  /* Typography */
  --font-dm-sans: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-display: var(--font-dm-sans);
  --font-body: var(--font-dm-sans);
  --font-ui: var(--font-dm-sans);
  --font-data: var(--font-dm-sans);
  --font-mono: var(--font-dm-sans);

  /* Font sizes */
  --text-xs: 11px;
  --text-sm: 12px;
  --text-base: 14px;
  --text-md: 15px;
  --text-lg: 18px;
  --text-xl: 22px;
  --text-2xl: 28px;

  /* Compatibility aliases for existing pages */
  --font-sans: var(--font-body);
  --font-heading: var(--font-display);

  /* Stable aliases for pages that have local --border, --text-* overrides */
  --ds-bg-base: var(--bg-base);
  --ds-bg-surface: var(--bg-surface);
  --ds-bg-active: var(--bg-active);
  --ds-bg-icon-badge: var(--bg-icon-badge);
  --ds-text-primary: var(--text-primary);
  --ds-text-secondary: var(--text-secondary);
  --ds-text-muted: var(--text-muted);
  --ds-accent-blue: var(--accent-blue);
  --ds-border: var(--border);
}

html {
  font-size: 16px;
}

body {
  font-family: var(--font-body);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
}

code, pre, .mono {
  font-family: var(--font-mono);
}