agent-relay-server 0.19.3 → 0.21.0

package/public/index.html

@@ -10136,6 +10136,37 @@ var persistImpl = (config, baseOptions) => (set, get, api) => {
 };
 var persist = persistImpl;
 //#endregion
+//#region ../sdk/src/sse.ts
+/**
+* Parse a single SSE frame — the text between blank-line (`\n\n`) separators —
+* into its event name, data lines, and optional retry hint. Spec-compliant
+* field parsing: normalises CRLF, skips comment (`:`-prefixed) lines, splits each
+* line at the first colon, and strips one leading space from the value.
+*/
+function parseSseFrame(frame) {
+	let event = "message";
+	const data = [];
+	let retry;
+	for (const rawLine of frame.replace(/\r\n/g, "\n").split("\n")) {
+		if (!rawLine || rawLine.startsWith(":")) continue;
+		const sep = rawLine.indexOf(":");
+		const field = sep >= 0 ? rawLine.slice(0, sep) : rawLine;
+		let value = sep >= 0 ? rawLine.slice(sep + 1) : "";
+		if (value.startsWith(" ")) value = value.slice(1);
+		if (field === "event") event = value;
+		else if (field === "data") data.push(value);
+		else if (field === "retry") {
+			const next = Number(value);
+			if (Number.isFinite(next) && next >= 1e3) retry = next;
+		}
+	}
+	return {
+		event,
+		data,
+		retry
+	};
+}
+//#endregion
 //#region src/lib/api.ts
 var authToken = "";
 function setAuthToken(token) {
@@ -10190,21 +10221,8 @@ function openRelayEventStream(token, handlers) {
 		reconnectTimer = setTimeout(connect, retryMs);
 	};
 	const dispatchFrame = (frame) => {
-		let event = "message";
-		const data = [];
-		for (const rawLine of frame.replace(/\r\n/g, "\n").split("\n")) {
-			if (!rawLine || rawLine.startsWith(":")) continue;
-			const separator = rawLine.indexOf(":");
-			const field = separator >= 0 ? rawLine.slice(0, separator) : rawLine;
-			let value = separator >= 0 ? rawLine.slice(separator + 1) : "";
-			if (value.startsWith(" ")) value = value.slice(1);
-			if (field === "event") event = value;
-			else if (field === "data") data.push(value);
-			else if (field === "retry") {
-				const nextRetry = Number(value);
-				if (Number.isFinite(nextRetry) && nextRetry >= 1e3) retryMs = nextRetry;
-			}
-		}
+		const { event, data, retry } = parseSseFrame(frame);
+		if (retry) retryMs = retry;
 		if (data.length > 0) handlers.message(event, data.join("\n"));
 	};
 	const connect = async () => {
@@ -10330,25 +10348,27 @@ async function apiBlob(path) {
 	return response.blob();
 }
 //#endregion
-//#region src/lib/voice.ts
+//#region ../sdk/src/speech-text.ts
 /**
-* Browser voice I/O for chat.
+* Shared text → speech preparation, imported by both the dashboard
+* (`dashboard/src/lib/voice.ts`) and the voice connector
+* (`connectors/voice/src/text.ts`). Single source of truth — these rules used to
+* live duplicated in both places and drifted.
 *
-* TTS (output) is 100% browser-native via the Web Speech API — the store
-* already receives every agent response turn, so there is no backend round-trip.
-* STT (input) records the mic and posts the clip to the voice connector's
-* whisper endpoint through the relay proxy (single-origin, auth-gated).
+* Two stages, applied in order by {@link prepareForSpeech}:
+*  1. {@link speechify} — collapse markdown/code structure into prose worth hearing.
+*  2. {@link normalizeForSpeech} — rule-based normalization of inline tokens
+*     (numbers, units, symbols, code identifiers, paths) so the speech engine
+*     reads them naturally.
 *
-* Speaker policy ("active chat owns the speaker"):
-*  - One utterance at a time. Disabled => silent.
-*  - Only the active chat speaks, and only responses that arrive while it is
-*    active (no backlog replay).
-*  - Switching away lets the current utterance finish but drops the now-background
-*    chat's queued + future responses.
-*  - The active chat preempts: if it speaks while a previous chat's audio lingers,
-*    that audio is cancelled.
+* Why both, and why here: the server-side Kokoro engine (agent-speech) already
+* normalizes some of this internally (number ranges, decimals, currency) via its
+* phonemizer — but that normalization does NOT run for the browser Web Speech
+* fallback, and the dashboard's own sentence splitter trips on decimals before
+* the engine ever sees them. Normalizing here fixes the browser path and protects
+* the splitter; feeding already-normalized text to Kokoro is harmless (idempotent).
 */
-/** Collapse markdown/code into something worth hearing (mirrors the connector's text.ts). */
+/** Collapse markdown/code into something worth hearing. */
 function speechify(markdown) {
 	if (!markdown) return "";
 	let text = markdown.replace(/\r\n/g, "\n");
@@ -10357,6 +10377,7 @@ function speechify(markdown) {
 		return ` code block, ${lines} ${lines === 1 ? "line" : "lines"}. `;
 	});
 	text = text.replace(/```[^\n]*/g, " code block. ");
+	text = collapseTables(text);
 	text = text.replace(/^#{1,6}\s+/gm, "");
 	text = text.replace(/^\s*[-*+]\s+/gm, ". ");
 	text = text.replace(/^\s*\d+\.\s+/gm, ". ");
@@ -10368,6 +10389,127 @@ function speechify(markdown) {
 	text = text.replace(/\s*\.\s*\.\s*(\.\s*)+/g, ". ");
 	return text.trim();
 }
+/** A markdown table row: `| a | b |` or `a | b`. The separator row is `|---|:-:|`. */
+function isTableRow(line) {
+	return /\|/.test(line) && line.trim().length > 0;
+}
+function isTableSeparator(line) {
+	return /^\s*\|?\s*:?-{2,}:?\s*(\|\s*:?-{2,}:?\s*)+\|?\s*$/.test(line);
+}
+function tableCells(line) {
+	return line.trim().replace(/^\||\|$/g, "").split("|").map((c) => c.trim()).filter((c) => c.length > 0);
+}
+/**
+* Replace contiguous markdown tables with a spoken summary
+* ("table with columns A, B, C; N rows.") rather than reading pipes and cells.
+*/
+function collapseTables(text) {
+	const lines = text.split("\n");
+	const out = [];
+	let i = 0;
+	while (i < lines.length) {
+		if (isTableRow(lines[i]) && i + 1 < lines.length && isTableSeparator(lines[i + 1])) {
+			const headers = tableCells(lines[i]);
+			let j = i + 2;
+			let rows = 0;
+			while (j < lines.length && isTableRow(lines[j]) && !isTableSeparator(lines[j])) {
+				rows++;
+				j++;
+			}
+			const cols = headers.length ? `with columns ${headers.join(", ")}` : "";
+			const rowText = `${rows} ${rows === 1 ? "row" : "rows"}`;
+			out.push(`table ${cols ? `${cols}, ` : ""}${rowText}.`.replace(/\s+/g, " ").trim());
+			i = j;
+			continue;
+		}
+		out.push(lines[i]);
+		i++;
+	}
+	return out.join("\n");
+}
+var UNIT_WORDS = {
+	ms: "milliseconds",
+	s: "seconds",
+	kb: "kilobytes",
+	mb: "megabytes",
+	gb: "gigabytes",
+	tb: "terabytes"
+};
+/** Spell out a fractional part digit-by-digit: "14" → "1 4" (so "3.14" → "3 point 1 4"). */
+function spaceDigits(frac) {
+	return frac.split("").join(" ");
+}
+/**
+* Ordered normalization rules. ORDER IS LOAD-BEARING:
+*  - URLs/paths first, before anything mangles their slashes/dots.
+*  - `~` → "approximately" before number rules consume the digits after it.
+*  - number ranges ("5-7") before unit expansion, so the unit attaches once: "5 to 7 seconds".
+*  - decimals before unit expansion and before the sentence splitter sees the dot.
+*  - unit expansion last among the number rules.
+*/
+var SPEECH_RULES = [
+	{
+		name: "url",
+		pattern: /\bhttps?:\/\/\S+/gi,
+		replace: " link "
+	},
+	{
+		name: "path",
+		pattern: /(?:\/[A-Za-z0-9._-]+){2,}\/?/g,
+		replace: (m) => " " + m.replace(/[/._-]+/g, " ").trim() + " "
+	},
+	{
+		name: "func-call",
+		pattern: /\b([A-Za-z_$][\w$]*)\(\)/g,
+		replace: "$1"
+	},
+	{
+		name: "approx",
+		pattern: /~(?=\s*[\d.])/g,
+		replace: "approximately "
+	},
+	{
+		name: "range",
+		pattern: /(\d)\s*[-–—]\s*(?=\d)/g,
+		replace: "$1 to "
+	},
+	{
+		name: "decimal",
+		pattern: /\b(\d+)\.(\d+)\b/g,
+		replace: (_m, i, f) => `${i} point ${spaceDigits(f)}`
+	},
+	{
+		name: "byte-unit",
+		pattern: /\b(\d+)\s?(kb|mb|gb|tb)\b/gi,
+		replace: (_m, n, u) => `${n} ${UNIT_WORDS[u.toLowerCase()]}`
+	},
+	{
+		name: "ms-unit",
+		pattern: /\b(\d{1,5})\s?ms\b/g,
+		replace: (_m, n) => `${n} ${UNIT_WORDS.ms}`
+	},
+	{
+		name: "s-unit",
+		pattern: /\b(\d{1,3})\s?s\b/g,
+		replace: (_m, n) => `${n} ${UNIT_WORDS.s}`
+	}
+];
+/**
+* Apply the inline normalization rules in order. Pure and idempotent enough to
+* feed straight into either the Kokoro engine or the browser Web Speech API.
+*/
+function normalizeForSpeech(text) {
+	if (!text) return "";
+	let out = text;
+	for (const rule of SPEECH_RULES) out = out.replace(rule.pattern, rule.replace);
+	return out.replace(/[ \t]{2,}/g, " ").trim();
+}
+/** Full pipeline: markdown → prose → normalized speech text. */
+function prepareForSpeech(markdown) {
+	return normalizeForSpeech(speechify(markdown));
+}
+//#endregion
+//#region src/lib/voice.ts
 var MAX_CHUNK = 220;
 /** Split into utterance-sized chunks (sentence boundaries; hard-split very long runs). */
 function chunkForSpeech(text) {
@@ -10402,12 +10544,31 @@ var VoiceTts = class {
 	gen = 0;
 	audioEl = null;
 	audioUrl = null;
+	playingKey = null;
+	manual = false;
+	listeners = /* @__PURE__ */ new Set();
 	get available() {
 		return synthAvailable || typeof Audio !== "undefined";
 	}
 	isEnabled() {
 		return this.enabled;
 	}
+	/** Subscribe to manual-playback changes (useSyncExternalStore). */
+	subscribe(fn) {
+		this.listeners.add(fn);
+		return () => {
+			this.listeners.delete(fn);
+		};
+	}
+	/** Id of the bubble currently played on demand, or null. */
+	getPlayingKey() {
+		return this.playingKey;
+	}
+	setPlayingKey(key) {
+		if (key === this.playingKey) return;
+		this.playingKey = key;
+		for (const fn of this.listeners) fn();
+	}
 	setEnabled(on) {
 		if (on === this.enabled) return;
 		this.enabled = on;
@@ -10433,9 +10594,9 @@ var VoiceTts = class {
 	/** A captured agent response turn arrived for `chatId`. */
 	onResponse(chatId, rawText) {
 		if (!this.enabled || !this.available || !chatId || chatId !== this.active) return;
-		const text = speechify(rawText);
+		const text = prepareForSpeech(rawText);
 		if (!text) return;
-		if (this.speaking && this.currentChat && this.currentChat !== chatId) {
+		if (this.speaking && (this.manual || this.currentChat && this.currentChat !== chatId)) {
 			this.queue = [];
 			this.cancel();
 		}
@@ -10445,6 +10606,30 @@ var VoiceTts = class {
 		});
 		this.pump();
 	}
+	/**
+	* Play an arbitrary response on demand (chat-bubble play button), independent
+	* of which chat is active. Preempts whatever is currently playing.
+	*/
+	speak(rawText, key) {
+		if (!this.available) return;
+		const text = prepareForSpeech(rawText);
+		if (!text) return;
+		this.reset();
+		this.manual = true;
+		this.speaking = true;
+		this.currentChat = null;
+		this.setPlayingKey(key ?? null);
+		const gen = ++this.gen;
+		const chunks = chunkForSpeech(text);
+		const done = () => {
+			if (gen !== this.gen) return;
+			this.speaking = false;
+			this.manual = false;
+			this.setPlayingKey(null);
+		};
+		if (this.mode === "kokoro") this.speakKokoro(chunks, 0, gen, done);
+		else this.speakBrowser(chunks, 0, gen, done);
+	}
 	/** Cut all speech immediately (e.g. when the user starts talking). */
 	bargeIn() {
 		this.reset();
@@ -10457,6 +10642,8 @@ var VoiceTts = class {
 		this.gen++;
 		this.currentChat = null;
 		this.speaking = false;
+		this.manual = false;
+		this.setPlayingKey(null);
 		try {
 			window.speechSynthesis.cancel();
 		} catch {}
@@ -10479,6 +10666,7 @@ var VoiceTts = class {
 		const item = this.queue.shift();
 		if (!item) return;
 		this.speaking = true;
+		this.manual = false;
 		this.currentChat = item.chatId;
 		const gen = ++this.gen;
 		const chunks = chunkForSpeech(item.text);
@@ -11285,6 +11473,12 @@ function emptyAttention() {
 		score: 0
 	};
 }
+function channelIsReady(channel) {
+	if (!channel || channel.status === "offline") return false;
+	if (channel.targetHealth?.status === "ok") return true;
+	if (channel.targetHealth?.status === "error" || channel.targetHealth?.status === "warning") return false;
+	return channel.ready;
+}
 function channelPresence(channel) {
 	if (!channel) return {
 		label: "unknown",
@@ -11310,18 +11504,18 @@ function channelPresence(channel) {
 		icon: "PlugZap",
 		badges: []
 	};
-	if (!channel.ready) return {
-		label: "not ready",
-		tone: "warning",
-		icon: "Loader",
-		badges: []
-	};
 	if (channel.status === "busy") return {
 		label: "busy",
 		tone: "warning",
 		icon: "Activity",
 		badges: []
 	};
+	if (!channelIsReady(channel)) return {
+		label: "not ready",
+		tone: "warning",
+		icon: "Loader",
+		badges: []
+	};
 	return {
 		label: "ready",
 		tone: "success",
@@ -11944,6 +12138,7 @@ var useRelayStore = create$1()(persist((set, get) => ({
 	agents: [],
 	agentsById: {},
 	messages: [],
+	threadHistory: {},
 	pairs: [],
 	tasks: [],
 	orchestrators: [],
@@ -12028,6 +12223,7 @@ var useRelayStore = create$1()(persist((set, get) => ({
 	chatHasNewItems: false,
 	pendingForkImport: null,
 	analyticsPeriod: "24h",
+	analyticsData: null,
 	inboxReadCursors: {},
 	inboxArchivedThreads: {},
 	inboxDrafts: {},
@@ -12152,7 +12348,8 @@ var useRelayStore = create$1()(persist((set, get) => ({
 				context: true,
 				skills: true,
 				plugins: true,
-				statusLine: true
+				statusLine: true,
+				mcp: true
 			},
 			skills: [],
 			plugins: [],
@@ -12248,6 +12445,7 @@ var useRelayStore = create$1()(persist((set, get) => ({
 			s.fetchAgents()
 		]);
 		if (view === "files") await s.fetchOrchestrators();
+		if (view === "analytics") await s.fetchAnalytics();
 	},
 	startClock() {
 		useClock.getState().start();
@@ -12362,6 +12560,7 @@ var useRelayStore = create$1()(persist((set, get) => ({
 			if (view === "maintenance") work.push(s.fetchMaintenanceJobs());
 			if (view === "profiles") work.push(s.fetchAgentProfiles());
 			if (view === "workspaces") work.push(s.fetchWorkspaces());
+			if (view === "analytics") work.push(s.fetchAnalytics());
 			await Promise.all(work);
 		} finally {
 			set({ _refreshInFlight: false });
@@ -12372,6 +12571,15 @@ var useRelayStore = create$1()(persist((set, get) => ({
 			set({ stats: await api("GET", "/stats") });
 		} catch {}
 	},
+	async fetchAnalytics() {
+		try {
+			set({ analyticsData: await api("GET", "/stats/analytics?period=" + get().analyticsPeriod) });
+		} catch {}
+	},
+	setAnalyticsPeriod(period) {
+		set({ analyticsPeriod: period });
+		get().fetchAnalytics();
+	},
 	async fetchHealth() {
 		try {
 			set({ health: await api("GET", "/health") });
@@ -12630,6 +12838,16 @@ var useRelayStore = create$1()(persist((set, get) => ({
 			set({ messages: mergeFetchedMessages(get().messages, messages) });
 		} catch {}
 	},
+	async fetchThreadHistory(peer) {
+		if (!peer) return;
+		try {
+			const history = await api("GET", "/messages?for=" + encodeURIComponent(peer) + "&limit=500");
+			set({ threadHistory: {
+				...get().threadHistory,
+				[peer]: history
+			} });
+		} catch {}
+	},
 	async fetchChatHistoryImports() {
 		try {
 			set({ chatHistoryImports: await api("GET", "/chat/history-imports?limit=500") });
@@ -12708,15 +12926,15 @@ var useRelayStore = create$1()(persist((set, get) => ({
 				if (event === "connected") return;
 				if (event === "message.new") {
 					const msg = JSON.parse(data);
+					if (msg.kind === "session" && msg.from !== "user") {
+						const sess = msg.payload?.session;
+						if (sess?.type === "response" && sess?.origin === "provider") voiceTts.onResponse(inboxPeer(msg), msg.body);
+					}
 					const s = get();
 					if (s.messages.some((m) => m.id === msg.id)) return;
 					const msgs = [...s.messages, msg];
 					if (msgs.length > 500) msgs.splice(0, msgs.length - 500);
 					set({ messages: msgs });
-					if (msg.kind === "session" && msg.from !== "user") {
-						const sess = msg.payload?.session;
-						if (sess?.type === "response" && sess?.origin === "provider") voiceTts.onResponse(inboxPeer(msg), msg.body);
-					}
 					const peer = inboxPeer(msg);
 					if (isHumanInboundMessage(msg) && peer && s.view === "chat" && s.selectedInboxThread === peer && !isDashboardHidden()) get().markInboxThreadReadTo(peer, msg.id);
 					return;
@@ -13240,6 +13458,7 @@ var useRelayStore = create$1()(persist((set, get) => ({
 	openInboxThread(peer, messages = []) {
 		set({ selectedInboxThread: peer });
 		if (messages.length) get().markInboxThreadRead(peer, messages);
+		get().fetchThreadHistory(peer);
 	},
 	async sendChatMessage(body, thread, attachments = []) {
 		if (!body.trim() && attachments.length === 0 || get().chatSending) return;
@@ -13995,7 +14214,8 @@ var useRelayStore = create$1()(persist((set, get) => ({
 				context: true,
 				skills: true,
 				plugins: true,
-				statusLine: true
+				statusLine: true,
+				mcp: true
 			},
 			skills: [],
 			plugins: [],
@@ -125295,6 +125515,7 @@ function useChatAgents() {
 	]);
 }
 var NO_STATUS_EVENTS = [];
+var NO_THREAD_HISTORY = [];
 function useAgentStatusEvents(agentId) {
 	return useRelayStore((s) => s.chatStatusEvents[agentId] ?? NO_STATUS_EVENTS);
 }
@@ -126448,9 +126669,14 @@ function AddReaction({ open, onToggle, onReact }) {
 		})]
 	});
 }
+function useTtsPlayingKey() {
+	return (0, import_react.useSyncExternalStore)((cb) => voiceTts.subscribe(cb), () => voiceTts.getPlayingKey(), () => null);
+}
 var MessageBubble = (0, import_react.memo)(function MessageBubble({ msg, peer, onOpenReferencedPath, onPreviewReferencedPath, onPreviewReferencedPathEnd }) {
 	const isOutbound = msg.from === HUMAN_AGENT_ID;
 	const reactToMessage = useRelayStore((s) => s.reactToMessage);
+	const voiceTtsEnabled = useRelayStore((s) => s.voiceTtsEnabled);
+	const ttsPlayingKey = useTtsPlayingKey();
 	const peerCwd = useRelayStore((s) => {
 		const cwd = s.agentsById[peer]?.meta?.cwd;
 		return typeof cwd === "string" ? cwd : "";
@@ -126465,6 +126691,13 @@ var MessageBubble = (0, import_react.memo)(function MessageBubble({ msg, peer, o
 	const reactions = groupedReactions(msg);
 	const receipt = isOutbound ? outboundReceipt(msg, peer) : null;
 	const ReceiptIcon = receipt?.icon;
+	const isTtsPlaying = ttsPlayingKey === String(msg.id);
+	const showPlayButton = voiceTtsEnabled && !isOutbound && !isReactionEvent(msg) && body.trim().length > 0;
+	function togglePlay(e) {
+		e.stopPropagation();
+		if (isTtsPlaying) voiceTts.bargeIn();
+		else voiceTts.speak(msg.body, String(msg.id));
+	}
 	(0, import_react.useEffect)(() => {
 		if (!showQuickReact) return;
 		function dismiss(e) {
@@ -126516,11 +126749,19 @@ var MessageBubble = (0, import_react.memo)(function MessageBubble({ msg, peer, o
 		setShowQuickReact((v) => !v);
 	}
 	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+		"data-msg-id": msg.id,
 		className: cn$2("group/msg flex mb-3", isOutbound ? "justify-end" : "justify-start"),
 		children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
 			ref: bubbleRef,
 			className: "relative max-w-[85%] md:max-w-[75%]",
 			children: [
+				showPlayButton && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
+					type: "button",
+					title: isTtsPlaying ? "Stop playback" : "Play aloud",
+					onClick: togglePlay,
+					className: cn$2("absolute -top-2 -right-2 z-20 inline-flex h-6 w-6 items-center justify-center rounded-full border bg-popover shadow-sm transition", isTtsPlaying ? "border-primary/50 text-primary opacity-100" : "border-border text-muted-foreground opacity-70 hover:bg-muted hover:text-foreground hover:opacity-100 md:opacity-0 md:group-hover/msg:opacity-100"),
+					children: isTtsPlaying ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CircleStop, { className: "h-3.5 w-3.5 animate-pulse" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Volume2, { className: "h-3.5 w-3.5" })
+				}),
 				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
 					className: cn$2("rounded-2xl px-3.5 py-2 text-sm select-text", !isOutbound && !isReactionEvent(msg) && "cursor-pointer", isOutbound ? "bg-primary text-primary-foreground rounded-br-sm" : "bg-card ring-1 ring-foreground/10 rounded-bl-sm"),
 					onPointerDown: handleBubblePointerDown,
@@ -126751,6 +126992,109 @@ function sameActivityTurn(a, b) {
 	if (at && bt) return at === bt;
 	return !at && !bt;
 }
+function StickyPromptBanner({ scrollRef, timeline }) {
+	const [hidden, setHidden] = (0, import_react.useState)(true);
+	const [expanded, setExpanded] = (0, import_react.useState)(false);
+	const [collapsed, setCollapsed] = (0, import_react.useState)(false);
+	const [promptAbove, setPromptAbove] = (0, import_react.useState)(true);
+	const lastOutbound = (0, import_react.useMemo)(() => {
+		for (let i = timeline.length - 1; i >= 0; i--) {
+			const entry = timeline[i];
+			if (!entry || entry.type !== "message") continue;
+			if (entry.msg.from === "user") return {
+				id: entry.msg.id,
+				body: messageBody(entry.msg)
+			};
+		}
+		return null;
+	}, [timeline]);
+	(0, import_react.useEffect)(() => {
+		const scrollEl = scrollRef.current;
+		if (!lastOutbound || !scrollEl) {
+			setHidden(true);
+			return;
+		}
+		const target = scrollEl.querySelector(`[data-msg-id="${lastOutbound.id}"]`);
+		if (!target) {
+			setHidden(true);
+			return;
+		}
+		const observer = new IntersectionObserver(([e]) => {
+			if (!e) return;
+			setHidden(e.isIntersecting);
+			if (!e.isIntersecting) {
+				const rootTop = e.rootBounds?.top ?? scrollEl.getBoundingClientRect().top;
+				setPromptAbove(e.boundingClientRect.top < rootTop);
+			}
+		}, {
+			root: scrollEl,
+			threshold: 0
+		});
+		observer.observe(target);
+		const onScroll = () => {
+			const r = target.getBoundingClientRect();
+			const sr = scrollEl.getBoundingClientRect();
+			setPromptAbove(r.top < sr.top);
+		};
+		scrollEl.addEventListener("scroll", onScroll, { passive: true });
+		return () => {
+			observer.disconnect();
+			scrollEl.removeEventListener("scroll", onScroll);
+		};
+	}, [lastOutbound?.id, scrollRef]);
+	(0, import_react.useEffect)(() => {
+		setExpanded(false);
+		setCollapsed(false);
+	}, [lastOutbound?.id]);
+	if (hidden || !lastOutbound || !lastOutbound.body.trim()) return null;
+	function scrollToPrompt() {
+		const scrollEl = scrollRef.current;
+		if (!scrollEl || !lastOutbound) return;
+		scrollEl.querySelector(`[data-msg-id="${lastOutbound.id}"]`)?.scrollIntoView({
+			behavior: "smooth",
+			block: "center"
+		});
+	}
+	const arrow = promptAbove ? "↑" : "↓";
+	if (collapsed) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+		className: "sticky top-0 z-10 -mx-3 md:-mx-4 -mt-3 md:-mt-4 bg-background",
+		children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", {
+			type: "button",
+			className: "w-full flex items-center justify-center gap-1.5 py-1 text-[11px] text-primary/60 hover:text-primary border-b border-primary/10 transition-colors",
+			onClick: () => setCollapsed(false),
+			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Your prompt" }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ChevronDown, { className: "w-3 h-3" })]
+		})
+	});
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+		className: "sticky top-0 z-10 -mx-3 md:-mx-4 -mt-3 md:-mt-4 px-2 md:px-3 pt-2 pb-1.5 bg-background border-b border-primary/10",
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+			className: "flex items-center gap-2 text-[11px] text-muted-foreground mb-0.5",
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+					className: "font-medium text-primary/70",
+					children: "Your prompt"
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", {
+					type: "button",
+					className: "ml-auto hover:text-foreground transition-colors",
+					onClick: scrollToPrompt,
+					children: [arrow, " scroll to original"]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "hover:text-foreground transition-colors",
+					onClick: () => setCollapsed(true),
+					title: "Minimize",
+					children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ChevronUp, { className: "w-3 h-3" })
+				})
+			]
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
+			className: cn$2("text-sm text-foreground leading-snug cursor-pointer", !expanded && "line-clamp-2"),
+			onClick: () => setExpanded((e) => !e),
+			children: lastOutbound.body
+		})]
+	});
+}
 function ChatPanel({ threads, onBack, showBackButton }) {
 	const selectedInboxThread = useRelayStore((s) => s.selectedInboxThread);
 	const agentsById = useRelayStore((s) => s.agentsById);
@@ -126768,6 +127112,7 @@ function ChatPanel({ threads, onBack, showBackButton }) {
 	const doAgentAction = useRelayStore((s) => s.doAgentAction);
 	const forkFromAgent = useRelayStore((s) => s.forkFromAgent);
 	const chatHistoryImports = useRelayStore((s) => s.chatHistoryImports);
+	const peerHistory = useRelayStore((s) => s.threadHistory[s.selectedInboxThread] ?? NO_THREAD_HISTORY);
 	const openConfirm = useRelayStore((s) => s.openConfirm);
 	const showError = useRelayStore((s) => s.showError);
 	const orchestrators = useRelayStore((s) => s.orchestrators);
@@ -126805,6 +127150,18 @@ function ChatPanel({ threads, onBack, showBackButton }) {
 	const filePreviewRequest = (0, import_react.useRef)(0);
 	const statusEvents = useAgentStatusEvents(selectedInboxThread);
 	const thread = (0, import_react.useMemo)(() => threads.find((t) => t.peer === selectedInboxThread) || null, [threads, selectedInboxThread]);
+	const threadMessages = (0, import_react.useMemo)(() => {
+		const live = thread?.messages ?? [];
+		if (peerHistory.length === 0) return live;
+		const byId = /* @__PURE__ */ new Map();
+		for (const m of peerHistory) if (inboxPeer(m) === selectedInboxThread && !isReactionEventMessage(m)) byId.set(m.id, m);
+		for (const m of live) byId.set(m.id, m);
+		return [...byId.values()].sort((a, b) => a.id - b.id);
+	}, [
+		thread?.messages,
+		peerHistory,
+		selectedInboxThread
+	]);
 	const agent = agentsById[selectedInboxThread] || null;
 	const agentSpawnRequestId = typeof agent?.meta?.spawnRequestId === "string" ? agent.meta.spawnRequestId : "";
 	const importedHistory = (0, import_react.useMemo)(() => {
@@ -126824,7 +127181,7 @@ function ChatPanel({ threads, onBack, showBackButton }) {
 	const draft = inboxDrafts[selectedInboxThread] || "";
 	const importedEntryCount = importedHistory.reduce((sum, history) => sum + history.entries.length, 0);
 	const pinnedScroll = usePinnedScroll(selectedInboxThread, [
-		thread?.messages.length,
+		threadMessages.length,
 		statusEvents.length,
 		importedEntryCount,
 		pendingApproval?.id,
@@ -126880,8 +127237,8 @@ function ChatPanel({ threads, onBack, showBackButton }) {
 			if (filePreviewCloseTimer.current !== null) window.clearTimeout(filePreviewCloseTimer.current);
 		};
 	}, []);
-	const timeline = (0, import_react.useMemo)(() => buildTimeline(thread?.messages || [], statusEvents, agent?.createdAt, importedHistory), [
-		thread?.messages,
+	const timeline = (0, import_react.useMemo)(() => buildTimeline(threadMessages, statusEvents, agent?.createdAt, importedHistory), [
+		threadMessages,
 		statusEvents,
 		agent?.createdAt,
 		importedHistory
@@ -127398,6 +127755,10 @@ function ChatPanel({ threads, onBack, showBackButton }) {
 								children: "No messages yet"
 							})]
 						}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+							/* @__PURE__ */ (0, import_jsx_runtime.jsx)(StickyPromptBanner, {
+								scrollRef: pinnedScroll.ref,
+								timeline
+							}),
 							timeline.map((entry) => {
 								if (entry.type === "message") return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MessageBubble, {
 									msg: entry.msg,
@@ -129832,7 +130193,7 @@ function ChannelCard({ channel }) {
 }
 function ChannelsView() {
 	const channels = useRelayStore((s) => s.channels);
-	const readyCount = channels.filter((c) => c.status !== "offline" && c.ready).length;
+	const readyCount = channels.filter(channelIsReady).length;
 	const errorCount = channels.filter((c) => c.targetHealth?.status === "error").length;
 	const warningCount = channels.filter((c) => c.targetHealth?.status === "warning").length;
 	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
@@ -152495,13 +152856,14 @@ var PERIODS = [
 function periodMs(id) {
 	return PERIODS.find((p) => p.id === id)?.ms ?? 864e5;
 }
-function categorizeMessage(msg) {
-	if (msg.claimable) return "Work items";
-	if (msg.kind === "system" || msg.from === "system") return "System";
-	if (msg.kind === "pair") return "Pair";
-	if (msg.kind === "channel.event") return "Channel";
-	return "Messages";
-}
+var CATEGORY_ORDER = [
+	"Messages",
+	"Replies",
+	"Work items",
+	"System",
+	"Pair",
+	"Channel"
+];
 function StatCard({ label, value, icon: Icon, className = "" }) {
 	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Card, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardContent, {
 		className: "pt-4",
@@ -152522,11 +152884,11 @@ function StatCard({ label, value, icon: Icon, className = "" }) {
 }
 function PeriodSelector() {
 	const period = useRelayStore((s) => s.analyticsPeriod);
-	const set = useRelayStore((s) => s.set);
+	const setPeriod = useRelayStore((s) => s.setAnalyticsPeriod);
 	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
 		className: "flex items-center gap-1 bg-muted rounded-lg p-1",
 		children: PERIODS.map((p) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
-			onClick: () => set({ analyticsPeriod: p.id }),
+			onClick: () => setPeriod(p.id),
 			className: `px-3 py-1 rounded-md text-xs font-medium transition-colors ${period === p.id ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"}`,
 			children: p.label
 		}, p.id))
@@ -152566,67 +152928,38 @@ function useChart(id, getOptions, deps) {
 }
 function AnalyticsView() {
 	const agents = useRelayStore((s) => s.agents);
-	const messages = useRelayStore((s) => s.messages);
-	useRelayStore((s) => s.stats);
+	const data = useRelayStore((s) => s.analyticsData);
 	const period = useRelayStore((s) => s.analyticsPeriod);
 	const theme = useRelayStore((s) => s.theme);
 	const onlineCount = useOnlineCount();
 	const busyCount = useBusyCount();
 	const isDark = THEMES.find((t) => t.id === theme)?.dark ?? true;
-	const cutoff = Date.now() - periodMs(period);
-	const filteredMessages = (0, import_react.useMemo)(() => {
-		return messages.filter((m) => {
-			const ts = toTimestamp(m.createdAt);
-			return ts && ts >= cutoff;
-		});
-	}, [messages, cutoff]);
 	const volumeData = (0, import_react.useMemo)(() => {
-		const ms = periodMs(period);
-		const bucketCount = period === "1h" ? 12 : period === "6h" ? 12 : period === "24h" ? 24 : period === "7d" ? 14 : period === "14d" ? 14 : 15;
-		const bucketMs = ms / bucketCount;
-		const now = Date.now();
-		const categories = [
-			"Messages",
-			"Replies",
-			"Work items",
-			"System",
-			"Pair",
-			"Channel"
-		];
-		const series = {};
-		for (const cat of categories) series[cat] = new Array(bucketCount).fill(0);
-		const labels = [];
-		for (let i = 0; i < bucketCount; i++) {
-			const t = /* @__PURE__ */ new Date(now - (bucketCount - 1 - i) * bucketMs);
-			if (ms <= 864e5) labels.push(t.toLocaleTimeString(void 0, {
-				hour: "2-digit",
-				minute: "2-digit"
-			}));
-			else labels.push(t.toLocaleDateString(void 0, {
-				month: "short",
-				day: "numeric"
-			}));
-		}
-		for (const msg of filteredMessages) {
-			const ts = toTimestamp(msg.createdAt);
-			if (!ts) continue;
-			const bucketIdx = Math.floor((ts - (now - ms)) / bucketMs);
-			if (bucketIdx < 0 || bucketIdx >= bucketCount) continue;
-			const bucket = series[categorizeMessage(msg)];
-			if (bucket) bucket[bucketIdx] = (bucket[bucketIdx] ?? 0) + 1;
-		}
+		if (!data) return {
+			labels: [],
+			series: []
+		};
+		const asTime = periodMs(period) <= 864e5;
 		return {
-			labels,
-			series: categories.flatMap((c) => {
-				const data = series[c];
-				if (!data || !data.some((v) => v > 0)) return [];
-				return [{
-					name: c,
-					data
-				}];
+			labels: data.buckets.map((b) => {
+				const t = new Date(b.start);
+				return asTime ? t.toLocaleTimeString(void 0, {
+					hour: "2-digit",
+					minute: "2-digit"
+				}) : t.toLocaleDateString(void 0, {
+					month: "short",
+					day: "numeric"
+				});
+			}),
+			series: CATEGORY_ORDER.flatMap((cat) => {
+				const series = data.buckets.map((b) => b.counts[cat] ?? 0);
+				return series.some((v) => v > 0) ? [{
+					name: cat,
+					data: series
+				}] : [];
 			})
 		};
-	}, [filteredMessages, period]);
+	}, [data, period]);
 	const utilizationData = (0, import_react.useMemo)(() => {
 		let idle = 0, busy = 0;
 		for (const a of agents) {
@@ -152641,14 +152974,7 @@ function AnalyticsView() {
 		};
 	}, [agents]);
 	const heatmapData = (0, import_react.useMemo)(() => {
-		const grid = Array.from({ length: 7 }, () => new Array(24).fill(0));
-		for (const msg of filteredMessages) {
-			const ts = toTimestamp(msg.createdAt);
-			if (!ts) continue;
-			const d = new Date(ts);
-			const row = grid[d.getDay()];
-			if (row) row[d.getHours()] = (row[d.getHours()] ?? 0) + 1;
-		}
+		const grid = data?.heatmap ?? Array.from({ length: 7 }, () => new Array(24).fill(0));
 		return [
 			"Sun",
 			"Mon",
@@ -152659,24 +152985,20 @@ function AnalyticsView() {
 			"Sat"
 		].map((name, dayIdx) => ({
 			name,
-			data: (grid[dayIdx] ?? []).map((v, hour) => ({
+			data: (grid[dayIdx] ?? new Array(24).fill(0)).map((v, hour) => ({
 				x: String(hour).padStart(2, "0"),
 				y: v
 			}))
 		}));
-	}, [filteredMessages]);
+	}, [data]);
 	const activityBreakdown = (0, import_react.useMemo)(() => {
-		const counts = {};
-		for (const msg of filteredMessages) {
-			const cat = categorizeMessage(msg);
-			counts[cat] = (counts[cat] ?? 0) + 1;
-		}
-		const entries = Object.entries(counts).filter(([, v]) => v > 0).sort((a, b) => b[1] - a[1]);
+		const counts = data?.categories;
+		const entries = counts ? Object.entries(counts).filter(([, v]) => v > 0).sort((a, b) => b[1] - a[1]) : [];
 		return {
 			labels: entries.map(([k]) => k),
 			values: entries.map(([, v]) => v)
 		};
-	}, [filteredMessages]);
+	}, [data]);
 	const chartColors = isDark ? {
 		text: "rgba(255,255,255,0.4)",
 		grid: "rgba(255,255,255,0.06)",
@@ -152815,8 +153137,9 @@ function AnalyticsView() {
 			}] }
 		} }
 	}), [heatmapData, isDark]);
