@harbour-enterprises/superdoc 1.0.0-next.2 → 1.0.0-next.4

package/dist/superdoc.umd.js

@@ -42428,7 +42428,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     static getStoredSuperdocVersion(docx) {
       return _SuperConverter2.getStoredCustomProperty(docx, "SuperdocVersion");
     }
-    static setStoredSuperdocVersion(docx = this.convertedXml, version2 = "1.0.0-next.2") {
+    static setStoredSuperdocVersion(docx = this.convertedXml, version2 = "1.0.0-next.4") {
       return _SuperConverter2.setStoredCustomProperty(docx, "SuperdocVersion", version2, false);
     }
     /**
@@ -66424,28 +66424,28 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     }
     return false;
   };
-  function canRenderFont(fontName, fallbackFont = "sans-serif") {
-    const _canRenderFont = (fontName2, fallbackFont2) => {
+  function canRenderFont(fontName, uiDisplayFallbackFont = "sans-serif") {
+    const _canRenderFont = (fontName2, uiDisplayFallbackFont2) => {
       const canvas2 = document.createElement("canvas");
       const ctx2 = canvas2.getContext("2d");
       ctx2.textBaseline = "top";
       const text2 = "abcdefghijklmnopqrstuvwxyz0123456789";
-      ctx2.font = `72px ${fallbackFont2}`;
+      ctx2.font = `72px ${uiDisplayFallbackFont2}`;
       const initialTextMeasurement = ctx2.measureText(text2);
       const fallbackWidth = initialTextMeasurement.width;
       const fallbackHeight = initialTextMeasurement.actualBoundingBoxDescent;
-      ctx2.font = `72px "${fontName2}", ${fallbackFont2}`;
+      ctx2.font = `72px "${fontName2}", ${uiDisplayFallbackFont2}`;
       const customTextMeasurement = ctx2.measureText(text2);
       const customFontWidth = customTextMeasurement.width;
       const customFontHeight = customTextMeasurement.actualBoundingBoxDescent;
       const isAvailable = customFontWidth !== fallbackWidth || customFontHeight !== fallbackHeight;
       return isAvailable;
     };
-    if (_canRenderFont(fontName, fallbackFont)) {
+    if (_canRenderFont(fontName, uiDisplayFallbackFont)) {
       return true;
     }
-    const oppositeFallbackFont = fallbackFont === "sans-serif" ? "serif" : "sans-serif";
-    return _canRenderFont(fontName, oppositeFallbackFont);
+    const oppositeUiDisplayFallbackFont = uiDisplayFallbackFont === "sans-serif" ? "serif" : "sans-serif";
+    return _canRenderFont(fontName, oppositeUiDisplayFallbackFont);
   }
   const { findChildren: findChildren$3 } = helpers;
   function getAllFieldAnnotations(state2) {
@@ -67513,7 +67513,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
   const shouldSkipNodeView = (editor) => {
     return isHeadless(editor);
   };
-  const summaryVersion = "1.0.0-next.2";
+  const summaryVersion = "1.0.0-next.4";
   const nodeKeys = ["group", "content", "marks", "inline", "atom", "defining", "code", "tableRole", "summary"];
   const markKeys = ["group", "inclusive", "excludes", "spanning", "code"];
   function mapAttributes(attrs) {
@@ -68302,7 +68302,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
         { default: remarkStringify2 },
         { default: remarkGfm2 }
       ] = await Promise.all([
-        Promise.resolve().then(() => indexBDVXUeCy),
+        Promise.resolve().then(() => indexD_KE9gpD),
         Promise.resolve().then(() => indexDRCvimau),
         Promise.resolve().then(() => indexC_x_N6Uh),
         Promise.resolve().then(() => indexD_sWOSiG),
@@ -68507,7 +68507,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
      * Process collaboration migrations
      */
     processCollaborationMigrations() {
-      console.debug("[checkVersionMigrations] Current editor version", "1.0.0-next.2");
+      console.debug("[checkVersionMigrations] Current editor version", "1.0.0-next.4");
       if (!this.options.ydoc) return;
       const metaMap = this.options.ydoc.getMap("meta");
       let docVersion = metaMap.get("version");
@@ -74112,6 +74112,34 @@ Please report this to https://github.com/markedjs/marked.`, e) {
       tabStopPosUsed: nextStop.pos
     };
   }
+  const SPACE_CHARS$1 = /* @__PURE__ */ new Set([" ", " "]);
+  function shouldApplyJustify(params2) {
+    const { alignment: alignment2, hasExplicitPositioning, isLastLineOfParagraph, paragraphEndsWithLineBreak, skipJustifyOverride } = params2;
+    if (alignment2 !== "justify" && alignment2 !== "both") {
+      return false;
+    }
+    if (skipJustifyOverride === true) {
+      return false;
+    }
+    if (hasExplicitPositioning) {
+      return false;
+    }
+    if (isLastLineOfParagraph && !paragraphEndsWithLineBreak) {
+      return false;
+    }
+    return true;
+  }
+  function calculateJustifySpacing(params2) {
+    const { lineWidth, availableWidth, spaceCount, shouldJustify } = params2;
+    if (!shouldJustify) {
+      return 0;
+    }
+    if (spaceCount <= 0) {
+      return 0;
+    }
+    const slack = availableWidth - lineWidth;
+    return slack / spaceCount;
+  }
   function resolveSpacingIndent$1(style2, numbering) {
     const spacing = {
       before: style2.spacing?.before ?? 0,
@@ -74378,13 +74406,14 @@ Please report this to https://github.com/markedjs/marked.`, e) {
         };
       }
     }
+    const normalizedAlign = normalizeAlignment(resolvedExtended.justification);
     const hydrated = {
       resolved,
       spacing: resolvedSpacing,
       indent: resolvedIndent,
       borders: cloneIfObject(resolvedExtended.borders),
       shading: cloneIfObject(resolvedExtended.shading),
-      alignment: resolvedExtended.justification,
+      alignment: normalizedAlign,
       tabStops: cloneIfObject(resolvedExtended.tabStops),
       keepLines: resolvedExtended.keepLines,
       keepNext: resolvedExtended.keepNext,
@@ -75085,7 +75114,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     } else if (styleAlignment) {
       paragraphAttrs.alignment = styleAlignment;
     } else if (computed2.paragraph.alignment) {
-      paragraphAttrs.alignment = computed2.paragraph.alignment;
+      paragraphAttrs.alignment = normalizeAlignment(computed2.paragraph.alignment);
     }
     const spacingPx = spacingPtToPx(spacing, normalizedSpacing);
     if (spacingPx) paragraphAttrs.spacing = spacingPx;
@@ -76237,9 +76266,9 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     const font = findFirstTextFont(para.content);
     return font;
   };
-  const applyBaseRunDefaults = (run2, defaults2, fallbackFont, fallbackSize) => {
+  const applyBaseRunDefaults = (run2, defaults2, uiDisplayFallbackFont, fallbackSize) => {
     if (!run2) return;
-    if (defaults2.fontFamily && run2.fontFamily === fallbackFont) {
+    if (defaults2.fontFamily && run2.fontFamily === uiDisplayFallbackFont) {
       run2.fontFamily = defaults2.fontFamily;
     }
     if (defaults2.fontSizePx != null && run2.fontSize === fallbackSize) {
@@ -78042,7 +78071,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
   let measurementCanvas = null;
   let measurementCtx = null;
   const TAB_CHAR_LENGTH = 1;
-  const SPACE_CHARS = /* @__PURE__ */ new Set([" ", " "]);
+  const SPACE_CHARS = SPACE_CHARS$1;
   const isTabRun$1 = (run2) => run2?.kind === "tab";
   function getMeasurementContext() {
     if (measurementCtx) return measurementCtx;
@@ -78068,29 +78097,50 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     }
     return spaces;
   };
-  const getJustifyAdjustment = (block, line, availableWidthOverride, alignmentOverride) => {
+  const getJustifyAdjustment = (block, line, availableWidthOverride, alignmentOverride, isLastLineOfParagraph, paragraphEndsWithLineBreak, skipJustifyOverride) => {
     if (block.kind !== "paragraph") {
       return { extraPerSpace: 0, totalSpaces: 0 };
     }
-    const alignment2 = alignmentOverride ?? block.attrs?.alignment;
-    const hasExplicitPositioning = line.segments?.some((seg) => seg.x !== void 0);
-    const availableWidth = availableWidthOverride ?? line.maxWidth ?? line.width;
-    const slack = Math.max(0, availableWidth - line.width);
-    if (alignment2 !== "justify" || hasExplicitPositioning || slack <= 0) {
+    if (block.runs.length === 0) {
       return { extraPerSpace: 0, totalSpaces: 0 };
     }
-    const runs2 = sliceRunsForLine$1(block, line);
-    const totalSpaces = runs2.reduce((sum, run2) => {
-      if (isTabRun$1(run2) || "src" in run2 || run2.kind === "lineBreak" || run2.kind === "break" || run2.kind === "fieldAnnotation") {
-        return sum;
-      }
-      return sum + countSpaces(run2.text ?? "");
-    }, 0);
-    if (totalSpaces <= 0) {
+    const alignment2 = alignmentOverride ?? block.attrs?.alignment;
+    const hasExplicitPositioning = line.segments?.some((seg) => seg.x !== void 0) ?? false;
+    const lastRunIndex = block.runs.length - 1;
+    const lastRun = block.runs[lastRunIndex];
+    const derivedIsLastLine = line.toRun >= lastRunIndex;
+    const derivedEndsWithLineBreak = lastRun ? lastRun.kind === "lineBreak" : false;
+    const shouldJustify = shouldApplyJustify({
+      alignment: alignment2,
+      hasExplicitPositioning,
+      isLastLineOfParagraph: derivedIsLastLine,
+      paragraphEndsWithLineBreak: derivedEndsWithLineBreak,
+      skipJustifyOverride
+    });
+    if (!shouldJustify) {
       return { extraPerSpace: 0, totalSpaces: 0 };
     }
+    let totalSpaces = line.spaceCount ?? 0;
+    if (totalSpaces === 0) {
+      const runs2 = sliceRunsForLine$1(block, line);
+      totalSpaces = runs2.reduce((sum, run2) => {
+        if (isTabRun$1(run2) || "src" in run2 || run2.kind === "lineBreak" || run2.kind === "break" || run2.kind === "fieldAnnotation") {
+          return sum;
+        }
+        return sum + countSpaces(run2.text ?? "");
+      }, 0);
+    }
+    const availableWidth = availableWidthOverride ?? line.maxWidth ?? line.width;
+    const lineWidth = line.naturalWidth ?? line.width;
+    const extraPerSpace = calculateJustifySpacing({
+      lineWidth,
+      availableWidth,
+      spaceCount: totalSpaces,
+      shouldJustify: true
+      // Already checked above
+    });
     return {
-      extraPerSpace: slack / totalSpaces,
+      extraPerSpace,
       totalSpaces
     };
   };
@@ -78157,7 +78207,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     line.width;
     const justify = getJustifyAdjustment(block, line, availableWidth, alignmentOverride);
     const alignment2 = alignmentOverride ?? (block.kind === "paragraph" ? block.attrs?.alignment : void 0);
-    const renderedLineWidth = alignment2 === "justify" ? line.width + Math.max(0, availableWidth - line.width) : line.width;
+    const renderedLineWidth = alignment2 === "justify" && justify.extraPerSpace !== 0 ? availableWidth : line.width;
     const hasExplicitPositioning = line.segments?.some((seg) => seg.x !== void 0);
     const alignmentOffset = !hasExplicitPositioning && alignment2 === "center" ? Math.max(0, (availableWidth - renderedLineWidth) / 2) : !hasExplicitPositioning && alignment2 === "right" ? Math.max(0, availableWidth - renderedLineWidth) : 0;
     if (hasExplicitPositioning && line.segments && ctx2) {
@@ -78200,13 +78250,13 @@ Please report this to https://github.com/markedjs/marked.`, e) {
         const textUpToTarget = text2.slice(0, offsetInRun);
         const measured2 = ctx2.measureText(textUpToTarget);
         const spacingWidth = computeLetterSpacingWidth(run2, offsetInRun, runLength);
-        const spacesInPortion = justify.extraPerSpace > 0 ? countSpaces(textUpToTarget) : 0;
+        const spacesInPortion = justify.extraPerSpace !== 0 ? countSpaces(textUpToTarget) : 0;
         return alignmentOffset + currentX + measured2.width + spacingWidth + justify.extraPerSpace * (spaceTally + spacesInPortion);
       }
       ctx2.font = getRunFontString(run2);
       const measured = ctx2.measureText(text2);
       const runLetterSpacing = computeLetterSpacingWidth(run2, runLength, runLength);
-      const spacesInRun = justify.extraPerSpace > 0 ? countSpaces(text2) : 0;
+      const spacesInRun = justify.extraPerSpace !== 0 ? countSpaces(text2) : 0;
       currentX += measured.width + runLetterSpacing + justify.extraPerSpace * spacesInRun;
       spaceTally += spacesInRun;
       currentCharOffset += runLength;
@@ -83358,9 +83408,66 @@ ${l}
         const firstLineOffset = suppressFirstLineIndent ? 0 : (paraIndent?.firstLine ?? 0) - (paraIndent?.hanging ?? 0);
         const lastRun = block.runs.length > 0 ? block.runs[block.runs.length - 1] : null;
         const paragraphEndsWithLineBreak = lastRun?.kind === "lineBreak";
+        let listFirstLineMarkerTabWidth;
+        if (!fragment.continuesFromPrev && fragment.markerWidth && wordLayout?.marker) {
+          const markerBoxWidth = fragment.markerWidth;
+          const markerTextWidth = fragment.markerTextWidth != null && isFinite(fragment.markerTextWidth) && fragment.markerTextWidth >= 0 ? fragment.markerTextWidth : markerBoxWidth;
+          const suffix2 = wordLayout.marker.suffix ?? "tab";
+          if (suffix2 === "tab") {
+            const markerJustification = wordLayout.marker.justification ?? "left";
+            const isFirstLineIndentMode = wordLayout.firstLineIndentMode === true;
+            let markerStartPos;
+            if (isFirstLineIndentMode && wordLayout.marker.markerX !== void 0 && Number.isFinite(wordLayout.marker.markerX)) {
+              markerStartPos = wordLayout.marker.markerX;
+            } else {
+              const hanging = paraIndent?.hanging ?? 0;
+              const firstLine = paraIndent?.firstLine ?? 0;
+              markerStartPos = paraIndentLeft - hanging + firstLine;
+            }
+            const validMarkerStartPos = Number.isFinite(markerStartPos) ? markerStartPos : 0;
+            let tabWidth;
+            if (markerJustification === "left") {
+              const currentPos = validMarkerStartPos + markerTextWidth;
+              if (isFirstLineIndentMode) {
+                const textStartTarget = wordLayout.marker.textStartX !== void 0 && Number.isFinite(wordLayout.marker.textStartX) ? wordLayout.marker.textStartX : wordLayout.textStartPx;
+                if (textStartTarget !== void 0 && Number.isFinite(textStartTarget) && textStartTarget > currentPos) {
+                  tabWidth = textStartTarget - currentPos;
+                } else {
+                  tabWidth = LIST_MARKER_GAP$1;
+                }
+              } else {
+                const firstLine = paraIndent?.firstLine ?? 0;
+                const textStart = paraIndentLeft + firstLine;
+                tabWidth = textStart - currentPos;
+                if (tabWidth <= 0) {
+                  tabWidth = DEFAULT_TAB_INTERVAL_PX$1 - currentPos % DEFAULT_TAB_INTERVAL_PX$1;
+                } else if (tabWidth < LIST_MARKER_GAP$1) {
+                  tabWidth = LIST_MARKER_GAP$1;
+                }
+              }
+            } else {
+              const gutterWidth = fragment.markerGutter ?? wordLayout.marker.gutterWidthPx;
+              tabWidth = gutterWidth !== void 0 && Number.isFinite(gutterWidth) && gutterWidth > 0 ? gutterWidth : LIST_MARKER_GAP$1;
+            }
+            if (tabWidth < LIST_MARKER_GAP$1) {
+              tabWidth = LIST_MARKER_GAP$1;
+            }
+            listFirstLineMarkerTabWidth = validMarkerStartPos + markerTextWidth + tabWidth;
+          } else if (suffix2 === "space") {
+            const hanging = paraIndent?.hanging ?? 0;
+            const firstLine = paraIndent?.firstLine ?? 0;
+            const markerStartPos = paraIndentLeft - hanging + firstLine;
+            const validMarkerStartPos = Number.isFinite(markerStartPos) ? markerStartPos : 0;
+            listFirstLineMarkerTabWidth = validMarkerStartPos + markerTextWidth + 4;
+          }
+        }
         lines.forEach((line, index2) => {
-          const fallbackAvailableWidth = Math.max(0, fragment.width - (paraIndentLeft + paraIndentRight));
-          const availableWidthOverride = line.maxWidth ?? fallbackAvailableWidth;
+          const positiveIndentReduction = Math.max(0, paraIndentLeft) + Math.max(0, paraIndentRight);
+          const fallbackAvailableWidth = Math.max(0, fragment.width - positiveIndentReduction);
+          let availableWidthOverride = line.maxWidth != null ? Math.min(line.maxWidth, fallbackAvailableWidth) : fallbackAvailableWidth;
+          if (index2 === 0 && listFirstLineMarkerTabWidth != null) {
+            availableWidthOverride = fragment.width - listFirstLineMarkerTabWidth - Math.max(0, paraIndentRight);
+          }
           const isLastLineOfFragment = index2 === lines.length - 1;
           const isLastLineOfParagraph = isLastLineOfFragment && !fragment.continuesOnNext;
           const shouldSkipJustifyForLastLine = isLastLineOfParagraph && !paragraphEndsWithLineBreak;
@@ -83386,7 +83493,10 @@ ${l}
               }
             } else if (paraIndentLeft && paraIndentLeft > 0) {
               lineEl.style.paddingLeft = `${paraIndentLeft}px`;
-            } else if (!isFirstLine && paraIndent?.hanging && paraIndent.hanging > 0) {
+            } else if (!isFirstLine && paraIndent?.hanging && paraIndent.hanging > 0 && // Only apply hanging padding when left indent is NOT negative.
+            // When left indent is negative, the fragment position already accounts for it.
+            // Adding padding here would shift body lines right, causing right-side overflow.
+            !(paraIndentLeft != null && paraIndentLeft < 0)) {
               lineEl.style.paddingLeft = `${paraIndent.hanging}px`;
             }
           }
@@ -83415,6 +83525,7 @@ ${l}
             lineEl.style.paddingLeft = `${validMarkerStartPos}px`;
             const markerContainer = this.doc.createElement("span");
             markerContainer.style.display = "inline-block";
+            markerContainer.style.wordSpacing = "0px";
             const markerEl = this.doc.createElement("span");
             markerEl.classList.add("superdoc-paragraph-marker");
             markerEl.textContent = wordLayout.marker.markerText ?? "";
@@ -83500,10 +83611,15 @@ ${l}
                 }
               }
               tabEl.style.display = "inline-block";
+              tabEl.style.wordSpacing = "0px";
               tabEl.style.width = `${tabWidth}px`;
               lineEl.prepend(tabEl);
             } else if (suffix2 === "space") {
-              lineEl.prepend(this.doc.createTextNode(" "));
+              const spaceEl = this.doc.createElement("span");
+              spaceEl.classList.add("superdoc-marker-suffix-space");
+              spaceEl.style.wordSpacing = "0px";
+              spaceEl.textContent = " ";
+              lineEl.prepend(spaceEl);
             }
             lineEl.prepend(markerContainer);
           }
@@ -84795,11 +84911,8 @@ ${l}
         el.setAttribute("styleid", styleId);
       }
       const alignment2 = block.attrs?.alignment;
