feat(design): every button on its family, the chip primitive, the lint rule (E28 S3b2)

The second half of the button sweep: the remaining hand-rolled buttons in
feature components, the design lab and the components/ui composites now
stand on Button, IconButton, Pressable, Chip or DragHandle.

- Chip + DismissibleChip (filter / token / tag / suggest / ghost, 24px
  floor, 44 on touch) replace five chip geometries; FilterChipGroup
  renders Chips; overflow lanes measure a mirror painted by chipClass.
- The Plex control row is IconButton's player rung (36, 20px glyph,
  round, overlay; 44 on touch); the YT modal bar is on the sm rung with
  pressed cycle toggles and names that survive a folded label.
- New variants: IconButton ghost-accent, danger-soft; Button warn on a
  new state-warn utility. The .btn-{tone} recipes and btnCls are gone.
- Fixed on the way: membership rows (collection editor, Plex playlist
  add) announce checked/mixed; a one-letter tag chip was 21px wide;
  descriptionLinks moved out of lib/ (it renders components).
- local/button-primitive: a raw <button>/<FocusSafeButton> outside the
  control-primitive files is a lint error (contract-tested, seen red).

frontend/src/components/UpNextCard.tsx

@@ -5,6 +5,8 @@ import { Play, X } from "lucide-react";
 import { api } from "../lib/api";
 import { plexLang } from "../i18n";
 import { qk } from "../lib/queryKeys";
+import { Button } from "./ui/Button";
+import { IconButton } from "./ui/IconButton";
 
 // Up-next / end-card (E6 S4). Shown at episode end when a next item exists and the pref is on, INSTEAD
 // of the old instant jump — so binge stays under the viewer's control (D6-A). Counts down ~10s then
@@ -84,10 +86,7 @@ export function UpNextCard({
         <div className="truncate text-sm font-semibold leading-tight">{heading || "…"}</div>
         {sub && <div className="truncate text-xs text-white/60">{sub}</div>}
         <div className="mt-auto flex items-center gap-2 pt-2.5">
-          <button
-            onClick={onAdvance}
-            className="flex items-center gap-1.5 rounded-full bg-accent px-3 py-1.5 text-xs font-semibold text-accent-fg hover:brightness-110"
-          >
+          <Button size="sm" onMedia onClick={onAdvance} className="text-xs font-semibold">
             <span className="relative grid h-5.5 w-5.5 flex-none place-items-center">
               <svg viewBox="0 0 24 24" className="absolute inset-0 -rotate-90">
                 <circle
@@ -114,22 +113,26 @@ export function UpNextCard({
             </span>
             {t("plex.player.upNext.playNow")}
             <span className="tabular-nums">{secs}</span>
-          </button>
-          <button
+          </Button>
+          <Button
+            variant="overlay"
+            size="sm"
+            onMedia
             onClick={onCancel}
-            className="rounded-full border border-white/25 px-3 py-1.5 text-xs text-white/85 hover:bg-white/10"
+            className="border border-white/25 text-xs"
           >
             {t("plex.player.upNext.cancel")}
-          </button>
+          </Button>
         </div>
       </div>
-      <button
+      <IconButton
+        variant="overlay"
         onClick={onCancel}
-        aria-label={t("plex.player.upNext.cancel")}
-        className="absolute right-2 top-2 rounded p-0.5 text-white/50 hover:bg-white/10 hover:text-white"
+        label={t("plex.player.upNext.cancel")}
+        className="absolute right-1 top-1"
       >
-        <X className="h-4 w-4" />
-      </button>
+        <X />
+      </IconButton>
     </div>
   );
 }