/* A short crossfade between documents; keep the shared header stationary. */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }

  ::view-transition { pointer-events: none; }

  header.site-header { view-transition-name: oyne-header; }

  ::view-transition-group(root),
  ::view-transition-group(oyne-header) {
    animation-duration: 240ms;
    animation-timing-function: cubic-bezier(.22, .61, .36, 1);
  }

  ::view-transition-old(root) {
    animation: oyne-page-out 180ms ease-out both;
    mix-blend-mode: normal;
  }

  ::view-transition-new(root) {
    animation: oyne-page-in 240ms ease-out both;
    mix-blend-mode: normal;
  }

  ::view-transition-old(oyne-header) { animation: none; opacity: 0; }
  ::view-transition-new(oyne-header) { animation: none; }

  @keyframes oyne-page-out { to { opacity: 0; } }
  @keyframes oyne-page-in { from { opacity: 0; } }
}

@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
}