@blkc-code/cli 0.3.0 → 0.4.0

package/dist/blkc.cjs

@@ -2932,7 +2932,7 @@ Expecting one of '${allowedValues.join("', '")}'`);
        * @param {(string | Function)} text - string to add, or a function returning a string
        * @return {Command} `this` command for chaining
        */
-      addHelpText(position, text2) {
+      addHelpText(position, text3) {
         const allowedValues = ["beforeAll", "before", "after", "afterAll"];
         if (!allowedValues.includes(position)) {
           throw new Error(`Unexpected value for position to addHelpText.
@@ -2941,10 +2941,10 @@ Expecting one of '${allowedValues.join("', '")}'`);
         const helpEvent = `${position}Help`;
         this.on(helpEvent, (context) => {
           let helpStr;
-          if (typeof text2 === "function") {
-            helpStr = text2({ error: context.error, command: context.command });
+          if (typeof text3 === "function") {
+            helpStr = text3({ error: context.error, command: context.command });
           } else {
-            helpStr = text2;
+            helpStr = text3;
           }
           if (helpStr) {
             context.write(`${helpStr}
@@ -7049,7 +7049,7 @@ var require_react_production = __commonJS({
       }
       throw thenable;
     }
-    function mapIntoArray(children, array2, escapedPrefix, nameSoFar, callback) {
+    function mapIntoArray(children, array3, escapedPrefix, nameSoFar, callback) {
       var type = typeof children;
       if ("undefined" === type || "boolean" === type) children = null;
       var invokeCallback = false;
@@ -7070,7 +7070,7 @@ var require_react_production = __commonJS({
               case REACT_LAZY_TYPE:
                 return invokeCallback = children._init, mapIntoArray(
                   invokeCallback(children._payload),
-                  array2,
+                  array3,
                   escapedPrefix,
                   nameSoFar,
                   callback
@@ -7078,7 +7078,7 @@ var require_react_production = __commonJS({
             }
         }
       if (invokeCallback)
-        return callback = callback(children), invokeCallback = "" === nameSoFar ? "." + getElementKey(children, 0) : nameSoFar, isArrayImpl(callback) ? (escapedPrefix = "", null != invokeCallback && (escapedPrefix = invokeCallback.replace(userProvidedKeyEscapeRegex, "$&/") + "/"), mapIntoArray(callback, array2, escapedPrefix, "", function(c2) {
+        return callback = callback(children), invokeCallback = "" === nameSoFar ? "." + getElementKey(children, 0) : nameSoFar, isArrayImpl(callback) ? (escapedPrefix = "", null != invokeCallback && (escapedPrefix = invokeCallback.replace(userProvidedKeyEscapeRegex, "$&/") + "/"), mapIntoArray(callback, array3, escapedPrefix, "", function(c2) {
           return c2;
         })) : null != callback && (isValidElement(callback) && (callback = cloneAndReplaceKey(
           callback,
@@ -7086,14 +7086,14 @@ var require_react_production = __commonJS({
             userProvidedKeyEscapeRegex,
             "$&/"
           ) + "/") + invokeCallback
-        )), array2.push(callback)), 1;
+        )), array3.push(callback)), 1;
       invokeCallback = 0;
       var nextNamePrefix = "" === nameSoFar ? "." : nameSoFar + ":";
       if (isArrayImpl(children))
         for (var i = 0; i < children.length; i++)
           nameSoFar = children[i], type = nextNamePrefix + getElementKey(nameSoFar, i), invokeCallback += mapIntoArray(
             nameSoFar,
-            array2,
+            array3,
             escapedPrefix,
             type,
             callback
@@ -7102,7 +7102,7 @@ var require_react_production = __commonJS({
         for (children = i.call(children), i = 0; !(nameSoFar = children.next()).done; )
           nameSoFar = nameSoFar.value, type = nextNamePrefix + getElementKey(nameSoFar, i++), invokeCallback += mapIntoArray(
             nameSoFar,
-            array2,
+            array3,
             escapedPrefix,
             type,
             callback
@@ -7111,14 +7111,14 @@ var require_react_production = __commonJS({
         if ("function" === typeof children.then)
           return mapIntoArray(
             resolveThenable(children),
-            array2,
+            array3,
             escapedPrefix,
             nameSoFar,
             callback
           );
-        array2 = String(children);
+        array3 = String(children);
         throw Error(
-          "Objects are not valid as a React child (found: " + ("[object Object]" === array2 ? "object with keys {" + Object.keys(children).join(", ") + "}" : array2) + "). If you meant to render a collection of children, use an array instead."
+          "Objects are not valid as a React child (found: " + ("[object Object]" === array3 ? "object with keys {" + Object.keys(children).join(", ") + "}" : array3) + "). If you meant to render a collection of children, use an array instead."
         );
       }
       return invokeCallback;
@@ -7742,15 +7742,15 @@ var require_react_dom_server_legacy_node_production = __commonJS({
       ["xHeight", "x-height"]
     ]);
     var matchHtmlRegExp = /["'&<>]/;
-    function escapeTextForBrowser(text2) {
-      if ("boolean" === typeof text2 || "number" === typeof text2 || "bigint" === typeof text2)
-        return "" + text2;
-      text2 = "" + text2;
-      var match = matchHtmlRegExp.exec(text2);
+    function escapeTextForBrowser(text3) {
+      if ("boolean" === typeof text3 || "number" === typeof text3 || "bigint" === typeof text3)
+        return "" + text3;
+      text3 = "" + text3;
+      var match = matchHtmlRegExp.exec(text3);
       if (match) {
         var html = "", index, lastIndex = 0;
-        for (index = match.index; index < text2.length; index++) {
-          switch (text2.charCodeAt(index)) {
+        for (index = match.index; index < text3.length; index++) {
+          switch (text3.charCodeAt(index)) {
             case 34:
               match = "&quot;";
               break;
@@ -7769,13 +7769,13 @@ var require_react_dom_server_legacy_node_production = __commonJS({
             default:
               continue;
           }
-          lastIndex !== index && (html += text2.slice(lastIndex, index));
+          lastIndex !== index && (html += text3.slice(lastIndex, index));
           lastIndex = index + 1;
           html += match;
         }
-        text2 = lastIndex !== index ? html + text2.slice(lastIndex, index) : html;
+        text3 = lastIndex !== index ? html + text3.slice(lastIndex, index) : html;
       }
-      return text2;
+      return text3;
     }
     var uppercasePattern = /([A-Z])/g;
     var msPattern = /^ms-/;
@@ -9796,10 +9796,10 @@ var require_react_dom_server_legacy_node_production = __commonJS({
         generateStaticMarkup
       };
     }
-    function pushTextInstance(target, text2, renderState, textEmbedded) {
+    function pushTextInstance(target, text3, renderState, textEmbedded) {
       if (renderState.generateStaticMarkup)
-        return target.push(escapeTextForBrowser(text2)), false;
-      "" === text2 ? target = textEmbedded : (textEmbedded && target.push("<!-- -->"), target.push(escapeTextForBrowser(text2)), target = true);
+        return target.push(escapeTextForBrowser(text3)), false;
+      "" === text3 ? target = textEmbedded : (textEmbedded && target.push("<!-- -->"), target.push(escapeTextForBrowser(text3)), target = true);
       return target;
     }
     function pushSegmentFinale(target, renderState, lastPushedText, textEmbedded) {
@@ -13032,15 +13032,15 @@ var require_react_dom_server_node_production = __commonJS({
       ["xHeight", "x-height"]
     ]);
     var matchHtmlRegExp = /["'&<>]/;
-    function escapeTextForBrowser(text2) {
-      if ("boolean" === typeof text2 || "number" === typeof text2 || "bigint" === typeof text2)
-        return "" + text2;
-      text2 = "" + text2;
-      var match = matchHtmlRegExp.exec(text2);
+    function escapeTextForBrowser(text3) {
+      if ("boolean" === typeof text3 || "number" === typeof text3 || "bigint" === typeof text3)
+        return "" + text3;
+      text3 = "" + text3;
+      var match = matchHtmlRegExp.exec(text3);
       if (match) {
         var html = "", index, lastIndex = 0;
-        for (index = match.index; index < text2.length; index++) {
-          switch (text2.charCodeAt(index)) {
+        for (index = match.index; index < text3.length; index++) {
+          switch (text3.charCodeAt(index)) {
             case 34:
               match = "&quot;";
               break;
@@ -13059,13 +13059,13 @@ var require_react_dom_server_node_production = __commonJS({
             default:
               continue;
           }
-          lastIndex !== index && (html += text2.slice(lastIndex, index));
+          lastIndex !== index && (html += text3.slice(lastIndex, index));
           lastIndex = index + 1;
           html += match;
         }
-        text2 = lastIndex !== index ? html + text2.slice(lastIndex, index) : html;
+        text3 = lastIndex !== index ? html + text3.slice(lastIndex, index) : html;
       }
-      return text2;
+      return text3;
     }
     var uppercasePattern = /([A-Z])/g;
     var msPattern = /^ms-/;
@@ -13351,10 +13351,10 @@ var require_react_dom_server_node_production = __commonJS({
       return resumableState + "_";
     }
     var textSeparator = stringToPrecomputedChunk("<!-- -->");
-    function pushTextInstance(target, text2, renderState, textEmbedded) {
-      if ("" === text2) return textEmbedded;
+    function pushTextInstance(target, text3, renderState, textEmbedded) {
+      if ("" === text3) return textEmbedded;
       textEmbedded && target.push(textSeparator);
-      target.push(escapeTextForBrowser(text2));
+      target.push(escapeTextForBrowser(text3));
       return true;
     }
     function pushViewTransitionAttributes(target, formatContext) {
@@ -31167,13 +31167,13 @@ var require_JSXTransformer = __commonJS({
       return firstChar >= _charcodes.charCodes.lowercaseA && firstChar <= _charcodes.charCodes.lowercaseZ;
     }
     exports2.startsWithLowerCase = startsWithLowerCase;
-    function formatJSXTextLiteral(text2) {
+    function formatJSXTextLiteral(text3) {
       let result = "";
       let whitespace = "";
       let isInInitialLineWhitespace = false;
       let seenNonWhitespace = false;
-      for (let i = 0; i < text2.length; i++) {
-        const c2 = text2[i];
+      for (let i = 0; i < text3.length; i++) {
+        const c2 = text3[i];
         if (c2 === " " || c2 === "	" || c2 === "\r") {
           if (!isInInitialLineWhitespace) {
             whitespace += c2;
@@ -31188,7 +31188,7 @@ var require_JSXTransformer = __commonJS({
           result += whitespace;
           whitespace = "";
           if (c2 === "&") {
-            const { entity, newI } = processEntity(text2, i + 1);
+            const { entity, newI } = processEntity(text3, i + 1);
             i = newI - 1;
             result += entity;
           } else {
@@ -31203,10 +31203,10 @@ var require_JSXTransformer = __commonJS({
       }
       return JSON.stringify(result);
     }
-    function formatJSXTextReplacement(text2) {
+    function formatJSXTextReplacement(text3) {
       let numNewlines = 0;
       let numSpaces = 0;
-      for (const c2 of text2) {
+      for (const c2 of text3) {
         if (c2 === "\n") {
           numNewlines++;
           numSpaces = 0;
@@ -31216,21 +31216,21 @@ var require_JSXTransformer = __commonJS({
       }
       return "\n".repeat(numNewlines) + " ".repeat(numSpaces);
     }
-    function formatJSXStringValueLiteral(text2) {
+    function formatJSXStringValueLiteral(text3) {
       let result = "";
-      for (let i = 0; i < text2.length; i++) {
-        const c2 = text2[i];
+      for (let i = 0; i < text3.length; i++) {
+        const c2 = text3[i];
         if (c2 === "\n") {
-          if (/\s/.test(text2[i + 1])) {
+          if (/\s/.test(text3[i + 1])) {
             result += " ";
-            while (i < text2.length && /\s/.test(text2[i + 1])) {
+            while (i < text3.length && /\s/.test(text3[i + 1])) {
               i++;
             }
           } else {
             result += "\n";
           }
         } else if (c2 === "&") {
-          const { entity, newI } = processEntity(text2, i + 1);
+          const { entity, newI } = processEntity(text3, i + 1);
           result += entity;
           i = newI - 1;
         } else {
@@ -31239,38 +31239,38 @@ var require_JSXTransformer = __commonJS({
       }
       return JSON.stringify(result);
     }
-    function processEntity(text2, indexAfterAmpersand) {
+    function processEntity(text3, indexAfterAmpersand) {
       let str = "";
       let count = 0;
       let entity;
       let i = indexAfterAmpersand;
-      if (text2[i] === "#") {
+      if (text3[i] === "#") {
         let radix = 10;
         i++;
         let numStart;
-        if (text2[i] === "x") {
+        if (text3[i] === "x") {
           radix = 16;
           i++;
           numStart = i;
-          while (i < text2.length && isHexDigit(text2.charCodeAt(i))) {
+          while (i < text3.length && isHexDigit(text3.charCodeAt(i))) {
             i++;
           }
         } else {
           numStart = i;
-          while (i < text2.length && isDecimalDigit(text2.charCodeAt(i))) {
+          while (i < text3.length && isDecimalDigit(text3.charCodeAt(i))) {
             i++;
           }
         }
-        if (text2[i] === ";") {
-          const numStr = text2.slice(numStart, i);
+        if (text3[i] === ";") {
+          const numStr = text3.slice(numStart, i);
           if (numStr) {
             i++;
             entity = String.fromCodePoint(parseInt(numStr, radix));
           }
         }
       } else {
-        while (i < text2.length && count++ < 10) {
-          const ch = text2[i];
+        while (i < text3.length && count++ < 10) {
+          const ch = text3[i];
           i++;
           if (ch === ";") {
             entity = _xhtml2.default.get(str);
@@ -33017,21 +33017,21 @@ var require_gen_mapping_umd = __commonJS({
       function put(setarr, key) {
         const index = get2(setarr, key);
         if (index !== void 0) return index;
-        const { array: array2, _indexes: indexes } = cast(setarr);
-        const length = array2.push(key);
+        const { array: array3, _indexes: indexes } = cast(setarr);
+        const length = array3.push(key);
         return indexes[key] = length - 1;
       }
       function remove(setarr, key) {
         const index = get2(setarr, key);
         if (index === void 0) return;
-        const { array: array2, _indexes: indexes } = cast(setarr);
-        for (let i = index + 1; i < array2.length; i++) {
-          const k2 = array2[i];
-          array2[i - 1] = k2;
+        const { array: array3, _indexes: indexes } = cast(setarr);
+        for (let i = index + 1; i < array3.length; i++) {
+          const k2 = array3[i];
+          array3[i - 1] = k2;
           indexes[k2]--;
         }
         indexes[key] = void 0;
-        array2.pop();
+        array3.pop();
       }
       var import_sourcemap_codec = __toESM2(require_sourcemap_codec());
       var import_trace_mapping = __toESM2(require_trace_mapping());
@@ -33215,11 +33215,11 @@ var require_gen_mapping_umd = __commonJS({
         }
         return index;
       }
-      function insert(array2, index, value) {
-        for (let i = array2.length; i > index; i--) {
-          array2[i] = array2[i - 1];
+      function insert(array3, index, value) {
+        for (let i = array3.length; i > index; i--) {
+          array3[i] = array3[i - 1];
         }
-        array2[index] = value;
+        array3[index] = value;
       }
       function removeEmptyFinalLines(mappings) {
         const { length } = mappings;
@@ -33229,8 +33229,8 @@ var require_gen_mapping_umd = __commonJS({
         }
         if (len < length) mappings.length = len;
       }
-      function putAll(setarr, array2) {
-        for (let i = 0; i < array2.length; i++) put(setarr, array2[i]);
+      function putAll(setarr, array3) {
+        for (let i = 0; i < array3.length; i++) put(setarr, array3[i]);
       }
       function skipSourceless(line, index) {
         if (index === 0) return true;
@@ -33892,10 +33892,10 @@ var require_types2 = __commonJS({
       }(TType)
     );
     exports2.TLiteral = TLiteral;
-    function array2(typeSpec) {
+    function array3(typeSpec) {
       return new TArray(parseSpec(typeSpec));
     }
-    exports2.array = array2;
+    exports2.array = array3;
     var TArray = (
       /** @class */
       function(_super) {
@@ -34901,7 +34901,7 @@ var require_typescript = __commonJS({
     var _lval = require_lval();
     var _statement = require_statement();
     var _util = require_util();
-    var _jsx6 = require_jsx();
+    var _jsx7 = require_jsx();
     function tsIsIdentifier() {
       return _index.match.call(void 0, _types.TokenType.name);
     }
@@ -35525,7 +35525,7 @@ var require_typescript = __commonJS({
           tsParseType();
           _index.eat.call(void 0, _types.TokenType.comma);
         }
-        _jsx6.nextJSXTagToken.call(void 0);
+        _jsx7.nextJSXTagToken.call(void 0);
         _index.popTypeContext.call(void 0, oldIsType);
       }
     }
@@ -44995,9 +44995,9 @@ var Ora = class {
     this.#linesToClear = this.#lineCount;
     return this;
   }
-  start(text2) {
-    if (text2) {
-      this.text = text2;
+  start(text3) {
+    if (text3) {
+      this.text = text3;
     }
     if (this.#isSilent) {
       return this;
@@ -45040,17 +45040,17 @@ var Ora = class {
     }
     return this;
   }
-  succeed(text2) {
-    return this.stopAndPersist({ symbol: log_symbols_default.success, text: text2 });
+  succeed(text3) {
+    return this.stopAndPersist({ symbol: log_symbols_default.success, text: text3 });
   }
-  fail(text2) {
-    return this.stopAndPersist({ symbol: log_symbols_default.error, text: text2 });
+  fail(text3) {
+    return this.stopAndPersist({ symbol: log_symbols_default.error, text: text3 });
   }
-  warn(text2) {
-    return this.stopAndPersist({ symbol: log_symbols_default.warning, text: text2 });
+  warn(text3) {
+    return this.stopAndPersist({ symbol: log_symbols_default.warning, text: text3 });
   }
-  info(text2) {
-    return this.stopAndPersist({ symbol: log_symbols_default.info, text: text2 });
+  info(text3) {
+    return this.stopAndPersist({ symbol: log_symbols_default.info, text: text3 });
   }
   stopAndPersist(options = {}) {
     if (this.#isSilent) {
@@ -45059,9 +45059,9 @@ var Ora = class {
     const prefixText = options.prefixText ?? this.#prefixText;
     const fullPrefixText = this.#getFullPrefixText(prefixText, " ");
     const symbolText = options.symbol ?? " ";
-    const text2 = options.text ?? this.text;
+    const text3 = options.text ?? this.text;
     const separatorText = symbolText ? " " : "";
-    const fullText = typeof text2 === "string" ? separatorText + text2 : "";
+    const fullText = typeof text3 === "string" ? separatorText + text3 : "";
     const suffixText = options.suffixText ?? this.#suffixText;
     const fullSuffixText = this.#getFullSuffixText(suffixText, " ");
     const textToWrite = fullPrefixText + symbolText + fullText + fullSuffixText + "\n";
@@ -45762,8 +45762,8 @@ function getEnumValues(entries) {
   const values = Object.entries(entries).filter(([k2, _2]) => numericValues.indexOf(+k2) === -1).map(([_2, v]) => v);
   return values;
 }
-function joinValues(array2, separator = "|") {
-  return array2.map((val) => stringifyPrimitive(val)).join(separator);
+function joinValues(array3, separator = "|") {
+  return array3.map((val) => stringifyPrimitive(val)).join(separator);
 }
 function jsonStringifyReplacer(_2, value) {
   if (typeof value === "bigint")
@@ -54431,8 +54431,8 @@ function ko_default() {
 }
 
 // ../../node_modules/zod/v4/locales/lt.js
-var capitalizeFirstCharacter = (text2) => {
-  return text2.charAt(0).toUpperCase() + text2.slice(1);
+var capitalizeFirstCharacter = (text3) => {
+  return text3.charAt(0).toUpperCase() + text3.slice(1);
 };
 function getUnitTypeFromNumber(number4) {
   const abs = Math.abs(number4);
@@ -65510,7 +65510,7 @@ function hasBom(buffer) {
   return buffer.length >= 3 && buffer[0] === 239 && buffer[1] === 187 && buffer[2] === 191;
 }
 function parseManifest(buffer) {
-  const text2 = buffer.toString("utf8");
+  const text3 = buffer.toString("utf8");
   if (hasBom(buffer)) {
     return {
       ok: false,
@@ -65521,7 +65521,7 @@ function parseManifest(buffer) {
     };
   }
   try {
-    return { ok: true, value: JSON.parse(text2) };
+    return { ok: true, value: JSON.parse(text3) };
   } catch (error62) {
     return { ok: false, errors: [error62 instanceof Error ? error62.message : String(error62)] };
   }
@@ -66527,6 +66527,7 @@ var import_node_fs = require("node:fs");
 var import_promises8 = require("node:fs/promises");
 var import_node_path8 = __toESM(require("node:path"), 1);
 var MANIFEST_NAMES = ["block.json", "kit.json", "circuit.json", "manifest.json"];
+var SKIPPED_FOLDERS = /* @__PURE__ */ new Set(["node_modules", "dist", "coverage"]);
 async function isDir(p2) {
   try {
     return (await (0, import_promises8.stat)(p2)).isDirectory();
@@ -66542,15 +66543,23 @@ function isCompanion(file2) {
   if (import_node_path8.default.basename(dir) === "boards") return (0, import_node_fs.existsSync)(import_node_path8.default.join(dir, "..", "circuit.json"));
   return false;
 }
+async function isJsonSchema(file2) {
+  try {
+    const parsed = JSON.parse(await (0, import_promises8.readFile)(file2, "utf8"));
+    return typeof parsed.$schema === "string" && /^https?:\/\/json-schema\.org\//.test(parsed.$schema);
+  } catch {
+    return false;
+  }
+}
 async function walkManifests(root) {
   const found = [];
   const entries = await (0, import_promises8.readdir)(root, { withFileTypes: true });
   for (const entry of entries) {
-    if (entry.name === "node_modules" || entry.name.startsWith(".")) continue;
+    if (SKIPPED_FOLDERS.has(entry.name) || entry.name.startsWith(".")) continue;
     const full = import_node_path8.default.join(root, entry.name);
     if (entry.isDirectory()) {
       found.push(...await walkManifests(full));
-    } else if (entry.isFile() && (MANIFEST_NAMES.includes(entry.name) || isCompanion(full))) {
+    } else if (entry.isFile() && (MANIFEST_NAMES.includes(entry.name) || isCompanion(full)) && !await isJsonSchema(full)) {
       found.push(full);
     }
   }
@@ -66715,9 +66724,9 @@ var pixelOfficeKit = {
   "manifestVersion": 2,
   "id": "pixel-office",
   "name": "Pixel Office",
-  "summary": "A free Kit: the landing page for a pixel-art office for your project.",
-  "description": "The first release of Pixel Office: a themed landing page you can render with @blkc-code/render-web. The pixel-art office itself is not built yet. It needs the reserved canvas renderer.",
-  "version": "0.1.0",
+  "summary": "A free Kit: a living pixel-art office for your project, plus a landing page.",
+  "description": "Your agents and tasks become characters and quests in a pixel-art office, drawn by @blkc-code/render-canvas. The rest of the Kit shows every web Block with one theme.",
+  "version": "0.2.0",
   "category": "showcase",
   "tags": [
     "pixel",
@@ -66730,12 +66739,57 @@ var pixelOfficeKit = {
   "blocks": [
     {
       "blockId": "hero",
-      "version": "^0.2.0",
+      "version": "^0.4.0",
+      "required": true
+    },
+    {
+      "blockId": "office",
+      "version": "^0.4.0",
+      "required": true
+    },
+    {
+      "blockId": "services",
+      "version": "^0.4.0",
+      "required": true
+    },
+    {
+      "blockId": "values",
+      "version": "^0.4.0",
+      "required": true
+    },
+    {
+      "blockId": "cta",
+      "version": "^0.4.0",
       "required": true
     },
     {
       "blockId": "text",
-      "version": "^0.2.0",
+      "version": "^0.4.0",
+      "required": true
+    },
+    {
+      "blockId": "image",
+      "version": "^0.4.0",
+      "required": true
+    },
+    {
+      "blockId": "button",
+      "version": "^0.4.0",
+      "required": true
+    },
+    {
+      "blockId": "section",
+      "version": "^0.4.0",
+      "required": true
+    },
+    {
+      "blockId": "story",
+      "version": "^0.4.0",
+      "required": true
+    },
+    {
+      "blockId": "contact",
+      "version": "^0.4.0",
       "required": true
     }
   ],
@@ -66747,12 +66801,12 @@ var pixelOfficeKit = {
           {
             "slug": "background",
             "name": "Background",
-            "color": "#1a1a2e"
+            "color": "#14142b"
           },
           {
             "slug": "foreground",
             "name": "Foreground",
-            "color": "#e0e0e0"
+            "color": "#f1f1f8"
           },
           {
             "slug": "primary",
@@ -66762,26 +66816,36 @@ var pixelOfficeKit = {
           {
             "slug": "accent",
             "name": "Accent",
-            "color": "#ff6b6b"
+            "color": "#ff7ab6"
           },
           {
             "slug": "muted-foreground",
             "name": "Muted text",
-            "color": "#a0a0b8"
+            "color": "#b6b6d2"
           },
           {
             "slug": "surface",
             "name": "Surface",
-            "color": "#16213e"
+            "color": "#20203f"
+          },
+          {
+            "slug": "border",
+            "name": "Border",
+            "color": "#38386a"
           }
         ]
       },
       "typography": {
         "fontFamilies": [
+          {
+            "slug": "body",
+            "name": "Body",
+            "fontFamily": "ui-monospace, Menlo, Consolas, monospace"
+          },
           {
             "slug": "pixel",
             "name": "Pixel",
-            "fontFamily": "'Press Start 2P', monospace"
+            "fontFamily": "'Press Start 2P', ui-monospace, monospace"
           }
         ]
       }
@@ -66791,33 +66855,300 @@ var pixelOfficeKit = {
     "pages": [
       {
         "slug": "",
-        "title": "Pixel Office",
+        "title": "Home",
         "blocks": [
           {
             "block": "hero",
             "props": {
               "eyebrow": "Free and MIT licensed",
               "heading": "Pixel Office",
-              "subheading": "A pixel-art office for your project, on its way. This Kit is the first piece: its theme and landing page.",
+              "subheading": "Your agents and tasks, alive in a pixel-art office. Click someone to see what they are doing.",
               "cta": {
-                "label": "View on GitHub",
+                "label": "Get the Kit",
                 "href": "https://github.com/blkc-community/kits/tree/main/pixel-office"
               },
               "secondaryCta": {
                 "label": "Read the docs",
-                "href": "https://blkc.blackcode.space/docs"
+                "href": "https://blkc.blackcode.space/docs/quickstart",
+                "variant": "outline"
               },
-              "tone": "inverse",
-              "size": "lg",
+              "size": "md",
               "align": "center"
             }
           },
+          {
+            "block": "office",
+            "props": {
+              "heading": "Meet the team",
+              "intro": "Everyone here is data. Change a status in JSON and they get up and walk to where that work happens.",
+              "agents": [
+                {
+                  "id": "nova",
+                  "name": "Nova",
+                  "role": "Builder",
+                  "state": "working",
+                  "task": "Building the checkout page"
+                },
+                {
+                  "id": "sage",
+                  "name": "Sage",
+                  "role": "Researcher",
+                  "state": "thinking",
+                  "task": "Comparing three ways to do search"
+                },
+                {
+                  "id": "rex",
+                  "name": "Rex",
+                  "role": "Fixer",
+                  "state": "blocked",
+                  "task": "Waiting on a login to the staging site"
+                },
+                {
+                  "id": "juno",
+                  "name": "Juno",
+                  "role": "Reviewer",
+                  "state": "reviewing",
+                  "task": "Reading through the pricing page"
+                },
+                {
+                  "id": "mika",
+                  "name": "Mika",
+                  "role": "Writer",
+                  "state": "idle",
+                  "task": "Taking a break between articles"
+                },
+                {
+                  "id": "ola",
+                  "name": "Ola",
+                  "role": "Designer",
+                  "state": "done",
+                  "task": "Finished the new logo"
+                }
+              ],
+              "tasks": [
+                {
+                  "title": "Design the logo",
+                  "state": "done",
+                  "agent": "ola"
+                },
+                {
+                  "title": "Write the about page",
+                  "state": "done",
+                  "agent": "mika"
+                },
+                {
+                  "title": "Build the checkout page",
+                  "state": "doing",
+                  "agent": "nova"
+                },
+                {
+                  "title": "Choose a search tool",
+                  "state": "doing",
+                  "agent": "sage"
+                },
+                {
+                  "title": "Review the pricing page",
+                  "state": "doing",
+                  "agent": "juno"
+                },
+                {
+                  "title": "Fix the staging login",
+                  "state": "todo",
+                  "agent": "rex"
+                },
+                {
+                  "title": "Launch",
+                  "state": "todo"
+                }
+              ]
+            }
+          },
+          {
+            "block": "services",
+            "props": {
+              "heading": "What is in the Kit",
+              "intro": "A Kit is a theme, pages and Blocks you can edit. Nothing here is locked away.",
+              "items": [
+                {
+                  "title": "A living office",
+                  "text": "People walk, work, take breaks and raise a flag when they are stuck, all from their status."
+                },
+                {
+                  "title": "Quests",
+                  "text": "Tasks show as notes on the quest board and as a progress bar across the office."
+                },
+                {
+                  "title": "Your layout",
+                  "text": "Rooms, doors and furniture are JSON, so you can build the office you want."
+                }
+              ]
+            }
+          },
+          {
+            "block": "values",
+            "props": {
+              "heading": "Why build it this way",
+              "items": [
+                {
+                  "title": "You own it",
+                  "text": "It is a folder of files in your project. Fork it and change anything."
+                },
+                {
+                  "title": "No lock-in",
+                  "text": "Plain JSON, and a page that still reads well with no JavaScript."
+                },
+                {
+                  "title": "Original art",
+                  "text": "Every sprite is drawn in code, so you can restyle it freely."
+                }
+              ]
+            }
+          },
+          {
+            "block": "cta",
+            "props": {
+              "heading": "Make it your own",
+              "text": "Fork the Kit and run it on your machine in under a minute.",
+              "cta": {
+                "label": "See how",
+                "href": "https://blkc.blackcode.space/docs/quickstart"
+              }
+            }
+          }
+        ]
+      },
+      {
+        "slug": "blocks",
+        "title": "Every Block",
+        "blocks": [
+          {
+            "block": "hero",
+            "props": {
+              "eyebrow": "The hero Block",
+              "heading": "Every Block, one theme",
+              "subheading": "This page uses each web Block once, so you can see them together and take what you need.",
+              "cta": {
+                "label": "Primary button",
+                "href": "#"
+              },
+              "secondaryCta": {
+                "label": "Second button",
+                "href": "#",
+                "variant": "outline"
+              },
+              "align": "center",
+              "size": "sm"
+            }
+          },
           {
             "block": "text",
             "props": {
-              "content": '<p>Pixel Office will turn a BLKC project into a playful pixel-art office, with your AI coding agents as animated characters. It is inspired by <a href="https://github.com/pixel-agents-hq/pixel-agents">Pixel Agents</a> (MIT).</p><p>Today this Kit is a landing page and a theme. The office needs a canvas renderer, which BLKC has reserved in its format but not built yet.</p>',
-              "tag": "div",
-              "textAlign": "center"
+              "content": '<p>This is the <strong>text</strong> Block. It keeps lines to a comfortable length and takes rich text, including <a href="https://github.com/blkc-community/blocks">links</a>.</p><p>Everything on this page takes its colours and fonts from the Kit, so changing the theme changes all of it.</p>',
+              "tag": "div"
+            }
+          },
+          {
+            "block": "image",
+            "props": {
+              "src": "data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2032%2018%22%20shape-rendering%3D%22crispEdges%22%3E%3Crect%20width%3D%2232%22%20height%3D%2218%22%20fill%3D%22%231f1f3d%22%2F%3E%3Crect%20y%3D%2213%22%20width%3D%2232%22%20height%3D%225%22%20fill%3D%22%23a06f45%22%2F%3E%3Crect%20x%3D%224%22%20y%3D%229%22%20width%3D%2210%22%20height%3D%224%22%20fill%3D%22%238a5a33%22%2F%3E%3Crect%20x%3D%227%22%20y%3D%225%22%20width%3D%225%22%20height%3D%224%22%20fill%3D%22%23111827%22%2F%3E%3Crect%20x%3D%228%22%20y%3D%226%22%20width%3D%223%22%20height%3D%222%22%20fill%3D%22%2300ff88%22%2F%3E%3Crect%20x%3D%2219%22%20y%3D%226%22%20width%3D%224%22%20height%3D%224%22%20fill%3D%22%23f4d3b5%22%2F%3E%3Crect%20x%3D%2219%22%20y%3D%224%22%20width%3D%224%22%20height%3D%222%22%20fill%3D%22%235a3a22%22%2F%3E%3Crect%20x%3D%2218%22%20y%3D%2210%22%20width%3D%226%22%20height%3D%225%22%20fill%3D%22%233b82f6%22%2F%3E%3Crect%20x%3D%2226%22%20y%3D%229%22%20width%3D%223%22%20height%3D%224%22%20fill%3D%22%2315803d%22%2F%3E%3Crect%20x%3D%2226%22%20y%3D%2213%22%20width%3D%223%22%20height%3D%222%22%20fill%3D%22%2392400e%22%2F%3E%3C%2Fsvg%3E",
+              "alt": "A pixel-art person at a desk with a computer and a plant",
+              "caption": "The image Block, with a caption.",
+              "width": "480px"
+            }
+          },
+          {
+            "block": "button",
+            "props": {
+              "label": "The button Block",
+              "href": "#",
+              "variant": "primary",
+              "size": "lg"
+            }
+          },
+          {
+            "block": "section",
+            "props": {
+              "backgroundColor": "#20203f",
+              "heading": "The section Block",
+              "content": "<p>A band of colour that holds its own words, or other Blocks in code.</p>"
+            }
+          },
+          {
+            "block": "services",
+            "props": {
+              "heading": "The services Block",
+              "intro": "A heading, an intro and a grid of cards.",
+              "items": [
+                {
+                  "title": "First",
+                  "text": "Each card has a title and some text.",
+                  "link": {
+                    "label": "And a link",
+                    "href": "#"
+                  }
+                },
+                {
+                  "title": "Second",
+                  "text": "The grid adapts to the width of the screen."
+                },
+                {
+                  "title": "Third",
+                  "text": "Hover over a card to lift it."
+                }
+              ]
+            }
+          },
+          {
+            "block": "story",
+            "props": {
+              "heading": "The story Block",
+              "body": "<p>Words on one side and a picture on the other. On a phone they stack.</p><p>Use <strong>imageSide</strong> to swap them over.</p>",
+              "image": {
+                "src": "data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2032%2018%22%20shape-rendering%3D%22crispEdges%22%3E%3Crect%20width%3D%2232%22%20height%3D%2218%22%20fill%3D%22%231f1f3d%22%2F%3E%3Crect%20y%3D%2213%22%20width%3D%2232%22%20height%3D%225%22%20fill%3D%22%23a06f45%22%2F%3E%3Crect%20x%3D%224%22%20y%3D%229%22%20width%3D%2210%22%20height%3D%224%22%20fill%3D%22%238a5a33%22%2F%3E%3Crect%20x%3D%227%22%20y%3D%225%22%20width%3D%225%22%20height%3D%224%22%20fill%3D%22%23111827%22%2F%3E%3Crect%20x%3D%228%22%20y%3D%226%22%20width%3D%223%22%20height%3D%222%22%20fill%3D%22%2300ff88%22%2F%3E%3Crect%20x%3D%2219%22%20y%3D%226%22%20width%3D%224%22%20height%3D%224%22%20fill%3D%22%23f4d3b5%22%2F%3E%3Crect%20x%3D%2219%22%20y%3D%224%22%20width%3D%224%22%20height%3D%222%22%20fill%3D%22%235a3a22%22%2F%3E%3Crect%20x%3D%2218%22%20y%3D%2210%22%20width%3D%226%22%20height%3D%225%22%20fill%3D%22%233b82f6%22%2F%3E%3Crect%20x%3D%2226%22%20y%3D%229%22%20width%3D%223%22%20height%3D%224%22%20fill%3D%22%2315803d%22%2F%3E%3Crect%20x%3D%2226%22%20y%3D%2213%22%20width%3D%223%22%20height%3D%222%22%20fill%3D%22%2392400e%22%2F%3E%3C%2Fsvg%3E",
+                "alt": "A pixel-art office scene"
+              },
+              "imageSide": "right"
+            }
+          },
+          {
+            "block": "values",
+            "props": {
+              "heading": "The values Block",
+              "items": [
+                {
+                  "title": "One",
+                  "text": "Cards on a tinted band."
+                },
+                {
+                  "title": "Two",
+                  "text": "Good for what you stand for."
+                },
+                {
+                  "title": "Three",
+                  "text": "Or for how you work."
+                }
+              ]
+            }
+          },
+          {
+            "block": "cta",
+            "props": {
+              "heading": "The call to action Block",
+              "text": "One clear thing to do next.",
+              "cta": {
+                "label": "Do the thing",
+                "href": "#"
+              }
+            }
+          },
+          {
+            "block": "contact",
+            "props": {
+              "heading": "The contact Block",
+              "intro": "Contact details, each on its own card.",
+              "email": "hello@example.com",
+              "phone": "+1 555 010 0199",
+              "address": "1 Pixel Street, Tile City"
             }
           }
         ]
@@ -66837,14 +67168,7 @@ var pixelOfficeKit = {
 var PIXEL_OFFICE_README = [
   "# Pixel Office",
   "",
-  "A free, MIT-licensed BLKC Kit. The goal is a pixel-art office for your project, with",
-  "your AI coding agents as animated characters.",
-  "",
-  "## Status",
-  "",
-  "This first release is a **theme and a landing page**. The office is not built yet: it",
-  "needs the `canvas` renderer target, which the BLKC format reserves but no renderer",
-  "implements.",
+  "A free, MIT-licensed BLKC Kit: a living pixel-art office for your project. Your agents and tasks become characters and quests.",
   "",
   "## Run it",
   "",
@@ -66852,10 +67176,33 @@ var PIXEL_OFFICE_README = [
   "npx @blkc-code/cli@latest dev",
   "```",
   "",
-  "This opens a preview in your browser and reloads when you save. Edit `kit.json`: the",
-  "colours and font are under `theme`, and the words and sections under `content.pages`.",
+  "This opens a preview in your browser and reloads when you save. Click someone in the office to see what they are doing. The Every Block page shows each web Block with this theme.",
+  "",
+  "## Make it your own",
+  "",
+  "Everything is in `kit.json`:",
+  "",
+  "- **Colours and fonts:** `theme`.",
+  "- **Words and sections:** `content.pages`.",
+  "- **The team and quests:** the `office` Block's `agents` and `tasks`.",
+  "- **The building:** give the `office` Block `cols`, `rows`, `rooms`, `doors` and `furniture`. Leave them out for the standard layout.",
+  "",
+  "An agent's `state` is one of `working`, `thinking`, `blocked`, `reviewing`, `idle`, `done` or `away`. Furniture types are `desk`, `coffee`, `water`, `sofa`, `plant`, `board`, `shelf`, `server`, `table` and `rug`.",
   "",
-  "To render it inside your own site instead:",
+  "## Connect real work",
+  "",
+  "While `blkc dev` is running, anything can update the office by writing `office-state.json` beside `kit.json`:",
+  "",
+  "```json",
+  "{",
+  '  "agents": [{ "id": "nova", "name": "Nova", "state": "blocked", "task": "Needs a password" }],',
+  '  "tasks": [{ "title": "Ship it", "state": "doing" }]',
+  "}",
+  "```",
+  "",
+  "A script, a build or a hook from your coding agent can write that file. BLKC does not connect to any agent for you yet.",
+  "",
+  "## Put it on your own site",
   "",
   "```js",
   'import { readFileSync } from "node:fs";',
@@ -66865,13 +67212,11 @@ var PIXEL_OFFICE_README = [
   'const { html } = renderToHTML(kit, "home");',
   "```",
   "",
-  "The markup uses Tailwind classes. If your site has no Tailwind, add",
-  "`@blkc-code/render-web/styles.css`.",
+  "Then, on the page, add `@blkc-code/render-web/styles.css` and call `mountCanvasBlocks()` from `@blkc-code/render-canvas`, or load its `runtime.js` in a script tag.",
   "",
   "## Credits",
   "",
-  "Inspired by [Pixel Agents](https://github.com/pixel-agents-hq/pixel-agents) by Pablo De",
-  "Lucca, MIT licensed. See [NOTICE](./NOTICE). No Pixel Agents code or art is included yet."
+  "Inspired by [Pixel Agents](https://github.com/pixel-agents-hq/pixel-agents) by Pablo De Lucca, MIT licensed. See [NOTICE](./NOTICE). The art here is original."
 ].join("\n") + "\n";
 var PIXEL_OFFICE_NOTICE = [
   "Pixel Office Kit",
@@ -66881,8 +67226,9 @@ var PIXEL_OFFICE_NOTICE = [
   "https://github.com/pixel-agents-hq/pixel-agents",
   "Copyright (c) 2026 Pablo De Lucca. MIT licensed.",
   "",
-  "No Pixel Agents code or art is included in this Kit yet. Anything imported from it",
-  "later must keep that project's copyright and licence notice here."
+  "Asset provenance: all characters, furniture, floors and walls are original work, drawn",
+  "in code in @blkc-code/render-canvas. No Pixel Agents code or art is included. Anything",
+  "imported from it later must keep that project's copyright and licence notice here."
 ].join("\n") + "\n";
 var PIXEL_OFFICE_TEST = `import assert from "node:assert/strict";
 import { readFileSync } from "node:fs";
@@ -67005,7 +67351,7 @@ async function readSource(kind, source, cwd) {
   } catch (error62) {
     const template = kind === "kit" ? KIT_TEMPLATES[source] : void 0;
     if (!template) throw error62;
-    const files = new Map(Object.entries(template).map(([name, text2]) => [name, import_node_buffer.Buffer.from(text2)]));
+    const files = new Map(Object.entries(template).map(([name, text3]) => [name, import_node_buffer.Buffer.from(text3)]));
     return { files, label };
   }
 }
@@ -67347,6 +67693,7 @@ Run \`blkc check\` to validate it and \`node --test\` to run its test.
 
 // src/commands/dev.ts
 var import_node_child_process = require("node:child_process");
+var import_node_crypto = require("node:crypto");
 var import_node_fs3 = require("node:fs");
 var import_promises11 = require("node:fs/promises");
 var import_node_http = require("node:http");
@@ -67365,6 +67712,7 @@ __export(dist_exports, {
   ImageBlock: () => ImageBlock,
   KitPage: () => KitPage,
   ManifestPreview: () => ManifestPreview,
+  OfficeBlock: () => OfficeBlock,
   SectionBlock: () => SectionBlock,
   ServicesBlock: () => ServicesBlock,
   StoryBlock: () => StoryBlock,
@@ -67411,12 +67759,13 @@ __export(dist_exports, {
   renderPage: () => renderPage,
   resolveKitPage: () => resolveKitPage,
   richTextToHtml: () => richTextToHtml,
+  safeJson: () => safeJson,
   themeJsonToVariables: () => themeJsonToVariables,
   themeToCss: () => themeToCss,
   themeToStyle: () => themeToStyle,
   unregisterBlock: () => unregisterBlock
 });
-var import_jsx_runtime4 = __toESM(require_jsx_runtime(), 1);
+var import_jsx_runtime5 = __toESM(require_jsx_runtime(), 1);
 var import_react3 = __toESM(require_react(), 1);
 
 // ../render-web/dist/clsx.js
@@ -67449,7 +67798,9 @@ var DEFAULT_THEME = {
   "--blkc-color-background": "#ffffff",
   "--blkc-color-text": "#1a1a1a",
   "--blkc-color-text-secondary": "#6c757d",
-  "--blkc-color-border": "#e0e0e0",
+  "--blkc-color-border": "color-mix(in srgb, var(--blkc-color-text, #1a1a1a) 16%, var(--blkc-color-background, #ffffff))",
+  "--blkc-color-surface": "color-mix(in srgb, var(--blkc-color-text, #1a1a1a) 6%, var(--blkc-color-background, #ffffff))",
+  "--blkc-color-accent": "var(--blkc-color-primary, #0066cc)",
   // Typography
   "--blkc-font-family": "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif",
   "--blkc-font-size-base": "1rem",
@@ -67663,7 +68014,7 @@ function getBooleanProp(props, key, defaultValue) {
 function normalizeUrl(url2) {
   if (!url2)
     return void 0;
-  if (!url2.startsWith("http://") && !url2.startsWith("https://") && !url2.startsWith("/") && !url2.startsWith("#") && !url2.startsWith("mailto:") && !url2.startsWith("tel:")) {
+  if (!url2.startsWith("http://") && !url2.startsWith("https://") && !url2.startsWith("/") && !url2.startsWith("#") && !url2.startsWith("mailto:") && !url2.startsWith("tel:") && !url2.startsWith("data:image/")) {
     return `https://${url2}`;
   }
   return url2;
@@ -67736,8 +68087,8 @@ var SAFE_SCHEME = /^(https?:|mailto:|tel:|\/(?![/\\&])|#)/i;
 var HTTP_SCHEME = /^https?:/i;
 var CONTROL_CHARS = /[\u0000-\u001f\u007f]/;
 var BARE_AMPERSAND = /&(?!(?:[a-z][a-z0-9]*|#\d+|#x[0-9a-f]+);)/gi;
-function escapeText(text2) {
-  return text2.replace(BARE_AMPERSAND, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+function escapeText(text3) {
+  return text3.replace(BARE_AMPERSAND, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 }
 function escapeAttr(value) {
   return escapeText(value).replace(/"/g, "&quot;");
@@ -67828,8 +68179,8 @@ var NODE_TAGS = {
   listItem: "li",
   blockquote: "blockquote"
 };
-function escapeHtml(text2) {
-  return text2.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+function escapeHtml(text3) {
+  return text3.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
 }
 function textNode(node2) {
   let html = escapeHtml(node2.text ?? "");
@@ -67862,33 +68213,72 @@ function richTextToHtml(value) {
 }
 
 // ../render-web/dist/sections.js
-var BAND = "w-full px-4 py-16 sm:py-20";
+var BAND = "w-full px-6 py-16 sm:py-24";
 var INNER = "mx-auto flex w-full max-w-blkc flex-col gap-8";
-var HEADING = "text-3xl font-bold tracking-tight sm:text-4xl";
-var LEAD = "max-w-2xl text-lg text-muted-foreground";
-var BUTTON = "inline-flex w-fit items-center justify-center rounded-md bg-primary px-6 py-3 text-base font-semibold text-primary-foreground transition-colors hover:bg-primary/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring";
-function CardGrid({ items, showLinks }) {
-  return (0, import_jsx_runtime.jsx)("ul", { className: "grid list-none gap-6 p-0 sm:grid-cols-2 lg:grid-cols-3", children: items.map((item, index) => (0, import_jsx_runtime.jsxs)("li", { className: "flex flex-col gap-2 rounded-lg border border-border p-6", children: [(0, import_jsx_runtime.jsx)("h3", { className: "text-xl font-semibold", children: item.title }), item.text && (0, import_jsx_runtime.jsx)("p", { className: "text-muted-foreground", children: item.text }), showLinks && item.link && (0, import_jsx_runtime.jsx)("a", { href: normalizeUrl(item.link.href), className: "mt-auto font-medium text-primary underline-offset-4 hover:underline", children: item.link.label })] }, index)) });
+var HEADING = "blkc-heading text-3xl font-bold tracking-tight text-balance sm:text-4xl";
+var LEAD = "max-w-2xl text-lg text-muted-foreground text-pretty";
+var BUTTON = "inline-flex w-fit items-center justify-center rounded-lg bg-accent-foreground px-7 py-3.5 text-base font-semibold text-accent no-underline shadow-md transition-all hover:-translate-y-0.5 hover:shadow-lg focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring";
+function CardGrid({ items, showLinks, surface }) {
+  return (0, import_jsx_runtime.jsx)("ul", { className: "grid list-none gap-6 p-0 sm:grid-cols-2 lg:grid-cols-3", children: items.map((item, index) => (0, import_jsx_runtime.jsxs)("li", { className: clsx("flex flex-col gap-3 rounded-xl border border-border p-6 shadow-sm transition-all hover:-translate-y-0.5 hover:shadow-md", surface), children: [(0, import_jsx_runtime.jsx)("h3", { className: "text-xl font-semibold", children: item.title }), item.text && (0, import_jsx_runtime.jsx)("p", { className: "text-muted-foreground", children: item.text }), showLinks && item.link && (0, import_jsx_runtime.jsx)("a", { href: normalizeUrl(item.link.href), className: "mt-auto font-medium text-primary underline-offset-4 hover:underline", children: item.link.label })] }, index)) });
 }
 function ServicesBlock({ props: p2, className, style }) {
-  return (0, import_jsx_runtime.jsx)("section", { className: clsx("blkc-services", BAND, className), style, children: (0, import_jsx_runtime.jsxs)("div", { className: INNER, children: [(0, import_jsx_runtime.jsx)("h2", { className: HEADING, children: p2.heading }), p2.intro && (0, import_jsx_runtime.jsx)("p", { className: LEAD, children: p2.intro }), (0, import_jsx_runtime.jsx)(CardGrid, { items: p2.items ?? [], showLinks: true })] }) });
+  return (0, import_jsx_runtime.jsx)("section", { className: clsx("blkc-services", BAND, className), style, children: (0, import_jsx_runtime.jsxs)("div", { className: INNER, children: [(0, import_jsx_runtime.jsx)("h2", { className: HEADING, children: p2.heading }), p2.intro && (0, import_jsx_runtime.jsx)("p", { className: LEAD, children: p2.intro }), (0, import_jsx_runtime.jsx)(CardGrid, { items: p2.items ?? [], showLinks: true, surface: "bg-muted" })] }) });
 }
 function StoryBlock({ props: p2, className, style }) {
   const body = richTextToHtml(p2.body);
-  return (0, import_jsx_runtime.jsx)("section", { className: clsx("blkc-story", BAND, className), style, children: (0, import_jsx_runtime.jsxs)("div", { className: "mx-auto grid w-full max-w-blkc items-center gap-10 md:grid-cols-2", children: [(0, import_jsx_runtime.jsxs)("div", { className: clsx("flex flex-col gap-4", p2.imageSide === "left" && "md:order-2"), children: [(0, import_jsx_runtime.jsx)("h2", { className: HEADING, children: p2.heading }), body && (0, import_jsx_runtime.jsx)("div", { className: "flex flex-col gap-3 leading-relaxed", dangerouslySetInnerHTML: { __html: body } })] }), p2.image && (0, import_jsx_runtime.jsx)("img", { src: p2.image.src, alt: p2.image.alt, className: "h-auto w-full rounded-lg object-cover" })] }) });
+  return (0, import_jsx_runtime.jsx)("section", { className: clsx("blkc-story", BAND, className), style, children: (0, import_jsx_runtime.jsxs)("div", { className: "mx-auto grid w-full max-w-blkc items-center gap-10 md:grid-cols-2", children: [(0, import_jsx_runtime.jsxs)("div", { className: clsx("flex flex-col gap-4", p2.imageSide === "left" && "md:order-2"), children: [(0, import_jsx_runtime.jsx)("h2", { className: HEADING, children: p2.heading }), body && (0, import_jsx_runtime.jsx)("div", { className: "flex flex-col gap-3 text-lg leading-relaxed text-muted-foreground [&_strong]:text-foreground", dangerouslySetInnerHTML: { __html: body } })] }), p2.image && (0, import_jsx_runtime.jsx)("img", { src: p2.image.src, alt: p2.image.alt, className: "h-auto w-full rounded-2xl border border-border object-cover shadow-lg" })] }) });
 }
 function ValuesBlock({ props: p2, className, style }) {
-  return (0, import_jsx_runtime.jsx)("section", { className: clsx("blkc-values bg-muted", BAND, className), style, children: (0, import_jsx_runtime.jsxs)("div", { className: INNER, children: [(0, import_jsx_runtime.jsx)("h2", { className: HEADING, children: p2.heading }), (0, import_jsx_runtime.jsx)(CardGrid, { items: p2.items ?? [], showLinks: false })] }) });
+  return (0, import_jsx_runtime.jsx)("section", { className: clsx("blkc-values bg-muted", BAND, className), style, children: (0, import_jsx_runtime.jsxs)("div", { className: INNER, children: [(0, import_jsx_runtime.jsx)("h2", { className: HEADING, children: p2.heading }), (0, import_jsx_runtime.jsx)(CardGrid, { items: p2.items ?? [], showLinks: false, surface: "bg-background" })] }) });
 }
 function CtaBlock({ props: p2, className, style }) {
-  return (0, import_jsx_runtime.jsx)("section", { className: clsx("blkc-cta bg-accent text-accent-foreground", BAND, className), style, children: (0, import_jsx_runtime.jsxs)("div", { className: clsx(INNER, "items-center text-center"), children: [(0, import_jsx_runtime.jsx)("h2", { className: HEADING, children: p2.heading }), p2.text && (0, import_jsx_runtime.jsx)("p", { className: "max-w-2xl text-lg", children: p2.text }), p2.cta && (0, import_jsx_runtime.jsx)("a", { href: normalizeUrl(p2.cta.href), className: BUTTON, children: p2.cta.label })] }) });
+  return (0, import_jsx_runtime.jsx)("section", { className: clsx("blkc-cta", BAND, className), style, children: (0, import_jsx_runtime.jsxs)("div", { className: clsx(INNER, "items-center rounded-3xl bg-accent px-6 py-14 text-center text-accent-foreground shadow-lg sm:py-20"), children: [(0, import_jsx_runtime.jsx)("h2", { className: HEADING, children: p2.heading }), p2.text && (0, import_jsx_runtime.jsx)("p", { className: "max-w-2xl text-lg", children: p2.text }), p2.cta && (0, import_jsx_runtime.jsx)("a", { href: normalizeUrl(p2.cta.href), className: BUTTON, children: p2.cta.label })] }) });
 }
 function ContactBlock({ props: p2, className, style }) {
-  return (0, import_jsx_runtime.jsx)("section", { className: clsx("blkc-contact", BAND, className), style, children: (0, import_jsx_runtime.jsxs)("div", { className: INNER, children: [(0, import_jsx_runtime.jsx)("h2", { className: HEADING, children: p2.heading }), p2.intro && (0, import_jsx_runtime.jsx)("p", { className: LEAD, children: p2.intro }), (0, import_jsx_runtime.jsxs)("address", { className: "flex flex-col gap-2 not-italic", children: [p2.email && (0, import_jsx_runtime.jsx)("a", { href: `mailto:${encodeURI(p2.email)}`, className: "text-primary underline-offset-4 hover:underline", children: p2.email }), p2.phone && (0, import_jsx_runtime.jsx)("a", { href: `tel:${p2.phone.replace(/[^+\d]/g, "")}`, className: "text-primary underline-offset-4 hover:underline", children: p2.phone }), p2.address && (0, import_jsx_runtime.jsx)("span", { children: p2.address })] })] }) });
+  return (0, import_jsx_runtime.jsx)("section", { className: clsx("blkc-contact", BAND, className), style, children: (0, import_jsx_runtime.jsxs)("div", { className: INNER, children: [(0, import_jsx_runtime.jsx)("h2", { className: HEADING, children: p2.heading }), p2.intro && (0, import_jsx_runtime.jsx)("p", { className: LEAD, children: p2.intro }), (0, import_jsx_runtime.jsxs)("address", { className: "grid gap-4 not-italic sm:grid-cols-2 lg:grid-cols-3 [&>*]:rounded-xl [&>*]:border [&>*]:border-border [&>*]:bg-muted [&>*]:p-6 [&>*]:font-medium [&>*]:shadow-sm", children: [p2.email && (0, import_jsx_runtime.jsx)("a", { href: `mailto:${encodeURI(p2.email)}`, className: "text-primary underline-offset-4 hover:underline", children: p2.email }), p2.phone && (0, import_jsx_runtime.jsx)("a", { href: `tel:${p2.phone.replace(/[^+\d]/g, "")}`, className: "text-primary underline-offset-4 hover:underline", children: p2.phone }), p2.address && (0, import_jsx_runtime.jsx)("span", { children: p2.address })] })] }) });
 }
 
-// ../render-web/dist/kit.js
+// ../render-web/dist/office.js
 var import_jsx_runtime2 = __toESM(require_jsx_runtime(), 1);
+var STATE_LABEL = {
+  working: "Working",
+  thinking: "Thinking",
+  blocked: "Blocked",
+  reviewing: "Reviewing",
+  idle: "On a break",
+  done: "Finished",
+  away: "Away"
+};
+var STATE_CLASS = {
+  working: "bg-emerald-500",
+  thinking: "bg-sky-500",
+  blocked: "bg-red-500",
+  reviewing: "bg-violet-500",
+  idle: "bg-amber-500",
+  done: "bg-yellow-400",
+  away: "bg-zinc-400"
+};
+var TASK_MARK = { todo: "bg-amber-300", doing: "bg-sky-400", done: "bg-emerald-400" };
+var text = (value) => typeof value === "string" ? value : "";
+var array2 = (value) => Array.isArray(value) ? value : [];
+function safeJson(value) {
+  return JSON.stringify(value).replace(/</g, "\\u003c").replace(new RegExp("\\u2028", "g"), "\\u2028").replace(new RegExp("\\u2029", "g"), "\\u2029");
+}
+function OfficeBlock({ props: p2, className, style }) {
+  const agents = array2(p2.agents);
+  const tasks = array2(p2.tasks);
+  const done = tasks.filter((task) => task.state === "done").length;
+  const percent = tasks.length > 0 ? Math.round(done / tasks.length * 100) : 0;
+  const scene = { cols: p2.cols, rows: p2.rows, rooms: p2.rooms, doors: p2.doors, furniture: p2.furniture, agents, tasks };
+  const heading = text(p2.heading);
+  return (0, import_jsx_runtime2.jsx)("section", { className: clsx("blkc-office w-full px-6 py-16 sm:py-20", className), style, "data-blkc-canvas-root": "", children: (0, import_jsx_runtime2.jsxs)("div", { className: "mx-auto flex w-full max-w-blkc flex-col gap-8", children: [(heading || p2.intro) && (0, import_jsx_runtime2.jsxs)("header", { className: "flex max-w-2xl flex-col gap-3", children: [heading && (0, import_jsx_runtime2.jsx)("h2", { className: "blkc-heading text-3xl font-bold tracking-tight text-balance sm:text-4xl", children: heading }), p2.intro && (0, import_jsx_runtime2.jsx)("p", { className: "text-lg text-muted-foreground", children: text(p2.intro) })] }), (0, import_jsx_runtime2.jsxs)("div", { className: "grid items-start gap-6 lg:grid-cols-[minmax(0,1fr)_20rem]", children: [(0, import_jsx_runtime2.jsxs)("div", { className: "overflow-hidden rounded-xl border border-border bg-muted shadow-lg", children: [(0, import_jsx_runtime2.jsx)("canvas", { "data-blkc-canvas": "office", role: "img", "aria-label": `${heading || "Pixel office"}: ${agents.length} people. Their status is listed beside this picture.`, className: "block aspect-[26/17] h-auto w-full touch-manipulation [image-rendering:pixelated]", style: p2.cols && p2.rows ? { aspectRatio: `${p2.cols} / ${p2.rows}` } : void 0 }), (0, import_jsx_runtime2.jsx)("script", { type: "application/json", "data-blkc-canvas-data": "", dangerouslySetInnerHTML: { __html: safeJson(scene) } })] }), (0, import_jsx_runtime2.jsxs)("aside", { className: "flex flex-col gap-6", children: [agents.length > 0 && (0, import_jsx_runtime2.jsxs)("div", { className: "flex flex-col gap-2", children: [(0, import_jsx_runtime2.jsx)("h3", { className: "text-sm font-semibold uppercase tracking-wide text-muted-foreground", children: "The team" }), (0, import_jsx_runtime2.jsx)("ul", { className: "m-0 flex list-none flex-col gap-1.5 p-0", children: agents.map((agent, index) => {
+    const state = text(agent.state) || "idle";
+    return (0, import_jsx_runtime2.jsx)("li", { children: (0, import_jsx_runtime2.jsxs)("button", { type: "button", disabled: true, "aria-pressed": "false", "data-blkc-agent": text(agent.id), className: "flex w-full cursor-pointer items-start gap-3 rounded-lg border border-border bg-background px-3 py-2 text-left text-inherit transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-default aria-pressed:border-primary aria-pressed:bg-muted", children: [(0, import_jsx_runtime2.jsx)("span", { className: clsx("mt-1.5 size-2.5 shrink-0 rounded-full", STATE_CLASS[state] ?? "bg-zinc-400"), "aria-hidden": "true" }), (0, import_jsx_runtime2.jsxs)("span", { className: "flex min-w-0 flex-col", children: [(0, import_jsx_runtime2.jsxs)("span", { className: "text-sm font-semibold", children: [text(agent.name) || text(agent.id), (0, import_jsx_runtime2.jsxs)("span", { className: "font-normal text-muted-foreground", children: [" \xB7 ", STATE_LABEL[state] ?? state] })] }), text(agent.task) && (0, import_jsx_runtime2.jsx)("span", { className: "text-sm text-muted-foreground", children: text(agent.task) })] })] }) }, index);
+  }) })] }), tasks.length > 0 && (0, import_jsx_runtime2.jsxs)("div", { className: "flex flex-col gap-2", children: [(0, import_jsx_runtime2.jsxs)("h3", { className: "text-sm font-semibold uppercase tracking-wide text-muted-foreground", children: ["Quests: ", done, " of ", tasks.length, " done"] }), (0, import_jsx_runtime2.jsx)("div", { className: "h-2 overflow-hidden rounded-full bg-muted", role: "progressbar", "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": percent, "aria-label": "Quests finished", children: (0, import_jsx_runtime2.jsx)("div", { className: "h-full rounded-full bg-primary", style: { width: `${percent}%` } }) }), (0, import_jsx_runtime2.jsx)("ul", { className: "m-0 flex list-none flex-col gap-1 p-0 text-sm", children: tasks.map((task, index) => (0, import_jsx_runtime2.jsxs)("li", { className: clsx("flex items-start gap-2", task.state === "done" && "text-muted-foreground line-through"), children: [(0, import_jsx_runtime2.jsx)("span", { className: clsx("mt-1 size-3 shrink-0 rounded-sm", TASK_MARK[text(task.state)] ?? TASK_MARK["todo"]), "aria-hidden": "true" }), (0, import_jsx_runtime2.jsx)("span", { children: text(task.title) })] }, index)) })] })] })] })] }) });
+}
+
+// ../render-web/dist/kit.js
+var import_jsx_runtime3 = __toESM(require_jsx_runtime(), 1);
 var import_react = __toESM(require_react(), 1);
 function resolveKitPage(kit, page) {
   const pages = kit.content?.pages ?? [];
@@ -67904,17 +68294,17 @@ function kitPageStyle(kit) {
 function KitPage({ kit, page, options }) {
   const instances = resolveKitPage(kit, page);
   if (!instances) {
-    return (0, import_jsx_runtime2.jsx)("div", { className: "blkc-page", children: (0, import_jsx_runtime2.jsxs)("p", { children: ["Page not found: ", page] }) });
+    return (0, import_jsx_runtime3.jsx)("div", { className: "blkc-page", children: (0, import_jsx_runtime3.jsxs)("p", { children: ["Page not found: ", page] }) });
   }
   const { elements } = renderBlocks(instances, options ?? {});
-  return (0, import_jsx_runtime2.jsx)("div", { className: "blkc-page", style: kitPageStyle(kit), children: elements.map((element, index) => (0, import_jsx_runtime2.jsx)(import_react.default.Fragment, { children: element }, index)) });
+  return (0, import_jsx_runtime3.jsx)("div", { className: "blkc-page", style: kitPageStyle(kit), children: elements.map((element, index) => (0, import_jsx_runtime3.jsx)(import_react.default.Fragment, { children: element }, index)) });
 }
 
 // ../render-web/dist/preview.js
-var import_jsx_runtime3 = __toESM(require_jsx_runtime(), 1);
+var import_jsx_runtime4 = __toESM(require_jsx_runtime(), 1);
 var import_react2 = __toESM(require_react(), 1);
 var rows = (value) => Array.isArray(value) ? value : [];
-var text = (value) => typeof value === "string" ? value : "";
+var text2 = (value) => typeof value === "string" ? value : "";
 var strings = (value) => Array.isArray(value) ? value.filter((v) => typeof v === "string") : [];
 function manifestKind(manifest) {
   if (typeof manifest !== "object" || manifest === null || Array.isArray(manifest))
@@ -67931,76 +68321,76 @@ function manifestKind(manifest) {
 function kitPages(manifest) {
   const content = manifest?.content;
   return rows(content?.pages).map((page) => ({
-    slug: text(page.slug) || "home",
-    title: text(page.title) || text(page.slug) || "Home"
+    slug: text2(page.slug) || "home",
+    title: text2(page.title) || text2(page.slug) || "Home"
   }));
 }
 function Note({ children }) {
-  return (0, import_jsx_runtime3.jsx)("div", { className: "mx-auto my-6 w-full max-w-3xl rounded-lg border border-border p-4 text-sm text-muted-foreground", children });
+  return (0, import_jsx_runtime4.jsx)("div", { className: "mx-auto my-6 w-full max-w-3xl rounded-lg border border-border p-4 text-sm text-muted-foreground", children });
 }
 function Card({ title: title3, summary, label, children }) {
-  return (0, import_jsx_runtime3.jsxs)("div", { className: "mx-auto flex w-full max-w-5xl flex-col gap-6 px-4 py-10", children: [(0, import_jsx_runtime3.jsxs)("header", { className: "flex flex-col gap-2", children: [(0, import_jsx_runtime3.jsx)("p", { className: "text-sm font-medium uppercase tracking-wide text-muted-foreground", children: label }), (0, import_jsx_runtime3.jsx)("h1", { className: "text-3xl font-bold tracking-tight", children: title3 }), summary && (0, import_jsx_runtime3.jsx)("p", { className: "text-lg text-muted-foreground", children: summary })] }), children] });
+  return (0, import_jsx_runtime4.jsxs)("div", { className: "mx-auto flex w-full max-w-5xl flex-col gap-6 px-4 py-10", children: [(0, import_jsx_runtime4.jsxs)("header", { className: "flex flex-col gap-2", children: [(0, import_jsx_runtime4.jsx)("p", { className: "text-sm font-medium uppercase tracking-wide text-muted-foreground", children: label }), (0, import_jsx_runtime4.jsx)("h1", { className: "text-3xl font-bold tracking-tight", children: title3 }), summary && (0, import_jsx_runtime4.jsx)("p", { className: "text-lg text-muted-foreground", children: summary })] }), children] });
 }
 function ListSection({ title: title3, items }) {
   if (items.length === 0)
     return null;
-  return (0, import_jsx_runtime3.jsxs)("section", { className: "flex flex-col gap-2", children: [(0, import_jsx_runtime3.jsx)("h2", { className: "text-lg font-semibold", children: title3 }), (0, import_jsx_runtime3.jsx)("ul", { className: "flex flex-col gap-1 text-sm", children: items.map((item, index) => (0, import_jsx_runtime3.jsx)("li", { className: "rounded-lg border border-border px-3 py-2", children: item }, index)) })] });
+  return (0, import_jsx_runtime4.jsxs)("section", { className: "flex flex-col gap-2", children: [(0, import_jsx_runtime4.jsx)("h2", { className: "text-lg font-semibold", children: title3 }), (0, import_jsx_runtime4.jsx)("ul", { className: "flex flex-col gap-1 text-sm", children: items.map((item, index) => (0, import_jsx_runtime4.jsx)("li", { className: "rounded-lg border border-border px-3 py-2", children: item }, index)) })] });
 }
 function BlockPreview({ manifest }) {
-  const id = text(manifest.id);
-  const name = text(manifest.name) || id;
-  const summary = text(manifest.summary);
+  const id = text2(manifest.id);
+  const name = text2(manifest.name) || id;
+  const summary = text2(manifest.summary);
   if (manifest.kind === "capability" || manifest.entryPoint) {
-    return (0, import_jsx_runtime3.jsxs)(Card, { title: name, summary, label: "Capability Block", children: [(0, import_jsx_runtime3.jsx)(Note, { children: "A capability Block runs code and has no page to draw, so this shows what it takes and returns." }), (0, import_jsx_runtime3.jsx)(ListSection, { title: "Inputs", items: strings(manifest.inputs) }), (0, import_jsx_runtime3.jsx)(ListSection, { title: "Outputs", items: strings(manifest.outputs) })] });
+    return (0, import_jsx_runtime4.jsxs)(Card, { title: name, summary, label: "Capability Block", children: [(0, import_jsx_runtime4.jsx)(Note, { children: "A capability Block runs code and has no page to draw, so this shows what it takes and returns." }), (0, import_jsx_runtime4.jsx)(ListSection, { title: "Inputs", items: strings(manifest.inputs) }), (0, import_jsx_runtime4.jsx)(ListSection, { title: "Outputs", items: strings(manifest.outputs) })] });
   }
   const example = manifest.example ?? {};
   if (isBlockRegistered(id)) {
     const result = renderBlock({ block: id, props: example });
     if (result.success)
       return result.element;
-    return (0, import_jsx_runtime3.jsxs)(Note, { children: ['Block "', id, '" could not render its example: ', result.error] });
+    return (0, import_jsx_runtime4.jsxs)(Note, { children: ['Block "', id, '" could not render its example: ', result.error] });
   }
   const attributes = Object.entries(manifest.attributes ?? {});
-  return (0, import_jsx_runtime3.jsxs)(Card, { title: name, summary, label: "UI Block", children: [(0, import_jsx_runtime3.jsxs)(Note, { children: ['There is no component registered for "', id, '" yet, so this shows its attributes and example. Register one with registerBlock() to see it drawn.'] }), (0, import_jsx_runtime3.jsx)(ListSection, { title: "Attributes", items: attributes.map(([key, a2]) => `${key}: ${text(a2.type) || "unknown"}${a2.required ? " (required)" : ""}`) }), Object.keys(example).length > 0 && (0, import_jsx_runtime3.jsxs)("section", { className: "flex flex-col gap-2", children: [(0, import_jsx_runtime3.jsx)("h2", { className: "text-lg font-semibold", children: "Example" }), (0, import_jsx_runtime3.jsx)("pre", { className: "overflow-x-auto rounded-lg border border-border p-3 text-xs", children: JSON.stringify(example, null, 2) })] })] });
+  return (0, import_jsx_runtime4.jsxs)(Card, { title: name, summary, label: "UI Block", children: [(0, import_jsx_runtime4.jsxs)(Note, { children: ['There is no component registered for "', id, '" yet, so this shows its attributes and example. Register one with registerBlock() to see it drawn.'] }), (0, import_jsx_runtime4.jsx)(ListSection, { title: "Attributes", items: attributes.map(([key, a2]) => `${key}: ${text2(a2.type) || "unknown"}${a2.required ? " (required)" : ""}`) }), Object.keys(example).length > 0 && (0, import_jsx_runtime4.jsxs)("section", { className: "flex flex-col gap-2", children: [(0, import_jsx_runtime4.jsx)("h2", { className: "text-lg font-semibold", children: "Example" }), (0, import_jsx_runtime4.jsx)("pre", { className: "overflow-x-auto rounded-lg border border-border p-3 text-xs", children: JSON.stringify(example, null, 2) })] })] });
 }
 function KitPreview({ manifest, page }) {
-  const name = text(manifest.name) || text(manifest.id);
+  const name = text2(manifest.name) || text2(manifest.id);
   const pages = kitPages(manifest);
   if (pages.length === 0) {
-    return (0, import_jsx_runtime3.jsxs)(Note, { children: [name, " has no pages yet. Add one to pages/home.json or to content.pages in kit.json."] });
+    return (0, import_jsx_runtime4.jsxs)(Note, { children: [name, " has no pages yet. Add one to pages/home.json or to content.pages in kit.json."] });
   }
   const slug = page ?? pages[0].slug;
   const instances = resolveKitPage(manifest, slug);
   if (!instances)
-    return (0, import_jsx_runtime3.jsxs)(Note, { children: [name, ' has no page called "', slug, '".'] });
+    return (0, import_jsx_runtime4.jsxs)(Note, { children: [name, ' has no page called "', slug, '".'] });
   if (instances.length === 0) {
-    return (0, import_jsx_runtime3.jsx)(Note, { children: 'This page has no Blocks yet. List some under "blocks" in the page and save.' });
+    return (0, import_jsx_runtime4.jsx)(Note, { children: 'This page has no Blocks yet. List some under "blocks" in the page and save.' });
   }
   return instances.map((instance, index) => {
     const result = renderBlock(instance);
-    return (0, import_jsx_runtime3.jsx)(import_react2.default.Fragment, { children: result.success ? result.element : (0, import_jsx_runtime3.jsx)(Note, { children: result.error }) }, index);
+    return (0, import_jsx_runtime4.jsx)(import_react2.default.Fragment, { children: result.success ? result.element : (0, import_jsx_runtime4.jsx)(Note, { children: result.error }) }, index);
   });
 }
 function Board({ board }) {
   const columns = rows(board.columns);
-  const nameOf = (id) => text(columns.find((column) => column.id === id)?.name) || text(id);
+  const nameOf = (id) => text2(columns.find((column) => column.id === id)?.name) || text2(id);
   const transitions = rows(board.transitions);
-  return (0, import_jsx_runtime3.jsxs)("section", { className: "flex flex-col gap-3", children: [(0, import_jsx_runtime3.jsxs)("div", { children: [(0, import_jsx_runtime3.jsx)("h2", { className: "text-xl font-semibold", children: text(board.name) || text(board.id) }), text(board.description) && (0, import_jsx_runtime3.jsx)("p", { className: "text-sm text-muted-foreground", children: text(board.description) })] }), (0, import_jsx_runtime3.jsx)("div", { className: "flex flex-wrap gap-3", children: columns.map((column, index) => (0, import_jsx_runtime3.jsxs)("div", { className: "flex min-h-32 min-w-40 flex-1 flex-col gap-1 rounded-lg border border-border p-3", children: [(0, import_jsx_runtime3.jsx)("h3", { className: "text-sm font-semibold", children: text(column.name) || text(column.id) }), typeof column.wipLimit === "number" && (0, import_jsx_runtime3.jsxs)("p", { className: "text-xs text-muted-foreground", children: ["Limit: ", column.wipLimit] })] }, index)) }), (0, import_jsx_runtime3.jsx)("p", { className: "text-sm text-muted-foreground", children: transitions.length === 0 ? "Tasks can move between any columns." : `Moves: ${transitions.map((t) => `${nameOf(t.from)} \u2192 ${nameOf(t.to)}`).join(", ")}` })] });
+  return (0, import_jsx_runtime4.jsxs)("section", { className: "flex flex-col gap-3", children: [(0, import_jsx_runtime4.jsxs)("div", { children: [(0, import_jsx_runtime4.jsx)("h2", { className: "text-xl font-semibold", children: text2(board.name) || text2(board.id) }), text2(board.description) && (0, import_jsx_runtime4.jsx)("p", { className: "text-sm text-muted-foreground", children: text2(board.description) })] }), (0, import_jsx_runtime4.jsx)("div", { className: "flex flex-wrap gap-3", children: columns.map((column, index) => (0, import_jsx_runtime4.jsxs)("div", { className: "flex min-h-32 min-w-40 flex-1 flex-col gap-1 rounded-lg border border-border p-3", children: [(0, import_jsx_runtime4.jsx)("h3", { className: "text-sm font-semibold", children: text2(column.name) || text2(column.id) }), typeof column.wipLimit === "number" && (0, import_jsx_runtime4.jsxs)("p", { className: "text-xs text-muted-foreground", children: ["Limit: ", column.wipLimit] })] }, index)) }), (0, import_jsx_runtime4.jsx)("p", { className: "text-sm text-muted-foreground", children: transitions.length === 0 ? "Tasks can move between any columns." : `Moves: ${transitions.map((t) => `${nameOf(t.from)} \u2192 ${nameOf(t.to)}`).join(", ")}` })] });
 }
 function CircuitPreview({ manifest }) {
   const boards = rows(manifest.boards);
-  return (0, import_jsx_runtime3.jsxs)(Card, { title: text(manifest.name) || text(manifest.id), summary: text(manifest.summary), label: "Circuit", children: [boards.length === 0 ? (0, import_jsx_runtime3.jsx)(Note, { children: "This Circuit has no boards yet. Add one to boards/main.json." }) : boards.map((board, index) => (0, import_jsx_runtime3.jsx)(Board, { board }, index)), (0, import_jsx_runtime3.jsx)(ListSection, { title: "Kits", items: rows(manifest.kits).map((kit) => `${text(kit.kitId)} ${text(kit.version)}`) }), (0, import_jsx_runtime3.jsx)(ListSection, { title: "Capabilities", items: rows(manifest.capabilities).map((c2) => `${text(c2.blockId)} ${text(c2.version)}`) })] });
+  return (0, import_jsx_runtime4.jsxs)(Card, { title: text2(manifest.name) || text2(manifest.id), summary: text2(manifest.summary), label: "Circuit", children: [boards.length === 0 ? (0, import_jsx_runtime4.jsx)(Note, { children: "This Circuit has no boards yet. Add one to boards/main.json." }) : boards.map((board, index) => (0, import_jsx_runtime4.jsx)(Board, { board }, index)), (0, import_jsx_runtime4.jsx)(ListSection, { title: "Kits", items: rows(manifest.kits).map((kit) => `${text2(kit.kitId)} ${text2(kit.version)}`) }), (0, import_jsx_runtime4.jsx)(ListSection, { title: "Capabilities", items: rows(manifest.capabilities).map((c2) => `${text2(c2.blockId)} ${text2(c2.version)}`) })] });
 }
 function ManifestPreview({ manifest, page }) {
   const kind = manifestKind(manifest);
   const m = manifest;
   const style = kind === "kit" ? kitPageStyle(manifest) : void 0;
-  return (0, import_jsx_runtime3.jsxs)("div", { className: "blkc-page", style, children: [kind === "block" && (0, import_jsx_runtime3.jsx)(BlockPreview, { manifest: m }), kind === "kit" && (0, import_jsx_runtime3.jsx)(KitPreview, { manifest: m, page }), kind === "circuit" && (0, import_jsx_runtime3.jsx)(CircuitPreview, { manifest: m }), kind === null && (0, import_jsx_runtime3.jsx)(Note, { children: "This is not a Block, Kit or Circuit manifest." })] });
+  return (0, import_jsx_runtime4.jsxs)("div", { className: "blkc-page", style, children: [kind === "block" && (0, import_jsx_runtime4.jsx)(BlockPreview, { manifest: m }), kind === "kit" && (0, import_jsx_runtime4.jsx)(KitPreview, { manifest: m, page }), kind === "circuit" && (0, import_jsx_runtime4.jsx)(CircuitPreview, { manifest: m }), kind === null && (0, import_jsx_runtime4.jsx)(Note, { children: "This is not a Block, Kit or Circuit manifest." })] });
 }
 
 // ../render-web/dist/index.js
 var HERO_TONE_CLASSES = {
-  default: "bg-background text-foreground",
+  default: "bg-background text-foreground bg-[radial-gradient(60rem_30rem_at_50%_-10%,color-mix(in_srgb,var(--blkc-color-primary,#0066cc)_16%,transparent),transparent)]",
   muted: "bg-muted text-foreground",
   accent: "bg-accent text-accent-foreground",
   inverse: "bg-foreground text-background"
@@ -68035,21 +68425,21 @@ function HeroBlock({ props: p2, className, style }) {
   const ctaJustify = alignment === "center" ? "justify-center" : alignment === "right" ? "justify-end" : "justify-start";
   const toneClass = HERO_TONE_CLASSES[tone] ?? HERO_TONE_CLASSES.default;
   const scale = HERO_SIZE_CLASSES[size] ?? HERO_SIZE_CLASSES.md;
-  const ctaClass = (variant = "primary") => clsx("inline-flex items-center justify-center gap-2 rounded-md px-6 py-3 text-base font-semibold transition-colors", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", variant === "secondary" ? "bg-secondary text-secondary-foreground hover:bg-secondary/80" : variant === "outline" ? "border border-input bg-background text-foreground hover:bg-accent hover:text-accent-foreground" : "bg-primary text-primary-foreground hover:bg-primary/90");
-  return (0, import_jsx_runtime4.jsxs)("section", { className: clsx("blkc-hero relative flex w-full flex-col justify-center px-4", scale.section, toneClass, alignClass, className), style: {
+  const ctaClass = (variant = "primary") => clsx("inline-flex items-center justify-center gap-2 rounded-lg px-6 py-3 text-base font-semibold no-underline shadow-sm transition-all hover:-translate-y-0.5 hover:shadow-md", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", variant === "secondary" ? "bg-secondary text-secondary-foreground hover:bg-secondary/80" : variant === "outline" ? "border border-border bg-background text-foreground hover:bg-muted" : "bg-primary text-primary-foreground hover:bg-primary/90");
+  return (0, import_jsx_runtime5.jsxs)("section", { className: clsx("blkc-hero relative flex w-full flex-col justify-center px-6", scale.section, toneClass, alignClass, className), style: {
     padding,
     minHeight,
     backgroundColor: backgroundColor || void 0,
     color: textColor || void 0,
     ...style
-  }, children: [image && (0, import_jsx_runtime4.jsx)("div", { className: "w-full max-w-5xl", children: (0, import_jsx_runtime4.jsx)("img", { src: image.src, alt: image.alt || heading, className: "h-auto w-full rounded-lg object-cover" }) }), (0, import_jsx_runtime4.jsxs)("div", { className: clsx("flex w-full max-w-3xl flex-col", scale.gap), children: [eyebrow && (0, import_jsx_runtime4.jsx)("p", { className: clsx("font-medium uppercase tracking-wide", scale.eyebrow), children: eyebrow }), (0, import_jsx_runtime4.jsx)("h1", { className: clsx("font-bold leading-tight tracking-tight", scale.heading), children: heading }), subheading && (0, import_jsx_runtime4.jsx)("p", { className: clsx("text-muted-foreground", scale.subheading), children: subheading }), (cta || secondaryCta) && (0, import_jsx_runtime4.jsxs)("div", { className: clsx("flex flex-wrap items-center gap-3", ctaJustify), children: [cta && (0, import_jsx_runtime4.jsx)("a", { href: normalizeUrl(cta.href), className: ctaClass(cta.variant), target: cta.target || "_self", rel: cta.target === "_blank" ? "noopener noreferrer" : void 0, children: cta.label }), secondaryCta && (0, import_jsx_runtime4.jsx)("a", { href: normalizeUrl(secondaryCta.href), className: ctaClass(secondaryCta.variant ?? "outline"), target: secondaryCta.target || "_self", rel: secondaryCta.target === "_blank" ? "noopener noreferrer" : void 0, children: secondaryCta.label })] })] })] });
+  }, children: [image && (0, import_jsx_runtime5.jsx)("div", { className: "w-full max-w-5xl", children: (0, import_jsx_runtime5.jsx)("img", { src: image.src, alt: image.alt || heading, className: "h-auto w-full rounded-lg object-cover" }) }), (0, import_jsx_runtime5.jsxs)("div", { className: clsx("flex w-full max-w-3xl flex-col", scale.gap), children: [eyebrow && (0, import_jsx_runtime5.jsx)("p", { className: clsx("w-fit rounded-full border border-border bg-muted px-3 py-1 font-semibold uppercase tracking-wide", alignment === "center" && "mx-auto", alignment === "right" && "ml-auto", scale.eyebrow), children: eyebrow }), (0, import_jsx_runtime5.jsx)("h1", { className: clsx("blkc-heading font-bold leading-[1.1] tracking-tight text-balance", scale.heading), children: heading }), subheading && (0, import_jsx_runtime5.jsx)("p", { className: clsx("text-muted-foreground text-pretty", scale.subheading), children: subheading }), (cta || secondaryCta) && (0, import_jsx_runtime5.jsxs)("div", { className: clsx("flex flex-wrap items-center gap-3", ctaJustify), children: [cta && (0, import_jsx_runtime5.jsx)("a", { href: normalizeUrl(cta.href), className: ctaClass(cta.variant), target: cta.target || "_self", rel: cta.target === "_blank" ? "noopener noreferrer" : void 0, children: cta.label }), secondaryCta && (0, import_jsx_runtime5.jsx)("a", { href: normalizeUrl(secondaryCta.href), className: ctaClass(secondaryCta.variant ?? "outline"), target: secondaryCta.target || "_self", rel: secondaryCta.target === "_blank" ? "noopener noreferrer" : void 0, children: secondaryCta.label })] })] })] });
 }
 function TextBlock({ props: p2, className, style }) {
   const { content, tag = "p", color, backgroundColor, fontSize, fontWeight, textAlign, margin, padding } = p2;
   const alignClass = textAlign === "left" ? "text-left" : textAlign === "right" ? "text-right" : textAlign === "center" ? "text-center" : void 0;
   const safeTag = ["p", "div", "span", "h1", "h2", "h3", "h4", "h5", "h6"].includes(tag) ? tag : "div";
   const SafeTag = safeTag;
-  return (0, import_jsx_runtime4.jsx)(SafeTag, { className: clsx("blkc-text leading-relaxed", alignClass, className), style: {
+  return (0, import_jsx_runtime5.jsx)(SafeTag, { className: clsx("blkc-text mx-auto w-full max-w-3xl px-6 py-8 text-lg leading-relaxed text-pretty [&_a]:font-medium [&_a]:text-primary [&_a]:underline [&_a]:underline-offset-4 [&_p+p]:mt-4", alignClass, className), style: {
     margin,
     padding,
     color: color || void 0,
@@ -68064,35 +68454,35 @@ function ImageBlock({ props: p2, className, style }) {
   const { src, alt, width, height, objectFit = "cover", borderRadius, caption, link, alignment = "center" } = p2;
   const alignClass = alignment === "left" ? "mr-auto" : alignment === "right" ? "ml-auto" : "mx-auto";
   const imageUrl = normalizeUrl(src);
-  const imageElement = (0, import_jsx_runtime4.jsx)("img", { src: imageUrl, alt, className: "blkc-image-img block h-auto max-w-full", style: {
+  const imageElement = (0, import_jsx_runtime5.jsx)("img", { src: imageUrl, alt, className: "blkc-image-img block h-auto max-w-full rounded-xl border border-border shadow-md", style: {
     width: width || "100%",
     height: height || "auto",
     objectFit,
     borderRadius: borderRadius || void 0,
     ...style
   } });
-  const content = link ? (0, import_jsx_runtime4.jsx)("a", { href: normalizeUrl(link), className: "blkc-image-link inline-block", target: "_blank", rel: "noopener noreferrer", children: imageElement }) : imageElement;
-  return (0, import_jsx_runtime4.jsxs)("figure", { className: clsx("blkc-image flex w-full flex-col gap-2", alignClass, className), children: [(0, import_jsx_runtime4.jsx)("div", { className: "blkc-image-wrapper w-full", children: content }), caption && (0, import_jsx_runtime4.jsx)("figcaption", { className: "blkc-image-caption text-sm text-muted-foreground", children: caption })] });
+  const content = link ? (0, import_jsx_runtime5.jsx)("a", { href: normalizeUrl(link), className: "blkc-image-link inline-block", target: "_blank", rel: "noopener noreferrer", children: imageElement }) : imageElement;
+  return (0, import_jsx_runtime5.jsxs)("figure", { className: clsx("blkc-image flex w-full max-w-5xl flex-col gap-3 px-6 py-8", alignClass, className), children: [(0, import_jsx_runtime5.jsx)("div", { className: "blkc-image-wrapper w-full", children: content }), caption && (0, import_jsx_runtime5.jsx)("figcaption", { className: "blkc-image-caption text-center text-sm text-muted-foreground", children: caption })] });
 }
 function ButtonBlock({ props: p2, className, style }) {
   const { label, href, variant = "primary", size = "md", alignment = "center", target = "_self", icon, iconPosition = "left" } = p2;
   const hrefUrl = normalizeUrl(href);
   const isExternal = isExternalUrl(hrefUrl);
-  const sizeClass = size === "sm" ? "px-3 py-1.5 text-sm" : size === "lg" ? "px-6 py-3 text-lg" : "px-4 py-2 text-base";
-  const variantClass = variant === "secondary" ? "bg-secondary text-secondary-foreground hover:bg-secondary/80" : variant === "outline" ? "border border-input bg-background hover:bg-accent hover:text-accent-foreground" : variant === "ghost" ? "hover:bg-accent hover:text-accent-foreground" : variant === "link" ? "text-primary underline-offset-4 hover:underline" : "bg-primary text-primary-foreground hover:bg-primary/90";
-  return (0, import_jsx_runtime4.jsx)("div", { className: clsx("flex", alignment === "left" ? "justify-start" : alignment === "right" ? "justify-end" : "justify-center"), children: (0, import_jsx_runtime4.jsxs)("a", { href: hrefUrl || "#", className: clsx("blkc-button inline-flex items-center justify-center gap-2 rounded-md font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50", sizeClass, variantClass, className), style, target, rel: isExternal ? "noopener noreferrer" : void 0, children: [icon && iconPosition === "left" && (0, import_jsx_runtime4.jsx)("span", { className: "blkc-button-icon blkc-button-icon-left", children: icon }), (0, import_jsx_runtime4.jsx)("span", { className: "blkc-button-label", children: label }), icon && iconPosition === "right" && (0, import_jsx_runtime4.jsx)("span", { className: "blkc-button-icon blkc-button-icon-right", children: icon })] }) });
+  const sizeClass = size === "sm" ? "px-3 py-1.5 text-sm" : size === "lg" ? "px-7 py-3.5 text-lg" : "px-5 py-2.5 text-base";
+  const variantClass = variant === "secondary" ? "bg-secondary text-secondary-foreground hover:bg-secondary/80" : variant === "outline" ? "border border-border bg-background text-foreground hover:bg-muted" : variant === "ghost" ? "text-foreground hover:bg-muted" : variant === "link" ? "text-primary underline-offset-4 hover:underline" : "bg-primary text-primary-foreground hover:bg-primary/90";
+  return (0, import_jsx_runtime5.jsx)("div", { className: clsx("flex px-6 py-4", alignment === "left" ? "justify-start" : alignment === "right" ? "justify-end" : "justify-center"), children: (0, import_jsx_runtime5.jsxs)("a", { href: hrefUrl || "#", className: clsx("blkc-button inline-flex items-center justify-center gap-2 rounded-lg font-semibold no-underline shadow-sm transition-all hover:-translate-y-0.5 hover:shadow-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50", sizeClass, variantClass, className), style, target, rel: isExternal ? "noopener noreferrer" : void 0, children: [icon && iconPosition === "left" && (0, import_jsx_runtime5.jsx)("span", { className: "blkc-button-icon blkc-button-icon-left", children: icon }), (0, import_jsx_runtime5.jsx)("span", { className: "blkc-button-label", children: label }), icon && iconPosition === "right" && (0, import_jsx_runtime5.jsx)("span", { className: "blkc-button-icon blkc-button-icon-right", children: icon })] }) });
 }
 function SectionBlock({ props: p2, className, style, children }) {
   const { backgroundColor, textColor, padding, margin, minHeight, alignment = "center" } = p2;
   const widthClass = alignment === "wide" ? "w-full max-w-blkc" : alignment === "full" ? "w-full" : "w-full";
-  return (0, import_jsx_runtime4.jsx)("section", { className: clsx("blkc-section text-foreground", widthClass, alignment === "wide" && "mx-auto", className), style: {
+  return (0, import_jsx_runtime5.jsx)("section", { className: clsx("blkc-section text-foreground", !padding && "px-6 py-16", widthClass, alignment === "wide" && "mx-auto", className), style: {
     padding,
     margin,
     minHeight,
     backgroundColor: backgroundColor || void 0,
     color: textColor || void 0,
     ...style
-  }, children: (0, import_jsx_runtime4.jsx)("div", { className: "blkc-section-content mx-auto flex w-full max-w-blkc flex-col gap-6", children }) });
+  }, children: (0, import_jsx_runtime5.jsxs)("div", { className: "blkc-section-content mx-auto flex w-full max-w-blkc flex-col gap-6", children: [p2.heading && (0, import_jsx_runtime5.jsx)("h2", { className: "blkc-heading text-3xl font-bold tracking-tight text-balance sm:text-4xl", children: p2.heading }), p2.content && (0, import_jsx_runtime5.jsx)("div", { className: "max-w-3xl text-lg leading-relaxed text-muted-foreground", dangerouslySetInnerHTML: { __html: richTextToHtml(p2.content) } }), children] }) });
 }
 var defaultRegistry = /* @__PURE__ */ new Map();
 function registerBlock(blockId, component, manifest) {
@@ -68123,6 +68513,7 @@ registerBlock("story", StoryBlock);
 registerBlock("values", ValuesBlock);
 registerBlock("cta", CtaBlock);
 registerBlock("contact", ContactBlock);
+registerBlock("office", OfficeBlock);
 function renderBlock(instance, options = {}) {
   const { block: blockId, props = {} } = instance;
   const { wrapperClassName, wrapperComponent: Wrapper, passThroughClassName = true, theme } = options;
@@ -68138,8 +68529,8 @@ function renderBlock(instance, options = {}) {
   const { component: Component } = entry;
   const themeStyle = theme && Object.keys(theme).length > 0 ? theme : void 0;
   try {
-    const rendered = Wrapper ? (0, import_jsx_runtime4.jsx)(Wrapper, { className: wrapperClassName, children: (0, import_jsx_runtime4.jsx)(Component, { props, className: passThroughClassName ? wrapperClassName : void 0 }) }) : (0, import_jsx_runtime4.jsx)("div", { className: wrapperClassName, children: (0, import_jsx_runtime4.jsx)(Component, { props, className: passThroughClassName ? wrapperClassName : void 0 }) });
-    const element = themeStyle ? (0, import_jsx_runtime4.jsx)("div", { style: themeStyle, children: rendered }) : rendered;
+    const rendered = Wrapper ? (0, import_jsx_runtime5.jsx)(Wrapper, { className: wrapperClassName, children: (0, import_jsx_runtime5.jsx)(Component, { props, className: passThroughClassName ? wrapperClassName : void 0 }) }) : (0, import_jsx_runtime5.jsx)("div", { className: wrapperClassName, children: (0, import_jsx_runtime5.jsx)(Component, { props, className: passThroughClassName ? wrapperClassName : void 0 }) });
+    const element = themeStyle ? (0, import_jsx_runtime5.jsx)("div", { style: themeStyle, children: rendered }) : rendered;
     return {
       element,
       blockId,
@@ -68169,7 +68560,7 @@ function renderBlocks(instances, options = {}) {
 }
 function renderPage(instances, options = {}) {
   const { elements } = renderBlocks(instances, options);
-  return (0, import_jsx_runtime4.jsx)("div", { className: "blkc-page", children: elements.map((element, index) => (0, import_jsx_runtime4.jsx)(import_react3.default.Fragment, { children: element }, index)) });
+  return (0, import_jsx_runtime5.jsx)("div", { className: "blkc-page", children: elements.map((element, index) => (0, import_jsx_runtime5.jsx)(import_react3.default.Fragment, { children: element }, index)) });
 }
 function getGlobalCSS(theme = DEFAULT_THEME) {
   const mergedTheme = mergeTheme(theme);
@@ -68213,42 +68604,51 @@ ${themeToCss(mergedTheme)}
 }
 
 // ../render-web/dist/server.js
-var import_jsx_runtime5 = __toESM(require_jsx_runtime(), 1);
+var import_jsx_runtime6 = __toESM(require_jsx_runtime(), 1);
 var import_react4 = __toESM(require_react(), 1);
 var import_server = __toESM(require_server_node(), 1);
 function renderManifestToHTML(manifest, options = {}) {
-  return (0, import_server.renderToStaticMarkup)((0, import_jsx_runtime5.jsx)(ManifestPreview, { manifest, page: options.page }));
+  return (0, import_server.renderToStaticMarkup)((0, import_jsx_runtime6.jsx)(ManifestPreview, { manifest, page: options.page }));
 }
 function escapeHtml2(value) {
   return value.replace(/[&<>"']/g, (c2) => `&#${c2.charCodeAt(0)};`).replace(/&#38;/g, "&amp;");
 }
-function themeFontLink(manifest) {
+function themeFontLinks(manifest) {
   const theme = manifest?.theme;
-  const family = theme?.settings?.typography?.fontFamilies?.[0]?.fontFamily;
-  const name = typeof family === "string" ? /^\s*['"]([^'"]+)['"]/.exec(family)?.[1] : void 0;
-  if (!name)
-    return "";
-  return `<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=${escapeHtml2(encodeURIComponent(name))}&amp;display=swap">`;
+  return (theme?.settings?.typography?.fontFamilies ?? []).slice(0, 2).map(({ fontFamily }) => {
+    const name = typeof fontFamily === "string" ? /^\s*['"]([^'"]+)['"]/.exec(fontFamily)?.[1] : void 0;
+    return name ? `<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=${escapeHtml2(encodeURIComponent(name))}&amp;display=swap">` : "";
+  }).join("");
+}
+function previewPolicy(nonce) {
+  return `<meta http-equiv="Content-Security-Policy" content="default-src 'none'; script-src 'nonce-${nonce}'; style-src 'unsafe-inline' https://fonts.googleapis.com; font-src https://fonts.gstatic.com; img-src * data:; base-uri 'self'">`;
 }
 function renderManifestDocument(manifest, options = {}) {
   const name = manifest?.name;
   const title3 = typeof name === "string" ? name : "BLKC preview";
+  const body = renderManifestToHTML(manifest, options);
+  const nonce = options.nonce ? ` nonce="${escapeHtml2(options.nonce)}"` : "";
+  const runtime = options.canvasRuntime && body.includes("data-blkc-canvas=") ? `<script${nonce}>${options.canvasRuntime.replace(/<\/script/gi, "<\\/script")}</script>` : "";
   return `<!doctype html>
 <html lang="${escapeHtml2(options.lang ?? "en")}">
 <head>
 <meta charset="utf-8">
+${options.nonce ? previewPolicy(escapeHtml2(options.nonce)) : ""}
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>${escapeHtml2(title3)}</title>
-${themeFontLink(manifest)}
+${themeFontLinks(manifest)}
 ${options.head ?? ""}
 </head>
-<body style="margin:0">${renderManifestToHTML(manifest, options)}</body>
+<body style="margin:0">${body}${runtime}</body>
 </html>
 `;
 }
 
 // ../render-web/dist/styles.css
-var styles_default = '/*! tailwindcss v4.3.4 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:block))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-outline-style:solid;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-500:oklch(63.7% .237 25.331);--color-white:#fff;--spacing:.25rem;--container-2xl:42rem;--container-3xl:48rem;--container-5xl:64rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--text-5xl:3rem;--text-5xl--line-height:1;--text-6xl:3.75rem;--text-6xl--line-height:1;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tight:-.025em;--tracking-wide:.025em;--leading-tight:1.25;--leading-relaxed:1.625;--radius-md:.375rem;--radius-lg:.5rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.visible{visibility:visible}.relative{position:relative}.static{position:static}.mx-auto{margin-inline:auto}.my-6{margin-block:calc(var(--spacing) * 6)}.mt-auto{margin-top:auto}.mr-auto{margin-right:auto}.ml-auto{margin-left:auto}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.h-auto{height:auto}.min-h-32{min-height:calc(var(--spacing) * 32)}.w-fit{width:fit-content}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-3xl{max-width:var(--container-3xl)}.max-w-5xl{max-width:var(--container-5xl)}.max-w-blkc{max-width:var(--blkc-max-width,1200px)}.max-w-full{max-width:100%}.min-w-40{min-width:calc(var(--spacing) * 40)}.flex-1{flex:1}.list-none{list-style-type:none}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-start{justify-content:flex-start}.gap-1{gap:var(--spacing)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-8{gap:calc(var(--spacing) * 8)}.gap-10{gap:calc(var(--spacing) * 10)}.overflow-x-auto{overflow-x:auto}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-border,.border-input{border-color:var(--blkc-color-border,#e0e0e0)}.bg-accent{background-color:var(--blkc-color-primary,#06c)}.bg-background{background-color:var(--blkc-color-background,#fff)}.bg-foreground{background-color:var(--blkc-color-text,#1a1a1a)}.bg-muted{background-color:var(--blkc-color-background,#fff)}.bg-primary{background-color:var(--blkc-color-primary,#06c)}.bg-red-500{background-color:var(--color-red-500)}.bg-secondary{background-color:var(--blkc-color-secondary,#6c757d)}.object-cover{object-fit:cover}.p-0{padding:0}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-1\\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-10{padding-block:calc(var(--spacing) * 10)}.py-16{padding-block:calc(var(--spacing) * 16)}.py-24{padding-block:calc(var(--spacing) * 24)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-tight{--tw-leading:var(--leading-tight);line-height:var(--leading-tight)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-accent-foreground,.text-background{color:var(--blkc-color-background,#fff)}.text-foreground{color:var(--blkc-color-text,#1a1a1a)}.text-muted-foreground{color:var(--blkc-color-text-secondary,#6c757d)}.text-primary{color:var(--blkc-color-primary,#06c)}.text-primary-foreground,.text-secondary-foreground{color:var(--blkc-color-background,#fff)}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.italic{font-style:italic}.not-italic{font-style:normal}.underline{text-decoration-line:underline}.underline-offset-4{text-underline-offset:4px}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}@media (hover:hover){.hover\\:bg-accent:hover,.hover\\:bg-primary\\/90:hover{background-color:var(--blkc-color-primary,#06c)}@supports (color:color-mix(in lab, red, red)){.hover\\:bg-primary\\/90:hover{background-color:color-mix(in oklab, var(--blkc-color-primary,#06c) 90%, transparent)}}.hover\\:bg-secondary\\/80:hover{background-color:var(--blkc-color-secondary,#6c757d)}@supports (color:color-mix(in lab, red, red)){.hover\\:bg-secondary\\/80:hover{background-color:color-mix(in oklab, var(--blkc-color-secondary,#6c757d) 80%, transparent)}}.hover\\:text-accent-foreground:hover{color:var(--blkc-color-background,#fff)}.hover\\:underline:hover{text-decoration-line:underline}}.focus-visible\\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\\:ring-ring:focus-visible{--tw-ring-color:var(--blkc-color-primary,#06c)}.focus-visible\\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.disabled\\:pointer-events-none:disabled{pointer-events:none}.disabled\\:opacity-50:disabled{opacity:.5}@media (min-width:40rem){.sm\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\\:py-20{padding-block:calc(var(--spacing) * 20)}.sm\\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.sm\\:text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.sm\\:text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.sm\\:text-6xl{font-size:var(--text-6xl);line-height:var(--tw-leading,var(--text-6xl--line-height))}.sm\\:text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.sm\\:text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}}@media (min-width:48rem){.md\\:order-2{order:2}.md\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:64rem){.lg\\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}}.blkc-page{background-color:var(--blkc-color-background,#fff);min-height:100vh;color:var(--blkc-color-text,#1a1a1a);font-family:var(--blkc-font-family,system-ui, sans-serif)}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}';
+var styles_default = '/*! tailwindcss v4.3.4 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:block))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-500:oklch(63.7% .237 25.331);--color-amber-300:oklch(87.9% .169 91.605);--color-amber-500:oklch(76.9% .188 70.08);--color-yellow-400:oklch(85.2% .199 91.936);--color-emerald-400:oklch(76.5% .177 163.223);--color-emerald-500:oklch(69.6% .17 162.48);--color-sky-400:oklch(74.6% .16 232.661);--color-sky-500:oklch(68.5% .169 237.323);--color-violet-500:oklch(60.6% .25 292.717);--color-zinc-400:oklch(70.5% .015 286.067);--color-white:#fff;--spacing:.25rem;--container-2xl:42rem;--container-3xl:48rem;--container-5xl:64rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--text-5xl:3rem;--text-5xl--line-height:1;--text-6xl:3.75rem;--text-6xl--line-height:1;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tight:-.025em;--tracking-wide:.025em;--leading-relaxed:1.625;--radius-sm:.25rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.visible{visibility:visible}.relative{position:relative}.static{position:static}.m-0{margin:0}.mx-auto{margin-inline:auto}.my-6{margin-block:calc(var(--spacing) * 6)}.mt-1{margin-top:var(--spacing)}.mt-1\\.5{margin-top:calc(var(--spacing) * 1.5)}.mt-auto{margin-top:auto}.mr-auto{margin-right:auto}.ml-auto{margin-left:auto}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.aspect-\\[26\\/17\\]{aspect-ratio:26/17}.size-2\\.5{width:calc(var(--spacing) * 2.5);height:calc(var(--spacing) * 2.5)}.size-3{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.h-2{height:calc(var(--spacing) * 2)}.h-auto{height:auto}.h-full{height:100%}.min-h-32{min-height:calc(var(--spacing) * 32)}.w-fit{width:fit-content}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-3xl{max-width:var(--container-3xl)}.max-w-5xl{max-width:var(--container-5xl)}.max-w-blkc{max-width:var(--blkc-max-width,1200px)}.max-w-full{max-width:100%}.min-w-0{min-width:0}.min-w-40{min-width:calc(var(--spacing) * 40)}.flex-1{flex:1}.shrink-0{flex-shrink:0}.cursor-pointer{cursor:pointer}.touch-manipulation{touch-action:manipulation}.list-none{list-style-type:none}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-start{justify-content:flex-start}.gap-1{gap:var(--spacing)}.gap-1\\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-8{gap:calc(var(--spacing) * 8)}.gap-10{gap:calc(var(--spacing) * 10)}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-full{border-radius:2147483647px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-border{border-color:var(--blkc-color-border,var(--blkc-color-text,#1a1a1a))}@supports (color:color-mix(in lab, red, red)){.border-border{border-color:var(--blkc-color-border,color-mix(in srgb, var(--blkc-color-text,#1a1a1a) 16%, var(--blkc-color-background,#fff)))}}.bg-accent{background-color:var(--blkc-color-accent,var(--blkc-color-primary,#06c))}.bg-accent-foreground{background-color:var(--blkc-color-background,#fff)}.bg-amber-300{background-color:var(--color-amber-300)}.bg-amber-500{background-color:var(--color-amber-500)}.bg-background{background-color:var(--blkc-color-background,#fff)}.bg-emerald-400{background-color:var(--color-emerald-400)}.bg-emerald-500{background-color:var(--color-emerald-500)}.bg-foreground{background-color:var(--blkc-color-text,#1a1a1a)}.bg-muted{background-color:var(--blkc-color-surface,var(--blkc-color-text,#1a1a1a))}@supports (color:color-mix(in lab, red, red)){.bg-muted{background-color:var(--blkc-color-surface,color-mix(in srgb, var(--blkc-color-text,#1a1a1a) 6%, var(--blkc-color-background,#fff)))}}.bg-primary{background-color:var(--blkc-color-primary,#06c)}.bg-red-500{background-color:var(--color-red-500)}.bg-secondary{background-color:var(--blkc-color-secondary,#6c757d)}.bg-sky-400{background-color:var(--color-sky-400)}.bg-sky-500{background-color:var(--color-sky-500)}.bg-violet-500{background-color:var(--color-violet-500)}.bg-yellow-400{background-color:var(--color-yellow-400)}.bg-zinc-400{background-color:var(--color-zinc-400)}.bg-\\[radial-gradient\\(60rem_30rem_at_50\\%_-10\\%\\,color-mix\\(in_srgb\\,var\\(--blkc-color-primary\\,\\#0066cc\\)_16\\%\\,transparent\\)\\,transparent\\)\\]{background-image:radial-gradient(60rem 30rem at 50% -10%,var(--blkc-color-primary,#06c),transparent)}@supports (color:color-mix(in lab, red, red)){.bg-\\[radial-gradient\\(60rem_30rem_at_50\\%_-10\\%\\,color-mix\\(in_srgb\\,var\\(--blkc-color-primary\\,\\#0066cc\\)_16\\%\\,transparent\\)\\,transparent\\)\\]{background-image:radial-gradient(60rem 30rem at 50% -10%,color-mix(in srgb,var(--blkc-color-primary,#06c) 16%,transparent),transparent)}}.object-cover{object-fit:cover}.p-0{padding:0}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.px-7{padding-inline:calc(var(--spacing) * 7)}.py-1{padding-block:var(--spacing)}.py-1\\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-3\\.5{padding-block:calc(var(--spacing) * 3.5)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-10{padding-block:calc(var(--spacing) * 10)}.py-14{padding-block:calc(var(--spacing) * 14)}.py-16{padding-block:calc(var(--spacing) * 16)}.py-24{padding-block:calc(var(--spacing) * 24)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-\\[1\\.1\\]{--tw-leading:1.1;line-height:1.1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-balance{text-wrap:balance}.text-pretty{text-wrap:pretty}.text-accent{color:var(--blkc-color-accent,var(--blkc-color-primary,#06c))}.text-accent-foreground,.text-background{color:var(--blkc-color-background,#fff)}.text-foreground{color:var(--blkc-color-text,#1a1a1a)}.text-inherit{color:inherit}.text-muted-foreground{color:var(--blkc-color-text-secondary,#6c757d)}.text-primary{color:var(--blkc-color-primary,#06c)}.text-primary-foreground,.text-secondary-foreground{color:var(--blkc-color-background,#fff)}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.italic{font-style:italic}.not-italic{font-style:normal}.line-through{text-decoration-line:line-through}.no-underline{text-decoration-line:none}.underline{text-decoration-line:underline}.underline-offset-4{text-underline-offset:4px}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.\\[image-rendering\\:pixelated\\]{image-rendering:pixelated}@media (hover:hover){.hover\\:-translate-y-0\\.5:hover{--tw-translate-y:calc(var(--spacing) * -.5);translate:var(--tw-translate-x) var(--tw-translate-y)}.hover\\:bg-muted:hover{background-color:var(--blkc-color-surface,var(--blkc-color-text,#1a1a1a))}@supports (color:color-mix(in lab, red, red)){.hover\\:bg-muted:hover{background-color:var(--blkc-color-surface,color-mix(in srgb, var(--blkc-color-text,#1a1a1a) 6%, var(--blkc-color-background,#fff)))}}.hover\\:bg-primary\\/90:hover{background-color:var(--blkc-color-primary,#06c)}@supports (color:color-mix(in lab, red, red)){.hover\\:bg-primary\\/90:hover{background-color:color-mix(in oklab, var(--blkc-color-primary,#06c) 90%, transparent)}}.hover\\:bg-secondary\\/80:hover{background-color:var(--blkc-color-secondary,#6c757d)}@supports (color:color-mix(in lab, red, red)){.hover\\:bg-secondary\\/80:hover{background-color:color-mix(in oklab, var(--blkc-color-secondary,#6c757d) 80%, transparent)}}.hover\\:underline:hover{text-decoration-line:underline}.hover\\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.hover\\:shadow-md:hover{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}}.focus-visible\\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\\:ring-ring:focus-visible{--tw-ring-color:var(--blkc-color-primary,#06c)}.focus-visible\\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.disabled\\:pointer-events-none:disabled{pointer-events:none}.disabled\\:cursor-default:disabled{cursor:default}.disabled\\:opacity-50:disabled{opacity:.5}.aria-pressed\\:border-primary[aria-pressed=true]{border-color:var(--blkc-color-primary,#06c)}.aria-pressed\\:bg-muted[aria-pressed=true]{background-color:var(--blkc-color-surface,var(--blkc-color-text,#1a1a1a))}@supports (color:color-mix(in lab, red, red)){.aria-pressed\\:bg-muted[aria-pressed=true]{background-color:var(--blkc-color-surface,color-mix(in srgb, var(--blkc-color-text,#1a1a1a) 6%, var(--blkc-color-background,#fff)))}}@media (min-width:40rem){.sm\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\\:py-20{padding-block:calc(var(--spacing) * 20)}.sm\\:py-24{padding-block:calc(var(--spacing) * 24)}.sm\\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.sm\\:text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.sm\\:text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.sm\\:text-6xl{font-size:var(--text-6xl);line-height:var(--tw-leading,var(--text-6xl--line-height))}.sm\\:text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.sm\\:text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}}@media (min-width:48rem){.md\\:order-2{order:2}.md\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:64rem){.lg\\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\\:grid-cols-\\[minmax\\(0\\,1fr\\)_20rem\\]{grid-template-columns:minmax(0,1fr) 20rem}}.\\[\\&_a\\]\\:font-medium a{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.\\[\\&_a\\]\\:text-primary a{color:var(--blkc-color-primary,#06c)}.\\[\\&_a\\]\\:underline a{text-decoration-line:underline}.\\[\\&_a\\]\\:underline-offset-4 a{text-underline-offset:4px}.\\[\\&_p\\+p\\]\\:mt-4 p+p{margin-top:calc(var(--spacing) * 4)}.\\[\\&_strong\\]\\:text-foreground strong{color:var(--blkc-color-text,#1a1a1a)}.\\[\\&\\>\\*\\]\\:rounded-xl>*{border-radius:var(--radius-xl)}.\\[\\&\\>\\*\\]\\:border>*{border-style:var(--tw-border-style);border-width:1px}.\\[\\&\\>\\*\\]\\:border-border>*{border-color:var(--blkc-color-border,var(--blkc-color-text,#1a1a1a))}@supports (color:color-mix(in lab, red, red)){.\\[\\&\\>\\*\\]\\:border-border>*{border-color:var(--blkc-color-border,color-mix(in srgb, var(--blkc-color-text,#1a1a1a) 16%, var(--blkc-color-background,#fff)))}}.\\[\\&\\>\\*\\]\\:bg-muted>*{background-color:var(--blkc-color-surface,var(--blkc-color-text,#1a1a1a))}@supports (color:color-mix(in lab, red, red)){.\\[\\&\\>\\*\\]\\:bg-muted>*{background-color:var(--blkc-color-surface,color-mix(in srgb, var(--blkc-color-text,#1a1a1a) 6%, var(--blkc-color-background,#fff)))}}.\\[\\&\\>\\*\\]\\:p-6>*{padding:calc(var(--spacing) * 6)}.\\[\\&\\>\\*\\]\\:font-medium>*{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.\\[\\&\\>\\*\\]\\:shadow-sm>*{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}}.blkc-page{background-color:var(--blkc-color-background,#fff);min-height:100vh;color:var(--blkc-color-text,#1a1a1a);font-family:var(--blkc-font-family,system-ui, sans-serif)}.blkc-heading{font-family:var(--blkc-font-family-heading,inherit)}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}';
+
+// ../render-canvas/dist/runtime.txt
+var runtime_default = '"use strict";(()=>{var E={desk:{w:3,h:2,spot:{x:1,y:2}},coffee:{w:2,h:1,spot:{x:0,y:1}},water:{w:1,h:1,spot:{x:0,y:1}},sofa:{w:3,h:1,spot:{x:1,y:1}},plant:{w:1,h:1},board:{w:4,h:1,spot:{x:1,y:1}},shelf:{w:2,h:1,spot:{x:0,y:1}},server:{w:1,h:1},table:{w:3,h:2,spot:{x:1,y:2}},rug:{w:4,h:3,solid:!1}},ct=["working","thinking","blocked","reviewing","idle","done","away"],ut=["todo","doing","done"],dt=["wood","carpet","tile"],C={cols:26,rows:17,rooms:[{id:"studio",name:"Studio",x:1,y:3,w:15,h:13,floor:"wood"},{id:"lounge",name:"Lounge",x:17,y:3,w:8,h:6,floor:"carpet"},{id:"quests",name:"Quests",x:17,y:10,w:8,h:6,floor:"tile"}],doors:[{x:16,y:6},{x:16,y:13},{x:23,y:9}],furniture:[{type:"desk",x:2,y:4},{type:"desk",x:7,y:4},{type:"desk",x:12,y:4},{type:"desk",x:2,y:10},{type:"desk",x:7,y:10},{type:"desk",x:12,y:10},{type:"plant",x:1,y:8},{type:"plant",x:15,y:8},{type:"server",x:15,y:15},{type:"server",x:14,y:15},{type:"shelf",x:1,y:15},{type:"coffee",x:19,y:3},{type:"water",x:21,y:3},{type:"sofa",x:22,y:3},{type:"rug",x:20,y:5},{type:"plant",x:24,y:8},{type:"board",x:19,y:10},{type:"table",x:19,y:13},{type:"plant",x:24,y:15}]},A=(t,e)=>typeof t=="number"&&Number.isFinite(t)?Math.floor(t):e,w=(t,e=120)=>typeof t=="string"?t.slice(0,e):"",S=(t,e)=>Array.isArray(t)?t.slice(0,e):[];function V(t){let e=2166136261;for(let n=0;n<t.length;n++)e=Math.imul(e^t.charCodeAt(n),16777619);return e>>>0}var Y=["#2b1b12","#5a3a22","#a8622d","#d9b36c","#20242e","#7d2f3f","#4a5568","#e5e7eb"],Q=["#f4d3b5","#e8b98f","#c98d62","#9c6644","#6f4530","#4e2f20"],J=["#3b82f6","#ef4444","#10b981","#f59e0b","#8b5cf6","#ec4899","#14b8a6","#f97316"],_=(t,e)=>typeof t=="string"&&/^#[0-9a-f]{3,8}$/i.test(t)?t:e,F=(t,e,n)=>n*t.cols+e;function R(t,e,n){return e>=0&&n>=0&&e<t.cols&&n<t.rows&&t.walkable[F(t,e,n)]===!0}function Z(t,e,n){if(!R(t,n.x,n.y))return null;if(e.x===n.x&&e.y===n.y)return[];let i=new Int32Array(t.cols*t.rows).fill(-1),r=F(t,e.x,e.y);i[r]=r;let s=[r];for(let o=0;o<s.length;o++){let a=s[o],u=a%t.cols,l=Math.floor(a/t.cols);if(u===n.x&&l===n.y){let h=[];for(let p=a;p!==r;p=i[p])h.unshift({x:p%t.cols,y:Math.floor(p/t.cols)});return h}for(let[h,p]of[[0,1],[0,-1],[1,0],[-1,0]]){let x=u+h,k=l+p;if(!R(t,x,k))continue;let M=F(t,x,k);i[M]===-1&&(i[M]=a,s.push(M))}}return null}function tt(t,e){let n=w(t?.id,60)||`agent-${e+1}`,i=V(n),r=ct.includes(t?.state)?t.state:"idle";return{id:n,name:w(t?.name,24)||n,role:w(t?.role,40),state:r,task:w(t?.task,120),hair:_(t?.hair,Y[i%Y.length]),skin:_(t?.skin,Q[(i>>>4)%Q.length]),shirt:_(t?.shirt,J[(i>>>8)%J.length]),x:0,y:0,path:[],facing:"down",walking:!1,rest:0,seed:i}}function et(t){return{title:w(t?.title,80),state:ut.includes(t?.state)?t.state:"todo",agent:w(t?.agent,60)}}function B(t={}){let e=Array.isArray(t?.rooms)&&t.rooms.length>0,n=Math.min(Math.max(A(t?.cols,e?20:C.cols),6),64),i=Math.min(Math.max(A(t?.rows,e?14:C.rows),6),40),r=e?S(t.rooms,40):C.rooms,s=e?S(t.doors,60):C.doors,o=Array.isArray(t?.furniture)?S(t.furniture,300):e?[]:C.furniture,a=r.map(c=>{let b=Math.min(Math.max(A(c?.x,0),0),n),y=Math.min(Math.max(A(c?.y,0),0),i);return{name:w(c?.name,24),x:b,y,w:Math.min(Math.max(A(c?.w,0),0),n-b),h:Math.min(Math.max(A(c?.h,0),0),i-y),floor:dt.includes(c?.floor)?c.floor:"wood"}}),u=new Array(n*i).fill(!1),l=(c,b,y)=>{c>=0&&b>=0&&c<n&&b<i&&(u[b*n+c]=y)};for(let c of a)for(let b=c.y;b<c.y+c.h;b++)for(let y=c.x;y<c.x+c.w;y++)l(y,b,!0);let h=s.map(c=>({x:A(c?.x,-1),y:A(c?.y,-1)})).filter(c=>c.x>=0&&c.y>=0);for(let c of h)l(c.x,c.y,!0);let p=o.filter(c=>c&&Object.hasOwn(E,c.type)).map(c=>({type:c.type,x:A(c.x,-99),y:A(c.y,-99)}));for(let c of p){let b=E[c.type];if(b.solid!==!1)for(let y=c.y;y<c.y+b.h;y++)for(let T=c.x;T<c.x+b.w;T++)l(T,y,!1)}let x={cols:n,rows:i,rooms:a,doors:h,furniture:p,walkable:u,agents:S(t?.agents,40).map(tt),tasks:S(t?.tasks,60).map(et),spots:{lounge:[],board:[]}},k=c=>{let b=E[c.type].spot;if(!b)return;let y={x:c.x+b.x,y:c.y+b.y};return R(x,y.x,y.y)?y:void 0},M=p.filter(c=>c.type==="desk").map(k).filter(c=>!!c);for(let c of p){let b=k(c);b&&((c.type==="coffee"||c.type==="sofa"||c.type==="water"||c.type==="shelf")&&x.spots.lounge.push(b),(c.type==="board"||c.type==="table")&&x.spots.board.push(b))}return x.agents.forEach((c,b)=>{c.seat=M[b],nt(x,c)}),x}function ht(t){for(let e=0;e<t.rows;e++)for(let n=0;n<t.cols;n++)if(R(t,n,e))return{x:n,y:e};return{x:0,y:0}}function I(t,e){let n=i=>i.length>0?i[(e.seed+Math.floor(e.rest*1e3))%i.length]:void 0;switch(e.state){case"working":case"thinking":case"blocked":return e.seat??n(t.spots.lounge);case"reviewing":return n(t.spots.board)??e.seat;case"idle":case"done":return n(t.spots.lounge)??e.seat;default:return}}function nt(t,e){let n=I(t,e)??e.seat??ht(t);e.x=n.x,e.y=n.y,e.path=[],e.walking=!1,e.facing=O(e)?"up":"down",e.rest=2+e.seed%50/10}var O=t=>(t.state==="working"||t.state==="thinking"||t.state==="blocked")&&t.seat!==void 0&&t.seat.x===t.x&&t.seat.y===t.y&&t.path.length===0;function ot(t,e,n){if(!n)return;let i={x:Math.round(e.x),y:Math.round(e.y)};e.path=Z(t,i,n)??[]}function D(t,e){for(let n of t.agents)if(n.state!=="away"){if(n.path.length>0){let i=n.path[0],r=i.x-n.x,s=i.y-n.y,o=Math.hypot(r,s),a=3.2*e;Math.abs(r)>Math.abs(s)?n.facing=r>0?"right":"left":s!==0&&(n.facing=s>0?"down":"up"),n.walking=!0,o<=a?(n.x=i.x,n.y=i.y,n.path.shift()):(n.x+=r/o*a,n.y+=s/o*a);continue}n.walking=!1,n.state==="idle"&&(n.rest-=e,n.rest<=0&&(n.seed=V(String(n.seed)),n.rest=3+n.seed%60/10,ot(t,n,I(t,n)))),O(n)&&(n.facing="up")}}function P(t,e){if(Array.isArray(e.tasks)&&(t.tasks=S(e.tasks,60).map(et)),!Array.isArray(e.agents))return;let n=new Map(t.agents.map(r=>[r.id,r])),i=t.furniture.filter(r=>r.type==="desk").map(r=>({x:r.x+1,y:r.y+2})).filter(r=>R(t,r.x,r.y));t.agents=S(e.agents,40).map((r,s)=>{let o=tt(r,s),a=n.get(o.id);return o.seat=i[s],a?(Object.assign(a,{name:o.name,role:o.role,task:o.task,hair:o.hair,skin:o.skin,shirt:o.shirt,seat:o.seat}),a.state!==o.state&&(a.state=o.state,o.state!=="away"&&ot(t,a,I(t,a))),a):(nt(t,o),o)})}function L(t,e,n){let i,r=1/0;for(let s of t.agents){if(s.state==="away")continue;let o=e-(s.x+.5),a=n-(s.y+.1),u=Math.hypot(o,a);Math.abs(o)<.8&&a>-1.6&&a<1.1&&u<r&&(i=s,r=u)}return i}var d=16,f=(t,e,n,i,r,s)=>{t.fillStyle=e,t.fillRect(Math.round(n),Math.round(i),r,s)},bt=["...hhhhhh...","..hhhhhhhh..","..hhhhhhhh..","..hssssssh..","..ssessess..","..ssssssss..","...ssssss..."],pt=["...hhhhhh...","..hhhhhhhh..","..hhhhhhhh..","..hhhhhhhh..","..hhhhhhhh..","..hhhhhhhh..","...ssssss..."],yt=["...hhhhhh...","..hhhhhhhh..","..hhhhhhhh..","..hhssssss..","..hhsssess..","..hsssssss..","...ssssss..."],mt=["..tttttttt..",".tttttttttt.",".stttttttts.",".stTTTTTTts."],xt=["...tttttt...","...tttttt...","...ttsttt...","...TTsTTT..."],gt=["..llllllll..","..lll..lll..","..lll..lll..","..bbb..bbb.."],kt=["..llllllll..","..lll..lll..","..bbb..lll..",".......bbb.."],Mt=["..llllllll..","..lll..lll..","..lll..bbb..","..bbb......."],At=["...llllll...","...lll.lll..","...lll.lll..","...bbb.bbb.."],St=["...llllll...","..lll..lll..",".lll....lll.",".bb......bb."],wt=["...llllll...","...llllll...","....llll....","....bbbb...."];function $(t,e,n,i,r,s=!1){e.forEach((o,a)=>{for(let u=0;u<o.length;u++){let l=o[s?o.length-1-u:u],h=r[l];h&&f(t,h,n+u,i+a,1,1)}})}function Tt(t,e){let n=parseInt(t.slice(1).padEnd(6,t.slice(-1)),16),i=r=>Math.max(0,Math.min(255,(n>>r&255)+e));return`rgb(${i(16)},${i(8)},${i(0)})`}function vt(t,e,n,i){let r=e.x*d+2,s=O(e),o={h:e.hair,s:e.skin,e:"#1a1a24",t:e.shirt,T:Tt(e.shirt,-36),l:"#39415a",b:"#1f2433"},a=Math.floor(n*8+e.seed)%2===0,u=!e.walking&&Math.floor(n*1.5+e.seed%7)%2===0?1:0,l=s?11:15,h=e.y*d+(s?6:-1)-(e.walking&&a?1:0);s&&(f(t,"#1f2937",r+1,e.y*d+3,10,9),f(t,"#374151",r+2,e.y*d+11,8,3),f(t,"#111827",r+5,e.y*d+14,2,2)),t.fillStyle="rgba(0,0,0,0.25)",t.fillRect(Math.round(r+2),Math.round(e.y*d+14),8,2),i&&(t.fillStyle="rgba(255,255,255,0.28)",t.fillRect(Math.round(r-1),Math.round(e.y*d+13),14,4));let p=e.facing==="left"||e.facing==="right",x=p?yt:e.facing==="up"?pt:bt,k=p?xt:mt,M=e.walking?p?a?St:wt:a?kt:Mt:p?At:gt,c=e.facing==="left";if($(t,x,r,h-l+u*0,o,c),$(t,k,r,h-l+x.length,o,c),!s)$(t,M,r,h-l+x.length+k.length,o,c);else if(e.state==="working"){let b=Math.floor(n*9+e.seed)%2;f(t,e.skin,r+1+b,h-l+x.length+3,1,1),f(t,e.skin,r+10-(1-b),h-l+x.length+3,1,1)}}function W(t,e,n,i){f(t,"#111827",e-1,n-1,13,11),f(t,"#ffffff",e,n,11,9),f(t,"#ffffff",e+4,n+9,3,1),f(t,"#111827",e+4,n+10,3,1),i(e,n)}function Et(t,e,n){let i=Math.round(e.x*d+2),r=Math.round(e.y*d-26+(O(e)?8:0)),s=Math.floor(n*2+e.seed%3)%2===0;if(e.state==="blocked")W(t,i,r,(o,a)=>{f(t,s?"#dc2626":"#991b1b",o+5,a+1,2,5),f(t,s?"#dc2626":"#991b1b",o+5,a+7,2,1)});else if(e.state==="thinking"){let o=Math.floor(n*3)%4;W(t,i,r,(a,u)=>{for(let l=0;l<3;l++)f(t,l<o?"#111827":"#d1d5db",a+2+l*3,u+4,2,2)})}else if(e.state==="reviewing"&&!e.walking)W(t,i,r,(o,a)=>{f(t,"#2563eb",o+4,a+1,4,1),f(t,"#2563eb",o+7,a+2,1,2),f(t,"#2563eb",o+5,a+4,2,1),f(t,"#2563eb",o+5,a+5,1,1),f(t,"#2563eb",o+5,a+7,1,1)});else if(e.state==="done"){let o=s?"#f59e0b":"#fbbf24";W(t,i,r,(a,u)=>{f(t,o,a+5,u+1,1,7),f(t,o,a+2,u+3,7,2),f(t,o,a+4,u+2,3,5)})}}function Ot(t,e,n){for(let i=e.y;i<e.y+e.h;i++)for(let r=e.x;r<e.x+e.w;r++){let s=r*d,o=i*d;if(e.floor==="carpet"){f(t,"#4c4f7a",s,o,d,d);for(let a=0;a<6;a++)f(t,"#55588a",s+(r*7+a*5)%15,o+(i*3+a*7)%15,1,1)}else if(e.floor==="tile")f(t,(r+i)%2===0?"#cfd8e3":"#bcc7d4",s,o,d,d),f(t,"#aab5c2",s,o+15,d,1),f(t,"#aab5c2",s+15,o,1,d);else{f(t,"#a06f45",s,o,d,d);let a=i%2===0?0:8;f(t,"#8f6039",s,o+7,d,1),f(t,"#8f6039",s,o+15,d,1),f(t,"#8f6039",s+(a+r*8)%16,o,1,7),f(t,"#ad7c52",s+3,o+3,4,1)}}}var it="#2f3350",Ct="#565c86",Rt="#454a70";function Lt(t,e,n){let i=new Set;for(let r of e.rooms)for(let s=r.y;s<r.y+r.h;s++)for(let o=r.x;o<r.x+r.w;o++)i.add(`${o},${s}`);for(let r of e.doors)i.add(`${r.x},${r.y}`);for(let r=0;r<e.rows;r++)for(let s=0;s<e.cols;s++){if(i.has(`${s},${r}`))continue;let o=s*d,a=r*d;i.has(`${s},${r+1}`)?(f(t,Ct,o,a,d,d),f(t,Rt,o,a+13,d,3),f(t,n.primary,o,a+12,d,1),s%4===3&&r<=3&&(f(t,"#1f2937",o+1,a+1,14,9),f(t,"#8ed0ff",o+2,a+2,12,7),f(t,"#bfe6ff",o+3,a+3,4,2),f(t,"#1f2937",o+8,a+2,1,7))):f(t,it,o,a,d,d)}for(let r of e.doors)f(t,"#6b4a2f",r.x*d,r.y*d,d,d),f(t,"#7c5637",r.x*d+2,r.y*d,12,d)}function Wt(t,e,n,i,r,s,o){if(f(t,"#6b4427",e+1,n+13,46,17),f(t,"#8a5a33",e+1,n+11,46,11),f(t,"#a06c3f",e+1,n+11,46,2),f(t,"#4a2e1a",e+3,n+22,3,9),f(t,"#4a2e1a",e+42,n+22,3,9),f(t,"#111827",e+15,n-1,18,13),f(t,"#374151",e+22,n+12,4,2),i){f(t,"#0f2a2e",e+16,n,16,11);let a=Math.floor(r*3+s%13);for(let u=0;u<4;u++){let l=3+((s>>u)+(a+u)*7)%11;f(t,u%2===0?o.primary:"#7dd3fc",e+17,n+1+u*2.5,l,1)}t.fillStyle="rgba(125,211,252,0.10)",t.fillRect(e+11,n+11,26,8)}else f(t,"#1f2937",e+16,n,16,11),f(t,"#374151",e+18,n+2,3,1);f(t,"#d1d5db",e+17,n+15,14,4),f(t,"#9ca3af",e+18,n+16,12,1),f(t,"#f3f4f6",e+38,n+14,4,4),f(t,o.primary,e+38,n+16,4,1)}function _t(t,e,n,i){f(t,"#2b2118",e,n-11,64,26),f(t,"#d9c29c",e+2,n-9,60,22);let r={todo:"#fde68a",doing:"#93c5fd",done:"#86efac"},s=8;i.tasks.slice(0,s*2).forEach((o,a)=>{let u=a%s,l=Math.floor(a/s);f(t,"#00000033",e+5+u*7,n-6+l*9,6,7),f(t,r[o.state],e+4+u*7,n-7+l*9,6,7),f(t,"#00000040",e+5+u*7,n-5+l*9,4,1)})}function st(t,e,n,i,r){let s=e.x*d,o=e.y*d;switch(e.type){case"desk":{let a=e.x+1,u=e.y+2,l=n.agents.find(h=>h.seat?.x===a&&h.seat?.y===u&&O(h)&&h.state!=="blocked");Wt(t,s,o,!!l,i,l?.seed??0,r);break}case"coffee":f(t,"#374151",s,o+2,32,14),f(t,"#6b7280",s,o+2,32,2),f(t,"#111827",s+4,o-8,14,14),f(t,"#ef4444",s+15,o-5,2,2),f(t,"#f3f4f6",s+8,o+3,5,4),f(t,"#f3f4f6",s+22,o-1,5,5);for(let a=0;a<3;a++)t.fillStyle="rgba(255,255,255,0.45)",t.fillRect(s+9+Math.round(Math.sin(i*2+a)*1.5),o-1-(i*8+a*4)%9,1,2);break;case"water":f(t,"#e5e7eb",s+3,o+3,10,13),f(t,"#7dd3fc",s+4,o-7,8,10),f(t,"#bae6fd",s+5,o-6,2,8),f(t,"#3b82f6",s+5,o+6,2,2);break;case"sofa":f(t,r.primary,s+1,o-6,46,9),f(t,"#00000030",s+1,o+1,46,2),f(t,"#4b5563",s,o+3,48,11),f(t,"#6b7280",s+3,o+3,20,7),f(t,"#6b7280",s+25,o+3,20,7),f(t,"#374151",s,o+12,48,3);break;case"plant":f(t,"#92400e",s+4,o+9,8,7),f(t,"#b45309",s+3,o+8,10,2);for(let[a,u,l,h]of[[6,-3,4,11],[2,0,5,6],[9,1,5,6],[4,-6,3,6],[9,-5,3,5]])f(t,"#15803d",s+a,o+u,l,h);f(t,"#22c55e",s+7,o-3,2,8),f(t,"#22c55e",s+3,o+1,2,3);break;case"board":_t(t,s,o,n);break;case"shelf":f(t,"#5b3a21",s,o-12,32,28);for(let a=0;a<2;a++){f(t,"#3b2413",s+2,o-10+a*13,28,11);for(let u=0;u<8;u++){let l=["#ef4444","#3b82f6","#10b981","#f59e0b","#8b5cf6"][(u*3+a)%5];f(t,l,s+3+u*3,o-8+a*13+u%3,2,9-u%3)}}break;case"server":f(t,"#111827",s+1,o-12,14,28);for(let a=0;a<5;a++){f(t,"#1f2937",s+2,o-11+a*5,12,4);let u=Math.floor(i*3+a*2+e.x)%3!==0;f(t,u?"#22c55e":"#14532d",s+3,o-10+a*5,1,1),f(t,a%2===0?"#f59e0b":"#3b82f6",s+5,o-10+a*5,1,1)}break;case"table":f(t,"#57534e",s+2,o+14,44,14),f(t,"#78716c",s+2,o+3,44,14),f(t,"#a8a29e",s+2,o+3,44,2),f(t,"#f9fafb",s+10,o+6,8,6),f(t,"#f9fafb",s+28,o+8,8,6);break;case"rug":f(t,r.primary,s,o,64,48),t.fillStyle="rgba(0,0,0,0.35)",t.fillRect(s+3,o+3,58,42),f(t,r.primary,s+6,o+6,52,1),f(t,r.primary,s+6,o+41,52,1);break}}function Ft(t,e){t.font="bold 7px ui-monospace, Menlo, Consolas, monospace",t.textBaseline="top";for(let n of e.rooms){if(!n.name)continue;let i=n.name.toUpperCase(),r=n.x*d+3,s=n.y*d-12;t.fillStyle="rgba(0,0,0,0.45)",t.fillText(i,r+1,s+1),t.fillStyle="rgba(255,255,255,0.85)",t.fillText(i,r,s)}}function Bt(t,e,n,i){let r=e.name;t.font="bold 7px ui-monospace, Menlo, Consolas, monospace",t.textBaseline="top";let s=Math.ceil(t.measureText(r).width)+5,o=e.x*d+8,a=Math.round(Math.max(1,Math.min(i-s-1,o-s/2))),u=Math.round(e.y*d+15);t.fillStyle=n?"#ffffff":"rgba(17,24,39,0.82)",t.fillRect(a,u,s,10),t.fillStyle=n?"#111827":"#ffffff",t.fillText(r,a+2.5,u+1.5)}function It(t,e,n){let i=[],r="";for(let s of e.split(/\\s+/)){let o=r?`${r} ${s}`:s;t.measureText(o).width>n&&r?(i.push(r),r=s):r=o}return r&&i.push(r),i.slice(0,3)}var rt={working:"Working",thinking:"Thinking",blocked:"Blocked",reviewing:"Reviewing",idle:"On a break",done:"Finished",away:"Away"};function Dt(t,e,n){t.font="7px ui-monospace, Menlo, Consolas, monospace",t.textBaseline="top";let i=It(t,e.task||rt[e.state]||"",104),r=114,s=18+i.length*9+3,o=Math.round(Math.max(2,Math.min(n-r-2,e.x*d+8-r/2))),a=Math.round(Math.max(2,e.y*d-s-22));f(t,"#111827",o-1,a-1,r+2,s+2),f(t,"#ffffff",o,a,r,s),t.fillStyle="#111827",t.font="bold 7px ui-monospace, Menlo, Consolas, monospace",t.fillText(`${e.name}: ${rt[e.state]??""}`.slice(0,26),o+4,a+4),t.fillStyle="#374151",t.font="7px ui-monospace, Menlo, Consolas, monospace",i.forEach((u,l)=>t.fillText(u,o+4,a+15+l*9))}function Pt(t,e,n){if(e.tasks.length===0)return;let i=e.tasks.filter(o=>o.state==="done").length,r=`QUESTS ${i}/${e.tasks.length}`;t.font="bold 7px ui-monospace, Menlo, Consolas, monospace",t.textBaseline="top";let s=96;f(t,"rgba(17,24,39,0.85)",4,4,s,20),t.fillStyle="#ffffff",t.fillText(r,8,6.5),f(t,"#374151",8,16,s-8,4),f(t,n.primary,8,16,Math.round((s-8)*i/e.tasks.length),4)}function at(t,e,n,i,r){let s=e.cols*d;f(t,it,0,0,s,e.rows*d);for(let l of e.rooms)Ot(t,l,i);Lt(t,e,i);for(let l of e.furniture)l.type==="rug"&&st(t,l,e,n,i);let o=[];for(let l of e.furniture)l.type!=="rug"&&o.push({depth:(l.y+E[l.type].h)*d-2,draw:()=>st(t,l,e,n,i)});let a=e.agents.filter(l=>l.state!=="away");for(let l of a)o.push({depth:l.y*d+14,draw:()=>vt(t,l,n,l.id===r)});o.sort((l,h)=>l.depth-h.depth);for(let l of o)l.draw();Ft(t,e);for(let l of a)Bt(t,l,l.id===r,s);for(let l of a)l.id!==r&&Et(t,l,n);Pt(t,e,i);let u=a.find(l=>l.id===r);u&&Dt(t,u,s)}var $t=/^(#[0-9a-f]{3,8}|rgba?\\([\\d\\s.,%/]+\\)|hsla?\\([\\d\\s.,%/a-z]+\\))$/i;function Ht(t){let e=getComputedStyle(t),n=(i,r)=>{let s=e.getPropertyValue(i).trim();return $t.test(s)?s:r};return{primary:n("--blkc-color-primary","#3b82f6"),accent:n("--blkc-color-accent","#f59e0b"),background:n("--blkc-color-background","#1a1a2e"),text:n("--blkc-color-text","#ffffff")}}function H(t,e={},n={}){let i=B(e),r=t.getContext("2d");if(!r)throw new Error("This browser can\'t draw to a canvas.");let s=r,o=i.cols*d,a=i.rows*d,u=Ht(t),l=typeof matchMedia=="function"&&matchMedia("(prefers-reduced-motion: reduce)").matches,h,p=0,x=0,k=0,M=0,c=!0,b=!1,y=()=>{s.setTransform(p,0,0,p,0,0),s.imageSmoothingEnabled=!1,at(s,i,x,u,h)},T=()=>{let m=t.getBoundingClientRect().width||o,v=Math.max(1,Math.ceil(m*(typeof devicePixelRatio=="number"?devicePixelRatio:1)/o));v!==p&&(p=v,t.width=o*p,t.height=a*p,y())},U=m=>{if(b)return;if(M=requestAnimationFrame(U),!c){k=m;return}let g=Math.min((m-k)/1e3||0,.1);k=m,x+=g,D(i,g),y()},X=m=>{h=m===h?void 0:m,n.onSelect?.(h),l&&y()},G=m=>{let g=t.getBoundingClientRect();return{x:(m.clientX-g.left)/g.width*i.cols,y:(m.clientY-g.top)/g.height*i.rows}},K=m=>{let{x:g,y:v}=G(m);X(L(i,g,v)?.id)},j=m=>{let{x:g,y:v}=G(m);t.style.cursor=L(i,g,v)?"pointer":"default"};t.addEventListener("pointerdown",K),t.addEventListener("pointermove",j);let q=typeof ResizeObserver=="function"?new ResizeObserver(T):void 0;q?.observe(t);let z=typeof IntersectionObserver=="function"?new IntersectionObserver(m=>{c=m.some(g=>g.isIntersecting)}):void 0;return z?.observe(t),T(),p===0&&(p=1,y()),l||(M=requestAnimationFrame(U)),{world:i,update(m){P(i,m),l&&y()},select:X,destroy(){b=!0,cancelAnimationFrame(M),q?.disconnect(),z?.disconnect(),t.removeEventListener("pointerdown",K),t.removeEventListener("pointermove",j)}}}var lt=new Map;function Nt(t,e){lt.set(t,e)}function Ut(t,e,n){let i=[...n.querySelectorAll("button[data-blkc-agent]")],r=H(t,e,{onSelect(s){for(let o of i)o.setAttribute("aria-pressed",String(o.dataset.blkcAgent===s))}});for(let s of i)s.disabled=!1,s.addEventListener("click",()=>r.select(s.dataset.blkcAgent));return r}Nt("office",Ut);var ft=new WeakSet;function N(t=document){let e=[];for(let n of t.querySelectorAll("canvas[data-blkc-canvas]")){if(ft.has(n))continue;let i=lt.get(n.dataset.blkcCanvas??"");if(!i)continue;let r=n.closest("[data-blkc-canvas-root]")??n.parentElement??n,s=r.querySelector("script[data-blkc-canvas-data]"),o={};try{o=JSON.parse(s?.textContent||"{}")}catch{o={}}ft.add(n);let a=i(n,o,r);e.push({element:n,destroy:()=>a.destroy()})}return e}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>N()):N();})();\n/**\n * BLKC Render-Canvas.\n *\n * A canvas Block is ordinary markup from @blkc-code/render-web plus its data, and this\n * package brings it to life. Call mountCanvasBlocks() once the page is in the document:\n * a <canvas data-blkc-canvas="office"> with a JSON <script> beside it starts running.\n *\n * @package @blkc-code/render-canvas\n * @license Apache-2.0\n */\n';
 
 // src/commands/dev-shell.ts
 var SHELL_HTML = `<!doctype html>
@@ -68350,8 +68750,9 @@ function renderFrames() {
   const names = width === "all" ? Object.keys(WIDTHS) : [width];
   for (const name of names) {
     const frame = make("iframe", { title: item.name + " at " + name + " width", src: frameSrc(item) });
-    // No allow-scripts and no allow-same-origin: rendered content stays inert.
-    frame.setAttribute("sandbox", "allow-popups allow-popups-to-escape-sandbox");
+    // Scripts for the canvas runtime only (the page policy allows no other), and no same-origin,
+    // so nothing in a frame can reach this page, its storage or the server.
+    frame.setAttribute("sandbox", "allow-scripts allow-popups allow-popups-to-escape-sandbox");
     const figure = make("figure", {}, make("figcaption", { textContent: name + " \xB7 " + WIDTHS[name] + "px" }), frame);
     figure.style.width = WIDTHS[name] + "px";
     box.append(figure);
@@ -74494,7 +74895,7 @@ async function rc(e2, i = {}) {
 var theme_default = "@theme default {\n  --font-sans:\n    -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'Noto Sans', Arial,\n    sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';\n  --font-serif: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;\n  --font-mono:\n    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',\n    monospace;\n\n  --color-red-50: oklch(97.1% 0.013 17.38);\n  --color-red-100: oklch(93.6% 0.032 17.717);\n  --color-red-200: oklch(88.5% 0.062 18.334);\n  --color-red-300: oklch(80.8% 0.114 19.571);\n  --color-red-400: oklch(70.4% 0.191 22.216);\n  --color-red-500: oklch(63.7% 0.237 25.331);\n  --color-red-600: oklch(57.7% 0.245 27.325);\n  --color-red-700: oklch(50.5% 0.213 27.518);\n  --color-red-800: oklch(44.4% 0.177 26.899);\n  --color-red-900: oklch(39.6% 0.141 25.723);\n  --color-red-950: oklch(25.8% 0.092 26.042);\n\n  --color-orange-50: oklch(98% 0.016 73.684);\n  --color-orange-100: oklch(95.4% 0.038 75.164);\n  --color-orange-200: oklch(90.1% 0.076 70.697);\n  --color-orange-300: oklch(83.7% 0.128 66.29);\n  --color-orange-400: oklch(75% 0.183 55.934);\n  --color-orange-500: oklch(70.5% 0.213 47.604);\n  --color-orange-600: oklch(64.6% 0.222 41.116);\n  --color-orange-700: oklch(55.3% 0.195 38.402);\n  --color-orange-800: oklch(47% 0.157 37.304);\n  --color-orange-900: oklch(40.8% 0.123 38.172);\n  --color-orange-950: oklch(26.6% 0.079 36.259);\n\n  --color-amber-50: oklch(98.7% 0.022 95.277);\n  --color-amber-100: oklch(96.2% 0.059 95.617);\n  --color-amber-200: oklch(92.4% 0.12 95.746);\n  --color-amber-300: oklch(87.9% 0.169 91.605);\n  --color-amber-400: oklch(82.8% 0.189 84.429);\n  --color-amber-500: oklch(76.9% 0.188 70.08);\n  --color-amber-600: oklch(66.6% 0.179 58.318);\n  --color-amber-700: oklch(55.5% 0.163 48.998);\n  --color-amber-800: oklch(47.3% 0.137 46.201);\n  --color-amber-900: oklch(41.4% 0.112 45.904);\n  --color-amber-950: oklch(27.9% 0.077 45.635);\n\n  --color-yellow-50: oklch(98.7% 0.026 102.212);\n  --color-yellow-100: oklch(97.3% 0.071 103.193);\n  --color-yellow-200: oklch(94.5% 0.129 101.54);\n  --color-yellow-300: oklch(90.5% 0.182 98.111);\n  --color-yellow-400: oklch(85.2% 0.199 91.936);\n  --color-yellow-500: oklch(79.5% 0.184 86.047);\n  --color-yellow-600: oklch(68.1% 0.162 75.834);\n  --color-yellow-700: oklch(55.4% 0.135 66.442);\n  --color-yellow-800: oklch(47.6% 0.114 61.907);\n  --color-yellow-900: oklch(42.1% 0.095 57.708);\n  --color-yellow-950: oklch(28.6% 0.066 53.813);\n\n  --color-lime-50: oklch(98.6% 0.031 120.757);\n  --color-lime-100: oklch(96.7% 0.067 122.328);\n  --color-lime-200: oklch(93.8% 0.127 124.321);\n  --color-lime-300: oklch(89.7% 0.196 126.665);\n  --color-lime-400: oklch(84.1% 0.238 128.85);\n  --color-lime-500: oklch(76.8% 0.233 130.85);\n  --color-lime-600: oklch(64.8% 0.2 131.684);\n  --color-lime-700: oklch(53.2% 0.157 131.589);\n  --color-lime-800: oklch(45.3% 0.124 130.933);\n  --color-lime-900: oklch(40.5% 0.101 131.063);\n  --color-lime-950: oklch(27.4% 0.072 132.109);\n\n  --color-green-50: oklch(98.2% 0.018 155.826);\n  --color-green-100: oklch(96.2% 0.044 156.743);\n  --color-green-200: oklch(92.5% 0.084 155.995);\n  --color-green-300: oklch(87.1% 0.15 154.449);\n  --color-green-400: oklch(79.2% 0.209 151.711);\n  --color-green-500: oklch(72.3% 0.219 149.579);\n  --color-green-600: oklch(62.7% 0.194 149.214);\n  --color-green-700: oklch(52.7% 0.154 150.069);\n  --color-green-800: oklch(44.8% 0.119 151.328);\n  --color-green-900: oklch(39.3% 0.095 152.535);\n  --color-green-950: oklch(26.6% 0.065 152.934);\n\n  --color-emerald-50: oklch(97.9% 0.021 166.113);\n  --color-emerald-100: oklch(95% 0.052 163.051);\n  --color-emerald-200: oklch(90.5% 0.093 164.15);\n  --color-emerald-300: oklch(84.5% 0.143 164.978);\n  --color-emerald-400: oklch(76.5% 0.177 163.223);\n  --color-emerald-500: oklch(69.6% 0.17 162.48);\n  --color-emerald-600: oklch(59.6% 0.145 163.225);\n  --color-emerald-700: oklch(50.8% 0.118 165.612);\n  --color-emerald-800: oklch(43.2% 0.095 166.913);\n  --color-emerald-900: oklch(37.8% 0.077 168.94);\n  --color-emerald-950: oklch(26.2% 0.051 172.552);\n\n  --color-teal-50: oklch(98.4% 0.014 180.72);\n  --color-teal-100: oklch(95.3% 0.051 180.801);\n  --color-teal-200: oklch(91% 0.096 180.426);\n  --color-teal-300: oklch(85.5% 0.138 181.071);\n  --color-teal-400: oklch(77.7% 0.152 181.912);\n  --color-teal-500: oklch(70.4% 0.14 182.503);\n  --color-teal-600: oklch(60% 0.118 184.704);\n  --color-teal-700: oklch(51.1% 0.096 186.391);\n  --color-teal-800: oklch(43.7% 0.078 188.216);\n  --color-teal-900: oklch(38.6% 0.063 188.416);\n  --color-teal-950: oklch(27.7% 0.046 192.524);\n\n  --color-cyan-50: oklch(98.4% 0.019 200.873);\n  --color-cyan-100: oklch(95.6% 0.045 203.388);\n  --color-cyan-200: oklch(91.7% 0.08 205.041);\n  --color-cyan-300: oklch(86.5% 0.127 207.078);\n  --color-cyan-400: oklch(78.9% 0.154 211.53);\n  --color-cyan-500: oklch(71.5% 0.143 215.221);\n  --color-cyan-600: oklch(60.9% 0.126 221.723);\n  --color-cyan-700: oklch(52% 0.105 223.128);\n  --color-cyan-800: oklch(45% 0.085 224.283);\n  --color-cyan-900: oklch(39.8% 0.07 227.392);\n  --color-cyan-950: oklch(30.2% 0.056 229.695);\n\n  --color-sky-50: oklch(97.7% 0.013 236.62);\n  --color-sky-100: oklch(95.1% 0.026 236.824);\n  --color-sky-200: oklch(90.1% 0.058 230.902);\n  --color-sky-300: oklch(82.8% 0.111 230.318);\n  --color-sky-400: oklch(74.6% 0.16 232.661);\n  --color-sky-500: oklch(68.5% 0.169 237.323);\n  --color-sky-600: oklch(58.8% 0.158 241.966);\n  --color-sky-700: oklch(50% 0.134 242.749);\n  --color-sky-800: oklch(44.3% 0.11 240.79);\n  --color-sky-900: oklch(39.1% 0.09 240.876);\n  --color-sky-950: oklch(29.3% 0.066 243.157);\n\n  --color-blue-50: oklch(97% 0.014 254.604);\n  --color-blue-100: oklch(93.2% 0.032 255.585);\n  --color-blue-200: oklch(88.2% 0.059 254.128);\n  --color-blue-300: oklch(80.9% 0.105 251.813);\n  --color-blue-400: oklch(70.7% 0.165 254.624);\n  --color-blue-500: oklch(62.3% 0.214 259.815);\n  --color-blue-600: oklch(54.6% 0.245 262.881);\n  --color-blue-700: oklch(48.8% 0.243 264.376);\n  --color-blue-800: oklch(42.4% 0.199 265.638);\n  --color-blue-900: oklch(37.9% 0.146 265.522);\n  --color-blue-950: oklch(28.2% 0.091 267.935);\n\n  --color-indigo-50: oklch(96.2% 0.018 272.314);\n  --color-indigo-100: oklch(93% 0.034 272.788);\n  --color-indigo-200: oklch(87% 0.065 274.039);\n  --color-indigo-300: oklch(78.5% 0.115 274.713);\n  --color-indigo-400: oklch(67.3% 0.182 276.935);\n  --color-indigo-500: oklch(58.5% 0.233 277.117);\n  --color-indigo-600: oklch(51.1% 0.262 276.966);\n  --color-indigo-700: oklch(45.7% 0.24 277.023);\n  --color-indigo-800: oklch(39.8% 0.195 277.366);\n  --color-indigo-900: oklch(35.9% 0.144 278.697);\n  --color-indigo-950: oklch(25.7% 0.09 281.288);\n\n  --color-violet-50: oklch(96.9% 0.016 293.756);\n  --color-violet-100: oklch(94.3% 0.029 294.588);\n  --color-violet-200: oklch(89.4% 0.057 293.283);\n  --color-violet-300: oklch(81.1% 0.111 293.571);\n  --color-violet-400: oklch(70.2% 0.183 293.541);\n  --color-violet-500: oklch(60.6% 0.25 292.717);\n  --color-violet-600: oklch(54.1% 0.281 293.009);\n  --color-violet-700: oklch(49.1% 0.27 292.581);\n  --color-violet-800: oklch(43.2% 0.232 292.759);\n  --color-violet-900: oklch(38% 0.189 293.745);\n  --color-violet-950: oklch(28.3% 0.141 291.089);\n\n  --color-purple-50: oklch(97.7% 0.014 308.299);\n  --color-purple-100: oklch(94.6% 0.033 307.174);\n  --color-purple-200: oklch(90.2% 0.063 306.703);\n  --color-purple-300: oklch(82.7% 0.119 306.383);\n  --color-purple-400: oklch(71.4% 0.203 305.504);\n  --color-purple-500: oklch(62.7% 0.265 303.9);\n  --color-purple-600: oklch(55.8% 0.288 302.321);\n  --color-purple-700: oklch(49.6% 0.265 301.924);\n  --color-purple-800: oklch(43.8% 0.218 303.724);\n  --color-purple-900: oklch(38.1% 0.176 304.987);\n  --color-purple-950: oklch(29.1% 0.149 302.717);\n\n  --color-fuchsia-50: oklch(97.7% 0.017 320.058);\n  --color-fuchsia-100: oklch(95.2% 0.037 318.852);\n  --color-fuchsia-200: oklch(90.3% 0.076 319.62);\n  --color-fuchsia-300: oklch(83.3% 0.145 321.434);\n  --color-fuchsia-400: oklch(74% 0.238 322.16);\n  --color-fuchsia-500: oklch(66.7% 0.295 322.15);\n  --color-fuchsia-600: oklch(59.1% 0.293 322.896);\n  --color-fuchsia-700: oklch(51.8% 0.253 323.949);\n  --color-fuchsia-800: oklch(45.2% 0.211 324.591);\n  --color-fuchsia-900: oklch(40.1% 0.17 325.612);\n  --color-fuchsia-950: oklch(29.3% 0.136 325.661);\n\n  --color-pink-50: oklch(97.1% 0.014 343.198);\n  --color-pink-100: oklch(94.8% 0.028 342.258);\n  --color-pink-200: oklch(89.9% 0.061 343.231);\n  --color-pink-300: oklch(82.3% 0.12 346.018);\n  --color-pink-400: oklch(71.8% 0.202 349.761);\n  --color-pink-500: oklch(65.6% 0.241 354.308);\n  --color-pink-600: oklch(59.2% 0.249 0.584);\n  --color-pink-700: oklch(52.5% 0.223 3.958);\n  --color-pink-800: oklch(45.9% 0.187 3.815);\n  --color-pink-900: oklch(40.8% 0.153 2.432);\n  --color-pink-950: oklch(28.4% 0.109 3.907);\n\n  --color-rose-50: oklch(96.9% 0.015 12.422);\n  --color-rose-100: oklch(94.1% 0.03 12.58);\n  --color-rose-200: oklch(89.2% 0.058 10.001);\n  --color-rose-300: oklch(81% 0.117 11.638);\n  --color-rose-400: oklch(71.2% 0.194 13.428);\n  --color-rose-500: oklch(64.5% 0.246 16.439);\n  --color-rose-600: oklch(58.6% 0.253 17.585);\n  --color-rose-700: oklch(51.4% 0.222 16.935);\n  --color-rose-800: oklch(45.5% 0.188 13.697);\n  --color-rose-900: oklch(41% 0.159 10.272);\n  --color-rose-950: oklch(27.1% 0.105 12.094);\n\n  --color-slate-50: oklch(98.4% 0.003 247.858);\n  --color-slate-100: oklch(96.8% 0.007 247.896);\n  --color-slate-200: oklch(92.9% 0.013 255.508);\n  --color-slate-300: oklch(86.9% 0.022 252.894);\n  --color-slate-400: oklch(70.4% 0.04 256.788);\n  --color-slate-500: oklch(55.4% 0.046 257.417);\n  --color-slate-600: oklch(44.6% 0.043 257.281);\n  --color-slate-700: oklch(37.2% 0.044 257.287);\n  --color-slate-800: oklch(27.9% 0.041 260.031);\n  --color-slate-900: oklch(20.8% 0.042 265.755);\n  --color-slate-950: oklch(12.9% 0.042 264.695);\n\n  --color-gray-50: oklch(98.5% 0.002 247.839);\n  --color-gray-100: oklch(96.7% 0.003 264.542);\n  --color-gray-200: oklch(92.8% 0.006 264.531);\n  --color-gray-300: oklch(87.2% 0.01 258.338);\n  --color-gray-400: oklch(70.7% 0.022 261.325);\n  --color-gray-500: oklch(55.1% 0.027 264.364);\n  --color-gray-600: oklch(44.6% 0.03 256.802);\n  --color-gray-700: oklch(37.3% 0.034 259.733);\n  --color-gray-800: oklch(27.8% 0.033 256.848);\n  --color-gray-900: oklch(21% 0.034 264.665);\n  --color-gray-950: oklch(13% 0.028 261.692);\n\n  --color-zinc-50: oklch(98.5% 0 none);\n  --color-zinc-100: oklch(96.7% 0.001 286.375);\n  --color-zinc-200: oklch(92% 0.004 286.32);\n  --color-zinc-300: oklch(87.1% 0.006 286.286);\n  --color-zinc-400: oklch(70.5% 0.015 286.067);\n  --color-zinc-500: oklch(55.2% 0.016 285.938);\n  --color-zinc-600: oklch(44.2% 0.017 285.786);\n  --color-zinc-700: oklch(37% 0.013 285.805);\n  --color-zinc-800: oklch(27.4% 0.006 286.033);\n  --color-zinc-900: oklch(21% 0.006 285.885);\n  --color-zinc-950: oklch(14.1% 0.005 285.823);\n\n  --color-neutral-50: oklch(98.5% 0 none);\n  --color-neutral-100: oklch(97% 0 none);\n  --color-neutral-200: oklch(92.2% 0 none);\n  --color-neutral-300: oklch(87% 0 none);\n  --color-neutral-400: oklch(70.8% 0 none);\n  --color-neutral-500: oklch(55.6% 0 none);\n  --color-neutral-600: oklch(43.9% 0 none);\n  --color-neutral-700: oklch(37.1% 0 none);\n  --color-neutral-800: oklch(26.9% 0 none);\n  --color-neutral-900: oklch(20.5% 0 none);\n  --color-neutral-950: oklch(14.5% 0 none);\n\n  --color-stone-50: oklch(98.5% 0.001 106.423);\n  --color-stone-100: oklch(97% 0.001 106.424);\n  --color-stone-200: oklch(92.3% 0.003 48.717);\n  --color-stone-300: oklch(86.9% 0.005 56.366);\n  --color-stone-400: oklch(70.9% 0.01 56.259);\n  --color-stone-500: oklch(55.3% 0.013 58.071);\n  --color-stone-600: oklch(44.4% 0.011 73.639);\n  --color-stone-700: oklch(37.4% 0.01 67.558);\n  --color-stone-800: oklch(26.8% 0.007 34.298);\n  --color-stone-900: oklch(21.6% 0.006 56.043);\n  --color-stone-950: oklch(14.7% 0.004 49.25);\n\n  --color-mauve-50: oklch(98.5% 0 none);\n  --color-mauve-100: oklch(96% 0.003 325.6);\n  --color-mauve-200: oklch(92.2% 0.005 325.62);\n  --color-mauve-300: oklch(86.5% 0.012 325.68);\n  --color-mauve-400: oklch(71.1% 0.019 323.02);\n  --color-mauve-500: oklch(54.2% 0.034 322.5);\n  --color-mauve-600: oklch(43.5% 0.029 321.78);\n  --color-mauve-700: oklch(36.4% 0.029 323.89);\n  --color-mauve-800: oklch(26.3% 0.024 320.12);\n  --color-mauve-900: oklch(21.2% 0.019 322.12);\n  --color-mauve-950: oklch(14.5% 0.008 326);\n\n  --color-olive-50: oklch(98.8% 0.003 106.5);\n  --color-olive-100: oklch(96.6% 0.005 106.5);\n  --color-olive-200: oklch(93% 0.007 106.5);\n  --color-olive-300: oklch(88% 0.011 106.6);\n  --color-olive-400: oklch(73.7% 0.021 106.9);\n  --color-olive-500: oklch(58% 0.031 107.3);\n  --color-olive-600: oklch(46.6% 0.025 107.3);\n  --color-olive-700: oklch(39.4% 0.023 107.4);\n  --color-olive-800: oklch(28.6% 0.016 107.4);\n  --color-olive-900: oklch(22.8% 0.013 107.4);\n  --color-olive-950: oklch(15.3% 0.006 107.1);\n\n  --color-mist-50: oklch(98.7% 0.002 197.1);\n  --color-mist-100: oklch(96.3% 0.002 197.1);\n  --color-mist-200: oklch(92.5% 0.005 214.3);\n  --color-mist-300: oklch(87.2% 0.007 219.6);\n  --color-mist-400: oklch(72.3% 0.014 214.4);\n  --color-mist-500: oklch(56% 0.021 213.5);\n  --color-mist-600: oklch(45% 0.017 213.2);\n  --color-mist-700: oklch(37.8% 0.015 216);\n  --color-mist-800: oklch(27.5% 0.011 216.9);\n  --color-mist-900: oklch(21.8% 0.008 223.9);\n  --color-mist-950: oklch(14.8% 0.004 228.8);\n\n  --color-taupe-50: oklch(98.6% 0.002 67.8);\n  --color-taupe-100: oklch(96% 0.002 17.2);\n  --color-taupe-200: oklch(92.2% 0.005 34.3);\n  --color-taupe-300: oklch(86.8% 0.007 39.5);\n  --color-taupe-400: oklch(71.4% 0.014 41.2);\n  --color-taupe-500: oklch(54.7% 0.021 43.1);\n  --color-taupe-600: oklch(43.8% 0.017 39.3);\n  --color-taupe-700: oklch(36.7% 0.016 35.7);\n  --color-taupe-800: oklch(26.8% 0.011 36.5);\n  --color-taupe-900: oklch(21.4% 0.009 43.1);\n  --color-taupe-950: oklch(14.7% 0.004 49.3);\n\n  --color-black: #000;\n  --color-white: #fff;\n\n  --spacing: 0.25rem;\n\n  --breakpoint-sm: 40rem;\n  --breakpoint-md: 48rem;\n  --breakpoint-lg: 64rem;\n  --breakpoint-xl: 80rem;\n  --breakpoint-2xl: 96rem;\n\n  --container-3xs: 16rem;\n  --container-2xs: 18rem;\n  --container-xs: 20rem;\n  --container-sm: 24rem;\n  --container-md: 28rem;\n  --container-lg: 32rem;\n  --container-xl: 36rem;\n  --container-2xl: 42rem;\n  --container-3xl: 48rem;\n  --container-4xl: 56rem;\n  --container-5xl: 64rem;\n  --container-6xl: 72rem;\n  --container-7xl: 80rem;\n\n  --text-xs: 0.75rem;\n  --text-xs--line-height: calc(1 / 0.75);\n  --text-sm: 0.875rem;\n  --text-sm--line-height: calc(1.25 / 0.875);\n  --text-base: 1rem;\n  --text-base--line-height: calc(1.5 / 1);\n  --text-lg: 1.125rem;\n  --text-lg--line-height: calc(1.75 / 1.125);\n  --text-xl: 1.25rem;\n  --text-xl--line-height: calc(1.75 / 1.25);\n  --text-2xl: 1.5rem;\n  --text-2xl--line-height: calc(2 / 1.5);\n  --text-3xl: 1.875rem;\n  --text-3xl--line-height: calc(2.25 / 1.875);\n  --text-4xl: 2.25rem;\n  --text-4xl--line-height: calc(2.5 / 2.25);\n  --text-5xl: 3rem;\n  --text-5xl--line-height: 1;\n  --text-6xl: 3.75rem;\n  --text-6xl--line-height: 1;\n  --text-7xl: 4.5rem;\n  --text-7xl--line-height: 1;\n  --text-8xl: 6rem;\n  --text-8xl--line-height: 1;\n  --text-9xl: 8rem;\n  --text-9xl--line-height: 1;\n\n  --font-weight-thin: 100;\n  --font-weight-extralight: 200;\n  --font-weight-light: 300;\n  --font-weight-normal: 400;\n  --font-weight-medium: 500;\n  --font-weight-semibold: 600;\n  --font-weight-bold: 700;\n  --font-weight-extrabold: 800;\n  --font-weight-black: 900;\n\n  --tracking-tighter: -0.05em;\n  --tracking-tight: -0.025em;\n  --tracking-normal: 0em;\n  --tracking-wide: 0.025em;\n  --tracking-wider: 0.05em;\n  --tracking-widest: 0.1em;\n\n  --leading-tight: 1.25;\n  --leading-snug: 1.375;\n  --leading-normal: 1.5;\n  --leading-relaxed: 1.625;\n  --leading-loose: 2;\n\n  --radius-xs: 0.125rem;\n  --radius-sm: 0.25rem;\n  --radius-md: 0.375rem;\n  --radius-lg: 0.5rem;\n  --radius-xl: 0.75rem;\n  --radius-2xl: 1rem;\n  --radius-3xl: 1.5rem;\n  --radius-4xl: 2rem;\n\n  --shadow-2xs: 0 1px rgb(0 0 0 / 0.05);\n  --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n  --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n  --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n\n  --inset-shadow-2xs: inset 0 1px rgb(0 0 0 / 0.05);\n  --inset-shadow-xs: inset 0 1px 1px rgb(0 0 0 / 0.05);\n  --inset-shadow-sm: inset 0 2px 4px rgb(0 0 0 / 0.05);\n\n  --drop-shadow-xs: 0 1px 1px rgb(0 0 0 / 0.05);\n  --drop-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.15);\n  --drop-shadow-md: 0 3px 3px rgb(0 0 0 / 0.12);\n  --drop-shadow-lg: 0 4px 4px rgb(0 0 0 / 0.15);\n  --drop-shadow-xl: 0 9px 7px rgb(0 0 0 / 0.1);\n  --drop-shadow-2xl: 0 25px 25px rgb(0 0 0 / 0.15);\n\n  --text-shadow-2xs: 0px 1px 0px rgb(0 0 0 / 0.15);\n  --text-shadow-xs: 0px 1px 1px rgb(0 0 0 / 0.2);\n  --text-shadow-sm:\n    0px 1px 0px rgb(0 0 0 / 0.075), 0px 1px 1px rgb(0 0 0 / 0.075), 0px 2px 2px rgb(0 0 0 / 0.075);\n  --text-shadow-md:\n    0px 1px 1px rgb(0 0 0 / 0.1), 0px 1px 2px rgb(0 0 0 / 0.1), 0px 2px 4px rgb(0 0 0 / 0.1);\n  --text-shadow-lg:\n    0px 1px 2px rgb(0 0 0 / 0.1), 0px 3px 2px rgb(0 0 0 / 0.1), 0px 4px 8px rgb(0 0 0 / 0.1);\n\n  --ease-in: cubic-bezier(0.4, 0, 1, 1);\n  --ease-out: cubic-bezier(0, 0, 0.2, 1);\n  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n\n  --animate-spin: spin 1s linear infinite;\n  --animate-ping: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;\n  --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n  --animate-bounce: bounce 1s infinite;\n\n  @keyframes spin {\n    to {\n      transform: rotate(360deg);\n    }\n  }\n\n  @keyframes ping {\n    75%,\n    100% {\n      transform: scale(2);\n      opacity: 0;\n    }\n  }\n\n  @keyframes pulse {\n    50% {\n      opacity: 0.5;\n    }\n  }\n\n  @keyframes bounce {\n    0%,\n    100% {\n      transform: translateY(-25%);\n      animation-timing-function: cubic-bezier(0.8, 0, 1, 1);\n    }\n\n    50% {\n      transform: none;\n      animation-timing-function: cubic-bezier(0, 0, 0.2, 1);\n    }\n  }\n\n  --blur-xs: 4px;\n  --blur-sm: 8px;\n  --blur-md: 12px;\n  --blur-lg: 16px;\n  --blur-xl: 24px;\n  --blur-2xl: 40px;\n  --blur-3xl: 64px;\n\n  --perspective-dramatic: 100px;\n  --perspective-near: 300px;\n  --perspective-normal: 500px;\n  --perspective-midrange: 800px;\n  --perspective-distant: 1200px;\n\n  --aspect-video: 16 / 9;\n\n  --default-transition-duration: 150ms;\n  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  --default-font-family: --theme(--font-sans, initial);\n  --default-font-feature-settings: --theme(--font-sans--font-feature-settings, initial);\n  --default-font-variation-settings: --theme(--font-sans--font-variation-settings, initial);\n  --default-mono-font-family: --theme(--font-mono, initial);\n  --default-mono-font-feature-settings: --theme(--font-mono--font-feature-settings, initial);\n  --default-mono-font-variation-settings: --theme(--font-mono--font-variation-settings, initial);\n}\n\n/* Deprecated */\n@theme default inline reference {\n  --blur: 8px;\n  --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n  --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);\n  --drop-shadow: 0 1px 2px rgb(0 0 0 / 0.1), 0 1px 1px rgb(0 0 0 / 0.06);\n  --radius: 0.25rem;\n  --max-width-prose: 65ch;\n}\n";
 
 // ../render-web/src/theme.css
-var theme_default2 = "/* Tailwind theme for the renderer classes. Generated values match blkcThemeCss() in\n   @blkc-code/tailwind-preset, and a test keeps the two in step. */\n@theme inline {\n  --color-primary: var(--blkc-color-primary, #0066cc);\n  --color-primary-foreground: var(--blkc-color-background, #ffffff);\n  --color-secondary: var(--blkc-color-secondary, #6c757d);\n  --color-secondary-foreground: var(--blkc-color-background, #ffffff);\n  --color-background: var(--blkc-color-background, #ffffff);\n  --color-foreground: var(--blkc-color-text, #1a1a1a);\n  --color-muted: var(--blkc-color-background, #ffffff);\n  --color-muted-foreground: var(--blkc-color-text-secondary, #6c757d);\n  --color-border: var(--blkc-color-border, #e0e0e0);\n  --color-input: var(--blkc-color-border, #e0e0e0);\n  --color-accent: var(--blkc-color-primary, #0066cc);\n  --color-accent-foreground: var(--blkc-color-background, #ffffff);\n  --color-ring: var(--blkc-color-primary, #0066cc);\n  --radius-blkc: var(--blkc-border-radius, 8px);\n  --container-blkc: var(--blkc-max-width, 1200px);\n  --font-blkc: var(--blkc-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif);\n  --shadow-blkc: var(--blkc-shadow-md, 0 4px 6px rgba(0, 0, 0, 0.1));\n  --shadow-blkc-sm: var(--blkc-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.05));\n  --shadow-blkc-lg: var(--blkc-shadow-lg, 0 10px 15px rgba(0, 0, 0, 0.1));\n  --spacing-blkc-xs: var(--blkc-spacing-xs, 0.25rem);\n  --spacing-blkc-sm: var(--blkc-spacing-sm, 0.5rem);\n  --spacing-blkc-md: var(--blkc-spacing-md, 1rem);\n  --spacing-blkc-lg: var(--blkc-spacing-lg, 2rem);\n  --spacing-blkc-xl: var(--blkc-spacing-xl, 4rem);\n}\n";
+var theme_default2 = "/* Tailwind theme for the renderer classes. Generated values match blkcThemeCss() in\n   @blkc-code/tailwind-preset, and a test keeps the two in step. */\n@theme inline {\n  --color-primary: var(--blkc-color-primary, #0066cc);\n  --color-primary-foreground: var(--blkc-color-background, #ffffff);\n  --color-secondary: var(--blkc-color-secondary, #6c757d);\n  --color-secondary-foreground: var(--blkc-color-background, #ffffff);\n  --color-background: var(--blkc-color-background, #ffffff);\n  --color-foreground: var(--blkc-color-text, #1a1a1a);\n  --color-muted: var(--blkc-color-surface, color-mix(in srgb, var(--blkc-color-text, #1a1a1a) 6%, var(--blkc-color-background, #ffffff)));\n  --color-muted-foreground: var(--blkc-color-text-secondary, #6c757d);\n  --color-border: var(--blkc-color-border, color-mix(in srgb, var(--blkc-color-text, #1a1a1a) 16%, var(--blkc-color-background, #ffffff)));\n  --color-input: var(--blkc-color-border, color-mix(in srgb, var(--blkc-color-text, #1a1a1a) 16%, var(--blkc-color-background, #ffffff)));\n  --color-accent: var(--blkc-color-accent, var(--blkc-color-primary, #0066cc));\n  --color-accent-foreground: var(--blkc-color-background, #ffffff);\n  --color-ring: var(--blkc-color-primary, #0066cc);\n  --radius-blkc: var(--blkc-border-radius, 8px);\n  --container-blkc: var(--blkc-max-width, 1200px);\n  --font-blkc: var(--blkc-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif);\n  --shadow-blkc: var(--blkc-shadow-md, 0 4px 6px rgba(0, 0, 0, 0.1));\n  --shadow-blkc-sm: var(--blkc-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.05));\n  --shadow-blkc-lg: var(--blkc-shadow-lg, 0 10px 15px rgba(0, 0, 0, 0.1));\n  --spacing-blkc-xs: var(--blkc-spacing-xs, 0.25rem);\n  --spacing-blkc-sm: var(--blkc-spacing-sm, 0.5rem);\n  --spacing-blkc-md: var(--blkc-spacing-md, 1rem);\n  --spacing-blkc-lg: var(--blkc-spacing-lg, 2rem);\n  --spacing-blkc-xl: var(--blkc-spacing-xl, 4rem);\n}\n";
 
 // src/commands/local-blocks.ts
 var { getBlockComponent: getBlockComponent2, registerBlock: registerBlock2, unregisterBlock: unregisterBlock2 } = dist_exports;
@@ -74604,6 +75005,24 @@ async function readCompanions(dir) {
   }
   return out;
 }
+async function applyOfficeState(dir, pages) {
+  let state;
+  try {
+    state = await readJson(import_node_path12.default.join(dir, "office-state.json"));
+  } catch {
+    return;
+  }
+  for (const page of pages) {
+    for (const block of page["blocks"] ?? []) {
+      if (block.block !== "office" && !Array.isArray(block.props?.["agents"])) continue;
+      block.props = {
+        ...block.props,
+        ...Array.isArray(state["agents"]) ? { agents: state["agents"] } : {},
+        ...Array.isArray(state["tasks"]) ? { tasks: state["tasks"] } : {}
+      };
+    }
+  }
+}
 async function loadManifest(file2, kind) {
   const raw = await readJson(file2);
   const dir = import_node_path12.default.dirname(file2);
@@ -74627,7 +75046,9 @@ async function loadManifest(file2, kind) {
     } catch {
     }
   }
-  return { ...kit, theme, content: { pages: [...files, ...inline] } };
+  const pages = [...files, ...inline];
+  await applyOfficeState(dir, pages);
+  return { ...kit, theme, content: { pages } };
 }
 var announced = /* @__PURE__ */ new Set();
 async function scan(root) {
@@ -74670,7 +75091,8 @@ async function scan(root) {
 }
 var escapeHtml3 = (value) => value.replace(/[&<>"']/g, (c2) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" })[c2]);
 var FRAME_HEAD = `<base target="_blank"><style>${styles_default}</style>`;
-var FRAME_CSP = "default-src 'none'; style-src 'unsafe-inline' https://fonts.googleapis.com; font-src https://fonts.gstatic.com; img-src * data:; base-uri 'self'";
+var frameCsp = (nonce) => `default-src 'none'; ${nonce ? `script-src 'nonce-${nonce}'; ` : ""}style-src 'unsafe-inline' https://fonts.googleapis.com; font-src https://fonts.gstatic.com; img-src * data:; base-uri 'self'`;
+var FRAME_CSP = frameCsp();
 var SHELL_CSP = "default-src 'self'; style-src 'unsafe-inline'; frame-ancestors 'none'";
 function send(res, status, type, body, csp) {
   res.writeHead(status, {
@@ -74720,7 +75142,9 @@ async function startDevServer(root, port, exactPort) {
       }
       const manifest = await loadManifest(item.file, item.kind);
       const page = url2.searchParams.get("page") ?? void 0;
-      return send(res, 200, "text/html", renderManifestDocument(manifest, { page, head: FRAME_HEAD + (css ? `<style>${css}</style>` : "") }), FRAME_CSP);
+      const nonce = (0, import_node_crypto.randomBytes)(16).toString("hex");
+      const html = renderManifestDocument(manifest, { page, head: FRAME_HEAD + (css ? `<style>${css}</style>` : ""), canvasRuntime: runtime_default, nonce });
+      return send(res, 200, "text/html", html, frameCsp(nonce));
     }
     send(res, 404, "text/plain", "Not found");
   }
@@ -74827,7 +75251,7 @@ function registerDevCommand(program3) {
 }
 
 // src/version.ts
-var VERSION = "0.3.0";
+var VERSION = "0.4.0";
 
 // src/index.ts
 var program2 = new Command();