:root,
.anpa-ui {
  /* Public component API */
  --anpa-primary: #1659c7;
  --anpa-primary-hover: #104aa8;
  --anpa-secondary: #eef5ff;
  --anpa-success: #16845b;
  --anpa-warning: #9a5c00;
  --anpa-danger: #c4323d;
  --anpa-info: #2368d1;
  --anpa-background: #f6f8fb;
  --anpa-surface: #ffffff;
  --anpa-border: #e1e6ed;
  --anpa-text: #17233c;
  --anpa-text-light: #667085;
  --anpa-radius-sm: 0.5rem;
  --anpa-radius-md: 0.75rem;
  --anpa-radius-lg: 1rem;
  --anpa-shadow-sm: 0 1px 3px rgba(25, 42, 70, 0.08);
  --anpa-shadow-md: 0 12px 32px rgba(25, 42, 70, 0.09);
  --anpa-shadow-lg: 0 24px 64px rgba(13, 28, 52, 0.2);
  --anpa-spacing-xs: 0.25rem;
  --anpa-spacing-sm: 0.5rem;
  --anpa-spacing-md: 1rem;
  --anpa-spacing-lg: 1.5rem;
  --anpa-spacing-xl: 2rem;
  --anpa-transition: 180ms cubic-bezier(0.2, 0, 0, 1);

  /* Color */
  --anpa-ui-color-primary-50: #eef5ff;
  --anpa-ui-color-primary-100: #d9e9ff;
  --anpa-ui-color-primary-200: #bcd8ff;
  --anpa-ui-color-primary-500: #2368d1;
  --anpa-ui-color-primary-600: var(--anpa-primary);
  --anpa-ui-color-primary-700: var(--anpa-primary-hover);
  --anpa-ui-color-primary-800: #123f82;
  --anpa-ui-color-neutral-0: var(--anpa-surface);
  --anpa-ui-color-neutral-25: #fbfcfe;
  --anpa-ui-color-neutral-50: var(--anpa-background);
  --anpa-ui-color-neutral-100: #eef1f5;
  --anpa-ui-color-neutral-200: var(--anpa-border);
  --anpa-ui-color-neutral-300: #cbd2dc;
  --anpa-ui-color-neutral-500: var(--anpa-text-light);
  --anpa-ui-color-neutral-700: #344054;
  --anpa-ui-color-neutral-900: var(--anpa-text);
  --anpa-ui-color-success-50: #ebfaf3;
  --anpa-ui-color-success-600: var(--anpa-success);
  --anpa-ui-color-warning-50: #fff7e7;
  --anpa-ui-color-warning-700: var(--anpa-warning);
  --anpa-ui-color-danger-50: #fff0f1;
  --anpa-ui-color-danger-600: var(--anpa-danger);
  --anpa-ui-color-info-50: #eef5ff;
  --anpa-ui-color-info-700: var(--anpa-info);
  --anpa-ui-color-on-strong: #ffffff;
  --anpa-ui-color-glass: rgba(255, 255, 255, 0.94);
  --anpa-ui-color-primary-shadow: rgba(22, 89, 199, 0.2);
  --anpa-ui-color-sidebar: #10223d;
  --anpa-ui-color-sidebar-glow: rgba(72, 133, 227, 0.22);
  --anpa-ui-color-sidebar-muted: #8ea3c0;
  --anpa-ui-color-sidebar-text: #c9d4e4;
  --anpa-ui-color-sidebar-hover: rgba(255, 255, 255, 0.09);
  --anpa-ui-color-sidebar-border: rgba(255, 255, 255, 0.1);
  --anpa-ui-color-sidebar-active-start: #2269d3;
  --anpa-ui-color-sidebar-active-end: #1955ae;
  --anpa-ui-color-sidebar-shadow: rgba(0, 0, 0, 0.18);
  --anpa-ui-color-overlay: rgba(10, 20, 38, 0.5);
  --anpa-ui-color-modal-backdrop: rgba(10, 20, 38, 0.58);

  /* Semantic aliases */
  --anpa-ui-bg-page: var(--anpa-ui-color-neutral-50);
  --anpa-ui-bg-surface: var(--anpa-ui-color-neutral-0);
  --anpa-ui-bg-subtle: var(--anpa-ui-color-neutral-25);
  --anpa-ui-text: var(--anpa-ui-color-neutral-900);
  --anpa-ui-text-muted: var(--anpa-ui-color-neutral-500);
  --anpa-ui-border: var(--anpa-ui-color-neutral-200);
  --anpa-ui-focus: #72a7ff;

  /* Typography */
  --anpa-ui-font-sans: "Avenir Next", Avenir, "Segoe UI", sans-serif;
  --anpa-ui-font-mono: "SFMono-Regular", Consolas, monospace;
  --anpa-ui-text-xs: 0.75rem;
  --anpa-ui-text-sm: 0.875rem;
  --anpa-ui-text-md: 1rem;
  --anpa-ui-text-lg: 1.125rem;
  --anpa-ui-text-xl: 1.375rem;
  --anpa-ui-text-2xl: clamp(1.75rem, 3vw, 2.25rem);
  --anpa-ui-leading-tight: 1.2;
  --anpa-ui-leading-normal: 1.55;
  --anpa-ui-weight-medium: 550;
  --anpa-ui-weight-semibold: 650;
  --anpa-ui-weight-bold: 750;

  /* Spacing */
  --anpa-ui-space-1: var(--anpa-spacing-xs);
  --anpa-ui-space-2: var(--anpa-spacing-sm);
  --anpa-ui-space-3: 0.75rem;
  --anpa-ui-space-4: var(--anpa-spacing-md);
  --anpa-ui-space-5: 1.25rem;
  --anpa-ui-space-6: var(--anpa-spacing-lg);
  --anpa-ui-space-8: var(--anpa-spacing-xl);
  --anpa-ui-space-10: 2.5rem;
  --anpa-ui-space-12: 3rem;
  --anpa-ui-space-16: 4rem;

  /* Shape and depth */
  --anpa-ui-radius-sm: var(--anpa-radius-sm);
  --anpa-ui-radius-md: var(--anpa-radius-md);
  --anpa-ui-radius-lg: var(--anpa-radius-lg);
  --anpa-ui-radius-pill: 999px;
  --anpa-ui-shadow-sm: var(--anpa-shadow-sm);
  --anpa-ui-shadow-md: var(--anpa-shadow-md);
  --anpa-ui-shadow-lg: var(--anpa-shadow-lg);

  /* Motion and layering */
  --anpa-ui-duration-fast: 140ms;
  --anpa-ui-duration-normal: 220ms;
  --anpa-ui-ease: cubic-bezier(0.2, 0, 0, 1);
  --anpa-ui-z-dropdown: 100;
  --anpa-ui-z-sidebar: 900;
  --anpa-ui-z-overlay: 1000;
  --anpa-ui-z-modal: 1100;

  /* Layout */
  --anpa-ui-content-max: 74rem;
  --anpa-ui-control-height: 2.75rem;
  --anpa-ui-sidebar-width: 15.5rem;
}