The flicker wasn't an animation bug

The first version had the right easing and still flickered between cards. Tuning the transition only made the gap more polished. The problem lived one level below animation: the next surface did not exist soon enough.

Continuity starts before motion

A swipe has an outgoing object and an incoming one. If the next card mounts only after the answer is committed, there is a frame where the scene has no stable successor. On a fast gesture that absence reads as a flash, even when React and the browser are doing exactly what the code asked.

The fix is two persistent card slots. While one slot is active, the other already contains the next statement underneath it. After the outgoing card settles, the roles swap. Neither layer needs to be recreated at the most visually sensitive moment.

Inputs converge before state changes

Swipe, buttons, and arrow keys all produce the same semantic answer. Gesture code is allowed to measure distance and velocity, but it does not decide the game result by itself. That decision happens once, after the input has been normalized.

This removes a common class of near-duplicates: a keyboard path that forgets a lock, a button path with different timing, or a swipe path that advances twice. One transition gate rejects repeated input until the active card has cleared.

Motion has to preserve cause

The card leaves in the direction of the gesture because that direction is evidence of the action. The card underneath moves less and later; it is responding to the space that opened, not competing for attention.

On reduced motion, the answer and progression remain clear without the spatial travel. The system preserves consequence, not spectacle.

The two-slot model is intentionally narrow. It is excellent for a linear deck where only the current and next items matter. It would be the wrong abstraction for arbitrary back navigation or a large virtualized stack. Those cases need history and identity, not a clever swap.

The sharpest animation work often happens before an easing curve is chosen. First make the scene continuous. Then decide how it should move.