:root {
  /* ── Design System Tokens ── */
  --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-plus-jakarta: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-jetbrains: 'JetBrains Mono', 'Fira Mono', 'Courier New', monospace;
  --font-display: var(--font-plus-jakarta);
  --font-body: var(--font-plus-jakarta);
  --font-ui: var(--font-plus-jakarta);
  --font-data: var(--font-jetbrains);
  --font-mono: var(--font-jetbrains);

  /* Backwards-compat aliases */
  --font-dm-sans: var(--font-plus-jakarta);
  --font-sans: var(--font-body);
  --font-heading: var(--font-display);

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

  /* Shadows */
  --shadow-xs: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.07), 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.04);
  --shadow-lg: 0 10px 24px rgba(0,0,0,0.10), 0 4px 8px rgba(0,0,0,0.05);

  /* Card */
  --card-bg: #ffffff;
  --card-border: #e2e8f0;
  --card-radius: 10px;
  --card-shadow: var(--shadow-sm);

  /* Stable ds-* aliases for pages that override local vars */
  --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);
}
