@camstack/ui-library 1.2.242 → 1.2.244

package/dist/index.cjs

@@ -8048,6 +8048,8 @@ var usePipelineOrchestratorSetCameraStepToggle = trpc.pipelineOrchestrator.setCa
 var usePipelineOrchestratorGetCameraStepOverrides = trpc.pipelineOrchestrator.getCameraStepOverrides.useQuery;
 /** Generated alias around `trpc.pipelineOrchestrator.setCameraStepOverride.useMutation`. */
 var usePipelineOrchestratorSetCameraStepOverride = trpc.pipelineOrchestrator.setCameraStepOverride.useMutation;
+/** Generated alias around `trpc.pipelineOrchestrator.setCameraStepSettings.useMutation`. */
+var usePipelineOrchestratorSetCameraStepSettings = trpc.pipelineOrchestrator.setCameraStepSettings.useMutation;
 /** Generated alias around `trpc.pipelineOrchestrator.setCameraPipelineForAgent.useMutation`. */
 var usePipelineOrchestratorSetCameraPipelineForAgent = trpc.pipelineOrchestrator.setCameraPipelineForAgent.useMutation;
 /** Generated alias around `trpc.pipelineOrchestrator.resolvePipeline.useQuery`. */
@@ -31635,6 +31637,27 @@ function nextClientSample(prev, cur, ctx) {
 	};
 }
 //#endregion
+//#region src/composites/peer-connection-config.ts
+/**
+* The player's `RTCConfiguration`, in one place for every connect path.
+*
+* The player never forces `iceTransportPolicy: 'relay'` on its own (werift's
+* relay forward is unreliable across two real TURN servers, and relay would
+* defeat the direct LAN/Tailscale path). The policy exists for the WebRTC
+* diagnostics only, which run the SAME player once with `all` and once with
+* `relay` to tell a reachable relay path from a dead one. Absent, the key is
+* not set at all, so a production connect is byte-for-byte what it was.
+*/
+/** Public STUN kept as a fallback beside whatever the hub's TURN provider returns. */
+var FALLBACK_STUN_SERVER = { urls: "stun:stun.l.google.com:19302" };
+function buildPeerConnectionConfig(iceServers, iceTransportPolicy) {
+	const servers = [...iceServers ?? [], FALLBACK_STUN_SERVER];
+	return iceTransportPolicy === void 0 ? { iceServers: servers } : {
+		iceServers: servers,
+		iceTransportPolicy
+	};
+}
+//#endregion
 //#region src/composites/stream-debug/webrtc-debug-stats.ts
 /** Beyond this the log is a scroll, not a signal. */
 var RESOLUTION_LOG_MAX = 8;
@@ -32358,7 +32381,7 @@ function mergePlayerHints(autoHints, override, downlinkMbps, coldStart) {
 	return coldStart ? stripDownlinkForColdStart(merged) : merged;
 }
 var FIRST_FRAME_TIMEOUT_MS = 8e3;
-function CameraStreamPlayer({ serverUrl, streamKey, label, autoPlay = true, muted: initialMuted = true, showControls = true, showStats = false, onDebugStats, onPlaybackStats, onClientNetworkSample, probeAuthToken, onConnectTiming, className = "", onStateChange, onError, onReconnectAttempt, overlay, createSession, sendAnswer, handleOffer, getIceServers, addIceCandidate, getIceCandidates, closeSession, getSessionState, getSessionDebug, applyDownlinkProbe, reoffer, posterUrl, hintsOverride, onAdaptiveHints, reconnectSignal, onControlChannel, onVideoElement }) {
+function CameraStreamPlayer({ serverUrl, streamKey, label, autoPlay = true, muted: initialMuted = true, showControls = true, showStats = false, onDebugStats, onPlaybackStats, onClientNetworkSample, probeAuthToken, onConnectTiming, className = "", onStateChange, onError, onReconnectAttempt, overlay, createSession, sendAnswer, handleOffer, getIceServers, addIceCandidate, getIceCandidates, closeSession, getSessionState, getSessionDebug, applyDownlinkProbe, reoffer, posterUrl, hintsOverride, onAdaptiveHints, reconnectSignal, onControlChannel, onVideoElement, iceTransportPolicy, onPeerConnection }) {
 	const videoRef = (0, react$1.useRef)(null);
 	const containerRef = (0, react$1.useRef)(null);
 	const pcRef = (0, react$1.useRef)(null);
@@ -32374,6 +32397,12 @@ function CameraStreamPlayer({ serverUrl, streamKey, label, autoPlay = true, mute
 	*  consumer, without re-creating the connect callback on every render. */
 	const onControlChannelRef = (0, react$1.useRef)(onControlChannel);
 	onControlChannelRef.current = onControlChannel;
+	/** Read at connect time through refs so neither diagnostics prop re-creates
+	*  the connect callbacks (and so neither forces a reconnect when it changes). */
+	const iceTransportPolicyRef = (0, react$1.useRef)(iceTransportPolicy);
+	iceTransportPolicyRef.current = iceTransportPolicy;
+	const onPeerConnectionRef = (0, react$1.useRef)(onPeerConnection);
+	onPeerConnectionRef.current = onPeerConnection;
 	/** Same pattern for the video-element handle: delivered once on mount, null
 	*  on unmount — the ref keeps the latest consumer without re-running. */
 	const onVideoElementRef = (0, react$1.useRef)(onVideoElement);
@@ -32583,7 +32612,8 @@ function CameraStreamPlayer({ serverUrl, streamKey, label, autoPlay = true, mute
 				sessionIdsRef.current.delete(sessionId);
 				return;
 			}
-			const pc = new RTCPeerConnection({ iceServers: [...iceServers ?? [], { urls: "stun:stun.l.google.com:19302" }] });
+			const pc = new RTCPeerConnection(buildPeerConnectionConfig(iceServers, iceTransportPolicyRef.current));
+			onPeerConnectionRef.current?.(pc);
 			if (!seamless) pcRef.current = pc;
 			const combinedStream = new MediaStream();
 			if (!withDownlink) probeAfterThisStreamsFirstFrame({
@@ -32784,7 +32814,8 @@ function CameraStreamPlayer({ serverUrl, streamKey, label, autoPlay = true, mute
 			const iceServers = await getIceServers?.();
 			timing.iceServersMs = ms();
 			if (!mountedRef.current || abort.signal.aborted) return;
-			const pc = new RTCPeerConnection({ iceServers: [...iceServers ?? [], { urls: "stun:stun.l.google.com:19302" }] });
+			const pc = new RTCPeerConnection(buildPeerConnectionConfig(iceServers, iceTransportPolicyRef.current));
+			onPeerConnectionRef.current?.(pc);
 			if (!seamless) pcRef.current = pc;
 			const combinedStream = new MediaStream();
 			/** This connect's server session — known once `handleOffer` answers,
@@ -32990,7 +33021,8 @@ function CameraStreamPlayer({ serverUrl, streamKey, label, autoPlay = true, mute
 		try {
 			const iceServers = await getIceServers?.();
 			if (!mountedRef.current) return;
-			const pc = new RTCPeerConnection({ iceServers: [...iceServers ?? [], { urls: "stun:stun.l.google.com:19302" }] });
+			const pc = new RTCPeerConnection(buildPeerConnectionConfig(iceServers, iceTransportPolicyRef.current));
+			onPeerConnectionRef.current?.(pc);
 			const newStream = new MediaStream();
 			let swappedIn = false;
 			let warmupStarted = false;
@@ -33830,281 +33862,6 @@ async function waitForIceGathering(pc) {
 	});
 }
 //#endregion
-//#region src/composites/cap-settings/scene-monitor-copy.ts
-/** The lighting variants an operator is OFFERED. The resolver can also report
-*  `night`, `dawn` and `dusk`; those are shown when present but never demanded,
-*  because most installs only ever see day and IR. */
-var SCENE_CAPTURE_VARIANTS = ["day", "ir"];
-var VARIANT_LABEL = {
-	day: "Daylight",
-	ir: "Night (IR)",
-	night: "Night",
-	dawn: "Dawn",
-	dusk: "Dusk"
-};
-function variantLabel(condition) {
-	return VARIANT_LABEL[condition] ?? condition;
-}
-/**
-* "Daylight ✓ · Night (IR) ✗ — optional; checks in night (ir) are skipped."
-*
-* Converts the silent cross-condition fallback this engine used to have into an
-* operator-visible fact. Without it, a scene with only a daylight reference
-* simply stops answering after sunset and nothing anywhere says why.
-*
-* It used to end *"reports 'can't tell' in night (ir)"*, which was accurate and
-* read as a defect: the operator saw a ✗ and a complaint for a scene that was
-* configured exactly as they meant it. The missing half is now named as what it
-* is — the part you do not have to do — and the sentence says what actually
-* happens instead, which differs by the scene's own policy.
-*/
-function coverageLine(monitor) {
-	const covered = new Set(monitor.coveredConditions);
-	const parts = SCENE_CAPTURE_VARIANTS.map((v) => `${variantLabel(v)} ${covered.has(v) ? "✓" : "✗"}`);
-	const extra = [...covered].filter((c) => !SCENE_CAPTURE_VARIANTS.some((v) => v === c));
-	for (const c of extra) parts.push(`${variantLabel(c)} ✓`);
-	const missing = SCENE_CAPTURE_VARIANTS.filter((v) => !covered.has(v));
-	if (missing.length === 0) return parts.join(" · ");
-	if (covered.size === 0) return `${parts.join(" · ")} — nothing captured yet, so this scene is not watching.`;
-	const names = missing.map((v) => variantLabel(v).toLowerCase()).join(" and ");
-	return monitor.onUncoveredCondition === "judge-anyway" ? `${parts.join(" · ")} — ${names} judged against the references you do have.` : `${parts.join(" · ")} — optional; checks in ${names} are skipped.`;
-}
-/**
-* The calm sentence for a scene that is sitting the current light out — `null`
-* whenever it is checking normally.
-*
-* Separate from {@link statusLine} because it is not a verdict and must not
-* read like one. A paused scene has not failed, has not lost its flag, and
-* needs nothing from the operator; the only thing worth saying is which light
-* it is waiting out and that it will pick itself back up.
-*/
-function suspensionLine(monitor) {
-	if (monitor.suspendedCondition === null) return null;
-	const light = variantLabel(monitor.suspendedCondition).toLowerCase();
-	return `Paused — nothing was captured in ${light}, so checks are on hold until the light changes back. Capture ${light} if you want it watched around the clock.`;
-}
-var UNAVAILABLE_SENTENCE = {
-	"no-reference-for-condition": "can’t tell — nothing has been captured for this scene yet. Press “Capture daylight” to photograph what normal looks like.",
-	"view-shifted": "can’t tell — the camera view has moved since the reference was captured. Re-capture it.",
-	"no-vision-profile": "can’t tell — the vision model is unreachable, so the change is on hold.",
-	"encoder-model-changed": "can’t tell — the embedding model changed, so the stored references are unreadable. Re-capture them.",
-	"no-snapshot": "can’t tell — this camera did not return a frame."
-};
-/**
-* The one line under a scene's name. It answers, in order: can it judge, what
-* does it say, and how long has it said it.
-*/
-function statusLine(monitor, now) {
-	if (monitor.states.length === 0) return "Not armed yet — capture the initial state to start watching.";
-	if (monitor.verdict === "unknown") return monitor.unavailable !== null ? UNAVAILABLE_SENTENCE[monitor.unavailable] : "can’t tell right now.";
-	const since = monitor.verdict === "diverged" ? monitor.divergedAt : monitor.armedAt;
-	const held = since !== null ? ` for ${humanDuration(Math.max(0, now - since))}` : "";
-	if (monitor.latched) return monitor.verdict === "diverged" ? `CHANGED${held} — press Reset when you have dealt with it.` : `Back to normal, but still flagged as changed${held}. Press Reset to clear it.`;
-	const paused = suspensionLine(monitor);
-	if (paused !== null) return paused;
-	return monitor.verdict === "diverged" ? `CHANGED${held}` : `Normal${held}`;
-}
-/** The badge word. `latched` wins over `verdict`, because the latch is the
-*  thing the operator asked to be told and it outlives the live state.
-*
-*  A scene sitting out an uncovered light reads `Paused`, in the NEUTRAL tone —
-*  never `alarm`, and never the `danger` variant the page maps that to. A
-*  missing IR reference must not be able to paint a red badge on a scene that
-*  is doing exactly what it was configured to do. */
-function badgeFor(monitor) {
-	if (monitor.states.length === 0) return {
-		text: "Not armed",
-		tone: "unknown"
-	};
-	if (monitor.latched) return {
-		text: "Changed",
-		tone: "alarm"
-	};
-	if (monitor.suspendedCondition !== null) return {
-		text: "Paused",
-		tone: "unknown"
-	};
-	if (monitor.verdict === "unknown") return {
-		text: "Can’t tell",
-		tone: "unknown"
-	};
-	return monitor.verdict === "diverged" ? {
-		text: "Changed",
-		tone: "alarm"
-	} : {
-		text: "Normal",
-		tone: "ok"
-	};
-}
-/** A rect covering most of the frame is dominated by weather, sky and parked
-*  cars: the bin is 2 % of the pixels and CLIP will not notice it leaving. The
-*  failure is silent INSENSITIVITY, which is the worst kind — hence a warning
-*  rather than a refusal. */
-var ROI_AREA_WARN_FRACTION = .4;
-function roiTooLarge(roi) {
-	return roi.width * roi.height > ROI_AREA_WARN_FRACTION;
-}
-function humanDuration(ms) {
-	const s = Math.floor(ms / 1e3);
-	if (s < 60) return `${s}s`;
-	const m = Math.floor(s / 60);
-	if (m < 60) return `${m}m`;
-	const h = Math.floor(m / 60);
-	if (h < 48) return `${h}h`;
-	return `${Math.floor(h / 24)}d`;
-}
-//#endregion
-//#region src/composites/code-block.tsx
-function CodeBlock({ children, maxHeight = 300, className }) {
-	const [copied, setCopied] = (0, react$1.useState)(false);
-	const handleCopy = (0, react$1.useCallback)(() => {
-		navigator.clipboard.writeText(children).then(() => {
-			setCopied(true);
-			setTimeout(() => setCopied(false), 2e3);
-		});
-	}, [children]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: cn("relative group", className),
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ScrollArea, {
-			style: { maxHeight },
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("pre", {
-				className: "font-mono text-xs bg-surface p-3 rounded-md border border-border-subtle",
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", { children })
-			})
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconButton, {
-				icon: copied ? Check : Copy,
-				"aria-label": "Copy code",
-				variant: "ghost",
-				size: "sm",
-				onClick: handleCopy
-			})
-		})]
-	});
-}
-//#endregion
-//#region src/composites/confirm-action-button.tsx
-/**
-* ConfirmActionButton — destructive-action button with a modal confirm.
-*
-* Two-step UX for any operation operators shouldn't trigger by accident:
-* reboot device, restart addon, regenerate token, etc. The trigger is a
-* normal Button that opens a Dialog; confirming runs the async action,
-* the trigger spinner-disables itself for the duration, and the dialog
-* closes on success. Errors surface inline at the dialog's bottom.
-*
-* Generic on `TResult` so callers don't have to discard the return
-* value. Pass an `icon` to render it inside the trigger (e.g. RotateCw
-* for reboot, RefreshCw for restart).
-*/
-function ConfirmActionButton({ label, icon: Icon, title = "Confirm action", description, confirmLabel, triggerVariant = "outline", confirmVariant = "danger", size = "sm", disabled, className, action, onSuccess }) {
-	const [open, setOpen] = (0, react$1.useState)(false);
-	const [running, setRunning] = (0, react$1.useState)(false);
-	const [error, setError] = (0, react$1.useState)(null);
-	const handleConfirm = async () => {
-		setError(null);
-		setRunning(true);
-		try {
-			const result = await action();
-			onSuccess?.(result);
-			setOpen(false);
-		} catch (err) {
-			setError(err instanceof Error ? err.message : String(err));
-		} finally {
-			setRunning(false);
-		}
-	};
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
-		type: "button",
-		variant: triggerVariant,
-		size,
-		disabled,
-		onClick: () => {
-			setError(null);
-			setOpen(true);
-		},
-		className,
-		children: [Icon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { className: "h-3.5 w-3.5" }), label]
-	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Dialog, {
-		open,
-		onOpenChange: (next) => !running && setOpen(next),
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DialogContent, { children: [
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DialogHeader, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DialogTitle, {
-				className: "flex items-center gap-2",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TriangleAlert, { className: "h-4 w-4 text-amber-400" }), title]
-			}), typeof description === "string" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DialogDescription, { children: description }) : description] }),
-			error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: cn("mt-2 px-3 py-2 rounded border border-danger/40 bg-danger/10", "text-xs text-danger"),
-				children: error
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DialogFooter, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
-				type: "button",
-				variant: "ghost",
-				size,
-				disabled: running,
-				onClick: () => setOpen(false),
-				children: "Cancel"
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
-				type: "button",
-				variant: confirmVariant,
-				size,
-				disabled: running,
-				onClick: () => {
-					handleConfirm();
-				},
-				children: [running && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoaderCircle, { className: "h-3.5 w-3.5 animate-spin" }), confirmLabel ?? label]
-			})] })
-		] })
-	})] });
-}
-//#endregion
-//#region src/composites/copy-button.tsx
-/**
-* `CopyButton` — a compact button that copies a string `value` to the
-* clipboard via `navigator.clipboard.writeText`, showing a brief
-* "copied" check state. Addon-agnostic; used wherever a secret / URL
-* needs a one-click copy affordance (export setup panels, etc.).
-*/
-var COPIED_RESET_MS = 2e3;
-function CopyButton({ value, label, srLabel, className, disabled }) {
-	const [copied, setCopied] = (0, react$1.useState)(false);
-	const handleCopy = (0, react$1.useCallback)(() => {
-		if (!value) return;
-		navigator.clipboard.writeText(value).then(() => {
-			setCopied(true);
-			setTimeout(() => setCopied(false), COPIED_RESET_MS);
-		});
-	}, [value]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
-		size: "sm",
-		variant: "ghost",
-		type: "button",
-		disabled: disabled || value.length === 0,
-		onClick: handleCopy,
-		className: cn(className),
-		"aria-label": copied ? "Copied" : `Copy ${srLabel ?? label ?? "value"}`,
-		children: [copied ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Check, { className: "h-3.5 w-3.5 text-success" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Copy, { className: "h-3.5 w-3.5" }), label ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-			className: "ml-1",
-			children: copied ? "Copied" : label
-		}) : null]
-	});
-}
-//#endregion
-//#region src/composites/data-table-layout.ts
-/**
-* At this many columns and above, `auto` switches a narrow viewport to cards.
-* Three columns still fit a phone at a readable size; four do not.
-*/
-var CARD_MODE_MIN_COLUMNS = 4;
-function resolveTableLayout({ mode, columnCount, isNarrow }) {
-	if (!isNarrow) return "table";
-	if (mode === "scroll") return "table";
-	if (mode === "cards") return "cards";
-	if (columnCount === 0) return "table";
-	return columnCount >= 4 ? "cards" : "table";
-}
-//#endregion
 //#region src/lib/responsive.ts
 /**
 * Responsive design tokens — three-tier system.
@@ -34216,6 +33973,20 @@ var CHIP_BASE = "inline-flex items-center gap-1 rounded-full border px-1.5 py-0.
 var CHIP_ACTIVE = "border-primary/50 bg-primary/15 text-primary";
 var CHIP_INACTIVE = "border-border bg-surface text-foreground-subtle hover:bg-surface-hover";
 //#endregion
+//#region src/composites/data-table-layout.ts
+/**
+* At this many columns and above, `auto` switches a narrow viewport to cards.
+* Three columns still fit a phone at a readable size; four do not.
+*/
+var CARD_MODE_MIN_COLUMNS = 4;
+function resolveTableLayout({ mode, columnCount, isNarrow }) {
+	if (!isNarrow) return "table";
+	if (mode === "scroll") return "table";
+	if (mode === "cards") return "cards";
+	if (columnCount === 0) return "table";
+	return columnCount >= 4 ? "cards" : "table";
+}
+//#endregion
 //#region src/composites/setting-row.tsx
 function SettingRow({ label, children, actions, elements = "plain", className, valueClassName }) {
 	const LabelTag = elements === "description" ? "dt" : "span";
@@ -34251,263 +34022,2418 @@ function SortHeaderButton({ label, active, dir, onSort }) {
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: label }), active ? dir === "asc" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronUp, { className: "h-3 w-3 flex-shrink-0" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronDown, { className: "h-3 w-3 flex-shrink-0" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChevronUp, { className: cn("h-3 w-3 flex-shrink-0 opacity-0 transition-opacity", "group-hover/sort:opacity-30") })]
 	});
 }
