@media (prefers-reduced-motion: no-preference) {
  .rk-header { view-transition-name: rekon-header; }
  ::view-transition-group(root) { animation-duration: 560ms; }
  ::view-transition-image-pair(root) { isolation: isolate; }
  ::view-transition-old(root), ::view-transition-new(root) { mix-blend-mode: normal; }
  ::view-transition-old(root) { animation: rekon-page-out 560ms cubic-bezier(.31,.02,.22,1) both; }
  ::view-transition-new(root) { animation: rekon-page-in 560ms cubic-bezier(.23,.65,.24,1) both; }
  ::view-transition-group(rekon-header) { animation-duration: 300ms; }
  ::view-transition-old(rekon-header), ::view-transition-new(rekon-header) { animation-duration: 300ms; }
}
@keyframes rekon-page-out {
  to { transform: translate3d(-12px,0,0); filter: brightness(.93); }
}
@keyframes rekon-page-in {
  from { clip-path: inset(0 0 0 100%); transform: translate3d(9px,0,0); }
  to { clip-path: inset(0); transform: none; }
}