-      const effectiveAlignment = alignment2;
-      if (effectiveAlignment === "center" || effectiveAlignment === "right") {
-        el.style.textAlign = effectiveAlignment;
-      } else if (effectiveAlignment === "justify") {
-        el.style.textAlign = "left";
+      if (alignment2 === "center" || alignment2 === "right") {
+        el.style.textAlign = alignment2;
       } else {
         el.style.textAlign = "left";
       }
@@ -84810,9 +84923,8 @@ ${l}
       if (lineRange.pmEnd != null) {
         el.dataset.pmEnd = String(lineRange.pmEnd);
       }
-      const runsForLine = sliceRunsForLine(block, line);
+      let runsForLine = sliceRunsForLine(block, line);
       const trackedConfig = this.resolveTrackedChangesConfig(block);
-      runsForLine.length > 0 ? runsForLine.filter((r2) => (r2.kind === "text" || r2.kind === void 0) && "text" in r2 && r2.text != null).map((r2) => r2.text) : gatherTextSlicesForLine(block, line);
       if (runsForLine.length === 0) {
         const span = this.doc.createElement("span");
         span.innerHTML = "&nbsp;";
@@ -84859,7 +84971,156 @@ ${l}
         });
       }
       const hasExplicitPositioning = line.segments?.some((seg) => seg.x !== void 0);
-      availableWidthOverride ?? line.maxWidth ?? line.width;
+      const availableWidth = availableWidthOverride ?? line.maxWidth ?? line.width;
+      const justifyShouldApply = shouldApplyJustify({
+        alignment: block.attrs?.alignment,
+        hasExplicitPositioning: hasExplicitPositioning ?? false,
+        // Caller already folds last-line + trailing lineBreak behavior into skipJustify.
+        isLastLineOfParagraph: false,
+        paragraphEndsWithLineBreak: false,
+        skipJustifyOverride: skipJustify
+      });
+      const countSpaces2 = (text2) => {
+        let count = 0;
+        for (let i2 = 0; i2 < text2.length; i2 += 1) {
+          if (SPACE_CHARS$1.has(text2[i2])) count += 1;
+        }
+        return count;
+      };
+      if (justifyShouldApply) {
+        const stableDataAttrs = (attrs) => {
+          if (!attrs) return void 0;
+          const keys2 = Object.keys(attrs).sort();
+          const out = {};
+          keys2.forEach((key2) => {
+            out[key2] = attrs[key2];
+          });
+          return out;
+        };
+        const mergeSignature = (run2) => JSON.stringify({
+          kind: run2.kind ?? "text",
+          fontFamily: run2.fontFamily,
+          fontSize: run2.fontSize,
+          bold: run2.bold ?? false,
+          italic: run2.italic ?? false,
+          letterSpacing: run2.letterSpacing ?? null,
+          color: run2.color ?? null,
+          underline: run2.underline ?? null,
+          strike: run2.strike ?? false,
+          highlight: run2.highlight ?? null,
+          textTransform: run2.textTransform ?? null,
+          token: run2.token ?? null,
+          pageRefMetadata: run2.pageRefMetadata ?? null,
+          trackedChange: run2.trackedChange ?? null,
+          sdt: run2.sdt ?? null,
+          link: run2.link ?? null,
+          comments: run2.comments ?? null,
+          dataAttrs: stableDataAttrs(run2.dataAttrs) ?? null
+        });
+        const isWhitespaceOnly = (text2) => {
+          if (text2.length === 0) return false;
+          for (let i2 = 0; i2 < text2.length; i2 += 1) {
+            if (!SPACE_CHARS$1.has(text2[i2])) return false;
+          }
+          return true;
+        };
+        const cloneTextRun = (run2) => ({
+          ...run2,
+          comments: run2.comments ? [...run2.comments] : void 0,
+          dataAttrs: run2.dataAttrs ? { ...run2.dataAttrs } : void 0,
+          underline: run2.underline ? { ...run2.underline } : void 0,
+          pageRefMetadata: run2.pageRefMetadata ? { ...run2.pageRefMetadata } : void 0
+        });
+        const normalized = runsForLine.map((run2) => {
+          if (run2.kind !== "text" && run2.kind !== void 0 || !("text" in run2)) return run2;
+          return cloneTextRun(run2);
+        });
+        const merged = [];
+        for (let i2 = 0; i2 < normalized.length; i2 += 1) {
+          const run2 = normalized[i2];
+          if (run2.kind !== "text" && run2.kind !== void 0 || !("text" in run2)) {
+            merged.push(run2);
+            continue;
+          }
+          const textRun = run2;
+          if (!isWhitespaceOnly(textRun.text ?? "")) {
+            merged.push(textRun);
+            continue;
+          }
+          const prev = merged[merged.length - 1];
+          if (prev && (prev.kind === "text" || prev.kind === void 0) && "text" in prev) {
+            const prevTextRun = prev;
+            if (mergeSignature(prevTextRun) === mergeSignature(textRun)) {
+              const extra = textRun.text ?? "";
+              prevTextRun.text = (prevTextRun.text ?? "") + extra;
+              if (prevTextRun.pmStart != null) {
+                prevTextRun.pmEnd = prevTextRun.pmStart + prevTextRun.text.length;
+              } else if (prevTextRun.pmEnd != null) {
+                prevTextRun.pmEnd = prevTextRun.pmEnd + extra.length;
+              }
+              continue;
+            }
+          }
+          const next2 = normalized[i2 + 1];
+          if (next2 && (next2.kind === "text" || next2.kind === void 0) && "text" in next2) {
+            const nextTextRun = next2;
+            if (mergeSignature(nextTextRun) === mergeSignature(textRun)) {
+              const extra = textRun.text ?? "";
+              nextTextRun.text = extra + (nextTextRun.text ?? "");
+              if (textRun.pmStart != null) {
+                nextTextRun.pmStart = textRun.pmStart;
+              } else if (nextTextRun.pmStart != null) {
+                nextTextRun.pmStart = nextTextRun.pmStart - extra.length;
+              }
+              if (nextTextRun.pmStart != null && nextTextRun.pmEnd == null) {
+                nextTextRun.pmEnd = nextTextRun.pmStart + nextTextRun.text.length;
+              }
+              continue;
+            }
+          }
+          merged.push(textRun);
+        }
+        runsForLine = merged;
+        const hasNonSpaceText = runsForLine.some(
+          (run2) => (run2.kind === "text" || run2.kind === void 0) && "text" in run2 && (run2.text ?? "").trim().length > 0
+        );
+        if (hasNonSpaceText) {
+          for (let i2 = runsForLine.length - 1; i2 >= 0; i2 -= 1) {
+            const run2 = runsForLine[i2];
+            if (run2.kind !== "text" && run2.kind !== void 0 || !("text" in run2)) continue;
+            const text2 = run2.text ?? "";
+            let trimCount = 0;
+            for (let j2 = text2.length - 1; j2 >= 0 && text2[j2] === " "; j2 -= 1) {
+              trimCount += 1;
+            }
+            if (trimCount === 0) break;
+            const nextText = text2.slice(0, Math.max(0, text2.length - trimCount));
+            if (nextText.length === 0) {
+              runsForLine.splice(i2, 1);
+              continue;
+            }
+            run2.text = nextText;
+            if (run2.pmEnd != null) {
+              run2.pmEnd = run2.pmEnd - trimCount;
+            }
+            break;
+          }
+        }
+      }
+      const spaceCount = line.spaceCount ?? runsForLine.reduce((sum, run2) => {
+        if (run2.kind !== "text" && run2.kind !== void 0 || !("text" in run2) || run2.text == null) return sum;
+        return sum + countSpaces2(run2.text);
+      }, 0);
+      const lineWidth = line.naturalWidth ?? line.width;
+      const spacingPerSpace = calculateJustifySpacing({
+        lineWidth,
+        availableWidth,
+        spaceCount,
+        shouldJustify: justifyShouldApply
+      });
+      if (spacingPerSpace !== 0) {
+        el.style.wordSpacing = `${spacingPerSpace}px`;
+      }
       if (hasExplicitPositioning && line.segments) {
         const paraIndent = block.attrs?.indent;
         const indentLeft = paraIndent?.left ?? 0;
@@ -85731,7 +85992,7 @@ ${l}
       element2.setAttribute("styleid", attrs.styleId);
     }
     if (attrs.alignment) {
-      element2.style.textAlign = attrs.alignment;
+      element2.style.textAlign = attrs.alignment === "justify" || attrs.alignment === "both" ? "left" : attrs.alignment;
     }
     if (attrs.dropCap) {
       element2.classList.add("sd-editor-dropcap");
@@ -85796,23 +86057,6 @@ ${l}
     if (!shading?.fill) return;
     element2.style.backgroundColor = shading.fill;
   };
-  const gatherTextSlicesForLine = (block, line) => {
-    const slices = [];
-    const startRun = line.fromRun ?? 0;
-    const endRun = line.toRun ?? startRun;
-    for (let runIndex = startRun; runIndex <= endRun; runIndex += 1) {
-      const run2 = block.runs[runIndex];
-      if (!run2 || run2.kind !== "text" && run2.kind !== void 0 || !("text" in run2) || !run2.text) continue;
-      const isFirst = runIndex === startRun;
-      const isLast = runIndex === endRun;
-      const start2 = isFirst ? line.fromChar ?? 0 : 0;
-      const end2 = isLast ? line.toChar ?? run2.text.length : run2.text.length;
-      if (start2 >= end2) continue;
-      const slice2 = run2.text.slice(start2, end2);
-      if (slice2) slices.push(slice2);
-    }
-    return slices;
-  };
   const sliceRunsForLine = (block, line) => {
     const result = [];
     for (let runIndex = line.fromRun; runIndex <= line.toRun; runIndex += 1) {
@@ -86434,7 +86678,8 @@ ${l}
     let indentAdjust = paraIndentLeft;
     if (isListItem2 && isFirstLine && isFirstLineIndentMode) {
       const textStartFallback = paraIndentLeft + Math.max(firstLineIndent, 0) + markerWidth;
-      indentAdjust = typeof wordLayout?.textStartPx === "number" && Number.isFinite(wordLayout.textStartPx) ? wordLayout.textStartPx : textStartFallback;
+      const markerTextStartX = wordLayout?.marker?.textStartX;
+      indentAdjust = typeof markerTextStartX === "number" && Number.isFinite(markerTextStartX) ? markerTextStartX : typeof wordLayout?.textStartPx === "number" && Number.isFinite(wordLayout.textStartPx) ? wordLayout.textStartPx : textStartFallback;
     } else if (isFirstLine && !isListItem2) {
       indentAdjust += firstLineOffset;
     }
@@ -87124,6 +87369,20 @@ ${l}
     }
     return value;
   };
+  function calculateFirstLineIndent(block, measure) {
+    const wordLayout = block.attrs?.wordLayout;
+    if (!wordLayout?.firstLineIndentMode) {
+      return 0;
+    }
+    if (!wordLayout.marker || !measure.marker) {
+      return 0;
+    }
+    const markerWidthRaw = measure.marker.markerWidth ?? wordLayout.marker.markerBoxWidthPx ?? 0;
+    const markerWidth = Number.isFinite(markerWidthRaw) && markerWidthRaw >= 0 ? markerWidthRaw : 0;
+    const gutterWidthRaw = measure.marker.gutterWidth ?? 0;
+    const gutterWidth = Number.isFinite(gutterWidthRaw) && gutterWidthRaw >= 0 ? gutterWidthRaw : 0;
+    return markerWidth + gutterWidth;
+  }
   function layoutParagraphBlock(ctx2, anchors) {
     const { block, measure, columnWidth, ensurePage, advanceColumn, columnX, floatManager } = ctx2;
     const remeasureParagraph2 = ctx2.remeasureParagraph;
@@ -87253,17 +87512,8 @@ ${l}
     const remeasureWidth = Math.max(1, columnWidth - indentLeft - indentRight);
     let didRemeasureForColumnWidth = false;
     if (typeof remeasureParagraph2 === "function" && typeof measurementWidth === "number" && measurementWidth > remeasureWidth) {
-      let firstLineIndent = 0;
-      const wordLayout = block.attrs?.wordLayout;
-      if (wordLayout?.marker && measure.marker) {
-        const markerJustification = wordLayout.marker.justification ?? "left";
-        if (markerJustification === "left") {
-          const markerWidth = measure.marker.markerWidth ?? 0;
-          const gutterWidth = measure.marker.gutterWidth ?? wordLayout.marker.gutterWidthPx ?? 0;
-          firstLineIndent = markerWidth + gutterWidth;
-        }
-      }
-      const newMeasure = remeasureParagraph2(block, remeasureWidth, firstLineIndent);
+      const firstLineIndent = calculateFirstLineIndent(block, measure);
+      const newMeasure = remeasureParagraph2(block, columnWidth, firstLineIndent);
       lines = normalizeLines(newMeasure);
       didRemeasureForColumnWidth = true;
     }
@@ -87344,16 +87594,7 @@ ${l}
       }
       const narrowestRemeasureWidth = Math.max(1, narrowestWidth - indentLeft - indentRight);
       if (narrowestRemeasureWidth < remeasureWidth) {
-        let firstLineIndent = 0;
-        const wordLayout = block.attrs?.wordLayout;
-        if (wordLayout?.marker && measure.marker) {
-          const markerJustification = wordLayout.marker.justification ?? "left";
-          if (markerJustification === "left") {
-            const markerWidth = measure.marker.markerWidth ?? 0;
-            const gutterWidth = measure.marker.gutterWidth ?? wordLayout.marker.gutterWidthPx ?? 0;
-            firstLineIndent = markerWidth + gutterWidth;
-          }
-        }
+        const firstLineIndent = calculateFirstLineIndent(block, measure);
         const newMeasure = remeasureParagraph2(block, narrowestRemeasureWidth, firstLineIndent);
         lines = normalizeLines(newMeasure);
         didRemeasureForFloats = true;
@@ -90500,7 +90741,8 @@ ${l}
     const indentHanging = Math.max(0, indent2?.hanging ?? 0);
     const rawFirstLineOffset = Math.max(0, firstLineIndent || indentFirstLine - indentHanging);
     const contentWidth = Math.max(1, maxWidth - indentLeft - indentRight);
-    const textStartPx = wordLayout?.textStartPx;
+    const markerTextStartX = wordLayout?.marker?.textStartX;
+    const textStartPx = typeof markerTextStartX === "number" && Number.isFinite(markerTextStartX) ? markerTextStartX : typeof wordLayout?.textStartPx === "number" && Number.isFinite(wordLayout.textStartPx) ? wordLayout.textStartPx : void 0;
     const treatAsHanging = textStartPx && indentLeft === 0 && indentHanging === 0;
     const firstLineWidth = typeof textStartPx === "number" && textStartPx > indentLeft && !treatAsHanging ? Math.max(1, maxWidth - textStartPx - indentRight) : Math.max(1, contentWidth - rawFirstLineOffset);
     const tabStops = buildTabStopsPx$1(indent2, attrs?.tabs, attrs?.tabIntervalTwips);
@@ -90512,6 +90754,7 @@ ${l}
       const startRun = currentRun;
       const startChar = currentChar;
       let width = 0;
+      let widthAtLastBreak = -1;
       let lastBreakRun = -1;
       let lastBreakChar = -1;
       let endRun = currentRun;
@@ -90529,6 +90772,7 @@ ${l}
           endChar = 1;
           lastBreakRun = r2;
           lastBreakChar = 1;
+          widthAtLastBreak = width;
           continue;
         }
         const text2 = runText(run2);
@@ -90539,6 +90783,7 @@ ${l}
             if (lastBreakRun >= 0) {
               endRun = lastBreakRun;
               endChar = lastBreakChar;
+              width = widthAtLastBreak >= 0 ? widthAtLastBreak : width;
             } else {
               endRun = r2;
               endChar = c2;
@@ -90553,6 +90798,7 @@ ${l}
           if (ch === " " || ch === "	" || ch === "-") {
             lastBreakRun = r2;
             lastBreakChar = c2 + 1;
+            widthAtLastBreak = width;
           }
         }
         if (didBreakInThisLine) break;
@@ -92263,7 +92509,9 @@ ${l}
         }
         const markerWidth = fragment.markerWidth ?? measure.marker?.markerWidth ?? 0;
         const isListItem3 = markerWidth > 0;