-//#endregion
-//#region src/composites/table-sort.ts
+//#endregion
+//#region src/composites/table-sort.ts
+/**
+* The toggle rule, and the only copy of it.
+*
+* none → asc → desc → none, and a click on a DIFFERENT column starts that
+* column fresh at `asc`. `sameColumn` says whether the clicked column is the
+* one currently sorted; `currentDir` is its direction (`null` when nothing is
+* sorted). Returns the next direction, or `null` for "unsorted".
+*
+* Split out from {@link nextTableSort} so the device list — whose sort state
+* keys columns by `columnId`, not `columnKey` — can reuse the rule without a
+* cast and without a second copy of it.
+*/
+function nextSortDirection(sameColumn, currentDir) {
+	if (!sameColumn || currentDir === null) return "asc";
+	return currentDir === "asc" ? "desc" : null;
+}
+/**
+* Toggle a column's sort on header click: none → asc → desc → none.
+* Clicking a DIFFERENT column starts it fresh at `asc`.
+*/
+function nextTableSort(current, columnKey) {
+	const dir = nextSortDirection(current !== null && current.columnKey === columnKey, current === null ? null : current.dir);
+	return dir === null ? null : {
+		columnKey,
+		dir
+	};
+}
+/**
+* Ascending comparison of two cell values.
+*
+* Numbers compare numerically and strings compare with `localeCompare` — a
+* numeric column must never be ordered as text ("100" before "9"), and a text
+* column must respect the locale's collation. A mixed column (one row a
+* number, another a string) falls back to string comparison of both, which is
+* the only total order available; it is not a shape any caller should build on
+* purpose.
+*
+* `null` is NOT handled here — {@link sortRowsByColumn} pulls it out first,
+* because its placement is direction-independent and a comparator that is
+* multiplied by the direction factor cannot express that.
+*/
+function compareValues(a, b) {
+	if (typeof a === "number" && typeof b === "number") return a - b;
+	return String(a).localeCompare(String(b));
+}
+/**
+* Return a NEW array of `rows` ordered by `sort`.
+*
+* `valueOf` is the column's `sortValue` — it is called once per row per
+* comparison, so it must be cheap (read a field, do not format a string).
+* `sort === null` ⇒ a fresh shallow copy in the incoming order.
+*/
+function sortRowsByColumn(rows, sort, valueOf) {
+	if (sort === null) return [...rows];
+	const factor = sort.dir === "asc" ? 1 : -1;
+	return rows.toSorted((a, b) => {
+		const av = valueOf(a);
+		const bv = valueOf(b);
+		if (av === null || bv === null) {
+			if (av === bv) return 0;
+			return av === null ? 1 : -1;
+		}
+		return factor * compareValues(av, bv);
+	});
+}
+/** Derive the `<th>` `aria-sort` for `columnKey` from the table's sort state. */
+function ariaSortForColumn(sort, columnKey) {
+	if (sort === null || sort.columnKey !== columnKey) return "none";
+	return sort.dir === "asc" ? "ascending" : "descending";
+}
+//#endregion
+//#region src/composites/data-table.tsx
+/**
+* DataTable — shared responsive table for admin pages.
+*
+* Recipes baked in:
+*   - `overflow-x-auto` wrapper so narrow viewports don't clip the
+*     right edge (the rounded border survives the scroll).
+*   - `min-w-[Npx]` on the inner table so columns don't squash below
+*     readable width before the scroll kicks in.
+*   - `whitespace-nowrap` on headers — column titles never wrap to
+*     two lines (`AUTO-KILL` was the regression that triggered this).
+*   - Themed `bg-surface` + `border-border` so contrast works in both
+*     light and dark themes.
+*
+* Column model: caller supplies `columns: DataColumn<T>[]` and
+* `rows: T[]`. Each column declares `header`, optional `align`,
+* optional `nowrap`, and a `render(row) => ReactNode` that produces
+* the cell content.
+*
+*   <DataTable
+*     columns={[
+*       { key: 'username', header: 'Username', render: (u) => u.username },
+*       { key: 'role',     header: 'Role',     render: (u) => <RoleBadge .../> },
+*       { key: 'actions',  header: '',         align: 'right', render: (u) => <Actions .../> },
+*     ]}
+*     rows={users}
+*     minWidthPx={560}
+*   />
+*
+* If finer header markup is needed, pass `headerRender` instead of
+* `header` (e.g. for a sortable click affordance).
+*
+* ── Narrow viewports ──────────────────────────────────────────────────────
+* The table stays a table. The wrapper is `overflow-x-auto`, so a phone
+* scrolls the columns sideways INSIDE the table — the page body never moves
+* sideways, and the cells stay one line (`whitespace-nowrap`). That is the
+* default (`mobileMode="scroll"`). Cards are opt-in via `mobileMode="cards"`;
+* `auto` still applies the old column-count rule for a surface that wants it.
+* See `resolveTableLayout`.
+*
+* ── Scrolling the BODY, not the page ──────────────────────────────────────
+* `maxBodyHeight` caps the table and scrolls its rows INSIDE the container
+* with the column header pinned. It is ONE prop, not two, because "this list
+* scrolls internally" and "its header stays visible" are the same decision: a
+* capped table whose header scrolls away is a list of unlabelled cells.
+*
+* Use it wherever the row count is open-ended (rules, targets, delivery
+* history) so the page keeps its own header, filters and actions in view while
+* the operator moves through the rows.
+*/
+/**
+* The default cap for an internally-scrolling table.
+*
+* `60vh` leaves the page header, its filters and its actions on screen at
+* every viewport while still showing ~10 rows — and it is a fraction, so it
+* does not need a breakpoint of its own.
+*/
+var TABLE_SCROLL_MAX_H = "max-h-[60vh]";
+var ALIGN_CLASS = {
+	left: "text-left",
+	right: "text-right",
+	center: "text-center"
+};
+function DataTable({ columns, rows, rowKey, onRowClick, minWidthPx = 480, emptyMessage, className, bordered = true, rowClassName, mobileMode = "scroll", maxBodyHeight, defaultSort }) {
+	const isNarrow = useIsMobile();
+	const [sort, setSort] = (0, react$1.useState)(defaultSort ?? null);
+	const layout = resolveTableLayout({
+		mode: mobileMode,
+		columnCount: columns.length,
+		isNarrow
+	});
+	const scrolls = maxBodyHeight !== void 0;
+	const sortedColumn = (0, react$1.useMemo)(() => sort === null ? void 0 : columns.find((col) => col.key === sort.columnKey && col.sortValue !== void 0), [columns, sort]);
+	const sortValue = sortedColumn?.sortValue;
+	const displayRows = (0, react$1.useMemo)(() => sortValue === void 0 ? rows : sortRowsByColumn(rows, sort, sortValue), [
+		rows,
+		sort,
+		sortValue
+	]);
+	const activeSort = sortedColumn === void 0 ? null : sort;
+	if (rows.length === 0 && emptyMessage) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: `rounded-lg ${bordered ? "border border-border" : ""} bg-surface px-3 py-4 text-xs text-foreground-subtle text-center ${className ?? ""}`,
+		children: emptyMessage
+	});
+	if (rows.length === 0) return null;
+	if (layout === "cards") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: `space-y-2 ${scrolls ? `${maxBodyHeight} overflow-y-auto` : ""} ${className ?? ""}`,
+		children: displayRows.map((row, rowIndex) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DataTableCard, {
+			row,
+			rowIndex,
+			columns,
+			bordered,
+			onRowClick,
+			rowClassName
+		}, rowKey ? rowKey(row, rowIndex) : rowIndex))
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: [
+			"rounded-lg",
+			bordered ? "border border-border" : "",
+			"bg-surface overflow-x-auto",
+			scrolls ? `${maxBodyHeight} overflow-y-auto` : "",
+			className ?? ""
+		].filter(Boolean).join(" "),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("table", {
+			className: `w-full text-xs ${scrolls ? "border-separate border-spacing-0" : ""}`,
+			style: { minWidth: `${minWidthPx}px` },
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("thead", {
+				className: "bg-surface",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tr", { children: columns.map((col) => {
+					const align = col.align ?? "left";
+					const nowrap = col.nowrap ?? true;
+					const sortable = col.sortValue !== void 0;
+					const isSorted = activeSort !== null && activeSort.columnKey === col.key;
+					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("th", {
+						"aria-sort": sortable ? ariaSortForColumn(activeSort, col.key) : void 0,
+						title: sortable ? void 0 : col.notSortableReason,
+						className: [
+							"px-3 py-2 text-foreground-subtle font-medium bg-surface border-b border-border",
+							scrolls ? "sticky top-0 z-10" : "",
+							ALIGN_CLASS[align],
+							nowrap ? "whitespace-nowrap" : "",
+							col.width ?? ""
+						].filter(Boolean).join(" "),
+						children: sortable ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SortHeaderButton, {
+							label: col.headerRender ? col.headerRender() : col.header,
+							active: isSorted,
+							dir: isSorted && activeSort !== null ? activeSort.dir : "asc",
+							onSort: () => setSort((prev) => nextTableSort(prev, col.key))
+						}) : col.headerRender ? col.headerRender() : col.header
+					}, col.key);
+				}) })
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tbody", { children: displayRows.map((row, rowIndex) => {
+				const key = rowKey ? rowKey(row, rowIndex) : rowIndex;
+				const extra = rowClassName?.(row, rowIndex) ?? "";
+				const interactive = onRowClick !== void 0;
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tr", {
+					onClick: interactive ? () => onRowClick(row, rowIndex) : void 0,
+					className: [interactive ? "cursor-pointer hover:bg-primary/5" : "hover:bg-primary/5", extra].filter(Boolean).join(" "),
+					children: columns.map((col) => {
+						const align = col.align ?? "left";
+						const nowrap = col.nowrap ?? true;
+						return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("td", {
+							className: [
+								"px-3 py-2 text-foreground border-b border-border",
+								ALIGN_CLASS[align],
+								nowrap ? "whitespace-nowrap" : ""
+							].filter(Boolean).join(" "),
+							children: col.render(row, rowIndex)
+						}, col.key);
+					})
+				}, key);
+			}) })]
+		})
+	});
+}
+/**
+* One row as a card. Columns that carry a plain-text `header` become labelled
+* `SettingRow`s — the label is the column title and the value gets the full
+* card width. Columns with no text header (an actions column, a
+* `headerRender`-only column) have no label to show, so they render as a
+* full-width strip at the foot of the card.
+*/
+function DataTableCard({ row, rowIndex, columns, bordered, onRowClick, rowClassName }) {
+	const labelled = columns.filter((col) => col.header !== void 0 && col.header !== "");
+	const unlabelled = columns.filter((col) => col.header === void 0 || col.header === "");
+	const interactive = onRowClick !== void 0;
+	const extra = rowClassName?.(row, rowIndex) ?? "";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		"data-data-table-card": "",
+		onClick: interactive ? () => onRowClick(row, rowIndex) : void 0,
+		className: [
+			"rounded-lg bg-surface px-3 py-1.5 divide-y divide-border-subtle",
+			bordered ? "border border-border" : "",
+			interactive ? "cursor-pointer hover:bg-primary/5" : "",
+			extra
+		].filter(Boolean).join(" "),
+		children: [labelled.map((col) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettingRow, {
+			label: col.header,
+			children: col.render(row, rowIndex)
+		}, col.key)), unlabelled.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "flex flex-wrap items-center justify-end gap-2 py-1.5",
+			children: unlabelled.map((col) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: col.render(row, rowIndex) }, col.key))
+		})]
+	});
+}
+//#endregion
+//#region src/composites/key-value-list.tsx
+/**
+* A `<dl>` of label/value rows. Layout (including the L1 stacking) is owned by
+* `SettingRow`; this composite only supplies the description-list semantics.
+*
+* The rows used to be `flex items-center h-7` with a `w-1/3` term, so a label
+* could neither wrap nor stack: on a phone it took a third of the width and
+* the value took whatever was left.
+*/
+function KeyValueList({ items, className }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("dl", {
+		className: cn("flex flex-col", className),
+		children: items.map((item) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettingRow, {
+			elements: "description",
+			label: item.key,
+			children: item.value
+		}, item.key))
+	});
+}
+//#endregion
+//#region src/composites/section-card.tsx
+function SectionCard({ headingId, title, icon: Icon, actions, testId, children }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+		"aria-labelledby": headingId,
+		className: SECTION_CARD,
+		"data-testid": testId,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
+			className: `${SECTION_HEADER} flex min-h-9 flex-wrap items-center gap-2`,
+			children: [
+				Icon !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
+					className: "h-3.5 w-3.5 shrink-0 text-foreground-subtle",
+					"aria-hidden": true
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
+					id: headingId,
+					className: `${TEXT_SECTION_LABEL} min-w-0 flex-1`,
+					children: title
+				}),
+				actions
+			]
+		}), children]
+	});
+}
+//#endregion
+//#region src/composites/webrtc-diagnostics/ice-candidates.ts
+var CANDIDATE_TYPES = [
+	"host",
+	"srflx",
+	"prflx",
+	"relay"
+];
+function intOrNull(token) {
+	if (token === void 0 || !/^\d+$/.test(token)) return null;
+	const n = Number(token);
+	return Number.isSafeInteger(n) ? n : null;
+}
+function familyOf(address) {
+	if (address.length === 0) return "unknown";
+	if (address.toLowerCase().endsWith(".local")) return "mdns";
+	if (address.includes(":")) return "ipv6";
+	if (/^\d{1,3}(\.\d{1,3}){3}$/.test(address)) return "ipv4";
+	return "unknown";
+}
+function ipv4Octets(address) {
+	const parts = address.split(".");
+	if (parts.length !== 4) return null;
+	const octets = parts.map((p) => Number(p));
+	return octets.every((o) => Number.isInteger(o) && o >= 0 && o <= 255) ? octets : null;
+}
+function ipv4Scope(address) {
+	const o = ipv4Octets(address);
+	if (o === null) return "unknown";
+	const [a = -1, b = -1] = o;
+	if (a === 127) return "loopback";
+	if (a === 169 && b === 254) return "link-local";
+	if (a === 10 || a === 192 && b === 168 || a === 172 && b >= 16 && b <= 31) return "lan";
+	if (a === 100 && b >= 64 && b <= 127) return "tailscale";
+	return "public";
+}
+function ipv6Scope(address) {
+	const lower = address.toLowerCase();
+	if (lower === "::1") return "loopback";
+	if (/^fe[89ab]/.test(lower)) return "link-local";
+	if (lower.startsWith("fd7a:115c:a1e0:")) return "tailscale";
+	if (/^f[cd]/.test(lower)) return "lan";
+	return "public";
+}
+function classifyAddressScope(address) {
+	switch (familyOf(address)) {
+		case "mdns": return "mdns";
+		case "ipv4": return ipv4Scope(address);
+		case "ipv6": return ipv6Scope(address);
+		default: return "unknown";
+	}
+}
+/** Parse one candidate attribute (`candidate:…`, with or without `a=`). */
+function parseIceCandidate(line) {
+	const raw = line.trim().replace(/^a=/, "");
+	if (!raw.startsWith("candidate:")) return null;
+	const parts = raw.slice(10).split(/\s+/);
+	const address = parts[4] ?? "";
+	const typIdx = parts.indexOf("typ");
+	const typeToken = typIdx >= 0 ? parts[typIdx + 1] : void 0;
+	const type = CANDIDATE_TYPES.find((t) => t === typeToken) ?? "unknown";
+	const raddrIdx = parts.indexOf("raddr");
+	const rportIdx = parts.indexOf("rport");
+	const protocol = parts[2]?.toLowerCase();
+	return {
+		type,
+		protocol: protocol !== void 0 && protocol.length > 0 ? protocol : null,
+		address: address.length > 0 ? address : null,
+		port: intOrNull(parts[5]),
+		relatedAddress: raddrIdx >= 0 ? parts[raddrIdx + 1] ?? null : null,
+		relatedPort: rportIdx >= 0 ? intOrNull(parts[rportIdx + 1]) : null,
+		family: familyOf(address),
+		scope: classifyAddressScope(address),
+		raw
+	};
+}
+/** Every `a=candidate` line of an SDP, in order. */
+function candidateLinesFromSdp(sdp) {
+	return sdp.split(/\r?\n/).map((l) => l.trim()).filter((l) => l.startsWith("a=candidate:"));
+}
+function candidateKey(c) {
+	return `${c.type}|${c.protocol ?? "?"}|${c.address ?? "?"}|${String(c.port ?? "?")}`;
+}
+var PRIVATE_SCOPES = new Set([
+	"loopback",
+	"link-local",
+	"lan",
+	"tailscale",
+	"mdns"
+]);
+function emptyCounts() {
+	return {
+		host: 0,
+		srflx: 0,
+		prflx: 0,
+		relay: 0,
+		unknown: 0
+	};
+}
+function countCandidateTypes(candidates) {
+	const counts = emptyCounts();
+	for (const c of candidates) counts[c.type] += 1;
+	return counts;
+}
+function reachabilityFlag(answered, candidates) {
+	if (!answered && candidates.length === 0) return "unknown";
+	if (candidates.length === 0) return "none";
+	if (candidates.some((c) => c.type === "srflx" || c.type === "relay" || c.type === "host" && c.scope === "public")) return "public-path";
+	return candidates.every((c) => PRIVATE_SCOPES.has(c.scope)) ? "private-only" : "public-path";
+}
+/** The hub's offered candidates: answer SDP plus trickle, deduplicated. */
+function summarizeHubCandidates(input) {
+	const seen = /* @__PURE__ */ new Set();
+	const candidates = [];
+	const add = (line) => {
+		const c = parseIceCandidate(line);
+		if (c === null) return false;
+		const key = candidateKey(c);
+		if (seen.has(key)) return false;
+		seen.add(key);
+		candidates.push(c);
+		return true;
+	};
+	let fromSdp = 0;
+	for (const line of candidateLinesFromSdp(input.sdpAnswer ?? "")) if (add(line)) fromSdp += 1;
+	let fromTrickle = 0;
+	for (const line of input.trickled) if (add(line)) fromTrickle += 1;
+	return {
+		candidates,
+		fromSdp,
+		fromTrickle,
+		countByType: countCandidateTypes(candidates),
+		hasSrflx: candidates.some((c) => c.type === "srflx"),
+		hasRelay: candidates.some((c) => c.type === "relay"),
+		hasPublicHost: candidates.some((c) => c.type === "host" && c.scope === "public"),
+		flag: reachabilityFlag(input.sdpAnswer !== null, candidates),
+		trickleDone: input.trickleDone
+	};
+}
+//#endregion
+//#region src/composites/webrtc-diagnostics/endpoint-probe.ts
+/**
+* Browser-side probes behind "Test each endpoint" and the NAT mapping check.
+*
+* Everything runs in the operator's browser against real `RTCPeerConnection`s;
+* the only server round-trip is fetching the ICE server list.
+*
+*  - `gatherCandidates` — one peer connection, a given server set: which
+*    candidate types it produces, which server URL produced each (the ICE
+*    event's `url`) and, for a relay, the transport to the TURN server
+*    (`relayProtocol`: udp / tcp / tls).
+*  - `relayLoopback` — two peer connections in this page, both forced to
+*    `relay`: the ONLY way they connect is through the TURN server, so a
+*    connect proves allocation and forwarding work, and the selected pair
+*    gives the relay RTT and the local relay protocol from `getStats()`.
+*    (A same-page loopback with policy `all` proves nothing — the two peers
+*    connect host↔host — which is why it is not offered.)
+*
+* Credentials are attached to `turn:`/`turns:` entries only and never leave
+* this module: nothing here logs or returns them.
+*/
+function toRtcIceServers(servers) {
+	return servers.map((s) => {
+		if (/^turns?:/i.test(s.url) && s.username !== void 0 && s.credential !== void 0) return {
+			urls: s.url,
+			username: s.username,
+			credential: s.credential
+		};
+		return { urls: s.url };
+	});
+}
+/** `RTCPeerConnectionIceEvent.url` — a real field missing from this lib.dom. */
+function iceEventUrl(e) {
+	if ("url" in e && typeof e.url === "string" && e.url.length > 0) return e.url;
+	return null;
+}
+/** `RTCIceCandidate.relayProtocol` — Chromium and WebKit report it; lib.dom does not type it. */
+function candidateRelayProtocol(c) {
+	if ("relayProtocol" in c && typeof c.relayProtocol === "string" && c.relayProtocol.length > 0) return c.relayProtocol;
+	return null;
+}
+/** One local candidate from an ICE event, or null for the end-of-candidates event. */
+function probedCandidateFromEvent(e, tMs) {
+	const raw = e.candidate?.candidate;
+	if (e.candidate === null || raw === void 0 || raw.length === 0) return null;
+	const candidate = parseIceCandidate(raw);
+	if (candidate === null) return null;
+	return {
+		candidate,
+		url: iceEventUrl(e),
+		relayProtocol: candidateRelayProtocol(e.candidate),
+		tMs
+	};
+}
+function errorText$1(err) {
+	return err instanceof Error ? err.message : String(err);
+}
+async function gatherCandidates(servers, policy, timeoutMs = 8e3) {
+	const start = performance.now();
+	const candidates = [];
+	const pc = new RTCPeerConnection({
+		iceServers: toRtcIceServers(servers),
+		iceTransportPolicy: policy
+	});
+	try {
+		pc.createDataChannel("probe");
+		const done = new Promise((resolve) => {
+			const timer = setTimeout(() => resolve(true), timeoutMs);
+			pc.addEventListener("icecandidate", (e) => {
+				if (e.candidate === null) {
+					clearTimeout(timer);
+					resolve(false);
+					return;
+				}
+				const probed = probedCandidateFromEvent(e, performance.now() - start);
+				if (probed !== null) candidates.push(probed);
+			});
+		});
+		await pc.setLocalDescription(await pc.createOffer());
+		const timedOut = await done;
+		return {
+			candidates,
+			durationMs: performance.now() - start,
+			timedOut,
+			error: null
+		};
+	} catch (err) {
+		return {
+			candidates,
+			durationMs: performance.now() - start,
+			timedOut: false,
+			error: errorText$1(err)
+		};
+	} finally {
+		pc.close();
+	}
+}
+function selectedPairFacts(report) {
+	const byId = /* @__PURE__ */ new Map();
+	const pairs = [];
+	const selected = { id: null };
+	report.forEach((raw) => {
+		const s = raw;
+		if (s.id !== void 0) byId.set(s.id, s);
+		if (s.type === "candidate-pair") pairs.push(s);
+		if (s.type === "transport" && s.selectedCandidatePairId !== void 0) selected.id = s.selectedCandidatePairId;
+	});
+	const pair = pairs.find((p) => selected.id !== null && p.id === selected.id) ?? pairs.find((p) => p.selected === true) ?? pairs.find((p) => p.nominated === true && p.state === "succeeded") ?? null;
+	if (pair === null) return {
+		rttMs: null,
+		relayProtocol: null
+	};
+	const local = pair.localCandidateId !== void 0 ? byId.get(pair.localCandidateId) : void 0;
+	return {
+		rttMs: typeof pair.currentRoundTripTime === "number" ? Math.round(pair.currentRoundTripTime * 1e3) : null,
+		relayProtocol: typeof local?.relayProtocol === "string" ? local.relayProtocol : null
+	};
+}
+async function relayLoopback(servers, timeoutMs = 1e4) {
+	const start = performance.now();
+	const config = {
+		iceServers: toRtcIceServers(servers),
+		iceTransportPolicy: "relay"
+	};
+	const pcA = new RTCPeerConnection(config);
+	const pcB = new RTCPeerConnection(config);
+	try {
+		pcA.createDataChannel("probe");
+		pcA.addEventListener("icecandidate", (e) => {
+			if (e.candidate) pcB.addIceCandidate(e.candidate).catch(() => void 0);
+		});
+		pcB.addEventListener("icecandidate", (e) => {
+			if (e.candidate) pcA.addIceCandidate(e.candidate).catch(() => void 0);
+		});
+		const connected = new Promise((resolve) => {
+			const timer = setTimeout(() => resolve(false), timeoutMs);
+			pcA.addEventListener("iceconnectionstatechange", () => {
+				const st = pcA.iceConnectionState;
+				if (st === "connected" || st === "completed") {
+					clearTimeout(timer);
+					resolve(true);
+				} else if (st === "failed" || st === "closed") {
+					clearTimeout(timer);
+					resolve(false);
+				}
+			});
+		});
+		const offer = await pcA.createOffer();
+		await pcA.setLocalDescription(offer);
+		await pcB.setRemoteDescription(offer);
+		const answer = await pcB.createAnswer();
+		await pcB.setLocalDescription(answer);
+		await pcA.setRemoteDescription(answer);
+		const ok = await connected;
+		const facts = ok ? selectedPairFacts(await pcA.getStats()) : {
+			rttMs: null,
+			relayProtocol: null
+		};
+		return {
+			connected: ok,
+			state: pcA.iceConnectionState,
+			rttMs: facts.rttMs,
+			relayProtocol: facts.relayProtocol,
+			durationMs: performance.now() - start,
+			error: null
+		};
+	} catch (err) {
+		return {
+			connected: false,
+			state: pcA.iceConnectionState,
+			rttMs: null,
+			relayProtocol: null,
+			durationMs: performance.now() - start,
+			error: errorText$1(err)
+		};
+	} finally {
+		pcA.close();
+		pcB.close();
+	}
+}
+//#endregion
+//#region src/composites/webrtc-diagnostics/nat-mapping.ts
+function isHiddenBase(o) {
+	return o.relatedAddress === null || o.relatedAddress === "0.0.0.0" || o.relatedAddress === "::" || o.relatedPort === null || o.relatedPort === 0;
+}
+function baseKey(o) {
+	return isHiddenBase(o) ? `public:${o.address}` : `base:${o.relatedAddress ?? "?"}:${String(o.relatedPort ?? "?")}`;
+}
+function unknown(reason, mappings = []) {
+	return {
+		kind: "unknown",
+		confidence: "none",
+		reason,
+		mappings
+	};
+}
+/**
+* The distinct STUN destinations (`stun:host:port`) among the given URLs —
+* the number the check needs to be at least two. TURN URLs are excluded:
+* this check is about plain STUN binding.
+*/
+function distinctStunDestinations(urls) {
+	const out = [];
+	for (const url of urls) {
+		const m = /^stuns?:([^?]+)/i.exec(url.trim());
+		if (m === null) continue;
+		const dest = `stun:${(m[1] ?? "").toLowerCase()}`;
+		if (!out.includes(dest)) out.push(dest);
+	}
+	return out;
+}
+function compareSrflxMappings(observations, stunDestinationsQueried) {
+	const udp = observations.filter((o) => o.protocol.toLowerCase() === "udp");
+	if (stunDestinationsQueried < 2) return unknown("needs two STUN destinations to compare; only one was queried");
+	if (udp.length === 0) return unknown("no server-reflexive candidate: STUN unreachable or blocked from this browser");
+	const groups = /* @__PURE__ */ new Map();
+	for (const o of udp) {
+		const key = baseKey(o);
+		groups.set(key, [...groups.get(key) ?? [], o]);
+	}
+	const mappings = [...new Set(udp.map((o) => `${o.address}:${String(o.port)}`))];
+	for (const group of groups.values()) {
+		const distinct = new Set(group.map((o) => `${o.address}:${String(o.port)}`));
+		if (distinct.size > 1) return {
+			kind: "endpoint-dependent",
+			confidence: "confirmed",
+			reason: `one local socket got ${String(distinct.size)} different public mappings — symmetric NAT: only a TURN relay reaches this browser`,
+			mappings
+		};
+	}
+	const confirmed = [...groups.values()].some((group) => new Set(group.map((o) => o.url).filter((u) => u !== null)).size >= 2);
+	return {
+		kind: "endpoint-independent",
+		confidence: confirmed ? "confirmed" : "likely",
+		reason: confirmed ? "two STUN destinations saw the same public mapping" : "one public mapping across the STUN destinations (the browser drops an identical second candidate, so the second answer cannot be told from no answer)",
+		mappings
+	};
+}
+//#endregion
+//#region src/composites/webrtc-diagnostics/endpoint-test.ts
+/**
+* "Test each endpoint" and the NAT mapping check — the orchestration around
+* the browser probes, with the row derivation kept pure so it is tested
+* without a browser.
+*/
+/** Queried in addition to the configured STUN servers until two distinct destinations exist. */
+var FALLBACK_STUN_URLS = ["stun:stun.l.google.com:19302", "stun:stun1.l.google.com:19302"];
+function schemeOf(url) {
+	const lower = url.toLowerCase();
+	if (lower.startsWith("turns:")) return "turns";
+	if (lower.startsWith("turn:")) return "turn";
+	if (lower.startsWith("stun:") || lower.startsWith("stuns:")) return "stun";
+	return "other";
+}
+function transportOf(url) {
+	return /[?&]transport=([a-z]+)/i.exec(url)?.[1]?.toLowerCase() ?? null;
+}
+/** One row per URL: an entry's `urls` may be a string or a list. */
+function flattenIceServers(servers) {
+	const out = [];
+	for (const s of servers) {
+		const urls = typeof s.urls === "string" ? [s.urls] : s.urls;
+		for (const url of urls) {
+			if (out.some((e) => e.id === url)) continue;
+			out.push({
+				id: url,
+				url,
+				...s.username !== void 0 ? { username: s.username } : {},
+				...s.credential !== void 0 ? { credential: s.credential } : {},
+				scheme: schemeOf(url),
+				transport: transportOf(url),
+				hasCredentials: s.credential !== void 0
+			});
+		}
+	}
+	return out;
+}
+function endpointRowFromProbe(endpoint, gather, loopback) {
+	const srflx = gather.candidates.find((c) => c.candidate.type === "srflx");
+	const relay = gather.candidates.find((c) => c.candidate.type === "relay");
+	const mapped = srflx !== void 0 && srflx.candidate.address !== null && srflx.candidate.port !== null ? `${srflx.candidate.address}:${String(srflx.candidate.port)}` : null;
+	return {
+		id: endpoint.id,
+		url: endpoint.url,
+		scheme: endpoint.scheme,
+		transport: endpoint.transport,
+		srflx: mapped,
+		relay: relay !== void 0,
+		relayProtocol: loopback?.relayProtocol ?? relay?.relayProtocol ?? null,
+		eventUrl: relay?.url ?? srflx?.url ?? null,
+		relayConnected: loopback?.connected ?? null,
+		rttMs: loopback?.rttMs ?? null,
+		timedOut: gather.timedOut,
+		error: gather.error ?? loopback?.error ?? null
+	};
+}
+var GATHER_TIMEOUT_MS = 6e3;
+var LOOPBACK_TIMEOUT_MS = 8e3;
+function configOf(e) {
+	return [{
+		url: e.url,
+		...e.username !== void 0 ? { username: e.username } : {},
+		...e.credential !== void 0 ? { credential: e.credential } : {}
+	}];
+}
+/** Gather against ONE endpoint; for a TURN endpoint, also prove the relay forwards. */
+async function testEndpoint(endpoint) {
+	const cfg = configOf(endpoint);
+	return endpointRowFromProbe(endpoint, await gatherCandidates(cfg, "all", GATHER_TIMEOUT_MS), endpoint.scheme === "turn" || endpoint.scheme === "turns" ? await relayLoopback(cfg, LOOPBACK_TIMEOUT_MS) : null);
+}
+/** The STUN destinations the NAT check queries: configured first, public fallbacks to reach two. */
+function natCheckDestinations(endpoints) {
+	const out = [...distinctStunDestinations(endpoints.map((e) => e.url))];
+	for (const url of distinctStunDestinations(FALLBACK_STUN_URLS)) {
+		if (out.length >= 2) break;
+		if (!out.includes(url)) out.push(url);
+	}
+	return out;
+}
+function srflxObservations(gather) {
+	const out = [];
+	for (const c of gather.candidates) {
+		const p = c.candidate;
+		if (p.type !== "srflx" || p.address === null || p.port === null || p.protocol === null) continue;
+		out.push({
+			address: p.address,
+			port: p.port,
+			protocol: p.protocol,
+			relatedAddress: p.relatedAddress,
+			relatedPort: p.relatedPort,
+			url: c.url
+		});
+	}
+	return out;
+}
+async function runNatCheck(endpoints) {
+	const destinations = natCheckDestinations(endpoints);
+	const gather = await gatherCandidates(destinations.map((url) => ({ url })), "all", GATHER_TIMEOUT_MS);
+	return {
+		destinations,
+		verdict: compareSrflxMappings(srflxObservations(gather), destinations.length),
+		error: gather.error
+	};
+}
+//#endregion
+//#region src/composites/webrtc-diagnostics/format.ts
+/**
+* Rendering helpers for the WebRTC diagnostics: an unmeasured value is the
+* word "unknown", never a dash that reads as zero and never a 0 (D393).
+*/
+var UNKNOWN_TEXT = "unknown";
+function formatMaybe(value, render) {
+	return value === null ? UNKNOWN_TEXT : render(value);
+}
+var fmtMs = (v) => formatMaybe(v, (n) => `${String(Math.round(n))} ms`);
+var fmtCount = (v) => formatMaybe(v, (n) => n.toLocaleString());
+var fmtBytes = (v) => formatMaybe(v, (n) => {
+	if (n < 1024) return `${String(n)} B`;
+	if (n < 1024 * 1024) return `${(n / 1024).toFixed(1)} KiB`;
+	return `${(n / (1024 * 1024)).toFixed(2)} MiB`;
+});
+var fmtPercent = (v) => formatMaybe(v, (n) => `${n.toFixed(1)} %`);
+var fmtText = (v) => formatMaybe(v, (s) => s);
+//#endregion
+//#region src/composites/webrtc-diagnostics/EndpointTestCard.tsx
+/**
+* "ICE servers" — the live ICE server list (`turnProvider.getTurnServers`, the
+* same union every viewer is handed) probed endpoint by endpoint from THIS
+* browser, plus the NAT mapping check.
+*
+* Owns no hub data beyond the list it is given through `loadServers`.
+* Credentials are passed to the probes and never rendered: a row shows `auth`.
+*/
+var SCHEME_VARIANT = {
+	stun: "info",
+	turn: "warning",
+	turns: "success",
+	other: "default"
+};
+function errorText(err) {
+	return err instanceof Error ? err.message : String(err);
+}
+function yesNo(value, yes, no) {
+	if (value === null) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: "text-foreground-subtle",
+		children: UNKNOWN_TEXT
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: value ? "text-success" : "text-danger",
+		children: value ? yes : no
+	});
+}
+var RESULT_COLUMNS = [
+	{
+		key: "endpoint",
+		header: "Endpoint",
+		nowrap: false,
+		render: (r) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "break-all font-mono text-[11px]",
+			children: r.url
+		})
+	},
+	{
+		key: "srflx",
+		header: "Mapped (srflx)",
+		render: (r) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "font-mono text-[11px]",
+			children: r.srflx ?? "none"
+		})
+	},
+	{
+		key: "relay",
+		header: "Relay",
+		render: (r) => r.scheme === "stun" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "text-foreground-subtle",
+			children: "n/a"
+		}) : yesNo(r.relay, "allocated", "none")
+	},
+	{
+		key: "proto",
+		header: "Relay protocol",
+		render: (r) => r.scheme === "stun" ? "n/a" : fmtText(r.relayProtocol)
+	},
+	{
+		key: "connect",
+		header: "Relay connect",
+		render: (r) => r.relayConnected === null ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "text-foreground-subtle",
+			children: "n/a"
+		}) : yesNo(r.relayConnected, "connected", "failed")
+	},
+	{
+		key: "rtt",
+		header: "RTT",
+		align: "right",
+		render: (r) => fmtMs(r.rttMs)
+	},
+	{
+		key: "url",
+		header: "Event url",
+		nowrap: false,
+		render: (r) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "break-all font-mono text-[10px]",
+			children: fmtText(r.eventUrl)
+		})
+	},
+	{
+		key: "note",
+		header: "Note",
+		nowrap: false,
+		render: (r) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: TEXT_HINT,
+			children: r.error ?? (r.timedOut ? "gathering timed out" : "")
+		})
+	}
+];
+var NAT_LABEL = {
+	"endpoint-independent": "Endpoint-independent mapping",
+	"endpoint-dependent": "Symmetric NAT (endpoint-dependent)",
+	unknown: "Unknown"
+};
+function NatResult({ result }) {
+	const { verdict } = result;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: SECTION_BODY,
+		"data-testid": "nat-check-result",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(KeyValueList, { items: [
+			{
+				key: "NAT mapping",
+				value: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+					className: "flex flex-wrap items-center gap-1.5",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Badge, {
+						variant: verdict.kind === "endpoint-independent" ? "success" : verdict.kind === "endpoint-dependent" ? "danger" : "default",
+						children: NAT_LABEL[verdict.kind]
+					}), verdict.confidence !== "none" && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-[10px] text-foreground-subtle",
+						children: verdict.confidence
+					})]
+				})
+			},
+			{
+				key: "Why",
+				value: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "text-xs",
+					children: verdict.reason
+				})
+			},
+			{
+				key: "Mappings seen",
+				value: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "font-mono text-[11px]",
+					children: verdict.mappings.length > 0 ? verdict.mappings.join(", ") : "none"
+				})
+			},
+			{
+				key: "STUN queried",
+				value: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "break-all font-mono text-[11px]",
+					children: result.destinations.join(", ")
+				})
+			},
+			...result.error !== null ? [{
+				key: "Error",
+				value: result.error
+			}] : []
+		] })
+	});
+}
+/** The per-endpoint result table — one row per tested ICE URL. */
+function EndpointResultsCard({ rows }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SectionCard, {
+		headingId: "webrtc-diag-endpoint-results",
+		title: "Per-endpoint results",
+		icon: Play,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DataTable, {
+			columns: RESULT_COLUMNS,
+			rows,
+			rowKey: (r) => r.id,
+			bordered: false,
+			minWidthPx: 760,
+			mobileMode: "cards"
+		})
+	});
+}
+/** The NAT mapping verdict for this browser. */
+function NatResultCard({ result }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SectionCard, {
+		headingId: "webrtc-diag-nat",
+		title: "NAT mapping (this browser)",
+		icon: Route,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NatResult, { result })
+	});
+}
+function EndpointRow({ endpoint, checked, onToggle }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+		className: `${LIST_ROW} flex cursor-pointer items-center gap-2 hover:bg-surface-hover/40`,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Checkbox, {
+				checked,
+				onChange: () => onToggle(endpoint.id)
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Badge, {
+				variant: SCHEME_VARIANT[endpoint.scheme],
+				className: "shrink-0 uppercase text-[10px]",
+				children: endpoint.scheme
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: "min-w-0 flex-1 break-all font-mono text-[11px] text-foreground",
+				children: endpoint.url
+			}),
+			endpoint.transport !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: `text-[10px] text-foreground-subtle uppercase`,
+				children: endpoint.transport
+			}),
+			endpoint.hasCredentials && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: `text-[10px] text-foreground-subtle text-success`,
+				children: "auth"
+			})
+		]
+	});
+}
+function EndpointTestCard({ loadServers }) {
+	const [endpoints, setEndpoints] = (0, react$1.useState)(null);
+	const [loadError, setLoadError] = (0, react$1.useState)(null);
+	const [loading, setLoading] = (0, react$1.useState)(false);
+	const [enabled, setEnabled] = (0, react$1.useState)(/* @__PURE__ */ new Set());
+	const [running, setRunning] = (0, react$1.useState)(null);
+	const [rows, setRows] = (0, react$1.useState)([]);
+	const [nat, setNat] = (0, react$1.useState)(null);
+	const reload = (0, react$1.useCallback)(async () => {
+		setLoading(true);
+		setLoadError(null);
+		try {
+			const flat = flattenIceServers(await loadServers());
+			setEndpoints(flat);
+			setEnabled(new Set(flat.map((e) => e.id)));
+		} catch (err) {
+			setLoadError(errorText(err));
+		} finally {
+			setLoading(false);
+		}
+	}, [loadServers]);
+	(0, react$1.useEffect)(() => {
+		reload();
+	}, [reload]);
+	const selected = (0, react$1.useMemo)(() => (endpoints ?? []).filter((e) => enabled.has(e.id)), [endpoints, enabled]);
+	const toggle = (0, react$1.useCallback)((id) => {
+		setEnabled((prev) => {
+			const next = new Set(prev);
+			if (next.has(id)) next.delete(id);
+			else next.add(id);
+			return next;
+		});
+	}, []);
+	const runEndpoints = (0, react$1.useCallback)(async () => {
+		setRunning("endpoints");
+		setRows([]);
+		const out = [];
+		for (const e of selected) {
+			out.push(await testEndpoint(e));
+			setRows([...out]);
+		}
+		setRunning(null);
+	}, [selected]);
+	const runNat = (0, react$1.useCallback)(async () => {
+		setRunning("nat");
+		setNat(null);
+		try {
+			setNat(await runNatCheck(endpoints ?? []));
+		} finally {
+			setRunning(null);
+		}
+	}, [endpoints]);
+	const busy = running !== null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "space-y-3 sm:space-y-4",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SectionCard, {
+				headingId: "webrtc-diag-ice-servers",
+				title: `ICE servers${endpoints !== null ? ` (${String(endpoints.length)})` : ""}`,
+				icon: Network,
+				testId: "webrtc-diag-ice-servers",
+				actions: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex flex-wrap items-center gap-1.5",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
+							variant: "ghost",
+							onClick: () => void reload(),
+							disabled: loading || busy,
+							children: [loading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoaderCircle, { className: "h-3 w-3 animate-spin" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RefreshCw, { className: "h-3 w-3" }), "Reload"]
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
+							variant: "outline",
+							onClick: () => void runNat(),
+							disabled: busy || endpoints === null,
+							children: [running === "nat" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoaderCircle, { className: "h-3 w-3 animate-spin" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Route, { className: "h-3 w-3" }), "Check NAT"]
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
+							onClick: () => void runEndpoints(),
+							disabled: busy || selected.length === 0,
+							children: [running === "endpoints" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoaderCircle, { className: "h-3 w-3 animate-spin" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Play, { className: "h-3 w-3" }), "Test each endpoint"]
+						})
+					]
+				}),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "divide-y divide-border/50",
+					children: [
+						loadError !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: `px-3 sm:px-4 py-1.5 sm:py-2 text-xs text-danger`,
+							children: ["Failed to load ICE servers: ", loadError]
+						}),
+						loadError === null && endpoints === null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: `px-3 sm:px-4 py-1.5 sm:py-2 text-[10px] text-foreground-subtle`,
+							children: "Loading…"
+						}),
+						endpoints !== null && endpoints.length === 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: `px-3 sm:px-4 py-1.5 sm:py-2 text-[10px] text-foreground-subtle`,
+							children: "No ICE servers configured. Add a TURN provider under TURN Servers."
+						}),
+						(endpoints ?? []).map((e) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EndpointRow, {
+							endpoint: e,
+							checked: enabled.has(e.id),
+							onToggle: toggle
+						}, e.id))
+					]
+				})
+			}),
+			rows.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EndpointResultsCard, { rows }),
+			nat !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(NatResultCard, { result: nat })
+		]
+	});
+}
+//#endregion
+//#region src/hooks/turn-server-cache.ts
+/** Short enough that rotated credentials are picked up promptly. */
+var DEFAULT_FRESH_TTL_MS = 5 * 6e4;
+/** Half of the shortest provider credential lifetime in the fleet (24 h). */
+var DEFAULT_STALE_CAP_MS = 720 * 6e4;
+var DEFAULT_STORAGE_KEY = "camstack:turn-servers:v1";
+function defaultStorage() {
+	const g = globalThis;
+	try {
+		return g.localStorage ?? null;
+	} catch {
+		return null;
+	}
+}
+/** Type guard for a persisted entry — storage content is external data. */
+function isCacheEntry(value) {
+	if (typeof value !== "object" || value === null) return false;
+	const v = value;
+	if (typeof v.fetchedAt !== "number" || !Array.isArray(v.servers)) return false;
+	return v.servers.every((s) => {
+		if (typeof s !== "object" || s === null) return false;
+		const srv = s;
+		if (!(typeof srv.urls === "string" || Array.isArray(srv.urls) && srv.urls.every((u) => typeof u === "string"))) return false;
+		if (srv.username !== void 0 && typeof srv.username !== "string") return false;
+		if (srv.credential !== void 0 && typeof srv.credential !== "string") return false;
+		return true;
+	});
+}
+var TurnServerCache = class {
+	freshTtlMs;
+	staleCapMs;
+	storage;
+	now;
+	storageKey;
+	/** Keyed on the caller's tRPC client object (stable per connected system). */
+	memory = /* @__PURE__ */ new WeakMap();
+	/** In-flight fetch per key — concurrent callers share one round trip. */
+	inflight = /* @__PURE__ */ new WeakMap();
+	constructor(options = {}) {
+		this.freshTtlMs = options.freshTtlMs ?? DEFAULT_FRESH_TTL_MS;
+		this.staleCapMs = options.staleCapMs ?? DEFAULT_STALE_CAP_MS;
+		this.storage = "storage" in options ? options.storage ?? null : defaultStorage();
+		this.now = options.now ?? (() => Date.now());
+		this.storageKey = options.storageKey ?? DEFAULT_STORAGE_KEY;
+	}
+	/**
+	* Resolve the ICE servers for `key`, fetching via `fetch` only when no
+	* fresh-enough entry exists. Never rejects: a failed fetch resolves to the
+	* stale entry when one exists, else `undefined`.
+	*/
+	async getOrFetch(key, fetch) {
+		const at = this.now();
+		const entry = this.memory.get(key) ?? this.readStorage();
+		if (entry) {
+			const age = at - entry.fetchedAt;
+			if (age < this.freshTtlMs) return entry.servers;
+			if (age < this.staleCapMs) {
+				this.startFetch(key, fetch, entry);
+				return entry.servers;
+			}
+		}
+		return this.startFetch(key, fetch, entry);
+	}
+	startFetch(key, fetch, stale) {
+		const pending = this.inflight.get(key);
+		if (pending) return pending;
+		const run = (async () => {
+			try {
+				const servers = await fetch();
+				if (servers.length > 0) {
+					const entry = {
+						servers,
+						fetchedAt: this.now()
+					};
+					this.memory.set(key, entry);
+					this.writeStorage(entry);
+				}
+				return servers;
+			} catch {
+				return stale?.servers;
+			}
+		})().finally(() => {
+			this.inflight.delete(key);
+		});
+		this.inflight.set(key, run);
+		return run;
+	}
+	readStorage() {
+		if (!this.storage) return void 0;
+		try {
+			const raw = this.storage.getItem(this.storageKey);
+			if (raw === null) return void 0;
+			const parsed = JSON.parse(raw);
+			return isCacheEntry(parsed) ? parsed : void 0;
+		} catch {
+			return;
+		}
+	}
+	writeStorage(entry) {
+		if (!this.storage) return;
+		try {
+			this.storage.setItem(this.storageKey, JSON.stringify(entry));
+		} catch {}
+	}
+};
+//#endregion
+//#region src/hooks/use-device-webrtc.ts
+/**
+* useDeviceWebrtc — WebRTC signaling hook for device-scoped streaming.
+*
+* Provides `createSession`, `sendAnswer`, `closeSession` callbacks and
+* a `streams` list (Adaptive + High/Mid/Low) for a given device.
+*
+* Works in both admin-ui (BackendClient.trpc) and addon pages
+* (AddonPageProps.trpc) — parametrized by a minimal tRPC proxy shape.
+*/
+/**
+* Hook that provides WebRTC signaling callbacks and stream choices for a device.
+*
+* @param trpc  - tRPC proxy (admin-ui BackendClient.trpc or addon page trpc)
+* @param deviceId - numeric device ID (null = disabled)
+* @param pollIntervalMs - how often to refresh profile slots (default: 5000)
+*/
+/** Module-level TURN/STUN credential cache. Keyed on the caller's trpc client
+*  object (stable per connected system — NOT on `trpc.turnProvider`, which is
+*  a proxy minted fresh on every property access), so two admin tabs pointed
+*  at different hubs never cross-serve credentials from the memory layer; the
+*  storage layer is per-origin, and the page's origin IS the hub. Coalesces
+*  concurrent fetches (the mount prefetch and the connect's own call used to
+*  race into TWO round trips) and persists across page loads so a fresh embed
+*  page — one per camera open on native — finds warm credentials instead of
+*  re-paying the measured 0.2–3.6 s serialized fetch. See turn-server-cache.ts. */
+var turnServersCache = new TurnServerCache();
+function useDeviceWebrtc(trpc, deviceId, pollIntervalMs = 5e3) {
+	const [remoteStreams, setRemoteStreams] = (0, react$1.useState)([]);
+	(0, react$1.useEffect)(() => {
+		if (deviceId === null) return;
+		let cancelled = false;
+		const fetch = () => {
+			trpc.webrtcSession.listStreams.query({ deviceId }).then((rows) => {
+				if (!cancelled) setRemoteStreams(rows);
+			}).catch(() => {});
+		};
+		fetch();
+		const iv = setInterval(fetch, pollIntervalMs);
+		return () => {
+			cancelled = true;
+			clearInterval(iv);
+		};
+	}, [
+		trpc,
+		deviceId,
+		pollIntervalMs
+	]);
+	const [pipelineMetrics, setPipelineMetrics] = (0, react$1.useState)(null);
+	(0, react$1.useEffect)(() => {
+		if (deviceId === null) return;
+		let cancelled = false;
+		if (trpc.pipelineOrchestrator) trpc.pipelineOrchestrator.getCameraMetrics.query({ deviceId }).then((m) => {
+			if (cancelled || !m) return;
+			setPipelineMetrics({
+				phase: m.phase,
+				detectionFps: m.actualFps,
+				avgInferenceMs: m.avgInferenceTimeMs,
+				droppedFrames: m.droppedFrames
+			});
+		}).catch(() => {});
+		return () => {
+			cancelled = true;
+		};
+	}, [trpc, deviceId]);
+	useLiveEvent("pipeline.camera-metrics-snapshot", (evt) => {
+		if (deviceId === null) return;
+		const payload = evt.data;
+		if (payload.deviceId !== deviceId || !payload.metrics) return;
+		setPipelineMetrics({
+			phase: payload.metrics.phase,
+			detectionFps: payload.metrics.actualFps,
+			avgInferenceMs: payload.metrics.avgInferenceTimeMs,
+			droppedFrames: payload.metrics.droppedFrames
+		});
+	});
+	const { streams, hasWebrtc } = (0, react$1.useMemo)(() => {
+		if (deviceId === null || remoteStreams.length === 0) return {
+			streams: [],
+			hasWebrtc: false
+		};
+		return {
+			streams: remoteStreams.map((r) => ({
+				id: r.id,
+				label: r.label,
+				target: r.target,
+				status: r.status,
+				inputFps: r.inputFps,
+				decodeFps: r.decodeFps,
+				bitrateKbps: r.bitrateKbps
+			})),
+			hasWebrtc: true
+		};
+	}, [deviceId, remoteStreams]);
+	const getIceServers = (0, react$1.useCallback)(async () => {
+		const provider = trpc.turnProvider;
+		if (!provider) return void 0;
+		return turnServersCache.getOrFetch(trpc, async () => {
+			return (await provider.getTurnServers.query()).map((s) => {
+				return {
+					urls: typeof s.urls === "string" ? s.urls : [...s.urls],
+					...s.username !== void 0 ? { username: s.username } : {},
+					...s.credential !== void 0 ? { credential: s.credential } : {}
+				};
+			});
+		});
+	}, [trpc]);
+	(0, react$1.useEffect)(() => {
+		getIceServers();
+	}, [getIceServers]);
+	const createSession = (0, react$1.useCallback)(async (target, hints) => {
+		if (deviceId === null) throw new Error("No device selected");
+		const res = await trpc.webrtcSession.createSession.mutate({
+			deviceId,
+			target,
+			hints
+		});
+		const iceServers = await getIceServers();
+		return {
+			sessionId: res.sessionId,
+			sdpOffer: res.sdpOffer,
+			...iceServers ? { iceServers } : {}
+		};
+	}, [
+		trpc,
+		deviceId,
+		getIceServers
+	]);
+	const handleOffer = (0, react$1.useCallback)(async (target, sdpOffer, sessionId, hints) => {
+		if (deviceId === null) throw new Error("No device selected");
+		return trpc.webrtcSession.handleOffer.mutate({
+			deviceId,
+			target,
+			sdpOffer,
+			...sessionId !== void 0 ? { sessionId } : {},
+			...hints !== void 0 ? { hints } : {}
+		});
+	}, [trpc, deviceId]);
+	const sendAnswer = (0, react$1.useCallback)(async (sessionId, sdpAnswer) => {
+		if (deviceId === null) throw new Error("No device selected");
+		await trpc.webrtcSession.handleAnswer.mutate({
+			deviceId,
+			sessionId,
+			sdpAnswer
+		});
+	}, [trpc, deviceId]);
+	return {
+		streams,
+		hasWebrtc,
+		pipelineMetrics,
+		createSession,
+		handleOffer,
+		getIceServers,
+		addIceCandidate: (0, react$1.useCallback)(async (sessionId, candidate) => {
+			if (deviceId === null) return;
+			await trpc.webrtcSession.addIceCandidate.mutate({
+				deviceId,
+				sessionId,
+				candidate: candidate.candidate ?? "",
+				sdpMid: candidate.sdpMid ?? null,
+				sdpMLineIndex: candidate.sdpMLineIndex ?? null
+			}).catch(() => {});
+		}, [trpc, deviceId]),
+		getIceCandidates: (0, react$1.useCallback)(async (sessionId) => {
+			if (deviceId === null) return {
+				candidates: [],
+				done: true
+			};
+			return trpc.webrtcSession.getIceCandidates.query({
+				deviceId,
+				sessionId
+			});
+		}, [trpc, deviceId]),
+		sendAnswer,
+		closeSession: (0, react$1.useCallback)(async (sessionId) => {
+			if (deviceId === null) return;
+			await trpc.webrtcSession.closeSession.mutate({
+				deviceId,
+				sessionId
+			}).catch(() => {});
+		}, [trpc, deviceId]),
+		getSessionState: (0, react$1.useCallback)(async (sessionId) => {
+			if (deviceId === null) return { pendingRenegotiation: null };
+			try {
+				return await trpc.webrtcSession.getSessionState.query({
+					deviceId,
+					sessionId
+				});
+			} catch {
+				return { pendingRenegotiation: null };
+			}
+		}, [trpc, deviceId]),
+		getSessionDebug: (0, react$1.useCallback)(async (sessionId) => {
+			if (deviceId === null) throw new Error("getSessionDebug: no device bound to this player");
+			return trpc.webrtcSession.getSessionDebug.query({
+				deviceId,
+				sessionId
+			});
+		}, [trpc, deviceId]),
+		applyDownlinkProbe: (0, react$1.useCallback)(async (sessionId, downlinkMbps) => {
+			const mutate = trpc.webrtcSession.applyDownlinkProbe;
+			if (deviceId === null || mutate === void 0) throw new Error("applyDownlinkProbe: not available for this player");
+			return mutate.mutate({
+				deviceId,
+				sessionId,
+				downlinkMbps
+			});
+		}, [trpc, deviceId])
+	};
+}
+//#endregion
+//#region src/composites/webrtc-diagnostics/RunReport.tsx
+var VERDICT_VARIANT = {
+	healthy: "success",
+	"loss-keyframe": "warning",
+	transport: "danger",
+	"hub-dtls": "danger",
+	"media-black-hole": "danger",
+	"hub-not-sending": "danger",
+	unknown: "default"
+};
+var FLAG_TEXT = {
+	"public-path": "has a public path (srflx / relay / public host)",
+	"private-only": "LAN/Tailscale only, no srflx/relay",
+	none: "answered with no candidate",
+	unknown: "no answer received"
+};
+function candidateText(c) {
+	const where = c.address === null ? "unknown" : `${c.address}:${c.port === null ? "?" : String(c.port)}`;
+	return `${c.type} ${c.protocol ?? "?"} ${where} · ${c.scope}`;
+}
+function typeCounts(counts) {
+	const parts = Object.entries(counts).filter(([, n]) => n > 0).map(([t, n]) => `${String(n)} ${t}`);
+	return parts.length > 0 ? parts.join(" · ") : "none";
+}
+function Group({ title, children }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "space-y-0.5",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: TEXT_SECTION_LABEL,
+			children: title
+		}), children]
+	});
+}
+function RunReport({ report, title }) {
+	const { hub, timeline, path, media, verdict, local } = report;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+		className: SECTION_CARD,
+		"data-testid": `webrtc-diag-run-${report.policy}`,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
+			className: `${SECTION_HEADER} flex flex-wrap items-center gap-2`,
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
+				className: `${TEXT_SECTION_LABEL} min-w-0 flex-1`,
+				children: title
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Badge, {
+				variant: VERDICT_VARIANT[verdict.layer],
+				children: verdict.title
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: `${SECTION_BODY} space-y-3`,
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: "text-xs text-foreground",
+					children: verdict.detail
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Group, {
+					title: "Hub candidates",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(KeyValueList, { items: [{
+						key: "Offered",
+						value: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+							className: "flex flex-wrap items-center gap-1.5 text-xs",
+							children: [typeCounts(hub.countByType), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Badge, {
+								variant: hub.flag === "private-only" ? "warning" : hub.flag === "public-path" ? "success" : "default",
+								children: FLAG_TEXT[hub.flag]
+							})]
+						})
+					}, {
+						key: "Source",
+						value: `${String(hub.fromSdp)} in the answer SDP · ${String(hub.fromTrickle)} trickled${hub.trickleDone === true ? " · gathering done" : ""}`
+					}] }), hub.candidates.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("ul", {
+						className: "mt-1 space-y-0.5 font-mono text-[10px] text-foreground-subtle",
+						children: hub.candidates.map((c) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", {
+							className: "break-all",
+							children: candidateText(c)
+						}, c.raw))
+					})]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Group, {
+					title: "Timeline",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(KeyValueList, { items: [
+						{
+							key: "ICE connected",
+							value: fmtMs(timeline.iceConnectedMs)
+						},
+						{
+							key: "DTLS connected",
+							value: fmtMs(timeline.dtlsConnectedMs)
+						},
+						{
+							key: "First frame",
+							value: fmtMs(timeline.firstFrameMs)
+						},
+						{
+							key: "ICE · DTLS final",
+							value: `${fmtText(timeline.iceFinalState)} · ${fmtText(timeline.dtlsFinalState)}`
+						}
+					] })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Group, {
+					title: "Path",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(KeyValueList, { items: [
+						{
+							key: "Selected pair",
+							value: path.pairType === null ? fmtText(null) : `${path.pairType} (local/remote)`
+						},
+						{
+							key: "Protocol · RTT",
+							value: `${fmtText(path.protocol)} · ${fmtMs(path.rttMs)}`
+						},
+						{
+							key: "Browser offered",
+							value: `${typeCounts(local.countByType)}${local.relayProtocols.length > 0 ? ` · relay over ${local.relayProtocols.join("/")}` : ""}`
+						}
+					] })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Group, {
+					title: "Media",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(KeyValueList, { items: [
+						{
+							key: "Hub sent",
+							value: `${fmtCount(media.serverPacketsSent)} RTP packets${media.servedTier !== null ? ` · ${media.servedTier}` : ""}${media.egressLeg !== null ? ` · ${media.egressLeg}` : ""}`
+						},
+						{
+							key: "Browser got",
+							value: `${fmtCount(media.clientPacketsReceived)} packets · ${fmtBytes(media.clientBytesReceived)}`
+						},
+						{
+							key: "Frames decoded",
+							value: fmtCount(media.framesDecoded)
+						},
+						{
+							key: "Loss · freezes",
+							value: `${fmtPercent(media.lossPercent)} · ${fmtCount(media.freezeCount)} (${fmtMs(media.totalFreezeMs)})`
+						},
+						{
+							key: "PLI · NACK",
+							value: `${fmtCount(media.pliCount)} · ${fmtCount(media.nackCount)}`
+						}
+					] })
+				}),
+				(report.reconnects > 0 || report.errors.length > 0 || report.serverError !== null) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "text-[10px] text-foreground-subtle",
+					children: [
+						report.reconnects > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: ["Player reconnects: ", String(report.reconnects)] }),
+						report.errors.map((e, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: ["Player error: ", e] }, `${String(i)}-${e}`)),
+						report.serverError !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: ["Server debug: ", report.serverError] })
+					]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: TEXT_HINT,
+					children: [
+						"Sessions:",
+						" ",
+						report.sessionIds.length > 0 ? report.sessionIds.map((s) => s.slice(0, 8)).join(", ") : "none",
+						" ",
+						"· ",
+						String(Math.round(report.durationMs / 1e3)),
+						" s"
+					]
+				})
+			]
+		})]
+	});
+}
+function transportDetail(input) {
+	const state = input.iceFinalState ?? "unknown";
+	if (input.hubFlag === "unknown") return `ICE ${state}; the hub never answered the offer, so no hub candidate was seen`;
+	if (input.hubFlag === "none") return `ICE ${state}; the hub answered but offered no candidate`;
+	if (input.policy === "relay" && input.hubFlag === "private-only") return `ICE ${state}; this browser was limited to TURN relay candidates and the hub offered only LAN/Tailscale addresses (no srflx/relay) — a relayed client cannot reach it`;
+	if (input.hubFlag === "private-only") return `ICE ${state}; the hub offered only LAN/Tailscale addresses (no srflx/relay) — reachable only from inside those networks`;
+	return `ICE ${state}; no candidate pair between this browser and the hub succeeded`;
+}
+function verdict(layer, title, detail) {
+	return {
+		layer,
+		title,
+		detail
+	};
+}
+function mediaVerdict(input) {
+	const client = input.clientPacketsReceived;
+	const sent = input.serverPacketsSent;
+	if (client === null) return verdict("unknown", "Media unknown", "the browser reported no inbound video statistics");
+	if (client === 0) {
+		if (sent === null) return verdict("unknown", "Nothing received", "the browser received no packets and the hub's own count is unknown");
+		if (sent > 0) return verdict("media-black-hole", "Media black-hole", `the hub sent ${String(sent)} RTP packets and this browser received none — media is lost between them after DTLS`);
+		return verdict("hub-not-sending", "Hub not sending", "the session is connected but the hub sent no RTP — the source or the broker is not producing");
+	}
+	if (input.framesDecoded === null) return verdict("unknown", "Decode unknown", "packets arrive; the browser reported no decode count");
+	if (input.framesDecoded === 0) return verdict("loss-keyframe", "Loss / keyframe size", "packets arrive but no frame decoded — a keyframe never completes over this path");
+	const { pliCount: pli, freezeCount: freezes, lossPercent: loss } = input;
+	const storm = pli !== null && pli >= 3 || freezes !== null && freezes > 0 || loss !== null && loss >= 2;
+	const signals = [
+		`${pli === null ? "unknown" : String(pli)} PLI`,
+		`${freezes === null ? "unknown" : String(freezes)} freezes`,
+		`${loss === null ? "unknown" : `${loss.toFixed(1)}%`} loss`
+	].join(", ");
+	if (storm) return verdict("loss-keyframe", "Loss / keyframe size", `frames decode but the path is lossy: ${signals}`);
+	if (pli === null && freezes === null && loss === null) return verdict("healthy", "Decoding", "frames decode; the browser reported no loss signal to judge");
+	return verdict("healthy", "Healthy", `connected, receiving and decoding: ${signals}`);
+}
+function classifySessionVerdict(input) {
+	if (!input.iceConnected) return verdict("transport", "Transport (ICE) failed", transportDetail(input));
+	if (!input.dtlsConnected && input.dtlsFinalState !== null) return verdict("hub-dtls", "DTLS stuck (hub side)", `ICE connected but DTLS stayed ${input.dtlsFinalState} — the hub never completed the handshake`);
+	return mediaVerdict(input);
+}
+//#endregion
+//#region src/composites/webrtc-diagnostics/session-run.ts
+function emptySessionRun(policy) {
+	return {
+		policy,
+		sessionIds: [],
+		sdpAnswer: null,
+		trickled: [],
+		trickleDone: null,
+		local: [],
+		ice: [],
+		dtls: [],
+		peer: [],
+		firstFrameAt: null,
+		lastStats: null,
+		lastServer: null,
+		maxServerPacketsSent: null,
+		lastServerError: null,
+		samples: 0,
+		reconnects: 0,
+		errors: []
+	};
+}
+function mark(list, state, at) {
+	return list.at(-1)?.state === state ? list : [...list, {
+		state,
+		at
+	}];
+}
+function maxOrNull(a, b) {
+	if (a === null) return b;
+	if (b === null) return a;
+	return Math.max(a, b);
+}
+function reduceSample(state, sample) {
+	return {
+		...state,
+		samples: state.samples + 1,
+		lastStats: sample.stats ?? state.lastStats,
+		lastServer: sample.server ?? state.lastServer,
+		maxServerPacketsSent: maxOrNull(state.maxServerPacketsSent, sample.server?.rtpPacketsSent ?? null),
+		lastServerError: sample.serverError,
+		sessionIds: sample.sessionId !== null && !state.sessionIds.includes(sample.sessionId) ? [...state.sessionIds, sample.sessionId] : state.sessionIds
+	};
+}
+function reduceSessionRun(state, event) {
+	switch (event.kind) {
+		case "offer-answered": return {
+			...state,
+			sdpAnswer: state.sdpAnswer ?? event.sdpAnswer,
+			sessionIds: state.sessionIds.includes(event.sessionId) ? state.sessionIds : [...state.sessionIds, event.sessionId]
+		};
+		case "hub-candidates": return {
+			...state,
+			trickled: [...state.trickled, ...event.candidates.filter((c) => !state.trickled.includes(c))],
+			trickleDone: event.done || state.trickleDone === true
+		};
+		case "local-candidate": {
+			const candidate = parseIceCandidate(event.candidate);
+			if (candidate === null) return state;
+			return {
+				...state,
+				local: [...state.local, {
+					candidate,
+					url: event.url,
+					relayProtocol: event.relayProtocol
+				}]
+			};
+		}
+		case "ice-state": return {
+			...state,
+			ice: mark(state.ice, event.state, event.at)
+		};
+		case "dtls-state": return {
+			...state,
+			dtls: mark(state.dtls, event.state, event.at)
+		};
+		case "peer-state": return {
+			...state,
+			peer: mark(state.peer, event.state, event.at)
+		};
+		case "first-frame": return {
+			...state,
+			firstFrameAt: state.firstFrameAt ?? event.at
+		};
+		case "sample": return reduceSample(state, event.sample);
+		case "reconnect": return {
+			...state,
+			reconnects: state.reconnects + 1
+		};
+		case "error": return {
+			...state,
+			errors: [...state.errors, event.message]
+		};
+	}
+}
+var CONNECTED_ICE = new Set(["connected", "completed"]);
+function firstAt(list, states) {
+	return list.find((m) => states.has(m.state))?.at ?? null;
+}
+var CONNECTED = new Set(["connected"]);
+function timelineOf(state) {
+	const dtlsAt = firstAt(state.dtls, CONNECTED) ?? firstAt(state.peer, CONNECTED);
+	const dtlsFinal = state.dtls.at(-1)?.state ?? state.peer.at(-1)?.state ?? null;
+	return {
+		iceConnectedMs: firstAt(state.ice, CONNECTED_ICE),
+		dtlsConnectedMs: dtlsAt,
+		firstFrameMs: state.firstFrameAt,
+		iceFinalState: state.ice.at(-1)?.state ?? null,
+		dtlsFinalState: dtlsFinal
+	};
+}
+function mediaOf(state) {
+	const s = state.lastStats;
+	const srv = state.lastServer;
+	return {
+		clientBytesReceived: s?.raw.bytesReceived ?? null,
+		clientPacketsReceived: s?.packetsReceived ?? null,
+		framesDecoded: s?.framesDecoded ?? null,
+		serverPacketsSent: state.maxServerPacketsSent,
+		serverAlive: srv?.alive ?? null,
+		servedTier: srv?.servedTier ?? null,
+		egressLeg: srv?.egressLeg ?? null,
+		lossPercent: s?.lossPercent ?? null,
+		freezeCount: s?.freezeCount ?? null,
+		totalFreezeMs: s?.totalFreezeMs ?? null,
+		pliCount: s?.pliCount ?? null,
+		nackCount: s?.nackCount ?? null
+	};
+}
+function localOf(state) {
+	const unique = (xs) => [...new Set(xs.filter((x) => x !== null))];
+	return {
+		countByType: countCandidateTypes(state.local.map((l) => l.candidate)),
+		relayProtocols: unique(state.local.filter((l) => l.candidate.type === "relay").map((l) => l.relayProtocol)),
+		urls: unique(state.local.map((l) => l.url))
+	};
+}
+function finalizeSessionRun(state, durationMs) {
+	const hub = summarizeHubCandidates({
+		sdpAnswer: state.sdpAnswer,
+		trickled: state.trickled,
+		trickleDone: state.trickleDone
+	});
+	const timeline = timelineOf(state);
+	const media = mediaOf(state);
+	const verdict = classifySessionVerdict({
+		policy: state.policy,
+		durationMs,
+		iceConnected: timeline.iceConnectedMs !== null,
+		iceFinalState: timeline.iceFinalState,
+		dtlsConnected: timeline.dtlsConnectedMs !== null,
+		dtlsFinalState: timeline.dtlsFinalState,
+		hubFlag: hub.flag,
+		clientPacketsReceived: media.clientPacketsReceived,
+		framesDecoded: media.framesDecoded,
+		serverPacketsSent: media.serverPacketsSent,
+		pliCount: media.pliCount,
+		freezeCount: media.freezeCount,
+		lossPercent: media.lossPercent
+	});
+	return {
+		policy: state.policy,
+		durationMs,
+		sessionIds: state.sessionIds,
+		hub,
+		local: localOf(state),
+		timeline,
+		path: {
+			pairType: state.lastStats?.candidatePairType ?? null,
+			protocol: state.lastStats?.candidateProtocol ?? null,
+			rttMs: state.lastStats?.rttMs ?? null
+		},
+		media,
+		reconnects: state.reconnects,
+		errors: state.errors,
+		serverError: state.lastServerError,
+		verdict
+	};
+}
+//#endregion
+//#region src/composites/webrtc-diagnostics/HubSessionTestCard.tsx
+/**
+* "Hub session test" — a real live session from THIS browser to the hub,
+* through the same `CameraStreamPlayer` + `useDeviceWebrtc` signaling every
+* viewer uses, run twice: browser ICE policy `all`, then `relay`.
+*
+* Nothing is simulated. The player's own client-offer path builds the offer,
+* trickles, polls the hub's candidates, and reports its 1 Hz
+* `StreamDebugSample` (the `webrtc-debug-stats` collector plus the server's
+* `getSessionDebug`). This card only LISTENS: it wraps the signaling callbacks
+* to see the hub's answer SDP and trickled candidates, and adds listeners to
+* each peer connection the player builds (`onPeerConnection`) for the ICE /
+* DTLS timeline and the browser's own candidates. The target is pinned (a low
+* or sub stream by default) so a large keyframe does not decide the verdict.
+*/
+var HUB_SESSION_RUN_MS = 15e3;
+var POLICIES = ["all", "relay"];
+/** Between runs, so the first session is closed on the hub before the second opens. */
+var RUN_GAP_MS = 750;
+var PROGRESS_TICK_MS = 500;
+/** Pinned targets only, cheapest first: an adaptive target would climb mid-run. */
+function pinnedStreamChoices(streams) {
+	const rank = (s) => {
+		const t = s.target;
+		if (t.kind === "profile") return t.profile === "low" ? 0 : t.profile === "mid" ? 2 : 3;
+		if (t.kind === "cam-stream") return /sub|low|ext/i.test(t.camStreamId) ? 1 : 4;
+		return 9;
+	};
+	return streams.filter((s) => s.target.kind !== "adaptive").toSorted((a, b) => rank(a) - rank(b));
+}
+var POLICY_LABEL = {
+	all: "ICE policy all",
+	relay: "ICE policy relay (TURN only)"
+};
+function HubSessionTestCard({ trpc, serverUrl, deviceId, cameraField, runMs = HUB_SESSION_RUN_MS }) {
+	const webrtc = useDeviceWebrtc(trpc, deviceId);
+	const choices = (0, react$1.useMemo)(() => pinnedStreamChoices(webrtc.streams), [webrtc.streams]);
+	const [choiceId, setChoiceId] = (0, react$1.useState)(null);
+	const choice = choices.find((c) => c.id === choiceId) ?? choices[0] ?? null;
+	const [live, setLive] = (0, react$1.useState)(null);
+	const [reports, setReports] = (0, react$1.useState)([]);
+	const [elapsedMs, setElapsedMs] = (0, react$1.useState)(0);
+	/** True from Run until the last policy reported or Stop — the gap between runs included. */
+	const [active, setActive] = (0, react$1.useState)(false);
+	const stateRef = (0, react$1.useRef)(emptySessionRun("all"));
+	const t0Ref = (0, react$1.useRef)(0);
+	const tokenRef = (0, react$1.useRef)(0);
+	const gapTimerRef = (0, react$1.useRef)(null);
+	const elapsed = (0, react$1.useCallback)(() => Math.round(performance.now() - t0Ref.current), []);
+	/** Fold one observation into the CURRENT run; a late event from a closed run is dropped. */
+	const record = (0, react$1.useCallback)((token, event) => {
+		if (token !== tokenRef.current) return;
+		stateRef.current = reduceSessionRun(stateRef.current, event);
+	}, []);
+	const stop = (0, react$1.useCallback)(() => {
+		tokenRef.current += 1;
+		if (gapTimerRef.current !== null) clearTimeout(gapTimerRef.current);
+		gapTimerRef.current = null;
+		setLive(null);
+		setActive(false);
+	}, []);
+	const startRun = (0, react$1.useCallback)((index) => {
+		const policy = POLICIES[index];
+		if (policy === void 0) return;
+		tokenRef.current += 1;
+		stateRef.current = emptySessionRun(policy);
+		t0Ref.current = performance.now();
+		setElapsedMs(0);
+		setLive({
+			index,
+			policy,
+			token: tokenRef.current
+		});
+	}, []);
+	(0, react$1.useEffect)(() => {
+		if (live === null) return;
+		const tick = setInterval(() => setElapsedMs(elapsed()), PROGRESS_TICK_MS);
+		const done = setTimeout(() => {
+			const report = finalizeSessionRun(stateRef.current, elapsed());
+			setReports((prev) => [...prev, report]);
+			tokenRef.current += 1;
+			setLive(null);
+			const next = live.index + 1;
+			if (next < POLICIES.length) gapTimerRef.current = setTimeout(() => startRun(next), RUN_GAP_MS);
+			else setActive(false);
+		}, runMs);
+		return () => {
+			clearInterval(tick);
+			clearTimeout(done);
+		};
+	}, [
+		live,
+		runMs,
+		elapsed,
+		startRun
+	]);
+	(0, react$1.useEffect)(() => () => {
+		tokenRef.current += 1;
+		if (gapTimerRef.current !== null) clearTimeout(gapTimerRef.current);
+	}, []);
+	const start = (0, react$1.useCallback)(() => {
+		setReports([]);
+		setActive(true);
+		startRun(0);
+	}, [startRun]);
+	const target = choice?.target ?? null;
+	const token = live?.token ?? -1;
+	const handleOffer = (0, react$1.useCallback)(async (sdpOffer, sessionId, hints) => {
+		if (target === null) throw new Error("no stream selected");
+		const res = await webrtc.handleOffer(target, sdpOffer, sessionId, hints);
+		record(token, {
+			kind: "offer-answered",
+			at: elapsed(),
+			sessionId: res.sessionId,
+			sdpAnswer: res.sdpAnswer
+		});
+		return res;
+	}, [
+		target,
+		webrtc,
+		record,
+		token,
+		elapsed
+	]);
+	const getIceCandidates = (0, react$1.useCallback)(async (sessionId) => {
+		const res = await webrtc.getIceCandidates(sessionId);
+		record(token, {
+			kind: "hub-candidates",
+			at: elapsed(),
+			candidates: res.candidates.map((c) => c.candidate ?? "").filter((c) => c.length > 0),
+			done: res.done
+		});
+		return res;
+	}, [
+		webrtc,
+		record,
+		token,
+		elapsed
+	]);
+	const onPeerConnection = (0, react$1.useCallback)((pc) => {
+		const seen = /* @__PURE__ */ new WeakSet();
+		pc.addEventListener("iceconnectionstatechange", () => record(token, {
+			kind: "ice-state",
+			at: elapsed(),
+			state: pc.iceConnectionState
+		}));
+		pc.addEventListener("connectionstatechange", () => record(token, {
+			kind: "peer-state",
+			at: elapsed(),
+			state: pc.connectionState
+		}));
+		pc.addEventListener("icecandidate", (e) => {
+			const probed = probedCandidateFromEvent(e, elapsed());
+			if (probed === null) return;
+			record(token, {
+				kind: "local-candidate",
+				at: probed.tMs,
+				candidate: probed.candidate.raw,
+				url: probed.url,
+				relayProtocol: probed.relayProtocol
+			});
+		});
+		pc.addEventListener("track", (e) => {
+			const transport = e.receiver.transport;
+			if (transport === null || seen.has(transport)) return;
+			seen.add(transport);
+			record(token, {
+				kind: "dtls-state",
+				at: elapsed(),
+				state: transport.state
+			});
+			transport.addEventListener("statechange", () => record(token, {
+				kind: "dtls-state",
+				at: elapsed(),
+				state: transport.state
+			}));
+		});
+	}, [
+		record,
+		token,
+		elapsed
+	]);
+	const onDebugStats = (0, react$1.useCallback)((sample) => record(token, {
+		kind: "sample",
+		at: elapsed(),
+		sample
+	}), [
+		record,
+		token,
+		elapsed
+	]);
+	const onConnectTiming = (0, react$1.useCallback)((timing) => {
+		if (timing["firstFrameMs"] !== void 0) record(token, {
+			kind: "first-frame",
+			at: elapsed()
+		});
+	}, [
+		record,
+		token,
+		elapsed
+	]);
+	const progress = live === null ? null : Math.min(100, Math.round(elapsedMs / runMs * 100));
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(SectionCard, {
+		headingId: "webrtc-diag-hub-session",
+		title: "Hub session test",
+		icon: Activity,
+		testId: "webrtc-diag-hub-session",
+		actions: !active ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
+			onClick: start,
+			disabled: !(deviceId !== null && choice !== null && !active),
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Play, { className: "h-3 w-3" }),
+				"Run test (",
+				String(Math.round(runMs * POLICIES.length / 1e3)),
+				" s)"
+			]
+		}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
+			variant: "outline",
+			onClick: stop,
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Square, { className: "h-3 w-3" }), "Stop"]
+		}),
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: `${SECTION_BODY} space-y-3`,
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: `grid grid-cols-1 sm:grid-cols-2 ${GRID_GAP}`,
+						children: [cameraField, /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+							className: "flex min-w-0 flex-col gap-1",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: "text-[11px] text-foreground-subtle",
+								children: "Stream (pinned)"
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Select, {
+								value: choice?.id ?? "",
+								disabled: choices.length === 0 || active,
+								onChange: (e) => setChoiceId(e.target.value),
+								options: choices.length === 0 ? [{
+									value: "",
+									label: deviceId === null ? "Pick a camera first" : "No pinned stream"
+								}] : choices.map((c) => ({
+									value: c.id,
+									label: c.label
+								}))
+							})]
+						})]
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: TEXT_HINT,
+						children: "Opens a real live session from this browser twice — first with every candidate type, then TURN relay only — and reads both ends of it."
+					}),
+					live !== null && deviceId !== null && choice !== null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: `grid grid-cols-1 sm:grid-cols-[minmax(0,16rem)_1fr] gap-2 sm:gap-3 items-start`,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "aspect-video w-full overflow-hidden rounded-md border border-border bg-black",
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CameraStreamPlayer, {
+								serverUrl,
+								streamKey: `diag-${choice.id}-${live.policy}`,
+								autoPlay: true,
+								muted: true,
+								showControls: false,
+								className: "h-full w-full",
+								handleOffer,
+								getIceServers: webrtc.getIceServers,
+								addIceCandidate: webrtc.addIceCandidate,
+								getIceCandidates,
+								closeSession: webrtc.closeSession,
+								getSessionDebug: webrtc.getSessionDebug,
+								applyDownlinkProbe: webrtc.applyDownlinkProbe,
+								iceTransportPolicy: live.policy,
+								onPeerConnection,
+								onDebugStats,
+								onConnectTiming,
+								onReconnectAttempt: () => record(token, {
+									kind: "reconnect",
+									at: elapsed()
+								}),
+								onError: (message) => record(token, {
+									kind: "error",
+									at: elapsed(),
+									message
+								})
+							}, `${String(live.token)}-${live.policy}`)
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "space-y-1.5",
+							"data-testid": "webrtc-diag-progress",
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "flex items-center gap-2 text-xs text-foreground",
+									children: [
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoaderCircle, { className: "h-3 w-3 animate-spin" }),
+										"Run ",
+										String(live.index + 1),
+										" of ",
+										String(POLICIES.length),
+										" ·",
+										" ",
+										POLICY_LABEL[live.policy]
+									]
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: "h-1.5 w-full overflow-hidden rounded bg-surface-hover",
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+										className: "h-full bg-primary transition-[width]",
+										style: { width: `${String(progress ?? 0)}%` }
+									})
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "text-[10px] text-foreground-subtle",
+									children: [
+										String(Math.round(elapsedMs / 1e3)),
+										" s of ",
+										String(Math.round(runMs / 1e3)),
+										" s"
+									]
+								})
+							]
+						})]
+					})
+				]
+			}),
+			reports.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: `grid grid grid-cols-1 lg:grid-cols-2 gap-2 sm:gap-3 border-t border-border p-2 sm:p-3`,
+				children: reports.map((r, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RunReport, {
+					report: r,
+					title: `Run ${String(i + 1)} · ${POLICY_LABEL[r.policy]}`
+				}, `${String(i)}-${r.policy}`))
+			}),
+			reports.length === 0 && !active && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: `px-3 sm:px-4 py-1.5 sm:py-2 border-t border-border text-[10px] text-foreground-subtle`,
+				children: "No run yet."
+			})
+		]
+	});
+}
+//#endregion
+//#region src/composites/cap-settings/scene-monitor-copy.ts
+/** The lighting variants an operator is OFFERED. The resolver can also report
+*  `night`, `dawn` and `dusk`; those are shown when present but never demanded,
+*  because most installs only ever see day and IR. */
+var SCENE_CAPTURE_VARIANTS = ["day", "ir"];
+var VARIANT_LABEL = {
+	day: "Daylight",
+	ir: "Night (IR)",
+	night: "Night",
+	dawn: "Dawn",
+	dusk: "Dusk"
+};
+function variantLabel(condition) {
+	return VARIANT_LABEL[condition] ?? condition;
+}
 /**
-* The toggle rule, and the only copy of it.
+* "Daylight ✓ · Night (IR) ✗ — optional; checks in night (ir) are skipped."
 *
-* none → asc → desc → none, and a click on a DIFFERENT column starts that
-* column fresh at `asc`. `sameColumn` says whether the clicked column is the
-* one currently sorted; `currentDir` is its direction (`null` when nothing is
-* sorted). Returns the next direction, or `null` for "unsorted".
+* Converts the silent cross-condition fallback this engine used to have into an
+* operator-visible fact. Without it, a scene with only a daylight reference
+* simply stops answering after sunset and nothing anywhere says why.
 *
-* Split out from {@link nextTableSort} so the device list — whose sort state
-* keys columns by `columnId`, not `columnKey` — can reuse the rule without a
-* cast and without a second copy of it.
+* It used to end *"reports 'can't tell' in night (ir)"*, which was accurate and
+* read as a defect: the operator saw a ✗ and a complaint for a scene that was
+* configured exactly as they meant it. The missing half is now named as what it
+* is — the part you do not have to do — and the sentence says what actually
+* happens instead, which differs by the scene's own policy.
 */
