@pixerate/editor 0.214.0 → 0.216.0

package/dist/{chunk-YBJXCQTR.js → chunk-QXY4YTRI.js}

@@ -469,63 +469,6 @@ function stableStringify(v) {
   return JSON.stringify(v);
 }
 
-// src/raster/curve.ts
-var CURVE_LUT_SIZE = 4096;
-var clamp01 = (v) => v <= 0 ? 0 : v >= 1 ? 1 : v;
-function curveLut(points, size = CURVE_LUT_SIZE) {
-  const pts = points.filter((p) => Number.isFinite(p.input) && Number.isFinite(p.output)).map((p) => [p.input, p.output]).sort((a, b) => a[0] - b[0]);
-  const dedup = [];
-  for (const p of pts) {
-    if (dedup.length && Math.abs(dedup[dedup.length - 1][0] - p[0]) < 1e-6) continue;
-    dedup.push(p);
-  }
-  const out = new Float32Array(size);
-  const n = dedup.length;
-  if (n < 2) {
-    for (let k = 0; k < size; k++) out[k] = k / (size - 1);
-    return out;
-  }
-  const x = dedup.map((p) => p[0]);
-  const y = dedup.map((p) => p[1]);
-  const m2 = new Float64Array(n);
-  if (n > 2) {
-    const c = new Float64Array(n);
-    const d = new Float64Array(n);
-    for (let i = 1; i < n - 1; i++) {
-      const h0 = x[i] - x[i - 1];
-      const h1 = x[i + 1] - x[i];
-      const a = h0 / 6;
-      const b = (h0 + h1) / 3;
-      const cc = h1 / 6;
-      const r = (y[i + 1] - y[i]) / h1 - (y[i] - y[i - 1]) / h0;
-      const denom = b - a * c[i - 1];
-      c[i] = cc / denom;
-      d[i] = (r - a * d[i - 1]) / denom;
-    }
-    for (let i = n - 2; i >= 1; i--) m2[i] = d[i] - c[i] * m2[i + 1];
-  }
-  let seg = 0;
-  for (let k = 0; k < size; k++) {
-    const xv = k / (size - 1);
-    if (xv <= x[0]) {
-      out[k] = clamp01(y[0]);
-      continue;
-    }
-    if (xv >= x[n - 1]) {
-      out[k] = clamp01(y[n - 1]);
-      continue;
-    }
-    while (seg < n - 2 && xv > x[seg + 1]) seg++;
-    const x0 = x[seg], x1 = x[seg + 1];
-    const h = x1 - x0;
-    const a = (x1 - xv) / h;
-    const b = (xv - x0) / h;
-    const v = a * y[seg] + b * y[seg + 1] + ((a * a * a - a) * m2[seg] + (b * b * b - b) * m2[seg + 1]) * (h * h) / 6;
-    out[k] = clamp01(v);
-  }
-  return out;
-}
-
 // src/raster/effects/patterns.ts
 var PatternTile = class {
   w;
@@ -655,6 +598,63 @@ function hashNoise(x, y) {
   return (h & 65535) / 65536;
 }
 
+// src/raster/curve.ts
+var CURVE_LUT_SIZE = 4096;
+var clamp01 = (v) => v <= 0 ? 0 : v >= 1 ? 1 : v;
+function curveLut(points, size = CURVE_LUT_SIZE) {
+  const pts = points.filter((p) => Number.isFinite(p.input) && Number.isFinite(p.output)).map((p) => [p.input, p.output]).sort((a, b) => a[0] - b[0]);
+  const dedup = [];
+  for (const p of pts) {
+    if (dedup.length && Math.abs(dedup[dedup.length - 1][0] - p[0]) < 1e-6) continue;
+    dedup.push(p);
+  }
+  const out = new Float32Array(size);
+  const n = dedup.length;
+  if (n < 2) {
+    for (let k = 0; k < size; k++) out[k] = k / (size - 1);
+    return out;
+  }
+  const x = dedup.map((p) => p[0]);
+  const y = dedup.map((p) => p[1]);
+  const m2 = new Float64Array(n);
+  if (n > 2) {
+    const c = new Float64Array(n);
+    const d = new Float64Array(n);
+    for (let i = 1; i < n - 1; i++) {
+      const h0 = x[i] - x[i - 1];
+      const h1 = x[i + 1] - x[i];
+      const a = h0 / 6;
+      const b = (h0 + h1) / 3;
+      const cc = h1 / 6;
+      const r = (y[i + 1] - y[i]) / h1 - (y[i] - y[i - 1]) / h0;
+      const denom = b - a * c[i - 1];
+      c[i] = cc / denom;
+      d[i] = (r - a * d[i - 1]) / denom;
+    }
+    for (let i = n - 2; i >= 1; i--) m2[i] = d[i] - c[i] * m2[i + 1];
+  }
+  let seg = 0;
+  for (let k = 0; k < size; k++) {
+    const xv = k / (size - 1);
+    if (xv <= x[0]) {
+      out[k] = clamp01(y[0]);
+      continue;
+    }
+    if (xv >= x[n - 1]) {
+      out[k] = clamp01(y[n - 1]);
+      continue;
+    }
+    while (seg < n - 2 && xv > x[seg + 1]) seg++;
+    const x0 = x[seg], x1 = x[seg + 1];
+    const h = x1 - x0;
+    const a = (x1 - xv) / h;
+    const b = (xv - x0) / h;
+    const v = a * y[seg] + b * y[seg + 1] + ((a * a * a - a) * m2[seg] + (b * b * b - b) * m2[seg + 1]) * (h * h) / 6;
+    out[k] = clamp01(v);
+  }
+  return out;
+}
+
 // src/raster/effects/render.ts
 var INSIDE_EPS = 0.5 / 255;
 var INF = 1e20;
@@ -1927,475 +1927,83 @@ function renderLayerEffects(effects, layer, backdrop, canvas, ctx) {
   });
 }
 
