diff --git a/frontend/src/assets/theme.css b/frontend/src/assets/theme.css
index b72322f..dd65cb9 100644
--- a/frontend/src/assets/theme.css
+++ b/frontend/src/assets/theme.css
@@ -54,7 +54,7 @@
   --page-max-width: 1200px;
   --page-padding-x: 1rem;
   --sidebar-width: 260px;
-  --chat-reading-width: min(820px, 100%);
+  --chat-reading-width: min(1200px, 100%);
   --chat-context-sidebar-width: 220px;
   --color-accent-warm: #b8860b;
   --color-accent-warm-light: #d4a017;
diff --git a/frontend/src/components/ChatInputBar.vue b/frontend/src/components/ChatInputBar.vue
index 8779219..2097eb9 100644
--- a/frontend/src/components/ChatInputBar.vue
+++ b/frontend/src/components/ChatInputBar.vue
@@ -1,8 +1,11 @@
 <script setup lang="ts">
-import { ref, computed, nextTick } from 'vue'
+import { ref, computed, nextTick, onMounted, onUnmounted } from 'vue'
 import { apiGet, transcribeAudio } from '@/api/client'
 import { useVoiceRecorder } from '@/composables/useVoiceRecorder'
 import { useSilenceDetector } from '@/composables/useSilenceDetector'
+import { useStreamingTts } from '@/composables/useStreamingTts'
+import { useVoiceAudio, setVoiceVolume } from '@/composables/useVoiceAudio'
+import { useListenMode } from '@/composables/useListenMode'
 import { useChatStore } from '@/stores/chat'
 import { useSettingsStore } from '@/stores/settings'
 import { useToastStore } from '@/stores/toast'
