@pixerate/editor 0.249.0 → 0.251.0

package/dist/paint-editor/index.js

@@ -1,10 +1,12 @@
 import {
   StickerBrowser,
+  createStickerTools,
+  describeStickerRef,
   editorStickers
-} from "../chunk-EJLRBS5Q.js";
+} from "../chunk-WZOGDKCQ.js";
 import {
   toVideoFfmpeg
-} from "../chunk-L3JFOTBQ.js";
+} from "../chunk-5E2Q7ZHI.js";
 import {
   createLayerEffectTools,
   deserializeLayers,
@@ -12,7 +14,7 @@ import {
   resolveExternalAssets,
   serializeLayers,
   serializeLayersExternal
-} from "../chunk-UBRJOIR5.js";
+} from "../chunk-QC3OXRE4.js";
 import "../chunk-3CI7FRMK.js";
 import "../chunk-ZNA3IQZF.js";
 import {
@@ -68,12 +70,11 @@ import {
   realPresenceClock,
   tweenPresenceCursor
 } from "../chunk-IVSWRVB4.js";
-import "../chunk-PZP2SZIZ.js";
+import "../chunk-GYMMNCFT.js";
 import {
   BRUSH_ID,
   BRUSH_ROTATIONS,
   BUILTIN_BRUSHES,
-  BristleStroke,
   DEFAULT_BEHAVIOR,
   DEFAULT_BRISTLE,
   DEFAULT_BRUSH_ID,
@@ -81,49 +82,26 @@ import {
   DEFAULT_IMPASTO,
   DEFAULT_LIGHT,
   DEFAULT_MULTI_COLOR,
-  DEFAULT_PAPER,
   DEFAULT_PARTICLE,
   DEFAULT_STICKER,
   DEFAULT_WET_BRUSH,
   DOT_ROTATIONS,
   DOT_TEXTURE_ORDERS,
-  DryStroke,
-  EFFECT_MAP_REPEATS,
-  EFFECT_STRIP_HEIGHT,
-  IDENTITY_COPY,
   IMPASTO_TOOLS,
   MAX_DOT_TEXTURES,
   MAX_STICKER_STAMPS,
   MULTI_COLOR_MODES,
   PAINT_BRUSH_CATEGORIES,
   PAINT_BRUSH_ENGINES,
-  PAPER_FAMILIES,
-  PAPER_LIBRARY,
   PARTICLE_KINDS,
   PARTICLE_RENDERS,
-  ParticleStroke,
-  PenDabWalker,
-  PenSmoother,
   RIBBON_PAIRS,
-  STICKER_ART_SIZE,
-  StickerArtCache,
-  StickerSpray,
   WET_MEDIA,
   WET_TOOLS,
-  addPolygonArea,
   brushTakesPaint,
   brushToJSON,
-  clonePaper,
-  defaultStickerRasterizer,
-  drawSticker,
-  effectDabField,
-  effectPaintKey,
-  effectPaintSize,
-  hexToRgb8,
-  isPaintEffectPaint,
   isWetBrush,
   isWetCapable,
-  mixerTip,
   multiColorToPaint,
   normalizeBehavior,
   normalizeBristle,
@@ -132,41 +110,27 @@ import {
   normalizeLight,
   normalizeMultiColor,
   normalizePaintBrush,
-  normalizePaper,
   normalizeParticle,
   normalizeStickerSettings,
-  normalizeStickerUpdate,
   normalizeWetBrush,
   paintToMultiColor,
-  paperPreset,
   parseBrushLibrary,
-  penOrientation,
-  readEffectStrokeMap,
-  readPaintEffectPaint,
-  renderPaper,
-  renderStickers,
-  sampleArt,
-  sampleEffectAt,
-  sampleEffectField,
-  stickerAt,
-  stickerRect,
-  stickerStamp,
-  stickerSurface,
-  tiltToOrientation,
-  toStrokePoint,
   usesPaintExchange
-} from "../chunk-J7T5QZ45.js";
+} from "../chunk-MTKY6K3Q.js";
 import {
   STAMP_KINDS,
   StickersSlot,
-  createStickerTools,
   editorStampOf,
   normalizeStickerRef,
-  stampCoverage
-} from "../chunk-5RH3VXAK.js";
+  stampCoverage,
+  stickerIdFor
+} from "../chunk-APX63ILU.js";
 import "../chunk-M6DNZNVY.js";
 import "../chunk-WEIK3UYB.js";
 import "../chunk-PWBZH3FK.js";
+import {
+  StickerError
+} from "../chunk-SZTI6EER.js";
 import {
   EffectRendererPool
 } from "../chunk-EHLOCVWB.js";
@@ -175,15 +139,20 @@ import {
   EffectsSlot,
   createEffectToolProvider,
   resolveEffectValues
-} from "../chunk-OFH6Q67U.js";
+} from "../chunk-JA57JIT5.js";
 import "../chunk-V2ZCJRDM.js";
