/**
 * VelocityVerify 1.5 — Design Tokens & Core Foundation (Phase 1)
 * Governing Direction: "Old design, professionally refined — not visually replaced."
 * Color tokens selected to support WCAG 2.2 AA design targets. Final conformance depends on component usage and production validation.
 */

:root {
  /* Surface Elevation Hierarchy */
  --canvas: #0a0a0b;
  --surface-1: #141418;
  --surface-2: #18181e;

  /* Borders & Dividers */
  --border: rgba(255, 255, 255, 0.08);
  --border-hover: rgba(255, 255, 255, 0.18);
  --border-active: #ff003c;

  /* Signature Brand Accent (Restrained Crimson) */
  --accent: #ff003c;
  --accent-hover: #e60036; /* 4.16:1 on canvas (#0a0a0b) — supports WCAG 2.2 AA 3:1 non-text/UI elements only (buttons, borders, surfaces). Not intended for normal-size text without container backgrounds. */
  --accent-dim: rgba(255, 0, 60, 0.12);
  --accent-glow: 0 0 24px rgba(255, 0, 60, 0.28);

  /* Typography & Text Contrast */
  --text-primary: #ffffff;         /* 19.79:1 on canvas */
  --text-secondary: #a0a0a8;       /* 7.62:1 on canvas */
  --text-muted: #787882;           /* 4.53:1 on canvas — supporting metadata/labels */

  /* Semantic Status Indicators (Paired with Text) */
  --status-emerald: #10b981;
  --status-emerald-bg: rgba(16, 185, 129, 0.12);
  --warning-amber: #ffaa00;
  --warning-amber-bg: rgba(255, 170, 0, 0.12);
  --error-red: #ef4444;
  --error-red-bg: rgba(239, 68, 68, 0.12);

  /* Typography Standards */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  --text-body: 1rem;               /* 16px standard body copy */
  --text-functional: 0.875rem;     /* 14px minimum functional label */
  --text-metadata: 0.8125rem;      /* 13px supporting metadata */
  --line-height-body: 1.6;

  /* Touch Target Standard (WCAG 2.2 AA) */
  --min-touch-target: 44px;

  /* Theme System Tokens — Dark Mode Baseline */
  --bg: #000000;
  --raised: #0b0b0d;
  --surface: #141416;
  --selected: #2c2c2e;
  --text: #f5f5f7;
  --secondary: #a1a1aa;
  --muted: #7a7a82;
  --line: rgba(255, 255, 255, 0.12);
  --strong: rgba(255, 255, 255, 0.2);
  --red: #ff003c;
  --red2: #ff375f;
  --red3: #d90033;
  --green: #30d158;
  --amber: #ff9f0a;
  --error: #ff453a;
  --max: 1180px;
  --ease: cubic-bezier(.2, .8, .2, 1);
}

/* Theme System Tokens — Light Mode Overrides */
html[data-theme="light"] {
  --bg: #f5f5f7;
  --raised: #ffffff;
  --surface: #f1f1f4;
  --selected: #e5e5ea;
  --text: #1d1d1f;
  --secondary: #525257;
  --muted: #68686d;
  --line: rgba(0, 0, 0, 0.11);
  --strong: rgba(0, 0, 0, 0.2);
}

/* Global Box Sizing Foundation */
*, *::before, *::after {
  box-sizing: border-box;
}