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

@@ -16,6 +16,8 @@ import * as e2ee from "../lib/e2ee";
 import Avatar from "./ui/Avatar";
 import ChatThread from "./ChatThread";
 import Overlay from "./ui/Overlay";
+import { IconButton } from "./ui/IconButton";
+import { Pressable } from "./ui/Pressable";
 
 // The Messenger-style floating chat dock: open conversations live here, bottom-right, across
 // page navigation (state persisted per user). Always mounted (for human users) so it also owns
@@ -82,9 +84,9 @@ function ChatWindow({ chat, meId }: { chat: DockChat; meId: number }) {
         />
       )}
       <div className="flex items-center gap-2 px-3 py-2 border-b border-border bg-card/50">
-        <button
+        <Pressable
           onClick={() => toggleMinimize(chat.partnerId)}
-          className="flex items-center gap-2 min-w-0 flex-1 text-left"
+          className="flex items-center gap-2 min-w-0 flex-1"
           title={chat.minimized ? t("messages.expand") : t("messages.minimize")}
         >
           <Avatar
@@ -93,21 +95,16 @@ function ChatWindow({ chat, meId }: { chat: DockChat; meId: number }) {
             className="w-7 h-7 rounded-full shrink-0 text-xs"
           />
           <span className="font-semibold text-sm truncate">{chat.name}</span>
-        </button>
-        <button
+        </Pressable>
+        <IconButton
           onClick={() => toggleMinimize(chat.partnerId)}
-          className="shrink-0 p-1 rounded-md text-muted hover:text-fg hover:bg-bg transition"
-          aria-label={chat.minimized ? t("messages.expand") : t("messages.minimize")}
+          label={chat.minimized ? t("messages.expand") : t("messages.minimize")}
         >
-          {chat.minimized ? <ChevronUp className="w-4 h-4" /> : <ChevronDown className="w-4 h-4" />}
-        </button>
-        <button
-          onClick={() => closeChat(chat.partnerId)}
-          className="shrink-0 p-1 rounded-md text-muted hover:text-fg hover:bg-bg transition"
-          aria-label={t("messages.close")}
-        >
-          <X className="w-4 h-4" />
-        </button>
+          {chat.minimized ? <ChevronUp /> : <ChevronDown />}
+        </IconButton>
+        <IconButton onClick={() => closeChat(chat.partnerId)} label={t("messages.close")}>
+          <X />
+        </IconButton>
       </div>
       {!chat.minimized && (
         <div className="flex flex-col h-96">