docgen-utils 1.0.9 → 1.0.11

package/dist/bundle.js

@@ -25609,7 +25609,7 @@ var docgen = (() => {
     };
     return new TableRow({
       tableHeader: isHeaderRow,
-      children: cells.map((cell) => {
+      children: cells.map((cell, cellIndex) => {
         const textRuns = typeof cell === "string" ? [new TextRun({
           text: cell,
           bold: isHeaderRow,
@@ -25649,6 +25649,10 @@ var docgen = (() => {
             fill: "F9FAFB"
           };
         }
+        const isLastCell = cellIndex === cells.length - 1;
+        const remainingColumns = columnCount - cells.length;
+        const needsSpan = isLastCell && remainingColumns > 0;
+        const cellColumnSpan = needsSpan ? remainingColumns + 1 : void 0;
         return new TableCell({
           children: [
             new Paragraph({
@@ -25659,6 +25663,7 @@ var docgen = (() => {
             size: 100 / columnCount,
             type: WidthType.PERCENTAGE
           },
+          columnSpan: cellColumnSpan,
           shading,
           // Apply cell padding from CSS
           margins: cellPadding ? {
@@ -25801,10 +25806,11 @@ var docgen = (() => {
       }
       case "table": {
         const useHeaderStyling = element.noBorders ? false : element.hasHeader !== false;
+        const maxColumnCount = Math.max(...element.rows.map((row) => row.length));
         const tableRows = element.rows.map((row, rowIndex) => createTableRow(
           row,
           useHeaderStyling && rowIndex === 0,
-          row.length,
+          maxColumnCount,
           element.cellPadding,
           element.headerBackgroundColor,
           element.headerTextColor,
@@ -28627,6 +28633,45 @@ ${generateStylesCss(styleMap, themeFonts)}
   var PT_PER_PX = 0.75;
   var PX_PER_IN = 96;
   var SINGLE_WEIGHT_FONTS = ["impact"];
+  var FONT_FAMILY_MAP = {
+    // Common sans-serif web fonts → Calibri (default Office sans-serif)
+    // Fonts that are commonly available via Google Fonts CDN are NOT mapped here,
+    // to preserve original font names for systems that have them installed.
+    "roboto": "Calibri",
+    "open sans": "Calibri",
+    "lato": "Calibri",
+    "montserrat": "Calibri",
+    "poppins": "Calibri",
+    "source sans pro": "Calibri",
+    "nunito": "Calibri",
+    "raleway": "Calibri",
+    "ubuntu": "Calibri",
+    "pt sans": "Calibri",
+    "noto sans": "Calibri",
+    "fira sans": "Calibri",
+    "work sans": "Calibri",
+    // Serif fonts → Georgia (closest web-safe serif)
+    "playfair display": "Georgia",
+    "merriweather": "Georgia",
+    "libre baskerville": "Georgia",
+    "pt serif": "Georgia",
+    "noto serif": "Georgia",
+    "lora": "Georgia",
+    // Monospace fonts → Courier New (standard monospace)
+    "fira code": "Courier New",
+    "source code pro": "Courier New",
+    "jetbrains mono": "Courier New"
+  };
+  function mapFontFamily(fontFamily) {
+    const normalized = fontFamily.toLowerCase().trim();
+    return FONT_FAMILY_MAP[normalized] || fontFamily;
+  }
+  function extractFontFace(fontFamily) {
+    if (!fontFamily)
+      return void 0;
+    const firstFont = fontFamily.split(",")[0].replace(/['"]/g, "").trim();
+    return mapFontFamily(firstFont);
+  }
   function pxToInch(px) {
     return px / PX_PER_IN;
   }
@@ -28634,6 +28679,7 @@ ${generateStylesCss(styleMap, themeFonts)}
     return parseFloat(pxStr) * PT_PER_PX;
   }
   function rgbToHex(rgbStr) {
+    rgbStr = rgbStr.replace(/\s*!important\s*$/i, "").trim();
     if (rgbStr === "rgba(0, 0, 0, 0)" || rgbStr === "transparent")
       return "FFFFFF";
     const match = rgbStr.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)/);
@@ -28658,14 +28704,27 @@ ${generateStylesCss(styleMap, themeFonts)}
     const alpha = parseFloat(match[4]);
     return Math.round((1 - alpha) * 100);
   }
+  function extractDashType(borderStyle) {
+    switch (borderStyle.toLowerCase()) {
+      case "dashed":
+        return "dash";
+      case "dotted":
+        return "sysDot";
+      case "solid":
+      default:
+        return void 0;
+    }
+  }
   function parseCssGradient(gradientStr) {
     const colorToHex = (colorStr) => {
       colorStr = colorStr.trim().toLowerCase();
+      colorStr = colorStr.replace(/\s*!important\s*$/i, "");
       if (colorStr === "transparent") {
         return "000000";
       }
       if (colorStr.startsWith("#")) {
         let hex = colorStr.slice(1);
+        hex = hex.replace(/[^0-9a-f]/gi, "");
         if (hex.length === 3)
           hex = hex.split("").map((c) => c + c).join("");
         return hex.toUpperCase();
@@ -28678,6 +28737,7 @@ ${generateStylesCss(styleMap, themeFonts)}
     };
     const extractTransparency = (colorStr) => {
       colorStr = colorStr.trim().toLowerCase();
+      colorStr = colorStr.replace(/\s*!important\s*$/i, "");
       if (colorStr === "transparent") {
         return 100;
       }
@@ -28894,6 +28954,14 @@ ${generateStylesCss(styleMap, themeFonts)}
     }
     return text;
   }
+  function getTransformedText(element, computed) {
+    const rawText = element.textContent?.trim() || "";
+    const textTransform = computed.textTransform;
+    if (textTransform && textTransform !== "none") {
+      return applyTextTransform(rawText, textTransform);
+    }
+    return rawText;
+  }
   function getRotation(transform, writingMode) {
     let angle = 0;
     if (writingMode === "vertical-rl") {
@@ -29107,6 +29175,332 @@ ${generateStylesCss(styleMap, themeFonts)}
       opacity
     };
   }
+  function parseClipPathPolygon(clipPath) {
+    if (!clipPath || clipPath === "none")
+      return null;
+    const polygonMatch = clipPath.match(/polygon\(([^)]+)\)/);
+    if (!polygonMatch)
+      return null;
+    const points = [];
+    const pairs = polygonMatch[1].split(",");
+    for (const pair of pairs) {
+      const coords = pair.trim().split(/\s+/);
+      if (coords.length < 2)
+        continue;
+      const x = parseFloat(coords[0]) / 100;
+      const y = parseFloat(coords[1]) / 100;
+      if (isNaN(x) || isNaN(y))
+        continue;
+      points.push({ x, y });
+    }
+    return points.length >= 3 ? points : null;
+  }
+  function renderConicGradientAsImage(conicGradientCSS, width, height, isCircle, doc) {
+    try {
+      const canvas = doc.createElement("canvas");
+      const scale = 2;
+      canvas.width = Math.round(width * scale);
+      canvas.height = Math.round(height * scale);
+      const ctx = canvas.getContext("2d");
+      if (!ctx)
+        return null;
+      const conicIdx = conicGradientCSS.indexOf("conic-gradient(");
+      if (conicIdx === -1)
+        return null;
+      let depth = 0;
+      let startIdx = -1;
+      let endIdx = -1;
+      for (let i = conicIdx + "conic-gradient".length; i < conicGradientCSS.length; i++) {
+        if (conicGradientCSS[i] === "(") {
+          if (depth === 0)
+            startIdx = i + 1;
+          depth++;
+        } else if (conicGradientCSS[i] === ")") {
+          depth--;
+          if (depth === 0) {
+            endIdx = i;
+            break;
+          }
+        }
+      }
+      if (startIdx === -1 || endIdx === -1)
+        return null;
+      let innerContent = conicGradientCSS.substring(startIdx, endIdx).trim();
+      let startAngleDeg = 0;
+      const fromMatch = innerContent.match(/^from\s+([\d.]+)(deg|rad|turn|grad)/i);
+      if (fromMatch) {
+        const val = parseFloat(fromMatch[1]);
+        const unit = fromMatch[2].toLowerCase();
+        if (unit === "deg")
+          startAngleDeg = val;
+        else if (unit === "rad")
+          startAngleDeg = val * (180 / Math.PI);
+        else if (unit === "turn")
+          startAngleDeg = val * 360;
+        else if (unit === "grad")
+          startAngleDeg = val * 0.9;
+        innerContent = innerContent.substring(fromMatch[0].length).replace(/^\s*,\s*/, "");
+      }
+      let centerXFrac = 0.5;
+      let centerYFrac = 0.5;
+      const atMatch = innerContent.match(/^at\s+([\d.]+)(%|px)?\s+([\d.]+)(%|px)?/i);
+      if (atMatch) {
+        const xVal = parseFloat(atMatch[1]);
+        const xUnit = atMatch[2] || "%";
+        const yVal = parseFloat(atMatch[3]);
+        const yUnit = atMatch[4] || "%";
+        centerXFrac = xUnit === "%" ? xVal / 100 : xVal / width;
+        centerYFrac = yUnit === "%" ? yVal / 100 : yVal / height;
+        innerContent = innerContent.substring(atMatch[0].length).replace(/^\s*,\s*/, "");
+      }
+      const stopParts = [];
+      let current = "";
+      let parenDepth = 0;
+      for (let i = 0; i < innerContent.length; i++) {
+        const ch = innerContent[i];
+        if (ch === "(")
+          parenDepth++;
+        else if (ch === ")")
+          parenDepth--;
+        else if (ch === "," && parenDepth === 0) {
+          stopParts.push(current.trim());
+          current = "";
+          continue;
+        }
+        current += ch;
+      }
+      if (current.trim())
+        stopParts.push(current.trim());
+      if (stopParts.length === 0)
+        return null;
+      const rawStops = [];
+      for (const part of stopParts) {
+        const trimmed = part.trim();
+        const posPattern = /([\d.]+)(deg|%|turn|rad|grad)/gi;
+        const positions = [];
+        let m;
+        while ((m = posPattern.exec(trimmed)) !== null) {
+          positions.push({ value: parseFloat(m[1]), unit: m[2].toLowerCase(), index: m.index });
+        }
+        const trailingPositions = [];
+        if (positions.length > 0) {
+          const lastPos = positions[positions.length - 1];
+          const lastEnd = lastPos.index + `${lastPos.value}${lastPos.unit}`.length;
+          if (Math.abs(lastEnd - trimmed.length) <= 1) {
+            for (let i = positions.length - 1; i >= 0; i--) {
+              const p = positions[i];
+              const lastParen = trimmed.lastIndexOf(")");
+              if (p.index > lastParen) {
+                trailingPositions.unshift({ value: p.value, unit: p.unit });
+              }
+            }
+          }
+        }
+        let color;
+        if (trailingPositions.length > 0) {
+          const firstPosIdx = positions.find((p) => trailingPositions.some((tp) => tp.value === p.value && tp.unit === p.unit))?.index ?? trimmed.length;
+          color = trimmed.substring(0, firstPosIdx).trim();
+        } else {
+          color = trimmed;
+        }
+        const toFraction = (val, unit) => {
+          switch (unit) {
+            case "%":
+              return val / 100;
+            case "deg":
+              return val / 360;
+            case "turn":
+              return val;
+            case "rad":
+              return val / (Math.PI * 2);
+            case "grad":
+              return val / 400;
+            default:
+              return val / 100;
+          }
+        };
+        if (trailingPositions.length >= 2) {
+          rawStops.push({ color, position: toFraction(trailingPositions[0].value, trailingPositions[0].unit) });
+          rawStops.push({ color, position: toFraction(trailingPositions[1].value, trailingPositions[1].unit) });
+        } else if (trailingPositions.length === 1) {
+          rawStops.push({ color, position: toFraction(trailingPositions[0].value, trailingPositions[0].unit) });
+        } else {
+          rawStops.push({ color, position: null });
+        }
+      }
+      if (rawStops.length === 0)
+        return null;
+      if (rawStops[0].position === null)
+        rawStops[0].position = 0;
+      if (rawStops[rawStops.length - 1].position === null)
+        rawStops[rawStops.length - 1].position = 1;
+      let lastKnownIdx = 0;
+      for (let i = 1; i < rawStops.length; i++) {
+        if (rawStops[i].position !== null) {
+          const gapCount = i - lastKnownIdx;
+          if (gapCount > 1) {
+            const startVal = rawStops[lastKnownIdx].position;
+            const endVal = rawStops[i].position;
+            for (let j = lastKnownIdx + 1; j < i; j++) {
+              rawStops[j].position = startVal + (endVal - startVal) * ((j - lastKnownIdx) / gapCount);
+            }
+          }
+          lastKnownIdx = i;
+        }
+      }
+      ctx.scale(scale, scale);
+      const cx = width * centerXFrac;
+      const cy = height * centerYFrac;
+      const startAngleRad = startAngleDeg * Math.PI / 180;
+      if (typeof ctx.createConicGradient === "function") {
+        const grad = ctx.createConicGradient(startAngleRad, cx, cy);
+        for (const stop of rawStops) {
+          try {
+            grad.addColorStop(Math.max(0, Math.min(1, stop.position)), stop.color);
+          } catch {
+          }
+        }
+        ctx.fillStyle = grad;
+        ctx.fillRect(0, 0, width, height);
+      } else {
+        const scaledCx = cx;
+        const scaledCy = cy;
+        const radius = Math.max(width, height) * 1.5;
+        const angleOffset = startAngleRad - Math.PI / 2;
+        for (let i = 0; i < rawStops.length - 1; i++) {
+          const startFrac = rawStops[i].position;
+          const endFrac = rawStops[i + 1].position;
+          if (endFrac <= startFrac)
+            continue;
+          const slices = Math.max(1, Math.ceil((endFrac - startFrac) * 360));
+          for (let s = 0; s < slices; s++) {
+            const t = s / slices;
+            const fracStart = startFrac + (endFrac - startFrac) * t;
+            const fracEnd = startFrac + (endFrac - startFrac) * ((s + 1) / slices);
+            const a1 = fracStart * Math.PI * 2 + angleOffset;
+            const a2 = fracEnd * Math.PI * 2 + angleOffset;
+            const c1 = rawStops[i].color;
+            const c2 = rawStops[i + 1].color;
+            const blendColor = t < 0.5 ? c1 : c2;
+            ctx.beginPath();
+            ctx.moveTo(scaledCx, scaledCy);
+            ctx.arc(scaledCx, scaledCy, radius, a1, a2);
+            ctx.closePath();
+            ctx.fillStyle = blendColor;
+            ctx.fill();
+          }
+        }
+      }
+      if (isCircle) {
+        ctx.globalCompositeOperation = "destination-in";
+        ctx.beginPath();
+        ctx.arc(cx, cy, Math.min(cx, cy), 0, Math.PI * 2);
+        ctx.fill();
+        ctx.globalCompositeOperation = "source-over";
+      }
+      return canvas.toDataURL("image/png");
+    } catch {
+      return null;
+    }
+  }
+  function renderBlurredElementAsImage(el, blurPx, win) {
+    try {
+      const rect = el.getBoundingClientRect();
+      if (rect.width <= 0 || rect.height <= 0)
+        return null;
+      const doc = win.document;
+      const computed = win.getComputedStyle(el);
+      const spread = blurPx * 3;
+      const canvasW = rect.width + spread * 2;
+      const canvasH = rect.height + spread * 2;
+      const scale = 2;
+      const canvas = doc.createElement("canvas");
+      canvas.width = Math.round(canvasW * scale);
+      canvas.height = Math.round(canvasH * scale);
+      const ctx = canvas.getContext("2d");
+      if (!ctx)
+        return null;
+      ctx.scale(scale, scale);
+      const opacity = parseFloat(computed.opacity);
+      if (!isNaN(opacity) && opacity < 1) {
+        ctx.globalAlpha = opacity;
+      }
+      ctx.filter = `blur(${blurPx}px)`;
+      const bgImage = computed.backgroundImage;
+      const bgColor = computed.backgroundColor;
+      const borderRadius = parseFloat(computed.borderRadius) || 0;
+      const isCircle = borderRadius >= Math.min(rect.width, rect.height) / 2 - 1;
+      const offsetX = spread;
+      const offsetY = spread;
+      if (bgImage && bgImage !== "none" && bgImage.includes("gradient")) {
+        if (bgImage.includes("radial-gradient")) {
+          const centerX = offsetX + rect.width / 2;
+          const centerY = offsetY + rect.height / 2;
+          const gradientRadius = Math.max(rect.width, rect.height) / 2;
+          const canvasGrad = ctx.createRadialGradient(centerX, centerY, 0, centerX, centerY, gradientRadius);
+          const colorRegex = /rgba?\([^)]+\)|transparent|#[0-9a-fA-F]+/g;
+          const pctRegex = /([\d.]+)%/g;
+          const colors = Array.from(bgImage.matchAll(colorRegex)).map((m) => m[0]);
+          const percents = Array.from(bgImage.matchAll(pctRegex)).map((m) => parseFloat(m[1]) / 100);
+          for (let i = 0; i < colors.length; i++) {
+            const pct = percents[i] !== void 0 ? percents[i] : i / Math.max(colors.length - 1, 1);
+            try {
+              canvasGrad.addColorStop(Math.min(1, Math.max(0, pct)), colors[i]);
+            } catch {
+            }
+          }
+          ctx.fillStyle = canvasGrad;
+        } else if (bgImage.includes("linear-gradient")) {
+          const canvasGrad = ctx.createLinearGradient(offsetX, offsetY, offsetX + rect.width, offsetY + rect.height);
+          const colorRegex = /rgba?\([^)]+\)|transparent|#[0-9a-fA-F]+/g;
+          const pctRegex = /([\d.]+)%/g;
+          const colors = Array.from(bgImage.matchAll(colorRegex)).map((m) => m[0]);
+          const percents = Array.from(bgImage.matchAll(pctRegex)).map((m) => parseFloat(m[1]) / 100);
+          for (let i = 0; i < colors.length; i++) {
+            const pct = percents[i] !== void 0 ? percents[i] : i / Math.max(colors.length - 1, 1);
+            try {
+              canvasGrad.addColorStop(Math.min(1, Math.max(0, pct)), colors[i]);
+            } catch {
+            }
+          }
+          ctx.fillStyle = canvasGrad;
+        }
+      } else if (bgColor && bgColor !== "rgba(0, 0, 0, 0)") {
+        ctx.fillStyle = bgColor;
+      }
+      if (isCircle) {
+        ctx.beginPath();
+        ctx.arc(offsetX + rect.width / 2, offsetY + rect.height / 2, Math.min(rect.width, rect.height) / 2, 0, Math.PI * 2);
+        ctx.fill();
+      } else if (borderRadius > 0) {
+        const r = Math.min(borderRadius, rect.width / 2, rect.height / 2);
+        ctx.beginPath();
+        ctx.moveTo(offsetX + r, offsetY);
+        ctx.lineTo(offsetX + rect.width - r, offsetY);
+        ctx.quadraticCurveTo(offsetX + rect.width, offsetY, offsetX + rect.width, offsetY + r);
+        ctx.lineTo(offsetX + rect.width, offsetY + rect.height - r);
+        ctx.quadraticCurveTo(offsetX + rect.width, offsetY + rect.height, offsetX + rect.width - r, offsetY + rect.height);
+        ctx.lineTo(offsetX + r, offsetY + rect.height);
+        ctx.quadraticCurveTo(offsetX, offsetY + rect.height, offsetX, offsetY + rect.height - r);
+        ctx.lineTo(offsetX, offsetY + r);
+        ctx.quadraticCurveTo(offsetX, offsetY, offsetX + r, offsetY);
+        ctx.closePath();
+        ctx.fill();
+      } else {
+        ctx.fillRect(offsetX, offsetY, rect.width, rect.height);
+      }
+      const dataUri = canvas.toDataURL("image/png");
+      return {
+        dataUri,
+        x: rect.left - spread,
+        y: rect.top - spread,
+        w: canvasW,
+        h: canvasH
+      };
+    } catch {
+      return null;
+    }
+  }
   function extractPseudoElements(el, win) {
     const results = [];
     const parentRect = el.getBoundingClientRect();
@@ -29164,14 +29558,13 @@ ${generateStylesCss(styleMap, themeFonts)}
       let rectRadius = 0;
       const borderRadius = pComputed.borderRadius;
       const radiusValue = parseFloat(borderRadius);
-      if (radiusValue > 0) {
+      const isCircularRadius = borderRadius.includes("%") ? radiusValue >= 50 : radiusValue > 0 && radiusValue >= Math.min(pWidth, pHeight) / 2 - 1;
+      const aspectRatio = pWidth / pHeight;
+      const isEllipse = isCircularRadius && aspectRatio > 0.5 && aspectRatio < 2;
+      if (radiusValue > 0 && !isEllipse) {
         if (borderRadius.includes("%")) {
-          if (radiusValue >= 50) {
-            rectRadius = 1;
-          } else {
-            const minDim = Math.min(pWidth, pHeight);
-            rectRadius = radiusValue / 100 * pxToInch(minDim);
-          }
+          const minDim = Math.min(pWidth, pHeight);
+          rectRadius = radiusValue / 100 * pxToInch(minDim);
         } else {
           rectRadius = pxToInch(radiusValue);
         }
@@ -29193,11 +29586,12 @@ ${generateStylesCss(styleMap, themeFonts)}
           gradient,
           transparency: hasBg ? extractAlpha(pComputed.backgroundColor) : null,
           line: null,
-          rectRadius,
+          rectRadius: isEllipse ? 0 : rectRadius,
           shadow,
           opacity: hasOpacity ? elementOpacity : null,
-          isEllipse: false,
-          softEdge: null
+          isEllipse,
+          softEdge: null,
+          customGeometry: null
         }
       };
       results.push(shapeElement);
@@ -29269,10 +29663,23 @@ ${generateStylesCss(styleMap, themeFonts)}
             if (transparency !== null)
               options.transparency = transparency;
           }
+          const bgClip = computed.webkitBackgroundClip || computed.backgroundClip;
+          const textFillColor = computed.webkitTextFillColor;
+          const isTextFillTransparent = textFillColor === "transparent" || textFillColor === "rgba(0, 0, 0, 0)" || textFillColor && textFillColor.includes("rgba") && textFillColor.endsWith(", 0)");
+          if (bgClip === "text" && isTextFillTransparent) {
+            const bgImage = computed.backgroundImage;
+            if (bgImage && bgImage !== "none" && (bgImage.includes("linear-gradient") || bgImage.includes("radial-gradient"))) {
+              const textGradient = parseCssGradient(bgImage);
+              if (textGradient) {
+                options.fontFill = { type: "gradient", gradient: textGradient };
+                delete options.color;
+              }
+            }
+          }
           if (computed.fontSize)
             options.fontSize = pxToPoints(computed.fontSize);
           if (computed.fontFamily) {
-            options.fontFace = computed.fontFamily.split(",")[0].replace(/['"]/g, "").trim();
+            options.fontFace = extractFontFace(computed.fontFamily);
           }
           const runLetterSpacing = extractLetterSpacing(computed);
           if (runLetterSpacing !== null)
@@ -29345,10 +29752,14 @@ ${generateStylesCss(styleMap, themeFonts)}
         const hasBorder = computed2.borderWidth && parseFloat(computed2.borderWidth) > 0 || computed2.borderTopWidth && parseFloat(computed2.borderTopWidth) > 0 || computed2.borderRightWidth && parseFloat(computed2.borderRightWidth) > 0 || computed2.borderBottomWidth && parseFloat(computed2.borderBottomWidth) > 0 || computed2.borderLeftWidth && parseFloat(computed2.borderLeftWidth) > 0;
         const spanBgImage = computed2.backgroundImage;
         const hasGradientBg = spanBgImage && spanBgImage !== "none" && (spanBgImage.includes("linear-gradient") || spanBgImage.includes("radial-gradient"));
-        if (hasBg || hasBorder || hasGradientBg) {
+        const spanBgClip = computed2.webkitBackgroundClip || computed2.backgroundClip;
+        const spanTextFillColor = computed2.webkitTextFillColor;
+        const isGradientTextFill = hasGradientBg && spanBgClip === "text" && (spanTextFillColor === "transparent" || spanTextFillColor === "rgba(0, 0, 0, 0)" || spanTextFillColor && spanTextFillColor.includes("rgba") && spanTextFillColor.endsWith(", 0)"));
+        if (isGradientTextFill) {
+        } else if (hasBg || hasBorder || hasGradientBg) {
           const rect2 = htmlEl.getBoundingClientRect();
           if (rect2.width > 0 && rect2.height > 0) {
-            const text2 = el.textContent.trim();
+            const text2 = getTransformedText(htmlEl, computed2);
             const bgGradient = parseCssGradient(computed2.backgroundImage);
             const borderRadius = computed2.borderRadius;
             const radiusValue = parseFloat(borderRadius);
@@ -29372,6 +29783,8 @@ ${generateStylesCss(styleMap, themeFonts)}
             const spanOpacity = parseFloat(computed2.opacity);
             const hasSpanOpacity = !isNaN(spanOpacity) && spanOpacity < 1;
             const spanShadow = parseBoxShadow(computed2.boxShadow);
+            const spanWhiteSpace = computed2.whiteSpace;
+            const spanShouldNotWrap = spanWhiteSpace === "nowrap" || spanWhiteSpace === "pre" || rect2.width < 100 || rect2.height < 50;
             const shapeElement = {
               type: "shape",
               position: {
@@ -29384,11 +29797,12 @@ ${generateStylesCss(styleMap, themeFonts)}
               textRuns: null,
               style: text2 ? {
                 fontSize: pxToPoints(computed2.fontSize),
-                fontFace: computed2.fontFamily.split(",")[0].replace(/['"]/g, "").trim(),
+                fontFace: extractFontFace(computed2.fontFamily),
                 color: rgbToHex(computed2.color),
                 bold: parseInt(computed2.fontWeight) >= 600,
                 align: "center",
-                valign: "middle"
+                valign: "middle",
+                wrap: !spanShouldNotWrap
               } : null,
               shape: {
                 fill: hasBg ? rgbToHex(computed2.backgroundColor) : null,
@@ -29397,13 +29811,15 @@ ${generateStylesCss(styleMap, themeFonts)}
                 line: hasUniformBorder ? {
                   color: rgbToHex(computed2.borderColor),
                   width: pxToPoints(borderTop),
-                  transparency: extractAlpha(computed2.borderColor)
+                  transparency: extractAlpha(computed2.borderColor),
+                  dashType: extractDashType(computed2.borderStyle)
                 } : null,
                 rectRadius: spanIsEllipse ? 0 : rectRadius,
                 shadow: spanShadow,
                 opacity: hasSpanOpacity ? spanOpacity : null,
                 isEllipse: spanIsEllipse,
-                softEdge: null
+                softEdge: null,
+                customGeometry: null
               }
             };
             elements.push(shapeElement);
@@ -29414,15 +29830,29 @@ ${generateStylesCss(styleMap, themeFonts)}
         const parent = el.parentElement;
         if (parent && parent.tagName === "DIV") {
           const rect2 = htmlEl.getBoundingClientRect();
-          const text2 = el.textContent.trim();
+          const computed22 = win.getComputedStyle(el);
+          const text2 = getTransformedText(htmlEl, computed22);
           if (rect2.width > 0 && rect2.height > 0 && text2) {
-            const computed22 = win.getComputedStyle(el);
             const fontSizePx2 = parseFloat(computed22.fontSize);
             const lineHeightPx2 = parseFloat(computed22.lineHeight);
             const lineHeightMultiplier2 = fontSizePx2 > 0 && !isNaN(lineHeightPx2) ? lineHeightPx2 / fontSizePx2 : 1;
+            const span2BgClip = computed22.webkitBackgroundClip || computed22.backgroundClip;
+            const span2TextFillColor = computed22.webkitTextFillColor;
+            const span2IsGradientText = span2BgClip === "text" && (span2TextFillColor === "transparent" || span2TextFillColor === "rgba(0, 0, 0, 0)" || span2TextFillColor && span2TextFillColor.includes("rgba") && span2TextFillColor.endsWith(", 0)"));
+            const span2BgImage = computed22.backgroundImage;
+            const span2HasGradientBg = span2BgImage && span2BgImage !== "none" && (span2BgImage.includes("linear-gradient") || span2BgImage.includes("radial-gradient"));
+            let spanFontFill = void 0;
+            let spanTextColor = rgbToHex(computed22.color);
+            if (span2IsGradientText && span2HasGradientBg) {
+              const spanGradient = parseCssGradient(span2BgImage);
+              if (spanGradient) {
+                spanFontFill = { type: "gradient", gradient: spanGradient };
+                spanTextColor = null;
+              }
+            }
             const textElement = {
               type: "p",
-              text: [{ text: text2, options: {} }],
+              text: [{ text: text2, options: spanFontFill ? { fontFill: spanFontFill } : {} }],
               position: {
                 x: pxToInch(rect2.left),
                 y: pxToInch(rect2.top),
@@ -29431,13 +29861,14 @@ ${generateStylesCss(styleMap, themeFonts)}
               },
               style: {
                 fontSize: pxToPoints(computed22.fontSize),
-                fontFace: computed22.fontFamily.split(",")[0].replace(/['"]/g, "").trim(),
-                color: rgbToHex(computed22.color),
+                fontFace: extractFontFace(computed22.fontFamily),
+                color: spanTextColor,
                 bold: parseInt(computed22.fontWeight) >= 600,
                 italic: computed22.fontStyle === "italic",
                 align: computed22.textAlign === "center" ? "center" : computed22.textAlign === "right" ? "right" : "left",
                 valign: "middle",
-                lineSpacing: lineHeightMultiplier2 * pxToPoints(computed22.fontSize)
+                lineSpacing: lineHeightMultiplier2 * pxToPoints(computed22.fontSize),
+                fontFill: spanFontFill
               }
             };
             elements.push(textElement);
@@ -29576,7 +30007,7 @@ ${generateStylesCss(styleMap, themeFonts)}
           return;
         }
       }
-      if (el.tagName === "svg") {
+      if (el.tagName.toLowerCase() === "svg") {
         const rect2 = htmlEl.getBoundingClientRect();
         if (rect2.width > 0 && rect2.height > 0) {
           const computedStyle = win.getComputedStyle(htmlEl);
@@ -29626,30 +30057,73 @@ ${generateStylesCss(styleMap, themeFonts)}
             }
             return null;
           };
-          const resolveDynamicColors = (element) => {
-            const fill = element.getAttribute("fill");
+          const originalElements = [el, ...Array.from(el.querySelectorAll("*"))];
+          const computedStylesMap = /* @__PURE__ */ new Map();
+          originalElements.forEach((origEl, index) => {
+            const isSvgElement = origEl.namespaceURI === "http://www.w3.org/2000/svg";
+            if (isSvgElement) {
+              const style = win.getComputedStyle(origEl);
+              computedStylesMap.set(index, {
+                fill: style.fill || "",
+                stroke: style.stroke || "",
+                strokeWidth: style.strokeWidth || ""
+              });
+            }
+          });
+          const cloneElements = [svgClone, ...Array.from(svgClone.querySelectorAll("*"))];
+          cloneElements.forEach((cloneEl, index) => {
+            const isSvgElement = cloneEl.namespaceURI === "http://www.w3.org/2000/svg";
+            const fill = cloneEl.getAttribute("fill");
             const resolvedFill = resolveColorValue(fill);
             if (resolvedFill) {
-              element.setAttribute("fill", resolvedFill);
+              cloneEl.setAttribute("fill", resolvedFill);
+            } else if (!fill && isSvgElement) {
+              const computed2 = computedStylesMap.get(index);
+              if (computed2 && computed2.fill) {
+                if (computed2.fill === "none") {
+                  cloneEl.setAttribute("fill", "none");
+                } else if (computed2.fill !== "rgb(0, 0, 0)") {
+                  cloneEl.setAttribute("fill", computed2.fill);
+                }
+              }
             }
-            const stroke = element.getAttribute("stroke");
+            const stroke = cloneEl.getAttribute("stroke");
             const resolvedStroke = resolveColorValue(stroke);
             if (resolvedStroke) {
-              element.setAttribute("stroke", resolvedStroke);
+              cloneEl.setAttribute("stroke", resolvedStroke);
+            } else if (!stroke && isSvgElement) {
+              const computed2 = computedStylesMap.get(index);
+              if (computed2 && computed2.stroke && computed2.stroke !== "none") {
+                cloneEl.setAttribute("stroke", computed2.stroke);
+              }
+              if (computed2 && computed2.strokeWidth && computed2.strokeWidth !== "1px" && !cloneEl.getAttribute("stroke-width")) {
+                cloneEl.setAttribute("stroke-width", computed2.strokeWidth);
+              }
             }
-            element.querySelectorAll("*").forEach(resolveDynamicColors);
-          };
-          resolveDynamicColors(svgClone);
+          });
           const serializer = new XMLSerializer();
           const svgString = serializer.serializeToString(svgClone);
           const svgBase64 = btoa(unescape(encodeURIComponent(svgString)));
           const dataUri = `data:image/svg+xml;base64,${svgBase64}`;
+          let svgY = rect2.top;
+          const computedAlign = win.getComputedStyle(htmlEl);
+          const verticalAlign = computedAlign.verticalAlign;
+          if (verticalAlign === "middle" && el.parentElement) {
+            const parentComputed = win.getComputedStyle(el.parentElement);
+            const parentIsFlex = parentComputed.display === "flex" || parentComputed.display === "inline-flex";
+            if (!parentIsFlex) {
+              const parentRect = el.parentElement.getBoundingClientRect();
+              if (parentRect.height > rect2.height) {
+                svgY = parentRect.top + (parentRect.height - rect2.height) / 2;
+              }
+            }
+          }
           const imageElement = {
             type: "image",
             src: dataUri,
             position: {
               x: pxToInch(rect2.left),
-              y: pxToInch(rect2.top),
+              y: pxToInch(svgY),
               w: pxToInch(rect2.width),
               h: pxToInch(rect2.height)
             },
@@ -29662,13 +30136,131 @@ ${generateStylesCss(styleMap, themeFonts)}
         }
       }
       if (el.tagName === "I") {
+        const rect2 = htmlEl.getBoundingClientRect();
+        if (rect2.width > 0 && rect2.height > 0) {
+          const computed2 = win.getComputedStyle(htmlEl);
+          const beforeComputed = win.getComputedStyle(htmlEl, "::before");
+          const fontFamily = beforeComputed.fontFamily || computed2.fontFamily;
+          const content = beforeComputed.content;
+          const isFontIcon = fontFamily.toLowerCase().includes("font awesome") || fontFamily.toLowerCase().includes("fontawesome") || fontFamily.toLowerCase().includes("fa ") || fontFamily.toLowerCase().includes("material") || fontFamily.toLowerCase().includes("icon");
+          if (isFontIcon && content && content !== "none" && content !== "normal") {
+            try {
+              const scale = 8;
+              const w2 = Math.ceil(rect2.width);
+              const h2 = Math.ceil(rect2.height);
+              const iframeDoc = win.document;
+              const canvas = iframeDoc.createElement("canvas");
+              canvas.width = w2 * scale;
+              canvas.height = h2 * scale;
+              const ctx = canvas.getContext("2d");
+              if (ctx) {
+                ctx.scale(scale, scale);
+                let iconChar = content.replace(/['"]/g, "");
+                if (iconChar.startsWith("\\")) {
+                  const codePoint = parseInt(iconChar.slice(1), 16);
+                  if (!isNaN(codePoint)) {
+                    iconChar = String.fromCodePoint(codePoint);
+                  }
+                }
+                const fontSize = parseFloat(beforeComputed.fontSize) || parseFloat(computed2.fontSize) || 16;
+                const fontWeight = beforeComputed.fontWeight || computed2.fontWeight || "900";
+                const fontFamilies = fontFamily.split(",").map((f) => f.trim().replace(/['"]/g, ""));
+                let fontSet = false;
+                for (const ff of fontFamilies) {
+                  const fontSpec = `${fontWeight} ${fontSize}px "${ff}"`;
+                  if (iframeDoc.fonts && iframeDoc.fonts.check(fontSpec)) {
+                    ctx.font = fontSpec;
+                    fontSet = true;
+                    break;
+                  }
+                }
+                if (!fontSet) {
+                  ctx.font = `${fontWeight} ${fontSize}px ${fontFamily}`;
+                }
+                ctx.fillStyle = computed2.color || "white";
+                ctx.textAlign = "center";
+                ctx.textBaseline = "middle";
+                ctx.fillText(iconChar, w2 / 2, h2 / 2);
+                const dataUri = canvas.toDataURL("image/png");
+                const imageElement = {
+                  type: "image",
+                  src: dataUri,
+                  position: {
+                    x: pxToInch(rect2.left),
+                    y: pxToInch(rect2.top),
+                    w: pxToInch(rect2.width),
+                    h: pxToInch(rect2.height)
+                  },
+                  sizing: null
+                };
+                elements.push(imageElement);
+              }
+            } catch {
+            }
+          }
+        }
         processed.add(el);
         return;
       }
       const isContainer = el.tagName === "DIV" && !textTags.includes(el.tagName);
       if (isContainer) {
         const computed2 = win.getComputedStyle(el);
+        const divFilterStr = computed2.filter;
+        if (divFilterStr && divFilterStr !== "none") {
+          const divBlurMatch = divFilterStr.match(/blur\(([\d.]+)px\)/);
+          if (divBlurMatch) {
+            const divBlurPx = parseFloat(divBlurMatch[1]);
+            if (divBlurPx > 20) {
+              const blurResult = renderBlurredElementAsImage(htmlEl, divBlurPx, win);
+              if (blurResult) {
+                const imgElement = {
+                  type: "image",
+                  src: blurResult.dataUri,
+                  position: {
+                    x: pxToInch(blurResult.x),
+                    y: pxToInch(blurResult.y),
+                    w: pxToInch(blurResult.w),
+                    h: pxToInch(blurResult.h)
+                  },
+                  sizing: null,
+                  rectRadius: 0
+                };
+                elements.push(imgElement);
+                processed.add(el);
+                el.querySelectorAll("*").forEach((child) => processed.add(child));
+                return;
+              }
+            }
+          }
+        }
+        const divBgImageForConic = computed2.backgroundImage;
+        if (divBgImageForConic && divBgImageForConic.includes("conic-gradient")) {
+          const rect2 = htmlEl.getBoundingClientRect();
+          if (rect2.width > 0 && rect2.height > 0) {
+            const borderRadiusStr = computed2.borderRadius;
+            const radiusVal = parseFloat(borderRadiusStr);
+            const isCircular = borderRadiusStr.includes("%") ? radiusVal >= 50 : radiusVal > 0 && radiusVal >= Math.min(rect2.width, rect2.height) / 2 - 1;
+            const conicDataUri = renderConicGradientAsImage(divBgImageForConic, rect2.width, rect2.height, isCircular, win.document);
+            if (conicDataUri) {
+              const imgElement = {
+                type: "image",
+                src: conicDataUri,
+                position: {
+                  x: pxToInch(rect2.left),
+                  y: pxToInch(rect2.top),
+                  w: pxToInch(rect2.width),
+                  h: pxToInch(rect2.height)
+                },
+                sizing: null,
+                rectRadius: 0
+              };
+              elements.push(imgElement);
+            }
+          }
+        }
         const hasBg = computed2.backgroundColor && computed2.backgroundColor !== "rgba(0, 0, 0, 0)";
+        const clipPathValue = computed2.clipPath || computed2.webkitClipPath;
+        const clipPathPolygon = parseClipPathPolygon(clipPathValue);
         const elBgImage = computed2.backgroundImage;
         let bgImageUrl = null;
         let bgImageSize = null;
@@ -29784,14 +30376,22 @@ ${generateStylesCss(styleMap, themeFonts)}
               if (textTagSet.has(child.tagName))
                 return true;
               if (child.tagName === "DIV") {
+                const childComputed = win.getComputedStyle(child);
+                const childDisplay = childComputed.display;
+                const childFlexDir = childComputed.flexDirection || "row";
+                const childChildCount = child.children.length;
+                const isFlexRowLayout = (childDisplay === "flex" || childDisplay === "inline-flex") && (childFlexDir === "row" || childFlexDir === "row-reverse") && childChildCount > 1;
+                const isGridLayout = childDisplay === "grid" || childDisplay === "inline-grid";
+                if (isFlexRowLayout || isGridLayout)
+                  return false;
                 const childElements = Array.from(child.children);
-                const isTextOnlyDiv = childElements.length === 0 || childElements.every((ce) => ce.tagName === "BR") || childElements.length === 1 && childElements[0].tagName === "P" && childElements[0].children.length === 0;
+                const inlineTextTags = /* @__PURE__ */ new Set(["STRONG", "EM", "B", "I", "A", "BR", "SPAN", "MARK", "SMALL", "SUB", "SUP", "CODE", "U", "S", "Q", "CITE", "ABBR", "TIME", "DATA"]);
+                const isTextOnlyDiv = childElements.length === 0 || childElements.every((ce) => inlineTextTags.has(ce.tagName)) || childElements.length === 1 && childElements[0].tagName === "P" && (childElements[0].children.length === 0 || Array.from(childElements[0].children).every((ce) => inlineTextTags.has(ce.tagName)));
                 if (!isTextOnlyDiv)
                   return false;
                 const childText = child.textContent?.trim();
                 if (!childText)
                   return false;
-                const childComputed = win.getComputedStyle(child);
                 const childHasBg = childComputed.backgroundColor && childComputed.backgroundColor !== "rgba(0, 0, 0, 0)";
                 const childHasBgImg = childComputed.backgroundImage && childComputed.backgroundImage !== "none";
                 const childBorders = [
@@ -29807,10 +30407,11 @@ ${generateStylesCss(styleMap, themeFonts)}
             });
             const decorativeTags = /* @__PURE__ */ new Set(["I", "SVG", "CANVAS", "VIDEO", "AUDIO", "IFRAME"]);
             const nonTextChildren = allChildren.filter((child) => !textTagSet.has(child.tagName) && !decorativeTags.has(child.tagName) && !(child.tagName === "DIV" && textChildren.includes(child)));
+            const inlineTextTagsForSimple = /* @__PURE__ */ new Set(["STRONG", "EM", "B", "I", "A", "BR", "SPAN", "MARK", "SMALL", "SUB", "SUP", "CODE", "U", "S", "Q", "CITE", "ABBR", "TIME", "DATA"]);
             const isSingleTextChild = textChildren.length === 1 && (() => {
               const tc = textChildren[0];
               const tcChildren = Array.from(tc.children);
-              return tcChildren.length === 0 || tcChildren.every((ce) => ce.tagName === "BR") || tcChildren.length === 1 && tcChildren[0].tagName === "P" && tcChildren[0].children.length === 0;
+              return tcChildren.length === 0 || tcChildren.every((ce) => inlineTextTagsForSimple.has(ce.tagName)) || tcChildren.length === 1 && tcChildren[0].tagName === "P" && (tcChildren[0].children.length === 0 || Array.from(tcChildren[0].children).every((ce) => inlineTextTagsForSimple.has(ce.tagName)));
             })() && nonTextChildren.length === 0;
             const display = computed2.display;
             const isFlexContainer2 = display === "flex" || display === "inline-flex";
@@ -29854,26 +30455,32 @@ ${generateStylesCss(styleMap, themeFonts)}
               } else if (textAlign2 === "right" || textAlign2 === "end") {
                 align = "right";
               } else {
-                const paddingLeft = parseFloat(computed2.paddingLeft) || 0;
-                const paddingRight = parseFloat(computed2.paddingRight) || 0;
-                const paddingDiff = Math.abs(paddingLeft - paddingRight);
-                if (paddingLeft > 0 && paddingDiff < 2) {
-                  align = "center";
-                } else {
-                  align = "left";
-                }
+                align = "left";
               }
             }
             let shapeText = "";
             let shapeTextRuns = null;
             let shapeStyle = null;
             const hasTextChildren = textChildren.length > 0;
-            const shouldMergeText = hasTextChildren && (isSingleTextChild || nonTextChildren.length === 0);
+            let directTextContent = "";
+            if (!hasTextChildren) {
+              for (const node of Array.from(el.childNodes)) {
+                if (node.nodeType === Node.TEXT_NODE) {
+                  directTextContent += node.textContent || "";
+                }
+              }
+              directTextContent = directTextContent.trim();
+              if (directTextContent && computed2.textTransform && computed2.textTransform !== "none") {
+                directTextContent = applyTextTransform(directTextContent, computed2.textTransform);
+              }
+            }
+            const hasDirectText = directTextContent.length > 0;
+            const shouldMergeText = hasTextChildren && (isSingleTextChild || nonTextChildren.length === 0) || hasDirectText;
             if (shouldMergeText) {
               if (isSingleTextChild) {
                 const textEl = textChildren[0];
                 const textComputed = win.getComputedStyle(textEl);
-                shapeText = textEl.textContent.trim();
+                shapeText = getTransformedText(textEl, textComputed);
                 let fontFill = null;
                 const textBgClip = textComputed.webkitBackgroundClip || textComputed.backgroundClip;
                 const textFillColor2 = textComputed.webkitTextFillColor;
@@ -29904,7 +30511,7 @@ ${generateStylesCss(styleMap, themeFonts)}
                 const shouldNotWrap = whiteSpace === "nowrap" || whiteSpace === "pre" || rect2.width < 100 || rect2.height < 50;
                 shapeStyle = {
                   fontSize: pxToPoints(textComputed.fontSize || computed2.fontSize),
-                  fontFace: (textComputed.fontFamily || computed2.fontFamily).split(",")[0].replace(/['"]/g, "").trim(),
+                  fontFace: extractFontFace(textComputed.fontFamily || computed2.fontFamily),
                   color: fontFill ? null : rgbToHex(effectiveColor),
                   fontFill,
                   bold: isBold,
@@ -29923,12 +30530,12 @@ ${generateStylesCss(styleMap, themeFonts)}
                   shapeStyle.textShadow = shapeTextShadow.shadow;
                 processed.add(textEl);
                 textEl.querySelectorAll("*").forEach((desc) => processed.add(desc));
-              } else {
+              } else if (hasTextChildren) {
                 shapeTextRuns = [];
                 textChildren.forEach((textChild, idx) => {
                   const textEl = textChild;
                   const textComputed = win.getComputedStyle(textEl);
-                  const fullText = textEl.textContent.trim();
+                  const fullText = getTransformedText(textEl, textComputed);
                   if (!fullText)
                     return;
                   const isBold = textComputed.fontWeight === "bold" || parseInt(textComputed.fontWeight) >= 600;
@@ -29936,7 +30543,7 @@ ${generateStylesCss(styleMap, themeFonts)}
                   const isUnderline = textComputed.textDecoration && textComputed.textDecoration.includes("underline");
                   const baseRunOptions = {
                     fontSize: pxToPoints(textComputed.fontSize),
-                    fontFace: textComputed.fontFamily.split(",")[0].replace(/['"]/g, "").trim(),
+                    fontFace: extractFontFace(textComputed.fontFamily),
                     color: rgbToHex(textComputed.color),
                     bold: isBold,
                     italic: isItalic,
@@ -29962,6 +30569,9 @@ ${generateStylesCss(styleMap, themeFonts)}
                     if (currentSegment.trim())
                       segments.push(currentSegment.trim());
                     segments = segments.filter((s) => s.length > 0);
+                    if (textComputed.textTransform && textComputed.textTransform !== "none") {
+                      segments = segments.map((s) => applyTextTransform(s, textComputed.textTransform));
+                    }
                     segments.forEach((segment, segIdx) => {
                       const prefix = segIdx === 0 && idx > 0 && shapeTextRuns.length > 0 ? "\n" : "";
                       const runText = prefix + segment;
@@ -29984,6 +30594,26 @@ ${generateStylesCss(styleMap, themeFonts)}
                   valign: valign2,
                   inset: 0
                 };
+              } else if (hasDirectText) {
+                shapeText = directTextContent;
+                const isBold = parseInt(computed2.fontWeight) >= 600;
+                const isItalic = computed2.fontStyle === "italic";
+                const whiteSpace = computed2.whiteSpace;
+                const shouldNotWrap = whiteSpace === "nowrap" || whiteSpace === "pre" || rect2.width < 100 || rect2.height < 50;
+                shapeStyle = {
+                  fontSize: pxToPoints(computed2.fontSize),
+                  fontFace: extractFontFace(computed2.fontFamily),
+                  color: rgbToHex(computed2.color),
+                  bold: isBold,
+                  italic: isItalic,
+                  align,
+                  valign: valign2,
+                  inset: 0,
+                  wrap: !shouldNotWrap
+                };
+                const ls = extractLetterSpacing(computed2);
+                if (ls !== null)
+                  shapeStyle.charSpacing = ls;
               }
             }
             if (hasBg || hasUniformBorder || bgGradient) {
@@ -30028,7 +30658,8 @@ ${generateStylesCss(styleMap, themeFonts)}
                   line: hasUniformBorder ? {
                     color: rgbToHex(computed2.borderColor),
                     width: pxToPoints(computed2.borderWidth),
-                    transparency: extractAlpha(computed2.borderColor)
+                    transparency: extractAlpha(computed2.borderColor),
+                    dashType: extractDashType(computed2.borderStyle)
                   } : null,
                   rectRadius: (() => {
                     if (isEllipse)
@@ -30050,12 +30681,43 @@ ${generateStylesCss(styleMap, themeFonts)}
                   shadow,
                   opacity: hasOpacity ? elementOpacity : null,
                   isEllipse,
-                  softEdge: softEdgePt
+                  softEdge: softEdgePt,
+                  customGeometry: clipPathPolygon ? (() => {
+                    const EMU2 = 914400;
+                    const pathW = Math.round(rect2.width / PX_PER_IN * EMU2);
+                    const pathH = Math.round(rect2.height / PX_PER_IN * EMU2);
+                    const points = [];
+                    clipPathPolygon.forEach((pt, i) => {
+                      points.push({
+                        x: Math.round(pt.x * pathW),
+                        y: Math.round(pt.y * pathH),
+                        ...i === 0 ? { moveTo: true } : {}
+                      });
+                    });
+                    points.push({ x: 0, y: 0, close: true });
+                    return points;
+                  })() : null
                 }
               };
               if (hasPadding && shapeElement.style && (shapeText || shapeTextRuns && shapeTextRuns.length > 0)) {
+                let effectiveLeftPadding = paddingLeft;
+                if (hasDirectText && allChildren.length > 0) {
+                  for (const child of allChildren) {
+                    if (child.nodeType === Node.ELEMENT_NODE) {
+                      const childEl = child;
+                      const childRect = childEl.getBoundingClientRect();
+                      const childComputed = win.getComputedStyle(childEl);
+                      const marginRight = parseFloat(childComputed.marginRight) || 0;
+                      effectiveLeftPadding += childRect.width + marginRight;
+                    }
+                  }
+                  const gap = parseFloat(computed2.gap) || 0;
+                  if (gap > 0 && allChildren.length > 0) {
+                    effectiveLeftPadding += gap;
+                  }
+                }
                 shapeElement.style.margin = [
-                  paddingLeft * PT_PER_PX,
+                  effectiveLeftPadding * PT_PER_PX,
                   // left
                   paddingRight * PT_PER_PX,
                   // right
@@ -30081,6 +30743,11 @@ ${generateStylesCss(styleMap, themeFonts)}
               elements.push(fontFillTextElement);
             } else if (isSingleTextChild) {
               processed.delete(textChildren[0]);
+            } else if (textChildren.length > 0) {
+              textChildren.forEach((tc) => {
+                processed.delete(tc);
+                tc.querySelectorAll("*").forEach((desc) => processed.delete(desc));
+              });
             }
             elements.push(...borderLines);
             processed.add(el);
@@ -30090,6 +30757,7 @@ ${generateStylesCss(styleMap, themeFonts)}
         if (isContainer) {
           const rect2 = htmlEl.getBoundingClientRect();
           if (rect2.width > 0 && rect2.height > 0) {
+            const inlineTextTagsSet = /* @__PURE__ */ new Set(["STRONG", "EM", "B", "I", "A", "BR", "SPAN", "MARK", "SMALL", "SUB", "SUP", "CODE", "U", "S", "Q", "CITE", "ABBR", "TIME", "DATA"]);
             let directText = "";
             for (const child of Array.from(el.childNodes)) {
               if (child.nodeType === Node.TEXT_NODE) {
@@ -30098,33 +30766,107 @@ ${generateStylesCss(styleMap, themeFonts)}
             }
             directText = directText.trim();
             const childElements = Array.from(el.children);
-            if (!directText && childElements.length === 1 && childElements[0].tagName === "P" && childElements[0].children.length === 0) {
+            const singlePInlineCheck = /* @__PURE__ */ new Set(["STRONG", "EM", "B", "I", "A", "BR", "SPAN", "MARK", "SMALL", "SUB", "SUP", "CODE", "U", "S"]);
+            if (!directText && childElements.length === 1 && childElements[0].tagName === "P" && (childElements[0].children.length === 0 || Array.from(childElements[0].children).every((ce) => singlePInlineCheck.has(ce.tagName)))) {
               directText = childElements[0].textContent?.trim() || "";
             }
-            const hasStructuralChildren = childElements.length > 0 && !childElements.every((ce) => ce.tagName === "BR") && !(childElements.length === 1 && childElements[0].tagName === "P" && childElements[0].children.length === 0);
-            if (directText && !hasStructuralChildren) {
+            if (directText) {
+              const directTextComputed = win.getComputedStyle(el);
+              if (directTextComputed.textTransform && directTextComputed.textTransform !== "none") {
+                directText = applyTextTransform(directText, directTextComputed.textTransform);
+              }
+            }
+            const plainDivComputed = win.getComputedStyle(el);
+            const plainDivDisplay = plainDivComputed.display;
+            const plainDivFlexDir = plainDivComputed.flexDirection || "row";
+            const plainDivChildCount = el.children.length;
+            const isPlainDivFlexRow = (plainDivDisplay === "flex" || plainDivDisplay === "inline-flex") && (plainDivFlexDir === "row" || plainDivFlexDir === "row-reverse") && plainDivChildCount > 1;
+            const isPlainDivGrid = plainDivDisplay === "grid" || plainDivDisplay === "inline-grid";
+            const allChildrenAreInlineText = !isPlainDivFlexRow && !isPlainDivGrid && (childElements.length === 0 || childElements.every((ce) => inlineTextTagsSet.has(ce.tagName.toUpperCase())));
+            const structuralChildElements = childElements.filter((ce) => {
+              const tagName = ce.tagName.toUpperCase();
+              return tagName !== "BR" && tagName !== "SVG" && !inlineTextTagsSet.has(tagName);
+            });
+            const hasStructuralChildren = structuralChildElements.length > 0;
+            let extractedText = "";
+            if (allChildrenAreInlineText) {
+              extractedText = el.textContent?.trim() || "";
+              const inlineTextComputed = win.getComputedStyle(el);
+              if (extractedText && inlineTextComputed.textTransform && inlineTextComputed.textTransform !== "none") {
+                extractedText = applyTextTransform(extractedText, inlineTextComputed.textTransform);
+              }
+            } else if (directText) {
+              extractedText = directText;
+            }
+            if (extractedText && !hasStructuralChildren) {
               const computed22 = win.getComputedStyle(el);
               const fontSizePx2 = parseFloat(computed22.fontSize);
               const lineHeightPx2 = parseFloat(computed22.lineHeight);
               const lineHeightMultiplier2 = fontSizePx2 > 0 && !isNaN(lineHeightPx2) ? lineHeightPx2 / fontSizePx2 : 1;
+              let textLeft = rect2.left;
+              let textWidth = rect2.width;
+              if (directText && !allChildrenAreInlineText) {
+                for (const child of Array.from(el.childNodes)) {
+                  if (child.nodeType === Node.TEXT_NODE && (child.textContent || "").trim()) {
+                    const range2 = document.createRange();
+                    range2.selectNodeContents(child);
+                    const textRect = range2.getBoundingClientRect();
+                    if (textRect.width > 0) {
+                      textLeft = textRect.left;
+                      textWidth = textRect.width;
+                    }
+                    break;
+                  }
+                }
+              }
+              const textTop = rect2.top;
+              const textHeight = rect2.height;
+              let textRuns;
+              if (allChildrenAreInlineText && childElements.length > 0) {
+                const baseRunOptions = {
+                  fontSize: pxToPoints(computed22.fontSize),
+                  fontFace: extractFontFace(computed22.fontFamily),
+                  color: rgbToHex(computed22.color)
+                };
+                if (parseInt(computed22.fontWeight) >= 600)
+                  baseRunOptions.bold = true;
+                if (computed22.fontStyle === "italic")
+                  baseRunOptions.italic = true;
+                let textTransformFn = (s) => s;
+                if (computed22.textTransform && computed22.textTransform !== "none") {
+                  textTransformFn = (text2) => applyTextTransform(text2, computed22.textTransform);
+                }
+                textRuns = parseInlineFormatting(el, baseRunOptions, [], textTransformFn, win);
+                if (textRuns.length === 0) {
+                  textRuns = [{ text: extractedText, options: {} }];
+                }
+              } else {
+                textRuns = [{ text: extractedText, options: {} }];
+              }
+              const paddingTop = parseFloat(computed22.paddingTop) || 0;
+              const paddingRight = parseFloat(computed22.paddingRight) || 0;
+              const paddingBottom = parseFloat(computed22.paddingBottom) || 0;
+              const paddingLeft = parseFloat(computed22.paddingLeft) || 0;
+              const hasPadding = paddingTop > 0 || paddingRight > 0 || paddingBottom > 0 || paddingLeft > 0;
               const textElement = {
                 type: "p",
-                text: [{ text: directText, options: {} }],
+                text: textRuns,
                 position: {
-                  x: pxToInch(rect2.left),
-                  y: pxToInch(rect2.top),
-                  w: pxToInch(rect2.width),
-                  h: pxToInch(rect2.height)
+                  x: pxToInch(textLeft),
+                  y: pxToInch(textTop),
+                  w: pxToInch(textWidth),
+                  h: pxToInch(textHeight)
                 },
                 style: {
                   fontSize: pxToPoints(computed22.fontSize),
-                  fontFace: computed22.fontFamily.split(",")[0].replace(/['"]/g, "").trim(),
+                  fontFace: extractFontFace(computed22.fontFamily),
                   color: rgbToHex(computed22.color),
                   bold: parseInt(computed22.fontWeight) >= 600,
                   italic: computed22.fontStyle === "italic",
                   align: computed22.textAlign === "center" ? "center" : computed22.textAlign === "right" || computed22.textAlign === "end" ? "right" : "left",
-                  valign: "middle",
-                  lineSpacing: lineHeightMultiplier2 * pxToPoints(computed22.fontSize)
+                  valign: hasPadding ? "top" : "middle",
+                  lineSpacing: lineHeightMultiplier2 * pxToPoints(computed22.fontSize),
+                  margin: hasPadding ? [paddingLeft * PT_PER_PX, paddingRight * PT_PER_PX, paddingBottom * PT_PER_PX, paddingTop * PT_PER_PX] : void 0
                 }
               };
               const textTransparency = extractAlpha(computed22.color);
@@ -30136,7 +30878,11 @@ ${generateStylesCss(styleMap, themeFonts)}
                 textElement.style.charSpacing = ls;
               elements.push(textElement);
               processed.add(el);
-              el.querySelectorAll("*").forEach((desc) => processed.add(desc));
+              el.querySelectorAll("*").forEach((desc) => {
+                if (desc.tagName.toUpperCase() !== "SVG") {
+                  processed.add(desc);
+                }
+              });
               return;
             }
           }
@@ -30190,7 +30936,7 @@ ${generateStylesCss(styleMap, themeFonts)}
           },
           style: {
             fontSize: pxToPoints(liComputed.fontSize),
-            fontFace: liComputed.fontFamily.split(",")[0].replace(/['"]/g, "").trim(),
+            fontFace: extractFontFace(liComputed.fontFamily),
             color: rgbToHex(liComputed.color),
             transparency: extractAlpha(liComputed.color),
             align: liComputed.textAlign === "start" ? "left" : liComputed.textAlign,
@@ -30208,10 +30954,10 @@ ${generateStylesCss(styleMap, themeFonts)}
       if (!textTags.includes(el.tagName) || el.tagName === "SPAN")
         return;
       let rect = htmlEl.getBoundingClientRect();
-      let text = el.textContent.trim();
+      const computed = win.getComputedStyle(el);
+      let text = getTransformedText(htmlEl, computed);
       if (rect.width === 0 || rect.height === 0 || !text)
         return;
-      const computed = win.getComputedStyle(el);
       const isFlexContainer = computed.display === "flex" || computed.display === "inline-flex";
       if (isFlexContainer && el.children.length > 0) {
         const textNodes = [];
@@ -30227,7 +30973,20 @@ ${generateStylesCss(styleMap, themeFonts)}
           const textRect = range2.getBoundingClientRect();
           if (textRect.width > 0 && textRect.height > 0) {
             rect = textRect;
-            text = textNodes.map((n) => n.textContent.trim()).join(" ").trim();
+            const rawText = textNodes.map((n) => n.textContent.trim()).join(" ").trim();
+            text = applyTextTransform(rawText, computed.textTransform || "none");
+          }
+        } else {
+          for (const child of Array.from(el.children)) {
+            if (child.tagName === "SPAN" && child.textContent?.trim()) {
+              const childRect = child.getBoundingClientRect();
+              if (childRect.width > 0 && childRect.height > 0) {
+                rect = childRect;
+                const childComputed = win.getComputedStyle(child);
+                text = getTransformedText(child, childComputed);
+                break;
+              }
+            }
           }
         }
       }
@@ -30268,7 +31027,7 @@ ${generateStylesCss(styleMap, themeFonts)}
       }
       const baseStyle = {
         fontSize: pxToPoints(computed.fontSize),
-        fontFace: computed.fontFamily.split(",")[0].replace(/['"]/g, "").trim(),
+        fontFace: extractFontFace(computed.fontFamily),
         color: rgbToHex(computed.color),
         align: textAlign,
         valign,
@@ -30396,23 +31155,44 @@ ${generateStylesCss(styleMap, themeFonts)}
       })
     };
   }
-  async function fetchImageAsDataUrl(url) {
-    try {
-      const response = await fetch(url, { mode: "cors" });
-      if (!response.ok) {
-        throw new Error(`Failed to fetch image: ${response.status}`);
-      }
-      const blob = await response.blob();
-      return new Promise((resolve, reject) => {
-        const reader = new FileReader();
-        reader.onloadend = () => resolve(reader.result);
-        reader.onerror = reject;
-        reader.readAsDataURL(blob);
-      });
-    } catch (error) {
-      const message = error instanceof Error ? error.message : String(error);
-      throw new Error(`Failed to fetch image ${url}: ${message}`);
+  function sleep(ms) {
+    return new Promise((resolve) => setTimeout(resolve, ms));
+  }
+  async function fetchImageAsDataUrl(url, maxRetries = 3, initialDelayMs = 500) {
+    let lastError = null;
+    for (let attempt = 0; attempt <= maxRetries; attempt++) {
+      try {
+        const response = await fetch(url, { mode: "cors" });
+        if (response.status === 429 || response.status >= 500 && response.status < 600) {
+          if (attempt < maxRetries) {
+            const delay = initialDelayMs * Math.pow(2, attempt);
+            console.warn(`Image fetch returned ${response.status}, retrying in ${delay}ms... (${url})`);
+            await sleep(delay);
+            continue;
+          }
+        }
+        if (!response.ok) {
+          throw new Error(`Failed to fetch image: ${response.status}`);
+        }
+        const blob = await response.blob();
+        return new Promise((resolve, reject) => {
+          const reader = new FileReader();
+          reader.onloadend = () => resolve(reader.result);
+          reader.onerror = reject;
+          reader.readAsDataURL(blob);
+        });
+      } catch (error) {
+        lastError = error instanceof Error ? error : new Error(String(error));
+        if (attempt < maxRetries) {
+          const delay = initialDelayMs * Math.pow(2, attempt);
+          console.warn(`Image fetch failed, retrying in ${delay}ms... (${url}): ${lastError.message}`);
+          await sleep(delay);
+          continue;
+        }
+      }
     }
+    const message = lastError?.message ?? "Unknown error";
+    throw new Error(`Failed to fetch image ${url}: ${message}`);
   }
   async function applyBackground(background, slide) {
     if (background.type === "image" && background.path) {
@@ -30556,7 +31336,11 @@ ${generateStylesCss(styleMap, themeFonts)}
         });
       } else if (el.type === "shape") {
         let shapeType = pres.ShapeType.rect;
-        if (el.shape.isEllipse) {
+        let customGeometryPoints;
+        if (el.shape.customGeometry && el.shape.customGeometry.length > 0) {
+          shapeType = pres.ShapeType.custGeom;
+          customGeometryPoints = el.shape.customGeometry;
+        } else if (el.shape.isEllipse) {
           shapeType = pres.ShapeType.ellipse;
         } else if (el.shape.rectRadius > 0) {
           shapeType = pres.ShapeType.roundRect;
@@ -30568,8 +31352,11 @@ ${generateStylesCss(styleMap, themeFonts)}
         const hasText = el.text || el.textRuns && el.textRuns.length > 0;
         let adjustedX = el.position.x;
         let adjustedW = el.position.w;
+        let adjustedH = el.position.h;
         if (isSingleLine && hasText) {
-          const widthIncrease = el.position.w * 0.02;
+          const fontSize = el.style?.fontSize ?? 12;
+          const bufferPercent = fontSize > 36 ? 0.05 : fontSize > 24 ? 0.04 : fontSize > 16 ? 0.03 : 0.02;
+          const widthIncrease = el.position.w * bufferPercent;
           const align = el.style?.align;
           if (align === "center") {
             adjustedX = el.position.x - widthIncrease / 2;
@@ -30580,16 +31367,25 @@ ${generateStylesCss(styleMap, themeFonts)}
           } else {
             adjustedW = el.position.w + widthIncrease;
           }
+        } else if (hasText && !isSingleLine) {
+          const hasInternalPadding = el.style?.margin && el.style.margin.some((m) => m > 3);
+          const heightBufferPercent = hasInternalPadding ? 0.03 : 0.1;
+          const heightIncrease = el.position.h * heightBufferPercent;
+          adjustedH = el.position.h + heightIncrease;
         }
         const shapeOptions = {
           x: adjustedX,
           y: el.position.y,
           w: adjustedW,
-          h: el.position.h,
+          h: adjustedH,
           shape: shapeType,
           // Disable text wrapping for single-line shapes to prevent unwanted line breaks
-          wrap: !isSingleLine
+          // Also respect explicit wrap: false from parse.ts (for small badges/labels)
+          wrap: el.style?.wrap === false ? false : !isSingleLine
         };
+        if (customGeometryPoints) {
+          shapeOptions.points = customGeometryPoints;
+        }
         let fillTransparency = el.shape.transparency;
         const elementOpacity = el.shape.opacity !== null && el.shape.opacity < 1 ? el.shape.opacity : 1;
         if (elementOpacity < 1) {
@@ -30620,6 +31416,8 @@ ${generateStylesCss(styleMap, themeFonts)}
           };
           if (el.shape.line.transparency != null)
             lineOpts.transparency = el.shape.line.transparency;
+          if (el.shape.line.dashType)
+            lineOpts.dashType = el.shape.line.dashType;
           shapeOptions.line = lineOpts;
         }
         if (el.shape.rectRadius > 0)
@@ -30643,6 +31441,7 @@ ${generateStylesCss(styleMap, themeFonts)}
             shapeOptions.valign = el.style.valign;
           if (el.style.fontFill)
             shapeOptions.fontFill = el.style.fontFill;
+          shapeOptions.inset = 0;
           if (el.style.margin)
             shapeOptions.margin = el.style.margin;
           if (el.style.inset !== void 0)
@@ -30666,11 +31465,13 @@ ${generateStylesCss(styleMap, themeFonts)}
           slide.addText(el.text || "", shapeOptions);
         }
       } else if (el.type === "list") {
+        const heightIncrease = el.position.h * 0.15;
+        const adjustedH = el.position.h + heightIncrease;
         const listOptions = {
           x: el.position.x,
           y: el.position.y,
           w: el.position.w,
-          h: el.position.h,
+          h: adjustedH,
           fontSize: el.style.fontSize,
           fontFace: el.style.fontFace,
           color: el.style.color ?? void 0,
@@ -30679,7 +31480,8 @@ ${generateStylesCss(styleMap, themeFonts)}
           lineSpacing: el.style.lineSpacing,
           paraSpaceBefore: el.style.paraSpaceBefore,
           paraSpaceAfter: el.style.paraSpaceAfter,
-          margin: el.style.margin
+          margin: el.style.margin,
+          inset: 0
         };
         if (el.style.margin)
           listOptions.margin = el.style.margin;
@@ -30690,7 +31492,22 @@ ${generateStylesCss(styleMap, themeFonts)}
         const isSingleLine = heightPt <= lineHeightPt * 1.5;
         let adjustedX = el.position.x;
         let adjustedW = el.position.w;
+        let adjustedH = el.position.h;
         if (isSingleLine) {
+          const fontSize = el.style.fontSize ?? 12;
+          const bufferPercent = fontSize > 36 ? 0.02 : fontSize > 24 ? 0.015 : 0.01;
+          const widthIncrease = el.position.w * bufferPercent;
+          const align = el.style.align;
+          if (align === "center") {
+            adjustedX = el.position.x - widthIncrease / 2;
+            adjustedW = el.position.w + widthIncrease;
+          } else if (align === "right") {
+            adjustedX = el.position.x - widthIncrease;
+            adjustedW = el.position.w + widthIncrease;
+          } else {
+            adjustedW = el.position.w + widthIncrease;
+          }
+        } else {
           const widthIncrease = el.position.w * 0.02;
           const align = el.style.align;
           if (align === "center") {
@@ -30702,12 +31519,14 @@ ${generateStylesCss(styleMap, themeFonts)}
           } else {
             adjustedW = el.position.w + widthIncrease;
           }
+          const heightIncrease = el.position.h * 0.05;
+          adjustedH = el.position.h + heightIncrease;
         }
         const textOptions = {
           x: adjustedX,
           y: el.position.y,
           w: adjustedW,
-          h: el.position.h,
+          h: adjustedH,
           fontSize: el.style.fontSize,
           fontFace: el.style.fontFace,
           color: el.style.color ?? void 0,
@@ -30850,9 +31669,17 @@ ${generateStylesCss(styleMap, themeFonts)}
         resolve();
       };
       iframe.onload = resolveOnce;
-      setTimeout(resolveOnce, 500);
+      setTimeout(resolveOnce, 2e3);
     });
     const doc = iframe.contentDocument || iframe.contentWindow.document;
+    const iframeWin = iframe.contentWindow;
+    if (iframeWin && iframeWin.document.fonts && iframeWin.document.fonts.ready) {
+      await Promise.race([
+        iframeWin.document.fonts.ready,
+        new Promise((r) => setTimeout(r, 3e3))
+        // 3s timeout for slow CDN
+      ]);
+    }
     return { iframe, doc };
   }
   async function addSlideFromHtml(source, pres, options = {}) {
@@ -30871,6 +31698,10 @@ ${generateStylesCss(styleMap, themeFonts)}
       } else {
         throw new Error("Source must be a Document, HTMLIFrameElement, or HTML string");
       }
+      const win = doc.defaultView;
+      if (win && win.document.fonts && win.document.fonts.ready) {
+        await win.document.fonts.ready;
+      }
       const validationErrors = [];
       const bodyDimensions = getBodyDimensions(doc);
       const slideData = parseSlideHtml(doc);
@@ -30928,7 +31759,7 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
   }
 
   // packages/slides/transform.js
-  var FONT_FAMILY_MAP = {
+  var FONT_FAMILY_MAP2 = {
     // Serif fonts → Georgia (closest web-safe serif)
     "Playfair Display": "Georgia, serif",
     "Merriweather": "Georgia, serif",
@@ -30937,7 +31768,8 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
     "Noto Serif": "Georgia, serif",
     "Lora": "Georgia, serif",
     // Sans-serif fonts → Calibri (modern sans-serif, widely available in PowerPoint)
-    "Inter": "Calibri, sans-serif",
+    // Note: fonts loaded via Google Fonts CDN are NOT mapped here, as they will
+    // be available at render time and should keep their original names in the PPTX.
     "Roboto": "Calibri, sans-serif",
     "Open Sans": "Calibri, sans-serif",
     "Lato": "Calibri, sans-serif",
@@ -30974,7 +31806,7 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
     const scaleFactor = targetWidth / sourceWidth;
     html = html.replace(/(body\s*\{[^}]*?)width:\s*\d+px/s, `$1width: ${targetWidth}pt`);
     html = html.replace(/(body\s*\{[^}]*?)height:\s*\d+px/s, `$1height: ${targetHeight}pt`);
-    for (const [font, replacement] of Object.entries(FONT_FAMILY_MAP)) {
+    for (const [font, replacement] of Object.entries(FONT_FAMILY_MAP2)) {
       const fontRegex = new RegExp(`font-family:\\s*["']?${font}["']?,?\\s*(sans-serif|serif|monospace)?`, "gi");
       html = html.replace(fontRegex, `font-family: ${replacement}`);
     }
@@ -31012,7 +31844,43 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
     });
     html = html.replace(/-webkit-backdrop-filter:\s*[^;]+;/g, "");
     html = html.replace(/backdrop-filter:\s*[^;]+;/g, "");
-    html = html.replace(/animation[\w-]*:\s*[^;]+;/g, "");
+    const keyframeFinalTransforms = {};
+    {
+      const kfPattern = /@keyframes\s+([\w-]+)\s*\{/g;
+      let kfScan;
+      while ((kfScan = kfPattern.exec(html)) !== null) {
+        const name = kfScan[1];
+        const bodyStart = kfScan.index + kfScan[0].length;
+        let depth = 1;
+        let idx = bodyStart;
+        while (idx < html.length && depth > 0) {
+          if (html[idx] === "{")
+            depth++;
+          else if (html[idx] === "}")
+            depth--;
+          idx++;
+        }
+        const kfBody = html.substring(bodyStart, idx - 1);
+        const finalBlock = kfBody.match(/(?:to|100%)\s*\{\s*([^}]*)\}/);
+        if (finalBlock) {
+          const transformInFinal = finalBlock[1].match(/transform:\s*([^;]+)/);
+          if (transformInFinal) {
+            keyframeFinalTransforms[name] = transformInFinal[1].trim();
+          }
+        }
+      }
+    }
+    html = html.replace(/(?<![a-zA-Z-])animation:\s*([^;]+);/g, (_match, value) => {
+      if (/forwards/.test(value)) {
+        for (const [name, finalTransform] of Object.entries(keyframeFinalTransforms)) {
+          if (value.includes(name)) {
+            return `transform: ${finalTransform} !important;`;
+          }
+        }
+      }
+      return "";
+    });
+    html = html.replace(/animation-[\w-]+:\s*[^;]+;/g, "");
     let keyframeMatch;
     while (keyframeMatch = html.match(/@keyframes\s+[\w-]+\s*\{/)) {
       const start = keyframeMatch.index;
@@ -31082,6 +31950,109 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
   var TARGET_WIDTH = 1280;
   var TARGET_HEIGHT = 720;
   var EMU_PER_PX2 = 914400 / 96;
+  var FONT_FALLBACK_MAP = {
+    // Microsoft Office fonts → metrically compatible open-source alternatives
+    "Calibri": "'Calibri','Carlito','Helvetica Neue',Helvetica,Arial,sans-serif",
+    "Calibri Light": "'Calibri Light','Carlito','Helvetica Neue Light','Helvetica Neue',Arial,sans-serif",
+    "Cambria": "'Cambria','Caladea','Times New Roman',Georgia,serif",
+    "Cambria Math": "'Cambria Math','Caladea','Times New Roman',serif",
+    "Consolas": "'Consolas','Courier New',monospace",
+    "Aptos": "'Aptos','Carlito','Helvetica Neue',Arial,sans-serif",
+    "Times New Roman": "'Times New Roman','Liberation Serif',Georgia,serif",
+    // Handwriting / decorative fonts
+    "MV Boli": "'MV Boli','Comic Sans MS','Marker Felt',cursive",
+    "Kristen ITC": "'Kristen ITC','Comic Sans MS','Marker Felt',cursive",
+    "Stylus BT": "'Stylus BT','Brush Script MT','Snell Roundhand',cursive",
+    // Japanese sans-serif fonts → Noto Sans CJK JP (commonly installed)
+    "MS Gothic": "'MS Gothic','Noto Sans CJK JP','Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif",
+    "MS PGothic": "'MS PGothic','Noto Sans CJK JP','Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif",
+    "\uFF2D\uFF33 \uFF30\u30B4\u30B7\u30C3\u30AF": "'\uFF2D\uFF33 \uFF30\u30B4\u30B7\u30C3\u30AF','Noto Sans CJK JP','Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif",
+    "\uFF2D\uFF33 \u30B4\u30B7\u30C3\u30AF": "'\uFF2D\uFF33 \u30B4\u30B7\u30C3\u30AF','Noto Sans CJK JP','Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif",
+    "Kozuka Gothic Pro R": "'Kozuka Gothic Pro R','Noto Sans CJK JP','Hiragino Kaku Gothic ProN',sans-serif",
+    "Kozuka Gothic Pro B": "'Kozuka Gothic Pro B','Noto Sans CJK JP Bold','Hiragino Kaku Gothic ProN',sans-serif",
+    "Kozuka Gothic Pro M": "'Kozuka Gothic Pro M','Noto Sans CJK JP Medium','Hiragino Kaku Gothic ProN',sans-serif",
+    "Kozuka Gothic Pro EL": "'Kozuka Gothic Pro EL','Noto Sans CJK JP Light','Hiragino Kaku Gothic ProN',sans-serif",
+    "HGSKyokashotai": "'HGSKyokashotai','Noto Sans CJK JP','Hiragino Kaku Gothic ProN',sans-serif",
+    // Japanese serif fonts → Noto Serif CJK JP
+    "MS Mincho": "'MS Mincho','Noto Serif CJK JP','Hiragino Mincho ProN','Yu Mincho',serif",
+    "MS PMincho": "'MS PMincho','Noto Serif CJK JP','Hiragino Mincho ProN','Yu Mincho',serif",
+    // CJK fonts
+    "\u5B8B\u4F53": "'\u5B8B\u4F53','Noto Serif CJK SC','Songti SC','STSong',serif",
+    "\u65B0\u7D30\u660E\u9AD4": "'\u65B0\u7D30\u660E\u9AD4','Noto Serif CJK TC','Songti TC',serif",
+    "\u9ED1\u4F53": "'\u9ED1\u4F53','Noto Sans CJK SC','Heiti SC','STHeiti',sans-serif",
+    "\u5FAE\u8EDF\u6B63\u9ED1\u9AD4": "'\u5FAE\u8EDF\u6B63\u9ED1\u9AD4','Noto Sans CJK TC','Heiti TC',sans-serif",
+    "\uB9D1\uC740 \uACE0\uB515": "'\uB9D1\uC740 \uACE0\uB515','Apple SD Gothic Neo',sans-serif",
+    // UI / system fonts
+    "Lucida Sans Unicode": "'Lucida Sans Unicode','Lucida Grande','Lucida Sans',sans-serif",
+    "Segoe UI": "'Segoe UI','-apple-system','Helvetica Neue',sans-serif",
+    "Segoe Sans Display": "'Segoe Sans Display','-apple-system','Helvetica Neue',Arial,sans-serif",
+    "Segoe Sans Display Semibold": "'Segoe Sans Display Semibold','-apple-system','Helvetica Neue',Arial,sans-serif",
+    // Google Fonts / web fonts commonly used in presentations
+    "Inter": "'Inter','Helvetica Neue',Helvetica,Arial,sans-serif",
+    "Inter Light": "'Inter Light','Inter','Helvetica Neue',Arial,sans-serif",
+    "Inter ExtraBold": "'Inter ExtraBold','Inter','Helvetica Neue',Arial,sans-serif",
+    "Space Grotesk": "'Space Grotesk','Helvetica Neue',Helvetica,Arial,sans-serif",
+    "Montserrat": "'Montserrat','Helvetica Neue',Helvetica,Arial,sans-serif",
+    "Open Sans": "'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif",
+    "Lato": "'Lato','Helvetica Neue',Helvetica,Arial,sans-serif",
+    "Oswald": "'Oswald','Helvetica Neue',Helvetica,Arial,sans-serif",
+    "Archivo": "'Archivo','Helvetica Neue',Helvetica,Arial,sans-serif",
+    "Economica": "'Economica','Helvetica Neue',Arial,sans-serif",
+    "Libre Baskerville": "'Libre Baskerville','Georgia','Times New Roman',serif",
+    // GitHub Copilot fonts
+    "Ginto Copilot": "'Ginto Copilot','Helvetica Neue',Helvetica,Arial,sans-serif",
+    "Ginto Copilot Light": "'Ginto Copilot Light','Helvetica Neue Light','Helvetica Neue',Arial,sans-serif",
+    "Ginto Copilot 400": "'Ginto Copilot 400','Helvetica Neue',Helvetica,Arial,sans-serif",
+    // Google Fonts / decorative (serif & display)
+    "Playfair Display": "'Playfair Display','Georgia','Times New Roman',serif",
+    "Playfair Display SemiBold": "'Playfair Display SemiBold','Playfair Display','Georgia',serif",
+    "Caveat": "'Caveat','Comic Sans MS','Marker Felt',cursive",
+    "Syncopate": "'Syncopate','Helvetica Neue',Helvetica,Arial,sans-serif",
+    // Montserrat weight variants
+    "Montserrat SemiBold": "'Montserrat SemiBold','Montserrat','Helvetica Neue',Arial,sans-serif",
+    "Montserrat ExtraBold": "'Montserrat ExtraBold','Montserrat','Helvetica Neue',Arial,sans-serif",
+    // GitHub Copilot font variants
+    "Ginto Copilot Medium": "'Ginto Copilot Medium','Ginto Copilot','Helvetica Neue',Arial,sans-serif",
+    "Ginto Copilot Black": "'Ginto Copilot Black','Ginto Copilot','Helvetica Neue',Arial,sans-serif",
+    "Ginto Copilot Thin": "'Ginto Copilot Thin','Ginto Copilot Light','Helvetica Neue',Arial,sans-serif",
+    // Microsoft UI fonts
+    "Segoe Sans Small Regular": "'Segoe Sans Small Regular','Segoe UI','-apple-system','Helvetica Neue',sans-serif",
+    "Segoe Sans Text Regular": "'Segoe Sans Text Regular','Segoe UI','-apple-system','Helvetica Neue',sans-serif",
+    "Grandview": "'Grandview','Helvetica Neue',Arial,sans-serif",
+    "Nirmala UI": "'Nirmala UI','Helvetica Neue',Arial,sans-serif",
+    "Ebrima": "'Ebrima','Helvetica Neue',Arial,sans-serif",
+    // Common system fonts with fallbacks
+    "Arial": "Arial,'Helvetica Neue',Helvetica,sans-serif",
+    "Arial Black": "'Arial Black','Helvetica Neue',Helvetica,Arial,sans-serif",
+    "Georgia": "Georgia,'Times New Roman',serif",
+    "Georgia Regular": "'Georgia Regular',Georgia,'Times New Roman',serif",
+    "Courier New": "'Courier New',Courier,monospace",
+    "Times": "Times,'Times New Roman',serif",
+    // Symbol fonts (preserved as-is with system fallback)
+    "Wingdings": "'Wingdings','Zapf Dingbats',sans-serif",
+    "Wingdings 2": "'Wingdings 2','Zapf Dingbats',sans-serif",
+    "Wingdings 3": "'Wingdings 3','Zapf Dingbats',sans-serif",
+    // Common fallbacks
+    "Tahoma": "'Tahoma','Verdana','Geneva',sans-serif",
+    "Verdana": "'Verdana','Geneva',sans-serif",
+    "Helvetica Neue Light": "'Helvetica Neue Light','Helvetica Neue',Helvetica,Arial,sans-serif"
+  };
+  function cssFontFamily(fontName) {
+    const mapped = FONT_FALLBACK_MAP[fontName];
+    if (mapped)
+      return mapped;
+    if (fontName.includes(",")) {
+      return fontName.split(",").map((f) => {
+        const trimmed = f.trim();
+        const lower = trimmed.toLowerCase();
+        if (lower === "sans-serif" || lower === "serif" || lower === "monospace" || lower === "cursive" || lower === "fantasy") {
+          return lower;
+        }
+        return `'${trimmed}'`;
+      }).join(",");
+    }
+    return `'${fontName}',sans-serif`;
+  }
   function emuToPx2(emu) {
     return emu / EMU_PER_PX2;
   }
@@ -31160,6 +32131,20 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
     }
     if (stops.length === 0)
       return void 0;
+    const pathEl = findChild2(gradFill, "path");
+    if (pathEl && pathEl.getAttribute("path") === "circle") {
+      const fillToRect = findChild2(pathEl, "fillToRect");
+      let centerX = 50;
+      let centerY = 50;
+      if (fillToRect) {
+        const l = parseInt(fillToRect.getAttribute("l") ?? "50000", 10) / 1e3;
+        const t = parseInt(fillToRect.getAttribute("t") ?? "50000", 10) / 1e3;
+        centerX = l;
+        centerY = t;
+      }
+      const stopStr2 = stops.map((s) => `${s.color} ${s.pos}%`).join(",");
+      return `radial-gradient(ellipse at ${centerX}% ${centerY}%,${stopStr2})`;
+    }
     const lin = findChild2(gradFill, "lin");
     const angAttr = lin?.getAttribute("ang");
     const cssDeg = angAttr ? ooxmlAngleToCss(parseInt(angAttr, 10)) : 180;
@@ -31191,12 +32176,71 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
       if (color)
         result.color = color;
     }
+    if (!result.color) {
+      const gradFill = findChild2(rPr, "gradFill");
+      if (gradFill) {
+        const gsLst = findChild2(gradFill, "gsLst");
+        if (gsLst) {
+          const gsEls = findChildren2(gsLst, "gs");
+          if (gsEls.length > 0) {
+            const stops = [];
+            for (const gs of gsEls) {
+              const pos = parseInt(gs.getAttribute("pos") ?? "0", 10) / 1e3;
+              const color = resolveColor2(gs, themeColors);
+              if (color)
+                stops.push({ pos, color });
+            }
+            if (stops.length >= 2) {
+              const lin = findChild2(gradFill, "lin");
+              const angAttr = lin?.getAttribute("ang");
+              const cssDeg = angAttr ? ooxmlAngleToCss(parseInt(angAttr, 10)) : 135;
+              const stopStr = stops.map((s) => `${s.color} ${s.pos}%`).join(",");
+              result.gradientFill = `linear-gradient(${cssDeg}deg,${stopStr})`;
+            }
+            const firstColor = resolveColor2(gsEls[0], themeColors);
+            if (firstColor)
+              result.color = firstColor;
+          }
+        }
+      }
+    }
     const latin = findChild2(rPr, "latin");
     if (latin) {
       const typeface = latin.getAttribute("typeface");
       if (typeface)
         result.fontFamily = typeface;
     }
+    const effectLst = findChild2(rPr, "effectLst");
+    if (effectLst) {
+      const glow = findChild2(effectLst, "glow");
+      if (glow) {
+        const radAttr = glow.getAttribute("rad");
+        const radiusEmu = radAttr ? parseInt(radAttr, 10) : 0;
+        const radiusPx = Math.round(emuToPx2(radiusEmu) * scale);
+        const glowColor = resolveColor2(glow, themeColors);
+        if (glowColor && radiusPx > 0) {
+          const INVERSE_GLOW_SIZE_SCALE = 0.4;
+          const INVERSE_GLOW_OPACITY_SCALE = 3.33;
+          const cssRadius = Math.round(radiusPx * INVERSE_GLOW_SIZE_SCALE);
+          const rgbaMatch = glowColor.match(/rgba?\((\d+),(\d+),(\d+)(?:,([0-9.]+))?\)/);
+          if (rgbaMatch) {
+            const r = rgbaMatch[1];
+            const g = rgbaMatch[2];
+            const b2 = rgbaMatch[3];
+            const originalAlpha = rgbaMatch[4] ? parseFloat(rgbaMatch[4]) : 1;
+            const scaledAlpha = Math.min(originalAlpha * INVERSE_GLOW_OPACITY_SCALE, 1);
+            result.textShadow = `0 0 ${cssRadius}px rgba(${r},${g},${b2},${scaledAlpha.toFixed(2)})`;
+          } else if (glowColor.startsWith("#")) {
+            const r = parseInt(glowColor.slice(1, 3), 16);
+            const g = parseInt(glowColor.slice(3, 5), 16);
+            const b2 = parseInt(glowColor.slice(5, 7), 16);
+            result.textShadow = `0 0 ${cssRadius}px rgba(${r},${g},${b2},1)`;
+          } else {
+            result.textShadow = `0 0 ${cssRadius}px ${glowColor}`;
+          }
+        }
+      }
+    }
     return result;
   }
   function parseShape(sp, scale, themeColors) {
@@ -31221,13 +32265,16 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
       paragraphs: []
     };
     const prstGeom = findChild2(spPr, "prstGeom");
-    if (prstGeom?.getAttribute("prst") === "roundRect") {
+    const prstType = prstGeom?.getAttribute("prst");
+    if (prstType === "roundRect" && prstGeom) {
       const avLst = findChild2(prstGeom, "avLst");
       const gd = avLst ? findChild2(avLst, "gd") : null;
       const adjVal = gd ? parseInt(gd.getAttribute("fmla")?.replace("val ", "") ?? "16667", 10) : 16667;
       const minDim = Math.min(wEmu, hEmu);
       const radiusEmu = minDim * Math.min(adjVal, 5e4) / 1e5;
       shape.borderRadius = Math.round(emuToPx2(radiusEmu) * scale);
+    } else if (prstType === "ellipse") {
+      shape.isEllipse = true;
     }
     const ln = findChild2(spPr, "ln");
     if (ln) {
@@ -31238,6 +32285,13 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
         if (lnFill) {
           shape.borderColor = resolveColor2(lnFill, themeColors);
         }
+        const prstDash = findChild2(ln, "prstDash");
+        if (prstDash) {
+          const dashVal = prstDash.getAttribute("val");
+          if (dashVal && dashVal !== "solid") {
+            shape.borderDashType = dashVal;
+          }
+        }
       }
     }
     const txBody = findChild2(sp, "txBody");
@@ -31308,21 +32362,34 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
             para.bulletChar = buChar.getAttribute("char") ?? void 0;
           }
         }
-        const runs = findChildren2(p, "r");
-        for (const r of runs) {
-          const rPr = findChild2(r, "rPr");
-          const props = extractRunProps(rPr, scale, themeColors);
-          const tEls = findChildren2(r, "t");
-          const text = tEls.map((t) => t.textContent ?? "").join("");
-          if (text) {
-            para.runs.push({
-              text,
-              bold: props.bold ?? defaults?.bold,
-              italic: props.italic ?? defaults?.italic,
-              fontSize: props.fontSize ?? defaults?.fontSize,
-              color: props.color ?? defaults?.color,
-              fontFamily: props.fontFamily ?? defaults?.fontFamily
-            });
+        for (const child of Array.from(p.childNodes)) {
+          if (child.nodeType !== 1)
+            continue;
+          const el = child;
+          const localName = el.localName || el.nodeName.split(":").pop();
+          if (localName === "r") {
+            const rPr = findChild2(el, "rPr");
+            const props = extractRunProps(rPr, scale, themeColors);
+            const tEls = findChildren2(el, "t");
+            const text = tEls.map((t) => t.textContent ?? "").join("");
+            if (text) {
+              para.runs.push({
+                text,
+                bold: props.bold ?? defaults?.bold,
+                italic: props.italic ?? defaults?.italic,
+                fontSize: props.fontSize ?? defaults?.fontSize,
+                color: props.color ?? defaults?.color,
+                fontFamily: props.fontFamily ?? defaults?.fontFamily,
+                textShadow: props.textShadow ?? defaults?.textShadow,
+                gradientFill: props.gradientFill ?? defaults?.gradientFill
+              });
+            }
+          } else if (localName === "br") {
+            if (para.runs.length > 0) {
+              para.runs[para.runs.length - 1].text += "\n";
+            } else {
+              para.runs.push({ text: "\n" });
+            }
           }
         }
         if (para.runs.length > 0) {
@@ -31349,7 +32416,27 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
     const blip = findChild2(blipFill, "blip");
     if (!blip)
       return null;
-    const rEmbed = blip.getAttribute("r:embed") ?? blip.getAttributeNS("http://schemas.openxmlformats.org/officeDocument/2006/relationships", "embed");
+    let rEmbed = null;
+    const extLst = findChild2(blip, "extLst");
+    if (extLst) {
+      for (let i = 0; i < extLst.children.length; i++) {
+        const ext2 = extLst.children[i];
+        if (ext2.localName === "ext") {
+          for (let j = 0; j < ext2.children.length; j++) {
+            const child = ext2.children[j];
+            if (child.localName === "svgBlip") {
+              rEmbed = child.getAttribute("r:embed") ?? child.getAttributeNS("http://schemas.openxmlformats.org/officeDocument/2006/relationships", "embed");
+              break;
+            }
+          }
+          if (rEmbed)
+            break;
+        }
+      }
+    }
+    if (!rEmbed) {
+      rEmbed = blip.getAttribute("r:embed") ?? blip.getAttributeNS("http://schemas.openxmlformats.org/officeDocument/2006/relationships", "embed");
+    }
     if (!rEmbed)
       return null;
     const dataUri = imageMap.get(rEmbed);
@@ -31358,13 +32445,36 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
     const nvPicPr = findChild2(pic, "nvPicPr");
     const cNvPr = nvPicPr ? findChild2(nvPicPr, "cNvPr") : null;
     const alt = cNvPr?.getAttribute("descr") ?? void 0;
+    const srcRect = findChild2(blipFill, "srcRect");
+    let hasCrop = false;
+    if (srcRect) {
+      const l = parseInt(srcRect.getAttribute("l") ?? "0", 10);
+      const r = parseInt(srcRect.getAttribute("r") ?? "0", 10);
+      const t = parseInt(srcRect.getAttribute("t") ?? "0", 10);
+      const b = parseInt(srcRect.getAttribute("b") ?? "0", 10);
+      hasCrop = l > 0 || r > 0 || t > 0 || b > 0;
+    }
+    let borderRadius;
+    const prstGeom = findChild2(spPr, "prstGeom");
+    if (prstGeom?.getAttribute("prst") === "roundRect") {
+      const avLst = findChild2(prstGeom, "avLst");
+      const gd = avLst ? findChild2(avLst, "gd") : null;
+      const adjVal = gd ? parseInt(gd.getAttribute("fmla")?.replace("val ", "") ?? "16667", 10) : 16667;
+      const wEmu = parseInt(ext.getAttribute("cx") ?? "0", 10);
+      const hEmu = parseInt(ext.getAttribute("cy") ?? "0", 10);
+      const minDim = Math.min(wEmu, hEmu);
+      const radiusEmu = minDim * Math.min(adjVal, 5e4) / 1e5;
+      borderRadius = Math.round(emuToPx2(radiusEmu) * scale);
+    }
     return {
       x: Math.round(emuToPx2(parseInt(off.getAttribute("x") ?? "0", 10)) * scale),
       y: Math.round(emuToPx2(parseInt(off.getAttribute("y") ?? "0", 10)) * scale),
       w: Math.round(emuToPx2(parseInt(ext.getAttribute("cx") ?? "0", 10)) * scale),
       h: Math.round(emuToPx2(parseInt(ext.getAttribute("cy") ?? "0", 10)) * scale),
       dataUri,
-      alt
+      alt,
+      borderRadius,
+      hasCrop
     };
   }
   function renderSlideHtml(elements, bgColor) {
@@ -31374,14 +32484,20 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
       const elId = `el-${elementIndex++}`;
       if (el.kind === "image") {
         const img = el.data;
-        const styles2 = [
+        const isFullbleed = img.x <= 10 && img.y <= 10 && img.w >= TARGET_WIDTH - 20 && img.h >= TARGET_HEIGHT - 20;
+        const objectFit = isFullbleed || img.hasCrop ? "cover" : "contain";
+        const stylesList = [
           "position:absolute",
           `left:${img.x}px`,
           `top:${img.y}px`,
           `width:${img.w}px`,
           `height:${img.h}px`,
-          "object-fit:contain"
-        ].join(";");
+          `object-fit:${objectFit}`
+        ];
+        if (img.borderRadius && img.borderRadius > 0) {
+          stylesList.push(`border-radius:${img.borderRadius}px`);
+        }
+        const styles2 = stylesList.join(";");
         const altAttr = img.alt ? ` alt="${img.alt.replace(/"/g, "&quot;")}"` : "";
         inner += `<img id="${elId}" data-elementType="image" src="${img.dataUri}"${altAttr} style="${styles2}" />
 `;
@@ -31401,9 +32517,25 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
       }
       if (shape.borderRadius) {
         styles.push(`border-radius:${shape.borderRadius}px`);
+      } else if (shape.isEllipse) {
+        styles.push(`border-radius:50%`);
       }
       if (shape.borderWidth && shape.borderColor) {
-        styles.push(`border:${shape.borderWidth}px solid ${shape.borderColor}`);
+        let borderStyle = "solid";
+        if (shape.borderDashType) {
+          switch (shape.borderDashType) {
+            case "dash":
+            case "lgDash":
+            case "sysDash":
+              borderStyle = "dashed";
+              break;
+            case "sysDot":
+            case "dot":
+              borderStyle = "dotted";
+              break;
+          }
+        }
+        styles.push(`border:${shape.borderWidth}px ${borderStyle} ${shape.borderColor}`);
         styles.push("box-sizing:border-box");
       }
       if (shape.padding) {
@@ -31444,14 +32576,22 @@ ${validationErrors.map((e, i) => `  ${i + 1}. ${e}`).join("\n")}`;
           const rStyles = [];
           if (run.fontSize)
             rStyles.push(`font-size:${run.fontSize}px`);
-          if (run.color)
+          if (run.gradientFill) {
+            rStyles.push(`background:${run.gradientFill}`);
+            rStyles.push("-webkit-background-clip:text");
+            rStyles.push("-webkit-text-fill-color:transparent");
+            rStyles.push("background-clip:text");
+          } else if (run.color) {
             rStyles.push(`color:${run.color}`);
+          }
           if (run.bold)
             rStyles.push("font-weight:bold");
           if (run.italic)
             rStyles.push("font-style:italic");
           if (run.fontFamily)
-            rStyles.push(`font-family:'${run.fontFamily}',sans-serif`);
+            rStyles.push(`font-family:${cssFontFamily(run.fontFamily)}`);
+          if (run.textShadow)
+            rStyles.push(`text-shadow:${run.textShadow}`);
           const escapedText = run.text.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
           if (rStyles.length > 0) {
             runHtml += `<span style="${rStyles.join(";")}">${escapedText}</span>`;
@@ -31563,6 +32703,21 @@ ${inner}</div>`;
         }
       }
     }
+    const embeddedFontNames = /* @__PURE__ */ new Set();
+    const embeddedFontEls = presDoc.getElementsByTagName("p:embeddedFont");
+    for (let i = 0; i < embeddedFontEls.length; i++) {
+      const fontEl = embeddedFontEls[i].getElementsByTagName("p:font")[0];
+      if (fontEl) {
+        const typeface = fontEl.getAttribute("typeface");
+        if (typeface)
+          embeddedFontNames.add(typeface);
+      }
+    }
+    let fontStyleBlock = "";
+    if (embeddedFontNames.size > 0) {
+      const fontFamilies = Array.from(embeddedFontNames).map((name) => name.replace(/ /g, "+") + ":ital,wght@0,400;0,700;1,400;1,700").join("&family=");
+      fontStyleBlock = `<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=${fontFamilies}&display=swap">`;
+    }
     const slides = [];
     for (const slideFile of slideFiles) {
       const slideXml = await zip.file(slideFile)?.async("text");
@@ -31623,6 +32778,9 @@ ${inner}</div>`;
       }
       slides.push(renderSlideHtml(elements, slideBg));
     }
+    if (fontStyleBlock && slides.length > 0) {
+      slides[0] = fontStyleBlock + slides[0];
+    }
     return slides;
   }