-// src/raster/deep-compositor.ts
-var isGroup = (l) => l.type === "group";
-var DeepCompositor = class {
-  constructor(base, profile, deep, depth) {
-    this.base = base;
-    this.profile = profile;
-    this.deep = deep;
-    this.depth = depth;
-    this.linear = depth === 32;
-  }
-  base;
-  profile;
-  deep;
-  depth;
-  sources;
-  linear;
-  /** The composite of `layers` over `rect` as float RGBA in the working space (`rect.width × rect.height × 4`). */
-  composite(layers, rect, sources) {
-    this.sources = sources;
-    const acc = new Float32Array(Math.max(0, rect.width * rect.height * 4));
-    if (rect.width > 0 && rect.height > 0) this.runSteps(this.buildSteps(layers), acc, true, rect);
-    return acc;
-  }
-  // --- Steps (as RasterCompositor.buildSteps) ------------------------------------
-  isPixel(l) {
-    return l.type === "pixel" || (this.profile.isPixelLike?.(l) ?? false);
-  }
-  isFilter(l) {
-    return this.profile.isFilterLayer?.(l) ?? false;
-  }
-  buildSteps(layers) {
-    const steps = [];
-    for (const layer of layers) {
-      const last = steps[steps.length - 1];
-      if (layer.clipped && last && (last.kind === "content" || last.kind === "group")) {
-        last.clipped.push(layer);
-        continue;
-      }
-      if (this.isFilter(layer)) {
-        if (last && last.kind === "adjust") last.layers.push(layer);
-        else steps.push({ kind: "adjust", layers: [layer] });
-      } else if (isGroup(layer)) steps.push({ kind: "group", layer, clipped: [], steps: this.buildSteps(layer.children ?? []) });
-      else steps.push({ kind: "content", layer, clipped: [] });
+// src/raster/compositor.ts
+var TILE_PIXELS = TILE * TILE;
+var TILE_BYTES = TILE_PIXELS * 4;
+function applyEdgeAmbient(content, below, coverage, amount, color2, max) {
+  const k = Math.min(1, Math.max(0, amount));
+  if (!(k > 0)) return;
+  const n = content.length / 4;
+  for (let i = 0; i < n; i++) {
+    const a = content[i * 4 + 3] / max * (coverage ? coverage[i] : 1);
+    if (a <= 0 || a >= 1) continue;
+    let r;
+    let g;
+    let b;
+    if (color2) [r, g, b] = color2;
+    else {
+      if (!(below[i * 4 + 3] > 0)) continue;
+      r = below[i * 4];
+      g = below[i * 4 + 1];
+      b = below[i * 4 + 2];
     }
-    return steps;
+    const t = k * (1 - a);
+    content[i * 4] += t * (r - content[i * 4]);
+    content[i * 4 + 1] += t * (g - content[i * 4 + 1]);
+    content[i * 4 + 2] += t * (b - content[i * 4 + 2]);
   }
-  runSteps(steps, acc, empty, r) {
-    for (const s of steps) empty = this.runStep(s, acc, empty, r);
-    return empty;
+}
+function sameSig(a, b) {
+  if (!a || a.key !== b.key || a.refs.length !== b.refs.length) return false;
+  for (let i = 0; i < a.refs.length; i++) if (a.refs[i] !== b.refs[i]) return false;
+  return true;
+}
+function dirtyInTile(rects, tx, ty) {
+  let x0 = Infinity;
+  let y0 = Infinity;
+  let x1 = -Infinity;
+  let y1 = -Infinity;
+  const ox = tx * TILE;
+  const oy = ty * TILE;
+  for (const r of rects) {
+    const a = Math.max(ox, Math.floor(r.x));
+    const b = Math.max(oy, Math.floor(r.y));
+    const c = Math.min(ox + TILE, Math.ceil(r.x + r.width));
+    const d = Math.min(oy + TILE, Math.ceil(r.y + r.height));
+    if (c <= a || d <= b) continue;
+    x0 = Math.min(x0, a);
+    y0 = Math.min(y0, b);
+    x1 = Math.max(x1, c);
+    y1 = Math.max(y1, d);
   }
-  runStep(step, acc, empty, r) {
-    if (step.kind === "adjust") {
-      if (empty) return true;
-      this.applyFilterRun(step.layers, acc, r);
-      return false;
-    }
-    const layer = step.layer;
-    if (!layer.visible) return empty;
-    const clipped = step.clipped.filter((l) => l.visible);
-    if ((step.kind === "content" || step.kind === "group") && this.deepEffects(layer)) return this.runEffects(layer, clipped, acc, r, step.kind === "group" ? step.steps : null) ? false : empty;
-    const coverage = this.renderedAlone(layer) ? null : this.base.maskCoverage(layer, r, this.sources);
-    if (coverage && coverage.every((v) => v <= 0)) return empty;
-    if (step.kind === "group" && !this.renderedAlone(layer)) {
-      if (layer.blend === "pass-through" && !clipped.length) {
-        if (layer.opacity >= 1 && !coverage) return this.runSteps(step.steps, acc, empty, r);
-        const before = acc.slice();
-        const stillEmpty = this.runSteps(step.steps, acc, empty, r);
-        lerp(acc, before, layer.opacity, coverage);
-        return empty && stillEmpty;
-      }
-      const buf2 = new Float32Array(acc.length);
-      if (this.runSteps(step.steps, buf2, true, r)) return empty;
-      this.applyClipped(clipped, buf2, r);
-      const mode2 = layer.blend === "pass-through" ? "normal" : layer.blend;
-      this.blend(acc, buf2, mode2, layer.opacity, coverage);
-      return false;
+  return x0 === Infinity ? null : { x: x0, y: y0, width: x1 - x0, height: y1 - y0 };
+}
+function blendTile(dst, src, mode, alpha, coverage) {
+  if (!(alpha > 0)) return;
+  const normal = mode === "normal";
+  const pigment = mode === "pigment";
+  const lut = !normal && isSeparableBlendMode(mode) ? separableLut(mode) : null;
+  const cb = [0, 0, 0];
+  const cs = [0, 0, 0];
+  const n = dst.length;
+  for (let i = 0, p = 0; i < n; i += 4, p++) {
+    const sa = src[i + 3];
+    if (sa === 0) continue;
+    const k = coverage ? alpha * coverage[p] : alpha;
+    if (!(k > 0)) continue;
+    if (normal && sa === 255 && k >= 1) {
+      dst[i] = src[i];
+      dst[i + 1] = src[i + 1];
+      dst[i + 2] = src[i + 2];
+      dst[i + 3] = 255;
+      continue;
     }
-    const content = this.content(layer, r);
-    if (!content) return empty;
-    const alone = this.renderedAlone(layer);
-    const fill2 = !alone && this.isPixel(layer) ? layer.fillOpacity ?? 1 : 1;
-    const mode = this.blendOf(layer);
-    if (!clipped.length) {
-      this.blend(acc, content, mode, layer.opacity * fill2, coverage);
-      return false;
-    }
-    const buf = new Float32Array(acc.length);
-    this.blend(buf, content, "normal", fill2, coverage);
-    this.applyClipped(clipped, buf, r);
-    this.blend(acc, buf, mode, layer.opacity, null);
-    return false;
-  }
-  /**
-   * A pixel layer with effects onto `acc` over `r`: its deep content (filters, mask, clipped
-   * layers) and the effects composited in float. Effect maps come from the 8-bit shape. At 32
-   * bits the effects composite in sRGB-encoded values (their colours and blends are defined
-   * there) and the result is decoded back. Returns whether anything was drawn.
-   */
-  runEffects(layer, clipped, acc, r, groupSteps = null) {
-    const fx = this.base.effectsInput(layer, r, this.sources);
-    if (!fx) return false;
-    const a = fx.rect;
-    let content;
-    if (groupSteps) {
-      content = new Float32Array(a.width * a.height * 4);
-      this.runSteps(groupSteps, content, true, a);
-    } else content = this.content(layer, a) ?? new Float32Array(a.width * a.height * 4);
-    const coverage = this.base.maskCoverage(layer, a, this.sources);
-    if (coverage) for (let i = 0; i < coverage.length; i++) content[i * 4 + 3] *= coverage[i];
-    if (clipped.length) this.applyClipped(clipped, content, a);
-    const sub = new Float32Array(a.width * a.height * 4);
-    for (let y = 0; y < a.height; y++) {
-      const s = ((a.y - r.y + y) * r.width + (a.x - r.x)) * 4;
-      sub.set(acc.subarray(s, s + a.width * 4), y * a.width * 4);
-    }
-    if (this.linear) {
-      encodeInPlace(sub);
-      encodeInPlace(content);
-    }
-    compositeLayerEffects({ ...fx, backdrop: sub, content });
-    if (this.linear) decodeInPlace(sub);
-    for (let y = 0; y < a.height; y++) acc.set(sub.subarray(y * a.width * 4, (y + 1) * a.width * 4), ((a.y - r.y + y) * r.width + (a.x - r.x)) * 4);
-    return true;
-  }
-  applyClipped(clipped, buf, r) {
-    let run = [];
-    const flush = () => {
-      if (run.length) this.applyFilterRun(run, buf, r);
-      run = [];
-    };
-    for (const c of clipped) {
-      if (this.isFilter(c)) {
-        run.push(c);
-        continue;
-      }
-      flush();
-      const alone = this.renderedAlone(c);
-      const coverage = alone ? null : this.base.maskCoverage(c, r, this.sources);
-      let src;
-      if (isGroup(c) && !alone) {
-        src = new Float32Array(buf.length);
-        if (this.runSteps(this.buildSteps(c.children ?? []), src, true, r)) continue;
-      } else src = this.content(c, r);
-      if (!src) continue;
-      const fill2 = !alone && this.isPixel(c) ? c.fillOpacity ?? 1 : 1;
-      const keep = new Float32Array(buf.length >> 2);
-      for (let i = 3, p = 0; i < buf.length; i += 4, p++) keep[p] = buf[i];
-      this.blend(buf, src, c.blend === "pass-through" ? "normal" : this.blendOf(c), c.opacity * fill2, coverage);
-      for (let i = 3, p = 0; i < buf.length; i += 4, p++) buf[i] = keep[p];
-    }
-    flush();
-  }
-  applyFilterRun(layers, acc, r) {
-    const visible = [];
-    let masks;
-    for (const node of layers) {
-      if (!node.visible) continue;
-      const cov = this.base.maskCoverage(node, r, this.sources);
-      if (cov) {
-        if (cov.every((v) => v <= 0)) continue;
-        (masks ??= /* @__PURE__ */ new Map()).set(node.id, cov);
-      }
-      visible.push(node);
-    }
-    if (!visible.length) return;
-    if (this.deep.applyFilterRunDeep) {
-      if (this.linear) mapColour(acc, srgbEncode);
-      this.deep.applyFilterRunDeep(visible, acc, r, masks, this.sources);
-      if (this.linear) mapColour(acc, srgbDecode);
-      return;
-    }
-    const bytes = this.to8(acc);
-    this.profile.applyFilterRun?.(visible, bytes, r, masks, this.sources);
-    acc.set(this.from8(bytes));
-  }
-  // --- Layer content ---------------------------------------------------------------
-  /** Layers drawn by the 8-bit compositor alone (effects, pixel filters, content the editor draws). */
-  /** A pixel(-like) layer or a group with effects: composited in float through `compositeLayerEffects`. */
-  deepEffects(layer) {
-    return hasActiveEffects(layer.effects) && !this.isFilter(layer) && (isGroup(layer) || this.isPixel(layer));
-  }
-  renderedAlone(layer) {
-    if (hasActiveEffects(layer.effects) && !this.isFilter(layer) && !this.deepEffects(layer)) return true;
-    if (this.isPixel(layer)) return Boolean(this.profile.pixelFilters?.(layer)) && !this.deep.pixelFiltersDeep?.(layer);
-    return !isGroup(layer);
-  }
-  blendOf(layer) {
-    return this.profile.contentBlend?.(layer) ?? layer.blend;
-  }
-  /** A layer's float RGBA over `r` (straight alpha, working space), or `null` when it has none there. */
-  content(layer, r) {
-    if (this.renderedAlone(layer)) {
-      const solo = { ...layer, blend: isGroup(layer) && layer.blend === "pass-through" ? "pass-through" : "normal", opacity: 1, clipped: false };
-      const bytes = this.base.composite([solo], r, this.sources);
-      return this.from8(bytes);
-    }
-    const surface = this.sources.surfaceOf ? this.sources.surfaceOf(layer) : layer.surface;
-    if (!surface) return null;
-    const ox = layer.offset?.x ?? 0;
-    const oy = layer.offset?.y ?? 0;
-    const filters = this.isPixel(layer) ? this.deep.pixelFiltersDeep?.(layer) ?? null : null;
-    if (!filters) return this.samples(surface, { x: r.x - ox, y: r.y - oy, width: r.width, height: r.height });
-    const m = filters.reach;
-    const W = this.sources.width;
-    const H = this.sources.height;
-    const x0 = m ? Math.max(0, r.x - m) : r.x;
-    const y0 = m ? Math.max(0, r.y - m) : r.y;
-    const x1 = m ? Math.min(W, r.x + r.width + m) : r.x + r.width;
-    const y1 = m ? Math.min(H, r.y + r.height + m) : r.y + r.height;
-    if (x1 <= x0 || y1 <= y0) return new Float32Array(r.width * r.height * 4);
-    const big = { x: x0, y: y0, width: x1 - x0, height: y1 - y0 };
-    const data = this.samples(surface, { ...big, x: big.x - ox, y: big.y - oy });
-    filters.apply(data, big.width, big.height, this.linear);
-    if (big.x === r.x && big.y === r.y && big.width === r.width && big.height === r.height) return data;
-    const out = new Float32Array(r.width * r.height * 4);
-    for (let y = 0; y < r.height; y++) {
-      const sy = r.y + y - big.y;
-      if (sy < 0 || sy >= big.height) continue;
-      for (let x = 0; x < r.width; x++) {
-        const sx = r.x + x - big.x;
-        if (sx < 0 || sx >= big.width) continue;
-        const s = (sy * big.width + sx) * 4;
-        const d = (y * r.width + x) * 4;
-        out[d] = data[s];
-        out[d + 1] = data[s + 1];
-        out[d + 2] = data[s + 2];
-        out[d + 3] = data[s + 3];
-      }
-    }
-    return out;
-  }
-  /** A surface's samples over `rect` (layer space) in the working space. */
-  samples(surface, rect) {
-    const samples = readDeepRegion(surface, rect, this.depth);
-    if (samples instanceof Float32Array) return samples;
-    const out = new Float32Array(samples.length);
-    for (let i = 0; i < samples.length; i++) out[i] = samples[i] / 65535;
-    return out;
-  }
-  /** 8-bit RGBA to the working space. */
-  from8(bytes) {
-    if (this.linear) return to32From8(bytes, 4);
-    const out = new Float32Array(bytes.length);
-    for (let i = 0; i < bytes.length; i++) out[i] = bytes[i] / 255;
-    return out;
-  }
-  /** The working space to 8-bit RGBA. */
-  to8(acc) {
-    const out = new Uint8ClampedArray(acc.length);
-    for (let i = 0; i < acc.length; i += 4) {
-      for (let c = 0; c < 3; c++) out[i + c] = Math.round((this.linear ? srgbEncode(acc[i + c]) : acc[i + c]) * 255);
-      out[i + 3] = Math.round(acc[i + 3] * 255);
-    }
-    return out;
-  }
-  // --- Blending --------------------------------------------------------------------
-  /** `src` over `dst` with `mode` at `alpha` × coverage (straight alpha, float), as `blendTile`. */
-  blend(dst, src, mode, alpha, coverage) {
-    if (!(alpha > 0)) return;
-    const normal = mode === "normal";
-    const pigment = mode === "pigment";
-    const cb = [0, 0, 0];
-    const cs = [0, 0, 0];
-    const mix = [0, 0, 0];
-    for (let i = 0, p = 0; i < dst.length; i += 4, p++) {
-      const sa = src[i + 3];
-      if (!(sa > 0)) continue;
-      const k = coverage ? alpha * coverage[p] : alpha;
-      if (!(k > 0)) continue;
-      const as = Math.min(1, sa * k);
-      const ab = dst[i + 3];
-      const ao = as + ab * (1 - as);
-      if (ao <= 0) {
-        dst[i] = dst[i + 1] = dst[i + 2] = dst[i + 3] = 0;
-        continue;
-      }
-      if (normal && as >= 1) {
-        dst[i] = src[i];
-        dst[i + 1] = src[i + 1];
-        dst[i + 2] = src[i + 2];
-        dst[i + 3] = 1;
-        continue;
-      }
-      for (let c = 0; c < 3; c++) {
-        cb[c] = dst[i + c];
-        cs[c] = src[i + c];
-      }
-      if (pigment) {
-        if (this.linear) for (let c = 0; c < 3; c++) cb[c] = srgbEncode(cb[c]), cs[c] = srgbEncode(cs[c]);
-        mixPigmentRgb(cb, cs, as / ao, mix);
-        for (let c = 0; c < 3; c++) dst[i + c] = this.linear ? srgbDecode(mix[c]) : mix[c];
-        dst[i + 3] = ao;
-        continue;
-      }
-      const m = normal ? cs : blendRgb(mode, cb, cs);
-      const wb = (1 - as) * ab;
-      const ws = (1 - ab) * as;
-      const wm = as * ab;
-      for (let c = 0; c < 3; c++) dst[i + c] = (wb * cb[c] + ws * cs[c] + wm * m[c]) / ao;
-      dst[i + 3] = ao;
-    }
-  }
-};
-function lerp(dst, before, alpha, coverage) {
-  for (let i = 0, p = 0; i < dst.length; i += 4, p++) {
-    const k = coverage ? alpha * coverage[p] : alpha;
-    if (k >= 1) continue;
-    for (let c = 0; c < 4; c++) dst[i + c] = before[i + c] + (dst[i + c] - before[i + c]) * k;
-  }
-}
-function mapColour(data, f) {
-  for (let i = 0; i < data.length; i += 4) {
-    data[i] = f(data[i]);
-    data[i + 1] = f(data[i + 1]);
-    data[i + 2] = f(data[i + 2]);
-  }
-}
-function workingToSamples(data, depth) {
-  if (depth === 32) return data;
-  const out = new Uint16Array(data.length);
-  for (let i = 0; i < data.length; i++) {
-    const v = data[i];
-    out[i] = v > 0 ? v < 1 ? Math.round(v * 65535) : 65535 : 0;
-  }
-  return out;
-}
-function encodeInPlace(d) {
-  for (let i = 0; i < d.length; i += 4) {
-    d[i] = srgbEncode(d[i]);
-    d[i + 1] = srgbEncode(d[i + 1]);
-    d[i + 2] = srgbEncode(d[i + 2]);
-  }
-}
-function decodeInPlace(d) {
-  for (let i = 0; i < d.length; i += 4) {
-    d[i] = srgbDecode(d[i]);
-    d[i + 1] = srgbDecode(d[i + 1]);
-    d[i + 2] = srgbDecode(d[i + 2]);
-  }
-}
-
-// src/raster/layers.ts
-var childrenOf = (l) => l.type === "group" ? l.children ?? null : null;
-function flattenLayers(layers) {
-  const out = [];
-  const walk = (list) => {
-    for (const l of list) {
-      out.push(l);
-      const c = childrenOf(l);
-      if (c) walk(c);
-    }
-  };
-  walk(layers);
-  return out;
-}
-function findLayer(layers, id) {
-  const walk = (list, parent, path) => {
-    for (let i = 0; i < list.length; i++) {
-      const l = list[i];
-      if (l.id === id) return { layer: l, parent, index: i, path };
-      const c = childrenOf(l);
-      if (c) {
-        const g = l;
-        const hit = walk(c, g, [...path, g]);
-        if (hit) return hit;
-      }
-    }
-    return null;
-  };
-  return walk(layers, null, []);
-}
-function mapLayer(layers, id, fn) {
-  let changed = false;
-  const walk = (list) => {
-    let out = null;
-    for (let i = 0; i < list.length; i++) {
-      const l = list[i];
-      let next = l;
-      if (l.id === id) {
-        next = fn(l);
-        changed = true;
-      } else {
-        const c = childrenOf(l);
-        if (c) {
-          const children = walk(c);
-          if (children !== c) next = { ...l, children };
-        }
-      }
-      if (next !== l) {
-        if (!out) out = list.slice(0, i);
-        if (next) out.push(next);
-      } else if (out) out.push(l);
-    }
-    return out ?? list;
-  };
-  const result = walk(layers);
-  return changed ? result : layers;
-}
-function insertLayer(layers, layer, parentId, index) {
-  const put = (list) => {
-    const at = index === void 0 ? list.length : Math.max(0, Math.min(list.length, index));
-    const next = list.slice();
-    next.splice(at, 0, layer);
-    return next;
-  };
-  if (!parentId) return put(layers);
-  return mapLayer(layers, parentId, (g) => {
-    const c = childrenOf(g);
-    return c ? { ...g, children: put(c) } : g;
-  });
-}
-function isLayerLocked(layer, what) {
-  return Boolean(layer.locks?.all || layer.locks?.[what]);
-}
-
-// src/raster/compositor.ts
-var TILE_PIXELS = TILE * TILE;
-var TILE_BYTES = TILE_PIXELS * 4;
-function sameSig(a, b) {
-  if (!a || a.key !== b.key || a.refs.length !== b.refs.length) return false;
-  for (let i = 0; i < a.refs.length; i++) if (a.refs[i] !== b.refs[i]) return false;
-  return true;
-}
-function dirtyInTile(rects, tx, ty) {
-  let x0 = Infinity;
-  let y0 = Infinity;
-  let x1 = -Infinity;
-  let y1 = -Infinity;
-  const ox = tx * TILE;
-  const oy = ty * TILE;
-  for (const r of rects) {
-    const a = Math.max(ox, Math.floor(r.x));
-    const b = Math.max(oy, Math.floor(r.y));
-    const c = Math.min(ox + TILE, Math.ceil(r.x + r.width));
-    const d = Math.min(oy + TILE, Math.ceil(r.y + r.height));
-    if (c <= a || d <= b) continue;
-    x0 = Math.min(x0, a);
-    y0 = Math.min(y0, b);
-    x1 = Math.max(x1, c);
-    y1 = Math.max(y1, d);
-  }
-  return x0 === Infinity ? null : { x: x0, y: y0, width: x1 - x0, height: y1 - y0 };
-}
-function blendTile(dst, src, mode, alpha, coverage) {
-  if (!(alpha > 0)) return;
-  const normal = mode === "normal";
-  const pigment = mode === "pigment";
-  const lut = !normal && isSeparableBlendMode(mode) ? separableLut(mode) : null;
-  const cb = [0, 0, 0];
-  const cs = [0, 0, 0];
-  const n = dst.length;
-  for (let i = 0, p = 0; i < n; i += 4, p++) {
-    const sa = src[i + 3];
-    if (sa === 0) continue;
-    const k = coverage ? alpha * coverage[p] : alpha;
-    if (!(k > 0)) continue;
-    if (normal && sa === 255 && k >= 1) {
-      dst[i] = src[i];
-      dst[i + 1] = src[i + 1];
-      dst[i + 2] = src[i + 2];
-      dst[i + 3] = 255;
-      continue;
-    }
-    const as = sa / 255 * k;
-    const ab = dst[i + 3] / 255;
-    const ao = as + ab * (1 - as);
-    if (ao <= 0) {
-      dst[i] = dst[i + 1] = dst[i + 2] = dst[i + 3] = 0;
-      continue;
+    const as = sa / 255 * k;
+    const ab = dst[i + 3] / 255;
+    const ao = as + ab * (1 - as);
+    if (ao <= 0) {
+      dst[i] = dst[i + 1] = dst[i + 2] = dst[i + 3] = 0;
+      continue;
     }
     const d0 = dst[i];
     const d1 = dst[i + 1];
@@ -2470,7 +2078,7 @@ function lerpTile(dst, before, alpha, coverage) {
   }
 }
 var ZERO_TILE = new Uint8ClampedArray(TILE_BYTES);
-var isGroup2 = (l) => l.type === "group";
+var isGroup = (l) => l.type === "group";
 var maskDepths = /* @__PURE__ */ new WeakMap();
 function maskDepth(surface) {
   let d = maskDepths.get(surface);
@@ -2603,7 +2211,7 @@ var RasterCompositor = class {
     return {
       rect,
       maps,
-      blend: isGroup2(layer) ? layer.blend === "pass-through" ? "normal" : layer.blend : this.contentBlend(layer),
+      blend: isGroup(layer) ? layer.blend === "pass-through" ? "normal" : layer.blend : this.contentBlend(layer),
       opacity: layer.opacity,
       fillOpacity: this.isPixel(layer) ? layer.fillOpacity ?? 1 : 1,
       canvas: { x: 0, y: 0, width: this.sources.width, height: this.sources.height },
@@ -2635,7 +2243,7 @@ var RasterCompositor = class {
       if (this.isFilter(layer)) {
         if (last && last.kind === "adjust") last.layers.push(layer);
         else steps.push({ kind: "adjust", layers: [layer] });
-      } else if (isGroup2(layer)) {
+      } else if (isGroup(layer)) {
         steps.push({ kind: "group", layer, clipped: [], steps: this.buildSteps(layer.children ?? []) });
       } else {
         steps.push({ kind: "content", layer, clipped: [] });
@@ -2646,7 +2254,7 @@ var RasterCompositor = class {
   }
   /** The index of the top-level step that holds layer `id` (searching groups and clipped layers), or -1. */
   stepIndexOf(steps, id) {
-    const holds = (l) => l.id === id || isGroup2(l) && (l.children ?? []).some(holds);
+    const holds = (l) => l.id === id || isGroup(l) && (l.children ?? []).some(holds);
     return steps.findIndex((s) => s.kind === "adjust" ? s.layers.some(holds) : holds(s.layer) || s.clipped.some(holds));
   }
   /** Properties of a layer that change pixels, minus its surfaces (memoised per object). */
@@ -2657,6 +2265,7 @@ var RasterCompositor = class {
     const base = [layer.type, layer.id, layer.visible, layer.opacity, layer.blend, Boolean(layer.clipped), mask];
     if (this.isPixel(layer)) base.push(layer.offset?.x ?? 0, layer.offset?.y ?? 0, layer.fillOpacity ?? 1);
     if (this.hasEffects(layer)) base.push(effectsFingerprint(layer.effects));
+    if (layer.edge) base.push(layer.edge);
     const extra = this.profile.layerKey?.(layer);
     if (extra !== void 0) base.push(extra);
     key = JSON.stringify(base);
@@ -2794,7 +2403,7 @@ var RasterCompositor = class {
   }
   layerSig(layer, tx, ty) {
     if (this.isFilter(layer)) return { key: this.propsKey(layer), refs: this.maskRefs(layer, tx, ty, 0, 0) };
-    if (isGroup2(layer)) return this.groupSig(layer, this.buildSteps(layer.children ?? []), tx, ty);
+    if (isGroup(layer)) return this.groupSig(layer, this.buildSteps(layer.children ?? []), tx, ty);
     return this.contentSig(layer, tx, ty);
   }
   groupSig(group, steps, tx, ty) {
@@ -2884,7 +2493,7 @@ var RasterCompositor = class {
   shapeSigs(layer, region) {
     const sigs = /* @__PURE__ */ new Map();
     if (region.width <= 0 || region.height <= 0) return sigs;
-    const steps = isGroup2(layer) ? this.buildSteps(layer.children ?? []) : null;
+    const steps = isGroup(layer) ? this.buildSteps(layer.children ?? []) : null;
     for (const t of tilesInRect(region)) {
       sigs.set(tileKey(t.tx, t.ty), steps ? this.plainGroupSig(layer, steps, t.tx, t.ty) : this.plainContentSig(layer, t.tx, t.ty));
     }
@@ -2906,7 +2515,7 @@ var RasterCompositor = class {
    * laid out over the layer's bounds.
    */
   effectSig(layer, tx, ty) {
-    const key = (isGroup2(layer) ? "Gfx" : "Cfx") + this.propsKey(layer) + this.lightKey();
+    const key = (isGroup(layer) ? "Gfx" : "Cfx") + this.propsKey(layer) + this.lightKey();
     const region = this.effectRegion(layer);
     const m = effectsMargin(layer.effects);
     if (effectsAreLocal(activeEffectItems(layer.effects))) {
@@ -2999,7 +2608,7 @@ var RasterCompositor = class {
   /** A content or group layer's own pixels over `r` with its mask applied to alpha, or `null` when empty. */
   ownPixels(layer, r) {
     let rgba;
-    if (isGroup2(layer)) {
+    if (isGroup(layer)) {
       const buf = new Uint8ClampedArray(r.width * r.height * 4);
       rgba = this.runSteps(this.buildSteps(layer.children ?? []), buf, true, r) ? null : buf;
     } else {
@@ -3033,7 +2642,7 @@ var RasterCompositor = class {
     const content = this.ownPixels(layer, a) ?? new Uint8ClampedArray(a.width * a.height * 4);
     if (clipped.length) this.applyClipped(clipped, content, a);
     const keep = keepAlpha ? sub.filter((_, i) => (i & 3) === 3) : null;
-    const blend2 = isGroup2(layer) ? layer.blend === "pass-through" ? "normal" : layer.blend : this.contentBlend(layer);
+    const blend2 = isGroup(layer) ? layer.blend === "pass-through" ? "normal" : layer.blend : this.contentBlend(layer);
     compositeLayerEffects({
       backdrop: sub,
       content,
@@ -3130,82 +2739,272 @@ var RasterCompositor = class {
     }
     return `${id}:${ox},${oy}:${W}x${H}:${mask.feather ?? 0}:${mask.density ?? 1}:${mask.source ? JSON.stringify(mask.source) : ""}`;
   }
-  /** Canvas-sized coverage of a feathered or parametric mask (cached). */
-  planeFor(mask, ox, oy) {
-    const key = this.planeKey(mask, ox, oy);
-    let plane = this.planeCache.get(key);
-    if (plane) {
-      this.planeCache.delete(key);
-      this.planeCache.set(key, plane);
-      return plane;
-    }
-    const W = this.sources.width;
-    const H = this.sources.height;
-    let v = new Float32Array(W * H);
-    if (mask.source) {
-      const generated = this.profile.maskSourcePlane?.(mask.source, W, H, this.sources) ?? null;
-      if (!generated || generated.length !== W * H) v.fill(1);
-      else v.set(generated);
-    } else {
-      const bytes = readRegion(mask.surface, { x: -ox, y: -oy, width: W, height: H });
-      for (let i = 0; i < v.length; i++) v[i] = bytes[i] / 255;
-    }
-    const feather = mask.feather ?? 0;
-    if (feather > 0) v = gaussianBlur(v, W, H, feather, "clamp");
-    const density = mask.density ?? 1;
-    if (density !== 1) for (let i = 0; i < v.length; i++) v[i] = 1 - density * (1 - v[i]);
-    plane = { data: v, width: W, height: H };
-    this.planeCache.set(key, plane);
-    while (this.planeCache.size > 8) this.planeCache.delete(this.planeCache.keys().next().value);
-    return plane;
+  /** Canvas-sized coverage of a feathered or parametric mask (cached). */
+  planeFor(mask, ox, oy) {
+    const key = this.planeKey(mask, ox, oy);
+    let plane = this.planeCache.get(key);
+    if (plane) {
+      this.planeCache.delete(key);
+      this.planeCache.set(key, plane);
+      return plane;
+    }
+    const W = this.sources.width;
+    const H = this.sources.height;
+    let v = new Float32Array(W * H);
+    if (mask.source) {
+      const generated = this.profile.maskSourcePlane?.(mask.source, W, H, this.sources) ?? null;
+      if (!generated || generated.length !== W * H) v.fill(1);
+      else v.set(generated);
+    } else {
+      const bytes = readRegion(mask.surface, { x: -ox, y: -oy, width: W, height: H });
+      for (let i = 0; i < v.length; i++) v[i] = bytes[i] / 255;
+    }
+    const feather = mask.feather ?? 0;
+    if (feather > 0) v = gaussianBlur(v, W, H, feather, "clamp");
+    const density = mask.density ?? 1;
+    if (density !== 1) for (let i = 0; i < v.length; i++) v[i] = 1 - density * (1 - v[i]);
+    plane = { data: v, width: W, height: H };
+    this.planeCache.set(key, plane);
+    while (this.planeCache.size > 8) this.planeCache.delete(this.planeCache.keys().next().value);
+    return plane;
+  }
+  maskTile(layer, r) {
+    const mask = layer.mask;
+    if (!mask || mask.enabled === false) return null;
+    const ox = this.isPixel(layer) ? layer.offset?.x ?? 0 : 0;
+    const oy = this.isPixel(layer) ? layer.offset?.y ?? 0 : 0;
+    const n = r.width * r.height;
+    const out = new Float32Array(n);
+    const density = mask.density ?? 1;
+    if (mask.source || (mask.feather ?? 0) > 0) {
+      const plane = this.planeFor(mask, ox, oy);
+      const W = plane.width;
+      const H = plane.height;
+      const outside = mask.source ? 1 : 1 - density * (1 - mask.defaultValue / 255);
+      out.fill(outside);
+      const x0 = Math.max(0, r.x);
+      const y0 = Math.max(0, r.y);
+      const x1 = Math.min(W, r.x + r.width);
+      const y1 = Math.min(H, r.y + r.height);
+      for (let y = y0; y < y1; y++) {
+        const s = y * W;
+        const d = (y - r.y) * r.width - r.x;
+        for (let x = x0; x < x1; x++) out[d + x] = plane.data[s + x];
+      }
+    } else {
+      const rect = { x: r.x - ox, y: r.y - oy, width: r.width, height: r.height };
+      let all = true;
+      if (maskDepth(mask.surface) !== 8) {
+        const d = readDeepRegion(mask.surface, rect, 32);
+        for (let i = 0; i < n; i++) {
+          const v = d[i] <= 0 ? 0 : d[i] >= 1 ? 1 : d[i];
+          out[i] = v;
+          if (v !== 1) all = false;
+        }
+      } else {
+        const bytes = readRegion(mask.surface, rect);
+        for (let i = 0; i < n; i++) {
+          out[i] = bytes[i] / 255;
+          if (bytes[i] !== 255) all = false;
+        }
+      }
+      if (all) return null;
+      if (density !== 1) for (let i = 0; i < n; i++) out[i] = 1 - density * (1 - out[i]);
+    }
+    return out;
+  }
+  // --- Running steps ---------------------------------------------------------
+  /** Runs one step onto `acc`; returns whether `acc` is still empty. */
+  runStep(step, acc, empty, r) {
+    if (step.kind === "adjust") {
+      if (empty) return true;
+      this.applyFilterRun(step.layers, acc, r);
+      return false;
+    }
+    const layer = step.layer;
+    if (!layer.visible) return empty;
+    const clipped = step.clipped.filter((l) => l.visible);
+    if (this.hasEffects(layer)) return this.runEffectStep(layer, clipped, acc, empty, r);
+    const coverage = this.maskTile(layer, r);
+    if (coverage && coverage.every((v) => v <= 0)) return empty;
+    if (step.kind === "group") {
+      if (layer.blend === "pass-through" && !clipped.length) {
+        if (layer.opacity >= 1 && !coverage) return this.runSteps(step.steps, acc, empty, r);
+        const before = new Uint8ClampedArray(acc);
+        const stillEmpty = this.runSteps(step.steps, acc, empty, r);
+        lerpTile(acc, before, layer.opacity, coverage);
+        return empty && stillEmpty;
+      }
+      const buf2 = new Uint8ClampedArray(acc.length);
+      if (this.runSteps(step.steps, buf2, true, r)) return empty;
+      this.applyClipped(clipped, buf2, r);
+      const mode = layer.blend === "pass-through" ? "normal" : layer.blend;
+      return this.blendOnto(acc, buf2, empty, mode, layer.opacity, coverage);
+    }
+    let content = this.contentTile(step.layer, r);
+    if (!content) return empty;
+    const ambient = layer.edge?.ambient ?? 0;
+    if (ambient > 0 && (!empty || layer.edge?.ambientColor)) {
+      content = new Uint8ClampedArray(content);
+      applyEdgeAmbient(content, acc, coverage, ambient, layer.edge?.ambientColor ?? null, 255);
+    }
+    const fill2 = this.isPixel(step.layer) ? step.layer.fillOpacity ?? 1 : 1;
+    const blend2 = this.contentBlend(step.layer);
+    if (!clipped.length) return this.blendOnto(acc, content, empty, blend2, layer.opacity * fill2, coverage);
+    const buf = new Uint8ClampedArray(acc.length);
+    blendTile(buf, content, "normal", fill2, coverage);
+    this.applyClipped(clipped, buf, r);
+    return this.blendOnto(acc, buf, empty, blend2, layer.opacity, null);
+  }
+  runSteps(steps, acc, empty, r) {
+    for (const s of steps) empty = this.runStep(s, acc, empty, r);
+    return empty;
+  }
+  contentBlend(layer) {
+    return this.profile.contentBlend?.(layer) ?? layer.blend;
+  }
+  blendOnto(acc, src, empty, mode, alpha, coverage) {
+    if (!(alpha > 0)) return empty;
+    if (empty && mode === "normal" && alpha >= 1 && !coverage) {
+      acc.set(src);
+      return false;
+    }
+    blendTile(acc, src, mode, alpha, coverage);
+    return false;
+  }
+  applyClipped(clipped, buf, r) {
+    let run = [];
+    const flush = () => {
+      if (run.length) this.applyFilterRun(run, buf, r);
+      run = [];
+    };
+    for (const c of clipped) {
+      if (this.isFilter(c)) {
+        run.push(c);
+        continue;
+      }
+      flush();
+      if (this.hasEffects(c) && !isGroup(c)) {
+        this.compositeEffects(c, [], buf, r, true);
+        continue;
+      }
+      const coverage = this.maskTile(c, r);
+      if (isGroup(c)) {
+        const inner = new Uint8ClampedArray(buf.length);
+        if (this.runSteps(this.buildSteps(c.children ?? []), inner, true, r)) continue;
+        const mode = c.blend === "pass-through" ? "normal" : c.blend;
+        blendAtop(buf, inner, mode, c.opacity, coverage);
+        continue;
+      }
+      const content = this.contentTile(c, r);
+      if (!content) continue;
+      const fill2 = this.isPixel(c) ? c.fillOpacity ?? 1 : 1;
+      blendAtop(buf, content, this.contentBlend(c), c.opacity * fill2, coverage);
+    }
+    flush();
+  }
+  applyFilterRun(layers, acc, r) {
+    const visible = [];
+    let masks;
+    for (const node of layers) {
+      if (!node.visible) continue;
+      const cov = this.maskTile(node, r);
+      if (cov) {
+        if (cov.every((v) => v <= 0)) continue;
+        (masks ??= /* @__PURE__ */ new Map()).set(node.id, cov);
+      }
+      visible.push(node);
+    }
+    if (visible.length) this.profile.applyFilterRun?.(visible, acc, r, masks, this.sources);
+  }
+};
+function filterOverCanvas(surface, ox, oy, filters, width, height) {
+  if (width <= 0 || height <= 0) return emptySurface(4);
+  const data = readRegion(surface, { x: -ox, y: -oy, width, height });
+  filters.apply(data, width, height);
+  return surfaceFromPixels({ width, height, data }, 4, 0, 0);
+}
+function copyRect(data, r, a) {
+  const out = new Uint8ClampedArray(a.width * a.height * 4);
+  for (let y = 0; y < a.height; y++) {
+    const s = ((a.y - r.y + y) * r.width + (a.x - r.x)) * 4;
+    out.set(data.subarray(s, s + a.width * 4), y * a.width * 4);
+  }
+  return out;
+}
+function pasteRect(data, r, part, a) {
+  for (let y = 0; y < a.height; y++) data.set(part.subarray(y * a.width * 4, (y + 1) * a.width * 4), ((a.y - r.y + y) * r.width + (a.x - r.x)) * 4);
+}
+function sameRect(a, b) {
+  return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
+}
+function inflateRect(r, m) {
+  return { x: r.x - m, y: r.y - m, width: r.width + 2 * m, height: r.height + 2 * m };
+}
+function intersectRect(a, b) {
+  const x0 = Math.max(a.x, b.x);
+  const y0 = Math.max(a.y, b.y);
+  const x1 = Math.min(a.x + a.width, b.x + b.width);
+  const y1 = Math.min(a.y + a.height, b.y + b.height);
+  return x1 <= x0 || y1 <= y0 ? { x: x0, y: y0, width: 0, height: 0 } : { x: x0, y: y0, width: x1 - x0, height: y1 - y0 };
+}
+function changedTiles(a, b) {
+  const out = [];
+  for (const [k, t] of b.tiles) if (a.tiles.get(k) !== t) out.push(k);
+  for (const k of a.tiles.keys()) if (!b.tiles.has(k)) out.push(k);
+  return out;
+}
+
+// src/raster/deep-compositor.ts
+var isGroup2 = (l) => l.type === "group";
+var DeepCompositor = class {
+  constructor(base, profile, deep, depth) {
+    this.base = base;
+    this.profile = profile;
+    this.deep = deep;
+    this.depth = depth;
+    this.linear = depth === 32;
+  }
+  base;
+  profile;
+  deep;
+  depth;
+  sources;
+  linear;
+  /** The composite of `layers` over `rect` as float RGBA in the working space (`rect.width × rect.height × 4`). */
+  composite(layers, rect, sources) {
+    this.sources = sources;
+    const acc = new Float32Array(Math.max(0, rect.width * rect.height * 4));
+    if (rect.width > 0 && rect.height > 0) this.runSteps(this.buildSteps(layers), acc, true, rect);
+    return acc;
+  }
+  // --- Steps (as RasterCompositor.buildSteps) ------------------------------------
+  isPixel(l) {
+    return l.type === "pixel" || (this.profile.isPixelLike?.(l) ?? false);
+  }
+  isFilter(l) {
+    return this.profile.isFilterLayer?.(l) ?? false;
   }
-  maskTile(layer, r) {
-    const mask = layer.mask;
-    if (!mask || mask.enabled === false) return null;
-    const ox = this.isPixel(layer) ? layer.offset?.x ?? 0 : 0;
-    const oy = this.isPixel(layer) ? layer.offset?.y ?? 0 : 0;
-    const n = r.width * r.height;
-    const out = new Float32Array(n);
-    const density = mask.density ?? 1;
-    if (mask.source || (mask.feather ?? 0) > 0) {
-      const plane = this.planeFor(mask, ox, oy);
-      const W = plane.width;
-      const H = plane.height;
-      const outside = mask.source ? 1 : 1 - density * (1 - mask.defaultValue / 255);
-      out.fill(outside);
-      const x0 = Math.max(0, r.x);
-      const y0 = Math.max(0, r.y);
-      const x1 = Math.min(W, r.x + r.width);
-      const y1 = Math.min(H, r.y + r.height);
-      for (let y = y0; y < y1; y++) {
-        const s = y * W;
-        const d = (y - r.y) * r.width - r.x;
-        for (let x = x0; x < x1; x++) out[d + x] = plane.data[s + x];
-      }
-    } else {
-      const rect = { x: r.x - ox, y: r.y - oy, width: r.width, height: r.height };
-      let all = true;
-      if (maskDepth(mask.surface) !== 8) {
-        const d = readDeepRegion(mask.surface, rect, 32);
-        for (let i = 0; i < n; i++) {
-          const v = d[i] <= 0 ? 0 : d[i] >= 1 ? 1 : d[i];
-          out[i] = v;
-          if (v !== 1) all = false;
-        }
-      } else {
-        const bytes = readRegion(mask.surface, rect);
-        for (let i = 0; i < n; i++) {
-          out[i] = bytes[i] / 255;
-          if (bytes[i] !== 255) all = false;
-        }
+  buildSteps(layers) {
+    const steps = [];
+    for (const layer of layers) {
+      const last = steps[steps.length - 1];
+      if (layer.clipped && last && (last.kind === "content" || last.kind === "group")) {
+        last.clipped.push(layer);
+        continue;
       }
-      if (all) return null;
-      if (density !== 1) for (let i = 0; i < n; i++) out[i] = 1 - density * (1 - out[i]);
+      if (this.isFilter(layer)) {
+        if (last && last.kind === "adjust") last.layers.push(layer);
+        else steps.push({ kind: "adjust", layers: [layer] });
+      } else if (isGroup2(layer)) steps.push({ kind: "group", layer, clipped: [], steps: this.buildSteps(layer.children ?? []) });
+      else steps.push({ kind: "content", layer, clipped: [] });
     }
-    return out;
+    return steps;
+  }
+  runSteps(steps, acc, empty, r) {
+    for (const s of steps) empty = this.runStep(s, acc, empty, r);
+    return empty;
   }
-  // --- Running steps ---------------------------------------------------------
-  /** Runs one step onto `acc`; returns whether `acc` is still empty. */
   runStep(step, acc, empty, r) {
     if (step.kind === "adjust") {
       if (empty) return true;
@@ -3215,131 +3014,368 @@ var RasterCompositor = class {
     const layer = step.layer;
     if (!layer.visible) return empty;
     const clipped = step.clipped.filter((l) => l.visible);
-    if (this.hasEffects(layer)) return this.runEffectStep(layer, clipped, acc, empty, r);
-    const coverage = this.maskTile(layer, r);
+    if ((step.kind === "content" || step.kind === "group") && this.deepEffects(layer)) return this.runEffects(layer, clipped, acc, r, step.kind === "group" ? step.steps : null) ? false : empty;
+    const coverage = this.renderedAlone(layer) ? null : this.base.maskCoverage(layer, r, this.sources);
     if (coverage && coverage.every((v) => v <= 0)) return empty;
-    if (step.kind === "group") {
+    if (step.kind === "group" && !this.renderedAlone(layer)) {
       if (layer.blend === "pass-through" && !clipped.length) {
         if (layer.opacity >= 1 && !coverage) return this.runSteps(step.steps, acc, empty, r);
-        const before = new Uint8ClampedArray(acc);
+        const before = acc.slice();
         const stillEmpty = this.runSteps(step.steps, acc, empty, r);
-        lerpTile(acc, before, layer.opacity, coverage);
+        lerp(acc, before, layer.opacity, coverage);
         return empty && stillEmpty;
       }
-      const buf2 = new Uint8ClampedArray(acc.length);
+      const buf2 = new Float32Array(acc.length);
       if (this.runSteps(step.steps, buf2, true, r)) return empty;
       this.applyClipped(clipped, buf2, r);
-      const mode = layer.blend === "pass-through" ? "normal" : layer.blend;
-      return this.blendOnto(acc, buf2, empty, mode, layer.opacity, coverage);
+      const mode2 = layer.blend === "pass-through" ? "normal" : layer.blend;
+      this.blend(acc, buf2, mode2, layer.opacity, coverage);
+      return false;
+    }
+    const content = this.content(layer, r);
+    if (!content) return empty;
+    const ambient = layer.edge?.ambient ?? 0;
+    if (ambient > 0) {
+      const c = layer.edge?.ambientColor;
+      const color2 = c ? c.map((v) => this.linear ? srgbDecode(v / 255) : v / 255) : null;
+      if (color2 || !empty) applyEdgeAmbient(content, acc, coverage, ambient, color2, 1);
+    }
+    const alone = this.renderedAlone(layer);
+    const fill2 = !alone && this.isPixel(layer) ? layer.fillOpacity ?? 1 : 1;
+    const mode = this.blendOf(layer);
+    if (!clipped.length) {
+      this.blend(acc, content, mode, layer.opacity * fill2, coverage);
+      return false;
+    }
+    const buf = new Float32Array(acc.length);
+    this.blend(buf, content, "normal", fill2, coverage);
+    this.applyClipped(clipped, buf, r);
+    this.blend(acc, buf, mode, layer.opacity, null);
+    return false;
+  }
+  /**
+   * A pixel layer with effects onto `acc` over `r`: its deep content (filters, mask, clipped
+   * layers) and the effects composited in float. Effect maps come from the 8-bit shape. At 32
+   * bits the effects composite in sRGB-encoded values (their colours and blends are defined
+   * there) and the result is decoded back. Returns whether anything was drawn.
+   */
+  runEffects(layer, clipped, acc, r, groupSteps = null) {
+    const fx = this.base.effectsInput(layer, r, this.sources);
+    if (!fx) return false;
+    const a = fx.rect;
+    let content;
+    if (groupSteps) {
+      content = new Float32Array(a.width * a.height * 4);
+      this.runSteps(groupSteps, content, true, a);
+    } else content = this.content(layer, a) ?? new Float32Array(a.width * a.height * 4);
+    const coverage = this.base.maskCoverage(layer, a, this.sources);
+    if (coverage) for (let i = 0; i < coverage.length; i++) content[i * 4 + 3] *= coverage[i];
+    if (clipped.length) this.applyClipped(clipped, content, a);
+    const sub = new Float32Array(a.width * a.height * 4);
+    for (let y = 0; y < a.height; y++) {
+      const s = ((a.y - r.y + y) * r.width + (a.x - r.x)) * 4;
+      sub.set(acc.subarray(s, s + a.width * 4), y * a.width * 4);
+    }
+    if (this.linear) {
+      encodeInPlace(sub);
+      encodeInPlace(content);
+    }
+    compositeLayerEffects({ ...fx, backdrop: sub, content });
+    if (this.linear) decodeInPlace(sub);
+    for (let y = 0; y < a.height; y++) acc.set(sub.subarray(y * a.width * 4, (y + 1) * a.width * 4), ((a.y - r.y + y) * r.width + (a.x - r.x)) * 4);
+    return true;
+  }
+  applyClipped(clipped, buf, r) {
+    let run = [];
+    const flush = () => {
+      if (run.length) this.applyFilterRun(run, buf, r);
+      run = [];
+    };
+    for (const c of clipped) {
+      if (this.isFilter(c)) {
+        run.push(c);
+        continue;
+      }
+      flush();
+      const alone = this.renderedAlone(c);
+      const coverage = alone ? null : this.base.maskCoverage(c, r, this.sources);
+      let src;
+      if (isGroup2(c) && !alone) {
+        src = new Float32Array(buf.length);
+        if (this.runSteps(this.buildSteps(c.children ?? []), src, true, r)) continue;
+      } else src = this.content(c, r);
+      if (!src) continue;
+      const fill2 = !alone && this.isPixel(c) ? c.fillOpacity ?? 1 : 1;
+      const keep = new Float32Array(buf.length >> 2);
+      for (let i = 3, p = 0; i < buf.length; i += 4, p++) keep[p] = buf[i];
+      this.blend(buf, src, c.blend === "pass-through" ? "normal" : this.blendOf(c), c.opacity * fill2, coverage);
+      for (let i = 3, p = 0; i < buf.length; i += 4, p++) buf[i] = keep[p];
+    }
+    flush();
+  }
+  applyFilterRun(layers, acc, r) {
+    const visible = [];
+    let masks;
+    for (const node of layers) {
+      if (!node.visible) continue;
+      const cov = this.base.maskCoverage(node, r, this.sources);
+      if (cov) {
+        if (cov.every((v) => v <= 0)) continue;
+        (masks ??= /* @__PURE__ */ new Map()).set(node.id, cov);
+      }
+      visible.push(node);
+    }
+    if (!visible.length) return;
+    if (this.deep.applyFilterRunDeep) {
+      if (this.linear) mapColour(acc, srgbEncode);
+      this.deep.applyFilterRunDeep(visible, acc, r, masks, this.sources);
+      if (this.linear) mapColour(acc, srgbDecode);
+      return;
+    }
+    const bytes = this.to8(acc);
+    this.profile.applyFilterRun?.(visible, bytes, r, masks, this.sources);
+    acc.set(this.from8(bytes));
+  }
+  // --- Layer content ---------------------------------------------------------------
+  /** Layers drawn by the 8-bit compositor alone (effects, pixel filters, content the editor draws). */
+  /** A pixel(-like) layer or a group with effects: composited in float through `compositeLayerEffects`. */
+  deepEffects(layer) {
+    return hasActiveEffects(layer.effects) && !this.isFilter(layer) && (isGroup2(layer) || this.isPixel(layer));
+  }
+  renderedAlone(layer) {
+    if (hasActiveEffects(layer.effects) && !this.isFilter(layer) && !this.deepEffects(layer)) return true;
+    if (this.isPixel(layer)) return Boolean(this.profile.pixelFilters?.(layer)) && !this.deep.pixelFiltersDeep?.(layer);
+    return !isGroup2(layer);
+  }
+  blendOf(layer) {
+    return this.profile.contentBlend?.(layer) ?? layer.blend;
+  }
+  /** A layer's float RGBA over `r` (straight alpha, working space), or `null` when it has none there. */
+  content(layer, r) {
+    if (this.renderedAlone(layer)) {
+      const edge = layer.edge?.ambient ? { ...layer.edge, ambient: 0 } : layer.edge;
+      const solo = { ...layer, blend: isGroup2(layer) && layer.blend === "pass-through" ? "pass-through" : "normal", opacity: 1, clipped: false, edge };
+      const bytes = this.base.composite([solo], r, this.sources);
+      return this.from8(bytes);
+    }
+    const surface = this.sources.surfaceOf ? this.sources.surfaceOf(layer) : layer.surface;
+    if (!surface) return null;
+    const ox = layer.offset?.x ?? 0;
+    const oy = layer.offset?.y ?? 0;
+    const filters = this.isPixel(layer) ? this.deep.pixelFiltersDeep?.(layer) ?? null : null;
+    if (!filters) return this.samples(surface, { x: r.x - ox, y: r.y - oy, width: r.width, height: r.height });
+    const m = filters.reach;
+    const W = this.sources.width;
+    const H = this.sources.height;
+    const x0 = m ? Math.max(0, r.x - m) : r.x;
+    const y0 = m ? Math.max(0, r.y - m) : r.y;
+    const x1 = m ? Math.min(W, r.x + r.width + m) : r.x + r.width;
+    const y1 = m ? Math.min(H, r.y + r.height + m) : r.y + r.height;
+    if (x1 <= x0 || y1 <= y0) return new Float32Array(r.width * r.height * 4);
+    const big = { x: x0, y: y0, width: x1 - x0, height: y1 - y0 };
+    const data = this.samples(surface, { ...big, x: big.x - ox, y: big.y - oy });
+    filters.apply(data, big.width, big.height, this.linear);
+    if (big.x === r.x && big.y === r.y && big.width === r.width && big.height === r.height) return data;
+    const out = new Float32Array(r.width * r.height * 4);
+    for (let y = 0; y < r.height; y++) {
+      const sy = r.y + y - big.y;
+      if (sy < 0 || sy >= big.height) continue;
+      for (let x = 0; x < r.width; x++) {
+        const sx = r.x + x - big.x;
+        if (sx < 0 || sx >= big.width) continue;
+        const s = (sy * big.width + sx) * 4;
+        const d = (y * r.width + x) * 4;
+        out[d] = data[s];
+        out[d + 1] = data[s + 1];
+        out[d + 2] = data[s + 2];
+        out[d + 3] = data[s + 3];
+      }
     }
-    const content = this.contentTile(step.layer, r);
-    if (!content) return empty;
-    const fill2 = this.isPixel(step.layer) ? step.layer.fillOpacity ?? 1 : 1;
-    const blend2 = this.contentBlend(step.layer);
-    if (!clipped.length) return this.blendOnto(acc, content, empty, blend2, layer.opacity * fill2, coverage);
-    const buf = new Uint8ClampedArray(acc.length);
-    blendTile(buf, content, "normal", fill2, coverage);
-    this.applyClipped(clipped, buf, r);
-    return this.blendOnto(acc, buf, empty, blend2, layer.opacity, null);
+    return out;
   }
-  runSteps(steps, acc, empty, r) {
-    for (const s of steps) empty = this.runStep(s, acc, empty, r);
-    return empty;
+  /** A surface's samples over `rect` (layer space) in the working space. */
+  samples(surface, rect) {
+    const samples = readDeepRegion(surface, rect, this.depth);
+    if (samples instanceof Float32Array) return samples;
+    const out = new Float32Array(samples.length);
+    for (let i = 0; i < samples.length; i++) out[i] = samples[i] / 65535;
+    return out;
   }
-  contentBlend(layer) {
-    return this.profile.contentBlend?.(layer) ?? layer.blend;
+  /** 8-bit RGBA to the working space. */
+  from8(bytes) {
+    if (this.linear) return to32From8(bytes, 4);
+    const out = new Float32Array(bytes.length);
+    for (let i = 0; i < bytes.length; i++) out[i] = bytes[i] / 255;
+    return out;
   }
-  blendOnto(acc, src, empty, mode, alpha, coverage) {
-    if (!(alpha > 0)) return empty;
-    if (empty && mode === "normal" && alpha >= 1 && !coverage) {
-      acc.set(src);
-      return false;
+  /** The working space to 8-bit RGBA. */
+  to8(acc) {
+    const out = new Uint8ClampedArray(acc.length);
+    for (let i = 0; i < acc.length; i += 4) {
+      for (let c = 0; c < 3; c++) out[i + c] = Math.round((this.linear ? srgbEncode(acc[i + c]) : acc[i + c]) * 255);
+      out[i + 3] = Math.round(acc[i + 3] * 255);
     }
-    blendTile(acc, src, mode, alpha, coverage);
-    return false;
+    return out;
   }
-  applyClipped(clipped, buf, r) {
-    let run = [];
-    const flush = () => {
-      if (run.length) this.applyFilterRun(run, buf, r);
-      run = [];
-    };
-    for (const c of clipped) {
-      if (this.isFilter(c)) {
-        run.push(c);
+  // --- Blending --------------------------------------------------------------------
+  /** `src` over `dst` with `mode` at `alpha` × coverage (straight alpha, float), as `blendTile`. */
+  blend(dst, src, mode, alpha, coverage) {
+    if (!(alpha > 0)) return;
+    const normal = mode === "normal";
+    const pigment = mode === "pigment";
+    const cb = [0, 0, 0];
+    const cs = [0, 0, 0];
+    const mix = [0, 0, 0];
+    for (let i = 0, p = 0; i < dst.length; i += 4, p++) {
+      const sa = src[i + 3];
+      if (!(sa > 0)) continue;
+      const k = coverage ? alpha * coverage[p] : alpha;
+      if (!(k > 0)) continue;
+      const as = Math.min(1, sa * k);
+      const ab = dst[i + 3];
+      const ao = as + ab * (1 - as);
+      if (ao <= 0) {
+        dst[i] = dst[i + 1] = dst[i + 2] = dst[i + 3] = 0;
         continue;
       }
-      flush();
-      if (this.hasEffects(c) && !isGroup2(c)) {
-        this.compositeEffects(c, [], buf, r, true);
+      if (normal && as >= 1) {
+        dst[i] = src[i];
+        dst[i + 1] = src[i + 1];
+        dst[i + 2] = src[i + 2];
+        dst[i + 3] = 1;
         continue;
       }
-      const coverage = this.maskTile(c, r);
-      if (isGroup2(c)) {
-        const inner = new Uint8ClampedArray(buf.length);
-        if (this.runSteps(this.buildSteps(c.children ?? []), inner, true, r)) continue;
-        const mode = c.blend === "pass-through" ? "normal" : c.blend;
-        blendAtop(buf, inner, mode, c.opacity, coverage);
-        continue;
+      for (let c = 0; c < 3; c++) {
+        cb[c] = dst[i + c];
+        cs[c] = src[i + c];
       }
-      const content = this.contentTile(c, r);
-      if (!content) continue;
-      const fill2 = this.isPixel(c) ? c.fillOpacity ?? 1 : 1;
-      blendAtop(buf, content, this.contentBlend(c), c.opacity * fill2, coverage);
-    }
-    flush();
-  }
-  applyFilterRun(layers, acc, r) {
-    const visible = [];
-    let masks;
-    for (const node of layers) {
-      if (!node.visible) continue;
-      const cov = this.maskTile(node, r);
-      if (cov) {
-        if (cov.every((v) => v <= 0)) continue;
-        (masks ??= /* @__PURE__ */ new Map()).set(node.id, cov);
+      if (pigment) {
+        if (this.linear) for (let c = 0; c < 3; c++) cb[c] = srgbEncode(cb[c]), cs[c] = srgbEncode(cs[c]);
+        mixPigmentRgb(cb, cs, as / ao, mix);
+        for (let c = 0; c < 3; c++) dst[i + c] = this.linear ? srgbDecode(mix[c]) : mix[c];
+        dst[i + 3] = ao;
+        continue;
       }
-      visible.push(node);
+      const m = normal ? cs : blendRgb(mode, cb, cs);
+      const wb = (1 - as) * ab;
+      const ws = (1 - ab) * as;
+      const wm = as * ab;
+      for (let c = 0; c < 3; c++) dst[i + c] = (wb * cb[c] + ws * cs[c] + wm * m[c]) / ao;
+      dst[i + 3] = ao;
     }
-    if (visible.length) this.profile.applyFilterRun?.(visible, acc, r, masks, this.sources);
   }
 };
-function filterOverCanvas(surface, ox, oy, filters, width, height) {
-  if (width <= 0 || height <= 0) return emptySurface(4);
-  const data = readRegion(surface, { x: -ox, y: -oy, width, height });
-  filters.apply(data, width, height);
-  return surfaceFromPixels({ width, height, data }, 4, 0, 0);
-}
-function copyRect(data, r, a) {
-  const out = new Uint8ClampedArray(a.width * a.height * 4);
-  for (let y = 0; y < a.height; y++) {
-    const s = ((a.y - r.y + y) * r.width + (a.x - r.x)) * 4;
-    out.set(data.subarray(s, s + a.width * 4), y * a.width * 4);
+function lerp(dst, before, alpha, coverage) {
+  for (let i = 0, p = 0; i < dst.length; i += 4, p++) {
+    const k = coverage ? alpha * coverage[p] : alpha;
+    if (k >= 1) continue;
+    for (let c = 0; c < 4; c++) dst[i + c] = before[i + c] + (dst[i + c] - before[i + c]) * k;
   }
-  return out;
 }
-function pasteRect(data, r, part, a) {
-  for (let y = 0; y < a.height; y++) data.set(part.subarray(y * a.width * 4, (y + 1) * a.width * 4), ((a.y - r.y + y) * r.width + (a.x - r.x)) * 4);
+function mapColour(data, f) {
+  for (let i = 0; i < data.length; i += 4) {
+    data[i] = f(data[i]);
+    data[i + 1] = f(data[i + 1]);
+    data[i + 2] = f(data[i + 2]);
+  }
 }
-function sameRect(a, b) {
-  return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
+function workingToSamples(data, depth) {
+  if (depth === 32) return data;
+  const out = new Uint16Array(data.length);
+  for (let i = 0; i < data.length; i++) {
+    const v = data[i];
+    out[i] = v > 0 ? v < 1 ? Math.round(v * 65535) : 65535 : 0;
+  }
+  return out;
 }
-function inflateRect(r, m) {
-  return { x: r.x - m, y: r.y - m, width: r.width + 2 * m, height: r.height + 2 * m };
+function encodeInPlace(d) {
+  for (let i = 0; i < d.length; i += 4) {
+    d[i] = srgbEncode(d[i]);
+    d[i + 1] = srgbEncode(d[i + 1]);
+    d[i + 2] = srgbEncode(d[i + 2]);
+  }
 }
-function intersectRect(a, b) {
-  const x0 = Math.max(a.x, b.x);
-  const y0 = Math.max(a.y, b.y);
-  const x1 = Math.min(a.x + a.width, b.x + b.width);
-  const y1 = Math.min(a.y + a.height, b.y + b.height);
-  return x1 <= x0 || y1 <= y0 ? { x: x0, y: y0, width: 0, height: 0 } : { x: x0, y: y0, width: x1 - x0, height: y1 - y0 };
+function decodeInPlace(d) {
+  for (let i = 0; i < d.length; i += 4) {
+    d[i] = srgbDecode(d[i]);
+    d[i + 1] = srgbDecode(d[i + 1]);
+    d[i + 2] = srgbDecode(d[i + 2]);
+  }
 }
-function changedTiles(a, b) {
+
+// src/raster/layers.ts
+var childrenOf = (l) => l.type === "group" ? l.children ?? null : null;
+function flattenLayers(layers) {
   const out = [];
-  for (const [k, t] of b.tiles) if (a.tiles.get(k) !== t) out.push(k);
-  for (const k of a.tiles.keys()) if (!b.tiles.has(k)) out.push(k);
+  const walk = (list) => {
+    for (const l of list) {
+      out.push(l);
+      const c = childrenOf(l);
+      if (c) walk(c);
+    }
+  };
+  walk(layers);
   return out;
 }
+function findLayer(layers, id) {
+  const walk = (list, parent, path) => {
+    for (let i = 0; i < list.length; i++) {
+      const l = list[i];
+      if (l.id === id) return { layer: l, parent, index: i, path };
+      const c = childrenOf(l);
+      if (c) {
+        const g = l;
+        const hit = walk(c, g, [...path, g]);
+        if (hit) return hit;
+      }
+    }
+    return null;
+  };
+  return walk(layers, null, []);
+}
+function mapLayer(layers, id, fn) {
+  let changed = false;
+  const walk = (list) => {
+    let out = null;
+    for (let i = 0; i < list.length; i++) {
+      const l = list[i];
+      let next = l;
+      if (l.id === id) {
+        next = fn(l);
+        changed = true;
+      } else {
+        const c = childrenOf(l);
+        if (c) {
+          const children = walk(c);
+          if (children !== c) next = { ...l, children };
+        }
+      }
+      if (next !== l) {
+        if (!out) out = list.slice(0, i);
+        if (next) out.push(next);
+      } else if (out) out.push(l);
+    }
+    return out ?? list;
+  };
+  const result = walk(layers);
+  return changed ? result : layers;
+}
+function insertLayer(layers, layer, parentId, index) {
+  const put = (list) => {
+    const at = index === void 0 ? list.length : Math.max(0, Math.min(list.length, index));
+    const next = list.slice();
+    next.splice(at, 0, layer);
+    return next;
+  };
+  if (!parentId) return put(layers);
+  return mapLayer(layers, parentId, (g) => {
+    const c = childrenOf(g);
+    return c ? { ...g, children: put(c) } : g;
+  });
+}
+function isLayerLocked(layer, what) {
+  return Boolean(layer.locks?.all || layer.locks?.[what]);
+}
 
 // src/raster/transform.ts
 var INTERPOLATIONS = ["nearest", "bilinear", "bicubic"];
@@ -4181,13 +4217,13 @@ export {
   validateLayerEffects,
   normalizeLayerEffects,
   effectsFingerprint,
-  CURVE_LUT_SIZE,
-  curveLut,
   PatternTile,
   PatternPlacement,
   builtinPatternIds,
   builtinPattern,
   hashNoise,
+  CURVE_LUT_SIZE,
+  curveLut,
   STROKE_CHAMFER_MAX,
   contourLut,
   activeEffectItems,
@@ -4198,6 +4234,10 @@ export {
   effectFillColors,
   compositeLayerEffects,
   renderLayerEffects,
+  applyEdgeAmbient,
+  blendTile,
+  RasterCompositor,
+  changedTiles,
   DeepCompositor,
   workingToSamples,
   flattenLayers,
@@ -4205,9 +4245,6 @@ export {
   mapLayer,
   insertLayer,
   isLayerLocked,
-  blendTile,
-  RasterCompositor,
-  changedTiles,
   INTERPOLATIONS,
   isInterpolation,
   MAX_TRANSFORM_PIXELS,