@layoutit/polycss-react 0.2.7 → 0.2.8

package/dist/three.cjs

@@ -0,0 +1,4020 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/three/index.ts
+var three_exports = {};
+__export(three_exports, {
+  AmbientLight: () => import_three4.AmbientLight,
+  DirectionalLight: () => import_three4.DirectionalLight,
+  Euler: () => import_three4.Euler,
+  Object3D: () => import_three4.Object3D,
+  OrthographicCamera: () => import_three4.OrthographicCamera,
+  PerspectiveCamera: () => import_three4.PerspectiveCamera,
+  PointLight: () => import_three4.PointLight,
+  PolyThreeMesh: () => PolyThreeMesh,
+  PolyThreeOrthographicCamera: () => PolyThreeOrthographicCamera,
+  PolyThreePerspectiveCamera: () => PolyThreePerspectiveCamera,
+  Vector3: () => import_three4.Vector3,
+  polyToThreeDirection: () => import_three4.polyToThreeDirection,
+  polyToThreePoint: () => import_three4.polyToThreePoint,
+  threeToPolyDirection: () => import_three4.threeToPolyDirection,
+  threeToPolyPoint: () => import_three4.threeToPolyPoint,
+  transformPointToPoly: () => import_three4.transformPointToPoly,
+  transformPolygonsToPoly: () => import_three4.transformPolygonsToPoly
+});
+module.exports = __toCommonJS(three_exports);
+var import_three4 = require("@layoutit/polycss-core/three");
+
+// src/three/PolyThreePerspectiveCamera.tsx
+var import_react4 = require("react");
+var import_three = require("@layoutit/polycss-core/three");
+
+// src/camera/context.ts
+var import_react = require("react");
+var PolyCameraContext = (0, import_react.createContext)(null);
+
+// src/camera/useCamera.ts
+var import_react3 = require("react");
+var import_polycss_core = require("@layoutit/polycss-core");
+
+// src/store/sceneStore.ts
+var import_react2 = require("react");
+function createSceneStore(initial) {
+  let state = {
+    cameraState: { ...initial },
+    autoCenterOffset: [0, 0, 0]
+  };
+  const listeners = /* @__PURE__ */ new Set();
+  function notify() {
+    for (const listener of listeners) listener();
+  }
+  return {
+    getState() {
+      return state;
+    },
+    setState(partial) {
+      state = { ...state, ...partial };
+      notify();
+    },
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    },
+    updateCameraFromRef(handle) {
+      state = { ...state, cameraState: { ...handle.state } };
+      notify();
+      return true;
+    },
+    notifyAll() {
+      notify();
+    },
+    setAutoCenterOffset(offset) {
+      state = { ...state, autoCenterOffset: offset };
+    }
+  };
+}
+
+// src/camera/useCamera.ts
+function writeCameraSnapshotAttrs(el, camera, projection, perspectiveStyle) {
+  if (!el) return;
+  const snapshot = (0, import_polycss_core.capturePolyCameraSnapshot)(camera, { projection, perspectiveStyle });
+  el.dataset.polycssCameraProjection = snapshot.projection;
+  el.dataset.polycssCameraPerspective = snapshot.perspectiveStyle;
+  el.dataset.polycssCameraAppliedPerspective = snapshot.appliedPerspectiveStyle;
+  el.dataset.polycssCameraZoom = String(snapshot.state.zoom);
+  el.dataset.polycssCameraDistance = String(snapshot.state.distance);
+  el.dataset.polycssCameraRotX = String(snapshot.state.rotX);
+  el.dataset.polycssCameraRotY = String(snapshot.state.rotY);
+  el.dataset.polycssCameraTarget = snapshot.state.target.join(",");
+}
+function usePolyCamera(options) {
+  const handleRef = (0, import_react3.useRef)(null);
+  if (!handleRef.current) {
+    handleRef.current = (0, import_polycss_core.createIsometricCamera)({
+      zoom: options.zoom,
+      target: options.target,
+      rotX: options.rotX,
+      rotY: options.rotY,
+      distance: options.distance
+    });
+  }
+  const sceneElRef = (0, import_react3.useRef)(null);
+  const cameraElRef = (0, import_react3.useRef)(null);
+  const store = (0, import_react3.useMemo)(
+    () => createSceneStore(handleRef.current.state),
+    []
+  );
+  (0, import_react3.useEffect)(() => {
+    const handle = handleRef.current;
+    const next = {};
+    if (options.zoom !== void 0) next.zoom = options.zoom;
+    if (options.target !== void 0) next.target = options.target;
+    if (options.rotX !== void 0) next.rotX = options.rotX;
+    if (options.rotY !== void 0) next.rotY = options.rotY;
+    if (options.distance !== void 0) next.distance = options.distance;
+    if (Object.keys(next).length > 0) {
+      handle.update(next);
+      const el = sceneElRef.current;
+      if (el) {
+        el.style.transform = (0, import_polycss_core.buildPolyCameraSceneTransform)(handle.state, {
+          autoCenterOffset: store.getState().autoCenterOffset
+        });
+      }
+      store.updateCameraFromRef(handle);
+      store.notifyAll();
+    }
+    writeCameraSnapshotAttrs(cameraElRef.current, handle, options.projection, options.perspectiveStyle);
+  }, [
+    options.zoom,
+    options.target,
+    options.rotX,
+    options.rotY,
+    options.distance,
+    options.projection,
+    options.perspectiveStyle,
+    store
+  ]);
+  const applyTransformDirect = (0, import_react3.useCallback)(() => {
+    const el = sceneElRef.current;
+    if (!el) return;
+    const handle = handleRef.current;
+    el.style.transform = (0, import_polycss_core.buildPolyCameraSceneTransform)(handle.state, {
+      autoCenterOffset: store.getState().autoCenterOffset
+    });
+    writeCameraSnapshotAttrs(cameraElRef.current, handle, options.projection, options.perspectiveStyle);
+  }, [store, options.projection, options.perspectiveStyle]);
+  return {
+    store,
+    cameraRef: handleRef,
+    sceneElRef,
+    cameraElRef,
+    applyTransformDirect
+  };
+}
+
+// src/three/PolyThreePerspectiveCamera.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function applyCameraProps(camera, props) {
+  if (props.fov !== void 0) camera.fov = props.fov;
+  if (props.aspect !== void 0) camera.aspect = props.aspect;
+  if (props.near !== void 0) camera.near = props.near;
+  if (props.far !== void 0) camera.far = props.far;
+  if (props.zoom !== void 0) camera.zoom = props.zoom;
+  if (props.position !== void 0) camera.position.set(props.position[0], props.position[1], props.position[2]);
+  if (props.up !== void 0) camera.up.set(props.up[0], props.up[1], props.up[2]);
+  if (props.lookAt !== void 0) camera.lookAt(props.lookAt[0], props.lookAt[1], props.lookAt[2]);
+  return camera;
+}
+function PolyThreePerspectiveCameraInner({
+  camera: cameraProp,
+  fov = 50,
+  aspect = 1,
+  near = 0.1,
+  far = 2e3,
+  zoom,
+  polyZoom,
+  perspective,
+  viewportHeight,
+  position,
+  lookAt,
+  up,
+  className,
+  style,
+  children
+}) {
+  const localCameraRef = (0, import_react4.useRef)(null);
+  if (!localCameraRef.current) {
+    localCameraRef.current = new import_three.PerspectiveCamera(fov, aspect, near, far);
+  }
+  const [measuredHeight, setMeasuredHeight] = (0, import_react4.useState)(viewportHeight ?? 420);
+  const camera = applyCameraProps(cameraProp ?? localCameraRef.current, {
+    fov,
+    aspect,
+    near,
+    far,
+    zoom,
+    position,
+    lookAt,
+    up
+  });
+  const polyCamera = camera.toPolyCameraState({
+    zoom: polyZoom,
+    perspective,
+    viewportHeight: viewportHeight ?? measuredHeight
+  });
+  const perspectiveStyle = `${polyCamera.perspective}px`;
+  const {
+    store,
+    cameraRef,
+    sceneElRef,
+    cameraElRef,
+    applyTransformDirect
+  } = usePolyCamera({
+    zoom: polyCamera.zoom,
+    target: polyCamera.target,
+    rotX: polyCamera.rotX,
+    rotY: polyCamera.rotY,
+    distance: polyCamera.distance,
+    projection: "perspective",
+    perspectiveStyle
+  });
+  (0, import_react4.useEffect)(() => {
+    if (viewportHeight !== void 0) return;
+    const el = cameraElRef.current;
+    if (!el) return;
+    const measure = () => {
+      const next = el.getBoundingClientRect().height || el.clientHeight || 420;
+      setMeasuredHeight(next);
+    };
+    measure();
+    if (typeof ResizeObserver === "undefined") return;
+    const observer = new ResizeObserver(measure);
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, [cameraElRef, viewportHeight]);
+  const contextValue = (0, import_react4.useMemo)(
+    () => ({ store, cameraRef, sceneElRef, cameraElRef, applyTransformDirect }),
+    [store, cameraRef, sceneElRef, cameraElRef, applyTransformDirect]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PolyCameraContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      ref: cameraElRef,
+      className: `polycss-camera${className ? ` ${className}` : ""}`,
+      style: { ...style, perspective: perspectiveStyle },
+      "data-polycss-camera-projection": "perspective",
+      "data-polycss-camera-perspective": perspectiveStyle,
+      "data-polycss-camera-applied-perspective": perspectiveStyle,
+      "data-polycss-camera-zoom": cameraRef.current.state.zoom,
+      "data-polycss-camera-distance": cameraRef.current.state.distance,
+      "data-polycss-camera-rot-x": cameraRef.current.state.rotX,
+      "data-polycss-camera-rot-y": cameraRef.current.state.rotY,
+      "data-polycss-camera-target": cameraRef.current.state.target.join(","),
+      children
+    }
+  ) });
+}
+var PolyThreePerspectiveCamera = (0, import_react4.memo)(PolyThreePerspectiveCameraInner);
+
+// src/three/PolyThreeOrthographicCamera.tsx
+var import_react5 = require("react");
+var import_three2 = require("@layoutit/polycss-core/three");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function applyCameraProps2(camera, props) {
+  if (props.left !== void 0) camera.left = props.left;
+  if (props.right !== void 0) camera.right = props.right;
+  if (props.top !== void 0) camera.top = props.top;
+  if (props.bottom !== void 0) camera.bottom = props.bottom;
+  if (props.near !== void 0) camera.near = props.near;
+  if (props.far !== void 0) camera.far = props.far;
+  if (props.zoom !== void 0) camera.zoom = props.zoom;
+  if (props.position !== void 0) camera.position.set(props.position[0], props.position[1], props.position[2]);
+  if (props.up !== void 0) camera.up.set(props.up[0], props.up[1], props.up[2]);
+  if (props.lookAt !== void 0) camera.lookAt(props.lookAt[0], props.lookAt[1], props.lookAt[2]);
+  return camera;
+}
+function PolyThreeOrthographicCameraInner({
+  camera: cameraProp,
+  left = -1,
+  right = 1,
+  top = 1,
+  bottom = -1,
+  near = 0.1,
+  far = 2e3,
+  zoom,
+  polyZoom,
+  viewportHeight,
+  position,
+  lookAt,
+  up,
+  className,
+  style,
+  children
+}) {
+  const localCameraRef = (0, import_react5.useRef)(null);
+  if (!localCameraRef.current) {
+    localCameraRef.current = new import_three2.OrthographicCamera(left, right, top, bottom, near, far);
+  }
+  const [measuredHeight, setMeasuredHeight] = (0, import_react5.useState)(viewportHeight ?? 420);
+  const camera = applyCameraProps2(cameraProp ?? localCameraRef.current, {
+    left,
+    right,
+    top,
+    bottom,
+    near,
+    far,
+    zoom,
+    position,
+    lookAt,
+    up
+  });
+  const polyCamera = camera.toPolyCameraState({
+    zoom: polyZoom,
+    viewportHeight: viewportHeight ?? measuredHeight
+  });
+  const {
+    store,
+    cameraRef,
+    sceneElRef,
+    cameraElRef,
+    applyTransformDirect
+  } = usePolyCamera({
+    zoom: polyCamera.zoom,
+    target: polyCamera.target,
+    rotX: polyCamera.rotX,
+    rotY: polyCamera.rotY,
+    distance: polyCamera.distance,
+    projection: "orthographic",
+    perspectiveStyle: "none"
+  });
+  (0, import_react5.useEffect)(() => {
+    if (viewportHeight !== void 0) return;
+    const el = cameraElRef.current;
+    if (!el) return;
+    const measure = () => {
+      const next = el.getBoundingClientRect().height || el.clientHeight || 420;
+      setMeasuredHeight(next);
+    };
+    measure();
+    if (typeof ResizeObserver === "undefined") return;
+    const observer = new ResizeObserver(measure);
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, [cameraElRef, viewportHeight]);
+  const contextValue = (0, import_react5.useMemo)(
+    () => ({ store, cameraRef, sceneElRef, cameraElRef, applyTransformDirect }),
+    [store, cameraRef, sceneElRef, cameraElRef, applyTransformDirect]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(PolyCameraContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "div",
+    {
+      ref: cameraElRef,
+      className: `polycss-camera${className ? ` ${className}` : ""}`,
+      style: { ...style, perspective: "none" },
+      "data-polycss-camera-projection": "orthographic",
+      "data-polycss-camera-perspective": "none",
+      "data-polycss-camera-applied-perspective": "1000000px",
+      "data-polycss-camera-zoom": cameraRef.current.state.zoom,
+      "data-polycss-camera-distance": cameraRef.current.state.distance,
+      "data-polycss-camera-rot-x": cameraRef.current.state.rotX,
+      "data-polycss-camera-rot-y": cameraRef.current.state.rotY,
+      "data-polycss-camera-target": cameraRef.current.state.target.join(","),
+      children
+    }
+  ) });
+}
+var PolyThreeOrthographicCamera = (0, import_react5.memo)(PolyThreeOrthographicCameraInner);
+
+// src/three/PolyThreeMesh.tsx
+var import_react15 = require("react");
+var import_polycss_core16 = require("@layoutit/polycss-core");
+var import_three3 = require("@layoutit/polycss-core/three");
+
+// src/scene/PolyMesh.tsx
+var import_react14 = require("react");
+var import_polycss_core14 = require("@layoutit/polycss-core");
+
+// src/scene/useMesh.ts
+var import_react6 = require("react");
+var import_polycss_core2 = require("@layoutit/polycss-core");
+var EMPTY_POLYGONS = [];
+var EMPTY_WARNINGS = [];
+function usePolyMesh(src, options) {
+  const [state, setState] = (0, import_react6.useState)({
+    polygons: EMPTY_POLYGONS,
+    voxelSource: void 0,
+    loading: !!src,
+    error: null,
+    warnings: EMPTY_WARNINGS
+  });
+  const activeResultRef = (0, import_react6.useRef)(null);
+  const dispose = (0, import_react6.useCallback)(() => {
+    const r = activeResultRef.current;
+    if (r) {
+      try {
+        r.dispose();
+      } catch {
+      }
+      activeResultRef.current = null;
+    }
+  }, []);
+  (0, import_react6.useEffect)(() => {
+    if (!src) {
+      dispose();
+      setState({
+        polygons: EMPTY_POLYGONS,
+        voxelSource: void 0,
+        loading: false,
+        error: null,
+        warnings: EMPTY_WARNINGS
+      });
+      return;
+    }
+    let cancelled = false;
+    setState((prev) => ({ ...prev, loading: true, error: null }));
+    const prevResult = activeResultRef.current;
+    (0, import_polycss_core2.loadMesh)(src, options).then((result) => {
+      if (cancelled) {
+        try {
+          result.dispose();
+        } catch {
+        }
+        return;
+      }
+      if (prevResult) {
+        try {
+          prevResult.dispose();
+        } catch {
+        }
+      }
+      activeResultRef.current = result;
+      setState({
+        polygons: result.polygons,
+        voxelSource: result.voxelSource,
+        loading: false,
+        error: null,
+        warnings: result.warnings ?? EMPTY_WARNINGS
+      });
+    }).catch((err) => {
+      if (cancelled) return;
+      const error = err instanceof Error ? err : new Error(String(err));
+      setState((prev) => ({
+        polygons: prev.polygons,
+        voxelSource: prev.voxelSource,
+        loading: false,
+        error,
+        warnings: prev.warnings
+      }));
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [src, dispose]);
+  (0, import_react6.useEffect)(() => {
+    return () => dispose();
+  }, [dispose]);
+  return {
+    polygons: state.polygons,
+    voxelSource: state.voxelSource,
+    loading: state.loading,
+    error: state.error,
+    warnings: state.warnings,
+    dispose
+  };
+}
+
+// src/scene/PolyMesh.tsx
+var import_polycss_core15 = require("@layoutit/polycss-core");
+
+// src/scene/atlas/index.tsx
+var import_polycss_core12 = require("@layoutit/polycss-core");
+
+// src/scene/atlas/detection.ts
+var import_polycss_core3 = require("@layoutit/polycss-core");
+function borderShapeSupported(doc) {
+  const css = doc.defaultView?.CSS ?? (typeof CSS !== "undefined" ? CSS : void 0);
+  const supportsBorderShape = !!css?.supports?.(
+    "border-shape",
+    "polygon(0 0, 100% 0, 0 100%) circle(0)"
+  );
+  if (!supportsBorderShape) return false;
+  const win = doc.defaultView ?? (typeof window !== "undefined" ? window : void 0);
+  const media = win?.matchMedia;
+  if (!media) return true;
+  return media("(pointer: fine)").matches && media("(hover: hover)").matches;
+}
+function solidTriangleSupported(doc) {
+  if (cornerTriangleSupported(doc)) return true;
+  const win = doc.defaultView ?? (typeof window !== "undefined" ? window : void 0);
+  const userAgent = win?.navigator?.userAgent ?? "";
+  if (!userAgent) return true;
+  return !(0, import_polycss_core3.safariCssProjectiveUnsupported)(userAgent);
+}
+function cornerShapeSupported(doc) {
+  const css = doc.defaultView?.CSS ?? (typeof CSS !== "undefined" ? CSS : void 0);
+  return !!css?.supports?.("corner-top-left-shape", "bevel") && !!css.supports("corner-top-right-shape", "bevel") && !!css.supports("corner-bottom-right-shape", "bevel") && !!css.supports("corner-bottom-left-shape", "bevel");
+}
+function cornerTriangleSupported(doc) {
+  const css = doc.defaultView?.CSS ?? (typeof CSS !== "undefined" ? CSS : void 0);
+  return !!css?.supports?.("corner-top-left-shape", "bevel") && !!css.supports("corner-top-right-shape", "bevel");
+}
+function projectiveQuadSupported(doc) {
+  const win = doc.defaultView ?? (typeof window !== "undefined" ? window : void 0);
+  const userAgent = win?.navigator?.userAgent ?? "";
+  if (!userAgent) return true;
+  return !(0, import_polycss_core3.safariCssProjectiveUnsupported)(userAgent);
+}
+function getSolidPaintDefaultsForPlans(plans, textureLighting, doc, strategies, cornerShapeGeometryForPlanFn) {
+  const disabled = new Set(strategies?.disable ?? []);
+  return (0, import_polycss_core3.getSolidPaintDefaultsForPlansCore)(
+    plans,
+    textureLighting,
+    disabled,
+    {
+      solidTriangleSupported: solidTriangleSupported(doc),
+      projectiveQuadSupported: projectiveQuadSupported(doc),
+      cornerShapeSupported: cornerShapeSupported(doc),
+      borderShapeSupported: borderShapeSupported(doc)
+    },
+    import_polycss_core3.parseHex,
+    import_polycss_core3.rgbKey,
+    cornerShapeGeometryForPlanFn
+  );
+}
+function getSolidPaintDefaultsFromPlans(plans, textureLighting, disabled = /* @__PURE__ */ new Set(), doc) {
+  const resolvedDoc = doc ?? (typeof document !== "undefined" ? document : null);
+  if (!resolvedDoc) return {};
+  const strategies = disabled.size > 0 ? { disable: Array.from(disabled) } : void 0;
+  return getSolidPaintDefaultsForPlans(plans, textureLighting, resolvedDoc, strategies);
+}
+function isBorderShapeSupported(doc) {
+  const d = doc ?? (typeof document !== "undefined" ? document : null);
+  if (!d) {
+    const css = typeof CSS !== "undefined" ? CSS : void 0;
+    const supportsBorderShape = !!css?.supports?.("border-shape", "polygon(0 0, 100% 0, 0 100%) circle(0)");
+    if (!supportsBorderShape) return false;
+    const media = typeof matchMedia !== "undefined" ? matchMedia : void 0;
+    if (!media) return true;
+    return media("(pointer: fine)").matches && media("(hover: hover)").matches;
+  }
+  return borderShapeSupported(d);
+}
+function isSolidTriangleSupported(doc) {
+  const d = doc ?? (typeof document !== "undefined" ? document : null);
+  if (!d) {
+    const css = typeof CSS !== "undefined" ? CSS : void 0;
+    if (!!css?.supports?.("corner-top-left-shape", "bevel") && !!css.supports("corner-top-right-shape", "bevel")) return true;
+    const userAgent = (typeof navigator !== "undefined" ? navigator : globalThis.navigator)?.userAgent ?? "";
+    if (!userAgent) return true;
+    const isChromiumFamily = /\b(?:Chrome|HeadlessChrome|Chromium|Edg|OPR)\//.test(userAgent);
+    const isSafariFamily = /\bVersion\/[\d.]+.*\bSafari\//.test(userAgent);
+    return !isSafariFamily || isChromiumFamily;
+  }
+  return solidTriangleSupported(d);
+}
+
+// src/scene/atlas/filterPlans.ts
+var import_polycss_core4 = require("@layoutit/polycss-core");
+function filterAtlasPlans(plans, textureLighting, disabled, doc, textureBackend, textureImageRendering, textureProjection) {
+  const d = doc ?? (typeof document !== "undefined" ? document : null);
+  return (0, import_polycss_core4.filterAtlasPlans)(plans, textureLighting, disabled, {
+    solidTriangleSupported: isSolidTriangleSupported(doc),
+    projectiveQuadSupported: doc ? projectiveQuadSupported(doc) : true,
+    borderShapeSupported: isBorderShapeSupported(doc),
+    cornerShapeSupported: d ? cornerShapeSupported(d) : false,
+    textureBackend,
+    textureImageRendering,
+    textureProjection
+  });
+}
+
+// src/scene/atlas/packing.ts
+var import_polycss_core5 = require("@layoutit/polycss-core");
+function isMobileDocument(doc) {
+  if (!doc) return false;
+  const win = doc.defaultView ?? (typeof window !== "undefined" ? window : void 0);
+  const media = win?.matchMedia;
+  if (!media) return false;
+  return media("(pointer: coarse)").matches || media("(hover: none)").matches;
+}
+function packTextureAtlasPlansWithScale(plans, textureQualityInput, doc, textureLeafSizing) {
+  return (0, import_polycss_core5.packTextureAtlasPlansWithScaleCore)(
+    plans,
+    textureQualityInput,
+    isMobileDocument(doc),
+    textureLeafSizing
+  );
+}
+
+// src/scene/atlas/buildAtlasPages.ts
+var import_polycss_core6 = require("@layoutit/polycss-core");
+var TEXTURE_IMAGE_CACHE = /* @__PURE__ */ new Map();
+function loadTextureImage(url) {
+  let p = TEXTURE_IMAGE_CACHE.get(url);
+  if (!p) {
+    p = new Promise((resolve, reject) => {
+      const img = new Image();
+      img.decoding = "async";
+      img.crossOrigin = "anonymous";
+      img.onload = () => resolve(img);
+      img.onerror = () => reject(new Error(`texture load failed: ${url}`));
+      img.src = url;
+    });
+    TEXTURE_IMAGE_CACHE.set(url, p);
+    p.then(
+      () => {
+        if (TEXTURE_IMAGE_CACHE.get(url) === p) TEXTURE_IMAGE_CACHE.delete(url);
+      },
+      () => {
+        if (TEXTURE_IMAGE_CACHE.get(url) === p) TEXTURE_IMAGE_CACHE.delete(url);
+      }
+    );
+  }
+  return p;
+}
+function setCssTransform(ctx, atlasScale, a = 1, b = 0, c = 0, d = 1, e = 0, f = 0) {
+  ctx.setTransform(
+    a * atlasScale,
+    b * atlasScale,
+    c * atlasScale,
+    d * atlasScale,
+    e * atlasScale,
+    f * atlasScale
+  );
+}
+function srgbByteToLinear(c) {
+  const u = c / 255;
+  return u <= 0.04045 ? u / 12.92 : Math.pow((u + 0.055) / 1.055, 2.4);
+}
+function linearToSrgbByte(c) {
+  const s = c <= 31308e-7 ? c * 12.92 : 1.055 * Math.pow(c, 1 / 2.4) - 0.055;
+  return Math.max(0, Math.min(255, Math.round(s * 255)));
+}
+function applyTextureTint(ctx, x, y, width, height, tint, atlasScale) {
+  const px = Math.round(x * atlasScale);
+  const py = Math.round(y * atlasScale);
+  const pw = Math.max(1, Math.round(width * atlasScale));
+  const ph = Math.max(1, Math.round(height * atlasScale));
+  const img = ctx.getImageData(px, py, pw, ph);
+  const data = img.data;
+  const tr = tint.r, tg = tint.g, tb = tint.b;
+  for (let i = 0; i < data.length; i += 4) {
+    if (data[i + 3] === 0) continue;
+    data[i] = linearToSrgbByte(srgbByteToLinear(data[i]) * tr);
+    data[i + 1] = linearToSrgbByte(srgbByteToLinear(data[i + 1]) * tg);
+    data[i + 2] = linearToSrgbByte(srgbByteToLinear(data[i + 2]) * tb);
+  }
+  ctx.putImageData(img, px, py);
+}
+function drawImageCover(ctx, img, x, y, width, height, atlasScale) {
+  const srcW = img.naturalWidth || img.width || 1;
+  const srcH = img.naturalHeight || img.height || 1;
+  const scale = Math.max(width / srcW, height / srcH);
+  const drawW = srcW * scale;
+  const drawH = srcH * scale;
+  setCssTransform(ctx, atlasScale);
+  ctx.drawImage(img, x + (width - drawW) / 2, y + (height - drawH) / 2, drawW, drawH);
+}
+function clampSourceCoord(value, max) {
+  return Math.max(0, Math.min(max, value));
+}
+function drawImageUvSample(ctx, img, rect, x, y, width, height, atlasScale) {
+  const imgW = img.naturalWidth || img.width || 1;
+  const imgH = img.naturalHeight || img.height || 1;
+  const rawX0 = clampSourceCoord(Math.min(rect.minU, rect.maxU) * imgW, imgW);
+  const rawX1 = clampSourceCoord(Math.max(rect.minU, rect.maxU) * imgW, imgW);
+  const rawY0 = clampSourceCoord(Math.min(rect.minV, rect.maxV) * imgH, imgH);
+  const rawY1 = clampSourceCoord(Math.max(rect.minV, rect.maxV) * imgH, imgH);
+  let sx = Math.floor(rawX0);
+  let sy = Math.floor(rawY0);
+  let sw = Math.ceil(rawX1) - sx;
+  let sh = Math.ceil(rawY1) - sy;
+  if (sw < 1) {
+    sx = Math.floor(clampSourceCoord((rect.minU + rect.maxU) / 2 * imgW, imgW - 1));
+    sw = 1;
+  }
+  if (sh < 1) {
+    sy = Math.floor(clampSourceCoord((rect.minV + rect.maxV) / 2 * imgH, imgH - 1));
+    sh = 1;
+  }
+  sx = Math.max(0, Math.min(imgW - 1, sx));
+  sy = Math.max(0, Math.min(imgH - 1, sy));
+  sw = Math.max(1, Math.min(imgW - sx, sw));
+  sh = Math.max(1, Math.min(imgH - sy, sh));
+  setCssTransform(ctx, atlasScale);
+  ctx.drawImage(img, sx, sy, sw, sh, x, y, width, height);
+}
+function isTiledWrapMode(mode) {
+  return mode === "repeat" || mode === "mirrored-repeat";
+}
+function tiledRangeStart(mode, min) {
+  return isTiledWrapMode(mode) ? Math.floor(min) : 0;
+}
+function tiledRangeEnd(mode, max) {
+  return isTiledWrapMode(mode) ? Math.ceil(max) - 1 : 0;
+}
+function isMirroredTile(mode, tile) {
+  return mode === "mirrored-repeat" && Math.abs(tile % 2) === 1;
+}
+function drawWrappedImageTiles(ctx, img, imgW, imgH, uvSampleRect, wrapS, wrapT) {
+  const startS = uvSampleRect ? tiledRangeStart(wrapS, uvSampleRect.minU) : 0;
+  const endS = uvSampleRect ? tiledRangeEnd(wrapS, uvSampleRect.maxU) : 0;
+  const startT = uvSampleRect ? tiledRangeStart(wrapT, uvSampleRect.minV) : 0;
+  const endT = uvSampleRect ? tiledRangeEnd(wrapT, uvSampleRect.maxV) : 0;
+  for (let s = startS; s <= endS; s++) {
+    for (let t = startT; t <= endT; t++) {
+      const flipS = isMirroredTile(wrapS, s);
+      const flipT = isMirroredTile(wrapT, t);
+      if (!flipS && !flipT) {
+        ctx.drawImage(img, s * imgW, t * imgH);
+        continue;
+      }
+      ctx.save();
+      ctx.translate((flipS ? s + 1 : s) * imgW, (flipT ? t + 1 : t) * imgH);
+      ctx.scale(flipS ? -1 : 1, flipT ? -1 : 1);
+      ctx.drawImage(img, 0, 0);
+      ctx.restore();
+    }
+  }
+}
+function tracePolygonPath(ctx, x, y, points) {
+  for (let i = 0; i < points.length; i += 2) {
+    const px = x + points[i];
+    const py = y + points[i + 1];
+    if (i === 0) ctx.moveTo(px, py);
+    else ctx.lineTo(px, py);
+  }
+  ctx.closePath();
+}
+function traceOffsetPolygonPath(ctx, x, y, points, offsetX, offsetY) {
+  for (let i = 0; i < points.length; i += 2) {
+    const px = x + points[i] + offsetX;
+    const py = y + points[i + 1] + offsetY;
+    if (i === 0) ctx.moveTo(px, py);
+    else ctx.lineTo(px, py);
+  }
+  ctx.closePath();
+}
+function paintSolidAtlasEntry(ctx, entry, textureLighting, atlasScale) {
+  setCssTransform(ctx, atlasScale);
+  ctx.beginPath();
+  tracePolygonPath(ctx, entry.x, entry.y, entry.screenPts);
+  ctx.clip();
+  setCssTransform(ctx, atlasScale);
+  ctx.fillStyle = textureLighting === "dynamic" ? entry.polygon.color ?? "#cccccc" : entry.shadedColor;
+  ctx.fillRect(entry.x, entry.y, entry.canvasW, entry.canvasH);
+}
+function paintOpaqueTextureBase(ctx, entry, atlasScale, offsetX, offsetY) {
+  if (entry.polygon.textureAlphaMode !== "opaque") return;
+  setCssTransform(ctx, atlasScale);
+  ctx.fillStyle = entry.polygon.color ?? "#cccccc";
+  ctx.fillRect(entry.x + offsetX, entry.y + offsetY, entry.canvasW, entry.canvasH);
+}
+function drawTexturedAtlasEntry(ctx, entry, srcImg, atlasScale, offsetX = 0, offsetY = 0) {
+  if (entry.textureTriangles?.length) {
+    const imgW = srcImg.naturalWidth || srcImg.width || 1;
+    const imgH = srcImg.naturalHeight || srcImg.height || 1;
+    for (const triangle of entry.textureTriangles) {
+      const clipPts = (0, import_polycss_core6.expandClipPoints)(triangle.screenPts, import_polycss_core6.TEXTURE_TRIANGLE_BLEED);
+      ctx.save();
+      setCssTransform(ctx, atlasScale);
+      ctx.beginPath();
+      traceOffsetPolygonPath(ctx, entry.x, entry.y, clipPts, offsetX, offsetY);
+      ctx.clip();
+      paintOpaqueTextureBase(ctx, entry, atlasScale, offsetX, offsetY);
+      if (triangle.uvAffine) {
+        setCssTransform(
+          ctx,
+          atlasScale,
+          triangle.uvAffine.a / imgW,
+          triangle.uvAffine.c / imgW,
+          triangle.uvAffine.b / imgH,
+          triangle.uvAffine.d / imgH,
+          entry.x + triangle.uvAffine.e + offsetX,
+          entry.y + triangle.uvAffine.f + offsetY
+        );
+        drawWrappedImageTiles(
+          ctx,
+          srcImg,
+          imgW,
+          imgH,
+          triangle.uvSampleRect,
+          entry.polygon.textureWrap?.s,
+          entry.polygon.textureWrap?.t
+        );
+      } else if (triangle.uvSampleRect) {
+        drawImageUvSample(
+          ctx,
+          srcImg,
+          triangle.uvSampleRect,
+          entry.x + offsetX,
+          entry.y + offsetY,
+          entry.canvasW,
+          entry.canvasH,
+          atlasScale
+        );
+      }
+      ctx.restore();
+    }
+  } else if (entry.uvAffine) {
+    const imgW = srcImg.naturalWidth || srcImg.width || 1;
+    const imgH = srcImg.naturalHeight || srcImg.height || 1;
+    const clipOpaque = entry.polygon.textureAlphaMode === "opaque";
+    if (clipOpaque) {
+      ctx.save();
+      setCssTransform(ctx, atlasScale);
+      ctx.beginPath();
+      traceOffsetPolygonPath(ctx, entry.x, entry.y, entry.screenPts, offsetX, offsetY);
+      ctx.clip();
+      paintOpaqueTextureBase(ctx, entry, atlasScale, offsetX, offsetY);
+    }
+    setCssTransform(
+      ctx,
+      atlasScale,
+      entry.uvAffine.a / imgW,
+      entry.uvAffine.c / imgW,
+      entry.uvAffine.b / imgH,
+      entry.uvAffine.d / imgH,
+      entry.x + entry.uvAffine.e + offsetX,
+      entry.y + entry.uvAffine.f + offsetY
+    );
+    drawWrappedImageTiles(
+      ctx,
+      srcImg,
+      imgW,
+      imgH,
+      entry.uvSampleRect,
+      entry.polygon.textureWrap?.s,
+      entry.polygon.textureWrap?.t
+    );
+    if (clipOpaque) ctx.restore();
+  } else if (entry.uvSampleRect) {
+    const clipOpaque = entry.polygon.textureAlphaMode === "opaque";
+    if (clipOpaque) {
+      ctx.save();
+      setCssTransform(ctx, atlasScale);
+      ctx.beginPath();
+      traceOffsetPolygonPath(ctx, entry.x, entry.y, entry.screenPts, offsetX, offsetY);
+      ctx.clip();
+      paintOpaqueTextureBase(ctx, entry, atlasScale, offsetX, offsetY);
+    }
+    drawImageUvSample(
+      ctx,
+      srcImg,
+      entry.uvSampleRect,
+      entry.x + offsetX,
+      entry.y + offsetY,
+      entry.canvasW,
+      entry.canvasH,
+      atlasScale
+    );
+    if (clipOpaque) ctx.restore();
+  } else {
+    const clipOpaque = entry.polygon.textureAlphaMode === "opaque";
+    if (clipOpaque) {
+      ctx.save();
+      setCssTransform(ctx, atlasScale);
+      ctx.beginPath();
+      traceOffsetPolygonPath(ctx, entry.x, entry.y, entry.screenPts, offsetX, offsetY);
+      ctx.clip();
+      paintOpaqueTextureBase(ctx, entry, atlasScale, offsetX, offsetY);
+    }
+    drawImageCover(
+      ctx,
+      srcImg,
+      entry.x + offsetX,
+      entry.y + offsetY,
+      entry.canvasW,
+      entry.canvasH,
+      atlasScale
+    );
+    if (clipOpaque) ctx.restore();
+  }
+}
+function distanceToSegment(px, py, ax, ay, bx, by) {
+  const dx = bx - ax;
+  const dy = by - ay;
+  const lenSq = dx * dx + dy * dy;
+  if (lenSq <= 1e-9) return Math.hypot(px - ax, py - ay);
+  const t = Math.max(0, Math.min(1, ((px - ax) * dx + (py - ay) * dy) / lenSq));
+  return Math.hypot(px - (ax + dx * t), py - (ay + dy * t));
+}
+function distanceToPolygonEdges(px, py, points, edgeIndices) {
+  let best = Infinity;
+  const count = points.length / 2;
+  for (const edgeIndex of edgeIndices) {
+    if (edgeIndex < 0 || edgeIndex >= count) continue;
+    const i = edgeIndex * 2;
+    const next = (edgeIndex + 1) % count * 2;
+    best = Math.min(
+      best,
+      distanceToSegment(px, py, points[i], points[i + 1], points[next], points[next + 1])
+    );
+  }
+  return best;
+}
+function nearestOpaquePixelOffset(data, width, height, x, y, radius) {
+  const minX = Math.max(0, x - radius);
+  const maxX = Math.min(width - 1, x + radius);
+  const minY = Math.max(0, y - radius);
+  const maxY = Math.min(height - 1, y + radius);
+  let bestOffset = null;
+  let bestDistanceSq = Infinity;
+  for (let yy = minY; yy <= maxY; yy++) {
+    for (let xx = minX; xx <= maxX; xx++) {
+      if (xx === x && yy === y) continue;
+      const dx = xx - x;
+      const dy = yy - y;
+      const distanceSq = dx * dx + dy * dy;
+      if (distanceSq > radius * radius || distanceSq >= bestDistanceSq) continue;
+      const offset = (yy * width + xx) * 4;
+      if (data[offset + 3] < import_polycss_core6.TEXTURE_EDGE_REPAIR_SOURCE_ALPHA_MIN) continue;
+      bestOffset = offset;
+      bestDistanceSq = distanceSq;
+    }
+  }
+  return bestOffset;
+}
+function repairTextureEdgeAlpha(ctx, entry, atlasScale) {
+  if (!entry.textureEdgeRepair || !entry.texture) return;
+  if (!entry.textureEdgeRepairEdges || entry.textureEdgeRepairEdges.size === 0) return;
+  const canvas = ctx.canvas;
+  if (!canvas) return;
+  const pixelX = Math.max(0, Math.floor(entry.x * atlasScale));
+  const pixelY = Math.max(0, Math.floor(entry.y * atlasScale));
+  const pixelW = Math.max(1, Math.min(canvas.width - pixelX, Math.ceil(entry.canvasW * atlasScale)));
+  const pixelH = Math.max(1, Math.min(canvas.height - pixelY, Math.ceil(entry.canvasH * atlasScale)));
+  if (pixelW <= 0 || pixelH <= 0) return;
+  let imageData;
+  try {
+    imageData = ctx.getImageData(pixelX, pixelY, pixelW, pixelH);
+  } catch {
+    return;
+  }
+  const data = imageData.data;
+  const source = new Uint8ClampedArray(data);
+  const radius = Math.max(import_polycss_core6.TEXTURE_EDGE_REPAIR_RADIUS, import_polycss_core6.TEXTURE_EDGE_REPAIR_RADIUS / atlasScale);
+  const sourceRadius = Math.max(2, Math.ceil(radius * atlasScale) + 1);
+  let changed = false;
+  for (let y = 0; y < pixelH; y++) {
+    for (let x = 0; x < pixelW; x++) {
+      const offset = (y * pixelW + x) * 4;
+      const alpha = data[offset + 3];
+      if (alpha < import_polycss_core6.TEXTURE_EDGE_REPAIR_ALPHA_MIN || alpha === 255) continue;
+      const localX = (pixelX + x + 0.5) / atlasScale - entry.x;
+      const localY = (pixelY + y + 0.5) / atlasScale - entry.y;
+      if (distanceToPolygonEdges(localX, localY, entry.screenPts, entry.textureEdgeRepairEdges) > radius) {
+        continue;
+      }
+      const sourceOffset = nearestOpaquePixelOffset(source, pixelW, pixelH, x, y, sourceRadius);
+      if (sourceOffset === null) continue;
+      data[offset] = source[sourceOffset];
+      data[offset + 1] = source[sourceOffset + 1];
+      data[offset + 2] = source[sourceOffset + 2];
+      data[offset + 3] = 255;
+      changed = true;
+    }
+  }
+  if (!changed) return;
+  ctx.putImageData(imageData, pixelX, pixelY);
+}
+function canvasToUrl(canvas) {
+  if (typeof canvas.toBlob === "function") {
+    return new Promise((resolve) => {
+      canvas.toBlob((blob) => {
+        resolve(blob ? URL.createObjectURL(blob) : null);
+      }, "image/png");
+    });
+  }
+  try {
+    return Promise.resolve(canvas.toDataURL("image/png"));
+  } catch {
+    return Promise.resolve(null);
+  }
+}
+async function buildAtlasPage(page, textureLighting, doc, atlasScale) {
+  const canvas = doc.createElement("canvas");
+  canvas.width = Math.max(1, Math.ceil(page.width * atlasScale));
+  canvas.height = Math.max(1, Math.ceil(page.height * atlasScale));
+  const needsReadback = page.entries.some(
+    (entry) => entry.textureEdgeRepair && entry.texture && entry.textureEdgeRepairEdges && entry.textureEdgeRepairEdges.size > 0
+  );
+  const ctx = canvas.getContext("2d", needsReadback ? { willReadFrequently: true } : void 0);
+  if (!ctx) return { width: page.width, height: page.height, url: null };
+  const uniqueTextures = Array.from(new Set(
+    page.entries.flatMap((entry) => entry.texture ? [entry.texture] : [])
+  ));
+  const loaded = /* @__PURE__ */ new Map();
+  await Promise.all(uniqueTextures.map(async (url2) => {
+    loaded.set(url2, await loadTextureImage(url2));
+  }));
+  for (const entry of page.entries) {
+    const srcImg = entry.texture ? loaded.get(entry.texture) : null;
+    if (!entry.texture) {
+      ctx.save();
+      paintSolidAtlasEntry(ctx, entry, textureLighting, atlasScale);
+      ctx.restore();
+      continue;
+    }
+    if (srcImg) {
+      ctx.save();
+      setCssTransform(
+        ctx,
+        atlasScale
+      );
+      ctx.beginPath();
+      tracePolygonPath(ctx, entry.x, entry.y, entry.screenPts);
+      ctx.clip();
+      drawTexturedAtlasEntry(ctx, entry, srcImg, atlasScale);
+      ctx.restore();
+    }
+    if (entry.texture && textureLighting === "baked") {
+      ctx.save();
+      setCssTransform(ctx, atlasScale);
+      ctx.beginPath();
+      tracePolygonPath(ctx, entry.x, entry.y, entry.screenPts);
+      ctx.clip();
+      applyTextureTint(ctx, entry.x, entry.y, entry.canvasW, entry.canvasH, entry.textureTint, atlasScale);
+      ctx.restore();
+    }
+    repairTextureEdgeAlpha(ctx, entry, atlasScale);
+  }
+  const url = await canvasToUrl(canvas);
+  canvas.width = 1;
+  canvas.height = 1;
+  return {
+    width: page.width,
+    height: page.height,
+    url
+  };
+}
+async function buildAtlasPages(pages, textureLighting, doc, atlasScale, isCancelled) {
+  const built = [];
+  for (const page of pages) {
+    if (isCancelled()) break;
+    built.push(await buildAtlasPage(page, textureLighting, doc, atlasScale));
+  }
+  return built;
+}
+
+// src/scene/atlas/solidTriangleStyle.ts
+var import_polycss_core7 = require("@layoutit/polycss-core");
+var DEFAULT_TILE = 50;
+var DEFAULT_LIGHT_DIR = [0.4, -0.7, 0.59];
+var DEFAULT_LIGHT_COLOR = "#ffffff";
+var DEFAULT_LIGHT_INTENSITY = 1;
+var DEFAULT_AMBIENT_COLOR = "#ffffff";
+var DEFAULT_AMBIENT_INTENSITY = 0.4;
+var BASIS_EPS = 1e-9;
+var SOLID_TRIANGLE_BLEED = 0.75;
+var SOLID_TRIANGLE_CANONICAL_SIZE = 32;
+var SOLID_TRIANGLE_LARGE_BORDER_CANONICAL_SIZE = 96;
+var SOLID_TRIANGLE_LARGE_BORDER_WIDTH = "0 48px 96px 48px";
+var cachedSolidTriangleUserAgent;
+var cachedSolidTriangleCanonicalSize = SOLID_TRIANGLE_CANONICAL_SIZE;
+function cornerTriangleSupported2() {
+  const css = typeof CSS !== "undefined" ? CSS : void 0;
+  return !!css?.supports?.("corner-top-left-shape", "bevel") && !!css.supports("corner-top-right-shape", "bevel");
+}
+function solidTrianglePrimitive() {
+  if (cornerTriangleSupported2()) return "corner-bevel";
+  const ua = typeof navigator !== "undefined" ? navigator.userAgent : "";
+  return /\bFirefox\//.test(ua) ? "border-large" : "border";
+}
+function solidTriangleCanonicalSize() {
+  const ua = typeof navigator !== "undefined" ? navigator.userAgent : "";
+  if (ua !== cachedSolidTriangleUserAgent) {
+    cachedSolidTriangleUserAgent = ua;
+    cachedSolidTriangleCanonicalSize = /\bFirefox\//.test(ua) ? SOLID_TRIANGLE_LARGE_BORDER_CANONICAL_SIZE : SOLID_TRIANGLE_CANONICAL_SIZE;
+  }
+  return cachedSolidTriangleCanonicalSize;
+}
+function solidTriangleBorderWidth() {
+  return solidTrianglePrimitive() === "border-large" ? SOLID_TRIANGLE_LARGE_BORDER_WIDTH : void 0;
+}
+function solidTrianglePaintStyle() {
+  const primitive = solidTrianglePrimitive();
+  if (primitive === "corner-bevel") return void 0;
+  const borderWidth = primitive === "border-large" ? SOLID_TRIANGLE_LARGE_BORDER_WIDTH : void 0;
+  return borderWidth ? { borderWidth } : void 0;
+}
+function applySolidTrianglePaintStyle(el) {
+  const primitive = solidTrianglePrimitive();
+  if (primitive === "corner-bevel") {
+    el.style.width = "";
+    el.style.height = "";
+    el.style.backgroundColor = "";
+    el.style.borderWidth = "";
+    el.style.borderTopLeftRadius = "";
+    el.style.borderTopRightRadius = "";
+    el.style.removeProperty("corner-top-left-shape");
+    el.style.removeProperty("corner-top-right-shape");
+  } else {
+    el.style.width = "";
+    el.style.height = "";
+    el.style.backgroundColor = "";
+    el.style.borderTopLeftRadius = "";
+    el.style.borderTopRightRadius = "";
+    el.style.removeProperty("corner-top-left-shape");
+    el.style.removeProperty("corner-top-right-shape");
+    el.style.borderWidth = primitive === "border-large" ? SOLID_TRIANGLE_LARGE_BORDER_WIDTH : "";
+  }
+}
+function parseHex2(hex) {
+  const parsed = (0, import_polycss_core7.parsePureColor)(hex);
+  if (!parsed) return { r: 255, g: 255, b: 255 };
+  return { r: parsed.rgb[0], g: parsed.rgb[1], b: parsed.rgb[2] };
+}
+function rgbKey2({ r, g, b }) {
+  return `${r},${g},${b}`;
+}
+function parseAlpha(input) {
+  return (0, import_polycss_core7.parsePureColor)(input)?.alpha ?? 1;
+}
+function rgbToHex({ r, g, b }) {
+  const f = (n) => Math.round(Math.max(0, Math.min(255, n))).toString(16).padStart(2, "0");
+  return `#${f(r)}${f(g)}${f(b)}`;
+}
+function shadePolygon(baseColor, directScale, lightColor, ambientColor, ambientIntensity) {
+  const base = parseHex2(baseColor);
+  const light = parseHex2(lightColor);
+  const amb = parseHex2(ambientColor);
+  const tintR = amb.r / 255 * ambientIntensity + light.r / 255 * directScale;
+  const tintG = amb.g / 255 * ambientIntensity + light.g / 255 * directScale;
+  const tintB = amb.b / 255 * ambientIntensity + light.b / 255 * directScale;
+  const r = Math.max(0, Math.min(255, Math.round(base.r * tintR)));
+  const g = Math.max(0, Math.min(255, Math.round(base.g * tintG)));
+  const b = Math.max(0, Math.min(255, Math.round(base.b * tintB)));
+  const alpha = parseAlpha(baseColor);
+  return alpha < 1 ? `rgba(${r}, ${g}, ${b}, ${alpha})` : rgbToHex({ r, g, b });
+}
+function quantizeCssColor(input, steps) {
+  if (!Number.isFinite(steps) || steps <= 1) return input;
+  const parsed = (0, import_polycss_core7.parsePureColor)(input);
+  if (!parsed) return input;
+  const channelStep = 255 / Math.max(1, Math.round(steps) - 1);
+  const quantize = (value) => Math.max(0, Math.min(255, Math.round(Math.round(value / channelStep) * channelStep)));
+  const rgb = {
+    r: quantize(parsed.rgb[0]),
+    g: quantize(parsed.rgb[1]),
+    b: quantize(parsed.rgb[2])
+  };
+  return parsed.alpha < 1 ? `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${parsed.alpha})` : rgbToHex(rgb);
+}
+function stepRgbToward(current, target, maxStep) {
+  const step = (from, to) => {
+    if (from === to) return from;
+    const delta = to - from;
+    return from + Math.sign(delta) * Math.min(Math.abs(delta), maxStep);
+  };
+  return {
+    r: step(current.r, target.r),
+    g: step(current.g, target.g),
+    b: step(current.b, target.b)
+  };
+}
+function dotVec(a, b) {
+  return a[0] * b[0] + a[1] * b[1] + a[2] * b[2];
+}
+function crossVec(a, b) {
+  return [
+    a[1] * b[2] - a[2] * b[1],
+    a[2] * b[0] - a[0] * b[2],
+    a[0] * b[1] - a[1] * b[0]
+  ];
+}
+function computeSurfaceNormal(pts) {
+  if (pts.length < 3) return null;
+  const p0 = pts[0];
+  const normal = [0, 0, 0];
+  for (let i = 1; i + 1 < pts.length; i++) {
+    const p1 = pts[i];
+    const p2 = pts[i + 1];
+    const e1 = [p1[0] - p0[0], p1[1] - p0[1], p1[2] - p0[2]];
+    const e2 = [p2[0] - p0[0], p2[1] - p0[1], p2[2] - p0[2]];
+    normal[0] -= e1[1] * e2[2] - e1[2] * e2[1];
+    normal[1] -= e1[2] * e2[0] - e1[0] * e2[2];
+    normal[2] -= e1[0] * e2[1] - e1[1] * e2[0];
+  }
+  const len = Math.hypot(normal[0], normal[1], normal[2]);
+  if (len <= BASIS_EPS) return null;
+  return [normal[0] / len, normal[1] / len, normal[2] / len];
+}
+function isConvexPolygonPoints(points) {
+  if (points.length < 3) return false;
+  let sign = 0;
+  for (let i = 0; i < points.length; i++) {
+    const a = points[i];
+    const b = points[(i + 1) % points.length];
+    const c = points[(i + 2) % points.length];
+    const cross = (b[0] - a[0]) * (c[1] - b[1]) - (b[1] - a[1]) * (c[0] - b[0]);
+    if (Math.abs(cross) <= BASIS_EPS) return false;
+    const nextSign = Math.sign(cross);
+    if (sign === 0) sign = nextSign;
+    else if (nextSign !== sign) return false;
+  }
+  return true;
+}
+function signedArea2D(points) {
+  let area = 0;
+  for (let i = 0; i < points.length; i++) {
+    const a = points[i];
+    const b = points[(i + 1) % points.length];
+    area += a[0] * b[1] - a[1] * b[0];
+  }
+  return area / 2;
+}
+function intersect2DLines(a0, a1, b0, b1) {
+  const rx = a1[0] - a0[0];
+  const ry = a1[1] - a0[1];
+  const sx = b1[0] - b0[0];
+  const sy = b1[1] - b0[1];
+  const det = rx * sy - ry * sx;
+  if (Math.abs(det) <= BASIS_EPS) return null;
+  const qpx = b0[0] - a0[0];
+  const qpy = b0[1] - a0[1];
+  const t = (qpx * sy - qpy * sx) / det;
+  return [a0[0] + t * rx, a0[1] + t * ry];
+}
+function expandClipPoints2(points, amount) {
+  if (points.length < 6 || amount <= 0) return points;
+  let cx = 0;
+  let cy = 0;
+  const count = points.length / 2;
+  for (let i = 0; i < points.length; i += 2) {
+    cx += points[i];
+    cy += points[i + 1];
+  }
+  cx /= count;
+  cy /= count;
+  const expanded = points.slice();
+  for (let i = 0; i < expanded.length; i += 2) {
+    const dx = expanded[i] - cx;
+    const dy = expanded[i + 1] - cy;
+    const len = Math.hypot(dx, dy);
+    if (len <= BASIS_EPS) continue;
+    expanded[i] += dx / len * amount;
+    expanded[i + 1] += dy / len * amount;
+  }
+  return expanded;
+}
+function offsetConvexPolygonPoints(points, amount) {
+  if (points.length < 6 || points.length % 2 !== 0 || amount <= 0) return points;
+  const q = [];
+  for (let i = 0; i < points.length; i += 2) q.push([points[i], points[i + 1]]);
+  if (!isConvexPolygonPoints(q)) return expandClipPoints2(points, amount);
+  const area = signedArea2D(q);
+  if (Math.abs(area) <= BASIS_EPS) return expandClipPoints2(points, amount);
+  const outwardSign = area > 0 ? 1 : -1;
+  const offsetLines = [];
+  for (let i = 0; i < q.length; i++) {
+    const a = q[i];
+    const b = q[(i + 1) % q.length];
+    const dx = b[0] - a[0];
+    const dy = b[1] - a[1];
+    const length = Math.hypot(dx, dy);
+    if (length <= BASIS_EPS) return expandClipPoints2(points, amount);
+    const ox = outwardSign * (dy / length) * amount;
+    const oy = outwardSign * (-dx / length) * amount;
+    offsetLines.push({ a: [a[0] + ox, a[1] + oy], b: [b[0] + ox, b[1] + oy] });
+  }
+  const expanded = [];
+  const maxMiter = Math.max(2, amount * 4);
+  for (let i = 0; i < q.length; i++) {
+    const prev = offsetLines[(i + q.length - 1) % q.length];
+    const next = offsetLines[i];
+    const intersection = intersect2DLines(prev.a, prev.b, next.a, next.b);
+    if (!intersection) return expandClipPoints2(points, amount);
+    const original = q[i];
+    const dx = intersection[0] - original[0];
+    const dy = intersection[1] - original[1];
+    const miter = Math.hypot(dx, dy);
+    if (miter > maxMiter) {
+      expanded.push(original[0] + dx / miter * maxMiter, original[1] + dy / miter * maxMiter);
+    } else {
+      expanded.push(intersection[0], intersection[1]);
+    }
+  }
+  return expanded;
+}
+function offsetStableTrianglePoints(left, right, height, amount) {
+  const baseWidth = left + right;
+  if (amount <= 0 || height <= BASIS_EPS || baseWidth <= BASIS_EPS || !Number.isFinite(left + right + height + amount)) {
+    return offsetConvexPolygonPoints([left, 0, 0, height, baseWidth, height], amount);
+  }
+  const leftLen = Math.sqrt(left * left + height * height);
+  const rightLen = Math.sqrt(right * right + height * height);
+  if (leftLen <= BASIS_EPS || rightLen <= BASIS_EPS) {
+    return offsetConvexPolygonPoints([left, 0, 0, height, baseWidth, height], amount);
+  }
+  const leftOffsetX = -amount * height / leftLen;
+  const leftOffsetY = -amount * left / leftLen;
+  const rightOffsetX = amount * height / rightLen;
+  const rightOffsetY = -amount * right / rightLen;
+  const apexLineLeftX = left + leftOffsetX;
+  const apexLineLeftY = leftOffsetY;
+  const apexLineRightX = baseWidth + rightOffsetX;
+  const apexLineRightY = height + rightOffsetY;
+  const det = -height * baseWidth;
+  if (Math.abs(det) <= BASIS_EPS) {
+    return offsetConvexPolygonPoints([left, 0, 0, height, baseWidth, height], amount);
+  }
+  const qx = apexLineLeftX - apexLineRightX;
+  const qy = apexLineLeftY - apexLineRightY;
+  const t = (qx * height + qy * left) / det;
+  let apexX = apexLineRightX - t * right;
+  let apexY = apexLineRightY - t * height;
+  let baseLeftX = -amount * (left + leftLen) / height;
+  let baseLeftY = height + amount;
+  let baseRightX = baseWidth + amount * (right + rightLen) / height;
+  let baseRightY = baseLeftY;
+  const maxMiter = Math.max(2, amount * 4);
+  const apexDx = apexX - left;
+  const apexDy = apexY;
+  const apexMiter = Math.sqrt(apexDx * apexDx + apexDy * apexDy);
+  if (apexMiter > maxMiter) {
+    apexX = left + apexDx / apexMiter * maxMiter;
+    apexY = apexDy / apexMiter * maxMiter;
+  }
+  const leftMiter = Math.sqrt(baseLeftX * baseLeftX + amount * amount);
+  if (leftMiter > maxMiter) {
+    baseLeftX = baseLeftX / leftMiter * maxMiter;
+    baseLeftY = height + amount / leftMiter * maxMiter;
+  }
+  const rightDx = baseRightX - baseWidth;
+  const rightMiter = Math.sqrt(rightDx * rightDx + amount * amount);
+  if (rightMiter > maxMiter) {
+    baseRightX = baseWidth + rightDx / rightMiter * maxMiter;
+    baseRightY = height + amount / rightMiter * maxMiter;
+  }
+  return [apexX, apexY, baseLeftX, baseLeftY, baseRightX, baseRightY];
+}
+function triangleEdgeIndexForPair(a, b) {
+  if ((a + 1) % 3 === b) return a;
+  if ((b + 1) % 3 === a) return b;
+  return void 0;
+}
+function stableTriangleEdgeAmounts(entry, a, b, c, screenPts) {
+  const seamEdges = entry.seamBleedEdges;
+  if (!seamEdges?.size) return null;
+  const seamAmount = entry.seamBleed === void 0 ? SOLID_TRIANGLE_BLEED : entry.seamBleed;
+  const edgePairs = [[c, a], [a, b], [b, c]];
+  return edgePairs.map(([from, to], localEdgeIndex) => {
+    const edgeIndex = triangleEdgeIndexForPair(from, to);
+    const requested = edgeIndex !== void 0 && seamEdges.has(edgeIndex) ? entry.seamBleedEdgeAmounts?.get(edgeIndex) ?? (0, import_polycss_core7.resolveSeamBleed)(seamAmount, SOLID_TRIANGLE_BLEED) : 0;
+    return (0, import_polycss_core7.safePlanSeamBleedAmount)(screenPts, localEdgeIndex, requested);
+  });
+}
+function formatStableTriangleTransformScalars(x0, x1, x2, y0, y1, y2, z0, z1, z2, tx0, tx1, tx2) {
+  const rx0 = Math.round(x0 * 1e3) / 1e3 || 0;
+  const rx1 = Math.round(x1 * 1e3) / 1e3 || 0;
+  const rx2 = Math.round(x2 * 1e3) / 1e3 || 0;
+  const ry0 = Math.round(y0 * 1e3) / 1e3 || 0;
+  const ry1 = Math.round(y1 * 1e3) / 1e3 || 0;
+  const ry2 = Math.round(y2 * 1e3) / 1e3 || 0;
+  const rz0 = Math.round(z0 * 1e3) / 1e3 || 0;
+  const rz1 = Math.round(z1 * 1e3) / 1e3 || 0;
+  const rz2 = Math.round(z2 * 1e3) / 1e3 || 0;
+  const rtx0 = Math.round(tx0 * 1e3) / 1e3 || 0;
+  const rtx1 = Math.round(tx1 * 1e3) / 1e3 || 0;
+  const rtx2 = Math.round(tx2 * 1e3) / 1e3 || 0;
+  return `matrix3d(${rx0},${rx1},${rx2},0,${ry0},${ry1},${ry2},0,${rz0},${rz1},${rz2},0,${rtx0},${rtx1},${rtx2},1)`;
+}
+function cssPoints(vertices, tile, elev) {
+  return vertices.map((v) => [v[1] * tile, v[0] * tile, v[2] * elev]);
+}
+function solidTriangleStyle(entry, textureLighting, pointerEvents, solidPaintDefaults) {
+  if (!(0, import_polycss_core7.isSolidTrianglePlan)(entry)) return null;
+  const tile = entry.tileSize;
+  const elev = entry.layerElevation;
+  const pts = cssPoints(entry.polygon.vertices, tile, elev);
+  const normal = computeSurfaceNormal(pts);
+  if (!normal) return null;
+  const edges = [
+    { a: 0, b: 1, c: 2 },
+    { a: 1, b: 2, c: 0 },
+    { a: 2, b: 0, c: 1 }
+  ].map((edge) => {
+    const av2 = pts[edge.a];
+    const bv2 = pts[edge.b];
+    return {
+      ...edge,
+      length: Math.hypot(bv2[0] - av2[0], bv2[1] - av2[1], bv2[2] - av2[2])
+    };
+  }).sort((a2, b2) => b2.length - a2.length);
+  let a = edges[0].a;
+  let b = edges[0].b;
+  const c = edges[0].c;
+  let av = pts[a];
+  let bv = pts[b];
+  const cv = pts[c];
+  let baseLength = edges[0].length;
+  if (baseLength <= BASIS_EPS) return null;
+  let xAxis = [
+    (bv[0] - av[0]) / baseLength,
+    (bv[1] - av[1]) / baseLength,
+    (bv[2] - av[2]) / baseLength
+  ];
+  const ac = [cv[0] - av[0], cv[1] - av[1], cv[2] - av[2]];
+  let apexX = dotVec(ac, xAxis);
+  let foot = [
+    av[0] + xAxis[0] * apexX,
+    av[1] + xAxis[1] * apexX,
+    av[2] + xAxis[2] * apexX
+  ];
+  let yAxisRaw = [foot[0] - cv[0], foot[1] - cv[1], foot[2] - cv[2]];
+  const height = Math.hypot(yAxisRaw[0], yAxisRaw[1], yAxisRaw[2]);
+  if (height <= BASIS_EPS) return null;
+  let yAxis = [yAxisRaw[0] / height, yAxisRaw[1] / height, yAxisRaw[2] / height];
+  if (dotVec(crossVec(xAxis, yAxis), normal) < 0) {
+    const nextA = b;
+    b = a;
+    a = nextA;
+    av = pts[a];
+    bv = pts[b];
+    baseLength = Math.hypot(bv[0] - av[0], bv[1] - av[1], bv[2] - av[2]);
+    if (baseLength <= BASIS_EPS) return null;
+    xAxis = [
+      (bv[0] - av[0]) / baseLength,
+      (bv[1] - av[1]) / baseLength,
+      (bv[2] - av[2]) / baseLength
+    ];
+    const nextAc = [cv[0] - av[0], cv[1] - av[1], cv[2] - av[2]];
+    apexX = dotVec(nextAc, xAxis);
+    foot = [
+      av[0] + xAxis[0] * apexX,
+      av[1] + xAxis[1] * apexX,
+      av[2] + xAxis[2] * apexX
+    ];
+    yAxisRaw = [foot[0] - cv[0], foot[1] - cv[1], foot[2] - cv[2]];
+    const nextHeight = Math.hypot(yAxisRaw[0], yAxisRaw[1], yAxisRaw[2]);
+    if (nextHeight <= BASIS_EPS) return null;
+    yAxis = [yAxisRaw[0] / nextHeight, yAxisRaw[1] / nextHeight, yAxisRaw[2] / nextHeight];
+  }
+  const canonicalSize = solidTriangleCanonicalSize();
+  const left = Math.max(0, Math.min(baseLength, apexX));
+  const right = Math.max(0, baseLength - left);
+  const screenPts = [left, 0, 0, height, left + right, height];
+  const edgeAmounts = stableTriangleEdgeAmounts(entry, a, b, c, screenPts);
+  const expanded = edgeAmounts ? (0, import_polycss_core7.offsetConvexPolygonPointsByEdgeAmounts)(screenPts, edgeAmounts) : offsetStableTrianglePoints(
+    left,
+    right,
+    height,
+    (0, import_polycss_core7.resolveSeamBleed)(entry.seamBleed, SOLID_TRIANGLE_BLEED)
+  );
+  const apex2 = [expanded[0], expanded[1]];
+  const baseLeft2 = [expanded[2], expanded[3]];
+  const baseRight2 = [expanded[4], expanded[5]];
+  const baseY = (baseLeft2[1] + baseRight2[1]) / 2;
+  const leftPx = apex2[0] - baseLeft2[0];
+  const rightPx = baseRight2[0] - apex2[0];
+  const heightPx = baseY - apex2[1];
+  if (leftPx <= BASIS_EPS || rightPx <= BASIS_EPS || heightPx <= BASIS_EPS || !Number.isFinite(leftPx + rightPx + heightPx)) {
+    return null;
+  }
+  const dynamic = textureLighting === "dynamic";
+  const base = parseHex2(entry.polygon.color ?? "#cccccc");
+  const useDefaultDynamicColor = dynamic && rgbKey2(base) === solidPaintDefaults?.dynamicColorKey;
+  const sharedStyle = {
+    color: dynamic || entry.shadedColor === solidPaintDefaults?.paintColor ? void 0 : entry.shadedColor,
+    pointerEvents: pointerEvents === "none" ? "none" : void 0,
+    ...dynamic && !useDefaultDynamicColor ? {
+      ["--pnx"]: normal[0].toFixed(4),
+      ["--pny"]: normal[1].toFixed(4),
+      ["--pnz"]: normal[2].toFixed(4),
+      ["--psr"]: (base.r / 255).toFixed(4),
+      ["--psg"]: (base.g / 255).toFixed(4),
+      ["--psb"]: (base.b / 255).toFixed(4)
+    } : dynamic ? {
+      ["--pnx"]: normal[0].toFixed(4),
+      ["--pny"]: normal[1].toFixed(4),
+      ["--pnz"]: normal[2].toFixed(4)
+    } : null
+  };
+  const worldPoint = ([x, y]) => [
+    cv[0] + (x - left) * xAxis[0] + y * yAxis[0],
+    cv[1] + (x - left) * xAxis[1] + y * yAxis[1],
+    cv[2] + (x - left) * xAxis[2] + y * yAxis[2]
+  ];
+  const apex = worldPoint(apex2);
+  const baseLeft = worldPoint([baseLeft2[0], baseY]);
+  const baseRight = worldPoint([baseRight2[0], baseY]);
+  const halfBase = canonicalSize / 2;
+  const xCol = [
+    (baseRight[0] - baseLeft[0]) / canonicalSize,
+    (baseRight[1] - baseLeft[1]) / canonicalSize,
+    (baseRight[2] - baseLeft[2]) / canonicalSize
+  ];
+  const txCol = [
+    apex[0] - xCol[0] * halfBase,
+    apex[1] - xCol[1] * halfBase,
+    apex[2] - xCol[2] * halfBase
+  ];
+  const yCol = [
+    (baseLeft[0] - txCol[0]) / canonicalSize,
+    (baseLeft[1] - txCol[1]) / canonicalSize,
+    (baseLeft[2] - txCol[2]) / canonicalSize
+  ];
+  const canonicalMatrix = [
+    xCol[0],
+    xCol[1],
+    xCol[2],
+    0,
+    yCol[0],
+    yCol[1],
+    yCol[2],
+    0,
+    normal[0],
+    normal[1],
+    normal[2],
+    0,
+    txCol[0],
+    txCol[1],
+    txCol[2],
+    1
+  ].map((v) => (Math.round(v * 1e3) / 1e3 || 0).toString()).join(",");
+  const primitiveStyle = solidTrianglePaintStyle();
+  return {
+    transform: `matrix3d(${canonicalMatrix})`,
+    ...primitiveStyle ?? {},
+    ...sharedStyle
+  };
+}
+
+// src/scene/atlas/stableTriangleDom.ts
+function isStableTriangleBasis(value) {
+  if (!value) return false;
+  const { a, b, c } = value;
+  return a === 0 && b === 1 && c === 2 || a === 1 && b === 2 && c === 0 || a === 2 && b === 0 && c === 1;
+}
+function offsetStableTrianglePoints2(left, right, height, amount) {
+  const baseWidth = left + right;
+  if (amount <= 0 || height <= BASIS_EPS || baseWidth <= BASIS_EPS || !Number.isFinite(left + right + height + amount)) {
+    return offsetConvexPolygonPoints([left, 0, 0, height, baseWidth, height], amount);
+  }
+  const leftLen = Math.sqrt(left * left + height * height);
+  const rightLen = Math.sqrt(right * right + height * height);
+  if (leftLen <= BASIS_EPS || rightLen <= BASIS_EPS) {
+    return offsetConvexPolygonPoints([left, 0, 0, height, baseWidth, height], amount);
+  }
+  const leftOffsetX = -amount * height / leftLen;
+  const leftOffsetY = -amount * left / leftLen;
+  const rightOffsetX = amount * height / rightLen;
+  const rightOffsetY = -amount * right / rightLen;
+  const apexLineLeftX = left + leftOffsetX;
+  const apexLineLeftY = leftOffsetY;
+  const apexLineRightX = baseWidth + rightOffsetX;
+  const apexLineRightY = height + rightOffsetY;
+  const det = -height * baseWidth;
+  if (Math.abs(det) <= BASIS_EPS) {
+    return offsetConvexPolygonPoints([left, 0, 0, height, baseWidth, height], amount);
+  }
+  const qx = apexLineLeftX - apexLineRightX;
+  const qy = apexLineLeftY - apexLineRightY;
+  const t = (qx * height + qy * left) / det;
+  let apexX = apexLineRightX - t * right;
+  let apexY = apexLineRightY - t * height;
+  let baseLeftX = -amount * (left + leftLen) / height;
+  let baseLeftY = height + amount;
+  let baseRightX = baseWidth + amount * (right + rightLen) / height;
+  let baseRightY = baseLeftY;
+  const maxMiter = Math.max(2, amount * 4);
+  const apexDx = apexX - left;
+  const apexDy = apexY;
+  const apexMiter = Math.sqrt(apexDx * apexDx + apexDy * apexDy);
+  if (apexMiter > maxMiter) {
+    apexX = left + apexDx / apexMiter * maxMiter;
+    apexY = apexDy / apexMiter * maxMiter;
+  }
+  const leftMiter = Math.sqrt(baseLeftX * baseLeftX + amount * amount);
+  if (leftMiter > maxMiter) {
+    baseLeftX = baseLeftX / leftMiter * maxMiter;
+    baseLeftY = height + amount / leftMiter * maxMiter;
+  }
+  const rightDx = baseRightX - baseWidth;
+  const rightMiter = Math.sqrt(rightDx * rightDx + amount * amount);
+  if (rightMiter > maxMiter) {
+    baseRightX = baseWidth + rightDx / rightMiter * maxMiter;
+    baseRightY = height + amount / rightMiter * maxMiter;
+  }
+  return [apexX, apexY, baseLeftX, baseLeftY, baseRightX, baseRightY];
+}
+function computeStableTriangleDomStyle(polygon, options, basisHint) {
+  if (polygon.texture || polygon.vertices.length !== 3) return null;
+  const tile = DEFAULT_TILE;
+  const elev = tile;
+  const v0 = polygon.vertices[0];
+  const v1 = polygon.vertices[1];
+  const v2 = polygon.vertices[2];
+  const p0x = v0[1] * tile, p0y = v0[0] * tile, p0z = v0[2] * elev;
+  const p1x = v1[1] * tile, p1y = v1[0] * tile, p1z = v1[2] * elev;
+  const p2x = v2[1] * tile, p2y = v2[0] * tile, p2z = v2[2] * elev;
+  const e10x = p1x - p0x, e10y = p1y - p0y, e10z = p1z - p0z;
+  const e20x = p2x - p0x, e20y = p2y - p0y, e20z = p2z - p0z;
+  let nx = -(e10y * e20z - e10z * e20y);
+  let ny = -(e10z * e20x - e10x * e20z);
+  let nz = -(e10x * e20y - e10y * e20x);
+  const nLen = Math.sqrt(nx * nx + ny * ny + nz * nz);
+  if (nLen <= BASIS_EPS) return null;
+  nx /= nLen;
+  ny /= nLen;
+  nz /= nLen;
+  const len01Sq = e10x * e10x + e10y * e10y + e10z * e10z;
+  const e21x = p2x - p1x, e21y = p2y - p1y, e21z = p2z - p1z;
+  const e02x = p0x - p2x, e02y = p0y - p2y, e02z = p0z - p2z;
+  const len12Sq = e21x * e21x + e21y * e21y + e21z * e21z;
+  const len20Sq = e02x * e02x + e02y * e02y + e02z * e02z;
+  let a = isStableTriangleBasis(basisHint) ? basisHint.a : 0;
+  let b = isStableTriangleBasis(basisHint) ? basisHint.b : 1;
+  let c = isStableTriangleBasis(basisHint) ? basisHint.c : 2;
+  const retryWithoutBasis = () => basisHint ? computeStableTriangleDomStyle(polygon, options) : null;
+  if (!isStableTriangleBasis(basisHint)) {
+    let baseLengthSq = len01Sq;
+    if (len12Sq > baseLengthSq) {
+      a = 1;
+      b = 2;
+      c = 0;
+      baseLengthSq = len12Sq;
+    }
+    if (len20Sq > baseLengthSq) {
+      a = 2;
+      b = 0;
+      c = 1;
+    }
+  }
+  const cvx = c === 0 ? p0x : c === 1 ? p1x : p2x;
+  const cvy = c === 0 ? p0y : c === 1 ? p1y : p2y;
+  const cvz = c === 0 ? p0z : c === 1 ? p1z : p2z;
+  const avx = a === 0 ? p0x : a === 1 ? p1x : p2x;
+  const avy = a === 0 ? p0y : a === 1 ? p1y : p2y;
+  const avz = a === 0 ? p0z : a === 1 ? p1z : p2z;
+  const bvx = b === 0 ? p0x : b === 1 ? p1x : p2x;
+  const bvy = b === 0 ? p0y : b === 1 ? p1y : p2y;
+  const bvz = b === 0 ? p0z : b === 1 ? p1z : p2z;
+  const baseDx = bvx - avx, baseDy = bvy - avy, baseDz = bvz - avz;
+  const baseLength = Math.sqrt(baseDx * baseDx + baseDy * baseDy + baseDz * baseDz);
+  if (baseLength <= BASIS_EPS) return retryWithoutBasis();
+  const x0 = baseDx / baseLength, x1 = baseDy / baseLength, x2 = baseDz / baseLength;
+  const apexXproj = (cvx - avx) * x0 + (cvy - avy) * x1 + (cvz - avz) * x2;
+  let y0 = avx + x0 * apexXproj - cvx;
+  let y1 = avy + x1 * apexXproj - cvy;
+  let y2 = avz + x2 * apexXproj - cvz;
+  const height = Math.sqrt(y0 * y0 + y1 * y1 + y2 * y2);
+  if (height <= BASIS_EPS) return retryWithoutBasis();
+  y0 /= height;
+  y1 /= height;
+  y2 /= height;
+  const leftExtent = Math.max(0, Math.min(baseLength, apexXproj));
+  const rightExtent = Math.max(0, baseLength - leftExtent);
+  const expanded = offsetStableTrianglePoints2(leftExtent, rightExtent, height, SOLID_TRIANGLE_BLEED);
+  const apex2x = expanded[0], apex2y = expanded[1];
+  const baseLeft2x = expanded[2], baseLeft2y = expanded[3];
+  const baseRight2x = expanded[4], baseRight2y = expanded[5];
+  const baseY = (baseLeft2y + baseRight2y) / 2;
+  const leftPx = apex2x - baseLeft2x;
+  const rightPx = baseRight2x - apex2x;
+  const heightPx = baseY - apex2y;
+  if (leftPx <= BASIS_EPS || rightPx <= BASIS_EPS || heightPx <= BASIS_EPS || !Number.isFinite(leftPx + rightPx + heightPx)) {
+    return retryWithoutBasis();
+  }
+  const canonicalSize = solidTriangleCanonicalSize();
+  const invCanonicalSize = 1 / canonicalSize;
+  const baseWidthPx = leftPx + rightPx;
+  const xScale = baseWidthPx * invCanonicalSize;
+  const yXScale = (rightPx - leftPx) * 0.5 * invCanonicalSize;
+  const yYScale = heightPx * invCanonicalSize;
+  const txXOffset = apex2x - leftExtent - baseWidthPx * 0.5;
+  const txYOffset = apex2y;
+  const transform = formatStableTriangleTransformScalars(
+    x0 * xScale,
+    x1 * xScale,
+    x2 * xScale,
+    x0 * yXScale + y0 * yYScale,
+    x1 * yXScale + y1 * yYScale,
+    x2 * yXScale + y2 * yYScale,
+    nx,
+    ny,
+    nz,
+    cvx + x0 * txXOffset + y0 * txYOffset,
+    cvy + x1 * txXOffset + y1 * txYOffset,
+    cvz + x2 * txXOffset + y2 * txYOffset
+  );
+  let color;
+  if (Math.floor(options.colorFreezeFrames ?? 1) !== 0) {
+    const directionalCfg = options.directionalLight;
+    const ambientCfg = options.ambientLight;
+    const lightDir = directionalCfg?.direction ?? DEFAULT_LIGHT_DIR;
+    const lightColor = directionalCfg?.color ?? DEFAULT_LIGHT_COLOR;
+    const lightIntensity = Math.max(0, directionalCfg?.intensity ?? DEFAULT_LIGHT_INTENSITY);
+    const ambientColor = ambientCfg?.color ?? DEFAULT_AMBIENT_COLOR;
+    const ambientIntensity = Math.max(0, ambientCfg?.intensity ?? DEFAULT_AMBIENT_INTENSITY);
+    const lLen = Math.sqrt(
+      lightDir[0] * lightDir[0] + lightDir[1] * lightDir[1] + lightDir[2] * lightDir[2]
+    ) || 1;
+    const lx = lightDir[0] / lLen, ly = lightDir[1] / lLen, lz = lightDir[2] / lLen;
+    const directScale = lightIntensity * Math.max(0, nx * lx + ny * ly + nz * lz);
+    const shadedColor = shadePolygon(
+      polygon.color ?? "#cccccc",
+      directScale,
+      lightColor,
+      ambientColor,
+      ambientIntensity
+    );
+    color = options.colorSteps ? quantizeCssColor(shadedColor, options.colorSteps) : shadedColor;
+  }
+  return { transform, borderWidth: solidTriangleBorderWidth(), color, basis: { a, b, c } };
+}
+function stableTriangleColorAllowed(index, colorFrame, freezeFrames) {
+  return freezeFrames > 0 && (freezeFrames <= 1 || (colorFrame + index) % freezeFrames === 0);
+}
+function applyStableTriangleColor(el, index, nextColor, options) {
+  const freezeFrames = Math.floor(options.colorFreezeFrames ?? 1);
+  if (freezeFrames === 0) return;
+  const currentColor = el.__polycssStableTriangleColor;
+  const shouldWrite = currentColor === void 0 || stableTriangleColorAllowed(
+    index,
+    Math.max(0, Math.floor(options.colorFrame ?? 0)),
+    Math.max(1, freezeFrames)
+  );
+  if (!shouldWrite || currentColor === nextColor) return;
+  let writeColor = nextColor;
+  let writeRgb = nextColor ? parseHex2(nextColor) : void 0;
+  const currentRgb = el.__polycssStableTriangleColorRgb;
+  const maxStep = Math.max(0, Math.floor(options.colorMaxStep ?? 0));
+  if (maxStep > 0 && currentRgb && writeRgb && nextColor) {
+    writeRgb = stepRgbToward(currentRgb, writeRgb, maxStep);
+    writeColor = rgbToHex(writeRgb);
+  }
+  el.style.color = writeColor;
+  el.__polycssStableTriangleColor = writeColor;
+  el.__polycssStableTriangleColorRgb = writeRgb;
+}
+function updateStableTriangleDom(root, polygons, options = {}) {
+  if ((options.textureLighting ?? "baked") !== "baked") return false;
+  if (!isSolidTriangleSupported()) return false;
+  const leaves = Array.from(root.children).filter(
+    (child) => child instanceof HTMLElement && child.localName === "u"
+  );
+  if (leaves.length !== polygons.length) return false;
+  const styles = polygons.map(
+    (polygon, index) => computeStableTriangleDomStyle(polygon, options, leaves[index].__polycssStableTriangleBasis)
+  );
+  if (styles.some((style) => !style)) return false;
+  for (let i = 0; i < leaves.length; i += 1) {
+    const style = styles[i];
+    const el = leaves[i];
+    if (el.style.visibility) el.style.visibility = "";
+    el.__polycssStableTriangleBasis = style.basis;
+    applySolidTrianglePaintStyle(el);
+    el.style.transform = style.transform;
+    if (style.borderWidth !== void 0) el.style.borderWidth = style.borderWidth;
+    if (style.color !== void 0) applyStableTriangleColor(el, i, style.color, options);
+  }
+  return true;
+}
+
+// src/scene/atlas/paintDefaults.ts
+var import_polycss_core8 = require("@layoutit/polycss-core");
+function computeTextureAtlasPlan(polygon, index, options = {}, basisHint) {
+  return (0, import_polycss_core8.computeTextureAtlasPlanPublic)(polygon, index, options, void 0, basisHint);
+}
+function getSolidPaintDefaults(plans, textureLighting, strategies) {
+  const disabled = new Set(strategies?.disable ?? []);
+  return getSolidPaintDefaultsFromPlans(plans, textureLighting, disabled);
+}
+
+// src/scene/atlas/useTextureAtlas.ts
+var import_react7 = require("react");
+function pageShells(pages) {
+  return pages.map((page) => ({ width: page.width, height: page.height, url: null }));
+}
+function blobUrlsOf(pages) {
+  return pages.flatMap((page) => page.url?.startsWith("blob:") ? [page.url] : []);
+}
+function decodeBlobUrls(urls) {
+  if (urls.length === 0 || typeof Image === "undefined") return Promise.resolve();
+  return Promise.all(urls.map((url) => {
+    const img = new Image();
+    img.src = url;
+    const decoded = img.decode?.();
+    return decoded ? decoded.catch(() => {
+    }) : Promise.resolve();
+  })).then(() => void 0);
+}
+function deferRevoke(urls) {
+  if (urls.length === 0) return;
+  const run = () => {
+    for (const url of urls) URL.revokeObjectURL(url);
+  };
+  if (typeof requestAnimationFrame === "function") requestAnimationFrame(run);
+  else setTimeout(run, 0);
+}
+function useTextureAtlas(plans, textureLighting, textureQualityInput, textureLeafSizing, textureBackend, textureImageRendering, textureProjection, strategies, atomic = false) {
+  const disabled = (0, import_react7.useMemo)(
+    () => new Set(strategies?.disable ?? []),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [strategies?.disable?.join(",")]
+  );
+  const atlasPlans = (0, import_react7.useMemo)(
+    () => filterAtlasPlans(
+      plans,
+      textureLighting,
+      disabled,
+      typeof document !== "undefined" ? document : null,
+      textureBackend,
+      textureImageRendering,
+      textureProjection
+    ),
+    [plans, textureLighting, disabled, textureBackend, textureImageRendering, textureProjection]
+  );
+  const { packed, atlasScale } = (0, import_react7.useMemo)(
+    () => packTextureAtlasPlansWithScale(
+      atlasPlans,
+      textureQualityInput,
+      typeof document !== "undefined" ? document : null,
+      textureLeafSizing
+    ),
+    [atlasPlans, textureQualityInput, textureLeafSizing]
+  );
+  const [pages, setPages] = (0, import_react7.useState)(() => pageShells(packed.pages));
+  const [frame, setFrame] = (0, import_react7.useState)(() => ({
+    plans,
+    entries: packed.entries,
+    pages: pageShells(packed.pages)
+  }));
+  const shownUrls = (0, import_react7.useRef)([]);
+  const seqRef = (0, import_react7.useRef)(0);
+  const mountedRef = (0, import_react7.useRef)(true);
+  (0, import_react7.useEffect)(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+      for (const url of shownUrls.current) URL.revokeObjectURL(url);
+      shownUrls.current = [];
+    };
+  }, []);
+  (0, import_react7.useEffect)(() => {
+    if (atomic) {
+      const seq = ++seqRef.current;
+      const snapPlans = plans;
+      const snapEntries = packed.entries;
+      if (packed.pages.length === 0 || typeof document === "undefined") {
+        deferRevoke(shownUrls.current);
+        shownUrls.current = [];
+        setFrame({ plans: snapPlans, entries: snapEntries, pages: pageShells(packed.pages) });
+        return;
+      }
+      const stale = () => seq !== seqRef.current;
+      let built2 = [];
+      buildAtlasPages(packed.pages, textureLighting, document, atlasScale, stale).then(async (nextPages) => {
+        built2 = blobUrlsOf(nextPages);
+        await decodeBlobUrls(built2);
+        if (!mountedRef.current || stale()) {
+          deferRevoke(built2);
+          return;
+        }
+        const prev = shownUrls.current;
+        shownUrls.current = built2;
+        built2 = [];
+        deferRevoke(prev);
+        setFrame({ plans: snapPlans, entries: snapEntries, pages: nextPages });
+      }).catch(() => {
+      });
+      return;
+    }
+    let cancelled = false;
+    if (packed.pages.length === 0) {
+      deferRevoke(shownUrls.current);
+      shownUrls.current = [];
+      setPages((prev) => prev.length === 0 ? prev : []);
+      return () => {
+      };
+    }
+    if (typeof document === "undefined") return () => {
+    };
+    setPages((prev) => prev.some((page) => page.url) ? prev : pageShells(packed.pages));
+    let built = [];
+    buildAtlasPages(packed.pages, textureLighting, document, atlasScale, () => cancelled).then(async (nextPages) => {
+      built = blobUrlsOf(nextPages);
+      await decodeBlobUrls(built);
+      if (cancelled) {
+        deferRevoke(built);
+        return;
+      }
+      const stale = shownUrls.current;
+      shownUrls.current = built;
+      built = [];
+      deferRevoke(stale);
+      setPages(nextPages);
+    }).catch(() => {
+    });
+    return () => {
+      cancelled = true;
+      deferRevoke(built);
+    };
+  }, [packed, textureLighting, atlasScale, atomic]);
+  if (atomic) {
+    return {
+      plans: frame.plans,
+      entries: frame.entries,
+      pages: frame.pages,
+      ready: frame.pages.length === 0 || frame.pages.every((page) => !!page.url)
+    };
+  }
+  return {
+    plans,
+    entries: packed.entries,
+    pages,
+    ready: pages.length === 0 || pages.every((page) => !!page.url)
+  };
+}
+
+// src/scene/atlas/triangle.tsx
+var import_react8 = require("react");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var TextureTrianglePoly = (0, import_react8.memo)(function TextureTrianglePoly2({
+  entry,
+  textureLighting,
+  solidPaintDefaults,
+  className,
+  style: styleProp,
+  domAttrs,
+  domEventHandlers,
+  pointerEvents = "auto"
+}) {
+  const triangleStyle = solidTriangleStyle(entry, textureLighting, pointerEvents, solidPaintDefaults);
+  if (!triangleStyle) return null;
+  const dataAttrs = entry.polygon.data ? Object.fromEntries(
+    Object.entries(entry.polygon.data).map(([k, v]) => [`data-${k}`, String(v)])
+  ) : {};
+  const elementClassName = className?.trim() || void 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "u",
+    {
+      className: elementClassName,
+      style: { ...triangleStyle, ...styleProp },
+      "data-poly-index": entry.index,
+      ...domEventHandlers,
+      ...dataAttrs,
+      ...domAttrs
+    }
+  );
+});
+
+// src/scene/atlas/borderShape.tsx
+var import_react9 = require("react");
+var import_polycss_core9 = require("@layoutit/polycss-core");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var BRUSH_INLINE_STYLE_ORDER = /* @__PURE__ */ new Map([
+  ["transform", 0],
+  ["border-shape", 1],
+  ["border-width", 2],
+  ["width", 3],
+  ["height", 4],
+  ["color", 5]
+]);
+function orderBrushInlineStyle(el) {
+  const current = el.getAttribute("style");
+  if (!current) return;
+  const declarations = current.split(";").map((d) => d.trim()).filter(Boolean);
+  const next = declarations.map((declaration, index) => {
+    const property = declaration.slice(0, declaration.indexOf(":")).trim().toLowerCase();
+    return { declaration, index, order: BRUSH_INLINE_STYLE_ORDER.get(property) ?? Number.POSITIVE_INFINITY };
+  }).sort((a, b) => a.order - b.order || a.index - b.index).map(({ declaration }) => declaration).join(";");
+  if (next !== current) el.setAttribute("style", next);
+}
+var TextureBorderShapePoly = (0, import_react9.memo)(function TextureBorderShapePoly2({
+  entry,
+  textureLighting,
+  solidPaintDefaults,
+  className,
+  style: styleProp,
+  domAttrs,
+  domEventHandlers,
+  pointerEvents = "auto",
+  disabledStrategies
+}) {
+  const fullRect = !entry.texture && (0, import_polycss_core9.isFullRectSolid)(entry);
+  const bDisabled = disabledStrategies?.has("b") ?? false;
+  const useIForFullRect = bDisabled && isBorderShapeSupported();
+  const borderShape = !fullRect || useIForFullRect ? (0, import_polycss_core9.cssBorderShapeForPlan)(entry) : null;
+  const dynamic = textureLighting === "dynamic";
+  const base = parseHex2(entry.polygon.color ?? "#cccccc");
+  const useDefaultDynamicColor = dynamic && rgbKey2(base) === solidPaintDefaults?.dynamicColorKey;
+  const setElementRef = (0, import_react9.useCallback)((el) => {
+    if (!el) return;
+    if (borderShape) el.style.setProperty("border-shape", borderShape);
+    else el.style.removeProperty("border-shape");
+    orderBrushInlineStyle(el);
+  }, [borderShape]);
+  const transform = borderShape ? (0, import_polycss_core9.formatBorderShapeEntryMatrix)(entry) : (0, import_polycss_core9.formatSolidQuadEntryMatrix)(entry);
+  const style = {
+    transform,
+    // Baked mode: always emit per-leaf shaded color when known so the
+    // first render matches the post-light-nudge commit path. Vanilla
+    // dropped the `=== solidPaintDefaults.paintColor` shortcut in
+    // commit 0423777 — leaves with undefined shadedColor would inherit
+    // the (often-wrong) wrapper --polycss-paint default, producing
+    // facets that look dimmer than they should until a light change
+    // forced an explicit re-bake.
+    color: dynamic ? void 0 : entry.shadedColor,
+    pointerEvents: pointerEvents === "none" ? "none" : void 0,
+    ...dynamic ? {
+      ["--pnx"]: entry.normal[0].toFixed(4),
+      ["--pny"]: entry.normal[1].toFixed(4),
+      ["--pnz"]: entry.normal[2].toFixed(4),
+      ...useDefaultDynamicColor ? null : {
+        ["--psr"]: (base.r / 255).toFixed(4),
+        ["--psg"]: (base.g / 255).toFixed(4),
+        ["--psb"]: (base.b / 255).toFixed(4)
+      }
+    } : null,
+    ...styleProp
+  };
+  const dataAttrs = entry.polygon.data ? Object.fromEntries(
+    Object.entries(entry.polygon.data).map(([k, v]) => [`data-${k}`, String(v)])
+  ) : {};
+  const elementClassName = className?.trim() || void 0;
+  if (fullRect && !useIForFullRect) {
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      "b",
+      {
+        className: elementClassName,
+        style,
+        "data-poly-index": entry.index,
+        ...domEventHandlers,
+        ...dataAttrs,
+        ...domAttrs
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "i",
+    {
+      ref: setElementRef,
+      className: elementClassName,
+      style,
+      "data-poly-index": entry.index,
+      ...domEventHandlers,
+      ...dataAttrs,
+      ...domAttrs
+    }
+  );
+});
+
+// src/scene/atlas/projectiveSolid.tsx
+var import_react10 = require("react");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var TextureProjectiveSolidPoly = (0, import_react10.memo)(function TextureProjectiveSolidPoly2({
+  entry,
+  textureLighting,
+  solidPaintDefaults,
+  className,
+  style: styleProp,
+  domAttrs,
+  domEventHandlers,
+  pointerEvents = "auto"
+}) {
+  const dynamic = textureLighting === "dynamic";
+  const base = parseHex2(entry.polygon.color ?? "#cccccc");
+  const useDefaultDynamicColor = dynamic && rgbKey2(base) === solidPaintDefaults?.dynamicColorKey;
+  const style = {
+    // Emit projectiveMatrix verbatim — it's already formatted with 6-decimal
+    // precision by computeTextureAtlasPlan. Re-rounding via formatMatrix3d
+    // would drop it to 3 decimals and leave visible seam gaps between
+    // adjacent projective quads at zoom-out (matches vanilla scene.add).
+    transform: `matrix3d(${entry.projectiveMatrix})`,
+    // Baked: always emit per-leaf shaded color (vanilla commit 0423777).
+    color: dynamic ? void 0 : entry.shadedColor,
+    pointerEvents: pointerEvents === "none" ? "none" : void 0,
+    ...dynamic && !useDefaultDynamicColor ? {
+      ["--pnx"]: entry.normal[0].toFixed(4),
+      ["--pny"]: entry.normal[1].toFixed(4),
+      ["--pnz"]: entry.normal[2].toFixed(4),
+      ["--psr"]: (base.r / 255).toFixed(4),
+      ["--psg"]: (base.g / 255).toFixed(4),
+      ["--psb"]: (base.b / 255).toFixed(4)
+    } : dynamic ? {
+      ["--pnx"]: entry.normal[0].toFixed(4),
+      ["--pny"]: entry.normal[1].toFixed(4),
+      ["--pnz"]: entry.normal[2].toFixed(4)
+    } : null,
+    ...styleProp
+  };
+  const dataAttrs = entry.polygon.data ? Object.fromEntries(
+    Object.entries(entry.polygon.data).map(([k, v]) => [`data-${k}`, String(v)])
+  ) : {};
+  const elementClassName = className?.trim() || void 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    "b",
+    {
+      className: elementClassName,
+      style,
+      "data-poly-index": entry.index,
+      ...domEventHandlers,
+      ...dataAttrs,
+      ...domAttrs
+    }
+  );
+});
+
+// src/scene/atlas/cornerShapeSolid.tsx
+var import_react11 = require("react");
+var import_polycss_core10 = require("@layoutit/polycss-core");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+function formatPaintCss(entry, textureLighting, solidPaintDefaults) {
+  if (textureLighting === "dynamic") {
+    const base = (0, import_polycss_core10.parseHex)(entry.polygon.color ?? "#cccccc");
+    let style = `;--pnx:${entry.normal[0].toFixed(4)};--pny:${entry.normal[1].toFixed(4)};--pnz:${entry.normal[2].toFixed(4)}`;
+    if ((0, import_polycss_core10.rgbKey)(base) !== solidPaintDefaults?.dynamicColorKey) {
+      style += `;--psr:${(base.r / 255).toFixed(4)};--psg:${(base.g / 255).toFixed(4)};--psb:${(base.b / 255).toFixed(4)}`;
+    }
+    return style;
+  }
+  return entry.shadedColor ? `;color:${entry.shadedColor}` : "";
+}
+var TextureCornerShapeSolidPoly = (0, import_react11.memo)(function TextureCornerShapeSolidPoly2({
+  entry,
+  geometry,
+  textureLighting,
+  solidPaintDefaults,
+  className,
+  style: styleProp,
+  domAttrs,
+  domEventHandlers,
+  pointerEvents = "auto"
+}) {
+  const cornerShapeCss = (0, import_polycss_core10.formatCornerShapeElementStyle)(entry, geometry);
+  const paintCss = formatPaintCss(entry, textureLighting, solidPaintDefaults);
+  const pointerCss = pointerEvents === "none" ? ";pointer-events:none" : "";
+  const fullCss = cornerShapeCss + paintCss + pointerCss;
+  const setRef = (0, import_react11.useCallback)((el) => {
+    if (!el) return;
+    el.setAttribute("style", fullCss);
+    if (styleProp) {
+      for (const [k, v] of Object.entries(styleProp)) {
+        if (v === void 0 || v === null) continue;
+        if (k.startsWith("--")) el.style.setProperty(k, String(v));
+        else el.style[k] = String(v);
+      }
+    }
+  }, [fullCss, styleProp]);
+  const dataAttrs = entry.polygon.data ? Object.fromEntries(
+    Object.entries(entry.polygon.data).map(([k, v]) => [`data-${k}`, String(v)])
+  ) : {};
+  const elementClassName = className?.trim() || void 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    "u",
+    {
+      ref: setRef,
+      className: elementClassName,
+      "data-poly-index": entry.index,
+      ...domEventHandlers,
+      ...dataAttrs,
+      ...domAttrs
+    }
+  );
+});
+
+// src/scene/atlas/atlasPoly.tsx
+var import_react12 = require("react");
+var import_polycss_core11 = require("@layoutit/polycss-core");
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var TextureAtlasPoly = (0, import_react12.memo)(function TextureAtlasPoly2({
+  entry,
+  page,
+  textureLighting,
+  textureImageRendering,
+  solidPaintDefaults: _solidPaintDefaults,
+  className,
+  style: styleProp,
+  domAttrs,
+  domEventHandlers,
+  pointerEvents = "auto"
+}) {
+  const ATLAS_CANONICAL_SIZE_EXPLICIT = 64;
+  const dynamic = textureLighting === "dynamic";
+  const resolvedImageRendering = (0, import_polycss_core11.resolvePolyTextureImageRendering)(entry.polygon, textureImageRendering);
+  const atlasCanonicalSize = entry.atlasCanonicalSize ?? ATLAS_CANONICAL_SIZE_EXPLICIT;
+  const atlasLeafWidth = entry.atlasLeafWidth ?? atlasCanonicalSize;
+  const atlasLeafHeight = entry.atlasLeafHeight ?? atlasCanonicalSize;
+  const atlasWidth = entry.canvasW || 1;
+  const atlasHeight = entry.canvasH || 1;
+  const atlasPosition = page ? `${(0, import_polycss_core11.formatCssLengthPx)(-entry.x / atlasWidth * atlasLeafWidth)} ${(0, import_polycss_core11.formatCssLengthPx)(-entry.y / atlasHeight * atlasLeafHeight)}` : void 0;
+  const atlasSize = page ? `${(0, import_polycss_core11.formatCssLengthPx)(page.width / atlasWidth * atlasLeafWidth)} ${(0, import_polycss_core11.formatCssLengthPx)(page.height / atlasHeight * atlasLeafHeight)}` : void 0;
+  const dynamicMask = dynamic && page?.url ? `url(${page.url})` : void 0;
+  const style = {
+    transform: (0, import_polycss_core11.formatMatrix3d)(entry.atlasMatrix),
+    ["--polycss-atlas-size"]: `${atlasCanonicalSize}px`,
+    ["--polycss-atlas-width"]: (0, import_polycss_core11.formatCssLengthPx)(atlasLeafWidth),
+    ["--polycss-atlas-height"]: (0, import_polycss_core11.formatCssLengthPx)(atlasLeafHeight),
+    ["--polycss-atlas-leaf-sizing"]: entry.atlasLeafSizing ?? "canonical",
+    backgroundImage: page?.url ? `url(${page.url})` : void 0,
+    backgroundPosition: atlasPosition,
+    backgroundSize: atlasSize,
+    backgroundRepeat: page?.url ? "no-repeat" : void 0,
+    imageRendering: resolvedImageRendering === "pixelated" ? "pixelated" : void 0,
+    ...dynamic ? {
+      ["--pnx"]: entry.normal[0].toFixed(4),
+      ["--pny"]: entry.normal[1].toFixed(4),
+      ["--pnz"]: entry.normal[2].toFixed(4)
+    } : null,
+    ...dynamic && dynamicMask ? {
+      maskImage: dynamicMask,
+      maskMode: "alpha",
+      maskPosition: atlasPosition,
+      maskSize: atlasSize,
+      maskRepeat: "no-repeat",
+      WebkitMaskImage: dynamicMask,
+      WebkitMaskPosition: atlasPosition,
+      WebkitMaskSize: atlasSize,
+      WebkitMaskRepeat: "no-repeat"
+    } : null,
+    opacity: page?.url ? void 0 : 0,
+    pointerEvents: pointerEvents === "none" ? "none" : void 0,
+    ...styleProp
+  };
+  const dataAttrs = entry.polygon.data ? Object.fromEntries(
+    Object.entries(entry.polygon.data).map(([k, v]) => [`data-${k}`, String(v)])
+  ) : {};
+  const elementClassName = className?.trim() || void 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    "s",
+    {
+      className: elementClassName,
+      style,
+      "data-poly-index": entry.index,
+      "data-polycss-leaf": "polygon",
+      "data-polycss-texture-backend": "atlas",
+      "data-polycss-texture-leaf-sizing": entry.atlasLeafSizing ?? "canonical",
+      "data-polycss-texture-ready": page?.url ? "true" : "false",
+      "data-polycss-texture-image-rendering": resolvedImageRendering,
+      "data-polycss-texture-projection": "affine",
+      "data-polycss-texture-lighting": textureLighting,
+      "data-polycss-texture-leaf-width": atlasLeafWidth,
+      "data-polycss-texture-leaf-height": atlasLeafHeight,
+      "data-polycss-double-sided": entry.polygon.doubleSided ? "true" : void 0,
+      ...domEventHandlers,
+      ...dataAttrs,
+      ...domAttrs
+    }
+  );
+});
+var TextureImagePoly = (0, import_react12.memo)(function TextureImagePoly2({
+  plan,
+  geometry,
+  className,
+  style: styleProp,
+  domAttrs,
+  domEventHandlers,
+  pointerEvents = "auto"
+}) {
+  const style = {
+    transform: (0, import_polycss_core11.formatMatrix3d)(geometry.matrix),
+    ["--polycss-atlas-width"]: (0, import_polycss_core11.formatCssLengthPx)(geometry.leafWidth),
+    ["--polycss-atlas-height"]: (0, import_polycss_core11.formatCssLengthPx)(geometry.leafHeight),
+    ["--polycss-atlas-leaf-sizing"]: "image",
+    backgroundImage: `url(${geometry.url})`,
+    backgroundPosition: `${(0, import_polycss_core11.formatCssLengthPx)(geometry.backgroundPosition[0])} ${(0, import_polycss_core11.formatCssLengthPx)(geometry.backgroundPosition[1])}`,
+    backgroundSize: `${(0, import_polycss_core11.formatCssLengthPx)(geometry.backgroundSize[0])} ${(0, import_polycss_core11.formatCssLengthPx)(geometry.backgroundSize[1])}`,
+    backgroundRepeat: "no-repeat",
+    backgroundBlendMode: "normal",
+    maskImage: "none",
+    WebkitMaskImage: "none",
+    imageRendering: geometry.imageRendering === "pixelated" ? "pixelated" : void 0,
+    ["--pnx"]: plan.normal[0].toFixed(4),
+    ["--pny"]: plan.normal[1].toFixed(4),
+    ["--pnz"]: plan.normal[2].toFixed(4),
+    pointerEvents: pointerEvents === "none" ? "none" : void 0,
+    ...styleProp
+  };
+  const dataAttrs = plan.polygon.data ? Object.fromEntries(
+    Object.entries(plan.polygon.data).map(([k, v]) => [`data-${k}`, String(v)])
+  ) : {};
+  const elementClassName = className?.trim() || void 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    "s",
+    {
+      className: elementClassName,
+      style,
+      "data-poly-index": plan.index,
+      "data-polycss-leaf": "polygon",
+      "data-polycss-texture-backend": "image",
+      "data-polycss-texture-leaf-sizing": "image",
+      "data-polycss-texture-ready": "true",
+      "data-polycss-texture-image-rendering": geometry.imageRendering,
+      "data-polycss-texture-projection": geometry.projection,
+      "data-polycss-texture-lighting": geometry.lighting,
+      "data-polycss-texture-leaf-width": geometry.leafWidth,
+      "data-polycss-texture-leaf-height": geometry.leafHeight,
+      "data-polycss-double-sided": plan.polygon.doubleSided ? "true" : void 0,
+      "data-polycss-texture-source-x": geometry.sourceRect.x,
+      "data-polycss-texture-source-y": geometry.sourceRect.y,
+      "data-polycss-texture-source-width": geometry.sourceRect.width,
+      "data-polycss-texture-source-height": geometry.sourceRect.height,
+      ...domEventHandlers,
+      ...dataAttrs,
+      ...domAttrs
+    }
+  );
+});
+
+// src/scene/PolyMesh.tsx
+var import_react_dom = require("react-dom");
+
+// src/scene/sceneContext.ts
+var import_react13 = require("react");
+var PolySceneContext = (0, import_react13.createContext)(null);
+function usePolySceneContext() {
+  return (0, import_react13.useContext)(PolySceneContext);
+}
+
+// src/scene/voxelRenderer.ts
+var import_polycss_core13 = require("@layoutit/polycss-core");
+var DEFAULT_LIGHT_DIR2 = [0.4, -0.7, 0.59];
+var DEFAULT_LIGHT_COLOR2 = "#ffffff";
+var DEFAULT_LIGHT_INTENSITY2 = 1;
+var DEFAULT_AMBIENT_COLOR2 = "#ffffff";
+var DEFAULT_AMBIENT_INTENSITY2 = 0.4;
+var DESKTOP_PRIMITIVE_SIZE = 1;
+var MOBILE_PRIMITIVE_SIZE = 8;
+var VOXEL_SEAM_BLEED = import_polycss_core13.PROJECTIVE_QUAD_BLEED;
+var VOXEL_SEAM_EPS = 1e-6;
+var VOXEL_PROJECTIVE_QUAD_GUARDS = (0, import_polycss_core13.resolveProjectiveQuadGuards)({ bleed: 0 });
+var FACE_NORMALS = {
+  t: [0, 0, 1],
+  b: [0, 0, -1],
+  fl: [0, 1, 0],
+  br: [0, -1, 0],
+  fr: [1, 0, 0],
+  bl: [-1, 0, 0]
+};
+var FACE_ORDER = ["t", "b", "bl", "br", "fr", "fl"];
+var FACE_BY_NORMAL = /* @__PURE__ */ new Map([
+  ["0,0,1", "t"],
+  ["0,0,-1", "b"],
+  ["0,1,0", "fl"],
+  ["0,-1,0", "br"],
+  ["1,0,0", "fr"],
+  ["-1,0,0", "bl"]
+]);
+function visibleFaceSignature(rotation) {
+  const visible = [];
+  for (const face of FACE_ORDER) {
+    if ((0, import_polycss_core13.normalFacesCamera)(FACE_NORMALS[face], rotation)) visible.push(face);
+  }
+  return visible.join("|");
+}
+function applyBrush(el, color, transform) {
+  const state = el.__polycssVoxelBrushState ?? (el.__polycssVoxelBrushState = {});
+  if (state.color !== color) {
+    el.style.color = color;
+    state.color = color;
+  }
+  if (state.transform !== transform) {
+    el.style.transform = transform;
+    state.transform = transform;
+  }
+}
+function cssNormalForPolygon(polygon) {
+  const vertices = polygon.vertices;
+  if (vertices.length < 3) return null;
+  const v0 = vertices[0];
+  let nx = 0;
+  let ny = 0;
+  let nz = 0;
+  for (let i = 1; i + 1 < vertices.length; i += 1) {
+    const v1 = vertices[i];
+    const v2 = vertices[i + 1];
+    const e1x = v1[1] - v0[1];
+    const e1y = v1[0] - v0[0];
+    const e1z = v1[2] - v0[2];
+    const e2x = v2[1] - v0[1];
+    const e2y = v2[0] - v0[0];
+    const e2z = v2[2] - v0[2];
+    nx -= e1y * e2z - e1z * e2y;
+    ny -= e1z * e2x - e1x * e2z;
+    nz -= e1x * e2y - e1y * e2x;
+  }
+  const len = Math.hypot(nx, ny, nz);
+  if (len <= 1e-9) return null;
+  return [
+    Math.round(nx / len),
+    Math.round(ny / len),
+    Math.round(nz / len)
+  ];
+}
+function polygonBrush(polygon) {
+  if (polygon.texture || polygon.material || polygon.uvs || polygon.textureTriangles) return null;
+  if (polygon.vertices.length !== 4) return null;
+  const normal = cssNormalForPolygon(polygon);
+  const face = normal ? FACE_BY_NORMAL.get(normal.join(",")) : void 0;
+  if (!face) return null;
+  let minX = Infinity;
+  let minY = Infinity;
+  let minZ = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  let maxZ = -Infinity;
+  for (const v of polygon.vertices) {
+    minX = Math.min(minX, v[0]);
+    minY = Math.min(minY, v[1]);
+    minZ = Math.min(minZ, v[2]);
+    maxX = Math.max(maxX, v[0]);
+    maxY = Math.max(maxY, v[1]);
+    maxZ = Math.max(maxZ, v[2]);
+  }
+  const eps = 1e-6;
+  const baseColor = canonicalBrushColor(polygon.color);
+  if (Math.abs(maxZ - minZ) <= eps) {
+    return {
+      axis: "z",
+      face,
+      left: minY * import_polycss_core13.BASE_TILE,
+      top: minX * import_polycss_core13.BASE_TILE,
+      width: Math.max(0, (maxY - minY) * import_polycss_core13.BASE_TILE),
+      height: Math.max(0, (maxX - minX) * import_polycss_core13.BASE_TILE),
+      z: minZ * import_polycss_core13.BASE_TILE,
+      baseColor,
+      bleed: zeroVoxelSeamBleed()
+    };
+  }
+  if (Math.abs(maxX - minX) <= eps) {
+    return {
+      axis: "x",
+      face,
+      left: minY * import_polycss_core13.BASE_TILE,
+      top: minZ * import_polycss_core13.BASE_TILE,
+      width: Math.max(0, (maxY - minY) * import_polycss_core13.BASE_TILE),
+      height: Math.max(0, (maxZ - minZ) * import_polycss_core13.BASE_TILE),
+      z: -minX * import_polycss_core13.BASE_TILE,
+      baseColor,
+      bleed: zeroVoxelSeamBleed()
+    };
+  }
+  if (Math.abs(maxY - minY) <= eps) {
+    return {
+      axis: "y",
+      face,
+      left: minZ * import_polycss_core13.BASE_TILE,
+      top: minX * import_polycss_core13.BASE_TILE,
+      width: Math.max(0, (maxZ - minZ) * import_polycss_core13.BASE_TILE),
+      height: Math.max(0, (maxX - minX) * import_polycss_core13.BASE_TILE),
+      z: -minY * import_polycss_core13.BASE_TILE,
+      baseColor,
+      bleed: zeroVoxelSeamBleed()
+    };
+  }
+  return null;
+}
+function zeroVoxelSeamBleed() {
+  return { left: 0, right: 0, top: 0, bottom: 0 };
+}
+function worldLineKey(segment) {
+  const coordKey = (value) => String(Number(value.toFixed(6)));
+  let key = `${segment.item.baseColor}|${segment.variableAxis}`;
+  for (let axis = 0; axis < 3; axis += 1) {
+    if (axis === segment.variableAxis) continue;
+    key += `|${axis}:${coordKey(segment.fixed[axis])}`;
+  }
+  return key;
+}
+function cssPointForVertex(v) {
+  return [v[1] * import_polycss_core13.BASE_TILE, v[0] * import_polycss_core13.BASE_TILE, v[2] * import_polycss_core13.BASE_TILE];
+}
+function localPointForItem(item, p) {
+  if (item.axis === "x") return [p[0], p[2]];
+  if (item.axis === "y") return [p[2], p[1]];
+  return [p[0], p[1]];
+}
+function sideForLocalEdge(item, a, b) {
+  const left = item.left;
+  const right = item.left + item.width;
+  const top = item.top;
+  const bottom = item.top + item.height;
+  if (Math.abs(a[0] - b[0]) <= VOXEL_SEAM_EPS) {
+    if (Math.abs(a[0] - left) <= VOXEL_SEAM_EPS) return "left";
+    if (Math.abs(a[0] - right) <= VOXEL_SEAM_EPS) return "right";
+  }
+  if (Math.abs(a[1] - b[1]) <= VOXEL_SEAM_EPS) {
+    if (Math.abs(a[1] - top) <= VOXEL_SEAM_EPS) return "top";
+    if (Math.abs(a[1] - bottom) <= VOXEL_SEAM_EPS) return "bottom";
+  }
+  return null;
+}
+function variableAxisForSegment(a, b) {
+  let axis = null;
+  for (let i = 0; i < 3; i += 1) {
+    if (Math.abs(a[i] - b[i]) <= VOXEL_SEAM_EPS) continue;
+    if (axis !== null) return null;
+    axis = i;
+  }
+  return axis;
+}
+function voxelSeamSegmentForEdge(item, polygon, edgeIndex) {
+  const vertices = polygon.vertices;
+  const a = cssPointForVertex(vertices[edgeIndex]);
+  const b = cssPointForVertex(vertices[(edgeIndex + 1) % vertices.length]);
+  const side = sideForLocalEdge(item, localPointForItem(item, a), localPointForItem(item, b));
+  if (!side) return null;
+  const variableAxis = variableAxisForSegment(a, b);
+  if (variableAxis === null) return null;
+  const start = Math.min(a[variableAxis], b[variableAxis]);
+  const end = Math.max(a[variableAxis], b[variableAxis]);
+  return end - start > VOXEL_SEAM_EPS ? { item, side, variableAxis, fixed: a, start, end } : null;
+}
+function markVoxelSeam(segment) {
+  segment.item.bleed[segment.side] = Math.max(segment.item.bleed[segment.side], VOXEL_SEAM_BLEED);
+}
+function applyVoxelSeamBleed(polygons, items) {
+  const groups = /* @__PURE__ */ new Map();
+  for (const item of items) {
+    const polygon = polygons[item.sourceIndex];
+    if (!polygon) continue;
+    for (let edgeIndex = 0; edgeIndex < polygon.vertices.length; edgeIndex += 1) {
+      const segment = voxelSeamSegmentForEdge(item, polygon, edgeIndex);
+      if (!segment) continue;
+      const key = worldLineKey(segment);
+      const group = groups.get(key);
+      if (group) group.push(segment);
+      else groups.set(key, [segment]);
+    }
+  }
+  for (const segments of groups.values()) {
+    if (segments.length < 2) continue;
+    segments.sort((a, b) => a.start - b.start || a.end - b.end);
+    let active = [];
+    for (const segment of segments) {
+      active = active.filter((candidate) => candidate.end > segment.start + VOXEL_SEAM_EPS);
+      for (const candidate of active) {
+        if (candidate.item.sourceIndex === segment.item.sourceIndex) continue;
+        markVoxelSeam(candidate);
+        markVoxelSeam(segment);
+      }
+      active.push(segment);
+    }
+  }
+}
+function parseColor(input) {
+  const parsed = (0, import_polycss_core13.parsePureColor)(input);
+  if (!parsed) return { r: 255, g: 255, b: 255, alpha: 1 };
+  return {
+    r: parsed.rgb[0],
+    g: parsed.rgb[1],
+    b: parsed.rgb[2],
+    alpha: parsed.alpha
+  };
+}
+function canonicalBrushColor(input) {
+  if (!input) return "#cccccc";
+  const parsed = (0, import_polycss_core13.parsePureColor)(input);
+  if (!parsed) return input;
+  const rgb = {
+    r: parsed.rgb[0],
+    g: parsed.rgb[1],
+    b: parsed.rgb[2],
+    alpha: parsed.alpha
+  };
+  if (rgb.alpha < 1) {
+    const alpha = Math.round(Math.max(0, rgb.alpha) * 1e3) / 1e3;
+    return `rgba(${clampChannel(rgb.r)}, ${clampChannel(rgb.g)}, ${clampChannel(rgb.b)}, ${alpha})`;
+  }
+  return rgbToHex2(rgb);
+}
+function rgbToHex2({ r, g, b }) {
+  const f = (n) => Math.round(Math.max(0, Math.min(255, n))).toString(16).padStart(2, "0");
+  return `#${f(r)}${f(g)}${f(b)}`;
+}
+function clampChannel(value) {
+  return Math.round(Math.max(0, Math.min(255, value)));
+}
+function shadeBrushColor(normal, baseColor, directionalLight, ambientLight) {
+  const lightDir = directionalLight?.direction ?? DEFAULT_LIGHT_DIR2;
+  const lightLen = Math.hypot(lightDir[0], lightDir[1], lightDir[2]) || 1;
+  const lx = lightDir[0] / lightLen;
+  const ly = lightDir[1] / lightLen;
+  const lz = lightDir[2] / lightLen;
+  const directScale = Math.max(0, directionalLight?.intensity ?? DEFAULT_LIGHT_INTENSITY2) * Math.max(0, normal[0] * lx + normal[1] * ly + normal[2] * lz);
+  const ambientIntensity = Math.max(0, ambientLight?.intensity ?? DEFAULT_AMBIENT_INTENSITY2);
+  const lightColor = directionalLight?.color ?? DEFAULT_LIGHT_COLOR2;
+  const ambientColor = ambientLight?.color ?? DEFAULT_AMBIENT_COLOR2;
+  const shaded = (0, import_polycss_core13.shadePolygon)(baseColor, directScale, lightColor, ambientColor, ambientIntensity);
+  const base = parseColor(baseColor);
+  if (base.alpha >= 1) return shaded;
+  const r = parseInt(shaded.slice(1, 3), 16);
+  const g = parseInt(shaded.slice(3, 5), 16);
+  const b = parseInt(shaded.slice(5, 7), 16);
+  return `rgba(${r}, ${g}, ${b}, ${base.alpha})`;
+}
+function buildDirectMatrixItems(polygons) {
+  if (!polygons?.length) return [];
+  const items = [];
+  for (let sourceIndex = 0; sourceIndex < polygons.length; sourceIndex += 1) {
+    const polygon = polygons[sourceIndex];
+    const brush = polygonBrush(polygon);
+    if (!brush || brush.width <= 0 || brush.height <= 0) return [];
+    items.push({
+      ...brush,
+      sourceIndex
+    });
+  }
+  applyVoxelSeamBleed(polygons, items);
+  return items;
+}
+function voxelProjectiveBasis(item) {
+  if (item.axis === "x") {
+    return {
+      xAxis: [1, 0, 0],
+      yAxis: [0, 0, 1],
+      normal: [0, -1, 0],
+      tx: 0,
+      ty: -item.z,
+      tz: 0
+    };
+  }
+  if (item.axis === "y") {
+    return {
+      xAxis: [0, 0, 1],
+      yAxis: [0, 1, 0],
+      normal: [-1, 0, 0],
+      tx: -item.z,
+      ty: 0,
+      tz: 0
+    };
+  }
+  return {
+    xAxis: [1, 0, 0],
+    yAxis: [0, 1, 0],
+    normal: [0, 0, 1],
+    tx: 0,
+    ty: 0,
+    tz: item.z
+  };
+}
+function voxelScreenPts(item) {
+  const left = item.left;
+  const top = item.top;
+  const right = item.left + item.width;
+  const bottom = item.top + item.height;
+  return [
+    left,
+    top,
+    right,
+    top,
+    right,
+    bottom,
+    left,
+    bottom
+  ];
+}
+function voxelSeamEdgeAmounts(item) {
+  return /* @__PURE__ */ new Map([
+    [0, item.bleed.top],
+    [1, item.bleed.right],
+    [2, item.bleed.bottom],
+    [3, item.bleed.left]
+  ]);
+}
+function rescaleProjectiveMatrix(matrix, primitiveSize) {
+  const values = matrix.split(",").map(Number);
+  if (values.length !== 16 || values.some((value) => !Number.isFinite(value))) return null;
+  const scale = import_polycss_core13.SOLID_QUAD_CANONICAL_SIZE / primitiveSize;
+  for (let i = 0; i < 8; i += 1) values[i] *= scale;
+  return `matrix3d(${values.map((value) => Number(value.toFixed(6))).join(",")})`;
+}
+function affineVoxelMatrix(item, primitiveSize) {
+  const left = item.left - item.bleed.left;
+  const top = item.top - item.bleed.top;
+  const width = item.width + item.bleed.left + item.bleed.right;
+  const height = item.height + item.bleed.top + item.bleed.bottom;
+  const zOffset = item.z;
+  const scaleX = width / primitiveSize;
+  const scaleY = height / primitiveSize;
+  const values = item.axis === "x" ? [
+    scaleX,
+    0,
+    0,
+    0,
+    0,
+    0,
+    scaleY,
+    0,
+    0,
+    -1,
+    0,
+    0,
+    left,
+    -zOffset,
+    top,
+    1
+  ] : item.axis === "y" ? [
+    0,
+    0,
+    scaleX,
+    0,
+    0,
+    scaleY,
+    0,
+    0,
+    -1,
+    0,
+    0,
+    0,
+    -zOffset,
+    top,
+    left,
+    1
+  ] : [
+    scaleX,
+    0,
+    0,
+    0,
+    0,
+    scaleY,
+    0,
+    0,
+    0,
+    0,
+    1,
+    0,
+    left,
+    top,
+    zOffset,
+    1
+  ];
+  return `matrix3d(${values.map((value) => Number(value.toFixed(6))).join(",")})`;
+}
+function directMatrix(item, primitiveSize) {
+  const { xAxis, yAxis, normal, tx, ty, tz } = voxelProjectiveBasis(item);
+  const projective = (0, import_polycss_core13.computeProjectiveQuadMatrix)(
+    voxelScreenPts(item),
+    xAxis,
+    yAxis,
+    normal,
+    tx,
+    ty,
+    tz,
+    VOXEL_PROJECTIVE_QUAD_GUARDS,
+    voxelSeamEdgeAmounts(item)
+  );
+  return projective ? rescaleProjectiveMatrix(projective, primitiveSize) ?? affineVoxelMatrix(item, primitiveSize) : affineVoxelMatrix(item, primitiveSize);
+}
+function isMobileDocument2(doc) {
+  const media = doc.defaultView?.matchMedia;
+  if (!media) return false;
+  return media("(pointer: coarse)").matches || media("(hover: none)").matches;
+}
+function primitiveSizeForDocument(doc) {
+  return isMobileDocument2(doc) ? MOBILE_PRIMITIVE_SIZE : DESKTOP_PRIMITIVE_SIZE;
+}
+function itemCenter(item) {
+  if (item.axis === "x") {
+    return [item.left + item.width / 2, -item.z, item.top + item.height / 2];
+  }
+  if (item.axis === "y") {
+    return [-item.z, item.top + item.height / 2, item.left + item.width / 2];
+  }
+  return [item.left + item.width / 2, item.top + item.height / 2, item.z];
+}
+function projectedPoint(item, rotation) {
+  let center = itemCenter(item);
+  const meshRotation = rotation.meshRotation;
+  if (meshRotation) {
+    center = (0, import_polycss_core13.rotateVec3)(center, meshRotation[0] ?? 0, meshRotation[1] ?? 0, meshRotation[2] ?? 0);
+  }
+  const [x, y] = (0, import_polycss_core13.rotateVec3)(center, rotation.rotX, 0, rotation.rotY);
+  return { x, y };
+}
+function orderDirectMatrixItems(items, visibleFaces, rotation) {
+  const entries = items.filter((item) => visibleFaces.has(item.face)).map((item) => ({ item, ...projectedPoint(item, rotation) }));
+  if (entries.length === 0) return [];
+  let minX = Infinity;
+  let maxX = -Infinity;
+  let minY = Infinity;
+  let maxY = -Infinity;
+  for (const entry of entries) {
+    minX = Math.min(minX, entry.x);
+    maxX = Math.max(maxX, entry.x);
+    minY = Math.min(minY, entry.y);
+    maxY = Math.max(maxY, entry.y);
+  }
+  const tileCount = 4;
+  const spanX = Math.max(1e-6, maxX - minX);
+  const spanY = Math.max(1e-6, maxY - minY);
+  const tiles = /* @__PURE__ */ new Map();
+  for (const entry of entries) {
+    const tx = Math.min(
+      tileCount - 1,
+      Math.max(0, Math.floor((entry.x - minX) / spanX * tileCount))
+    );
+    const ty = Math.min(
+      tileCount - 1,
+      Math.max(0, Math.floor((entry.y - minY) / spanY * tileCount))
+    );
+    const key = `${tx}:${ty}`;
+    let tile = tiles.get(key);
+    if (!tile) {
+      tile = { tx, ty, sourceIndex: entry.item.sourceIndex, items: [] };
+      tiles.set(key, tile);
+    }
+    tile.items.push(entry.item);
+    tile.sourceIndex = Math.min(tile.sourceIndex, entry.item.sourceIndex);
+  }
+  return Array.from(tiles.values()).sort((a, b) => a.ty - b.ty || a.tx - b.tx || a.sourceIndex - b.sourceIndex).flatMap((tile) => tile.items);
+}
+function createPolyVoxelRenderer(options) {
+  const { doc, wrapper, polygons, directionalLight, ambientLight } = options;
+  const directMatrixItems = buildDirectMatrixItems(polygons);
+  if (directMatrixItems.length === 0) return null;
+  const itemFaces = new Set(directMatrixItems.map((item) => item.face));
+  wrapper.classList.add("polycss-voxel-mesh");
+  const primitiveSize = primitiveSizeForDocument(doc);
+  if (primitiveSize !== DESKTOP_PRIMITIVE_SIZE) {
+    wrapper.style.setProperty("--polycss-voxel-primitive", `${primitiveSize}px`);
+  }
+  const colorCache = /* @__PURE__ */ new Map();
+  const shadedColor = (face, baseColor) => {
+    const key = `${face}|${baseColor}`;
+    const cached = colorCache.get(key);
+    if (cached) return cached;
+    const shaded = shadeBrushColor(FACE_NORMALS[face], baseColor, directionalLight, ambientLight);
+    colorCache.set(key, shaded);
+    return shaded;
+  };
+  const elementBySourceIndex = /* @__PURE__ */ new Map();
+  const hostByFace = /* @__PURE__ */ new Map();
+  const faceOrderKeys = /* @__PURE__ */ new Map();
+  const directMatrixItemsByFace = /* @__PURE__ */ new Map();
+  for (const item of directMatrixItems) {
+    let faceItems = directMatrixItemsByFace.get(item.face);
+    if (!faceItems) {
+      faceItems = [];
+      directMatrixItemsByFace.set(item.face, faceItems);
+    }
+    faceItems.push(item);
+  }
+  let lastSignature = "";
+  let mountedBrushCount = 0;
+  let mountedFaces = /* @__PURE__ */ new Set();
+  const brushForItem = (item) => {
+    let el = elementBySourceIndex.get(item.sourceIndex);
+    if (!el) {
+      el = doc.createElement("b");
+      elementBySourceIndex.set(item.sourceIndex, el);
+      applyBrush(
+        el,
+        shadedColor(item.face, item.baseColor),
+        directMatrix(item, primitiveSize)
+      );
+    }
+    return el;
+  };
+  const hostForFace = (face) => {
+    let host = hostByFace.get(face);
+    if (!host) {
+      host = doc.createElement("span");
+      host.className = `polycss-voxel-face polycss-voxel-face-${face}`;
+      host.dataset.polycssVoxelFace = face;
+      host.__polycssVoxelFaceHost = true;
+      hostByFace.set(face, host);
+    }
+    return host;
+  };
+  const firstPreservedChild = () => {
+    for (const child of Array.from(wrapper.childNodes)) {
+      if (child.__polycssVoxelFaceHost) continue;
+      return child;
+    }
+    return null;
+  };
+  const syncFaceHost = (face, items) => {
+    const nextOrderKey = items.map((item) => item.sourceIndex).join(",");
+    if (faceOrderKeys.get(face) === nextOrderKey) return;
+    const host = hostForFace(face);
+    const fragment = doc.createDocumentFragment();
+    for (const item of items) fragment.appendChild(brushForItem(item));
+    host.replaceChildren(fragment);
+    faceOrderKeys.set(face, nextOrderKey);
+  };
+  const prebuildFaceHosts = () => {
+    for (const face of FACE_ORDER) {
+      if (!itemFaces.has(face)) continue;
+      syncFaceHost(face, directMatrixItemsByFace.get(face) ?? []);
+    }
+  };
+  const facesForSignature = (signature) => new Set(signature.split("|").filter(Boolean));
+  const faceOrderForSignature = (signature) => {
+    const visibleFaces = facesForSignature(signature);
+    return FACE_ORDER.filter((face) => visibleFaces.has(face) && itemFaces.has(face));
+  };
+  const countBrushesForFaces = (faces) => {
+    let count = 0;
+    for (const face of faces) count += directMatrixItemsByFace.get(face)?.length ?? 0;
+    return count;
+  };
+  const itemsByFaceOrder = (orderedItems) => {
+    const seen = /* @__PURE__ */ new Set();
+    const orderedFaces = [];
+    const itemsByFace = /* @__PURE__ */ new Map();
+    for (const item of orderedItems) {
+      if (!seen.has(item.face)) {
+        seen.add(item.face);
+        orderedFaces.push(item.face);
+      }
+      let faceItems = itemsByFace.get(item.face);
+      if (!faceItems) {
+        faceItems = [];
+        itemsByFace.set(item.face, faceItems);
+      }
+      faceItems.push(item);
+    }
+    return { orderedFaces, itemsByFace };
+  };
+  const mountFaceHosts = (orderedFaces, reorderMountedFaces) => {
+    const nextFaces = new Set(orderedFaces);
+    for (const face of mountedFaces) {
+      if (nextFaces.has(face)) continue;
+      const host = hostByFace.get(face);
+      if (host?.parentNode === wrapper) wrapper.removeChild(host);
+    }
+    if (reorderMountedFaces) {
+      const fragment = doc.createDocumentFragment();
+      for (const face of orderedFaces) fragment.appendChild(hostForFace(face));
+      wrapper.insertBefore(fragment, firstPreservedChild());
+      mountedFaces = nextFaces;
+      return;
+    }
+    for (let i = 0; i < orderedFaces.length; i += 1) {
+      const face = orderedFaces[i];
+      const host = hostForFace(face);
+      if (host.parentNode === wrapper) continue;
+      let reference = null;
+      for (let j = i + 1; j < orderedFaces.length; j += 1) {
+        const nextHost = hostByFace.get(orderedFaces[j]);
+        if (nextHost?.parentNode === wrapper) {
+          reference = nextHost;
+          break;
+        }
+      }
+      wrapper.insertBefore(host, reference ?? firstPreservedChild());
+    }
+    mountedFaces = nextFaces;
+  };
+  const draw = (signature, rotation, syncOrder) => {
+    if (!syncOrder) {
+      const orderedFaces2 = faceOrderForSignature(signature);
+      mountFaceHosts(orderedFaces2, false);
+      mountedBrushCount = countBrushesForFaces(orderedFaces2);
+      return;
+    }
+    const visibleFaces = new Set(signature.split("|").filter(Boolean));
+    const orderedItems = orderDirectMatrixItems(directMatrixItems, visibleFaces, rotation);
+    const { orderedFaces, itemsByFace } = itemsByFaceOrder(orderedItems);
+    for (const face of orderedFaces) {
+      syncFaceHost(face, itemsByFace.get(face) ?? []);
+    }
+    mountFaceHosts(orderedFaces, true);
+    mountedBrushCount = orderedItems.length;
+  };
+  prebuildFaceHosts();
+  return {
+    get brushCount() {
+      return mountedBrushCount;
+    },
+    render(rotation) {
+      lastSignature = visibleFaceSignature(rotation);
+      draw(lastSignature, rotation, true);
+    },
+    syncCamera(rotation) {
+      const nextSignature = visibleFaceSignature(rotation);
+      if (nextSignature === lastSignature) return;
+      lastSignature = nextSignature;
+      draw(nextSignature, rotation, false);
+    },
+    dispose() {
+      for (const host of hostByFace.values()) host.remove();
+      wrapper.classList.remove("polycss-voxel-mesh");
+      wrapper.style.removeProperty("--polycss-voxel-primitive");
+      elementBySourceIndex.clear();
+      hostByFace.clear();
+      faceOrderKeys.clear();
+      mountedBrushCount = 0;
+      mountedFaces = /* @__PURE__ */ new Set();
+      lastSignature = "";
+    }
+  };
+}
+
+// src/scene/events.ts
+var MESH_REGISTRY = /* @__PURE__ */ new WeakMap();
+function registerMeshElement(el, handle) {
+  MESH_REGISTRY.set(el, handle);
+}
+function unregisterMeshElement(el) {
+  MESH_REGISTRY.delete(el);
+}
+function findPolyMeshHandle(el) {
+  let cur = el;
+  while (cur) {
+    if (cur instanceof HTMLElement) {
+      const h = MESH_REGISTRY.get(cur);
+      if (h) return h;
+    }
+    cur = cur.parentElement;
+  }
+  return null;
+}
+
+// src/scene/PolyMesh.tsx
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var reactEdgeOwnersCache = /* @__PURE__ */ new WeakMap();
+var reactEdgeOwnersCacheKey = /* @__PURE__ */ new WeakMap();
+function solidPaintVars(defaults) {
+  const out = {};
+  if (defaults.paintColor) out["--polycss-paint"] = defaults.paintColor;
+  if (defaults.dynamicColor) {
+    out["--psr"] = (defaults.dynamicColor.r / 255).toFixed(4);
+    out["--psg"] = (defaults.dynamicColor.g / 255).toFixed(4);
+    out["--psb"] = (defaults.dynamicColor.b / 255).toFixed(4);
+  }
+  return Object.keys(out).length > 0 ? out : null;
+}
+function recenterPolygons(polygons) {
+  if (polygons.length === 0) return polygons;
+  const bbox = (0, import_polycss_core14.computeSceneBbox)(polygons);
+  const cx = (bbox.min[0] + bbox.max[0]) / 2;
+  const cy = (bbox.min[1] + bbox.max[1]) / 2;
+  const cz = (bbox.min[2] + bbox.max[2]) / 2;
+  if (cx === 0 && cy === 0 && cz === 0) return polygons;
+  const shift = (v) => [v[0] - cx, v[1] - cy, v[2] - cz];
+  return polygons.map((p) => ({
+    ...p,
+    vertices: p.vertices.map(shift),
+    ...p.textureTriangles?.length ? {
+      textureTriangles: p.textureTriangles.map((triangle) => ({
+        ...triangle,
+        vertices: triangle.vertices.map(shift)
+      }))
+    } : null
+  }));
+}
+var PolyMesh = (0, import_react14.forwardRef)(function PolyMesh2({
+  id,
+  src,
+  mtl,
+  polygons: polygonsProp,
+  voxelSource: voxelSourceProp,
+  autoCenter,
+  textureLighting,
+  textureQuality,
+  textureLeafSizing,
+  textureImageRendering,
+  textureBackend,
+  textureProjection,
+  seamBleed,
+  atomicAtlas,
+  onFrameReady,
+  castShadow,
+  receiveShadow,
+  shadowDefinition,
+  merge = true,
+  children,
+  fallback,
+  errorFallback,
+  parseOptions,
+  meshResolution,
+  position,
+  scale,
+  rotation,
+  className,
+  style,
+  onClick,
+  onContextMenu,
+  onDoubleClick,
+  onWheel,
+  onPointerDown,
+  onPointerUp,
+  onPointerMove,
+  onPointerOver,
+  onPointerOut,
+  onPointerEnter,
+  onPointerLeave,
+  onPointerCancel
+}, forwardedRef) {
+  const mergedOptions = (0, import_react14.useMemo)(() => {
+    if (!mtl && !parseOptions && meshResolution === void 0) return void 0;
+    return {
+      ...parseOptions ?? {},
+      ...mtl ? { mtlUrl: mtl } : {},
+      ...meshResolution !== void 0 ? { meshResolution } : {}
+    };
+  }, [mtl, parseOptions, meshResolution]);
+  const fetched = usePolyMesh(src ?? "", mergedOptions);
+  const externalPolygons = src ? fetched.polygons : polygonsProp ?? [];
+  const externalVoxelSource = src ? fetched.voxelSource : voxelSourceProp;
+  const [localPolygons, setLocalPolygons] = (0, import_react14.useState)(null);
+  const prevExternalRef = (0, import_react14.useRef)(externalPolygons);
+  if (prevExternalRef.current !== externalPolygons) {
+    prevExternalRef.current = externalPolygons;
+    if (localPolygons !== null) setLocalPolygons(null);
+  }
+  const rawSourcePolygons = localPolygons ?? externalPolygons;
+  const sourcePolygons = (0, import_react14.useMemo)(
+    () => merge ? (0, import_polycss_core14.optimizeMeshPolygons)(rawSourcePolygons, meshResolution !== void 0 ? { meshResolution } : void 0) : rawSourcePolygons,
+    [rawSourcePolygons, merge, meshResolution]
+  );
+  const hasRenderProp = typeof children === "function";
+  const renderPolygon = hasRenderProp ? children : null;
+  const staticChildren = hasRenderProp ? null : children;
+  const hasStaticChildren = staticChildren !== null && staticChildren !== void 0 && staticChildren !== false;
+  const polygons = (0, import_react14.useMemo)(
+    () => autoCenter ? recenterPolygons(sourcePolygons) : sourcePolygons,
+    [sourcePolygons, autoCenter]
+  );
+  const transform = (0, import_polycss_core14.buildPolyMeshTransform)({ position, scale, rotation });
+  const wrapperRef = (0, import_react14.useRef)(null);
+  const propsRef = (0, import_react14.useRef)({ position, scale, rotation });
+  propsRef.current = { position, scale, rotation };
+  const polygonsRef = (0, import_react14.useRef)(polygons);
+  polygonsRef.current = polygons;
+  const [bakedRotation, setBakedRotation] = (0, import_react14.useState)(rotation);
+  const stableTriangleColorFrameRef = (0, import_react14.useRef)(0);
+  const setPolygonsImplRef = (0, import_react14.useRef)(() => {
+  });
+  const textureReadyRef = (0, import_react14.useRef)(true);
+  const textureReadyWaitersRef = (0, import_react14.useRef)([]);
+  const resolveTextureReadyWaiters = (0, import_react14.useCallback)(() => {
+    const waiters = textureReadyWaitersRef.current.splice(0);
+    for (const resolve of waiters) resolve();
+  }, []);
+  const handle = (0, import_react14.useMemo)(() => ({
+    get element() {
+      return wrapperRef.current;
+    },
+    id,
+    getPosition: () => propsRef.current.position,
+    getRotation: () => propsRef.current.rotation,
+    getScale: () => propsRef.current.scale,
+    getPolygons: () => polygonsRef.current,
+    setPolygons(nextPolygons) {
+      setPolygonsImplRef.current(nextPolygons);
+    },
+    rebakeAtlas: () => setBakedRotation(propsRef.current.rotation),
+    whenTexturesReady() {
+      if (textureReadyRef.current) return Promise.resolve();
+      return new Promise((resolve) => {
+        textureReadyWaitersRef.current.push(resolve);
+      });
+    },
+    updatePolygon(target, partial) {
+      const current = polygonsRef.current;
+      const idx = typeof target === "number" ? target : current.indexOf(target);
+      if (idx < 0 || idx >= current.length) return;
+      Object.assign(current[idx], partial);
+      setLocalPolygons([...current]);
+    }
+  }), [id]);
+  (0, import_react14.useImperativeHandle)(forwardedRef, () => handle, [handle]);
+  (0, import_react14.useEffect)(() => {
+    const el = wrapperRef.current;
+    if (!el) return;
+    registerMeshElement(el, handle);
+    return () => unregisterMeshElement(el);
+  }, [handle]);
+  const cameraCtx = (0, import_react14.useContext)(PolyCameraContext);
+  const cameraElRef = cameraCtx?.cameraElRef ?? null;
+  const pointerDownAtRef = (0, import_react14.useRef)(null);
+  const makeEvent = (0, import_react14.useCallback)(
+    function makeEvent2(nativeEvent, clientX, clientY) {
+      const intersections = [];
+      if (typeof document !== "undefined" && typeof document.elementsFromPoint === "function") {
+        const stacked = document.elementsFromPoint(clientX, clientY);
+        const seen = /* @__PURE__ */ new Set();
+        for (const el of stacked) {
+          const h = findPolyMeshHandle(el);
+          if (h && !seen.has(h)) {
+            seen.add(h);
+            intersections.push({ object: h });
+          }
+        }
+      }
+      let nx = 0;
+      let ny = 0;
+      const camEl = cameraElRef?.current;
+      if (camEl) {
+        const r = camEl.getBoundingClientRect();
+        if (r.width > 0 && r.height > 0) {
+          nx = (clientX - r.left) / r.width * 2 - 1;
+          ny = -((clientY - r.top) / r.height * 2 - 1);
+        }
+      }
+      let delta = 0;
+      const pd = pointerDownAtRef.current;
+      if (pd) delta = Math.hypot(clientX - pd.x, clientY - pd.y);
+      return {
+        object: intersections[0]?.object ?? handle,
+        eventObject: handle,
+        intersections,
+        pointer: { x: nx, y: ny },
+        delta,
+        nativeEvent,
+        stopPropagation: () => nativeEvent.stopPropagation()
+      };
+    },
+    [cameraElRef, handle]
+  );
+  const wrapperHandlers = (0, import_react14.useMemo)(() => {
+    const dispatch = (polyHandler, reactEvent, nativeEvent, clientX, clientY) => {
+      if (!polyHandler) return;
+      const polyEvent = makeEvent(nativeEvent, clientX, clientY);
+      const originalStop = polyEvent.stopPropagation;
+      polyEvent.stopPropagation = () => {
+        originalStop();
+        reactEvent.stopPropagation();
+      };
+      polyHandler(polyEvent);
+    };
+    const out = {};
+    if (onClick) {
+      out.onClick = (e) => dispatch(onClick, e, e.nativeEvent, e.clientX, e.clientY);
+    }
+    if (onContextMenu) {
+      out.onContextMenu = (e) => dispatch(onContextMenu, e, e.nativeEvent, e.clientX, e.clientY);
+    }
+    if (onDoubleClick) {
+      out.onDoubleClick = (e) => dispatch(onDoubleClick, e, e.nativeEvent, e.clientX, e.clientY);
+    }
+    if (onWheel) {
+      out.onWheel = (e) => dispatch(onWheel, e, e.nativeEvent, e.clientX, e.clientY);
+    }
+    if (onPointerDown) {
+      out.onPointerDown = (e) => {
+        pointerDownAtRef.current = { x: e.clientX, y: e.clientY };
+        dispatch(onPointerDown, e, e.nativeEvent, e.clientX, e.clientY);
+      };
+    } else {
+      out.onPointerDown = (e) => {
+        pointerDownAtRef.current = { x: e.clientX, y: e.clientY };
+      };
+    }
+    if (onPointerUp) {
+      out.onPointerUp = (e) => {
+        dispatch(onPointerUp, e, e.nativeEvent, e.clientX, e.clientY);
+        pointerDownAtRef.current = null;
+      };
+    } else {
+      out.onPointerUp = () => {
+        pointerDownAtRef.current = null;
+      };
+    }
+    if (onPointerMove) {
+      out.onPointerMove = (e) => dispatch(onPointerMove, e, e.nativeEvent, e.clientX, e.clientY);
+    }
+    if (onPointerOver || onPointerEnter) {
+      out.onPointerEnter = (e) => {
+        if (onPointerOver) dispatch(onPointerOver, e, e.nativeEvent, e.clientX, e.clientY);
+        if (onPointerEnter) dispatch(onPointerEnter, e, e.nativeEvent, e.clientX, e.clientY);
+      };
+    }
+    if (onPointerOut || onPointerLeave) {
+      out.onPointerLeave = (e) => {
+        if (onPointerOut) dispatch(onPointerOut, e, e.nativeEvent, e.clientX, e.clientY);
+        if (onPointerLeave) dispatch(onPointerLeave, e, e.nativeEvent, e.clientX, e.clientY);
+      };
+    }
+    if (onPointerCancel) {
+      out.onPointerCancel = (e) => {
+        dispatch(onPointerCancel, e, e.nativeEvent, e.clientX, e.clientY);
+        pointerDownAtRef.current = null;
+      };
+    }
+    return out;
+  }, [
+    makeEvent,
+    onClick,
+    onContextMenu,
+    onDoubleClick,
+    onWheel,
+    onPointerDown,
+    onPointerUp,
+    onPointerMove,
+    onPointerOver,
+    onPointerOut,
+    onPointerEnter,
+    onPointerLeave,
+    onPointerCancel
+  ]);
+  const sceneCtx = usePolySceneContext();
+  const effectiveTextureLighting = textureLighting ?? sceneCtx?.textureLighting ?? "baked";
+  const effectiveStrategies = sceneCtx?.strategies;
+  const disabledStrategies = (0, import_react14.useMemo)(
+    () => effectiveStrategies?.disable?.length ? new Set(effectiveStrategies.disable) : void 0,
+    [effectiveStrategies]
+  );
+  const effectiveSeamBleed = seamBleed ?? sceneCtx?.seamBleed ?? import_polycss_core14.DEFAULT_SEAM_BLEED;
+  const effectiveTextureLeafSizing = textureLeafSizing ?? sceneCtx?.textureLeafSizing;
+  const effectiveTextureImageRendering = textureImageRendering ?? sceneCtx?.textureImageRendering;
+  const effectiveTextureBackend = textureBackend ?? sceneCtx?.textureBackend;
+  const effectiveTextureProjection = textureProjection ?? sceneCtx?.textureProjection;
+  const effectiveDirectional = sceneCtx?.directionalLight;
+  const effectiveAmbient = sceneCtx?.ambientLight;
+  const directVoxelEnabled = Boolean(
+    externalVoxelSource && localPolygons === null && !renderPolygon && !hasStaticChildren && effectiveTextureLighting === "baked" && !castShadow
+  );
+  const sceneDirectionalLight = sceneCtx?.directionalLight;
+  const dynamicLightOverride = (0, import_react14.useMemo)(() => {
+    if (effectiveTextureLighting !== "dynamic") return null;
+    if (!rotation || rotation[0] === 0 && rotation[1] === 0 && rotation[2] === 0) return null;
+    if (!sceneDirectionalLight) return null;
+    const dir = sceneDirectionalLight.direction;
+    const localDir = (0, import_polycss_core14.inverseRotateVec3)(dir, rotation);
+    const len = Math.hypot(localDir[0], localDir[1], localDir[2]) || 1;
+    return {
+      ["--plx"]: (localDir[0] / len).toFixed(2),
+      ["--ply"]: (localDir[1] / len).toFixed(2),
+      ["--plz"]: (localDir[2] / len).toFixed(2)
+    };
+  }, [effectiveTextureLighting, rotation, sceneDirectionalLight]);
+  const bakedDirectional = (0, import_react14.useMemo)(() => {
+    if (!effectiveDirectional) return effectiveDirectional;
+    const rot = bakedRotation ?? [0, 0, 0];
+    const cssLight = (0, import_polycss_core15.worldDirectionalLightToCss)(effectiveDirectional);
+    if (rot[0] === 0 && rot[1] === 0 && rot[2] === 0) return cssLight;
+    return {
+      ...cssLight,
+      direction: (0, import_polycss_core14.inverseRotateVec3)(cssLight.direction, rot)
+    };
+  }, [effectiveDirectional, bakedRotation]);
+  const bakedPointLights = (0, import_react14.useMemo)(() => {
+    const pls = sceneCtx?.pointLights;
+    if (!pls || pls.length === 0) return void 0;
+    const pos = position ?? [0, 0, 0];
+    const rot = bakedRotation ?? [0, 0, 0];
+    const hasRot = rot[0] !== 0 || rot[1] !== 0 || rot[2] !== 0;
+    return pls.map((pl) => {
+      const rel = [pl.position[0] - pos[0], pl.position[1] - pos[1], pl.position[2] - pos[2]];
+      const local = hasRot ? (0, import_polycss_core14.inverseRotateVec3)(rel, rot) : rel;
+      return { ...pl, position: local };
+    });
+  }, [sceneCtx?.pointLights, position, bakedRotation]);
+  const lightOccludedPolyIndices = void 0;
+  const atlasPlans = (0, import_react14.useMemo)(
+    () => {
+      if (renderPolygon || directVoxelEnabled) return [];
+      const repairEdges = (0, import_polycss_core12.buildTextureEdgeRepairSets)(polygons);
+      const seamBleedEdges = effectiveSeamBleed === "auto" || typeof effectiveSeamBleed === "number" && Number.isFinite(effectiveSeamBleed) && effectiveSeamBleed > 0 ? (0, import_polycss_core12.buildSeamBleedPolygonEdges)(polygons, {
+        directionalLight: bakedDirectional,
+        ambientLight: effectiveAmbient
+      }) : null;
+      const basisHints = (0, import_polycss_core15.buildBasisHints)(polygons, {
+        directionalLight: bakedDirectional,
+        ambientLight: effectiveAmbient
+      });
+      return polygons.map((p, i) => computeTextureAtlasPlan(
+        p,
+        i,
+        {
+          directionalLight: bakedDirectional,
+          pointLights: bakedPointLights,
+          ambientLight: effectiveAmbient,
+          seamBleed: seamBleedEdges?.has(i) ? effectiveSeamBleed : void 0,
+          seamEdges: seamBleedEdges?.get(i),
+          textureEdgeRepairEdges: repairEdges[i],
+          lightOccludedPolyIndices
+        },
+        basisHints[i]
+      ));
+    },
+    [renderPolygon, directVoxelEnabled, polygons, bakedDirectional, bakedPointLights, effectiveAmbient, effectiveSeamBleed, lightOccludedPolyIndices]
+  );
+  const textureAtlas = useTextureAtlas(
+    atlasPlans,
+    effectiveTextureLighting,
+    textureQuality,
+    effectiveTextureLeafSizing,
+    effectiveTextureBackend,
+    effectiveTextureImageRendering,
+    effectiveTextureProjection,
+    effectiveStrategies,
+    atomicAtlas
+  );
+  textureReadyRef.current = textureAtlas.ready;
+  (0, import_react14.useEffect)(() => {
+    if (textureAtlas.ready) resolveTextureReadyWaiters();
+  }, [textureAtlas.ready, resolveTextureReadyWaiters]);
+  (0, import_react14.useEffect)(() => resolveTextureReadyWaiters, [resolveTextureReadyWaiters]);
+  const solidPaintDefaults = (0, import_react14.useMemo)(
+    () => !renderPolygon ? getSolidPaintDefaults(textureAtlas.plans, effectiveTextureLighting, effectiveStrategies) : {},
+    [renderPolygon, textureAtlas.plans, effectiveTextureLighting, effectiveStrategies]
+  );
+  const onFrameReadyRef = (0, import_react14.useRef)(onFrameReady);
+  onFrameReadyRef.current = onFrameReady;
+  (0, import_react14.useLayoutEffect)(() => {
+    if (atomicAtlas && textureAtlas.ready) onFrameReadyRef.current?.();
+  }, [textureAtlas.entries]);
+  const defaultPaintVars = (0, import_react14.useMemo)(
+    () => solidPaintVars(solidPaintDefaults),
+    [solidPaintDefaults]
+  );
+  const meshIdRef = (0, import_react14.useRef)(/* @__PURE__ */ Symbol());
+  const sceneRegisterShadowCaster = sceneCtx?.registerShadowCaster;
+  const renderedPolygonIndices = (0, import_react14.useMemo)(() => {
+    const dedupDrop = (0, import_polycss_core14.findOverlappingPolygonDuplicates)(polygons, {
+      normalTolerance: 0.1,
+      distanceTolerance: 0.5,
+      overlapFraction: 0.95,
+      preserveDoubleSidedBackfaces: false
+    });
+    const s = /* @__PURE__ */ new Set();
+    for (let i = 0; i < atlasPlans.length; i++) {
+      if (atlasPlans[i] && !dedupDrop.has(i)) s.add(i);
+    }
+    return s;
+  }, [atlasPlans, polygons]);
+  const shadowCasterRegisteredRef = (0, import_react14.useRef)(false);
+  const lastShadowPolyCountRef = (0, import_react14.useRef)(-1);
+  (0, import_react14.useEffect)(() => {
+    if (!sceneRegisterShadowCaster || !castShadow) return;
+    return () => {
+      sceneRegisterShadowCaster(meshIdRef.current, null);
+      shadowCasterRegisteredRef.current = false;
+      lastShadowPolyCountRef.current = -1;
+    };
+  }, [sceneRegisterShadowCaster, castShadow]);
+  (0, import_react14.useEffect)(() => {
+    if (!sceneRegisterShadowCaster || !castShadow) return;
+    const followAnimation = sceneCtx?.shadow?.followAnimation ?? false;
+    const topologyChanged = polygons.length !== lastShadowPolyCountRef.current;
+    if (shadowCasterRegisteredRef.current && !followAnimation && !topologyChanged) return;
+    lastShadowPolyCountRef.current = polygons.length;
+    shadowCasterRegisteredRef.current = true;
+    sceneRegisterShadowCaster(meshIdRef.current, {
+      polygons,
+      position: position ?? [0, 0, 0],
+      scale,
+      rotation,
+      renderedPolygonIndices,
+      shadowDefinition
+    });
+  }, [sceneRegisterShadowCaster, castShadow, polygons, position, scale, rotation, renderedPolygonIndices, shadowDefinition, sceneCtx?.shadow]);
+  const sceneRegisterShadowReceiver = sceneCtx?.registerShadowReceiver;
+  (0, import_react14.useEffect)(() => {
+    if (!sceneRegisterShadowReceiver) return;
+    sceneRegisterShadowReceiver(meshIdRef.current, !!receiveShadow);
+    return () => {
+      sceneRegisterShadowReceiver(meshIdRef.current, false);
+    };
+  }, [sceneRegisterShadowReceiver, receiveShadow]);
+  const bakedShadowGroundCssZ = sceneCtx?.groundCssZ ?? null;
+  const sceneShadow = sceneCtx?.shadow;
+  const sceneHasReceiver = sceneCtx?.hasShadowReceiver ?? false;
+  const shadowSvgNode = (0, import_react14.useMemo)(() => {
+    if (!castShadow || renderPolygon) return null;
+    if (sceneHasReceiver) return null;
+    if (bakedShadowGroundCssZ === null) return null;
+    const userGroundLightDir = sceneDirectionalLight?.direction ?? [0.4, -0.7, 0.59];
+    const lightDir = (0, import_polycss_core14.worldDirectionToCss)(userGroundLightDir);
+    const meshPosZ = position?.[2] ?? 0;
+    const localGroundCssZ = bakedShadowGroundCssZ - meshPosZ * import_polycss_core14.BASE_TILE;
+    const shadowDedupDrop = (0, import_polycss_core14.findOverlappingPolygonDuplicates)(polygons, {
+      normalTolerance: 0.1,
+      distanceTolerance: 0.5,
+      overlapFraction: 0.95,
+      preserveDoubleSidedBackfaces: false
+    });
+    const projections = [];
+    let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+    let fpMinX = Infinity, fpMinY = Infinity, fpMaxX = -Infinity, fpMaxY = -Infinity;
+    for (let i = 0; i < polygons.length; i++) {
+      const polygon = polygons[i];
+      if (shadowDedupDrop.has(i)) continue;
+      const plan = atlasPlans[i];
+      if (!plan) continue;
+      const projected = [];
+      for (const v of polygon.vertices) {
+        const cssVertex = [
+          v[1] * import_polycss_core14.BASE_TILE,
+          v[0] * import_polycss_core14.BASE_TILE,
+          v[2] * import_polycss_core14.BASE_TILE
+        ];
+        if (cssVertex[0] < fpMinX) fpMinX = cssVertex[0];
+        if (cssVertex[1] < fpMinY) fpMinY = cssVertex[1];
+        if (cssVertex[0] > fpMaxX) fpMaxX = cssVertex[0];
+        if (cssVertex[1] > fpMaxY) fpMaxY = cssVertex[1];
+        const p = (0, import_polycss_core14.projectCssVertexToGround)(cssVertex, lightDir, localGroundCssZ);
+        projected.push(p);
+        if (p[0] < minX) minX = p[0];
+        if (p[1] < minY) minY = p[1];
+        if (p[0] > maxX) maxX = p[0];
+        if (p[1] > maxY) maxY = p[1];
+      }
+      projections.push(projected);
+    }
+    if (projections.length === 0) return null;
+    const maxExtend = sceneShadow?.maxExtend ?? 2e3;
+    const bx0 = Math.max(minX, fpMinX - maxExtend);
+    const by0 = Math.max(minY, fpMinY - maxExtend);
+    const bx1 = Math.min(maxX, fpMaxX + maxExtend);
+    const by1 = Math.min(maxY, fpMaxY + maxExtend);
+    const width = bx1 - bx0;
+    const height = by1 - by0;
+    if (!(width > 0) || !(height > 0)) return null;
+    const shadowColor = sceneShadow?.color ?? "#000000";
+    const shadowOpacity = sceneShadow?.opacity ?? 0.25;
+    const parsed = (0, import_polycss_core14.parseHexColor)(shadowColor)?.rgb ?? [0, 0, 0];
+    let d = "";
+    for (const verts of projections) {
+      const ccw = (0, import_polycss_core14.ensureCcw2D)(verts);
+      d += `M${(ccw[0][0] - bx0).toFixed(3)},${(ccw[0][1] - by0).toFixed(3)}`;
+      for (let j = 1; j < ccw.length; j++) {
+        d += `L${(ccw[j][0] - bx0).toFixed(3)},${(ccw[j][1] - by0).toFixed(3)}`;
+      }
+      d += "Z";
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      "svg",
+      {
+        className: "polycss-shadow polycss-shadow-svg",
+        width,
+        height,
+        viewBox: `0 0 ${width} ${height}`,
+        style: {
+          position: "absolute",
+          top: 0,
+          left: 0,
+          display: "block",
+          overflow: "hidden",
+          transformOrigin: "0 0",
+          pointerEvents: "none",
+          willChange: "transform",
+          transform: `translate3d(${bx0.toFixed(3)}px,${by0.toFixed(3)}px,${localGroundCssZ.toFixed(3)}px)`
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+          "path",
+          {
+            d,
+            fill: `rgb(${parsed[0]},${parsed[1]},${parsed[2]})`,
+            fillRule: "nonzero",
+            stroke: `rgb(${parsed[0]},${parsed[1]},${parsed[2]})`,
+            strokeWidth: "3",
+            strokeLinejoin: "round",
+            opacity: shadowOpacity.toFixed(4)
+          }
+        )
+      },
+      "shadow-svg"
+    );
+  }, [castShadow, renderPolygon, polygons, atlasPlans, sceneDirectionalLight, bakedShadowGroundCssZ, sceneShadow, sceneHasReceiver]);
+  const shadowCasters = sceneCtx?.shadowCasters;
+  const shadowCastersVersion = sceneCtx?.shadowCastersVersion ?? 0;
+  const [cameraTick, setCameraTick] = (0, import_react14.useState)(0);
+  (0, import_react14.useEffect)(() => {
+    if (!receiveShadow) return;
+    return cameraCtx?.store.subscribe(() => setCameraTick((n) => n + 1));
+  }, [receiveShadow, cameraCtx?.store]);
+  void cameraTick;
+  const selfShadowEdgeMap = (0, import_react14.useMemo)(
+    () => receiveShadow ? (0, import_polycss_core14.buildSharedEdgeMap)(polygons) : void 0,
+    [polygons, receiveShadow]
+  );
+  const receiverShadowSvgs = (0, import_react14.useMemo)(() => {
+    if (!receiveShadow) return null;
+    if (!shadowCasters || shadowCasters.size === 0) return null;
+    const userLightDir = sceneDirectionalLight?.direction ?? [0.4, -0.7, 0.59];
+    const lightDir = (0, import_polycss_core14.worldDirectionToCss)(userLightDir);
+    const dynamicShading = effectiveTextureLighting === "dynamic";
+    const scenePoints = dynamicShading ? [] : sceneCtx?.pointLights ?? [];
+    const allPointLightsCss = scenePoints.map((pl) => ({
+      position: (0, import_polycss_core14.worldPositionToCss)(pl.position),
+      color: pl.color,
+      intensity: pl.intensity
+    }));
+    const shadowPointIndices = scenePoints.map((pl, i) => pl.castShadow ? i : -1).filter((i) => i >= 0);
+    const runDirectionalShadow = !!sceneDirectionalLight?.direction && (sceneDirectionalLight.intensity ?? 1) > 0;
+    const hasShadowPoints = shadowPointIndices.length > 0;
+    const shadowLift = sceneShadow?.lift ?? 1e-3;
+    const planes = (0, import_polycss_core14.prepareReceiverFacePlanes)(
+      polygons,
+      position ?? [0, 0, 0],
+      scale,
+      /* @__PURE__ */ new Set(),
+      shadowLift,
+      rotation
+    );
+    if (planes.length === 0) return null;
+    const casterInputs = [];
+    for (const [casterId, data] of shadowCasters) {
+      const items = (0, import_polycss_core14.prepareCasterPolyItems)(
+        data.polygons,
+        data.position,
+        data.scale,
+        () => true,
+        data.rotation ?? null
+      );
+      const isSelf = data.polygons === polygons;
+      const selfMap = isSelf ? selfShadowEdgeMap : void 0;
+      let edgeOwners;
+      if (!isSelf && (data.polygons.length >= 40 || hasShadowPoints)) {
+        const dposArr = data.position;
+        const drot = data.rotation ?? null;
+        const dsKey = JSON.stringify(data.scale ?? null);
+        const eoKey = `${dposArr[0]},${dposArr[1]},${dposArr[2]}|${drot ? drot.join(",") : "n"}|${dsKey}`;
+        let cachedOwners = reactEdgeOwnersCache.get(data.polygons);
+        if (cachedOwners === void 0 || reactEdgeOwnersCacheKey.get(data.polygons) !== eoKey) {
+          cachedOwners = (0, import_polycss_core14.prepareCasterEdgeOwners)(data.polygons, dposArr, data.scale, drot);
+          reactEdgeOwnersCache.set(data.polygons, cachedOwners);
+          reactEdgeOwnersCacheKey.set(data.polygons, eoKey);
+        }
+        edgeOwners = cachedOwners;
+      }
+      let overrideSilhouette;
+      let overridePointSilhouettes;
+      if (sceneShadow?.parametric) {
+        const def = data.shadowDefinition ?? sceneShadow.definition ?? 16;
+        const result = (0, import_polycss_core14.buildParametricCasterOverride)({
+          polysWorldVerts: items.map((it) => it.wv),
+          lightDir,
+          definition: def,
+          isSelf,
+          style: sceneShadow.style,
+          pointLights: shadowPointIndices.map((i) => ({ position: allPointLightsCss[i].position, index: i }))
+        });
+        overrideSilhouette = result.overrideSilhouette;
+        overridePointSilhouettes = result.overridePointSilhouettes;
+      }
+      casterInputs.push({
+        id: casterId,
+        items,
+        selfShadowEdgeMap: selfMap,
+        edgeOwners,
+        casterPolygonCount: data.polygons.length,
+        overrideSilhouette,
+        overridePointSilhouettes
+      });
+    }
+    const cameraState = cameraCtx?.store.getState().cameraState;
+    const cameraRot = {
+      rotX: cameraState?.rotX ?? 65,
+      rotY: cameraState?.rotY ?? 45,
+      meshRotation: rotation
+    };
+    const faces = (0, import_polycss_core14.computeMergedReceiverShadows)({
+      receiverPlanes: planes,
+      receiverPolygons: polygons,
+      receiverHasTexture: polygons.some((p) => p.texture !== void 0),
+      casters: casterInputs,
+      lightDir,
+      runDirectional: runDirectionalShadow,
+      pointPasses: shadowPointIndices.map((i) => ({ lightPos: allPointLightsCss[i].position, index: i })),
+      allPointLights: allPointLightsCss,
+      cameraRot,
+      ambientLight: sceneCtx?.ambientLight,
+      directionalLight: sceneDirectionalLight,
+      shadow: { color: sceneShadow?.color, opacity: sceneShadow?.opacity ?? 0.25, maxExtend: sceneShadow?.maxExtend }
+    });
+    if (faces.length === 0) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_jsx_runtime8.Fragment, { children: faces.map((fc) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+      "svg",
+      {
+        className: "polycss-shadow polycss-shadow-svg polycss-shadow-receiver",
+        "data-poly-shadow-type": "receiver",
+        "data-poly-shadow-receiver-face": fc.faceIndex,
+        "data-poly-shadow-receiver-polys": JSON.stringify(fc.memberPolyIndices),
+        width: fc.width,
+        height: fc.height,
+        viewBox: `0 0 ${fc.width} ${fc.height}`,
+        style: {
+          position: "absolute",
+          top: 0,
+          left: 0,
+          display: "block",
+          overflow: "hidden",
+          transformOrigin: "0 0",
+          pointerEvents: "none",
+          willChange: "transform",
+          opacity: fc.svgOpacity,
+          transform: fc.matrixCss
+        },
+        children: [
+          fc.baseFill && fc.baseD ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: fc.baseD, fill: fc.baseFill, fillRule: "nonzero" }) : null,
+          fc.layers.map((layer, i) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+            "path",
+            {
+              d: layer.d,
+              fill: layer.fill,
+              fillRule: "nonzero",
+              opacity: layer.opacity !== 1 ? layer.opacity.toFixed(4) : void 0,
+              style: layer.multiply ? { mixBlendMode: "multiply" } : void 0
+            },
+            i
+          ))
+        ]
+      },
+      `receiver-${fc.faceIndex}`
+    )) });
+  }, [receiveShadow, shadowCasters, shadowCastersVersion, polygons, position, scale, rotation, sceneDirectionalLight, sceneCtx?.pointLights, effectiveTextureLighting, sceneShadow, sceneCtx?.ambientLight, cameraCtx?.store, cameraTick, selfShadowEdgeMap]);
+  const portalSceneEl = sceneCtx?.sceneEl ?? null;
+  const portaledReceiverShadowSvgs = portalSceneEl && receiverShadowSvgs ? (0, import_react_dom.createPortal)(receiverShadowSvgs, portalSceneEl) : null;
+  setPolygonsImplRef.current = (nextPolygons) => {
+    const nextRenderedPolygons = autoCenter ? recenterPolygons(nextPolygons) : nextPolygons;
+    polygonsRef.current = nextRenderedPolygons;
+    const root = wrapperRef.current;
+    if (root && !renderPolygon && updateStableTriangleDom(root, nextRenderedPolygons, {
+      directionalLight: bakedDirectional,
+      ambientLight: effectiveAmbient,
+      textureLighting: effectiveTextureLighting,
+      strategies: effectiveStrategies,
+      seamBleed: effectiveSeamBleed,
+      colorFrame: ++stableTriangleColorFrameRef.current,
+      // Animated low-poly triangles can swing face normals sharply; keep the
+      // mounted baked color pinned and animate transforms only.
+      colorFreezeFrames: 0
+    })) {
+      return;
+    }
+    setLocalPolygons([...nextPolygons]);
+  };
+  const voxelRendererRef = (0, import_react14.useRef)(null);
+  (0, import_react14.useLayoutEffect)(() => {
+    const root = wrapperRef.current;
+    voxelRendererRef.current?.dispose();
+    voxelRendererRef.current = null;
+    if (!directVoxelEnabled || !root) return;
+    const renderer = createPolyVoxelRenderer({
+      doc: root.ownerDocument,
+      wrapper: root,
+      polygons,
+      directionalLight: bakedDirectional,
+      ambientLight: effectiveAmbient
+    });
+    if (!renderer) return;
+    const cameraRotation = () => {
+      const cameraState = cameraCtx?.store.getState().cameraState;
+      return {
+        rotX: cameraState?.rotX ?? 65,
+        rotY: cameraState?.rotY ?? 45,
+        meshRotation: rotation
+      };
+    };
+    voxelRendererRef.current = renderer;
+    renderer.render(cameraRotation());
+    const unsubscribe = cameraCtx?.store.subscribe(() => {
+      renderer.syncCamera(cameraRotation());
+    });
+    return () => {
+      unsubscribe?.();
+      renderer.dispose();
+      if (voxelRendererRef.current === renderer) voxelRendererRef.current = null;
+    };
+  }, [
+    directVoxelEnabled,
+    polygons,
+    bakedDirectional,
+    effectiveAmbient,
+    cameraCtx?.store,
+    rotation
+  ]);
+  const wrapperStyle = {
+    transform,
+    ...dynamicLightOverride,
+    ...style,
+    ...defaultPaintVars
+  };
+  const renderedPolygons = renderPolygon ? polygons.map((p, i) => (
+    // Render-prop: caller controls how each polygon renders. We still
+    // wrap in a fragment with key so React reconciliation works.
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(RenderPropPolygon, { polygon: p, index: i, children: renderPolygon }, i)
+  )) : textureAtlas.entries.map((entry, index) => {
+    if (entry) {
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        TextureAtlasPoly,
+        {
+          entry,
+          page: textureAtlas.pages[entry.pageIndex],
+          textureLighting: effectiveTextureLighting,
+          textureImageRendering: effectiveTextureImageRendering,
+          solidPaintDefaults
+        },
+        entry.index
+      );
+    }
+    const plan = textureAtlas.plans[index];
+    const imageGeometry = plan ? (0, import_polycss_core14.resolvePolyTextureLeafGeometry)(plan, {
+      imageRendering: effectiveTextureImageRendering,
+      backend: effectiveTextureBackend,
+      projection: effectiveTextureProjection
+    }) : null;
+    if (plan && imageGeometry) {
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        TextureImagePoly,
+        {
+          plan,
+          geometry: imageGeometry
+        },
+        plan.index
+      );
+    }
+    if (!plan || plan.texture) return null;
+    if ((0, import_polycss_core12.isProjectiveQuadPlan)(plan)) {
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        TextureProjectiveSolidPoly,
+        {
+          entry: plan,
+          textureLighting: effectiveTextureLighting,
+          solidPaintDefaults
+        },
+        plan.index
+      );
+    }
+    if ((0, import_polycss_core12.isSolidTrianglePlan)(plan)) {
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        TextureTrianglePoly,
+        {
+          entry: plan,
+          textureLighting: effectiveTextureLighting,
+          solidPaintDefaults
+        },
+        plan.index
+      );
+    }
+    const cornerGeo = !disabledStrategies?.has("i") ? (0, import_polycss_core15.cornerShapeGeometryForPlan)(plan) : null;
+    if (cornerGeo) {
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        TextureCornerShapeSolidPoly,
+        {
+          entry: plan,
+          geometry: cornerGeo,
+          textureLighting: effectiveTextureLighting,
+          solidPaintDefaults
+        },
+        plan.index
+      );
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      TextureBorderShapePoly,
+      {
+        entry: plan,
+        textureLighting: effectiveTextureLighting,
+        solidPaintDefaults,
+        disabledStrategies
+      },
+      plan.index
+    );
+  });
+  if (src) {
+    if (fetched.loading && fetched.polygons.length === 0) {
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        "div",
+        {
+          ref: wrapperRef,
+          "data-poly-mesh-id": id,
+          className: `polycss-mesh polycss-mesh-loading${className ? ` ${className}` : ""}`,
+          style: wrapperStyle,
+          ...wrapperHandlers,
+          children: fallback ?? null
+        }
+      );
+    }
+    if (fetched.error && fetched.polygons.length === 0) {
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        "div",
+        {
+          ref: wrapperRef,
+          "data-poly-mesh-id": id,
+          className: `polycss-mesh polycss-mesh-error${className ? ` ${className}` : ""}`,
+          style: wrapperStyle,
+          ...wrapperHandlers,
+          children: errorFallback ? errorFallback(fetched.error) : null
+        }
+      );
+    }
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+    "div",
+    {
+      ref: wrapperRef,
+      "data-poly-mesh-id": id,
+      className: `polycss-mesh${directVoxelEnabled ? " polycss-voxel-mesh" : ""}${className ? ` ${className}` : ""}`,
+      style: wrapperStyle,
+      ...wrapperHandlers,
+      children: [
+        shadowSvgNode,
+        portaledReceiverShadowSvgs,
+        renderedPolygons,
+        staticChildren
+      ]
+    }
+  );
+});
+function RenderPropPolygon({
+  polygon,
+  index,
+  children
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_jsx_runtime8.Fragment, { children: children(polygon, index) });
+}
+
+// src/three/PolyThreeMesh.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+function applyObjectProps(object, {
+  position,
+  rotation,
+  scale
+}) {
+  if (position) object.position.set(position[0], position[1], position[2]);
+  if (rotation) object.rotation.set(rotation[0], rotation[1], rotation[2]);
+  if (typeof scale === "number") object.scale.set(scale, scale, scale);
+  else if (scale) object.scale.set(scale[0], scale[1], scale[2]);
+  return object;
+}
+function recenterPolygons2(polygons) {
+  if (polygons.length === 0) return polygons;
+  const bbox = (0, import_polycss_core16.computeSceneBbox)(polygons);
+  const center = [
+    (bbox.min[0] + bbox.max[0]) / 2,
+    (bbox.min[1] + bbox.max[1]) / 2,
+    (bbox.min[2] + bbox.max[2]) / 2
+  ];
+  if (center[0] === 0 && center[1] === 0 && center[2] === 0) return polygons;
+  const shift = (v) => [v[0] - center[0], v[1] - center[1], v[2] - center[2]];
+  return polygons.map((polygon) => ({
+    ...polygon,
+    vertices: polygon.vertices.map(shift),
+    ...polygon.textureTriangles?.length ? {
+      textureTriangles: polygon.textureTriangles.map((triangle) => ({
+        ...triangle,
+        vertices: triangle.vertices.map(shift)
+      }))
+    } : null
+  }));
+}
+function PolyThreeMeshInner({
+  object: objectProp,
+  polygons: polygonsProp,
+  src,
+  mtl,
+  position,
+  rotation,
+  scale,
+  autoCenter = false,
+  parseOptions,
+  meshResolution,
+  fallback,
+  errorFallback,
+  ...meshProps
+}) {
+  const objectRef = (0, import_react15.useRef)(objectProp ?? new import_three3.Object3D());
+  const mergedOptions = (0, import_react15.useMemo)(() => {
+    if (!mtl && !parseOptions && meshResolution === void 0) return void 0;
+    return {
+      ...parseOptions ?? {},
+      ...mtl ? { mtlUrl: mtl } : {},
+      ...meshResolution !== void 0 ? { meshResolution } : {}
+    };
+  }, [mtl, parseOptions, meshResolution]);
+  const fetched = usePolyMesh(src ?? "", mergedOptions);
+  const rawPolygons = polygonsProp ?? (src ? fetched.polygons : []);
+  const sourcePolygons = (0, import_react15.useMemo)(
+    () => autoCenter ? recenterPolygons2(rawPolygons) : rawPolygons,
+    [rawPolygons, autoCenter]
+  );
+  const polyPolygons = (0, import_react15.useMemo)(() => {
+    const object = objectProp ?? objectRef.current;
+    return (0, import_three3.transformPolygonsToPoly)(
+      sourcePolygons,
+      applyObjectProps(object, { position, rotation, scale })
+    );
+  }, [sourcePolygons, objectProp, position, rotation, scale]);
+  if (src && fetched.loading && polyPolygons.length === 0 && fallback !== void 0) {
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx_runtime9.Fragment, { children: fallback });
+  }
+  if (src && fetched.error && errorFallback) {
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx_runtime9.Fragment, { children: errorFallback(fetched.error) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    PolyMesh,
+    {
+      ...meshProps,
+      polygons: polyPolygons,
+      autoCenter: false,
+      meshResolution
+    }
+  );
+}
+var PolyThreeMesh = (0, import_react15.memo)(PolyThreeMeshInner);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  AmbientLight,
+  DirectionalLight,
+  Euler,
+  Object3D,
+  OrthographicCamera,
+  PerspectiveCamera,
+  PointLight,
+  PolyThreeMesh,
+  PolyThreeOrthographicCamera,
+  PolyThreePerspectiveCamera,
+  Vector3,
+  polyToThreeDirection,
+  polyToThreePoint,
+  threeToPolyDirection,
+  threeToPolyPoint,
+  transformPointToPoly,
+  transformPolygonsToPoly
+});