diff --git a/.changeset/fn-8533-mobile-planning-comments.md b/.changeset/fn-8533-mobile-planning-comments.md
new file mode 100644
index 0000000000..de11f705fc
--- /dev/null
+++ b/.changeset/fn-8533-mobile-planning-comments.md
@@ -0,0 +1,7 @@
+---
+"@runfusion/fusion": patch
+---
+
+summary: Keep Planning Mode selected-text comments reachable in the mobile action rail.
+category: fix
+dev: Mobile uses the plan footer at up to 768px; wider layouts retain the selection-adjacent trigger.
diff --git a/docs/dashboard-guide.md b/docs/dashboard-guide.md
index cf027bd054..6010aab427 100644
--- a/docs/dashboard-guide.md
+++ b/docs/dashboard-guide.md
@@ -2257,4 +2257,4 @@ Custom workflow authors can add optional explanatory copy beneath each column na
 
 ## Planning Mode contextual comments
 
-In plan review, select text inside the rendered plan and choose **Add comment to selection**. Enter a suggestion to capture the selected quote and suggestion as a pending contextual comment. You can remove individual comments before choosing **Submit comments**; Fusion sends the ordered batch through the existing Planning Mode revision generation, so the agent revises the quoted areas while preserving unaffected plan content. A successful revised-plan update clears the batch; a failed submission retains it for retry.
+In plan review, select text inside the rendered plan and choose **Add comment to selection**. On mobile widths through 768px, the selection action appears in the bottom plan-action rail beside **Refine** and **Proceed with plan**; at 769px and wider it stays beside the selected plan content. Enter a suggestion to capture the selected quote and suggestion as a pending contextual comment. You can remove individual comments before choosing **Submit comments**; Fusion sends the ordered batch through the existing Planning Mode revision generation, so the agent revises the quoted areas while preserving unaffected plan content. A successful revised-plan update clears the batch; a failed submission retains it for retry.
diff --git a/packages/dashboard/app/components/PlanningModeModal.css b/packages/dashboard/app/components/PlanningModeModal.css
index 03201e7ed1..6e0f74927f 100644
--- a/packages/dashboard/app/components/PlanningModeModal.css
+++ b/packages/dashboard/app/components/PlanningModeModal.css
@@ -1774,6 +1774,10 @@ its established Refine and Proceed action hierarchy.
   margin-top: var(--space-lg);
 }
 
