:root{--view-transition-phase-duration:.3s;--view-transition-duration:calc(2 * var(--view-transition-phase-duration));--view-transition-distance:24px}@keyframes fade-out-upwards{to{opacity:0;transform:translateY(calc(-1 * var(--view-transition-distance)))}}@keyframes fade-in-downwards{0%{opacity:0;transform:translateY(calc(-1 * var(--view-transition-distance)))}}.animation-container--transitioning{view-transition-name:animation-container}::view-transition-group(root){animation-duration:var(--view-transition-duration);animation-timing-function:ease}::view-transition-old(root){animation-duration:var(--view-transition-duration);animation-timing-function:ease}::view-transition-new(root){animation-duration:var(--view-transition-duration);animation-timing-function:ease}::view-transition-group(animation-container){animation-duration:var(--view-transition-duration);animation-timing-function:ease}::view-transition-old(animation-container){object-fit:none;object-position:top left;height:auto}::view-transition-new(animation-container){object-fit:none;object-position:top left;height:auto}::view-transition-old(animation-container){animation:fade-out-upwards var(--view-transition-phase-duration) ease-in both}::view-transition-new(animation-container){animation:fade-in-downwards var(--view-transition-phase-duration) ease-out var(--view-transition-phase-duration) both}@media (prefers-reduced-motion:reduce){::view-transition-group(root){animation:none}::view-transition-old(root){animation:none}::view-transition-new(root){animation:none}::view-transition-group(animation-container){animation:none}::view-transition-old(animation-container){animation:none}::view-transition-new(animation-container){animation:none}}