:root {
  --zenbu-font-editorial: var(--zenbu-ref-font-family-sans);
  --zenbu-font-playful: var(--zenbu-ref-font-family-sans);
  --zenbu-sys-font-family-ui: var(--zenbu-ref-font-family-sans);
  --zenbu-sys-font-family-content: var(--zenbu-ref-font-family-sans);
  --zenbu-sys-font-family-code: var(--zenbu-ref-font-family-mono);
  --zenbu-sys-font-weight-regular: var(--zenbu-ref-font-weight-regular);
  --zenbu-sys-font-weight-medium: var(--zenbu-ref-font-weight-medium);
  --zenbu-sys-font-weight-strong: var(--zenbu-ref-font-weight-strong);
  --zenbu-sys-font-weight-bold: var(--zenbu-ref-font-weight-bold);
  --zenbu-sys-font-weight-display: var(--zenbu-ref-font-weight-bold);
  --zenbu-sys-font-size-xs: var(--zenbu-ref-font-size-xs);
  --zenbu-sys-font-size-sm: var(--zenbu-ref-font-size-sm);
  --zenbu-sys-font-size-md: var(--zenbu-ref-font-size-md);
  --zenbu-sys-font-size-lg: var(--zenbu-ref-font-size-lg);
  --zenbu-sys-font-size-xl: var(--zenbu-ref-font-size-xl);
  --zenbu-sys-font-size-2xl: var(--zenbu-ref-font-size-2xl);
  --zenbu-sys-font-size-3xl: var(--zenbu-ref-font-size-3xl);
  --zenbu-sys-line-height-xs: 1.25;
  --zenbu-sys-line-height-sm: var(--zenbu-ref-line-height-ui);
  --zenbu-sys-line-height-md: var(--zenbu-ref-line-height-body);
  --zenbu-sys-line-height-lg: 1.5;
  --zenbu-sys-line-height-xl: var(--zenbu-ref-line-height-ui);

  --zenbu-sys-type-caption-family: var(--zenbu-sys-font-family-ui);
  --zenbu-sys-type-caption-size: var(--zenbu-ref-font-size-xs);
  --zenbu-sys-type-caption-weight: var(--zenbu-sys-font-weight-regular);
  --zenbu-sys-type-caption-line-height: var(--zenbu-ref-line-height-ui);
  --zenbu-sys-type-label-family: var(--zenbu-sys-font-family-ui);
  --zenbu-sys-type-label-size: var(--zenbu-ref-font-size-sm);
  --zenbu-sys-type-label-weight: var(--zenbu-sys-font-weight-medium);
  --zenbu-sys-type-label-line-height: var(--zenbu-ref-line-height-ui);
  --zenbu-sys-type-body-family: var(--zenbu-sys-font-family-ui);
  --zenbu-sys-type-body-size: var(--zenbu-ref-font-size-md);
  --zenbu-sys-type-body-weight: var(--zenbu-sys-font-weight-regular);
  --zenbu-sys-type-body-line-height: var(--zenbu-ref-line-height-body);
  --zenbu-sys-type-body-large-family: var(--zenbu-sys-font-family-ui);
  --zenbu-sys-type-body-large-size: var(--zenbu-ref-font-size-lg);
  --zenbu-sys-type-body-large-weight: var(--zenbu-sys-font-weight-regular);
  --zenbu-sys-type-body-large-line-height: var(--zenbu-ref-line-height-body);
  --zenbu-sys-type-subtitle-family: var(--zenbu-sys-font-family-ui);
  --zenbu-sys-type-subtitle-size: var(--zenbu-ref-font-size-xl);
  --zenbu-sys-type-subtitle-weight: var(--zenbu-sys-font-weight-strong);
  --zenbu-sys-type-subtitle-line-height: var(--zenbu-ref-line-height-heading);
  --zenbu-sys-type-title-family: var(--zenbu-sys-font-family-ui);
  --zenbu-sys-type-title-size: var(--zenbu-ref-font-size-2xl);
  --zenbu-sys-type-title-weight: var(--zenbu-sys-font-weight-strong);
  --zenbu-sys-type-title-line-height: var(--zenbu-ref-line-height-heading);
  --zenbu-sys-type-page-title-family: var(--zenbu-sys-font-family-ui);
  --zenbu-sys-type-page-title-size:
    clamp(var(--zenbu-ref-font-size-3xl), 1.5rem + 2cqi, var(--zenbu-ref-font-size-display));
  --zenbu-sys-type-page-title-weight: var(--zenbu-sys-font-weight-strong);
  --zenbu-sys-type-page-title-line-height: var(--zenbu-ref-line-height-tight);
  --zenbu-sys-type-reading-family: var(--zenbu-sys-font-family-content);
  --zenbu-sys-type-reading-size: var(--zenbu-ref-font-size-md);
  --zenbu-sys-type-reading-weight: var(--zenbu-sys-font-weight-regular);
  --zenbu-sys-type-reading-line-height: var(--zenbu-ref-line-height-reading);
  --zenbu-sys-type-code-family: var(--zenbu-sys-font-family-code);
  --zenbu-sys-type-code-size: var(--zenbu-ref-font-size-sm);
  --zenbu-sys-type-code-weight: var(--zenbu-sys-font-weight-regular);
  --zenbu-sys-type-code-line-height: var(--zenbu-ref-line-height-body);

  --zenbu-sys-space-icon-label: var(--zenbu-ref-space-1);
  --zenbu-sys-space-related: var(--zenbu-ref-space-2);
  --zenbu-sys-space-control: var(--zenbu-ref-space-3);
  --zenbu-sys-space-group: var(--zenbu-ref-space-4);
  --zenbu-sys-space-container: var(--zenbu-ref-space-6);
  --zenbu-sys-space-content: var(--zenbu-ref-space-8);
  --zenbu-sys-space-section: var(--zenbu-ref-space-12);
  --zenbu-sys-space-page: var(--zenbu-ref-space-16);
  --zenbu-sys-padding-xs: var(--zenbu-ref-space-2);
  --zenbu-sys-padding-sm: var(--zenbu-ref-space-3);
  --zenbu-sys-padding-md: var(--zenbu-ref-space-4);
  --zenbu-sys-padding-lg: var(--zenbu-ref-space-6);
  --zenbu-sys-padding-xl: var(--zenbu-ref-space-8);

  --zenbu-sys-radius-control-small: var(--zenbu-ref-radius-1);
  --zenbu-sys-radius-control: var(--zenbu-ref-radius-2);
  --zenbu-sys-radius-control-large: var(--zenbu-ref-radius-3);
  --zenbu-sys-radius-container: var(--zenbu-ref-radius-3);
  --zenbu-sys-radius-panel: var(--zenbu-ref-radius-4);
  --zenbu-sys-radius-dialog: var(--zenbu-ref-radius-5);
  --zenbu-sys-radius-pill: var(--zenbu-ref-radius-round);
  --zenbu-sys-stroke-width: var(--zenbu-ref-stroke-1);
  --zenbu-sys-stroke-width-emphasis: var(--zenbu-ref-stroke-2);
  --zenbu-sys-focus-width: var(--zenbu-ref-stroke-3);
  --zenbu-sys-focus-offset: var(--zenbu-ref-space-0-5);
  --zenbu-sys-shadow-rest: none;
  --zenbu-sys-shadow-subtle: var(--zenbu-ref-shadow-1);
  --zenbu-sys-shadow-raised: var(--zenbu-ref-shadow-2);
  --zenbu-sys-shadow-overlay: var(--zenbu-ref-shadow-3);
  --zenbu-sys-shadow-dialog: var(--zenbu-ref-shadow-4);

  --zenbu-sys-motion-duration-feedback: var(--zenbu-ref-duration-fast);
  --zenbu-sys-motion-duration-state: var(--zenbu-ref-duration-normal);
  --zenbu-sys-motion-duration-enter: var(--zenbu-ref-duration-normal);
  --zenbu-sys-motion-duration-exit: var(--zenbu-ref-duration-fast);
  --zenbu-sys-motion-duration-layout: var(--zenbu-ref-duration-slow);
  --zenbu-sys-motion-ease-state: var(--zenbu-ref-ease-standard);
  --zenbu-sys-motion-ease-enter: var(--zenbu-ref-ease-enter);
  --zenbu-sys-motion-ease-exit: var(--zenbu-ref-ease-exit);
  --zenbu-sys-motion-ease-layout: var(--zenbu-ref-ease-emphasized);
  --zenbu-sys-opacity-disabled: var(--zenbu-ref-opacity-disabled);

  --zenbu-sys-control-height-xs: var(--zenbu-ref-size-control-xs);
  --zenbu-sys-control-height-sm: var(--zenbu-ref-size-control-sm);
  --zenbu-sys-control-height-md: var(--zenbu-ref-size-control-md);
  --zenbu-sys-control-height-lg: var(--zenbu-ref-size-control-lg);
  --zenbu-sys-control-height-xl: var(--zenbu-ref-size-control-xl);
  --zenbu-sys-control-padding-block-xs: var(--zenbu-ref-space-1);
  --zenbu-sys-control-padding-block-sm: var(--zenbu-ref-space-1-5);
  --zenbu-sys-control-padding-block-md: var(--zenbu-ref-space-2);
  --zenbu-sys-control-padding-block-lg: var(--zenbu-ref-space-3);
  --zenbu-sys-control-padding-block-xl: var(--zenbu-ref-space-4);
  --zenbu-sys-control-padding-inline-xs: var(--zenbu-ref-space-2-5);
  --zenbu-sys-control-padding-inline-sm: var(--zenbu-ref-space-3);
  --zenbu-sys-control-padding-inline-md: var(--zenbu-ref-space-4);
  --zenbu-sys-control-padding-inline-lg: var(--zenbu-ref-space-5);
  --zenbu-sys-control-padding-inline-xl: var(--zenbu-ref-space-6);
  --zenbu-sys-control-gap-xs: var(--zenbu-ref-space-1);
  --zenbu-sys-control-gap-sm: var(--zenbu-ref-space-1-5);
  --zenbu-sys-control-gap-md: var(--zenbu-ref-space-2);
  --zenbu-sys-control-gap-lg: var(--zenbu-ref-space-3);
  --zenbu-sys-control-gap-xl: var(--zenbu-ref-space-4);
  --zenbu-sys-control-font-size-xs: var(--zenbu-ref-font-size-xs);
  --zenbu-sys-control-font-size-sm: var(--zenbu-ref-font-size-sm);
  --zenbu-sys-control-font-size-md: var(--zenbu-ref-font-size-md);
  --zenbu-sys-control-font-size-lg: var(--zenbu-ref-font-size-lg);
  --zenbu-sys-control-font-size-xl: var(--zenbu-ref-font-size-xl);
  --zenbu-sys-control-line-height-xs: 1;
  --zenbu-sys-control-line-height-sm: 1;
  --zenbu-sys-control-line-height-md: 1;
  --zenbu-sys-control-line-height-lg: 1;
  --zenbu-sys-control-line-height-xl: 1;
  --zenbu-sys-icon-size-xs: var(--zenbu-ref-size-icon-xs);
  --zenbu-sys-icon-size-sm: var(--zenbu-ref-size-icon-sm);
  --zenbu-sys-icon-size-md: var(--zenbu-ref-size-icon-md);
  --zenbu-sys-icon-size-lg: var(--zenbu-ref-size-icon-lg);
  --zenbu-sys-icon-size-xl: var(--zenbu-ref-size-icon-xl);
  --zenbu-sys-size-target-min: var(--zenbu-ref-size-target-min);
  --zenbu-sys-width-reading: 45rem;
  --zenbu-sys-width-content: 64rem;
  --zenbu-sys-width-page: 90rem;
  --zenbu-sys-z-sticky: var(--zenbu-ref-z-sticky);
  --zenbu-sys-z-dropdown: var(--zenbu-ref-z-dropdown);
  --zenbu-sys-z-popover: var(--zenbu-ref-z-popover);
  --zenbu-sys-z-notification: var(--zenbu-ref-z-notification);
  --zenbu-sys-z-modal: var(--zenbu-ref-z-modal);

  --zenbu-sys-color-surface-page: var(--zenbu-ref-color-neutral-100);
  --zenbu-sys-color-surface-canvas: var(--zenbu-ref-color-neutral-100);
  --zenbu-sys-color-surface-default: var(--zenbu-ref-color-neutral-50);
  --zenbu-sys-color-surface-subtle: var(--zenbu-ref-color-neutral-200);
  --zenbu-sys-color-surface-raised: var(--zenbu-ref-color-white);
  --zenbu-sys-color-surface-overlay: var(--zenbu-ref-color-white);
  --zenbu-sys-color-surface-sunken: var(--zenbu-ref-color-neutral-200);
  --zenbu-sys-color-scrim: var(--zenbu-ref-color-black-alpha-60);
  --zenbu-sys-color-text-primary: var(--zenbu-ref-color-neutral-950);
  --zenbu-sys-color-text-secondary: var(--zenbu-ref-color-neutral-700);
  --zenbu-sys-color-text-tertiary: var(--zenbu-ref-color-neutral-600);
  --zenbu-sys-color-text-placeholder: var(--zenbu-ref-color-neutral-500);
  --zenbu-sys-color-text-disabled: var(--zenbu-ref-color-neutral-400);
  --zenbu-sys-color-text-inverse: var(--zenbu-ref-color-white);
  --zenbu-sys-color-text-link: var(--zenbu-ref-color-brand-600);
  --zenbu-sys-color-link-decoration: var(--zenbu-ref-color-link-decoration);
  --zenbu-sys-color-icon-primary: var(--zenbu-ref-color-neutral-900);
  --zenbu-sys-color-icon-secondary: var(--zenbu-ref-color-neutral-600);
  --zenbu-sys-color-border-subtle: var(--zenbu-ref-color-neutral-300);
  --zenbu-sys-color-border-default: var(--zenbu-ref-color-neutral-500);
  --zenbu-sys-color-border-strong: var(--zenbu-ref-color-neutral-800);
  --zenbu-sys-color-action-primary-background: var(--zenbu-ref-color-accent);
  --zenbu-sys-color-action-primary-background-hover: var(--zenbu-ref-color-accent-hover);
  --zenbu-sys-color-action-primary-background-pressed: var(--zenbu-ref-color-accent-pressed);
  --zenbu-sys-color-action-primary-foreground: var(--zenbu-ref-color-neutral-950);
  --zenbu-sys-color-action-primary-border: var(--zenbu-sys-color-border-strong);
  --zenbu-sys-color-action-neutral-background: var(--zenbu-sys-color-surface-default);
  --zenbu-sys-color-action-neutral-background-hover: var(--zenbu-sys-color-surface-subtle);
  --zenbu-sys-color-action-neutral-background-pressed: var(--zenbu-sys-color-surface-sunken);
  --zenbu-sys-color-action-neutral-foreground: var(--zenbu-sys-color-text-primary);
  --zenbu-sys-color-action-neutral-border: var(--zenbu-sys-color-border-default);
  --zenbu-sys-color-action-danger-background: var(--zenbu-ref-color-danger);
  --zenbu-sys-color-action-danger-background-hover: var(--zenbu-ref-color-danger-700);
  --zenbu-sys-color-action-danger-background-pressed: var(--zenbu-ref-color-danger-900);
  --zenbu-sys-color-action-danger-foreground: var(--zenbu-ref-color-white);
  --zenbu-sys-color-action-danger-border: var(--zenbu-ref-color-danger);
  --zenbu-sys-color-focus-inner: var(--zenbu-sys-color-surface-default);
  --zenbu-sys-color-focus-outer: var(--zenbu-ref-color-focus);
  --zenbu-sys-color-selection-background: var(--zenbu-ref-color-warning-300);
  --zenbu-sys-color-selection-foreground: var(--zenbu-sys-color-text-primary);
  --zenbu-sys-color-info-background: var(--zenbu-ref-color-brand-100);
  --zenbu-sys-color-info-foreground: var(--zenbu-ref-color-brand-700);
  --zenbu-sys-color-info-border: var(--zenbu-ref-color-brand-400);
  --zenbu-sys-color-success-background: var(--zenbu-ref-color-success-100);
  --zenbu-sys-color-success-foreground: var(--zenbu-ref-color-success);
  --zenbu-sys-color-success-border: var(--zenbu-ref-color-success-500);
  --zenbu-sys-color-warning-background: var(--zenbu-ref-color-warning-100);
  --zenbu-sys-color-warning-foreground: var(--zenbu-ref-color-warning);
  --zenbu-sys-color-warning-border: var(--zenbu-ref-color-warning-500);
  --zenbu-sys-color-danger-background: var(--zenbu-ref-color-danger-100);
  --zenbu-sys-color-danger-foreground: var(--zenbu-ref-color-danger);
  --zenbu-sys-color-danger-border: var(--zenbu-ref-color-danger-500);
  --zenbu-sys-color-code-surface: var(--zenbu-ref-color-neutral-950);
  --zenbu-sys-color-code-text: var(--zenbu-ref-color-neutral-50);
  --zenbu-sys-color-gridline: var(--zenbu-ref-color-black-alpha-8);
  --zenbu-sys-color-data-1: var(--zenbu-ref-color-brand-600);
  --zenbu-sys-color-data-2: var(--zenbu-ref-color-warning-500);
  --zenbu-sys-color-data-3: var(--zenbu-ref-color-success-600);
  --zenbu-sys-color-data-4: var(--zenbu-ref-color-violet-500);
  --zenbu-sys-color-data-5: var(--zenbu-ref-color-amber-600);

}

