feat(keys): j/k and the arrows walk Home's rails and every Plex grid and rail

Second slice of the E11 keyboard layer (S4b). S4a gave the feed, the library and the channel page
`j`/`k`, the arrows and Enter; Home's shelves and the whole Plex module were still Tab-stop country —
a Plex poster is its own Tab stop, and a rail's cards sat behind every control of the cards before.

- `lib/listNav`: a list that mounts every item no longer declares a count or columns — both are
  measured off the DOM when a key is pressed, so an auto-fill grid's columns follow its width and a
  rail is one row. ↑ on a list's top row and ↓ on its bottom row go on to the neighbouring list, onto
  the item horizontally nearest the one left (owner decision D4: ←→ within a rail, ↑↓ to the rail
  above or below). The first `j` skips cards a rail has scrolled out to the left.
- `Carousel keyboardNav` registers the scroller; the scroller gets a 4px inset (against a -4px margin,
  layout unchanged) so the focus ring is not clipped, and `[data-nav-index]` a 2.5rem inline scroll
  margin so a card stepped into view clears the rail's edge fade and paging arrow.
- `ui/NavGrid`: the plain, fully mounted grid that registers itself.
- `navIndex` on PlexPosterCard / SeasonCard / EpisodeCard (the card root is the item, the poster the
  open element — the ring goes round poster and title, D2), PosterTile and Home's ShelfTile (the button
  is the item); cast, related and collection-strip buttons carry the attrs directly.
- Wired: Home's comfort and resume rails; Plex Browse titles + episodes, Discover rails + genres,
  collection view, playlists/collections browse, person known-for + filmography, show seasons, season
  episodes, cast/related strips, info-page cast + collection strips.
- `listNav.wiring.contract.test`: every `Carousel` says `keyboardNav`, every card says `navIndex`, and a
  card with `navIndex` sits inside a NavGrid / Carousel / VirtualGrid — both halves are opt-in, and
  either one missing leaves a list the keyboard silently skips.

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

@@ -5,7 +5,7 @@
 // scroll — which is exactly the affordance under test: a button shows ONLY on the clipped edge, and
 // clicking it pages the scroller. i18n is key-passthrough, so asserted names are the i18n keys.
 import { describe, it, expect, vi, beforeAll, afterEach } from "vitest";
-import { render, screen, fireEvent, cleanup } from "@testing-library/react";
+import { act, render, screen, fireEvent, cleanup } from "@testing-library/react";
 
 vi.mock("react-i18next", async (importOriginal) => {
   const actual = await importOriginal<typeof import("react-i18next")>();
@@ -13,6 +13,7 @@ vi.mock("react-i18next", async (importOriginal) => {
 });
 
 import { Carousel } from "./Carousel";
+import { navItemAttrs } from "../../lib/listNav";
 
 beforeAll(() => {
   // useHScroll wires a ResizeObserver (watch-the-children); jsdom ships none.
@@ -91,3 +92,38 @@ describe("Carousel", () => {
     expect(screen.getByRole("button", { name: "common.scrollRight" })).toBeTruthy();
   });
 });
+
+// E11 S4b: a rail on Home, Discover or an info page is a list the keyboard walks — but only when the
+// caller says its cards carry `navItemAttrs`. A carousel of plain content must not claim `j`.
+describe("Carousel · keyboard", () => {
+  const cards = () =>
+    [0, 1, 2].map((i) => (
+      <button key={i} {...navItemAttrs(i)}>
+        {`card ${i}`}
+      </button>
+    ));
+  const press = (key: string) =>
+    act(() => {
+      (document.activeElement ?? document.body).dispatchEvent(
+        new KeyboardEvent("keydown", { key, bubbles: true, cancelable: true }),
+      );
+    });
+
+  it("is walked by j when keyboardNav is on", () => {
+    render(
+      <Carousel ariaLabel="Rail" keyboardNav>
+        {cards()}
+      </Carousel>,
+    );
+    press("j");
+    expect(document.activeElement?.textContent).toBe("card 0");
+    press("j");
+    expect(document.activeElement?.textContent).toBe("card 1");
+  });
+
+  it("leaves j alone without it", () => {
+    render(<Carousel ariaLabel="Rail">{cards()}</Carousel>);
+    press("j");
+    expect(document.activeElement).toBe(document.body);
+  });
+});