feat(design): the button families on the decided ladder, first half of the sweep (E28 S3b1)

Button is rebuilt to A1/B1/B3: explicit heights (xs 24 / sm 28 / md 32, lg 40 for a hero CTA), r8 (a
pill on media), state layers instead of opacity and bg-card hovers, a `pressed` toggle, `overlay`,
`media` and `link-muted` variants. The icon-only sizes move to the new IconButton (28 / 32, 48 only for
the Play on a picture; a required label). Pressable (a card, row or tile that is the control) and
DragHandle join them. The state-* utilities now stand down on a disabled, busy or pressed control, held
by theme.contract.test.ts.

Swept onto them: the Button icon-size callers and 16 files (Plex playlist, Plex detail, the YT player
modal chrome, Welcome, Plex and video cards with AddToPlaylist and DownloadButton, the video editor,
Feed, personal views, Scheduler, Users, the nav rail, Plex detail parts, Settings): 268 raw buttons are
153. Fixed on the way: FocusSafeButton overwrote a caller's aria-disabled (the "unavailable, here is
why" state; adminInvites caught it), a season toggle and a Plex settings switch had no name/state, and
the video card's overlay follows the C5 card (Resume pill, From the start pill, a round Play).

docs/DESIGN.md

@@ -111,7 +111,9 @@ The chosen rendering of each rule is in the lab under "Decided". The primitives
   buttons 1.75rem / 2rem. A toolbar's search pill, dropdown trigger, `sm` button and small icon button are
   the same 28, so the row lines up. Nothing goes under 24 (WCAG 2.5.8); touch grows it to 44 (A3).
 - **Icon buttons (A2):** two sizes (28 / 32), r8: the smaller in rows and dense toolbars, the larger on its own. On a
-  picture, a round, dark translucent button, readable on any thumbnail. Round means "on media" only.
+  picture, a round, dark translucent button, readable on any thumbnail. Round means "on media" only: a text
+  button on a picture is a pill (the card's Resume in the accent, From the start dark translucent, C5), and
+  the one 48px glyph is the Play in the middle of a not-started card (C5).
 - **Touch (A3):** on a coarse pointer every control primitive (`Button`, `SegmentedToggle`, `FilterSelect`,
   `Tabs`, `Switch`, chips, the nav rail) grows to 2.75rem (44px) through one token, as a real box. Mouse
   sizes don't change. [HIG, WCAG 2.5.8]
@@ -125,8 +127,16 @@ The chosen rendering of each rule is in the lab under "Decided". The primitives
 
 Also in force:
 
-- An action button is `ui/Button` with a `SIZES` rung. A hand-rolled `<button className="px-3 …">` is a
-  violation. A text-less button must have an accessible name, and the type enforces it. [WCAG 4.1.2]
+- **One primitive per button family** (E28 S3b): a labelled action is `Button` (a rung from the ladder,
+  plus `lg` 40 for a page's single hero call to action, and nothing else); a glyph is `IconButton` (a
+  required `label`); a card, row, tile or menu row whose content is the control is `Pressable`; a filter or
+  tag chip is the chip family; a sortable row's grip is `DragHandle`. On the always-dark player chrome both
+  `Button` and `IconButton` use the `overlay` variant (white, a white layer), whatever the theme. A pressed
+  toggle is `pressed`: the solid accent on a `Button`, the accent glyph on an `IconButton`. A hand-rolled
+  `<button className="px-3 …">` is a violation. A text-less button must have an accessible name, and the
+  type enforces it. [WCAG 4.1.2]
+- **Unavailable with a reason** stays focusable: `aria-disabled` plus the reason in the label or tooltip,
+  never native `disabled`, which drops it from the tab order with its explanation. [WCAG 2.1.1]
 - A choice between a few values is `SegmentedToggle`; a long list or a user's own list is `FilterSelect`.
   Never a native `<select>` (lint-enforced).
 - A filter chip goes through `FilterChipGroup`.
@@ -303,3 +313,4 @@ Wherever there is text, the user can select it and copy it, and no click action
 | 2026-09-24 | C5 Plex player controls     | The owner's lean set: no Stop / Restart / ±10 s buttons, Back by position, Next only with a next item, Resume + From the start on the card, touch double-tap ±10 s | Every control in one row (it ran off-screen below 1024); Back by a press counter; ±10 s keyboard-only | The row fits a portrait tablet; the decision to restart is made on the card; a tablet keeps the 10 s skip                                                            |
 | 2026-09-24 | Glass tuner                 | Retired; the schemes are the only colour choice                                                                                                                    | Keep it with ranges clamped to the rules                                                              | Free tuning is the drift the constitution exists to stop (owner)                                                                                                     |
 | 2026-09-24 | Matrix toned down           | Moss #86a05a at Midnight's lightness, near-neutral greys; every white-on-accent part → `--accent-fg`                                                               | The B2 lime #a3e635                                                                                   | The owner found the lime neon and tiring; it was the loudest accent (L 0.85, C 0.21), and fixed white parts sat on it at 1.5:1                                       |
+| 2026-09-24 | Button families             | `Button` / `IconButton` / `Pressable` / chips / `DragHandle`; `lg` 40 for a hero CTA; pills and a 48 Play on media (from C5)                                       | Every button hand-painted                                                                             | 268 hand-rolled buttons in 79 files drifted into as many looks; the ladder only holds if every button stands on it                                                   |