:root {
  color-scheme: light;
  --ui-bg: #f4f6f8;
  --ui-surface: #ffffff;
  --ui-surface-subtle: #f8fafb;
  --ui-surface-strong: #eef2f5;
  --ui-text: #17202a;
  --ui-text-secondary: #344054;
  --ui-text-muted: #667085;
  --ui-border: #e2e8ef;
  --ui-border-strong: #d4dbe4;
  --ui-nav: #0d1720;
  --ui-nav-hover: #15232e;
  --ui-nav-active: #20303d;
  --ui-nav-text: #e7edf3;
  --ui-nav-muted: #aab6c2;
  --ui-brand: #efb82a;
  --ui-brand-light: #f5c858;
  --ui-brand-subtle: #fff4d6;
  --ui-info: #2f6fed;
  --ui-info-subtle: #eaf1ff;
  --ui-success: #18845a;
  --ui-success-subtle: #e9f7f1;
  --ui-warning: #b85f0b;
  --ui-warning-subtle: #fff2e2;
  --ui-danger: #b42318;
  --ui-danger-subtle: #fff0ee;
  --ui-sidebar-expanded: 232px;
  --ui-sidebar-collapsed: 76px;
  --ui-topbar-desktop: 64px;
  --ui-topbar-mobile: 56px;
  --ui-field-desktop: 40px;
  --ui-field-touch: 48px;
  --ui-button-desktop: 38px;
  --ui-button-touch: 44px;
  --ui-touch-target: 44px;
  --ui-radius-field: 8px;
  --ui-radius-button: 8px;
  --ui-radius-panel: 12px;
  --ui-radius-hero: 14px;
  --ui-space-1: 4px;
  --ui-space-2: 8px;
  --ui-space-3: 12px;
  --ui-space-4: 16px;
  --ui-space-6: 24px;
  --ui-space-8: 32px;
  --ui-motion-hover: 140ms;
  --ui-motion-panel: 220ms;
  --color-bg: var(--ui-bg);
  --color-surface: var(--ui-surface);
  --color-surface-muted: var(--ui-surface-subtle);
  --color-text: var(--ui-text);
  --color-text-secondary: var(--ui-text-muted);
  --color-border: var(--ui-border);
  --color-border-strong: var(--ui-border-strong);
  --color-accent: var(--ui-brand);
  --color-accent-hover: var(--ui-brand-light);
  --color-accent-soft: var(--ui-brand-subtle);
  --color-accent-text: var(--ui-text);
  --color-success: var(--ui-success);
  --color-success-soft: var(--ui-success-subtle);
  --color-warning: var(--ui-warning);
  --color-warning-soft: var(--ui-warning-subtle);
  --color-danger: var(--ui-danger);
  --color-danger-soft: var(--ui-danger-subtle);
  --color-info: var(--ui-info);
  --color-info-soft: var(--ui-info-subtle);
  --color-sidebar: var(--ui-nav);
  --color-sidebar-muted: var(--ui-nav-muted);
  --shadow-soft: 0 16px 40px rgb(23 32 42 / 8%);
  --radius-sm: var(--ui-radius-field);
  --radius-md: var(--ui-radius-panel);
  --space-1: var(--ui-space-1);
  --space-2: var(--ui-space-2);
  --space-3: var(--ui-space-3);
  --space-4: var(--ui-space-4);
  --space-5: 20px;
  --space-6: var(--ui-space-6);
  --space-8: var(--ui-space-8);
}