/* GENERATED FILE -- DO NOT EDIT.

   Source: web/src/design-system/tokens/semantic.tokens.json, theme/light.tokens.json, theme/dark.tokens.json (via design-system.resolver.json)
   Generator: web/tokens.py, run by web/build.py.

   An edit here is lost on the next build, and `tests/workspace/web/test_tokens.py` fails
   when this file and its source disagree -- which is the point: the source is
   the source, and a hand-edit that survived would make that untrue quietly. */


:root,
[data-theme] {
  --surface-page: var(--color-white);
  --surface-raised: var(--color-white);
  --surface-sunk: var(--color-gray-50);
  --surface-nav: var(--color-gray-50);
  --surface-hover: var(--color-gray-100);
  --surface-selected: var(--color-gray-150);
  --surface-hero: var(--color-gray-50);
  --surface-scrim: var(--color-scrim-light);
  --text-primary: var(--color-gray-950);
  --text-secondary: var(--color-gray-750);
  --text-muted: var(--color-gray-600);
  --text-faint: var(--color-gray-600);
  --text-inverse: var(--color-white);
  --border-subtle: var(--color-gray-200);
  --border-strong: var(--color-gray-300);
  --border-emphasis: var(--color-gray-450);
  --accent-base: var(--color-gray-950);
  --accent-hover: var(--color-gray-750);
  --accent-wash: var(--color-gray-100);
  --caution-base: var(--color-amber-700);
  --caution-wash: var(--color-amber-wash);
  --action-destructive: var(--color-red-800);
  --action-destructive-hover: var(--color-red-900);
  --action-destructive-text: var(--color-white);
  --state-source: var(--color-green-700);
  --state-derived: var(--color-violet-600);
  --state-issue: var(--color-amber-700);
  --state-conflict: var(--color-red-700);
  --term-value: var(--color-gray-150);
  --elevation-raised: var(--shadow-200);
  --elevation-overlay: var(--shadow-300);
  --elevation-subtle: var(--shadow-100);
  --focus-ring: var(--color-gray-950);
  --motion-reveal: var(--duration-200);
  --motion-replace: var(--duration-300);
  --motion-settle: var(--duration-200);
  --motion-easing-arrive: var(--ease-out);
  --motion-easing-exchange: var(--ease-in-out);
  --motion-working: var(--duration-1000);
  --motion-easing-steady: var(--ease-linear);
  --motion-easing-settle: var(--ease-spring);
  --control-min-height: var(--target-control);
  --type-body: var(--font-sans);
  --type-code: var(--font-mono);
  --type-reading: var(--font-serif);
  --type-caption: var(--size-100);
  --type-small: var(--size-200);
  --type-normal: var(--size-300);
  --type-title: var(--size-500);
  --type-display: var(--size-700);
  --type-hero: var(--size-900);
  --type-label: var(--size-050);
  --type-meta: var(--size-100);
  --type-mono: var(--size-150);
  --type-ui: var(--size-200);
  --type-text: var(--size-250);
  --type-section: var(--size-400);
  --type-object: var(--size-500);
  --type-page: var(--size-800);
  --type-tracking-hero: var(--tracking-tight-300);
  --type-tracking-brand: var(--tracking-tight-200);
  --type-tracking-title: var(--tracking-tight-100);
  --type-tracking-meta: var(--tracking-wide-100);
  --type-tracking-label: var(--tracking-wide-200);
}

:root[data-theme="dark"],
[data-theme="dark"] {
  --surface-page: var(--color-gray-950);
  --surface-raised: var(--color-gray-900);
  --surface-sunk: var(--color-gray-925);
  --surface-nav: var(--color-gray-975);
  --surface-hover: var(--color-gray-850);
  --surface-selected: var(--color-gray-800);
  --surface-hero: var(--color-gray-925);
  --surface-scrim: var(--color-scrim-dark);
  --text-primary: var(--color-gray-25);
  --text-secondary: var(--color-gray-250);
  --text-muted: var(--color-gray-400);
  --text-faint: var(--color-gray-400);
  --text-inverse: var(--color-gray-950);
  --border-subtle: var(--color-gray-825);
  --border-strong: var(--color-gray-700);
  --border-emphasis: var(--color-gray-500);
  --accent-base: var(--color-gray-25);
  --accent-hover: var(--color-gray-250);
  --accent-wash: var(--color-gray-850);
  --caution-base: var(--color-amber-300);
  --caution-wash: var(--color-amber-deep);
  --action-destructive: var(--color-red-400);
  --action-destructive-hover: var(--color-red-350);
  --action-destructive-text: var(--color-gray-950);
  --state-source: var(--color-green-300);
  --state-derived: var(--color-violet-300);
  --state-issue: var(--color-amber-300);
  --state-conflict: var(--color-red-300);
  --term-value: var(--color-gray-800);
  --focus-ring: var(--color-gray-25);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --surface-page: var(--color-gray-950);
    --surface-raised: var(--color-gray-900);
    --surface-sunk: var(--color-gray-925);
    --surface-nav: var(--color-gray-975);
    --surface-hover: var(--color-gray-850);
    --surface-selected: var(--color-gray-800);
    --surface-hero: var(--color-gray-925);
    --surface-scrim: var(--color-scrim-dark);
    --text-primary: var(--color-gray-25);
    --text-secondary: var(--color-gray-250);
    --text-muted: var(--color-gray-400);
    --text-faint: var(--color-gray-400);
    --text-inverse: var(--color-gray-950);
    --border-subtle: var(--color-gray-825);
    --border-strong: var(--color-gray-700);
    --border-emphasis: var(--color-gray-500);
    --accent-base: var(--color-gray-25);
    --accent-hover: var(--color-gray-250);
    --accent-wash: var(--color-gray-850);
    --caution-base: var(--color-amber-300);
    --caution-wash: var(--color-amber-deep);
    --action-destructive: var(--color-red-400);
    --action-destructive-hover: var(--color-red-350);
    --action-destructive-text: var(--color-gray-950);
    --state-source: var(--color-green-300);
    --state-derived: var(--color-violet-300);
    --state-issue: var(--color-amber-300);
    --state-conflict: var(--color-red-300);
    --term-value: var(--color-gray-800);
    --focus-ring: var(--color-gray-25);
  }
}