@zumer/snapdom 2.0.0-dev.2 → 2.0.0-dev.4

package/dist/snapdom.mjs

@@ -1,27 +1,20 @@
-
 /*
-* snapdom
-* v.2.0.0-dev.2
-* Author Juan Martin Muda
-* License MIT
-**/
-
+* SnapDOM
+* v2.0.0-dev.4
+* Author: Juan Martin Muda
+* License: MIT
+*/
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __esm = (fn, res) => function __init() {
+  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
 
 // src/core/cache.js
-var cache = {
-  image: /* @__PURE__ */ new Map(),
-  background: /* @__PURE__ */ new Map(),
-  resource: /* @__PURE__ */ new Map(),
-  defaultStyle: /* @__PURE__ */ new Map(),
-  baseStyle: /* @__PURE__ */ new Map(),
-  computedStyle: /* @__PURE__ */ new WeakMap(),
-  font: /* @__PURE__ */ new Set(),
-  session: {
-    styleMap: /* @__PURE__ */ new Map(),
-    styleCache: /* @__PURE__ */ new WeakMap(),
-    nodeMap: /* @__PURE__ */ new Map()
-  }
-};
 function applyCachePolicy(policy = "soft") {
   cache.session.__counterEpoch = (cache.session.__counterEpoch || 0) + 1;
   switch (policy) {
@@ -60,6 +53,25 @@ function applyCachePolicy(policy = "soft") {
     }
   }
 }
+var cache;
+var init_cache = __esm({
+  "src/core/cache.js"() {
+    cache = {
+      image: /* @__PURE__ */ new Map(),
+      background: /* @__PURE__ */ new Map(),
+      resource: /* @__PURE__ */ new Map(),
+      defaultStyle: /* @__PURE__ */ new Map(),
+      baseStyle: /* @__PURE__ */ new Map(),
+      computedStyle: /* @__PURE__ */ new WeakMap(),
+      font: /* @__PURE__ */ new Set(),
+      session: {
+        styleMap: /* @__PURE__ */ new Map(),
+        styleCache: /* @__PURE__ */ new WeakMap(),
+        nodeMap: /* @__PURE__ */ new Map()
+      }
+    };
+  }
+});
 
 // src/utils/helpers.js
 function extractURL(value) {
@@ -96,6 +108,10 @@ function safeEncodeURI(uri) {
     return uri;
   }
 }
+var init_helpers = __esm({
+  "src/utils/helpers.js"() {
+  }
+});
 
 // src/modules/snapFetch.js
 function createSnapLogger(prefix = "[snapDOM]", { ttlMs = 5 * 6e4, maxEntries = 12 } = {}) {
@@ -124,9 +140,6 @@ function createSnapLogger(prefix = "[snapDOM]", { ttlMs = 5 * 6e4, maxEntries =
     }
   };
 }
-var snapLogger = createSnapLogger("[snapDOM]", { ttlMs: 3 * 6e4, maxEntries: 10 });
-var _inflight = /* @__PURE__ */ new Map();
-var _errorCache = /* @__PURE__ */ new Map();
 function isSpecialURL(url) {
   return /^data:|^blob:|^about:blank$/i.test(url);
 }
@@ -326,6 +339,15 @@ async function snapFetch(url, options = {}) {
   _inflight.set(key, p);
   return p;
 }
+var snapLogger, _inflight, _errorCache;
+var init_snapFetch = __esm({
+  "src/modules/snapFetch.js"() {
+    init_helpers();
+    snapLogger = createSnapLogger("[snapDOM]", { ttlMs: 3 * 6e4, maxEntries: 10 });
+    _inflight = /* @__PURE__ */ new Map();
+    _errorCache = /* @__PURE__ */ new Map();
+  }
+});
 
 // src/utils/image.js
 async function inlineSingleBackgroundEntry(entry, options = {}) {
@@ -355,78 +377,15 @@ async function inlineSingleBackgroundEntry(entry, options = {}) {
     return "none";
   }
 }
+var init_image = __esm({
+  "src/utils/image.js"() {
+    init_cache();
+    init_helpers();
+    init_snapFetch();
+  }
+});
 
 // src/utils/css.js
-var NO_CAPTURE_TAGS = /* @__PURE__ */ new Set([
-  "meta",
-  "script",
-  "noscript",
-  "title",
-  "link",
-  "template"
-]);
-var NO_DEFAULTS_TAGS = /* @__PURE__ */ new Set([
-  // non-painting / head stuff
-  "meta",
-  "link",
-  "style",
-  "title",
-  "noscript",
-  "script",
-  "template",
-  // SVG whole namespace (safe for LeaderLine/presentation attrs)
-  "g",
-  "defs",
-  "use",
-  "marker",
-  "mask",
-  "clipPath",
-  "pattern",
-  "path",
-  "polygon",
-  "polyline",
-  "line",
-  "circle",
-  "ellipse",
-  "rect",
-  "filter",
-  "lineargradient",
-  "radialgradient",
-  "stop"
-]);
-var commonTags = [
-  "div",
-  "span",
-  "p",
-  "a",
-  "img",
-  "ul",
-  "li",
-  "button",
-  "input",
-  "select",
-  "textarea",
-  "label",
-  "section",
-  "article",
-  "header",
-  "footer",
-  "nav",
-  "main",
-  "aside",
-  "h1",
-  "h2",
-  "h3",
-  "h4",
-  "h5",
-  "h6",
-  "table",
-  "thead",
-  "tbody",
-  "tr",
-  "td",
-  "th"
-];
 function precacheCommonTags() {
   for (let tag of commonTags) {
     const t = String(tag).toLowerCase();
@@ -473,26 +432,6 @@ function getDefaultStyleForTag(tagName) {
   cache.defaultStyle.set(tagName, defaults);
   return defaults;
 }
-var NO_PAINT_TOKEN = /(?:^|-)(animation|transition)(?:-|$)/i;
-var NO_PAINT_PREFIX = /^(--|view-timeline|scroll-timeline|animation-trigger|offset-|position-try|app-region|interactivity|overlay|view-transition|-webkit-locale|-webkit-user-(?:drag|modify)|-webkit-tap-highlight-color|-webkit-text-security)$/i;
-var NO_PAINT_EXACT = /* @__PURE__ */ new Set([
-  // Interaction hints
-  "cursor",
-  "pointer-events",
-  "touch-action",
-  "user-select",
-  // Printing/speech/reading-mode hints
-  "print-color-adjust",
-  "speak",
-  "reading-flow",
-  "reading-order",
-  // Anchoring/container/timeline scopes (metadata for layout queries)
-  "anchor-name",
-  "anchor-scope",
-  "container-name",
-  "container-type",
-  "timeline-scope"
-]);
 function shouldIgnoreProp(prop) {
   const p = String(prop).toLowerCase();
   if (NO_PAINT_EXACT.has(p)) return true;
@@ -592,6 +531,102 @@ function splitBackgroundImage(bg) {
   parts.push(bg.slice(lastIndex).trim());
   return parts;
 }
+var NO_CAPTURE_TAGS, NO_DEFAULTS_TAGS, commonTags, NO_PAINT_TOKEN, NO_PAINT_PREFIX, NO_PAINT_EXACT;
+var init_css = __esm({
+  "src/utils/css.js"() {
+    init_cache();
+    NO_CAPTURE_TAGS = /* @__PURE__ */ new Set([
+      "meta",
+      "script",
+      "noscript",
+      "title",
+      "link",
+      "template"
+    ]);
+    NO_DEFAULTS_TAGS = /* @__PURE__ */ new Set([
+      // non-painting / head stuff
+      "meta",
+      "link",
+      "style",
+      "title",
+      "noscript",
+      "script",
+      "template",
+      // SVG whole namespace (safe for LeaderLine/presentation attrs)
+      "g",
+      "defs",
+      "use",
+      "marker",
+      "mask",
+      "clipPath",
+      "pattern",
+      "path",
+      "polygon",
+      "polyline",
+      "line",
+      "circle",
+      "ellipse",
+      "rect",
+      "filter",
+      "lineargradient",
+      "radialgradient",
+      "stop"
+    ]);
+    commonTags = [
+      "div",
+      "span",
+      "p",
+      "a",
+      "img",
+      "ul",
+      "li",
+      "button",
+      "input",
+      "select",
+      "textarea",
+      "label",
+      "section",
+      "article",
+      "header",
+      "footer",
+      "nav",
+      "main",
+      "aside",
+      "h1",
+      "h2",
+      "h3",
+      "h4",
+      "h5",
+      "h6",
+      "table",
+      "thead",
+      "tbody",
+      "tr",
+      "td",
+      "th"
+    ];
+    NO_PAINT_TOKEN = /(?:^|-)(animation|transition)(?:-|$)/i;
+    NO_PAINT_PREFIX = /^(--|view-timeline|scroll-timeline|animation-trigger|offset-|position-try|app-region|interactivity|overlay|view-transition|-webkit-locale|-webkit-user-(?:drag|modify)|-webkit-tap-highlight-color|-webkit-text-security)$/i;
+    NO_PAINT_EXACT = /* @__PURE__ */ new Set([
+      // Interaction hints
+      "cursor",
+      "pointer-events",
+      "touch-action",
+      "user-select",
+      // Printing/speech/reading-mode hints
+      "print-color-adjust",
+      "speak",
+      "reading-flow",
+      "reading-order",
+      // Anchoring/container/timeline scopes (metadata for layout queries)
+      "anchor-name",
+      "anchor-scope",
+      "container-name",
+      "container-type",
+      "timeline-scope"
+    ]);
+  }
+});
 
 // src/utils/browser.js
 function idle(fn, { fast = false } = {}) {
@@ -618,915 +653,1392 @@ function isSafari() {
   const isIOSWebKit = /ipad|iphone|ipod/.test(uaLower) && isWebKit;
   return isSafariUA || isUIWebView || isWeChatUA || isBaiduUA || isIOSWebKit;
 }
+var init_browser = __esm({
+  "src/utils/browser.js"() {
+  }
+});
 
-// src/modules/styles.js
-var snapshotCache = /* @__PURE__ */ new WeakMap();
-var snapshotKeyCache = /* @__PURE__ */ new Map();
-var __epoch = 0;
-function bumpEpoch() {
-  __epoch++;
+// src/utils/index.js
+var init_utils = __esm({
+  "src/utils/index.js"() {
+    init_image();
+    init_css();
+    init_browser();
+    init_helpers();
+  }
+});
+
+// src/exporters/toCanvas.js
+var toCanvas_exports = {};
+__export(toCanvas_exports, {
+  toCanvas: () => toCanvas
+});
+function isSvgDataURL(u) {
+  return typeof u === "string" && /^data:image\/svg\+xml/i.test(u);
 }
-var __wired = false;
-function setupInvalidationOnce(root = document.documentElement) {
-  if (__wired) return;
-  __wired = true;
-  try {
-    const domObs = new MutationObserver(() => bumpEpoch());
-    domObs.observe(root, { subtree: true, childList: true, characterData: true, attributes: true });
-  } catch {
+function decodeSvgFromDataURL(u) {
+  const i = u.indexOf(",");
+  return i >= 0 ? decodeURIComponent(u.slice(i + 1)) : "";
+}
+function encodeSvgToDataURL(svgText) {
+  return `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svgText)}`;
+}
+function splitDecls(s) {
+  let parts = [], buf = "", depth = 0;
+  for (let i = 0; i < s.length; i++) {
+    const ch = s[i];
+    if (ch === "(") depth++;
+    if (ch === ")") depth = Math.max(0, depth - 1);
+    if (ch === ";" && depth === 0) {
+      parts.push(buf);
+      buf = "";
+    } else buf += ch;
   }
-  try {
-    const headObs = new MutationObserver(() => bumpEpoch());
-    headObs.observe(document.head, { subtree: true, childList: true, characterData: true, attributes: true });
-  } catch {
+  if (buf.trim()) parts.push(buf);
+  return parts.map((x) => x.trim()).filter(Boolean);
+}
+function boxShadowToDropShadow(value) {
+  const layers = [];
+  let buf = "", depth = 0;
+  for (let i = 0; i < value.length; i++) {
+    const ch = value[i];
+    if (ch === "(") depth++;
+    if (ch === ")") depth = Math.max(0, depth - 1);
+    if (ch === "," && depth === 0) {
+      layers.push(buf.trim());
+      buf = "";
+    } else buf += ch;
   }
-  try {
-    const f = document.fonts;
-    if (f) {
-      f.addEventListener?.("loadingdone", bumpEpoch);
-      f.ready?.then(() => bumpEpoch()).catch(() => {
-      });
-    }
-  } catch {
+  if (buf.trim()) layers.push(buf.trim());
+  const fns = [];
+  for (const layer of layers) {
+    if (/\binset\b/i.test(layer)) continue;
+    const nums = layer.match(/-?\d+(?:\.\d+)?px/gi) || [];
+    const [ox = "0px", oy = "0px", blur = "0px"] = nums;
+    let color = layer.replace(/-?\d+(?:\.\d+)?px/gi, "").replace(/\binset\b/ig, "").trim().replace(/\s{2,}/g, " ");
+    const hasColor = !!color && color !== ",";
+    fns.push(`drop-shadow(${ox} ${oy} ${blur}${hasColor ? ` ${color}` : ""})`);
   }
+  return fns.join(" ");
 }
-function snapshotComputedStyleFull(style, options = {}) {
-  const out = {};
-  const vis = style.getPropertyValue("visibility");
-  for (let i = 0; i < style.length; i++) {
-    const prop = style[i];
-    let val = style.getPropertyValue(prop);
-    if ((prop === "background-image" || prop === "content") && val.includes("url(") && !val.includes("data:")) {
-      val = "none";
-    }
-    out[prop] = val;
-  }
-  const EXTRA_TEXT_DECORATION_PROPS = [
-    "text-decoration-line",
-    "text-decoration-color",
-    "text-decoration-style",
-    "text-decoration-thickness",
-    "text-underline-offset",
-    "text-decoration-skip-ink"
-  ];
-  for (const prop of EXTRA_TEXT_DECORATION_PROPS) {
-    if (out[prop]) continue;
-    try {
-      const v = style.getPropertyValue(prop);
-      if (v) out[prop] = v;
-    } catch {
-    }
+function rewriteDeclList(list) {
+  const decls = splitDecls(list);
+  let filter = null, wfilter = null, box = null;
+  const rest = [];
+  for (const d of decls) {
+    const idx = d.indexOf(":");
+    if (idx < 0) continue;
+    const prop = d.slice(0, idx).trim().toLowerCase();
+    const val = d.slice(idx + 1).trim();
+    if (prop === "box-shadow") box = val;
+    else if (prop === "filter") filter = val;
+    else if (prop === "-webkit-filter") wfilter = val;
+    else rest.push([prop, val]);
   }
-  if (options.embedFonts) {
-    const EXTRA_FONT_PROPS = [
-      "font-feature-settings",
-      "font-variation-settings",
-      "font-kerning",
-      "font-variant",
-      "font-variant-ligatures",
-      "font-optical-sizing"
-    ];
-    for (const prop of EXTRA_FONT_PROPS) {
-      if (out[prop]) continue;
-      try {
-        const v = style.getPropertyValue(prop);
-        if (v) out[prop] = v;
-      } catch {
-      }
+  if (box) {
+    const ds = boxShadowToDropShadow(box);
+    if (ds) {
+      filter = filter ? `${filter} ${ds}` : ds;
+      wfilter = wfilter ? `${wfilter} ${ds}` : ds;
     }
   }
-  if (vis === "hidden") out.opacity = "0";
-  return out;
-}
-var __snapshotSig = /* @__PURE__ */ new WeakMap();
-function styleSignature(snap) {
-  let sig = __snapshotSig.get(snap);
-  if (sig) return sig;
-  const entries = Object.entries(snap).sort((a, b) => a[0] < b[0] ? -1 : a[0] > b[0] ? 1 : 0);
-  sig = entries.map(([k, v]) => `${k}:${v}`).join(";");
-  __snapshotSig.set(snap, sig);
-  return sig;
+  const out = [...rest];
+  if (filter) out.push(["filter", filter]);
+  if (wfilter) out.push(["-webkit-filter", wfilter]);
+  return out.map(([k, v]) => `${k}:${v}`).join(";");
 }
-function getSnapshot(el, preStyle = null, options = {}) {
-  const rec = snapshotCache.get(el);
-  if (rec && rec.epoch === __epoch) return rec.snapshot;
-  const style = preStyle || getComputedStyle(el);
-  const snap = snapshotComputedStyleFull(style, options);
-  stripHeightForWrappers(el, style, snap);
-  snapshotCache.set(el, { epoch: __epoch, snapshot: snap });
-  return snap;
+function rewriteCssBlock(css) {
+  return css.replace(/([^{}]+)\{([^}]*)\}/g, (_m, sel, body) => `${sel}{${rewriteDeclList(body)}}`);
 }
-function _resolveCtx(sessionOrCtx, opts) {
-  if (sessionOrCtx && sessionOrCtx.session && sessionOrCtx.persist) return sessionOrCtx;
-  if (sessionOrCtx && (sessionOrCtx.styleMap || sessionOrCtx.styleCache || sessionOrCtx.nodeMap)) {
-    return {
-      session: sessionOrCtx,
-      persist: {
-        snapshotKeyCache,
-        defaultStyle: cache.defaultStyle,
-        baseStyle: cache.baseStyle,
-        image: cache.image,
-        resource: cache.resource,
-        background: cache.background,
-        font: cache.font
-      },
-      options: opts || {}
-    };
-  }
-  return {
-    session: cache.session,
-    persist: {
-      snapshotKeyCache,
-      defaultStyle: cache.defaultStyle,
-      baseStyle: cache.baseStyle,
-      image: cache.image,
-      resource: cache.resource,
-      background: cache.background,
-      font: cache.font
-    },
-    options: sessionOrCtx || opts || {}
-  };
+function rewriteSvgBoxShadowToDropShadow(svgText) {
+  svgText = svgText.replace(
+    /<style[^>]*>([\s\S]*?)<\/style>/gi,
+    (m, css) => m.replace(css, rewriteCssBlock(css))
+  );
+  svgText = svgText.replace(
+    /style=(['"])([\s\S]*?)\1/gi,
+    (m, q, body) => `style=${q}${rewriteDeclList(body)}${q}`
+  );
+  return svgText;
 }
-async function inlineAllStyles(source, clone, sessionOrCtx, opts) {
-  if (source.tagName === "STYLE") return;
-  const ctx = _resolveCtx(sessionOrCtx, opts);
-  const resetMode = ctx.options && ctx.options.cache || "auto";
-  if (resetMode !== "disabled") setupInvalidationOnce(document.documentElement);
-  if (resetMode === "disabled" && !ctx.session.__bumpedForDisabled) {
-    bumpEpoch();
-    snapshotKeyCache.clear();
-    ctx.session.__bumpedForDisabled = true;
-  }
-  if (NO_DEFAULTS_TAGS.has(source.tagName?.toLowerCase())) {
-    const author = source.getAttribute?.("style");
-    if (author) clone.setAttribute("style", author);
-  }
-  const { session, persist } = ctx;
-  if (!session.styleCache.has(source)) {
-    session.styleCache.set(source, getComputedStyle(source));
-  }
-  const pre = session.styleCache.get(source);
-  const snap = getSnapshot(source, pre, ctx.options);
-  const sig = styleSignature(snap);
-  let key = persist.snapshotKeyCache.get(sig);
-  if (!key) {
-    const tag = source.tagName?.toLowerCase() || "div";
-    key = getStyleKey(snap, tag);
-    persist.snapshotKeyCache.set(sig, key);
+function maybeConvertBoxShadowForSafari(url) {
+  if (!isSafari() || !isSvgDataURL(url)) return url;
+  try {
+    const svg = decodeSvgFromDataURL(url);
+    const fixed = rewriteSvgBoxShadowToDropShadow(svg);
+    return encodeSvgToDataURL(fixed);
+  } catch {
+    return url;
   }
-  session.styleMap.set(clone, key);
-}
-function isReplaced(el) {
-  return el instanceof HTMLImageElement || el instanceof HTMLCanvasElement || el instanceof HTMLVideoElement || el instanceof HTMLIFrameElement || el instanceof SVGElement || el instanceof HTMLObjectElement || el instanceof HTMLEmbedElement;
 }
-function hasBox(cs) {
-  if (cs.backgroundImage && cs.backgroundImage !== "none") return true;
-  if (cs.backgroundColor && cs.backgroundColor !== "rgba(0, 0, 0, 0)" && cs.backgroundColor !== "transparent") return true;
-  if ((parseFloat(cs.borderTopWidth) || 0) > 0) return true;
-  if ((parseFloat(cs.borderBottomWidth) || 0) > 0) return true;
-  if ((parseFloat(cs.paddingTop) || 0) > 0) return true;
-  if ((parseFloat(cs.paddingBottom) || 0) > 0) return true;
-  const ob = cs.overflowBlock || cs.overflowY || "visible";
-  return ob !== "visible";
-}
-function isFlexOrGridItem(el) {
-  const p = el.parentElement;
-  if (!p) return false;
-  const pd = getComputedStyle(p).display || "";
-  return pd.includes("flex") || pd.includes("grid");
-}
-function hasFlowFast(el, cs) {
-  if (el.textContent && /\S/.test(el.textContent)) return true;
-  const f = el.firstElementChild, l = el.lastElementChild;
-  if (f && f.tagName === "BR" || l && l.tagName === "BR") return true;
-  const sh = el.scrollHeight;
-  if (sh === 0) return false;
-  const pt = parseFloat(cs.paddingTop) || 0;
-  const pb = parseFloat(cs.paddingBottom) || 0;
-  return sh > pt + pb;
-}
-function stripHeightForWrappers(el, cs, snap) {
-  if (el instanceof HTMLElement && el.style && el.style.height) return;
-  const disp = cs.display || "";
-  if (disp.includes("flex") || disp.includes("grid")) return;
-  if (isReplaced(el)) return;
-  const pos = cs.position;
-  if (pos === "absolute" || pos === "fixed" || pos === "sticky") return;
-  if (cs.transform !== "none") return;
-  if (hasBox(cs)) return;
-  if (isFlexOrGridItem(el)) return;
-  if (!hasFlowFast(el, cs)) return;
-  delete snap.height;
-  delete snap["block-size"];
-}
-
-// src/modules/CSSVar.js
-var KEY_PROPS = ["fill", "stroke", "color", "background-color", "stop-color"];
-var __BASELINE_CACHE = /* @__PURE__ */ new Map();
-function getBaselineComputed(tagName, ns) {
-  const key = ns + "::" + tagName.toLowerCase();
-  let entry = __BASELINE_CACHE.get(key);
-  if (entry) return entry;
-  const doc = document;
-  const el = ns === "http://www.w3.org/2000/svg" ? doc.createElementNS(ns, tagName) : doc.createElement(tagName);
-  const holder = doc.createElement("div");
-  holder.style.cssText = "position:absolute;left:-99999px;top:-99999px;contain:strict;display:block;";
-  holder.appendChild(el);
-  doc.documentElement.appendChild(holder);
-  const cs = getComputedStyle(el);
-  const base = {};
-  for (const p of KEY_PROPS) {
-    base[p] = cs.getPropertyValue(p) || "";
+async function toCanvas(url, options) {
+  let { width: optW, height: optH, scale = 1, dpr = 1, meta = {}, backgroundColor } = options;
+  url = maybeConvertBoxShadowForSafari(url);
+  const img = new Image();
+  img.loading = "eager";
+  img.decoding = "sync";
+  img.crossOrigin = "anonymous";
+  img.src = url;
+  await img.decode();
+  const natW = img.naturalWidth;
+  const natH = img.naturalHeight;
+  const refW = Number.isFinite(meta.w0) ? meta.w0 : natW;
+  const refH = Number.isFinite(meta.h0) ? meta.h0 : natH;
+  let outW, outH;
+  const hasW = Number.isFinite(optW);
+  const hasH = Number.isFinite(optH);
+  if (hasW && hasH) {
+    outW = Math.max(1, optW);
+    outH = Math.max(1, optH);
+  } else if (hasW) {
+    const k = optW / Math.max(1, refW);
+    outW = optW;
+    outH = refH * k;
+  } else if (hasH) {
+    const k = optH / Math.max(1, refH);
+    outH = optH;
+    outW = refW * k;
+  } else {
+    outW = natW;
+    outH = natH;
   }
-  holder.remove();
-  __BASELINE_CACHE.set(key, base);
-  return base;
-}
-function resolveCSSVars(sourceEl, cloneEl) {
-  if (!(sourceEl instanceof Element) || !(cloneEl instanceof Element)) return;
-  const styleAttr = sourceEl.getAttribute?.("style");
-  let hasVar = !!(styleAttr && styleAttr.includes("var("));
-  if (!hasVar && sourceEl.attributes?.length) {
-    const attrs = sourceEl.attributes;
-    for (let i = 0; i < attrs.length; i++) {
-      const a = attrs[i];
-      if (a && typeof a.value === "string" && a.value.includes("var(")) {
-        hasVar = true;
-        break;
-      }
-    }
+  outW = outW * scale;
+  outH = outH * scale;
+  const canvas = document.createElement("canvas");
+  canvas.width = outW * dpr;
+  canvas.height = outH * dpr;
+  canvas.style.width = `${outW}px`;
+  canvas.style.height = `${outH}px`;
+  const ctx = canvas.getContext("2d");
+  if (dpr !== 1) ctx.scale(dpr, dpr);
+  if (backgroundColor) {
+    ctx.save();
+    ctx.fillStyle = backgroundColor;
+    ctx.fillRect(0, 0, outW, outH);
+    ctx.restore();
   }
-  let cs = null;
-  if (hasVar) {
-    try {
-      cs = getComputedStyle(sourceEl);
-    } catch {
-    }
+  ctx.drawImage(img, 0, 0, outW, outH);
+  return canvas;
+}
+var init_toCanvas = __esm({
+  "src/exporters/toCanvas.js"() {
+    init_browser();
   }
-  if (hasVar) {
-    const author = sourceEl.style;
-    if (author && author.length) {
-      for (let i = 0; i < author.length; i++) {
-        const prop = author[i];
-        const val = author.getPropertyValue(prop);
-        if (!val || !val.includes("var(")) continue;
-        const resolved = cs && cs.getPropertyValue(prop);
-        if (resolved) {
-          try {
-            cloneEl.style.setProperty(prop, resolved.trim(), author.getPropertyPriority(prop));
-          } catch {
-          }
-        }
-      }
-    }
+});
+
+// src/modules/rasterize.js
+var rasterize_exports = {};
+__export(rasterize_exports, {
+  rasterize: () => rasterize
+});
+async function rasterize(url, options) {
+  const canvas = await toCanvas(url, options);
+  const img = new Image();
+  img.src = canvas.toDataURL(`image/${options.format}`, options.quality);
+  await img.decode();
+  img.style.width = `${canvas.width / options.dpr}px`;
+  img.style.height = `${canvas.height / options.dpr}px`;
+  return img;
+}
+var init_rasterize = __esm({
+  "src/modules/rasterize.js"() {
+    init_toCanvas();
   }
-  if (hasVar && sourceEl.attributes?.length) {
-    const attrs = sourceEl.attributes;
-    for (let i = 0; i < attrs.length; i++) {
-      const a = attrs[i];
-      if (!a || typeof a.value !== "string" || !a.value.includes("var(")) continue;
-      const propName = a.name;
-      const resolved = cs && cs.getPropertyValue(propName);
-      if (resolved) {
-        try {
-          cloneEl.style.setProperty(propName, resolved.trim());
-        } catch {
-        }
-      }
-    }
+});
+
+// src/exporters/toImg.js
+var toImg_exports = {};
+__export(toImg_exports, {
+  toImg: () => toImg,
+  toSvg: () => toImg
+});
+async function toImg(url, options) {
+  const { scale = 1, width, height, meta = {} } = options;
+  const hasW = Number.isFinite(width);
+  const hasH = Number.isFinite(height);
+  const wantsScale = Number.isFinite(scale) && scale !== 1 || hasW || hasH;
+  if (isSafari() && wantsScale) {
+    const pngUrl = await rasterize(url, { ...options, format: "png", quality: 1, meta });
+    return pngUrl;
   }
-  if (!hasVar) {
-    if (!cs) {
+  const img = new Image();
+  img.decoding = "sync";
+  img.loading = "eager";
+  img.src = url;
+  await img.decode();
+  if (hasW && hasH) {
+    img.style.width = `${width}px`;
+    img.style.height = `${height}px`;
+  } else if (hasW) {
+    const refW = Number.isFinite(meta.w0) ? meta.w0 : img.naturalWidth;
+    const refH = Number.isFinite(meta.h0) ? meta.h0 : img.naturalHeight;
+    const k = width / Math.max(1, refW);
+    img.style.width = `${width}px`;
+    img.style.height = `${Math.round(refH * k)}px`;
+  } else if (hasH) {
+    const refW = Number.isFinite(meta.w0) ? meta.w0 : img.naturalWidth;
+    const refH = Number.isFinite(meta.h0) ? meta.h0 : img.naturalHeight;
+    const k = height / Math.max(1, refH);
+    img.style.height = `${height}px`;
+    img.style.width = `${Math.round(refW * k)}px`;
+  } else {
+    const cssW = Math.round(img.naturalWidth * scale);
+    const cssH = Math.round(img.naturalHeight * scale);
+    img.style.width = `${cssW}px`;
+    img.style.height = `${cssH}px`;
+    if (typeof url === "string" && url.startsWith("data:image/svg+xml")) {
       try {
-        cs = getComputedStyle(sourceEl);
+        const decoded = decodeURIComponent(url.split(",")[1]);
+        const patched = decoded.replace(/width="[^"]*"/, `width="${cssW}"`).replace(/height="[^"]*"/, `height="${cssH}"`);
+        url = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(patched)}`;
+        img.src = url;
       } catch {
-        cs = null;
-      }
-    }
-    if (!cs) return;
-    const ns = sourceEl.namespaceURI || "html";
-    const base = getBaselineComputed(sourceEl.tagName, ns);
-    for (const prop of KEY_PROPS) {
-      const v = cs.getPropertyValue(prop) || "";
-      const b = base[prop] || "";
-      if (v && v !== b) {
-        try {
-          cloneEl.style.setProperty(prop, v.trim());
-        } catch {
-        }
       }
     }
   }
+  return img;
 }
+var init_toImg = __esm({
+  "src/exporters/toImg.js"() {
+    init_utils();
+    init_rasterize();
+  }
+});
 
-// src/core/clone.js
-function idleCallback(childList, callback, fast) {
-  return Promise.all(childList.map((child) => {
-    return new Promise((resolve) => {
-      function deal() {
-        idle((deadline) => {
-          const hasIdleBudget = deadline && typeof deadline.timeRemaining === "function" ? deadline.timeRemaining() > 0 : true;
-          if (hasIdleBudget) {
-            callback(child, resolve);
-          } else {
-            deal();
-          }
-        }, { fast });
-      }
-      deal();
-    });
-  }));
+// src/exporters/toBlob.js
+var toBlob_exports = {};
+__export(toBlob_exports, {
+  toBlob: () => toBlob
+});
+async function toBlob(url, options) {
+  const type = options.type;
+  if (type === "svg") {
+    const svgText = decodeURIComponent(url.split(",")[1]);
+    return new Blob([svgText], { type: "image/svg+xml" });
+  }
+  const canvas = await toCanvas(url, options);
+  return new Promise(
+    (resolve) => canvas.toBlob((blob) => resolve(blob), `image/${type}`, options.quality)
+  );
 }
-function addNotSlottedRightmost(sel) {
-  sel = sel.trim();
-  if (!sel) return sel;
-  if (/:not\(\s*\[data-sd-slotted\]\s*\)\s*$/.test(sel)) return sel;
-  return `${sel}:not([data-sd-slotted])`;
-}
-function wrapWithScope(selectorList, scopeSelector, excludeSlotted = true) {
-  return selectorList.split(",").map((s) => s.trim()).filter(Boolean).map((s) => {
-    if (s.startsWith(":where(")) return s;
-    if (s.startsWith("@")) return s;
-    const body = excludeSlotted ? addNotSlottedRightmost(s) : s;
-    return `:where(${scopeSelector} ${body})`;
-  }).join(", ");
-}
-function rewriteShadowCSS(cssText, scopeSelector) {
-  if (!cssText) return "";
-  cssText = cssText.replace(/:host\(([^)]+)\)/g, (_, sel) => {
-    return `:where(${scopeSelector}:is(${sel.trim()}))`;
-  });
-  cssText = cssText.replace(/:host\b/g, `:where(${scopeSelector})`);
-  cssText = cssText.replace(/:host-context\(([^)]+)\)/g, (_, sel) => {
-    return `:where(:where(${sel.trim()}) ${scopeSelector})`;
-  });
-  cssText = cssText.replace(/::slotted\(([^)]+)\)/g, (_, sel) => {
-    return `:where(${scopeSelector} ${sel.trim()})`;
-  });
-  cssText = cssText.replace(/(^|})(\s*)([^@}{]+){/g, (_, brace, ws, selectorList) => {
-    const wrapped = wrapWithScope(
-      selectorList,
-      scopeSelector,
-      /*excludeSlotted*/
-      true
-    );
-    return `${brace}${ws}${wrapped}{`;
-  });
-  return cssText;
-}
-function nextShadowScopeId(sessionCache) {
-  sessionCache.shadowScopeSeq = (sessionCache.shadowScopeSeq || 0) + 1;
-  return `s${sessionCache.shadowScopeSeq}`;
-}
-function extractShadowCSS(sr) {
-  let css = "";
-  try {
-    sr.querySelectorAll("style").forEach((s) => {
-      css += (s.textContent || "") + "\n";
-    });
-    const sheets = sr.adoptedStyleSheets || [];
-    for (const sh of sheets) {
-      try {
-        if (sh && sh.cssRules) {
-          for (const rule of sh.cssRules) css += rule.cssText + "\n";
-        }
-      } catch {
-      }
-    }
-  } catch {
+var init_toBlob = __esm({
+  "src/exporters/toBlob.js"() {
+    init_toCanvas();
   }
-  return css;
+});
+
+// src/exporters/download.js
+var download_exports = {};
+__export(download_exports, {
+  download: () => download
+});
+async function download(url, options) {
+  options.dpr = 1;
+  if (options.format === "svg") {
+    const blob = await toBlob(url, { ...options, type: "svg" });
+    const objectURL = URL.createObjectURL(blob);
+    const a2 = document.createElement("a");
+    a2.href = objectURL;
+    a2.download = options.filename;
+    a2.click();
+    URL.revokeObjectURL(objectURL);
+    return;
+  }
+  const canvas = await toCanvas(url, options);
+  const a = document.createElement("a");
+  a.href = canvas.toDataURL(`image/${options.format}`, options.quality);
+  a.download = options.filename;
+  a.click();
 }
-function injectScopedStyle(hostClone, cssText, scopeId) {
-  if (!cssText) return;
-  const style = document.createElement("style");
-  style.setAttribute("data-sd", scopeId);
-  style.textContent = cssText;
-  hostClone.insertBefore(style, hostClone.firstChild || null);
+var init_download = __esm({
+  "src/exporters/download.js"() {
+    init_toBlob();
+    init_toCanvas();
+  }
+});
+
+// src/core/prepare.js
+init_utils();
+
+// src/modules/styles.js
+init_utils();
+init_cache();
+var snapshotCache = /* @__PURE__ */ new WeakMap();
+var snapshotKeyCache = /* @__PURE__ */ new Map();
+var __epoch = 0;
+function bumpEpoch() {
+  __epoch++;
 }
-function freezeImgSrcset(original, cloned) {
+var __wired = false;
+function setupInvalidationOnce(root = document.documentElement) {
+  if (__wired) return;
+  __wired = true;
   try {
-    const chosen = original.currentSrc || original.src || "";
-    if (!chosen) return;
-    cloned.setAttribute("src", chosen);
-    cloned.removeAttribute("srcset");
-    cloned.removeAttribute("sizes");
-    cloned.loading = "eager";
-    cloned.decoding = "sync";
+    const domObs = new MutationObserver(() => bumpEpoch());
+    domObs.observe(root, { subtree: true, childList: true, characterData: true, attributes: true });
   } catch {
   }
-}
-function collectCustomPropsFromCSS(cssText) {
-  const out = /* @__PURE__ */ new Set();
-  if (!cssText) return out;
-  const re = /var\(\s*(--[A-Za-z0-9_-]+)\b/g;
-  let m;
-  while (m = re.exec(cssText)) out.add(m[1]);
-  return out;
-}
-function resolveCustomProp(el, name) {
   try {
-    const cs = getComputedStyle(el);
-    let v = cs.getPropertyValue(name).trim();
-    if (v) return v;
+    const headObs = new MutationObserver(() => bumpEpoch());
+    headObs.observe(document.head, { subtree: true, childList: true, characterData: true, attributes: true });
   } catch {
   }
   try {
-    const rootCS = getComputedStyle(document.documentElement);
-    let v = rootCS.getPropertyValue(name).trim();
-    if (v) return v;
+    const f = document.fonts;
+    if (f) {
+      f.addEventListener?.("loadingdone", bumpEpoch);
+      f.ready?.then(() => bumpEpoch()).catch(() => {
+      });
+    }
   } catch {
   }
-  return "";
-}
-function buildSeedCustomPropsRule(hostEl, names, scopeSelector) {
-  const decls = [];
-  for (const name of names) {
-    const val = resolveCustomProp(hostEl, name);
-    if (val) decls.push(`${name}: ${val};`);
-  }
-  if (!decls.length) return "";
-  return `${scopeSelector}{${decls.join("")}}
-`;
-}
-function markSlottedSubtree(root) {
-  if (!root) return;
-  if (root.nodeType === Node.ELEMENT_NODE) {
-    root.setAttribute("data-sd-slotted", "");
-  }
-  if (root.querySelectorAll) {
-    root.querySelectorAll("*").forEach((el) => el.setAttribute("data-sd-slotted", ""));
-  }
 }
-async function getAccessibleIframeDocument(iframe, attempts = 3) {
-  const probe = () => {
-    try {
-      return iframe.contentDocument || iframe.contentWindow?.document || null;
-    } catch {
-      return null;
+function snapshotComputedStyleFull(style, options = {}) {
+  const out = {};
+  const vis = style.getPropertyValue("visibility");
+  for (let i = 0; i < style.length; i++) {
+    const prop = style[i];
+    let val = style.getPropertyValue(prop);
+    if ((prop === "background-image" || prop === "content") && val.includes("url(") && !val.includes("data:")) {
+      val = "none";
     }
-  };
-  let doc = probe();
-  let i = 0;
-  while (i < attempts && (!doc || !doc.body && !doc.documentElement)) {
-    await new Promise((r) => setTimeout(r, 0));
-    doc = probe();
-    i++;
-  }
-  return doc && (doc.body || doc.documentElement) ? doc : null;
-}
-function measureContentBox(el) {
-  const rect = el.getBoundingClientRect();
-  let bl = 0, br = 0, bt = 0, bb = 0;
-  try {
-    const cs = getComputedStyle(el);
-    bl = parseFloat(cs.borderLeftWidth) || 0;
-    br = parseFloat(cs.borderRightWidth) || 0;
-    bt = parseFloat(cs.borderTopWidth) || 0;
-    bb = parseFloat(cs.borderBottomWidth) || 0;
-  } catch {
+    out[prop] = val;
   }
-  const contentWidth = Math.max(0, Math.round(rect.width - (bl + br)));
-  const contentHeight = Math.max(0, Math.round(rect.height - (bt + bb)));
-  return { contentWidth, contentHeight, rect };
-}
-function pinIframeViewport(doc, w, h) {
-  const style = doc.createElement("style");
-  style.setAttribute("data-sd-iframe-pin", "");
-  style.textContent = `html, body {margin: 0 !important;padding: 0 !important;width: ${w}px !important;height: ${h}px !important;min-width: ${w}px !important;min-height: ${h}px !important;box-sizing: border-box !important;overflow: hidden !important;background-clip: border-box !important;}`;
-  (doc.head || doc.documentElement).appendChild(style);
-  return () => {
+  const EXTRA_TEXT_DECORATION_PROPS = [
+    "text-decoration-line",
+    "text-decoration-color",
+    "text-decoration-style",
+    "text-decoration-thickness",
+    "text-underline-offset",
+    "text-decoration-skip-ink"
+  ];
+  for (const prop of EXTRA_TEXT_DECORATION_PROPS) {
+    if (out[prop]) continue;
     try {
-      style.remove();
+      const v = style.getPropertyValue(prop);
+      if (v) out[prop] = v;
     } catch {
     }
-  };
-}
-async function rasterizeIframe(iframe, sessionCache, options) {
-  const doc = await getAccessibleIframeDocument(iframe, 3);
-  if (!doc) throw new Error("iframe document not accessible/ready");
-  const { contentWidth, contentHeight, rect } = measureContentBox(iframe);
-  const snap = options?.snap;
-  if (!snap || typeof snap.toPng !== "function") {
-    throw new Error("snapdom.toPng not available in iframe or window");
   }
-  const nested = { ...options, scale: 1 };
-  const unpin = pinIframeViewport(doc, contentWidth, contentHeight);
-  let imgEl;
-  try {
-    imgEl = await snap.toPng(doc.documentElement, nested);
-  } finally {
-    unpin();
+  if (options.embedFonts) {
+    const EXTRA_FONT_PROPS = [
+      "font-feature-settings",
+      "font-variation-settings",
+      "font-kerning",
+      "font-variant",
+      "font-variant-ligatures",
+      "font-optical-sizing"
+    ];
+    for (const prop of EXTRA_FONT_PROPS) {
+      if (out[prop]) continue;
+      try {
+        const v = style.getPropertyValue(prop);
+        if (v) out[prop] = v;
+      } catch {
+      }
+    }
   }
-  imgEl.style.display = "block";
-  imgEl.style.width = `${contentWidth}px`;
-  imgEl.style.height = `${contentHeight}px`;
-  const wrapper = document.createElement("div");
-  sessionCache.nodeMap.set(wrapper, iframe);
-  inlineAllStyles(iframe, wrapper, sessionCache, options);
-  wrapper.style.overflow = "hidden";
-  wrapper.style.display = "block";
-  if (!wrapper.style.width) wrapper.style.width = `${Math.round(rect.width)}px`;
-  if (!wrapper.style.height) wrapper.style.height = `${Math.round(rect.height)}px`;
-  wrapper.appendChild(imgEl);
-  return wrapper;
+  if (vis === "hidden") out.opacity = "0";
+  return out;
 }
-async function deepClone(node, sessionCache, options) {
-  if (!node) throw new Error("Invalid node");
-  const clonedAssignedNodes = /* @__PURE__ */ new Set();
-  let pendingSelectValue = null;
-  let pendingTextAreaValue = null;
-  if (node.nodeType === Node.ELEMENT_NODE) {
-    const tag = (node.localName || node.tagName || "").toLowerCase();
-    if (node.id === "snapdom-sandbox" || node.hasAttribute("data-snapdom-sandbox")) {
-      return null;
-    }
-    if (NO_CAPTURE_TAGS.has(tag)) {
-      return null;
-    }
+var __snapshotSig = /* @__PURE__ */ new WeakMap();
+function styleSignature(snap) {
+  let sig = __snapshotSig.get(snap);
+  if (sig) return sig;
+  const entries = Object.entries(snap).sort((a, b) => a[0] < b[0] ? -1 : a[0] > b[0] ? 1 : 0);
+  sig = entries.map(([k, v]) => `${k}:${v}`).join(";");
+  __snapshotSig.set(snap, sig);
+  return sig;
+}
+function getSnapshot(el, preStyle = null, options = {}) {
+  const rec = snapshotCache.get(el);
+  if (rec && rec.epoch === __epoch) return rec.snapshot;
+  const style = preStyle || getComputedStyle(el);
+  const snap = snapshotComputedStyleFull(style, options);
+  stripHeightForWrappers(el, style, snap);
+  snapshotCache.set(el, { epoch: __epoch, snapshot: snap });
+  return snap;
+}
+function _resolveCtx(sessionOrCtx, opts) {
+  if (sessionOrCtx && sessionOrCtx.session && sessionOrCtx.persist) return sessionOrCtx;
+  if (sessionOrCtx && (sessionOrCtx.styleMap || sessionOrCtx.styleCache || sessionOrCtx.nodeMap)) {
+    return {
+      session: sessionOrCtx,
+      persist: {
+        snapshotKeyCache,
+        defaultStyle: cache.defaultStyle,
+        baseStyle: cache.baseStyle,
+        image: cache.image,
+        resource: cache.resource,
+        background: cache.background,
+        font: cache.font
+      },
+      options: opts || {}
+    };
   }
-  if (node.nodeType === Node.TEXT_NODE) {
-    return node.cloneNode(true);
+  return {
+    session: cache.session,
+    persist: {
+      snapshotKeyCache,
+      defaultStyle: cache.defaultStyle,
+      baseStyle: cache.baseStyle,
+      image: cache.image,
+      resource: cache.resource,
+      background: cache.background,
+      font: cache.font
+    },
+    options: sessionOrCtx || opts || {}
+  };
+}
+async function inlineAllStyles(source, clone, sessionOrCtx, opts) {
+  if (source.tagName === "STYLE") return;
+  const ctx = _resolveCtx(sessionOrCtx, opts);
+  const resetMode = ctx.options && ctx.options.cache || "auto";
+  if (resetMode !== "disabled") setupInvalidationOnce(document.documentElement);
+  if (resetMode === "disabled" && !ctx.session.__bumpedForDisabled) {
+    bumpEpoch();
+    snapshotKeyCache.clear();
+    ctx.session.__bumpedForDisabled = true;
   }
-  if (node.nodeType !== Node.ELEMENT_NODE) {
-    return node.cloneNode(true);
+  if (NO_DEFAULTS_TAGS.has(source.tagName?.toLowerCase())) {
+    const author = source.getAttribute?.("style");
+    if (author) clone.setAttribute("style", author);
   }
-  if (node.getAttribute("data-capture") === "exclude") {
-    if (options.excludeMode === "hide") {
-      const spacer = document.createElement("div");
-      const rect = node.getBoundingClientRect();
-      spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
-      return spacer;
-    } else if (options.excludeMode === "remove") {
-      return null;
+  const { session, persist } = ctx;
+  if (!session.styleCache.has(source)) {
+    session.styleCache.set(source, getComputedStyle(source));
+  }
+  const pre = session.styleCache.get(source);
+  const snap = getSnapshot(source, pre, ctx.options);
+  const sig = styleSignature(snap);
+  let key = persist.snapshotKeyCache.get(sig);
+  if (!key) {
+    const tag = source.tagName?.toLowerCase() || "div";
+    key = getStyleKey(snap, tag);
+    persist.snapshotKeyCache.set(sig, key);
+  }
+  session.styleMap.set(clone, key);
+}
+function isReplaced(el) {
+  return el instanceof HTMLImageElement || el instanceof HTMLCanvasElement || el instanceof HTMLVideoElement || el instanceof HTMLIFrameElement || el instanceof SVGElement || el instanceof HTMLObjectElement || el instanceof HTMLEmbedElement;
+}
+function hasBox(cs) {
+  if (cs.backgroundImage && cs.backgroundImage !== "none") return true;
+  if (cs.backgroundColor && cs.backgroundColor !== "rgba(0, 0, 0, 0)" && cs.backgroundColor !== "transparent") return true;
+  if ((parseFloat(cs.borderTopWidth) || 0) > 0) return true;
+  if ((parseFloat(cs.borderBottomWidth) || 0) > 0) return true;
+  if ((parseFloat(cs.paddingTop) || 0) > 0) return true;
+  if ((parseFloat(cs.paddingBottom) || 0) > 0) return true;
+  const ob = cs.overflowBlock || cs.overflowY || "visible";
+  return ob !== "visible";
+}
+function isFlexOrGridItem(el) {
+  const p = el.parentElement;
+  if (!p) return false;
+  const pd = getComputedStyle(p).display || "";
+  return pd.includes("flex") || pd.includes("grid");
+}
+function hasFlowFast(el, cs) {
+  if (el.textContent && /\S/.test(el.textContent)) return true;
+  const f = el.firstElementChild, l = el.lastElementChild;
+  if (f && f.tagName === "BR" || l && l.tagName === "BR") return true;
+  const sh = el.scrollHeight;
+  if (sh === 0) return false;
+  const pt = parseFloat(cs.paddingTop) || 0;
+  const pb = parseFloat(cs.paddingBottom) || 0;
+  return sh > pt + pb;
+}
+function stripHeightForWrappers(el, cs, snap) {
+  if (el instanceof HTMLElement && el.style && el.style.height) return;
+  const tag = el.tagName && el.tagName.toLowerCase();
+  if (!tag || tag !== "div" && tag !== "section" && tag !== "article" && tag !== "main" && tag !== "aside" && tag !== "header" && tag !== "footer" && tag !== "nav") {
+    return;
+  }
+  const disp = cs.display || "";
+  if (disp.includes("flex") || disp.includes("grid")) return;
+  if (isReplaced(el)) return;
+  const pos = cs.position;
+  if (pos === "absolute" || pos === "fixed" || pos === "sticky") return;
+  if (cs.transform !== "none") return;
+  if (hasBox(cs)) return;
+  if (isFlexOrGridItem(el)) return;
+  const overflowX = cs.overflowX || cs.overflow || "visible";
+  const overflowY = cs.overflowY || cs.overflow || "visible";
+  if (overflowX !== "visible" || overflowY !== "visible") return;
+  const clip = cs.clip;
+  if (clip && clip !== "auto" && clip !== "rect(auto, auto, auto, auto)") return;
+  if (cs.visibility === "hidden" || cs.opacity === "0") return;
+  if (!hasFlowFast(el, cs)) return;
+  delete snap.height;
+  delete snap["block-size"];
+}
+
+// src/core/clone.js
+init_css();
+
+// src/modules/CSSVar.js
+var KEY_PROPS = ["fill", "stroke", "color", "background-color", "stop-color"];
+var __BASELINE_CACHE = /* @__PURE__ */ new Map();
+function getBaselineComputed(tagName, ns) {
+  const key = ns + "::" + tagName.toLowerCase();
+  let entry = __BASELINE_CACHE.get(key);
+  if (entry) return entry;
+  const doc = document;
+  const el = ns === "http://www.w3.org/2000/svg" ? doc.createElementNS(ns, tagName) : doc.createElement(tagName);
+  const holder = doc.createElement("div");
+  holder.style.cssText = "position:absolute;left:-99999px;top:-99999px;contain:strict;display:block;";
+  holder.appendChild(el);
+  doc.documentElement.appendChild(holder);
+  const cs = getComputedStyle(el);
+  const base = {};
+  for (const p of KEY_PROPS) {
+    base[p] = cs.getPropertyValue(p) || "";
+  }
+  holder.remove();
+  __BASELINE_CACHE.set(key, base);
+  return base;
+}
+function resolveCSSVars(sourceEl, cloneEl) {
+  if (!(sourceEl instanceof Element) || !(cloneEl instanceof Element)) return;
+  const styleAttr = sourceEl.getAttribute?.("style");
+  let hasVar = !!(styleAttr && styleAttr.includes("var("));
+  if (!hasVar && sourceEl.attributes?.length) {
+    const attrs = sourceEl.attributes;
+    for (let i = 0; i < attrs.length; i++) {
+      const a = attrs[i];
+      if (a && typeof a.value === "string" && a.value.includes("var(")) {
+        hasVar = true;
+        break;
+      }
     }
   }
-  if (options.exclude && Array.isArray(options.exclude)) {
-    for (const selector of options.exclude) {
-      try {
-        if (node.matches?.(selector)) {
-          if (options.excludeMode === "hide") {
-            const spacer = document.createElement("div");
-            const rect = node.getBoundingClientRect();
-            spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
-            return spacer;
-          } else if (options.excludeMode === "remove") {
-            return null;
+  let cs = null;
+  if (hasVar) {
+    try {
+      cs = getComputedStyle(sourceEl);
+    } catch {
+    }
+  }
+  if (hasVar) {
+    const author = sourceEl.style;
+    if (author && author.length) {
+      for (let i = 0; i < author.length; i++) {
+        const prop = author[i];
+        const val = author.getPropertyValue(prop);
+        if (!val || !val.includes("var(")) continue;
+        const resolved = cs && cs.getPropertyValue(prop);
+        if (resolved) {
+          try {
+            cloneEl.style.setProperty(prop, resolved.trim(), author.getPropertyPriority(prop));
+          } catch {
           }
         }
-      } catch (err) {
-        console.warn(`Invalid selector in exclude option: ${selector}`, err);
       }
     }
   }
-  if (typeof options.filter === "function") {
-    try {
-      if (!options.filter(node)) {
-        if (options.filterMode === "hide") {
-          const spacer = document.createElement("div");
-          const rect = node.getBoundingClientRect();
-          spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
-          return spacer;
-        } else if (options.filterMode === "remove") {
-          return null;
+  if (hasVar && sourceEl.attributes?.length) {
+    const attrs = sourceEl.attributes;
+    for (let i = 0; i < attrs.length; i++) {
+      const a = attrs[i];
+      if (!a || typeof a.value !== "string" || !a.value.includes("var(")) continue;
+      const propName = a.name;
+      const resolved = cs && cs.getPropertyValue(propName);
+      if (resolved) {
+        try {
+          cloneEl.style.setProperty(propName, resolved.trim());
+        } catch {
         }
       }
-    } catch (err) {
-      console.warn("Error in filter function:", err);
     }
   }
-  if (node.tagName === "IFRAME") {
-    let sameOrigin = false;
-    try {
-      sameOrigin = !!(node.contentDocument || node.contentWindow?.document);
-    } catch {
-      sameOrigin = false;
-    }
-    if (sameOrigin) {
+  if (!hasVar) {
+    if (!cs) {
       try {
-        const wrapper = await rasterizeIframe(node, sessionCache, options);
-        return wrapper;
-      } catch (err) {
-        console.warn("[SnapDOM] iframe rasterization failed, fallback:", err);
+        cs = getComputedStyle(sourceEl);
+      } catch {
+        cs = null;
       }
     }
-    if (options.placeholders) {
-      const fallback = document.createElement("div");
-      fallback.style.cssText = `width:${node.offsetWidth}px;height:${node.offsetHeight}px;background-image:repeating-linear-gradient(45deg,#ddd,#ddd 5px,#f9f9f9 5px,#f9f9f9 10px);display:flex;align-items:center;justify-content:center;font-size:12px;color:#555;border:1px solid #aaa;`;
-      inlineAllStyles(node, fallback, sessionCache, options);
-      return fallback;
-    } else {
-      const rect = node.getBoundingClientRect();
-      const spacer = document.createElement("div");
-      spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
-      inlineAllStyles(node, spacer, sessionCache, options);
-      return spacer;
-    }
-  }
-  if (node.getAttribute("data-capture") === "placeholder") {
-    const clone2 = node.cloneNode(false);
-    sessionCache.nodeMap.set(clone2, node);
-    inlineAllStyles(node, clone2, sessionCache, options);
-    const placeholder = document.createElement("div");
-    placeholder.textContent = node.getAttribute("data-placeholder-text") || "";
-    placeholder.style.cssText = "color:#666;font-size:12px;text-align:center;line-height:1.4;padding:0.5em;box-sizing:border-box;";
-    clone2.appendChild(placeholder);
-    return clone2;
-  }
-  if (node.tagName === "CANVAS") {
-    let url = "";
-    try {
-      const ctx = node.getContext("2d", { willReadFrequently: true });
-      try {
-        ctx && ctx.getImageData(0, 0, 1, 1);
-      } catch {
-      }
-      await new Promise((r) => requestAnimationFrame(r));
-      url = node.toDataURL("image/png");
-      if (!url || url === "data:,") {
+    if (!cs) return;
+    const ns = sourceEl.namespaceURI || "html";
+    const base = getBaselineComputed(sourceEl.tagName, ns);
+    for (const prop of KEY_PROPS) {
+      const v = cs.getPropertyValue(prop) || "";
+      const b = base[prop] || "";
+      if (v && v !== b) {
         try {
-          ctx && ctx.getImageData(0, 0, 1, 1);
+          cloneEl.style.setProperty(prop, v.trim());
         } catch {
         }
-        await new Promise((r) => requestAnimationFrame(r));
-        url = node.toDataURL("image/png");
-        if (!url || url === "data:,") {
-          const scratch = document.createElement("canvas");
-          scratch.width = node.width;
-          scratch.height = node.height;
-          const sctx = scratch.getContext("2d");
-          if (sctx) {
-            sctx.drawImage(node, 0, 0);
-            url = scratch.toDataURL("image/png");
-          }
-        }
       }
-    } catch {
-    }
-    const img = document.createElement("img");
-    try {
-      img.decoding = "sync";
-      img.loading = "eager";
-    } catch {
-    }
-    if (url) img.src = url;
-    img.width = node.width;
-    img.height = node.height;
-    try {
-      const cs = getComputedStyle(node);
-      if (cs.width) img.style.width = cs.width;
-      if (cs.height) img.style.height = cs.height;
-    } catch {
     }
-    sessionCache.nodeMap.set(img, node);
-    inlineAllStyles(node, img, sessionCache, options);
-    return img;
   }
-  let clone;
+}
+
+// src/utils/clone.helpers.js
+init_utils();
+init_cache();
+init_snapFetch();
+function idleCallback(childList, callback, fast) {
+  return Promise.all(childList.map((child) => {
+    return new Promise((resolve) => {
+      function deal() {
+        idle((deadline) => {
+          const hasIdleBudget = deadline && typeof deadline.timeRemaining === "function" ? deadline.timeRemaining() > 0 : true;
+          if (hasIdleBudget) {
+            callback(child, resolve);
+          } else {
+            deal();
+          }
+        }, { fast });
+      }
+      deal();
+    });
+  }));
+}
+function addNotSlottedRightmost(sel) {
+  sel = sel.trim();
+  if (!sel) return sel;
+  if (/:not\(\s*\[data-sd-slotted\]\s*\)\s*$/.test(sel)) return sel;
+  return `${sel}:not([data-sd-slotted])`;
+}
+function wrapWithScope(selectorList, scopeSelector, excludeSlotted = true) {
+  return selectorList.split(",").map((s) => s.trim()).filter(Boolean).map((s) => {
+    if (s.startsWith(":where(")) return s;
+    if (s.startsWith("@")) return s;
+    const body = excludeSlotted ? addNotSlottedRightmost(s) : s;
+    return `:where(${scopeSelector} ${body})`;
+  }).join(", ");
+}
+function rewriteShadowCSS(cssText, scopeSelector) {
+  if (!cssText) return "";
+  cssText = cssText.replace(/:host\(([^)]+)\)/g, (_, sel) => {
+    return `:where(${scopeSelector}:is(${sel.trim()}))`;
+  });
+  cssText = cssText.replace(/:host\b/g, `:where(${scopeSelector})`);
+  cssText = cssText.replace(/:host-context\(([^)]+)\)/g, (_, sel) => {
+    return `:where(:where(${sel.trim()}) ${scopeSelector})`;
+  });
+  cssText = cssText.replace(/::slotted\(([^)]+)\)/g, (_, sel) => {
+    return `:where(${scopeSelector} ${sel.trim()})`;
+  });
+  cssText = cssText.replace(/(^|})(\s*)([^@}{]+){/g, (_, brace, ws, selectorList) => {
+    const wrapped = wrapWithScope(
+      selectorList,
+      scopeSelector,
+      /*excludeSlotted*/
+      true
+    );
+    return `${brace}${ws}${wrapped}{`;
+  });
+  return cssText;
+}
+function nextShadowScopeId(sessionCache) {
+  sessionCache.shadowScopeSeq = (sessionCache.shadowScopeSeq || 0) + 1;
+  return `s${sessionCache.shadowScopeSeq}`;
+}
+function extractShadowCSS(sr) {
+  let css = "";
   try {
-    clone = node.cloneNode(false);
-    resolveCSSVars(node, clone);
-    sessionCache.nodeMap.set(clone, node);
-    if (node.tagName === "IMG") {
-      freezeImgSrcset(node, clone);
+    sr.querySelectorAll("style").forEach((s) => {
+      css += (s.textContent || "") + "\n";
+    });
+    const sheets = sr.adoptedStyleSheets || [];
+    for (const sh of sheets) {
       try {
-        const rect = node.getBoundingClientRect();
-        let w = Math.round(rect.width || 0);
-        let h = Math.round(rect.height || 0);
-        if (!w || !h) {
-          const computed = window.getComputedStyle(node);
-          const cssW = parseFloat(computed.width) || 0;
-          const cssH = parseFloat(computed.height) || 0;
-          const attrW = parseInt(node.getAttribute("width") || "", 10) || 0;
-          const attrH = parseInt(node.getAttribute("height") || "", 10) || 0;
-          const propW = node.width || node.naturalWidth || 0;
-          const propH = node.height || node.naturalHeight || 0;
-          w = Math.round(w || cssW || attrW || propW || 0);
-          h = Math.round(h || cssH || attrH || propH || 0);
+        if (sh && sh.cssRules) {
+          for (const rule of sh.cssRules) css += rule.cssText + "\n";
         }
-        if (w) clone.dataset.snapdomWidth = String(w);
-        if (h) clone.dataset.snapdomHeight = String(h);
       } catch {
       }
     }
-  } catch (err) {
-    console.error("[Snapdom] Failed to clone node:", node, err);
-    throw err;
+  } catch {
   }
-  if (node instanceof HTMLTextAreaElement) {
-    const rect = node.getBoundingClientRect();
-    clone.style.width = `${rect.width}px`;
-    clone.style.height = `${rect.height}px`;
+  return css;
+}
+function injectScopedStyle(hostClone, cssText, scopeId) {
+  if (!cssText) return;
+  const style = document.createElement("style");
+  style.setAttribute("data-sd", scopeId);
+  style.textContent = cssText;
+  hostClone.insertBefore(style, hostClone.firstChild || null);
+}
+function freezeImgSrcset(original, cloned) {
+  try {
+    const chosen = original.currentSrc || original.src || "";
+    if (!chosen) return;
+    cloned.setAttribute("src", chosen);
+    cloned.removeAttribute("srcset");
+    cloned.removeAttribute("sizes");
+    cloned.loading = "eager";
+    cloned.decoding = "sync";
+  } catch {
   }
-  if (node instanceof HTMLInputElement) {
-    clone.value = node.value;
-    clone.setAttribute("value", node.value);
-    if (node.checked !== void 0) {
-      clone.checked = node.checked;
-      if (node.checked) clone.setAttribute("checked", "");
-      if (node.indeterminate) clone.indeterminate = node.indeterminate;
-    }
+}
+function collectCustomPropsFromCSS(cssText) {
+  const out = /* @__PURE__ */ new Set();
+  if (!cssText) return out;
+  const re = /var\(\s*(--[A-Za-z0-9_-]+)\b/g;
+  let m;
+  while (m = re.exec(cssText)) out.add(m[1]);
+  return out;
+}
+function resolveCustomProp(el, name) {
+  try {
+    const cs = getComputedStyle(el);
+    let v = cs.getPropertyValue(name).trim();
+    if (v) return v;
+  } catch {
   }
-  if (node instanceof HTMLSelectElement) {
-    pendingSelectValue = node.value;
+  try {
+    const rootCS = getComputedStyle(document.documentElement);
+    let v = rootCS.getPropertyValue(name).trim();
+    if (v) return v;
+  } catch {
   }
-  if (node instanceof HTMLTextAreaElement) {
-    pendingTextAreaValue = node.value;
+  return "";
+}
+function buildSeedCustomPropsRule(hostEl, names, scopeSelector) {
+  const decls = [];
+  for (const name of names) {
+    const val = resolveCustomProp(hostEl, name);
+    if (val) decls.push(`${name}: ${val};`);
   }
-  inlineAllStyles(node, clone, sessionCache, options);
-  if (node.shadowRoot) {
-    let callback2 = function(child, resolve) {
-      if (child.nodeType === Node.ELEMENT_NODE && child.tagName === "STYLE") {
-        return resolve(null);
-      } else {
-        deepClone(child, sessionCache, options).then((clonedChild) => {
-          resolve(clonedChild || null);
-        }).catch(() => {
-          resolve(null);
-        });
-      }
-    };
+  if (!decls.length) return "";
+  return `${scopeSelector}{${decls.join("")}}
+`;
+}
+function markSlottedSubtree(root) {
+  if (!root) return;
+  if (root.nodeType === Node.ELEMENT_NODE) {
+    root.setAttribute("data-sd-slotted", "");
+  }
+  if (root.querySelectorAll) {
+    root.querySelectorAll("*").forEach((el) => el.setAttribute("data-sd-slotted", ""));
+  }
+}
+async function getAccessibleIframeDocument(iframe, attempts = 3) {
+  const probe = () => {
     try {
-      const slots = node.shadowRoot.querySelectorAll("slot");
-      for (const s of slots) {
-        let assigned = [];
-        try {
-          assigned = s.assignedNodes?.({ flatten: true }) || s.assignedNodes?.() || [];
-        } catch {
-          assigned = s.assignedNodes?.() || [];
-        }
-        for (const an of assigned) clonedAssignedNodes.add(an);
-      }
-    } catch {
-    }
-    const scopeId = nextShadowScopeId(sessionCache);
-    const scopeSelector = `[data-sd="${scopeId}"]`;
-    try {
-      clone.setAttribute("data-sd", scopeId);
+      return iframe.contentDocument || iframe.contentWindow?.document || null;
     } catch {
+      return null;
     }
-    const rawCSS = extractShadowCSS(node.shadowRoot);
-    const rewritten = rewriteShadowCSS(rawCSS, scopeSelector);
-    const neededVars = collectCustomPropsFromCSS(rawCSS);
-    const seed = buildSeedCustomPropsRule(node, neededVars, scopeSelector);
-    injectScopedStyle(clone, seed + rewritten, scopeId);
-    const shadowFrag = document.createDocumentFragment();
-    const cloneList2 = await idleCallback(Array.from(node.shadowRoot.childNodes), callback2, options.fast);
-    shadowFrag.append(...cloneList2.filter((clonedChild) => !!clonedChild));
-    clone.appendChild(shadowFrag);
-  }
-  if (node.tagName === "SLOT") {
-    let callback2 = function(child, resolve) {
-      deepClone(child, sessionCache, options).then((clonedChild) => {
-        if (clonedChild) {
-          markSlottedSubtree(clonedChild);
-        }
-        resolve(clonedChild || null);
-      }).catch(() => {
-        resolve(null);
-      });
-    };
-    const assigned = node.assignedNodes?.({ flatten: true }) || [];
-    const nodesToClone = assigned.length > 0 ? assigned : Array.from(node.childNodes);
-    const fragment = document.createDocumentFragment();
-    const cloneList2 = await idleCallback(Array.from(nodesToClone), callback2, options.fast);
-    fragment.append(...cloneList2.filter((clonedChild) => !!clonedChild));
-    return fragment;
-  }
-  function callback(child, resolve) {
-    if (clonedAssignedNodes.has(child)) return resolve(null);
-    deepClone(child, sessionCache, options).then((clonedChild) => {
-      resolve(clonedChild || null);
-    }).catch(() => {
-      resolve(null);
-    });
-  }
-  const cloneList = await idleCallback(Array.from(node.childNodes), callback, options.fast);
-  clone.append(...cloneList.filter((clonedChild) => !!clonedChild));
-  if (pendingSelectValue !== null && clone instanceof HTMLSelectElement) {
-    clone.value = pendingSelectValue;
-    for (const opt of clone.options) {
-      if (opt.value === pendingSelectValue) {
-        opt.setAttribute("selected", "");
-      } else {
-        opt.removeAttribute("selected");
-      }
-    }
-  }
-  if (pendingTextAreaValue !== null && clone instanceof HTMLTextAreaElement) {
-    clone.textContent = pendingTextAreaValue;
-  }
-  return clone;
-}
-
-// src/modules/iconFonts.js
-var defaultIconFonts = [
-  // /uicons/i,
-  /font\s*awesome/i,
-  /material\s*icons/i,
-  /ionicons/i,
-  /glyphicons/i,
-  /feather/i,
-  /bootstrap\s*icons/i,
-  /remix\s*icons/i,
-  /heroicons/i,
-  /layui/i,
-  /lucide/i
-];
-var ICON_FONT_URLS = Object.assign({
-  materialIconsFilled: "https://fonts.gstatic.com/s/materialicons/v48/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2",
-  materialIconsOutlined: "https://fonts.gstatic.com/s/materialiconsoutlined/v110/gok-H7zzDkdnRel8-DQ6KAXJ69wP1tGnf4ZGhUcel5euIg.woff2",
-  materialIconsRound: "https://fonts.gstatic.com/s/materialiconsround/v109/LDItaoyNOAY6Uewc665JcIzCKsKc_M9flwmPq_HTTw.woff2",
-  materialIconsSharp: "https://fonts.gstatic.com/s/materialiconssharp/v110/oPWQ_lt5nv4pWNJpghLP75WiFR4kLh3kvmvRImcycg.woff2"
-}, typeof window !== "undefined" && window.__SNAPDOM_ICON_FONTS__ || {});
-var userIconFonts = [];
-function extendIconFonts(fonts) {
-  const list = Array.isArray(fonts) ? fonts : [fonts];
-  for (const f of list) {
-    if (f instanceof RegExp) userIconFonts.push(f);
-    else if (typeof f === "string") userIconFonts.push(new RegExp(f, "i"));
-    else console.warn("[snapdom] Ignored invalid iconFont value:", f);
+  };
+  let doc = probe();
+  let i = 0;
+  while (i < attempts && (!doc || !doc.body && !doc.documentElement)) {
+    await new Promise((r) => setTimeout(r, 0));
+    doc = probe();
+    i++;
   }
+  return doc && (doc.body || doc.documentElement) ? doc : null;
 }
-function isIconFont2(input) {
-  const text = typeof input === "string" ? input : "";
-  const candidates = [...defaultIconFonts, ...userIconFonts];
-  for (const rx of candidates) {
-    if (rx instanceof RegExp && rx.test(text)) return true;
+function measureContentBox(el) {
+  const rect = el.getBoundingClientRect();
+  let bl = 0, br = 0, bt = 0, bb = 0;
+  try {
+    const cs = getComputedStyle(el);
+    bl = parseFloat(cs.borderLeftWidth) || 0;
+    br = parseFloat(cs.borderRightWidth) || 0;
+    bt = parseFloat(cs.borderTopWidth) || 0;
+    bb = parseFloat(cs.borderBottomWidth) || 0;
+  } catch {
   }
-  if (/icon/i.test(text) || /glyph/i.test(text) || /symbols/i.test(text) || /feather/i.test(text) || /fontawesome/i.test(text)) return true;
-  return false;
-}
-function isMaterialFamily(family = "") {
-  const s = String(family).toLowerCase();
-  return /\bmaterial\s*icons\b/.test(s) || /\bmaterial\s*symbols\b/.test(s);
+  const contentWidth = Math.max(0, Math.round(rect.width - (bl + br)));
+  const contentHeight = Math.max(0, Math.round(rect.height - (bt + bb)));
+  return { contentWidth, contentHeight, rect };
 }
-var loadedCanvasFamilies = /* @__PURE__ */ new Map();
-function parseAxes(variation = "") {
-  const out = /* @__PURE__ */ Object.create(null);
-  const v = String(variation || "");
-  const rx = /['"]?\s*([A-Za-z]{3,4})\s*['"]?\s*([+-]?\d+(?:\.\d+)?)\s*/g;
-  let m;
-  while (m = rx.exec(v)) out[m[1].toUpperCase()] = Number(m[2]);
-  return out;
+function pinIframeViewport(doc, w, h) {
+  const style = doc.createElement("style");
+  style.setAttribute("data-sd-iframe-pin", "");
+  style.textContent = `html, body {margin: 0 !important;padding: 0 !important;width: ${w}px !important;height: ${h}px !important;min-width: ${w}px !important;min-height: ${h}px !important;box-sizing: border-box !important;overflow: hidden !important;background-clip: border-box !important;}`;
+  (doc.head || doc.documentElement).appendChild(style);
+  return () => {
+    try {
+      style.remove();
+    } catch {
+    }
+  };
 }
-async function ensureLigatureCanvasFont(cssFamily, className, axes) {
-  const fam = String(cssFamily || "");
-  const lowerFam = fam.toLowerCase();
-  const cls = String(className || "").toLowerCase();
-  if (/\bmaterial\s*icons\b/.test(lowerFam) && !/\bsymbols\b/.test(lowerFam)) {
-    return { familyForMeasure: fam, familyForCanvas: fam };
+async function rasterizeIframe(iframe, sessionCache, options) {
+  const doc = await getAccessibleIframeDocument(iframe, 3);
+  if (!doc) throw new Error("iframe document not accessible/ready");
+  const { contentWidth, contentHeight, rect } = measureContentBox(iframe);
+  const snap = options?.snap;
+  if (!snap || typeof snap.toPng !== "function") {
+    throw new Error("snapdom.toPng not available in iframe or window");
   }
-  const isSymbols = /\bmaterial\s*symbols\b/.test(lowerFam);
-  if (!isSymbols) {
-    return { familyForMeasure: fam, familyForCanvas: fam };
+  const nested = { ...options, scale: 1 };
+  const unpin = pinIframeViewport(doc, contentWidth, contentHeight);
+  let imgEl;
+  try {
+    imgEl = await snap.toPng(doc.documentElement, nested);
+  } finally {
+    unpin();
   }
-  const FILL = axes && (axes.FILL ?? axes.fill);
-  let style = "outlined";
-  if (/\brounded\b/.test(cls) || /\bround\b/.test(cls)) style = "rounded";
-  else if (/\bsharp\b/.test(cls)) style = "sharp";
-  else if (/\boutlined\b/.test(cls)) style = "outlined";
-  const filled = FILL === 1;
-  let pick = null;
-  if (filled) {
-    if (style === "outlined" && ICON_FONT_URLS.materialIconsFilled) {
-      pick = { url: ICON_FONT_URLS.materialIconsFilled, alias: "snapdom-mi-filled" };
-    } else if (style === "rounded" && ICON_FONT_URLS.materialIconsRound) {
-      pick = { url: ICON_FONT_URLS.materialIconsRound, alias: "snapdom-mi-round" };
-    } else if (style === "sharp" && ICON_FONT_URLS.materialIconsSharp) {
-      pick = { url: ICON_FONT_URLS.materialIconsSharp, alias: "snapdom-mi-sharp" };
+  imgEl.style.display = "block";
+  imgEl.style.width = `${contentWidth}px`;
+  imgEl.style.height = `${contentHeight}px`;
+  const wrapper = document.createElement("div");
+  sessionCache.nodeMap.set(wrapper, iframe);
+  inlineAllStyles(iframe, wrapper, sessionCache, options);
+  wrapper.style.overflow = "hidden";
+  wrapper.style.display = "block";
+  if (!wrapper.style.width) wrapper.style.width = `${Math.round(rect.width)}px`;
+  if (!wrapper.style.height) wrapper.style.height = `${Math.round(rect.height)}px`;
+  wrapper.appendChild(imgEl);
+  return wrapper;
+}
+var _blobToDataUrlCache = /* @__PURE__ */ new Map();
+async function blobUrlToDataUrl(blobUrl) {
+  if (cache.resource?.has(blobUrl)) return cache.resource.get(blobUrl);
+  if (_blobToDataUrlCache.has(blobUrl)) return _blobToDataUrlCache.get(blobUrl);
+  const p = (async () => {
+    const r = await snapFetch(blobUrl, { as: "dataURL", silent: true });
+    if (!r.ok || typeof r.data !== "string") {
+      throw new Error(`[snapDOM] Failed to read blob URL: ${blobUrl}`);
     }
+    cache.resource?.set(blobUrl, r.data);
+    return r.data;
+  })();
+  _blobToDataUrlCache.set(blobUrl, p);
+  try {
+    const data = await p;
+    _blobToDataUrlCache.set(blobUrl, data);
+    return data;
+  } catch (e) {
+    _blobToDataUrlCache.delete(blobUrl);
+    throw e;
   }
-  if (!pick) {
-    return { familyForMeasure: fam, familyForCanvas: fam };
-  }
-  if (!loadedCanvasFamilies.has(pick.alias)) {
+}
+var BLOB_URL_RE = /\bblob:[^)"'\s]+/g;
+async function replaceBlobUrlsInCssText(cssText) {
+  if (!cssText || cssText.indexOf("blob:") === -1) return cssText;
+  const uniques = Array.from(new Set(cssText.match(BLOB_URL_RE) || []));
+  if (uniques.length === 0) return cssText;
+  let out = cssText;
+  for (const u of uniques) {
     try {
-      const ff = new FontFace(pick.alias, `url(${pick.url})`, { style: "normal", weight: "400" });
-      document.fonts.add(ff);
-      await ff.load();
-      loadedCanvasFamilies.set(pick.alias, true);
+      const d = await blobUrlToDataUrl(u);
+      out = out.split(u).join(d);
     } catch {
-      return { familyForMeasure: fam, familyForCanvas: fam };
     }
   }
-  const quoted = `"${pick.alias}"`;
-  return { familyForMeasure: quoted, familyForCanvas: quoted };
+  return out;
 }
-async function ensureMaterialFontsReady(family = "Material Icons", px = 24) {
-  try {
-    await Promise.all([
-      document.fonts.load(`400 ${px}px "${String(family).replace(/["']/g, "")}"`),
-      document.fonts.ready
-    ]);
-  } catch {
-  }
+function isBlobUrl(u) {
+  return typeof u === "string" && u.startsWith("blob:");
 }
-function resolvePaintColor(cs) {
-  let fill = cs.getPropertyValue("-webkit-text-fill-color")?.trim() || "";
-  const isTransparent = /^transparent$/i.test(fill) || /rgba?\(\s*0\s*,\s*0\s*,\s*0\s*,\s*0\s*\)/i.test(fill);
-  if (fill && !isTransparent && fill.toLowerCase() !== "currentcolor") return fill;
-  const c = cs.color?.trim();
+function parseSrcset(srcset) {
+  return (srcset || "").split(",").map((s) => s.trim()).filter(Boolean).map((item) => {
+    const m = item.match(/^(\S+)(\s+.+)?$/);
+    return m ? { url: m[1], desc: m[2] || "" } : null;
+  }).filter(Boolean);
+}
+function stringifySrcset(parts) {
+  return parts.map((p) => p.desc ? `${p.url} ${p.desc.trim()}` : p.url).join(", ");
+}
+async function resolveBlobUrlsInTree(root) {
+  if (!root) return;
+  const imgs = root.querySelectorAll ? root.querySelectorAll("img") : [];
+  for (const img of imgs) {
+    try {
+      const srcAttr = img.getAttribute("src");
+      const effective = srcAttr || img.currentSrc || "";
+      if (isBlobUrl(effective)) {
+        const data = await blobUrlToDataUrl(effective);
+        img.setAttribute("src", data);
+      }
+      const srcset = img.getAttribute("srcset");
+      if (srcset && srcset.includes("blob:")) {
+        const parts = parseSrcset(srcset);
+        let changed = false;
+        for (const p of parts) {
+          if (isBlobUrl(p.url)) {
+            try {
+              p.url = await blobUrlToDataUrl(p.url);
+              changed = true;
+            } catch {
+            }
+          }
+        }
+        if (changed) img.setAttribute("srcset", stringifySrcset(parts));
+      }
+    } catch {
+    }
+  }
+  const svgImages = root.querySelectorAll ? root.querySelectorAll("image") : [];
+  for (const node of svgImages) {
+    try {
+      const XLINK_NS = "http://www.w3.org/1999/xlink";
+      const href = node.getAttribute("href") || node.getAttributeNS?.(XLINK_NS, "href");
+      if (isBlobUrl(href)) {
+        const d = await blobUrlToDataUrl(href);
+        node.setAttribute("href", d);
+        node.removeAttributeNS?.(XLINK_NS, "href");
+      }
+    } catch {
+    }
+  }
+  const styled = root.querySelectorAll ? root.querySelectorAll("[style*='blob:']") : [];
+  for (const el of styled) {
+    try {
+      const styleText = el.getAttribute("style");
+      if (styleText && styleText.includes("blob:")) {
+        const replaced = await replaceBlobUrlsInCssText(styleText);
+        el.setAttribute("style", replaced);
+      }
+    } catch {
+    }
+  }
+  const styleTags = root.querySelectorAll ? root.querySelectorAll("style") : [];
+  for (const s of styleTags) {
+    try {
+      const css = s.textContent || "";
+      if (css.includes("blob:")) {
+        s.textContent = await replaceBlobUrlsInCssText(css);
+      }
+    } catch {
+    }
+  }
+  const urlAttrs = ["poster"];
+  for (const attr of urlAttrs) {
+    const nodes = root.querySelectorAll ? root.querySelectorAll(`[${attr}^='blob:']`) : [];
+    for (const n of nodes) {
+      try {
+        const u = n.getAttribute(attr);
+        if (isBlobUrl(u)) {
+          n.setAttribute(attr, await blobUrlToDataUrl(u));
+        }
+      } catch {
+      }
+    }
+  }
+}
+
+// src/core/clone.js
+async function deepClone(node, sessionCache, options) {
+  if (!node) throw new Error("Invalid node");
+  const clonedAssignedNodes = /* @__PURE__ */ new Set();
+  let pendingSelectValue = null;
+  let pendingTextAreaValue = null;
+  if (node.nodeType === Node.ELEMENT_NODE) {
+    const tag = (node.localName || node.tagName || "").toLowerCase();
+    if (node.id === "snapdom-sandbox" || node.hasAttribute("data-snapdom-sandbox")) {
+      return null;
+    }
+    if (NO_CAPTURE_TAGS.has(tag)) {
+      return null;
+    }
+  }
+  if (node.nodeType === Node.TEXT_NODE) {
+    return node.cloneNode(true);
+  }
+  if (node.nodeType !== Node.ELEMENT_NODE) {
+    return node.cloneNode(true);
+  }
+  if (node.getAttribute("data-capture") === "exclude") {
+    if (options.excludeMode === "hide") {
+      const spacer = document.createElement("div");
+      const rect = node.getBoundingClientRect();
+      spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
+      return spacer;
+    } else if (options.excludeMode === "remove") {
+      return null;
+    }
+  }
+  if (options.exclude && Array.isArray(options.exclude)) {
+    for (const selector of options.exclude) {
+      try {
+        if (node.matches?.(selector)) {
+          if (options.excludeMode === "hide") {
+            const spacer = document.createElement("div");
+            const rect = node.getBoundingClientRect();
+            spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
+            return spacer;
+          } else if (options.excludeMode === "remove") {
+            return null;
+          }
+        }
+      } catch (err) {
+        console.warn(`Invalid selector in exclude option: ${selector}`, err);
+      }
+    }
+  }
+  if (typeof options.filter === "function") {
+    try {
+      if (!options.filter(node)) {
+        if (options.filterMode === "hide") {
+          const spacer = document.createElement("div");
+          const rect = node.getBoundingClientRect();
+          spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
+          return spacer;
+        } else if (options.filterMode === "remove") {
+          return null;
+        }
+      }
+    } catch (err) {
+      console.warn("Error in filter function:", err);
+    }
+  }
+  if (node.tagName === "IFRAME") {
+    let sameOrigin = false;
+    try {
+      sameOrigin = !!(node.contentDocument || node.contentWindow?.document);
+    } catch {
+      sameOrigin = false;
+    }
+    if (sameOrigin) {
+      try {
+        const wrapper = await rasterizeIframe(node, sessionCache, options);
+        return wrapper;
+      } catch (err) {
+        console.warn("[SnapDOM] iframe rasterization failed, fallback:", err);
+      }
+    }
+    if (options.placeholders) {
+      const fallback = document.createElement("div");
+      fallback.style.cssText = `width:${node.offsetWidth}px;height:${node.offsetHeight}px;background-image:repeating-linear-gradient(45deg,#ddd,#ddd 5px,#f9f9f9 5px,#f9f9f9 10px);display:flex;align-items:center;justify-content:center;font-size:12px;color:#555;border:1px solid #aaa;`;
+      inlineAllStyles(node, fallback, sessionCache, options);
+      return fallback;
+    } else {
+      const rect = node.getBoundingClientRect();
+      const spacer = document.createElement("div");
+      spacer.style.cssText = `display:inline-block;width:${rect.width}px;height:${rect.height}px;visibility:hidden;`;
+      inlineAllStyles(node, spacer, sessionCache, options);
+      return spacer;
+    }
+  }
+  if (node.getAttribute("data-capture") === "placeholder") {
+    const clone2 = node.cloneNode(false);
+    sessionCache.nodeMap.set(clone2, node);
+    inlineAllStyles(node, clone2, sessionCache, options);
+    const placeholder = document.createElement("div");
+    placeholder.textContent = node.getAttribute("data-placeholder-text") || "";
+    placeholder.style.cssText = "color:#666;font-size:12px;text-align:center;line-height:1.4;padding:0.5em;box-sizing:border-box;";
+    clone2.appendChild(placeholder);
+    return clone2;
+  }
+  if (node.tagName === "CANVAS") {
+    let url = "";
+    try {
+      const ctx = node.getContext("2d", { willReadFrequently: true });
+      try {
+        ctx && ctx.getImageData(0, 0, 1, 1);
+      } catch {
+      }
+      await new Promise((r) => requestAnimationFrame(r));
+      url = node.toDataURL("image/png");
+      if (!url || url === "data:,") {
+        try {
+          ctx && ctx.getImageData(0, 0, 1, 1);
+        } catch {
+        }
+        await new Promise((r) => requestAnimationFrame(r));
+        url = node.toDataURL("image/png");
+        if (!url || url === "data:,") {
+          const scratch = document.createElement("canvas");
+          scratch.width = node.width;
+          scratch.height = node.height;
+          const sctx = scratch.getContext("2d");
+          if (sctx) {
+            sctx.drawImage(node, 0, 0);
+            url = scratch.toDataURL("image/png");
+          }
+        }
+      }
+    } catch {
+    }
+    const img = document.createElement("img");
+    try {
+      img.decoding = "sync";
+      img.loading = "eager";
+    } catch {
+    }
+    if (url) img.src = url;
+    img.width = node.width;
+    img.height = node.height;
+    try {
+      const cs = getComputedStyle(node);
+      if (cs.width) img.style.width = cs.width;
+      if (cs.height) img.style.height = cs.height;
+    } catch {
+    }
+    sessionCache.nodeMap.set(img, node);
+    inlineAllStyles(node, img, sessionCache, options);
+    return img;
+  }
+  let clone;
+  try {
+    clone = node.cloneNode(false);
+    resolveCSSVars(node, clone);
+    sessionCache.nodeMap.set(clone, node);
+    if (node.tagName === "IMG") {
+      freezeImgSrcset(node, clone);
+      try {
+        const rect = node.getBoundingClientRect();
+        let w = Math.round(rect.width || 0);
+        let h = Math.round(rect.height || 0);
+        if (!w || !h) {
+          const computed = window.getComputedStyle(node);
+          const cssW = parseFloat(computed.width) || 0;
+          const cssH = parseFloat(computed.height) || 0;
+          const attrW = parseInt(node.getAttribute("width") || "", 10) || 0;
+          const attrH = parseInt(node.getAttribute("height") || "", 10) || 0;
+          const propW = node.width || node.naturalWidth || 0;
+          const propH = node.height || node.naturalHeight || 0;
+          w = Math.round(w || cssW || attrW || propW || 0);
+          h = Math.round(h || cssH || attrH || propH || 0);
+        }
+        if (w) clone.dataset.snapdomWidth = String(w);
+        if (h) clone.dataset.snapdomHeight = String(h);
+      } catch {
+      }
+      try {
+        const authored = node.getAttribute("style") || "";
+        const cs = window.getComputedStyle(node);
+        const usesPercentOrAuto = (prop) => {
+          const a = authored.match(new RegExp(`${prop}\\s*:\\s*([^;]+)`, "i"));
+          const v = a ? a[1].trim() : cs.getPropertyValue(prop);
+          return /%|auto/i.test(String(v || ""));
+        };
+        const w = parseInt(clone.dataset.snapdomWidth || "0", 10);
+        const h = parseInt(clone.dataset.snapdomHeight || "0", 10);
+        const needFreezeW = usesPercentOrAuto("width") || !w;
+        const needFreezeH = usesPercentOrAuto("height") || !h;
+        if (needFreezeW && w) clone.style.width = `${w}px`;
+        if (needFreezeH && h) clone.style.height = `${h}px`;
+        if (w) clone.style.minWidth = `${w}px`;
+        if (h) clone.style.minHeight = `${h}px`;
+      } catch {
+      }
+    }
+  } catch (err) {
+    console.error("[Snapdom] Failed to clone node:", node, err);
+    throw err;
+  }
+  if (node instanceof HTMLTextAreaElement) {
+    const rect = node.getBoundingClientRect();
+    clone.style.width = `${rect.width}px`;
+    clone.style.height = `${rect.height}px`;
+  }
+  if (node instanceof HTMLInputElement) {
+    clone.value = node.value;
+    clone.setAttribute("value", node.value);
+    if (node.checked !== void 0) {
+      clone.checked = node.checked;
+      if (node.checked) clone.setAttribute("checked", "");
+      if (node.indeterminate) clone.indeterminate = node.indeterminate;
+    }
+  }
+  if (node instanceof HTMLSelectElement) {
+    pendingSelectValue = node.value;
+  }
+  if (node instanceof HTMLTextAreaElement) {
+    pendingTextAreaValue = node.value;
+  }
+  inlineAllStyles(node, clone, sessionCache, options);
+  if (node.shadowRoot) {
+    let callback2 = function(child, resolve) {
+      if (child.nodeType === Node.ELEMENT_NODE && child.tagName === "STYLE") {
+        return resolve(null);
+      } else {
+        deepClone(child, sessionCache, options).then((clonedChild) => {
+          resolve(clonedChild || null);
+        }).catch(() => {
+          resolve(null);
+        });
+      }
+    };
+    try {
+      const slots = node.shadowRoot.querySelectorAll("slot");
+      for (const s of slots) {
+        let assigned = [];
+        try {
+          assigned = s.assignedNodes?.({ flatten: true }) || s.assignedNodes?.() || [];
+        } catch {
+          assigned = s.assignedNodes?.() || [];
+        }
+        for (const an of assigned) clonedAssignedNodes.add(an);
+      }
+    } catch {
+    }
+    const scopeId = nextShadowScopeId(sessionCache);
+    const scopeSelector = `[data-sd="${scopeId}"]`;
+    try {
+      clone.setAttribute("data-sd", scopeId);
+    } catch {
+    }
+    const rawCSS = extractShadowCSS(node.shadowRoot);
+    const rewritten = rewriteShadowCSS(rawCSS, scopeSelector);
+    const neededVars = collectCustomPropsFromCSS(rawCSS);
+    const seed = buildSeedCustomPropsRule(node, neededVars, scopeSelector);
+    injectScopedStyle(clone, seed + rewritten, scopeId);
+    const shadowFrag = document.createDocumentFragment();
+    const cloneList2 = await idleCallback(Array.from(node.shadowRoot.childNodes), callback2, options.fast);
+    shadowFrag.append(...cloneList2.filter((clonedChild) => !!clonedChild));
+    clone.appendChild(shadowFrag);
+  }
+  if (node.tagName === "SLOT") {
+    let callback2 = function(child, resolve) {
+      deepClone(child, sessionCache, options).then((clonedChild) => {
+        if (clonedChild) {
+          markSlottedSubtree(clonedChild);
+        }
+        resolve(clonedChild || null);
+      }).catch(() => {
+        resolve(null);
+      });
+    };
+    const assigned = node.assignedNodes?.({ flatten: true }) || [];
+    const nodesToClone = assigned.length > 0 ? assigned : Array.from(node.childNodes);
+    const fragment = document.createDocumentFragment();
+    const cloneList2 = await idleCallback(Array.from(nodesToClone), callback2, options.fast);
+    fragment.append(...cloneList2.filter((clonedChild) => !!clonedChild));
+    return fragment;
+  }
+  function callback(child, resolve) {
+    if (clonedAssignedNodes.has(child)) return resolve(null);
+    deepClone(child, sessionCache, options).then((clonedChild) => {
+      resolve(clonedChild || null);
+    }).catch(() => {
+      resolve(null);
+    });
+  }
+  const cloneList = await idleCallback(Array.from(node.childNodes), callback, options.fast);
+  clone.append(...cloneList.filter((clonedChild) => !!clonedChild));
+  if (pendingSelectValue !== null && clone instanceof HTMLSelectElement) {
+    clone.value = pendingSelectValue;
+    for (const opt of clone.options) {
+      if (opt.value === pendingSelectValue) {
+        opt.setAttribute("selected", "");
+      } else {
+        opt.removeAttribute("selected");
+      }
+    }
+  }
+  if (pendingTextAreaValue !== null && clone instanceof HTMLTextAreaElement) {
+    clone.textContent = pendingTextAreaValue;
+  }
+  return clone;
+}
+
+// src/modules/pseudo.js
+init_utils();
+
+// src/modules/fonts.js
+init_helpers();
+init_cache();
+
+// src/modules/iconFonts.js
+var defaultIconFonts = [
+  // /uicons/i,
+  /font\s*awesome/i,
+  /material\s*icons/i,
+  /ionicons/i,
+  /glyphicons/i,
+  /feather/i,
+  /bootstrap\s*icons/i,
+  /remix\s*icons/i,
+  /heroicons/i,
+  /layui/i,
+  /lucide/i
+];
+var ICON_FONT_URLS = Object.assign({
+  materialIconsFilled: "https://fonts.gstatic.com/s/materialicons/v48/flUhRq6tzZclQEJ-Vdg-IuiaDsNcIhQ8tQ.woff2",
+  materialIconsOutlined: "https://fonts.gstatic.com/s/materialiconsoutlined/v110/gok-H7zzDkdnRel8-DQ6KAXJ69wP1tGnf4ZGhUcel5euIg.woff2",
+  materialIconsRound: "https://fonts.gstatic.com/s/materialiconsround/v109/LDItaoyNOAY6Uewc665JcIzCKsKc_M9flwmPq_HTTw.woff2",
+  materialIconsSharp: "https://fonts.gstatic.com/s/materialiconssharp/v110/oPWQ_lt5nv4pWNJpghLP75WiFR4kLh3kvmvRImcycg.woff2"
+}, typeof window !== "undefined" && window.__SNAPDOM_ICON_FONTS__ || {});
+var userIconFonts = [];
+function extendIconFonts(fonts) {
+  const list = Array.isArray(fonts) ? fonts : [fonts];
+  for (const f of list) {
+    if (f instanceof RegExp) userIconFonts.push(f);
+    else if (typeof f === "string") userIconFonts.push(new RegExp(f, "i"));
+    else console.warn("[snapdom] Ignored invalid iconFont value:", f);
+  }
+}
+function isIconFont2(input) {
+  const text = typeof input === "string" ? input : "";
+  const candidates = [...defaultIconFonts, ...userIconFonts];
+  for (const rx of candidates) {
+    if (rx instanceof RegExp && rx.test(text)) return true;
+  }
+  if (/icon/i.test(text) || /glyph/i.test(text) || /symbols/i.test(text) || /feather/i.test(text) || /fontawesome/i.test(text)) return true;
+  return false;
+}
+function isMaterialFamily(family = "") {
+  const s = String(family).toLowerCase();
+  return /\bmaterial\s*icons\b/.test(s) || /\bmaterial\s*symbols\b/.test(s);
+}
+var loadedCanvasFamilies = /* @__PURE__ */ new Map();
+function parseAxes(variation = "") {
+  const out = /* @__PURE__ */ Object.create(null);
+  const v = String(variation || "");
+  const rx = /['"]?\s*([A-Za-z]{3,4})\s*['"]?\s*([+-]?\d+(?:\.\d+)?)\s*/g;
+  let m;
+  while (m = rx.exec(v)) out[m[1].toUpperCase()] = Number(m[2]);
+  return out;
+}
+async function ensureLigatureCanvasFont(cssFamily, className, axes) {
+  const fam = String(cssFamily || "");
+  const lowerFam = fam.toLowerCase();
+  const cls = String(className || "").toLowerCase();
+  if (/\bmaterial\s*icons\b/.test(lowerFam) && !/\bsymbols\b/.test(lowerFam)) {
+    return { familyForMeasure: fam, familyForCanvas: fam };
+  }
+  const isSymbols = /\bmaterial\s*symbols\b/.test(lowerFam);
+  if (!isSymbols) {
+    return { familyForMeasure: fam, familyForCanvas: fam };
+  }
+  const FILL = axes && (axes.FILL ?? axes.fill);
+  let style = "outlined";
+  if (/\brounded\b/.test(cls) || /\bround\b/.test(cls)) style = "rounded";
+  else if (/\bsharp\b/.test(cls)) style = "sharp";
+  else if (/\boutlined\b/.test(cls)) style = "outlined";
+  const filled = FILL === 1;
+  let pick = null;
+  if (filled) {
+    if (style === "outlined" && ICON_FONT_URLS.materialIconsFilled) {
+      pick = { url: ICON_FONT_URLS.materialIconsFilled, alias: "snapdom-mi-filled" };
+    } else if (style === "rounded" && ICON_FONT_URLS.materialIconsRound) {
+      pick = { url: ICON_FONT_URLS.materialIconsRound, alias: "snapdom-mi-round" };
+    } else if (style === "sharp" && ICON_FONT_URLS.materialIconsSharp) {
+      pick = { url: ICON_FONT_URLS.materialIconsSharp, alias: "snapdom-mi-sharp" };
+    }
+  }
+  if (!pick) {
+    return { familyForMeasure: fam, familyForCanvas: fam };
+  }
+  if (!loadedCanvasFamilies.has(pick.alias)) {
+    try {
+      const ff = new FontFace(pick.alias, `url(${pick.url})`, { style: "normal", weight: "400" });
+      document.fonts.add(ff);
+      await ff.load();
+      loadedCanvasFamilies.set(pick.alias, true);
+    } catch {
+      return { familyForMeasure: fam, familyForCanvas: fam };
+    }
+  }
+  const quoted = `"${pick.alias}"`;
+  return { familyForMeasure: quoted, familyForCanvas: quoted };
+}
+async function ensureMaterialFontsReady(family = "Material Icons", px = 24) {
+  try {
+    await Promise.all([
+      document.fonts.load(`400 ${px}px "${String(family).replace(/["']/g, "")}"`),
+      document.fonts.ready
+    ]);
+  } catch {
+  }
+}
+function resolvePaintColor(cs) {
+  let fill = cs.getPropertyValue("-webkit-text-fill-color")?.trim() || "";
+  const isTransparent = /^transparent$/i.test(fill) || /rgba?\(\s*0\s*,\s*0\s*,\s*0\s*,\s*0\s*\)/i.test(fill);
+  if (fill && !isTransparent && fill.toLowerCase() !== "currentcolor") return fill;
+  const c = cs.color?.trim();
   return c && c !== "inherit" ? c : "#000";
 }
 async function materialIconToImage(ligatureText, {
@@ -1630,6 +2142,7 @@ async function ligatureIconToImage(cloneRoot, sourceRoot) {
 }
 
 // src/modules/fonts.js
+init_snapFetch();
 async function iconToImage(unicodeChar, fontFamily, fontWeight, fontSize = 32, color = "#000") {
   fontFamily = fontFamily.replace(/^['"]+|['"]+$/g, "");
   const dpr = window.devicePixelRatio || 1;
@@ -2115,6 +2628,18 @@ async function embedCustomFonts({
         if (nearWeight && sOk && tOk) return true;
       }
     }
+    if (!faceIsRange && ss.kind === "normal") {
+      const hasItalicRequest = need.some((r) => normStyle(r.s) !== "normal");
+      if (hasItalicRequest) {
+        for (const r of need) {
+          const nearWeight = Math.abs(faceSingleW - r.w) <= 300;
+          const stretchOK = r.st >= ts.min && r.st <= ts.max;
+          if (nearWeight && stretchOK) {
+            return true;
+          }
+        }
+      }
+    }
     return false;
   }
   const simpleExcluder = buildSimpleExcluder(exclude);
@@ -2399,6 +2924,7 @@ async function ensureFontsReady(families, warmupRepetitions = 2) {
 }
 
 // src/modules/counter.js
+init_cache();
 function hasCounters(input) {
   return /\bcounter\s*\(|\bcounters\s*\(/.test(input || "");
 }
@@ -2595,6 +3121,154 @@ function resolveCountersInContent(raw, node, ctx) {
 }
 
 // src/modules/pseudo.js
+init_snapFetch();
+init_cache();
+var __preflightMemo = /* @__PURE__ */ new WeakMap();
+var CSS_RULE_SCAN_BUDGET = 300;
+function preflightWithFp(doc, sessionCache) {
+  const fp = styleFingerprint(doc);
+  if (!sessionCache) return shouldProcessPseudos(doc);
+  if (sessionCache.__pseudoPreflightFp !== fp) {
+    sessionCache.__pseudoPreflight = shouldProcessPseudos(doc);
+    sessionCache.__pseudoPreflightFp = fp;
+  }
+  return !!sessionCache.__pseudoPreflight;
+}
+function safeRules(sheet) {
+  try {
+    return sheet && sheet.cssRules ? sheet.cssRules : null;
+  } catch {
+    return null;
+  }
+}
+function styleFingerprint(doc) {
+  const nodes = doc.querySelectorAll('style,link[rel~="stylesheet"]');
+  let fp = `n:${nodes.length}|`;
+  let totalRules = 0;
+  for (let i = 0; i < nodes.length; i++) {
+    const n = nodes[i];
+    if (n.tagName === "STYLE") {
+      const len = n.textContent ? n.textContent.length : 0;
+      fp += `S${len}|`;
+      const sheet = (
+        /** @type {HTMLStyleElement} */
+        n.sheet
+      );
+      const rules = sheet ? safeRules(sheet) : null;
+      if (rules) totalRules += rules.length;
+    } else {
+      const href = n.getAttribute("href") || "";
+      const media = n.getAttribute("media") || "all";
+      fp += `L${href}|m:${media}|`;
+      const sheet = (
+        /** @type {HTMLLinkElement} */
+        n.sheet
+      );
+      const rules = sheet ? safeRules(sheet) : null;
+      if (rules) totalRules += rules.length;
+    }
+  }
+  const ass = (
+    /** @type {any} */
+    doc.adoptedStyleSheets
+  );
+  fp += `ass:${Array.isArray(ass) ? ass.length : 0}|tr:${totalRules}`;
+  return fp;
+}
+function sheetHasNeedles(sheet, needles, state) {
+  const rules = safeRules(sheet);
+  if (!rules) return false;
+  for (let i = 0; i < rules.length; i++) {
+    if (state.budget <= 0) return false;
+    const rule = rules[i];
+    const css = rule && rule.cssText ? rule.cssText : "";
+    state.budget--;
+    for (const k of needles) {
+      if (css.includes(k)) return true;
+    }
+    if (rule && rule.cssRules && rule.cssRules.length) {
+      for (let j = 0; j < rule.cssRules.length && state.budget > 0; j++) {
+        const inner = rule.cssRules[j];
+        const innerCss = inner && inner.cssText ? inner.cssText : "";
+        state.budget--;
+        for (const k of needles) {
+          if (innerCss.includes(k)) return true;
+        }
+      }
+    }
+    if (state.budget <= 0) return false;
+  }
+  return false;
+}
+function shouldProcessPseudos(doc = document) {
+  const fp = styleFingerprint(doc);
+  const memo = __preflightMemo.get(doc);
+  if (memo && memo.fingerprint === fp) return memo.result;
+  const NEEDLES = [
+    // double-colon
+    "::before",
+    "::after",
+    "::first-letter",
+    // single-colon robustness
+    ":before",
+    ":after",
+    ":first-letter",
+    // counters
+    "counter(",
+    "counters(",
+    "counter-increment",
+    "counter-reset"
+  ];
+  const styleEls = doc.querySelectorAll("style");
+  for (let i = 0; i < styleEls.length; i++) {
+    const t = styleEls[i].textContent || "";
+    for (const k of NEEDLES) if (t.includes(k)) {
+      __preflightMemo.set(doc, { fingerprint: fp, result: true });
+      return true;
+    }
+  }
+  const ass = (
+    /** @type {any} */
+    doc.adoptedStyleSheets
+  );
+  if (Array.isArray(ass) && ass.length) {
+    const state = { budget: CSS_RULE_SCAN_BUDGET };
+    try {
+      for (const sheet of ass) {
+        if (sheetHasNeedles(sheet, NEEDLES, state)) {
+          __preflightMemo.set(doc, { fingerprint: fp, result: true });
+          return true;
+        }
+      }
+    } catch {
+    }
+  }
+  {
+    const nodes = doc.querySelectorAll('style,link[rel~="stylesheet"]');
+    const state = { budget: CSS_RULE_SCAN_BUDGET };
+    for (let i = 0; i < nodes.length && state.budget > 0; i++) {
+      const n = nodes[i];
+      let sheet = null;
+      if (n.tagName === "STYLE") {
+        sheet = /** @type {HTMLStyleElement} */
+        n.sheet || null;
+      } else {
+        sheet = /** @type {HTMLLinkElement} */
+        n.sheet || null;
+      }
+      if (sheet && sheetHasNeedles(sheet, NEEDLES, state)) {
+        __preflightMemo.set(doc, { fingerprint: fp, result: true });
+        return true;
+      }
+    }
+  }
+  if (doc.querySelector('[style*="counter("], [style*="counters("]')) {
+    __preflightMemo.set(doc, { fingerprint: fp, result: true });
+    return true;
+  }
+  __preflightMemo.set(doc, { fingerprint: fp, result: false });
+  return false;
+}
 var __siblingCounters = /* @__PURE__ */ new WeakMap();
 var __pseudoEpoch = -1;
 function unquoteDoubleStrings2(s) {
@@ -2693,6 +3367,10 @@ function resolvePseudoContentAndIncs(node, pseudo, baseCtx) {
 }
 async function inlinePseudoElements(source, clone, sessionCache, options) {
   if (!(source instanceof Element) || !(clone instanceof Element)) return;
+  const doc = source.ownerDocument || document;
+  if (!preflightWithFp(doc, sessionCache)) {
+    return;
+  }
   const epoch = cache?.session?.__counterEpoch ?? 0;
   if (__pseudoEpoch !== epoch) {
     __siblingCounters = /* @__PURE__ */ new WeakMap();
@@ -2709,7 +3387,7 @@ async function inlinePseudoElements(source, clone, sessionCache, options) {
   for (const pseudo of ["::before", "::after", "::first-letter"]) {
     try {
       const style = getStyle(source, pseudo);
-      if (!style || typeof style[Symbol.iterator] !== "function") continue;
+      if (!style) continue;
       const isEmptyPseudo = style.content === "none" && style.backgroundImage === "none" && style.backgroundColor === "transparent" && (style.borderStyle === "none" || parseFloat(style.borderWidth) === 0) && (!style.transform || style.transform === "none") && style.display === "inline";
       if (isEmptyPseudo) continue;
       if (pseudo === "::first-letter") {
@@ -2736,7 +3414,8 @@ async function inlinePseudoElements(source, clone, sessionCache, options) {
         clone.insertBefore(span, restNode);
         continue;
       }
-      const rawContent = style.content;
+      const rawContent = style.content ?? "";
+      const isNoExplicitContent = rawContent === "" || rawContent === "none" || rawContent === "normal";
       const { text: cleanContent, incs } = resolvePseudoContentAndIncs(source, pseudo, counterCtx);
       const bg = style.backgroundImage;
       const bgColor = style.backgroundColor;
@@ -2748,7 +3427,7 @@ async function inlinePseudoElements(source, clone, sessionCache, options) {
       const borderWidth = parseFloat(style.borderWidth);
       const transform = style.transform;
       const isIconFont22 = isIconFont2(fontFamily);
-      const hasExplicitContent = rawContent !== "none" && cleanContent !== "";
+      const hasExplicitContent = !isNoExplicitContent && cleanContent !== "";
       const hasBg = bg && bg !== "none";
       const hasBgColor = bgColor && bgColor !== "transparent" && bgColor !== "rgba(0, 0, 0, 0)";
       const hasBorder = borderStyle && borderStyle !== "none" && borderWidth > 0;
@@ -2770,8 +3449,6 @@ async function inlinePseudoElements(source, clone, sessionCache, options) {
       }
       const pseudoEl = document.createElement("span");
       pseudoEl.dataset.snapdomPseudo = pseudo;
-      pseudoEl.style.display = "inline";
-      pseudoEl.style.verticalAlign = "baseline";
       pseudoEl.style.pointerEvents = "none";
       const snapshot = snapshotComputedStyle(style);
       const key = getStyleKey(snapshot, "span");
@@ -2877,31 +3554,55 @@ function inlineExternalDefsAndSymbols(element, lookupRoot) {
     "marker-end"
   ];
   const cssEscape = (s) => window.CSS && CSS.escape ? CSS.escape(s) : s.replace(/[^a-zA-Z0-9_-]/g, "\\$&");
+  const XLINK_NS = "http://www.w3.org/1999/xlink";
+  const getHrefAttr = (el) => {
+    if (!el || !el.getAttribute) return null;
+    let href = el.getAttribute("href") || el.getAttribute("xlink:href") || (typeof el.getAttributeNS === "function" ? el.getAttributeNS(XLINK_NS, "href") : null);
+    if (href) return href;
+    const attrs = el.attributes;
+    if (!attrs) return null;
+    for (let i = 0; i < attrs.length; i++) {
+      const a = attrs[i];
+      if (!a || !a.name) continue;
+      if (a.name === "href") return a.value;
+      const idx = a.name.indexOf(":");
+      if (idx !== -1 && a.name.slice(idx + 1) === "href") {
+        return a.value;
+      }
+    }
+    return null;
+  };
   const globalExistingIds = new Set(
     Array.from(element.querySelectorAll("[id]")).map((n) => n.id)
   );
   const neededIds = /* @__PURE__ */ new Set();
   let sawAnyReference = false;
-  const addUrlIdsFromValue = (val) => {
+  const addUrlIdsFromValue = (val, queueForResolve = null) => {
     if (!val) return;
     URL_ID_RE.lastIndex = 0;
     let m;
     while (m = URL_ID_RE.exec(val)) {
       sawAnyReference = true;
       const id = (m[1] || "").trim();
-      if (id && !globalExistingIds.has(id)) neededIds.add(id);
+      if (!id) continue;
+      if (!globalExistingIds.has(id)) {
+        neededIds.add(id);
+        if (queueForResolve && !queueForResolve.has(id)) {
+          queueForResolve.add(id);
+        }
+      }
     }
   };
   const collectReferencesInSvg = (rootSvg) => {
-    const uses = rootSvg.querySelectorAll('use[href^="#"], use[xlink\\:href^="#"]');
+    const uses = rootSvg.querySelectorAll("use");
     for (const u of uses) {
-      const href = u.getAttribute("href") || u.getAttribute("xlink:href");
+      const href = getHrefAttr(u);
       if (!href || !href.startsWith("#")) continue;
       sawAnyReference = true;
       const id = href.slice(1).trim();
       if (id && !globalExistingIds.has(id)) neededIds.add(id);
     }
-    let query = '*[style*="url("],*[fill^="url("], *[stroke^="url("],*[filter^="url("], *[clip-path^="url("],*[mask^="url("],*[marker^="url("], *[marker-start^="url("],*[marker-mid^="url("], *[marker-end^="url("]';
+    const query = '*[style*="url("],*[fill^="url("], *[stroke^="url("],*[filter^="url("],*[clip-path^="url("],*[mask^="url("],*[marker^="url("],*[marker-start^="url("],*[marker-mid^="url("],*[marker-end^="url("]';
     const candidates = rootSvg.querySelectorAll(query);
     for (const el of candidates) {
       addUrlIdsFromValue(el.getAttribute("style") || "");
@@ -2952,21 +3653,26 @@ function inlineExternalDefsAndSymbols(element, lookupRoot) {
     globalExistingIds.add(id);
     const walk = [clone, ...clone.querySelectorAll("*")];
     for (const node of walk) {
-      const h = node.getAttribute?.("href") || node.getAttribute?.("xlink:href");
-      if (h && h.startsWith("#")) {
-        const ref = h.slice(1).trim();
-        if (ref && !globalExistingIds.has(ref) && !inlined.has(ref)) queued.add(ref);
+      const href = getHrefAttr(node);
+      if (href && href.startsWith("#")) {
+        const ref = href.slice(1).trim();
+        if (ref && !globalExistingIds.has(ref) && !inlined.has(ref)) {
+          queued.add(ref);
+        }
       }
       const style = node.getAttribute?.("style") || "";
-      if (style) addUrlIdsFromValue(style);
+      if (style) addUrlIdsFromValue(style, queued);
       for (const a of URL_ATTRS) {
         const v = node.getAttribute?.(a);
-        if (v) addUrlIdsFromValue(v);
+        if (v) addUrlIdsFromValue(v, queued);
       }
     }
   }
 }
 
+// src/core/prepare.js
+init_cache();
+
 // src/modules/changeCSS.js
 function freezeSticky(originalRoot, cloneRoot) {
   if (!originalRoot || !cloneRoot) return;
@@ -3063,6 +3769,20 @@ function _childrenWithoutPlaceholders(el, phAttr) {
   return out;
 }
 
+// src/utils/prepare.helpers.js
+function stabilizeLayout(element) {
+  const style = getComputedStyle(element);
+  const outlineStyle = style.outlineStyle;
+  const outlineWidth = style.outlineWidth;
+  const borderStyle = style.borderStyle;
+  const borderWidth = style.borderWidth;
+  const outlineVisible = outlineStyle !== "none" && parseFloat(outlineWidth) > 0;
+  const borderAbsent = borderStyle === "none" || parseFloat(borderWidth) === 0;
+  if (outlineVisible && borderAbsent) {
+    element.style.border = `${outlineWidth} solid transparent`;
+  }
+}
+
 // src/core/prepare.js
 async function prepareClone(element, options = {}) {
   const sessionCache = {
@@ -3091,218 +3811,92 @@ async function prepareClone(element, options = {}) {
     console.warn("inlinePseudoElements failed:", e);
   }
   await resolveBlobUrlsInTree(clone);
-  try {
-    const styleNodes = clone.querySelectorAll("style[data-sd]");
-    for (const s of styleNodes) {
-      shadowScopedCSS += s.textContent || "";
-      s.remove();
-    }
-  } catch {
-  }
-  const keyToClass = generateCSSClasses(sessionCache.styleMap);
-  classCSS = Array.from(keyToClass.entries()).map(([key, className]) => `.${className}{${key}}`).join("");
-  classCSS = shadowScopedCSS + classCSS;
-  for (const [node, key] of sessionCache.styleMap.entries()) {
-    if (node.tagName === "STYLE") continue;
-    if (node.getRootNode && node.getRootNode() instanceof ShadowRoot) {
-      node.setAttribute("style", key.replace(/;/g, "; "));
-      continue;
-    }
-    const className = keyToClass.get(key);
-    if (className) node.classList.add(className);
-    const bgImage = node.style?.backgroundImage;
-    const hasIcon = node.dataset?.snapdomHasIcon;
-    if (bgImage && bgImage !== "none") node.style.backgroundImage = bgImage;
-    if (hasIcon) {
-      node.style.verticalAlign = "middle";
-      node.style.display = "inline";
-    }
-  }
-  for (const [cloneNode, originalNode] of sessionCache.nodeMap.entries()) {
-    const scrollX = originalNode.scrollLeft;
-    const scrollY = originalNode.scrollTop;
-    const hasScroll = scrollX || scrollY;
-    if (hasScroll && cloneNode instanceof HTMLElement) {
-      cloneNode.style.overflow = "hidden";
-      cloneNode.style.scrollbarWidth = "none";
-      cloneNode.style.msOverflowStyle = "none";
-      const inner = document.createElement("div");
-      inner.style.transform = `translate(${-scrollX}px, ${-scrollY}px)`;
-      inner.style.willChange = "transform";
-      inner.style.display = "inline-block";
-      inner.style.width = "100%";
-      while (cloneNode.firstChild) {
-        inner.appendChild(cloneNode.firstChild);
-      }
-      cloneNode.appendChild(inner);
-    }
-  }
-  const contentRoot = clone instanceof HTMLElement && clone.firstElementChild instanceof HTMLElement ? clone.firstElementChild : clone;
-  freezeSticky(element, contentRoot);
-  if (element === sessionCache.nodeMap.get(clone)) {
-    const computed = sessionCache.styleCache.get(element) || window.getComputedStyle(element);
-    sessionCache.styleCache.set(element, computed);
-    const transform = stripTranslate(computed.transform);
-    clone.style.margin = "0";
-    clone.style.top = "auto";
-    clone.style.left = "auto";
-    clone.style.right = "auto";
-    clone.style.bottom = "auto";
-    clone.style.animation = "none";
-    clone.style.transition = "none";
-    clone.style.willChange = "auto";
-    clone.style.float = "none";
-    clone.style.clear = "none";
-    clone.style.transform = transform || "";
-  }
-  for (const [cloneNode, originalNode] of sessionCache.nodeMap.entries()) {
-    if (originalNode.tagName === "PRE") {
-      cloneNode.style.marginTop = "0";
-      cloneNode.style.marginBlockStart = "0";
-    }
-  }
-  return { clone, classCSS, styleCache: sessionCache.styleCache };
-}
-function stabilizeLayout(element) {
-  const style = getComputedStyle(element);
-  const outlineStyle = style.outlineStyle;
-  const outlineWidth = style.outlineWidth;
-  const borderStyle = style.borderStyle;
-  const borderWidth = style.borderWidth;
-  const outlineVisible = outlineStyle !== "none" && parseFloat(outlineWidth) > 0;
-  const borderAbsent = borderStyle === "none" || parseFloat(borderWidth) === 0;
-  if (outlineVisible && borderAbsent) {
-    element.style.border = `${outlineWidth} solid transparent`;
-  }
-}
-var _blobToDataUrlCache = /* @__PURE__ */ new Map();
-async function blobUrlToDataUrl(blobUrl) {
-  if (cache.resource?.has(blobUrl)) return cache.resource.get(blobUrl);
-  if (_blobToDataUrlCache.has(blobUrl)) return _blobToDataUrlCache.get(blobUrl);
-  const p = (async () => {
-    const r = await snapFetch(blobUrl, { as: "dataURL", silent: true });
-    if (!r.ok || typeof r.data !== "string") {
-      throw new Error(`[snapDOM] Failed to read blob URL: ${blobUrl}`);
-    }
-    cache.resource?.set(blobUrl, r.data);
-    return r.data;
-  })();
-  _blobToDataUrlCache.set(blobUrl, p);
-  try {
-    const data = await p;
-    _blobToDataUrlCache.set(blobUrl, data);
-    return data;
-  } catch (e) {
-    _blobToDataUrlCache.delete(blobUrl);
-    throw e;
-  }
-}
-var BLOB_URL_RE = /\bblob:[^)"'\s]+/g;
-async function replaceBlobUrlsInCssText(cssText) {
-  if (!cssText || cssText.indexOf("blob:") === -1) return cssText;
-  const uniques = Array.from(new Set(cssText.match(BLOB_URL_RE) || []));
-  if (uniques.length === 0) return cssText;
-  let out = cssText;
-  for (const u of uniques) {
-    try {
-      const d = await blobUrlToDataUrl(u);
-      out = out.split(u).join(d);
-    } catch {
-    }
-  }
-  return out;
-}
-function isBlobUrl(u) {
-  return typeof u === "string" && u.startsWith("blob:");
-}
-function parseSrcset(srcset) {
-  return (srcset || "").split(",").map((s) => s.trim()).filter(Boolean).map((item) => {
-    const m = item.match(/^(\S+)(\s+.+)?$/);
-    return m ? { url: m[1], desc: m[2] || "" } : null;
-  }).filter(Boolean);
-}
-function stringifySrcset(parts) {
-  return parts.map((p) => p.desc ? `${p.url} ${p.desc.trim()}` : p.url).join(", ");
-}
-async function resolveBlobUrlsInTree(root) {
-  if (!root) return;
-  const imgs = root.querySelectorAll ? root.querySelectorAll("img") : [];
-  for (const img of imgs) {
-    try {
-      const srcAttr = img.getAttribute("src");
-      const effective = srcAttr || img.currentSrc || "";
-      if (isBlobUrl(effective)) {
-        const data = await blobUrlToDataUrl(effective);
-        img.setAttribute("src", data);
-      }
-      const srcset = img.getAttribute("srcset");
-      if (srcset && srcset.includes("blob:")) {
-        const parts = parseSrcset(srcset);
-        let changed = false;
-        for (const p of parts) {
-          if (isBlobUrl(p.url)) {
-            try {
-              p.url = await blobUrlToDataUrl(p.url);
-              changed = true;
-            } catch {
-            }
-          }
-        }
-        if (changed) img.setAttribute("srcset", stringifySrcset(parts));
-      }
-    } catch {
-    }
-  }
-  const svgImages = root.querySelectorAll ? root.querySelectorAll("image") : [];
-  for (const node of svgImages) {
-    try {
-      const XLINK_NS = "http://www.w3.org/1999/xlink";
-      const href = node.getAttribute("href") || node.getAttributeNS?.(XLINK_NS, "href");
-      if (isBlobUrl(href)) {
-        const d = await blobUrlToDataUrl(href);
-        node.setAttribute("href", d);
-        node.removeAttributeNS?.(XLINK_NS, "href");
-      }
-    } catch {
+  try {
+    const styleNodes = clone.querySelectorAll("style[data-sd]");
+    for (const s of styleNodes) {
+      shadowScopedCSS += s.textContent || "";
+      s.remove();
     }
+  } catch {
   }
-  const styled = root.querySelectorAll ? root.querySelectorAll("[style*='blob:']") : [];
-  for (const el of styled) {
-    try {
-      const styleText = el.getAttribute("style");
-      if (styleText && styleText.includes("blob:")) {
-        const replaced = await replaceBlobUrlsInCssText(styleText);
-        el.setAttribute("style", replaced);
-      }
-    } catch {
+  const keyToClass = generateCSSClasses(sessionCache.styleMap);
+  classCSS = Array.from(keyToClass.entries()).map(([key, className]) => `.${className}{${key}}`).join("");
+  classCSS = shadowScopedCSS + classCSS;
+  for (const [node, key] of sessionCache.styleMap.entries()) {
+    if (node.tagName === "STYLE") continue;
+    if (node.getRootNode && node.getRootNode() instanceof ShadowRoot) {
+      node.setAttribute("style", key.replace(/;/g, "; "));
+      continue;
+    }
+    const className = keyToClass.get(key);
+    if (className) node.classList.add(className);
+    const bgImage = node.style?.backgroundImage;
+    const hasIcon = node.dataset?.snapdomHasIcon;
+    if (bgImage && bgImage !== "none") node.style.backgroundImage = bgImage;
+    if (hasIcon) {
+      node.style.verticalAlign = "middle";
+      node.style.display = "inline";
     }
   }
-  const styleTags = root.querySelectorAll ? root.querySelectorAll("style") : [];
-  for (const s of styleTags) {
-    try {
-      const css = s.textContent || "";
-      if (css.includes("blob:")) {
-        s.textContent = await replaceBlobUrlsInCssText(css);
+  for (const [cloneNode, originalNode] of sessionCache.nodeMap.entries()) {
+    const scrollX = originalNode.scrollLeft;
+    const scrollY = originalNode.scrollTop;
+    const hasScroll = scrollX || scrollY;
+    if (hasScroll && cloneNode instanceof HTMLElement) {
+      cloneNode.style.overflow = "hidden";
+      cloneNode.style.scrollbarWidth = "none";
+      cloneNode.style.msOverflowStyle = "none";
+      const inner = document.createElement("div");
+      inner.style.transform = `translate(${-scrollX}px, ${-scrollY}px)`;
+      inner.style.willChange = "transform";
+      inner.style.display = "inline-block";
+      inner.style.width = "100%";
+      while (cloneNode.firstChild) {
+        inner.appendChild(cloneNode.firstChild);
       }
-    } catch {
+      cloneNode.appendChild(inner);
     }
   }
-  const urlAttrs = ["poster"];
-  for (const attr of urlAttrs) {
-    const nodes = root.querySelectorAll ? root.querySelectorAll(`[${attr}^='blob:']`) : [];
-    for (const n of nodes) {
-      try {
-        const u = n.getAttribute(attr);
-        if (isBlobUrl(u)) {
-          n.setAttribute(attr, await blobUrlToDataUrl(u));
-        }
-      } catch {
-      }
+  const contentRoot = clone instanceof HTMLElement && clone.firstElementChild instanceof HTMLElement ? clone.firstElementChild : clone;
+  freezeSticky(element, contentRoot);
+  if (element === sessionCache.nodeMap.get(clone)) {
+    const computed = sessionCache.styleCache.get(element) || window.getComputedStyle(element);
+    sessionCache.styleCache.set(element, computed);
+    const transform = stripTranslate(computed.transform);
+    clone.style.margin = "0";
+    clone.style.top = "auto";
+    clone.style.left = "auto";
+    clone.style.right = "auto";
+    clone.style.bottom = "auto";
+    clone.style.animation = "none";
+    clone.style.transition = "none";
+    clone.style.willChange = "auto";
+    clone.style.float = "none";
+    clone.style.clear = "none";
+    clone.style.transform = transform || "";
+  }
+  for (const [cloneNode, originalNode] of sessionCache.nodeMap.entries()) {
+    if (originalNode.tagName === "PRE") {
+      cloneNode.style.marginTop = "0";
+      cloneNode.style.marginBlockStart = "0";
     }
   }
+  return { clone, classCSS, styleCache: sessionCache.styleCache };
 }
 
 // src/modules/images.js
+init_snapFetch();
+function extractImageDimensions(img) {
+  const dsW = parseInt(img.dataset?.snapdomWidth || "", 10) || 0;
+  const dsH = parseInt(img.dataset?.snapdomHeight || "", 10) || 0;
+  const attrW = parseInt(img.getAttribute("width") || "", 10) || 0;
+  const attrH = parseInt(img.getAttribute("height") || "", 10) || 0;
+  const styleW = parseFloat(img.style?.width || "") || 0;
+  const styleH = parseFloat(img.style?.height || "") || 0;
+  const w = dsW || styleW || attrW || img.width || img.naturalWidth || 100;
+  const h = dsH || styleH || attrH || img.height || img.naturalHeight || 100;
+  return { width: w, height: h };
+}
 async function inlineImages(clone, options = {}) {
   const imgs = Array.from(clone.querySelectorAll("img"));
   const processImg = async (img) => {
@@ -3321,41 +3915,30 @@ async function inlineImages(clone, options = {}) {
       if (!img.height) img.height = img.naturalHeight || 100;
       return;
     }
+    const { width: fbW, height: fbH } = extractImageDimensions(img);
     const { fallbackURL } = options || {};
     if (fallbackURL) {
       try {
-        const dsW = parseInt(img.dataset?.snapdomWidth || "", 10) || 0;
-        const dsH = parseInt(img.dataset?.snapdomHeight || "", 10) || 0;
-        const attrW = parseInt(img.getAttribute("width") || "", 10) || 0;
-        const attrH = parseInt(img.getAttribute("height") || "", 10) || 0;
-        const styleW = parseFloat(img.style?.width || "") || 0;
-        const styleH = parseFloat(img.style?.height || "") || 0;
-        const fbW = dsW || styleW || attrW || img.width || void 0;
-        const fbH = dsH || styleH || attrH || img.height || void 0;
         const fallbackUrl = typeof fallbackURL === "function" ? await fallbackURL({ width: fbW, height: fbH, src, element: img }) : fallbackURL;
         if (fallbackUrl) {
           const fallbackData = await snapFetch(fallbackUrl, { as: "dataURL", useProxy: options.useProxy });
           img.src = fallbackData.data;
-          if (!img.width && fbW) img.width = fbW;
-          if (!img.height && fbH) img.height = fbH;
-          if (!img.width) img.width = img.naturalWidth || 100;
-          if (!img.height) img.height = img.naturalHeight || 100;
+          if (!img.width) img.width = fbW;
+          if (!img.height) img.height = fbH;
           return;
         }
       } catch {
       }
     }
-    const w = img.width || img.naturalWidth || 100;
-    const h = img.height || img.naturalHeight || 100;
     if (options.placeholders !== false) {
       const fallback = document.createElement("div");
       fallback.style.cssText = [
-        `width:${w}px`,
-        `height:${h}px`,
+        `width:${fbW}px`,
+        `height:${fbH}px`,
         "background:#ccc",
         "display:inline-block",
         "text-align:center",
-        `line-height:${h}px`,
+        `line-height:${fbH}px`,
         "color:#666",
         "font-size:12px",
         "overflow:hidden"
@@ -3364,7 +3947,7 @@ async function inlineImages(clone, options = {}) {
       img.replaceWith(fallback);
     } else {
       const spacer = document.createElement("div");
-      spacer.style.cssText = `display:inline-block;width:${w}px;height:${h}px;visibility:hidden;`;
+      spacer.style.cssText = `display:inline-block;width:${fbW}px;height:${fbH}px;visibility:hidden;`;
       img.replaceWith(spacer);
     }
   };
@@ -3375,6 +3958,7 @@ async function inlineImages(clone, options = {}) {
 }
 
 // src/modules/background.js
+init_utils();
 async function inlineBackgroundImages(source, clone, styleCache, options = {}) {
   const queue = [[source, clone]];
   const URL_PROPS = [
@@ -3472,6 +4056,10 @@ async function inlineBackgroundImages(source, clone, styleCache, options = {}) {
   }
 }
 
+// src/core/capture.js
+init_utils();
+init_cache();
+
 // src/modules/lineClamp.js
 function lineClamp(el) {
   if (!el) return () => {
@@ -3604,7 +4192,7 @@ function attachSessionPlugins(context, localDefs, force = false) {
   return context;
 }
 
-// src/core/capture.js
+// src/utils/capture.helpers.js
 function stripRootShadows(originalEl, cloneRoot) {
   if (!originalEl || !cloneRoot || !cloneRoot.style) return;
   const cs = getComputedStyle(originalEl);
@@ -3633,268 +4221,43 @@ function removeAllComments(root) {
   while (it.nextNode()) toRemove.push(it.currentNode);
   for (const n of toRemove) n.remove();
 }
-function sanitizeAttributesForXHTML(root, opts = {}) {
-  const { stripFrameworkDirectives = true } = opts;
-  const ALLOWED_PREFIXES = /* @__PURE__ */ new Set(["xml", "xlink"]);
-  const walker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT);
-  while (walker.nextNode()) {
-    const el = walker.currentNode;
-    for (const attr of Array.from(el.attributes)) {
-      const name = attr.name;
-      if (name.includes("@")) {
-        el.removeAttribute(name);
-        continue;
-      }
-      if (name.includes(":")) {
-        const prefix = name.split(":", 1)[0];
-        if (!ALLOWED_PREFIXES.has(prefix)) {
-          el.removeAttribute(name);
-          continue;
-        }
-      }
-      if (!stripFrameworkDirectives) continue;
-      if (name.startsWith("x-") || // Alpine
-      name.startsWith("v-") || // Vue
-      name.startsWith(":") || // Vue/Alpine shorthand
-      name.startsWith("on:") || // Svelte
-      name.startsWith("bind:") || // Svelte
-      name.startsWith("let:") || // Svelte
-      name.startsWith("class:")) {
-        el.removeAttribute(name);
-        continue;
-      }
-    }
-  }
-}
-function sanitizeCloneForXHTML(root, opts = {}) {
-  if (!root) return;
-  sanitizeAttributesForXHTML(root, opts);
-  removeAllComments(root);
-}
-async function captureDOM(element, options) {
-  if (!element) throw new Error("Element cannot be null or undefined");
-  applyCachePolicy(options.cache);
-  const fast = options.fast;
-  const outerTransforms = options.outerTransforms !== false;
-  const outerShadows = !!options.outerShadows;
-  let state = { element, options, plugins: options.plugins };
-  let clone, classCSS, styleCache;
-  let fontsCSS = "";
-  let baseCSS = "";
-  let dataURL;
-  let svgString;
-  let rootTransform2D = null;
-  await runHook("beforeSnap", state);
-  await runHook("beforeClone", state);
-  const undoClamp = lineClamp(state.element);
-  try {
-    ({ clone, classCSS, styleCache } = await prepareClone(state.element, state.options));
-    if (!outerTransforms && clone) {
-      rootTransform2D = normalizeRootTransforms(state.element, clone);
-    }
-    if (!outerShadows && clone) {
-      stripRootShadows(state.element, clone);
-    }
-  } finally {
-    undoClamp();
-  }
-  state = { clone, classCSS, styleCache, ...state };
-  await runHook("afterClone", state);
-  sanitizeCloneForXHTML(state.clone);
-  if (state.options?.excludeMode === "remove") {
-    try {
-      shrinkAutoSizeBoxes(state.element, state.clone, state.styleCache);
-    } catch (e) {
-      console.warn("[snapdom] shrink pass failed:", e);
-    }
-  }
-  try {
-    await ligatureIconToImage(state.clone, state.element);
-  } catch {
-  }
-  await new Promise((resolve) => {
-    idle(async () => {
-      await inlineImages(state.clone, state.options);
-      resolve();
-    }, { fast });
-  });
-  await new Promise((resolve) => {
-    idle(async () => {
-      await inlineBackgroundImages(state.element, state.clone, state.styleCache, state.options);
-      resolve();
-    }, { fast });
-  });
-  if (options.embedFonts) {
-    await new Promise((resolve) => {
-      idle(async () => {
-        const required = collectUsedFontVariants(state.element);
-        const usedCodepoints = collectUsedCodepoints(state.element);
-        if (isSafari()) {
-          const families = new Set(
-            Array.from(required).map((k) => String(k).split("__")[0]).filter(Boolean)
-          );
-          await ensureFontsReady(families, 1);
-        }
-        fontsCSS = await embedCustomFonts({
-          required,
-          usedCodepoints,
-          preCached: false,
-          exclude: state.options.excludeFonts,
-          useProxy: state.options.useProxy
-        });
-        resolve();
-      }, { fast });
-    });
-  }
-  const usedTags = collectUsedTagNames(state.clone).sort();
-  const tagKey = usedTags.join(",");
-  if (cache.baseStyle.has(tagKey)) {
-    baseCSS = cache.baseStyle.get(tagKey);
-  } else {
-    await new Promise((resolve) => {
-      idle(() => {
-        baseCSS = generateDedupedBaseCSS(usedTags);
-        cache.baseStyle.set(tagKey, baseCSS);
-        resolve();
-      }, { fast });
-    });
-  }
-  state = { fontsCSS, baseCSS, ...state };
-  await runHook("beforeRender", state);
-  await new Promise((resolve) => {
-    idle(() => {
-      const csEl = getComputedStyle(state.element);
-      const rect = state.element.getBoundingClientRect();
-      let w0 = Math.max(1, limitDecimals(state.element.offsetWidth || parseFloat(csEl.width) || rect.width || 1));
-      let h0 = Math.max(1, limitDecimals(state.element.offsetHeight || parseFloat(csEl.height) || rect.height || 1));
-      if (state.options?.excludeMode === "remove") {
-        const hEst = estimateKeptHeight(state.element, state.options);
-        const EPS = 1;
-        if (Number.isFinite(hEst) && hEst > 0) {
-          h0 = Math.max(1, Math.min(h0, limitDecimals(hEst + EPS)));
-        }
-      }
-      const coerceNum = (v, def = NaN) => {
-        const n = typeof v === "string" ? parseFloat(v) : v;
-        return Number.isFinite(n) ? n : def;
-      };
-      const optW = coerceNum(state.options.width);
-      const optH = coerceNum(state.options.height);
-      let w = w0, h = h0;
-      const hasW = Number.isFinite(optW);
-      const hasH = Number.isFinite(optH);
-      const aspect0 = h0 > 0 ? w0 / h0 : 1;
-      if (hasW && hasH) {
-        w = Math.max(1, limitDecimals(optW));
-        h = Math.max(1, limitDecimals(optH));
-      } else if (hasW) {
-        w = Math.max(1, limitDecimals(optW));
-        h = Math.max(1, limitDecimals(w / (aspect0 || 1)));
-      } else if (hasH) {
-        h = Math.max(1, limitDecimals(optH));
-        w = Math.max(1, limitDecimals(h * (aspect0 || 1)));
-      } else {
-        w = w0;
-        h = h0;
+function sanitizeAttributesForXHTML(root, opts = {}) {
+  const { stripFrameworkDirectives = true } = opts;
+  const ALLOWED_PREFIXES = /* @__PURE__ */ new Set(["xml", "xlink"]);
+  const walker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT);
+  while (walker.nextNode()) {
+    const el = walker.currentNode;
+    for (const attr of Array.from(el.attributes)) {
+      const name = attr.name;
+      if (name.includes("@")) {
+        el.removeAttribute(name);
+        continue;
       }
-      let minX = 0, minY = 0, maxX = w0, maxY = h0;
-      if (!outerTransforms && rootTransform2D && Number.isFinite(rootTransform2D.a)) {
-        const M2 = {
-          a: rootTransform2D.a,
-          b: rootTransform2D.b || 0,
-          c: rootTransform2D.c || 0,
-          d: rootTransform2D.d || 1,
-          e: 0,
-          f: 0
-        };
-        const bb2 = bboxWithOriginFull(w0, h0, M2, 0, 0);
-        minX = limitDecimals(bb2.minX);
-        minY = limitDecimals(bb2.minY);
-        maxX = limitDecimals(bb2.maxX);
-        maxY = limitDecimals(bb2.maxY);
-      } else {
-        const useTFBBox = outerTransforms && hasTFBBox(state.element);
-        if (useTFBBox) {
-          const baseTransform2 = csEl.transform && csEl.transform !== "none" ? csEl.transform : "";
-          const ind2 = readIndividualTransforms(state.element);
-          const TOTAL = readTotalTransformMatrix({
-            baseTransform: baseTransform2,
-            rotate: ind2.rotate || "0deg",
-            scale: ind2.scale,
-            translate: ind2.translate
-          });
-          const { ox: ox2, oy: oy2 } = parseTransformOriginPx(csEl, w0, h0);
-          const M = TOTAL.is2D ? TOTAL : new DOMMatrix(TOTAL.toString());
-          const bb = bboxWithOriginFull(w0, h0, M, ox2, oy2);
-          minX = limitDecimals(bb.minX);
-          minY = limitDecimals(bb.minY);
-          maxX = limitDecimals(bb.maxX);
-          maxY = limitDecimals(bb.maxY);
+      if (name.includes(":")) {
+        const prefix = name.split(":", 1)[0];
+        if (!ALLOWED_PREFIXES.has(prefix)) {
+          el.removeAttribute(name);
+          continue;
         }
       }
-      const bleedShadow = parseBoxShadow(csEl);
-      const bleedBlur = parseFilterBlur(csEl);
-      const bleedOutline = parseOutline(csEl);
-      const drop = parseFilterDropShadows(csEl);
-      const bleed = !outerShadows ? { top: 0, right: 0, bottom: 0, left: 0 } : {
-        top: limitDecimals(bleedShadow.top + bleedBlur.top + bleedOutline.top + drop.bleed.top),
-        right: limitDecimals(bleedShadow.right + bleedBlur.right + bleedOutline.right + drop.bleed.right),
-        bottom: limitDecimals(bleedShadow.bottom + bleedBlur.bottom + bleedOutline.bottom + drop.bleed.bottom),
-        left: limitDecimals(bleedShadow.left + bleedBlur.left + bleedOutline.left + drop.bleed.left)
-      };
-      minX = limitDecimals(minX - bleed.left);
-      minY = limitDecimals(minY - bleed.top);
-      maxX = limitDecimals(maxX + bleed.right);
-      maxY = limitDecimals(maxY + bleed.bottom);
-      const vbW0 = Math.max(1, limitDecimals(maxX - minX));
-      const vbH0 = Math.max(1, limitDecimals(maxY - minY));
-      const scaleW = hasW || hasH ? limitDecimals(w / w0) : 1;
-      const scaleH = hasH || hasW ? limitDecimals(h / h0) : 1;
-      const outW = Math.max(1, limitDecimals(vbW0 * scaleW));
-      const outH = Math.max(1, limitDecimals(vbH0 * scaleH));
-      const svgNS = "http://www.w3.org/2000/svg";
-      const basePad = isSafari() ? 1 : 0;
-      const extraPad = !outerTransforms ? 1 : 0;
-      const pad = limitDecimals(basePad + extraPad);
-      const fo = document.createElementNS(svgNS, "foreignObject");
-      const vbMinX = limitDecimals(minX);
-      const vbMinY = limitDecimals(minY);
-      fo.setAttribute("x", String(limitDecimals(-(vbMinX - pad))));
-      fo.setAttribute("y", String(limitDecimals(-(vbMinY - pad))));
-      fo.setAttribute("width", String(limitDecimals(w0 + pad * 2)));
-      fo.setAttribute("height", String(limitDecimals(h0 + pad * 2)));
-      fo.style.overflow = "visible";
-      const styleTag = document.createElement("style");
-      styleTag.textContent = state.baseCSS + state.fontsCSS + "svg{overflow:visible;} foreignObject{overflow:visible;}" + state.classCSS;
-      fo.appendChild(styleTag);
-      const container = document.createElement("div");
-      container.setAttribute("xmlns", "http://www.w3.org/1999/xhtml");
-      container.style.width = `${limitDecimals(w0)}px`;
-      container.style.height = `${limitDecimals(h0)}px`;
-      container.style.overflow = "visible";
-      state.clone.setAttribute("xmlns", "http://www.w3.org/1999/xhtml");
-      container.appendChild(state.clone);
-      fo.appendChild(container);
-      const serializer = new XMLSerializer();
-      const foString = serializer.serializeToString(fo);
-      const vbW = limitDecimals(vbW0 + pad * 2);
-      const vbH = limitDecimals(vbH0 + pad * 2);
-      const wantsSize = hasW || hasH;
-      options.meta = { w0, h0, vbW, vbH, targetW: w, targetH: h };
-      const svgOutW = isSafari() && wantsSize ? vbW : limitDecimals(outW + pad * 2);
-      const svgOutH = isSafari() && wantsSize ? vbH : limitDecimals(outH + pad * 2);
-      const svgHeader = `<svg xmlns="${svgNS}" width="${svgOutW}" height="${svgOutH}" viewBox="0 0 ${vbW} ${vbH}">`;
-      const svgFooter = "</svg>";
-      svgString = svgHeader + foString + svgFooter;
-      dataURL = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svgString)}`;
-      state = { svgString, dataURL, ...state };
-      resolve();
-    }, { fast });
-  });
-  await runHook("afterRender", state);
-  const sandbox = document.getElementById("snapdom-sandbox");
-  if (sandbox && sandbox.style.position === "absolute") sandbox.remove();
-  return state.dataURL;
+      if (!stripFrameworkDirectives) continue;
+      if (name.startsWith("x-") || // Alpine
+      name.startsWith("v-") || // Vue
+      name.startsWith(":") || // Vue/Alpine shorthand
+      name.startsWith("on:") || // Svelte
+      name.startsWith("bind:") || // Svelte
+      name.startsWith("let:") || // Svelte
+      name.startsWith("class:")) {
+        el.removeAttribute(name);
+        continue;
+      }
+    }
+  }
+}
+function sanitizeCloneForXHTML(root, opts = {}) {
+  if (!root) return;
+  sanitizeAttributesForXHTML(root, opts);
+  removeAllComments(root);
 }
 function authorHasExplicitSize(el) {
   try {
@@ -3947,7 +4310,83 @@ function shrinkAutoSizeBoxes(sourceRoot, cloneRoot, styleCache = /* @__PURE__ */
   }
   walk(sourceRoot, cloneRoot);
 }
+function isInNormalFlow(el) {
+  const cs = getComputedStyle(el);
+  if (cs.display === "none") return false;
+  if (cs.position === "absolute" || cs.position === "fixed" || cs.position === "sticky") return false;
+  if ((cs.cssFloat || cs.float || "none") !== "none") return false;
+  if (cs.transform && cs.transform !== "none") return false;
+  return true;
+}
+function willBeExcluded(el, options) {
+  if (!(el instanceof Element)) return false;
+  if (el.getAttribute("data-capture") === "exclude" && options?.excludeMode === "remove") return true;
+  if (Array.isArray(options?.exclude)) {
+    for (const sel of options.exclude) {
+      try {
+        if (el.matches(sel)) return options.excludeMode === "remove";
+      } catch {
+      }
+    }
+  }
+  return false;
+}
+function estimateKeptHeight(container, options) {
+  const csC = getComputedStyle(container);
+  const rC = container.getBoundingClientRect();
+  let minTop = Infinity;
+  let maxBottom = -Infinity;
+  let found = false;
+  const kids = Array.from(container.children);
+  for (const k of kids) {
+    if (willBeExcluded(k, options)) continue;
+    if (!isInNormalFlow(k)) continue;
+    const rk = k.getBoundingClientRect();
+    const top = rk.top - rC.top;
+    const bottom = rk.bottom - rC.top;
+    if (bottom <= top) continue;
+    if (top < minTop) minTop = top;
+    if (bottom > maxBottom) maxBottom = bottom;
+    found = true;
+  }
+  const contentSpan = found ? Math.max(0, maxBottom - minTop) : 0;
+  const bt = parseFloat(csC.borderTopWidth) || 0;
+  const bb = parseFloat(csC.borderBottomWidth) || 0;
+  const pt = parseFloat(csC.paddingTop) || 0;
+  const pb = parseFloat(csC.paddingBottom) || 0;
+  return bt + bb + pt + pb + contentSpan;
+}
 var limitDecimals = (v, n = 3) => Number.isFinite(v) ? Math.round(v * 10 ** n) / 10 ** n : v;
+
+// src/utils/transforms.helpers.js
+function parseBoxShadow(cs) {
+  const v = cs.boxShadow || "";
+  if (!v || v === "none") return { top: 0, right: 0, bottom: 0, left: 0 };
+  const parts = v.split(/\),(?=(?:[^()]*\([^()]*\))*[^()]*$)/).map((s) => s.trim());
+  let t = 0, r = 0, b2 = 0, l = 0;
+  for (const part of parts) {
+    const nums = part.match(/-?\d+(\.\d+)?px/g)?.map((n) => parseFloat(n)) || [];
+    if (nums.length < 2) continue;
+    const [ox2, oy2, blur = 0, spread = 0] = nums;
+    const extX = Math.abs(ox2) + blur + spread;
+    const extY = Math.abs(oy2) + blur + spread;
+    r = Math.max(r, extX + Math.max(ox2, 0));
+    l = Math.max(l, extX + Math.max(-ox2, 0));
+    b2 = Math.max(b2, extY + Math.max(oy2, 0));
+    t = Math.max(t, extY + Math.max(-oy2, 0));
+  }
+  return { top: Math.ceil(t), right: Math.ceil(r), bottom: Math.ceil(b2), left: Math.ceil(l) };
+}
+function parseFilterBlur(cs) {
+  const m = (cs.filter || "").match(/blur\(\s*([0-9.]+)px\s*\)/);
+  const b2 = m ? Math.ceil(parseFloat(m[1]) || 0) : 0;
+  return { top: b2, right: b2, bottom: b2, left: b2 };
+}
+function parseOutline(cs) {
+  if ((cs.outlineStyle || "none") === "none") return { top: 0, right: 0, bottom: 0, left: 0 };
+  const w2 = Math.ceil(parseFloat(cs.outlineWidth || "0") || 0);
+  return { top: w2, right: w2, bottom: w2, left: w2 };
+}
 function parseFilterDropShadows(cs) {
   const raw = `${cs.filter || ""} ${cs.webkitFilter || ""}`.trim();
   if (!raw || raw === "none") {
@@ -4036,34 +4475,6 @@ function normalizeRootTransforms(originalEl, cloneRoot) {
     return null;
   }
 }
-function parseBoxShadow(cs) {
-  const v = cs.boxShadow || "";
-  if (!v || v === "none") return { top: 0, right: 0, bottom: 0, left: 0 };
-  const parts = v.split(/\),(?=(?:[^()]*\([^()]*\))*[^()]*$)/).map((s) => s.trim());
-  let t = 0, r = 0, b2 = 0, l = 0;
-  for (const part of parts) {
-    const nums = part.match(/-?\d+(\.\d+)?px/g)?.map((n) => parseFloat(n)) || [];
-    if (nums.length < 2) continue;
-    const [ox2, oy2, blur = 0, spread = 0] = nums;
-    const extX = Math.abs(ox2) + blur + spread;
-    const extY = Math.abs(oy2) + blur + spread;
-    r = Math.max(r, extX + Math.max(ox2, 0));
-    l = Math.max(l, extX + Math.max(-ox2, 0));
-    b2 = Math.max(b2, extY + Math.max(oy2, 0));
-    t = Math.max(t, extY + Math.max(-oy2, 0));
-  }
-  return { top: Math.ceil(t), right: Math.ceil(r), bottom: Math.ceil(b2), left: Math.ceil(l) };
-}
-function parseFilterBlur(cs) {
-  const m = (cs.filter || "").match(/blur\(\s*([0-9.]+)px\s*\)/);
-  const b2 = m ? Math.ceil(parseFloat(m[1]) || 0) : 0;
-  return { top: b2, right: b2, bottom: b2, left: b2 };
-}
-function parseOutline(cs) {
-  if ((cs.outlineStyle || "none") === "none") return { top: 0, right: 0, bottom: 0, left: 0 };
-  const w2 = Math.ceil(parseFloat(cs.outlineWidth || "0") || 0);
-  return { top: w2, right: w2, bottom: w2, left: w2 };
-}
 function bboxWithOriginFull(w2, h2, M, ox2, oy2) {
   const a2 = M.a, b2 = M.b, c2 = M.c, d2 = M.d, e2 = M.e || 0, f2 = M.f || 0;
   function pt(x, y) {
@@ -4083,17 +4494,24 @@ function bboxWithOriginFull(w2, h2, M, ox2, oy2) {
   }
   return { minX: minX2, minY: minY2, maxX: maxX2, maxY: maxY2, width: maxX2 - minX2, height: maxY2 - minY2 };
 }
-function hasTFBBox(el) {
-  return hasBBoxAffectingTransform(el);
-}
-function matrixFromComputed(el) {
-  const tr = getComputedStyle(el).transform;
-  if (!tr || tr === "none") return new DOMMatrix();
-  try {
-    return new DOMMatrix(tr);
-  } catch {
-    return new WebKitCSSMatrix(tr);
-  }
+function parseTransformOriginPx(cs, w, h) {
+  const raw = (cs.transformOrigin || "0 0").trim().split(/\s+/);
+  const [oxRaw, oyRaw] = [raw[0] || "0", raw[1] || "0"];
+  const toPx = (token, size) => {
+    const t = token.toLowerCase();
+    if (t === "left" || t === "top") return 0;
+    if (t === "center") return size / 2;
+    if (t === "right") return size;
+    if (t === "bottom") return size;
+    if (t.endsWith("px")) return parseFloat(t) || 0;
+    if (t.endsWith("%")) return (parseFloat(t) || 0) * size / 100;
+    if (/^-?\d+(\.\d+)?$/.test(t)) return parseFloat(t) || 0;
+    return 0;
+  };
+  return {
+    ox: toPx(oxRaw, w),
+    oy: toPx(oyRaw, h)
+  };
 }
 function readIndividualTransforms(el) {
   const out = { rotate: "0deg", scale: null, translate: null };
@@ -4133,438 +4551,373 @@ function readIndividualTransforms(el) {
     }
     const tr = safeGet("translate");
     if (tr) {
-      const tx = "x" in tr && "value" in tr.x ? tr.x.value : Array.isArray(tr) ? tr[0]?.value : 0;
-      const ty = "y" in tr && "value" in tr.y ? tr.y.value : Array.isArray(tr) ? tr[1]?.value : 0;
-      const ux = "x" in tr && tr.x?.unit ? tr.x.unit : "px";
-      const uy = "y" in tr && tr.y?.unit ? tr.y.unit : "px";
-      out.translate = `${tx}${ux} ${ty}${uy}`;
-    } else {
-      const cs2 = getComputedStyle(el);
-      out.translate = cs2.translate && cs2.translate !== "none" ? cs2.translate : null;
-    }
-    return out;
-  }
-  const cs = getComputedStyle(el);
-  out.rotate = cs.rotate && cs.rotate !== "none" ? cs.rotate : "0deg";
-  out.scale = cs.scale && cs.scale !== "none" ? cs.scale : null;
-  out.translate = cs.translate && cs.translate !== "none" ? cs.translate : null;
-  return out;
-}
-function hasBBoxAffectingTransform(el) {
-  const cs = getComputedStyle(el);
-  const t = cs.transform || "none";
-  const hasMatrix = t !== "none" && !/^matrix\(\s*1\s*,\s*0\s*,\s*0\s*,\s*1\s*,\s*0\s*,\s*0\s*\)$/i.test(t);
-  if (hasMatrix) return true;
-  const r = cs.rotate && cs.rotate !== "none" && cs.rotate !== "0deg";
-  const s = cs.scale && cs.scale !== "none" && cs.scale !== "1";
-  const tr = cs.translate && cs.translate !== "none" && cs.translate !== "0px 0px";
-  return Boolean(r || s || tr);
-}
-function parseTransformOriginPx(cs, w, h) {
-  const raw = (cs.transformOrigin || "0 0").trim().split(/\s+/);
-  const [oxRaw, oyRaw] = [raw[0] || "0", raw[1] || "0"];
-  const toPx = (token, size) => {
-    const t = token.toLowerCase();
-    if (t === "left" || t === "top") return 0;
-    if (t === "center") return size / 2;
-    if (t === "right") return size;
-    if (t === "bottom") return size;
-    if (t.endsWith("px")) return parseFloat(t) || 0;
-    if (t.endsWith("%")) return (parseFloat(t) || 0) * size / 100;
-    if (/^-?\d+(\.\d+)?$/.test(t)) return parseFloat(t) || 0;
-    return 0;
-  };
-  return {
-    ox: toPx(oxRaw, w),
-    oy: toPx(oyRaw, h)
-  };
-}
-var __measureHost = null;
-function getMeasureHost() {
-  if (__measureHost) return __measureHost;
-  const n = document.createElement("div");
-  n.id = "snapdom-measure-slot";
-  n.setAttribute("aria-hidden", "true");
-  Object.assign(n.style, {
-    position: "absolute",
-    left: "-99999px",
-    top: "0px",
-    width: "0px",
-    height: "0px",
-    overflow: "hidden",
-    opacity: "0",
-    pointerEvents: "none",
-    contain: "size layout style"
-  });
-  document.documentElement.appendChild(n);
-  __measureHost = n;
-  return n;
-}
-function readTotalTransformMatrix(t) {
-  const host = getMeasureHost();
-  const tmp = document.createElement("div");
-  tmp.style.transformOrigin = "0 0";
-  if (t.baseTransform) tmp.style.transform = t.baseTransform;
-  if (t.rotate) tmp.style.rotate = t.rotate;
-  if (t.scale) tmp.style.scale = t.scale;
-  if (t.translate) tmp.style.translate = t.translate;
-  host.appendChild(tmp);
-  const M = matrixFromComputed(tmp);
-  host.removeChild(tmp);
-  return M;
-}
-function isInNormalFlow(el) {
-  const cs = getComputedStyle(el);
-  if (cs.display === "none") return false;
-  if (cs.position === "absolute" || cs.position === "fixed" || cs.position === "sticky") return false;
-  if ((cs.cssFloat || cs.float || "none") !== "none") return false;
-  if (cs.transform && cs.transform !== "none") return false;
-  return true;
-}
-function willBeExcluded(el, options) {
-  if (!(el instanceof Element)) return false;
-  if (el.getAttribute("data-capture") === "exclude" && options?.excludeMode === "remove") return true;
-  if (Array.isArray(options?.exclude)) {
-    for (const sel of options.exclude) {
-      try {
-        if (el.matches(sel)) return options.excludeMode === "remove";
-      } catch {
-      }
-    }
-  }
-  return false;
-}
-function estimateKeptHeight(container, options) {
-  const csC = getComputedStyle(container);
-  const rC = container.getBoundingClientRect();
-  let minTop = Infinity;
-  let maxBottom = -Infinity;
-  let found = false;
-  const kids = Array.from(container.children);
-  for (const k of kids) {
-    if (willBeExcluded(k, options)) continue;
-    if (!isInNormalFlow(k)) continue;
-    const rk = k.getBoundingClientRect();
-    const top = rk.top - rC.top;
-    const bottom = rk.bottom - rC.top;
-    if (bottom <= top) continue;
-    if (top < minTop) minTop = top;
-    if (bottom > maxBottom) maxBottom = bottom;
-    found = true;
-  }
-  const contentSpan = found ? Math.max(0, maxBottom - minTop) : 0;
-  const bt = parseFloat(csC.borderTopWidth) || 0;
-  const bb = parseFloat(csC.borderBottomWidth) || 0;
-  const pt = parseFloat(csC.paddingTop) || 0;
-  const pb = parseFloat(csC.paddingBottom) || 0;
-  return bt + bb + pt + pb + contentSpan;
-}
-
-// src/core/context.js
-function normalizeCachePolicy(v) {
-  if (typeof v === "string") {
-    const s = v.toLowerCase().trim();
-    if (s === "disabled" || s === "full" || s === "auto" || s === "soft") return (
-      /** @type {CachePolicy} */
-      s
-    );
-  }
-  return "soft";
-}
-function createContext(options = {}) {
-  let resolvedFormat = options.format ?? "png";
-  if (resolvedFormat === "jpg") resolvedFormat = "jpeg";
-  const cachePolicy = normalizeCachePolicy(options.cache);
-  return {
-    // Debug & perf
-    debug: options.debug ?? false,
-    fast: options.fast ?? true,
-    scale: options.scale ?? 1,
-    // DOM filters
-    exclude: options.exclude ?? [],
-    excludeMode: options.excludeMode ?? "hide",
-    filter: options.filter ?? null,
-    filterMode: options.filterMode ?? "hide",
-    // Placeholders
-    placeholders: options.placeholders !== false,
-    // default true
-    // Fonts
-    embedFonts: options.embedFonts ?? false,
-    iconFonts: Array.isArray(options.iconFonts) ? options.iconFonts : options.iconFonts ? [options.iconFonts] : [],
-    localFonts: Array.isArray(options.localFonts) ? options.localFonts : [],
-    excludeFonts: options.excludeFonts ?? void 0,
-    fallbackURL: options.fallbackURL ?? void 0,
-    /** @type {CachePolicy} */
-    cache: cachePolicy,
-    // Network
-    useProxy: typeof options.useProxy === "string" ? options.useProxy : "",
-    // Output
-    width: options.width ?? null,
-    height: options.height ?? null,
-    format: resolvedFormat,
-    type: options.type ?? "svg",
-    quality: options.quality ?? 0.92,
-    dpr: options.dpr ?? (window.devicePixelRatio || 1),
-    backgroundColor: options.backgroundColor ?? (["jpeg", "webp"].includes(resolvedFormat) ? "#ffffff" : null),
-    filename: options.filename ?? "snapDOM",
-    // NEW flags (user-friendly)
-    outerTransforms: options.outerTransforms ?? true,
-    outerShadows: options.outerShadows ?? false
-    // Plugins (reservado)
-    // plugins: normalizePlugins(...),
-  };
-}
-
-// src/exporters/toCanvas.js
-function isSvgDataURL(u) {
-  return typeof u === "string" && /^data:image\/svg\+xml/i.test(u);
-}
-function decodeSvgFromDataURL(u) {
-  const i = u.indexOf(",");
-  return i >= 0 ? decodeURIComponent(u.slice(i + 1)) : "";
-}
-function encodeSvgToDataURL(svgText) {
-  return `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svgText)}`;
-}
-function splitDecls(s) {
-  let parts = [], buf = "", depth = 0;
-  for (let i = 0; i < s.length; i++) {
-    const ch = s[i];
-    if (ch === "(") depth++;
-    if (ch === ")") depth = Math.max(0, depth - 1);
-    if (ch === ";" && depth === 0) {
-      parts.push(buf);
-      buf = "";
-    } else buf += ch;
-  }
-  if (buf.trim()) parts.push(buf);
-  return parts.map((x) => x.trim()).filter(Boolean);
-}
-function boxShadowToDropShadow(value) {
-  const layers = [];
-  let buf = "", depth = 0;
-  for (let i = 0; i < value.length; i++) {
-    const ch = value[i];
-    if (ch === "(") depth++;
-    if (ch === ")") depth = Math.max(0, depth - 1);
-    if (ch === "," && depth === 0) {
-      layers.push(buf.trim());
-      buf = "";
-    } else buf += ch;
-  }
-  if (buf.trim()) layers.push(buf.trim());
-  const fns = [];
-  for (const layer of layers) {
-    if (/\binset\b/i.test(layer)) continue;
-    const nums = layer.match(/-?\d+(?:\.\d+)?px/gi) || [];
-    const [ox = "0px", oy = "0px", blur = "0px"] = nums;
-    let color = layer.replace(/-?\d+(?:\.\d+)?px/gi, "").replace(/\binset\b/ig, "").trim().replace(/\s{2,}/g, " ");
-    const hasColor = !!color && color !== ",";
-    fns.push(`drop-shadow(${ox} ${oy} ${blur}${hasColor ? ` ${color}` : ""})`);
-  }
-  return fns.join(" ");
-}
-function rewriteDeclList(list) {
-  const decls = splitDecls(list);
-  let filter = null, wfilter = null, box = null;
-  const rest = [];
-  for (const d of decls) {
-    const idx = d.indexOf(":");
-    if (idx < 0) continue;
-    const prop = d.slice(0, idx).trim().toLowerCase();
-    const val = d.slice(idx + 1).trim();
-    if (prop === "box-shadow") box = val;
-    else if (prop === "filter") filter = val;
-    else if (prop === "-webkit-filter") wfilter = val;
-    else rest.push([prop, val]);
-  }
-  if (box) {
-    const ds = boxShadowToDropShadow(box);
-    if (ds) {
-      filter = filter ? `${filter} ${ds}` : ds;
-      wfilter = wfilter ? `${wfilter} ${ds}` : ds;
+      const tx = "x" in tr && "value" in tr.x ? tr.x.value : Array.isArray(tr) ? tr[0]?.value : 0;
+      const ty = "y" in tr && "value" in tr.y ? tr.y.value : Array.isArray(tr) ? tr[1]?.value : 0;
+      const ux = "x" in tr && tr.x?.unit ? tr.x.unit : "px";
+      const uy = "y" in tr && tr.y?.unit ? tr.y.unit : "px";
+      out.translate = `${tx}${ux} ${ty}${uy}`;
+    } else {
+      const cs2 = getComputedStyle(el);
+      out.translate = cs2.translate && cs2.translate !== "none" ? cs2.translate : null;
     }
+    return out;
   }
-  const out = [...rest];
-  if (filter) out.push(["filter", filter]);
-  if (wfilter) out.push(["-webkit-filter", wfilter]);
-  return out.map(([k, v]) => `${k}:${v}`).join(";");
+  const cs = getComputedStyle(el);
+  out.rotate = cs.rotate && cs.rotate !== "none" ? cs.rotate : "0deg";
+  out.scale = cs.scale && cs.scale !== "none" ? cs.scale : null;
+  out.translate = cs.translate && cs.translate !== "none" ? cs.translate : null;
+  return out;
 }
-function rewriteCssBlock(css) {
-  return css.replace(/([^{}]+)\{([^}]*)\}/g, (_m, sel, body) => `${sel}{${rewriteDeclList(body)}}`);
+var __measureHost = null;
+function getMeasureHost() {
+  if (__measureHost) return __measureHost;
+  const n = document.createElement("div");
+  n.id = "snapdom-measure-slot";
+  n.setAttribute("aria-hidden", "true");
+  Object.assign(n.style, {
+    position: "absolute",
+    left: "-99999px",
+    top: "0px",
+    width: "0px",
+    height: "0px",
+    overflow: "hidden",
+    opacity: "0",
+    pointerEvents: "none",
+    contain: "size layout style"
+  });
+  document.documentElement.appendChild(n);
+  __measureHost = n;
+  return n;
 }
-function rewriteSvgBoxShadowToDropShadow(svgText) {
-  svgText = svgText.replace(
-    /<style[^>]*>([\s\S]*?)<\/style>/gi,
-    (m, css) => m.replace(css, rewriteCssBlock(css))
-  );
-  svgText = svgText.replace(
-    /style=(['"])([\s\S]*?)\1/gi,
-    (m, q, body) => `style=${q}${rewriteDeclList(body)}${q}`
-  );
-  return svgText;
+function readTotalTransformMatrix(t) {
+  const host = getMeasureHost();
+  const tmp = document.createElement("div");
+  tmp.style.transformOrigin = "0 0";
+  if (t.baseTransform) tmp.style.transform = t.baseTransform;
+  if (t.rotate) tmp.style.rotate = t.rotate;
+  if (t.scale) tmp.style.scale = t.scale;
+  if (t.translate) tmp.style.translate = t.translate;
+  host.appendChild(tmp);
+  const M = matrixFromComputed(tmp);
+  host.removeChild(tmp);
+  return M;
 }
-function maybeConvertBoxShadowForSafari(url) {
-  if (!isSafari() || !isSvgDataURL(url)) return url;
+function hasBBoxAffectingTransform(el) {
+  const cs = getComputedStyle(el);
+  const t = cs.transform || "none";
+  const hasMatrix = t !== "none" && !/^matrix\(\s*1\s*,\s*0\s*,\s*0\s*,\s*1\s*,\s*0\s*,\s*0\s*\)$/i.test(t);
+  if (hasMatrix) return true;
+  const r = cs.rotate && cs.rotate !== "none" && cs.rotate !== "0deg";
+  const s = cs.scale && cs.scale !== "none" && cs.scale !== "1";
+  const tr = cs.translate && cs.translate !== "none" && cs.translate !== "0px 0px";
+  return Boolean(r || s || tr);
+}
+function matrixFromComputed(el) {
+  const tr = getComputedStyle(el).transform;
+  if (!tr || tr === "none") return new DOMMatrix();
   try {
-    const svg = decodeSvgFromDataURL(url);
-    const fixed = rewriteSvgBoxShadowToDropShadow(svg);
-    return encodeSvgToDataURL(fixed);
+    return new DOMMatrix(tr);
   } catch {
-    return url;
-  }
-}
-async function toCanvas(url, options) {
-  let { width: optW, height: optH, scale = 1, dpr = 1, meta = {}, backgroundColor } = options;
-  url = maybeConvertBoxShadowForSafari(url);
-  const img = new Image();
-  img.loading = "eager";
-  img.decoding = "sync";
-  img.crossOrigin = "anonymous";
-  img.src = url;
-  await img.decode();
-  const natW = img.naturalWidth;
-  const natH = img.naturalHeight;
-  const refW = Number.isFinite(meta.w0) ? meta.w0 : natW;
-  const refH = Number.isFinite(meta.h0) ? meta.h0 : natH;
-  let outW, outH;
-  const hasW = Number.isFinite(optW);
-  const hasH = Number.isFinite(optH);
-  if (hasW && hasH) {
-    outW = Math.max(1, optW);
-    outH = Math.max(1, optH);
-  } else if (hasW) {
-    const k = optW / Math.max(1, refW);
-    outW = optW;
-    outH = refH * k;
-  } else if (hasH) {
-    const k = optH / Math.max(1, refH);
-    outH = optH;
-    outW = refW * k;
-  } else {
-    outW = natW;
-    outH = natH;
-  }
-  outW = outW * scale;
-  outH = outH * scale;
-  const canvas = document.createElement("canvas");
-  canvas.width = outW * dpr;
-  canvas.height = outH * dpr;
-  canvas.style.width = `${outW}px`;
-  canvas.style.height = `${outH}px`;
-  const ctx = canvas.getContext("2d");
-  if (dpr !== 1) ctx.scale(dpr, dpr);
-  if (backgroundColor) {
-    ctx.save();
-    ctx.fillStyle = backgroundColor;
-    ctx.fillRect(0, 0, outW, outH);
-    ctx.restore();
+    return new WebKitCSSMatrix(tr);
   }
-  ctx.drawImage(img, 0, 0, outW, outH);
-  return canvas;
-}
-
-// src/modules/rasterize.js
-async function rasterize(url, options) {
-  const canvas = await toCanvas(url, options);
-  const img = new Image();
-  img.src = canvas.toDataURL(`image/${options.format}`, options.quality);
-  await img.decode();
-  img.style.width = `${canvas.width / options.dpr}px`;
-  img.style.height = `${canvas.height / options.dpr}px`;
-  return img;
 }
 
-// src/exporters/toImg.js
-async function toImg(url, options) {
-  const { scale = 1, width, height, meta = {} } = options;
-  const hasW = Number.isFinite(width);
-  const hasH = Number.isFinite(height);
-  const wantsScale = Number.isFinite(scale) && scale !== 1 || hasW || hasH;
-  if (isSafari() && wantsScale) {
-    const pngUrl = await rasterize(url, { ...options, format: "png", quality: 1, meta });
-    return pngUrl;
+// src/core/capture.js
+async function captureDOM(element, options) {
+  if (!element) throw new Error("Element cannot be null or undefined");
+  applyCachePolicy(options.cache);
+  const fast = options.fast;
+  const outerTransforms = options.outerTransforms !== false;
+  const outerShadows = !!options.outerShadows;
+  let state = { element, options, plugins: options.plugins };
+  let clone, classCSS, styleCache;
+  let fontsCSS = "";
+  let baseCSS = "";
+  let dataURL;
+  let svgString;
+  let rootTransform2D = null;
+  await runHook("beforeSnap", state);
+  await runHook("beforeClone", state);
+  const undoClamp = lineClamp(state.element);
+  try {
+    ({ clone, classCSS, styleCache } = await prepareClone(state.element, state.options));
+    if (!outerTransforms && clone) {
+      rootTransform2D = normalizeRootTransforms(state.element, clone);
+    }
+    if (!outerShadows && clone) {
+      stripRootShadows(state.element, clone);
+    }
+  } finally {
+    undoClamp();
   }
-  const img = new Image();
-  img.decoding = "sync";
-  img.loading = "eager";
-  img.src = url;
-  await img.decode();
-  if (hasW && hasH) {
-    img.style.width = `${width}px`;
-    img.style.height = `${height}px`;
-  } else if (hasW) {
-    const refW = Number.isFinite(meta.w0) ? meta.w0 : img.naturalWidth;
-    const refH = Number.isFinite(meta.h0) ? meta.h0 : img.naturalHeight;
-    const k = width / Math.max(1, refW);
-    img.style.width = `${width}px`;
-    img.style.height = `${Math.round(refH * k)}px`;
-  } else if (hasH) {
-    const refW = Number.isFinite(meta.w0) ? meta.w0 : img.naturalWidth;
-    const refH = Number.isFinite(meta.h0) ? meta.h0 : img.naturalHeight;
-    const k = height / Math.max(1, refH);
-    img.style.height = `${height}px`;
-    img.style.width = `${Math.round(refW * k)}px`;
-  } else {
-    const cssW = Math.round(img.naturalWidth * scale);
-    const cssH = Math.round(img.naturalHeight * scale);
-    img.style.width = `${cssW}px`;
-    img.style.height = `${cssH}px`;
-    if (typeof url === "string" && url.startsWith("data:image/svg+xml")) {
-      try {
-        const decoded = decodeURIComponent(url.split(",")[1]);
-        const patched = decoded.replace(/width="[^"]*"/, `width="${cssW}"`).replace(/height="[^"]*"/, `height="${cssH}"`);
-        url = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(patched)}`;
-        img.src = url;
-      } catch {
-      }
+  state = { clone, classCSS, styleCache, ...state };
+  await runHook("afterClone", state);
+  sanitizeCloneForXHTML(state.clone);
+  if (state.options?.excludeMode === "remove") {
+    try {
+      shrinkAutoSizeBoxes(state.element, state.clone, state.styleCache);
+    } catch (e) {
+      console.warn("[snapdom] shrink pass failed:", e);
     }
   }
-  return img;
-}
-
-// src/exporters/toBlob.js
-async function toBlob(url, options) {
-  const type = options.type;
-  if (type === "svg") {
-    const svgText = decodeURIComponent(url.split(",")[1]);
-    return new Blob([svgText], { type: "image/svg+xml" });
+  try {
+    await ligatureIconToImage(state.clone, state.element);
+  } catch {
+  }
+  await new Promise((resolve) => {
+    idle(async () => {
+      await inlineImages(state.clone, state.options);
+      resolve();
+    }, { fast });
+  });
+  await new Promise((resolve) => {
+    idle(async () => {
+      await inlineBackgroundImages(state.element, state.clone, state.styleCache, state.options);
+      resolve();
+    }, { fast });
+  });
+  if (options.embedFonts) {
+    await new Promise((resolve) => {
+      idle(async () => {
+        const required = collectUsedFontVariants(state.element);
+        const usedCodepoints = collectUsedCodepoints(state.element);
+        if (isSafari()) {
+          const families = new Set(
+            Array.from(required).map((k) => String(k).split("__")[0]).filter(Boolean)
+          );
+          await ensureFontsReady(families, 1);
+        }
+        fontsCSS = await embedCustomFonts({
+          required,
+          usedCodepoints,
+          preCached: false,
+          exclude: state.options.excludeFonts,
+          useProxy: state.options.useProxy
+        });
+        resolve();
+      }, { fast });
+    });
+  }
+  const usedTags = collectUsedTagNames(state.clone).sort();
+  const tagKey = usedTags.join(",");
+  if (cache.baseStyle.has(tagKey)) {
+    baseCSS = cache.baseStyle.get(tagKey);
+  } else {
+    await new Promise((resolve) => {
+      idle(() => {
+        baseCSS = generateDedupedBaseCSS(usedTags);
+        cache.baseStyle.set(tagKey, baseCSS);
+        resolve();
+      }, { fast });
+    });
   }
-  const canvas = await toCanvas(url, options);
-  return new Promise(
-    (resolve) => canvas.toBlob((blob) => resolve(blob), `image/${type}`, options.quality)
-  );
+  state = { fontsCSS, baseCSS, ...state };
+  await runHook("beforeRender", state);
+  await new Promise((resolve) => {
+    idle(() => {
+      const csEl = getComputedStyle(state.element);
+      const rect = state.element.getBoundingClientRect();
+      let w0 = Math.max(1, limitDecimals(state.element.offsetWidth || parseFloat(csEl.width) || rect.width || 1));
+      let h0 = Math.max(1, limitDecimals(state.element.offsetHeight || parseFloat(csEl.height) || rect.height || 1));
+      if (state.options?.excludeMode === "remove") {
+        const hEst = estimateKeptHeight(state.element, state.options);
+        const EPS = 1;
+        if (Number.isFinite(hEst) && hEst > 0) {
+          h0 = Math.max(1, Math.min(h0, limitDecimals(hEst + EPS)));
+        }
+      }
+      const coerceNum = (v, def = NaN) => {
+        const n = typeof v === "string" ? parseFloat(v) : v;
+        return Number.isFinite(n) ? n : def;
+      };
+      const optW = coerceNum(state.options.width);
+      const optH = coerceNum(state.options.height);
+      let w = w0, h = h0;
+      const hasW = Number.isFinite(optW);
+      const hasH = Number.isFinite(optH);
+      const aspect0 = h0 > 0 ? w0 / h0 : 1;
+      if (hasW && hasH) {
+        w = Math.max(1, limitDecimals(optW));
+        h = Math.max(1, limitDecimals(optH));
+      } else if (hasW) {
+        w = Math.max(1, limitDecimals(optW));
+        h = Math.max(1, limitDecimals(w / (aspect0 || 1)));
+      } else if (hasH) {
+        h = Math.max(1, limitDecimals(optH));
+        w = Math.max(1, limitDecimals(h * (aspect0 || 1)));
+      } else {
+        w = w0;
+        h = h0;
+      }
+      let minX = 0, minY = 0, maxX = w0, maxY = h0;
+      if (!outerTransforms && rootTransform2D && Number.isFinite(rootTransform2D.a)) {
+        const M2 = {
+          a: rootTransform2D.a,
+          b: rootTransform2D.b || 0,
+          c: rootTransform2D.c || 0,
+          d: rootTransform2D.d || 1,
+          e: 0,
+          f: 0
+        };
+        const bb2 = bboxWithOriginFull(w0, h0, M2, 0, 0);
+        minX = limitDecimals(bb2.minX);
+        minY = limitDecimals(bb2.minY);
+        maxX = limitDecimals(bb2.maxX);
+        maxY = limitDecimals(bb2.maxY);
+      } else {
+        const useTFBBox = outerTransforms && hasTFBBox(state.element);
+        if (useTFBBox) {
+          const baseTransform2 = csEl.transform && csEl.transform !== "none" ? csEl.transform : "";
+          const ind2 = readIndividualTransforms(state.element);
+          const TOTAL = readTotalTransformMatrix({
+            baseTransform: baseTransform2,
+            rotate: ind2.rotate || "0deg",
+            scale: ind2.scale,
+            translate: ind2.translate
+          });
+          const { ox: ox2, oy: oy2 } = parseTransformOriginPx(csEl, w0, h0);
+          const M = TOTAL.is2D ? TOTAL : new DOMMatrix(TOTAL.toString());
+          const bb = bboxWithOriginFull(w0, h0, M, ox2, oy2);
+          minX = limitDecimals(bb.minX);
+          minY = limitDecimals(bb.minY);
+          maxX = limitDecimals(bb.maxX);
+          maxY = limitDecimals(bb.maxY);
+        }
+      }
+      const bleedShadow = parseBoxShadow(csEl);
+      const bleedBlur = parseFilterBlur(csEl);
+      const bleedOutline = parseOutline(csEl);
+      const drop = parseFilterDropShadows(csEl);
+      const bleed = !outerShadows ? { top: 0, right: 0, bottom: 0, left: 0 } : {
+        top: limitDecimals(bleedShadow.top + bleedBlur.top + bleedOutline.top + drop.bleed.top),
+        right: limitDecimals(bleedShadow.right + bleedBlur.right + bleedOutline.right + drop.bleed.right),
+        bottom: limitDecimals(bleedShadow.bottom + bleedBlur.bottom + bleedOutline.bottom + drop.bleed.bottom),
+        left: limitDecimals(bleedShadow.left + bleedBlur.left + bleedOutline.left + drop.bleed.left)
+      };
+      minX = limitDecimals(minX - bleed.left);
+      minY = limitDecimals(minY - bleed.top);
+      maxX = limitDecimals(maxX + bleed.right);
+      maxY = limitDecimals(maxY + bleed.bottom);
+      const vbW0 = Math.max(1, limitDecimals(maxX - minX));
+      const vbH0 = Math.max(1, limitDecimals(maxY - minY));
+      const scaleW = hasW || hasH ? limitDecimals(w / w0) : 1;
+      const scaleH = hasH || hasW ? limitDecimals(h / h0) : 1;
+      const outW = Math.max(1, limitDecimals(vbW0 * scaleW));
+      const outH = Math.max(1, limitDecimals(vbH0 * scaleH));
+      const svgNS = "http://www.w3.org/2000/svg";
+      const basePad = isSafari() ? 1 : 0;
+      const extraPad = !outerTransforms ? 1 : 0;
+      const pad = limitDecimals(basePad + extraPad);
+      const fo = document.createElementNS(svgNS, "foreignObject");
+      const vbMinX = limitDecimals(minX);
+      const vbMinY = limitDecimals(minY);
+      fo.setAttribute("x", String(limitDecimals(-(vbMinX - pad))));
+      fo.setAttribute("y", String(limitDecimals(-(vbMinY - pad))));
+      fo.setAttribute("width", String(limitDecimals(w0 + pad * 2)));
+      fo.setAttribute("height", String(limitDecimals(h0 + pad * 2)));
+      fo.style.overflow = "visible";
+      const styleTag = document.createElement("style");
+      styleTag.textContent = state.baseCSS + state.fontsCSS + "svg{overflow:visible;} foreignObject{overflow:visible;}" + state.classCSS;
+      fo.appendChild(styleTag);
+      const container = document.createElement("div");
+      container.setAttribute("xmlns", "http://www.w3.org/1999/xhtml");
+      container.style.width = `${limitDecimals(w0)}px`;
+      container.style.height = `${limitDecimals(h0)}px`;
+      container.style.overflow = "visible";
+      state.clone.setAttribute("xmlns", "http://www.w3.org/1999/xhtml");
+      container.appendChild(state.clone);
+      fo.appendChild(container);
+      const serializer = new XMLSerializer();
+      const foString = serializer.serializeToString(fo);
+      const vbW = limitDecimals(vbW0 + pad * 2);
+      const vbH = limitDecimals(vbH0 + pad * 2);
+      const wantsSize = hasW || hasH;
+      options.meta = { w0, h0, vbW, vbH, targetW: w, targetH: h };
+      const svgOutW = isSafari() && wantsSize ? vbW : limitDecimals(outW + pad * 2);
+      const svgOutH = isSafari() && wantsSize ? vbH : limitDecimals(outH + pad * 2);
+      const svgHeader = `<svg xmlns="${svgNS}" width="${svgOutW}" height="${svgOutH}" viewBox="0 0 ${vbW} ${vbH}">`;
+      const svgFooter = "</svg>";
+      svgString = svgHeader + foString + svgFooter;
+      dataURL = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svgString)}`;
+      state = { svgString, dataURL, ...state };
+      resolve();
+    }, { fast });
+  });
+  await runHook("afterRender", state);
+  const sandbox = document.getElementById("snapdom-sandbox");
+  if (sandbox && sandbox.style.position === "absolute") sandbox.remove();
+  return state.dataURL;
+}
+function hasTFBBox(el) {
+  return hasBBoxAffectingTransform(el);
 }
 
-// src/exporters/download.js
-async function download(url, options) {
-  options.dpr = 1;
-  if (options.format === "svg") {
-    const blob = await toBlob(url, { ...options, type: "svg" });
-    const objectURL = URL.createObjectURL(blob);
-    const a2 = document.createElement("a");
-    a2.href = objectURL;
-    a2.download = options.filename;
-    a2.click();
-    URL.revokeObjectURL(objectURL);
-    return;
+// src/core/context.js
+function normalizeCachePolicy(v) {
+  if (typeof v === "string") {
+    const s = v.toLowerCase().trim();
+    if (s === "disabled" || s === "full" || s === "auto" || s === "soft") return (
+      /** @type {CachePolicy} */
+      s
+    );
   }
-  const canvas = await toCanvas(url, options);
-  const a = document.createElement("a");
-  a.href = canvas.toDataURL(`image/${options.format}`, options.quality);
-  a.download = options.filename;
-  a.click();
+  return "soft";
+}
+function createContext(options = {}) {
+  let resolvedFormat = options.format ?? "png";
+  if (resolvedFormat === "jpg") resolvedFormat = "jpeg";
+  const cachePolicy = normalizeCachePolicy(options.cache);
+  return {
+    // Debug & perf
+    debug: options.debug ?? false,
+    fast: options.fast ?? true,
+    scale: options.scale ?? 1,
+    // DOM filters
+    exclude: options.exclude ?? [],
+    excludeMode: options.excludeMode ?? "hide",
+    filter: options.filter ?? null,
+    filterMode: options.filterMode ?? "hide",
+    // Placeholders
+    placeholders: options.placeholders !== false,
+    // default true
+    // Fonts
+    embedFonts: options.embedFonts ?? false,
+    iconFonts: Array.isArray(options.iconFonts) ? options.iconFonts : options.iconFonts ? [options.iconFonts] : [],
+    localFonts: Array.isArray(options.localFonts) ? options.localFonts : [],
+    excludeFonts: options.excludeFonts ?? void 0,
+    fallbackURL: options.fallbackURL ?? void 0,
+    /** @type {CachePolicy} */
+    cache: cachePolicy,
+    // Network
+    useProxy: typeof options.useProxy === "string" ? options.useProxy : "",
+    // Output
+    width: options.width ?? null,
+    height: options.height ?? null,
+    format: resolvedFormat,
+    type: options.type ?? "svg",
+    quality: options.quality ?? 0.92,
+    dpr: options.dpr ?? (window.devicePixelRatio || 1),
+    backgroundColor: options.backgroundColor ?? (["jpeg", "webp"].includes(resolvedFormat) ? "#ffffff" : null),
+    filename: options.filename ?? "snapDOM",
+    // NEW flags (user-friendly)
+    outerTransforms: options.outerTransforms ?? true,
+    outerShadows: options.outerShadows ?? false
+    // Plugins (reservado)
+    // plugins: normalizePlugins(...),
+  };
 }
 
 // src/api/snapdom.js
-snapdom.plugins = (...defs) => {
+init_browser();
+function plugins(...defs) {
   registerPlugins(...defs);
   return snapdom;
-};
+}
+var snapdom = Object.assign(main, { plugins });
 var INTERNAL_TOKEN = Symbol("snapdom.internal");
 var INTERNAL_EXPORT_TOKEN = Symbol("snapdom.internal.silent");
 var _safariWarmup = false;
-async function snapdom(element, userOptions) {
+async function main(element, userOptions) {
   if (!element) throw new Error("Element cannot be null or undefined");
   const context = createContext(userOptions);
   attachSessionPlugins(context, userOptions && userOptions.plugins);
@@ -4572,7 +4925,6 @@ async function snapdom(element, userOptions) {
     for (let i = 0; i < 3; i++) {
       try {
         await safariWarmup(element, userOptions);
-        console.log("safariWarmup:", i);
         _safariWarmup = false;
       } catch {
       }
@@ -4587,32 +4939,76 @@ async function snapdom(element, userOptions) {
   }
   return snapdom.capture(element, context, INTERNAL_TOKEN);
 }
-snapdom.plugins = (...defs) => {
-  registerPlugins(...defs);
-  return snapdom;
-};
 snapdom.capture = async (el, context, _token) => {
   if (_token !== INTERNAL_TOKEN) throw new Error("[snapdom.capture] is internal. Use snapdom(...) instead.");
   const url = await captureDOM(el, context);
   const coreExports = {
-    img: async (ctx, opts) => toImg(url, { ...ctx, ...opts || {} }),
-    svg: async (ctx, opts) => toImg(url, { ...ctx, ...opts || {} }),
-    canvas: async (ctx, opts) => toCanvas(url, { ...ctx, ...opts || {} }),
-    blob: async (ctx, opts) => toBlob(url, { ...ctx, ...opts || {} }),
-    png: async (ctx, opts) => rasterize(url, { ...ctx, ...opts || {}, format: "png" }),
-    jpeg: async (ctx, opts) => rasterize(url, { ...ctx, ...opts || {}, format: "jpeg" }),
-    webp: async (ctx, opts) => rasterize(url, { ...ctx, ...opts || {}, format: "webp" }),
-    download: async (ctx, opts) => download(url, { ...ctx, ...opts || {} })
+    img: async (ctx, opts) => {
+      const { toImg: toImg2 } = await Promise.resolve().then(() => (init_toImg(), toImg_exports));
+      return toImg2(url, { ...ctx, ...opts || {} });
+    },
+    svg: async (ctx, opts) => {
+      const { toSvg } = await Promise.resolve().then(() => (init_toImg(), toImg_exports));
+      return toSvg(url, { ...ctx, ...opts || {} });
+    },
+    canvas: async (ctx, opts) => {
+      const { toCanvas: toCanvas2 } = await Promise.resolve().then(() => (init_toCanvas(), toCanvas_exports));
+      return toCanvas2(url, { ...ctx, ...opts || {} });
+    },
+    blob: async (ctx, opts) => {
+      const { toBlob: toBlob2 } = await Promise.resolve().then(() => (init_toBlob(), toBlob_exports));
+      return toBlob2(url, { ...ctx, ...opts || {} });
+    },
+    png: async (ctx, opts) => {
+      const { rasterize: rasterize2 } = await Promise.resolve().then(() => (init_rasterize(), rasterize_exports));
+      return rasterize2(url, { ...ctx, ...opts || {}, format: "png" });
+    },
+    jpeg: async (ctx, opts) => {
+      const { rasterize: rasterize2 } = await Promise.resolve().then(() => (init_rasterize(), rasterize_exports));
+      return rasterize2(url, { ...ctx, ...opts || {}, format: "jpeg" });
+    },
+    webp: async (ctx, opts) => {
+      const { rasterize: rasterize2 } = await Promise.resolve().then(() => (init_rasterize(), rasterize_exports));
+      return rasterize2(url, { ...ctx, ...opts || {}, format: "webp" });
+    },
+    download: async (ctx, opts) => {
+      const { download: download2 } = await Promise.resolve().then(() => (init_download(), download_exports));
+      return download2(url, { ...ctx, ...opts || {} });
+    }
   };
   const _pluginExports = {
-    svg: (opts) => toImg(url, { ...context, ...opts || {}, [INTERNAL_EXPORT_TOKEN]: true }),
-    canvas: (opts) => toCanvas(url, { ...context, ...opts || {}, [INTERNAL_EXPORT_TOKEN]: true }),
-    png: (opts) => rasterize(url, { ...context, ...opts || {}, format: "png", [INTERNAL_EXPORT_TOKEN]: true }),
-    jpeg: (opts) => rasterize(url, { ...context, ...opts || {}, format: "jpeg", [INTERNAL_EXPORT_TOKEN]: true }),
-    jpg: (opts) => rasterize(url, { ...context, ...opts || {}, format: "jpeg", [INTERNAL_EXPORT_TOKEN]: true }),
-    webp: (opts) => rasterize(url, { ...context, ...opts || {}, format: "webp", [INTERNAL_EXPORT_TOKEN]: true }),
-    blob: (opts) => toBlob(url, { ...context, ...opts || {}, [INTERNAL_EXPORT_TOKEN]: true }),
-    img: (opts) => toImg(url, { ...context, ...opts || {}, [INTERNAL_EXPORT_TOKEN]: true })
+    svg: async (opts) => {
+      const { toSvg } = await Promise.resolve().then(() => (init_toImg(), toImg_exports));
+      return toSvg(url, { ...context, ...opts || {}, [INTERNAL_EXPORT_TOKEN]: true });
+    },
+    canvas: async (opts) => {
+      const { toCanvas: toCanvas2 } = await Promise.resolve().then(() => (init_toCanvas(), toCanvas_exports));
+      return toCanvas2(url, { ...context, ...opts || {}, [INTERNAL_EXPORT_TOKEN]: true });
+    },
+    png: async (opts) => {
+      const { rasterize: rasterize2 } = await Promise.resolve().then(() => (init_rasterize(), rasterize_exports));
+      return rasterize2(url, { ...context, ...opts || {}, format: "png", [INTERNAL_EXPORT_TOKEN]: true });
+    },
+    jpeg: async (opts) => {
+      const { rasterize: rasterize2 } = await Promise.resolve().then(() => (init_rasterize(), rasterize_exports));
+      return rasterize2(url, { ...context, ...opts || {}, format: "jpeg", [INTERNAL_EXPORT_TOKEN]: true });
+    },
+    jpg: async (opts) => {
+      const { rasterize: rasterize2 } = await Promise.resolve().then(() => (init_rasterize(), rasterize_exports));
+      return rasterize2(url, { ...context, ...opts || {}, format: "jpeg", [INTERNAL_EXPORT_TOKEN]: true });
+    },
+    webp: async (opts) => {
+      const { rasterize: rasterize2 } = await Promise.resolve().then(() => (init_rasterize(), rasterize_exports));
+      return rasterize2(url, { ...context, ...opts || {}, format: "webp", [INTERNAL_EXPORT_TOKEN]: true });
+    },
+    blob: async (opts) => {
+      const { toBlob: toBlob2 } = await Promise.resolve().then(() => (init_toBlob(), toBlob_exports));
+      return toBlob2(url, { ...context, ...opts || {}, [INTERNAL_EXPORT_TOKEN]: true });
+    },
+    img: async (opts) => {
+      const { toImg: toImg2 } = await Promise.resolve().then(() => (init_toImg(), toImg_exports));
+      return toImg2(url, { ...context, ...opts || {}, [INTERNAL_EXPORT_TOKEN]: true });
+    }
   };
   const _defineCtx = { ...context, export: { url }, exports: _pluginExports };
   const providedMaps = await runAll("defineExports", _defineCtx);
@@ -4659,10 +5055,9 @@ snapdom.capture = async (el, context, _token) => {
     toBlob: (opts) => runExport("blob", opts),
     toPng: (opts) => runExport("png", opts),
     toJpg: (opts) => runExport("jpg", opts),
-    // ← alias requerido por los tests
+    // alias requerido por tests
     toWebp: (opts) => runExport("webp", opts),
     download: (opts) => runExport("download", opts)
-    // ← método directo (no toDownload)
   };
   for (const key of Object.keys(exportsMap)) {
     const helper = "to" + key.charAt(0).toUpperCase() + key.slice(1);
@@ -4752,6 +5147,9 @@ function hasBackgroundOrMask(el) {
 }
 
 // src/api/preCache.js
+init_utils();
+init_snapFetch();
+init_cache();
 async function preCache(root = document, options = {}) {
   const {
     embedFonts = true,