feat(web): every paged list loads as you scroll; Liked becomes tabs (#5416)

Preference 172: no "Load more" buttons. Eight remained, on Liked (three
sections), the three Search overflow pages, Genres and Years.

- ListContinuation: the one bottom-of-list block. It loads the next page
  ahead of the reader, announces "Loading more…" through aria-live, shows an
  optional end line, and on a failed page shows the error with Try again,
  dropping the sentinel so a dead endpoint isn't re-hit on every scroll.
  Used on all ten paged lists, including the four that already autoloaded.
- A failed next page no longer replaces the list. TanStack sets isError for
  it, so the page-level error branches now apply only to a failed first
  load. Genres and Years did the same with their own loader; a later
  page's failure now keeps the grid.
- Liked: Artists | Albums | Tracks tabs (operator's choice). Stacked, a
  long Artists list loading as you scroll would bury the other two. It
  opens on the first tab that has likes.
- TabStrip: the in-page tab strip, now shared by Liked, Playback errors
  and Requests.
- test-utils/intersectionObserver: a stand-in so tests can scroll to the end.

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

web/src/routes/admin/requests/+page.svelte

@@ -3,6 +3,7 @@
   import { Disc3, Album, Music2, Check, X, SlidersHorizontal } from 'lucide-svelte';
   import { useQueryClient } from '@tanstack/svelte-query';
   import RowActionsMenu, { type RowAction } from '#lib/components/RowActionsMenu.svelte';
+  import TabStrip from '#lib/components/TabStrip.svelte';
   import {
     createAdminRequestsQuery,
     createQualityProfilesQuery,
@@ -166,34 +167,15 @@
     <p class="text-text-secondary">Approve or set aside what users have asked for.</p>
   </header>
 
-  <nav aria-label="Request status filters" class="border-b border-border">
-    <ul class="flex gap-2">
-      {#each tabs as tab (tab.status)}
-        {@const isActive = activeStatus === tab.status}
-        <li>
-          <button
-            type="button"
-            role="tab"
-            aria-selected={isActive}
-            class="border-b-2 px-3 py-2 text-sm transition-colors {isActive
-              ? 'border-accent text-text-primary'
-              : 'border-transparent text-text-secondary hover:text-text-primary'}"
-            onclick={() => (activeStatus = tab.status)}
-          >
-            {tab.label}
-            {#if isActive}
-              <span
-                class="ml-1.5 inline-flex items-center rounded-full bg-accent-tint px-2 py-0.5 text-xs text-accent-fg"
-                data-testid="active-tab-count"
-              >
-                {rows.length}
-              </span>
-            {/if}
-          </button>
-        </li>
-      {/each}
-    </ul>
-  </nav>
+  <TabStrip
+    ariaLabel="Request status filters"
+    bind:value={activeStatus}
+    items={tabs.map((tab) => ({
+      id: tab.status,
+      label: tab.label,
+      count: activeStatus === tab.status ? rows.length : undefined
+    }))}
+  />
 
   {#if query.isPending}
     <p class="text-text-secondary">Reading the queue…</p>