@weasel-js/labkit 0.8.0 → 1.0.1

package/dist/{chunk-6V7ROR7G.js → chunk-ISEK5LXT.js}

@@ -16,7 +16,7 @@ var GESTURE_DESCRIPTORS = [
   { name: "pointerDown", hasTarget: true },
   { name: "dblTap", hasTarget: true },
   { name: "drag", hasTarget: true },
-  { name: "wheel", hasTarget: false, arg: { name: "direction", values: ["up", "down", "*"], default: "*" } },
+  { name: "wheel", hasTarget: true, arg: { name: "direction", values: ["up", "down", "*"], default: "*" } },
   { name: "keyDown", hasTarget: false, arg: { name: "key", values: "free" } },
   { name: "keyUp", hasTarget: false, arg: { name: "key", values: "free" } },
   { name: "keyHeld", hasTarget: false, arg: { name: "key", values: "free" } },
@@ -388,44 +388,65 @@ function checkKey(req, held) {
   if (req === "forbidden") return !held;
   return true;
 }
-function matchKey(eventKey, specKey) {
+function matchKey(eventKey, specKey2) {
   const lower = eventKey.toLowerCase();
-  if (Array.isArray(specKey)) {
-    return specKey.some((k) => k.toLowerCase() === lower);
+  if (Array.isArray(specKey2)) {
+    return specKey2.some((k) => k.toLowerCase() === lower);
   }
-  return specKey.toLowerCase() === lower;
+  return specKey2.toLowerCase() === lower;
 }
 function affordanceKindOf(target) {
   if (typeof target !== "object" || target === null) return void 0;
   const k = target.kind;
   return typeof k === "string" ? k : void 0;
 }
-function matchTarget(target, specTarget, bodyTarget, bodyKind) {
-  if (specTarget === void 0) return true;
-  if (typeof specTarget === "object" && specTarget !== null && "kindOf" in specTarget && typeof specTarget.kindOf === "function") {
-    return specTarget.kindOf(target, bodyTarget);
+function hasPrefix(s, prefix) {
+  return s.startsWith(prefix);
+}
+function parseTargetSpec(spec) {
+  if (typeof spec === "object") {
+    return spec !== null && typeof spec.kindOf === "function" ? { form: "predicate", kindOf: spec.kindOf } : null;
+  }
+  if (typeof spec !== "string") return null;
+  if (spec === "empty" || spec === "selected-body" || spec === "unselected-body") {
+    return { form: "body", body: spec };
   }
-  if (typeof specTarget !== "string") return false;
-  if (specTarget === "empty" || specTarget === "selected-body" || specTarget === "unselected-body") {
-    if (bodyTarget === void 0) return false;
-    return bodyTarget === specTarget;
+  if (hasPrefix(spec, "affordance:")) {
+    return { form: "affordance", kind: spec.slice("affordance:".length) };
   }
-  if (specTarget.startsWith("affordance:")) {
-    const wanted = specTarget.slice("affordance:".length);
-    return affordanceKindOf(target) === wanted;
+  if (hasPrefix(spec, "kind:")) {
+    const rest = spec.slice("kind:".length);
+    const requireSelected = rest.endsWith(":selected");
+    return {
+      form: "kind",
+      kind: requireSelected ? rest.slice(0, -":selected".length) : rest,
+      requireSelected
+    };
   }
-  if (specTarget.startsWith("kind:")) {
-    if (bodyKind === void 0) return false;
-    let wanted = specTarget.slice("kind:".length);
-    let requireSelected = false;
-    if (wanted.endsWith(":selected")) {
-      wanted = wanted.slice(0, -":selected".length);
-      requireSelected = true;
+  return null;
+}
+function matchTarget(target, specTarget, bodyTarget, bodyKind) {
+  if (specTarget === void 0) return true;
+  const form = parseTargetSpec(specTarget);
+  if (form === null) return false;
+  switch (form.form) {
+    // Receives the raw target (affordance hit for drag, e.target otherwise)
+    // plus the bodyTarget classification.
+    case "predicate":
+      return form.kindOf(target, bodyTarget);
+    // Resolved from the `classifyTarget` result packed into the event's
+    // `bodyTarget`. Unwired classifyTarget → absent → no match.
+    case "body":
+      return bodyTarget !== void 0 && bodyTarget === form.body;
+    case "affordance":
+      return affordanceKindOf(target) === form.kind;
+    case "kind":
+      if (bodyKind === void 0 || bodyKind !== form.kind) return false;
+      return form.requireSelected ? bodyTarget === "selected-body" : true;
+    default: {
+      return false;
     }
-    if (bodyKind !== wanted) return false;
-    return requireSelected ? bodyTarget === "selected-body" : true;
   }
-  return false;
 }
 function normalizePhase(spec) {
   if (typeof spec === "string") {
@@ -488,7 +509,7 @@ function matchSpec(e, spec, isMac, phaseCtx) {
       const direction = spec.direction ?? "*";
       if (direction === "up" && !(e.deltaY < 0)) return false;
       if (direction === "down" && !(e.deltaY > 0)) return false;
-      return true;
+      return matchTarget(e.affordance, spec.target, e.bodyTarget, e.bodyKind);
     }
     case "click": {
       if (e.kind !== "click") return false;
@@ -498,12 +519,12 @@ function matchSpec(e, spec, isMac, phaseCtx) {
     case "doubleClick": {
       if (e.kind !== "doubleclick") return false;
       if (!matchModifiers(e, spec.mods, isMac)) return false;
-      return matchTarget(e.target, spec.target, e.bodyTarget, e.bodyKind);
+      return matchTarget(e.affordance, spec.target, e.bodyTarget, e.bodyKind);
     }
     case "contextMenu": {
       if (e.kind !== "contextmenu") return false;
       if (!matchModifiers(e, spec.mods, isMac)) return false;
-      return matchTarget(e.target, spec.target, e.bodyTarget, e.bodyKind);
+      return matchTarget(e.affordance, spec.target, e.bodyTarget, e.bodyKind);
     }
     case "longPress": {
       if (e.kind !== "longpress") return false;
@@ -547,8 +568,6 @@ function matchSpec(e, spec, isMac, phaseCtx) {
   }
 }
 var EMPTY_ENGAGED = /* @__PURE__ */ new Set();
-
-// ../core/dist/chunk-6DAUIMTO.js
 var routing_exports = {};
 __export(routing_exports, {
   GESTURE_DESCRIPTORS: () => GESTURE_DESCRIPTORS,
@@ -597,7 +616,11 @@ function defineTool(def) {
   };
   return {
     id: def.id,
-    capabilities: def.capabilities,
+    eligibility: {
+      focus: true,
+      capabilities: def.capabilities,
+      ...def.hotkey ? { offhand: def.hotkey } : {}
+    },
     actions: def.actions,
     def,
     presentation: def.presentation,
@@ -683,6 +706,255 @@ function argOf(spec, fallback) {
   if ("direction" in spec) return spec.direction ?? fallback;
   return fallback;
 }
+var DepRegistryContext = createContext(null);
+function DepRegistryProvider({ children }) {
+  const sourcesRef = useRef(/* @__PURE__ */ new Map());
+  const registry4 = useMemo(() => ({
+    register: (name, source) => {
+      sourcesRef.current.set(name, source);
+      return () => {
+        sourcesRef.current.delete(name);
+      };
+    },
+    get: (name) => sourcesRef.current.get(name)?.()
+  }), []);
+  return /* @__PURE__ */ jsx(DepRegistryContext.Provider, { value: registry4, children });
+}
+function useDepRegistry() {
+  const r = useContext(DepRegistryContext);
+  if (r === null) {
+    throw new Error("useDepRegistry: no DepRegistryProvider in scope. Wrap your tree with <DepRegistryProvider> (typically inside <SceneCanvas>).");
+  }
+  return r;
+}
+function useOptionalDepRegistry() {
+  return useContext(DepRegistryContext);
+}
+function useDepSource(name, source) {
+  const registry4 = useDepRegistry();
+  const sourceRef = useRef(source);
+  sourceRef.current = source;
+  useEffect(() => {
+    return registry4.register(name, () => sourceRef.current());
+  }, [name, registry4]);
+}
+var DEV = (() => {
+  try {
+    return Boolean(import.meta.env?.DEV);
+  } catch {
+    return false;
+  }
+})();
+function buildDepsFromRequires(action, depRegistry) {
+  const requires = action.requires ?? [];
+  const entries = requires.map((name) => [name, depRegistry.get(name)]);
+  const deps = Object.fromEntries(entries);
+  if (DEV) {
+    const declared = new Set(requires);
+    return new Proxy(deps, {
+      get(target, prop, receiver) {
+        if (typeof prop === "string" && !declared.has(prop) && prop !== "then") {
+          const message = `[weasel:dispatcher] action "${action.id}" read deps.${prop} but did not declare it in \`requires\`. Add \`requires: [...'${prop}']\` to the descriptor or the dep will be undefined at runtime.`;
+          console.warn(message);
+          throw new Error(message);
+        }
+        return Reflect.get(target, prop, receiver);
+      }
+    });
+  }
+  return deps;
+}
+function actionBindings(action) {
+  const gs = action.defaultBinding;
+  if (!gs) return [];
+  const raw = Array.isArray(gs) ? gs : [gs];
+  return raw.map((entry) => {
+    const isBoundObj = !("kind" in entry);
+    const spec = isBoundObj ? entry.spec : entry;
+    const opts = isBoundObj ? entry.opts : void 0;
+    return { spec, actionId: action.id, ...opts !== void 0 ? { opts } : {} };
+  });
+}
+var ActionDisabledReason = {
+  SelectionRequired: "selection-required",
+  NotApplicable: "not-applicable",
+  /** Sentinel: the predicate threw. Surfaced by `evaluateEnabled`'s catch. */
+  PredicateThrew: "predicate-threw"
+};
+var enabledSlowWarned = /* @__PURE__ */ new Set();
+var enabledThrewWarned = /* @__PURE__ */ new Set();
+var ENABLED_BUDGET_MS = 4;
+function evaluateEnabled(action, deps) {
+  if (!action.enabled) return { enabled: true };
+  const isDev = typeof process !== "undefined" ? process.env.NODE_ENV !== "production" : true;
+  const now = typeof performance !== "undefined" && typeof performance.now === "function" ? () => performance.now() : () => Date.now();
+  const start = isDev ? now() : 0;
+  try {
+    const result = action.enabled(deps);
+    if (isDev) {
+      const elapsed = now() - start;
+      if (elapsed > ENABLED_BUDGET_MS && !enabledSlowWarned.has(action.id)) {
+        enabledSlowWarned.add(action.id);
+        console.warn(
+          `weasel actions: enabled() for action "${action.id}" took ${elapsed.toFixed(2)}ms (budget ${ENABLED_BUDGET_MS}ms). The predicate must be pure and fast \u2014 see Action.enabled JSDoc.`
+        );
+      }
+    }
+    if (result === true) return { enabled: true };
+    return { enabled: false, reason: result };
+  } catch (e) {
+    if (isDev && !enabledThrewWarned.has(action.id)) {
+      enabledThrewWarned.add(action.id);
+      console.warn(
+        `weasel actions: enabled() for action "${action.id}" threw; treating as disabled. The predicate must not throw \u2014 see Action.enabled JSDoc.`,
+        e
+      );
+    }
+    return { enabled: false, reason: ActionDisabledReason.PredicateThrew };
+  }
+}
+function validateActionId(id) {
+  if (id.length === 0) {
+    throw new Error(`weasel: action id may not be empty`);
+  }
+  if (RESERVED_ID_PREFIXES.has(id[0])) {
+    throw new Error(
+      `weasel: action id "${id}" starts with reserved sigil "${id[0]}" (reserved set: ${[...RESERVED_ID_PREFIXES].join(" ")})`
+    );
+  }
+  if (RESERVED_ID_NAMES.has(id)) {
+    throw new Error(
+      `weasel: action id "${id}" collides with a reserved phase keyword (reserved: ${[...RESERVED_ID_NAMES].join(", ")})`
+    );
+  }
+}
+function validateActionDefaultBinding(action) {
+  const gs = action.defaultBinding;
+  if (!gs) return;
+  const entries = Array.isArray(gs) ? gs : [gs];
+  for (const entry of entries) {
+    const spec = "kind" in entry ? entry : entry.spec;
+    const phase = spec.phase;
+    if (phase === void 0) continue;
+    const atoms = Array.isArray(phase) ? phase : [{ channel: "&", phase }];
+    for (const atom of atoms) {
+      if (atom.channel === "&") {
+        throw new Error(
+          `weasel: action "${action.id}" defaultBinding uses '&' channel which has no owning tool to resolve to. Use a named tool channel (e.g. '[rect:engaged]') or '*' instead, or move this binding to the tool's own Tool.bindings.`
+        );
+      }
+    }
+  }
+}
+var ActionsContext = createContext(null);
+function ActionsProvider({ children }) {
+  const actionsRef = useRef(/* @__PURE__ */ new Map());
+  const versionRef = useRef(0);
+  const cachedRef = useRef([]);
+  const cachedVerRef = useRef(-1);
+  const listenersRef = useRef(/* @__PURE__ */ new Set());
+  const depReg = useOptionalDepRegistry();
+  const depRegRef = useRef(depReg);
+  depRegRef.current = depReg;
+  const wiredDepRegRef = useRef(null);
+  const dispatcherRef = useRef(null);
+  const registry4 = useMemo(() => {
+    const snapshot = () => {
+      const v = versionRef.current;
+      if (cachedVerRef.current === v) return cachedRef.current;
+      const out = Object.freeze(Array.from(actionsRef.current.values()));
+      cachedRef.current = out;
+      cachedVerRef.current = v;
+      return out;
+    };
+    const notify2 = () => {
+      for (const l of listenersRef.current) {
+        try {
+          l();
+        } catch (err) {
+          console.error("weasel ActionsRegistry: subscriber threw", err);
+        }
+      }
+    };
+    return {
+      register: (action) => {
+        validateActionId(action.id);
+        validateActionDefaultBinding(action);
+        actionsRef.current.set(action.id, action);
+        versionRef.current++;
+        notify2();
+        return () => {
+          const cur = actionsRef.current.get(action.id);
+          if (cur === action) {
+            actionsRef.current.delete(action.id);
+            versionRef.current++;
+            notify2();
+          }
+        };
+      },
+      unregister: (id) => {
+        if (actionsRef.current.delete(id)) {
+          versionRef.current++;
+          notify2();
+        }
+      },
+      list: () => snapshot(),
+      trigger: (id, params) => {
+        const a = actionsRef.current.get(id);
+        if (!a) return false;
+        try {
+          if (a.invoker && a.invoker.timing === "immediate") {
+            const r = wiredDepRegRef.current ?? depRegRef.current;
+            const deps = !r ? {} : a.requires ? buildDepsFromRequires(a, r) : {
+              selection: r.get("selection"),
+              scene: r.get("scene"),
+              history: r.get("history"),
+              view: r.get("view"),
+              pointer: r.get("pointer"),
+              activeTool: r.get("activeTool"),
+              booleansAdapter: r.get("booleansAdapter")
+            };
+            a.invoker.run(deps, params);
+          }
+        } catch (err) {
+          console.error(`weasel ActionsRegistry: action "${id}" threw`, err);
+        }
+        return true;
+      },
+      subscribe: (listener) => {
+        listenersRef.current.add(listener);
+        return () => {
+          listenersRef.current.delete(listener);
+        };
+      },
+      setDispatcher: (d) => {
+        dispatcherRef.current = d;
+      },
+      setDepRegistry: (r) => {
+        wiredDepRegRef.current = r;
+      },
+      begin: (id, params) => {
+        const disp = dispatcherRef.current;
+        if (!disp) return null;
+        const r = wiredDepRegRef.current ?? depRegRef.current;
+        const deps = r ? {
+          selection: r.get("selection"),
+          scene: r.get("scene"),
+          history: r.get("history"),
+          view: r.get("view"),
+          pointer: r.get("pointer"),
+          activeTool: r.get("activeTool"),
+          booleansAdapter: r.get("booleansAdapter")
+        } : {};
+        return disp.beginUiOngoing(id, deps, params);
+      }
+    };
+  }, []);
+  return /* @__PURE__ */ jsx(ActionsContext.Provider, { value: registry4, children });
+}
+function useActionsRegistry() {
+  return useContext(ActionsContext);
+}
 function findConflicts(tools) {
   const entries = buildRouteRegistry(tools);
   const groups = /* @__PURE__ */ new Map();
@@ -724,9 +996,15 @@ function predicateId(pred) {
   }
   return id;
 }
+function actionAsTool(action) {
+  return { id: action.id, eligibility: {}, bindings: actionBindings(action) };
+}
 function findScopedConflicts(scopes) {
   const registry4 = Array.isArray(scopes.registry) ? scopes.registry : Object.values(scopes.registry);
-  const ambient = scopes.ambient ?? [];
+  const actions = scopes.actions ?? [];
+  const ambientActions = actions.filter((a) => a.scope !== "hotkey").map(actionAsTool);
+  const hotkeyActions = actions.filter((a) => a.scope === "hotkey").map(actionAsTool);
+  const ambient = [...scopes.ambient ?? [], ...ambientActions];
   const out = [];
   const seen = /* @__PURE__ */ new Set();
   const add = (conflicts) => {
@@ -737,12 +1015,13 @@ function findScopedConflicts(scopes) {
       out.push(c);
     }
   };
-  for (const tool of [...registry4, ...ambient]) add(findConflicts([tool]));
+  for (const tool of [...registry4, ...scopes.ambient ?? []]) add(findConflicts([tool]));
   if (ambient.length > 1) add(findConflicts(ambient));
-  const hotkeyTools = registry4.filter(
-    (t) => t.def?.hotkey !== void 0
-  );
-  if (hotkeyTools.length > 1) add(findConflicts(hotkeyTools));
+  const hotkey = [
+    ...registry4.filter((t) => t.def?.hotkey !== void 0),
+    ...hotkeyActions
+  ];
+  if (hotkey.length > 1) add(findConflicts(hotkey));
   return out;
 }
 function formatConflict(conflict) {
@@ -882,7 +1161,7 @@ function transformCoords(coords, m) {
   return out;
 }
 
-// ../core/dist/chunk-GLZLSPGJ.js
+// ../core/dist/chunk-6SHZHXXR.js
 function resolveUnit(v, unitSystem) {
   if (typeof v === "number") return v;
   if (!unitSystem) {
@@ -1453,10 +1732,32 @@ var RECT_POSE_DESCRIPTOR = {
   translate: RECT_POSE_DESCRIPTOR.translate,
   intersectsRect: RECT_POSE_DESCRIPTOR.intersectsRect,
   lerp: RECT_POSE_DESCRIPTOR.lerp});
-var pathPoseDescriptor = {
-  getBounds: (path) => boundsOfPath(path),
-  remapBounds: (path, src, dst) => {
-    const sx = src.width === 0 ? 0 : dst.width / src.width;
+function remapRotatedLeaf(pose, src, dst) {
+  const sx = src.width === 0 ? 1 : dst.width / src.width;
+  const sy = src.height === 0 ? 1 : dst.height / src.height;
+  const theta = pose.rotation ?? 0;
+  const cos = Math.cos(theta);
+  const sin = Math.sin(theta);
+  const ux = sx * cos, uy = sy * sin;
+  const vx = -sx * sin, vy = sy * cos;
+  const width = pose.width * Math.hypot(ux, uy);
+  const height = pose.height * Math.hypot(vx, vy);
+  const rotation = Math.atan2(uy, ux);
+  const cxNew = dst.x + (pose.x + pose.width / 2 - src.x) * sx;
+  const cyNew = dst.y + (pose.y + pose.height / 2 - src.y) * sy;
+  return {
+    ...pose,
+    x: cxNew - width / 2,
+    y: cyNew - height / 2,
+    width,
+    height,
+    rotation
+  };
+}
+var pathPoseDescriptor = {
+  getBounds: (path) => boundsOfPath(path),
+  remapBounds: (path, src, dst) => {
+    const sx = src.width === 0 ? 0 : dst.width / src.width;
     const sy = src.height === 0 ? 0 : dst.height / src.height;
     if (path.kind === "rect") {
       return {
@@ -1549,14 +1850,29 @@ var RECT_ORIGIN_PROJECTION = {
   getOrigin: (p) => ({ x: p.x, y: p.y }),
   translate: (p, dx, dy) => ({ ...p, x: p.x + dx, y: p.y + dy })
 };
-function meanScale(s) {
-  return Math.sqrt(s.x * s.y);
+var MIN_SCALE = 1e-9;
+function pxExtent(px, scale2) {
+  return {
+    x: px / Math.max(MIN_SCALE, Math.abs(scale2.x)),
+    y: px / Math.max(MIN_SCALE, Math.abs(scale2.y))
+  };
+}
+function scaleDelta(dx, dy, scale2) {
+  return { x: dx * scale2.x, y: dy * scale2.y };
+}
+function withinPxBox(dx, dy, px, scale2) {
+  const s = scaleDelta(dx, dy, scale2);
+  return Math.abs(s.x) <= px && Math.abs(s.y) <= px;
+}
+function withinPxRadius(dx, dy, px, scale2) {
+  const s = scaleDelta(dx, dy, scale2);
+  return s.x * s.x + s.y * s.y <= px * px;
 }
 
 // ../core/dist/chunk-GVCNT7UH.js
 var FACTORIES = /* @__PURE__ */ new Map();
-function registerOpFactory(name, build) {
-  FACTORIES.set(name, build);
+function registerOpFactory(name, build2) {
+  FACTORIES.set(name, build2);
 }
 function rebuildOp(name, args) {
   const f = FACTORIES.get(name);
@@ -1593,7 +1909,7 @@ function createDeleteOp(args) {
 }
 registerOpFactory("delete", (args) => createDeleteOp(args));
 
-// ../core/dist/chunk-BPRHGTLQ.js
+// ../core/dist/chunk-UB6A6L77.js
 function createTransformOp(args) {
   const { id, from, to, label, coalesceKey = `transform:${id}` } = args;
   return {
@@ -1674,7 +1990,7 @@ function snap(strategy, opts = {}) {
   };
 }
 
-// ../core/dist/chunk-CMBE45MT.js
+// ../core/dist/chunk-Z3KNFTTS.js
 function lockAspectWithModifier(opts = {}) {
   const { key = "shift" } = opts;
   return {
@@ -1870,11 +2186,163 @@ function materializePaste(adapter, snapshot, opts) {
   return { ops, newIds, created };
 }
 
-// ../core/dist/chunk-Y52N27PF.js
+// ../core/dist/chunk-IO5Z75X4.js
+var counter = 0;
 var registry = /* @__PURE__ */ new Map();
 function getTexture(id) {
   return registry.get(id) ?? null;
 }
+function registerTexture(image) {
+  const id = `tex_${++counter}`;
+  registry.set(id, { source: image });
+  return { id };
+}
+function tileSize(spec) {
+  if (spec.size !== void 0) return spec.size;
+  switch (spec.tile) {
+    case "hatch":
+      return 5;
+    case "crosshatch":
+      return 6;
+    case "dots":
+      return 6;
+    case "chunks":
+      return 48;
+    default:
+      return 8;
+  }
+}
+function mulberry32(seed) {
+  let s = seed | 0;
+  return () => {
+    s = s + 1831565813 | 0;
+    let t = Math.imul(s ^ s >>> 15, 1 | s);
+    t = t + Math.imul(t ^ t >>> 7, 61 | t) ^ t;
+    return ((t ^ t >>> 14) >>> 0) / 4294967296;
+  };
+}
+function tileGeometry(spec) {
+  const s = tileSize(spec);
+  const { color } = spec;
+  switch (spec.tile) {
+    case "hatch": {
+      const width = spec.lineWidth ?? 1;
+      return { size: s, shapes: forwardDiagonals(s, width, color) };
+    }
+    case "crosshatch": {
+      const width = spec.lineWidth ?? 0.8;
+      return {
+        size: s,
+        shapes: [...forwardDiagonals(s, width, color), ...backwardDiagonals(s, width, color)]
+      };
+    }
+    case "dots": {
+      const r = spec.radius ?? 1;
+      return { size: s, shapes: [{ kind: "circle", cx: s / 2, cy: s / 2, r, color }] };
+    }
+    case "chunks": {
+      const density = spec.density ?? 0.35;
+      const chunkSize = spec.chunkSize ?? 3;
+      const rand = mulberry32(spec.seed ?? 42);
+      const count = Math.round(s * s * density / (chunkSize * chunkSize));
+      const shapes = [];
+      if (spec.bg !== void 0) {
+        shapes.push({ kind: "rect", x: 0, y: 0, width: s, height: s, color: spec.bg });
+      }
+      for (let i = 0; i < count; i++) {
+        const cx = rand() * s;
+        const cy = rand() * s;
+        const w = chunkSize * (0.5 + rand());
+        const h = chunkSize * (0.5 + rand());
+        const rotation = rand() * Math.PI;
+        shapes.push({ kind: "ellipse", cx, cy, rx: w / 2, ry: h / 2, rotation, color });
+      }
+      return { size: s, shapes };
+    }
+    default:
+      return { size: s, shapes: [] };
+  }
+}
+function forwardDiagonals(s, width, color) {
+  return [
+    { kind: "line", x1: -1, y1: s + 1, x2: s + 1, y2: -1, width, color },
+    { kind: "line", x1: -1, y1: 1, x2: 1, y2: -1, width, color },
+    { kind: "line", x1: s - 1, y1: s + 1, x2: s + 1, y2: s - 1, width, color }
+  ];
+}
+function backwardDiagonals(s, width, color) {
+  return [
+    { kind: "line", x1: -1, y1: -1, x2: s + 1, y2: s + 1, width, color },
+    { kind: "line", x1: s - 1, y1: -1, x2: s + 1, y2: 1, width, color },
+    { kind: "line", x1: -1, y1: s - 1, x2: 1, y2: s + 1, width, color }
+  ];
+}
+function drawTileShapes(oc, geometry) {
+  for (const shape of geometry.shapes) {
+    if (shape.kind === "line") {
+      oc.strokeStyle = shape.color;
+      oc.lineWidth = shape.width;
+      oc.beginPath();
+      oc.moveTo(shape.x1, shape.y1);
+      oc.lineTo(shape.x2, shape.y2);
+      oc.stroke();
+      continue;
+    }
+    oc.fillStyle = shape.color;
+    if (shape.kind === "rect") {
+      oc.fillRect(shape.x, shape.y, shape.width, shape.height);
+      continue;
+    }
+    oc.beginPath();
+    if (shape.kind === "circle") {
+      oc.arc(shape.cx, shape.cy, shape.r, 0, Math.PI * 2);
+    } else {
+      oc.ellipse(shape.cx, shape.cy, shape.rx, shape.ry, shape.rotation, 0, Math.PI * 2);
+    }
+    oc.fill();
+  }
+}
+function createTilePattern(opts) {
+  let off;
+  try {
+    off = new OffscreenCanvas(opts.size, opts.size);
+  } catch {
+    if (typeof document === "undefined") return null;
+    const c = document.createElement("canvas");
+    c.width = opts.size;
+    c.height = opts.size;
+    off = c;
+  }
+  const oc = off.getContext("2d");
+  if (!oc) return null;
+  opts.draw(oc, opts.size);
+  let bitmap;
+  if (typeof off.transferToImageBitmap === "function") {
+    bitmap = off.transferToImageBitmap();
+  } else {
+    return null;
+  }
+  return registerTexture(bitmap);
+}
+function build(spec) {
+  const geometry = tileGeometry(spec);
+  return createTilePattern({
+    size: tileSize(spec),
+    draw: (oc) => drawTileShapes(oc, geometry)
+  });
+}
+function hatch(params) {
+  return build({ tile: "hatch", ...params });
+}
+function crosshatch(params) {
+  return build({ tile: "crosshatch", ...params });
+}
+function dots(params) {
+  return build({ tile: "dots", ...params });
+}
+function chunks(params) {
+  return build({ tile: "chunks", ...params });
+}
 
 // ../font/dist/index.js
 var subscribers = /* @__PURE__ */ new Set();
@@ -2012,8 +2480,8 @@ function alphaToSdf(alpha, width, height, radius, cutoff) {
   edt2d(gridInner, width, height, f, d, v, z);
   const out = new Uint8Array(n);
   for (let i = 0; i < n; i++) {
-    const dist4 = Math.sqrt(gridOuter[i]) - Math.sqrt(gridInner[i]);
-    const byte = Math.round(255 - 255 * (dist4 / radius + cutoff));
+    const dist3 = Math.sqrt(gridOuter[i]) - Math.sqrt(gridInner[i]);
+    const byte = Math.round(255 - 255 * (dist3 / radius + cutoff));
     out[i] = byte < 0 ? 0 : byte > 255 ? 255 : byte;
   }
   return out;
@@ -2219,17 +2687,17 @@ function dynamicPageTextureId(page) {
   return `weasel-dyn-sdf-page-${page}`;
 }
 var uploadedVersions = /* @__PURE__ */ new WeakMap();
-function syncDynamicPageTexture(cache6, pageIndex) {
+function syncDynamicPageTexture(cache7, pageIndex) {
   const page = pages[pageIndex];
   if (!page) return false;
   const id = dynamicPageTextureId(pageIndex);
-  let seen = uploadedVersions.get(cache6);
+  let seen = uploadedVersions.get(cache7);
   if (!seen) {
     seen = /* @__PURE__ */ new Map();
-    uploadedVersions.set(cache6, seen);
+    uploadedVersions.set(cache7, seen);
   }
-  if (!cache6.has(id)) {
-    cache6.uploadR8(id, PAGE_SIZE, PAGE_SIZE, page.data);
+  if (!cache7.has(id)) {
+    cache7.uploadR8(id, PAGE_SIZE, PAGE_SIZE, page.data);
     seen.set(pageIndex, page.version);
     return true;
   }
@@ -2242,7 +2710,7 @@ function syncDynamicPageTexture(cache6, pageIndex) {
       const src = (patch.y + row) * PAGE_SIZE + patch.x;
       tight.set(page.data.subarray(src, src + patch.w), row * patch.w);
     }
-    cache6.subImageR8(id, patch.x, patch.y, patch.w, patch.h, tight);
+    cache7.subImageR8(id, patch.x, patch.y, patch.w, patch.h, tight);
   }
   seen.set(pageIndex, page.version);
   return true;
@@ -2639,8 +3107,8 @@ function eligibleForMode(mode, toolTags) {
   }
   return false;
 }
-function eligibleTool(reg, tool) {
-  return eligibleForMode(reg.current(), tool.capabilities ?? []);
+function eligibleContribution(reg, entry) {
+  return eligibleForMode(reg.current(), entry.eligibility?.capabilities ?? []);
 }
 
 // ../history/dist/index.js
@@ -3009,7 +3477,7 @@ function serialToEntry(se, custom, logger) {
   };
 }
 
-// ../core/dist/chunk-DLV5F4NY.js
+// ../core/dist/chunk-FVNWK7U3.js
 function worldToScreen(worldX, worldY, view) {
   return [view.panX + worldX * view.zoom.x, view.panY + worldY * view.zoom.y];
 }
@@ -3260,6 +3728,58 @@ var GRAD_FILL_UNIFORMS = [
   "u_gradAngle"
 ];
 var GRAD_FILL_ATTRIBUTES = ["a_position"];
+var PATTERN_VERT_SRC = (
+  /* glsl */
+  `#version 300 es
+in vec2 a_position;
+uniform mat3 u_proj;
+uniform mat3 u_model;
+uniform mat3 u_worldInv;
+out vec2 v_world;
+void main() {
+  vec3 screen = u_model * vec3(a_position, 1.0);
+  vec3 clip   = u_proj  * vec3(screen.xy, 1.0);
+  gl_Position = vec4(clip.xy, 0.0, 1.0);
+  vec3 world = u_worldInv * vec3(screen.xy, 1.0);
+  v_world = world.xy;
+}
+`
+);
+var PATTERN_FRAG_SRC = (
+  /* glsl */
+  `#version 300 es
+precision highp float;
+in vec2 v_world;
+uniform sampler2D u_sampler;
+uniform vec2  u_tileOrigin;
+uniform vec2  u_tileSize;
+uniform float u_opacity;
+uniform float u_alpha;
+uniform mat4  u_colorMatrix;
+uniform vec4  u_colorBias;
+out vec4 outColor;
+void main() {
+  vec2 uv = (v_world - u_tileOrigin) / max(u_tileSize, vec2(0.0001));
+  vec4 texel = texture(u_sampler, uv);
+  vec4 mapped = clamp(u_colorMatrix * texel + u_colorBias, 0.0, 1.0);
+  float a = mapped.a * u_opacity * u_alpha;
+  outColor = vec4(mapped.rgb * a, a);
+}
+`
+);
+var PATTERN_FILL_UNIFORMS = [
+  "u_proj",
+  "u_model",
+  "u_worldInv",
+  "u_sampler",
+  "u_tileOrigin",
+  "u_tileSize",
+  "u_opacity",
+  "u_alpha",
+  "u_colorMatrix",
+  "u_colorBias"
+];
+var PATTERN_FILL_ATTRIBUTES = ["a_position"];
 var GLMeshCache = class {
   constructor(gl, aPositionLoc) {
     this.gl = gl;
@@ -3382,17 +3902,20 @@ var GLTextureCache = class {
   has(id) {
     return this.map.has(id);
   }
-  upload(id, source) {
+  /** Uploads once per id; `wrap` therefore applies on first upload only.
+   *  An id is either a pattern tile or a shader texture, never both. */
+  upload(id, source, wrap = "clamp") {
     if (this.map.has(id)) return id;
     const gl = this.gl;
     const tex = gl.createTexture();
     if (!tex) throw new Error(`GLTextureCache: createTexture failed for id="${id}"`);
+    const wrapMode = wrap === "repeat" ? gl.REPEAT : gl.CLAMP_TO_EDGE;
     gl.bindTexture(gl.TEXTURE_2D, tex);
     gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, source);
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
-    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
-    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
+    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, wrapMode);
+    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, wrapMode);
     gl.bindTexture(gl.TEXTURE_2D, null);
     this.map.set(id, tex);
     return id;
@@ -3987,6 +4510,18 @@ function scale(m, sx, sy) {
   const s = create(sx, 0, 0, sy, 0, 0);
   return multiply2(m, s);
 }
+function invert(m) {
+  const a = m[0], b = m[1];
+  const c = m[3], d = m[4];
+  const tx = m[6], ty = m[7];
+  const det = a * d - b * c;
+  if (det === 0 || !Number.isFinite(det)) return identity();
+  const ia = d / det;
+  const ib = -b / det;
+  const ic = -c / det;
+  const id = a / det;
+  return create(ia, ib, ic, id, -(ia * tx + ic * ty), -(ib * tx + id * ty));
+}
 function apply(m, x, y) {
   const a = m[0], b = m[1];
   const c = m[3], d = m[4];
@@ -4014,6 +4549,7 @@ var mat3 = {
   multiply: multiply2,
   translate: translate2,
   scale,
+  invert,
   apply,
   screenToClip
 };
@@ -5033,7 +5569,7 @@ function warnMissingGlyphOnce(family, cp) {
     `weasel layoutRuns: no glyph for U+${cp.toString(16).toUpperCase().padStart(4, "0")} (${JSON.stringify(ch)}) in "${family}", and the dynamic tier could not rasterize it \u2014 skipping the character. Bake it into the atlas, or call registerCanvasFont("${family}") to serve missing codepoints from installed fonts.`
   );
 }
-function layoutRuns(runs, opts, origin) {
+function layoutRuns(runs, opts) {
   const ctx = { groups: /* @__PURE__ */ new Map() };
   const entries = [];
   let prevCp;
@@ -5203,7 +5739,7 @@ function layoutRuns(runs, opts, origin) {
     }
   }
   const lineBoxes = [];
-  let penY = origin.y;
+  let penY = 0;
   let maxLineWidth = 0;
   const finiteWidth = Number.isFinite(opts.maxWidth) ? opts.maxWidth : 0;
   for (const line of lines) {
@@ -5215,7 +5751,7 @@ function layoutRuns(runs, opts, origin) {
       const slack = finiteWidth - line.width;
       return opts.align === "center" ? slack / 2 : slack;
     })();
-    const lineX0 = origin.x + alignShift;
+    const lineX0 = alignShift;
     const baselineSource = line.entries[0] ?? line.blank;
     const lineBaselineY = baselineSource ? penY + baselineSource.font.common.base * (baselineSource.fontSize / baselineSource.font.info.size) : penY;
     let penX = lineX0;
@@ -5289,7 +5825,7 @@ function layoutRuns(runs, opts, origin) {
     groups: [...ctx.groups.values()],
     decorations,
     lines: lineBoxes,
-    bounds: { width: maxLineWidth, height: penY - origin.y }
+    bounds: { width: maxLineWidth, height: penY }
   };
 }
 var LAYOUT_CACHE_VARIANT_LIMIT = 8;
@@ -5302,10 +5838,10 @@ function outlineBucket(runs, min) {
   for (const size of sizes) if (size >= min) n++;
   return n;
 }
-function variantKey2(runs, opts, origin) {
-  return `${opts.maxWidth}|${opts.lineHeight}|${opts.align}|${outlineBucket(runs, opts.outlineMinSize)}|${origin.x}|${origin.y}`;
+function variantKey2(runs, opts) {
+  return `${opts.maxWidth}|${opts.lineHeight}|${opts.align}|${outlineBucket(runs, opts.outlineMinSize)}`;
 }
-function cachedLayoutRuns(runs, opts, origin) {
+function cachedLayoutRuns(runs, opts) {
   const fonts = glyphGeneration();
   let entry = cache2.get(runs);
   if (entry === void 0) {
@@ -5315,10 +5851,10 @@ function cachedLayoutRuns(runs, opts, origin) {
     entry.generation = fonts;
     entry.byVariant.clear();
   }
-  const key = variantKey2(runs, opts, origin);
+  const key = variantKey2(runs, opts);
   const hit = entry.byVariant.get(key);
   if (hit !== void 0) return hit;
-  const laid = layoutRuns(runs, opts, origin);
+  const laid = layoutRuns(runs, opts);
   if (entry.byVariant.size >= LAYOUT_CACHE_VARIANT_LIMIT) entry.byVariant.clear();
   entry.byVariant.set(key, laid);
   return laid;
@@ -5626,25 +6162,264 @@ function outlineStrokeMesh(glyphKey, d, emWidth, stroke) {
   cache4.set(key, mesh);
   return mesh.indices.length === 0 ? null : mesh;
 }
-function setColorMatrixUniforms(ctx, prog) {
-  const gl = ctx.gl;
-  const cm = ctx.state.colorMatrix;
-  const m4 = new Float32Array(16);
-  for (let row = 0; row < 4; row++) {
-    for (let col = 0; col < 4; col++) {
-      m4[col * 4 + row] = cm[row * 5 + col];
+var MAX_VERTICES_PER_BATCH = 32768;
+var FLOATS_PER_VERTEX = 6;
+var INITIAL_VERTICES = 256;
+var INITIAL_INDICES = 384;
+var SolidBatch = class {
+  gl;
+  vao;
+  vbo;
+  ibo;
+  verts = new Float32Array(INITIAL_VERTICES * FLOATS_PER_VERTEX);
+  idx = new Uint32Array(INITIAL_INDICES);
+  nVerts = 0;
+  nIdx = 0;
+  /** What the GPU buffers are currently sized for. */
+  vboVerts = 0;
+  iboIdx = 0;
+  constructor(gl, prog) {
+    const aPos = prog.attribute("a_position");
+    const aColor = prog.attribute("a_vertexColor");
+    if (aPos === void 0 || aColor === void 0) {
+      throw new Error("SolidBatch: vertex-color program is missing a_position / a_vertexColor");
+    }
+    const vao = gl.createVertexArray();
+    const vbo = gl.createBuffer();
+    const ibo = gl.createBuffer();
+    if (!vao || !vbo || !ibo) throw new Error("SolidBatch: failed to create GL objects");
+    this.gl = gl;
+    this.vao = vao;
+    this.vbo = vbo;
+    this.ibo = ibo;
+    const stride = FLOATS_PER_VERTEX * 4;
+    gl.bindVertexArray(vao);
+    gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
+    gl.enableVertexAttribArray(aPos);
+    gl.vertexAttribPointer(aPos, 2, gl.FLOAT, false, stride, 0);
+    gl.enableVertexAttribArray(aColor);
+    gl.vertexAttribPointer(aColor, 4, gl.FLOAT, false, stride, 8);
+    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, ibo);
+    gl.bindVertexArray(null);
+    this.growGpu(INITIAL_VERTICES, INITIAL_INDICES);
+  }
+  get length() {
+    return this.nIdx;
+  }
+  /** Whether staging `vertices` more would put the run past the per-flush cap. */
+  wouldOverflow(vertices) {
+    return this.nVerts + vertices > MAX_VERTICES_PER_BATCH;
+  }
+  /**
+   * Append one rect's four corners through `m`, all carrying `rgba` (straight
+   * alpha). An affine maps a rect to a parallelogram, so two triangles still
+   * cover it and the batch draws at `u_model` identity.
+   */
+  pushRect(x, y, w, h, m, r, g, b, a) {
+    this.reserve(4, 6);
+    const v = this.verts;
+    let i = this.nVerts * FLOATS_PER_VERTEX;
+    const ma = m[0], mb = m[1], mc = m[3], md = m[4], mtx = m[6], mty = m[7];
+    const x1 = x + w;
+    const y1 = y + h;
+    const ax = ma * x + mc * y + mtx, ay = mb * x + md * y + mty;
+    const bx = ma * x1 + mc * y + mtx, by = mb * x1 + md * y + mty;
+    const cx = ma * x1 + mc * y1 + mtx, cy = mb * x1 + md * y1 + mty;
+    const dx = ma * x + mc * y1 + mtx, dy = mb * x + md * y1 + mty;
+    v[i++] = ax;
+    v[i++] = ay;
+    v[i++] = r;
+    v[i++] = g;
+    v[i++] = b;
+    v[i++] = a;
+    v[i++] = bx;
+    v[i++] = by;
+    v[i++] = r;
+    v[i++] = g;
+    v[i++] = b;
+    v[i++] = a;
+    v[i++] = cx;
+    v[i++] = cy;
+    v[i++] = r;
+    v[i++] = g;
+    v[i++] = b;
+    v[i++] = a;
+    v[i++] = dx;
+    v[i++] = dy;
+    v[i++] = r;
+    v[i++] = g;
+    v[i++] = b;
+    v[i++] = a;
+    const base = this.nVerts;
+    let j = this.nIdx;
+    this.idx[j++] = base;
+    this.idx[j++] = base + 1;
+    this.idx[j++] = base + 2;
+    this.idx[j++] = base;
+    this.idx[j++] = base + 2;
+    this.idx[j++] = base + 3;
+    this.nVerts += 4;
+    this.nIdx += 6;
+  }
+  /**
+   * Append a tessellated mesh through `m`, all vertices carrying `rgba`. The
+   * mesh's own indices are rebased onto the staged vertices, which is why the
+   * index buffer is uploaded per flush rather than written once.
+   */
+  pushMesh(mesh, m, r, g, b, a) {
+    const src = mesh.vertices;
+    const srcIdx = mesh.indices;
+    const n = src.length >> 1;
+    this.reserve(n, srcIdx.length);
+    const v = this.verts;
+    let i = this.nVerts * FLOATS_PER_VERTEX;
+    const ma = m[0], mb = m[1], mc = m[3], md = m[4], mtx = m[6], mty = m[7];
+    for (let k = 0; k < n; k++) {
+      const x = src[k * 2];
+      const y = src[k * 2 + 1];
+      v[i++] = ma * x + mc * y + mtx;
+      v[i++] = mb * x + md * y + mty;
+      v[i++] = r;
+      v[i++] = g;
+      v[i++] = b;
+      v[i++] = a;
+    }
+    const base = this.nVerts;
+    const out = this.idx;
+    let j = this.nIdx;
+    for (let k = 0; k < srcIdx.length; k++) out[j++] = base + srcIdx[k];
+    this.nVerts += n;
+    this.nIdx += srcIdx.length;
+  }
+  /** Upload the staged geometry and bind the batch VAO. Returns the index
+   *  count for the caller's `drawElements`. */
+  uploadAndBind() {
+    const gl = this.gl;
+    if (this.nVerts > this.vboVerts || this.nIdx > this.iboIdx) {
+      this.growGpu(this.nVerts, this.nIdx);
+    }
+    gl.bindVertexArray(this.vao);
+    gl.bindBuffer(gl.ARRAY_BUFFER, this.vbo);
+    gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.verts, 0, this.nVerts * FLOATS_PER_VERTEX);
+    gl.bufferSubData(gl.ELEMENT_ARRAY_BUFFER, 0, this.idx, 0, this.nIdx);
+    return this.nIdx;
+  }
+  reset() {
+    this.nVerts = 0;
+    this.nIdx = 0;
+  }
+  dispose() {
+    const gl = this.gl;
+    gl.deleteBuffer(this.vbo);
+    gl.deleteBuffer(this.ibo);
+    gl.deleteVertexArray(this.vao);
+  }
+  /** Grow the CPU arrays so `vertices` / `indices` more fit. */
+  reserve(vertices, indices) {
+    const needVerts = (this.nVerts + vertices) * FLOATS_PER_VERTEX;
+    if (needVerts > this.verts.length) {
+      let len = this.verts.length;
+      while (len < needVerts) len *= 2;
+      const grown = new Float32Array(len);
+      grown.set(this.verts);
+      this.verts = grown;
+    }
+    const needIdx = this.nIdx + indices;
+    if (needIdx > this.idx.length) {
+      let len = this.idx.length;
+      while (len < needIdx) len *= 2;
+      const grown = new Uint32Array(len);
+      grown.set(this.idx);
+      this.idx = grown;
+    }
+  }
+  /** Size both GPU buffers for at least what is staged, doubling to amortize. */
+  growGpu(vertices, indices) {
+    const gl = this.gl;
+    if (vertices > this.vboVerts) {
+      let capacity = Math.max(this.vboVerts, INITIAL_VERTICES);
+      while (capacity < vertices) capacity *= 2;
+      gl.bindBuffer(gl.ARRAY_BUFFER, this.vbo);
+      gl.bufferData(gl.ARRAY_BUFFER, capacity * FLOATS_PER_VERTEX * 4, gl.DYNAMIC_DRAW);
+      this.vboVerts = capacity;
+    }
+    if (indices > this.iboIdx) {
+      let capacity = Math.max(this.iboIdx, INITIAL_INDICES);
+      while (capacity < indices) capacity *= 2;
+      gl.bindVertexArray(this.vao);
+      gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.ibo);
+      gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, capacity * 4, gl.DYNAMIC_DRAW);
+      gl.bindVertexArray(null);
+      this.iboIdx = capacity;
     }
   }
+};
+var FRAME_UPLOADS = /* @__PURE__ */ new WeakMap();
+var FRAME_PROJ = /* @__PURE__ */ new WeakMap();
+function uploadedFor(ctx, prog) {
+  let byProgram = FRAME_UPLOADS.get(ctx);
+  if (!byProgram) {
+    byProgram = /* @__PURE__ */ new WeakMap();
+    FRAME_UPLOADS.set(ctx, byProgram);
+  }
+  let uploaded = byProgram.get(prog);
+  if (!uploaded) {
+    uploaded = {};
+    byProgram.set(prog, uploaded);
+  }
+  return uploaded;
+}
+function sameValues(prev, next) {
+  if (prev === void 0 || prev.length !== next.length) return false;
+  for (let i = 0; i < prev.length; i++) if (prev[i] !== next[i]) return false;
+  return true;
+}
+var BATCH_MODEL = mat3.identity();
+function projFor(ctx) {
+  let proj = FRAME_PROJ.get(ctx);
+  if (!proj) {
+    proj = mat3.screenToClip(ctx.widthCss, ctx.heightCss);
+    FRAME_PROJ.set(ctx, proj);
+  }
+  return proj;
+}
+var COLOR_MATRIX_SCRATCH = new Float32Array(16);
+function setColorMatrixUniforms(ctx, prog, cm = ctx.state.colorMatrix) {
+  const gl = ctx.gl;
+  const uploaded = uploadedFor(ctx, prog);
   const mLoc = prog.uniform("u_colorMatrix");
+  if (mLoc !== void 0) {
+    for (let row = 0; row < 4; row++) {
+      for (let col = 0; col < 4; col++) {
+        COLOR_MATRIX_SCRATCH[col * 4 + row] = cm[row * 5 + col];
+      }
+    }
+    if (!sameValues(uploaded.colorMatrix, COLOR_MATRIX_SCRATCH)) {
+      gl.uniformMatrix4fv(mLoc, false, COLOR_MATRIX_SCRATCH);
+      uploaded.colorMatrix = Float32Array.from(COLOR_MATRIX_SCRATCH);
+    }
+  }
   const bLoc = prog.uniform("u_colorBias");
-  if (mLoc !== void 0) gl.uniformMatrix4fv(mLoc, false, m4);
-  if (bLoc !== void 0) gl.uniform4f(bLoc, cm[4], cm[9], cm[14], cm[19]);
+  if (bLoc !== void 0) {
+    const bias = [cm[4], cm[9], cm[14], cm[19]];
+    if (!sameValues(uploaded.colorBias, bias)) {
+      gl.uniform4f(bLoc, bias[0], bias[1], bias[2], bias[3]);
+      uploaded.colorBias = Float32Array.from(bias);
+    }
+  }
 }
-function fillMeshHandle(ctx, path) {
+function fillMesh(ctx, path) {
   if (ctx.flattenTolerance !== void 0) {
-    return ctx.meshCache.uploadTransient(tessellate(path, { flattenTolerance: ctx.flattenTolerance }));
+    return tessellate(path, { flattenTolerance: ctx.flattenTolerance });
   }
-  return ctx.meshCache.handleFor(getMesh(path));
+  return getMesh(path);
+}
+function meshHandle(ctx, mesh) {
+  if (ctx.flattenTolerance !== void 0) return ctx.meshCache.uploadTransient(mesh);
+  return ctx.meshCache.handleFor(mesh);
+}
+function fillMeshHandle(ctx, path) {
+  return meshHandle(ctx, fillMesh(ctx, path));
 }
 function dispatch(ctx, cmd) {
   switch (cmd.kind) {
@@ -5653,10 +6428,13 @@ function dispatch(ctx, cmd) {
     case "path":
       return drawPath(ctx, cmd);
     case "text":
+      flushSolids(ctx);
       return drawText(ctx, cmd);
     case "image":
+      flushSolids(ctx);
       return drawImage(ctx, cmd);
     case "shader":
+      flushSolids(ctx);
       return drawShader(ctx, cmd);
   }
 }
@@ -5785,11 +6563,13 @@ function drawGroup(ctx, cmd) {
         "weasel: clip nesting depth exceeded (max 7). You can't nest more than 7 levels of clipped containers in a single draw tree. Flatten the hierarchy or compose poses outside the scene graph."
       );
     }
+    flushSolids(ctx);
     pushClip(ctx, cmd.clip, newDepth);
     ctx.clipDepth = newDepth;
   }
   for (const child of cmd.children) dispatch(ctx, child);
   if (cmd.clip) {
+    flushSolids(ctx);
     popClip(ctx, cmd.clip, ctx.clipDepth - 1);
     ctx.clipDepth -= 1;
   }
@@ -5798,38 +6578,98 @@ function drawGroup(ctx, cmd) {
 function drawPath(ctx, cmd) {
   if (!cmd.fill && !cmd.stroke) return;
   if (cmd.fill) {
-    const isSolidRectFast = cmd.path.kind === "rect" && (cmd.fill.fill === void 0 || cmd.fill.fill === "solid") && (!cmd.vertexColors || cmd.vertexColors.length === 0) && ctx.rectVao !== null && ctx.rectVbo !== null;
-    if (isSolidRectFast && cmd.path.kind === "rect") {
-      drawRectFast(ctx, cmd.path, cmd.fill);
+    const batchablePaint = (cmd.fill.fill === void 0 || cmd.fill.fill === "solid") && (!cmd.vertexColors || cmd.vertexColors.length === 0);
+    const solid = cmd.fill;
+    if (batchablePaint && cmd.path.kind === "rect") {
+      pushRect(ctx, cmd.path, solid);
     } else {
-      const handle = fillMeshHandle(ctx, cmd.path);
-      if (cmd.vertexColors && cmd.vertexColors.length > 0 && (cmd.fill.fill === void 0 || cmd.fill.fill === "solid")) {
-        drawPathFillVColor(ctx, cmd, cmd.fill, handle);
-      } else if (handle.requiresStencil) {
-        drawPathFillStencil(ctx, cmd.fill, handle);
+      const mesh = fillMesh(ctx, cmd.path);
+      if (batchablePaint && canBatchMesh(mesh)) {
+        pushMesh(ctx, mesh, solid);
       } else {
-        drawPathFillByKind(ctx, cmd.fill, handle);
+        flushSolids(ctx);
+        const handle = meshHandle(ctx, mesh);
+        if (cmd.vertexColors && cmd.vertexColors.length > 0 && (cmd.fill.fill === void 0 || cmd.fill.fill === "solid")) {
+          drawPathFillVColor(ctx, cmd, solid, handle);
+        } else if (handle.requiresStencil) {
+          drawPathFillStencil(ctx, cmd.fill, handle);
+        } else {
+          drawPathFillByKind(ctx, cmd.fill, handle);
+        }
       }
     }
   }
-  if (cmd.stroke) {
-    drawPathStroke(ctx, cmd);
+  if (cmd.stroke) drawPathStroke(ctx, cmd);
+}
+function isIdentityColorMatrix(cm) {
+  return cm === IDENTITY_COLOR_MATRIX || sameValues(IDENTITY_COLOR_MATRIX, cm);
+}
+function stagedStateIsLive(ctx, staged) {
+  if (staged.clipDepth !== ctx.clipDepth) return false;
+  if (!staged.foldsAlpha && staged.alpha !== ctx.state.alpha) return false;
+  const colorMatrix = ctx.state.colorMatrix;
+  return staged.colorMatrix === colorMatrix || sameValues(staged.colorMatrix, colorMatrix);
+}
+var MAX_BATCHED_MESH_VERTICES = 256;
+function canBatchMesh(mesh) {
+  return !mesh.requiresStencil && mesh.vertices.length >> 1 <= MAX_BATCHED_MESH_VERTICES;
+}
+function stageSolid(ctx, vertices) {
+  if (ctx.solidState !== void 0 && !stagedStateIsLive(ctx, ctx.solidState)) flushSolids(ctx);
+  if (ctx.solidBatch.wouldOverflow(vertices)) flushSolids(ctx);
+  if (ctx.solidState === void 0) {
+    const colorMatrix = ctx.state.colorMatrix;
+    const foldsAlpha = isIdentityColorMatrix(colorMatrix);
+    ctx.solidState = {
+      alpha: foldsAlpha ? 1 : ctx.state.alpha,
+      colorMatrix,
+      clipDepth: ctx.clipDepth,
+      foldsAlpha
+    };
   }
+  return ctx.solidState;
+}
+function stagedColor(ctx, staged, paint) {
+  const [r, g, b, a] = resolveColor(paint.color);
+  return [r, g, b, a * (paint.opacity ?? 1) * (staged.foldsAlpha ? ctx.state.alpha : 1)];
+}
+function pushRect(ctx, rect, fill) {
+  const staged = stageSolid(ctx, 4);
+  const [r, g, b, a] = stagedColor(ctx, staged, fill);
+  ctx.solidBatch.pushRect(
+    rect.x,
+    rect.y,
+    rect.width,
+    rect.height,
+    ctx.state.transform,
+    r,
+    g,
+    b,
+    a
+  );
+}
+function pushMesh(ctx, mesh, paint) {
+  const staged = stageSolid(ctx, mesh.vertices.length >> 1);
+  const [r, g, b, a] = stagedColor(ctx, staged, paint);
+  ctx.solidBatch.pushMesh(mesh, ctx.state.transform, r, g, b, a);
 }
-function drawRectFast(ctx, rect, fill) {
+function flushSolids(ctx) {
+  const batch = ctx.solidBatch;
+  const staged = ctx.solidState;
+  if (batch.length === 0 || staged === void 0) return;
   const gl = ctx.gl;
-  const { x, y, width: w, height: h } = rect;
-  const corners = new Float32Array([x, y, x + w, y, x + w, y + h, x, y + h]);
-  gl.useProgram(ctx.pathFill.handle);
-  gl.bindVertexArray(ctx.rectVao);
-  gl.bindBuffer(gl.ARRAY_BUFFER, ctx.rectVbo);
-  gl.bufferSubData(gl.ARRAY_BUFFER, 0, corners);
-  setProjAndModel(ctx, ctx.pathFill);
-  setSolidPaintUniforms(ctx, ctx.pathFill, fill.color, fill.opacity);
-  setColorMatrixUniforms(ctx, ctx.pathFill);
-  applyClipTest(ctx);
-  gl.drawElements(gl.TRIANGLES, 6, gl.UNSIGNED_INT, 0);
+  const prog = ctx.pathFillVColor;
+  gl.useProgram(prog.handle);
+  const indexCount = batch.uploadAndBind();
+  setProjAndModel(ctx, prog, BATCH_MODEL);
+  gl.uniform4f(prog.uniform("u_color"), 1, 1, 1, 1);
+  gl.uniform1f(prog.uniform("u_alpha"), staged.alpha);
+  setColorMatrixUniforms(ctx, prog, staged.colorMatrix);
+  applyClipTest(ctx, staged.clipDepth);
+  gl.drawElements(gl.TRIANGLES, indexCount, gl.UNSIGNED_INT, 0);
   gl.bindVertexArray(null);
+  batch.reset();
+  ctx.solidState = void 0;
 }
 function expandAnchorColors(perAnchor, handle) {
   const aA = handle.anchorA;
@@ -5874,11 +6714,18 @@ function drawPathFillVColor(ctx, cmd, fill, handle) {
   gl.bindVertexArray(null);
   gl.deleteBuffer(colorVbo);
 }
-function setProjAndModel(ctx, prog) {
+function setProjAndModel(ctx, prog, model = ctx.state.transform) {
   const gl = ctx.gl;
-  const proj = mat3.screenToClip(ctx.widthCss, ctx.heightCss);
-  gl.uniformMatrix3fv(prog.uniform("u_proj"), false, proj);
-  gl.uniformMatrix3fv(prog.uniform("u_model"), false, ctx.state.transform);
+  const uploaded = uploadedFor(ctx, prog);
+  const proj = projFor(ctx);
+  if (!sameValues(uploaded.proj, proj)) {
+    gl.uniformMatrix3fv(prog.uniform("u_proj"), false, proj);
+    uploaded.proj = Float32Array.from(proj);
+  }
+  if (!sameValues(uploaded.model, model)) {
+    gl.uniformMatrix3fv(prog.uniform("u_model"), false, model);
+    uploaded.model = Float32Array.from(model);
+  }
 }
 function setSolidPaintUniforms(ctx, prog, color, opacity) {
   const gl = ctx.gl;
@@ -5916,28 +6763,42 @@ function drawPathFillPattern(ctx, fill, handle) {
     if (isDev3) console.warn(`weasel: pattern TextureHandle "${tex.id}" not registered`);
     return;
   }
-  ctx.textureCache.upload(tex.id, entry.source);
+  ctx.textureCache.upload(tex.id, entry.source, "repeat");
   const gl = ctx.gl;
-  gl.useProgram(ctx.imageFill.handle);
+  gl.useProgram(ctx.patternFill.handle);
   gl.bindVertexArray(handle.vao);
-  setProjAndModel(ctx, ctx.imageFill);
-  setColorMatrixUniforms(ctx, ctx.imageFill);
+  setProjAndModel(ctx, ctx.patternFill);
+  setColorMatrixUniforms(ctx, ctx.patternFill);
+  gl.uniformMatrix3fv(ctx.patternFill.uniform("u_worldInv"), false, gradientSpaceInverse(ctx, fill.units));
+  const [tw, th] = textureSize(entry.source);
+  const origin = fill.origin ?? { x: 0, y: 0 };
+  gl.uniform2f(ctx.patternFill.uniform("u_tileOrigin"), origin.x, origin.y);
+  gl.uniform2f(ctx.patternFill.uniform("u_tileSize"), tw, th);
   ctx.textureCache.bind(tex.id, 0);
-  gl.uniform1i(ctx.imageFill.uniform("u_sampler"), 0);
-  gl.uniform1f(ctx.imageFill.uniform("u_opacity"), fill.opacity ?? 1);
-  gl.uniform1f(ctx.imageFill.uniform("u_alpha"), ctx.state.alpha);
+  gl.uniform1i(ctx.patternFill.uniform("u_sampler"), 0);
+  gl.uniform1f(ctx.patternFill.uniform("u_opacity"), fill.opacity ?? 1);
+  gl.uniform1f(ctx.patternFill.uniform("u_alpha"), ctx.state.alpha);
   applyClipTest(ctx);
   gl.drawElements(gl.TRIANGLES, handle.indexCount, gl.UNSIGNED_INT, 0);
   gl.bindVertexArray(null);
 }
+function textureSize(source) {
+  const w = "naturalWidth" in source ? source.naturalWidth : source.width;
+  const h = "naturalHeight" in source ? source.naturalHeight : source.height;
+  return [w || 1, h || 1];
+}
+function gradientSpaceInverse(ctx, units) {
+  if (units === "local") return mat3.invert(ctx.state.transform);
+  if (units === "world" && ctx.viewMatrix) return mat3.invert(ctx.viewMatrix);
+  return mat3.identity();
+}
 function drawPathFillGradient(ctx, fill, handle) {
   const gl = ctx.gl;
   const key = ctx.gradRampCache.upload(fill.stops);
   gl.useProgram(ctx.gradFill.handle);
   gl.bindVertexArray(handle.vao);
   setProjAndModel(ctx, ctx.gradFill);
-  const identity3 = new Float32Array([1, 0, 0, 0, 1, 0, 0, 0, 1]);
-  gl.uniformMatrix3fv(ctx.gradFill.uniform("u_worldInv"), false, identity3);
+  gl.uniformMatrix3fv(ctx.gradFill.uniform("u_worldInv"), false, gradientSpaceInverse(ctx, fill.units));
   ctx.gradRampCache.bind(key, 0);
   gl.uniform1i(ctx.gradFill.uniform("u_ramp"), 0);
   gl.uniform1f(ctx.gradFill.uniform("u_alpha"), ctx.state.alpha);
@@ -5971,9 +6832,8 @@ function drawPathFillGradient(ctx, fill, handle) {
   gl.drawElements(gl.TRIANGLES, handle.indexCount, gl.UNSIGNED_INT, 0);
   gl.bindVertexArray(null);
 }
-function applyClipTest(ctx) {
+function applyClipTest(ctx, depth = ctx.clipDepth) {
   const gl = ctx.gl;
-  const depth = ctx.clipDepth;
   if (depth === 0) {
     gl.disable(gl.STENCIL_TEST);
     return;
@@ -6057,6 +6917,7 @@ function drawPathStroke(ctx, cmd) {
   }
   const align = stroke.align ?? "center";
   if (cmd.path.kind === "polygon" && align !== "center") {
+    flushSolids(ctx);
     drawPathStrokeStenciled(ctx, cmd, align);
     return;
   }
@@ -6067,6 +6928,12 @@ function drawPathStrokeUnclipped(ctx, cmd) {
   const solid = stroke.paint;
   const mesh = tessellateStroke(cmd.path, stroke, { flattenTolerance: ctx.flattenTolerance });
   if (mesh.indices.length === 0) return;
+  const hasVColors = !!(stroke.vertexColors && stroke.vertexColors.length > 0);
+  if (!hasVColors && canBatchMesh(mesh)) {
+    pushMesh(ctx, mesh, solid);
+    return;
+  }
+  flushSolids(ctx);
   const handle = ctx.meshCache.uploadTransient(mesh);
   const gl = ctx.gl;
   if (stroke.vertexColors && stroke.vertexColors.length > 0) {
@@ -6164,20 +7031,17 @@ function drawText(ctx, cmd) {
   const maxWidth = cmd.maxWidth ?? Infinity;
   const minScreen = ctx.textOutlineMinScreenSize ?? OUTLINE_MIN_SCREEN_PX;
   const outlineMinSize = Number.isFinite(minScreen) ? minScreen / modelScale(ctx.state.transform) : void 0;
-  const laid = cachedLayoutRuns(
-    cmd.runs,
-    { maxWidth, lineHeight, align, outlineMinSize },
-    { x: cmd.x, y: cmd.y }
-  );
+  const laid = cachedLayoutRuns(cmd.runs, { maxWidth, lineHeight, align, outlineMinSize });
   if (laid.groups.length === 0 && laid.decorations.length === 0) return;
-  const dy = verticalAlignOffset(cmd.verticalAlign, cmd.height, laid.bounds.height);
+  const dx = cmd.x;
+  const dy = cmd.y + verticalAlignOffset(cmd.verticalAlign, cmd.height, laid.bounds.height);
   const gl = ctx.gl;
   applyClipTest(ctx);
   const preparedPrograms = /* @__PURE__ */ new Set();
   let currentProg = null;
   for (const group of laid.groups) {
     if (group.source === "outline") {
-      drawTextOutlineGroup(ctx, group, dy);
+      drawTextOutlineGroup(ctx, group, dx, dy);
       currentProg = null;
       continue;
     }
@@ -6192,31 +7056,31 @@ function drawText(ctx, cmd) {
       setColorMatrixUniforms(ctx, prog);
       gl.uniform1f(prog.uniform("u_alpha"), ctx.state.alpha);
     }
-    drawTextGroup(ctx, group, prog, dy);
+    drawTextGroup(ctx, group, prog, dx, dy);
   }
-  drawTextDecorations(ctx, laid.decorations, dy);
+  drawTextDecorations(ctx, laid.decorations, dx, dy);
 }
 var SYNTHETIC_ITALIC_RADIANS = 0.2094;
-function drawTextOutlineGroup(ctx, group, dy) {
-  const mesh = outlineGroupMesh(group, dy);
+function drawTextOutlineGroup(ctx, group, dx, dy) {
+  const mesh = outlineGroupMesh(group, dx, dy);
   if (mesh) drawPathFillByKind(ctx, group.fill, ctx.meshCache.uploadTransient(mesh));
   if (!group.stroke) return;
-  const strokeMesh = outlineGroupStrokeMesh(group, dy);
+  const strokeMesh = outlineGroupStrokeMesh(group, dx, dy);
   if (strokeMesh) {
     drawPathFillByKind(ctx, group.stroke.paint, ctx.meshCache.uploadTransient(strokeMesh));
   }
 }
-function outlineGroupMesh(group, dy) {
-  return mergeGlyphMeshes(group, dy, (glyph) => outlineMesh(glyph.key, glyph.d));
+function outlineGroupMesh(group, dx, dy) {
+  return mergeGlyphMeshes(group, dx, dy, (glyph) => outlineMesh(glyph.key, glyph.d));
 }
-function outlineGroupStrokeMesh(group, dy) {
+function outlineGroupStrokeMesh(group, dx, dy) {
   const stroke = group.stroke;
   if (!stroke) return null;
   const width = stroke.width ?? 1;
   if (!(width > 0)) return null;
-  return mergeGlyphMeshes(group, dy, (glyph) => glyph.scale > 0 ? outlineStrokeMesh(glyph.key, glyph.d, quantizeEmWidth(width / glyph.scale), stroke) : null);
+  return mergeGlyphMeshes(group, dx, dy, (glyph) => glyph.scale > 0 ? outlineStrokeMesh(glyph.key, glyph.d, quantizeEmWidth(width / glyph.scale), stroke) : null);
 }
-function mergeGlyphMeshes(group, dy, meshFor) {
+function mergeGlyphMeshes(group, dx, dy, meshFor) {
   const parts = [];
   let vertexFloats = 0;
   let indexCount = 0;
@@ -6239,7 +7103,7 @@ function mergeGlyphMeshes(group, dy, meshFor) {
     for (let k = 0; k < mesh.vertices.length; k += 2) {
       const ex = mesh.vertices[k];
       const ey = mesh.vertices[k + 1];
-      vertices[vi++] = x + (ex - ey * shear) * scale2;
+      vertices[vi++] = x + dx + (ex - ey * shear) * scale2;
       vertices[vi++] = baselineY + dy + ey * scale2;
     }
     for (let k = 0; k < mesh.indices.length; k++) indices[ii++] = base + mesh.indices[k];
@@ -6247,7 +7111,7 @@ function mergeGlyphMeshes(group, dy, meshFor) {
   }
   return { vertices, indices };
 }
-function drawTextDecorations(ctx, decorations, dy) {
+function drawTextDecorations(ctx, decorations, dx, dy) {
   if (decorations.length === 0) return;
   const batches = /* @__PURE__ */ new Map();
   for (const d of decorations) {
@@ -6270,14 +7134,15 @@ function drawTextDecorations(ctx, decorations, dy) {
     const vertices = new Float32Array(rects.length * 4 * 2);
     let vi = 0;
     for (const d of rects) {
+      const dx0 = d.x0 + dx, dx1 = d.x1 + dx;
       const dy0 = d.y0 + dy, dy1 = d.y1 + dy;
-      vertices[vi++] = d.x0;
+      vertices[vi++] = dx0;
       vertices[vi++] = dy0;
-      vertices[vi++] = d.x1;
+      vertices[vi++] = dx1;
       vertices[vi++] = dy0;
-      vertices[vi++] = d.x0;
+      vertices[vi++] = dx0;
       vertices[vi++] = dy1;
-      vertices[vi++] = d.x1;
+      vertices[vi++] = dx1;
       vertices[vi++] = dy1;
     }
     const indices = new Uint32Array(rects.length * 6);
@@ -6316,7 +7181,7 @@ function drawTextDecorations(ctx, decorations, dy) {
     gl.deleteBuffer(ibo);
   }
 }
-function drawTextGroup(ctx, group, prog, dy) {
+function drawTextGroup(ctx, group, prog, dx, dy) {
   if (group.source === "canvas") {
     if (!syncDynamicPageTexture(ctx.textureCache, group.page)) return;
   } else {
@@ -6327,23 +7192,24 @@ function drawTextGroup(ctx, group, prog, dy) {
   const vertices = new Float32Array(group.quads.length * 4 * 5);
   let vi = 0;
   for (const q of group.quads) {
+    const x0 = q.x0 + dx, x1 = q.x1 + dx;
     const y0 = q.y0 + dy, y1 = q.y1 + dy, by = q.baselineY + dy;
-    vertices[vi++] = q.x0;
+    vertices[vi++] = x0;
     vertices[vi++] = y0;
     vertices[vi++] = q.u0;
     vertices[vi++] = q.v0;
     vertices[vi++] = by;
-    vertices[vi++] = q.x1;
+    vertices[vi++] = x1;
     vertices[vi++] = y0;
     vertices[vi++] = q.u1;
     vertices[vi++] = q.v0;
     vertices[vi++] = by;
-    vertices[vi++] = q.x0;
+    vertices[vi++] = x0;
     vertices[vi++] = y1;
     vertices[vi++] = q.u0;
     vertices[vi++] = q.v1;
     vertices[vi++] = by;
-    vertices[vi++] = q.x1;
+    vertices[vi++] = x1;
     vertices[vi++] = y1;
     vertices[vi++] = q.u1;
     vertices[vi++] = q.v1;
@@ -6457,6 +7323,11 @@ function drawImage(ctx, cmd) {
   setProjAndModel(ctx, ctx.imageFill);
   setColorMatrixUniforms(ctx, ctx.imageFill);
   ctx.imageCache.bind(cmd.image, 0);
+  gl.texParameteri(
+    gl.TEXTURE_2D,
+    gl.TEXTURE_MAG_FILTER,
+    cmd.sampling === "nearest" ? gl.NEAREST : gl.LINEAR
+  );
   gl.uniform1i(ctx.imageFill.uniform("u_sampler"), 0);
   gl.uniform1f(ctx.imageFill.uniform("u_opacity"), cmd.opacity ?? 1);
   gl.uniform1f(ctx.imageFill.uniform("u_alpha"), ctx.state.alpha);
@@ -6543,6 +7414,7 @@ var WeaselRenderer = class {
   textSdfR8;
   imageFill;
   gradFill;
+  patternFill;
   meshCache;
   textureCache;
   imageCache;
@@ -6550,10 +7422,7 @@ var WeaselRenderer = class {
   programRegistry = /* @__PURE__ */ new Map();
   quadVbo = null;
   quadIbo = null;
-  /** Shared rect-fill geometry: 4 verts × 2 floats (dynamic), 6-index static IBO. */
-  rectVao = null;
-  rectVbo = null;
-  rectIbo = null;
+  solidBatch;
   groupState = new GroupState();
   widthCss;
   heightCss;
@@ -6618,6 +7487,9 @@ var WeaselRenderer = class {
     this.gradFill = new ShaderProgram(this.gl, GRAD_VERT_SRC, GRAD_FRAG_SRC);
     this.gradFill.lookupUniforms(GRAD_FILL_UNIFORMS);
     this.gradFill.lookupAttributes(GRAD_FILL_ATTRIBUTES);
+    this.patternFill = new ShaderProgram(this.gl, PATTERN_VERT_SRC, PATTERN_FRAG_SRC);
+    this.patternFill.lookupUniforms(PATTERN_FILL_UNIFORMS);
+    this.patternFill.lookupAttributes(PATTERN_FILL_ATTRIBUTES);
     const aPos = this.pathFill.attribute("a_position");
     if (aPos === void 0) throw new Error("WeaselRenderer: a_position not found in path-fill shader");
     this.meshCache = new GLMeshCache(this.gl, aPos);
@@ -6625,31 +7497,7 @@ var WeaselRenderer = class {
     this.imageCache = new GLImageCache(this.gl, this.imageMinification);
     this.gradRampCache = new GradientRampCache(this.gl);
     this.uploadQuadGeometry();
-    this.uploadRectGeometry(aPos);
-  }
-  /** Allocate the shared rect VAO + dynamic VBO (4 verts × 2 floats) + static
-   *  IBO (6 indices). drawRectFast bufferSubData's the 4 corner coords each
-   *  draw, avoiding per-rect buffer allocation in animated demos. */
-  uploadRectGeometry(aPositionLoc) {
-    const gl = this.gl;
-    this.rectVao = gl.createVertexArray();
-    this.rectVbo = gl.createBuffer();
-    this.rectIbo = gl.createBuffer();
-    if (!this.rectVao || !this.rectVbo || !this.rectIbo) {
-      throw new Error("WeaselRenderer: failed to create rect-fast geometry");
-    }
-    gl.bindVertexArray(this.rectVao);
-    gl.bindBuffer(gl.ARRAY_BUFFER, this.rectVbo);
-    gl.bufferData(gl.ARRAY_BUFFER, 8 * 4, gl.DYNAMIC_DRAW);
-    gl.enableVertexAttribArray(aPositionLoc);
-    gl.vertexAttribPointer(aPositionLoc, 2, gl.FLOAT, false, 0, 0);
-    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.rectIbo);
-    gl.bufferData(
-      gl.ELEMENT_ARRAY_BUFFER,
-      new Uint32Array([0, 1, 2, 0, 2, 3]),
-      gl.STATIC_DRAW
-    );
-    gl.bindVertexArray(null);
+    this.solidBatch = new SolidBatch(this.gl, this.pathFillVColor);
   }
   uploadQuadGeometry() {
     const gl = this.gl;
@@ -6726,6 +7574,9 @@ var WeaselRenderer = class {
     this.gradFill = new ShaderProgram(this.gl, GRAD_VERT_SRC, GRAD_FRAG_SRC);
     this.gradFill.lookupUniforms(GRAD_FILL_UNIFORMS);
     this.gradFill.lookupAttributes(GRAD_FILL_ATTRIBUTES);
+    this.patternFill = new ShaderProgram(this.gl, PATTERN_VERT_SRC, PATTERN_FRAG_SRC);
+    this.patternFill.lookupUniforms(PATTERN_FILL_UNIFORMS);
+    this.patternFill.lookupAttributes(PATTERN_FILL_ATTRIBUTES);
     const aPos = this.pathFill.attribute("a_position");
     if (aPos === void 0) throw new Error("a_position missing after restore");
     this.meshCache = new GLMeshCache(this.gl, aPos);
@@ -6733,7 +7584,7 @@ var WeaselRenderer = class {
     this.imageCache = new GLImageCache(this.gl, this.imageMinification);
     this.gradRampCache = new GradientRampCache(this.gl);
     this.uploadQuadGeometry();
-    this.uploadRectGeometry(aPos);
+    this.solidBatch = new SolidBatch(this.gl, this.pathFillVColor);
     for (const id of this.programRegistry.keys()) {
       const src = getProgramSource(id);
       if (!src) continue;
@@ -6793,11 +7644,17 @@ var WeaselRenderer = class {
     this.gradRampCache.free();
     if (this.quadVbo) gl.deleteBuffer(this.quadVbo);
     if (this.quadIbo) gl.deleteBuffer(this.quadIbo);
-    if (this.rectVbo) gl.deleteBuffer(this.rectVbo);
-    if (this.rectIbo) gl.deleteBuffer(this.rectIbo);
-    if (this.rectVao) gl.deleteVertexArray(this.rectVao);
+    this.solidBatch.dispose();
   }
-  render(commands) {
+  /**
+   * Draw one frame.
+   *
+   * `viewMatrix` is the frame's world→screen transform. It is only consulted
+   * by `units: 'world'` gradients, which fall back to screen space without
+   * it — every other command carries its own transform in the stream, so
+   * callers with no view concept can keep calling `render(commands)`.
+   */
+  render(commands, viewMatrix) {
     if (this.contextLost || this.disposed) return;
     const gl = this.gl;
     this.meshCache.drainPendingDeletes();
@@ -6812,6 +7669,7 @@ var WeaselRenderer = class {
       textSdfR8: this.textSdfR8,
       imageFill: this.imageFill,
       gradFill: this.gradFill,
+      patternFill: this.patternFill,
       meshCache: this.meshCache,
       textureCache: this.textureCache,
       imageCache: this.imageCache,
@@ -6819,16 +7677,17 @@ var WeaselRenderer = class {
       programRegistry: this.programRegistry,
       quadVbo: this.quadVbo,
       quadIbo: this.quadIbo,
-      rectVao: this.rectVao,
-      rectVbo: this.rectVbo,
+      solidBatch: this.solidBatch,
       state: this.groupState,
       widthCss: this.widthCss,
       heightCss: this.heightCss,
       clipDepth: 0,
       flattenTolerance: this.flattenTolerance,
-      textOutlineMinScreenSize: this.textOutlineMinScreenSize
+      textOutlineMinScreenSize: this.textOutlineMinScreenSize,
+      viewMatrix
     };
     for (const cmd of commands) dispatch(ctx, cmd);
+    flushSolids(ctx);
     this.meshCache.freeTransient();
   }
   resize(dims) {
@@ -6858,6 +7717,10 @@ var WeaselRenderer = class {
     return this.pathFillVColor;
   }
   /** @internal */
+  _solidBatch() {
+    return this.solidBatch;
+  }
+  /** @internal */
   _textSdf() {
     return this.textSdf;
   }
@@ -6874,6 +7737,10 @@ var WeaselRenderer = class {
     return this.gradFill;
   }
   /** @internal */
+  _patternFill() {
+    return this.patternFill;
+  }
+  /** @internal */
   _meshCache() {
     return this.meshCache;
   }
@@ -6934,6 +7801,9 @@ function alignedStrokeRect(rect, align, width = 1) {
     height: rect.height + 2 * d
   };
 }
+function meanScale(s) {
+  return Math.sqrt(s.x * s.y);
+}
 var DEFAULT_LINE = {
   paint: { fill: "solid", color: "rgba(255, 255, 255, 0.08)" },
   width: 1
@@ -7074,374 +7944,136 @@ var DEFAULT_DEVICE_PROFILE = resolveDeviceProfile({
   coarsePointer: false,
   canHover: true,
   dpr: 1
-});
-var COARSE_QUERY = "(pointer: coarse)";
-var HOVER_QUERY = "(hover: hover)";
-function hasMatchMedia() {
-  return typeof window !== "undefined" && typeof window.matchMedia === "function";
-}
-function detectOnce() {
-  const dpr = typeof window !== "undefined" && window.devicePixelRatio || 1;
-  if (!hasMatchMedia()) {
-    return {
-      coarsePointer: DEFAULT_DEVICE_PROFILE.coarsePointer,
-      canHover: DEFAULT_DEVICE_PROFILE.canHover,
-      dpr
-    };
-  }
-  return {
-    coarsePointer: window.matchMedia(COARSE_QUERY).matches,
-    canHover: window.matchMedia(HOVER_QUERY).matches,
-    dpr
-  };
-}
-function useDetectedFacts() {
-  const [facts, setFacts] = useState(detectOnce);
-  useEffect(() => {
-    if (!hasMatchMedia()) return;
-    const coarseMq = window.matchMedia(COARSE_QUERY);
-    const hoverMq = window.matchMedia(HOVER_QUERY);
-    const onCoarse = (e) => setFacts((f) => ({ ...f, coarsePointer: e.matches }));
-    const onHover = (e) => setFacts((f) => ({ ...f, canHover: e.matches }));
-    coarseMq.addEventListener("change", onCoarse);
-    hoverMq.addEventListener("change", onHover);
-    let disposed = false;
-    let densityMq = null;
-    const onDensity = () => {
-      if (disposed) return;
-      const next = window.devicePixelRatio || 1;
-      setFacts((f) => f.dpr === next ? f : { ...f, dpr: next });
-      arm();
-    };
-    function arm() {
-      if (disposed) return;
-      densityMq?.removeEventListener("change", onDensity);
-      densityMq = window.matchMedia(
-        `(resolution: ${window.devicePixelRatio || 1}dppx)`
-      );
-      densityMq.addEventListener("change", onDensity);
-    }
-    arm();
-    setFacts({
-      coarsePointer: coarseMq.matches,
-      canHover: hoverMq.matches,
-      dpr: window.devicePixelRatio || 1
-    });
-    return () => {
-      disposed = true;
-      coarseMq.removeEventListener("change", onCoarse);
-      hoverMq.removeEventListener("change", onHover);
-      densityMq?.removeEventListener("change", onDensity);
-    };
-  }, []);
-  return facts;
-}
-var DeviceProfileContext = createContext(null);
-function useDeviceProfile(overrides) {
-  const provided = useContext(DeviceProfileContext);
-  const detected = useDetectedFacts();
-  const base = provided ?? detected;
-  const { coarsePointer: coarsePointer2, canHover: canHover2, dpr, targetScale } = overrides ?? {};
-  return useMemo(
-    () => resolveDeviceProfile(base, {
-      ...coarsePointer2 !== void 0 ? { coarsePointer: coarsePointer2 } : {},
-      ...canHover2 !== void 0 ? { canHover: canHover2 } : {},
-      ...dpr !== void 0 ? { dpr } : {},
-      ...targetScale !== void 0 ? { targetScale } : {}
-    }),
-    [base.coarsePointer, base.canHover, base.dpr, coarsePointer2, canHover2, dpr, targetScale]
-  );
-}
-function DeviceProfileProvider({ value, children }) {
-  const profile = useDeviceProfile(value);
-  return createElement(DeviceProfileContext.Provider, { value: profile }, children);
-}
-var HANDLE_BASE_PX = 8;
-var ANCHOR_HIT_BASE_PX = 8;
-var ROTATION_HANDLE_BASE_PX = 24;
-function zoomAt(view, anchor, factor, opts) {
-  const fx = typeof factor === "number" ? factor : factor.x;
-  const fy = typeof factor === "number" ? factor : factor.y;
-  const minX = typeof opts?.min === "number" ? opts.min : opts?.min?.x ?? 0.1;
-  const minY = typeof opts?.min === "number" ? opts.min : opts?.min?.y ?? 0.1;
-  const maxX = typeof opts?.max === "number" ? opts.max : opts?.max?.x ?? 8;
-  const maxY = typeof opts?.max === "number" ? opts.max : opts?.max?.y ?? 8;
-  const nextX = Math.min(maxX, Math.max(minX, view.scale.x * fx));
-  const nextY = Math.min(maxY, Math.max(minY, view.scale.y * fy));
-  const worldX = anchor.x / view.scale.x + view.x;
-  const worldY = anchor.y / view.scale.y + view.y;
-  return {
-    scale: { x: nextX, y: nextY },
-    x: worldX - anchor.x / nextX,
-    y: worldY - anchor.y / nextY
-  };
-}
-function clampView(view, bounds, canvas) {
-  const visW = canvas.width / view.scale.x;
-  const visH = canvas.height / view.scale.y;
-  let x;
-  if (visW >= bounds.width) {
-    x = bounds.x + (bounds.width - visW) / 2;
-  } else {
-    const minX = bounds.x;
-    const maxX = bounds.x + bounds.width - visW;
-    x = view.x < minX ? minX : view.x > maxX ? maxX : view.x;
-  }
-  let y;
-  if (visH >= bounds.height) {
-    y = bounds.y + (bounds.height - visH) / 2;
-  } else {
-    const minY = bounds.y;
-    const maxY = bounds.y + bounds.height - visH;
-    y = view.y < minY ? minY : view.y > maxY ? maxY : view.y;
-  }
-  return x === view.x && y === view.y ? view : { x, y, scale: view.scale };
-}
-function isEditableTarget2(target) {
-  if (!target || !(target instanceof Element)) return false;
-  const tag = target.tagName;
-  if (tag === "INPUT" || tag === "TEXTAREA") return true;
-  if (target.isContentEditable) return true;
-  const ce = target.getAttribute("contenteditable");
-  return ce === "true" || ce === "";
-}
-var DepRegistryContext = createContext(null);
-function DepRegistryProvider({ children }) {
-  const sourcesRef = useRef(/* @__PURE__ */ new Map());
-  const registry22 = useMemo(() => ({
-    register: (name, source) => {
-      sourcesRef.current.set(name, source);
-      return () => {
-        sourcesRef.current.delete(name);
-      };
-    },
-    get: (name) => sourcesRef.current.get(name)?.()
-  }), []);
-  return /* @__PURE__ */ jsx(DepRegistryContext.Provider, { value: registry22, children });
-}
-function useDepRegistry() {
-  const r = useContext(DepRegistryContext);
-  if (r === null) {
-    throw new Error("useDepRegistry: no DepRegistryProvider in scope. Wrap your tree with <DepRegistryProvider> (typically inside <SceneCanvas>).");
-  }
-  return r;
-}
-function useOptionalDepRegistry() {
-  return useContext(DepRegistryContext);
-}
-function useDepSource(name, source) {
-  const registry22 = useDepRegistry();
-  const sourceRef = useRef(source);
-  sourceRef.current = source;
-  useEffect(() => {
-    return registry22.register(name, () => sourceRef.current());
-  }, [name, registry22]);
-}
-var DEV = (() => {
-  try {
-    return Boolean(import.meta.env?.DEV);
-  } catch {
-    return false;
-  }
-})();
-function buildDepsFromRequires(action, depRegistry) {
-  const requires = action.requires ?? [];
-  const entries = requires.map((name) => [name, depRegistry.get(name)]);
-  const deps = Object.fromEntries(entries);
-  if (DEV) {
-    const declared = new Set(requires);
-    return new Proxy(deps, {
-      get(target, prop, receiver) {
-        if (typeof prop === "string" && !declared.has(prop) && prop !== "then") {
-          const message = `[weasel:dispatcher] action "${action.id}" read deps.${prop} but did not declare it in \`requires\`. Add \`requires: [...'${prop}']\` to the descriptor or the dep will be undefined at runtime.`;
-          console.warn(message);
-          throw new Error(message);
-        }
-        return Reflect.get(target, prop, receiver);
-      }
-    });
-  }
-  return deps;
-}
-var ActionDisabledReason = {
-  SelectionRequired: "selection-required",
-  NotApplicable: "not-applicable",
-  /** Sentinel: the predicate threw. Surfaced by `evaluateEnabled`'s catch. */
-  PredicateThrew: "predicate-threw"
-};
-var enabledSlowWarned = /* @__PURE__ */ new Set();
-var enabledThrewWarned = /* @__PURE__ */ new Set();
-var ENABLED_BUDGET_MS = 4;
-function evaluateEnabled(action, deps) {
-  if (!action.enabled) return { enabled: true };
-  const isDev3 = typeof process !== "undefined" ? process.env.NODE_ENV !== "production" : true;
-  const now = typeof performance !== "undefined" && typeof performance.now === "function" ? () => performance.now() : () => Date.now();
-  const start = isDev3 ? now() : 0;
-  try {
-    const result = action.enabled(deps);
-    if (isDev3) {
-      const elapsed = now() - start;
-      if (elapsed > ENABLED_BUDGET_MS && !enabledSlowWarned.has(action.id)) {
-        enabledSlowWarned.add(action.id);
-        console.warn(
-          `weasel actions: enabled() for action "${action.id}" took ${elapsed.toFixed(2)}ms (budget ${ENABLED_BUDGET_MS}ms). The predicate must be pure and fast \u2014 see Action.enabled JSDoc.`
-        );
-      }
-    }
-    if (result === true) return { enabled: true };
-    return { enabled: false, reason: result };
-  } catch (e) {
-    if (isDev3 && !enabledThrewWarned.has(action.id)) {
-      enabledThrewWarned.add(action.id);
-      console.warn(
-        `weasel actions: enabled() for action "${action.id}" threw; treating as disabled. The predicate must not throw \u2014 see Action.enabled JSDoc.`,
-        e
-      );
-    }
-    return { enabled: false, reason: ActionDisabledReason.PredicateThrew };
-  }
-}
-function validateActionId(id) {
-  if (id.length === 0) {
-    throw new Error(`weasel: action id may not be empty`);
-  }
-  if (RESERVED_ID_PREFIXES.has(id[0])) {
-    throw new Error(
-      `weasel: action id "${id}" starts with reserved sigil "${id[0]}" (reserved set: ${[...RESERVED_ID_PREFIXES].join(" ")})`
-    );
-  }
-  if (RESERVED_ID_NAMES.has(id)) {
-    throw new Error(
-      `weasel: action id "${id}" collides with a reserved phase keyword (reserved: ${[...RESERVED_ID_NAMES].join(", ")})`
-    );
-  }
-}
-function validateActionDefaultBinding(action) {
-  const gs = action.defaultBinding;
-  if (!gs) return;
-  const entries = Array.isArray(gs) ? gs : [gs];
-  for (const entry of entries) {
-    const spec = "kind" in entry ? entry : entry.spec;
-    const phase = spec.phase;
-    if (phase === void 0) continue;
-    const atoms = Array.isArray(phase) ? phase : [{ channel: "&", phase }];
-    for (const atom of atoms) {
-      if (atom.channel === "&") {
-        throw new Error(
-          `weasel: action "${action.id}" defaultBinding uses '&' channel which has no owning tool to resolve to. Use a named tool channel (e.g. '[rect:engaged]') or '*' instead, or move this binding to the tool's own Tool.bindings.`
-        );
-      }
-    }
-  }
-}
-var ActionsContext = createContext(null);
-function ActionsProvider({ children }) {
-  const actionsRef = useRef(/* @__PURE__ */ new Map());
-  const versionRef = useRef(0);
-  const cachedRef = useRef([]);
-  const cachedVerRef = useRef(-1);
-  const listenersRef = useRef(/* @__PURE__ */ new Set());
-  const depReg = useOptionalDepRegistry();
-  const depRegRef = useRef(depReg);
-  depRegRef.current = depReg;
-  const wiredDepRegRef = useRef(null);
-  const dispatcherRef = useRef(null);
-  const registry22 = useMemo(() => {
-    const snapshot = () => {
-      const v = versionRef.current;
-      if (cachedVerRef.current === v) return cachedRef.current;
-      const out = Object.freeze(Array.from(actionsRef.current.values()));
-      cachedRef.current = out;
-      cachedVerRef.current = v;
-      return out;
-    };
-    const notify2 = () => {
-      for (const l of listenersRef.current) {
-        try {
-          l();
-        } catch (err) {
-          console.error("weasel ActionsRegistry: subscriber threw", err);
-        }
-      }
-    };
-    return {
-      register: (action) => {
-        validateActionId(action.id);
-        validateActionDefaultBinding(action);
-        actionsRef.current.set(action.id, action);
-        versionRef.current++;
-        notify2();
-        return () => {
-          const cur = actionsRef.current.get(action.id);
-          if (cur === action) {
-            actionsRef.current.delete(action.id);
-            versionRef.current++;
-            notify2();
-          }
-        };
-      },
-      unregister: (id) => {
-        if (actionsRef.current.delete(id)) {
-          versionRef.current++;
-          notify2();
-        }
-      },
-      list: () => snapshot(),
-      trigger: (id, params) => {
-        const a = actionsRef.current.get(id);
-        if (!a) return false;
-        try {
-          if (a.invoker && a.invoker.timing === "immediate") {
-            const r = wiredDepRegRef.current ?? depRegRef.current;
-            const deps = !r ? {} : a.requires ? buildDepsFromRequires(a, r) : {
-              selection: r.get("selection"),
-              scene: r.get("scene"),
-              history: r.get("history"),
-              view: r.get("view"),
-              pointer: r.get("pointer"),
-              activeTool: r.get("activeTool"),
-              booleansAdapter: r.get("booleansAdapter")
-            };
-            a.invoker.run(deps, params);
-          }
-        } catch (err) {
-          console.error(`weasel ActionsRegistry: action "${id}" threw`, err);
-        }
-        return true;
-      },
-      subscribe: (listener) => {
-        listenersRef.current.add(listener);
-        return () => {
-          listenersRef.current.delete(listener);
-        };
-      },
-      setDispatcher: (d) => {
-        dispatcherRef.current = d;
-      },
-      setDepRegistry: (r) => {
-        wiredDepRegRef.current = r;
-      },
-      begin: (id, params) => {
-        const disp = dispatcherRef.current;
-        if (!disp) return null;
-        const r = wiredDepRegRef.current ?? depRegRef.current;
-        const deps = r ? {
-          selection: r.get("selection"),
-          scene: r.get("scene"),
-          history: r.get("history"),
-          view: r.get("view"),
-          pointer: r.get("pointer"),
-          activeTool: r.get("activeTool"),
-          booleansAdapter: r.get("booleansAdapter")
-        } : {};
-        return disp.beginUiOngoing(id, deps, params);
-      }
+});
+var COARSE_QUERY = "(pointer: coarse)";
+var HOVER_QUERY = "(hover: hover)";
+function hasMatchMedia() {
+  return typeof window !== "undefined" && typeof window.matchMedia === "function";
+}
+function detectOnce() {
+  const dpr = typeof window !== "undefined" && window.devicePixelRatio || 1;
+  if (!hasMatchMedia()) {
+    return {
+      coarsePointer: DEFAULT_DEVICE_PROFILE.coarsePointer,
+      canHover: DEFAULT_DEVICE_PROFILE.canHover,
+      dpr
+    };
+  }
+  return {
+    coarsePointer: window.matchMedia(COARSE_QUERY).matches,
+    canHover: window.matchMedia(HOVER_QUERY).matches,
+    dpr
+  };
+}
+function useDetectedFacts() {
+  const [facts, setFacts] = useState(detectOnce);
+  useEffect(() => {
+    if (!hasMatchMedia()) return;
+    const coarseMq = window.matchMedia(COARSE_QUERY);
+    const hoverMq = window.matchMedia(HOVER_QUERY);
+    const onCoarse = (e) => setFacts((f) => ({ ...f, coarsePointer: e.matches }));
+    const onHover = (e) => setFacts((f) => ({ ...f, canHover: e.matches }));
+    coarseMq.addEventListener("change", onCoarse);
+    hoverMq.addEventListener("change", onHover);
+    let disposed = false;
+    let densityMq = null;
+    const onDensity = () => {
+      if (disposed) return;
+      const next = window.devicePixelRatio || 1;
+      setFacts((f) => f.dpr === next ? f : { ...f, dpr: next });
+      arm();
+    };
+    function arm() {
+      if (disposed) return;
+      densityMq?.removeEventListener("change", onDensity);
+      densityMq = window.matchMedia(
+        `(resolution: ${window.devicePixelRatio || 1}dppx)`
+      );
+      densityMq.addEventListener("change", onDensity);
+    }
+    arm();
+    setFacts({
+      coarsePointer: coarseMq.matches,
+      canHover: hoverMq.matches,
+      dpr: window.devicePixelRatio || 1
+    });
+    return () => {
+      disposed = true;
+      coarseMq.removeEventListener("change", onCoarse);
+      hoverMq.removeEventListener("change", onHover);
+      densityMq?.removeEventListener("change", onDensity);
     };
   }, []);
-  return /* @__PURE__ */ jsx(ActionsContext.Provider, { value: registry22, children });
+  return facts;
 }
-function useActionsRegistry() {
-  return useContext(ActionsContext);
+var DeviceProfileContext = createContext(null);
+function useDeviceProfile(overrides) {
+  const provided = useContext(DeviceProfileContext);
+  const detected = useDetectedFacts();
+  const base = provided ?? detected;
+  const { coarsePointer: coarsePointer2, canHover: canHover2, dpr, targetScale } = overrides ?? {};
+  return useMemo(
+    () => resolveDeviceProfile(base, {
+      ...coarsePointer2 !== void 0 ? { coarsePointer: coarsePointer2 } : {},
+      ...canHover2 !== void 0 ? { canHover: canHover2 } : {},
+      ...dpr !== void 0 ? { dpr } : {},
+      ...targetScale !== void 0 ? { targetScale } : {}
+    }),
+    [base.coarsePointer, base.canHover, base.dpr, coarsePointer2, canHover2, dpr, targetScale]
+  );
+}
+function DeviceProfileProvider({ value, children }) {
+  const profile = useDeviceProfile(value);
+  return createElement(DeviceProfileContext.Provider, { value: profile }, children);
+}
+var HANDLE_BASE_PX = 8;
+var ANCHOR_HIT_BASE_PX = 8;
+var ROTATION_HANDLE_BASE_PX = 24;
+function zoomAt(view, anchor, factor, opts) {
+  const fx = typeof factor === "number" ? factor : factor.x;
+  const fy = typeof factor === "number" ? factor : factor.y;
+  const minX = typeof opts?.min === "number" ? opts.min : opts?.min?.x ?? 0.1;
+  const minY = typeof opts?.min === "number" ? opts.min : opts?.min?.y ?? 0.1;
+  const maxX = typeof opts?.max === "number" ? opts.max : opts?.max?.x ?? 8;
+  const maxY = typeof opts?.max === "number" ? opts.max : opts?.max?.y ?? 8;
+  const nextX = Math.min(maxX, Math.max(minX, view.scale.x * fx));
+  const nextY = Math.min(maxY, Math.max(minY, view.scale.y * fy));
+  const worldX = anchor.x / view.scale.x + view.x;
+  const worldY = anchor.y / view.scale.y + view.y;
+  return {
+    scale: { x: nextX, y: nextY },
+    x: worldX - anchor.x / nextX,
+    y: worldY - anchor.y / nextY
+  };
+}
+function clampView(view, bounds, canvas) {
+  const visW = canvas.width / view.scale.x;
+  const visH = canvas.height / view.scale.y;
+  let x;
+  if (visW >= bounds.width) {
+    x = bounds.x + (bounds.width - visW) / 2;
+  } else {
+    const minX = bounds.x;
+    const maxX = bounds.x + bounds.width - visW;
+    x = view.x < minX ? minX : view.x > maxX ? maxX : view.x;
+  }
+  let y;
+  if (visH >= bounds.height) {
+    y = bounds.y + (bounds.height - visH) / 2;
+  } else {
+    const minY = bounds.y;
+    const maxY = bounds.y + bounds.height - visH;
+    y = view.y < minY ? minY : view.y > maxY ? maxY : view.y;
+  }
+  return x === view.x && y === view.y ? view : { x, y, scale: view.scale };
+}
+function isEditableTarget2(target) {
+  if (!target || !(target instanceof Element)) return false;
+  const tag = target.tagName;
+  if (tag === "INPUT" || tag === "TEXTAREA") return true;
+  if (target.isContentEditable) return true;
+  const ce = target.getAttribute("contenteditable");
+  return ce === "true" || ce === "";
 }
 function resolveParams(params) {
   if (params === void 0) return void 0;
@@ -7474,12 +8106,7 @@ function moveGestureAdapter(scene) {
   return {
     getNode: (id) => scene.get(asNodeId(id)),
     getNodes: () => {
-      const out = [];
-      for (const id of scene.renderOrder()) {
-        const n = scene.get(id);
-        if (n) out.push(n);
-      }
-      return out;
+      return [...scene.renderOrderNodes()];
     },
     getPose: (id) => scene.get(asNodeId(id)).pose,
     getParent: (id) => scene.get(asNodeId(id))?.parent ?? null,
@@ -7977,6 +8604,60 @@ var moveAction = {
    */
   enabled: () => true
 };
+function poseRotationOf(pose) {
+  const p = pose;
+  if (p.rotation && p.x != null && p.y != null && p.width != null && p.height != null) {
+    return { cx: p.x + p.width / 2, cy: p.y + p.height / 2, rotation: p.rotation };
+  }
+  return null;
+}
+function rotatePathAround(path, cx, cy, rotation) {
+  if (path.kind === "rect") {
+    return rotateRectCorners(path.x, path.y, path.width, path.height, cx, cy, rotation);
+  }
+  return rotatePolygon(path, cx, cy, rotation);
+}
+function rotatePolygon(path, cx, cy, rotation) {
+  const cos = Math.cos(rotation);
+  const sin = Math.sin(rotation);
+  const { commands, coords } = path;
+  const next = new Float32Array(coords.length);
+  let ci = 0;
+  for (let i = 0; i < commands.length; i++) {
+    const len = COORD_COUNT3[commands[i]];
+    for (let k = 0; k < len; k += 2) {
+      const dx = coords[ci + k] - cx;
+      const dy = coords[ci + k + 1] - cy;
+      next[ci + k] = cx + dx * cos - dy * sin;
+      next[ci + k + 1] = cy + dx * sin + dy * cos;
+    }
+    ci += len;
+  }
+  return { kind: "polygon", commands: path.commands, coords: next, fillRule: path.fillRule };
+}
+function rotateRectCorners(x, y, w, h, cx, cy, rotation) {
+  const cos = Math.cos(rotation);
+  const sin = Math.sin(rotation);
+  const rotate2 = (px, py) => {
+    const dx = px - cx;
+    const dy = py - cy;
+    return [cx + dx * cos - dy * sin, cy + dx * sin + dy * cos];
+  };
+  const [x0, y0] = rotate2(x, y);
+  const [x1, y1] = rotate2(x + w, y);
+  const [x2, y2] = rotate2(x + w, y + h);
+  const [x3, y3] = rotate2(x, y + h);
+  const commands = new Uint8Array([PATH_M2, PATH_L2, PATH_L2, PATH_L2, PATH_Z2]);
+  const coords = new Float32Array([x0, y0, x1, y1, x2, y2, x3, y3]);
+  return { kind: "polygon", commands, coords, fillRule: "nonzero" };
+}
+var COORD_COUNT3 = {
+  [PATH_M2]: 2,
+  [PATH_L2]: 2,
+  [PATH_C2]: 6,
+  [PATH_Q2]: 4,
+  [PATH_Z2]: 0
+};
 function aabbCenter(bounds) {
   return { x: bounds.x + bounds.width / 2, y: bounds.y + bounds.height / 2 };
 }
@@ -7991,12 +8672,7 @@ function defaultCommitAdapter(scene) {
   return {
     getNode: (id) => scene.get(asNodeId(id)),
     getNodes: () => {
-      const out = [];
-      for (const id of scene.renderOrder()) {
-        const n = scene.get(id);
-        if (n) out.push(n);
-      }
-      return out;
+      return [...scene.renderOrderNodes()];
     },
     getPose: (id) => scene.get(asNodeId(id)).pose,
     getParent: (id) => scene.get(asNodeId(id))?.parent ?? null,
@@ -8269,6 +8945,13 @@ var resizeAction = {
           const computePose = (id) => {
             const sp = scratch.startPoses.get(id);
             if (sp === void 0) return void 0;
+            if (isGroupPath && poseRotationOf(sp) !== null) {
+              return remapRotatedLeaf(
+                sp,
+                scratch.originBounds,
+                proposedBounds
+              );
+            }
             return scratch.geometry.remapBounds(sp, scratch.originBounds, proposedBounds);
           };
           scratch.previews.clear();
@@ -8889,9 +9572,9 @@ var clearSelectionAction = {
     return true;
   }
 };
-var counter = 0;
+var counter2 = 0;
 function freshNodeId() {
-  return asNodeId(`n${(counter++).toString(36)}-${Math.random().toString(36).slice(2, 8)}`);
+  return asNodeId(`n${(counter2++).toString(36)}-${Math.random().toString(36).slice(2, 8)}`);
 }
 function translatePose(pose, dx, dy) {
   const p = pose;
@@ -9108,7 +9791,13 @@ function makeViewportZoomAction(opts = {}) {
   };
 }
 makeViewportZoomAction();
-var isBody = (_target, bodyTarget) => bodyTarget === "selected-body" || bodyTarget === "unselected-body";
+function bodyPredicate(fn) {
+  return Object.assign(fn, { readsAffordance: false });
+}
+var isBody = bodyPredicate((_target, bodyTarget) => bodyTarget === "selected-body" || bodyTarget === "unselected-body");
+bodyPredicate((_target, bodyTarget) => bodyTarget === "selected-body");
+bodyPredicate((_target, bodyTarget) => bodyTarget === "unselected-body");
+bodyPredicate((_target, bodyTarget) => bodyTarget === "empty");
 function kindOf(target) {
   if (typeof target !== "object" || target === null) return void 0;
   const k = target.kind;
@@ -9147,17 +9836,17 @@ function splitCubicAtT(p0, p1, p2, p3, t) {
 function fitCubicThroughDeletion(prev, next) {
   const dx = next.x - prev.x;
   const dy = next.y - prev.y;
-  const dist4 = Math.sqrt(dx * dx + dy * dy);
+  const dist3 = Math.sqrt(dx * dx + dy * dy);
   const c1DirX = prev.outHandle ? prev.outHandle.x - prev.x : dx;
   const c1DirY = prev.outHandle ? prev.outHandle.y - prev.y : dy;
-  const c1 = controlOnSide(prev, c1DirX, c1DirY, dist4, 1 / 3);
+  const c1 = controlOnSide(prev, c1DirX, c1DirY, dist3, 1 / 3);
   const c2DirX = next.inHandle ? next.inHandle.x - next.x : -dx;
   const c2DirY = next.inHandle ? next.inHandle.y - next.y : -dy;
-  const c2 = controlOnSide(next, c2DirX, c2DirY, dist4, 1 / 3);
+  const c2 = controlOnSide(next, c2DirX, c2DirY, dist3, 1 / 3);
   return { c1, c2 };
 }
-function controlOnSide(anchor, dirX, dirY, dist4, fraction) {
-  const targetDist = dist4 * fraction;
+function controlOnSide(anchor, dirX, dirY, dist3, fraction) {
+  const targetDist = dist3 * fraction;
   const len = Math.hypot(dirX, dirY) || 1;
   const ux = dirX / len, uy = dirY / len;
   return { x: anchor.x + ux * targetDist, y: anchor.y + uy * targetDist };
@@ -9414,60 +10103,6 @@ function anchorsInRect(set, rect) {
   }
   return hits;
 }
-function poseRotationOf(pose) {
-  const p = pose;
-  if (p.rotation && p.x != null && p.y != null && p.width != null && p.height != null) {
-    return { cx: p.x + p.width / 2, cy: p.y + p.height / 2, rotation: p.rotation };
-  }
-  return null;
-}
-function rotatePathAround(path, cx, cy, rotation) {
-  if (path.kind === "rect") {
-    return rotateRectCorners(path.x, path.y, path.width, path.height, cx, cy, rotation);
-  }
-  return rotatePolygon(path, cx, cy, rotation);
-}
-function rotatePolygon(path, cx, cy, rotation) {
-  const cos = Math.cos(rotation);
-  const sin = Math.sin(rotation);
-  const { commands, coords } = path;
-  const next = new Float32Array(coords.length);
-  let ci = 0;
-  for (let i = 0; i < commands.length; i++) {
-    const len = COORD_COUNT3[commands[i]];
-    for (let k = 0; k < len; k += 2) {
-      const dx = coords[ci + k] - cx;
-      const dy = coords[ci + k + 1] - cy;
-      next[ci + k] = cx + dx * cos - dy * sin;
-      next[ci + k + 1] = cy + dx * sin + dy * cos;
-    }
-    ci += len;
-  }
-  return { kind: "polygon", commands: path.commands, coords: next, fillRule: path.fillRule };
-}
-function rotateRectCorners(x, y, w, h, cx, cy, rotation) {
-  const cos = Math.cos(rotation);
-  const sin = Math.sin(rotation);
-  const rotate2 = (px, py) => {
-    const dx = px - cx;
-    const dy = py - cy;
-    return [cx + dx * cos - dy * sin, cy + dx * sin + dy * cos];
-  };
-  const [x0, y0] = rotate2(x, y);
-  const [x1, y1] = rotate2(x + w, y);
-  const [x2, y2] = rotate2(x + w, y + h);
-  const [x3, y3] = rotate2(x, y + h);
-  const commands = new Uint8Array([PATH_M2, PATH_L2, PATH_L2, PATH_L2, PATH_Z2]);
-  const coords = new Float32Array([x0, y0, x1, y1, x2, y2, x3, y3]);
-  return { kind: "polygon", commands, coords, fillRule: "nonzero" };
-}
-var COORD_COUNT3 = {
-  [PATH_M2]: 2,
-  [PATH_L2]: 2,
-  [PATH_C2]: 6,
-  [PATH_Q2]: 4,
-  [PATH_Z2]: 0
-};
 function pathInPoseFrame(path, pose) {
   if (path.kind === "rect") {
     if (path.x === pose.x && path.y === pose.y && path.width === pose.width && path.height === pose.height) return path;
@@ -11020,7 +11655,7 @@ var LABEL = {
   divide: "Divide",
   crop: "Crop"
 };
-function isEmpty(p) {
+function isEmpty2(p) {
   return p.commands.length === 0;
 }
 function applyBooleanOp(adapter, op) {
@@ -11058,7 +11693,7 @@ function applyBooleanOp(adapter, op) {
       break;
     }
   }
-  results = results.filter((p) => !isEmpty(p));
+  results = results.filter((p) => !isEmpty2(p));
   if (results.length === 0) return { kind: "noop", reason: "empty-result" };
   const topmostId = entries[entries.length - 1].id;
   const topAnchor = adapter.getZOrder?.(topmostId);
@@ -11594,14 +12229,24 @@ var DEFAULT_PALETTE = [
   "#7ab8d4",
   "#d47a7a"
 ];
+function resolveFill(scratch, prev) {
+  if (scratch.currentPaint) return scratch.currentPaint;
+  const prevColor = typeof prev?.fill === "string" ? prev.fill : DEFAULT_FILL_COLOR;
+  return mergeAlphaFromPrev(scratch.currentColor, prevColor);
+}
 function refreshPreviews(scratch) {
   scratch.previews.clear();
   for (const id of scratch.ids) {
     const prev = scratch.startData.get(id);
-    const next = mergeAlphaFromPrev(scratch.currentColor, prev?.fill ?? DEFAULT_FILL_COLOR);
-    scratch.previews.set(id, { ...prev ?? {}, fill: next });
+    scratch.previews.set(id, { ...prev ?? {}, fill: resolveFill(scratch, prev) });
   }
 }
+function readParams(params) {
+  return {
+    color: params?.color,
+    paint: params?.paint
+  };
+}
 var setFillAction = {
   id: "setFill",
   label: "Set fill",
@@ -11615,10 +12260,11 @@ var setFillAction = {
       const applyOps = ctx.deps.applyOps;
       if (!selection || !scene) return {};
       const ids = selection.get();
-      if (ids.length === 0) return {};
-      const ctxColor = ctx.params?.color;
-      const optsColor = opts?.params?.color;
-      const initialColor = ctxColor ?? optsColor ?? DEFAULT_STROKE_COLOR;
+      if (ids.length === 0) return {};
+      const fromCtx = readParams(ctx.params);
+      const fromOpts = readParams(opts?.params);
+      const initialPaint = fromCtx.paint ?? fromOpts.paint;
+      const initialColor = fromCtx.color ?? fromOpts.color ?? DEFAULT_STROKE_COLOR;
       const startData = /* @__PURE__ */ new Map();
       for (const id of ids) {
         const node = scene.get(id);
@@ -11629,15 +12275,20 @@ var setFillAction = {
         scene,
         startData,
         currentColor: initialColor,
+        currentPaint: initialPaint,
         previews: /* @__PURE__ */ new Map(),
         applyOps
       };
       refreshPreviews(scratch);
       return {
         onMove(moveCtx) {
-          const next = moveCtx.params?.color;
-          if (next === void 0) return;
-          scratch.currentColor = next;
+          const { color, paint } = readParams(moveCtx.params);
+          if (color === void 0 && paint === void 0) return;
+          if (paint !== void 0) scratch.currentPaint = paint;
+          if (color !== void 0) {
+            scratch.currentColor = color;
+            if (paint === void 0) scratch.currentPaint = void 0;
+          }
           refreshPreviews(scratch);
         },
         onEnd(_endCtx, reason) {
@@ -11647,8 +12298,7 @@ var setFillAction = {
           }
           const ops = [];
           for (const id of scratch.ids) {
-            const prev = scratch.startData.get(id);
-            const merged = mergeAlphaFromPrev(scratch.currentColor, prev?.fill ?? DEFAULT_FILL_COLOR);
+            const merged = resolveFill(scratch, scratch.startData.get(id));
             const nodeNow = scratch.scene.get(id);
             if (!nodeNow) continue;
             const from = { ...nodeNow.data };
@@ -12503,13 +13153,82 @@ function modsCount(mods) {
 }
 function targetRank(target) {
   if (target === void 0) return 0;
-  if (typeof target !== "string") return 1;
-  if (target.startsWith("kind:")) return target.endsWith(":selected") ? 3 : 2;
-  if (target.startsWith("affordance:")) return 2;
-  return 1;
+  const form = parseTargetSpec(target);
+  if (form === null) return 1;
+  switch (form.form) {
+    case "kind":
+      return form.requireSelected ? 3 : 2;
+    case "affordance":
+      return 2;
+    case "body":
+      return 1;
+    case "predicate":
+      return 1;
+    default: {
+      return 1;
+    }
+  }
+}
+function targetConsultsAffordance(specTarget) {
+  if (specTarget === void 0) return false;
+  const form = parseTargetSpec(specTarget);
+  if (form === null) return false;
+  switch (form.form) {
+    case "predicate":
+      return form.kindOf.readsAffordance !== false;
+    case "affordance":
+      return true;
+    case "body":
+      return false;
+    case "kind":
+      return false;
+    default: {
+      return false;
+    }
+  }
+}
+function specTargetOf(spec) {
+  return "target" in spec ? spec.target : void 0;
+}
+function claimOf(e) {
+  return "affordance" in e ? e.affordance : void 0;
+}
+function claimGestureOf(e) {
+  switch (e.kind) {
+    case "pointerdown":
+    case "click":
+      return "pointer";
+    case "doubleclick":
+      return "doubleClick";
+    case "contextmenu":
+      return "contextMenu";
+    case "longpress":
+      return "longPress";
+    case "wheel":
+      return "wheel";
+    default:
+      return null;
+  }
+}
+function isExclusiveClaim(e) {
+  const claim = claimOf(e);
+  if (claim?.strength !== "exclusive") return false;
+  const gesture = claimGestureOf(e);
+  if (gesture === null) return false;
+  return claim.claimedKinds === void 0 || claim.claimedKinds.includes(gesture);
+}
+var warnedDeadClaims = /* @__PURE__ */ new Set();
+function reportDeadClaim(owner, warn) {
+  if (process.env.NODE_ENV === "production") return;
+  const key = String(owner);
+  if (warnedDeadClaims.has(key)) return;
+  warnedDeadClaims.add(key);
+  warn(
+    `[weasel] exclusive claim by "${key}" matched no binding: no \`affordance:\` or \`kindOf\` target resolved against it, so the press was dropped.`
+  );
 }
 function specificity(spec) {
-  const t = targetRank("target" in spec ? spec.target : void 0);
+  const t = targetRank(specTargetOf(spec));
   const mods = "mods" in spec ? spec.mods : void 0;
   const m = modsCount(mods);
   const p = "phase" in spec && spec.phase !== void 0 ? 1 : 0;
@@ -12524,12 +13243,14 @@ function compareSpecificity(a, b) {
   }
   return 0;
 }
-function matchSorted(e, bindings, isMac, engagedChannels) {
+function matchSorted(e, bindings, isMac, engagedChannels, warn = (m) => console.warn(m)) {
   const out = [];
   const engaged = engagedChannels ?? EMPTY_ENGAGED2;
+  const exclusive = isExclusiveClaim(e);
+  const pool = exclusive ? bindings.filter((sb) => targetConsultsAffordance(specTargetOf(sb.binding.spec))) : bindings;
   for (const scope of SCOPE_PRIORITY) {
     const scopeMatches = [];
-    for (const sb of bindings) {
+    for (const sb of pool) {
       if (sb.scope !== scope) continue;
       const phaseCtx = { selfChannel: sb.ownerToolId, engagedChannels: engaged };
       if (matchSpec(e, sb.binding.spec, isMac, phaseCtx)) {
@@ -12539,9 +13260,32 @@ function matchSorted(e, bindings, isMac, engagedChannels) {
     scopeMatches.sort((a, b) => compareSpecificity(a.binding.spec, b.binding.spec));
     out.push(...scopeMatches);
   }
+  if (exclusive && out.length === 0 && bindings.length > 0) {
+    reportDeadClaim(claimOf(e)?.owner, warn);
+  }
   return out;
 }
 var EMPTY_ENGAGED2 = /* @__PURE__ */ new Set();
+function liveScope(id, eligibility, state) {
+  const tags = eligibility.capabilities;
+  if (tags && tags.length > 0 && state.allows && !state.allows(tags)) return null;
+  if (state.engagedIds?.has(id)) return "hotkey";
+  if (eligibility.offhand && state.heldTriggers.has(eligibility.offhand)) return "hotkey";
+  if (eligibility.focus && state.focusedId === id) return "active";
+  if (eligibility.always || eligibility.claimed) return "ambient";
+  return null;
+}
+function scopeBindings(entries, state) {
+  const out = [];
+  for (const entry of entries) {
+    const scope = liveScope(entry.id, entry.eligibility ?? {}, state);
+    if (scope === null) continue;
+    for (const binding of entry.bindings ?? []) {
+      out.push({ binding, scope, ownerToolId: entry.id });
+    }
+  }
+  return out;
+}
 var ALWAYS = { all: [] };
 var NEVER = { any: [] };
 function isAllRule(r) {
@@ -12836,6 +13580,7 @@ function filterEligible(matches, actionLookup, ruleCtx) {
     return isEligible(action, ruleCtx);
   });
 }
+var EMPTY_TRIGGERS = /* @__PURE__ */ new Set();
 var EMPTY_ENGAGED22 = /* @__PURE__ */ new Set();
 function modifiersOf(e) {
   return { alt: e.altKey, ctrl: e.ctrlKey, meta: e.metaKey, shift: e.shiftKey };
@@ -12943,34 +13688,23 @@ function createDispatcher(opts) {
     return `ongoing-${event.kind}`;
   }
   function assembleScopedBindings(ctx) {
-    const result = [];
-    for (const toolId of ctx.hotkeyStack) {
-      const tool = ctx.toolsById.get(toolId);
-      for (const binding of tool?.bindings ?? []) {
-        result.push({ binding, scope: "hotkey", ownerToolId: toolId });
-      }
-    }
-    const activeTool = ctx.toolsById.get(ctx.activeToolId);
-    for (const binding of activeTool?.bindings ?? []) {
-      result.push({ binding, scope: "active", ownerToolId: ctx.activeToolId });
-    }
-    for (const toolId of ctx.ambientToolIds ?? []) {
-      const tool = ctx.toolsById.get(toolId);
-      for (const binding of tool?.bindings ?? []) {
-        result.push({ binding, scope: "ambient", ownerToolId: toolId });
-      }
-    }
+    const ordered = [];
+    for (const id of ctx.hotkeyStack) {
+      const tool = ctx.toolsById.get(id);
+      if (tool && !ordered.includes(tool)) ordered.push(tool);
+    }
+    for (const tool of ctx.toolsById.values()) {
+      if (!ordered.includes(tool)) ordered.push(tool);
+    }
+    const result = scopeBindings(ordered, {
+      focusedId: ctx.activeToolId,
+      heldTriggers: EMPTY_TRIGGERS,
+      engagedIds: new Set(ctx.hotkeyStack)
+    });
     for (const action of ctx.actions.list()) {
-      const gs = action.defaultBinding;
-      if (!gs) continue;
-      const raw = Array.isArray(gs) ? gs : [gs];
-      for (const entry of raw) {
-        const isBoundObj = !("kind" in entry);
-        const spec = isBoundObj ? entry.spec : entry;
-        const opts2 = isBoundObj ? entry.opts : void 0;
-        const defaultBinding = { spec, actionId: action.id, ...opts2 !== void 0 ? { opts: opts2 } : {} };
-        const targetScope = action.scope === "hotkey" ? "hotkey" : "ambient";
-        result.push({ binding: defaultBinding, scope: targetScope, ownerToolId: null });
+      const targetScope = action.scope === "hotkey" ? "hotkey" : "ambient";
+      for (const binding of actionBindings(action)) {
+        result.push({ binding, scope: targetScope, ownerToolId: null });
       }
     }
     return result;
@@ -13125,15 +13859,26 @@ function createDispatcher(opts) {
               deltaY: event.deltaY,
               clientX: event.clientX,
               clientY: event.clientY,
+              affordance: event.affordance,
               ...resolved
             };
           } else if (event.kind === "click" || event.kind === "doubleclick") {
             params = {
               worldX: event.worldX,
               worldY: event.worldY,
+              affordance: event.affordance,
               // Press point as well as release point — an action that places
               // geometry at the click wants the former. See `ClickEvent`.
-              ...event.kind === "click" ? { pressX: event.pressX, pressY: event.pressY, affordance: event.affordance } : {},
+              ...event.kind === "click" ? { pressX: event.pressX, pressY: event.pressY } : {},
+              mods: modifiersOf(event),
+              ...resolved
+            };
+          } else if (event.kind === "contextmenu" || event.kind === "longpress") {
+            params = {
+              worldX: event.kind === "contextmenu" ? event.worldX : event.x,
+              worldY: event.kind === "contextmenu" ? event.worldY : event.y,
+              affordance: event.affordance,
+              bodyTarget: event.bodyTarget,
               mods: modifiersOf(event),
               ...resolved
             };
@@ -13501,7 +14246,7 @@ function computeMultiTouchGeometry(positions) {
   return { centroid, spread };
 }
 function useGestureDispatcher(opts) {
-  const { canvasRef, actions, toolsById, ambientToolIds, enabled = true, keyboard = true, affordanceAt, classifyTarget, dispatcher: dispatcherOpt, clientToWorld: clientToWorld2, requestRedraw, getRuleCtx, onDoubleClick } = opts;
+  const { canvasRef, actions, toolsById, enabled = true, keyboard = true, affordanceAt, classifyTarget, dispatcher: dispatcherOpt, clientToWorld: clientToWorld2, requestRedraw, getRuleCtx, onDoubleClick } = opts;
   const onDoubleClickRef = useRef(onDoubleClick);
   onDoubleClickRef.current = onDoubleClick;
   const activeTool = useActiveToolContext();
@@ -13516,7 +14261,6 @@ function useGestureDispatcher(opts) {
     activeToolId: activeTool.active,
     hotkeyStack: activeTool.hotkeyStack,
     toolsById,
-    ambientToolIds,
     isMac: IS_MAC,
     getRuleCtx
   });
@@ -13526,7 +14270,6 @@ function useGestureDispatcher(opts) {
     activeToolId: activeTool.active,
     hotkeyStack: activeTool.hotkeyStack,
     toolsById,
-    ambientToolIds,
     isMac: IS_MAC,
     getRuleCtx
   };
@@ -13604,6 +14347,7 @@ function useGestureDispatcher(opts) {
         ctrlKey: down.ctrlKey,
         metaKey: down.metaKey,
         shiftKey: down.shiftKey,
+        ...down.affordance !== void 0 ? { affordance: down.affordance } : {},
         ...down.bodyTarget !== void 0 ? { bodyTarget: down.bodyTarget } : {},
         ...down.bodyKind !== void 0 ? { bodyKind: down.bodyKind } : {}
       };
@@ -13613,11 +14357,15 @@ function useGestureDispatcher(opts) {
         y: down.worldY,
         clientX: down.clientX,
         clientY: down.clientY,
-        ...down.affordance !== void 0 ? { affordance: down.affordance } : {},
         ...shared
       });
       if (result === "unhandled") {
-        dispatch2({ kind: "contextmenu", ...shared });
+        dispatch2({
+          kind: "contextmenu",
+          worldX: down.worldX,
+          worldY: down.worldY,
+          ...shared
+        });
       }
     };
     const DOUBLE_CLICK_MAX_MS = 600;
@@ -13672,6 +14420,9 @@ function useGestureDispatcher(opts) {
     const onWheel = (e) => {
       const rect = canvas?.getBoundingClientRect();
       const [localX, localY] = rect ? clientToCanvasRect(rect, e.clientX, e.clientY) : [e.clientX, e.clientY];
+      const screenPoint = { x: e.clientX, y: e.clientY };
+      const affordance = affordanceAtRef.current?.(screenPoint) ?? void 0;
+      const body = classifyTargetRef.current?.(screenPoint);
       const ev = {
         kind: "wheel",
         altKey: e.altKey,
@@ -13681,7 +14432,10 @@ function useGestureDispatcher(opts) {
         deltaX: e.deltaX,
         deltaY: e.deltaY,
         clientX: localX,
-        clientY: localY
+        clientY: localY,
+        ...affordance !== void 0 ? { affordance } : {},
+        ...body?.body !== void 0 ? { bodyTarget: body.body } : {},
+        ...body?.kind !== void 0 ? { bodyKind: body.kind } : {}
       };
       const result = dispatch2(ev);
       if (result === "handled") {
@@ -13975,6 +14729,7 @@ function useGestureDispatcher(opts) {
             shiftKey: e.shiftKey,
             worldX: wClick.x,
             worldY: wClick.y,
+            ...down.affordance !== void 0 ? { affordance: down.affordance } : {},
             ...down.bodyTarget !== void 0 ? { bodyTarget: down.bodyTarget } : {},
             ...down.bodyKind !== void 0 ? { bodyKind: down.bodyKind } : {}
           };
@@ -14016,8 +14771,10 @@ function useGestureDispatcher(opts) {
     };
     const onContextMenu = (e) => {
       e.preventDefault();
-      const worldPoint = { x: e.clientX, y: e.clientY };
-      const menuBody = classifyTargetRef.current?.(worldPoint);
+      const screenPoint = { x: e.clientX, y: e.clientY };
+      const affordance = affordanceAtRef.current?.(screenPoint) ?? void 0;
+      const menuBody = classifyTargetRef.current?.(screenPoint);
+      const w = toWorld(e.clientX, e.clientY);
       const ev = {
         kind: "contextmenu",
         target: e.target,
@@ -14025,6 +14782,9 @@ function useGestureDispatcher(opts) {
         ctrlKey: e.ctrlKey,
         metaKey: e.metaKey,
         shiftKey: e.shiftKey,
+        worldX: w.x,
+        worldY: w.y,
+        ...affordance !== void 0 ? { affordance } : {},
         ...menuBody?.body !== void 0 ? { bodyTarget: menuBody.body } : {},
         ...menuBody?.kind !== void 0 ? { bodyKind: menuBody.kind } : {}
       };
@@ -14323,47 +15083,203 @@ function usePinchGesture(canvasRef, onPinch, enabled = true) {
     };
   }, [canvasRef, enabled]);
 }
-function useTools(opts) {
-  if (!(opts.active in opts.registry)) {
-    throw new Error(`useTools: active "${opts.active}" not in registry`);
+var TOOL_OFFHAND_ID = "tool.offhand";
+function offhandKeyFor(trigger) {
+  switch (trigger) {
+    case "space":
+      return " ";
+    case "alt":
+      return "Alt";
+    case "ctrl":
+      return "Control";
+    case "meta":
+      return "Meta";
+    case "shift":
+      return "Shift";
   }
+}
+function buildToolOffhandBindings(specs) {
+  return specs.map(({ toolId, key }) => ({
+    spec: { kind: "key-held", key },
+    opts: { params: { toolId } }
+  }));
+}
+function makeToolOffhandAction(bindings) {
+  return {
+    id: TOOL_OFFHAND_ID,
+    label: "Engage tool (offhand)",
+    defaultBinding: bindings,
+    scope: "hotkey",
+    invoker: {
+      timing: "ongoing",
+      start: (ctx, opts) => {
+        const activeTool = ctx.deps.activeTool;
+        const toolId = resolveParams(opts?.params)?.toolId;
+        if (!activeTool || !toolId) return {};
+        activeTool.pushHotkey(toolId);
+        return {
+          onEnd: () => {
+            activeTool.popHotkey();
+          }
+        };
+      }
+    },
+    requires: ["activeTool"]
+  };
+}
+var NO_TRIGGERS = /* @__PURE__ */ new Set();
+function useContributions(opts) {
   const ctx = useActiveToolContext();
+  const actionsRegistry = useActionsRegistry();
   const hasInitializedRef = useRef(false);
   const isFirstRender = !hasInitializedRef.current;
   const needsFirstMountSyncRef = useRef(false);
   if (isFirstRender) {
     hasInitializedRef.current = true;
-    needsFirstMountSyncRef.current = ctx.active === "select" && opts.active !== "select";
+    needsFirstMountSyncRef.current = ctx.active === "select" && opts.focused !== "select";
   }
   useEffect(() => {
     if (!needsFirstMountSyncRef.current) return;
     needsFirstMountSyncRef.current = false;
-    ctx.setActive(opts.active);
+    ctx.setActive(opts.focused);
+  }, []);
+  const focused2 = isFirstRender && ctx.active === "select" && opts.focused !== "select" ? opts.focused : ctx.active;
+  const entriesRef = useRef(opts.entries);
+  entriesRef.current = opts.entries;
+  const focusedRef = useRef(focused2);
+  focusedRef.current = focused2;
+  const engagedRef = useRef(ctx.hotkeyStack);
+  engagedRef.current = ctx.hotkeyStack;
+  const setFocused = useCallback((id) => {
+    ctx.setActive(id);
+  }, [ctx]);
+  const snapshot = useCallback(() => {
+    const engaged = engagedRef.current;
+    const engagedIds = new Set(engaged);
+    const ordered = [];
+    for (const id of engaged) {
+      const entry = entriesRef.current.find((e) => e.id === id);
+      if (entry && !ordered.includes(entry)) ordered.push(entry);
+    }
+    for (const entry of entriesRef.current) {
+      if (!ordered.includes(entry)) ordered.push(entry);
+    }
+    return {
+      ordered,
+      state: { focusedId: focusedRef.current, heldTriggers: NO_TRIGGERS, engagedIds }
+    };
   }, []);
-  const active = isFirstRender && ctx.active === "select" && opts.active !== "select" ? opts.active : ctx.active;
-  const hotkeyStack = ctx.hotkeyStack;
-  const hotkeyEngaged = hotkeyStack.at(-1) ?? null;
-  const registryRef = useRef(opts.registry);
-  registryRef.current = opts.registry;
-  const ambientRef = useRef(opts.ambient ?? []);
-  ambientRef.current = opts.ambient ?? [];
-  const activeRef = useRef(active);
-  activeRef.current = active;
+  const scopedBindings = useCallback(() => {
+    const { ordered, state } = snapshot();
+    return scopeBindings(ordered, state);
+  }, [snapshot]);
+  const overlays = useCallback(() => {
+    const { ordered, state } = snapshot();
+    const active = [];
+    const hotkey = [];
+    const ambient = [];
+    for (const entry of ordered) {
+      if (!entry.overlay) continue;
+      const scope = liveScope(entry.id, entry.eligibility ?? {}, state);
+      if (scope === "active") active.push(entry.overlay);
+      else if (scope === "hotkey") hotkey.push(entry.overlay);
+      else if (scope === "ambient") ambient.push(entry.overlay);
+    }
+    return [...active, ...hotkey, ...ambient];
+  }, [snapshot]);
+  const offhandSig = opts.entries.map((e) => e.eligibility?.offhand ? `${e.id}:${e.eligibility.offhand}` : "").filter(Boolean).join(",");
+  useEffect(() => {
+    if (!actionsRegistry || offhandSig === "") return;
+    const specs = offhandSig.split(",").map((entry) => {
+      const [toolId, trigger] = entry.split(":");
+      return { toolId, key: offhandKeyFor(trigger) };
+    });
+    return actionsRegistry.register(makeToolOffhandAction(buildToolOffhandBindings(specs)));
+  }, [actionsRegistry, offhandSig]);
+  const lastConflictSigRef = useRef(null);
+  const entrySig = opts.entries.map((e) => e.id).join(",");
+  useEffect(() => {
+    if (process.env.NODE_ENV === "production") return;
+    if (lastConflictSigRef.current === entrySig) return;
+    lastConflictSigRef.current = entrySig;
+    const registry22 = [];
+    const ambient = [];
+    for (const entry of entriesRef.current) {
+      (entry.eligibility?.focus ? registry22 : ambient).push(entry);
+    }
+    reportRouteConflicts({
+      registry: registry22,
+      ambient,
+      actions: actionsRegistry?.list() ?? []
+    });
+  }, [entrySig, actionsRegistry]);
+  return useMemo(
+    () => ({
+      entries: entriesRef.current,
+      focused: focused2,
+      setFocused,
+      scopedBindings,
+      overlays
+    }),
+    [focused2, setFocused, scopedBindings, overlays]
+  );
+}
+function declareSlot(tool, slot) {
+  const hotkey = tool.def?.hotkey;
+  const eligibility = {
+    ...tool.eligibility,
+    [slot]: true,
+    ...hotkey ? { offhand: hotkey } : {}
+  };
+  return sameEligibility(tool.eligibility, eligibility) ? tool : { ...tool, eligibility };
+}
+function sameEligibility(a, b) {
+  if (!a) return false;
+  const keys = /* @__PURE__ */ new Set([...Object.keys(a), ...Object.keys(b)]);
+  for (const key of keys) if (a[key] !== b[key]) return false;
+  return true;
+}
+function useTools(opts) {
+  if (!(opts.active in opts.registry)) {
+    throw new Error(`useTools: active "${opts.active}" not in registry`);
+  }
+  const ctx = useActiveToolContext();
+  const slotted = useMemo(() => {
+    const registry22 = {};
+    for (const [id, tool] of Object.entries(opts.registry)) {
+      registry22[id] = declareSlot(tool, "focus");
+    }
+    const ambient = (opts.ambient ?? []).map((t) => declareSlot(t, "always"));
+    const byId2 = /* @__PURE__ */ new Map();
+    for (const tool of [...Object.values(registry22), ...ambient]) {
+      const prior = byId2.get(tool.id);
+      if (prior) byId2.set(tool.id, { ...tool, eligibility: { ...prior.eligibility, ...tool.eligibility } });
+      else byId2.set(tool.id, tool);
+    }
+    return { registry: registry22, ambient, entries: [...byId2.values()] };
+  }, [opts.registry, opts.ambient]);
+  const contributions = useContributions({ entries: slotted.entries, focused: opts.active });
+  const hotkeyEngaged = ctx.hotkeyStack.at(-1) ?? null;
+  const slottedRef = useRef(slotted);
+  slottedRef.current = slotted;
+  const activeRef = useRef(contributions.focused);
+  activeRef.current = contributions.focused;
   const hotkeyRef = useRef(hotkeyEngaged);
   hotkeyRef.current = hotkeyEngaged;
+  const setFocused = contributions.setFocused;
   const setActive = useCallback(
     (id) => {
-      if (!(id in registryRef.current)) {
+      if (!(id in slottedRef.current.registry)) {
         throw new Error(`setActive: "${id}" not in registry`);
       }
       dlog("tools", "active:", activeRef.current, "\u2192", id);
-      ctx.setActive(id);
+      setFocused(id);
     },
-    [ctx]
+    [setFocused]
   );
   const engageHotkey = useCallback(
     (id) => {
-      if (!(id in registryRef.current)) {
+      if (!(id in slottedRef.current.registry)) {
         throw new Error(`engageHotkey: "${id}" not in registry`);
       }
       dlog("tools", "hotkey engaged:", id);
@@ -14375,32 +15291,12 @@ function useTools(opts) {
     if (hotkeyRef.current) dlog("tools", "hotkey disengaged:", hotkeyRef.current);
     ctx.popHotkey();
   }, [ctx]);
-  const lastConflictSigRef = useRef(null);
-  const toolSetSig = Object.keys(opts.registry).join(",") + "|" + (opts.ambient ?? []).map((t) => t.id).join(",");
-  useEffect(() => {
-    if (process.env.NODE_ENV === "production") return;
-    if (lastConflictSigRef.current === toolSetSig) return;
-    lastConflictSigRef.current = toolSetSig;
-    reportRouteConflicts({
-      registry: registryRef.current,
-      ambient: ambientRef.current
-    });
-  }, [toolSetSig]);
   const has = useCallback(
-    (id) => id in registryRef.current || ambientRef.current.some((t) => t.id === id),
+    (id) => id in slottedRef.current.registry || slottedRef.current.ambient.some((t) => t.id === id),
     []
   );
-  const getActiveOverlays = useCallback(() => {
-    const out = [];
-    const activeTool = registryRef.current[activeRef.current];
-    if (activeTool?.overlay) out.push(activeTool.overlay);
-    const mod = hotkeyRef.current ? registryRef.current[hotkeyRef.current] : null;
-    if (mod?.overlay) out.push(mod.overlay);
-    for (const t of ambientRef.current) {
-      if (t.overlay) out.push(t.overlay);
-    }
-    return out;
-  }, []);
+  const active = contributions.focused;
+  const getActiveOverlays = contributions.overlays;
   return useMemo(
     () => ({
       active,
@@ -14408,44 +15304,14 @@ function useTools(opts) {
       hotkeyEngaged,
       engageHotkey,
       disengageHotkey,
-      ambient: ambientRef.current,
-      registry: registryRef.current,
+      ambient: slottedRef.current.ambient,
+      registry: slottedRef.current.registry,
       has,
       getActiveOverlays
     }),
     [active, setActive, hotkeyEngaged, engageHotkey, disengageHotkey, has, getActiveOverlays]
   );
 }
-var TOOL_OFFHAND_ID = "tool.offhand";
-function buildToolOffhandBindings(specs) {
-  return specs.map(({ toolId, key }) => ({
-    spec: { kind: "key-held", key },
-    opts: { params: { toolId } }
-  }));
-}
-function makeToolOffhandAction(bindings) {
-  return {
-    id: TOOL_OFFHAND_ID,
-    label: "Engage tool (offhand)",
-    defaultBinding: bindings,
-    scope: "hotkey",
-    invoker: {
-      timing: "ongoing",
-      start: (ctx, opts) => {
-        const activeTool = ctx.deps.activeTool;
-        const toolId = resolveParams(opts?.params)?.toolId;
-        if (!activeTool || !toolId) return {};
-        activeTool.pushHotkey(toolId);
-        return {
-          onEnd: () => {
-            activeTool.popHotkey();
-          }
-        };
-      }
-    },
-    requires: ["activeTool"]
-  };
-}
 var TOOL_ACTIVATE_ID = "tool.activate";
 function buildToolActivateBindings(specs) {
   return specs.map(({ toolId, keyOpts }) => {
@@ -14517,9 +15383,6 @@ var BUILTIN_SELECT_KEYS = {
   hand: { key: "H" },
   pen: { key: "P" }
 };
-var BUILTIN_OFFHAND_ACTIONS = {
-  hand: " "
-};
 function useKeybindings(tools, options = {}) {
   const toolsRef = useRef(tools);
   toolsRef.current = tools;
@@ -14527,19 +15390,6 @@ function useKeybindings(tools, options = {}) {
   optionsRef.current = options;
   const initialActiveRef = useRef(tools.active);
   const registry22 = useActionsRegistry();
-  useEffect(() => {
-    if (optionsRef.current.disable) return;
-    if (!registry22) return;
-    const specs = [];
-    for (const [toolId, key] of Object.entries(BUILTIN_OFFHAND_ACTIONS)) {
-      if (toolsRef.current.has(toolId)) {
-        specs.push({ toolId, key });
-      }
-    }
-    if (specs.length === 0) return;
-    const bindings = buildToolOffhandBindings(specs);
-    return registry22.register(makeToolOffhandAction(bindings));
-  }, [registry22, tools]);
   useEffect(() => {
     if (optionsRef.current.disable) return;
     if (!registry22) return;
@@ -14912,21 +15762,18 @@ function textLineBoxes(pose, opts = {}) {
   const style = resolveTextStyle(pose.style);
   const source = pose.runs && pose.runs.length > 0 ? pose.runs : pose.text;
   const runs = resolveRuns(toRuns(source), style);
-  const laid = layoutRuns(
-    runs,
-    {
-      maxWidth: opts.maxWidth ?? pose.width,
-      lineHeight: style.lineHeight,
-      align: style.align
-    },
-    { x: pose.x, y: pose.y }
-  );
-  const dy = verticalAlignOffset(pose.verticalAlign, pose.height, laid.bounds.height);
+  const laid = layoutRuns(runs, {
+    maxWidth: opts.maxWidth ?? pose.width,
+    lineHeight: style.lineHeight,
+    align: style.align
+  });
+  const dx = pose.x;
+  const dy = pose.y + verticalAlignOffset(pose.verticalAlign, pose.height, laid.bounds.height);
   const out = [];
   for (const line of laid.lines) {
     if (!opts.includeEmpty && line.x1 <= line.x0) continue;
     out.push({
-      x: line.x0 - padding,
+      x: line.x0 + dx - padding,
       y: line.y0 + dy - padding,
       width: line.x1 - line.x0 + padding * 2,
       height: line.y1 - line.y0 + padding * 2
@@ -14934,7 +15781,82 @@ function textLineBoxes(pose, opts = {}) {
   }
   return out;
 }
+function fillInPoseFrame(fill, box) {
+  if (isBoundsPattern(fill)) {
+    const o = fill.origin ?? { x: 0, y: 0 };
+    return { ...fill, origin: { x: box.x + o.x, y: box.y + o.y }, units: "local" };
+  }
+  if (!isBoundsGradient(fill)) return fill;
+  const toBox = (p) => ({
+    x: box.x + p.x * box.width,
+    y: box.y + p.y * box.height
+  });
+  if (fill.fill === "linear-gradient") {
+    return { ...fill, from: toBox(fill.from), to: toBox(fill.to), units: "local" };
+  }
+  if (fill.fill === "radial-gradient") {
+    const scale2 = Math.hypot(box.width, box.height) / Math.SQRT2;
+    return { ...fill, center: toBox(fill.center), radius: fill.radius * scale2, units: "local" };
+  }
+  return { ...fill, center: toBox(fill.center), units: "local" };
+}
+function isBoundsPattern(fill) {
+  return fill.fill === "pattern" && fill.units === "bounds";
+}
+function isBoundsGradient(fill) {
+  if (fill === void 0) return false;
+  const kind = fill.fill;
+  if (kind !== "linear-gradient" && kind !== "radial-gradient" && kind !== "conic-gradient") {
+    return false;
+  }
+  return fill.units === "bounds";
+}
 var cache5 = /* @__PURE__ */ new Map();
+function specKey(spec) {
+  const keys = Object.keys(spec).sort();
+  const bag = spec;
+  return keys.map((k) => `${k}=${String(bag[k])}`).join("&");
+}
+function resolvePatternSpec(spec) {
+  const key = specKey(spec);
+  const hit = cache5.get(key);
+  if (hit !== void 0) return hit;
+  const built = buildTile(spec);
+  cache5.set(key, built);
+  return built;
+}
+function buildTile(spec) {
+  const { color, size } = spec;
+  switch (spec.tile) {
+    case "hatch":
+      return hatch({ color, size, lineWidth: spec.lineWidth });
+    case "crosshatch":
+      return crosshatch({ color, size, lineWidth: spec.lineWidth });
+    case "dots":
+      return dots({ color, size, radius: spec.radius });
+    case "chunks":
+      return chunks({
+        color,
+        size,
+        bg: spec.bg,
+        density: spec.density,
+        chunkSize: spec.chunkSize,
+        seed: spec.seed
+      });
+    default:
+      return null;
+  }
+}
+function isPatternSpec(payload) {
+  return "tile" in payload;
+}
+function resolveFillPattern(fill) {
+  if (fill.fill !== "pattern") return fill;
+  if (!isPatternSpec(fill.pattern)) return fill;
+  const handle = resolvePatternSpec(fill.pattern);
+  return handle ? { ...fill, pattern: handle } : null;
+}
+var cache6 = /* @__PURE__ */ new Map();
 var subscribers2 = /* @__PURE__ */ new Set();
 var defaultLoader = async (src) => {
   if (typeof Image === "undefined" || typeof createImageBitmap === "undefined") {
@@ -14952,28 +15874,28 @@ function notify() {
 }
 function startLoad(src) {
   const entry = { status: "loading" };
-  cache5.set(src, entry);
+  cache6.set(src, entry);
   loader(src).then(
     (bitmap) => {
-      if (cache5.get(src) !== entry) return;
-      cache5.set(src, { status: "ready", bitmap });
+      if (cache6.get(src) !== entry) return;
+      cache6.set(src, { status: "ready", bitmap });
       notify();
     },
     () => {
-      if (cache5.get(src) !== entry) return;
-      cache5.set(src, { status: "error" });
+      if (cache6.get(src) !== entry) return;
+      cache6.set(src, { status: "error" });
       notify();
     }
   );
 }
 function getImageBitmap(src) {
-  const entry = cache5.get(src);
+  const entry = cache6.get(src);
   if (entry) return entry.bitmap;
   startLoad(src);
   return void 0;
 }
 function imageStatus(src) {
-  return cache5.get(src)?.status ?? "idle";
+  return cache6.get(src)?.status ?? "idle";
 }
 function subscribeImageReady(cb) {
   subscribers2.add(cb);
@@ -15151,6 +16073,17 @@ function rectsToPath(rects) {
   }
   return { kind: "polygon", commands, coords, fillRule: "nonzero" };
 }
+function isFillStyle(v) {
+  return typeof v === "object" && v !== null;
+}
+function resolveNodeFill(fill, color, hasStroke, fallback) {
+  if (isFillStyle(fill)) return fill;
+  const c = fill ?? color;
+  if (c === "none") return null;
+  if (c !== void 0) return { color: c };
+  if (hasStroke && fallback === null) return null;
+  return fallback === null ? null : { color: fallback };
+}
 var PATH_PAINTER = {
   id: "kit:path",
   matches: (node) => {
@@ -15164,12 +16097,12 @@ var PATH_PAINTER = {
     const d = node.data;
     const projected = pathInPoseFrame(d.path, pose);
     const hasStroke = !!d.stroke && d.stroke !== "none" && (d.strokeWidth ?? 0) > 0;
-    const fillColor = d.fill ?? d.color;
-    const hasFill = fillColor !== "none" && (fillColor !== void 0 || !hasStroke);
+    const declared = resolveNodeFill(d.fill, d.color, hasStroke, hasStroke ? null : "#888");
+    const fill = declared && resolveFillPattern(fillInPoseFrame(declared, pose));
     const cmd = {
       kind: "path",
       path: projected,
-      ...hasFill ? { fill: { color: fillColor ?? "#888" } } : {},
+      ...fill ? { fill } : {},
       ...hasStroke ? { stroke: { paint: { color: d.stroke }, width: d.strokeWidth ?? 1 } } : {}
     };
     return [cmd];
@@ -15185,9 +16118,8 @@ var PATH_PAINTER = {
   ink: (node) => {
     const d = node.data;
     const hasStroke = !!d.stroke && d.stroke !== "none" && (d.strokeWidth ?? 0) > 0;
-    const fillColor = d.fill ?? d.color;
     return {
-      filled: fillColor !== "none" && (fillColor !== void 0 || !hasStroke),
+      filled: resolveNodeFill(d.fill, d.color, hasStroke, hasStroke ? null : "#888") !== null,
       strokeWidth: hasStroke ? d.strokeWidth ?? 1 : 0
     };
   }
@@ -15204,10 +16136,12 @@ var SHAPE_PAINTER = {
   paint: (node, pose) => nodeMemo(node, PAINT_SLOT, pose, () => {
     const d = node.data;
     const path = pathForShape(d, pose);
+    const declaredFill = resolveNodeFill(d.fill, d.color, false, "#888");
+    const shapeFill = declaredFill && resolveFillPattern(fillInPoseFrame(declaredFill, pose));
     return [{
       kind: "path",
       path,
-      fill: { color: d.fill ?? d.color ?? "#888" },
+      ...shapeFill ? { fill: shapeFill } : {},
       ...d.stroke && (d.strokeWidth ?? 0) > 0 ? { stroke: { paint: { color: d.stroke }, width: d.strokeWidth ?? 1 } } : {}
     }];
   }),
@@ -15603,11 +16537,8 @@ function useSelectTool(adapter, options) {
             ...moveOpts
           },
           { spec: { kind: "drag", target: "empty" }, actionId: "areaSelect" },
-          // Click on empty canvas → clear. Same no-affordance requirement as
-          // the press binding above, and for the same two reasons: clicking a
-          // widget that happens to float over empty canvas isn't a click on
-          // empty canvas, and declining in the SPEC lets the chrome's owner
-          // have the click instead of it being consumed here.
+          // resize/rotate bind only drag (no click), so a click on either handle
+          // (body genuinely empty) would hit target:'empty' and wrongly clear selection.
           {
             spec: {
               kind: "click",
@@ -15691,17 +16622,17 @@ function worldToLocal(xf, wx, wy) {
 function annulusSemiAxes(shape, view) {
   const bandPx = shape.minBandPx ?? 0;
   if (bandPx === 0) return { rx: shape.rx, ry: shape.ry };
-  const band = bandPx / meanScale(view.scale);
+  const band = pxExtent(bandPx, view.scale);
   return {
-    rx: Math.max(shape.rx, shape.innerWidth / 2 + band),
-    ry: Math.max(shape.ry, shape.innerHeight / 2 + band)
+    rx: Math.max(shape.rx, shape.innerWidth / 2 + band.x),
+    ry: Math.max(shape.ry, shape.innerHeight / 2 + band.y)
   };
 }
 function hitRegion(region, wx, wy, xf, view) {
   const local = worldToLocal(xf, wx, wy);
   if (region.shape.kind === "point") {
-    const radiusWorld = region.shape.hitRadiusPx / meanScale(view.scale);
-    return Math.abs(local.x - region.shape.x) <= radiusWorld && Math.abs(local.y - region.shape.y) <= radiusWorld;
+    const anchor = localToWorld(xf, region.shape.x, region.shape.y);
+    return withinPxBox(anchor.x - wx, anchor.y - wy, region.shape.hitRadiusPx, view.scale);
   }
   if (region.shape.kind === "annulus") {
     const s = region.shape;
@@ -15765,14 +16696,13 @@ function asIsVisible(data) {
 function recordRegionHitbox(debug, affordanceId, region, xf, view) {
   if (region.shape.kind === "point") {
     const w2 = localToWorld(xf, region.shape.x, region.shape.y);
-    const r2 = region.shape.hitRadiusPx / meanScale(view.scale);
+    const e = pxExtent(region.shape.hitRadiusPx, view.scale);
     debug.recordHitbox(affordanceId, "handle", {
       kind: "rect",
-      x: w2.x - r2,
-      y: w2.y - r2,
-      width: r2 * 2,
-      height: r2 * 2,
-      ...xf.identity ? {} : { rotation: Math.atan2(xf.sin, xf.cos) }
+      x: w2.x - e.x,
+      y: w2.y - e.y,
+      width: e.x * 2,
+      height: e.y * 2
     });
     return;
   }
@@ -15831,7 +16761,7 @@ function paintRegion(region, xf, view, state, viewT, out) {
   if (paint.kind === "annulus") {
     if (region.shape.kind !== "annulus") return;
     const s = region.shape;
-    const insetLocal = (paint.insetPx ?? 0) / meanScale(view.scale);
+    const insetLocal = pxExtent(paint.insetPx ?? 0, view.scale);
     const cmd = annulusCommand(s, annulusSemiAxes(s, view), insetLocal, xf, viewT, paint.fill, paint.stroke);
     if (cmd) out.push(cmd);
     return;
@@ -15848,13 +16778,13 @@ function paintRegion(region, xf, view, state, viewT, out) {
   }
 }
 function annulusCommand(shape, semiAxes, insetLocal, xf, viewT, fill, stroke) {
-  const rx = semiAxes.rx - insetLocal;
-  const ry = semiAxes.ry - insetLocal;
+  const rx = semiAxes.rx - insetLocal.x;
+  const ry = semiAxes.ry - insetLocal.y;
   if (rx <= 0 || ry <= 0) return null;
   const cx = shape.cx;
   const cy = shape.cy;
-  const rectHW = shape.innerWidth / 2 + insetLocal;
-  const rectHH = shape.innerHeight / 2 + insetLocal;
+  const rectHW = shape.innerWidth / 2 + insetLocal.x;
+  const rectHH = shape.innerHeight / 2 + insetLocal.y;
   const haveTopBottom = rectHH < ry;
   const haveLeftRight = rectHW < rx;
   if (!haveTopBottom && !haveLeftRight) return null;
@@ -16101,6 +17031,7 @@ function useHandTool(opts = {}) {
     () => Object.assign(defineViewportTool({
       id: "hand",
       capabilities: ["navigation"],
+      hotkey: "space",
       hookName: "useHandTool",
       presentation: {
         label: "Hand",
@@ -16221,10 +17152,6 @@ function mirrorHandle(anchor, out) {
   if (!out || anchor.altBroken) return void 0;
   return { x: 2 * anchor.x - out.x, y: 2 * anchor.y - out.y };
 }
-function dist2(ax, ay, bx, by) {
-  const dx = ax - bx, dy = ay - by;
-  return Math.hypot(dx, dy);
-}
 function usePenTool(options) {
   const { wrapPath, adapter, autoSelect = true, autoCommitOnClose = true, closeHitRadius = 8, snapPoint: snapPoint2 } = options;
   const scratchRef = useRef(null);
@@ -16248,11 +17175,14 @@ function usePenTool(options) {
     const fn = optsRef.current.snapPoint;
     return fn ? fn({ x, y }) : { x, y };
   }, []);
-  const closeRadius = useCallback((deps) => {
-    const view = deps.view?.get();
-    const scale2 = view?.scale ?? { x: 1, y: 1 };
-    return optsRef.current.closeHitRadius / meanScale(scale2);
-  }, []);
+  const withinCloseRadius = useCallback(
+    (deps, ax, ay, wx, wy) => {
+      const view = deps.view?.get();
+      const scale2 = view?.scale ?? { x: 1, y: 1 };
+      return withinPxRadius(ax - wx, ay - wy, optsRef.current.closeHitRadius, scale2);
+    },
+    []
+  );
   const actions = useMemo(() => {
     const s = () => scratchRef.current;
     return [
@@ -16268,10 +17198,9 @@ function usePenTool(options) {
             if (p?.pressX === void 0 || p.pressY === void 0) return;
             const { x: wx, y: wy } = snap2(p.pressX, p.pressY);
             const scratch = s();
-            const radius = closeRadius(deps);
             if (scratch.current && scratch.current.anchors.length >= 3) {
               const first = scratch.current.anchors[0];
-              if (dist2(first.x, first.y, wx, wy) <= radius) {
+              if (withinCloseRadius(deps, first.x, first.y, wx, wy)) {
                 scratch.current.closed = true;
                 scratch.finishedSubpaths.push(scratch.current);
                 scratch.current = null;
@@ -16390,7 +17319,7 @@ function usePenTool(options) {
         }
       }
     ];
-  }, [commit, snap2, closeRadius]);
+  }, [commit, snap2, withinCloseRadius]);
   return useMemo(() => {
     return defineTool({
       id: "pen",
@@ -17559,6 +18488,13 @@ function wrapWithPoseRotation(cmds, pose) {
     children: cmds
   }];
 }
+function wrapNodeOutput(cmds, pose, alpha) {
+  const rotated = wrapWithPoseRotation(cmds, pose);
+  if (alpha !== 1 && rotated.length > 0) {
+    return [{ kind: "group", alpha, children: rotated }];
+  }
+  return rotated;
+}
 function CursorCoordsHud({ canvasRef, viewRef, offset }) {
   const [state, setState] = useState({
     client: { x: 0, y: 0 },
@@ -17806,12 +18742,7 @@ function buildSceneLayer(cfg, adapter, debugSink, boundsOfFn, hideIds, slot) {
             const oy = pose.y ?? (b ? b.y : 0);
             debugSink.recordOrigin(obj.id, { x: ox, y: oy });
           }
-          const rotated = wrapWithPoseRotation(cmds, pose);
-          const alpha = cfg.alphaFor ? cfg.alphaFor(obj.id) : 1;
-          if (alpha !== 1 && rotated.length > 0) {
-            return [{ kind: "group", alpha, children: rotated }];
-          }
-          return rotated;
+          return wrapNodeOutput(cmds, pose, cfg.alphaFor ? cfg.alphaFor(obj.id) : 1);
         };
         const hierarchicalAdapter = cfg.toPose ? {
           ...a,
@@ -17835,13 +18766,8 @@ function buildSceneLayer(cfg, adapter, debugSink, boundsOfFn, hideIds, slot) {
         const pose = toPose(obj);
         if (drawOne) {
           const cmds = drawOne(obj, pose, view);
-          const rotated = wrapWithPoseRotation(cmds, pose);
-          const alpha = cfg.alphaFor ? cfg.alphaFor(obj.id) : 1;
-          if (alpha !== 1 && rotated.length > 0) {
-            children.push({ kind: "group", alpha, children: rotated });
-          } else {
-            for (const cmd of rotated) children.push(cmd);
-          }
+          const wrapped = wrapNodeOutput(cmds, pose, cfg.alphaFor ? cfg.alphaFor(obj.id) : 1);
+          for (const cmd of wrapped) children.push(cmd);
         }
         if (debugSink) {
           const b = boundsOfFn ? boundsOfFn(obj.id) : null;
@@ -17956,8 +18882,8 @@ function CanvasInner(props, ref) {
     const isVisible = getIsVisibleRef.current?.() ?? alwaysVisible;
     for (const layer of layers2) {
       if (!layer.hitTest) continue;
-      const binding = layer.hitTest(worldX, worldY, void 0, view, dims, isVisible);
-      if (binding) return { layerId: layer.id, binding };
+      const hit = layer.hitTest(worldX, worldY, void 0, view, dims, isVisible);
+      if (hit) return { layerId: layer.id, hit };
     }
     return null;
   }, []);
@@ -18393,7 +19319,7 @@ function CanvasInner(props, ref) {
       effectiveView,
       { width, height }
     );
-    renderer.render(commands);
+    renderer.render(commands, viewToMat3(effectiveView));
   }, [layersWithDebug, width, height, effectiveView, debugSink, redrawNonce, dprProp]);
   const shaderIdKey = shaders?.map((h) => h.id).join("|") ?? "";
   useEffect(() => {
@@ -18555,6 +19481,7 @@ function createScene(options) {
     return i;
   }
   function rebuildLayerIndex() {
+    invalidateOrder();
     state.layerIndex.clear();
     for (let i = 0; i < state.layers.length; i++) {
       state.layerIndex.set(state.layers[i].id, i);
@@ -18580,6 +19507,7 @@ function createScene(options) {
     const idx = sibs.indexOf(id);
     if (idx < 0) throw new Error(`Scene: node "${id}" not found in its parent's children`);
     sibs.splice(idx, 1);
+    invalidateOrder();
     return { parent: node.parent, index: idx };
   }
   function attach(id, parent, index) {
@@ -18588,6 +19516,7 @@ function createScene(options) {
     sibs.splice(i, 0, id);
     const node = requireNode(id);
     node.parent = parent;
+    invalidateOrder();
   }
   function descendants(id, out) {
     const n = state.nodes.get(id);
@@ -18667,9 +19596,11 @@ function createScene(options) {
     apply: (p) => {
       requireLayerIndex(p.to);
       requireNode(p.id).layer = p.to;
+      invalidateOrder();
     },
     revert: (p) => {
       requireNode(p.id).layer = p.from;
+      invalidateOrder();
     }
   });
   registerKitOp("kit:move", {
@@ -18808,21 +19739,98 @@ function createScene(options) {
       registered.set(k, h);
     }
   }
-  function* renderOrderInternal() {
-    for (const layer of state.layers) {
-      const stack = [...state.roots].reverse();
-      while (stack.length > 0) {
-        const id = stack.pop();
-        const node = state.nodes.get(id);
-        if (!node) continue;
-        if (node.layer === layer.id) yield id;
-        if (node.kind === "container") {
-          for (let i = node.children.length - 1; i >= 0; i--) {
-            stack.push(node.children[i]);
-          }
+  function renderOrderInternal() {
+    return state.layers.length === 1 ? renderOrderFlat() : renderOrderBucketed();
+  }
+  function renderOrderNodesInternal() {
+    return state.layers.length === 1 ? renderOrderNodesFlat() : renderOrderNodesBucketed();
+  }
+  let structureGeneration = 0;
+  let orderCache = { gen: 0 };
+  function invalidateOrder() {
+    structureGeneration++;
+  }
+  function currentOrderCache() {
+    if (orderCache.gen !== structureGeneration) {
+      orderCache = { gen: structureGeneration };
+    }
+    return orderCache;
+  }
+  function renderOrderFlat() {
+    const only = state.layers[0].id;
+    const out = [];
+    const stack = [...state.roots].reverse();
+    while (stack.length > 0) {
+      const id = stack.pop();
+      const node = state.nodes.get(id);
+      if (!node) continue;
+      if (node.layer === only) out.push(id);
+      if (node.kind === "container") {
+        for (let i = node.children.length - 1; i >= 0; i--) {
+          stack.push(node.children[i]);
+        }
+      }
+    }
+    return out;
+  }
+  function renderOrderNodesFlat() {
+    const only = state.layers[0].id;
+    const out = [];
+    const stack = [...state.roots].reverse();
+    while (stack.length > 0) {
+      const id = stack.pop();
+      const node = state.nodes.get(id);
+      if (!node) continue;
+      if (node.layer === only) out.push(node);
+      if (node.kind === "container") {
+        for (let i = node.children.length - 1; i >= 0; i--) {
+          stack.push(node.children[i]);
+        }
+      }
+    }
+    return out;
+  }
+  function renderOrderBucketed() {
+    const buckets = state.layers.map(() => []);
+    const stack = [...state.roots].reverse();
+    while (stack.length > 0) {
+      const id = stack.pop();
+      const node = state.nodes.get(id);
+      if (!node) continue;
+      const bucket = buckets[state.layerIndex.get(node.layer) ?? -1];
+      if (bucket) bucket.push(id);
+      if (node.kind === "container") {
+        for (let i = node.children.length - 1; i >= 0; i--) {
+          stack.push(node.children[i]);
+        }
+      }
+    }
+    const out = [];
+    for (const bucket of buckets) {
+      for (const id of bucket) out.push(id);
+    }
+    return out;
+  }
+  function renderOrderNodesBucketed() {
+    const buckets = state.layers.map(() => []);
+    const stack = [...state.roots].reverse();
+    while (stack.length > 0) {
+      const id = stack.pop();
+      const node = state.nodes.get(id);
+      if (!node) continue;
+      const bucket = buckets[state.layerIndex.get(node.layer) ?? -1];
+      if (bucket) bucket.push(node);
+      if (node.kind === "container") {
+        for (let i = node.children.length - 1; i >= 0; i--) {
+          stack.push(node.children[i]);
         }
       }
     }
+    const out = [];
+    for (const bucket of buckets) {
+      for (const node of bucket) out.push(node);
+    }
+    return out;
   }
   const scene = {
     get nodes() {
@@ -18851,7 +19859,12 @@ function createScene(options) {
       return out;
     },
     renderOrder() {
-      return renderOrderInternal();
+      const c = currentOrderCache();
+      return c.ids ??= renderOrderInternal();
+    },
+    renderOrderNodes() {
+      const c = currentOrderCache();
+      return c.nodes ??= renderOrderNodesInternal();
     },
     add(spec) {
       const id = spec.id ?? generateId();
@@ -19159,9 +20172,8 @@ function createScene(options) {
     },
     toJSON() {
       const nodes = [];
-      for (const id of renderOrderInternal()) {
-        const n = state.nodes.get(id);
-        if (!n) continue;
+      for (const n of renderOrderNodesInternal()) {
+        const id = n.id;
         const out = {
           id,
           kind: n.kind,
@@ -19195,6 +20207,7 @@ function createScene(options) {
       state.roots.length = 0;
       state.layers.length = 0;
       state.layerIndex.clear();
+      invalidateOrder();
       for (let i = 0; i < json.systemLayers.length; i++) {
         const spec = json.systemLayers[i];
         if (state.layerIndex.has(spec.id)) {
@@ -19463,9 +20476,8 @@ function sceneToAdapter(scene, options = {}) {
     getNodes() {
       const visible = visibleLayers();
       const out = [];
-      for (const id of scene.renderOrder()) {
-        const n = scene.get(id);
-        if (n && visible.has(n.layer)) out.push(n);
+      for (const n of scene.renderOrderNodes()) {
+        if (visible.has(n.layer)) out.push(n);
       }
       return out;
     },
@@ -19796,9 +20808,7 @@ function useSceneSelectTool(args) {
       // path descriptor for a tighter test.
       hitTestArea: (rect) => {
         const hits = [];
-        for (const nid of scene.renderOrder()) {
-          const n = scene.get(nid);
-          if (!n) continue;
+        for (const n of scene.renderOrderNodes()) {
           if (isPathLike2(n.pose) && pathPoseDescriptor.intersectsRect) {
             if (pathPoseDescriptor.intersectsRect(n.pose, rect)) hits.push(n.id);
             continue;
@@ -19836,9 +20846,8 @@ function useSceneSelectTool(args) {
       }
       const tolerance = pickTolerancePx / meanScale(getView?.()?.scale ?? { x: 1, y: 1 });
       const out = [];
-      for (const id of scene.renderOrder()) {
-        const n = scene.get(id);
-        if (!n || !poseContainsRotated(n.pose, wx, wy, tolerance)) continue;
+      for (const n of scene.renderOrderNodes()) {
+        if (!poseContainsRotated(n.pose, wx, wy, tolerance)) continue;
         if (shapePicking && !shapeCoversPoint(n, n.pose, wx, wy, { tolerance })) continue;
         out.push(n.id);
       }
@@ -20774,6 +21783,8 @@ function toAffordanceHit(hit) {
   const scratch = hit.binding.initialScratch ?? {};
   return {
     kind: hit.region.hitKind ?? `${hit.affordanceId}:${hit.regionId}`,
+    owner: hit.affordanceId,
+    strength: "shared",
     ...scratch.targetId !== void 0 ? { targetIds: [scratch.targetId] } : {},
     ...scratch.anchor !== void 0 ? { anchor: scratch.anchor } : {},
     ...scratch.fixedPoint !== void 0 ? { fixedPoint: scratch.fixedPoint } : {},
@@ -20953,23 +21964,25 @@ function hitTestAreaPolygon(scene, area, areaBounds) {
   const ab = areaBounds ?? boundsOf(area);
   if (!ab) return [];
   const hits = [];
-  for (const id of scene.renderOrder()) {
-    const node = scene.get(id);
-    if (!node || node.kind === "container") continue;
+  const order = scene.renderOrderNodes();
+  for (let i = 0; i < order.length; i++) {
+    const node = order[i];
+    if (node.kind === "container") continue;
     const pose = node.pose;
-    const b = aabbOfPose(pose);
+    const silhouette = pose !== null && typeof pose === "object" && pose.kind === "polygon";
+    const b = silhouette ? nodeMemo(node, "aabb", pose, () => aabbOfPose(pose)) : aabbOfPose(pose);
     if (!Number.isFinite(b.x) || !Number.isFinite(b.y) || !Number.isFinite(b.width) || !Number.isFinite(b.height)) {
       continue;
     }
     if (b.x >= ab.x + ab.width || b.x + b.width <= ab.x || b.y >= ab.y + ab.height || b.y + b.height <= ab.y) {
       continue;
     }
-    if (!isPathLike2(pose) || pose.kind === "rect") {
-      hits.push(id);
+    if (!silhouette) {
+      hits.push(node.id);
       continue;
     }
     if (silhouetteOverlapsArea(pose.coords, area)) {
-      hits.push(id);
+      hits.push(node.id);
     }
   }
   return hits;
@@ -21294,7 +22307,7 @@ function chordLengthParam(samples) {
   ts[0] = 0;
   let total = 0;
   for (let i = 1; i < n; i++) {
-    total += dist3(samples[i - 1], samples[i]);
+    total += dist2(samples[i - 1], samples[i]);
     ts[i] = total;
   }
   if (total === 0) return null;
@@ -21327,13 +22340,13 @@ function solveLS(samples, ts, a, e, tStart, tEnd) {
   let alpha1;
   let alpha2;
   if (Math.abs(det) < 1e-12) {
-    const chord = dist3(a, e);
+    const chord = dist2(a, e);
     alpha1 = alpha2 = chord / 3;
   } else {
     alpha1 = (c22 * x1 - c12 * x2) / det;
     alpha2 = (c11 * x2 - c12 * x1) / det;
     if (alpha1 < 1e-6 || alpha2 < 1e-6) {
-      const chord = dist3(a, e);
+      const chord = dist2(a, e);
       alpha1 = alpha2 = chord / 3;
     }
   }
@@ -21369,7 +22382,7 @@ function newtonRefineT(p, t, p0, p1, p2, p3) {
 function sub(a, b) {
   return { x: a.x - b.x, y: a.y - b.y };
 }
-function dist3(a, b) {
+function dist2(a, b) {
   return Math.hypot(a.x - b.x, a.y - b.y);
 }
 function unit(v) {
@@ -22329,7 +23342,7 @@ function SceneCanvasInner(props, ref) {
     const getMode = getActiveModeRef.current;
     if (!getMode) return true;
     const registry22 = toolsForEligibilityRef.current?.registry;
-    const caps = registry22?.[toolId]?.capabilities ?? [];
+    const caps = registry22?.[toolId]?.eligibility.capabilities ?? [];
     if (caps.length === 0) return false;
     const allowed = getMode().allowedCapabilities;
     for (const c of caps) if (allowed.has(c)) return true;
@@ -22803,10 +23816,6 @@ function GestureDispatcherMounter({
     for (const tool of tools.ambient) m.set(tool.id, tool);
     return m;
   }, [tools.registry, tools.ambient]);
-  const ambientToolIds = useMemo(
-    () => tools.ambient.map((t) => t.id),
-    [tools.ambient]
-  );
   const boundsOfRef = useRef(boundsOf2);
   boundsOfRef.current = boundsOf2;
   const pickEveryRef = useRef(pickEvery);
@@ -22918,9 +23927,14 @@ function GestureDispatcherMounter({
       const worldPoint = clientToWorld2(screenPoint.x, screenPoint.y);
       const extra = canvasApiRef?.current?.hitTestExtras?.(worldPoint.x, worldPoint.y);
       if (extra) {
+        const claim = extra.hit;
         return {
           kind: `layer:${extra.layerId}`,
-          ...extra.binding.initialScratch !== void 0 ? { payload: extra.binding.initialScratch } : {}
+          owner: extra.layerId,
+          strength: claim.strength ?? "shared",
+          ...claim.claimedKinds !== void 0 ? { claimedKinds: claim.claimedKinds } : {},
+          ...claim.cursor !== void 0 ? { cursor: claim.cursor } : {},
+          ...claim.initialScratch !== void 0 ? { payload: claim.initialScratch } : {}
         };
       }
       return affordanceAt ? affordanceAt(worldPoint) : null;
@@ -22940,7 +23954,6 @@ function GestureDispatcherMounter({
     canvasRef,
     actions: registry22,
     toolsById,
-    ambientToolIds,
     enabled,
     keyboard,
     affordanceAt: wrappedAffordanceAt,
@@ -23124,14 +24137,25 @@ inferredNodeRouting.map((e) => ({
   schema: shapeSchema({ text: e.name === "text" })
 }));
 var RENDERER_CACHE = /* @__PURE__ */ new WeakMap();
-function buildSceneViewCommands(scene, view, drawOne, extraCommands) {
-  const children = [];
-  for (const id of scene.renderOrder()) {
-    const node = scene.get(id);
-    if (!node) continue;
-    const cmds = drawOne(node, node.pose, view);
-    for (const cmd of cmds) children.push(cmd);
-  }
+function sceneAsHierarchy(scene) {
+  return {
+    getLayers: () => scene.layers.map((l) => ({ id: l.id, visible: l.visible })),
+    getNode: (id) => scene.get(id),
+    getChildren: (parentId) => {
+      if (parentId === null) return scene.roots;
+      const node = scene.get(parentId);
+      return node && node.kind === "container" ? node.children : [];
+    },
+    getPose: (id) => scene.get(id).pose
+  };
+}
+function buildSceneViewCommands(scene, view, drawOne, extraCommands, alphaFor) {
+  const wrappedDrawOne = (node, pose, v) => wrapNodeOutput(drawOne(node, pose, v), pose, alphaFor ? alphaFor(node.id) : 1);
+  const children = buildSceneTree(
+    sceneAsHierarchy(scene),
+    wrappedDrawOne,
+    view
+  );
   if (extraCommands && extraCommands.length > 0) {
     for (const cmd of extraCommands) children.push(cmd);
   }
@@ -23142,7 +24166,7 @@ function buildSceneViewCommands(scene, view, drawOne, extraCommands) {
   }];
 }
 function renderSceneToCanvas(args) {
-  const { canvas, scene, view, width, height, drawOne, extraCommands } = args;
+  const { canvas, scene, view, width, height, drawOne, extraCommands, alphaFor } = args;
   const dpr = args.dpr ?? (typeof window !== "undefined" ? window.devicePixelRatio || 1 : 1);
   let entry = RENDERER_CACHE.get(canvas);
   if (!entry) {
@@ -23170,11 +24194,11 @@ function renderSceneToCanvas(args) {
     entry.height = height;
     entry.dpr = dpr;
   }
-  const commands = buildSceneViewCommands(scene, view, drawOne, extraCommands);
-  entry.renderer.render(commands);
+  const commands = buildSceneViewCommands(scene, view, drawOne, extraCommands, alphaFor);
+  entry.renderer.render(commands, viewToMat3(view));
 }
 function SceneViewCanvasInner(props) {
-  const { scene, view, width, height, drawOne, extraCommands, className, canvasRef } = props;
+  const { scene, view, width, height, drawOne, extraCommands, alphaFor, className, canvasRef } = props;
   useSyncExternalStore(scene.subscribe, scene.getVersion, scene.getVersion);
   const localRef = useRef(null);
   const setCanvasRef = (el) => {
@@ -23195,7 +24219,8 @@ function SceneViewCanvasInner(props) {
       width,
       height,
       drawOne,
-      extraCommands
+      extraCommands,
+      alphaFor
     });
   });
   return /* @__PURE__ */ jsx(
@@ -23292,6 +24317,7 @@ function MinimapCanvasInner(props) {
     width,
     height,
     drawOne,
+    alphaFor,
     fit = "scene",
     poseBounds,
     indicatorStyle,
@@ -23403,6 +24429,7 @@ function MinimapCanvasInner(props) {
       height,
       drawOne,
       extraCommands,
+      alphaFor,
       className,
       canvasRef: setCanvasRef
     }
@@ -23545,6 +24572,6 @@ function oklchToOklab(L, C, h) {
   return [L, C * Math.cos(h), C * Math.sin(h)];
 }
 
-export { FALLBACK_FIT_VIEW, MinimapCanvas, SceneViewCanvas, UnknownIcon, buildSceneViewCommands, computeFitView2, computeIndicatorCommand, eligibleTool, evaluateEnabled, oklabToSrgbU8, oklchToOklab, renderSceneToCanvas, rgbaToHex, useActionsRegistry, useOptionalDepRegistry };
-//# sourceMappingURL=chunk-6V7ROR7G.js.map
-//# sourceMappingURL=chunk-6V7ROR7G.js.map
+export { FALLBACK_FIT_VIEW, MinimapCanvas, SceneViewCanvas, UnknownIcon, buildSceneViewCommands, computeFitView2, computeIndicatorCommand, eligibleContribution, evaluateEnabled, oklabToSrgbU8, oklchToOklab, renderSceneToCanvas, rgbaToHex, useActionsRegistry, useOptionalDepRegistry };
+//# sourceMappingURL=chunk-ISEK5LXT.js.map
+//# sourceMappingURL=chunk-ISEK5LXT.js.map