/* AIBUAIBU semantic design tokens. Legacy variables remain the source of truth. */
:root {
  --ui-color-canvas: var(--bg);
  --ui-color-surface: var(--bg-elevated);
  --ui-color-surface-muted: var(--bg-subtle);
  --ui-color-text: var(--text);
  --ui-color-text-secondary: var(--text-secondary);
  --ui-color-text-muted: var(--text-muted);
  --ui-color-border: var(--border);
  --ui-color-border-strong: var(--border-strong);
  --ui-color-accent: var(--brand);
  --ui-color-accent-strong: var(--brand-strong);

  --ui-font-sans: var(--font-sans, "Inter", "Noto Sans SC", system-ui, sans-serif);
  --ui-font-mono: var(--font-mono, "JetBrains Mono", monospace);
  --ui-font-size-xs: 12px;
  --ui-font-size-sm: 13px;
  --ui-font-size-md: 14px;
  --ui-font-size-lg: 16px;
  --ui-font-size-xl: 20px;
  --ui-font-size-page: 28px;
  --ui-line-height-tight: 1.3;
  --ui-line-height-body: 1.65;

  --ui-space-1: 4px;
  --ui-space-2: 8px;
  --ui-space-3: 12px;
  --ui-space-4: 16px;
  --ui-space-5: 20px;
  --ui-space-6: 24px;
  --ui-space-8: 32px;
  --ui-space-10: 40px;
  --ui-space-12: 48px;

  --ui-radius-control: 6px;
  --ui-radius-panel: 8px;
  --ui-radius-media: 8px;
  --ui-radius-round: 999px;

  --ui-control-sm: 32px;
  --ui-control-md: 38px;
  --ui-control-lg: 44px;
  --ui-icon-sm: 16px;
  --ui-icon-md: 20px;
  --ui-icon-lg: 24px;

  --ui-shadow-subtle: var(--shadow-sm);
  --ui-shadow-raised: var(--shadow-md);
  --ui-focus-ring: 0 0 0 3px var(--brand-glow);

  --ui-header-height: var(--nav-height, 64px);
  --ui-sidebar-width: var(--sidebar-width, 220px);
  --ui-container-wide: 1440px;
  --ui-container-standard: 1200px;
  --ui-container-reading: 880px;
  --ui-page-gutter: 24px;

  --ui-z-header: 100;
  --ui-z-bottom-nav: 900;
  --ui-z-float: 950;
  --ui-z-drawer: 1100;
  --ui-z-modal: 1200;

  --ui-duration-fast: 150ms;
  --ui-duration-normal: 220ms;
  --ui-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

@media (max-width: 768px) {
  :root {
    --ui-font-size-page: 24px;
    --ui-page-gutter: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --ui-duration-fast: 0ms;
    --ui-duration-normal: 0ms;
  }
}