:root {
  /* Spacing */
  --omni-space-1: 4px;
  --omni-space-2: 8px;
  --omni-space-3: 12px;
  --omni-space-4: 16px;
  --omni-space-5: 20px;
  --omni-space-6: 24px;
  --omni-space-8: 32px;
  --omni-space-10: 40px;
  --omni-space-12: 48px;
  --omni-space-16: 64px;

  /* Radius */
  --omni-radius-xs: 6px;
  --omni-radius-sm: 8px;
  --omni-radius-md: 10px;
  --omni-radius-lg: 12px;
  --omni-radius-xl: 16px;
  --omni-radius-pill: 999px;

  /* Borders, layering and responsive foundations */
  --omni-border-width: 1px;
  --omni-border-width-strong: 2px;
  --omni-z-dropdown: 1000;
  --omni-z-sticky: 1100;
  --omni-z-overlay: 1200;
  --omni-z-modal: 1300;
  --omni-z-toast: 1400;
  --omni-breakpoint-mobile: 480px;
  --omni-breakpoint-tablet: 900px;
  --omni-breakpoint-desktop: 1024px;
  --omni-touch-target: 44px;

  /* Typography */
  --omni-font-family-sans:
    system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
    Arial, sans-serif;
  --omni-font-family-serif: Georgia, Cambria, "Times New Roman", Times, serif;
  --omni-font-family-mono:
    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
    "Courier New", monospace;

  /* Typography - Sizes (Examples) */
  --omni-text-display: 3rem;
  --omni-text-heading-1: 2.25rem;
  --omni-text-heading-2: 1.875rem;
  --omni-text-heading-3: 1.5rem;
  --omni-text-body: 1rem;
  --omni-text-body-small: 0.875rem;
  --omni-text-label: 0.75rem;
  --omni-text-caption: 0.625rem;
  --omni-text-code: 0.875rem;

  /* Motion */
  --omni-motion-micro: 100ms cubic-bezier(0.4, 0, 0.2, 1);
  --omni-motion-hover: 140ms cubic-bezier(0.4, 0, 0.2, 1);
  --omni-motion-tabs: 180ms cubic-bezier(0.4, 0, 0.2, 1);
  --omni-motion-dropdown: 200ms cubic-bezier(0.4, 0, 0.2, 1);
  --omni-motion-tooltip: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --omni-motion-drawer: 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --omni-motion-modal: 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --omni-motion-theme: 400ms ease-in-out;
  --omni-motion-fast: 100ms;
  --omni-motion-normal: 180ms;
  --omni-motion-slow: 280ms;
  --omni-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --omni-ease-enter: cubic-bezier(0, 0, 0.2, 1);
  --omni-ease-exit: cubic-bezier(0.4, 0, 1, 1);

  /* Default comfortable density */
  --omni-control-height: 40px;
  --omni-control-height-sm: 32px;
  --omni-control-padding-x: 16px;
  --omni-layout-gap: 16px;
  --omni-row-height: 48px;

  /* Component tokens: components consume these aliases, never palette values. */
  --omni-focus-width: 2px;
  --omni-focus-offset: 2px;
  --omni-disabled-opacity: 0.55;
  --omni-control-bg: var(--omni-surface);
  --omni-control-bg-hover: var(--omni-surface-hover);
  --omni-control-border: var(--omni-border);
  --omni-control-accent: var(--omni-primary);
  --omni-control-text: var(--omni-text-primary);
  --omni-focus-ring: var(--omni-border-focus);
  --omni-nav-bg: var(--omni-surface);
  --omni-overlay-bg: var(--omni-surface-raised);
}

[data-omni-density="compact"] {
  --omni-control-height: 32px;
  --omni-control-height-sm: 28px;
  --omni-control-padding-x: 10px;
  --omni-layout-gap: 8px;
  --omni-row-height: 36px;
}

[data-omni-density="workspace"] {
  --omni-control-height: 36px;
  --omni-control-height-sm: 30px;
  --omni-control-padding-x: 12px;
  --omni-layout-gap: 12px;
  --omni-row-height: 40px;
}

[data-omni-density="touch"] {
  --omni-control-height: 48px;
  --omni-control-height-sm: 44px;
  --omni-control-padding-x: 18px;
  --omni-layout-gap: 16px;
  --omni-row-height: 56px;
  --omni-touch-target: 48px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --omni-motion-micro: 0ms;
    --omni-motion-hover: 0ms;
    --omni-motion-tabs: 0ms;
    --omni-motion-dropdown: 0ms;
    --omni-motion-tooltip: 0ms;
    --omni-motion-drawer: 0ms;
    --omni-motion-modal: 0ms;
    --omni-motion-theme: 0ms;
    --omni-motion-fast: 0ms;
    --omni-motion-normal: 0ms;
    --omni-motion-slow: 0ms;
  }
}