layershift 0.6.0 → 0.8.0

package/dist/npm/layershift.es.js

@@ -1,4 +1,130 @@
-class Vt {
+const lt = new Uint8Array([76, 83, 70, 84]), At = 4, ie = 22, re = At + ie, se = 1, oe = 0, ae = 1, le = 3;
+function ue(s) {
+  return s.byteLength < At ? !1 : s[0] === lt[0] && s[1] === lt[1] && s[2] === lt[2] && s[3] === lt[3];
+}
+function ce(s) {
+  let t = At;
+  const e = s.getUint16(t, !0);
+  t += 2;
+  const n = s.getUint32(t, !0);
+  t += 4;
+  const i = s.getFloat32(t, !0);
+  t += 4;
+  const r = s.getUint16(t, !0);
+  t += 2;
+  const o = s.getUint16(t, !0);
+  t += 2;
+  const l = s.getUint16(t, !0);
+  return { version: e, frameCount: n, fps: i, width: r, height: o, signalsPresent: l };
+}
+function he(s) {
+  let t = 0, e = s;
+  for (; e; )
+    t += e & 1, e >>>= 1;
+  return t;
+}
+function fe(s, t) {
+  const e = [];
+  let n = re;
+  for (let i = 0; i < t; i++) {
+    const r = s.getUint16(n, !0);
+    n += 2;
+    const o = s.getUint32(n, !0);
+    n += 4;
+    const l = s.getUint32(n, !0);
+    n += 4;
+    const a = o + l * 4294967296, h = s.getUint32(n, !0);
+    n += 4;
+    const c = s.getUint32(n, !0);
+    n += 4;
+    const f = h + c * 4294967296, u = s.getUint32(n, !0);
+    n += 4;
+    const v = s.getUint8(n);
+    n += 1;
+    const p = s.getUint8(n);
+    n += 1, n += 6, e.push({ signalId: r, dataOffset: a, dataLength: f, frameStride: u, encoding: v, channels: p });
+  }
+  return e;
+}
+function de(s) {
+  const t = s >>> 15 & 1, e = s >>> 10 & 31, n = s & 1023;
+  if (e === 31)
+    return n === 0 ? t ? -1 / 0 : 1 / 0 : NaN;
+  if (e === 0) {
+    const r = n / 1024 * 6103515625e-14;
+    return t ? -r : r;
+  }
+  const i = (1 + n / 1024) * Math.pow(2, e - 15);
+  return t ? -i : i;
+}
+function me(s) {
+  const t = de(s);
+  return Number.isNaN(t) || t <= 0 ? 0 : t >= 1 ? 255 : t * 255 + 0.5 | 0;
+}
+function pe(s, t, e) {
+  const n = new Uint8Array(e);
+  for (let i = 0; i < e; i++) {
+    const r = s.getUint16(t + i * 2, !0);
+    n[i] = me(r);
+  }
+  return n;
+}
+async function ge(s) {
+  const t = new DecompressionStream("deflate-raw"), e = t.writable.getWriter();
+  e.write(s), e.close();
+  const n = t.readable.getReader(), i = [];
+  for (; ; ) {
+    const { done: a, value: h } = await n.read();
+    if (a) break;
+    i.push(h);
+  }
+  const r = i.reduce((a, h) => a + h.byteLength, 0), o = new Uint8Array(r);
+  let l = 0;
+  for (const a of i)
+    o.set(a, l), l += a.byteLength;
+  return o;
+}
+async function ve(s, t, e, n) {
+  const i = new DataView(s.buffer, s.byteOffset, s.byteLength), r = ce(i), o = he(r.signalsPresent), a = fe(i, o).find((p) => p.signalId === se);
+  if (!a)
+    throw new Error(
+      `LSFT file does not contain a depth signal (signals_present: 0x${r.signalsPresent.toString(16).padStart(4, "0")})`
+    );
+  const h = t ?? r.width, c = e ?? r.height, f = n ?? r.fps, u = h * c, v = [];
+  if (a.encoding === le) {
+    const p = s.subarray(
+      a.dataOffset,
+      a.dataOffset + a.dataLength
+    ), d = await ge(p);
+    for (let S = 0; S < r.frameCount; S++) {
+      const E = S * a.frameStride;
+      v.push(d.slice(E, E + a.frameStride));
+    }
+  } else if (a.encoding === oe)
+    for (let p = 0; p < r.frameCount; p++) {
+      const d = a.dataOffset + p * a.frameStride;
+      v.push(s.slice(d, d + a.frameStride));
+    }
+  else if (a.encoding === ae)
+    for (let p = 0; p < r.frameCount; p++) {
+      const d = a.dataOffset + p * a.frameStride;
+      v.push(pe(i, d, u));
+    }
+  else
+    throw new Error(`Unsupported depth encoding: ${a.encoding}`);
+  return {
+    width: h,
+    height: c,
+    fps: f,
+    frameCount: r.frameCount,
+    frames: v,
+    metadata: {
+      version: r.version,
+      signalsPresent: r.signalsPresent
+    }
+  };
+}
+class Ht {
   constructor(t) {
     this.depthData = t;
     const e = t.width * t.height;
@@ -10,7 +136,7 @@ class Vt {
   lastNextFrameIndex = -1;
   lastLerpFactor = -1;
   sample(t) {
-    const e = ne(t * this.depthData.fps, 0, this.depthData.frameCount - 1), n = Math.floor(e), i = Math.min(n + 1, this.depthData.frameCount - 1), r = e - n, o = n !== this.lastFrameIndex || i !== this.lastNextFrameIndex, l = Math.abs(r - this.lastLerpFactor) > 1e-3;
+    const e = Te(t * this.depthData.fps, 0, this.depthData.frameCount - 1), n = Math.floor(e), i = Math.min(n + 1, this.depthData.frameCount - 1), r = e - n, o = n !== this.lastFrameIndex || i !== this.lastNextFrameIndex, l = Math.abs(r - this.lastLerpFactor) > 1e-3;
     if (!o && !l)
       return this.uint8Output;
     this.lastFrameIndex = n, this.lastNextFrameIndex = i, this.lastLerpFactor = r;
@@ -20,49 +146,42 @@ class Vt {
     return this.uint8Output;
   }
 }
-async function kt(s, t = 512, e = 512, n = 5, i) {
-  const r = await te(s);
-  return ee(r, t, e, n);
+async function Nt(s, t = 512, e = 512, n = 5, i) {
+  const r = await xe(s);
+  if (!ue(r))
+    throw new Error(
+      "Unsupported depth data format. Expected LSFT (.lsb) file. Use the layershift precompute CLI to produce LSFT-format files."
+    );
+  return await ve(r, t !== 512 ? t : void 0, e !== 512 ? e : void 0, n !== 5 ? n : void 0);
 }
-async function te(s, t) {
+async function xe(s, t) {
   const e = await fetch(s);
   if (!e.ok)
     throw new Error(`Failed to fetch depth data (${e.status} ${e.statusText}).`);
+  if ((e.headers.get("content-type") ?? "").includes("text/html"))
+    throw new Error(
+      `Depth data URL returned HTML instead of binary data. The file may not exist at "${s}". Check the URL and server configuration.`
+    );
   e.headers.get("content-length");
-  const n = e.body;
-  if (!n)
+  const i = e.body;
+  if (!i)
     return new Uint8Array(await e.arrayBuffer());
-  const i = [];
-  let r = 0;
-  const o = n.getReader();
+  const r = [];
+  let o = 0;
+  const l = i.getReader();
   for (; ; ) {
-    const { done: h, value: c } = await o.read();
-    if (h)
+    const { done: c, value: f } = await l.read();
+    if (c)
       break;
-    c && (i.push(c), r += c.byteLength);
-  }
-  const l = new Uint8Array(r);
-  let a = 0;
-  for (const h of i)
-    l.set(h, a), a += h.byteLength;
-  return l;
-}
-function ee(s, t, e, n) {
-  const i = t * e;
-  if (i === 0)
-    throw new Error("Depth frame dimensions must be non-zero.");
-  if (s.byteLength % i !== 0)
-    throw new Error(
-      `Depth data byte length (${s.byteLength}) is not evenly divisible by frame size (${i} = ${t}×${e}).`
-    );
-  const r = s.byteLength / i, o = new Array(r);
-  for (let l = 0; l < r; l += 1) {
-    const a = l * i;
-    o[l] = s.subarray(a, a + i);
+    f && (r.push(f), o += f.byteLength);
   }
-  return { width: t, height: e, fps: n, frameCount: r, frames: o };
+  const a = new Uint8Array(o);
+  let h = 0;
+  for (const c of r)
+    a.set(c, h), h += c.byteLength;
+  return a;
 }
-function X(s, t) {
+function N(s, t) {
   const e = new Uint8Array(s * t);
   return e.fill(128), {
     width: s,
@@ -72,10 +191,10 @@ function X(s, t) {
     frames: [e]
   };
 }
-function ne(s, t, e) {
+function Te(s, t, e) {
   return Math.min(e, Math.max(t, s));
 }
-const ie = {
+const Ee = {
   parallaxStrength: 0.05,
   contrastLow: 0.05,
   contrastHigh: 0.95,
@@ -85,11 +204,11 @@ const ie = {
   pomSteps: 16,
   overscanPadding: 0.08
 };
-function re(s, t, e) {
+function be(s, t, e) {
   const n = new Float32Array(256);
   if (s.length === 0 || t <= 0 || e <= 0)
-    return Pt(n);
-  const i = oe(s.length), r = t * e;
+    return Ft(n);
+  const i = ye(s.length), r = t * e;
   let o = 0;
   const l = new Uint32Array(256);
   for (const m of i) {
@@ -99,7 +218,7 @@ function re(s, t, e) {
     o += w;
   }
   if (o === 0)
-    return Pt(n);
+    return Ft(n);
   const a = 1 / o;
   for (let m = 0; m < 256; m += 1)
     n[m] = l[m] * a;
@@ -107,33 +226,33 @@ function re(s, t, e) {
   h[0] = n[0];
   for (let m = 1; m < 256; m += 1)
     h[m] = h[m - 1] + n[m];
-  const c = nt(h, 0.05), f = nt(h, 0.25), u = nt(h, 0.5), x = nt(h, 0.75), p = nt(h, 0.95);
+  const c = nt(h, 0.05), f = nt(h, 0.25), u = nt(h, 0.5), v = nt(h, 0.75), p = nt(h, 0.95);
   let d = 0;
   for (let m = 0; m < 256; m += 1)
     d += m / 255 * n[m];
-  let y = 0;
+  let S = 0;
   for (let m = 0; m < 256; m += 1) {
     const T = m / 255 - d;
-    y += n[m] * T * T;
+    S += n[m] * T * T;
   }
-  const b = Math.sqrt(y), E = p - c, g = x - f, v = ae(n);
+  const E = Math.sqrt(S), b = p - c, g = v - f, x = we(n);
   return {
     mean: d,
-    stdDev: b,
+    stdDev: E,
     p5: c,
     p25: f,
     median: u,
-    p75: x,
+    p75: v,
     p95: p,
-    effectiveRange: E,
+    effectiveRange: b,
     iqr: g,
-    bimodality: v,
+    bimodality: x,
     histogram: n
   };
 }
-function se(s) {
+function Se(s) {
   if (s.effectiveRange < 0.05 || s.stdDev < 0.02)
-    return { ...ie };
+    return { ...Ee };
   const t = s.effectiveRange - 0.5, e = s.bimodality - 0.4, n = H(
     0.05 - t * 0.03 + e * 0.01,
     0.035,
@@ -150,7 +269,7 @@ function se(s) {
     overscanPadding: f
   };
 }
-function oe(s) {
+function ye(s) {
   if (s <= 0) return [];
   if (s === 1) return [0];
   const t = s - 1, e = [
@@ -170,13 +289,13 @@ function nt(s, t) {
       return e / 255;
   return 1;
 }
-function ae(s) {
+function we(s) {
   const t = new Float32Array(256);
   for (let u = 0; u < 256; u += 1) {
-    let x = 0, p = 0;
+    let v = 0, p = 0;
     for (let d = u - 2; d <= u + 2; d += 1)
-      d >= 0 && d < 256 && (x += s[d], p += 1);
-    t[u] = x / p;
+      d >= 0 && d < 256 && (v += s[d], p += 1);
+    t[u] = v / p;
   }
   let e = 0;
   for (let u = 0; u < 256; u += 1)
@@ -185,7 +304,7 @@ function ae(s) {
   const n = e * 2, i = 25, r = [];
   for (let u = 1; u < 255; u += 1)
     t[u] > t[u - 1] && t[u] > t[u + 1] && t[u] >= n && r.push({ bin: u, height: t[u] });
-  if (t[0] > t[1] && t[0] >= n && r.push({ bin: 0, height: t[0] }), t[255] > t[254] && t[255] >= n && r.push({ bin: 255, height: t[255] }), r.sort((u, x) => x.height - u.height), r.length < 2) return 0;
+  if (t[0] > t[1] && t[0] >= n && r.push({ bin: 0, height: t[0] }), t[255] > t[254] && t[255] >= n && r.push({ bin: 255, height: t[255] }), r.sort((u, v) => v.height - u.height), r.length < 2) return 0;
   const o = r[0];
   let l = null;
   for (let u = 1; u < r.length; u += 1)
@@ -201,7 +320,7 @@ function ae(s) {
   const f = Math.min(o.height, l.height);
   return f <= 0 ? 0 : H(1 - c / f, 0, 1);
 }
-function Pt(s) {
+function Ft(s) {
   return {
     mean: 0,
     stdDev: 0,
@@ -229,7 +348,7 @@ ${i}`);
   }
   return n;
 }
-function mt(s, t, e) {
+function pt(s, t, e) {
   const n = s.createProgram();
   if (!n) throw new Error("Failed to create program.");
   if (s.attachShader(n, t), s.attachShader(n, e), s.linkProgram(n), !s.getProgramParameter(n, s.LINK_STATUS)) {
@@ -239,13 +358,13 @@ ${i}`);
   }
   return s.detachShader(n, t), s.detachShader(n, e), s.deleteShader(t), s.deleteShader(e), n;
 }
-function pt(s, t, e) {
+function gt(s, t, e) {
   const n = {};
   for (const i of e)
     n[i] = s.getUniformLocation(t, i);
   return n;
 }
-const le = new Float32Array([
+const Re = new Float32Array([
   -1,
   -1,
   1,
@@ -255,16 +374,16 @@ const le = new Float32Array([
   1,
   1
 ]);
-function Ot(s, t) {
+function Xt(s, t) {
   const e = s.createVertexArray();
   if (!e) throw new Error("Failed to create VAO.");
   s.bindVertexArray(e);
   const n = s.createBuffer();
-  s.bindBuffer(s.ARRAY_BUFFER, n), s.bufferData(s.ARRAY_BUFFER, le, s.STATIC_DRAW);
+  s.bindBuffer(s.ARRAY_BUFFER, n), s.bufferData(s.ARRAY_BUFFER, Re, s.STATIC_DRAW);
   const i = s.getAttribLocation(t, "aPosition");
   return s.enableVertexAttribArray(i), s.vertexAttribPointer(i, 2, s.FLOAT, !1, 0, 0), s.bindVertexArray(null), e;
 }
-class Ht {
+class Gt {
   slots = /* @__PURE__ */ new Map();
   nextUnit = 0;
   /**
@@ -300,8 +419,8 @@ class Ht {
     return this.slots.size;
   }
 }
-function O(s, t, e, n, i) {
-  const r = G(s, s.VERTEX_SHADER, e), o = G(s, s.FRAGMENT_SHADER, n), l = mt(s, r, o), a = pt(s, l, i);
+function k(s, t, e, n, i) {
+  const r = G(s, s.VERTEX_SHADER, e), o = G(s, s.FRAGMENT_SHADER, n), l = pt(s, r, o), a = gt(s, l, i);
   return {
     name: t,
     program: l,
@@ -311,8 +430,8 @@ function O(s, t, e, n, i) {
     }
   };
 }
-function Dt(s, t, e, n, i, r) {
-  const o = G(s, s.VERTEX_SHADER, e), l = G(s, s.FRAGMENT_SHADER, n), a = mt(s, o, l), h = pt(s, a, i), c = {
+function Ct(s, t, e, n, i, r) {
+  const o = G(s, s.VERTEX_SHADER, e), l = G(s, s.FRAGMENT_SHADER, n), a = pt(s, o, l), h = gt(s, a, i), c = {
     texture: null,
     unit: r.textureUnit,
     attachment: s.COLOR_ATTACHMENT0
@@ -324,12 +443,12 @@ function Dt(s, t, e, n, i, r) {
     outputs: [c],
     width: 0,
     height: 0,
-    resize(u, x, p) {
-      f.fbo && u.deleteFramebuffer(f.fbo), c.texture && u.deleteTexture(c.texture), f.width = x, f.height = p, c.texture = u.createTexture(), u.activeTexture(u.TEXTURE0 + c.unit), u.bindTexture(u.TEXTURE_2D, c.texture), u.texParameteri(u.TEXTURE_2D, u.TEXTURE_MIN_FILTER, u.LINEAR), u.texParameteri(u.TEXTURE_2D, u.TEXTURE_MAG_FILTER, u.LINEAR), u.texParameteri(u.TEXTURE_2D, u.TEXTURE_WRAP_S, u.CLAMP_TO_EDGE), u.texParameteri(u.TEXTURE_2D, u.TEXTURE_WRAP_T, u.CLAMP_TO_EDGE), u.texImage2D(
+    resize(u, v, p) {
+      f.fbo && u.deleteFramebuffer(f.fbo), c.texture && u.deleteTexture(c.texture), f.width = v, f.height = p, c.texture = u.createTexture(), u.activeTexture(u.TEXTURE0 + c.unit), u.bindTexture(u.TEXTURE_2D, c.texture), u.texParameteri(u.TEXTURE_2D, u.TEXTURE_MIN_FILTER, u.LINEAR), u.texParameteri(u.TEXTURE_2D, u.TEXTURE_MAG_FILTER, u.LINEAR), u.texParameteri(u.TEXTURE_2D, u.TEXTURE_WRAP_S, u.CLAMP_TO_EDGE), u.texParameteri(u.TEXTURE_2D, u.TEXTURE_WRAP_T, u.CLAMP_TO_EDGE), u.texImage2D(
         u.TEXTURE_2D,
         0,
         r.internalFormat,
-        x,
+        v,
         p,
         0,
         r.format,
@@ -349,7 +468,7 @@ function Dt(s, t, e, n, i, r) {
   };
   return r.width > 0 && r.height > 0 && f.resize(s, r.width, r.height), f;
 }
-const ue = {
+const Ae = {
   high: {
     dprCap: 2,
     depthMaxDim: 512,
@@ -372,7 +491,7 @@ const ue = {
     jfaDivisor: 4
   }
 };
-function ce(s) {
+function Pe(s) {
   let t = "unknown";
   const e = s.getExtension("WEBGL_debug_renderer_info");
   e && (t = s.getParameter(e.UNMASKED_RENDERER_WEBGL) || "unknown");
@@ -387,7 +506,7 @@ function ce(s) {
     isMobile: a && h
   };
 }
-const he = [
+const De = [
   "mali-4",
   "mali-t",
   "adreno 3",
@@ -400,7 +519,7 @@ const he = [
   "llvmpipe",
   "swiftshader",
   "software"
-], fe = [
+], Fe = [
   "nvidia",
   "geforce",
   "radeon rx",
@@ -412,16 +531,16 @@ const he = [
   "mali-g7",
   "mali-g6"
 ];
-function de(s) {
+function Ce(s) {
   let t = 0;
-  const e = s.gpuRenderer.toLowerCase(), n = he.some((r) => e.includes(r)), i = fe.some((r) => e.includes(r));
+  const e = s.gpuRenderer.toLowerCase(), n = De.some((r) => e.includes(r)), i = Fe.some((r) => e.includes(r));
   return n && (t -= 30), i && (t += 20), s.maxTextureSize >= 16384 ? t += 10 : s.maxTextureSize >= 8192 ? t += 5 : s.maxTextureSize <= 4096 && (t -= 15), s.hardwareConcurrency >= 8 ? t += 5 : s.hardwareConcurrency >= 4 ? t += 0 : s.hardwareConcurrency > 0 && s.hardwareConcurrency < 4 && (t -= 10), s.deviceMemory >= 8 ? t += 5 : s.deviceMemory >= 4 ? t += 0 : s.deviceMemory > 0 && s.deviceMemory < 4 && (t -= 15), s.isMobile && (t -= 10), t >= 0 ? "high" : t >= -25 ? "medium" : "low";
 }
-function Xt(s, t) {
-  const e = t && t !== "auto" ? t : de(ce(s));
-  return { tier: e, ...ue[e] };
+function Wt(s, t) {
+  const e = t && t !== "auto" ? t : Ce(Pe(s));
+  return { tier: e, ...Ae[e] };
 }
-class gt {
+class vt {
   static RESIZE_DEBOUNCE_MS = 100;
   // ---- Canvas + container ----
   canvas;
@@ -452,6 +571,11 @@ class gt {
    * The Web Component uses this to dispatch frame events.
    */
   onVideoFrame = null;
+  /**
+   * Optional callback invoked when a render loop error causes the loop to stop.
+   * The Web Component uses this to dispatch error events.
+   */
+  onError = null;
   // ---- Animation & resize ----
   animationFrameHandle = 0;
   /** requestVideoFrameCallback handle (0 = inactive). */
@@ -487,7 +611,26 @@ class gt {
   }
   /** Stop both render loops and release callbacks. */
   stop() {
-    this.animationFrameHandle && (window.cancelAnimationFrame(this.animationFrameHandle), this.animationFrameHandle = 0), this.rvfcHandle && this.mediaSource?.cancelVideoFrameCallback && (this.mediaSource.cancelVideoFrameCallback(this.rvfcHandle), this.rvfcHandle = 0), this.mediaSource = null, this.readDepth = null, this.readInput = null, this.onVideoFrame = null, this.rvfcSupported = !1;
+    this.stopLoops(), this.mediaSource = null, this.readDepth = null, this.readInput = null, this.onVideoFrame = null, this.rvfcSupported = !1;
+  }
+  /**
+   * Pause the render loops without releasing callbacks.
+   * The loops can be resumed with `resume()`.
+   */
+  pause() {
+    this.stopLoops();
+  }
+  /** Resume render loops previously paused with `pause()`. */
+  resume() {
+    this.readInput && (this.animationFrameHandle || (this.rvfcSupported && this.mediaSource?.requestVideoFrameCallback && (this.rvfcHandle = this.mediaSource.requestVideoFrameCallback(this._videoFrameLoop)), this.animationFrameHandle = window.requestAnimationFrame(this._rafLoop)));
+  }
+  /** Whether the render loops are currently paused. */
+  get isPaused() {
+    return this.animationFrameHandle === 0 && this.readInput !== null;
+  }
+  /** Cancel animation loops without clearing callbacks. */
+  stopLoops() {
+    this.animationFrameHandle && (window.cancelAnimationFrame(this.animationFrameHandle), this.animationFrameHandle = 0), this.rvfcHandle && this.mediaSource?.cancelVideoFrameCallback && (this.mediaSource.cancelVideoFrameCallback(this.rvfcHandle), this.rvfcHandle = 0);
   }
   /** Stop rendering and release all GPU resources. */
   dispose() {
@@ -508,7 +651,14 @@ class gt {
    * Delegates to subclass `onRenderFrame()` for the actual render work.
    */
   _rafLoop = () => {
-    this.animationFrameHandle = window.requestAnimationFrame(this._rafLoop), this.onRenderFrame();
+    this.animationFrameHandle = window.requestAnimationFrame(this._rafLoop);
+    try {
+      this.onRenderFrame();
+    } catch (t) {
+      this.stopLoops();
+      const e = t instanceof Error ? t : new Error(String(t));
+      console.error("Layershift: render loop stopped due to error.", e), this.onError && this.onError(e);
+    }
   };
   /**
    * RVFC callback — fires only when the browser presents a new video frame.
@@ -516,10 +666,17 @@ class gt {
    */
   _videoFrameLoop = (t, e) => {
     const n = this.mediaSource;
-    if (!n || !n.requestVideoFrameCallback) return;
-    this.rvfcHandle = n.requestVideoFrameCallback(this._videoFrameLoop);
-    const i = e.mediaTime ?? n.currentTime;
-    this.onDepthUpdate(i), this.onVideoFrame && this.onVideoFrame(i, e.presentedFrames ?? 0);
+    if (!(!n || !n.requestVideoFrameCallback)) {
+      this.rvfcHandle = n.requestVideoFrameCallback(this._videoFrameLoop);
+      try {
+        const i = e.mediaTime ?? n.currentTime;
+        this.onDepthUpdate(i), this.onVideoFrame && this.onVideoFrame(i, e.presentedFrames ?? 0);
+      } catch (i) {
+        this.stopLoops();
+        const r = i instanceof Error ? i : new Error(String(i));
+        console.error("Layershift: video frame loop stopped due to error.", r), this.onError && this.onError(r);
+      }
+    }
   };
   // -----------------------------------------------------------------------
   // Context loss handling
@@ -546,7 +703,7 @@ class gt {
   scheduleResizeRecalculate = () => {
     this.resizeTimer !== null && window.clearTimeout(this.resizeTimer), this.resizeTimer = window.setTimeout(() => {
       this.resizeTimer = null, this.recalculateViewportLayout();
-    }, gt.RESIZE_DEBOUNCE_MS);
+    }, vt.RESIZE_DEBOUNCE_MS);
   };
   /** Read the container's pixel dimensions, with a minimum of 1x1. */
   getViewportSize() {
@@ -605,7 +762,7 @@ class gt {
     l /= h, a /= h, this.uvOffset = [(1 - l) / 2, (1 - a) / 2], this.uvScale = [l, a], this.isCameraSource && (this.uvOffset[0] += this.uvScale[0], this.uvScale[0] = -this.uvScale[0]);
   }
 }
-const me = `#version 300 es
+const Ue = `#version 300 es
 in vec2 aPosition;
 
 // UV coordinates for cover-fit + overscan.
@@ -626,7 +783,7 @@ void main() {
   vScreenUv = baseUv;
   gl_Position = vec4(aPosition, 0.0, 1.0);
 }
-`, bt = `#version 300 es
+`, St = `#version 300 es
 in vec2 aPosition;
 out vec2 vUv;
 
@@ -634,7 +791,7 @@ void main() {
   vUv = aPosition * 0.5 + 0.5;
   gl_Position = vec4(aPosition, 0.0, 1.0);
 }
-`, pe = `#version 300 es
+`, Le = `#version 300 es
 precision highp float;
 
 // BILATERAL_RADIUS is injected as a #define at compile time.
@@ -672,7 +829,7 @@ void main() {
 
   fragColor = vec4(totalDepth / totalWeight, 0.0, 0.0, 1.0);
 }
-`, ge = `#version 300 es
+`, _e = `#version 300 es
 precision highp float;
 
 // ---- Uniforms ----
@@ -1059,7 +1216,7 @@ void main() {
 
   fragColor = color;
 }
-`, Ft = `#version 300 es
+`, Ut = `#version 300 es
 precision highp float;
 
 // Separable glow blur — 7-tap box filter.
@@ -1124,18 +1281,18 @@ void main() {
   tiltHalfTanFov: Math.tan(50 * Math.PI / 360),
   tiltTransitionWidth: 0.3 * 4.5,
   tiltPeakIntensity: 0.8
-}, ve = ["uRawDepth", "uTexelSize", "uSpatialSigma2"], xe = {
+}, Ie = ["uRawDepth", "uTexelSize", "uSpatialSigma2"], Me = {
   2: 2.25,
   // 1.5²
   1: 0.5625
   // 0.75²
 };
-function Te(s, t) {
-  const e = pe.replace(
+function Be(s, t) {
+  const e = Le.replace(
     "#version 300 es",
     `#version 300 es
 #define BILATERAL_RADIUS ${t}`
-  ), n = G(s, s.VERTEX_SHADER, bt), i = G(s, s.FRAGMENT_SHADER, e), r = mt(s, n, i), o = pt(s, r, ve), l = xe[t] ?? 2.25;
+  ), n = G(s, s.VERTEX_SHADER, St), i = G(s, s.FRAGMENT_SHADER, e), r = pt(s, n, i), o = gt(s, r, Ie), l = Me[t] ?? 2.25;
   let a = null;
   const h = {
     name: "bilateral-filter",
@@ -1147,16 +1304,16 @@ function Te(s, t) {
     height: 0,
     resize(c, f, u) {
     },
-    initFBO(c, f, u, x) {
-      a && c.deleteFramebuffer(a), h.width = u, h.height = x, a = c.createFramebuffer(), h.fbo = a, c.bindFramebuffer(c.FRAMEBUFFER, a), c.framebufferTexture2D(
+    initFBO(c, f, u, v) {
+      a && c.deleteFramebuffer(a), h.width = u, h.height = v, a = c.createFramebuffer(), h.fbo = a, c.bindFramebuffer(c.FRAMEBUFFER, a), c.framebufferTexture2D(
         c.FRAMEBUFFER,
         c.COLOR_ATTACHMENT0,
         c.TEXTURE_2D,
         f,
         0
-      ), c.bindFramebuffer(c.FRAMEBUFFER, null), c.useProgram(r), c.uniform1i(o.uRawDepth, 2), c.uniform2f(o.uTexelSize, 1 / u, 1 / x), c.uniform1f(o.uSpatialSigma2, l);
+      ), c.bindFramebuffer(c.FRAMEBUFFER, null), c.useProgram(r), c.uniform1i(o.uRawDepth, 2), c.uniform2f(o.uTexelSize, 1 / u, 1 / v), c.uniform1f(o.uSpatialSigma2, l);
     },
-    execute(c, f, u, x, p, d, y, b) {
+    execute(c, f, u, v, p, d, S, E) {
       a && (c.activeTexture(c.TEXTURE2), c.bindTexture(c.TEXTURE_2D, u), c.texSubImage2D(
         c.TEXTURE_2D,
         0,
@@ -1166,8 +1323,8 @@ function Te(s, t) {
         d,
         c.RED,
         c.UNSIGNED_BYTE,
-        x
-      ), c.bindFramebuffer(c.FRAMEBUFFER, a), c.viewport(0, 0, p, d), c.useProgram(r), c.bindVertexArray(f), c.drawArrays(c.TRIANGLE_STRIP, 0, 4), c.bindFramebuffer(c.FRAMEBUFFER, null), c.viewport(0, 0, y, b));
+        v
+      ), c.bindFramebuffer(c.FRAMEBUFFER, a), c.viewport(0, 0, p, d), c.useProgram(r), c.bindVertexArray(f), c.drawArrays(c.TRIANGLE_STRIP, 0, 4), c.bindFramebuffer(c.FRAMEBUFFER, null), c.viewport(0, 0, S, E));
     },
     dispose(c) {
       a && (c.deleteFramebuffer(a), a = null, h.fbo = null), c.deleteProgram(r);
@@ -1175,7 +1332,7 @@ function Te(s, t) {
   };
   return h;
 }
-const Ee = [
+const Ve = [
   "uImage",
   "uDepth",
   "uOffset",
@@ -1214,13 +1371,13 @@ const Ee = [
   "uTiltPeakIntensity",
   "uTiltPlaneNormal",
   "uTiltPlaneD"
-], be = 64;
-function Se(s) {
-  const t = ge.replace(
+], Oe = 64;
+function ke(s) {
+  const t = _e.replace(
     "#version 300 es",
     `#version 300 es
-#define MAX_POM_STEPS ${be}`
-  ), e = G(s, s.VERTEX_SHADER, me), n = G(s, s.FRAGMENT_SHADER, t), i = mt(s, e, n), r = pt(s, i, Ee);
+#define MAX_POM_STEPS ${Oe}`
+  ), e = G(s, s.VERTEX_SHADER, Ue), n = G(s, s.FRAGMENT_SHADER, t), i = pt(s, e, n), r = gt(s, i, Ve);
   return {
     name: "depth-effect",
     program: i,
@@ -1236,7 +1393,7 @@ function Se(s) {
     }
   };
 }
-class ye extends gt {
+class He extends vt {
   // ---- Shared GPU resources ----
   gl = null;
   quadVao = null;
@@ -1244,7 +1401,7 @@ class ye extends gt {
   bilateralPass = null;
   effectPass = null;
   // ---- Texture registry (init-time allocation, zero per-frame overhead) ----
-  textures = new Ht();
+  textures = new Gt();
   videoSlot;
   filteredDepthSlot;
   rawDepthSlot;
@@ -1295,7 +1452,7 @@ class ye extends gt {
       powerPreference: "high-performance"
     });
     if (!n) throw new Error("WebGL 2 is not supported.");
-    this.gl = n, this.qualityParams = Xt(n, e.quality), "drawingBufferColorSpace" in n && (n.drawingBufferColorSpace = "srgb"), n.clearColor(0, 0, 0, 1), n.pixelStorei(n.UNPACK_FLIP_Y_WEBGL, !0), this.initGPUResources(), this.setupResizeHandling();
+    this.gl = n, this.qualityParams = Wt(n, e.quality), "drawingBufferColorSpace" in n && (n.drawingBufferColorSpace = "srgb"), n.clearColor(0, 0, 0, 1), n.pixelStorei(n.UNPACK_FLIP_Y_WEBGL, !0), this.initGPUResources(), this.setupResizeHandling();
   }
   /**
    * Set up the scene: create video texture, depth textures + FBO, and
@@ -1374,8 +1531,8 @@ class ye extends gt {
   initGPUResources() {
     const t = this.gl;
     if (!t) return;
-    this.bilateralPass = Te(t, this.qualityParams.bilateralRadius), this.effectPass = Se(t);
-    const e = Ft.replace(
+    this.bilateralPass = Be(t, this.qualityParams.bilateralRadius), this.effectPass = ke(t);
+    const e = Ut.replace(
       "#version 300 es",
       `#version 300 es
 #define PASS_HORIZONTAL`
@@ -1387,10 +1544,10 @@ class ye extends gt {
       "uGlowRadius",
       "uBlurDir"
     ];
-    this.glowBlurHPass = Dt(
+    this.glowBlurHPass = Ct(
       t,
       "glow-blur-h",
-      bt,
+      St,
       e,
       n,
       {
@@ -1401,11 +1558,11 @@ class ye extends gt {
         width: 0,
         height: 0
       }
-    ), this.glowBlurVPass = Dt(
+    ), this.glowBlurVPass = Ct(
       t,
       "glow-blur-v",
-      bt,
-      Ft,
+      St,
+      Ut,
       n,
       {
         internalFormat: t.R8,
@@ -1415,7 +1572,7 @@ class ye extends gt {
         width: 0,
         height: 0
       }
-    ), this.quadVao = Ot(t, this.effectPass.program), t.disable(t.DEPTH_TEST);
+    ), this.quadVao = Xt(t, this.effectPass.program), t.disable(t.DEPTH_TEST);
   }
   // -----------------------------------------------------------------------
   // Curve LUT texture management
@@ -1536,15 +1693,15 @@ class ye extends gt {
     t && (this.bilateralPass && (this.bilateralPass.dispose(t), this.bilateralPass = null), this.effectPass && (this.effectPass.dispose(t), this.effectPass = null), this.glowBlurHPass && (this.glowBlurHPass.dispose(t), this.glowBlurHPass = null), this.glowBlurVPass && (this.glowBlurVPass.dispose(t), this.glowBlurVPass = null), this.quadVao && (t.deleteVertexArray(this.quadVao), this.quadVao = null));
   }
 }
-async function ht(s, t = {}) {
+async function ft(s, t = {}) {
   const {
     parent: e = document.body,
     loop: n = !0,
     muted: i = !0
   } = t, r = document.createElement("video");
-  return r.crossOrigin = "anonymous", r.setAttribute("crossorigin", "anonymous"), r.playsInline = !0, r.setAttribute("playsinline", ""), r.setAttribute("webkit-playsinline", "true"), r.muted = i, r.defaultMuted = i, i && r.setAttribute("muted", ""), r.loop = n, r.preload = "auto", r.style.display = "none", r.src = s, e.appendChild(r), await Gt(r), new we(r);
+  return r.crossOrigin = "anonymous", r.setAttribute("crossorigin", "anonymous"), r.playsInline = !0, r.setAttribute("playsinline", ""), r.setAttribute("webkit-playsinline", "true"), r.muted = i, r.defaultMuted = i, i && r.setAttribute("muted", ""), r.loop = n, r.preload = "auto", r.style.display = "none", r.src = s, e.appendChild(r), await qt(r), new Ne(r);
 }
-class we {
+class Ne {
   constructor(t) {
     this.video = t;
   }
@@ -1590,7 +1747,7 @@ class we {
     this.video.pause(), this.video.removeAttribute("src"), this.video.load(), this.video.remove();
   }
 }
-async function ft(s, t = {}) {
+async function dt(s, t = {}) {
   const e = new Image();
   return e.crossOrigin = "anonymous", e.src = s, await new Promise((n, i) => {
     if (e.complete && e.naturalWidth > 0) {
@@ -1598,9 +1755,9 @@ async function ft(s, t = {}) {
       return;
     }
     e.addEventListener("load", () => n(), { once: !0 }), e.addEventListener("error", () => i(new Error(`Failed to load image: ${s}`)), { once: !0 });
-  }), new Re(e);
+  }), new Xe(e);
 }
-class Re {
+class Xe {
   constructor(t) {
     this.img = t;
   }
@@ -1622,11 +1779,11 @@ class Re {
     this.img.removeAttribute("src");
   }
 }
-async function Nt(s = { video: !0 }, t = {}) {
+async function zt(s = { video: !0 }, t = {}) {
   const { parent: e = document.body } = t, n = await navigator.mediaDevices.getUserMedia(s), i = document.createElement("video");
-  return i.playsInline = !0, i.setAttribute("playsinline", ""), i.muted = !0, i.defaultMuted = !0, i.style.display = "none", i.srcObject = n, e.appendChild(i), await Gt(i), await i.play(), new Ae(i, n);
+  return i.playsInline = !0, i.setAttribute("playsinline", ""), i.muted = !0, i.defaultMuted = !0, i.style.display = "none", i.srcObject = n, e.appendChild(i), await qt(i), await i.play(), new Ge(i, n);
 }
-class Ae {
+class Ge {
   constructor(t, e) {
     this.video = t, this.stream = e;
   }
@@ -1672,7 +1829,7 @@ class Ae {
       t.stop();
   }
 }
-async function Gt(s) {
+async function qt(s) {
   s.readyState >= HTMLMediaElement.HAVE_METADATA || await new Promise((t, e) => {
     const n = () => {
       r(), t();
@@ -1684,11 +1841,17 @@ async function Gt(s) {
     s.addEventListener("loadedmetadata", n), s.addEventListener("error", i), s.load();
   });
 }
+async function Lt(s, t, e) {
+  return s.create(t, {
+    executionProviders: e,
+    graphOptimizationLevel: "disabled"
+  });
+}
 const Z = 518;
-async function Pe() {
+async function We() {
   return await import("onnxruntime-web/webgpu");
 }
-class De {
+class ze {
   constructor(t, e) {
     this.depthWidth = t, this.depthHeight = e;
     const n = t * e;
@@ -1727,23 +1890,19 @@ class De {
    * (GPU-accelerated on main thread), falls back to WASM EP.
    */
   async init(t, e) {
-    const n = await Pe();
+    const n = await We();
     if (this.ort = n, this.captureCanvas = document.createElement("canvas"), this.captureCanvas.width = Z, this.captureCanvas.height = Z, this.captureCtx = this.captureCanvas.getContext("2d", {
       willReadFrequently: !0
     }), !this.captureCtx)
       throw new Error("[DepthEstimator] Failed to create 2D canvas context.");
     e?.({ receivedBytes: 0, totalBytes: null, fraction: 0, label: "Downloading depth model…" });
-    const i = await Fe(t, e);
+    const i = await qe(t, e);
     e?.({ receivedBytes: i.byteLength, totalBytes: i.byteLength, fraction: 1, label: "Initialising depth model…" });
     let r;
     try {
-      r = await n.InferenceSession.create(i, {
-        executionProviders: ["webgpu"]
-      }), console.log("[DepthEstimator] Using WebGPU execution provider");
+      r = await Lt(n.InferenceSession, i, ["webgpu"]), console.log("[DepthEstimator] Using WebGPU execution provider");
     } catch (o) {
-      console.warn("[DepthEstimator] WebGPU EP unavailable, falling back to WASM:", o), n.env.wasm.proxy = !0, r = await n.InferenceSession.create(i, {
-        executionProviders: ["wasm"]
-      }), console.log("[DepthEstimator] Using WASM execution provider (proxy worker)");
+      console.warn("[DepthEstimator] WebGPU EP unavailable, falling back to WASM:", o), n.env.wasm.proxy = !0, r = await Lt(n.InferenceSession, i, ["wasm"]), console.log("[DepthEstimator] Using WASM execution provider (proxy worker)");
     }
     this.session = r, this.inputName = r.inputNames[0], this.outputName = r.outputNames[0], this.preprocessWorker = new Worker(
       new URL(
@@ -1855,11 +2014,11 @@ class De {
     });
   }
 }
-async function dt(s, t, e, n) {
-  const i = new De(t, e);
+async function mt(s, t, e, n) {
+  const i = new ze(t, e);
   return await i.init(s, n), i;
 }
-async function Fe(s, t) {
+async function qe(s, t) {
   const e = await fetch(s);
   if (!e.ok)
     throw new Error(`[DepthEstimator] Failed to fetch model (${e.status} ${e.statusText}).`);
@@ -1892,12 +2051,12 @@ async function Fe(s, t) {
     h.set(f, c), c += f.byteLength;
   return h.buffer;
 }
-const Ct = {
+const _t = {
   sensitivityX: 0.4,
   sensitivityY: 1,
   lerpFactor: 0.08
 };
-function St(s, t) {
+function yt(s, t) {
   const e = s.points;
   if (e.length === 0) return 0;
   if (e.length === 1 || t <= e[0].x) return e[0].y;
@@ -1918,28 +2077,28 @@ function St(s, t) {
       return i.y + (r.y - i.y) * o;
   }
 }
-function lt(s, t = 256) {
+function ut(s, t = 256) {
   const e = new Uint8Array(t);
   for (let n = 0; n < t; n++) {
     const i = n / (t - 1);
-    e[n] = Math.round(St(s, i) * 255);
+    e[n] = Math.round(yt(s, i) * 255);
   }
   return e;
 }
 function q(s, t) {
   return s.find((e) => e.channel === t && e.enabled);
 }
-function Ut(s, t) {
+function It(s, t) {
   const e = q(s, "displacement"), n = q(s, "blur"), i = q(s, "glow"), r = e?.params;
   let o = 0.6, l = 0;
   if (n) {
     const a = n.curve;
     for (let h = 0; h <= 1; h += 0.01)
-      if (St(a, h) > 0.01) {
+      if (yt(a, h) > 0.01) {
         o = h;
         break;
       }
-    l = St(a, 1);
+    l = yt(a, 1);
   }
   return {
     parallaxStrength: r?.strength ?? 0.05,
@@ -1960,13 +2119,13 @@ function Ut(s, t) {
     tiltPeakIntensity: n?.params?.peakIntensity ?? 0.8
   };
 }
-function Lt(s) {
+function Mt(s) {
   const t = q(s, "displacement"), e = q(s, "blur"), n = q(s, "glow"), i = q(s, "color-shift"), r = i?.params;
   return {
-    displacementLUT: t ? lt(t.curve) : null,
-    blurLUT: e ? lt(e.curve) : null,
-    glowLUT: n ? lt(n.curve) : null,
-    colorShiftLUT: i ? lt(i.curve) : null,
+    displacementLUT: t ? ut(t.curve) : null,
+    blurLUT: e ? ut(e.curve) : null,
+    glowLUT: n ? ut(n.curve) : null,
+    colorShiftLUT: i ? ut(i.curve) : null,
     colorShiftParams: r ? {
       hueShift: r.hueShift ?? 0,
       saturation: r.saturation ?? 1,
@@ -1976,7 +2135,7 @@ function Lt(s) {
     } : null
   };
 }
-class Wt {
+class Yt {
   abortController = null;
   initialized = !1;
   initializing = !1;
@@ -1986,7 +2145,7 @@ class Wt {
   }
   // --- Public API (called from lifecycle callbacks) ---
   onConnected() {
-    this.element.setupShadowDOM(), this.tryInit();
+    this.cancelInit(), this.element.setupShadowDOM(), this.tryInit();
   }
   onDisconnected() {
     this.cancelInit(), this.element.doDispose(), this.initialized = !1;
@@ -2014,12 +2173,10 @@ class Wt {
     const e = new AbortController();
     this.abortController = e, this.initializing = !0;
     try {
-      if (await t.doInit(e.signal), e.signal.aborted) {
-        this.initializing = !1;
-        return;
-      }
+      await t.doInit(e.signal);
     } catch {
-      this.initializing = !1;
+    } finally {
+      this.initialized || (this.initializing = !1);
     }
   }
   cancelInit() {
@@ -2035,15 +2192,15 @@ const z = {
   loop: !0,
   muted: !0
 }, $ = 512, K = 512;
-class xt extends HTMLElement {
+class Tt extends HTMLElement {
   static TAG_NAME = "layershift-effect";
   static get observedAttributes() {
     return [
       "src",
-      "depth-src",
-      "depth-width",
-      "depth-height",
-      "depth-fps",
+      "map-src",
+      "map-width",
+      "map-height",
+      "map-fps",
       "depth-model",
       "source-type",
       "config",
@@ -2059,10 +2216,10 @@ class xt extends HTMLElement {
       "muted"
     ];
   }
-  reinitAttributes = ["src", "depth-src", "depth-width", "depth-height", "depth-fps", "depth-model", "source-type", "config"];
+  reinitAttributes = ["src", "map-src", "map-width", "map-height", "map-fps", "depth-model", "source-type", "config"];
   canInit() {
     if (this.sourceType === "camera") return !0;
-    const t = !!this.getAttribute("src"), e = !!this.getAttribute("depth-src"), n = !!this.getAttribute("depth-model");
+    const t = !!this.getAttribute("src"), e = !!this.getAttribute("map-src"), n = !!this.getAttribute("depth-model");
     return t && (e || n);
   }
   shadow;
@@ -2080,7 +2237,7 @@ class xt extends HTMLElement {
    */
   depthFallback = null;
   constructor() {
-    super(), this.shadow = this.attachShadow({ mode: "open" }), this.lifecycle = new Wt(this);
+    super(), this.shadow = this.attachShadow({ mode: "open" }), this.lifecycle = new Yt(this);
   }
   /** The current input offset. Set this externally to drive the effect. */
   get input() {
@@ -2222,7 +2379,7 @@ class xt extends HTMLElement {
       const i = await n.json();
       return {
         channels: i.channels ?? [],
-        motion: i.motion ?? Ct,
+        motion: i.motion ?? _t,
         overscanPadding: i.overscanPadding ?? 0.05,
         quality: i.quality ?? "auto"
       };
@@ -2258,7 +2415,7 @@ class xt extends HTMLElement {
         this.emit("layershift-effect:model-progress", m);
       };
       if (e) {
-        if (i = await Nt(
+        if (i = await zt(
           { video: { facingMode: "user" } },
           { parent: this.shadow }
         ), t.aborted) {
@@ -2266,27 +2423,27 @@ class xt extends HTMLElement {
           return;
         }
         if (n) {
-          if (o = await dt(n, $, K, l), t.aborted) {
+          if (o = await mt(n, $, K, l), t.aborted) {
             o.dispose(), i.dispose();
             return;
           }
-          r = X($, K);
+          r = N($, K);
         } else
-          r = X(i.width, i.height);
+          r = N(i.width, i.height);
       } else {
-        const m = this.getAttribute("src"), T = this.getAttribute("depth-src"), w = !!T, A = this.sourceType === "image" || /\.(jpe?g|png|webp|gif|avif|bmp)(\?|$)/i.test(m);
+        const m = this.getAttribute("src"), T = this.getAttribute("map-src"), w = !!T, A = this.sourceType === "image" || /\.(jpe?g|png|webp|gif|avif|bmp)(\?|$)/i.test(m);
         if (w) {
           const [P, F] = await Promise.all([
-            A ? ft(m) : ht(m, {
+            A ? dt(m) : ft(m, {
               parent: this.shadow,
               loop: this.shouldLoop,
               muted: this.shouldMute
             }),
-            kt(
+            Nt(
               T,
-              this.getAttrFloat("depth-width", 512),
-              this.getAttrFloat("depth-height", 512),
-              this.getAttrFloat("depth-fps", 5)
+              this.getAttrFloat("map-width", 512),
+              this.getAttrFloat("map-height", 512),
+              this.getAttrFloat("map-fps", 5)
             )
           ]);
           if (t.aborted) {
@@ -2296,12 +2453,12 @@ class xt extends HTMLElement {
           i = P, r = F;
         } else if (n) {
           const [P, F] = await Promise.all([
-            A ? ft(m) : ht(m, {
+            A ? dt(m) : ft(m, {
               parent: this.shadow,
               loop: this.shouldLoop,
               muted: this.shouldMute
             }),
-            dt(n, $, K, l)
+            mt(n, $, K, l)
           ]);
           if (t.aborted) {
             P.dispose(), F.dispose();
@@ -2319,18 +2476,18 @@ class xt extends HTMLElement {
                 frames: [I]
               };
             } else
-              r = X($, K);
+              r = N($, K);
           } else
-            r = X($, K);
+            r = N($, K);
         } else
-          throw new Error("Either depth-src or depth-model must be provided.");
+          throw new Error("Either map-src or depth-model must be provided.");
       }
       this.source = i, this.depthEstimator = o, this.loopCount = 0, this.attachSourceEventListeners(i);
-      const a = re(
+      const a = be(
         r.frames,
         r.width,
         r.height
-      ), h = se(a);
+      ), h = Se(a);
       this.depthFallback = {
         contrastLow: h.contrastLow,
         contrastHigh: h.contrastHigh,
@@ -2340,15 +2497,15 @@ class xt extends HTMLElement {
       if (o)
         c = () => o.getLatestDepth();
       else {
-        const m = new Vt(r);
+        const m = new Ht(r);
         c = (T) => m.sample(T);
       }
       if (t.aborted) return;
-      let f, u = null, x = Ct;
+      let f, u = null, v = _t;
       const p = await this.fetchFilterConfig(t);
       if (t.aborted) return;
       if (p && p.channels.length > 0) {
-        const m = Ut(p.channels, {
+        const m = It(p.channels, {
           contrastLow: h.contrastLow,
           contrastHigh: h.contrastHigh,
           verticalReduction: h.verticalReduction
@@ -2372,37 +2529,39 @@ class xt extends HTMLElement {
           tiltHalfTanFov: m.tiltHalfTanFov,
           tiltTransitionWidth: m.tiltTransitionWidth,
           tiltPeakIntensity: m.tiltPeakIntensity
-        }, u = Lt(p.channels), x = p.motion;
+        }, u = Mt(p.channels), v = p.motion;
       } else
         f = this.buildLegacyConfig(h, i.width);
-      this.renderer = new ye(this.container, f), this.renderer.initialize(i, r.width, r.height), u && this.renderer.updateCurveLUTs(
+      this.renderer = new He(this.container, f), this.renderer.onError = (m) => {
+        this.emit("layershift-effect:error", { message: m.message });
+      }, this.renderer.initialize(i, r.width, r.height), u && this.renderer.updateCurveLUTs(
         u.displacementLUT,
         u.blurLUT,
         u.glowLUT,
         u.colorShiftLUT,
         u.colorShiftParams ?? void 0
       );
-      const d = x.tiltPlaneInput ?? !1, y = x.tiltPitchSensitivity ?? 0.35, b = x.tiltYawSensitivity ?? 0.15, g = p?.channels.find((m) => m.channel === "blur" && m.enabled)?.params?.focalCenter ?? 0.5, v = o;
+      const d = v.tiltPlaneInput ?? !1, S = v.tiltPitchSensitivity ?? 0.35, E = v.tiltYawSensitivity ?? 0.15, g = p?.channels.find((m) => m.channel === "blur" && m.enabled)?.params?.focalCenter ?? 0.5, x = o;
       if (this.renderer.start(
         i,
         c,
         () => {
           const m = this._input;
           if (d) {
-            const A = m.y * y, P = m.x * b, F = Math.cos(A), _ = Math.sin(A), I = Math.cos(P), S = Math.sin(P) * F, D = -_, U = I * F, M = 0.5 + g * (5 - 0.5);
+            const A = m.y * S, P = m.x * E, F = Math.cos(A), _ = Math.sin(A), I = Math.cos(P), y = Math.sin(P) * F, D = -_, U = I * F, M = 0.5 + g * (5 - 0.5);
             return {
               x: m.x * 0.3,
               y: m.y * 0.3,
-              tiltPlaneNormal: [S, D, U],
+              tiltPlaneNormal: [y, D, U],
               tiltPlaneD: U * M
             };
           }
           return { x: m.x, y: m.y };
         },
         (m, T) => {
-          if (v) {
+          if (x) {
             const w = i.getImageSource();
-            w && v.submitFrame(w);
+            w && x.submitFrame(w);
           }
           this.emit("layershift-effect:frame", {
             currentTime: m,
@@ -2421,13 +2580,43 @@ class xt extends HTMLElement {
         duration: i.duration,
         depthProfile: a,
         derivedParams: h,
-        motionConfig: x
+        motionConfig: v
       });
     } catch (i) {
       const r = i instanceof Error ? i.message : "Failed to initialize.";
       console.error("<layershift-effect>: Failed to initialize.", i), this.emit("layershift-effect:error", { message: r });
     }
   }
+  // --- Playback control ---
+  /** Whether the effect is currently paused. */
+  get paused() {
+    return this.renderer ? this.renderer.isPaused : this.source?.paused ?? !0;
+  }
+  /**
+   * Pause the effect: stops the renderer animation loop and pauses the
+   * underlying media source. Dispatches a `layershift-effect:pause` event.
+   */
+  pause() {
+    !this.renderer || this.paused || (this.renderer.pause(), this.source?.pause?.(), this.emit("layershift-effect:pause", {
+      currentTime: this.source?.currentTime ?? 0
+    }));
+  }
+  /**
+   * Resume the effect: restarts the renderer animation loop and plays the
+   * underlying media source. Dispatches a `layershift-effect:play` event.
+   */
+  async play() {
+    if (!(!this.renderer || !this.paused)) {
+      if (this.renderer.resume(), this.source?.play)
+        try {
+          await this.source.play();
+        } catch {
+        }
+      this.emit("layershift-effect:play", {
+        currentTime: this.source?.currentTime ?? 0
+      });
+    }
+  }
   // --- Live config updates ---
   /**
    * Push new channel parameters to the renderer at runtime.
@@ -2444,9 +2633,9 @@ class xt extends HTMLElement {
       contrastLow: 0.05,
       contrastHigh: 0.95,
       verticalReduction: 0.5
-    }, n = Ut(t, e);
+    }, n = It(t, e);
     this.renderer.updateConfig(n);
-    const i = Lt(t);
+    const i = Mt(t);
     this.renderer.updateCurveLUTs(
       i.displacementLUT,
       i.blurLUT,
@@ -2460,7 +2649,7 @@ class xt extends HTMLElement {
     this.renderer?.dispose(), this.renderer = null, this.depthEstimator?.dispose(), this.depthEstimator = null, this.source?.dispose(), this.source = null, this.depthFallback = null, this.loopCount = 0, this.container = null;
   }
 }
-class Rt {
+class Pt {
   gl;
   hasColorBufferFloat;
   // FBO / texture resources
@@ -2511,8 +2700,8 @@ class Rt {
     const r = Math.max(1, Math.round(t / n)), o = Math.max(1, Math.round(e / n));
     this._width = r, this._height = o;
     const l = (h, c, f, u) => {
-      const x = i.createFramebuffer();
-      return i.bindFramebuffer(i.FRAMEBUFFER, x), i.bindTexture(i.TEXTURE_2D, h), i.texStorage2D(i.TEXTURE_2D, 1, c, f, u), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MIN_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MAG_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_S, i.CLAMP_TO_EDGE), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_T, i.CLAMP_TO_EDGE), i.framebufferTexture2D(i.FRAMEBUFFER, i.COLOR_ATTACHMENT0, i.TEXTURE_2D, h, 0), i.bindFramebuffer(i.FRAMEBUFFER, null), x;
+      const v = i.createFramebuffer();
+      return i.bindFramebuffer(i.FRAMEBUFFER, v), i.bindTexture(i.TEXTURE_2D, h), i.texStorage2D(i.TEXTURE_2D, 1, c, f, u), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MIN_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_MAG_FILTER, i.LINEAR), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_S, i.CLAMP_TO_EDGE), i.texParameteri(i.TEXTURE_2D, i.TEXTURE_WRAP_T, i.CLAMP_TO_EDGE), i.framebufferTexture2D(i.FRAMEBUFFER, i.COLOR_ATTACHMENT0, i.TEXTURE_2D, h, 0), i.bindFramebuffer(i.FRAMEBUFFER, null), v;
     };
     this.maskTex = i.createTexture(), this.maskFbo = l(this.maskTex, i.R8, r, o);
     const a = this.hasColorBufferFloat ? i.RG16F : i.RGBA8;
@@ -2535,7 +2724,7 @@ class Rt {
     const n = this._width, i = this._height;
     if (n === 0 || i === 0) return;
     e.viewport(0, 0, n, i), e.disable(e.STENCIL_TEST), e.disable(e.BLEND), e.bindFramebuffer(e.FRAMEBUFFER, this.maskFbo), e.clearColor(0, 0, 0, 1), e.clear(e.COLOR_BUFFER_BIT), e.useProgram(t.maskPass.program), e.uniform2f(t.maskPass.uniforms.uMeshScale, t.meshScaleX, t.meshScaleY), e.bindVertexArray(t.maskVao), e.drawElements(e.TRIANGLES, t.stencilIndexCount, e.UNSIGNED_SHORT, 0), e.bindFramebuffer(e.FRAMEBUFFER, this.pingFbo), e.clearColor(-1, -1, 0, 0), e.clear(e.COLOR_BUFFER_BIT), e.useProgram(t.seedPass.program), e.activeTexture(e.TEXTURE5), e.bindTexture(e.TEXTURE_2D, this.maskTex), e.uniform1i(t.seedPass.uniforms.uMask, 5), e.uniform2f(t.seedPass.uniforms.uTexelSize, 1 / n, 1 / i), e.bindVertexArray(t.quadVao), e.drawArrays(e.TRIANGLE_STRIP, 0, 4);
-    const r = Rt.computeFloodIterations(n, i);
+    const r = Pt.computeFloodIterations(n, i);
     e.useProgram(t.floodPass.program);
     let o = this.pingTex, l = this.pongFbo, a = this.pongTex;
     for (let h = 0; h < r.length; h++) {
@@ -2568,34 +2757,34 @@ class Rt {
     this.maskTex && (t.deleteTexture(this.maskTex), this.maskTex = null), this.maskFbo && (t.deleteFramebuffer(this.maskFbo), this.maskFbo = null), this.pingTex && (t.deleteTexture(this.pingTex), this.pingTex = null), this.pingFbo && (t.deleteFramebuffer(this.pingFbo), this.pingFbo = null), this.pongTex && (t.deleteTexture(this.pongTex), this.pongTex = null), this.pongFbo && (t.deleteFramebuffer(this.pongFbo), this.pongFbo = null), this.distTex && (t.deleteTexture(this.distTex), this.distTex = null), this.distFbo && (t.deleteFramebuffer(this.distFbo), this.distFbo = null), this._width = 0, this._height = 0, this._dirty = !0;
   }
 }
-const Ce = `#version 300 es
+const Ye = `#version 300 es
 in vec2 aPosition;
 uniform vec2 uMeshScale;
 void main() {
   gl_Position = vec4(aPosition * uMeshScale, 0.0, 1.0);
 }
-`, Ue = `#version 300 es
+`, je = `#version 300 es
 precision lowp float;
 out vec4 fragColor;
 void main() { fragColor = vec4(0.0); }
-`, Le = `#version 300 es
+`, Ze = `#version 300 es
 in vec2 aPosition;
 uniform vec2 uMeshScale;
 void main() {
   gl_Position = vec4(aPosition * uMeshScale, 0.0, 1.0);
 }
-`, _e = `#version 300 es
+`, $e = `#version 300 es
 precision lowp float;
 out vec4 fragColor;
 void main() { fragColor = vec4(1.0); }
-`, Ie = `#version 300 es
+`, Ke = `#version 300 es
 in vec2 aPosition;
 out vec2 vUv;
 void main() {
   vUv = aPosition * 0.5 + 0.5;
   gl_Position = vec4(aPosition, 0.0, 1.0);
 }
-`, Me = `#version 300 es
+`, Je = `#version 300 es
 precision highp float;
 uniform sampler2D uMask;
 uniform vec2 uTexelSize;
@@ -2620,14 +2809,14 @@ void main() {
     fragSeed = vec2(-1.0);
   }
 }
-`, Be = `#version 300 es
+`, Qe = `#version 300 es
 in vec2 aPosition;
 out vec2 vUv;
 void main() {
   vUv = aPosition * 0.5 + 0.5;
   gl_Position = vec4(aPosition, 0.0, 1.0);
 }
-`, Ve = `#version 300 es
+`, tn = `#version 300 es
 precision highp float;
 uniform sampler2D uSeedTex;
 uniform float uStepSize;
@@ -2656,14 +2845,14 @@ void main() {
 
   fragSeed = bestSeed;
 }
-`, ke = `#version 300 es
+`, en = `#version 300 es
 in vec2 aPosition;
 out vec2 vUv;
 void main() {
   vUv = aPosition * 0.5 + 0.5;
   gl_Position = vec4(aPosition, 0.0, 1.0);
 }
-`, Oe = `#version 300 es
+`, nn = `#version 300 es
 precision highp float;
 uniform sampler2D uSeedTex;
 uniform sampler2D uMask;
@@ -2688,7 +2877,7 @@ void main() {
   float normalized = clamp(d / max(uBevelWidth, 0.001), 0.0, 1.0);
   fragDist = vec4(normalized, 0.0, 0.0, 1.0);
 }
-`, He = `#version 300 es
+`, rn = `#version 300 es
 in vec2 aPosition;
 uniform vec2 uUvOffset;
 uniform vec2 uUvScale;
@@ -2700,7 +2889,7 @@ void main() {
   vScreenUv = baseUv;
   gl_Position = vec4(aPosition, 0.0, 1.0);
 }
-`, Xe = `#version 300 es
+`, sn = `#version 300 es
 precision highp float;
 
 #define MAX_POM_STEPS 32
@@ -2831,14 +3020,14 @@ void main() {
   // Write lens-transformed depth to second attachment for boundary effects
   fragDepth = vec4(lensD, 0.0, 0.0, 1.0);
 }
-`, Ne = `#version 300 es
+`, on = `#version 300 es
 in vec2 aPosition;
 out vec2 vUv;
 void main() {
   vUv = aPosition * 0.5 + 0.5;
   gl_Position = vec4(aPosition, 0.0, 1.0);
 }
-`, Ge = `#version 300 es
+`, an = `#version 300 es
 precision highp float;
 uniform sampler2D uInteriorColor;
 uniform sampler2D uDistField;
@@ -2868,7 +3057,7 @@ void main() {
 
   fragColor = vec4(toSRGB(linear), color.a);
 }
-`, We = `#version 300 es
+`, ln = `#version 300 es
 in vec2 aPosition;
 in vec2 aNormal;
 uniform float uRimWidth;
@@ -2891,7 +3080,7 @@ void main() {
 
   gl_Position = vec4(pos, 0.0, 1.0);
 }
-`, ze = `#version 300 es
+`, un = `#version 300 es
 precision highp float;
 
 uniform sampler2D uInteriorColor;
@@ -2993,7 +3182,7 @@ void main() {
 
   fragColor = vec4(color * alpha, alpha);
 }
-`, qe = `#version 300 es
+`, cn = `#version 300 es
 in vec2 aPosition;
 in vec3 aNormal3;
 in float aLerpT;      // 0 = inner (at silhouette), 1 = outer edge
@@ -3009,7 +3198,7 @@ void main() {
   vLerpT = aLerpT;
   gl_Position = vec4(sp, 0.0, 1.0);
 }
-`, Ye = `#version 300 es
+`, hn = `#version 300 es
 precision highp float;
 uniform vec3 uLightDir3;
 uniform vec3 uChamferColor;
@@ -3077,7 +3266,7 @@ void main() {
   fragColor = vec4(toSRGB(lit), 1.0);
 }
 `;
-function je(s) {
+function fn(s) {
   const t = [];
   let e = 0;
   for (let n = 0; n < s.length - 2; n += 2) {
@@ -3116,7 +3305,7 @@ function je(s) {
     count: e
   };
 }
-function Ze(s, t, e, n, i) {
+function dn(s, t, e, n, i) {
   if (n <= 0)
     return { vertices: new Float32Array(0), count: 0 };
   const r = i * Math.PI / 180, o = -Math.cos(r), l = Math.sin(r), a = [];
@@ -3125,26 +3314,26 @@ function Ze(s, t, e, n, i) {
     const f = t[c], p = ((c + 1 < t.length ? t[c + 1] : s.length) - f) / 2;
     if (p < 3) continue;
     const d = p - 1;
-    let y = 0;
+    let S = 0;
     for (let T = 0; T < d; T++) {
       const w = f + T * 2, A = s[w], P = s[w + 1], F = s[w + 2], _ = s[w + 3];
-      y += A * _ - F * P;
+      S += A * _ - F * P;
     }
-    const b = y >= 0 ? 1 : -1, E = [], g = [];
+    const E = S >= 0 ? 1 : -1, b = [], g = [];
     for (let T = 0; T < d; T++) {
       const w = f + T * 2, A = s[w + 2] - s[w], P = s[w + 3] - s[w + 1], F = Math.sqrt(A * A + P * P);
-      F < 1e-8 ? (E.push(T > 0 ? E[T - 1] : 0), g.push(T > 0 ? g[T - 1] : 0)) : (E.push(-P / F * b), g.push(A / F * b));
+      F < 1e-8 ? (b.push(T > 0 ? b[T - 1] : 0), g.push(T > 0 ? g[T - 1] : 0)) : (b.push(-P / F * E), g.push(A / F * E));
     }
-    const v = [], m = [];
+    const x = [], m = [];
     for (let T = 0; T < d; T++) {
       const w = (T - 1 + d) % d;
-      let A = E[w] + E[T], P = g[w] + g[T];
+      let A = b[w] + b[T], P = g[w] + g[T];
       const F = Math.sqrt(A * A + P * P);
-      F > 1e-8 ? (A /= F, P /= F) : (A = E[T], P = g[T]), v.push(A), m.push(P);
+      F > 1e-8 ? (A /= F, P /= F) : (A = b[T], P = g[T]), x.push(A), m.push(P);
     }
     for (let T = 0; T < d; T++) {
-      const w = T, A = (T + 1) % d, P = f + T * 2, F = f + (T + 1) % d * 2, _ = s[P], I = s[P + 1], C = s[F], S = s[F + 1], D = v[w] * l, U = m[w] * l, M = o, k = v[A] * l, j = m[A] * l, et = o, at = _ + v[w] * n, At = I + m[w] * n, Jt = C + v[A] * n, Qt = S + m[A] * n;
-      a.push(_, I, D, U, M, 0), a.push(at, At, D, U, M, 1), a.push(C, S, k, j, et, 0), a.push(C, S, k, j, et, 0), a.push(at, At, D, U, M, 1), a.push(Jt, Qt, k, j, et, 1), h += 6;
+      const w = T, A = (T + 1) % d, P = f + T * 2, F = f + (T + 1) % d * 2, _ = s[P], I = s[P + 1], C = s[F], y = s[F + 1], D = x[w] * l, U = m[w] * l, M = o, O = x[A] * l, j = m[A] * l, et = o, at = _ + x[w] * n, Dt = I + m[w] * n, ee = C + x[A] * n, ne = y + m[A] * n;
+      a.push(_, I, D, U, M, 0), a.push(at, Dt, D, U, M, 1), a.push(C, y, O, j, et, 0), a.push(C, y, O, j, et, 0), a.push(at, Dt, D, U, M, 1), a.push(ee, ne, O, j, et, 1), h += 6;
     }
   }
   return {
@@ -3152,7 +3341,7 @@ function Ze(s, t, e, n, i) {
     count: h
   };
 }
-class $e extends gt {
+class mn extends vt {
   gl = null;
   // Render passes (each owns its program + cached uniforms)
   stencilPass = null;
@@ -3174,7 +3363,7 @@ class $e extends gt {
   chamferVao = null;
   chamferVertexCount = 0;
   // Source textures (via TextureRegistry — init-time allocation)
-  textures = new Ht();
+  textures = new Gt();
   videoSlot;
   depthSlot;
   // Interior FBO (units 2, 3)
@@ -3210,7 +3399,7 @@ class $e extends gt {
       powerPreference: "high-performance"
     });
     if (!o) throw new Error("WebGL 2 is not supported.");
-    this.gl = o, this.qualityParams = Xt(o, e.quality), "drawingBufferColorSpace" in o && (o.drawingBufferColorSpace = "srgb"), this.hasColorBufferFloat = !!o.getExtension("EXT_color_buffer_float"), o.clearColor(0, 0, 0, 0), o.pixelStorei(o.UNPACK_FLIP_Y_WEBGL, !0), this.initGPUResources(), this.setupResizeHandling();
+    this.gl = o, this.qualityParams = Wt(o, e.quality), "drawingBufferColorSpace" in o && (o.drawingBufferColorSpace = "srgb"), this.hasColorBufferFloat = !!o.getExtension("EXT_color_buffer_float"), o.clearColor(0, 0, 0, 0), o.pixelStorei(o.UNPACK_FLIP_Y_WEBGL, !0), this.initGPUResources(), this.setupResizeHandling();
   }
   initialize(t, e, n, i) {
     const r = this.gl;
@@ -3244,7 +3433,7 @@ class $e extends gt {
   uploadBoundaryMesh(t) {
     const e = this.gl;
     if (!e || !this.boundaryPass) return;
-    const n = je(t.edgeVertices);
+    const n = fn(t.edgeVertices);
     if (n.count === 0) return;
     this.boundaryVao = e.createVertexArray(), e.bindVertexArray(this.boundaryVao);
     const i = e.createBuffer();
@@ -3257,7 +3446,7 @@ class $e extends gt {
   uploadChamferMesh(t) {
     const e = this.gl;
     if (!e || !this.chamferPass || this.config.chamferWidth <= 0) return;
-    const n = Ze(
+    const n = dn(
       t.edgeVertices,
       t.contourOffsets,
       t.contourIsHole,
@@ -3294,7 +3483,7 @@ class $e extends gt {
   // -----------------------------------------------------------------------
   createJFAResources(t, e) {
     const n = this.gl;
-    n && (this.jfa || (this.jfa = new Rt(n, this.hasColorBufferFloat)), this.jfa.createResources(t, e, this.qualityParams.jfaDivisor));
+    n && (this.jfa || (this.jfa = new Pt(n, this.hasColorBufferFloat)), this.jfa.createResources(t, e, this.qualityParams.jfaDivisor));
   }
   computeDistanceField() {
     !this.jfa || !this.maskPass || !this.jfaSeedPass || !this.jfaFloodPass || !this.jfaDistPass || !this.maskVao || !this.quadVao || this.jfa.compute({
@@ -3315,7 +3504,7 @@ class $e extends gt {
   // -----------------------------------------------------------------------
   initGPUResources() {
     const t = this.gl;
-    t && (this.stencilPass = O(t, "stencil", Ce, Ue, ["uMeshScale"]), this.maskPass = O(t, "mask", Le, _e, ["uMeshScale"]), this.jfaSeedPass = O(t, "jfa-seed", Ie, Me, ["uMask", "uTexelSize"]), this.jfaFloodPass = O(t, "jfa-flood", Be, Ve, ["uSeedTex", "uStepSize"]), this.jfaDistPass = O(t, "jfa-dist", ke, Oe, ["uSeedTex", "uMask", "uBevelWidth"]), this.interiorPass = O(t, "interior", He, Xe, [
+    t && (this.stencilPass = k(t, "stencil", Ye, je, ["uMeshScale"]), this.maskPass = k(t, "mask", Ze, $e, ["uMeshScale"]), this.jfaSeedPass = k(t, "jfa-seed", Ke, Je, ["uMask", "uTexelSize"]), this.jfaFloodPass = k(t, "jfa-flood", Qe, tn, ["uSeedTex", "uStepSize"]), this.jfaDistPass = k(t, "jfa-dist", en, nn, ["uSeedTex", "uMask", "uBevelWidth"]), this.interiorPass = k(t, "interior", rn, sn, [
       "uImage",
       "uDepth",
       "uOffset",
@@ -3336,12 +3525,12 @@ class $e extends gt {
       "uBrightnessBias",
       "uUvOffset",
       "uUvScale"
-    ]), this.compositePass = O(t, "composite", Ne, Ge, [
+    ]), this.compositePass = k(t, "composite", on, an, [
       "uInteriorColor",
       "uDistField",
       "uEdgeOcclusionWidth",
       "uEdgeOcclusionStrength"
-    ]), this.boundaryPass = O(t, "boundary", We, ze, [
+    ]), this.boundaryPass = k(t, "boundary", ln, un, [
       "uInteriorColor",
       "uInteriorDepth",
       "uDistField",
@@ -3358,7 +3547,7 @@ class $e extends gt {
       "uEdgeColor",
       "uLightDir",
       "uBevelIntensity"
-    ]), this.chamferPass = O(t, "chamfer", qe, Ye, [
+    ]), this.chamferPass = k(t, "chamfer", cn, hn, [
       "uMeshScale",
       "uLightDir3",
       "uChamferColor",
@@ -3367,7 +3556,7 @@ class $e extends gt {
       "uChamferShininess",
       "uInteriorColor",
       "uTexelSize"
-    ]), this.quadVao = Ot(t, this.interiorPass.program), t.disable(t.DEPTH_TEST));
+    ]), this.quadVao = Xt(t, this.interiorPass.program), t.disable(t.DEPTH_TEST));
   }
   // -----------------------------------------------------------------------
   // Abstract method implementations (RendererBase)
@@ -3486,51 +3675,51 @@ class $e extends gt {
     this.stencilPass = null, this.maskPass = null, this.jfaSeedPass = null, this.jfaFloodPass = null, this.jfaDistPass = null, this.interiorPass = null, this.compositePass = null, this.boundaryPass = null, this.chamferPass = null, this.quadVao && (t.deleteVertexArray(this.quadVao), this.quadVao = null);
   }
 }
-async function Tt(s) {
+async function Et(s) {
   const t = await fetch(s);
   if (!t.ok)
     throw new Error(`Failed to fetch SVG: ${t.status} ${t.statusText}`);
   const e = await t.text();
-  return Ke(e);
+  return pn(e);
 }
-function Ke(s) {
+function pn(s) {
   const n = new DOMParser().parseFromString(s, "image/svg+xml").querySelector("svg");
   if (!n)
     throw new Error("No <svg> element found in document.");
-  const i = Je(n);
+  const i = gn(n);
   if (i.length === 0)
     throw new Error("No path data found in SVG.");
   let r = 1 / 0, o = 1 / 0, l = -1 / 0, a = -1 / 0;
   for (const C of i)
-    for (let S = 0; S < C.length; S += 2)
-      r = Math.min(r, C[S]), l = Math.max(l, C[S]), o = Math.min(o, C[S + 1]), a = Math.max(a, C[S + 1]);
-  const h = l - r, c = a - o, f = (r + l) / 2, u = (o + a) / 2, x = 2 / Math.max(h, c), p = h / c, d = i.map((C) => {
-    const S = [];
+    for (let y = 0; y < C.length; y += 2)
+      r = Math.min(r, C[y]), l = Math.max(l, C[y]), o = Math.min(o, C[y + 1]), a = Math.max(a, C[y + 1]);
+  const h = l - r, c = a - o, f = (r + l) / 2, u = (o + a) / 2, v = 2 / Math.max(h, c), p = h / c, d = i.map((C) => {
+    const y = [];
     for (let D = 0; D < C.length; D += 2)
-      S.push((C[D] - f) * x), S.push(-((C[D + 1] - u) * x));
-    return S;
-  }), y = an(d), b = [], E = [];
-  for (const C of y) {
-    const { flatCoords: S, holeIndices: D } = on(C), U = ln(S, D), M = b.length / 2;
-    for (const k of U)
-      E.push(k + M);
-    for (const k of S)
-      b.push(k);
-  }
-  const g = b, v = E, m = [], T = [], w = [], A = zt(d);
+      y.push((C[D] - f) * v), y.push(-((C[D + 1] - u) * v));
+    return y;
+  }), S = wn(d), E = [], b = [];
+  for (const C of S) {
+    const { flatCoords: y, holeIndices: D } = yn(C), U = Rn(y, D), M = E.length / 2;
+    for (const O of U)
+      b.push(O + M);
+    for (const O of y)
+      E.push(O);
+  }
+  const g = E, x = b, m = [], T = [], w = [], A = jt(d);
   for (let C = 0; C < d.length; C++) {
-    const S = d[C];
+    const y = d[C];
     T.push(m.length), w.push(A[C]);
-    for (let D = 0; D < S.length; D++)
-      m.push(S[D]);
-    S.length >= 2 && m.push(S[0], S[1]);
+    for (let D = 0; D < y.length; D++)
+      m.push(y[D]);
+    y.length >= 2 && m.push(y[0], y[1]);
   }
   let P = 1 / 0, F = 1 / 0, _ = -1 / 0, I = -1 / 0;
   for (let C = 0; C < g.length; C += 2)
     P = Math.min(P, g[C]), _ = Math.max(_, g[C]), F = Math.min(F, g[C + 1]), I = Math.max(I, g[C + 1]);
   return {
     vertices: new Float32Array(g),
-    indices: new Uint16Array(v),
+    indices: new Uint16Array(x),
     edgeVertices: new Float32Array(m),
     contourOffsets: T,
     contourIsHole: w,
@@ -3538,35 +3727,35 @@ function Ke(s) {
     aspect: p
   };
 }
-function Je(s) {
+function gn(s) {
   const t = [];
   return s.querySelectorAll("path").forEach((a) => {
     const h = a.getAttribute("d");
     if (!h) return;
-    const c = en(h);
+    const c = Tn(h);
     t.push(...c);
   }), s.querySelectorAll("polygon").forEach((a) => {
     const h = a.getAttribute("points");
     if (!h) return;
-    const c = _t(h);
+    const c = Bt(h);
     c.length >= 6 && t.push(c);
   }), s.querySelectorAll("polyline").forEach((a) => {
     const h = a.getAttribute("points");
     if (!h) return;
-    const c = _t(h);
+    const c = Bt(h);
     c.length >= 6 && t.push(c);
   }), s.querySelectorAll("rect").forEach((a) => {
     const h = parseFloat(a.getAttribute("x") || "0"), c = parseFloat(a.getAttribute("y") || "0"), f = parseFloat(a.getAttribute("width") || "0"), u = parseFloat(a.getAttribute("height") || "0");
     f > 0 && u > 0 && t.push([h, c, h + f, c, h + f, c + u, h, c + u]);
   }), s.querySelectorAll("circle").forEach((a) => {
     const h = parseFloat(a.getAttribute("cx") || "0"), c = parseFloat(a.getAttribute("cy") || "0"), f = parseFloat(a.getAttribute("r") || "0");
-    f > 0 && t.push(Qe(h, c, f));
+    f > 0 && t.push(vn(h, c, f));
   }), s.querySelectorAll("ellipse").forEach((a) => {
     const h = parseFloat(a.getAttribute("cx") || "0"), c = parseFloat(a.getAttribute("cy") || "0"), f = parseFloat(a.getAttribute("rx") || "0"), u = parseFloat(a.getAttribute("ry") || "0");
-    f > 0 && u > 0 && t.push(tn(h, c, f, u));
+    f > 0 && u > 0 && t.push(xn(h, c, f, u));
   }), t;
 }
-function _t(s) {
+function Bt(s) {
   const t = [], e = s.trim().split(/[\s,]+/);
   for (let n = 0; n < e.length - 1; n += 2) {
     const i = parseFloat(e[n]), r = parseFloat(e[n + 1]);
@@ -3574,7 +3763,7 @@ function _t(s) {
   }
   return t;
 }
-function Qe(s, t, e, n = 64) {
+function vn(s, t, e, n = 64) {
   const i = [];
   for (let r = 0; r < n; r++) {
     const o = 2 * Math.PI * r / n;
@@ -3582,7 +3771,7 @@ function Qe(s, t, e, n = 64) {
   }
   return i;
 }
-function tn(s, t, e, n, i = 64) {
+function xn(s, t, e, n, i = 64) {
   const r = [];
   for (let o = 0; o < i; o++) {
     const l = 2 * Math.PI * o / i;
@@ -3590,24 +3779,24 @@ function tn(s, t, e, n, i = 64) {
   }
   return r;
 }
-function en(s) {
+function Tn(s) {
   const t = [];
   let e = [], n = 0, i = 0, r = 0, o = 0, l = 0, a = 0, h = "";
-  const c = nn(s);
+  const c = En(s);
   let f = 0;
   function u() {
     return f >= c.length ? 0 : parseFloat(c[f++]);
   }
   for (; f < c.length; ) {
-    const x = c[f];
+    const v = c[f];
     let p;
-    /^[a-zA-Z]$/.test(x) ? (p = x, f++) : p = h === "M" ? "L" : h === "m" ? "l" : h;
+    /^[a-zA-Z]$/.test(v) ? (p = v, f++) : p = h === "M" ? "L" : h === "m" ? "l" : h;
     const d = p === p.toLowerCase();
     switch (p.toUpperCase()) {
       case "M": {
         e.length > 0 && t.push(e), e = [];
-        const b = u() + (d ? n : 0), E = u() + (d ? i : 0);
-        n = b, i = E, r = b, o = E, e.push(n, i), l = n, a = i;
+        const E = u() + (d ? n : 0), b = u() + (d ? i : 0);
+        n = E, i = b, r = E, o = b, e.push(n, i), l = n, a = i;
         break;
       }
       case "L": {
@@ -3623,28 +3812,28 @@ function en(s) {
         break;
       }
       case "C": {
-        const b = u() + (d ? n : 0), E = u() + (d ? i : 0), g = u() + (d ? n : 0), v = u() + (d ? i : 0), m = u() + (d ? n : 0), T = u() + (d ? i : 0);
-        it(e, n, i, b, E, g, v, m, T), n = m, i = T, l = g, a = v;
+        const E = u() + (d ? n : 0), b = u() + (d ? i : 0), g = u() + (d ? n : 0), x = u() + (d ? i : 0), m = u() + (d ? n : 0), T = u() + (d ? i : 0);
+        it(e, n, i, E, b, g, x, m, T), n = m, i = T, l = g, a = x;
         break;
       }
       case "S": {
-        const b = 2 * n - l, E = 2 * i - a, g = u() + (d ? n : 0), v = u() + (d ? i : 0), m = u() + (d ? n : 0), T = u() + (d ? i : 0);
-        it(e, n, i, b, E, g, v, m, T), n = m, i = T, l = g, a = v;
+        const E = 2 * n - l, b = 2 * i - a, g = u() + (d ? n : 0), x = u() + (d ? i : 0), m = u() + (d ? n : 0), T = u() + (d ? i : 0);
+        it(e, n, i, E, b, g, x, m, T), n = m, i = T, l = g, a = x;
         break;
       }
       case "Q": {
-        const b = u() + (d ? n : 0), E = u() + (d ? i : 0), g = u() + (d ? n : 0), v = u() + (d ? i : 0);
-        It(e, n, i, b, E, g, v), n = g, i = v, l = b, a = E;
+        const E = u() + (d ? n : 0), b = u() + (d ? i : 0), g = u() + (d ? n : 0), x = u() + (d ? i : 0);
+        Vt(e, n, i, E, b, g, x), n = g, i = x, l = E, a = b;
         break;
       }
       case "T": {
-        const b = 2 * n - l, E = 2 * i - a, g = u() + (d ? n : 0), v = u() + (d ? i : 0);
-        It(e, n, i, b, E, g, v), n = g, i = v, l = b, a = E;
+        const E = 2 * n - l, b = 2 * i - a, g = u() + (d ? n : 0), x = u() + (d ? i : 0);
+        Vt(e, n, i, E, b, g, x), n = g, i = x, l = E, a = b;
         break;
       }
       case "A": {
-        const b = u(), E = u(), g = u(), v = u(), m = u(), T = u() + (d ? n : 0), w = u() + (d ? i : 0);
-        sn(e, n, i, b, E, g, !!v, !!m, T, w), n = T, i = w, l = n, a = i;
+        const E = u(), b = u(), g = u(), x = u(), m = u(), T = u() + (d ? n : 0), w = u() + (d ? i : 0);
+        Sn(e, n, i, E, b, g, !!x, !!m, T, w), n = T, i = w, l = n, a = i;
         break;
       }
       case "Z": {
@@ -3659,14 +3848,14 @@ function en(s) {
   }
   return e.length >= 6 && t.push(e), t;
 }
-function nn(s) {
+function En(s) {
   const t = [], e = /([a-zA-Z])|([+-]?(?:\d+\.?\d*|\.\d+)(?:[eE][+-]?\d+)?)/g;
   let n;
   for (; (n = e.exec(s)) !== null; )
     t.push(n[0]);
   return t;
 }
-const rn = 0.5;
+const bn = 0.5;
 function it(s, t, e, n, i, r, o, l, a, h = 0) {
   if (h > 12) {
     s.push(l, a);
@@ -3677,52 +3866,52 @@ function it(s, t, e, n, i, r, o, l, a, h = 0) {
     s.push(l, a);
     return;
   }
-  const x = Math.abs((n - l) * f - (i - a) * c) / u, p = Math.abs((r - l) * f - (o - a) * c) / u;
-  if (x + p < rn) {
+  const v = Math.abs((n - l) * f - (i - a) * c) / u, p = Math.abs((r - l) * f - (o - a) * c) / u;
+  if (v + p < bn) {
     s.push(l, a);
     return;
   }
-  const d = (t + n) / 2, y = (e + i) / 2, b = (n + r) / 2, E = (i + o) / 2, g = (r + l) / 2, v = (o + a) / 2, m = (d + b) / 2, T = (y + E) / 2, w = (b + g) / 2, A = (E + v) / 2, P = (m + w) / 2, F = (T + A) / 2;
-  it(s, t, e, d, y, m, T, P, F, h + 1), it(s, P, F, w, A, g, v, l, a, h + 1);
+  const d = (t + n) / 2, S = (e + i) / 2, E = (n + r) / 2, b = (i + o) / 2, g = (r + l) / 2, x = (o + a) / 2, m = (d + E) / 2, T = (S + b) / 2, w = (E + g) / 2, A = (b + x) / 2, P = (m + w) / 2, F = (T + A) / 2;
+  it(s, t, e, d, S, m, T, P, F, h + 1), it(s, P, F, w, A, g, x, l, a, h + 1);
 }
-function It(s, t, e, n, i, r, o) {
+function Vt(s, t, e, n, i, r, o) {
   const l = t + 0.6666666666666666 * (n - t), a = e + 2 / 3 * (i - e), h = r + 2 / 3 * (n - r), c = o + 2 / 3 * (i - o);
   it(s, t, e, l, a, h, c, r, o);
 }
-function sn(s, t, e, n, i, r, o, l, a, h) {
+function Sn(s, t, e, n, i, r, o, l, a, h) {
   if (n === 0 || i === 0) {
     s.push(a, h);
     return;
   }
   let c = Math.abs(n), f = Math.abs(i);
-  const u = r * Math.PI / 180, x = Math.cos(u), p = Math.sin(u), d = (t - a) / 2, y = (e - h) / 2, b = x * d + p * y, E = -p * d + x * y;
-  let g = b * b / (c * c) + E * E / (f * f);
+  const u = r * Math.PI / 180, v = Math.cos(u), p = Math.sin(u), d = (t - a) / 2, S = (e - h) / 2, E = v * d + p * S, b = -p * d + v * S;
+  let g = E * E / (c * c) + b * b / (f * f);
   if (g > 1) {
     const U = Math.sqrt(g);
     c *= U, f *= U, g = 1;
   }
-  const v = c * c, m = f * f, T = b * b, w = E * E;
-  let A = Math.max(0, (v * m - v * w - m * T) / (v * w + m * T));
+  const x = c * c, m = f * f, T = E * E, w = b * b;
+  let A = Math.max(0, (x * m - x * w - m * T) / (x * w + m * T));
   A = Math.sqrt(A), o === l && (A = -A);
-  const P = A * (c * E) / f, F = A * -(f * b) / c, _ = x * P - p * F + (t + a) / 2, I = p * P + x * F + (e + h) / 2, C = Mt(1, 0, (b - P) / c, (E - F) / f);
-  let S = Mt(
-    (b - P) / c,
-    (E - F) / f,
-    (-b - P) / c,
-    (-E - F) / f
+  const P = A * (c * b) / f, F = A * -(f * E) / c, _ = v * P - p * F + (t + a) / 2, I = p * P + v * F + (e + h) / 2, C = Ot(1, 0, (E - P) / c, (b - F) / f);
+  let y = Ot(
+    (E - P) / c,
+    (b - F) / f,
+    (-E - P) / c,
+    (-b - F) / f
   );
-  !l && S > 0 && (S -= 2 * Math.PI), l && S < 0 && (S += 2 * Math.PI);
-  const D = Math.max(4, Math.ceil(Math.abs(S) / (Math.PI / 16)));
+  !l && y > 0 && (y -= 2 * Math.PI), l && y < 0 && (y += 2 * Math.PI);
+  const D = Math.max(4, Math.ceil(Math.abs(y) / (Math.PI / 16)));
   for (let U = 1; U <= D; U++) {
-    const M = C + U / D * S, k = Math.cos(M), j = Math.sin(M), et = x * c * k - p * f * j + _, at = p * c * k + x * f * j + I;
+    const M = C + U / D * y, O = Math.cos(M), j = Math.sin(M), et = v * c * O - p * f * j + _, at = p * c * O + v * f * j + I;
     s.push(et, at);
   }
 }
-function Mt(s, t, e, n) {
+function Ot(s, t, e, n) {
   const i = s * n - t * e < 0 ? -1 : 1, r = s * e + t * n, o = Math.sqrt(s * s + t * t), l = Math.sqrt(e * e + n * n), a = r / (o * l);
   return i * Math.acos(Math.max(-1, Math.min(1, a)));
 }
-function on(s) {
+function yn(s) {
   const t = [], e = [];
   for (let n = 0; n < s.length; n++) {
     n > 0 && e.push(t.length / 2);
@@ -3731,22 +3920,22 @@ function on(s) {
   }
   return { flatCoords: t, holeIndices: e };
 }
-function zt(s) {
-  const t = s.length, e = s.map((i) => Math.abs(qt(i))), n = new Array(t).fill(!1);
+function jt(s) {
+  const t = s.length, e = s.map((i) => Math.abs(Zt(i))), n = new Array(t).fill(!1);
   for (let i = 0; i < t; i++) {
     let r = 0;
     const o = s[i][0], l = s[i][1];
     for (let a = 0; a < t; a++)
-      i !== a && e[a] > e[i] && Yt(o, l, s[a]) && r++;
+      i !== a && e[a] > e[i] && $t(o, l, s[a]) && r++;
     n[i] = r % 2 === 1;
   }
   return n;
 }
-function an(s) {
+function wn(s) {
   if (s.length <= 1)
     return [s];
-  const t = zt(s), e = s.map((o, l) => {
-    const a = qt(o);
+  const t = jt(s), e = s.map((o, l) => {
+    const a = Zt(o);
     return { index: l, contour: o, area: a, isOuter: !t[l] };
   }), n = e.filter((o) => o.isOuter), i = e.filter((o) => !o.isOuter);
   if (n.length === 0)
@@ -3759,7 +3948,7 @@ function an(s) {
     const l = o.contour[0], a = o.contour[1];
     let h = -1, c = 1 / 0;
     for (let f = 0; f < n.length; f++)
-      if (Yt(l, a, n[f].contour)) {
+      if ($t(l, a, n[f].contour)) {
         const u = Math.abs(n[f].area);
         u < c && (c = u, h = f);
       }
@@ -3767,7 +3956,7 @@ function an(s) {
   }
   return r.map((o) => [o.outer, ...o.holes]);
 }
-function qt(s) {
+function Zt(s) {
   let t = 0;
   const e = s.length;
   for (let n = 0; n < e; n += 2) {
@@ -3776,7 +3965,7 @@ function qt(s) {
   }
   return t / 2;
 }
-function Yt(s, t, e) {
+function $t(s, t, e) {
   let n = !1;
   const i = e.length;
   for (let r = 0, o = i - 2; r < i; o = r, r += 2) {
@@ -3785,37 +3974,37 @@ function Yt(s, t, e) {
   }
   return n;
 }
-function ln(s, t, e = 2) {
+function Rn(s, t, e = 2) {
   const n = t && t.length > 0, i = n ? t[0] * e : s.length;
-  let r = jt(s, 0, i, e, !0);
+  let r = Kt(s, 0, i, e, !0);
   const o = [];
   if (!r || r.next === r.prev) return o;
-  n && (r = dn(s, t, r, e));
+  n && (r = Cn(s, t, r, e));
   let l = 1 / 0, a = 1 / 0, h = -1 / 0, c = -1 / 0, f = 0;
   if (s.length > 80 * e) {
     for (let u = 0; u < i; u += e) {
-      const x = s[u], p = s[u + 1];
-      x < l && (l = x), p < a && (a = p), x > h && (h = x), p > c && (c = p);
+      const v = s[u], p = s[u + 1];
+      v < l && (l = v), p < a && (a = p), v > h && (h = v), p > c && (c = p);
     }
     f = Math.max(h - l, c - a), f = f !== 0 ? 32767 / f : 0;
   }
   return rt(r, o, e, l, a, f, 0), o;
 }
-function jt(s, t, e, n, i) {
+function Kt(s, t, e, n, i) {
   let r = null;
-  if (i === yn(s, t, e, n) > 0)
+  if (i === Hn(s, t, e, n) > 0)
     for (let o = t; o < e; o += n)
-      r = Bt(o, s[o], s[o + 1], r);
+      r = kt(o, s[o], s[o + 1], r);
   else
     for (let o = e - n; o >= t; o -= n)
-      r = Bt(o, s[o], s[o + 1], r);
-  return r && vt(r, r.next) && (ot(r), r = r.next), r ? (r.next.prev = r, r.prev.next = r, r.next) : null;
+      r = kt(o, s[o], s[o + 1], r);
+  return r && xt(r, r.next) && (ot(r), r = r.next), r ? (r.next.prev = r, r.prev.next = r, r.next) : null;
 }
 function Y(s, t) {
   t || (t = s);
   let e = s, n;
   do
-    if (n = !1, !e.steiner && (vt(e, e.next) || L(e.prev, e, e.next) === 0)) {
+    if (n = !1, !e.steiner && (xt(e, e.next) || L(e.prev, e, e.next) === 0)) {
       if (ot(e), e = t = e.prev, e === e.next) break;
       n = !0;
     } else
@@ -3825,65 +4014,65 @@ function Y(s, t) {
 }
 function rt(s, t, e, n, i, r, o) {
   if (!s) return;
-  !o && r && vn(s, n, i, r);
+  !o && r && In(s, n, i, r);
   let l = s, a, h;
   for (; s.prev !== s.next; ) {
-    if (a = s.prev, h = s.next, r ? cn(s, n, i, r) : un(s)) {
+    if (a = s.prev, h = s.next, r ? Pn(s, n, i, r) : An(s)) {
       t.push(a.i / e, s.i / e, h.i / e), ot(s), s = h.next, l = h.next;
       continue;
     }
     if (s = h, s === l) {
-      o ? o === 1 ? (s = hn(Y(s), t, e), rt(s, t, e, n, i, r, 2)) : o === 2 && fn(s, t, e, n, i, r) : rt(Y(s), t, e, n, i, r, 1);
+      o ? o === 1 ? (s = Dn(Y(s), t, e), rt(s, t, e, n, i, r, 2)) : o === 2 && Fn(s, t, e, n, i, r) : rt(Y(s), t, e, n, i, r, 1);
       break;
     }
   }
 }
-function un(s) {
+function An(s) {
   const t = s.prev, e = s, n = s.next;
   if (L(t, e, n) >= 0) return !1;
-  const i = t.x, r = e.x, o = n.x, l = t.y, a = e.y, h = n.y, c = i < r ? i < o ? i : o : r < o ? r : o, f = l < a ? l < h ? l : h : a < h ? a : h, u = i > r ? i > o ? i : o : r > o ? r : o, x = l > a ? l > h ? l : h : a > h ? a : h;
+  const i = t.x, r = e.x, o = n.x, l = t.y, a = e.y, h = n.y, c = i < r ? i < o ? i : o : r < o ? r : o, f = l < a ? l < h ? l : h : a < h ? a : h, u = i > r ? i > o ? i : o : r > o ? r : o, v = l > a ? l > h ? l : h : a > h ? a : h;
   let p = n.next;
   for (; p !== t; ) {
-    if (p.x >= c && p.x <= u && p.y >= f && p.y <= x && tt(i, l, r, a, o, h, p.x, p.y) && L(p.prev, p, p.next) >= 0)
+    if (p.x >= c && p.x <= u && p.y >= f && p.y <= v && tt(i, l, r, a, o, h, p.x, p.y) && L(p.prev, p, p.next) >= 0)
       return !1;
     p = p.next;
   }
   return !0;
 }
-function cn(s, t, e, n) {
+function Pn(s, t, e, n) {
   const i = s.prev, r = s, o = s.next;
   if (L(i, r, o) >= 0) return !1;
-  const l = i.x, a = r.x, h = o.x, c = i.y, f = r.y, u = o.y, x = l < a ? l < h ? l : h : a < h ? a : h, p = c < f ? c < u ? c : u : f < u ? f : u, d = l > a ? l > h ? l : h : a > h ? a : h, y = c > f ? c > u ? c : u : f > u ? f : u, b = yt(x, p, t, e, n), E = yt(d, y, t, e, n);
-  let g = s.prevZ, v = s.nextZ;
-  for (; g && g.z >= b && v && v.z <= E; ) {
-    if (g.x >= x && g.x <= d && g.y >= p && g.y <= y && g !== i && g !== o && tt(l, c, a, f, h, u, g.x, g.y) && L(g.prev, g, g.next) >= 0 || (g = g.prevZ, v.x >= x && v.x <= d && v.y >= p && v.y <= y && v !== i && v !== o && tt(l, c, a, f, h, u, v.x, v.y) && L(v.prev, v, v.next) >= 0)) return !1;
-    v = v.nextZ;
-  }
-  for (; g && g.z >= b; ) {
-    if (g.x >= x && g.x <= d && g.y >= p && g.y <= y && g !== i && g !== o && tt(l, c, a, f, h, u, g.x, g.y) && L(g.prev, g, g.next) >= 0) return !1;
+  const l = i.x, a = r.x, h = o.x, c = i.y, f = r.y, u = o.y, v = l < a ? l < h ? l : h : a < h ? a : h, p = c < f ? c < u ? c : u : f < u ? f : u, d = l > a ? l > h ? l : h : a > h ? a : h, S = c > f ? c > u ? c : u : f > u ? f : u, E = wt(v, p, t, e, n), b = wt(d, S, t, e, n);
+  let g = s.prevZ, x = s.nextZ;
+  for (; g && g.z >= E && x && x.z <= b; ) {
+    if (g.x >= v && g.x <= d && g.y >= p && g.y <= S && g !== i && g !== o && tt(l, c, a, f, h, u, g.x, g.y) && L(g.prev, g, g.next) >= 0 || (g = g.prevZ, x.x >= v && x.x <= d && x.y >= p && x.y <= S && x !== i && x !== o && tt(l, c, a, f, h, u, x.x, x.y) && L(x.prev, x, x.next) >= 0)) return !1;
+    x = x.nextZ;
+  }
+  for (; g && g.z >= E; ) {
+    if (g.x >= v && g.x <= d && g.y >= p && g.y <= S && g !== i && g !== o && tt(l, c, a, f, h, u, g.x, g.y) && L(g.prev, g, g.next) >= 0) return !1;
     g = g.prevZ;
   }
-  for (; v && v.z <= E; ) {
-    if (v.x >= x && v.x <= d && v.y >= p && v.y <= y && v !== i && v !== o && tt(l, c, a, f, h, u, v.x, v.y) && L(v.prev, v, v.next) >= 0) return !1;
-    v = v.nextZ;
+  for (; x && x.z <= b; ) {
+    if (x.x >= v && x.x <= d && x.y >= p && x.y <= S && x !== i && x !== o && tt(l, c, a, f, h, u, x.x, x.y) && L(x.prev, x, x.next) >= 0) return !1;
+    x = x.nextZ;
   }
   return !0;
 }
-function hn(s, t, e) {
+function Dn(s, t, e) {
   let n = s;
   do {
     const i = n.prev, r = n.next.next;
-    !vt(i, r) && Zt(i, n, n.next, r) && st(i, r) && st(r, i) && (t.push(i.i / e, n.i / e, r.i / e), ot(n), ot(n.next), n = s = r), n = n.next;
+    !xt(i, r) && Jt(i, n, n.next, r) && st(i, r) && st(r, i) && (t.push(i.i / e, n.i / e, r.i / e), ot(n), ot(n.next), n = s = r), n = n.next;
   } while (n !== s);
   return Y(n);
 }
-function fn(s, t, e, n, i, r) {
+function Fn(s, t, e, n, i, r) {
   let o = s;
   do {
     let l = o.next.next;
     for (; l !== o.prev; ) {
-      if (o.i !== l.i && En(o, l)) {
-        let a = $t(o, l);
+      if (o.i !== l.i && Vn(o, l)) {
+        let a = Qt(o, l);
         o = Y(o, o.next), a = Y(a, a.next), rt(o, t, e, n, i, r, 0), rt(a, t, e, n, i, r, 0);
         return;
       }
@@ -3892,24 +4081,24 @@ function fn(s, t, e, n, i, r) {
     o = o.next;
   } while (o !== s);
 }
-function dn(s, t, e, n) {
+function Cn(s, t, e, n) {
   const i = [];
   for (let r = 0; r < t.length; r++) {
-    const o = t[r] * n, l = r < t.length - 1 ? t[r + 1] * n : s.length, a = jt(s, o, l, n, !1);
-    a && (a === a.next && (a.steiner = !0), i.push(Tn(a)));
+    const o = t[r] * n, l = r < t.length - 1 ? t[r + 1] * n : s.length, a = Kt(s, o, l, n, !1);
+    a && (a === a.next && (a.steiner = !0), i.push(Bn(a)));
   }
   i.sort((r, o) => r.x - o.x);
   for (const r of i)
-    e = mn(r, e);
+    e = Un(r, e);
   return e;
 }
-function mn(s, t) {
-  const e = pn(s, t);
+function Un(s, t) {
+  const e = Ln(s, t);
   if (!e) return t;
-  const n = $t(e, s);
+  const n = Qt(e, s);
   return Y(n, n.next), Y(e, e.next);
 }
-function pn(s, t) {
+function Ln(s, t) {
   let e = t;
   const n = s.x, i = s.y;
   let r = -1 / 0, o = null;
@@ -3928,23 +4117,23 @@ function pn(s, t) {
   do {
     if (n >= e.x && e.x >= a && n !== e.x && tt(i < h ? n : r, i, a, h, i < h ? r : n, i, e.x, e.y)) {
       const f = Math.abs(i - e.y) / (n - e.x);
-      st(e, s) && (f < c || f === c && (e.x > o.x || gn(o, e))) && (o = e, c = f);
+      st(e, s) && (f < c || f === c && (e.x > o.x || _n(o, e))) && (o = e, c = f);
     }
     e = e.next;
   } while (e !== l);
   return o;
 }
-function gn(s, t) {
+function _n(s, t) {
   return L(s.prev, s, t.prev) < 0 && L(t.next, s, s.next) < 0;
 }
-function vn(s, t, e, n) {
+function In(s, t, e, n) {
   let i = s;
   do
-    i.z === 0 && (i.z = yt(i.x, i.y, t, e, n)), i.prevZ = i.prev, i.nextZ = i.next, i = i.next;
+    i.z === 0 && (i.z = wt(i.x, i.y, t, e, n)), i.prevZ = i.prev, i.nextZ = i.next, i = i.next;
   while (i !== s);
-  i.prevZ.nextZ = null, i.prevZ = null, xn(i);
+  i.prevZ.nextZ = null, i.prevZ = null, Mn(i);
 }
-function xn(s) {
+function Mn(s) {
   let t = 1, e;
   do {
     let n = s;
@@ -3966,11 +4155,11 @@ function xn(s) {
   } while (e > 1);
   return s;
 }
-function yt(s, t, e, n, i) {
+function wt(s, t, e, n, i) {
   let r = (s - e) * i | 0, o = (t - n) * i | 0;
   return r = (r | r << 8) & 16711935, r = (r | r << 4) & 252645135, r = (r | r << 2) & 858993459, r = (r | r << 1) & 1431655765, o = (o | o << 8) & 16711935, o = (o | o << 4) & 252645135, o = (o | o << 2) & 858993459, o = (o | o << 1) & 1431655765, r | o << 1;
 }
-function Tn(s) {
+function Bn(s) {
   let t = s, e = s;
   do
     (t.x < e.x || t.x === e.x && t.y < e.y) && (e = t), t = t.next;
@@ -3980,29 +4169,29 @@ function Tn(s) {
 function tt(s, t, e, n, i, r, o, l) {
   return (i - o) * (t - l) - (s - o) * (r - l) >= 0 && (s - o) * (n - l) - (e - o) * (t - l) >= 0 && (e - o) * (r - l) - (i - o) * (n - l) >= 0;
 }
-function En(s, t) {
-  return s.next.i !== t.i && s.prev.i !== t.i && !bn(s, t) && (st(s, t) && st(t, s) && Sn(s, t) && (L(s.prev, s, t.prev) !== 0 || L(s, t.prev, t) !== 0) || vt(s, t) && L(s.prev, s, s.next) > 0 && L(t.prev, t, t.next) > 0);
+function Vn(s, t) {
+  return s.next.i !== t.i && s.prev.i !== t.i && !On(s, t) && (st(s, t) && st(t, s) && kn(s, t) && (L(s.prev, s, t.prev) !== 0 || L(s, t.prev, t) !== 0) || xt(s, t) && L(s.prev, s, s.next) > 0 && L(t.prev, t, t.next) > 0);
 }
 function L(s, t, e) {
   return (t.y - s.y) * (e.x - t.x) - (t.x - s.x) * (e.y - t.y);
 }
-function vt(s, t) {
+function xt(s, t) {
   return s.x === t.x && s.y === t.y;
 }
-function Zt(s, t, e, n) {
-  const i = ct(L(s, t, e)), r = ct(L(s, t, n)), o = ct(L(e, n, s)), l = ct(L(e, n, t));
-  return !!(i !== r && o !== l || i === 0 && ut(s, e, t) || r === 0 && ut(s, n, t) || o === 0 && ut(e, s, n) || l === 0 && ut(e, t, n));
+function Jt(s, t, e, n) {
+  const i = ht(L(s, t, e)), r = ht(L(s, t, n)), o = ht(L(e, n, s)), l = ht(L(e, n, t));
+  return !!(i !== r && o !== l || i === 0 && ct(s, e, t) || r === 0 && ct(s, n, t) || o === 0 && ct(e, s, n) || l === 0 && ct(e, t, n));
 }
-function ut(s, t, e) {
+function ct(s, t, e) {
   return t.x <= Math.max(s.x, e.x) && t.x >= Math.min(s.x, e.x) && t.y <= Math.max(s.y, e.y) && t.y >= Math.min(s.y, e.y);
 }
-function ct(s) {
+function ht(s) {
   return s > 0 ? 1 : s < 0 ? -1 : 0;
 }
-function bn(s, t) {
+function On(s, t) {
   let e = s;
   do {
-    if (e.i !== s.i && e.next.i !== s.i && e.i !== t.i && e.next.i !== t.i && Zt(e, e.next, s, t)) return !0;
+    if (e.i !== s.i && e.next.i !== s.i && e.i !== t.i && e.next.i !== t.i && Jt(e, e.next, s, t)) return !0;
     e = e.next;
   } while (e !== s);
   return !1;
@@ -4010,7 +4199,7 @@ function bn(s, t) {
 function st(s, t) {
   return L(s.prev, s, s.next) < 0 ? L(s, t, s.next) >= 0 && L(s, s.prev, t) >= 0 : L(s, t, s.prev) < 0 || L(s, s.next, t) < 0;
 }
-function Sn(s, t) {
+function kn(s, t) {
   let e = s, n = !1;
   const i = (s.x + t.x) / 2, r = (s.y + t.y) / 2;
   do
@@ -4018,18 +4207,18 @@ function Sn(s, t) {
   while (e !== s);
   return n;
 }
-function $t(s, t) {
-  const e = wt(s.i, s.x, s.y), n = wt(t.i, t.x, t.y), i = s.next, r = t.prev;
+function Qt(s, t) {
+  const e = Rt(s.i, s.x, s.y), n = Rt(t.i, t.x, t.y), i = s.next, r = t.prev;
   return s.next = t, t.prev = s, e.next = i, i.prev = e, n.next = e, e.prev = n, r.next = n, n.prev = r, n;
 }
-function Bt(s, t, e, n) {
-  const i = wt(s, t, e);
+function kt(s, t, e, n) {
+  const i = Rt(s, t, e);
   return n ? (i.next = n.next, i.prev = n, n.next.prev = i, n.next = i) : (i.prev = i, i.next = i), i;
 }
 function ot(s) {
   s.next.prev = s.prev, s.prev.next = s.next, s.prevZ && (s.prevZ.nextZ = s.nextZ), s.nextZ && (s.nextZ.prevZ = s.prevZ);
 }
-function wt(s, t, e) {
+function Rt(s, t, e) {
   return {
     i: s,
     x: t,
@@ -4042,7 +4231,7 @@ function wt(s, t, e) {
     steiner: !1
   };
 }
-function yn(s, t, e, n) {
+function Hn(s, t, e, n) {
   let i = 0;
   for (let r = t, o = e - n; r < e; r += n)
     i += (s[o] - s[r]) * (s[r + 1] + s[o + 1]), o = r;
@@ -4104,15 +4293,15 @@ const R = {
   loop: !0,
   muted: !0
 }, J = 512, Q = 512;
-class Et extends HTMLElement {
+class bt extends HTMLElement {
   static TAG_NAME = "layershift-portal";
   static get observedAttributes() {
     return [
       "src",
-      "depth-src",
-      "depth-width",
-      "depth-height",
-      "depth-fps",
+      "map-src",
+      "map-width",
+      "map-height",
+      "map-fps",
       "depth-model",
       "logo-src",
       "source-type",
@@ -4163,11 +4352,11 @@ class Et extends HTMLElement {
       "muted"
     ];
   }
-  reinitAttributes = ["src", "depth-src", "depth-width", "depth-height", "depth-fps", "depth-model", "logo-src", "source-type"];
+  reinitAttributes = ["src", "map-src", "map-width", "map-height", "map-fps", "depth-model", "logo-src", "source-type"];
   canInit() {
     const t = !!this.getAttribute("logo-src");
     if (this.sourceType === "camera") return t;
-    const e = !!this.getAttribute("src"), n = !!this.getAttribute("depth-src"), i = !!this.getAttribute("depth-model");
+    const e = !!this.getAttribute("src"), n = !!this.getAttribute("map-src"), i = !!this.getAttribute("depth-model");
     return e && t && (n || i);
   }
   _input = { x: 0, y: 0 };
@@ -4187,7 +4376,7 @@ class Et extends HTMLElement {
   loopCount = 0;
   lifecycle;
   constructor() {
-    super(), this.shadow = this.attachShadow({ mode: "open" }), this.lifecycle = new Wt(this);
+    super(), this.shadow = this.attachShadow({ mode: "open" }), this.lifecycle = new Yt(this);
   }
   // --- Attribute helpers ---
   getAttrFloat(t, e) {
@@ -4203,7 +4392,7 @@ class Et extends HTMLElement {
   }
   getAttrColor(t, e) {
     const n = this.getAttribute(t) ?? e;
-    return wn(n);
+    return Nn(n);
   }
   getAttrVec3(t, e) {
     const i = (this.getAttribute(t) ?? e).split(",").map((o) => parseFloat(o.trim()));
@@ -4438,62 +4627,62 @@ class Et extends HTMLElement {
         this.emit("layershift-portal:model-progress", d);
       };
       if (n) {
-        const [d, y] = await Promise.all([
-          Nt(
+        const [d, S] = await Promise.all([
+          zt(
             { video: { facingMode: "user" } },
             { parent: this.shadow }
           ),
-          Tt(e)
+          Et(e)
         ]);
         if (t.aborted) {
           d.dispose();
           return;
         }
-        if (r = d, l = y, i) {
-          if (a = await dt(i, J, Q, h), t.aborted) {
+        if (r = d, l = S, i) {
+          if (a = await mt(i, J, Q, h), t.aborted) {
             a.dispose(), r.dispose();
             return;
           }
-          o = X(J, Q);
+          o = N(J, Q);
         } else
-          o = X(r.width, r.height);
+          o = N(r.width, r.height);
       } else {
-        const d = this.getAttribute("src"), y = this.getAttribute("depth-src"), b = !!y, E = this.sourceType === "image" || /\.(jpe?g|png|webp|gif|avif|bmp)(\?|$)/i.test(d);
-        if (b) {
-          const [g, v, m] = await Promise.all([
-            E ? ft(d) : ht(d, {
+        const d = this.getAttribute("src"), S = this.getAttribute("map-src"), E = !!S, b = this.sourceType === "image" || /\.(jpe?g|png|webp|gif|avif|bmp)(\?|$)/i.test(d);
+        if (E) {
+          const [g, x, m] = await Promise.all([
+            b ? dt(d) : ft(d, {
               parent: this.shadow,
               loop: this.shouldLoop,
               muted: this.shouldMute
             }),
-            kt(
-              y,
-              this.getAttrFloat("depth-width", 512),
-              this.getAttrFloat("depth-height", 512),
-              this.getAttrFloat("depth-fps", 5)
+            Nt(
+              S,
+              this.getAttrFloat("map-width", 512),
+              this.getAttrFloat("map-height", 512),
+              this.getAttrFloat("map-fps", 5)
             ),
-            Tt(e)
+            Et(e)
           ]);
           if (t.aborted) {
             g.dispose();
             return;
           }
-          r = g, o = v, l = m;
+          r = g, o = x, l = m;
         } else if (i) {
-          const [g, v, m] = await Promise.all([
-            E ? ft(d) : ht(d, {
+          const [g, x, m] = await Promise.all([
+            b ? dt(d) : ft(d, {
               parent: this.shadow,
               loop: this.shouldLoop,
               muted: this.shouldMute
             }),
-            dt(i, J, Q, h),
-            Tt(e)
+            mt(i, J, Q, h),
+            Et(e)
           ]);
           if (t.aborted) {
-            g.dispose(), v.dispose();
+            g.dispose(), x.dispose();
             return;
           }
-          if (r = g, a = v, l = m, E || !r.isLive) {
+          if (r = g, a = x, l = m, b || !r.isLive) {
             const T = r.getImageSource();
             if (T) {
               const w = await a.submitFrameAndWait(T);
@@ -4505,11 +4694,11 @@ class Et extends HTMLElement {
                 frames: [w]
               };
             } else
-              o = X(J, Q);
+              o = N(J, Q);
           } else
-            o = X(J, Q);
+            o = N(J, Q);
         } else
-          throw new Error("Either depth-src or depth-model must be provided.");
+          throw new Error("Either map-src or depth-model must be provided.");
       }
       this.source = r, this.depthEstimator = a, this.mesh = l, this.loopCount = 0, this.attachSourceEventListeners(r);
       const c = this.container?.clientWidth || r.width, f = this.parallaxMax / Math.max(c, 1);
@@ -4517,10 +4706,10 @@ class Et extends HTMLElement {
       if (a)
         u = () => a.getLatestDepth();
       else {
-        const d = new Vt(o);
-        u = (y) => d.sample(y);
+        const d = new Ht(o);
+        u = (S) => d.sample(S);
       }
-      const x = {
+      const v = {
         parallaxStrength: f,
         overscanPadding: this.overscan,
         pomSteps: this.pomSteps,
@@ -4562,20 +4751,22 @@ class Et extends HTMLElement {
         lightDirection: this.lightDirection3
       };
       if (t.aborted) return;
-      this.renderer = new $e(this.container, x), this.renderer.initialize(r, o.width, o.height, l);
+      this.renderer = new mn(this.container, v), this.renderer.onError = (d) => {
+        this.emit("layershift-portal:error", { message: d.message });
+      }, this.renderer.initialize(r, o.width, o.height, l);
       const p = a;
       if (this.renderer.start(
         r,
         u,
         () => ({ x: this._input.x, y: this._input.y }),
-        (d, y) => {
+        (d, S) => {
           if (p) {
-            const b = r.getImageSource();
-            b && p.submitFrame(b);
+            const E = r.getImageSource();
+            E && p.submitFrame(E);
           }
           this.emit("layershift-portal:frame", {
             currentTime: d,
-            frameNumber: y
+            frameNumber: S
           });
         }
       ), !n && r.isLive && this.shouldAutoplay && r.play)
@@ -4599,7 +4790,7 @@ class Et extends HTMLElement {
     this.renderer?.dispose(), this.renderer = null, this.depthEstimator?.dispose(), this.depthEstimator = null, this.source?.dispose(), this.source = null, this.mesh = null, this.loopCount = 0, this.container = null;
   }
 }
-function wn(s) {
+function Nn(s) {
   const t = s.replace("#", "");
   if (t.length === 3) {
     const e = parseInt(t[0] + t[0], 16) / 255, n = parseInt(t[1] + t[1], 16) / 255, i = parseInt(t[2] + t[2], 16) / 255;
@@ -4617,104 +4808,104 @@ function V(s, t, e) {
 function W(s, t, e) {
   return s + (t - s) * e;
 }
-const N = 100, Kt = 0.06;
-function Rn(s, t) {
+const X = 100, te = 0.06;
+function Xn(s, t) {
   const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? 0.08;
   let r = 0, o = 0, l = 0, a = 0, h = 0, c = !0;
   const f = (p) => {
-    const d = s.getBoundingClientRect(), y = (p.clientX - d.left) / d.width * 2 - 1, b = (p.clientY - d.top) / d.height * 2 - 1;
-    r = V(y, -1, 1), o = V(b, -1, 1);
+    const d = s.getBoundingClientRect(), S = (p.clientX - d.left) / d.width * 2 - 1, E = (p.clientY - d.top) / d.height * 2 - 1;
+    r = V(S, -1, 1), o = V(E, -1, 1);
   }, u = () => {
     r = 0, o = 0;
-  }, x = () => {
-    c && (l = W(l, r, i), a = W(a, o, i), s.input = { x: l * e, y: a * n }, h = requestAnimationFrame(x));
+  }, v = () => {
+    c && (l = W(l, r, i), a = W(a, o, i), s.input = { x: l * e, y: a * n }, h = requestAnimationFrame(v));
   };
-  return s.addEventListener("mousemove", f), s.addEventListener("mouseleave", u), h = requestAnimationFrame(x), () => {
+  return s.addEventListener("mousemove", f), s.addEventListener("mouseleave", u), h = requestAnimationFrame(v), () => {
     c = !1, cancelAnimationFrame(h), s.removeEventListener("mousemove", f), s.removeEventListener("mouseleave", u);
   };
 }
-function An(s, t) {
+function Gn(s, t) {
   const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? 0.08;
   let r = 0, o = 0, l = 0, a = 0, h = 0, c = 0, f = 0, u = !0;
-  const x = (b) => {
-    const E = b.touches[0];
-    E && (h = E.clientX - l * N, c = E.clientY - a * N, r = l, o = a);
-  }, p = (b) => {
-    const E = b.touches[0];
-    if (!E) return;
-    const g = E.clientX - h, v = E.clientY - c;
-    r = V(g / N, -1, 1), o = V(v / N, -1, 1);
+  const v = (E) => {
+    const b = E.touches[0];
+    b && (h = b.clientX - l * X, c = b.clientY - a * X, r = l, o = a);
+  }, p = (E) => {
+    const b = E.touches[0];
+    if (!b) return;
+    const g = b.clientX - h, x = b.clientY - c;
+    r = V(g / X, -1, 1), o = V(x / X, -1, 1);
   }, d = () => {
     r = 0, o = 0;
-  }, y = () => {
-    u && (l = W(l, r, i), a = W(a, o, i), s.input = { x: l * e, y: a * n }, f = requestAnimationFrame(y));
+  }, S = () => {
+    u && (l = W(l, r, i), a = W(a, o, i), s.input = { x: l * e, y: a * n }, f = requestAnimationFrame(S));
   };
-  return s.addEventListener("touchstart", x, { passive: !0 }), s.addEventListener("touchmove", p, { passive: !0 }), s.addEventListener("touchend", d, { passive: !0 }), s.addEventListener("touchcancel", d, { passive: !0 }), f = requestAnimationFrame(y), () => {
-    u = !1, cancelAnimationFrame(f), s.removeEventListener("touchstart", x), s.removeEventListener("touchmove", p), s.removeEventListener("touchend", d), s.removeEventListener("touchcancel", d);
+  return s.addEventListener("touchstart", v, { passive: !0 }), s.addEventListener("touchmove", p, { passive: !0 }), s.addEventListener("touchend", d, { passive: !0 }), s.addEventListener("touchcancel", d, { passive: !0 }), f = requestAnimationFrame(S), () => {
+    u = !1, cancelAnimationFrame(f), s.removeEventListener("touchstart", v), s.removeEventListener("touchmove", p), s.removeEventListener("touchend", d), s.removeEventListener("touchcancel", d);
   };
 }
-function Pn(s, t) {
-  const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? Kt;
+function Wn(s, t) {
+  const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? te;
   let r = 0, o = 0, l = 0, a = 0, h = 0, c = !0, f = !1;
-  const u = (y) => {
-    r = V((y.gamma ?? 0) / 45, -1, 1), o = V((y.beta ?? 0) / 45, -1, 1);
-  }, x = () => {
-    c && (l = W(l, r, i), a = W(a, o, i), s.input = { x: l * e, y: a * n }, h = requestAnimationFrame(x));
+  const u = (S) => {
+    r = V((S.gamma ?? 0) / 45, -1, 1), o = V((S.beta ?? 0) / 45, -1, 1);
+  }, v = () => {
+    c && (l = W(l, r, i), a = W(a, o, i), s.input = { x: l * e, y: a * n }, h = requestAnimationFrame(v));
   }, p = () => {
     c && !f && (window.addEventListener("deviceorientation", u), f = !0);
   }, d = DeviceOrientationEvent;
-  return typeof d.requestPermission == "function" ? d.requestPermission().then((y) => {
-    y === "granted" && p();
+  return typeof d.requestPermission == "function" ? d.requestPermission().then((S) => {
+    S === "granted" && p();
   }).catch(() => {
-  }) : p(), h = requestAnimationFrame(x), () => {
+  }) : p(), h = requestAnimationFrame(v), () => {
     c = !1, cancelAnimationFrame(h), f && (window.removeEventListener("deviceorientation", u), f = !1);
   };
 }
-function Dn(s, t) {
-  const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? 0.08, r = t?.lerpFactor ?? Kt;
-  let o = 0, l = 0, a = 0, h = 0, c = 0, f = 0, u = 0, x = 0, p = !1, d = !1, y = !1, b = 0, E = 0, g = 0, v = !0;
-  const m = (S) => {
-    const D = s.getBoundingClientRect(), U = (S.clientX - D.left) / D.width * 2 - 1, M = (S.clientY - D.top) / D.height * 2 - 1;
+function zn(s, t) {
+  const e = t?.sensitivityX ?? 1, n = t?.sensitivityY ?? 1, i = t?.lerpFactor ?? 0.08, r = t?.lerpFactor ?? te;
+  let o = 0, l = 0, a = 0, h = 0, c = 0, f = 0, u = 0, v = 0, p = !1, d = !1, S = !1, E = 0, b = 0, g = 0, x = !0;
+  const m = (y) => {
+    const D = s.getBoundingClientRect(), U = (y.clientX - D.left) / D.width * 2 - 1, M = (y.clientY - D.top) / D.height * 2 - 1;
     o = V(U, -1, 1), l = V(M, -1, 1);
   }, T = () => {
     o = 0, l = 0;
-  }, w = (S) => {
-    const D = S.touches[0];
-    D && (p = !0, b = D.clientX - u * N, E = D.clientY - x * N, a = u, h = x, !d && !y && I());
-  }, A = (S) => {
-    const D = S.touches[0];
+  }, w = (y) => {
+    const D = y.touches[0];
+    D && (p = !0, E = D.clientX - u * X, b = D.clientY - v * X, a = u, h = v, !d && !S && I());
+  }, A = (y) => {
+    const D = y.touches[0];
     if (!D) return;
-    const U = D.clientX - b, M = D.clientY - E;
-    a = V(U / N, -1, 1), h = V(M / N, -1, 1);
+    const U = D.clientX - E, M = D.clientY - b;
+    a = V(U / X, -1, 1), h = V(M / X, -1, 1);
   }, P = () => {
     p = !1, a = 0, h = 0;
-  }, F = (S) => {
-    c = V((S.gamma ?? 0) / 45, -1, 1), f = V((S.beta ?? 0) / 45, -1, 1);
+  }, F = (y) => {
+    c = V((y.gamma ?? 0) / 45, -1, 1), f = V((y.beta ?? 0) / 45, -1, 1);
   }, _ = () => {
-    v && !y && (window.addEventListener("deviceorientation", F), y = !0, d = !0);
+    x && !S && (window.addEventListener("deviceorientation", F), S = !0, d = !0);
   }, I = () => {
     if (typeof DeviceOrientationEvent > "u") return;
-    const S = DeviceOrientationEvent;
-    typeof S.requestPermission == "function" ? S.requestPermission().then((D) => {
+    const y = DeviceOrientationEvent;
+    typeof y.requestPermission == "function" ? y.requestPermission().then((D) => {
       D === "granted" && _();
     }).catch(() => {
     }) : _();
   }, C = () => {
-    if (!v) return;
-    let S, D, U;
-    p ? (S = a, D = h, U = i) : d ? (S = c, D = f, U = r) : (S = o, D = l, U = i), u = W(u, S, U), x = W(x, D, U), s.input = { x: u * e, y: x * n }, g = requestAnimationFrame(C);
+    if (!x) return;
+    let y, D, U;
+    p ? (y = a, D = h, U = i) : d ? (y = c, D = f, U = r) : (y = o, D = l, U = i), u = W(u, y, U), v = W(v, D, U), s.input = { x: u * e, y: v * n }, g = requestAnimationFrame(C);
   };
   return s.addEventListener("mousemove", m), s.addEventListener("mouseleave", T), s.addEventListener("touchstart", w, { passive: !0 }), s.addEventListener("touchmove", A, { passive: !0 }), s.addEventListener("touchend", P, { passive: !0 }), s.addEventListener("touchcancel", P, { passive: !0 }), g = requestAnimationFrame(C), () => {
-    v = !1, cancelAnimationFrame(g), s.removeEventListener("mousemove", m), s.removeEventListener("mouseleave", T), s.removeEventListener("touchstart", w), s.removeEventListener("touchmove", A), s.removeEventListener("touchend", P), s.removeEventListener("touchcancel", P), y && (window.removeEventListener("deviceorientation", F), y = !1);
+    x = !1, cancelAnimationFrame(g), s.removeEventListener("mousemove", m), s.removeEventListener("mouseleave", T), s.removeEventListener("touchstart", w), s.removeEventListener("touchmove", A), s.removeEventListener("touchend", P), s.removeEventListener("touchcancel", P), S && (window.removeEventListener("deviceorientation", F), S = !1);
   };
 }
-customElements.get(xt.TAG_NAME) || customElements.define(xt.TAG_NAME, xt);
-customElements.get(Et.TAG_NAME) || customElements.define(Et.TAG_NAME, Et);
+customElements.get(Tt.TAG_NAME) || customElements.define(Tt.TAG_NAME, Tt);
+customElements.get(bt.TAG_NAME) || customElements.define(bt.TAG_NAME, bt);
 export {
-  xt as LayershiftElement,
-  Et as LayershiftPortalElement,
-  Pn as connectGyro,
-  Rn as connectMouse,
-  Dn as connectPointer,
-  An as connectTouch
+  Tt as LayershiftElement,
+  bt as LayershiftPortalElement,
+  Wn as connectGyro,
+  Xn as connectMouse,
+  zn as connectPointer,
+  Gn as connectTouch
 };