/* Design tokens — docs/DESIGN.md §2, §3.
 *
 * Values are copied from that table and nowhere else. Hard-coded colours in
 * component CSS are what made the previous system drift, so every rule below
 * this file uses a variable.
 *
 * The one rule that matters more than the rest: LIGHT CHROME, DARK CANVAS.
 * `--canvas-bg` deliberately sits outside the light scale, because a DWG's
 * ByLayer white lines have to be visible on it. A canvas lightened to match the
 * chrome makes an entire class of drawing disappear. */

:root {
  /* Surfaces */
  --s0: #ffffff;   /* panels, toolbar, dialogs */
  --s1: #f4f6fa;   /* app background */
  --s2: #eef1f6;   /* inset: tab track, console input */
  --s3: #e3e8ef;   /* strong hover */
  --s-hover: #f0f3f8;
  --s-press: #e6ebf3;

  /* Lines */
  --line: #e2e6ec;
  --line-strong: #cbd2dc;

  /* Text */
  --t-hi: #1f2329;
  --t-mid: #59616e;
  --t-lo: #8a93a1;

  /* Accent — exactly one. A second accent is a prohibition, not a preference. */
  --ac: #1473e6;
  --ac-hover: #0d66d0;
  --ac-press: #0a55af;
  --ac-soft: #e9f1fd;
  --ac-line: #b6d3f7;

  /* Status */
  --danger: #d7373f;
  --success: #0d8a4f;
  --warn: #b25e00;

  /* The canvas. Outside the light scale on purpose. */
  --canvas-bg: #0a0a23;

  /* Radius */
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-pill: 999px;

  /* Elevation */
  --e1: 0 1px 2px rgba(31, 35, 41, 0.06), 0 1px 3px rgba(31, 35, 41, 0.08);
  --e2: 0 4px 12px rgba(31, 35, 41, 0.10), 0 1px 3px rgba(31, 35, 41, 0.06);
  --e3: 0 12px 32px rgba(31, 35, 41, 0.16), 0 2px 8px rgba(31, 35, 41, 0.08);

  /* Type */
  --f-ui: "Segoe UI Variable Text", "Segoe UI", "Malgun Gothic", system-ui, sans-serif;
  --f-mono: "Cascadia Mono", Consolas, ui-monospace, monospace;

  /* Zones */
  --h-toolbar: 48px;
  --w-rail: 52px;
  --h-console: 96px;
  --h-status: 26px;
}

/* No transitions anywhere. A CAD viewer's chrome must answer immediately;
 * an animated panel is a panel whose state is briefly a lie. CLAUDE.md §3.5. */
* {
  transition: none !important;
  animation: none !important;
}