/*
 * CPMS UI foundation tokens
 *
 * Prepared by WS-019 for future UI work. This file is intentionally not
 * loaded by index.html yet: adopting it is a separate, reviewable UI change.
 * Keep the --cpms-* namespace stable so components can migrate incrementally.
 */

:root {
  /* Canvas and surfaces */
  --cpms-color-canvas: #020a11;
  --cpms-color-surface-1: #06131f;
  --cpms-color-surface-2: #0a2234;
  --cpms-color-surface-raised: #102b3d;
  --cpms-color-surface-readonly: #13202a;

  /* Text and interactive states */
  --cpms-color-text-primary: #edf7ff;
  --cpms-color-text-secondary: #b7c8d5;
  --cpms-color-text-muted: #91a9ba;
  --cpms-color-interactive: #75d8f4;
  --cpms-color-focus: #ffe298;
  --cpms-color-success: #91cb38;
  --cpms-color-warning: #f0a521;
  --cpms-color-danger: #ff7772;
  --cpms-color-border: #718b9d;

  /* Typography */
  --cpms-font-sans: "Arial Narrow", "Roboto Condensed", Inter, system-ui, sans-serif;
  --cpms-font-mono: "IBM Plex Mono", "Roboto Mono", ui-monospace, monospace;
  --cpms-font-size-xs: 0.75rem;
  --cpms-font-size-sm: 0.875rem;
  --cpms-font-size-md: 1rem;
  --cpms-font-size-lg: 1.25rem;
  --cpms-font-size-xl: 1.5rem;
  --cpms-line-height-tight: 1.2;
  --cpms-line-height-default: 1.5;
  --cpms-line-height-reading: 1.65;
  --cpms-measure-reading: 68ch;

  /* Four-pixel spacing scale */
  --cpms-space-0: 0;
  --cpms-space-1: 4px;
  --cpms-space-2: 8px;
  --cpms-space-3: 12px;
  --cpms-space-4: 16px;
  --cpms-space-6: 24px;
  --cpms-space-8: 32px;
  --cpms-space-12: 48px;
  --cpms-space-16: 64px;

  /* Shape and elevation */
  --cpms-radius-sm: 2px;
  --cpms-radius-md: 6px;
  --cpms-radius-lg: 12px;
  --cpms-border-default: 1px solid var(--cpms-color-border);
  --cpms-border-focus: 2px solid var(--cpms-color-focus);
  --cpms-shadow-raised: 0 16px 48px rgb(0 0 0 / 55%);

  /* Input targets: WCAG 2.2 AA floor and CPMS preferred target */
  --cpms-target-min: 24px;
  --cpms-target-preferred: 44px;

  /* Motion */
  --cpms-motion-duration-instant: 80ms;
  --cpms-motion-duration-fast: 160ms;
  --cpms-motion-duration-default: 240ms;
  --cpms-motion-ease-standard: cubic-bezier(0.2, 0, 0, 1);

  /* Layering */
  --cpms-z-base: 0;
  --cpms-z-sticky: 20;
  --cpms-z-overlay: 60;
  --cpms-z-toast: 80;
  --cpms-z-critical: 100;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --cpms-motion-duration-instant: 0.01ms;
    --cpms-motion-duration-fast: 0.01ms;
    --cpms-motion-duration-default: 0.01ms;
  }
}
