Screen Transition Part 1

Basics: stage 470×222px, background #13131C, all coordinates in px from the stage's top-left, everything clipped to the stage (its two top corners are rounded with radius 40px; the bottom corners are square). App window (a wide made-up app that nearly fills the stage): rr(20, 8, 430, 206, 18) filled #171626 with a shadow rgba(0,0,0,0.55), blur 16, offset y 4. Everything of the app is drawn clipped to that rounded rect, in window-local coordinates (local (0, 0) = stage (20, 8); local size 430×206). After the app, stroke the same rounded rect with a 1.5px rgba(255,255,255,0.16) border (a thin bezel). Fingers are drawn last, in stage coordinates, not clipped to the window.

The detail page slides in from the right over the list; the list shifts 30% to the left and dims (and the reverse when going back). 
- s = pos(u).
- If s < 1: screen A translated by (−129·s, 0) (= −0.3·430·s), then dim(0.4·s) over the whole window.
- If s > 0: translated by (430·(1 − s), 0): fillRect(0, 0, 430, 206) #171626 with a shadow rgba(0,0,0,0.6) blur 16 (no offset; it falls on the list at the page's left edge), then screen B.
- Fingers: both taps (Basics). Draw order: A, dim, B, fingers.