::view-transition-group(wizard-step){overflow:clip}[data-wizard-direction=forward]::view-transition-old(wizard-step){animation:.3s ease-out forwards slideOutLeft}[data-wizard-direction=forward]::view-transition-new(wizard-step){animation:.3s ease-out forwards slideInFromRight}[data-wizard-direction=back]::view-transition-old(wizard-step){animation:.3s ease-out forwards slideOutRight}[data-wizard-direction=back]::view-transition-new(wizard-step){animation:.3s ease-out forwards slideInFromLeft}@keyframes slideOutLeft{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-30%)}}@keyframes slideInFromRight{0%{opacity:0;transform:translate(30%)}to{opacity:1;transform:translate(0)}}@keyframes slideOutRight{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(30%)}}@keyframes slideInFromLeft{0%{opacity:0;transform:translate(-30%)}to{opacity:1;transform:translate(0)}}@media (prefers-reduced-motion:reduce){[data-wizard-direction=forward]::view-transition-old(wizard-step){animation:none}[data-wizard-direction=forward]::view-transition-new(wizard-step){animation:none}[data-wizard-direction=back]::view-transition-old(wizard-step){animation:none}[data-wizard-direction=back]::view-transition-new(wizard-step){animation:none}}