-        const alignmentOverride = isListItem3 ? "left" : void 0;
+        const paraAlignment = block.attrs?.alignment;
+        const isJustified = paraAlignment === "justify" || paraAlignment === "both";
+        const alignmentOverride = isListItem3 && !isJustified ? "left" : void 0;
         const pos = mapPointToPm(block, line, pageRelativePoint.x - fragment.x, isRTL, availableWidth, alignmentOverride);
         if (pos == null) {
           logClickStage("warn", "no-position", {
@@ -92330,7 +92578,9 @@ ${l}
         }
         const cellMarkerWidth = cellMeasure.marker?.markerWidth ?? 0;
         const isListItem3 = cellMarkerWidth > 0;
-        const alignmentOverride = isListItem3 ? "left" : void 0;
+        const cellAlignment = cellBlock.attrs?.alignment;
+        const isJustified = cellAlignment === "justify" || cellAlignment === "both";
+        const alignmentOverride = isListItem3 && !isJustified ? "left" : void 0;
         const pos = mapPointToPm(cellBlock, line, localX, isRTL, availableWidth, alignmentOverride);
         if (pos != null) {
           logClickStage("log", "success", {
@@ -92499,7 +92749,9 @@ ${l}
             const charOffsetTo = pmPosToCharOffset(block, line, sliceTo);
             const markerWidth = fragment.markerWidth ?? measure.marker?.markerWidth ?? 0;
             const isListItemFlag = isListItem(markerWidth, block);
-            const alignmentOverride = isListItemFlag ? "left" : void 0;
+            const blockAlignment = block.attrs?.alignment;
+            const isJustified = blockAlignment === "justify" || blockAlignment === "both";
+            const alignmentOverride = isListItemFlag && !isJustified ? "left" : void 0;
             const startX = mapPmToX(block, line, charOffsetFrom, fragment.width, alignmentOverride);
             const endX = mapPmToX(block, line, charOffsetTo, fragment.width, alignmentOverride);
             const indent2 = extractParagraphIndent(block.attrs?.indent);
@@ -93241,7 +93493,9 @@ ${l}
     const contentWidth = Math.max(1, maxWidth - indentLeft - indentRight);
     const bodyContentWidth = contentWidth;
     let initialAvailableWidth;
-    const textStartPx = wordLayout?.textStartPx;
+    const rawTextStartPx = wordLayout?.textStartPx;
+    const markerTextStartX = wordLayout?.marker?.textStartX;
+    const textStartPx = typeof markerTextStartX === "number" && Number.isFinite(markerTextStartX) ? markerTextStartX : typeof rawTextStartPx === "number" && Number.isFinite(rawTextStartPx) ? rawTextStartPx : void 0;
     if (typeof textStartPx === "number" && textStartPx > indentLeft) {
       initialAvailableWidth = Math.max(1, maxWidth - textStartPx - indentRight);
     } else {
@@ -93376,12 +93630,40 @@ ${l}
         runsToProcess.push(run2);
       }
     }
+    const trimTrailingWrapSpaces = (lineToTrim) => {
+      const lastRun = runsToProcess[lineToTrim.toRun];
+      if (!lastRun || !("text" in lastRun) || typeof lastRun.text !== "string") return;
+      const sliceStart = lineToTrim.toRun === lineToTrim.fromRun ? lineToTrim.fromChar : 0;
+      const sliceEnd = lineToTrim.toChar;
+      if (sliceEnd <= sliceStart) return;
+      const sliceText = lastRun.text.slice(sliceStart, sliceEnd);
+      let trimCount = 0;
+      for (let i2 = sliceText.length - 1; i2 >= 0 && sliceText[i2] === " "; i2 -= 1) {
+        trimCount += 1;
+      }
+      if (trimCount === 0) return;
+      if (lineToTrim.fromRun === lineToTrim.toRun && sliceText.trim().length === 0) {
+        return;
+      }
+      const keptText = sliceText.slice(0, Math.max(0, sliceText.length - trimCount));
+      const { font } = buildFontString(
+        lastRun
+      );
+      const fullWidth = measureRunWidth(sliceText, font, ctx2, lastRun);
+      const keptWidth = keptText.length > 0 ? measureRunWidth(keptText, font, ctx2, lastRun) : 0;
+      const delta = Math.max(0, fullWidth - keptWidth);
+      lineToTrim.width = roundValue(Math.max(0, lineToTrim.width - delta));
+      lineToTrim.spaceCount = Math.max(0, lineToTrim.spaceCount - trimCount);
+      if (lineToTrim.naturalWidth != null && typeof lineToTrim.naturalWidth === "number") {
+        lineToTrim.naturalWidth = roundValue(Math.max(0, lineToTrim.naturalWidth - delta));
+      }
+    };
     for (let runIndex = 0; runIndex < runsToProcess.length; runIndex++) {
       const run2 = runsToProcess[runIndex];
       if (run2.kind === "break") {
         if (currentLine) {
           const metrics = calculateTypographyMetrics(currentLine.maxFontSize, spacing, currentLine.maxFontInfo);
-          const { spaceCount: _sc, ...lineBase } = currentLine;
+          const lineBase = currentLine;
           const completedLine = { ...lineBase, ...metrics };
           addBarTabsToLine(completedLine);
           lines.push(completedLine);
@@ -93426,7 +93708,7 @@ ${l}
             toRun: runIndex,
             toChar: 0,
             width: 0,
-            maxWidth: getEffectiveWidth(initialAvailableWidth),
+            maxWidth: getEffectiveWidth(lines.length === 0 ? initialAvailableWidth : bodyContentWidth),
             segments: [],
             ...metrics
           };
@@ -93461,7 +93743,7 @@ ${l}
             width: 0,
             maxFontSize: 12,
             // Default font size for tabs
-            maxWidth: getEffectiveWidth(initialAvailableWidth),
+            maxWidth: getEffectiveWidth(lines.length === 0 ? initialAvailableWidth : bodyContentWidth),
             segments: [],
             spaceCount: 0
           };
@@ -93511,7 +93793,7 @@ ${l}
             width: imageWidth,
             maxFontSize: imageHeight,
             // Use image height for line height calculation
-            maxWidth: getEffectiveWidth(initialAvailableWidth),
+            maxWidth: getEffectiveWidth(lines.length === 0 ? initialAvailableWidth : bodyContentWidth),
             spaceCount: 0,
             segments: [
               {
@@ -93527,8 +93809,9 @@ ${l}
         }
         const appliedTabAlign = lastAppliedTabAlign;
         if (currentLine.width + imageWidth > currentLine.maxWidth && currentLine.width > 0) {
+          trimTrailingWrapSpaces(currentLine);
           const metrics = calculateTypographyMetrics(currentLine.maxFontSize, spacing, currentLine.maxFontInfo);
-          const { spaceCount: _sc, ...lineBase } = currentLine;
+          const lineBase = currentLine;
           const completedLine = {
             ...lineBase,
             ...metrics
@@ -93601,7 +93884,7 @@ ${l}
             // Field annotations are atomic units
             width: annotationWidth,
             maxFontSize: annotationHeight,
-            maxWidth: getEffectiveWidth(initialAvailableWidth),
+            maxWidth: getEffectiveWidth(lines.length === 0 ? initialAvailableWidth : bodyContentWidth),
             spaceCount: 0,
             segments: [
               {
@@ -93616,8 +93899,9 @@ ${l}
           continue;
         }
         if (currentLine.width + annotationWidth > currentLine.maxWidth && currentLine.width > 0) {
+          trimTrailingWrapSpaces(currentLine);
           const metrics = calculateTypographyMetrics(currentLine.maxFontSize, spacing, currentLine.maxFontInfo);
-          const { spaceCount: _sc, ...lineBase } = currentLine;
+          const lineBase = currentLine;
           const completedLine = {
             ...lineBase,
             ...metrics
@@ -93690,15 +93974,16 @@ ${l}
               width: spacesWidth,
               maxFontSize: run2.fontSize,
               maxFontInfo: getFontInfoFromRun(run2),
-              maxWidth: getEffectiveWidth(initialAvailableWidth),
+              maxWidth: getEffectiveWidth(lines.length === 0 ? initialAvailableWidth : bodyContentWidth),
               segments: [{ runIndex, fromChar: spacesStartChar, toChar: spacesEndChar, width: spacesWidth }],
               spaceCount: spacesLength
             };
           } else {
             const boundarySpacing = currentLine.width > 0 ? run2.letterSpacing ?? 0 : 0;
             if (currentLine.width + boundarySpacing + spacesWidth > currentLine.maxWidth - WIDTH_FUDGE_PX2 && currentLine.width > 0) {
+              trimTrailingWrapSpaces(currentLine);
               const metrics = calculateTypographyMetrics(currentLine.maxFontSize, spacing, currentLine.maxFontInfo);
-              const { spaceCount: _sc, ...lineBase } = currentLine;
+              const lineBase = currentLine;
               const completedLine = {
                 ...lineBase,
                 ...metrics
@@ -93734,6 +94019,13 @@ ${l}
           continue;
         }
         const words = segment.split(" ");
+        let lastNonEmptyWordIndex = -1;
+        for (let i2 = words.length - 1; i2 >= 0; i2 -= 1) {
+          if (words[i2] !== "") {
+            lastNonEmptyWordIndex = i2;
+            break;
+          }
+        }
         let segmentStartX;
         if (currentLine && pendingTabAlignment) {
           segmentStartX = alignSegmentAtTab(segment, font, run2);
@@ -93756,15 +94048,16 @@ ${l}
                 width: singleSpaceWidth,
                 maxFontSize: run2.fontSize,
                 maxFontInfo: getFontInfoFromRun(run2),
-                maxWidth: getEffectiveWidth(initialAvailableWidth),
+                maxWidth: getEffectiveWidth(lines.length === 0 ? initialAvailableWidth : bodyContentWidth),
                 segments: [{ runIndex, fromChar: spaceStartChar, toChar: spaceEndChar, width: singleSpaceWidth }],
                 spaceCount: 1
               };
             } else {
               const boundarySpacing2 = currentLine.width > 0 ? run2.letterSpacing ?? 0 : 0;
               if (currentLine.width + boundarySpacing2 + singleSpaceWidth > currentLine.maxWidth - WIDTH_FUDGE_PX2 && currentLine.width > 0) {
+                trimTrailingWrapSpaces(currentLine);
                 const metrics = calculateTypographyMetrics(currentLine.maxFontSize, spacing, currentLine.maxFontInfo);
-                const { spaceCount: _sc, ...lineBase } = currentLine;
+                const lineBase = currentLine;
                 const completedLine = { ...lineBase, ...metrics };
                 addBarTabsToLine(completedLine);
                 lines.push(completedLine);
@@ -93796,19 +94089,19 @@ ${l}
             charPosInRun = spaceEndChar;
             continue;
           }
-          const isLastWordInSegment = wordIndex === words.length - 1;
-          const isLastWord = isLastWordInSegment && isLastSegment;
           const wordOnlyWidth = measureRunWidth(word, font, ctx2, run2);
-          const spaceWidth = isLastWord ? 0 : measureRunWidth(" ", font, ctx2, run2);
-          const wordCommitWidth = isLastWord ? wordOnlyWidth : wordOnlyWidth + spaceWidth;
+          const shouldIncludeDelimiterSpace = wordIndex < lastNonEmptyWordIndex;
+          const spaceWidth = shouldIncludeDelimiterSpace ? measureRunWidth(" ", font, ctx2, run2) : 0;
+          const wordCommitWidth = wordOnlyWidth + spaceWidth;
           const wordStartChar = charPosInRun;
           const wordEndNoSpace = charPosInRun + word.length;
-          const wordEndWithSpace = charPosInRun + (isLastWord ? word.length : word.length + 1);
+          const wordEndWithSpace = wordEndNoSpace + (shouldIncludeDelimiterSpace ? 1 : 0);
           const effectiveMaxWidth = currentLine ? currentLine.maxWidth : getEffectiveWidth(lines.length === 0 ? initialAvailableWidth : contentWidth);
           if (wordOnlyWidth > effectiveMaxWidth && word.length > 1) {
             if (currentLine && currentLine.width > 0 && currentLine.segments && currentLine.segments.length > 0) {
+              trimTrailingWrapSpaces(currentLine);
               const metrics = calculateTypographyMetrics(currentLine.maxFontSize, spacing, currentLine.maxFontInfo);
-              const { spaceCount: _sc, ...lineBase } = currentLine;
+              const lineBase = currentLine;
               const completedLine = { ...lineBase, ...metrics };
               addBarTabsToLine(completedLine);
               lines.push(completedLine);
@@ -93842,7 +94135,7 @@ ${l}
                 });
                 if (isLastChunk) {
                   const ls = run2.letterSpacing ?? 0;
-                  if (!isLastWord && currentLine.width + spaceWidth <= currentLine.maxWidth - WIDTH_FUDGE_PX2) {
+                  if (shouldIncludeDelimiterSpace && currentLine.width + spaceWidth <= currentLine.maxWidth - WIDTH_FUDGE_PX2) {
                     currentLine.toChar = wordEndWithSpace;
                     currentLine.width = roundValue(currentLine.width + spaceWidth + ls);
                     charPosInRun = wordEndWithSpace;
@@ -93851,8 +94144,9 @@ ${l}
                     charPosInRun = wordEndWithSpace;
                   }
                 } else {
+                  trimTrailingWrapSpaces(currentLine);
                   const metrics = calculateTypographyMetrics(currentLine.maxFontSize, spacing, currentLine.maxFontInfo);
-                  const { spaceCount: _sc, ...lineBase } = currentLine;
+                  const lineBase = currentLine;
                   const completedLine = { ...lineBase, ...metrics };
                   addBarTabsToLine(completedLine);
                   lines.push(completedLine);
@@ -93874,7 +94168,7 @@ ${l}
                   spaceCount: 0
                 };
                 const ls = run2.letterSpacing ?? 0;
-                if (!isLastWord && currentLine.width + spaceWidth <= currentLine.maxWidth - WIDTH_FUDGE_PX2) {
+                if (shouldIncludeDelimiterSpace && currentLine.width + spaceWidth <= currentLine.maxWidth - WIDTH_FUDGE_PX2) {
                   currentLine.toChar = wordEndWithSpace;
                   currentLine.width = roundValue(currentLine.width + spaceWidth + ls);
                   charPosInRun = wordEndWithSpace;
@@ -93911,12 +94205,12 @@ ${l}
               width: wordOnlyWidth,
               maxFontSize: run2.fontSize,
               maxFontInfo: getFontInfoFromRun(run2),
-              maxWidth: getEffectiveWidth(initialAvailableWidth),
+              maxWidth: getEffectiveWidth(lines.length === 0 ? initialAvailableWidth : bodyContentWidth),
               segments: [{ runIndex, fromChar: wordStartChar, toChar: wordEndNoSpace, width: wordOnlyWidth }],
               spaceCount: 0
             };
             const ls = run2.letterSpacing ?? 0;
-            if (!isLastWord && currentLine.width + spaceWidth <= currentLine.maxWidth - WIDTH_FUDGE_PX2) {
+            if (shouldIncludeDelimiterSpace && currentLine.width + spaceWidth <= currentLine.maxWidth - WIDTH_FUDGE_PX2) {
               currentLine.toChar = wordEndWithSpace;
               currentLine.width = roundValue(currentLine.width + spaceWidth + ls);
               charPosInRun = wordEndWithSpace;
@@ -93930,15 +94224,16 @@ ${l}
           const boundarySpacing = currentLine.width > 0 ? run2.letterSpacing ?? 0 : 0;
           const justifyAlignment = block.attrs?.alignment === "justify";
           const totalWidthWithWord = currentLine.width + boundarySpacing + wordCommitWidth + // Safe cast: only TextRuns produce word segments from split(), other run types are handled earlier
-          (isLastWord ? 0 : run2.letterSpacing ?? 0);
+          (shouldIncludeDelimiterSpace ? run2.letterSpacing ?? 0 : 0);
           const availableWidth = currentLine.maxWidth - WIDTH_FUDGE_PX2;
           let shouldBreak = currentLine.width + boundarySpacing + wordOnlyWidth > availableWidth && currentLine.width > 0 && !isTocEntry;
           let compressedWidth = null;
           if (shouldBreak && justifyAlignment) {
-            const isParagraphLastWord = isLastWord && runIndex === runsToProcess.length - 1;
+            const isLastNonEmptyWordInSegment = wordIndex === lastNonEmptyWordIndex;
+            const isParagraphLastWord = isLastSegment && isLastNonEmptyWordInSegment && runIndex === runsToProcess.length - 1;
             if (!isParagraphLastWord) {
               const existingSpaces = currentLine.spaceCount ?? 0;
-              const candidateSpaces = existingSpaces + (isLastWord ? 0 : 1);
+              const candidateSpaces = existingSpaces + (shouldIncludeDelimiterSpace ? 1 : 0);
               if (candidateSpaces > 0) {
                 const overflow = totalWidthWithWord - availableWidth;
                 if (overflow > 0) {
@@ -93954,8 +94249,9 @@ ${l}
             }
           }
           if (shouldBreak) {
+            trimTrailingWrapSpaces(currentLine);
             const metrics = calculateTypographyMetrics(currentLine.maxFontSize, spacing, currentLine.maxFontInfo);
-            const { spaceCount: _sc, ...lineBase } = currentLine;
+            const lineBase = currentLine;
             const completedLine = {
               ...lineBase,
               ...metrics
@@ -93976,7 +94272,7 @@ ${l}
               segments: [{ runIndex, fromChar: wordStartChar, toChar: wordEndNoSpace, width: wordOnlyWidth }],
               spaceCount: 0
             };
-            if (!isLastWord && currentLine.width + spaceWidth <= currentLine.maxWidth - WIDTH_FUDGE_PX2) {
+            if (shouldIncludeDelimiterSpace && currentLine.width + spaceWidth <= currentLine.maxWidth - WIDTH_FUDGE_PX2) {
               currentLine.toChar = wordEndWithSpace;
               currentLine.width = roundValue(currentLine.width + spaceWidth + (run2.letterSpacing ?? 0));
               charPosInRun = wordEndWithSpace;
@@ -93986,7 +94282,7 @@ ${l}
             }
           } else {
             currentLine.toRun = runIndex;
-            if (!isLastWord && currentLine.width + boundarySpacing + wordOnlyWidth + spaceWidth > currentLine.maxWidth - WIDTH_FUDGE_PX2) {
+            if (shouldIncludeDelimiterSpace && currentLine.width + boundarySpacing + wordOnlyWidth + spaceWidth > currentLine.maxWidth - WIDTH_FUDGE_PX2) {
               currentLine.toChar = wordEndNoSpace;
               currentLine.width = roundValue(currentLine.width + boundarySpacing + wordOnlyWidth);
               currentLine.maxFontInfo = updateMaxFontInfo(currentLine.maxFontSize, currentLine.maxFontInfo, run2);
@@ -94000,8 +94296,9 @@ ${l}
                 wordOnlyWidth,
                 useExplicitXHere ? segmentStartX : void 0
               );
+              trimTrailingWrapSpaces(currentLine);
               const metrics = calculateTypographyMetrics(currentLine.maxFontSize, spacing, currentLine.maxFontInfo);
-              const { spaceCount: _sc, ...lineBase } = currentLine;
+              const lineBase = currentLine;
               const completedLine = { ...lineBase, ...metrics };
               addBarTabsToLine(completedLine);
               lines.push(completedLine);
@@ -94011,20 +94308,23 @@ ${l}
               charPosInRun = wordEndNoSpace + 1;
               continue;
             }
-            const newToChar = isLastWord ? wordEndNoSpace : wordEndWithSpace;
+            const newToChar = shouldIncludeDelimiterSpace ? wordEndWithSpace : wordEndNoSpace;
             currentLine.toChar = newToChar;
             const useExplicitX = wordIndex === 0 && segmentStartX !== void 0;
             const explicitX = useExplicitX ? segmentStartX : void 0;
-            const targetWidth = compressedWidth != null ? compressedWidth : currentLine.width + boundarySpacing + wordCommitWidth + (isLastWord ? 0 : run2.letterSpacing ?? 0);
+            const targetWidth = compressedWidth != null ? compressedWidth : currentLine.width + boundarySpacing + wordCommitWidth + (shouldIncludeDelimiterSpace ? run2.letterSpacing ?? 0 : 0);
+            if (compressedWidth != null) {
+              currentLine.naturalWidth = roundValue(totalWidthWithWord);
+            }
             currentLine.width = roundValue(targetWidth);
             currentLine.maxFontInfo = updateMaxFontInfo(currentLine.maxFontSize, currentLine.maxFontInfo, run2);
             currentLine.maxFontSize = Math.max(currentLine.maxFontSize, run2.fontSize);
             appendSegment(currentLine.segments, runIndex, wordStartChar, newToChar, wordCommitWidth, explicitX);
-            if (!isLastWord) {
+            if (shouldIncludeDelimiterSpace) {
               currentLine.spaceCount += 1;
             }
           }
-          charPosInRun = isLastWord ? wordEndNoSpace : wordEndWithSpace;
+          charPosInRun = shouldIncludeDelimiterSpace ? wordEndWithSpace : wordEndNoSpace;
         }
         if (lastAppliedTabAlign && currentLine) {
           const appliedTab = lastAppliedTabAlign;
@@ -94044,7 +94344,7 @@ ${l}
               width: 0,
               maxFontSize: run2.fontSize,
               maxFontInfo: getFontInfoFromRun(run2),
-              maxWidth: getEffectiveWidth(initialAvailableWidth),
+              maxWidth: getEffectiveWidth(lines.length === 0 ? initialAvailableWidth : bodyContentWidth),
               segments: [],
               spaceCount: 0
             };
@@ -94076,8 +94376,8 @@ ${l}
       }
     }
     if (!currentLine && lines.length === 0) {
-      const fallbackFontSize = (block.runs[0]?.kind === "text" ? block.runs[0].fontSize : void 0) ?? 12;
-      const metrics = calculateTypographyMetrics(fallbackFontSize, spacing);
+      const uiDisplayFallbackFontSize = (block.runs[0]?.kind === "text" ? block.runs[0].fontSize : void 0) ?? 12;
+      const metrics = calculateTypographyMetrics(uiDisplayFallbackFontSize, spacing);
       const fallbackLine = {
         fromRun: 0,
         fromChar: 0,
@@ -94092,7 +94392,7 @@ ${l}
     }
     if (currentLine) {
       const metrics = calculateTypographyMetrics(currentLine.maxFontSize, spacing, currentLine.maxFontInfo);
-      const { spaceCount: _sc, ...lineBase } = currentLine;
+      const lineBase = currentLine;
       const finalLine = {
         ...lineBase,
         ...metrics
@@ -118714,316 +119014,6 @@ ${l}
     paste: pasteIconSvg,
     strikethrough: strikethroughSvg
   };
-  const _hoisted_1$4$2 = { class: "toolbar-icon" };
-  const _hoisted_2$3$2 = ["innerHTML"];
-  const _sfc_main$5$2 = {
-    __name: "ToolbarButtonIcon",
-    props: {
-      name: {
-        type: String,
-        required: true
-      },
-      color: {
-        type: String,
-        default: null
-      },
-      icon: {
-        type: String,
-        default: null
-      }
-    },
-    setup(__props) {
-      const props = __props;
-      const getBarColor = computed(() => {
-        if (props.name === "color") return { backgroundColor: props.color || "#111111" };
-        if (props.name === "highlight") return { backgroundColor: props.color || "#D6D6D6" };
-      });
-      const hasColorBar = computed(() => {
-        return ["color", "highlight"].includes(props.name);
-      });
-      return (_ctx, _cache) => {
-        return openBlock(), createElementBlock("div", _hoisted_1$4$2, [
-          createBaseVNode("div", {
-            class: normalizeClass(["toolbar-icon__icon", [`toolbar-icon__icon--${props.name}`]]),
-            innerHTML: __props.icon
-          }, null, 10, _hoisted_2$3$2),
-          hasColorBar.value ? (openBlock(), createElementBlock("div", {
-            key: 0,
-            class: "color-bar",
-            style: normalizeStyle(getBarColor.value)
-          }, null, 4)) : createCommentVNode("", true)
-        ]);
-      };
-    }
-  };
-  const ToolbarButtonIcon = /* @__PURE__ */ _export_sfc$1(_sfc_main$5$2, [["__scopeId", "data-v-6d7523ab"]]);
-  const _hoisted_1$3$2 = ["role", "aria-label", "onKeydown"];
-  const _hoisted_2$2$2 = ["data-item"];
-  const _hoisted_3$2$2 = {
-    key: 1,
-    class: "button-label"
-  };
-  const _hoisted_4$1$2 = { key: 2 };
-  const _hoisted_5$5 = ["onKeydown", "id"];
-  const _hoisted_6$3 = ["placeholder", "onKeydown", "id"];
-  const _hoisted_7$3 = ["innerHTML"];
-  const _hoisted_8$3 = {
-    "aria-live": "polite",
-    class: "visually-hidden"
-  };
-  const _sfc_main$4$2 = {
-    __name: "ToolbarButton",
-    props: {
-      iconColor: {
-        type: String,
-        default: null
-      },
-      active: {
-        type: Boolean,
-        default: false
-      },
-      isNarrow: {
-        type: Boolean,
-        default: false
-      },
-      isWide: {
-        type: Boolean,
-        default: false
-      },
-      toolbarItem: {
-        type: Object,
-        required: true
-      },
-      defaultLabel: {
-        type: String,
-        default: null
-      },
-      isOverflowItem: {
-        type: Boolean,
-        default: false
-      }
-    },
-    emits: ["buttonClick", "textSubmit"],
-    setup(__props, { emit: __emit }) {
-      const emit2 = __emit;
-      const props = __props;
-      const {
-        name,
-        active,
-        icon,
-        label,
-        hideLabel,
-        iconColor,
-        hasCaret,
-        disabled,
-        inlineTextInputVisible,
-        hasInlineTextInput,
-        minWidth,
-        style: style2,
-        attributes
-      } = props.toolbarItem;
-      const inlineTextInput = ref(label);
-      const inlineInput = ref(null);
-      const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode$1();
-      const handleClick2 = () => {
-        if (hasInlineTextInput) {
-          nextTick(() => {
-            inlineInput.value?.focus();
-            inlineInput.value?.select();
-          });
-        }
-        emit2("buttonClick");
-      };
-      const handleInputSubmit = () => {
-        const value = inlineTextInput.value;
-        const cleanValue = value.match(/^\d+(\.5)?$/) ? value : Math.floor(parseFloat(value)).toString();
-        emit2("textSubmit", cleanValue);
-        inlineTextInput.value = cleanValue;
-      };
-      const getStyle = computed(() => {
-        if (style2.value) return style2.value;
-        return {
-          minWidth: props.minWidth
-        };
-      });
-      const caretIcon = computed(() => {
-        return active.value ? toolbarIcons.dropdownCaretUp : toolbarIcons.dropdownCaretDown;
-      });
-      return (_ctx, _cache) => {
-        return openBlock(), createElementBlock("div", {
-          class: normalizeClass(["toolbar-item", unref(attributes).className]),
-          style: normalizeStyle(getStyle.value),
-          role: __props.isOverflowItem ? "menuitem" : "button",
-          "aria-label": unref(attributes).ariaLabel,
-          onClick: handleClick2,
-          onKeydown: withKeys(withModifiers(handleClick2, ["stop"]), ["enter"]),
-          tabindex: "0"
-        }, [
-          createBaseVNode("div", {
-            class: normalizeClass(["toolbar-button", {
-              active: unref(active),
-              disabled: unref(disabled),
-              narrow: __props.isNarrow,
-              wide: __props.isWide,
-              "has-inline-text-input": unref(hasInlineTextInput),
-              "high-contrast": unref(isHighContrastMode2)
-            }]),
-            "data-item": `btn-${unref(name) || ""}`
-          }, [
-            unref(icon) ? (openBlock(), createBlock(ToolbarButtonIcon, {
-              key: 0,
-              color: unref(iconColor),
-              class: "toolbar-icon",
-              icon: unref(icon),
-              name: unref(name)
-            }, null, 8, ["color", "icon", "name"])) : createCommentVNode("", true),
-            unref(label) && !unref(hideLabel) && !unref(inlineTextInputVisible) ? (openBlock(), createElementBlock("div", _hoisted_3$2$2, toDisplayString(unref(label)), 1)) : createCommentVNode("", true),
-            unref(inlineTextInputVisible) ? (openBlock(), createElementBlock("span", _hoisted_4$1$2, [
-              unref(name) === "fontSize" ? withDirectives((openBlock(), createElementBlock("input", {
-                key: 0,
-                "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inlineTextInput.value = $event),
-                onKeydown: withKeys(withModifiers(handleInputSubmit, ["prevent"]), ["enter"]),
-                type: "text",
-                class: normalizeClass(["button-text-input button-text-input--font-size", { "high-contrast": unref(isHighContrastMode2) }]),
-                id: "inlineTextInput-" + unref(name),
-                autocomplete: "off",
-                ref_key: "inlineInput",
-                ref: inlineInput
-              }, null, 42, _hoisted_5$5)), [
-                [vModelText, inlineTextInput.value]
-              ]) : withDirectives((openBlock(), createElementBlock("input", {
-                key: 1,
-                "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => inlineTextInput.value = $event),
-                placeholder: unref(label),
-                onKeydown: withKeys(withModifiers(handleInputSubmit, ["prevent"]), ["enter"]),
-                type: "text",
-                class: "button-text-input",
-                id: "inlineTextInput-" + unref(name),
-                autocomplete: "off",
-                ref_key: "inlineInput",
-                ref: inlineInput
-              }, null, 40, _hoisted_6$3)), [
-                [vModelText, inlineTextInput.value]
-              ])
-            ])) : createCommentVNode("", true),
-            unref(hasCaret) ? (openBlock(), createElementBlock("div", {
-              key: 3,
-              class: "dropdown-caret",
-              innerHTML: caretIcon.value,
-              style: normalizeStyle({ opacity: unref(disabled) ? 0.6 : 1 })
-            }, null, 12, _hoisted_7$3)) : createCommentVNode("", true),
-            createBaseVNode("div", _hoisted_8$3, toDisplayString(`${unref(attributes).ariaLabel} ${unref(active) ? "selected" : "unset"}`), 1)
-          ], 10, _hoisted_2$2$2)
-        ], 46, _hoisted_1$3$2);
-      };
-    }
-  };
-  const ToolbarButton = /* @__PURE__ */ _export_sfc$1(_sfc_main$4$2, [["__scopeId", "data-v-ea93b080"]]);
-  const _hoisted_1$2$2 = {
-    class: "toolbar-separator",
-    role: "separator",
-    "aria-label": "Toolbar separator"
-  };
-  const _sfc_main$3$2 = {
-    __name: "ToolbarSeparator",
-    props: {
-      active: {
-        type: Boolean,
-        default: false
-      }
-    },
-    emits: ["command"],
-    setup(__props, { emit: __emit }) {
-      const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode$1();
-      const getSeparatorColor = () => {
-        if (isHighContrastMode2.value) {
-          return "#000";
-        }
-        return "#dbdbdb";
-      };
-      return (_ctx, _cache) => {
-        return openBlock(), createElementBlock("div", _hoisted_1$2$2, [
-          createBaseVNode("div", {
-            class: "separator-inner",
-            style: normalizeStyle({ backgroundColor: getSeparatorColor() })
-          }, null, 4)
-        ]);
-      };
-    }
-  };
-  const ToolbarSeparator = /* @__PURE__ */ _export_sfc$1(_sfc_main$3$2, [["__scopeId", "data-v-4ef9aa18"]]);
-  const _hoisted_1$1$2 = { class: "overflow-menu" };
-  const _hoisted_2$1$2 = { class: "overflow-menu-trigger" };
-  const _hoisted_3$1$2 = {
-    key: 0,
-    class: "overflow-menu_items",
-    role: "group"
-  };
-  const _sfc_main$2$2 = {
-    __name: "OverflowMenu",
-    props: {
-      toolbarItem: {
-        type: Object,
-        required: true
-      },
-      overflowItems: {
-        type: Array,
-        required: true
-      }
-    },
-    emits: ["buttonClick", "close"],
-    setup(__props, { emit: __emit }) {
-      const { proxy } = getCurrentInstance();
-      const emit2 = __emit;
-      const props = __props;
-      const isOverflowMenuOpened = computed(() => props.toolbarItem.expand.value);
-      const hasOpenDropdown = ref(false);
-      const overflowToolbarItem = computed(() => ({
-        ...props.toolbarItem,
-        active: isOverflowMenuOpened.value
-      }));
-      const toggleOverflowMenu = () => {
-        emit2("buttonClick", props.toolbarItem);
-      };
-      const handleCommand = ({ item, argument }) => {
-        proxy.$toolbar.emitCommand({ item, argument });
-      };
-      const handleKeyDown2 = (e) => {
-        if (e.key === "Escape") {
-          if (isOverflowMenuOpened.value && !hasOpenDropdown.value) {
-            e.preventDefault();
-            emit2("close");
-          }
-        }
-      };
-      onMounted(() => {
-        document.addEventListener("keydown", handleKeyDown2, true);
-      });
-      onBeforeUnmount(() => {
-        document.removeEventListener("keydown", handleKeyDown2, true);
-      });
-      return (_ctx, _cache) => {
-        return openBlock(), createElementBlock("div", _hoisted_1$1$2, [
-          createBaseVNode("div", _hoisted_2$1$2, [
-            createVNode(ToolbarButton, {
-              "toolbar-item": overflowToolbarItem.value,
-              onButtonClick: toggleOverflowMenu
-            }, null, 8, ["toolbar-item"])
-          ]),
-          isOverflowMenuOpened.value ? (openBlock(), createElementBlock("div", _hoisted_3$1$2, [
-            createVNode(ButtonGroup, {
-              class: "superdoc-toolbar-overflow",
-              "toolbar-items": __props.overflowItems,
-              "from-overflow": "",
-              onCommand: handleCommand,
-              onDropdownUpdateShow: _cache[0] || (_cache[0] = ($event) => hasOpenDropdown.value = $event)
-            }, null, 8, ["toolbar-items"])
-          ])) : createCommentVNode("", true)
-        ]);
-      };
-    }
-  };
-  const OverflowMenu = /* @__PURE__ */ _export_sfc$1(_sfc_main$2$2, [["__scopeId", "data-v-ef28da92"]]);
   function plugin$1$1(options) {
     let _bPrefix = ".";
     let _ePrefix = "__";
@@ -122634,30 +122624,30 @@ ${style2}
   function useConfig$1(props = {}, options = {
     defaultBordered: true
   }) {
-    const NConfigProvider = inject(configProviderInjectionKey$1, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey$1, null);
     return {
       // NConfigProvider,
-      inlineThemeDisabled: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.inlineThemeDisabled,
-      mergedRtlRef: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedRtlRef,
-      mergedComponentPropsRef: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedComponentPropsRef,
-      mergedBreakpointsRef: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedBreakpointsRef,
+      inlineThemeDisabled: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.inlineThemeDisabled,
+      mergedRtlRef: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedRtlRef,
+      mergedComponentPropsRef: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedComponentPropsRef,
+      mergedBreakpointsRef: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBreakpointsRef,
       mergedBorderedRef: computed(() => {
         var _a2, _b2;
         const {
           bordered
         } = props;
         if (bordered !== void 0) return bordered;
-        return (_b2 = (_a2 = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedBorderedRef.value) !== null && _a2 !== void 0 ? _a2 : options.defaultBordered) !== null && _b2 !== void 0 ? _b2 : true;
+        return (_b2 = (_a2 = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBorderedRef.value) !== null && _a2 !== void 0 ? _a2 : options.defaultBordered) !== null && _b2 !== void 0 ? _b2 : true;
       }),
-      mergedClsPrefixRef: NConfigProvider ? NConfigProvider.mergedClsPrefixRef : shallowRef(defaultClsPrefix$1),
-      namespaceRef: computed(() => NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedNamespaceRef.value)
+      mergedClsPrefixRef: NConfigProvider2 ? NConfigProvider2.mergedClsPrefixRef : shallowRef(defaultClsPrefix$1),
+      namespaceRef: computed(() => NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedNamespaceRef.value)
     };
   }
   function useThemeClass$1(componentName, hashRef, cssVarsRef, props) {
     if (!cssVarsRef) throwError$1("useThemeClass", "cssVarsRef is not passed");
-    const NConfigProvider = inject(configProviderInjectionKey$1, null);
-    const mergedThemeHashRef = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedThemeHashRef;
-    const styleMountTarget = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget;
+    const NConfigProvider2 = inject(configProviderInjectionKey$1, null);
+    const mergedThemeHashRef = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeHashRef;
+    const styleMountTarget = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget;
     const themeClassRef = ref("");
     const ssrAdapter2 = useSsrAdapter$1();
     let renderCallback;
@@ -124002,7 +123992,7 @@ ${style2}
       }
       return componentRtlState;
     });
-    const NConfigProvider = inject(configProviderInjectionKey$1, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey$1, null);
     const mountStyle = () => {
       watchEffect(() => {
         const {
@@ -124022,7 +124012,7 @@ ${style2}
             bPrefix: clsPrefix ? `.${clsPrefix}-` : void 0
           },
           ssr: ssrAdapter2,
-          parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+          parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
         });
       });
     };
@@ -124080,7 +124070,7 @@ ${style2}
   }
   function useTheme$1(resolveId, mountId, style2, defaultTheme, props, clsPrefixRef) {
     const ssrAdapter2 = useSsrAdapter$1();
-    const NConfigProvider = inject(configProviderInjectionKey$1, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey$1, null);
     if (style2) {
       const mountStyle = () => {
         const clsPrefix = clsPrefixRef === null || clsPrefixRef === void 0 ? void 0 : clsPrefixRef.value;
@@ -124092,15 +124082,15 @@ ${style2}
           },
           anchorMetaName: cssrAnchorMetaName$2,
           ssr: ssrAdapter2,
-          parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+          parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
         });
-        if (!(NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.preflightStyleDisabled)) {
+        if (!(NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.preflightStyleDisabled)) {
           globalStyle$1.mount({
             id: "n-global",
             head: true,
             anchorMetaName: cssrAnchorMetaName$2,
             ssr: ssrAdapter2,
-            parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+            parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
           });
         }
       };
@@ -124132,11 +124122,11 @@ ${style2}
           self: globalSelf = void 0,
           peers: globalPeers = {}
         } = {}
-      } = (NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedThemeRef.value) || {};
+      } = (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeRef.value) || {};
       const {
         common: globalCommonOverrides = void 0,
         [resolveId]: globalSelfOverrides = {}
-      } = (NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedThemeOverridesRef.value) || {};
+      } = (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeOverridesRef.value) || {};
       const {
         common: globalSelfCommonOverrides,
         peers: globalPeersOverrides = {}
@@ -126894,6 +126884,209 @@ ${style2}
       });
     }
   });
+  const configProviderProps$1 = {
+    abstract: Boolean,
+    bordered: {
+      type: Boolean,
+      default: void 0
+    },
+    clsPrefix: String,
+    locale: Object,
+    dateLocale: Object,
+    namespace: String,
+    rtl: Array,
+    tag: {
+      type: String,
+      default: "div"
+    },
+    hljs: Object,
+    katex: Object,
+    theme: Object,
+    themeOverrides: Object,
+    componentOptions: Object,
+    icons: Object,
+    breakpoints: Object,
+    preflightStyleDisabled: Boolean,
+    styleMountTarget: Object,
+    inlineThemeDisabled: {
+      type: Boolean,
+      default: void 0
+    },
+    // deprecated
+    as: {
+      type: String,
+      validator: () => {
+        warn$3("config-provider", "`as` is deprecated, please use `tag` instead.");
+        return true;
+      },
+      default: void 0
+    }
+  };
+  const NConfigProvider$1 = /* @__PURE__ */ defineComponent({
+    name: "ConfigProvider",
+    alias: ["App"],
+    props: configProviderProps$1,
+    setup(props) {
+      const NConfigProvider2 = inject(configProviderInjectionKey$1, null);
+      const mergedThemeRef = computed(() => {
+        const {
+          theme
+        } = props;
+        if (theme === null) return void 0;
+        const inheritedTheme = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeRef.value;
+        return theme === void 0 ? inheritedTheme : inheritedTheme === void 0 ? theme : Object.assign({}, inheritedTheme, theme);
+      });
+      const mergedThemeOverridesRef = computed(() => {
+        const {
+          themeOverrides
+        } = props;
+        if (themeOverrides === null) return void 0;
+        if (themeOverrides === void 0) {
+          return NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeOverridesRef.value;
+        } else {
+          const inheritedThemeOverrides = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeOverridesRef.value;
+          if (inheritedThemeOverrides === void 0) {
+            return themeOverrides;
+          } else {
+            return merge$1$1({}, inheritedThemeOverrides, themeOverrides);
+          }
+        }
+      });
+      const mergedNamespaceRef = useMemo$1(() => {
+        const {
+          namespace: namespace2
+        } = props;
+        return namespace2 === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedNamespaceRef.value : namespace2;
+      });
+      const mergedBorderedRef = useMemo$1(() => {
+        const {
+          bordered
+        } = props;
+        return bordered === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBorderedRef.value : bordered;
+      });
+      const mergedIconsRef = computed(() => {
+        const {
+          icons: icons2
+        } = props;
+        return icons2 === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedIconsRef.value : icons2;
+      });
+      const mergedComponentPropsRef = computed(() => {
+        const {
+          componentOptions
+        } = props;
+        if (componentOptions !== void 0) return componentOptions;
+        return NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedComponentPropsRef.value;
+      });
+      const mergedClsPrefixRef = computed(() => {
+        const {
+          clsPrefix
+        } = props;
+        if (clsPrefix !== void 0) return clsPrefix;
+        if (NConfigProvider2) return NConfigProvider2.mergedClsPrefixRef.value;
+        return defaultClsPrefix$1;
+      });
+      const mergedRtlRef = computed(() => {
+        var _a2;
+        const {
+          rtl
+        } = props;
+        if (rtl === void 0) {
+          return NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedRtlRef.value;
+        }
+        const rtlEnabledState = {};
+        for (const rtlInfo of rtl) {
+          rtlEnabledState[rtlInfo.name] = markRaw(rtlInfo);
+          (_a2 = rtlInfo.peers) === null || _a2 === void 0 ? void 0 : _a2.forEach((peerRtlInfo) => {
+            if (!(peerRtlInfo.name in rtlEnabledState)) {
+              rtlEnabledState[peerRtlInfo.name] = markRaw(peerRtlInfo);
+            }
+          });
+        }
+        return rtlEnabledState;
+      });
+      const mergedBreakpointsRef = computed(() => {
+        return props.breakpoints || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBreakpointsRef.value);
+      });
+      const inlineThemeDisabled = props.inlineThemeDisabled || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.inlineThemeDisabled);
+      const preflightStyleDisabled = props.preflightStyleDisabled || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.preflightStyleDisabled);
+      const styleMountTarget = props.styleMountTarget || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget);
+      const mergedThemeHashRef = computed(() => {
+        const {
+          value: theme
+        } = mergedThemeRef;
+        const {
+          value: mergedThemeOverrides
+        } = mergedThemeOverridesRef;
+        const hasThemeOverrides = mergedThemeOverrides && Object.keys(mergedThemeOverrides).length !== 0;
+        const themeName = theme === null || theme === void 0 ? void 0 : theme.name;
+        if (themeName) {
+          if (hasThemeOverrides) {
+            return `${themeName}-${murmur2$1(JSON.stringify(mergedThemeOverridesRef.value))}`;
+          }
+          return themeName;
+        } else {
+          if (hasThemeOverrides) {
+            return murmur2$1(JSON.stringify(mergedThemeOverridesRef.value));
+          }
+          return "";
+        }
+      });
+      provide(configProviderInjectionKey$1, {
+        mergedThemeHashRef,
+        mergedBreakpointsRef,
+        mergedRtlRef,
+        mergedIconsRef,
+        mergedComponentPropsRef,
+        mergedBorderedRef,
+        mergedNamespaceRef,
+        mergedClsPrefixRef,
+        mergedLocaleRef: computed(() => {
+          const {
+            locale
+          } = props;
+          if (locale === null) return void 0;
+          return locale === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedLocaleRef.value : locale;
+        }),
+        mergedDateLocaleRef: computed(() => {
+          const {
+            dateLocale
+          } = props;
+          if (dateLocale === null) return void 0;
+          return dateLocale === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedDateLocaleRef.value : dateLocale;
+        }),
+        mergedHljsRef: computed(() => {
+          const {
+            hljs
+          } = props;
+          return hljs === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedHljsRef.value : hljs;
+        }),
+        mergedKatexRef: computed(() => {
+          const {
+            katex
+          } = props;
+          return katex === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedKatexRef.value : katex;
+        }),
+        mergedThemeRef,
+        mergedThemeOverridesRef,
+        inlineThemeDisabled: inlineThemeDisabled || false,
+        preflightStyleDisabled: preflightStyleDisabled || false,
+        styleMountTarget
+      });
+      return {
+        mergedClsPrefix: mergedClsPrefixRef,
+        mergedBordered: mergedBorderedRef,
+        mergedNamespace: mergedNamespaceRef,
+        mergedTheme: mergedThemeRef,
+        mergedThemeOverrides: mergedThemeOverridesRef
+      };
+    },
+    render() {
+      var _a2, _b2, _c, _d;
+      return !this.abstract ? h$1(this.as || this.tag, {
+        class: `${this.mergedClsPrefix || defaultClsPrefix$1}-config-provider`
+      }, (_b2 = (_a2 = this.$slots).default) === null || _b2 === void 0 ? void 0 : _b2.call(_a2)) : (_d = (_c = this.$slots).default) === null || _d === void 0 ? void 0 : _d.call(_c);
+    }
+  });
   const commonVariables$5 = {
     padding: "4px 0",
     optionIconSizeSmall: "14px",
@@ -128371,6 +128564,316 @@ ${style2}
       return child;
     }
   });
