feat: add playback speed control (0.25x - 2x)

Implemented variable playback speed functionality:
- Added playbackRate state and ref to useMultiTrackPlayer (0.25x - 2x range)
- Applied playback rate to AudioBufferSourceNode.playbackRate
- Updated timing calculations to account for playback rate
- Real-time playback speed adjustment for active playback
- Dropdown UI control in PlaybackControls with preset speeds
- Integrated changePlaybackRate function through AudioEditor

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

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

components/editor/AudioEditor.tsx

@@ -300,6 +300,8 @@ export function AudioEditor() {
     toggleLoop,
     setLoopPoints,
     setLoopFromSelection,
+    playbackRate,
+    changePlaybackRate,
   } = useMultiTrackPlayer(tracks, masterVolume, handleAutomationRecording);
 
   // Reset latch triggered state when playback stops
@@ -1983,6 +1985,8 @@ export function AudioEditor() {
             loopEnd={loopEnd}
             onToggleLoop={toggleLoop}
             onSetLoopPoints={setLoopPoints}
+            playbackRate={playbackRate}
+            onPlaybackRateChange={changePlaybackRate}
           />
         </div>
       </div>

components/editor/PlaybackControls.tsx

@@ -36,6 +36,8 @@ export interface PlaybackControlsProps {
   loopEnd?: number;
   onToggleLoop?: () => void;
   onSetLoopPoints?: (start: number, end: number) => void;
+  playbackRate?: number;
+  onPlaybackRateChange?: (rate: number) => void;
 }
 
 export function PlaybackControls({
@@ -69,6 +71,8 @@ export function PlaybackControls({
   loopEnd = 0,
   onToggleLoop,
   onSetLoopPoints,
+  playbackRate = 1.0,
+  onPlaybackRateChange,
 }: PlaybackControlsProps) {
   const handlePlayPause = () => {
     if (isPlaying) {
@@ -276,6 +280,26 @@ export function PlaybackControls({
               </Button>
             </div>
           )}
+
+          {/* Playback Speed Control */}
+          {onPlaybackRateChange && (
+            <div className="flex items-center gap-1 border-l border-border pl-2 ml-1">
+              <select
+                value={playbackRate}
+                onChange={(e) => onPlaybackRateChange(parseFloat(e.target.value))}
+                className="h-7 px-2 py-0 bg-background border border-border rounded text-xs cursor-pointer hover:bg-muted/50 focus:outline-none focus:ring-2 focus:ring-ring"
+                title="Playback Speed"
+              >
+                <option value={0.25}>0.25x</option>
+                <option value={0.5}>0.5x</option>
+                <option value={0.75}>0.75x</option>
+                <option value={1.0}>1x</option>
+                <option value={1.25}>1.25x</option>
+                <option value={1.5}>1.5x</option>
+                <option value={2.0}>2x</option>
+              </select>
+            </div>
+          )}
         </div>
       </div>