0 ? (\n \n {tableCount} table{tableCount === 1 ? \"\" : \"s\"}\n \n ) : null}\n
\n \n \n \n {document.summary ? (\n
\n \n
\n ) : null}\n \n \n

\n {sortedMatches.length === 0 ? (\n

\n No document matches include all selected filters.\n

\n ) : null}\n- {sortedMatches.map((document, index) => {\n+ {renderedMatches.map((document, index) => {\n const relevanceDisplay = relevanceTone(document);\n const fileKind = documentFileKind(document.file_name, \"DOC\");\n const relevanceVariant = relevanceDisplay.short === \"High relevance\" ? \"high\" : \"relevant\";\n const summaryText = cleanDocumentCardSummary(document.summarySnippet || compactMatchReason(document));\n const openHref = documentOpenHref(document);\n const selected = selectedDocument?.document_id === document.document_id;\n return (\n \n

\n \n );\n })}\n+ {hasMoreMatches ? (\n+ \n+ setVisibleCountState((current) => ({\n+ signature: resultsSignature,\n+ count: Math.min(current.count + DOCUMENT_RESULTS_PAGE_SIZE, sortedMatches.length),\n+ }))\n+ }\n+ data-testid=\"document-search-show-more\"\n+ >\n+ Show more ({sortedMatches.length - visibleCount} remaining)\n+ \n+ ) : null}\n

\n {documentKindLabel(document)}\n {index === 0 ? (\n <>\n@@ -1112,49 +1143,67 @@ function DocumentSearchResultsPanelImpl({\n className=\"min-h-tap rounded-lg px-2.5 text-xs text-[color:var(--text)]\"\n aria-label={`Open ${document.title}`}\n >\n {contextualOpenLabel(document)}\n \n onScopeDocument(document.document_id)}\n icon={Filter}\n className=\"min-h-tap rounded-lg px-2.5 text-xs text-[color:var(--text)]\"\n aria-label={`Scope search to ${document.title}`}\n >\n Scope\n \n onAnswerFromDocument(document.document_id)}\n icon={Sparkles}\n className=\"ml-auto min-h-tap rounded-lg px-2.5 text-xs text-[color:var(--clinical-accent)] hover:bg-[color:var(--clinical-accent-soft)]\"\n aria-label={`Answer from ${document.title}`}\n >\n Answer\n \n

\n {selectedDocument ? (\n \n ) : null}\n

\n \n )}\n \n {trimmedQuery && !shouldShowHome ? : null}\n

\n );\n }\n \n // Memoized so this panel (and its result list) stops re-rendering on unrelated\n // dashboard state changes. It still receives the live `query` prop for its\n // header, so keystrokes in documents mode re-render it, but the expensive\n // `matches` list only changes on submit; every other parent render is now\n // suppressed once the parent's callbacks are stabilized.\n export const DocumentSearchResultsPanel = memo(DocumentSearchResultsPanelImpl);\ndiff --git a/src/components/clinical-dashboard/evidence-panels.tsx b/src/components/clinical-dashboard/evidence-panels.tsx\nindex a10af6ed67b5a2c13c5a220b09d0cc4a139068cd..ab148a95daff623f156de1542d599ce9bb90fcbb 100644\n--- a/src/components/clinical-dashboard/evidence-panels.tsx\n+++ b/src/components/clinical-dashboard/evidence-panels.tsx\n@@ -40,51 +40,51 @@ import {\n EvidenceMapTable,\n sortClinicalDetailSections,\n } from \"@/components/clinical-dashboard/clinical-output-helpers\";\n import { SectionHeading } from \"@/components/clinical-dashboard/dashboard-shell\";\n import { cleanDisplayTitle, compactSourceSnippet } from \"@/components/clinical-dashboard/display-text\";\n import { SourceActionRow } from \"@/components/clinical-dashboard/source-actions\";\n import {\n chatMicroAction,\n clinicalDivider,\n cn,\n codeText,\n EmptyState,\n iconTilePremium,\n metadataPill,\n panelSubtle,\n proseMeasure,\n sourceCard,\n subtleStatusPill,\n tableMicroActionRow,\n textMuted,\n toneDanger,\n toneNeutral,\n toneSuccess,\n toneWarning,\n } from \"@/components/ui-primitives\";\n-import { type AnswerRenderModel, type SourceLink } from \"@/lib/answer-render-policy\";\n+import { isAnswerSourceBacked, type AnswerRenderModel, type SourceLink } from \"@/lib/answer-render-policy\";\n import { documentCitationHref, formatCitationLabel, formatCompactCitationLabel } from \"@/lib/citations\";\n import {\n extractSafetyFindings,\n formatSafetyFindingLabel,\n sortSafetyFindingsBySeverity,\n type SafetyFinding,\n type SafetyFindingKind,\n } from \"@/lib/clinical-safety\";\n import { normalizeSourceMetadata, sourceStatusLabel, validationStatusLabel } from \"@/lib/source-metadata\";\n import { normalizeExtractedGlyphs, sourceTextForVerbatimQuote } from \"@/lib/source-text-sanitizer\";\n import type {\n AnswerSection,\n BestSourceRecommendation,\n EvidenceSummary,\n QuoteCard,\n RagAnswer,\n SearchResult,\n VisualEvidenceCard,\n } from \"@/lib/types\";\n import { emptyStates } from \"@/lib/ui-copy\";\n import {\n type AnswerEvidenceMapRow,\n type AnswerViewMode,\n buildClinicalOutputSections,\n buildHighYieldClinicalOutputSections,\n@@ -552,116 +552,155 @@ function clinicalNotesRowsForTab(\n });\n }\n } else {\n const currentSourceIndex = sourceIndex;\n rows.push({\n id: `${tab}:${section.id}:${rows.length}:${title}`,\n title,\n detail: clinicalNoteDetailFromItem(item, title),\n sourceIndex: sourceIndex++,\n tone: clinicalNoteToneForText(item, tone),\n href: clinicalNoteHref(currentSourceIndex, sourceLinks, bestSource),\n });\n }\n }\n }\n \n return rows.slice(0, 6);\n }\n \n function clinicalNotesAvailableTabs(sections: ClinicalDetailSection[]) {\n return (Object.keys(clinicalNotesTabMeta) as ClinicalNotesTabId[])\n .map((id) => ({ id, ...clinicalNotesTabMeta[id], count: clinicalNotesRowsForTab(sections, id).length }))\n .filter((tab) => tab.count > 0);\n }\n \n+/**\n+ * Align clinical-notes inputs with the fail-closed render model: when an answer\n+ * is not explicitly source-backed, strip structured clinical payloads so the\n+ * notes sheet cannot reconstruct actionable monitoring/escalation/comparison\n+ * content from untrusted sections, quotes, or documentBreakdown (visual\n+ * evidence is passed separately).\n+ */\n+function trustGatedAnswerForClinicalNotes(\n+ answer: RagAnswer,\n+ visualEvidence: VisualEvidenceCard[] = answer.visualEvidence ?? [],\n+): RagAnswer {\n+ if (isAnswerSourceBacked(answer)) {\n+ return {\n+ ...answer,\n+ visualEvidence,\n+ smartPanel: answer.smartPanel ? { ...answer.smartPanel, visualEvidence } : answer.smartPanel,\n+ };\n+ }\n+ return {\n+ ...answer,\n+ answerSections: [],\n+ quoteCards: [],\n+ documentBreakdown: [],\n+ comparisonMatrix: undefined,\n+ comparisonEvaluationState: undefined,\n+ visualEvidence,\n+ smartPanel: answer.smartPanel ? { ...answer.smartPanel, visualEvidence, quotes: [] } : answer.smartPanel,\n+ };\n+}\n+\n /**\n * Builds the non-empty clinical detail sections used by the clinical notes view.\n *\n * @param answer - The answer from which to derive clinical detail sections.\n * @param viewMode - Selects the standard or high-yield section set.\n * @returns The sorted clinical detail sections with display-ready items.\n */\n function clinicalNotesDetailSectionsForAnswer(answer: RagAnswer, viewMode: AnswerViewMode) {\n const sections =\n viewMode === \"high_yield\" ? buildHighYieldClinicalOutputSections(answer) : buildClinicalOutputSections(answer);\n const primaryAnswer = plainAnswerText(answer.answer, { preformatted: isPreformattedGroundedAnswer(answer) });\n const keepVerifySource = answer.answerQualityTier === \"source_only\" || answer.grounded === false;\n return sortClinicalDetailSections(\n sections\n .filter((section) => (keepVerifySource || section.id !== \"verify-source\") && section.id !== \"bottom-line\")\n .map((section) => ({\n ...section,\n items: displayItemsForClinicalDetailSection(section, primaryAnswer, false),\n }))\n .filter((section) => section.items.length > 0),\n );\n }\n \n export function clinicalNotesDisplayCountForAnswer(answer: RagAnswer, viewMode: AnswerViewMode, fallback: number) {\n- const tabs = clinicalNotesAvailableTabs(clinicalNotesDetailSectionsForAnswer(answer, viewMode));\n+ const tabs = clinicalNotesAvailableTabs(\n+ clinicalNotesDetailSectionsForAnswer(trustGatedAnswerForClinicalNotes(answer), viewMode),\n+ );\n const largestTabCount = tabs.reduce((largest, tab) => Math.max(largest, tab.count), 0);\n return Math.max(1, largestTabCount || fallback);\n }\n \n export function ClinicalNotesChecklistPanel({\n answer,\n+ visualEvidence,\n viewMode,\n evidenceMapRows,\n sourceLinks = [],\n bestSource,\n copied,\n onCopy,\n onOpenTables,\n }: {\n answer: RagAnswer;\n+ visualEvidence: VisualEvidenceCard[];\n viewMode: AnswerViewMode;\n evidenceMapRows: AnswerEvidenceMapRow[];\n sourceLinks?: SourceLink[];\n bestSource: BestSourceRecommendation | null;\n copied: boolean;\n onCopy: () => void;\n onOpenTables?: () => void;\n }) {\n- const detailSections = clinicalNotesDetailSectionsForAnswer(answer, viewMode);\n+ const renderableAnswer = trustGatedAnswerForClinicalNotes(answer, visualEvidence);\n+ const detailSections = clinicalNotesDetailSectionsForAnswer(renderableAnswer, viewMode);\n const tabs = clinicalNotesAvailableTabs(detailSections);\n const defaultTab = tabs.find((tab) => tab.id === \"actions\")?.id ?? tabs[0]?.id ?? \"actions\";\n const [requestedTab, setRequestedTab] = useState(defaultTab);\n const tabRefs = useRef(new Map());\n const tabBaseId = useId();\n const tabButtonId = (id: ClinicalNotesTabId) => `${tabBaseId}-tab-${id}`;\n const notesPanelId = `${tabBaseId}-panel`;\n const activeTab = tabs.some((tab) => tab.id === requestedTab) ? requestedTab : defaultTab;\n const rows = clinicalNotesRowsForTab(detailSections, activeTab, sourceLinks, bestSource);\n- const tableEvidenceCount = clinicalNotesTableEvidenceCount(answer);\n- const [added, setAdded] = useState(false);\n+ const tableEvidenceCount = clinicalNotesTableEvidenceCount(renderableAnswer);\n const warningRows = clinicalNotesRowsForTab(detailSections, \"safety\", sourceLinks, bestSource);\n const warningCount = warningRows.filter((row) => row.tone === \"warn\").length || warningRows.length;\n \n if (!tabs.length || rows.length === 0) {\n return (\n- \n+ \n );\n }\n \n const showTabStrip = tabs.length > 1;\n \n function handleTabKeyDown(event: ReactKeyboardEvent) {\n const order = tabs.map((tab) => tab.id);\n const index = order.indexOf(activeTab);\n const next =\n event.key === \"ArrowRight\"\n ? order[(index + 1) % order.length]\n : event.key === \"ArrowLeft\"\n ? order[(index - 1 + order.length) % order.length]\n : event.key === \"Home\"\n ? order[0]\n : event.key === \"End\"\n ? order[order.length - 1]\n : null;\n if (!next) return;\n event.preventDefault();\n if (next !== activeTab) setRequestedTab(next);\n tabRefs.current.get(next)?.focus();\n }\n \n return (\n@@ -823,56 +862,61 @@ export function ClinicalNotesChecklistPanel({\n

\n {bestSource ? (\n \n \n Source\n \n ) : (\n \n \n Source\n \n )}\n \n \n {copied ? \"Copied\" : \"Copy\"}\n \n setAdded(true)}\n- className=\"inline-flex min-h-tap items-center justify-center gap-1.5 px-2 text-2xs font-semibold text-[color:var(--primary)]\"\n+ aria-disabled=\"true\"\n+ aria-describedby=\"clinical-notes-add-unavailable\"\n+ title=\"Add to favourites — coming soon\"\n+ className=\"inline-flex min-h-tap cursor-not-allowed items-center justify-center gap-1.5 px-2 text-2xs font-semibold text-[color:var(--primary)] opacity-60\"\n >\n \n- {added ? \"Added\" : \"Add\"}\n+ Add\n \n+ \n+ Adding clinical notes to favourites is coming soon.\n+ \n

\n \n );\n }\n \n function safetyFindingKindTone(kind: SafetyFindingKind) {\n return kind === \"contraindication\" || kind === \"red_flag\" ? toneDanger : toneWarning;\n }\n \n function SafetyFindingRowIcon({ kind }: { kind: SafetyFindingKind }) {\n if (kind === \"contraindication\" || kind === \"red_flag\") {\n return ;\n }\n return ;\n }\n \n // Issue 9: governance provenance retained on safety-finding citations lets the safety\n // panel badge sources that are outdated, due for review, or not locally validated —\n // the same currency/validation signals shown for ordinary source citations. Current\n // and unknown-status sources add no badge (they carry no actionable caveat here).\n function safetyFindingGovernanceLabels(citation: SafetyFinding[\"citation\"]): string[] {\n const metadata = citation.source_metadata ? normalizeSourceMetadata(citation.source_metadata) : null;\n if (!metadata) return [];\n const labels: string[] = [];\n@@ -1005,51 +1049,51 @@ export function evidenceTabCount({\n answerEvidenceMapRows,\n renderModel,\n }: {\n tab: EvidenceTabName;\n sources: SearchResult[];\n visualEvidence: VisualEvidenceCard[];\n answerEvidenceMapRows: AnswerEvidenceMapRow[];\n renderModel: AnswerRenderModel;\n }) {\n if (tab === \"Tables\") {\n return visualEvidence.filter((item) => item.accessibleTableMarkdown || item.tableRows?.length).length;\n }\n if (tab === \"Claims\")\n return (\n answerEvidenceMapRows.length ||\n renderModel.evidenceRows.length ||\n sources.length ||\n renderModel.primarySources.length\n );\n if (tab === \"Images\") return visualEvidence.length;\n if (tab === \"Quotes\") return renderModel.quoteCards.length;\n return renderModel.warnings.length;\n }\n \n export function clinicalNotesCount(answer: RagAnswer) {\n- return buildHighYieldClinicalOutputSections(answer).filter((section) =>\n+ return buildHighYieldClinicalOutputSections(trustGatedAnswerForClinicalNotes(answer)).filter((section) =>\n [\"action\", \"escalation\", \"thresholds\", \"cautions\", \"monitoring\", \"medication\", \"source-gap\"].includes(section.id),\n ).length;\n }\n \n export function answerHasCentralTable(answer: RagAnswer) {\n return (\n answer.queryClass === \"table_threshold\" ||\n answer.responseMode === \"threshold_table\" ||\n Boolean(answer.visualEvidence?.some((item) => item.accessibleTableMarkdown || item.tableRows?.length))\n );\n }\n \n export function primaryVisualTable(answer: RagAnswer) {\n return answer.visualEvidence?.find((item) => item.accessibleTableMarkdown || item.tableRows?.length) ?? null;\n }\n \n const answerFeedbackOptions: Array<{\n type: AnswerFeedbackType;\n label: string;\n icon: typeof CircleCheck;\n tone: \"success\" | \"warning\" | \"danger\" | \"neutral\";\n }> = [\n { type: \"verified\", label: \"Verified\", icon: CircleCheck, tone: \"success\" },\n { type: \"needs_correction\", label: \"Needs correction\", icon: CircleAlert, tone: \"warning\" },\n { type: \"source_insufficient\", label: \"Source insufficient\", icon: ShieldAlert, tone: \"warning\" },\ndiff --git a/src/components/clinical-dashboard/global-search-shell.tsx b/src/components/clinical-dashboard/global-search-shell.tsx\nindex 737e27a7a0b6f9e9bc596b7cf2e0aa0b2977c4a5..9e5d7a18aa4d0e1222075b0f5a7fc5b356afb642 100644\n--- a/src/components/clinical-dashboard/global-search-shell.tsx\n+++ b/src/components/clinical-dashboard/global-search-shell.tsx\n@@ -58,66 +58,70 @@ import type { ClinicalQueryMode } from \"@/lib/types\";\n const mockupQueryModeOptions: Array<{ value: ClinicalQueryMode; label: string }> = [\n { value: \"auto\", label: \"Auto\" },\n { value: \"monitoring_schedule\", label: \"Monitoring\" },\n { value: \"dose_threshold_lookup\", label: \"Dose / thresholds\" },\n { value: \"contraindications_cautions\", label: \"Cautions\" },\n { value: \"escalation_criteria\", label: \"Escalation\" },\n { value: \"required_documentation\", label: \"Documentation\" },\n { value: \"compare_guidance\", label: \"Compare\" },\n ];\n // Re-apply focus shortly after the first frame to survive initial hydration remounts.\n const focusHydrationRetryDelayMs = 300;\n \n type GlobalSearchShellProps = {\n children: ReactNode;\n initialMode?: AppModeId;\n availableModeIds?: readonly AppModeId[];\n desktopSearchPlacement?: \"default\" | \"hero\";\n /** Hide the shared search composer on routes that provide their own search surface. */\n searchComposerVisible?: boolean;\n /** Keep the global header/search while allowing a route to use the full desktop canvas. */\n hideDesktopSidebar?: boolean;\n /** Render only the mockup content when a design board needs a clean canvas. */\n chromeVisible?: boolean;\n /** Hide the shared mobile header when a route owns its phone navigation. */\n mobileChromeVisible?: boolean;\n+ /** Optional custom fallback for the Suspense boundary. Defaults to ModeHomeRouteLoading on the home route. */\n+ fallback?: ReactNode;\n };\n \n export function GlobalSearchShell(props: GlobalSearchShellProps) {\n return (\n \n- \n-

\n+ props.fallback ?? (\n+ // A neutral placeholder — do NOT render props.children here. The client\n+ // body below also renders {children} inside `#main-content`, and echoing\n+ // them in the fallback duplicated the page subtree (two `#main-content`\n+ // and two `data-testid` on medication/forms/services pages) whenever the\n+ // fallback and resolved content briefly coexisted. A route-agnostic mode-home\n+ // skeleton (the same one `loading.tsx` shows during navigation) reserves the\n+ // layout so the first frame reads as \"loading\" instead of a blank background.\n+

\n+ \n+

{scopePreview}

\n ) : null}\n {renderScopeRows()}\n \n ) : null}\n = [\n { id: \"account\", navLabel: \"Account\", icon: CircleUserRound },\n { id: \"clinical-defaults\", navLabel: \"Clinical defaults\", icon: Stethoscope },\n { id: \"app-preferences\", navLabel: \"App preferences\", icon: SlidersHorizontal },\n { id: \"personalisation\", navLabel: \"Personalisation\", icon: Sparkles },\n { id: \"notifications\", navLabel: \"Notifications\", icon: Bell },\n@@ -238,51 +239,62 @@ export function SettingsDialog({\n function handleClearRecent() {\n clearRecentQueries();\n refreshDataCounts();\n setPrivacyNotice(\"Recent searches cleared.\");\n }\n \n async function handleClearSaved() {\n const cleared = await accountData.clearFavourites();\n setPrivacyNotice(cleared ? \"Saved items cleared.\" : \"Sign in to clear account favourites.\");\n }\n \n function handleResetPreferences() {\n resetPreferences();\n setThemePreference(\"system\");\n setPrivacyNotice(\"Preferences reset to defaults.\");\n }\n \n useEffect(() => {\n if (!emailEntryOpen) return;\n const focusFrame = window.requestAnimationFrame(() => {\n settingsEmailInputRef.current?.focus({ preventScroll: true });\n });\n return () => window.cancelAnimationFrame(focusFrame);\n }, [emailEntryOpen]);\n \n- const backButton = ;\n+ const backButton = (\n+ \n+ );\n \n const closeButton = (\n \n \n \n );\n \n return (\n \n

\ndiff --git a/src/components/clinical-dashboard/signed-image.tsx b/src/components/clinical-dashboard/signed-image.tsx\nindex 3d5b499c0e0a5562c6edc3999b477a0cf34a7e59..bb446b3aa619ab5571cc5c08cf262e5afdb9b99f 100644\n--- a/src/components/clinical-dashboard/signed-image.tsx\n+++ b/src/components/clinical-dashboard/signed-image.tsx\n@@ -1,32 +1,32 @@\n \"use client\";\n \n import Image from \"next/image\";\n import { memo, useEffect, useRef, useState } from \"react\";\n-import { CircleAlert, Loader2, Maximize2 } from \"lucide-react\";\n+import { CircleAlert, Maximize2 } from \"lucide-react\";\n \n-import { cn } from \"@/components/ui-primitives\";\n+import { cn, Skeleton } from \"@/components/ui-primitives\";\n import { getCachedSignedUrl } from \"@/lib/signed-url-cache\";\n import { useSignedImageUrl } from \"@/components/clinical-dashboard/use-signed-image-url\";\n import { ImageLightbox } from \"@/components/clinical-dashboard/image-lightbox\";\n \n /**\n * Shared renderer for a private image served through a signed-URL endpoint.\n *\n * Consolidates the loading/retry/aspect-frame behaviour that `DocumentImage`\n * (document viewer) and `SourceImage` (answer/evidence surfaces) previously\n * duplicated. Both now delegate here so the behaviour cannot drift again.\n *\n * The network request is deferred behind an `IntersectionObserver` so a long\n * evidence gallery does not fire every signed-URL request — and download every\n * full-resolution image — on mount. The image lives in a fixed 4:3 frame so it\n * never resizes the layout when it decodes (no content shift on load). When\n * `zoomable`, clicking opens a fullscreen lightbox with zoom/pan/rotate.\n */\n export const SignedImage = memo(function SignedImage({\n endpoint,\n alt,\n className = \"max-h-52\",\n failureLabel = \"Image preview could not load.\",\n retryLabel = \"Retry image\",\n rootMargin = \"640px 0px\",\n zoomable = false,\n@@ -160,39 +160,36 @@ export const SignedImage = memo(function SignedImage({\n setLightboxOpen(true)}\n aria-label={`Expand image: ${caption?.trim() || alt}`}\n className=\"absolute inset-0 z-[1] flex cursor-zoom-in items-start justify-end p-2 focus-visible:outline-2 focus-visible:outline-[color:var(--focus)]\"\n >\n \n \n \n \n setLightboxOpen(false)}\n endpoint={endpoint}\n alt={alt}\n caption={caption}\n returnFocusRef={triggerRef}\n />\n \n ) : null}\n {!url || !loaded ? (\n-

\n {shouldLoad ? (\n- <>\n- \n- Loading image\n- \n+ \n ) : (\n- \"Image preview will load when visible\"\n+

Image preview will load when visible

\n )}\n

\n {primarySourceHref ? (\n \n \n Source\n \n ) : (\n \n \n Source\n \n )}\n void copyEvidence()}\n className=\"inline-flex min-h-12 items-center justify-center gap-1.5 px-2 text-xs font-semibold text-[color:var(--text)]\"\n >\n \n {copiedQuotes ? \"Copied\" : \"Copy\"}\n \n setAdded(true)}\n- className=\"inline-flex min-h-12 items-center justify-center gap-1.5 px-2 text-xs font-semibold text-[color:var(--clinical-accent)]\"\n+ aria-disabled=\"true\"\n+ aria-describedby=\"visual-evidence-add-unavailable\"\n+ title=\"Add to favourites — coming soon\"\n+ className=\"inline-flex min-h-12 cursor-not-allowed items-center justify-center gap-1.5 px-2 text-xs font-semibold text-[color:var(--clinical-accent)] opacity-60\"\n >\n \n- {added ? \"Added\" : \"Add\"}\n+ Add\n \n+ \n+ Adding evidence to favourites is coming soon.\n+ \n

\n \n );\n }\n \n function MobileEvidenceTabPanel({\n tab,\n renderModel,\n visualEvidence,\n answerEvidenceMapRows,\n copiedQuotes,\n onCopyQuotes,\n onFollowUpQuote,\n onScopeDocument,\n }: {\n tab: EvidenceTabName;\n renderModel: AnswerRenderModel;\n visualEvidence: VisualEvidenceCard[];\n answerEvidenceMapRows: AnswerEvidenceMapRow[];\n copiedQuotes: boolean;\n onCopyQuotes: () => void;\n onFollowUpQuote?: (quote: QuoteCard) => void;\n onScopeDocument: (documentId: string) => void;\n }) {\ndiff --git a/src/components/differentials/differential-presentation-workflow-page.tsx b/src/components/differentials/differential-presentation-workflow-page.tsx\nindex 6f3814f3005ac0636f37b72f193caa3ad146c443..d6242dbd9b93a8cbfe20479ed40ff4ac04bf2c3f 100644\n--- a/src/components/differentials/differential-presentation-workflow-page.tsx\n+++ b/src/components/differentials/differential-presentation-workflow-page.tsx\n@@ -546,88 +546,96 @@ function MobileComparison({\n className=\"inline-flex min-h-tap cursor-not-allowed items-center justify-between gap-2 rounded-lg border border-[color:var(--border-lux)] bg-[color:var(--surface)] px-3 text-sm font-bold text-[color:var(--text-muted)] opacity-60 shadow-[var(--shadow-inset)]\"\n >\n \n \n {workflow.selectedCount} of {workflow.totalCount} selected\n \n \n \n \n \n \n \n \n

\n {selected.map((candidate, index) => (\n \n ))}\n

\n- \n \n- Compare ({workflow.selectedCount} selected)\n- \n+ Comparing ({workflow.selectedCount})\n+ \n \n

\n \n );\n }\n \n function MobileTabs({ workflow }: { workflow: DifferentialPresentationWorkflow }) {\n const firstCandidate = workflow.candidates[0]?.slug ?? \"delirium\";\n+ const diagnosisBase = `/differentials/diagnoses/${firstCandidate}`;\n+ const tabs = [\n+ { label: \"Overview\", href: diagnosisBase },\n+ { label: \"Compare\", href: `/differentials/presentations/${workflow.id}` },\n+ { label: \"Map\", href: `${diagnosisBase}?tab=map` },\n+ { label: \"Related\", href: `${diagnosisBase}?tab=related` },\n+ ] as const;\n+\n return (\n \n- {[\"Overview\", \"Compare\", \"Map\", \"Related\"].map((item) => {\n- const active = item === \"Compare\";\n+ {tabs.map((tab) => {\n+ const active = tab.label === \"Compare\";\n return (\n \n- {item}\n+ {tab.label}\n \n );\n })}\n \n );\n }\n \n export function DifferentialPresentationWorkflowPage({\n query = \"\",\n presentationSlug = \"acute-confusion-encephalopathy\",\n selectedIds = [],\n }: {\n query?: string;\n presentationSlug?: string;\n selectedIds?: string[];\n }) {\n const baseWorkflow = getPresentationWorkflow(presentationSlug) ?? acuteConfusionPresentationWorkflow;\n const requestedIds = new Set(selectedIds);\n const workflow = requestedIds.size\n ? (() => {\n let selectedCount = 0;\n const candidates = baseWorkflow.candidates.map((candidate) => {\n const selected = requestedIds.has(candidate.slug);\n if (selected) selectedCount += 1;\n return { ...candidate, selected };\n@@ -671,75 +679,75 @@ export function DifferentialPresentationWorkflowPage({\n

\n {workflow.title}\n

\n \n {query ? (\n

Query: {query}

\n \n \n Switch differential\n \n \n {workflow.selectedCount} selected\n \n-

\n- \n+ \n- \n- Compact\n- \n- \n- Detailed\n- \n-

\n- \n+ \n- Density controls coming soon\n+ Detailed\n+ \n+ \n+ Compact and detailed density controls are coming soon.\n \n

\n \n \n \n \n {/* Tablet / mid (md–lg): safety leads, then the scrollable table, then\n the review panels reflow into a grid below — no fixed side rail. */}\n \n \n \n \n \n \n \n \n \n

\ndiff --git a/src/components/forms/form-detail-page.tsx b/src/components/forms/form-detail-page.tsx\nindex 3580bb0846c124bfa0f063e2ea6a856697ee41c1..516e06e23479a7c3d98c0daf5feab95410db727c 100644\n--- a/src/components/forms/form-detail-page.tsx\n+++ b/src/components/forms/form-detail-page.tsx\n@@ -1,69 +1,72 @@\n \"use client\";\n \n+import { useRouter } from \"next/navigation\";\n import {\n+ ArrowLeft,\n Bookmark,\n BookmarkCheck,\n CalendarDays,\n CircleCheck,\n ChevronRight,\n Clipboard,\n ClipboardList,\n Clock3,\n Download,\n ExternalLink,\n FileText,\n Info,\n MapPin,\n Navigation,\n Phone,\n Route,\n Scale,\n ShieldCheck,\n Tag,\n UserRound,\n X,\n CircleX,\n type LucideIcon,\n } from \"lucide-react\";\n import { useMemo, useState, type ReactNode } from \"react\";\n \n import {\n cn,\n codeText,\n floatingControl,\n metadataPill,\n pageContainer,\n primaryControl,\n textMuted,\n toneDanger,\n toneInfo,\n toneNeutral,\n toneSuccess,\n toneWarning,\n } from \"@/components/ui-primitives\";\n import { FormCodeBadge, splitFormCode } from \"@/components/forms/form-code-badge\";\n+import { appModeHomeHref } from \"@/lib/app-modes\";\n import { formCatalogDetails, formTitleForCode, type FormRecord } from \"@/lib/form-catalog\";\n import type { ServiceChipTone, ServiceContact, ServiceCriterion, ServiceSummaryCard } from \"@/lib/service-ranker\";\n import { useAccountData } from \"@/components/account-data-provider\";\n \n const missingText = \"Not listed\";\n \n function hasText(value: string | null | undefined): value is string {\n return Boolean(value && value.trim().length > 0);\n }\n \n function displayText(value: string | null | undefined, fallback = missingText) {\n return hasText(value) ? value.trim() : fallback;\n }\n \n async function copyText(value: string) {\n if (navigator.clipboard?.writeText) {\n try {\n await navigator.clipboard.writeText(value);\n return;\n } catch {\n // Fall through to the legacy selection path for restricted browser contexts.\n }\n }\n \n const textArea = document.createElement(\"textarea\");\n@@ -596,65 +599,70 @@ function RailCard({ icon: Icon, title, children }: { icon: LucideIcon; title: st\n

{title}

\n {children}\n \n );\n }\n \n function InfoRow({ label, value, icon: Icon }: { label: string; value: string | null | undefined; icon: LucideIcon }) {\n return (\n

{label}

\n {displayText(value)}\n

\n );\n }\n \n export function FormDetailPage({ form }: { form: FormRecord }) {\n+ const router = useRouter();\n const accountData = useAccountData();\n const saved = accountData.isSaved(\"form\", form.slug);\n const [notice, setNotice] = useState(null);\n const code = formCode(form);\n const details = formCatalogDetails(form);\n const summaryCards = summaryCardsFor(form);\n const detailRows = detailRowsFor(form);\n const primaryContact = hasText(form.primaryContact?.value)\n ? form.primaryContact\n : (form.contacts?.find((contact) => hasText(contact.value)) ?? null);\n const hrefForCall = callHref(primaryContact);\n const verified = form.verification?.locallyVerified === true;\n const criteria = form.criteria ?? [];\n const relatedTags = useMemo(() => [...(form.tags ?? []), ...(form.catchments ?? [])].slice(0, 8), [form]);\n \n+ function goBack() {\n+ router.push(appModeHomeHref(\"forms\", { focus: true }));\n+ }\n+\n async function copyValue(value: string | null | undefined, label: string) {\n if (!hasText(value)) {\n setNotice(\"Nothing available to copy\");\n return;\n }\n \n try {\n await copyText(value.trim());\n setNotice(label);\n } catch {\n setNotice(\"Copy failed\");\n }\n }\n \n async function toggleSaved() {\n try {\n const nowSaved = !saved;\n if (!(await accountData.setFavourite(\"form\", form.slug, nowSaved))) {\n setNotice(\n accountData.isAuthenticated ? \"Save failed. Try again.\" : \"Sign in or create an account to save forms\",\n );\n return;\n }\n setNotice(nowSaved ? \"Form saved\" : \"Form removed from saved items\");\n } catch {\n@@ -668,50 +676,54 @@ export function FormDetailPage({ form }: { form: FormRecord }) {\n className=\"max-sm:min-h-0 bg-[color:var(--background)] px-3 pb-4 pt-4 text-[color:var(--text)] sm:min-h-[calc(100dvh-var(--shell-header-h))] sm:px-5 sm:pb-10 sm:pt-6 lg:px-8\"\n >\n

\n {notice ? (\n \n {notice}\n setNotice(null)}\n aria-label=\"Dismiss form notification\"\n className=\"grid size-tap place-items-center rounded-md transition hover:bg-[color:var(--surface)]/70 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[color:var(--focus)]\"\n >\n \n \n

\n ) : null}\n \n

\n+ \n \n Forms\n \n \n {displayText(form.catalogueLabel, \"Catalogue\")}\n \n \n {form.title}\n \n

\n );\n }\n \n export function FormsSearchResultsPage(props: FormsSearchResultsPageProps) {\n return ;\n }\n \n function FormsSearchResultsPageContent({ query }: FormsSearchResultsPageProps) {\n const router = useRouter();\n const [sortValue, setSortValue] = useResultSort();\n const command = useSearchCommand();\n const registry = useRegistryRecords(\"form\");\n const registryReady = registry.status === \"ready\";\n const [refineOpen, setRefineOpen] = useState(false);\n const refinePanelId = useId();\n- const matches = useMemo(\n- () => (registryReady ? rankFormRecords(registry.records, query) : []),\n- [registryReady, registry.records, query],\n- );\n+ const deferredQuery = useDeferredValue(query);\n+ const matches = useMemo(() => {\n+ if (!registryReady) return [];\n+ // Cleared query: no form matches (page usually remounts, but keep lag-safe).\n+ if (!query.trim()) return [];\n+ // Deferred empty while live has text: wait — do not rank as empty-query \"all forms\".\n+ if (!deferredQuery.trim()) return [];\n+ return rankFormRecords(registry.records, deferredQuery);\n+ }, [registryReady, registry.records, deferredQuery, query]);\n const scopedMatches = useMemo(() => {\n const scopes = command?.commandScopes ?? [];\n if (!scopes.length) return matches;\n return matches.filter((match) => recordMatchesCommandScopes(match.service, scopes, \"forms\"));\n }, [command?.commandScopes, matches]);\n const displayedMatches = useMemo(\n () => sortResultItems(scopedMatches, sortValue, (match) => match.service.title),\n [scopedMatches, sortValue],\n );\n \n return (\n

\n {form.title}\n

\n {displayText(form.subtitle, \"Psychiatry form and workflow details.\")}\ndiff --git a/src/components/forms/forms-search-results-page.tsx b/src/components/forms/forms-search-results-page.tsx\nindex eb978d0f6309b4df56060b845f53b79ef9b26fc5..bc432395d8074e570161ab7fb0a3b0ff2a0ab9af 100644\n--- a/src/components/forms/forms-search-results-page.tsx\n+++ b/src/components/forms/forms-search-results-page.tsx\n@@ -1,44 +1,44 @@\n \"use client\";\n \n import Link from \"next/link\";\n import { useRouter } from \"next/navigation\";\n import {\n ChevronDown,\n ChevronRight,\n ExternalLink,\n FileText,\n Loader2,\n Search,\n Shield,\n ShieldAlert,\n ShieldCheck,\n SlidersHorizontal,\n Workflow,\n type LucideIcon,\n } from \"lucide-react\";\n-import { useId, useMemo, useState } from \"react\";\n+import { useId, useMemo, useState, useDeferredValue } from \"react\";\n \n import { appModeHomeHref } from \"@/lib/app-modes\";\n import { formCatalogDetails, rankFormRecords, type FormSearchMatch } from \"@/lib/form-ranker\";\n import { useRegistryRecords, type RegistryRequestStatus } from \"@/lib/use-registry-records\";\n import {\n cn,\n codeText,\n pageContainer,\n searchFocusRing,\n searchPageCanvas,\n searchResultsSection,\n ToggleSwitch,\n } from \"@/components/ui-primitives\";\n import {\n ResultSortControl,\n SearchResultsEmptyState,\n SearchResultsHeaderBand,\n } from \"@/components/clinical-dashboard/search-results-header-band\";\n import { FormCodeBadge } from \"@/components/forms/form-code-badge\";\n import { useSearchCommand } from \"@/components/clinical-dashboard/search-command-context\";\n import { recordMatchesCommandScopes } from \"@/lib/search-command-surface\";\n import { sortResultItems, type ResultSortValue } from \"@/lib/result-sort\";\n import { useResultSort } from \"@/components/use-result-sort\";\n import { UniversalSearchAlsoMatches } from \"@/components/clinical-dashboard/universal-search-also-matches\";\n \n@@ -598,80 +598,85 @@ function RegistryStatusNotice({ status }: { status: RegistryRequestStatus }) {\n {notice.text}\n {notice.action ? (\n \n {notice.action.label}\n \n ) : null}\n

\n \n {registryReady ? (\n <>\n

\n- {query.trim() && displayedMatches.length === 0 ? (\n+ {query.trim() && deferredQuery === query && displayedMatches.length === 0 ? (\n \n router.push(appModeHomeHref(\"forms\", { query: example, focus: true, run: true }))\n }\n />\n ) : (\n <>\n

\n \n {supportsPathwayClaims ? (\n setRefineOpen((open) => !open)}\n panelId={refinePanelId}\n />\n ) : null}\n

\ndiff --git a/src/components/formulation/formulation-builder-page.tsx b/src/components/formulation/formulation-builder-page.tsx\nindex f5bae5b0fd2dfff82ef2b57a7fd95c70bf317968..8728bd205589336e2a11ca01b34933054e0c1c2a 100644\n--- a/src/components/formulation/formulation-builder-page.tsx\n+++ b/src/components/formulation/formulation-builder-page.tsx\n@@ -1,43 +1,43 @@\n \"use client\";\n \n import Link from \"next/link\";\n import {\n ArrowLeft,\n ArrowRight,\n Check,\n Clipboard,\n FileCheck2,\n Network,\n RotateCcw,\n Search,\n ShieldCheck,\n Sparkles,\n Target,\n Waypoints,\n } from \"lucide-react\";\n-import { useMemo, useState } from \"react\";\n+import { useMemo, useState, useDeferredValue } from \"react\";\n \n import {\n FormulationBreadcrumbs,\n FormulationPageShell,\n FormulationSafetyNote,\n FormulationSubnav,\n MechanismDomainChips,\n SessionPrivacyNote,\n formulationCard,\n } from \"@/components/formulation/formulation-ui\";\n import { cn, eyebrowText } from \"@/components/ui-primitives\";\n import {\n findFormulationMechanism,\n formulationDomains,\n formulationDraftFor,\n formulationQualityPrompts,\n formulationSectionsForTemplate,\n formulationTemplates,\n normalizeMechanismSelection,\n searchFormulationMechanisms,\n suggestionsForFormulationSection,\n type FormulationMechanism,\n } from \"@/lib/formulation\";\n \n const builderSteps = [\n@@ -184,68 +184,74 @@ function BuilderThread({\n }\n \n function StepHeading({ eyebrow, title, body }: { eyebrow: string; title: string; body: string }) {\n return (\n

{eyebrow}

{title}

{body}

\n );\n }\n \n export function FormulationBuilderPage({\n initialMechanisms = [],\n initialTemplate,\n }: {\n initialMechanisms?: string[];\n initialTemplate?: string;\n }) {\n const validInitialTemplate = formulationTemplates.some((template) => template.id === initialTemplate)\n ? initialTemplate!\n : formulationTemplates[0].id;\n const [activeStep, setActiveStep] = useState(\"select\");\n const [selectedIds, setSelectedIds] = useState(() => normalizeMechanismSelection(initialMechanisms));\n const [query, setQuery] = useState(\"\");\n+ const deferredQuery = useDeferredValue(query);\n const [domain, setDomain] = useState(\"all\");\n const [templateId, setTemplateId] = useState(validInitialTemplate);\n const [sectionNotes, setSectionNotes] = useState>({});\n const [qualityNotes, setQualityNotes] = useState>({});\n const [editedDraft, setEditedDraft] = useState(null);\n const [copied, setCopied] = useState(false);\n \n const selectedMechanisms = useMemo(\n () =>\n selectedIds\n .map((id) => findFormulationMechanism(id))\n .filter((mechanism): mechanism is FormulationMechanism => Boolean(mechanism)),\n [selectedIds],\n );\n- const visibleMechanisms = useMemo(\n- () => searchFormulationMechanisms(query, { domain }).map((result) => result.mechanism),\n- [domain, query],\n- );\n+ const visibleMechanisms = useMemo(() => {\n+ // Cleared live query should restore the full browse catalogue immediately.\n+ if (!query.trim()) {\n+ return searchFormulationMechanisms(\"\", { domain }).map((result) => result.mechanism);\n+ }\n+ // Empty deferred while live query has text would score every mechanism.\n+ if (!deferredQuery.trim()) return [];\n+ return searchFormulationMechanisms(deferredQuery, { domain }).map((result) => result.mechanism);\n+ }, [domain, deferredQuery, query]);\n const activeSections = formulationSectionsForTemplate(templateId);\n const generatedDraft = formulationDraftFor({\n mechanisms: selectedMechanisms,\n templateId,\n notes: sectionNotes,\n qualityNotes,\n });\n const draft = editedDraft ?? generatedDraft;\n const completedQuality = formulationQualityPrompts.filter((prompt) => qualityNotes[prompt.id]?.trim()).length;\n const activeIndex = builderSteps.findIndex((step) => step.id === activeStep);\n \n function toggleMechanism(id: string) {\n setSelectedIds((current) =>\n current.includes(id) ? current.filter((item) => item !== id) : normalizeMechanismSelection([...current, id]),\n );\n setEditedDraft(null);\n }\n \n function clearMechanisms() {\n setSelectedIds([]);\n setEditedDraft(null);\n }\n \n function updateSection(id: string, value: string) {\n setSectionNotes((current) => ({ ...current, [id]: value }));\ndiff --git a/src/components/formulation/formulation-home-page.tsx b/src/components/formulation/formulation-home-page.tsx\nindex 400b4cf3c9b163a24b9672bbab6001a1e6d8e850..f8ec73edcea358dfec5ec443547bf89455281ed3 100644\n--- a/src/components/formulation/formulation-home-page.tsx\n+++ b/src/components/formulation/formulation-home-page.tsx\n@@ -1,29 +1,29 @@\n \"use client\";\n \n import Link from \"next/link\";\n-import { useMemo, useState } from \"react\";\n+import { useMemo, useState, useDeferredValue } from \"react\";\n import {\n ArrowRight,\n CheckCircle2,\n ChevronRight,\n GitCompareArrows,\n ListChecks,\n Network,\n Search,\n ShieldCheck,\n Waypoints,\n } from \"lucide-react\";\n \n import {\n FormulationBreadcrumbs,\n FormulationPageShell,\n FormulationSafetyNote,\n FormulationSubnav,\n MechanismDomainChips,\n formulationCard,\n } from \"@/components/formulation/formulation-ui\";\n import { ModeHomeMain, ModeHomeTemplate, ModeHomeVerificationFooter } from \"@/components/mode-home-template\";\n import { cn, eyebrowText } from \"@/components/ui-primitives\";\n import { appModeHomeHref } from \"@/lib/app-modes\";\n import {\n formulationDomains,\n@@ -155,51 +155,60 @@ function FormulationHome() {\n function EmptySearchResults({ query }: { query: string }) {\n return (\n

\n );\n }\n \n function FormulationResults({ query }: { query: string }) {\n const [domain, setDomain] = useState(\"all\");\n- const results = useMemo(() => searchFormulationMechanisms(query, { domain }), [domain, query]);\n+ const deferredQuery = useDeferredValue(query);\n+ const rankingReady = deferredQuery === query;\n+ const results = useMemo(() => {\n+ // Cleared live query should restore the full browse catalogue immediately.\n+ if (!query.trim()) return searchFormulationMechanisms(\"\", { domain });\n+ // Empty deferred while live query has text would score every mechanism —\n+ // treat that lag as \"no results yet\" instead of dumping the full catalogue.\n+ if (!deferredQuery.trim()) return [];\n+ return searchFormulationMechanisms(deferredQuery, { domain });\n+ }, [domain, deferredQuery, query]);\n \n return (\n \n

No mechanism matched “{query}”

\n Try a patient phrase, sequence, coping response, or clinical clue—for example “I keep going over it” or “I was\n not really there”.\n

\n \n Clear search\n \n

\n \n \n

\n \n \n {preset.label}\n \n ))}\n

Mechanism search

\n Mechanisms matching “{query}”\n

\n Matches use patient language, clinical clues, domains, symptoms, and formulation context. Open a mechanism\n to test fit and competing explanations.\n

\n {results.length} {results.length === 1 ? \"match\" : \"matches\"}\n

\n \n Filter by formulation domain\n setDomain(event.target.value)}\n className=\"min-h-tap rounded-lg border border-[color:var(--border)] bg-[color:var(--surface)] px-3 text-sm font-semibold text-[color:var(--text)] shadow-[var(--shadow-inset)] outline-none focus:border-[color:var(--focus)] focus:ring-4 focus:ring-[color:var(--focus)]/20\"\n >\n \n {formulationDomains.map((item) => (\n \n ))}\n \n \n

\n \n- {results.length === 0 ? (\n+ {results.length === 0 && rankingReady ? (\n \n- ) : (\n+ ) : results.length === 0 ? null : (\n

\n {results.map(({ mechanism }, index) => (\n \n

\n \n {mechanism.name}\n \n {index === 0 ? (\n \n \n Closest text match\n \n ) : null}\ndiff --git a/src/components/mode-home-page-skeleton.tsx b/src/components/mode-home-page-skeleton.tsx\nindex 814114b4d263c9eeb20a49cb71272ddf4dfa076c..efc0c40ba97c7bbad35eea06ea9446de6e07da3d 100644\n--- a/src/components/mode-home-page-skeleton.tsx\n+++ b/src/components/mode-home-page-skeleton.tsx\n@@ -1,72 +1,65 @@\n-function SkeletonBlock({ className }: { className?: string }) {\n- return (\n- \n- );\n-}\n+import { Skeleton } from \"@/components/ui-primitives\";\n \n export function ModeHomePageSkeleton() {\n return (\n \n- \n+ \n

\n- \n- \n+ \n+ \n

\n- \n+ \n

\n- \n- \n- \n+ \n+ \n+ \n

\n Loading\n

\n );\n }\n \n export function ModeHomeRouteLoading() {\n return (\n

\n );\n }\n \n export function DocumentSearchPageSkeleton() {\n return (\n \n- \n- \n+ \n+ \n

\n- \n- \n- \n+ \n+ \n+ \n

\n Loading documents\n

\n );\n }\n \n export function DocumentViewerPageSkeleton() {\n return (\n \n- \n- \n+ \n+ \n Loading document\n

\n setPrimary(event.target.value)}\n+ onChange={(event) => {\n+ const nextPrimary = event.target.value;\n+ setPrimary(nextPrimary);\n+ onDraftDirtyChange?.(draftIsDirty(nextPrimary, secondary));\n+ }}\n onKeyDown={(event) => {\n if (event.key === \"Enter\") {\n event.preventDefault();\n submit();\n }\n }}\n placeholder={primaryPlaceholder}\n aria-label={primaryPlaceholder}\n className={cn(fieldControlPlain, \"min-h-10\")}\n />\n {kind === \"contact\" ? (\n setSecondary(event.target.value)}\n+ onChange={(event) => {\n+ const nextSecondary = event.target.value;\n+ setSecondary(nextSecondary);\n+ onDraftDirtyChange?.(draftIsDirty(primary, nextSecondary));\n+ }}\n onKeyDown={(event) => {\n if (event.key === \"Enter\") {\n event.preventDefault();\n submit();\n }\n }}\n placeholder={secondaryPlaceholder}\n aria-label={secondaryPlaceholder}\n className={cn(fieldControlPlain, \"min-h-10\")}\n />\n ) : null}\n \n \n Add\n \n

\n );\n@@ -286,55 +304,57 @@ function EntryChip({ entry, kind, onRemove }: { entry: Entry; kind: StepKind; on\n \n {entry.secondary}\n

\n \n \n \n \n );\n }\n \n function StepBuilderCard({\n def,\n entries,\n onAdd,\n onRemove,\n+ onDraftDirtyChange,\n }: {\n def: StepDef;\n entries: Entry[];\n onAdd: (primary: string, secondary?: string) => void;\n onRemove: (id: string) => void;\n+ onDraftDirtyChange: (dirty: boolean) => void;\n }) {\n const Icon = def.icon;\n const filled = entries.length > 0;\n \n return (\n \n

\n \n Step {def.step}\n \n {filled ? (\n \n@@ -343,50 +363,51 @@ function StepBuilderCard({\n ) : null}\n

{def.builderTitle}

{def.helper}

\n {entries.length}\n

\n \n {entries.length ? (\n

onRemove(entry.id)} />\n ))}\n

\n ) : (\n

\n {def.emptyHint}\n

\n )}\n \n \n \n );\n }\n \n /* ---------- patient-facing preview ---------- */\n \n function PreviewStep({ def, entries }: { def: StepDef; entries: Entry[] }) {\n const Icon = def.icon;\n return (\n

\n \n {def.step}\n \n

\n {entry.secondary}\n \n ) : null}\n \n \n ))}\n

\n {def.patientTitle}\n

\n {entries.length ? (\n

\n ) : (\n

\n To be completed together.\n

\n )}\n

\n );\n }\n \n /* ---------- root ---------- */\n \n export function PatientSafetyPlan() {\n const [entries, setEntries] = useState>(EMPTY_ENTRIES);\n const [reasons, setReasons] = useState([]);\n- const [patient, setPatient] = useState(\"\");\n const [planDate, setPlanDate] = useState(\"\");\n const [mobileTab, setMobileTab] = useState<\"build\" | \"preview\">(\"build\");\n const [copied, setCopied] = useState(false);\n const [finalised, setFinalised] = useState(false);\n+ const [draftDirtyByRow, setDraftDirtyByRow] = useState>({});\n \n // Per-instance id counter — avoids a module-level mutable that would persist\n // across remounts; ids only need to be unique within this mounted plan.\n const uidRef = useRef(0);\n const uid = useCallback((prefix: string) => `${prefix}-live-${uidRef.current++}`, []);\n \n const addEntry = useCallback(\n (key: StepKey, primary: string, secondary?: string) => {\n setEntries((prev) => ({ ...prev, [key]: [...prev[key], { id: uid(key), primary, secondary }] }));\n setFinalised(false);\n },\n [uid],\n );\n \n const removeEntry = useCallback((key: StepKey, id: string) => {\n setEntries((prev) => ({ ...prev, [key]: prev[key].filter((entry) => entry.id !== id) }));\n setFinalised(false);\n }, []);\n \n+ const setDraftDirty = useCallback((key: string, dirty: boolean) => {\n+ setDraftDirtyByRow((prev) => {\n+ if (prev[key] === dirty) return prev;\n+ return { ...prev, [key]: dirty };\n+ });\n+ }, []);\n+\n const filledSteps = useMemo(() => STEPS.filter((step) => entries[step.key].length > 0).length, [entries]);\n const ready = filledSteps === STEPS.length;\n+ // Working plan content is browser-tab only and never persisted. Treat any\n+ // entered step/reason/date as dirty so the header back control cannot discard\n+ // an in-progress plan without an explicit confirmation.\n+ const isDirty = useMemo(\n+ () =>\n+ Object.values(entries).some((rows) => rows.length > 0) ||\n+ reasons.length > 0 ||\n+ planDate.trim() !== \"\" ||\n+ Object.values(draftDirtyByRow).some(Boolean),\n+ [draftDirtyByRow, entries, planDate, reasons],\n+ );\n \n const planText = useMemo(() => {\n const lines: string[] = [\n \"MY SAFETY PLAN\",\n- patient ? `For: ${patient}` : \"\",\n+ \"Name (add after export): ____________________\",\n planDate ? `Date: ${planDate}` : \"\",\n \"\",\n ];\n for (const step of STEPS) {\n lines.push(`${step.step}. ${step.patientTitle}`);\n const rows = entries[step.key];\n if (rows.length) {\n for (const row of rows) lines.push(` • ${row.primary}${row.secondary ? ` — ${row.secondary}` : \"\"}`);\n } else {\n lines.push(\" • (to be completed)\");\n }\n lines.push(\"\");\n }\n if (reasons.length) {\n lines.push(\"MY REASONS FOR LIVING\");\n for (const reason of reasons) lines.push(` • ${reason.primary}`);\n lines.push(\"\");\n }\n lines.push(\"In an emergency: call 000 or go to your nearest Emergency Department.\");\n lines.push(\"24/7 support: Lifeline 13 11 14 · Suicide Call Back Service 1300 659 467.\");\n return lines.filter((line, index, all) => !(line === \"\" && all[index - 1] === \"\")).join(\"\\n\");\n- }, [entries, patient, planDate, reasons]);\n+ }, [entries, planDate, reasons]);\n \n const copyPlan = async () => {\n try {\n await navigator.clipboard.writeText(planText);\n setCopied(true);\n window.setTimeout(() => setCopied(false), 1600);\n } catch {\n /* clipboard unavailable in some embeds — safe no-op */\n }\n };\n \n const printPlan = () => {\n if (typeof window !== \"undefined\") window.print();\n };\n \n const loadExample = () => {\n const hasContent =\n- Object.values(entries).some((rows) => rows.length > 0) ||\n- reasons.length > 0 ||\n- patient.trim() !== \"\" ||\n- planDate.trim() !== \"\";\n+ Object.values(entries).some((rows) => rows.length > 0) || reasons.length > 0 || planDate.trim() !== \"\";\n if (hasContent && !window.confirm(\"Replace the current plan with the example content?\")) return;\n setEntries(SEED);\n setReasons(SEED_REASONS);\n- // Clear the patient context so example content can never carry a real\n- // patient's name or date into the preview/print output.\n- setPatient(\"\");\n+ // Clear the plan date so example content cannot look like a current handover.\n setPlanDate(\"\");\n setFinalised(false);\n };\n \n const clearAll = () => {\n setEntries(EMPTY_ENTRIES);\n setReasons([]);\n- setPatient(\"\");\n setPlanDate(\"\");\n setFinalised(false);\n };\n \n return (\n \n {/* Tool header */}\n

\n- \n+ {\n+ if (!isDirty) return true;\n+ return window.confirm(\n+ \"Leave this safety plan? Your entries are only in this browser tab and will be lost.\",\n+ );\n+ }}\n+ />\n \n \n \n

Clinical KB · Clinical tool

\n Safety plan generator\n

\n- Build an evidence-based safety plan with your patient — the six prioritised steps — then print,\n- save as PDF, or hand over a copy.\n+ Build an identifier-free safety plan with your patient — the six prioritised steps — then\n+ export it through your approved clinical workflow.\n

\n {STEPS.map((step) => (\n \n ))}\n

\n Plan progress\n

\n \n {/* ---------- Builder ---------- */}\n \n

\n Build the plan\n

\n \n \n

\n \n- {/* Patient context */}\n-

\n-

\n- \n- Patient (name or initials)\n- \n- {\n- setPatient(event.target.value);\n- setFinalised(false);\n- }}\n- placeholder=\"e.g. Sam R.\"\n- className={fieldControlPlain}\n- />\n+ {/* Local-only working boundary */}\n+

\n+ \n+

\n+ Keep this plan identifier-free\n+

\n+ Do not enter the patient's name, date of birth, or record number. Enter only the minimum plan\n+ details and support contacts needed. Working content is kept only in this browser tab; Clinical KB\n+ does not save it or send it to a server.\n+