style(layout): tighten the oversized vertical gaps around the page toolbars

The floating-header → toolbar → filter-chips → content stack carried ~2× the whitespace it
needed. Halve it, app-wide where the chrome is shared:
- PageShell: the --hdr-h gap below the floating header 8px → 4px (every page's header).
- Feed: toolbar wrapper pt-4 → pt-2, the toolbar's own pb-3 → pb-1.5, and the grid's top pt-2
  → pt-1. Measured on the feed: header→toolbar 24→12px, toolbar→chips 12→6px, chips→cards 12→8px.
- Plex / Playlists / ChannelDiscovery / DownloadCenter / Notifications / AdminUsers: toolbar
  wrapper pt-3 → pt-2, so every page's top band matches the tighter feed.

PageShell.dom.test updated for the 4px gap.

frontend/src/components/PageShell.tsx

@@ -71,8 +71,8 @@ export default function PageShell({
   // PageShell is reused — never remounted — across feed↔channel navigation (same component position in
   // App.tsx), so the header DOM node is swapped out from under a stable PageShell. A one-shot effect keeps
   // observing the FIRST header node; when that node detaches on channel-open, its ResizeObserver fires with
-  // a 0 box and rewrites --hdr-h to `0+0+8`=8px on the (still-mounted) content div. On Back the pad class
-  // returns with that stale 8px → the content toolbar slides up under the header, stuck until reload. Keying
+  // a 0 box and rewrites --hdr-h to `0+0+4`=4px on the (still-mounted) content div. On Back the pad class
+  // returns with that stale 4px → the content toolbar slides up under the header, stuck until reload. Keying
   // the measurement to the live node re-runs it every time the header mounts/unmounts, so it stays correct.
   const [headerEl, setHeaderEl] = useState<HTMLDivElement | null>(null);
   const [contentEl, setContentEl] = useState<HTMLDivElement | null>(null);
@@ -82,9 +82,9 @@ export default function PageShell({
       contentEl?.style.removeProperty("--hdr-h");
       return;
     }
-    // `+ 8` = the header's own gap-y-2 row gap (0.5rem), reused as the gap below it.
+    // `+ 4` = a tight gap below the floating header before the content toolbar starts.
     const apply = () =>
-      contentEl.style.setProperty("--hdr-h", `${headerEl.offsetTop + headerEl.offsetHeight + 8}px`);
+      contentEl.style.setProperty("--hdr-h", `${headerEl.offsetTop + headerEl.offsetHeight + 4}px`);
     apply();
     const ro = new ResizeObserver(apply);
     ro.observe(headerEl);