@energy8platform/golem 0.5.0 → 0.7.0

package/README.md

@@ -17,6 +17,10 @@
 поверх параметрической мимики и сохраняются при смене анимации.
 [Результаты объединения и проверок](docs/verification-2026-09-28.md).
 
+В 0.6 по официальным примерам Spine и Rive обновлены скиллы нарезки и анимации, исправлены
+импорт skins, linked meshes, кривые, преобразования и активные clipping-маски.
+[Источники, результаты и ограничения проверки](docs/verification-2026-10-05.md).
+
 ```
 src/rig-format.ts       схема документа (zod) + семантическая валидация; v1: deform-треки, asset.frame (атлас)
 src/rig-anim.ts         чистая математика: easing, семплирование, Pose, аффинные матрицы костей, контуры слотов
@@ -196,6 +200,20 @@ for p in symbol_idle symbol_win dim; do npm run rig -- rig_apply_preset '{"path"
 npm run rig -- rig_render_preview '{"path":"'$S'","animation":"win","fps":10,"onionSkin":true,"scale":0.5,"saveTo":"examples/symbol/out/win.png"}'
 ```
 
+## Модуль e8-engine
+
+golem — e8-row `golem1` (`@energy8platform/golem`). Что даёт: тулы `rig_*` в MCP e8, node `golem` в сцене, вкладка
+редактора для `rig.json` в IDE, undo через историю golem. Риги лежат в `assets/rigs/<name>/`.
+
+Node `golem` в игре, тулы `rig_*` и skills приходят со строкой `golem1` бандла `e8-base` (проект без него добавляет ту же
+строку в `e8.patch.yml`). Строка в `e8.yml` добавляет вкладку редактора `rig.json` в IDE и мост undo:
+
+```yaml
+- id: golem1
+  name: '@energy8platform/golem'
+  config: {}
+```
+
 ## Шаг 3 — слои (риск №1 закрыт)
 
 Спайк сегментации на `cashier.png` (артефакты удалены при чистке репозитория): вырезание из плоской картинки + bleed 6 px даёт чистый

package/dist/editor.css

@@ -13,6 +13,8 @@
   --ctl-line:#3C3C3C;
   --err:#F14C4C;
   --warn:#CCA700;
+  --font:-apple-system,"Segoe UI",sans-serif;
+  --size:13px;
   --r-xs:2px;
   --r-s:4px;
   --r-m:6px;
@@ -26,10 +28,7 @@ body {
   height: 100%;
   background: var(--chrome);
   color: var(--fg);
-  font:
-    13px -apple-system,
-    "Segoe UI",
-    sans-serif;
+  font: var(--size) var(--font);
   user-select: none;
 }
 #app {

package/dist/editor.js

@@ -43308,7 +43308,7 @@ var require_gifenc = __commonJS({
         bins[nb.fw].bk = nb.bk;
         nb.mtm = bincountMinusOne;
       }
-      let palette = [];
+      let palette2 = [];
       var k4 = 0;
       for (i6 = 0; ; ++k4) {
         let r5 = clamp3(Math.round(bins[i6].rc), 0, 255);
@@ -43327,17 +43327,17 @@ var require_gifenc = __commonJS({
           }
         }
         const color = hasAlpha ? [r5, g4, b4, a5] : [r5, g4, b4];
-        const exists = existsInPalette(palette, color);
+        const exists = existsInPalette(palette2, color);
         if (!exists)
-          palette.push(color);
+          palette2.push(color);
         if ((i6 = bins[i6].fw) == 0)
           break;
       }
-      return palette;
+      return palette2;
     }
