/* Simtix color tokens — primitive → semantic. All pairs pass WCAG AA. */
:root {
  /* Primitives */
  --night-950: #060B18;
  --night-900: #0B1530;
  --night-800: #111D3E;
  --steel-600: #4A5B7C;
  --steel-300: #9FB0CC;
  --mist-100: #E9EEF6;
  --white: #FFFFFF;
  --signal-500: #2E6BFF; /* primary brand blue — CTAs, links, active states */
  --signal-400: #5C8DFF; /* hover / links on dark surfaces */
  --pulse-400: #29D3A4;  /* accent — success, live indicators, stat highlights; sparingly */
  --amber-400: #FFB547;  /* warning */
  --red-500: #E5484D;    /* error */
  --logo-silver: #C4C4C4;

  /* Semantic — light theme (default) */
  --bg: var(--white);
  --surface: var(--mist-100);
  --border: #D4DCE9;
  --text: var(--night-900);
  --text-muted: var(--steel-600);
  --link: var(--signal-500);
  --link-hover: #1F55D6;

  /* Focus ring — both themes */
  --focus-ring: 0 0 0 2px var(--bg), 0 0 0 4px var(--signal-400);
}

/* Semantic — dark theme scope */
[data-theme="dark"] {
  --bg: var(--night-950);
  --surface: var(--night-900);
  --border: var(--night-800);
  --text: var(--mist-100);
  --text-muted: var(--steel-300);
  --link: var(--signal-400);
  --link-hover: #85AAFF;
}