@view-transition { navigation: auto; }
::view-transition-group(chosen-product) { animation-duration: 750ms; animation-timing-function: cubic-bezier(.22,.8,.25,1); }
::view-transition-old(chosen-product), ::view-transition-new(chosen-product) { height:100%; object-fit:contain; mix-blend-mode:normal; }
::view-transition-old(root) { animation: scene-out 250ms ease both; }
::view-transition-new(root) { animation: scene-in 550ms ease both; }
@keyframes scene-out { to { opacity:0; } }
@keyframes scene-in { from { opacity:0; } to { opacity:1; } }
@media (hover:hover) and (pointer:fine) { .product,.other-card { transition:rotate 180ms ease-out,translate 180ms ease-out; } }
@media (prefers-reduced-motion:reduce) { @view-transition { navigation:none; } .product,.other-card { rotate:none!important;translate:none!important;transition:none!important; } }