feat(fleet): multi-mode topology with label grouping and persisted positions (#1054)

The Topology view now offers three layouts so the canvas adapts to how the
fleet is organised, not the other way around:

- Hub: the gateway anchored on the left with remotes radiating right
- Grouped (Skipper+): remotes cluster by their primary node label, with the
  local node in its own cluster and unlabeled remotes in an Unlabeled cluster
- Free (Skipper+): drag any node; positions persist per browser via local
  storage

Node cards gain label pills (Skipper+), a cordon banner with reason tooltip,
a latency chip for online remotes, and a stale pilot-heartbeat glyph. All
fields are sourced from /api/fleet/overview, which already returns cordon,
latency, and pilot timestamps; no backend changes required.

Community continues to see the single Hub layout (without the toolbar, no
gating cues), matching the visibility principle that paid affordances are
hidden from lower tiers rather than displayed as locked teasers. The
backend /api/node-labels route is already requirePaid, so the data gate is
honoured end to end.

Includes unit tests for the layout module (hub/grouped/free coverage) and
the preferences hook (round-trip plus corrupt-JSON fallback).

frontend/src/components/FleetView/OverviewTab.tsx

@@ -4,7 +4,7 @@ import { Button } from '@/components/ui/button';
 import { FleetTopology } from '../fleet/FleetTopology';
 import { NodeCard } from './NodeCard';
 import { OverviewToolbar } from './OverviewToolbar';
-import type { FleetTopologyNode } from '@/lib/fleet-topology-layout';
+import type { FleetTopologyNode, LayoutMode, SavedPositions } from '@/lib/fleet-topology-layout';
 import type { Label as StackLabel } from '../label-types';
 import type { FleetNode, NodeUpdateStatus, ViewMode, FleetPreferences, FleetPaletteEntry } from './types';
 
@@ -32,6 +32,11 @@ interface OverviewTabProps {
     onRetryUpdate?: (nodeId: number) => void;
     onDismissUpdate?: (nodeId: number) => void;
     onCordonChange?: () => void;
+    isPaid: boolean;
+    topologyMode: LayoutMode;
+    onTopologyModeChange: (mode: LayoutMode) => void;
+    topologyPositions: SavedPositions;
+    onTopologyPositionsChange: (positions: SavedPositions) => void;
 }
 
 export function OverviewTab({
@@ -58,6 +63,11 @@ export function OverviewTab({
     onRetryUpdate,
     onDismissUpdate,
     onCordonChange,
+    isPaid,
+    topologyMode,
+    onTopologyModeChange,
+    topologyPositions,
+    onTopologyPositionsChange,
 }: OverviewTabProps) {
     return (
         <>
@@ -106,6 +116,11 @@ export function OverviewTab({
                         <FleetTopology
                             nodes={topologyNodes}
                             onNodeClick={(id) => onNavigateToNode(id, '')}
+                            isPaid={isPaid}
+                            mode={topologyMode}
+                            onModeChange={onTopologyModeChange}
+                            savedPositions={topologyPositions}
+                            onPositionsChange={onTopologyPositionsChange}
                         />
                     ) : processedNodes.length > 0 ? (
                         <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4 items-start">