:root {
  --ds-color-background: #fafafa;
  --ds-color-foreground: #0f172a;
  --ds-color-muted: #f1f5f9;
  --ds-color-muted-foreground: #64748b;
  --ds-color-border: #e2e8f0;
  --ds-color-card: #ffffff;
  --ds-color-accent: #0052ff;
  --ds-color-accent-secondary: #4d7cff;
  --ds-color-accent-foreground: #ffffff;
  --ds-color-ring: #0052ff;

  --ds-gradient-accent: linear-gradient(135deg, var(--ds-color-accent), var(--ds-color-accent-secondary));
  --ds-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06);
  --ds-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07);
  --ds-shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.08);
  --ds-shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.1);
  --ds-shadow-accent: 0 4px 14px rgba(0, 82, 255, 0.25);
  --ds-shadow-accent-lg: 0 8px 24px rgba(0, 82, 255, 0.35);

  --ds-radius-sm: 8px;
  --ds-radius-md: 12px;
  --ds-radius-lg: 16px;
  --ds-radius-xl: 20px;

  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 12px;
  --ds-space-4: 16px;
  --ds-space-5: 20px;
  --ds-space-6: 24px;
  --ds-space-8: 32px;

  --ds-ease-standard: cubic-bezier(0.16, 1, 0.3, 1);
  --ds-duration-fast: 160ms;
  --ds-duration-medium: 220ms;
  --ds-duration-slow: 320ms;

  /* Legacy shared tokens kept during staged migration away from app.css. */
  --ink: #141319;
  --muted: #5b5f6a;
  --brand: #1d4ed8;
  --brand-dark: #1e3a8a;
  --accent: #f97316;
  --accent-soft: #fdba74;
  --mint: #0ea5a4;
  --surface: #f7f4ff;
  --panel: #ffffff;
  --line: #e3e5f0;
  --shadow: 0 18px 40px rgba(28, 25, 36, 0.12);
  --shadow-soft: 0 10px 22px rgba(28, 25, 36, 0.08);
  --glow: 0 0 0 1px rgba(99, 102, 241, 0.06), 0 18px 30px rgba(99, 102, 241, 0.14);
  --font-display: "Optima", "Palatino Linotype", serif;
  --font-body: "Candara", "Segoe UI", "Trebuchet MS", sans-serif;
  --scrollbar-width: 0px;
}

body.admin-template {
  --ds-font-display: "Inter", "Segoe UI", system-ui, sans-serif;
  --ds-font-body: "Inter", "Segoe UI", system-ui, sans-serif;
  --ds-font-mono: "JetBrains Mono", ui-monospace, "Cascadia Code", "Fira Code", monospace;
}