:root,
:host {
  --default-transition-duration: 150ms;
  --default-transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, outline-color, outline-offset, visibility, display, overlay;
  --default-transition-timing-function: var(--ease-in-out);
  --transition-all: all var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-color: color var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-background: background var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-opacity: opacity var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-transform: transform var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-border: border-color var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-shadow: box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-display: display var(--default-transition-duration) var(--default-transition-timing-function);
  --transition-overlay: overlay var(--default-transition-duration) var(--default-transition-timing-function);
  --view-transition-main-duration: var(--default-transition-duration);

  @media (prefers-reduced-motion) {
    --default-transition-duration: 0;
    --view-transition-main-duration: 0;
  }
}