-function nextSortDirection(sameColumn, currentDir) {
-	if (!sameColumn || currentDir === null) return "asc";
-	return currentDir === "asc" ? "desc" : null;
+function coverageLine(monitor) {
+	const covered = new Set(monitor.coveredConditions);
+	const parts = SCENE_CAPTURE_VARIANTS.map((v) => `${variantLabel(v)} ${covered.has(v) ? "✓" : "✗"}`);
+	const extra = [...covered].filter((c) => !SCENE_CAPTURE_VARIANTS.some((v) => v === c));
+	for (const c of extra) parts.push(`${variantLabel(c)} ✓`);
+	const missing = SCENE_CAPTURE_VARIANTS.filter((v) => !covered.has(v));
+	if (missing.length === 0) return parts.join(" · ");
+	if (covered.size === 0) return `${parts.join(" · ")} — nothing captured yet, so this scene is not watching.`;
+	const names = missing.map((v) => variantLabel(v).toLowerCase()).join(" and ");
+	return monitor.onUncoveredCondition === "judge-anyway" ? `${parts.join(" · ")} — ${names} judged against the references you do have.` : `${parts.join(" · ")} — optional; checks in ${names} are skipped.`;
 }
 /**
-* Toggle a column's sort on header click: none → asc → desc → none.
-* Clicking a DIFFERENT column starts it fresh at `asc`.
+* The calm sentence for a scene that is sitting the current light out — `null`
+* whenever it is checking normally.
+*
+* Separate from {@link statusLine} because it is not a verdict and must not
+* read like one. A paused scene has not failed, has not lost its flag, and
+* needs nothing from the operator; the only thing worth saying is which light
+* it is waiting out and that it will pick itself back up.
 */
-function nextTableSort(current, columnKey) {
-	const dir = nextSortDirection(current !== null && current.columnKey === columnKey, current === null ? null : current.dir);
-	return dir === null ? null : {
-		columnKey,
-		dir
-	};
+function suspensionLine(monitor) {
+	if (monitor.suspendedCondition === null) return null;
+	const light = variantLabel(monitor.suspendedCondition).toLowerCase();
+	return `Paused — nothing was captured in ${light}, so checks are on hold until the light changes back. Capture ${light} if you want it watched around the clock.`;
 }
+var UNAVAILABLE_SENTENCE = {
+	"no-reference-for-condition": "can’t tell — nothing has been captured for this scene yet. Press “Capture daylight” to photograph what normal looks like.",
+	"view-shifted": "can’t tell — the camera view has moved since the reference was captured. Re-capture it.",
+	"no-vision-profile": "can’t tell — the vision model is unreachable, so the change is on hold.",
+	"encoder-model-changed": "can’t tell — the embedding model changed, so the stored references are unreadable. Re-capture them.",
+	"no-snapshot": "can’t tell — this camera did not return a frame."
+};
 /**
-* Ascending comparison of two cell values.
-*
-* Numbers compare numerically and strings compare with `localeCompare` — a
-* numeric column must never be ordered as text ("100" before "9"), and a text
-* column must respect the locale's collation. A mixed column (one row a
-* number, another a string) falls back to string comparison of both, which is
-* the only total order available; it is not a shape any caller should build on
-* purpose.
-*
-* `null` is NOT handled here — {@link sortRowsByColumn} pulls it out first,
-* because its placement is direction-independent and a comparator that is
-* multiplied by the direction factor cannot express that.
+* The one line under a scene's name. It answers, in order: can it judge, what
+* does it say, and how long has it said it.
 */
-function compareValues(a, b) {
-	if (typeof a === "number" && typeof b === "number") return a - b;
-	return String(a).localeCompare(String(b));
+function statusLine(monitor, now) {
+	if (monitor.states.length === 0) return "Not armed yet — capture the initial state to start watching.";
+	if (monitor.verdict === "unknown") return monitor.unavailable !== null ? UNAVAILABLE_SENTENCE[monitor.unavailable] : "can’t tell right now.";
+	const since = monitor.verdict === "diverged" ? monitor.divergedAt : monitor.armedAt;
+	const held = since !== null ? ` for ${humanDuration(Math.max(0, now - since))}` : "";
+	if (monitor.latched) return monitor.verdict === "diverged" ? `CHANGED${held} — press Reset when you have dealt with it.` : `Back to normal, but still flagged as changed${held}. Press Reset to clear it.`;
+	const paused = suspensionLine(monitor);
+	if (paused !== null) return paused;
+	return monitor.verdict === "diverged" ? `CHANGED${held}` : `Normal${held}`;
 }
-/**
-* Return a NEW array of `rows` ordered by `sort`.
+/** The badge word. `latched` wins over `verdict`, because the latch is the
+*  thing the operator asked to be told and it outlives the live state.
 *
-* `valueOf` is the column's `sortValue` — it is called once per row per
-* comparison, so it must be cheap (read a field, do not format a string).
-* `sort === null` ⇒ a fresh shallow copy in the incoming order.
-*/
-function sortRowsByColumn(rows, sort, valueOf) {
-	if (sort === null) return [...rows];
-	const factor = sort.dir === "asc" ? 1 : -1;
-	return rows.toSorted((a, b) => {
-		const av = valueOf(a);
-		const bv = valueOf(b);
-		if (av === null || bv === null) {
-			if (av === bv) return 0;
-			return av === null ? 1 : -1;
-		}
-		return factor * compareValues(av, bv);
-	});
+*  A scene sitting out an uncovered light reads `Paused`, in the NEUTRAL tone —
+*  never `alarm`, and never the `danger` variant the page maps that to. A
+*  missing IR reference must not be able to paint a red badge on a scene that
+*  is doing exactly what it was configured to do. */
+function badgeFor(monitor) {
+	if (monitor.states.length === 0) return {
+		text: "Not armed",
+		tone: "unknown"
+	};
+	if (monitor.latched) return {
+		text: "Changed",
+		tone: "alarm"
+	};
+	if (monitor.suspendedCondition !== null) return {
+		text: "Paused",
+		tone: "unknown"
+	};
+	if (monitor.verdict === "unknown") return {
+		text: "Can’t tell",
+		tone: "unknown"
+	};
+	return monitor.verdict === "diverged" ? {
+		text: "Changed",
+		tone: "alarm"
+	} : {
+		text: "Normal",
+		tone: "ok"
+	};
 }
-/** Derive the `<th>` `aria-sort` for `columnKey` from the table's sort state. */
-function ariaSortForColumn(sort, columnKey) {
-	if (sort === null || sort.columnKey !== columnKey) return "none";
-	return sort.dir === "asc" ? "ascending" : "descending";
+/** A rect covering most of the frame is dominated by weather, sky and parked
+*  cars: the bin is 2 % of the pixels and CLIP will not notice it leaving. The
+*  failure is silent INSENSITIVITY, which is the worst kind — hence a warning
+*  rather than a refusal. */
+var ROI_AREA_WARN_FRACTION = .4;
+function roiTooLarge(roi) {
+	return roi.width * roi.height > ROI_AREA_WARN_FRACTION;
+}
+function humanDuration(ms) {
+	const s = Math.floor(ms / 1e3);
+	if (s < 60) return `${s}s`;
+	const m = Math.floor(s / 60);
+	if (m < 60) return `${m}m`;
+	const h = Math.floor(m / 60);
+	if (h < 48) return `${h}h`;
+	return `${Math.floor(h / 24)}d`;
 }
 //#endregion
-//#region src/composites/data-table.tsx
+//#region src/composites/code-block.tsx
+function CodeBlock({ children, maxHeight = 300, className }) {
+	const [copied, setCopied] = (0, react$1.useState)(false);
+	const handleCopy = (0, react$1.useCallback)(() => {
+		navigator.clipboard.writeText(children).then(() => {
+			setCopied(true);
+			setTimeout(() => setCopied(false), 2e3);
+		});
+	}, [children]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: cn("relative group", className),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ScrollArea, {
+			style: { maxHeight },
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("pre", {
+				className: "font-mono text-xs bg-surface p-3 rounded-md border border-border-subtle",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", { children })
+			})
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconButton, {
+				icon: copied ? Check : Copy,
+				"aria-label": "Copy code",
+				variant: "ghost",
+				size: "sm",
+				onClick: handleCopy
+			})
+		})]
+	});
+}
+//#endregion
+//#region src/composites/confirm-action-button.tsx
 /**
-* DataTable — shared responsive table for admin pages.
-*
-* Recipes baked in:
-*   - `overflow-x-auto` wrapper so narrow viewports don't clip the
-*     right edge (the rounded border survives the scroll).
-*   - `min-w-[Npx]` on the inner table so columns don't squash below
-*     readable width before the scroll kicks in.
-*   - `whitespace-nowrap` on headers — column titles never wrap to
-*     two lines (`AUTO-KILL` was the regression that triggered this).
-*   - Themed `bg-surface` + `border-border` so contrast works in both
-*     light and dark themes.
-*
-* Column model: caller supplies `columns: DataColumn<T>[]` and
-* `rows: T[]`. Each column declares `header`, optional `align`,
-* optional `nowrap`, and a `render(row) => ReactNode` that produces
-* the cell content.
-*
-*   <DataTable
-*     columns={[
-*       { key: 'username', header: 'Username', render: (u) => u.username },
-*       { key: 'role',     header: 'Role',     render: (u) => <RoleBadge .../> },
-*       { key: 'actions',  header: '',         align: 'right', render: (u) => <Actions .../> },
-*     ]}
-*     rows={users}
-*     minWidthPx={560}
-*   />
-*
-* If finer header markup is needed, pass `headerRender` instead of
-* `header` (e.g. for a sortable click affordance).
-*
-* ── Narrow viewports ──────────────────────────────────────────────────────
-* The table stays a table. The wrapper is `overflow-x-auto`, so a phone
-* scrolls the columns sideways INSIDE the table — the page body never moves
-* sideways, and the cells stay one line (`whitespace-nowrap`). That is the
-* default (`mobileMode="scroll"`). Cards are opt-in via `mobileMode="cards"`;
-* `auto` still applies the old column-count rule for a surface that wants it.
-* See `resolveTableLayout`.
-*
-* ── Scrolling the BODY, not the page ──────────────────────────────────────
-* `maxBodyHeight` caps the table and scrolls its rows INSIDE the container
-* with the column header pinned. It is ONE prop, not two, because "this list
-* scrolls internally" and "its header stays visible" are the same decision: a
-* capped table whose header scrolls away is a list of unlabelled cells.
+* ConfirmActionButton — destructive-action button with a modal confirm.
 *
-* Use it wherever the row count is open-ended (rules, targets, delivery
-* history) so the page keeps its own header, filters and actions in view while
-* the operator moves through the rows.
-*/
-/**
-* The default cap for an internally-scrolling table.
+* Two-step UX for any operation operators shouldn't trigger by accident:
+* reboot device, restart addon, regenerate token, etc. The trigger is a
+* normal Button that opens a Dialog; confirming runs the async action,
+* the trigger spinner-disables itself for the duration, and the dialog
+* closes on success. Errors surface inline at the dialog's bottom.
 *
-* `60vh` leaves the page header, its filters and its actions on screen at
-* every viewport while still showing ~10 rows — and it is a fraction, so it
-* does not need a breakpoint of its own.
+* Generic on `TResult` so callers don't have to discard the return
+* value. Pass an `icon` to render it inside the trigger (e.g. RotateCw
+* for reboot, RefreshCw for restart).
 */
-var TABLE_SCROLL_MAX_H = "max-h-[60vh]";
-var ALIGN_CLASS = {
-	left: "text-left",
-	right: "text-right",
-	center: "text-center"
-};
-function DataTable({ columns, rows, rowKey, onRowClick, minWidthPx = 480, emptyMessage, className, bordered = true, rowClassName, mobileMode = "scroll", maxBodyHeight, defaultSort }) {
-	const isNarrow = useIsMobile();
-	const [sort, setSort] = (0, react$1.useState)(defaultSort ?? null);
-	const layout = resolveTableLayout({
-		mode: mobileMode,
-		columnCount: columns.length,
-		isNarrow
-	});
-	const scrolls = maxBodyHeight !== void 0;
-	const sortedColumn = (0, react$1.useMemo)(() => sort === null ? void 0 : columns.find((col) => col.key === sort.columnKey && col.sortValue !== void 0), [columns, sort]);
-	const sortValue = sortedColumn?.sortValue;
-	const displayRows = (0, react$1.useMemo)(() => sortValue === void 0 ? rows : sortRowsByColumn(rows, sort, sortValue), [
-		rows,
-		sort,
-		sortValue
-	]);
-	const activeSort = sortedColumn === void 0 ? null : sort;
-	if (rows.length === 0 && emptyMessage) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: `rounded-lg ${bordered ? "border border-border" : ""} bg-surface px-3 py-4 text-xs text-foreground-subtle text-center ${className ?? ""}`,
-		children: emptyMessage
-	});
-	if (rows.length === 0) return null;
-	if (layout === "cards") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: `space-y-2 ${scrolls ? `${maxBodyHeight} overflow-y-auto` : ""} ${className ?? ""}`,
-		children: displayRows.map((row, rowIndex) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DataTableCard, {
-			row,
-			rowIndex,
-			columns,
-			bordered,
-			onRowClick,
-			rowClassName
-		}, rowKey ? rowKey(row, rowIndex) : rowIndex))
-	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: [
-			"rounded-lg",
-			bordered ? "border border-border" : "",
-			"bg-surface overflow-x-auto",
-			scrolls ? `${maxBodyHeight} overflow-y-auto` : "",
-			className ?? ""
-		].filter(Boolean).join(" "),
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("table", {
-			className: `w-full text-xs ${scrolls ? "border-separate border-spacing-0" : ""}`,
-			style: { minWidth: `${minWidthPx}px` },
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("thead", {
-				className: "bg-surface",
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tr", { children: columns.map((col) => {
-					const align = col.align ?? "left";
-					const nowrap = col.nowrap ?? true;
-					const sortable = col.sortValue !== void 0;
-					const isSorted = activeSort !== null && activeSort.columnKey === col.key;
-					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("th", {
-						"aria-sort": sortable ? ariaSortForColumn(activeSort, col.key) : void 0,
-						title: sortable ? void 0 : col.notSortableReason,
-						className: [
-							"px-3 py-2 text-foreground-subtle font-medium bg-surface border-b border-border",
-							scrolls ? "sticky top-0 z-10" : "",
-							ALIGN_CLASS[align],
-							nowrap ? "whitespace-nowrap" : "",
-							col.width ?? ""
-						].filter(Boolean).join(" "),
-						children: sortable ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SortHeaderButton, {
-							label: col.headerRender ? col.headerRender() : col.header,
-							active: isSorted,
-							dir: isSorted && activeSort !== null ? activeSort.dir : "asc",
-							onSort: () => setSort((prev) => nextTableSort(prev, col.key))
-						}) : col.headerRender ? col.headerRender() : col.header
-					}, col.key);
-				}) })
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tbody", { children: displayRows.map((row, rowIndex) => {
-				const key = rowKey ? rowKey(row, rowIndex) : rowIndex;
-				const extra = rowClassName?.(row, rowIndex) ?? "";
-				const interactive = onRowClick !== void 0;
-				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("tr", {
-					onClick: interactive ? () => onRowClick(row, rowIndex) : void 0,
-					className: [interactive ? "cursor-pointer hover:bg-primary/5" : "hover:bg-primary/5", extra].filter(Boolean).join(" "),
-					children: columns.map((col) => {
-						const align = col.align ?? "left";
-						const nowrap = col.nowrap ?? true;
-						return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("td", {
-							className: [
-								"px-3 py-2 text-foreground border-b border-border",
-								ALIGN_CLASS[align],
-								nowrap ? "whitespace-nowrap" : ""
-							].filter(Boolean).join(" "),
-							children: col.render(row, rowIndex)
-						}, col.key);
-					})
-				}, key);
-			}) })]
-		})
-	});
+function ConfirmActionButton({ label, icon: Icon, title = "Confirm action", description, confirmLabel, triggerVariant = "outline", confirmVariant = "danger", size = "sm", disabled, className, action, onSuccess }) {
+	const [open, setOpen] = (0, react$1.useState)(false);
+	const [running, setRunning] = (0, react$1.useState)(false);
+	const [error, setError] = (0, react$1.useState)(null);
+	const handleConfirm = async () => {
+		setError(null);
+		setRunning(true);
+		try {
+			const result = await action();
+			onSuccess?.(result);
+			setOpen(false);
+		} catch (err) {
+			setError(err instanceof Error ? err.message : String(err));
+		} finally {
+			setRunning(false);
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
+		type: "button",
+		variant: triggerVariant,
+		size,
+		disabled,
+		onClick: () => {
+			setError(null);
+			setOpen(true);
+		},
+		className,
+		children: [Icon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { className: "h-3.5 w-3.5" }), label]
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Dialog, {
+		open,
+		onOpenChange: (next) => !running && setOpen(next),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DialogContent, { children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DialogHeader, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DialogTitle, {
+				className: "flex items-center gap-2",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TriangleAlert, { className: "h-4 w-4 text-amber-400" }), title]
+			}), typeof description === "string" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DialogDescription, { children: description }) : description] }),
+			error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: cn("mt-2 px-3 py-2 rounded border border-danger/40 bg-danger/10", "text-xs text-danger"),
+				children: error
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(DialogFooter, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Button, {
+				type: "button",
+				variant: "ghost",
+				size,
+				disabled: running,
+				onClick: () => setOpen(false),
+				children: "Cancel"
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
+				type: "button",
+				variant: confirmVariant,
+				size,
+				disabled: running,
+				onClick: () => {
+					handleConfirm();
+				},
+				children: [running && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LoaderCircle, { className: "h-3.5 w-3.5 animate-spin" }), confirmLabel ?? label]
+			})] })
+		] })
+	})] });
 }
