/* Design tokens — workbench / lab instrumentation palette */

:root,
[data-theme="dark"] {
  color-scheme: dark;

  --bg: #0b0a09;
  --surface: #141210;
  --surface-2: #1c1916;
  --ink: #ede7dc;
  --ink-muted: #b0a89e;
  --line: #2a2622;
  --accent: #e2703a;
  --accent-dim: #8a4423;
  --cool: #7fa8c9;
  --ok: #6fbf95;
  --warn: #d9a441;
}

[data-theme="light"] {
  color-scheme: light;

  --bg: #f7f3ec;
  --surface: #ffffff;
  --surface-2: #f0ebe3;
  --ink: #16130f;
  --ink-muted: #5a544c;
  --line: #ddd6c9;
  --accent: #b8501f;
  --accent-dim: #8a4423;
  --cool: #4a7a9b;
  --ok: #3d8a62;
  --warn: #a87a20;
}

:root {
  /* Type — fluid scale via clamp */
  --step--1: clamp(0.8rem, 0.74rem + 0.25vw, 0.9rem);
  --step-0: clamp(1rem, 0.94rem + 0.28vw, 1.125rem);
  --step-1: clamp(1.2rem, 1.08rem + 0.55vw, 1.4rem);
  --step-2: clamp(1.44rem, 1.24rem + 0.9vw, 1.75rem);
  --step-3: clamp(1.73rem, 1.4rem + 1.4vw, 2.2rem);
  --step-4: clamp(2.07rem, 1.55rem + 2.2vw, 2.75rem);
  --step-5: clamp(2.49rem, 1.7rem + 3.3vw, 3.5rem);

  /* Spacing — 4px base */
  --space-1: 0.25rem;   /* 4 */
  --space-2: 0.5rem;    /* 8 */
  --space-3: 0.75rem;   /* 12 */
  --space-4: 1rem;      /* 16 */
  --space-5: 1.25rem;   /* 20 */
  --space-6: 1.5rem;    /* 24 */
  --space-7: 2rem;      /* 32 */
  --space-8: 2.5rem;    /* 40 */
  --space-9: 3rem;      /* 48 */
  --space-10: 4rem;     /* 64 */
  --space-11: 5rem;     /* 80 */
  --space-12: 6rem;     /* 96 */

  /* Radii */
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 8px;

  /* Shadows */
  --shadow-sm: 0 1px 2px color-mix(in srgb, #000 35%, transparent);
  --shadow-md: 0 4px 16px color-mix(in srgb, #000 40%, transparent);
  --shadow-lg: 0 12px 40px color-mix(in srgb, #000 50%, transparent);

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);

  /* Fonts */
  --font-display: "Space Grotesk", system-ui, sans-serif;
  --font-body: "Inter", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  /* Layout */
  --container-max: 1100px;
  --gutter: clamp(1.25rem, 4vw, 2.5rem);
  --header-h: 3.5rem;
}