+  const _hoisted_1$4$2 = { class: "toolbar-icon" };
+  const _hoisted_2$3$2 = ["innerHTML"];
+  const _sfc_main$5$2 = {
+    __name: "ToolbarButtonIcon",
+    props: {
+      name: {
+        type: String,
+        required: true
+      },
+      color: {
+        type: String,
+        default: null
+      },
+      icon: {
+        type: String,
+        default: null
+      }
+    },
+    setup(__props) {
+      const props = __props;
+      const getBarColor = computed(() => {
+        if (props.name === "color") return { backgroundColor: props.color || "#111111" };
+        if (props.name === "highlight") return { backgroundColor: props.color || "#D6D6D6" };
+      });
+      const hasColorBar = computed(() => {
+        return ["color", "highlight"].includes(props.name);
+      });
+      return (_ctx, _cache) => {
+        return openBlock(), createElementBlock("div", _hoisted_1$4$2, [
+          createBaseVNode("div", {
+            class: normalizeClass(["toolbar-icon__icon", [`toolbar-icon__icon--${props.name}`]]),
+            innerHTML: __props.icon
+          }, null, 10, _hoisted_2$3$2),
+          hasColorBar.value ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: "color-bar",
+            style: normalizeStyle(getBarColor.value)
+          }, null, 4)) : createCommentVNode("", true)
+        ]);
+      };
+    }
+  };
+  const ToolbarButtonIcon = /* @__PURE__ */ _export_sfc$1(_sfc_main$5$2, [["__scopeId", "data-v-6d7523ab"]]);
+  const _hoisted_1$3$2 = ["role", "aria-label", "onKeydown"];
+  const _hoisted_2$2$2 = ["data-item"];
+  const _hoisted_3$2$2 = {
+    key: 1,
+    class: "button-label"
+  };
+  const _hoisted_4$1$2 = { key: 2 };
+  const _hoisted_5$5 = ["onKeydown", "id"];
+  const _hoisted_6$3 = ["placeholder", "onKeydown", "id"];
+  const _hoisted_7$3 = ["innerHTML"];
+  const _hoisted_8$3 = {
+    "aria-live": "polite",
+    class: "visually-hidden"
+  };
+  const _sfc_main$4$2 = {
+    __name: "ToolbarButton",
+    props: {
+      iconColor: {
+        type: String,
+        default: null
+      },
+      active: {
+        type: Boolean,
+        default: false
+      },
+      isNarrow: {
+        type: Boolean,
+        default: false
+      },
+      isWide: {
+        type: Boolean,
+        default: false
+      },
+      toolbarItem: {
+        type: Object,
+        required: true
+      },
+      defaultLabel: {
+        type: String,
+        default: null
+      },
+      isOverflowItem: {
+        type: Boolean,
+        default: false
+      }
+    },
+    emits: ["buttonClick", "textSubmit"],
+    setup(__props, { emit: __emit }) {
+      const emit2 = __emit;
+      const props = __props;
+      const {
+        name,
+        active,
+        icon,
+        label,
+        hideLabel,
+        iconColor,
+        hasCaret,
+        disabled,
+        inlineTextInputVisible,
+        hasInlineTextInput,
+        minWidth,
+        style: style2,
+        attributes
+      } = props.toolbarItem;
+      const inlineTextInput = ref(label);
+      const inlineInput = ref(null);
+      const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode$1();
+      const handleClick2 = () => {
+        if (hasInlineTextInput) {
+          nextTick(() => {
+            inlineInput.value?.focus();
+            inlineInput.value?.select();
+          });
+        }
+        emit2("buttonClick");
+      };
+      const handleInputSubmit = () => {
+        const value = inlineTextInput.value;
+        const cleanValue = value.match(/^\d+(\.5)?$/) ? value : Math.floor(parseFloat(value)).toString();
+        emit2("textSubmit", cleanValue);
+        inlineTextInput.value = cleanValue;
+      };
+      const getStyle = computed(() => {
+        if (style2.value) return style2.value;
+        return {
+          minWidth: props.minWidth
+        };
+      });
+      const caretIcon = computed(() => {
+        return active.value ? toolbarIcons.dropdownCaretUp : toolbarIcons.dropdownCaretDown;
+      });
+      return (_ctx, _cache) => {
+        return openBlock(), createElementBlock("div", {
+          class: normalizeClass(["toolbar-item", unref(attributes).className]),
+          style: normalizeStyle(getStyle.value),
+          role: __props.isOverflowItem ? "menuitem" : "button",
+          "aria-label": unref(attributes).ariaLabel,
+          onClick: handleClick2,
+          onKeydown: withKeys(withModifiers(handleClick2, ["stop"]), ["enter"]),
+          tabindex: "0"
+        }, [
+          createBaseVNode("div", {
+            class: normalizeClass(["toolbar-button", {
+              active: unref(active),
+              disabled: unref(disabled),
+              narrow: __props.isNarrow,
+              wide: __props.isWide,
+              "has-inline-text-input": unref(hasInlineTextInput),
+              "high-contrast": unref(isHighContrastMode2)
+            }]),
+            "data-item": `btn-${unref(name) || ""}`
+          }, [
+            unref(icon) ? (openBlock(), createBlock(ToolbarButtonIcon, {
+              key: 0,
+              color: unref(iconColor),
+              class: "toolbar-icon",
+              icon: unref(icon),
+              name: unref(name)
+            }, null, 8, ["color", "icon", "name"])) : createCommentVNode("", true),
+            unref(label) && !unref(hideLabel) && !unref(inlineTextInputVisible) ? (openBlock(), createElementBlock("div", _hoisted_3$2$2, toDisplayString(unref(label)), 1)) : createCommentVNode("", true),
+            unref(inlineTextInputVisible) ? (openBlock(), createElementBlock("span", _hoisted_4$1$2, [
+              unref(name) === "fontSize" ? withDirectives((openBlock(), createElementBlock("input", {
+                key: 0,
+                "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inlineTextInput.value = $event),
+                onKeydown: withKeys(withModifiers(handleInputSubmit, ["prevent"]), ["enter"]),
+                type: "text",
+                class: normalizeClass(["button-text-input button-text-input--font-size", { "high-contrast": unref(isHighContrastMode2) }]),
+                id: "inlineTextInput-" + unref(name),
+                autocomplete: "off",
+                ref_key: "inlineInput",
+                ref: inlineInput
+              }, null, 42, _hoisted_5$5)), [
+                [vModelText, inlineTextInput.value]
+              ]) : withDirectives((openBlock(), createElementBlock("input", {
+                key: 1,
+                "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => inlineTextInput.value = $event),
+                placeholder: unref(label),
+                onKeydown: withKeys(withModifiers(handleInputSubmit, ["prevent"]), ["enter"]),
+                type: "text",
+                class: "button-text-input",
+                id: "inlineTextInput-" + unref(name),
+                autocomplete: "off",
+                ref_key: "inlineInput",
+                ref: inlineInput
+              }, null, 40, _hoisted_6$3)), [
+                [vModelText, inlineTextInput.value]
+              ])
+            ])) : createCommentVNode("", true),
+            unref(hasCaret) ? (openBlock(), createElementBlock("div", {
+              key: 3,
+              class: "dropdown-caret",
+              innerHTML: caretIcon.value,
+              style: normalizeStyle({ opacity: unref(disabled) ? 0.6 : 1 })
+            }, null, 12, _hoisted_7$3)) : createCommentVNode("", true),
+            createBaseVNode("div", _hoisted_8$3, toDisplayString(`${unref(attributes).ariaLabel} ${unref(active) ? "selected" : "unset"}`), 1)
+          ], 10, _hoisted_2$2$2)
+        ], 46, _hoisted_1$3$2);
+      };
+    }
+  };
+  const ToolbarButton = /* @__PURE__ */ _export_sfc$1(_sfc_main$4$2, [["__scopeId", "data-v-ea93b080"]]);
+  const _hoisted_1$2$2 = {
+    class: "toolbar-separator",
+    role: "separator",
+    "aria-label": "Toolbar separator"
+  };
+  const _sfc_main$3$2 = {
+    __name: "ToolbarSeparator",
+    props: {
+      active: {
+        type: Boolean,
+        default: false
+      }
+    },
+    emits: ["command"],
+    setup(__props, { emit: __emit }) {
+      const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode$1();
+      const getSeparatorColor = () => {
+        if (isHighContrastMode2.value) {
+          return "#000";
+        }
+        return "#dbdbdb";
+      };
+      return (_ctx, _cache) => {
+        return openBlock(), createElementBlock("div", _hoisted_1$2$2, [
+          createBaseVNode("div", {
+            class: "separator-inner",
+            style: normalizeStyle({ backgroundColor: getSeparatorColor() })
+          }, null, 4)
+        ]);
+      };
+    }
+  };
+  const ToolbarSeparator = /* @__PURE__ */ _export_sfc$1(_sfc_main$3$2, [["__scopeId", "data-v-4ef9aa18"]]);
+  const _hoisted_1$1$2 = { class: "overflow-menu" };
+  const _hoisted_2$1$2 = { class: "overflow-menu-trigger" };
+  const _hoisted_3$1$2 = {
+    key: 0,
+    class: "overflow-menu_items",
+    role: "group"
+  };
+  const _sfc_main$2$2 = {
+    __name: "OverflowMenu",
+    props: {
+      toolbarItem: {
+        type: Object,
+        required: true
+      },
+      overflowItems: {
+        type: Array,
+        required: true
+      }
+    },
+    emits: ["buttonClick", "close"],
+    setup(__props, { emit: __emit }) {
+      const { proxy } = getCurrentInstance();
+      const emit2 = __emit;
+      const props = __props;
+      const isOverflowMenuOpened = computed(() => props.toolbarItem.expand.value);
+      const hasOpenDropdown = ref(false);
+      const overflowToolbarItem = computed(() => ({
+        ...props.toolbarItem,
+        active: isOverflowMenuOpened.value
+      }));
+      const toggleOverflowMenu = () => {
+        emit2("buttonClick", props.toolbarItem);
+      };
+      const handleCommand = ({ item, argument }) => {
+        proxy.$toolbar.emitCommand({ item, argument });
+      };
+      const handleKeyDown2 = (e) => {
+        if (e.key === "Escape") {
+          if (isOverflowMenuOpened.value && !hasOpenDropdown.value) {
+            e.preventDefault();
+            emit2("close");
+          }
+        }
+      };
+      onMounted(() => {
+        document.addEventListener("keydown", handleKeyDown2, true);
+      });
+      onBeforeUnmount(() => {
+        document.removeEventListener("keydown", handleKeyDown2, true);
+      });
+      return (_ctx, _cache) => {
+        return openBlock(), createElementBlock("div", _hoisted_1$1$2, [
+          createBaseVNode("div", _hoisted_2$1$2, [
+            createVNode(ToolbarButton, {
+              "toolbar-item": overflowToolbarItem.value,
+              onButtonClick: toggleOverflowMenu
+            }, null, 8, ["toolbar-item"])
+          ]),
+          isOverflowMenuOpened.value ? (openBlock(), createElementBlock("div", _hoisted_3$1$2, [
+            createVNode(ButtonGroup, {
+              class: "superdoc-toolbar-overflow",
+              "toolbar-items": __props.overflowItems,
+              "from-overflow": "",
+              onCommand: handleCommand,
+              onDropdownUpdateShow: _cache[0] || (_cache[0] = ($event) => hasOpenDropdown.value = $event)
+            }, null, 8, ["toolbar-items"])
+          ])) : createCommentVNode("", true)
+        ]);
+      };
+    }
+  };
+  const OverflowMenu = /* @__PURE__ */ _export_sfc$1(_sfc_main$2$2, [["__scopeId", "data-v-ef28da92"]]);
   const _hoisted_1$j = ["onKeydown", "tabindex", "data-item-id"];
   const _hoisted_2$c = { key: 0 };
   const _hoisted_3$a = { key: 0 };
