show only toe dots during gameplay, hide full skeleton

Add drawMode option to usePoseLoop. Game page uses 'toes-only' to
show just landmarks 31/32 as bright cyan dots. Debug app keeps the
full skeleton by default.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

src/pages/GamePage.tsx

@@ -49,6 +49,7 @@ export function GamePage() {
     settings,
     null,
     { onStep: (direction) => arrowGameRef.current?.handleStep(direction) },
+    'toes-only',
   )
 
   const gameReady = calibrationStatus === 'ready'

src/pose/usePoseLoop.ts

@@ -23,6 +23,8 @@ export interface PoseLoopState {
   videoSource: VideoSource | null
 }
 
+export type DrawMode = 'full' | 'toes-only'
+
 export function usePoseLoop(
   videoRef: React.RefObject<HTMLVideoElement | null>,
   canvasRef: React.RefObject<HTMLCanvasElement | null>,
@@ -30,6 +32,7 @@ export function usePoseLoop(
   settings: PoseSettings,
   fileUrl: string | null,
   callbacks: PoseLoopCallbacks,
+  drawMode: DrawMode = 'full',
 ): PoseLoopState {
   const [loading, setLoading] = useState(true)
   const [error, setError] = useState<string | null>(null)
@@ -145,15 +148,24 @@ export function usePoseLoop(
 
             // Draw pose landmarks
             for (const landmarks of result.landmarks) {
-              drawingUtils.drawLandmarks(landmarks, {
-                radius: 4,
-                color: '#00FF00',
-                fillColor: '#00FF0080',
-              })
-              drawingUtils.drawConnectors(landmarks, PoseLandmarker.POSE_CONNECTIONS, {
-                color: '#00FFFF',
-                lineWidth: 2,
-              })
+              if (drawMode === 'toes-only') {
+                const toes = [31, 32].map(i => landmarks[i]).filter(Boolean)
+                drawingUtils.drawLandmarks(toes, {
+                  radius: 10,
+                  color: '#00FFCC',
+                  fillColor: '#00FFCC',
+                })
+              } else {
+                drawingUtils.drawLandmarks(landmarks, {
+                  radius: 4,
+                  color: '#00FF00',
+                  fillColor: '#00FF0080',
+                })
+                drawingUtils.drawConnectors(landmarks, PoseLandmarker.POSE_CONNECTIONS, {
+                  color: '#00FFFF',
+                  lineWidth: 2,
+                })
+              }
             }
 
             // Debug 3D overlay