+import {
+  GRAIN_PATTERNS,
+  GRAIN_TILE,
+  PaperGrain,
+  grainCatch,
+  grainHeights
+} from "../chunk-TXFWZ5ZJ.js";
 import {
   CoverageMap,
   DEFAULT_PAINT_GRADIENT,
   DEFAULT_PAINT_GRADIENT_MAPPING,
   EMPTY_MIXER_LOAD,
-  GRAIN_PATTERNS,
-  GRAIN_TILE,
   MAX_BRUSH_SIZE,
   MIXING_MODELS,
   PAINT_COLOR_JSON_SCHEMA,
@@ -201,8 +170,8 @@ import {
   PaintExchange,
   PaintGradientSampler,
   PaintSourceError,
-  PaperGrain,
   SmudgeTip,
+  TIP_GRADIENT_STEPS,
   TileMedium,
   addPaintGradientStop,
   applyStrokeToTile,
@@ -211,8 +180,6 @@ import {
   createBlenderScratch,
   dabRect,
   exchangeRates,
-  grainCatch,
-  grainHeights,
   hexToPaintRgb,
   isGradientPaint,
   loadMixer,
@@ -230,7 +197,7 @@ import {
   scalePaintGradient,
   solidPaint,
   updatePaintGradientStop
-} from "../chunk-D5KGAO4Z.js";
+} from "../chunk-GCVFEPJG.js";
 import {
   TileableNoise,
   hash2,
@@ -240,15 +207,6 @@ import {
   seedFromString
 } from "../chunk-4D6KP5BV.js";
 import "../chunk-ODBT55Q7.js";
-import {
-  BLEND_MODES,
-  PAINTERLY_BLEND_MODES,
-  isBlendMode,
-  isPainterlyBlendMode,
-  mixPigment8,
-  mixPigments,
-  standardBlendMode
-} from "../chunk-IRSTHLQQ.js";
 import {
   base64ToBytes,
   bytesToBase64,
@@ -258,6 +216,15 @@ import {
   parseDataUrl,
   pngDataUrl
 } from "../chunk-OTTT5N3K.js";
+import {
+  BLEND_MODES,
+  PAINTERLY_BLEND_MODES,
+  isBlendMode,
+  isPainterlyBlendMode,
+  mixPigment8,
+  mixPigments,
+  standardBlendMode
+} from "../chunk-IRSTHLQQ.js";
 import {
   TILE,
   TiledSurface,
@@ -282,22 +249,156 @@ import {
   defineEditorDocument
 } from "../chunk-XBQX76CT.js";
 import "../chunk-HF5QZS7Z.js";
-import "../chunk-V6DT2CDH.js";
+import "../chunk-M2TPMYJE.js";
 import "../chunk-2WPNAGHI.js";
 import {
   HARMONY_KINDS,
   colorHarmony,
   hueToWheel,
   wheelToHue
-} from "../chunk-BP6KSGVD.js";
-import "../chunk-6ADHGQ73.js";
-import "../chunk-JEGJP4OW.js";
+} from "../chunk-7272D3K2.js";
+import "../chunk-YBAPT7NL.js";
 import {
   linearToSrgb,
+  oklabToOklch,
+  oklabToRgb,
+  oklchToOklab,
+  rgbToOklab,
   srgbToLinear
-} from "../chunk-F67XMVDI.js";
+} from "../chunk-MHLU6GRJ.js";
 import "../chunk-6ONMQ6WF.js";
 
+// src/paint-editor/paper.ts
+var PAPER_FAMILIES = ["watercolor", "drawing", "pastel", "canvas", "panel", "smooth"];
+var unit = (v, d) => typeof v === "number" && Number.isFinite(v) ? Math.min(1, Math.max(0, v)) : d;
+var clampNum = (v, lo, hi, d) => typeof v === "number" && Number.isFinite(v) ? Math.min(hi, Math.max(lo, v)) : d;
+var HEX = /^#[0-9a-f]{6}$/i;
+var tuning = (contrast = 1, invert = false) => ({ contrast, invert });
+function preset(id, name, family, pattern, color, o) {
+  return {
+    preset: id,
+    name,
+    family,
+    pattern,
+    seed: o.seed ?? 1,
+    color,
+    scale: o.scale ?? 1,
+    tiling: "mirror",
+    depth: o.depth,
+    shading: o.shading ?? 0.5,
+    dry: tuning(o.contrast ?? 1),
+    wet: tuning(1),
+    absorption: o.absorption,
+    permeability: o.permeability,
+    roughness: o.roughness,
+    ...o.backlight ? { backlight: o.backlight, backlightColor: o.backlightColor ?? "#fff1d6" } : {}
+  };
+}
+var PAPER_LIBRARY = [
+  preset("cold-pressed", "Cold pressed watercolour", "watercolor", "cold-pressed", "#f7f3ea", { depth: 0.5, absorption: 0.7, permeability: 0.5, roughness: 0.6 }),
+  preset("hot-pressed", "Hot pressed watercolour", "watercolor", "hot-pressed", "#f8f6ef", { depth: 0.25, absorption: 0.55, permeability: 0.4, roughness: 0.25 }),
+  preset("rough-watercolor", "Rough watercolour", "watercolor", "rough", "#f5f0e4", { depth: 0.75, absorption: 0.8, permeability: 0.6, roughness: 0.85 }),
+  preset("cartridge", "Cartridge", "drawing", "vellum", "#fbfaf6", { depth: 0.3, absorption: 0.4, permeability: 0.3, roughness: 0.35 }),
+  preset("laid", "Laid paper", "drawing", "laid", "#f3ecdc", { depth: 0.45, absorption: 0.45, permeability: 0.35, roughness: 0.45 }),
+  preset("ingres", "Charcoal paper", "drawing", "ingres", "#ede6d6", { depth: 0.6, absorption: 0.4, permeability: 0.3, roughness: 0.65 }),
+  preset("sanded-pastel", "Sanded pastel paper", "pastel", "sanded", "#d8cfc0", { depth: 0.7, absorption: 0.3, permeability: 0.2, roughness: 0.9, shading: 0.35 }),
+  preset("pastel-card", "Grey pastel card", "pastel", "sanded", "#9c978e", { depth: 0.55, absorption: 0.3, permeability: 0.2, roughness: 0.75, scale: 1.5, shading: 0.3 }),
+  preset("cotton-canvas", "Cotton canvas", "canvas", "canvas", "#efe9dc", { depth: 0.55, absorption: 0.35, permeability: 0.25, roughness: 0.6 }),
+  preset("fine-linen", "Fine linen", "canvas", "linen", "#e9e2d2", { depth: 0.45, absorption: 0.3, permeability: 0.25, roughness: 0.5 }),
+  preset("gesso", "Gesso panel", "panel", "gesso", "#f6f4ef", { depth: 0.35, absorption: 0.2, permeability: 0.15, roughness: 0.4 }),
+  preset("smooth", "Smooth bristol", "smooth", "smooth", "#ffffff", { depth: 0, absorption: 0.3, permeability: 0.2, roughness: 0.05, shading: 0 }),
+  // Backlit: smooth paper on a lightbox, for glazes that glow like stained glass.
+  preset("stained-glass", "Stained glass (backlit)", "smooth", "smooth", "#ffffff", { depth: 0, absorption: 0.35, permeability: 0.25, roughness: 0.05, shading: 0, backlight: 0.8, backlightColor: "#fff1d6" })
+];
+var DEFAULT_PAPER = PAPER_LIBRARY[0];
+function paperPreset(id) {
+  const p = PAPER_LIBRARY.find((x) => x.preset === id);
+  return p ? clonePaper(p) : void 0;
+}
+function clonePaper(p) {
+  return { ...p, dry: { ...p.dry }, wet: { ...p.wet }, ...p.offset ? { offset: { ...p.offset } } : {} };
+}
+function readOffset(raw, d) {
+  const o = raw && typeof raw === "object" ? raw : null;
+  const x = o && typeof o.x === "number" && Number.isFinite(o.x) ? Math.round(o.x) : d?.x ?? 0;
+  const y = o && typeof o.y === "number" && Number.isFinite(o.y) ? Math.round(o.y) : d?.y ?? 0;
+  return x || y ? { offset: { x, y } } : {};
+}
+function readTuning(raw, d) {
+  const r = raw && typeof raw === "object" ? raw : {};
+  return { contrast: clampNum(r.contrast, 0, 3, d.contrast), invert: typeof r.invert === "boolean" ? r.invert : d.invert };
+}
+function normalizePaper(raw = {}, base) {
+  const r = raw;
+  const b = base ?? (typeof r.preset === "string" ? paperPreset(r.preset) : void 0) ?? clonePaper(DEFAULT_PAPER);
+  return {
+    preset: typeof r.preset === "string" && r.preset ? r.preset : b.preset,
+    name: typeof r.name === "string" && r.name.trim() ? r.name.trim() : b.name,
+    family: PAPER_FAMILIES.includes(r.family) ? r.family : b.family,
+    pattern: GRAIN_PATTERNS.includes(r.pattern) ? r.pattern : b.pattern,
+    seed: typeof r.seed === "number" && Number.isFinite(r.seed) ? Math.round(Math.abs(r.seed)) % 2147483647 : b.seed,
+    color: typeof r.color === "string" && HEX.test(r.color) ? r.color.toLowerCase() : b.color,
+    scale: clampNum(r.scale, 0.25, 8, b.scale),
+    tiling: r.tiling === "repeat" || r.tiling === "mirror" ? r.tiling : b.tiling,
+    depth: unit(r.depth, b.depth),
+    shading: unit(r.shading, b.shading),
+    dry: readTuning(r.dry, b.dry),
+    wet: readTuning(r.wet, b.wet),
+    absorption: unit(r.absorption, b.absorption),
+    permeability: unit(r.permeability, b.permeability),
+    roughness: unit(r.roughness, b.roughness),
+    ...unit(r.metallic, b.metallic ?? 0) > 0 ? { metallic: unit(r.metallic, b.metallic ?? 0) } : {},
+    ...unit(r.backlight, b.backlight ?? 0) > 0 ? { backlight: unit(r.backlight, b.backlight ?? 0) } : {},
+    ...typeof r.backlightColor === "string" && HEX.test(r.backlightColor) ? { backlightColor: r.backlightColor.toLowerCase() } : b.backlightColor ? { backlightColor: b.backlightColor } : {},
+    ...readOffset(r.offset, b.offset)
+  };
+}
+function hexToRgb8(hex) {
+  const n = parseInt(hex.slice(1, 7), 16);
+  return [n >> 16 & 255, n >> 8 & 255, n & 255];
+}
+function renderPaper(paper, rect, grain = new PaperGrain(paper), light) {
+  const [r, g, b] = hexToRgb8(paper.color);
+  const out = new Uint8ClampedArray(rect.width * rect.height * 4);
+  const shade = grain.flat ? 0 : paper.shading * 0.16;
+  const metal = light ? paper.metallic ?? 0 : 0;
+  let hx = 0;
+  let hy = 0;
+  let hz = 1;
+  if (metal > 0 && light) {
+    const az = light.azimuth * Math.PI / 180;
+    const el = light.elevation * Math.PI / 180;
+    const lx = Math.cos(el) * Math.sin(az);
+    const ly = -Math.cos(el) * Math.cos(az);
+    const lz = Math.sin(el) + 1;
+    const n = Math.hypot(lx, ly, lz);
+    hx = lx / n;
+    hy = ly / n;
+    hz = lz / n;
+  }
+  for (let y = 0; y < rect.height; y++) {
+    for (let x = 0; x < rect.width; x++) {
+      const i = (y * rect.width + x) * 4;
+      const px = rect.x + x + 0.5;
+      const py = rect.y + y + 0.5;
+      const k = shade ? 1 - shade * (1 - grain.at(px, py)) : 1;
+      let spec = 0;
+      if (metal > 0) {
+        const gx = (grain.at(px + 1, py) - grain.at(px - 1, py)) * 4;
+        const gy = (grain.at(px, py + 1) - grain.at(px, py - 1)) * 4;
+        const nl = Math.hypot(gx, gy, 1);
+        const nh = Math.max(0, (-gx * hx - gy * hy + hz) / nl);
+        spec = metal * Math.pow(nh, 24) * 0.9;
+      }
+      out[i] = Math.min(255, r * k * (1 - 0.25 * metal) + spec * (r * 0.6 + 102));
+      out[i + 1] = Math.min(255, g * k * (1 - 0.25 * metal) + spec * (g * 0.6 + 102));
+      out[i + 2] = Math.min(255, b * k * (1 - 0.25 * metal) + spec * (b * 0.6 + 102));
+      out[i + 3] = 255;
+    }
+  }
+  return out;
+}
+
 // src/paint-editor/document.ts
 var MIN_CANVAS_SIDE = 1;
 var MAX_CANVAS_SIDE = 16384;
@@ -332,6 +433,426 @@ function createPaintDocument(options = {}) {
   return { canvas, paper: normalizePaper(options.paper ?? {}), layers: [layer], activeLayerId: layer.id, strokes: [] };
 }
 
+// src/paint-editor/effect-paint.ts
+var EFFECT_STRIP_HEIGHT = 256;
+var EFFECT_MAP_REPEATS = ["repeat", "mirror", "clamp"];
+function effectPaintSize(p, canvas) {
+  return p.map ? { width: p.map.length, height: EFFECT_STRIP_HEIGHT } : { width: canvas.width, height: canvas.height };
+}
+function readEffectStrokeMap(raw) {
+  if (raw === void 0 || raw === null || raw.by === "canvas") return void 0;
+  const r = raw;
+  if (r.by !== "stroke") throw new Error(`map.by ${JSON.stringify(r.by)} is not a mapping; use "canvas" (fixed to the canvas) or "stroke" (along each stroke).`);
+  const length = r.length === void 0 ? 300 : Number(r.length);
+  if (!(Number.isFinite(length) && length >= 16 && length <= 4096)) throw new Error(`map.length ${JSON.stringify(r.length)} is out of range; use 16..4096 px of stroke per repeat.`);
+  const repeat = r.repeat === void 0 ? "repeat" : r.repeat;
+  if (!EFFECT_MAP_REPEATS.includes(repeat)) throw new Error(`map.repeat ${JSON.stringify(r.repeat)} is not a repeat mode; use ${EFFECT_MAP_REPEATS.join(", ")}.`);
+  return { by: "stroke", length: Math.round(length), repeat };
+}
+function stripIndex(img, map, dab, x, y) {
+  const ca = Math.cos(dab.direction);
+  const sa = Math.sin(dab.direction);
+  const dx = x - dab.x;
+  const dy = y - dab.y;
+  let u = (dab.travel + dx * ca - dy * sa) / map.length;
+  if (map.repeat === "clamp") u = Math.min(1, Math.max(0, u));
+  else if (map.repeat === "mirror") {
+    const m = (u % 2 + 2) % 2;
+    u = m > 1 ? 2 - m : m;
+  } else u = (u % 1 + 1) % 1;
+  const v = Math.min(1, Math.max(0, ((dx * sa + dy * ca) / Math.max(0.5, dab.radius) + 1) / 2));
+  const px = Math.min(img.width - 1, Math.floor(u * img.width));
+  const py = Math.min(img.height - 1, Math.floor(v * img.height));
+  return (py * img.width + px) * 4;
+}
+function effectPaintKey(p) {
+  return JSON.stringify({ type: "effect", effect: p.effect, provider: p.provider, values: p.values, time: p.time, ...p.map ? { map: p.map } : {} });
+}
+function isPaintEffectPaint(raw) {
+  return Boolean(raw) && typeof raw === "object" && raw.type === "effect";
+}
+function readMapLeniently(raw) {
+  try {
+    return readEffectStrokeMap(raw);
+  } catch {
+    return void 0;
+  }
+}
+function readPaintEffectPaint(raw) {
+  if (!isPaintEffectPaint(raw)) return null;
+  const r = raw;
+  if (typeof r.effect !== "string" || !r.effect || !r.values || typeof r.values !== "object" || Array.isArray(r.values)) return null;
+  return {
+    type: "effect",
+    effect: r.effect,
+    provider: typeof r.provider === "string" ? r.provider : "",
+    values: JSON.parse(JSON.stringify(r.values)),
+    time: typeof r.time === "number" && Number.isFinite(r.time) && r.time > 0 ? r.time : 0,
+    ...readMapLeniently(r.map) ? { map: readMapLeniently(r.map) } : {},
+    ...r.live === true ? { live: true } : {}
+  };
+}
+function sampleEffectField(img, rect, vals, field, dab) {
+  const { width, height, data } = img;
+  if (img.map && dab) {
+    for (let yy = 0, k = 0; yy < rect.height; yy++) {
+      for (let xx = 0; xx < rect.width; xx++, k++) {
+        const i = stripIndex(img, img.map, dab, rect.x + xx + 0.5, rect.y + yy + 0.5);
+        const f = k * 3;
+        const a = data[i + 3];
+        if (a < 255) vals[k] *= a / 255;
+        field[f] = data[i] / 255;
+        field[f + 1] = data[i + 1] / 255;
+        field[f + 2] = data[i + 2] / 255;
+      }
+    }
+    return;
+  }
+  for (let yy = 0, k = 0; yy < rect.height; yy++) {
+    const y = rect.y + yy;
+    const inY = y >= 0 && y < height;
+    for (let xx = 0; xx < rect.width; xx++, k++) {
+      const x = rect.x + xx;
+      const f = k * 3;
+      if (!inY || x < 0 || x >= width) {
+        vals[k] = 0;
+        field[f] = field[f + 1] = field[f + 2] = 0;
+        continue;
+      }
+      const i = (y * width + x) * 4;
+      const a = data[i + 3];
+      if (a < 255) vals[k] *= a / 255;
+      field[f] = data[i] / 255;
+      field[f + 1] = data[i + 1] / 255;
+      field[f + 2] = data[i + 2] / 255;
+    }
+  }
+}
+function sampleEffectAt(img, x, y, out, dab) {
+  if (img.map && dab) {
+    const i2 = stripIndex(img, img.map, dab, x, y);
+    out[0] = img.data[i2] / 255;
+    out[1] = img.data[i2 + 1] / 255;
+    out[2] = img.data[i2 + 2] / 255;
+    return img.data[i2 + 3] / 255;
+  }
+  const px = Math.floor(x);
+  const py = Math.floor(y);
+  if (px < 0 || py < 0 || px >= img.width || py >= img.height) return 0;
+  const i = (py * img.width + px) * 4;
+  out[0] = img.data[i] / 255;
+  out[1] = img.data[i + 1] / 255;
+  out[2] = img.data[i + 2] / 255;
+  return img.data[i + 3] / 255;
+}
+function effectDabField(img, rect, cov, centre2, mixed, field, steps = 0, dab = null) {
+  sampleEffectField(img, rect, cov, field, dab);
+  const d0 = mixed[0] - centre2[0];
+  const d1 = mixed[1] - centre2[1];
+  const d2 = mixed[2] - centre2[2];
+  const n = rect.width * rect.height;
+  for (let k = 0; k < n; k++) {
+    if (steps) cov[k] = Math.round(cov[k] * steps) / steps;
+    const f = k * 3;
+    field[f] = Math.min(1, Math.max(0, field[f] + d0));
+    field[f + 1] = Math.min(1, Math.max(0, field[f + 1] + d1));
+    field[f + 2] = Math.min(1, Math.max(0, field[f + 2] + d2));
+  }
+}
+
+// src/paint-editor/engine.ts
+function penOrientation(p) {
+  if (typeof p.altitude === "number" && Number.isFinite(p.altitude)) {
+    const altitude = Math.min(Math.PI / 2, Math.max(0, p.altitude));
+    const azimuth = typeof p.azimuth === "number" && Number.isFinite(p.azimuth) ? p.azimuth : 0;
+    return { altitude, azimuth };
+  }
+  const hasX = typeof p.tiltX === "number" && Number.isFinite(p.tiltX);
+  const hasY = typeof p.tiltY === "number" && Number.isFinite(p.tiltY);
+  if (!hasX && !hasY) return null;
+  return tiltToOrientation(hasX ? p.tiltX : 0, hasY ? p.tiltY : 0);
+}
+function tiltToOrientation(tiltX, tiltY) {
+  const clampT = (v) => Math.min(89.999, Math.max(-89.999, v));
+  const tx = Math.tan(clampT(tiltX) * Math.PI / 180);
+  const ty = Math.tan(clampT(tiltY) * Math.PI / 180);
+  const r = Math.hypot(tx, ty);
+  if (r < 1e-9) return { altitude: Math.PI / 2, azimuth: 0 };
+  let azimuth = Math.atan2(ty, tx);
+  if (azimuth < 0) azimuth += 2 * Math.PI;
+  return { altitude: Math.atan(1 / r), azimuth };
+}
+var pressureOf = (p) => typeof p.pressure === "number" && Number.isFinite(p.pressure) ? Math.min(1, Math.max(0, p.pressure)) : 1;
+var PenSmoother = class {
+  pos = null;
+  pressure = null;
+  a;
+  ap;
+  constructor(position, pressure) {
+    this.a = 1 - Math.min(0.95, Math.max(0, position));
+    this.ap = 1 - Math.min(0.95, Math.max(0, pressure));
+  }
+  push(p) {
+    const pr = pressureOf(p);
+    if (!this.pos) {
+      this.pos = { x: p.x, y: p.y };
+      this.pressure = pr;
+      return p;
+    }
+    this.pos = { x: this.pos.x + (p.x - this.pos.x) * this.a, y: this.pos.y + (p.y - this.pos.y) * this.a };
+    this.pressure = this.pressure + (pr - this.pressure) * this.ap;
+    return { ...p, x: this.pos.x, y: this.pos.y, pressure: this.pressure };
+  }
+  /** Where the smoothed position is now (or `null` before the first sample). */
+  get position() {
+    return this.pos;
+  }
+};
+var IDENTITY_COPY = { map: (p) => p, linear: [1, 0, 0, 1] };
+var FULL_SPEED = 2.5;
+var PenDabWalker = class {
+  constructor(brush, seed = 0, linear = [1, 0, 0, 1]) {
+    this.brush = brush;
+    this.seed = seed;
+    this.linear = linear;
+  }
+  brush;
+  seed;
+  linear;
+  last = null;
+  nextAt = 0;
+  pendingFirst = null;
+  index = 0;
+  dir = 0;
+  lastT = null;
+  firstT = null;
+  speed = null;
+  travelled = 0;
+  sample(p) {
+    const o = penOrientation(p);
+    let speed = null;
+    let time = null;
+    if (this.last) this.travelled += Math.hypot(p.x - this.last.x, p.y - this.last.y);
+    if (typeof p.t === "number" && Number.isFinite(p.t)) {
+      if (this.firstT === null) this.firstT = p.t;
+      time = p.t - this.firstT;
+      if (this.last && this.lastT !== null && p.t > this.lastT) {
+        const v = Math.hypot(p.x - this.last.x, p.y - this.last.y) / (p.t - this.lastT);
+        this.speed = this.speed === null ? v : this.speed + (v - this.speed) * 0.35;
+      }
+      this.lastT = p.t;
+      speed = this.speed ?? 0;
+    }
+    return {
+      x: p.x,
+      y: p.y,
+      pressure: pressureOf(p),
+      lean: o ? 1 - o.altitude / (Math.PI / 2) : 0,
+      azimuth: o ? o.azimuth : 0,
+      twist: typeof p.twist === "number" && Number.isFinite(p.twist) ? p.twist : null,
+      speed,
+      travel: this.travelled,
+      time
+    };
+  }
+  diameter(s) {
+    const tip = this.brush.tip;
+    const dyn = this.brush.dynamics;
+    let d = tip.size;
+    if (tip.pressureSize) d *= dyn.minSize + (1 - dyn.minSize) * s.pressure;
+    d *= 1 + dyn.tiltSize * s.lean * 1.5;
+    if (s.speed !== null && dyn.velocitySize) d *= Math.max(0.05, 1 + dyn.velocitySize * Math.min(1, s.speed / FULL_SPEED) * (dyn.velocitySize < 0 ? 0.85 : 1));
+    return d;
+  }
+  stepLen(s) {
+    return Math.max(0.5, Math.max(1, this.diameter(s)) * Math.max(0.01, this.brush.tip.spacing));
+  }
+  /** A rasterizer angle (CCW, y up) mapped through this copy's linear part. */
+  mapAngle(theta) {
+    const [a, b, c, d] = this.linear;
+    if (a === 1 && b === 0 && c === 0 && d === 1) return theta;
+    const vx = Math.cos(theta);
+    const vy = -Math.sin(theta);
+    return Math.atan2(-(c * vx + d * vy), a * vx + b * vy);
+  }
+  dab(s) {
+    const { tip, dynamics: dyn, rotation } = this.brush;
+    const i = this.index++;
+    const seed = this.seed;
+    let diameter = this.diameter(s);
+    if (dyn.sizeJitter) diameter *= Math.max(0.05, 1 + dyn.sizeJitter * randSigned(seed, i, 1 /* Size */));
+    const base = tip.angle * Math.PI / 180;
+    let angle;
+    if (rotation === "stroke") angle = this.dir + base;
+    else if (rotation === "barrel" && s.twist !== null) angle = this.mapAngle(base - s.twist * Math.PI / 180);
+    else if (dyn.tiltRoundness > 0 && s.lean > 0.02) angle = this.mapAngle(base - s.azimuth);
+    else angle = this.mapAngle(base);
+    if (dyn.angleJitter) angle += dyn.angleJitter * Math.PI * randSigned(seed, i, 2 /* Angle */);
+    let opacity = tip.pressureOpacity ? s.pressure : 1;
+    opacity *= 1 - dyn.tiltOpacity * s.lean * 0.8;
+    if (s.speed !== null && dyn.velocityOpacity) opacity *= Math.max(0, 1 + dyn.velocityOpacity * (Math.min(1, s.speed / FULL_SPEED) - 0.5));
+    if (dyn.opacityJitter) opacity *= 1 - dyn.opacityJitter * (randSigned(seed, i, 3 /* Opacity */) * 0.5 + 0.5);
+    const flow = tip.flow * (1 - dyn.pressureFlow + dyn.pressureFlow * s.pressure);
+    let { x, y } = s;
+    if (dyn.scatter) {
+      const off = dyn.scatter * diameter * randSigned(seed, i, 4 /* Scatter */);
+      x += Math.sin(this.dir) * off;
+      y += Math.cos(this.dir) * off;
+    }
+    return {
+      x,
+      y,
+      radius: Math.max(0.5, diameter / 2),
+      alpha: Math.min(1, Math.max(0, flow)),
+      opacity: Math.min(1, Math.max(0, opacity)),
+      angle,
+      roundness: Math.min(1, Math.max(0.01, tip.roundness * (1 - dyn.tiltRoundness * s.lean * 0.8))),
+      pressure: s.pressure,
+      direction: this.dir,
+      index: i,
+      travel: s.travel,
+      time: s.time,
+      lean: s.lean,
+      speed: s.speed
+    };
+  }
+  push(p, out) {
+    const a = this.last;
+    const s = this.sample(p);
+    if (!a) {
+      this.last = s;
+      this.pendingFirst = s;
+      this.nextAt = this.stepLen(s);
+      return;
+    }
+    const dx = s.x - a.x;
+    const dy = s.y - a.y;
+    const len = Math.hypot(dx, dy);
+    if (len > 1e-9) this.dir = Math.atan2(-dy, dx);
+    if (this.pendingFirst) {
+      out.push(this.dab(this.pendingFirst));
+      this.pendingFirst = null;
+    }
+    if (len > 1e-9) {
+      while (this.nextAt <= len + 1e-9) {
+        const f = Math.min(1, this.nextAt / len);
+        const lerp = (u, v) => u + (v - u) * f;
+        const q = {
+          x: a.x + dx * f,
+          y: a.y + dy * f,
+          pressure: lerp(a.pressure, s.pressure),
+          lean: lerp(a.lean, s.lean),
+          azimuth: lerpAngle(a.azimuth, s.azimuth, f),
+          twist: a.twist !== null && s.twist !== null ? lerpDegrees(a.twist, s.twist, f) : s.twist,
+          speed: a.speed !== null && s.speed !== null ? lerp(a.speed, s.speed) : s.speed,
+          travel: a.travel + this.nextAt,
+          time: a.time !== null && s.time !== null ? lerp(a.time, s.time) : s.time
+        };
+        out.push(this.dab(q));
+        this.nextAt += this.stepLen(q);
+      }
+      this.nextAt -= len;
+    }
+    this.last = s;
+  }
+  finish(out) {
+    if (this.pendingFirst) {
+      out.push(this.dab(this.pendingFirst));
+      this.pendingFirst = null;
+    }
+  }
+};
+function lerpAngle(a, b, t) {
+  let d = b - a;
+  while (d > Math.PI) d -= 2 * Math.PI;
+  while (d < -Math.PI) d += 2 * Math.PI;
+  return a + d * t;
+}
+function lerpDegrees(a, b, t) {
+  let d = b - a;
+  while (d > 180) d -= 360;
+  while (d < -180) d += 360;
+  return a + d * t;
+}
+var DryStroke = class {
+  constructor(brush, options) {
+    this.brush = brush;
+    this.options = options;
+    this.smoother = new PenSmoother(brush.tip.smoothing, brush.pressureSmoothing);
+    this.copies = options.copies?.length ? options.copies : [IDENTITY_COPY];
+    this.walkers = this.copies.map((c, i) => new PenDabWalker(brush, (options.seed ?? 0) + i * 7919 | 0, c.linear));
+    this.depth = options.grain && !options.grain.flat ? Math.min(1, Math.max(0, options.paperDepth * brush.grain)) : 0;
+  }
+  brush;
+  options;
+  coverage = new CoverageMap();
+  dabCount = 0;
+  smoother;
+  walkers;
+  copies;
+  depth;
+  buf = new Float32Array(0);
+  field = new Float32Array(0);
+  lastRaw = null;
+  lastFed = null;
+  /** Feeds raw pen samples; returns the document rectangles the new dabs touched. */
+  push(points) {
+    const dabs = [];
+    for (const raw of points) {
+      this.lastRaw = raw;
+      const p = this.smoother.push(raw);
+      this.lastFed = p;
+      this.copies.forEach((c, i) => this.walkers[i].push(c.map(p), dabs));
+    }
+    return this.paint(dabs);
+  }
+  /** Ends the stroke: the smoothed path catches up with the last raw sample; a single tap paints one dab. */
+  finish() {
+    const dabs = [];
+    const raw = this.lastRaw;
+    const fed = this.lastFed;
+    if (raw && fed && (raw.x !== fed.x || raw.y !== fed.y)) this.copies.forEach((c, i) => this.walkers[i].push(c.map({ ...raw, pressure: fed.pressure }), dabs));
+    for (const w of this.walkers) w.finish(dabs);
+    return this.paint(dabs);
+  }
+  paint(dabs) {
+    const rects = [];
+    const hardness = this.brush.tip.hardness;
+    const grain = this.options.grain;
+    for (const d of dabs) {
+      const rect = dabRect(d, hardness);
+      const n = rect.width * rect.height;
+      if (this.buf.length < n) this.buf = new Float32Array(n);
+      const vals = this.buf.subarray(0, n);
+      rasterizeDab(d, hardness, rect, vals);
+      if (this.depth > 0 && grain) {
+        for (let yy = 0, k = 0; yy < rect.height; yy++) {
+          const y = rect.y + yy + 0.5;
+          for (let xx = 0; xx < rect.width; xx++, k++) {
+            if (vals[k] > 0) vals[k] *= grainCatch(grain.at(rect.x + xx + 0.5, y), this.depth, d.pressure);
+          }
+        }
+      }
+      let field = null;
+      if (this.options.effect) {
+        if (this.field.length < n * 3) this.field = new Float32Array(n * 3);
+        field = this.field.subarray(0, n * 3);
+        sampleEffectField(this.options.effect, rect, vals, field, d);
+      }
+      this.coverage.accumulate(rect, vals, d.opacity, null, field);
+      rects.push(rect);
+      this.dabCount++;
+    }
+    return rects;
+  }
+};
+function mixerTip(brush) {
+  return { ...brush.tip, smoothing: 0, pressureSize: brush.tip.pressureSize };
+}
+function toStrokePoint(p) {
+  return { x: p.x, y: p.y, pressure: pressureOf(p), ...typeof p.t === "number" ? { t: p.t } : {} };
+}
+
 // src/paint-editor/dab-stroke.ts
 var GRADIENT_STEPS = 32;
 function multiColorPalette(mc, color, secondary) {
@@ -1282,6 +1803,985 @@ function lightFromJSON(raw) {
   return surfaceFromPixels({ width: img.width, height: img.height, data }, 1, r.rect.x, r.rect.y);
 }
 
+// src/paint-editor/sticker-art.ts
+var STICKER_ART_SIZE = 256;
+var defaultStickerRasterizer = async (asset, size) => {
+  if (asset.kind === "image") {
+    const parsed = parseDataUrl(asset.url);
+    if (parsed && parsed.mime === "image/png") {
+      const png = decodePng(parsed.bytes);
+      return { width: png.width, height: png.height, data: new Uint8ClampedArray(png.data) };
+    }
+  }
+  const g = globalThis;
+  if (!g.createImageBitmap || !g.OffscreenCanvas) {
+    throw new StickerError("unsupported_format", `This environment can't draw ${asset.kind === "svg" ? "SVG" : "non-PNG"} sticker art; pass rasterizeSticker in the paint editor's options (or use a provider that offers png).`);
+  }
+  const blob = asset.kind === "svg" ? new Blob([asset.svg], { type: "image/svg+xml" }) : await (await g.fetch(asset.url)).blob();
+  const bitmap = await g.createImageBitmap(blob);
+  const scale = size / Math.max(bitmap.width, bitmap.height, 1);
+  const w = Math.max(1, Math.round(bitmap.width * scale));
+  const h = Math.max(1, Math.round(bitmap.height * scale));
+  const canvas = new g.OffscreenCanvas(w, h);
+  const ctx = canvas.getContext("2d");
+  ctx.drawImage(bitmap, 0, 0, w, h);
+  const img = ctx.getImageData(0, 0, w, h);
+  return { width: w, height: h, data: img.data };
+};
+var StickerArtCache = class {
+  entries = /* @__PURE__ */ new Map();
+  /** The art for `ref` when it has loaded (editor stamps never need any). */
+  get = (ref2) => {
+    const e = this.entries.get(ref2);
+    return e?.status === "ready" ? e.art : void 0;
+  };
+  /** `ready`, `loading`, `failed` (with the reason) or `none` (never asked for). Editor stamps are always `ready`. */
+  status(ref2) {
+    if (editorStampOf(ref2)) return { status: "ready" };
+    const e = this.entries.get(ref2);
+    if (!e) return { status: "none" };
+    return e.status === "failed" ? { status: "failed", error: e.error } : { status: e.status };
+  }
+  /**
+   * Loads and rasterises `ref` from `provider` once (later calls share the load). Unknown refs
+   * reject with the closest known ones; failures are kept so they are reported, and retried on
+   * the next call.
+   */
+  ensure(provider, ref2, rasterize) {
+    if (editorStampOf(ref2)) return Promise.resolve(null);
+    const e = this.entries.get(ref2);
+    if (e?.status === "ready") return Promise.resolve(e.art);
+    if (e?.status === "loading") return e.promise;
+    const promise = (async () => {
+      const d = await describeStickerRef(provider, ref2);
+      const id = stickerIdFor(provider, ref2);
+      const max = provider.capabilities.maxSize ?? STICKER_ART_SIZE;
+      const size = Math.min(STICKER_ART_SIZE, max);
+      const asset = await provider.load(id, d.formats.includes("png") ? { format: "png", size } : { format: d.formats[0] ?? "svg", size });
+      const px = await rasterize(asset, size);
+      if (!(px.width > 0 && px.height > 0) || px.data.length !== px.width * px.height * 4) throw new StickerError("load_failed", `The art for "${ref2}" came back empty or the wrong size.`);
+      return { ...px, tintable: d.tintable };
+    })();
+    this.entries.set(ref2, { status: "loading", promise });
+    return promise.then(
+      (art) => {
+        this.entries.set(ref2, { status: "ready", art });
+        return art;
+      },
+      (err) => {
+        const message = err instanceof Error ? err.message : String(err);
+        this.entries.set(ref2, { status: "failed", error: message });
+        throw err;
+      }
+    );
+  }
+  /** Forgets every load (a new provider). */
+  clear() {
+    this.entries.clear();
+  }
+};
+function sampleArt(art, x, y, out) {
+  const { width: w, height: h, data } = art;
+  const fx = x - 0.5;
+  const fy = y - 0.5;
+  const x0 = Math.floor(fx);
+  const y0 = Math.floor(fy);
+  const tx = fx - x0;
+  const ty = fy - y0;
+  let r = 0;
+  let g = 0;
+  let b = 0;
+  let a = 0;
+  for (let k = 0; k < 4; k++) {
+    const xx = x0 + (k & 1);
+    const yy = y0 + (k >> 1);
+    if (xx < 0 || yy < 0 || xx >= w || yy >= h) continue;
+    const wgt = (k & 1 ? tx : 1 - tx) * (k >> 1 ? ty : 1 - ty);
+    const i = (yy * w + xx) * 4;
+    const al = data[i + 3] * wgt;
+    r += data[i] * al;
+    g += data[i + 1] * al;
+    b += data[i + 2] * al;
+    a += al;
+  }
+  out[0] = a > 0 ? r / a / 255 : 0;
+  out[1] = a > 0 ? g / a / 255 : 0;
+  out[2] = a > 0 ? b / a / 255 : 0;
+  out[3] = a / 255;
+  return out;
+}
+
+// src/paint-editor/stickers.ts
+function hexRgb(hex) {
+  const n = parseInt(hex.slice(1, 7), 16);
+  return [(n >> 16 & 255) / 255, (n >> 8 & 255) / 255, (n & 255) / 255];
+}
+function stickerRect(s) {
+  const r = s.size / 2 + 1;
+  const x0 = Math.floor(s.x - r);
+  const y0 = Math.floor(s.y - r);
+  return { x: x0, y: y0, width: Math.ceil(s.x + r) - x0, height: Math.ceil(s.y + r) - y0 };
+}
+function stickerStamp(s) {
+  if (s.ref) {
+    try {
+      return editorStampOf(s.ref);
+    } catch {
+      return null;
+    }
+  }
+  return s.stamp && STAMP_KINDS.includes(s.stamp) ? s.stamp : null;
+}
+function drawSticker(medium, s, art) {
+  const kind = stickerStamp(s);
+  if (!kind) {
+    const a2 = art?.(s.ref);
+    return a2 ? drawArtSticker(medium, s, a2) : stickerRect(s);
+  }
+  const rect = stickerRect(s);
+  const n = rect.width * rect.height;
+  const cov = new Float32Array(n);
+  const field = new Float32Array(n * 3);
+  const rad2 = s.size / 2;
+  const a = s.rotation * Math.PI / 180;
+  const ca = Math.cos(a);
+  const sa = Math.sin(a);
+  const [r, g, b] = hexRgb(s.color);
+  for (let yy = 0, p = 0; yy < rect.height; yy++) {
+    for (let xx = 0, px = rect.x; xx < rect.width; xx++, p++, px++) {
+      const dx = px + 0.5 - s.x;
+      const dy = rect.y + yy + 0.5 - s.y;
+      const u = (dx * ca + dy * sa) / rad2;
+      const v = (-dx * sa + dy * ca) / rad2;
+      if (u < -1.05 || u > 1.05 || v < -1.05 || v > 1.05) continue;
+      let c = 0;
+      for (let k = 0; k < 4; k++) c += stampCoverage(kind, u + ((k & 1) - 0.5) / rad2 / 2, v + ((k >> 1) - 0.5) / rad2 / 2, s.seed);
+      c /= 4;
+      if (c <= 0) continue;
+      cov[p] = c;
+      const shade = 1 + 0.12 * (-(u + v) / 2) + 0.06 * (hash2(px, rect.y + yy, s.seed) - 0.5);
+      field[p * 3] = Math.min(1, Math.max(0, r * shade));
+      field[p * 3 + 1] = Math.min(1, Math.max(0, g * shade));
+      field[p * 3 + 2] = Math.min(1, Math.max(0, b * shade));
+    }
+  }
+  medium.deposit(rect, cov, s.opacity, [r, g, b], null, field);
+  return rect;
+}
+function drawArtSticker(medium, s, art) {
+  const rect = stickerRect(s);
+  const n = rect.width * rect.height;
+  const cov = new Float32Array(n);
+  const field = new Float32Array(n * 3);
+  const a = s.rotation * Math.PI / 180;
+  const ca = Math.cos(a);
+  const sa = Math.sin(a);
+  const scale = Math.max(art.width, art.height) / s.size;
+  const [r, g, b] = hexRgb(s.color);
+  const px = [0, 0, 0, 0];
+  for (let yy = 0, p = 0; yy < rect.height; yy++) {
+    for (let xx = 0; xx < rect.width; xx++, p++) {
+      const dx = rect.x + xx + 0.5 - s.x;
+      const dy = rect.y + yy + 0.5 - s.y;
+      const ax = (dx * ca + dy * sa) * scale + art.width / 2;
+      const ay = (-dx * sa + dy * ca) * scale + art.height / 2;
+      if (ax < -1 || ay < -1 || ax > art.width + 1 || ay > art.height + 1) continue;
+      sampleArt(art, ax, ay, px);
+      if (!(px[3] > 0)) continue;
+      cov[p] = px[3];
+      field[p * 3] = art.tintable ? r : px[0];
+      field[p * 3 + 1] = art.tintable ? g : px[1];
+      field[p * 3 + 2] = art.tintable ? b : px[2];
+    }
+  }
+  medium.deposit(rect, cov, s.opacity, [r, g, b], null, field);
+  return rect;
+}
+function jitterColor(hex, amount, seed, i) {
+  const [r, g, b] = hexRgb(hex);
+  const lch = oklabToOklch(rgbToOklab({ r, g, b, a: 1 }));
+  const l = Math.min(1, Math.max(0, lch.l + (rand01(seed, i, 61) - 0.5) * amount * 0.3));
+  const h = lch.h + (rand01(seed, i, 63) - 0.5) * amount * 80;
+  const at = (c) => oklabToRgb(oklchToOklab({ l, c, h, alpha: 1 }));
+  const inGamut = (o) => [o.r, o.g, o.b].every((v) => v >= -1e-4 && v <= 1 + 1e-4);
+  let out = at(lch.c);
+  if (!inGamut(out)) {
+    let lo = 0;
+    let hi = lch.c;
+    for (let k = 0; k < 12; k++) {
+      const mid = (lo + hi) / 2;
+      if (inGamut(at(mid))) lo = mid;
+      else hi = mid;
+    }
+    out = at(lo);
+  }
+  return "#" + [out.r, out.g, out.b].map((c) => Math.round(Math.min(1, Math.max(0, c)) * 255).toString(16).padStart(2, "0")).join("");
+}
+var StickerSpray = class {
+  constructor(init) {
+    this.init = init;
+    const b = init.brush;
+    this.smoother = new PenSmoother(b.tip.smoothing, b.pressureSmoothing);
+    this.copies = init.copies.length ? init.copies : [IDENTITY_COPY];
+    const spacing = Math.max(0.05, 1 / Math.max(0.05, b.sticker.density * 4));
+    const walk = { ...b, tip: { ...b.tip, spacing }, dynamics: { ...b.dynamics, scatter: 0, sizeJitter: 0, angleJitter: 0 } };
+    this.walkers = this.copies.map((c, i) => new PenDabWalker(walk, init.seed + i * 7919 | 0, c.linear));
+    this.medium = new TileMedium(init.target, {});
+    this.next = init.nextId;
+  }
+  init;
+  dabCount = 0;
+  stickers = [];
+  /** Refs the spray picked but could not draw because their art had not loaded. */
+  skipped = /* @__PURE__ */ new Set();
+  smoother;
+  walkers;
+  copies;
+  medium;
+  lastRaw = null;
+  lastFed = null;
+  next;
+  push(points) {
+    const rects = [];
+    for (const raw of points) {
+      this.lastRaw = raw;
+      const p = this.smoother.push(raw);
+      this.lastFed = p;
+      this.copies.forEach((c, i) => {
+        const dabs = [];
+        this.walkers[i].push(c.map(p), dabs);
+        for (const d of dabs) this.drop(d, rects);
+      });
+    }
+    return rects;
+  }
+  finish() {
+    const rects = [];
+    const raw = this.lastRaw;
+    const fed = this.lastFed;
+    this.copies.forEach((c, i) => {
+      const dabs = [];
+      if (raw && fed && (raw.x !== fed.x || raw.y !== fed.y)) this.walkers[i].push(c.map({ ...raw, pressure: fed.pressure }), dabs);
+      this.walkers[i].finish(dabs);
+      for (const d of dabs) this.drop(d, rects);
+    });
+    return rects;
+  }
+  drop(d, rects) {
+    const st = this.init.brush.sticker;
+    const i = this.next;
+    const seed = this.init.seed;
+    const size = d.radius * 2 * (1 - st.sizeJitter * 0.7 * rand01(seed, i, 51));
+    const off = st.scatter * d.radius * 2;
+    const a = rand01(seed, i, 53) * Math.PI * 2;
+    const dist = rand01(seed, i, 55) * off;
+    const base = this.colorAt(d, Math.cos(a) * dist, Math.sin(a) * dist);
+    if (!(base.alpha > 0)) {
+      this.next++;
+      return;
+    }
+    const ref2 = st.stamps[Math.floor(rand01(seed, i, 57) * st.stamps.length)] ?? "editor:dot";
+    const stamp = stickerStamp({ ref: ref2 });
+    if (!stamp && !this.init.art?.(ref2)) {
+      this.skipped.add(ref2);
+      this.next++;
+      return;
+    }
+    const sticker = {
+      id: `st${this.next++}`,
+      ref: ref2,
+      ...stamp ? { stamp } : {},
+      x: Math.round((d.x + Math.cos(a) * dist) * 100) / 100,
+      y: Math.round((d.y + Math.sin(a) * dist) * 100) / 100,
+      size: Math.max(2, Math.round(size * 10) / 10),
+      rotation: Math.round((-d.angle * 180 / Math.PI + (rand01(seed, i, 59) * 2 - 1) * 180 * st.rotationJitter) * 10) / 10,
+      color: st.colorJitter > 0 ? jitterColor(base.color, st.colorJitter, seed, i) : base.color,
+      opacity: Math.round(Math.min(1, d.opacity * this.init.brush.tip.opacity * base.alpha) * 1e3) / 1e3,
+      seed: Math.floor(rand01(seed, i, 65) * 1e9)
+    };
+    this.stickers.push(sticker);
+    rects.push(drawSticker(this.medium, sticker, this.init.art));
+    this.dabCount++;
+  }
+  sampler;
+  /** A sticker's colour: the paint colour, or gradient paint at its dab (`dx`, `dy` from the dab's centre). */
+  colorAt(d, dx, dy) {
+    const effect = this.init.effect;
+    if (effect) {
+      const rgb = [0, 0, 0];
+      const alpha = sampleEffectAt(effect, d.x + dx, d.y + dy, rgb, d);
+      return { color: "#" + rgb.map((c) => Math.round(c * 255).toString(16).padStart(2, "0")).join(""), alpha };
+    }
+    const g = this.init.paint;
+    if (!g) return { color: this.init.color, alpha: 1 };
+    this.sampler ??= new PaintGradientSampler(g, this.init.seed);
+    const s = g.map.by === "across-tip" ? this.sampler.sample(((dx * Math.sin(d.direction) + dy * Math.cos(d.direction)) / Math.max(0.5, d.radius) + 1) / 2) : this.sampler.dab(d);
+    return { color: "#" + s.rgb.map((c) => Math.round(Math.min(1, Math.max(0, c)) * 255).toString(16).padStart(2, "0")).join(""), alpha: s.alpha };
+  }
+};
+function renderStickers(stickers, target, art) {
+  const medium = new TileMedium(target, {});
+  for (const s of stickers) drawSticker(medium, s, art);
+}
+function normalizeStickerUpdate(u) {
+  const out = {};
+  if (u.ref !== void 0 && u.stamp !== void 0) throw new Error("Give ref or stamp, not both (stamp is the older name for an editor stamp).");
+  if (u.stamp !== void 0) {
+    if (!STAMP_KINDS.includes(u.stamp)) throw new Error(`stamp ${JSON.stringify(u.stamp)} is not a stamp; use ${STAMP_KINDS.join(", ")}, or ref for any sticker (find_stickers).`);
+    out.ref = `editor:${u.stamp}`;
+    out.stamp = u.stamp;
+  }
+  if (u.ref !== void 0) {
+    out.ref = normalizeStickerRef(u.ref);
+    const stamp = stickerStamp({ ref: out.ref });
+    if (stamp) out.stamp = stamp;
+    else out.stamp = void 0;
+  }
+  for (const k of ["x", "y"]) if (u[k] !== void 0) {
+    if (!Number.isFinite(u[k])) throw new Error(`${k} must be a number of pixels.`);
+    out[k] = u[k];
+  }
+  if (u.size !== void 0) {
+    if (!(u.size >= 2 && u.size <= 2048)) throw new Error(`size ${u.size} is out of range; use 2..2048 px.`);
+    out.size = u.size;
+  }
+  if (u.rotation !== void 0) {
+    if (!Number.isFinite(u.rotation)) throw new Error("rotation must be degrees.");
+    out.rotation = u.rotation;
+  }
+  if (u.color !== void 0) {
+    if (!/^#[0-9a-f]{6}$/i.test(u.color)) throw new Error(`color ${JSON.stringify(u.color)} must be #rrggbb.`);
+    out.color = u.color.toLowerCase();
+  }
+  if (u.opacity !== void 0) {
+    if (!(u.opacity >= 0 && u.opacity <= 1)) throw new Error(`opacity ${u.opacity} is out of range; use 0..1.`);
+    out.opacity = u.opacity;
+  }
+  return out;
+}
+function stickerSurface(stickers, base, dirty, art) {
+  const only = base && dirty ? new Set(dirty.flatMap((r) => tilesInRect(r).map(({ tx, ty }) => tileKey(tx, ty)))) : null;
+  const live = /* @__PURE__ */ new Map();
+  let scratch = null;
+  const target = {
+    offset: { x: 0, y: 0 },
+    lockTransparency: false,
+    selection: null,
+    readTile: (tx, ty) => live.get(tileKey(tx, ty)) ?? null,
+    writeTile: (tx, ty) => {
+      const k = tileKey(tx, ty);
+      if (only && !only.has(k)) return (scratch ??= new Uint8ClampedArray(TILE * TILE * 4)).fill(0);
+      let t = live.get(k);
+      if (!t) live.set(k, t = new Uint8ClampedArray(TILE * TILE * 4));
+      return t;
+    }
+  };
+  const reaches = (s) => !only || tilesInRect(stickerRect(s)).some(({ tx, ty }) => only.has(tileKey(tx, ty)));
+  renderStickers(stickers.filter(reaches), target, art);
+  const tiles = /* @__PURE__ */ new Map();
+  if (only && base) {
+    for (const [k, t] of base.tiles) if (!only.has(k)) tiles.set(k, t);
+  }
+  for (const [k, d] of live) {
+    const t = finishTile(d, 4, 0);
+    if (t) tiles.set(k, t);
+  }
+  return new TiledSurface(4, tiles, 0);
+}
+function stickerAt(stickers, x, y, art) {
+  for (let i = stickers.length - 1; i >= 0; i--) {
+    const s = stickers[i];
+    const rad2 = s.size / 2;
+    const a = s.rotation * Math.PI / 180;
+    const dx = x - s.x;
+    const dy = y - s.y;
+    const u = (dx * Math.cos(a) + dy * Math.sin(a)) / rad2;
+    const v = (-dx * Math.sin(a) + dy * Math.cos(a)) / rad2;
+    if (Math.abs(u) > 1.05 || Math.abs(v) > 1.05) continue;
+    if (s.size < 16) return s;
+    const kind = stickerStamp(s);
+    if (kind) {
+      if (stampCoverage(kind, u, v, s.seed) > 0.25) return s;
+      continue;
+    }
+    const pic = art?.(s.ref);
+    if (!pic) return s;
+    const scale = Math.max(pic.width, pic.height) / 2;
+    if (sampleArt(pic, u * scale + pic.width / 2, v * scale + pic.height / 2, [0, 0, 0, 0])[3] > 0.25) return s;
+  }
+  return null;
+}
+
+// src/paint-editor/procedural.ts
+var STEP_PX = 1.5;
+var MarkStroke = class {
+  constructor(brush, options) {
+    this.brush = brush;
+    this.options = options;
+    this.sampler = options.paint ? new PaintGradientSampler(options.paint, options.seed ?? 0) : null;
+    this.tipTable = this.sampler?.acrossTip ? this.sampler.tipTable(TIP_GRADIENT_STEPS) : null;
+    this.smoother = new PenSmoother(brush.tip.smoothing, brush.pressureSmoothing);
+    this.copies = options.copies?.length ? options.copies : [IDENTITY_COPY];
+    this.seed = options.seed ?? 0;
+    const fine = { ...brush, tip: { ...brush.tip, spacing: Math.max(0.01, Math.min(0.25, STEP_PX / Math.max(1, brush.tip.size))) } };
+    this.walkers = this.copies.map((c, i) => new PenDabWalker(fine, (options.seed ?? 0) + i * 7919 | 0, c.linear));
+    this.depth = options.grain && !options.grain.flat ? Math.min(1, Math.max(0, options.paperDepth * brush.grain)) : 0;
+  }
+  brush;
+  options;
+  coverage = new CoverageMap();
+  dabCount = 0;
+  smoother;
+  copies;
+  walkers;
+  depth;
+  buf = new Float32Array(0);
+  field = new Float32Array(0);
+  lastRaw = null;
+  lastFed = null;
+  seed;
+  sampler;
+  tipTable;
+  /** The pen dab the marks being made belong to, and its gradient colour. */
+  pen = null;
+  penColor = { rgb: [0, 0, 0], alpha: 1 };
+  push(points) {
+    const rects = [];
+    for (const raw of points) {
+      this.lastRaw = raw;
+      const p = this.smoother.push(raw);
+      this.lastFed = p;
+      this.copies.forEach((c, i) => {
+        const dabs = [];
+        this.walkers[i].push(c.map(p), dabs);
+        for (const d of dabs) this.step(i, d, rects);
+      });
+    }
+    return rects;
+  }
+  step(copy, d, rects) {
+    this.pen = d;
+    if (this.sampler && !this.tipTable) this.sampler.dab(d, this.penColor);
+    this.advance(copy, d, rects);
+  }
+  /** The colour of a mark at (x, y): its pen dab's, or across the tip by its offset from the pen. */
+  markColor(x, y) {
+    if (!this.sampler || !this.pen) return null;
+    if (!this.tipTable) return this.penColor;
+    const d = this.pen;
+    const u = ((x - d.x) * Math.sin(d.direction) + (y - d.y) * Math.cos(d.direction)) / Math.max(0.5, d.radius);
+    const last = this.tipTable.length - 1;
+    return this.tipTable[Math.min(last, Math.max(0, Math.round((u + 1) / 2 * last)))];
+  }
+  finish() {
+    const rects = [];
+    const raw = this.lastRaw;
+    const fed = this.lastFed;
+    this.copies.forEach((c, i) => {
+      const dabs = [];
+      if (raw && fed && (raw.x !== fed.x || raw.y !== fed.y)) this.walkers[i].push(c.map({ ...raw, pressure: fed.pressure }), dabs);
+      this.walkers[i].finish(dabs);
+      for (const d of dabs) this.step(i, d, rects);
+    });
+    return rects;
+  }
+  /** Stamps one round mark of radius `r` at (x, y) with flow `alpha` towards `opacity`. */
+  mark(x, y, r, alpha, opacity, pressure, rects) {
+    if (!(r > 0.05) || !(alpha > 0)) return;
+    const dab = { x, y, radius: Math.max(0.5, r), alpha: Math.min(1, alpha), opacity: Math.min(1, opacity), angle: 0, roundness: 1 };
+    const hardness = this.brush.tip.hardness;
+    const rect = dabRect(dab, hardness);
+    const n = rect.width * rect.height;
+    if (n <= 0) return;
+    const vals = this.scratch(n);
+    rasterizeDab(dab, hardness, rect, vals);
+    this.lay(rect, vals, dab.opacity, pressure, x, y, rects);
+  }
+  /**
+   * Stamps a textured mark: `kind` from the sticker stamps over a square of half-size `r`, turned
+   * `rotation` radians clockwise, with flow `alpha` towards `opacity`. Small marks are supersampled.
+   */
+  stamp(x, y, r, kind, rotation, seed, alpha, opacity, pressure, rects) {
+    if (!(r > 0.05) || !(alpha > 0)) return;
+    const reach = Math.max(0.5, r) * Math.SQRT2 + 1;
+    const rect = { x: Math.floor(x - reach), y: Math.floor(y - reach), width: 0, height: 0 };
+    rect.width = Math.ceil(x + reach) - rect.x;
+    rect.height = Math.ceil(y + reach) - rect.y;
+    const n = rect.width * rect.height;
+    const vals = this.scratch(n);
+    const ss = r < 10 ? 3 : 1;
+    const c = Math.cos(rotation);
+    const s = Math.sin(rotation);
+    const inv = 1 / Math.max(0.5, r);
+    const a = Math.min(1, alpha);
+    for (let yy = 0, k = 0; yy < rect.height; yy++) {
+      for (let xx = 0; xx < rect.width; xx++, k++) {
+        let sum = 0;
+        for (let sy = 0; sy < ss; sy++) {
+          for (let sx = 0; sx < ss; sx++) {
+            const dx = rect.x + xx + (sx + 0.5) / ss - x;
+            const dy = rect.y + yy + (sy + 0.5) / ss - y;
+            sum += stampCoverage(kind, (dx * c + dy * s) * inv, (dy * c - dx * s) * inv, seed);
+          }
+        }
+        vals[k] = sum / (ss * ss) * a;
+      }
+    }
+    this.lay(rect, vals, Math.min(1, opacity), pressure, x, y, rects);
+  }
+  /** A scratch buffer of `n` values (reused; valid until the next mark). */
+  scratch(n) {
+    if (this.buf.length < n) this.buf = new Float32Array(n);
+    const vals = this.buf.subarray(0, n);
+    vals.fill(0);
+    return vals;
+  }
+  /**
+   * Lays coverage `vals` over `rect` towards `opacity`: paper grain, then effect paint or the
+   * colour of a mark at (x, y) (gradient paint), into the stroke's coverage.
+   */
+  lay(rect, vals, opacity, pressure, x, y, rects) {
+    const n = rect.width * rect.height;
+    if (n <= 0) return;
+    const grain = this.options.grain;
+    if (this.depth > 0 && grain) {
+      for (let yy = 0, k = 0; yy < rect.height; yy++)
+        for (let xx = 0; xx < rect.width; xx++, k++) if (vals[k] > 0) vals[k] *= grainCatch(grain.at(rect.x + xx + 0.5, rect.y + yy + 0.5), this.depth, pressure);
+    }
+    if (this.options.effect) {
+      if (this.field.length < n * 3) this.field = new Float32Array(n * 3);
+      const field = this.field.subarray(0, n * 3);
+      sampleEffectField(this.options.effect, rect, vals, field, this.pen);
+      this.coverage.accumulate(rect, vals, opacity, null, field);
+    } else {
+      const color = this.markColor(x, y);
+      if (color && color.alpha < 1) for (let k = 0; k < n; k++) vals[k] *= color.alpha;
+      this.coverage.accumulate(rect, vals, opacity, color ? color.rgb : null);
+    }
+    rects.push(rect);
+    this.dabCount++;
+  }
+  /** Marks along a segment, spaced by a fraction of the radius. */
+  segment(x0, y0, x1, y1, r, alpha, opacity, pressure, rects) {
+    const len = Math.hypot(x1 - x0, y1 - y0);
+    const step = Math.max(0.35, r * 0.5);
+    const n = Math.max(1, Math.ceil(len / step));
+    for (let i = 1; i <= n; i++) this.mark(x0 + (x1 - x0) * i / n, y0 + (y1 - y0) * i / n, r, alpha, opacity, pressure, rects);
+  }
+};
+var FUZZY_AMPLITUDE = 0.12;
+var NOMINAL_MS_PER_PX = 2;
+var RIBBON_SUB = 4;
+function chainDamp(damp, k) {
+  return Math.min(damp, 1 / (1 + 0.8 * Math.sqrt(Math.max(0, k))) ** 2);
+}
+function addPolygonArea(pts, rect, out, weight = 1) {
+  const n = pts.length >> 1;
+  if (n < 3) return;
+  let y0 = Infinity;
+  let y1 = -Infinity;
+  for (let i = 1; i < pts.length; i += 2) {
+    if (pts[i] < y0) y0 = pts[i];
+    if (pts[i] > y1) y1 = pts[i];
+  }
+  const r0 = Math.max(0, Math.floor(y0) - rect.y);
+  const r1 = Math.min(rect.height - 1, Math.floor(y1) - rect.y);
+  const xs = [];
+  const w = weight / RIBBON_SUB;
+  for (let row = r0; row <= r1; row++) {
+    const base = row * rect.width;
+    for (let sub = 0; sub < RIBBON_SUB; sub++) {
+      const y = rect.y + row + (sub + 0.5) / RIBBON_SUB;
+      xs.length = 0;
+      for (let i = 0, j = n - 1; i < n; j = i++) {
+        const yi = pts[i * 2 + 1];
+        const yj = pts[j * 2 + 1];
+        if (yi <= y !== yj <= y) xs.push(pts[i * 2] + (y - yi) / (yj - yi) * (pts[j * 2] - pts[i * 2]));
+      }
+      if (xs.length < 2) continue;
+      xs.sort((a, b) => a - b);
+      for (let k = 0; k + 1 < xs.length; k += 2) {
+        const a = Math.max(rect.x, xs[k]);
+        const b = Math.min(rect.x + rect.width, xs[k + 1]);
+        if (!(b > a)) continue;
+        for (let px = Math.floor(a); px < b; px++) {
+          const cover = Math.min(b, px + 1) - Math.max(a, px);
+          if (cover > 0) out[base + px - rect.x] += cover * w;
+        }
+      }
+    }
+  }
+}
+function curl(x, y, seed) {
+  const n = (u, v) => {
+    const x0 = Math.floor(u);
+    const y0 = Math.floor(v);
+    const fx = u - x0;
+    const fy = v - y0;
+    const sx = fx * fx * (3 - 2 * fx);
+    const sy = fy * fy * (3 - 2 * fy);
+    const h = (a2, b2) => rand01(seed, a2 * 73856093 + b2 * 19349663, 41);
+    const a = h(x0, y0);
+    const b = h(x0 + 1, y0);
+    const c = h(x0, y0 + 1);
+    const d = h(x0 + 1, y0 + 1);
+    return a + (b - a) * sx + (c - a) * sy + (a - b - c + d) * sx * sy;
+  };
+  const e = 0.01;
+  return [(n(x, y + e) - n(x, y - e)) / (2 * e), -(n(x + e, y) - n(x - e, y)) / (2 * e)];
+}
+var ParticleStroke = class extends MarkStroke {
+  sets;
+  /** Ribbon pairs per copy: particles in their order around the pen (non-flow kinds). */
+  orders;
+  s;
+  spawn = 0;
+  /** Textured dots drawn so far, per copy (sequence order, random picks). */
+  dots;
+  /** Ribbon fill: the area each pixel has had so far this stroke (telescoped into the coverage). */
+  filled = /* @__PURE__ */ new Map();
+  pts = [];
+  constructor(brush, options) {
+    super(brush, options);
+    this.s = brush.particle;
+    this.sets = this.copies.map(() => []);
+    this.orders = this.copies.map(() => []);
+    this.dots = this.copies.map(() => 0);
+  }
+  /** Strand kinds: a chain of masses behind each particle. */
+  get strands() {
+    return this.s.kind === "string" || this.s.kind === "elastic" || this.s.kind === "fuzzy";
+  }
+  newParticle(x, y, ox, oy, k, phase, i, copy) {
+    const s = this.s;
+    const fuzzy = s.kind === "fuzzy";
+    const jitter = fuzzy ? 1 : s.wavePhaseJitter;
+    return {
+      x,
+      y,
+      vx: 0,
+      vy: 0,
+      ox,
+      oy,
+      k,
+      phase,
+      age: 0,
+      run: 0,
+      bead: 0,
+      alive: true,
+      wavePhase: jitter > 0 ? jitter * Math.PI * 2 * rand01(this.seed, i, 43 + copy) : 0,
+      waveScale: fuzzy ? 0.6 + 0.8 * rand01(this.seed, i, 47 + copy) : 1,
+      dx: x,
+      dy: y,
+      px: NaN,
+      py: NaN,
+      fade: 1
+    };
+  }
+  init(copy, d) {
+    const s = this.s;
+    const list = this.sets[copy];
+    const size = Math.max(1, d.radius * 2);
+    for (let i = 0; i < (s.kind === "flow" ? 0 : s.count); i++) {
+      const r = rand01(this.seed, i, 3 + copy) * s.spread * size * 0.5;
+      const a = rand01(this.seed, i, 5 + copy) * Math.PI * 2;
+      const ox = Math.cos(a) * r;
+      const oy = Math.sin(a) * r;
+      const p = this.newParticle(d.x + ox, d.y + oy, ox, oy, 0.6 + 0.8 * rand01(this.seed, i, 7), a, i, copy);
+      if (this.strands) p.strand = Array.from({ length: 6 }, () => ({ x: d.x + ox, y: d.y + oy, vx: 0, vy: 0 }));
+      if (s.kind === "orbit") {
+        p.ox = Math.max(1, r + size * 0.15);
+        p.oy = 0;
+      }
+      list.push(p);
+    }
+    this.orders[copy] = list.map((_, i) => i).sort((i, j) => list[i].phase - list[j].phase || i - j);
+  }
+  /** The sideways wave of particle `p` at pen dab `d` (px along the normal to the pen's direction). */
+  wave(p, d, size) {
+    const s = this.s;
+    const amp = s.kind === "fuzzy" ? Math.max(FUZZY_AMPLITUDE, s.waveAmplitude) : s.waveAmplitude;
+    if (!(amp > 0)) return 0;
+    const ms = d.time ?? d.travel * NOMINAL_MS_PER_PX;
+    const phase = 2 * Math.PI * d.travel / (s.waveLength * p.waveScale) - s.waveSpeed * 0.025 * ms + p.wavePhase;
+    return amp * size * Math.sin(phase);
+  }
+  advance(copy, d, rects) {
+    const s = this.s;
+    let list = this.sets[copy];
+    if (d.index === 0 && !list.length) this.init(copy, d);
+    const size = Math.max(1, d.radius * 2);
+    const markR = Math.max(0.5, size * s.size / 2);
+    const k = 0.02 + 0.3 * s.stiffness;
+    const damp = 0.6 + 0.38 * (1 - s.damping);
+    const g = s.gravity * 0.15;
+    const op = d.opacity;
+    const al = Math.max(0.05, d.alpha);
+    const nx = Math.sin(d.direction);
+    const ny = Math.cos(d.direction);
+    if (s.kind === "flow") {
+      this.spawn += s.count / 8;
+      while (this.spawn >= 1) {
+        this.spawn -= 1;
+        const i = this.dabCount + list.length * 31 + Math.floor(d.index);
+        const a = rand01(this.seed, i, 11 + copy) * Math.PI * 2;
+        const r = rand01(this.seed, i, 13 + copy) * s.spread * size * 0.5;
+        list.push(this.newParticle(d.x + Math.cos(a) * r, d.y + Math.sin(a) * r, 0, 0, 1, a, i, copy));
+      }
+    }
+    const lifeSteps = 8 + 120 * s.life;
+    for (let i = 0; i < list.length; i++) {
+      const p = list[i];
+      if (!p.alive) continue;
+      switch (s.kind) {
+        case "spring": {
+          p.vx = (p.vx + (d.x + p.ox - p.x) * k * p.k) * damp;
+          p.vy = (p.vy + (d.y + p.oy - p.y) * k * p.k + g) * damp;
+          p.x += p.vx;
+          p.y += p.vy;
+          break;
+        }
+        case "string":
+        case "fuzzy": {
+          const strand = p.strand;
+          const dm = s.kind === "fuzzy" ? chainDamp(damp, k * p.k) : damp;
+          let ax = d.x + p.ox;
+          let ay = d.y + p.oy;
+          for (const m of strand) {
+            m.vx = (m.vx + (ax - m.x) * k * p.k + 0) * dm;
+            m.vy = (m.vy + (ay - m.y) * k * p.k + g) * dm;
+            m.x += m.vx;
+            m.y += m.vy;
+            ax = m.x;
+            ay = m.y;
+          }
+          p.x = strand[strand.length - 1].x;
+          p.y = strand[strand.length - 1].y;
+          break;
+        }
+        case "elastic": {
+          const strand = p.strand;
+          const rest = size * 0.12;
+          const ke = Math.min(0.9, (0.1 + 0.6 * s.stiffness) * p.k);
+          const dm = chainDamp(damp, ke);
+          let ax = d.x + p.ox;
+          let ay = d.y + p.oy;
+          for (const m of strand) {
+            const ex = ax - m.x;
+            const ey = ay - m.y;
+            const len = Math.hypot(ex, ey);
+            const pull = len > rest ? (len - rest) / len : 0;
+            m.vx = (m.vx + ex * pull * ke) * dm;
+            m.vy = (m.vy + ey * pull * ke + g) * dm;
+            m.x += m.vx;
+            m.y += m.vy;
+            ax = m.x;
+            ay = m.y;
+          }
+          p.x = strand[strand.length - 1].x;
+          p.y = strand[strand.length - 1].y;
+          break;
+        }
+        case "orbit": {
+          p.phase += (0.05 + 0.3 * s.speed) * (i % 2 ? -1 : 1) * (0.7 + 0.6 * rand01(this.seed, i, 17));
+          p.x = d.x + Math.cos(p.phase) * p.ox;
+          p.y = d.y + Math.sin(p.phase) * p.ox + g * p.ox;
+          break;
+        }
+        case "flow": {
+          const [fx, fy] = curl(p.x / Math.max(8, size * 1.5), p.y / Math.max(8, size * 1.5), this.seed);
+          const push = size * 0.012 * (0.3 + 1.5 * s.speed);
+          const fl = Math.hypot(fx, fy) || 1;
+          p.vx = p.vx * 0.8 + fx / fl * push;
+          p.vy = p.vy * 0.8 + fy / fl * push + g * 0.2;
+          p.x += p.vx;
+          p.y += p.vy;
+          p.age++;
+          if (p.age > lifeSteps) p.alive = false;
+          break;
+        }
+      }
+      const w = this.wave(p, d, size);
+      const qx = w ? p.x + nx * w : p.x;
+      const qy = w ? p.y + ny * w : p.y;
+      const px = p.dx;
+      const py = p.dy;
+      p.px = p.dx;
+      p.py = p.dy;
+      p.dx = qx;
+      p.dy = qy;
+      const fade = s.kind === "flow" ? 1 - p.age / lifeSteps : 1;
+      p.fade = fade;
+      const moved = Math.hypot(qx - px, qy - py);
+      if (d.index === 0 && s.kind !== "flow") continue;
+      if (s.render === "dot") this.dot(copy, qx, qy, qx - px, qy - py, markR * fade, al * fade, op, d, rects);
+      else if (s.render === "line" || s.render === "ribbon") this.segment(px, py, qx, qy, markR * fade, al * fade, op, d.pressure, rects);
+      else {
+        p.run += moved;
+        const gap = Math.max(markR * 2, size * (0.05 + s.interval));
+        while (p.run >= gap) {
+          p.run -= gap;
+          p.bead++;
+          const t = moved > 0 ? 1 - p.run / Math.max(moved, 1e-6) : 1;
+          const bx = px + (qx - px) * Math.min(1, Math.max(0, t));
+          const by = py + (qy - py) * Math.min(1, Math.max(0, t));
+          this.dot(copy, bx, by, qx - px, qy - py, markR * (0.7 + 0.6 * (p.bead % 3 / 2)) * fade, al * fade, op, d, rects);
+        }
+      }
+    }
+    if (s.render === "ribbon" && !(d.index === 0 && s.kind !== "flow")) this.ribbon(copy, list, op, al, d, rects);
+    if (s.kind === "flow" && list.length > 512) {
+      list = list.filter((p) => p.alive);
+      this.sets[copy] = list;
+    }
+  }
+  /** A dot (or bead): round, or a textured stamp turned by the particle's motion (mx, my), at random or to the tip angle. */
+  dot(copy, x, y, mx, my, r, alpha, opacity, d, rects) {
+    const s = this.s;
+    const textures = s.dotTextures;
+    if (!textures.length) return this.mark(x, y, r, alpha, opacity, d.pressure, rects);
+    const n = this.dots[copy]++;
+    const pick = s.dotTextureOrder === "random" ? Math.min(textures.length - 1, Math.floor(rand01(this.seed, n, 31 + copy) * textures.length)) : n % textures.length;
+    const rotation = s.dotRotation === "random" ? rand01(this.seed, n, 37 + copy) * Math.PI * 2 : s.dotRotation === "follow" ? mx || my ? Math.atan2(my, mx) : -d.direction : -this.brush.tip.angle * Math.PI / 180;
+    this.stamp(x, y, r, textures[pick], rotation, this.seed + n * 2654435761 >>> 0, alpha, opacity, d.pressure, rects);
+  }
+  /**
+   * Ribbon fill for one step: the band between each pair of joined particles, from where they
+   * were drawn last step to where they are drawn now. Bands of one step, and of consecutive steps,
+   * share edges exactly, so the fill has no seams; it is telescoped into the coverage
+   * (`telescope`), so it does not build up at the joins.
+   */
+  ribbon(copy, list, opacity, alpha, d, rects) {
+    const s = this.s;
+    if (!(s.ribbonFill > 0)) return;
+    const live = (p) => !!p && p.alive && !Number.isNaN(p.px);
+    let order;
+    if (s.kind === "flow") order = list.filter(live);
+    else order = this.orders[copy].map((i) => list[i]).filter(live);
+    if (order.length < 2) return;
+    const pairs = [];
+    if (s.ribbonPairs === "first-last") pairs.push([order[0], order[order.length - 1]]);
+    else for (let i = 0; i + 1 < order.length; i++) pairs.push([order[i], order[i + 1]]);
+    const pts = this.pts;
+    const ceil = Math.min(1, opacity * s.ribbonFill);
+    for (const [a, b] of pairs) {
+      pts.length = 0;
+      pts.push(a.px, a.py, a.dx, a.dy, b.dx, b.dy, b.px, b.py);
+      let x0 = Infinity;
+      let y0 = Infinity;
+      let x1 = -Infinity;
+      let y1 = -Infinity;
+      for (let i = 0; i < 8; i += 2) {
+        x0 = Math.min(x0, pts[i]);
+        x1 = Math.max(x1, pts[i]);
+        y0 = Math.min(y0, pts[i + 1]);
+        y1 = Math.max(y1, pts[i + 1]);
+      }
+      const rect = { x: Math.floor(x0), y: Math.floor(y0), width: Math.floor(x1) - Math.floor(x0) + 1, height: Math.floor(y1) - Math.floor(y0) + 1 };
+      const area = this.scratch(rect.width * rect.height);
+      addPolygonArea(pts, rect, area, Math.min(a.fade, b.fade) * alpha);
+      if (this.telescope(rect, area)) this.lay(rect, area, ceil, d.pressure, (a.dx + b.dx) / 2, (a.dy + b.dy) / 2, rects);
+    }
+  }
+  /**
+   * Turns the area newly filled over `rect` into coverage to lay towards the fill's ceiling: the
+   * share of what was left unfilled, so after any number of bands (in any grouping) a pixel's
+   * coverage is the ceiling times the area filled there. False when nothing was added.
+   */
+  telescope(rect, area) {
+    let any = false;
+    for (let yy = 0, k = 0; yy < rect.height; yy++) {
+      const gy = rect.y + yy;
+      const ty = Math.floor(gy / TILE);
+      let t;
+      let tx = NaN;
+      for (let xx = 0; xx < rect.width; xx++, k++) {
+        const add = area[k];
+        if (!(add > 0)) continue;
+        const gx = rect.x + xx;
+        const ntx = Math.floor(gx / TILE);
+        if (ntx !== tx || !t) {
+          tx = ntx;
+          const key = tileKey(tx, ty);
+          t = this.filled.get(key);
+          if (!t) {
+            t = new Float32Array(TILE * TILE);
+            this.filled.set(key, t);
+          }
+        }
+        const ti = (gy - ty * TILE) * TILE + (gx - tx * TILE);
+        const before = t[ti];
+        const after = Math.min(1, before + add);
+        t[ti] = after;
+        area[k] = before < 1 ? (after - before) / (1 - before) : 0;
+        any = true;
+      }
+    }
+    return any;
+  }
+};
+var BristleStroke = class extends MarkStroke {
+  tufts;
+  s;
+  constructor(brush, options) {
+    super(brush, options);
+    this.s = brush.bristle;
+    const s = this.s;
+    this.tufts = this.copies.map(
+      (_, c) => Array.from({ length: s.count }, (_2, i) => {
+        const a = rand01(this.seed, i, 21 + c) * Math.PI * 2;
+        const r = Math.sqrt(rand01(this.seed, i, 23 + c));
+        return {
+          u: Math.cos(a) * r,
+          v: Math.sin(a) * r,
+          x: 0,
+          y: 0,
+          paint: 1 - s.jitter * 0.4 * rand01(this.seed, i, 25 + c),
+          thirst: 1 + s.jitter * (rand01(this.seed, i, 27 + c) * 2 - 1),
+          w: 1 + s.jitter * 0.6 * (rand01(this.seed, i, 29 + c) - 0.5),
+          started: false
+        };
+      })
+    );
+  }
+  advance(copy, d, rects) {
+    const s = this.s;
+    const tuft = this.tufts[copy];
+    const spread = d.radius * (0.55 + 0.9 * s.splay * d.pressure);
+    const ca = Math.cos(d.angle);
+    const sa = Math.sin(d.angle);
+    const ro = Math.max(0.15, d.roundness);
+    const tx = Math.cos(d.direction);
+    const ty = -Math.sin(d.direction);
+    const follow = 0.15 + 0.85 * s.stiffness;
+    const bend = d.radius * (1 - s.stiffness) * d.pressure * 0.8;
+    const lineR = Math.max(0.5, d.radius * 2 * s.thickness * 0.5);
+    const dryRate = 4e-3 * (1 - s.load);
+    for (const b of tuft) {
+      const lu = b.u * spread;
+      const lv = b.v * spread * ro;
+      const ox = lu * ca - lv * sa;
+      const oy = -(lu * sa + lv * ca);
+      const lag = bend * (1 - 0.5 * b.v);
+      const wx = d.x + ox - tx * lag;
+      const wy = d.y + oy - ty * lag;
+      if (!b.started) {
+        b.x = wx;
+        b.y = wy;
+        b.started = true;
+        continue;
+      }
+      const nx = b.x + (wx - b.x) * follow;
+      const ny = b.y + (wy - b.y) * follow;
+      const paint = Math.max(0, b.paint);
+      if (paint > 0.02) this.segment(b.x, b.y, nx, ny, lineR * b.w * (0.6 + 0.4 * d.pressure), d.alpha * Math.min(1, paint * 1.4), d.opacity, d.pressure, rects);
+      b.paint -= dryRate * b.thirst * Math.hypot(nx - b.x, ny - b.y);
+      b.x = nx;
+      b.y = ny;
+    }
+  }
+};
+
 // src/paint-editor/stroke.ts
 function defaultTile(surface) {
   const data = new Uint8ClampedArray(TILE * TILE * surface.channels);
@@ -3231,9 +4731,9 @@ function perspectiveGuideLines(g, size, count = 12) {
 }
 
 // src/paint-editor/color.ts
-var HEX = /^#?([0-9a-f]{6})$/i;
+var HEX2 = /^#?([0-9a-f]{6})$/i;
 function parseHexColor(value, what = "color") {
-  const m = typeof value === "string" ? HEX.exec(value.trim()) : null;
+  const m = typeof value === "string" ? HEX2.exec(value.trim()) : null;
   if (!m) throw new Error(`${what} is ${JSON.stringify(value)}; use #rrggbb, e.g. "#2a4b8d".`);
   const n = parseInt(m[1], 16);
   return [n >> 16 & 255, n >> 8 & 255, n & 255];
@@ -4083,10 +5583,10 @@ var PaintEditorError = class extends Error {
     this.name = "PaintEditorError";
   }
 };
-var HEX2 = /^#[0-9a-f]{6}$/i;
+var HEX3 = /^#[0-9a-f]{6}$/i;
 var MAX_ADD_STICKERS = 500;
 function parseColor(value, what = "color") {
-  if (typeof value !== "string" || !HEX2.test(value.trim())) throw new PaintEditorError(`${what} is ${JSON.stringify(value)}; use #rrggbb, e.g. "#2a4b8d".`);
+  if (typeof value !== "string" || !HEX3.test(value.trim())) throw new PaintEditorError(`${what} is ${JSON.stringify(value)}; use #rrggbb, e.g. "#2a4b8d".`);
   return value.trim().toLowerCase();
 }
 function rgbaOf(hex) {
@@ -9478,7 +10978,7 @@ function createPaintEditorToolProvider(controller, options = {}) {
     annotations: { title: "Get the paper", ...READ6 },
     handler: () => JSON.parse(JSON.stringify(c.document.paper))
   });
-  const tuning = {
+  const tuning2 = {
     type: "object",
     properties: {
       contrast: { type: "number", minimum: 0, maximum: 3, description: "Height contrast around the middle (default 1)." },
@@ -9501,8 +11001,8 @@ function createPaintEditorToolProvider(controller, options = {}) {
         pattern: { type: "string", enum: [...GRAIN_PATTERNS], description: "Grain pattern." },
         tiling: { type: "string", enum: ["repeat", "mirror"], description: "How the grain tile repeats (mirror hides seams)." },
         shading: { type: "number", minimum: 0, maximum: 1, description: "How much the grain shades the paper colour." },
-        dry: { ...tuning, description: "Height map tuning for dry media." },
-        wet: { ...tuning, description: "Height map tuning for wet media (the grain water and pigment follow)." },
+        dry: { ...tuning2, description: "Height map tuning for dry media." },
+        wet: { ...tuning2, description: "Height map tuning for wet media (the grain water and pigment follow)." },
         absorption: { type: "number", minimum: 0, maximum: 1, description: "Wet media: how fast the paper soaks up water (high: washes stop spreading sooner)." },
         permeability: { type: "number", minimum: 0, maximum: 1, description: "Wet media: how freely water flows over the fibres (low: more ragged, slower spreading)." },
         roughness: { type: "number", minimum: 0, maximum: 1, description: "Wet media: how much the grain pins wet edges and catches granulating pigment." },