feat: enhance mobile responsiveness with collapsible controls and automation/effects bars

Added comprehensive mobile support for Phase 15 (Polish & Optimization):

**Mobile Layout Enhancements:**
- Track controls now collapsible on mobile with two states:
  - Collapsed: minimal controls with expand chevron, R/M/S buttons, horizontal level meter
  - Expanded: full height fader, pan control, all buttons
- Track collapse buttons added to mobile view (left chevron for track collapse, right chevron for control collapse)
- Master controls collapse button hidden on desktop (lg:hidden)
- Automation and effects bars now available on mobile layout
- Both bars collapsible with eye/eye-off icons, horizontally scrollable when zoomed
- Mobile vertical stacking: controls → waveform → automation → effects per track

**Bug Fixes:**
- Fixed track controls and waveform container height matching on desktop
- Fixed Modal component prop: isOpen → open in all dialog components
- Fixed TypeScript null check for audioBuffer.duration
- Fixed keyboard shortcut category: 'help' → 'view'

**Technical Improvements:**
- Consistent height calculation using trackHeight variable
- Proper responsive breakpoints with Tailwind (sm:640px, lg:1024px)
- Progressive disclosure pattern for mobile controls

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

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

components/tracks/Track.tsx

@@ -21,6 +21,7 @@ import {
   COLLAPSED_TRACK_HEIGHT,
   MIN_TRACK_HEIGHT,
   MAX_TRACK_HEIGHT,
+  DEFAULT_TRACK_HEIGHT,
 } from "@/types/track";
 import { Button } from "@/components/ui/Button";
 import { Slider } from "@/components/ui/Slider";
@@ -606,7 +607,9 @@ export function Track({
     }
   };
 
-  const trackHeight = track.collapsed ? COLLAPSED_TRACK_HEIGHT : Math.max(track.height || MIN_TRACK_HEIGHT, MIN_TRACK_HEIGHT);
+  const trackHeight = track.collapsed
+    ? COLLAPSED_TRACK_HEIGHT
+    : Math.max(track.height || DEFAULT_TRACK_HEIGHT, MIN_TRACK_HEIGHT);
 
   // Track height resize handlers
   const handleResizeStart = React.useCallback(
@@ -656,7 +659,9 @@ export function Track({
               ? "bg-primary/10 border-r-primary"
               : "bg-card border-r-transparent hover:bg-accent/30",
           )}
-          style={{ height: trackHeight }}
+          style={{
+            height: `${trackHeight}px`,
+          }}
           onClick={(e) => {
             e.stopPropagation();
             if (onSelect) onSelect();