:root {
  --flick-motion-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
}

.flick-reveal-item {
  opacity: 0;
  transform: translate3d(0, 28px, 0);
  transition:
    opacity 560ms var(--flick-motion-ease-out) var(--flick-reveal-delay, 0ms),
    transform 560ms var(--flick-motion-ease-out) var(--flick-reveal-delay, 0ms);
  will-change: opacity, transform;
}

.flick-reveal-item.flick-reveal-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.flick-accent-reveal-word {
  display: inline-block;
  opacity: 0;
  transform: translate3d(0, 28px, 0);
  transition:
    opacity 560ms var(--flick-motion-ease-out),
    transform 560ms var(--flick-motion-ease-out);
  will-change: opacity, transform;
}

.flick-accent-reveal-visible .flick-accent-reveal-word {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

[data-flick-cal-mount],
[data-flick-cal-fallback] {
  transition: opacity 300ms var(--flick-motion-ease-out);
}

[data-flick-cal-mount] {
  opacity: 0;
}

[data-flick-cal-fallback] {
  opacity: 1;
}

[data-flick-cal-shell].flick-cal-ready [data-flick-cal-mount] {
  opacity: 1;
}

[data-flick-cal-shell].flick-cal-ready [data-flick-cal-fallback] {
  opacity: 0;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .flick-reveal-item {
    transform: none;
    transition-delay: 0ms !important;
    transition-duration: 180ms !important;
    transition-property: opacity !important;
    transition-timing-function: ease-out !important;
  }

  .flick-accent-reveal-word {
    transform: none;
    transition-delay: 0ms !important;
    transition-duration: 180ms !important;
    transition-property: opacity !important;
    transition-timing-function: ease-out !important;
  }

  [data-flick-cal-mount],
  [data-flick-cal-fallback] {
    transition-duration: 100ms !important;
    transition-property: opacity !important;
    transition-timing-function: ease-out !important;
  }
}