style(motion): add strict animations and fix layout properties

- Change ReadingProgress and RouteTable to use transform (scaleX/scaleY) instead of width/height
- Convert existing easing functions to 200ms cubic-bezier(.2,0,0,1)
- Document animation purpose with CSS comments
- Add guide panel swap, review desk detail swap, and tally pop animations
- Implement prefers-reduced-motion for all new states
This commit is contained in:
Marcos Paulo
2026-09-05 23:13:59 +00:00
parent 71c74fb7f1
commit 9ca3f48def
10 changed files with 66 additions and 12 deletions
@@ -235,7 +235,8 @@ const packageFiles: PackageFile[] = [
}
.package-preview.is-swapping {
animation: package-preview-in 0.34s ease both;
/* purpose: review-desk detail swap on selection (state change) */
animation: package-preview-in 200ms cubic-bezier(0.2, 0, 0, 1) both;
}
@keyframes package-preview-in {