/* Content stays visible unless the animation controller is running. */
.entrance-pending { opacity: 0; }
.entrance-entering {
  animation: ksoft-entrance 650ms cubic-bezier(.22, 1, .36, 1) var(--entrance-delay, 0ms) both;
}
@keyframes ksoft-entrance {
  from { opacity: 0; transform: translate3d(0, 22px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@media (max-width: 640px) {
  .entrance-entering { animation-duration: 500ms; }
  @keyframes ksoft-entrance {
    from { opacity: 0; transform: translate3d(0, 14px, 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
  }
}
@media (prefers-reduced-motion: reduce), print {
  .entrance-pending, .entrance-entering { opacity: 1; animation: none; transform: none; }
}