Reclaim mobile chrome: drop the editor's top banner, un-cramp the assistant

Two mobile complaints, both in the editor/assistant context:

- The global top bar (brand + account) sat above the editor's own
  garden-name strip — a whole banner of pure chrome over a full-screen
  canvas. Hide it on mobile in the editor (the same rationale that hides
  the bottom nav there) and fold a leaf/back affordance into the garden
  strip so there's still a way out. Desktop keeps the header. The editor's
  height band shrinks 8rem → 4rem on mobile to hand that space to the
  canvas; desktop stays 8rem since the header is still there.

- The assistant (and journal/history) rendered inside the rail peek
  capped at max-h-[50vh]; after the tab bar, header and input, messages
  got ~200px. That cap is right for the inspector (read alongside the
  canvas) but not for a mode where reading/typing is the task. Panel
  modes now take a taller slice (78vh) via a `tall` prop; the inspector
  keeps the 50vh peek. Chat message spacing loosened gap-2 → gap-3.

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

@@ -43,12 +43,23 @@ export function AppShell() {
   // max-w-5xl reading measure the other pages use (#107).
   const canvasRoute = inEditor || inPublicGarden
   const showBottomNav = !!user && !canvasRoute
+  // On a phone the editor is a full-screen canvas — the same reason the bottom
+  // bar hides there. The global top bar (brand + account) is then pure chrome
+  // above the garden, so hide it too and let the editor's own strip carry a back
+  // affordance; desktop keeps the header. Only the editor, not the public view,
+  // which has no strip of its own to fall back on.
+  const hideHeaderOnMobile = inEditor
 
   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">
+      <header
+        className={cn(
+          'sticky top-0 z-20 border-b border-border bg-surface/90 backdrop-blur',
+          hideHeaderOnMobile && 'hidden md:block',
+        )}
+      >
         {/* 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')}>