feat(offline): play downloaded video, and drain the offline sync queue (0.4.6)

Bundles this session's work plus the concurrent search/offline/player changes.
Every gate passes on the combined tree: 885 frontend tests, 610 Rust tests,
clippy clean, boundary clean, trace coverage 86%.

Offline video playback — four separate defects, each of which alone stopped it:

  DR-133  A completed download's file_path is already absolute (the worker
          rewrites it on completion), but the player rooted it a second time and
          handed the webview /data/user/0/app//data/user/0/app/videos/x.mp4.
  DR-134  The asset protocol was never enabled: no protocol-asset feature and no
          assetProtocol config, so convertFileSrc produced URLs nothing answered.
          Also silently defeated the cached-thumbnail path, which fails soft to
          the server copy and hid it whenever the server was reachable.
  DR-137  Tauri's asset protocol answers a range-less request by reading the
          whole file into memory, and only advertises Accept-Ranges from inside
          its range branch, so the first request never learns ranges exist.
          Chromium gave up with PIPELINE_ERROR_READ after ~31s. Local media is
          now served by a loopback HTTP server: bounded 4 MiB chunks streamed
          from the file handle, every response length-delimited, and a range-less
          request answered with one chunk rather than the file. Confined by a
          per-session token and to the app data directory, because loopback is
          shared between apps on Android.
  DR-138  Release builds set usesCleartextTraffic=false, so Android rejected the
          request to that server before any I/O. A network-security-config
          exempts 127.0.0.1 only; a remote server must still be HTTPS.

Downloads:

  DR-135  download_item never records media_type and the reconnect resolver read
          that NULL as 'audio', so a movie queued from a media card had its URL
          resolved by get_audio_stream_url and completed as an audio-only
          transcode. The item's own type now decides.
  DR-136  Rows already downloaded that way are requeued on reconnect, since
          prevention alone leaves them reading "downloaded" and still unplayable.

Known limitation: a download taken at `original` quality is a byte copy of the
source, so it can be any container. One such file is an AVI holding XVID, which
the webview cannot play in any case — the media server serves it correctly and
Chromium refuses it. That needs either a transcoded download preset or the
native ExoPlayer surface work, and is not addressed here.

Also fixes two ID collisions between concurrent work: DR-143 defined twice
(search vs offline gate) and UT-131 defined twice (Episode Focus hero vs channel
cap). The search requirement is now DR-147 and the channel-cap test UT-141, with
their code references and matrix rows updated.

src/lib/components/sync/PendingSyncList.svelte