@@ -128386,6 +128889,16 @@ ${style2}
         type: Array,
         default: () => []
       },
+      /**
+       * The font-family to use for UI elements like dropdowns and tooltips.
+       * This ensures consistent typography across toolbar UI components.
+       * @type {string}
+       * @default 'Arial, Helvetica, sans-serif'
+       */
+      uiFontFamily: {
+        type: String,
+        default: "Arial, Helvetica, sans-serif"
+      },
       position: {
         type: String,
         default: "left"
@@ -128578,6 +129091,7 @@ ${style2}
                 options: dropdownOptions(item),
                 trigger: item.disabled.value ? null : "click",
                 show: item.expand.value,
+                "content-style": { fontFamily: props.uiFontFamily },
                 size: "medium",
                 placement: "bottom-start",
                 class: normalizeClass(["toolbar-button toolbar-dropdown sd-editor-toolbar-dropdown", { "high-contrast": unref(isHighContrastMode2) }]),
@@ -128585,14 +129099,16 @@ ${style2}
                 onUpdateShow: handleDropdownUpdateShow,
                 style: normalizeStyle(item.dropdownStyles.value),
                 "menu-props": () => ({
-                  role: "menu"
+                  role: "menu",
+                  style: { fontFamily: props.uiFontFamily }
                 }),
                 "node-props": (option) => getDropdownAttributes(option, item)
               }, {
                 default: withCtx(() => [
                   createVNode(unref(NTooltip), {
                     trigger: "hover",
-                    disabled: !item.tooltip?.value
+                    disabled: !item.tooltip?.value,
+                    "content-style": { fontFamily: props.uiFontFamily }
                   }, {
                     trigger: withCtx(() => [
                       createVNode(ToolbarButton, {
@@ -128609,13 +129125,14 @@ ${style2}
                       ])
                     ]),
                     _: 2
-                  }, 1032, ["disabled"])
+                  }, 1032, ["disabled", "content-style"])
                 ]),
                 _: 2
