fix: collapsible bottom sheet + pinch-to-zoom on mobile

- Bottom sheet starts collapsed (handle bar only), swipe up to expand
- Tabs visible when collapsed in puzzle view, content hidden
- Swipe down or tap handle to collapse
- Add usePinchZoom hook: two-finger pinch gesture controls canvas zoom
- Pinch zoom wired into both Sandbox and Puzzle View canvases

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

src/App.jsx

@@ -11,6 +11,7 @@ import PresetModal from './components/PresetModal.jsx';
 import BottomSheet from './components/BottomSheet.jsx';
 import { CHIPTUNE_PRESET } from './presets/chiptune.js';
 import { useIsMobile } from './hooks/useIsMobile.js';
+import { usePinchZoom } from './hooks/usePinchZoom.js';
 import { getModulesByCategory } from './engine/moduleRegistry.js';
 
 export default function App({ onSwitchToGame }) {
@@ -24,6 +25,11 @@ export default function App({ onSwitchToGame }) {
   const isMobile = useIsMobile();
   const [menuOpen, setMenuOpen] = useState(false);
 
+  // Pinch-to-zoom on mobile
+  const getZoom = useCallback(() => state.zoom, []);
+  const setZoom = useCallback((z) => { state.zoom = z; emit(); }, []);
+  usePinchZoom(containerRef, getZoom, setZoom);
+
   // Subscribe to state changes
   useEffect(() => {
     const unsub = subscribe(() => forceUpdate(n => n + 1));