pptx-react-viewer 1.22.1 → 1.23.0

package/dist/{chunk-AD3EAEY6.js → chunk-MS6S6YYR.js}

@@ -9,7 +9,24 @@ var JSZip6__default = /*#__PURE__*/_interopDefault(JSZip6);
 
 // ../core/dist/index.mjs
 
-// ../../node_modules/.bun/mtx-decompressor@1.4.2/node_modules/mtx-decompressor/dist/index.mjs
+// ../../node_modules/.bun/mtx-decompressor@1.6.0/node_modules/mtx-decompressor/dist/index.mjs
+var WARNING_CODES = /* @__PURE__ */ new Set([
+  "WARN_BAD_VERSION"
+  /* WarnBadVersion */
+]);
+var EotError = class _EotError extends Error {
+  code;
+  constructor(code, message) {
+    super(message);
+    this.name = "EotError";
+    this.code = code;
+    Object.setPrototypeOf(this, _EotError.prototype);
+  }
+  /** True when this represents a recoverable warning rather than a fatal error. */
+  get isWarning() {
+    return WARNING_CODES.has(this.code);
+  }
+};
 var Stream = class _Stream {
   buf;
   size;
@@ -49,7 +66,26 @@ var Stream = class _Stream {
     this.buf = newBuf;
     this.reserved = n;
   }
+  /**
+   * Reject byte-level access while the stream sits mid-byte (`bitPos != 0`).
+   *
+   * libeot returns `EOT_OFF_BYTE_BOUNDARY` for any byte read/write/seek issued
+   * before a partial byte has been consumed. The bit-level reader
+   * ({@link readNBits}) is the sole legitimate mid-byte accessor and bypasses
+   * this guard by touching `buf`/`pos` directly. On valid input the only
+   * `readNBits` caller consumes whole bytes per point, so the stream is always
+   * byte-aligned when a byte accessor runs and this guard never fires.
+   */
+  ensureByteAligned() {
+    if (this.bitPos !== 0) {
+      throw new EotError(
+        "OFF_BYTE_BOUNDARY",
+        `Stream: byte-level access at a non-byte boundary (bitPos=${this.bitPos}, pos=${this.pos})`
+      );
+    }
+  }
   ensureWrite(n) {
+    this.ensureByteAligned();
     const needed = this.pos + n;
     if (needed > this.reserved) {
       this.reserve(Math.max(needed, this.reserved * 2 || 256));
@@ -59,6 +95,7 @@ var Stream = class _Stream {
     }
   }
   ensureRead(n) {
+    this.ensureByteAligned();
     if (this.pos + n > this.size) {
       throw new Error(
         `Stream: not enough data (need ${n} bytes at pos ${this.pos}, size ${this.size})`
@@ -66,14 +103,18 @@ var Stream = class _Stream {
     }
   }
   // --- Seek ---
+  // A seek requires the stream to be byte-aligned and never clears `bitPos`
+  // itself (mirroring libeot, which refuses to seek mid-byte rather than
+  // silently re-aligning). The alignment guard leaves `bitPos` at 0.
   seekAbsolute(pos2) {
+    this.ensureByteAligned();
     if (pos2 > this.size) {
       throw new Error(`Stream: seek past end (${pos2} > ${this.size})`);
     }
     this.pos = pos2;
-    this.bitPos = 0;
   }
   seekRelative(offset) {
+    this.ensureByteAligned();
     const newPos = this.pos + offset;
     if (newPos < 0) {
       throw new Error("Stream: negative seek");
@@ -82,17 +123,23 @@ var Stream = class _Stream {
       throw new Error("Stream: seek past end");
     }
     this.pos = newPos;
-    this.bitPos = 0;
   }
+  // Seek into already-reserved-but-unwritten space, extending `size` up to the
+  // seek target. libeot returns `EOT_SEEK_PAST_EOS` when the target exceeds the
+  // reserved capacity; we mirror that rather than growing the buffer, so an
+  // over-reach surfaces as a failure instead of a silent realloc.
   seekAbsoluteThroughReserve(pos2) {
+    this.ensureByteAligned();
     if (pos2 > this.reserved) {
-      this.reserve(pos2);
+      throw new EotError(
+        "SEEK_PAST_EOS",
+        `Stream: seek to ${pos2} past reserved end (${this.reserved})`
+      );
     }
     if (pos2 > this.size) {
       this.size = pos2;
     }
     this.pos = pos2;
-    this.bitPos = 0;
   }
   seekRelativeThroughReserve(offset) {
     this.seekAbsoluteThroughReserve(this.pos + offset);
@@ -146,6 +193,9 @@ var Stream = class _Stream {
     this.buf[this.pos++] = v & 255;
   }
   writeU24(v) {
+    if (v < 0 || v > 16777215) {
+      throw new Error(`Stream: writeU24 value out of range: ${v}`);
+    }
     this.ensureWrite(3);
     this.buf[this.pos++] = v >> 16 & 255;
     this.buf[this.pos++] = v >> 8 & 255;
@@ -169,6 +219,9 @@ var Stream = class _Stream {
     if (n === 0) {
       return 0;
     }
+    if (n > 32) {
+      throw new Error(`Stream: readNBits width out of range: ${n} (max 32)`);
+    }
     let value = 0;
     let bitsRemaining = n;
     while (bitsRemaining > 0) {
@@ -187,18 +240,36 @@ var Stream = class _Stream {
       }
       bitsRemaining -= bitsToRead;
     }
-    return value;
+    return value >>> 0;
   }
   // --- Copy ---
-  /** Copy `length` bytes from this stream to `dest`. */
+  /**
+   * Copy `length` bytes from this stream to `dest`.
+   *
+   * Both streams must be byte-aligned. The destination must already have the
+   * capacity reserved: libeot returns `EOT_OUT_OF_RESERVED_SPACE` when a copy
+   * would overrun the reserved buffer, so we throw rather than auto-growing —
+   * an under-reservation is a bug we want surfaced, not silently patched.
+   */
   copyTo(dest, length) {
+    this.ensureByteAligned();
+    dest.ensureByteAligned();
     if (this.pos + length > this.size) {
       throw new Error("Stream: not enough data for copy");
     }
-    dest.ensureWrite(length);
+    const needed = dest.pos + length;
+    if (needed > dest.reserved) {
+      throw new EotError(
+        "OUT_OF_RESERVED_SPACE",
+        `Stream: copy of ${length} bytes exceeds reserved capacity (need ${needed}, reserved ${dest.reserved})`
+      );
+    }
     dest.buf.set(this.buf.subarray(this.pos, this.pos + length), dest.pos);
     this.pos += length;
     dest.pos += length;
+    if (dest.pos > dest.size) {
+      dest.size = dest.pos;
+    }
   }
   /** Read rest of data as 4-byte-aligned U32 values. Returns 0 on incomplete read. */
   readRestAsU32() {
@@ -219,19 +290,27 @@ var Stream = class _Stream {
     }
     return this.readU32();
   }
-  /** Compute checksum of bytes from beginPos to endPos as 4-byte aligned U32 sum. */
+  /**
+   * Compute the SFNT-style checksum of bytes in `[beginPos, endPos)` as a sum
+   * of big-endian U32 words, zero-padding a final partial word. Bounds strictly
+   * on `endPos` (not the stream's `size`), so an unaligned range never folds in
+   * bytes past `endPos`. Leaves the stream position unchanged.
+   */
   checksumU32(beginPos, endPos) {
+    if (beginPos > endPos) {
+      throw new Error(`Stream: checksumU32 beginPos ${beginPos} > endPos ${endPos}`);
+    }
+    if (endPos > this.size) {
+      throw new Error(`Stream: checksumU32 endPos ${endPos} exceeds size ${this.size}`);
+    }
     let sum = 0;
-    const savedPos = this.pos;
-    this.pos = beginPos;
-    while (this.pos < endPos) {
-      const chunk = this.readRestAsU32();
-      if (chunk === null) {
-        break;
+    for (let p = beginPos; p < endPos; p += 4) {
+      let word = 0;
+      for (let i = 0; i < 4; i++) {
+        word = word << 8 | (p + i < endPos ? this.buf[p + i] : 0);
       }
-      sum = sum + chunk >>> 0;
+      sum = sum + (word >>> 0) >>> 0;
     }
-    this.pos = savedPos;
     return sum;
   }
   /** Get a copy of the written data. */
@@ -431,10 +510,9 @@ function read255Short(s) {
 }
 function unpackCVT(table, sIn) {
   sIn.seekAbsolute(table.offset);
-  const tableLength = sIn.readU16();
-  const numEntries = tableLength >>> 1;
+  const numEntries = sIn.readU16();
   const out = new Stream(null, 0);
-  out.reserve(tableLength);
+  out.reserve(numEntries * 2);
   let lastValue = 0;
   for (let i = 0; i < numEntries; i++) {
     const code = sIn.readU8();
@@ -506,7 +584,13 @@ function decodePushInstructions(sIn, sOut, pushCount) {
   }
   while (remaining > 0) {
     const code = sIn.peekU8();
-    if (code === 251 && remaining >= 3 && data.length >= 2) {
+    if (code === 251) {
+      if (remaining < 3 || data.length < 2) {
+        throw new EotError(
+          "CORRUPT_HOPCODE_DATA",
+          `corrupt hop3 (0xFB) push data: remaining=${remaining}, decoded=${data.length}`
+        );
+      }
       sIn.readU8();
       const prev = data[data.length - 2];
       put(prev);
@@ -514,7 +598,13 @@ function decodePushInstructions(sIn, sOut, pushCount) {
       put(val);
       put(prev);
       remaining -= 3;
-    } else if (code === 252 && remaining >= 5 && data.length >= 2) {
+    } else if (code === 252) {
+      if (remaining < 5 || data.length < 2) {
+        throw new EotError(
+          "CORRUPT_HOPCODE_DATA",
+          `corrupt hop4 (0xFC) push data: remaining=${remaining}, decoded=${data.length}`
+        );
+      }
       sIn.readU8();
       const prev = data[data.length - 2];
       put(prev);
@@ -608,8 +698,8 @@ function decodeSimpleGlyph(numContours, streams, out, calcBBox, minX, minY, maxX
     }
     xDeltas[i] = dx;
     yDeltas[i] = dy;
-    cumulativeX += dx;
-    cumulativeY += dy;
+    cumulativeX += xDeltas[i];
+    cumulativeY += yDeltas[i];
     if (calcBBox) {
       if (cumulativeX < minX) {
         minX = cumulativeX;
@@ -813,8 +903,9 @@ function parseMaxp(table) {
     maxComponentElements
   };
 }
-function parseCTF(streams) {
+function parseCTF(streams, options) {
   const s0 = streams[0];
+  const droppedTables = [];
   s0.readU32();
   const numTables = s0.readU16();
   s0.readU16();
@@ -825,10 +916,13 @@ function parseCTF(streams) {
   let locaIdx = -1;
   let maxpIdx = -1;
   let headIdx = -1;
+  let hmtxIdx = -1;
   for (let i = 0; i < numTables; i++) {
     const tag = s0.readChar() + s0.readChar() + s0.readChar() + s0.readChar();
     if (tag === "hdmx" || tag === "VDMX") {
       s0.seekRelative(12);
+      droppedTables.push(tag);
+      options?.onWarn?.(`Ignoring ${tag} table \u2014 MTX does not preserve it`);
       continue;
     }
     s0.seekRelative(4);
@@ -851,6 +945,8 @@ function parseCTF(streams) {
       maxpIdx = idx;
     } else if (tag === "head") {
       headIdx = idx;
+    } else if (tag === "hmtx") {
+      hmtxIdx = idx;
     } else ;
   }
   for (let i = 0; i < tables.length; i++) {
@@ -869,26 +965,29 @@ function parseCTF(streams) {
     }
     table.buf = buf;
     if (table.tag === "head") {
+      if (table.bufSize < 12) {
+        throw new EotError(
+          "MALFORMED_HEAD_TABLE",
+          `head table too small: ${table.bufSize} bytes (need at least 12)`
+        );
+      }
       table.buf[8] = 0;
       table.buf[9] = 0;
       table.buf[10] = 0;
       table.buf[11] = 0;
     }
   }
-  let headData = { indexToLocFormat: 0 };
-  if (headIdx >= 0) {
-    headData = parseHead(tables[headIdx]);
+  if (maxpIdx < 0) {
+    throw new EotError("NO_MAXP_TABLE", "CTF font is missing a maxp table");
   }
-  let maxpData = {
-    numGlyphs: 0,
-    maxPoints: 0,
-    maxContours: 0,
-    maxSizeOfInstructions: 0,
-    maxComponentElements: 0
-  };
-  if (maxpIdx >= 0) {
-    maxpData = parseMaxp(tables[maxpIdx]);
+  if (headIdx < 0) {
+    throw new EotError("NO_HEAD_TABLE", "CTF font is missing a head table");
   }
+  if (hmtxIdx < 0) {
+    throw new EotError("NO_HMTX_TABLE", "CTF font is missing an hmtx table");
+  }
+  const headData = parseHead(tables[headIdx]);
+  const maxpData = parseMaxp(tables[maxpIdx]);
   if (glyfIdx >= 0) {
     if (locaIdx < 0) {
       const locaTable = {
@@ -903,11 +1002,11 @@ function parseCTF(streams) {
     }
     populateGlyfAndLoca(tables[glyfIdx], tables[locaIdx], headData, maxpData, streams);
   }
-  return { tables };
+  return droppedTables.length > 0 ? { tables, droppedTables } : { tables };
 }
 function bitsUsed(x) {
   if (x <= 0) {
-    return 0;
+    return 1;
   }
   return 32 - Math.clz32(x);
 }
@@ -1099,12 +1198,15 @@ var BitIO = class {
   /**
    * @param data   Source byte buffer.
    * @param offset Starting byte offset into `data`.
-   * @param size   Number of bytes available from `offset`.
+   * @param size   Absolute end index into `data` (exclusive) — reading stops
+   *               once `index` reaches it. Defaults to `data.length`. Clamped
+   *               to `data.length` so an over-large value cannot read past the
+   *               end of the buffer and silently yield zero bits.
    */
   constructor(data, offset = 0, size) {
     this.data = data;
     this.index = offset;
-    this.size = size ?? data.length;
+    this.size = Math.min(size ?? data.length, data.length);
   }
   /**
    * Read a single bit from the stream.
@@ -1117,13 +1219,14 @@ var BitIO = class {
    *     shifted out of the original byte value).
    */
   inputBit() {
-    if (this.bitCount-- === 0) {
+    if (this.bitCount === 0) {
       if (this.index >= this.size) {
         throw new Error("BitIO: end of data");
       }
       this.bitBuffer = this.data[this.index++];
-      this.bitCount = 7;
+      this.bitCount = 8;
     }
+    this.bitCount--;
     this.bitBuffer <<= 1;
     return (this.bitBuffer & 256) !== 0;
   }
@@ -1141,7 +1244,7 @@ var BitIO = class {
         value |= 1;
       }
     }
-    return value;
+    return value >>> 0;
   }
 };
 var LEN_WIDTH = 3;
@@ -1151,8 +1254,8 @@ var MAX_2BYTE_DIST = 512;
 var PRELOAD_SIZE = 2 * 32 * 96 + 4 * 256;
 var LEN_MIN = 2;
 var DIST_MIN = 1;
-var MAX_OUT_LEN = 4 * 1024 * 1024;
-var MAX_OUT = 16 * 1024 * 1024;
+var MAX_OUT_LEN = (1 << 24) - 1;
+var MAX_OUT = 64 * 1024 * 1024;
 var RLE_INITIAL = 0;
 var RLE_NORMAL = 1;
 var RLE_SEEN_ESCAPE = 2;
@@ -1324,7 +1427,8 @@ function lzcompDecompress(data, size, version) {
       }
     }
   };
-  for (let pos2 = 0; pos2 < outLen; ) {
+  let pos2 = 0;
+  for (; pos2 < outLen; ) {
     const symbol = symEcoder.readSymbol();
     let value;
     if (symbol < 256) {
@@ -1355,6 +1459,12 @@ function lzcompDecompress(data, size, version) {
     pos2++;
     emitByte(value);
   }
+  if (pos2 !== outLen) {
+    throw new EotError(
+      "MTX_ERROR",
+      `LZCOMP decode overran output: pos=${pos2}, expected=${outLen}`
+    );
+  }
   return outBuf.subarray(0, outIdx);
 }
 function lgFloor(n) {
@@ -1458,14 +1568,18 @@ function dumpContainer(ctr) {
     beginningChecksum = beginningChecksum + word >>> 0;
   }
   totalChecksum = totalChecksum + beginningChecksum >>> 0;
-  const finalChecksum = 2981146554 - totalChecksum >>> 0;
-  if (headTable) {
-    const adjOffset = headTable.offset + 8;
-    buf[adjOffset] = finalChecksum >>> 24 & 255;
-    buf[adjOffset + 1] = finalChecksum >>> 16 & 255;
-    buf[adjOffset + 2] = finalChecksum >>> 8 & 255;
-    buf[adjOffset + 3] = finalChecksum & 255;
+  if (!headTable) {
+    throw new EotError(
+      "NO_HEAD_TABLE",
+      "cannot assemble SFNT: container is missing a head table"
+    );
   }
+  const finalChecksum = 2981146554 - totalChecksum >>> 0;
+  const adjOffset = headTable.offset + 8;
+  buf[adjOffset] = finalChecksum >>> 24 & 255;
+  buf[adjOffset + 1] = finalChecksum >>> 16 & 255;
+  buf[adjOffset + 2] = finalChecksum >>> 8 & 255;
+  buf[adjOffset + 3] = finalChecksum & 255;
   out.pos = afterTables;
   return out.buf.subarray(0, out.pos);
 }
@@ -1511,14 +1625,64 @@ function decompressMtx(fontData, options) {
   }
   const { streams } = unpackMtx(data, data.length);
   const streamObjects = streams.map((buf) => new Stream(buf, buf.length));
-  const container = parseCTF(streamObjects);
+  const container = parseCTF(streamObjects, { onWarn: options?.onWarn });
   return dumpContainer(container);
 }
 function decompressEotFont(fontData, compressed, encrypted) {
   return decompressMtx(fontData, { encrypted});
 }
 
-// ../../node_modules/.bun/emf-converter@1.5.0/node_modules/emf-converter/dist/index.mjs
+// ../../node_modules/.bun/emf-converter@1.6.0/node_modules/emf-converter/dist/index.mjs
+function colorRefToHex(r, g, b) {
+  const toHex3 = (v) => v.toString(16).padStart(2, "0");
+  return `#${toHex3(r & 255)}${toHex3(g & 255)}${toHex3(b & 255)}`;
+}
+function readColorRef(view, offset) {
+  const r = view.getUint8(offset);
+  const g = view.getUint8(offset + 1);
+  const b = view.getUint8(offset + 2);
+  return colorRefToHex(r, g, b);
+}
+function argbToRgba(argb) {
+  const a = (argb >>> 24 & 255) / 255;
+  const r = argb >>> 16 & 255;
+  const g = argb >>> 8 & 255;
+  const b = argb & 255;
+  return `rgba(${r},${g},${b},${a.toFixed(3)})`;
+}
+function lerpArgbToRgba(argbA, argbB, t) {
+  const tc = Math.min(1, Math.max(0, t));
+  const mix = (a2, b2) => Math.round(a2 + (b2 - a2) * tc);
+  const aA = argbA >>> 24 & 255;
+  const aB = argbB >>> 24 & 255;
+  const r = mix(argbA >>> 16 & 255, argbB >>> 16 & 255);
+  const g = mix(argbA >>> 8 & 255, argbB >>> 8 & 255);
+  const b = mix(argbA & 255, argbB & 255);
+  const a = mix(aA, aB) / 255;
+  return `rgba(${r},${g},${b},${a.toFixed(3)})`;
+}
+function invertCssColor(color2) {
+  const hex10 = /^#([0-9a-f]{6})$/i.exec(color2);
+  if (hex10) {
+    const v = parseInt(hex10[1], 16);
+    const inv = 16777215 ^ v;
+    return `#${inv.toString(16).padStart(6, "0")}`;
+  }
+  const shortHex = /^#([0-9a-f]{3})$/i.exec(color2);
+  if (shortHex) {
+    const [r, g, b] = shortHex[1].split("").map((c) => parseInt(c + c, 16));
+    const toHex3 = (v) => (255 - v).toString(16).padStart(2, "0");
+    return `#${toHex3(r)}${toHex3(g)}${toHex3(b)}`;
+  }
+  const rgba = /^rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*(?:,\s*([\d.]+)\s*)?\)$/i.exec(color2);
+  if (rgba) {
+    const r = 255 - Math.min(255, parseInt(rgba[1], 10));
+    const g = 255 - Math.min(255, parseInt(rgba[2], 10));
+    const b = 255 - Math.min(255, parseInt(rgba[3], 10));
+    return rgba[4] !== void 0 ? `rgba(${r},${g},${b},${rgba[4]})` : `rgb(${r},${g},${b})`;
+  }
+  return color2;
+}
 var EMR_HEADER = 1;
 var EMR_POLYBEZIER = 2;
 var EMR_POLYGON = 3;
@@ -1539,10 +1703,21 @@ var EMR_SETBKMODE = 18;
 var EMR_SETPOLYFILLMODE = 19;
 var EMR_SETROP2 = 20;
 var EMR_SETSTRETCHBLTMODE = 21;
+var R2_BLACK = 1;
+var R2_NOTMERGEPEN = 2;
+var R2_MASKNOTPEN = 3;
+var R2_NOTCOPYPEN = 4;
+var R2_MASKPENNOT = 5;
 var R2_NOT = 6;
 var R2_XORPEN = 7;
+var R2_NOTMASKPEN = 8;
 var R2_MASKPEN = 9;
+var R2_NOTXORPEN = 10;
+var R2_NOP = 11;
+var R2_MERGENOTPEN = 12;
+var R2_MERGEPENNOT = 14;
 var R2_MERGEPEN = 15;
+var R2_WHITE = 16;
 var MAX_CANVAS_DIMENSION = 8192;
 var MAX_RECORDS_DEFAULT = 2e5;
 var MAX_RECORDS_EMFPLUS_DEFAULT = 5e5;
@@ -1773,28 +1948,61 @@ function createTempCanvas(width, height) {
   }
   return null;
 }
-function rop2ToGco(rop2) {
+function rop2Paint(rop2) {
   switch (rop2) {
+    case R2_BLACK:
+      return { gco: "source-over", colorTransform: "black", exact: true };
+    case R2_WHITE:
+      return { gco: "source-over", colorTransform: "white", exact: true };
+    case R2_NOP:
+      return { gco: "source-over", colorTransform: "skip", exact: true };
+    case R2_NOTCOPYPEN:
+      return { gco: "source-over", colorTransform: "invert", exact: true };
+    case R2_NOT:
+      return { gco: "difference", colorTransform: "white", exact: true };
     case R2_XORPEN:
-      return "xor";
+    case R2_MASKPENNOT:
+      return { gco: "difference", colorTransform: "none", exact: false };
+    case R2_NOTXORPEN:
+      return { gco: "difference", colorTransform: "invert", exact: false };
     case R2_MASKPEN:
-      return "multiply";
+      return { gco: "darken", colorTransform: "none", exact: false };
+    case R2_MASKNOTPEN:
+    case R2_NOTMERGEPEN:
+      return { gco: "darken", colorTransform: "invert", exact: false };
     case R2_MERGEPEN:
-      return "lighten";
-    case R2_NOT:
-      return "difference";
+    case R2_MERGEPENNOT:
+      return { gco: "lighten", colorTransform: "none", exact: false };
+    case R2_MERGENOTPEN:
+    case R2_NOTMASKPEN:
+      return { gco: "lighten", colorTransform: "invert", exact: false };
     default:
-      return "source-over";
+      return { gco: "source-over", colorTransform: "none", exact: true };
+  }
+}
+function rop2TransformColor(color2, transform) {
+  switch (transform) {
+    case "invert":
+      return invertCssColor(color2);
+    case "black":
+      return "#000000";
+    case "white":
+      return "#ffffff";
+    case "skip":
+      return "rgba(0,0,0,0)";
+    default:
+      return color2;
   }
 }
 function applyPen(ctx, state) {
-  ctx.globalCompositeOperation = rop2ToGco(state.rop2);
+  const paint = rop2Paint(state.rop2);
+  ctx.globalCompositeOperation = paint.gco;
   if (state.penStyle === 5) {
     ctx.strokeStyle = "rgba(0,0,0,0)";
     ctx.lineWidth = 0;
     return;
   }
-  ctx.strokeStyle = state.penColor;
+  ctx.strokeStyle = rop2TransformColor(state.penColor, paint.colorTransform);
   ctx.lineWidth = Math.max(state.penWidth, 1);
   switch (state.penStyle) {
     case 1:
@@ -1815,12 +2023,13 @@ function applyPen(ctx, state) {
   }
 }
 function applyBrush(ctx, state) {
-  ctx.globalCompositeOperation = rop2ToGco(state.rop2);
+  const paint = rop2Paint(state.rop2);
+  ctx.globalCompositeOperation = paint.gco;
   if (state.brushStyle === 1) {
     ctx.fillStyle = "rgba(0,0,0,0)";
     return;
   }
-  ctx.fillStyle = state.brushColor;
+  ctx.fillStyle = rop2TransformColor(state.brushColor, paint.colorTransform);
 }
 function cssFontWeight(weight) {
   if (!weight || weight === 400) {
@@ -2051,46 +2260,35 @@ function parseWmfHeader(view) {
     unitsPerInch
   };
 }
-function colorRefToHex(r, g, b) {
-  const toHex3 = (v) => v.toString(16).padStart(2, "0");
-  return `#${toHex3(r & 255)}${toHex3(g & 255)}${toHex3(b & 255)}`;
-}
-function readColorRef(view, offset) {
-  const r = view.getUint8(offset);
-  const g = view.getUint8(offset + 1);
-  const b = view.getUint8(offset + 2);
-  return colorRefToHex(r, g, b);
-}
-function argbToRgba(argb) {
-  const a = (argb >>> 24 & 255) / 255;
-  const r = argb >>> 16 & 255;
-  const g = argb >>> 8 & 255;
-  const b = argb & 255;
-  return `rgba(${r},${g},${b},${a.toFixed(3)})`;
-}
 function gmx(r, x) {
+  const wt = r.state.worldTransform;
+  const px2 = wt[0] * x + wt[4];
   if (r.useMappingMode) {
-    return (x - r.windowOrg.x) / (r.windowExt.cx || 1) * (r.viewportExt.cx || 1) + r.viewportOrg.x;
+    return (px2 - r.windowOrg.x) / (r.windowExt.cx || 1) * (r.viewportExt.cx || 1) + r.viewportOrg.x;
   }
-  return (x - r.bounds.left) * r.sx;
+  return (px2 - r.bounds.left) * r.sx;
 }
 function gmy(r, y) {
+  const wt = r.state.worldTransform;
+  const py = wt[3] * y + wt[5];
   if (r.useMappingMode) {
-    return (y - r.windowOrg.y) / (r.windowExt.cy || 1) * (r.viewportExt.cy || 1) + r.viewportOrg.y;
+    return (py - r.windowOrg.y) / (r.windowExt.cy || 1) * (r.viewportExt.cy || 1) + r.viewportOrg.y;
   }
-  return (y - r.bounds.top) * r.sy;
+  return (py - r.bounds.top) * r.sy;
 }
 function gmw(r, w) {
+  const pw = r.state.worldTransform[0] * w;
   if (r.useMappingMode) {
-    return w / (r.windowExt.cx || 1) * (r.viewportExt.cx || 1);
+    return pw / (r.windowExt.cx || 1) * (r.viewportExt.cx || 1);
   }
-  return w * r.sx;
+  return pw * r.sx;
 }
 function gmh(r, h) {
+  const ph = r.state.worldTransform[3] * h;
   if (r.useMappingMode) {
-    return h / (r.windowExt.cy || 1) * (r.viewportExt.cy || 1);
+    return ph / (r.windowExt.cy || 1) * (r.viewportExt.cy || 1);
   }
-  return h * r.sy;
+  return ph * r.sy;
 }
 function activateGdiMappingMode(r) {
   r.useMappingMode = true;
@@ -2291,6 +2489,216 @@ function handleEmfGdiShapeRecord(rCtx, recType, dataOff, recSize) {
       return false;
   }
 }
+var CLIP_HUGE = 1 << 24;
+function rectClipShape(x, y, w, h) {
+  return { cmds: [{ op: "rect", x, y, w, h }], fillRule: "nonzero", simple: true };
+}
+function rectsClipShape(rects) {
+  return {
+    cmds: rects.map((r) => ({ op: "rect", x: r.x, y: r.y, w: r.w, h: r.h })),
+    fillRule: "nonzero",
+    simple: true
+  };
+}
+function emptyClipShape() {
+  return { cmds: [{ op: "rect", x: 0, y: 0, w: 0, h: 0 }], fillRule: "nonzero", simple: true };
+}
+function translateClipShape(shape, dx, dy) {
+  return {
+    ...shape,
+    cmds: shape.cmds.map((c) => {
+      switch (c.op) {
+        case "rect":
+          return { ...c, x: c.x + dx, y: c.y + dy };
+        case "moveTo":
+        case "lineTo":
+          return { ...c, x: c.x + dx, y: c.y + dy };
+        case "bezierCurveTo":
+          return {
+            ...c,
+            cp1x: c.cp1x + dx,
+            cp1y: c.cp1y + dy,
+            cp2x: c.cp2x + dx,
+            cp2y: c.cp2y + dy,
+            x: c.x + dx,
+            y: c.y + dy
+          };
+        case "closePath":
+          return c;
+      }
+    })
+  };
+}
+function translateClipRegion(region, dx, dy) {
+  if (!region) {
+    return null;
+  }
+  return region.map((s) => translateClipShape(s, dx, dy));
+}
+function isComposable(shape) {
+  return shape.simple && shape.fillRule === "nonzero";
+}
+function invertClipShape(shape) {
+  return {
+    cmds: [
+      { op: "rect", x: -CLIP_HUGE, y: -CLIP_HUGE, w: 2 * CLIP_HUGE, h: 2 * CLIP_HUGE },
+      ...shape.cmds
+    ],
+    fillRule: "evenodd",
+    simple: false
+  };
+}
+function combineClip(current, shape, op) {
+  switch (op) {
+    case "replace":
+      return { region: [shape], exact: true };
+    case "intersect":
+      return { region: current ? [...current, shape] : [shape], exact: true };
+    case "exclude": {
+      if (!isComposable(shape)) {
+        return { region: current ? [...current, shape] : [shape], exact: false };
+      }
+      const inv = invertClipShape(shape);
+      return { region: current ? [...current, inv] : [inv], exact: true };
+    }
+    case "union": {
+      if (!current) {
+        return { region: null, exact: true };
+      }
+      if (current.length === 1 && isComposable(current[0]) && isComposable(shape)) {
+        return {
+          region: [
+            { cmds: [...current[0].cmds, ...shape.cmds], fillRule: "nonzero", simple: false }
+          ],
+          exact: false
+        };
+      }
+      return { region: current, exact: false };
+    }
+    case "xor": {
+      if (!current) {
+        if (isComposable(shape)) {
+          return { region: [invertClipShape(shape)], exact: true };
+        }
+        return { region: [shape], exact: false };
+      }
+      if (current.length === 1 && isComposable(current[0]) && isComposable(shape)) {
+        return {
+          region: [
+            { cmds: [...current[0].cmds, ...shape.cmds], fillRule: "evenodd", simple: false }
+          ],
+          exact: true
+        };
+      }
+      if (isComposable(shape)) {
+        return { region: [...current, invertClipShape(shape)], exact: false };
+      }
+      return { region: [...current, shape], exact: false };
+    }
+    case "complement": {
+      if (!current) {
+        return { region: [emptyClipShape()], exact: true };
+      }
+      if (current.length === 1 && isComposable(current[0])) {
+        return { region: [shape, invertClipShape(current[0])], exact: true };
+      }
+      return { region: [shape], exact: false };
+    }
+  }
+}
+function combineClipRegions(current, incoming, op) {
+  if (op === "replace") {
+    return { region: incoming, exact: true };
+  }
+  if (incoming && incoming.length === 1) {
+    return combineClip(current, incoming[0], op);
+  }
+  if (!incoming) {
+    switch (op) {
+      case "intersect":
+        return { region: current, exact: true };
+      case "union":
+        return { region: null, exact: true };
+      case "exclude":
+        return { region: [emptyClipShape()], exact: true };
+      case "xor":
+      case "complement": {
+        if (!current) {
+          return { region: [emptyClipShape()], exact: true };
+        }
+        if (current.length === 1) {
+          return combineClip(null, current[0], "exclude");
+        }
+        return { region: current, exact: false };
+      }
+    }
+  }
+  switch (op) {
+    case "intersect":
+      return { region: current ? [...current, ...incoming] : incoming, exact: true };
+    case "union":
+      return { region: current, exact: false };
+    case "xor":
+      return { region: current ?? incoming, exact: false };
+    case "exclude":
+      return { region: current, exact: false };
+    case "complement": {
+      if (!current) {
+        return { region: [emptyClipShape()], exact: true };
+      }
+      if (current.length === 1) {
+        return combineClip(incoming, current[0], "exclude");
+      }
+      return { region: incoming, exact: false };
+    }
+  }
+}
+function replayClipCmds(ctx, cmds) {
+  for (const c of cmds) {
+    switch (c.op) {
+      case "rect":
+        ctx.rect(c.x, c.y, c.w, c.h);
+        break;
+      case "moveTo":
+        ctx.moveTo(c.x, c.y);
+        break;
+      case "lineTo":
+        ctx.lineTo(c.x, c.y);
+        break;
+      case "bezierCurveTo":
+        ctx.bezierCurveTo(c.cp1x, c.cp1y, c.cp2x, c.cp2y, c.x, c.y);
+        break;
+      case "closePath":
+        ctx.closePath();
+        break;
+    }
+  }
+}
+function applyClipShapes(ctx, shapes) {
+  for (const s of shapes) {
+    ctx.beginPath();
+    replayClipCmds(ctx, s.cmds);
+    try {
+      ctx.clip(s.fillRule);
+    } catch {
+    }
+  }
+}
+function reapplyClipRegion(holder, region, identityTransform = false) {
+  const { ctx } = holder;
+  while (holder.clipSaveDepth > 0) {
+    ctx.restore();
+    holder.clipSaveDepth--;
+  }
+  if (region) {
+    ctx.save();
+    holder.clipSaveDepth = 1;
+    if (identityTransform) {
+      ctx.setTransform(1, 0, 0, 1, 0, 0);
+    }
+    applyClipShapes(ctx, region);
+  }
+}
 function decodeRleBitmap(view, bitsOffset, bitsSize, width, height, _topDown, isRle4, colorTable, out, setPixel) {
   let x = 0;
   let y = height - 1;
@@ -2711,86 +3119,134 @@ function handleStretchDibits(rCtx, offset, dataOff, recSize) {
   }
   return true;
 }
+function gdiCombineClip(rCtx, shape, op) {
+  const { ctx } = rCtx;
+  if (rCtx.clipUntracked && op !== "replace") {
+    switch (op) {
+      case "intersect":
+      case "complement": {
+        ctx.save();
+        rCtx.clipSaveDepth++;
+        applyClipShapes(ctx, [shape]);
+        return;
+      }
+      case "exclude":
+      case "xor": {
+        const inv = combineClip(null, shape, "exclude");
+        ctx.save();
+        rCtx.clipSaveDepth++;
+        applyClipShapes(ctx, inv.region ?? [shape]);
+        return;
+      }
+      case "union":
+        return;
+    }
+  }
+  const res = combineClip(op === "replace" ? null : rCtx.clipRegion ?? null, shape, op);
+  if (!res.exact) ;
+  rCtx.clipRegion = res.region;
+  rCtx.clipUntracked = false;
+  reapplyClipRegion(rCtx, res.region);
+}
+function readClipRectShape(rCtx, dataOff) {
+  const { view } = rCtx;
+  const left = view.getInt32(dataOff, true);
+  const top = view.getInt32(dataOff + 4, true);
+  const right = view.getInt32(dataOff + 8, true);
+  const bottom = view.getInt32(dataOff + 12, true);
+  return rectClipShape(
+    gmx(rCtx, left),
+    gmy(rCtx, top),
+    gmw(rCtx, right - left),
+    gmh(rCtx, bottom - top)
+  );
+}
 function handleIntersectClipRect(rCtx, dataOff, recSize) {
-  const { ctx, view } = rCtx;
   if (recSize >= 24) {
-    const left = view.getInt32(dataOff, true);
-    const top = view.getInt32(dataOff + 4, true);
-    const right = view.getInt32(dataOff + 8, true);
-    const bottom = view.getInt32(dataOff + 12, true);
-    ctx.save();
-    rCtx.clipSaveDepth++;
-    ctx.beginPath();
-    ctx.rect(gmx(rCtx, left), gmy(rCtx, top), gmw(rCtx, right - left), gmh(rCtx, bottom - top));
-    try {
-      ctx.clip();
-    } catch {
-    }
+    gdiCombineClip(rCtx, readClipRectShape(rCtx, dataOff), "intersect");
   }
   return true;
 }
+function handleExcludeClipRect(rCtx, dataOff, recSize) {
+  if (recSize >= 24) {
+    gdiCombineClip(rCtx, readClipRectShape(rCtx, dataOff), "exclude");
+  }
+  return true;
+}
+var RGN_MODE_OPS = {
+  1: "intersect",
+  // RGN_AND
+  2: "union",
+  // RGN_OR
+  3: "xor",
+  // RGN_XOR
+  4: "exclude",
+  // RGN_DIFF
+  5: "replace"
+  // RGN_COPY
+};
 function handleExtSelectClipRgn(rCtx, dataOff, recSize) {
-  const { ctx, view } = rCtx;
+  const { view } = rCtx;
   if (recSize < 16) {
     return true;
   }
   const cbRgnData = view.getUint32(dataOff, true);
   const iMode = view.getUint32(dataOff + 4, true);
-  if (iMode === 5) {
-    if (cbRgnData === 0) {
-      while (rCtx.clipSaveDepth > 0) {
-        ctx.restore();
-        rCtx.clipSaveDepth--;
-      }
-      return true;
-    }
-    const rgnStart = dataOff + 8;
-    if (cbRgnData < 32) {
-      return true;
-    }
-    const nCount = view.getUint32(rgnStart + 8, true);
-    if (nCount === 0) {
-      return true;
-    }
-    while (rCtx.clipSaveDepth > 0) {
-      ctx.restore();
-      rCtx.clipSaveDepth--;
-    }
-    ctx.save();
-    rCtx.clipSaveDepth++;
-    ctx.beginPath();
-    const rectsStart = rgnStart + 32;
-    for (let i = 0; i < nCount; i++) {
-      const rOff = rectsStart + i * 16;
-      if (rOff + 16 > dataOff + 8 + cbRgnData) {
-        break;
-      }
-      const left = view.getInt32(rOff, true);
-      const top = view.getInt32(rOff + 4, true);
-      const right = view.getInt32(rOff + 8, true);
-      const bottom = view.getInt32(rOff + 12, true);
-      ctx.rect(gmx(rCtx, left), gmy(rCtx, top), gmw(rCtx, right - left), gmh(rCtx, bottom - top));
+  const op = RGN_MODE_OPS[iMode];
+  if (!op) {
+    return true;
+  }
+  if (cbRgnData === 0) {
+    if (op === "replace") {
+      rCtx.clipRegion = null;
+      rCtx.clipUntracked = false;
+      reapplyClipRegion(rCtx, null);
     }
-    try {
-      ctx.clip();
-    } catch {
+    return true;
+  }
+  const rgnStart = dataOff + 8;
+  if (cbRgnData < 32) {
+    return true;
+  }
+  const nCount = view.getUint32(rgnStart + 8, true);
+  if (nCount === 0) {
+    return true;
+  }
+  const rects = [];
+  const rectsStart = rgnStart + 32;
+  for (let i = 0; i < nCount; i++) {
+    const rOff = rectsStart + i * 16;
+    if (rOff + 16 > dataOff + 8 + cbRgnData) {
+      break;
     }
+    const left = view.getInt32(rOff, true);
+    const top = view.getInt32(rOff + 4, true);
+    const right = view.getInt32(rOff + 8, true);
+    const bottom = view.getInt32(rOff + 12, true);
+    rects.push({
+      x: gmx(rCtx, left),
+      y: gmy(rCtx, top),
+      w: gmw(rCtx, right - left),
+      h: gmh(rCtx, bottom - top)
+    });
   }
-  return true;
-}
-function handleExcludeClipRect(rCtx, dataOff, recSize) {
-  if (recSize >= 24) {
-    rCtx.view.getInt32(dataOff, true);
-    rCtx.view.getInt32(dataOff + 4, true);
-    rCtx.view.getInt32(dataOff + 8, true);
-    rCtx.view.getInt32(dataOff + 12, true);
+  if (rects.length === 0) {
+    return true;
   }
+  gdiCombineClip(rCtx, rectsClipShape(rects), op);
   return true;
 }
 function handleOffsetClipRgn(rCtx, dataOff, recSize) {
   if (recSize >= 16) {
-    rCtx.view.getInt32(dataOff, true);
-    rCtx.view.getInt32(dataOff + 4, true);
+    const dx = rCtx.view.getInt32(dataOff, true);
+    const dy = rCtx.view.getInt32(dataOff + 4, true);
+    if (rCtx.clipUntracked) {
+      return true;
+    }
+    if (rCtx.clipRegion) {
+      rCtx.clipRegion = translateClipRegion(rCtx.clipRegion, gmw(rCtx, dx), gmh(rCtx, dy));
+      reapplyClipRegion(rCtx, rCtx.clipRegion);
+    }
   }
   return true;
 }
@@ -3107,14 +3563,12 @@ function handleEmfGdiPolyPathRecord(rCtx, recType, offset, dataOff, recSize) {
             ctx.restore();
             rCtx.clipSaveDepth--;
           }
-          ctx.save();
-          rCtx.clipSaveDepth++;
-          ctx.clip();
-        } else {
-          ctx.save();
-          rCtx.clipSaveDepth++;
-          ctx.clip();
         }
+        ctx.save();
+        rCtx.clipSaveDepth++;
+        ctx.clip(state.polyFillMode === 2 ? "nonzero" : "evenodd");
+        rCtx.clipRegion = null;
+        rCtx.clipUntracked = true;
       } catch {
       }
       return true;
@@ -3404,7 +3858,9 @@ function createEmfPlusState() {
     objectTable: /* @__PURE__ */ new Map(),
     worldTransform: [1, 0, 0, 1, 0, 0],
     saveStack: [],
-    saveIdMap: /* @__PURE__ */ new Map()
+    saveIdMap: /* @__PURE__ */ new Map(),
+    clipRegion: null,
+    clipSaveDepth: 0
   };
 }
 function handleEmfGdiStateRecord(rCtx, recType, _offset, dataOff, recSize) {
@@ -3422,8 +3878,19 @@ function handleEmfGdiStateRecord(rCtx, recType, _offset, dataOff, recSize) {
         ctx.restore();
         rCtx.clipSaveDepth--;
       }
+      rCtx.clipStack ?? (rCtx.clipStack = []);
+      rCtx.clipStack.push({
+        region: rCtx.clipRegion ?? null,
+        untracked: rCtx.clipUntracked ?? false
+      });
       rCtx.stateStack.push(cloneState(state));
       ctx.save();
+      if (rCtx.clipUntracked) {
+        rCtx.clipUntracked = false;
+        rCtx.clipRegion = null;
+      } else if (rCtx.clipRegion) {
+        reapplyClipRegion(rCtx, rCtx.clipRegion);
+      }
       return true;
     }
     case EMR_RESTOREDC: {
@@ -3434,16 +3901,23 @@ function handleEmfGdiStateRecord(rCtx, recType, _offset, dataOff, recSize) {
         }
         let rel = view.getInt32(dataOff, true);
         if (rel < 0) {
-          rel = rCtx.stateStack.length + rel;
+          rel = rCtx.stateStack.length + rel + 1;
         }
         while (rCtx.stateStack.length > rel && rCtx.stateStack.length > 0) {
           rCtx.stateStack.pop();
+          rCtx.clipStack?.pop();
           ctx.restore();
         }
         const restored = rCtx.stateStack.pop();
         if (restored) {
+          const clipSnapshot = rCtx.clipStack?.pop();
           Object.assign(state, restored);
           ctx.restore();
+          rCtx.clipRegion = clipSnapshot?.region ?? null;
+          rCtx.clipUntracked = false;
+          if (rCtx.clipRegion) {
+            reapplyClipRegion(rCtx, rCtx.clipRegion);
+          }
         }
       }
       return true;
@@ -3558,6 +4032,47 @@ function parseEmfPlusPath(data, off, maxLen) {
   const types = new Uint8Array(data.buffer, data.byteOffset + alignedPOff, pointCount);
   return { kind: "plus-path", points: points3, types: new Uint8Array(types) };
 }
+function emfPlusPathToClipCmds(path, m) {
+  const tx = (x, y) => m[0] * x + m[2] * y + m[4];
+  const ty = (x, y) => m[1] * x + m[3] * y + m[5];
+  const cmds = [];
+  const pts = path.points;
+  const types = path.types;
+  let i = 0;
+  while (i < pts.length) {
+    const t = types[i] & 15;
+    const close = (types[i] & 128) !== 0;
+    if (t === 0) {
+      cmds.push({ op: "moveTo", x: tx(pts[i].x, pts[i].y), y: ty(pts[i].x, pts[i].y) });
+      i++;
+    } else if (t === 3) {
+      if (i + 2 < pts.length) {
+        cmds.push({
+          op: "bezierCurveTo",
+          cp1x: tx(pts[i].x, pts[i].y),
+          cp1y: ty(pts[i].x, pts[i].y),
+          cp2x: tx(pts[i + 1].x, pts[i + 1].y),
+          cp2y: ty(pts[i + 1].x, pts[i + 1].y),
+          x: tx(pts[i + 2].x, pts[i + 2].y),
+          y: ty(pts[i + 2].x, pts[i + 2].y)
+        });
+        if ((types[i + 2] & 128) !== 0) {
+          cmds.push({ op: "closePath" });
+        }
+        i += 3;
+        continue;
+      }
+      break;
+    } else {
+      cmds.push({ op: "lineTo", x: tx(pts[i].x, pts[i].y), y: ty(pts[i].x, pts[i].y) });
+      i++;
+    }
+    if (close) {
+      cmds.push({ op: "closePath" });
+    }
+  }
+  return cmds;
+}
 function replayEmfPlusPath(ctx, path) {
   ctx.beginPath();
   const pts = path.points;
@@ -3609,12 +4124,44 @@ function multiplyMatrix(m1, m2) {
     m1[4] * m2[1] + m1[5] * m2[3] + m2[5]
   ];
 }
-function resolveBrushColor(rCtx, flags, brushIdOrColor) {
+function createBrushGradient(rCtx, grad) {
+  const ctx = rCtx.ctx;
+  try {
+    let g = null;
+    if (grad.type === "linear" && typeof ctx.createLinearGradient === "function") {
+      if (grad.x1 === grad.x2 && grad.y1 === grad.y2) {
+        return null;
+      }
+      g = ctx.createLinearGradient(grad.x1, grad.y1, grad.x2, grad.y2);
+    } else if (grad.type === "radial" && typeof ctx.createRadialGradient === "function") {
+      if (!(grad.r > 0)) {
+        return null;
+      }
+      g = ctx.createRadialGradient(grad.cx, grad.cy, 0, grad.cx, grad.cy, grad.r);
+    }
+    if (!g) {
+      return null;
+    }
+    for (const stop of grad.stops) {
+      g.addColorStop(stop.offset, stop.color);
+    }
+    return g;
+  } catch {
+    return null;
+  }
+}
+function resolveBrushPaint(rCtx, flags, brushIdOrColor) {
   if (flags & 32768) {
     return argbToRgba(brushIdOrColor);
   }
   const obj = rCtx.objectTable.get(brushIdOrColor & 255);
   if (obj && obj.kind === "plus-brush") {
+    if (obj.gradient) {
+      const g = createBrushGradient(rCtx, obj.gradient);
+      if (g) {
+        return g;
+      }
+    }
     return obj.color;
   }
   return "rgba(0,0,0,1)";
@@ -3678,88 +4225,83 @@ function popState(rCtx, stackId) {
     rCtx.saveIdMap = newMap;
   }
 }
-function ensureClipSave(rCtx) {
-  if (rCtx.clipSaveDepth === 0) {
-    rCtx.ctx.save();
-    rCtx.clipSaveDepth = 1;
-  }
-}
-function resetClipState(rCtx) {
-  if (rCtx.clipSaveDepth > 0) {
-    rCtx.ctx.restore();
-    rCtx.clipSaveDepth = 0;
-  }
-}
-function applyClipCombineMode(rCtx, combineMode, opName, clipFn) {
-  switch (combineMode) {
-    case 0:
-      resetClipState(rCtx);
-      ensureClipSave(rCtx);
-      clipFn();
-      return true;
-    case 1:
-      ensureClipSave(rCtx);
-      clipFn();
-      return true;
-    case 2:
-      ensureClipSave(rCtx);
-      clipFn();
-      return true;
-    case 3:
-      return false;
-    case 4:
-      return false;
-    case 5:
-      return false;
-    default:
-      ensureClipSave(rCtx);
-      clipFn();
-      return true;
-  }
-}
-var MAX_REGION_TRACE_DEPTH = 64;
-function traceRegionNodePath(ctx, node, depth = 0) {
-  if (depth > MAX_REGION_TRACE_DEPTH) {
-    ctx.rect(0, 0, 0, 0);
-    return;
+function plusDeviceMatrix(rCtx) {
+  const wt = rCtx.worldTransform;
+  const s = getPageUnitMultiplier(rCtx.pageUnit, rCtx.pageScale) * rCtx.dpiScale;
+  return [wt[0] * s, wt[1] * s, wt[2] * s, wt[3] * s, wt[4] * s, wt[5] * s];
+}
+function transformedRectShape(x, y, w, h, m) {
+  const tx = (px2, py) => m[0] * px2 + m[2] * py + m[4];
+  const ty = (px2, py) => m[1] * px2 + m[3] * py + m[5];
+  const cmds = [
+    { op: "moveTo", x: tx(x, y), y: ty(x, y) },
+    { op: "lineTo", x: tx(x + w, y), y: ty(x + w, y) },
+    { op: "lineTo", x: tx(x + w, y + h), y: ty(x + w, y + h) },
+    { op: "lineTo", x: tx(x, y + h), y: ty(x, y + h) },
+    { op: "closePath" }
+  ];
+  return { cmds, fillRule: "nonzero", simple: true };
+}
+function pathClipShape(path, m) {
+  return { cmds: emfPlusPathToClipCmds(path.path, m), fillRule: "nonzero", simple: true };
+}
+var REGION_NODE_OPS = {
+  0: "intersect",
+  // legacy/lenient: treat 0 as And
+  1: "intersect",
+  // RegionNodeDataTypeAnd
+  2: "union",
+  // RegionNodeDataTypeOr
+  3: "xor",
+  // RegionNodeDataTypeXor
+  4: "exclude",
+  // RegionNodeDataTypeExclude
+  5: "complement"
+  // RegionNodeDataTypeComplement
+};
+var MAX_REGION_FLATTEN_DEPTH = 64;
+function flattenRegionNode(node, m, depth = 0) {
+  if (depth > MAX_REGION_FLATTEN_DEPTH) {
+    return { region: [emptyClipShape()], exact: false };
   }
   switch (node.type) {
     case "rect":
-      ctx.rect(node.x, node.y, node.width, node.height);
-      break;
+      return { region: [transformedRectShape(node.x, node.y, node.width, node.height, m)], exact: true };
     case "path":
-      replayEmfPlusPath(ctx, node.path);
-      break;
+      return { region: [pathClipShape(node, m)], exact: true };
     case "infinite":
-      ctx.rect(-1e6, -1e6, 2e6, 2e6);
-      break;
+      return { region: null, exact: true };
     case "empty":
-      ctx.rect(0, 0, 0, 0);
-      break;
-    case "combine":
-      traceRegionNodePath(ctx, node.left, depth + 1);
-      if (node.combineMode !== 0) {
-        emfWarn(
-          `traceRegionNodePath: combine mode ${node.combineMode} not fully supported, using left subtree only`
-        );
-      } else {
-        try {
-          ctx.clip();
-        } catch {
-        }
-        ctx.beginPath();
-        traceRegionNodePath(ctx, node.right, depth + 1);
-      }
-      break;
-  }
+      return { region: [emptyClipShape()], exact: true };
+    case "combine": {
+      const left = flattenRegionNode(node.left, m, depth + 1);
+      const right = flattenRegionNode(node.right, m, depth + 1);
+      const op = REGION_NODE_OPS[node.combineMode] ?? "intersect";
+      const combined = combineClipRegions(left.region, right.region, op);
+      return { region: combined.region, exact: combined.exact && left.exact && right.exact };
+    }
+  }
+}
+var PLUS_COMBINE_OPS = {
+  0: "replace",
+  1: "intersect",
+  2: "union",
+  3: "xor",
+  4: "exclude",
+  5: "complement"
+};
+function reapplyPlusClip(rCtx) {
+  reapplyClipRegion(rCtx, rCtx.clipRegion ?? null, true);
 }
-function applyRegionNodeClip(ctx, rootNode, combineMode) {
-  ctx.beginPath();
-  traceRegionNodePath(ctx, rootNode);
-  try {
-    ctx.clip();
-  } catch {
-  }
+function applyPlusClipRegion(rCtx, incoming, combineMode, opName) {
+  const op = PLUS_COMBINE_OPS[combineMode];
+  const res = combineClipRegions(rCtx.clipRegion ?? null, incoming, op ?? "intersect");
+  if (!res.exact) ;
+  rCtx.clipRegion = res.region;
+  reapplyPlusClip(rCtx);
+}
+function applyPlusClipShape(rCtx, shape, combineMode, opName) {
+  applyPlusClipRegion(rCtx, [shape], combineMode);
 }
 function handleEmfPlusStateRecord(rCtx, recType, recFlags, dataOff, recDataSize) {
   const { view } = rCtx;
@@ -3861,30 +4403,24 @@ function handleEmfPlusStateRecord(rCtx, recType, recFlags, dataOff, recDataSize)
         const cy = view.getFloat32(dataOff + 4, true);
         const cw = view.getFloat32(dataOff + 8, true);
         const ch = view.getFloat32(dataOff + 12, true);
-        applyClipCombineMode(rCtx, combineMode, "SetClipRect", () => {
-          applyPlusWorldTransform(rCtx);
-          rCtx.ctx.beginPath();
-          rCtx.ctx.rect(cx, cy, cw, ch);
-          try {
-            rCtx.ctx.clip();
-          } catch {
-          }
-        });
+        const shape = transformedRectShape(cx, cy, cw, ch, plusDeviceMatrix(rCtx));
+        applyPlusClipShape(rCtx, shape, combineMode);
       }
       return true;
     }
     case EMFPLUS_RESETCLIP: {
-      resetClipState(rCtx);
-      ensureClipSave(rCtx);
+      rCtx.clipRegion = null;
+      reapplyPlusClip(rCtx);
       return true;
     }
     case EMFPLUS_SETCLIPREGION: {
       const regionId = recFlags & 255;
+      const combineMode = recFlags >> 8 & 15;
       const regionObj = rCtx.objectTable.get(regionId);
       if (regionObj && regionObj.kind === "plus-region" && regionObj.nodes.length > 0) {
-        applyPlusWorldTransform(rCtx);
-        const rootNode = regionObj.nodes[0];
-        applyRegionNodeClip(rCtx.ctx, rootNode);
+        const flattened = flattenRegionNode(regionObj.nodes[0], plusDeviceMatrix(rCtx));
+        if (!flattened.exact) ;
+        applyPlusClipRegion(rCtx, flattened.region, combineMode);
       }
       return true;
     }
@@ -3893,22 +4429,26 @@ function handleEmfPlusStateRecord(rCtx, recType, recFlags, dataOff, recDataSize)
       const combineMode = recFlags >> 8 & 15;
       const pathObj = rCtx.objectTable.get(pathId);
       if (pathObj && pathObj.kind === "plus-path") {
-        applyClipCombineMode(rCtx, combineMode, "SetClipPath", () => {
-          applyPlusWorldTransform(rCtx);
-          rCtx.ctx.beginPath();
-          replayEmfPlusPath(rCtx.ctx, pathObj);
-          try {
-            rCtx.ctx.clip();
-          } catch {
-          }
-        });
+        const shape = {
+          cmds: emfPlusPathToClipCmds(pathObj, plusDeviceMatrix(rCtx)),
+          fillRule: "nonzero",
+          simple: true
+        };
+        applyPlusClipShape(rCtx, shape, combineMode);
       }
       return true;
     }
     case EMFPLUS_OFFSETCLIP: {
       if (recDataSize >= 8) {
-        view.getFloat32(dataOff, true);
-        view.getFloat32(dataOff + 4, true);
+        const dx = view.getFloat32(dataOff, true);
+        const dy = view.getFloat32(dataOff + 4, true);
+        if (rCtx.clipRegion) {
+          const m = plusDeviceMatrix(rCtx);
+          const ddx = m[0] * dx + m[2] * dy;
+          const ddy = m[1] * dx + m[3] * dy;
+          rCtx.clipRegion = translateClipRegion(rCtx.clipRegion, ddx, ddy);
+          reapplyPlusClip(rCtx);
+        }
       }
       return true;
     }
@@ -3979,7 +4519,7 @@ function handleEmfPlusDrawRecord(rCtx, recType, recFlags, dataOff, recDataSize)
         const count = view.getUint32(dataOff + 4, true);
         const compressed = (recFlags & 16384) !== 0;
         const rectSize = compressed ? 8 : 16;
-        ctx.fillStyle = resolveBrushColor(rCtx, recFlags, brushVal);
+        ctx.fillStyle = resolveBrushPaint(rCtx, recFlags, brushVal);
         applyPlusWorldTransform(rCtx);
         let rOff = dataOff + 8;
         for (let i = 0; i < count && rOff + rectSize <= dataOff + recDataSize; i++) {
@@ -4029,7 +4569,7 @@ function handleEmfPlusDrawRecord(rCtx, recType, recFlags, dataOff, recDataSize)
           w = view.getFloat32(dataOff + 12, true);
           h = view.getFloat32(dataOff + 16, true);
         }
-        ctx.fillStyle = resolveBrushColor(rCtx, recFlags, brushVal);
+        ctx.fillStyle = resolveBrushPaint(rCtx, recFlags, brushVal);
         applyPlusWorldTransform(rCtx);
         ctx.beginPath();
         ctx.ellipse(x + w / 2, y + h / 2, Math.abs(w) / 2, Math.abs(h) / 2, 0, 0, Math.PI * 2);
@@ -4075,7 +4615,7 @@ function handleEmfPlusDrawRecord(rCtx, recType, recFlags, dataOff, recDataSize)
       let aOff = dataOff;
       if (isFill) {
         const brushVal = view.getUint32(aOff, true);
-        ctx.fillStyle = resolveBrushColor(rCtx, recFlags, brushVal);
+        ctx.fillStyle = resolveBrushPaint(rCtx, recFlags, brushVal);
         aOff += 4;
       }
       const startAngle = view.getFloat32(aOff, true) * Math.PI / 180;
@@ -4156,7 +4696,7 @@ function handleEmfPlusDrawRecord(rCtx, recType, recFlags, dataOff, recDataSize)
         const count = view.getUint32(dataOff + 4, true);
         const compressed = (recFlags & 16384) !== 0;
         const ptSize = compressed ? 4 : 8;
-        ctx.fillStyle = resolveBrushColor(rCtx, recFlags, brushVal);
+        ctx.fillStyle = resolveBrushPaint(rCtx, recFlags, brushVal);
         applyPlusWorldTransform(rCtx);
         ctx.beginPath();
         let pOff = dataOff + 8;
@@ -4178,6 +4718,259 @@ function handleEmfPlusDrawRecord(rCtx, recType, recFlags, dataOff, recDataSize)
       return false;
   }
 }
+var BRUSH_DATA_PATH = 1;
+var BRUSH_DATA_TRANSFORM = 2;
+var BRUSH_DATA_PRESET_COLORS = 4;
+var BRUSH_DATA_BLEND_FACTORS_H = 8;
+var MAX_GRADIENT_ELEMENTS = 4096;
+function looksLikeGraphicsVersion(v) {
+  return v >>> 12 === 900097;
+}
+function readTransform(view, off) {
+  return [
+    view.getFloat32(off, true),
+    view.getFloat32(off + 4, true),
+    view.getFloat32(off + 8, true),
+    view.getFloat32(off + 12, true),
+    view.getFloat32(off + 16, true),
+    view.getFloat32(off + 20, true)
+  ];
+}
+function applyMatrix(m, x, y) {
+  return { x: m[0] * x + m[2] * y + m[4], y: m[1] * x + m[3] * y + m[5] };
+}
+function clamp01(v) {
+  return Number.isFinite(v) ? Math.min(1, Math.max(0, v)) : 0;
+}
+function normaliseStops(stops) {
+  return stops.map((s) => ({ offset: clamp01(s.offset), color: s.color })).sort((a, b) => a.offset - b.offset);
+}
+function readPresetColors(view, off, end) {
+  if (off + 4 > end) {
+    return null;
+  }
+  const count = view.getUint32(off, true);
+  if (count === 0 || count > MAX_GRADIENT_ELEMENTS) {
+    return null;
+  }
+  const posOff = off + 4;
+  const colOff = posOff + count * 4;
+  const next = colOff + count * 4;
+  if (next > end) {
+    return null;
+  }
+  const stops = [];
+  for (let i = 0; i < count; i++) {
+    stops.push({
+      offset: view.getFloat32(posOff + i * 4, true),
+      color: argbToRgba(view.getUint32(colOff + i * 4, true))
+    });
+  }
+  return { stops, next };
+}
+function readBlendFactors(view, off, end) {
+  if (off + 4 > end) {
+    return null;
+  }
+  const count = view.getUint32(off, true);
+  if (count === 0 || count > MAX_GRADIENT_ELEMENTS) {
+    return null;
+  }
+  const posOff = off + 4;
+  const facOff = posOff + count * 4;
+  const next = facOff + count * 4;
+  if (next > end) {
+    return null;
+  }
+  const entries = [];
+  for (let i = 0; i < count; i++) {
+    entries.push({
+      pos: view.getFloat32(posOff + i * 4, true),
+      factor: view.getFloat32(facOff + i * 4, true)
+    });
+  }
+  return { entries, next };
+}
+function parseLinearGradient(view, b, end) {
+  if (b + 40 > end) {
+    return null;
+  }
+  const flags = view.getUint32(b, true);
+  const rx = view.getFloat32(b + 8, true);
+  const ry = view.getFloat32(b + 12, true);
+  const rw = view.getFloat32(b + 16, true);
+  const rh = view.getFloat32(b + 20, true);
+  const startArgb = view.getUint32(b + 24, true);
+  const endArgb = view.getUint32(b + 28, true);
+  let o = b + 40;
+  let transform = null;
+  if (flags & BRUSH_DATA_TRANSFORM && o + 24 <= end) {
+    transform = readTransform(view, o);
+    o += 24;
+  }
+  let stops = [
+    { offset: 0, color: argbToRgba(startArgb) },
+    { offset: 1, color: argbToRgba(endArgb) }
+  ];
+  if (flags & BRUSH_DATA_PRESET_COLORS) {
+    const preset = readPresetColors(view, o, end);
+    if (preset) {
+      stops = preset.stops;
+    }
+  } else if (flags & BRUSH_DATA_BLEND_FACTORS_H) {
+    const blend = readBlendFactors(view, o, end);
+    if (blend) {
+      stops = blend.entries.map((e) => ({
+        offset: e.pos,
+        color: lerpArgbToRgba(startArgb, endArgb, e.factor)
+      }));
+    }
+  }
+  let p1 = { x: rx, y: ry + rh / 2 };
+  let p2 = { x: rx + rw, y: ry + rh / 2 };
+  if (transform) {
+    p1 = applyMatrix(transform, p1.x, p1.y);
+    p2 = applyMatrix(transform, p2.x, p2.y);
+  }
+  emfLog(
+    `parseEmfPlusBrushObject: linear gradient (${p1.x.toFixed(1)},${p1.y.toFixed(1)})\u2192(${p2.x.toFixed(1)},${p2.y.toFixed(1)}), ${stops.length} stop(s)`
+  );
+  return {
+    kind: "plus-brush",
+    color: argbToRgba(startArgb),
+    gradient: {
+      type: "linear",
+      x1: p1.x,
+      y1: p1.y,
+      x2: p2.x,
+      y2: p2.y,
+      stops: normaliseStops(stops)
+    }
+  };
+}
+function parsePathGradient(view, b, end) {
+  if (b + 24 > end) {
+    return null;
+  }
+  const flags = view.getUint32(b, true);
+  const centerArgb = view.getUint32(b + 8, true);
+  let cx = view.getFloat32(b + 12, true);
+  let cy = view.getFloat32(b + 16, true);
+  const surroundCount = view.getUint32(b + 20, true);
+  if (surroundCount > MAX_GRADIENT_ELEMENTS) {
+    return { kind: "plus-brush", color: argbToRgba(centerArgb) };
+  }
+  const surround = [];
+  let o = b + 24;
+  for (let i = 0; i < surroundCount && o + 4 <= end; i++) {
+    surround.push(view.getUint32(o, true));
+    o += 4;
+  }
+  let boundaryPts = [];
+  if (flags & BRUSH_DATA_PATH) {
+    if (o + 4 <= end) {
+      const pathSize = view.getInt32(o, true);
+      o += 4;
+      if (pathSize > 0 && o + pathSize <= end) {
+        const path = parseEmfPlusPath(view, o, pathSize);
+        if (path) {
+          boundaryPts = path.points;
+        }
+        o += pathSize;
+      }
+    }
+  } else if (o + 4 <= end) {
+    const ptCount = view.getUint32(o, true);
+    o += 4;
+    if (ptCount > 0 && ptCount <= MAX_GRADIENT_ELEMENTS && o + ptCount * 8 <= end) {
+      for (let i = 0; i < ptCount; i++) {
+        boundaryPts.push({
+          x: view.getFloat32(o + i * 8, true),
+          y: view.getFloat32(o + i * 8 + 4, true)
+        });
+      }
+      o += ptCount * 8;
+    }
+  }
+  let transform = null;
+  if (flags & BRUSH_DATA_TRANSFORM && o + 24 <= end) {
+    transform = readTransform(view, o);
+    o += 24;
+  }
+  if (transform) {
+    ({ x: cx, y: cy } = applyMatrix(transform, cx, cy));
+    boundaryPts = boundaryPts.map((p) => applyMatrix(transform, p.x, p.y));
+  }
+  const surroundArgb = surround.length > 0 ? surround[0] : centerArgb;
+  let stops = [
+    { offset: 0, color: argbToRgba(centerArgb) },
+    { offset: 1, color: argbToRgba(surroundArgb) }
+  ];
+  if (flags & BRUSH_DATA_PRESET_COLORS) {
+    const preset = readPresetColors(view, o, end);
+    if (preset) {
+      stops = preset.stops.map((s) => ({ offset: 1 - s.offset, color: s.color }));
+    }
+  } else if (flags & BRUSH_DATA_BLEND_FACTORS_H) {
+    const blend = readBlendFactors(view, o, end);
+    if (blend) {
+      stops = blend.entries.map((e) => ({
+        offset: 1 - e.pos,
+        color: lerpArgbToRgba(surroundArgb, centerArgb, e.factor)
+      }));
+    }
+  }
+  let r = 0;
+  for (const p of boundaryPts) {
+    const d = Math.hypot(p.x - cx, p.y - cy);
+    if (d > r) {
+      r = d;
+    }
+  }
+  if (!(r > 0)) {
+    return { kind: "plus-brush", color: argbToRgba(centerArgb) };
+  }
+  emfLog(
+    `parseEmfPlusBrushObject: path gradient centre=(${cx.toFixed(1)},${cy.toFixed(1)}), r=${r.toFixed(1)}, ${stops.length} stop(s)`
+  );
+  return {
+    kind: "plus-brush",
+    color: argbToRgba(centerArgb),
+    gradient: { type: "radial", cx, cy, r, stops: normaliseStops(stops) }
+  };
+}
+function parseEmfPlusBrushObject(view, dataOff, recDataSize) {
+  if (recDataSize < 8) {
+    return null;
+  }
+  const end = dataOff + recDataSize;
+  const hasVersion = looksLikeGraphicsVersion(view.getUint32(dataOff, true));
+  const typeOff = dataOff + (hasVersion ? 4 : 0);
+  if (typeOff + 8 > end) {
+    return null;
+  }
+  const brushType = view.getUint32(typeOff, true);
+  const b = typeOff + 4;
+  switch (brushType) {
+    case EMFPLUS_BRUSHTYPE_SOLID:
+      return { kind: "plus-brush", color: argbToRgba(view.getUint32(b, true)) };
+    case EMFPLUS_BRUSHTYPE_HATCHFILL:
+      if (b + 8 <= end) {
+        return { kind: "plus-brush", color: argbToRgba(view.getUint32(b + 4, true)) };
+      }
+      return { kind: "plus-brush", color: "rgba(0,0,0,1)" };
+    case EMFPLUS_BRUSHTYPE_LINEARGRADIENT: {
+      const brush = parseLinearGradient(view, b, end);
+      return brush ?? { kind: "plus-brush", color: "rgba(0,0,0,1)" };
+    }
+    case EMFPLUS_BRUSHTYPE_PATHGRADIENT: {
+      const brush = parsePathGradient(view, b, end);
+      return brush ?? { kind: "plus-brush", color: "rgba(0,0,0,1)" };
+    }
+    default:
+      return { kind: "plus-brush", color: "rgba(0,0,0,1)" };
+  }
+}
 var PIXELFORMAT_24BPP_RGB = 137224;
 var PIXELFORMAT_32BPP_RGB = 139273;
 var PIXELFORMAT_32BPP_ARGB = 2498570;
@@ -4284,7 +5077,8 @@ function parseEmfPlusPenObject(view, dataOff, recDataSize) {
   if (recDataSize < 20) {
     return null;
   }
-  const penFlags = view.getUint32(dataOff + 4, true);
+  const hasVersion = looksLikeGraphicsVersion(view.getUint32(dataOff, true));
+  const penFlags = view.getUint32(dataOff + (hasVersion ? 8 : 4), true);
   const penWidth = view.getFloat32(dataOff + 16, true);
   let brushOff = dataOff + 20;
   const flagSizes = [
@@ -4344,9 +5138,9 @@ function parseEmfPlusPenObject(view, dataOff, recDataSize) {
   }
   let penColor = "rgba(0,0,0,1)";
   if (brushOff + 8 <= dataOff + recDataSize) {
-    const penBrushType = view.getUint32(brushOff, true);
-    if (penBrushType === EMFPLUS_BRUSHTYPE_SOLID && brushOff + 8 <= dataOff + recDataSize) {
-      penColor = argbToRgba(view.getUint32(brushOff + 4, true));
+    const brush = parseEmfPlusBrushObject(view, brushOff, dataOff + recDataSize - brushOff);
+    if (brush) {
+      penColor = brush.color;
     }
   }
   return { kind: "plus-pen", color: penColor, width: penWidth || 1, dashStyle };
@@ -4440,19 +5234,9 @@ function handleEmfPlusObjectRecord(rCtx, recFlags, dataOff, recDataSize) {
     // Brush
     // ---------------------------------------------------------------
     case EMFPLUS_OBJECTTYPE_BRUSH: {
-      if (recDataSize >= 8) {
-        const brushType = view.getUint32(dataOff, true);
-        let color2 = "rgba(0,0,0,1)";
-        if (brushType === EMFPLUS_BRUSHTYPE_SOLID && recDataSize >= 8) {
-          color2 = argbToRgba(view.getUint32(dataOff + 4, true));
-        } else if (brushType === EMFPLUS_BRUSHTYPE_LINEARGRADIENT && recDataSize >= 48) {
-          color2 = argbToRgba(view.getUint32(dataOff + 40, true));
-        } else if (brushType === EMFPLUS_BRUSHTYPE_PATHGRADIENT && recDataSize >= 12) {
-          color2 = argbToRgba(view.getUint32(dataOff + 8, true));
-        } else if (brushType === EMFPLUS_BRUSHTYPE_HATCHFILL && recDataSize >= 12) {
-          color2 = argbToRgba(view.getUint32(dataOff + 8, true));
-        }
-        objectTable.set(objectId, { kind: "plus-brush", color: color2 });
+      const brush = parseEmfPlusBrushObject(view, dataOff, recDataSize);
+      if (brush) {
+        objectTable.set(objectId, brush);
       }
       break;
     }
@@ -4548,7 +5332,7 @@ function parseRegionNode(view, off, endOff, depth = 0) {
   }
   const nodeType = view.getUint32(off, true);
   let cursor = off + 4;
-  if (nodeType <= 4) {
+  if (nodeType <= 5) {
     const leftResult = parseRegionNode(view, cursor, endOff, depth + 1);
     if (!leftResult) {
       return null;
@@ -4635,7 +5419,7 @@ function handleEmfPlusTextImageRecord(rCtx, recType, recFlags, dataOff, recDataS
         const pathId = recFlags & 255;
         const pathObj = objectTable.get(pathId);
         if (pathObj && pathObj.kind === "plus-path") {
-          ctx.fillStyle = resolveBrushColor(rCtx, recFlags, brushVal);
+          ctx.fillStyle = resolveBrushPaint(rCtx, recFlags, brushVal);
           applyPlusWorldTransform(rCtx);
           replayEmfPlusPath(ctx, pathObj);
           ctx.fill();
@@ -4680,7 +5464,7 @@ function handleEmfPlusTextImageRecord(rCtx, recType, recFlags, dataOff, recDataS
             const italic = font.flags & 2 ? "italic " : "";
             const family = mapFontFamily(font.family, rCtx.fontFamilyMap);
             ctx.font = `${italic}${bold}${font.emSize}px ${family}`;
-            ctx.fillStyle = resolveBrushColor(rCtx, recFlags, brushVal);
+            ctx.fillStyle = resolveBrushPaint(rCtx, recFlags, brushVal);
             ctx.textBaseline = "top";
             const sf = objectTable.get(formatId);
             if (sf && sf.kind === "plus-stringformat") {
@@ -4720,7 +5504,7 @@ function handleEmfPlusTextImageRecord(rCtx, recType, recFlags, dataOff, recDataS
             const italic = font.flags & 2 ? "italic " : "";
             const family = mapFontFamily(font.family, rCtx.fontFamilyMap);
             ctx.font = `${italic}${bold}${font.emSize}px ${family}`;
-            ctx.fillStyle = resolveBrushColor(rCtx, recFlags, brushVal);
+            ctx.fillStyle = resolveBrushPaint(rCtx, recFlags, brushVal);
             ctx.textBaseline = "alphabetic";
             ctx.textAlign = "left";
             applyPlusWorldTransform(rCtx);
@@ -4895,7 +5679,8 @@ function replayEmfPlusRecords(view, offset, length, ctx, _canvasW, _canvasH, sta
     saveIdMap: s.saveIdMap,
     totalImageObjects: 0,
     totalDrawImageCalls: 0,
-    clipSaveDepth: 0,
+    clipSaveDepth: s.clipSaveDepth,
+    clipRegion: s.clipRegion,
     pageUnit: 2,
     pageScale: 1,
     continuationBuffer: null,
@@ -5030,6 +5815,8 @@ function replayEmfPlusRecords(view, offset, length, ctx, _canvasW, _canvasH, sta
   if (state) {
     state.worldTransform = rCtx.worldTransform;
     state.saveIdMap = rCtx.saveIdMap;
+    state.clipRegion = rCtx.clipRegion ?? null;
+    state.clipSaveDepth = rCtx.clipSaveDepth;
   }
   ctx.setTransform(1, 0, 0, 1, 0, 0);
   return rCtx.deferredImages;