/* Generated by tokens/build.mjs from tokens/src/*.json. Do not edit. */
/* Dark theme that follows the system. Add after tokens.css. A page can still force light with <html data-theme="light">. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    color-scheme: dark;
    --shadow-card: 0 1px 2px #00000040;
    --shadow-raised: 0 4px 16px #00000066;
    --shadow-dialog: 0 16px 48px #000000b3;
    --color-bg: var(--ink-950);
    --color-surface: var(--ink-900);
    --color-surface-subtle: var(--ink-800);
    --color-text: var(--mist-50);
    --color-text-secondary: var(--mist-300);
    --color-text-muted: var(--mist-400);
    --color-border: var(--ink-700);
    --color-border-hover: var(--ink-600);
    --color-control-border: var(--mist-400);
    --color-brand: var(--forest-300);
    --color-brand-hover: var(--forest-200);
    --color-brand-subtle: var(--forest-900);
    --color-focus: var(--forest-300);
    --color-on-brand: var(--ink-950);
    --color-danger: var(--red-300);
    --color-danger-hover: var(--red-100);
    --color-danger-subtle: var(--red-900);
    --color-danger-border: var(--red-800);
    --color-success: var(--forest-300);
    --color-success-subtle: var(--forest-950);
    --color-warning: var(--sand-300);
    --color-warning-subtle: var(--sand-900);
    --color-sidebar: var(--forest-950);
    --color-sidebar-active: var(--forest-800);
    --color-sidebar-divider: var(--forest-800);
    --color-sidebar-accent: var(--lime-300);
    --color-sidebar-text: #c4d3cb;
    --color-sidebar-text-active: var(--white);
    --color-sidebar-muted: #99b4a6;
    --color-backdrop: #000000a6;
    --focus-ring: 2px solid var(--color-focus);
  }
}