-    function existsInPalette(palette, color) {
-      for (let i6 = 0; i6 < palette.length; i6++) {
-        const p6 = palette[i6];
+    function existsInPalette(palette2, color) {
+      for (let i6 = 0; i6 < palette2.length; i6++) {
+        const p6 = palette2[i6];
         let matchesRGB = p6[0] === color[0] && p6[1] === color[1] && p6[2] === color[2];
         let matchesAlpha = p6.length >= 4 && color.length >= 4 ? p6[3] === color[3] : true;
         if (matchesRGB && matchesAlpha)
@@ -43376,14 +43376,14 @@ var require_gifenc = __commonJS({
         data[i6] = a5 << 24 | b4 << 16 | g4 << 8 | r5 << 0;
       }
     }
-    function applyPalette2(rgba, palette, format = "rgb565") {
+    function applyPalette2(rgba, palette2, format = "rgb565") {
       if (!rgba || !rgba.buffer) {
         throw new Error("quantize() expected RGBA Uint8Array data");
       }
       if (!(rgba instanceof Uint8Array) && !(rgba instanceof Uint8ClampedArray)) {
         throw new Error("quantize() expected RGBA Uint8Array data");
       }
-      if (palette.length > 256) {
+      if (palette2.length > 256) {
         throw new Error("applyPalette() only works with 256 colors or less");
       }
       const data = new Uint32Array(rgba.buffer);
@@ -43400,7 +43400,7 @@ var require_gifenc = __commonJS({
           const g4 = color >> 8 & 255;
           const r5 = color & 255;
           const key = rgba8888_to_rgba4444(r5, g4, b4, a5);
-          const idx = key in cache ? cache[key] : cache[key] = nearestColorIndexRGBA(r5, g4, b4, a5, palette);
+          const idx = key in cache ? cache[key] : cache[key] = nearestColorIndexRGBA(r5, g4, b4, a5, palette2);
           index[i6] = idx;
         }
       } else {
@@ -43411,17 +43411,17 @@ var require_gifenc = __commonJS({
           const g4 = color >> 8 & 255;
           const r5 = color & 255;
           const key = rgb888_to_key(r5, g4, b4);
-          const idx = key in cache ? cache[key] : cache[key] = nearestColorIndexRGB(r5, g4, b4, palette);
+          const idx = key in cache ? cache[key] : cache[key] = nearestColorIndexRGB(r5, g4, b4, palette2);
           index[i6] = idx;
         }
       }
       return index;
     }
-    function nearestColorIndexRGBA(r5, g4, b4, a5, palette) {
+    function nearestColorIndexRGBA(r5, g4, b4, a5, palette2) {
       let k4 = 0;
       let mindist = 1e100;
-      for (let i6 = 0; i6 < palette.length; i6++) {
-        const px2 = palette[i6];
+      for (let i6 = 0; i6 < palette2.length; i6++) {
+        const px2 = palette2[i6];
         const a22 = px2[3];
         let curdist = sqr2(a22 - a5);
         if (curdist > mindist)
@@ -43443,11 +43443,11 @@ var require_gifenc = __commonJS({
       }
       return k4;
     }
-    function nearestColorIndexRGB(r5, g4, b4, palette) {
+    function nearestColorIndexRGB(r5, g4, b4, palette2) {
       let k4 = 0;
       let mindist = 1e100;
-      for (let i6 = 0; i6 < palette.length; i6++) {
-        const px2 = palette[i6];
+      for (let i6 = 0; i6 < palette2.length; i6++) {
+        const px2 = palette2[i6];
         const r22 = px2[0];
         let curdist = sqr2(r22 - r5);
         if (curdist > mindist)
@@ -43465,12 +43465,12 @@ var require_gifenc = __commonJS({
       }
       return k4;
     }
-    function snapColorsToPalette(palette, knownColors, threshold = 5) {
-      if (!palette.length || !knownColors.length)
+    function snapColorsToPalette(palette2, knownColors, threshold = 5) {
+      if (!palette2.length || !knownColors.length)
         return;
-      const paletteRGB = palette.map((p6) => p6.slice(0, 3));
+      const paletteRGB = palette2.map((p6) => p6.slice(0, 3));
       const thresholdSq = threshold * threshold;
-      const dim2 = palette[0].length;
+      const dim2 = palette2[0].length;
       for (let i6 = 0; i6 < knownColors.length; i6++) {
         let color = knownColors[i6];
         if (color.length < dim2) {
@@ -43484,7 +43484,7 @@ var require_gifenc = __commonJS({
         const idx = r5[0];
         const distanceSq = r5[1];
         if (distanceSq > 0 && distanceSq <= thresholdSq) {
-          palette[idx] = color;
+          palette2[idx] = color;
         }
       }
     }
@@ -43554,7 +43554,7 @@ var require_gifenc = __commonJS({
             transparent = false,
             transparentIndex = 0,
             delay = 0,
-            palette = null,
+            palette: palette2 = null,
             repeat = 0,
             colorDepth = 8,
             dispose = -1
@@ -43572,21 +43572,21 @@ var require_gifenc = __commonJS({
           width = Math.max(0, Math.floor(width));
           height = Math.max(0, Math.floor(height));
           if (first) {
-            if (!palette) {
+            if (!palette2) {
               throw new Error("First frame must include a { palette } option");
             }
-            encodeLogicalScreenDescriptor(stream, width, height, palette, colorDepth);
-            encodeColorTable(stream, palette);
+            encodeLogicalScreenDescriptor(stream, width, height, palette2, colorDepth);
+            encodeColorTable(stream, palette2);
             if (repeat >= 0) {
               encodeNetscapeExt(stream, repeat);
             }
           }
           const delayTime = Math.round(delay / 10);
           encodeGraphicControlExt(stream, dispose, delayTime, transparent, transparentIndex);
-          const useLocalColorTable = Boolean(palette) && !first;
-          encodeImageDescriptor(stream, width, height, useLocalColorTable ? palette : null);
+          const useLocalColorTable = Boolean(palette2) && !first;
+          encodeImageDescriptor(stream, width, height, useLocalColorTable ? palette2 : null);
           if (useLocalColorTable)
-            encodeColorTable(stream, palette);
+            encodeColorTable(stream, palette2);
           encodePixels(stream, index, width, height, colorDepth, accum, htab, codetab);
         }
       };
@@ -43620,10 +43620,10 @@ var require_gifenc = __commonJS({
       stream.writeByte(transparentIndex || 0);
       stream.writeByte(0);
     }
-    function encodeLogicalScreenDescriptor(stream, width, height, palette, colorDepth = 8) {
+    function encodeLogicalScreenDescriptor(stream, width, height, palette2, colorDepth = 8) {
       const globalColorTableFlag = 1;
       const sortFlag = 0;
-      const globalColorTableSize = colorTableSize(palette.length) - 1;
+      const globalColorTableSize = colorTableSize(palette2.length) - 1;
       const fields = globalColorTableFlag << 7 | colorDepth - 1 << 4 | sortFlag << 3 | globalColorTableSize;
       const backgroundColorIndex = 0;
       const pixelAspectRatio = 0;
@@ -43641,12 +43641,12 @@ var require_gifenc = __commonJS({
       writeUInt16(stream, repeat);
       stream.writeByte(0);
     }
-    function encodeColorTable(stream, palette) {
-      const colorTableLength = 1 << colorTableSize(palette.length);
+    function encodeColorTable(stream, palette2) {
+      const colorTableLength = 1 << colorTableSize(palette2.length);
       for (let i6 = 0; i6 < colorTableLength; i6++) {
         let color = [0, 0, 0];
-        if (i6 < palette.length) {
-          color = palette[i6];
+        if (i6 < palette2.length) {
+          color = palette2[i6];
         }
         stream.writeByte(color[0]);
         stream.writeByte(color[1]);
@@ -48869,7 +48869,9 @@ var PathAttachment = external_exports.object({
   /** curve lengths for constant-speed positioning */
   lengths: external_exports.array(external_exports.number()).default([]),
   closed: external_exports.boolean().default(false),
-  constantSpeed: external_exports.boolean().default(true)
+  constantSpeed: external_exports.boolean().default(true),
+  /** Spine-style active clipping span in the posed draw order; end slot is inclusive. */
+  clipping: external_exports.object({ end: Id.optional() }).optional()
 });
 var Attachment = external_exports.discriminatedUnion("type", [RegionAttachment, MeshAttachment, PathAttachment]);
 var IkConstraint = external_exports.object({
@@ -48938,7 +48940,9 @@ var Key = external_exports.object({
   t: external_exports.number().nonnegative(),
   v: KeyValue,
   /** easing INTO the next key */
-  ease: Ease.default("ease_in_out")
+  ease: Ease.default("ease_in_out"),
+  /** Optional independent easing for numeric-array components (for example Spine RGBA curves). */
+  componentEase: external_exports.array(Ease).min(1).optional()
 });
 var Interpolation = { interpolation: external_exports.enum(["segment", "pchip"]).optional() };
 var Track = external_exports.discriminatedUnion("target", [
@@ -49125,6 +49129,10 @@ function validate(doc2) {
       else if (a5.slot !== s6.id) errs.push(`slot "${s6.id}": attachment "${s6.attachment}" belongs to slot "${a5.slot}"`);
     }
   }
+  for (const a5 of doc2.attachments) if (a5.type === "path" && a5.clipping) {
+    if (!a5.closed) errs.push(`attachment "${a5.id}": clipping path must be closed`);
+    if (a5.clipping.end && !slots.has(a5.clipping.end)) errs.push(`attachment "${a5.id}": unknown clipping end slot "${a5.clipping.end}"`);
+  }
   const vertexCount2 = (a5) => {
     if (a5.type === "region") return 4;
     if (a5.type === "mesh") return a5.uvs.length / 2;
@@ -49202,12 +49210,13 @@ function validate(doc2) {
       if (tracks.has(tid)) errs.push(`animation "${a5.id}": duplicate track ${tid}`);
       tracks.add(tid);
       if (driven.has(tid)) errs.push(`animation "${a5.id}": ${tid} is controlled by a binding; animate its control instead`);
-      const known = t5.target === "bone" ? bones.has(t5.id) : t5.target === "slot" ? slots.has(t5.id) : t5.target === "deform" ? attachments.has(t5.id) : t5.target === "ik" ? iks.has(t5.id) : t5.target === "transform" ? transforms.has(t5.id) : t5.target === "path" ? paths.has(t5.id) : t5.target === "control" ? controls.has(t5.id) : true;
-      if (!known) errs.push(`animation "${a5.id}": unknown ${t5.target} "${t5.id}"`);
+      const known2 = t5.target === "bone" ? bones.has(t5.id) : t5.target === "slot" ? slots.has(t5.id) : t5.target === "deform" ? attachments.has(t5.id) : t5.target === "ik" ? iks.has(t5.id) : t5.target === "transform" ? transforms.has(t5.id) : t5.target === "path" ? paths.has(t5.id) : t5.target === "control" ? controls.has(t5.id) : true;
+      if (!known2) errs.push(`animation "${a5.id}": unknown ${t5.target} "${t5.id}"`);
       const bound = t5.target === "deform" ? DEFORM_BOUNDS[t5.prop] : void 0;
       const att = t5.target === "deform" ? attachments.get(t5.id) : void 0;
       let prev = -1;
       for (const k4 of t5.keys) {
+        if (k4.componentEase && (!Array.isArray(k4.v) || !k4.v.every((v6) => typeof v6 === "number") || k4.componentEase.length !== k4.v.length)) errs.push(`animation "${a5.id}" ${tid}: componentEase must match the numeric-array value length`);
         if (k4.t <= prev && prev >= 0) errs.push(`animation "${a5.id}" ${tid}: keys not strictly increasing`);
         if (k4.t > a5.duration) errs.push(`animation "${a5.id}" ${tid}: key at ${k4.t}s exceeds duration`);
         if (t5.target === "control") {
@@ -49372,8 +49381,8 @@ function sample(track, t5, loop2 = false) {
   }
   if (Array.isArray(a5.v) && Array.isArray(b4.v) && typeof a5.v[0] === "number") {
     if (track.interpolation === "pchip") return a5.v.map((_4, j5) => smoothValue(track, i6, t5, j5, loop2));
-    const u6 = ease(a5.ease)((t5 - a5.t) / (b4.t - a5.t)), av = a5.v, bv = b4.v;
-    return av.map((v6, k4) => v6 + ((bv[k4] ?? v6) - v6) * u6);
+    const phase = (t5 - a5.t) / (b4.t - a5.t), av = a5.v, bv = b4.v;
+    return av.map((v6, k4) => v6 + ((bv[k4] ?? v6) - v6) * ease(a5.componentEase?.[k4] ?? a5.ease)(phase));
   }
   return a5.v;
 }
@@ -49461,6 +49470,13 @@ function boneWorldOf(bone, s6, parent) {
   if (!parent) return local;
   if (bone.inherit === "normal") return mul(parent, local);
   const [tx, ty] = apply(parent, s6.x, s6.y);
+  if (bone.inherit === "noScale" || bone.inherit === "noScaleOrReflection") {
+    const r5 = s6.rotation * DEG2, x4 = parent.a * Math.cos(r5) + parent.c * Math.sin(r5), y5 = parent.b * Math.cos(r5) + parent.d * Math.sin(r5);
+    const length2 = Math.hypot(x4, y5), a5 = length2 > 1e-5 ? x4 / length2 : x4, b4 = length2 > 1e-5 ? y5 / length2 : y5;
+    const sign = bone.inherit === "noScale" && parent.a * parent.d - parent.b * parent.c < 0 ? -1 : 1;
+    const basis2 = { a: a5, b: b4, c: -b4 * sign, d: a5 * sign, tx: 0, ty: 0 };
+    return { ...mul(basis2, affineOf(0, 0, 0, s6.scaleX, s6.scaleY, s6.shearX, s6.shearY)), tx, ty };
+  }
   return { ...mul(inheritedParentLinear(bone, parent), { ...local, tx: 0, ty: 0 }), tx, ty };
 }
 var orderCache = /* @__PURE__ */ new WeakMap();
@@ -49493,11 +49509,11 @@ var localOf = (doc2, pose2, b4) => {
     shearY: num(pose2, pk("bone", id, "shearY"), r5.shearY)
   };
 };
-function updateSubtree(skel, root2) {
+function updateSubtree(skel, root2, includeRoot = true) {
   const doc2 = skel.doc;
   const kids = /* @__PURE__ */ new Map();
   for (const b4 of doc2.bones) if (b4.parent) (kids.get(b4.parent) ?? kids.set(b4.parent, []).get(b4.parent)).push(b4);
-  const stack = [root2];
+  const stack = includeRoot ? [root2] : (kids.get(root2) ?? []).map((b4) => b4.id);
   while (stack.length) {
     const id = stack.pop(), b4 = boneOf(doc2, id), st = skel.bones.get(id);
     st.world = boneWorldOf(b4, st, b4.parent ? skel.bones.get(b4.parent).world : void 0);
@@ -49531,6 +49547,23 @@ function evaluate(doc2, pose2, modifiers) {
   }
   return skel;
 }
+function slotClips(skel) {
+  const keyed = skel.pose.get(pk("drawOrder", "order", "order"));
+  const order = Array.isArray(keyed) ? keyed : [...skel.doc.slots].sort((a5, b4) => a5.z - b4.z).map((s6) => s6.id);
+  const masks = /* @__PURE__ */ new Map();
+  let active;
+  for (const id of order) {
+    const att = skel.attachment.get(id);
+    if (!active && att?.type === "path" && att.clipping) {
+      active = att;
+      continue;
+    }
+    if (active) masks.set(id, active.id);
+    if (active?.clipping?.end === id) active = void 0;
+  }
+  for (const s6 of skel.doc.slots) if (s6.clip) masks.set(s6.id, s6.clip);
+  return masks;
+}
 var cnum = (skel, kind, id, prop, rest) => num(skel.pose, pk(kind, id, prop), typeof rest === "boolean" ? rest ? 1 : 0 : rest);
 var IDENTITY = { a: 1, b: 0, c: 0, d: 1, tx: 0, ty: 0 };
 var wrapRad = (r5) => r5 > Math.PI ? r5 - 2 * Math.PI : r5 < -Math.PI ? r5 + 2 * Math.PI : r5;
@@ -49740,7 +49773,8 @@ function applyTransformConstraint(skel, c5) {
   if (!mixRotate && !mixX && !mixY && !mixScaleX && !mixScaleY && !mixShearY) return;
   c5 = { ...c5, ...Object.fromEntries(["x", "y", "rotation", "scaleX", "scaleY", "shearY"].map((p6) => [p6, cnum(skel, "transform", c5.id, p6, c5[p6])])) };
   const target = skel.bones.get(c5.target), tw = target.world;
-  const offsetRotation = c5.rotation * DEG2, offsetShearY = c5.shearY * DEG2;
+  const handedness = tw.a * tw.d - tw.b * tw.c < 0 ? -1 : 1;
+  const offsetRotation = c5.rotation * DEG2 * (c5.local ? 1 : handedness), offsetShearY = c5.shearY * DEG2 * (c5.local ? 1 : handedness);
   for (const id of c5.bones) {
     const b4 = boneOf(skel.doc, id), st = skel.bones.get(id);
     if (c5.local) {
@@ -49902,6 +49936,7 @@ function applyPathConstraint(skel, c5) {
   const position = cnum(skel, "path", c5.id, "position", c5.position), spacing = cnum(skel, "path", c5.id, "spacing", c5.spacing);
   const tangents = c5.rotateMode === "tangent", scale = c5.rotateMode === "chainScale";
   const bones = c5.bones.map((id) => ({ b: boneOf(skel.doc, id), st: skel.bones.get(id) }));
+  const inputWorlds = bones.map(({ st }) => ({ ...st.world }));
   const spacesCount = tangents ? bones.length : bones.length + 1;
   const spaces = new Array(spacesCount).fill(0), worldLengths = [];
   let sum = 0;
@@ -49936,9 +49971,10 @@ function applyPathConstraint(skel, c5) {
     if (tw.a * tw.d - tw.b * tw.c < 0) offsetRotation = -offsetRotation;
   }
   let boneX = samples[0].x, boneY = samples[0].y;
+  const solvedWorlds = /* @__PURE__ */ new Map();
   for (let i6 = 0; i6 < bones.length; i6++) {
     const { b: b4, st } = bones[i6];
-    let w5 = { ...st.world };
+    let w5 = { ...inputWorlds[i6] };
     w5.tx += (boneX - w5.tx) * mixX;
     w5.ty += (boneY - w5.ty) * mixY;
     const next = samples[i6 + 1] ?? { x: 0, y: 0, angle: 0 };
@@ -49968,7 +50004,11 @@ function applyPathConstraint(skel, c5) {
       const cos = Math.cos(r5), sin = Math.sin(r5);
       w5 = { a: cos * a5 - sin * bb, b: sin * a5 + cos * bb, c: cos * cc - sin * d6, d: sin * cc + cos * d6, tx: w5.tx, ty: w5.ty };
     }
-    setEffectiveWorld(skel, b4, st, w5);
+    solvedWorlds.set(b4.id, w5);
+  }
+  for (const b4 of boneOrder(skel.doc)) {
+    const world = solvedWorlds.get(b4.id);
+    if (world) setEffectiveWorld(skel, b4, skel.bones.get(b4.id), world);
   }
 }
 function measuredPathLength(points, closed, lengths, constantSpeed) {
@@ -49997,9 +50037,14 @@ function inheritedParentLinear(bone, parent) {
     case "onlyTranslation":
       return { a: 1, b: 0, c: 0, d: 1, tx: 0, ty: 0 };
     case "noRotationOrReflection": {
-      const lenX = Math.hypot(parent.a, parent.b) || 1;
+      const lenX = Math.hypot(parent.a, parent.b);
       const det = parent.a * parent.d - parent.b * parent.c;
-      return { a: lenX, b: 0, c: 0, d: Math.abs(det) / lenX, tx: 0, ty: 0 };
+      if (lenX * lenX <= 1e-4) {
+        const lenY = Math.hypot(parent.c, parent.d), ux3 = lenY ? parent.c / lenY : 0, uy3 = lenY ? parent.d / lenY : 0;
+        return { a: lenY * ux3 * ux3, b: lenY * ux3 * uy3, c: lenY * ux3 * uy3, d: lenY * uy3 * uy3, tx: 0, ty: 0 };
+      }
+      const ux2 = parent.a / lenX, uy2 = parent.b / lenX, sy = Math.abs(det) / lenX;
+      return { a: lenX * ux2 * ux2 + sy * uy2 * uy2, b: (lenX - sy) * ux2 * uy2, c: (lenX - sy) * ux2 * uy2, d: lenX * uy2 * uy2 + sy * ux2 * ux2, tx: 0, ty: 0 };
     }
     case "noScale":
     case "noScaleOrReflection": {
@@ -50025,7 +50070,16 @@ function setEffectiveWorld(skel, bone, st, world) {
   st.scaleY = Math.hypot(lin.c, lin.d);
   st.shearX = 0;
   st.shearY = shortest(Math.atan2(lin.d, lin.c) / DEG2 - st.rotation - 90);
-  updateSubtree(skel, bone.id);
+  if (parent && (bone.inherit === "noScale" || bone.inherit === "noScaleOrReflection")) {
+    const direction = mul(invert({ ...parent, tx: 0, ty: 0 }), { ...world, tx: 0, ty: 0 });
+    st.rotation = Math.atan2(direction.b, direction.a) / DEG2;
+    st.scaleX = Math.hypot(world.a, world.b);
+    st.scaleY = Math.hypot(world.c, world.d);
+    const sign = bone.inherit === "noScale" && parent.a * parent.d - parent.b * parent.c < 0 ? -1 : 1;
+    st.shearY = shortest((Math.atan2(world.d, world.c) - Math.atan2(world.b, world.a)) / DEG2 * sign - 90);
+  }
+  st.world = world;
+  updateSubtree(skel, bone.id, false);
 }
 function attachmentWorldVertices(skel, slotId, att) {
   const deform = skel.pose.get(pk("deform", att.id, "vertices"));
@@ -50904,12 +50958,12 @@ var json = async (res) => {
   return body;
 };
 async function getDoc(rig) {
-  const r5 = await json(await fetch(`/api/doc?rig=${encodeURIComponent(rig)}`));
+  const r5 = await json(await fetch(`api/doc?rig=${encodeURIComponent(rig)}`));
   if (r5.isError) throw new Error(String(r5.text).replace(/^ERROR: /, ""));
   return r5;
 }
 async function callTool(rig, name, args, baseVersion) {
-  const res = await fetch(`/api/tool/${encodeURIComponent(name)}`, {
+  const res = await fetch(`api/tool/${encodeURIComponent(name)}`, {
     method: "POST",
     headers: { "content-type": "application/json" },
     body: JSON.stringify({ rig, args, baseVersion })
@@ -50917,25 +50971,25 @@ async function callTool(rig, name, args, baseVersion) {
   return { ...await json(res), status: res.status };
 }
 function subscribe(rig, onChanged, onState) {
-  const es = new EventSource(`/api/events?rig=${encodeURIComponent(rig)}`);
+  const es = new EventSource(`api/events?rig=${encodeURIComponent(rig)}`);
   es.addEventListener("changed", (e5) => onChanged(JSON.parse(e5.data).version));
   es.onopen = () => onState(true);
   es.onerror = () => onState(false);
   return () => es.close();
 }
-var assetUrl = (rigDir2, src) => `/rig/${rigDir2 ? rigDir2 + "/" : ""}${src}`;
+var assetUrl = (rigDir2, src) => `rig/${rigDir2 ? rigDir2 + "/" : ""}${src}`;
 async function listRigs() {
-  return json(await fetch("/api/rigs"));
+  return json(await fetch("api/rigs"));
 }
 async function createRig(rig, name, width, height) {
-  const res = await fetch("/api/rigs", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ rig, name, width, height }) });
+  const res = await fetch("api/rigs", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ rig, name, width, height }) });
   return { ...await json(res), status: res.status };
 }
 async function listFiles(rig) {
-  return json(await fetch(`/api/files?rig=${encodeURIComponent(rig)}`));
+  return json(await fetch(`api/files?rig=${encodeURIComponent(rig)}`));
 }
 async function upload(rig, file) {
-  const res = await fetch(`/api/upload?rig=${encodeURIComponent(rig)}&name=${encodeURIComponent(file.name)}`, { method: "POST", headers: { "content-type": "image/png" }, body: file });
+  const res = await fetch(`api/upload?rig=${encodeURIComponent(rig)}&name=${encodeURIComponent(file.name)}`, { method: "POST", headers: { "content-type": "image/png" }, body: file });
   const r5 = await json(res);
   if (r5.isError) throw new Error(String(r5.text).replace(/^ERROR: /, ""));
   return r5;
@@ -51355,6 +51409,7 @@ __export(store_exports, {
   drawOrderFront: () => drawOrderFront,
   drivenBy: () => drivenBy,
   editable: () => editable,
+  embedded: () => embedded,
   ensureTemplate: () => ensureTemplate,
   externalChange: () => externalChange,
   files: () => files,
@@ -51541,6 +51596,7 @@ function hitMesh(v6, tri, px, py) {
 var params = new URLSearchParams(typeof location === "undefined" ? "" : location.search);
 var rigPath = params.get("rig") || "examples/hero/rig.json";
 var rigDir = rigPath.slice(0, Math.max(0, rigPath.lastIndexOf("/")));
+var embedded = params.get("embed") === "1";
 var doc = y3(void 0);
 var draft = y3(void 0);
 var shown = g2(() => draft.value ?? doc.value);
@@ -58172,7 +58228,7 @@ var RigPlayer = class {
     this.clipPoints.clear();
     const skel = this.skel = evaluate(this.doc, pose2, this.beforePose);
     pose2 = skel.pose;
-    const clips = new Set(this.doc.slots.flatMap((s6) => s6.clip ? [s6.clip] : []));
+    const masks = slotClips(skel), clips = new Set(masks.values());
     for (const [id, g4] of this.clipGraphics) if (!clips.has(id)) {
       g4.destroy();
       this.clipGraphics.delete(id);
@@ -58199,7 +58255,8 @@ var RigPlayer = class {
     if (Array.isArray(orderV)) orderV.forEach((id, i6) => order.set(id, i6));
     for (const it of this.items) {
       const s6 = it.slot, shown2 = skel.attachment.get(s6.id);
-      it.node.mask = s6.clip ? this.clipGraphics.get(s6.clip) ?? null : null;
+      const mask = masks.get(s6.id);
+      it.node.mask = mask ? this.clipGraphics.get(mask) ?? null : null;
       if (shown2 !== it.att || this.hidden.has(s6.id)) {
         it.node.visible = false;
         continue;
@@ -58825,8 +58882,8 @@ var Stage = class {
         void p6.play(anim.id, { loop: false, mix: 0 });
         p6.tick(i6 / fps);
         const { pixels } = this.app.renderer.extract.pixels({ target: this.camera, frame });
-        const palette = (0, import_gifenc.quantize)(pixels, 256);
-        gif.writeFrame((0, import_gifenc.applyPalette)(pixels, palette), w5, h6, { palette, delay: 1e3 / fps });
+        const palette2 = (0, import_gifenc.quantize)(pixels, 256);
+        gif.writeFrame((0, import_gifenc.applyPalette)(pixels, palette2), w5, h6, { palette: palette2, delay: 1e3 / fps });
         setStatus(`gif: frame ${i6 + 1}/${n4}`);
         await new Promise((r5) => setTimeout(r5));
       }
@@ -59640,9 +59697,9 @@ var KEY_HIT = 5;
 var times2 = (ts) => [...new Set(ts.flatMap((t5) => t5.keys.map((k4) => k4.t)))].sort((a5, b4) => a5 - b4);
 function rows(doc2, anim) {
   const out2 = [{ kind: "all", label: "all keys", keys: times2(anim.tracks), depth: 0 }];
-  const push = (target, known) => {
+  const push = (target, known2) => {
     const mine = anim.tracks.filter((t5) => t5.target === target);
-    const ids = [.../* @__PURE__ */ new Set([...known.filter((id) => mine.some((t5) => t5.id === id)), ...mine.map((t5) => t5.id)])];
+    const ids = [.../* @__PURE__ */ new Set([...known2.filter((id) => mine.some((t5) => t5.id === id)), ...mine.map((t5) => t5.id)])];
     for (const id of ids) {
       const own = mine.filter((t5) => t5.id === id);
       out2.push({ kind: "group", label: id, keys: times2(own), depth: 0 });
@@ -59708,14 +59765,19 @@ function clampDuration(requested, lastKeyOrEventTime, fps) {
 }
 
 // src/editor/timeline.ts
-var PANEL = "#181818";
-var ALT = "#1E1E1E";
-var LINE = "#2B2B2B";
-var CTL_LINE = "#3C3C3C";
-var ACCENT4 = "#0078D4";
-var FG = "#CCCCCC";
-var FG2 = "#9D9D9D";
-var ERR = "#F14C4C";
+var TOKENS = {
+  PANEL: ["--chrome", "#181818"],
+  ALT: ["--bg", "#1E1E1E"],
+  LINE: ["--line", "#2B2B2B"],
+  CTL_LINE: ["--ctl-line", "#3C3C3C"],
+  ACCENT: ["--accent", "#0078D4"],
+  FG: ["--fg", "#CCCCCC"],
+  FG2: ["--fg2", "#9D9D9D"],
+  ERR: ["--err", "#F14C4C"]
+};
+function palette(style) {
+  return Object.fromEntries(Object.entries(TOKENS).map(([k4, [token, fallback]]) => [k4, style.getPropertyValue(token).trim() || fallback]));
+}
 var LEFT = 220;
 var ROW_H = 20;
 var HEADER_H = 24;
@@ -59745,6 +59807,9 @@ var Timeline = class {
       selectedKeys.value;
       f3(() => this.draw());
     }));
+    const retheme = () => f3(() => this.draw());
+    window.addEventListener("golem:theme", retheme);
+    this.dispose.push(() => window.removeEventListener("golem:theme", retheme));
     this.bindPointer();
     this.resize();
   }
@@ -59815,6 +59880,7 @@ var Timeline = class {
     g4.fill();
   }
   draw() {
+    const { PANEL, ALT, LINE, CTL_LINE, ACCENT: ACCENT4, FG, FG2, ERR } = palette(getComputedStyle(document.documentElement));
     const g4 = this.g, w5 = this.w, h6 = this.h, l6 = this.layout();
     const anim = currentAnim.value, rs = this.rowsNow(), d6 = this.drag;
     const dur = d6?.kind === "duration" ? d6.duration : anim?.duration ?? 0;
@@ -60245,6 +60311,41 @@ function ControlForms() {
   ] });
 }
 
+// src/editor/embed.ts
+var THEME_TOKENS = [
+  "--bg",
+  "--panel",
+  "--chrome",
+  "--line",
+  "--accent",
+  "--accent-hover",
+  "--fg",
+  "--fg2",
+  "--ctl",
+  "--ctl-hover",
+  "--ctl-line",
+  "--err",
+  "--warn",
+  "--font",
+  "--size"
+];
+var known = new Set(THEME_TOKENS);
+function themeVars(data) {
+  if (!data || typeof data !== "object" || data.type !== "golem:theme") return [];
+  const vars = data.vars;
+  if (!vars || typeof vars !== "object") return [];
+  return Object.entries(vars).filter((e5) => known.has(e5[0]) && typeof e5[1] === "string");
+}
+function listenForTheme(win = window) {
+  const on = (e5) => {
+    if (e5.origin !== win.location.origin) return;
+    for (const [name, value] of themeVars(e5.data)) win.document.documentElement.style.setProperty(name, value);
+    win.dispatchEvent(new Event("golem:theme"));
+  };
+  win.addEventListener("message", on);
+  return () => win.removeEventListener("message", on);
+}
+
 // src/editor/app.tsx
 var stage;
 var timeline;
@@ -60406,7 +60507,7 @@ function OpenList() {
   const body = rigsLoading.value ? /* @__PURE__ */ u4("div", { class: "rig", children: "loading\u2026" }) : rigsError.value ? /* @__PURE__ */ u4("div", { class: "rig error", children: [
     "open: ",
     rigsError.value
-  ] }) : rigs.value.length ? rigs.value.map((r5) => /* @__PURE__ */ u4("a", { class: "rig", "data-rig": r5.rig, href: `/editor.html?rig=${encodeURIComponent(r5.rig)}`, children: [
+  ] }) : rigs.value.length ? rigs.value.map((r5) => /* @__PURE__ */ u4("a", { class: "rig", "data-rig": r5.rig, href: `editor.html?rig=${encodeURIComponent(r5.rig)}`, children: [
     /* @__PURE__ */ u4("b", { children: r5.name }),
     " ",
     /* @__PURE__ */ u4("span", { class: "path", children: r5.rig }),
@@ -60438,7 +60539,7 @@ function NewForm() {
         setStatus(String(r5.text).replace(/^ERROR: /, ""), "error");
         return;
       }
-      location.href = `/editor.html?rig=${encodeURIComponent(`${dir}/rig.json`)}`;
+      location.href = `editor.html?rig=${encodeURIComponent(`${dir}/rig.json`)}`;
     } catch (e5) {
       setStatus(`new: ${e5.message}`, "error");
     }
@@ -60578,8 +60679,8 @@ function TopBar() {
       /* @__PURE__ */ u4("input", { class: "lock", type: "checkbox", checked: lockImages.value, onChange: (e5) => lockImages.value = e5.target.checked }),
       "lock images"
     ] }),
-    /* @__PURE__ */ u4("button", { class: "new", onClick: click(() => popover.value = popover.peek() === "new" ? void 0 : "new"), children: "new" }),
-    /* @__PURE__ */ u4("button", { class: "open", onClick: click(() => {
+    !embedded && /* @__PURE__ */ u4("button", { class: "new", onClick: click(() => popover.value = popover.peek() === "new" ? void 0 : "new"), children: "new" }),
+    !embedded && /* @__PURE__ */ u4("button", { class: "open", onClick: click(() => {
       if (popover.peek() === "open") {
         closePopover();
         return;
@@ -60839,6 +60940,7 @@ function App() {
     /* @__PURE__ */ u4(Splitter, { edge: "tl" })
   ] });
 }
+if (embedded) listenForTheme();
 restoreLayout();
 R(/* @__PURE__ */ u4(App, {}), document.getElementById("app"));
 await reload();