@@ -29,6 +32,32 @@ const emit = defineEmits<{
 const store = useChatStore()
 const settingsStore = useSettingsStore()
 const voiceEnabled = computed(() => settingsStore.voiceSttReady)
+const voiceTtsEnabled = computed(() => settingsStore.voiceTtsReady)
+
+// ── Streaming TTS (listen mode) ───────────────────────────────────────────────
+const listenMode = useListenMode()
+const audio = useVoiceAudio()
+const speakerPopoverOpen = ref(false)
+
+const tts = useStreamingTts({
+  streamingContent: computed(() => store.streamingContent),
+  streaming: computed(() => store.streaming),
+  enabled: computed(() => listenMode.value && voiceTtsEnabled.value),
+})
+
+function lastAssistantContent(): string {
+  const msgs = store.currentConversation?.messages ?? []
+  return [...msgs].reverse().find((m) => m.role === 'assistant')?.content ?? ''
+}
+
+function toggleListen() {
+  listenMode.value = !listenMode.value
+  if (listenMode.value) {
+    tts.speak(lastAssistantContent())
+  } else {
+    tts.stop()
+  }
+}
 
 // ── Core input ────────────────────────────────────────────────────────────────
 const messageInput = ref('')
@@ -173,6 +202,15 @@ async function stopRecording() {
   finally { transcribingVoice.value = false }
 }
 
+// ── Click-outside to dismiss speaker popover ──────────────────────────────────
+function onDocumentMousedown(e: MouseEvent) {
+  if (!speakerPopoverOpen.value) return
+  const target = e.target as HTMLElement | null
+  if (!target?.closest('.speaker-wrapper')) speakerPopoverOpen.value = false
+}
+onMounted(() => document.addEventListener('mousedown', onDocumentMousedown))
+onUnmounted(() => document.removeEventListener('mousedown', onDocumentMousedown))
+
 // ── Exposed interface ─────────────────────────────────────────────────────────
 function focus() {
   inputEl.value?.focus()
@@ -244,6 +282,53 @@ defineExpose({ focus, prefill })
         class="input-textarea"
       ></textarea>
 
+      <!-- Speaker / listen-mode popover -->
+      <div v-if="voiceTtsEnabled" class="speaker-wrapper">
+        <button
+          class="btn-icon btn-speaker"
+          :class="{ 'speaker-active': listenMode, 'speaker-busy': tts.speaking.value }"
+          @click="speakerPopoverOpen = !speakerPopoverOpen"
+          :title="listenMode ? 'Listen mode on' : 'Listen / volume'"
+          aria-label="Listen and volume settings"
+        >
+          <svg v-if="!tts.speaking.value" width="17" height="17" viewBox="0 0 24 24" fill="currentColor">
+            <path d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z"/>
+          </svg>
+          <svg v-else width="17" height="17" viewBox="0 0 24 24" fill="currentColor">
+            <path d="M18 12c0-1.77-1.02-3.29-2.5-4.03v2.21l2.45 2.45c.03-.2.05-.41.05-.63zm2.5 0c0 .94-.2 1.82-.54 2.64l1.51 1.51C21.8 14.82 22 13.43 22 12c0-4.28-2.99-7.86-7-8.77v2.06c2.89.86 5 3.54 5 6.71zM4.27 3L3 4.27 7.73 9H3v6h4l5 5v-6.73l4.25 4.25c-.67.52-1.42.93-2.25 1.18v2.06c1.38-.31 2.63-.95 3.69-1.81L19.73 21 21 19.73l-9-9L4.27 3zM12 4L9.91 6.09 12 8.18V4z"/>
+          </svg>
+        </button>
+        <div v-if="speakerPopoverOpen" class="speaker-popover">
+          <button
+            class="speaker-row speaker-row--toggle"
+            :class="{ 'speaker-row--active': listenMode }"
+            @click="toggleListen"
+          >
+            <span class="speaker-row-label">{{ listenMode ? 'Listening' : 'Read aloud' }}</span>
+            <span class="speaker-switch" :class="{ on: listenMode }"></span>
+          </button>
+          <div class="speaker-row">
+            <span class="speaker-row-label">Volume</span>
+            <input
+              type="range" min="0" max="1" step="0.05"
+              :value="audio.volume.value"
+              @input="setVoiceVolume(+($event.target as HTMLInputElement).value)"
+              class="speaker-volume-range"
+              aria-label="Volume"
+            />
+            <span class="speaker-volume-pct">{{ Math.round(audio.volume.value * 100) }}%</span>
+          </div>
+          <button
+            v-if="tts.speaking.value"
+            class="speaker-row speaker-row--stop"
+            @click="tts.stop()"
+          >
+            <svg width="12" height="12" viewBox="0 0 14 14" fill="currentColor"><rect width="14" height="14" rx="2"/></svg>
+            <span>Stop playback</span>
+          </button>
+        </div>
+      </div>
+
       <!-- PTT mic (with live amplitude halo behind) -->
       <div v-if="voiceEnabled" class="mic-wrapper">
         <div class="mic-glow" :style="micGlowStyle" aria-hidden="true"></div>
@@ -475,4 +560,77 @@ defineExpose({ focus, prefill })
   flex-shrink: 0;
 }
 .btn-abort-inline:hover { border-color: #ef4444; color: #ef4444; }
+
+/* Speaker / listen-mode popover */
+.speaker-wrapper { position: relative; display: inline-flex; flex-shrink: 0; }
+.btn-speaker.speaker-active { opacity: 1; color: var(--color-primary); }
+.btn-speaker.speaker-busy { opacity: 1; color: #f59e0b; }
+.speaker-popover {
+  position: absolute;
+  bottom: calc(100% + 8px);
+  right: 0;
+  min-width: 220px;
+  background: var(--color-bg-card);
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-md);
+  box-shadow: 0 4px 16px var(--color-shadow);
+  padding: 0.35rem;
+  z-index: 30;
+  display: flex;
+  flex-direction: column;
+  gap: 0.2rem;
+}
+.speaker-row {
+  display: flex;
+  align-items: center;
+  gap: 0.6rem;
+  padding: 0.45rem 0.6rem;
+  background: none;
+  border: none;
+  border-radius: var(--radius-sm);
+  color: var(--color-text);
+  font-size: 0.85rem;
+  cursor: default;
+  text-align: left;
+  width: 100%;
+}
+.speaker-row--toggle { cursor: pointer; }
+.speaker-row--toggle:hover { background: var(--color-bg-secondary); }
+.speaker-row--active { color: var(--color-primary); }
+.speaker-row--stop {
+  cursor: pointer;
+  color: var(--color-text-muted);
+  justify-content: flex-start;
+}
+.speaker-row--stop:hover { color: #ef4444; background: var(--color-bg-secondary); }
+.speaker-row-label { flex: 1; }
+.speaker-volume-range { flex: 1; min-width: 0; }
+.speaker-volume-pct {
+  font-size: 0.75rem;
+  color: var(--color-text-muted);
+  min-width: 2.5rem;
+  text-align: right;
+}
+.speaker-switch {
+  position: relative;
+  width: 28px;
+  height: 16px;
+  border-radius: 9999px;
+  background: var(--color-border);
+  transition: background 0.15s;
+  flex-shrink: 0;
+}
+.speaker-switch::after {
+  content: '';
+  position: absolute;
+  top: 2px;
+  left: 2px;
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+  background: var(--color-bg-card);
+  transition: transform 0.15s;
+}
+.speaker-switch.on { background: var(--color-primary); }
+.speaker-switch.on::after { transform: translateX(12px); }
 </style>
diff --git a/frontend/src/components/ChatPanel.vue b/frontend/src/components/ChatPanel.vue
index 1c8b40e..4a60884 100644
--- a/frontend/src/components/ChatPanel.vue
+++ b/frontend/src/components/ChatPanel.vue
@@ -1,11 +1,6 @@
 <script setup lang="ts">
 import { ref, computed, watch, nextTick, onMounted } from 'vue'
 import { useChatStore } from '@/stores/chat'
-import { useSettingsStore } from '@/stores/settings'
-import { useStreamingTts } from '@/composables/useStreamingTts'
-import { useVoiceAudio, setVoiceVolume } from '@/composables/useVoiceAudio'
-import { useListenMode } from '@/composables/useListenMode'
-import { apiGet } from '@/api/client'
 import ChatMessage from '@/components/ChatMessage.vue'
 import ChatStreamingBubble from '@/components/ChatStreamingBubble.vue'
 import ChatInputBar from '@/components/ChatInputBar.vue'
@@ -34,33 +29,6 @@ const emit = defineEmits<{
 }>()
 
 const store = useChatStore()
-const settingsStore = useSettingsStore()
-
-// ── Voice / TTS ───────────────────────────────────────────────────────────────
-const voiceTtsEnabled = computed(() => settingsStore.voiceTtsReady)
-const listenMode = useListenMode()
-const audio = useVoiceAudio()
-const showVolumeSlider = ref(false)
-
-const tts = useStreamingTts({
-  streamingContent: computed(() => store.streamingContent),
-  streaming: computed(() => store.streaming),
-  enabled: computed(() => listenMode.value && voiceTtsEnabled.value),
-})
-
-function lastAssistantContent(): string {
-  const msgs = store.currentConversation?.messages ?? []
-  return [...msgs].reverse().find((m) => m.role === 'assistant')?.content ?? ''
-}
-
-function toggleListen() {
-  listenMode.value = !listenMode.value
-  if (listenMode.value) {
-    tts.speak(lastAssistantContent())
-  } else {
-    tts.stop()
-  }
-}
 
 // ── Scroll ────────────────────────────────────────────────────────────────────
 const messagesEl = ref<HTMLElement | null>(null)
@@ -89,47 +57,6 @@ watch(() => store.streamingToolCalls, (calls) => {
 }, { deep: true })
 watch(() => store.streaming, (s) => { if (!s) _seenCalendarToolIdx.clear() })
 
-// ── RAG scope chip (full, non-briefing, non-workspace) ────────────────────────
-const projects = ref<{ id: number; title: string }[]>([])
-const scopeDropdownOpen = ref(false)
-const scopePulse = ref(false)
-
-const showScopeChip = computed(
-  () => props.variant === 'full' && !props.briefingMode && !props.projectId
-)
-
-const scopeLabel = computed(() => {
-  const id = store.ragProjectId
-  if (id === -1) return 'All notes'
-  if (id === null) return 'Orphan notes'
-  return projects.value.find((p) => p.id === id)?.title ?? `Project ${id}`
-})
-
-async function loadProjects() {
-  try {
-    const data = await apiGet<{ projects: { id: number; title: string }[] }>('/api/projects?status=active')
-    projects.value = data.projects ?? []
-  } catch {
-    projects.value = []
-  }
-}
-
-async function onScopeSelect(value: number | null) {
-  scopeDropdownOpen.value = false
-  const convId = store.currentConversation?.id
-  if (!convId) return
-  await store.updateRagScope(convId, value)
-  scopePulse.value = true
-  setTimeout(() => { scopePulse.value = false }, 600)
-}
-
-// Pulse when model-driven scope change fires
-watch(() => store.ragProjectId, () => {
-  if (!showScopeChip.value) return
-  scopePulse.value = true
-  setTimeout(() => { scopePulse.value = false }, 600)
-})
-
 // ── Note context (full variant — included / suggested / auto-injected notes) ──
 const includedNoteIds = ref<Set<number>>(new Set())
 const includedNotes = ref<{ id: number; title: string }[]>([])
@@ -271,8 +198,7 @@ async function handleSaveAsNote(messageId: number) {
 }
 
 // ── Lifecycle ─────────────────────────────────────────────────────────────────
-onMounted(async () => {
-  if (showScopeChip.value) await loadProjects()
+onMounted(() => {
   if (props.autoFocus) nextTick(() => inputBarRef.value?.focus())
 })
 
@@ -394,79 +320,6 @@ defineExpose({ focus, prefill, send })
 
       <!-- Input area (hidden when readOnly) -->
       <div v-if="!readOnly" class="input-wrapper">
-      <!-- Scope chip -->
-      <div v-if="showScopeChip" class="scope-chip-row">
-        <div class="scope-chip-wrapper">
-          <button
-            class="scope-chip"
-            :class="{ pulse: scopePulse }"
-            @click="scopeDropdownOpen = !scopeDropdownOpen"
-            title="Change RAG scope"
-          >
-            <span class="scope-dot">⊙</span> {{ scopeLabel }}
-          </button>
-          <div v-if="scopeDropdownOpen" class="scope-dropdown">
-            <button class="scope-option" :class="{ active: store.ragProjectId === null }" @click="onScopeSelect(null)">Orphan notes only</button>
-            <button
-              v-for="p in projects"
-              :key="p.id"
-              class="scope-option"
-              :class="{ active: store.ragProjectId === p.id }"
-              @click="onScopeSelect(p.id)"
-            >{{ p.title }}</button>
-            <button class="scope-option" :class="{ active: store.ragProjectId === -1 }" @click="onScopeSelect(-1)">All notes</button>
-          </div>
-        </div>
-      </div>
-
-      <!-- Listen / volume controls -->
-      <div v-if="voiceTtsEnabled" class="voice-controls">
-        <div class="volume-wrapper">
-          <button
-            class="btn-voice"
-            :class="{ 'btn-voice--active': listenMode, 'btn-voice--busy': tts.speaking.value }"
-            @click="toggleListen"
-            :title="listenMode ? 'Stop auto-read' : 'Read responses aloud'"
-            aria-label="Toggle listen mode"
-          >
-            <svg v-if="!tts.speaking.value" width="17" height="17" viewBox="0 0 24 24" fill="currentColor">
-              <path d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z"/>
-            </svg>
-            <svg v-else width="17" height="17" viewBox="0 0 24 24" fill="currentColor">
-              <path d="M18 12c0-1.77-1.02-3.29-2.5-4.03v2.21l2.45 2.45c.03-.2.05-.41.05-.63zm2.5 0c0 .94-.2 1.82-.54 2.64l1.51 1.51C21.8 14.82 22 13.43 22 12c0-4.28-2.99-7.86-7-8.77v2.06c2.89.86 5 3.54 5 6.71zM4.27 3L3 4.27 7.73 9H3v6h4l5 5v-6.73l4.25 4.25c-.67.52-1.42.93-2.25 1.18v2.06c1.38-.31 2.63-.95 3.69-1.81L19.73 21 21 19.73l-9-9L4.27 3zM12 4L9.91 6.09 12 8.18V4z"/>
-            </svg>
-          </button>
-          <button
-            class="btn-voice btn-volume-icon"
-            @click="showVolumeSlider = !showVolumeSlider"
-            :title="`Volume: ${Math.round(audio.volume.value * 100)}%`"
-            aria-label="Volume"
-          >
-            <svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor">
-              <path d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02z"/>
-            </svg>
-          </button>
-          <div v-if="showVolumeSlider" class="volume-popup">
-            <input
-              type="range" min="0" max="1" step="0.05"
-              :value="audio.volume.value"
-              @input="setVoiceVolume(+($event.target as HTMLInputElement).value)"
-              class="volume-range"
-              aria-label="Volume"
-            />
-            <span class="volume-pct">{{ Math.round(audio.volume.value * 100) }}%</span>
-          </div>
-        </div>
-        <button
-          v-if="tts.speaking.value"
-          class="btn-voice"
-          @click="tts.stop()"
-          title="Stop playback"
-        >
-          <svg width="13" height="13" viewBox="0 0 14 14" fill="currentColor"><rect width="14" height="14" rx="2"/></svg>
-        </button>
-      </div>
-
       <!-- Unified input bar -->
       <ChatInputBar
         ref="inputBarRef"
@@ -642,94 +495,6 @@ defineExpose({ focus, prefill, send })
   gap: 0.4rem;
 }
 
-/* Scope chip */
-.scope-chip-row { display: flex; }
-.scope-chip-wrapper { position: relative; }
-.scope-chip {
-  display: flex;
-  align-items: center;
-  gap: 0.3rem;
-  background: none;
-  border: 1px solid var(--color-border);
-  border-radius: 20px;
-  padding: 0.2rem 0.65rem;
-  font-size: 0.75rem;
-  color: var(--color-text-muted);
-  cursor: pointer;
-  transition: border-color 0.15s, color 0.15s;
-}
-.scope-chip:hover { border-color: var(--color-primary); color: var(--color-primary); }
-.scope-chip.pulse { animation: pulse-chip 0.6s ease; }
-@keyframes pulse-chip {
-  0%, 100% { border-color: var(--color-border); }
-  50% { border-color: var(--color-primary); color: var(--color-primary); box-shadow: 0 0 6px rgba(99,102,241,0.4); }
-}
-.scope-dot { font-size: 0.6rem; }
-.scope-dropdown {
-  position: absolute;
-  top: calc(100% + 4px);
-  left: 0;
-  min-width: 180px;
-  background: var(--color-bg-card);
-  border: 1px solid var(--color-border);
-  border-radius: var(--radius-md);
-  box-shadow: 0 4px 16px var(--color-shadow);
-  z-index: 20;
-  overflow: hidden;
-}
-.scope-option {
-  display: block;
-  width: 100%;
-  padding: 0.45rem 0.75rem;
-  text-align: left;
-  background: none;
-  border: none;
-  font-size: 0.85rem;
-  color: var(--color-text);
-  cursor: pointer;
-}
-.scope-option:hover { background: var(--color-bg-secondary); }
-.scope-option.active { color: var(--color-primary); font-weight: 600; }
-
-/* Voice controls */
-.voice-controls {
-  display: flex;
-  align-items: center;
-  gap: 0.2rem;
-}
-.volume-wrapper { position: relative; display: flex; align-items: center; gap: 0.1rem; }
-.btn-voice {
-  background: none;
-  border: none;
-  cursor: pointer;
-  color: var(--color-text-muted);
-  opacity: 0.65;
-  padding: 0.2rem;
-  display: flex;
-  align-items: center;
-  border-radius: var(--radius-sm);
-  transition: opacity 0.15s, color 0.15s;
-}
-.btn-voice:hover { opacity: 1; }
-.btn-voice--active { opacity: 1; color: var(--color-primary); }
-.btn-voice--busy { opacity: 1; color: #f59e0b; }
-.volume-popup {
-  position: absolute;
-  bottom: calc(100% + 8px);
-  left: 0;
-  background: var(--color-bg-card);
-  border: 1px solid var(--color-border);
-  border-radius: var(--radius-md);
-  padding: 0.5rem 0.75rem;
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  z-index: 20;
-  box-shadow: 0 4px 16px var(--color-shadow);
-}
-.volume-range { width: 80px; }
-.volume-pct { font-size: 0.75rem; color: var(--color-text-muted); white-space: nowrap; }
-
 /* Queued messages */
 .queued-message { opacity: 0.45; }
 .queued-bubble {
diff --git a/frontend/src/views/ChatView.vue b/frontend/src/views/ChatView.vue
index c6aaf9a..e16c3aa 100644
--- a/frontend/src/views/ChatView.vue
+++ b/frontend/src/views/ChatView.vue
@@ -2,6 +2,7 @@
 import { onMounted, onUnmounted, ref, computed, watch, nextTick } from "vue";
 import { useRoute, useRouter } from "vue-router";
 import { useChatStore } from "@/stores/chat";
+import { apiGet } from "@/api/client";
 import ChatPanel from "@/components/ChatPanel.vue";
 
 const route = useRoute();
@@ -14,6 +15,46 @@ const convSearchQuery = ref("");
 const headerKebabOpen = ref(false);
 const sidebarKebabOpen = ref(false);
 
+// ── RAG scope chip ────────────────────────────────────────────────────────────
+const projects = ref<{ id: number; title: string }[]>([]);
+const scopeDropdownOpen = ref(false);
+const scopePulse = ref(false);
+
+const scopeLabel = computed(() => {
+  const id = store.ragProjectId;
+  if (id === -1) return "All notes";
+  if (id === null) return "Orphan notes";
+  return projects.value.find((p) => p.id === id)?.title ?? `Project ${id}`;
+});
+
+async function loadProjects() {
+  try {
+    const data = await apiGet<{ projects: { id: number; title: string }[] }>(
+      "/api/projects?status=active"
+    );
+    projects.value = data.projects ?? [];
+  } catch {
+    projects.value = [];
+  }
+}
+
+async function onScopeSelect(value: number | null) {
+  scopeDropdownOpen.value = false;
+  const id = store.currentConversation?.id;
+  if (!id) return;
+  await store.updateRagScope(id, value);
+  scopePulse.value = true;
+  setTimeout(() => { scopePulse.value = false; }, 600);
+}
+
+watch(
+  () => store.ragProjectId,
+  () => {
+    scopePulse.value = true;
+    setTimeout(() => { scopePulse.value = false; }, 600);
+  }
+);
+
 let prevConvId: number | null = null;
 
 const convId = computed(() => {
@@ -78,6 +119,7 @@ const groupedConversations = computed((): ConvGroup[] => {
 onMounted(async () => {
   document.addEventListener("keydown", onGlobalKeydown);
   document.addEventListener("mousedown", onDocumentMousedown);
+  loadProjects();
   await store.fetchConversations();
   if (convId.value) {
     if (store.currentConversation?.id !== convId.value) {
@@ -207,14 +249,18 @@ function onDocumentMousedown(e: MouseEvent) {
   if (sidebarKebabOpen.value && !target?.closest(".sidebar-kebab-wrapper")) {
     sidebarKebabOpen.value = false;
   }
+  if (scopeDropdownOpen.value && !target?.closest(".scope-chip-wrapper")) {
+    scopeDropdownOpen.value = false;
+  }
 }
 
 // ── Keyboard ──────────────────────────────────────────────────────────────────
 function onGlobalKeydown(e: KeyboardEvent) {
   if (e.key !== "Escape") return;
-  if (headerKebabOpen.value || sidebarKebabOpen.value) {
+  if (headerKebabOpen.value || sidebarKebabOpen.value || scopeDropdownOpen.value) {
     headerKebabOpen.value = false;
     sidebarKebabOpen.value = false;
+    scopeDropdownOpen.value = false;
     return;
   }
   if (sidebarOpen.value) {
@@ -344,6 +390,36 @@ onUnmounted(() => {
           </button>
           <h2>{{ store.currentConversation.title || "New Chat" }}</h2>
 
+          <div class="scope-chip-wrapper">
+            <button
+              class="scope-chip"
+              :class="{ pulse: scopePulse }"
+              @click="scopeDropdownOpen = !scopeDropdownOpen"
+              title="Change RAG scope"
+            >
+              <span class="scope-dot">⊙</span> {{ scopeLabel }}
+            </button>
+            <div v-if="scopeDropdownOpen" class="scope-dropdown">
+              <button
+                class="scope-option"
+                :class="{ active: store.ragProjectId === null }"
+                @click="onScopeSelect(null)"
+              >Orphan notes only</button>
+              <button
+                v-for="p in projects"
+                :key="p.id"
+                class="scope-option"
+                :class="{ active: store.ragProjectId === p.id }"
+                @click="onScopeSelect(p.id)"
+              >{{ p.title }}</button>
+              <button
+                class="scope-option"
+                :class="{ active: store.ragProjectId === -1 }"
+                @click="onScopeSelect(-1)"
+              >All notes</button>
+            </div>
+          </div>
+
           <div class="header-kebab-wrapper">
             <button
               class="btn-kebab"
@@ -588,6 +664,58 @@ onUnmounted(() => {
   position: relative;
 }
 
+/* RAG scope chip (header) */
+.scope-chip-wrapper { position: relative; flex-shrink: 0; }
+.scope-chip {
+  display: flex;
+  align-items: center;
+  gap: 0.3rem;
+  background: none;
+  border: 1px solid var(--color-border);
+  border-radius: 20px;
+  padding: 0.2rem 0.65rem;
+  font-size: 0.75rem;
+  color: var(--color-text-muted);
+  cursor: pointer;
+  transition: border-color 0.15s, color 0.15s;
+}
+.scope-chip:hover { border-color: var(--color-primary); color: var(--color-primary); }
+.scope-chip.pulse { animation: pulse-chip 0.6s ease; }
+@keyframes pulse-chip {
+  0%, 100% { border-color: var(--color-border); }
+  50% {
+    border-color: var(--color-primary);
+    color: var(--color-primary);
+    box-shadow: 0 0 6px rgba(99, 102, 241, 0.4);
+  }
+}
+.scope-dot { font-size: 0.6rem; }
+.scope-dropdown {
+  position: absolute;
+  top: calc(100% + 4px);
+  right: 0;
+  min-width: 200px;
+  background: var(--color-bg-card);
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-md);
+  box-shadow: 0 4px 16px var(--color-shadow);
+  z-index: 20;
+  overflow: hidden;
+}
+.scope-option {
+  display: block;
+  width: 100%;
+  padding: 0.45rem 0.75rem;
+  text-align: left;
+  background: none;
+  border: none;
+  font-size: 0.85rem;
+  color: var(--color-text);
+  cursor: pointer;
+}
+.scope-option:hover { background: var(--color-bg-secondary); }
+.scope-option.active { color: var(--color-primary); font-weight: 600; }
+
 .kebab-menu {
   position: absolute;
   top: calc(100% + 4px);