webstudio 0.274.3 → 0.274.5

package/lib/{cli-fEGl5mA1.js → cli-CVetloSj.js}

@@ -5205,7 +5205,7 @@ const publicApiOperationDocumentation = [
     description: "Update page settings and metadata",
     requiredOptions: ["page", "json"],
     examples: [
-      'webstudio update-page --page page-id --title Pricing --description "Pricing plans" --json'
+      'webstudio update-page --page page-id --title "\\"Pricing\\"" --description "\\"Pricing plans\\"" --json'
     ]
   },
   {
@@ -5378,7 +5378,7 @@ const publicApiOperationDocumentation = [
   },
   {
     command: "update-props",
-    description: "Create or update element props; editor tokens are limited to content-mode props",
+    description: "Create or update direct element prop values; use this for fixed strings, numbers, booleans, JSON, assets, pages, parameters, and resources. Editor tokens are limited to content-mode props",
     requiredOptions: ["input", "json"],
     examples: ["webstudio update-props --input props.json --json"]
   },
@@ -5390,7 +5390,7 @@ const publicApiOperationDocumentation = [
   },
   {
     command: "bind-props",
-    description: "Bind element props to expressions, parameters, resources, or actions",
+    description: "Bind element props to dynamic expressions, parameters, resources, or actions. Do not use for fixed string values; use update-props instead",
     requiredOptions: ["input", "json"],
     examples: ["webstudio bind-props --input bindings.json --json"]
   },
@@ -6123,6 +6123,7 @@ const withDefaultPermit = (operation) => {
     permit: operation.permit ?? (operation.method === "query" ? "view" : "build"),
     description: documentation.description,
     inputFields: inputFieldsLookup[operation.command] ?? [],
+    inputFieldTypes: operation.inputFieldTypes ?? {},
     requiredOptions: documentation.requiredOptions,
     examples: documentation.examples,
     localCapable: runtimeOperation2 !== void 0,
@@ -6352,14 +6353,16 @@ const publicApiOperationInputs = [
     id: "instances.append",
     method: "mutation",
     path: "api.instances.append",
-    client: "appendInstance"
+    client: "appendInstance",
+    inputFieldTypes: { children: "array" }
   },
   {
     command: "move-instance",
     id: "instances.move",
     method: "mutation",
     path: "api.instances.move",
-    client: "moveInstance"
+    client: "moveInstance",
+    inputFieldTypes: { moves: "array" }
   },
   {
     command: "clone-instance",
@@ -6373,7 +6376,8 @@ const publicApiOperationInputs = [
     id: "instances.delete",
     method: "mutation",
     path: "api.instances.delete",
-    client: "deleteInstance"
+    client: "deleteInstance",
+    inputFieldTypes: { instanceIds: "array" }
   },
   {
     command: "update-props",
@@ -6381,7 +6385,8 @@ const publicApiOperationInputs = [
     method: "mutation",
     path: "api.instances.updateProps",
     client: "updateProps",
-    permit: "edit"
+    permit: "edit",
+    inputFieldTypes: { updates: "array" }
   },
   {
     command: "delete-props",
@@ -6389,14 +6394,16 @@ const publicApiOperationInputs = [
     method: "mutation",
     path: "api.instances.deleteProps",
     client: "deleteProps",
-    permit: "edit"
+    permit: "edit",
+    inputFieldTypes: { deletions: "array" }
   },
   {
     command: "bind-props",
     id: "instances.bindProps",
     method: "mutation",
     path: "api.instances.bindProps",
-    client: "bindProps"
+    client: "bindProps",
+    inputFieldTypes: { bindings: "array" }
   },
   {
     command: "list-texts",
@@ -6425,14 +6432,16 @@ const publicApiOperationInputs = [
     id: "styles.updateDeclarations",
     method: "mutation",
     path: "api.styles.updateDeclarations",
-    client: "updateStyleDeclarations"
+    client: "updateStyleDeclarations",
+    inputFieldTypes: { updates: "array" }
   },
   {
     command: "delete-styles",
     id: "styles.deleteDeclarations",
     method: "mutation",
     path: "api.styles.deleteDeclarations",
-    client: "deleteStyleDeclarations"
+    client: "deleteStyleDeclarations",
+    inputFieldTypes: { deletions: "array" }
   },
   {
     command: "replace-styles",
@@ -6453,42 +6462,48 @@ const publicApiOperationInputs = [
     id: "designTokens.create",
     method: "mutation",
     path: "api.designTokens.create",
-    client: "createDesignTokens"
+    client: "createDesignTokens",
+    inputFieldTypes: { tokens: "array" }
   },
   {
     command: "update-design-token-styles",
     id: "designTokens.updateStyles",
     method: "mutation",
     path: "api.designTokens.updateStyles",
-    client: "updateDesignTokenStyles"
+    client: "updateDesignTokenStyles",
+    inputFieldTypes: { updates: "array" }
   },
   {
     command: "delete-design-token-styles",
     id: "designTokens.deleteStyles",
     method: "mutation",
     path: "api.designTokens.deleteStyles",
-    client: "deleteDesignTokenStyles"
+    client: "deleteDesignTokenStyles",
+    inputFieldTypes: { deletions: "array" }
   },
   {
     command: "attach-design-token",
     id: "designTokens.attach",
     method: "mutation",
     path: "api.designTokens.attach",
-    client: "attachDesignToken"
+    client: "attachDesignToken",
+    inputFieldTypes: { instanceIds: "array" }
   },
   {
     command: "detach-design-token",
     id: "designTokens.detach",
     method: "mutation",
     path: "api.designTokens.detach",
-    client: "detachDesignToken"
+    client: "detachDesignToken",
+    inputFieldTypes: { instanceIds: "array" }
   },
   {
     command: "extract-design-token",
     id: "designTokens.extract",
     method: "mutation",
     path: "api.designTokens.extract",
-    client: "extractDesignToken"
+    client: "extractDesignToken",
+    inputFieldTypes: { instanceIds: "array", removeLocalProps: "array" }
   },
   {
     command: "list-css-variables",
@@ -6509,7 +6524,8 @@ const publicApiOperationInputs = [
     id: "cssVariables.delete",
     method: "mutation",
     path: "api.cssVariables.delete",
-    client: "deleteCssVariables"
+    client: "deleteCssVariables",
+    inputFieldTypes: { names: "array" }
   },
   {
     command: "rewrite-css-variable-refs",
@@ -6683,7 +6699,8 @@ const publicApiOperationInputs = [
     id: "assets.delete",
     method: "mutation",
     path: "api.assets.delete",
-    client: "deleteAssets"
+    client: "deleteAssets",
+    inputFieldTypes: { assetIdsOrPrefixes: "array" }
   }
 ];
 const publicApiOperations = publicApiOperationInputs.map(withDefaultPermit);
@@ -7635,7 +7652,7 @@ class HandledCliError extends Error {
 }
 const isHandledCliError = (error) => error instanceof HandledCliError;
 const name$N = "webstudio";
-const version = "0.274.3";
+const version = "0.274.5";
 const description = "Webstudio CLI";
 const author = "Webstudio <github@webstudio.is>";
 const homepage = "https://webstudio.is";
@@ -7643,11 +7660,11 @@ const type = "module";
 const bin = { "webstudio-cli": "./bin.js", "webstudio": "./bin.js" };
 const imports = { "#cli": { "webstudio": "./src/cli.ts", "default": "./lib/cli.js" } };
 const files = ["lib/*", "templates/*", "bin.js", "!*.{test,stories}.*"];
-const scripts = { "typecheck": "tsgo --noEmit", "generate-docs": "node scripts/generate-docs.mjs", "build": "pnpm generate-docs && rm -rf lib && vite build", "test": "vitest run" };
+const scripts = { "typecheck": "tsgo --noEmit", "generate-docs": "tsx scripts/generate-docs.ts", "build": "pnpm generate-docs && rm -rf lib && vite build", "test": "vitest run" };
 const license = "AGPL-3.0-or-later";
 const engines = { "node": ">=22" };
 const dependencies = { "@clack/prompts": "^0.10.0", "@emotion/hash": "^0.9.2", "@trpc/client": "^10.45.2", "@webstudio-is/http-client": "workspace:*", "@webstudio-is/project-migrations": "workspace:*", "@webstudio-is/protocol": "workspace:*", "acorn": "^8.14.1", "acorn-walk": "^8.3.4", "change-case": "^5.4.4", "chrome-launcher": "^1.2.1", "deepmerge": "^4.3.1", "env-paths": "^3.0.0", "fast-deep-equal": "^3.1.3", "immer": "^10.1.1", "nanoid": "^5.1.5", "p-limit": "^6.2.0", "parse5": "7.3.0", "picocolors": "^1.1.1", "reserved-identifiers": "^1.0.0", "tinyexec": "^0.3.2", "tus-js-client": "^4.3.1", "warn-once": "^0.1.1", "yargs": "^17.7.2", "zod": "^3.24.2" };
-const devDependencies = { "@cloudflare/vite-plugin": "^1.1.0", "@netlify/vite-plugin-react-router": "^1.0.1", "@react-router/dev": "^7.5.3", "@react-router/fs-routes": "^7.5.3", "@remix-run/cloudflare": "^2.16.5", "@remix-run/cloudflare-pages": "^2.16.5", "@remix-run/dev": "^2.16.5", "@remix-run/node": "^2.16.5", "@remix-run/react": "^2.16.5", "@remix-run/server-runtime": "^2.16.5", "@types/react": "^18.2.70", "@types/react-dom": "^18.2.25", "@types/yargs": "^17.0.33", "@vercel/react-router": "^1.1.0", "@vitejs/plugin-react": "^4.4.1", "@webstudio-is/css-engine": "workspace:*", "@webstudio-is/image": "workspace:*", "@webstudio-is/project-build": "workspace:*", "@webstudio-is/react-sdk": "workspace:*", "@webstudio-is/sdk": "workspace:*", "@webstudio-is/sdk-components-animation": "workspace:*", "@webstudio-is/sdk-components-react": "workspace:*", "@webstudio-is/sdk-components-react-radix": "workspace:*", "@webstudio-is/sdk-components-react-remix": "workspace:*", "@webstudio-is/sdk-components-react-router": "workspace:*", "@webstudio-is/tsconfig": "workspace:*", "@webstudio-is/wsauth": "workspace:*", "h3": "^1.15.1", "ipx": "^3.0.3", "isbot": "^5.1.25", "prettier": "3.5.3", "react": "18.3.0-canary-14898b6a9-20240318", "react-dom": "18.3.0-canary-14898b6a9-20240318", "react-router": "^7.5.3", "ts-expect": "^1.3.0", "vike": "^0.4.229", "vite": "^6.3.4", "vitest": "^3.1.2", "wrangler": "^3.63.2" };
+const devDependencies = { "@cloudflare/vite-plugin": "^1.1.0", "@netlify/vite-plugin-react-router": "^1.0.1", "@react-router/dev": "^7.5.3", "@react-router/fs-routes": "^7.5.3", "@remix-run/cloudflare": "^2.16.5", "@remix-run/cloudflare-pages": "^2.16.5", "@remix-run/dev": "^2.16.5", "@remix-run/node": "^2.16.5", "@remix-run/react": "^2.16.5", "@remix-run/server-runtime": "^2.16.5", "@types/mdast": "^4.0.4", "@types/react": "^18.2.70", "@types/react-dom": "^18.2.25", "@types/yargs": "^17.0.33", "@vercel/react-router": "^1.1.0", "@vitejs/plugin-react": "^4.4.1", "@webstudio-is/css-engine": "workspace:*", "@webstudio-is/image": "workspace:*", "@webstudio-is/project-build": "workspace:*", "@webstudio-is/react-sdk": "workspace:*", "@webstudio-is/sdk": "workspace:*", "@webstudio-is/sdk-components-animation": "workspace:*", "@webstudio-is/sdk-components-react": "workspace:*", "@webstudio-is/sdk-components-react-radix": "workspace:*", "@webstudio-is/sdk-components-react-remix": "workspace:*", "@webstudio-is/sdk-components-react-router": "workspace:*", "@webstudio-is/tsconfig": "workspace:*", "@webstudio-is/wsauth": "workspace:*", "h3": "^1.15.1", "ipx": "^3.0.3", "isbot": "^5.1.25", "mdast-util-directive": "^3.1.0", "mdast-util-from-markdown": "^2.0.3", "mdast-util-to-string": "^4.0.0", "micromark-extension-directive": "^4.0.0", "prettier": "3.5.3", "react": "18.3.0-canary-14898b6a9-20240318", "react-dom": "18.3.0-canary-14898b6a9-20240318", "react-router": "^7.5.3", "ts-expect": "^1.3.0", "vike": "^0.4.229", "vite": "^6.3.4", "vitest": "^3.1.2", "wrangler": "^3.63.2" };
 const packageJson = {
   name: name$N,
   version,
@@ -8988,9 +9005,9 @@ const htmlToJsx = (html2) => {
   }
   return result;
 };
-const createRemixFramework = async () => (await import("./framework-remix-ByApfd6J.js")).createFramework();
-const createReactRouterFramework = async () => (await import("./framework-react-router-D1HMM2Nm.js")).createFramework();
-const createVikeSsgFramework = async () => (await import("./framework-vike-ssg-BGhpJT5M.js")).createFramework();
+const createRemixFramework = async () => (await import("./framework-remix-DPrszLh-.js")).createFramework();
+const createReactRouterFramework = async () => (await import("./framework-react-router-D_ph8aB5.js")).createFramework();
+const createVikeSsgFramework = async () => (await import("./framework-vike-ssg-BvV5cdbB.js")).createFramework();
 const mergeJsonInto = async (sourcePath, destinationPath) => {
   const sourceJson = await readFile(sourcePath, "utf8");
   const destinationJson = await readFile(destinationPath, "utf8").catch(
@@ -9077,6 +9094,25 @@ const generateRedirectsModule = (pageRedirects) => {
     export const redirects = ${JSON.stringify(redirects, null, 2)};
     `;
 };
+const generateRedirectFallbackRoute = (runtime) => {
+  const loaderFunctionArgs = runtime === "react-router" ? "react-router" : "@remix-run/server-runtime";
+  return `
+    import { type LoaderFunctionArgs } from ${JSON.stringify(loaderFunctionArgs)};
+    import { redirectRequest } from "../redirect-url";
+    // @todo think about how to make __generated__ typeable
+    // @ts-ignore
+    import { redirects } from "../__generated__/$resources.redirects";
+
+    export const loader = ({ request }: LoaderFunctionArgs) => {
+      const redirectResponse = redirectRequest(request, redirects);
+      if (redirectResponse !== undefined) {
+        return redirectResponse;
+      }
+
+      throw new Response("Not Found", { status: 404 });
+    };
+    `;
+};
 const prebuild = async (options) => {
   var _a3, _b2, _c, _d, _e, _f, _g, _h, _i, _j;
   if (options.template.length === 0) {
@@ -9492,6 +9528,14 @@ Please check webstudio --help for more details`
     join(generatedDir, "$resources.redirects.ts"),
     generateRedirectsModule(pages2.redirects)
   );
+  if (pages2.redirects !== void 0 && pages2.redirects.length > 0) {
+    await createFileIfNotExists(
+      join(routesDir, "$.tsx"),
+      generateRedirectFallbackRoute(
+        options.template.includes("react-router") ? "react-router" : "remix"
+      )
+    );
+  }
   if (options.assets === true && siteData.assets.length > 0) {
     const downloading = spinner();
     downloading.start("Downloading fonts and images");
@@ -10880,6 +10924,10 @@ class StdioServerTransport {
     });
   }
 }
+const projectBuildDocs = {
+  "mcp-startup-guidance": "Before editing a Webstudio project, read `webstudio://project/guide` and `webstudio://project/tools`, or call `meta.index` and `meta.guide`. Follow the guide: read ids and Builder breakpoints first, prefer semantic tools over `apply-patch`, use direct value tools for fixed text/props, use bindings only for dynamic expressions/resources/actions, quote fixed text for expression-backed fields such as page metadata and resource URLs, put page/resource update fields under `values`, do not edit generated files for normal content/design changes, and use `preview.start` plus screenshot/vision for visual work.\n"
+};
+const readProjectBuildDoc = (name2) => projectBuildDocs[name2];
 const isRecord = (value2) => typeof value2 === "object" && value2 !== null;
 const isScreenshotBrowser = (value2) => typeof value2 === "string" && screenshotBrowserChoices.includes(value2);
 const getRequestParams = (request) => isRecord(request) && isRecord(request.params) ? request.params : {};
@@ -10917,13 +10965,34 @@ const getOperationInputSchema = (operation) => {
     properties: Object.fromEntries(
       operation.inputFields.map((field) => [
         field,
-        {
-          description: `Public API input field \`${field}\`.`
-        }
+        getOperationInputFieldSchema(operation, field)
       ])
     )
   };
 };
+const getOperationInputFieldSchema = (operation, field) => {
+  var _a3;
+  const description2 = `Public API input field \`${field}\`.`;
+  if (((_a3 = operation.inputFieldTypes) == null ? void 0 : _a3[field]) === "array") {
+    return {
+      type: "array",
+      description: description2,
+      items: {}
+    };
+  }
+  return { description: description2 };
+};
+const wrapMcpRootArrayInput = (operation, input2) => {
+  var _a3;
+  if (Array.isArray(input2) === false || operation.inputFields.length !== 1) {
+    return input2;
+  }
+  const [field] = operation.inputFields;
+  if (field !== void 0 && ((_a3 = operation.inputFieldTypes) == null ? void 0 : _a3[field]) === "array") {
+    return { [field]: input2 };
+  }
+  return input2;
+};
 const screenshotInputSchema = {
   ...emptyInputSchema,
   description: "Capture a visual screenshot for AI vision review. Pass { url } for any URL or { path } after preview.start.",
@@ -11089,6 +11158,53 @@ const mcpArgumentExamples = {
       text: "Launch faster"
     }
   ],
+  "update-page": [
+    {
+      pageId: "page-id",
+      values: {
+        title: '"Pricing"',
+        meta: {
+          description: '"Pricing plans"'
+        }
+      }
+    }
+  ],
+  "update-props": [
+    {
+      updates: [
+        {
+          instanceId: "button-id",
+          name: "aria-label",
+          type: "string",
+          value: "Open menu"
+        }
+      ]
+    }
+  ],
+  "bind-props": [
+    {
+      bindings: [
+        {
+          instanceId: "link-id",
+          name: "href",
+          binding: { type: "expression", value: "currentPost.url" }
+        }
+      ]
+    }
+  ],
+  "create-resource": [
+    {
+      name: "Posts",
+      method: "get",
+      url: '"https://api.example.com/posts"'
+    }
+  ],
+  "update-resource": [
+    {
+      resourceId: "resource-id",
+      values: { url: '"https://api.example.com/posts"' }
+    }
+  ],
   "update-styles": [
     {
       updates: [
@@ -11100,6 +11216,11 @@ const mcpArgumentExamples = {
       ]
     }
   ],
+  "delete-styles": [
+    {
+      deletions: [{ instanceId: "instance-id", property: "box-shadow" }]
+    }
+  ],
   "apply-patch": [
     {
       baseVersion: 12,
@@ -11635,12 +11756,15 @@ const filterCapabilities = (tools) => {
     tools: capability.tools.filter((tool) => names.has(tool))
   })).filter((capability) => capability.tools.length > 0);
 };
+const startupGuidance = readProjectBuildDoc("mcp-startup-guidance").trim();
+const valuesVsBindingsRule = 'Use direct value tools for fixed text/props. Use bindings only for dynamic expressions, parameters, resources, or actions. Expression-backed fixed strings such as page metadata and resource URLs must be quoted JavaScript string literal expressions, for example "\\"Pricing\\"". Page and resource updates put changed fields under values.';
 const getMetaIndex = (tools, guidance) => {
   const names = new Set(tools.map((tool) => tool.name));
   const canVerifyVisually = ["preview.start", "screenshot"].every(
     (tool) => names.has(tool)
   );
   return {
+    readThisFirst: startupGuidance,
     startHere: ["meta.index", "meta.guide", "status", "permissions"].filter(
       (tool) => names.has(tool)
     ),
@@ -11654,6 +11778,7 @@ const getMetaIndex = (tools, guidance) => {
       "Operate on the configured project only.",
       "Read ids before writing.",
       "Prefer semantic tools over apply-patch.",
+      valuesVsBindingsRule,
       "Use status/refresh when cached data may be stale.",
       guidance == null ? void 0 : guidance.visualVerificationRule
     ].filter((rule) => rule !== void 0),
@@ -11677,6 +11802,7 @@ const getMetaGuide = (brief, tools, guidance) => {
       matches.some((tool) => tool.annotations.localCapable) ? "Call refresh if cached namespaces may be stale." : void 0,
       "Use focused read tools to collect ids and current values.",
       "Use the smallest semantic mutation tool that matches the requested change.",
+      valuesVsBindingsRule,
       "Use apply-patch only when no semantic mutation tool fits.",
       canVerifyVisually && guidance !== void 0 ? guidance.getVisionWorkflowSummary({ includeDiff: canDiffScreenshots }) : void 0
     ].filter(Boolean),
@@ -11703,7 +11829,7 @@ const getMoreTools = (brief, tools) => ({
     mcpExamples: tool.mcpExamples ?? [],
     cliRequiredOptions: tool.cliRequiredOptions ?? [],
     cliExamples: tool.cliExamples ?? [],
-    inputNote: "MCP tool arguments are public API input objects. Examples show intent, but do not imply MCP flag names.",
+    inputNote: `MCP tool arguments are public API input objects. Examples show intent, but do not imply MCP flag names. ${valuesVsBindingsRule}`,
     annotations: tool.annotations
   }))
 });
@@ -11933,8 +12059,8 @@ const createProjectSessionMcpCore = ({
   guidance
 }) => {
   let session;
-  const operationCommands = new Set(
-    operations.map((operation) => operation.command)
+  const operationByCommand = new Map(
+    operations.map((operation) => [operation.command, operation])
   );
   const listTools = () => listProjectSessionMcpTools(operations, {
     includeImport: importProject2 !== void 0,
@@ -12039,12 +12165,14 @@ const createProjectSessionMcpCore = ({
       if (name2 === "preview.status" && getPreviewStatus !== void 0) {
         return toMetaResult(await getPreviewStatus());
       }
-      if (operationCommands.has(name2) === false) {
+      const operation = operationByCommand.get(name2);
+      if (operation === void 0) {
         throw new Error(`Unknown MCP tool "${name2}".`);
       }
+      const operationInput = wrapMcpRootArrayInput(operation, input2);
       const envelope = await executeOperation({
         command: name2,
-        input: input2,
+        input: operationInput,
         dryRun
       });
       return toCallResult(envelope);
@@ -12107,7 +12235,7 @@ const createProjectSessionMcpServer = async ({
         tools: {},
         resources: {}
       },
-      instructions: "Use meta.index, meta.guide, and meta.get_more_tools to discover Webstudio project capabilities. Read ids before writing and prefer semantic tools over apply-patch."
+      instructions: startupGuidance
     }
   );
   server.setRequestHandler(ListToolsRequestSchema, async () => ({
@@ -12174,13 +12302,110 @@ const createMcpStdioTransport = async ({
   return new StdioServerTransport(stdin2, stdout2);
 };
 const cliDocs = {
-  "api-use-cases": '# CLI API Use Cases\n\n## Link/configure one project\n\nCommands:\n\n- webstudio init --link <api-share-link> --json\n\nNotes:\n\n- Writes local project id and global origin/token config.\n\n## Import synced project bundle into another project\n\nCommands:\n\n- webstudio sync\n- webstudio import --to <destination-share-link>\n- MCP tool: import {"to":"<destination-share-link>"}\n\nNotes:\n\n- Imports local `.webstudio/data.json` into the destination project.\n- Destination share link must allow build/import access.\n- Use `--skip-assets` only when asset rows and files should not be imported.\n\n## Identify current token\n\nCommands:\n\n- MCP tool: whoami {}\n\n## Check token permissions\n\nCommands:\n\n- webstudio permissions --json\n\n## Inspect project/build/version\n\nCommands:\n\n- MCP tool: inspect {}\n- MCP tool: snapshot {"include":["pages","instances","styles"]}\n\n## Discover CLI/API capabilities\n\nCommands:\n\n- webstudio schema api --json\n- webstudio man api --json\n- webstudio man llm --json\n- webstudio man mcp --json\n- MCP tool: meta.index {}\n- MCP tool: meta.guide {"brief":"Create a pricing page"}\n- MCP tool: meta.get_more_tools {"brief":"update-styles"}\n\nNotes:\n\n- Use `tools/list` for machine-readable MCP tool schemas.\n- Use `resources/list` and `resources/read` for longer MCP resources such as `webstudio://project/tools` and `webstudio://project/guide`.\n\n## Inspect and refresh MCP session cache\n\nCommands:\n\n- MCP tool: status {}\n- MCP tool: refresh {"namespaces":["pages","instances","styles"]}\n- MCP tool: reset-session {}\n\nNotes:\n\n- Use status before a task to understand the cached ProjectSession state.\n- Use refresh when project data may have changed outside the current MCP session.\n- Use reset-session when local cached state is corrupt or incompatible.\n\n## Visually verify rendered work with AI vision\n\nCommands:\n\n- MCP tool: preview.start {"host":"127.0.0.1","port":5173}\n- MCP tool: preview.status {}\n- MCP tool: screenshot {"path":"/","output":"current.png","viewport":{"width":1440,"height":900},"waitUntil":"load","waitForTimeout":250}\n- MCP tool: screenshot.diff {"baselinePath":"before.png","currentPath":"current.png","outputDir":".webstudio/screenshots"}\n- MCP tool: vision.install-ocr {"confirm":true}\n\nNotes:\n\n- Use this after page/content/style mutations and after generated project files are current so a vision-capable AI can see what was actually built.\n- Use waitForSelector when the rendered app has a reliable ready marker, waitUntil:"networkidle" for network-heavy pages, and waitForTimeout only for final visual settling.\n- For a fresh checkout, copied fixture, or newly generated app, run npm install or pnpm install in the generated project before preview.start or webstudio preview.\n- If preview fails with a missing generated-app command/package such as react-router or vite, install the generated app dependencies and retry.\n- When a baseline exists, use screenshot.diff to get changed regions, OCR textAnalysis, and diff artifact paths before deciding whether the result matches.\n- If screenshot.diff reports OCR unavailable and the user agrees to install it, call vision.install-ocr {"confirm":true}; otherwise continue with pixel diff and visual inspection.\n- Compare the PNG, OCR text evidence, and diff artifacts against the user\'s intent for layout, typography, colors, spacing, imagery, and responsive framing; then iterate with focused mutations.\n- Root CLI equivalent: webstudio preview --template ssg, then webstudio screenshot <url> --output current.png.\n\n## List pages\n\nCommands:\n\n- MCP tool: list-pages {"includeFolders":true}\n\n## Read page by id\n\nCommands:\n\n- MCP tool: get-page {"pageId":"<pageId>"}\n\n## Read page by path\n\nCommands:\n\n- MCP tool: get-page-by-path {"path":"/pricing"}\n\n## Create page\n\nCommands:\n\n- MCP tool: create-page {"name":"Pricing","path":"/pricing"}\n\n## Update page settings/metadata\n\nCommands:\n\n- MCP tool: update-page {"pageId":"<pageId>","title":"Pricing","description":"Plans","status":"200"}\n- MCP tool: update-page {"pageId":"<pageId>","auth":{"login":"<login>","password":"<password>"}}\n\n## Read project settings\n\nCommands:\n\n- MCP tool: get-project-settings {}\n\n## Update project settings\n\nCommands:\n\n- MCP tool: update-project-settings {"settings":"project-settings.json contents"}\n\n## List redirects\n\nCommands:\n\n- MCP tool: list-redirects {}\n\n## Create redirect\n\nCommands:\n\n- MCP tool: create-redirect {"oldPath":"/old","newPath":"/new","status":301}\n\n## Update redirect\n\nCommands:\n\n- MCP tool: update-redirect {"oldPath":"/old","newPath":"/newer","status":302}\n- MCP tool: update-redirect {"oldPath":"/old","status":null}\n\n## Delete redirect\n\nCommands:\n\n- MCP tool: delete-redirect {"oldPath":"/old"}\n\n## List breakpoints\n\nCommands:\n\n- MCP tool: list-breakpoints {}\n\n## Create breakpoint\n\nCommands:\n\n- MCP tool: create-breakpoint {"breakpointId":"tablet","label":"Tablet","maxWidth":991}\n\n## Update breakpoint\n\nCommands:\n\n- MCP tool: update-breakpoint {"breakpointId":"tablet","label":"Tablet","maxWidth":1023}\n- MCP tool: update-breakpoint {"breakpointId":"tablet","condition":null,"minWidth":768}\n- MCP tool: update-breakpoint {"breakpointId":"tablet","minWidth":null,"maxWidth":null,"condition":"(hover: hover)"}\n\n## Delete breakpoint\n\nCommands:\n\n- MCP tool: delete-breakpoint {"breakpointId":"tablet","confirm":true}\n\n## Duplicate page\n\nCommands:\n\n- MCP tool: duplicate-page {"pageId":"<pageId>","name":"Pricing Copy","path":"/pricing-copy"}\n\n## List page templates\n\nCommands:\n\n- MCP tool: list-page-templates {}\n\n## Create page from template\n\nCommands:\n\n- MCP tool: create-page-from-template {"templateId":"<templateId>","name":"Landing","path":"/landing"}\n\n## Delete page\n\nCommands:\n\n- MCP tool: delete-page {"pageId":"<pageId>"}\n\n## List folders\n\nCommands:\n\n- MCP tool: list-folders {"includePages":true}\n\n## Create folder\n\nCommands:\n\n- MCP tool: create-folder {"name":"Blog","slug":"blog"}\n\n## Update folder\n\nCommands:\n\n- MCP tool: update-folder {"folderId":"<folderId>","name":"Blog","slug":"blog"}\n\n## Delete folder\n\nCommands:\n\n- MCP tool: delete-folder {"folderId":"<folderId>"}\n\n## List element instances\n\nCommands:\n\n- MCP tool: list-instances {"pagePath":"/","maxDepth":3}\n\n## Inspect one element instance\n\nCommands:\n\n- MCP tool: inspect-instance {"instanceId":"<instanceId>","include":["props","styles","children"]}\n\n## Append/prepend/replace child elements\n\nCommands:\n\n- MCP tool: append-instance {"parentInstanceId":"<instanceId>","children":"children.json contents"}\n\n## Move elements\n\nCommands:\n\n- MCP tool: move-instance {"moves":"moves.json contents"}\n\n## Clone element subtree\n\nCommands:\n\n- MCP tool: clone-instance {"sourceInstanceId":"<instanceId>","parentInstanceId":"<targetParentId>"}\n\n## Delete element subtree\n\nCommands:\n\n- MCP tool: delete-instance {"instanceId":"<instanceId>"}\n\n## List text/expression children\n\nCommands:\n\n- MCP tool: list-texts {"pagePath":"/"}\n\n## Update text child\n\nCommands:\n\n- MCP tool: update-text {"instanceId":"<instanceId>","childIndex":0,"text":"Launch faster"}\n\n## Update props\n\nCommands:\n\n- MCP tool: update-props {"updates":"props.json contents"}\n\n## Delete props\n\nCommands:\n\n- MCP tool: delete-props {"deletions":"props.json contents"}\n\n## Bind props to expressions/resources/actions\n\nCommands:\n\n- MCP tool: bind-props {"bindings":"bindings.json contents"}\n\n## Read styles\n\nCommands:\n\n- MCP tool: get-styles {"instanceId":"<instanceId>","includeTokens":true}\n\n## Update local styles\n\nCommands:\n\n- MCP tool: update-styles {"updates":"styles.json contents"}\n\n## Delete local styles\n\nCommands:\n\n- MCP tool: delete-styles {"deletions":"styles.json contents"}\n\n## Replace matching style values\n\nCommands:\n\n- MCP tool: replace-styles {"replacements":"replace.json contents"}\n\n## List design tokens\n\nCommands:\n\n- MCP tool: list-design-tokens {"withUsage":true}\n\n## Create design tokens\n\nCommands:\n\n- MCP tool: create-design-token {"tokens":"tokens.json contents"}\n\n## Update design token styles\n\nCommands:\n\n- MCP tool: update-design-token-styles {"styleSourceId":"<tokenId>","updates":"styles.json contents"}\n\n## Delete design token styles\n\nCommands:\n\n- MCP tool: delete-design-token-styles {"styleSourceId":"<tokenId>","deletions":"styles.json contents"}\n\n## Attach design token to instances\n\nCommands:\n\n- MCP tool: attach-design-token {"styleSourceId":"<tokenId>","instanceIds":"instances.json contents"}\n\n## Detach design token from instances\n\nCommands:\n\n- MCP tool: detach-design-token {"styleSourceId":"<tokenId>","instanceIds":"instances.json contents"}\n\n## Extract design token from local styles\n\nCommands:\n\n- MCP tool: extract-design-token {"token":"token.json contents"}\n\n## List CSS variables\n\nCommands:\n\n- MCP tool: list-css-variables {"withUsage":true}\n\n## Define CSS variables\n\nCommands:\n\n- MCP tool: define-css-variable {"variables":"vars.json contents"}\n\n## Delete CSS variables\n\nCommands:\n\n- MCP tool: delete-css-variable {"names":"names.json contents","confirm":true}\n\n## Rewrite CSS variable references\n\nCommands:\n\n- MCP tool: rewrite-css-variable-refs {"variables":"variables.json contents"}\n\n## List data variables\n\nCommands:\n\n- MCP tool: list-variables {}\n\n## Create data variable\n\nCommands:\n\n- MCP tool: create-variable {"scopeInstanceId":"<instanceId>","name":"title","value":{"type":"string","value":"Hello"}}\n\n## Update data variable\n\nCommands:\n\n- MCP tool: update-variable {"variableId":"<variableId>","value":{"type":"json","value":{"count":1}}}\n\n## Delete data variable\n\nCommands:\n\n- MCP tool: delete-variable {"variableId":"<variableId>"}\n\n## List resources\n\nCommands:\n\n- MCP tool: list-resources {}\n\n## Create resource\n\nCommands:\n\n- MCP tool: create-resource {"name":"Posts","method":"get","url":"https://api.example.com/posts"}\n\n## Update resource\n\nCommands:\n\n- MCP tool: update-resource {"resourceId":"<resourceId>","url":"https://api.example.com/posts"}\n\n## Delete resource\n\nCommands:\n\n- MCP tool: delete-resource {"resourceId":"<resourceId>"}\n\n## List assets\n\nCommands:\n\n- MCP tool: list-assets {"withUsage":true}\n\n## Upload one asset\n\nCommands:\n\n- MCP tool: upload-asset {"asset":"asset.json contents","assetsDir":".webstudio/assets"}\n\n## Upload asset batch\n\nCommands:\n\n- MCP tool: upload-assets {"assets":"assets.json contents","assetsDir":".webstudio/assets"}\n\n## Find asset usage\n\nCommands:\n\n- MCP tool: find-asset-usage {"assetId":"<assetId>"}\n\n## Replace asset references\n\nCommands:\n\n- MCP tool: replace-asset {"fromAssetId":"<oldAssetId>","toAssetId":"<newAssetId>","confirm":true}\n\n## Delete assets\n\nCommands:\n\n- MCP tool: delete-asset {"assetId":"<assetId>","confirm":true}\n\n## Publish project\n\nCommands:\n\n- webstudio publish deploy --target production --json\n\n## List publishes\n\nCommands:\n\n- webstudio publish list --json\n\n## Check publish job\n\nCommands:\n\n- webstudio publish status --job <buildId> --json\n\n## Unpublish\n\nCommands:\n\n- webstudio publish unpublish --target production --confirm --json\n\n## List domains\n\nCommands:\n\n- webstudio domains list --json\n\n## Create domain\n\nCommands:\n\n- webstudio domains create --domain example.com --json\n\n## Update domain\n\nCommands:\n\n- webstudio domains update --domain-id <domainId> --domain www.example.com --json\n\n## Delete domain\n\nCommands:\n\n- webstudio domains delete --domain-id <domainId> --confirm --json\n\n## Verify domain\n\nCommands:\n\n- webstudio domains verify --domain-id <domainId> --json\n\n## Make arbitrary store-level changes\n\nCommands:\n\n- MCP tool: inspect {}\n- MCP tool: snapshot {"include":["<namespace>"]}\n- MCP tool: apply-patch {"baseVersion":"<version>","transactions":"patch.json contents"}\n\nNotes:\n\n- Use only when no semantic command exists.\n\n## Manage marketplace metadata\n\nCommands:\n\n- MCP tool: snapshot {"include":["marketplaceProduct"]}\n- MCP tool: apply-patch {"baseVersion":"<version>","transactions":"patch.json contents"}\n\nPatch namespaces:\n\n- marketplaceProduct\n\n## Search and inspect safely\n\nCommands:\n\n- MCP tool: list-instances {"pagePath":"/","maxDepth":5}\n- MCP tool: inspect-instance {"instanceId":"<instanceId>","include":["props","styles","children"]}\n- MCP tool: list-texts {"pagePath":"/"}\n- MCP tool: list-assets {"withUsage":true}\n- MCP tool: find-asset-usage {"assetId":"<assetId>"}\n- MCP tool: snapshot {"include":["pages","instances","props","resources","assets"]}\n\nNotes:\n\n- Use this for finding elements by label, type, href/resource patterns, HTML snippets, missing accessibility metadata, or asset usage.\n\n## Refactor targeted content\n\nCommands:\n\n- MCP tool: list-instances {"pagePath":"/"}\n- MCP tool: list-texts {"pagePath":"/"}\n- MCP tool: update-text {"instanceId":"<instanceId>","childIndex":0,"text":"Launch faster"}\n- MCP tool: update-props {"updates":"props.json contents"}\n- MCP tool: update-page {"pageId":"<pageId>","title":"Pricing","description":"Plans"}\n- MCP tool: update-resource {"resourceId":"<resourceId>","url":"https://api.example.com/posts"}\n- MCP tool: replace-asset {"fromAssetId":"<oldAssetId>","toAssetId":"<newAssetId>","confirm":true}\n- MCP tool: replace-styles {"replacements":"replace.json contents"}\n- MCP tool: rewrite-css-variable-refs {"variables":"variables.json contents"}\n\nNotes:\n\n- Use focused reads first, then mutate only matching instances, props, metadata, resource URLs, assets, or style references.\n\n## Optimize existing project\n\nCommands:\n\n- MCP tool: list-pages {"includeFolders":true}\n- MCP tool: update-page {"pageId":"<pageId>","title":"Pricing","description":"Plans"}\n- MCP tool: update-props {"updates":"props.json contents"}\n- MCP tool: list-breakpoints {}\n- MCP tool: update-breakpoint {"breakpointId":"tablet","maxWidth":1023}\n- MCP tool: get-styles {"instanceId":"<instanceId>","includeTokens":true}\n- MCP tool: update-styles {"updates":"styles.json contents"}\n- MCP tool: attach-design-token {"styleSourceId":"<tokenId>","instanceIds":"instances.json contents"}\n- MCP tool: update-project-settings {"settings":"project-settings.json contents"}\n\nNotes:\n\n- Use this for SEO metadata, accessibility labels, responsive behavior, token consistency, and project settings.\n\n## Connect external data\n\nCommands:\n\n- MCP tool: create-variable {"scopeInstanceId":"<instanceId>","name":"title","value":{"type":"string","value":"Hello"}}\n- MCP tool: create-resource {"name":"Posts","method":"get","url":"https://api.example.com/posts"}\n- MCP tool: update-resource {"resourceId":"<resourceId>","url":"https://api.example.com/posts"}\n- MCP tool: bind-props {"bindings":"bindings.json contents"}\n- MCP tool: append-instance {"parentInstanceId":"<instanceId>","children":"children.json contents"}\n\nNotes:\n\n- Use this for CMS sections, blog listings, Ghost/headless CMS pages, n8n-style integrations, and API URLs built from variables.\n\n## Support dynamic runtime behavior\n\nCommands:\n\n- MCP tool: append-instance {"parentInstanceId":"<instanceId>","children":"children.json contents"}\n- MCP tool: update-props {"updates":"props.json contents"}\n- MCP tool: bind-props {"bindings":"bindings.json contents"}\n- MCP tool: create-resource {"name":"Seats","method":"get","url":"https://api.example.com/seats"}\n- MCP tool: snapshot {"include":["instances","props","resources"]}\n- MCP tool: apply-patch {"baseVersion":"<version>","transactions":"patch.json contents"}\n\nNotes:\n\n- Use existing scripts/resources for behavior, then move presentational structure into editable Webstudio instances where possible.\n- There is no dedicated semantic command yet for converting script-generated UI into editable Webstudio structure.\n\n## Build authenticated pages\n\nCommands:\n\n- MCP tool: create-page {"name":"Account","path":"/account"}\n- MCP tool: update-page {"pageId":"<pageId>","auth":{"login":"<login>","password":"<password>"}}\n- MCP tool: create-resource {"name":"Session","method":"get","url":"https://api.example.com/session"}\n- MCP tool: create-variable {"scopeInstanceId":"<instanceId>","name":"user","value":{"type":"json","value":{}}}\n- MCP tool: update-props {"updates":"props.json contents"}\n- MCP tool: bind-props {"bindings":"bindings.json contents"}\n\nNotes:\n\n- Basic auth is semantic today. Provider-specific Supabase/Firebase setup still requires manual resources, props, embeds, or patches.\n\n## Generate from design input\n\nCommands:\n\n- MCP tool: create-page {"name":"Landing","path":"/landing"}\n- MCP tool: create-design-token {"tokens":"tokens.json contents"}\n- MCP tool: define-css-variable {"variables":"vars.json contents"}\n- MCP tool: append-instance {"parentInstanceId":"<instanceId>","children":"children.json contents"}\n- MCP tool: update-styles {"updates":"styles.json contents"}\n- MCP tool: preview.start {"host":"127.0.0.1","port":5173}\n- MCP tool: screenshot {"path":"/","output":"current.png","viewport":{"width":1440,"height":900},"waitUntil":"load","waitForTimeout":250}\n\nNotes:\n\n- Use this after external design interpretation. There is no dedicated import command for Figma, screenshots, Inception output, or design.md yet.\n\n## Cross-project maintenance\n\nCommands:\n\n- webstudio init --link <api-share-link> --json\n- webstudio permissions --json\n- webstudio mcp\n\nNotes:\n\n- Public API and CLI intentionally operate on one configured project at a time. Use an external script to loop over projects.\n\n# Known CLI Gaps\n\n## General project search and audit\n\nMissing:\nNo single semantic command searches across instance labels, props, hrefs, resource URLs, HTML embeds, asset references, and missing accessibility metadata.\n\nCurrent fallback:\nUse focused MCP reads such as list-instances, list-texts, list-assets, find-asset-usage, and snapshot.\n\nSuggested commands:\n\n- search-project\n- audit-accessibility\n- find-prop-usage\n\n## Save and manage page templates\n\nMissing:\nCLI can list page templates and create pages from existing templates, but cannot save a page as a template or update/delete templates semantically.\n\nCurrent fallback:\nUse MCP snapshot and apply-patch only when the template data model is understood.\n\nSuggested commands:\n\n- create-page-template\n- update-page-template\n- delete-page-template\n\n## Semantic marketplace metadata\n\nMissing:\nMarketplace metadata is only available through MCP snapshot/apply-patch, not dedicated semantic commands.\n\nCurrent fallback:\nUse MCP snapshot --include marketplaceProduct and apply-patch.\n\nSuggested commands:\n\n- get-marketplace\n- update-marketplace\n\n## Provider-specific authenticated pages\n\nMissing:\nCLI supports page basic auth and generic resources/props/embeds, but not guided Supabase/Firebase auth setup.\n\nCurrent fallback:\nCreate the page, resources, variables, props, and embeds manually with existing MCP semantic tools.\n\nSuggested commands:\n\n- setup-auth-page\n\n## Dynamic script/runtime integration helpers\n\nMissing:\nCLI can manipulate props/resources/embeds, but has no semantic workflow for converting script-generated UI into editable Webstudio structures.\n\nCurrent fallback:\nUse MCP append-instance, props, resources, and raw patch where necessary.\n\nSuggested commands:\n\n- integrate-runtime-ui\n\n## Generate from design input\n\nMissing:\nNo command imports Figma, screenshots, Inception output, or design.md and turns it into pages/tokens/layout.\n\nCurrent fallback:\nUse external generation, then apply semantic CLI commands or apply-patch.\n\nSuggested commands:\n\n- generate-from-design\n\n## Built-in cross-project maintenance\n\nMissing:\nPublic API and CLI intentionally operate on one configured project at a time; there is no built-in multi-project discovery or loop runner.\n\nCurrent fallback:\nRun the CLI from an external script that reconfigures one project/session at a time.\n\nSuggested commands:\n\n- none\n',
-  "manual-api": '# Webstudio API CLI Manual\n\nThe API commands operate on the single project configured by:\n\n- .webstudio/config.json: projectId\n- global Webstudio config: origin and token\n\nRules:\n\n- Always pass --json.\n- Never pass a project id. Commands use configured project only.\n- Read ids before writing. Do not invent ids for existing records.\n- stdout is one JSON object. stderr is diagnostics.\n- Prefer MCP semantic tools for detailed project edits. Use MCP apply-patch only when no semantic tool exists.\n\n## Start\n\n{{start}}\n\n## Read First\n\n{{readFirst}}\n\n## Project Session Cache\n\n- CLI commands use one local ProjectSession snapshot for the configured project.\n- Local-capable reads use cached namespaces when compatible and fetch only missing or stale namespaces.\n- Local-capable mutations build patches from the local snapshot, then commit with the cached build version.\n- Successful mutation commits update the local snapshot only after the remote commit succeeds.\n- Server-only commands run remotely and invalidate/refetch namespaces declared by the operation catalog.\n- Use --refresh on local-capable commands to refresh required namespaces before running.\n- Successful JSON responses include meta.session with operationId, buildId, version, source, committed, compatibility, namespace freshness, and diagnostics.\n\n## CLI Capability Inventory\n\n### Top-Level Commands\n\n{{topLevelCapabilityIndex}}\n\n### High-Level API Commands By Area\n\n{{apiCapabilityIndex}}\n\n### MCP-Only Operations\n\nThese are intentionally exposed through `webstudio mcp`, not as top-level shell commands:\n\n{{mcpOnlyCommandIndex}}\n\n## Task Recipes\n\n{{taskRecipeIndex}}\n\n## Use Case Index\n\n{{useCaseIndex}}\n\n## Known CLI Gaps\n\n{{knownCliGapIndex}}\n\n## Input File Shapes\n\n{{inputFileShapeIndex}}\n\n## Raw Patch Fallback\n\napply-patch accepts either BuildPatchTransaction[] or { "transactions": BuildPatchTransaction[] }.\n\nEach transaction has:\n\n{\n"id": "unique-client-transaction-id",\n"payload": [\n{\n"namespace": "pages",\n"patches": [\n{ "op": "replace", "path": ["meta", "siteName"], "value": "New Site" }\n]\n}\n]\n}\n\nPatch paths are JSON-patch-like paths into Builder store data. Map-like namespaces use ids as the first path item.\n\nSupported namespaces:\n\n- pages: site metadata, redirects, page records, folders, compiler settings\n- instances: element instances and children, including text/expression children\n- props: element props, bindings, page references, resource bindings\n- styles: CSS declarations keyed by style declaration key\n- styleSources: local style sources and reusable design tokens\n- styleSourceSelections: instance-to-style-source connections\n- dataSources: data variables, parameters, and resource data sources\n- resources: data resource definitions\n- assets: project asset records handled by the existing asset patch path\n- breakpoints: responsive breakpoints\n- marketplaceProduct: marketplace metadata\n\nCommit raw patch:\n\nMCP tool: apply-patch\n\n## Raw Patch Examples\n\nRename the site:\n\n[\n{\n"id": "tx-site-name",\n"payload": [\n{\n"namespace": "pages",\n"patches": [\n{ "op": "add", "path": ["meta", "siteName"], "value": "Acme Studio" }\n]\n}\n]\n}\n]\n\nUpdate page title metadata:\n\n[\n{\n"id": "tx-page-title",\n"payload": [\n{\n"namespace": "pages",\n"patches": [\n{ "op": "replace", "path": ["pages", "page-id", "meta", "title"], "value": "Pricing" }\n]\n}\n]\n}\n]\n\nUpdate a text child on an element:\n\n[\n{\n"id": "tx-text",\n"payload": [\n{\n"namespace": "instances",\n"patches": [\n{ "op": "replace", "path": ["instance-id", "children", 0, "value"], "value": "Launch faster" }\n]\n}\n]\n}\n]\n\nCreate a data variable:\n\n[\n{\n"id": "tx-variable",\n"payload": [\n{\n"namespace": "dataSources",\n"patches": [\n{\n"op": "add",\n"path": ["variable-id"],\n"value": {\n"type": "variable",\n"id": "variable-id",\n"scopeInstanceId": "instance-id",\n"name": "headline",\n"value": { "type": "string", "value": "Launch faster" }\n}\n}\n]\n}\n]\n}\n]\n\nCreate a design token:\n\n[\n{\n"id": "tx-token",\n"payload": [\n{\n"namespace": "styleSources",\n"patches": [\n{ "op": "add", "path": ["token-id"], "value": { "type": "token", "id": "token-id", "name": "Brand Primary" } }\n]\n},\n{\n"namespace": "styles",\n"patches": [\n{\n"op": "add",\n"path": ["token-id:base:color:"],\n"value": {\n"styleSourceId": "token-id",\n"breakpointId": "base",\n"property": "color",\n"value": { "type": "keyword", "value": "red" }\n}\n}\n]\n}\n]\n}\n]\n\n## Safety Rules\n\n- For MCP apply-patch, read the latest version with MCP snapshot before writing.\n- Reuse ids from MCP snapshot output when updating existing records.\n- Generate new unique ids when adding records.\n- If apply-patch reports a version conflict, read the latest build and regenerate the patch.\n- Prefer semantic MCP read tools for discovery, then use MCP snapshot for exact patch paths.\n\n## Command Index\n\n{{commandIndex}}\n',
-  "manual-llm": "# Webstudio CLI Manual for LLMs\n\nUse this order. Stop only when a command returns ok:false.\n\n## Always\n\n1. webstudio permissions --json\n2. webstudio mcp\n3. Read MCP resource webstudio://project/tools.\n4. Pick focused MCP read tool.\n5. Pick semantic MCP write tool.\n\n## Pick Read Command\n\n{{readFirst}}\n\n## Pick Write Command\n\n{{taskRecipeIndex}}\n\n## Raw Patch Only If Needed\n\n1. Use MCP tool: snapshot.\n2. Write BuildPatchTransaction[].\n3. Use MCP tool: apply-patch.\n\n## MCP Argument Examples\n\nMCP tools receive JSON argument objects, not CLI flags. Use these shapes:\n\n{{mcpArgumentExampleIndex}}\n\n## Rules\n\n- Never guess ids for existing records. Read them first.\n- Never use project ids from user input. Commands use the configured project.\n- Use --refresh before a local-capable command when cached data may be stale.\n- On VERSION_CONFLICT, read MCP snapshot again, regenerate the patch, then retry.\n- Treat stdout JSON as the API contract and stderr as diagnostics.\n- Confirm destructive commands with --confirm only when user requested deletion/unpublish/replacement.\n- Use webstudio schema api --json for machine-readable command metadata.\n\n## Known Gaps\n\n{{knownCliGapIndex}}\n",
-  "manual-mcp": "# Webstudio MCP Manual\n\n`webstudio mcp` starts a stdio MCP server for the configured project.\n\n## Startup\n\n1. Configure a project with `webstudio init --link <api-share-link> --json`.\n2. Check capabilities with `webstudio permissions --json`.\n3. Start the server with `webstudio mcp`.\n\nWhile the server is running, stdout is reserved for MCP JSON-RPC messages. Do not print human text from the server process.\n\n## Discovery\n\nUse MCP itself after startup:\n\n- `tools/list`: machine-readable available tools\n- `resources/list`: available longer JSON resources\n- `meta.index`: concise capability catalog\n- `meta.guide`: workflow for a user goal\n- `meta.get_more_tools`: detailed params, examples, namespaces, and local/server behavior\n\nUseful resources:\n\n- `webstudio://project/status`: current ProjectSession status\n- `webstudio://project/tools`: operation catalog\n- `webstudio://project/guide`: concise discovery guide\n\n## Core Rules\n\n- Operate on the configured project only.\n- Read ids before writing.\n- Prefer semantic tools over `apply-patch`.\n- Use `status` and `refresh` when cached namespaces may be stale.\n- A mutation is durable only when `meta.session.committed` is true.\n- For visual/design work, verify the rendered result with vision before finishing.\n\n## Vision Verification Loop\n\nVision-capable AI can use MCP to see what it is building:\n\n{{mcpVisionVerificationLoopMarkdown}}\n\nGenerated app setup:\n\n{{mcpGeneratedAppDependencyNotes}}\n\n## MCP Argument Examples\n\nMCP tools receive JSON argument objects:\n\n{{mcpArgumentExampleIndex}}\n\n## Screenshot Verification\n\n{{screenshotVerificationSummary}}\n",
-  "mcp-vision": '# MCP Vision Verification\n\n## Generated App Dependency Notes\n\n- For a fresh checkout, copied fixture, or newly generated app, run npm install or pnpm install in the generated project before preview.start or webstudio preview.\n- If preview fails with a missing generated-app command/package such as react-router or vite, install the generated app dependencies and retry.\n\n## Visual Verification Rule\n\nFor visual/design work, use preview.start and screenshot after generated project files are current and generated app dependencies are installed so vision can inspect the rendered result before finishing. When a baseline exists, use screenshot.diff to get pixel regions, OCR text changes, and diff PNG artifacts.\n\n## Vision Verification Loop\n\n- Make focused page/content/style changes with semantic MCP tools.\n- Make sure generated project files are current and generated app dependencies are installed, then call preview.start once to keep the generated site running.\n- {{dependency-notes}}\n- Call screenshot with { path: "/" } or the changed page path. Use waitForSelector when the page has a reliable ready marker, waitUntil:"networkidle" for network-heavy pages, and waitForTimeout only for final visual settling.\n- {{diff}} When a baseline PNG exists, call screenshot.diff with baselinePath, currentPath, and outputDir.\n- {{diff}} Read screenshot.diff textAnalysis: it reports OCR status plus text that appeared, disappeared, moved, changed content, or changed font/style geometry. If OCR is unavailable, ask the user for permission to install Tesseract, then call vision.install-ocr with { "confirm": true }, or rely on visual inspection.\n- Inspect the PNG and any diff artifacts with vision, then compare layout, OCR text evidence, color, spacing, imagery, and responsive framing against the user intent.\n- If the screenshot does not match, apply another focused mutation and repeat screenshot verification.\n\n## Workflow Summary With Diff\n\nFor visual/design work, make sure generated project files are current and generated app dependencies are installed, call preview.start, then screenshot({ path }); use screenshot.diff when a baseline exists, then inspect pixel regions, OCR textAnalysis, and PNG/diff artifacts with vision before finishing.\n\n## Workflow Summary Without Diff\n\nFor visual/design work, make sure generated project files are current and generated app dependencies are installed, call preview.start, then screenshot({ path }); inspect the PNG with vision before finishing.\n\n## Screenshot Verification Summary\n\nInside MCP, prefer preview.start plus screenshot({ path: "/" }) after generated project files are current and generated app dependencies are installed, so the preview server stays running for fast repeated checks. Screenshot waits for load by default, then fonts and two layout frames; pass waitForSelector for app readiness, waitUntil:"networkidle" for network-heavy pages, and waitForTimeout for final settling. When a baseline exists, use screenshot.diff for changed regions, OCR textAnalysis, and diff artifacts. Outside MCP, use webstudio preview and webstudio screenshot <url> --output current.png.\n\n## Screenshot Diff Evidence\n\n- Pixel evidence: total mismatch, changed regions, dominant color/luminance direction, diffPath, and contextDiffPath.\n- OCR evidence: textAnalysis.status, provider, and changes for appeared/disappeared/content_changed/moved/font_changed text.\n- OCR dependency: screenshot.diff uses the system tesseract binary when available. If missing, it returns ocr_unavailable_tesseract_not_found_or_failed and still returns pixel evidence.\n- OCR install: MCP cannot prompt. Ask the user first; if they agree, call vision.install-ocr with { "confirm": true }. If automatic install is unavailable, follow the returned installUrl.\n- Final judgment: OCR and pixel diff are evidence. A vision-capable model must still inspect screenshots/diff artifacts and compare the rendered result to user intent.\n'
+  "api-use-cases": '# CLI API Use Cases\n\n## Link/configure one project\n\nCommands:\n\n- webstudio init --link <api-share-link> --json\n\nNotes:\n\n- Writes local project id and global origin/token config.\n\n## Import synced project bundle into another project\n\nCommands:\n\n- webstudio sync\n- webstudio import --to <destination-share-link>\n- MCP tool: import {"to":"<destination-share-link>"}\n\nNotes:\n\n- Imports local `.webstudio/data.json` into the destination project.\n- Destination share link must allow build/import access.\n- Use `--skip-assets` only when asset rows and files should not be imported.\n\n## Identify current token\n\nCommands:\n\n- MCP tool: whoami {}\n\n## Check token permissions\n\nCommands:\n\n- webstudio permissions --json\n\n## Inspect project/build/version\n\nCommands:\n\n- MCP tool: inspect {}\n- MCP tool: snapshot {"include":["pages","instances","styles"]}\n\n## Discover CLI/API capabilities\n\nCommands:\n\n- webstudio schema api --json\n- webstudio man api --json\n- webstudio man llm --json\n- webstudio man mcp --json\n- MCP tool: meta.index {}\n- MCP tool: meta.guide {"brief":"Create a pricing page"}\n- MCP tool: meta.get_more_tools {"brief":"update-styles"}\n\nNotes:\n\n- Use `tools/list` for machine-readable MCP tool schemas.\n- Use `resources/list` and `resources/read` for longer MCP resources such as `webstudio://project/tools` and `webstudio://project/guide`.\n\n## Inspect and refresh MCP session cache\n\nCommands:\n\n- MCP tool: status {}\n- MCP tool: refresh {"namespaces":["pages","instances","styles"]}\n- MCP tool: reset-session {}\n\nNotes:\n\n- Use status before a task to understand the cached ProjectSession state.\n- Use refresh when project data may have changed outside the current MCP session.\n- Use reset-session when local cached state is corrupt or incompatible.\n\n## Visually verify rendered work with AI vision\n\nCommands:\n\n- MCP tool: preview.start {"host":"127.0.0.1","port":5173}\n- MCP tool: preview.status {}\n- MCP tool: screenshot {"path":"/","output":"current.png","viewport":{"width":1440,"height":900},"waitUntil":"load","waitForTimeout":250}\n- MCP tool: screenshot.diff {"baselinePath":"before.png","currentPath":"current.png","outputDir":".webstudio/screenshots"}\n- MCP tool: vision.install-ocr {"confirm":true}\n\nNotes:\n\n- Use this after page/content/style mutations and after generated project files are current so a vision-capable AI can see what was actually built.\n- Use waitForSelector when the rendered app has a reliable ready marker, waitUntil:"networkidle" for network-heavy pages, and waitForTimeout only for final visual settling.\n- For a fresh checkout, copied fixture, or newly generated app, run npm install or pnpm install in the generated project before preview.start or webstudio preview.\n- If preview fails with a missing generated-app command/package such as react-router or vite, install the generated app dependencies and retry.\n- When a baseline exists, use screenshot.diff to get changed regions, OCR textAnalysis, and diff artifact paths before deciding whether the result matches.\n- If screenshot.diff reports OCR unavailable and the user agrees to install it, call vision.install-ocr {"confirm":true}; otherwise continue with pixel diff and visual inspection.\n- Compare the PNG, OCR text evidence, and diff artifacts against the user\'s intent for layout, typography, colors, spacing, imagery, and responsive framing; then iterate with focused mutations.\n- Root CLI equivalent: webstudio preview --template ssg, then webstudio screenshot <url> --output current.png.\n\n## List pages\n\nCommands:\n\n- MCP tool: list-pages {"includeFolders":true}\n\n## Read page by id\n\nCommands:\n\n- MCP tool: get-page {"pageId":"<pageId>"}\n\n## Read page by path\n\nCommands:\n\n- MCP tool: get-page-by-path {"path":"/pricing"}\n\n## Create page\n\nCommands:\n\n- MCP tool: create-page {"name":"Pricing","path":"/pricing"}\n\n## Update page settings/metadata\n\nCommands:\n\n- MCP tool: update-page {"pageId":"<pageId>","values":{"title":"\\"Pricing\\"","meta":{"description":"\\"Plans\\"","status":"200"}}}\n- MCP tool: update-page {"pageId":"<pageId>","values":{"meta":{"auth":{"login":"<login>","password":"<password>"}}}}\n\nNotes:\n\n- Page title and metadata text fields are expression-backed. For fixed text, send a quoted JavaScript string literal expression such as `"\\"Pricing\\""`.\n\n## Read project settings\n\nCommands:\n\n- MCP tool: get-project-settings {}\n\n## Update project settings\n\nCommands:\n\n- MCP tool: update-project-settings {"settings":"project-settings.json contents"}\n\n## List redirects\n\nCommands:\n\n- MCP tool: list-redirects {}\n\n## Create redirect\n\nCommands:\n\n- MCP tool: create-redirect {"oldPath":"/old","newPath":"/new","status":301}\n\n## Update redirect\n\nCommands:\n\n- MCP tool: update-redirect {"oldPath":"/old","newPath":"/newer","status":302}\n- MCP tool: update-redirect {"oldPath":"/old","status":null}\n\n## Delete redirect\n\nCommands:\n\n- MCP tool: delete-redirect {"oldPath":"/old"}\n\n## List breakpoints\n\nCommands:\n\n- MCP tool: list-breakpoints {}\n\n## Create breakpoint\n\nCommands:\n\n- MCP tool: create-breakpoint {"breakpointId":"tablet","label":"Tablet","maxWidth":991}\n\n## Update breakpoint\n\nCommands:\n\n- MCP tool: update-breakpoint {"breakpointId":"tablet","label":"Tablet","maxWidth":1023}\n- MCP tool: update-breakpoint {"breakpointId":"tablet","condition":null,"minWidth":768}\n- MCP tool: update-breakpoint {"breakpointId":"tablet","minWidth":null,"maxWidth":null,"condition":"(hover: hover)"}\n\n## Delete breakpoint\n\nCommands:\n\n- MCP tool: delete-breakpoint {"breakpointId":"tablet","confirm":true}\n\n## Duplicate page\n\nCommands:\n\n- MCP tool: duplicate-page {"pageId":"<pageId>","name":"Pricing Copy","path":"/pricing-copy"}\n\n## List page templates\n\nCommands:\n\n- MCP tool: list-page-templates {}\n\n## Create page from template\n\nCommands:\n\n- MCP tool: create-page-from-template {"templateId":"<templateId>","name":"Landing","path":"/landing"}\n\n## Delete page\n\nCommands:\n\n- MCP tool: delete-page {"pageId":"<pageId>"}\n\n## List folders\n\nCommands:\n\n- MCP tool: list-folders {"includePages":true}\n\n## Create folder\n\nCommands:\n\n- MCP tool: create-folder {"name":"Blog","slug":"blog"}\n\n## Update folder\n\nCommands:\n\n- MCP tool: update-folder {"folderId":"<folderId>","name":"Blog","slug":"blog"}\n\n## Delete folder\n\nCommands:\n\n- MCP tool: delete-folder {"folderId":"<folderId>"}\n\n## List element instances\n\nCommands:\n\n- MCP tool: list-instances {"pagePath":"/","maxDepth":3}\n\n## Inspect one element instance\n\nCommands:\n\n- MCP tool: inspect-instance {"instanceId":"<instanceId>","include":["props","styles","children"]}\n\n## Append/prepend/replace child elements\n\nCommands:\n\n- MCP tool: append-instance {"parentInstanceId":"<instanceId>","children":"children.json contents"}\n\n## Move elements\n\nCommands:\n\n- MCP tool: move-instance {"moves":"moves.json contents"}\n\n## Clone element subtree\n\nCommands:\n\n- MCP tool: clone-instance {"sourceInstanceId":"<instanceId>","parentInstanceId":"<targetParentId>"}\n\n## Delete element subtree\n\nCommands:\n\n- MCP tool: delete-instance {"instanceId":"<instanceId>"}\n\n## List text/expression children\n\nCommands:\n\n- MCP tool: list-texts {"pagePath":"/"}\n\n## Update text child\n\nCommands:\n\n- MCP tool: update-text {"instanceId":"<instanceId>","childIndex":0,"text":"Launch faster"}\n\n## Update props\n\nCommands:\n\n- MCP tool: update-props {"updates":"props.json contents"}\n\nNotes:\n\n- Use this for fixed prop values such as `aria-label`, `alt`, `id`, static `href`, and other direct string/number/boolean/json prop values.\n- Do not use bindings just to set static text.\n\n## Delete props\n\nCommands:\n\n- MCP tool: delete-props {"deletions":"props.json contents"}\n\n## Bind props to expressions/resources/actions\n\nCommands:\n\n- MCP tool: bind-props {"bindings":"bindings.json contents"}\n\nNotes:\n\n- Use this only when the prop should remain dynamic: expression, parameter, resource, or action binding.\n- For a fixed string value, use `update-props` with `type:"string"` and a direct `value` instead.\n\n## Read styles\n\nCommands:\n\n- MCP tool: get-styles {"instanceId":"<instanceId>","includeTokens":true}\n\n## Update local styles\n\nCommands:\n\n- MCP tool: update-styles {"updates":"styles.json contents"}\n\n## Delete local styles\n\nCommands:\n\n- MCP tool: delete-styles {"deletions":"styles.json contents"}\n\n## Replace matching style values\n\nCommands:\n\n- MCP tool: replace-styles {"replacements":"replace.json contents"}\n\n## List design tokens\n\nCommands:\n\n- MCP tool: list-design-tokens {"withUsage":true}\n\n## Create design tokens\n\nCommands:\n\n- MCP tool: create-design-token {"tokens":"tokens.json contents"}\n\n## Update design token styles\n\nCommands:\n\n- MCP tool: update-design-token-styles {"styleSourceId":"<tokenId>","updates":"styles.json contents"}\n\n## Delete design token styles\n\nCommands:\n\n- MCP tool: delete-design-token-styles {"styleSourceId":"<tokenId>","deletions":"styles.json contents"}\n\n## Attach design token to instances\n\nCommands:\n\n- MCP tool: attach-design-token {"styleSourceId":"<tokenId>","instanceIds":"instances.json contents"}\n\n## Detach design token from instances\n\nCommands:\n\n- MCP tool: detach-design-token {"styleSourceId":"<tokenId>","instanceIds":"instances.json contents"}\n\n## Extract design token from local styles\n\nCommands:\n\n- MCP tool: extract-design-token {"token":"token.json contents"}\n\n## List CSS variables\n\nCommands:\n\n- MCP tool: list-css-variables {"withUsage":true}\n\n## Define CSS variables\n\nCommands:\n\n- MCP tool: define-css-variable {"variables":"vars.json contents"}\n\n## Delete CSS variables\n\nCommands:\n\n- MCP tool: delete-css-variable {"names":"names.json contents","confirm":true}\n\n## Rewrite CSS variable references\n\nCommands:\n\n- MCP tool: rewrite-css-variable-refs {"variables":"variables.json contents"}\n\n## List data variables\n\nCommands:\n\n- MCP tool: list-variables {}\n\n## Create data variable\n\nCommands:\n\n- MCP tool: create-variable {"scopeInstanceId":"<instanceId>","name":"title","value":{"type":"string","value":"Hello"}}\n\n## Update data variable\n\nCommands:\n\n- MCP tool: update-variable {"variableId":"<variableId>","value":{"type":"json","value":{"count":1}}}\n\n## Delete data variable\n\nCommands:\n\n- MCP tool: delete-variable {"variableId":"<variableId>"}\n\n## List resources\n\nCommands:\n\n- MCP tool: list-resources {}\n\n## Create resource\n\nCommands:\n\n- MCP tool: create-resource {"name":"Posts","method":"get","url":"\\"https://api.example.com/posts\\""}\n\n## Update resource\n\nCommands:\n\n- MCP tool: update-resource {"resourceId":"<resourceId>","values":{"url":"\\"https://api.example.com/posts\\""}}\n\n## Delete resource\n\nCommands:\n\n- MCP tool: delete-resource {"resourceId":"<resourceId>"}\n\n## List assets\n\nCommands:\n\n- MCP tool: list-assets {"withUsage":true}\n\n## Upload one asset\n\nCommands:\n\n- MCP tool: upload-asset {"asset":"asset.json contents","assetsDir":".webstudio/assets"}\n\n## Upload asset batch\n\nCommands:\n\n- MCP tool: upload-assets {"assets":"assets.json contents","assetsDir":".webstudio/assets"}\n\n## Find asset usage\n\nCommands:\n\n- MCP tool: find-asset-usage {"assetId":"<assetId>"}\n\n## Replace asset references\n\nCommands:\n\n- MCP tool: replace-asset {"fromAssetId":"<oldAssetId>","toAssetId":"<newAssetId>","confirm":true}\n\n## Delete assets\n\nCommands:\n\n- MCP tool: delete-asset {"assetId":"<assetId>","confirm":true}\n\n## Publish project\n\nCommands:\n\n- webstudio publish deploy --target production --json\n\n## List publishes\n\nCommands:\n\n- webstudio publish list --json\n\n## Check publish job\n\nCommands:\n\n- webstudio publish status --job <buildId> --json\n\n## Unpublish\n\nCommands:\n\n- webstudio publish unpublish --target production --confirm --json\n\n## List domains\n\nCommands:\n\n- webstudio domains list --json\n\n## Create domain\n\nCommands:\n\n- webstudio domains create --domain example.com --json\n\n## Update domain\n\nCommands:\n\n- webstudio domains update --domain-id <domainId> --domain www.example.com --json\n\n## Delete domain\n\nCommands:\n\n- webstudio domains delete --domain-id <domainId> --confirm --json\n\n## Verify domain\n\nCommands:\n\n- webstudio domains verify --domain-id <domainId> --json\n\n## Make arbitrary store-level changes\n\nCommands:\n\n- MCP tool: inspect {}\n- MCP tool: snapshot {"include":["<namespace>"]}\n- MCP tool: apply-patch {"baseVersion":"<version>","transactions":"patch.json contents"}\n\nNotes:\n\n- Use only when no semantic command exists.\n\n## Manage marketplace metadata\n\nCommands:\n\n- MCP tool: snapshot {"include":["marketplaceProduct"]}\n- MCP tool: apply-patch {"baseVersion":"<version>","transactions":"patch.json contents"}\n\nPatch namespaces:\n\n- marketplaceProduct\n\n## Search and inspect safely\n\nCommands:\n\n- MCP tool: list-instances {"pagePath":"/","maxDepth":5}\n- MCP tool: inspect-instance {"instanceId":"<instanceId>","include":["props","styles","children"]}\n- MCP tool: list-texts {"pagePath":"/"}\n- MCP tool: list-assets {"withUsage":true}\n- MCP tool: find-asset-usage {"assetId":"<assetId>"}\n- MCP tool: snapshot {"include":["pages","instances","props","resources","assets"]}\n\nNotes:\n\n- Use this for finding elements by label, type, href/resource patterns, HTML snippets, missing accessibility metadata, or asset usage.\n\n## Refactor targeted content\n\nCommands:\n\n- MCP tool: list-instances {"pagePath":"/"}\n- MCP tool: list-texts {"pagePath":"/"}\n- MCP tool: update-text {"instanceId":"<instanceId>","childIndex":0,"text":"Launch faster"}\n- MCP tool: update-props {"updates":"props.json contents"}\n- MCP tool: update-page {"pageId":"<pageId>","values":{"title":"\\"Pricing\\"","meta":{"description":"\\"Plans\\""}}}\n- MCP tool: update-resource {"resourceId":"<resourceId>","values":{"url":"\\"https://api.example.com/posts\\""}}\n- MCP tool: replace-asset {"fromAssetId":"<oldAssetId>","toAssetId":"<newAssetId>","confirm":true}\n- MCP tool: replace-styles {"replacements":"replace.json contents"}\n- MCP tool: rewrite-css-variable-refs {"variables":"variables.json contents"}\n\nNotes:\n\n- Use focused reads first, then mutate only matching instances, props, metadata, resource URLs, assets, or style references.\n\n## Optimize existing project\n\nCommands:\n\n- MCP tool: list-pages {"includeFolders":true}\n- MCP tool: update-page {"pageId":"<pageId>","values":{"title":"\\"Pricing\\"","meta":{"description":"\\"Plans\\""}}}\n- MCP tool: update-props {"updates":"props.json contents"}\n- MCP tool: list-breakpoints {}\n- MCP tool: update-breakpoint {"breakpointId":"tablet","maxWidth":1023}\n- MCP tool: get-styles {"instanceId":"<instanceId>","includeTokens":true}\n- MCP tool: update-styles {"updates":"styles.json contents"}\n- MCP tool: attach-design-token {"styleSourceId":"<tokenId>","instanceIds":"instances.json contents"}\n- MCP tool: update-project-settings {"settings":"project-settings.json contents"}\n\nNotes:\n\n- Use this for SEO metadata, accessibility labels, responsive behavior, token consistency, and project settings.\n\n## Connect external data\n\nCommands:\n\n- MCP tool: create-variable {"scopeInstanceId":"<instanceId>","name":"title","value":{"type":"string","value":"Hello"}}\n- MCP tool: create-resource {"name":"Posts","method":"get","url":"\\"https://api.example.com/posts\\""}\n- MCP tool: update-resource {"resourceId":"<resourceId>","values":{"url":"\\"https://api.example.com/posts\\""}}\n- MCP tool: bind-props {"bindings":"bindings.json contents"}\n- MCP tool: append-instance {"parentInstanceId":"<instanceId>","children":"children.json contents"}\n\nNotes:\n\n- Use this for CMS sections, blog listings, Ghost/headless CMS pages, n8n-style integrations, and API URLs built from variables.\n\n## Support dynamic runtime behavior\n\nCommands:\n\n- MCP tool: append-instance {"parentInstanceId":"<instanceId>","children":"children.json contents"}\n- MCP tool: update-props {"updates":"props.json contents"}\n- MCP tool: bind-props {"bindings":"bindings.json contents"}\n- MCP tool: create-resource {"name":"Seats","method":"get","url":"\\"https://api.example.com/seats\\""}\n- MCP tool: snapshot {"include":["instances","props","resources"]}\n- MCP tool: apply-patch {"baseVersion":"<version>","transactions":"patch.json contents"}\n\nNotes:\n\n- Use existing scripts/resources for behavior, then move presentational structure into editable Webstudio instances where possible.\n- There is no dedicated semantic command yet for converting script-generated UI into editable Webstudio structure.\n\n## Build authenticated pages\n\nCommands:\n\n- MCP tool: create-page {"name":"Account","path":"/account"}\n- MCP tool: update-page {"pageId":"<pageId>","values":{"meta":{"auth":{"login":"<login>","password":"<password>"}}}}\n- MCP tool: create-resource {"name":"Session","method":"get","url":"\\"https://api.example.com/session\\""}\n- MCP tool: create-variable {"scopeInstanceId":"<instanceId>","name":"user","value":{"type":"json","value":{}}}\n- MCP tool: update-props {"updates":"props.json contents"}\n- MCP tool: bind-props {"bindings":"bindings.json contents"}\n\nNotes:\n\n- Basic auth is semantic today. Provider-specific Supabase/Firebase setup still requires manual resources, props, embeds, or patches.\n\n## Generate from design input\n\nCommands:\n\n- MCP tool: create-page {"name":"Landing","path":"/landing"}\n- MCP tool: create-design-token {"tokens":"tokens.json contents"}\n- MCP tool: define-css-variable {"variables":"vars.json contents"}\n- MCP tool: append-instance {"parentInstanceId":"<instanceId>","children":"children.json contents"}\n- MCP tool: update-styles {"updates":"styles.json contents"}\n- MCP tool: preview.start {"host":"127.0.0.1","port":5173}\n- MCP tool: screenshot {"path":"/","output":"current.png","viewport":{"width":1440,"height":900},"waitUntil":"load","waitForTimeout":250}\n\nNotes:\n\n- Use this after external design interpretation. There is no dedicated import command for Figma, screenshots, Inception output, or design.md yet.\n\n## Cross-project maintenance\n\nCommands:\n\n- webstudio init --link <api-share-link> --json\n- webstudio permissions --json\n- webstudio mcp\n\nNotes:\n\n- Public API and CLI intentionally operate on one configured project at a time. Use an external script to loop over projects.\n\n# Known CLI Gaps\n\n## General project search and audit\n\nMissing:\nNo single semantic command searches across instance labels, props, hrefs, resource URLs, HTML embeds, asset references, and missing accessibility metadata.\n\nCurrent fallback:\nUse focused MCP reads such as list-instances, list-texts, list-assets, find-asset-usage, and snapshot.\n\nSuggested commands:\n\n- search-project\n- audit-accessibility\n- find-prop-usage\n\n## Save and manage page templates\n\nMissing:\nCLI can list page templates and create pages from existing templates, but cannot save a page as a template or update/delete templates semantically.\n\nCurrent fallback:\nUse MCP snapshot and apply-patch only when the template data model is understood.\n\nSuggested commands:\n\n- create-page-template\n- update-page-template\n- delete-page-template\n\n## Semantic marketplace metadata\n\nMissing:\nMarketplace metadata is only available through MCP snapshot/apply-patch, not dedicated semantic commands.\n\nCurrent fallback:\nUse MCP snapshot --include marketplaceProduct and apply-patch.\n\nSuggested commands:\n\n- get-marketplace\n- update-marketplace\n\n## Provider-specific authenticated pages\n\nMissing:\nCLI supports page basic auth and generic resources/props/embeds, but not guided Supabase/Firebase auth setup.\n\nCurrent fallback:\nCreate the page, resources, variables, props, and embeds manually with existing MCP semantic tools.\n\nSuggested commands:\n\n- setup-auth-page\n\n## Dynamic script/runtime integration helpers\n\nMissing:\nCLI can manipulate props/resources/embeds, but has no semantic workflow for converting script-generated UI into editable Webstudio structures.\n\nCurrent fallback:\nUse MCP append-instance, props, resources, and raw patch where necessary.\n\nSuggested commands:\n\n- integrate-runtime-ui\n\n## Generate from design input\n\nMissing:\nNo command imports Figma, screenshots, Inception output, or design.md and turns it into pages/tokens/layout.\n\nCurrent fallback:\nUse external generation, then apply semantic CLI commands or apply-patch.\n\nSuggested commands:\n\n- generate-from-design\n\n## Built-in cross-project maintenance\n\nMissing:\nPublic API and CLI intentionally operate on one configured project at a time; there is no built-in multi-project discovery or loop runner.\n\nCurrent fallback:\nRun the CLI from an external script that reconfigures one project/session at a time.\n\nSuggested commands:\n\n- none\n',
+  "manual-api": '# Webstudio API CLI Manual\n\nThe API commands operate on the single project configured by:\n\n- .webstudio/config.json: projectId\n- global Webstudio config: origin and token\n\n- Pass --json to API/discovery commands that support it. Do not add --json to top-level commands unless their help/schema documents it.\n- Never pass a project id. Commands use configured project only.\n- Read ids before writing. Do not invent ids for existing records.\n- stdout is one JSON object. stderr is diagnostics.\n- Prefer MCP semantic tools for detailed project edits. Use MCP apply-patch only when no semantic tool exists.\n\n## Start\n\n{{start}}\n\n## Read First\n\n{{readFirst}}\n\n## Project Session Cache\n\n- CLI commands use one local ProjectSession snapshot for the configured project.\n- Local-capable reads use cached namespaces when compatible and fetch only missing or stale namespaces.\n- Local-capable mutations build patches from the local snapshot, then commit with the cached build version.\n- Successful mutation commits update the local snapshot only after the remote commit succeeds.\n- Server-only commands run remotely and invalidate/refetch namespaces declared by the operation catalog.\n- Use --refresh on local-capable commands to refresh required namespaces before running.\n- Successful JSON responses include meta.session with operationId, buildId, version, source, committed, compatibility, namespace freshness, and diagnostics.\n\n## CLI Capability Inventory\n\n### Top-Level Commands\n\n{{topLevelCapabilityIndex}}\n\n### High-Level API Commands By Area\n\n{{apiCapabilityIndex}}\n\n### MCP-Only Operations\n\nThese are intentionally exposed through `webstudio mcp`, not as top-level shell commands:\n\n{{mcpOnlyCommandIndex}}\n\n## Task Recipes\n\n{{taskRecipeIndex}}\n\n## Use Case Index\n\n{{useCaseIndex}}\n\n## Known CLI Gaps\n\n{{knownCliGapIndex}}\n\n## Input File Shapes\n\n{{inputFileShapeIndex}}\n\n## Raw Patch Fallback\n\napply-patch accepts either BuildPatchTransaction[] or { "transactions": BuildPatchTransaction[] }.\n\nEach transaction has:\n\n{\n"id": "unique-client-transaction-id",\n"payload": [\n{\n"namespace": "pages",\n"patches": [\n{ "op": "replace", "path": ["meta", "siteName"], "value": "New Site" }\n]\n}\n]\n}\n\nPatch paths are JSON-patch-like paths into Builder store data. Map-like namespaces use ids as the first path item.\n\nSupported namespaces:\n\n- pages: site metadata, redirects, page records, folders, compiler settings\n- instances: element instances and children, including text/expression children\n- props: element props, bindings, page references, resource bindings\n- styles: CSS declarations keyed by style declaration key\n- styleSources: local style sources and reusable design tokens\n- styleSourceSelections: instance-to-style-source connections\n- dataSources: data variables, parameters, and resource data sources\n- resources: data resource definitions\n- assets: project asset records handled by the existing asset patch path\n- breakpoints: responsive breakpoints\n- marketplaceProduct: marketplace metadata\n\nCommit raw patch:\n\nMCP tool: apply-patch\n\n## Raw Patch Examples\n\nRename the site:\n\n[\n{\n"id": "tx-site-name",\n"payload": [\n{\n"namespace": "pages",\n"patches": [\n{ "op": "add", "path": ["meta", "siteName"], "value": "Acme Studio" }\n]\n}\n]\n}\n]\n\nUpdate page title metadata:\n\n[\n{\n"id": "tx-page-title",\n"payload": [\n{\n"namespace": "pages",\n"patches": [\n{ "op": "replace", "path": ["pages", "page-id", "meta", "title"], "value": "Pricing" }\n]\n}\n]\n}\n]\n\nUpdate a text child on an element:\n\n[\n{\n"id": "tx-text",\n"payload": [\n{\n"namespace": "instances",\n"patches": [\n{ "op": "replace", "path": ["instance-id", "children", 0, "value"], "value": "Launch faster" }\n]\n}\n]\n}\n]\n\nCreate a data variable:\n\n[\n{\n"id": "tx-variable",\n"payload": [\n{\n"namespace": "dataSources",\n"patches": [\n{\n"op": "add",\n"path": ["variable-id"],\n"value": {\n"type": "variable",\n"id": "variable-id",\n"scopeInstanceId": "instance-id",\n"name": "headline",\n"value": { "type": "string", "value": "Launch faster" }\n}\n}\n]\n}\n]\n}\n]\n\nCreate a design token:\n\n[\n{\n"id": "tx-token",\n"payload": [\n{\n"namespace": "styleSources",\n"patches": [\n{ "op": "add", "path": ["token-id"], "value": { "type": "token", "id": "token-id", "name": "Brand Primary" } }\n]\n},\n{\n"namespace": "styles",\n"patches": [\n{\n"op": "add",\n"path": ["token-id:base:color:"],\n"value": {\n"styleSourceId": "token-id",\n"breakpointId": "base",\n"property": "color",\n"value": { "type": "keyword", "value": "red" }\n}\n}\n]\n}\n]\n}\n]\n\n## Safety Rules\n\n- For MCP apply-patch, read the latest version with MCP snapshot before writing.\n- Reuse ids from MCP snapshot output when updating existing records.\n- Generate new unique ids when adding records.\n- If apply-patch reports a version conflict, read the latest build and regenerate the patch.\n- Prefer semantic MCP read tools for discovery, then use MCP snapshot for exact patch paths.\n\n## Command Index\n\n{{commandIndex}}\n',
+  "manual-llm": '# Webstudio CLI Manual for LLMs\n\nUse this order. Stop only when a command returns ok:false.\n\n## Always\n\n1. webstudio permissions --json\n2. webstudio mcp\n3. Read MCP resource webstudio://project/tools.\n4. Pick focused MCP read tool.\n5. Pick semantic MCP write tool.\n\n## LLM Implementation Process\n\nUse this process for user requests that change Webstudio content, layout, styles, assets, pages, redirects, resources, or publishing state:\n\n1. Discover capabilities with `webstudio man llm --json`, `webstudio schema api --json`, and MCP `meta.index` or `webstudio://project/tools`.\n2. Inspect current project state with semantic reads such as `list-pages`, `get-page-by-path`, `list-instances`, `inspect-instance`, `get-styles`, `list-assets`, `list-breakpoints`, and `snapshot` only when needed.\n3. Mutate the Webstudio project with semantic MCP write tools first. Prefer `append-instance`, `update-text`, `update-props`, `update-styles`, `upload-asset`, `create-page`, and page/project settings tools over raw patches.\n4. Use `apply-patch` only when no semantic tool covers the required change, and only after reading the latest snapshot/version.\n5. For visual/design work, regenerate or preview the generated app, capture a screenshot, inspect it with vision, and iterate before final response.\n6. Report what changed and what verification ran.\n\n## Visual Design Workflow\n\nFor requests involving visible HTML/CSS, layout, typography, colors, imagery, responsive behavior, or screenshots:\n\n1. Read editable Webstudio structure first: pages, instances, props, styles, breakpoints, assets, and relevant text.\n2. Do not use generated route/component files as the source of truth for editable content.\n3. Make edits through Webstudio semantic commands/MCP tools so the result stays editable in Builder and survives the next `webstudio build`.\n4. Keep generated project files current, start preview, and capture the changed page with `screenshot`.\n5. Use `screenshot.diff` when a baseline exists and inspect screenshot/diff artifacts with vision before finishing.\n6. If vision or screenshot tooling is unavailable, state that explicitly and explain what fallback verification was used.\n\n## Responsive Verification Workflow\n\nFor responsive page work, use Builder breakpoints as the source of truth:\n\n1. Read breakpoints with `list-breakpoints` before deciding responsive behavior.\n2. Apply responsive styles with existing Builder breakpoint ids; do not invent CSS media queries or breakpoint names when Webstudio breakpoint data exists.\n3. Pick screenshot viewport widths from the project breakpoints: include a desktop width, each defined max-width or min-width edge, and a narrow mobile width.\n4. Capture each viewport with `screenshot`, for example `{"path":"/","output":"home-375.png","viewport":{"width":375,"height":812}}` and `{"path":"/","output":"home-1440.png","viewport":{"width":1440,"height":900}}`.\n5. Inspect every viewport screenshot with vision before finishing, checking layout, overflow, hidden content, text wrapping, and breakpoint-specific style changes.\n6. If any viewport fails, update styles through semantic Webstudio tools and repeat screenshots for the affected breakpoints.\n\n## Generated Files Guardrails\n\n- Do not edit `app/__generated__`, generated route files, generated page files, generated CSS, or build output for normal Webstudio content/design requests.\n- Do not replace generated page components with handcrafted app code unless the user explicitly asks for code-only export customization.\n- Generated files are build artifacts and may be overwritten by `webstudio build`.\n- If a task truly requires generated app customization, keep it outside `app/__generated__` where possible and explain that it is not editable Webstudio content.\n\n## Values vs Bindings\n\n- Use direct value tools for fixed content. For visible text, use `update-text` with plain `text`. For static props such as `aria-label`, `alt`, `id`, `class`, `href`, or button labels stored as props, use `update-props` with the prop\'s direct type/value.\n- Use `bind-props` only when the prop must stay dynamic: an expression, parameter, resource result, or action. Do not use `bind-props` just to set a fixed string.\n- Direct prop string example: `{"updates":[{"instanceId":"button-id","name":"aria-label","type":"string","value":"Open menu"}]}`.\n- Expression binding example: `{"bindings":[{"instanceId":"link-id","name":"href","binding":{"type":"expression","value":"currentPost.url"}}]}`.\n- Page metadata fields such as `title`, `description`, `language`, `redirect`, `status`, and custom meta content are expression-backed strings. For fixed text, pass a JavaScript string literal expression with JSON quoting, for example `JSON.stringify("Pricing | Acme")` in code or `"\\"Pricing | Acme\\""` in JSON. Never pass raw multi-word text such as `"Pricing | Acme"` as an expression.\n- Page metadata update example: use `update-page` with `{"pageId":"page-id","values":{"title":"\\"Pricing | Acme\\"","meta":{"description":"\\"Plans for teams\\""}}}`.\n- Resource URL, header, search-param, and body fields are also expression-backed. For a fixed URL, use a string literal expression such as `"\\"https://api.example.com/items\\""`.\n- Resource update example: use `update-resource` with `{"resourceId":"resource-id","values":{"url":"\\"https://api.example.com/items\\""}}`.\n\n## Pick Read Command\n\n{{readFirst}}\n\n## Pick Write Command\n\n{{taskRecipeIndex}}\n\n## Raw Patch Only If Needed\n\n1. Use MCP tool: snapshot.\n2. Write BuildPatchTransaction[].\n3. Use MCP tool: apply-patch.\n\n## MCP Argument Examples\n\nMCP tools receive JSON argument objects, not CLI flags. Use these shapes:\n\n{{mcpArgumentExampleIndex}}\n\n## Rules\n\n- Never guess ids for existing records. Read them first.\n- Never use project ids from user input. Commands use the configured project.\n- Use --refresh before a local-capable command when cached data may be stale.\n- Pass --json only to commands whose help/schema documents it. Do not add --json to top-level commands such as sync unless supported.\n- On VERSION_CONFLICT, read MCP snapshot again, regenerate the patch, then retry.\n- Treat stdout JSON as the API contract and stderr as diagnostics.\n- For visual/design work, verify the rendered result with vision before finishing.\n- Do not edit generated files for normal Webstudio content/design requests.\n- Use direct values for static strings and bindings only for dynamic expressions/resources/actions.\n- For expression-backed fields that need fixed text, encode the fixed text as a quoted JavaScript string literal expression.\n- Confirm destructive commands with --confirm only when user requested deletion/unpublish/replacement.\n- Use webstudio schema api --json for machine-readable command metadata.\n\n## Known Gaps\n\n{{knownCliGapIndex}}\n',
+  "manual-mcp": "# Webstudio MCP Manual\n\n`webstudio mcp` starts a stdio MCP server for the configured project.\n\n## Startup\n\n1. Configure a project with `webstudio init --link <api-share-link> --json`.\n2. Check capabilities with `webstudio permissions --json`.\n3. Start the server with `webstudio mcp`.\n4. In the MCP client, read `webstudio://project/guide` before editing, or call `meta.index` and `meta.guide`.\n\nWhile the server is running, stdout is reserved for MCP JSON-RPC messages. Do not print human text from the server process.\n\n## Discovery\n\nUse MCP itself after startup:\n\n- `tools/list`: machine-readable available tools\n- `resources/list`: available longer JSON resources\n- `meta.index`: concise capability catalog\n- `meta.guide`: workflow for a user goal\n- `meta.get_more_tools`: detailed params, examples, namespaces, and local/server behavior\n\nUseful resources:\n\n- `webstudio://project/status`: current ProjectSession status\n- `webstudio://project/tools`: operation catalog\n- `webstudio://project/guide`: concise discovery guide\n\n## Core Rules\n\n- stdout is reserved for MCP JSON-RPC while the server is running.\n- Operate on the configured project only.\n- Read ids before writing.\n- Prefer semantic tools over `apply-patch`.\n- Use `status` and `refresh` when cached namespaces may be stale.\n- A mutation is durable only when `meta.session.committed` is true.\n- For visual/design work, verify the rendered result with vision before finishing.\n\n## Vision Verification Loop\n\nVision-capable AI can use MCP to see what it is building:\n\n{{mcpVisionVerificationLoopMarkdown}}\n\nGenerated app setup:\n\n{{mcpGeneratedAppDependencyNotes}}\n\n## MCP Argument Examples\n\nMCP tools receive JSON argument objects:\n\n{{mcpArgumentExampleIndex}}\n\n## Screenshot Verification\n\n{{screenshotVerificationSummary}}\n",
+  "mcp-startup-epilogue": "Plain `webstudio mcp` starts the stdio MCP server.\n\nStartup marks cached ProjectSession data stale so MCP tools read the current Builder dev build.\n\nAfter startup, read MCP resource `webstudio://project/guide` before editing.\n\nAfter startup, MCP clients discover capabilities with `tools/list`, `resources/list`, `meta.index`, `meta.guide`, and `meta.get_more_tools`.\n\nstdout is reserved for MCP JSON-RPC messages while the server is running.\n",
+  "mcp-vision": '# MCP Vision Verification\n\n## Generated App Dependency Notes\n\n- For a fresh checkout, copied fixture, or newly generated app, run npm install or pnpm install in the generated project before preview.start or webstudio preview.\n- If preview fails with a missing generated-app command/package such as react-router or vite, install the generated app dependencies and retry.\n\n## Visual Verification Rule\n\nFor visual/design work, use preview.start and screenshot after generated project files are current and generated app dependencies are installed so vision can inspect the rendered result before finishing. When a baseline exists, use screenshot.diff to get pixel regions, OCR text changes, and diff PNG artifacts.\n\n## Vision Verification Loop\n\n- Make focused page/content/style changes with semantic MCP tools.\n- Make sure generated project files are current and generated app dependencies are installed, then call preview.start once to keep the generated site running.\n- {{dependency-notes}}\n- For responsive work, call list-breakpoints first, then capture screenshots at viewport widths based on the Builder breakpoints plus a narrow mobile and desktop width.\n- Call screenshot with { path: "/" } or the changed page path and viewport such as { width: 375, height: 812 } and { width: 1440, height: 900 }. Use waitForSelector when the page has a reliable ready marker, waitUntil:"networkidle" for network-heavy pages, and waitForTimeout only for final visual settling.\n- {{diff}} When a baseline PNG exists, call screenshot.diff with baselinePath, currentPath, and outputDir.\n- {{diff}} Read screenshot.diff textAnalysis: it reports OCR status plus text that appeared, disappeared, moved, changed content, or changed font/style geometry. If OCR is unavailable, ask the user for permission to install Tesseract, then call vision.install-ocr with { "confirm": true }, or rely on visual inspection.\n- Inspect every viewport PNG and any diff artifacts with vision, then compare layout, OCR text evidence, color, spacing, imagery, and responsive framing against the user intent.\n- If the screenshot does not match, apply another focused mutation and repeat screenshot verification.\n\n## Workflow Summary With Diff\n\nFor visual/design work, make sure generated project files are current and generated app dependencies are installed, call preview.start, then screenshot({ path, viewport }); for responsive work, use list-breakpoints and capture the changed page at Builder breakpoint widths plus mobile and desktop widths; use screenshot.diff when a baseline exists, then inspect pixel regions, OCR textAnalysis, and PNG/diff artifacts with vision before finishing.\n\n## Workflow Summary Without Diff\n\nFor visual/design work, make sure generated project files are current and generated app dependencies are installed, call preview.start, then screenshot({ path, viewport }); for responsive work, use list-breakpoints and capture the changed page at Builder breakpoint widths plus mobile and desktop widths; inspect every PNG with vision before finishing.\n\n## Screenshot Verification Summary\n\nInside MCP, prefer preview.start plus screenshot({ path: "/", viewport }) after generated project files are current and generated app dependencies are installed, so the preview server stays running for fast repeated checks. For responsive work, read list-breakpoints and capture viewport widths from Builder breakpoint edges plus mobile and desktop widths before using vision. Screenshot waits for load by default, then fonts and two layout frames; pass waitForSelector for app readiness, waitUntil:"networkidle" for network-heavy pages, and waitForTimeout for final settling. When a baseline exists, use screenshot.diff for changed regions, OCR textAnalysis, and diff artifacts. Outside MCP, use webstudio preview and webstudio screenshot <url> --output current.png.\n\n## Screenshot Diff Evidence\n\n- Pixel evidence: total mismatch, changed regions, dominant color/luminance direction, diffPath, and contextDiffPath.\n- OCR evidence: textAnalysis.status, provider, and changes for appeared/disappeared/content_changed/moved/font_changed text.\n- OCR dependency: screenshot.diff uses the system tesseract binary when available. If missing, it returns ocr_unavailable_tesseract_not_found_or_failed and still returns pixel evidence.\n- OCR install: MCP cannot prompt. Ask the user first; if they agree, call vision.install-ocr with { "confirm": true }. If automatic install is unavailable, follow the returned installUrl.\n- Final judgment: OCR and pixel diff are evidence. A vision-capable model must still inspect screenshots/diff artifacts and compare the rendered result to user intent.\n'
+};
+const cliDocTitles = {
+  "api-use-cases": "CLI API Use Cases",
+  "manual-api": "Webstudio API CLI Manual",
+  "manual-llm": "Webstudio CLI Manual for LLMs",
+  "manual-mcp": "Webstudio MCP Manual",
+  "mcp-startup-epilogue": "mcp-startup-epilogue",
+  "mcp-vision": "MCP Vision Verification"
+};
+const cliDocSections = {
+  "api-use-cases": {},
+  "manual-api": {
+    safetyRules: [
+      "Pass --json to API/discovery commands that support it. Do not add --json to top-level commands unless their help/schema documents it.",
+      "Never pass a project id. Commands use configured project only.",
+      "Read ids before writing. Do not invent ids for existing records.",
+      "stdout is one JSON object. stderr is diagnostics.",
+      "Prefer MCP semantic tools for detailed project edits. Use MCP apply-patch only when no semantic tool exists.",
+      "For MCP apply-patch, read the latest version with MCP snapshot before writing.",
+      "Reuse ids from MCP snapshot output when updating existing records.",
+      "Generate new unique ids when adding records.",
+      "If apply-patch reports a version conflict, read the latest build and regenerate the patch.",
+      "Prefer semantic MCP read tools for discovery, then use MCP snapshot for exact patch paths."
+    ]
+  },
+  "manual-llm": {
+    implementationProcess: [
+      "Discover capabilities with webstudio man llm --json, webstudio schema api --json, and MCP meta.index or webstudio://project/tools.",
+      "Inspect current project state with semantic reads such as list-pages, get-page-by-path, list-instances, inspect-instance, get-styles, list-assets, list-breakpoints, and snapshot only when needed.",
+      "Mutate the Webstudio project with semantic MCP write tools first. Prefer append-instance, update-text, update-props, update-styles, upload-asset, create-page, and page/project settings tools over raw patches.",
+      "Use apply-patch only when no semantic tool covers the required change, and only after reading the latest snapshot/version.",
+      "For visual/design work, regenerate or preview the generated app, capture a screenshot, inspect it with vision, and iterate before final response.",
+      "Report what changed and what verification ran."
+    ],
+    visualDesignWorkflow: [
+      "Read editable Webstudio structure first: pages, instances, props, styles, breakpoints, assets, and relevant text.",
+      "Do not use generated route/component files as the source of truth for editable content.",
+      "Make edits through Webstudio semantic commands/MCP tools so the result stays editable in Builder and survives the next webstudio build.",
+      "Keep generated project files current, start preview, and capture the changed page with screenshot.",
+      "Use screenshot.diff when a baseline exists and inspect screenshot/diff artifacts with vision before finishing.",
+      "If vision or screenshot tooling is unavailable, state that explicitly and explain what fallback verification was used."
+    ],
+    responsiveVerification: [
+      "Read breakpoints with list-breakpoints before deciding responsive behavior.",
+      "Apply responsive styles with existing Builder breakpoint ids; do not invent CSS media queries or breakpoint names when Webstudio breakpoint data exists.",
+      "Pick screenshot viewport widths from the project breakpoints: include a desktop width, each defined max-width or min-width edge, and a narrow mobile width.",
+      'Capture each viewport with screenshot, for example {"path":"/","output":"home-375.png","viewport":{"width":375,"height":812}} and {"path":"/","output":"home-1440.png","viewport":{"width":1440,"height":900}}.',
+      "Inspect every viewport screenshot with vision before finishing, checking layout, overflow, hidden content, text wrapping, and breakpoint-specific style changes.",
+      "If any viewport fails, update styles through semantic Webstudio tools and repeat screenshots for the affected breakpoints."
+    ],
+    generatedFileGuardrails: [
+      "Do not edit app/__generated__, generated route files, generated page files, generated CSS, or build output for normal Webstudio content/design requests.",
+      "Do not replace generated page components with handcrafted app code unless the user explicitly asks for code-only export customization.",
+      "Generated files are build artifacts and may be overwritten by webstudio build.",
+      "If a task truly requires generated app customization, keep it outside app/__generated__ where possible and explain that it is not editable Webstudio content."
+    ],
+    valuesVsBindings: [
+      "Use direct value tools for fixed content. For visible text, use update-text with plain text. For static props such as aria-label, alt, id, class, href, or button labels stored as props, use update-props with the prop's direct type/value.",
+      "Use bind-props only when the prop must stay dynamic: an expression, parameter, resource result, or action. Do not use bind-props just to set a fixed string.",
+      'Direct prop string example: {"updates":[{"instanceId":"button-id","name":"aria-label","type":"string","value":"Open menu"}]}.',
+      'Expression binding example: {"bindings":[{"instanceId":"link-id","name":"href","binding":{"type":"expression","value":"currentPost.url"}}]}.',
+      'Page metadata fields such as title, description, language, redirect, status, and custom meta content are expression-backed strings. For fixed text, pass a JavaScript string literal expression with JSON quoting, for example JSON.stringify("Pricing | Acme") in code or "\\"Pricing | Acme\\"" in JSON. Never pass raw multi-word text such as "Pricing | Acme" as an expression.',
+      'Page metadata update example: use update-page with {"pageId":"page-id","values":{"title":"\\"Pricing | Acme\\"","meta":{"description":"\\"Plans for teams\\""}}}.',
+      'Resource URL, header, search-param, and body fields are also expression-backed. For a fixed URL, use a string literal expression such as "\\"https://api.example.com/items\\"".',
+      'Resource update example: use update-resource with {"resourceId":"resource-id","values":{"url":"\\"https://api.example.com/items\\""}}.'
+    ],
+    rules: [
+      "Never guess ids for existing records. Read them first.",
+      "Never use project ids from user input. Commands use the configured project.",
+      "Use --refresh before a local-capable command when cached data may be stale.",
+      "Pass --json only to commands whose help/schema documents it. Do not add --json to top-level commands such as sync unless supported.",
+      "On VERSION_CONFLICT, read MCP snapshot again, regenerate the patch, then retry.",
+      "Treat stdout JSON as the API contract and stderr as diagnostics.",
+      "For visual/design work, verify the rendered result with vision before finishing.",
+      "Do not edit generated files for normal Webstudio content/design requests.",
+      "Use direct values for static strings and bindings only for dynamic expressions/resources/actions.",
+      "For expression-backed fields that need fixed text, encode the fixed text as a quoted JavaScript string literal expression.",
+      "Confirm destructive commands with --confirm only when user requested deletion/unpublish/replacement.",
+      "Use webstudio schema api --json for machine-readable command metadata."
+    ]
+  },
+  "manual-mcp": {
+    rules: [
+      "stdout is reserved for MCP JSON-RPC while the server is running.",
+      "Operate on the configured project only.",
+      "Read ids before writing.",
+      "Prefer semantic tools over apply-patch.",
+      "Use status and refresh when cached namespaces may be stale.",
+      "A mutation is durable only when meta.session.committed is true.",
+      "For visual/design work, verify the rendered result with vision before finishing."
+    ]
+  },
+  "mcp-startup-epilogue": {},
+  "mcp-vision": {}
 };
 const readCliDoc = (name2) => cliDocs[name2];
+const readCliDocTitle = (name2) => cliDocTitles[name2];
+const readCliDocSections = (name2) => cliDocSections[name2];
 const mcpVisionMarkdown = readCliDoc("mcp-vision");
 const getSection = (markdown, heading) => {
   const lines = markdown.split(/\r?\n/);
@@ -12242,6 +12467,14 @@ const createRuntimeMutation = ({
   invalidatesNamespaces,
   noop: payload.length === 0
 });
+const assetReplaceInput = z.object({
+  fromAssetId: z.string(),
+  toAssetId: z.string()
+});
+const assetDeleteInput = z.object({
+  assetIdsOrPrefixes: z.array(z.string()).min(1),
+  force: z.boolean().optional()
+});
 const traverseAssetStyleValue = (value2, callback) => {
   callback(value2);
   if (value2.type === "tuple" || value2.type === "layers") {
@@ -12749,6 +12982,15 @@ const deleteAssets = (state, input2) => {
     invalidatesNamespaces: ["assets"]
   });
 };
+const getExpressionErrors = (expression) => lintExpression({ expression }).filter((diagnostic) => diagnostic.severity === "error").map((diagnostic) => diagnostic.message);
+const getNamedExpressionErrors = (name2, expression) => {
+  if (expression === void 0) {
+    return [];
+  }
+  return getExpressionErrors(expression).map(
+    (message) => `${name2}: ${message}`
+  );
+};
 const getRequiredDataSources = (state) => {
   if (state.dataSources === void 0) {
     return throwBuilderRuntimeError(
@@ -12830,6 +13072,24 @@ const listDataVariables = (state, input2 = {}) => serializeDataVariables({
   dataSources: getRequiredDataSources(state),
   scopeInstanceId: input2.scopeInstanceId
 });
+const dataVariableValueInput = dataSourceVariableValue;
+const dataVariableCreateInput = z.object({
+  dataSourceId: z.string().optional(),
+  scopeInstanceId: z.string(),
+  name: z.string().min(1),
+  value: dataVariableValueInput
+});
+const dataVariableUpdateInput = z.object({
+  dataSourceId: z.string(),
+  values: z.object({
+    scopeInstanceId: z.string().optional(),
+    name: z.string().min(1).optional(),
+    value: dataVariableValueInput.optional()
+  })
+});
+const dataVariableDeleteInput = z.object({
+  dataSourceId: z.string()
+});
 const validateDataVariableNameWithSources = ({
   dataSources,
   name: name2,
@@ -13430,8 +13690,40 @@ const findResource = (resources, resourceId2) => {
     }
   }
 };
-const resourceFieldsInput = resource.omit({ id: true }).extend({ control: z.enum(["system", "graphql"]).optional() });
-resourceFieldsInput.partial();
+const addExpressionIssues$2 = (context, errors) => {
+  for (const message of errors) {
+    context.addIssue({
+      code: z.ZodIssueCode.custom,
+      message
+    });
+  }
+};
+const resourceFieldsInputBase = resource.omit({ id: true }).extend({ control: z.enum(["system", "graphql"]).optional() });
+const resourceFieldsInput = resourceFieldsInputBase.superRefine(
+  (fields, context) => {
+    addExpressionIssues$2(context, getResourceExpressionErrors(fields));
+  }
+);
+const resourceFieldsUpdateInput = resourceFieldsInputBase.partial().superRefine((fields, context) => {
+  addExpressionIssues$2(context, getResourceExpressionErrors(fields));
+});
+const resourceCreateInput = z.object({
+  resourceId: z.string().optional(),
+  resource: resourceFieldsInput,
+  dataSourceId: z.string().optional(),
+  scopeInstanceId: z.string().optional(),
+  dataSourceName: z.string().optional()
+});
+const resourceUpdateInput = z.object({
+  resourceId: z.string(),
+  values: resourceFieldsUpdateInput,
+  dataSourceName: z.string().optional(),
+  scopeInstanceId: z.string().optional()
+});
+const resourceDeleteInput = z.object({
+  resourceId: z.string(),
+  force: z.boolean().optional()
+});
 const createResourceValue = ({
   id,
   control,
@@ -13454,14 +13746,7 @@ const createResourceValue = ({
 const getResourceExpressionErrors = (fields) => {
   const errors = [];
   const validate = (name2, expression) => {
-    if (expression === void 0) {
-      return;
-    }
-    for (const diagnostic of lintExpression({ expression })) {
-      if (diagnostic.severity === "error") {
-        errors.push(`${name2}: ${diagnostic.message}`);
-      }
-    }
+    errors.push(...getNamedExpressionErrors(name2, expression));
   };
   validate("url", fields.url);
   validate("body", fields.body);
@@ -14342,7 +14627,7 @@ const createPageValue = ({
   pageId: pageId2,
   name: name2,
   path: path2,
-  title = name2,
+  title = JSON.stringify(name2),
   rootInstanceId,
   meta = {}
 }) => ({
@@ -14359,13 +14644,29 @@ const emptyStringRemovesMetaFields = /* @__PURE__ */ new Set([
   "socialImageAssetId",
   "socialImageUrl"
 ]);
+const pageMetaExpressionFields = [
+  "description",
+  "language",
+  "redirect",
+  "socialImageUrl",
+  "status",
+  "content"
+];
 const normalizePageMetaValue = (name2, value2) => {
   if (value2 === "" && emptyStringRemovesMetaFields.has(name2)) {
     return void 0;
   }
   return value2;
 };
-const pageMetaInput = z.object({
+const addExpressionIssues$1 = (context, errors) => {
+  for (const message of errors) {
+    context.addIssue({
+      code: z.ZodIssueCode.custom,
+      message
+    });
+  }
+};
+const pageMetaInputBase = z.object({
   description: z.string().optional(),
   language: z.string().optional(),
   redirect: z.string().optional(),
@@ -14378,13 +14679,72 @@ const pageMetaInput = z.object({
   auth: pageAuth.optional(),
   custom: z.array(z.object({ property: z.string(), content: z.string() })).optional()
 });
-z.object({
+const getPageExpressionErrors = (input2) => {
+  const errors = [];
+  errors.push(...getNamedExpressionErrors("title", input2.title));
+  if (input2.meta !== void 0) {
+    for (const name2 of pageMetaExpressionFields) {
+      const expression = input2.meta[name2];
+      if (expression === "" && emptyStringRemovesMetaFields.has(name2)) {
+        continue;
+      }
+      errors.push(...getNamedExpressionErrors(`meta.${name2}`, expression));
+    }
+    for (const [index, customMeta] of (input2.meta.custom ?? []).entries()) {
+      errors.push(
+        ...getNamedExpressionErrors(
+          `meta.custom.${index}.content`,
+          customMeta.content
+        )
+      );
+    }
+  }
+  return errors;
+};
+const pageMetaInput = pageMetaInputBase.superRefine((meta, context) => {
+  addExpressionIssues$1(context, getPageExpressionErrors({ meta }));
+});
+const pageFieldsInput = z.object({
   name: z.string().min(1).optional(),
   path: z.string().optional(),
   title: z.string().optional(),
   parentFolderId: z.string().optional(),
+  meta: pageMetaInputBase.optional()
+}).superRefine((fields, context) => {
+  addExpressionIssues$1(context, getPageExpressionErrors(fields));
+});
+const pageCreateInput = z.object({
+  pageId: z.string().optional(),
+  name: z.string().min(1),
+  path: z.string(),
+  title: z.string().optional(),
+  parentFolderId: z.string().optional(),
   meta: pageMetaInput.optional()
 });
+const pageUpdateInput = z.object({
+  pageId: z.string(),
+  values: pageFieldsInput
+});
+const pageDeleteInput = z.object({
+  pageId: z.string()
+});
+const folderCreateInput = z.object({
+  folderId: z.string().optional(),
+  name: z.string().min(1),
+  slug: z.string(),
+  parentFolderId: z.string().optional()
+});
+const folderUpdateInput = z.object({
+  folderId: z.string(),
+  values: z.object({
+    name: z.string().min(1).optional(),
+    slug: z.string().optional(),
+    parentFolderId: z.string().optional()
+  })
+});
+const folderDeleteInput = z.object({
+  folderId: z.string()
+});
 const pageMetaToPatchValue = (meta) => {
   const result = {};
   for (const [name2, value2] of Object.entries(meta)) {
@@ -14489,6 +14849,10 @@ const createPage = (state, input2, context) => {
   const pages2 = getRequiredPages(state);
   const parentFolderId = input2.parentFolderId ?? pages2.rootFolderId;
   const parentFolder = getFolderOrThrow(pages2, parentFolderId);
+  const expressionErrors = getPageExpressionErrors(input2);
+  if (expressionErrors.length > 0) {
+    return throwBuilderRuntimeError("BAD_REQUEST", expressionErrors.join("\n"));
+  }
   const pageId2 = input2.pageId ?? context.createId();
   if (pages2.pages.has(pageId2)) {
     return throwBuilderRuntimeError("CONFLICT", "Page id already exists");
@@ -14531,6 +14895,10 @@ const updatePage = (state, input2) => {
   if (page2 === void 0) {
     return throwBuilderRuntimeError("NOT_FOUND", "Page not found");
   }
+  const expressionErrors = getPageExpressionErrors(input2.values);
+  if (expressionErrors.length > 0) {
+    return throwBuilderRuntimeError("BAD_REQUEST", expressionErrors.join("\n"));
+  }
   if ((input2.values.path !== void 0 || input2.values.parentFolderId !== void 0) && isPathAvailable({
     pages: pages2,
     path: input2.values.path ?? page2.path,
@@ -14816,7 +15184,25 @@ const createPropBindingFromInput = ({
   type: binding.type,
   value: binding.value
 });
-z.object({
+const getPropValueErrors = ({
+  type: type2,
+  value: value2
+}) => {
+  if (type2 !== "expression") {
+    return [];
+  }
+  return getExpressionErrors(String(value2));
+};
+const addExpressionIssues = (context, errors, path2 = []) => {
+  for (const message of errors) {
+    context.addIssue({
+      code: z.ZodIssueCode.custom,
+      message,
+      path: path2
+    });
+  }
+};
+const propValueInput = z.object({
   propId: z.string().optional(),
   instanceId: z.string(),
   name: z.string(),
@@ -14836,8 +15222,10 @@ z.object({
   ]),
   value: z.unknown(),
   required: z.boolean().optional()
+}).superRefine((value2, context) => {
+  addExpressionIssues(context, getPropValueErrors(value2), ["value"]);
 });
-z.object({
+const propBindingInput = z.object({
   propId: z.string().optional(),
   instanceId: z.string(),
   name: z.string(),
@@ -14856,16 +15244,25 @@ z.object({
       )
     })
   ])
+}).superRefine((value2, context) => {
+  addExpressionIssues(
+    context,
+    getPropValueErrors({
+      type: value2.binding.type,
+      value: value2.binding.value
+    }),
+    ["binding", "value"]
+  );
+});
+const propUpdatesInput = z.object({
+  updates: z.array(propValueInput).min(1)
+});
+const propBindingsInput = z.object({
+  bindings: z.array(propBindingInput).min(1)
+});
+const propDeletionsInput = z.object({
+  deletions: z.array(z.object({ instanceId: z.string(), name: z.string() })).min(1)
 });
-const getPropValueErrors = ({
-  type: type2,
-  value: value2
-}) => {
-  if (type2 !== "expression") {
-    return [];
-  }
-  return lintExpression({ expression: String(value2) }).filter((diagnostic) => diagnostic.severity === "error").map((diagnostic) => diagnostic.message);
-};
 const createMissingId = () => {
   throw new Error("createId is required when propId is not provided.");
 };
@@ -15318,6 +15715,44 @@ const createStyleClonePayload = ({
     (change) => change.patches.length === 0 ? [] : [change]
   );
 };
+const insertIndexInput = z.number().int().nonnegative();
+const appendInstancesInput = z.object({
+  parentInstanceId: z.string(),
+  mode: z.enum(["append", "prepend", "replace"]).optional(),
+  insertIndex: insertIndexInput.optional(),
+  children: z.array(
+    z.object({
+      instanceId: z.string().optional(),
+      component: z.string().optional(),
+      tag: z.string(),
+      label: z.string().optional(),
+      text: z.string().optional()
+    })
+  ).min(1)
+});
+const moveInstancesInput = z.object({
+  moves: z.array(
+    z.object({
+      instanceId: z.string(),
+      parentInstanceId: z.string(),
+      insertIndex: insertIndexInput.optional()
+    })
+  ).min(1)
+});
+const cloneInstanceInput = z.object({
+  sourceInstanceId: z.string(),
+  targetParentInstanceId: z.string().optional(),
+  insertIndex: insertIndexInput.optional()
+});
+const deleteInstancesInput = z.object({
+  instanceIds: z.array(z.string()).min(1)
+});
+const updateTextInstanceInput = z.object({
+  instanceId: z.string(),
+  childIndex: z.number().int().nonnegative(),
+  text: z.string(),
+  mode: z.enum(["text", "expression"]).optional()
+});
 const getRequiredInstances = (state) => {
   if (state.instances === void 0) {
     return throwBuilderRuntimeError(
@@ -16066,7 +16501,7 @@ const getTextContentErrors = ({
   if (type2 === "text") {
     return [];
   }
-  return lintExpression({ expression: value2 }).filter((diagnostic) => diagnostic.severity === "error").map((diagnostic) => diagnostic.message);
+  return getExpressionErrors(value2);
 };
 const createTextContentUpdatePayload = ({
   instanceId: instanceId2,
@@ -17248,6 +17683,20 @@ const insertWebstudioFragmentCopy = ({
   }
   return newDataIds;
 };
+const pageDuplicateInput = z.object({
+  projectId: z.string(),
+  pageId: z.string(),
+  parentFolderId: z.string().optional(),
+  name: z.string().min(1).optional(),
+  path: z.string().optional()
+});
+const pageTemplateCreatePageInput = z.object({
+  projectId: z.string(),
+  templateId: z.string(),
+  parentFolderId: z.string().optional(),
+  name: z.string().min(1),
+  path: z.string()
+});
 const contentModePageMetaFields = /* @__PURE__ */ new Set([
   "description",
   "title",
@@ -17745,7 +18194,7 @@ const getRequiredBreakpoints = (state) => {
   }
   return state.breakpoints;
 };
-z.object({
+const projectSettingsUpdateInput = z.object({
   meta: z.record(z.unknown()).optional(),
   compiler: z.record(z.unknown()).optional()
 });
@@ -17851,16 +18300,24 @@ const listRedirects = (state) => ({
   redirects: getRequiredPages(state).redirects ?? []
 });
 const redirectStatusInput = z.enum(["301", "302"]);
-z.object({
+const redirectFieldsInput = z.object({
   old: z.string(),
   new: z.string(),
   status: redirectStatusInput.optional()
 });
-z.object({
+const redirectUpdateFieldsInput = z.object({
   old: z.string().optional(),
   new: z.string().optional(),
   status: redirectStatusInput.nullable().optional()
 });
+const redirectCreateInput = redirectFieldsInput;
+const redirectUpdateInput = z.object({
+  old: z.string(),
+  values: redirectUpdateFieldsInput
+});
+const redirectDeleteInput = z.object({
+  old: z.string()
+});
 const findRedirectIndex = (redirects, oldPath) => redirects.findIndex((redirect) => redirect.old === oldPath);
 const parseRedirect = (input2) => {
   const result = pageRedirect.safeParse(input2);
@@ -17952,19 +18409,27 @@ const deleteRedirect = (state, input2) => {
 const listBreakpoints = (state) => ({
   breakpoints: Array.from(getRequiredBreakpoints(state).values())
 });
-z.object({
+const breakpointFieldsInput = z.object({
   id: z.string(),
   label: z.string(),
   minWidth: z.number().optional(),
   maxWidth: z.number().optional(),
   condition: z.string().optional()
 });
-z.object({
+const breakpointUpdateFieldsInput = z.object({
   label: z.string().optional(),
   minWidth: z.number().nullable().optional(),
   maxWidth: z.number().nullable().optional(),
   condition: z.string().nullable().optional()
 });
+const breakpointCreateInput = breakpointFieldsInput;
+const breakpointUpdateInput = z.object({
+  breakpointId: z.string(),
+  values: breakpointUpdateFieldsInput
+});
+const breakpointDeleteInput = z.object({
+  breakpointId: z.string()
+});
 const parseBreakpoint = (input2) => {
   const result = breakpoint.safeParse(input2);
   if (result.success === false) {
@@ -28869,7 +29334,7 @@ const withDefaultBreakpoint = (input2, breakpoint2) => ({
   ...input2,
   breakpoint: input2.breakpoint ?? breakpoint2
 });
-z.object({
+const styleUpdateInput = z.object({
   instanceId: z.string(),
   property: z.string(),
   value: z.unknown(),
@@ -28878,13 +29343,30 @@ z.object({
   listed: z.boolean().optional(),
   createLocalIfMissing: z.boolean().optional()
 });
-z.object({
+const styleDeleteInput = z.object({
   instanceId: z.string(),
   property: z.string(),
   breakpoint: z.string().optional(),
   state: z.string().optional()
 });
-z.object({
+const jsonArrayStringInput = (value2) => {
+  if (typeof value2 !== "string") {
+    return value2;
+  }
+  try {
+    return JSON.parse(value2);
+  } catch {
+    return value2;
+  }
+};
+const jsonArrayInput = (item) => z.preprocess(jsonArrayStringInput, z.array(item).min(1));
+const styleUpdateDeclarationsInput = z.object({
+  updates: jsonArrayInput(styleUpdateInput)
+});
+const styleDeleteDeclarationsInput = z.object({
+  deletions: jsonArrayInput(styleDeleteInput)
+});
+const styleReplaceInput = z.object({
   property: z.string(),
   fromValue: z.unknown(),
   toValue: z.unknown(),
@@ -28943,7 +29425,19 @@ const getDefinedCssVariableNames = (styles) => {
   }
   return names;
 };
-z.union([z.string(), styleValue]);
+const cssVariableValueInput = z.union([z.string(), styleValue]);
+const cssVariableDefineInput = z.object({
+  vars: z.record(cssVariableValueInput),
+  overwrite: z.boolean().optional()
+});
+const cssVariableDeleteInput = z.object({
+  names: z.array(z.string()).min(1),
+  force: z.boolean().optional()
+});
+const cssVariableRewriteRefsInput = z.object({
+  map: z.record(z.string()),
+  scopeRegex: z.string().optional()
+});
 const validateCssVariableNameWithStyles = ({
   name: name2,
   styles,
@@ -29227,12 +29721,37 @@ const designTokenStyleInput = z.object({
   breakpoint: z.string().optional(),
   state: z.string().optional()
 });
-z.object({
+const designTokenCreateInput = z.object({
   tokenId: z.string().optional(),
   name: z.string().min(1),
   styles: z.record(z.unknown()).optional(),
   declarations: z.array(designTokenStyleInput).optional()
 });
+const designTokenCreateManyInput = z.object({
+  tokens: jsonArrayInput(designTokenCreateInput)
+});
+const designTokenStyleUpdatesInput = z.object({
+  designTokenId: z.string(),
+  updates: jsonArrayInput(designTokenStyleInput)
+});
+const designTokenStyleDeletionsInput = z.object({
+  designTokenId: z.string(),
+  deletions: jsonArrayInput(styleDeleteInput.omit({ instanceId: true }))
+});
+const designTokenAttachInput = z.object({
+  designTokenId: z.string(),
+  instanceIds: z.array(z.string()).min(1),
+  position: z.enum(["before-local", "after-local"]).optional()
+});
+const designTokenDetachInput = z.object({
+  designTokenId: z.string(),
+  instanceIds: z.array(z.string()).min(1)
+});
+const designTokenExtractInput = z.object({
+  instanceIds: z.array(z.string()).min(1),
+  name: z.string().min(1),
+  removeLocalProps: z.array(z.string()).optional()
+});
 const createTokenStyleSource = ({
   id,
   name: name2,
@@ -30287,15 +30806,11 @@ const builderRuntimeOperations = [
   ),
   runtimeOperation(
     "pages.create",
-    ({ state, input: input2, context }) => createPage(
-      state,
-      input2,
-      context
-    )
+    ({ state, input: input2, context }) => createPage(state, pageCreateInput.parse(input2), context)
   ),
   runtimeOperation(
     "pages.update",
-    ({ state, input: input2 }) => updatePage(state, input2)
+    ({ state, input: input2 }) => updatePage(state, pageUpdateInput.parse(input2))
   ),
   runtimeOperation(
     "projectSettings.get",
@@ -30305,7 +30820,7 @@ const builderRuntimeOperations = [
     "projectSettings.update",
     ({ state, input: input2 }) => updateProjectSettings(
       state,
-      input2
+      projectSettingsUpdateInput.parse(input2)
     )
   ),
   runtimeOperation(
@@ -30316,21 +30831,21 @@ const builderRuntimeOperations = [
     "redirects.create",
     ({ state, input: input2 }) => createRedirect(
       state,
-      input2
+      redirectCreateInput.parse(input2)
     )
   ),
   runtimeOperation(
     "redirects.update",
     ({ state, input: input2 }) => updateRedirect(
       state,
-      input2
+      redirectUpdateInput.parse(input2)
     )
   ),
   runtimeOperation(
     "redirects.delete",
     ({ state, input: input2 }) => deleteRedirect(
       state,
-      input2
+      redirectDeleteInput.parse(input2)
     )
   ),
   runtimeOperation(
@@ -30341,32 +30856,32 @@ const builderRuntimeOperations = [
     "breakpoints.create",
     ({ state, input: input2 }) => createBreakpoint(
       state,
-      input2
+      breakpointCreateInput.parse(input2)
     )
   ),
   runtimeOperation(
     "breakpoints.update",
     ({ state, input: input2 }) => updateBreakpoint(
       state,
-      input2
+      breakpointUpdateInput.parse(input2)
     )
   ),
   runtimeOperation(
     "breakpoints.delete",
     ({ state, input: input2 }) => deleteBreakpoint(
       state,
-      input2
+      breakpointDeleteInput.parse(input2)
     )
   ),
   runtimeOperation(
     "pages.delete",
-    ({ state, input: input2 }) => deletePage(state, input2)
+    ({ state, input: input2 }) => deletePage(state, pageDeleteInput.parse(input2))
   ),
   runtimeOperation(
     "pages.duplicate",
     ({ state, input: input2, context }) => duplicatePage(
       state,
-      input2,
+      pageDuplicateInput.parse(input2),
       context
     )
   ),
@@ -30378,7 +30893,7 @@ const builderRuntimeOperations = [
     "pageTemplates.createPage",
     ({ state, input: input2, context }) => createPageFromTemplate(
       state,
-      input2,
+      pageTemplateCreatePageInput.parse(input2),
       context
     )
   ),
@@ -30388,19 +30903,15 @@ const builderRuntimeOperations = [
   ),
   runtimeOperation(
     "folders.create",
-    ({ state, input: input2, context }) => createFolder(
-      state,
-      input2,
-      context
-    )
+    ({ state, input: input2, context }) => createFolder(state, folderCreateInput.parse(input2), context)
   ),
   runtimeOperation(
     "folders.update",
-    ({ state, input: input2 }) => updateFolder(state, input2)
+    ({ state, input: input2 }) => updateFolder(state, folderUpdateInput.parse(input2))
   ),
   runtimeOperation(
     "folders.delete",
-    ({ state, input: input2 }) => deleteFolder(state, input2)
+    ({ state, input: input2 }) => deleteFolder(state, folderDeleteInput.parse(input2))
   ),
   runtimeOperation(
     "instances.list",
@@ -30420,22 +30931,19 @@ const builderRuntimeOperations = [
     "instances.append",
     ({ state, input: input2, context }) => appendInstances(
       state,
-      input2,
+      appendInstancesInput.parse(input2),
       context
     )
   ),
   runtimeOperation(
     "instances.move",
-    ({ state, input: input2 }) => moveInstances(
-      state,
-      input2
-    )
+    ({ state, input: input2 }) => moveInstances(state, moveInstancesInput.parse(input2))
   ),
   runtimeOperation(
     "instances.clone",
     ({ state, input: input2, context }) => cloneInstance(
       state,
-      input2,
+      cloneInstanceInput.parse(input2),
       context
     )
   ),
@@ -30443,28 +30951,20 @@ const builderRuntimeOperations = [
     "instances.delete",
     ({ state, input: input2 }) => deleteInstances(
       state,
-      input2
+      deleteInstancesInput.parse(input2)
     )
   ),
   runtimeOperation(
     "instances.updateProps",
-    ({ state, input: input2, context }) => updateProps(
-      state,
-      input2,
-      context
-    )
+    ({ state, input: input2, context }) => updateProps(state, propUpdatesInput.parse(input2), context)
   ),
   runtimeOperation(
     "instances.deleteProps",
-    ({ state, input: input2 }) => deleteProps(state, input2)
+    ({ state, input: input2 }) => deleteProps(state, propDeletionsInput.parse(input2))
   ),
   runtimeOperation(
     "instances.bindProps",
-    ({ state, input: input2, context }) => bindProps(
-      state,
-      input2,
-      context
-    )
+    ({ state, input: input2, context }) => bindProps(state, propBindingsInput.parse(input2), context)
   ),
   runtimeOperation(
     "instances.listTexts",
@@ -30477,7 +30977,7 @@ const builderRuntimeOperations = [
     "instances.updateText",
     ({ state, input: input2 }) => updateTextInstance(
       state,
-      input2
+      updateTextInstanceInput.parse(input2)
     )
   ),
   runtimeOperation(
@@ -30491,7 +30991,7 @@ const builderRuntimeOperations = [
     "styles.updateDeclarations",
     ({ state, input: input2, context }) => updateStyleDeclarations(
       state,
-      input2,
+      styleUpdateDeclarationsInput.parse(input2),
       context
     )
   ),
@@ -30499,15 +30999,12 @@ const builderRuntimeOperations = [
     "styles.deleteDeclarations",
     ({ state, input: input2 }) => deleteStyleDeclarations(
       state,
-      input2
+      styleDeleteDeclarationsInput.parse(input2)
     )
   ),
   runtimeOperation(
     "styles.replaceValues",
-    ({ state, input: input2 }) => replaceStyleValues(
-      state,
-      input2
-    )
+    ({ state, input: input2 }) => replaceStyleValues(state, styleReplaceInput.parse(input2))
   ),
   runtimeOperation(
     "designTokens.list",
@@ -30520,7 +31017,7 @@ const builderRuntimeOperations = [
     "designTokens.create",
     ({ state, input: input2, context }) => createDesignTokens(
       state,
-      input2,
+      designTokenCreateManyInput.parse(input2),
       context
     )
   ),
@@ -30528,35 +31025,29 @@ const builderRuntimeOperations = [
     "designTokens.updateStyles",
     ({ state, input: input2 }) => updateDesignTokenStyles(
       state,
-      input2
+      designTokenStyleUpdatesInput.parse(input2)
     )
   ),
   runtimeOperation(
     "designTokens.deleteStyles",
     ({ state, input: input2 }) => deleteDesignTokenStyles(
       state,
-      input2
+      designTokenStyleDeletionsInput.parse(input2)
     )
   ),
   runtimeOperation(
     "designTokens.attach",
-    ({ state, input: input2 }) => attachDesignToken(
-      state,
-      input2
-    )
+    ({ state, input: input2 }) => attachDesignToken(state, designTokenAttachInput.parse(input2))
   ),
   runtimeOperation(
     "designTokens.detach",
-    ({ state, input: input2 }) => detachDesignToken(
-      state,
-      input2
-    )
+    ({ state, input: input2 }) => detachDesignToken(state, designTokenDetachInput.parse(input2))
   ),
   runtimeOperation(
     "designTokens.extract",
     ({ state, input: input2, context }) => extractDesignToken(
       state,
-      input2,
+      designTokenExtractInput.parse(input2),
       context
     )
   ),
@@ -30571,22 +31062,19 @@ const builderRuntimeOperations = [
     "cssVariables.define",
     ({ state, input: input2, context }) => defineCssVariables(
       state,
-      input2,
+      cssVariableDefineInput.parse(input2),
       context
     )
   ),
   runtimeOperation(
     "cssVariables.delete",
-    ({ state, input: input2 }) => deleteCssVariables(
-      state,
-      input2
-    )
+    ({ state, input: input2 }) => deleteCssVariables(state, cssVariableDeleteInput.parse(input2))
   ),
   runtimeOperation(
     "cssVariables.rewriteRefs",
     ({ state, input: input2 }) => rewriteCssVariableRefs(
       state,
-      input2
+      cssVariableRewriteRefsInput.parse(input2)
     )
   ),
   runtimeOperation(
@@ -30600,23 +31088,17 @@ const builderRuntimeOperations = [
     "variables.create",
     ({ state, input: input2, context }) => createDataVariable(
       state,
-      input2,
+      dataVariableCreateInput.parse(input2),
       context
     )
   ),
   runtimeOperation(
     "variables.update",
-    ({ state, input: input2 }) => updateDataVariable(
-      state,
-      input2
-    )
+    ({ state, input: input2 }) => updateDataVariable(state, dataVariableUpdateInput.parse(input2))
   ),
   runtimeOperation(
     "variables.delete",
-    ({ state, input: input2 }) => deleteDataVariable(
-      state,
-      input2
-    )
+    ({ state, input: input2 }) => deleteDataVariable(state, dataVariableDeleteInput.parse(input2))
   ),
   runtimeOperation(
     "resources.list",
@@ -30624,25 +31106,15 @@ const builderRuntimeOperations = [
   ),
   runtimeOperation(
     "resources.create",
-    ({ state, input: input2, context }) => createResource(
-      state,
-      input2,
-      context
-    )
+    ({ state, input: input2, context }) => createResource(state, resourceCreateInput.parse(input2), context)
   ),
   runtimeOperation(
     "resources.update",
-    ({ state, input: input2 }) => updateResource(
-      state,
-      input2
-    )
+    ({ state, input: input2 }) => updateResource(state, resourceUpdateInput.parse(input2))
   ),
   runtimeOperation(
     "resources.delete",
-    ({ state, input: input2 }) => deleteResource(
-      state,
-      input2
-    )
+    ({ state, input: input2 }) => deleteResource(state, resourceDeleteInput.parse(input2))
   ),
   runtimeOperation(
     "assets.list",
@@ -30657,17 +31129,11 @@ const builderRuntimeOperations = [
   ),
   runtimeOperation(
     "assets.replace",
-    ({ state, input: input2 }) => replaceAsset(
-      state,
-      input2
-    )
+    ({ state, input: input2 }) => replaceAsset(state, assetReplaceInput.parse(input2))
   ),
   runtimeOperation(
     "assets.delete",
-    ({ state, input: input2 }) => deleteAssets(
-      state,
-      input2
-    )
+    ({ state, input: input2 }) => deleteAssets(state, assetDeleteInput.parse(input2))
   )
 ];
 const builderRuntimeOperationById = new Map(
@@ -34435,127 +34901,128 @@ const manualReplacements = {
 const apiManual = renderMarkdownTemplate(apiManualMarkdown, manualReplacements);
 const llmManual = renderMarkdownTemplate(llmManualMarkdown, manualReplacements);
 const mcpManual = renderMarkdownTemplate(mcpManualMarkdown, manualReplacements);
+const apiDocSections = readCliDocSections("manual-api");
+const llmDocSections = readCliDocSections("manual-llm");
+const mcpDocSections = readCliDocSections("manual-mcp");
+const mergeDocSections = (topic, json, sections) => {
+  for (const fieldName of Object.keys(sections)) {
+    if (Object.hasOwn(json, fieldName)) {
+      throw new Error(
+        `Doc metadata field "${fieldName}" conflicts with ${topic} manual JSON`
+      );
+    }
+  }
+  return { ...json, ...sections };
+};
 const topics = {
   api: {
     manual: apiManual,
-    json: {
-      topic: "api",
-      title: "Webstudio API CLI Manual",
-      workflows: [
-        "webstudio init --link <api-share-link> --json",
-        "webstudio permissions --json",
-        "webstudio schema api --json",
-        "webstudio publish deploy --target production --json",
-        "webstudio domains list --json",
-        "webstudio mcp"
-      ],
-      taskRecipes,
-      useCaseScenarios,
-      knownGaps: knownCliGaps,
-      topLevelCommands: topLevelCommandCatalog,
-      apiCommandsByArea,
-      mcpOnlyCommands: mcpOnlyCommandCatalog,
-      inputFileShapes,
-      mcpArgumentExamples,
-      commands: commandCatalog,
-      readCommands,
-      writeCommands,
-      mutationNamespaces: buildPatchNamespaces,
-      sessionBehavior: {
-        localReads: "Use compatible cached namespaces and fetch only missing or stale namespaces.",
-        localMutations: "Build patches locally, commit with the cached build version, and update local state only after remote commit succeeds.",
-        serverOnly: "Run remotely and invalidate/refetch namespaces declared by the public operation catalog.",
-        refreshFlag: "Use --refresh to refresh required namespaces before local-capable commands.",
-        metadata: "Successful command JSON includes meta.session with operationId, buildId, version, source, committed, compatibility, namespace metadata, and diagnostics."
+    json: mergeDocSections(
+      "api",
+      {
+        topic: "api",
+        title: readCliDocTitle("manual-api"),
+        workflows: [
+          "webstudio init --link <api-share-link> --json",
+          "webstudio permissions --json",
+          "webstudio schema api --json",
+          "webstudio publish deploy --target production --json",
+          "webstudio domains list --json",
+          "webstudio mcp"
+        ],
+        taskRecipes,
+        useCaseScenarios,
+        knownGaps: knownCliGaps,
+        topLevelCommands: topLevelCommandCatalog,
+        apiCommandsByArea,
+        mcpOnlyCommands: mcpOnlyCommandCatalog,
+        inputFileShapes,
+        mcpArgumentExamples,
+        commands: commandCatalog,
+        readCommands,
+        writeCommands,
+        mutationNamespaces: buildPatchNamespaces,
+        sessionBehavior: {
+          localReads: "Use compatible cached namespaces and fetch only missing or stale namespaces.",
+          localMutations: "Build patches locally, commit with the cached build version, and update local state only after remote commit succeeds.",
+          serverOnly: "Run remotely and invalidate/refetch namespaces declared by the public operation catalog.",
+          refreshFlag: "Use --refresh to refresh required namespaces before local-capable commands.",
+          metadata: "Successful command JSON includes meta.session with operationId, buildId, version, source, committed, compatibility, namespace metadata, and diagnostics."
+        }
       },
-      safetyRules: [
-        "Always pass --json.",
-        "Never pass project ids; commands use the configured project.",
-        "Read ids before writing.",
-        "Prefer semantic MCP write tools over apply-patch.",
-        "For MCP apply-patch, read the latest version with MCP snapshot before writing.",
-        "Reuse ids from MCP snapshot output when updating existing records.",
-        "Generate new unique ids when adding records.",
-        "Regenerate the patch after a version conflict."
-      ]
-    }
+      apiDocSections
+    )
   },
   llm: {
     manual: llmManual,
-    json: {
-      topic: "llm",
-      title: "Webstudio CLI Manual for LLMs",
-      discovery: [
-        "webstudio schema api --json",
-        "webstudio permissions --json",
-        "webstudio mcp",
-        "MCP tool: status",
-        "MCP resource: webstudio://project/tools"
-      ],
-      taskRecipes,
-      useCaseScenarios,
-      knownGaps: knownCliGaps,
-      topLevelCommands: topLevelCommandCatalog,
-      apiCommandsByArea,
-      mcpOnlyCommands: mcpOnlyCommandCatalog,
-      inputFileShapes,
-      mcpArgumentExamples,
-      commands: commandCatalog,
-      readCommands,
-      writeCommands,
-      sessionBehavior: [
-        "Read meta.session.source and meta.session.namespaces to understand whether data came from local cache, remote refresh, dry-run, or server-only execution.",
-        "Use --refresh before a local-capable command when the cached snapshot may be stale.",
-        "A mutation is durable only when meta.session.committed is true."
-      ],
-      writes: [
-        "Use MCP tools for fine-grained project edits.",
-        "Use top-level CLI only for link/sync/build/publish/domains/permissions/discovery workflows."
-      ],
-      rules: [
-        "Always pass --json.",
-        "Never guess ids for existing records. Read them first.",
-        "Use the configured project only.",
-        "Regenerate patches after VERSION_CONFLICT.",
-        "Use stdout JSON as the contract."
-      ]
-    }
+    json: mergeDocSections(
+      "llm",
+      {
+        topic: "llm",
+        title: readCliDocTitle("manual-llm"),
+        discovery: [
+          "webstudio schema api --json",
+          "webstudio permissions --json",
+          "webstudio mcp",
+          "MCP tool: status",
+          "MCP resource: webstudio://project/tools"
+        ],
+        taskRecipes,
+        useCaseScenarios,
+        knownGaps: knownCliGaps,
+        topLevelCommands: topLevelCommandCatalog,
+        apiCommandsByArea,
+        mcpOnlyCommands: mcpOnlyCommandCatalog,
+        inputFileShapes,
+        mcpArgumentExamples,
+        commands: commandCatalog,
+        readCommands,
+        writeCommands,
+        sessionBehavior: [
+          "Read meta.session.source and meta.session.namespaces to understand whether data came from local cache, remote refresh, dry-run, or server-only execution.",
+          "Use --refresh before a local-capable command when the cached snapshot may be stale.",
+          "A mutation is durable only when meta.session.committed is true."
+        ],
+        writes: [
+          "Use MCP tools for fine-grained project edits.",
+          "Use top-level CLI only for link/sync/build/publish/domains/permissions/discovery workflows."
+        ],
+        visionVerificationLoop: [...mcpVisionVerificationLoop],
+        screenshotVerification: screenshotVerificationSummary
+      },
+      llmDocSections
+    )
   },
   mcp: {
     manual: mcpManual,
-    json: {
-      topic: "mcp",
-      title: "Webstudio MCP Manual",
-      startup: [
-        "webstudio init --link <api-share-link> --json",
-        "webstudio permissions --json",
-        "webstudio mcp"
-      ],
-      discovery: [
-        "tools/list",
-        "resources/list",
-        "meta.index",
-        "meta.guide",
-        "meta.get_more_tools"
-      ],
-      resources: [
-        "webstudio://project/status",
-        "webstudio://project/tools",
-        "webstudio://project/guide"
-      ],
-      rules: [
-        "stdout is reserved for MCP JSON-RPC while the server is running.",
-        "Operate on the configured project only.",
-        "Read ids before writing.",
-        "Prefer semantic tools over apply-patch.",
-        "Use status and refresh when cached namespaces may be stale.",
-        "A mutation is durable only when meta.session.committed is true.",
-        "For visual/design work, verify the rendered result with vision before finishing."
-      ],
-      visionVerificationLoop: [...mcpVisionVerificationLoop],
-      mcpArgumentExamples,
-      screenshotVerification: screenshotVerificationSummary
-    }
+    json: mergeDocSections(
+      "mcp",
+      {
+        topic: "mcp",
+        title: readCliDocTitle("manual-mcp"),
+        startup: [
+          "webstudio init --link <api-share-link> --json",
+          "webstudio permissions --json",
+          "webstudio mcp"
+        ],
+        discovery: [
+          "tools/list",
+          "resources/list",
+          "meta.index",
+          "meta.guide",
+          "meta.get_more_tools"
+        ],
+        resources: [
+          "webstudio://project/status",
+          "webstudio://project/tools",
+          "webstudio://project/guide"
+        ],
+        visionVerificationLoop: [...mcpVisionVerificationLoop],
+        mcpArgumentExamples,
+        screenshotVerification: screenshotVerificationSummary
+      },
+      mcpDocSections
+    )
   }
 };
 const man = (options) => {
@@ -39371,6 +39838,10 @@ const captureScreenshotWithBrowserInstall = async (options, dependencies2 = defa
     return captureScreenshot(options, dependencies2);
   }
 };
+const prepareMcpProjectSession = async (session) => {
+  await session.initialize();
+  await session.markStale(builderNamespaces);
+};
 const mcpOptions = (yargs) => yargs.example(
   "$0 mcp",
   "Run a local MCP server over stdio for the configured Webstudio project"
@@ -39380,13 +39851,7 @@ const mcpOptions = (yargs) => yargs.example(
 ).example(
   "MCP tool: meta.guide",
   "Ask for the recommended workflow and relevant tools"
-).epilogue(
-  [
-    "Plain `webstudio mcp` starts the stdio MCP server.",
-    "After startup, MCP clients discover capabilities with tools/list, resources/list, meta.index, meta.guide, and meta.get_more_tools.",
-    "stdout is reserved for MCP JSON-RPC messages while the server is running."
-  ].join("\n")
-);
+).epilogue(readCliDoc("mcp-startup-epilogue"));
 const mcp = async () => {
   const connection = await resolveApiConnection();
   const apiConnection = {
@@ -39404,6 +39869,7 @@ const mcp = async () => {
     }
   };
   const session = createCliProjectSession({ connection: apiConnection });
+  await prepareMcpProjectSession(session);
   const preview2 = createPreviewController({ host: "127.0.0.1", port: 5173 });
   await connectProjectSessionMcpServer({
     operations: publicApiOperations,