/* fx.css · appear/fade-up, rises a little and fades in · owner: Lizzy East · all rights reserved */

/* The unanimated style is the finished look. Only a block still to come, and only
   while the core says motion is allowed, starts elsewhere. */
html.fx-armed [data-fx~="appear/fade-up"].is-pending {
  opacity: 0;
  translate: 0 var(--fx-distance);
}
html.fx-armed [data-fx~="appear/fade-up"].is-in {
  transition: opacity var(--fx-dur) var(--fx-ease), translate var(--fx-dur) var(--fx-ease);
  transition-delay: calc(var(--fx-delay, 0ms) + var(--fx-i, 0) * var(--fx-stagger));
}