+//#endregion
+//#region src/composites/copy-button.tsx
 /**
-* One row as a card. Columns that carry a plain-text `header` become labelled
-* `SettingRow`s — the label is the column title and the value gets the full
-* card width. Columns with no text header (an actions column, a
-* `headerRender`-only column) have no label to show, so they render as a
-* full-width strip at the foot of the card.
+* `CopyButton` — a compact button that copies a string `value` to the
+* clipboard via `navigator.clipboard.writeText`, showing a brief
+* "copied" check state. Addon-agnostic; used wherever a secret / URL
+* needs a one-click copy affordance (export setup panels, etc.).
 */
-function DataTableCard({ row, rowIndex, columns, bordered, onRowClick, rowClassName }) {
-	const labelled = columns.filter((col) => col.header !== void 0 && col.header !== "");
-	const unlabelled = columns.filter((col) => col.header === void 0 || col.header === "");
-	const interactive = onRowClick !== void 0;
-	const extra = rowClassName?.(row, rowIndex) ?? "";
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		"data-data-table-card": "",
-		onClick: interactive ? () => onRowClick(row, rowIndex) : void 0,
-		className: [
-			"rounded-lg bg-surface px-3 py-1.5 divide-y divide-border-subtle",
-			bordered ? "border border-border" : "",
-			interactive ? "cursor-pointer hover:bg-primary/5" : "",
-			extra
-		].filter(Boolean).join(" "),
-		children: [labelled.map((col) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettingRow, {
-			label: col.header,
-			children: col.render(row, rowIndex)
-		}, col.key)), unlabelled.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "flex flex-wrap items-center justify-end gap-2 py-1.5",
-			children: unlabelled.map((col) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: col.render(row, rowIndex) }, col.key))
-		})]
+var COPIED_RESET_MS = 2e3;
+function CopyButton({ value, label, srLabel, className, disabled }) {
+	const [copied, setCopied] = (0, react$1.useState)(false);
+	const handleCopy = (0, react$1.useCallback)(() => {
+		if (!value) return;
+		navigator.clipboard.writeText(value).then(() => {
+			setCopied(true);
+			setTimeout(() => setCopied(false), COPIED_RESET_MS);
+		});
+	}, [value]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Button, {
+		size: "sm",
+		variant: "ghost",
+		type: "button",
+		disabled: disabled || value.length === 0,
+		onClick: handleCopy,
+		className: cn(className),
+		"aria-label": copied ? "Copied" : `Copy ${srLabel ?? label ?? "value"}`,
+		children: [copied ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Check, { className: "h-3.5 w-3.5 text-success" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Copy, { className: "h-3.5 w-3.5" }), label ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "ml-1",
+			children: copied ? "Copied" : label
+		}) : null]
 	});
 }
 //#endregion