-              }, 1032, ["options", "trigger", "show", "class", "onSelect", "style", "node-props"])) : isButton(item) ? (openBlock(), createBlock(unref(NTooltip), {
+              }, 1032, ["options", "trigger", "show", "content-style", "class", "onSelect", "style", "menu-props", "node-props"])) : isButton(item) ? (openBlock(), createBlock(unref(NTooltip), {
                 key: 2,
                 trigger: "hover",
-                class: "sd-editor-toolbar-tooltip"
+                class: "sd-editor-toolbar-tooltip",
+                "content-style": { fontFamily: props.uiFontFamily }
               }, {
                 trigger: withCtx(() => [
                   createVNode(ToolbarButton, {
@@ -128632,7 +129149,7 @@ ${style2}
                   ])) : createCommentVNode("", true)
                 ]),
                 _: 2
-              }, 1024)) : createCommentVNode("", true),
+              }, 1032, ["content-style"])) : createCommentVNode("", true),
               isOverflow(item) && __props.overflowItems.length ? (openBlock(), createBlock(OverflowMenu, {
                 key: 3,
                 "toolbar-item": item,
@@ -128646,13 +129163,21 @@ ${style2}
       };
     }
   };
-  const ButtonGroup = /* @__PURE__ */ _export_sfc$1(_sfc_main$1$2, [["__scopeId", "data-v-c80a1e51"]]);
+  const ButtonGroup = /* @__PURE__ */ _export_sfc$1(_sfc_main$1$2, [["__scopeId", "data-v-f732136c"]]);
+  const DEFAULT_UI_FONT_FAMILY$1 = "Arial, Helvetica, sans-serif";
   const _sfc_main$k = {
     __name: "Toolbar",
     emits: ["command", "toggle", "select"],
     setup(__props, { emit: __emit }) {
       const { proxy } = getCurrentInstance();
       let toolbarKey = ref(1);
+      const uiFontFamily = computed(() => {
+        const configured = proxy?.$toolbar?.config?.uiDisplayFallbackFont;
+        if (typeof configured === "string" && configured.trim()) {
+          return configured.trim();
+        }
+        return DEFAULT_UI_FONT_FAMILY$1;
+      });
       const showLeftSide = proxy.$toolbar.config?.toolbarGroups?.includes("left");
       const showRightSide = proxy.$toolbar.config?.toolbarGroups?.includes("right");
       const excludeButtonsList = proxy.$toolbar.config?.toolbarButtonsExclude || [];
@@ -128699,37 +129224,48 @@ ${style2}
           "aria-label": "Toolbar",
           "data-editor-ui-surface": ""
         }, [
-          unref(showLeftSide) ? (openBlock(), createBlock(ButtonGroup, {
-            key: 0,
-            tabindex: "0",
-            "toolbar-items": getFilteredItems("left"),
-            position: "left",
-            onCommand: handleCommand,
-            onItemClicked: restoreSelection2,
-            class: "superdoc-toolbar-group-side"
-          }, null, 8, ["toolbar-items"])) : createCommentVNode("", true),
-          createVNode(ButtonGroup, {
-            tabindex: "0",
-            "toolbar-items": getFilteredItems("center"),
-            "overflow-items": unref(proxy).$toolbar.overflowItems,
-            position: "center",
-            onCommand: handleCommand,
-            onItemClicked: restoreSelection2
-          }, null, 8, ["toolbar-items", "overflow-items"]),
-          unref(showRightSide) ? (openBlock(), createBlock(ButtonGroup, {
-            key: 1,
-            tabindex: "0",
-            "toolbar-items": getFilteredItems("right"),
-            position: "right",
-            onCommand: handleCommand,
-            onItemClicked: restoreSelection2,
-            class: "superdoc-toolbar-group-side"
-          }, null, 8, ["toolbar-items"])) : createCommentVNode("", true)
+          createVNode(unref(NConfigProvider$1), {
+            abstract: "",
+            "preflight-style-disabled": ""
+          }, {
+            default: withCtx(() => [
+              unref(showLeftSide) ? (openBlock(), createBlock(ButtonGroup, {
+                key: 0,
+                tabindex: "0",
+                "toolbar-items": getFilteredItems("left"),
+                "ui-font-family": uiFontFamily.value,
+                position: "left",
+                onCommand: handleCommand,
+                onItemClicked: restoreSelection2,
+                class: "superdoc-toolbar-group-side"
+              }, null, 8, ["toolbar-items", "ui-font-family"])) : createCommentVNode("", true),
+              createVNode(ButtonGroup, {
+                tabindex: "0",
+                "toolbar-items": getFilteredItems("center"),
+                "overflow-items": unref(proxy).$toolbar.overflowItems,
+                "ui-font-family": uiFontFamily.value,
+                position: "center",
+                onCommand: handleCommand,
+                onItemClicked: restoreSelection2
+              }, null, 8, ["toolbar-items", "overflow-items", "ui-font-family"]),
+              unref(showRightSide) ? (openBlock(), createBlock(ButtonGroup, {
+                key: 1,
+                tabindex: "0",
+                "toolbar-items": getFilteredItems("right"),
+                "ui-font-family": uiFontFamily.value,
+                position: "right",
+                onCommand: handleCommand,
+                onItemClicked: restoreSelection2,
+                class: "superdoc-toolbar-group-side"
+              }, null, 8, ["toolbar-items", "ui-font-family"])) : createCommentVNode("", true)
+            ]),
+            _: 1
+          })
         ]);
       };
     }
   };
-  const Toolbar = /* @__PURE__ */ _export_sfc$1(_sfc_main$k, [["__scopeId", "data-v-3f5ec271"]]);
+  const Toolbar = /* @__PURE__ */ _export_sfc$1(_sfc_main$k, [["__scopeId", "data-v-c7a72aa9"]]);
   const DEFAULT_API_ENDPOINT = "https://sd-dev-express-gateway-i6xtm.ondigitalocean.app/insights";
   const SYSTEM_PROMPT = "You are an expert copywriter and you are immersed in a document editor. You are to provide document related text responses based on the user prompts. Only write what is asked for. Do not provide explanations. Try to keep placeholders as short as possible. Do not output your prompt. Your instructions are: ";
   async function baseInsightsFetch(payload, options = {}) {
@@ -129246,7 +129782,7 @@ ${style2}
       };
     }
   };
