@flemo/devtools 0.6.0 → 0.8.0

package/dist/react.mjs

@@ -9,7 +9,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 	"park",
 	"park-under",
 	"park-over"
-], b = (e) => `[${e}]`, x = (e, t) => `[${e}="${t}"]`, ee = 1e4, S = (e) => {
+], b = (e) => `[${e}]`, x = (e, t) => `[${e}="${t}"]`, S = 1e4, C = (e) => {
 	let t = [], { t0Ms: n, driver: r, frameSamples: i, longTasks: a, holdLongTasks: o, landing: s } = e, c = n + (e.releasedAtMs ?? 0);
 	if (i.released.over30Count > 0) {
 		let e = r === "compiled" ? " (compiled/compositor flights can still present cleanly through main-thread gaps)" : "";
@@ -18,29 +18,29 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 	for (let e of a) e.startMs <= c + 120 && e.startMs + e.durationMs >= c - 50 ? t.push(`long task ${Math.round(e.durationMs)}ms overlapped the visible-motion start (opening-swallow risk: the first presented frames of the transition may have been lost)`) : e.durationMs >= 100 && t.push(`long task ${Math.round(e.durationMs)}ms mid-flight`);
 	for (let e of o) e.durationMs >= 100 && t.push(`long task ${Math.round(e.durationMs)}ms absorbed by the hold (screen posed, not yet moving — the hold doing its job, not user-visible jank)`);
 	let { motion: l, images: u } = e;
-	l.holdReassertedAtMs !== null && t.push(`hold re-asserted ${l.holdReassertedAtMs}ms into the flight, after it had already released (an interleaved commit wrote the stale paused hold attribute over a running flight — the flemo 2026-08-18 release-race signature; the motion pauses while every timing metric stays clean)`), l.pausedAfterRelease && t.push("compiled animation reported playState=paused after its release (the flight was posed and then stopped mid-motion, not merely starved of frames)"), l.longestStallMs >= 48 && t.push(`motion stalled ${l.longestStallMs}ms mid-flight (${l.stalledFrames}/${l.sampledFrames} released frames advanced neither the animation clock nor the pose — freeze, or freeze-then-leap if the flight still landed on time)`), l.sampledFrames === 0 && e.releasedAtMs !== null && t.push("no released frames were sampled (the flight ended at or before its own hold release — the visible motion, if any, was never observed)"), u.completedUnheld > 0 && t.push(`${u.completedUnheld} image(s) finished loading mid-flight without a hold (${u.completedDuringFlight} completed, ${u.heldDuringFlight} held; ${u.loadingAtStart} were loading at t0, ${u.addedDuringFlight} arrived mid-flight) — each decode rasters on the moving layer and costs a present; this is the warm-side image-hold regression`), s.orphanedHolds.length > 0 && t.push(`hold markers left on the page at rest: ${s.orphanedHolds.join("; ")} (whatever they hide has no owner left to reveal it — the permanently-blank-avatar class)`), s.residualInlineTransforms.length > 0 && t.push(`residual inline style after COMPLETED: ${s.residualInlineTransforms.join("; ")} (landing cleanup failure — the landed scope belongs to the compiled rest rules)`), s.offViewportAtRest && t.push("screen resting at from-pose while COMPLETED+active (blank-viewport signature — the flemo PR #259 class: a residual pose left the landed screen parked off-viewport)"), s.stuckStatuses.length > 0 && t.push(`transitional status stuck >${ee / 1e3}s: ${s.stuckStatuses.join(", ")} (navigation queue lock or missed animationend — later navigations will be swallowed)`);
+	l.holdReassertedAtMs !== null && t.push(`hold re-asserted ${l.holdReassertedAtMs}ms into the flight, after it had already released (an interleaved commit wrote the stale paused hold attribute over a running flight — the flemo 2026-08-18 release-race signature; the motion pauses while every timing metric stays clean)`), l.pausedAfterRelease && t.push("compiled animation reported playState=paused after its release (the flight was posed and then stopped mid-motion, not merely starved of frames)"), l.longestStallMs >= 48 && t.push(`motion stalled ${l.longestStallMs}ms mid-flight (${l.stalledFrames}/${l.sampledFrames} released frames advanced neither the animation clock nor the pose — freeze, or freeze-then-leap if the flight still landed on time)`), l.sampledFrames === 0 && e.releasedAtMs !== null && t.push("no released frames were sampled (the flight ended at or before its own hold release — the visible motion, if any, was never observed)"), u.completedUnheld > 0 && t.push(`${u.completedUnheld} image(s) finished loading mid-flight without a hold (${u.completedDuringFlight} completed, ${u.heldDuringFlight} held; ${u.loadingAtStart} were loading at t0, ${u.addedDuringFlight} arrived mid-flight) — each decode rasters on the moving layer and costs a present; this is the warm-side image-hold regression`), s.orphanedHolds.length > 0 && t.push(`hold markers left on the page at rest: ${s.orphanedHolds.join("; ")} (whatever they hide has no owner left to reveal it — the permanently-blank-avatar class)`), s.residualInlineTransforms.length > 0 && t.push(`residual inline style after COMPLETED: ${s.residualInlineTransforms.join("; ")} (landing cleanup failure — the landed scope belongs to the compiled rest rules)`), s.offViewportAtRest && t.push("screen resting at from-pose while COMPLETED+active (blank-viewport signature — the flemo PR #259 class: a residual pose left the landed screen parked off-viewport)"), s.stuckStatuses.length > 0 && t.push(`transitional status stuck >${S / 1e3}s: ${s.stuckStatuses.join(", ")} (navigation queue lock or missed animationend — later navigations will be swallowed)`);
 	let { morphs: d, tripwires: f } = e;
 	for (let e of f) t.push(`tripwire ${e.kind} at +${e.atMs}ms: ${e.detail}`);
 	return d.skipped.length > 0 && t.push(`shared element(s) did not fly: ${d.skipped.join(", ")} (${d.pairable.length} pairable key(s), ${d.flew.length} flew) — both ends were registered on two different screens and neither was stamped with a flight role, so the pair was never made`), d.duplicatedKeys.length > 0 && t.push(`pairing key(s) used twice inside one screen: ${d.duplicatedKeys.join(", ")} (two ends under one screen are not a pair, so one of them can never fly — this is in the consuming app)`), d.strandedRoles > 0 && t.push(`${d.strandedRoles} morph element(s) still carry a flight role at rest (the stranded participant class: a role that outlives its flight stays in the layer and poisons the NEXT pairing, which is how one interrupted gesture turned into every later pop losing its camera)`), (d.strandedStandIns > 0 || d.strandedGhosts > 0 || d.layerResidue > 0) && t.push(`morph residue at rest: ${d.strandedStandIns} stand-in(s), ${d.strandedGhosts} ghost(s), ${d.layerResidue} element(s) left in a flight layer (a stand-in is a hole in the layout and a layer element is a corpse the next flight will pair against)`), d.leakedSheetRules > 0 && t.push(`${d.leakedSheetRules} morph keyframe rule(s) were left in the per-flight sheet (a flight that never landed keeps its keyframes; they accumulate for the life of the page)`), r === "unknown" && t.push("driver could not be classified (no running flemo-* CSSAnimation and no player inline-style signature observed — zero-duration flight, or the sampler attached after motion ended)"), t;
-}, C = (e) => {
+}, w = (e) => {
 	let t = [];
 	if (e.emulationSuspected) {
 		let n = /Win/i.test(e.platform) ? " (Windows touch hardware makes this signal ambiguous — confirm the DevTools device toolbar state)" : "";
 		t.push("DevTools device emulation suspected — the page composites to a rescaled surface, so visual reports from this session are untrustworthy; judge motion in a plain window or on a real device" + n);
 	}
-	return e.stuckFlightOpen && t.push(`a flight is still transitional after ${ee / 1e3}s — the navigation queue is likely locked; subsequent navigations will be ignored`), e.flightAnomalies.some((e) => e.some((e) => e.includes("blank-viewport"))) && t.push("at least one flight landed with the blank-viewport signature (see that flight's anomalies)"), t;
-}, w = [
+	return e.stuckFlightOpen && t.push(`a flight is still transitional after ${S / 1e3}s — the navigation queue is likely locked; subsequent navigations will be ignored`), e.flightAnomalies.some((e) => e.some((e) => e.includes("blank-viewport"))) && t.push("at least one flight landed with the blank-viewport signature (see that flight's anomalies)"), t;
+}, T = [
 	"macOS Chrome present-pipeline pacing: on 120Hz ProMotion displays Chrome can present frames unevenly even when rAF cadence and this report read perfectly clean (Chromium issues 40062488 / 345275139; proven with a no-script pure-CSS control page that still juddered). Not diagnosable or fixable from page code.",
 	"Display-hardware effects: local dimming, backlight modulation, and panel overdrive alter perceived motion and are invisible to every web API.",
 	"Compositor-internal present skips: a frame can be produced on time (clean rAF, clean player gaps) yet dropped or delayed inside the compositor's present queue; only platform tools (about:tracing, Instruments) see that layer.",
 	"DevTools device emulation composites the page to a rescaled surface: every in-page instrument reads the pre-scale surface and reports clean while the eye watches the post-scale one, so emulated sessions grow shimmer/flash artifacts that do not exist in a plain window or on a real device."
-], T = (e) => {
+], E = (e) => {
 	/* v8 ignore next -- unreachable: a group exists only because a flight was
 	put in it, so nothing ever asks for the median of nothing. */
 	if (e.length === 0) return 0;
 	let t = [...e].sort((e, t) => e - t);
 	return Math.round(t[Math.floor(t.length / 2)] * 10) / 10;
-}, te = (e) => {
+}, ee = (e) => {
 	let t = e.filter((e) => typeof e.bucket == "string");
 	if (t.length === 0) return [];
 	let n = /* @__PURE__ */ new Map();
@@ -51,31 +51,31 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 	return [...n.entries()].map(([e, t]) => ({
 		bucket: e,
 		flights: t.length,
-		medianDurationMs: T(t.map((e) => e.durationMs)),
-		medianReleasedGapMs: T(t.map((e) => e.frameSamples.released.medianGapMs)),
+		medianDurationMs: E(t.map((e) => e.durationMs)),
+		medianReleasedGapMs: E(t.map((e) => e.frameSamples.released.medianGapMs)),
 		worstReleasedGapMs: t.reduce((e, t) => Math.max(e, t.frameSamples.released.maxGapMs), 0),
 		longGapCount: t.reduce((e, t) => e + t.frameSamples.released.over30Count, 0),
 		anomalyCount: t.reduce((e, t) => e + t.anomalies.length, 0),
 		stalledFlights: t.filter((e) => e.motion.stalledFrames > 0).length
 	})).sort((e, t) => e.bucket.localeCompare(t.bucket));
-}, E = () => {
+}, D = () => {
 	if (typeof navigator > "u") return null;
 	let e = navigator.userAgentData;
 	return !e || !Array.isArray(e.brands) ? null : e.brands.map((e) => ({
 		brand: String(e.brand ?? ""),
 		version: String(e.version ?? "")
 	}));
-}, D = () => {
+}, O = () => {
 	if (typeof navigator > "u") return "unknown";
-	let e = E();
+	let e = D();
 	if (e?.some((e) => /Chromium/i.test(e.brand))) return "blink";
 	let t = navigator.userAgent ?? "";
 	return /Firefox|FxiOS/i.test(t) ? "gecko" : e || /AppleWebKit/i.test(t) && !/Chrome|Chromium|Android/i.test(t) ? "webkit" : /Android/i.test(t) ? "blink" : "unknown";
-}, O = () => {
-	if (typeof navigator > "u" || D() !== "blink") return !1;
+}, k = () => {
+	if (typeof navigator > "u" || O() !== "blink") return !1;
 	let e = navigator.platform ?? "";
 	return /Mac|Win|Linux/i.test(e) ? /Android/i.test(navigator.userAgent ?? "") && !/Mac|Win/i.test(e) ? /Linux (x86_64|i686)/i.test(e) : (navigator.maxTouchPoints ?? 0) > 0 : !1;
-}, k = (e = 20) => new Promise((t) => {
+}, A = (e = 20) => new Promise((t) => {
 	let n = Number.isFinite(e) ? Math.max(1, Math.floor(e)) : 20;
 	if (typeof requestAnimationFrame != "function" || typeof performance > "u") {
 		t({
@@ -97,7 +97,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		requestAnimationFrame(a);
 	};
 	requestAnimationFrame(a);
-}), A = [
+}), j = [
 	"__vite_plugin_react_preamble_installed__",
 	"__vite__",
 	"__NEXT_HMR_CB",
@@ -106,10 +106,10 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 	"webpackHotUpdate",
 	"__REACT_REFRESH_RUNTIME__",
 	"$RefreshReg$"
-], j = () => {
+], te = () => {
 	if (typeof window > "u") return [];
 	let e = [];
-	for (let t of A) try {
+	for (let t of j) try {
 		window[t] !== void 0 && e.push(t);
 	} catch {}
 	return e;
@@ -128,8 +128,8 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 	}
 	return {
 		userAgent: n?.userAgent ?? "",
-		uaBrands: E(),
-		engine: D(),
+		uaBrands: D(),
+		engine: O(),
 		platform: n?.platform ?? "",
 		maxTouchPoints: n?.maxTouchPoints ?? 0,
 		devicePixelRatio: r?.devicePixelRatio ?? 1,
@@ -145,8 +145,8 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		visualViewportScale: r?.visualViewport?.scale ?? null,
 		rafCadence: e,
 		reducedMotion: i,
-		developmentHints: j(),
-		emulationSuspected: O(),
+		developmentHints: te(),
+		emulationSuspected: k(),
 		observation: {
 			longTasks: M(),
 			elementAnimations: typeof Element < "u" && typeof Element.prototype.getAnimations == "function",
@@ -251,10 +251,10 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 			e.tracked.add(t), e.addedDuringFlight += 1;
 		}
 	}
-}, fe = (e, t) => {
+}, R = (e, t) => {
 	for (let n of t) for (let t of Array.from(n.querySelectorAll(`img[${a}]`))) e.held.add(t);
 	for (let t of e.tracked) t.hasAttribute("data-flemo-img-hold") && e.held.add(t);
-}, pe = (e) => {
+}, fe = (e) => {
 	let t = 0, n = 0;
 	for (let r of e.tracked) r.complete && (t += 1, e.held.has(r) || (n += 1));
 	return {
@@ -264,12 +264,12 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		heldDuringFlight: e.held.size,
 		completedUnheld: n
 	};
-}, me = [
+}, pe = [
 	"DevTools must be CLOSED while judging motion. An open inspector serializes requests and repaints its own panels on the same machine; the 2026-08 campaign's entire residual 'stutter' was this, and it is invisible to every in-page metric.",
 	"No screen recording or display capture while judging. A capture client forces WindowServer to composite every vsync, which SUPPRESSES the symptom — a capture that looks smooth proves nothing about the uncaptured session.",
 	"Judge with real input (a finger, a mouse). Synthetic dispatch — evaluate().click() and friends — never fires pointerdown, so it bypasses the swipe/gesture machinery that a real navigation goes through.",
 	"Establish the viewing configuration before believing any verdict: device emulation off, which physical display, its refresh rate and HiDPI scaling, Low Power Mode. Ask for a photo of the setup if it is not certain."
-], R = (e) => Math.round(e * 10) / 10, he = (e) => {
+], z = (e) => Math.round(e * 10) / 10, me = (e) => {
 	if (e.length === 0) return {
 		count: 0,
 		medianGapMs: 0,
@@ -279,11 +279,11 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 	let t = [...e].sort((e, t) => e - t);
 	return {
 		count: e.length,
-		medianGapMs: R(t[Math.floor(t.length / 2)]),
-		maxGapMs: R(t[t.length - 1]),
+		medianGapMs: z(t[Math.floor(t.length / 2)]),
+		maxGapMs: z(t[t.length - 1]),
 		over30Count: e.filter((e) => e >= 30).length
 	};
-}, ge = (e, t = []) => {
+}, he = (e, t = []) => {
 	let n = [...e, ...t];
 	return {
 		...n.length === 0 ? {
@@ -294,18 +294,18 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 			let e = [...n].sort((e, t) => e - t);
 			return {
 				count: n.length,
-				medianGapMs: R(e[Math.floor(e.length / 2)]),
-				maxGapMs: R(e[e.length - 1])
+				medianGapMs: z(e[Math.floor(e.length / 2)]),
+				maxGapMs: z(e[e.length - 1])
 			};
 		})(),
-		longGaps: n.filter((e) => e >= 30).map(R),
-		held: he(e),
-		released: he(t)
+		longGaps: n.filter((e) => e >= 30).map(z),
+		held: me(e),
+		released: me(t)
 	};
-}, _e = (e) => {
+}, ge = (e) => {
 	let t = e.inlineSuppression || e.inlineAdvance;
 	return t && e.compiledAnimation ? "mixed" : t ? "inline" : e.compiledAnimation ? "compiled" : "unknown";
-}, ve = (e) => e === "PUSHING" ? "PUSH" : e === "POPPING" ? "POP" : e === "REPLACING" ? "REPLACE" : null, ye = (e) => {
+}, _e = (e) => e === "PUSHING" ? "PUSH" : e === "POPPING" ? "POP" : e === "REPLACING" ? "REPLACE" : null, ve = (e) => {
 	let t = /^matrix3d\(([^)]+)\)$/.exec(e.trim());
 	if (t) {
 		let e = t[1].split(",").map((e) => Number(e.trim()));
@@ -317,7 +317,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		return e.length === 6 && Number.isFinite(e[4]) ? e[4] : null;
 	}
 	return null;
-}, be = (e) => {
+}, ye = (e) => {
 	if (e) return [];
 	let t = [];
 	for (let [e, n] of [[a, "image reveal hold"], [o, "arrival hold"]]) {
@@ -325,7 +325,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		r > 0 && t.push(`${r} × ${n} (${e}) still marked at rest`);
 	}
 	return t;
-}, xe = (e, t) => {
+}, be = (e, t) => {
 	let n = [], i = !1, a = window.visualViewport?.width ?? window.innerWidth ?? 0;
 	return e.forEach((e, t) => {
 		if (!(e instanceof HTMLElement) || !e.isConnected) return;
@@ -337,27 +337,27 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		if (s === "none") return;
 		let c = e.getAttribute(r) === "true", l = `screen[${t}]${c ? " (active)" : ""}`;
 		if (e.style.transform !== "" && e.style.transform !== "none" && n.push(`${l} transform=${e.style.transform}`), e.style.opacity !== "" && e.style.opacity !== "1" && n.push(`${l} opacity=${e.style.opacity}`), c && e.getAttribute("data-flemo-status") === "COMPLETED" && a > 0) {
-			let e = ye(o);
+			let e = ve(o);
 			e !== null && Math.abs(e) >= a * .5 && (i = !0);
 		}
 	}), {
 		residualInlineTransforms: n,
 		offViewportAtRest: i,
-		orphanedHolds: be(t)
+		orphanedHolds: ye(t)
 	};
-}, Se = g.map((e) => `[${u}="${e}"]`).join(","), Ce = b(t), we = (e) => Math.round(e * 10) / 10, z = (e) => {
+}, xe = g.map((e) => `[${u}="${e}"]`).join(","), Se = b(t), Ce = (e) => Math.round(e * 10) / 10, B = (e) => {
 	let t = e.getAttribute(d);
 	return t === null || t === "" ? null : t;
-}, Te = (e) => {
+}, we = (e) => {
 	let t = e.getAttribute(u);
 	return t !== null && g.includes(t);
-}, Ee = () => {
+}, Te = () => {
 	try {
 		return document.querySelector("style[data-flemo-morph-sheet]")?.sheet?.cssRules.length ?? 0;
 	} catch {
 		return 0;
 	}
-}, De = (e) => {
+}, Ee = (e) => {
 	let t = {
 		registered: 0,
 		pairable: /* @__PURE__ */ new Set(),
@@ -367,17 +367,17 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		ghosts: 0,
 		ghostBornAt: /* @__PURE__ */ new Map(),
 		shortestGhostLifeMs: null,
-		sheetRulesAtStart: Ee()
+		sheetRulesAtStart: Te()
 	}, n = new Set(e), r = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map();
 	for (let e of Array.from(document.querySelectorAll(b(u)))) {
 		t.registered += 1;
-		let a = z(e);
+		let a = B(e);
 		if (a === null) continue;
-		if (Te(e)) {
+		if (we(e)) {
 			t.flew.add(a);
 			continue;
 		}
-		let o = e.closest(Ce);
+		let o = e.closest(Se);
 		if (o !== null && !n.has(o)) continue;
 		let s = o, c = r.get(a);
 		c || r.set(a, c = /* @__PURE__ */ new Set()), c.add(s);
@@ -390,27 +390,27 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		r && [...r.values()].some((e) => e > 1) && t.duplicated.add(e);
 	}
 	return t;
-}, Oe = (e, t) => {
-	if (t.hasAttribute("data-flemo-morph-camera") && (e.camera = !0), !Te(t)) return;
-	let n = z(t);
+}, De = (e, t) => {
+	if (t.hasAttribute("data-flemo-morph-camera") && (e.camera = !0), !we(t)) return;
+	let n = B(t);
 	n !== null && e.flew.add(n);
-}, ke = (e, t, n) => {
-	for (let r of Array.from(t.addedNodes)) if (r instanceof Element) for (let t of Ae(r)) e.ghostBornAt.has(t) || (e.ghosts += 1, e.ghostBornAt.set(t, n));
-	for (let r of Array.from(t.removedNodes)) if (r instanceof Element) for (let t of Ae(r)) {
+}, Oe = (e, t, n) => {
+	for (let r of Array.from(t.addedNodes)) if (r instanceof Element) for (let t of ke(r)) e.ghostBornAt.has(t) || (e.ghosts += 1, e.ghostBornAt.set(t, n));
+	for (let r of Array.from(t.removedNodes)) if (r instanceof Element) for (let t of ke(r)) {
 		let r = e.ghostBornAt.get(t);
 		if (r === void 0) continue;
 		e.ghostBornAt.delete(t);
 		let i = n - r;
 		(e.shortestGhostLifeMs === null || i < e.shortestGhostLifeMs) && (e.shortestGhostLifeMs = i);
 	}
-}, Ae = (e) => [...e.hasAttribute("data-flemo-morph-ghost") ? [e] : [], ...Array.from(e.querySelectorAll(b(m)))], je = (e) => {
+}, ke = (e) => [...e.hasAttribute("data-flemo-morph-ghost") ? [e] : [], ...Array.from(e.querySelectorAll(b(m)))], Ae = (e) => {
 	let t = e.shortestGhostLifeMs;
 	return t === null || t >= 34 ? [] : [{
 		kind: "ghost-cut",
-		atMs: we(t),
-		detail: `a morph ghost was removed ${we(t)}ms after it was created (under one frame) — the departing content it stands for was never presented; this is the first-frame blade signature`
+		atMs: Ce(t),
+		detail: `a morph ghost was removed ${Ce(t)}ms after it was created (under one frame) — the departing content it stands for was never presented; this is the first-frame blade signature`
 	}];
-}, Me = (e, t) => {
+}, je = (e, t) => {
 	let n = [...e.pairable].sort(), r = [...e.flew].sort(), i = new Set(r), a = t ? {
 		strandedRoles: 0,
 		strandedStandIns: 0,
@@ -418,11 +418,11 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		layerResidue: 0,
 		leaked: 0
 	} : {
-		strandedRoles: document.querySelectorAll(Se).length,
+		strandedRoles: document.querySelectorAll(xe).length,
 		strandedStandIns: document.querySelectorAll(b(p)).length,
 		strandedGhosts: document.querySelectorAll(b(m)).length,
 		layerResidue: Array.from(document.querySelectorAll(b(f))).reduce((e, t) => e + t.childElementCount, 0),
-		leaked: Math.max(0, Ee() - e.sheetRulesAtStart)
+		leaked: Math.max(0, Te() - e.sheetRulesAtStart)
 	};
 	return {
 		registered: e.registered,
@@ -438,21 +438,19 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		layerResidue: a.layerResidue,
 		duplicatedKeys: [...e.duplicated].sort()
 	};
-}, Ne = "flemo:devtools-panel-height", Pe = [{
-	key: "flemo:devtools",
-	storage: "session",
-	kind: "opt-in-diagnostic",
-	values: "\"on\" / \"off\"",
-	fallback: "off",
-	effect: "arms this flight recorder in the playground (?devtools=on)"
-}, {
-	key: Ne,
+}, Me = "flemo:devtools-panel-height", Ne = [{
+	key: Me,
 	storage: "session",
 	kind: "production-state",
 	values: "a pixel height",
 	fallback: "(the panel's default height)",
 	effect: "the drawer height this panel was last dragged to"
-}], B = [
+}], V = [
+	{
+		key: "flemo:devtools",
+		storage: "session",
+		retiredWith: "the playground's opt-in. `<FlemoDevtools />` mounts unconditionally and a production build resolves it to the inert entry, so there is nothing to arm (2026-09-07)"
+	},
 	{
 		key: "flemo:sixty",
 		storage: "session",
@@ -573,53 +571,53 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		storage: "session",
 		retiredWith: "the Low Power Mode release-latency probe (2026-08-22)"
 	}
-], Fe = "(retired — the library no longer reads this)", Ie = (e) => {
+], Pe = "(retired — the library no longer reads this)", Fe = (e) => {
 	try {
 		let t = e === "session" ? sessionStorage : localStorage;
 		return t.length, t;
 	} catch {
 		return null;
 	}
-}, Le = (e, t) => {
+}, Ie = (e, t) => {
 	try {
 		return e ? e.getItem(t) : null;
 	} catch {
 		return null;
 	}
-}, Re = new Set(Pe.map((e) => e.key)), ze = new Set(B.map((e) => e.key)), Be = () => {
-	let e = {}, t = Ie("session"), n = Ie("local");
-	for (let r of Pe) {
-		let i = Le(r.storage === "session" ? t : n, r.key);
+}, Le = new Set(Ne.map((e) => e.key)), Re = new Set(V.map((e) => e.key)), ze = () => {
+	let e = {}, t = Fe("session"), n = Fe("local");
+	for (let r of Ne) {
+		let i = Ie(r.storage === "session" ? t : n, r.key);
 		i !== null && (e[r.key] = i);
 	}
-	for (let r of B) for (let [i, a] of [[t, "sessionStorage"], [n, "localStorage"]]) {
-		let t = Le(i, r.key);
-		t !== null && (e[`${r.key} (${a}) ${Fe}`] = t);
+	for (let r of V) for (let [i, a] of [[t, "sessionStorage"], [n, "localStorage"]]) {
+		let t = Ie(i, r.key);
+		t !== null && (e[`${r.key} (${a}) ${Pe}`] = t);
 	}
 	for (let [r, i] of [[t, "sessionStorage"], [n, "localStorage"]]) if (r) try {
 		for (let t = 0; t < r.length; t += 1) {
 			let n = r.key(t);
-			!n || !n.startsWith("flemo:") || Re.has(n) || ze.has(n) || (e[`${n} (${i}, unknown key)`] = r.getItem(n) ?? "");
+			!n || !n.startsWith("flemo:") || Le.has(n) || Re.has(n) || (e[`${n} (${i}, unknown key)`] = r.getItem(n) ?? "");
 		}
 	} catch {}
 	return e;
-}, Ve = (e) => {
+}, Be = (e) => {
 	let t = [];
 	for (let [n, r] of Object.entries(e)) if (n.includes("(retired — the library no longer reads this)")) {
-		let e = n.slice(0, n.indexOf(" (")), i = B.find((t) => t.key === e);
+		let e = n.slice(0, n.indexOf(" (")), i = V.find((t) => t.key === e);
 		t.push(`${n}=${r} — RETIRED residue: this key went with ${i?.retiredWith ?? "a removed feature"}. The library never reads it, so it cannot explain anything you are seeing. Safe to delete; it is listed only so it does not read as an unexplained lead.`);
 		continue;
 	}
 	return t;
-}, V = "flemo:devtools-trace", He = () => {
+}, H = "flemo:devtools-trace", Ve = () => {
 	try {
 		let e = sessionStorage;
 		return e.length, e;
 	} catch {
 		return null;
 	}
-}, Ue = (e, t) => {
-	let n = He();
+}, He = (e, t) => {
+	let n = Ve();
 	if (!n) return;
 	let r = e.slice(-10);
 	for (; r.length > 0;) {
@@ -630,23 +628,23 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		});
 		if (e.length <= 64e3) {
 			try {
-				n.setItem(V, e);
+				n.setItem(H, e);
 			} catch {}
 			return;
 		}
 		r = r.slice(1);
 	}
-	We();
-}, We = () => {
+	Ue();
+}, Ue = () => {
 	try {
-		He()?.removeItem(V);
+		Ve()?.removeItem(H);
 	} catch {}
-}, Ge = (e) => {
-	let t = He();
+}, We = (e) => {
+	let t = Ve();
 	if (!t) return null;
 	let n = null;
 	try {
-		n = t.getItem(V);
+		n = t.getItem(H);
 	} catch {
 		return null;
 	}
@@ -655,14 +653,14 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 	try {
 		r = JSON.parse(n);
 	} catch {
-		return We(), null;
+		return Ue(), null;
 	}
-	return !r || r.version !== e || !Array.isArray(r.flights) ? (We(), null) : {
+	return !r || r.version !== e || !Array.isArray(r.flights) ? (Ue(), null) : {
 		savedAt: typeof r.savedAt == "string" ? r.savedAt : "",
 		flights: r.flights,
 		note: "These flights were recorded by the page instance BEFORE the last full load. They are kept apart from the live ones because they may have come from a different build."
 	};
-}, Ke = 12, qe = 20, Je = 40, Ye = 500, Xe = 200, Ze = (e) => {
+}, Ge = 12, Ke = 20, qe = 40, Je = 500, Ye = 200, Xe = (e) => {
 	let t = e.rafCadence.medianGapMs;
 	if (t === null) return {
 		id: "display-cadence",
@@ -670,17 +668,17 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		detail: "the idle frame cadence could not be sampled, so the display's rate is unknown"
 	};
 	let n = { medianIdleFrameMs: t };
-	return t < Ke ? {
+	return t < Ge ? {
 		id: "display-cadence",
 		status: "ok",
 		detail: `idle frames arrive every ${t}ms — a display above 60Hz. Frame budgets in this report are still quoted against 60Hz (a gap of 30ms or more)`,
 		metrics: n
-	} : t <= qe ? {
+	} : t <= Ke ? {
 		id: "display-cadence",
 		status: "ok",
 		detail: `idle frames arrive every ${t}ms — a 60Hz clock`,
 		metrics: n
-	} : t <= Je ? {
+	} : t <= qe ? {
 		id: "display-cadence",
 		status: "violated",
 		detail: `idle frames arrive every ${t}ms — the page is being served roughly HALF rate. On iOS this is Low Power Mode, whose main-thread ceiling is ~30Hz while the compositor keeps 60: motion judged here is judged against a clock no transition can beat, and the ceiling is not a library defect. Turn it off, or judge elsewhere`,
@@ -691,7 +689,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		detail: `idle frames arrive every ${t}ms — the page is barely being served frames at all while idle. Something outside the transition owns this machine; no motion verdict taken here means anything`,
 		metrics: n
 	};
-}, Qe = (e) => {
+}, Ze = (e) => {
 	if (!e.environment.observation.longTasks) return {
 		id: "machine-idle",
 		status: "unknown",
@@ -702,7 +700,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		idleLongTaskMs: n,
 		worstIdleTaskMs: r
 	};
-	return n >= Ye || r >= Xe ? {
+	return n >= Je || r >= Ye ? {
 		id: "machine-idle",
 		status: "violated",
 		detail: `${t} long task(s) totalling ${n}ms ran while NO navigation was in flight (worst ${r}ms). Something else on this page or this machine was busy, and a motion verdict taken under someone else's load measures the load. A whole tremble campaign was invalidated by exactly this, with a build running in another window`,
@@ -713,7 +711,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		detail: `${t} idle long task(s), ${n}ms total — the page was quiet between navigations`,
 		metrics: i
 	};
-}, $e = (e) => {
+}, Qe = (e) => {
 	let { trusted: t, synthetic: n, pointerTypes: r } = e.input;
 	return n > 0 ? {
 		id: "real-input",
@@ -740,7 +738,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 			synthetic: n
 		}
 	};
-}, et = (e) => e.input.pointerTypes.includes("touch") ? {
+}, $e = (e) => e.input.pointerTypes.includes("touch") ? {
 	id: "touch-path",
 	status: "ok",
 	detail: "at least one navigation was driven by touch"
@@ -752,7 +750,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 	id: "touch-path",
 	status: "unknown",
 	detail: "no touch-driven navigation was recorded on a touch-capable device. The swipe and pointer-capture paths are only reached by a finger; a build that had broken them outright once passed every automated layer green because every probe used a mouse"
-}, tt = [
+}, et = [
 	{
 		id: "devtools-closed",
 		status: "unknown",
@@ -768,7 +766,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		status: "unknown",
 		detail: "which physical display this window is on, its refresh rate and scaling, cannot be read from the page. Establish it with the user before believing any verdict"
 	}
-], nt = (e) => {
+], tt = (e) => {
 	let { environment: t } = e, n = [];
 	return n.push(t.emulationSuspected ? {
 		id: "device-emulation",
@@ -778,7 +776,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		id: "device-emulation",
 		status: "ok",
 		detail: "no device-emulation signature on this session"
-	}), n.push(Ze(t)), n.push(e.documentHidden || e.wentHidden ? {
+	}), n.push(Xe(t)), n.push(e.documentHidden || e.wentHidden ? {
 		id: "page-foreground",
 		status: "violated",
 		detail: e.documentHidden ? "this document is HIDDEN right now — a backgrounded page is throttled to a fraction of its frames" : "this document was hidden at least once while recording; any flight that ran then was throttled"
@@ -786,7 +784,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		id: "page-foreground",
 		status: "ok",
 		detail: "the document stayed visible throughout"
-	}), n.push(Qe(e)), n.push(t.developmentHints.length > 0 ? {
+	}), n.push(Ze(e)), n.push(t.developmentHints.length > 0 ? {
 		id: "build-mode",
 		status: "violated",
 		detail: `development-server globals are present (${t.developmentHints.join(", ")}). A development build is a different program: unminified, double-invoking, and hot-reload instrumented. A day of ladder measurements once turned out to be measuring the build itself`
@@ -794,7 +792,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		id: "build-mode",
 		status: "unknown",
 		detail: "no development-server global was found. That is consistent with a production build but does not prove one — confirm how this page was built"
-	}), n.push($e(e)), n.push(et(e)), n.push(t.reducedMotion ? {
+	}), n.push(Qe(e)), n.push($e(e)), n.push(t.reducedMotion ? {
 		id: "reduced-motion",
 		status: "violated",
 		detail: "this session prefers reduced motion, so the transitions under test are being suppressed or shortened. Whatever is on screen is not the motion being judged"
@@ -802,8 +800,8 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		id: "reduced-motion",
 		status: "ok",
 		detail: "reduced motion is not requested"
-	}), [...n, ...tt];
-}, rt = 2e3, it = 40, at = (e) => Math.round(e * 10) / 10, ot = (e) => typeof e.animationName == "string" && e.animationName.startsWith("flemo-"), st = (e) => e instanceof Element ? `<${e.tagName.toLowerCase()}>${e.getAttribute("data-flemo-screen") === null ? "" : " (screen)"}` : "an unidentified node", ct = (e) => {
+	}), [...n, ...et];
+}, nt = 2e3, rt = 40, it = (e) => Math.round(e * 10) / 10, at = (e) => typeof e.animationName == "string" && e.animationName.startsWith("flemo-"), ot = (e) => e instanceof Element ? `<${e.tagName.toLowerCase()}>${e.getAttribute("data-flemo-screen") === null ? "" : " (screen)"}` : "an unidentified node", st = (e) => {
 	if (typeof document > "u") return {
 		detach: () => {},
 		sawAnimationEvent: () => !1,
@@ -814,18 +812,18 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		})
 	};
 	let t = [], n = !1, r = (t) => {
-		ot(t) && (n = !0, e.onAnimationStart(performance.now()));
+		at(t) && (n = !0, e.onAnimationStart(performance.now()));
 	}, i = (t) => {
-		ot(t) && (n = !0, e.onHit({
+		at(t) && (n = !0, e.onHit({
 			kind: "animation-cancel",
 			atMs: performance.now(),
-			detail: `${t.animationName} was CANCELLED on ${st(t.target)} — the element was re-parented, re-styled or removed mid-flight. A cancelled animation loses its start time, and whatever restarts it is free to overwrite the authored delay`
+			detail: `${t.animationName} was CANCELLED on ${ot(t.target)} — the element was re-parented, re-styled or removed mid-flight. A cancelled animation loses its start time, and whatever restarts it is free to overwrite the authored delay`
 		}));
 	}, a = (t) => {
-		ot(t) && (n = !0, t.elapsedTime === 0 && e.onHit({
+		at(t) && (n = !0, t.elapsedTime === 0 && e.onHit({
 			kind: "zero-length-animation-end",
 			atMs: performance.now(),
-			detail: `${t.animationName} reported animationend with elapsedTime 0 on ${st(t.target)} — the animation ended without ever running. Anything landing on this event lands before the motion it was waiting for`
+			detail: `${t.animationName} reported animationend with elapsedTime 0 on ${ot(t.target)} — the animation ended without ever running. Anything landing on this event lands before the motion it was waiting for`
 		}));
 	}, o = (e) => {
 		let n = e.pointerType ?? "";
@@ -833,7 +831,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 			atMs: performance.now(),
 			trusted: e.isTrusted === !0,
 			pointerType: n === "" ? e.type : n
-		}), t.length > it && t.splice(0, t.length - it);
+		}), t.length > rt && t.splice(0, t.length - rt);
 	}, s = {
 		capture: !0,
 		passive: !0
@@ -844,7 +842,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		},
 		sawAnimationEvent: () => n,
 		inputBetween: (e, n) => {
-			let r = e - rt, i = t.filter((e) => e.atMs >= r && e.atMs <= n), a = i.filter((e) => e.trusted).length, o = new Set(i.map((e) => e.pointerType));
+			let r = e - nt, i = t.filter((e) => e.atMs >= r && e.atMs <= n), a = i.filter((e) => e.trusted).length, o = new Set(i.map((e) => e.pointerType));
 			return {
 				trusted: a,
 				synthetic: i.length - a,
@@ -852,22 +850,22 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 			};
 		}
 	};
-}, lt = (e, t) => ({
+}, ct = (e, t) => ({
 	kind: e.kind,
-	atMs: at(e.atMs - t),
+	atMs: it(e.atMs - t),
 	detail: e.detail
-}), ut = (e) => {
+}), lt = (e) => {
 	/* v8 ignore next -- unreachable: deriveVerdict returns before this on an
 	empty flight list, so nothing ever asks for the median of nothing. */
 	if (e.length === 0) return 0;
 	let t = [...e].sort((e, t) => e - t);
 	return t[Math.floor(t.length / 2)];
-}, dt = (e) => {
+}, ut = (e) => {
 	let t = [], n = e.preconditions.filter((e) => e.status === "violated");
 	if (n.length > 0 && t.push(`NOT EVIDENCE: ${n.length} judging precondition(s) failed — ${n.map((e) => e.id).join(", ")}. Everything below was measured under those conditions; fix them and measure again before drawing a conclusion from it.`), e.flights.length === 0) return t.push("No flights were recorded. Either no navigation happened while the recorder was attached, or it attached after the one you meant to measure — the recorder only sees flights that start after it does."), t;
 	e.observation.animationEvents || t.push("The animation channel observed NOTHING across this whole session: not one flemo keyframe reported a start, an end or a cancel, though flights were recorded. Treat every animation-derived field here as unmeasured rather than as clean — a probe that never fires reads exactly like a page with nothing to report.");
 	let r = e.flights, i = r.reduce((e, t) => Math.max(e, t.frameSamples.released.maxGapMs), 0), a = r.filter((e) => e.anomalies.length > 0).length;
-	t.push(`${r.length} flight(s) recorded. Median duration ${ut(r.map((e) => e.durationMs))}ms, worst frame gap during visible motion ${i}ms, ${a} flight(s) carrying at least one anomaly.`);
+	t.push(`${r.length} flight(s) recorded. Median duration ${lt(r.map((e) => e.durationMs))}ms, worst frame gap during visible motion ${i}ms, ${a} flight(s) carrying at least one anomaly.`);
 	let o = r.filter((e) => e.motion.longestStallMs >= 48);
 	o.length > 0 && t.push(`${o.length} flight(s) STOPPED MOVING mid-flight (longest ${Math.max(...o.map((e) => e.motion.longestStallMs))}ms). Frames kept arriving; the picture did not change. Look at the hold and the animation's play state, not at the frame budget.`);
 	let s = r.filter((e) => e.morphs.skipped.length > 0);
@@ -883,7 +881,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		t.push(`${l.length} tripwire hit(s) across the session (${e.join(", ")}). These are one-frame events reported by the browser itself, not sampled — read the flights' \`tripwires\` arrays for the exact animations.`);
 	}
 	return r.filter((e) => e.frameSamples.released.over30Count > 0).length === 0 && a === 0 && n.length === 0 && t.push("No flight dropped a frame during visible motion (nothing at or over 30ms) and no anomaly fired. Under the preconditions above, this session is clean — what remains is in `blindSpots`, and none of it is reachable from page code."), t;
-}, H = new Set(v), ft = new Set(y), pt = b(t), mt = 2e3, ht = 1e3, gt = 4e3, U = (e) => Math.round(e * 10) / 10, _t = null, vt = () => ({
+}, U = new Set(v), dt = new Set(y), ft = b(t), pt = 2e3, mt = 1e3, ht = 4e3, W = (e) => Math.round(e * 10) / 10, gt = null, _t = () => ({
 	generatedAt: (/* @__PURE__ */ new Date()).toISOString(),
 	version: "3",
 	verdict: ["No DOM was available, so nothing could be observed. The recorder ran inert."],
@@ -900,30 +898,30 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 	comparison: [],
 	previousSession: null,
 	anomalies: [],
-	blindSpots: [...w],
-	judgingProtocol: [...me]
-}), yt = (e = {}) => {
-	if (_t) return _t;
+	blindSpots: [...T],
+	judgingProtocol: [...pe]
+}), vt = (e = {}) => {
+	if (gt) return gt;
 	if (typeof window > "u" || typeof document > "u") return {
 		detach: () => {},
-		report: vt,
+		report: _t,
 		mark: () => null
 	};
-	let t = e.maxFlights ?? 50, a = e.log ?? !1, o = e.installGlobal ?? !0, d = e.persist ?? !0, f = Be(), p = performance.now(), m = d ? Ge("3") : null, g = {
+	let t = e.maxFlights ?? 50, a = e.log ?? !1, o = e.installGlobal ?? !0, d = e.persist ?? !0, f = ze(), p = performance.now(), m = d ? We("3") : null, g = {
 		medianGapMs: null,
 		sampleCount: 0
 	};
-	k().then((e) => {
+	A().then((e) => {
 		g = e;
 	});
 	let _ = [], v = null;
 	try {
 		typeof PerformanceObserver < "u" && PerformanceObserver.supportedEntryTypes?.includes("longtask") && (v = new PerformanceObserver((e) => {
 			for (let t of e.getEntries()) _.push({
-				startMs: U(t.startTime),
-				durationMs: U(t.duration)
+				startMs: W(t.startTime),
+				durationMs: W(t.duration)
 			});
-			_.length > ht && _.splice(0, _.length - ht);
+			_.length > mt && _.splice(0, _.length - mt);
 		}), v.observe({
 			type: "longtask",
 			buffered: !0
@@ -931,59 +929,59 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 	} catch {
 		v = null;
 	}
-	let y = [], x = 0, T = null, E = null, D = [], O = !1, A = !1, j = document.visibilityState === "hidden", M = 0, re = () => Array.from(document.querySelectorAll(pt)).filter((e) => H.has(e.getAttribute("data-flemo-status") ?? "")), N = () => T !== null || re().length > 0, ie = (e) => {
-		let t = Array.from(document.querySelectorAll(b(l))).filter((e) => H.has(e.getAttribute("data-flemo-bar-status") ?? "") || e.getAttribute("data-flemo-bar-riding") === "true").length, n = Array.from(document.querySelectorAll(b(c))).filter((e) => H.has(e.getAttribute("data-flemo-status") ?? "")).length, r = Array.from(document.querySelectorAll(b(s))).filter((e) => H.has(e.getAttribute("data-flemo-status") ?? "")).length;
+	let y = [], x = 0, E = null, D = null, O = [], k = !1, j = !1, te = document.visibilityState === "hidden", M = 0, re = () => Array.from(document.querySelectorAll(ft)).filter((e) => U.has(e.getAttribute("data-flemo-status") ?? "")), N = () => E !== null || re().length > 0, ie = (e) => {
+		let t = Array.from(document.querySelectorAll(b(l))).filter((e) => U.has(e.getAttribute("data-flemo-bar-status") ?? "") || e.getAttribute("data-flemo-bar-riding") === "true").length, n = Array.from(document.querySelectorAll(b(c))).filter((e) => U.has(e.getAttribute("data-flemo-status") ?? "")).length, r = Array.from(document.querySelectorAll(b(s))).filter((e) => U.has(e.getAttribute("data-flemo-status") ?? "")).length;
 		return {
 			screens: e.length,
 			bars: t,
 			decorators: n,
 			parts: r
 		};
-	}, P = ct({
+	}, P = st({
 		onHit: (e) => {
-			let t = T;
-			t && t.tripwires.push(lt(e, t.t0Ms));
+			let t = E;
+			t && t.tripwires.push(ct(e, t.t0Ms));
 		},
 		onAnimationStart: (e) => {
-			let t = T;
-			!t || t.firstAnimationAtMs !== null || (t.firstAnimationAtMs = U(e - t.t0Ms));
+			let t = E;
+			!t || t.firstAnimationAtMs !== null || (t.firstAnimationAtMs = W(e - t.t0Ms));
 		}
 	}), F = (e) => {
 		let t = /* @__PURE__ */ new Set();
 		for (let n of e.elements) {
 			let e = n.getAttribute("data-flemo-status") ?? "";
-			H.has(e) && t.add(e);
+			U.has(e) && t.add(e);
 		}
 		return [...t];
 	}, I = () => {
-		let e = T;
-		if (!e || O) return;
+		let e = E;
+		if (!e || k) return;
 		let t = performance.now(), n = e.frames;
-		if (n.lastFrameAt !== null && n.heldGaps.length + n.releasedGaps.length < mt) {
+		if (n.lastFrameAt !== null && n.heldGaps.length + n.releasedGaps.length < pt) {
 			let r = t - n.lastFrameAt, i = oe(e.elements);
-			(i ? n.heldGaps : n.releasedGaps).push(r), i || (se(n, e.elements, r), n.releasedFrames === 1 && fe(e.images, e.elements));
+			(i ? n.heldGaps : n.releasedGaps).push(r), i || (se(n, e.elements, r), n.releasedFrames === 1 && R(e.images, e.elements));
 		}
 		if (n.lastFrameAt = t, ce(n, e.elements), t - e.t0Ms > 1e4) {
-			D = [...e.elements], be(t, F(e));
+			O = [...e.elements], ye(t, F(e));
 			return;
 		}
 		e.rafId = requestAnimationFrame(I);
 	}, ue = (e) => {
 		let t = performance.now();
 		x += 1;
-		let n = e.find((e) => e.getAttribute("data-flemo-active") === "true") ?? e[0], r = ve(n.getAttribute("data-flemo-status") ?? "") ?? "PUSH", a = null;
+		let n = e.find((e) => e.getAttribute("data-flemo-active") === "true") ?? e[0], r = _e(n.getAttribute("data-flemo-status") ?? "") ?? "PUSH", a = null;
 		for (let t of e) {
 			let e = t.getAttribute(i);
-			if (e !== null && ft.has(e)) {
+			if (e !== null && dt.has(e)) {
 				a = e;
 				break;
 			}
 		}
-		T = {
+		E = {
 			id: `flight-${x}`,
 			kind: r,
 			routerId: n.getAttribute("data-flemo-router") ?? void 0,
-			bucket: E,
+			bucket: D,
 			t0Ms: t,
 			t0Iso: (/* @__PURE__ */ new Date()).toISOString(),
 			elements: [...e],
@@ -993,60 +991,60 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 			firstAnimationAtMs: null,
 			frames: ae(),
 			images: de(e),
-			morphs: De(e),
+			morphs: Ee(e),
 			tripwires: [],
 			rafId: null
-		}, ce(T.frames, T.elements), T.rafId = requestAnimationFrame(I);
-	}, R = (e, t) => {
+		}, ce(E.frames, E.elements), E.rafId = requestAnimationFrame(I);
+	}, z = (e, t) => {
 		let n = 2, r = () => {
-			if (O) return;
+			if (k) return;
 			if (--n, n > 0) {
 				requestAnimationFrame(r);
 				return;
 			}
-			let i = xe(t, N());
+			let i = be(t, N());
 			e.landing.residualInlineTransforms = i.residualInlineTransforms, e.landing.offViewportAtRest = i.offViewportAtRest, e.landing.orphanedHolds = i.orphanedHolds;
 		};
 		requestAnimationFrame(r);
-	}, he = (e, t) => {
+	}, me = (e, t) => {
 		let n = 2, r = () => {
-			if (!O) {
+			if (!k) {
 				if (--n, n > 0) {
 					requestAnimationFrame(r);
 					return;
 				}
-				e.morphs = Me(t.morphs, N());
+				e.morphs = je(t.morphs, N());
 			}
 		};
 		requestAnimationFrame(r);
-	}, ye = (e, t, n, r) => ({
+	}, ve = (e, t, n, r) => ({
 		id: r ? `${e.id} (in flight)` : e.id,
 		...e.routerId === void 0 ? {} : { routerId: e.routerId },
 		...e.bucket === null ? {} : { bucket: e.bucket },
 		kind: e.kind,
 		t0: {
-			ms: U(e.t0Ms),
+			ms: W(e.t0Ms),
 			iso: e.t0Iso
 		},
 		t1: {
-			ms: U(t),
+			ms: W(t),
 			iso: (/* @__PURE__ */ new Date()).toISOString()
 		},
-		durationMs: U(t - e.t0Ms),
-		driver: _e(e.frames.evidence),
+		durationMs: W(t - e.t0Ms),
+		driver: ge(e.frames.evidence),
 		participants: e.participants,
 		holds: {
 			kind: e.holdKind,
 			releasedAtMs: e.holdReleasedAtMs
 		},
-		frameSamples: ge(e.frames.heldGaps, e.frames.releasedGaps),
+		frameSamples: he(e.frames.heldGaps, e.frames.releasedGaps),
 		motion: {
 			...le(e.frames),
 			firstAnimationAtMs: e.firstAnimationAtMs
 		},
-		images: pe(e.images),
-		morphs: Me(e.morphs, !0),
-		tripwires: [...e.tripwires, ...je(e.morphs)],
+		images: fe(e.images),
+		morphs: je(e.morphs, !0),
+		tripwires: [...e.tripwires, ...Ae(e.morphs)],
 		input: P.inputBetween(e.t0Ms, t),
 		longTasks: [],
 		holdLongTasks: [],
@@ -1057,51 +1055,51 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 			orphanedHolds: []
 		},
 		anomalies: []
-	}), be = (e, n) => {
-		let r = T;
+	}), ye = (e, n) => {
+		let r = E;
 		/* v8 ignore next -- unreachable: both callers hold a flight. sampleFrame
 		returns at its own top when `current` is null, and evaluate only calls
 		this inside `if (current && ...)`. The narrowing stays for the type. */
 		if (!r) return;
-		fe(r.images, r.elements), T = null, r.rafId !== null && cancelAnimationFrame(r.rafId);
-		let i = ye(r, e, n, !1);
-		y.push(i), y.length > t && y.splice(0, y.length - t), n.length === 0 && (R(i, r.elements), he(i, r)), a && console.info(`[flemo devtools] ${i.id} ${i.kind} driver=${i.driver} ${i.durationMs}ms screens=${i.participants.screens}`);
-	}, Se = (e) => {
-		let t = T;
+		R(r.images, r.elements), E = null, r.rafId !== null && cancelAnimationFrame(r.rafId);
+		let i = ve(r, e, n, !1);
+		y.push(i), y.length > t && y.splice(0, y.length - t), n.length === 0 && (z(i, r.elements), me(i, r)), a && console.info(`[flemo devtools] ${i.id} ${i.kind} driver=${i.driver} ${i.durationMs}ms screens=${i.participants.screens}`);
+	}, xe = (e) => {
+		let t = E;
 		if (!t || !(e.target instanceof Element)) return;
 		let n = e.target.getAttribute(i);
-		if (n !== null && ft.has(n) && t.holdKind === null && (t.holdKind = n), n !== null && ft.has(n) && t.holdReleasedAtMs !== null && t.frames.holdReassertedAtMs === null) {
-			let e = U(performance.now() - t.t0Ms);
+		if (n !== null && dt.has(n) && t.holdKind === null && (t.holdKind = n), n !== null && dt.has(n) && t.holdReleasedAtMs !== null && t.frames.holdReassertedAtMs === null) {
+			let e = W(performance.now() - t.t0Ms);
 			t.frames.holdReassertedAtMs = e, t.tripwires.push({
 				kind: "hold-reassert",
 				atMs: e,
 				detail: "an animation hold was re-asserted after this flight had already released it — the motion pauses here while every timing metric stays clean"
 			});
 		}
-		(n === "false" || n === null) && e.oldValue !== null && ft.has(e.oldValue) && t.holdReleasedAtMs === null && !oe(t.elements) && (t.holdReleasedAtMs = U(performance.now() - t.t0Ms));
-	}, Ce = () => {
+		(n === "false" || n === null) && e.oldValue !== null && dt.has(e.oldValue) && t.holdReleasedAtMs === null && !oe(t.elements) && (t.holdReleasedAtMs = W(performance.now() - t.t0Ms));
+	}, Se = () => {
 		let e = re();
-		if (D.length > 0) {
-			if (e.some((e) => D.includes(e))) return;
-			D = [];
+		if (O.length > 0) {
+			if (e.some((e) => O.includes(e))) return;
+			O = [];
 		}
-		if (!T && e.length > 0) {
+		if (!E && e.length > 0) {
 			ue(e);
 			return;
 		}
-		if (T && e.length === 0) {
-			be(performance.now(), []);
+		if (E && e.length === 0) {
+			ye(performance.now(), []);
 			return;
 		}
-		if (T) for (let t of e) T.elements.includes(t) || (T.elements.push(t), L(T.images, T.elements, t.querySelectorAll("img")), T.participants = ie(T.elements));
-	}, we = null, z = null, Te = () => {
+		if (E) for (let t of e) E.elements.includes(t) || (E.elements.push(t), L(E.images, E.elements, t.querySelectorAll("img")), E.participants = ie(E.elements));
+	}, Ce = null, B = null, we = () => {
 		let e = document.documentElement;
 		if (!e) return !1;
 		let t = new MutationObserver((e) => {
-			if (O) return;
+			if (k) return;
 			let t = performance.now();
-			for (let n of e) n.type === "attributes" ? n.attributeName === "data-flemo-anim-hold" ? Se(n) : T && (n.attributeName === "data-flemo-morph" || n.attributeName === "data-flemo-morph-camera") && n.target instanceof Element && Oe(T.morphs, n.target) : (T && ke(T.morphs, n, t), T && n.addedNodes.length > 0 && L(T.images, T.elements, n.addedNodes));
-			Ce();
+			for (let n of e) n.type === "attributes" ? n.attributeName === "data-flemo-anim-hold" ? xe(n) : E && (n.attributeName === "data-flemo-morph" || n.attributeName === "data-flemo-morph-camera") && n.target instanceof Element && De(E.morphs, n.target) : (E && Oe(E.morphs, n, t), E && n.addedNodes.length > 0 && L(E.images, E.elements, n.addedNodes));
+			Se();
 		});
 		try {
 			t.observe(e, {
@@ -1120,30 +1118,30 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		} catch {
 			return !1;
 		}
-		return we = t, Ce(), !0;
+		return Ce = t, Se(), !0;
 	};
-	if (!Te()) {
+	if (!we()) {
 		let e = () => {
-			z = null, O || Te();
+			B = null, k || we();
 		};
-		z = e, document.addEventListener("DOMContentLoaded", e, { once: !0 });
+		B = e, document.addEventListener("DOMContentLoaded", e, { once: !0 });
 	}
-	let Ee = () => {
-		document.visibilityState === "hidden" && (j = !0, d && T === null && Ue(y, "3"));
+	let Te = () => {
+		document.visibilityState === "hidden" && (te = !0, d && E === null && He(y, "3"));
 	};
-	document.addEventListener("visibilitychange", Ee);
-	let Ae = () => {
-		M = 0, !O && (T === null && Ue(y, "3"), M = window.setTimeout(Ae, gt));
+	document.addEventListener("visibilitychange", Te);
+	let ke = () => {
+		M = 0, !k && (E === null && He(y, "3"), M = window.setTimeout(ke, ht));
 	};
-	d && (M = window.setTimeout(Ae, gt));
-	let Ne = (e) => {
+	d && (M = window.setTimeout(ke, ht));
+	let Me = (e) => {
 		let t = _.filter((t) => t.startMs + t.durationMs >= e.t0.ms - 120 && t.startMs <= e.t1.ms), n = e.holds.kind === null ? e.t0.ms : e.holds.releasedAtMs === null ? e.t1.ms : e.t0.ms + e.holds.releasedAtMs;
 		return {
 			released: t.filter((e) => e.startMs + e.durationMs > n),
 			held: t.filter((e) => e.startMs + e.durationMs <= n)
 		};
-	}, Pe = (e) => _.filter((t) => t.startMs >= p && !e.some((e) => t.startMs + t.durationMs >= e.t0.ms && t.startMs <= e.t1.ms)), B = (e) => {
-		let t = Ne(e), n = {
+	}, Ne = (e) => _.filter((t) => t.startMs >= p && !e.some((e) => t.startMs + t.durationMs >= e.t0.ms && t.startMs <= e.t1.ms)), V = (e) => {
+		let t = Me(e), n = {
 			...e,
 			longTasks: t.released,
 			holdLongTasks: t.held,
@@ -1156,7 +1154,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 			morphs: { ...e.morphs },
 			tripwires: [...e.tripwires]
 		};
-		return n.anomalies = S({
+		return n.anomalies = C({
 			t0Ms: n.t0.ms,
 			t1Ms: n.t1.ms,
 			driver: n.driver,
@@ -1170,12 +1168,12 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 			morphs: n.morphs,
 			tripwires: n.tripwires
 		}), n;
-	}, Fe = () => {
-		let e = y.map(B), t = T;
+	}, Pe = () => {
+		let e = y.map(V), t = E;
 		if (!t) return e;
-		let n = performance.now(), r = n - t.t0Ms > ee;
-		return [...e, B(ye(t, n, r ? F(t) : [], !0))];
-	}, Ie = (e) => {
+		let n = performance.now(), r = n - t.t0Ms > S;
+		return [...e, V(ve(t, n, r ? F(t) : [], !0))];
+	}, Fe = (e) => {
 		let t = /* @__PURE__ */ new Set(), n = 0, r = 0;
 		for (let i of e) {
 			n += i.input.trusted, r += i.input.synthetic;
@@ -1186,21 +1184,21 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 			synthetic: r,
 			pointerTypes: [...t].sort()
 		};
-	}, Le = () => {
-		let e = Be(), t = { ...e };
+	}, Ie = () => {
+		let e = ze(), t = { ...e };
 		for (let [n, r] of Object.entries(f)) n in e || (t[`${n} (at attach, since cleared)`] = r);
-		let n = Ve(t), r = ne(g, P.sawAnimationEvent()), i = Fe(), a = T, o = nt({
+		let n = Be(t), r = ne(g, P.sawAnimationEvent()), i = Pe(), a = E, o = tt({
 			environment: r,
-			idleLongTasks: Pe(i),
+			idleLongTasks: Ne(i),
 			observedMs: performance.now() - p,
-			wentHidden: j,
+			wentHidden: te,
 			documentHidden: document.visibilityState === "hidden",
-			input: Ie(i)
+			input: Fe(i)
 		});
 		return {
 			generatedAt: (/* @__PURE__ */ new Date()).toISOString(),
 			version: "3",
-			verdict: dt({
+			verdict: ut({
 				preconditions: o,
 				flights: i,
 				observation: r.observation
@@ -1212,46 +1210,46 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 				warnings: n
 			},
 			flights: i,
-			comparison: te(i),
+			comparison: ee(i),
 			previousSession: m,
-			anomalies: C({
+			anomalies: w({
 				emulationSuspected: r.emulationSuspected,
 				platform: r.platform,
 				stuckFlightOpen: a !== null && performance.now() - a.t0Ms > 1e4,
 				flightAnomalies: i.map((e) => e.anomalies)
 			}),
-			blindSpots: [...w],
-			judgingProtocol: [...me]
+			blindSpots: [...T],
+			judgingProtocol: [...pe]
 		};
-	}, Re = (e) => (E = e === null || e === "" ? null : e, E), ze = () => {
-		if (!O) {
-			if (O = !0, we?.disconnect(), z !== null && (document.removeEventListener("DOMContentLoaded", z), z = null), document.removeEventListener("visibilitychange", Ee), P.detach(), v?.disconnect(), window.clearTimeout(M), M = 0, T?.rafId != null && cancelAnimationFrame(T.rafId), T = null, A) {
+	}, Le = (e) => (D = e === null || e === "" ? null : e, D), Re = () => {
+		if (!k) {
+			if (k = !0, Ce?.disconnect(), B !== null && (document.removeEventListener("DOMContentLoaded", B), B = null), document.removeEventListener("visibilitychange", Te), P.detach(), v?.disconnect(), window.clearTimeout(M), M = 0, E?.rafId != null && cancelAnimationFrame(E.rafId), E = null, j) {
 				let e = window;
 				e.flemo?.__flemoDevtools === !0 && delete e.flemo;
 			}
-			_t = null;
+			gt = null;
 		}
-	}, V = {
-		detach: ze,
-		report: Le,
-		mark: Re
+	}, H = {
+		detach: Re,
+		report: Ie,
+		mark: Le
 	};
 	if (o) {
 		let e = window, t = e.flemo;
 		(t === void 0 || t?.__flemoDevtools === !0) && (e.flemo = {
 			__flemoDevtools: !0,
-			report: Le,
-			flights: Fe,
-			mark: Re,
-			detach: ze
-		}, A = !0);
+			report: Ie,
+			flights: Pe,
+			mark: Le,
+			detach: Re
+		}, j = !0);
 	}
-	return _t = V, V;
-}, bt = v.map((e) => b(t) + x(n, e)).join(","), W = () => document.querySelector(bt) !== null, xt = (e) => {
+	return gt = H, H;
+}, yt = v.map((e) => b(t) + x(n, e)).join(","), G = () => document.querySelector(yt) !== null, bt = "\n:host {\n  all: initial;\n  color-scheme: dark;\n}\n* { box-sizing: border-box; }\n.root {\n  --bg: #14161a;\n  --bg-soft: #1b1e24;\n  --line: #2b3038;\n  --fg: #e6e9ef;\n  --fg-dim: #99a1b0;\n  --accent: #7cc4ff;\n  --warn: #ffb454;\n  --bad: #ff6b6b;\n  font: 12px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  color: var(--fg);\n}\n@media (prefers-color-scheme: light) {\n  .root {\n    --bg: #ffffff;\n    --bg-soft: #f4f6f9;\n    --line: #dde1e8;\n    --fg: #1a1d22;\n    --fg-dim: #5c6472;\n    --accent: #0b6bcb;\n    --warn: #a35a00;\n    --bad: #c2261f;\n  }\n}\n", xt = (e) => {
 	let t = document.createElement("div");
 	t.setAttribute(_, ""), t.style.position = "fixed", t.style.top = "0", t.style.left = "0", t.style.width = "0", t.style.height = "0", t.style.zIndex = "2147483000";
 	let n = t.attachShadow({ mode: "open" }), r = document.createElement("style");
-	r.textContent = e, n.appendChild(r);
+	r.textContent = bt + e, n.appendChild(r);
 	let i = document.createElement("div");
 	return i.className = "root", n.appendChild(i), {
 		host: t,
@@ -1271,71 +1269,95 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		},
 		ownsRecorder: !1
 	} : {
-		recorder: yt(),
+		recorder: vt(),
 		ownsRecorder: !0
 	};
-}, wt = 500, Tt = 450, Et = "\n:host { all: initial; }\n.root { all: initial; }\n.hud {\n  position: fixed;\n  left: 50%;\n  transform: translateX(-50%);\n  max-width: calc(100vw - 16px);\n  box-sizing: border-box;\n  padding: 6px 10px;\n  border-radius: 8px;\n  background: #0b0f14;\n  color: #e8f0f8;\n  border: 1px solid #2b3a4a;\n  font: 500 12px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  white-space: pre;\n  text-align: left;\n  overflow-x: auto;\n  -webkit-user-select: none;\n  user-select: none;\n  touch-action: manipulation;\n  /* No transition and no keyframe anywhere in this sheet: the readout must\n     never be a moving thing on a screen whose motion is under test. */\n}\n.hud[data-edge=\"top\"] { top: max(8px, env(safe-area-inset-top)); }\n.hud[data-edge=\"bottom\"] { bottom: max(8px, env(safe-area-inset-bottom)); }\n.hud[data-alarm=\"true\"] { border-color: #ff6b6b; color: #ffd9d9; }\n.hud[data-blocked=\"true\"] { border-color: #ffb020; color: #ffe9c2; }\n", G = (e) => Math.round(e * 10) / 10, Dt = (e) => {
+}, wt = 500, Tt = 450, Et = "flemo:devtools-hud-hidden", Dt = "\n.dock {\n  position: fixed;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  gap: 6px;\n  max-width: calc(100vw - 16px);\n}\n.dock[data-edge^=\"top\"] {\n  top: max(8px, env(safe-area-inset-top));\n  /* The control sits nearest the edge the dock is anchored to, whichever that\n     is, so it does not MOVE when the readout it hides collapses under it. A\n     control that walks across the screen as you use it is one you have to look\n     for, and the whole point of it is to be found with a thumb. */\n  flex-direction: column-reverse;\n}\n.dock[data-edge^=\"bottom\"] { bottom: max(12px, env(safe-area-inset-bottom)); }\n.dock[data-edge=\"top\"],\n.dock[data-edge=\"bottom\"] {\n  left: 50%;\n  transform: translateX(-50%);\n  align-items: center;\n}\n.dock[data-edge$=\"-left\"] {\n  left: max(12px, env(safe-area-inset-left));\n  align-items: flex-start;\n}\n.dock[data-edge$=\"-right\"] { right: max(12px, env(safe-area-inset-right)); }\n.hud {\n  max-width: 100%;\n  padding: 6px 10px;\n  border: 1px solid var(--line);\n  border-radius: 10px;\n  background: var(--bg);\n  color: var(--fg);\n  font-weight: 500;\n  white-space: pre;\n  text-align: left;\n  overflow-x: auto;\n  -webkit-user-select: none;\n  user-select: none;\n  touch-action: manipulation;\n  /* No transition and no keyframe anywhere in this sheet: the readout must\n     never be a moving thing on a screen whose motion is under test. */\n}\n.hud[hidden] { display: none; }\n.hud[data-alarm=\"true\"] { border-color: var(--bad); color: var(--bad); }\n.hud[data-blocked=\"true\"] { border-color: var(--warn); color: var(--warn); }\n/* The panel's toggle, in the opposite corner: same pill, same mark-and-chip,\n   so the two controls read as one instrument rather than two. */\n.eye {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  margin: 0;\n  padding: 6px 10px;\n  border: 1px solid var(--line);\n  border-radius: 999px;\n  background: var(--bg);\n  color: var(--fg);\n  font: inherit;\n  cursor: pointer;\n  -webkit-user-select: none;\n  user-select: none;\n  touch-action: manipulation;\n}\n.eye:hover { background: var(--bg-soft); }\n.mark { font-weight: 700; letter-spacing: 0.04em; }\n.state {\n  padding: 0 6px;\n  border-radius: 999px;\n  background: var(--bg-soft);\n  color: var(--fg-dim);\n}\n", K = (e) => Math.round(e * 10) / 10, Ot = (e) => {
 	if (!e) return "flemo  no flight yet";
 	let t = e.frameSamples?.released, n = e.anomalies?.length ?? 0;
-	return `${e.kind} ${Math.round(e.durationMs)}ms  gap ${G(t?.maxGapMs ?? 0)}  drop ${t?.over30Count ?? 0}` + (n > 0 ? `  !${n}` : "  ok") + (e.bucket ? `  [${e.bucket}]` : "");
-}, Ot = (e, t) => {
+	return `${e.kind} ${Math.round(e.durationMs)}ms  gap ${K(t?.maxGapMs ?? 0)}  drop ${t?.over30Count ?? 0}` + (n > 0 ? `  !${n}` : "  ok") + (e.bucket ? `  [${e.bucket}]` : "");
+}, kt = (e, t) => {
 	let n = [], r = (e?.preconditions ?? []).filter((e) => e.status === "violated");
-	if (r.length > 0 && n.push(`BLOCKED  ${r.map((e) => e.id).join(" ")}`), !t) return n.push(`rAF ${G(e?.environment?.rafCadence?.medianGapMs ?? 0)}ms`), n;
+	if (r.length > 0 && n.push(`BLOCKED  ${r.map((e) => e.id).join(" ")}`), !t) return n.push(`rAF ${K(e?.environment?.rafCadence?.medianGapMs ?? 0)}ms`), n;
 	let i = t.frameSamples;
-	n.push(`frames  n${i?.released?.count ?? 0} med ${G(i?.released?.medianGapMs ?? 0)} max ${G(i?.released?.maxGapMs ?? 0)}`), n.push(`motion  stall ${G(t.motion?.longestStallMs ?? 0)}ms tail ${t.motion?.tailFrames ?? 0} start +${t.motion?.firstAnimationAtMs ?? "?"}ms`), n.push(`hold    ${t.holds?.kind ?? "none"} rel ${t.holds?.releasedAtMs ?? "-"}ms  task ${t.longTasks?.length ?? 0}`);
+	n.push(`frames  n${i?.released?.count ?? 0} med ${K(i?.released?.medianGapMs ?? 0)} max ${K(i?.released?.maxGapMs ?? 0)}`), n.push(`motion  stall ${K(t.motion?.longestStallMs ?? 0)}ms tail ${t.motion?.tailFrames ?? 0} start +${t.motion?.firstAnimationAtMs ?? "?"}ms`), n.push(`hold    ${t.holds?.kind ?? "none"} rel ${t.holds?.releasedAtMs ?? "-"}ms  task ${t.longTasks?.length ?? 0}`);
 	let a = t.morphs;
 	a && (a.pairable.length > 0 || a.flew.length > 0) && n.push(`morph   ${a.flew.length} flew` + (a.camera ? " cam" : "") + (a.skipped.length > 0 ? `  SKIPPED ${a.skipped.length} (${a.skipped.join(",")})` : ""));
 	let o = t.input;
 	o && n.push(`input   ${o.pointerTypes.join("/") || "none"}` + (o.synthetic > 0 ? `  SYNTHETIC ${o.synthetic}` : ""));
 	for (let e of t.anomalies ?? []) n.push(`! ${e.slice(0, 120)}`);
 	return n;
-}, kt = null, At = (e = {}) => {
-	if (kt) return kt;
+}, At = () => {
+	try {
+		return sessionStorage.getItem(Et) === "1";
+	} catch {
+		return !1;
+	}
+}, jt = (e) => {
+	try {
+		sessionStorage.setItem(Et, e ? "1" : "0");
+	} catch {}
+}, Mt = null, Nt = (e = {}) => {
+	if (Mt) return Mt;
 	if (typeof document > "u") return { detach: () => {} };
-	let { recorder: t, ownsRecorder: n } = Ct(e.recorder), r = e.buckets && e.buckets.length > 0 ? e.buckets : ["A", "B"], { host: i, root: a } = xt(Et), o = document.createElement("div");
-	o.className = "hud", o.setAttribute("data-edge", e.position ?? "top"), o.setAttribute("role", "status"), o.textContent = "flemo  attaching", a.appendChild(o);
-	let s = !1, c = e.initialExpanded === !0, l = -1, u = 0, d = 0, f = !1, p = "", m = () => {
+	let { recorder: t, ownsRecorder: n } = Ct(e.recorder), r = e.buckets && e.buckets.length > 0 ? e.buckets : ["A", "B"], { host: i, root: a } = xt(Dt);
+	i.style.zIndex = "2147482998";
+	let o = document.createElement("div");
+	o.className = "dock", o.setAttribute("data-edge", e.position ?? "bottom-right");
+	let s = document.createElement("div");
+	s.className = "hud", s.setAttribute("role", "status"), s.textContent = "flemo  attaching";
+	let c = document.createElement("button");
+	c.className = "eye", c.type = "button";
+	let l = document.createElement("span");
+	l.className = "mark", l.textContent = "hud";
+	let u = document.createElement("span");
+	u.className = "state", c.appendChild(l), c.appendChild(u), o.appendChild(s), o.appendChild(c), a.appendChild(o);
+	let d = !1, f = e.initialExpanded === !0, p = e.initialHidden ?? At(), m = -1, h = 0, g = 0, _ = !1, v = "", y = () => {
 		try {
 			return t.report();
 		} catch {
 			return null;
 		}
-	}, h = () => {
-		if (s || W()) return;
-		let e = m(), t = e?.flights ?? [], n = t[t.length - 1], r = [Dt(n)];
-		c && r.push(...Ot(e, n));
-		let i = r.join("\n"), a = (e?.preconditions ?? []).some((e) => e.status === "violated"), l = (n?.anomalies?.length ?? 0) > 0;
-		i !== p && (p = i, o.textContent = i), o.setAttribute("data-alarm", l ? "true" : "false"), o.setAttribute("data-blocked", a ? "true" : "false");
-	}, g = () => {
-		u = 0, h(), u = window.setTimeout(g, wt);
-	}, _ = () => {
-		l = l + 1 >= r.length ? -1 : l + 1, t.mark(l === -1 ? null : r[l]), p = "", h();
+	}, b = () => {
+		if (d || p || G()) return;
+		let e = y(), t = e?.flights ?? [], n = t[t.length - 1], r = [Ot(n)];
+		f && r.push(...kt(e, n));
+		let i = r.join("\n"), a = (e?.preconditions ?? []).some((e) => e.status === "violated"), o = (n?.anomalies?.length ?? 0) > 0;
+		i !== v && (v = i, s.textContent = i), s.setAttribute("data-alarm", o ? "true" : "false"), s.setAttribute("data-blocked", a ? "true" : "false");
+	}, x = () => {
+		h = 0, b(), h = window.setTimeout(x, wt);
+	}, S = (e) => {
+		p = e, s.hidden = e, u.textContent = e ? "show" : "hide", c.setAttribute("data-hidden", e ? "true" : "false"), c.setAttribute("aria-label", e ? "show the flemo readout" : "hide the flemo readout"), c.setAttribute("aria-expanded", e ? "false" : "true"), window.clearTimeout(h), h = 0, !e && (v = "", b(), h = window.setTimeout(x, wt));
+	}, C = () => {
+		m = m + 1 >= r.length ? -1 : m + 1, t.mark(m === -1 ? null : r[m]), v = "", b();
 	};
-	o.addEventListener("pointerdown", () => {
-		f = !1, window.clearTimeout(d), d = window.setTimeout(() => {
-			f = !0, _();
+	s.addEventListener("pointerdown", () => {
+		_ = !1, window.clearTimeout(g), g = window.setTimeout(() => {
+			_ = !0, C();
 		}, Tt);
-	}), o.addEventListener("pointerup", () => {
-		window.clearTimeout(d), d = 0, !f && (c = !c, p = "", h());
-	}), o.addEventListener("pointercancel", () => window.clearTimeout(d));
-	let v = () => {
-		s || (s = !0, window.clearTimeout(u), u = 0, window.clearTimeout(d), d = 0, i.remove(), n && t.detach(), kt = null);
+	}), s.addEventListener("pointerup", () => {
+		window.clearTimeout(g), g = 0, !_ && (f = !f, v = "", b());
+	}), s.addEventListener("pointercancel", () => window.clearTimeout(g)), c.addEventListener("click", () => {
+		S(!p), jt(p);
+	});
+	let w = () => {
+		d || (d = !0, window.clearTimeout(h), h = 0, window.clearTimeout(g), g = 0, i.remove(), n && t.detach(), Mt = null);
 	};
-	document.body.appendChild(i), h(), u = window.setTimeout(g, wt);
-	let y = { detach: v };
-	return kt = y, y;
-}, jt = "http://www.w3.org/2000/svg", K = (e, t, n) => {
+	document.body.appendChild(i), S(p);
+	let T = { detach: w };
+	return Mt = T, T;
+}, Pt = "http://www.w3.org/2000/svg", q = (e, t, n) => {
 	let r = document.createElement(e);
 	return t !== void 0 && (r.className = t), n !== void 0 && (r.textContent = n), r;
-}, Mt = (e, t) => {
-	let n = document.createElementNS(jt, e);
+}, Ft = (e, t) => {
+	let n = document.createElementNS(Pt, e);
 	for (let [e, r] of Object.entries(t)) n.setAttribute(e, r);
 	return n;
-}, Nt = (e) => {
+}, It = (e) => {
 	for (; e.firstChild !== null;) e.removeChild(e.firstChild);
-}, q = (e, t) => {
+}, Lt = (e, t) => {
 	e.textContent !== t && (e.textContent = t);
-}, J = (e) => e == null || e === "" ? "—" : String(e), Y = (e) => typeof e == "number" && Number.isFinite(e) ? `${Math.round(e)}ms` : "—", Pt = (e) => typeof e == "number" && Number.isFinite(e) ? `${Math.round(e * 10) / 10}ms` : "—", X = (e) => typeof e == "number" && Number.isFinite(e) ? String(e) : "—", Ft = (e) => e === !0 ? "yes" : e === !1 ? "no" : "—", It = (e) => {
+}, J = (e) => e == null || e === "" ? "—" : String(e), Y = (e) => typeof e == "number" && Number.isFinite(e) ? `${Math.round(e)}ms` : "—", Rt = (e) => typeof e == "number" && Number.isFinite(e) ? `${Math.round(e * 10) / 10}ms` : "—", X = (e) => typeof e == "number" && Number.isFinite(e) ? String(e) : "—", zt = (e) => e === !0 ? "yes" : e === !1 ? "no" : "—", Bt = (e) => {
 	let t = e?.environment;
 	if (!t) return "—";
 	let n = t.viewport, r = n && typeof n.width == "number" && typeof n.height == "number" ? `${Math.round(n.width)}×${Math.round(n.height)}` : "—";
@@ -1343,65 +1365,65 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		J(t.engine),
 		`dpr ${J(t.devicePixelRatio)}`,
 		r,
-		`rAF ${Pt(t.rafCadence?.medianGapMs)}`
+		`rAF ${Rt(t.rafCadence?.medianGapMs)}`
 	].join(" · ");
-}, Lt = (e, t) => `${t ?? ""}#${e.map((e) => `${e?.id ?? ""}|${e?.kind ?? ""}|${e?.driver ?? ""}|${Math.round(e?.durationMs ?? 0)}|${e?.participants?.screens ?? 0}|${e?.anomalies?.length ?? 0}`).join(",")}`, Rt = (e) => {
+}, Vt = (e, t) => `${t ?? ""}#${e.map((e) => `${e?.id ?? ""}|${e?.kind ?? ""}|${e?.driver ?? ""}|${Math.round(e?.durationMs ?? 0)}|${e?.participants?.screens ?? 0}|${e?.anomalies?.length ?? 0}`).join(",")}`, Ht = (e) => {
 	let t = e?.released?.gaps;
 	if (!Array.isArray(t)) return null;
 	let n = t.filter((e) => typeof e == "number" && Number.isFinite(e));
 	return n.length >= 2 ? n : null;
-}, zt = "\n:host {\n  all: initial;\n  color-scheme: dark;\n}\n* { box-sizing: border-box; }\n.root {\n  --bg: #14161a;\n  --bg-soft: #1b1e24;\n  --line: #2b3038;\n  --fg: #e6e9ef;\n  --fg-dim: #99a1b0;\n  --accent: #7cc4ff;\n  --warn: #ffb454;\n  --bad: #ff6b6b;\n  font: 12px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;\n  color: var(--fg);\n}\n@media (prefers-color-scheme: light) {\n  .root {\n    --bg: #ffffff;\n    --bg-soft: #f4f6f9;\n    --line: #dde1e8;\n    --fg: #1a1d22;\n    --fg-dim: #5c6472;\n    --accent: #0b6bcb;\n    --warn: #a35a00;\n    --bad: #c2261f;\n  }\n}\n.toggle {\n  position: fixed;\n  bottom: 12px;\n  z-index: 2147483000;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  margin: 0;\n  padding: 6px 10px;\n  border: 1px solid var(--line);\n  border-radius: 999px;\n  background: var(--bg);\n  color: var(--fg);\n  font: inherit;\n  cursor: pointer;\n}\n.toggle:hover { background: var(--bg-soft); }\n.toggle[data-corner=\"bottom-right\"] { right: 12px; }\n.toggle[data-corner=\"bottom-left\"] { left: 12px; }\n.mark { font-weight: 700; letter-spacing: 0.04em; }\n.count {\n  padding: 0 6px;\n  border-radius: 999px;\n  background: var(--bg-soft);\n  color: var(--fg-dim);\n}\n.dot {\n  width: 7px;\n  height: 7px;\n  border-radius: 50%;\n  background: var(--bad);\n}\n.dot[hidden] { display: none; }\n.panel {\n  position: fixed;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: 2147482999;\n  display: flex;\n  flex-direction: column;\n  max-width: 100%;\n  border-top: 1px solid var(--line);\n  background: var(--bg);\n  overflow: hidden;\n}\n.panel[hidden] { display: none; }\n.grip {\n  flex: 0 0 6px;\n  height: 6px;\n  background: var(--line);\n  cursor: ns-resize;\n  touch-action: none;\n}\n.head {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 10px;\n  border-bottom: 1px solid var(--line);\n}\n.env { color: var(--fg-dim); }\n.spacer { flex: 1 1 auto; }\n.act {\n  padding: 4px 8px;\n  border: 1px solid var(--line);\n  border-radius: 4px;\n  background: var(--bg-soft);\n  color: var(--fg);\n  font: inherit;\n  cursor: pointer;\n}\n.chips {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  flex: 1 1 100%;\n}\n.chips:empty { display: none; }\n.chip {\n  padding: 2px 8px;\n  border: 1px solid var(--line);\n  border-radius: 999px;\n  background: var(--bg-soft);\n  color: var(--fg-dim);\n  max-width: 100%;\n  overflow-wrap: anywhere;\n}\n/* The verdict reads as prose, not as a tag: it is a sentence about the whole\n   session and it is the first thing anybody should read. */\n.chip.lead {\n  border-color: var(--fg);\n  color: var(--fg);\n  white-space: normal;\n  max-width: 100%;\n  line-height: 1.5;\n}\n.chip.warn { border-color: var(--warn); color: var(--warn); }\n.chip.bad { border-color: var(--bad); color: var(--bad); }\n.body {\n  display: flex;\n  flex: 1 1 auto;\n  min-height: 0;\n}\n.list {\n  flex: 0 0 40%;\n  max-width: 340px;\n  min-width: 180px;\n  overflow: auto;\n  border-right: 1px solid var(--line);\n}\n.row {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  width: 100%;\n  padding: 6px 10px;\n  border: 0;\n  border-bottom: 1px solid var(--line);\n  background: none;\n  color: var(--fg);\n  font: inherit;\n  text-align: left;\n  cursor: pointer;\n}\n.row[aria-selected=\"true\"] { background: var(--bg-soft); }\n.row .kind { font-weight: 700; }\n.row .driver { color: var(--accent); }\n.row .dur, .row .screens { color: var(--fg-dim); }\n.row .n {\n  margin-left: auto;\n  padding: 0 6px;\n  border-radius: 999px;\n  background: var(--bg-soft);\n  color: var(--fg-dim);\n}\n.row .n.bad { background: var(--bad); color: #fff; }\n.detail { flex: 1 1 auto; overflow: auto; padding: 8px 10px; }\n.section { margin: 0 0 10px; }\n.section > h2 {\n  margin: 0 0 4px;\n  font: inherit;\n  font-weight: 700;\n  color: var(--fg-dim);\n  text-transform: uppercase;\n  letter-spacing: 0.06em;\n}\n.kv { display: flex; gap: 8px; }\n.kv > .k { flex: 0 0 34%; max-width: 180px; color: var(--fg-dim); }\n.kv > .v { flex: 1 1 auto; overflow-wrap: anywhere; }\n/* A value that IS the finding — a stall, a re-asserted hold, an orphan. */\n.kv > .v.bad { color: var(--bad); }\n.li { overflow-wrap: anywhere; }\n.li.bad { color: var(--bad); }\n.dim { color: var(--fg-dim); }\n.spark { display: block; width: 100%; height: 28px; }\n.foot { border-top: 1px solid var(--line); padding: 6px 10px; color: var(--fg-dim); }\n.foot summary { cursor: pointer; }\n.foot .li { margin-top: 4px; }\n", Bt = 48, Z = (e, t, n, r) => {
-	let i = K("div", "kv");
-	i.appendChild(K("span", "k", t)), i.appendChild(K("span", r ? `v ${r}` : "v", n)), e.appendChild(i);
+}, Ut = "\n.toggle {\n  position: fixed;\n  bottom: 12px;\n  z-index: 2147483000;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  margin: 0;\n  padding: 6px 10px;\n  border: 1px solid var(--line);\n  border-radius: 999px;\n  background: var(--bg);\n  color: var(--fg);\n  font: inherit;\n  cursor: pointer;\n}\n.toggle:hover { background: var(--bg-soft); }\n.toggle[data-corner=\"bottom-right\"] { right: 12px; }\n.toggle[data-corner=\"bottom-left\"] { left: 12px; }\n.mark { font-weight: 700; letter-spacing: 0.04em; }\n.count {\n  padding: 0 6px;\n  border-radius: 999px;\n  background: var(--bg-soft);\n  color: var(--fg-dim);\n}\n.dot {\n  width: 7px;\n  height: 7px;\n  border-radius: 50%;\n  background: var(--bad);\n}\n.dot[hidden] { display: none; }\n.panel {\n  position: fixed;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: 2147482999;\n  display: flex;\n  flex-direction: column;\n  max-width: 100%;\n  border-top: 1px solid var(--line);\n  background: var(--bg);\n  overflow: hidden;\n}\n.panel[hidden] { display: none; }\n.grip {\n  flex: 0 0 6px;\n  height: 6px;\n  background: var(--line);\n  cursor: ns-resize;\n  touch-action: none;\n}\n.head {\n  display: flex;\n  flex-wrap: wrap;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 10px;\n  border-bottom: 1px solid var(--line);\n}\n.env { color: var(--fg-dim); }\n.spacer { flex: 1 1 auto; }\n.act {\n  padding: 4px 8px;\n  border: 1px solid var(--line);\n  border-radius: 4px;\n  background: var(--bg-soft);\n  color: var(--fg);\n  font: inherit;\n  cursor: pointer;\n}\n.chips {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px;\n  flex: 1 1 100%;\n}\n.chips:empty { display: none; }\n.chip {\n  padding: 2px 8px;\n  border: 1px solid var(--line);\n  border-radius: 999px;\n  background: var(--bg-soft);\n  color: var(--fg-dim);\n  max-width: 100%;\n  overflow-wrap: anywhere;\n}\n/* The verdict reads as prose, not as a tag: it is a sentence about the whole\n   session and it is the first thing anybody should read. */\n.chip.lead {\n  border-color: var(--fg);\n  color: var(--fg);\n  white-space: normal;\n  max-width: 100%;\n  line-height: 1.5;\n}\n.chip.warn { border-color: var(--warn); color: var(--warn); }\n.chip.bad { border-color: var(--bad); color: var(--bad); }\n.body {\n  display: flex;\n  flex: 1 1 auto;\n  min-height: 0;\n}\n.list {\n  flex: 0 0 40%;\n  max-width: 340px;\n  min-width: 180px;\n  overflow: auto;\n  border-right: 1px solid var(--line);\n}\n.row {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  width: 100%;\n  padding: 6px 10px;\n  border: 0;\n  border-bottom: 1px solid var(--line);\n  background: none;\n  color: var(--fg);\n  font: inherit;\n  text-align: left;\n  cursor: pointer;\n}\n.row[aria-selected=\"true\"] { background: var(--bg-soft); }\n.row .kind { font-weight: 700; }\n.row .driver { color: var(--accent); }\n.row .dur, .row .screens { color: var(--fg-dim); }\n.row .n {\n  margin-left: auto;\n  padding: 0 6px;\n  border-radius: 999px;\n  background: var(--bg-soft);\n  color: var(--fg-dim);\n}\n.row .n.bad { background: var(--bad); color: #fff; }\n.detail { flex: 1 1 auto; overflow: auto; padding: 8px 10px; }\n.section { margin: 0 0 10px; }\n.section > h2 {\n  margin: 0 0 4px;\n  font: inherit;\n  font-weight: 700;\n  color: var(--fg-dim);\n  text-transform: uppercase;\n  letter-spacing: 0.06em;\n}\n.kv { display: flex; gap: 8px; }\n.kv > .k { flex: 0 0 34%; max-width: 180px; color: var(--fg-dim); }\n.kv > .v { flex: 1 1 auto; overflow-wrap: anywhere; }\n/* A value that IS the finding — a stall, a re-asserted hold, an orphan. */\n.kv > .v.bad { color: var(--bad); }\n.li { overflow-wrap: anywhere; }\n.li.bad { color: var(--bad); }\n.dim { color: var(--fg-dim); }\n.spark { display: block; width: 100%; height: 28px; }\n.foot { border-top: 1px solid var(--line); padding: 6px 10px; color: var(--fg-dim); }\n.foot summary { cursor: pointer; }\n.foot .li { margin-top: 4px; }\n", Wt = 48, Z = (e, t, n, r) => {
+	let i = q("div", "kv");
+	i.appendChild(q("span", "k", t)), i.appendChild(q("span", r ? `v ${r}` : "v", n)), e.appendChild(i);
 }, Q = (e, t) => {
-	let n = K("section", "section");
-	return n.appendChild(K("h2", void 0, t)), e.appendChild(n), n;
+	let n = q("section", "section");
+	return n.appendChild(q("h2", void 0, t)), e.appendChild(n), n;
 }, $ = (e, t, n = "li") => {
-	e.appendChild(K("div", n, t));
-}, Vt = (e, t) => {
-	Nt(e);
-	for (let n of t?.verdict ?? []) e.appendChild(K("span", "chip lead", J(n)));
-	for (let n of t?.preconditions ?? []) n?.status === "violated" && e.appendChild(K("span", "chip bad", `${n.id}: ${J(n.detail)}`));
-	for (let n of t?.overrides?.warnings ?? []) e.appendChild(K("span", "chip warn", J(n)));
-	for (let n of t?.anomalies ?? []) e.appendChild(K("span", "chip bad", J(n)));
-	for (let [n, r] of Object.entries(t?.overrides?.active ?? {})) e.appendChild(K("span", "chip", `${n}=${String(r)}`));
-}, Ht = (e, t, n, r) => {
-	if (Nt(e), t.length === 0) {
+	e.appendChild(q("div", n, t));
+}, Gt = (e, t) => {
+	It(e);
+	for (let n of t?.verdict ?? []) e.appendChild(q("span", "chip lead", J(n)));
+	for (let n of t?.preconditions ?? []) n?.status === "violated" && e.appendChild(q("span", "chip bad", `${n.id}: ${J(n.detail)}`));
+	for (let n of t?.overrides?.warnings ?? []) e.appendChild(q("span", "chip warn", J(n)));
+	for (let n of t?.anomalies ?? []) e.appendChild(q("span", "chip bad", J(n)));
+	for (let [n, r] of Object.entries(t?.overrides?.active ?? {})) e.appendChild(q("span", "chip", `${n}=${String(r)}`));
+}, Kt = (e, t, n, r) => {
+	if (It(e), t.length === 0) {
 		$(e, "no flights recorded yet — navigate once", "li dim");
 		return;
 	}
 	for (let i = t.length - 1; i >= 0; --i) {
-		let a = t[i], o = J(a?.id), s = K("button", "row");
-		s.type = "button", s.setAttribute("data-flight-id", o), s.setAttribute("aria-selected", String(o === n)), s.appendChild(K("span", "kind", J(a?.kind))), s.appendChild(K("span", "driver", J(a?.driver))), s.appendChild(K("span", "dur", Y(a?.durationMs))), s.appendChild(K("span", "screens", `${X(a?.participants?.screens)} scr`));
+		let a = t[i], o = J(a?.id), s = q("button", "row");
+		s.type = "button", s.setAttribute("data-flight-id", o), s.setAttribute("aria-selected", String(o === n)), s.appendChild(q("span", "kind", J(a?.kind))), s.appendChild(q("span", "driver", J(a?.driver))), s.appendChild(q("span", "dur", Y(a?.durationMs))), s.appendChild(q("span", "screens", `${X(a?.participants?.screens)} scr`));
 		let c = a?.anomalies?.length ?? 0;
-		s.appendChild(K("span", c > 0 ? "n bad" : "n", String(c))), s.addEventListener("click", () => r(o)), e.appendChild(s);
+		s.appendChild(q("span", c > 0 ? "n bad" : "n", String(c))), s.addEventListener("click", () => r(o)), e.appendChild(s);
 	}
-}, Ut = (e, t, n) => {
+}, qt = (e, t, n) => {
 	if (!n) {
 		Z(e, t, "—");
 		return;
 	}
 	let r = [
 		`${X(n.count)} frames`,
-		`median ${Pt(n.medianGapMs)}`,
-		`max ${Pt(n.maxGapMs)}`
+		`median ${Rt(n.medianGapMs)}`,
+		`max ${Rt(n.maxGapMs)}`
 	];
 	typeof n.over30Count == "number" && r.push(`>30ms ×${n.over30Count}`), Z(e, t, r.join(" · "));
-}, Wt = (e) => {
-	let t = Math.max(...e), n = t > 0 ? t : 1, r = 100 / (e.length - 1), i = e.map((e, t) => `${Math.round(t * r * 10) / 10},${Math.round((27 - e / n * 26) * 10) / 10}`).join(" "), a = Mt("svg", {
+}, Jt = (e) => {
+	let t = Math.max(...e), n = t > 0 ? t : 1, r = 100 / (e.length - 1), i = e.map((e, t) => `${Math.round(t * r * 10) / 10},${Math.round((27 - e / n * 26) * 10) / 10}`).join(" "), a = Ft("svg", {
 		class: "spark",
 		viewBox: "0 0 100 28",
 		preserveAspectRatio: "none",
 		"aria-hidden": "true"
 	});
-	return a.appendChild(Mt("polyline", {
+	return a.appendChild(Ft("polyline", {
 		points: i,
 		fill: "none",
 		stroke: "currentColor",
 		"stroke-width": "1",
 		"vector-effect": "non-scaling-stroke"
 	})), a;
-}, Gt = (e, t) => {
+}, Yt = (e, t) => {
 	let n = t.longTasks ?? [], r = t.holdLongTasks ?? [];
 	if (n.length === 0 && r.length === 0) {
 		$(e, "none", "li dim");
@@ -1410,19 +1432,19 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 	let i = (e) => `${Y(e?.startMs)} + ${Y(e?.durationMs)}`;
 	for (let t of n) $(e, i(t), "li bad");
 	for (let t of r) $(e, `${i(t)} (absorbed by hold)`, "li dim");
-}, Kt = (e, t) => {
-	if (Nt(e), !t) {
+}, Xt = (e, t) => {
+	if (It(e), !t) {
 		$(e, "select a flight", "li dim");
 		return;
 	}
 	let n = Q(e, "timing");
 	Z(n, "id", J(t.id)), Z(n, "kind / driver", `${J(t.kind)} · ${J(t.driver)}`), Z(n, "router", J(t.routerId)), Z(n, "t0", J(t.t0?.iso)), Z(n, "duration", Y(t.durationMs)), Z(n, "participants", `${X(t.participants?.screens)} screens · ${X(t.participants?.bars)} bars · ${X(t.participants?.decorators)} decorators · ${X(t.participants?.parts)} parts`), Z(n, "hold", `${J(t.holds?.kind)} · released ${Y(t.holds?.releasedAtMs)}`);
 	let r = Q(e, "frames");
-	Ut(r, "held (absorbed)", t.frameSamples?.held), Ut(r, "released (visible)", t.frameSamples?.released);
-	let i = Rt(t.frameSamples);
-	i && r.appendChild(Wt(i));
+	qt(r, "held (absorbed)", t.frameSamples?.held), qt(r, "released (visible)", t.frameSamples?.released);
+	let i = Ht(t.frameSamples);
+	i && r.appendChild(Jt(i));
 	let a = Q(e, "motion (did it move)"), o = t.motion?.longestStallMs, s = t.motion?.holdReassertedAtMs;
-	Z(a, "released frames", X(t.motion?.sampledFrames)), Z(a, "stalled frames", X(t.motion?.stalledFrames), (t.motion?.stalledFrames ?? 0) > 0 ? "bad" : void 0), Z(a, "longest stall", Y(o), (o ?? 0) >= Bt ? "bad" : void 0), Z(a, "paused after release", Ft(t.motion?.pausedAfterRelease), t.motion?.pausedAfterRelease === !0 ? "bad" : void 0), Z(a, "hold re-asserted", s == null ? "no" : Y(s), typeof s == "number" ? "bad" : void 0), Z(a, "first animation", t.motion?.firstAnimationAtMs === null || t.motion?.firstAnimationAtMs === void 0 ? "not observed" : `+${Y(t.motion.firstAnimationAtMs)} after t0`);
+	Z(a, "released frames", X(t.motion?.sampledFrames)), Z(a, "stalled frames", X(t.motion?.stalledFrames), (t.motion?.stalledFrames ?? 0) > 0 ? "bad" : void 0), Z(a, "longest stall", Y(o), (o ?? 0) >= Wt ? "bad" : void 0), Z(a, "paused after release", zt(t.motion?.pausedAfterRelease), t.motion?.pausedAfterRelease === !0 ? "bad" : void 0), Z(a, "hold re-asserted", s == null ? "no" : Y(s), typeof s == "number" ? "bad" : void 0), Z(a, "first animation", t.motion?.firstAnimationAtMs === null || t.motion?.firstAnimationAtMs === void 0 ? "not observed" : `+${Y(t.motion.firstAnimationAtMs)} after t0`);
 	let c = t.morphs;
 	if (c) {
 		let t = Q(e, "shared elements");
@@ -1430,7 +1452,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		let n = c.skipped ?? [];
 		Z(t, "did not fly", n.length === 0 ? "none" : n.join(", "), n.length > 0 ? "bad" : void 0);
 		let r = c.duplicatedKeys ?? [];
-		r.length > 0 && Z(t, "duplicate keys in one screen", r.join(", "), "bad"), Z(t, "camera", Ft(c.camera)), Z(t, "ghosts", X(c.ghosts));
+		r.length > 0 && Z(t, "duplicate keys in one screen", r.join(", "), "bad"), Z(t, "camera", zt(c.camera)), Z(t, "ghosts", X(c.ghosts));
 		let i = (c.strandedRoles ?? 0) + (c.strandedStandIns ?? 0) + (c.strandedGhosts ?? 0) + (c.layerResidue ?? 0) + (c.leakedSheetRules ?? 0);
 		Z(t, "residue at rest", i === 0 ? "clean" : `${X(c.strandedRoles)} roles · ${X(c.strandedStandIns)} stand-ins · ${X(c.strandedGhosts)} ghosts · ${X(c.layerResidue)} in layer · ${X(c.leakedSheetRules)} rules`, i > 0 ? "bad" : void 0);
 	}
@@ -1445,11 +1467,11 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		Z(t, "input", `${X(u.trusted)} trusted · ${X(u.synthetic)} synthetic`, u.synthetic > 0 ? "bad" : void 0), Z(t, "pointer types", u.pointerTypes?.join(", ") || "none observed");
 	}
 	let d = Q(e, "images"), f = t.images?.completedDuringFlight ?? 0, p = t.images?.heldDuringFlight ?? 0, m = t.images?.completedUnheld, h = typeof m == "number" ? m > 0 : f > p;
-	Z(d, "loading at t0", X(t.images?.loadingAtStart)), Z(d, "added mid-flight", X(t.images?.addedDuringFlight)), Z(d, "completed mid-flight", X(t.images?.completedDuringFlight), h ? "bad" : void 0), Z(d, "held by the engine", X(t.images?.heldDuringFlight)), Z(d, "completed without hold", X(m), h ? "bad" : void 0), Gt(Q(e, "long tasks"), t);
+	Z(d, "loading at t0", X(t.images?.loadingAtStart)), Z(d, "added mid-flight", X(t.images?.addedDuringFlight)), Z(d, "completed mid-flight", X(t.images?.completedDuringFlight), h ? "bad" : void 0), Z(d, "held by the engine", X(t.images?.heldDuringFlight)), Z(d, "completed without hold", X(m), h ? "bad" : void 0), Yt(Q(e, "long tasks"), t);
 	let g = Q(e, "landing"), _ = t.landing?.residualInlineTransforms ?? [];
 	if (_.length === 0) Z(g, "inline residue", "clean");
 	else for (let e of _) Z(g, "inline residue", J(e));
-	Z(g, "off-viewport at rest", Ft(t.landing?.offViewportAtRest));
+	Z(g, "off-viewport at rest", zt(t.landing?.offViewportAtRest));
 	let v = t.landing?.stuckStatuses ?? [];
 	Z(g, "stuck statuses", v.length === 0 ? "none" : v.join(", "));
 	let y = t.landing?.orphanedHolds ?? [];
@@ -1461,39 +1483,39 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		return;
 	}
 	for (let e of x) $(b, J(e), "li bad");
-}, qt = (e, t) => {
-	Nt(e);
+}, Zt = (e, t) => {
+	It(e);
 	for (let n of t ?? []) $(e, J(n));
-}, Jt = 320, Yt = 2e3, Xt = 120, Zt = "Copy report JSON", Qt = () => {}, $t = null, en = (e = {}) => {
-	if ($t) return $t;
-	if (typeof document > "u") return { detach: Qt };
-	let { recorder: t, ownsRecorder: n } = Ct(e.recorder), { host: r, root: i } = xt(zt), a = K("button", "toggle");
+}, Qt = 320, $t = 2e3, en = 120, tn = "Copy report JSON", nn = () => {}, rn = null, an = (e = {}) => {
+	if (rn) return rn;
+	if (typeof document > "u") return { detach: nn };
+	let { recorder: t, ownsRecorder: n } = Ct(e.recorder), { host: r, root: i } = xt(Ut), a = q("button", "toggle");
 	a.type = "button", a.setAttribute("data-corner", e.position ?? "bottom-right"), a.setAttribute("aria-label", "flemo devtools");
-	let o = K("span", "count", "0"), s = K("span", "dot");
-	s.hidden = !0, a.appendChild(K("span", "mark", "flemo")), a.appendChild(o), a.appendChild(s);
-	let c = K("section", "panel");
+	let o = q("span", "count", "0"), s = q("span", "dot");
+	s.hidden = !0, a.appendChild(q("span", "mark", "flemo")), a.appendChild(o), a.appendChild(s);
+	let c = q("section", "panel");
 	c.hidden = !0;
-	let l = K("div", "grip");
+	let l = q("div", "grip");
 	l.setAttribute("role", "separator"), l.setAttribute("aria-label", "Resize flemo devtools panel");
-	let u = K("header", "head"), d = K("div", "env", "—"), f = K("button", "act", Zt);
+	let u = q("header", "head"), d = q("div", "env", "—"), f = q("button", "act", tn);
 	f.type = "button";
-	let p = K("button", "act", "Close");
+	let p = q("button", "act", "Close");
 	p.type = "button";
-	let m = K("button", "act", "Detach");
+	let m = q("button", "act", "Detach");
 	m.type = "button";
-	let h = K("button", "act", "A/B: off");
+	let h = q("button", "act", "A/B: off");
 	h.type = "button";
-	let g = K("div", "chips");
-	u.appendChild(d), u.appendChild(K("div", "spacer")), u.appendChild(h), u.appendChild(f), u.appendChild(p), u.appendChild(m), u.appendChild(g);
-	let _ = K("div", "body"), v = K("div", "list"), y = K("div", "detail");
+	let g = q("div", "chips");
+	u.appendChild(d), u.appendChild(q("div", "spacer")), u.appendChild(h), u.appendChild(f), u.appendChild(p), u.appendChild(m), u.appendChild(g);
+	let _ = q("div", "body"), v = q("div", "list"), y = q("div", "detail");
 	_.appendChild(v), _.appendChild(y);
-	let b = K("div", "foot"), x = K("details");
-	x.appendChild(K("summary", void 0, "What this cannot see"));
-	let ee = K("div");
-	x.appendChild(ee), b.appendChild(x), c.appendChild(l), c.appendChild(u), c.appendChild(_), c.appendChild(b), i.appendChild(a), i.appendChild(c);
-	let S = !1, C = e.initialOpen === !0, w = null, T = "", te = "", E = "", D = !1, O = 0, k = 0, A = -1, j = e.buckets && e.buckets.length > 0 ? e.buckets : ["A", "B"], M = (e) => Math.min(Math.max(e, Xt), Math.max(Xt, window.innerHeight * .9)), ne = () => {
+	let b = q("div", "foot"), x = q("details");
+	x.appendChild(q("summary", void 0, "What this cannot see"));
+	let S = q("div");
+	x.appendChild(S), b.appendChild(x), c.appendChild(l), c.appendChild(u), c.appendChild(_), c.appendChild(b), i.appendChild(a), i.appendChild(c);
+	let C = !1, w = e.initialOpen === !0, T = null, E = "", ee = "", D = "", O = !1, k = 0, A = 0, j = -1, te = e.buckets && e.buckets.length > 0 ? e.buckets : ["A", "B"], M = (e) => Math.min(Math.max(e, en), Math.max(en, window.innerHeight * .9)), ne = () => {
 		try {
-			let e = sessionStorage.getItem(Ne);
+			let e = sessionStorage.getItem(Me);
 			if (e === null) return null;
 			let t = Number.parseFloat(e);
 			return Number.isFinite(t) ? t : null;
@@ -1502,7 +1524,7 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 		}
 	}, re = (e) => {
 		try {
-			sessionStorage.setItem(Ne, String(Math.round(e)));
+			sessionStorage.setItem(Me, String(Math.round(e)));
 		} catch {}
 	}, N = M(ne() ?? window.innerHeight * .4);
 	c.style.height = `${Math.round(N)}px`;
@@ -1513,66 +1535,66 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 			return null;
 		}
 	}, ae = (e) => {
-		e !== w && (w = e, P());
+		e !== T && (T = e, P());
 	}, oe = () => {
 		let e = ie(), t = e?.flights ?? [];
-		q(o, String(t.length));
+		Lt(o, String(t.length));
 		let n = t.some((e) => (e?.anomalies?.length ?? 0) > 0);
-		if (s.hidden = !n, c.hidden = !C, !C) return;
-		q(d, It(e));
+		if (s.hidden = !n, c.hidden = !w, !w) return;
+		Lt(d, Bt(e));
 		let r = JSON.stringify([
 			e?.overrides?.warnings ?? [],
 			e?.anomalies ?? [],
 			e?.overrides?.active ?? {}
 		]);
-		r !== E && (E = r, Vt(g, e)), w === null && t.length > 0 && (w = t[t.length - 1]?.id ?? null);
-		let i = Lt(t, w);
-		i !== T && (T = i, Ht(v, t, w, ae));
-		let a = t.find((e) => e?.id === w) ?? null, l = JSON.stringify(a);
-		l !== te && (te = l, Kt(y, a)), D || (D = !0, qt(ee, e?.blindSpots));
+		r !== D && (D = r, Gt(g, e)), T === null && t.length > 0 && (T = t[t.length - 1]?.id ?? null);
+		let i = Vt(t, T);
+		i !== E && (E = i, Kt(v, t, T, ae));
+		let a = t.find((e) => e?.id === T) ?? null, l = JSON.stringify(a);
+		l !== ee && (ee = l, Xt(y, a)), O || (O = !0, Zt(S, e?.blindSpots));
 	};
 	function P() {
-		S || W() || oe();
+		C || G() || oe();
 	}
 	function se() {
-		O = 0, P(), F();
+		k = 0, P(), F();
 	}
 	function F() {
-		O = window.setTimeout(se, C ? Jt : Yt);
+		k = window.setTimeout(se, w ? Qt : $t);
 	}
 	let ce = () => {
-		window.clearTimeout(O), F();
+		window.clearTimeout(k), F();
 	}, le = (e) => {
-		C = e, ce(), P();
+		w = e, ce(), P();
 	};
-	a.addEventListener("click", () => le(!C)), p.addEventListener("click", () => le(!1)), m.addEventListener("click", () => pe()), h.addEventListener("click", () => {
-		A = A + 1 >= j.length ? -1 : A + 1;
-		let e = A === -1 ? null : j[A];
-		t.mark(e), q(h, `A/B: ${e ?? "off"}`), E = "", P();
+	a.addEventListener("click", () => le(!w)), p.addEventListener("click", () => le(!1)), m.addEventListener("click", () => fe()), h.addEventListener("click", () => {
+		j = j + 1 >= te.length ? -1 : j + 1;
+		let e = j === -1 ? null : te[j];
+		t.mark(e), Lt(h, `A/B: ${e ?? "off"}`), D = "", P();
 	});
 	let I = () => {
-		if (!S) {
-			if (W()) {
-				window.clearTimeout(k), k = window.setTimeout(I, Jt);
+		if (!C) {
+			if (G()) {
+				window.clearTimeout(A), A = window.setTimeout(I, Qt);
 				return;
 			}
-			q(f, "Copied ✓"), window.clearTimeout(k), k = window.setTimeout(ue, 1200);
+			Lt(f, "Copied ✓"), window.clearTimeout(A), A = window.setTimeout(ue, 1200);
 		}
 	};
 	function ue() {
-		if (W()) {
-			k = window.setTimeout(ue, Jt);
+		if (G()) {
+			A = window.setTimeout(ue, Qt);
 			return;
 		}
-		k = 0, q(f, Zt);
+		A = 0, Lt(f, tn);
 	}
 	let de = (e) => {
-		if (S) return;
-		if (W()) {
-			window.clearTimeout(k), k = window.setTimeout(() => de(e), Jt);
+		if (C) return;
+		if (G()) {
+			window.clearTimeout(A), A = window.setTimeout(() => de(e), Qt);
 			return;
 		}
-		let t = K("textarea");
+		let t = q("textarea");
 		t.value = e, t.setAttribute("aria-hidden", "true"), t.style.position = "fixed", t.style.opacity = "0", t.style.pointerEvents = "none", document.body.appendChild(t), t.select();
 		let n = document;
 		try {
@@ -1590,31 +1612,31 @@ var t = "data-flemo-screen", n = "data-flemo-status", r = "data-flemo-active", i
 	});
 	let L = (e) => {
 		N = M(window.innerHeight - e.clientY), c.style.height = `${Math.round(N)}px`;
-	}, fe = () => {
-		window.removeEventListener("pointermove", L), window.removeEventListener("pointerup", fe), re(N);
+	}, R = () => {
+		window.removeEventListener("pointermove", L), window.removeEventListener("pointerup", R), re(N);
 	};
 	l.addEventListener("pointerdown", (e) => {
-		e.preventDefault(), window.addEventListener("pointermove", L), window.addEventListener("pointerup", fe);
+		e.preventDefault(), window.addEventListener("pointermove", L), window.addEventListener("pointerup", R);
 	});
-	function pe() {
-		S || (S = !0, window.clearTimeout(O), O = 0, window.clearTimeout(k), k = 0, window.removeEventListener("pointermove", L), window.removeEventListener("pointerup", fe), r.remove(), n && t.detach(), $t = null);
+	function fe() {
+		C || (C = !0, window.clearTimeout(k), k = 0, window.clearTimeout(A), A = 0, window.removeEventListener("pointermove", L), window.removeEventListener("pointerup", R), r.remove(), n && t.detach(), rn = null);
 	}
 	document.body.appendChild(r), P(), F();
-	let me = { detach: pe };
-	return $t = me, me;
+	let pe = { detach: fe };
+	return rn = pe, pe;
 };
 //#endregion
 //#region src/react.ts
-function tn({ recorder: t, hud: n = !0, panel: r = !0, hudPosition: i = "top", panelPosition: a = "bottom-left", initialOpen: o = !1, buckets: s } = {}) {
+function on({ recorder: t, hud: n = !0, panel: r = !0, hudPosition: i = "bottom-right", panelPosition: a = "bottom-left", initialOpen: o = !1, buckets: s } = {}) {
 	let c = s?.join("\0");
 	return e(() => {
 		let e = [];
-		return r && e.push(en({
+		return r && e.push(an({
 			recorder: t,
 			position: a,
 			initialOpen: o,
 			buckets: s
-		}).detach), n && e.push(At({
+		}).detach), n && e.push(Nt({
 			recorder: t,
 			position: i,
 			buckets: s
@@ -1632,4 +1654,4 @@ function tn({ recorder: t, hud: n = !0, panel: r = !0, hudPosition: i = "top", p
 	]), null;
 }
 //#endregion
-export { tn as FlemoDevtools, tn as default };
+export { on as FlemoDevtools, on as default };