+.planning-add-comment--mobile {
+  display: none;
+}
+
 .planning-comment-editor,
 .planning-comment-tray {
   display: flex;
@@ -1880,6 +1884,22 @@ Refine/Proceed actions share one compact bottom baseline; equal footer/button he
 plan actions, and a token-sized bottom inset keep all three controls inline without extra space.
 */
 @media (max-width: 768px) {
+  /*
+  FNXC:PlanningComments 2026-07-31-00:00:
+  A selected quote needs a reachable mobile action beside Refine and Proceed, not a control lost
+  in the scrollable document. At 769px and above the selection-adjacent document trigger stays
+  canonical. These established 768px/1024px media boundaries are permitted; new dimensions use
+  only existing design tokens.
+  */
+  .planning-add-comment--document {
+    display: none;
+  }
+
+  .planning-add-comment--mobile {
+    display: inline-flex;
+    margin-top: 0;
+  }
+
   .planning-comment-tray li {
     grid-template-columns: minmax(0, 1fr) auto;
   }
diff --git a/packages/dashboard/app/components/PlanningModeModal.tsx b/packages/dashboard/app/components/PlanningModeModal.tsx
index 6bec530ecd..6a1f153eaf 100644
--- a/packages/dashboard/app/components/PlanningModeModal.tsx
+++ b/packages/dashboard/app/components/PlanningModeModal.tsx
@@ -667,6 +667,24 @@ export function PlanningModeModal({ isOpen, onClose, onTaskCreated, onTasksCreat
   const planDocumentRef = useRef<HTMLDivElement>(null);
   const commentInputRef = useRef<HTMLTextAreaElement>(null);
   const addCommentTriggerRef = useRef<HTMLButtonElement>(null);
+  const mobileAddCommentTriggerRef = useRef<HTMLButtonElement>(null);
+  const restoreCommentTriggerFocusRef = useRef(false);
+
+  const focusAddCommentTrigger = useCallback(() => {
+    const isMobile = window.matchMedia?.("(max-width: 768px)").matches ?? false;
+    (isMobile ? mobileAddCommentTriggerRef : addCommentTriggerRef).current?.focus();
+  }, []);
+
+  /*
+  FNXC:PlanningComments 2026-07-23-09:30:
+  Closing the conditional comment editor unmounts its trigger during the state transition. Restore focus only in the post-render effect, after Cancel or Add comment remounts the desktop or mobile trigger.
+  */
+  useEffect(() => {
+    if (!isCommentEditorOpen && restoreCommentTriggerFocusRef.current) {
+      restoreCommentTriggerFocusRef.current = false;
+      focusAddCommentTrigger();
+    }
+  }, [focusAddCommentTrigger, isCommentEditorOpen]);
 
   useEffect(() => {
     // A batch belongs to one visible session; never carry comments into another plan.
@@ -2617,10 +2635,10 @@ export function PlanningModeModal({ isOpen, onClose, onTaskCreated, onTasksCreat
     if (!quote || !suggestion) return;
     setContextualComments((comments) => [...comments, { quote, suggestion }]);
     setCommentDraft("");
-    setSelectedPlanQuote(null);
+    // FNXC:PlanningComments 2026-07-23-09:30: Keep the quote while closing the editor so its conditional trigger remounts and can receive restored focus after adding a comment.
+    restoreCommentTriggerFocusRef.current = true;
     setIsCommentEditorOpen(false);
     window.getSelection()?.removeAllRanges();
-    addCommentTriggerRef.current?.focus();
   }, [commentDraft, selectedPlanQuote]);
 
   const handleSubmitContextualComments = useCallback(async () => {
@@ -2909,7 +2927,7 @@ export function PlanningModeModal({ isOpen, onClose, onTaskCreated, onTasksCreat
             <button
               ref={addCommentTriggerRef}
               type="button"
-              className="btn planning-add-comment"
+              className="btn planning-add-comment planning-add-comment--document"
               onClick={() => setIsCommentEditorOpen(true)}
             >
               <MessageSquarePlus />
@@ -2924,7 +2942,7 @@ export function PlanningModeModal({ isOpen, onClose, onTaskCreated, onTasksCreat
                 <textarea ref={commentInputRef} className="input" value={commentDraft} onChange={(event) => setCommentDraft(event.target.value)} />
               </label>
               <div className="planning-refine-menu-actions">
-                <button type="button" className="btn" onClick={() => { setCommentDraft(""); setIsCommentEditorOpen(false); addCommentTriggerRef.current?.focus(); }}>{t("common.cancel", "Cancel")}</button>
+                <button type="button" className="btn" onClick={() => { setCommentDraft(""); restoreCommentTriggerFocusRef.current = true; setIsCommentEditorOpen(false); }}>{t("common.cancel", "Cancel")}</button>
                 <button type="button" className="btn btn-primary" disabled={!commentDraft.trim()} onClick={handleAddContextualComment}>{t("planning.addComment", "Add comment")}</button>
               </div>
             </div>
@@ -2932,6 +2950,24 @@ export function PlanningModeModal({ isOpen, onClose, onTaskCreated, onTasksCreat
         </article>
       </div>
       <div className="planning-actions planning-summary-actions planning-plan-actions" data-testid="planning-plan-actions">
+        {/*
+        FNXC:PlanningComments 2026-07-31-00:00:
+        FN-8533 keeps the selection-adjacent control at 769px and wider, but mobile's reachable
+        action rail owns its counterpart. The two variants share the same editor transition and
+        CSS makes exactly one visible/focusable; only established 768px/1024px breakpoint literals
+        are allowed here, while all other dimensions remain design-token based.
+        */}
+        {selectedPlanQuote && !isCommentEditorOpen && (
+          <button
+            ref={mobileAddCommentTriggerRef}
+            type="button"
+            className="btn planning-add-comment planning-add-comment--mobile"
+            onClick={() => setIsCommentEditorOpen(true)}
+          >
+            <MessageSquarePlus />
+            {t("planning.addComment", "Add comment to selection")}
+          </button>
+        )}
         {contextualComments.length > 0 && (
           <div className="planning-comment-tray" data-testid="planning-comment-tray">
             <ul>
diff --git a/packages/dashboard/app/components/__tests__/PlanningModeModal.css.test.ts b/packages/dashboard/app/components/__tests__/PlanningModeModal.css.test.ts
index 8d5d99bd0b..fd14558930 100644
--- a/packages/dashboard/app/components/__tests__/PlanningModeModal.css.test.ts
+++ b/packages/dashboard/app/components/__tests__/PlanningModeModal.css.test.ts
@@ -166,6 +166,16 @@ describe("PlanningModeModal CSS responsive action contract", () => {
     expectSomeRule(tabletCss, ".planning-plan-actions", /flex-wrap\s*:\s*nowrap\s*;/);
   });
 
+  it("shows exactly one contextual comment trigger in the mobile plan footer", () => {
+    const css = loadPlanningCss();
+    const mobileCss = getMediaBlocks(css, MOBILE_ACTIONS_QUERY).join("\n");
+
+    expect(findRule(css, ".planning-add-comment--mobile")).toMatch(/display\s*:\s*none\s*;/);
+    expect(findRule(mobileCss, ".planning-add-comment--document")).toMatch(/display\s*:\s*none\s*;/);
+    expect(findRule(mobileCss, ".planning-add-comment--mobile")).toMatch(/display\s*:\s*inline-flex\s*;/);
+    expect(findRule(mobileCss, ".planning-add-comment--mobile")).toMatch(/margin-top\s*:\s*0\s*;/);
+  });
+
   it("keeps the mobile sessions list scrolling above the bottom-pinned New session footer", () => {
     const css = loadPlanningCss();
     const mobileShellCss = getMediaBlocks(css, MOBILE_PLANNING_SHELL_QUERY).join("\n");
diff --git a/packages/dashboard/app/components/__tests__/PlanningModeModal.planning-flow.test.tsx b/packages/dashboard/app/components/__tests__/PlanningModeModal.planning-flow.test.tsx
index cf6e52fc6c..599f1b4794 100644
--- a/packages/dashboard/app/components/__tests__/PlanningModeModal.planning-flow.test.tsx
+++ b/packages/dashboard/app/components/__tests__/PlanningModeModal.planning-flow.test.tsx
@@ -29,7 +29,7 @@ vi.mock("../../api", () => {
 });
 
 const base = { id: "session-1", title: "Secure plan", projectId: "project-1", updatedAt: new Date().toISOString(), archived: false, conversationHistory: "[]", thinkingOutput: "" };
-function renderSession() { return render(<PlanningModeModal isOpen onClose={vi.fn()} onTaskCreated={vi.fn()} onTasksCreated={vi.fn()} tasks={mockTasks} projectId="project-1" resumeSessionId="session-1" />); }
+function renderSession(sessionId = "session-1") { return render(<PlanningModeModal isOpen onClose={vi.fn()} onTaskCreated={vi.fn()} onTasksCreated={vi.fn()} tasks={mockTasks} projectId="project-1" resumeSessionId={sessionId} />); }
 const summaryWithRefinements = {
   ...mockSummary,
   description: "Build a **reviewed** recovery workflow with an operator [runbook](https://example.com/runbook).",
@@ -71,8 +71,10 @@ describe("PlanningModeModal sequential flow", () => {
   subsequently reports its durable error dispatch the existing retry endpoint automatically.
   */
   it("automatically retries a persisted error when returning to Planning", async () => {
+    const sessionId = "persisted-error-session";
     mockFetchAiSession.mockResolvedValue({
       ...base,
+      id: sessionId,
       status: "error",
       error: "The planning stream was interrupted",
       currentQuestion: null,
@@ -80,25 +82,28 @@ describe("PlanningModeModal sequential flow", () => {
       inputPayload: "{}",
     });
 
-    renderSession();
+    renderSession(sessionId);
 
-    await waitFor(() => expect(mockRetryPlanningSession).toHaveBeenCalledWith("session-1", "project-1"));
+    await waitFor(() => expect(mockRetryPlanningSession).toHaveBeenCalledWith(sessionId, "project-1"));
     expect(screen.queryByText("The planning stream was interrupted")).toBeNull();
   });
 
   it("automatically retries a stream error after returning to a generating session", async () => {
+    const sessionId = "resumed-stream-error-session";
     mockFetchAiSession.mockResolvedValue({
       ...base,
+      id: sessionId,
       status: "generating",
       currentQuestion: null,
       result: JSON.stringify(summaryWithRefinements),
       inputPayload: JSON.stringify({ generationPurpose: "plan_update" }),
     });
-    renderSession();
+    renderSession(sessionId);
     await waitFor(() => expect(mockConnectPlanningStream).toHaveBeenCalledTimes(1));
 
     mockFetchAiSession.mockResolvedValue({
       ...base,
+      id: sessionId,
       status: "error",
       error: "The resumed stream failed",
       currentQuestion: null,
@@ -107,13 +112,15 @@ describe("PlanningModeModal sequential flow", () => {
     });
     mockConnectPlanningStream.mock.calls[0]?.[2]?.onError?.("The resumed stream failed");
 
-    await waitFor(() => expect(mockRetryPlanningSession).toHaveBeenCalledWith("session-1", "project-1"));
+    await waitFor(() => expect(mockRetryPlanningSession).toHaveBeenCalledWith(sessionId, "project-1"));
     expect(screen.queryByText("The resumed stream failed")).toBeNull();
   });
 
   it("retries all bounded attempts before surfacing a returned stream error", async () => {
+    const sessionId = "bounded-retry-session";
     mockFetchAiSession.mockResolvedValue({
       ...base,
+      id: sessionId,
       status: "error",
       error: "The planning stream was interrupted",
       currentQuestion: null,
@@ -122,7 +129,7 @@ describe("PlanningModeModal sequential flow", () => {
     });
     mockRetryPlanningSession.mockRejectedValue(new Error("Temporary retry outage"));
 
-    renderSession();
+    renderSession(sessionId);
 
     await waitFor(() => expect(mockRetryPlanningSession).toHaveBeenCalledTimes(3));
     expect(await screen.findByText("Temporary retry outage")).toBeInTheDocument();
@@ -134,19 +141,21 @@ describe("PlanningModeModal sequential flow", () => {
   });
 
   it("coalesces overlapping stream errors into one retry request", async () => {
+    const sessionId = "coalesced-retry-session";
     let resolveRetry!: (value: { success: true }) => void;
     mockRetryPlanningSession.mockReturnValue(new Promise((resolve) => {
       resolveRetry = resolve;
     }));
     mockFetchAiSession.mockResolvedValue({
       ...base,
+      id: sessionId,
       status: "error",
       error: "The planning stream was interrupted",
       currentQuestion: null,
       result: JSON.stringify(summaryWithRefinements),
       inputPayload: "{}",
     });
-    renderSession();
+    renderSession(sessionId);
     await waitFor(() => expect(mockRetryPlanningSession).toHaveBeenCalledTimes(1));
 
     mockConnectPlanningStream.mock.calls[0]?.[2]?.onError?.("Duplicate stream error");
@@ -228,21 +237,24 @@ describe("PlanningModeModal sequential flow", () => {
   });
 
   it("automatically retries a resumed error discovered by the loading poll", async () => {
+    const sessionId = "polled-error-session";
     const intervalSpy = vi.spyOn(globalThis, "setInterval");
     mockFetchAiSession.mockResolvedValue({
       ...base,
+      id: sessionId,
       status: "generating",
       currentQuestion: null,
       result: JSON.stringify(summaryWithRefinements),
       inputPayload: JSON.stringify({ generationPurpose: "plan_update" }),
     });
-    renderSession();
+    renderSession(sessionId);
     await waitFor(() => expect(mockConnectPlanningStream).toHaveBeenCalledTimes(1));
 
     const poll = intervalSpy.mock.calls.find(([, delay]) => delay === 8000)?.[0];
     expect(poll).toBeTypeOf("function");
     mockFetchAiSession.mockResolvedValue({
       ...base,
+      id: sessionId,
       status: "error",
       error: "Poll observed stream error",
       currentQuestion: null,
@@ -253,7 +265,7 @@ describe("PlanningModeModal sequential flow", () => {
       await (poll as () => Promise<void>)();
     });
 
-    expect(mockRetryPlanningSession).toHaveBeenCalledWith("session-1", "project-1");
+    expect(mockRetryPlanningSession).toHaveBeenCalledWith(sessionId, "project-1");
     expect(screen.queryByText("Poll observed stream error")).toBeNull();
     intervalSpy.mockRestore();
   });
@@ -322,6 +334,15 @@ describe("PlanningModeModal sequential flow", () => {
       fireEvent.mouseUp(documentNode);
     };
     selectQuote("Build authentication system");
+    const actionBar = screen.getByTestId("planning-plan-actions");
+    const documentTrigger = document.querySelector(".planning-add-comment--document");
+    const mobileTrigger = document.querySelector(".planning-add-comment--mobile");
+    expect(documentTrigger?.closest(".planning-plan-document")).toContainElement(documentTrigger);
+    expect(actionBar).toContainElement(mobileTrigger);
+    fireEvent.click(screen.getByRole("button", { name: "Add comment to selection" }));
+    fireEvent.click(screen.getByRole("button", { name: "Cancel" }));
+    await waitFor(() => expect(document.activeElement).toBe(document.querySelector(".planning-add-comment--document")));
+
     fireEvent.click(screen.getByRole("button", { name: "Add comment to selection" }));
     const suggestionInput = screen.getByLabelText("Suggestion");
     fireEvent.change(suggestionInput, { target: { value: "Explain the audit path." } });
@@ -329,6 +350,7 @@ describe("PlanningModeModal sequential flow", () => {
     suggestionInput.setSelectionRange(0, suggestionInput.value.length);
     fireEvent.mouseUp(suggestionInput);
     fireEvent.click(screen.getByRole("button", { name: "Add comment" }));
+    await waitFor(() => expect(document.activeElement).toBe(document.querySelector(".planning-add-comment--document")));
     expect(screen.getByTestId("planning-comment-tray")).toHaveTextContent("Explain the audit path.");
     expect(screen.getByRole("button", { name: "Refine" })).toBeInTheDocument();
     expect(screen.getByRole("button", { name: "Proceed with plan" })).toBeInTheDocument();
diff --git a/packages/dashboard/app/components/__tests__/PlanningModeModal.ui-interactions.test.tsx b/packages/dashboard/app/components/__tests__/PlanningModeModal.ui-interactions.test.tsx
index 0e0fc50b4a..ee2530ce8d 100644
--- a/packages/dashboard/app/components/__tests__/PlanningModeModal.ui-interactions.test.tsx
+++ b/packages/dashboard/app/components/__tests__/PlanningModeModal.ui-interactions.test.tsx
@@ -17,6 +17,9 @@ describe("PlanningModeModal sequential layout", () => {
     expect(component).toContain("root.contains(selection.anchorNode)");
     expect(component).toContain("root.contains(selection.focusNode)");
     expect(component).toContain("Add comment to selection");
+    expect(component).toContain("planning-add-comment--document");
+    expect(component).toContain("planning-add-comment--mobile");
+    expect(component).toContain("mobileAddCommentTriggerRef");
     expect(component).toContain("contextualComments");
     expect(component).toContain("setContextualComments([])");
   });
@@ -28,5 +31,7 @@ describe("PlanningModeModal sequential layout", () => {
     expect(css).toMatch(/@media \(max-width: 1024px\)[\s\S]*?\.planning-plan-actions\s*\{[^}]*display\s*:\s*grid\s*;[^}]*grid-template-columns\s*:\s*repeat\(2, minmax\(0, 1fr\)\)\s*;[^}]*gap\s*:\s*var\(--space-md\)\s*;[^}]*calc\(var\(--space-sm\) \+ env\(safe-area-inset-bottom\)\)/);
     expect(css).toMatch(/@media \(max-width: 1024px\)[\s\S]*?\.planning-plan-actions \.btn\s*\{[^}]*width\s*:\s*100%\s*;/);
     expect(css).toMatch(/@media \(max-width: 768px\)[\s\S]*?\.planning-plan-actions\s*\{[^}]*gap\s*:\s*var\(--space-md\)\s*;[^}]*calc\(var\(--space-sm\) \+ env\(safe-area-inset-bottom\)\)/);
+    expect(css).toMatch(/\.planning-add-comment--mobile\s*\{[^}]*display\s*:\s*none\s*;/);
+    expect(css).toMatch(/@media \(max-width: 768px\)[\s\S]*?\.planning-add-comment--document\s*\{[^}]*display\s*:\s*none\s*;[\s\S]*?\.planning-add-comment--mobile\s*\{[^}]*display\s*:\s*inline-flex\s*;/);
   });
 });
diff --git a/packages/dashboard/app/planning-browser-e2e-fixture.tsx b/packages/dashboard/app/planning-browser-e2e-fixture.tsx
index 82ea971881..1c01726719 100644
--- a/packages/dashboard/app/planning-browser-e2e-fixture.tsx
+++ b/packages/dashboard/app/planning-browser-e2e-fixture.tsx
@@ -35,6 +35,7 @@ const summary = {
 const fixtureParams = new URLSearchParams(window.location.search);
 if (fixtureParams.has("reset")) localStorage.clear();
 const showPlanReview = fixtureParams.get("surface") === "plan-review";
+const presentation = fixtureParams.get("presentation") === "modal" ? "modal" : "embedded";
 
 const questions = [
   {
@@ -149,7 +150,7 @@ createRoot(document.getElementById("root")!).render(
         onTaskCreated={(task) => { document.body.dataset.createdTask = task.id; }}
         onTasksCreated={() => undefined}
         tasks={[]}
-        presentation="embedded"
+        presentation={presentation}
         resumeSessionId={showPlanReview ? "planning-browser-e2e" : undefined}
       />
     </ToastProvider>
diff --git a/packages/dashboard/src/__tests__/planning-browser-e2e.test.ts b/packages/dashboard/src/__tests__/planning-browser-e2e.test.ts
index 906d6fc0e7..83401413ee 100644
--- a/packages/dashboard/src/__tests__/planning-browser-e2e.test.ts
+++ b/packages/dashboard/src/__tests__/planning-browser-e2e.test.ts
@@ -25,6 +25,8 @@ type Page = {
   waitForTimeout(timeout: number): Promise<void>;
   evaluate<T>(pageFunction: () => T): Promise<T>;
   on(event: "console" | "pageerror", handler: (event: { text?(): string; message?: string }) => void): void;
+  screenshot(options: { path: string }): Promise<void>;
+  keyboard: { press(key: string): Promise<void> };
 };
 type Locator = {
   getByRole(role: string, options: { name: string | RegExp }): Locator;
@@ -60,7 +62,12 @@ describe.runIf(executablePath)("Planning Mode browser E2E", () => {
   let baseUrl: string;
 
   beforeAll(async () => {
-    server = await createServer({ root: process.cwd(), server: { host: "127.0.0.1", port: 0 }, logLevel: "error" });
+    /*
+    FNXC:PlanningModeBrowserE2E 2026-07-31-09:05:
+    This static fixture has no reload contract. Disable file watching so an fsevents watcher cannot
+    outlive Chromium and block the required responsive browser lane during teardown.
+    */
+    server = await createServer({ root: process.cwd(), server: { host: "127.0.0.1", port: 0, watch: null }, logLevel: "error" });
     await server.listen();
     baseUrl = server.resolvedUrls?.local[0] ?? "";
     browser = await chromium.launch({ executablePath, headless: true });
@@ -68,13 +75,18 @@ describe.runIf(executablePath)("Planning Mode browser E2E", () => {
 
   afterAll(async () => {
     await browser?.close();
-    // Vite's close() also awaits its module graph workers, which are not part of this
-    // browser assertion and can remain alive after the fixture's mocked SSE channel.
-    // Close the actual listening socket and HMR channel directly instead.
-    server?.ws.close();
-    server?.httpServer?.closeAllConnections?.();
+    /*
+    FNXC:PlanningModeBrowserE2E 2026-07-31-09:05:
+    Bound watcher shutdown prevents a native fsevents close callback from holding this mandatory
+    browser lane open after the fixture listener is gone, while still releasing it before Vitest exits.
+    */
+    await Promise.race([
+      server.watcher.close(),
+      new Promise<void>((resolve) => setTimeout(resolve, 1_000)),
+    ]);
+    server.ws.close();
+    server.httpServer?.closeAllConnections?.();
     await new Promise<void>((resolve, reject) => server.httpServer?.close((error) => error ? reject(error) : resolve()));
-    await server.watcher.close();
     await server.pluginContainer.close();
   }, 10_000);
 
@@ -101,8 +113,9 @@ describe.runIf(executablePath)("Planning Mode browser E2E", () => {
   async function verifyResponsiveWorkspace(viewport: { width: number; height: number }, mobile: boolean): Promise<void> {
     const page = await browser.newPage({ viewport });
     await page.goto(`${baseUrl}app/planning-browser-e2e-fixture.html?surface=plan-review&reset=1`);
+    if (mobile) await page.getByRole("tab", { name: "Plan preview" }).click();
     await expectVisible(page.locator("[data-testid='planning-plan-markdown'] h1"));
-    await expectVisible(page.getByText("Which user outcome matters most?"));
+    if (!mobile) await expectVisible(page.getByText("Which user outcome matters most?"));
     await expectVisible(page.getByRole("button", { name: "Proceed with plan" }));
 
     const layout = await page.evaluate(() => {
@@ -141,9 +154,9 @@ describe.runIf(executablePath)("Planning Mode browser E2E", () => {
 
     expect(layout).toMatchObject({
       planVisible: true,
-      questionVisible: true,
-      planRightOfQuestion: !mobile,
-      planAboveQuestion: mobile,
+      questionVisible: !mobile,
+      planRightOfQuestion: true,
+      planAboveQuestion: false,
       panesInsideWorkspace: true,
       actionsInsideScroll: false,
       actionsAtBottom: true,
@@ -151,7 +164,7 @@ describe.runIf(executablePath)("Planning Mode browser E2E", () => {
       scrollable: true,
       scrollOwnerConfigured: true,
       markdownRendered: true,
-      flushPaneInsets: !mobile,
+      flushPaneInsets: true,
       desktopActionRowsAligned: mobile ? false : true,
       actionTopDelta: mobile ? expect.any(Number) : 0,
       actionBottomDelta: mobile ? expect.any(Number) : 0,
@@ -160,5 +173,99 @@ describe.runIf(executablePath)("Planning Mode browser E2E", () => {
   }
 
   it("keeps the Markdown plan right of the question on desktop", () => verifyResponsiveWorkspace({ width: 1440, height: 900 }, false), 30_000);
-  it("keeps the Markdown plan above the question on mobile", () => verifyResponsiveWorkspace({ width: 390, height: 568 }, true), 30_000);
+  it("keeps the Markdown plan reachable through the mobile workspace tab", () => verifyResponsiveWorkspace({ width: 390, height: 568 }, true), 30_000);
+
+  async function selectPlanQuote(page: Page): Promise<void> {
+    await page.evaluate(() => {
+      const markdown = document.querySelector<HTMLElement>("[data-testid='planning-plan-markdown']")!;
+      const walker = document.createTreeWalker(markdown, NodeFilter.SHOW_TEXT);
+      let textNode = walker.nextNode();
+      while (textNode && !textNode.textContent?.trim()) textNode = walker.nextNode();
+      if (!textNode) throw new Error("fixture did not render selectable plan text");
+      const range = document.createRange();
+      range.selectNodeContents(textNode);
+      window.getSelection()?.removeAllRanges();
+      window.getSelection()?.addRange(range);
+      markdown.dispatchEvent(new Event("touchend", { bubbles: true }));
+    });
+    await expectVisible(page.getByRole("button", { name: "Add comment to selection" }));
+  }
+
+  async function verifyContextualCommentPlacement(
+    viewport: { width: number; height: number },
+    inFooter: boolean,
+    presentation: "embedded" | "modal",
+  ): Promise<void> {
+    const page = await browser.newPage({ viewport });
+    await page.goto(`${baseUrl}app/planning-browser-e2e-fixture.html?surface=plan-review&presentation=${presentation}&reset=1`);
+    if (viewport.width <= 768) await page.getByRole("tab", { name: "Plan preview" }).click();
+    await expectVisible(page.locator("[data-testid='planning-plan-markdown'] h1"));
+    await selectPlanQuote(page);
+
+    const placement = await page.evaluate(() => {
+      const buttons = [...document.querySelectorAll<HTMLButtonElement>(".planning-add-comment")];
+      const actions = document.querySelector<HTMLElement>("[data-testid='planning-plan-actions']")!;
+      const visibleButtons = buttons.filter((button) => {
+        const style = getComputedStyle(button);
+        return style.display !== "none" && style.visibility !== "hidden" && !button.disabled;
+      });
+      const visibleButton = visibleButtons[0];
+      const focusable = [...document.querySelectorAll<HTMLElement>("button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex='-1'])")]
+        .filter((element) => element.getClientRects().length > 0 && getComputedStyle(element).visibility !== "hidden");
+      const triggerIndex = visibleButton ? focusable.indexOf(visibleButton) : -1;
+      /*
+      FNXC:PlanningComments 2026-07-31-09:05:
+      Start at the preceding tab stop, then send actual Tab keys. Programmatic focus alone would
+      incorrectly accept a tabIndex=-1 contextual-comment trigger as keyboard reachable.
+      */
+      focusable[triggerIndex - 1]?.focus();
+      return {
+        totalButtons: buttons.length,
+        visibleButtons: visibleButtons.length,
+        visibleInActions: Boolean(visibleButton && actions.contains(visibleButton)),
+        triggerHasPreviousTabStop: triggerIndex > 0,
+        hiddenButtonsTabbable: buttons.filter((button) => button !== visibleButton && button.tabIndex >= 0 && getComputedStyle(button).display !== "none").length,
+        actionLabels: [...actions.querySelectorAll<HTMLButtonElement>("button")]
+          .filter((button) => getComputedStyle(button).display !== "none")
+          .map((button) => button.textContent?.trim()),
+      };
+    });
+
+    expect(placement).toMatchObject({
+      totalButtons: 2,
+      visibleButtons: 1,
+      visibleInActions: inFooter,
+      triggerHasPreviousTabStop: true,
+      hiddenButtonsTabbable: 0,
+    });
+    if (inFooter) expect(placement.actionLabels).toEqual(expect.arrayContaining(["Add comment to selection", "Refine", "Proceed with plan"]));
+    else expect(placement.actionLabels).not.toContain("Add comment to selection");
+
+    let reachedTriggerByTab = false;
+    for (let tabCount = 0; tabCount < 8; tabCount += 1) {
+      await page.keyboard.press("Tab");
+      reachedTriggerByTab = await page.evaluate(() => document.activeElement?.classList.contains("planning-add-comment") ?? false);
+      if (reachedTriggerByTab) break;
+    }
+    expect(reachedTriggerByTab).toBe(true);
+
+    if (inFooter && presentation === "embedded" && process.env.FUSION_CAPTURE_DIR) await page.screenshot({ path: `${process.env.FUSION_CAPTURE_DIR}/planning-comment-mobile-selection.png` });
+    await page.getByRole("button", { name: "Add comment to selection" }).click();
+    await expectVisible(page.getByLabel("Add plan comment"));
+    if (inFooter && presentation === "embedded" && process.env.FUSION_CAPTURE_DIR) await page.screenshot({ path: `${process.env.FUSION_CAPTURE_DIR}/planning-comment-mobile-editor.png` });
+    const afterOpen = await page.evaluate(() => ({
+      addCommentButtons: document.querySelectorAll(".planning-add-comment").length,
+      actionChildren: document.querySelector("[data-testid='planning-plan-actions']")?.querySelectorAll(".planning-add-comment").length,
+    }));
+    expect(afterOpen).toEqual({ addCommentButtons: 0, actionChildren: 0 });
+    await page.close();
+  }
+
+  it("places the sole contextual comment trigger by viewport in embedded and modal Planning", async () => {
+    for (const presentation of ["embedded", "modal"] as const) {
+      await verifyContextualCommentPlacement({ width: 768, height: 900 }, true, presentation);
+      await verifyContextualCommentPlacement({ width: 769, height: 900 }, false, presentation);
+      await verifyContextualCommentPlacement({ width: 1280, height: 900 }, false, presentation);
+    }
+  }, 30_000);
 });
diff --git a/packages/dashboard/vitest.config.ts b/packages/dashboard/vitest.config.ts
index 338e16eb3b..95d68276ab 100644
--- a/packages/dashboard/vitest.config.ts
+++ b/packages/dashboard/vitest.config.ts
@@ -337,12 +337,13 @@ The array stays empty; add new entries here only with a matching ledger row.
 FNXC:DashboardTestQuarantine 2026-07-16-09:00:
 FN-8077 removed routes-system.test.ts from this list and the ledger in lockstep. Its test now explicitly advances a fake Date-only clock between CPU samples, so unrelated route clock reads cannot stretch elapsed time under the loaded API lane; assertions and timeout policy are unchanged.
 */
+/*
+FNXC:DashboardTestQuarantine 2026-07-31-00:00:
+FN-8533 restores planning-browser-e2e after its teardown now closes Vite's listening socket,
+HMR channel, watcher, and plugin container deterministically. Browser viewport assertions are a
+required responsive acceptance lane, so the test must not remain excluded from dashboard-api.
+*/
 const quarantinedDashboardTests: string[] = [
-  /*
-  FNXC:DashboardTestQuarantine 2026-07-21-09:30:
-  planning-browser-e2e completed its desktop assertions but timed out twice while tearing down Chromium/Vite. Quarantine the file without widening teardown timeouts or retries; delete it on 2026-08-04 unless a root-cause rescue restores deterministic teardown.
-  */
-  "src/__tests__/planning-browser-e2e.test.ts",
   /*
   FNXC:DashboardTestQuarantine 2026-07-17-16:50:
   FN-8245 re-admits all three UI files with their ledger rows removed in lockstep.
diff --git a/scripts/lib/test-quarantine.json b/scripts/lib/test-quarantine.json
index 1d5044973c..6f231979aa 100644
--- a/scripts/lib/test-quarantine.json
+++ b/scripts/lib/test-quarantine.json
@@ -5,11 +5,6 @@
       "file": "packages/engine/src/__tests__/executor-task-done-invariant.test.ts",
       "reason": "FN-5241 handoff pair skipped in-file (it.skip): graph fails at steps#0:step-execute under PG mock-agent fixture after U10b; same class red on origin/main full-suite https://github.com/Runfusion/Fusion/actions/runs/29805577293. Rewrite graph completion harness before rescue. quarantinedAt 2026-07-20.",
       "quarantinedAt": "2026-07-20"
-    },
-    {
-      "file": "packages/dashboard/src/__tests__/planning-browser-e2e.test.ts",
-      "reason": "Chromium/Vite teardown timed out after the desktop assertions passed during [local Codex run 2026-07-21 09:29 PDT](local://codex/2026-07-21/planning-browser-e2e-teardown); repeated once in the same session.",
-      "quarantinedAt": "2026-07-21"
     }
   ]
 }