@ohhwells/bridge 0.1.64-next.176 → 0.1.64

package/dist/index.js

@@ -96,7 +96,6 @@ function applyTreeToState(state, payload) {
   const entry = {
     id: payload.id,
     label: payload.label ?? "Generated section",
-    ...typeof payload.path === "string" && payload.path ? { path: payload.path } : {},
     afterSection: payload.mode === "insert" && !insertBefore ? payload.targetSectionId ?? null : null,
     ...insertBefore && payload.targetSectionId ? { beforeSection: payload.targetSectionId } : {},
     ...payload.mode === "replace" && payload.targetSectionId ? { replaces: payload.targetSectionId } : {},
@@ -119,317 +118,6 @@ function deleteSectionFromState(state, sectionId) {
   return { ...state, v: 1, sections: state.sections, removed: [...removed, sectionId] };
 }
 
-// src/lib/brand-chrome.ts
-var BRAND_NAME_KEY = "__ohw_brand_name";
-var BRAND_TITLE_KEY = "__ohw_site_title";
-var BRAND_FAVICON_LETTER_KEY = "__ohw_favicon_letter";
-var BRAND_CHROME_KEYS = /* @__PURE__ */ new Set([
-  BRAND_NAME_KEY,
-  BRAND_TITLE_KEY,
-  BRAND_FAVICON_LETTER_KEY
-]);
-function upsertMeta(selector, attr, token, value) {
-  let el = document.head.querySelector(selector);
-  if (!el) {
-    el = document.createElement("meta");
-    el.setAttribute(attr, token);
-    document.head.appendChild(el);
-  }
-  if (el.getAttribute("content") !== value) el.setAttribute("content", value);
-}
-function escapeXml(value) {
-  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
-}
-function applyLetterFavicon(letter) {
-  const svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><rect width="64" height="64" rx="12" fill="#111827"/><text x="32" y="46" font-family="system-ui,-apple-system,Segoe UI,sans-serif" font-size="40" font-weight="700" text-anchor="middle" fill="#ffffff">${escapeXml(letter)}</text></svg>`;
-  const href = `data:image/svg+xml,${encodeURIComponent(svg)}`;
-  let link = document.head.querySelector('link[rel="icon"]');
-  if (!link) {
-    link = document.createElement("link");
-    link.rel = "icon";
-    document.head.appendChild(link);
-  }
-  link.type = "image/svg+xml";
-  if (link.href !== href) link.href = href;
-}
-function applyBrandChrome(content) {
-  const name = content[BRAND_NAME_KEY];
-  if (typeof name === "string" && name.length > 0) {
-    document.querySelectorAll("[data-ohw-wordmark]").forEach((el) => {
-      if (el.textContent !== name) el.textContent = name;
-      if (el.getAttribute("title") !== name) el.setAttribute("title", name);
-    });
-  }
-  const title = content[BRAND_TITLE_KEY];
-  if (typeof title === "string" && title.length > 0) {
-    if (document.title !== title) document.title = title;
-    upsertMeta('meta[property="og:title"]', "property", "og:title", title);
-    upsertMeta('meta[name="twitter:title"]', "name", "twitter:title", title);
-  }
-  const letter = content[BRAND_FAVICON_LETTER_KEY];
-  if (typeof letter === "string" && letter.length > 0) {
-    applyLetterFavicon(letter);
-  }
-}
-
-// src/lib/brand-kit.ts
-var BRAND_KIT_KEY = "__ohw_brand";
-var BRAND_VAR_PREFIX = "--ohw-brand-";
-var BRAND_VAR_NAMES = ["primary", "accent", "light", "dark", "surface", "border", "muted"].map(
-  (role) => `${BRAND_VAR_PREFIX}${role}`
-);
-var FONT_VARS = {
-  heading: ["--font-heading", "--font-display", "--brand-font-heading"],
-  body: ["--font-body", "--brand-font-body"]
-};
-var BRAND_FONT_LINK_ID = "ohw-brand-fonts";
-function brandColorVars(kit) {
-  const { dark, primary, accent, light } = kit.palette;
-  const mix = (a, aPct, b) => `color-mix(in srgb, ${a} ${aPct}%, ${b})`;
-  return {
-    [`${BRAND_VAR_PREFIX}primary`]: primary,
-    [`${BRAND_VAR_PREFIX}accent`]: accent,
-    [`${BRAND_VAR_PREFIX}light`]: light,
-    [`${BRAND_VAR_PREFIX}dark`]: dark,
-    [`${BRAND_VAR_PREFIX}surface`]: mix(light, 95, dark),
-    [`${BRAND_VAR_PREFIX}border`]: mix(light, 85, dark),
-    [`${BRAND_VAR_PREFIX}muted`]: mix(dark, 62, light)
-  };
-}
-function parseBrandKit(raw) {
-  if (!raw) return null;
-  try {
-    const parsed = JSON.parse(raw);
-    const p = parsed?.palette;
-    const f = parsed?.fonts;
-    if (!p || !f || typeof p.dark !== "string" || typeof p.primary !== "string" || typeof p.accent !== "string" || typeof p.light !== "string" || typeof f.heading !== "string" || typeof f.body !== "string") {
-      return null;
-    }
-    return {
-      palette: { dark: p.dark, primary: p.primary, accent: p.accent, light: p.light },
-      fonts: { heading: f.heading, body: f.body }
-    };
-  } catch {
-    return null;
-  }
-}
-function familyOf(stack) {
-  const first = stack.split(",")[0]?.trim() ?? "";
-  return first.replace(/^['"]|['"]$/g, "");
-}
-function loadBrandFonts(families) {
-  const unique = [...new Set(families.map((f) => f.trim()).filter(Boolean))];
-  if (unique.length === 0) return;
-  const spec = unique.map((f) => `${f.replace(/ /g, "+")}:400,500,600,700`).join("|");
-  const href = `https://fonts.googleapis.com/css?family=${spec}&display=swap`;
-  let link = document.getElementById(BRAND_FONT_LINK_ID);
-  if (!link) {
-    link = document.createElement("link");
-    link.id = BRAND_FONT_LINK_ID;
-    link.rel = "stylesheet";
-    document.head.appendChild(link);
-  }
-  if (link.href !== href) link.href = href;
-}
-function applyBrandToDom(kit) {
-  const root = document.documentElement;
-  if (!kit) {
-    for (const name of BRAND_VAR_NAMES) root.style.removeProperty(name);
-    for (const name of [...FONT_VARS.heading, ...FONT_VARS.body]) root.style.removeProperty(name);
-    document.getElementById(BRAND_FONT_LINK_ID)?.remove();
-    return;
-  }
-  for (const [name, value] of Object.entries(brandColorVars(kit))) root.style.setProperty(name, value);
-  for (const name of FONT_VARS.heading) root.style.setProperty(name, kit.fonts.heading);
-  for (const name of FONT_VARS.body) root.style.setProperty(name, kit.fonts.body);
-  loadBrandFonts([familyOf(kit.fonts.heading), familyOf(kit.fonts.body)]);
-}
-
-// src/lib/section-styles.ts
-var STYLE_STORE_KEY = "__ohw_styles";
-var STYLE_SHEET_ID = "ohw-section-styles";
-function parseStyleStore(raw) {
-  if (!raw) return null;
-  try {
-    const parsed = JSON.parse(raw);
-    if (parsed?.v !== 1) return null;
-    return {
-      v: 1,
-      sections: typeof parsed.sections === "object" && parsed.sections ? parsed.sections : {},
-      nodes: typeof parsed.nodes === "object" && parsed.nodes ? parsed.nodes : {}
-    };
-  } catch {
-    return null;
-  }
-}
-var BG_VALUES = {
-  surface: "color-mix(in srgb, var(--ohw-brand-light, var(--color-light, #ECECEB)) 94%, var(--ohw-brand-dark, var(--color-dark, #0C0A09)))",
-  accent: "var(--ohw-brand-primary, var(--color-primary, #0078E5))",
-  "accent-soft": "color-mix(in srgb, var(--ohw-brand-primary, var(--color-primary, #0078E5)) 12%, var(--ohw-brand-light, var(--color-light, #FFFFFF)))"
-};
-var HEADLINE_SIZES = { md: 24, lg: 32, xl: 40, display: 56 };
-function styleSheetCss() {
-  const rules = [];
-  for (const [tone, value] of Object.entries(BG_VALUES)) {
-    rules.push(`[data-ohw-style-bg="${tone}"] { background: ${value} !important; }`);
-  }
-  rules.push(
-    `[data-ohw-style-bg="accent"] { color: var(--ohw-brand-light, var(--color-light, #FFFFFF)) !important; }`
-  );
-  rules.push(
-    `[data-ohw-style-distribution="space-between"] { display: flex !important; flex-direction: column; justify-content: space-between; }`,
-    `[data-ohw-style-distribution="center"] { display: flex !important; flex-direction: column; justify-content: center; }`
-  );
-  for (const [scale, size] of Object.entries(HEADLINE_SIZES)) {
-    rules.push(
-      `[data-ohw-style-headline="${scale}"] :is(h1, h2, h3) { font-size: ${size}px !important; line-height: 1.15 !important; }`
-    );
-  }
-  rules.push(
-    `[data-ohw-style-aspect="fill-height"] img { height: 100% !important; aspect-ratio: auto !important; object-fit: cover; }`
-  );
-  for (const aspect of ["1:1", "4:5", "3:4", "3:2", "16:9", "2:1", "3:1"]) {
-    rules.push(
-      `[data-ohw-style-aspect="${aspect.replace(":", "-")}"] img { aspect-ratio: ${aspect.replace(":", " / ")} !important; height: auto !important; object-fit: cover; }`
-    );
-  }
-  const pad = { tight: 40, balanced: 64, airy: 96 };
-  for (const [spacing, px] of Object.entries(pad)) {
-    rules.push(
-      `[data-ohw-style-spacing="${spacing}"] { padding-top: ${px}px !important; padding-bottom: ${px}px !important; }`
-    );
-  }
-  return rules.join("\n");
-}
-var STYLE_FONT_LINK_ID = "ohw-style-fonts";
-function loadStyleFonts(families) {
-  const unique = [...new Set(families.map((f) => f.trim()).filter(Boolean))];
-  const existing = document.getElementById(STYLE_FONT_LINK_ID);
-  if (unique.length === 0) {
-    existing?.remove();
-    return;
-  }
-  const spec = unique.map((f) => `${f.replace(/ /g, "+")}:400,500,600,700`).join("|");
-  const href = `https://fonts.googleapis.com/css?family=${spec}&display=swap`;
-  let link = existing;
-  if (!link) {
-    link = document.createElement("link");
-    link.id = STYLE_FONT_LINK_ID;
-    link.rel = "stylesheet";
-    document.head.appendChild(link);
-  }
-  if (link.href !== href) link.href = href;
-}
-var SECTION_ATTRS = {
-  sectionBackground: "data-ohw-style-bg",
-  textDistribution: "data-ohw-style-distribution",
-  headlineScale: "data-ohw-style-headline",
-  imageAspect: "data-ohw-style-aspect",
-  spacing: "data-ohw-style-spacing"
-};
-var NODE_WROTE_ATTR = "data-ohw-style-node";
-var NODE_PROPS = ["color", "font-family", "font-size", "background"];
-function saveInline(el, prop) {
-  const attr = `data-ohw-style-prev-${prop}`;
-  if (!el.hasAttribute(attr)) el.setAttribute(attr, el.style.getPropertyValue(prop));
-}
-function restoreInline(el, prop) {
-  const attr = `data-ohw-style-prev-${prop}`;
-  if (!el.hasAttribute(attr)) return;
-  const prev = el.getAttribute(attr) ?? "";
-  if (prev) el.style.setProperty(prop, prev);
-  else el.style.removeProperty(prop);
-  el.removeAttribute(attr);
-}
-function ensureStyleSheet() {
-  let el = document.getElementById(STYLE_SHEET_ID);
-  if (!el) {
-    el = document.createElement("style");
-    el.id = STYLE_SHEET_ID;
-    document.head.appendChild(el);
-  }
-  const css = styleSheetCss();
-  if (el.textContent !== css) el.textContent = css;
-}
-function clearSectionAttrs(root) {
-  for (const attr of Object.values(SECTION_ATTRS)) {
-    for (const el of Array.from(root.querySelectorAll(`[${attr}]`))) el.removeAttribute(attr);
-  }
-  for (const el of Array.from(root.querySelectorAll("[data-ohw-style-bgcolor]"))) {
-    restoreInline(el, "background");
-    el.removeAttribute("data-ohw-style-bgcolor");
-  }
-}
-function clearNodeProps(root) {
-  for (const el of Array.from(root.querySelectorAll(`[${NODE_WROTE_ATTR}]`))) {
-    const h = el;
-    for (const prop of NODE_PROPS) restoreInline(h, prop);
-    h.removeAttribute(NODE_WROTE_ATTR);
-  }
-}
-function buttonSurfaceOf(el) {
-  return el.closest("a, button") ?? el;
-}
-function applyStylesToDom(store) {
-  ensureStyleSheet();
-  clearSectionAttrs(document);
-  clearNodeProps(document);
-  loadStyleFonts(
-    store ? Object.values(store.nodes).flatMap((n) => n.fontFamily ? [n.fontFamily] : []) : []
-  );
-  if (!store) return;
-  for (const [sectionId, override] of Object.entries(store.sections)) {
-    const sections = document.querySelectorAll(
-      `[data-ohw-section="${CSS.escape(sectionId)}"]`
-    );
-    for (const section of Array.from(sections)) {
-      for (const [prop, attr] of Object.entries(SECTION_ATTRS)) {
-        const value = override[prop];
-        if (value === void 0) continue;
-        if (prop === "sectionBackground" && override.sectionBackgroundColor !== void 0) continue;
-        section.setAttribute(attr, String(value).replace(":", "-"));
-      }
-      if (override.sectionBackgroundColor !== void 0) {
-        saveInline(section, "background");
-        section.style.setProperty("background", override.sectionBackgroundColor, "important");
-        section.setAttribute("data-ohw-style-bgcolor", "");
-      }
-    }
-  }
-  for (const [key, override] of Object.entries(store.nodes)) {
-    const nodes = document.querySelectorAll(`[data-ohw-key="${CSS.escape(key)}"]`);
-    for (const el of Array.from(nodes)) {
-      if (override.color !== void 0) {
-        saveInline(el, "color");
-        el.style.setProperty("color", override.color, "important");
-        el.setAttribute(NODE_WROTE_ATTR, "");
-      }
-      if (override.fontFamily !== void 0) {
-        saveInline(el, "font-family");
-        el.style.setProperty("font-family", `'${override.fontFamily}'`, "important");
-        el.setAttribute(NODE_WROTE_ATTR, "");
-      }
-      if (override.fontSize !== void 0) {
-        saveInline(el, "font-size");
-        el.style.setProperty("font-size", `${override.fontSize}px`, "important");
-        el.setAttribute(NODE_WROTE_ATTR, "");
-      }
-      if (override.buttonBackground !== void 0 || override.buttonText !== void 0) {
-        const surface = buttonSurfaceOf(el);
-        if (override.buttonBackground !== void 0) {
-          saveInline(surface, "background");
-          surface.style.setProperty("background", override.buttonBackground, "important");
-        }
-        if (override.buttonText !== void 0) {
-          saveInline(surface, "color");
-          surface.style.setProperty("color", override.buttonText, "important");
-        }
-        surface.setAttribute(NODE_WROTE_ATTR, "");
-      }
-    }
-  }
-}
-
 // src/ui/ai-tree/aiSectionsManager.tsx
 import { flushSync } from "react-dom";
 import { createRoot } from "react-dom/client";
@@ -444,8 +132,7 @@ function lucideByName(name) {
 }
 var typeStyle = (spec, font) => ({
   fontFamily: font,
-  // Headings shrink with the viewport (reaching full size around ~900px wide); body copy stays put.
-  fontSize: spec.size >= 24 ? `clamp(${Math.max(18, Math.round(spec.size * 0.6))}px, ${(spec.size / 9).toFixed(2)}vw, ${spec.size}px)` : spec.size,
+  fontSize: spec.size,
   lineHeight: spec.line,
   fontWeight: spec.weight
 });
@@ -472,8 +159,6 @@ var AI_RESPONSIVE_CSS = [
   "  [data-ai-responsive] [data-ai-grid] { grid-template-columns: 1fr !important; }",
   "  [data-ai-responsive] [data-ai-columns] > * { grid-column: 1 / -1 !important; }",
   "  [data-ai-responsive] [data-ai-section-inner] { padding-left: 20px !important; padding-right: 20px !important; }",
-  "  [data-ai-responsive] { overflow-x: hidden; }",
-  "  [data-ai-responsive] img { max-width: 100%; }",
   "}"
 ].join("\n");
 var TRANSPARENT_PX = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
@@ -1481,20 +1166,6 @@ function AiTreeRenderer({ tree, brand, resolveMedia, editKeyPrefix }) {
   const overlayAlpha = { low: 0.25, medium: 0.45, high: 0.65 }[settings.overlayIntensity ?? "medium"];
   const backgroundUrl = isOverlay && settings.backgroundMedia ? ctx.resolveMedia(settings.backgroundMedia) : null;
   const bgAttrs = ctx.keyFor && isOverlay && settings.backgroundMedia ? { "data-ohw-key": ctx.keyFor("settings.backgroundMedia"), "data-ohw-editable": "bg-image" } : {};
-  const toneBackground = (() => {
-    const { dark, primary, light } = resolvedBrand.palette;
-    switch (settings.sectionBackground) {
-      case "surface":
-        return `color-mix(in srgb, ${light} 94%, ${dark})`;
-      case "accent":
-        return primary;
-      case "accent-soft":
-        return `color-mix(in srgb, ${primary} 12%, ${light})`;
-      default:
-        return void 0;
-    }
-  })();
-  const distributed = !isOverlay && settings.textDistribution;
   return /* @__PURE__ */ jsxs(
     "section",
     {
@@ -1504,11 +1175,10 @@ function AiTreeRenderer({ tree, brand, resolveMedia, editKeyPrefix }) {
       style: {
         position: "relative",
         padding: `${pad}px 0`,
-        background: toneBackground ?? (isOverlay && !backgroundUrl ? "#DBEAFE" : void 0),
+        background: isOverlay && !backgroundUrl ? "#DBEAFE" : void 0,
         backgroundImage: backgroundUrl ? `url(${backgroundUrl})` : void 0,
         backgroundSize: "cover",
-        backgroundPosition: "center",
-        color: settings.sectionBackground === "accent" ? resolvedBrand.palette.light : void 0
+        backgroundPosition: "center"
       },
       children: [
         /* @__PURE__ */ jsx("style", { children: AI_RESPONSIVE_CSS }),
@@ -1532,24 +1202,10 @@ function AiTreeRenderer({ tree, brand, resolveMedia, editKeyPrefix }) {
                   display: "grid",
                   gridTemplateColumns: "repeat(12, 1fr)",
                   gap: AI_TREE_TOKENS.spacing6,
-                  alignItems: distributed === "space-between" ? "stretch" : (distributed ?? settings.verticalPosition) === "top" ? "start" : "center",
+                  alignItems: settings.verticalPosition === "top" ? "start" : "center",
                   marginTop: r2 > 0 ? AI_TREE_TOKENS.spacing8 : 0
                 },
-                children: (row.blocks ?? []).map((block, b) => /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    "data-ai-cell": "",
-                    style: {
-                      gridColumn: `span ${Math.min(12, Math.max(1, block.span))}`,
-                      minWidth: 0,
-                      // space-between: each column becomes a flex column whose content spreads over
-                      // the full row height instead of clumping at the top.
-                      ...distributed === "space-between" ? { display: "flex", flexDirection: "column", justifyContent: "space-between" } : {}
-                    },
-                    children: renderNode(block, ctx, `r${r2}.b${b}`)
-                  },
-                  b
-                ))
+                children: (row.blocks ?? []).map((block, b) => /* @__PURE__ */ jsx("div", { style: { gridColumn: `span ${Math.min(12, Math.max(1, block.span))}`, minWidth: 0 }, children: renderNode(block, ctx, `r${r2}.b${b}`) }, b))
               },
               r2
             ))
@@ -1565,34 +1221,17 @@ import { jsx as jsx2 } from "react/jsx-runtime";
 var CONTAINER_ATTR = "data-ohw-ai-generated";
 var REPLACED_ATTR = "data-ohw-ai-replaced-by";
 var REMOVED_ATTR = "data-ohw-ai-removed";
-function readRootVar(name) {
-  if (typeof document === "undefined") return "";
-  return getComputedStyle(document.documentElement).getPropertyValue(name).trim();
-}
-function deriveBrandOverride() {
-  const dark = readRootVar("--ohw-brand-dark");
-  const primary = readRootVar("--ohw-brand-primary");
-  const light = readRootVar("--ohw-brand-light");
-  if (!dark || !primary || !light) return null;
-  const accent = readRootVar("--ohw-brand-accent");
-  const heading = readRootVar("--font-heading") || readRootVar("--font-display");
-  const body = readRootVar("--font-body");
-  return {
-    palette: { dark, primary, accent: accent || dark, light },
-    fonts: {
-      heading: heading || AI_DEFAULT_BRAND.fonts.heading,
-      body: body || AI_DEFAULT_BRAND.fonts.body
-    }
-  };
-}
 function deriveTemplateBrand() {
-  const dark = readRootVar("--color-dark");
-  const primary = readRootVar("--color-primary");
-  const light = readRootVar("--color-light");
+  if (typeof document === "undefined") return null;
+  const cs = getComputedStyle(document.documentElement);
+  const read = (name) => cs.getPropertyValue(name).trim();
+  const dark = read("--color-dark");
+  const primary = read("--color-primary");
+  const light = read("--color-light");
   if (!dark || !primary || !light) return null;
-  const accent = readRootVar("--color-accent");
-  const heading = readRootVar("--font-heading") || readRootVar("--font-display");
-  const body = readRootVar("--font-body");
+  const accent = read("--color-accent");
+  const heading = read("--font-heading") || read("--font-display");
+  const body = read("--font-body");
   return {
     palette: { dark, primary, accent: accent || dark, light },
     fonts: {
@@ -1684,12 +1323,8 @@ function syncReplacedOriginals(state) {
 }
 function applyAiSectionsToDom(state, options) {
   if (typeof document === "undefined") return;
-  const brandOverride = deriveBrandOverride();
   const templateBrand = deriveTemplateBrand();
-  const brandKey = brandOverride ? JSON.stringify(brandOverride) : "";
-  const pagePath = window.location.pathname;
-  const pageSections = state.sections.filter((entry) => !entry.path || entry.path === pagePath);
-  const activeIds = new Set(pageSections.map((entry) => entry.id));
+  const activeIds = new Set(state.sections.map((entry) => entry.id));
   for (const [id, section] of mounted) {
     if (!activeIds.has(id)) {
       section.root.unmount();
@@ -1697,8 +1332,8 @@ function applyAiSectionsToDom(state, options) {
       mounted.delete(id);
     }
   }
-  for (const entry of pageSections) {
-    const serialized = JSON.stringify(entry) + brandKey;
+  for (const entry of state.sections) {
+    const serialized = JSON.stringify(entry);
     const existing = mounted.get(entry.id);
     if (existing && existing.serialized === serialized && existing.container.isConnected) {
       continue;
@@ -1712,7 +1347,6 @@ function applyAiSectionsToDom(state, options) {
       mounted.delete(entry.id);
     }
     container.setAttribute("data-ohw-section", entry.id);
-    container.setAttribute("data-ohw-instance", entry.id);
     container.setAttribute("data-ohw-section-label", entry.label);
     placeContainer(container, entry);
     const root = mounted.get(entry.id)?.root ?? createRoot(container);
@@ -1723,7 +1357,7 @@ function applyAiSectionsToDom(state, options) {
           AiTreeRenderer,
           {
             tree: entry.tree,
-            brand: brandOverride ?? entry.brand ?? options?.brand ?? templateBrand ?? void 0,
+            brand: entry.brand ?? options?.brand ?? templateBrand ?? void 0,
             resolveMedia,
             editKeyPrefix: `ai.${entry.id}`
           }
@@ -2340,7 +1974,7 @@ function SchedulingWidget({ notifyOnConnect = false, initialScheduleId, insertAf
   const autoId = useId();
   const insertAfter = insertAfterProp ?? autoId;
   const [schedule, setSchedule] = useState2(null);
-  const [loading, setLoading] = useState2(initialScheduleId !== null);
+  const [loading, setLoading] = useState2(true);
   const [inEditor, setInEditor] = useState2(false);
   const [isHovered, setIsHovered] = useState2(false);
   const [modalState, setModalState] = useState2(null);
@@ -2514,10 +2148,8 @@ function SchedulingWidget({ notifyOnConnect = false, initialScheduleId, insertAf
       "*"
     );
   };
+  if (!inEditor && !loading && !schedule) return null;
   const sectionId = `scheduling-${insertAfter}`;
-  if (!inEditor && !loading && !schedule) {
-    return /* @__PURE__ */ jsx4("section", { "data-ohw-section": sectionId, "data-ohw-scheduling-anchor": insertAfter, style: { display: "none" } });
-  }
   return /* @__PURE__ */ jsxs3(
     "section",
     {
@@ -6515,6 +6147,7 @@ function getChromeStyle(state) {
 }
 function ClampedToolbarSlot({
   placement,
+  align = "center",
   children
 }) {
   const slotRef = useRef2(null);
@@ -6536,7 +6169,7 @@ function ClampedToolbarSlot({
         Math.min(centerX, window.innerWidth - TOOLBAR_EDGE_MARGIN - half)
       );
       const offsetX = clampedCenter - centerX;
-      slot.style.transform = `translateX(calc(-50% + ${offsetX}px))`;
+      slot.style.transform = align === "left" ? "none" : `translateX(calc(-50% + ${offsetX}px))`;
     };
     clamp();
     const ro = new ResizeObserver(clamp);
@@ -6547,19 +6180,20 @@ function ClampedToolbarSlot({
       ro.disconnect();
       window.removeEventListener("resize", clamp);
     };
-  }, [placement, children]);
+  }, [placement, children, align]);
   return /* @__PURE__ */ jsx12(
     "div",
     {
       ref: slotRef,
       className: cn(
-        "pointer-events-auto absolute left-1/2",
+        "pointer-events-auto absolute",
+        align === "left" ? "left-0" : "left-1/2",
         placement === "top" ? "bottom-full" : "top-full"
       ),
       style: {
         marginBottom: placement === "top" ? TOOLBAR_STROKE_GAP : void 0,
         marginTop: placement === "bottom" ? TOOLBAR_STROKE_GAP : void 0,
-        transform: "translateX(-50%)"
+        transform: align === "left" ? "none" : "translateX(-50%)"
       },
       "data-ohw-item-toolbar-anchor": placement,
       children
@@ -6628,6 +6262,7 @@ function ItemInteractionLayer({
   onItemClick,
   itemDragSurface = true,
   chromeGap,
+  toolbarAlign = "center",
   className
 }) {
   if (state === "default") return null;
@@ -6715,8 +6350,8 @@ function ItemInteractionLayer({
             )
           }
         ),
-        showToolbar && state === "active-top" && /* @__PURE__ */ jsx12(ClampedToolbarSlot, { placement: "top", children: toolbar }),
-        showToolbar && state === "active-bottom" && !useDetachedBelowToolbar && /* @__PURE__ */ jsx12(ClampedToolbarSlot, { placement: "bottom", children: toolbar }),
+        showToolbar && state === "active-top" && /* @__PURE__ */ jsx12(ClampedToolbarSlot, { align: toolbarAlign, placement: "top", children: toolbar }),
+        showToolbar && state === "active-bottom" && !useDetachedBelowToolbar && /* @__PURE__ */ jsx12(ClampedToolbarSlot, { align: toolbarAlign, placement: "bottom", children: toolbar }),
         useDetachedBelowToolbar && toolbarBelowRect ? /* @__PURE__ */ jsx12(
           DetachedBelowToolbarSlot,
           {
@@ -6730,6 +6365,616 @@ function ItemInteractionLayer({
   );
 }
 
+// src/lib/forms.ts
+var FORM_SELECTOR = '[data-ohw-editable="form"]';
+function getFormElement(el) {
+  if (!el) return null;
+  return el.closest(FORM_SELECTOR);
+}
+function formKeyOf(form) {
+  return form.getAttribute("data-ohw-key");
+}
+function formHasLongText(form) {
+  return form.querySelector("textarea") !== null;
+}
+function collectFormFields(form) {
+  const fields = {};
+  form.querySelectorAll(
+    "input, textarea, select"
+  ).forEach((input) => {
+    const type = input.type;
+    if (type === "submit" || type === "button" || type === "reset") return;
+    const key = input.getAttribute("name") ?? input.getAttribute("data-ohw-key");
+    if (!key) return;
+    if (type === "checkbox") {
+      fields[key] = input.checked ? "yes" : "no";
+      return;
+    }
+    fields[key] = input.value;
+  });
+  return fields;
+}
+function formStateContainer(form) {
+  return form.closest("[data-ohw-editable-state]") ?? form.parentElement ?? form;
+}
+function showSuccess(form, message) {
+  const container = formStateContainer(form);
+  const views = container.querySelectorAll("[data-ohw-state-view]");
+  if (views.length > 0) {
+    views.forEach((view) => {
+      view.style.display = view.getAttribute("data-ohw-state-view") === "success" ? "block" : "none";
+    });
+    return;
+  }
+  const text = message || form.getAttribute("data-ohw-success-text") || DEFAULT_SUCCESS_TEXT;
+  const note = document.createElement("p");
+  note.setAttribute("data-ohw-form-success", "");
+  note.setAttribute("role", "status");
+  note.innerHTML = text;
+  form.replaceChildren(note);
+}
+function showSubmitError(form, message = "Something went wrong. Please try again.") {
+  let note = form.querySelector("[data-ohw-form-error]");
+  if (!note) {
+    note = document.createElement("p");
+    note.setAttribute("data-ohw-form-error", "");
+    note.setAttribute("role", "alert");
+    note.style.marginTop = "8px";
+    form.appendChild(note);
+  }
+  note.textContent = message;
+  note.style.display = "";
+}
+function clearSubmitError(form) {
+  const note = form.querySelector("[data-ohw-form-error]");
+  if (note) note.style.display = "none";
+}
+var SUCCESS_TEXT_ATTR = "data-ohw-form-success-text";
+var HIDDEN_ATTR = "data-ohw-form-hidden";
+var DEFAULT_SUCCESS_TEXT = "Thanks! We'll be in touch.";
+function formSuccessKey(formKey) {
+  return `${formKey}-success`;
+}
+function ensureSuccessTextEl(form, formKey, initialText) {
+  let el = form.querySelector(`[${SUCCESS_TEXT_ATTR}]`);
+  if (el) return el;
+  el = document.createElement("p");
+  el.setAttribute(SUCCESS_TEXT_ATTR, "");
+  el.setAttribute("data-ohw-editable", "text");
+  el.setAttribute("data-ohw-key", formSuccessKey(formKey));
+  el.innerHTML = initialText;
+  el.style.display = "none";
+  el.style.margin = "56px 4px 16px";
+  form.appendChild(el);
+  return el;
+}
+function successInitialFor(form, formKey, content) {
+  return content[formSuccessKey(formKey)] || form.getAttribute("data-ohw-success-text") || DEFAULT_SUCCESS_TEXT;
+}
+function setFormViewState(form, formKey, state, initialText) {
+  const success = ensureSuccessTextEl(form, formKey, initialText);
+  Array.from(form.children).forEach((child) => {
+    if (!(child instanceof HTMLElement) || child === success) return;
+    if (state === "success") {
+      if (!child.hasAttribute(HIDDEN_ATTR)) {
+        child.setAttribute(HIDDEN_ATTR, child.style.display);
+        child.style.display = "none";
+      }
+    } else if (child.hasAttribute(HIDDEN_ATTR)) {
+      child.style.display = child.getAttribute(HIDDEN_ATTR) ?? "";
+      child.removeAttribute(HIDDEN_ATTR);
+    }
+  });
+  success.style.display = state === "success" ? "" : "none";
+}
+var BOUND_ATTR = "data-ohw-form-bound";
+var publishedFormContext = {
+  apiUrl: "",
+  subdomain: "",
+  content: {}
+};
+function bindPublishedForms(apiUrl, subdomain, content = {}) {
+  publishedFormContext = { apiUrl, subdomain, content };
+  if (document.documentElement.hasAttribute(BOUND_ATTR)) return;
+  document.documentElement.setAttribute(BOUND_ATTR, "");
+  document.addEventListener(
+    "submit",
+    async (e) => {
+      const target = e.target;
+      const form = target?.closest(FORM_SELECTOR);
+      if (!form || !(form instanceof HTMLFormElement)) return;
+      const formKey = formKeyOf(form);
+      if (!formKey) return;
+      e.preventDefault();
+      clearSubmitError(form);
+      const filled = collectFormFields(form);
+      if (!Object.values(filled).some((value) => value.trim() !== "")) {
+        showSubmitError(form, "Please fill in at least one field.");
+        return;
+      }
+      const submitButton = form.querySelector(
+        'button[type="submit"], input[type="submit"], button:not([type])'
+      );
+      if (submitButton) submitButton.disabled = true;
+      try {
+        const { apiUrl: api, subdomain: site, content: latest } = publishedFormContext;
+        const response = await fetch(`${api}/api/public/sites/${site}/forms/submissions`, {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({
+            formKey,
+            fields: filled,
+            hasLongText: formHasLongText(form)
+          })
+        });
+        if (!response.ok) throw new Error(`submit failed: ${response.status}`);
+        showSuccess(form, latest[formSuccessKey(formKey)]);
+      } catch {
+        showSubmitError(form);
+        if (submitButton) submitButton.disabled = false;
+      }
+    },
+    true
+  );
+}
+
+// src/lib/form-fields.ts
+var FIELD_DEFAULTS = {
+  "short-text": { label: "Short text", placeholder: "Type placeholder text..." },
+  "long-text": { label: "Long text", placeholder: "How can we help?" },
+  email: { label: "Email", placeholder: "hello@example.com" },
+  phone: { label: "Phone number", placeholder: "(555) 000-0000" }
+};
+var FIELD_TYPES = [
+  { type: "short-text", label: "Short text" },
+  { type: "long-text", label: "Long text" },
+  { type: "email", label: "Email" },
+  { type: "phone", label: "Phone" }
+];
+var FIELD_ATTR = "data-ohw-form-field";
+var FIELD_TYPE_ATTR = "data-ohw-field-type";
+var PLACEHOLDER_EDIT_ATTR = "data-ohw-placeholder-edit";
+function fieldsKey(formKey) {
+  return `${formKey}-fields`;
+}
+function inputTagFor(type) {
+  if (type === "long-text") return { tag: "textarea" };
+  if (type === "email") return { tag: "input", inputType: "email" };
+  if (type === "phone") return { tag: "input", inputType: "tel" };
+  return { tag: "input", inputType: "text" };
+}
+function inferType(input) {
+  if (input.tagName === "TEXTAREA") return "long-text";
+  const type = input.type;
+  if (type === "email") return "email";
+  if (type === "tel") return "phone";
+  return "short-text";
+}
+function ensureFieldLabel(wrapper, key) {
+  const existing = fieldLabelOf(wrapper);
+  if (existing) {
+    if (!existing.hasAttribute("data-ohw-editable")) {
+      existing.setAttribute("data-ohw-editable", "text");
+      existing.setAttribute("data-ohw-key", `${key}-label`);
+    }
+    return existing;
+  }
+  const input = fieldInputOf(wrapper);
+  const label = document.createElement("label");
+  label.setAttribute("data-ohw-editable", "text");
+  label.setAttribute("data-ohw-key", `${key}-label`);
+  label.setAttribute("data-ohw-field-label", "");
+  label.style.display = "block";
+  label.style.marginBottom = "6px";
+  label.style.fontSize = "13px";
+  label.style.fontWeight = "500";
+  label.style.lineHeight = "1.3";
+  const fromPlaceholder = input?.getAttribute("placeholder")?.trim();
+  const text = fromPlaceholder && fromPlaceholder.length < 40 ? fromPlaceholder : key.replace(/[-_]/g, " ");
+  label.textContent = text;
+  if (input && input.parentElement === wrapper) wrapper.insertBefore(label, input);
+  else wrapper.insertBefore(label, wrapper.firstChild);
+  return label;
+}
+function listFieldWrappers(form) {
+  return Array.from(form.querySelectorAll(`[${FIELD_ATTR}]`));
+}
+function getFieldWrapper(el) {
+  return el?.closest(`[${FIELD_ATTR}]`) ?? null;
+}
+function fieldInputOf(wrapper) {
+  return wrapper.querySelector("input, textarea");
+}
+function fieldLabelOf(wrapper) {
+  return wrapper.querySelector("label");
+}
+function fieldKeyOf(wrapper) {
+  return wrapper.getAttribute(FIELD_ATTR) ?? "";
+}
+function fieldTypeOf(wrapper) {
+  return wrapper.getAttribute(FIELD_TYPE_ATTR) ?? "short-text";
+}
+function isFieldRequired(wrapper) {
+  return fieldInputOf(wrapper)?.hasAttribute("required") ?? false;
+}
+function markFormFields(form) {
+  form.querySelectorAll("input, textarea").forEach((input) => {
+    const type = input.type;
+    if (type === "submit" || type === "button" || type === "reset" || type === "hidden") return;
+    if (getFieldWrapper(input)) return;
+    let wrapper = input;
+    while (wrapper.parentElement && wrapper.parentElement !== form && wrapper.parentElement.querySelectorAll("input, textarea").length === 1) {
+      wrapper = wrapper.parentElement;
+    }
+    if (wrapper === input) {
+      const box = document.createElement("div");
+      box.setAttribute("data-ohw-field-box", "");
+      input.replaceWith(box);
+      box.appendChild(input);
+      wrapper = box;
+    }
+    const key = input.getAttribute("name") ?? input.getAttribute("data-ohw-key") ?? `field-${Date.now()}`;
+    wrapper.setAttribute(FIELD_ATTR, key);
+    wrapper.setAttribute(FIELD_TYPE_ATTR, inferType(input));
+    ensureFieldLabel(wrapper, key);
+    syncRequiredMark(wrapper);
+  });
+  return listFieldWrappers(form);
+}
+function readFieldsFromDom(form) {
+  return listFieldWrappers(form).map((wrapper) => {
+    const input = fieldInputOf(wrapper);
+    return {
+      key: fieldKeyOf(wrapper),
+      type: fieldTypeOf(wrapper),
+      label: fieldLabelText(fieldLabelOf(wrapper)).trim(),
+      // While a field is selected its placeholder text lives in the value (see
+      // beginPlaceholderEdit), so reading the attribute would store an empty one — whoever
+      // happens to save at that moment must still record what the owner typed.
+      placeholder: input ? input.hasAttribute(PLACEHOLDER_EDIT_ATTR) ? input.value : input.getAttribute("placeholder") ?? "" : "",
+      required: Boolean(input?.hasAttribute("required"))
+    };
+  });
+}
+function parseFieldSpecs(raw) {
+  if (!raw) return null;
+  try {
+    const parsed = JSON.parse(raw);
+    return Array.isArray(parsed) ? parsed : null;
+  } catch {
+    return null;
+  }
+}
+function isDefaultText(value, pick) {
+  const trimmed = value.trim().replace(/\s*\*$/, "");
+  if (!trimmed) return true;
+  return Object.values(FIELD_DEFAULTS).some((defaults) => pick(defaults) === trimmed);
+}
+function applyFieldType(wrapper, type) {
+  const input = fieldInputOf(wrapper);
+  if (!input) return;
+  const defaults = FIELD_DEFAULTS[type];
+  const placeholder = input.getAttribute("placeholder") ?? "";
+  const label = fieldLabelOf(wrapper);
+  const followsDefaults = {
+    // A label the owner wrote stays; one that still reads as a type name (or as the old
+    // placeholder the template shipped) follows the new type.
+    label: isDefaultText(label?.textContent ?? "", (d) => d.label) || fieldLabelText(label).trim() === placeholder.trim()
+  };
+  const { tag, inputType } = inputTagFor(type);
+  wrapper.setAttribute(FIELD_TYPE_ATTR, type);
+  const shedSize = (el) => {
+    if (type === "long-text") return;
+    el.style.removeProperty("height");
+    el.style.removeProperty("min-height");
+    el.style.removeProperty("resize");
+    el.removeAttribute("rows");
+  };
+  const applyDefaults = (el) => {
+    el.setAttribute("placeholder", defaults.placeholder);
+    if (label && followsDefaults.label) {
+      label.textContent = defaults.label;
+    }
+  };
+  if (input.tagName.toLowerCase() === tag) {
+    if (inputType) input.type = inputType;
+    shedSize(input);
+    applyDefaults(input);
+    return;
+  }
+  const next = document.createElement(tag);
+  Array.from(input.attributes).forEach((attr) => {
+    if (attr.name === "type") return;
+    next.setAttribute(attr.name, attr.value);
+  });
+  if (inputType) next.setAttribute("type", inputType);
+  shedSize(next);
+  if (type === "long-text") next.setAttribute("rows", "4");
+  input.replaceWith(next);
+  applyDefaults(next);
+}
+var REQUIRED_MARK_ATTR = "data-ohw-field-required";
+function fieldLabelText(label) {
+  if (!label) return "";
+  return (label.textContent ?? "").replace(/\s*\*\s*$/, "").trimEnd();
+}
+function syncRequiredMark(wrapper) {
+  const label = fieldLabelOf(wrapper);
+  if (!label) return;
+  label.querySelectorAll("[data-ohw-required-mark]").forEach((el) => el.remove());
+  const words = fieldLabelText(label);
+  if ((label.textContent ?? "") !== words) label.textContent = words;
+  if (isFieldRequired(wrapper)) label.setAttribute(REQUIRED_MARK_ATTR, "");
+  else label.removeAttribute(REQUIRED_MARK_ATTR);
+}
+function setFieldRequired(wrapper, required) {
+  const input = fieldInputOf(wrapper);
+  const label = fieldLabelOf(wrapper);
+  if (!input) return;
+  if (required) input.setAttribute("required", "");
+  else input.removeAttribute("required");
+  if (label) syncRequiredMark(wrapper);
+}
+function beginPlaceholderEdit(wrapper) {
+  const input = fieldInputOf(wrapper);
+  if (!input || input.hasAttribute(PLACEHOLDER_EDIT_ATTR)) return;
+  input.setAttribute(PLACEHOLDER_EDIT_ATTR, "");
+  input.value = input.getAttribute("placeholder") ?? "";
+  input.setAttribute("placeholder", "");
+}
+function commitPlaceholderEdit(wrapper) {
+  if (!wrapper) return false;
+  const input = fieldInputOf(wrapper);
+  if (!input || !input.hasAttribute(PLACEHOLDER_EDIT_ATTR)) return false;
+  const typed = input.value;
+  input.removeAttribute(PLACEHOLDER_EDIT_ATTR);
+  input.value = "";
+  const previous = input.getAttribute("placeholder") ?? "";
+  input.setAttribute("placeholder", typed);
+  return previous !== typed;
+}
+function setFieldPlaceholder(wrapper, placeholder) {
+  fieldInputOf(wrapper)?.setAttribute("placeholder", placeholder);
+}
+function uniqueKey(form, base) {
+  const taken = new Set(listFieldWrappers(form).map(fieldKeyOf));
+  if (!taken.has(base)) return base;
+  let n = 2;
+  while (taken.has(`${base}-${n}`)) n += 1;
+  return `${base}-${n}`;
+}
+function insertField(form, type) {
+  const existing = listFieldWrappers(form);
+  const source = existing[existing.length - 1] ?? null;
+  const key = uniqueKey(form, type);
+  let wrapper;
+  if (source) {
+    wrapper = source.cloneNode(true);
+    source.after(wrapper);
+  } else {
+    wrapper = document.createElement("div");
+    const label2 = document.createElement("label");
+    const input2 = document.createElement("input");
+    wrapper.append(label2, input2);
+    const submit = form.querySelector('button, input[type="submit"]');
+    if (submit) submit.before(wrapper);
+    else form.appendChild(wrapper);
+  }
+  wrapper.setAttribute(FIELD_ATTR, key);
+  wrapper.setAttribute(FIELD_TYPE_ATTR, type);
+  applyFieldType(wrapper, type);
+  const defaults = FIELD_DEFAULTS[type];
+  const input = fieldInputOf(wrapper);
+  if (input) {
+    input.setAttribute("name", key);
+    input.removeAttribute("required");
+    input.setAttribute("placeholder", defaults.placeholder);
+    input.value = "";
+  }
+  const label = ensureFieldLabel(wrapper, key);
+  label.textContent = defaults.label;
+  label.setAttribute("data-ohw-key", `${key}-label`);
+  return wrapper;
+}
+function duplicateField(form, wrapper) {
+  const copy = wrapper.cloneNode(true);
+  const key = uniqueKey(form, `${fieldKeyOf(wrapper)}-copy`);
+  copy.setAttribute(FIELD_ATTR, key);
+  const input = fieldInputOf(copy);
+  if (input) {
+    input.setAttribute("name", key);
+    input.removeAttribute("data-ohw-key");
+    input.value = "";
+  }
+  const label = fieldLabelOf(copy);
+  if (label) label.setAttribute("data-ohw-key", `${key}-label`);
+  wrapper.after(copy);
+  return copy;
+}
+function removeField(wrapper) {
+  wrapper.remove();
+}
+function applyFieldOrder(form, keys) {
+  const wrappers = listFieldWrappers(form);
+  const byKey = new Map(wrappers.map((wrapper) => [fieldKeyOf(wrapper), wrapper]));
+  const ordered = keys.map((key) => byKey.get(key)).filter((w) => Boolean(w));
+  if (ordered.length !== wrappers.length) return;
+  const slots = wrappers.map((wrapper) => {
+    const slot = document.createComment("ohw-field-slot");
+    wrapper.replaceWith(slot);
+    return slot;
+  });
+  ordered.forEach((wrapper, index) => slots[index].replaceWith(wrapper));
+}
+function moveField(form, key, toIndex) {
+  const keys = listFieldWrappers(form).map(fieldKeyOf);
+  const from = keys.indexOf(key);
+  if (from === -1) return;
+  const rest = keys.filter((k) => k !== key);
+  rest.splice(Math.max(0, Math.min(rest.length, toIndex)), 0, key);
+  applyFieldOrder(form, rest);
+}
+function reconcileFieldsFromContent(form, content) {
+  const formKey = form.getAttribute("data-ohw-key");
+  if (!formKey) return;
+  markFormFields(form);
+  const stored = parseFieldSpecs(content[fieldsKey(formKey)]);
+  if (!stored) return;
+  const byKey = new Map(listFieldWrappers(form).map((wrapper) => [fieldKeyOf(wrapper), wrapper]));
+  stored.forEach((spec) => {
+    let wrapper = byKey.get(spec.key) ?? null;
+    if (!wrapper) {
+      wrapper = insertField(form, spec.type);
+      if (!wrapper) return;
+      wrapper.setAttribute(FIELD_ATTR, spec.key);
+      const input = fieldInputOf(wrapper);
+      if (input) {
+        input.setAttribute("name", spec.key);
+      }
+      fieldLabelOf(wrapper)?.setAttribute("data-ohw-key", `${spec.key}-label`);
+      byKey.set(spec.key, wrapper);
+    }
+    applyFieldType(wrapper, spec.type);
+    setFieldRequired(wrapper, spec.required);
+    setFieldPlaceholder(wrapper, spec.placeholder);
+    const label = fieldLabelOf(wrapper);
+    if (label && spec.label) label.textContent = spec.label.replace(/\s*\*\s*$/, "").trimEnd();
+    syncRequiredMark(wrapper);
+  });
+  const wanted = new Set(stored.map((spec) => spec.key));
+  listFieldWrappers(form).forEach((wrapper) => {
+    if (!wanted.has(fieldKeyOf(wrapper))) wrapper.remove();
+  });
+  const currentOrder = listFieldWrappers(form).map(fieldKeyOf).join("\0");
+  const storedOrder = stored.map((spec) => spec.key).join("\0");
+  if (currentOrder !== storedOrder) {
+    applyFieldOrder(form, stored.map((spec) => spec.key));
+  }
+}
+
+// src/ui/form-field-toolbar.tsx
+import { AtSign, Asterisk, ChevronDown as ChevronDown2, Copy as Copy2, MoreHorizontal as MoreHorizontal2, Phone, TextQuote, Trash2 as Trash22, Type } from "lucide-react";
+import { jsx as jsx13, jsxs as jsxs6 } from "react/jsx-runtime";
+var TYPE_ICONS = {
+  "short-text": Type,
+  "long-text": TextQuote,
+  email: AtSign,
+  phone: Phone
+};
+function FormFieldToolbar({
+  type,
+  required,
+  onTypeChange,
+  onRequiredToggle,
+  onDuplicate,
+  onDelete
+}) {
+  const TypeIcon = TYPE_ICONS[type];
+  const typeLabel = FIELD_TYPES.find((entry) => entry.type === type)?.label ?? "Short text";
+  return /* @__PURE__ */ jsxs6(
+    "div",
+    {
+      "data-ohw-field-toolbar": "",
+      className: "pointer-events-auto flex items-center gap-0.5 whitespace-nowrap rounded-lg border border-border bg-background p-1 shadow-md",
+      children: [
+        /* @__PURE__ */ jsxs6(DropdownMenu, { children: [
+          /* @__PURE__ */ jsx13(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs6(
+            "button",
+            {
+              type: "button",
+              className: "flex h-7 items-center gap-1.5 whitespace-nowrap rounded-md px-2 text-[13px] font-medium text-foreground transition-colors hover:bg-muted/70",
+              "data-ohw-field-type-trigger": "",
+              children: [
+                /* @__PURE__ */ jsx13(TypeIcon, { size: 14, strokeWidth: 1.75, "aria-hidden": true }),
+                typeLabel,
+                /* @__PURE__ */ jsx13(ChevronDown2, { size: 13, className: "text-muted-foreground", "aria-hidden": true })
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ jsx13(DropdownMenuContent, { align: "start", sideOffset: 8, className: "min-w-[190px] p-1", children: FIELD_TYPES.map((entry) => {
+            const Icon = TYPE_ICONS[entry.type];
+            return /* @__PURE__ */ jsxs6(
+              DropdownMenuItem,
+              {
+                onSelect: () => onTypeChange(entry.type),
+                className: "rounded-md py-2 text-[13px] " + (entry.type === type ? "bg-primary/10" : ""),
+                children: [
+                  /* @__PURE__ */ jsx13(Icon, { size: 14, strokeWidth: 1.75, className: "shrink-0", "aria-hidden": true }),
+                  entry.label
+                ]
+              },
+              entry.type
+            );
+          }) })
+        ] }),
+        /* @__PURE__ */ jsx13("div", { className: "mx-0.5 h-5 w-px bg-border" }),
+        /* @__PURE__ */ jsxs6(
+          "button",
+          {
+            type: "button",
+            "aria-pressed": required,
+            onClick: onRequiredToggle,
+            className: "flex h-7 items-center gap-1.5 whitespace-nowrap rounded-md px-2 text-[13px] font-medium transition-colors " + (required ? "bg-primary/10 text-primary" : "text-foreground hover:bg-muted/70"),
+            "data-ohw-field-required": "",
+            children: [
+              /* @__PURE__ */ jsx13(Asterisk, { size: 14, strokeWidth: 2, "aria-hidden": true }),
+              "Required"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx13("div", { className: "mx-0.5 h-5 w-px bg-border" }),
+        /* @__PURE__ */ jsxs6(DropdownMenu, { children: [
+          /* @__PURE__ */ jsx13(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx13(
+            "button",
+            {
+              type: "button",
+              title: "More",
+              "aria-label": "More",
+              className: "flex h-7 w-7 items-center justify-center rounded-md text-foreground transition-colors hover:bg-muted/70",
+              children: /* @__PURE__ */ jsx13(MoreHorizontal2, { size: 15, "aria-hidden": true })
+            }
+          ) }),
+          /* @__PURE__ */ jsxs6(DropdownMenuContent, { align: "start", sideOffset: 8, className: "min-w-[170px] p-1", children: [
+            /* @__PURE__ */ jsxs6(DropdownMenuItem, { onSelect: onDuplicate, className: "rounded-md py-2 text-[13px]", children: [
+              /* @__PURE__ */ jsx13(Copy2, { size: 14, strokeWidth: 1.75, className: "shrink-0", "aria-hidden": true }),
+              "Duplicate"
+            ] }),
+            /* @__PURE__ */ jsxs6(DropdownMenuItem, { variant: "destructive", onSelect: onDelete, className: "rounded-md py-2 text-[13px]", children: [
+              /* @__PURE__ */ jsx13(Trash22, { size: 14, strokeWidth: 1.75, className: "shrink-0", "aria-hidden": true }),
+              "Delete"
+            ] })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+function FieldTypePicker({ onPick }) {
+  return /* @__PURE__ */ jsx13(
+    "div",
+    {
+      "data-ohw-field-type-picker": "",
+      className: "pointer-events-auto grid w-[420px] grid-cols-3 gap-3 rounded-xl border border-border bg-background p-4 shadow-lg",
+      children: FIELD_TYPES.map((entry) => {
+        const Icon = TYPE_ICONS[entry.type];
+        return /* @__PURE__ */ jsxs6(
+          "button",
+          {
+            type: "button",
+            onClick: () => onPick(entry.type),
+            className: "flex h-[104px] flex-col items-center justify-center gap-3 rounded-xl border border-border text-[15px] font-medium text-foreground transition-colors hover:border-primary hover:bg-primary/5",
+            children: [
+              /* @__PURE__ */ jsx13(Icon, { size: 26, strokeWidth: 1.5, "aria-hidden": true }),
+              entry.label
+            ]
+          },
+          entry.type
+        );
+      })
+    }
+  );
+}
+
 // src/ui/MediaOverlay.tsx
 import * as React7 from "react";
 import { Film, ImageIcon, Pause, Play, Volume2, VolumeX } from "lucide-react";
@@ -6737,7 +6982,7 @@ import { Film, ImageIcon, Pause, Play, Volume2, VolumeX } from "lucide-react";
 // src/ui/button.tsx
 import * as React6 from "react";
 import { Slot } from "radix-ui";
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { jsx as jsx14 } from "react/jsx-runtime";
 var buttonVariants = cva(
   "inline-flex items-center justify-center gap-1 whitespace-nowrap rounded-md text-sm font-medium transition-colors outline-none disabled:pointer-events-none disabled:opacity-50 min-w-[80px] px-3 py-2",
   {
@@ -6761,7 +7006,7 @@ var buttonVariants = cva(
 var Button = React6.forwardRef(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
     const Comp = asChild ? Slot.Root : "button";
-    return /* @__PURE__ */ jsx13(
+    return /* @__PURE__ */ jsx14(
       Comp,
       {
         ref,
@@ -6775,7 +7020,7 @@ var Button = React6.forwardRef(
 Button.displayName = "Button";
 
 // src/ui/MediaOverlay.tsx
-import { Fragment as Fragment4, jsx as jsx14, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx15, jsxs as jsxs7 } from "react/jsx-runtime";
 var MEDIA_UPLOAD_FADE_MS = 300;
 var VIDEO_SETTINGS_BAR_INSET = 8;
 var OVERLAY_BUTTON_STYLE = {
@@ -6833,7 +7078,7 @@ function MediaOverlay({
     return () => anim.cancel();
   }, [isUploading, fadingOut, onFadeOutComplete, hover.key]);
   if (isUploading) {
-    return /* @__PURE__ */ jsx14(
+    return /* @__PURE__ */ jsx15(
       "div",
       {
         ref: skeletonRef,
@@ -6842,11 +7087,11 @@ function MediaOverlay({
         "data-ohw-media-skeleton": "",
         "aria-hidden": true,
         style: { ...box, pointerEvents: "none" },
-        children: /* @__PURE__ */ jsx14("style", { children: SKELETON_CSS })
+        children: /* @__PURE__ */ jsx15("style", { children: SKELETON_CSS })
       }
     );
   }
-  const settingsBar = isVideo && !hover.isDragOver ? /* @__PURE__ */ jsxs6(
+  const settingsBar = isVideo && !hover.isDragOver ? /* @__PURE__ */ jsxs7(
     "div",
     {
       "data-ohw-bridge": "",
@@ -6862,7 +7107,7 @@ function MediaOverlay({
       },
       onClick: (e) => e.stopPropagation(),
       children: [
-        /* @__PURE__ */ jsx14(
+        /* @__PURE__ */ jsx15(
           Button,
           {
             "data-ohw-media-overlay": "",
@@ -6877,10 +7122,10 @@ function MediaOverlay({
               e.stopPropagation();
               onVideoSettingsChange?.(hover.key, { autoplay: !autoplay });
             },
-            children: autoplay ? /* @__PURE__ */ jsx14(Pause, { size: 14 }) : /* @__PURE__ */ jsx14(Play, { size: 14 })
+            children: autoplay ? /* @__PURE__ */ jsx15(Pause, { size: 14 }) : /* @__PURE__ */ jsx15(Play, { size: 14 })
           }
         ),
-        /* @__PURE__ */ jsx14(
+        /* @__PURE__ */ jsx15(
           Button,
           {
             "data-ohw-media-overlay": "",
@@ -6895,15 +7140,15 @@ function MediaOverlay({
               e.stopPropagation();
               onVideoSettingsChange?.(hover.key, { muted: !muted });
             },
-            children: muted ? /* @__PURE__ */ jsx14(VolumeX, { size: 14 }) : /* @__PURE__ */ jsx14(Volume2, { size: 14 })
+            children: muted ? /* @__PURE__ */ jsx15(VolumeX, { size: 14 }) : /* @__PURE__ */ jsx15(Volume2, { size: 14 })
           }
         )
       ]
     }
   ) : null;
-  return /* @__PURE__ */ jsxs6(Fragment4, { children: [
+  return /* @__PURE__ */ jsxs7(Fragment4, { children: [
     settingsBar,
-    /* @__PURE__ */ jsx14(
+    /* @__PURE__ */ jsx15(
       "div",
       {
         "data-ohw-bridge": "",
@@ -6920,7 +7165,7 @@ function MediaOverlay({
           background: "color-mix(in srgb, var(--color-primary) 20%, transparent)"
         },
         onClick: () => onReplace(hover.key),
-        children: /* @__PURE__ */ jsxs6(
+        children: /* @__PURE__ */ jsxs7(
           Button,
           {
             "data-ohw-media-overlay": "",
@@ -6938,7 +7183,7 @@ function MediaOverlay({
               onReplace(hover.key);
             },
             children: [
-              isVideo ? /* @__PURE__ */ jsx14(Film, { size: 14 }) : /* @__PURE__ */ jsx14(ImageIcon, { size: 14 }),
+              isVideo ? /* @__PURE__ */ jsx15(Film, { size: 14 }) : /* @__PURE__ */ jsx15(ImageIcon, { size: 14 }),
               isVideo ? "Replace video" : "Replace image"
             ]
           }
@@ -6950,7 +7195,7 @@ function MediaOverlay({
 
 // src/ui/CarouselOverlay.tsx
 import { GalleryHorizontal } from "lucide-react";
-import { jsx as jsx15, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs8 } from "react/jsx-runtime";
 var OVERLAY_BUTTON_STYLE2 = {
   pointerEvents: "auto",
   fontFamily: "Inter, sans-serif",
@@ -6962,7 +7207,7 @@ function CarouselOverlay({
   onEdit
 }) {
   const { rect } = hover;
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     "div",
     {
       "data-ohw-bridge": "",
@@ -6980,7 +7225,7 @@ function CarouselOverlay({
         background: "color-mix(in srgb, var(--color-primary) 20%, transparent)"
       },
       onClick: () => onEdit(hover.key),
-      children: /* @__PURE__ */ jsxs7(
+      children: /* @__PURE__ */ jsxs8(
         Button,
         {
           "data-ohw-carousel-overlay": "",
@@ -6994,7 +7239,7 @@ function CarouselOverlay({
             onEdit(hover.key);
           },
           children: [
-            /* @__PURE__ */ jsx15(GalleryHorizontal, { size: 14 }),
+            /* @__PURE__ */ jsx16(GalleryHorizontal, { size: 14 }),
             "Edit gallery"
           ]
         }
@@ -7035,13 +7280,9 @@ function parseSectionsFromHtml(html) {
 }
 
 // src/ui/ai-section/AiSectionOverlay.tsx
-import { Fragment as Fragment5, jsx as jsx16, jsxs as jsxs8 } from "react/jsx-runtime";
-function findSectionElement(instanceId) {
-  const escaped = CSS.escape(instanceId);
-  return document.querySelector(`[data-ohw-instance="${escaped}"]`) ?? document.querySelector(`[data-ohw-section="${escaped}"]:not([data-ohw-instance])`);
-}
-function readRect(instanceId) {
-  const el = findSectionElement(instanceId);
+import { Fragment as Fragment5, jsx as jsx17, jsxs as jsxs9 } from "react/jsx-runtime";
+function readRect(sectionId) {
+  const el = document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`);
   if (!el) return null;
   const r2 = el.getBoundingClientRect();
   if (r2.width <= 0 || r2.height <= 0) return null;
@@ -7064,7 +7305,7 @@ function useLiveSectionRect(sectionId) {
     const opts = { capture: true, passive: true };
     window.addEventListener("scroll", update, opts);
     window.addEventListener("resize", update);
-    const el = findSectionElement(sectionId);
+    const el = document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`);
     const ro = el ? new ResizeObserver(update) : null;
     if (el && ro) ro.observe(el);
     const interval = setInterval(update, 500);
@@ -7077,14 +7318,6 @@ function useLiveSectionRect(sectionId) {
   }, [sectionId]);
   return rect;
 }
-function computeSectionBoundaryFlags(instanceId) {
-  const topLevel = Array.from(document.querySelectorAll("[data-ohw-section]")).filter(
-    (el) => !el.parentElement?.closest("[data-ohw-section]")
-  );
-  const index = topLevel.findIndex((el) => (el.dataset.ohwInstance ?? el.dataset.ohwSection) === instanceId);
-  if (index === -1) return { isFirst: true, isLast: true };
-  return { isFirst: index === 0, isLast: index === topLevel.length - 1 };
-}
 var PRIMARY2 = "#0885FE";
 function edgeAwareRadius(rect) {
   const container = window.innerWidth <= 480 ? 16 : 24;
@@ -7103,8 +7336,8 @@ function ReviewButton({
   color
 }) {
   const [hover, setHover] = useState4(false);
-  return /* @__PURE__ */ jsxs8("div", { style: { position: "relative" }, children: [
-    /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsxs9("div", { style: { position: "relative" }, children: [
+    /* @__PURE__ */ jsx17(
       "button",
       {
         type: "button",
@@ -7128,7 +7361,7 @@ function ReviewButton({
         children
       }
     ),
-    hover && /* @__PURE__ */ jsx16(
+    hover && /* @__PURE__ */ jsx17(
       "div",
       {
         style: {
@@ -7158,7 +7391,6 @@ function AiSectionOverlay({
 }) {
   const [selectedId, setSelectedId] = useState4(null);
   const [reviewId, setReviewId] = useState4(null);
-  const [reviewButtonsHidden, setReviewButtonsHidden] = useState4(false);
   const reviewIdRef = useRef4(null);
   reviewIdRef.current = reviewId;
   const selectedIdRef = useRef4(null);
@@ -7167,7 +7399,7 @@ function AiSectionOverlay({
     (el) => {
       postToParent2({
         type: "ow:section-selected",
-        sectionId: el ? el.dataset.ohwInstance ?? el.dataset.ohwSection ?? null : null,
+        sectionId: el?.dataset.ohwSection ?? null,
         sectionLabel: el ? el.dataset.ohwSectionLabel ?? titleCaseSectionId(el.dataset.ohwSection ?? "") : null
       });
     },
@@ -7176,7 +7408,7 @@ function AiSectionOverlay({
   const selectFromElement = useCallback2(
     (el, options) => {
       const sectionEl = el?.closest("[data-ohw-section]") ?? null;
-      const id = sectionEl ? sectionEl.dataset.ohwInstance ?? sectionEl.dataset.ohwSection ?? null : null;
+      const id = sectionEl?.dataset.ohwSection ?? null;
       if (id === selectedIdRef.current) return;
       setSelectedId(id);
       if (options?.report !== false) report(sectionEl);
@@ -7217,10 +7449,9 @@ function AiSectionOverlay({
         }
         const found = readRect(sectionId) != null;
         setReviewId(found ? sectionId : null);
-        setReviewButtonsHidden(e.data.hideButtons === true);
         postToParent2({ type: "ow:ai-review-started", sectionId, found });
         if (found) {
-          document.querySelector(`[data-ohw-instance="${CSS.escape(sectionId)}"]`)?.scrollIntoView({ behavior: "smooth", block: "nearest" });
+          document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`)?.scrollIntoView({ behavior: "smooth", block: "nearest" });
         }
       }
     };
@@ -7239,7 +7470,7 @@ function AiSectionOverlay({
         return;
       }
       const sec = t.closest("[data-ohw-section]");
-      setHoveredId(sec ? sec.dataset.ohwInstance ?? sec.dataset.ohwSection ?? null : null);
+      setHoveredId(sec?.dataset.ohwSection ?? null);
     };
     const onLeave = () => setHoveredId(null);
     document.addEventListener("mousemove", onMove, { passive: true });
@@ -7271,31 +7502,11 @@ function AiSectionOverlay({
     },
     [postToParent2]
   );
-  const activeSelectionId = reviewId ? null : selectedId;
-  const selectionRect = useLiveSectionRect(activeSelectionId);
+  const selectionRect = useLiveSectionRect(reviewId ? null : selectedId);
   const reviewRect = useLiveSectionRect(reviewId);
   const hoverRect = useLiveSectionRect(reviewId || hoveredId === selectedId ? null : hoveredId);
-  useEffect4(() => {
-    if (!activeSelectionId || !selectionRect) {
-      postToParent2({ type: "ow:section-rect", instanceId: null, rect: null });
-      return;
-    }
-    const { isFirst, isLast } = computeSectionBoundaryFlags(activeSelectionId);
-    postToParent2({
-      type: "ow:section-rect",
-      instanceId: activeSelectionId,
-      rect: {
-        top: selectionRect.top + window.scrollY,
-        left: selectionRect.left + window.scrollX,
-        width: selectionRect.width,
-        height: selectionRect.height
-      },
-      isFirst,
-      isLast
-    });
-  }, [activeSelectionId, selectionRect, postToParent2]);
-  return /* @__PURE__ */ jsxs8(Fragment5, { children: [
-    hoverRect && /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsxs9(Fragment5, { children: [
+    hoverRect && /* @__PURE__ */ jsx17(
       "div",
       {
         "data-ohw-ai-section-hover": "",
@@ -7313,7 +7524,7 @@ function AiSectionOverlay({
         }
       }
     ),
-    selectionRect && /* @__PURE__ */ jsx16(
+    selectionRect && /* @__PURE__ */ jsx17(
       "div",
       {
         "data-ohw-ai-section-selected": "",
@@ -7331,7 +7542,7 @@ function AiSectionOverlay({
         }
       }
     ),
-    reviewRect && /* @__PURE__ */ jsx16(
+    reviewRect && /* @__PURE__ */ jsx17(
       "div",
       {
         "data-ohw-ai-review": "",
@@ -7344,16 +7555,13 @@ function AiSectionOverlay({
           border: `2px solid ${PRIMARY2}`,
           borderRadius: edgeAwareRadius(reviewRect),
           zIndex: 2147483200,
-          // The veil itself: swallows clicks so the section stays locked until decided. This
-          // stopPropagation only guards the bubble phase; the bridge's capture-phase click
-          // handlers additionally bail on `[data-ohw-ai-review]`, without which a click on
-          // Accept/Discard resolves to the media beneath and opens the file picker.
+          // The veil itself: swallows clicks so the section stays locked until decided.
           background: "rgba(8, 133, 254, 0.04)",
           pointerEvents: "auto",
           cursor: "default"
         },
         onClick: (e) => e.stopPropagation(),
-        children: !reviewButtonsHidden && /* @__PURE__ */ jsxs8(
+        children: /* @__PURE__ */ jsxs9(
           "div",
           {
             style: {
@@ -7366,8 +7574,8 @@ function AiSectionOverlay({
               paddingTop: 12
             },
             children: [
-              /* @__PURE__ */ jsx16(ReviewButton, { label: "Accept", onClick: () => decide("accept"), background: PRIMARY2, color: "#ffffff", children: /* @__PURE__ */ jsx16(Check, { size: 16, strokeWidth: 2.5, "aria-hidden": true }) }),
-              /* @__PURE__ */ jsx16(ReviewButton, { label: "Discard", onClick: () => decide("discard"), background: "#EFF6FF", color: "#0c0a09", children: /* @__PURE__ */ jsx16(X, { size: 16, strokeWidth: 2, "aria-hidden": true }) })
+              /* @__PURE__ */ jsx17(ReviewButton, { label: "Accept", onClick: () => decide("accept"), background: PRIMARY2, color: "#ffffff", children: /* @__PURE__ */ jsx17(Check, { size: 16, strokeWidth: 2.5, "aria-hidden": true }) }),
+              /* @__PURE__ */ jsx17(ReviewButton, { label: "Discard", onClick: () => decide("discard"), background: "#EFF6FF", color: "#0c0a09", children: /* @__PURE__ */ jsx17(X, { size: 16, strokeWidth: 2, "aria-hidden": true }) })
             ]
           }
         )
@@ -7727,22 +7935,22 @@ import { useEffect as useEffect8 } from "react";
 import * as React8 from "react";
 import { Dialog as DialogPrimitive } from "radix-ui";
 import { X as X2 } from "lucide-react";
-import { jsx as jsx17, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs10 } from "react/jsx-runtime";
 function Dialog2({
   ...props
 }) {
-  return /* @__PURE__ */ jsx17(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
+  return /* @__PURE__ */ jsx18(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
 }
 function DialogPortal({
   ...props
 }) {
-  return /* @__PURE__ */ jsx17(DialogPrimitive.Portal, { ...props });
+  return /* @__PURE__ */ jsx18(DialogPrimitive.Portal, { ...props });
 }
 function DialogOverlay({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx18(
     DialogPrimitive.Overlay,
     {
       "data-slot": "dialog-overlay",
@@ -7755,9 +7963,9 @@ function DialogOverlay({
 var DialogContent = React8.forwardRef(
   ({ className, children, showCloseButton = true, container, ...props }, ref) => {
     const positionMode = container ? "absolute" : "fixed";
-    return /* @__PURE__ */ jsxs9(DialogPortal, { container: container ?? void 0, children: [
-      /* @__PURE__ */ jsx17(DialogOverlay, { className: cn(positionMode, "inset-0") }),
-      /* @__PURE__ */ jsxs9(
+    return /* @__PURE__ */ jsxs10(DialogPortal, { container: container ?? void 0, children: [
+      /* @__PURE__ */ jsx18(DialogOverlay, { className: cn(positionMode, "inset-0") }),
+      /* @__PURE__ */ jsxs10(
         DialogPrimitive.Content,
         {
           ref,
@@ -7773,13 +7981,13 @@ var DialogContent = React8.forwardRef(
           ...props,
           children: [
             children,
-            showCloseButton ? /* @__PURE__ */ jsx17(
+            showCloseButton ? /* @__PURE__ */ jsx18(
               DialogPrimitive.Close,
               {
                 type: "button",
                 className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50",
                 "aria-label": "Close",
-                children: /* @__PURE__ */ jsx17(X2, { size: 16, "aria-hidden": true })
+                children: /* @__PURE__ */ jsx18(X2, { size: 16, "aria-hidden": true })
               }
             ) : null
           ]
@@ -7793,13 +8001,13 @@ function DialogHeader({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx17("div", { className: cn("flex flex-col gap-1.5", className), ...props });
+  return /* @__PURE__ */ jsx18("div", { className: cn("flex flex-col gap-1.5", className), ...props });
 }
 function DialogFooter({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx17(
+  return /* @__PURE__ */ jsx18(
     "div",
     {
       className: cn("flex items-center justify-end gap-2", className),
@@ -7807,7 +8015,7 @@ function DialogFooter({
     }
   );
 }
-var DialogTitle = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx17(
+var DialogTitle = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx18(
   DialogPrimitive.Title,
   {
     ref,
@@ -7819,7 +8027,7 @@ var DialogTitle = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 DialogTitle.displayName = DialogPrimitive.Title.displayName;
-var DialogDescription = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx17(
+var DialogDescription = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx18(
   DialogPrimitive.Description,
   {
     ref,
@@ -7835,19 +8043,19 @@ import { Info, X as X4 } from "lucide-react";
 
 // src/ui/link-modal/DestinationBreadcrumb.tsx
 import { ArrowRight as ArrowRight2, File, GalleryVertical } from "lucide-react";
-import { jsx as jsx18, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
 function DestinationBreadcrumb({
   pageTitle,
   sectionLabel
 }) {
-  return /* @__PURE__ */ jsxs10("div", { className: "flex w-full flex-col gap-2", children: [
-    /* @__PURE__ */ jsx18("p", { className: "text-sm font-medium! text-foreground m-0", children: "Destination" }),
-    /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-3", children: [
-      /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx18(File, { size: 16, className: "shrink-0 text-foreground", "aria-hidden": true }),
-        /* @__PURE__ */ jsx18("span", { className: "text-sm font-medium leading-none text-foreground!", children: pageTitle })
+  return /* @__PURE__ */ jsxs11("div", { className: "flex w-full flex-col gap-2", children: [
+    /* @__PURE__ */ jsx19("p", { className: "text-sm font-medium! text-foreground m-0", children: "Destination" }),
+    /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx19(File, { size: 16, className: "shrink-0 text-foreground", "aria-hidden": true }),
+        /* @__PURE__ */ jsx19("span", { className: "text-sm font-medium leading-none text-foreground!", children: pageTitle })
       ] }),
-      /* @__PURE__ */ jsx18(
+      /* @__PURE__ */ jsx19(
         ArrowRight2,
         {
           size: 16,
@@ -7855,8 +8063,8 @@ function DestinationBreadcrumb({
           "aria-hidden": true
         }
       ),
-      /* @__PURE__ */ jsxs10("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
-        /* @__PURE__ */ jsx18(
+      /* @__PURE__ */ jsxs11("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
+        /* @__PURE__ */ jsx19(
           GalleryVertical,
           {
             size: 16,
@@ -7864,7 +8072,7 @@ function DestinationBreadcrumb({
             "aria-hidden": true
           }
         ),
-        /* @__PURE__ */ jsx18("span", { className: "truncate text-sm font-medium leading-none text-foreground", children: sectionLabel })
+        /* @__PURE__ */ jsx19("span", { className: "truncate text-sm font-medium leading-none text-foreground", children: sectionLabel })
       ] })
     ] })
   ] });
@@ -7872,22 +8080,22 @@ function DestinationBreadcrumb({
 
 // src/ui/link-modal/SectionTreeItem.tsx
 import { GalleryVertical as GalleryVertical2 } from "lucide-react";
-import { jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs12 } from "react/jsx-runtime";
 function SectionTreeItem({
   section,
   onSelect,
   selected
 }) {
   const interactive = Boolean(onSelect);
-  return /* @__PURE__ */ jsxs11("div", { className: "flex h-9 w-full items-end pl-3", children: [
-    /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsxs12("div", { className: "flex h-9 w-full items-end pl-3", children: [
+    /* @__PURE__ */ jsx20(
       "div",
       {
         className: "mr-[-1px] h-9 w-2 shrink-0 rounded-bl-sm border-b border-l border-border mb-4",
         "aria-hidden": true
       }
     ),
-    /* @__PURE__ */ jsxs11(
+    /* @__PURE__ */ jsxs12(
       "div",
       {
         role: interactive ? "button" : void 0,
@@ -7905,7 +8113,7 @@ function SectionTreeItem({
           interactive && selected && "border-primary"
         ),
         children: [
-          /* @__PURE__ */ jsx19(
+          /* @__PURE__ */ jsx20(
             GalleryVertical2,
             {
               size: 16,
@@ -7913,7 +8121,7 @@ function SectionTreeItem({
               "aria-hidden": true
             }
           ),
-          /* @__PURE__ */ jsx19("span", { className: "truncate text-sm font-normal leading-5 text-foreground", children: section.label })
+          /* @__PURE__ */ jsx20("span", { className: "truncate text-sm font-normal leading-5 text-foreground", children: section.label })
         ]
       }
     )
@@ -7925,10 +8133,10 @@ import { useEffect as useEffect5, useId as useId2, useRef as useRef5, useState a
 
 // src/ui/input.tsx
 import * as React9 from "react";
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx21 } from "react/jsx-runtime";
 var Input = React9.forwardRef(
   ({ className, type, ...props }, ref) => {
-    return /* @__PURE__ */ jsx20(
+    return /* @__PURE__ */ jsx21(
       "input",
       {
         type,
@@ -7947,9 +8155,9 @@ Input.displayName = "Input";
 
 // src/ui/label.tsx
 import { Label as LabelPrimitive } from "radix-ui";
-import { jsx as jsx21 } from "react/jsx-runtime";
+import { jsx as jsx22 } from "react/jsx-runtime";
 function Label({ className, ...props }) {
-  return /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx22(
     LabelPrimitive.Root,
     {
       "data-slot": "label",
@@ -7960,12 +8168,12 @@ function Label({ className, ...props }) {
 }
 
 // src/ui/link-modal/UrlOrPageInput.tsx
-import { ChevronDown as ChevronDown2, File as File2, X as X3 } from "lucide-react";
-import { jsx as jsx22, jsxs as jsxs12 } from "react/jsx-runtime";
+import { ChevronDown as ChevronDown3, File as File2, X as X3 } from "lucide-react";
+import { jsx as jsx23, jsxs as jsxs13 } from "react/jsx-runtime";
 function FieldChevron({
   onClick
 }) {
-  return /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsx23(
     "button",
     {
       type: "button",
@@ -7973,7 +8181,7 @@ function FieldChevron({
       onClick,
       "aria-label": "Open page list",
       tabIndex: -1,
-      children: /* @__PURE__ */ jsx22(ChevronDown2, { size: 16 })
+      children: /* @__PURE__ */ jsx23(ChevronDown3, { size: 16 })
     }
   );
 }
@@ -8034,11 +8242,11 @@ function UrlOrPageInput({
     "data-ohw-link-field flex h-[36px] w-full items-center overflow-hidden rounded-md border bg-background pl-3 pr-3 py-2 outline-none transition-[border-color,box-shadow]",
     urlError ? "border-destructive shadow-[0_0_0_1px_var(--ohw-destructive)]" : isFocused ? "border-primary shadow-[0_0_0_1px_var(--ohw-primary)]" : "border-input"
   );
-  return /* @__PURE__ */ jsxs12("div", { className: "flex w-full flex-col gap-2 p-0", children: [
-    /* @__PURE__ */ jsx22(Label, { htmlFor: inputId, className: cn(urlError && "text-destructive"), children: "Destination" }),
-    /* @__PURE__ */ jsxs12("div", { ref: rootRef, className: "relative w-full", children: [
-      /* @__PURE__ */ jsxs12("div", { "data-ohw-link-field": true, className: fieldClassName, children: [
-        selectedPage ? /* @__PURE__ */ jsx22("div", { className: "flex shrink-0 items-center pr-2", children: /* @__PURE__ */ jsx22(
+  return /* @__PURE__ */ jsxs13("div", { className: "flex w-full flex-col gap-2 p-0", children: [
+    /* @__PURE__ */ jsx23(Label, { htmlFor: inputId, className: cn(urlError && "text-destructive"), children: "Destination" }),
+    /* @__PURE__ */ jsxs13("div", { ref: rootRef, className: "relative w-full", children: [
+      /* @__PURE__ */ jsxs13("div", { "data-ohw-link-field": true, className: fieldClassName, children: [
+        selectedPage ? /* @__PURE__ */ jsx23("div", { className: "flex shrink-0 items-center pr-2", children: /* @__PURE__ */ jsx23(
           File2,
           {
             size: 16,
@@ -8046,7 +8254,7 @@ function UrlOrPageInput({
             "aria-hidden": true
           }
         ) }) : null,
-        readOnly ? /* @__PURE__ */ jsx22("span", { className: "min-w-0 flex-1 truncate text-sm leading-5 text-foreground", children: selectedPage?.title ?? value }) : /* @__PURE__ */ jsx22(
+        readOnly ? /* @__PURE__ */ jsx23("span", { className: "min-w-0 flex-1 truncate text-sm leading-5 text-foreground", children: selectedPage?.title ?? value }) : /* @__PURE__ */ jsx23(
           Input,
           {
             ref: inputRef,
@@ -8072,7 +8280,7 @@ function UrlOrPageInput({
             )
           }
         ),
-        selectedPage && !readOnly ? /* @__PURE__ */ jsx22(
+        selectedPage && !readOnly ? /* @__PURE__ */ jsx23(
           "button",
           {
             type: "button",
@@ -8080,26 +8288,26 @@ function UrlOrPageInput({
             onMouseDown: clearSelection,
             "aria-label": "Clear selected page",
             tabIndex: -1,
-            children: /* @__PURE__ */ jsx22(X3, { size: 16, "aria-hidden": true })
+            children: /* @__PURE__ */ jsx23(X3, { size: 16, "aria-hidden": true })
           }
         ) : null,
-        !readOnly ? /* @__PURE__ */ jsx22(FieldChevron, { onClick: toggleDropdown }) : null
+        !readOnly ? /* @__PURE__ */ jsx23(FieldChevron, { onClick: toggleDropdown }) : null
       ] }),
-      dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ jsx22(
+      dropdownOpen && !readOnly && filteredPages.length > 0 ? /* @__PURE__ */ jsx23(
         "div",
         {
           "data-ohw-link-page-dropdown": "",
           className: "absolute left-0 right-0 top-[calc(100%+4px)] z-50 max-h-48 overflow-auto rounded-lg border border-border bg-popover py-1 shadow-lg",
           onMouseDown: (e) => e.preventDefault(),
-          children: filteredPages.map((page) => /* @__PURE__ */ jsxs12(
+          children: filteredPages.map((page) => /* @__PURE__ */ jsxs13(
             "button",
             {
               type: "button",
               className: "flex h-9 w-full items-center gap-2 border-0 bg-transparent px-3 text-left text-sm leading-5 text-foreground outline-none hover:bg-muted",
               onClick: () => onPageSelect(page),
               children: [
-                /* @__PURE__ */ jsx22(File2, { size: 16, className: "shrink-0", "aria-hidden": true }),
-                /* @__PURE__ */ jsx22("span", { className: "truncate", children: page.title })
+                /* @__PURE__ */ jsx23(File2, { size: 16, className: "shrink-0", "aria-hidden": true }),
+                /* @__PURE__ */ jsx23("span", { className: "truncate", children: page.title })
               ]
             },
             page.path
@@ -8107,34 +8315,34 @@ function UrlOrPageInput({
         }
       ) : null
     ] }),
-    urlError ? /* @__PURE__ */ jsx22("p", { className: "text-sm font-medium text-destructive", children: urlError }) : null
+    urlError ? /* @__PURE__ */ jsx23("p", { className: "text-sm font-medium text-destructive", children: urlError }) : null
   ] });
 }
 
 // src/ui/link-modal/LinkEditorPanel.tsx
-import { Fragment as Fragment6, jsx as jsx23, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime";
 function LinkEditorPanel({ state, onClose }) {
   const isCancel = state.secondaryLabel === "Cancel" || state.secondaryLabel === "Back to sections";
-  return /* @__PURE__ */ jsxs13(Fragment6, { children: [
-    /* @__PURE__ */ jsx23(DialogClose, { asChild: true, children: /* @__PURE__ */ jsx23(
+  return /* @__PURE__ */ jsxs14(Fragment6, { children: [
+    /* @__PURE__ */ jsx24(DialogClose, { asChild: true, children: /* @__PURE__ */ jsx24(
       "button",
       {
         type: "button",
         className: "absolute right-[9px] top-[9px] rounded-sm p-1.5 text-foreground hover:bg-muted/50 h-7",
         "aria-label": "Close",
         onClick: onClose,
-        children: /* @__PURE__ */ jsx23(X4, { size: 16, "aria-hidden": true })
+        children: /* @__PURE__ */ jsx24(X4, { size: 16, "aria-hidden": true })
       }
     ) }),
-    /* @__PURE__ */ jsx23(DialogHeader, { className: "w-full gap-1.5 p-6 pr-12", children: /* @__PURE__ */ jsx23(DialogTitle, { className: "m-0 w-full break-words", children: state.title }) }),
-    /* @__PURE__ */ jsxs13("div", { className: "flex w-full flex-col gap-3 px-6 pb-8 pt-1", children: [
-      state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ jsx23(
+    /* @__PURE__ */ jsx24(DialogHeader, { className: "w-full gap-1.5 p-6 pr-12", children: /* @__PURE__ */ jsx24(DialogTitle, { className: "m-0 w-full break-words", children: state.title }) }),
+    /* @__PURE__ */ jsxs14("div", { className: "flex w-full flex-col gap-3 px-6 pb-8 pt-1", children: [
+      state.showBreadcrumb && state.selectedPage && state.selectedSection ? /* @__PURE__ */ jsx24(
         DestinationBreadcrumb,
         {
           pageTitle: state.selectedPage.title,
           sectionLabel: state.selectedSection.label
         }
-      ) : /* @__PURE__ */ jsx23(
+      ) : /* @__PURE__ */ jsx24(
         UrlOrPageInput,
         {
           value: state.searchValue,
@@ -8147,8 +8355,8 @@ function LinkEditorPanel({ state, onClose }) {
           urlError: state.urlError
         }
       ),
-      state.showChooseSection ? /* @__PURE__ */ jsxs13("div", { className: "flex flex-col justify-center gap-2", children: [
-        /* @__PURE__ */ jsx23(
+      state.showChooseSection ? /* @__PURE__ */ jsxs14("div", { className: "flex flex-col justify-center gap-2", children: [
+        /* @__PURE__ */ jsx24(
           Button,
           {
             type: "button",
@@ -8159,15 +8367,15 @@ function LinkEditorPanel({ state, onClose }) {
             children: "Choose a section"
           }
         ),
-        /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-1 text-sm text-muted-foreground", children: [
-          /* @__PURE__ */ jsx23(Info, { size: 16, className: "shrink-0", "aria-hidden": true }),
-          /* @__PURE__ */ jsx23("span", { children: "Pick a section this link should scroll to." })
+        /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-1 text-sm text-muted-foreground", children: [
+          /* @__PURE__ */ jsx24(Info, { size: 16, className: "shrink-0", "aria-hidden": true }),
+          /* @__PURE__ */ jsx24("span", { children: "Pick a section this link should scroll to." })
         ] })
       ] }) : null,
-      state.showSectionRow && state.selectedSection ? /* @__PURE__ */ jsx23(SectionTreeItem, { section: state.selectedSection, selected: true }) : null
+      state.showSectionRow && state.selectedSection ? /* @__PURE__ */ jsx24(SectionTreeItem, { section: state.selectedSection, selected: true }) : null
     ] }),
-    /* @__PURE__ */ jsxs13(DialogFooter, { className: "w-full px-6 pb-6", children: [
-      /* @__PURE__ */ jsx23(
+    /* @__PURE__ */ jsxs14(DialogFooter, { className: "w-full px-6 pb-6", children: [
+      /* @__PURE__ */ jsx24(
         Button,
         {
           type: "button",
@@ -8182,7 +8390,7 @@ function LinkEditorPanel({ state, onClose }) {
           children: state.secondaryLabel
         }
       ),
-      /* @__PURE__ */ jsx23(
+      /* @__PURE__ */ jsx24(
         Button,
         {
           type: "button",
@@ -8205,7 +8413,7 @@ import { useCallback as useCallback3, useEffect as useEffect6, useMemo as useMem
 import { createPortal } from "react-dom";
 import { ArrowLeft as ArrowLeft2, Check as Check2 } from "lucide-react";
 import { usePathname, useRouter as useRouter2 } from "next/navigation";
-import { jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs15 } from "react/jsx-runtime";
 var DIM_OVERLAY = "rgba(0, 0, 0, 0.45)";
 function rectsEqual(a, b) {
   if (a.size !== b.size) return false;
@@ -8434,7 +8642,7 @@ function SectionPickerOverlay({
   const portalRoot = typeof document !== "undefined" ? document.querySelector("[data-ohw-bridge-root]") ?? document.body : null;
   if (!portalRoot) return null;
   return createPortal(
-    /* @__PURE__ */ jsxs14(
+    /* @__PURE__ */ jsxs15(
       "div",
       {
         "data-ohw-section-picker": "",
@@ -8444,12 +8652,12 @@ function SectionPickerOverlay({
         role: "dialog",
         "aria-label": "Choose a section",
         children: [
-          /* @__PURE__ */ jsx24(
+          /* @__PURE__ */ jsx25(
             "div",
             {
               className: "pointer-events-auto fixed left-5 z-[2]",
               style: { top: chromeClip.top + 20 },
-              children: /* @__PURE__ */ jsxs14(
+              children: /* @__PURE__ */ jsxs15(
                 Button,
                 {
                   type: "button",
@@ -8458,14 +8666,14 @@ function SectionPickerOverlay({
                   className: "h-8 min-w-0 gap-1 border-border bg-background px-2 py-1.5 shadow-sm hover:bg-muted cursor-pointer",
                   onClick: onBack,
                   children: [
-                    /* @__PURE__ */ jsx24(ArrowLeft2, { className: "size-4 shrink-0", "aria-hidden": true }),
+                    /* @__PURE__ */ jsx25(ArrowLeft2, { className: "size-4 shrink-0", "aria-hidden": true }),
                     "Back"
                   ]
                 }
               )
             }
           ),
-          /* @__PURE__ */ jsx24(
+          /* @__PURE__ */ jsx25(
             "div",
             {
               className: "pointer-events-none fixed left-1/2 z-[2] rounded-lg px-4 py-3 text-xs leading-4 tracking-[0.18px] text-white shadow-md",
@@ -8478,7 +8686,7 @@ function SectionPickerOverlay({
               children: "Click on section to select"
             }
           ),
-          !isOnTargetPage ? /* @__PURE__ */ jsx24(
+          !isOnTargetPage ? /* @__PURE__ */ jsx25(
             "div",
             {
               className: "pointer-events-none fixed left-1/2 z-[1] -translate-x-1/2 rounded-md px-3 py-2 text-sm text-muted-foreground shadow-sm",
@@ -8486,14 +8694,14 @@ function SectionPickerOverlay({
               children: "Loading page preview\u2026"
             }
           ) : null,
-          isOnTargetPage && liveSections.length === 0 ? /* @__PURE__ */ jsx24("div", { className: "pointer-events-auto fixed inset-0 z-[1] flex items-center justify-center bg-muted/40", children: /* @__PURE__ */ jsx24("p", { className: "text-sm text-muted-foreground", children: "No sections found on this page." }) }) : null,
+          isOnTargetPage && liveSections.length === 0 ? /* @__PURE__ */ jsx25("div", { className: "pointer-events-auto fixed inset-0 z-[1] flex items-center justify-center bg-muted/40", children: /* @__PURE__ */ jsx25("p", { className: "text-sm text-muted-foreground", children: "No sections found on this page." }) }) : null,
           isOnTargetPage ? liveSections.map((section) => {
             const rect = rects.get(section.id);
             if (!rect || rect.width <= 0 || rect.height <= 0) return null;
             const isSelected = selectedId === section.id;
             const isHovered = hoveredId === section.id;
             const isLit = isSelected || isHovered;
-            return /* @__PURE__ */ jsxs14(
+            return /* @__PURE__ */ jsxs15(
               "button",
               {
                 type: "button",
@@ -8508,7 +8716,7 @@ function SectionPickerOverlay({
                 "aria-label": `Select section ${section.label}`,
                 onClick: () => handleSelect(section),
                 children: [
-                  isLit ? /* @__PURE__ */ jsx24(
+                  isLit ? /* @__PURE__ */ jsx25(
                     "span",
                     {
                       className: "pointer-events-none absolute",
@@ -8521,13 +8729,13 @@ function SectionPickerOverlay({
                       "aria-hidden": true
                     }
                   ) : null,
-                  isSelected ? /* @__PURE__ */ jsx24(
+                  isSelected ? /* @__PURE__ */ jsx25(
                     "span",
                     {
                       className: "absolute right-3 top-3 flex size-8 items-center justify-center rounded-full text-white",
                       style: { backgroundColor: "var(--ohw-primary, #0885fe)" },
                       "aria-hidden": true,
-                      children: /* @__PURE__ */ jsx24(Check2, { className: "size-5" })
+                      children: /* @__PURE__ */ jsx25(Check2, { className: "size-5" })
                     }
                   ) : null
                 ]
@@ -8707,7 +8915,7 @@ function useLinkModalState({
 }
 
 // src/ui/link-modal/LinkPopover.tsx
-import { Fragment as Fragment7, jsx as jsx25, jsxs as jsxs15 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
 function postToParent(data) {
   window.parent?.postMessage(data, "*");
 }
@@ -8803,15 +9011,15 @@ function LinkPopover({
       );
     };
   }, [open, sectionPickerActive]);
-  return /* @__PURE__ */ jsxs15(Fragment7, { children: [
-    /* @__PURE__ */ jsx25(
+  return /* @__PURE__ */ jsxs16(Fragment7, { children: [
+    /* @__PURE__ */ jsx26(
       Dialog2,
       {
         open: open && !sectionPickerActive,
         onOpenChange: (next) => {
           if (!next) onClose?.();
         },
-        children: /* @__PURE__ */ jsx25(
+        children: /* @__PURE__ */ jsx26(
           DialogContent,
           {
             ref: panelRef,
@@ -8821,12 +9029,12 @@ function LinkPopover({
             "data-ohw-bridge": "",
             showCloseButton: false,
             className: "gap-0 p-0 w-full max-w-[448px] pointer-events-auto z-[2147483646] overflow-visible",
-            children: /* @__PURE__ */ jsx25(LinkEditorPanel, { state, onClose })
+            children: /* @__PURE__ */ jsx26(LinkEditorPanel, { state, onClose })
           }
         )
       }
     ),
-    sectionPickerActive && state.selectedPage ? /* @__PURE__ */ jsx25(
+    sectionPickerActive && state.selectedPage ? /* @__PURE__ */ jsx26(
       SectionPickerOverlay,
       {
         pagePath: state.selectedPage.path,
@@ -10052,13 +10260,14 @@ function listSocialItems(row) {
     return isSocialItem(anchor) ? anchor : null;
   }).filter((item) => item !== null);
 }
-function socialRowUnit(item) {
-  const row = findSocialsRow(item);
+function socialRowUnit(item, knownRow) {
+  const row = knownRow ?? findSocialsRow(item);
+  if (!row || !row.contains(item)) return null;
   let node = item;
   while (node.parentElement && node.parentElement !== row) {
     node = node.parentElement;
   }
-  return node;
+  return node.parentElement === row ? node : null;
 }
 function listSocialsRows(root = document) {
   const rows = /* @__PURE__ */ new Set();
@@ -10077,7 +10286,8 @@ function markSocialsRows(root = document) {
   listSocialsRows(root).forEach((row) => {
     row.setAttribute(SOCIALS_ROW_ATTR, "");
     const items = listSocialItems(row);
-    if (items[0]) rowTemplates.set(rowKeyOf(row), socialRowUnit(items[0]).outerHTML);
+    const firstUnit = items[0] ? socialRowUnit(items[0], row) : null;
+    if (firstUnit) rowTemplates.set(rowKeyOf(row), firstUnit.outerHTML);
     items.forEach((item, index) => {
       item.setAttribute(SOCIALS_ITEM_ATTR, String(index));
       const iconKey = socialIconKey(item);
@@ -10221,7 +10431,8 @@ function removeSocialItem(item, content) {
   const previousContent = Object.fromEntries(
     removedKeys.filter((key) => key in content).map((key) => [key, content[key]])
   );
-  const unit = socialRowUnit(item);
+  const unit = socialRowUnit(item, row);
+  if (!unit) return null;
   const nextSibling = unit.nextElementSibling;
   unit.remove();
   markSocialsRows(row.ownerDocument);
@@ -10244,7 +10455,9 @@ function applySocialsOrder(order, root = document) {
     const byKey = new Map(listSocialItems(row).map((item) => [socialHrefKey(item), item]));
     wanted.forEach((key) => {
       const item = byKey.get(key);
-      if (item) row.appendChild(socialRowUnit(item));
+      if (!item) return;
+      const unit = socialRowUnit(item, row);
+      if (unit) row.appendChild(unit);
     });
   });
   markSocialsRows(root);
@@ -10274,7 +10487,7 @@ function reconcileSocialsFromContent(content, root = document) {
     });
     if (surviving.length) {
       present.forEach((item) => {
-        if (!surviving.includes(item)) socialRowUnit(item).remove();
+        if (!surviving.includes(item)) socialRowUnit(item)?.remove();
       });
     }
   });
@@ -11253,296 +11466,42 @@ function deleteFooterColumn(column) {
   };
 }
 
-// src/lib/logo-identity.ts
-var LOGO_TEXT_KEYS = ["nav-logo-text", "footer-logo-text", "logo-text"];
-var LOGO_IMAGE_KEYS = ["nav-logo-image", "footer-logo", "footer-logo-image"];
-var LOGO_HREF_KEYS = ["nav-logo-href", "footer-logo-href", "logo-href"];
-var LOGO_PLACEHOLDER_KEY = "logo-is-placeholder";
-var LOGO_ALT_KEY = "logo-alt";
-var LOGO_IMAGE_URL_KEY = "nav-logo-image";
-var PLACEHOLDER_BUSINESS_NAME = "Business name";
-function resolveLogoDisplayText(text) {
-  const trimmed = (text ?? "").trim();
-  return trimmed || PLACEHOLDER_BUSINESS_NAME;
-}
-function isFooterLogoRoot(root) {
-  return Boolean(root.closest("footer") || root.closest('[data-ohw-section="footer"]'));
-}
-function imageKeyForRoot(root) {
-  return isFooterLogoRoot(root) ? "footer-logo" : "nav-logo-image";
-}
-function textKeyForRoot(root) {
-  return isFooterLogoRoot(root) ? "footer-logo-text" : "nav-logo-text";
-}
-function ensureLogoHrefKey(root) {
-  if (!(root instanceof HTMLAnchorElement)) return;
-  if (root.hasAttribute("data-ohw-href-key")) return;
-  root.setAttribute("data-ohw-href-key", isFooterLogoRoot(root) ? "footer-logo-href" : "nav-logo-href");
-}
-function applyLogoIdentity(text, isPlaceholder) {
-  const display = resolveLogoDisplayText(text);
-  const placeholder = isPlaceholder || !text.trim() || display === PLACEHOLDER_BUSINESS_NAME;
-  for (const key of LOGO_TEXT_KEYS) {
-    document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
-      if (el.textContent !== display) el.textContent = display;
-    });
-  }
-  for (const key of LOGO_IMAGE_KEYS) {
-    document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
-      const img = el instanceof HTMLImageElement ? el : el.querySelector("img");
-      if (img) img.alt = display;
+// src/lib/add-footer-column.ts
+function buildFooterColumnEditContentPatch(result) {
+  return {
+    [result.headingKey]: result.heading,
+    [result.hrefKey]: result.href,
+    [result.labelKey]: result.label,
+    [FOOTER_ORDER_KEY]: JSON.stringify(result.order)
+  };
+}
+function addFooterColumnWithPersist({
+  postToParent: postToParent2
+}) {
+  if (!canAddFooterColumn()) {
+    postToParent2({
+      type: "ow:toast",
+      title: `Maximum ${MAX_FOOTER_COLUMNS} columns`,
+      toastType: "error"
     });
+    return null;
   }
-  document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]').forEach((el) => {
-    if (placeholder) el.setAttribute("data-ohw-placeholder", "");
-    else el.removeAttribute("data-ohw-placeholder");
-  });
-  return display;
-}
-function applyLogoImage(url, alt) {
-  const displayAlt = resolveLogoDisplayText(alt);
-  document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]').forEach((root) => {
-    ensureLogoHrefKey(root);
-    const imageKey = imageKeyForRoot(root);
-    const textKey = textKeyForRoot(root);
-    let img = root.querySelector(`img[data-ohw-key="${imageKey}"]`) ?? (root.querySelector(`[data-ohw-key="${imageKey}"]`) instanceof HTMLImageElement ? root.querySelector(`[data-ohw-key="${imageKey}"]`) : null) ?? root.querySelector("img");
-    let textEl = root.querySelector(`[data-ohw-key="${textKey}"]`) ?? root.querySelector('[data-ohw-key="logo-text"]');
-    if (url) {
-      if (!img) {
-        img = document.createElement("img");
-        img.setAttribute("data-ohw-editable", "image");
-        img.setAttribute("data-ohw-key", imageKey);
-        img.alt = displayAlt;
-        img.style.height = "";
-        img.style.maxHeight = "none";
-        img.style.width = "auto";
-        img.style.display = "block";
-        img.style.objectFit = "contain";
-        root.insertBefore(img, root.firstChild);
-      } else {
-        img.setAttribute("data-ohw-editable", "image");
-        img.setAttribute("data-ohw-key", imageKey);
-      }
-      img.removeAttribute("srcset");
-      img.removeAttribute("sizes");
-      img.src = url;
-      img.alt = displayAlt;
-      img.style.display = "block";
-      if (textEl) textEl.style.display = "none";
-      root.removeAttribute("data-ohw-placeholder");
-      return;
-    }
-    if (img) {
-      img.removeAttribute("src");
-      img.removeAttribute("srcset");
-      img.removeAttribute("sizes");
-      img.alt = displayAlt;
-      img.style.display = "none";
-    }
-    if (!textEl) {
-      textEl = document.createElement("span");
-      textEl.setAttribute("data-ohw-editable", "plain");
-      textEl.setAttribute("data-ohw-key", textKey);
-      root.appendChild(textEl);
-    }
-    textEl.style.display = "";
-    if (textEl.textContent !== displayAlt) textEl.textContent = displayAlt;
-    if (!displayAlt.trim() || displayAlt === PLACEHOLDER_BUSINESS_NAME) {
-      root.setAttribute("data-ohw-placeholder", "");
-    } else {
-      root.removeAttribute("data-ohw-placeholder");
-    }
-  });
-}
-function applyLogoHref(href) {
-  const target = href.trim() || "/";
-  document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]').forEach((root) => {
-    ensureLogoHrefKey(root);
-    if (root instanceof HTMLAnchorElement) {
-      root.setAttribute("href", target);
-    }
-  });
-  for (const key of LOGO_HREF_KEYS) setStoredLinkHref(key, target);
-}
-function readLogoIdentityFromDom() {
-  let imageUrl = null;
-  for (const key of LOGO_IMAGE_KEYS) {
-    const el = document.querySelector(`[data-ohw-key="${key}"]`);
-    const img = el instanceof HTMLImageElement ? el : el?.querySelector("img");
-    const attrSrc = img?.getAttribute("src")?.trim() ?? "";
-    if (attrSrc && !attrSrc.startsWith("data:") && img && img.style.display !== "none") {
-      imageUrl = img.currentSrc || img.src;
-      break;
-    }
-  }
-  let text = PLACEHOLDER_BUSINESS_NAME;
-  let isPlaceholder = true;
-  for (const key of LOGO_TEXT_KEYS) {
-    const el = document.querySelector(`[data-ohw-key="${key}"]`);
-    if (el?.textContent?.trim()) {
-      text = el.textContent.trim();
-      const logoRoot2 = el.closest('[data-ohw-role="logo"], [data-ohw-logo]');
-      isPlaceholder = logoRoot2?.hasAttribute("data-ohw-placeholder") === true || text === PLACEHOLDER_BUSINESS_NAME;
-      break;
-    }
-  }
-  if (imageUrl) {
-    const logoImg = document.querySelector(
-      '[data-ohw-key="nav-logo-image"], [data-ohw-key="footer-logo"]'
-    );
-    const alt = logoImg?.alt?.trim() || text;
-    isPlaceholder = false;
-    const hrefEl = document.querySelector(
-      'a[data-ohw-role="logo"], a[data-ohw-logo], [data-ohw-role="logo"]'
-    );
-    const href2 = (hrefEl instanceof HTMLAnchorElement ? hrefEl.getAttribute("href") : null) || hrefEl?.closest("a")?.getAttribute("href") || "/";
-    return { text, isPlaceholder, imageUrl, href: href2, alt };
-  }
-  const logoRoot = document.querySelector('[data-ohw-role="logo"], [data-ohw-logo]');
-  const href = (logoRoot instanceof HTMLAnchorElement ? logoRoot.getAttribute("href") : null) || logoRoot?.closest("a")?.getAttribute("href") || "/";
-  return { text, isPlaceholder, imageUrl: null, href, alt: text };
-}
-function applyLogoFromContent(content) {
-  const hasLogoIdentity = LOGO_PLACEHOLDER_KEY in content || LOGO_TEXT_KEYS.some((key) => key in content) || LOGO_IMAGE_KEYS.some((key) => key in content) || LOGO_ALT_KEY in content || LOGO_HREF_KEYS.some((key) => key in content);
-  if (!hasLogoIdentity) return false;
-  const logoText = content[LOGO_TEXT_KEYS[0]] ?? content[LOGO_TEXT_KEYS[1]] ?? readLogoIdentityFromDom().text;
-  const logoAlt = content[LOGO_ALT_KEY] ?? logoText;
-  const rawLogoImage = content[LOGO_IMAGE_URL_KEY] ?? content["footer-logo"] ?? content["footer-logo-image"] ?? null;
-  const logoImageUrl = typeof rawLogoImage === "string" && rawLogoImage.trim() ? rawLogoImage.trim() : null;
-  const imageExplicitlyCleared = LOGO_IMAGE_KEYS.some((key) => key in content) && !logoImageUrl;
-  const logoIsPlaceholder = LOGO_PLACEHOLDER_KEY in content ? content[LOGO_PLACEHOLDER_KEY] !== "false" : !logoImageUrl && (!logoText.trim() || logoText === PLACEHOLDER_BUSINESS_NAME);
-  if (logoImageUrl) {
-    applyLogoImage(logoImageUrl, logoAlt);
-  } else {
-    if (imageExplicitlyCleared) applyLogoImage(null, logoAlt);
-    applyLogoIdentity(logoText, logoIsPlaceholder);
-  }
-  const logoHref = content["nav-logo-href"] ?? content["footer-logo-href"] ?? content["logo-href"];
-  if (typeof logoHref === "string" && logoHref.trim()) {
-    applyLogoHref(logoHref);
-  }
-  return true;
-}
-
-// src/lib/logo-size.ts
-var LOGO_SIZE_DEFAULTS = {
-  navbar: 28,
-  footer: 32
-};
-var LOGO_SIZE_MIN = 16;
-var LOGO_SIZE_MAX = 80;
-var LOGO_SIZE_DESKTOP_KEYS = {
-  navbar: "nav-logo-size",
-  footer: "footer-logo-size"
-};
-var LOGO_SIZE_MOBILE_KEYS = {
-  navbar: "nav-logo-size-mobile",
-  footer: "footer-logo-size-mobile"
-};
-var LOGO_SIZE_KEYS = [
-  LOGO_SIZE_DESKTOP_KEYS.navbar,
-  LOGO_SIZE_DESKTOP_KEYS.footer,
-  LOGO_SIZE_MOBILE_KEYS.navbar,
-  LOGO_SIZE_MOBILE_KEYS.footer
-];
-function isFooterLogoRoot2(root) {
-  return Boolean(root.closest("footer") || root.closest('[data-ohw-section="footer"]'));
-}
-function getLogoPlacement(root) {
-  return isFooterLogoRoot2(root) ? "footer" : "navbar";
-}
-function parseLogoSizePx(raw, fallback) {
-  if (raw == null || raw === "") return fallback;
-  const n = Number.parseFloat(raw);
-  if (!Number.isFinite(n)) return fallback;
-  return Math.min(LOGO_SIZE_MAX, Math.max(LOGO_SIZE_MIN, Math.round(n)));
-}
-function isMobileLogoSizeFollowing(content, placement) {
-  const raw = content[LOGO_SIZE_MOBILE_KEYS[placement]];
-  return raw == null || raw.trim() === "";
-}
-function resolveDesktopLogoSize(content, placement) {
-  return parseLogoSizePx(content[LOGO_SIZE_DESKTOP_KEYS[placement]], LOGO_SIZE_DEFAULTS[placement]);
-}
-function resolveMobileLogoSize(content, placement) {
-  if (isMobileLogoSizeFollowing(content, placement)) {
-    return resolveDesktopLogoSize(content, placement);
-  }
-  return parseLogoSizePx(
-    content[LOGO_SIZE_MOBILE_KEYS[placement]],
-    resolveDesktopLogoSize(content, placement)
-  );
-}
-function setRootSizeVars(root, desktopPx, mobilePx, following) {
-  root.style.setProperty("--ohw-logo-size", `${desktopPx}px`);
-  if (following) {
-    root.style.removeProperty("--ohw-logo-size-mobile");
-  } else {
-    root.style.setProperty("--ohw-logo-size-mobile", `${mobilePx}px`);
-  }
-  root.querySelectorAll("img").forEach((img) => {
-    img.style.height = "";
-    img.style.maxHeight = "none";
-    img.style.width = "auto";
-    img.style.objectFit = "contain";
-  });
-}
-function applyLogoSizes(content) {
-  document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]').forEach((root) => {
-    const placement = getLogoPlacement(root);
-    const desktop = resolveDesktopLogoSize(content, placement);
-    const following = isMobileLogoSizeFollowing(content, placement);
-    const mobile = following ? desktop : resolveMobileLogoSize(content, placement);
-    setRootSizeVars(root, desktop, mobile, following);
-  });
-}
-function applyLogoSizeToPlacement(placement, desktopPx, mobilePx, following) {
-  document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]').forEach((root) => {
-    if (getLogoPlacement(root) !== placement) return;
-    setRootSizeVars(root, desktopPx, mobilePx, following);
+  const result = insertFooterColumn();
+  const patch = buildFooterColumnEditContentPatch(result);
+  setStoredLinkHref(result.hrefKey, result.href);
+  postToParent2({
+    type: "ow:change",
+    nodes: Object.entries(patch).map(([key, text]) => ({ key, text }))
   });
-}
-function logoHasUploadedImage(logoEl) {
-  if (logoEl.hasAttribute("data-ohw-placeholder")) return false;
-  const img = logoEl.querySelector('img[data-ohw-key="nav-logo-image"], img[data-ohw-key="footer-logo"], img[data-ohw-key="footer-logo-image"]') ?? logoEl.querySelector("img");
-  if (!img) return false;
-  const src = img.getAttribute("src")?.trim() ?? "";
-  if (!src || src.startsWith("data:")) return false;
-  if (img.style.display === "none") return false;
-  return true;
-}
-function getLogoInteractionRect(logoEl) {
-  if (logoHasUploadedImage(logoEl)) {
-    const img = logoEl.querySelector('img[data-ohw-key="nav-logo-image"], img[data-ohw-key="footer-logo"], img[data-ohw-key="footer-logo-image"]') ?? logoEl.querySelector("img");
-    if (img) {
-      const r2 = img.getBoundingClientRect();
-      if (r2.width > 0 && r2.height > 0) return r2;
-    }
-  }
-  const text = logoEl.querySelector(
-    '[data-ohw-key="nav-logo-text"], [data-ohw-key="footer-logo-text"]'
-  );
-  if (text) {
-    const style = window.getComputedStyle(text);
-    if (style.display !== "none" && style.visibility !== "hidden") {
-      const r2 = text.getBoundingClientRect();
-      if (r2.width > 0 && r2.height > 0) return r2;
-    }
-  }
-  return logoEl.getBoundingClientRect();
-}
-function readLogoSizeState(content, placement) {
-  const desktopPx = resolveDesktopLogoSize(content, placement);
-  const mobileFollowing = isMobileLogoSizeFollowing(content, placement);
-  const mobilePx = mobileFollowing ? desktopPx : resolveMobileLogoSize(content, placement);
-  return { desktopPx, mobilePx, mobileFollowing };
+  postToParent2({ type: "ow:toast", title: "Item added", toastType: "success" });
+  enforceLinkHrefs();
+  return result;
 }
 
 // src/lib/site-wide-scope.ts
 function getLogoElement(el) {
   const marked = el.closest('[data-ohw-role="logo"], [data-ohw-logo]');
   if (marked) return marked;
-  if (el.closest('[data-ohw-editable="icon"]')) return null;
   const root = el.closest("nav, [data-ohw-nav-root], footer");
   if (!root) return null;
   const anchor = el.closest("a");
@@ -11576,38 +11535,6 @@ function isSiteWideScopeActive(args) {
   return isSiteWideElement(args.selected) || isSiteWideElement(args.hoveredItem) || isSiteWideElement(args.hoveredNavContainer) || isSiteWideElement(args.active);
 }
 
-// src/lib/add-footer-column.ts
-function buildFooterColumnEditContentPatch(result) {
-  return {
-    [result.headingKey]: result.heading,
-    [result.hrefKey]: result.href,
-    [result.labelKey]: result.label,
-    [FOOTER_ORDER_KEY]: JSON.stringify(result.order)
-  };
-}
-function addFooterColumnWithPersist({
-  postToParent: postToParent2
-}) {
-  if (!canAddFooterColumn()) {
-    postToParent2({
-      type: "ow:toast",
-      title: `Maximum ${MAX_FOOTER_COLUMNS} columns`,
-      toastType: "error"
-    });
-    return null;
-  }
-  const result = insertFooterColumn();
-  const patch = buildFooterColumnEditContentPatch(result);
-  setStoredLinkHref(result.hrefKey, result.href);
-  postToParent2({
-    type: "ow:change",
-    nodes: Object.entries(patch).map(([key, text]) => ({ key, text }))
-  });
-  postToParent2({ type: "ow:toast", title: "Item added", toastType: "success" });
-  enforceLinkHrefs();
-  return result;
-}
-
 // src/ui/FloatingPanel.tsx
 import {
   useCallback as useCallback5,
@@ -11617,7 +11544,7 @@ import {
   useState as useState8
 } from "react";
 import { X as X5 } from "lucide-react";
-import { jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs17 } from "react/jsx-runtime";
 var PANEL_WIDTH = 256;
 var EDGE_MARGIN = 16;
 function getVisibleClip(parentScroll) {
@@ -11732,7 +11659,7 @@ function FloatingPanel({
   }, [open]);
   useEffect9(() => () => document.documentElement.removeAttribute("data-ohw-panel-dragging"), []);
   if (!open) return null;
-  return /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsxs17(
     "div",
     {
       ref: panelRef,
@@ -11749,7 +11676,7 @@ function FloatingPanel({
       onPointerDown: (e) => e.stopPropagation(),
       onClick: (e) => e.stopPropagation(),
       children: [
-        /* @__PURE__ */ jsxs16(
+        /* @__PURE__ */ jsxs17(
           "div",
           {
             "data-ohw-floating-panel-header": "",
@@ -11759,14 +11686,14 @@ function FloatingPanel({
             onPointerUp: endDrag,
             onPointerCancel: endDrag,
             children: [
-              /* @__PURE__ */ jsxs16("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5", children: [
-                /* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-2", children: [
-                  icon ? /* @__PURE__ */ jsx26("span", { className: "shrink-0 text-foreground", children: icon }) : null,
-                  /* @__PURE__ */ jsx26("p", { className: "min-w-0 flex-1 text-lg font-semibold leading-7 text-foreground", children: title })
+              /* @__PURE__ */ jsxs17("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5", children: [
+                /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
+                  icon ? /* @__PURE__ */ jsx27("span", { className: "shrink-0 text-foreground", children: icon }) : null,
+                  /* @__PURE__ */ jsx27("p", { className: "min-w-0 flex-1 text-lg font-semibold leading-7 text-foreground", children: title })
                 ] }),
-                context ? /* @__PURE__ */ jsx26("p", { className: "w-full text-sm leading-5 text-muted-foreground", children: context }) : null
+                context ? /* @__PURE__ */ jsx27("p", { className: "w-full text-sm leading-5 text-muted-foreground", children: context }) : null
               ] }),
-              /* @__PURE__ */ jsx26(
+              /* @__PURE__ */ jsx27(
                 "button",
                 {
                   type: "button",
@@ -11778,13 +11705,13 @@ function FloatingPanel({
                     onClose();
                   },
                   onPointerDown: (e) => e.stopPropagation(),
-                  children: /* @__PURE__ */ jsx26(X5, { size: 16, "aria-hidden": true })
+                  children: /* @__PURE__ */ jsx27(X5, { size: 16, "aria-hidden": true })
                 }
               )
             ]
           }
         ),
-        /* @__PURE__ */ jsx26(
+        /* @__PURE__ */ jsx27(
           "div",
           {
             "data-ohw-floating-panel-body": "",
@@ -11797,117 +11724,6 @@ function FloatingPanel({
   );
 }
 
-// src/ui/logo-size-panel.tsx
-import { ArrowUpRight, Link as Link2 } from "lucide-react";
-import { jsx as jsx27, jsxs as jsxs17 } from "react/jsx-runtime";
-function SizeSlider({
-  value,
-  onChange
-}) {
-  const pct = (value - LOGO_SIZE_MIN) / (LOGO_SIZE_MAX - LOGO_SIZE_MIN) * 100;
-  return /* @__PURE__ */ jsxs17("div", { className: "flex w-full flex-col gap-3", children: [
-    /* @__PURE__ */ jsxs17("div", { className: "flex w-full items-center gap-2 text-sm font-medium leading-5", children: [
-      /* @__PURE__ */ jsx27("span", { className: "min-w-0 flex-1 text-foreground", children: "Size" }),
-      /* @__PURE__ */ jsxs17("span", { className: "shrink-0 whitespace-nowrap text-muted-foreground", children: [
-        value,
-        " px"
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxs17("div", { className: "relative h-2 w-full rounded-full bg-primary-50", children: [
-      /* @__PURE__ */ jsx27(
-        "div",
-        {
-          className: "absolute inset-y-0 left-0 rounded-full bg-primary",
-          style: { width: `${pct}%` }
-        }
-      ),
-      /* @__PURE__ */ jsx27(
-        "input",
-        {
-          type: "range",
-          min: LOGO_SIZE_MIN,
-          max: LOGO_SIZE_MAX,
-          step: 1,
-          value,
-          "aria-label": "Logo size",
-          className: cn(
-            "absolute inset-0 h-full w-full cursor-pointer appearance-none bg-transparent",
-            "[&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:size-5",
-            "[&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-2",
-            "[&::-webkit-slider-thumb]:border-primary [&::-webkit-slider-thumb]:bg-background",
-            "[&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full",
-            "[&::-moz-range-thumb]:border-2 [&::-moz-range-thumb]:border-primary",
-            "[&::-moz-range-thumb]:bg-background"
-          ),
-          onChange: (e) => onChange(Number(e.target.value))
-        }
-      )
-    ] })
-  ] });
-}
-function LogoSizePanel({
-  viewport,
-  sizePx,
-  mobileFollowing = true,
-  onSizeChange,
-  onCustomizeMobile,
-  onResetMobile,
-  onUpdateEverywhere,
-  className
-}) {
-  const showFollowing = viewport === "mobile" && mobileFollowing;
-  const showMobileSlider = viewport === "mobile" && !mobileFollowing;
-  const showDesktopSlider = viewport === "desktop";
-  return /* @__PURE__ */ jsxs17("div", { className: cn("flex w-full flex-col gap-4", className), children: [
-    showFollowing ? /* @__PURE__ */ jsxs17("div", { className: "flex w-full flex-col gap-2", children: [
-      /* @__PURE__ */ jsxs17("div", { className: "flex items-start gap-1", children: [
-        /* @__PURE__ */ jsx27(Link2, { size: 16, className: "mt-0.5 shrink-0 text-foreground", "aria-hidden": true }),
-        /* @__PURE__ */ jsx27("p", { className: "text-sm font-semibold leading-5 text-foreground", children: "Following desktop size" })
-      ] }),
-      /* @__PURE__ */ jsx27("p", { className: "text-sm leading-5 text-muted-foreground", children: "Mobile uses the desktop size until you customize it. Change the desktop size and it follows automatically." }),
-      /* @__PURE__ */ jsx27(
-        Button,
-        {
-          type: "button",
-          variant: "outline",
-          size: "sm",
-          className: "h-9 w-full min-w-0 cursor-pointer",
-          onClick: onCustomizeMobile,
-          children: "Customize for mobile"
-        }
-      )
-    ] }) : null,
-    showDesktopSlider || showMobileSlider ? /* @__PURE__ */ jsx27(SizeSlider, { value: sizePx, onChange: onSizeChange }) : null,
-    showMobileSlider ? /* @__PURE__ */ jsx27(
-      Button,
-      {
-        type: "button",
-        variant: "outline",
-        size: "sm",
-        className: "h-9 w-full min-w-0 cursor-pointer",
-        onClick: onResetMobile,
-        children: "Reset to desktop size"
-      }
-    ) : null,
-    /* @__PURE__ */ jsx27("div", { className: "h-px w-full bg-border", role: "separator" }),
-    /* @__PURE__ */ jsxs17(
-      Button,
-      {
-        type: "button",
-        variant: "outline",
-        size: "sm",
-        className: "h-9 w-full min-w-0 cursor-pointer gap-1",
-        onClick: onUpdateEverywhere,
-        children: [
-          "Update logo everywhere",
-          /* @__PURE__ */ jsx27(ArrowUpRight, { size: 16, "aria-hidden": true })
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsx27("p", { className: "text-sm leading-5 text-muted-foreground", children: "Matches the right version to your background." })
-  ] });
-}
-
 // src/ui/socials-display-panel.tsx
 import { jsx as jsx28, jsxs as jsxs18 } from "react/jsx-runtime";
 function DisplaySwitch({
@@ -12676,8 +12492,10 @@ function getLinkHref3(el) {
 }
 function collectEditableNodes(extraContent, root = document) {
   const isScoped = root !== document;
-  const editableEls = Array.from(root.querySelectorAll("[data-ohw-editable]"));
-  if (isScoped && root instanceof HTMLElement && root.matches("[data-ohw-editable]")) {
+  const editableEls = Array.from(
+    root.querySelectorAll('[data-ohw-editable]:not([data-ohw-editable="form"])')
+  );
+  if (isScoped && root instanceof HTMLElement && root.matches('[data-ohw-editable]:not([data-ohw-editable="form"])')) {
     editableEls.unshift(root);
   }
   const nodes = editableEls.map((el) => {
@@ -12752,18 +12570,6 @@ function collectEditableNodes(extraContent, root = document) {
   }
   if (extraContent && !isScoped) {
     applyNavFooterDeleteOverrides(byKey, extraContent);
-    for (const key of LOGO_IMAGE_KEYS) {
-      if (!(key in extraContent)) continue;
-      byKey.set(key, { key, type: "image", text: extraContent[key] ?? "" });
-    }
-    for (const key of [LOGO_PLACEHOLDER_KEY, LOGO_ALT_KEY]) {
-      if (!(key in extraContent)) continue;
-      byKey.set(key, { key, type: "meta", text: extraContent[key] ?? "" });
-    }
-    for (const key of LOGO_SIZE_KEYS) {
-      if (!(key in extraContent)) continue;
-      byKey.set(key, { key, type: "meta", text: extraContent[key] ?? "" });
-    }
   }
   return Array.from(byKey.values());
 }
@@ -13137,7 +12943,7 @@ function Badge({ className, variant, ...props }) {
 }
 
 // src/OhhwellsBridge.tsx
-import { Link as Link3 } from "lucide-react";
+import { Link as Link2, Plus as Plus4, Settings } from "lucide-react";
 import { Fragment as Fragment8, jsx as jsx33, jsxs as jsxs20 } from "react/jsx-runtime";
 var PRIMARY3 = "#0885FE";
 var IMAGE_FADE_MS = 300;
@@ -13232,10 +13038,21 @@ function parseSchedulingInsertAfter(insertAfter) {
     insertBefore: insertAfter.slice(idx + INSERT_BEFORE_MARKER.length)
   };
 }
-function resolveEntryAnchor(entry) {
-  if (entry.anchorId !== void 0) return { anchorId: entry.anchorId, beforeId: entry.beforeId ?? null };
-  const parsed = parseSchedulingInsertAfter(entry.insertAfter);
-  return { anchorId: parsed.anchor, beforeId: parsed.insertBefore };
+function resolveSchedulingInsert(insertAfter, explicitInsertBefore) {
+  const parsed = parseSchedulingInsertAfter(insertAfter);
+  const insertBefore = explicitInsertBefore ?? parsed.insertBefore;
+  const effectiveInsertAfter = insertBefore && parsed.insertBefore === null ? `${insertAfter}${INSERT_BEFORE_MARKER}${insertBefore}` : insertAfter;
+  return { effectiveInsertAfter, insertBefore };
+}
+function getSchedulingMountPoint(insertAfter) {
+  const { anchor } = parseSchedulingInsertAfter(insertAfter);
+  let anchorEl = document.querySelector(`[data-ohw-section="${anchor}"]`);
+  if (!anchorEl && anchor === "scheduling") {
+    const widgets = Array.from(document.querySelectorAll('[data-ohw-section^="scheduling-"]'));
+    anchorEl = widgets.at(-1) ?? null;
+  }
+  if (!anchorEl) return null;
+  return anchorEl.closest('[data-ohw-section-container="scheduling"]') ?? anchorEl;
 }
 function schedulingMountDepth(insertAfter) {
   if (!insertAfter.includes(INSERT_BEFORE_MARKER)) return 0;
@@ -13252,7 +13069,8 @@ function getPageSchedulingEntries(raw) {
   }
 }
 function isSchedulingWidgetMissing(entry) {
-  return !document.querySelector(`[data-ohw-section="${schedulingSectionId(entry.insertAfter)}"]`);
+  const { effectiveInsertAfter } = resolveSchedulingInsert(entry.insertAfter);
+  return !document.querySelector(`[data-ohw-section="${schedulingSectionId(effectiveInsertAfter)}"]`);
 }
 function hasMissingSchedulingWidgets(entries) {
   return entries.some(isSchedulingWidgetMissing);
@@ -13282,17 +13100,16 @@ function initSectionsFromContent(content, removeExisting = false) {
   } catch {
   }
 }
-function mountSchedulingWidget(anchorId, notifyOnConnect = false, scheduleId, beforeId, existingWidgetId) {
-  const widgetId = existingWidgetId ?? (beforeId ? `${anchorId}${INSERT_BEFORE_MARKER}${beforeId}` : anchorId);
-  const sectionId = schedulingSectionId(widgetId);
+function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId, explicitInsertBefore) {
+  const { effectiveInsertAfter, insertBefore } = resolveSchedulingInsert(insertAfter, explicitInsertBefore);
+  const sectionId = schedulingSectionId(effectiveInsertAfter);
   if (document.querySelector(`[data-ohw-section="${sectionId}"]`)) return false;
-  const anchorEl = document.querySelector(`[data-ohw-section="${anchorId}"]`);
-  if (!anchorEl) return false;
-  const mountPoint = anchorEl.closest('[data-ohw-section-container="scheduling"]') ?? anchorEl;
+  const mountPoint = getSchedulingMountPoint(effectiveInsertAfter);
+  if (!mountPoint) return false;
   const container = document.createElement("div");
   container.dataset.ohwSectionContainer = "scheduling";
-  if (beforeId) {
-    const beforeAnchor = document.querySelector(`[data-ohw-section="${beforeId}"]`);
+  if (insertBefore) {
+    const beforeAnchor = document.querySelector(`[data-ohw-section="${insertBefore}"]`);
     const beforePoint = beforeAnchor?.closest('[data-ohw-section-container="scheduling"]') ?? beforeAnchor;
     if (!beforePoint) return false;
     beforePoint.insertAdjacentElement("beforebegin", container);
@@ -13303,25 +13120,19 @@ function mountSchedulingWidget(anchorId, notifyOnConnect = false, scheduleId, be
     }
     tail.insertAdjacentElement("afterend", container);
   }
-  try {
-    const root = createRoot2(container);
-    flushSync2(() => {
-      root.render(
-        /* @__PURE__ */ jsx33(
-          SchedulingWidget,
-          {
-            notifyOnConnect,
-            initialScheduleId: scheduleId,
-            insertAfter: widgetId
-          }
-        )
-      );
-    });
-  } catch (err) {
-    console.error("[ow:scheduling] render threw", err);
-    container.remove();
-    return false;
-  }
+  const root = createRoot2(container);
+  flushSync2(() => {
+    root.render(
+      /* @__PURE__ */ jsx33(
+        SchedulingWidget,
+        {
+          notifyOnConnect,
+          initialScheduleId: scheduleId,
+          insertAfter: effectiveInsertAfter
+        }
+      )
+    );
+  });
   const tracker = getSectionsTracker();
   let sections = [];
   try {
@@ -13329,12 +13140,10 @@ function mountSchedulingWidget(anchorId, notifyOnConnect = false, scheduleId, be
   } catch {
   }
   const inEditor = typeof window !== "undefined" && window.self !== window.top;
-  if (inEditor && !sections.find((s) => s.type === "scheduling" && s.insertAfter === widgetId)) {
+  if (inEditor && !sections.find((s) => s.type === "scheduling" && s.insertAfter === effectiveInsertAfter)) {
     sections.push({
       type: "scheduling",
-      insertAfter: widgetId,
-      anchorId,
-      beforeId: beforeId ?? null,
+      insertAfter: effectiveInsertAfter,
       pagePath: window.location.pathname,
       ...scheduleId ? { scheduleId } : {}
     });
@@ -13348,8 +13157,7 @@ function mountSchedulingEntries(entries, notifyOnConnect = false) {
     for (let i = pending.length - 1; i >= 0; i--) {
       const entry = pending[i];
       const shouldNotify = typeof notifyOnConnect === "function" ? notifyOnConnect(entry) : notifyOnConnect;
-      const { anchorId, beforeId } = resolveEntryAnchor(entry);
-      if (mountSchedulingWidget(anchorId, shouldNotify, entry.scheduleId ?? null, beforeId, entry.insertAfter)) {
+      if (mountSchedulingWidget(entry.insertAfter, shouldNotify, entry.scheduleId)) {
         pending.splice(i, 1);
       }
     }
@@ -13422,7 +13230,11 @@ function isIconEditable(el) {
   return el.dataset.ohwEditable === "icon";
 }
 var MEDIA_SELECTOR = '[data-ohw-editable="image"], [data-ohw-editable="bg-image"], [data-ohw-editable="video"]';
-var NON_MEDIA_SELECTOR = '[data-ohw-editable]:not([data-ohw-editable="image"]):not([data-ohw-editable="bg-image"]):not([data-ohw-editable="video"]):not([data-ohw-editable="icon"])';
+var EDITOR_CHROME_SELECTOR = '[data-ohw-toolbar], [data-ohw-form-toolbar], [data-ohw-field-toolbar], [data-ohw-item-toolbar], [data-ohw-more-menu], [data-ohw-state-toggle], [data-ohw-max-badge], [data-slot="dropdown-menu-content"], [data-slot="dropdown-menu-item"]';
+function isOverEditorChrome(x, y) {
+  return document.elementsFromPoint(x, y).some((el) => el instanceof HTMLElement && el.matches(EDITOR_CHROME_SELECTOR));
+}
+var NON_MEDIA_SELECTOR = '[data-ohw-editable]:not([data-ohw-editable="image"]):not([data-ohw-editable="bg-image"]):not([data-ohw-editable="video"]):not([data-ohw-editable="icon"]):not([data-ohw-editable="form"])';
 function getVideoEl2(el) {
   return el instanceof HTMLVideoElement ? el : el.querySelector("video");
 }
@@ -13493,13 +13305,6 @@ function isInsideLinkEditor(target) {
     target.closest("[data-ohw-link-popover-root]") || target.closest("[data-ohw-link-modal-root]") || target.closest("[data-ohw-link-page-dropdown]") || target.closest("[data-ohw-section-picker]") || target.closest("[data-ohw-navbar-container-chrome]") || target.closest("[data-ohw-navbar-add-button]") || target.closest("[data-ohw-footer-container-chrome]") || target.closest("[data-ohw-footer-add-button]") || target.closest("[data-ohw-more-menu]") || target.closest('[data-slot="dropdown-menu-content"]') || target.closest('[data-slot="popover-content"]') || target.closest('[data-slot="dialog-content"]') || target.closest('[data-slot="dialog-overlay"]')
   );
 }
-function isInsideFloatingPanel(target) {
-  return Boolean(target.closest("[data-ohw-floating-panel]"));
-}
-function isPointOverFloatingPanel(clientX, clientY) {
-  const el = document.elementFromPoint(clientX, clientY);
-  return Boolean(el instanceof Element && el.closest("[data-ohw-floating-panel]"));
-}
 function getHrefKeyFromElement(el) {
   if (!el) return null;
   const anchor = el.closest("[data-ohw-href-key]");
@@ -13547,7 +13352,8 @@ function isNavItemPointerTarget(el) {
 function getNavigationItemAnchor(el) {
   const anchor = el.matches("[data-ohw-href-key]") ? el : el.closest("[data-ohw-href-key]");
   if (!anchor) return null;
-  if (!anchor.querySelector('[data-ohw-editable="text"]') && !getSocialItem(anchor)) return null;
+  if (!anchor.matches('[data-ohw-editable="text"], [data-ohw-editable="plain"]') && !anchor.querySelector('[data-ohw-editable="text"], [data-ohw-editable="plain"]') && !getSocialItem(anchor))
+    return null;
   if (!isNavItemPointerTarget(anchor)) return null;
   return anchor;
 }
@@ -13737,7 +13543,7 @@ function getNavigationSelectionParent(el) {
   if (!isFooterLinksContainer(el) && (el.hasAttribute("data-ohw-footer-col") || el.hasAttribute("data-ohw-footer-column") || isInferredFooterGroup2(el))) {
     return getFooterLinksContainer();
   }
-  if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-nav-drawer") || el.hasAttribute("data-ohw-footer-col") || el.hasAttribute("data-ohw-footer-column") || isFooterLinksContainer(el) || isInferredFooterGroup2(el)) {
+  if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-nav-drawer") || isFooterLinksContainer(el)) {
     return getNavigationRoot(el);
   }
   return null;
@@ -14294,7 +14100,7 @@ function FloatingToolbar({
               e.preventDefault();
               e.stopPropagation();
             },
-            children: /* @__PURE__ */ jsx33(Link3, { className: "size-4 shrink-0", "aria-hidden": true })
+            children: /* @__PURE__ */ jsx33(Link2, { className: "size-4 shrink-0", "aria-hidden": true })
           }
         ) : null
       ] })
@@ -14330,7 +14136,6 @@ function StateToggle({
   );
 }
 var contentCache = /* @__PURE__ */ new Map();
-var fetchedContentPaths = /* @__PURE__ */ new Set();
 function resolveSubdomain(subdomainFromQuery) {
   if (subdomainFromQuery) return subdomainFromQuery;
   if (typeof window !== "undefined") {
@@ -14425,14 +14230,8 @@ function OhhwellsBridge() {
   });
   const selectFrameRef = useRef9(() => {
   });
-  const selectLogoRef = useRef9(() => {
-  });
-  const openLogoSizePanelRef = useRef9(() => {
-  });
   const deselectRef = useRef9(() => {
   });
-  const closeFloatingPanelOnlyRef = useRef9(() => {
-  });
   const reselectNavigationItemRef = useRef9(() => {
   });
   const commitNavigationTextEditRef = useRef9(() => {
@@ -14448,6 +14247,182 @@ function OhhwellsBridge() {
   const sectionsLoadedRef = useRef9(false);
   const pendingScheduleConfigRequests = useRef9([]);
   const [toolbarRect, setToolbarRect] = useState11(null);
+  const [formPickRect, setFormPickRect] = useState11(null);
+  const formPickElRef = useRef9(null);
+  const [formViewState, setFormViewStateUi] = useState11("default");
+  const [formPickCount, setFormPickCount] = useState11(null);
+  const [formHoverRect, setFormHoverRect] = useState11(null);
+  const formHoverElRef = useRef9(null);
+  const [fieldPickRect, setFieldPickRect] = useState11(null);
+  const fieldPickElRef = useRef9(null);
+  const [fieldPickState, setFieldPickState] = useState11(null);
+  const [fieldTypePickerOpen, setFieldTypePickerOpen] = useState11(false);
+  const clearFormPick = useCallback7(() => {
+    const form = formPickElRef.current;
+    const editing = fieldPickElRef.current;
+    if (commitPlaceholderEdit(editing) && editing) {
+      const owner = editing.closest('[data-ohw-editable="form"]');
+      if (owner) persistFieldsRef.current(owner);
+    }
+    if (form) {
+      const key = formKeyOf(form);
+      if (key) setFormViewState(form, key, "default", successInitialFor(form, key, editContentRef.current));
+    }
+    setFormViewStateUi("default");
+    setFormPickCount(null);
+    setFieldTypePickerOpen(false);
+    fieldPickElRef.current = null;
+    setFieldPickRect(null);
+    setFieldPickState(null);
+    formPickElRef.current = null;
+    setFormPickRect(null);
+  }, []);
+  const clearFieldPick = useCallback7(() => {
+    const wrapper = fieldPickElRef.current;
+    if (commitPlaceholderEdit(wrapper) && wrapper) {
+      const form = wrapper.closest('[data-ohw-editable="form"]');
+      if (form) persistFieldsRef.current(form);
+    }
+    fieldPickElRef.current = null;
+    setFieldPickRect(null);
+    setFieldPickState(null);
+  }, []);
+  const persistFieldsRef = useRef9(() => {
+  });
+  const persistFields = useCallback7(
+    (form) => {
+      const key = formKeyOf(form);
+      if (!key) return;
+      const json = JSON.stringify(readFieldsFromDom(form));
+      editContentRef.current = { ...editContentRef.current, [fieldsKey(key)]: json };
+      postToParentRef.current({ type: "ow:change", nodes: [{ key: fieldsKey(key), text: json }] });
+    },
+    []
+  );
+  persistFieldsRef.current = persistFields;
+  const selectField = useCallback7((wrapper) => {
+    if (fieldPickElRef.current && fieldPickElRef.current !== wrapper) {
+      commitPlaceholderEdit(fieldPickElRef.current);
+    }
+    syncRequiredMark(wrapper);
+    beginPlaceholderEdit(wrapper);
+    formHoverElRef.current = null;
+    setFormHoverRect(null);
+    fieldPickElRef.current = wrapper;
+    setFieldPickRect(wrapper.getBoundingClientRect());
+    setFieldPickState({ type: fieldTypeOf(wrapper), required: isFieldRequired(wrapper) });
+    setFieldTypePickerOpen(false);
+  }, []);
+  const withSelectedField = useCallback7(
+    (run) => {
+      const wrapper = fieldPickElRef.current;
+      const form = formPickElRef.current;
+      if (!wrapper || !form) return;
+      commitPlaceholderEdit(wrapper);
+      run(form, wrapper);
+      persistFields(form);
+      beginPlaceholderEdit(wrapper);
+      setFormPickRect(form.getBoundingClientRect());
+    },
+    [persistFields]
+  );
+  const handleFieldTypeChange = useCallback7(
+    (type) => withSelectedField((_form, wrapper) => {
+      applyFieldType(wrapper, type);
+      selectField(wrapper);
+    }),
+    [selectField, withSelectedField]
+  );
+  const handleFieldRequiredToggle = useCallback7(
+    () => withSelectedField((_form, wrapper) => {
+      setFieldRequired(wrapper, !isFieldRequired(wrapper));
+      selectField(wrapper);
+    }),
+    [selectField, withSelectedField]
+  );
+  const handleFieldDuplicate = useCallback7(
+    () => withSelectedField((form, wrapper) => {
+      const copy = duplicateField(form, wrapper);
+      selectField(copy);
+    }),
+    [selectField, withSelectedField]
+  );
+  const handleFieldDelete = useCallback7(
+    () => withSelectedField((_form, wrapper) => {
+      removeField(wrapper);
+      clearFieldPick();
+      postToParentRef.current({ type: "ow:toast", title: "Form field deleted" });
+    }),
+    [clearFieldPick, withSelectedField]
+  );
+  const handleAddField = useCallback7(
+    (type) => {
+      const form = formPickElRef.current;
+      if (!form) return;
+      const wrapper = insertField(form, type);
+      setFieldTypePickerOpen(false);
+      if (!wrapper) return;
+      persistFields(form);
+      setFormPickRect(null);
+      requestAnimationFrame(() => {
+        selectField(wrapper);
+        wrapper.scrollIntoView({ block: "nearest", behavior: "smooth" });
+      });
+    },
+    [persistFields, selectField]
+  );
+  const fieldDragRef = useRef9(null);
+  const buildFieldDropSlots = useCallback7((form, draggedKey) => {
+    const others = listFieldWrappers(form).filter((el) => fieldKeyOf(el) !== draggedKey);
+    const slots = others.map((el) => {
+      const rect = el.getBoundingClientRect();
+      return { top: rect.top, left: rect.left, width: rect.width };
+    });
+    const last = others[others.length - 1];
+    if (last) {
+      const rect = last.getBoundingClientRect();
+      slots.push({ top: rect.bottom, left: rect.left, width: rect.width });
+    }
+    return slots;
+  }, []);
+  const handleFieldDragStart = useCallback7(() => {
+    const wrapper = fieldPickElRef.current;
+    const form = formPickElRef.current;
+    if (!wrapper || !form) return;
+    const key = fieldKeyOf(wrapper);
+    fieldDragRef.current = { key, form };
+    setFieldDragging(true);
+    setFieldDropSlots(buildFieldDropSlots(form, key));
+  }, [buildFieldDropSlots]);
+  const handleFieldDragEnd = useCallback7(() => {
+    fieldDragRef.current = null;
+    setFieldDropIndex(null);
+    setFieldDropSlots([]);
+    setFieldDragging(false);
+  }, []);
+  const [fieldDropIndex, setFieldDropIndex] = useState11(null);
+  const [fieldDropSlots, setFieldDropSlots] = useState11([]);
+  const [fieldDragging, setFieldDragging] = useState11(false);
+  const clearFormPickRef = useRef9(clearFormPick);
+  clearFormPickRef.current = clearFormPick;
+  useEffect12(() => {
+    const el = fieldPickElRef.current;
+    if (!el || fieldPickRect === null) return;
+    const observer = new ResizeObserver(() => {
+      if (fieldPickElRef.current === el) setFieldPickRect(el.getBoundingClientRect());
+    });
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, [fieldPickRect !== null, fieldPickState]);
+  useEffect12(() => {
+    const el = formPickElRef.current;
+    if (!el || formPickRect === null) return;
+    const observer = new ResizeObserver(() => {
+      if (formPickElRef.current === el) setFormPickRect(el.getBoundingClientRect());
+    });
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, [formPickRect !== null, formViewState]);
   const [toolbarVariant, setToolbarVariant] = useState11("none");
   const toolbarVariantRef = useRef9("none");
   toolbarVariantRef.current = toolbarVariant;
@@ -14469,7 +14444,7 @@ function OhhwellsBridge() {
   useEffect12(() => {
     const sync = () => {
       const el = document.querySelector(
-        "[data-ohw-hovered]:not([contenteditable]):not([data-ohw-href-key])"
+        '[data-ohw-hovered]:not([contenteditable]):not([data-ohw-href-key]):not([data-ohw-editable="form"] *)'
       );
       const target = el && !el.closest("[data-ohw-href-key]") ? el : null;
       if (!target) {
@@ -14493,6 +14468,11 @@ function OhhwellsBridge() {
   const [isItemDragging, setIsItemDragging] = useState11(false);
   const [isFooterFrameSelection, setIsFooterFrameSelection] = useState11(false);
   isFooterFrameSelectionRef.current = isFooterFrameSelection;
+  const [floatingPanel, setFloatingPanel] = useState11(null);
+  const floatingPanelOpenRef = useRef9(false);
+  floatingPanelOpenRef.current = floatingPanel !== null;
+  const [floatingPanelPos, setFloatingPanelPos] = useState11(null);
+  const [parentScrollSnap, setParentScrollSnap] = useState11(null);
   const [navDropdownPreviewOpen, setNavDropdownPreviewOpen] = useState11(null);
   const [footerHeadingVisible, setFooterHeadingVisible] = useState11(null);
   const footerDragRef = useRef9(null);
@@ -14507,16 +14487,7 @@ function OhhwellsBridge() {
   const addNavAfterAnchorRef = useRef9(null);
   const editContentRef = useRef9({});
   const aiSectionsRef = useRef9("");
-  const brandKitRef = useRef9("");
-  const stylesRef = useRef9("");
   const pendingDeleteUndoRef = useRef9(null);
-  const [floatingPanel, setFloatingPanel] = useState11(null);
-  const floatingPanelOpenRef = useRef9(false);
-  const setFloatingPanelRef = useRef9(setFloatingPanel);
-  const [floatingPanelPos, setFloatingPanelPos] = useState11(null);
-  const [logoSizeDraft, setLogoSizeDraft] = useState11(null);
-  const [editorViewport, setEditorViewport] = useState11("desktop");
-  const [parentScrollSnap, setParentScrollSnap] = useState11(null);
   const [sitePages, setSitePages] = useState11([]);
   const [sectionsByPath, setSectionsByPath] = useState11({});
   const sectionsPrefetchGenRef = useRef9(0);
@@ -14525,18 +14496,7 @@ function OhhwellsBridge() {
   const linkPopoverOpenRef = useRef9(false);
   const linkPopoverGraceUntilRef = useRef9(0);
   setLinkPopoverRef.current = setLinkPopover;
-  setFloatingPanelRef.current = setFloatingPanel;
   linkPopoverSessionRef.current = linkPopover;
-  floatingPanelOpenRef.current = Boolean(floatingPanel);
-  useEffect12(() => {
-    const syncViewport = () => {
-      const next = window.innerWidth <= 480 ? "mobile" : "desktop";
-      setEditorViewport((prev) => prev === next ? prev : next);
-    };
-    syncViewport();
-    window.addEventListener("resize", syncViewport);
-    return () => window.removeEventListener("resize", syncViewport);
-  }, []);
   const {
     navDragRef,
     navDropSlots,
@@ -14705,7 +14665,9 @@ function OhhwellsBridge() {
   const deactivate = useCallback7(() => {
     const el = activeElRef.current;
     if (!el) return;
-    const key = el.dataset.ohwKey;
+    const isFormBlock = el.dataset.ohwEditable === "form";
+    const isFormControl = el instanceof HTMLInputElement || el instanceof HTMLTextAreaElement || el instanceof HTMLSelectElement;
+    const key = isFormBlock || isFormControl ? void 0 : el.dataset.ohwKey;
     if (key) {
       const timer = autoSaveTimers.current.get(key);
       if (timer !== void 0) {
@@ -14722,6 +14684,12 @@ function OhhwellsBridge() {
     }
     el.removeAttribute("contenteditable");
     el.removeAttribute("data-ohw-editing");
+    const labelField = getFieldWrapper(el);
+    if (labelField) {
+      syncRequiredMark(labelField);
+      const owner = labelField.closest('[data-ohw-editable="form"]');
+      if (owner) persistFieldsRef.current(owner);
+    }
     activeElRef.current = null;
     setNavGroupForceOpen(null, false);
     setReorderHrefKey(null);
@@ -14761,8 +14729,6 @@ function OhhwellsBridge() {
     setHoveredNavContainerRect(null);
     hoveredItemElRef.current = null;
     setHoveredItemRect(null);
-    setFloatingPanel(null);
-    setLogoSizeDraft(null);
     if (!activeElRef.current) {
       setNavGroupForceOpen(null, false);
       setToolbarRect(null);
@@ -14877,6 +14843,12 @@ function OhhwellsBridge() {
     }
     el.removeAttribute("contenteditable");
     el.removeAttribute("data-ohw-editing");
+    const labelField = getFieldWrapper(el);
+    if (labelField) {
+      syncRequiredMark(labelField);
+      const owner = labelField.closest('[data-ohw-editable="form"]');
+      if (owner) persistFieldsRef.current(owner);
+    }
     activeElRef.current = null;
     setMaxBadge(null);
     setActiveCommands(/* @__PURE__ */ new Set());
@@ -15468,8 +15440,6 @@ function OhhwellsBridge() {
     setToolbarRect(anchor.getBoundingClientRect());
     setToolbarShowEditLink(false);
     setActiveCommands(/* @__PURE__ */ new Set());
-    setFloatingPanel(null);
-    setLogoSizeDraft(null);
   }, [deactivate, markSelected]);
   const selectFrame = useCallback7((el) => {
     if (!isNavigationContainer(el)) return;
@@ -15519,51 +15489,7 @@ function OhhwellsBridge() {
     setToolbarRect(el.getBoundingClientRect());
     setToolbarShowEditLink(false);
     setActiveCommands(/* @__PURE__ */ new Set());
-    setFloatingPanel(null);
-    setLogoSizeDraft(null);
   }, [deactivate, markSelected, postToParent2]);
-  const selectLogo = useCallback7(
-    (logoEl) => {
-      if (activeElRef.current) deactivate();
-      selectedElRef.current = logoEl;
-      selectedHrefKeyRef.current = null;
-      selectedFooterColAttrRef.current = null;
-      markSelected(logoEl);
-      setSelectedIsCta(false);
-      setSelectedIsSocial(false);
-      setSelectedIsSocialsRow(false);
-      clearHrefKeyHover(logoEl);
-      hoveredNavContainerRef.current = null;
-      setHoveredNavContainerRect(null);
-      setHoveredItemRect(null);
-      hoveredItemElRef.current = null;
-      siblingHintElRef.current = null;
-      setSiblingHintRect(null);
-      setSiblingHintRects([]);
-      setIsItemDragging(false);
-      setReorderHrefKey(null);
-      setReorderDragDisabled(false);
-      setIsFooterFrameSelection(false);
-      setToolbarVariant("logo");
-      setToolbarRect(getLogoInteractionRect(logoEl));
-      setToolbarShowEditLink(false);
-      setActiveCommands(/* @__PURE__ */ new Set());
-    },
-    [deactivate, markSelected]
-  );
-  const openLogoSizePanel = useCallback7((logoEl) => {
-    const placement = getLogoPlacement(logoEl);
-    const draft = readLogoSizeState(editContentRef.current, placement);
-    setLogoSizeDraft(draft);
-    setParentScrollSnap(parentScrollRef.current);
-    setFloatingPanel({
-      key: `logo-size:${placement}`,
-      title: "Logo",
-      context: placement === "navbar" ? "Navbar" : "Footer",
-      kind: "logo-size",
-      placement
-    });
-  }, []);
   const openSocialsDisplayPanel = useCallback7((row) => {
     setParentScrollSnap(parentScrollRef.current);
     setFloatingPanel({
@@ -15599,53 +15525,13 @@ function OhhwellsBridge() {
   );
   const closeFloatingPanelOnly = useCallback7(() => {
     setFloatingPanel(null);
-    setLogoSizeDraft(null);
   }, []);
+  const closeFloatingPanelOnlyRef = useRef9(closeFloatingPanelOnly);
+  closeFloatingPanelOnlyRef.current = closeFloatingPanelOnly;
   const closeFloatingPanelAndDeselect = useCallback7(() => {
     setFloatingPanel(null);
-    setLogoSizeDraft(null);
     deselectRef.current();
   }, []);
-  const persistLogoSizeDraft = useCallback7(
-    (placement, draft) => {
-      const desktopKey = LOGO_SIZE_DESKTOP_KEYS[placement];
-      const mobileKey = LOGO_SIZE_MOBILE_KEYS[placement];
-      const nodes = [
-        { key: desktopKey, text: String(draft.desktopPx) }
-      ];
-      if (draft.mobileFollowing) {
-        nodes.push({ key: mobileKey, text: "" });
-      } else {
-        nodes.push({ key: mobileKey, text: String(draft.mobilePx) });
-      }
-      editContentRef.current = {
-        ...editContentRef.current,
-        [desktopKey]: String(draft.desktopPx),
-        [mobileKey]: draft.mobileFollowing ? "" : String(draft.mobilePx)
-      };
-      applyLogoSizeToPlacement(
-        placement,
-        draft.desktopPx,
-        draft.mobileFollowing ? draft.desktopPx : draft.mobilePx,
-        draft.mobileFollowing
-      );
-      postToParent2({ type: "ow:change", nodes });
-      requestAnimationFrame(() => {
-        const selected = selectedElRef.current;
-        if (!selected || toolbarVariantRef.current !== "logo") return;
-        const rect = getLogoInteractionRect(selected);
-        setToolbarRect(rect);
-        if (glowElRef.current) {
-          const GAP = SELECTION_CHROME_GAP2;
-          glowElRef.current.style.top = `${rect.top - GAP}px`;
-          glowElRef.current.style.left = `${rect.left - GAP}px`;
-          glowElRef.current.style.width = `${rect.width + GAP * 2}px`;
-          glowElRef.current.style.height = `${rect.height + GAP * 2}px`;
-        }
-      });
-    },
-    [postToParent2]
-  );
   const activate = useCallback7((el, options) => {
     if (activeElRef.current === el) return;
     if (isIconEditable(el)) return;
@@ -15726,10 +15612,7 @@ function OhhwellsBridge() {
   deactivateRef.current = deactivate;
   selectRef.current = select;
   selectFrameRef.current = selectFrame;
-  selectLogoRef.current = selectLogo;
-  openLogoSizePanelRef.current = openLogoSizePanel;
   deselectRef.current = deselect;
-  closeFloatingPanelOnlyRef.current = closeFloatingPanelOnly;
   const lastSiteWideScopeRef = useRef9(null);
   useEffect12(() => {
     if (!isEditMode) {
@@ -15768,23 +15651,9 @@ function OhhwellsBridge() {
         aiSectionsRef.current = content[AI_SECTIONS_KEY];
         applyAiSectionsToDom(parseAiSectionsState(content[AI_SECTIONS_KEY]));
       }
-      if (typeof content[BRAND_KIT_KEY] === "string") {
-        brandKitRef.current = content[BRAND_KIT_KEY];
-        applyBrandToDom(parseBrandKit(content[BRAND_KIT_KEY]));
-      }
-      if (typeof content[STYLE_STORE_KEY] === "string") {
-        stylesRef.current = content[STYLE_STORE_KEY];
-        applyStylesToDom(parseStyleStore(content[STYLE_STORE_KEY]));
-      }
-      applyBrandChrome(content);
       for (const [key, val] of Object.entries(content)) {
         if (key === "__ohw_sections") continue;
         if (key === AI_SECTIONS_KEY) continue;
-        if (key === LOGO_PLACEHOLDER_KEY) continue;
-        if (LOGO_IMAGE_KEYS.includes(key)) continue;
-        if (key === BRAND_KIT_KEY) continue;
-        if (key === STYLE_STORE_KEY) continue;
-        if (BRAND_CHROME_KEYS.has(key)) continue;
         if (applyVideoSettingNode(key, val)) continue;
         if (applyCarouselNode(key, val)) continue;
         document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
@@ -15813,14 +15682,13 @@ function OhhwellsBridge() {
             applyLinkHref(el, val);
           } else if (el.dataset.ohwEditable === "icon") {
             applyIconMarkup(el, val);
+          } else if (el.dataset.ohwEditable === "form") {
           } else if (el.innerHTML !== val) {
             el.innerHTML = val;
           }
         });
         applyLinkByKey(key, val);
       }
-      applyLogoFromContent(content);
-      applyLogoSizes(content);
       reconcileNavbarItemsFromContent(content);
       reconcileFooterOrderFromContent(content);
       reconcileSocialsFromContent(content);
@@ -15841,9 +15709,7 @@ function OhhwellsBridge() {
     let cancelled = false;
     setFetchState("loading");
     const apiUrl = process.env.NEXT_PUBLIC_FLOWOPS_API_URL ?? "https://flowops-backend-staging-2yfdh7pwpq-as.a.run.app";
-    const initialPath = pathname;
-    fetchedContentPaths.add(`${subdomain}::${initialPath}`);
-    fetch(`${apiUrl}/api/public/sites/${subdomain}/content?path=${encodeURIComponent(initialPath)}`, { cache: "no-store" }).then((r2) => r2.ok ? r2.json() : null).then((data) => {
+    fetch(`${apiUrl}/api/public/sites/${subdomain}/content`, { cache: "no-store" }).then((r2) => r2.ok ? r2.json() : null).then((data) => {
       if (cancelled) return;
       const content = data?.content ?? {};
       contentCache.set(subdomain, content);
@@ -15856,6 +15722,102 @@ function OhhwellsBridge() {
       cancelled = true;
     };
   }, [subdomain, isEditMode]);
+  useEffect12(() => {
+    if (!isEditMode) return;
+    const resolveIndex = (form, clientY) => {
+      const wrappers = listFieldWrappers(form).filter((el) => fieldKeyOf(el) !== fieldDragRef.current?.key);
+      for (let i = 0; i < wrappers.length; i += 1) {
+        const rect = wrappers[i].getBoundingClientRect();
+        if (clientY < rect.top + rect.height / 2) return i;
+      }
+      return wrappers.length;
+    };
+    const onDragOver = (e) => {
+      const session = fieldDragRef.current;
+      if (!session) return;
+      e.preventDefault();
+      e.stopPropagation();
+      if (e.dataTransfer) e.dataTransfer.dropEffect = "move";
+      setFieldDropSlots(buildFieldDropSlots(session.form, session.key));
+      setFieldDropIndex(resolveIndex(session.form, e.clientY));
+    };
+    const onDrop = (e) => {
+      const session = fieldDragRef.current;
+      if (!session) return;
+      e.preventDefault();
+      e.stopPropagation();
+      moveField(session.form, session.key, resolveIndex(session.form, e.clientY));
+      persistFields(session.form);
+      const moved = listFieldWrappers(session.form).find((el) => fieldKeyOf(el) === session.key);
+      if (moved) selectField(moved);
+      setFormPickRect(session.form.getBoundingClientRect());
+      fieldDragRef.current = null;
+      setFieldDropIndex(null);
+      setFieldDropSlots([]);
+      setFieldDragging(false);
+    };
+    window.addEventListener("dragover", onDragOver, true);
+    window.addEventListener("drop", onDrop, true);
+    return () => {
+      window.removeEventListener("dragover", onDragOver, true);
+      window.removeEventListener("drop", onDrop, true);
+    };
+  }, [buildFieldDropSlots, isEditMode, persistFields, selectField]);
+  useEffect12(() => {
+    if (!isEditMode) return;
+    const mark = () => document.querySelectorAll('[data-ohw-editable="form"]').forEach((form) => {
+      markFormFields(form);
+    });
+    mark();
+    const observer = new MutationObserver(() => mark());
+    document.querySelectorAll('[data-ohw-editable="form"]').forEach((form) => {
+      observer.observe(form, { childList: true, subtree: true, characterData: true });
+    });
+    return () => observer.disconnect();
+  }, [isEditMode, fetchState, pathname]);
+  useEffect12(() => {
+    if (!isEditMode) return;
+    let saveTimer = null;
+    const onInput = (e) => {
+      const input = e.target;
+      if (!input || !("value" in input)) return;
+      const wrapper = getFieldWrapper(input);
+      if (!wrapper || wrapper !== fieldPickElRef.current) return;
+      if (saveTimer) clearTimeout(saveTimer);
+      const owner = wrapper.closest('[data-ohw-editable="form"]');
+      saveTimer = setTimeout(() => {
+        const form = owner ?? formPickElRef.current;
+        if (!form) return;
+        const previous = input.getAttribute("placeholder");
+        input.setAttribute("placeholder", input.value);
+        persistFields(form);
+        input.setAttribute("placeholder", previous ?? "");
+      }, 400);
+    };
+    document.addEventListener("input", onInput, true);
+    return () => document.removeEventListener("input", onInput, true);
+  }, [isEditMode, persistFields]);
+  useEffect12(() => {
+    if (isEditMode || fetchState !== "done") return;
+    const content = contentCache.get(subdomain) ?? {};
+    document.querySelectorAll('[data-ohw-editable="form"]').forEach((form) => {
+      reconcileFieldsFromContent(form, content);
+    });
+  }, [isEditMode, fetchState, subdomain]);
+  useEffect12(() => {
+    if (!isEditMode) return;
+    const swallow = (e) => {
+      const target = e.target;
+      if (target && getFormElement(target)) e.preventDefault();
+    };
+    document.addEventListener("submit", swallow, true);
+    return () => document.removeEventListener("submit", swallow, true);
+  }, [isEditMode]);
+  useEffect12(() => {
+    if (isEditMode || fetchState !== "done") return;
+    const apiUrl = process.env.NEXT_PUBLIC_FLOWOPS_API_URL ?? "https://flowops-backend-staging-2yfdh7pwpq-as.a.run.app";
+    bindPublishedForms(apiUrl, subdomain, contentCache.get(subdomain) ?? {});
+  }, [isEditMode, fetchState, subdomain]);
   useEffect12(() => {
     if (!subdomain || isEditMode) return;
     let debounceTimer = null;
@@ -15867,21 +15829,8 @@ function OhhwellsBridge() {
       initSectionInstancesFromContent(content, window.location.pathname);
       observer?.disconnect();
       try {
-        applyBrandChrome(content);
-        if (typeof content[BRAND_KIT_KEY] === "string") {
-          applyBrandToDom(parseBrandKit(content[BRAND_KIT_KEY]));
-        }
-        if (typeof content[STYLE_STORE_KEY] === "string") {
-          applyStylesToDom(parseStyleStore(content[STYLE_STORE_KEY]));
-        }
         for (const [key, val] of Object.entries(content)) {
           if (key === "__ohw_sections") continue;
-          if (key === LOGO_PLACEHOLDER_KEY) continue;
-          if (LOGO_IMAGE_KEYS.includes(key)) continue;
-          if (key === BRAND_KIT_KEY) continue;
-          if (key === STYLE_STORE_KEY) continue;
-          if (key === STYLE_STORE_KEY) continue;
-          if (BRAND_CHROME_KEYS.has(key)) continue;
           if (applyVideoSettingNode(key, val)) continue;
           if (applyCarouselNode(key, val)) continue;
           document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
@@ -15896,17 +15845,23 @@ function OhhwellsBridge() {
               if (video && video.src !== val) applyVideoSrc(video, val);
             } else if (el.dataset.ohwEditable === "link") {
               applyLinkHref(el, val);
+            } else if (el.dataset.ohwEditable === "form") {
             } else if (el.innerHTML !== val) {
               el.innerHTML = val;
             }
           });
           applyLinkByKey(key, val);
         }
-        applyLogoFromContent(content);
         reconcileNavbarItemsFromContent(content);
         reconcileFooterOrderFromContent(content);
         reconcileSocialsFromContent(content);
         applySocialsDisplayFromContent(content);
+        document.querySelectorAll('[data-ohw-editable="form"]').forEach((form) => {
+          if (!form.querySelector("[data-ohw-form-success]")) {
+            reconcileFieldsFromContent(form, content);
+          }
+          listFieldWrappers(form).forEach(syncRequiredMark);
+        });
       } finally {
         observer?.observe(document.body, { childList: true, subtree: true });
       }
@@ -15917,17 +15872,6 @@ function OhhwellsBridge() {
       debounceTimer = setTimeout(applyFromCache, 150);
     };
     applyFromCache();
-    const pathCacheKey = `${subdomain}::${pathname}`;
-    if (!fetchedContentPaths.has(pathCacheKey)) {
-      fetchedContentPaths.add(pathCacheKey);
-      const apiUrl = process.env.NEXT_PUBLIC_FLOWOPS_API_URL ?? "https://flowops-backend-staging-2yfdh7pwpq-as.a.run.app";
-      fetch(`${apiUrl}/api/public/sites/${subdomain}/content?path=${encodeURIComponent(pathname)}`, { cache: "no-store" }).then((r2) => r2.ok ? r2.json() : null).then((data) => {
-        if (!data?.content) return;
-        contentCache.set(subdomain, data.content);
-        applyFromCache();
-      }).catch(() => {
-      });
-    }
     observer = new MutationObserver(scheduleApply);
     observer.observe(document.body, { childList: true, subtree: true });
     return () => {
@@ -16021,31 +15965,26 @@ function OhhwellsBridge() {
   }, [isEditMode, pathname, subdomain, fetchState, resyncSelectedNavigationItem]);
   useEffect12(() => {
     if (!isEditMode) return;
-    let lastPosted = 0;
     const measure = () => {
       const h = document.body.scrollHeight;
-      if (h > 50 && Math.abs(h - lastPosted) > 1) {
-        lastPosted = h;
-        postToParent2({ type: "ow:height", height: h });
-      }
-    };
-    let raf = null;
-    const schedule = () => {
-      if (raf != null) return;
-      raf = requestAnimationFrame(() => {
-        raf = null;
-        measure();
-      });
+      if (h > 50) postToParent2({ type: "ow:height", height: h });
     };
     const t1 = setTimeout(measure, 50);
     const t2 = setTimeout(measure, 500);
-    const ro = new ResizeObserver(schedule);
-    ro.observe(document.body);
+    let lastWidth = window.innerWidth;
+    let resizeTimer = null;
+    const handleResize = () => {
+      if (window.innerWidth === lastWidth) return;
+      lastWidth = window.innerWidth;
+      if (resizeTimer) clearTimeout(resizeTimer);
+      resizeTimer = setTimeout(measure, 150);
+    };
+    window.addEventListener("resize", handleResize);
     return () => {
       clearTimeout(t1);
       clearTimeout(t2);
-      if (raf != null) cancelAnimationFrame(raf);
-      ro.disconnect();
+      if (resizeTimer) clearTimeout(resizeTimer);
+      window.removeEventListener("resize", handleResize);
     };
   }, [pathname, isEditMode, postToParent2]);
   useEffect12(() => {
@@ -16089,7 +16028,9 @@ function OhhwellsBridge() {
       [style*="100vh"] { min-height: ${initialVh}px !important; height: ${initialVh}px !important; }
       [style*="100svh"] { min-height: ${initialVh}px !important; height: ${initialVh}px !important; }
       [style*="100dvh"] { min-height: ${initialVh}px !important; height: ${initialVh}px !important; }
-      [data-ohw-editable] {
+      /* Not the form: it is a layout container (flex/grid with gaps), and forcing block
+         crushed its fields together (OHH-490). */
+      [data-ohw-editable]:not([data-ohw-editable="form"]) {
         display: block;
       }
       /* Body text (no item-action toolbar) \u2014 first click enters text edit \u2192 I-beam.
@@ -16115,6 +16056,35 @@ function OhhwellsBridge() {
       [data-ohw-editable="video"], [data-ohw-editable="video"] *,
       [data-ohw-editable="bg-image"], [data-ohw-editable="bg-image"] * { cursor: pointer !important; }
       [data-ohw-editable="link"], [data-ohw-editable="link"] * { cursor: pointer !important; }
+      /* A form field is a design surface in the editor: its input takes the pointer so the
+         field can be picked and hovered from anywhere inside it (OHH-642). */
+      [data-ohw-editable="form"] [data-ohw-form-field] input,
+      [data-ohw-editable="form"] [data-ohw-form-field] textarea,
+      [data-ohw-editable="form"] [data-ohw-form-field] label {
+        pointer-events: auto !important;
+        cursor: pointer !important;
+      }
+      /* While a field is selected its placeholder is being written in the value, so the
+         text reads as a placeholder rather than as an answer (OHH-642). */
+      /* A field is a design surface here: dragging its corner resized it past the form and
+         left the chrome behind. Height stays adjustable, width does not (OHH-642). */
+      [data-ohw-editable="form"] [data-ohw-form-field] textarea {
+        resize: vertical !important;
+        max-width: 100% !important;
+      }
+      [data-ohw-editable="form"] [data-ohw-form-field] input,
+      [data-ohw-editable="form"] [data-ohw-form-field] textarea {
+        box-sizing: border-box !important;
+        width: 100% !important;
+      }
+      /* Somewhere to click the block itself, on every side (OHH-642) \u2014 editor only. */
+      [data-ohw-editable="form"] {
+        padding: 18px !important;
+      }
+      [data-ohw-placeholder-edit] {
+        color: color-mix(in srgb, currentColor 55%, transparent) !important;
+        cursor: text !important;
+      }
       /* Text hover chrome is drawn by the overlay (see hoveredTextRect) \u2014 the CSS outline
          that used to draw it dashes denser than the overlay border, so identical specs
          still read as two different frames (OHH-695). The attribute stays: hover paths
@@ -16195,12 +16165,53 @@ function OhhwellsBridge() {
         return;
       }
       const target = e.target;
-      if (target.closest("[data-ohw-ai-review]")) return;
       if (target.closest("[data-ohw-toolbar]")) return;
       if (target.closest("[data-ohw-state-toggle]")) return;
       if (target.closest("[data-ohw-max-badge]")) return;
       if (isInsideLinkEditor(target)) return;
-      if (isInsideFloatingPanel(target)) return;
+      if (target.closest("[data-ohw-form-toolbar]")) return;
+      if (target.closest(
+        '[data-ohw-field-toolbar], [data-ohw-field-type-picker], [data-radix-popper-content-wrapper], [role="menu"], [data-slot="dropdown-menu-content"]'
+      )) {
+        return;
+      }
+      {
+        const formEl = getFormElement(target);
+        const onSuccessText = target.closest(`[${SUCCESS_TEXT_ATTR}]`);
+        if (formEl && formKeyOf(formEl) && !onSuccessText) {
+          const fieldEl = getFieldWrapper(target);
+          if (fieldEl) {
+            const label = target.closest("label");
+            if (label && fieldPickElRef.current === fieldEl) return;
+            e.preventDefault();
+            e.stopPropagation();
+            deactivateRef.current();
+            deselectRef.current();
+            formPickElRef.current = formEl;
+            setFormPickRect(null);
+            selectField(fieldEl);
+            if (!label) fieldEl.querySelector("input, textarea")?.focus();
+            return;
+          }
+          clearFieldPick();
+          e.preventDefault();
+          e.stopPropagation();
+          deactivateRef.current();
+          deselectRef.current();
+          markFormFields(formEl);
+          formHoverElRef.current = null;
+          setFormHoverRect(null);
+          formPickElRef.current = formEl;
+          setFormPickRect(formEl.getBoundingClientRect());
+          postToParentRef.current({
+            type: "ow:form-selected",
+            formKey: formKeyOf(formEl),
+            hasLongText: formHasLongText(formEl)
+          });
+          return;
+        }
+        if (!formEl && formPickElRef.current) clearFormPick();
+      }
       if (target.closest('[data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
         const beneath = document.elementsFromPoint(e.clientX, e.clientY).find(
           (el) => el instanceof HTMLElement && !el.closest("[data-ohw-bridge-root]") && el.closest("[data-ohw-section]") != null
@@ -16268,15 +16279,9 @@ function OhhwellsBridge() {
       if (logoEl) {
         e.preventDefault();
         e.stopPropagation();
-        if (!logoHasUploadedImage(logoEl)) {
-          deselectRef.current();
-          deactivateRef.current();
-          const identity = readLogoIdentityFromDom();
-          postToParentRef.current({ type: "ow:open-logo-settings", ...identity });
-          return;
-        }
-        selectLogoRef.current(logoEl);
-        openLogoSizePanelRef.current(logoEl);
+        deselectRef.current();
+        deactivateRef.current();
+        postToParentRef.current({ type: "ow:open-logo-settings" });
         return;
       }
       const editable = target.closest("[data-ohw-editable]");
@@ -16431,12 +16436,10 @@ function OhhwellsBridge() {
     };
     const handleDblClick = (e) => {
       const target = e.target;
-      if (target.closest("[data-ohw-ai-review]")) return;
       if (target.closest("[data-ohw-toolbar]")) return;
       if (target.closest("[data-ohw-state-toggle]")) return;
       if (target.closest("[data-ohw-max-badge]")) return;
       if (isInsideLinkEditor(target)) return;
-      if (isInsideFloatingPanel(target)) return;
       if (target.closest('[data-ohw-edit-chrome], [data-ohw-item-interaction], [data-ohw-drag-handle-container], [data-slot="drag-handle"]')) {
         return;
       }
@@ -16464,16 +16467,26 @@ function OhhwellsBridge() {
         setHoveredNavContainerRect(null);
         return;
       }
-      if (document.documentElement.hasAttribute("data-ohw-panel-dragging") || isInsideFloatingPanel(target) || isPointOverFloatingPanel(e.clientX, e.clientY)) {
+      if (target.closest(EDITOR_CHROME_SELECTOR) || isOverEditorChrome(e.clientX, e.clientY) || isInsideLinkEditor(target)) {
+        document.querySelectorAll("[data-ohw-hovered]").forEach((el) => el.removeAttribute("data-ohw-hovered"));
         hoveredItemElRef.current = null;
         setHoveredItemRect(null);
         hoveredNavContainerRef.current = null;
         setHoveredNavContainerRect(null);
+        formHoverElRef.current = null;
+        setFormHoverRect(null);
         siblingHintElRef.current = null;
         setSiblingHintRect(null);
         setSiblingHintRects([]);
         return;
       }
+      if (document.documentElement.hasAttribute("data-ohw-panel-dragging") || target.closest("[data-ohw-floating-panel]")) {
+        hoveredItemElRef.current = null;
+        setHoveredItemRect(null);
+        hoveredNavContainerRef.current = null;
+        setHoveredNavContainerRect(null);
+        return;
+      }
       {
         const selected2 = selectedElRef.current;
         const selectedIsFooterColumn = Boolean(selected2) && !isFooterLinksContainer(selected2) && (selected2.hasAttribute("data-ohw-footer-col") || selected2.hasAttribute("data-ohw-footer-column") || Boolean(selected2.closest("footer") && isInferredFooterGroup2(selected2)));
@@ -16516,7 +16529,7 @@ function OhhwellsBridge() {
         setHoveredNavContainerRect(null);
         if (selectedElRef.current === logoEl) return;
         hoveredItemElRef.current = logoEl;
-        setHoveredItemRect(getLogoInteractionRect(logoEl));
+        setHoveredItemRect(logoEl.getBoundingClientRect());
         return;
       }
       const navAnchor = getNavigationItemAnchor(target);
@@ -16540,6 +16553,26 @@ function OhhwellsBridge() {
         return;
       }
       const editable = target.closest("[data-ohw-editable]");
+      const hoverForm = getFormElement(target);
+      if (hoverForm) {
+        const hoverField = getFieldWrapper(target);
+        const hoverTarget = hoverField ?? hoverForm;
+        const selectedHere = hoverTarget === fieldPickElRef.current || hoverTarget === formPickElRef.current;
+        hoveredItemElRef.current = null;
+        setHoveredItemRect(null);
+        if (selectedHere) {
+          formHoverElRef.current = null;
+          setFormHoverRect(null);
+        } else {
+          formHoverElRef.current = hoverTarget;
+          setFormHoverRect(hoverTarget.getBoundingClientRect());
+        }
+        return;
+      }
+      if (formHoverElRef.current) {
+        formHoverElRef.current = null;
+        setFormHoverRect(null);
+      }
       if (!editable) return;
       const selected = selectedElRef.current;
       if (selected && (selected === editable || selected.contains(editable))) return;
@@ -16560,6 +16593,7 @@ function OhhwellsBridge() {
             hoveredNavContainerRef.current = null;
             setHoveredNavContainerRect(null);
             hoveredItemElRef.current = editable;
+            setHoveredItemRect(editable.getBoundingClientRect());
           }
         }
       }
@@ -16767,7 +16801,7 @@ function OhhwellsBridge() {
         setHoveredNavContainerRect(null);
         if (selectedElRef.current !== logo) {
           hoveredItemElRef.current = logo;
-          setHoveredItemRect(getLogoInteractionRect(logo));
+          setHoveredItemRect(logo.getBoundingClientRect());
         }
         return;
       }
@@ -16856,7 +16890,7 @@ function OhhwellsBridge() {
       }
     };
     const probeImageAt = (clientX, clientY, isDragOver = false, fromParentViewport = false) => {
-      if (linkPopoverOpenRef.current || floatingPanelOpenRef.current && isPointOverFloatingPanel(clientX, clientY)) {
+      if (linkPopoverOpenRef.current) {
         if (hoveredImageRef.current) {
           hoveredImageRef.current = null;
           hoveredImageHasTextOverlapRef.current = false;
@@ -17110,7 +17144,7 @@ function OhhwellsBridge() {
       }
     };
     const probeHoverCardsAt = (clientX, clientY, fromParentViewport = false) => {
-      if (linkPopoverOpenRef.current || floatingPanelOpenRef.current && isPointOverFloatingPanel(clientX, clientY) || document.documentElement.hasAttribute("data-ohw-section-picking")) {
+      if (linkPopoverOpenRef.current || document.documentElement.hasAttribute("data-ohw-section-picking")) {
         if (activeStateElRef.current) {
           activeStateElRef.current.removeAttribute("data-ohw-state-hovered");
           activeStateElRef.current = null;
@@ -17176,19 +17210,24 @@ function OhhwellsBridge() {
         setSectionGap(null);
       }
     };
+    const pointOwnedByFloatingPanel = (clientX, clientY) => {
+      if (document.documentElement.hasAttribute("data-ohw-panel-dragging")) return true;
+      const panel = document.querySelector("[data-ohw-floating-panel]");
+      if (!panel) return false;
+      const rect = panel.getBoundingClientRect();
+      return clientX >= rect.left && clientX <= rect.right && clientY >= rect.top && clientY <= rect.bottom;
+    };
     const handleMouseMove = (e) => {
       const { clientX, clientY } = e;
-      if (document.documentElement.hasAttribute("data-ohw-panel-dragging") || floatingPanelOpenRef.current && isPointOverFloatingPanel(clientX, clientY)) {
+      if (pointOwnedByFloatingPanel(clientX, clientY)) return;
+      if (isOverEditorChrome(clientX, clientY)) {
+        document.querySelectorAll("[data-ohw-hovered]").forEach((el) => el.removeAttribute("data-ohw-hovered"));
+        formHoverElRef.current = null;
+        setFormHoverRect(null);
         hoveredItemElRef.current = null;
         setHoveredItemRect(null);
         hoveredNavContainerRef.current = null;
         setHoveredNavContainerRect(null);
-        siblingHintElRef.current = null;
-        setSiblingHintRect(null);
-        setSiblingHintRects([]);
-        dismissImageHover();
-        clearImageHover();
-        setSectionGap(null);
         return;
       }
       probeSectionGapAt(clientX, clientY);
@@ -17199,11 +17238,7 @@ function OhhwellsBridge() {
       if (e.data?.type !== "ow:pointer-sync") return;
       const { clientX, clientY } = e.data;
       if (typeof clientX !== "number" || typeof clientY !== "number") return;
-      if (document.documentElement.hasAttribute("data-ohw-panel-dragging") || floatingPanelOpenRef.current && isPointOverFloatingPanel(clientX, clientY)) {
-        dismissImageHover();
-        clearImageHover();
-        return;
-      }
+      if (pointOwnedByFloatingPanel(clientX, clientY)) return;
       probeSectionGapAt(clientX, clientY);
       probeImageAt(clientX, clientY);
       probeHoverCardsAt(clientX, clientY);
@@ -17453,15 +17488,6 @@ function OhhwellsBridge() {
         aiSectionsRef.current = content[AI_SECTIONS_KEY];
         applyAiSectionsToDom(parseAiSectionsState(content[AI_SECTIONS_KEY]));
       }
-      if (typeof content[BRAND_KIT_KEY] === "string") {
-        brandKitRef.current = content[BRAND_KIT_KEY];
-        applyBrandToDom(parseBrandKit(content[BRAND_KIT_KEY]));
-      }
-      if (typeof content[STYLE_STORE_KEY] === "string") {
-        stylesRef.current = content[STYLE_STORE_KEY];
-        applyStylesToDom(parseStyleStore(content[STYLE_STORE_KEY]));
-      }
-      applyBrandChrome(content);
       let sectionsJson = null;
       for (const [key, val] of Object.entries(content)) {
         if (key === "__ohw_sections") {
@@ -17469,11 +17495,6 @@ function OhhwellsBridge() {
           continue;
         }
         if (key === AI_SECTIONS_KEY) continue;
-        if (key === LOGO_PLACEHOLDER_KEY) continue;
-        if (LOGO_IMAGE_KEYS.includes(key) && !String(val ?? "").trim()) continue;
-        if (key === BRAND_KIT_KEY) continue;
-        if (key === STYLE_STORE_KEY) continue;
-        if (BRAND_CHROME_KEYS.has(key)) continue;
         if (applyVideoSettingNode(key, val)) continue;
         if (applyCarouselNode(key, val)) continue;
         document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
@@ -17493,8 +17514,6 @@ function OhhwellsBridge() {
         });
         applyLinkByKey(key, val);
       }
-      applyLogoFromContent(content);
-      applyLogoSizes(content);
       if (sectionsJson) {
         initSectionsFromContent({ __ohw_sections: sectionsJson }, true);
         sectionsLoadedRef.current = true;
@@ -17510,58 +17529,6 @@ function OhhwellsBridge() {
       if (hydratedHeight > 50) postToParentRef.current({ type: "ow:height", height: hydratedHeight });
       postToParentRef.current({ type: "ow:hydrate-done" });
     };
-    const handleUpdateLogoIdentity = (e) => {
-      if (e.data?.type !== "ow:update-logo-identity") return;
-      const rawText = typeof e.data.text === "string" ? e.data.text : "";
-      const alt = typeof e.data.alt === "string" ? e.data.alt : rawText;
-      const href = typeof e.data.href === "string" ? e.data.href : void 0;
-      const imageProvided = "image" in e.data;
-      const imageUrl = imageProvided && typeof e.data.image === "string" && e.data.image.trim() ? e.data.image.trim() : imageProvided ? null : void 0;
-      let isPlaceholder = e.data.isPlaceholder !== false;
-      if (imageUrl) isPlaceholder = false;
-      else if (imageProvided && imageUrl === null) {
-        isPlaceholder = e.data.isPlaceholder === true || !rawText.trim() || resolveLogoDisplayText(rawText) === PLACEHOLDER_BUSINESS_NAME;
-      }
-      const display = applyLogoIdentity(rawText, isPlaceholder);
-      const displayAlt = resolveLogoDisplayText(alt || display);
-      if (imageUrl !== void 0) {
-        applyLogoImage(imageUrl, displayAlt);
-      } else {
-        for (const key of LOGO_IMAGE_KEYS) {
-          document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
-            const img = el instanceof HTMLImageElement ? el : el.querySelector("img");
-            if (img) img.alt = displayAlt;
-          });
-        }
-      }
-      if (href !== void 0) {
-        applyLogoHref(href);
-        applyLinkByKey("nav-logo-href", href);
-        applyLinkByKey("footer-logo-href", href);
-        applyLinkByKey("logo-href", href);
-      }
-      const nodes = [
-        ...LOGO_TEXT_KEYS.map((key) => ({ key, text: display })),
-        { key: LOGO_PLACEHOLDER_KEY, text: isPlaceholder ? "true" : "false" },
-        { key: LOGO_ALT_KEY, text: displayAlt }
-      ];
-      if (imageUrl !== void 0) {
-        if (imageUrl) {
-          for (const key of LOGO_IMAGE_KEYS) nodes.push({ key, text: imageUrl });
-        } else {
-          for (const key of LOGO_IMAGE_KEYS) nodes.push({ key, text: "" });
-        }
-      }
-      if (href !== void 0) {
-        for (const key of LOGO_HREF_KEYS) nodes.push({ key, text: href.trim() || "/" });
-      }
-      editContentRef.current = {
-        ...editContentRef.current,
-        ...Object.fromEntries(nodes.map(({ key, text }) => [key, text]))
-      };
-      applyLogoSizes(editContentRef.current);
-      postToParentRef.current({ type: "ow:change", nodes });
-    };
     window.addEventListener("message", handleHydrate);
     const postAiSectionsChanged = () => {
       postToParentRef.current({
@@ -17575,10 +17542,7 @@ function OhhwellsBridge() {
       const payload = e.data.payload;
       if (!payload || typeof payload.id !== "string" || !isRenderableTree(payload.tree)) return;
       const previous = aiSectionsRef.current;
-      const nextState = applyTreeToState(parseAiSectionsState(previous), {
-        ...payload,
-        path: payload.path ?? window.location.pathname
-      });
+      const nextState = applyTreeToState(parseAiSectionsState(previous), payload);
       const nextValue = serializeAiSectionsState(nextState);
       aiSectionsRef.current = nextValue;
       applyAiSectionsToDom(nextState);
@@ -17615,42 +17579,12 @@ function OhhwellsBridge() {
       const value = typeof e.data.value === "string" ? e.data.value : "";
       aiSectionsRef.current = value;
       applyAiSectionsToDom(parseAiSectionsState(value));
-      applyStylesToDom(parseStyleStore(stylesRef.current));
       const restoredHeight = document.documentElement.scrollHeight;
       if (restoredHeight > 50) postToParentRef.current({ type: "ow:height", height: restoredHeight });
       postToParentRef.current({ type: "ow:change", nodes: [{ key: AI_SECTIONS_KEY, text: value }] });
       postAiSectionsChanged();
     };
     window.addEventListener("message", handleAiSetSections);
-    const handleAiSetBrand = (e) => {
-      if (e.data?.type !== "ow:ai-set-brand") return;
-      const value = typeof e.data.value === "string" ? e.data.value : "";
-      const previous = brandKitRef.current;
-      brandKitRef.current = value;
-      applyBrandToDom(parseBrandKit(value));
-      if (aiSectionsRef.current) applyAiSectionsToDom(parseAiSectionsState(aiSectionsRef.current));
-      applyStylesToDom(parseStyleStore(stylesRef.current));
-      postToParentRef.current({ type: "ow:change", nodes: [{ key: BRAND_KIT_KEY, text: value }] });
-      postToParentRef.current({ type: "ow:ai-brand-applied", previous, value });
-    };
-    window.addEventListener("message", handleAiSetBrand);
-    const handleAiSetStyles = (e) => {
-      if (e.data?.type !== "ow:ai-set-styles") return;
-      const value = typeof e.data.value === "string" ? e.data.value : "";
-      const previous = stylesRef.current;
-      stylesRef.current = value;
-      applyStylesToDom(parseStyleStore(value));
-      postToParentRef.current({ type: "ow:change", nodes: [{ key: STYLE_STORE_KEY, text: value }] });
-      postToParentRef.current({ type: "ow:ai-styles-applied", previous, value });
-    };
-    window.addEventListener("message", handleAiSetStyles);
-    const handleGetBrand = (e) => {
-      if (e.data?.type !== "ow:get-brand") return;
-      const template = deriveTemplateBrand();
-      const value = brandKitRef.current || (template ? JSON.stringify(template) : "");
-      postToParentRef.current({ type: "ow:brand-value", value });
-    };
-    window.addEventListener("message", handleGetBrand);
     const handleDeactivate = (e) => {
       if (e.data?.type !== "ow:deactivate") return;
       if (Date.now() < linkPopoverGraceUntilRef.current) return;
@@ -17659,12 +17593,6 @@ function OhhwellsBridge() {
         closeLinkPopoverRef.current();
         return;
       }
-      if (floatingPanelOpenRef.current) {
-        setFloatingPanelRef.current(null);
-        deselectRef.current();
-        deactivateRef.current();
-        return;
-      }
       deselectRef.current();
       deactivateRef.current();
     };
@@ -17718,10 +17646,6 @@ function OhhwellsBridge() {
         return;
       }
       if (selectedElRef.current) {
-        if (toolbarVariantRef.current === "logo") {
-          deselectRef.current();
-          return;
-        }
         if (toolbarVariantRef.current === "select-frame") {
           const parent2 = getNavigationSelectionParent(selectedElRef.current);
           if (parent2 && isNavigationContainer(parent2) && isFooterLinksContainer(parent2) && !isFooterLinksContainer(selectedElRef.current)) {
@@ -17741,6 +17665,13 @@ function OhhwellsBridge() {
         }
       }
     };
+    const handleFormCount = (e) => {
+      if (e.data?.type !== "ow:form-count") return;
+      const form = formPickElRef.current;
+      if (!form || formKeyOf(form) !== e.data.formKey) return;
+      setFormPickCount(typeof e.data.count === "number" ? e.data.count : null);
+    };
+    window.addEventListener("message", handleFormCount);
     window.addEventListener("message", handleUiEscape);
     const handleKeyDown = (e) => {
       if (e.key === "Escape" && document.querySelector("[data-ohw-section-picker]")) return;
@@ -17760,11 +17691,12 @@ function OhhwellsBridge() {
         closeFloatingPanelOnlyRef.current();
         return;
       }
+      if (e.key === "Escape" && formPickElRef.current) {
+        e.preventDefault();
+        clearFormPickRef.current();
+        return;
+      }
       if (e.key === "Escape" && selectedElRef.current && !activeElRef.current) {
-        if (toolbarVariantRef.current === "logo") {
-          deselectRef.current();
-          return;
-        }
         if (toolbarVariantRef.current === "select-frame") {
           const parent2 = getNavigationSelectionParent(selectedElRef.current);
           if (parent2 && isNavigationContainer(parent2) && isFooterLinksContainer(parent2) && !isFooterLinksContainer(selectedElRef.current)) {
@@ -17842,8 +17774,7 @@ function OhhwellsBridge() {
     const handleScroll = () => {
       const focusEl = activeElRef.current ?? selectedElRef.current;
       if (focusEl) {
-        const measureEl = activeElRef.current ? getEditMeasureEl(activeElRef.current) : toolbarVariantRef.current === "logo" ? null : focusEl;
-        const r2 = measureEl ? measureEl.getBoundingClientRect() : toolbarVariantRef.current === "logo" ? getLogoInteractionRect(focusEl) : focusEl.getBoundingClientRect();
+        const r2 = activeElRef.current ? getEditMeasureEl(activeElRef.current).getBoundingClientRect() : focusEl.getBoundingClientRect();
         applyToolbarPos(r2);
         setToolbarRect(r2);
         setMaxBadge((prev) => prev && activeElRef.current ? { ...prev, rect: r2 } : prev);
@@ -17853,9 +17784,7 @@ function OhhwellsBridge() {
         setToggleState((prev) => prev ? { ...prev, rect } : null);
       }
       if (hoveredItemElRef.current) {
-        const hoverEl = hoveredItemElRef.current;
-        const logo = getLogoElement(hoverEl);
-        setHoveredItemRect(logo ? getLogoInteractionRect(logo) : hoverEl.getBoundingClientRect());
+        setHoveredItemRect(hoveredItemElRef.current.getBoundingClientRect());
       }
       if (hoveredNavContainerRef.current) {
         setHoveredNavContainerRect(hoveredNavContainerRef.current.getBoundingClientRect());
@@ -17899,12 +17828,13 @@ function OhhwellsBridge() {
       if (aiSectionsRef.current) {
         nodes.push({ key: AI_SECTIONS_KEY, type: "sections", text: aiSectionsRef.current });
       }
-      if (stylesRef.current) {
-        nodes.push({ key: STYLE_STORE_KEY, type: "styles", text: stylesRef.current });
-      }
-      if (brandKitRef.current) {
-        nodes.push({ key: BRAND_KIT_KEY, type: "brand", text: brandKitRef.current });
-      }
+      document.querySelectorAll('[data-ohw-editable="form"]').forEach((form) => {
+        const formKey = formKeyOf(form);
+        if (!formKey) return;
+        const specs = readFieldsFromDom(form);
+        const text = specs.length ? JSON.stringify(specs) : editContentRef.current[fieldsKey(formKey)];
+        if (text) nodes.push({ key: fieldsKey(formKey), type: "text", text });
+      });
       postToParentRef.current({ type: "ow:save-result", nodes });
     };
     const handleInsertSection = (e) => {
@@ -17915,12 +17845,8 @@ function OhhwellsBridge() {
       if (inserted) {
         const tracker = getSectionsTracker();
         postToParentRef.current({ type: "ow:change", nodes: [{ key: "__ohw_sections", text: tracker.textContent ?? "[]" }] });
-        const reportHeight = () => {
-          const h = document.body.scrollHeight;
-          if (h > 50) postToParentRef.current({ type: "ow:height", height: h });
-        };
-        reportHeight();
-        setTimeout(reportHeight, 500);
+        const h = document.documentElement.scrollHeight;
+        if (h > 50) postToParentRef.current({ type: "ow:height", height: h });
       }
     };
     const handleSwitchSchedule = (e) => {
@@ -18113,17 +18039,13 @@ function OhhwellsBridge() {
       if (e.data?.type !== "ow:parent-scroll") return;
       const { iframeOffsetTop, headerH, canvasH } = e.data;
       parentScrollRef.current = { iframeOffsetTop, headerH, canvasH };
-      if (floatingPanelOpenRef.current) {
-        setParentScrollSnap({ iframeOffsetTop, headerH, canvasH });
-      }
       if (visibleViewportRef.current) {
         applyVisibleViewport(visibleViewportRef.current, parentScrollRef.current);
       }
       const focusEl = activeElRef.current ?? selectedElRef.current;
       if (focusEl) {
-        const measureEl = activeElRef.current ? getEditMeasureEl(activeElRef.current) : toolbarVariantRef.current === "logo" ? null : focusEl;
-        const r2 = measureEl ? measureEl.getBoundingClientRect() : toolbarVariantRef.current === "logo" ? getLogoInteractionRect(focusEl) : focusEl.getBoundingClientRect();
-        applyToolbarPos(r2);
+        const measureEl = activeElRef.current ? getEditMeasureEl(activeElRef.current) : focusEl;
+        applyToolbarPos(measureEl.getBoundingClientRect());
       }
     };
     const handleClickAt = (e) => {
@@ -18156,15 +18078,9 @@ function OhhwellsBridge() {
         return clientX >= r2.left && clientX <= r2.right && clientY >= r2.top && clientY <= r2.bottom;
       });
       if (logoAtPoint) {
-        if (!logoHasUploadedImage(logoAtPoint)) {
-          deselectRef.current();
-          deactivateRef.current();
-          const identity = readLogoIdentityFromDom();
-          postToParentRef.current({ type: "ow:open-logo-settings", ...identity });
-          return;
-        }
-        selectLogoRef.current(logoAtPoint);
-        openLogoSizePanelRef.current(logoAtPoint);
+        deselectRef.current();
+        deactivateRef.current();
+        postToParentRef.current({ type: "ow:open-logo-settings" });
         return;
       }
       const textEditable = Array.from(
@@ -18238,14 +18154,6 @@ function OhhwellsBridge() {
     window.addEventListener("message", handleParentScroll);
     window.addEventListener("message", handlePointerSync);
     window.addEventListener("message", handleClickAt);
-    window.addEventListener("message", handleUpdateLogoIdentity);
-    const handleViewMode = (e) => {
-      if (e.data?.type !== "ow:view-mode") return;
-      const mode = e.data.mode === "Mobile" || e.data.mode === "mobile" ? "mobile" : "desktop";
-      setEditorViewport(mode);
-      applyLogoSizes(editContentRef.current);
-    };
-    window.addEventListener("message", handleViewMode);
     const handleViewportResize = () => {
       if (visibleViewportRef.current) {
         applyVisibleViewport(visibleViewportRef.current, parentScrollRef.current);
@@ -18301,17 +18209,13 @@ function OhhwellsBridge() {
       window.removeEventListener("resize", handleViewportResize);
       window.removeEventListener("message", handlePointerSync);
       window.removeEventListener("message", handleClickAt);
-      window.removeEventListener("message", handleUpdateLogoIdentity);
-      window.removeEventListener("message", handleViewMode);
       window.removeEventListener("message", handleHydrate);
       window.removeEventListener("message", handleAiApplyTree);
       window.removeEventListener("message", handleAiDeleteSection);
       window.removeEventListener("message", handleAiSetSections);
-      window.removeEventListener("message", handleAiSetBrand);
-      window.removeEventListener("message", handleAiSetStyles);
-      window.removeEventListener("message", handleGetBrand);
       window.removeEventListener("message", handleDeactivate);
       window.removeEventListener("message", handleToastAction);
+      window.removeEventListener("message", handleFormCount);
       window.removeEventListener("message", handleUiEscape);
       autoSaveTimers.current.forEach(clearTimeout);
       autoSaveTimers.current.clear();
@@ -18335,7 +18239,9 @@ function OhhwellsBridge() {
       if (footerDragRef.current) return;
       const target = e.target;
       if (!target) return;
-      if (target.closest('[data-ohw-drag-handle-container], [data-slot="drag-handle"], [data-ohw-toolbar], [data-ohw-item-toolbar-anchor], [data-ohw-link-popover-root], [data-ohw-floating-panel]')) {
+      if (target.closest(
+        '[data-ohw-drag-handle-container], [data-slot="drag-handle"], [data-ohw-toolbar], [data-ohw-item-toolbar-anchor], [data-ohw-link-popover-root], [data-ohw-floating-panel], [data-ohw-field-toolbar], [data-ohw-field-type-picker], [data-radix-popper-content-wrapper], [role="menu"]'
+      )) {
         return;
       }
       if (target.closest("[data-ohw-item-drag-surface]")) return;
@@ -18513,7 +18419,7 @@ function OhhwellsBridge() {
       postToParent2({
         type: "ow:ready",
         version: "1",
-        bridgeVersion: "0.1.64",
+        bridgeVersion: "0.1.63",
         path: pathname,
         nodes: collectEditableNodes(editContentRef.current),
         sections
@@ -18980,6 +18886,151 @@ function OhhwellsBridge() {
       hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */ jsx33(ItemInteractionLayer, { rect: hoveredNavContainerRect, state: "hover" }),
       hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ jsx33(ItemInteractionLayer, { rect: hoveredItemRect, state: "hover" }),
       hoveredTextRect && !isItemDragging && toolbarVariant !== "rich-text" && /* @__PURE__ */ jsx33(ItemInteractionLayer, { rect: hoveredTextRect, state: "hover" }),
+      formPickRect && !isItemDragging && /* @__PURE__ */ jsx33(
+        ItemInteractionLayer,
+        {
+          rect: formPickRect,
+          state: "active-top",
+          itemDragSurface: false,
+          toolbarAlign: "left",
+          chromeGap: 24,
+          toolbar: fieldPickRect ? void 0 : /* @__PURE__ */ jsxs20(
+            "div",
+            {
+              "data-ohw-form-toolbar": "",
+              className: "pointer-events-auto flex items-center gap-0.5 whitespace-nowrap rounded-lg border border-border bg-background p-1 shadow-md",
+              children: [
+                /* @__PURE__ */ jsx33(
+                  "button",
+                  {
+                    type: "button",
+                    "aria-label": "Add field",
+                    className: "flex h-7 w-7 items-center justify-center rounded-md text-foreground transition-colors hover:bg-muted/80",
+                    onClick: () => setFieldTypePickerOpen((open) => !open),
+                    "data-ohw-add-field": "",
+                    children: /* @__PURE__ */ jsx33(Plus4, { size: 15, "aria-hidden": true })
+                  }
+                ),
+                /* @__PURE__ */ jsx33("div", { className: "mx-0.5 h-5 w-px bg-border" }),
+                /* @__PURE__ */ jsxs20(
+                  "button",
+                  {
+                    type: "button",
+                    className: "flex h-7 items-center gap-1.5 whitespace-nowrap rounded-md px-2 text-[13px] font-semibold text-foreground transition-colors hover:bg-muted/80",
+                    onClick: () => {
+                      const form = formPickElRef.current;
+                      if (!form) return;
+                      postToParent2({
+                        type: "ow:form-pick",
+                        formKey: formKeyOf(form),
+                        hasLongText: formHasLongText(form)
+                      });
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx33(Settings, { size: 14, "aria-hidden": true }),
+                      "Form settings",
+                      formPickCount ? (
+                        // Counter pill, per the design — not a text suffix.
+                        /* @__PURE__ */ jsx33(
+                          "span",
+                          {
+                            "data-ohw-form-count": "",
+                            className: "ml-0.5 inline-flex h-[18px] min-w-[18px] items-center justify-center rounded-full bg-primary px-1.5 text-[11px] font-semibold text-primary-foreground",
+                            children: formPickCount
+                          }
+                        )
+                      ) : null
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx33("div", { className: "mx-0.5 h-5 w-px bg-border" }),
+                /* @__PURE__ */ jsx33("div", { className: "flex items-center rounded-md bg-muted/70 p-0.5", children: ["default", "success"].map((state) => /* @__PURE__ */ jsx33(
+                  "button",
+                  {
+                    type: "button",
+                    "aria-pressed": formViewState === state,
+                    className: "rounded-md px-2.5 py-1 text-[13px] font-semibold capitalize transition-colors " + (formViewState === state ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"),
+                    onClick: () => {
+                      const form = formPickElRef.current;
+                      const key = form ? formKeyOf(form) : null;
+                      if (!form || !key) return;
+                      const initial = successInitialFor(form, key, editContentRef.current);
+                      setFormViewState(form, key, state, initial);
+                      setFormViewStateUi(state);
+                      setFormPickRect(form.getBoundingClientRect());
+                      if (state === "success") {
+                        const successEl = form.querySelector(`[${SUCCESS_TEXT_ATTR}]`);
+                        if (successEl) requestAnimationFrame(() => activateRef.current(successEl));
+                      } else {
+                        deactivateRef.current();
+                      }
+                    },
+                    children: state
+                  },
+                  state
+                )) })
+              ]
+            }
+          )
+        }
+      ),
+      formHoverRect && !isItemDragging && /* @__PURE__ */ jsx33(
+        ItemInteractionLayer,
+        {
+          rect: formHoverRect,
+          state: "hover",
+          chromeGap: formHoverElRef.current && getFieldWrapper(formHoverElRef.current) ? 8 : 24
+        }
+      ),
+      fieldPickRect && fieldPickState && !isItemDragging && toolbarVariant !== "rich-text" && /* @__PURE__ */ jsx33(
+        ItemInteractionLayer,
+        {
+          rect: fieldPickRect,
+          state: fieldDragging ? "dragging" : "active-top",
+          itemDragSurface: false,
+          toolbarAlign: "left",
+          chromeGap: 10,
+          showHandle: true,
+          dragHandleLabel: "Reorder field",
+          onDragHandleDragStart: handleFieldDragStart,
+          onDragHandleDragEnd: handleFieldDragEnd,
+          toolbar: /* @__PURE__ */ jsx33(
+            FormFieldToolbar,
+            {
+              type: fieldPickState.type,
+              required: fieldPickState.required,
+              onTypeChange: handleFieldTypeChange,
+              onRequiredToggle: handleFieldRequiredToggle,
+              onDuplicate: handleFieldDuplicate,
+              onDelete: handleFieldDelete
+            }
+          )
+        }
+      ),
+      fieldDragging ? fieldDropSlots.map((slot, i) => /* @__PURE__ */ jsx33(
+        "div",
+        {
+          className: "pointer-events-none fixed z-[2147483644]",
+          style: { top: slot.top, left: slot.left, width: slot.width },
+          children: /* @__PURE__ */ jsx33(
+            DropIndicator,
+            {
+              direction: "horizontal",
+              state: fieldDropIndex === i ? "dragActive" : "dragIdle",
+              className: "!w-full"
+            }
+          )
+        },
+        `field-drop-${i}`
+      )) : null,
+      fieldTypePickerOpen && formPickRect && /* @__PURE__ */ jsx33(
+        "div",
+        {
+          className: "pointer-events-none fixed z-[2147483645]",
+          style: { top: formPickRect.top + 16, left: formPickRect.left + 24 },
+          children: /* @__PURE__ */ jsx33(FieldTypePicker, { onPick: handleAddField })
+        }
+      ),
       toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */ jsx33(NavbarContainerChrome, { rect: toolbarRect, onAdd: handleAddTopLevelNavItem }),
       toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */ jsx33(
         FooterContainerChrome,
@@ -18989,7 +19040,7 @@ function OhhwellsBridge() {
           addDisabled: !canAddFooterColumn()
         }
       ),
-      toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame" || toolbarVariant === "logo") && /* @__PURE__ */ jsx33(
+      toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ jsx33(
         ItemInteractionLayer,
         {
           rect: isItemDragging && draggedItemRect && (footerDragRef.current?.wasSelected || navDragRef.current?.wasSelected) ? draggedItemRect : toolbarRect,
@@ -19001,9 +19052,9 @@ function OhhwellsBridge() {
           dragHandleLabel: reorderHrefKey ? `Reorder ${reorderHrefKey}` : "Reorder item",
           onDragHandleDragStart: handleItemDragStart,
           onDragHandleDragEnd: handleItemDragEnd,
-          onItemPointerDown: toolbarVariant === "logo" ? void 0 : handleItemChromePointerDown,
-          onItemClick: toolbarVariant === "logo" ? void 0 : handleItemChromeClick,
-          itemDragSurface: toolbarVariant !== "logo" && !isFooterFrameSelection,
+          onItemPointerDown: handleItemChromePointerDown,
+          onItemClick: handleItemChromeClick,
+          itemDragSurface: !isFooterFrameSelection,
           toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && (isFooterFrameSelection || selectedIsSocialsRow) && !isItemDragging ? /* @__PURE__ */ jsx33(
             ItemActionToolbar,
             {
@@ -19166,115 +19217,11 @@ function OhhwellsBridge() {
             }
           )
         }
-      ) : null,
-      floatingPanel && floatingPanel.kind === "logo-size" && logoSizeDraft ? /* @__PURE__ */ jsx33(
-        FloatingPanel,
-        {
-          open: true,
-          title: floatingPanel.title,
-          context: floatingPanel.context,
-          position: floatingPanelPos,
-          onPositionChange: setFloatingPanelPos,
-          parentScroll: parentScrollSnap ?? parentScrollRef.current,
-          onClose: closeFloatingPanelAndDeselect,
-          children: /* @__PURE__ */ jsx33(
-            LogoSizePanel,
-            {
-              viewport: editorViewport,
-              sizePx: editorViewport === "mobile" && !logoSizeDraft.mobileFollowing ? logoSizeDraft.mobilePx : logoSizeDraft.desktopPx,
-              mobileFollowing: logoSizeDraft.mobileFollowing,
-              onSizeChange: (px) => {
-                const next = editorViewport === "mobile" ? { ...logoSizeDraft, mobilePx: px, mobileFollowing: false } : {
-                  ...logoSizeDraft,
-                  desktopPx: px,
-                  mobilePx: logoSizeDraft.mobileFollowing ? px : logoSizeDraft.mobilePx
-                };
-                setLogoSizeDraft(next);
-                persistLogoSizeDraft(floatingPanel.placement, next);
-              },
-              onCustomizeMobile: () => {
-                const next = {
-                  ...logoSizeDraft,
-                  mobileFollowing: false,
-                  mobilePx: logoSizeDraft.desktopPx
-                };
-                setLogoSizeDraft(next);
-                persistLogoSizeDraft(floatingPanel.placement, next);
-              },
-              onResetMobile: () => {
-                const next = {
-                  ...logoSizeDraft,
-                  mobileFollowing: true,
-                  mobilePx: logoSizeDraft.desktopPx
-                };
-                setLogoSizeDraft(next);
-                persistLogoSizeDraft(floatingPanel.placement, next);
-              },
-              onUpdateEverywhere: () => {
-                const identity = readLogoIdentityFromDom();
-                postToParent2({ type: "ow:open-logo-settings", ...identity });
-              }
-            }
-          )
-        }
       ) : null
     ] }),
     bridgeRoot
   ) : null;
 }
-
-// src/ui/EmptySection.tsx
-import Link4 from "next/link";
-import { Fragment as Fragment9, jsx as jsx34, jsxs as jsxs21 } from "react/jsx-runtime";
-function EmptySection({ title, homeHref = "/", eyebrowKey, titleKey, subtitleKey }) {
-  return /* @__PURE__ */ jsxs21(Fragment9, { children: [
-    /* @__PURE__ */ jsx34(
-      "p",
-      {
-        style: {
-          fontFamily: "var(--brand-font-body)",
-          fontSize: "0.75rem",
-          fontWeight: 500,
-          letterSpacing: "0.15em",
-          textTransform: "uppercase",
-          color: "var(--brand-accent)",
-          marginBottom: "1.5rem"
-        },
-        children: /* @__PURE__ */ jsx34(Link4, { href: homeHref, style: { color: "inherit" }, children: /* @__PURE__ */ jsx34("span", { ...eyebrowKey ? { "data-ohw-editable": "text", "data-ohw-key": eyebrowKey } : {}, children: "Home" }) })
-      }
-    ),
-    /* @__PURE__ */ jsx34(
-      "h1",
-      {
-        style: {
-          fontFamily: "var(--brand-font-heading)",
-          fontSize: "clamp(2rem, 3.5vw, 2.75rem)",
-          lineHeight: 1.1,
-          letterSpacing: "-0.025em",
-          color: "var(--brand-text)",
-          marginBottom: "1rem"
-        },
-        ...titleKey ? { "data-ohw-editable": "text", "data-ohw-key": titleKey, "data-ohw-max-length": 80 } : {},
-        children: title
-      }
-    ),
-    /* @__PURE__ */ jsx34(
-      "p",
-      {
-        style: {
-          fontFamily: "var(--brand-font-body)",
-          fontSize: "1rem",
-          lineHeight: 1.7,
-          fontWeight: 300,
-          color: "var(--brand-text-muted)",
-          maxWidth: "340px"
-        },
-        ...subtitleKey ? { "data-ohw-editable": "text", "data-ohw-key": subtitleKey, "data-ohw-max-length": 160 } : {},
-        children: "This page doesn't have any content yet."
-      }
-    )
-  ] });
-}
 export {
   AI_DEFAULT_BRAND,
   AI_TREE_SCHEMA_VERSIONS,
@@ -19291,7 +19238,6 @@ export {
   DropdownMenuItem,
   DropdownMenuSeparator,
   DropdownMenuTrigger,
-  EmptySection,
   ItemActionToolbar,
   ItemInteractionLayer,
   LinkEditorPanel,