feat(flashcards): enable unbounded drag and position persistence

Made interactive flashcards a fun easter egg by:
- Changed overflow from 'hidden' to 'visible' to allow cards to be
  thrown anywhere on the page, not just within container bounds
- Fixed position persistence: cards now stay exactly where dropped
  instead of snapping back to pickup location
- Updated currentPositionRef immediately on drop before applying
  momentum physics

Cards can now be dragged and tossed freely around the entire page
and will maintain their position after being dropped.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

apps/web/src/components/InteractiveFlashcards.tsx

@@ -77,7 +77,7 @@ export function InteractiveFlashcards() {
         maxW: '1200px',
         mx: 'auto',
         height: { base: '400px', md: '500px' },
-        overflow: 'hidden',
+        overflow: 'visible',
         bg: 'rgba(0, 0, 0, 0.3)',
         rounded: 'xl',
         border: '1px solid rgba(255, 255, 255, 0.1)',
@@ -196,6 +196,10 @@ function DraggableCard({ card }: DraggableCardProps) {
         // On release, reset transform origin to center
         setTransformOrigin('center center')
 
+        // Update current position to where the card was dropped
+        currentPositionRef.current.x = currentPositionRef.current.x + mx
+        currentPositionRef.current.y = currentPositionRef.current.y + my
+
         // On release, apply momentum with decay physics
         const throwVelocityX = lastVelocityRef.current.vx * 1000
         const throwVelocityY = lastVelocityRef.current.vy * 1000
@@ -205,12 +209,12 @@ function DraggableCard({ card }: DraggableCardProps) {
 
         api.start({
           x: {
-            from: currentPositionRef.current.x + mx,
+            from: currentPositionRef.current.x,
             velocity: throwVelocityX,
             decay: true,
           },
           y: {
-            from: currentPositionRef.current.y + my,
+            from: currentPositionRef.current.y,
             velocity: throwVelocityY,
             decay: true,
           },
@@ -218,7 +222,7 @@ function DraggableCard({ card }: DraggableCardProps) {
           rotation: throwAngle + 90, // Card aligns with throw direction
           config: config.wobbly,
           onChange: (result) => {
-            // Update current position as card settles
+            // Continue updating position as card settles with momentum
             if (result.value.x !== undefined) {
               currentPositionRef.current.x = result.value.x
             }