:root, :host {
  --cirth-primary: light-dark(oklch(50% .16 300), oklch(70% .14 300));
  --cirth-canvas: light-dark(oklch(98% .012 300), oklch(24% .028 295));
  --cirth-ink: light-dark(oklch(36% .03 295), oklch(93% .012 300));
  --cirth-muted-color: light-dark(oklch(52% .035 295), oklch(70% .028 295));
  --cirth-muted-border-color: light-dark(oklch(90% .02 300), oklch(36% .03 295));
  --cirth-link-visited-color: light-dark(oklch(50% .03 295), oklch(70% .025 295));
  --cirth-error: light-dark(oklch(45% .16 25), oklch(74% .13 25));
  --cirth-success: light-dark(oklch(52% .11 155), oklch(72% .11 155));
  --cirth-warning: light-dark(oklch(50% .1 75), oklch(74% .11 75));
  --cirth-font-family: ui-rounded, "SF Pro Rounded", "Hiragino Maru Gothic ProN", system-ui,
    "Segoe UI", Roboto, sans-serif, var(--cirth-font-family-emoji);
  --cirth-font-family-display: var(--cirth-font-family);
  --cirth-border-radius: var(--cirth-radius-lg);
  --cirth-spacing: var(--cirth-space-5);
  --cirth-line-height: var(--cirth-line-height-relaxed);
  --cirth-transition: var(--cirth-duration-slow) var(--cirth-ease-in-out);
  --cirth-primary-active: light-dark(oklch(56% .18 300), oklch(80% .13 300));
  --cirth-primary-surface-active: oklch(58% .18 300);
}

@media (prefers-contrast: more) {
  :root, :host {
    --cirth-primary: light-dark(oklch(41% .17 300), oklch(86% .1 300));
    --cirth-primary-surface: light-dark(oklch(41% .17 300), oklch(42% .15 300));
    --cirth-primary-surface-active: light-dark(oklch(34% .15 300), oklch(35% .13 300));
    --cirth-primary-active: light-dark(oklch(34% .16 300), oklch(92% .07 300));
    --cirth-ink: light-dark(oklch(22% .02 295), oklch(98% .006 300));
    --cirth-muted-color: light-dark(oklch(40% .035 295), oklch(82% .02 295));
    --cirth-muted-border-color: light-dark(oklch(58% .03 295), oklch(62% .03 295));
    --cirth-link-visited-color: light-dark(oklch(36% .03 295), oklch(84% .02 295));
  }
}