Cleanup: ConfirmModal primitive, drop dead PageStub, full-width editor (#107)

Three tidy-ups from the audit's deferred list:

- Extracted a ConfirmModal primitive (message + Cancel/Confirm, owning the
  busy lock + inline error) and folded the five hand-rolled confirm dialogs
  onto it: DeleteGarden, LeaveGarden, DeletePlant, DeleteSeedLot, ClearBed.
  Each is now just its message + mutation + labels. Bonus: ClearBed now
  shows a failure inline instead of swallowing it. (CopyGarden stays on
  Modal — it has a name field, not a plain confirm.)
- Removed components/PageStub.tsx — dead scaffolding, imported nowhere.
- The garden editor was squeezed into the max-w-5xl reading measure the
  other pages use; the canvas routes (editor + public garden) now go
  edge-to-edge on desktop, and the top bar matches so the brand aligns with
  the editor's left edge. Mobile was already full-width, so it's unchanged.

Verified live: the Delete-garden confirm renders/cancels; the desktop editor
now uses the full viewport width. tsc + vitest + build green.

Co-Authored-By: Claude Opus 4.8 (1M context) <[email protected]>
Claude-Session: https://claude.ai/code/session_01H3zbym8Doka2d7D48maSgZ

web/src/components/layout/AppShell.tsx

@@ -39,14 +39,19 @@ export function AppShell() {
   // so the '/gardens' list itself still shows the bar.
   const inEditor = !!matchRoute({ to: '/gardens/$gardenId', fuzzy: false })
   const inPublicGarden = !!matchRoute({ to: '/g/$token', fuzzy: false })
-  const showBottomNav = !!user && !inEditor && !inPublicGarden
+  // A canvas route wants the whole width — the garden editor is squeezed by the
+  // max-w-5xl reading measure the other pages use (#107).
+  const canvasRoute = inEditor || inPublicGarden
+  const showBottomNav = !!user && !canvasRoute
 
   const visibleSections = sections.filter((s) => !s.adminOnly || user?.isAdmin)
 
   return (
     <div className="flex min-h-full flex-col">
       <header className="sticky top-0 z-20 border-b border-border bg-surface/90 backdrop-blur">
-        <nav className="mx-auto flex max-w-5xl items-center gap-4 px-4 py-3">
+        {/* The bar matches the content width below: constrained on reading pages,
+            edge-to-edge on the canvas routes so the brand aligns with the editor. */}
+        <nav className={cn('flex items-center gap-4 px-4 py-3', canvasRoute ? '' : 'mx-auto max-w-5xl')}>
           <Link to="/gardens" className="text-lg font-semibold text-accent-strong">
             🌱 pansy
           </Link>
@@ -87,7 +92,10 @@ export function AppShell() {
 
       <main
         className={cn(
-          'mx-auto w-full max-w-5xl flex-1 px-4 py-6',
+          'w-full flex-1 px-4 py-6',
+          // Constrain the reading pages to a comfortable measure; the canvas
+          // routes go edge-to-edge so the garden gets the whole screen.
+          !canvasRoute && 'mx-auto max-w-5xl',
           // Clear the fixed bottom bar on mobile so content isn't hidden behind
           // it. The 3.5rem must match BottomNav's h-14 (kept adjacent below).
           showBottomNav && 'pb-[calc(3.5rem+env(safe-area-inset-bottom))] md:pb-6',