:root {
  --font-family-base: "Segoe UI", "Segoe WP", Tahoma, Arial, sans-serif;
  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-md: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.25rem;
  --fs-2xl: 1.5rem;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 0.5rem;
  --space-5: 1.25rem;
  --space-6: 0.5rem;
  --space-lg: var(--space-6);

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;

  --shadow-sm: 0 2px 8px rgba(16, 24, 40, 0.08);
  --shadow-md: 0 8px 24px rgba(16, 24, 40, 0.12);
  --shadow-lg: 0 16px 40px rgba(16, 24, 40, 0.2);

  --transition-fast: 120ms;
  --transition-base: 180ms;
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);

  --ui-shell-bg: #f4f6fb;
  --ui-surface: #ffffff;
  --ui-border: #d8dee9;
  --ui-text: #111827;
  --ui-muted: #5b6473;
  --ui-accent: #051828;
  --ui-accent-strong: #051828;
  --ui-shadow: var(--shadow-md);
  --ui-topbar-h: 56px;
  --ui-sidebar-w: 200px;
  --ui-sidebar-w-collapsed: 62px;
  --ui-content-pad: var(--space-4);
  --ui-radius: var(--radius-md);
  --ui-gap-1: 4px;
  --ui-gap-2: 8px;
  --ui-pad-1: 6px;
  --ui-pad-2: 10px;
  --ui-font-sm: 0.8125rem;
  --ui-font-base: 0.9375rem;
  --ui-control-h: 36px;
  --ui-control-h-sm: 32px;
  --ui-control-h-lg: 40px;
}