-	const periodMessageCount = filteredMessages.length;
-	const reactionCount = filteredMessages.reduce((sum, m) => sum + (m.reactions?.length ?? 0), 0);
+	const periodMessageCount = data?.totalMessages ?? 0;
+	const reactionCount = data?.totalReactions ?? 0;
+	const hasHeatmapData = (data?.totalMessages ?? 0) > 0;
 	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
 		className: "space-y-6",
 		children: [
@@ -152882,7 +153205,7 @@ function AnalyticsView() {
 			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Card, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardTitle, {
 				className: "text-sm",
 				children: "Busiest hours"
-			}) }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardContent, { children: filteredMessages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+			}) }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardContent, { children: !hasHeatmapData ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
 				className: "flex items-center justify-center h-[240px] text-muted-foreground text-sm",
 				children: "No data for heatmap"
 			}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { id: "analytics-heatmap-chart" }) })] })
@@ -157587,6 +157910,29 @@ function AgentProfileModal() {
 			...partial
 		} });
 	}
+	function updateCodexToolOutputTokenLimit(value) {
+		const providerOptions = profile.providerOptions || {};
+		const codex = { ...providerOptions.codex && typeof providerOptions.codex === "object" && !Array.isArray(providerOptions.codex) ? providerOptions.codex : {} };
+		if (!value.trim()) delete codex.toolOutputTokenLimit;
+		else {
+			const limit = Number(value);
+			if (!Number.isSafeInteger(limit)) return;
+			codex.toolOutputTokenLimit = limit;
+		}
+		updateProfileModal({ providerOptions: {
+			...providerOptions,
+			codex
+		} });
+	}
+	function updateMaxSpawnedAgents(value) {
+		if (!value.trim()) {
+			updateProfileModal({ maxSpawnedAgents: void 0 });
+			return;
+		}
+		const n = Number(value);
+		if (!Number.isInteger(n) || n < 0) return;
+		updateProfileModal({ maxSpawnedAgents: Math.min(n, 100) });
+	}
 	function selectBase(base) {
 		const isHost = base === "host";
 		updateProfileModal({
@@ -157595,7 +157941,8 @@ function AgentProfileModal() {
 				context: isHost,
 				skills: isHost,
 				plugins: isHost,
-				statusLine: isHost
+				statusLine: isHost,
+				mcp: isHost
 			},
 			mcp: {
 				...profile.mcp,
@@ -157612,6 +157959,8 @@ function AgentProfileModal() {
 			}
 		});
 	}
+	const codexOptions = profile.providerOptions?.codex && typeof profile.providerOptions.codex === "object" && !Array.isArray(profile.providerOptions.codex) ? profile.providerOptions.codex : {};
+	const codexToolOutputTokenLimit = Number.isSafeInteger(codexOptions.toolOutputTokenLimit) ? String(codexOptions.toolOutputTokenLimit) : "";
 	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Dialog, {
 		open,
 		onOpenChange: (o) => !o && closeProfileModal(),
@@ -157695,14 +158044,15 @@ function AgentProfileModal() {
 									"context",
 									"skills",
 									"plugins",
-									"statusLine"
+									"statusLine",
+									"mcp"
 								].map((key) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
 									className: "flex items-center justify-between gap-2",
 									children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Label, {
 										className: "capitalize",
-										children: key === "statusLine" ? "Status Line" : key
+										children: key === "statusLine" ? "Status Line" : key === "mcp" ? "MCP Tools" : key
 									}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Switch, {
-										checked: profile.relay[key],
+										checked: profile.relay[key] ?? true,
 										onCheckedChange: (v) => updateRelay({ [key]: v }),
 										disabled: readOnly
 									})]
@@ -157748,6 +158098,27 @@ function AgentProfileModal() {
 								})] })]
 							})
 						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Section, {
+							title: "Spawning",
+							defaultOpen: false,
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+								/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Label, { children: "Spawn Quota" }),
+								/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Input, {
+									type: "number",
+									min: 0,
+									max: 100,
+									step: 1,
+									value: profile.maxSpawnedAgents === void 0 ? "" : String(profile.maxSpawnedAgents),
+									onChange: (e) => updateMaxSpawnedAgents(e.target.value),
+									placeholder: "0",
+									disabled: readOnly
+								}),
+								/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
+									className: "mt-1 text-xs text-muted-foreground",
+									children: "Max concurrent live child agents this profile may spawn. Empty or 0 = cannot spawn (default). Children never inherit it (no grandchildren)."
+								})
+							] })
+						}),
 						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Section, {
 							title: "Environment Variables",
 							defaultOpen: false,
@@ -157757,10 +158128,18 @@ function AgentProfileModal() {
 								disabled: readOnly
 							})
 						}),
