feat(layout): responsive layout with side-by-side detail and mobile tabs

Desktop (>= 1024px):
- Content grid and detail pane shown side-by-side when a detail is selected
- Three-column layout: chat | grid | detail
- Grid takes 45% width, detail fills remaining space

Mobile (< 1024px):
- Bottom tab bar with "Chat" and "Content" tabs
- Only one view visible at a time
- Auto-switches to Content tab when panel opens
- Orange dot indicator on Content tab when content is available

Extracted reusable components:
- ContentGridView: all grid renderers in one component
- DetailView: all detail views in one component
- CloseButton: reusable close/dismiss button

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

packages/app/src/components/content/CloseButton.vue

@@ -0,0 +1,22 @@
+<template>
+  <button
+    class="absolute top-3 right-3 z-10 p-2 rounded-lg path-glass-icon transition-colors"
+    :class="isDark
+      ? 'text-white/70 hover:bg-white/10'
+      : 'text-gray-500 hover:bg-black/5 hover:text-gray-800'"
+    title="Close"
+    aria-label="Close"
+    @click="$emit('click')"
+  >
+    <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>
+  </button>
+</template>
+
+<script setup lang="ts">
+import { useTheme } from '@/composables/useTheme'
+
+const { isDark } = useTheme()
+defineEmits<{ click: [] }>()
+</script>