@keyframes pp-route-out {
  from { opacity: 1; transform: translateY(0); }
  to { opacity: .2; transform: translateY(-5px); }
}

@keyframes pp-route-in {
  from { opacity: .2; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: no-preference) {
  html.pp-route-leaving body {
    animation: pp-route-out 140ms ease-in both;
  }

  html.pp-route-entering body {
    animation: pp-route-in 220ms ease-out both;
  }
}