feat(keys): j/k walk the feed, s finds the search box, g jumps to a module

A feed card cost ~10 Tab stops, so the tenth card sat ~135 Tabs from the top of the page, and the
only keyboard focus ring (a 60% accent outline on the thumbnail) all but vanished on the dark glass.
First slice of the E11 keyboard layer (S4a); Home, Plex and the tables follow in S4b/S4c.

- `lib/listNav`: one window listener over every registered list, walked in document order. `j`/`k`
  step item to item (on into the next list — owner decision D4), the arrows move around a grid, Enter
  clicks the item's own `data-nav-open` element, so it opens exactly like a click. An item root is
  never a Tab stop: it gets `tabindex=-1` only while the keyboard is on it, and keeps it until the next
  item takes it, so the player's focus restore lands back on the card. The first `j` takes the first
  card you can see, not the top of the list.
- `VirtualGrid` takes part with `keyboardNav` (column count + scrolling an unmounted row in);
  `VirtualFeed` turns it on, so the feed, the library and the channel page all have it.
- Keymap: two-step sequences (`g h`) whose pending step belongs to the scope that started it; the
  page-level scopes (`page`, `search`, `list`) are quiet while a layer that owns the keyboard is open,
  enforced in `dispatch`. A test pins the owner's rule that none of them needs a modifier on the
  Hungarian layout.
- `g h/f/c/p/x/n/m/d/s/,` jump to a module this account can reach; `s` focuses the header search box
  and selects the old query; Escape in it hands the keyboard back to the page (Plex's typeahead spends
  its first Escape on its panel).
- Hover popovers are passive layers: an open tooltip still takes Escape first but no longer silences
  the page keys.
- Focus ring (owner decision D2 = B): solid 2px accent around the whole item; the app-wide button/
  link/row ring goes from 60% to solid too. The item keeps a transparent resting outline because the
  video card transitions `all` — without it every `j` flashed a 3px white ring (measured in Chrome).
- Help sheet: the new keys, in a fixed order after the surface's own; a `g` chord only for a reachable
  module; opened over a player or dialog it leaves out the page-level keys and the context-menu key,
  which nothing can reach there (the latter pre-existing since E10).
- CLAUDE.md: a canonical-patterns row for list/grid keys (`useListNav` + `navItemAttrs` +
  `data-nav-open`, not a private arrow-key handler).

frontend/src/components/ui/VirtualGrid.tsx

@@ -8,6 +8,7 @@ import {
   type ReactNode,
 } from "react";
 import { useVirtualizer } from "@tanstack/react-virtual";
+import { useListNav } from "../../lib/listNav";
 import { GRID_GAP, columnsFor, itemWidthFor } from "./gridColumns";
 import { shouldPrefetchNext } from "./readAhead";
 
@@ -66,8 +67,13 @@ export interface VirtualGridProps<T> {
   rowEst: number;
   /** Renders one item. `itemWidth` is the measured px width of one cell — for width-derived
    * layouts (e.g. a one-line row that drops columns as it narrows); ignore it otherwise, and to
-   * protect a memo'd item from re-rendering on every resize frame, pass a stable value down. */
-  renderItem: (item: T, itemWidth: number) => ReactNode;
+   * protect a memo'd item from re-rendering on every resize frame, pass a stable value down.
+   * `index` is the item's position in `items` — what `navItemAttrs` wants on the item's root. */
+  renderItem: (item: T, itemWidth: number, index: number) => ReactNode;
+  /** Take part in page keyboard navigation (`lib/listNav`): `j`/`k`/arrows/Enter over the items.
+   * The grid supplies the column count and scrolls an unmounted item's row in; the item must spread
+   * `navItemAttrs(index)` on its root and mark its "open" element `data-nav-open`. */
+  keyboardNav?: boolean;
   /** Infinite scroll — omit all three for a finite client-side list. */
   hasNextPage?: boolean;
   isFetchingNextPage?: boolean;
@@ -85,6 +91,7 @@ export default function VirtualGrid<T>({
   hasNextPage = false,
   isFetchingNextPage = false,
   fetchNextPage,
+  keyboardNav = false,
 }: VirtualGridProps<T>) {
   const listRef = useRef<HTMLDivElement>(null);
   const [scrollEl, setScrollEl] = useState<HTMLElement | null>(null);
@@ -139,6 +146,15 @@ export default function VirtualGrid<T>({
 
   const virtualRows = virtualizer.getVirtualItems();
 
+  // Only ~a screen of rows (plus overscan) is mounted, so a key that moves further — or past the
+  // overscan at the edge — has to scroll the row in before the item exists to be focused.
+  useListNav(listRef, {
+    enabled: keyboardNav,
+    count: items.length,
+    cols: colCount,
+    reveal: (index) => virtualizer.scrollToIndex(Math.floor(index / colCount), { align: "auto" }),
+  });
+
   // Infinite-scroll read-ahead: pull the next page once the last rendered row is within the
   // read-ahead window of the loaded end (see readAhead.ts — the window scales with the rendered row
   // count, clamped so a tall window doesn't prefetch unboundedly). A no-op for finite lists (no
@@ -159,6 +175,7 @@ export default function VirtualGrid<T>({
       {virtualRows.map((vr) => {
         const row = rows[vr.index];
         if (!row) return null;
+        const first = vr.index * colCount;
         return (
           <div
             key={vr.key}
@@ -185,8 +202,8 @@ export default function VirtualGrid<T>({
               {/* A transparent Fragment carries React's key so the rendered item stays the DIRECT
                   grid/column child — some cards rely on that (e.g. `h-full` stretch, actions pinned
                   to the bottom edge), which a wrapper element would silently break. */}
-              {row.map((item) => (
-                <Fragment key={getKey(item)}>{renderItem(item, itemWidth)}</Fragment>
+              {row.map((item, i) => (
+                <Fragment key={getKey(item)}>{renderItem(item, itemWidth, first + i)}</Fragment>
               ))}
             </div>
           </div>