@@ -54174,30 +56100,6 @@ function DoorbellRecentPanel({ history, limit = 5, latestIsFresh, className }) {
 	});
 }
 //#endregion
-//#region src/composites/section-card.tsx
-function SectionCard({ headingId, title, icon: Icon, actions, testId, children }) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
-		"aria-labelledby": headingId,
-		className: SECTION_CARD,
-		"data-testid": testId,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
-			className: `${SECTION_HEADER} flex min-h-9 flex-wrap items-center gap-2`,
-			children: [
-				Icon !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, {
-					className: "h-3.5 w-3.5 shrink-0 text-foreground-subtle",
-					"aria-hidden": true
-				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
-					id: headingId,
-					className: `${TEXT_SECTION_LABEL} min-w-0 flex-1`,
-					children: title
-				}),
-				actions
-			]
-		}), children]
-	});
-}
-//#endregion
 //#region src/composites/filter-bar.tsx
 function FilterBar({ filters, values, onChange, className }) {
 	const isMobile = useIsMobile();
@@ -54710,26 +56612,6 @@ function KebabMenu({ items, header, triggerClassName, title = "More actions" })
 	});
 }
 //#endregion
-//#region src/composites/key-value-list.tsx
-/**
-* A `<dl>` of label/value rows. Layout (including the L1 stacking) is owned by
-* `SettingRow`; this composite only supplies the description-list semantics.
-*
-* The rows used to be `flex items-center h-7` with a `w-1/3` term, so a label
-* could neither wrap nor stack: on a phone it took a third of the width and
-* the value took whatever was left.
-*/
-function KeyValueList({ items, className }) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("dl", {
-		className: cn("flex flex-col", className),
-		children: items.map((item) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettingRow, {
-			elements: "description",
-			label: item.key,
-			children: item.value
-		}, item.key))
-	});
-}
-//#endregion
 //#region src/composites/mount-addon-page.tsx
 /**
 * mountAddonPage — one-liner to mount an addon page in dev mode.
@@ -58879,323 +60761,6 @@ function useStationaryOverlay(trpc, deviceId) {
 	return query.isError ? void 0 : query.data;
 }
 //#endregion
-//#region src/hooks/turn-server-cache.ts
-/** Short enough that rotated credentials are picked up promptly. */
-var DEFAULT_FRESH_TTL_MS = 5 * 6e4;
-/** Half of the shortest provider credential lifetime in the fleet (24 h). */
-var DEFAULT_STALE_CAP_MS = 720 * 6e4;
-var DEFAULT_STORAGE_KEY = "camstack:turn-servers:v1";
-function defaultStorage() {
-	const g = globalThis;
-	try {
-		return g.localStorage ?? null;
-	} catch {
-		return null;
-	}
-}
-/** Type guard for a persisted entry — storage content is external data. */
-function isCacheEntry(value) {
-	if (typeof value !== "object" || value === null) return false;
-	const v = value;
-	if (typeof v.fetchedAt !== "number" || !Array.isArray(v.servers)) return false;
-	return v.servers.every((s) => {
-		if (typeof s !== "object" || s === null) return false;
-		const srv = s;
-		if (!(typeof srv.urls === "string" || Array.isArray(srv.urls) && srv.urls.every((u) => typeof u === "string"))) return false;
-		if (srv.username !== void 0 && typeof srv.username !== "string") return false;
-		if (srv.credential !== void 0 && typeof srv.credential !== "string") return false;
-		return true;
-	});
-}
-var TurnServerCache = class {
-	freshTtlMs;
-	staleCapMs;
-	storage;
-	now;
-	storageKey;
-	/** Keyed on the caller's tRPC client object (stable per connected system). */
-	memory = /* @__PURE__ */ new WeakMap();
-	/** In-flight fetch per key — concurrent callers share one round trip. */
-	inflight = /* @__PURE__ */ new WeakMap();
-	constructor(options = {}) {
-		this.freshTtlMs = options.freshTtlMs ?? DEFAULT_FRESH_TTL_MS;
-		this.staleCapMs = options.staleCapMs ?? DEFAULT_STALE_CAP_MS;
-		this.storage = "storage" in options ? options.storage ?? null : defaultStorage();
-		this.now = options.now ?? (() => Date.now());
-		this.storageKey = options.storageKey ?? DEFAULT_STORAGE_KEY;
-	}
-	/**
-	* Resolve the ICE servers for `key`, fetching via `fetch` only when no
-	* fresh-enough entry exists. Never rejects: a failed fetch resolves to the
-	* stale entry when one exists, else `undefined`.
-	*/
-	async getOrFetch(key, fetch) {
-		const at = this.now();
-		const entry = this.memory.get(key) ?? this.readStorage();
-		if (entry) {
-			const age = at - entry.fetchedAt;
-			if (age < this.freshTtlMs) return entry.servers;
-			if (age < this.staleCapMs) {
-				this.startFetch(key, fetch, entry);
-				return entry.servers;
-			}
-		}
-		return this.startFetch(key, fetch, entry);
-	}
-	startFetch(key, fetch, stale) {
-		const pending = this.inflight.get(key);
-		if (pending) return pending;
-		const run = (async () => {
-			try {
-				const servers = await fetch();
-				if (servers.length > 0) {
-					const entry = {
-						servers,
-						fetchedAt: this.now()
-					};
-					this.memory.set(key, entry);
-					this.writeStorage(entry);
-				}
-				return servers;
-			} catch {
-				return stale?.servers;
-			}
-		})().finally(() => {
-			this.inflight.delete(key);
-		});
-		this.inflight.set(key, run);
-		return run;
-	}
-	readStorage() {
-		if (!this.storage) return void 0;
-		try {
-			const raw = this.storage.getItem(this.storageKey);
-			if (raw === null) return void 0;
-			const parsed = JSON.parse(raw);
-			return isCacheEntry(parsed) ? parsed : void 0;
-		} catch {
-			return;
-		}
-	}
-	writeStorage(entry) {
-		if (!this.storage) return;
-		try {
-			this.storage.setItem(this.storageKey, JSON.stringify(entry));
-		} catch {}
-	}
-};
-//#endregion
-//#region src/hooks/use-device-webrtc.ts
-/**
-* useDeviceWebrtc — WebRTC signaling hook for device-scoped streaming.
-*
-* Provides `createSession`, `sendAnswer`, `closeSession` callbacks and
-* a `streams` list (Adaptive + High/Mid/Low) for a given device.
-*
-* Works in both admin-ui (BackendClient.trpc) and addon pages
-* (AddonPageProps.trpc) — parametrized by a minimal tRPC proxy shape.
-*/
-/**
-* Hook that provides WebRTC signaling callbacks and stream choices for a device.
-*
-* @param trpc  - tRPC proxy (admin-ui BackendClient.trpc or addon page trpc)
-* @param deviceId - numeric device ID (null = disabled)
-* @param pollIntervalMs - how often to refresh profile slots (default: 5000)
-*/
-/** Module-level TURN/STUN credential cache. Keyed on the caller's trpc client
-*  object (stable per connected system — NOT on `trpc.turnProvider`, which is
-*  a proxy minted fresh on every property access), so two admin tabs pointed
-*  at different hubs never cross-serve credentials from the memory layer; the
-*  storage layer is per-origin, and the page's origin IS the hub. Coalesces
-*  concurrent fetches (the mount prefetch and the connect's own call used to
-*  race into TWO round trips) and persists across page loads so a fresh embed
-*  page — one per camera open on native — finds warm credentials instead of
-*  re-paying the measured 0.2–3.6 s serialized fetch. See turn-server-cache.ts. */
-var turnServersCache = new TurnServerCache();
-function useDeviceWebrtc(trpc, deviceId, pollIntervalMs = 5e3) {
-	const [remoteStreams, setRemoteStreams] = (0, react$1.useState)([]);
-	(0, react$1.useEffect)(() => {
-		if (deviceId === null) return;
-		let cancelled = false;
-		const fetch = () => {
-			trpc.webrtcSession.listStreams.query({ deviceId }).then((rows) => {
-				if (!cancelled) setRemoteStreams(rows);
-			}).catch(() => {});
-		};
-		fetch();
-		const iv = setInterval(fetch, pollIntervalMs);
-		return () => {
-			cancelled = true;
-			clearInterval(iv);
-		};
-	}, [
-		trpc,
-		deviceId,
-		pollIntervalMs
-	]);
-	const [pipelineMetrics, setPipelineMetrics] = (0, react$1.useState)(null);
-	(0, react$1.useEffect)(() => {
-		if (deviceId === null) return;
-		let cancelled = false;
-		if (trpc.pipelineOrchestrator) trpc.pipelineOrchestrator.getCameraMetrics.query({ deviceId }).then((m) => {
-			if (cancelled || !m) return;
-			setPipelineMetrics({
-				phase: m.phase,
-				detectionFps: m.actualFps,
-				avgInferenceMs: m.avgInferenceTimeMs,
-				droppedFrames: m.droppedFrames
-			});
-		}).catch(() => {});
-		return () => {
-			cancelled = true;
-		};
-	}, [trpc, deviceId]);
-	useLiveEvent("pipeline.camera-metrics-snapshot", (evt) => {
-		if (deviceId === null) return;
-		const payload = evt.data;
-		if (payload.deviceId !== deviceId || !payload.metrics) return;
-		setPipelineMetrics({
-			phase: payload.metrics.phase,
-			detectionFps: payload.metrics.actualFps,
-			avgInferenceMs: payload.metrics.avgInferenceTimeMs,
-			droppedFrames: payload.metrics.droppedFrames
-		});
-	});
-	const { streams, hasWebrtc } = (0, react$1.useMemo)(() => {
-		if (deviceId === null || remoteStreams.length === 0) return {
-			streams: [],
-			hasWebrtc: false
-		};
-		return {
-			streams: remoteStreams.map((r) => ({
-				id: r.id,
-				label: r.label,
-				target: r.target,
-				status: r.status,
-				inputFps: r.inputFps,
-				decodeFps: r.decodeFps,
-				bitrateKbps: r.bitrateKbps
-			})),
-			hasWebrtc: true
-		};
-	}, [deviceId, remoteStreams]);
-	const getIceServers = (0, react$1.useCallback)(async () => {
-		const provider = trpc.turnProvider;
-		if (!provider) return void 0;
-		return turnServersCache.getOrFetch(trpc, async () => {
-			return (await provider.getTurnServers.query()).map((s) => {
-				return {
-					urls: typeof s.urls === "string" ? s.urls : [...s.urls],
-					...s.username !== void 0 ? { username: s.username } : {},
-					...s.credential !== void 0 ? { credential: s.credential } : {}
-				};
-			});
-		});
-	}, [trpc]);
-	(0, react$1.useEffect)(() => {
-		getIceServers();
-	}, [getIceServers]);
-	const createSession = (0, react$1.useCallback)(async (target, hints) => {
-		if (deviceId === null) throw new Error("No device selected");
-		const res = await trpc.webrtcSession.createSession.mutate({
-			deviceId,
-			target,
-			hints
-		});
-		const iceServers = await getIceServers();
-		return {
-			sessionId: res.sessionId,
-			sdpOffer: res.sdpOffer,
-			...iceServers ? { iceServers } : {}
-		};
-	}, [
-		trpc,
-		deviceId,
-		getIceServers
-	]);
-	const handleOffer = (0, react$1.useCallback)(async (target, sdpOffer, sessionId, hints) => {
-		if (deviceId === null) throw new Error("No device selected");
-		return trpc.webrtcSession.handleOffer.mutate({
-			deviceId,
-			target,
-			sdpOffer,
-			...sessionId !== void 0 ? { sessionId } : {},
-			...hints !== void 0 ? { hints } : {}
-		});
-	}, [trpc, deviceId]);
-	const sendAnswer = (0, react$1.useCallback)(async (sessionId, sdpAnswer) => {
-		if (deviceId === null) throw new Error("No device selected");
-		await trpc.webrtcSession.handleAnswer.mutate({
-			deviceId,
-			sessionId,
-			sdpAnswer
-		});
-	}, [trpc, deviceId]);
-	return {
-		streams,
-		hasWebrtc,
-		pipelineMetrics,
-		createSession,
-		handleOffer,
-		getIceServers,
-		addIceCandidate: (0, react$1.useCallback)(async (sessionId, candidate) => {
-			if (deviceId === null) return;
-			await trpc.webrtcSession.addIceCandidate.mutate({
-				deviceId,
-				sessionId,
-				candidate: candidate.candidate ?? "",
-				sdpMid: candidate.sdpMid ?? null,
-				sdpMLineIndex: candidate.sdpMLineIndex ?? null
-			}).catch(() => {});
-		}, [trpc, deviceId]),
-		getIceCandidates: (0, react$1.useCallback)(async (sessionId) => {
-			if (deviceId === null) return {
-				candidates: [],
-				done: true
-			};
-			return trpc.webrtcSession.getIceCandidates.query({
-				deviceId,
-				sessionId
-			});
-		}, [trpc, deviceId]),
-		sendAnswer,
-		closeSession: (0, react$1.useCallback)(async (sessionId) => {
-			if (deviceId === null) return;
-			await trpc.webrtcSession.closeSession.mutate({
-				deviceId,
-				sessionId
-			}).catch(() => {});
-		}, [trpc, deviceId]),
-		getSessionState: (0, react$1.useCallback)(async (sessionId) => {
-			if (deviceId === null) return { pendingRenegotiation: null };
-			try {
-				return await trpc.webrtcSession.getSessionState.query({
-					deviceId,
-					sessionId
-				});
-			} catch {
-				return { pendingRenegotiation: null };
-			}
-		}, [trpc, deviceId]),
-		getSessionDebug: (0, react$1.useCallback)(async (sessionId) => {
-			if (deviceId === null) throw new Error("getSessionDebug: no device bound to this player");
-			return trpc.webrtcSession.getSessionDebug.query({
-				deviceId,
-				sessionId
-			});
-		}, [trpc, deviceId]),
-		applyDownlinkProbe: (0, react$1.useCallback)(async (sessionId, downlinkMbps) => {
-			const mutate = trpc.webrtcSession.applyDownlinkProbe;
-			if (deviceId === null || mutate === void 0) throw new Error("applyDownlinkProbe: not available for this player");
-			return mutate.mutate({
-				deviceId,
-				sessionId,
-				downlinkMbps
-			});
-		}, [trpc, deviceId])
-	};
-}
-//#endregion
 //#region src/hooks/use-doorbell-events.ts
 /**
 * useDoorbellEvents — subscribe to doorbell.onPressed across the cluster.
@@ -59584,6 +61149,8 @@ exports.DummyInline = DummyInline;
 exports.EMPTY_DATA_TABLE_FILTER = EMPTY_DATA_TABLE_FILTER;
 exports.EVENT_KIND_ICONS = EVENT_KIND_ICONS;
 exports.EmptyState = EmptyState;
+exports.EndpointResultsCard = EndpointResultsCard;
+exports.EndpointTestCard = EndpointTestCard;
 exports.ErrorBox = ErrorBox;
 exports.EventKindGlyph = EventKindGlyph;
 exports.EventStream = EventStream;
@@ -59608,8 +61175,10 @@ exports.Grid2x2 = Grid2x2;
 exports.GripTrack = GripTrack;
 exports.GroupedModelSelector = GroupedModelSelector;
 exports.HOST_WIDGETS = HOST_WIDGETS;
+exports.HUB_SESSION_RUN_MS = HUB_SESSION_RUN_MS;
 exports.HlsVideo = HlsVideo;
 exports.HoverZoomImage = HoverZoomImage;
+exports.HubSessionTestCard = HubSessionTestCard;
 exports.HumidifierHeroCard = HumidifierHeroCard;
 exports.HumidifierInlineControl = HumidifierInlineControl;
 exports.INPUT_COMPACT = INPUT_COMPACT;
@@ -59647,6 +61216,7 @@ exports.MobileDrawer = MobileDrawer;
 exports.ModelPicker = ModelPicker;
 exports.MotionZonesSettings = MotionZonesSettings;
 exports.NAVIGATION_DRIVE_INTERVAL_MS = NAVIGATION_DRIVE_INTERVAL_MS;
+exports.NatResultCard = NatResultCard;
 exports.NavigationPanel = NavigationPanel;
 exports.NetworkLinkBadge = NetworkLinkBadge;
 exports.NodeMultiSelectField = NodeMultiSelectField;
@@ -59699,6 +61269,7 @@ exports.ResponseLog = ResponseLog;
 exports.RoleDisplayDefaultsFromServer = RoleDisplayDefaultsFromServer;
 exports.RoleDisplayDefaultsProvider = RoleDisplayDefaultsProvider;
 exports.RotateCcw = RotateCcw;
+exports.RunReport = RunReport;
 exports.SCENE_CAPTURE_VARIANTS = SCENE_CAPTURE_VARIANTS;
 exports.SCENE_CAPTURE_VARIANTS$1 = SCENE_CAPTURE_VARIANTS;
 exports.SECTION_BODY = SECTION_BODY;
@@ -59794,15 +61365,19 @@ exports.applyPickerFilters = applyPickerFilters;
 exports.ariaSortForColumn = ariaSortForColumn;
 exports.badgeFor = badgeFor;
 exports.badgeFor$1 = badgeFor;
+exports.buildPeerConnectionConfig = buildPeerConnectionConfig;
 exports.buildStepTreeFromSchema = buildStepTreeFromSchema;
 exports.catalogHasDraft = catalogHasDraft;
 exports.childEntityId = childEntityId;
 exports.childListName = childListName;
 exports.chipOverflow = chipOverflow;
+exports.classifyAddressScope = classifyAddressScope;
 exports.classifyCapability = classifyCapability;
+exports.classifySessionVerdict = classifySessionVerdict;
 exports.clearPickerGroup = clearPickerGroup;
 exports.cn = cn;
 exports.columnsForContext = columnsForContext;
+exports.compareSrflxMappings = compareSrflxMappings;
 exports.containerChildToRef = containerChildToRef;
 exports.countableDevices = countableDevices;
 exports.coverHighlight = coverHighlight;
@@ -59830,12 +61405,14 @@ exports.deviceTypeMetaOf = deviceTypeMetaOf;
 exports.devicesToOptions = devicesToOptions;
 exports.draftFromQuery = draftFromQuery;
 exports.emptyDevicesWidens = emptyDevicesWidens;
+exports.emptySessionRun = emptySessionRun;
 exports.ensureMfHostInit = ensureMfHostInit;
 exports.eventKindLabel = eventKindLabel;
 exports.filterDataTableRows = filterDataTableRows;
 exports.filterDeviceOptions = filterDeviceOptions;
 exports.filterOptionSelectOptions = filterOptions;
 exports.filterPickerDevices = filterPickerDevices;
+exports.finalizeSessionRun = finalizeSessionRun;
 exports.findTimezone = _camstack_types.findTimezone;
 exports.flattenPickerGrouping = flattenPickerGrouping;
 exports.flattenPickerRows = flattenPickerRows;
@@ -59887,6 +61464,7 @@ exports.orphanDeviceLabel = orphanDeviceLabel;
 exports.overrideEntityIdFromLink = overrideEntityIdFromLink;
 exports.pageRows = pageRows;
 exports.parentDetailOf = parentDetailOf;
+exports.parseIceCandidate = parseIceCandidate;
 exports.parsePickerGroupBy = parsePickerGroupBy;
 exports.parseRecordedServerMessage = parseRecordedServerMessage;
 exports.partitionOptionSelectSelected = partitionSelected;
@@ -59902,8 +61480,10 @@ exports.pickerQueryTokens = pickerQueryTokens;
 exports.pickerRowFacts = pickerRowFacts;
 exports.pickerSearchText = pickerSearchText;
 exports.pickerZoneFilterSuspended = pickerZoneFilterSuspended;
+exports.pinnedStreamChoices = pinnedStreamChoices;
 exports.providerIcons = providerIcons;
 exports.readStoredGroupBy = readStoredGroupBy;
+exports.reduceSessionRun = reduceSessionRun;
 exports.resetHubMountForTests = resetHubMountForTests;
 exports.resetPickerFilters = resetPickerFilters;
 exports.resolveContainerPrimary = resolveContainerPrimary;
@@ -59944,6 +61524,7 @@ exports.statusLine$1 = statusLine;
 exports.stepHasModelForFormat = stepHasModelForFormat;
 exports.stepModelOptions = stepModelOptions;
 exports.stripParentNamePrefix = stripParentNamePrefix;
+exports.summarizeHubCandidates = summarizeHubCandidates;
 exports.tabForSelector = tabForSelector;
 exports.tankAlert = tankAlert;
 exports.themeToCss = require_theme_index.themeToCss$1;
@@ -60770,6 +62351,7 @@ exports.usePipelineOrchestratorSetAgentReachableHost = usePipelineOrchestratorSe
 exports.usePipelineOrchestratorSetCameraPipelineForAgent = usePipelineOrchestratorSetCameraPipelineForAgent;
 exports.usePipelineOrchestratorSetCameraSensors = usePipelineOrchestratorSetCameraSensors;
 exports.usePipelineOrchestratorSetCameraStepOverride = usePipelineOrchestratorSetCameraStepOverride;
+exports.usePipelineOrchestratorSetCameraStepSettings = usePipelineOrchestratorSetCameraStepSettings;
 exports.usePipelineOrchestratorSetCameraStepToggle = usePipelineOrchestratorSetCameraStepToggle;
 exports.usePipelineOrchestratorSetCameraSwitch = usePipelineOrchestratorSetCameraSwitch;
 exports.usePipelineOrchestratorSetCapabilityBinding = usePipelineOrchestratorSetCapabilityBinding;