@muxoai/platform 1.4.1 → 1.4.2

package/dist/mcp-schema.js

@@ -1,3 +1,318 @@
+import { isStripeProjectsExclusiveProvider, resolveStripeProjectsCanonicalToolSlug, } from "./composio-catalog.js";
+export const LATEST_MCP_PROTOCOL_VERSION = "2026-07-28";
+export const DEFAULT_LEGACY_MCP_PROTOCOL_VERSION = "2025-06-18";
+/**
+ * Dual-era MCP protocol versions supported by Muxo:
+ * - Modern stateless era: 2026-07-28 (SEP-2575 server/discover, SEP-2549 caching, MRTR resultType)
+ * - Legacy session era: 2025-11-25, 2025-06-18, 2025-03-26, 2024-11-05
+ */
+export const SUPPORTED_MCP_PROTOCOL_VERSIONS = [
+    "2026-07-28",
+    "2025-11-25",
+    "2025-06-18",
+    "2025-03-26",
+    "2024-11-05",
+];
+export const MCP_ERR_HEADER_MISMATCH = -32020;
+export const MCP_ERR_MISSING_REQUIRED_CLIENT_CAPABILITY = -32021;
+export const MCP_ERR_UNSUPPORTED_PROTOCOL_VERSION = -32022;
+export function isSupportedMcpProtocolVersion(version) {
+    if (typeof version !== "string" || !version.trim())
+        return false;
+    return SUPPORTED_MCP_PROTOCOL_VERSIONS.includes(version.trim());
+}
+function decodeBase64Utf8(b64) {
+    const normalized = b64.replace(/-/g, "+").replace(/_/g, "/");
+    if (typeof Buffer !== "undefined") {
+        return Buffer.from(normalized, "base64").toString("utf8");
+    }
+    const binary = atob(normalized);
+    const bytes = new Uint8Array(binary.length);
+    for (let i = 0; i < binary.length; i++) {
+        bytes[i] = binary.charCodeAt(i);
+    }
+    return new TextDecoder().decode(bytes);
+}
+/**
+ * Decodes an MCP Streamable HTTP header value (`Mcp-Name`, `Mcp-Param-*`),
+ * supporting plain ASCII as well as the 2026-07-28 Base64 sentinel format (`=:base64:...:`)
+ * and RFC 2047 `=?utf-8?B?...?=`.
+ */
+export function decodeMcpHeaderValue(raw) {
+    const trimmed = String(raw || "").trim();
+    const sentinelMatch = /^=:base64:([A-Za-z0-9+/=_-]+):=$/.exec(trimmed) ||
+        /^=:base64:([A-Za-z0-9+/=_-]+):$/.exec(trimmed);
+    if (sentinelMatch) {
+        try {
+            return decodeBase64Utf8(sentinelMatch[1]);
+        }
+        catch {
+            return trimmed;
+        }
+    }
+    const rfc2047Match = /^=\?utf-8\?B\?([A-Za-z0-9+/=]+)\?=$/i.exec(trimmed);
+    if (rfc2047Match) {
+        try {
+            return decodeBase64Utf8(rfc2047Match[1]);
+        }
+        catch {
+            return trimmed;
+        }
+    }
+    return trimmed;
+}
+/**
+ * Validates MCP 2026-07-28 Streamable HTTP headers (`MCP-Protocol-Version`, `Mcp-Method`,
+ * `Mcp-Name`) and per-request `params._meta["io.modelcontextprotocol/protocolVersion"]`
+ * against the JSON-RPC request body.
+ *
+ * Returns `-32020 HeaderMismatch` when `Mcp-Method` or `Mcp-Name` conflicts with the body,
+ * and `-32022 UnsupportedProtocolVersion` when an unsupported protocol version is requested.
+ */
+export function validateMcpHttpHeadersAndMeta(headers, rpc) {
+    const message = rpc && typeof rpc === "object" && !Array.isArray(rpc)
+        ? rpc
+        : {};
+    const id = message.id ?? null;
+    const bodyMethod = typeof message.method === "string" ? message.method : "";
+    const params = message.params && typeof message.params === "object" && !Array.isArray(message.params)
+        ? message.params
+        : {};
+    const rawMeta = params._meta && typeof params._meta === "object" && !Array.isArray(params._meta)
+        ? params._meta
+        : {};
+    // 1. Validate MCP-Protocol-Version HTTP header if provided
+    const headerVersion = typeof headers.protocolVersion === "string" ? headers.protocolVersion.trim() : "";
+    if (headerVersion && !isSupportedMcpProtocolVersion(headerVersion)) {
+        return {
+            ok: false,
+            id,
+            error: {
+                code: MCP_ERR_UNSUPPORTED_PROTOCOL_VERSION,
+                message: `Unsupported MCP protocol version '${headerVersion}'. Supported versions: ${SUPPORTED_MCP_PROTOCOL_VERSIONS.join(", ")}.`,
+                data: {
+                    requestedVersion: headerVersion,
+                    supportedVersions: [...SUPPORTED_MCP_PROTOCOL_VERSIONS],
+                },
+            },
+        };
+    }
+    // 2. Validate per-request _meta["io.modelcontextprotocol/protocolVersion"] if provided
+    const metaVersion = typeof rawMeta["io.modelcontextprotocol/protocolVersion"] === "string"
+        ? rawMeta["io.modelcontextprotocol/protocolVersion"].trim()
+        : "";
+    if (metaVersion && !isSupportedMcpProtocolVersion(metaVersion)) {
+        return {
+            ok: false,
+            id,
+            error: {
+                code: MCP_ERR_UNSUPPORTED_PROTOCOL_VERSION,
+                message: `Unsupported MCP protocol version '${metaVersion}' in params._meta. Supported versions: ${SUPPORTED_MCP_PROTOCOL_VERSIONS.join(", ")}.`,
+                data: {
+                    requestedVersion: metaVersion,
+                    supportedVersions: [...SUPPORTED_MCP_PROTOCOL_VERSIONS],
+                },
+            },
+        };
+    }
+    // If both header and _meta specify a version, they must agree
+    if (headerVersion && metaVersion && headerVersion !== metaVersion) {
+        return {
+            ok: false,
+            id,
+            error: {
+                code: MCP_ERR_HEADER_MISMATCH,
+                message: `HeaderMismatch: MCP-Protocol-Version header ('${headerVersion}') does not match params._meta["io.modelcontextprotocol/protocolVersion"] ('${metaVersion}').`,
+                data: {
+                    header: "MCP-Protocol-Version",
+                    headerValue: headerVersion,
+                    bodyValue: metaVersion,
+                },
+            },
+        };
+    }
+    // 3. Validate Mcp-Method header against JSON-RPC method
+    const headerMethod = typeof headers.method === "string" ? headers.method.trim() : "";
+    if (headerMethod && bodyMethod && headerMethod !== bodyMethod) {
+        return {
+            ok: false,
+            id,
+            error: {
+                code: MCP_ERR_HEADER_MISMATCH,
+                message: `HeaderMismatch: Mcp-Method header ('${headerMethod}') does not match JSON-RPC method ('${bodyMethod}').`,
+                data: {
+                    header: "Mcp-Method",
+                    headerValue: headerMethod,
+                    bodyValue: bodyMethod,
+                },
+            },
+        };
+    }
+    // 4. Validate Mcp-Name header against params.name / params.uri
+    const rawHeaderName = typeof headers.name === "string" ? headers.name.trim() : "";
+    if (rawHeaderName) {
+        const decodedHeaderName = decodeMcpHeaderValue(rawHeaderName);
+        const bodyTargetName = bodyMethod === "resources/read"
+            ? String(params.uri ?? "")
+            : String(params.name ?? params.uri ?? "");
+        if (bodyTargetName && decodedHeaderName !== bodyTargetName) {
+            return {
+                ok: false,
+                id,
+                error: {
+                    code: MCP_ERR_HEADER_MISMATCH,
+                    message: `HeaderMismatch: Mcp-Name header ('${decodedHeaderName}') does not match request target ('${bodyTargetName}').`,
+                    data: {
+                        header: "Mcp-Name",
+                        headerValue: decodedHeaderName,
+                        bodyValue: bodyTargetName,
+                    },
+                },
+            };
+        }
+    }
+    // 5. Validate initialize params.protocolVersion if explicitly provided
+    const initVersion = bodyMethod === "initialize" && typeof params.protocolVersion === "string"
+        ? params.protocolVersion.trim()
+        : "";
+    if (initVersion && !isSupportedMcpProtocolVersion(initVersion)) {
+        return {
+            ok: false,
+            id,
+            error: {
+                code: MCP_ERR_UNSUPPORTED_PROTOCOL_VERSION,
+                message: `Unsupported MCP protocol version '${initVersion}'. Supported versions: ${SUPPORTED_MCP_PROTOCOL_VERSIONS.join(", ")}.`,
+                data: {
+                    requestedVersion: initVersion,
+                    supportedVersions: [...SUPPORTED_MCP_PROTOCOL_VERSIONS],
+                },
+            },
+        };
+    }
+    const resolvedVersion = metaVersion ||
+        initVersion ||
+        headerVersion ||
+        (bodyMethod === "server/discover"
+            ? LATEST_MCP_PROTOCOL_VERSION
+            : DEFAULT_LEGACY_MCP_PROTOCOL_VERSION);
+    return { ok: true, protocolVersion: resolvedVersion };
+}
+/**
+ * Builds the canonical MCP 2026-07-28 `server/discover` response (SEP-2575 + SEP-2549).
+ * Includes both top-level `serverInfo`/`instructions` and `_meta["io.modelcontextprotocol/*"]`
+ * so both strict 2026-07-28 validators and dual-era clients succeed.
+ */
+export function buildMcpDiscoverResult(serverVersion) {
+    const serverInfo = {
+        name: "muxo-mcp-server",
+        title: "Muxo Unified Agent Runtime & Governance MCP Server",
+        version: serverVersion,
+    };
+    return {
+        resultType: "complete",
+        protocolVersion: LATEST_MCP_PROTOCOL_VERSION,
+        supportedVersions: [...SUPPORTED_MCP_PROTOCOL_VERSIONS],
+        serverInfo,
+        instructions: MUXO_MCP_SERVER_INSTRUCTIONS,
+        capabilities: {
+            tools: { listChanged: false },
+            resources: { listChanged: false, subscribe: false },
+            prompts: { listChanged: false },
+            completions: {},
+            extensions: {
+                "io.modelcontextprotocol/skills": {},
+                "io.modelcontextprotocol/apps": {},
+            },
+        },
+        ttlMs: 300_000,
+        cacheScope: "public",
+        _meta: {
+            "io.modelcontextprotocol/protocolVersion": LATEST_MCP_PROTOCOL_VERSION,
+            "io.modelcontextprotocol/serverInfo": serverInfo,
+            "io.modelcontextprotocol/instructions": MUXO_MCP_SERVER_INSTRUCTIONS,
+        },
+    };
+}
+export const MUXO_MCP_RESOURCE_TEMPLATES = [
+    {
+        uriTemplate: "muxo://tools/{slug}",
+        name: "Muxo Tool Specification & Governance Contract",
+        title: "Muxo Tool Specification & Governance Contract",
+        description: "Inspect a specific Muxo catalog tool's input JSON schema, risk classification, provider lane, and credit cost by slug (e.g. muxo://tools/instant.dns.lookup).",
+        mimeType: "application/json",
+    },
+    {
+        uriTemplate: "muxo://plans/{planId}",
+        name: "Muxo Execution Plan Record",
+        title: "Muxo Execution Plan Record",
+        description: "Read a governed execution plan (plan_*), its approval status, and its Microsoft Governance DecisionRecord.",
+        mimeType: "application/json",
+    },
+    {
+        uriTemplate: "muxo://runs/{runId}",
+        name: "Muxo Execution Run Record",
+        title: "Muxo Execution Run Record",
+        description: "Read an execution run (run_*), its output, duration, and metered cost.",
+        mimeType: "application/json",
+    },
+    {
+        uriTemplate: "muxo://receipts/{receiptId}",
+        name: "Muxo Cryptographic Receipt",
+        title: "Muxo Cryptographic Receipt",
+        description: "Read and verify a signed HMAC-SHA256 + Ed25519 execution receipt (rcpt_* or 'latest').",
+        mimeType: "application/json",
+    },
+    {
+        uriTemplate: "skill://muxo/{skillName}/SKILL.md",
+        name: "Muxo Agent Skill Markdown (SEP-2640)",
+        title: "Muxo Agent Skill Markdown (SEP-2640)",
+        description: "Read the SKILL.md entry point for a published Muxo Agent Skill ('muxo' or 'setup').",
+        mimeType: "text/markdown",
+    },
+];
+/**
+ * Evaluates MCP `completion/complete` requests for prompt arguments and resource templates.
+ */
+export function completeMcpArgument(params, toolSlugs = []) {
+    const argObj = params?.argument && typeof params.argument === "object" && !Array.isArray(params.argument)
+        ? params.argument
+        : {};
+    const argName = String(argObj.name || "").trim();
+    const prefix = String(argObj.value || "").trim().toLowerCase();
+    let candidates = [];
+    if (argName === "skillName" || argName === "name") {
+        candidates = ["muxo", "setup"];
+    }
+    else if (argName === "focus") {
+        candidates = ["full", "pending_approvals", "billing", "receipts", "memory"];
+    }
+    else if (argName === "slug" || argName === "tool_slug") {
+        candidates =
+            toolSlugs.length > 0
+                ? toolSlugs
+                : [
+                    "instant.dns.lookup",
+                    "instant.seo.audit",
+                    "instant.web.search",
+                    "app.github.create_issue",
+                    "app.gmail.send_email",
+                    "billing.stripe.create_refund",
+                    "resource.turso.database",
+                ];
+    }
+    else if (argName === "receiptId" || argName === "receipt_id") {
+        candidates = ["latest", "chain"];
+    }
+    const filtered = prefix
+        ? candidates.filter((c) => c.toLowerCase().includes(prefix))
+        : candidates;
+    const values = filtered.slice(0, 50);
+    return {
+        values,
+        total: filtered.length,
+        hasMore: filtered.length > values.length,
+    };
+}
 export const MCP_TOOLS_OAUTH_SCOPE = "mcp:tools";
 /** Workspace-bound tools require an OAuth bearer token (or workspace API key). */
 export const DEFAULT_TOOL_SECURITY_SCHEMES = [
@@ -14,12 +329,164 @@ export const PUBLIC_MCP_TOOL_NAMES = new Set([
     "search",
     "fetch",
 ]);
+export const MUXO_UI_WIDGET_URI = "ui://widget/muxo-card.html";
+export const MUXO_UI_MCP_APP_URI = "ui://widget/muxo-app.html";
+/**
+ * Tools whose results represent interactive user-facing milestones (catalog carousel,
+ * OAuth handoff, action plan review/edit, execution receipt, or workspace summary).
+ * Pure data/inspection helpers remain usable without forcing unnecessary widget remounts.
+ */
+export const UI_RENDERED_MCP_TOOL_NAMES = new Set([
+    "get_profile",
+    "get_organization",
+    "search_tools",
+    "start_connection",
+    "plan_action",
+    "get_plan",
+    "execute_read",
+    "execute_write",
+    "execute_admin",
+    "execute_financial",
+    "execute_provisioning",
+    "execute_destructive",
+    "get_receipt",
+]);
+export function mcpToolUiMeta(invoking, invoked, extra) {
+    return {
+        "openai/outputTemplate": MUXO_UI_WIDGET_URI,
+        "openai/toolInvocation/invoking": invoking,
+        "openai/toolInvocation/invoked": invoked,
+        "openai/widgetAccessible": true,
+        "openai/visibility": "public",
+        ui: {
+            resourceUri: MUXO_UI_WIDGET_URI,
+            visibility: ["model", "app"],
+        },
+        ...(extra || {}),
+    };
+}
+/**
+ * Extracts optional OpenAI / MCP Apps client hints from JSON-RPC `params._meta`
+ * (`openai/locale`, `openai/userAgent`, `openai/userLocation`, `openai/subject`,
+ * `openai/session`, `openai/organization`, `openai/widgetSessionId`).
+ * These are best-effort hints and must never be used for authorization decisions.
+ */
+export function extractOpenAiClientMeta(params) {
+    const rawMeta = params && typeof params._meta === "object" && params._meta !== null
+        ? params._meta
+        : {};
+    const locale = typeof rawMeta["openai/locale"] === "string"
+        ? rawMeta["openai/locale"]
+        : typeof rawMeta["webplus/i18n"] === "string"
+            ? rawMeta["webplus/i18n"]
+            : undefined;
+    const userAgent = typeof rawMeta["openai/userAgent"] === "string"
+        ? rawMeta["openai/userAgent"]
+        : undefined;
+    const userLocation = rawMeta["openai/userLocation"] &&
+        typeof rawMeta["openai/userLocation"] === "object" &&
+        !Array.isArray(rawMeta["openai/userLocation"])
+        ? rawMeta["openai/userLocation"]
+        : undefined;
+    const subject = typeof rawMeta["openai/subject"] === "string"
+        ? rawMeta["openai/subject"]
+        : undefined;
+    const session = typeof rawMeta["openai/session"] === "string"
+        ? rawMeta["openai/session"]
+        : undefined;
+    const organization = typeof rawMeta["openai/organization"] === "string"
+        ? rawMeta["openai/organization"]
+        : undefined;
+    const widgetSessionId = typeof rawMeta["openai/widgetSessionId"] === "string"
+        ? rawMeta["openai/widgetSessionId"]
+        : undefined;
+    return {
+        ...(locale ? { locale } : {}),
+        ...(userAgent ? { userAgent } : {}),
+        ...(userLocation ? { userLocation } : {}),
+        ...(subject ? { subject } : {}),
+        ...(session ? { session } : {}),
+        ...(organization ? { organization } : {}),
+        ...(widgetSessionId ? { widgetSessionId } : {}),
+    };
+}
+/**
+ * Enriches a tool descriptor for `tools/list` with both top-level `securitySchemes`
+ * and `_meta.securitySchemes` back-compat mirror per the OpenAI Plugin UI reference,
+ * as well as all four standard MCP tool annotations (`readOnlyHint`, `destructiveHint`,
+ * `idempotentHint`, `openWorldHint`).
+ */
+export function buildMcpToolDescriptor(tool) {
+    const schemes = securitySchemesForTool(tool.name);
+    const idempotentHint = typeof tool.annotations.idempotentHint === "boolean"
+        ? tool.annotations.idempotentHint
+        : tool.annotations.readOnlyHint;
+    return {
+        ...tool,
+        annotations: {
+            ...tool.annotations,
+            title: tool.annotations.title || tool.title,
+            idempotentHint,
+        },
+        securitySchemes: schemes,
+        _meta: {
+            ...(tool._meta || {}),
+            securitySchemes: schemes,
+        },
+    };
+}
+/**
+ * Builds the `_meta` object returned on `tools/call` results. Delivers widget-only
+ * metadata (`_meta`) without bloating the model-visible conversation transcript.
+ */
+export function buildMcpToolResultMeta(toolName, params) {
+    const clientMeta = extractOpenAiClientMeta(params);
+    const attachUi = UI_RENDERED_MCP_TOOL_NAMES.has(toolName);
+    return {
+        ...(attachUi
+            ? {
+                "openai/outputTemplate": MUXO_UI_WIDGET_URI,
+                ui: { resourceUri: MUXO_UI_WIDGET_URI },
+            }
+            : {}),
+        ...(clientMeta.widgetSessionId
+            ? { "openai/widgetSessionId": clientMeta.widgetSessionId }
+            : {}),
+        ...(clientMeta.locale ? { "openai/locale": clientMeta.locale } : {}),
+        ...(Object.keys(clientMeta).length > 0 ? { clientContext: clientMeta } : {}),
+        muxoWidget: {
+            toolName,
+            uiRendered: attachUi,
+            invokedAt: new Date().toISOString(),
+        },
+    };
+}
+/**
+ * Builds the `_meta` object for error tool results, including RFC 7235
+ * `_meta["mcp/www_authenticate"]` when an authentication challenge is required.
+ */
+export function buildMcpErrorResultMeta(err, baseUrl = "https://api.muxo.ai") {
+    const cleanBase = String(baseUrl || "https://api.muxo.ai").replace(/\/+$/, "");
+    const statusCode = err?.statusCode;
+    const code = err?.code;
+    if (statusCode === 401 ||
+        code === "auth_required" ||
+        code === "unauthorized") {
+        return {
+            "mcp/www_authenticate": [
+                `Bearer resource_metadata="${cleanBase}/.well-known/oauth-protected-resource/mcp", scope="${MCP_TOOLS_OAUTH_SCOPE}"`,
+            ],
+        };
+    }
+    return undefined;
+}
 /** Stable per-workspace agent identity returned at agent signup on both runtimes. */
 export function workspaceAgentDid(workspaceId) {
     return `did:agent:muxo:${workspaceId}`;
 }
 /** JSON-RPC methods that anonymous MCP clients may call for discovery. */
 export const PUBLIC_MCP_METHODS = new Set([
+    "server/discover",
     "initialize",
     "ping",
     "tools/list",
@@ -27,6 +494,10 @@ export const PUBLIC_MCP_METHODS = new Set([
     "resources/read",
     "resources/templates/list",
     "prompts/list",
+    "completion/complete",
+    "subscriptions/listen",
+    "skills/list",
+    "skills/get",
 ]);
 /** True when a single JSON-RPC MCP request only needs public discovery access. */
 export function isPublicMcpRequest(rpc) {
@@ -107,6 +578,9 @@ export const GET_RUN_CONTEXT_ACTIONS = [
     "forget",
     "memory_graph",
     "set_guardrail",
+    "reset_guardrails",
+    "check_policy",
+    "kill_switch",
     "governance_status",
     "scan_context",
     "list_workspaces",
@@ -153,6 +627,51 @@ export function unknownToolError(slug) {
 export function buildApprovalUrl(baseUrl, planId) {
     return `${baseUrl.replace(/\/$/, "")}/approve/${encodeURIComponent(planId)}`;
 }
+export function buildApprovalHumanHandoff(baseUrl, plan) {
+    const approvalUrl = buildApprovalUrl(baseUrl, plan.id);
+    const ctaLabel = "Review & approve";
+    const headline = `Muxo needs your approval to run ${plan.toolSlug}`;
+    const instructions = `Open ${approvalUrl} to review and approve this ${plan.riskLevel}-risk action with one click (or run \`muxo approve ${plan.id}\`). Nothing runs until you approve.`;
+    const markdownForUser = `### Muxo Approval Required\n**[${ctaLabel} in Muxo](${approvalUrl})**\n\nPlan \`${plan.id}\` (\`${plan.toolSlug}\` · **${plan.riskLevel} risk**) is held by your Muxo workspace guardrails. Open the link above to review and approve it in one click (or run \`muxo approve ${plan.id}\`). Nothing executes until you approve.`;
+    return {
+        kind: "approval",
+        brand: "Muxo",
+        url: approvalUrl,
+        ctaLabel,
+        headline,
+        instructions,
+        markdownForUser,
+        planId: plan.id,
+    };
+}
+export function buildOAuthHumanHandoff(params) {
+    const slug = String(params.providerSlug || "app")
+        .trim()
+        .toLowerCase()
+        .replace(/^(app\.|resource\.)/, "");
+    const name = params.providerName ||
+        slug.charAt(0).toUpperCase() + slug.slice(1);
+    const url = params.redirectUrl || null;
+    const ctaLabel = `Connect ${name}`;
+    const headline = `Connect ${name} to continue`;
+    const instructions = params.instructions ||
+        (url
+            ? `Open ${url} in your browser to authorize ${name}, then call wait_for_connection({ provider: "${slug}" }).`
+            : `Call start_connection({ provider: "${slug}" }) to generate a Muxo authorization link for ${name}.`);
+    const markdownForUser = url
+        ? `### Connect ${name} with Muxo\n**[${ctaLabel} in Muxo](${url})**\n\nAuthorize **${name}** in your browser via **Muxo Connected Apps**. Your credentials are sealed in your isolated Muxo workspace vault and never exposed to the AI model. Once connected, tell me to continue.`
+        : `### Connect ${name} with Muxo\nAuthorization is required for **${name}** via **Muxo Connected Apps**.`;
+    return {
+        kind: "oauth",
+        brand: "Muxo",
+        url,
+        ctaLabel,
+        headline,
+        instructions,
+        markdownForUser,
+        provider: slug,
+    };
+}
 /** Structured response returned when execute_<risk> is called on a plan still awaiting approval. */
 export function buildApprovalRequiredPayload(baseUrl, plan) {
     const approvalUrl = buildApprovalUrl(baseUrl, plan.id);
@@ -163,14 +682,7 @@ export function buildApprovalRequiredPayload(baseUrl, plan) {
         riskLevel: plan.riskLevel,
         approvalStatus: plan.approvalStatus,
         approvalUrl,
-        humanHandoff: {
-            kind: "approval",
-            url: approvalUrl,
-            ctaLabel: "Review & approve",
-            headline: `Muxo needs your approval to run ${plan.toolSlug}`,
-            instructions: `Open ${approvalUrl} to review and approve this ${plan.riskLevel}-risk action with one click (or run \`muxo approve ${plan.id}\`). Nothing runs until you approve.`,
-            planId: plan.id,
-        },
+        humanHandoff: buildApprovalHumanHandoff(baseUrl, plan),
         polling: {
             tool: "get_plan",
             input: { plan_id: plan.id, wait_for_approval: true, timeout_seconds: 30 },
@@ -304,9 +816,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: false,
         },
-        _meta: {
-            "openai/profile": true,
-        },
+        _meta: mcpToolUiMeta("Loading Muxo workspace profile…", "Loaded workspace profile", { "openai/profile": true }),
     },
     {
         name: "get_organization",
@@ -322,6 +832,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: false,
         },
+        _meta: mcpToolUiMeta("Loading organization & guardrails summary…", "Loaded organization summary"),
     },
     {
         name: "search_tools",
@@ -359,6 +870,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: true,
         },
+        _meta: mcpToolUiMeta("Searching Muxo tool catalog…", "Found matching tools"),
     },
     {
         name: "inspect_tool",
@@ -380,6 +892,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: false,
         },
+        _meta: mcpToolUiMeta("Inspecting tool schema & risk lane…", "Inspected tool schema"),
     },
     {
         name: "connection_status",
@@ -405,23 +918,24 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: true,
         },
+        _meta: mcpToolUiMeta("Checking provider connection status…", "Checked connection status"),
     },
     {
         name: "start_connection",
         title: "Start OAuth Connection Handoff",
-        description: "Initiate a managed OAuth connection handoff for a Connected App or link a Cloud Infrastructure provider.",
+        description: "Initiate a managed OAuth connection handoff for a Connected SaaS App (e.g. GitHub, Gmail, Slack, Notion, Linear). Cloud Infrastructure & Hosting providers (vercel, cloudflare, netlify, render, herenow, turso, neon, supabase, upstash, resend, etc.) are already connected via Stripe Projects (stripe_projects) and do NOT require start_connection or OAuth — use resource.<provider>.* with plan_action and execute_provisioning directly.",
         inputSchema: {
             type: "object",
             required: ["provider"],
             properties: {
                 provider: {
                     type: "string",
-                    description: "Provider or toolkit slug (e.g. 'github', 'gmail', 'slack', 'neon')",
+                    description: "Connected SaaS App slug (e.g. 'github', 'gmail', 'slack', 'notion', 'linear'). For Cloud Infrastructure (vercel, netlify, cloudflare, turso, neon, supabase, etc.), no OAuth connection is needed.",
                 },
                 lane: {
                     type: "string",
                     enum: ["composio_sdk", "stripe_projects"],
-                    description: "Provider lane (defaults to composio_sdk unless prefixed with resource.)",
+                    description: "Provider lane (Cloud Infrastructure providers automatically route to stripe_projects with zero OAuth; SaaS apps use composio_sdk).",
                 },
                 callback_url: {
                     type: "string",
@@ -435,6 +949,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: true,
         },
+        _meta: mcpToolUiMeta("Preparing OAuth connection handoff…", "Prepared OAuth connection link"),
     },
     {
         name: "wait_for_connection",
@@ -461,6 +976,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: true,
         },
+        _meta: mcpToolUiMeta("Verifying OAuth connection status…", "Verified OAuth connection status"),
     },
     {
         name: "plan_action",
@@ -490,6 +1006,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: false,
         },
+        _meta: mcpToolUiMeta("Evaluating guardrails & creating action plan…", "Created governed action plan"),
     },
     {
         name: "get_plan",
@@ -516,6 +1033,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: false,
         },
+        _meta: mcpToolUiMeta("Checking action plan status…", "Loaded action plan status"),
     },
     {
         name: "get_run_context",
@@ -537,17 +1055,32 @@ export const MUXO_MCP_TOOLS = [
                         "forget",
                         "memory_graph",
                         "set_guardrail",
+                        "reset_guardrails",
+                        "check_policy",
+                        "kill_switch",
                         "governance_status",
                         "scan_context",
                         "list_workspaces",
                         "switch_workspace",
                         "onboard_team",
                     ],
-                    description: "Control-plane operation: 'inspect' (default), 'remember' (save fact/preference), 'recall' (list memories), 'forget' (delete matching memories), 'memory_graph' (bi-temporal entity/relationship lineage), 'set_guardrail' (apply plain-English or structured parameter_rules guardrail), 'governance_status', 'scan_context' (OWASP ASI-06 check), 'list_workspaces', 'switch_workspace', or 'onboard_team'",
+                    description: "Control-plane operation: 'inspect' (default), 'remember' (save fact/preference), 'recall' (list memories), 'forget' (delete matching memories), 'memory_graph' (bi-temporal entity/relationship lineage), 'set_guardrail' (apply plain-English or structured parameter_rules guardrail), 'reset_guardrails' (restore default safe guardrails), 'check_policy' (dry-run evaluate tool_slug + input against policy and parameter guardrails before planning), 'kill_switch' (pause/resume agent execution), 'governance_status' (Microsoft 9-module status + LLM policy brief), 'scan_context' (OWASP ASI-06 check), 'list_workspaces', 'switch_workspace', or 'onboard_team'",
                 },
                 prompt: {
                     type: "string",
-                    description: "Natural-language instruction when action is 'remember', 'set_guardrail', or 'scan_context' (e.g. 'Only allow sending emails to @muxo.ai' or 'Require approval for Stripe refunds over $50, auto-approve under $50')",
+                    description: "Natural-language instruction when action is 'remember', 'set_guardrail', 'kill_switch', or 'scan_context' (e.g. 'Only allow sending emails to @muxo.ai' or 'Require approval for Stripe refunds over $50, auto-approve under $50')",
+                },
+                tool_slug: {
+                    type: "string",
+                    description: "Tool slug to dry-run evaluate when action='check_policy' (e.g. 'app.gmail.send_email', 'billing.stripe.create_refund')",
+                },
+                input: {
+                    type: "object",
+                    description: "Tool arguments object to dry-run evaluate against parameter guardrails and learned defaults when action='check_policy'",
+                },
+                enabled: {
+                    type: "boolean",
+                    description: "When action='kill_switch', set true to pause all workspace agent execution or false to resume execution",
                 },
                 parameter_rules: {
                     type: "array",
@@ -644,6 +1177,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: false,
         },
+        _meta: mcpToolUiMeta("Loading workspace context, memory & guardrails…", "Loaded workspace context & guardrails"),
     },
     {
         name: "execute_read",
@@ -662,6 +1196,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: true,
         },
+        _meta: mcpToolUiMeta("Executing governed read operation…", "Completed read operation"),
     },
     {
         name: "execute_write",
@@ -680,6 +1215,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: true,
         },
