/* 23/09: vloeiende overgang tussen de schermen van de app (startkeuze → vloer / bureau / controleren) */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: 220ms cubic-bezier(.4,0,1,1) both overgang-uit; }
::view-transition-new(root) { animation: 320ms cubic-bezier(.23,1,.32,1) both overgang-in; }
@keyframes overgang-uit { to { opacity: 0; transform: translateX(-24px); } }
@keyframes overgang-in { from { opacity: 0; transform: translateX(32px); } }
@supports not (view-transition-name: none) { body { animation: overgang-in 320ms cubic-bezier(.23,1,.32,1) both; } }
@media (prefers-reduced-motion: reduce) { ::view-transition-old(root), ::view-transition-new(root), body { animation: none !important; } }
/* terug: spiegelbeeld — het nieuwe scherm komt van links */
html:active-view-transition-type(terug)::view-transition-old(root) { animation-name: overgang-uit-terug; }
html:active-view-transition-type(terug)::view-transition-new(root) { animation-name: overgang-in-terug; }
@keyframes overgang-uit-terug { to { opacity: 0; transform: translateX(24px); } }
@keyframes overgang-in-terug { from { opacity: 0; transform: translateX(-32px); } }