fix(design): the keyboard ring of a flush row stays visible (E28)

A list item's ring sat 2 px outside it. On a table row it ran under the
sticky head and past the table's sides; on a Plex playlist show header, flush
in its clipping card, it was cut away and the focus was invisible. A table row
(by its tag), a log line and the Plex show header and episode rows now ring
inside themselves, the show header with its card's corners.

The sticky header's fade-below was drawn at rest, over the first row's top
16 px, hiding the ring's top edge: it now fades in with the first 1rem of
scroll (a scroll-driven animation; no fade where unsupported).

frontend/src/components/LogLine.tsx

@@ -38,7 +38,7 @@ export default function LogLine({
   return (
     <div
       className="border-b border-border/50 last:border-b-0"
-      {...navItemAttrs(navIndex, `${event} ${msg}`)}
+      {...navItemAttrs(navIndex, `${event} ${msg}`, { inset: true })}
     >
       <Pressable
         selectable