-						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Section, {
+						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Section, {
 							title: "Provider Options",
 							defaultOpen: false,
-							children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Textarea, {
+							children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Label, { children: "Codex Tool Output Limit" }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Input, {
+								type: "number",
+								min: 1e3,
+								max: 2e5,
+								value: codexToolOutputTokenLimit,
+								onChange: (e) => updateCodexToolOutputTokenLimit(e.target.value),
+								placeholder: "12000",
+								disabled: readOnly
+							})] }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Textarea, {
 								value: JSON.stringify(profile.providerOptions || {}, null, 2),
 								onChange: (e) => {
 									try {
@@ -157771,7 +158150,7 @@ function AgentProfileModal() {
 								disabled: readOnly,
 								className: "font-mono text-xs",
 								placeholder: "{}"
-							})
+							})]
 						})
 					]
 				}),
@@ -158603,6 +158982,10 @@ if ("serviceWorker" in navigator) {
     inset-block: calc(var(--spacing) * 0);
   }
 
+  .-top-2 {
+    top: calc(var(--spacing) * -2);
+  }
+
   .top-0 {
     top: calc(var(--spacing) * 0);
   }
@@ -158631,6 +159014,10 @@ if ("serviceWorker" in navigator) {
     right: calc(var(--spacing) * -.5);
   }
 
