test(e4): readSelectedId ?pl guard, useUrlMirror dep-keying, usePref flush

The remaining E4 deep-review deferred gaps, in one sprint:
- readSelectedId split into playlistsInit.ts (react-refresh-clean, testable) —
  ?pl accepted only as a positive integer; empty/0/negative/fractional/non-numeric
  fall back to the stored selection; null when neither is present.
- useUrlMirror: mounts write the param, a same-serialized rerender does NOT
  re-fire (stable dep), a null value clears the key, other params preserved.
- usePref: a pending debounced write is FLUSHED on unmount (not dropped); an
  unmount with nothing pending stays silent.

20 new test cases; full FE gate green (tsc/eslint/prettier/knip, 309 vitest).

frontend/src/components/playlistsInit.test.ts

@@ -0,0 +1,54 @@
+// @vitest-environment jsdom
+//
+// readSelectedId: the Playlists selected-id seed. Backfills the E4 deep-review's deferred ?pl guard
+// coverage — a ?pl bookmark wins over the stored selection but only when it's a positive integer;
+// anything else (empty / zero / negative / fractional / non-numeric) falls back to the stored id.
+import { describe, it, expect, beforeEach, vi } from "vitest";
+
+const { stored } = vi.hoisted(() => ({ stored: { v: null as string | null } }));
+vi.mock("../lib/storage", async (importOriginal) => {
+  const actual = await importOriginal<typeof import("../lib/storage")>();
+  return { ...actual, getAccountRaw: () => stored.v };
+});
+
+import { readSelectedId } from "./playlistsInit";
+
+const setUrl = (search: string) => window.history.replaceState(null, "", search || "/");
+
+beforeEach(() => {
+  setUrl("/");
+  stored.v = null;
+});
+
+describe("readSelectedId ?pl guard", () => {
+  it("accepts a positive-integer ?pl", () => {
+    setUrl("?pl=5");
+    expect(readSelectedId()).toBe(5);
+  });
+
+  it("a ?pl bookmark wins over the stored selection", () => {
+    setUrl("?pl=5");
+    stored.v = "7";
+    expect(readSelectedId()).toBe(5);
+  });
+
+  it.each(["", "0", "-2", "1.5", "abc"])("rejects ?pl=%s and falls back to stored", (raw) => {
+    setUrl(`?pl=${raw}`);
+    stored.v = "7";
+    expect(readSelectedId()).toBe(7);
+  });
+
+  it("rejects a bad ?pl and returns null when there is no stored selection", () => {
+    setUrl("?pl=0");
+    expect(readSelectedId()).toBeNull();
+  });
+
+  it("uses the stored selection when there is no ?pl", () => {
+    stored.v = "9";
+    expect(readSelectedId()).toBe(9);
+  });
+
+  it("returns null when neither ?pl nor a stored selection is present", () => {
+    expect(readSelectedId()).toBeNull();
+  });
+});