feat: mobile close button at bottom of chat view for thumb reach

Hide top-right pill on mobile, add bottom-positioned close button
using useMobileBackButton composable for proper tab bar clearance.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

.claude/plans/reflective-meandering-castle.md

@@ -15,7 +15,7 @@ After getting Claude Max OAuth working on the live server, hardening the deploy
 - **Change**: Increase mobile insets from `0.75rem` to `1.25rem` for both `top` and `right`
 - **Verify**: Open `/dashboard/chat` on mobile viewport, pill not flush against edges
 
-### Task 2: AIUI close button mobile UX
+### Task 2: AIUI close button mobile UX [DONE]
 - **Files**: `neode-ui/src/views/Chat.vue`, `neode-ui/src/style.css`
 - **Change**: On mobile (`md:hidden`), move close pill to bottom-center using `useMobileBackButton` composable. Hide top-right pill on mobile (`hidden md:flex`). Add a second close button at bottom that's thumb-reachable.
 - **Verify**: Mobile: close button at bottom (easy reach). Desktop: pill at top-right unchanged.

neode-ui/src/views/Chat.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="chat-fullscreen">
-    <!-- Close button + connection indicator -->
-    <div class="chat-mode-pill">
+    <!-- Close button + connection indicator (desktop only) -->
+    <div class="chat-mode-pill hidden md:flex">
       <button class="chat-close-btn" @click="closeChat">
         <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
           <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
@@ -15,6 +15,18 @@
       />
     </div>
 
+    <!-- Mobile close button (bottom, thumb-reachable) -->
+    <button
+      class="md:hidden fixed left-4 right-4 z-40 glass-button px-6 py-3 rounded-lg font-medium shadow-2xl flex items-center justify-center gap-2"
+      :style="{ bottom: bottomPosition, filter: 'drop-shadow(0 10px 25px rgba(0, 0, 0, 0.5))' }"
+      @click="closeChat"
+    >
+      <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+      </svg>
+      Close Chat
+    </button>
+
     <!-- Loading indicator while iframe loads -->
     <Transition name="fade">
       <div v-if="aiuiUrl && !aiuiConnected" class="chat-loading">
@@ -60,7 +72,9 @@
 import { ref, computed, onMounted, onBeforeUnmount } from 'vue'
 import { useRouter } from 'vue-router'
 import { ContextBroker } from '@/services/contextBroker'
+import { useMobileBackButton } from '@/composables/useMobileBackButton'
 
+const { bottomPosition } = useMobileBackButton()
 const router = useRouter()
 const aiuiFrame = ref<HTMLIFrameElement | null>(null)
 const aiuiConnected = ref(false)