diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 4c1c99d5..aea66650 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,4 +1,7 @@
+import type { ReactNode } from 'react';
+import { MotionConfig } from 'motion/react';
 import { AuthProvider, useAuth } from './context/AuthContext';
+import { useReducedMotion } from './hooks/use-theme';
 import { NodeProvider } from './context/NodeContext';
 import { LicenseProvider } from './context/LicenseContext';
 import { Login } from './components/Login';
@@ -9,6 +12,20 @@ import { DeployFeedbackProvider } from './context/DeployFeedbackContext';
 import { DeployFeedbackPortal } from './components/DeployFeedbackPortal';
 import { ToastContainer } from './components/ui/toast';
 
+/** Gates framer-motion animations on the "Reduced motion" appearance setting.
+ *  'always' suppresses transform/layout motion app-wide; 'user' defers to the OS
+ *  prefers-reduced-motion. Sonner toasts do not use framer-motion, so they are
+ *  unaffected. Subscribes only to the motion flag to avoid re-rendering the app
+ *  tree on unrelated theme changes. */
+function MotionProvider({ children }: { children: ReactNode }) {
+  const reducedMotion = useReducedMotion();
+  return (
+    <MotionConfig reducedMotion={reducedMotion ? 'always' : 'user'}>
+      {children}
+    </MotionConfig>
+  );
+}
+
 function AppContent() {
   const { appStatus, isAuthenticated, needsSetup, completeSetup } = useAuth();
 
@@ -33,15 +50,17 @@ function AppContent() {
   }
 
   return (
-    <NodeProvider>
-      <LicenseProvider>
-        <EditorLayout />
-        {/* Portal lives inside LicenseProvider so the editor surface and its
-            portalled overlays can read license state via useLicense().
-            Outer DeployFeedbackProvider is still an ancestor through App. */}
-        <DeployFeedbackPortal />
-      </LicenseProvider>
-    </NodeProvider>
+    <MotionProvider>
+      <NodeProvider>
+        <LicenseProvider>
+          <EditorLayout />
+          {/* Portal lives inside LicenseProvider so the editor surface and its
+              portalled overlays can read license state via useLicense().
+              Outer DeployFeedbackProvider is still an ancestor through App. */}
+          <DeployFeedbackPortal />
+        </LicenseProvider>
+      </NodeProvider>
+    </MotionProvider>
   );
 }
 
