@figurosity/consumer-three-dimension-tool 0.5.0 → 0.8.0

package/dist/consumer-three-dimension-tool.js

@@ -1,46 +1,46 @@
-(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".tool-reset-button .qbtn{color:#333;font-weight:700}.debug-color{max-width:100px}.debug-color .swatch{height:20px;width:20px;border-radius:10px;border:1px solid #333}.debug-color .label{font-weight:700}.debug-value span{margin-top:2px;min-width:60px;font-size:11px}.debug-vector{min-width:130px}.debug-vector>div{font-size:10px}.debug-vector>div>span{min-width:20px;font-weight:700}.debug-boolean .indicator{margin-top:6px;margin-right:4px;height:10px;width:10px;border-radius:10px;border:1px solid #333;display:inline-block;background:red}.debug-boolean .indicator.on{background:#adff2f}.debug3D{position:absolute;z-index:14400;top:20px;left:40px;padding:20px;border:1px solid #ccc;border-radius:10px;background-color:#ffffffb3}.debug3D .color-square{display:inline-block;height:15px;width:15px;margin-bottom:-3px;border:1px dotted black}.three-dimension-tool{position:fixed;top:0;left:0;right:0;bottom:0;z-index:100}.three-dimension-tool .tres{width:100%;height:100vh}")),document.head.appendChild(e)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
-import { watch as O, ref as pe, nextTick as ns, onUnmounted as _t, computed as C, onMounted as jt, openBlock as nt, createElementBlock as rs, createCommentVNode as vt, createElementVNode as is, onBeforeMount as as, defineComponent as R, h as d, inject as xt, useModel as ls, onBeforeUnmount as cs, createBlock as mt, unref as ft, withCtx as ht, createVNode as us, mergeModels as ds } from "vue";
-import { useQuasar as ps, QBtn as Ut, QSeparator as Ie, Platform as ms } from "quasar";
-import { CBaseButton as Ce, CColorPickerPopup as fs, CExpansion as We, CToggle as Ot, CSlider as Ke, CBaseButtons as $t, CDraggableDrawer as Pe, CDraggableDrawers as hs, CToolPage as gs } from "@figurosity/consumer-controls";
-import { defineStore as Xe, storeToRefs as $, getActivePinia as bs } from "pinia";
+(function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.appendChild(document.createTextNode(".tool-reset-button .qbtn{color:#333;font-weight:700}:has(>.frozen-overlay){position:relative}.frozen-overlay{position:absolute;z-index:10;top:0;left:0;bottom:0;right:0}.debug-color{max-width:100px}.debug-color .swatch{height:20px;width:20px;border-radius:10px;border:1px solid #333}.debug-color .label{font-weight:700}.debug-value span{margin-top:2px;min-width:60px;font-size:11px}.debug-vector{min-width:130px}.debug-vector>div{font-size:10px}.debug-vector>div>span{min-width:20px;font-weight:700}.debug-boolean .indicator{margin-top:6px;margin-right:4px;height:10px;width:10px;border-radius:10px;border:1px solid #333;display:inline-block;background:red}.debug-boolean .indicator.on{background:#adff2f}.debug3D{position:absolute;z-index:14400;top:20px;left:40px;padding:20px;border:1px solid #ccc;border-radius:10px;background-color:#ffffffb3}.debug3D .color-square{display:inline-block;height:15px;width:15px;margin-bottom:-3px;border:1px dotted black}.three-dimension-tool{position:fixed;top:0;left:0;right:0;bottom:0;z-index:100}.three-dimension-tool .tres{width:100%;height:100vh}")),document.head.appendChild(o)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
+import { watch as j, ref as pe, nextTick as ls, onUnmounted as Ut, computed as C, onMounted as $t, openBlock as at, createElementBlock as cs, createCommentVNode as wt, createElementVNode as us, onBeforeMount as ds, defineComponent as V, h as d, withDirectives as ps, vShow as ms, inject as Ze, useModel as fs, onBeforeUnmount as hs, createBlock as vt, unref as bt, withCtx as yt, createVNode as gs, mergeModels as vs } from "vue";
+import { Platform as Ct, useQuasar as bs, QBtn as qt, QSeparator as ve } from "quasar";
+import { CBaseButton as me, CColorPickerPopup as ys, CExpansion as Ve, CToggle as Ht, CSlider as We, CBaseButtons as Jt, CDraggableDrawer as De, CDraggableDrawers as Ss, CToolPage as xs } from "@figurosity/consumer-controls";
+import { defineStore as Ye, storeToRefs as N, getActivePinia as ws } from "pinia";
 import * as I from "three";
-import Ze from "lodash.isequal";
-import { SKINS as ye, COLORS as se, GRID as Se, LIGHTS as de, RELATED as xe, getConfig as vs, useDynamicImages as ys, DEFAULT as Nt } from "@figurosity/toolbox";
-import { OrbitControls as Ss } from "three/examples/jsm/controls/OrbitControls.js";
+import Qe from "lodash.isequal";
+import { DEFAULT as lt, SKINS as xe, COLORS as oe, GRID as we, LIGHTS as de, RELATED as Ce, getConfig as Cs, useDynamicImages as Es } from "@figurosity/toolbox";
 import "three/examples/jsm/loaders/RGBELoader.js";
-import { RoomEnvironment as xs } from "three/examples/jsm/environments/RoomEnvironment.js";
-import { mergeVertices as Bt, mergeGeometries as Cs } from "three/examples/jsm/utils/BufferGeometryUtils.js";
-import { RoundedBoxGeometry as ws } from "three/examples/jsm/geometries/RoundedBoxGeometry.js";
-import { GLTFLoader as Es } from "three/examples/jsm/loaders/GLTFLoader.js";
-import { DRACOLoader as Is } from "three/examples/jsm/loaders/DRACOLoader.js";
-const Ms = "tool:switched", Ds = "pose:viewed", Ts = "skin:changed", gt = new I.Vector3(), zt = (e) => {
+import { RoomEnvironment as Is } from "three/examples/jsm/environments/RoomEnvironment.js";
+import { OrbitControls as Ds } from "three/examples/jsm/controls/OrbitControls.js";
+import { mergeVertices as Rt, mergeGeometries as ks } from "three/examples/jsm/utils/BufferGeometryUtils.js";
+import { RoundedBoxGeometry as Ts } from "three/examples/jsm/geometries/RoundedBoxGeometry.js";
+import { GLTFLoader as Ms } from "three/examples/jsm/loaders/GLTFLoader.js";
+import { DRACOLoader as As } from "three/examples/jsm/loaders/DRACOLoader.js";
+const Bs = "tool:switched", zs = "pose:viewed", Ps = "skin:changed", St = new I.Vector3(), Vt = (e) => {
   const t = new I.Box3().setFromObject(e);
   console.log("box", t);
-  const s = t.getSize(new I.Vector3()), i = new I.Vector3(
+  const s = t.getSize(new I.Vector3()), n = new I.Vector3(
     (t.min.x + t.max.x) / 2,
     (t.min.y + t.max.y) / 2,
     (t.min.z + t.max.z) / 2
   );
-  console.log("center", i);
+  console.log("center", n);
   let r = t.min.y;
-  return console.log("bottom", r), Math.abs(r) < -0.01 && (r = ks(e)), console.log("bottom", r), {
+  return console.log("bottom", r), Math.abs(r) < -0.01 && (r = Ls(e)), console.log("bottom", r), {
     box: t,
     size: s,
-    center: i,
+    center: n,
     bottom: r,
     top: t.max.y
   };
-}, ks = (e) => {
+}, Ls = (e) => {
   let t = 1 / 0;
   return e.updateMatrixWorld(!0), e.traverse((s) => {
-    var r, n;
+    var r, i;
     if (!s.isMesh) return;
-    const i = (n = (r = s.geometry) == null ? void 0 : r.attributes) == null ? void 0 : n.position;
-    if (i)
-      for (let o = 0; o < i.count; o++)
-        gt.fromBufferAttribute(i, o), gt.applyMatrix4(s.matrixWorld), t = Math.min(t, gt.y);
+    const n = (i = (r = s.geometry) == null ? void 0 : r.attributes) == null ? void 0 : i.position;
+    if (n)
+      for (let o = 0; o < n.count; o++)
+        St.fromBufferAttribute(n, o), St.applyMatrix4(s.matrixWorld), t = Math.min(t, St.y);
   }), t;
-}, Ht = (e) => ({
+}, Kt = (e) => ({
   box: {
     min: {
       x: e.box.min.x,
@@ -65,7 +65,7 @@ const Ms = "tool:switched", Ds = "pose:viewed", Ts = "skin:changed", gt = new I.
   },
   bottom: e.bottom,
   top: e.top
-}), qt = "smooth", As = (e) => ({
+}), Wt = "smooth", Rs = (e) => ({
   id: e.id,
   uuid: e.uuid ?? null,
   basePoseId: e.basePoseId ?? null,
@@ -77,21 +77,21 @@ const Ms = "tool:switched", Ds = "pose:viewed", Ts = "skin:changed", gt = new I.
   poseId: e.poseId ?? null,
   url: e.glbPathWebp || e.glbPath || null,
   bounds: e.bounds ?? null
-}), me = Xe("3d-glbs", {
+}), fe = Ye("3d-glbs", {
   state: () => ({
     models: {}
   }),
   getters: {
     selectedId() {
-      return A().selected;
+      return M().selected;
     },
     poseId(e) {
-      var s, i;
-      const t = A().selected;
-      return (i = (s = e.models) == null ? void 0 : s[t]) == null ? void 0 : i.poseId;
+      var s, n;
+      const t = M().selected;
+      return (n = (s = e.models) == null ? void 0 : s[t]) == null ? void 0 : n.poseId;
     },
     model(e) {
-      const t = A().selected;
+      const t = M().selected;
       return t && e.models[t] ? e.models[t] : null;
     },
     url() {
@@ -105,139 +105,169 @@ const Ms = "tool:switched", Ds = "pose:viewed", Ts = "skin:changed", gt = new I.
   },
   actions: {
     setBounds(e) {
-      const t = A().selected;
-      this.models[t] && (this.models[t].bounds = Ht(e));
+      const t = M().selected;
+      this.models[t] && (this.models[t].bounds = Kt(e));
     },
     setSubjectsFromResponse(e) {
-      var i;
-      const t = ((i = e == null ? void 0 : e.entities) == null ? void 0 : i.glb) || {}, s = {};
+      var n;
+      const t = ((n = e == null ? void 0 : e.entities) == null ? void 0 : n.glb) || {}, s = {};
       return Object.keys(t).forEach((r) => {
-        s[r] = As(t[r]);
+        s[r] = Rs(t[r]);
       }), this.models = { ...this.models, ...s }, this.selectDefaultGlbId(e);
     },
     // Picks the GLB id whose skin slug matches DEFAULT_SKIN_SLUG, falls
     // back to result.glb[0], or null when no GLBs are available.
     selectDefaultGlbId(e) {
-      var o, l, a;
+      var o, c, a;
       const t = Array.isArray((o = e == null ? void 0 : e.result) == null ? void 0 : o.glb) ? e.result.glb : [];
       if (t.length === 0) return null;
-      const s = ((l = e == null ? void 0 : e.entities) == null ? void 0 : l.skins) || {}, i = ((a = e == null ? void 0 : e.entities) == null ? void 0 : a.glb) || {}, n = t.find((u) => {
-        var D, w;
-        const p = (D = i[u]) == null ? void 0 : D.skinId;
-        return p != null && ((w = s[p]) == null ? void 0 : w.slug) === qt;
+      const s = ((c = e == null ? void 0 : e.entities) == null ? void 0 : c.skins) || {}, n = ((a = e == null ? void 0 : e.entities) == null ? void 0 : a.glb) || {}, i = t.find((u) => {
+        var P, w;
+        const p = (P = n[u]) == null ? void 0 : P.skinId;
+        return p != null && ((w = s[p]) == null ? void 0 : w.slug) === Wt;
       }) ?? t[0];
-      return typeof n == "string" ? parseInt(n, 10) : n;
+      return typeof i == "string" ? parseInt(i, 10) : i;
     }
   }
 });
-function Ye(e) {
+function et(e) {
   const t = e.startsWith("#") ? e.slice(1) : e;
   return parseInt(t, 16);
 }
 function ue(e) {
   return `#${e.toString(16).padStart(6, "0")}`;
 }
-const Qe = ({
+const tt = ({
   storeId: e,
   defaultValues: t = {},
   state: s = {},
-  getters: i = {},
+  getters: n = {},
   actions: r = {},
-  keyBy: n = "selected"
-}) => Xe(e, {
+  keyBy: i = "selected"
+}) => Ye(e, {
   state: () => ({
     loading: !1,
     models: {},
+    // Bumped by `restore()` so callers outside the lib (the
+    // consumer-app's `useViewerUrlSync` ?v= apply path) can trigger
+    // a re-apply into three.js. Stores whose state already flows
+    // through reactive watchers (grid/scene/ground) ignore this; the
+    // ones that don't (controls, lights orbit) use it as the only
+    // signal that the host did a `restore()` and the three.js camera
+    // needs to be re-driven from the store. See ThreeDimensionTool
+    // for the watcher and the rationale.
+    applyRevision: 0,
     ...s
   }),
   getters: {
     keyId() {
-      return A()[n];
+      return M()[i];
     },
     model(o) {
-      return o.models[A()[n]];
+      return o.models[M()[i]];
     },
     exists(o) {
-      return typeof o.models[A()[n]] < "u";
+      return typeof o.models[M()[i]] < "u";
     },
     selectedModel(o) {
-      return o.models[A()[n]] ?? null;
+      return o.models[M()[i]] ?? null;
     },
     mergedModel() {
       return { ...t, ...this.selectedModel ?? {} };
     },
     propertyById(o) {
-      return (l, a, u = null) => o.models[l] && a in o.models[l] ? o.models[l][a] : u;
+      return (c, a, u = null) => o.models[c] && a in o.models[c] ? o.models[c][a] : u;
     },
     propertyChangedById() {
-      return (o, l) => this.propertyById(o, l) !== t[l];
+      return (o, c) => this.propertyById(o, c) !== t[c];
     },
     propertyChanged(o) {
-      const l = A()[n];
-      return (a) => o.models[l] ? this.propertyById(l, a) !== t[a] : !1;
+      const c = M()[i];
+      return (a) => o.models[c] ? this.propertyById(c, a) !== t[a] : !1;
     },
     property() {
-      const o = A()[n];
-      return (l, a = t[l]) => this.propertyById(o, l, a);
+      const o = M()[i];
+      return (c, a = t[c]) => this.propertyById(o, c, a);
     },
-    ...i
+    ...n
   },
   actions: {
     initModel(o) {
-      o != null && (typeof this.models[o] < "u" || this.$patch((l) => {
-        l.models[o] = { ...t };
+      o != null && (typeof this.models[o] < "u" || this.$patch((c) => {
+        c.models[o] = { ...t };
       }));
     },
     ensureSelectedModel() {
-      const o = A()[n];
+      const o = M()[i];
       return o == null ? null : (this.models[o] || (this.models[o] = { ...t }), this.models[o]);
     },
-    setPropertyById(o, l, a) {
+    setPropertyById(o, c, a) {
       o != null && (this.models[o] || this.initModel(o), this.$patch({
         models: {
-          [o]: { ...this.models[o], [l]: a }
+          [o]: { ...this.models[o], [c]: a }
         }
       }));
     },
-    setProperty(o, l) {
-      const a = A()[n];
+    setProperty(o, c) {
+      const a = M()[i];
       a != null && (this.models[a] || this.initModel(a), this.$patch({
         models: {
-          [a]: { ...this.models[a], [o]: l }
+          [a]: { ...this.models[a], [o]: c }
         }
       }));
     },
     patchSelected(o) {
-      const l = this.ensureSelectedModel();
-      l && Object.assign(l, o);
+      const c = this.ensureSelectedModel();
+      c && Object.assign(c, o);
     },
     reset() {
-      const o = A()[n];
-      o != null && this.$patch((l) => {
-        l.models[o] = { ...t };
+      const o = M()[i];
+      o != null && this.$patch((c) => {
+        c.models[o] = { ...t };
       });
     },
     resetProperty(o) {
-      const l = A()[n];
-      l != null && this.models[l] && this.$patch({
+      const c = M()[i];
+      c != null && this.models[c] && this.$patch({
         models: {
-          [l]: {
-            ...this.models[l],
+          [c]: {
+            ...this.models[c],
             [o]: t[o]
           }
         }
       });
     },
+    // Capture the active model's tunable state as a plain object. Used
+    // by the save+freeze flow (consumer-app `composeViewState`) and the
+    // URL `?v=` writer in `useViewerUrlSync` to encode the current view.
+    // Returns null when there's no active bucket so the caller can omit
+    // the slot from the payload rather than encode a stale snapshot.
+    snapshot() {
+      const o = M()[i];
+      return o == null || !this.models[o] ? null : JSON.parse(JSON.stringify(this.models[o]));
+    },
+    // Apply a snapshot from the save+freeze payload back onto the
+    // active bucket. Missing keys fall through to defaultValues; the
+    // caller passes the same shape `snapshot()` produced.
+    restore(o) {
+      if (o == null || typeof o != "object") return;
+      const c = M()[i];
+      if (c == null) return;
+      const a = JSON.parse(JSON.stringify(o));
+      this.$patch((u) => {
+        u.models[c] = { ...t, ...a }, u.framed && (u.framed[c] = !0), u.applyRevision = (u.applyRevision || 0) + 1;
+      });
+    },
     ...r
   }
-}), Kt = {
+}), Xt = {
   visible: !0,
   opacity: 1,
   color: 16711422,
   texture: "none"
-}, Bs = {
+}, Vs = {
   changed() {
-    return this.exists ? !Ze(this.mergedModel, Kt) : !1;
+    return this.exists ? !Qe(this.mergedModel, Xt) : !1;
   },
   color() {
     return this.property("color");
@@ -254,7 +284,7 @@ const Qe = ({
   visible() {
     return this.property("visible");
   }
-}, zs = {
+}, Fs = {
   init() {
     this.initModel(this.keyId);
   },
@@ -262,7 +292,7 @@ const Qe = ({
     this.setProperty("color", e);
   },
   setColorHex(e) {
-    this.setProperty("color", Ye(e));
+    this.setProperty("color", et(e));
   },
   setTexture(e) {
     this.setProperty("texture", e);
@@ -270,33 +300,33 @@ const Qe = ({
   setVisible(e) {
     this.setProperty("visible", e);
   }
-}, Ve = Qe({
+}, Fe = tt({
   storeId: "3d-ground",
-  defaultValues: Kt,
+  defaultValues: Xt,
   state: { offset: -0.75 },
-  getters: Bs,
-  actions: zs,
+  getters: Vs,
+  actions: Fs,
   keyBy: "basePoseId"
-}), Ls = {
+}), _s = {
   color: 16777215,
   visible: !0,
   debug: !1,
   shadow: !0,
   visualization: !0
-}, Be = 0, te = 1, yt = 1.25, St = 3, et = (e, t, s) => Math.max(t, Math.min(s, e)), Ps = 1.25, ze = (e = {}) => ({ ...Ls, ...e }), Ae = {
+}, Pe = 0, se = 1, Et = 1.25, It = 3, ot = (e, t, s) => Math.max(t, Math.min(s, e)), Gs = 1.25, Le = (e = {}) => ({ ..._s, ...e }), ze = {
   advanced: !1,
   move: !1,
   position: { x: 0, y: 0, z: 1.5 },
   quaternion: { x: 0, y: 0, z: 0, w: 1 },
   target: { x: 0, y: 0, z: 0 }
-}, Lt = ["advanced", "move"], tt = (e = {}) => ({ ...Ae, ...e }), Vs = {
-  ambientScale: te,
-  userScale: te
-}, st = (e = {}) => ({ ...Vs, ...e }), bt = () => ({
-  key: ze(),
-  fill: ze({ shadow: !0 }),
-  back: ze({ shadow: !0 })
-}), fe = Xe("3d-lights", {
+}, Ft = ["advanced", "move"], nt = (e = {}) => ({ ...ze, ...e }), js = {
+  ambientScale: se,
+  userScale: se
+}, rt = (e = {}) => ({ ...js, ...e }), xt = () => ({
+  key: Le(),
+  fill: Le({ shadow: !0 }),
+  back: Le({ shadow: !0 })
+}), he = Ye("3d-lights", {
   state: () => ({
     lights: {},
     options: {},
@@ -308,14 +338,23 @@ const Qe = ({
     // doesn't depend on whether option fields happen to look default.
     framed: {},
     collection: ["key", "fill", "back"],
-    debug: !1
+    debug: !1,
+    // Bumped by `restore()` so ThreeDimensionTool can detect that the
+    // host (consumer-app's tier-3 ?v= save-load) pushed new state in,
+    // and re-activate lights/camera modes to drive the OrbitControls
+    // rig from the just-restored options/lights/scales slots. The
+    // intensity sliders and per-spot color watchers fire on slot
+    // mutations directly, but the rig position (in options.position/
+    // quaternion/target/radius) only flows through `applyFromStore`
+    // and needs the explicit re-activation signal.
+    applyRevision: 0
   }),
   getters: {
     bpId() {
-      return A().basePoseId;
+      return M().basePoseId;
     },
     skinId() {
-      return A().selected;
+      return M().selected;
     },
     // The reset button reflects "user has tweaked something on the
     // active skin." Toggles + rig are per-basePose; sliders are
@@ -325,10 +364,10 @@ const Qe = ({
     // toggles + the active skin's slider values count.
     changed(e) {
       const t = e.options[this.bpId];
-      if (t && Lt.some((i) => !Ze(t[i], Ae[i])))
+      if (t && Ft.some((n) => !Qe(t[n], ze[n])))
         return !0;
       const s = e.scales[this.skinId];
-      return !!(s && (s.ambientScale !== te || s.userScale !== te));
+      return !!(s && (s.ambientScale !== se || s.userScale !== se));
     },
     // Has frameToBounds + syncToStore landed on this basePose's
     // lights rig? Set by markFramed() from the bounds watcher in
@@ -351,34 +390,34 @@ const Qe = ({
     // above the new AMBIENT_SCALE_MAX / USER_SCALE_MAX.
     ambientScale(e) {
       var s;
-      const t = ((s = e.scales[this.skinId]) == null ? void 0 : s.ambientScale) ?? te;
-      return et(t, Be, yt);
+      const t = ((s = e.scales[this.skinId]) == null ? void 0 : s.ambientScale) ?? se;
+      return ot(t, Pe, Et);
     },
     userScale(e) {
       var s;
-      const t = ((s = e.scales[this.skinId]) == null ? void 0 : s.userScale) ?? te;
-      return et(t, Be, St);
+      const t = ((s = e.scales[this.skinId]) == null ? void 0 : s.userScale) ?? se;
+      return ot(t, Pe, It);
     },
     position(e) {
       var t;
-      return ((t = e.options[this.bpId]) == null ? void 0 : t.position) || Ae.position;
+      return ((t = e.options[this.bpId]) == null ? void 0 : t.position) || ze.position;
     },
     quaternion(e) {
       var t;
-      return ((t = e.options[this.bpId]) == null ? void 0 : t.quaternion) || Ae.quaternion;
+      return ((t = e.options[this.bpId]) == null ? void 0 : t.quaternion) || ze.quaternion;
     },
     target(e) {
       var t;
-      return ((t = e.options[this.bpId]) == null ? void 0 : t.target) || Ae.target;
+      return ((t = e.options[this.bpId]) == null ? void 0 : t.target) || ze.target;
     },
     radius(e) {
       var t;
       return (t = e.options[this.bpId]) == null ? void 0 : t.radius;
     },
     property(e) {
-      return (t, s = null, i = null) => {
+      return (t, s = null, n = null) => {
         const r = e.lights[this.bpId];
-        return !r || !r[t] || !(s in r[t]) ? i : r[t][s];
+        return !r || !r[t] || !(s in r[t]) ? n : r[t][s];
       };
     },
     colorHex(e) {
@@ -398,13 +437,13 @@ const Qe = ({
     reset() {
       const e = this.bpId, t = this.skinId;
       if (e == null) return;
-      this.options[e] || (this.options[e] = tt()), Lt.forEach((i) => this.options[e][i] = Ae[i]), t != null && (this.scales[t] || (this.scales[t] = st()), this.scales[t].ambientScale = te, this.scales[t].userScale = te);
+      this.options[e] || (this.options[e] = nt()), Ft.forEach((n) => this.options[e][n] = ze[n]), t != null && (this.scales[t] || (this.scales[t] = rt()), this.scales[t].ambientScale = se, this.scales[t].userScale = se);
       const s = this.seeds[t];
       s ? this.lights[e] = {
         key: { ...s.key },
         fill: { ...s.fill },
         back: { ...s.back }
-      } : this.lights[e] = bt();
+      } : this.lights[e] = xt();
     },
     // Seed per-skin lights from the recipe and warm the per-basePose
     // user-state buckets if absent. The recipe is always rewritten
@@ -414,24 +453,24 @@ const Qe = ({
     // survives subsequent skin swaps within the same basePose.
     // scales[skinId] is per-skin and warmed once per skin.
     seedFromRecipe(e, t) {
-      const s = ((t == null ? void 0 : t.spotIntensity) ?? 1) * Ps, i = (t == null ? void 0 : t.ambientIntensity) ?? 0, r = (t == null ? void 0 : t.envIntensity) ?? 1;
+      const s = ((t == null ? void 0 : t.spotIntensity) ?? 1) * Gs, n = (t == null ? void 0 : t.ambientIntensity) ?? 0, r = (t == null ? void 0 : t.envIntensity) ?? 1;
       this.seeds[e] = {
-        key: ze({ intensity: s }),
-        fill: ze({ intensity: s, shadow: !0 }),
-        back: ze({ intensity: s, shadow: !0 }),
-        ambient: { intensity: i },
+        key: Le({ intensity: s }),
+        fill: Le({ intensity: s, shadow: !0 }),
+        back: Le({ intensity: s, shadow: !0 }),
+        ambient: { intensity: n },
         env: { intensity: r }
-      }, e != null && !this.scales[e] && (this.scales[e] = st());
-      const n = this.bpId;
-      n != null && (this.lights[n] || (this.lights[n] = bt()), this.options[n] || (this.options[n] = tt()));
+      }, e != null && !this.scales[e] && (this.scales[e] = rt());
+      const i = this.bpId;
+      i != null && (this.lights[i] || (this.lights[i] = xt()), this.options[i] || (this.options[i] = nt()));
     },
     ensureSelectedOptions() {
       const e = this.bpId;
-      return e == null ? null : (this.options[e] || (this.options[e] = tt()), this.options[e]);
+      return e == null ? null : (this.options[e] || (this.options[e] = nt()), this.options[e]);
     },
     ensureSelectedScales() {
       const e = this.skinId;
-      return e == null ? null : (this.scales[e] || (this.scales[e] = st()), this.scales[e]);
+      return e == null ? null : (this.scales[e] || (this.scales[e] = rt()), this.scales[e]);
     },
     setControlProperty(e, t) {
       const s = this.ensureSelectedOptions();
@@ -464,63 +503,85 @@ const Qe = ({
         return;
       }
       s.advanced = !1;
-      const i = this.lights[t];
-      if (!i) return;
-      const r = i.key;
-      this.collection.forEach((n) => {
-        n !== "key" && (i[n].color = r.color);
+      const n = this.lights[t];
+      if (!n) return;
+      const r = n.key;
+      this.collection.forEach((i) => {
+        i !== "key" && (n[i].color = r.color);
       });
     },
     setColorHex(e, t) {
-      var n;
+      var i;
       this.initLights();
       const s = this.bpId;
       if (s == null) return;
-      const i = this.lights[s];
-      if (!i) return;
-      const r = Ye(t);
-      if (((n = this.options[s]) == null ? void 0 : n.advanced) === !0) {
-        i[e].color = r;
+      const n = this.lights[s];
+      if (!n) return;
+      const r = et(t);
+      if (((i = this.options[s]) == null ? void 0 : i.advanced) === !0) {
+        n[e].color = r;
         return;
       }
       this.collection.forEach((o) => {
-        i[o].color = r;
+        n[o].color = r;
       });
     },
     setProperty(e, t, s) {
       this.initLights();
-      const i = this.bpId;
-      if (i == null) return;
-      const r = this.lights[i];
+      const n = this.bpId;
+      if (n == null) return;
+      const r = this.lights[n];
       r && (r[e][t] = s);
     },
     setAmbientScale(e) {
       this.initLights();
       const t = this.ensureSelectedScales();
-      t && (t.ambientScale = et(e, Be, yt));
+      t && (t.ambientScale = ot(e, Pe, Et));
     },
     setUserScale(e) {
       this.initLights();
       const t = this.ensureSelectedScales();
-      t && (t.userScale = et(e, Be, St));
+      t && (t.userScale = ot(e, Pe, It));
     },
     initLights() {
       const e = this.bpId, t = this.skinId;
-      t != null && !this.scales[t] && (this.scales[t] = st()), e != null && (this.lights[e] || (this.lights[e] = bt()), this.options[e] || (this.options[e] = tt()));
+      t != null && !this.scales[t] && (this.scales[t] = rt()), e != null && (this.lights[e] || (this.lights[e] = xt()), this.options[e] || (this.options[e] = nt()));
     },
     markFramed() {
       const e = this.bpId;
       e != null && (this.framed[e] = !0);
+    },
+    // Capture the active basePose + skin's tunable lighting state for
+    // the save+freeze flow. Skips `seeds` (per-skin recipe baselines —
+    // rewritten on every GLB load, not user state) and `framed` (a
+    // session flag, not view-state). The three returned slots match
+    // exactly what `restore()` writes back.
+    //
+    //   lights  — per-spot color/visible/shadow for the active basePose
+    //   options — rig position/quaternion/target/radius + toggles
+    //   scales  — ambient/user intensity sliders for the active skin
+    //             only (per "skip per-skin transfer" rule — saves don't
+    //             carry maps across skins).
+    snapshot() {
+      const e = this.bpId, t = this.skinId;
+      if (e == null) return null;
+      const s = this.lights[e] ? JSON.parse(JSON.stringify(this.lights[e])) : null, n = this.options[e] ? JSON.parse(JSON.stringify(this.options[e])) : null, r = t != null && this.scales[t] ? JSON.parse(JSON.stringify(this.scales[t])) : null;
+      return !s && !n && !r ? null : { lights: s, options: n, scales: r };
+    },
+    restore(e) {
+      if (e == null || typeof e != "object") return;
+      const t = this.bpId, s = this.skinId;
+      t != null && (e.lights && (this.lights = { ...this.lights, [t]: JSON.parse(JSON.stringify(e.lights)) }), e.options && (this.options = { ...this.options, [t]: JSON.parse(JSON.stringify(e.options)) }), e.scales && s != null && (this.scales = { ...this.scales, [s]: JSON.parse(JSON.stringify(e.scales)) }), this.framed[t] = !0, this.applyRevision = (this.applyRevision || 0) + 1);
     }
   }
-}), Wt = {
+}), Zt = {
   position: { x: 0, y: 0.39999999999999986, z: 1.5 },
   quaternion: { x: -0.12993279108591813, y: 0, z: 0, w: 0.9915228034698058 },
   target: { x: 0, y: 0, z: 0 },
   radius: 1.5
-}, Rs = {
+}, Os = {
   changed() {
-    return this.exists ? !Ze(this.mergedModel, Wt) : !1;
+    return this.exists ? !Qe(this.mergedModel, Zt) : !1;
   },
   // Has frameToBounds + syncToStore landed on this basePose's
   // bucket? An explicit per-basePose flag, set by markFramed() from
@@ -546,7 +607,7 @@ const Qe = ({
   radius() {
     return this.mergedModel.radius;
   }
-}, Gs = {
+}, Ns = {
   initControls() {
     this.initModel(this.keyId);
   },
@@ -566,36 +627,36 @@ const Qe = ({
   setRadius(e) {
     this.setProperty("radius", e);
   }
-}, ct = Qe({
+}, pt = tt({
   storeId: "3d-controls",
-  defaultValues: Wt,
+  defaultValues: Zt,
   state: { framed: {} },
-  getters: Rs,
-  actions: Gs,
+  getters: Os,
+  actions: Ns,
   keyBy: "basePoseId"
-}), Fs = {
+}), Us = {
   color: 16711422
-}, _s = {
+}, $s = {
   changed() {
     return this.propertyChanged("color");
   },
   colorHex() {
     return ue(this.property("color"));
   }
-}, js = {
+}, qs = {
   init() {
     this.initModel(this.keyId);
   },
   setColorHex(e) {
-    this.setProperty("color", Ye(e));
+    this.setProperty("color", et(e));
   }
-}, ut = Qe({
+}, mt = tt({
   storeId: "3d-scene",
-  defaultValues: Fs,
-  getters: _s,
-  actions: js,
+  defaultValues: Us,
+  getters: $s,
+  actions: qs,
   keyBy: "basePoseId"
-}), Xt = {
+}), Yt = {
   show: !1,
   front: !1,
   back: !1,
@@ -606,9 +667,9 @@ const Qe = ({
   divisions: 6,
   opacity: 0.5,
   size: 2
-}, Us = {
+}, Hs = {
   changed() {
-    return !Ze(this.mergedModel, Xt);
+    return !Qe(this.mergedModel, Yt);
   },
   show() {
     return this.property("show");
@@ -622,17 +683,17 @@ const Qe = ({
   divisions() {
     return this.property("divisions");
   }
-}, Os = {
+}, Js = {
   init() {
     this.initModel(this.keyId);
   }
-}, Ee = Qe({
+}, ke = tt({
   storeId: "3d-grid",
-  defaultValues: Xt,
-  getters: Us,
-  actions: Os,
+  defaultValues: Yt,
+  getters: Hs,
+  actions: Js,
   keyBy: "basePoseId"
-}), $s = [
+}), Ks = [
   "#141111",
   "#3E251E",
   "#633C30",
@@ -673,47 +734,154 @@ const Qe = ({
   "#BDACA8",
   "#DACDC9",
   "#E5E4E3"
-], Ct = "background", wt = "subject", Et = "ground", Zt = {
-  [wt]: 16711422,
-  [Ct]: 16777215,
-  [Et]: 12961221
-}, Ns = {
+], Dt = "background", kt = "subject", Tt = "ground", Qt = {
+  [kt]: 16711422,
+  [Dt]: 16777215,
+  [Tt]: 12961221
+}, Ws = {
   changed() {
-    return this.exists ? !Ze(this.mergedModel, Zt) : !1;
+    return this.exists ? !Qe(this.mergedModel, Qt) : !1;
   },
   subjectHex() {
-    return ue(this.property(wt));
+    return ue(this.property(kt));
   },
   groundHex() {
-    return ue(this.property(Et));
+    return ue(this.property(Tt));
   },
   backgroundHex() {
-    return ue(this.property(Ct));
+    return ue(this.property(Dt));
   },
   getHexColor() {
     return (e) => ue(this.property(e, "#F0F0F0"));
   }
-}, Hs = {
+}, Xs = {
   setHexColor(e, t) {
-    this.setProperty(e, Ye(t));
+    this.setProperty(e, et(t));
   },
   setSubjectHex(e) {
-    this.setHexColor(wt, e);
+    this.setHexColor(kt, e);
   },
   setGroundHex(e) {
-    this.setHexColor(Et, e);
+    this.setHexColor(Tt, e);
   },
   setBackgroundHex(e) {
-    this.setHexColor(Ct, e);
+    this.setHexColor(Dt, e);
   }
-}, It = Qe({
+}, Mt = tt({
   storeId: "3d-colors",
-  defaultValues: Zt,
-  state: { palette: $s },
-  getters: Ns,
-  actions: Hs,
+  defaultValues: Qt,
+  state: { palette: Ks },
+  getters: Ws,
+  actions: Xs,
   keyBy: "basePoseId"
-}), A = Xe("3d", {
+});
+let ee = null, Ge = null;
+const Re = () => {
+  const e = M(), { aspect: t, width: s, height: n } = N(e), r = (c = { x: 0, y: 0.8, z: 1.5 }) => (console.debug("useCamera init"), ee ? (console.debug("view camera already inited"), ee) : (ee = new I.PerspectiveCamera(75, t.value, 0.1, 100), e.loaded.camera = !0, ee)), i = () => {
+    if (ee)
+      return ee;
+  };
+  return Ge = j(
+    () => t.value,
+    (c) => {
+      if (!ee) {
+        r();
+        return;
+      }
+      ee.aspect = c, ee.updateProjectionMatrix();
+    }
+  ), {
+    init: r,
+    getCamera: i,
+    dispose: () => {
+      Ge == null || Ge(), Ge = null, ee = null;
+    }
+  };
+};
+let W = null, be = null, ye = null, je = null;
+const Ie = () => {
+  const e = mt(), t = M(), { colorHex: s } = N(e), n = () => (console.debug("useScene init"), W ? (console.debug("scene already inited"), W) : (W = new I.Scene(), i(s.value), t.loaded.scene = !0, W)), r = () => {
+    if (W)
+      return W;
+  }, i = (a) => {
+    if (!W) throw new Error("Scene has not been initialized");
+    W.background = new I.Color(a);
+  }, o = (a) => {
+    if (!W) throw new Error("Scene has not been initialized");
+    if (!a) throw new Error("Renderer required to build environment");
+    be || (ye = new I.PMREMGenerator(a), ye.compileEquirectangularShader(), be = ye.fromScene(new Is(), 0.04).texture, W.environment = be);
+  };
+  return je = j(
+    () => s.value,
+    (a) => i(a)
+  ), {
+    init: n,
+    get: r,
+    dispose: () => {
+      t.loaded.scene = !1, je == null || je(), je = null, W && (W.traverse((a) => {
+        var u, p;
+        a.isMesh && ((u = a.geometry) == null || u.dispose(), Array.isArray(a.material) ? a.material.forEach((P) => P == null ? void 0 : P.dispose()) : (p = a.material) == null || p.dispose());
+      }), W.clear(), W = null, be == null || be.dispose(), ye == null || ye.dispose(), be = null, ye = null);
+    },
+    setBackgroundColor: i,
+    setEnvironment: o
+  };
+};
+let L = null, Oe = null, Ne = null;
+const Xe = () => {
+  const e = M(), { get: t } = Ie(), { getCamera: s } = Re(), { width: n, height: r, subjectLoaded: i } = N(e);
+  function o(w) {
+    return console.debug("useRenderer init"), L ? (console.debug("renderer already inited"), L) : (L = new I.WebGLRenderer({ antialias: !0, alpha: !0, preserveDrawingBuffer: !0 }), L.setSize(n.value, r.value), L.toneMapping = I.ACESFilmicToneMapping, L.toneMappingExposure = 0.8, L.shadowMap.enabled = !0, L.shadowMap.type = I.PCFSoftShadowMap, L.outputColorSpace = I.SRGBColorSpace, w && w.appendChild(L.domElement), e.loaded.renderer = !0, L);
+  }
+  const c = () => {
+    if (!L) throw new Error("Renderer has not been initialized");
+    return L;
+  }, a = (w) => {
+    L && (L.toneMappingExposure = w);
+  }, u = () => {
+    const w = t(), m = s();
+    !w || !m || L.render(w, m);
+  };
+  async function p({ size: w = 1024, format: m = "jpeg", quality: g = 0.85 } = {}) {
+    if (!L) throw new Error("Renderer has not been initialized");
+    const y = t(), x = s();
+    if (!y || !x) throw new Error("Scene or camera not ready");
+    const v = L.getSize(new I.Vector2()), k = L.getPixelRatio(), R = x.aspect;
+    try {
+      L.setPixelRatio(1), L.setSize(w, w, !1), x.aspect = 1, x.updateProjectionMatrix(), L.render(y, x);
+      const F = m === "png" ? "image/png" : "image/jpeg";
+      return await new Promise(($, K) => {
+        L.domElement.toBlob(
+          (b) => b ? $(b) : K(new Error("toBlob returned null")),
+          F,
+          m === "jpeg" ? g : void 0
+        );
+      });
+    } finally {
+      L.setPixelRatio(k), L.setSize(v.x, v.y, !1), x.aspect = R, x.updateProjectionMatrix(), L.render(y, x);
+    }
+  }
+  Oe = j(
+    () => [n.value, r.value],
+    ([w, m]) => {
+      !w || !m || !L || L.setSize(w, m);
+    }
+  ), Ne = j(
+    () => i.value,
+    () => u()
+  );
+  function P() {
+    console.debug("renderer disposed"), e.loaded.renderer = !1, Oe == null || Oe(), Ne == null || Ne(), Oe = null, Ne = null, L && (L.domElement.parentElement && L.domElement.parentElement.removeChild(L.domElement), L.dispose(), L = null);
+  }
+  return {
+    init: o,
+    get: c,
+    dispose: P,
+    render: u,
+    setExposure: a,
+    captureSnapshot: p
+  };
+}, M = Ye("3d", {
   state: () => ({
     // models: {},
     selected: null,
@@ -745,11 +913,16 @@ const Qe = ({
   }),
   getters: {
     active(e) {
-      var t, s;
-      return ((s = (t = this.models) == null ? void 0 : t[e.selected]) == null ? void 0 : s.active) || ye;
+      var s, n;
+      const t = Ct.is.mobile ? lt : xe;
+      return ((n = (s = this.models) == null ? void 0 : s[e.selected]) == null ? void 0 : n.active) || t;
     },
     aspect(e) {
       return e.height > 0 ? e.width / e.height : 0;
+    },
+    isFrozen(e) {
+      var t;
+      return ((t = this.appFreezeStore) == null ? void 0 : t.isFrozen(e.basePoseId)) || !1;
     }
   },
   actions: {
@@ -761,6 +934,13 @@ const Qe = ({
       var t;
       return ((t = this.appPaywallStore) == null ? void 0 : t.block(e)) || !0;
     },
+    pokeFreeze() {
+      var e;
+      (e = this.appFreezeStore) == null || e.poke(this.basePoseId);
+    },
+    captureSnapshot(e) {
+      return Xe().captureSnapshot(e);
+    },
     isExpanded(e = []) {
       return e = Array.isArray(e) ? e : [e], e.includes(this.active);
     },
@@ -774,116 +954,93 @@ const Qe = ({
       });
     },
     setFromResponse(e) {
-      var u, p, D;
-      const t = It(), s = ct(), i = Ee(), r = Ve(), n = fe(), o = ut(), a = me().setSubjectsFromResponse(e);
+      var u, p, P;
+      const t = Mt(), s = pt(), n = ke(), r = Fe(), i = he(), o = mt(), a = fe().setSubjectsFromResponse(e);
       if (this.setUuid = ((u = e == null ? void 0 : e.result) == null ? void 0 : u.setUuid) ?? null, this.basePoseId = ((p = e == null ? void 0 : e.result) == null ? void 0 : p.basePoseId) ?? null, a == null) {
         this.selected = null;
         return;
       }
-      this.selected = a, t.initModel(this.basePoseId), n.initLights(), r.init(), s.initControls(), i.init(), o.init(), this.models[a] || (this.models[a] = {}), (D = this.models[a]) != null && D.active || (this.models[a].active = ye);
+      this.selected = a, t.initModel(this.basePoseId), i.initLights(), r.init(), s.initControls(), n.init(), o.init(), this.models[a] || (this.models[a] = {}), (P = this.models[a]) != null && P.active || (this.models[a].active = Ct.is.mobile ? lt : xe);
     }
   }
 });
-let J = null, Ge = null;
-const Le = () => {
-  const e = A(), { aspect: t, width: s, height: i } = $(e), r = (l = { x: 0, y: 0.8, z: 1.5 }) => (console.debug("useCamera init"), J ? (console.debug("view camera already inited"), J) : (J = new I.PerspectiveCamera(75, t.value, 0.1, 100), e.loaded.camera = !0, J)), n = () => {
-    if (J)
-      return J;
-  };
-  return Ge = O(
-    () => t.value,
-    (l) => {
-      if (!J) {
-        r();
-        return;
-      }
-      J.aspect = l, J.updateProjectionMatrix();
-    }
-  ), {
-    init: r,
-    getCamera: n,
-    dispose: () => {
-      Ge == null || Ge(), Ge = null, J = null;
-    }
-  };
-};
 let Q = null;
-const rt = () => {
+const ct = () => {
   const e = pe(!1), t = pe({
     mode: null,
     camera: null,
     // camera (or your lights-camera)
     store: null
     // pinia store with position/quaternion/target
-  }), s = (h, f = {}) => {
+  }), s = (m, g = {}) => {
     if (console.debug("useOrbitControlsBase init"), Q)
       return console.debug("controls already inited"), Q;
-    const S = new I.Object3D();
-    return Q = new Ss(S, h.domElement), r(f), Q;
-  }, i = () => {
+    const y = new I.Object3D();
+    return Q = new Ds(y, m.domElement), r(g), Q;
+  }, n = () => {
     if (!Q) throw new Error("OrbitControls not initialized");
     return Q;
-  }, r = (h = {}) => {
-    const f = i();
-    f.enableDamping = h.enableDamping ?? !0, f.dampingFactor = h.dampingFactor ?? 0.5, f.rotateSpeed = h.rotateSpeed ?? 0.2, f.enableZoom = h.enableZoom ?? !0, f.minDistance = h.minDistance ?? 0.5, f.maxDistance = h.maxDistance ?? 6, f.panSpeed = h.panSpeed ?? 1;
-  }, n = ({ mode: h, camera: f, store: S, options: E }) => {
-    const y = i();
-    if (!f) throw new Error(`setMode(${h}): camera is required`);
-    if (!S) throw new Error(`setMode(${h}): store is required`);
-    y.object = f, r(E), t.value = { mode: h, camera: f, store: S }, a(), y.update();
+  }, r = (m = {}) => {
+    const g = n();
+    g.enableDamping = m.enableDamping ?? !0, g.dampingFactor = m.dampingFactor ?? 0.5, g.rotateSpeed = m.rotateSpeed ?? 0.2, g.enableZoom = m.enableZoom ?? !0, g.minDistance = m.minDistance ?? 0.5, g.maxDistance = m.maxDistance ?? 6, g.panSpeed = m.panSpeed ?? 1;
+  }, i = ({ mode: m, camera: g, store: y, options: x }) => {
+    const v = n();
+    if (!g) throw new Error(`setMode(${m}): camera is required`);
+    if (!y) throw new Error(`setMode(${m}): store is required`);
+    v.object = g, r(x), t.value = { mode: m, camera: g, store: y }, a(), v.update();
   }, o = () => {
     Q && Q.update();
-  }, l = () => {
-    const h = i(), { camera: f, store: S } = t.value;
-    !f || !S || e.value || (S.setPosition({ ...f.position }), S.setQuaternion({ ...f.quaternion }), S.setTarget({ ...h.target }), S.setRadius(f.position.distanceTo(h.target)));
+  }, c = () => {
+    const m = n(), { camera: g, store: y } = t.value;
+    !g || !y || e.value || (y.setPosition({ ...g.position }), y.setQuaternion({ ...g.quaternion }), y.setTarget({ ...m.target }), y.setRadius(g.position.distanceTo(m.target)));
   }, a = () => {
-    const h = i(), { camera: f, store: S } = t.value;
-    if (!f || !S) return;
+    const m = n(), { camera: g, store: y } = t.value;
+    if (!g || !y) return;
     e.value = !0;
-    const { position: E, quaternion: y, target: T, radius: P } = S;
-    h.target.set(T.x, T.y, T.z);
-    const G = new I.Vector3(
-      E.x - T.x,
-      E.y - T.y,
-      E.z - T.z
+    const { position: x, quaternion: v, target: k, radius: R } = y;
+    m.target.set(k.x, k.y, k.z);
+    const F = new I.Vector3(
+      x.x - k.x,
+      x.y - k.y,
+      x.z - k.z
     ).normalize();
-    f.position.copy(h.target).add(G.multiplyScalar(P)), f.quaternion.set(
-      y.x,
-      y.y,
-      y.z,
-      y.w
-    ), h.update(), e.value = !1;
+    g.position.copy(m.target).add(F.multiplyScalar(R)), g.quaternion.set(
+      v.x,
+      v.y,
+      v.z,
+      v.w
+    ), m.update(), e.value = !1;
   }, u = 0, p = 0.1;
   return {
     init: s,
-    get: i,
-    setMode: n,
+    get: n,
+    setMode: i,
     update: o,
-    syncToStore: l,
+    syncToStore: c,
     applyFromStore: a,
-    frameToBounds: (h, f = 1.75) => {
-      const S = i(), { camera: E } = t.value;
-      if (!E || !h) return;
-      const y = new I.Vector3(
-        h.center.x,
-        h.center.y + h.size.y * u,
-        h.center.z
+    frameToBounds: (m, g = 1.75) => {
+      const y = n(), { camera: x } = t.value;
+      if (!x || !m) return;
+      const v = new I.Vector3(
+        m.center.x,
+        m.center.y + m.size.y * u,
+        m.center.z
       );
-      console.log("bounds", h);
-      const T = Math.max(h.size.x, h.size.y, h.size.z), P = I.MathUtils.degToRad(E.fov);
-      let G = T / 2 / Math.tan(P / 2) * f;
-      S.target.copy(y), E.position.set(
-        y.x,
-        y.y + h.size.y * p,
-        y.z + G
-      ), E.near = G / 100, E.far = G * 100, E.updateProjectionMatrix(), S.update();
+      console.log("bounds", m);
+      const k = Math.max(m.size.x, m.size.y, m.size.z), R = I.MathUtils.degToRad(x.fov);
+      let F = k / 2 / Math.tan(R / 2) * g;
+      y.target.copy(v), x.position.set(
+        v.x,
+        v.y + m.size.y * p,
+        v.z + F
+      ), x.near = F / 100, x.far = F * 100, x.updateProjectionMatrix(), y.update();
     },
     dispose: () => {
       console.debug("controls disposed"), Q && (Q.dispose(), Q = null, t.value = { mode: null, camera: null, store: null });
     }
   };
-}, Mt = () => {
-  const { getCamera: e } = Le(), t = ct(), s = rt();
+}, At = () => {
+  const { getCamera: e } = Re(), t = pt(), s = ct();
   return {
     activate: () => {
       s.setMode({
@@ -901,36 +1058,7 @@ const rt = () => {
     syncToStore: s.syncToStore,
     applyFromStore: s.applyFromStore
   };
-};
-let X = null, ge = null, be = null, Fe = null;
-const we = () => {
-  const e = ut(), t = A(), { colorHex: s } = $(e), i = () => (console.debug("useScene init"), X ? (console.debug("scene already inited"), X) : (X = new I.Scene(), n(s.value), t.loaded.scene = !0, X)), r = () => {
-    if (X)
-      return X;
-  }, n = (a) => {
-    if (!X) throw new Error("Scene has not been initialized");
-    X.background = new I.Color(a);
-  }, o = (a) => {
-    if (!X) throw new Error("Scene has not been initialized");
-    if (!a) throw new Error("Renderer required to build environment");
-    ge || (be = new I.PMREMGenerator(a), be.compileEquirectangularShader(), ge = be.fromScene(new xs(), 0.04).texture, X.environment = ge);
-  };
-  return Fe = O(
-    () => s.value,
-    (a) => n(a)
-  ), {
-    init: i,
-    get: r,
-    dispose: () => {
-      t.loaded.scene = !1, Fe == null || Fe(), Fe = null, X && (X.traverse((a) => {
-        var u, p;
-        a.isMesh && ((u = a.geometry) == null || u.dispose(), Array.isArray(a.material) ? a.material.forEach((D) => D == null ? void 0 : D.dispose()) : (p = a.material) == null || p.dispose());
-      }), X.clear(), X = null, ge == null || ge.dispose(), be == null || be.dispose(), ge = null, be = null);
-    },
-    setBackgroundColor: n,
-    setEnvironment: o
-  };
-}, qs = {
+}, Zs = {
   asphalt: {
     ao: "ao.jpg",
     color: "color.jpg",
@@ -966,280 +1094,280 @@ const we = () => {
     repeat: 100
   }
 };
-let k = null, _e = null, je = null, Ue = null;
-const Pt = () => {
-  const e = Ve(), { get: t } = we(), { getCamera: s } = Le(), {
-    visible: i,
+let A = null, Ue = null, $e = null, qe = null;
+const _t = () => {
+  const e = Fe(), { get: t } = Ie(), { getCamera: s } = Re(), {
+    visible: n,
     color: r,
-    texture: n,
+    texture: i,
     offset: o
-  } = $(e), l = () => {
-    if (console.debug("useGround init"), k)
-      return console.debug("ground already inited"), k;
-    const f = t(), S = new I.PlaneGeometry(100, 100), E = new I.Color(r.value || 16777215), y = new I.MeshStandardMaterial({
-      color: E,
+  } = N(e), c = () => {
+    if (console.debug("useGround init"), A)
+      return console.debug("ground already inited"), A;
+    const g = t(), y = new I.PlaneGeometry(100, 100), x = new I.Color(r.value || 16777215), v = new I.MeshStandardMaterial({
+      color: x,
       // Default to white
       side: I.DoubleSide,
       roughness: 0.4,
       metalness: 0.3,
-      emissive: E,
+      emissive: x,
       emissiveIntensity: 0.05
       // tweak 0.1–0.6
     });
-    return k = new I.Mesh(S, y), k.rotation.x = -Math.PI / 2, k.receiveShadow = !0, k.visible = i.value, f.add(k), _e = O(
-      () => i.value,
+    return A = new I.Mesh(y, v), A.rotation.x = -Math.PI / 2, A.receiveShadow = !0, A.visible = n.value, g.add(A), Ue = j(
+      () => n.value,
       () => a()
-    ), je = O(
+    ), $e = j(
       () => r.value,
-      (T) => w(T)
-    ), Ue = O(
-      () => n.value,
-      (T) => p(T)
-    ), k;
+      (k) => w(k)
+    ), qe = j(
+      () => i.value,
+      (k) => p(k)
+    ), A;
   };
   function a() {
-    if (s().position.y < k.position.y) {
-      k.visible = !1;
+    if (s().position.y < A.position.y) {
+      A.visible = !1;
       return;
     }
-    k.visible = i.value;
+    A.visible = n.value;
   }
-  function u(f, S = 1, E = 1) {
-    return new I.TextureLoader().load(f, (P) => {
-      P.wrapS = I.RepeatWrapping, P.wrapT = I.RepeatWrapping, P.repeat.set(S, E), P.needsUpdate = !0;
+  function u(g, y = 1, x = 1) {
+    return new I.TextureLoader().load(g, (R) => {
+      R.wrapS = I.RepeatWrapping, R.wrapT = I.RepeatWrapping, R.repeat.set(y, x), R.needsUpdate = !0;
     });
   }
-  const p = (f) => {
-    if (!k) throw new Error("Ground has not been initialized");
-    const S = qs[f];
-    if (!S)
-      k.material.map = null, k.material.normalMap = null, k.material.displacementMap = null, k.material.roughnessMap = null, k.material.aoMap = null, k.material.metalnessMap = null, k.material.needsUpdate = !0;
+  const p = (g) => {
+    if (!A) throw new Error("Ground has not been initialized");
+    const y = Zs[g];
+    if (!y)
+      A.material.map = null, A.material.normalMap = null, A.material.displacementMap = null, A.material.roughnessMap = null, A.material.aoMap = null, A.material.metalnessMap = null, A.material.needsUpdate = !0;
     else {
-      const E = `https://static.figurosity.com/3d/textures/${f}/`, y = S.repeat;
-      k.material.map = u(
-        `${E}${S.color}`,
-        y,
-        y
-      ), k.material.normalMap = u(
-        `${E}${S.normal}`,
-        y,
-        y
-      ), k.material.displacementMap = u(
-        `${E}${S.displacement}`,
-        y,
-        y
-      ), k.material.roughnessMap = u(
-        `${E}${S.roughness}`,
-        y,
-        y
-      ), k.material.aoMap = u(
-        `${E}${S.ao}`,
-        y,
-        y
-      ), S.metalness && (k.material.metalnessMap = u(
-        `${E}${S.metalness}`,
-        y,
-        y
-      )), k.material.displacementScale = 0.1, k.material.displacementBias = -0.05, k.material.needsUpdate = !0;
+      const x = `https://static.figurosity.com/3d/textures/${g}/`, v = y.repeat;
+      A.material.map = u(
+        `${x}${y.color}`,
+        v,
+        v
+      ), A.material.normalMap = u(
+        `${x}${y.normal}`,
+        v,
+        v
+      ), A.material.displacementMap = u(
+        `${x}${y.displacement}`,
+        v,
+        v
+      ), A.material.roughnessMap = u(
+        `${x}${y.roughness}`,
+        v,
+        v
+      ), A.material.aoMap = u(
+        `${x}${y.ao}`,
+        v,
+        v
+      ), y.metalness && (A.material.metalnessMap = u(
+        `${x}${y.metalness}`,
+        v,
+        v
+      )), A.material.displacementScale = 0.1, A.material.displacementBias = -0.05, A.material.needsUpdate = !0;
     }
-    k.position.y = o.value, k.geometry.computeBoundingBox(), k.geometry.computeVertexNormals();
-  }, D = () => {
-    if (!k) throw new Error("Ground has not been initialized");
-    return k;
-  }, w = (f) => {
-    if (!k) throw new Error("Ground has not been initialized");
-    k.material.color.set(f);
+    A.position.y = o.value, A.geometry.computeBoundingBox(), A.geometry.computeVertexNormals();
+  }, P = () => {
+    if (!A) throw new Error("Ground has not been initialized");
+    return A;
+  }, w = (g) => {
+    if (!A) throw new Error("Ground has not been initialized");
+    A.material.color.set(g);
   };
-  return { init: l, get: D, setColor: w, updateVisibility: a, dispose: () => {
-    var S, E;
-    if (_e == null || _e(), je == null || je(), Ue == null || Ue(), _e = null, je = null, Ue = null, !k) return;
-    const f = t();
-    f == null || f.remove(k), (S = k.geometry) == null || S.dispose(), Array.isArray(k.material) ? k.material.forEach((y) => y == null ? void 0 : y.dispose()) : (E = k.material) == null || E.dispose(), k = null;
+  return { init: c, get: P, setColor: w, updateVisibility: a, dispose: () => {
+    var y, x;
+    if (Ue == null || Ue(), $e == null || $e(), qe == null || qe(), Ue = null, $e = null, qe = null, !A) return;
+    const g = t();
+    g == null || g.remove(A), (y = A.geometry) == null || y.dispose(), Array.isArray(A.material) ? A.material.forEach((v) => v == null ? void 0 : v.dispose()) : (x = A.material) == null || x.dispose(), A = null;
   } };
-}, Ks = (e, t = 16711422) => {
-  const s = new ws(0.1, 0.1, 0.1, 6, 0.01), i = 0.1, r = 0.05, n = new I.ConeGeometry(r, i, 32);
+}, Ys = (e, t = 16711422) => {
+  const s = new Ts(0.1, 0.1, 0.1, 6, 0.01), n = 0.1, r = 0.05, i = new I.ConeGeometry(r, n, 32);
   s.index || s.setIndex(
     Array.from(
       { length: s.attributes.position.count },
       (u, p) => p
     )
-  ), n.index || n.setIndex(
+  ), i.index || i.setIndex(
     Array.from(
-      { length: n.attributes.position.count },
+      { length: i.attributes.position.count },
       (u, p) => p
     )
-  ), n.rotateX(-Math.PI / 2), n.translate(0, 0, i / 2), Bt(s), Bt(n);
-  const o = Cs([s, n]), l = new I.MeshBasicMaterial({
+  ), i.rotateX(-Math.PI / 2), i.translate(0, 0, n / 2), Rt(s), Rt(i);
+  const o = ks([s, i]), c = new I.MeshBasicMaterial({
     color: t,
     transparent: !0,
     opacity: 0.8
-  }), a = new I.Mesh(o, l);
+  }), a = new I.Mesh(o, c);
   if (a.position.set(0, 0, 0), a.rotateX(Math.PI), e && e.target) {
     const u = new I.Vector3();
     e.target.getWorldPosition(u), a.lookAt(u);
   }
   return a.position.copy(e.position), a;
 };
-let ot = {}, ne = {}, N = {}, ie = {}, Me = null, ae = null, De = [], Te = /* @__PURE__ */ new Map();
-const it = () => {
-  const e = A(), t = fe(), s = me();
+let it = {}, ne = {}, q = {}, ie = {}, Te = null, ae = null, Me = [], Ae = /* @__PURE__ */ new Map();
+const ut = () => {
+  const e = M(), t = he(), s = fe();
   pe(!1);
-  const { subjectLoaded: i, width: r, height: n, selected: o, basePoseId: l } = $(e), { debug: a, collection: u, advancedMode: p, move: D } = $(t), { get: w } = we(), h = t.property, f = () => {
+  const { subjectLoaded: n, width: r, height: i, selected: o, basePoseId: c } = N(e), { debug: a, collection: u, advancedMode: p, move: P } = N(t), { get: w } = Ie(), m = t.property, g = () => {
     if (ae)
       return console.warn("lights camera already inited"), ae;
-    const g = w();
-    return Me = y(), ae = T(), u.value.forEach((c) => {
-      const v = c === "key" ? ae : g, { group: L, light: M, visualization: x } = P(c, v);
-      N[c] = M, ot[c] = L, ie[c] = x, N[c].castShadow = !0, N[c].angle = Math.PI / 4, N[c].penumbra = 0.5, N[c].shadow.camera.near = 0.5, N[c].shadow.camera.far = 12, N[c].shadow.focus = 0.9, N[c].shadow.mapSize.set(4096, 4096), N[c].shadow.bias = -2e-4, N[c].shadow.normalBias = 0.02, N[c].shadow.radius = 2, N[c].shadow.camera.updateProjectionMatrix();
-    }), F(), Y(), ae;
-  }, S = () => {
+    const S = w();
+    return Te = v(), ae = k(), u.value.forEach((l) => {
+      const f = l === "key" ? ae : S, { group: T, light: D, visualization: E } = R(l, f);
+      q[l] = D, it[l] = T, ie[l] = E, q[l].castShadow = !0, q[l].angle = Math.PI / 4, q[l].penumbra = 0.5, q[l].shadow.camera.near = 0.5, q[l].shadow.camera.far = 12, q[l].shadow.focus = 0.9, q[l].shadow.mapSize.set(4096, 4096), q[l].shadow.bias = -2e-4, q[l].shadow.normalBias = 0.02, q[l].shadow.radius = 2, q[l].shadow.camera.updateProjectionMatrix();
+    }), G(), Y(), ae;
+  }, y = () => {
     if (!ae)
       throw new Error("Light camera not initialized.");
     return ae;
-  }, E = (g) => {
-    g && (Object.values(N).forEach((c) => c == null ? void 0 : c.color.set(g)), Object.values(ie).forEach((c) => {
-      var v;
-      return (v = c == null ? void 0 : c.material) == null ? void 0 : v.color.set(g);
+  }, x = (S) => {
+    S && (Object.values(q).forEach((l) => l == null ? void 0 : l.color.set(S)), Object.values(ie).forEach((l) => {
+      var f;
+      return (f = l == null ? void 0 : l.material) == null ? void 0 : f.color.set(S);
     }));
-  }, y = () => {
-    const g = w(), c = new I.AmbientLight(16777215, 0.2);
-    return g.add(c), c;
-  }, T = () => {
-    const g = w(), c = new I.PerspectiveCamera(
+  }, v = () => {
+    const S = w(), l = new I.AmbientLight(16777215, 0.2);
+    return S.add(l), l;
+  }, k = () => {
+    const S = w(), l = new I.PerspectiveCamera(
       75,
-      r.value / n.value,
+      r.value / i.value,
       0.1,
       100
     );
-    return c.position.set(0, 0, 1.5), g.add(c), c;
+    return l.position.set(0, 0, 1.5), S.add(l), l;
   };
-  function P(g, c = null) {
-    const v = w(), L = new I.Group(), M = new I.SpotLight(
-      h(g, "color"),
-      h(g, "intensity")
+  function R(S, l = null) {
+    const f = w(), T = new I.Group(), D = new I.SpotLight(
+      m(S, "color"),
+      m(S, "intensity")
     );
-    M.position.set(0, 0, 0), H(), M.target.position.set(0, 1, 0), M.target.updateMatrixWorld(), v.add(M.target), L.add(M);
-    const x = Ks(
-      M,
-      h(g, "visualizationColor")
-    ), U = t.isVisible(g);
-    return x.visible = U, L.add(x), c.add(L), { group: L, light: M, visualization: x };
+    D.position.set(0, 0, 0), $(), D.target.position.set(0, 1, 0), D.target.updateMatrixWorld(), f.add(D.target), T.add(D);
+    const E = Ys(
+      D,
+      m(S, "visualizationColor")
+    ), O = t.isVisible(S);
+    return E.visible = O, T.add(E), l.add(T), { group: T, light: D, visualization: E };
   }
-  const G = () => {
-    H(), Z(), b();
-  }, H = () => {
-    if (!t.lights[l.value]) return;
-    const c = t.seeds[o.value], v = t.ambientScale, L = t.userScale;
-    if (Me && (c != null && c.ambient) && (Me.intensity = c.ambient.intensity * v), c != null && c.env) {
-      const M = w();
-      M && (M.environmentIntensity = c.env.intensity * v);
+  const F = () => {
+    $(), K(), b();
+  }, $ = () => {
+    if (!t.lights[c.value]) return;
+    const l = t.seeds[o.value], f = t.ambientScale, T = t.userScale;
+    if (Te && (l != null && l.ambient) && (Te.intensity = l.ambient.intensity * f), l != null && l.env) {
+      const D = w();
+      D && (D.environmentIntensity = l.env.intensity * f);
     }
-    u.value.forEach((M) => {
-      const x = N[M];
-      if (!x) return;
-      const U = h(M, "color"), he = h(M, "visible"), K = h(M, "shadow") || !1;
-      if (U && x.color.set(U), x.visible = he, c != null && c[M] && (x.intensity = c[M].intensity * L), x.castShadow = K, K) {
-        const re = h(M, "shadowSettings", {});
-        x.shadow.mapSize.set(
+    u.value.forEach((D) => {
+      const E = q[D];
+      if (!E) return;
+      const O = m(D, "color"), ge = m(D, "visible"), J = m(D, "shadow") || !1;
+      if (O && E.color.set(O), E.visible = ge, l != null && l[D] && (E.intensity = l[D].intensity * T), E.castShadow = J, J) {
+        const re = m(D, "shadowSettings", {});
+        E.shadow.mapSize.set(
           re.width || 1024,
           re.height || 1024
-        ), x.shadow.camera.near = re.near || 0.5, x.shadow.camera.far = re.far || 50, x.shadow.needsUpdate = !0;
+        ), E.shadow.camera.near = re.near || 0.5, E.shadow.camera.far = re.far || 50, E.shadow.needsUpdate = !0;
       }
     });
-  }, Z = () => {
-    t.lights[l.value] && u.value.forEach((c) => {
-      if (!ie[c]) return console.warn(`${c} does not exist`);
-      const v = t.isVisible(c);
-      ie[c].visible = v, ie[c].material.color.set(h(c, "color"));
+  }, K = () => {
+    t.lights[c.value] && u.value.forEach((l) => {
+      if (!ie[l]) return console.warn(`${l} does not exist`);
+      const f = t.isVisible(l);
+      ie[l].visible = f, ie[l].material.color.set(m(l, "color"));
     });
   }, b = () => {
-    t.lights[l.value] && u.value.forEach((c) => {
-      const v = h(c, "debug") || a.value;
-      !ne[c] && v && (ne[c] = m(c, N[c]), N[c].add(ne[c])), ne[c] && !v && (ne[c] = B(ne[c]));
+    t.lights[c.value] && u.value.forEach((l) => {
+      const f = m(l, "debug") || a.value;
+      !ne[l] && f && (ne[l] = h(l, q[l]), q[l].add(ne[l])), ne[l] && !f && (ne[l] = B(ne[l]));
     });
-  }, m = (g, c) => {
-    const v = w(), L = new I.SpotLightHelper(
-      c,
-      h(g, "visualizationColor")
+  }, h = (S, l) => {
+    const f = w(), T = new I.SpotLightHelper(
+      l,
+      m(S, "visualizationColor")
     );
-    return v.add(L), L;
-  }, B = (g) => {
-    const c = w();
-    if (!(!c || !g))
-      return c.remove(g), g.dispose(), g = null, g;
-  }, F = () => {
-    const g = S();
+    return f.add(T), T;
+  }, B = (S) => {
+    const l = w();
+    if (!(!l || !S))
+      return l.remove(S), S.dispose(), S = null, S;
+  }, G = () => {
+    const S = y();
     if (!s.bounds) return;
-    const v = t.target, L = new I.Vector3(v.x, v.y, v.z), M = new I.Vector3().subVectors(L, g.position).normalize(), x = new I.Vector3(
-      M.x,
+    const f = t.target, T = new I.Vector3(f.x, f.y, f.z), D = new I.Vector3().subVectors(T, S.position).normalize(), E = new I.Vector3(
+      D.x,
       0,
-      M.z
-    ).normalize(), U = new I.Vector3(
-      -x.z,
+      D.z
+    ).normalize(), O = new I.Vector3(
+      -E.z,
       0,
-      x.x
-    ), K = 2 * g.position.distanceTo(L) / Math.sqrt(3), re = 1, Re = L.clone().add(U.clone().multiplyScalar(-K / re)).add(M.clone().multiplyScalar(Math.sqrt(3) * K / 2)), os = L.clone().add(U.clone().multiplyScalar(K / re)).add(M.clone().multiplyScalar(Math.sqrt(3) * K / 2));
-    ot.fill.position.copy(Re), ot.back.position.copy(os), u.value.forEach((dt) => {
-      var kt, Je, At;
-      const pt = N[dt];
-      pt.shadow.needsUpdate = !0, pt.target.position.copy(L), pt.target.updateMatrixWorld(), (kt = ie[dt]) == null || kt.lookAt(L), (At = (Je = ne[dt]) == null ? void 0 : Je.update) == null || At.call(Je);
+      E.x
+    ), J = 2 * S.position.distanceTo(T) / Math.sqrt(3), re = 1, _e = T.clone().add(O.clone().multiplyScalar(-J / re)).add(D.clone().multiplyScalar(Math.sqrt(3) * J / 2)), as = T.clone().add(O.clone().multiplyScalar(J / re)).add(D.clone().multiplyScalar(Math.sqrt(3) * J / 2));
+    it.fill.position.copy(_e), it.back.position.copy(as), u.value.forEach((ht) => {
+      var Pt, st, Lt;
+      const gt = q[ht];
+      gt.shadow.needsUpdate = !0, gt.target.position.copy(T), gt.target.updateMatrixWorld(), (Pt = ie[ht]) == null || Pt.lookAt(T), (Lt = (st = ne[ht]) == null ? void 0 : st.update) == null || Lt.call(st);
     });
-  }, z = (g) => {
-    const c = `watcher-${g}`;
-    if (Te.has(c)) return;
-    const v = O(
-      () => [t.lights[g], t.options[g]],
-      G,
+  }, z = (S) => {
+    const l = `watcher-${S}`;
+    if (Ae.has(l)) return;
+    const f = j(
+      () => [t.lights[S], t.options[S]],
+      F,
       { deep: !0 }
     );
-    Te.set(c, v);
-  }, j = (g) => {
-    const c = `watcher-${g}`, v = Te.get(c);
-    v && (v(), Te.delete(c));
+    Ae.set(l, f);
+  }, U = (S) => {
+    const l = `watcher-${S}`, f = Ae.get(l);
+    f && (f(), Ae.delete(l));
   }, Y = () => {
-    De.push(
-      O(
-        () => [p.value, o.value, D.value],
-        () => G()
+    Me.push(
+      j(
+        () => [p.value, o.value, P.value],
+        () => F()
       )
-    ), De.push(
-      O(
+    ), Me.push(
+      j(
         () => [t.ambientScale, t.userScale],
-        () => G()
+        () => F()
       )
-    ), De.push(
-      O(
-        () => i.value,
-        (g) => {
-          g === !0 && F();
+    ), Me.push(
+      j(
+        () => n.value,
+        (S) => {
+          S === !0 && G();
         }
       )
-    ), De.push(
-      O(
-        () => l.value,
-        (g, c) => {
-          c && j(c), g != null && (z(g), ns(G));
+    ), Me.push(
+      j(
+        () => c.value,
+        (S, l) => {
+          l && U(l), S != null && (z(S), ls(F));
         },
         { immediate: !0 }
       )
     );
   };
   return {
-    init: f,
-    updatePosition: F,
-    getCamera: S,
+    init: g,
+    updatePosition: G,
+    getCamera: y,
     dispose: () => {
-      const g = w();
-      g && (De.forEach((c) => c()), De = [], Te.forEach((c) => c()), Te.clear(), Object.values(N).forEach((c) => g.remove(c)), Object.values(ne).forEach((c) => g.remove(c)), Object.values(ie).forEach((c) => {
-        var v, L, M, x;
-        g.remove(c), (L = (v = c.geometry) == null ? void 0 : v.dispose) == null || L.call(v), (x = (M = c.material) == null ? void 0 : M.dispose) == null || x.call(M);
-      }), Me && g.remove(Me), ot = {}, ne = {}, N = {}, ie = {}, Me = null, ae = null);
-    },
-    applyColorPreview: E,
-    applyFromStore: G
+      const S = w();
+      S && (Me.forEach((l) => l()), Me = [], Ae.forEach((l) => l()), Ae.clear(), Object.values(q).forEach((l) => S.remove(l)), Object.values(ne).forEach((l) => S.remove(l)), Object.values(ie).forEach((l) => {
+        var f, T, D, E;
+        S.remove(l), (T = (f = l.geometry) == null ? void 0 : f.dispose) == null || T.call(f), (E = (D = l.material) == null ? void 0 : D.dispose) == null || E.call(D);
+      }), Te && S.remove(Te), it = {}, ne = {}, q = {}, ie = {}, Te = null, ae = null);
+    },
+    applyColorPreview: x,
+    applyFromStore: F
   };
-}, Ws = 0.4, Xs = 0.25, Dt = () => {
-  const e = fe(), t = rt(), { getCamera: s } = it();
+}, Qs = 0.4, eo = 0.25, Bt = () => {
+  const e = he(), t = ct(), { getCamera: s } = ut();
   return {
     activate: () => {
       t.setMode({
@@ -1257,80 +1385,45 @@ const it = () => {
         }
       });
     },
-    frameToBounds: (n, o = 1.75) => {
-      if (!n) return;
-      const l = t.get(), a = s(), u = new I.Vector3(
-        n.center.x,
-        n.center.y + n.size.y * Ws,
-        n.center.z
-      ), p = Math.max(n.size.x, n.size.y, n.size.z), D = I.MathUtils.degToRad(a.fov), w = p / 2 / Math.tan(D / 2) * o;
-      l.target.copy(u), a.position.set(u.x, u.y + n.size.y * Xs, u.z + w), a.near = w / 100, a.far = w * 100, a.updateProjectionMatrix(), l.update();
+    frameToBounds: (i, o = 1.75) => {
+      if (!i) return;
+      const c = t.get(), a = s(), u = new I.Vector3(
+        i.center.x,
+        i.center.y + i.size.y * Qs,
+        i.center.z
+      ), p = Math.max(i.size.x, i.size.y, i.size.z), P = I.MathUtils.degToRad(a.fov), w = p / 2 / Math.tan(P / 2) * o;
+      c.target.copy(u), a.position.set(u.x, u.y + i.size.y * eo, u.z + w), a.near = w / 100, a.far = w * 100, a.updateProjectionMatrix(), c.update();
     },
     syncToStore: t.syncToStore,
     applyFromStore: t.applyFromStore
   };
 };
 let le = null;
-const Zs = () => {
+const to = () => {
   const e = () => {
-    const s = A();
-    return le = new I.LoadingManager(), le.onStart = function(i) {
-      s.loading.active = !0, s.loading.url = i, s.loading.percent = 0;
+    const s = M();
+    return le = new I.LoadingManager(), le.onStart = function(n) {
+      s.loading.active = !0, s.loading.url = n, s.loading.percent = 0;
     }, le.onError = () => {
       s.loading.active = !1, s.loading.url = null;
     }, le.onLoad = function() {
       s.loading.active = !1, s.loading.url = null, s.loading.percent = 100;
-    }, le.onProgress = function(i, r, n) {
-      s.loading.percent = Math.round(r / n * 100);
+    }, le.onProgress = function(n, r, i) {
+      s.loading.percent = Math.round(r / i * 100);
     }, le;
   };
   return { get: () => (le || e(), le) };
-};
-let _ = null, Oe = null, $e = null;
-const at = () => {
-  const e = A(), { get: t } = we(), { getCamera: s } = Le(), { width: i, height: r, subjectLoaded: n } = $(e);
-  function o(D) {
-    return console.debug("useRenderer init"), _ ? (console.debug("renderer already inited"), _) : (_ = new I.WebGLRenderer({ antialias: !0, alpha: !0 }), _.setSize(i.value, r.value), _.toneMapping = I.ACESFilmicToneMapping, _.toneMappingExposure = 0.8, _.shadowMap.enabled = !0, _.shadowMap.type = I.PCFSoftShadowMap, _.outputColorSpace = I.SRGBColorSpace, D && D.appendChild(_.domElement), e.loaded.renderer = !0, _);
-  }
-  const l = () => {
-    if (!_) throw new Error("Renderer has not been initialized");
-    return _;
-  }, a = (D) => {
-    _ && (_.toneMappingExposure = D);
-  }, u = () => {
-    const D = t(), w = s();
-    !D || !w || _.render(D, w);
-  };
-  Oe = O(
-    () => [i.value, r.value],
-    ([D, w]) => {
-      !D || !w || !_ || _.setSize(D, w);
-    }
-  ), $e = O(
-    () => n.value,
-    () => u()
-  );
-  function p() {
-    console.debug("renderer disposed"), e.loaded.renderer = !1, Oe == null || Oe(), $e == null || $e(), Oe = null, $e = null, _ && (_.domElement.parentElement && _.domElement.parentElement.removeChild(_.domElement), _.dispose(), _ = null);
-  }
-  return {
-    init: o,
-    get: l,
-    dispose: p,
-    render: u,
-    setExposure: a
-  };
-}, Ys = /hair|lash|brow|eye|cornea|sclera|iris|pupil|tear|teeth|tongue|mouth|gum|lip|nail/i, Qs = (e, t, s = {}) => {
-  const { removeSpecular: i = !1, removeShininess: r = !1 } = s;
-  e && e.traverse((n) => {
-    if (!n.isMesh) return;
-    (Array.isArray(n.material) ? n.material : [n.material]).forEach((l) => {
-      if (!l) return;
-      const a = `${n.name} ${l.name || ""}`;
-      Ys.test(a) || (l.color && l.color.set(t), i && l.specular && l.specular.set(0), r && typeof l.shininess == "number" && (l.shininess = 0), l.needsUpdate = !0);
+}, so = /hair|lash|brow|eye|cornea|sclera|iris|pupil|tear|teeth|tongue|mouth|gum|lip|nail/i, oo = (e, t, s = {}) => {
+  const { removeSpecular: n = !1, removeShininess: r = !1 } = s;
+  e && e.traverse((i) => {
+    if (!i.isMesh) return;
+    (Array.isArray(i.material) ? i.material : [i.material]).forEach((c) => {
+      if (!c) return;
+      const a = `${i.name} ${c.name || ""}`;
+      so.test(a) || (c.color && c.color.set(t), n && c.specular && c.specular.set(0), r && typeof c.shininess == "number" && (c.shininess = 0), c.needsUpdate = !0);
     });
   });
-}, Js = 1, eo = "https://www.gstatic.com/draco/v1/decoders/", lt = {
+}, no = 1, ro = "https://www.gstatic.com/draco/v1/decoders/", dt = {
   roughnessFloor: 0.85,
   metalness: null,
   envMapIntensity: null,
@@ -1339,8 +1432,8 @@ const at = () => {
   ambientIntensity: 0.2,
   spotIntensity: 1,
   envIntensity: 1
-}, to = {
-  nude: { ...lt },
+}, io = {
+  nude: { ...dt },
   // Smooth ships with no texture maps — pure-white sculpting reference.
   // All "detail" has to come from form-revealing shading on the
   // geometry, not from albedo. Same metalness=1 Diffeomorphic bug as
@@ -1349,7 +1442,7 @@ const at = () => {
   // exposure so lit surfaces don't saturate to white. The contrast
   // between lit and unlit faces is what makes form readable.
   smooth: {
-    ...lt,
+    ...dt,
     roughnessFloor: 0.3,
     metalness: 0,
     envMapIntensity: 0.02,
@@ -1367,194 +1460,194 @@ const at = () => {
     envIntensity: 1
   }
 };
-let ve = null, ce = null, ke, Vt = 0, ee = lt;
-const Rt = () => {
-  const { get: e } = Zs(), t = me(), s = A(), i = Ve(), r = It(), { selected: n } = $(s), { url: o } = $(t), { subjectHex: l } = $(r), { offset: a } = $(i), { getCamera: u } = Le(), { get: p } = we(), { render: D } = at(), w = (y) => {
-    const { setExposure: T } = at(), P = fe(), G = ++Vt;
-    s.subjectLoaded = !1, h();
-    const H = e();
-    ce || (ce = new Is(H), ce.setDecoderPath(eo));
-    const Z = new Es(H);
-    Z.setDRACOLoader(ce), Z.setWithCredentials(!0), Z.manager.setURLModifier((b) => b), Z.load(y, (b) => {
-      var g;
-      const m = b == null ? void 0 : b.scene;
-      if (G !== Vt) {
-        m == null || m.traverse((c) => {
-          var L;
-          if (!c.isMesh) return;
-          (L = c.geometry) == null || L.dispose();
-          const v = c.material;
-          Array.isArray(v) ? v.forEach((M) => M == null ? void 0 : M.dispose()) : v == null || v.dispose();
+let Se = null, ce = null, Be, Gt = 0, te = dt;
+const jt = () => {
+  const { get: e } = to(), t = fe(), s = M(), n = Fe(), r = Mt(), { selected: i } = N(s), { url: o } = N(t), { subjectHex: c } = N(r), { offset: a } = N(n), { getCamera: u } = Re(), { get: p } = Ie(), { render: P } = Xe(), w = (v) => {
+    const { setExposure: k } = Xe(), R = he(), F = ++Gt;
+    s.subjectLoaded = !1, m();
+    const $ = e();
+    ce || (ce = new As($), ce.setDecoderPath(ro));
+    const K = new Ms($);
+    K.setDRACOLoader(ce), K.setWithCredentials(!0), K.manager.setURLModifier((b) => b), K.load(v, (b) => {
+      var S;
+      const h = b == null ? void 0 : b.scene;
+      if (F !== Gt) {
+        h == null || h.traverse((l) => {
+          var T;
+          if (!l.isMesh) return;
+          (T = l.geometry) == null || T.dispose();
+          const f = l.material;
+          Array.isArray(f) ? f.forEach((D) => D == null ? void 0 : D.dispose()) : f == null || f.dispose();
         });
         return;
       }
-      if (!m)
+      if (!h)
         return;
-      ve = m, ee = to[(g = t.model) == null ? void 0 : g.slug] || lt, T(ee.exposure), P.seedFromRecipe(s.selected, ee);
-      const B = p(), F = u(), z = new I.Group();
-      z.name = "GLBSubject", z.add(m);
-      const j = /brow|lash/i;
-      m.traverse((c) => {
-        if (!c.isMesh) return;
-        c.castShadow = !0, c.receiveShadow = !0;
-        const v = Array.isArray(c.material) ? c.material : [c.material], L = `${c.name} ${v.map((x) => x == null ? void 0 : x.name).join(" ")}`, M = j.test(L);
-        v.forEach((x) => {
-          x && (ee.roughnessFloor !== null && typeof x.roughness == "number" && (x.roughness = Math.max(
-            x.roughness,
-            ee.roughnessFloor
-          )), ee.metalness !== null && typeof x.metalness == "number" && (x.metalness = ee.metalness), ee.envMapIntensity !== null && typeof x.envMapIntensity == "number" && (x.envMapIntensity = ee.envMapIntensity), x.transparent && M && (x.alphaTest = 0.2, x.depthWrite = !0), x.needsUpdate = !0);
+      Se = h, te = io[(S = t.model) == null ? void 0 : S.slug] || dt, k(te.exposure), R.seedFromRecipe(s.selected, te);
+      const B = p(), G = u(), z = new I.Group();
+      z.name = "GLBSubject", z.add(h);
+      const U = /brow|lash/i;
+      h.traverse((l) => {
+        if (!l.isMesh) return;
+        l.castShadow = !0, l.receiveShadow = !0;
+        const f = Array.isArray(l.material) ? l.material : [l.material], T = `${l.name} ${f.map((E) => E == null ? void 0 : E.name).join(" ")}`, D = U.test(T);
+        f.forEach((E) => {
+          E && (te.roughnessFloor !== null && typeof E.roughness == "number" && (E.roughness = Math.max(
+            E.roughness,
+            te.roughnessFloor
+          )), te.metalness !== null && typeof E.metalness == "number" && (E.metalness = te.metalness), te.envMapIntensity !== null && typeof E.envMapIntensity == "number" && (E.envMapIntensity = te.envMapIntensity), E.transparent && D && (E.alphaTest = 0.2, E.depthWrite = !0), E.needsUpdate = !0);
         });
-      }), ee.applyTint && Qs(m, l.value), m.scale.setScalar(Js), m.updateMatrixWorld(!0);
-      const Y = zt(m);
-      z.position.y -= Y.bottom, z.updateMatrixWorld(!0), B.add(z), ve = z;
-      const q = zt(z);
-      t.setBounds(q), D(B, F), s.subjectLoaded = !0;
+      }), te.applyTint && oo(h, c.value), h.scale.setScalar(no), h.updateMatrixWorld(!0);
+      const Y = Vt(h);
+      z.position.y -= Y.bottom, z.updateMatrixWorld(!0), B.add(z), Se = z;
+      const X = Vt(z);
+      t.setBounds(X), P(B, G), s.subjectLoaded = !0;
     });
-  }, h = () => {
-    if (!ve) return;
-    p().remove(ve), ve.traverse((T) => {
-      var G;
-      if (!T.isMesh) return;
-      (G = T.geometry) == null || G.dispose();
-      const P = T.material;
-      Array.isArray(P) ? P.forEach((H) => H == null ? void 0 : H.dispose()) : P == null || P.dispose();
-    }), ve = null, s.subjectLoaded = !1;
-  }, f = () => ve, S = () => {
-    if (ke) {
+  }, m = () => {
+    if (!Se) return;
+    p().remove(Se), Se.traverse((k) => {
+      var F;
+      if (!k.isMesh) return;
+      (F = k.geometry) == null || F.dispose();
+      const R = k.material;
+      Array.isArray(R) ? R.forEach(($) => $ == null ? void 0 : $.dispose()) : R == null || R.dispose();
+    }), Se = null, s.subjectLoaded = !1;
+  }, g = () => Se, y = () => {
+    if (Be) {
       console.warn("useGLB.init() called more than once");
       return;
     }
-    ke = O(
-      () => n.value,
-      (y, T) => {
-        !y || y === T || o.value && w(o.value);
+    Be = j(
+      () => i.value,
+      (v, k) => {
+        !v || v === k || o.value && w(o.value);
       },
       { immediate: !0 }
     );
-  }, E = () => {
-    ke == null || ke(), ke = null, h(), ce == null || ce.dispose(), ce = null;
+  }, x = () => {
+    Be == null || Be(), Be = null, m(), ce == null || ce.dispose(), ce = null;
   };
-  return _t(() => {
-    E();
-  }), { init: S, get: f, dispose: E };
-}, so = (e, t, s = 500) => {
-  const i = e.material;
-  i.transparent = !0;
-  const r = i.opacity, n = performance.now(), o = (l) => {
-    const a = l - n, u = Math.min(a / s, 1), p = r + (t - r) * u;
-    i.opacity = p, u < 1 && requestAnimationFrame(o);
+  return Ut(() => {
+    x();
+  }), { init: y, get: g, dispose: x };
+}, ao = (e, t, s = 500) => {
+  const n = e.material;
+  n.transparent = !0;
+  const r = n.opacity, i = performance.now(), o = (c) => {
+    const a = c - i, u = Math.min(a / s, 1), p = r + (t - r) * u;
+    n.opacity = p, u < 1 && requestAnimationFrame(o);
   };
   requestAnimationFrame(o);
-}, oo = 34815;
-let V = null, Ne = null, He = null, qe = null;
-const Gt = () => {
-  const e = Ee(), t = Ve(), s = me(), { show: i, divisions: r, size: n, opacity: o } = $(e), { offset: l } = $(t), { bounds: a } = $(s), { get: u } = we(), p = () => {
-    const b = T(oo), m = b, { positions: B, colors: F } = D({
-      size: n.value,
+}, lo = 34815;
+let _ = null, He = null, Je = null, Ke = null;
+const Ot = () => {
+  const e = ke(), t = Fe(), s = fe(), { show: n, divisions: r, size: i, opacity: o } = N(e), { offset: c } = N(t), { bounds: a } = N(s), { get: u } = Ie(), p = () => {
+    const b = k(lo), h = b, { positions: B, colors: G } = P({
+      size: i.value,
       divisions: r.value,
       color: b,
-      centerColor: m
-    }), z = w(B, F), j = h(o.value);
-    return new I.LineSegments(z, j);
-  }, D = ({ size: b, divisions: m, color: B, centerColor: F }) => {
-    const z = b / 2, j = b / m, Y = [], q = [], g = Math.floor(m / 2), c = (v, L, M, x) => {
-      Y.push(v, L, M);
-      const U = x ? F : B;
-      q.push(U.r, U.g, U.b);
+      centerColor: h
+    }), z = w(B, G), U = m(o.value);
+    return new I.LineSegments(z, U);
+  }, P = ({ size: b, divisions: h, color: B, centerColor: G }) => {
+    const z = b / 2, U = b / h, Y = [], X = [], S = Math.floor(h / 2), l = (f, T, D, E) => {
+      Y.push(f, T, D);
+      const O = E ? G : B;
+      X.push(O.r, O.g, O.b);
     };
-    for (let v = 0; v <= m; v++) {
-      const L = -z + v * j, M = v === g;
-      for (let x = 0; x <= m; x++) {
-        const U = -z + x * j, K = M || x === g;
-        c(-z, L, U, K), c(+z, L, U, K);
+    for (let f = 0; f <= h; f++) {
+      const T = -z + f * U, D = f === S;
+      for (let E = 0; E <= h; E++) {
+        const O = -z + E * U, J = D || E === S;
+        l(-z, T, O, J), l(+z, T, O, J);
       }
     }
-    for (let v = 0; v <= m; v++) {
-      const L = -z + v * j, M = v === g;
-      for (let x = 0; x <= m; x++) {
-        const U = -z + x * j, K = M || x === g;
-        c(L, -z, U, K), c(L, +z, U, K);
+    for (let f = 0; f <= h; f++) {
+      const T = -z + f * U, D = f === S;
+      for (let E = 0; E <= h; E++) {
+        const O = -z + E * U, J = D || E === S;
+        l(T, -z, O, J), l(T, +z, O, J);
       }
     }
-    for (let v = 0; v <= m; v++) {
-      const L = -z + v * j, M = v === g;
-      for (let x = 0; x <= m; x++) {
-        const U = -z + x * j, K = M || x === g;
-        c(L, U, -z, K), c(L, U, +z, K);
+    for (let f = 0; f <= h; f++) {
+      const T = -z + f * U, D = f === S;
+      for (let E = 0; E <= h; E++) {
+        const O = -z + E * U, J = D || E === S;
+        l(T, O, -z, J), l(T, O, +z, J);
       }
     }
-    return { positions: Y, colors: q };
-  }, w = (b, m) => {
+    return { positions: Y, colors: X };
+  }, w = (b, h) => {
     const B = new I.BufferGeometry();
     return B.setAttribute(
       "position",
       new I.Float32BufferAttribute(b, 3)
-    ), B.setAttribute("color", new I.Float32BufferAttribute(m, 3)), B;
-  }, h = (b) => new I.LineBasicMaterial({
+    ), B.setAttribute("color", new I.Float32BufferAttribute(h, 3)), B;
+  }, m = (b) => new I.LineBasicMaterial({
     transparent: !0,
     opacity: b,
     depthWrite: !1,
     blending: I.NormalBlending,
     vertexColors: !0
-  }), f = () => {
-    V && y(i.value);
-  }, S = () => {
+  }), g = () => {
+    _ && v(n.value);
+  }, y = () => {
     const b = u();
-    V = p(), H(), b.add(V), E(0);
-  }, E = (b) => {
-    V && (V.material.transparent = !0, b = i.value ? b : 0, V.material.opacity = b);
-  }, y = (b) => {
-    const m = b ? o.value : 0;
-    so(V, m, 500);
-  }, T = (b) => ({
+    _ = p(), $(), b.add(_), x(0);
+  }, x = (b) => {
+    _ && (_.material.transparent = !0, b = n.value ? b : 0, _.material.opacity = b);
+  }, v = (b) => {
+    const h = b ? o.value : 0;
+    ao(_, h, 500);
+  }, k = (b) => ({
     r: (b >> 16 & 255) / 255,
     g: (b >> 8 & 255) / 255,
     b: (b & 255) / 255
-  }), P = (b, m) => {
-    if (!V) return;
-    const B = T(b), F = T(m), z = V.geometry.attributes.color, j = V.geometry.attributes.position, Y = j.count, q = n.value / 2, g = n.value / r.value, c = Math.floor(r.value / 2);
-    for (let v = 0; v < Y; v++) {
-      const L = j.getX(v), M = j.getY(v), x = j.getZ(v), U = Math.round((L + q) / g), he = Math.round((M + q) / g), K = Math.round((x + q) / g), Re = U === c || he === c || K === c ? B : F;
-      z.setXYZ(v, Re.r, Re.g, Re.b);
+  }), R = (b, h) => {
+    if (!_) return;
+    const B = k(b), G = k(h), z = _.geometry.attributes.color, U = _.geometry.attributes.position, Y = U.count, X = i.value / 2, S = i.value / r.value, l = Math.floor(r.value / 2);
+    for (let f = 0; f < Y; f++) {
+      const T = U.getX(f), D = U.getY(f), E = U.getZ(f), O = Math.round((T + X) / S), ge = Math.round((D + X) / S), J = Math.round((E + X) / S), _e = O === l || ge === l || J === l ? B : G;
+      z.setXYZ(f, _e.r, _e.g, _e.b);
     }
     z.needsUpdate = !0;
-  }, G = () => {
+  }, F = () => {
     const b = u();
-    V && (b.remove(V), V.geometry.dispose(), V.material.dispose(), V = null), V = p(), H(), b.add(V);
-  }, H = () => {
-    var m;
-    const b = ((m = a.value) == null ? void 0 : m.bottom) || 0;
-    V.position.set(0, b + n.value / 2 + 7e-3, 0);
+    _ && (b.remove(_), _.geometry.dispose(), _.material.dispose(), _ = null), _ = p(), $(), b.add(_);
+  }, $ = () => {
+    var h;
+    const b = ((h = a.value) == null ? void 0 : h.bottom) || 0;
+    _.position.set(0, b + i.value / 2 + 7e-3, 0);
   };
-  return Ne = O(
-    () => [n.value, r.value],
-    ([b, m], [B, F]) => {
-      b === B && m === F || (G(), f());
+  return He = j(
+    () => [i.value, r.value],
+    ([b, h], [B, G]) => {
+      b === B && h === G || (F(), g());
     },
     { flush: "post" }
-  ), He = O(
-    () => i.value,
+  ), Je = j(
+    () => n.value,
     () => {
-      f();
+      g();
     },
     { flush: "post" }
-  ), qe = O(
+  ), Ke = j(
     () => o.value,
     (b) => {
-      E(b);
+      x(b);
     },
     { flush: "post" }
   ), {
-    init: S,
-    showHideGrid: y,
-    updateGridColors: P,
+    init: y,
+    showHideGrid: v,
+    updateGridColors: R,
     dispose: () => {
-      var m, B;
+      var h, B;
       const b = u();
-      Ne == null || Ne(), He == null || He(), qe == null || qe(), Ne = null, He = null, qe = null, V && (b.remove(V), (m = V.geometry) == null || m.dispose(), Array.isArray(V.material) ? V.material.forEach((F) => F == null ? void 0 : F.dispose()) : (B = V.material) == null || B.dispose(), V = null);
+      He == null || He(), Je == null || Je(), Ke == null || Ke(), He = null, Je = null, Ke = null, _ && (b.remove(_), (h = _.geometry) == null || h.dispose(), Array.isArray(_.material) ? _.material.forEach((G) => G == null ? void 0 : G.dispose()) : (B = _.material) == null || B.dispose(), _ = null);
     }
   };
-}, no = { class: "three-dimension-tool" }, ro = ["data-id"], io = /* @__PURE__ */ Object.assign({
+}, co = { class: "three-dimension-tool" }, uo = ["data-id"], po = /* @__PURE__ */ Object.assign({
   name: "ThreeDimensionTool",
   slug: "three-dimension-tool",
   inheritAttrs: !1
@@ -1566,82 +1659,95 @@ const Gt = () => {
   setup(e) {
     const t = e;
     let s = null;
-    const i = C(() => Number(t.id)), r = A(), n = ct(), o = fe(), l = me(), { move: a } = $(o), u = pe(null), p = pe(!1);
-    let D, w, h;
-    const f = rt(), S = Mt(), E = Dt(), { init: y, setEnvironment: T } = we(), { init: P } = at(), { init: G } = Le(), { init: H, updateVisibility: Z } = Pt(), { init: b, updatePosition: m } = it(), { init: B } = Rt(), { init: F } = Gt(), z = () => {
-      if (!u.value || p.value) {
+    const n = C(() => Number(t.id)), r = M(), i = pt(), o = he(), c = fe(), { move: a } = N(o), { isFrozen: u } = N(r), p = pe(null), P = pe(!1);
+    let w, m, g;
+    const y = ct(), x = At(), v = Bt(), { init: k, setEnvironment: R } = Ie(), { init: F } = Xe(), { init: $ } = Re(), { init: K, updateVisibility: b } = _t(), { init: h, updatePosition: B } = ut(), { init: G } = jt(), { init: z } = Ot(), U = () => {
+      if (!p.value || P.value) {
         console.warn("Canvas element not found");
         return;
       }
-      p.value = !0, h = y(), w = P(u.value), T(w), B(), D = G(), b(), F(), H(), f.init(w), j();
-    }, j = () => {
-      p.value && (a.value !== s && (s = a.value, a.value ? E.activate() : S.activate()), f.update(), a.value ? (m(), E.syncToStore()) : S.syncToStore(), Z(), w.render(h, D), requestAnimationFrame(j));
+      P.value = !0, g = k(), m = F(p.value), R(m), G(), w = $(), h(), z(), K(), y.init(m), Y();
     }, Y = () => {
-      if (u.value) {
-        const q = window.innerWidth, g = window.innerHeight;
-        r.$patch({ width: q, height: g }), u.value.style.height = g + "px";
+      P.value && (a.value !== s && (s = a.value, a.value ? v.activate() : x.activate()), y.update(), a.value ? (B(), v.syncToStore()) : x.syncToStore(), b(), m.render(g, w), requestAnimationFrame(Y));
+    }, X = () => {
+      if (p.value) {
+        const l = window.innerWidth, f = window.innerHeight;
+        r.$patch({ width: l, height: f }), p.value.style.height = f + "px";
       }
+    }, S = () => {
+      u.value && r.pokeFreeze();
     };
-    return jt(() => {
-      console.log("onMounted", u.value), z(), window.addEventListener("resize", Y), Y();
-    }), O(
-      () => l.bounds,
-      (q) => {
-        q && (E.activate(), o.hasRig || (E.frameToBounds(q), E.syncToStore(), o.markFramed()), S.activate(), n.hasRig || (S.frameToBounds(q), S.syncToStore(), n.markFramed()));
+    return j(u, (l) => {
+      var T;
+      const f = (T = y.get) == null ? void 0 : T.call(y);
+      f && (f.enabled = !l);
+    }), j(
+      () => [i.applyRevision, o.applyRevision],
+      () => {
+        P.value && (v.activate(), B(), x.activate());
+      }
+    ), $t(() => {
+      var l;
+      console.log("onMounted", p.value), U(), window.addEventListener("resize", X), X(), (l = p.value) == null || l.addEventListener("pointerdown", S, !0);
+    }), j(
+      () => c.bounds,
+      (l) => {
+        l && (v.activate(), o.hasRig || (v.frameToBounds(l), v.syncToStore(), o.markFramed()), x.activate(), i.hasRig || (x.frameToBounds(l), x.syncToStore(), i.markFramed()));
       }
-    ), O(
+    ), j(
       () => r.subjectLoaded,
-      (q) => {
-        if (!q) return;
-        const g = l.bounds;
-        if (!g) return;
-        n.hasRig || (f.frameToBounds(g), n.markFramed());
-        const c = f.get();
-        c.update(), c.saveState();
+      (l) => {
+        if (!l) return;
+        const f = c.bounds;
+        if (!f) return;
+        i.hasRig || (y.frameToBounds(f), i.markFramed());
+        const T = y.get();
+        T.update(), T.saveState();
       }
-    ), _t(() => {
-      console.debug("ThreeDimensionTool unMounted"), window.removeEventListener("resize", this), p.value = !1, Rt().dispose(), Gt().dispose(), Pt().dispose(), it().dispose(), rt().dispose(), Le().dispose(), we().dispose(), at().dispose();
-    }), (q, g) => (nt(), rs("div", no, [
-      vt("", !0),
-      is("div", {
+    ), Ut(() => {
+      var l;
+      console.debug("ThreeDimensionTool unMounted"), window.removeEventListener("resize", this), (l = p.value) == null || l.removeEventListener("pointerdown", S, !0), P.value = !1, jt().dispose(), Ot().dispose(), _t().dispose(), ut().dispose(), ct().dispose(), Re().dispose(), Ie().dispose(), Xe().dispose();
+    }), (l, f) => (at(), cs("div", co, [
+      wt("", !0),
+      us("div", {
         class: "tres",
         ref_key: "tres",
-        ref: u,
-        "data-id": i.value
-      }, null, 8, ro)
+        ref: p,
+        "data-id": n.value
+      }, null, 8, uo)
     ]));
   }
-}), Ft = /* @__PURE__ */ Object.assign({ "../i18n/en-US/index.js": () => import("./index-CwHAnjEe.js") }), W = (e = "../i18n") => {
-  const t = ps(), s = pe({}), i = C(() => t.lang.isoName || "en-US"), r = async () => {
-    const n = `${e}/${i.value}/index.js`;
-    if (Ft[n])
+}), Nt = /* @__PURE__ */ Object.assign({ "../i18n/en-US/index.js": () => import("./index-CwHAnjEe.js") }), H = (e = "../i18n") => {
+  const t = bs(), s = pe({}), n = C(() => t.lang.isoName || "en-US"), r = async () => {
+    const i = `${e}/${n.value}/index.js`;
+    if (Nt[i])
       try {
-        const o = await Ft[n]();
+        const o = await Nt[i]();
         o.default && Object.assign(s.value, o.default);
       } catch (o) {
-        console.error(`Error loading i18n for ${i.value}`, o);
+        console.error(`Error loading i18n for ${n.value}`, o);
       }
     else
-      console.error(`Module not found: ${n}`);
+      console.error(`Module not found: ${i}`);
   };
-  return O(
-    () => i.value,
+  return j(
+    () => n.value,
     () => {
       r();
     },
     { immediate: !0 }
-  ), as(() => {
+  ), ds(() => {
     r();
   }), { lang: s };
-}, oe = ({ tab: e = se, store: t, options: s = [] }) => {
-  const i = bs(), r = A(i), n = C({
+}, Ee = 26, Z = ({ tab: e = oe, store: t, options: s = [] }) => {
+  const n = ws(), r = M(n), i = C({
     get: () => r.isExpanded(s),
     set: (a) => {
       a && r.setActive(e);
     }
   }), o = C(() => t && t.changed);
-  return { click: () => r.setActive(e), expanded: n, selected: o };
-}, Tt = R({
+  return { click: () => r.setActive(e), expanded: i, selected: o };
+}, zt = V({
   name: "ToolResetButton",
   props: {
     label: { type: String, required: !1, default: "Reset" },
@@ -1649,33 +1755,45 @@ const Gt = () => {
   },
   emits: ["click"],
   setup(e, { slots: t, emit: s }) {
-    function i() {
+    function n() {
       s("click");
     }
     function r() {
-      const n = {
+      const i = {
         label: e.label,
         class: "full-width",
         flat: !0,
-        onClick: i,
+        onClick: n,
         disable: e.disable
       };
-      return d("div", { class: "tool-reset-button q-pa-md" }, d(Ut, n));
+      return d("div", { class: "tool-reset-button q-pa-md" }, d(qt, i));
     }
     return () => r();
   }
-}), Yt = R({
+}), ft = V({
+  name: "FrozenOverlay",
+  setup() {
+    const e = M(), { isFrozen: t } = N(e);
+    function s() {
+      return ps(d("div", {
+        class: "frozen-overlay",
+        onClick: () => e.pokeFreeze()
+      }, []), [[ms, t.value]]);
+    }
+    return () => s();
+  }
+}), es = V({
   name: "TdColorsSection",
   setup(e, { slots: t, emit: s }) {
-    const { lang: i } = W(), r = A(), n = ut(), o = Ve(), { active: l } = $(r), a = pe(!1), u = pe(!1), p = C(
+    const { lang: n } = H(), r = M(), i = mt(), o = Fe(), { active: c } = N(r), a = pe(!1), u = pe(!1), p = C(
       () => {
         var b;
-        return (b = i.value.td) == null ? void 0 : b.components.colors.items.background;
+        return (b = n.value.td) == null ? void 0 : b.components.colors.items.background;
       }
-    ), D = C(
+    ), P = C(
       () => {
         var b;
-        return (b = i.value.td) == null ? void 0 : b.components.colors.items.ground;
+        return (b = n.value.td) == null ? void 0 : b.components.colors.items.ground;
       }
     ), w = C(() => ({
       key: p.value,
@@ -1683,63 +1801,64 @@ const Gt = () => {
       type: "none",
       icon: "f_scene",
       size: "sm",
-      color: n.colorHex,
+      color: i.colorHex,
       onClick: () => a.value = !0
-    })), h = C(() => ({
-      key: D.value,
-      label: D.value,
+    })), m = C(() => ({
+      key: P.value,
+      label: P.value,
       type: "none",
       icon: "f_ground",
       size: "sm",
       color: o.colorHex,
       onClick: () => u.value = !0
-    })), f = C({
+    })), g = C({
       get: () => u.value || a.value,
       set: (b) => u.value = a.value = !1
-    }), S = C({
-      get: () => u.value ? o.colorHex : n.colorHex,
+    }), y = C({
+      get: () => u.value ? o.colorHex : i.colorHex,
       set: (b) => {
         if (u.value) {
           o.setColorHex(b);
           return;
         }
-        n.setColorHex(b);
+        i.setColorHex(b);
       }
-    }), E = C(() => ({
+    }), x = C(() => ({
       class: "td-colors-tool q-pa-xs row justify-center items-center q-gutter-md",
-      style: f.value ? "display: none" : ""
-    })), y = C(() => ({
-      modelValue: S.value,
-      "onUpdate:modelValue": (b) => S.value = b,
-      show: f.value,
-      "onUpdate:show": (b) => f.value = b,
-      label: T.value
-    })), T = C(() => u.value ? D.value : p.value), P = () => {
-      n.reset(), o.reset();
-    }, G = C(() => o.changed || n.changed), H = C(() => ({
+      style: g.value ? "display: none" : ""
+    })), v = C(() => ({
+      modelValue: y.value,
+      "onUpdate:modelValue": (b) => y.value = b,
+      show: g.value,
+      "onUpdate:show": (b) => g.value = b,
+      label: k.value
+    })), k = C(() => u.value ? P.value : p.value), R = () => {
+      i.reset(), o.reset();
+    }, F = C(() => o.changed || i.changed), $ = C(() => ({
       label: "Reset Colors",
-      onClick: P,
-      style: f.value ? "display: none" : "",
-      disable: !G.value
+      onClick: R,
+      style: g.value ? "display: none" : "",
+      disable: !F.value
     }));
-    O(l, (b) => {
-      b !== se && (f.value = !1);
+    j(c, (b) => {
+      b !== oe && (g.value = !1);
     });
-    function Z() {
+    function K() {
       return d("div", {
         class: "full-width"
       }, [
-        d("div", E.value, [
-          d(Ce, w.value),
-          d(Ce, h.value)
+        d(ft),
+        d("div", x.value, [
+          d(me, w.value),
+          d(me, m.value)
         ]),
-        d(Tt, H.value),
-        d(fs, y.value)
+        d(zt, $.value),
+        d(ys, v.value)
       ]);
     }
-    return () => Z();
+    return () => K();
   }
-}), ao = R({
+}), mo = V({
   name: "TdColorsExpansion",
   props: {
     modelValue: { type: Number, default: 0 },
@@ -1748,13 +1867,13 @@ const Gt = () => {
   },
   emits: ["click", "update:modelValue"],
   setup(e, { slots: t, emit: s }) {
-    const { lang: i } = W(), r = It(), { expanded: n, selected: o } = oe({
+    const { lang: n } = H(), r = Mt(), { expanded: i, selected: o } = Z({
       store: r,
-      options: se,
-      tab: se
-    }), l = C(() => {
+      options: oe,
+      tab: oe
+    }), c = C(() => {
       var u;
-      return (u = i.value.td) == null ? void 0 : u.components.colors.title;
+      return (u = n.value.td) == null ? void 0 : u.components.colors.title;
     });
     C({
       get: () => e.modelValue,
@@ -1764,28 +1883,28 @@ const Gt = () => {
       const u = {
         class: "td-colors-expansion",
         "data-cy": "td-colors-expansion",
-        modelValue: n.value,
-        "onUpdate:modelValue": (p) => n.value = p,
-        label: l.value,
+        modelValue: i.value,
+        "onUpdate:modelValue": (p) => i.value = p,
+        label: c.value,
         selected: o.value,
         icon: "f_palette"
       };
-      return d(We, u, () => d(Yt));
+      return d(Ve, u, () => d(es));
     }
     return () => a();
   }
-}), Qt = R({
+}), ts = V({
   name: "TdGridSection",
   setup(e, { slots: t, emit: s }) {
-    const { lang: i } = W(), r = Ee(), n = C(
+    const { lang: n } = H(), r = ke(), i = C(
       () => {
-        var w, h;
-        return o.value ? ((w = i.value.td) == null ? void 0 : w.components.grid.toggle.off) || "" : ((h = i.value.td) == null ? void 0 : h.components.grid.toggle.on) || "";
+        var w, m;
+        return o.value ? ((w = n.value.td) == null ? void 0 : w.components.grid.toggle.off) || "" : ((m = n.value.td) == null ? void 0 : m.components.grid.toggle.on) || "";
       }
     ), o = C({
       get: () => r.show,
       set: (w) => r.setProperty("show", w)
-    }), l = C({
+    }), c = C({
       get: () => r.opacity,
       set: (w) => r.setProperty("opacity", w)
     }), a = C({
@@ -1799,36 +1918,36 @@ const Gt = () => {
       disable: !r.changed,
       onClick: r.reset
     }));
-    function D() {
+    function P() {
       const w = {
         class: "td-grid-tool"
-      }, h = {
+      }, m = {
         access: "grd",
         // drawer: !props.noIcons,
         modelValue: o.value,
-        "onUpdate:modelValue": (T) => o.value = T,
-        label: n.value
+        "onUpdate:modelValue": (k) => o.value = k,
+        label: i.value
         // dark: props.dark,
         // disable: props.disable,
         // hasAccess: props.hasAccess,
         // onBlockAccess: emitBlockAccess,
-      }, f = {
+      }, g = {
         title: "Opacity",
         icon: "f_opacity",
         min: 1,
         max: 100,
         initial: 50,
-        modelValue: l.value * 100,
-        "onUpdate:modelValue": (T) => l.value = T / 100
-      }, S = {
+        modelValue: c.value * 100,
+        "onUpdate:modelValue": (k) => c.value = k / 100
+      }, y = {
         title: "Size",
         icon: "f_size",
         min: 100,
         max: 300,
         initial: 200,
         modelValue: a.value * 100,
-        "onUpdate:modelValue": (T) => a.value = T / 100
-      }, E = {
+        "onUpdate:modelValue": (k) => a.value = k / 100
+      }, x = {
         title: "Number of lines",
         icon: "f_grid",
         min: 2,
@@ -1837,13 +1956,13 @@ const Gt = () => {
         step: 2,
         initial: 6,
         modelValue: u.value,
-        "onUpdate:modelValue": (T) => u.value = T
-      }, y = [d(Ot, h)];
-      return o.value && (y.push(d(Ke, S)), y.push(d(Ke, E)), y.push(d(Ke, f)), y.push(d(Tt, p.value))), d("div", w, y);
+        "onUpdate:modelValue": (k) => u.value = k
+      }, v = [d(ft), d(Ht, m)];
+      return o.value && (v.push(d(We, y)), v.push(d(We, x)), v.push(d(We, g)), v.push(d(zt, p.value))), d("div", w, v);
     }
-    return () => D();
+    return () => P();
   }
-}), lo = R({
+}), fo = V({
   name: "TdGridExpansion",
   props: {
     modelValue: { type: Number, default: 0 },
@@ -1852,13 +1971,13 @@ const Gt = () => {
   },
   emits: ["click", "update:modelValue"],
   setup(e, { slots: t, emit: s }) {
-    const { lang: i } = W(), r = Ee(), { expanded: n, selected: o } = oe({
+    const { lang: n } = H(), r = ke(), { expanded: i, selected: o } = Z({
       store: r,
-      options: Se,
-      tab: Se
-    }), l = C(() => {
+      options: we,
+      tab: we
+    }), c = C(() => {
       var u;
-      return (u = i.value.td) == null ? void 0 : u.components.grid.title;
+      return (u = n.value.td) == null ? void 0 : u.components.grid.title;
     });
     C({
       get: () => e.modelValue,
@@ -1868,17 +1987,17 @@ const Gt = () => {
       const u = {
         class: "td-colors-expansion",
         "data-cy": "td-colors-expansion",
-        modelValue: n.value,
-        "onUpdate:modelValue": (p) => n.value = p,
-        label: l.value,
+        modelValue: i.value,
+        "onUpdate:modelValue": (p) => i.value = p,
+        label: c.value,
         selected: o.value,
         icon: "f_grid"
       };
-      return d(We, u, () => d(Qt));
+      return d(Ve, u, () => d(ts));
     }
     return () => a();
   }
-}), Jt = R({
+}), ss = V({
   name: "TdLightsSection",
   props: {
     modelValue: { type: Number, default: 0 },
@@ -1887,89 +2006,90 @@ const Gt = () => {
   },
   emits: ["click", "update:modelValue"],
   setup() {
-    const { lang: e } = W(), t = fe(), s = A(), i = me(), r = it(), n = Dt(), o = Mt(), { active: l } = $(s), a = C({
+    const { lang: e } = H(), t = he(), s = M(), n = fe(), r = ut(), i = Bt(), o = At(), { active: c } = N(s), a = C({
       get: () => t.move,
-      set: (m) => t.setMove(m)
+      set: (h) => t.setMove(h)
     }), u = C(
       () => {
-        var m, B;
-        return t.move ? ((m = e.value.td) == null ? void 0 : m.components.lights.toggles.position.off) || "" : ((B = e.value.td) == null ? void 0 : B.components.lights.toggles.position.on) || "";
+        var h, B;
+        return t.move ? ((h = e.value.td) == null ? void 0 : h.components.lights.toggles.position.off) || "" : ((B = e.value.td) == null ? void 0 : B.components.lights.toggles.position.on) || "";
       }
     ), p = C(() => ({
       modelValue: a.value,
-      "onUpdate:modelValue": (m) => a.value = m,
+      "onUpdate:modelValue": (h) => a.value = h,
       label: u.value
-    })), D = C(
+    })), P = C(
       () => {
-        var m;
-        return ((m = e.value.td) == null ? void 0 : m.components.lights.ambientIntensity) || "";
+        var h;
+        return ((h = e.value.td) == null ? void 0 : h.components.lights.ambientIntensity) || "";
       }
     ), w = C(
       () => {
-        var m;
-        return ((m = e.value.td) == null ? void 0 : m.components.lights.userIntensity) || "";
+        var h;
+        return ((h = e.value.td) == null ? void 0 : h.components.lights.userIntensity) || "";
       }
-    ), h = 0, f = 50, S = 100, E = (m, B, F) => ({
-      toSlider: (z) => z <= B ? h + (z - m) / (B - m) * (f - h) : f + (z - B) / (F - B) * (S - f),
-      fromSlider: (z) => z <= f ? m + (z - h) / (f - h) * (B - m) : B + (z - f) / (S - f) * (F - B)
-    }), y = E(
-      Be,
-      te,
-      yt
-    ), T = E(
-      Be,
-      te,
-      St
-    ), P = (m, B, F, z) => ({
-      title: m,
+    ), m = 0, g = 50, y = 100, x = (h, B, G) => ({
+      toSlider: (z) => z <= B ? m + (z - h) / (B - h) * (g - m) : g + (z - B) / (G - B) * (y - g),
+      fromSlider: (z) => z <= g ? h + (z - m) / (g - m) * (B - h) : B + (z - g) / (y - g) * (G - B)
+    }), v = x(
+      Pe,
+      se,
+      Et
+    ), k = x(
+      Pe,
+      se,
+      It
+    ), R = (h, B, G, z) => ({
+      title: h,
       icon: "f_brightness",
-      min: h,
-      max: S,
-      modelValue: B.toSlider(F),
-      "onUpdate:modelValue": (j) => {
-        z(B.fromSlider(j));
+      min: m,
+      max: y,
+      modelValue: B.toSlider(G),
+      "onUpdate:modelValue": (U) => {
+        z(B.fromSlider(U));
       }
-    }), G = C(
-      () => P(
-        D.value,
-        y,
+    }), F = C(
+      () => R(
+        P.value,
+        v,
         t.ambientScale,
-        (m) => t.setAmbientScale(m)
+        (h) => t.setAmbientScale(h)
       )
-    ), H = C(
-      () => P(
+    ), $ = C(
+      () => R(
         w.value,
-        T,
+        k,
         t.userScale,
-        (m) => t.setUserScale(m)
+        (h) => t.setUserScale(h)
       )
-    ), Z = C(() => ({
+    ), K = C(() => ({
       label: "Reset Lights",
       disable: !t.changed,
       onClick: () => {
         var B;
         t.reset();
-        const m = i.bounds;
-        m && (n.activate(), n.frameToBounds(m), n.syncToStore(), o.activate()), (B = r.applyFromStore) == null || B.call(r);
+        const h = n.bounds;
+        h && (i.activate(), i.frameToBounds(h), i.syncToStore(), o.activate()), (B = r.applyFromStore) == null || B.call(r);
       }
     }));
-    O(l, (m) => {
-      m !== de && (a.value = !1);
+    j(c, (h) => {
+      h !== de && (a.value = !1);
     });
     function b() {
-      const m = {
+      const h = {
         class: "td-lights-tool"
       }, B = [
-        d(Ot, p.value),
-        d(Ke, G.value),
-        d(Ke, H.value),
-        d(Tt, Z.value)
+        d(ft),
+        d(Ht, p.value),
+        d(We, F.value),
+        d(We, $.value),
+        d(zt, K.value)
       ];
-      return d("div", m, B);
+      return d("div", h, B);
     }
     return () => b();
   }
-}), co = R({
+}), ho = V({
   name: "TdLightExpansion",
   props: {
     modelValue: { type: Number, default: 0 },
@@ -1978,13 +2098,13 @@ const Gt = () => {
   },
   emits: ["click", "update:modelValue"],
   setup(e, { slots: t, emit: s }) {
-    const { lang: i } = W(), r = fe(), { expanded: n, selected: o } = oe({
+    const { lang: n } = H(), r = he(), { expanded: i, selected: o } = Z({
       store: r,
       options: de,
       tab: de
-    }), l = C(() => {
+    }), c = C(() => {
       var u;
-      return (u = i.value.td) == null ? void 0 : u.components.lights.title;
+      return (u = n.value.td) == null ? void 0 : u.components.lights.title;
     });
     C({
       get: () => e.modelValue,
@@ -1994,75 +2114,105 @@ const Gt = () => {
       const u = {
         class: "td-lights-expansion",
         "data-cy": "td-lights-expansion",
-        modelValue: n.value,
-        "onUpdate:modelValue": (p) => n.value = p,
-        label: l.value,
+        modelValue: i.value,
+        "onUpdate:modelValue": (p) => i.value = p,
+        label: c.value,
         selected: o.value,
         icon: "f_bulb_light"
       };
-      return d(We, u, () => d(Jt));
+      return d(Ve, u, () => d(ss));
     }
     return () => a();
   }
-}), es = R({
+}), os = V({
   name: "TdRelatedSection",
   setup() {
-    const e = Symbol.for("RelatedSection"), t = xt(e);
+    const e = Symbol.for("RelatedSection"), t = Ze(e);
     function s() {
-      const i = {
+      const n = {
         class: "td-related-section q-mx-lg q-my-sm"
       }, r = [];
-      return t && r.push(d(t)), d("div", i, r);
+      return t && r.push(d(t)), d("div", n, r);
     }
     return () => s();
   }
-}), uo = R({
+}), go = V({
   name: "TdRelatedExpansion",
   setup(e, { slots: t, emit: s }) {
-    const { expanded: i } = oe({
-      options: xe,
-      tab: xe
+    const { expanded: n } = Z({
+      options: Ce,
+      tab: Ce
     }), r = C(() => "Related");
-    function n() {
+    function i() {
       const o = {
         class: "td-related-expansion",
-        modelValue: i.value,
-        "onUpdate:modelValue": (l) => i.value = l,
+        modelValue: n.value,
+        "onUpdate:modelValue": (c) => n.value = c,
         label: r.value,
         icon: "f_related"
       };
-      return d(We, o, () => d(es));
+      return d(Ve, o, () => d(os));
     }
-    return () => n();
+    return () => i();
+  }
+}), ns = V({
+  name: "TdSavedSection",
+  setup() {
+    const e = Symbol.for("SavedSection"), t = Ze(e);
+    function s() {
+      return t ? d("div", {
+        class: "td-saved-section q-mx-lg q-my-sm"
+      }, [d(t)]) : null;
+    }
+    return () => s();
+  }
+}), vo = V({
+  name: "TdSavedExpansion",
+  setup() {
+    const { expanded: e } = Z({
+      options: Ee,
+      tab: Ee
+    }), t = C(() => "Saved");
+    function s() {
+      const n = {
+        class: "td-saved-expansion",
+        modelValue: e.value,
+        "onUpdate:modelValue": (r) => e.value = r,
+        label: t.value,
+        icon: "f_save"
+      };
+      return d(Ve, n, () => d(ns));
+    }
+    return () => s();
   }
 });
-function po() {
-  const { freeServer: e, paidServer: t } = vs();
-  return ys({ freeServer: e, paidServer: t });
+function bo() {
+  const { freeServer: e, paidServer: t } = Cs();
+  return Es({ freeServer: e, paidServer: t });
 }
-const mo = Symbol.for("activity-tracking"), fo = ["nude", "muscle", "smooth"];
-function ho() {
-  const e = A(), t = me(), s = xt(mo, null), { getThumbnail: i } = po();
+const yo = Symbol.for("activity-tracking"), So = ["nude", "muscle", "smooth"];
+function xo() {
+  const e = M(), t = fe(), s = Ze(yo, null), { getThumbnail: n } = bo();
   return { skins: C(() => {
-    const n = e.setUuid, o = e.selected, l = {};
+    const i = e.setUuid, o = e.selected, c = {};
     return Object.values(t.models).forEach((a) => {
-      !(a != null && a.slug) || l[a.slug] || (l[a.slug] = a);
-    }), fo.filter((a) => l[a]).map((a) => {
-      const u = l[a];
+      !(a != null && a.slug) || c[a.slug] || (c[a.slug] = a);
+    }), So.filter((a) => c[a]).map((a) => {
+      const u = c[a];
       return {
         id: u.id,
         slug: a,
         name: a,
-        imageUrl: n ? i({ type: "sets", uuid: n, image: a }) : null,
+        imageUrl: i ? n({ type: "sets", uuid: i, image: a }) : null,
         selected: u.id === o,
         click: () => {
-          e.selected = u.id, s == null || s.trackEvent(Ts, { value: a });
+          e.selected = u.id, s == null || s.trackEvent(Ps, { value: a });
         }
       };
     });
   }) };
 }
-const go = R({
+const wo = V({
   name: "TdSkinButton",
   props: {
     id: { type: Number, required: !0 },
@@ -2078,7 +2228,7 @@ const go = R({
       margin: "3px",
       marginBottom: e.size === "sm" ? "40px" : "30px"
     }));
-    function i() {
+    function n() {
       const r = {
         class: `td-${e.slug}-button td-skin-button`,
         key: e.id,
@@ -2091,63 +2241,63 @@ const go = R({
         selected: e.selected,
         onClick: () => t("click")
       };
-      return d(Ce, r);
+      return d(me, r);
     }
-    return () => i();
+    return () => n();
   }
-}), ts = R({
+}), rs = V({
   name: "TdSkinsSection",
   props: { size: { type: String, default: "sm" } },
   setup(e) {
-    const { skins: t } = ho(), { lang: s } = W();
-    function i() {
-      const r = t.value.map(
-        (n) => {
-          var o, l;
-          return d(go, {
-            id: n.id,
-            slug: n.slug,
-            label: ((l = (o = s.value.td) == null ? void 0 : o.components.skins.items) == null ? void 0 : l[n.slug]) ?? n.slug,
-            image: n.imageUrl,
-            selected: n.selected,
+    const { skins: t } = xo(), { lang: s } = H();
+    function n() {
+      const r = [d(ft)];
+      return t.value.forEach((i) => {
+        var o, c;
+        r.push(
+          d(wo, {
+            id: i.id,
+            slug: i.slug,
+            label: ((c = (o = s.value.td) == null ? void 0 : o.components.skins.items) == null ? void 0 : c[i.slug]) ?? i.slug,
+            image: i.imageUrl,
+            selected: i.selected,
             size: e.size,
-            onClick: n.click
-          });
-        }
-      );
-      return d($t, {}, () => r);
+            onClick: i.click
+          })
+        );
+      }), d(Jt, {}, () => r);
     }
-    return () => i();
+    return () => n();
   }
-}), bo = R({
+}), Co = V({
   name: "TdSkinsExpansion",
   setup() {
-    const { lang: e } = W(), t = me(), { expanded: s } = oe({
-      options: ye,
-      tab: ye
-    }), i = C(() => {
-      var l;
-      const o = (l = t.model) == null ? void 0 : l.slug;
-      return !!o && o !== qt;
+    const { lang: e } = H(), t = fe(), { expanded: s } = Z({
+      options: xe,
+      tab: xe
+    }), n = C(() => {
+      var c;
+      const o = (c = t.model) == null ? void 0 : c.slug;
+      return !!o && o !== Wt;
     }), r = C(() => {
       var o;
       return (o = e.value.td) == null ? void 0 : o.components.skins.title;
     });
-    function n() {
+    function i() {
       const o = {
         class: "td-skins-expansion",
         "data-cy": "td-skins-expansion",
         modelValue: s.value,
-        "onUpdate:modelValue": (l) => s.value = l,
+        "onUpdate:modelValue": (c) => s.value = c,
         label: r.value,
-        selected: i.value,
+        selected: n.value,
         icon: "f_shirt"
       };
-      return d(We, o, () => d(ts, { size: "sm", class: "q-py-sm" }));
+      return d(Ve, o, () => d(rs, { size: "sm", class: "q-py-sm" }));
     }
-    return () => n();
+    return () => i();
   }
-}), ss = R({
+}), Eo = V({
   name: "TdButtons",
   props: {
     modelValue: { type: Number, default: 0 },
@@ -2160,131 +2310,145 @@ const go = R({
   },
   emits: ["click", "update:modelValue"],
   setup(e, { slots: t, emit: s }) {
-    const i = Mt(), r = Dt(), n = ct(), o = Ve(), l = fe(), a = ut(), { changed: u } = $(n), { changed: p } = $(o), { changed: D } = $(l), { changed: w } = $(a), h = C(() => !(u.value || p.value || D.value || w.value));
-    function f() {
-      n.reset(), o.reset(), l.reset(), a.reset(), i.applyFromStore(), r.applyFromStore();
+    const n = At(), r = Bt(), i = pt(), o = Fe(), c = he(), a = mt(), { changed: u } = N(i), { changed: p } = N(o), { changed: P } = N(c), { changed: w } = N(a), m = C(() => !(u.value || p.value || P.value || w.value));
+    function g() {
+      i.reset(), o.reset(), c.reset(), a.reset(), n.applyFromStore(), r.applyFromStore();
     }
-    const S = (y) => y.preventDefault();
-    function E() {
-      const T = {
+    const y = (v) => v.preventDefault();
+    function x() {
+      const k = {
         style: C(() => e.fixed ? "position: fixed;bottom: 0; left: 0; right: 0;border-top: 1px solid var(--grey-300)" : ""),
         class: "row justify-center items-center q-pa-md"
-      }, P = {
+      }, R = {
         class: "td-reset-button",
         label: "Reset All",
-        onClick: f,
-        onKeyup: S,
+        onClick: g,
+        onKeyup: y,
         rounded: !0,
         unelevated: !0,
         outline: !0,
-        disable: h.value
+        disable: m.value
       };
-      return d("div", T, [d(Ut, P)]);
+      return d("div", k, [d(qt, R)]);
     }
-    return () => E();
+    return () => x();
   }
-}), vo = R({
+}), is = V({
+  name: "TdPoseButtonsSection",
+  setup() {
+    const e = Symbol.for("PoseButtonsSection"), t = Ze(e, null);
+    function s() {
+      const n = {
+        class: "td-pose-buttons-section"
+      }, r = [];
+      return t && r.push(d(t)), d("div", n, r);
+    }
+    return () => s();
+  }
+}), Io = V({
   name: "TdExpansions",
   setup(e, { slots: t, emit: s }) {
-    function i() {
+    function n() {
       return d("div", {
         class: "td-expansions",
-        onClick: (n) => n.stopPropagation(),
+        onClick: (i) => i.stopPropagation(),
         style: "padding-bottom: 60px; position: relative "
       }, [
-        // h(TsPoseButtonsSection),
-        d(Ie),
-        d(bo),
-        d(Ie),
-        d(ao),
-        d(Ie),
-        d(lo),
-        d(Ie),
-        d(co),
-        d(Ie),
+        d(is),
+        d(ve),
+        d(Co),
+        d(ve),
+        d(mo),
+        d(ve),
+        d(fo),
+        d(ve),
+        d(ho),
+        d(ve),
         // h(TsGridExpansion),
         // h(QSeparator),
         // h(TsAdjustmentExpansion),
-        d(uo),
-        d(Ie),
+        d(go),
+        d(ve),
+        d(vo),
+        d(ve),
         // h('div', {}, store.loading.percent),
-        d(ss)
+        d(Eo)
       ]);
     }
-    return () => i();
+    return () => n();
   }
-}), yo = R({
+}), Do = V({
   name: "TdColorsButton",
   props: { size: String },
   setup(e, {}) {
-    const t = Ee(), s = A(), i = C(() => (s == null ? void 0 : s.hasAccess("grd")) || !1), { lang: r } = W(), n = C(() => {
+    const t = ke(), s = M(), n = C(() => (s == null ? void 0 : s.hasAccess("grd")) || !1), { lang: r } = H(), i = C(() => {
       var p;
       return (p = r.value.td) == null ? void 0 : p.controls.colors.iconTitle;
-    }), { click: o, selected: l } = oe({
+    }), { click: o, selected: c } = Z({
       store: t,
-      options: se,
-      tab: se
+      options: oe,
+      tab: oe
     });
     function a(p) {
       return s.block(p);
     }
     function u() {
       const p = {
-        hasAccess: i.value,
-        selected: l.value,
+        hasAccess: n.value,
+        selected: c.value,
         onClick: o,
         onBlockAccess: a,
         size: e.size,
-        "data-id": se,
+        "data-id": oe,
         name: "colors",
         type: "none",
         icon: "f_palette",
-        label: n.value
+        label: i.value
       };
-      return d(Ce, p, () => []);
+      return d(me, p, () => []);
     }
     return () => u();
   }
-}), So = R({
+}), ko = V({
   name: "TdGridButton",
   props: { size: String },
   setup(e, {}) {
-    const t = Ee(), s = A(), i = C(() => (s == null ? void 0 : s.hasAccess("grd")) || !1), { lang: r } = W(), n = C(() => {
+    const t = ke(), s = M(), n = C(() => (s == null ? void 0 : s.hasAccess("grd")) || !1), { lang: r } = H(), i = C(() => {
       var p;
       return (p = r.value.td) == null ? void 0 : p.controls.grid.iconTitle;
-    }), { click: o, selected: l } = oe({
+    }), { click: o, selected: c } = Z({
       store: t,
-      options: Se,
-      tab: Se
+      options: we,
+      tab: we
     });
     function a(p) {
       return s.block(p);
     }
     function u() {
       const p = {
-        hasAccess: i.value,
-        selected: l.value,
+        hasAccess: n.value,
+        selected: c.value,
         onClick: o,
         onBlockAccess: a,
         size: e.size,
-        "data-id": Se,
+        "data-id": we,
         name: "grid",
         type: "none",
         icon: "f_grid",
-        label: n.value
+        label: i.value
       };
-      return d(Ce, p, () => []);
+      return d(me, p, () => []);
     }
     return () => u();
   }
-}), xo = R({
+}), To = V({
   name: "TdLightsButton",
   props: { size: String },
   setup(e, {}) {
-    const t = Ee(), s = A(), i = C(() => (s == null ? void 0 : s.hasAccess("grd")) || !1), { lang: r } = W(), n = C(() => {
+    const t = ke(), s = M(), n = C(() => (s == null ? void 0 : s.hasAccess("grd")) || !1), { lang: r } = H(), i = C(() => {
       var p;
       return (p = r.value.td) == null ? void 0 : p.controls.lights.iconTitle;
-    }), { click: o, selected: l } = oe({
+    }), { click: o, selected: c } = Z({
       store: t,
       options: de,
       tab: de
@@ -2294,8 +2458,8 @@ const go = R({
     }
     function u() {
       const p = {
-        hasAccess: i.value,
-        selected: l.value,
+        hasAccess: n.value,
+        selected: c.value,
         onClick: o,
         onBlockAccess: a,
         size: e.size,
@@ -2303,190 +2467,242 @@ const go = R({
         name: "lights",
         type: "none",
         icon: "f_bulb_light",
-        label: n.value
+        label: i.value
       };
-      return d(Ce, p, () => []);
+      return d(me, p, () => []);
     }
     return () => u();
   }
-}), Co = R({
+}), Mo = V({
   name: "TsAdjustmentsButton",
   props: { size: String },
   setup(e, {}) {
-    const t = A(), { lang: s } = W(), i = C(() => {
+    const t = M(), { lang: s } = H(), n = C(() => {
       var a;
       return (a = s.value.td) == null ? void 0 : a.controls.related.iconTitle;
-    }), { click: r, selected: n } = oe({
-      options: xe,
-      tab: xe
+    }), { click: r, selected: i } = Z({
+      options: Ce,
+      tab: Ce
     });
     function o(a) {
       return t.block(a);
     }
-    function l() {
+    function c() {
       const a = {
         hasAccess: !0,
-        selected: n.value,
+        selected: i.value,
         onClick: r,
         onBlockAccess: o,
-        "data-id": xe,
+        "data-id": Ce,
         size: e.size,
         name: "related",
         icon: "f_related",
         type: "none",
-        label: i.value
+        label: n.value
       };
-      return d(Ce, a, () => []);
+      return d(me, a, () => []);
     }
-    return () => l();
+    return () => c();
   }
-}), wo = R({
-  name: "TsDefaultDrawer",
+}), Ao = V({
+  name: "TdSavedButton",
+  props: { size: String },
+  setup(e) {
+    const t = M(), { lang: s } = H(), n = C(
+      () => {
+        var a, u;
+        return ((u = (a = s.value.td) == null ? void 0 : a.controls.saved) == null ? void 0 : u.iconTitle) || "Saved";
+      }
+    ), { click: r, selected: i } = Z({
+      options: Ee,
+      tab: Ee
+    });
+    function o(a) {
+      return t.block(a);
+    }
+    function c() {
+      const a = {
+        hasAccess: !0,
+        selected: i.value,
+        onClick: r,
+        onBlockAccess: o,
+        "data-id": Ee,
+        size: e.size,
+        name: "saved",
+        icon: "f_save",
+        type: "none",
+        label: n.value
+      };
+      return d(me, a, () => []);
+    }
+    return () => c();
+  }
+}), Bo = V({
+  name: "TdDefaultDrawer",
   props: {},
   emits: ["click"],
-  setup(e, { slots: t, emit: s }) {
-    const i = A(), r = "q-ma-xs";
-    function n(o) {
+  setup() {
+    const e = M(), t = "q-ma-xs";
+    function s(n) {
       return {
-        class: r,
+        class: t,
         size: "sm",
-        onClick: () => i.setActive(o)
+        onClick: () => e.setActive(n)
       };
     }
     return () => d(
-      Pe,
-      { name: Nt },
+      De,
+      { name: lt },
       {
-        default: () => d($t, {}, () => [
-          d(yo, n(se)),
-          d(So, n(Se)),
-          d(xo, n(de)),
-          d(Co, n(xe))
+        default: () => d(Jt, {}, () => [
+          d(Do, s(oe)),
+          d(ko, s(we)),
+          d(To, s(de)),
+          d(Mo, s(Ce)),
+          d(Ao, s(Ee))
         ]),
-        secondary: () => d(ss, { fixed: !1 })
+        secondary: () => d(is)
       }
     );
   }
-}), Eo = R({
+}), zo = V({
   name: "TdGridDrawer",
   setup(e, { slots: t, emit: s }) {
-    const { lang: i } = W(), r = C(() => {
+    const { lang: n } = H(), r = C(() => {
       var o;
-      return (o = i.value.td) == null ? void 0 : o.controls.grid.title;
+      return (o = n.value.td) == null ? void 0 : o.controls.grid.title;
     });
-    function n() {
+    function i() {
       const o = {
         class: "td-grid-drawer",
-        name: Se,
+        name: we,
         label: r.value
       };
-      return d(Pe, o, () => d(Qt));
+      return d(De, o, () => d(ts));
     }
-    return () => n();
+    return () => i();
   }
-}), Io = R({
+}), Po = V({
   name: "TdRelatedDrawer",
   setup(e, { slots: t, emit: s }) {
-    const { lang: i } = W(), r = C(() => {
+    const { lang: n } = H(), r = C(() => {
       var o;
-      return (o = i.value.td) == null ? void 0 : o.controls.related.title;
+      return (o = n.value.td) == null ? void 0 : o.controls.related.title;
     });
-    function n() {
+    function i() {
       const o = {
         class: "td-related-drawer",
-        name: xe,
+        name: Ce,
         label: r.value
       };
-      return d(Pe, o, () => d(es));
+      return d(De, o, () => d(os));
     }
-    return () => n();
+    return () => i();
+  }
+}), Lo = V({
+  name: "TdSavedDrawer",
+  setup() {
+    const { lang: e } = H(), t = C(() => {
+      var n, r;
+      return ((r = (n = e.value.td) == null ? void 0 : n.controls.saved) == null ? void 0 : r.title) || "Saved";
+    });
+    function s() {
+      const n = {
+        class: "td-saved-drawer",
+        name: Ee,
+        label: t.value
+      };
+      return d(De, n, () => d(ns));
+    }
+    return () => s();
   }
-}), Mo = R({
+}), Ro = V({
   name: "TdLightsDrawer",
   setup(e, { slots: t, emit: s }) {
-    const { lang: i } = W(), r = C(() => {
+    const { lang: n } = H(), r = C(() => {
       var o;
-      return (o = i.value.td) == null ? void 0 : o.controls.lights.title;
+      return (o = n.value.td) == null ? void 0 : o.controls.lights.title;
     });
-    function n() {
+    function i() {
       const o = {
         class: "td-lights-drawer",
         name: de,
         label: r.value
       };
-      return d(Pe, o, () => d(Jt));
+      return d(De, o, () => d(ss));
     }
-    return () => n();
+    return () => i();
   }
-}), Do = R({
+}), Vo = V({
   name: "TdLightsDrawer",
   setup(e, { slots: t, emit: s }) {
-    const { lang: i } = W(), r = C(() => {
+    const { lang: n } = H(), r = C(() => {
       var o;
-      return (o = i.value.td) == null ? void 0 : o.controls.colors.title;
+      return (o = n.value.td) == null ? void 0 : o.controls.colors.title;
     });
-    function n() {
+    function i() {
       const o = {
         class: "td-colors-drawer",
-        name: se,
+        name: oe,
         label: r.value
       };
-      return d(Pe, o, () => d(Yt));
+      return d(De, o, () => d(es));
     }
-    return () => n();
+    return () => i();
   }
-}), To = R({
+}), Fo = V({
   name: "TdSkinsDrawer",
   setup() {
-    const { lang: e } = W(), { expanded: t } = oe({
-      options: ye,
-      tab: ye
+    const { lang: e } = H(), { expanded: t } = Z({
+      options: xe,
+      tab: xe
     }), s = C(() => {
       var r;
       return (r = e.value.td) == null ? void 0 : r.controls.skins.title;
     });
-    function i() {
+    function n() {
       const r = {
         class: "td-skins-drawer",
-        name: ye,
+        name: xe,
         label: s.value,
         modelValue: t.value,
-        "onUpdate:modelValue": (n) => t.value = n
+        "onUpdate:modelValue": (i) => t.value = i
       };
-      return d(Pe, r, () => d(ts));
+      return d(De, r, () => d(rs));
     }
-    return () => i();
+    return () => n();
   }
-}), ko = R({
+}), _o = V({
   name: "TsDrawers",
   setup(e, { slots: t, emit: s }) {
-    const i = A(), r = C({
-      get: () => i.active,
-      set: (o) => i.setActive(o)
+    const n = M(), r = C({
+      get: () => n.active,
+      set: (o) => n.setActive(o)
     });
-    function n() {
+    function i() {
       const o = {
         modelValue: r.value,
-        "onUpdate:modelValue": (l) => r.value = l
+        "onUpdate:modelValue": (c) => r.value = c
       };
-      return d(hs, o, () => [
-        d(wo),
-        d(To),
-        d(Mo),
-        d(Do),
-        d(Eo),
-        d(Io)
+      return d(Ss, o, () => [
+        d(Bo),
+        d(Fo),
+        d(Ro),
+        d(Vo),
+        d(zo),
+        d(Po),
+        d(Lo)
       ]);
     }
-    return () => n();
+    return () => i();
   }
-}), No = /* @__PURE__ */ Object.assign({
+}), Qo = /* @__PURE__ */ Object.assign({
   name: "TdPage",
   slug: "td-page",
   inheritAttrs: !1
 }, {
   __name: "TdPage",
-  props: /* @__PURE__ */ ds({
+  props: /* @__PURE__ */ vs({
     id: Number
   }, {
     miniState: { type: Boolean },
@@ -2494,41 +2710,41 @@ const go = R({
   }),
   emits: ["update:miniState"],
   setup(e) {
-    const t = e, s = Symbol.for("activity-tracking"), i = A(), r = xt(s, null), n = C(() => Number(t.id)), o = ls(e, "miniState"), l = (a) => {
-      a && (r == null || r.trackEvent(Ds, {
-        glb_id: i.selected || null,
+    const t = e, s = Symbol.for("activity-tracking"), n = M(), r = Ze(s, null), i = C(() => Number(t.id)), o = fs(e, "miniState"), c = (a) => {
+      a && (r == null || r.trackEvent(zs, {
+        glb_id: n.selected || null,
         base_pose_id: a
       }));
     };
-    return jt(async () => {
-      r && (await r.beginExplore(), r.trackEvent(Ms, { from: null, to: "3d" }), i.basePoseId && (r.beginSegment(String(i.basePoseId)), l(i.basePoseId)));
-    }), O(
-      () => i.basePoseId,
+    return $t(async () => {
+      r && (await r.beginExplore(), r.trackEvent(Bs, { from: null, to: "3d" }), n.basePoseId && (r.beginSegment(String(n.basePoseId)), c(n.basePoseId)));
+    }), j(
+      () => n.basePoseId,
       (a, u) => {
-        !a || a === u || (r == null || r.beginSegment(String(a)), l(a));
+        !a || a === u || (r == null || r.beginSegment(String(a)), c(a));
       }
-    ), cs(() => {
-      i.setActive(ms.is.mobile ? Nt : se), r == null || r.end();
-    }), (a, u) => (nt(), mt(ft(gs), {
+    ), hs(() => {
+      n.setActive(Ct.is.mobile ? lt : oe), r == null || r.end();
+    }), (a, u) => (at(), vt(bt(xs), {
       class: "three-dimension-page",
       miniState: o.value,
       "onUpdate:miniState": u[0] || (u[0] = (p) => o.value = p),
       "no-drawer-padding": !0,
       title: "3D Viewer"
     }, {
-      toolDrawer: ht(() => [
-        a.$q.platform.is.mobile ? vt("", !0) : (nt(), mt(ft(vo), { key: 0 }))
+      toolDrawer: yt(() => [
+        a.$q.platform.is.mobile ? wt("", !0) : (at(), vt(bt(Io), { key: 0 }))
       ]),
-      bottomDrawer: ht(() => [
-        a.$q.platform.is.mobile ? (nt(), mt(ft(ko), { key: 0 })) : vt("", !0)
+      bottomDrawer: yt(() => [
+        a.$q.platform.is.mobile ? (at(), vt(bt(_o), { key: 0 })) : wt("", !0)
       ]),
-      default: ht(() => [
-        us(io, { id: n.value }, null, 8, ["id"])
+      default: yt(() => [
+        gs(po, { id: i.value }, null, 8, ["id"])
       ]),
       _: 1
     }, 8, ["miniState"]));
   }
-}), Ao = [
+}), Go = [
   "#141111",
   "#3E251E",
   "#633C30",
@@ -2569,28 +2785,28 @@ const go = R({
   "#BDACA8",
   "#DACDC9",
   "#E5E4E3"
-], Ho = Xe("3d-fbxs", {
+], en = Ye("3d-fbxs", {
   state: () => ({
     models: {},
     loadingUrl: null,
-    palette: Ao
+    palette: Go
   }),
   getters: {
     changed(e) {
-      var i, r, n, o, l;
-      const s = A().selected;
-      return console.log("fbx model", (i = e.models) == null ? void 0 : i[s]), (n = (r = e.models) == null ? void 0 : r[s]) != null && n.color ? ((l = (o = e.models) == null ? void 0 : o[s]) == null ? void 0 : l.color) !== 16777215 : !1;
+      var n, r, i, o, c;
+      const s = M().selected;
+      return console.log("fbx model", (n = e.models) == null ? void 0 : n[s]), (i = (r = e.models) == null ? void 0 : r[s]) != null && i.color ? ((c = (o = e.models) == null ? void 0 : o[s]) == null ? void 0 : c.color) !== 16777215 : !1;
     },
     selectedId() {
-      return A().selected;
+      return M().selected;
     },
     poseId(e) {
-      var i, r;
-      const s = A().selected;
-      return (r = (i = e.models) == null ? void 0 : i[s]) == null ? void 0 : r.poseId;
+      var n, r;
+      const s = M().selected;
+      return (r = (n = e.models) == null ? void 0 : n[s]) == null ? void 0 : r.poseId;
     },
     model(e) {
-      const s = A().selected;
+      const s = M().selected;
       return s && e.models[s] ? e.models[s] : null;
     },
     url() {
@@ -2612,32 +2828,32 @@ const go = R({
   },
   actions: {
     resetColor() {
-      const t = A().selected;
+      const t = M().selected;
       this.models[t].color = 16777215;
     },
     setBounds(e) {
-      const s = A().selected;
-      this.models[s].bounds = Ht(e);
+      const s = M().selected;
+      this.models[s].bounds = Kt(e);
     },
     setSubjectsFromResponse(e) {
       const t = e.entities.fbx;
       this.models = { ...this.models, ...t };
     },
     setColorHex(e) {
-      const s = A().selected;
-      this.models[s].color = Ye(e);
+      const s = M().selected;
+      this.models[s].color = et(e);
     }
   }
 });
 export {
-  No as TdPage,
-  A as use3dStore,
-  It as useColorsStore,
-  ct as useControlsStore,
-  Ho as useFBXStore,
-  me as useGLBStore,
-  Ee as useGridStore,
-  Ve as useGroundStore,
-  fe as useLightsStore,
-  ut as useSceneStore
+  Qo as TdPage,
+  M as use3dStore,
+  Mt as useColorsStore,
+  pt as useControlsStore,
+  en as useFBXStore,
+  fe as useGLBStore,
+  ke as useGridStore,
+  Fe as useGroundStore,
+  he as useLightsStore,
+  mt as useSceneStore
 };