/* DataLookout dashboard -- design tokens. Loaded first; every other stylesheet reads these. */
/* === Design tokens: DESIGN.md §9. The block between the markers is byte-identical to
   site/assets/design.css; scripts/check_copy_claims.py enforces it. === */
/* @dl-tokens:begin */
:root {
  --dl-font-sans: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --dl-font-mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', 'Cascadia Code', Consolas, monospace;
  --dl-font-serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --dl-slate-50: #f3f1ea; --dl-slate-100: #efede6; --dl-slate-200: #e4e1d7; --dl-slate-300: #cdc9bc;
  --dl-slate-400: #a09c8f; --dl-slate-500: #6a675c; --dl-slate-600: #55534a; --dl-slate-700: #44423a;
  --dl-slate-800: #2c2b26; --dl-slate-900: #1e1d19;
  --dl-canvas: #f7f6f1; --dl-panel: #fdfcf9; --dl-panel-2: #efede6;
  --dl-rule: #e4e1d7; --dl-rule-strong: #cdc9bc;
  --dl-ink-1: #1e1d19; --dl-ink-2: #44423a; --dl-ink-3: #6a675c; --dl-ink-mute: #a09c8f;
  --dl-brand-mark: #22c55e; --dl-brand-deep: #166534; --dl-brand-tint: #dcfce7;
  --dl-action: #0f6e4d; --dl-action-hover: #0a5237; --dl-action-ink: #0a5237; --dl-action-tint: #e6f2ea; --dl-on-action: #ffffff;
  --dl-link: #0f6e4d; --dl-link-hover: #0a5237; --dl-link-tint: #e6f2ea;
  --dl-navy: #1e1d19; --dl-navy-2: #2c2b26; --dl-on-navy: #ffffff; --dl-on-navy-mute: #a09c8f;
  --dl-critical: #dc2626; --dl-critical-ink: #b91c1c; --dl-critical-tint: #fbeeea;
  --dl-notable: #b45309; --dl-notable-ink: #92400e; --dl-notable-tint: #fbf3e0;
  --dl-minor: #6a675c; --dl-minor-ink: #55534a; --dl-minor-tint: #efede6;
  --dl-momentum-4: #0f6e4d; --dl-momentum-3: #3f8f6c; --dl-momentum-2: #8fbfa6; --dl-momentum-1: #d2e5d9;
  --dl-fs-xs: 0.75rem; --dl-fs-sm: 0.8125rem; --dl-fs-base: 0.875rem; --dl-fs-md: 1rem;
  --dl-fs-lg: 1.125rem; --dl-fs-xl: 1.375rem; --dl-fs-xxl: 1.75rem; --dl-fs-title: 1.875rem;
  --dl-radius-sm: 4px; --dl-radius: 6px; --dl-radius-lg: 8px; --dl-radius-xl: 12px;
  --dl-shadow-sm: 0 1px 2px rgba(30,29,25,.05);
  --dl-shadow: 0 1px 3px rgba(30,29,25,.08), 0 1px 2px rgba(30,29,25,.04);
  --dl-shadow-md: 0 4px 12px rgba(30,29,25,.08), 0 2px 4px rgba(30,29,25,.04);
  --dl-motion-fast: 150ms; --dl-motion: 200ms; --dl-motion-slow: 250ms;
  --dl-transition: 150ms ease;
  --dl-focus-ring: 0 0 0 2px #fdfcf9, 0 0 0 4px #0f6e4d;
}
/* @dl-tokens:end */

/* Legacy aliases — every name below points at a canonical token above.
   Do not add values here; add a token to DESIGN.md §9 and both blocks. Removed as Phase 3/4 restyle lands. */
:root {
  --dl-green: var(--dl-action);
  --dl-green-dark: var(--dl-action-hover);
  --dl-green-light: var(--dl-action-tint);
  --dl-green-50: var(--dl-action-tint);
  --dl-green-100: var(--dl-brand-tint);
  --dl-green-200: #bbf7d0;
  --dl-green-500: var(--dl-brand-mark);
  --dl-green-600: var(--dl-action);
  --dl-green-700: var(--dl-action-hover);
  --dl-green-800: var(--dl-brand-deep);
  --dl-blue: var(--dl-link);
  --dl-blue-hover: var(--dl-link-hover);
  --dl-blue-dark: var(--dl-link-hover);
  --dl-blue-50: var(--dl-link-tint);
  --dl-blue-100: #dbeafe;
  --dl-navy-light: var(--dl-navy-2);
  --dl-gray-50: var(--dl-slate-50);
  --dl-gray-100: var(--dl-slate-100);
  --dl-gray-200: var(--dl-slate-200);
  --dl-gray-300: var(--dl-slate-300);
  --dl-gray-400: var(--dl-slate-400);
  --dl-gray-500: var(--dl-slate-500);
  --dl-gray-600: var(--dl-slate-600);
  --dl-gray-700: var(--dl-slate-700);
  --dl-gray-800: var(--dl-slate-800);
  --dl-gray-900: var(--dl-slate-900);
  --dl-slate: var(--dl-slate-600);
  --dl-light: var(--dl-canvas);
  --dl-border: var(--dl-rule);
  --dl-border-strong: var(--dl-rule-strong);
  --dl-surface: var(--dl-panel);
  --dl-text: var(--dl-ink-1);
  --dl-text-secondary: var(--dl-ink-3);
  --dl-text-muted: var(--dl-ink-3);
  --dl-shadow-lg: 0 8px 24px rgba(27,27,25,.1), 0 2px 8px rgba(27,27,25,.04);
}