diff --git a/frontend/src/components/EditorLayout.tsx b/frontend/src/components/EditorLayout.tsx
index 8ecd05a3..503eb238 100644
--- a/frontend/src/components/EditorLayout.tsx
+++ b/frontend/src/components/EditorLayout.tsx
@@ -176,6 +176,7 @@ export default function EditorLayout() {
     activeView, setActiveView,
     settingsSection, setSettingsSection,
     securityTab, setSecurityTab,
+    fleetTab, setFleetTab,
     filterNodeId, setFilterNodeId,
     schedulePrefill,
     mobileNavOpen, setMobileNavOpen,
@@ -762,6 +763,8 @@ export default function EditorLayout() {
             onFleetUpdatesIntentConsumed={handleFleetUpdatesIntentConsumed}
             securityTab={securityTab}
             onSecurityTabChange={setSecurityTab}
+            fleetTab={fleetTab}
+            onFleetTabConsumed={() => setFleetTab(null)}
             renderEditor={renderEditor}
           />
         </div>
diff --git a/frontend/src/components/EditorLayout/CreateStackDialog.tsx b/frontend/src/components/EditorLayout/CreateStackDialog.tsx
index c1791dad..76f816bc 100644
--- a/frontend/src/components/EditorLayout/CreateStackDialog.tsx
+++ b/frontend/src/components/EditorLayout/CreateStackDialog.tsx
@@ -426,55 +426,53 @@ export function CreateStackDialog({ open, onOpenChange, onStackCreated, onStacks
 
             {createMode === 'git' && (
                 <div role="tabpanel" id={panelId('git')} aria-labelledby={tabId('git')}>
-                    <ScrollArea block className="max-h-[60vh]">
-                        <ModalBody>
-                            <div className="space-y-2">
-                                <Label htmlFor="create-git-stack-name">Stack Name</Label>
-                                <Input
-                                    id="create-git-stack-name"
-                                    placeholder="Stack name (e.g., myapp)"
-                                    value={newStackName}
-                                    onChange={(e) => setNewStackName(e.target.value)}
-                                    disabled={creatingFromGit}
-                                />
-                            </div>
-
-                            <GitSourceFields
-                                variant="create"
+                    <ModalBody>
+                        <div className="space-y-2">
+                            <Label htmlFor="create-git-stack-name">Stack Name</Label>
+                            <Input
+                                id="create-git-stack-name"
+                                placeholder="Stack name (e.g., myapp)"
+                                value={newStackName}
+                                onChange={(e) => setNewStackName(e.target.value)}
                                 disabled={creatingFromGit}
-                                repoUrl={gitRepoUrl}
-                                branch={gitBranch}
-                                composePaths={gitComposePaths}
-                                contextDir={gitContextDir}
-                                syncEnv={gitSyncEnv}
-                                authType={gitAuthType}
-                                token={gitToken}
-                                hasStoredToken={false}
-                                applyMode={gitApplyMode}
-                                onRepoUrlChange={setGitRepoUrl}
-                                onBranchChange={setGitBranch}
-                                onComposePathsChange={setGitComposePaths}
-                                onContextDirChange={setGitContextDir}
-                                onSyncEnvChange={setGitSyncEnv}
-                                onAuthTypeChange={setGitAuthType}
-                                onTokenChange={setGitToken}
-                                onApplyModeChange={setGitApplyMode}
-                                onBrowse={browseGitRepo}
                             />
+                        </div>
 
-                            <div className="flex items-center gap-2">
-                                <Checkbox
-                                    id="create-git-deploy-now"
-                                    checked={gitDeployNow}
-                                    onCheckedChange={(c) => setGitDeployNow(c === true)}
-                                    disabled={creatingFromGit}
-                                />
-                                <Label htmlFor="create-git-deploy-now" className="text-xs cursor-pointer">
-                                    Deploy after create
-                                </Label>
-                            </div>
-                        </ModalBody>
-                    </ScrollArea>
+                        <GitSourceFields
+                            variant="create"
+                            disabled={creatingFromGit}
+                            repoUrl={gitRepoUrl}
+                            branch={gitBranch}
+                            composePaths={gitComposePaths}
+                            contextDir={gitContextDir}
+                            syncEnv={gitSyncEnv}
+                            authType={gitAuthType}
+                            token={gitToken}
+                            hasStoredToken={false}
+                            applyMode={gitApplyMode}
+                            onRepoUrlChange={setGitRepoUrl}
+                            onBranchChange={setGitBranch}
+                            onComposePathsChange={setGitComposePaths}
+                            onContextDirChange={setGitContextDir}
+                            onSyncEnvChange={setGitSyncEnv}
+                            onAuthTypeChange={setGitAuthType}
+                            onTokenChange={setGitToken}
+                            onApplyModeChange={setGitApplyMode}
+                            onBrowse={browseGitRepo}
+                        />
+
+                        <div className="flex items-center gap-2">
+                            <Checkbox
+                                id="create-git-deploy-now"
+                                checked={gitDeployNow}
+                                onCheckedChange={(c) => setGitDeployNow(c === true)}
+                                disabled={creatingFromGit}
+                            />
+                            <Label htmlFor="create-git-deploy-now" className="text-xs cursor-pointer">
+                                Deploy after create
+                            </Label>
+                        </div>
+                    </ModalBody>
                     <ModalFooter
                         hint="HTTPS REPOS ONLY"
                         secondary={
diff --git a/frontend/src/components/EditorLayout/EditorView.tsx b/frontend/src/components/EditorLayout/EditorView.tsx
index c18a4439..34f25593 100644
--- a/frontend/src/components/EditorLayout/EditorView.tsx
+++ b/frontend/src/components/EditorLayout/EditorView.tsx
@@ -1,4 +1,4 @@
-import { Suspense, useRef, useEffect } from 'react';
+import { Suspense, useRef, useEffect, useState } from 'react';
 import { Editor } from '@/lib/monacoLoader';
 import {
     Save,
@@ -8,6 +8,8 @@ import {
     ChevronDown,
     GitBranch,
     FolderOpen,
+    Maximize2,
+    Minimize2,
 } from 'lucide-react';
 import { Button } from '../ui/button';
 import { Card, CardContent, CardHeader } from '../ui/card';
@@ -314,6 +316,14 @@ export function EditorView(props: EditorViewProps) {
         }
     }, [activeTab, canRead, setActiveTab]);
 
+    // Fullscreen the file browser + editor by collapsing the left column. Only
+    // meaningful on the files tab; reset when leaving it or closing the editor so
+    // it can never strand the compose/env panels in a single-column layout.
+    const [filesFullscreen, setFilesFullscreen] = useState(false);
+    useEffect(() => {
+        if (!editingCompose || activeTab !== 'files') setFilesFullscreen(false);
+    }, [editingCompose, activeTab]);
+
     // Below md, render the segmented full-screen mobile detail instead of the
     // desktop two-pane grid. All hooks above run unconditionally before this
     // branch so hook order stays stable across breakpoints.
@@ -324,8 +334,10 @@ export function EditorView(props: EditorViewProps) {
 
     return (
         <ErrorBoundary>
-            <div className="grid gap-6 grid-cols-1 lg:grid-cols-2 min-h-[600px] h-[calc(100vh-160px)] max-h-[1040px]">
-                {/* Left column: identity + health strip + logs, stacked */}
+            <div className={`grid gap-6 ${filesFullscreen ? 'grid-cols-1' : 'grid-cols-1 lg:grid-cols-2'} min-h-[600px] h-[calc(100vh-160px)] max-h-[1040px]`}>
+                {/* Left column: identity + health strip + logs, stacked. Hidden in
+                    files fullscreen so the editor card fills the width. */}
+                {!filesFullscreen && (
                 <div className="flex flex-col gap-6 min-h-0">
                     {/* Command Center Card (identity + health strip) */}
                     <Card className="rounded-xl border-muted bg-card shrink-0">
@@ -396,6 +408,7 @@ export function EditorView(props: EditorViewProps) {
                     {/* Logs Section (fills remaining left-column height) */}
                     <StackLogsSection stackName={stackName} logsMode={logsMode} setLogsMode={setLogsMode} />
                 </div>
+                )}
 
                 {/* Right column: anatomy panel by default, Monaco editor when editing */}
                 {editingCompose ? (
@@ -415,7 +428,7 @@ export function EditorView(props: EditorViewProps) {
                                                 <TabsHighlightItem value="files">
                                                     <TabsTrigger value="files">
                                                         <FolderOpen className="w-3.5 h-3.5 mr-1" strokeWidth={1.5} />
-                                                        Files &amp; Volumes
+                                                        Files
                                                     </TabsTrigger>
                                                 </TabsHighlightItem>
                                             )}
@@ -485,6 +498,20 @@ export function EditorView(props: EditorViewProps) {
                                         )}
                                     </>
                                 )}
+                                {activeTab === 'files' && (
+                                    <Button
+                                        size="sm"
+                                        variant="ghost"
+                                        className="rounded-lg h-8 w-8 p-0"
+                                        onClick={() => setFilesFullscreen((v) => !v)}
+                                        aria-label={filesFullscreen ? 'Exit full screen' : 'Full screen'}
+                                        title={filesFullscreen ? 'Exit full screen' : 'Full screen'}
+                                    >
+                                        {filesFullscreen
+                                            ? <Minimize2 className="w-4 h-4" strokeWidth={1.5} />
+                                            : <Maximize2 className="w-4 h-4" strokeWidth={1.5} />}
+                                    </Button>
+                                )}
                                 <Button
                                     size="sm"
                                     variant="ghost"
diff --git a/frontend/src/components/EditorLayout/ViewRouter.tsx b/frontend/src/components/EditorLayout/ViewRouter.tsx
index 1a2ee2aa..ee108bc9 100644
--- a/frontend/src/components/EditorLayout/ViewRouter.tsx
+++ b/frontend/src/components/EditorLayout/ViewRouter.tsx
@@ -13,7 +13,7 @@ import HomeDashboard from '../HomeDashboard';
 import type { NotificationItem } from '../dashboard/types';
 import type { ScheduleTaskPrefill } from '../ScheduledOperationsView';
 import type { ActiveView } from './hooks/useViewNavigationState';
-import type { SecurityTab } from '@/lib/events';
+import type { SecurityTab, FleetTab } from '@/lib/events';
 
 // Paid-tier views are loaded on demand. Their internal PaidGate /
 // CapabilityGate wrappers render
@@ -89,6 +89,8 @@ export interface ViewRouterProps {
     onSecurityTabChange: (tab: SecurityTab) => void;
     fleetUpdatesIntent?: { tab: 'nodes' | 'changelog' } | null;
     onFleetUpdatesIntentConsumed?: () => void;
+    fleetTab?: FleetTab | null;
+    onFleetTabConsumed?: () => void;
     // Render slot for the inline editor view. Kept as a callback so the
     // (large) editor JSX is only allocated when activeView === 'editor',
     // not on every parent render that lands on a different view.
@@ -116,6 +118,8 @@ export function ViewRouter({
     onSecurityTabChange,
     fleetUpdatesIntent,
     onFleetUpdatesIntentConsumed,
+    fleetTab,
+    onFleetTabConsumed,
     renderEditor,
 }: ViewRouterProps): ReactNode {
     const { can } = useAuth();
@@ -183,6 +187,8 @@ export function ViewRouter({
                       onNavigateToNode={onFleetNavigateToNode}
                       fleetUpdatesIntent={fleetUpdatesIntent}
                       onFleetUpdatesIntentConsumed={onFleetUpdatesIntentConsumed}
+                      fleetTab={fleetTab}
+                      onFleetTabConsumed={onFleetTabConsumed}
                     />
                     </LazyView>
                 </CapabilityGate>
diff --git a/frontend/src/components/EditorLayout/__tests__/useViewNavigationState.test.tsx b/frontend/src/components/EditorLayout/__tests__/useViewNavigationState.test.tsx
index 3c8f61e7..733fb198 100644
--- a/frontend/src/components/EditorLayout/__tests__/useViewNavigationState.test.tsx
+++ b/frontend/src/components/EditorLayout/__tests__/useViewNavigationState.test.tsx
@@ -155,6 +155,17 @@ describe('useViewNavigationState', () => {
     expect(result.current.filterNodeId).toBe(5);
   });
 
+  it('SENCHO_NAVIGATE_EVENT to fleet sets fleetTab then activeView (deep-link, no race)', () => {
+    const { result } = renderHook(() => useViewNavigationState());
+    act(() => {
+      window.dispatchEvent(
+        new CustomEvent(SENCHO_NAVIGATE_EVENT, { detail: { view: 'fleet', fleetTab: 'snapshots' } }),
+      );
+    });
+    expect(result.current.activeView).toBe('fleet');
+    expect(result.current.fleetTab).toBe('snapshots');
+  });
+
   it('SENCHO_NAVIGATE_EVENT with no nodeId sets filterNodeId to null', () => {
     const { result } = renderHook(() => useViewNavigationState());
     act(() => {
diff --git a/frontend/src/components/EditorLayout/hooks/useViewNavigationState.ts b/frontend/src/components/EditorLayout/hooks/useViewNavigationState.ts
index 21deae42..778d5591 100644
--- a/frontend/src/components/EditorLayout/hooks/useViewNavigationState.ts
+++ b/frontend/src/components/EditorLayout/hooks/useViewNavigationState.ts
@@ -9,7 +9,7 @@ import { useLicense } from '@/context/LicenseContext';
 import { useNodes } from '@/context/NodeContext';
 import { SENCHO_NAVIGATE_EVENT } from '@/components/NodeManager';
 import type { SenchoNavigateDetail } from '@/components/NodeManager';
-import type { SecurityTab } from '@/lib/events';
+import type { SecurityTab, FleetTab } from '@/lib/events';
 import type { SectionId } from '@/components/settings/types';
 import type { ScheduleTaskPrefill } from '@/components/ScheduledOperationsView';
 
@@ -61,6 +61,7 @@ export function useViewNavigationState(options?: UseViewNavigationStateOptions)
   const [activeView, setActiveView] = useState<ActiveView>('dashboard');
   const [settingsSection, setSettingsSection] = useState<SectionId>('appearance');
   const [securityTab, setSecurityTab] = useState<SecurityTab>('overview');
+  const [fleetTab, setFleetTab] = useState<FleetTab | null>(null);
   const [filterNodeId, setFilterNodeId] = useState<number | null>(null);
   const [schedulePrefill, setSchedulePrefill] = useState<ScheduleTaskPrefill | null>(null);
   const [mobileNavOpen, setMobileNavOpen] = useState(false);
@@ -96,6 +97,14 @@ export function useViewNavigationState(options?: UseViewNavigationStateOptions)
         setFilterNodeId(detail.nodeId ?? null);
         return;
       }
+      if (detail.view === 'fleet') {
+        // Set the target sub-tab before switching so the controlled FleetView
+        // lands on it (e.g. Snapshots from the stack storage warning).
+        if (detail.fleetTab) setFleetTab(detail.fleetTab);
+        setActiveView('fleet');
+        setFilterNodeId(detail.nodeId ?? null);
+        return;
+      }
       setActiveView(detail.view as ActiveView);
       setFilterNodeId(detail.nodeId ?? null);
     };
@@ -146,6 +155,7 @@ export function useViewNavigationState(options?: UseViewNavigationStateOptions)
     activeView, setActiveView,
     settingsSection, setSettingsSection,
     securityTab, setSecurityTab,
+    fleetTab, setFleetTab,
     filterNodeId, setFilterNodeId,
     schedulePrefill, setSchedulePrefill,
     mobileNavOpen, setMobileNavOpen,
diff --git a/frontend/src/components/FleetSnapshots.tsx b/frontend/src/components/FleetSnapshots.tsx
index bde11bb8..5906180f 100644
--- a/frontend/src/components/FleetSnapshots.tsx
+++ b/frontend/src/components/FleetSnapshots.tsx
@@ -651,16 +651,18 @@ export default function FleetSnapshots() {
                                                                     {/* Preserved dossier notes (read-only) */}
                                                                     {dossier && <DossierBlock dossier={dossier} />}
 
-                                                                    {/* Restore button (admin only) */}
+                                                                    {/* Restore (admin only), right-aligned to match the file action row */}
                                                                     {isAdmin && (
-                                                                        <RestoreButton
-                                                                            nodeId={node.nodeId}
-                                                                            nodeName={node.nodeName}
-                                                                            stackName={stack.stackName}
-                                                                            hasDossier={!!dossier}
-                                                                            restoring={restoringStack === `${node.nodeId}:${stack.stackName}`}
-                                                                            onRestore={handleRestore}
-                                                                        />
+                                                                        <div className="flex justify-end px-3">
+                                                                            <RestoreButton
+                                                                                nodeId={node.nodeId}
+                                                                                nodeName={node.nodeName}
+                                                                                stackName={stack.stackName}
+                                                                                hasDossier={!!dossier}
+                                                                                restoring={restoringStack === `${node.nodeId}:${stack.stackName}`}
+                                                                                onRestore={handleRestore}
+                                                                            />
+                                                                        </div>
                                                                     )}
                                                                 </div>
                                                             )}
@@ -919,16 +921,16 @@ function RestoreButton({ nodeId, nodeName, stackName, hasDossier, restoring, onR
     return (
         <>
             <Button
-                variant="outline"
+                variant="ghost"
                 size="sm"
-                className="h-7 px-2.5 text-xs gap-1.5 ml-3 mt-1"
+                className="h-6 px-2 text-xs"
                 disabled={restoring}
                 onClick={() => setOpen(true)}
             >
                 {restoring ? (
-                    <Loader2 className="w-3 h-3 animate-spin" />
+                    <Loader2 className="w-3 h-3 mr-1 animate-spin" />
                 ) : (
-                    <RotateCcw className="w-3 h-3" strokeWidth={1.5} />
+                    <RotateCcw className="w-3 h-3 mr-1" strokeWidth={1.5} />
                 )}
                 Restore
             </Button>
@@ -1020,16 +1022,16 @@ function RestoreAllButton({ restoring, hasDocumentation, onRestoreAll }: {
     return (
         <>
             <Button
-                variant="outline"
+                variant="ghost"
                 size="sm"
-                className="h-8 gap-1.5 shrink-0"
+                className="h-6 px-2 text-xs shrink-0"
                 disabled={restoring}
                 onClick={() => setOpen(true)}
             >
                 {restoring ? (
-                    <Loader2 className="w-3.5 h-3.5 animate-spin" />
+                    <Loader2 className="w-3 h-3 mr-1 animate-spin" />
                 ) : (
-                    <RotateCcw className="w-3.5 h-3.5" strokeWidth={1.5} />
+                    <RotateCcw className="w-3 h-3 mr-1" strokeWidth={1.5} />
                 )}
                 Restore all
             </Button>
diff --git a/frontend/src/components/FleetView.tsx b/frontend/src/components/FleetView.tsx
index 8f079fd2..f82fec72 100644
--- a/frontend/src/components/FleetView.tsx
+++ b/frontend/src/components/FleetView.tsx
@@ -30,14 +30,18 @@ import { FleetActionsTab } from './fleet/FleetActions/FleetActionsTab';
 import { SecretsTab } from './fleet/secrets/SecretsTab';
 import { DependencyMapTab } from './fleet/DependencyMapTab';
 import { useNodeActions } from './nodes/useNodeActions';
+import type { FleetTab } from '@/lib/events';
 
 interface FleetViewProps {
     onNavigateToNode: (nodeId: number, stackName: string) => void;
     fleetUpdatesIntent?: { tab: 'nodes' | 'changelog' } | null;
     onFleetUpdatesIntentConsumed?: () => void;
+    /** Deep-link target tab (e.g. 'snapshots' from the stack storage warning). */
+    fleetTab?: FleetTab | null;
+    onFleetTabConsumed?: () => void;
 }
 
-export function FleetView({ onNavigateToNode, fleetUpdatesIntent, onFleetUpdatesIntentConsumed }: FleetViewProps) {
+export function FleetView({ onNavigateToNode, fleetUpdatesIntent, onFleetUpdatesIntentConsumed, fleetTab, onFleetTabConsumed }: FleetViewProps) {
     const { isPaid } = useLicense();
     const { isAdmin } = useAuth();
 
@@ -55,6 +59,10 @@ export function FleetView({ onNavigateToNode, fleetUpdatesIntent, onFleetUpdates
 
     const [initialUpdatesTab, setInitialUpdatesTab] = useState<'nodes' | 'changelog'>('nodes');
 
+    // Controlled tab value so a deep-link (e.g. Snapshots from the stack storage
+    // warning) can land on the right tab.
+    const [activeTab, setActiveTab] = useState<FleetTab>('overview');
+
     useEffect(() => {
         if (fleetUpdatesIntent) {
             setInitialUpdatesTab(fleetUpdatesIntent.tab);
@@ -64,6 +72,13 @@ export function FleetView({ onNavigateToNode, fleetUpdatesIntent, onFleetUpdates
         }
     }, [fleetUpdatesIntent, updateStatus, onFleetUpdatesIntentConsumed]);
 
+    useEffect(() => {
+        if (fleetTab) {
+            setActiveTab(fleetTab);
+            onFleetTabConsumed?.();
+        }
+    }, [fleetTab, onFleetTabConsumed]);
+
     const { mastheadStats, lastSyncAt, loading, refreshing } = overview;
 
     const { openCreate, openEdit, openDelete, NodeActionModals } = useNodeActions({
@@ -86,8 +101,8 @@ export function FleetView({ onNavigateToNode, fleetUpdatesIntent, onFleetUpdates
                 loading={loading}
             />
 
-            <Tabs defaultValue="overview">
-                <div className="flex items-center justify-between gap-3 mb-4 flex-wrap">
+            <Tabs value={activeTab} onValueChange={(v) => setActiveTab(v as FleetTab)}>
+                <div className="flex items-center justify-between gap-3 mb-4 flex-wrap rounded-lg border border-card-border bg-card/40 px-2.5 py-1.5">
                     <TabsList className="max-md:w-full max-md:overflow-x-auto max-md:[scrollbar-width:none]">
                         <TabsHighlight className="rounded-md bg-glass-highlight" transition={springs.snappy}>
                             <TabsHighlightItem value="overview">
@@ -146,16 +161,17 @@ export function FleetView({ onNavigateToNode, fleetUpdatesIntent, onFleetUpdates
                             )}
                         </TabsHighlight>
                     </TabsList>
-                    <div className="flex items-center gap-2 max-md:w-full max-md:flex-wrap">
+                    <div className="flex items-center gap-2 shrink-0">
                         <Button
                             variant="outline"
                             size="sm"
                             onClick={() => overview.fetchOverview(true)}
                             disabled={refreshing}
-                            className="gap-2"
+                            className="h-9 w-9 p-0"
+                            title="Refresh"
+                            aria-label="Refresh"
                         >
                             <RefreshCw className={`w-4 h-4 ${refreshing ? 'animate-spin' : ''}`} />
-                            Refresh
                         </Button>
                         {isAdmin && (
                             <Button
@@ -163,10 +179,11 @@ export function FleetView({ onNavigateToNode, fleetUpdatesIntent, onFleetUpdates
                                 size="sm"
                                 onClick={() => { void exportDossier(); }}
                                 disabled={exporting}
-                                className="gap-2"
+                                className="h-9 w-9 p-0"
+                                title="Export Dossier"
+                                aria-label="Export Dossier"
                             >
                                 <FileDown className={`w-4 h-4 ${exporting ? 'animate-pulse' : ''}`} />
-                                {exporting ? 'Exporting…' : 'Export Dossier'}
                             </Button>
                         )}
                     </div>
diff --git a/frontend/src/components/FleetView/OverviewToolbar.tsx b/frontend/src/components/FleetView/OverviewToolbar.tsx
index ffdbac52..aac1ec14 100644
--- a/frontend/src/components/FleetView/OverviewToolbar.tsx
+++ b/frontend/src/components/FleetView/OverviewToolbar.tsx
@@ -259,19 +259,25 @@ export function OverviewToolbar({
                 <Button
                     variant="outline"
                     size="sm"
-                    className="gap-2 shrink-0 h-9"
+                    className="h-9 w-9 p-0 shrink-0"
                     onClick={onCheckUpdates}
                     disabled={checkingUpdates}
+                    title="Check for updates"
+                    aria-label="Check for updates"
                 >
                     <RefreshCcwDot className={`w-4 h-4 ${checkingUpdates ? 'animate-spin' : ''}`} />
-                    Check Updates
                 </Button>
             )}
 
             {onAddNode && (
-                <Button size="sm" className="gap-1.5 shrink-0 h-9" onClick={onAddNode}>
+                <Button
+                    size="sm"
+                    className="h-9 w-9 p-0 shrink-0"
+                    onClick={onAddNode}
+                    title="Add node"
+                    aria-label="Add node"
+                >
                     <Plus className="w-4 h-4" strokeWidth={1.5} />
-                    Add node
                 </Button>
             )}
         </div>
diff --git a/frontend/src/components/FleetView/__tests__/OverviewToolbar.test.tsx b/frontend/src/components/FleetView/__tests__/OverviewToolbar.test.tsx
index 8ea5cc5f..7d92e3b5 100644
--- a/frontend/src/components/FleetView/__tests__/OverviewToolbar.test.tsx
+++ b/frontend/src/components/FleetView/__tests__/OverviewToolbar.test.tsx
@@ -97,17 +97,17 @@ describe('OverviewToolbar', () => {
   it('renders the Check Updates button and fires onCheckUpdates when provided', () => {
     const onCheckUpdates = vi.fn();
     render(<OverviewToolbar {...props({ onCheckUpdates })} />);
-    fireEvent.click(screen.getByRole('button', { name: /Check Updates/ }));
+    fireEvent.click(screen.getByRole('button', { name: /Check for updates/ }));
     expect(onCheckUpdates).toHaveBeenCalledTimes(1);
   });
 
   it('omits the Check Updates button when onCheckUpdates is not provided', () => {
     render(<OverviewToolbar {...props()} />);
-    expect(screen.queryByRole('button', { name: /Check Updates/ })).not.toBeInTheDocument();
+    expect(screen.queryByRole('button', { name: /Check for updates/ })).not.toBeInTheDocument();
   });
 
   it('disables the Check Updates button while a check is in flight', () => {
     render(<OverviewToolbar {...props({ onCheckUpdates: vi.fn(), checkingUpdates: true })} />);
-    expect(screen.getByRole('button', { name: /Check Updates/ })).toBeDisabled();
+    expect(screen.getByRole('button', { name: /Check for updates/ })).toBeDisabled();
   });
 });
diff --git a/frontend/src/components/NodeManager.tsx b/frontend/src/components/NodeManager.tsx
index 222144c9..6ec431b8 100644
--- a/frontend/src/components/NodeManager.tsx
+++ b/frontend/src/components/NodeManager.tsx
@@ -19,7 +19,7 @@ import { useAuth } from '@/context/AuthContext';
 import { useNodeActions, type NodeTestInfo } from './nodes/useNodeActions';
 import { useFleetSyncStatus } from '@/hooks/useFleetSyncStatus';
 import { resetFleetSyncAnchor, STICKY_CONTROL_IDENTITY_MISMATCH } from '@/lib/fleetSyncApi';
-import type { SecurityTab } from '@/lib/events';
+import type { SecurityTab, FleetTab } from '@/lib/events';
 
 interface NodeSchedulingSummary {
   active_tasks: number;
@@ -30,10 +30,12 @@ interface NodeSchedulingSummary {
 
 export const SENCHO_NAVIGATE_EVENT = 'sencho-navigate';
 export interface SenchoNavigateDetail {
-  view: 'scheduled-ops' | 'auto-updates' | 'security';
+  view: 'scheduled-ops' | 'auto-updates' | 'security' | 'fleet';
   nodeId?: number;
   /** Target tab when navigating to the Security view. */
   tab?: SecurityTab;
+  /** Target tab when navigating to the Fleet view (e.g. 'snapshots'). */
+  fleetTab?: FleetTab;
 }
 
 export function NodeManager() {
diff --git a/frontend/src/components/StackAnatomyPanel.tsx b/frontend/src/components/StackAnatomyPanel.tsx
index b6b26f32..da62f2e7 100644
--- a/frontend/src/components/StackAnatomyPanel.tsx
+++ b/frontend/src/components/StackAnatomyPanel.tsx
@@ -6,6 +6,7 @@ import { ScrollableTabRow } from './ui/ScrollableTabRow';
 import { apiFetch } from '@/lib/api';
 import { cn } from '@/lib/utils';
 import { type AnatomyMarkdownInput, type PortRow, type VolumeRow } from '@/lib/anatomyMarkdown';
+import { usePreflightDismiss } from '@/hooks/usePreflightDismiss';
 import { parseAnatomy, parseEnvKeys, formatGitSource, primaryPublishedHostPort, type GitSourceInfo } from '@/lib/anatomy';
 import { buildServiceUrl } from '@/lib/serviceUrl';
 import { StackActivityTimeline } from './stack/StackActivityTimeline';
@@ -108,6 +109,12 @@ export default function StackAnatomyPanel({
   // active tab content lazily, so the badge cannot come from PreflightPanel; the
   // parent reads the stored run once per stack/node change.
   const [preflightSeverity, setPreflightSeverity] = useState<string | null>(null);
+  // Findings power the dismiss fingerprint so the dot clears in lockstep with the
+  // banner and re-appears when the findings change.
+  const [preflightFindings, setPreflightFindings] = useState<Array<{ ruleId: string; severity: string; service?: string }> | undefined>(undefined);
+  // The Doctor tab dot clears when the high-risk banner is dismissed, and returns
+  // when the findings change (shared fingerprint with PreflightPanel).
+  const { dismissed: doctorDismissed } = usePreflightDismiss(stackName, activeNode?.id, preflightFindings);
   const [scanStatus, setScanStatus] = useState<{
     status: 'ok' | 'partial' | 'failed' | 'skipped' | null;
     attemptedAt?: number;
@@ -126,9 +133,12 @@ export default function StackAnatomyPanel({
         const res = await apiFetch(`/stacks/${stackName}/preflight`);
         if (cancelled || !res.ok) return;
         const data = await res.json();
-        if (!cancelled) setPreflightSeverity(typeof data?.highestSeverity === 'string' ? data.highestSeverity : null);
+        if (!cancelled) {
+          setPreflightSeverity(typeof data?.highestSeverity === 'string' ? data.highestSeverity : null);
+          setPreflightFindings(Array.isArray(data?.findings) ? data.findings : undefined);
+        }
       } catch {
-        if (!cancelled) setPreflightSeverity(null);
+        if (!cancelled) { setPreflightSeverity(null); setPreflightFindings(undefined); }
       }
     })();
     return () => { cancelled = true; };
@@ -363,7 +373,7 @@ export default function StackAnatomyPanel({
               <TabsTrigger value="doctor" data-testid="doctor-tab" className="h-6 px-2.5 font-mono text-[10px] uppercase tracking-[0.18em]">
                 <span className="inline-flex items-center gap-1">
                   Doctor
-                  {(preflightSeverity === 'blocker' || preflightSeverity === 'high') && (
+                  {(preflightSeverity === 'blocker' || preflightSeverity === 'high') && !doctorDismissed && (
                     <span
                       data-testid="doctor-tab-dot"
                       className={cn('h-1.5 w-1.5 rounded-full', preflightSeverity === 'blocker' ? 'bg-destructive' : 'bg-warning')}
diff --git a/frontend/src/components/files/FileViewer.tsx b/frontend/src/components/files/FileViewer.tsx
index 507701f6..3b9380a4 100644
--- a/frontend/src/components/files/FileViewer.tsx
+++ b/frontend/src/components/files/FileViewer.tsx
@@ -1,12 +1,14 @@
 import { useState, useEffect, useMemo, useRef, Suspense } from 'react';
 import { Editor } from '@/lib/monacoLoader';
-import { AlertCircle, FileIcon, Download, Loader2, Save } from 'lucide-react';
+import { AlertCircle, FileIcon, Download, Loader2, Save, WrapText } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { Skeleton } from '@/components/ui/skeleton';
 import { toast } from '@/components/ui/toast-store';
 import { readStackFile, writeStackFile, downloadStackFile, FileConflictError } from '@/lib/stackFilesApi';
 import { extensionToLanguage } from '@/lib/monacoLanguages';
-import { formatBytes } from '@/lib/utils';
+import { cn, formatBytes } from '@/lib/utils';
+
+const WORD_WRAP_KEY = 'sencho.fileViewer.wordWrap';
 
 interface FileViewerProps {
   stackName: string;
@@ -131,6 +133,15 @@ export function FileViewer({
   const readOnly = !canEdit;
   const hasChanges = content !== originalContent;
 
+  // Word wrap, persisted across files and sessions. Defaults on so wide files
+  // do not require horizontal scrolling; only an explicit 'false' disables it.
+  const [wordWrap, setWordWrap] = useState(() => {
+    try { return localStorage.getItem(WORD_WRAP_KEY) !== 'false'; } catch { return true; }
+  });
+  useEffect(() => {
+    try { localStorage.setItem(WORD_WRAP_KEY, String(wordWrap)); } catch { /* ignore */ }
+  }, [wordWrap]);
+
   // Stash the latest callback in a ref so the unmount-cleanup effect can be
   // truly unmount-scoped without re-running every time a parent passes a fresh
   // function identity.
@@ -164,8 +175,9 @@ export function FileViewer({
       fontSize: 13,
       padding: { top: 8 },
       scrollBeyondLastLine: false,
+      wordWrap: wordWrap ? ('on' as const) : ('off' as const),
     }),
-    [readOnly],
+    [readOnly, wordWrap],
   );
 
   useEffect(() => {
@@ -350,6 +362,17 @@ export function FileViewer({
       <div className="flex items-center justify-between gap-2 px-3 py-1.5 border-b border-glass-border shrink-0">
         <span className="font-mono text-xs text-stat-subtitle truncate">{filename}</span>
         <div className="flex items-center gap-2 shrink-0">
+          <Button
+            size="sm"
+            variant="ghost"
+            className={cn('h-7 w-7 p-0', wordWrap ? 'text-brand' : 'text-stat-subtitle')}
+            onClick={() => setWordWrap((v) => !v)}
+            aria-pressed={wordWrap}
+            title={wordWrap ? 'Word wrap on' : 'Word wrap off'}
+            aria-label={wordWrap ? 'Disable word wrap' : 'Enable word wrap'}
+          >
+            <WrapText className="w-3.5 h-3.5" strokeWidth={1.5} />
+          </Button>
           {readOnly && (
             <span className="text-[10px] leading-3 uppercase tracking-[0.18em] text-stat-subtitle border border-border rounded px-1.5 py-0.5">
               Read-only
diff --git a/frontend/src/components/fleet/FleetEmptyState.tsx b/frontend/src/components/fleet/FleetEmptyState.tsx
index 78b8be02..19cdfa2b 100644
--- a/frontend/src/components/fleet/FleetEmptyState.tsx
+++ b/frontend/src/components/fleet/FleetEmptyState.tsx
@@ -8,15 +8,16 @@ interface FleetTabHeadingProps {
 }
 
 /**
- * Standardized Fleet tab header: italic-serif title and muted subtitle on the
+ * Standardized Fleet tab header: heading-styled title and muted subtitle on the
  * left, an optional primary action on the right. Rendered in both empty and
- * populated states so the tab chrome stays consistent.
+ * populated states so the tab chrome stays consistent. The title follows the
+ * theme heading style (signature italic or calm) via .font-heading.
  */
 export function FleetTabHeading({ title, subtitle, action }: FleetTabHeadingProps) {
     return (
         <div className="flex items-center justify-between gap-3">
             <div>
-                <h2 className="font-display italic text-[1.5rem] leading-tight text-stat-value">{title}</h2>
+                <h2 className="font-heading text-[1.5rem] leading-tight text-stat-value">{title}</h2>
                 <p className="text-sm text-stat-subtitle">{subtitle}</p>
             </div>
             {action}
@@ -44,15 +45,15 @@ interface FleetEmptyCardProps {
 }
 
 /**
- * Minimal empty-state card: centered icon, italic headline, muted one-line
- * description, optional CTA.
+ * Minimal empty-state card: centered icon, heading-styled headline, muted
+ * one-line description, optional CTA.
  */
 export function FleetEmptyCard({ icon: Icon, title, description, action }: FleetEmptyCardProps) {
     return (
         <div className="mx-auto max-w-xl rounded-xl border border-card-border/60 bg-popover/30 p-8 text-center space-y-4">
             <Icon className="mx-auto w-8 h-8 text-stat-subtitle" />
             <div>
-                <h3 className="font-display italic text-[1.25rem] text-stat-value">{title}</h3>
+                <h3 className="font-heading text-[1.25rem] text-stat-value">{title}</h3>
                 <p className="text-sm text-stat-subtitle leading-relaxed mt-1">{description}</p>
             </div>
             {action}
diff --git a/frontend/src/components/settings/AppearanceSection.tsx b/frontend/src/components/settings/AppearanceSection.tsx
index fdbf3b45..d74d738b 100644
--- a/frontend/src/components/settings/AppearanceSection.tsx
+++ b/frontend/src/components/settings/AppearanceSection.tsx
@@ -140,9 +140,9 @@ export function AppearanceSection() {
     const [topNavAlign, setTopNavAlign] = useTopNavAlign();
     const {
         theme, accent, borderBoost, glow, contrast, uiFont, monoFont, typeScale,
-        headingStyle, chartStyle, reducedEffects, readability,
+        headingStyle, chartStyle, reducedEffects, reducedMotion, readability,
         setTheme, setAccent, setBorderBoost, setGlow, setContrast, setUiFont, setMonoFont, setTypeScale,
-        setVisualStyle, setHeadingStyle, setChartStyle, setReducedEffects, setReadability,
+        setVisualStyle, setHeadingStyle, setChartStyle, setReducedEffects, setReducedMotion, setReadability,
     } = useTheme();
     const accentLabel = ACCENTS.find((a) => a.id === accent)?.label ?? 'Cyan';
     // Readability is a sticky master: it forces the calm resolution at apply time
@@ -252,6 +252,17 @@ export function AppearanceSection() {
                     />
                 </SettingsField>
 
+                <SettingsField
+                    label="Reduced motion"
+                    helper="Minimizes interface animations and transitions (dialogs, menus, expand and collapse). Toasts are unaffected."
+                >
+                    <TogglePill
+                        checked={reducedMotion}
+                        onChange={setReducedMotion}
+                        aria-label="Reduced motion"
+                    />
+                </SettingsField>
+
                 <SettingsField
                     label="Ambient glow"
                     helper="Intensity of the accent-tinted glow behind the page."
diff --git a/frontend/src/components/settings/SettingsSidebar.tsx b/frontend/src/components/settings/SettingsSidebar.tsx
index 8284ee65..42a1b133 100644
--- a/frontend/src/components/settings/SettingsSidebar.tsx
+++ b/frontend/src/components/settings/SettingsSidebar.tsx
@@ -81,16 +81,16 @@ export function SettingsSidebar({ currentSection, onSectionChange, dirtyFlags, o
                                             onClick={() => onSectionChange(item.id)}
                                             aria-current={isActive ? 'page' : undefined}
                                             className={cn(
-                                                'relative flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-xs transition-colors',
+                                                'relative flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-sm transition-colors',
                                                 isActive
-                                                    ? 'text-stat-value'
-                                                    : 'text-stat-subtitle hover:bg-accent/40 hover:text-stat-value',
+                                                    ? 'text-brand bg-gradient-to-r from-brand/[0.12] to-transparent'
+                                                    : 'text-foreground/80 hover:bg-muted/40',
                                             )}
                                         >
                                             {isActive && (
                                                 <span
                                                     aria-hidden="true"
-                                                    className="absolute inset-y-1 left-0 w-[3px] rounded-full bg-brand shadow-[0_0_8px_color-mix(in_oklch,var(--brand)_30%,transparent)]"
+                                                    className="absolute inset-y-0 left-0 w-[2px] rounded-sm bg-brand"
                                                 />
                                             )}
                                             <span
diff --git a/frontend/src/components/settings/__tests__/AppearanceSection.test.tsx b/frontend/src/components/settings/__tests__/AppearanceSection.test.tsx
index 5c3afd69..591611b5 100644
--- a/frontend/src/components/settings/__tests__/AppearanceSection.test.tsx
+++ b/frontend/src/components/settings/__tests__/AppearanceSection.test.tsx
@@ -13,6 +13,7 @@ function resetTheme() {
         result.current.setVisualStyle('signature');
         result.current.setContrast(0);
         result.current.setGlow(0.16);
+        result.current.setReducedMotion(false);
     });
 }
 
@@ -50,6 +51,17 @@ describe('AppearanceSection', () => {
         expect(container.querySelectorAll('[data-disabled]').length).toBeGreaterThan(0);
     });
 
+    it('reduced motion is independent of readability and toggles data-motion on <html>', () => {
+        render(<AppearanceSection />);
+        const motion = () => screen.getByRole('switch', { name: 'Reduced motion' }) as HTMLButtonElement;
+        expect(document.documentElement.dataset.motion).toBeUndefined();
+        // Readability flattens effects but must not disable the motion toggle.
+        fireEvent.click(screen.getByRole('switch', { name: 'Readability mode' }));
+        expect(motion().disabled).toBe(false);
+        fireEvent.click(motion());
+        expect(document.documentElement.dataset.motion).toBe('reduced');
+    });
+
     it('readability also locks the Visual style cards and the Border brightness slider', () => {
         const { container } = render(<AppearanceSection />);
         const calmCard = () => screen.getByRole('button', { name: /readable default/i }) as HTMLButtonElement;
diff --git a/frontend/src/components/stack/PreflightPanel.test.tsx b/frontend/src/components/stack/PreflightPanel.test.tsx
index 1bdbb564..32baab9e 100644
--- a/frontend/src/components/stack/PreflightPanel.test.tsx
+++ b/frontend/src/components/stack/PreflightPanel.test.tsx
@@ -42,7 +42,7 @@ function jsonRes(body: unknown, ok = true) {
   return { ok, status: ok ? 200 : 500, json: async () => body, text: async () => '' } as unknown as Response;
 }
 
-beforeEach(() => { vi.clearAllMocks(); });
+beforeEach(() => { vi.clearAllMocks(); localStorage.clear(); });
 
 describe('PreflightPanel', () => {
   it('shows the never-run empty state', async () => {
@@ -75,6 +75,19 @@ describe('PreflightPanel', () => {
     expect(screen.getByText('Image uses a moving tag')).toBeInTheDocument();
   });
 
+  it('dismisses only the result banner, keeping the finding rows', async () => {
+    vi.mocked(apiFetch).mockResolvedValue(jsonRes(report({
+      status: 'high', highestSeverity: 'high',
+      findings: [{ ruleId: 'privileged', severity: 'high', title: 'Privileged container', message: 'runs privileged', service: 'web' }],
+    })));
+    render(<PreflightPanel stackName="web" />);
+    expect(await screen.findByTestId('preflight-status')).toBeInTheDocument();
+    fireEvent.click(screen.getByTestId('preflight-dismiss-btn'));
+    expect(screen.queryByTestId('preflight-status')).not.toBeInTheDocument();
+    // Only the summary banner is dismissed; the finding row remains.
+    expect(screen.getByText('Privileged container')).toBeInTheDocument();
+  });
+
   it('surfaces the unrenderable state with the render error', async () => {
     vi.mocked(apiFetch).mockResolvedValue(jsonRes(report({
       renderable: false, status: 'unrenderable', highestSeverity: 'blocker',
diff --git a/frontend/src/components/stack/PreflightPanel.tsx b/frontend/src/components/stack/PreflightPanel.tsx
index 3c1f4c1f..02783e74 100644
--- a/frontend/src/components/stack/PreflightPanel.tsx
+++ b/frontend/src/components/stack/PreflightPanel.tsx
@@ -1,12 +1,13 @@
 import { useEffect, useState } from 'react';
 import {
-  Check, TriangleAlert, ShieldAlert, Info, RefreshCw, Stethoscope, type LucideIcon,
+  Check, TriangleAlert, ShieldAlert, Info, RefreshCw, Stethoscope, X, type LucideIcon,
 } from 'lucide-react';
 import { apiFetch } from '@/lib/api';
 import { cn } from '@/lib/utils';
 import { toast } from '@/components/ui/toast-store';
 import { formatTimeAgo } from '@/lib/relativeTime';
 import { useNodes } from '@/context/NodeContext';
+import { usePreflightDismiss } from '@/hooks/usePreflightDismiss';
 
 // Mirrors the backend payload shape (the frontend never imports backend).
 type PreflightSeverity = 'blocker' | 'high' | 'warning' | 'info';
@@ -152,6 +153,10 @@ export default function PreflightPanel({ stackName }: { stackName: string }) {
   const SummaryIcon = summary?.icon;
   const busy = loading || running;
 
+  // Dismiss the result banner (and the Doctor tab dot) until the findings change.
+  const { dismissed, dismiss } = usePreflightDismiss(stackName, nodeId, report?.findings);
+  const hasFindings = (report?.findings.length ?? 0) > 0;
+
   return (
     <div data-testid="preflight-panel" className="flex-1 min-h-0 overflow-y-auto px-3 py-3 flex flex-col gap-4">
       <div className="flex items-center justify-between gap-2">
@@ -192,9 +197,21 @@ export default function PreflightPanel({ stackName }: { stackName: string }) {
         </div>
       ) : (
         <>
-          {summary && SummaryIcon && (
-            <div data-testid="preflight-status" data-status={report.status} className={cn(CARD_CLASS, summary.tone)}>
-              <div className="flex items-center gap-2">
+          {summary && SummaryIcon && !dismissed && (
+            <div data-testid="preflight-status" data-status={report.status} className={cn(CARD_CLASS, summary.tone, 'relative')}>
+              {hasFindings && (
+                <button
+                  type="button"
+                  onClick={dismiss}
+                  data-testid="preflight-dismiss-btn"
+                  aria-label="Dismiss until findings change"
+                  title="Dismiss until findings change"
+                  className="absolute right-2 top-2 inline-flex h-5 w-5 items-center justify-center rounded text-current/70 hover:bg-current/10 hover:text-current"
+                >
+                  <X className="h-3.5 w-3.5" strokeWidth={1.5} />
+                </button>
+              )}
+              <div className="flex items-center gap-2 pr-6">
                 <SummaryIcon className="h-4 w-4 shrink-0" strokeWidth={1.5} />
                 <span className="font-mono text-[11px] uppercase tracking-wide">{summary.label}</span>
                 {report.ranAt && (
diff --git a/frontend/src/components/stack/StoragePanel.tsx b/frontend/src/components/stack/StoragePanel.tsx
index cca9bef7..640bd042 100644
--- a/frontend/src/components/stack/StoragePanel.tsx
+++ b/frontend/src/components/stack/StoragePanel.tsx
@@ -8,6 +8,7 @@ import { toast } from '@/components/ui/toast-store';
 import { formatTimeAgo } from '@/lib/relativeTime';
 import { useNodes } from '@/context/NodeContext';
 import { useAuth } from '@/context/AuthContext';
+import { SENCHO_NAVIGATE_EVENT, type SenchoNavigateDetail } from '@/components/NodeManager';
 
 // Mirrors the backend /storage payload (the frontend never imports backend).
 type PortabilityStatus = 'portable' | 'partially-portable' | 'node-bound' | 'unknown';
@@ -221,6 +222,17 @@ export default function StoragePanel({ stackName }: { stackName: string }) {
                     This stack has persistent storage but no fleet snapshot in the last 7 days.
                   </span>
                 </div>
+                {activeNode?.type !== 'remote' && (
+                  <button
+                    type="button"
+                    onClick={() => window.dispatchEvent(new CustomEvent<SenchoNavigateDetail>(SENCHO_NAVIGATE_EVENT, {
+                      detail: { view: 'fleet', fleetTab: 'snapshots' },
+                    }))}
+                    className="mt-1.5 text-[12px] font-medium text-brand hover:underline"
+                  >
+                    Take a fleet snapshot →
+                  </button>
+                )}
               </div>
             )}
             {isAdmin && inventory.stateful && snapshot.recent && snapshot.at && (
diff --git a/frontend/src/components/ui/fleet-action-card.tsx b/frontend/src/components/ui/fleet-action-card.tsx
index 2e2c3bd4..eb905ca6 100644
--- a/frontend/src/components/ui/fleet-action-card.tsx
+++ b/frontend/src/components/ui/fleet-action-card.tsx
@@ -174,7 +174,9 @@ export function FleetActionCard(props: FleetActionCardProps) {
         />
       </div>
 
-      <div className="px-6 flex-1">
+      {/* pt-4 so the first SheetSection (which zeroes its own top padding) clears
+          the action row's bottom border instead of overlapping it. */}
+      <div className="px-6 pt-4 flex-1">
         {children}
       </div>
 
diff --git a/frontend/src/hooks/__tests__/usePreflightDismiss.test.ts b/frontend/src/hooks/__tests__/usePreflightDismiss.test.ts
new file mode 100644
index 00000000..1d0adb55
--- /dev/null
+++ b/frontend/src/hooks/__tests__/usePreflightDismiss.test.ts
@@ -0,0 +1,50 @@
+import { describe, it, expect, beforeEach } from 'vitest';
+import { renderHook, act } from '@testing-library/react';
+import { usePreflightDismiss } from '../usePreflightDismiss';
+
+const findings = (sev: string) => [
+  { ruleId: 'DS001', severity: sev, service: 'web' },
+  { ruleId: 'DS002', severity: 'warning' },
+];
+
+describe('usePreflightDismiss', () => {
+  beforeEach(() => localStorage.clear());
+
+  it('is not dismissed until dismiss() is called', () => {
+    const { result } = renderHook(() => usePreflightDismiss('app', 1, findings('high')));
+    expect(result.current.dismissed).toBe(false);
+    act(() => result.current.dismiss());
+    expect(result.current.dismissed).toBe(true);
+  });
+
+  it('stays dismissed for an identical finding set (order-independent)', () => {
+    const first = renderHook(() => usePreflightDismiss('app', 1, findings('high')));
+    act(() => first.result.current.dismiss());
+    // A fresh consumer with the same findings in a different order reads dismissed.
+    const reordered = [...findings('high')].reverse();
+    const second = renderHook(() => usePreflightDismiss('app', 1, reordered));
+    expect(second.result.current.dismissed).toBe(true);
+  });
+
+  it('re-surfaces when the findings change', () => {
+    const first = renderHook(() => usePreflightDismiss('app', 1, findings('high')));
+    act(() => first.result.current.dismiss());
+    // Severity changed -> different fingerprint -> not dismissed.
+    const changed = renderHook(() => usePreflightDismiss('app', 1, findings('blocker')));
+    expect(changed.result.current.dismissed).toBe(false);
+  });
+
+  it('keys per stack and node', () => {
+    const a = renderHook(() => usePreflightDismiss('app', 1, findings('high')));
+    act(() => a.result.current.dismiss());
+    expect(renderHook(() => usePreflightDismiss('other', 1, findings('high'))).result.current.dismissed).toBe(false);
+    expect(renderHook(() => usePreflightDismiss('app', 2, findings('high'))).result.current.dismissed).toBe(false);
+  });
+
+  it('treats an empty finding set as never dismissed', () => {
+    const { result } = renderHook(() => usePreflightDismiss('app', 1, []));
+    expect(result.current.dismissed).toBe(false);
+    act(() => result.current.dismiss());
+    expect(result.current.dismissed).toBe(false);
+  });
+});
diff --git a/frontend/src/hooks/use-theme.ts b/frontend/src/hooks/use-theme.ts
index 06669376..aa45e4a8 100644
--- a/frontend/src/hooks/use-theme.ts
+++ b/frontend/src/hooks/use-theme.ts
@@ -44,6 +44,9 @@ export interface ThemeState {
     headingStyle: HeadingStyle;
     chartStyle: ChartStyle;
     reducedEffects: boolean;
+    /** Independent of reducedEffects (surface flattening): minimizes UI motion
+     *  (dialogs, menus, overlays, transitions). Not part of a visual-style preset. */
+    reducedMotion: boolean;
     readability: boolean;
 }
 
@@ -136,6 +139,9 @@ const DEFAULT_STATE: ThemeState = {
     theme: 'dim', accent: 'cyan', borderBoost: 0, glow: 0.16, contrast: 0,
     uiFont: 'Geist', monoFont: 'Geist Mono', typeScale: 1,
     ...CALM_PRESET,
+    // Independent of the visual-style presets; defaults off so the OS
+    // prefers-reduced-motion still governs via MotionConfig's 'user' mode.
+    reducedMotion: false,
 };
 
 const MODE_IDS = new Set<string>(THEME_MODES.map((m) => m.id));
@@ -200,6 +206,7 @@ function readStored(): ThemeState {
                     headingStyle: isHeadingStyle(p.headingStyle) ? p.headingStyle : SIGNATURE_PRESET.headingStyle,
                     chartStyle: isChartStyle(p.chartStyle) ? p.chartStyle : SIGNATURE_PRESET.chartStyle,
                     reducedEffects: isBool(p.reducedEffects) ? p.reducedEffects : SIGNATURE_PRESET.reducedEffects,
+                    reducedMotion: isBool(p.reducedMotion) ? p.reducedMotion : false,
                     readability: isBool(p.readability) ? p.readability : SIGNATURE_PRESET.readability,
                 };
             }
@@ -252,6 +259,9 @@ function applyToDom(s: ThemeState, systemDark: boolean) {
     root.dataset.chartStyle = chart;
     if (reduced) root.dataset.effects = 'reduced';
     else delete root.dataset.effects;
+    // Motion is independent of effects/readability: only the explicit toggle.
+    if (s.reducedMotion) root.dataset.motion = 'reduced';
+    else delete root.dataset.motion;
     root.style.setProperty('--border-boost', String(rd ? 0.03 : s.borderBoost));
     root.style.setProperty('--glow', String(reduced ? s.glow * 0.4 : s.glow));
     root.style.setProperty('--contrast', String(s.contrast + (rd ? 0.18 : 0)));
@@ -284,6 +294,7 @@ function sameState(a: ThemeState, b: ThemeState): boolean {
         && a.uiFont === b.uiFont && a.monoFont === b.monoFont && a.typeScale === b.typeScale
         && a.visualStyle === b.visualStyle && a.headingStyle === b.headingStyle
         && a.chartStyle === b.chartStyle && a.reducedEffects === b.reducedEffects
+        && a.reducedMotion === b.reducedMotion
         && a.readability === b.readability;
 }
 
@@ -312,6 +323,16 @@ function getSnapshot(): ThemeSnapshot {
     return snapshot;
 }
 
+/** Lean selector for just the reduced-motion flag, so a wrapper like MotionConfig
+ *  re-renders only when motion changes, not on every theme tweak. */
+export function useReducedMotion(): boolean {
+    return useSyncExternalStore(
+        subscribe,
+        () => persisted.reducedMotion,
+        () => DEFAULT_STATE.reducedMotion,
+    );
+}
+
 if (typeof window !== 'undefined') {
     // Cross-tab sync: another tab wrote a new look.
     window.addEventListener('storage', (e) => {
@@ -366,6 +387,7 @@ export function useTheme() {
     const setHeadingStyle = useCallback((headingStyle: HeadingStyle) => setState({ headingStyle }), []);
     const setChartStyle = useCallback((chartStyle: ChartStyle) => setState({ chartStyle }), []);
     const setReducedEffects = useCallback((reducedEffects: boolean) => setState({ reducedEffects }), []);
+    const setReducedMotion = useCallback((reducedMotion: boolean) => setState({ reducedMotion }), []);
     const setReadability = useCallback((readability: boolean) => setState({ readability }), []);
     const resolvedTheme = resolveWith(s.theme, s.systemDark);
     return {
@@ -381,6 +403,7 @@ export function useTheme() {
         headingStyle: s.headingStyle,
         chartStyle: s.chartStyle,
         reducedEffects: s.reducedEffects,
+        reducedMotion: s.reducedMotion,
         readability: s.readability,
         resolvedTheme,
         isDarkMode: resolvedTheme !== 'light',
@@ -396,6 +419,7 @@ export function useTheme() {
         setHeadingStyle,
         setChartStyle,
         setReducedEffects,
+        setReducedMotion,
         setReadability,
     } as const;
 }
diff --git a/frontend/src/hooks/usePreflightDismiss.ts b/frontend/src/hooks/usePreflightDismiss.ts
new file mode 100644
index 00000000..88ffd444
--- /dev/null
+++ b/frontend/src/hooks/usePreflightDismiss.ts
@@ -0,0 +1,69 @@
+import { useCallback, useEffect, useMemo, useState } from 'react';
+
+/** Minimal shape of a preflight finding needed to fingerprint a result set. */
+interface FindingLike {
+  ruleId: string;
+  severity: string;
+  service?: string;
+}
+
+// Bumped when a dismiss is written so sibling consumers (the Doctor tab dot and
+// the banner) re-read localStorage and agree, without a full page reload.
+const DISMISS_EVENT = 'sencho:preflight-dismiss-changed';
+
+const keyFor = (stackName: string, nodeId: number | undefined) =>
+  `sencho.doctorDismissed.${stackName}.${nodeId ?? 'local'}`;
+
+/** Stable, content-based fingerprint of the findings. Order-independent so a
+ *  reordered-but-identical result still counts as dismissed; any added, removed,
+ *  or re-severitied finding changes it, which re-surfaces the banner. */
+function fingerprint(findings: FindingLike[] | undefined): string {
+  if (!findings || findings.length === 0) return '';
+  return findings
+    .map((f) => `${f.ruleId}:${f.severity}:${f.service ?? ''}`)
+    .sort()
+    .join('|');
+}
+
+/**
+ * Per-stack dismiss for the Compose Doctor high-risk banner, persisted in
+ * localStorage and keyed to a fingerprint of the findings: the dismissal sticks
+ * across reloads and re-runs that produce identical findings, and clears
+ * automatically once the findings change. Used by both the banner (to hide
+ * itself) and the Doctor tab dot (to clear), kept in sync via a window event.
+ */
+export function usePreflightDismiss(
+  stackName: string,
+  nodeId: number | undefined,
+  findings: FindingLike[] | undefined,
+) {
+  const fp = useMemo(() => fingerprint(findings), [findings]);
+  const storageKey = keyFor(stackName, nodeId);
+
+  const read = useCallback(() => {
+    try { return localStorage.getItem(storageKey); } catch { return null; }
+  }, [storageKey]);
+
+  const [storedFp, setStoredFp] = useState<string | null>(() => read());
+
+  useEffect(() => {
+    setStoredFp(read());
+    const handler = () => setStoredFp(read());
+    window.addEventListener(DISMISS_EVENT, handler);
+    window.addEventListener('storage', handler);
+    return () => {
+      window.removeEventListener(DISMISS_EVENT, handler);
+      window.removeEventListener('storage', handler);
+    };
+  }, [read]);
+
+  const dismissed = fp !== '' && storedFp === fp;
+
+  const dismiss = useCallback(() => {
+    try { localStorage.setItem(storageKey, fp); } catch { /* ignore */ }
+    setStoredFp(fp);
+    window.dispatchEvent(new Event(DISMISS_EVENT));
+  }, [storageKey, fp]);
+
+  return { dismissed, dismiss };
+}
diff --git a/frontend/src/index.css b/frontend/src/index.css
index dffbdc7a..9d10e322 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -759,6 +759,18 @@ body {
   }
 }
 
+/* The "Reduced motion" appearance setting (data-motion="reduced" on <html>)
+   clamps CSS animations/transitions, mirroring the OS preference above. Sonner
+   toasts animate via inline transform/opacity (React state), not CSS, so they
+   are unaffected. framer-motion is handled separately by MotionConfig. */
+[data-motion="reduced"] *,
+[data-motion="reduced"] *::before,
+[data-motion="reduced"] *::after {
+  animation-duration: 0.01ms !important;
+  animation-iteration-count: 1 !important;
+  transition-duration: 0.01ms !important;
+}
+
 /* ─────────────────────────────────────────────────────────────
    XTERM.JS
 ───────────────────────────────────────────────────────────── */
diff --git a/frontend/src/lib/events.ts b/frontend/src/lib/events.ts
index 54908a61..78bcce06 100644
--- a/frontend/src/lib/events.ts
+++ b/frontend/src/lib/events.ts
@@ -34,3 +34,16 @@ export type SecurityTab =
   | 'suppressions'
   | 'history'
   | 'scanner';
+
+/** Fleet view sub-tabs, used for deep-link navigation (e.g. the stack storage
+ *  warning linking to Snapshots). Mirrors the TabsTrigger values in FleetView. */
+export type FleetTab =
+  | 'overview'
+  | 'snapshots'
+  | 'configuration'
+  | 'dependencies'
+  | 'deployments'
+  | 'routing'
+  | 'federation'
+  | 'actions'
+  | 'secrets';