@media (forced-colors: active) {
  :root {
    --zenbu-sys-color-surface-page: Canvas;
    --zenbu-sys-color-surface-canvas: Canvas;
    --zenbu-sys-color-surface-default: Canvas;
    --zenbu-sys-color-surface-subtle: Canvas;
    --zenbu-sys-color-surface-raised: Canvas;
    --zenbu-sys-color-surface-overlay: Canvas;
    --zenbu-sys-color-text-primary: CanvasText;
    --zenbu-sys-color-text-secondary: CanvasText;
    --zenbu-sys-color-text-tertiary: GrayText;
    --zenbu-sys-color-text-disabled: GrayText;
    --zenbu-sys-color-text-link: LinkText;
    --zenbu-sys-color-border-subtle: CanvasText;
    --zenbu-sys-color-border-default: CanvasText;
    --zenbu-sys-color-border-strong: CanvasText;
    --zenbu-sys-color-focus-inner: Canvas;
    --zenbu-sys-color-focus-outer: CanvasText;
    --zenbu-sys-shadow-subtle: none;
    --zenbu-sys-shadow-raised: none;
    --zenbu-sys-shadow-overlay: none;
    --zenbu-sys-shadow-dialog: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --zenbu-sys-motion-duration-feedback: 1ms;
    --zenbu-sys-motion-duration-state: 1ms;
    --zenbu-sys-motion-duration-enter: 1ms;
    --zenbu-sys-motion-duration-exit: 1ms;
    --zenbu-sys-motion-duration-layout: 1ms;
  }
}