feat(ui): InlineAction for small text actions, with a 44 px touch floor

Thirty-three hand-rolled underlined text links and buttons (Open
schedule, Select all, View all, Retry, Learn more, the device-code copy
action, ...) carried three different focus rings, none on half of them,
and a 16 px target on a phone. They now render through one InlineAction
primitive: tone primary / muted / foreground, size xs / sm, a focus ring,
and min-h-11 on a coarse pointer so the desktop layout does not move. A
structural test refuses a new hand-rolled copy.

src/app/mood/page-client.tsx

@@ -18,6 +18,7 @@ import { ArrowRight, Plus, Wrench } from "lucide-react";
 import { useRouter, useSearchParams } from "next/navigation";
 import { useEffect } from "react";
 import { useTranslations } from "@/lib/i18n/context";
+import { InlineAction } from "@/components/ui/inline-action";
 
 export default function MoodPageClient() {
   const { user, isAuthenticated, isLoading } = useAuth();
@@ -197,14 +198,12 @@ export default function MoodPageClient() {
           here (module-gated — no nav change) rather than a merge: capture
           vs. screener stay two defensible surfaces, just cross-linked. */}
       {user?.modules?.mentalHealth === true ? (
-        <Link
-          href="/mental-wellbeing"
-          data-slot="mood-mental-wellbeing-link"
-          className="text-muted-foreground hover:text-foreground focus-visible:ring-ring/50 inline-flex items-center gap-1.5 text-sm underline-offset-4 transition-colors hover:underline focus-visible:ring-[3px] focus-visible:outline-none"
-        >
-          {t("mood.mentalWellbeingLink")}
-          <ArrowRight className="size-3.5" aria-hidden="true" />
-        </Link>
+        <InlineAction asChild tone="muted" size="sm" className="gap-1.5">
+          <Link href="/mental-wellbeing" data-slot="mood-mental-wellbeing-link">
+            {t("mood.mentalWellbeingLink")}
+            <ArrowRight className="size-3.5" aria-hidden="true" />
+          </Link>
+        </InlineAction>
       ) : null}
     </div>
   );