-  const AIWriter = /* @__PURE__ */ _export_sfc$1(_sfc_main$j, [["__scopeId", "data-v-d869be75"]]);
+  const AIWriter = /* @__PURE__ */ _export_sfc$1(_sfc_main$j, [["__scopeId", "data-v-a4bc3d14"]]);
   async function createZip(blobs, fileNames) {
     const zip = new JSZip();
     blobs.forEach((blob, index2) => {
@@ -132095,6 +132631,10 @@ ${style2}
         this.config.selector = this.config.element;
       }
       this.toolbarContainer = this.findElementBySelector(this.config.selector);
+      if (this.toolbarContainer) {
+        const uiFontFamily = (this.config?.uiDisplayFallbackFont || "").toString().trim() || "Arial, Helvetica, sans-serif";
+        this.toolbarContainer.style.setProperty("--sd-ui-font-family", uiFontFamily);
+      }
       __privateMethod(this, _SuperToolbar_instances, initToolbarGroups_fn).call(this);
       __privateMethod(this, _SuperToolbar_instances, makeToolbarItems_fn).call(this, {
         superToolbar: this,
@@ -139076,6 +139616,62 @@ ${reason}`);
       handleTrackedChangeUpdate
     };
   });
+  const commentIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M512 240c0 114.9-114.6 208-256 208c-37.1 0-72.3-6.4-104.1-17.9c-11.9 8.7-31.3 20.6-54.3 30.6C73.6 471.1 44.7 480 16 480c-6.5 0-12.3-3.9-14.8-9.9c-2.5-6-1.1-12.8 3.4-17.4c0 0 0 0 0 0s0 0 0 0s0 0 0 0c0 0 0 0 0 0l.3-.3c.3-.3 .7-.7 1.3-1.4c1.1-1.2 2.8-3.1 4.9-5.7c4.1-5 9.6-12.4 15.2-21.6c10-16.6 19.5-38.4 21.4-62.9C17.7 326.8 0 285.1 0 240C0 125.1 114.6 32 256 32s256 93.1 256 208z"/></svg>';
+  const caretDownIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z"/></svg>';
+  const userCheckIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M96 128a128 128 0 1 1 256 0A128 128 0 1 1 96 128zM0 482.3C0 383.8 79.8 304 178.3 304l91.4 0C368.2 304 448 383.8 448 482.3c0 16.4-13.3 29.7-29.7 29.7L29.7 512C13.3 512 0 498.7 0 482.3zM625 177L497 305c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L591 143c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z"/></svg>';
+  const usersIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M144 0a80 80 0 1 1 0 160A80 80 0 1 1 144 0zM512 0a80 80 0 1 1 0 160A80 80 0 1 1 512 0zM0 298.7C0 239.8 47.8 192 106.7 192l42.7 0c15.9 0 31 3.5 44.6 9.7c-1.3 7.2-1.9 14.7-1.9 22.3c0 38.2 16.8 72.5 43.3 96c-.2 0-.4 0-.7 0L21.3 320C9.6 320 0 310.4 0 298.7zM405.3 320c-.2 0-.4 0-.7 0c26.6-23.5 43.3-57.8 43.3-96c0-7.6-.7-15-1.9-22.3c13.6-6.3 28.7-9.7 44.6-9.7l42.7 0C592.2 192 640 239.8 640 298.7c0 11.8-9.6 21.3-21.3 21.3l-213.3 0zM224 224a96 96 0 1 1 192 0 96 96 0 1 1 -192 0zM128 485.3C128 411.7 187.7 352 261.3 352l117.3 0C452.3 352 512 411.7 512 485.3c0 14.7-11.9 26.7-26.7 26.7l-330.7 0c-14.7 0-26.7-11.9-26.7-26.7z"/></svg>';
+  const checkIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z"/></svg>';
+  const xmarkIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z"/></svg>';
+  const ellipsisVerticalSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z"/></svg>';
+  const superdocIcons = {
+    comment: commentIconSvg,
+    caretDown: caretDownIconSvg,
+    internal: userCheckIconSvg,
+    external: usersIconSvg,
+    markDone: checkIconSvg,
+    acceptChange: checkIconSvg,
+    rejectChange: xmarkIconSvg,
+    overflow: ellipsisVerticalSvg
+  };
+  const _export_sfc = (sfc, props) => {
+    const target = sfc.__vccOpts || sfc;
+    for (const [key2, val] of props) {
+      target[key2] = val;
+    }
+    return target;
+  };
+  const _hoisted_1$g = { class: "user-container" };
+  const _hoisted_2$9 = ["src"];
+  const _hoisted_3$7 = {
+    key: 1,
+    class: "user-bg"
+  };
+  const _sfc_main$h = {
+    __name: "Avatar",
+    props: {
+      user: {
+        type: Object,
+        required: true
+      }
+    },
+    setup(__props) {
+      const getInitials2 = (name, email) => {
+        if (!name && !email) return;
+        const firstLetter = name?.substring(0, 1) || email?.substring(0, 1) || null;
+        return firstLetter;
+      };
+      return (_ctx, _cache) => {
+        return openBlock(), createElementBlock("div", _hoisted_1$g, [
+          __props.user.image ? (openBlock(), createElementBlock("img", {
+            key: 0,
+            class: "user-bg",
+            src: __props.user.image.startsWith("http") ? __props.user.image : `data:image/png;base64,${__props.user.image}`
+          }, null, 8, _hoisted_2$9)) : (openBlock(), createElementBlock("span", _hoisted_3$7, toDisplayString(getInitials2(__props.user.name, __props.user.email)), 1))
+        ]);
+      };
+    }
+  };
+  const Avatar = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-53e13009"]]);
   function plugin$1(options) {
     let _bPrefix = ".";
     let _ePrefix = "__";
@@ -142663,30 +143259,30 @@ ${style2}
   function useConfig(props = {}, options = {
     defaultBordered: true
   }) {
-    const NConfigProvider = inject(configProviderInjectionKey, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey, null);
     return {
       // NConfigProvider,
-      inlineThemeDisabled: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.inlineThemeDisabled,
-      mergedRtlRef: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedRtlRef,
-      mergedComponentPropsRef: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedComponentPropsRef,
-      mergedBreakpointsRef: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedBreakpointsRef,
+      inlineThemeDisabled: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.inlineThemeDisabled,
+      mergedRtlRef: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedRtlRef,
+      mergedComponentPropsRef: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedComponentPropsRef,
+      mergedBreakpointsRef: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBreakpointsRef,
       mergedBorderedRef: computed(() => {
         var _a2, _b2;
         const {
           bordered
         } = props;
         if (bordered !== void 0) return bordered;
-        return (_b2 = (_a2 = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedBorderedRef.value) !== null && _a2 !== void 0 ? _a2 : options.defaultBordered) !== null && _b2 !== void 0 ? _b2 : true;
+        return (_b2 = (_a2 = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBorderedRef.value) !== null && _a2 !== void 0 ? _a2 : options.defaultBordered) !== null && _b2 !== void 0 ? _b2 : true;
       }),
-      mergedClsPrefixRef: NConfigProvider ? NConfigProvider.mergedClsPrefixRef : shallowRef(defaultClsPrefix),
-      namespaceRef: computed(() => NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedNamespaceRef.value)
+      mergedClsPrefixRef: NConfigProvider2 ? NConfigProvider2.mergedClsPrefixRef : shallowRef(defaultClsPrefix),
+      namespaceRef: computed(() => NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedNamespaceRef.value)
     };
   }
   function useThemeClass(componentName, hashRef, cssVarsRef, props) {
     if (!cssVarsRef) throwError("useThemeClass", "cssVarsRef is not passed");
-    const NConfigProvider = inject(configProviderInjectionKey, null);
-    const mergedThemeHashRef = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedThemeHashRef;
-    const styleMountTarget = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget;
+    const NConfigProvider2 = inject(configProviderInjectionKey, null);
+    const mergedThemeHashRef = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeHashRef;
+    const styleMountTarget = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget;
     const themeClassRef = ref("");
     const ssrAdapter2 = useSsrAdapter();
     let renderCallback;
@@ -144155,7 +144751,7 @@ ${style2}
       }
       return componentRtlState;
     });
-    const NConfigProvider = inject(configProviderInjectionKey, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey, null);
     const mountStyle = () => {
       watchEffect(() => {
         const {
@@ -144175,7 +144771,7 @@ ${style2}
             bPrefix: clsPrefix ? `.${clsPrefix}-` : void 0
           },
           ssr: ssrAdapter2,
-          parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+          parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
         });
       });
     };
@@ -144233,7 +144829,7 @@ ${style2}
       return;
     }
     const ssrAdapter2 = useSsrAdapter();
-    const NConfigProvider = inject(configProviderInjectionKey, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey, null);
     const mountStyle = () => {
       const clsPrefix = clsPrefixRef.value;
       style2.mount({
@@ -144244,15 +144840,15 @@ ${style2}
           bPrefix: clsPrefix ? `.${clsPrefix}-` : void 0
         },
         ssr: ssrAdapter2,
-        parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+        parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
       });
-      if (!(NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.preflightStyleDisabled)) {
+      if (!(NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.preflightStyleDisabled)) {
         globalStyle.mount({
           id: "n-global",
           head: true,
           anchorMetaName: cssrAnchorMetaName,
           ssr: ssrAdapter2,
-          parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+          parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
         });
       }
     };
@@ -144267,7 +144863,7 @@ ${style2}
   }
   function useTheme(resolveId, mountId, style2, defaultTheme, props, clsPrefixRef) {
     const ssrAdapter2 = useSsrAdapter();
-    const NConfigProvider = inject(configProviderInjectionKey, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey, null);
     if (style2) {
       const mountStyle = () => {
         const clsPrefix = clsPrefixRef === null || clsPrefixRef === void 0 ? void 0 : clsPrefixRef.value;
@@ -144279,15 +144875,15 @@ ${style2}
           },
           anchorMetaName: cssrAnchorMetaName,
           ssr: ssrAdapter2,
-          parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+          parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
         });
-        if (!(NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.preflightStyleDisabled)) {
+        if (!(NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.preflightStyleDisabled)) {
           globalStyle.mount({
             id: "n-global",
             head: true,
             anchorMetaName: cssrAnchorMetaName,
             ssr: ssrAdapter2,
-            parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+            parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
           });
         }
       };
@@ -144319,11 +144915,11 @@ ${style2}
           self: globalSelf = void 0,
           peers: globalPeers = {}
         } = {}
-      } = (NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedThemeRef.value) || {};
+      } = (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeRef.value) || {};
       const {
         common: globalCommonOverrides = void 0,
         [resolveId]: globalSelfOverrides = {}
-      } = (NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedThemeOverridesRef.value) || {};
+      } = (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeOverridesRef.value) || {};
       const {
         common: globalSelfCommonOverrides,
         peers: globalPeersOverrides = {}
@@ -148129,6 +148725,209 @@ ${style2}
       }))), labelNode);
     }
   });
+  const configProviderProps = {
+    abstract: Boolean,
+    bordered: {
+      type: Boolean,
+      default: void 0
+    },
+    clsPrefix: String,
+    locale: Object,
+    dateLocale: Object,
+    namespace: String,
+    rtl: Array,
+    tag: {
+      type: String,
+      default: "div"
+    },
+    hljs: Object,
+    katex: Object,
+    theme: Object,
+    themeOverrides: Object,
+    componentOptions: Object,
+    icons: Object,
+    breakpoints: Object,
+    preflightStyleDisabled: Boolean,
+    styleMountTarget: Object,
+    inlineThemeDisabled: {
+      type: Boolean,
+      default: void 0
+    },
+    // deprecated
+    as: {
+      type: String,
+      validator: () => {
+        warn("config-provider", "`as` is deprecated, please use `tag` instead.");
+        return true;
+      },
+      default: void 0
+    }
+  };
+  const NConfigProvider = /* @__PURE__ */ defineComponent({
+    name: "ConfigProvider",
+    alias: ["App"],
+    props: configProviderProps,
+    setup(props) {
+      const NConfigProvider2 = inject(configProviderInjectionKey, null);
+      const mergedThemeRef = computed(() => {
+        const {
+          theme
+        } = props;
+        if (theme === null) return void 0;
+        const inheritedTheme = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeRef.value;
+        return theme === void 0 ? inheritedTheme : inheritedTheme === void 0 ? theme : Object.assign({}, inheritedTheme, theme);
+      });
+      const mergedThemeOverridesRef = computed(() => {
+        const {
+          themeOverrides
+        } = props;
+        if (themeOverrides === null) return void 0;
+        if (themeOverrides === void 0) {
+          return NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeOverridesRef.value;
+        } else {
+          const inheritedThemeOverrides = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeOverridesRef.value;
+          if (inheritedThemeOverrides === void 0) {
+            return themeOverrides;
+          } else {
+            return merge$2({}, inheritedThemeOverrides, themeOverrides);
+          }
+        }
+      });
+      const mergedNamespaceRef = useMemo(() => {
+        const {
+          namespace: namespace2
+        } = props;
+        return namespace2 === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedNamespaceRef.value : namespace2;
+      });
+      const mergedBorderedRef = useMemo(() => {
+        const {
+          bordered
+        } = props;
+        return bordered === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBorderedRef.value : bordered;
+      });
+      const mergedIconsRef = computed(() => {
+        const {
+          icons: icons2
+        } = props;
+        return icons2 === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedIconsRef.value : icons2;
+      });
+      const mergedComponentPropsRef = computed(() => {
+        const {
+          componentOptions
+        } = props;
+        if (componentOptions !== void 0) return componentOptions;
+        return NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedComponentPropsRef.value;
+      });
+      const mergedClsPrefixRef = computed(() => {
+        const {
+          clsPrefix
+        } = props;
+        if (clsPrefix !== void 0) return clsPrefix;
+        if (NConfigProvider2) return NConfigProvider2.mergedClsPrefixRef.value;
+        return defaultClsPrefix;
+      });
+      const mergedRtlRef = computed(() => {
+        var _a2;
+        const {
+          rtl
+        } = props;
+        if (rtl === void 0) {
+          return NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedRtlRef.value;
+        }
+        const rtlEnabledState = {};
+        for (const rtlInfo of rtl) {
+          rtlEnabledState[rtlInfo.name] = markRaw(rtlInfo);
+          (_a2 = rtlInfo.peers) === null || _a2 === void 0 ? void 0 : _a2.forEach((peerRtlInfo) => {
+            if (!(peerRtlInfo.name in rtlEnabledState)) {
+              rtlEnabledState[peerRtlInfo.name] = markRaw(peerRtlInfo);
+            }
+          });
+        }
+        return rtlEnabledState;
+      });
+      const mergedBreakpointsRef = computed(() => {
+        return props.breakpoints || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBreakpointsRef.value);
+      });
+      const inlineThemeDisabled = props.inlineThemeDisabled || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.inlineThemeDisabled);
+      const preflightStyleDisabled = props.preflightStyleDisabled || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.preflightStyleDisabled);
+      const styleMountTarget = props.styleMountTarget || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget);
+      const mergedThemeHashRef = computed(() => {
+        const {
+          value: theme
+        } = mergedThemeRef;
+        const {
+          value: mergedThemeOverrides
+        } = mergedThemeOverridesRef;
+        const hasThemeOverrides = mergedThemeOverrides && Object.keys(mergedThemeOverrides).length !== 0;
+        const themeName = theme === null || theme === void 0 ? void 0 : theme.name;
+        if (themeName) {
+          if (hasThemeOverrides) {
+            return `${themeName}-${murmur2(JSON.stringify(mergedThemeOverridesRef.value))}`;
+          }
+          return themeName;
+        } else {
+          if (hasThemeOverrides) {
+            return murmur2(JSON.stringify(mergedThemeOverridesRef.value));
+          }
+          return "";
+        }
+      });
+      provide(configProviderInjectionKey, {
+        mergedThemeHashRef,
+        mergedBreakpointsRef,
+        mergedRtlRef,
+        mergedIconsRef,
+        mergedComponentPropsRef,
+        mergedBorderedRef,
+        mergedNamespaceRef,
+        mergedClsPrefixRef,
+        mergedLocaleRef: computed(() => {
+          const {
+            locale
+          } = props;
+          if (locale === null) return void 0;
+          return locale === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedLocaleRef.value : locale;
+        }),
+        mergedDateLocaleRef: computed(() => {
+          const {
+            dateLocale
+          } = props;
+          if (dateLocale === null) return void 0;
+          return dateLocale === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedDateLocaleRef.value : dateLocale;
+        }),
+        mergedHljsRef: computed(() => {
+          const {
+            hljs
+          } = props;
+          return hljs === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedHljsRef.value : hljs;
+        }),
+        mergedKatexRef: computed(() => {
+          const {
+            katex
+          } = props;
+          return katex === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedKatexRef.value : katex;
+        }),
+        mergedThemeRef,
+        mergedThemeOverridesRef,
+        inlineThemeDisabled: inlineThemeDisabled || false,
+        preflightStyleDisabled: preflightStyleDisabled || false,
+        styleMountTarget
+      });
+      return {
+        mergedClsPrefix: mergedClsPrefixRef,
+        mergedBordered: mergedBorderedRef,
+        mergedNamespace: mergedNamespaceRef,
+        mergedTheme: mergedThemeRef,
+        mergedThemeOverrides: mergedThemeOverridesRef
+      };
+    },
+    render() {
+      var _a2, _b2, _c, _d;
+      return !this.abstract ? h$1(this.as || this.tag, {
+        class: `${this.mergedClsPrefix || defaultClsPrefix}-config-provider`
+      }, (_b2 = (_a2 = this.$slots).default) === null || _b2 === void 0 ? void 0 : _b2.call(_a2)) : (_d = (_c = this.$slots).default) === null || _d === void 0 ? void 0 : _d.call(_c);
+    }
+  });
   const commonVariables$1 = {
     padding: "4px 0",
     optionIconSizeSmall: "14px",
@@ -150224,62 +151023,20 @@ ${style2}
       })) : icon;
     }
   });
-  const commentIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M512 240c0 114.9-114.6 208-256 208c-37.1 0-72.3-6.4-104.1-17.9c-11.9 8.7-31.3 20.6-54.3 30.6C73.6 471.1 44.7 480 16 480c-6.5 0-12.3-3.9-14.8-9.9c-2.5-6-1.1-12.8 3.4-17.4c0 0 0 0 0 0s0 0 0 0s0 0 0 0c0 0 0 0 0 0l.3-.3c.3-.3 .7-.7 1.3-1.4c1.1-1.2 2.8-3.1 4.9-5.7c4.1-5 9.6-12.4 15.2-21.6c10-16.6 19.5-38.4 21.4-62.9C17.7 326.8 0 285.1 0 240C0 125.1 114.6 32 256 32s256 93.1 256 208z"/></svg>';
-  const caretDownIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z"/></svg>';
-  const userCheckIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M96 128a128 128 0 1 1 256 0A128 128 0 1 1 96 128zM0 482.3C0 383.8 79.8 304 178.3 304l91.4 0C368.2 304 448 383.8 448 482.3c0 16.4-13.3 29.7-29.7 29.7L29.7 512C13.3 512 0 498.7 0 482.3zM625 177L497 305c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L591 143c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z"/></svg>';
-  const usersIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M144 0a80 80 0 1 1 0 160A80 80 0 1 1 144 0zM512 0a80 80 0 1 1 0 160A80 80 0 1 1 512 0zM0 298.7C0 239.8 47.8 192 106.7 192l42.7 0c15.9 0 31 3.5 44.6 9.7c-1.3 7.2-1.9 14.7-1.9 22.3c0 38.2 16.8 72.5 43.3 96c-.2 0-.4 0-.7 0L21.3 320C9.6 320 0 310.4 0 298.7zM405.3 320c-.2 0-.4 0-.7 0c26.6-23.5 43.3-57.8 43.3-96c0-7.6-.7-15-1.9-22.3c13.6-6.3 28.7-9.7 44.6-9.7l42.7 0C592.2 192 640 239.8 640 298.7c0 11.8-9.6 21.3-21.3 21.3l-213.3 0zM224 224a96 96 0 1 1 192 0 96 96 0 1 1 -192 0zM128 485.3C128 411.7 187.7 352 261.3 352l117.3 0C452.3 352 512 411.7 512 485.3c0 14.7-11.9 26.7-26.7 26.7l-330.7 0c-14.7 0-26.7-11.9-26.7-26.7z"/></svg>';
-  const checkIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z"/></svg>';
-  const xmarkIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z"/></svg>';
-  const ellipsisVerticalSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z"/></svg>';
-  const superdocIcons = {
-    comment: commentIconSvg,
-    caretDown: caretDownIconSvg,
-    internal: userCheckIconSvg,
-    external: usersIconSvg,
-    markDone: checkIconSvg,
-    acceptChange: checkIconSvg,
-    rejectChange: xmarkIconSvg,
-    overflow: ellipsisVerticalSvg
-  };
-  const _export_sfc = (sfc, props) => {
-    const target = sfc.__vccOpts || sfc;
-    for (const [key2, val] of props) {
-      target[key2] = val;
-    }
-    return target;
-  };
-  const _hoisted_1$g = { class: "user-container" };
-  const _hoisted_2$9 = ["src"];
-  const _hoisted_3$7 = {
-    key: 1,
-    class: "user-bg"
-  };
-  const _sfc_main$h = {
-    __name: "Avatar",
-    props: {
-      user: {
-        type: Object,
-        required: true
+  const DEFAULT_UI_FONT_FAMILY = "Arial, Helvetica, sans-serif";
+  function useUiFontFamily() {
+    const instance = getCurrentInstance();
+    const uiFontFamily = computed(() => {
+      const configured = instance?.proxy?.$superdoc?.config?.uiDisplayFallbackFont;
+      if (typeof configured === "string" && configured.trim()) {
+        return configured.trim();
       }
-    },
-    setup(__props) {
-      const getInitials2 = (name, email) => {
-        if (!name && !email) return;
-        const firstLetter = name?.substring(0, 1) || email?.substring(0, 1) || null;
-        return firstLetter;
-      };
-      return (_ctx, _cache) => {
-        return openBlock(), createElementBlock("div", _hoisted_1$g, [
-          __props.user.image ? (openBlock(), createElementBlock("img", {
-            key: 0,
-            class: "user-bg",
-            src: __props.user.image.startsWith("http") ? __props.user.image : `data:image/png;base64,${__props.user.image}`
-          }, null, 8, _hoisted_2$9)) : (openBlock(), createElementBlock("span", _hoisted_3$7, toDisplayString(getInitials2(__props.user.name, __props.user.email)), 1))
-        ]);
-      };
-    }
-  };
-  const Avatar = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-53e13009"]]);
+      return DEFAULT_UI_FONT_FAMILY;
+    });
+    return {
+      uiFontFamily
+    };
+  }
   const _hoisted_1$f = { class: "comment-option" };
   const _hoisted_2$8 = ["innerHTML"];
   const _hoisted_3$6 = { class: "option-state" };
@@ -150300,6 +151057,7 @@ ${style2}
     setup(__props, { emit: __emit }) {
       const emit2 = __emit;
       const props = __props;
+      const { uiFontFamily } = useUiFontFamily();
       const renderIcon = (icon) => {
         return () => {
           return h$1("div", { innerHTML: icon, class: "internal-dropdown__item-icon" });
@@ -150361,7 +151119,8 @@ ${style2}
             trigger: "click",
             options,
             onSelect: _cache[0] || (_cache[0] = ($event) => handleSelect($event)),
-            disabled: __props.isDisabled
+            disabled: __props.isDisabled,
+            "content-style": { fontFamily: unref(uiFontFamily) }
           }, {
             default: withCtx(() => [
               createBaseVNode("div", _hoisted_1$f, [
@@ -150377,12 +151136,12 @@ ${style2}
               ])
             ]),
             _: 1
-          }, 8, ["disabled"])
+          }, 8, ["disabled", "content-style"])
         ], 4);
       };
     }
   };
-  const InternalDropdown = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-a88dddd9"]]);
+  const InternalDropdown = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-8b9e3b75"]]);
   function formatDate(timestamp) {
     const date = new Date(timestamp);
     const hours = date.getHours();
@@ -150528,6 +151287,7 @@ ${style2}
       const role = proxy.$superdoc.config.role;
       const isInternal = proxy.$superdoc.config.isInternal;
       const isOwnComment = props.comment.creatorEmail === proxy.$superdoc.config.user.email;
+      const { uiFontFamily } = useUiFontFamily();
       const OVERFLOW_OPTIONS = Object.freeze({
         edit: { label: "Edit", key: "edit" },
         delete: { label: "Delete", key: "delete" }
@@ -150631,7 +151391,8 @@ ${style2}
               key: 2,
               trigger: "click",
               options: getOverflowOptions.value,
-              onSelect: handleSelect
+              onSelect: handleSelect,
+              "content-style": { fontFamily: unref(uiFontFamily) }
             }, {
               default: withCtx(() => [
                 createBaseVNode("div", {
@@ -150646,13 +151407,13 @@ ${style2}
                 ])
               ]),
               _: 1
-            }, 8, ["options"])) : createCommentVNode("", true)
+            }, 8, ["options", "content-style"])) : createCommentVNode("", true)
           ])
         ]);
       };
     }
   };
-  const CommentHeader = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-0f4f53ef"]]);
+  const CommentHeader = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-5e404f08"]]);
   const _hoisted_1$d = { class: "input-section" };
   const _sfc_main$e = {
     __name: "CommentInput",
@@ -151072,7 +151833,7 @@ ${style2}
       };
     }
   };
-  const CommentDialog = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-36e5f63e"]]);
+  const CommentDialog = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-abfa4e05"]]);
   const _hoisted_1$b = { class: "comments-list" };
   const _hoisted_2$5 = { key: 0 };
   const _hoisted_3$3 = { class: "comment-item" };
@@ -151673,7 +152434,7 @@ ${style2}
       };
     }
   };
-  const SelectField = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-b8cacb22"]]);
+  const SelectField = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-1e49d9b3"]]);
   const floor = (val, precision) => {
     const multiplier = 10 ** precision;
     return Math.floor(val * multiplier) / multiplier;
@@ -152118,11 +152879,15 @@ ${style2}
       const { proxy } = getCurrentInstance();
       commentsStore.proxy = proxy;
       const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode();
+      const { uiFontFamily } = useUiFontFamily();
       const commentsModuleConfig = computed(() => {
         const config2 = modules.comments;
         if (config2 === false || config2 == null) return null;
         return config2;
       });
+      const superdocStyleVars = computed(() => ({
+        "--sd-ui-font-family": uiFontFamily.value
+      }));
       const layers = ref(null);
       const commentsLayer = ref(null);
       const toolsMenuPosition = reactive({ top: null, right: "-25px", zIndex: 101 });
@@ -152639,155 +153404,164 @@ ${style2}
       });
       return (_ctx, _cache) => {
         const _directive_click_outside = resolveDirective("click-outside");
-        return openBlock(), createElementBlock("div", {
-          class: normalizeClass(["superdoc", { "superdoc--with-sidebar": showCommentsSidebar.value, "high-contrast": unref(isHighContrastMode2) }])
-        }, [
-          createBaseVNode("div", {
-            class: "superdoc__layers layers",
-            ref_key: "layers",
-            ref: layers,
-            role: "group"
-          }, [
-            showToolsFloatingMenu.value ? (openBlock(), createElementBlock("div", {
-              key: 0,
-              class: "superdoc__tools tools",
-              style: normalizeStyle(toolsMenuPosition)
+        return openBlock(), createBlock(unref(NConfigProvider), {
+          abstract: "",
+          "preflight-style-disabled": ""
+        }, {
+          default: withCtx(() => [
+            createBaseVNode("div", {
+              class: normalizeClass(["superdoc", { "superdoc--with-sidebar": showCommentsSidebar.value, "high-contrast": unref(isHighContrastMode2) }]),
+              style: normalizeStyle(superdocStyleVars.value)
             }, [
               createBaseVNode("div", {
-                class: "tools-item",
-                "data-id": "is-tool",
-                onMousedown: _cache[0] || (_cache[0] = withModifiers(($event) => handleToolClick("comments"), ["stop", "prevent"]))
-              }, [
-                createBaseVNode("div", {
-                  class: "superdoc__tools-icon",
-                  innerHTML: unref(superdocIcons).comment
-                }, null, 8, _hoisted_1$1)
-              ], 32),
-              unref(proxy).$superdoc.config.modules.ai ? (openBlock(), createElementBlock("div", {
-                key: 0,
-                class: "tools-item",
-                "data-id": "is-tool",
-                onMousedown: _cache[1] || (_cache[1] = withModifiers(($event) => handleToolClick("ai"), ["stop", "prevent"]))
-              }, [..._cache[3] || (_cache[3] = [
-                createBaseVNode("div", { class: "superdoc__tools-icon ai-tool" }, null, -1)
-              ])], 32)) : createCommentVNode("", true)
-            ], 4)) : createCommentVNode("", true),
-            createBaseVNode("div", _hoisted_2, [
-              isCommentsEnabled.value ? (openBlock(), createElementBlock("div", {
-                key: 0,
-                class: "superdoc__selection-layer selection-layer",
-                onMousedown: handleSelectionStart,
-                onMouseup: handleDragEnd,
-                ref_key: "selectionLayer",
-                ref: selectionLayer
+                class: "superdoc__layers layers",
+                ref_key: "layers",
+                ref: layers,
+                role: "group"
               }, [
-                unref(selectionPosition) && shouldShowSelection.value ? (openBlock(), createElementBlock("div", {
+                showToolsFloatingMenu.value ? (openBlock(), createElementBlock("div", {
                   key: 0,
-                  style: normalizeStyle(getSelectionPosition.value),
-                  class: "superdoc__temp-selection temp-selection sd-highlight sd-initial-highlight"
-                }, null, 4)) : createCommentVNode("", true)
-              ], 544)) : createCommentVNode("", true),
-              "hrbr-fields" in unref(modules) && layers.value ? (openBlock(), createBlock(HrbrFieldsLayer, {
-                key: 1,
-                fields: unref(modules)["hrbr-fields"],
-                class: "superdoc__comments-layer comments-layer",
-                style: { "z-index": "2" },
-                ref_key: "hrbrFieldsLayer",
-                ref: hrbrFieldsLayer
-              }, null, 8, ["fields"])) : createCommentVNode("", true),
-              layers.value ? (openBlock(), createBlock(CommentsLayer, {
-                key: 2,
-                class: "superdoc__comments-layer comments-layer",
-                style: { "z-index": "3" },
-                ref_key: "commentsLayer",
-                ref: commentsLayer,
-                parent: layers.value,
-                user: unref(user),
-                onHighlightClick: handleHighlightClick
-              }, null, 8, ["parent", "user"])) : createCommentVNode("", true),
-              unref(showAiLayer) ? (openBlock(), createBlock(AiLayer, {
-                key: 3,
-                class: "ai-layer",
-                style: { "z-index": "4" },
-                ref_key: "aiLayer",
-                ref: aiLayer,
-                editor: unref(proxy).$superdoc.activeEditor
-              }, null, 8, ["editor"])) : createCommentVNode("", true),
-              (openBlock(true), createElementBlock(Fragment, null, renderList(unref(documents), (doc2) => {
-                return openBlock(), createElementBlock("div", {
-                  class: "superdoc__sub-document sub-document",
-                  key: doc2.id
+                  class: "superdoc__tools tools",
+                  style: normalizeStyle(toolsMenuPosition)
                 }, [
-                  doc2.type === unref(PDF) ? (openBlock(), createBlock(unref(PdfViewer2), {
+                  createBaseVNode("div", {
+                    class: "tools-item",
+                    "data-id": "is-tool",
+                    onMousedown: _cache[0] || (_cache[0] = withModifiers(($event) => handleToolClick("comments"), ["stop", "prevent"]))
+                  }, [
+                    createBaseVNode("div", {
+                      class: "superdoc__tools-icon",
+                      innerHTML: unref(superdocIcons).comment
+                    }, null, 8, _hoisted_1$1)
+                  ], 32),
+                  unref(proxy).$superdoc.config.modules.ai ? (openBlock(), createElementBlock("div", {
                     key: 0,
-                    "document-data": doc2,
-                    config: unref(pdfConfig),
-                    onSelectionChange: handleSelectionChange,
-                    onReady: handleDocumentReady,
-                    onPageLoaded: unref(handlePageReady),
-                    onBypassSelection: handlePdfClick
-                  }, null, 8, ["document-data", "config", "onPageLoaded"])) : createCommentVNode("", true),
-                  createVNode(unref(NMessageProvider), null, {
-                    default: withCtx(() => [
-                      doc2.type === unref(DOCX) ? (openBlock(), createBlock(unref(SuperEditor), {
+                    class: "tools-item",
+                    "data-id": "is-tool",
+                    onMousedown: _cache[1] || (_cache[1] = withModifiers(($event) => handleToolClick("ai"), ["stop", "prevent"]))
+                  }, [..._cache[3] || (_cache[3] = [
+                    createBaseVNode("div", { class: "superdoc__tools-icon ai-tool" }, null, -1)
+                  ])], 32)) : createCommentVNode("", true)
+                ], 4)) : createCommentVNode("", true),
+                createBaseVNode("div", _hoisted_2, [
+                  isCommentsEnabled.value ? (openBlock(), createElementBlock("div", {
+                    key: 0,
+                    class: "superdoc__selection-layer selection-layer",
+                    onMousedown: handleSelectionStart,
+                    onMouseup: handleDragEnd,
+                    ref_key: "selectionLayer",
+                    ref: selectionLayer
+                  }, [
+                    unref(selectionPosition) && shouldShowSelection.value ? (openBlock(), createElementBlock("div", {
+                      key: 0,
+                      style: normalizeStyle(getSelectionPosition.value),
+                      class: "superdoc__temp-selection temp-selection sd-highlight sd-initial-highlight"
+                    }, null, 4)) : createCommentVNode("", true)
+                  ], 544)) : createCommentVNode("", true),
+                  "hrbr-fields" in unref(modules) && layers.value ? (openBlock(), createBlock(HrbrFieldsLayer, {
+                    key: 1,
+                    fields: unref(modules)["hrbr-fields"],
+                    class: "superdoc__comments-layer comments-layer",
+                    style: { "z-index": "2" },
+                    ref_key: "hrbrFieldsLayer",
+                    ref: hrbrFieldsLayer
+                  }, null, 8, ["fields"])) : createCommentVNode("", true),
+                  layers.value ? (openBlock(), createBlock(CommentsLayer, {
+                    key: 2,
+                    class: "superdoc__comments-layer comments-layer",
+                    style: { "z-index": "3" },
+                    ref_key: "commentsLayer",
+                    ref: commentsLayer,
+                    parent: layers.value,
+                    user: unref(user),
+                    onHighlightClick: handleHighlightClick
+                  }, null, 8, ["parent", "user"])) : createCommentVNode("", true),
+                  unref(showAiLayer) ? (openBlock(), createBlock(AiLayer, {
+                    key: 3,
+                    class: "ai-layer",
+                    style: { "z-index": "4" },
+                    ref_key: "aiLayer",
+                    ref: aiLayer,
+                    editor: unref(proxy).$superdoc.activeEditor
+                  }, null, 8, ["editor"])) : createCommentVNode("", true),
+                  (openBlock(true), createElementBlock(Fragment, null, renderList(unref(documents), (doc2) => {
+                    return openBlock(), createElementBlock("div", {
+                      class: "superdoc__sub-document sub-document",
+                      key: doc2.id
+                    }, [
+                      doc2.type === unref(PDF) ? (openBlock(), createBlock(unref(PdfViewer2), {
                         key: 0,
+                        "document-data": doc2,
+                        config: unref(pdfConfig),
+                        onSelectionChange: handleSelectionChange,
+                        onReady: handleDocumentReady,
+                        onPageLoaded: unref(handlePageReady),
+                        onBypassSelection: handlePdfClick
+                      }, null, 8, ["document-data", "config", "onPageLoaded"])) : createCommentVNode("", true),
+                      createVNode(unref(NMessageProvider), null, {
+                        default: withCtx(() => [
+                          doc2.type === unref(DOCX) ? (openBlock(), createBlock(unref(SuperEditor), {
+                            key: 0,
+                            "file-source": doc2.data,
+                            state: doc2.state,
+                            "document-id": doc2.id,
+                            options: { ...editorOptions(doc2), rulers: doc2.rulers },
+                            onEditorReady,
+                            onPageMarginsChange: ($event) => handleSuperEditorPageMarginsChange(doc2, $event)
+                          }, null, 8, ["file-source", "state", "document-id", "options", "onPageMarginsChange"])) : createCommentVNode("", true)
+                        ]),
+                        _: 2
+                      }, 1024),
+                      doc2.type === unref(HTML) ? (openBlock(), createBlock(HtmlViewer, {
+                        key: 1,
+                        onReady: _cache[2] || (_cache[2] = (id) => handleDocumentReady(id, null)),
+                        onSelectionChange: handleSelectionChange,
                         "file-source": doc2.data,
-                        state: doc2.state,
-                        "document-id": doc2.id,
-                        options: { ...editorOptions(doc2), rulers: doc2.rulers },
-                        onEditorReady,
-                        onPageMarginsChange: ($event) => handleSuperEditorPageMarginsChange(doc2, $event)
-                      }, null, 8, ["file-source", "state", "document-id", "options", "onPageMarginsChange"])) : createCommentVNode("", true)
-                    ]),
-                    _: 2
-                  }, 1024),
-                  doc2.type === unref(HTML) ? (openBlock(), createBlock(HtmlViewer, {
-                    key: 1,
-                    onReady: _cache[2] || (_cache[2] = (id) => handleDocumentReady(id, null)),
-                    onSelectionChange: handleSelectionChange,
-                    "file-source": doc2.data,
-                    "document-id": doc2.id
-                  }, null, 8, ["file-source", "document-id"])) : createCommentVNode("", true)
-                ]);
-              }), 128))
-            ])
-          ], 512),
-          showCommentsSidebar.value ? (openBlock(), createElementBlock("div", _hoisted_3, [
-            unref(pendingComment) ? withDirectives((openBlock(), createBlock(CommentDialog, {
-              key: 0,
-              comment: unref(pendingComment),
-              "auto-focus": true,
-              "is-floating": true
-            }, null, 8, ["comment"])), [
-              [_directive_click_outside, cancelPendingComment]
-            ]) : createCommentVNode("", true),
-            createBaseVNode("div", _hoisted_4, [
-              unref(hasInitializedLocations) && unref(getFloatingComments).length > 0 ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(unref(documentsWithConverations), (doc2) => {
-                return openBlock(), createBlock(FloatingComments, {
-                  parent: layers.value,
-                  "current-document": doc2
-                }, null, 8, ["parent", "current-document"]);
-              }), 256)) : createCommentVNode("", true)
-            ])
-          ])) : createCommentVNode("", true),
-          unref(showAiWriter) ? (openBlock(), createElementBlock("div", {
-            key: 1,
-            class: "ai-writer-container",
-            style: normalizeStyle(unref(aiWriterPosition))
-          }, [
-            createVNode(unref(AIWriter), {
-              "selected-text": unref(selectedText),
-              "handle-close": unref(handleAiWriterClose),
-              editor: unref(proxy).$superdoc.activeEditor,
-              "api-key": unref(proxy).$superdoc.toolbar?.config?.aiApiKey,
-              endpoint: unref(proxy).$superdoc.config?.modules?.ai?.endpoint
-            }, null, 8, ["selected-text", "handle-close", "editor", "api-key", "endpoint"])
-          ], 4)) : createCommentVNode("", true)
-        ], 2);
+                        "document-id": doc2.id
+                      }, null, 8, ["file-source", "document-id"])) : createCommentVNode("", true)
+                    ]);
+                  }), 128))
+                ])
+              ], 512),
+              showCommentsSidebar.value ? (openBlock(), createElementBlock("div", _hoisted_3, [
+                unref(pendingComment) ? withDirectives((openBlock(), createBlock(CommentDialog, {
+                  key: 0,
+                  comment: unref(pendingComment),
+                  "auto-focus": true,
+                  "is-floating": true
+                }, null, 8, ["comment"])), [
+                  [_directive_click_outside, cancelPendingComment]
+                ]) : createCommentVNode("", true),
+                createBaseVNode("div", _hoisted_4, [
+                  unref(hasInitializedLocations) && unref(getFloatingComments).length > 0 ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(unref(documentsWithConverations), (doc2) => {
+                    return openBlock(), createBlock(FloatingComments, {
+                      parent: layers.value,
+                      "current-document": doc2
+                    }, null, 8, ["parent", "current-document"]);
+                  }), 256)) : createCommentVNode("", true)
+                ])
+              ])) : createCommentVNode("", true),
+              unref(showAiWriter) ? (openBlock(), createElementBlock("div", {
+                key: 1,
+                class: "ai-writer-container",
+                style: normalizeStyle(unref(aiWriterPosition))
+              }, [
+                createVNode(unref(AIWriter), {
+                  "selected-text": unref(selectedText),
+                  "handle-close": unref(handleAiWriterClose),
+                  editor: unref(proxy).$superdoc.activeEditor,
+                  "api-key": unref(proxy).$superdoc.toolbar?.config?.aiApiKey,
+                  endpoint: unref(proxy).$superdoc.config?.modules?.ai?.endpoint
+                }, null, 8, ["selected-text", "handle-close", "editor", "api-key", "endpoint"])
+              ], 4)) : createCommentVNode("", true)
+            ], 6)
+          ]),
+          _: 1
+        });
       };
     }
   };
-  const App = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-e229774d"]]);
+  const App = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-309688b3"]]);
   const createSuperdocVueApp = () => {
     const app = createApp(App);
     const pinia = createPinia();
@@ -152897,6 +153671,8 @@ ${style2}
       toolbarGroups: ["left", "center", "right"],
       toolbarIcons: {},
       toolbarTexts: {},
+      // UI font for SuperDoc surfaces (toolbar, comments UI, etc.)
+      uiDisplayFallbackFont: "Arial, Helvetica, sans-serif",
       isDev: false,
       // telemetry config
       telemetry: null,
@@ -152967,7 +153743,7 @@ ${style2}
       this.config.colors = shuffleArray(this.config.colors);
       this.userColorMap = /* @__PURE__ */ new Map();
       this.colorIndex = 0;
-      this.version = "1.0.0-next.2";
+      this.version = "1.0.0-next.4";
       this.#log("🦋 [superdoc] Using SuperDoc version:", this.version);
       this.superdocId = config2.superdocId || v4();
       this.colors = this.config.colors;
@@ -153326,6 +154102,7 @@ ${style2}
         superdoc: this,
         aiApiKey: this.config.modules?.ai?.apiKey,
         aiEndpoint: this.config.modules?.ai?.endpoint,
+        uiDisplayFallbackFont: this.config.uiDisplayFallbackFont,
         ...moduleConfig,
         excludeItems
         // Override moduleConfig.excludeItems with our computed list
@@ -155439,7 +156216,7 @@ ${style2}
       value && typeof value === "object" && "byteLength" in value && "byteOffset" in value
     );
   }
-  const indexBDVXUeCy = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  const indexD_KE9gpD = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
     __proto__: null,
     unified
   }, Symbol.toStringTag, { value: "Module" }));