feat(design): C5 recorded, every E28 decision taken

The owner's lean Plex control set with both refinements (Back by position,
a touch double-tap for the 10 s skip) goes into DESIGN.md's Players
chapter and the log. The lab is now the reference only.

frontend/src/design-lab/batchC.tsx

@@ -22,13 +22,12 @@ import {
 } from "lucide-react";
 import { Btn } from "./batchA";
 import { C1 } from "./batchCActions";
-import { Decision, Reference, Sample, Variant } from "./labKit";
+import { Reference, Sample } from "./labKit";
 import { FADE_ABOVE_PANEL, FADE_BELOW_PANEL, H, LAYER, STRONG } from "./labTokens";
 
-// E28 S2 · Batch C — behaviour on touch and on a narrow window. C1–C4 are DECIDED (owner, 2026-09-24:
-// all as proposed) and stay as references. C5 is open: the live player pass (E28 S2d) found the Plex
-// control row running off-screen below 1024; the owner answered with a reworked control set, and
-// two of its points are asked back.
+// E28 S2 · Batch C — behaviour on touch and on a narrow window, DECIDED (owner, 2026-09-24): C1–C4 as
+// proposed; C5 is the owner's reworked Plex control set (found by the live player pass, E28 S2d: the
+// old row ran off-screen below 1024) with the two refinements they accepted. References only.
 
 const ico = "w-4 h-4";
 
@@ -206,14 +205,14 @@ export function BatchC() {
         <C3 />
         <C4 />
       </div>
+      <C5 />
     </div>
   );
 }
 
-// ── C5 · the Plex player's controls, reworked (the owner's model, 2026-09-24) ─────────────────────
-// The owner's direction: Stop, Restart and ±10 s leave the row; Back restarts or steps to the previous
-// episode; Next exists only when there is a next item; restarting moves onto the card. What is left
-// fits a portrait tablet in one row, with a fixed "⋯" for the rare tools.
+// ── C5 · the Plex player's controls (the owner's model, 2026-09-24) ──────────────────────────────
+// What is left after Stop, Restart and ±10 s leave the row fits a portrait tablet in one row, with a
+// fixed "⋯" for the rare tools; restarting moves onto the card.
 
 const ROW: { icon: typeof Pause; label: string }[] = [
   { icon: Pause, label: "Play / pause" },
@@ -231,24 +230,22 @@ const MORE: { icon: typeof Pause; label: string }[] = [
 
 const ctl = "grid h-11 w-11 shrink-0 place-items-center rounded-full";
 
-function PlayerRow({ touchZones }: { touchZones: boolean }) {
+function PlayerRow() {
   return (
     <div className="relative aspect-4/3 w-full overflow-hidden rounded-xl bg-linear-to-br from-slate-700 to-black text-white">
-      {touchZones && (
-        // Double-tap zones: the left and right thirds of the picture skip ∓10 s on touch.
-        <div className="absolute inset-x-0 top-0 bottom-28 flex justify-between text-2xs text-white/70">
-          <span className="flex w-1/3 items-start justify-center border-r border-dashed border-white/25 pt-6">
-            <span className="flex items-center gap-1">
-              <Rewind className="h-4 w-4" /> double-tap −10 s
-            </span>
+      {/* Double-tap zones: the left and right thirds of the picture skip ∓10 s on touch. */}
+      <div className="absolute inset-x-0 top-0 bottom-28 flex justify-between text-2xs text-white/70">
+        <span className="flex w-1/3 items-start justify-center border-r border-dashed border-white/25 pt-6">
+          <span className="flex items-center gap-1">
+            <Rewind className="h-4 w-4" /> double-tap −10 s
           </span>
-          <span className="flex w-1/3 items-start justify-center border-l border-dashed border-white/25 pt-6">
-            <span className="flex items-center gap-1">
-              double-tap +10 s <FastForward className="h-4 w-4" />
-            </span>
+        </span>
+        <span className="flex w-1/3 items-start justify-center border-l border-dashed border-white/25 pt-6">
+          <span className="flex items-center gap-1">
+            double-tap +10 s <FastForward className="h-4 w-4" />
           </span>
-        </div>
-      )}
+        </span>
+      </div>
       <div className="absolute inset-x-0 bottom-0 flex flex-col gap-1 bg-linear-to-t from-black/85 to-transparent px-2 pb-2 pt-10">
         <div className="relative flex h-11 items-center">
           <div className="h-1 w-full rounded-full bg-white/30">
@@ -352,31 +349,20 @@ function Cards() {
   );
 }
 
-export function C5() {
+function C5() {
   return (
-    <Decision
+    <Reference
       id="c5"
       code="C5"
-      title="The Plex player's controls, reworked"
-      question="Your model: no Stop (closing is stopping), no Restart and no ±10 s buttons, Back restarts or goes to the previous episode, Next only where there is a next item, and restarting moves onto the card (Play when not started; Resume + From the start when started). It fits a 767 portrait tablet in one row, with a fixed '⋯'. Two points need your call: how Back tells 'restart' from 'previous', and how a tablet skips 10 s without a keyboard."
-      now="15 controls plus the time in one row that neither wraps nor scrolls: at 767 and at 820 portrait five of them are off-screen and unreachable. The card shows one Play ring; Resume and 'Clear resume point' exist only on the detail page."
+      title="The Plex player's controls"
+      rule="The owner's model. No Stop (closing is stopping), no Restart and no ±10 s buttons. Back: more than 3 s in → restart; within the first 3 s → the previous item, at its resume point if it has one. Next shows only when there is a next item (an episode, a playlist), starts it at its resume point, and leaves one behind (not watched, unless already in the credits). On touch a double-tap on the left / right third skips ∓10 s; the keyboard keeps ← / →. The rare tools sit in a fixed '⋯'. Restarting lives on the card: not started → Play; started → Resume + From the start (touch: a tap resumes, the '…' has From the start)."
     >
-      <Variant
-        letter="A"
-        name="Your model, with two refinements"
-        recommended
-        why="1) Back decides by the position, the music-player rule: more than 3 s in → restart; within the first 3 s → the previous episode (at its resume point if it has one, else its start). That is your 'first press restarts, the second goes back', without a press counter: a counter goes wrong when you arrive at an episode by Next and want the one before it at once (the first press would restart an episode already at 0:00). 2) On touch, a double-tap on the left or right third of the picture skips ∓10 s (the YouTube and Netflix gesture); a single tap still only shows the controls (C3). Without it a tablet can't go back 10 s at all: on a 42-minute film one pixel of the seek bar is ≈ 3.5 s, and a finger lands within 10–20 px, so ±40–70 s."
-      >
-        <PlayerRow touchZones />
+      <div className="flex flex-wrap items-start gap-4">
+        <div className="w-full max-w-xl">
+          <PlayerRow />
+        </div>
         <Cards />
-      </Variant>
-      <Variant
-        letter="B"
-        name="Your model, literally"
-        why="Back counts presses: the first restarts, a second one goes to the previous episode. ±10 s only from the keyboard (← / →), so on a tablet the seek bar is the only way to move, at a precision of tens of seconds. The row and the cards are the same as A."
-      >
-        <PlayerRow touchZones={false} />
-      </Variant>
-    </Decision>
+      </div>
+    </Reference>
   );
 }