@ohhwells/bridge 0.1.57 → 0.1.59-next.170

package/dist/index.cjs

@@ -46,6 +46,7 @@ __export(index_exports, {
   DropdownMenuItem: () => DropdownMenuItem,
   DropdownMenuSeparator: () => DropdownMenuSeparator,
   DropdownMenuTrigger: () => DropdownMenuTrigger,
+  EmptySection: () => EmptySection,
   ItemActionToolbar: () => ItemActionToolbar,
   ItemInteractionLayer: () => ItemInteractionLayer,
   LinkEditorPanel: () => LinkEditorPanel,
@@ -191,6 +192,129 @@ 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"], body: ["--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/ui/ai-tree/aiSectionsManager.tsx
 var import_react_dom = require("react-dom");
 var import_client = require("react-dom/client");
@@ -223,6 +347,17 @@ var FEATURE_LINE_CSS = [
 function textAttrs(ctx, path) {
   return ctx.keyFor ? { "data-ohw-key": ctx.keyFor(path), "data-ohw-editable": "text" } : {};
 }
+var AI_RESPONSIVE_CSS = [
+  "@media (max-width: 960px) {",
+  "  [data-ai-responsive] [data-ai-grid] { grid-template-columns: repeat(2, 1fr) !important; }",
+  '  [data-ai-responsive] [data-ai-grid="1"] { grid-template-columns: 1fr !important; }',
+  "}",
+  "@media (max-width: 640px) {",
+  "  [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; }",
+  "}"
+].join("\n");
 var TRANSPARENT_PX = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
 function MediaBox({
   refValue,
@@ -965,6 +1100,7 @@ function Carousel({ items, itemsPerRow, ctx }) {
           children: pageGroups.map((group, p) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
             "div",
             {
+              "data-ai-grid": String(itemsPerRow),
               style: {
                 flex: "0 0 100%",
                 display: "grid",
@@ -1068,6 +1204,7 @@ function CollectionBlock({ node, ctx, path }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "div",
     {
+      "data-ai-grid": String(itemsPerRow),
       style: {
         display: "grid",
         gridTemplateColumns: `repeat(${itemsPerRow}, 1fr)`,
@@ -1231,6 +1368,7 @@ function AiTreeRenderer({ tree, brand, resolveMedia, editKeyPrefix }) {
     {
       "data-ai-section": tree.tag ?? "",
       ...bgAttrs,
+      "data-ai-responsive": "",
       style: {
         position: "relative",
         padding: `${pad}px 0`,
@@ -1240,10 +1378,12 @@ function AiTreeRenderer({ tree, brand, resolveMedia, editKeyPrefix }) {
         backgroundPosition: "center"
       },
       children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("style", { children: AI_RESPONSIVE_CSS }),
         isOverlay && backgroundUrl && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { position: "absolute", inset: 0, background: `rgba(255,255,255,${overlayAlpha})` } }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           "div",
           {
+            "data-ai-section-inner": "",
             style: {
               position: "relative",
               maxWidth: AI_TREE_TOKENS.sectionMaxWidth,
@@ -1254,6 +1394,7 @@ function AiTreeRenderer({ tree, brand, resolveMedia, editKeyPrefix }) {
             children: tree.rows.map((row, r2) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
               "div",
               {
+                "data-ai-columns": "",
                 style: {
                   display: "grid",
                   gridTemplateColumns: "repeat(12, 1fr)",
@@ -1277,17 +1418,34 @@ var import_jsx_runtime2 = require("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() {
-  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");
+  const dark = readRootVar("--color-dark");
+  const primary = readRootVar("--color-primary");
+  const light = readRootVar("--color-light");
   if (!dark || !primary || !light) return null;
-  const accent = read("--color-accent");
-  const heading = read("--font-heading") || read("--font-display");
-  const body = read("--font-body");
+  const accent = readRootVar("--color-accent");
+  const heading = readRootVar("--font-heading") || readRootVar("--font-display");
+  const body = readRootVar("--font-body");
   return {
     palette: { dark, primary, accent: accent || dark, light },
     fonts: {
@@ -1379,7 +1537,9 @@ 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 activeIds = new Set(state.sections.map((entry) => entry.id));
   for (const [id, section] of mounted) {
     if (!activeIds.has(id)) {
@@ -1389,7 +1549,7 @@ function applyAiSectionsToDom(state, options) {
     }
   }
   for (const entry of state.sections) {
-    const serialized = JSON.stringify(entry);
+    const serialized = JSON.stringify(entry) + brandKey;
     const existing = mounted.get(entry.id);
     if (existing && existing.serialized === serialized && existing.container.isConnected) {
       continue;
@@ -1403,6 +1563,7 @@ 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 ?? (0, import_client.createRoot)(container);
@@ -1413,7 +1574,7 @@ function applyAiSectionsToDom(state, options) {
           AiTreeRenderer,
           {
             tree: entry.tree,
-            brand: entry.brand ?? options?.brand ?? templateBrand ?? void 0,
+            brand: brandOverride ?? entry.brand ?? options?.brand ?? templateBrand ?? void 0,
             resolveMedia,
             editKeyPrefix: `ai.${entry.id}`
           }
@@ -2030,7 +2191,7 @@ function SchedulingWidget({ notifyOnConnect = false, initialScheduleId, insertAf
   const autoId = (0, import_react5.useId)();
   const insertAfter = insertAfterProp ?? autoId;
   const [schedule, setSchedule] = (0, import_react5.useState)(null);
-  const [loading, setLoading] = (0, import_react5.useState)(true);
+  const [loading, setLoading] = (0, import_react5.useState)(initialScheduleId !== null);
   const [inEditor, setInEditor] = (0, import_react5.useState)(false);
   const [isHovered, setIsHovered] = (0, import_react5.useState)(false);
   const [modalState, setModalState] = (0, import_react5.useState)(null);
@@ -2204,8 +2365,10 @@ function SchedulingWidget({ notifyOnConnect = false, initialScheduleId, insertAf
       "*"
     );
   };
-  if (!inEditor && !loading && !schedule) return null;
   const sectionId = `scheduling-${insertAfter}`;
+  if (!inEditor && !loading && !schedule) {
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("section", { "data-ohw-section": sectionId, "data-ohw-scheduling-anchor": insertAfter, style: { display: "none" } });
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
     "section",
     {
@@ -6159,6 +6322,7 @@ var FOCUS_RING = `0 0 0 4px color-mix(in srgb, ${PRIMARY} 12%, transparent)`;
 var DRAG_SHADOW = "0px 4px 6px -1px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.1)";
 var TOOLBAR_EDGE_MARGIN = 4;
 var SELECTION_CHROME_GAP = 4;
+var HOVER_CHROME_GAP = 2;
 var TOOLBAR_STROKE_GAP = 4;
 function getChromeZIndex(state) {
   switch (state) {
@@ -6314,10 +6478,11 @@ function ItemInteractionLayer({
   onItemPointerDown,
   onItemClick,
   itemDragSurface = true,
-  chromeGap = SELECTION_CHROME_GAP,
+  chromeGap,
   className
 }) {
   if (state === "default") return null;
+  const gap = chromeGap ?? (state === "hover" ? HOVER_CHROME_GAP : SELECTION_CHROME_GAP);
   const isActive = state === "active-top" || state === "active-bottom";
   const isDragging = state === "dragging";
   const showToolbar = isActive && toolbar;
@@ -6333,10 +6498,10 @@ function ItemInteractionLayer({
       className: cn("pointer-events-none", className),
       style: {
         position: "fixed",
-        top: rect.top - chromeGap,
-        left: rect.left - chromeGap,
-        width: rect.width + chromeGap * 2,
-        height: rect.height + chromeGap * 2,
+        top: rect.top - gap,
+        left: rect.left - gap,
+        width: rect.width + gap * 2,
+        height: rect.height + gap * 2,
         zIndex: getChromeZIndex(state)
       },
       children: [
@@ -6722,8 +6887,12 @@ function parseSectionsFromHtml(html) {
 
 // src/ui/ai-section/AiSectionOverlay.tsx
 var import_jsx_runtime16 = require("react/jsx-runtime");
-function readRect(sectionId) {
-  const el = document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`);
+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);
   if (!el) return null;
   const r2 = el.getBoundingClientRect();
   if (r2.width <= 0 || r2.height <= 0) return null;
@@ -6746,7 +6915,7 @@ function useLiveSectionRect(sectionId) {
     const opts = { capture: true, passive: true };
     window.addEventListener("scroll", update, opts);
     window.addEventListener("resize", update);
-    const el = document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`);
+    const el = findSectionElement(sectionId);
     const ro = el ? new ResizeObserver(update) : null;
     if (el && ro) ro.observe(el);
     const interval = setInterval(update, 500);
@@ -6759,6 +6928,14 @@ 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;
@@ -6840,7 +7017,7 @@ function AiSectionOverlay({
     (el) => {
       postToParent2({
         type: "ow:section-selected",
-        sectionId: el?.dataset.ohwSection ?? null,
+        sectionId: el ? el.dataset.ohwInstance ?? el.dataset.ohwSection ?? null : null,
         sectionLabel: el ? el.dataset.ohwSectionLabel ?? titleCaseSectionId(el.dataset.ohwSection ?? "") : null
       });
     },
@@ -6849,7 +7026,7 @@ function AiSectionOverlay({
   const selectFromElement = (0, import_react8.useCallback)(
     (el, options) => {
       const sectionEl = el?.closest("[data-ohw-section]") ?? null;
-      const id = sectionEl?.dataset.ohwSection ?? null;
+      const id = sectionEl ? sectionEl.dataset.ohwInstance ?? sectionEl.dataset.ohwSection ?? null : null;
       if (id === selectedIdRef.current) return;
       setSelectedId(id);
       if (options?.report !== false) report(sectionEl);
@@ -6892,7 +7069,7 @@ function AiSectionOverlay({
         setReviewId(found ? sectionId : null);
         postToParent2({ type: "ow:ai-review-started", sectionId, found });
         if (found) {
-          document.querySelector(`[data-ohw-section="${CSS.escape(sectionId)}"]`)?.scrollIntoView({ behavior: "smooth", block: "nearest" });
+          document.querySelector(`[data-ohw-instance="${CSS.escape(sectionId)}"]`)?.scrollIntoView({ behavior: "smooth", block: "nearest" });
         }
       }
     };
@@ -6911,7 +7088,7 @@ function AiSectionOverlay({
         return;
       }
       const sec = t.closest("[data-ohw-section]");
-      setHoveredId(sec?.dataset.ohwSection ?? null);
+      setHoveredId(sec ? sec.dataset.ohwInstance ?? sec.dataset.ohwSection ?? null : null);
     };
     const onLeave = () => setHoveredId(null);
     document.addEventListener("mousemove", onMove, { passive: true });
@@ -6943,9 +7120,29 @@ function AiSectionOverlay({
     },
     [postToParent2]
   );
-  const selectionRect = useLiveSectionRect(reviewId ? null : selectedId);
+  const activeSelectionId = reviewId ? null : selectedId;
+  const selectionRect = useLiveSectionRect(activeSelectionId);
   const reviewRect = useLiveSectionRect(reviewId);
   const hoverRect = useLiveSectionRect(reviewId || hoveredId === selectedId ? null : hoveredId);
+  (0, import_react8.useEffect)(() => {
+    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__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
     hoverRect && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       "div",
@@ -6996,7 +7193,10 @@ function AiSectionOverlay({
           border: `2px solid ${PRIMARY2}`,
           borderRadius: edgeAwareRadius(reviewRect),
           zIndex: 2147483200,
-          // The veil itself: swallows clicks so the section stays locked until decided.
+          // 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.
           background: "rgba(8, 133, 254, 0.04)",
           pointerEvents: "auto",
           cursor: "default"
@@ -7108,7 +7308,14 @@ function findClosestButtonLike(target) {
 function findButtonAtPoint(x, y, media) {
   const hits = Array.from(
     document.querySelectorAll(BUTTON_LIKE_SELECTOR)
-  ).filter((el) => containsPoint(el, x, y) && !(media && el.contains(media)));
+  ).filter(
+    (el) => containsPoint(el, x, y) && !(media && el.contains(media)) && // Bridge-injected chrome (e.g. MediaOverlay's own "Replace image" button) is never a
+    // site button. Without this, once the media overlay renders its button lands right
+    // under the cursor, gets detected as "a button on the media", and dismisses the very
+    // overlay it belongs to — which removes the button, so the next hit-test finds nothing
+    // and the overlay reappears. Flip-flops every tick: the "Replace image" button flashes.
+    !el.closest("[data-ohw-bridge]")
+  );
   if (hits.length === 0) return null;
   return hits.reduce((best, el) => best.contains(el) ? el : best);
 }
@@ -9683,6 +9890,10 @@ function isSocialsRow(el) {
   const anchors = Array.from(el.querySelectorAll("a"));
   return anchors.length > 0 && anchors.every((anchor) => isSocialItem(anchor));
 }
+var MAX_SOCIAL_ITEMS_PER_ROW = 7;
+function canAddSocialItem(row) {
+  return listSocialItems(row).length < MAX_SOCIAL_ITEMS_PER_ROW;
+}
 function listSocialItems(row) {
   return Array.from(row.children).map((child) => {
     if (!(child instanceof HTMLElement)) return null;
@@ -10042,6 +10253,7 @@ function ensureIconSlot(item) {
 // src/lib/footer-items.ts
 var FOOTER_ORDER_KEY = "__ohw_footer_order";
 var MAX_FOOTER_COLUMNS = 18;
+var MAX_FOOTER_ITEMS_PER_COLUMN = 7;
 var FOOTER_HREF_RE = /^footer-(\d+)-(\d+)-href$/;
 function parseFooterHrefKey(key) {
   if (!key) return null;
@@ -10259,6 +10471,13 @@ function getNextFooterColumnIndex() {
 function canAddFooterColumn() {
   return listFooterColumns().length < MAX_FOOTER_COLUMNS;
 }
+function canAddFooterItem(column) {
+  return listFooterLinksInColumn(column).length < MAX_FOOTER_ITEMS_PER_COLUMN;
+}
+function resolveFooterColumnForAdd(selected) {
+  if (selected.hasAttribute("data-ohw-footer-col")) return selected;
+  return selected.closest("[data-ohw-footer-col]") ?? (listFooterColumns().includes(selected) ? selected : null);
+}
 function buildFooterHeading(colIndex, text) {
   const heading = document.createElement("p");
   heading.setAttribute("data-ohw-editable", "text");
@@ -10883,6 +11102,329 @@ 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;
+    });
+  }
+  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);
+  });
+}
+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 };
+}
+
+// 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");
+  if (anchor && root.contains(anchor) && !anchor.hasAttribute("data-ohw-href-key") && !anchor.closest("[data-ohw-nav-container]") && Boolean(anchor.querySelector("img") || anchor.matches("img"))) {
+    return anchor;
+  }
+  const img = el.matches("img") ? el : null;
+  if (img && !img.closest("[data-ohw-href-key]") && !img.closest("[data-ohw-nav-container]") && (img.closest("footer") || img.closest("nav, [data-ohw-nav-root]"))) {
+    return img;
+  }
+  return null;
+}
+function isInFooter(el) {
+  if (!el) return false;
+  return Boolean(el.closest("footer") || el.closest('[data-ohw-section="footer"]'));
+}
+function isSiteWideElement(el) {
+  if (!el) return false;
+  if (getLogoElement(el)) return true;
+  if (isInFooter(el)) return true;
+  if (el.hasAttribute("data-ohw-nav-container") || el.hasAttribute("data-ohw-nav-root")) {
+    return true;
+  }
+  if (el.hasAttribute("data-ohw-href-key") && el.closest("nav, [data-ohw-nav-root], [data-ohw-nav-drawer], aside")) {
+    return true;
+  }
+  if (el.closest('[data-ohw-role="navbar-button"]')) return true;
+  return false;
+}
+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 {
@@ -10988,6 +11530,7 @@ function FloatingPanel({
       e.stopPropagation();
       const el = e.currentTarget;
       el.setPointerCapture(e.pointerId);
+      document.documentElement.setAttribute("data-ohw-panel-dragging", "");
       dragRef.current = {
         pointerId: e.pointerId,
         startX: e.clientX,
@@ -11020,11 +11563,17 @@ function FloatingPanel({
     const drag = dragRef.current;
     if (!drag || drag.pointerId !== e.pointerId) return;
     dragRef.current = null;
+    document.documentElement.removeAttribute("data-ohw-panel-dragging");
     try {
       e.currentTarget.releasePointerCapture(e.pointerId);
     } catch {
     }
   }, []);
+  (0, import_react13.useEffect)(() => {
+    if (open) return;
+    document.documentElement.removeAttribute("data-ohw-panel-dragging");
+  }, [open]);
+  (0, import_react13.useEffect)(() => () => document.documentElement.removeAttribute("data-ohw-panel-dragging"), []);
   if (!open) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
     "div",
@@ -11091,16 +11640,127 @@ function FloatingPanel({
   );
 }
 
-// src/ui/socials-display-panel.tsx
+// src/ui/logo-size-panel.tsx
+var import_lucide_react14 = require("lucide-react");
 var import_jsx_runtime27 = require("react/jsx-runtime");
+function SizeSlider({
+  value,
+  onChange
+}) {
+  const pct = (value - LOGO_SIZE_MIN) / (LOGO_SIZE_MAX - LOGO_SIZE_MIN) * 100;
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex w-full flex-col gap-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex w-full items-center gap-2 text-sm font-medium leading-5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "min-w-0 flex-1 text-foreground", children: "Size" }),
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("span", { className: "shrink-0 whitespace-nowrap text-muted-foreground", children: [
+        value,
+        " px"
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "relative h-2 w-full rounded-full bg-primary-50", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        "div",
+        {
+          className: "absolute inset-y-0 left-0 rounded-full bg-primary",
+          style: { width: `${pct}%` }
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        "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__ */ (0, import_jsx_runtime27.jsxs)("div", { className: cn("flex w-full flex-col gap-4", className), children: [
+    showFollowing ? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex w-full flex-col gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex items-start gap-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react14.Link, { size: 16, className: "mt-0.5 shrink-0 text-foreground", "aria-hidden": true }),
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("p", { className: "text-sm font-semibold leading-5 text-foreground", children: "Following desktop size" })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("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__ */ (0, import_jsx_runtime27.jsx)(
+        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__ */ (0, import_jsx_runtime27.jsx)(SizeSlider, { value: sizePx, onChange: onSizeChange }) : null,
+    showMobileSlider ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+      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__ */ (0, import_jsx_runtime27.jsx)("div", { className: "h-px w-full bg-border", role: "separator" }),
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+      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__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react14.ArrowUpRight, { size: 16, "aria-hidden": true })
+        ]
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("p", { className: "text-sm leading-5 text-muted-foreground", children: "Matches the right version to your background." })
+  ] });
+}
+
+// src/ui/socials-display-panel.tsx
+var import_jsx_runtime28 = require("react/jsx-runtime");
 function DisplaySwitch({
   label,
   checked,
   disabled,
   onChange
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex w-full items-center gap-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex w-full items-center gap-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       "span",
       {
         className: cn(
@@ -11110,7 +11770,7 @@ function DisplaySwitch({
         children: label
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       "button",
       {
         type: "button",
@@ -11124,7 +11784,7 @@ function DisplaySwitch({
           checked ? "bg-primary" : "bg-primary-50",
           disabled ? "cursor-default opacity-50" : "cursor-pointer"
         ),
-        children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
           "span",
           {
             className: cn(
@@ -11138,8 +11798,8 @@ function DisplaySwitch({
   ] });
 }
 function SocialsDisplayPanel({ display, onChange, className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: cn("flex w-full flex-col gap-3", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: cn("flex w-full flex-col gap-3", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       DisplaySwitch,
       {
         label: "Text",
@@ -11148,7 +11808,7 @@ function SocialsDisplayPanel({ display, onChange, className }) {
         onChange: (text) => onChange({ ...display, text })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       DisplaySwitch,
       {
         label: "Icon",
@@ -11708,8 +12368,8 @@ function useNavItemDrag({
 }
 
 // src/ui/footer-container-chrome.tsx
-var import_lucide_react14 = require("lucide-react");
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_lucide_react15 = require("lucide-react");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 function FooterContainerChrome({
   rect,
   onAdd,
@@ -11717,7 +12377,7 @@ function FooterContainerChrome({
 }) {
   const chromeGap = 6;
   const buttonMargin = 7;
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
     "div",
     {
       "data-ohw-footer-container-chrome": "",
@@ -11729,8 +12389,8 @@ function FooterContainerChrome({
         width: rect.width + chromeGap * 2,
         height: rect.height + chromeGap * 2
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(Tooltip, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Tooltip, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
           "button",
           {
             type: "button",
@@ -11749,10 +12409,10 @@ function FooterContainerChrome({
               if (addDisabled) return;
               onAdd();
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react14.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
+            children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react15.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(TooltipContent, { side: "bottom", sideOffset: 9, children: addDisabled ? "Maximum columns reached" : "Add item" })
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(TooltipContent, { side: "bottom", sideOffset: 9, children: addDisabled ? "Maximum columns reached" : "Add item" })
       ] })
     }
   ) });
@@ -11935,6 +12595,18 @@ 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());
 }
@@ -12200,14 +12872,14 @@ function deleteSelectedNavFooterItem(deps) {
 }
 
 // src/ui/navbar-container-chrome.tsx
-var import_lucide_react15 = require("lucide-react");
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_lucide_react16 = require("lucide-react");
+var import_jsx_runtime30 = require("react/jsx-runtime");
 function NavbarContainerChrome({
   rect,
   onAdd
 }) {
   const chromeGap = 6;
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
     "div",
     {
       "data-ohw-navbar-container-chrome": "",
@@ -12219,7 +12891,7 @@ function NavbarContainerChrome({
         width: rect.width + chromeGap * 2,
         height: rect.height + chromeGap * 2
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
         "button",
         {
           type: "button",
@@ -12236,7 +12908,7 @@ function NavbarContainerChrome({
             e.stopPropagation();
             onAdd();
           },
-          children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react15.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
+          children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react16.Plus, { className: "size-4 shrink-0 text-foreground", "aria-hidden": true })
         }
       )
     }
@@ -12245,7 +12917,7 @@ function NavbarContainerChrome({
 
 // src/ui/drop-indicator.tsx
 var React10 = __toESM(require("react"), 1);
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 var dropIndicatorVariants = cva(
   "ov-gap-line pointer-events-none shrink-0 transition-opacity duration-150",
   {
@@ -12269,7 +12941,7 @@ var dropIndicatorVariants = cva(
 );
 var DropIndicator = React10.forwardRef(
   ({ className, direction, state, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
       "div",
       {
         ref,
@@ -12286,7 +12958,7 @@ var DropIndicator = React10.forwardRef(
 DropIndicator.displayName = "DropIndicator";
 
 // src/ui/badge.tsx
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var badgeVariants = cva(
   "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
   {
@@ -12304,12 +12976,12 @@ var badgeVariants = cva(
   }
 );
 function Badge({ className, variant, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: cn(badgeVariants({ variant }), className), ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: cn(badgeVariants({ variant }), className), ...props });
 }
 
 // src/OhhwellsBridge.tsx
-var import_lucide_react16 = require("lucide-react");
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_lucide_react17 = require("lucide-react");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var PRIMARY3 = "#0885FE";
 var IMAGE_FADE_MS = 300;
 function runOpacityFade(el, onDone) {
@@ -12403,21 +13075,10 @@ function parseSchedulingInsertAfter(insertAfter) {
     insertBefore: insertAfter.slice(idx + INSERT_BEFORE_MARKER.length)
   };
 }
-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 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 schedulingMountDepth(insertAfter) {
   if (!insertAfter.includes(INSERT_BEFORE_MARKER)) return 0;
@@ -12434,8 +13095,7 @@ function getPageSchedulingEntries(raw) {
   }
 }
 function isSchedulingWidgetMissing(entry) {
-  const { effectiveInsertAfter } = resolveSchedulingInsert(entry.insertAfter);
-  return !document.querySelector(`[data-ohw-section="${schedulingSectionId(effectiveInsertAfter)}"]`);
+  return !document.querySelector(`[data-ohw-section="${schedulingSectionId(entry.insertAfter)}"]`);
 }
 function hasMissingSchedulingWidgets(entries) {
   return entries.some(isSchedulingWidgetMissing);
@@ -12465,16 +13125,17 @@ function initSectionsFromContent(content, removeExisting = false) {
   } catch {
   }
 }
-function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId, explicitInsertBefore) {
-  const { effectiveInsertAfter, insertBefore } = resolveSchedulingInsert(insertAfter, explicitInsertBefore);
-  const sectionId = schedulingSectionId(effectiveInsertAfter);
+function mountSchedulingWidget(anchorId, notifyOnConnect = false, scheduleId, beforeId, existingWidgetId) {
+  const widgetId = existingWidgetId ?? (beforeId ? `${anchorId}${INSERT_BEFORE_MARKER}${beforeId}` : anchorId);
+  const sectionId = schedulingSectionId(widgetId);
   if (document.querySelector(`[data-ohw-section="${sectionId}"]`)) return false;
-  const mountPoint = getSchedulingMountPoint(effectiveInsertAfter);
-  if (!mountPoint) 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 container = document.createElement("div");
   container.dataset.ohwSectionContainer = "scheduling";
-  if (insertBefore) {
-    const beforeAnchor = document.querySelector(`[data-ohw-section="${insertBefore}"]`);
+  if (beforeId) {
+    const beforeAnchor = document.querySelector(`[data-ohw-section="${beforeId}"]`);
     const beforePoint = beforeAnchor?.closest('[data-ohw-section-container="scheduling"]') ?? beforeAnchor;
     if (!beforePoint) return false;
     beforePoint.insertAdjacentElement("beforebegin", container);
@@ -12485,19 +13146,25 @@ function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId,
     }
     tail.insertAdjacentElement("afterend", container);
   }
-  const root = (0, import_client2.createRoot)(container);
-  (0, import_react_dom3.flushSync)(() => {
-    root.render(
-      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
-        SchedulingWidget,
-        {
-          notifyOnConnect,
-          initialScheduleId: scheduleId,
-          insertAfter: effectiveInsertAfter
-        }
-      )
-    );
-  });
+  try {
+    const root = (0, import_client2.createRoot)(container);
+    (0, import_react_dom3.flushSync)(() => {
+      root.render(
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+          SchedulingWidget,
+          {
+            notifyOnConnect,
+            initialScheduleId: scheduleId,
+            insertAfter: widgetId
+          }
+        )
+      );
+    });
+  } catch (err) {
+    console.error("[ow:scheduling] render threw", err);
+    container.remove();
+    return false;
+  }
   const tracker = getSectionsTracker();
   let sections = [];
   try {
@@ -12505,10 +13172,12 @@ function mountSchedulingWidget(insertAfter, notifyOnConnect = false, scheduleId,
   } catch {
   }
   const inEditor = typeof window !== "undefined" && window.self !== window.top;
-  if (inEditor && !sections.find((s) => s.type === "scheduling" && s.insertAfter === effectiveInsertAfter)) {
+  if (inEditor && !sections.find((s) => s.type === "scheduling" && s.insertAfter === widgetId)) {
     sections.push({
       type: "scheduling",
-      insertAfter: effectiveInsertAfter,
+      insertAfter: widgetId,
+      anchorId,
+      beforeId: beforeId ?? null,
       pagePath: window.location.pathname,
       ...scheduleId ? { scheduleId } : {}
     });
@@ -12522,7 +13191,8 @@ 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;
-      if (mountSchedulingWidget(entry.insertAfter, shouldNotify, entry.scheduleId)) {
+      const { anchorId, beforeId } = resolveEntryAnchor(entry);
+      if (mountSchedulingWidget(anchorId, shouldNotify, entry.scheduleId ?? null, beforeId, entry.insertAfter)) {
         pending.splice(i, 1);
       }
     }
@@ -12666,6 +13336,13 @@ 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]");
@@ -12803,6 +13480,11 @@ function isNavbarLinksContainer2(el) {
 function getFooterColumn(el) {
   return el.closest("[data-ohw-footer-col], [data-ohw-footer-column]");
 }
+function isFooterAddItemDisabled(selected) {
+  if (!selected) return false;
+  const column = resolveFooterColumnForAdd(selected);
+  return column ? !canAddFooterItem(column) : false;
+}
 function resolveFooterColumnSelectionTarget(target, clientX, clientY) {
   if (getNavigationItemAnchor(target)) return null;
   const column = getFooterColumn(target);
@@ -12898,7 +13580,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") || isFooterLinksContainer(el)) {
+  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)) {
     return getNavigationRoot(el);
   }
   return null;
@@ -13116,6 +13798,9 @@ var ICONS = {
 var SELECTION_CHROME_GAP2 = 4;
 var TOOLBAR_STROKE_GAP2 = 4;
 var TOOLBAR_OFFSET_FROM_ELEMENT = SELECTION_CHROME_GAP2 + TOOLBAR_STROKE_GAP2;
+var HOVER_STROKE_WIDTH = 1.5;
+var TEXT_HOVER_SIDE_PAD = 4;
+var CHROME_PRIMARY = `var(--ohw-primary, ${PRIMARY3})`;
 var TOOLBAR_GROUPS = [
   [
     { cmd: "bold", title: "Bold" },
@@ -13141,7 +13826,7 @@ function EditGlowChrome({
   hideHandle = false
 }) {
   const GAP = SELECTION_CHROME_GAP2;
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
     "div",
     {
       ref: elRef,
@@ -13156,7 +13841,7 @@ function EditGlowChrome({
         zIndex: 2147483646
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
           "div",
           {
             style: {
@@ -13169,7 +13854,7 @@ function EditGlowChrome({
             }
           }
         ),
-        reorderHrefKey && !hideHandle && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+        reorderHrefKey && !hideHandle && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
           "div",
           {
             "data-ohw-drag-handle-container": "",
@@ -13181,7 +13866,7 @@ function EditGlowChrome({
               transform: "translate(calc(-100% - 7px), -50%)",
               pointerEvents: dragDisabled ? "none" : "auto"
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
               DragHandle,
               {
                 "aria-label": `Reorder ${reorderHrefKey}`,
@@ -13391,7 +14076,7 @@ function FloatingToolbar({
     return () => ro.disconnect();
   }, [showEditLink, activeCommands]);
   const { top, left, transform } = calcToolbarPos(rect, parentScroll, measuredW);
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
     "div",
     {
       ref: setRefs,
@@ -13403,12 +14088,12 @@ function FloatingToolbar({
         zIndex: 2147483647,
         pointerEvents: "auto"
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(CustomToolbar, { children: [
-        TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react16.default.Fragment, { children: [
-          gi > 0 && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(CustomToolbarDivider, {}),
+      children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(CustomToolbar, { children: [
+        TOOLBAR_GROUPS.map((btns, gi) => /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react16.default.Fragment, { children: [
+          gi > 0 && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(CustomToolbarDivider, {}),
           btns.map((btn) => {
             const isActive = activeCommands.has(btn.cmd);
-            return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
               CustomToolbarButton,
               {
                 title: btn.title,
@@ -13417,7 +14102,7 @@ function FloatingToolbar({
                   e.preventDefault();
                   onCommand(btn.cmd);
                 },
-                children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+                children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
                   "svg",
                   {
                     width: "16",
@@ -13438,7 +14123,7 @@ function FloatingToolbar({
             );
           })
         ] }, gi)),
-        showEditLink ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+        showEditLink ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
           CustomToolbarButton,
           {
             type: "button",
@@ -13452,7 +14137,7 @@ function FloatingToolbar({
               e.preventDefault();
               e.stopPropagation();
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react16.Link, { className: "size-4 shrink-0", "aria-hidden": true })
+            children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_lucide_react17.Link, { className: "size-4 shrink-0", "aria-hidden": true })
           }
         ) : null
       ] })
@@ -13469,7 +14154,7 @@ function StateToggle({
   states,
   onStateChange
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
     ToggleGroup,
     {
       "data-ohw-state-toggle": "",
@@ -13483,11 +14168,12 @@ function StateToggle({
         left: rect.right - 8,
         transform: "translateX(-100%)"
       },
-      children: states.map((state) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ToggleGroupItem, { value: state, size: "sm", children: state }, state))
+      children: states.map((state) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ToggleGroupItem, { value: state, size: "sm", children: state }, state))
     }
   );
 }
 var contentCache = /* @__PURE__ */ new Map();
+var fetchedContentPaths = /* @__PURE__ */ new Set();
 function resolveSubdomain(subdomainFromQuery) {
   if (subdomainFromQuery) return subdomainFromQuery;
   if (typeof window !== "undefined") {
@@ -13582,8 +14268,14 @@ function OhhwellsBridge() {
   });
   const selectFrameRef = (0, import_react16.useRef)(() => {
   });
+  const selectLogoRef = (0, import_react16.useRef)(() => {
+  });
+  const openLogoSizePanelRef = (0, import_react16.useRef)(() => {
+  });
   const deselectRef = (0, import_react16.useRef)(() => {
   });
+  const closeFloatingPanelOnlyRef = (0, import_react16.useRef)(() => {
+  });
   const reselectNavigationItemRef = (0, import_react16.useRef)(() => {
   });
   const commitNavigationTextEditRef = (0, import_react16.useRef)(() => {
@@ -13616,15 +14308,34 @@ function OhhwellsBridge() {
   const [hoveredNavContainerRect, setHoveredNavContainerRect] = (0, import_react16.useState)(null);
   const hoveredItemElRef = (0, import_react16.useRef)(null);
   const [hoveredItemRect, setHoveredItemRect] = (0, import_react16.useState)(null);
+  const [hoveredTextRect, setHoveredTextRect] = (0, import_react16.useState)(null);
+  (0, import_react16.useEffect)(() => {
+    const sync = () => {
+      const el = document.querySelector(
+        "[data-ohw-hovered]:not([contenteditable]):not([data-ohw-href-key])"
+      );
+      const target = el && !el.closest("[data-ohw-href-key]") ? el : null;
+      if (!target) {
+        setHoveredTextRect(null);
+        return;
+      }
+      const r2 = target.getBoundingClientRect();
+      setHoveredTextRect(new DOMRect(r2.x - TEXT_HOVER_SIDE_PAD, r2.y, r2.width + TEXT_HOVER_SIDE_PAD * 2, r2.height));
+    };
+    const observer = new MutationObserver(sync);
+    observer.observe(document.documentElement, {
+      attributes: true,
+      attributeFilter: ["data-ohw-hovered"],
+      subtree: true
+    });
+    return () => observer.disconnect();
+  }, []);
   const siblingHintElRef = (0, import_react16.useRef)(null);
   const [siblingHintRect, setSiblingHintRect] = (0, import_react16.useState)(null);
   const [siblingHintRects, setSiblingHintRects] = (0, import_react16.useState)([]);
   const [isItemDragging, setIsItemDragging] = (0, import_react16.useState)(false);
   const [isFooterFrameSelection, setIsFooterFrameSelection] = (0, import_react16.useState)(false);
   isFooterFrameSelectionRef.current = isFooterFrameSelection;
-  const [floatingPanel, setFloatingPanel] = (0, import_react16.useState)(null);
-  const [floatingPanelPos, setFloatingPanelPos] = (0, import_react16.useState)(null);
-  const [parentScrollSnap, setParentScrollSnap] = (0, import_react16.useState)(null);
   const [navDropdownPreviewOpen, setNavDropdownPreviewOpen] = (0, import_react16.useState)(null);
   const [footerHeadingVisible, setFooterHeadingVisible] = (0, import_react16.useState)(null);
   const footerDragRef = (0, import_react16.useRef)(null);
@@ -13639,7 +14350,15 @@ function OhhwellsBridge() {
   const addNavAfterAnchorRef = (0, import_react16.useRef)(null);
   const editContentRef = (0, import_react16.useRef)({});
   const aiSectionsRef = (0, import_react16.useRef)("");
+  const brandKitRef = (0, import_react16.useRef)("");
   const pendingDeleteUndoRef = (0, import_react16.useRef)(null);
+  const [floatingPanel, setFloatingPanel] = (0, import_react16.useState)(null);
+  const floatingPanelOpenRef = (0, import_react16.useRef)(false);
+  const setFloatingPanelRef = (0, import_react16.useRef)(setFloatingPanel);
+  const [floatingPanelPos, setFloatingPanelPos] = (0, import_react16.useState)(null);
+  const [logoSizeDraft, setLogoSizeDraft] = (0, import_react16.useState)(null);
+  const [editorViewport, setEditorViewport] = (0, import_react16.useState)("desktop");
+  const [parentScrollSnap, setParentScrollSnap] = (0, import_react16.useState)(null);
   const [sitePages, setSitePages] = (0, import_react16.useState)([]);
   const [sectionsByPath, setSectionsByPath] = (0, import_react16.useState)({});
   const sectionsPrefetchGenRef = (0, import_react16.useRef)(0);
@@ -13648,7 +14367,18 @@ function OhhwellsBridge() {
   const linkPopoverOpenRef = (0, import_react16.useRef)(false);
   const linkPopoverGraceUntilRef = (0, import_react16.useRef)(0);
   setLinkPopoverRef.current = setLinkPopover;
+  setFloatingPanelRef.current = setFloatingPanel;
   linkPopoverSessionRef.current = linkPopover;
+  floatingPanelOpenRef.current = Boolean(floatingPanel);
+  (0, import_react16.useEffect)(() => {
+    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,
@@ -13871,6 +14601,10 @@ function OhhwellsBridge() {
     setIsItemDragging(false);
     hoveredNavContainerRef.current = null;
     setHoveredNavContainerRect(null);
+    hoveredItemElRef.current = null;
+    setHoveredItemRect(null);
+    setFloatingPanel(null);
+    setLogoSizeDraft(null);
     if (!activeElRef.current) {
       setNavGroupForceOpen(null, false);
       setToolbarRect(null);
@@ -14067,6 +14801,14 @@ function OhhwellsBridge() {
     if (!selected) return;
     const socialsRow = isSocialsRow(selected) ? selected : findSocialsRow(selected);
     if (socialsRow) {
+      if (!canAddSocialItem(socialsRow)) {
+        postToParent2({
+          type: "ow:toast",
+          title: `Maximum ${MAX_SOCIAL_ITEMS_PER_ROW} social icons`,
+          toastType: "error"
+        });
+        return;
+      }
       const after = getSocialItem(selected);
       const result2 = insertSocialItem(socialsRow, after, editContentRef.current);
       if (!result2) return;
@@ -14088,10 +14830,16 @@ function OhhwellsBridge() {
       return;
     }
     if (toolbarVariantRef.current === "select-frame" && isFooterFrameSelection) {
-      if (!selected.hasAttribute("data-ohw-footer-col") && !selected.closest("[data-ohw-footer-col]")) {
-      }
-      const column = (selected.hasAttribute("data-ohw-footer-col") ? selected : null) ?? selected.closest("[data-ohw-footer-col]") ?? (listFooterColumns().includes(selected) ? selected : null);
+      const column = resolveFooterColumnForAdd(selected);
       if (!column) return;
+      if (!canAddFooterItem(column)) {
+        postToParent2({
+          type: "ow:toast",
+          title: `Maximum ${MAX_FOOTER_ITEMS_PER_COLUMN} items per column`,
+          toastType: "error"
+        });
+        return;
+      }
       const result2 = insertFooterItem(column, "/", "New link", null);
       applyLinkByKey(result2.hrefKey, result2.href);
       document.querySelectorAll(`[data-ohw-key="${result2.labelKey}"]`).forEach((el) => {
@@ -14562,6 +15310,8 @@ function OhhwellsBridge() {
     setToolbarRect(anchor.getBoundingClientRect());
     setToolbarShowEditLink(false);
     setActiveCommands(/* @__PURE__ */ new Set());
+    setFloatingPanel(null);
+    setLogoSizeDraft(null);
   }, [deactivate, markSelected]);
   const selectFrame = (0, import_react16.useCallback)((el) => {
     if (!isNavigationContainer(el)) return;
@@ -14611,7 +15361,51 @@ function OhhwellsBridge() {
     setToolbarRect(el.getBoundingClientRect());
     setToolbarShowEditLink(false);
     setActiveCommands(/* @__PURE__ */ new Set());
+    setFloatingPanel(null);
+    setLogoSizeDraft(null);
   }, [deactivate, markSelected, postToParent2]);
+  const selectLogo = (0, import_react16.useCallback)(
+    (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 = (0, import_react16.useCallback)((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 = (0, import_react16.useCallback)((row) => {
     setParentScrollSnap(parentScrollRef.current);
     setFloatingPanel({
@@ -14647,11 +15441,53 @@ function OhhwellsBridge() {
   );
   const closeFloatingPanelOnly = (0, import_react16.useCallback)(() => {
     setFloatingPanel(null);
+    setLogoSizeDraft(null);
   }, []);
   const closeFloatingPanelAndDeselect = (0, import_react16.useCallback)(() => {
     setFloatingPanel(null);
+    setLogoSizeDraft(null);
     deselectRef.current();
   }, []);
+  const persistLogoSizeDraft = (0, import_react16.useCallback)(
+    (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 = (0, import_react16.useCallback)((el, options) => {
     if (activeElRef.current === el) return;
     if (isIconEditable(el)) return;
@@ -14732,7 +15568,37 @@ 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 = (0, import_react16.useRef)(null);
+  (0, import_react16.useEffect)(() => {
+    if (!isEditMode) {
+      if (lastSiteWideScopeRef.current !== false) {
+        lastSiteWideScopeRef.current = false;
+        postToParent2({ type: "ow:site-wide-scope", active: false });
+      }
+      return;
+    }
+    const active = isSiteWideScopeActive({
+      selected: selectedElRef.current,
+      hoveredItem: hoveredItemElRef.current,
+      hoveredNavContainer: hoveredNavContainerRef.current,
+      active: activeElRef.current
+    });
+    if (lastSiteWideScopeRef.current === active) return;
+    lastSiteWideScopeRef.current = active;
+    postToParent2({ type: "ow:site-wide-scope", active });
+  }, [
+    isEditMode,
+    hoveredItemRect,
+    hoveredNavContainerRect,
+    toolbarVariant,
+    toolbarRect,
+    isFooterFrameSelection,
+    postToParent2
+  ]);
   (0, import_react16.useLayoutEffect)(() => {
     if (!subdomain || isEditMode) {
       setFetchState("done");
@@ -14744,9 +15610,18 @@ 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]));
+      }
+      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 (BRAND_CHROME_KEYS.has(key)) continue;
         if (applyVideoSettingNode(key, val)) continue;
         if (applyCarouselNode(key, val)) continue;
         document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
@@ -14781,6 +15656,8 @@ function OhhwellsBridge() {
         });
         applyLinkByKey(key, val);
       }
+      applyLogoFromContent(content);
+      applyLogoSizes(content);
       reconcileNavbarItemsFromContent(content);
       reconcileFooterOrderFromContent(content);
       reconcileSocialsFromContent(content);
@@ -14801,7 +15678,9 @@ 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";
-    fetch(`${apiUrl}/api/public/sites/${subdomain}/content`, { cache: "no-store" }).then((r2) => r2.ok ? r2.json() : null).then((data) => {
+    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) => {
       if (cancelled) return;
       const content = data?.content ?? {};
       contentCache.set(subdomain, content);
@@ -14825,8 +15704,16 @@ 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]));
+        }
         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 (BRAND_CHROME_KEYS.has(key)) continue;
           if (applyVideoSettingNode(key, val)) continue;
           if (applyCarouselNode(key, val)) continue;
           document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
@@ -14847,6 +15734,7 @@ function OhhwellsBridge() {
           });
           applyLinkByKey(key, val);
         }
+        applyLogoFromContent(content);
         reconcileNavbarItemsFromContent(content);
         reconcileFooterOrderFromContent(content);
         reconcileSocialsFromContent(content);
@@ -14861,6 +15749,17 @@ 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 () => {
@@ -14954,26 +15853,31 @@ function OhhwellsBridge() {
   }, [isEditMode, pathname, subdomain, fetchState, resyncSelectedNavigationItem]);
   (0, import_react16.useEffect)(() => {
     if (!isEditMode) return;
+    let lastPosted = 0;
     const measure = () => {
       const h = document.body.scrollHeight;
-      if (h > 50) postToParent2({ type: "ow:height", height: h });
+      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();
+      });
     };
     const t1 = setTimeout(measure, 50);
     const t2 = setTimeout(measure, 500);
-    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);
+    const ro = new ResizeObserver(schedule);
+    ro.observe(document.body);
     return () => {
       clearTimeout(t1);
       clearTimeout(t2);
-      if (resizeTimer) clearTimeout(resizeTimer);
-      window.removeEventListener("resize", handleResize);
+      if (raf != null) cancelAnimationFrame(raf);
+      ro.disconnect();
     };
   }, [pathname, isEditMode, postToParent2]);
   (0, import_react16.useEffect)(() => {
@@ -15043,9 +15947,12 @@ 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; }
+      /* 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
+         and suppression rules key off it. */
       [data-ohw-hovered]:not([contenteditable]):not([data-ohw-href-key]) {
-        outline: 2px dashed ${PRIMARY3} !important;
-        outline-offset: 4px;
+        outline: none !important;
       }
       [data-ohw-href-key] [data-ohw-hovered],
       [data-ohw-href-key][data-ohw-hovered],
@@ -15098,8 +16005,11 @@ function OhhwellsBridge() {
       stateViews.textContent = `
         [data-ohw-state-view]:not([data-ohw-state-view="default"]) { display: none; }
         [data-ohw-state-view="default"] [data-ohw-editable] { pointer-events: auto !important; }
-        [data-ohw-state-hovered] { outline: 2px dashed ${PRIMARY3} !important; outline-offset: 4px; }
+        [data-ohw-state-hovered] { outline: ${HOVER_STROKE_WIDTH}px dashed ${CHROME_PRIMARY} !important; outline-offset: ${HOVER_CHROME_GAP}px; }
         [data-ohw-state-hovered]:has([data-ohw-hovered]) { outline: none !important; }
+        /* :has() only sees descendants \u2014 when the card itself is the hovered text, the overlay
+           already frames it, and the card outline doubled it (OHH-695). */
+        [data-ohw-state-hovered][data-ohw-hovered] { outline: none !important; }
       `;
       document.head.appendChild(base);
       document.head.appendChild(forceHover);
@@ -15117,10 +16027,12 @@ 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-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
@@ -15184,6 +16096,21 @@ function OhhwellsBridge() {
           return;
         }
       }
+      const logoEl = getLogoElement(target);
+      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);
+        return;
+      }
       const editable = target.closest("[data-ohw-editable]");
       if (editable) {
         if (editable.dataset.ohwEditable === "link") {
@@ -15336,10 +16263,12 @@ 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;
       }
@@ -15367,6 +16296,16 @@ function OhhwellsBridge() {
         setHoveredNavContainerRect(null);
         return;
       }
+      if (document.documentElement.hasAttribute("data-ohw-panel-dragging") || isInsideFloatingPanel(target) || isPointOverFloatingPanel(e.clientX, e.clientY)) {
+        hoveredItemElRef.current = null;
+        setHoveredItemRect(null);
+        hoveredNavContainerRef.current = null;
+        setHoveredNavContainerRect(null);
+        siblingHintElRef.current = null;
+        setSiblingHintRect(null);
+        setSiblingHintRects([]);
+        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)));
@@ -15374,7 +16313,7 @@ function OhhwellsBridge() {
         const allowFooterLinksHover = toolbarVariantRef.current !== "select-frame" || selectedIsFooterColumn;
         if (allowNavContainerHover) {
           const navContainer = target.closest("[data-ohw-nav-container]");
-          if (navContainer && !getNavigationItemAnchor(target)) {
+          if (navContainer && !getNavigationItemAnchor(target) && !getLogoElement(target)) {
             hoveredNavContainerRef.current = navContainer;
             setHoveredNavContainerRect(navContainer.getBoundingClientRect());
             hoveredItemElRef.current = null;
@@ -15403,6 +16342,15 @@ function OhhwellsBridge() {
           setHoveredNavContainerRect(null);
         }
       }
+      const logoEl = getLogoElement(target);
+      if (logoEl) {
+        hoveredNavContainerRef.current = null;
+        setHoveredNavContainerRect(null);
+        if (selectedElRef.current === logoEl) return;
+        hoveredItemElRef.current = logoEl;
+        setHoveredItemRect(getLogoInteractionRect(logoEl));
+        return;
+      }
       const navAnchor = getNavigationItemAnchor(target);
       if (navAnchor) {
         hoveredNavContainerRef.current = null;
@@ -15440,6 +16388,11 @@ function OhhwellsBridge() {
           setHoveredItemRect(hoverTarget.getBoundingClientRect());
         } else if (!isInsideNavigationItem(editable)) {
           hoverTarget.setAttribute("data-ohw-hovered", "");
+          if (editable.closest("footer") || editable.closest('[data-ohw-section="footer"]')) {
+            hoveredNavContainerRef.current = null;
+            setHoveredNavContainerRect(null);
+            hoveredItemElRef.current = editable;
+          }
         }
       }
     };
@@ -15475,6 +16428,18 @@ function OhhwellsBridge() {
         }
         return;
       }
+      const logoEl = getLogoElement(target);
+      if (logoEl) {
+        const related2 = e.relatedTarget instanceof Element ? e.relatedTarget : null;
+        if (related2 && (logoEl === related2 || logoEl.contains(related2) || related2.closest?.('[data-ohw-role="logo"], [data-ohw-logo]'))) {
+          return;
+        }
+        if (hoveredItemElRef.current === logoEl) {
+          hoveredItemElRef.current = null;
+          setHoveredItemRect(null);
+        }
+        return;
+      }
       const editable = target.closest("[data-ohw-editable]");
       if (!editable) return;
       const related = e.relatedTarget instanceof Element ? e.relatedTarget : null;
@@ -15495,6 +16460,13 @@ function OhhwellsBridge() {
           }
         } else {
           hoverTarget.removeAttribute("data-ohw-hovered");
+          if (hoveredItemElRef.current === editable) {
+            const stillOnEditable = related instanceof Element && related.closest("[data-ohw-editable]") === editable;
+            if (!stillOnEditable) {
+              hoveredItemElRef.current = null;
+              setHoveredItemRect(null);
+            }
+          }
         }
       }
     };
@@ -15611,6 +16583,26 @@ function OhhwellsBridge() {
         hoveredNavContainerRef.current = null;
         setHoveredNavContainerRect(null);
       }
+      const logoCandidates = [
+        ...document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]'),
+        ...document.querySelectorAll("nav a:not([data-ohw-href-key]), [data-ohw-nav-root] a:not([data-ohw-href-key])"),
+        ...document.querySelectorAll("footer img")
+      ];
+      const seenLogos = /* @__PURE__ */ new Set();
+      for (const candidate of logoCandidates) {
+        const logo = getLogoElement(candidate);
+        if (!logo || seenLogos.has(logo)) continue;
+        seenLogos.add(logo);
+        const r2 = logo.getBoundingClientRect();
+        if (x < r2.left || x > r2.right || y < r2.top || y > r2.bottom) continue;
+        hoveredNavContainerRef.current = null;
+        setHoveredNavContainerRect(null);
+        if (selectedElRef.current !== logo) {
+          hoveredItemElRef.current = logo;
+          setHoveredItemRect(getLogoInteractionRect(logo));
+        }
+        return;
+      }
       const navContainers = Array.from(
         document.querySelectorAll("[data-ohw-nav-container]")
       );
@@ -15696,7 +16688,7 @@ function OhhwellsBridge() {
       }
     };
     const probeImageAt = (clientX, clientY, isDragOver = false, fromParentViewport = false) => {
-      if (linkPopoverOpenRef.current) {
+      if (linkPopoverOpenRef.current || floatingPanelOpenRef.current && isPointOverFloatingPanel(clientX, clientY)) {
         if (hoveredImageRef.current) {
           hoveredImageRef.current = null;
           hoveredImageHasTextOverlapRef.current = false;
@@ -15950,7 +16942,7 @@ function OhhwellsBridge() {
       }
     };
     const probeHoverCardsAt = (clientX, clientY, fromParentViewport = false) => {
-      if (linkPopoverOpenRef.current || document.documentElement.hasAttribute("data-ohw-section-picking")) {
+      if (linkPopoverOpenRef.current || floatingPanelOpenRef.current && isPointOverFloatingPanel(clientX, clientY) || document.documentElement.hasAttribute("data-ohw-section-picking")) {
         if (activeStateElRef.current) {
           activeStateElRef.current.removeAttribute("data-ohw-state-hovered");
           activeStateElRef.current = null;
@@ -16018,6 +17010,19 @@ function OhhwellsBridge() {
     };
     const handleMouseMove = (e) => {
       const { clientX, clientY } = e;
+      if (document.documentElement.hasAttribute("data-ohw-panel-dragging") || floatingPanelOpenRef.current && isPointOverFloatingPanel(clientX, clientY)) {
+        hoveredItemElRef.current = null;
+        setHoveredItemRect(null);
+        hoveredNavContainerRef.current = null;
+        setHoveredNavContainerRect(null);
+        siblingHintElRef.current = null;
+        setSiblingHintRect(null);
+        setSiblingHintRects([]);
+        dismissImageHover();
+        clearImageHover();
+        setSectionGap(null);
+        return;
+      }
       probeSectionGapAt(clientX, clientY);
       probeImageAt(clientX, clientY);
       probeHoverCardsAt(clientX, clientY);
@@ -16026,6 +17031,11 @@ 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;
+      }
       probeSectionGapAt(clientX, clientY);
       probeImageAt(clientX, clientY);
       probeHoverCardsAt(clientX, clientY);
@@ -16275,6 +17285,11 @@ 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]));
+      }
+      applyBrandChrome(content);
       let sectionsJson = null;
       for (const [key, val] of Object.entries(content)) {
         if (key === "__ohw_sections") {
@@ -16282,6 +17297,10 @@ 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 (BRAND_CHROME_KEYS.has(key)) continue;
         if (applyVideoSettingNode(key, val)) continue;
         if (applyCarouselNode(key, val)) continue;
         document.querySelectorAll(`[data-ohw-key="${key}"]`).forEach((el) => {
@@ -16301,6 +17320,8 @@ function OhhwellsBridge() {
         });
         applyLinkByKey(key, val);
       }
+      applyLogoFromContent(content);
+      applyLogoSizes(content);
       if (sectionsJson) {
         initSectionsFromContent({ __ohw_sections: sectionsJson }, true);
         sectionsLoadedRef.current = true;
@@ -16316,6 +17337,58 @@ 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({
@@ -16372,6 +17445,17 @@ function OhhwellsBridge() {
       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));
+      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 handleDeactivate = (e) => {
       if (e.data?.type !== "ow:deactivate") return;
       if (Date.now() < linkPopoverGraceUntilRef.current) return;
@@ -16380,6 +17464,12 @@ function OhhwellsBridge() {
         closeLinkPopoverRef.current();
         return;
       }
+      if (floatingPanelOpenRef.current) {
+        setFloatingPanelRef.current(null);
+        deselectRef.current();
+        deactivateRef.current();
+        return;
+      }
       deselectRef.current();
       deactivateRef.current();
     };
@@ -16399,6 +17489,10 @@ function OhhwellsBridge() {
         closeLinkPopoverRef.current();
         return;
       }
+      if (floatingPanelOpenRef.current) {
+        closeFloatingPanelOnlyRef.current();
+        return;
+      }
       if (activeElRef.current) {
         const hrefCtx = getHrefKeyFromElement(activeElRef.current);
         const navAnchor = hrefCtx ? getNavigationItemAnchor(hrefCtx.anchor) : null;
@@ -16429,6 +17523,10 @@ 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)) {
@@ -16462,7 +17560,16 @@ function OhhwellsBridge() {
         closeLinkPopoverRef.current();
         return;
       }
+      if (e.key === "Escape" && floatingPanelOpenRef.current) {
+        e.preventDefault();
+        closeFloatingPanelOnlyRef.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)) {
@@ -16540,7 +17647,8 @@ function OhhwellsBridge() {
     const handleScroll = () => {
       const focusEl = activeElRef.current ?? selectedElRef.current;
       if (focusEl) {
-        const r2 = activeElRef.current ? getEditMeasureEl(activeElRef.current).getBoundingClientRect() : focusEl.getBoundingClientRect();
+        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);
         setToolbarRect(r2);
         setMaxBadge((prev) => prev && activeElRef.current ? { ...prev, rect: r2 } : prev);
@@ -16550,7 +17658,9 @@ function OhhwellsBridge() {
         setToggleState((prev) => prev ? { ...prev, rect } : null);
       }
       if (hoveredItemElRef.current) {
-        setHoveredItemRect(hoveredItemElRef.current.getBoundingClientRect());
+        const hoverEl = hoveredItemElRef.current;
+        const logo = getLogoElement(hoverEl);
+        setHoveredItemRect(logo ? getLogoInteractionRect(logo) : hoverEl.getBoundingClientRect());
       }
       if (hoveredNavContainerRef.current) {
         setHoveredNavContainerRect(hoveredNavContainerRef.current.getBoundingClientRect());
@@ -16594,6 +17704,9 @@ function OhhwellsBridge() {
       if (aiSectionsRef.current) {
         nodes.push({ key: AI_SECTIONS_KEY, type: "sections", text: aiSectionsRef.current });
       }
+      if (brandKitRef.current) {
+        nodes.push({ key: BRAND_KIT_KEY, type: "brand", text: brandKitRef.current });
+      }
       postToParentRef.current({ type: "ow:save-result", nodes });
     };
     const handleInsertSection = (e) => {
@@ -16604,8 +17717,12 @@ function OhhwellsBridge() {
       if (inserted) {
         const tracker = getSectionsTracker();
         postToParentRef.current({ type: "ow:change", nodes: [{ key: "__ohw_sections", text: tracker.textContent ?? "[]" }] });
-        const h = document.documentElement.scrollHeight;
-        if (h > 50) postToParentRef.current({ type: "ow:height", height: h });
+        const reportHeight = () => {
+          const h = document.body.scrollHeight;
+          if (h > 50) postToParentRef.current({ type: "ow:height", height: h });
+        };
+        reportHeight();
+        setTimeout(reportHeight, 500);
       }
     };
     const handleSwitchSchedule = (e) => {
@@ -16798,13 +17915,17 @@ 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) : focusEl;
-        applyToolbarPos(measureEl.getBoundingClientRect());
+        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 handleClickAt = (e) => {
@@ -16829,6 +17950,25 @@ function OhhwellsBridge() {
         postToParentRef.current({ type: "ow:image-pick", key: stateCardImage.dataset.ohwKey ?? "", elementType: stateCardImage.dataset.ohwEditable ?? "image" });
         return;
       }
+      const logoAtPoint = Array.from(
+        document.querySelectorAll('[data-ohw-role="logo"], [data-ohw-logo]')
+      ).map((el) => getLogoElement(el)).find((logo) => {
+        if (!logo) return false;
+        const r2 = logo.getBoundingClientRect();
+        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);
+        return;
+      }
       const textEditable = Array.from(
         document.querySelectorAll(NON_MEDIA_SELECTOR)
       ).find((el) => {
@@ -16900,6 +18040,14 @@ 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);
@@ -16955,10 +18103,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", handleDeactivate);
       window.removeEventListener("message", handleToastAction);
       window.removeEventListener("message", handleUiEscape);
@@ -16984,7 +18135,7 @@ 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]')) {
+      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]')) {
         return;
       }
       if (target.closest("[data-ohw-item-drag-surface]")) return;
@@ -17162,7 +18313,7 @@ function OhhwellsBridge() {
       postToParent2({
         type: "ow:ready",
         version: "1",
-        bridgeVersion: "0.1.56",
+        bridgeVersion: "0.1.59",
         path: pathname,
         nodes: collectEditableNodes(editContentRef.current),
         sections
@@ -17557,10 +18708,10 @@ function OhhwellsBridge() {
     [postToParent2]
   );
   return bridgeRoot ? (0, import_react_dom4.createPortal)(
-    /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_jsx_runtime32.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { ref: attachVisibleViewport, "data-ohw-visible-viewport": "", "aria-hidden": true }),
-      isEditMode && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(AiSectionOverlay, { postToParent: postToParent2, apiRef: aiSectionApiRef }),
-      Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_jsx_runtime33.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { ref: attachVisibleViewport, "data-ohw-visible-viewport": "", "aria-hidden": true }),
+      isEditMode && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(AiSectionOverlay, { postToParent: postToParent2, apiRef: aiSectionApiRef }),
+      Object.entries(uploadingRects).map(([key, { rect, fadingOut }]) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
         MediaOverlay,
         {
           hover: { key, rect, elementType: "image", isDragOver: false, hasTextOverlap: false },
@@ -17571,7 +18722,7 @@ function OhhwellsBridge() {
         },
         `uploading-${key}`
       )),
-      mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      mediaHover && !(mediaHover.key in uploadingRects) && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
         MediaOverlay,
         {
           hover: mediaHover,
@@ -17580,11 +18731,11 @@ function OhhwellsBridge() {
           onVideoSettingsChange: handleVideoSettingsChange
         }
       ),
-      carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(CarouselOverlay, { hover: carouselHover, onEdit: handleEditCarousel }),
-      siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ItemInteractionLayer, { rect: siblingHintRect, state: "sibling-hint" }),
-      siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ItemInteractionLayer, { rect, state: "sibling-hint" }, `sibling-hint-${i}`)),
-      isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ItemInteractionLayer, { rect: draggedItemRect, state: "dragging" }),
-      isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      carouselHover && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(CarouselOverlay, { hover: carouselHover, onEdit: handleEditCarousel }),
+      siblingHintRect && !linkPopover && !isItemDragging && siblingHintRects.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ItemInteractionLayer, { rect: siblingHintRect, state: "sibling-hint" }),
+      siblingHintRects.length > 0 && !linkPopover && !isItemDragging && siblingHintRects.map((rect, i) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ItemInteractionLayer, { rect, state: "sibling-hint" }, `sibling-hint-${i}`)),
+      isItemDragging && draggedItemRect && selectedElRef.current !== footerDragRef.current?.draggedEl && selectedElRef.current !== navDragRef.current?.draggedEl && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ItemInteractionLayer, { rect: draggedItemRect, state: "dragging" }),
+      isItemDragging && footerDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
         "div",
         {
           className: "pointer-events-none fixed z-2147483646",
@@ -17594,7 +18745,7 @@ function OhhwellsBridge() {
             width: slot.width,
             height: slot.height
           },
-          children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
             DropIndicator,
             {
               direction: slot.direction,
@@ -17605,7 +18756,7 @@ function OhhwellsBridge() {
         },
         `footer-drop-${slot.direction}-${slot.columnIndex}-${slot.insertIndex}-${i}`
       )),
-      isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      isItemDragging && navDropSlots.map((slot, i) => /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
         "div",
         {
           className: "pointer-events-none fixed z-2147483646",
@@ -17615,7 +18766,7 @@ function OhhwellsBridge() {
             width: slot.width,
             height: slot.height
           },
-          children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
             DropIndicator,
             {
               direction: slot.direction,
@@ -17626,10 +18777,11 @@ function OhhwellsBridge() {
         },
         `nav-drop-${slot.direction}-${slot.parentId ?? "root"}-${slot.insertIndex}-${i}`
       )),
-      hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ItemInteractionLayer, { rect: hoveredNavContainerRect, state: "hover" }),
-      hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(ItemInteractionLayer, { rect: hoveredItemRect, state: "hover" }),
-      toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(NavbarContainerChrome, { rect: toolbarRect, onAdd: handleAddTopLevelNavItem }),
-      toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      hoveredNavContainerRect && (toolbarVariant !== "select-frame" || isFooterFrameSelection) && !linkPopover && !isItemDragging && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ItemInteractionLayer, { rect: hoveredNavContainerRect, state: "hover" }),
+      hoveredItemRect && !linkPopover && !hoveredNavContainerRect && !isItemDragging && hoveredItemElRef.current !== selectedElRef.current && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ItemInteractionLayer, { rect: hoveredItemRect, state: "hover" }),
+      hoveredTextRect && !isItemDragging && toolbarVariant !== "rich-text" && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ItemInteractionLayer, { rect: hoveredTextRect, state: "hover" }),
+      toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isNavbarLinksContainer2(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(NavbarContainerChrome, { rect: toolbarRect, onAdd: handleAddTopLevelNavItem }),
+      toolbarVariant === "select-frame" && toolbarRect && !linkPopover && !isItemDragging && !isFooterFrameSelection && selectedElRef.current && isFooterLinksContainer(selectedElRef.current) && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
         FooterContainerChrome,
         {
           rect: toolbarRect,
@@ -17637,7 +18789,7 @@ function OhhwellsBridge() {
           addDisabled: !canAddFooterColumn()
         }
       ),
-      toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame") && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      toolbarRect && !linkPopover && (toolbarVariant === "link-action" || toolbarVariant === "select-frame" || toolbarVariant === "logo") && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
         ItemInteractionLayer,
         {
           rect: isItemDragging && draggedItemRect && (footerDragRef.current?.wasSelected || navDragRef.current?.wasSelected) ? draggedItemRect : toolbarRect,
@@ -17649,10 +18801,10 @@ function OhhwellsBridge() {
           dragHandleLabel: reorderHrefKey ? `Reorder ${reorderHrefKey}` : "Reorder item",
           onDragHandleDragStart: handleItemDragStart,
           onDragHandleDragEnd: handleItemDragEnd,
-          onItemPointerDown: handleItemChromePointerDown,
-          onItemClick: handleItemChromeClick,
-          itemDragSurface: !isFooterFrameSelection,
-          toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && (isFooterFrameSelection || selectedIsSocialsRow) && !isItemDragging ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+          onItemPointerDown: toolbarVariant === "logo" ? void 0 : handleItemChromePointerDown,
+          onItemClick: toolbarVariant === "logo" ? void 0 : handleItemChromeClick,
+          itemDragSurface: toolbarVariant !== "logo" && !isFooterFrameSelection,
+          toolbar: toolbarVariant === "link-action" && !isItemDragging || toolbarVariant === "select-frame" && (isFooterFrameSelection || selectedIsSocialsRow) && !isItemDragging ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
             ItemActionToolbar,
             {
               onEditLink: openLinkPopoverForSelected,
@@ -17668,7 +18820,10 @@ function OhhwellsBridge() {
               onSelectParent: handleSelectParent,
               onDuplicate: handleDuplicateSelected,
               onDelete: handleDeleteSelected,
-              addItemDisabled: false,
+              addItemDisabled: isFooterFrameSelection && isFooterAddItemDisabled(selectedElRef.current) || selectedElRef.current !== null && (() => {
+                const row = isSocialsRow(selectedElRef.current) ? selectedElRef.current : findSocialsRow(selectedElRef.current);
+                return row ? !canAddSocialItem(row) : false;
+              })(),
               editLinkDisabled: false,
               moreDisabled: false,
               duplicateDisabled: isFooterFrameSelection || selectedIsSocialsRow,
@@ -17685,8 +18840,8 @@ function OhhwellsBridge() {
           ) : void 0
         }
       ),
-      toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_jsx_runtime32.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      toolbarRect && toolbarVariant === "rich-text" && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_jsx_runtime33.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
           EditGlowChrome,
           {
             rect: toolbarRect,
@@ -17696,7 +18851,7 @@ function OhhwellsBridge() {
             hideHandle: isItemDragging
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
           FloatingToolbar,
           {
             rect: toolbarRect,
@@ -17709,7 +18864,7 @@ function OhhwellsBridge() {
           }
         )
       ] }),
-      maxBadge && /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+      maxBadge && /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
         "div",
         {
           "data-ohw-max-badge": "",
@@ -17735,7 +18890,7 @@ function OhhwellsBridge() {
           ]
         }
       ),
-      toggleState && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      toggleState && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
         StateToggle,
         {
           rect: toggleState.rect,
@@ -17744,15 +18899,15 @@ function OhhwellsBridge() {
           onStateChange: handleStateChange
         }
       ),
-      sectionGap && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+      sectionGap && !linkPopover && /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
         "div",
         {
           "data-ohw-section-insert-line": "",
           className: "fixed left-0 w-full z-2147483646 flex items-center pointer-events-none",
           style: { top: sectionGap.y, transform: "translateY(-50%)" },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
-            /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } }),
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
               Badge,
               {
                 className: "px-8 py-1 bg-primary hover:bg-primary text-primary-foreground text-xs font-medium shrink-0 rounded-full cursor-pointer pointer-events-auto",
@@ -17769,11 +18924,11 @@ function OhhwellsBridge() {
                 children: "Add Section"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } })
+            /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "flex-1 bg-primary", style: { height: 3 } })
           ]
         }
       ),
-      linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      linkPopover && dialogPortalContainer ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
         LinkPopover,
         {
           panelRef: linkPopoverPanelRef,
@@ -17790,7 +18945,7 @@ function OhhwellsBridge() {
         },
         linkPopover.key
       ) : null,
-      floatingPanel && floatingPanel.kind === "socials-display" ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+      floatingPanel && floatingPanel.kind === "socials-display" ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
         FloatingPanel,
         {
           open: true,
@@ -17800,7 +18955,7 @@ function OhhwellsBridge() {
           onPositionChange: setFloatingPanelPos,
           parentScroll: parentScrollSnap ?? parentScrollRef.current,
           onClose: closeFloatingPanelOnly,
-          children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
             SocialsDisplayPanel,
             {
               display: socialsDisplayFor(floatingPanel.row, editContentRef.current),
@@ -17811,11 +18966,115 @@ function OhhwellsBridge() {
             }
           )
         }
+      ) : null,
+      floatingPanel && floatingPanel.kind === "logo-size" && logoSizeDraft ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+        FloatingPanel,
+        {
+          open: true,
+          title: floatingPanel.title,
+          context: floatingPanel.context,
+          position: floatingPanelPos,
+          onPositionChange: setFloatingPanelPos,
+          parentScroll: parentScrollSnap ?? parentScrollRef.current,
+          onClose: closeFloatingPanelAndDeselect,
+          children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+            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
+var import_link = __toESM(require("next/link"), 1);
+var import_jsx_runtime34 = require("react/jsx-runtime");
+function EmptySection({ title, homeHref = "/", eyebrowKey, titleKey, subtitleKey }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_jsx_runtime34.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+      "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__ */ (0, import_jsx_runtime34.jsx)(import_link.default, { href: homeHref, style: { color: "inherit" }, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { ...eyebrowKey ? { "data-ohw-editable": "text", "data-ohw-key": eyebrowKey } : {}, children: "Home" }) })
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+      "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__ */ (0, import_jsx_runtime34.jsx)(
+      "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."
+      }
+    )
+  ] });
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   AI_DEFAULT_BRAND,
@@ -17833,6 +19092,7 @@ function OhhwellsBridge() {
   DropdownMenuItem,
   DropdownMenuSeparator,
   DropdownMenuTrigger,
+  EmptySection,
   ItemActionToolbar,
   ItemInteractionLayer,
   LinkEditorPanel,