feat(design): the page band (B4) — one h1 per page, section headings, skip to content, filters fold on a short window (E28 S3d4)

- PageShell names the page with a visually hidden h1; a view with its own title renders it as
  PageHeading and the hidden one steps aside (contract: no hand <h1> inside the shell).
- Section captions are SectionLabel headings (h2, h3 in a dialog), ui/form Section included.
- "Skip to content" is the first Tab stop and focuses the scroller's <main>.
- Below 600px of height the band's filter row folds into "Filters · n" (Feed, Plex, server log),
  the same row shown in place.
- The band holds controls only: Downloads and Notifications lose their title cards, the Config and
  channel-discovery intros scroll with the content, the Stats tabs and the audit pager join the band,
  and the server log's toolbar sticks with the fade under it.

frontend/src/components/ui/SkipLink.dom.test.tsx

@@ -0,0 +1,31 @@
+// @vitest-environment jsdom
+//
+// E28 S3d4 (UX-4): "Skip to content" moves the focus to the page's <main> itself. Following its
+// `#content` fragment would push a history entry, and the app reads every popstate as a page change.
+import { afterEach, describe, expect, it } from "vitest";
+import { cleanup, fireEvent, render, screen } from "@testing-library/react";
+import { SkipLink } from "./SkipLink";
+import { CONTENT_ID } from "./landmarks";
+
+afterEach(cleanup);
+
+describe("SkipLink", () => {
+  it("focuses the content region without touching the address", () => {
+    render(
+      <>
+        <SkipLink label="Skip to content" />
+        <main id={CONTENT_ID} tabIndex={-1}>
+          page
+        </main>
+      </>,
+    );
+    const before = window.location.href;
+    const link = screen.getByRole("link", { name: "Skip to content" });
+    // Off screen until focused, then a full-size button (sr-only / not-sr-only zeroed its padding).
+    expect(link.className).toContain("focus:translate-y-0");
+    expect(link.className).not.toMatch(/sr-only/);
+    fireEvent.click(link);
+    expect(document.activeElement?.id).toBe(CONTENT_ID);
+    expect(window.location.href).toBe(before);
+  });
+});