feat(design): players on touch and the C5 control set, restart on the card (E28 S3f2)

Plex player: a finger's tap on the picture only shows or hides the controls,
the hide timer starts with playback, a double-tap on a side third skips 10 s,
the seek bar is a 2.75rem touch-none hit area with its head shown on touch.
The row is play/pause, Back by position, Next only with a next item, mute,
time, tracks, a fixed ⋯ (settings, media info, stats, shortcuts, download)
and fullscreen; Stop, Restart and the ±10 s buttons are gone.

A started card shows the video card's Continue + Restart pair (one shared
MediaResumeButtons, beside the picture's button), and its menu lists the
restart; the player opens that item at 0 (fromStart). YouTube modal: the
description opens from an ⓘ, the queue arrows sit inside the screen.

frontend/src/components/usePlexCardActions.tsx

@@ -1,6 +1,6 @@
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Check, Info, ListPlus, Play, Tv2, Undo2 } from "lucide-react";
+import { Check, Info, ListPlus, Play, SkipBack, Tv2, Undo2 } from "lucide-react";
 
 import { type PlexCard } from "../lib/api";
 import { pinPlex, useComfortPin } from "./comfortPin";
@@ -18,6 +18,9 @@ export interface PlexActionHandlers {
   /** The media-info page. Omitted where a surface has none (the episode lists). */
   onInfo?: (c: PlexCard) => void;
   onToggleWatched?: (c: PlexCard) => void;
+  /** Play from the start instead of the resume point (C5). Where given, a started title lists it
+   *  under Play — on touch, the only way to it (the card's hover pair is mouse-only). */
+  onRestart?: (c: PlexCard) => void;
 }
 
 const icon = "w-4 h-4";
@@ -29,6 +32,11 @@ export const plexAddLabelKey = (c: PlexCard): string =>
 /** A show opens its drill-down; a movie or an episode plays. */
 const isPlexPlayable = (c: PlexCard): boolean => c.type !== "show";
 
+/** Has a resume point: the click continues it, and "from the start" is a choice. A watched item is
+ *  stored at 0, so it never counts. */
+export const plexStarted = (c: PlexCard): boolean =>
+  isPlexPlayable(c) && c.status !== "watched" && (c.position_seconds ?? 0) > 0;
+
 /** `open` is the host menu's own flag (the shelf is fetched only once a menu opened). Returns the
  *  item builder, `add` for the card's own hover button, and the dialog to render beside the menu
  *  (one per list, so a card does not mount a modal of its own). */
@@ -48,18 +56,30 @@ export function usePlexCardActions(handlers: PlexActionHandlers, open: boolean)
     c: PlexCard,
     { play = true, pin: withPin = true }: { play?: boolean; pin?: boolean } = {},
   ): ActionMenuItem[] => {
-    const { onOpen, onInfo, onToggleWatched } = handlers;
+    const { onOpen, onInfo, onToggleWatched, onRestart } = handlers;
     const playable = isPlexPlayable(c);
     const watched = c.status === "watched";
+    const started = plexStarted(c);
     return [
       ...(play
         ? [
             {
               id: "play",
-              label: playable ? t("plex.play") : t("plex.openShow"),
+              label: !playable ? t("plex.openShow") : started ? t("card.continue") : t("plex.play"),
               icon: playable ? <Play className={icon} /> : <Tv2 className={icon} />,
               onSelect: () => onOpen(c),
             },
+            // The same words and glyph as the video card's menu (useVideoActions).
+            ...(started && onRestart
+              ? [
+                  {
+                    id: "restart",
+                    label: t("card.restartTitle"),
+                    icon: <SkipBack className={icon} />,
+                    onSelect: () => onRestart(c),
+                  },
+                ]
+              : []),
           ]
         : []),
       ...(playable && onToggleWatched