veryfront 0.1.96 → 0.1.98

package/src/src/rendering/page-rendering.ts

@@ -15,6 +15,64 @@ interface MDXPageResult {
   collectedMetadata: Record<string, unknown>;
 }
 
+interface PreparedMDXPageBundles {
+  pageBundle: PageBundle;
+  serverModuleCode: string;
+}
+
+export async function prepareMDXPageBundles(
+  pageInfo: EntityInfo,
+  projectDir: string,
+  options?: {
+    precompiledModule?: string;
+    studioEmbed?: boolean;
+  },
+): Promise<PreparedMDXPageBundles> {
+  const { frontmatter, content, path } = pageInfo.entity;
+  const fmArg = frontmatter && Object.keys(frontmatter).length > 0 ? frontmatter : undefined;
+
+  const ssrBundle = await compileContent(
+    "development",
+    projectDir,
+    content,
+    fmArg,
+    path,
+    "server",
+    undefined,
+    options?.studioEmbed,
+  );
+
+  const pageBundle = ssrBundle as PageBundle;
+
+  if (options?.precompiledModule) {
+    pageBundle.clientModuleCode = options.precompiledModule;
+  } else {
+    const browserBundle = await compileContent(
+      "development",
+      projectDir,
+      content,
+      fmArg,
+      path,
+      "browser",
+      undefined,
+      options?.studioEmbed,
+    );
+    pageBundle.clientModuleCode = browserBundle.compiledCode;
+  }
+
+  const clientModuleCode = pageBundle.clientModuleCode;
+  if (!clientModuleCode) {
+    throw RENDER_ERROR.create({
+      detail: "MDX compilation produced no client module code",
+    });
+  }
+
+  return {
+    pageBundle,
+    serverModuleCode: ssrBundle.compiledCode,
+  };
+}
+
 export function handleMDXPage(
   pageInfo: EntityInfo,
   slug: string,
@@ -42,49 +100,16 @@ export function handleMDXPage(
   return withSpan(
     "rendering.handleMDXPage",
     async () => {
-      const { frontmatter, content, path } = pageInfo.entity;
-      const fmArg = frontmatter && Object.keys(frontmatter).length > 0 ? frontmatter : undefined;
-
-      const ssrBundle = await compileContent(
-        "development",
-        projectDir,
-        content,
-        fmArg,
-        path,
-        "server",
-        undefined,
-        options?.studioEmbed,
-      );
-
-      const pageBundle = ssrBundle as PageBundle;
+      const { frontmatter, path } = pageInfo.entity;
+      const { pageBundle, serverModuleCode } = await prepareMDXPageBundles(pageInfo, projectDir, {
+        precompiledModule: options?.precompiledModule,
+        studioEmbed: options?.studioEmbed,
+      });
       let collectedMetadata: Record<string, unknown> = {};
 
       try {
-        if (options?.precompiledModule) {
-          pageBundle.clientModuleCode = options.precompiledModule;
-        } else {
-          const browserBundle = await compileContent(
-            "development",
-            projectDir,
-            content,
-            fmArg,
-            path,
-            "browser",
-            undefined,
-            options?.studioEmbed,
-          );
-          pageBundle.clientModuleCode = browserBundle.compiledCode;
-        }
-
-        const clientModuleCode = pageBundle.clientModuleCode;
-        if (!clientModuleCode) {
-          throw RENDER_ERROR.create({
-            detail: "MDX compilation produced no client module code",
-          });
-        }
-
         const mod = (await mdxRenderer.loadModuleESM(
-          clientModuleCode,
+          serverModuleCode,
           adapter,
           options?.projectId,
           projectDir,

package/src/src/studio/bridge/bridge-bundle.generated.ts

@@ -6,4 +6,4 @@
  * @module
  */
 
-export const STUDIO_BRIDGE_BUNDLE: string = "// src/studio/bridge/bridge-logger.ts\nfunction normalizeContext(context) {\n  if (!context)\n    return void 0;\n  if (context instanceof Error) {\n    return { error: context.message, ...context.stack ? { stack: context.stack } : {} };\n  }\n  return context;\n}\nfunction formatArgs(message, context) {\n  const normalized = normalizeContext(context);\n  if (!normalized || Object.keys(normalized).length === 0) {\n    return [message];\n  }\n  return [message, normalized];\n}\nvar logger = {\n  debug(message, context) {\n    console.debug(...formatArgs(message, context));\n  },\n  info(message, context) {\n    console.log(...formatArgs(message, context));\n  },\n  warn(message, context) {\n    console.warn(...formatArgs(message, context));\n  },\n  error(message, context) {\n    console.error(...formatArgs(message, context));\n  }\n};\n\n// src/studio/bridge/bridge-config.ts\nvar config = null;\nfunction initConfig() {\n  const raw = globalThis.__VF_BRIDGE_CONFIG__;\n  const params = new URLSearchParams(window.location.search);\n  const qsMode = params.get(\"vf_studio_mode\");\n  const resolveMode = (value) => value === \"simple\" || qsMode === \"simple\" ? \"simple\" : \"advanced\";\n  if (!raw || typeof raw !== \"object\") {\n    logger.warn(\"No bridge config found on window.__VF_BRIDGE_CONFIG__\");\n    config = {\n      projectId: \"\",\n      pageId: \"\",\n      pagePath: \"\",\n      wsUrl: \"\",\n      yjsGuid: \"\",\n      studioMode: resolveMode(void 0),\n      debugSkipInit: false,\n      debugExposeInternals: false\n    };\n    return;\n  }\n  config = {\n    projectId: String(raw.projectId ?? \"\"),\n    pageId: String(raw.pageId ?? \"\"),\n    pagePath: String(raw.pagePath ?? raw.pageId ?? \"\"),\n    wsUrl: String(raw.wsUrl ?? \"\"),\n    yjsGuid: String(raw.yjsGuid ?? \"\"),\n    studioMode: resolveMode(raw.studioMode),\n    debugSkipInit: !!raw.debugSkipInit,\n    debugExposeInternals: !!raw.debugExposeInternals\n  };\n}\nfunction getConfig() {\n  if (!config) {\n    throw new Error(\"[StudioBridge] Config not initialized. Call initConfig() first.\");\n  }\n  return config;\n}\n\n// src/studio/bridge/bridge-state.ts\nvar state = {\n  // Inspector\n  inspectMode: false,\n  selectedNodeId: null,\n  hoveredNodeId: null,\n  lastTreeSignature: \"\",\n  // Overlays\n  hoverOverlay: null,\n  selectionOverlay: null,\n  // Console\n  originalConsole: {},\n  logCounter: 0,\n  // Screenshot\n  html2canvasLoaded: false,\n  html2canvasPromise: null\n};\nvar CONSOLE_METHODS = [\n  \"log\",\n  \"debug\",\n  \"info\",\n  \"warn\",\n  \"error\",\n  \"table\",\n  \"clear\",\n  \"dir\"\n];\nvar DOM_IGNORE_TAGS = [\"SCRIPT\", \"STYLE\", \"LINK\", \"META\", \"NOSCRIPT\"];\n\n// src/studio/bridge/bridge-messaging.ts\nvar studioOrigin = null;\nfunction postToStudio(message) {\n  if (!window.parent || window.parent === window)\n    return;\n  try {\n    window.parent.postMessage(message, studioOrigin || \"*\");\n  } catch (e) {\n    logger.debug(\"postMessage failed\", e instanceof Error ? e : { error: String(e) });\n  }\n}\nfunction isFromStudio(event) {\n  try {\n    if (!event.source || event.source === window)\n      return false;\n    const url = new URL(event.origin || \"\");\n    const host = url.hostname;\n    const valid = host === \"localhost\" || host.endsWith(\".veryfront.org\") || host === \"veryfront.org\" || host.endsWith(\".veryfront.com\") || host === \"veryfront.com\" || host.endsWith(\".veryfront.dev\") || host === \"veryfront.dev\";\n    if (valid && !studioOrigin) {\n      studioOrigin = event.origin;\n    }\n    return valid;\n  } catch (_) {\n    return false;\n  }\n}\n\n// src/studio/bridge/bridge-styles.ts\nvar OVERLAY_CSS = `\n      /* ------------------------------------------------------------------ */\n      /* Overlays (hover / selection inspector)                              */\n      /* ------------------------------------------------------------------ */\n\n      .vf-overlay {\n        position: fixed;\n        pointer-events: none;\n        z-index: 99999;\n        box-sizing: border-box;\n        transition: all 0.05s ease-out;\n      }\n      .vf-overlay-hover {\n        border: 2px solid oklch(0.6852 0.162 241.8);\n        background: oklch(0.6852 0.162 241.8 / 0.06);\n      }\n      .vf-overlay-selection {\n        border: 2px solid oklch(0.6852 0.162 241.8);\n        background: oklch(0.6852 0.162 241.8 / 0.1);\n      }\n      .vf-overlay-label {\n        position: absolute;\n        top: -22px;\n        left: -2px;\n        background: oklch(0.6852 0.162 241.8);\n        color: white;\n        font-size: 11px;\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        padding: 2px 6px;\n        border-radius: 3px 3px 0 0;\n        white-space: nowrap;\n        pointer-events: none;\n      }\n      .vf-overlay-label-bottom {\n        top: auto;\n        bottom: -22px;\n        border-radius: 0 0 3px 3px;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Edit button (floating CTA)                                          */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-edit-button {\n        position: fixed;\n        right: 16px;\n        bottom: 16px;\n        z-index: 100001;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 9999px;\n        background: oklch(0.2768 0 0);\n        color: oklch(0.9512 0.008 98.88);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        font-size: 13px;\n        font-weight: 500;\n        line-height: 1;\n        padding: 10px 16px;\n        cursor: pointer;\n        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);\n        transition: transform 100ms ease, box-shadow 100ms ease;\n      }\n      .vf-markdown-edit-button:hover {\n        box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);\n      }\n      .vf-markdown-edit-button:active {\n        transform: scale(0.98);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Editor root                                                         */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor {\n        position: fixed;\n        inset: 0;\n        z-index: 100000;\n        background: oklch(1 0 0);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        display: none;\n      }\n\n      .vf-markdown-editor__history {\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 6px;\n        background: oklch(1 0 0);\n        color: oklch(0.2768 0 0);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        font-size: 13px;\n        line-height: 1;\n        min-width: 28px;\n        height: 28px;\n        padding: 0 8px;\n        cursor: pointer;\n        transition: background 75ms ease;\n      }\n      .vf-markdown-editor__history:hover {\n        background: oklch(0.93 0 0);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Surface (editor area)                                               */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__surface-wrap {\n        position: relative;\n        height: 100vh;\n      }\n\n      .vf-markdown-editor__surface {\n        width: 100%;\n        max-width: 980px;\n        margin: 0 auto;\n        height: 100%;\n        overflow: auto;\n        outline: none;\n        position: relative;\n        z-index: 1;\n        background: transparent;\n        padding: 32px 40px;\n        box-sizing: border-box;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Selection overlay                                                   */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__selection-overlay {\n        position: absolute;\n        inset: 0;\n        pointer-events: none;\n        z-index: 2;\n        display: none;\n      }\n\n      .vf-markdown-editor__selection-highlight {\n        position: absolute;\n        border-radius: 3px;\n        opacity: 0.26;\n      }\n\n      .vf-markdown-editor__selection-caret {\n        position: absolute;\n        width: 2px;\n        border-radius: 1px;\n      }\n\n      .vf-markdown-editor__selection-label {\n        position: absolute;\n        transform: translateY(-100%);\n        margin-top: -4px;\n        border-radius: 9999px;\n        padding: 1px 7px;\n        font-size: 10px;\n        line-height: 1.4;\n        white-space: nowrap;\n        color: oklch(1 0 0);\n        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Slash menu                                                          */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__slash-menu {\n        position: fixed;\n        z-index: 100005;\n        min-width: 240px;\n        max-width: 300px;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 8px;\n        background: oklch(1 0 0);\n        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);\n        padding: 4px;\n        display: none;\n      }\n\n      .vf-markdown-editor__slash-section {\n        padding: 8px 10px 4px;\n        font-size: 11px;\n        font-weight: 600;\n        color: oklch(0.55 0.005 95.11);\n        text-transform: none;\n        letter-spacing: 0;\n      }\n\n      .vf-markdown-editor__slash-item {\n        display: flex;\n        align-items: center;\n        gap: 10px;\n        width: 100%;\n        border: 0;\n        border-radius: 6px;\n        background: transparent;\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        text-align: left;\n        padding: 6px 10px;\n        cursor: pointer;\n        transition: background 75ms ease;\n      }\n\n      .vf-markdown-editor__slash-item:hover,\n      .vf-markdown-editor__slash-item[data-active='true'] {\n        background: oklch(0.93 0 0);\n      }\n\n      .vf-markdown-editor__slash-icon {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        width: 24px;\n        height: 24px;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 4px;\n        background: oklch(1 0 0);\n        font-size: 13px;\n        font-weight: 600;\n        color: oklch(0.2768 0 0);\n        flex-shrink: 0;\n      }\n\n      .vf-markdown-editor__slash-item-title {\n        display: block;\n        font-size: 13px;\n        font-weight: 500;\n        color: oklch(0.2768 0 0);\n        line-height: 1.35;\n        flex: 1;\n      }\n\n      .vf-markdown-editor__slash-item-desc {\n        display: none;\n      }\n\n      .vf-markdown-editor__slash-shortcut {\n        font-size: 11px;\n        color: oklch(0.55 0.005 95.11);\n        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n        flex-shrink: 0;\n      }\n\n      .vf-markdown-editor__slash-footer {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        padding: 6px 10px;\n        margin-top: 2px;\n        border-top: 1px solid oklch(0.9 0 0);\n        font-size: 11px;\n        color: oklch(0.55 0.005 95.11);\n      }\n\n      .vf-markdown-editor__slash-footer-key {\n        font-size: 10px;\n        color: oklch(0.55 0.005 95.11);\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 3px;\n        padding: 1px 4px;\n        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Inline toolbar                                                      */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__inline-toolbar {\n        position: fixed;\n        z-index: 100006;\n        display: none;\n        flex-direction: column;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 8px;\n        background: oklch(1 0 0);\n        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);\n        padding: 4px;\n      }\n\n      .vf-markdown-editor__inline-row {\n        display: flex;\n        align-items: center;\n        gap: 2px;\n        padding: 2px 0;\n      }\n\n      .vf-markdown-editor__inline-separator {\n        width: 1px;\n        height: 20px;\n        background: oklch(0.9 0 0);\n        margin: 0 2px;\n        flex-shrink: 0;\n      }\n\n      .vf-markdown-editor__inline-button {\n        border: 0;\n        border-radius: 6px;\n        background: transparent;\n        color: oklch(0.2768 0 0);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        font-size: 12px;\n        font-weight: 600;\n        line-height: 1;\n        min-width: 26px;\n        height: 26px;\n        padding: 0 7px;\n        cursor: pointer;\n        transition: background 75ms ease;\n      }\n\n      .vf-markdown-editor__inline-button:hover {\n        background: oklch(0.93 0 0);\n      }\n\n      .vf-markdown-editor__inline-button.active {\n        background: oklch(0.6852 0.162 241.8 / 0.14);\n        color: oklch(0.6852 0.162 241.8);\n      }\n\n      .vf-markdown-editor__inline-button[data-format='bold'] {\n        font-weight: 700;\n      }\n\n      .vf-markdown-editor__inline-button[data-format='italic'] {\n        font-style: italic;\n      }\n\n      .vf-markdown-editor__inline-button[data-format='strikethrough'] {\n        text-decoration: line-through;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Block type trigger                                                  */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__block-trigger {\n        border: 0;\n        border-radius: 6px;\n        background: transparent;\n        color: oklch(0.2768 0 0);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        font-size: 12px;\n        font-weight: 600;\n        line-height: 1;\n        height: 26px;\n        padding: 0 7px;\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        gap: 2px;\n        white-space: nowrap;\n        transition: background 75ms ease;\n      }\n\n      .vf-markdown-editor__block-trigger:hover {\n        background: oklch(0.93 0 0);\n      }\n\n      .vf-markdown-editor__block-trigger::after {\n        content: '\\\\25BE';\n        font-size: 10px;\n        color: oklch(0.55 0.005 95.11);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Block dropdown                                                      */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__block-dropdown {\n        position: absolute;\n        top: 100%;\n        left: 4px;\n        z-index: 100007;\n        min-width: 160px;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 6px;\n        background: oklch(1 0 0);\n        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);\n        padding: 4px;\n        margin-top: 4px;\n        display: none;\n      }\n\n      .vf-markdown-editor__block-option {\n        display: block;\n        width: 100%;\n        border: 0;\n        border-radius: 6px;\n        background: transparent;\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        text-align: left;\n        padding: 6px 10px;\n        font-size: 13px;\n        font-weight: 500;\n        color: oklch(0.2768 0 0);\n        cursor: pointer;\n        transition: background 75ms ease;\n      }\n\n      .vf-markdown-editor__block-option:hover {\n        background: oklch(0.93 0 0);\n      }\n\n      .vf-markdown-editor__block-option.active {\n        background: oklch(0.6852 0.162 241.8 / 0.1);\n        color: oklch(0.6852 0.162 241.8);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Block drag handle                                                   */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__block-handle {\n        position: fixed;\n        z-index: 100007;\n        display: none;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 6px;\n        background: oklch(1 0 0);\n        color: oklch(0.2768 0 0);\n        font-size: 12px;\n        font-weight: 700;\n        line-height: 1;\n        width: 28px;\n        height: 28px;\n        padding: 0;\n        cursor: grab;\n        box-shadow: 0 1px 3px rgba(0,0,0,0.1), 0 1px 2px -1px rgba(0,0,0,0.1);\n        transition: background 75ms ease, box-shadow 75ms ease;\n      }\n\n      .vf-markdown-editor__block-handle:hover {\n        background: oklch(0.6852 0.162 241.8 / 0.1);\n      }\n\n      .vf-markdown-editor__block-handle[data-dragging='true'] {\n        cursor: grabbing;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Block drop indicator                                                */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__block-drop-indicator {\n        position: fixed;\n        z-index: 100006;\n        display: none;\n        height: 2px;\n        border-radius: 9999px;\n        background: oklch(0.6852 0.162 241.8);\n        box-shadow: 0 1px 6px oklch(0.6852 0.162 241.8 / 0.5);\n      }\n\n      .vf-markdown-editor__block-drop-label {\n        position: fixed;\n        z-index: 100007;\n        display: none;\n        border-radius: 9999px;\n        border: 1px solid oklch(0.6852 0.162 241.8 / 0.24);\n        background: oklch(1 0 0 / 0.96);\n        color: oklch(0.2768 0 0);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        font-size: 11px;\n        font-weight: 600;\n        line-height: 1.2;\n        padding: 3px 8px;\n        box-shadow: 0 1px 3px rgba(0,0,0,0.1), 0 1px 2px -1px rgba(0,0,0,0.1);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Block drag ghost                                                    */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__block-drag-ghost {\n        position: fixed;\n        top: -9999px;\n        left: -9999px;\n        width: 260px;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 8px;\n        background: oklch(1 0 0);\n        box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);\n        padding: 8px 10px;\n      }\n\n      .vf-markdown-editor__block-drag-ghost-title {\n        display: block;\n        font-size: 11px;\n        font-weight: 700;\n        color: oklch(0.2768 0 0);\n      }\n\n      .vf-markdown-editor__block-drag-ghost-text {\n        display: block;\n        margin-top: 4px;\n        font-size: 11px;\n        color: oklch(0.55 0.005 95.11);\n        line-height: 1.35;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* MDX blocks bar                                                      */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__mdx-blocks {\n        display: none;\n        gap: 8px;\n        padding: 8px 16px;\n        border-bottom: 1px solid oklch(0.9 0 0);\n        background: oklch(0.97 0 0 / 0.95);\n        overflow-x: auto;\n      }\n\n      .vf-markdown-editor__mdx-block {\n        display: inline-flex;\n        align-items: center;\n        gap: 8px;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 6px;\n        background: oklch(1 0 0);\n        padding: 6px 8px;\n      }\n\n      .vf-markdown-editor__mdx-block-label {\n        font-size: 11px;\n        color: oklch(0.2768 0 0);\n        white-space: nowrap;\n      }\n\n      .vf-markdown-editor__mdx-note {\n        font-size: 10px;\n        color: oklch(0.55 0.005 95.11);\n        white-space: nowrap;\n      }\n\n      .vf-markdown-editor__mdx-open {\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 6px;\n        background: oklch(1 0 0);\n        color: oklch(0.2768 0 0);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        font-size: 11px;\n        line-height: 1;\n        padding: 5px 7px;\n        cursor: pointer;\n        white-space: nowrap;\n        transition: background 75ms ease;\n      }\n      .vf-markdown-editor__mdx-open:hover {\n        background: oklch(0.93 0 0);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Lexical surface overrides                                           */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__surface [data-lexical-editor] {\n        outline: none;\n      }\n\n      .vf-markdown-editor__surface s,\n      .vf-markdown-editor__surface del,\n      .vf-markdown-editor__surface [style*='line-through'] {\n        text-decoration: line-through;\n      }\n\n      .vf-markdown-editor__surface p:empty::before {\n        content: \"Type '/' for commands\";\n        color: oklch(0.55 0.005 95.11 / 0.6);\n        pointer-events: none;\n        font-style: normal;\n      }\n\n      .vf-markdown-editor__surface h1:empty::before {\n        content: 'Heading 1';\n        color: oklch(0.55 0.005 95.11 / 0.6);\n        pointer-events: none;\n      }\n\n      .vf-markdown-editor__surface h2:empty::before {\n        content: 'Heading 2';\n        color: oklch(0.55 0.005 95.11 / 0.6);\n        pointer-events: none;\n      }\n\n      .vf-markdown-editor__surface h3:empty::before {\n        content: 'Heading 3';\n        color: oklch(0.55 0.005 95.11 / 0.6);\n        pointer-events: none;\n      }\n\n      .vf-markdown-editor__surface blockquote:empty::before {\n        content: 'Quote';\n        color: oklch(0.55 0.005 95.11 / 0.6);\n        pointer-events: none;\n      }\n\n      .vf-markdown-editor__surface p {\n        min-height: 1.5em;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Textarea fallback                                                   */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__textarea {\n        width: 100%;\n        height: 100vh;\n        border: 0;\n        outline: none;\n        resize: none;\n        display: none;\n        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;\n        font-size: 14px;\n        line-height: 1.6;\n        color: oklch(0.2768 0 0);\n        background: transparent;\n        padding: 16px;\n        box-sizing: border-box;\n      }\n\n      /* ================================================================== */\n      /* DARK MODE                                                           */\n      /* ================================================================== */\n\n      [data-theme='dark'] .vf-markdown-editor {\n        background: oklch(0.2768 0 0);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__history {\n        background: oklch(0.3211 0 0);\n        border-color: oklch(0.42 0.0017 106.48);\n        color: oklch(0.9512 0.008 98.88);\n      }\n      [data-theme='dark'] .vf-markdown-editor__history:hover {\n        background: oklch(0.25 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__textarea {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      /* Slash menu \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__slash-menu {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.21 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-section {\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-item:hover,\n      [data-theme='dark'] .vf-markdown-editor__slash-item[data-active='true'] {\n        background: oklch(0.25 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-icon {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.3211 0 0);\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-item-title {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-shortcut {\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-footer {\n        border-top-color: oklch(0.3 0.01 220);\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-footer-key {\n        border-color: oklch(0.42 0.0017 106.48);\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      /* Inline toolbar \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__inline-toolbar {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.21 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__inline-separator {\n        background: oklch(0.3 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__inline-button {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__inline-button:hover {\n        background: oklch(0.25 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__inline-button.active {\n        background: oklch(0.6852 0.162 241.8 / 0.2);\n        color: oklch(0.75 0.14 241.8);\n      }\n\n      /* Block trigger \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__block-trigger {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-trigger:hover {\n        background: oklch(0.25 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-trigger::after {\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      /* Block dropdown \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__block-dropdown {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.21 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-option {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-option:hover {\n        background: oklch(0.25 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-option.active {\n        background: oklch(0.6852 0.162 241.8 / 0.2);\n        color: oklch(0.75 0.14 241.8);\n      }\n\n      /* Placeholder text \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__surface p:empty::before,\n      [data-theme='dark'] .vf-markdown-editor__surface h1:empty::before,\n      [data-theme='dark'] .vf-markdown-editor__surface h2:empty::before,\n      [data-theme='dark'] .vf-markdown-editor__surface h3:empty::before,\n      [data-theme='dark'] .vf-markdown-editor__surface blockquote:empty::before {\n        color: oklch(0.5338 0.0046 106.55 / 0.5);\n      }\n\n      /* Block drag \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__block-handle {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.3211 0 0);\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-handle:hover {\n        background: oklch(0.6852 0.162 241.8 / 0.2);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-drop-label {\n        border-color: oklch(0.6852 0.162 241.8 / 0.35);\n        background: oklch(0.18 0.01 220 / 0.96);\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-drag-ghost {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.3211 0 0);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-drag-ghost-title {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-drag-ghost-text {\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      /* MDX blocks \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__mdx-blocks {\n        border-bottom-color: oklch(0.3 0.01 220);\n        background: oklch(0.18 0.01 220 / 0.8);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__mdx-block {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.3211 0 0);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__mdx-block-label {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__mdx-note {\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__mdx-open {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.2768 0 0);\n        color: oklch(0.9512 0.008 98.88);\n      }\n      [data-theme='dark'] .vf-markdown-editor__mdx-open:hover {\n        background: oklch(0.25 0.01 220);\n      }\n\n      /* Edit button \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-edit-button {\n        background: oklch(0.9512 0.008 98.88);\n        color: oklch(0.2768 0 0);\n        border-color: oklch(0.42 0.0017 106.48);\n      }\n`;\nfunction injectOverlayStyles() {\n  if (document.getElementById(\"vf-overlay-styles\"))\n    return;\n  const style = document.createElement(\"style\");\n  style.id = \"vf-overlay-styles\";\n  style.textContent = OVERLAY_CSS;\n  try {\n    document.head.appendChild(style);\n    if (!style.sheet) {\n      logger.warn(\"Inline style injection may be blocked by CSP (style-src)\");\n    }\n  } catch (error) {\n    logger.warn(\n      \"Failed to inject bridge styles. This may be caused by CSP style-src restrictions.\",\n      error instanceof Error ? error : {\n        error: String(error)\n      }\n    );\n  }\n}\n\n// src/studio/bridge/bridge-constants.ts\nvar DATA_VF_ID = \"data-vf-id\";\nvar DATA_VF_SELECTOR = \"data-vf-selector\";\nvar DATA_VF_TEXT = \"data-vf-text\";\nvar DATA_VF_IGNORE = \"data-vf-ignore\";\nvar DATA_NODE_ID = \"data-node-id\";\nvar DATA_NODE_FILE = \"data-node-file\";\nvar DATA_NODE_NAME = \"data-node-name\";\nvar DATA_NODE_LINE = \"data-node-line\";\nvar DATA_NODE_COLUMN = \"data-node-column\";\nvar DATA_NODE_SOURCE = \"data-node-source\";\n\n// src/studio/bridge/bridge-utils.ts\nfunction debounce(fn, ms) {\n  let timer;\n  const debounced = function(...args) {\n    clearTimeout(timer);\n    timer = setTimeout(() => {\n      fn.apply(this, args);\n    }, ms);\n  };\n  debounced.cancel = () => {\n    clearTimeout(timer);\n    timer = void 0;\n  };\n  return debounced;\n}\n\n// src/studio/bridge/bridge-inspector.ts\nfunction createOverlay(type) {\n  const overlay = document.createElement(\"div\");\n  overlay.className = \"vf-overlay vf-overlay-\" + type;\n  overlay.setAttribute(DATA_VF_IGNORE, \"true\");\n  const label = document.createElement(\"div\");\n  label.className = \"vf-overlay-label\";\n  overlay.appendChild(label);\n  overlay.style.display = \"none\";\n  document.body.appendChild(overlay);\n  return overlay;\n}\nfunction hideOverlay(overlay) {\n  if (overlay)\n    overlay.style.display = \"none\";\n}\nfunction positionOverlay(overlay, element, nodeName) {\n  if (!overlay)\n    return;\n  if (!element) {\n    hideOverlay(overlay);\n    return;\n  }\n  const rect = element.getBoundingClientRect();\n  overlay.style.display = \"block\";\n  overlay.style.top = rect.top + \"px\";\n  overlay.style.left = rect.left + \"px\";\n  overlay.style.width = rect.width + \"px\";\n  overlay.style.height = rect.height + \"px\";\n  const label = overlay.querySelector(\".vf-overlay-label\");\n  if (label) {\n    label.textContent = nodeName;\n    if (rect.top < 24) {\n      label.classList.add(\"vf-overlay-label-bottom\");\n    } else {\n      label.classList.remove(\"vf-overlay-label-bottom\");\n    }\n  }\n}\nfunction getNodeName(element) {\n  const vfId = element.getAttribute(DATA_VF_ID);\n  if (vfId)\n    return vfId.split(\"_\")[0] ?? vfId;\n  return element.tagName.toLowerCase();\n}\nfunction findElementById(nodeId) {\n  if (!nodeId)\n    return null;\n  return document.querySelector(\"[\" + DATA_VF_ID + '=\"' + nodeId + '\"]') || document.querySelector(\"[\" + DATA_VF_SELECTOR + '=\"' + nodeId + '\"]') || document.querySelector(\"[\" + DATA_NODE_ID + '=\"' + nodeId + '\"]');\n}\nfunction isValidElement(el) {\n  return !!el && el.nodeType === Node.ELEMENT_NODE && !DOM_IGNORE_TAGS.includes(el.tagName) && !el.hasAttribute(DATA_VF_IGNORE) && el.style.display !== \"none\";\n}\nfunction getNodeType(el) {\n  const vfId = el.getAttribute(DATA_VF_ID) || \"\";\n  if (vfId && /^[A-Z]/.test(vfId))\n    return \"component\";\n  if (el.hasAttribute(DATA_VF_TEXT))\n    return \"text\";\n  if (el.getAttribute(DATA_NODE_SOURCE) === \"md\")\n    return \"markdown\";\n  return \"element\";\n}\nfunction buildNavigatorTree(root) {\n  const config3 = getConfig();\n  let nodeIndex = 0;\n  function processElement(el, parentId) {\n    if (!isValidElement(el)) {\n      const children = [];\n      Array.from(el.children || []).forEach((child) => {\n        children.push(...processElement(child, parentId));\n      });\n      return children;\n    }\n    let id = el.getAttribute(DATA_VF_ID) || el.getAttribute(DATA_NODE_ID) || el.getAttribute(DATA_VF_SELECTOR);\n    if (!id) {\n      id = \"vf-\" + el.tagName.toLowerCase() + \"-\" + ++nodeIndex;\n      el.setAttribute(DATA_VF_SELECTOR, id);\n    }\n    const vfId = el.getAttribute(DATA_VF_ID);\n    const name = vfId ? vfId.split(\"_\")[0] ?? vfId : el.tagName.toLowerCase();\n    const node = {\n      id,\n      name,\n      type: getNodeType(el),\n      path: config3.pagePath,\n      parentId,\n      start: {\n        line: parseInt(el.getAttribute(DATA_NODE_LINE) || \"0\", 10),\n        column: parseInt(el.getAttribute(DATA_NODE_COLUMN) || \"0\", 10)\n      },\n      end: { line: 0, column: 0 },\n      children: [],\n      text: el.hasAttribute(DATA_VF_TEXT) ? el.textContent?.trim() : void 0,\n      isRemote: false\n    };\n    Array.from(el.children || []).forEach((child) => {\n      node.children.push(...processElement(child, id));\n    });\n    return [node];\n  }\n  const rootNode = {\n    id: \"root\",\n    name: \"root\",\n    type: \"root\",\n    path: \"\",\n    parentId: \"\",\n    start: { line: 0, column: 0 },\n    end: { line: 0, column: 0 },\n    children: [],\n    isRemote: false\n  };\n  Array.from(root.children || []).forEach((child) => {\n    rootNode.children.push(...processElement(child, \"root\"));\n  });\n  return rootNode;\n}\nfunction createTreeSignature(root) {\n  const validElements = Array.from(root.querySelectorAll(\"*\")).filter((el) => isValidElement(el));\n  return validElements.length + \"-\" + validElements.map((el) => el.tagName).join(\"\");\n}\nvar treeUpdateTimer = null;\nvar mutationObserver = null;\nfunction sendTreeUpdate() {\n  const config3 = getConfig();\n  const root = document.getElementById(\"root\") || document.body;\n  if (!root)\n    return;\n  const signature = createTreeSignature(root);\n  if (signature === state.lastTreeSignature)\n    return;\n  state.lastTreeSignature = signature;\n  postToStudio({\n    action: \"treeUpdated\",\n    id: config3.pageId,\n    url: window.location.href,\n    tree: buildNavigatorTree(root),\n    sourceHash: globalThis.__VERYFRONT_SOURCE_HASH__ || null\n  });\n}\nfunction debouncedTreeUpdate() {\n  if (treeUpdateTimer)\n    clearTimeout(treeUpdateTimer);\n  treeUpdateTimer = setTimeout(sendTreeUpdate, 150);\n}\nfunction setupMutationObserver() {\n  const root = document.getElementById(\"root\") || document.body;\n  if (!root)\n    return;\n  mutationObserver = new MutationObserver(function(mutations) {\n    const hasRelevantChanges = mutations.some(\n      (m) => m.type === \"childList\" || m.type === \"characterData\"\n    );\n    if (!hasRelevantChanges)\n      return;\n    if (state.selectedNodeId && !findElementById(state.selectedNodeId)) {\n      state.selectedNodeId = null;\n      hideOverlay(state.selectionOverlay);\n      postToStudio({ action: \"setSelectedNode\", id: null });\n    }\n    debouncedTreeUpdate();\n  });\n  mutationObserver.observe(root, { childList: true, characterData: true, subtree: true });\n  sendTreeUpdate();\n}\nfunction showOverlay(overlay, nodeId) {\n  if (!nodeId) {\n    hideOverlay(overlay);\n    return;\n  }\n  const el = findElementById(nodeId);\n  if (!el) {\n    hideOverlay(overlay);\n    return;\n  }\n  positionOverlay(overlay, el, getNodeName(el));\n}\nfunction showHoverOverlay(nodeId) {\n  showOverlay(state.hoverOverlay, nodeId);\n}\nfunction showSelectionOverlay(nodeId) {\n  showOverlay(state.selectionOverlay, nodeId);\n}\nfunction scrollToElement(nodeId) {\n  const el = document.querySelector(\"[\" + DATA_VF_ID + '=\"' + nodeId + '\"]') || document.querySelector(\"[\" + DATA_NODE_ID + '=\"' + nodeId + '\"]') || document.querySelector(\"[\" + DATA_VF_SELECTOR + '*=\"' + nodeId + '\"]');\n  if (el)\n    el.scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n}\nfunction getDirectText(el) {\n  let text = \"\";\n  for (let i = 0; i < el.childNodes.length; i++) {\n    const node = el.childNodes[i];\n    if (node?.nodeType === Node.TEXT_NODE) {\n      text += node.textContent || \"\";\n    }\n  }\n  return text.trim();\n}\nfunction setupInspectMode() {\n  const INSPECTABLE_SELECTOR = \"[\" + DATA_VF_ID + \"], [\" + DATA_VF_SELECTOR + \"], [\" + DATA_NODE_ID + \"], [\" + DATA_NODE_FILE + \"]\";\n  function getElementId(el) {\n    return el.getAttribute(DATA_VF_ID) || el.getAttribute(DATA_NODE_ID) || el.getAttribute(DATA_VF_SELECTOR);\n  }\n  document.addEventListener(\n    \"click\",\n    function(event) {\n      if (!state.inspectMode)\n        return;\n      event.preventDefault();\n      event.stopPropagation();\n      const target = event.target.closest(INSPECTABLE_SELECTOR);\n      if (!target) {\n        state.selectedNodeId = null;\n        hideOverlay(state.selectionOverlay);\n        postToStudio({ action: \"setSelectedNode\", id: null });\n        return;\n      }\n      const id = getElementId(target);\n      state.selectedNodeId = id;\n      showSelectionOverlay(id);\n      postToStudio({\n        action: \"setSelectedNode\",\n        id,\n        node: {\n          name: target.getAttribute(DATA_NODE_NAME) || target.tagName.toLowerCase(),\n          type: getNodeType(target),\n          file: target.getAttribute(DATA_NODE_FILE) || getConfig().pagePath,\n          line: parseInt(target.getAttribute(DATA_NODE_LINE) || \"0\", 10),\n          column: parseInt(target.getAttribute(DATA_NODE_COLUMN) || \"0\", 10),\n          text: getDirectText(target).slice(0, 200)\n        }\n      });\n    },\n    true\n  );\n  document.addEventListener(\"pointerover\", function(event) {\n    if (!state.inspectMode || event.pointerType === \"touch\")\n      return;\n    const target = event.target.closest(INSPECTABLE_SELECTOR);\n    if (!target)\n      return;\n    const id = getElementId(target);\n    if (id === state.hoveredNodeId)\n      return;\n    state.hoveredNodeId = id;\n    showHoverOverlay(id);\n  });\n  document.addEventListener(\"pointerout\", function(event) {\n    if (!state.inspectMode || event.pointerType === \"touch\")\n      return;\n    const target = event.target.closest(INSPECTABLE_SELECTOR);\n    if (!target)\n      return;\n    const relatedTarget = event.relatedTarget;\n    if (relatedTarget && target.contains(relatedTarget))\n      return;\n    state.hoveredNodeId = null;\n    hideOverlay(state.hoverOverlay);\n  });\n  const updateOverlays = debounce(function() {\n    if (state.inspectMode && state.hoveredNodeId)\n      showHoverOverlay(state.hoveredNodeId);\n    if (state.selectedNodeId)\n      showSelectionOverlay(state.selectedNodeId);\n  }, 16);\n  window.addEventListener(\"scroll\", updateOverlays, true);\n  window.addEventListener(\"resize\", updateOverlays);\n}\nfunction setColorMode(mode) {\n  document.documentElement.setAttribute(\"data-theme\", mode);\n  document.documentElement.classList.remove(\"light\", \"dark\");\n  document.documentElement.classList.add(mode);\n}\n\n// src/studio/bridge/bridge-console.ts\nfunction setupConsoleCapture() {\n  const consoleObj = console;\n  CONSOLE_METHODS.forEach((method) => {\n    state.originalConsole[method] = consoleObj[method];\n    consoleObj[method] = function(...args) {\n      state.originalConsole[method].apply(console, args);\n      const logId = \"vf-\" + Date.now() + \"-\" + ++state.logCounter;\n      const formattedData = args.map((arg) => {\n        try {\n          if (arg instanceof Error) {\n            return { __isError: true, message: arg.message, stack: arg.stack, name: arg.name };\n          }\n          if (arg === void 0)\n            return { __isUndefined: true };\n          if (arg === null)\n            return null;\n          if (typeof arg === \"function\") {\n            return { __isFunction: true, name: arg.name || \"anonymous\" };\n          }\n          if (typeof arg === \"symbol\")\n            return { __isSymbol: true, description: arg.description };\n          if (typeof arg === \"object\")\n            return JSON.parse(JSON.stringify(arg));\n          return arg;\n        } catch (_) {\n          return String(arg);\n        }\n      });\n      postToStudio({\n        action: \"logEvent\",\n        value: {\n          id: logId,\n          method,\n          data: formattedData,\n          timestamp: (/* @__PURE__ */ new Date()).toISOString()\n        }\n      });\n    };\n  });\n}\nfunction setupErrorHandling() {\n  function hideOverlays() {\n    hideOverlay(state.hoverOverlay);\n    hideOverlay(state.selectionOverlay);\n  }\n  window.addEventListener(\"error\", function(event) {\n    hideOverlays();\n    postToStudio({\n      action: \"runtimeError\",\n      url: window.location.href,\n      errors: [\n        {\n          type: \"error\",\n          message: event.message,\n          file: event.filename,\n          line: event.lineno,\n          column: event.colno\n        }\n      ]\n    });\n  });\n  window.addEventListener(\"unhandledrejection\", function(event) {\n    hideOverlays();\n    const reason = event.reason;\n    postToStudio({\n      action: \"runtimeError\",\n      url: window.location.href,\n      errors: [\n        {\n          type: \"error\",\n          message: reason instanceof Error ? reason.message : String(reason),\n          file: reason instanceof Error ? reason.stack : void 0\n        }\n      ]\n    });\n  });\n}\n\n// src/studio/bridge/bridge-screenshot.ts\nfunction loadHtml2Canvas() {\n  if (state.html2canvasLoaded)\n    return Promise.resolve();\n  if (state.html2canvasPromise)\n    return state.html2canvasPromise;\n  state.html2canvasPromise = new Promise((resolve, reject) => {\n    const script = document.createElement(\"script\");\n    script.src = \"https://cdn.jsdelivr.net/npm/html2canvas-pro@2.0.0/dist/html2canvas-pro.min.js\";\n    script.onload = () => {\n      state.html2canvasLoaded = true;\n      resolve();\n    };\n    script.onerror = (event) => {\n      logger.warn(\n        \"Failed to load html2canvas script. This may be caused by CSP script-src restrictions.\",\n        { event: String(event) }\n      );\n      reject(new Error(\"Failed to load html2canvas script\"));\n    };\n    try {\n      document.head.appendChild(script);\n    } catch (error) {\n      logger.warn(\n        \"Failed to append html2canvas script element. This may be caused by CSP script-src restrictions.\",\n        error instanceof Error ? error : { error: String(error) }\n      );\n      reject(\n        error instanceof Error ? error : new Error(\"Failed to append html2canvas script element\")\n      );\n    }\n  });\n  return state.html2canvasPromise;\n}\nasync function captureScreenshot(options) {\n  const { scrollTo, fullPage, quality = 0.8 } = options || {};\n  const originalScrollY = window.scrollY;\n  try {\n    await loadHtml2Canvas();\n    if (typeof scrollTo === \"number\") {\n      window.scrollTo(0, scrollTo);\n      await new Promise((r) => setTimeout(r, 150));\n    }\n    const canvasOptions = {\n      useCORS: true,\n      logging: false,\n      scale: window.devicePixelRatio || 1\n    };\n    if (fullPage) {\n      canvasOptions.height = document.documentElement.scrollHeight;\n      canvasOptions.windowHeight = document.documentElement.scrollHeight;\n      canvasOptions.y = 0;\n      window.scrollTo(0, 0);\n      await new Promise((r) => setTimeout(r, 100));\n    }\n    const html2canvasFn = window.html2canvas.default || window.html2canvas;\n    const canvas = await html2canvasFn(document.body, canvasOptions);\n    if (!canvas || canvas.width === 0 || canvas.height === 0) {\n      logger.error(\"html2canvas produced empty canvas\", {\n        width: canvas?.width,\n        height: canvas?.height\n      });\n      window.scrollTo(0, originalScrollY);\n      return {\n        success: false,\n        error: \"html2canvas produced empty canvas (0x0 dimensions)\"\n      };\n    }\n    const dataUrl = canvas.toDataURL(\"image/png\", quality);\n    if (!dataUrl || !dataUrl.startsWith(\"data:image/\") || dataUrl.length < 100) {\n      logger.error(\"html2canvas produced invalid data URL\", {\n        dataUrlPreview: dataUrl?.substring(0, 50)\n      });\n      window.scrollTo(0, originalScrollY);\n      return {\n        success: false,\n        error: \"html2canvas produced invalid image data\"\n      };\n    }\n    window.scrollTo(0, originalScrollY);\n    return {\n      success: true,\n      data: dataUrl,\n      width: canvas.width,\n      height: canvas.height,\n      scrollY: window.scrollY,\n      totalHeight: document.documentElement.scrollHeight,\n      viewportHeight: window.innerHeight,\n      url: window.location.href\n    };\n  } catch (error) {\n    logger.error(\"html2canvas error\", error instanceof Error ? error : { error: String(error) });\n    window.scrollTo(0, originalScrollY);\n    return {\n      success: false,\n      error: error instanceof Error ? error.message : String(error)\n    };\n  }\n}\nasync function captureMultipleSections(sectionCount) {\n  const originalScrollY = window.scrollY;\n  const results = [];\n  const totalHeight = document.documentElement.scrollHeight;\n  const viewportHeight = window.innerHeight;\n  const sections = sectionCount || Math.ceil(totalHeight / viewportHeight);\n  try {\n    for (let i = 0; i < sections; i++) {\n      const scrollY = Math.min(i * viewportHeight, totalHeight - viewportHeight);\n      const result = await captureScreenshot({ scrollTo: scrollY });\n      if (result.success) {\n        results.push({ ...result, section: i + 1, totalSections: sections });\n      }\n    }\n  } finally {\n    window.scrollTo(0, originalScrollY);\n  }\n  return results;\n}\n\n// src/studio/bridge/bridge-message-handler.ts\nvar SAFE_PROTOCOLS = /* @__PURE__ */ new Set([\"http:\", \"https:\"]);\nfunction isSafeNavigationUrl(url) {\n  if (url.startsWith(\"/\"))\n    return true;\n  try {\n    const parsed = new URL(url, window.location.origin);\n    return SAFE_PROTOCOLS.has(parsed.protocol);\n  } catch {\n    return false;\n  }\n}\nfunction handleStudioMessage(event) {\n  if (!isFromStudio(event))\n    return;\n  const message = event.data;\n  if (!message?.action)\n    return;\n  const config3 = getConfig();\n  switch (message.action) {\n    case \"routeChange\":\n      if (message.url) {\n        if (!isSafeNavigationUrl(message.url)) {\n          logger.warn(\"[StudioBridge] Blocked unsafe URL in routeChange\", { url: message.url });\n          return;\n        }\n        if (state.selectedNodeId) {\n          state.selectedNodeId = null;\n          hideOverlay(state.selectionOverlay);\n          postToStudio({ action: \"setSelectedNode\", id: null });\n        }\n        postToStudio({\n          action: \"onPageTransitionStart\",\n          url: message.url,\n          projectId: config3.projectId\n        });\n        window.location.href = message.url;\n      }\n      return;\n    case \"reload\":\n      window.location.reload();\n      return;\n    case \"goBack\":\n      window.history.back();\n      return;\n    case \"goForward\":\n      window.history.forward();\n      return;\n    case \"colorMode\":\n      setColorMode(message.value);\n      return;\n    case \"toggleInspectMode\":\n      state.inspectMode = message.value;\n      if (state.inspectMode)\n        return;\n      hideOverlay(state.hoverOverlay);\n      state.hoveredNodeId = null;\n      if (!message.deselectElements)\n        return;\n      hideOverlay(state.selectionOverlay);\n      state.selectedNodeId = null;\n      return;\n    case \"setSelectedNode\":\n      state.selectedNodeId = message.id;\n      showSelectionOverlay(message.id);\n      if (message.scroll)\n        scrollToElement(message.id);\n      return;\n    case \"setHoveredNode\":\n      if (!state.inspectMode)\n        showHoverOverlay(message.id);\n      return;\n    case \"screenshot\":\n      (async function() {\n        if (message.multipleSections) {\n          const results = await captureMultipleSections(message.sectionCount);\n          postToStudio({\n            action: \"screenshotResult\",\n            requestId: message.requestId,\n            multiple: true,\n            results\n          });\n          return;\n        }\n        const result = await captureScreenshot(message.options);\n        postToStudio({\n          action: \"screenshotResult\",\n          requestId: message.requestId,\n          multiple: false,\n          ...result\n        });\n      })();\n      return;\n    default:\n      logger.debug(\"Unknown action\", { action: message.action });\n      return;\n  }\n}\n\n// src/studio/bridge/bridge-init.ts\nfunction notifyAppLoaded() {\n  const config3 = getConfig();\n  postToStudio({ action: \"appLoaded\", url: window.location.href });\n  postToStudio({\n    action: \"appUpdated\",\n    url: window.location.href,\n    id: config3.pageId,\n    isInitialLoad: true,\n    errors: [],\n    warnings: []\n  });\n  postToStudio({\n    action: \"onPageTransitionEnd\",\n    url: window.location.href,\n    projectId: config3.projectId,\n    id: config3.pageId,\n    params: {}\n  });\n}\nfunction notifyAppUnloaded() {\n  postToStudio({ action: \"appUnloaded\", url: window.location.href });\n}\nfunction init() {\n  const config3 = getConfig();\n  const params = new URLSearchParams(window.location.search);\n  const studioEmbed = params.get(\"studio_embed\") === \"true\";\n  const isStandalone = window.parent === window && !studioEmbed;\n  if (isStandalone) {\n    logger.debug(\n      \"[StudioBridge] Not in iframe and not studio_embed mode, skipping initialization\"\n    );\n    return;\n  }\n  logger.debug(\"Initializing...\");\n  if (!isStandalone) {\n    injectOverlayStyles();\n    state.hoverOverlay = createOverlay(\"hover\");\n    state.selectionOverlay = createOverlay(\"selection\");\n    setupConsoleCapture();\n    setupErrorHandling();\n    setupInspectMode();\n  }\n  window.addEventListener(\"message\", handleStudioMessage);\n  if (!isStandalone) {\n    if (document.readyState === \"loading\") {\n      document.addEventListener(\"DOMContentLoaded\", function() {\n        notifyAppLoaded();\n        setupMutationObserver();\n      }, { once: true });\n    } else {\n      notifyAppLoaded();\n      setupMutationObserver();\n    }\n    window.addEventListener(\"beforeunload\", notifyAppUnloaded, { once: true });\n  }\n  const colorMode = params.get(\"color_mode\");\n  if (colorMode)\n    setColorMode(colorMode);\n  if (!isStandalone) {\n    const inspectModeParam = params.get(\"inspect_mode\");\n    if (inspectModeParam === \"true\") {\n      state.inspectMode = true;\n      logger.debug(\"Inspect mode enabled from query param\");\n    }\n  }\n  logger.debug(\"Initialized successfully\");\n}\n\n// src/studio/bridge/bridge-coordinator.ts\ninitConfig();\nvar config2 = getConfig();\nif (!config2.debugSkipInit) {\n  init();\n}\n";
+export const STUDIO_BRIDGE_BUNDLE: string = "// src/studio/bridge/bridge-logger.ts\nfunction normalizeContext(context) {\n  if (!context) return void 0;\n  if (context instanceof Error) {\n    return { error: context.message, ...context.stack ? { stack: context.stack } : {} };\n  }\n  return context;\n}\nfunction formatArgs(message, context) {\n  const normalized = normalizeContext(context);\n  if (!normalized || Object.keys(normalized).length === 0) {\n    return [message];\n  }\n  return [message, normalized];\n}\nvar logger = {\n  debug(message, context) {\n    console.debug(...formatArgs(message, context));\n  },\n  info(message, context) {\n    console.log(...formatArgs(message, context));\n  },\n  warn(message, context) {\n    console.warn(...formatArgs(message, context));\n  },\n  error(message, context) {\n    console.error(...formatArgs(message, context));\n  }\n};\n\n// src/studio/bridge/bridge-config.ts\nvar config = null;\nfunction initConfig() {\n  const raw = globalThis.__VF_BRIDGE_CONFIG__;\n  const params = new URLSearchParams(window.location.search);\n  const qsMode = params.get(\"vf_studio_mode\");\n  const resolveMode = (value) => value === \"simple\" || qsMode === \"simple\" ? \"simple\" : \"advanced\";\n  if (!raw || typeof raw !== \"object\") {\n    logger.warn(\"No bridge config found on window.__VF_BRIDGE_CONFIG__\");\n    config = {\n      projectId: \"\",\n      pageId: \"\",\n      pagePath: \"\",\n      wsUrl: \"\",\n      yjsGuid: \"\",\n      studioMode: resolveMode(void 0),\n      debugSkipInit: false,\n      debugExposeInternals: false\n    };\n    return;\n  }\n  config = {\n    projectId: String(raw.projectId ?? \"\"),\n    pageId: String(raw.pageId ?? \"\"),\n    pagePath: String(raw.pagePath ?? raw.pageId ?? \"\"),\n    wsUrl: String(raw.wsUrl ?? \"\"),\n    yjsGuid: String(raw.yjsGuid ?? \"\"),\n    studioMode: resolveMode(raw.studioMode),\n    debugSkipInit: !!raw.debugSkipInit,\n    debugExposeInternals: !!raw.debugExposeInternals\n  };\n}\nfunction getConfig() {\n  if (!config) {\n    throw new Error(\"[StudioBridge] Config not initialized. Call initConfig() first.\");\n  }\n  return config;\n}\n\n// src/studio/bridge/bridge-state.ts\nvar state = {\n  // Inspector\n  inspectMode: false,\n  selectedNodeId: null,\n  hoveredNodeId: null,\n  lastTreeSignature: \"\",\n  // Overlays\n  hoverOverlay: null,\n  selectionOverlay: null,\n  // Console\n  originalConsole: {},\n  logCounter: 0,\n  // Screenshot\n  html2canvasLoaded: false,\n  html2canvasPromise: null\n};\nvar CONSOLE_METHODS = [\n  \"log\",\n  \"debug\",\n  \"info\",\n  \"warn\",\n  \"error\",\n  \"table\",\n  \"clear\",\n  \"dir\"\n];\nvar DOM_IGNORE_TAGS = [\"SCRIPT\", \"STYLE\", \"LINK\", \"META\", \"NOSCRIPT\"];\n\n// src/studio/bridge/bridge-messaging.ts\nvar studioOrigin = null;\nfunction postToStudio(message) {\n  if (!window.parent || window.parent === window) return;\n  try {\n    window.parent.postMessage(message, studioOrigin || \"*\");\n  } catch (e) {\n    logger.debug(\"postMessage failed\", e instanceof Error ? e : { error: String(e) });\n  }\n}\nfunction isFromStudio(event) {\n  try {\n    if (!event.source || event.source === window) return false;\n    const url = new URL(event.origin || \"\");\n    const host = url.hostname;\n    const valid = host === \"localhost\" || host.endsWith(\".veryfront.org\") || host === \"veryfront.org\" || host.endsWith(\".veryfront.com\") || host === \"veryfront.com\" || host.endsWith(\".veryfront.dev\") || host === \"veryfront.dev\";\n    if (valid && !studioOrigin) {\n      studioOrigin = event.origin;\n    }\n    return valid;\n  } catch (_) {\n    return false;\n  }\n}\n\n// src/studio/bridge/bridge-styles.ts\nvar OVERLAY_CSS = `\n      /* ------------------------------------------------------------------ */\n      /* Overlays (hover / selection inspector)                              */\n      /* ------------------------------------------------------------------ */\n\n      .vf-overlay {\n        position: fixed;\n        pointer-events: none;\n        z-index: 99999;\n        box-sizing: border-box;\n        transition: all 0.05s ease-out;\n      }\n      .vf-overlay-hover {\n        border: 2px solid oklch(0.6852 0.162 241.8);\n        background: oklch(0.6852 0.162 241.8 / 0.06);\n      }\n      .vf-overlay-selection {\n        border: 2px solid oklch(0.6852 0.162 241.8);\n        background: oklch(0.6852 0.162 241.8 / 0.1);\n      }\n      .vf-overlay-label {\n        position: absolute;\n        top: -22px;\n        left: -2px;\n        background: oklch(0.6852 0.162 241.8);\n        color: white;\n        font-size: 11px;\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        padding: 2px 6px;\n        border-radius: 3px 3px 0 0;\n        white-space: nowrap;\n        pointer-events: none;\n      }\n      .vf-overlay-label-bottom {\n        top: auto;\n        bottom: -22px;\n        border-radius: 0 0 3px 3px;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Edit button (floating CTA)                                          */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-edit-button {\n        position: fixed;\n        right: 16px;\n        bottom: 16px;\n        z-index: 100001;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 9999px;\n        background: oklch(0.2768 0 0);\n        color: oklch(0.9512 0.008 98.88);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        font-size: 13px;\n        font-weight: 500;\n        line-height: 1;\n        padding: 10px 16px;\n        cursor: pointer;\n        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);\n        transition: transform 100ms ease, box-shadow 100ms ease;\n      }\n      .vf-markdown-edit-button:hover {\n        box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);\n      }\n      .vf-markdown-edit-button:active {\n        transform: scale(0.98);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Editor root                                                         */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor {\n        position: fixed;\n        inset: 0;\n        z-index: 100000;\n        background: oklch(1 0 0);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        display: none;\n      }\n\n      .vf-markdown-editor__history {\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 6px;\n        background: oklch(1 0 0);\n        color: oklch(0.2768 0 0);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        font-size: 13px;\n        line-height: 1;\n        min-width: 28px;\n        height: 28px;\n        padding: 0 8px;\n        cursor: pointer;\n        transition: background 75ms ease;\n      }\n      .vf-markdown-editor__history:hover {\n        background: oklch(0.93 0 0);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Surface (editor area)                                               */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__surface-wrap {\n        position: relative;\n        height: 100vh;\n      }\n\n      .vf-markdown-editor__surface {\n        width: 100%;\n        max-width: 980px;\n        margin: 0 auto;\n        height: 100%;\n        overflow: auto;\n        outline: none;\n        position: relative;\n        z-index: 1;\n        background: transparent;\n        padding: 32px 40px;\n        box-sizing: border-box;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Selection overlay                                                   */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__selection-overlay {\n        position: absolute;\n        inset: 0;\n        pointer-events: none;\n        z-index: 2;\n        display: none;\n      }\n\n      .vf-markdown-editor__selection-highlight {\n        position: absolute;\n        border-radius: 3px;\n        opacity: 0.26;\n      }\n\n      .vf-markdown-editor__selection-caret {\n        position: absolute;\n        width: 2px;\n        border-radius: 1px;\n      }\n\n      .vf-markdown-editor__selection-label {\n        position: absolute;\n        transform: translateY(-100%);\n        margin-top: -4px;\n        border-radius: 9999px;\n        padding: 1px 7px;\n        font-size: 10px;\n        line-height: 1.4;\n        white-space: nowrap;\n        color: oklch(1 0 0);\n        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Slash menu                                                          */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__slash-menu {\n        position: fixed;\n        z-index: 100005;\n        min-width: 240px;\n        max-width: 300px;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 8px;\n        background: oklch(1 0 0);\n        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);\n        padding: 4px;\n        display: none;\n      }\n\n      .vf-markdown-editor__slash-section {\n        padding: 8px 10px 4px;\n        font-size: 11px;\n        font-weight: 600;\n        color: oklch(0.55 0.005 95.11);\n        text-transform: none;\n        letter-spacing: 0;\n      }\n\n      .vf-markdown-editor__slash-item {\n        display: flex;\n        align-items: center;\n        gap: 10px;\n        width: 100%;\n        border: 0;\n        border-radius: 6px;\n        background: transparent;\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        text-align: left;\n        padding: 6px 10px;\n        cursor: pointer;\n        transition: background 75ms ease;\n      }\n\n      .vf-markdown-editor__slash-item:hover,\n      .vf-markdown-editor__slash-item[data-active='true'] {\n        background: oklch(0.93 0 0);\n      }\n\n      .vf-markdown-editor__slash-icon {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        width: 24px;\n        height: 24px;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 4px;\n        background: oklch(1 0 0);\n        font-size: 13px;\n        font-weight: 600;\n        color: oklch(0.2768 0 0);\n        flex-shrink: 0;\n      }\n\n      .vf-markdown-editor__slash-item-title {\n        display: block;\n        font-size: 13px;\n        font-weight: 500;\n        color: oklch(0.2768 0 0);\n        line-height: 1.35;\n        flex: 1;\n      }\n\n      .vf-markdown-editor__slash-item-desc {\n        display: none;\n      }\n\n      .vf-markdown-editor__slash-shortcut {\n        font-size: 11px;\n        color: oklch(0.55 0.005 95.11);\n        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n        flex-shrink: 0;\n      }\n\n      .vf-markdown-editor__slash-footer {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        padding: 6px 10px;\n        margin-top: 2px;\n        border-top: 1px solid oklch(0.9 0 0);\n        font-size: 11px;\n        color: oklch(0.55 0.005 95.11);\n      }\n\n      .vf-markdown-editor__slash-footer-key {\n        font-size: 10px;\n        color: oklch(0.55 0.005 95.11);\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 3px;\n        padding: 1px 4px;\n        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Inline toolbar                                                      */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__inline-toolbar {\n        position: fixed;\n        z-index: 100006;\n        display: none;\n        flex-direction: column;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 8px;\n        background: oklch(1 0 0);\n        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);\n        padding: 4px;\n      }\n\n      .vf-markdown-editor__inline-row {\n        display: flex;\n        align-items: center;\n        gap: 2px;\n        padding: 2px 0;\n      }\n\n      .vf-markdown-editor__inline-separator {\n        width: 1px;\n        height: 20px;\n        background: oklch(0.9 0 0);\n        margin: 0 2px;\n        flex-shrink: 0;\n      }\n\n      .vf-markdown-editor__inline-button {\n        border: 0;\n        border-radius: 6px;\n        background: transparent;\n        color: oklch(0.2768 0 0);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        font-size: 12px;\n        font-weight: 600;\n        line-height: 1;\n        min-width: 26px;\n        height: 26px;\n        padding: 0 7px;\n        cursor: pointer;\n        transition: background 75ms ease;\n      }\n\n      .vf-markdown-editor__inline-button:hover {\n        background: oklch(0.93 0 0);\n      }\n\n      .vf-markdown-editor__inline-button.active {\n        background: oklch(0.6852 0.162 241.8 / 0.14);\n        color: oklch(0.6852 0.162 241.8);\n      }\n\n      .vf-markdown-editor__inline-button[data-format='bold'] {\n        font-weight: 700;\n      }\n\n      .vf-markdown-editor__inline-button[data-format='italic'] {\n        font-style: italic;\n      }\n\n      .vf-markdown-editor__inline-button[data-format='strikethrough'] {\n        text-decoration: line-through;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Block type trigger                                                  */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__block-trigger {\n        border: 0;\n        border-radius: 6px;\n        background: transparent;\n        color: oklch(0.2768 0 0);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        font-size: 12px;\n        font-weight: 600;\n        line-height: 1;\n        height: 26px;\n        padding: 0 7px;\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        gap: 2px;\n        white-space: nowrap;\n        transition: background 75ms ease;\n      }\n\n      .vf-markdown-editor__block-trigger:hover {\n        background: oklch(0.93 0 0);\n      }\n\n      .vf-markdown-editor__block-trigger::after {\n        content: '\\\\25BE';\n        font-size: 10px;\n        color: oklch(0.55 0.005 95.11);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Block dropdown                                                      */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__block-dropdown {\n        position: absolute;\n        top: 100%;\n        left: 4px;\n        z-index: 100007;\n        min-width: 160px;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 6px;\n        background: oklch(1 0 0);\n        box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -2px rgba(0,0,0,0.1);\n        padding: 4px;\n        margin-top: 4px;\n        display: none;\n      }\n\n      .vf-markdown-editor__block-option {\n        display: block;\n        width: 100%;\n        border: 0;\n        border-radius: 6px;\n        background: transparent;\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        text-align: left;\n        padding: 6px 10px;\n        font-size: 13px;\n        font-weight: 500;\n        color: oklch(0.2768 0 0);\n        cursor: pointer;\n        transition: background 75ms ease;\n      }\n\n      .vf-markdown-editor__block-option:hover {\n        background: oklch(0.93 0 0);\n      }\n\n      .vf-markdown-editor__block-option.active {\n        background: oklch(0.6852 0.162 241.8 / 0.1);\n        color: oklch(0.6852 0.162 241.8);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Block drag handle                                                   */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__block-handle {\n        position: fixed;\n        z-index: 100007;\n        display: none;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 6px;\n        background: oklch(1 0 0);\n        color: oklch(0.2768 0 0);\n        font-size: 12px;\n        font-weight: 700;\n        line-height: 1;\n        width: 28px;\n        height: 28px;\n        padding: 0;\n        cursor: grab;\n        box-shadow: 0 1px 3px rgba(0,0,0,0.1), 0 1px 2px -1px rgba(0,0,0,0.1);\n        transition: background 75ms ease, box-shadow 75ms ease;\n      }\n\n      .vf-markdown-editor__block-handle:hover {\n        background: oklch(0.6852 0.162 241.8 / 0.1);\n      }\n\n      .vf-markdown-editor__block-handle[data-dragging='true'] {\n        cursor: grabbing;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Block drop indicator                                                */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__block-drop-indicator {\n        position: fixed;\n        z-index: 100006;\n        display: none;\n        height: 2px;\n        border-radius: 9999px;\n        background: oklch(0.6852 0.162 241.8);\n        box-shadow: 0 1px 6px oklch(0.6852 0.162 241.8 / 0.5);\n      }\n\n      .vf-markdown-editor__block-drop-label {\n        position: fixed;\n        z-index: 100007;\n        display: none;\n        border-radius: 9999px;\n        border: 1px solid oklch(0.6852 0.162 241.8 / 0.24);\n        background: oklch(1 0 0 / 0.96);\n        color: oklch(0.2768 0 0);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        font-size: 11px;\n        font-weight: 600;\n        line-height: 1.2;\n        padding: 3px 8px;\n        box-shadow: 0 1px 3px rgba(0,0,0,0.1), 0 1px 2px -1px rgba(0,0,0,0.1);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Block drag ghost                                                    */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__block-drag-ghost {\n        position: fixed;\n        top: -9999px;\n        left: -9999px;\n        width: 260px;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 8px;\n        background: oklch(1 0 0);\n        box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);\n        padding: 8px 10px;\n      }\n\n      .vf-markdown-editor__block-drag-ghost-title {\n        display: block;\n        font-size: 11px;\n        font-weight: 700;\n        color: oklch(0.2768 0 0);\n      }\n\n      .vf-markdown-editor__block-drag-ghost-text {\n        display: block;\n        margin-top: 4px;\n        font-size: 11px;\n        color: oklch(0.55 0.005 95.11);\n        line-height: 1.35;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* MDX blocks bar                                                      */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__mdx-blocks {\n        display: none;\n        gap: 8px;\n        padding: 8px 16px;\n        border-bottom: 1px solid oklch(0.9 0 0);\n        background: oklch(0.97 0 0 / 0.95);\n        overflow-x: auto;\n      }\n\n      .vf-markdown-editor__mdx-block {\n        display: inline-flex;\n        align-items: center;\n        gap: 8px;\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 6px;\n        background: oklch(1 0 0);\n        padding: 6px 8px;\n      }\n\n      .vf-markdown-editor__mdx-block-label {\n        font-size: 11px;\n        color: oklch(0.2768 0 0);\n        white-space: nowrap;\n      }\n\n      .vf-markdown-editor__mdx-note {\n        font-size: 10px;\n        color: oklch(0.55 0.005 95.11);\n        white-space: nowrap;\n      }\n\n      .vf-markdown-editor__mdx-open {\n        border: 1px solid oklch(0.84 0.0055 95.11);\n        border-radius: 6px;\n        background: oklch(1 0 0);\n        color: oklch(0.2768 0 0);\n        font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n        font-size: 11px;\n        line-height: 1;\n        padding: 5px 7px;\n        cursor: pointer;\n        white-space: nowrap;\n        transition: background 75ms ease;\n      }\n      .vf-markdown-editor__mdx-open:hover {\n        background: oklch(0.93 0 0);\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Lexical surface overrides                                           */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__surface [data-lexical-editor] {\n        outline: none;\n      }\n\n      .vf-markdown-editor__surface s,\n      .vf-markdown-editor__surface del,\n      .vf-markdown-editor__surface [style*='line-through'] {\n        text-decoration: line-through;\n      }\n\n      .vf-markdown-editor__surface p:empty::before {\n        content: \"Type '/' for commands\";\n        color: oklch(0.55 0.005 95.11 / 0.6);\n        pointer-events: none;\n        font-style: normal;\n      }\n\n      .vf-markdown-editor__surface h1:empty::before {\n        content: 'Heading 1';\n        color: oklch(0.55 0.005 95.11 / 0.6);\n        pointer-events: none;\n      }\n\n      .vf-markdown-editor__surface h2:empty::before {\n        content: 'Heading 2';\n        color: oklch(0.55 0.005 95.11 / 0.6);\n        pointer-events: none;\n      }\n\n      .vf-markdown-editor__surface h3:empty::before {\n        content: 'Heading 3';\n        color: oklch(0.55 0.005 95.11 / 0.6);\n        pointer-events: none;\n      }\n\n      .vf-markdown-editor__surface blockquote:empty::before {\n        content: 'Quote';\n        color: oklch(0.55 0.005 95.11 / 0.6);\n        pointer-events: none;\n      }\n\n      .vf-markdown-editor__surface p {\n        min-height: 1.5em;\n      }\n\n      /* ------------------------------------------------------------------ */\n      /* Textarea fallback                                                   */\n      /* ------------------------------------------------------------------ */\n\n      .vf-markdown-editor__textarea {\n        width: 100%;\n        height: 100vh;\n        border: 0;\n        outline: none;\n        resize: none;\n        display: none;\n        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;\n        font-size: 14px;\n        line-height: 1.6;\n        color: oklch(0.2768 0 0);\n        background: transparent;\n        padding: 16px;\n        box-sizing: border-box;\n      }\n\n      /* ================================================================== */\n      /* DARK MODE                                                           */\n      /* ================================================================== */\n\n      [data-theme='dark'] .vf-markdown-editor {\n        background: oklch(0.2768 0 0);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__history {\n        background: oklch(0.3211 0 0);\n        border-color: oklch(0.42 0.0017 106.48);\n        color: oklch(0.9512 0.008 98.88);\n      }\n      [data-theme='dark'] .vf-markdown-editor__history:hover {\n        background: oklch(0.25 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__textarea {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      /* Slash menu \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__slash-menu {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.21 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-section {\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-item:hover,\n      [data-theme='dark'] .vf-markdown-editor__slash-item[data-active='true'] {\n        background: oklch(0.25 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-icon {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.3211 0 0);\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-item-title {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-shortcut {\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-footer {\n        border-top-color: oklch(0.3 0.01 220);\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__slash-footer-key {\n        border-color: oklch(0.42 0.0017 106.48);\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      /* Inline toolbar \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__inline-toolbar {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.21 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__inline-separator {\n        background: oklch(0.3 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__inline-button {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__inline-button:hover {\n        background: oklch(0.25 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__inline-button.active {\n        background: oklch(0.6852 0.162 241.8 / 0.2);\n        color: oklch(0.75 0.14 241.8);\n      }\n\n      /* Block trigger \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__block-trigger {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-trigger:hover {\n        background: oklch(0.25 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-trigger::after {\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      /* Block dropdown \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__block-dropdown {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.21 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-option {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-option:hover {\n        background: oklch(0.25 0.01 220);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-option.active {\n        background: oklch(0.6852 0.162 241.8 / 0.2);\n        color: oklch(0.75 0.14 241.8);\n      }\n\n      /* Placeholder text \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__surface p:empty::before,\n      [data-theme='dark'] .vf-markdown-editor__surface h1:empty::before,\n      [data-theme='dark'] .vf-markdown-editor__surface h2:empty::before,\n      [data-theme='dark'] .vf-markdown-editor__surface h3:empty::before,\n      [data-theme='dark'] .vf-markdown-editor__surface blockquote:empty::before {\n        color: oklch(0.5338 0.0046 106.55 / 0.5);\n      }\n\n      /* Block drag \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__block-handle {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.3211 0 0);\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-handle:hover {\n        background: oklch(0.6852 0.162 241.8 / 0.2);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-drop-label {\n        border-color: oklch(0.6852 0.162 241.8 / 0.35);\n        background: oklch(0.18 0.01 220 / 0.96);\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-drag-ghost {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.3211 0 0);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-drag-ghost-title {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__block-drag-ghost-text {\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      /* MDX blocks \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-editor__mdx-blocks {\n        border-bottom-color: oklch(0.3 0.01 220);\n        background: oklch(0.18 0.01 220 / 0.8);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__mdx-block {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.3211 0 0);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__mdx-block-label {\n        color: oklch(0.9512 0.008 98.88);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__mdx-note {\n        color: oklch(0.5338 0.0046 106.55);\n      }\n\n      [data-theme='dark'] .vf-markdown-editor__mdx-open {\n        border-color: oklch(0.42 0.0017 106.48);\n        background: oklch(0.2768 0 0);\n        color: oklch(0.9512 0.008 98.88);\n      }\n      [data-theme='dark'] .vf-markdown-editor__mdx-open:hover {\n        background: oklch(0.25 0.01 220);\n      }\n\n      /* Edit button \\u2013 dark */\n\n      [data-theme='dark'] .vf-markdown-edit-button {\n        background: oklch(0.9512 0.008 98.88);\n        color: oklch(0.2768 0 0);\n        border-color: oklch(0.42 0.0017 106.48);\n      }\n`;\nfunction injectOverlayStyles() {\n  if (document.getElementById(\"vf-overlay-styles\")) return;\n  const style = document.createElement(\"style\");\n  style.id = \"vf-overlay-styles\";\n  style.textContent = OVERLAY_CSS;\n  try {\n    document.head.appendChild(style);\n    if (!style.sheet) {\n      logger.warn(\"Inline style injection may be blocked by CSP (style-src)\");\n    }\n  } catch (error) {\n    logger.warn(\n      \"Failed to inject bridge styles. This may be caused by CSP style-src restrictions.\",\n      error instanceof Error ? error : {\n        error: String(error)\n      }\n    );\n  }\n}\n\n// src/studio/bridge/bridge-constants.ts\nvar DATA_VF_ID = \"data-vf-id\";\nvar DATA_VF_SELECTOR = \"data-vf-selector\";\nvar DATA_VF_TEXT = \"data-vf-text\";\nvar DATA_VF_IGNORE = \"data-vf-ignore\";\nvar DATA_NODE_ID = \"data-node-id\";\nvar DATA_NODE_FILE = \"data-node-file\";\nvar DATA_NODE_NAME = \"data-node-name\";\nvar DATA_NODE_LINE = \"data-node-line\";\nvar DATA_NODE_COLUMN = \"data-node-column\";\nvar DATA_NODE_SOURCE = \"data-node-source\";\n\n// src/studio/bridge/bridge-utils.ts\nfunction debounce(fn, ms) {\n  let timer;\n  const debounced = function(...args) {\n    clearTimeout(timer);\n    timer = setTimeout(() => {\n      fn.apply(this, args);\n    }, ms);\n  };\n  debounced.cancel = () => {\n    clearTimeout(timer);\n    timer = void 0;\n  };\n  return debounced;\n}\n\n// src/studio/bridge/bridge-inspector.ts\nfunction createOverlay(type) {\n  const overlay = document.createElement(\"div\");\n  overlay.className = \"vf-overlay vf-overlay-\" + type;\n  overlay.setAttribute(DATA_VF_IGNORE, \"true\");\n  const label = document.createElement(\"div\");\n  label.className = \"vf-overlay-label\";\n  overlay.appendChild(label);\n  overlay.style.display = \"none\";\n  document.body.appendChild(overlay);\n  return overlay;\n}\nfunction hideOverlay(overlay) {\n  if (overlay) overlay.style.display = \"none\";\n}\nfunction positionOverlay(overlay, element, nodeName) {\n  if (!overlay) return;\n  if (!element) {\n    hideOverlay(overlay);\n    return;\n  }\n  const rect = element.getBoundingClientRect();\n  overlay.style.display = \"block\";\n  overlay.style.top = rect.top + \"px\";\n  overlay.style.left = rect.left + \"px\";\n  overlay.style.width = rect.width + \"px\";\n  overlay.style.height = rect.height + \"px\";\n  const label = overlay.querySelector(\".vf-overlay-label\");\n  if (label) {\n    label.textContent = nodeName;\n    if (rect.top < 24) {\n      label.classList.add(\"vf-overlay-label-bottom\");\n    } else {\n      label.classList.remove(\"vf-overlay-label-bottom\");\n    }\n  }\n}\nfunction getNodeName(element) {\n  const vfId = element.getAttribute(DATA_VF_ID);\n  if (vfId) return vfId.split(\"_\")[0] ?? vfId;\n  return element.tagName.toLowerCase();\n}\nfunction findElementById(nodeId) {\n  if (!nodeId) return null;\n  return document.querySelector(\"[\" + DATA_VF_ID + '=\"' + nodeId + '\"]') || document.querySelector(\"[\" + DATA_VF_SELECTOR + '=\"' + nodeId + '\"]') || document.querySelector(\"[\" + DATA_NODE_ID + '=\"' + nodeId + '\"]');\n}\nfunction isValidElement(el) {\n  return !!el && el.nodeType === Node.ELEMENT_NODE && !DOM_IGNORE_TAGS.includes(el.tagName) && !el.hasAttribute(DATA_VF_IGNORE) && el.style.display !== \"none\";\n}\nfunction getNodeType(el) {\n  const vfId = el.getAttribute(DATA_VF_ID) || \"\";\n  if (vfId && /^[A-Z]/.test(vfId)) return \"component\";\n  if (el.hasAttribute(DATA_VF_TEXT)) return \"text\";\n  if (el.getAttribute(DATA_NODE_SOURCE) === \"md\") return \"markdown\";\n  return \"element\";\n}\nfunction buildNavigatorTree(root) {\n  const config3 = getConfig();\n  let nodeIndex = 0;\n  function processElement(el, parentId) {\n    if (!isValidElement(el)) {\n      const children = [];\n      Array.from(el.children || []).forEach((child) => {\n        children.push(...processElement(child, parentId));\n      });\n      return children;\n    }\n    let id = el.getAttribute(DATA_VF_ID) || el.getAttribute(DATA_NODE_ID) || el.getAttribute(DATA_VF_SELECTOR);\n    if (!id) {\n      id = \"vf-\" + el.tagName.toLowerCase() + \"-\" + ++nodeIndex;\n      el.setAttribute(DATA_VF_SELECTOR, id);\n    }\n    const vfId = el.getAttribute(DATA_VF_ID);\n    const name = vfId ? vfId.split(\"_\")[0] ?? vfId : el.tagName.toLowerCase();\n    const node = {\n      id,\n      name,\n      type: getNodeType(el),\n      path: config3.pagePath,\n      parentId,\n      start: {\n        line: parseInt(el.getAttribute(DATA_NODE_LINE) || \"0\", 10),\n        column: parseInt(el.getAttribute(DATA_NODE_COLUMN) || \"0\", 10)\n      },\n      end: { line: 0, column: 0 },\n      children: [],\n      text: el.hasAttribute(DATA_VF_TEXT) ? el.textContent?.trim() : void 0,\n      isRemote: false\n    };\n    Array.from(el.children || []).forEach((child) => {\n      node.children.push(...processElement(child, id));\n    });\n    return [node];\n  }\n  const rootNode = {\n    id: \"root\",\n    name: \"root\",\n    type: \"root\",\n    path: \"\",\n    parentId: \"\",\n    start: { line: 0, column: 0 },\n    end: { line: 0, column: 0 },\n    children: [],\n    isRemote: false\n  };\n  Array.from(root.children || []).forEach((child) => {\n    rootNode.children.push(...processElement(child, \"root\"));\n  });\n  return rootNode;\n}\nfunction createTreeSignature(root) {\n  const validElements = Array.from(root.querySelectorAll(\"*\")).filter((el) => isValidElement(el));\n  return validElements.length + \"-\" + validElements.map((el) => el.tagName).join(\"\");\n}\nvar treeUpdateTimer = null;\nvar mutationObserver = null;\nfunction sendTreeUpdate() {\n  const config3 = getConfig();\n  const root = document.getElementById(\"root\") || document.body;\n  if (!root) return;\n  const signature = createTreeSignature(root);\n  if (signature === state.lastTreeSignature) return;\n  state.lastTreeSignature = signature;\n  postToStudio({\n    action: \"treeUpdated\",\n    id: config3.pageId,\n    url: window.location.href,\n    tree: buildNavigatorTree(root),\n    sourceHash: globalThis.__VERYFRONT_SOURCE_HASH__ || null\n  });\n}\nfunction debouncedTreeUpdate() {\n  if (treeUpdateTimer) clearTimeout(treeUpdateTimer);\n  treeUpdateTimer = setTimeout(sendTreeUpdate, 150);\n}\nfunction setupMutationObserver() {\n  const root = document.getElementById(\"root\") || document.body;\n  if (!root) return;\n  mutationObserver = new MutationObserver(function(mutations) {\n    const hasRelevantChanges = mutations.some(\n      (m) => m.type === \"childList\" || m.type === \"characterData\"\n    );\n    if (!hasRelevantChanges) return;\n    if (state.selectedNodeId && !findElementById(state.selectedNodeId)) {\n      state.selectedNodeId = null;\n      hideOverlay(state.selectionOverlay);\n      postToStudio({ action: \"setSelectedNode\", id: null });\n    }\n    debouncedTreeUpdate();\n  });\n  mutationObserver.observe(root, { childList: true, characterData: true, subtree: true });\n  sendTreeUpdate();\n}\nfunction showOverlay(overlay, nodeId) {\n  if (!nodeId) {\n    hideOverlay(overlay);\n    return;\n  }\n  const el = findElementById(nodeId);\n  if (!el) {\n    hideOverlay(overlay);\n    return;\n  }\n  positionOverlay(overlay, el, getNodeName(el));\n}\nfunction showHoverOverlay(nodeId) {\n  showOverlay(state.hoverOverlay, nodeId);\n}\nfunction showSelectionOverlay(nodeId) {\n  showOverlay(state.selectionOverlay, nodeId);\n}\nfunction scrollToElement(nodeId) {\n  const el = document.querySelector(\"[\" + DATA_VF_ID + '=\"' + nodeId + '\"]') || document.querySelector(\"[\" + DATA_NODE_ID + '=\"' + nodeId + '\"]') || document.querySelector(\"[\" + DATA_VF_SELECTOR + '*=\"' + nodeId + '\"]');\n  if (el) el.scrollIntoView({ behavior: \"smooth\", block: \"center\" });\n}\nfunction getDirectText(el) {\n  let text = \"\";\n  for (let i = 0; i < el.childNodes.length; i++) {\n    const node = el.childNodes[i];\n    if (node?.nodeType === Node.TEXT_NODE) {\n      text += node.textContent || \"\";\n    }\n  }\n  return text.trim();\n}\nfunction setupInspectMode() {\n  const INSPECTABLE_SELECTOR = \"[\" + DATA_VF_ID + \"], [\" + DATA_VF_SELECTOR + \"], [\" + DATA_NODE_ID + \"], [\" + DATA_NODE_FILE + \"]\";\n  function getElementId(el) {\n    return el.getAttribute(DATA_VF_ID) || el.getAttribute(DATA_NODE_ID) || el.getAttribute(DATA_VF_SELECTOR);\n  }\n  document.addEventListener(\n    \"click\",\n    function(event) {\n      if (!state.inspectMode) return;\n      event.preventDefault();\n      event.stopPropagation();\n      const target = event.target.closest(INSPECTABLE_SELECTOR);\n      if (!target) {\n        state.selectedNodeId = null;\n        hideOverlay(state.selectionOverlay);\n        postToStudio({ action: \"setSelectedNode\", id: null });\n        return;\n      }\n      const id = getElementId(target);\n      state.selectedNodeId = id;\n      showSelectionOverlay(id);\n      postToStudio({\n        action: \"setSelectedNode\",\n        id,\n        node: {\n          name: target.getAttribute(DATA_NODE_NAME) || target.tagName.toLowerCase(),\n          type: getNodeType(target),\n          file: target.getAttribute(DATA_NODE_FILE) || getConfig().pagePath,\n          line: parseInt(target.getAttribute(DATA_NODE_LINE) || \"0\", 10),\n          column: parseInt(target.getAttribute(DATA_NODE_COLUMN) || \"0\", 10),\n          text: getDirectText(target).slice(0, 200)\n        }\n      });\n    },\n    true\n  );\n  document.addEventListener(\"pointerover\", function(event) {\n    if (!state.inspectMode || event.pointerType === \"touch\") return;\n    const target = event.target.closest(INSPECTABLE_SELECTOR);\n    if (!target) return;\n    const id = getElementId(target);\n    if (id === state.hoveredNodeId) return;\n    state.hoveredNodeId = id;\n    showHoverOverlay(id);\n  });\n  document.addEventListener(\"pointerout\", function(event) {\n    if (!state.inspectMode || event.pointerType === \"touch\") return;\n    const target = event.target.closest(INSPECTABLE_SELECTOR);\n    if (!target) return;\n    const relatedTarget = event.relatedTarget;\n    if (relatedTarget && target.contains(relatedTarget)) return;\n    state.hoveredNodeId = null;\n    hideOverlay(state.hoverOverlay);\n  });\n  const updateOverlays = debounce(function() {\n    if (state.inspectMode && state.hoveredNodeId) showHoverOverlay(state.hoveredNodeId);\n    if (state.selectedNodeId) showSelectionOverlay(state.selectedNodeId);\n  }, 16);\n  window.addEventListener(\"scroll\", updateOverlays, true);\n  window.addEventListener(\"resize\", updateOverlays);\n}\nfunction setColorMode(mode) {\n  document.documentElement.setAttribute(\"data-theme\", mode);\n  document.documentElement.classList.remove(\"light\", \"dark\");\n  document.documentElement.classList.add(mode);\n}\n\n// src/studio/bridge/bridge-console.ts\nfunction setupConsoleCapture() {\n  const consoleObj = console;\n  CONSOLE_METHODS.forEach((method) => {\n    state.originalConsole[method] = consoleObj[method];\n    consoleObj[method] = function(...args) {\n      state.originalConsole[method].apply(console, args);\n      const logId = \"vf-\" + Date.now() + \"-\" + ++state.logCounter;\n      const formattedData = args.map((arg) => {\n        try {\n          if (arg instanceof Error) {\n            return { __isError: true, message: arg.message, stack: arg.stack, name: arg.name };\n          }\n          if (arg === void 0) return { __isUndefined: true };\n          if (arg === null) return null;\n          if (typeof arg === \"function\") {\n            return { __isFunction: true, name: arg.name || \"anonymous\" };\n          }\n          if (typeof arg === \"symbol\") return { __isSymbol: true, description: arg.description };\n          if (typeof arg === \"object\") return JSON.parse(JSON.stringify(arg));\n          return arg;\n        } catch (_) {\n          return String(arg);\n        }\n      });\n      postToStudio({\n        action: \"logEvent\",\n        value: {\n          id: logId,\n          method,\n          data: formattedData,\n          timestamp: (/* @__PURE__ */ new Date()).toISOString()\n        }\n      });\n    };\n  });\n}\nfunction setupErrorHandling() {\n  function hideOverlays() {\n    hideOverlay(state.hoverOverlay);\n    hideOverlay(state.selectionOverlay);\n  }\n  window.addEventListener(\"error\", function(event) {\n    hideOverlays();\n    postToStudio({\n      action: \"runtimeError\",\n      url: window.location.href,\n      errors: [\n        {\n          type: \"error\",\n          message: event.message,\n          file: event.filename,\n          line: event.lineno,\n          column: event.colno\n        }\n      ]\n    });\n  });\n  window.addEventListener(\"unhandledrejection\", function(event) {\n    hideOverlays();\n    const reason = event.reason;\n    postToStudio({\n      action: \"runtimeError\",\n      url: window.location.href,\n      errors: [\n        {\n          type: \"error\",\n          message: reason instanceof Error ? reason.message : String(reason),\n          file: reason instanceof Error ? reason.stack : void 0\n        }\n      ]\n    });\n  });\n}\n\n// src/studio/bridge/bridge-screenshot.ts\nfunction loadHtml2Canvas() {\n  if (state.html2canvasLoaded) return Promise.resolve();\n  if (state.html2canvasPromise) return state.html2canvasPromise;\n  state.html2canvasPromise = new Promise((resolve, reject) => {\n    const script = document.createElement(\"script\");\n    script.src = \"https://cdn.jsdelivr.net/npm/html2canvas-pro@2.0.0/dist/html2canvas-pro.min.js\";\n    script.onload = () => {\n      state.html2canvasLoaded = true;\n      resolve();\n    };\n    script.onerror = (event) => {\n      logger.warn(\n        \"Failed to load html2canvas script. This may be caused by CSP script-src restrictions.\",\n        { event: String(event) }\n      );\n      reject(new Error(\"Failed to load html2canvas script\"));\n    };\n    try {\n      document.head.appendChild(script);\n    } catch (error) {\n      logger.warn(\n        \"Failed to append html2canvas script element. This may be caused by CSP script-src restrictions.\",\n        error instanceof Error ? error : { error: String(error) }\n      );\n      reject(\n        error instanceof Error ? error : new Error(\"Failed to append html2canvas script element\")\n      );\n    }\n  });\n  return state.html2canvasPromise;\n}\nasync function captureScreenshot(options) {\n  const { scrollTo, fullPage, quality = 0.8 } = options || {};\n  const originalScrollY = window.scrollY;\n  try {\n    await loadHtml2Canvas();\n    if (typeof scrollTo === \"number\") {\n      window.scrollTo(0, scrollTo);\n      await new Promise((r) => setTimeout(r, 150));\n    }\n    const canvasOptions = {\n      useCORS: true,\n      logging: false,\n      scale: window.devicePixelRatio || 1\n    };\n    if (fullPage) {\n      canvasOptions.height = document.documentElement.scrollHeight;\n      canvasOptions.windowHeight = document.documentElement.scrollHeight;\n      canvasOptions.y = 0;\n      window.scrollTo(0, 0);\n      await new Promise((r) => setTimeout(r, 100));\n    }\n    const html2canvasFn = window.html2canvas.default || window.html2canvas;\n    const canvas = await html2canvasFn(document.body, canvasOptions);\n    if (!canvas || canvas.width === 0 || canvas.height === 0) {\n      logger.error(\"html2canvas produced empty canvas\", {\n        width: canvas?.width,\n        height: canvas?.height\n      });\n      window.scrollTo(0, originalScrollY);\n      return {\n        success: false,\n        error: \"html2canvas produced empty canvas (0x0 dimensions)\"\n      };\n    }\n    const dataUrl = canvas.toDataURL(\"image/png\", quality);\n    if (!dataUrl || !dataUrl.startsWith(\"data:image/\") || dataUrl.length < 100) {\n      logger.error(\"html2canvas produced invalid data URL\", {\n        dataUrlPreview: dataUrl?.substring(0, 50)\n      });\n      window.scrollTo(0, originalScrollY);\n      return {\n        success: false,\n        error: \"html2canvas produced invalid image data\"\n      };\n    }\n    window.scrollTo(0, originalScrollY);\n    return {\n      success: true,\n      data: dataUrl,\n      width: canvas.width,\n      height: canvas.height,\n      scrollY: window.scrollY,\n      totalHeight: document.documentElement.scrollHeight,\n      viewportHeight: window.innerHeight,\n      url: window.location.href\n    };\n  } catch (error) {\n    logger.error(\"html2canvas error\", error instanceof Error ? error : { error: String(error) });\n    window.scrollTo(0, originalScrollY);\n    return {\n      success: false,\n      error: error instanceof Error ? error.message : String(error)\n    };\n  }\n}\nasync function captureMultipleSections(sectionCount) {\n  const originalScrollY = window.scrollY;\n  const results = [];\n  const totalHeight = document.documentElement.scrollHeight;\n  const viewportHeight = window.innerHeight;\n  const sections = sectionCount || Math.ceil(totalHeight / viewportHeight);\n  try {\n    for (let i = 0; i < sections; i++) {\n      const scrollY = Math.min(i * viewportHeight, totalHeight - viewportHeight);\n      const result = await captureScreenshot({ scrollTo: scrollY });\n      if (result.success) {\n        results.push({ ...result, section: i + 1, totalSections: sections });\n      }\n    }\n  } finally {\n    window.scrollTo(0, originalScrollY);\n  }\n  return results;\n}\n\n// src/studio/bridge/bridge-message-handler.ts\nvar SAFE_PROTOCOLS = /* @__PURE__ */ new Set([\"http:\", \"https:\"]);\nfunction isSafeNavigationUrl(url) {\n  if (url.startsWith(\"/\")) return true;\n  try {\n    const parsed = new URL(url, window.location.origin);\n    return SAFE_PROTOCOLS.has(parsed.protocol);\n  } catch {\n    return false;\n  }\n}\nfunction handleStudioMessage(event) {\n  if (!isFromStudio(event)) return;\n  const message = event.data;\n  if (!message?.action) return;\n  const config3 = getConfig();\n  switch (message.action) {\n    case \"routeChange\":\n      if (message.url) {\n        if (!isSafeNavigationUrl(message.url)) {\n          logger.warn(\"[StudioBridge] Blocked unsafe URL in routeChange\", { url: message.url });\n          return;\n        }\n        if (state.selectedNodeId) {\n          state.selectedNodeId = null;\n          hideOverlay(state.selectionOverlay);\n          postToStudio({ action: \"setSelectedNode\", id: null });\n        }\n        postToStudio({\n          action: \"onPageTransitionStart\",\n          url: message.url,\n          projectId: config3.projectId\n        });\n        window.location.href = message.url;\n      }\n      return;\n    case \"reload\":\n      window.location.reload();\n      return;\n    case \"goBack\":\n      window.history.back();\n      return;\n    case \"goForward\":\n      window.history.forward();\n      return;\n    case \"colorMode\":\n      setColorMode(message.value);\n      return;\n    case \"toggleInspectMode\":\n      state.inspectMode = message.value;\n      if (state.inspectMode) return;\n      hideOverlay(state.hoverOverlay);\n      state.hoveredNodeId = null;\n      if (!message.deselectElements) return;\n      hideOverlay(state.selectionOverlay);\n      state.selectedNodeId = null;\n      return;\n    case \"setSelectedNode\":\n      state.selectedNodeId = message.id;\n      showSelectionOverlay(message.id);\n      if (message.scroll) scrollToElement(message.id);\n      return;\n    case \"setHoveredNode\":\n      if (!state.inspectMode) showHoverOverlay(message.id);\n      return;\n    case \"screenshot\":\n      (async function() {\n        if (message.multipleSections) {\n          const results = await captureMultipleSections(message.sectionCount);\n          postToStudio({\n            action: \"screenshotResult\",\n            requestId: message.requestId,\n            multiple: true,\n            results\n          });\n          return;\n        }\n        const result = await captureScreenshot(message.options);\n        postToStudio({\n          action: \"screenshotResult\",\n          requestId: message.requestId,\n          multiple: false,\n          ...result\n        });\n      })();\n      return;\n    default:\n      logger.debug(\"Unknown action\", { action: message.action });\n      return;\n  }\n}\n\n// src/studio/bridge/bridge-init.ts\nfunction notifyAppLoaded() {\n  const config3 = getConfig();\n  postToStudio({ action: \"appLoaded\", url: window.location.href });\n  postToStudio({\n    action: \"appUpdated\",\n    url: window.location.href,\n    id: config3.pageId,\n    isInitialLoad: true,\n    errors: [],\n    warnings: []\n  });\n  postToStudio({\n    action: \"onPageTransitionEnd\",\n    url: window.location.href,\n    projectId: config3.projectId,\n    id: config3.pageId,\n    params: {}\n  });\n}\nfunction notifyAppUnloaded() {\n  postToStudio({ action: \"appUnloaded\", url: window.location.href });\n}\nfunction init() {\n  const config3 = getConfig();\n  const params = new URLSearchParams(window.location.search);\n  const studioEmbed = params.get(\"studio_embed\") === \"true\";\n  const isStandalone = window.parent === window && !studioEmbed;\n  if (isStandalone) {\n    logger.debug(\n      \"[StudioBridge] Not in iframe and not studio_embed mode, skipping initialization\"\n    );\n    return;\n  }\n  logger.debug(\"Initializing...\");\n  if (!isStandalone) {\n    injectOverlayStyles();\n    state.hoverOverlay = createOverlay(\"hover\");\n    state.selectionOverlay = createOverlay(\"selection\");\n    setupConsoleCapture();\n    setupErrorHandling();\n    setupInspectMode();\n  }\n  window.addEventListener(\"message\", handleStudioMessage);\n  if (!isStandalone) {\n    if (document.readyState === \"loading\") {\n      document.addEventListener(\"DOMContentLoaded\", function() {\n        notifyAppLoaded();\n        setupMutationObserver();\n      }, { once: true });\n    } else {\n      notifyAppLoaded();\n      setupMutationObserver();\n    }\n    window.addEventListener(\"beforeunload\", notifyAppUnloaded, { once: true });\n  }\n  const colorMode = params.get(\"color_mode\");\n  if (colorMode) setColorMode(colorMode);\n  if (!isStandalone) {\n    const inspectModeParam = params.get(\"inspect_mode\");\n    if (inspectModeParam === \"true\") {\n      state.inspectMode = true;\n      logger.debug(\"Inspect mode enabled from query param\");\n    }\n  }\n  logger.debug(\"Initialized successfully\");\n}\n\n// src/studio/bridge/bridge-coordinator.ts\ninitConfig();\nvar config2 = getConfig();\nif (!config2.debugSkipInit) {\n  init();\n}\n";

package/src/src/task/runner.ts

@@ -7,6 +7,7 @@
 
 import { logger as baseLogger } from "../utils/index.js";
 import { env as getProcessEnv } from "../platform/compat/process.js";
+import { buildTaskContextEnv } from "../jobs/runtime-env.js";
 import type { DiscoveredTask } from "./discovery.js";
 import type { TaskContext } from "./types.js";
 
@@ -61,14 +62,7 @@ export async function runTask(options: RunTaskOptions): Promise<TaskRunResult> {
   }
 
   const allEnv = getProcessEnv();
-  const env: Record<string, string> = envAllowlist
-    ? Object.fromEntries(
-      envAllowlist.flatMap((k) => {
-        const value = allEnv[k];
-        return value === undefined ? [] : [[k, value] as const];
-      }),
-    )
-    : { ...allEnv };
+  const env = buildTaskContextEnv(allEnv, envAllowlist);
 
   const ctx: TaskContext = {
     env,

package/src/src/utils/redis-client.ts

@@ -19,10 +19,13 @@ export interface RedisClient {
   isOpen?: boolean;
 }
 
-interface RedisClientOptions {
+export interface RedisClientOptions {
   url?: string;
   connectTimeout?: number;
   autoReconnect?: boolean;
+  tls?: boolean;
+  password?: string;
+  username?: string;
 }
 
 let sharedClient: RedisClient | null = null;
@@ -64,12 +67,14 @@ export async function getRedisClient(options: RedisClientOptions = {}): Promise<
 }
 
 async function createClient(options: RedisClientOptions): Promise<RedisClient> {
-  let createClientFn: ((opts: { url?: string }) => RedisClient) | undefined;
+  // deno-lint-ignore no-explicit-any
+  let createClientFn: ((opts: Record<string, any>) => RedisClient) | undefined;
 
   try {
     const redisClientModule = "npm:@redis/client@1.5.8";
     const mod = await import(redisClientModule);
-    createClientFn = mod.createClient as (opts: { url?: string }) => RedisClient;
+    // deno-lint-ignore no-explicit-any
+    createClientFn = mod.createClient as (opts: Record<string, any>) => RedisClient;
   } catch (error) {
     logger.debug("Failed to load @redis/client module", { error });
     throw DEPENDENCY_MISSING.create({
@@ -78,7 +83,30 @@ async function createClient(options: RedisClientOptions): Promise<RedisClient> {
     });
   }
 
-  const client = createClientFn({ url: options.url ?? getEnv("REDIS_URL") });
+  const url = options.url ?? getEnv("REDIS_URL");
+  const useTls = options.tls ?? url?.startsWith("rediss://") ?? false;
+
+  if (!useTls && getEnv("NODE_ENV") === "production") {
+    logger.warn(
+      "Redis connection without TLS in production. Set REDIS_URL to rediss:// or pass tls: true.",
+    );
+  }
+
+  // deno-lint-ignore no-explicit-any
+  const clientOpts: Record<string, any> = { url };
+  if (useTls) {
+    clientOpts.socket = { tls: true };
+  }
+  const password = options.password ?? getEnv("REDIS_PASSWORD");
+  if (password) {
+    clientOpts.password = password;
+  }
+  const username = options.username ?? getEnv("REDIS_USERNAME");
+  if (username) {
+    clientOpts.username = username;
+  }
+
+  const client = createClientFn(clientOpts);
 
   if (typeof client.on === "function") {
     client.on("error", (err: unknown) => {

package/src/src/utils/version.ts

@@ -3,7 +3,7 @@ import { getEnv } from "../platform/compat/process.js";
 
 // Keep in sync with deno.json version.
 // scripts/release.ts updates this constant during releases.
-export const VERSION = "0.1.96";
+export const VERSION = "0.1.98";
 
 export function normalizeVeryfrontVersion(version: string | undefined): string | undefined {
   if (!version) return undefined;

package/src/src/workflow/executor/workflow-executor.ts

@@ -27,6 +27,8 @@ import type {
 import { generateId, parseDuration } from "../types.js";
 import { hasLockSupport, type WorkflowBackend } from "../backends/types.js";
 import { getCurrentRequestContext } from "../../platform/adapters/fs/veryfront/multi-project-adapter.js";
+import { env as getProcessEnv } from "../../platform/compat/process.js";
+import { mergeInjectedWorkflowEnv } from "../../jobs/runtime-env.js";
 import { DAGExecutor } from "./dag-executor.js";
 import { CheckpointManager } from "./checkpoint-manager.js";
 import { runWithWorkflowTenant, StepExecutor, type StepExecutorConfig } from "./step-executor.js";
@@ -196,6 +198,7 @@ export class WorkflowExecutor {
         releaseId: requestCtx.releaseId ?? null,
       }
       : undefined;
+    const injectedProjectEnv = mergeInjectedWorkflowEnv(undefined, getProcessEnv());
 
     const run: WorkflowRun<TInput, TOutput> = {
       id: options?.runId ?? generateId("run"),
@@ -205,7 +208,10 @@ export class WorkflowExecutor {
       input,
       nodeStates: {},
       currentNodes: [],
-      context: { input },
+      context: {
+        input,
+        ...(injectedProjectEnv ? { env: injectedProjectEnv } : {}),
+      },
       checkpoints: [],
       pendingApprovals: [],
       createdAt: new Date(),

package/src/src/workflow/types.ts

@@ -50,6 +50,7 @@ type DurationString = string;
  */
 export interface WorkflowContext {
   input: unknown;
+  env?: Record<string, string>;
   _tenant?: CapturedTenantContext;
   [nodeId: string]: unknown;
 }

package/src/src/workflow/worker/dynamic-job-entrypoint.ts

@@ -27,9 +27,11 @@
 
 import { logger as baseLogger } from "../../utils/index.js";
 import { getEnv } from "../../platform/compat/process.js";
+import { env as getProcessEnv } from "../../platform/compat/process.js";
 import { runWithRequestContext } from "../../platform/adapters/fs/veryfront/multi-project-adapter.js";
 import { enhanceAdapterWithFS } from "../../platform/adapters/fs/integration.js";
 import { denoAdapter } from "../../platform/adapters/runtime/deno/index.js";
+import { mergeInjectedWorkflowEnv } from "../../jobs/runtime-env.js";
 import { discoverWorkflows } from "../discovery/index.js";
 import type { VeryfrontConfig } from "../../config/index.js";
 import type { WorkflowBackend } from "../backends/types.js";
@@ -109,12 +111,28 @@ export async function runDynamicWorkflowJob(
 
   try {
     // Fetch the workflow run
-    const run = await backend.getRun(runId);
+    let run = await backend.getRun(runId);
     if (!run) {
       logger.error(`Workflow run not found: ${runId}`);
       return DYNAMIC_EXIT_CODES.NOT_FOUND;
     }
 
+    const injectedEnv = mergeInjectedWorkflowEnv(run.context.env, getProcessEnv());
+    if (injectedEnv) {
+      const currentEnv = run.context.env;
+      const currentSerialized = currentEnv ? JSON.stringify(currentEnv) : "";
+      const nextSerialized = JSON.stringify(injectedEnv);
+      if (currentSerialized !== nextSerialized) {
+        await backend.updateRun(runId, {
+          context: {
+            ...run.context,
+            env: injectedEnv,
+          },
+        });
+        run = (await backend.getRun(runId)) ?? run;
+      }
+    }
+
     // Get tenant context (from env or from stored run)
     const tenant = getTenantFromEnv() ?? run._tenant;
 

package/src/src/workflow/worker/job-entrypoint.ts

@@ -22,7 +22,9 @@
 
 import { logger as baseLogger } from "../../utils/index.js";
 import { getEnv } from "../../platform/compat/process.js";
+import { env as getProcessEnv } from "../../platform/compat/process.js";
 import { runWithRequestContext } from "../../platform/adapters/fs/veryfront/multi-project-adapter.js";
+import { mergeInjectedWorkflowEnv } from "../../jobs/runtime-env.js";
 import type { WorkflowBackend } from "../backends/types.js";
 import type { WorkflowExecutor } from "../executor/workflow-executor.js";
 import type { CapturedTenantContext, WorkflowDefinition } from "../types.js";
@@ -116,12 +118,28 @@ export async function runWorkflowJob(config: JobEntrypointConfig): Promise<numbe
 
   try {
     // Fetch the workflow run
-    const run = await backend.getRun(runId);
+    let run = await backend.getRun(runId);
     if (!run) {
       logger.error(`Workflow run not found: ${runId}`);
       return EXIT_CODES.NOT_FOUND;
     }
 
+    const injectedEnv = mergeInjectedWorkflowEnv(run.context.env, getProcessEnv());
+    if (injectedEnv) {
+      const currentEnv = run.context.env;
+      const currentSerialized = currentEnv ? JSON.stringify(currentEnv) : "";
+      const nextSerialized = JSON.stringify(injectedEnv);
+      if (currentSerialized !== nextSerialized) {
+        await backend.updateRun(runId, {
+          context: {
+            ...run.context,
+            env: injectedEnv,
+          },
+        });
+        run = (await backend.getRun(runId)) ?? run;
+      }
+    }
+
     // Get tenant context (from env or from stored run)
     const tenant = getTenantFromEnv() ?? run._tenant;