+  .-right-2 {
+    right: calc(var(--spacing) * -2);
+  }
+
   .right-2 {
     right: calc(var(--spacing) * 2);
   }
@@ -158765,6 +159152,10 @@ if ("serviceWorker" in navigator) {
     margin-inline: calc(var(--spacing) * -1);
   }
 
+  .-mx-3 {
+    margin-inline: calc(var(--spacing) * -3);
+  }
+
   .-mx-4 {
     margin-inline: calc(var(--spacing) * -4);
   }
@@ -158789,6 +159180,10 @@ if ("serviceWorker" in navigator) {
     margin-top: calc(var(--spacing) * -1);
   }
 
+  .-mt-3 {
+    margin-top: calc(var(--spacing) * -3);
+  }
+
   .mt-0\.5 {
     margin-top: calc(var(--spacing) * .5);
   }
@@ -160179,6 +160574,16 @@ if ("serviceWorker" in navigator) {
     }
   }
 
+  .border-primary\/10 {
+    border-color: var(--primary);
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .border-primary\/10 {
+      border-color: color-mix(in oklab, var(--primary) 10%, transparent);
+    }
+  }
+
   .border-primary\/25 {
     border-color: var(--primary);
   }
@@ -161219,6 +161624,10 @@ if ("serviceWorker" in navigator) {
     padding-bottom: calc(var(--spacing) * 1);
   }
 
