/**
 * Drup-AID design tokens. Single source for color/type/spacing.
 * Never hardcode hex in component CSS — reference these.
 */
:root {
  /* Brand */
  --da-blue: #0678be;
  --da-dark: #081826;
  --da-accent: #00d4ff;
  --da-white: #ffffff;

  /* Derived */
  --da-blue-600: #0a66a6;
  --da-dark-2: #0c2238;
  --da-ink: #0b1622;
  --da-muted: #5b6b7a;
  --da-surface: #f4f8fb;
  --da-border: #e2e8f0;
  --da-code-bg: #0e2233;
  --da-on-dark-muted: #9fb6c9;

  /* Typography */
  --da-font-heading: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --da-font-body: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --da-font-mono: ui-monospace, 'SFMono-Regular', 'Cascadia Code', 'Menlo', monospace;

  /* Spacing scale */
  --da-1: 4px;
  --da-2: 8px;
  --da-3: 16px;
  --da-4: 24px;
  --da-5: 32px;
  --da-6: 48px;
  --da-7: 64px;
  --da-8: 96px;

  /* Radius / layout */
  --da-radius: 12px;
  --da-radius-sm: 8px;
  --da-pill: 999px;
  --da-container: 1200px;
}