fix: mobile audit — Explore's AI-ideas input unusable, chat FAB overlap

Swept meal-plan, shopping-lists, pantry, nutrition, explore, feed,
collections, recipe detail/edit, and settings sub-pages at a real 390px
viewport. Two real bugs found (rest checked out clean — the meal-plan
calendar and settings tabs' horizontal scroll are intentional, not bugs):

- Explore's "Recipe ideas" input had no flex-basis and both buttons kept
  full text labels, squeezing the input down to ~2 visible characters
  on mobile. Input now flex-1, buttons icon-only below sm: (same pattern
  as the recipes-page Sort/Filter fix).
- Recipe detail page had no bottom clearance, so the fixed per-recipe
  chat button could sit directly on top of the private-notes Save
  button on short pages. Added pb-20, matching recipe-form.tsx's
  existing floating-save-bar clearance.

Verified both live at 390px: input now shows real placeholder text with
tappable icon buttons alongside it; Save button now clears the chat FAB
with real spacing.

apps/web/app/(app)/recipes/[id]/page.tsx

@@ -120,7 +120,10 @@ export default async function RecipePage({ params }: Params) {
   const VisibilityIcon = VISIBILITY_ICON[recipe.visibility];
 
   return (
-    <div className="max-w-4xl mx-auto space-y-8">
+    <div className="max-w-4xl mx-auto space-y-8 pb-20">
+      {/* pb-20 keeps the last section (private notes' Save button) clear of
+          the fixed recipe-chat button, which otherwise overlaps it on short
+          pages — same fix as recipe-form.tsx's floating save bar. */}
       <KeepScreenAwake />
       {/* Header */}
       <div className="space-y-4">