fix: mobile layout fixes, i18n coverage, and recipe share link

Mobile:
- Recipes search bar full-width on mobile instead of capped narrow
- Cook mode ingredients panel stacks above the step instead of
  squeezing it into a narrow column
- Version history Compare/Restore buttons wrap onto their own row
- Recipe edit ingredient fields wrap instead of forcing horizontal
  scroll on narrow viewports

i18n: translates remaining hardcoded strings across recipes
filter/sort, adapt-recipe and AI variations dialogs, the full
settings section (sidebar + 6 sub-pages + BYOK/model-prefs/
API-keys/webhooks managers), explore tab, collections (new/fork/
share dialogs), meal planning (planner, AI generation phases, new
shopping list, shared-plan view), photo import, recipe bulk-select
toolbar, and recipe action-button tooltips. Also fixes the recipes
page subtitle, which wasn't just unworded but missing its {count}
interpolation entirely — it always rendered as the bare word
"results" regardless of how many recipes existed.

Feature: adds a ShareRecipeButton that copies the public /r/{id}
link to the clipboard, with a notice when the recipe isn't Public
yet.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

apps/web/components/recipe/version-history-button.tsx

@@ -136,7 +136,7 @@ export function VersionHistoryButton({
               <History className="h-4 w-4" />
             </Button>
           } />
-          <TooltipContent>History</TooltipContent>
+          <TooltipContent>{t("historyTooltip")}</TooltipContent>
         </Tooltip>
       </TooltipProvider>
       <Sheet open={open} onOpenChange={handleOpen}>
@@ -160,42 +160,55 @@ export function VersionHistoryButton({
 
             return (
               <div key={v.id} className="border rounded-lg overflow-hidden">
-                <div className="flex items-center gap-2 p-3">
-                  <button
-                    className="flex-1 text-left text-sm"
-                    onClick={() => void handleExpand(v)}
-                  >
-                    <span className="font-medium">v{v.version}</span>
-                    <span className="text-muted-foreground"> — {v.title} — {formatDate(v.createdAt)}</span>
-                  </button>
-                  <Button
-                    variant="ghost"
-                    size="icon"
-                    className="h-7 w-7 shrink-0"
-                    title={tForm("expand")}
-                    onClick={() => void handleExpand(v)}
-                  >
-                    <ChevronDown className={`h-4 w-4 transition-transform ${isExpanded ? "rotate-180" : ""}`} />
-                  </Button>
-                  <Button
-                    variant="outline"
-                    size="sm"
-                    className="shrink-0"
-                    onClick={() => void handleCompare(v)}
-                  >
-                    <GitCompare className="h-3 w-3" />
-                    Compare
-                  </Button>
-                  <Button
-                    variant="outline"
-                    size="sm"
-                    className="shrink-0"
-                    disabled={restoringId === v.id}
-                    onClick={() => void handleRestore(v)}
-                  >
-                    <RotateCcw className="h-3 w-3" />
-                    Restore
-                  </Button>
+                <div className="flex flex-col gap-2 p-3 sm:flex-row sm:items-center">
+                  <div className="flex items-center gap-2">
+                    <button
+                      className="flex-1 text-left text-sm"
+                      onClick={() => void handleExpand(v)}
+                    >
+                      <span className="font-medium">v{v.version}</span>
+                      <span className="text-muted-foreground"> — {v.title} — {formatDate(v.createdAt)}</span>
+                    </button>
+                    <Button
+                      variant="ghost"
+                      size="icon"
+                      className="h-7 w-7 shrink-0 sm:hidden"
+                      title={tForm("expand")}
+                      onClick={() => void handleExpand(v)}
+                    >
+                      <ChevronDown className={`h-4 w-4 transition-transform ${isExpanded ? "rotate-180" : ""}`} />
+                    </Button>
+                  </div>
+                  <div className="flex items-center gap-2">
+                    <Button
+                      variant="ghost"
+                      size="icon"
+                      className="h-7 w-7 shrink-0 hidden sm:inline-flex"
+                      title={tForm("expand")}
+                      onClick={() => void handleExpand(v)}
+                    >
+                      <ChevronDown className={`h-4 w-4 transition-transform ${isExpanded ? "rotate-180" : ""}`} />
+                    </Button>
+                    <Button
+                      variant="outline"
+                      size="sm"
+                      className="flex-1 sm:flex-initial shrink-0"
+                      onClick={() => void handleCompare(v)}
+                    >
+                      <GitCompare className="h-3 w-3" />
+                      Compare
+                    </Button>
+                    <Button
+                      variant="outline"
+                      size="sm"
+                      className="flex-1 sm:flex-initial shrink-0"
+                      disabled={restoringId === v.id}
+                      onClick={() => void handleRestore(v)}
+                    >
+                      <RotateCcw className="h-3 w-3" />
+                      Restore
+                    </Button>
+                  </div>
                 </div>
 
                 {isExpanded && (