fix(ui): no button drops the keyboard focus when its own action disables it

A focused button that turns natively disabled loses the focus to <body> in
Chrome. The app disables the very button that was pressed on ~60 sites — a
mutation pending, a pager at its last page, undo with nothing left, a player
at the end of its queue, a form gone clean — so a keyboard user was thrown
out of the page on every such press.

One primitive instead of a fix per site: ui/FocusSafeButton renders a
focused-and-disabled (or busy) button as aria-disabled with a click guard,
and applies the native attribute again once the focus is elsewhere. It asks
the document at render time as well as listening for focus events, because
a window without focus fires none (measured). ui/Button and ui/form's Switch
are built on it; 57 hand-rolled buttons swapped their tag for it keeping
their classes, and three hand-copies of the rule (the channel page's Block
and Hide, ChannelDiscovery's Subscribe) now pass `busy`. The soft state's
dim look is one rule in index.css.

`local/focus-safe-disabled` refuses a new raw <button disabled>, pinned by
focusSafe.contract.test.ts. lib/plexDetailUi moved to components/: it is
components, and lib may not import the primitive.

Measured on localdev in Chrome: the audit log's Next button keeps the focus
on reaching the last page, reads aria-disabled, and the guarded click does
nothing.

frontend/src/components/ChannelDiscovery.tsx

@@ -23,6 +23,7 @@ import Pager from "./ui/Pager";
 import { PageToolbar } from "./ui/PageShell";
 import { useConfirm } from "./confirmContext";
 import { useChannelLayout } from "./channelsContext";
+import { FocusSafeButton } from "./ui/FocusSafeButton";
 
 // The Channel manager's "Discovery" tab: channels that turn up in the user's playlists but
 // that they don't subscribe to. Subscribing here only creates the subscription + enriches
@@ -107,18 +108,16 @@ export default function ChannelDiscovery({
             canWrite ? t("channels.discovery.subscribeHint") : t("channels.discovery.needWriteHint")
           }
         >
-          <button
-            // Busy blocks the click, not the focus: a focused button that turns natively `disabled`
-            // drops the keyboard to <body> (the rule and its measurement: ui/Button).
-            onClick={() => !subscribe.isPending && onSubscribe(c)}
+          <FocusSafeButton
+            // Busy blocks the click, not the focus (FocusSafeButton).
+            onClick={() => onSubscribe(c)}
             disabled={!canWrite}
-            aria-disabled={subscribe.isPending || undefined}
-            aria-busy={subscribe.isPending || undefined}
+            busy={subscribe.isPending}
             className="glass-card glass-hover inline-flex items-center gap-1.5 px-2.5 py-1.5 rounded-lg text-xs disabled:opacity-50 aria-disabled:opacity-50 transition"
           >
             <UserPlus className="w-3.5 h-3.5" />
             {t("channels.discovery.subscribe")}
-          </button>
+          </FocusSafeButton>
         </Tooltip>
       ),
     },