@@ -0,0 +1,137 @@
+<!--
+  What the "N waiting to sync" badge actually stands for.
+
+  These are outgoing changes — watch positions, watched flags — made while the
+  server was unreachable and still waiting to reach Jellyfin. They are *not*
+  downloads, which is where the badge used to send people looking: the Downloads
+  page lists the `downloads` table and structurally cannot show these.
+
+  Rows push themselves on reconnect (DR-131); "Sync now" only asks for that to
+  happen immediately.
+
+  TRACES: UR-025 | DR-132
+-->
+<script lang="ts">
+  import { onMount } from "svelte";
+  import { commands, type SyncQueueItem } from "$lib/api/bindings";
+  import { syncService } from "$lib/services/syncService";
+  import { pendingSyncCount } from "$lib/stores/appState";
+  import { isConnected } from "$lib/stores/connectivity";
+  import {
+    describeOperation,
+    describeSubject,
+    isStuck,
+    summarize,
+    sortForDisplay,
+  } from "$lib/services/pendingSync.logic";
+
+  let items = $state<SyncQueueItem[]>([]);
+  let loading = $state(true);
+  let syncing = $state(false);
+  let error = $state<string | null>(null);
+  let lastResult = $state<string | null>(null);
+
+  const summary = $derived(summarize(items));
+
+  export async function refresh() {
+    try {
+      loading = true;
+      error = null;
+      items = sortForDisplay(await syncService.getPending());
+      pendingSyncCount.set(items.length);
+    } catch (err) {
+      error = err instanceof Error ? err.message : String(err);
+    } finally {
+      loading = false;
+    }
+  }
+
+  onMount(refresh);
+
+  async function syncNow() {
+    try {
+      syncing = true;
+      error = null;
+      const report = await commands.syncProcessPending();
+      lastResult =
+        report.pushed > 0
+          ? `Sent ${report.pushed} update${report.pushed === 1 ? "" : "s"}.`
+          : "Nothing could be sent — the server is still unreachable.";
+      await refresh();
+    } catch (err) {
+      error = err instanceof Error ? err.message : String(err);
+    } finally {
+      syncing = false;
+    }
+  }
+
+  function formatQueuedAt(createdAt: string | null): string {
+    if (!createdAt) return "";
+    const parsed = Date.parse(createdAt);
+    return Number.isNaN(parsed) ? "" : new Date(parsed).toLocaleString();
+  }
+</script>
+
+<div class="space-y-4">
+  <p class="text-sm text-gray-400">
+    Changes made while the server was unreachable — watch positions and watched
+    flags — waiting to reach Jellyfin. They send themselves when the server comes
+    back. This is not the download queue; downloaded media lives under Downloads.
+  </p>
+
+  {#if loading}
+    <p class="py-6 text-center text-sm text-gray-400">Loading queued updates…</p>
+  {:else if items.length === 0}
+    <p class="py-6 text-center text-sm text-gray-500">Everything is synced.</p>
+  {:else}
+    <div class="flex flex-wrap items-center gap-3">
+      <button
+        onclick={syncNow}
+        disabled={syncing || !$isConnected}
+        class="rounded-lg bg-[var(--color-jellyfin)] px-4 py-2 text-sm font-medium text-white transition hover:opacity-90 disabled:cursor-not-allowed disabled:opacity-40"
+        title={$isConnected ? "Send these now" : "Needs a reachable server"}
+      >
+        {syncing ? "Sending…" : "Sync now"}
+      </button>
+      {#if summary.stuck > 0}
+        <span class="text-xs text-amber-400">
+          {summary.stuck} failed and will be retried
+        </span>
+      {/if}
+      {#if lastResult}
+        <span class="text-xs text-gray-400">{lastResult}</span>
+      {/if}
+    </div>
+
+    <ul class="space-y-2">
+      {#each items as item (item.id)}
+        <li
+          class="rounded-lg border-l-4 bg-[var(--color-surface)] p-3 {isStuck(item)
+            ? 'border-amber-500/60'
+            : 'border-gray-600/60'}"
+        >
+          <div class="flex items-start justify-between gap-3">
+            <div class="min-w-0">
+              <p class="truncate text-sm font-medium text-white">
+                {describeOperation(item.operation)}
+              </p>
+              <p class="truncate text-xs text-gray-400">{describeSubject(item)}</p>
+              {#if item.errorMessage}
+                <p class="mt-1 text-xs text-amber-400">
+                  {item.errorMessage}{item.retryCount > 0 ? ` (attempt ${item.retryCount})` : ""}
+                </p>
+              {/if}
+            </div>
+            <span class="shrink-0 text-[11px] text-gray-500">
+              {formatQueuedAt(item.createdAt)}
+            </span>
+          </div>
+        </li>
+      {/each}
+    </ul>
+  {/if}
+
+  {#if error}
+    <p class="text-sm text-red-400">{error}</p>
+  {/if}
+</div>

src/lib/components/sync/PendingSyncModal.svelte

@@ -0,0 +1,57 @@
+<!--
+  Modal wrapper for the pending-sync queue, opened from the offline banner's
+  badge so the count is answerable where the user reads it.
+
+  TRACES: UR-025 | DR-132
+-->
+<script lang="ts">
+  import PendingSyncList from "./PendingSyncList.svelte";
+
+  interface Props {
+    isOpen: boolean;
+    onClose: () => void;
+  }
+
+  let { isOpen, onClose }: Props = $props();
+
+  function handleBackdropClick(event: MouseEvent) {
+    if (event.target === event.currentTarget) onClose();
+  }
+</script>
+
+{#if isOpen}
+  <div
+    class="fixed inset-0 z-50 flex items-end justify-center bg-black/60 p-0 sm:items-center sm:p-4"
+    onclick={handleBackdropClick}
+    onkeydown={(e) => { if (e.key === "Escape") onClose(); }}
+    role="dialog"
+    aria-modal="true"
+    aria-labelledby="pending-sync-title"
+    tabindex="-1"
+  >
+    <div
+      class="flex max-h-[80vh] w-full flex-col rounded-t-2xl bg-[var(--color-surface)] shadow-2xl sm:max-h-[70vh] sm:max-w-lg sm:rounded-2xl"
+      onclick={(e) => e.stopPropagation()}
+      role="none"
+    >
+      <div class="flex items-center justify-between border-b border-gray-800 px-6 py-4">
+        <h2 id="pending-sync-title" class="text-lg font-semibold text-white">
+          Waiting to sync
+        </h2>
+        <button
+          onclick={onClose}
+          class="-m-2 p-2 text-gray-400 transition-colors hover:text-white"
+          aria-label="Close"
+        >
+          <svg class="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+          </svg>
+        </button>
+      </div>
+
+      <div class="flex-1 overflow-y-auto p-6">
+        <PendingSyncList />
+      </div>
+    </div>
+  </div>
+{/if}