diff --git a/frontend/src/components/FleetSnapshots.tsx b/frontend/src/components/FleetSnapshots.tsx
index a963416e..309996d9 100644
--- a/frontend/src/components/FleetSnapshots.tsx
+++ b/frontend/src/components/FleetSnapshots.tsx
@@ -18,6 +18,7 @@ import { apiFetch } from '@/lib/api';
 import { useAuth } from '@/context/AuthContext';
 import { useLicense } from '@/context/LicenseContext';
 import { toast } from '@/components/ui/toast-store';
+import { FleetTabHeading, FleetEmptyState, FleetEmptyCard } from './fleet/FleetEmptyState';
 
 // --- Types ---
 
@@ -595,34 +596,33 @@ export default function FleetSnapshots() {
 
     return (
         <div className="space-y-4">
-            {/* Header */}
-            <div className="flex items-center justify-between">
-                <div className="flex items-center gap-2.5">
-                    <Camera className="w-5 h-5 text-muted-foreground" strokeWidth={1.5} />
-                    <h2 className="text-lg font-semibold">Fleet Snapshots</h2>
-                </div>
-                <div className="flex items-center gap-2">
-                    {needsPagination && (
-                        <div className="flex items-center gap-1.5">
-                            <Button variant="ghost" size="icon" className="h-6 w-6" disabled={safePage === 0} onClick={() => setPage(safePage - 1)}>
-                                <ChevronLeft className="h-3.5 w-3.5" strokeWidth={1.5} />
+            <FleetTabHeading
+                title="Fleet Snapshots"
+                subtitle="Point-in-time compose backups across every node."
+                action={
+                    <div className="flex items-center gap-2">
+                        {needsPagination && (
+                            <div className="flex items-center gap-1.5">
+                                <Button variant="ghost" size="icon" className="h-6 w-6" disabled={safePage === 0} onClick={() => setPage(safePage - 1)}>
+                                    <ChevronLeft className="h-3.5 w-3.5" strokeWidth={1.5} />
+                                </Button>
+                                <span className="text-xs font-mono tabular-nums text-stat-subtitle min-w-[3rem] text-center">
+                                    {safePage + 1} / {totalPages}
+                                </span>
+                                <Button variant="ghost" size="icon" className="h-6 w-6" disabled={safePage >= totalPages - 1} onClick={() => setPage(safePage + 1)}>
+                                    <ChevronRight className="h-3.5 w-3.5" strokeWidth={1.5} />
+                                </Button>
+                            </div>
+                        )}
+                        {isAdmin && !showCreateForm && (
+                            <Button size="sm" className="gap-1.5" onClick={() => setShowCreateForm(true)}>
+                                <Plus className="w-4 h-4" strokeWidth={1.5} />
+                                Create Snapshot
                             </Button>
-                            <span className="text-xs font-mono tabular-nums text-stat-subtitle min-w-[3rem] text-center">
-                                {safePage + 1} / {totalPages}
-                            </span>
-                            <Button variant="ghost" size="icon" className="h-6 w-6" disabled={safePage >= totalPages - 1} onClick={() => setPage(safePage + 1)}>
-                                <ChevronRight className="h-3.5 w-3.5" strokeWidth={1.5} />
-                            </Button>
-                        </div>
-                    )}
-                    {isAdmin && !showCreateForm && (
-                        <Button size="sm" className="gap-1.5" onClick={() => setShowCreateForm(true)}>
-                            <Plus className="w-4 h-4" strokeWidth={1.5} />
-                            Create Snapshot
-                        </Button>
-                    )}
-                </div>
-            </div>
+                        )}
+                    </div>
+                }
+            />
 
             {/* Create form */}
             {showCreateForm && (
@@ -666,14 +666,19 @@ export default function FleetSnapshots() {
                     </div>
                 </div>
             ) : snapshots.length === 0 ? (
-                /* Empty state */
-                <div className="flex flex-col items-center justify-center py-16 text-center">
-                    <Camera className="w-12 h-12 text-muted-foreground/50 mb-4" />
-                    <h3 className="text-sm font-medium mb-1">No snapshots yet</h3>
-                    <p className="text-xs text-muted-foreground max-w-sm">
-                        Create your first fleet snapshot to back up compose files across all nodes.
-                    </p>
-                </div>
+                <FleetEmptyState>
+                    <FleetEmptyCard
+                        icon={Camera}
+                        title="No snapshots yet"
+                        description="Create your first fleet snapshot to back up compose files across all nodes."
+                        action={isAdmin && !showCreateForm ? (
+                            <Button size="sm" className="gap-1.5" onClick={() => setShowCreateForm(true)}>
+                                <Plus className="w-4 h-4" strokeWidth={1.5} />
+                                Create Snapshot
+                            </Button>
+                        ) : undefined}
+                    />
+                </FleetEmptyState>
             ) : (
                 /* Snapshots table */
                 <div className="rounded-lg border border-card-border border-t-card-border-top bg-card text-card-foreground shadow-card-bevel overflow-hidden">
diff --git a/frontend/src/components/blueprints/DeploymentsTab.tsx b/frontend/src/components/blueprints/DeploymentsTab.tsx
index 8092d3cb..22a07cfe 100644
--- a/frontend/src/components/blueprints/DeploymentsTab.tsx
+++ b/frontend/src/components/blueprints/DeploymentsTab.tsx
@@ -1,5 +1,7 @@
 import { useCallback, useEffect, useState } from 'react';
+import { Plus } from 'lucide-react';
 import { Modal, ModalHeader, ModalBody } from '@/components/ui/modal';
+import { Button } from '@/components/ui/button';
 import { toast } from '@/components/ui/toast-store';
 import {
     type BlueprintListItem,
@@ -11,6 +13,7 @@ import {
 } from '@/lib/blueprintsApi';
 import { BlueprintCatalog } from './BlueprintCatalog';
 import { BlueprintEmptyState } from './BlueprintEmptyState';
+import { FleetTabHeading, FleetEmptyState } from '../fleet/FleetEmptyState';
 import { BlueprintDetail } from './BlueprintDetail';
 import { BlueprintEditor } from './BlueprintEditor';
 import { useLicense } from '@/context/LicenseContext';
@@ -95,7 +98,21 @@ export function DeploymentsTab() {
     return (
         <div className="space-y-5">
             {blueprints.length === 0 ? (
-                <BlueprintEmptyState onCreate={() => setCreateOpen(true)} canCreate={canEdit} />
+                <>
+                    <FleetTabHeading
+                        title="Blueprints"
+                        subtitle="Declare compose templates once and keep matching nodes in sync."
+                        action={canEdit ? (
+                            <Button size="sm" className="gap-1.5" onClick={() => setCreateOpen(true)}>
+                                <Plus className="w-4 h-4" strokeWidth={1.5} />
+                                New Blueprint
+                            </Button>
+                        ) : undefined}
+                    />
+                    <FleetEmptyState>
+                        <BlueprintEmptyState onCreate={() => setCreateOpen(true)} canCreate={canEdit} />
+                    </FleetEmptyState>
+                </>
             ) : (
                 <BlueprintCatalog
                     blueprints={blueprints}
diff --git a/frontend/src/components/fleet/FederationTab.tsx b/frontend/src/components/fleet/FederationTab.tsx
index 8944f203..69e836ae 100644
--- a/frontend/src/components/fleet/FederationTab.tsx
+++ b/frontend/src/components/fleet/FederationTab.tsx
@@ -1,6 +1,7 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
-import { Ban, Loader2, Network, Pin, Server } from 'lucide-react';
+import { Ban, Loader2, Pin, Server } from 'lucide-react';
 import { toast } from '@/components/ui/toast-store';
+import { FleetTabHeading } from './FleetEmptyState';
 import {
     Select,
     SelectContent,
@@ -93,18 +94,10 @@ export function FederationTab({ canManage }: FederationTabProps) {
 
     return (
         <div className="space-y-6">
-            <header className="flex items-start gap-3">
-                <div className="flex items-center justify-center w-10 h-10 rounded-lg bg-glass-highlight border border-card-border">
-                    <Network className="w-5 h-5 text-foreground" />
-                </div>
-                <div>
-                    <div className="font-mono text-[10px] uppercase tracking-[0.22em] text-stat-subtitle">Federation</div>
-                    <h2 className="text-lg font-display italic">Placement control</h2>
-                    <p className="text-sm text-muted-foreground max-w-2xl mt-0.5">
-                        Mark nodes unschedulable and pin blueprints to specific nodes. Sencho proposes placements; you approve them. Existing deployments are never moved without an explicit operator action.
-                    </p>
-                </div>
-            </header>
+            <FleetTabHeading
+                title="Placement control"
+                subtitle="Mark nodes unschedulable and pin blueprints to specific nodes."
+            />
 
             <section className="rounded-xl border border-card-border bg-card">
                 <div className="px-4 py-3 border-b border-card-border flex items-center justify-between">
diff --git a/frontend/src/components/fleet/FleetEmptyState.tsx b/frontend/src/components/fleet/FleetEmptyState.tsx
new file mode 100644
index 00000000..78b8be02
--- /dev/null
+++ b/frontend/src/components/fleet/FleetEmptyState.tsx
@@ -0,0 +1,61 @@
+import type { LucideIcon } from 'lucide-react';
+import type { ReactNode } from 'react';
+
+interface FleetTabHeadingProps {
+    title: string;
+    subtitle: string;
+    action?: ReactNode;
+}
+
+/**
+ * Standardized Fleet tab header: italic-serif 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.
+ */
+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>
+                <p className="text-sm text-stat-subtitle">{subtitle}</p>
+            </div>
+            {action}
+        </div>
+    );
+}
+
+/**
+ * Vertical-centering shell that floats an empty-state card in the middle of the
+ * tab body, below the heading.
+ */
+export function FleetEmptyState({ children }: { children: ReactNode }) {
+    return (
+        <div className="flex flex-col items-center justify-center min-h-[55vh]">
+            {children}
+        </div>
+    );
+}
+
+interface FleetEmptyCardProps {
+    icon: LucideIcon;
+    title: string;
+    description: string;
+    action?: ReactNode;
+}
+
+/**
+ * Minimal empty-state card: centered icon, italic 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>
+                <p className="text-sm text-stat-subtitle leading-relaxed mt-1">{description}</p>
+            </div>
+            {action}
+        </div>
+    );
+}
diff --git a/frontend/src/components/fleet/RoutingTab.tsx b/frontend/src/components/fleet/RoutingTab.tsx
index bcf87e1f..25a6c877 100644
--- a/frontend/src/components/fleet/RoutingTab.tsx
+++ b/frontend/src/components/fleet/RoutingTab.tsx
@@ -12,6 +12,7 @@ import { MeshDiagnosticsSheet } from './MeshDiagnosticsSheet';
 import { MeshActivitySheet } from './MeshActivitySheet';
 import { MeshTopologyGraph, type MeshGraphEdgeMode } from './MeshTopologyGraph';
 import { SegmentedControl } from '@/components/ui/segmented-control';
+import { FleetTabHeading, FleetEmptyState, FleetEmptyCard } from './FleetEmptyState';
 import type { MeshAlias, MeshDataPlaneStatus, MeshNodeStatus, MeshProbeResult } from '@/types/mesh';
 
 type RoutingViewMode = 'table' | 'graph';
@@ -137,12 +138,18 @@ export function RoutingTab({ canManage }: { canManage: boolean }) {
 
     if (status.length === 0) {
         return (
-            <div className="flex flex-col items-center justify-center py-16">
-                <ArrowLeftRight className="w-12 h-12 text-stat-subtitle mb-4" />
-                <div className="text-lg font-display italic mb-2">No nodes available</div>
-                <div className="text-sm text-stat-subtitle text-center max-w-md">
-                    Add a node to the fleet to start routing traffic between containers across nodes.
-                </div>
+            <div className="space-y-4">
+                <FleetTabHeading
+                    title="Routing"
+                    subtitle="Reach containers across nodes by hostname, no VPN required."
+                />
+                <FleetEmptyState>
+                    <FleetEmptyCard
+                        icon={ArrowLeftRight}
+                        title="No nodes available"
+                        description="Add a node to the fleet to start routing traffic between containers across nodes."
+                    />
+                </FleetEmptyState>
             </div>
         );
     }
diff --git a/frontend/src/components/fleet/secrets/SecretsTab.tsx b/frontend/src/components/fleet/secrets/SecretsTab.tsx
index 5bec6986..1fee33e9 100644
--- a/frontend/src/components/fleet/secrets/SecretsTab.tsx
+++ b/frontend/src/components/fleet/secrets/SecretsTab.tsx
@@ -5,6 +5,7 @@ import { toast } from '@/components/ui/toast-store';
 import { listSecrets, deleteSecret, type SecretSummary } from '@/lib/secretsApi';
 import { SecretBundleSheet } from './SecretBundleSheet';
 import { SecretPushSheet } from './SecretPushSheet';
+import { FleetTabHeading, FleetEmptyState, FleetEmptyCard } from '../FleetEmptyState';
 
 export function SecretsTab() {
     const [items, setItems] = useState<SecretSummary[]>([]);
@@ -69,18 +70,29 @@ export function SecretsTab() {
 
     return (
         <div className="space-y-4">
-            <div className="flex items-center justify-between gap-3">
-                <div>
-                    <h2 className="font-display italic text-[1.5rem] leading-tight text-stat-value">Secret bundles</h2>
-                    <p className="text-sm text-stat-subtitle">Centralized env-var bundles, encrypted at rest, versioned, pushed to labeled nodes.</p>
-                </div>
-                <Button type="button" onClick={() => setCreating(true)} className="gap-1.5">
-                    <Plus className="w-4 h-4" /> New bundle
-                </Button>
-            </div>
+            <FleetTabHeading
+                title="Secret bundles"
+                subtitle="Centralized env-var bundles, encrypted at rest, versioned, pushed to labeled nodes."
+                action={
+                    <Button type="button" onClick={() => setCreating(true)} className="gap-1.5">
+                        <Plus className="w-4 h-4" /> New bundle
+                    </Button>
+                }
+            />
 
             {items.length === 0 ? (
-                <EmptyState onCreate={() => setCreating(true)} />
+                <FleetEmptyState>
+                    <FleetEmptyCard
+                        icon={KeyRound}
+                        title="One source of truth for env"
+                        description="Build a bundle of key=value pairs, push it to nodes by label, see exactly what changed before you write."
+                        action={
+                            <Button type="button" onClick={() => setCreating(true)} className="gap-1.5">
+                                <Plus className="w-4 h-4" /> Create your first bundle
+                            </Button>
+                        }
+                    />
+                </FleetEmptyState>
             ) : (
                 <div className="rounded-xl border border-card-border/60 overflow-hidden">
                     <table className="w-full text-sm">
@@ -149,20 +161,3 @@ export function SecretsTab() {
         </div>
     );
 }
-
-function EmptyState({ onCreate }: { onCreate: () => void }) {
-    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">
-            <KeyRound className="mx-auto w-8 h-8 text-stat-subtitle" />
-            <div>
-                <h3 className="font-display italic text-[1.25rem] text-stat-value">One source of truth for env</h3>
-                <p className="text-sm text-stat-subtitle leading-relaxed mt-1">
-                    Build a bundle of key=value pairs, push it to nodes by label, see exactly what changed before you write.
-                </p>
-            </div>
-            <Button type="button" onClick={onCreate} className="gap-1.5">
-                <Plus className="w-4 h-4" /> Create your first bundle
-            </Button>
-        </div>
-    );
-}