fix(flowpilot): make action bar fixed to viewport bottom

Previous approach tried to fix the flex height chain, but it proved fragile
across grid → main → outlet → page transitions. New approach: action bar is
position:fixed at the bottom of the viewport, offset by sidebar width via
CSS variable --sidebar-w. Conversation area has pb-20 for clearance.

This works regardless of the height chain, email verification banner,
or any other variable-height elements above the session.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

frontend/src/components/flowpilot/FlowPilotActionBar.tsx

@@ -53,10 +53,10 @@ export function FlowPilotActionBar({
 
   return (
     <>
-      {/* Bottom bar */}
+      {/* Bottom bar — fixed to viewport bottom, works regardless of height chain */}
       <div
-        className="flex flex-col gap-2 sm:flex-row sm:items-center sm:gap-3 border-t px-3 py-3 sm:px-5"
-        style={{ borderColor: 'var(--glass-border)', background: 'rgba(16, 17, 20, 0.8)', backdropFilter: 'blur(12px)' }}
+        className="fixed bottom-0 right-0 z-40 flex flex-col gap-2 sm:flex-row sm:items-center sm:gap-3 border-t px-3 py-3 sm:px-5"
+        style={{ borderColor: 'var(--glass-border)', background: 'rgba(16, 17, 20, 0.95)', backdropFilter: 'blur(16px)', left: 'var(--sidebar-w, 0px)' }}
       >
         <div className="flex gap-2 sm:gap-3">
           <button

frontend/src/components/flowpilot/FlowPilotSession.tsx

@@ -193,8 +193,8 @@ export function FlowPilotSession({
 
       {/* Main content area: conversation + sidebar */}
       <div className="flex flex-1 min-h-0">
-        {/* Conversation column */}
-        <div ref={scrollRef} className="flex-1 overflow-y-auto p-3 sm:p-4 lg:p-6">
+        {/* Conversation column — pb-20 provides clearance for the fixed action bar */}
+        <div ref={scrollRef} className="flex-1 overflow-y-auto p-3 pb-20 sm:p-4 sm:pb-20 lg:p-6 lg:pb-20">
           <div className="mx-auto max-w-2xl space-y-3">
             {allSteps.map((step) => (
               <FlowPilotStepCard

frontend/src/pages/FlowPilotSessionPage.tsx

@@ -139,11 +139,9 @@ export default function FlowPilotSessionPage() {
     )
   }
 
-  // Active/completed session — use calc(100vh-56px) to match tree editor pattern
-  // (56px = topbar height). This bypasses the flex height chain which doesn't
-  // reliably propagate through the grid → main → outlet → page chain.
+  // Active/completed session
   return (
-    <div className="flex h-[calc(100vh-56px)] flex-col overflow-hidden">
+    <div className="flex h-full flex-col">
       {/* Header */}
       <div
         className="flex items-center gap-3 border-b px-5 py-3 shrink-0"