fix: substitute lookup, zero-quantity display, chatbot close button + markdown

- Substitute finder never applied the user's BYOK/admin AI key (only fell
  back to raw process.env), so it silently failed whenever the key was
  stored via settings rather than a literal env var. Now resolves via
  getDefaultProviderWithKey like every other AI route. Popover also
  surfaces real error messages instead of swallowing failures.
- Ingredients with quantity 0 (salt, pepper, "to taste") rendered the
  literal digit "0" in cooking mode, print view, public recipe page,
  shopping lists, and serving scaler — several sites relied on generic
  truthiness/filter(Boolean), which doesn't catch a stored "0" string.
  Added a shared hasQuantity() helper and applied it everywhere quantity
  is rendered, plus in the AI recipe-chat context sent to the model.
- Recipe chat panel rendered a duplicate close button on top of shadcn
  Sheet's own built-in close X, producing a garbled overlapping glyph.
  Removed the duplicate.
- Recipe chat assistant replies are markdown from the model but were
  rendered as raw text; added react-markdown so formatting actually
  renders.

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

apps/web/components/recipe/recipe-chat-panel.tsx

@@ -4,7 +4,8 @@ import { useState, useRef, useEffect } from "react";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Sheet, SheetContent, SheetHeader, SheetTitle } from "@/components/ui/sheet";
-import { MessageCircle, Send, X, Bot, User } from "lucide-react";
+import { MessageCircle, Send, Bot, User } from "lucide-react";
+import ReactMarkdown from "react-markdown";
 import { cn } from "@/lib/utils";
 
 type Message = {
@@ -81,16 +82,11 @@ export function RecipeChatPanel({ recipeId, recipeTitle }: Props) {
 
       <Sheet open={open} onOpenChange={setOpen}>
         <SheetContent side="right" className="w-full sm:w-[420px] flex flex-col p-0">
-          <SheetHeader className="px-4 py-3 border-b shrink-0">
-            <div className="flex items-center justify-between">
-              <SheetTitle className="text-base flex items-center gap-2">
-                <Bot className="h-4 w-4 text-primary" />
-                Ask about this recipe
-              </SheetTitle>
-              <Button variant="ghost" size="icon" className="h-7 w-7" onClick={() => setOpen(false)}>
-                <X className="h-4 w-4" />
-              </Button>
-            </div>
+          <SheetHeader className="px-4 py-3 pr-10 border-b shrink-0">
+            <SheetTitle className="text-base flex items-center gap-2">
+              <Bot className="h-4 w-4 text-primary" />
+              Ask about this recipe
+            </SheetTitle>
             <p className="text-xs text-muted-foreground text-left">{recipeTitle}</p>
           </SheetHeader>
 
@@ -131,12 +127,16 @@ export function RecipeChatPanel({ recipeId, recipeTitle }: Props) {
                   {msg.role === "user" ? <User className="h-3.5 w-3.5" /> : <Bot className="h-3.5 w-3.5" />}
                 </div>
                 <div className={cn(
-                  "rounded-xl px-3 py-2 text-sm max-w-[80%] leading-relaxed whitespace-pre-wrap",
+                  "rounded-xl px-3 py-2 text-sm max-w-[80%] leading-relaxed",
                   msg.role === "user"
-                    ? "bg-primary text-primary-foreground"
-                    : "bg-muted"
+                    ? "bg-primary text-primary-foreground whitespace-pre-wrap"
+                    : "bg-muted space-y-2 [&_ul]:list-disc [&_ol]:list-decimal [&_ul]:pl-4 [&_ol]:pl-4 [&_strong]:font-semibold [&_li]:my-0.5"
                 )}>
-                  {msg.content}
+                  {msg.role === "assistant" ? (
+                    <ReactMarkdown>{msg.content}</ReactMarkdown>
+                  ) : (
+                    msg.content
+                  )}
                 </div>
               </div>
             ))}