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/plexViews.tsx

@@ -29,6 +29,7 @@ import { Carousel } from "./ui/Carousel";
 import PlexPlaylistAdd, { type PlexAddTarget } from "./PlexPlaylistAdd";
 import PlexCollectionEditor from "./PlexCollectionEditor";
 import { LoadingState, StateMessage } from "./ui/QueryState";
+import NavGrid from "./ui/NavGrid";
 
 // The Plex sub-router's view branches, split out of PlexBrowse. Each is invoked by PlexBrowse with
 // shell callbacks as props (onBack/onPlay/onFilter/…) — no view reaches back into the shell's state,
@@ -151,10 +152,11 @@ export function PlexPersonView({
     cards.length > 0 ? (
       <section className="mb-5">
         <h2 className="text-sm font-semibold mb-3">{t(titleKey, { count: cards.length })}</h2>
-        <div className="grid grid-cols-[repeat(auto-fill,minmax(150px,1fr))] gap-3">
-          {cards.map((c) => (
+        <NavGrid className="grid grid-cols-[repeat(auto-fill,minmax(150px,1fr))] gap-3">
+          {cards.map((c, i) => (
             <PlexPosterCard
               key={c.id}
+              navIndex={i}
               card={c}
               onOpen={() => onOpenCard(c)}
               onInfo={() => onInfoCard(c)}
@@ -162,7 +164,7 @@ export function PlexPersonView({
               menuProps={pinMenu.triggerProps}
             />
           ))}
-        </div>
+        </NavGrid>
       </section>
     ) : null;
 
@@ -241,11 +243,16 @@ export function PlexPersonView({
           {/* "Known for" — the person's most-popular titles that are in our library (E5 S6). */}
           {d.known_for.length > 0 && (
             <section className="mb-5">
-              <Carousel title={t("plex.person.knownFor")} ariaLabel={t("plex.person.knownFor")}>
-                {d.known_for.map((c) => (
+              <Carousel
+                title={t("plex.person.knownFor")}
+                ariaLabel={t("plex.person.knownFor")}
+                keyboardNav
+              >
+                {d.known_for.map((c, i) => (
                   <div key={c.id} className="w-[150px] shrink-0">
                     <PlexPosterCard
                       card={c}
+                      navIndex={i}
                       onOpen={() => onOpenCard(c)}
                       onInfo={() => onInfoCard(c)}
                       onToggleWatched={toggle}
@@ -501,10 +508,11 @@ export function PlexShowView({
             style={{ background: "color-mix(in srgb, var(--card) 55%, transparent)" }}
           >
             <h2 className="text-sm font-semibold mb-3">{t("plex.series.seasons")}</h2>
-            <div className="grid grid-cols-[repeat(auto-fill,minmax(140px,1fr))] gap-3">
-              {d.seasons.map((se) => (
+            <NavGrid className="grid grid-cols-[repeat(auto-fill,minmax(140px,1fr))] gap-3">
+              {d.seasons.map((se, i) => (
                 <SeasonCard
                   key={se.id}
+                  navIndex={i}
                   se={se}
                   onOpen={() => onOpenSeason(se.id)}
                   onToggleWatched={() => markSeason(se.id, se.status !== "watched")}
@@ -520,7 +528,7 @@ export function PlexShowView({
                   }
                 />
               ))}
-            </div>
+            </NavGrid>
           </section>
 
           {show.cast.length > 0 && showCast && (
@@ -684,17 +692,18 @@ export function PlexSeasonView({
             </div>
           </DetailHero>
 
-          <div className="grid grid-cols-[repeat(auto-fill,minmax(230px,1fr))] gap-x-3 gap-y-4">
-            {se.episodes.map((ep) => (
+          <NavGrid className="grid grid-cols-[repeat(auto-fill,minmax(230px,1fr))] gap-x-3 gap-y-4">
+            {se.episodes.map((ep, i) => (
               <EpisodeCard
                 key={ep.id}
+                navIndex={i}
                 ep={ep}
                 onPlay={() => onPlay(ep.id, allKeys)}
                 onAdd={() => setAddTarget({ kind: "single", ratingKey: ep.id, title: ep.title })}
                 onToggleWatched={() => markEpisode(ep)}
               />
             ))}
-          </div>
+          </NavGrid>
         </>
       )}