+  .pb-1\.5 {
+    padding-bottom: calc(var(--spacing) * 1.5);
+  }
+
   .pb-2 {
     padding-bottom: calc(var(--spacing) * 2);
   }
@@ -162436,6 +162845,10 @@ if ("serviceWorker" in navigator) {
     .hover\:opacity-80:hover {
       opacity: .8;
     }
+
+    .hover\:opacity-100:hover {
+      opacity: 1;
+    }
   }
 
   .focus\:bg-accent:focus {
@@ -163003,6 +163416,14 @@ if ("serviceWorker" in navigator) {
       margin: calc(var(--spacing) * -6);
     }
 
+    .md\:-mx-4 {
+      margin-inline: calc(var(--spacing) * -4);
+    }
+
+    .md\:-mt-4 {
+      margin-top: calc(var(--spacing) * -4);
+    }
+
     .md\:block {
       display: block;
     }
@@ -163090,6 +163511,10 @@ if ("serviceWorker" in navigator) {
       padding: calc(var(--spacing) * 6);
     }
 
+    .md\:px-3 {
+      padding-inline: calc(var(--spacing) * 3);
+    }
+
     .md\:px-4 {
       padding-inline: calc(var(--spacing) * 4);
     }
@@ -163111,6 +163536,10 @@ if ("serviceWorker" in navigator) {
       text-wrap: pretty;
     }
 
+    .md\:opacity-0 {
+      opacity: 0;
+    }
+
     @media (hover: hover) {
       .md\:group-hover\/msg\:pointer-events-auto:is(:where(.group\/msg):hover *) {
         pointer-events: auto;