chore: stage all pending work — caption styling, media server, processing modal, docs, summaries

Includes:
- Extended caption styling (font, shadow, dimmed color, bg toggle)
- Media server, subtitle downloader, VTT parser, processing modal
- Waveform tiers, thumbnail/timeline improvements, transport controls
- Hybrid download model, dependency management, clip export enhancements
- 21 chat summaries, 2 implementation plans, 2 design specs

Co-authored-by: Cursor <cursoragent@cursor.com>

src/lib/components/TransportControls.svelte

@@ -8,11 +8,35 @@
     seekBy,
     stepFrame,
     togglePlayPause,
+    setVolume,
+    setMuted,
+    getVolume,
+    getMuted,
     type TransportKeyAction,
   } from '$lib/transport/playback';
 
   let hasKeyframes = $derived(session.keyframePositions.length > 0);
 
+  let volume = $state(1);
+  let isMuted = $state(false);
+
+  function toggleMute() {
+    isMuted = !isMuted;
+    setMuted(isMuted);
+  }
+
+  function handleVolumeChange(e: Event) {
+    const val = parseFloat((e.target as HTMLInputElement).value);
+    volume = val;
+    if (val > 0 && isMuted) {
+      isMuted = false;
+    }
+    setVolume(val);
+    if (val > 0) {
+      setMuted(false);
+    }
+  }
+
   export function handleKeyAction(action: TransportKeyAction) {
     runTransportAction(action, markInPoint, markOutPoint);
   }
@@ -53,6 +77,32 @@
     <span class="total">{formatTime(session.duration)}</span>
   </div>
 
+  <div class="volume-controls">
+    <button
+      class="vol-btn"
+      onclick={toggleMute}
+      title={isMuted ? 'Unmute' : 'Mute'}
+      type="button"
+    >
+      {#if isMuted || volume === 0}
+        🔇
+      {:else if volume < 0.5}
+        🔉
+      {:else}
+        🔊
+      {/if}
+    </button>
+    <input
+      type="range"
+      class="vol-slider"
+      min="0"
+      max="1"
+      step="0.05"
+      value={isMuted ? 0 : volume}
+      oninput={handleVolumeChange}
+    />
+  </div>
+
   <div class="mark-buttons">
     <button
       class="mark-btn"
@@ -114,6 +164,34 @@
     color: var(--text-secondary);
   }
 
+  .volume-controls {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+  }
+
+  .vol-btn {
+    background: var(--bg-tertiary);
+    border: 1px solid var(--border);
+    border-radius: 4px;
+    padding: 3px 6px;
+    font-size: 14px;
+    cursor: pointer;
+    line-height: 1;
+    color: var(--text-secondary);
+  }
+
+  .vol-btn:hover {
+    color: var(--text-primary);
+  }
+
+  .vol-slider {
+    width: 80px;
+    height: 4px;
+    accent-color: #89b4fa;
+    cursor: pointer;
+  }
+
   .mark-buttons {
     margin-left: auto;
     display: flex;