fix: varied gradient+icon placeholders for recipes without a cover photo (v0.50.2)

Replaces the single flat emoji-on-muted-bg fallback (same 🍽️/🍹 everywhere)
with a deterministic gradient + food/drink icon per recipe id — pulled from
a small curated palette/icon pool via a string hash, so it's stable across
re-renders but visually varied across a grid of photo-less recipes.

New shared lib/recipe-placeholder.ts + components/recipe/recipe-cover-
placeholder.tsx, applied everywhere the old inline emoji fallback lived:
recipe-grid-card.tsx, recipe-card.tsx, recipes-grid.tsx, and the public
profile page's recipe grid.

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

apps/web/components/recipe/recipes-grid.tsx

@@ -25,6 +25,7 @@ import {
 } from "@/components/ui/alert-dialog";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
 import { FavoriteButton } from "@/components/social/favorite-button";
+import { RecipeCoverPlaceholder } from "@/components/recipe/recipe-cover-placeholder";
 import { toast } from "sonner";
 import { getPublicUrl } from "@/lib/storage";
 import { useLocale } from "@/lib/i18n/provider";
@@ -92,9 +93,10 @@ function RecipeThumb({ recipe, selectMode, selected, className }: { recipe: Reci
           )}
         />
       ) : (
-        <div className={cn("w-full h-full flex items-center justify-center text-2xl", selectMode && !selected && "opacity-60")}>
-          {recipe.recipeType === "drink" ? "🍹" : "🍽️"}
-        </div>
+        <RecipeCoverPlaceholder
+          recipe={recipe}
+          className={cn(selectMode && !selected && "opacity-60")}
+        />
       )}
       {selectMode && selected && <div className="absolute inset-0 bg-primary/20" />}
       {selectMode && (