:root,
[data-theme="base"],
[data-theme="customer-ocean"],
[data-theme="hcto"] {
  --ds-color-surface-canvas: var(--semantic-surface-canvas);
  --ds-color-surface-elevated: var(--semantic-surface-elevated);
  --ds-color-surface-inverse: var(--semantic-surface-inverse);
  --ds-color-text-primary: var(--semantic-text-primary);
  --ds-color-text-inverse: var(--semantic-text-inverse);
  --ds-color-text-muted: var(--semantic-text-muted);
  --ds-color-action-primary-bg: var(--semantic-action-primary-bg);
  --ds-color-action-primary-fg: var(--semantic-action-primary-fg);
  --ds-color-action-accent-bg: var(--semantic-action-accent-bg);
  --ds-color-action-accent-fg: var(--semantic-action-accent-fg);
  --ds-color-action-outline: var(--semantic-action-outline);
  --ds-color-border-subtle: var(--semantic-border-subtle);
  --ds-color-border-strong: var(--semantic-border-strong);

  --ds-font-heading: var(--core-font-heading);
  --ds-font-body: var(--core-font-body);

  --ds-radius-sm: var(--core-radius-sm);
  --ds-radius-md: var(--core-radius-md);
  --ds-radius-lg: var(--core-radius-lg);
  --ds-radius-pill: var(--core-radius-pill);

  --ds-space-2: var(--core-space-2);
  --ds-space-3: var(--core-space-3);
  --ds-space-4: var(--core-space-4);
  --ds-space-6: var(--core-space-6);
  --ds-space-8: var(--core-space-8);
  --ds-space-10: var(--core-space-10);
  --ds-space-12: var(--core-space-12);

  --ds-motion-fast: var(--core-motion-duration-fast);
  --ds-motion-base: var(--core-motion-duration-base);
  --ds-motion-slow: var(--core-motion-duration-slow);
  --ds-ease-out: var(--core-motion-easing-out);
  --ds-ease-in-out: var(--core-motion-easing-in-out);
  --ds-ease-expo: var(--core-motion-easing-expo);

  --ds-shadow-soft: var(--core-shadow-soft);
  --ds-shadow-overlay: var(--core-shadow-overlay);
}