+        _meta: mcpToolUiMeta("Executing governed write operation…", "Completed write operation"),
     },
     {
         name: "execute_admin",
@@ -698,6 +1234,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: true,
         },
+        _meta: mcpToolUiMeta("Executing governed admin operation…", "Completed admin operation"),
     },
     {
         name: "execute_financial",
@@ -716,6 +1253,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: true,
         },
+        _meta: mcpToolUiMeta("Executing governed financial operation…", "Completed financial operation"),
     },
     {
         name: "execute_provisioning",
@@ -734,6 +1272,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: true,
         },
+        _meta: mcpToolUiMeta("Provisioning cloud infrastructure via Stripe Projects…", "Provisioned cloud resource"),
     },
     {
         name: "execute_destructive",
@@ -752,6 +1291,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: true,
             openWorldHint: true,
         },
+        _meta: mcpToolUiMeta("Executing approved destructive operation…", "Completed destructive operation"),
     },
     {
         name: "get_run",
@@ -770,6 +1310,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: false,
         },
+        _meta: mcpToolUiMeta("Loading execution run details…", "Loaded execution run"),
     },
     {
         name: "cancel_run",
@@ -792,6 +1333,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: true,
             openWorldHint: false,
         },
+        _meta: mcpToolUiMeta("Cancelling execution run…", "Cancelled execution run"),
     },
     {
         name: "get_receipt",
@@ -820,6 +1362,7 @@ export const MUXO_MCP_TOOLS = [
             destructiveHint: false,
             openWorldHint: false,
         },
+        _meta: mcpToolUiMeta("Verifying Ed25519 & SHA-256 execution receipt…", "Verified cryptographic receipt"),
     },
 ];
 /**
@@ -943,11 +1486,40 @@ export function attachMcpHarnessGuidance(toolName, toolArgs, output) {
             break;
         }
         case "start_connection": {
-            const provider = String(obj.providerSlug || toolArgs.provider || "<provider>");
+            const conn = obj.connection && typeof obj.connection === "object" ? obj.connection : obj;
+            const provider = String(conn.providerSlug || obj.providerSlug || toolArgs.provider || "<provider>");
+            const providerName = String(conn.providerName || obj.providerName || provider);
+            const redirectUrl = (conn.redirectUrl ?? obj.redirectUrl ?? null);
+            const isStripeProjects = conn.lane === "stripe_projects" || isStripeProjectsExclusiveProvider(provider);
+            if (isStripeProjects) {
+                const canonicalSlug = resolveStripeProjectsCanonicalToolSlug(provider) || `resource.${provider}.project`;
+                guidance = {
+                    summary: `${providerName} (${provider}) is connected via Stripe Projects Cloud Infrastructure (zero OAuth handoff required). Call plan_action with ${canonicalSlug} and execute_provisioning directly.`,
+                    nextToolCalls: [
+                        {
+                            tool: "plan_action",
+                            input: {
+                                tool_slug: canonicalSlug,
+                                input: { resource_name: `${provider}-service`, plan: "free" },
+                                reason: `Provision ${providerName} via Stripe Projects`,
+                            },
+                            when: "Immediately; Stripe Projects providers do not require OAuth handoff",
+                        },
+                    ],
+                };
+                break;
+            }
+            if (redirectUrl && !obj.humanHandoff) {
+                obj.humanHandoff = buildOAuthHumanHandoff({
+                    providerSlug: provider,
+                    providerName,
+                    redirectUrl,
+                });
+            }
             guidance = {
-                summary: obj.redirectUrl
-                    ? `Share ${String(obj.redirectUrl)} with the user so they can authorize ${provider}, then call wait_for_connection.`
-                    : `Connection status for ${provider}: ${String(obj.status || "active")}.`,
+                summary: redirectUrl
+                    ? `Share ${String(redirectUrl)} with the user so they can authorize ${provider} with Muxo, then call wait_for_connection.`
+                    : `Connection status for ${provider}: ${String(conn.status || obj.status || "active")}.`,
                 nextToolCalls: [
                     {
                         tool: "wait_for_connection",
@@ -960,9 +1532,37 @@ export function attachMcpHarnessGuidance(toolName, toolArgs, output) {
         }
         case "wait_for_connection": {
             const provider = String(obj.provider || toolArgs.provider || "<provider>");
+            const redirectUrl = (obj.redirectUrl ?? obj.connection?.redirectUrl ?? null);
+            const isStripeProjects = obj.connection?.lane === "stripe_projects" ||
+                isStripeProjectsExclusiveProvider(provider);
+            if (isStripeProjects) {
+                const canonicalSlug = resolveStripeProjectsCanonicalToolSlug(provider) || `resource.${provider}.project`;
+                guidance = {
+                    summary: `${provider} is connected and active via Stripe Projects Cloud Infrastructure (zero OAuth required). Proceed to plan_action with ${canonicalSlug} and execute_provisioning.`,
+                    nextToolCalls: [
+                        {
+                            tool: "plan_action",
+                            input: {
+                                tool_slug: canonicalSlug,
+                                input: { resource_name: `${provider}-service`, plan: "free" },
+                                reason: `Provision ${provider} via Stripe Projects`,
+                            },
+                            when: "Now; Stripe Projects provider is active",
+                        },
+                    ],
+                };
+                break;
+            }
+            if (!obj.connected && redirectUrl && !obj.humanHandoff) {
+                obj.humanHandoff = buildOAuthHumanHandoff({
+                    providerSlug: provider,
+                    providerName: obj.connection?.providerName,
+                    redirectUrl,
+                });
+            }
             guidance = obj.connected
                 ? {
-                    summary: `${provider} is connected and active. Proceed to plan_action or execute_<riskLevel>.`,
+                    summary: `${provider} is connected and active in Muxo. Proceed to plan_action or execute_<riskLevel>.`,
                     nextToolCalls: [
                         {
                             tool: "plan_action",
@@ -976,7 +1576,7 @@ export function attachMcpHarnessGuidance(toolName, toolArgs, output) {
                     ],
                 }
                 : {
-                    summary: `Still awaiting user OAuth completion for ${provider}. Ask the user to open ${String(obj.redirectUrl || "the authorization URL")} and call wait_for_connection again.`,
+                    summary: `Still awaiting user OAuth completion for ${provider}. Ask the user to open ${String(redirectUrl || "the authorization URL")} and call wait_for_connection again.`,
                     nextToolCalls: [
                         {
                             tool: "wait_for_connection",
@@ -1020,6 +1620,80 @@ export function attachMcpHarnessGuidance(toolName, toolArgs, output) {
                     };
             break;
         }
+        case "plan_action": {
+            const plan = obj.plan || obj;
+            const planId = String(plan?.id || obj.id || "<plan_id>");
+            const risk = String(plan?.riskLevel || obj.riskLevel || "read");
+            const status = String(plan?.approvalStatus || obj.approvalStatus || "auto_approved");
+            const authHandoff = plan?.authHandoff || obj.authHandoff;
+            if (authHandoff?.required) {
+                const provider = String(authHandoff.providerSlug || "app");
+                guidance = {
+                    summary: `Plan ${planId} requires OAuth connection for ${provider}. Share ${String(authHandoff.redirectUrl || "the connection URL")} with the user, call wait_for_connection, then execute_${risk}.`,
+                    nextToolCalls: [
+                        {
+                            tool: "wait_for_connection",
+                            input: { provider, timeout_seconds: 30 },
+                            when: "While the user completes the browser OAuth flow",
+                        },
+                        {
+                            tool: `execute_${risk}`,
+                            input: { plan_id: planId },
+                            when: "After OAuth connection is active and plan is approved",
+                        },
+                    ],
+                };
+            }
+            else if (status === "approved" || status === "auto_approved") {
+                guidance = {
+                    summary: `Plan ${planId} is ${status} under workspace policy. Call execute_${risk} to execute it now.`,
+                    nextToolCalls: [
+                        {
+                            tool: `execute_${risk}`,
+                            input: { plan_id: planId },
+                            when: "Immediately; plan passed workspace guardrails",
+                        },
+                    ],
+                };
+            }
+            else if (status === "pending_approval") {
+                const approvalUrl = obj.humanHandoff?.url ||
+                    plan?.humanHandoff?.url ||
+                    `/approve/${planId}`;
+                guidance = {
+                    summary: `Plan ${planId} (${risk} risk) requires human owner approval under active workspace guardrails. Share ${approvalUrl} with the user and poll get_plan(wait_for_approval: true).`,
+                    nextToolCalls: [
+                        {
+                            tool: "get_plan",
+                            input: {
+                                plan_id: planId,
+                                wait_for_approval: true,
+                                timeout_seconds: 25,
+                            },
+                            when: "After sharing the approval link with the user",
+                        },
+                        {
+                            tool: `execute_${risk}`,
+                            input: { plan_id: planId },
+                            when: "Once get_plan reports approvalStatus='approved'",
+                        },
+                    ],
+                };
+            }
+            else {
+                guidance = {
+                    summary: `Plan ${planId} was ${status} by workspace policy (${String(plan?.policyReason || obj.policyReason || "guardrail rule")}). Call get_run_context({ action: 'governance_status' }) to inspect or adjust guardrails.`,
+                    nextToolCalls: [
+                        {
+                            tool: "get_run_context",
+                            input: { action: "governance_status" },
+                            when: "To inspect active workspace guardrails and parameter rules",
+                        },
+                    ],
+                };
+            }
+            break;
+        }
         case "execute_read":
         case "execute_write":
         case "execute_admin":
@@ -1041,26 +1715,44 @@ export function attachMcpHarnessGuidance(toolName, toolArgs, output) {
         }
         case "get_run_context":
         case "set_guardrail":
+        case "reset_guardrails":
+        case "check_policy":
+        case "kill_switch":
+        case "governance_status":
         case "configure_guardrails": {
-            guidance = {
-                summary: "Workspace context, memory defaults, and guardrails updated/loaded. Use plan_action to propose governed actions or get_run_context with action='set_guardrail'|'remember'|'forget' to update workspace state.",
-                nextToolCalls: [
-                    {
-                        tool: "search_tools",
-                        input: { query: "" },
-                        when: "To find tools matching the user's goal",
-                    },
-                    {
-                        tool: "plan_action",
-                        input: {
-                            tool_slug: "<tool_slug>",
-                            input: {},
-                            reason: "Planned action under active workspace guardrails",
+            const act = String(obj.action || toolArgs.action || toolName || "inspect");
+            if (act === "check_policy" && Array.isArray(obj.nextToolCalls) && obj.nextToolCalls.length > 0) {
+                guidance = {
+                    summary: String(obj.remediationForLlm ||
+                        `Policy simulation complete: decision=${String(obj.decision || "auto_approved")}.`),
+                    nextToolCalls: obj.nextToolCalls,
+                };
+            }
+            else {
+                guidance = {
+                    summary: "Workspace context, memory defaults, and guardrails loaded/updated. Use get_run_context({ action: 'check_policy', tool_slug, input }) to dry-run test policy compliance, or plan_action to propose governed actions.",
+                    nextToolCalls: [
+                        {
+                            tool: "get_run_context",
+                            input: {
+                                action: "check_policy",
+                                tool_slug: "instant.web.search",
+                                input: { query: "example" },
+                            },
+                            when: "To dry-run check if a tool + input will pass active guardrails before creating a plan",
                         },
-                        when: "To evaluate guardrails and prepare an action for execution",
-                    },
-                ],
-            };
+                        {
+                            tool: "plan_action",
+                            input: {
+                                tool_slug: "<tool_slug>",
+                                input: {},
+                                reason: "Planned action under active workspace guardrails",
+                            },
+                            when: "To evaluate guardrails and prepare an action for execution",
+                        },
+                    ],
+                };
+            }
             break;
         }
         default:
@@ -1074,3 +1766,794 @@ export function attachMcpHarnessGuidance(toolName, toolArgs, output) {
     }
     return output;
 }
+/**
+ * Canonical OpenAI Plugin UI (`text/html+skybridge`) & MCP Apps (`text/html;profile=mcp-app`)
+ * widget resource descriptors exposed by `resources/list` and `resources/read`.
+ * Follows:
+ * - https://developers.openai.com/plugins/reference
+ * - https://developers.openai.com/plugins/build/chatgpt-ui
+ * - https://developers.openai.com/plugins/concepts/ui-guidelines
+ */
+export const MUXO_UI_CSP_DOMAINS = [
+    "https://api.muxo.ai",
+    "https://muxo.ai",
+    "https://app.muxo.ai",
+];
+export const MUXO_UI_REDIRECT_DOMAINS = [
+    "https://api.muxo.ai",
+    "https://muxo.ai",
+    "https://app.muxo.ai",
+    "https://connect.composio.dev",
+    "https://backend.composio.dev",
+];
+function buildMuxoUiResourceMeta(description) {
+    return {
+        ui: {
+            prefersBorder: true,
+            domain: "https://api.muxo.ai",
+            csp: {
+                connectDomains: [...MUXO_UI_CSP_DOMAINS],
+                resourceDomains: [...MUXO_UI_CSP_DOMAINS],
+            },
+        },
+        "openai/ui": {
+            availableDisplayModes: ["inline", "fullscreen"],
+        },
+        "openai/widgetDescription": description,
+        "openai/widgetPrefersBorder": true,
+        "openai/widgetDomain": "https://api.muxo.ai",
+        "openai/widgetCSP": {
+            connect_domains: [...MUXO_UI_CSP_DOMAINS],
+            resource_domains: [...MUXO_UI_CSP_DOMAINS],
+            redirect_domains: [...MUXO_UI_REDIRECT_DOMAINS],
+        },
+    };
+}
+export const MUXO_UI_RESOURCES = [
+    {
+        uri: MUXO_UI_WIDGET_URI,
+        name: "Muxo Action, Catalog & Receipt Card",
+        title: "Muxo Action, Catalog & Receipt Card",
+        description: "Interactive ChatGPT inline card, tool catalog carousel, OAuth/approval handoff CTA, and fullscreen cryptographic receipt & SEO inspector.",
+        mimeType: "text/html+skybridge",
+        _meta: buildMuxoUiResourceMeta("Renders an inline card, 3-8 item tool carousel, or fullscreen inspector for Muxo action plans, OAuth connections, cloud provisioning, and Ed25519 receipts."),
+    },
+    {
+        uri: MUXO_UI_MCP_APP_URI,
+        name: "Muxo MCP App Widget",
+        title: "Muxo MCP App Widget",
+        description: "Standard MCP App HTML widget (text/html;profile=mcp-app) for Muxo plans, tool discovery carousels, and cryptographic receipt verification.",
+        mimeType: "text/html;profile=mcp-app",
+        _meta: buildMuxoUiResourceMeta("Standard MCP App HTML widget for Muxo action plans, OAuth handoffs, tool catalog carousels, and receipt verification."),
+    },
+];
+/**
+ * Renders the self-contained OpenAI Plugin UI / MCP App widget HTML (`ui://widget/muxo-card.html`).
+ * Strictly adheres to https://developers.openai.com/plugins/concepts/ui-guidelines:
+ * - System font stack (`-apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif`)
+ * - Light & dark mode CSS variables (`window.openai.theme` + `prefers-color-scheme`)
+ * - Brand accent (`#6366F1` light / `#818CF8` dark) only on primary buttons & badges (WCAG AA)
+ * - Monochromatic outlined SVG icons; no duplicate app logo header
+ * - Auto-fitting inline card with no nested scrollbars (`notifyIntrinsicHeight`), max 2 bottom CTAs
+ * - Inline 3–8 card carousel for `search_tools` catalog results
+ * - Inline editable parameter controls for `plan_action` before clicking Execute
+ * - Expand to fullscreen (`requestDisplayMode({ mode: "fullscreen" })`) for rich inspection
+ */
+export function renderMuxoUiWidgetHtml(baseUrl = "https://api.muxo.ai") {
+    const safeBaseUrl = String(baseUrl || "https://api.muxo.ai").replace(/\/+$/, "");
+    return `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>Muxo Action Card</title>
+  <style>
+    :root {
+      color-scheme: light dark;
+      --mx-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+      --mx-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
+      --mx-bg: #ffffff;
+      --mx-surface: #f7f7f8;
+      --mx-border: rgba(13, 13, 13, 0.1);
+      --mx-text: #0d0d0d;
+      --mx-muted: #5d5d65;
+      --mx-accent: #6366F1;
+      --mx-accent-fg: #ffffff;
+      --mx-badge-bg: rgba(99, 102, 241, 0.1);
+      --mx-badge-fg: #4338ca;
+      --mx-ok-bg: rgba(16, 185, 129, 0.12);
+      --mx-ok-fg: #047857;
+      --mx-warn-bg: rgba(245, 158, 11, 0.14);
+      --mx-warn-fg: #b45309;
+      --mx-err-bg: rgba(239, 68, 68, 0.12);
+      --mx-err-fg: #b91c1c;
+    }
+    @media (prefers-color-scheme: dark) {
+      :root:not([data-theme="light"]) {
+        --mx-bg: #171717;
+        --mx-surface: #212121;
+        --mx-border: rgba(255, 255, 255, 0.12);
+        --mx-text: #ececec;
+        --mx-muted: #9b9ba4;
+        --mx-accent: #818CF8;
+        --mx-accent-fg: #0d0d0d;
+        --mx-badge-bg: rgba(129, 140, 248, 0.16);
+        --mx-badge-fg: #c7d2fe;
+        --mx-ok-bg: rgba(16, 185, 129, 0.18);
+        --mx-ok-fg: #6ee7b7;
+        --mx-warn-bg: rgba(245, 158, 11, 0.2);
+        --mx-warn-fg: #fcd34d;
+        --mx-err-bg: rgba(239, 68, 68, 0.2);
+        --mx-err-fg: #fca5a5;
+      }
+    }
+    :root[data-theme="dark"] {
+      --mx-bg: #171717;
+      --mx-surface: #212121;
+      --mx-border: rgba(255, 255, 255, 0.12);
+      --mx-text: #ececec;
+      --mx-muted: #9b9ba4;
+      --mx-accent: #818CF8;
+      --mx-accent-fg: #0d0d0d;
+      --mx-badge-bg: rgba(129, 140, 248, 0.16);
+      --mx-badge-fg: #c7d2fe;
+      --mx-ok-bg: rgba(16, 185, 129, 0.18);
+      --mx-ok-fg: #6ee7b7;
+      --mx-warn-bg: rgba(245, 158, 11, 0.2);
+      --mx-warn-fg: #fcd34d;
+      --mx-err-bg: rgba(239, 68, 68, 0.2);
+      --mx-err-fg: #fca5a5;
+    }
+    * { box-sizing: border-box; margin: 0; padding: 0; }
+    html, body {
+      font-family: var(--mx-font);
+      font-size: 14px;
+      line-height: 1.45;
+      color: var(--mx-text);
+      background: transparent;
+      -webkit-font-smoothing: antialiased;
+    }
+    body[data-mode="inline"] {
+      overflow: hidden;
+    }
+    .mx-card {
+      background: var(--mx-bg);
+      border: 1px solid var(--mx-border);
+      border-radius: 14px;
+      padding: 16px;
+      display: flex;
+      flex-direction: column;
+      gap: 12px;
+    }
+    .mx-header {
+      display: flex;
+      align-items: flex-start;
+      justify-content: space-between;
+      gap: 10px;
+    }
+    .mx-title-wrap {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+      min-width: 0;
+    }
+    .mx-icon {
+      width: 18px;
+      height: 18px;
+      flex-shrink: 0;
+      color: var(--mx-muted);
+    }
+    .mx-title {
+      font-size: 15px;
+      font-weight: 600;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    .mx-subtitle {
+      font-size: 12px;
+      color: var(--mx-muted);
+      margin-top: 2px;
+    }
+    .mx-header-right {
+      display: flex;
+      align-items: center;
+      gap: 6px;
+      flex-shrink: 0;
+    }
+    .mx-badge {
+      display: inline-flex;
+      align-items: center;
+      gap: 4px;
+      padding: 2px 8px;
+      border-radius: 999px;
+      font-size: 11px;
+      font-weight: 600;
+      letter-spacing: 0.01em;
+      background: var(--mx-badge-bg);
+      color: var(--mx-badge-fg);
+    }
+    .mx-badge.ok { background: var(--mx-ok-bg); color: var(--mx-ok-fg); }
+    .mx-badge.warn { background: var(--mx-warn-bg); color: var(--mx-warn-fg); }
+    .mx-badge.err { background: var(--mx-err-bg); color: var(--mx-err-fg); }
+    .mx-expand-btn {
+      background: transparent;
+      border: 1px solid var(--mx-border);
+      color: var(--mx-muted);
+      border-radius: 8px;
+      width: 26px;
+      height: 26px;
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      cursor: pointer;
+    }
+    .mx-expand-btn:hover { color: var(--mx-text); background: var(--mx-surface); }
+    .mx-grid {
+      display: grid;
+      grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
+      gap: 8px;
+    }
+    .mx-stat {
+      background: var(--mx-surface);
+      border-radius: 10px;
+      padding: 8px 10px;
+    }
+    .mx-stat-label {
+      font-size: 11px;
+      color: var(--mx-muted);
+    }
+    .mx-stat-value {
+      font-size: 13px;
+      font-weight: 600;
+      margin-top: 2px;
+      word-break: break-word;
+    }
+    .mx-mono { font-family: var(--mx-mono); font-size: 12px; }
+    .mx-edit-row {
+      display: flex;
+      flex-direction: column;
+      gap: 6px;
+      background: var(--mx-surface);
+      padding: 10px;
+      border-radius: 10px;
+    }
+    .mx-edit-field {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 8px;
+    }
+    .mx-edit-field label {
+      font-size: 12px;
+      color: var(--mx-muted);
+      min-width: 90px;
+    }
+    .mx-edit-field input {
+      flex: 1;
+      background: var(--mx-bg);
+      color: var(--mx-text);
+      border: 1px solid var(--mx-border);
+      border-radius: 6px;
+      padding: 4px 8px;
+      font-family: var(--mx-font);
+      font-size: 12px;
+    }
+    /* Inline Carousel (3-8 items per OpenAI UI Guidelines) */
+    .mx-carousel {
+      display: flex;
+      gap: 10px;
+      overflow-x: auto;
+      scroll-snap-type: x mandatory;
+      padding-bottom: 4px;
+      scrollbar-width: none;
+    }
+    .mx-carousel::-webkit-scrollbar { display: none; }
+    .mx-carousel-item {
+      scroll-snap-align: start;
+      flex: 0 0 210px;
+      background: var(--mx-surface);
+      border: 1px solid var(--mx-border);
+      border-radius: 12px;
+      padding: 12px;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      gap: 8px;
+    }
+    .mx-carousel-title {
+      font-size: 13px;
+      font-weight: 600;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    .mx-carousel-desc {
+      font-size: 12px;
+      color: var(--mx-muted);
+      display: -webkit-box;
+      -webkit-line-clamp: 2;
+      -webkit-box-orient: vertical;
+      overflow: hidden;
+    }
+    /* Max 2 bottom actions per Inline Card */
+    .mx-actions {
+      display: flex;
+      align-items: center;
+      justify-content: flex-end;
+      gap: 8px;
+      padding-top: 4px;
+    }
+    .mx-btn {
+      appearance: none;
+      border-radius: 8px;
+      padding: 7px 12px;
+      font-family: var(--mx-font);
+      font-size: 13px;
+      font-weight: 600;
+      cursor: pointer;
+      border: 1px solid transparent;
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      gap: 6px;
+      transition: opacity 0.15s ease;
+    }
+    .mx-btn:disabled { opacity: 0.55; cursor: default; }
+    .mx-btn-primary {
+      background: var(--mx-accent);
+      color: var(--mx-accent-fg);
+    }
+    .mx-btn-secondary {
+      background: transparent;
+      border-color: var(--mx-border);
+      color: var(--mx-text);
+    }
+    .mx-fullscreen-details {
+      display: none;
+      background: var(--mx-surface);
+      border-radius: 10px;
+      padding: 10px;
+      font-family: var(--mx-mono);
+      font-size: 11px;
+      white-space: pre-wrap;
+      word-break: break-all;
+    }
+    body[data-mode="fullscreen"] .mx-fullscreen-details {
+      display: block;
+    }
+  </style>
+</head>
+<body data-mode="inline">
+  <div id="mx-root" class="mx-card" role="region" aria-label="Muxo Action Widget"></div>
+  <script>
+    (function () {
+      const BASE_URL = ${JSON.stringify(safeBaseUrl)};
+      const root = document.getElementById("mx-root");
+      const pendingRequests = new Map();
+      let nextRequestId = 1;
+      let currentData = null;
+      let latestToolInput = null;
+      let editedInputs = {};
+
+      function mcpRpcRequest(method, params) {
+        if (!window.parent || window.parent === window) {
+          return Promise.resolve(null);
+        }
+        const id = nextRequestId++;
+        window.parent.postMessage({ jsonrpc: "2.0", id, method: method, params: params || {} }, "*");
+        return new Promise(function (resolve, reject) {
+          pendingRequests.set(id, { resolve: resolve, reject: reject });
+          setTimeout(function () {
+            if (pendingRequests.has(id)) {
+              pendingRequests.delete(id);
+              resolve(null);
+            }
+          }, 15000);
+        });
+      }
+
+      function persistWidgetState(modelContent, privateContent) {
+        const snapshot = {
+          modelContent: modelContent,
+          privateContent: privateContent || {},
+        };
+        if (window.openai && typeof window.openai.setWidgetState === "function") {
+          window.openai.setWidgetState(snapshot);
+        }
+        mcpRpcRequest("ui/update-model-context", { context: modelContent });
+      }
+
+      function syncThemeAndMode() {
+        const oa = window.openai || {};
+        if (oa.theme === "dark" || oa.theme === "light") {
+          document.documentElement.setAttribute("data-theme", oa.theme);
+        }
+        if (oa.locale && typeof oa.locale === "string") {
+          document.documentElement.lang = oa.locale;
+        }
+        const mode = oa.displayMode === "fullscreen" ? "fullscreen" : "inline";
+        document.body.setAttribute("data-mode", mode);
+      }
+
+      function notifyHeight() {
+        if (window.openai && typeof window.openai.notifyIntrinsicHeight === "function") {
+          window.openai.notifyIntrinsicHeight(document.body.scrollHeight);
+        }
+      }
+
+      function esc(val) {
+        return String(val == null ? "" : val)
+          .replace(/&/g, "&amp;")
+          .replace(/</g, "&lt;")
+          .replace(/>/g, "&gt;")
+          .replace(/"/g, "&quot;");
+      }
+
+      function resolveUrl(href) {
+        if (!href) return "";
+        return href.startsWith("http") ? href : BASE_URL + (href.startsWith("/") ? href : "/" + href);
+      }
+
+      function openUrl(href) {
+        const target = resolveUrl(href);
+        if (!target) return;
+        if (window.openai && typeof window.openai.openExternal === "function") {
+          window.openai.openExternal({ href: target });
+        } else {
+          window.open(target, "_blank", "noopener,noreferrer");
+        }
+      }
+
+      function setOpenInAppTarget(href) {
+        const target = resolveUrl(href);
+        if (target && window.openai && typeof window.openai.setOpenInAppUrl === "function") {
+          window.openai.setOpenInAppUrl({ href: target });
+        }
+      }
+
+      async function invokeTool(name, args, btn) {
+        if (btn) btn.disabled = true;
+        try {
+          if (window.openai && typeof window.openai.callTool === "function") {
+            const res = await window.openai.callTool(name, args || {});
+            if (res && res.structuredContent) {
+              render(res.structuredContent);
+              return;
+            }
+          }
+          const rpcRes = await mcpRpcRequest("tools/call", {
+            name: name,
+            arguments: args || {},
+          });
+          if (rpcRes && rpcRes.structuredContent) {
+            render(rpcRes.structuredContent);
+            return;
+          }
+          if (window.openai && typeof window.openai.sendFollowUpMessage === "function") {
+            await window.openai.sendFollowUpMessage({
+              prompt: "Please call " + name + " with " + JSON.stringify(args || {})
+            });
+          } else {
+            await mcpRpcRequest("ui/message", {
+              role: "user",
+              content: { type: "text", text: "Please call " + name + " with " + JSON.stringify(args || {}) },
+            });
+          }
+        } finally {
+          if (btn) btn.disabled = false;
+        }
+      }
+
+      function toggleFullscreen() {
+        const next = document.body.getAttribute("data-mode") === "fullscreen" ? "inline" : "fullscreen";
+        document.body.setAttribute("data-mode", next);
+        if (window.openai && typeof window.openai.requestDisplayMode === "function") {
+          window.openai.requestDisplayMode({ mode: next });
+        }
+        notifyHeight();
+      }
+
+      function render(data) {
+        syncThemeAndMode();
+        const oa = window.openai || {};
+        const metaResult =
+          oa.toolResponseMetadata &&
+          oa.toolResponseMetadata.mcp_tool_result &&
+          oa.toolResponseMetadata.mcp_tool_result.structuredContent;
+        currentData = data || oa.toolOutput || metaResult || {};
+
+        // 1. Inline Carousel for search_tools (3-8 cards per OpenAI UI Guidelines)
+        if (Array.isArray(currentData.tools) && currentData.tools.length > 0) {
+          const items = currentData.tools.slice(0, 8);
+          root.innerHTML =
+            '<div class="mx-header">' +
+              '<div class="mx-title-wrap">' +
+                '<svg class="mx-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75"><circle cx="11" cy="11" r="7"/><path d="M20 20l-3.5-3.5"/></svg>' +
+                '<div><div class="mx-title">Unified Tool Catalog</div>' +
+                '<div class="mx-subtitle">' + esc(currentData.count || items.length) + ' governed capabilities available</div></div>' +
+              '</div>' +
+              '<span class="mx-badge">' + esc(items.length) + ' shown</span>' +
+            '</div>' +
+            '<div class="mx-carousel">' +
+              items.map(function (t) {
+                const badgeClass = t.riskLevel === "read" ? "ok" : (t.riskLevel === "destructive" || t.riskLevel === "financial" ? "warn" : "");
+                return (
+                  '<div class="mx-carousel-item">' +
+                    '<div>' +
+                      '<div style="display:flex;justify-content:space-between;align-items:center;gap:6px;margin-bottom:4px;">' +
+                        '<span class="mx-badge ' + badgeClass + '">' + esc(t.riskLevel || "read") + '</span>' +
+                        '<span class="mx-subtitle mx-mono">' + esc(t.creditCost || 1) + ' cr</span>' +
+                      '</div>' +
+                      '<div class="mx-carousel-title" title="' + esc(t.name || t.slug) + '">' + esc(t.name || t.slug) + '</div>' +
+                      '<div class="mx-subtitle mx-mono" style="margin-bottom:4px;">' + esc(t.slug) + '</div>' +
+                      '<div class="mx-carousel-desc">' + esc(t.description || "") + '</div>' +
+                    '</div>' +
+                    '<button class="mx-btn mx-btn-secondary" data-plan-slug="' + esc(t.slug) + '" style="width:100%;padding:5px 8px;font-size:12px;">Plan Action</button>' +
+                  '</div>'
+                );
+              }).join("") +
+            '</div>';
+          root.querySelectorAll("[data-plan-slug]").forEach(function (btn) {
+            btn.addEventListener("click", function () {
+              const slug = btn.getAttribute("data-plan-slug");
+              persistWidgetState("Selected tool " + slug + " for planning.", { selectedToolSlug: slug });
+              invokeTool("plan_action", { tool_slug: slug, input: {} }, btn);
+            });
+          });
+          notifyHeight();
+          return;
+        }
+
+        // 2. Determine Inline Card state (Plan, Handoff, Execution Run, Receipt, or Workspace Summary)
+        const plan = currentData.plan || (currentData.id && String(currentData.id).startsWith("plan_") ? currentData : null);
+        const run = currentData.run || (currentData.id && String(currentData.id).startsWith("run_") ? currentData : null);
+        const receipt = currentData.receipt || (currentData.id && String(currentData.id).startsWith("rcpt_") ? currentData : null);
+        const handoff = currentData.humanHandoff || (plan && plan.humanHandoff) || null;
+        const authHandoff = currentData.authHandoff || (plan && plan.authHandoff) || null;
+        const handoffUrl =
+          (handoff && (handoff.url || handoff.actionUrl || handoff.oauthRedirectUrl || handoff.approvalUrl)) ||
+          (authHandoff && authHandoff.redirectUrl) ||
+          currentData.redirectUrl ||
+          null;
+        const isHandoffActive = Boolean(
+          (handoff && (handoff.required !== false && (handoffUrl || handoff.kind))) ||
+          (authHandoff && authHandoff.required)
+        );
+
+        let title = "Muxo Governed Operation";
+        let subtitle = "Cryptographically audited agent execution";
+        let statusLabel = "Ready";
+        let statusTone = "ok";
+        let stats = [];
+        let editFieldsHtml = "";
+        let primaryBtn = null;
+        let secondaryBtn = null;
+
+        if (isHandoffActive && !run) {
+          const isOauth =
+            (handoff && (handoff.kind === "oauth" || handoff.kind === "oauth_connection")) ||
+            Boolean(authHandoff && authHandoff.required);
+          title =
+            (handoff && (handoff.headline || handoff.title)) ||
+            (isOauth ? "OAuth Connection Required" : "Human Approval Required");
+          subtitle =
+            (handoff && (handoff.instructions || handoff.summary)) ||
+            "Complete this step in your browser to resume governed execution";
+          statusLabel = isOauth ? "OAuth Handoff" : "Approval Needed";
+          statusTone = "warn";
+          const prov =
+            (handoff && handoff.provider) ||
+            (authHandoff && authHandoff.providerSlug) ||
+            currentData.provider ||
+            currentData.providerSlug ||
+            (plan && plan.providerSlug);
+          stats.push({
+            label: "Provider / Tool",
+            value: (plan && plan.toolSlug) || prov || "External Service"
+          });
+          if (plan && plan.id) stats.push({ label: "Plan ID", value: plan.id, mono: true });
+          if (handoffUrl) {
+            setOpenInAppTarget(handoffUrl);
+            primaryBtn = {
+              label: (handoff && handoff.ctaLabel) || (isOauth ? "Connect Account" : "Review & Approve"),
+              onClick: function () { openUrl(handoffUrl); }
+            };
+          }
+          if (isOauth && prov) {
+            secondaryBtn = {
+              label: "Verify Connection",
+              onClick: function (btn) { invokeTool("wait_for_connection", { provider: prov, timeout_seconds: 15 }, btn); }
+            };
+          } else if (plan && plan.id) {
+            secondaryBtn = {
+              label: "Check Status",
+              onClick: function (btn) { invokeTool("get_plan", { plan_id: plan.id, wait_for_approval: true, timeout_seconds: 10 }, btn); }
+            };
+          }
+        } else if (plan && !run) {
+          title = plan.toolName || plan.toolSlug || "Governed Action Plan";
+          subtitle = plan.policyReason || "Evaluated against workspace guardrails";
+          const approved = plan.approvalStatus === "approved" || plan.approvalStatus === "auto_approved";
+          statusLabel = approved ? "Approved (" + (plan.riskLevel || "read") + ")" : String(plan.approvalStatus || "planned");
+          statusTone = approved ? "ok" : "warn";
+          stats.push({ label: "Plan ID", value: plan.id, mono: true });
+          stats.push({ label: "Lane", value: plan.lane || "composio_instant" });
+          stats.push({ label: "Estimated Cost", value: String(plan.estimatedCreditCost || 1) + " credits" });
+
+          const inputObj =
+            (plan.input && typeof plan.input === "object")
+              ? plan.input
+              : (latestToolInput && latestToolInput.input && typeof latestToolInput.input === "object")
+                ? latestToolInput.input
+                : {};
+          const keys = Object.keys(inputObj).slice(0, 3);
+          editedInputs = {};
+          if (keys.length > 0 && approved) {
+            editFieldsHtml = '<div class="mx-edit-row">' +
+              keys.map(function (k) {
+                const val = typeof inputObj[k] === "object" ? JSON.stringify(inputObj[k]) : String(inputObj[k] ?? "");
+                return '<div class="mx-edit-field"><label>' + esc(k) + '</label><input data-input-key="' + esc(k) + '" value="' + esc(val) + '" /></div>';
+              }).join("") +
+            '</div>';
+          }
+
+          if (approved) {
+            const execTool = "execute_" + String(plan.riskLevel || "read");
+            primaryBtn = {
+              label: "Execute Plan",
+              onClick: function (btn) {
+                if (Object.keys(editedInputs).length > 0 && plan.toolSlug) {
+                  const merged = Object.assign({}, inputObj, editedInputs);
+                  invokeTool("plan_action", { tool_slug: plan.toolSlug, input: merged, reason: plan.reason || "Updated parameters in widget" }, btn);
+                } else {
+                  invokeTool(execTool, { plan_id: plan.id }, btn);
+                }
+              }
+            };
+          } else if (plan.approvalUrl) {
+            setOpenInAppTarget(plan.approvalUrl);
+            primaryBtn = {
+              label: "Approve Plan",
+              onClick: function () { openUrl(plan.approvalUrl); }
+            };
+          }
+          secondaryBtn = {
+            label: "Refresh Plan",
+            onClick: function (btn) { invokeTool("get_plan", { plan_id: plan.id }, btn); }
+          };
+        } else if (run || receipt) {
+          const r = run || {};
+          const rc = receipt || {};
+          title = r.toolSlug || rc.toolSlug || "Execution Receipt";
+          subtitle = (rc.agenticReceipt && rc.agenticReceipt.publicKeyId)
+            ? "Signed Ed25519 (" + rc.agenticReceipt.publicKeyId + ") + SHA-256 Chain"
+            : "Cryptographically verified execution record";
+          const ok = (r.status || rc.status || "succeeded") === "succeeded";
+          statusLabel = ok ? "Verified" : String(r.status || rc.status || "completed");
+          statusTone = ok ? "ok" : "err";
+          if (r.id || rc.runId) stats.push({ label: "Run ID", value: r.id || rc.runId, mono: true });
+          if (rc.id) stats.push({ label: "Receipt ID", value: rc.id, mono: true });
+          if (rc.outputHash) stats.push({ label: "Output SHA-256", value: String(rc.outputHash).slice(0, 16) + "…", mono: true });
+
+          const out = r.output || {};
+          const liveUrl = out.liveUrl || out.deploymentUrl || (out.result && (out.result.liveUrl || out.result.url));
+          if (liveUrl) {
+            setOpenInAppTarget(liveUrl);
+            primaryBtn = { label: "Open Live URL", onClick: function () { openUrl(liveUrl); } };
+          } else if (r.id || rc.id) {
+            primaryBtn = {
+              label: "Verify Receipt",
+              onClick: function (btn) { invokeTool("get_receipt", { receipt_id: rc.id || r.id, verify_chain: true }, btn); }
+            };
+          }
+        } else {
+          title = (currentData.workspace && currentData.workspace.name) || "Muxo Workspace";
+          subtitle = "Bi-temporal memory, policy guardrails & execution lanes active";
+          statusLabel = "Active";
+          statusTone = "ok";
+          if (currentData.workspace && currentData.workspace.id) {
+            stats.push({ label: "Workspace", value: currentData.workspace.id, mono: true });
+          }
+          if (currentData.billing && currentData.billing.creditsRemaining != null) {
+            stats.push({ label: "Credits", value: String(currentData.billing.creditsRemaining) });
+          }
+          primaryBtn = {
+            label: "Browse Tool Catalog",
+            onClick: function (btn) { invokeTool("search_tools", { query: "" }, btn); }
+          };
+        }
+
+        const expandIcon =
+          '<button class="mx-expand-btn" id="mx-expand" title="Toggle Fullscreen Inspector" aria-label="Toggle Fullscreen Inspector">' +
+            '<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75"><path d="M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7"/></svg>' +
+          '</button>';
+
+        root.innerHTML =
+          '<div class="mx-header">' +
+            '<div class="mx-title-wrap">' +
+              '<svg class="mx-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75"><path d="M12 2L3 7v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V7l-9-5z"/></svg>' +
+              '<div><div class="mx-title">' + esc(title) + '</div>' +
+              '<div class="mx-subtitle">' + esc(subtitle) + '</div></div>' +
+            '</div>' +
+            '<div class="mx-header-right">' +
+              '<span class="mx-badge ' + statusTone + '">' + esc(statusLabel) + '</span>' +
+              expandIcon +
+            '</div>' +
+          '</div>' +
+          (stats.length > 0
+            ? '<div class="mx-grid">' +
+                stats.map(function (s) {
+                  return '<div class="mx-stat"><div class="mx-stat-label">' + esc(s.label) + '</div>' +
+                    '<div class="mx-stat-value ' + (s.mono ? 'mx-mono' : '') + '">' + esc(s.value) + '</div></div>';
+                }).join("") +
+              '</div>'
+            : '') +
+          editFieldsHtml +
+          '<div class="mx-fullscreen-details">' + esc(JSON.stringify(currentData, null, 2)) + '</div>' +
+          ((primaryBtn || secondaryBtn)
+            ? '<div class="mx-actions">' +
+                (secondaryBtn ? '<button class="mx-btn mx-btn-secondary" id="mx-btn-sec">' + esc(secondaryBtn.label) + '</button>' : '') +
+                (primaryBtn ? '<button class="mx-btn mx-btn-primary" id="mx-btn-pri">' + esc(primaryBtn.label) + '</button>' : '') +
+              '</div>'
+            : '');
+
+        const expBtn = document.getElementById("mx-expand");
+        if (expBtn) expBtn.addEventListener("click", toggleFullscreen);
+        const priEl = document.getElementById("mx-btn-pri");
+        if (priEl && primaryBtn) priEl.addEventListener("click", function () { primaryBtn.onClick(priEl); });
+        const secEl = document.getElementById("mx-btn-sec");
+        if (secEl && secondaryBtn) secEl.addEventListener("click", function () { secondaryBtn.onClick(secEl); });
+
+        root.querySelectorAll("[data-input-key]").forEach(function (inp) {
+          inp.addEventListener("change", function () {
+            const key = inp.getAttribute("data-input-key");
+            if (!key) return;
+            editedInputs[key] = inp.value;
+            if (priEl) priEl.textContent = "Re-Plan & Execute";
+            persistWidgetState(
+              "User edited plan input parameter " + key + " = " + inp.value,
+              { planId: plan && plan.id, editedInputs: editedInputs }
+            );
+          });
+        });
+
+        notifyHeight();
+      }
+
+      window.addEventListener("openai:set_globals", function () { render(currentData); });
+      window.addEventListener("message", function (ev) {
+        if (ev.source && window.parent && ev.source !== window.parent) return;
+        const msg = ev && ev.data;
+        if (!msg || msg.jsonrpc !== "2.0") return;
+        if (msg.id !== undefined && pendingRequests.has(msg.id)) {
+          const pending = pendingRequests.get(msg.id);
+          pendingRequests.delete(msg.id);
+          if (msg.error) pending.reject(msg.error);
+          else pending.resolve(msg.result);
+          return;
+        }
+        if (msg.method === "ui/notifications/tool-input") {
+          latestToolInput = msg.params || null;
+          if (currentData) render(currentData);
+        }
+        if (msg.method === "ui/notifications/tool-result" && msg.params) {
+          render(msg.params.structuredContent || msg.params);
+        }
+      });
+
+      if (typeof ResizeObserver !== "undefined") {
+        new ResizeObserver(notifyHeight).observe(document.body);
+      }
+
+      mcpRpcRequest("ui/initialize", {
+        availableDisplayModes: ["inline", "fullscreen"],
+      });
+
+      latestToolInput = (window.openai && window.openai.toolInput) || null;
+      render((window.openai && window.openai.toolOutput) || null);
+    })();
+  </script>
+</body>
+</html>`;
+}