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

@@ -1,7 +1,7 @@
 import { type ReactNode } from "react";
 import { useTranslation } from "react-i18next";
 import { RotateCcw } from "lucide-react";
-import { FocusSafeButton } from "./ui/FocusSafeButton";
+import { IconButton } from "./ui/IconButton";
 
 // ±10s skip glyph: an outline circular arrow with a "10" in the centre — the YouTube/Plex-native
 // muscle-memory shape. Deliberately distinct from the episode-level SkipBack/SkipForward (double
@@ -82,13 +82,14 @@ export function Slider({
             {suffix ?? ""}
           </span>
           {onReset && (
-            <button
+            <IconButton
+              variant="overlay"
               onClick={onReset}
-              className="text-white/40 hover:text-white"
-              aria-label={t("common.resetNamed", { name: label })}
+              label={t("common.resetNamed", { name: label })}
+              className="-my-1.5"
             >
-              <RotateCcw className="h-3 w-3" />
-            </button>
+              <RotateCcw className="size-3.5!" />
+            </IconButton>
           )}
         </span>
       </div>
@@ -146,14 +147,17 @@ export function Ctrl({
     align === "start" ? "left-0" : align === "end" ? "right-0" : "left-1/2 -translate-x-1/2";
   return (
     <div className="relative flex group/ctrl">
-      <FocusSafeButton
+      <IconButton
+        variant="overlay"
+        size="player"
+        onMedia
+        noTitle
         onClick={onClick}
         disabled={disabled}
-        aria-label={label}
-        className="p-1 hover:text-accent disabled:opacity-30"
+        label={label}
       >
         {children}
-      </FocusSafeButton>
+      </IconButton>
       <span
         className={`pointer-events-none absolute bottom-full ${pos} mb-2 whitespace-nowrap rounded-sm bg-black/90 px-2 py-1 text-2xs text-white opacity-0 transition group-hover/ctrl:opacity-100`}
       >