/**
 * CoreX Design Tokens — Glacier / Frozen Light
 * Aligned with DESIGN.md
 */
:root {
  /* Brand colors */
  --color-primary: #7dd3fc;
  --color-primary-rgb: 125, 211, 252;
  --color-tertiary: #c8a0f0;
  --color-tertiary-rgb: 200, 160, 240;
  --color-accent-cyan: #5eead4;
  --color-accent-cyan-rgb: 94, 234, 212;

  /* Surfaces */
  --color-background: #0a0e1a;
  --color-surface: #0f1524;
  --color-surface-elevated: rgba(15, 21, 36, 0.75);
  --color-glass: rgba(15, 21, 36, 0.6);
  --color-glass-elevated: rgba(15, 21, 36, 0.75);

  /* Text — WCAG AA on dark bg (≥4.5:1 for body) */
  --color-on-surface: #e8eef8;
  --color-on-surface-variant: #b8c4d8;
  --color-on-surface-muted: #9aabc4;
  --color-on-primary: #0a0e1a;

  /* Borders */
  --border-subtle: rgba(255, 255, 255, 0.1);
  --border-primary: rgba(125, 211, 252, 0.1);
  --border-primary-strong: rgba(125, 211, 252, 0.3);

  /* Glass */
  --blur-glass: 16px;
  --blur-elevated: 24px;
  --glow-primary: 0 0 30px rgba(125, 211, 252, 0.05);
  --glow-primary-strong: 0 0 30px rgba(125, 211, 252, 0.25);

  /* Typography */
  --font-sans: "Inter", system-ui, sans-serif;
  --font-display: "Syne", "Inter", sans-serif;
  --font-mono: "Space Grotesk", "Inter", monospace;

  /* Spacing */
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --focus-ring: 0 0 0 2px var(--color-background), 0 0 0 4px var(--color-primary);

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --duration-fast: 150ms;
  --duration-base: 250ms;
  --duration-slow: 400ms;
}

/* Legacy aliases used by existing Tailwind config / HTML */
:root {
  --neon-pink: var(--color-primary);
  --neon-cyan: var(--color-accent-cyan);
  --deep-black: var(--color-background);
  --surface-dark: var(--color-surface);
  --glass-bg: var(--color-glass);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 0ms;
    --duration-base: 0ms;
    --duration-slow: 0ms;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .ai-flicker {
    animation: none !important;
    opacity: 1 !important;
  }
}