dom-sync-gl 0.0.1

package/dist/index.js

@@ -0,0 +1,1695 @@
+var L = Object.defineProperty;
+var z = (d, e, t) => e in d ? L(d, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : d[e] = t;
+var s = (d, e, t) => z(d, typeof e != "symbol" ? e + "" : e, t);
+import * as a from "three";
+import { OrbitControls as O } from "three/examples/jsm/controls/OrbitControls.js";
+import { GLTFLoader as Y } from "three/examples/jsm/loaders/GLTFLoader.js";
+const v = 60, G = 0.1, k = 1e4, y = 1, V = { x: 0, y: 0, z: 0 }, F = 16777215, D = 0.5, U = 16777215, H = 1, w = { x: 1, y: 1, z: 1 };
+class C {
+  constructor(e) {
+    s(this, "rect");
+    /**
+     * 内部 THREE.PerspectiveCamera。外部から `lookAt` 等の操作は可能。
+     *
+     * **注意**: `position.z` は「DOM 1px = WebGL 1unit」を成立させるための値で、
+     * `resize()` のたびに `rect.height / 2 / tan(fov/2)` で**上書きされる**。
+     * 外から position.z を書き換えても resize で消えるので、ズームや視点調整を
+     * 永続化したい場合は別途 update ループで再設定するか、座標系が変わってもよい
+     * 設計にすること。
+     */
+    s(this, "instance");
+    this.rect = e;
+    const t = v / 2 * (Math.PI / 180), i = Math.max(1, e.width), o = Math.max(1, e.height), r = o / 2 / Math.tan(t);
+    this.instance = new a.PerspectiveCamera(
+      v,
+      i / o,
+      G,
+      k
+    ), this.instance.position.z = r;
+  }
+  resize(e) {
+    if (e.width <= 0 || e.height <= 0) return;
+    this.rect = e;
+    const t = Math.max(1, e.width), i = Math.max(1, e.height), o = v / 2 * (Math.PI / 180), r = i / 2 / Math.tan(o);
+    this.instance.aspect = t / i, this.instance.position.z = r, this.instance.updateProjectionMatrix();
+  }
+}
+class B {
+  constructor(e) {
+    s(this, "ambientLight");
+    s(this, "directionalLight");
+    s(this, "scene");
+    this.scene = e, this.ambientLight = new a.AmbientLight(
+      F,
+      D
+    ), this.scene.add(this.ambientLight), this.directionalLight = new a.DirectionalLight(
+      U,
+      H
+    ), this.directionalLight.position.set(
+      w.x,
+      w.y,
+      w.z
+    ), this.scene.add(this.directionalLight), this.scene.add(this.directionalLight.target);
+  }
+}
+class P {
+  constructor(e, t) {
+    s(this, "element");
+    s(this, "canvasRect");
+    s(this, "positionInfo");
+    s(this, "rect");
+    // calculateWebGLPosition の戻り値を使い回すバッファ（GC削減）
+    s(this, "_outPosition", { x: 0, y: 0 });
+    this.element = e, this.canvasRect = t, this.rect = new DOMRect(), this.positionInfo = {
+      pageTop: 0,
+      pageLeft: 0,
+      isFixed: !1
+    }, this.updatePositionInfo();
+  }
+  /**
+   * DOM要素の位置情報を更新（毎フレーム呼ばれる）
+   */
+  updatePositionInfo() {
+    this.rect = this.element.getBoundingClientRect();
+    const e = window.scrollY, t = window.scrollX;
+    this.positionInfo.isFixed ? (this.positionInfo.pageTop = this.rect.top, this.positionInfo.pageLeft = this.rect.left) : (this.positionInfo.pageTop = this.rect.top + e, this.positionInfo.pageLeft = this.rect.left + t);
+  }
+  /**
+   * position: fixed または sticky かどうかを再チェック（初期化・リサイズ時のみ呼ぶ）。
+   * fixed / sticky 要素は document 上で位置が固定されないため、毎フレーム rect.top を
+   * viewport 座標として扱う isFixed branch を使う。
+   */
+  refreshPositionType() {
+    const e = window.getComputedStyle(this.element).position;
+    this.positionInfo.isFixed = e === "fixed" || e === "sticky";
+  }
+  /**
+   * WebGL座標系での位置を計算。
+   * 戻り値は内部バッファを使い回すため、保持する場合は呼び出し側でコピーすること。
+   */
+  calculateWebGLPosition(e = 0, t = 0) {
+    let i, o;
+    return this.positionInfo.isFixed ? (i = this.canvasRect.left + this.canvasRect.width / 2, o = this.canvasRect.top + this.canvasRect.height / 2) : (i = this.canvasRect.left + e + this.canvasRect.width / 2, o = this.canvasRect.top + t + this.canvasRect.height / 2), this._outPosition.x = this.positionInfo.pageLeft + this.rect.width / 2 - i, this._outPosition.y = -(this.positionInfo.pageTop + this.rect.height / 2 - o), this._outPosition;
+  }
+  /**
+   * Canvas矩形を更新
+   */
+  setCanvasRect(e) {
+    this.canvasRect = e;
+  }
+  /**
+   * position: fixedかどうか
+   */
+  get isFixed() {
+    return this.positionInfo.isFixed;
+  }
+  /**
+   * ページトップ位置
+   */
+  get pageTop() {
+    return this.positionInfo.pageTop;
+  }
+  /**
+   * ページレフト位置
+   */
+  get pageLeft() {
+    return this.positionInfo.pageLeft;
+  }
+}
+const W = `
+  varying vec2 vUv;
+  void main() {
+    vUv = uv;
+    gl_Position = vec4(position, 1.0);
+  }
+`;
+class R {
+  constructor(e) {
+    s(this, "material");
+    /** false の時、EffectComposer はこのパスをスキップする（パススルー扱い）。 */
+    s(this, "enabled", !0);
+    this.material = e;
+  }
+  setUniform(e, t) {
+    this.material.uniforms[e] !== void 0 && (this.material.uniforms[e].value = t);
+  }
+  getUniform(e) {
+    return this.material.uniforms[e];
+  }
+}
+class j {
+  constructor(e, t, i) {
+    s(this, "renderer");
+    s(this, "passes", []);
+    s(this, "targetA");
+    s(this, "targetB");
+    s(this, "postScene");
+    s(this, "postCamera");
+    s(this, "postMesh");
+    s(this, "geometry");
+    /**
+     * dispose 後の API 呼び出しを no-op にするフラグ。
+     * dispose 済みの RT に render すると INVALID_OPERATION になるため。
+     */
+    s(this, "_disposed", !1);
+    this.renderer = e;
+    const o = e.getPixelRatio(), r = Math.max(1, Math.floor(t * o)), h = Math.max(1, Math.floor(i * o)), l = {
+      minFilter: a.LinearFilter,
+      magFilter: a.LinearFilter,
+      format: a.RGBAFormat,
+      stencilBuffer: !1
+    };
+    this.targetA = new a.WebGLRenderTarget(r, h, l), this.targetB = new a.WebGLRenderTarget(r, h, l), this.postScene = new a.Scene(), this.postCamera = new a.OrthographicCamera(-1, 1, 1, -1, 0, 1), this.geometry = new a.PlaneGeometry(2, 2), this.postMesh = new a.Mesh(this.geometry), this.postScene.add(this.postMesh);
+  }
+  addEffect(e) {
+    if (this._disposed)
+      throw new Error("[EffectComposer] dispose 済みのインスタンスでは addEffect() できません。");
+    const t = new a.ShaderMaterial({
+      uniforms: {
+        tDiffuse: { value: null },
+        ...e.uniforms
+      },
+      vertexShader: W,
+      fragmentShader: e.fragmentShader,
+      transparent: !0
+    }), i = new R(t);
+    return this.passes.push(i), i;
+  }
+  /**
+   * 登録済みパスを 1 つ取り除いて material を dispose する。
+   * `addEffect()` の戻り値か、`BaseEffect.getPass()` の値を渡す。
+   * 存在しない pass を渡した時は何もしない。
+   */
+  removeEffect(e) {
+    if (this._disposed) return !1;
+    const t = this.passes.indexOf(e);
+    return t < 0 ? !1 : (this.passes.splice(t, 1), e.material.dispose(), !0);
+  }
+  /**
+   * シーンをレンダリングし、登録されたエフェクトを順に適用する。
+   * エフェクトが0個の場合は通常レンダリング。
+   */
+  render(e, t) {
+    if (this._disposed) return;
+    let i = 0, o = -1;
+    const r = this.passes;
+    for (let n = 0, c = r.length; n < c; n++)
+      r[n].enabled && (i++, o = n);
+    if (i === 0) {
+      this.renderer.setRenderTarget(null), this.renderer.render(e, t);
+      return;
+    }
+    this.renderer.setRenderTarget(this.targetA), this.renderer.render(e, t);
+    let h = this.targetA, l = this.targetB;
+    for (let n = 0; n < r.length; n++) {
+      const c = r[n];
+      if (!c.enabled) continue;
+      const u = n === o;
+      if (c.material.uniforms.tDiffuse.value = h.texture, this.postMesh.material = c.material, this.renderer.setRenderTarget(u ? null : l), this.renderer.render(this.postScene, this.postCamera), !u) {
+        const f = h;
+        h = l, l = f;
+      }
+    }
+  }
+  resize(e, t) {
+    if (this._disposed) return;
+    const i = this.renderer.getPixelRatio(), o = Math.max(1, Math.floor(e * i)), r = Math.max(1, Math.floor(t * i));
+    this.targetA.setSize(o, r), this.targetB.setSize(o, r);
+  }
+  dispose() {
+    if (!this._disposed) {
+      this._disposed = !0, this.targetA.dispose(), this.targetB.dispose(), this.geometry.dispose();
+      for (const e of this.passes)
+        e.material.dispose();
+      this.passes = [];
+    }
+  }
+}
+const X = `
+  varying vec2 vUv;
+  void main() {
+    vUv = uv;
+    gl_Position = vec4(position, 1.0);
+  }
+`;
+class N {
+  constructor(e, t, i, o, r) {
+    s(this, "renderer");
+    s(this, "sourceMesh");
+    s(this, "passes", []);
+    s(this, "targetA");
+    s(this, "targetB");
+    // plane の内容を FBO に焼くための専用シーン
+    s(this, "localScene");
+    s(this, "localCamera");
+    s(this, "localMesh");
+    // エフェクトパス適用用シーン
+    s(this, "postScene");
+    s(this, "postCamera");
+    s(this, "postMesh");
+    s(this, "postGeo");
+    // main scene に表示するプロキシ
+    s(this, "proxyMesh");
+    s(this, "proxyMaterial");
+    s(this, "proxyGeo");
+    s(this, "mainScene");
+    /**
+     * 全 effect が enabled=false の時、PlaneComposer をスキップして sourceMesh を
+     * 直接 main scene で描画する状態（bypass）。 fullscreen pass 1 回ぶんを丸ごと
+     * 削減できる。effect が再度 enable された時は通常レンダリングに復帰する。
+     */
+    s(this, "_bypassed", !1);
+    /** dispose 済みフラグ。dispose 後の render / addEffect を no-op にする。 */
+    s(this, "_disposed", !1);
+    this.renderer = e, this.sourceMesh = t, this.mainScene = i;
+    const h = e.getPixelRatio(), l = Math.max(1, Math.floor(o * h)), n = Math.max(1, Math.floor(r * h)), c = {
+      minFilter: a.LinearFilter,
+      magFilter: a.LinearFilter,
+      format: a.RGBAFormat,
+      stencilBuffer: !1
+    };
+    this.targetA = new a.WebGLRenderTarget(l, n, c), this.targetB = new a.WebGLRenderTarget(l, n, c), this.localScene = new a.Scene(), this.localCamera = new a.OrthographicCamera(
+      -o / 2,
+      o / 2,
+      r / 2,
+      -r / 2,
+      0.1,
+      10
+    ), this.localCamera.position.set(0, 0, 1), this.localMesh = new a.Mesh(t.geometry, t.material), this.localMesh.position.set(0, 0, 0), this.localMesh.scale.copy(t.scale), this.localScene.add(this.localMesh), this.postScene = new a.Scene(), this.postCamera = new a.OrthographicCamera(-1, 1, 1, -1, 0, 1), this.postGeo = new a.PlaneGeometry(2, 2), this.postMesh = new a.Mesh(this.postGeo), this.postScene.add(this.postMesh), i.remove(t), this.proxyMaterial = new a.MeshBasicMaterial({
+      map: this.targetA.texture,
+      transparent: !0
+    }), this.proxyGeo = new a.PlaneGeometry(1, 1), this.proxyMesh = new a.Mesh(this.proxyGeo, this.proxyMaterial), this.proxyMesh.position.copy(t.position), this.proxyMesh.scale.copy(t.scale), this.proxyMesh.quaternion.copy(t.quaternion), i.add(this.proxyMesh);
+  }
+  addEffect(e) {
+    if (this._disposed)
+      throw new Error("[PlaneComposer] dispose 済みのインスタンスでは addEffect() できません。");
+    const t = new a.ShaderMaterial({
+      uniforms: {
+        tDiffuse: { value: null },
+        ...e.uniforms
+      },
+      vertexShader: X,
+      fragmentShader: e.fragmentShader,
+      transparent: !0
+    }), i = new R(t);
+    return this.passes.push(i), i;
+  }
+  /**
+   * 登録済みパスを 1 つ取り除いて material を dispose する。
+   * 存在しない pass を渡した時は何もしない。
+   */
+  removeEffect(e) {
+    if (this._disposed) return !1;
+    const t = this.passes.indexOf(e);
+    return t < 0 ? !1 : (this.passes.splice(t, 1), e.material.dispose(), !0);
+  }
+  /**
+   * bypass 状態に切り替える: sourceMesh を main scene に戻し proxyMesh を隠す。
+   * 全 effect が disabled の時に呼ばれ、PlaneComposer.render の fullscreen pass を
+   * まるごと省く (= 1 pass / 6.35M フラグメント分の節約)。
+   */
+  enterBypass() {
+    this._bypassed || (this.mainScene.add(this.sourceMesh), this.proxyMesh.visible = !1, this._bypassed = !0);
+  }
+  /** bypass 状態から通常レンダリングへ復帰する。 */
+  exitBypass() {
+    this._bypassed && (this.mainScene.remove(this.sourceMesh), this.proxyMesh.visible = !0, this._bypassed = !1);
+  }
+  render() {
+    if (this._disposed) return;
+    if (!this.sourceMesh.visible) {
+      this.proxyMesh.visible = !1;
+      return;
+    }
+    let e = 0;
+    for (const o of this.passes) o.enabled && e++;
+    if (e === 0) {
+      this.enterBypass();
+      return;
+    }
+    this.exitBypass(), this.proxyMesh.visible = !0, this.proxyMesh.position.copy(this.sourceMesh.position), this.proxyMesh.scale.copy(this.sourceMesh.scale), this.proxyMesh.quaternion.copy(this.sourceMesh.quaternion), this.localMesh.scale.copy(this.sourceMesh.scale), this.renderer.setRenderTarget(this.targetA), this.renderer.render(this.localScene, this.localCamera);
+    let t = this.targetA, i = this.targetB;
+    for (const o of this.passes) {
+      if (!o.enabled) continue;
+      o.material.uniforms.tDiffuse.value = t.texture, this.postMesh.material = o.material, this.renderer.setRenderTarget(i), this.renderer.render(this.postScene, this.postCamera);
+      const r = t;
+      t = i, i = r;
+    }
+    this.proxyMaterial.map = t.texture, this.renderer.setRenderTarget(null);
+  }
+  resize(e, t) {
+    if (this._disposed) return;
+    const i = this.renderer.getPixelRatio(), o = Math.max(1, Math.floor(e * i)), r = Math.max(1, Math.floor(t * i));
+    this.targetA.setSize(o, r), this.targetB.setSize(o, r), this.localCamera.left = -e / 2, this.localCamera.right = e / 2, this.localCamera.top = t / 2, this.localCamera.bottom = -t / 2, this.localCamera.updateProjectionMatrix();
+  }
+  dispose() {
+    if (!this._disposed) {
+      this._disposed = !0, this.mainScene.remove(this.proxyMesh), this._bypassed || this.mainScene.add(this.sourceMesh), this._bypassed = !1, this.targetA.dispose(), this.targetB.dispose(), this.postGeo.dispose(), this.proxyGeo.dispose(), this.proxyMaterial.dispose();
+      for (const e of this.passes)
+        e.material.dispose();
+      this.passes = [];
+    }
+  }
+}
+const S = new a.TextureLoader();
+S.setCrossOrigin("anonymous");
+const q = `
+  varying vec2 vUv;
+
+  void main() {
+    vUv = uv;
+    gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
+  }
+`, $ = `
+  uniform sampler2D uTexture;
+  uniform float uTime;
+  uniform vec2 uResolution;
+  varying vec2 vUv;
+
+  void main() {
+    vec4 texColor = texture2D(uTexture, vUv);
+    gl_FragColor = texColor;
+  }
+`;
+class K {
+  constructor(e, t, i, o, r = {}, h) {
+    s(this, "element");
+    s(this, "texture");
+    s(this, "mesh");
+    s(this, "geometry");
+    s(this, "material");
+    s(this, "scene");
+    s(this, "clock");
+    s(this, "positionCalculator");
+    s(this, "canvasRect");
+    s(this, "isVisible");
+    s(this, "updateRectEveryFrame");
+    s(this, "observer");
+    s(this, "destroyed");
+    s(this, "planeComposer", null);
+    s(this, "renderer");
+    s(this, "effects", []);
+    /**
+     * effect.update に渡す mouse UV のスクラッチ。
+     * `material.uniforms.uMouseUV.value` を直接渡すと effect 側で `.set()` 等の破壊的操作で
+     * plane の uniform が書き換わる事故が起きうるため、毎フレ copy したスクラッチを渡す。
+     */
+    s(this, "_effectMouseUV", new a.Vector2());
+    /**
+     * effect の `setupGUI` 呼び出し時に root GUI を渡すための provider。
+     * WebGLApp.createPlane() でセットされる。null の時は GUI を作らない（showGUI: false 等）。
+     *
+     * lil-gui は optional peer の dynamic import なので Promise を返す。
+     * @internal
+     */
+    s(this, "guiProvider", null);
+    /** 自前で load した texture かどうか。destroy() で dispose してよいか判定する。 */
+    s(this, "ownsTexture", !1);
+    /**
+     * options.crossOrigin を指定された場合のみ生成する per-instance loader。
+     * 指定なしの場合は sharedTextureLoader をそのまま使う。
+     */
+    s(this, "crossOrigin");
+    if (this.element = e, this.scene = t, this.renderer = o, this.texture = null, this.destroyed = !1, this.updateRectEveryFrame = r.updateRectEveryFrame || !1, this.crossOrigin = r.crossOrigin, this.clock = h ?? new a.Clock(), this.canvasRect = i, this.positionCalculator = e ? new P(e, i) : null, this.isVisible = !e, this.observer = null, e) {
+      let c = !1;
+      const u = r.inViewRepeat ?? !1;
+      this.observer = new IntersectionObserver(
+        (f) => {
+          const p = f[0];
+          this.isVisible = p.isIntersecting, this.mesh.visible = this.isVisible, p.isIntersecting ? r.onInView && (!c || u) && (c = !0, r.onInView(this)) : u && (c = !1, r.onOutView?.(this));
+        },
+        { rootMargin: r.inViewRootMargin ?? "100%" }
+      ), this.observer.observe(e);
+    }
+    const l = r.segments ?? 1;
+    this.geometry = new a.PlaneGeometry(1, 1, l, l);
+    const n = {
+      uTexture: { value: null },
+      uAlpha: { value: 1 },
+      uResolution: { value: new a.Vector2() },
+      uTime: { value: 0 },
+      uIsHovered: { value: !1 },
+      uMouseUV: { value: new a.Vector2(0, 0) },
+      ...r.uniforms
+    };
+    this.material = new a.ShaderMaterial({
+      transparent: !0,
+      uniforms: n,
+      vertexShader: r.vertexShader || q,
+      fragmentShader: r.fragmentShader || $
+    }), this.mesh = new a.Mesh(this.geometry, this.material), this.mesh.visible = this.isVisible, this.scene.add(this.mesh), this.init();
+  }
+  /**
+   * Phase B-read (DOM read): getBoundingClientRect 等のレイアウト読み取りのみを行う。
+   * Core.animate では paint 直前にまとめて呼ばれ、その直後に _tickApply が走る。
+   *
+   * **更新条件**: `updateRectEveryFrame: true` のときのみ毎フレ更新する。
+   * static 要素は document 座標で固定 / fixed 要素は viewport 座標で固定なので、
+   * 自身の CSS animation 等で動的に位置が変わるケースのみフラグを true に。
+   * (旧仕様では isFixed のとき自動的に毎フレ更新していたが、多くの場合不要な
+   *  layout 強制になっていたため明示フラグ駆動に変更)
+   * @internal Core.animate から呼ばれる。
+   */
+  _tickRead() {
+    !this.isVisible || !this.positionCalculator || this.updateRectEveryFrame && this.positionCalculator.updatePositionInfo();
+  }
+  /**
+   * Phase B-apply: mesh.position と uniforms の書き込み。DOM には触れない。
+   * @internal Core.animate から呼ばれる。
+   */
+  _tickApply(e, t, i) {
+    this.isVisible && (this.material.uniforms.uTime.value = e, this.positionCalculator && this.setPosition(t, i));
+  }
+  /**
+   * Phase C (PlaneComposer render): main scene レンダリング前に
+   * 自前の plane をローカル FBO に焼いてエフェクトを通す。
+   * @internal Core.animate から呼ばれる。
+   */
+  _tickRenderComposer() {
+    this.isVisible && this.planeComposer?.render();
+  }
+  init() {
+    this.loadTexture(), this.resize();
+  }
+  loadTexture() {
+    const e = this.element?.getAttribute("data-texture");
+    if (e) {
+      let t;
+      this.crossOrigin !== void 0 ? (t = new a.TextureLoader(), t.setCrossOrigin(this.crossOrigin)) : t = S, t.load(
+        e,
+        (i) => {
+          if (this.destroyed) {
+            i.dispose();
+            return;
+          }
+          this.texture = i, this.ownsTexture = !0, this.material.uniforms.uTexture.value = i;
+        },
+        void 0,
+        (i) => {
+          console.error(`Failed to load texture: ${e}`, i);
+        }
+      );
+    } else this.material.uniforms.uTexture.value && (this.texture = this.material.uniforms.uTexture.value, this.ownsTexture = !1);
+  }
+  updateSize() {
+    if (this.positionCalculator) {
+      const e = this.positionCalculator.rect;
+      this.mesh.scale.set(e.width, e.height, 1), this.material.uniforms.uResolution.value.set(e.width, e.height);
+    } else
+      this.mesh.scale.set(this.canvasRect.width, this.canvasRect.height, 1), this.material.uniforms.uResolution.value.set(
+        this.canvasRect.width,
+        this.canvasRect.height
+      );
+  }
+  setPosition(e, t) {
+    if (!this.positionCalculator) return;
+    const { x: i, y: o } = this.positionCalculator.calculateWebGLPosition(
+      e,
+      t
+    );
+    this.mesh.position.set(i, o, 0);
+  }
+  setCanvasRect(e) {
+    this.canvasRect = e, this.positionCalculator && this.positionCalculator.setCanvasRect(e);
+  }
+  resize() {
+    if (this.positionCalculator) {
+      this.positionCalculator.refreshPositionType(), this.positionCalculator.updatePositionInfo();
+      const e = window.scrollY, t = window.scrollX;
+      this.updateSize(), this.setPosition(t, e);
+    } else
+      this.updateSize(), this.mesh.position.set(0, 0, 0);
+    if (this.planeComposer) {
+      const e = this.positionCalculator?.rect ?? this.canvasRect;
+      this.planeComposer.resize(e.width, e.height);
+      for (const t of this.effects)
+        t.resize?.(e.width, e.height);
+    }
+  }
+  getMesh() {
+    return this.mesh;
+  }
+  /**
+   * テクスチャを差し替える。
+   * 直接 `material.uniforms.uTexture.value = tex` する代わりに使うと、
+   * 旧テクスチャの所有権（自前 load かどうか）を考慮して安全に dispose してくれる。
+   *
+   * @param texture 新しい texture
+   * @param takeOwnership true なら destroy() 時にこの texture も dispose する。
+   *                      他で使い回す texture を渡すときは false。
+   */
+  /**
+   * 現在の `data-texture` 属性を再読込してマテリアルに反映する。
+   * SPA で plane を貼ったまま画像 URL だけ差し替えたいケース用。
+   * 旧 texture が自前 load の場合は dispose する。属性が無ければ何もしない。
+   */
+  reloadTexture() {
+    this.texture && this.ownsTexture && (this.texture.dispose(), this.texture = null, this.material.uniforms.uTexture.value = null, this.ownsTexture = !1), this.loadTexture();
+  }
+  setTexture(e, t = !1) {
+    this.texture && this.ownsTexture && this.texture !== e && this.texture.dispose(), this.texture = e, this.ownsTexture = t, this.material.uniforms.uTexture.value = e;
+  }
+  /**
+   * 紐づけられたエフェクトに update を流す。Core.animate から呼ばれる。
+   *
+   * 引数 `globalMouse` は canvas 全体の UV（0〜1, Y-up）。これを **plane ローカルの UV** に変換して
+   * effect.update に渡す。これで FluidEffect 等が plane の中の座標として mouse を扱える。
+   *
+   * - フルスクリーン plane（element 無し）: そのまま globalMouse を渡す
+   * - DOM 配置 plane: 自分の DOM rect と canvasRect から local UV を算出
+   * - マウスが plane の外にいる時は **last value を据え置き**（uv 更新せず）。
+   *   これにより solver 側で delta が 0 になり force が立たない、自然な挙動になる。
+   *
+   * 注意: raycast には依存しない。PlaneComposer が sourceMesh を main scene から外すと
+   * raycast が思った通り当たらないケースがあるため。
+   *
+   * scrollX/Y は Core.animate が 1 rAF tick 上で 1 回確定したスナップショット値を渡す。
+   * ここで `window.scrollX/Y` を直接読むと
+   *（同一 frame で全コンポーネントが同じ scroll 値を共有する）を壊すため必ず引数経由。
+   * 後方互換のため省略可能だが、その場合は window から読む (= 古い挙動)。
+   */
+  updateEffects(e, t, i = window.scrollX, o = window.scrollY) {
+    if (this.effects.length === 0) return;
+    if (t)
+      if (this.positionCalculator) {
+        const l = this.positionCalculator, n = this.canvasRect, c = l.rect.width, u = l.rect.height;
+        if (n.width > 0 && n.height > 0 && c > 0 && u > 0) {
+          const f = l.isFixed ? l.pageLeft : l.pageLeft - i, p = l.isFixed ? l.pageTop : l.pageTop - o, T = (f - n.left) / n.width, E = (p - n.top) / n.height, I = c / n.width, _ = u / n.height, A = 1 - E - _, m = (t.x - T) / I, g = (t.y - A) / _;
+          m >= 0 && m <= 1 && g >= 0 && g <= 1 && this.material.uniforms.uMouseUV.value.set(m, g);
+        }
+      } else
+        this.material.uniforms.uMouseUV.value.copy(t);
+    const r = this.material.uniforms.uMouseUV.value;
+    this._effectMouseUV.copy(r);
+    const h = this.effects;
+    for (let l = 0, n = h.length; l < n; l++) {
+      const c = h[l];
+      c.enabled && c.update(e, this._effectMouseUV);
+    }
+  }
+  /** 直近の plane ローカル UV を取得（updateEffects 内で算出された値、0〜1）。 */
+  getMouseUV() {
+    return this.material.uniforms.uMouseUV.value;
+  }
+  /** マウスが現在 plane の上に乗っているかどうか。 */
+  isHovered() {
+    return this.material.uniforms.uIsHovered.value;
+  }
+  setHoverInfo(e, t) {
+    this.material.uniforms.uIsHovered.value = e, t && this.material.uniforms.uMouseUV.value.copy(t);
+  }
+  enableEffects() {
+    if (this.planeComposer) return this.planeComposer;
+    const e = this.positionCalculator?.rect ?? this.canvasRect;
+    return this.planeComposer = new N(
+      this.renderer,
+      this.mesh,
+      this.scene,
+      e.width,
+      e.height
+    ), this.planeComposer;
+  }
+  addEffect(e) {
+    const t = this.enableEffects();
+    e._setRenderer?.(this.renderer), e._register(t);
+    const i = this.positionCalculator?.rect ?? this.canvasRect;
+    return e.resize?.(i.width, i.height), this.guiProvider && e.setupGUI && this.guiProvider().then((o) => {
+      this.destroyed || e.setupGUI(o);
+    }).catch((o) => {
+      console.warn(
+        "[DomPlane] effect.setupGUI に渡す lil-gui の読み込みに失敗しました。npm install lil-gui してください。",
+        o
+      );
+    }), this.effects.push(e), e;
+  }
+  /**
+   * `addEffect()` で登録した effect を取り除き、pass material を dispose する。
+   * 登録されていない effect を渡した時は何もしない（戻り値 false）。
+   */
+  removeEffect(e) {
+    const t = this.effects.indexOf(e);
+    if (t < 0) return !1;
+    this.effects.splice(t, 1);
+    const i = e.getPass();
+    return i && this.planeComposer && this.planeComposer.removeEffect(i), e.dispose?.(), !0;
+  }
+  /**
+   * WebGLApp.createPlane() から呼ばれる。GUI lazy 取得関数を渡す。
+   * null を渡すと GUI 統合を無効化（showGUI: false 相当）。
+   * @internal
+   */
+  _setGuiProvider(e) {
+    this.guiProvider = e;
+  }
+  destroy() {
+    if (!this.destroyed) {
+      this.destroyed = !0, this.observer?.disconnect();
+      for (const e of this.effects)
+        e.dispose?.();
+      this.effects = [], this.planeComposer && (this.planeComposer.dispose(), this.planeComposer = null), this.scene.remove(this.mesh), this.geometry.dispose(), this.material.dispose(), this.texture && this.ownsTexture && this.texture.dispose(), this.texture = null;
+    }
+  }
+}
+class J {
+  constructor(e, t, i, o) {
+    s(this, "element");
+    s(this, "model");
+    s(this, "loader");
+    s(this, "mainScene");
+    s(this, "canvasRect");
+    s(this, "options");
+    s(this, "isVisible");
+    s(this, "positionCalculator");
+    s(this, "updateRectEveryFrame");
+    s(this, "observer");
+    s(this, "destroyed");
+    this.element = e, this.mainScene = t, this.canvasRect = i, this.model = null, this.loader = new Y(), this.options = {
+      scale: y,
+      // DEFAULT_OFFSET をそのまま参照すると、複数 Dom3DObject インスタンスが
+      // 同一オブジェクトを共有してしまう。誰かが `obj.options.offset.x = 5` で
+      // 書き換えると DEFAULT_OFFSET 自身が変わり、以後の全インスタンスに伝播する。
+      // インスタンスごとに copy して隔離する。
+      offset: { ...V },
+      ...o
+    }, this.updateRectEveryFrame = o.updateRectEveryFrame ?? !1, this.positionCalculator = e ? new P(e, i) : null, this.isVisible = !e, this.destroyed = !1, this.observer = null, e && (this.observer = new IntersectionObserver(
+      (r) => {
+        this.isVisible = r[0].isIntersecting, this.model && (this.model.visible = this.isVisible);
+      },
+      { rootMargin: "100%" }
+    ), this.observer.observe(e)), this.loadModel();
+  }
+  /**
+   * Phase B-read (DOM read): getBoundingClientRect のみ。
+   * Core.animate で paint 直前にまとめて呼ばれる。
+   * element=null の場合は何もしない（scene 原点固定で DOM 追従不要）。
+   *
+   * **更新条件**: `updateRectEveryFrame: true` のときのみ毎フレ更新。
+   * 自身の CSS animation で動的に位置が変わるケースのみ true に。
+   * (旧仕様では isFixed で自動毎フレ更新していたが、多くの場合不要な layout 強制
+   *  になっていたため明示フラグ駆動に変更)
+   * @internal Core.animate から呼ばれる。
+   */
+  _tickRead() {
+    !this.model || !this.isVisible || !this.positionCalculator || this.updateRectEveryFrame && this.positionCalculator.updatePositionInfo();
+  }
+  /**
+   * Phase B-apply: model.position の書き込み。
+   * DOM あり/なしどちらでも `setPosition` を呼ぶ。setPosition 内部で positionCalculator の
+   * null を扱うため、DOM なしは offset のみ反映される（後から options.offset を書き換えても
+   * 毎フレ反映される一貫性を担保）。
+   * @internal Core.animate から呼ばれる。
+   */
+  _tickApply(e, t) {
+    !this.model || !this.isVisible || this.setPosition(e, t);
+  }
+  loadModel() {
+    const e = this.options.modelPath;
+    if (!e) {
+      console.error("Dom3DObject: modelPath が指定されていません。");
+      return;
+    }
+    this.loader.load(
+      e,
+      (t) => {
+        this.destroyed || (this.model = t.scene, this.setupModel());
+      },
+      void 0,
+      // GLTFLoader の onError は ProgressEvent / ErrorEvent / Error など複数型を渡してくる。
+      // ErrorEvent 固定で受けると `.message` が undefined のケースで static 型上の嘘になる。
+      (t) => {
+        console.error(`Failed to load model: ${e}`, t);
+      }
+    );
+  }
+  setupModel() {
+    if (this.model) {
+      if (this.positionCalculator) {
+        this.positionCalculator.refreshPositionType(), this.positionCalculator.updatePositionInfo();
+        const e = new a.Box3().setFromObject(this.model), t = new a.Vector3(), i = new a.Vector3();
+        e.getSize(t), e.getCenter(i);
+        const o = Math.max(t.x, t.y, t.z) || 1, r = this.model;
+        r.position.sub(i).multiplyScalar(1 / o), r.scale.multiplyScalar(1 / o);
+        const h = new a.Group();
+        h.add(r), this.model = h;
+      }
+      this.model.visible = this.isVisible, this.mainScene.add(this.model), this.applyScale(), this.setPosition(window.scrollX, window.scrollY);
+    }
+  }
+  applyScale() {
+    if (!this.model) return;
+    const e = this.options.scale ?? y;
+    if (this.positionCalculator) {
+      const { width: t, height: i } = this.positionCalculator.rect, h = ((this.options.fitMode ?? "maxSide") === "contain" ? Math.min(t, i) : Math.max(t, i)) * e;
+      this.model.scale.set(h, h, h);
+    } else
+      this.model.scale.set(e, e, e);
+  }
+  setPosition(e, t) {
+    if (!this.model) return;
+    const i = this.options.offset;
+    let o = i.x, r = i.y;
+    const h = i.z;
+    if (this.positionCalculator) {
+      const l = this.positionCalculator.calculateWebGLPosition(e, t);
+      o += l.x, r += l.y;
+    }
+    this.model.position.set(o, r, h);
+  }
+  setCanvasRect(e) {
+    this.canvasRect = e, this.positionCalculator?.setCanvasRect(e);
+  }
+  resize() {
+    if (!this.positionCalculator) {
+      this.applyScale();
+      return;
+    }
+    this.positionCalculator.refreshPositionType(), this.positionCalculator.updatePositionInfo(), this.applyScale(), this.setPosition(window.scrollX, window.scrollY);
+  }
+  getModel() {
+    return this.model;
+  }
+  destroy() {
+    this.destroyed || (this.destroyed = !0, this.observer?.disconnect(), this.model && (this.mainScene.remove(this.model), this.model.traverse((e) => {
+      if (!e.isMesh) return;
+      const t = e;
+      t.geometry.dispose();
+      const i = Array.isArray(t.material) ? t.material : [t.material];
+      for (const o of i)
+        o && (Q(o), o.dispose());
+    }), this.model = null));
+  }
+}
+function Q(d) {
+  const e = [
+    "map",
+    "alphaMap",
+    "aoMap",
+    "bumpMap",
+    "displacementMap",
+    "emissiveMap",
+    "envMap",
+    "lightMap",
+    "metalnessMap",
+    "normalMap",
+    "roughnessMap",
+    "specularMap",
+    "clearcoatMap",
+    "clearcoatNormalMap",
+    "clearcoatRoughnessMap",
+    "sheenColorMap",
+    "sheenRoughnessMap",
+    "transmissionMap",
+    "thicknessMap",
+    "iridescenceMap",
+    "iridescenceThicknessMap",
+    "anisotropyMap",
+    "matcap",
+    "gradientMap"
+  ], t = d;
+  for (const i of e) {
+    const o = t[i];
+    o && o.isTexture && o.dispose();
+  }
+}
+class Z {
+  constructor(e, t = {}) {
+    s(this, "container");
+    s(this, "_padding");
+    s(this, "_trackStrength");
+    s(this, "_strengthDecay");
+    s(this, "_strength", 0);
+    s(this, "_prevScrollY", 0);
+    s(this, "_prevTime", 0);
+    s(this, "_viewportWidth", 0);
+    s(this, "_viewportHeight", 0);
+    s(this, "_enabled", !0);
+    /**
+     * container の **元 CSS 指定** を window に対する比率として保持する。
+     *
+     * 例: container の CSS が `width: 100vw; height: 110vh` なら
+     *   _widthRatio = 1.0, _heightRatio = 1.1
+     *
+     * `applyContainerStyles()` で container は `position: absolute; width/height = JS制御`
+     * に書き換えられて以降「元の CSS による intrinsic size」は測れなくなる。よって
+     * **constructor 進入時** に getBoundingClientRect から ratio を snapshot し、以降の
+     * resize ではこの ratio を window 寸法に掛けて canvas 物理サイズを決める。
+     *
+     * これにより `#canvas { width: 100vw; height: 110vh; }` のような CSS が
+     * window resize / orientation 変更後も「100vw × 110vh」相当を保ち続ける。
+     */
+    s(this, "_widthRatio", 1);
+    s(this, "_heightRatio", 1);
+    /**
+     * 現在 transform / canvas 寸法に反映している padding 値（px）。
+     * クランプの出力。`_padding * viewportHeight` の上限と、document の余り
+     * 領域の最小から決まる。
+     */
+    s(this, "_effectivePaddingPx", 0);
+    /** 計算用の canvas rect（scroll transform を含まない論理 rect、effective padding 基準） */
+    s(this, "_logicalRect", new DOMRect());
+    /**
+     * effective padding が変わって canvas drawing buffer の resize が必要な時に呼ぶ callback。
+     * 引数は `{ width, height }`（drawing buffer の新サイズ = container の新サイズ）。
+     * Core 側でこれに `renderer.setSize` / `camera.resize` / `postEffect.resize` をぶら下げる。
+     */
+    s(this, "_onResize", null);
+    /**
+     * destroy 時の復元用に、constructor 進入時の inline style を退避しておく。
+     * ユーザーが先に `container.style.position = 'relative'` などを当てていた場合に、
+     * destroy で「空文字に潰す」ではなく元の値に戻すために必要。
+     */
+    s(this, "_originalStyles");
+    s(this, "_warnedStrength", !1);
+    this.container = e, this._padding = t.padding ?? 0, this._trackStrength = t.trackStrength ?? !1, this._strengthDecay = t.strengthDecay ?? 10, this._prevScrollY = window.scrollY, this._prevTime = performance.now() / 1e3;
+    const i = e.style;
+    this._originalStyles = {
+      position: i.position,
+      left: i.left,
+      top: i.top,
+      width: i.width,
+      height: i.height,
+      overflow: i.overflow,
+      transform: i.transform,
+      pointerEvents: i.pointerEvents,
+      willChange: i.willChange
+    };
+    const o = e.getBoundingClientRect();
+    window.innerWidth > 0 && o.width > 0 && (this._widthRatio = o.width / window.innerWidth), window.innerHeight > 0 && o.height > 0 && (this._heightRatio = o.height / window.innerHeight), this.applyContainerStyles(), this.updateSize();
+  }
+  applyContainerStyles() {
+    this.container.style.position = "absolute", this.container.style.left = "0", this.container.style.top = "0", this.container.style.overflow = "hidden", this.container.style.pointerEvents = "none", this.container.style.willChange = "transform";
+  }
+  /**
+   * ビューポートサイズが変わった時に呼ぶ。effective padding は requested で初期化し、
+   * 次の update() 呼び出しでクランプが効く。
+   *
+   * 引数を省略した場合は、constructor で snapshot した container の CSS ratio を
+   * window 寸法に掛けて自動算出する。明示的に値を渡せば override 可能（scrollbar を
+   * 差し引いた幅にしたい等のケース）。
+   */
+  updateSize(e, t) {
+    this._viewportWidth = e ?? window.innerWidth * this._widthRatio, this._viewportHeight = t ?? window.innerHeight * this._heightRatio;
+    const i = this._viewportHeight * this._padding;
+    this._effectivePaddingPx = i;
+    const o = this._viewportHeight + 2 * i;
+    this.container.style.width = `${this._viewportWidth}px`, this.container.style.height = `${o}px`, this._logicalRect = new DOMRect(
+      0,
+      -i,
+      this._viewportWidth,
+      o
+    ), this._onResize?.({ width: this._viewportWidth, height: o }), this.applyTransform(window.scrollX, window.scrollY);
+  }
+  /**
+   * 毎 rAF で呼ぶ。**plane の sceneY 計算と同一の scrollX/Y を渡すこと**。
+   * これが cancel の不変条件。
+   *
+   * padding clamp:
+   *   maxPaddingY = body.scrollHeight - scrollY - viewportHeight
+   *   effective   = clamp(requested, 0, maxPaddingY)
+   * effective が変わったら canvas drawing buffer も同期して resize する。
+   */
+  update(e, t) {
+    if (!this._enabled) return;
+    const i = this._viewportHeight * this._padding, o = Math.max(
+      0,
+      document.body.scrollHeight - t - this._viewportHeight
+    ), r = Math.min(i, o);
+    if (r !== this._effectivePaddingPx) {
+      this._effectivePaddingPx = r;
+      const h = this._viewportHeight + 2 * r;
+      this.container.style.height = `${h}px`, this._logicalRect = new DOMRect(
+        0,
+        -r,
+        this._viewportWidth,
+        h
+      ), this._onResize?.({ width: this._viewportWidth, height: h });
+    }
+    this.applyTransform(e, t), this._trackStrength && this.updateStrength(t);
+  }
+  applyTransform(e, t) {
+    this.container.style.transform = `translate3d(${e}px, ${t - this._effectivePaddingPx}px, 0)`;
+  }
+  /** スクロール速度ベースの strength 値を更新。 */
+  updateStrength(e) {
+    const t = e - this._prevScrollY, i = performance.now() / 1e3, o = i - this._prevTime;
+    if (o > 0) {
+      const r = Math.abs(t) * 10 / this._viewportHeight;
+      this._strength *= Math.exp(-o * this._strengthDecay), this._strength += Math.min(r, 5);
+    }
+    this._prevScrollY = e, this._prevTime = i;
+  }
+  /**
+   * canvas drawing buffer の resize が必要な時に呼ばれる callback を登録する。
+   * @internal Core 側で renderer.setSize / camera.resize / postEffect.resize を繋ぐ。
+   */
+  setResizeCallback(e) {
+    this._onResize = e;
+  }
+  /**
+   * DomPositionCalculator 用の **論理** rect。
+   *
+   * **注意**: これは「ブラウザ上での canvas の getBoundingClientRect」ではない。
+   * `top = -effectivePadding`, `height = viewport + 2 * effectivePadding` で、
+   * scroll に追従して動く container 内のローカル座標系を表す。effective padding は
+   * 末尾近くで自動的に縮む。
+   */
+  get logicalRect() {
+    return this._logicalRect;
+  }
+  /** 現在の effective padding（px）。テスト・デバッグ用。 */
+  get effectivePadding() {
+    return this._effectivePaddingPx;
+  }
+  /**
+   * 現在のスクロール速度（0〜1 にクランプ）。
+   *
+   * **`trackStrength: false` で構築している場合は常に 0 を返す**。値を使いたい場合は
+   * options で trackStrength を true にして構築すること。DEV では誤用防止のため
+   * 1 度だけ console.warn を出す。
+   */
+  get strength() {
+    return this._trackStrength ? Math.min(1, this._strength) : 0;
+  }
+  get padding() {
+    return this._padding;
+  }
+  /**
+   * 入力受付の有効/無効。
+   *
+   * disable 中は `update()` が no-op になり container の transform は触らない（disable 直前の
+   * 位置で固定される）。enable に戻したフレから transform 更新が再開する。
+   *
+   * disable で「container を素の状態に戻したい」場合は `destroy()` を呼ぶこと。
+   */
+  set enabled(e) {
+    this._enabled = e;
+  }
+  get enabled() {
+    return this._enabled;
+  }
+  destroy() {
+    const e = this._originalStyles, t = this.container.style;
+    t.position = e.position, t.left = e.left, t.top = e.top, t.width = e.width, t.height = e.height, t.overflow = e.overflow, t.transform = e.transform, t.pointerEvents = e.pointerEvents, t.willChange = e.willChange;
+  }
+}
+class oe {
+  constructor(e, t = {}) {
+    s(this, "container");
+    s(this, "canvas");
+    s(this, "scene");
+    s(this, "renderer");
+    s(this, "camera");
+    s(this, "light");
+    s(this, "controls");
+    s(this, "updateCallbacks");
+    s(this, "resizeCallbacks");
+    s(this, "rect");
+    s(this, "domPlanes");
+    s(this, "dom3DObjects");
+    s(this, "clock");
+    s(this, "scrollSync", null);
+    s(this, "options");
+    s(this, "rafId", 0);
+    s(this, "resizeTimer", null);
+    s(this, "eventAbort", new AbortController());
+    /**
+     * mousemove listener 専用の AbortController。`setMouseTrackingEnabled()` で動的に
+     * detach 可能にするため `eventAbort` とは別に持つ。null の時は attach 済みでない。
+     */
+    s(this, "_mouseAbort", null);
+    /**
+     * canvas の viewport 上の矩形をキャッシュ。mousemove ごとに `getBoundingClientRect`
+     * を呼ぶと layout 強制が走るため、resize 時 + (ScrollSync 無効時の) scroll 時に
+     * invalidate する形にしてフィールドアクセスで済むようにする。
+     * ScrollSync 有効時は canvas viewport rect が固定 (RafScroll が同 rAF tick で
+     * scrollTo するため paint 時 actual と JS rAF が一致 → 動かない) なので
+     * scroll 時の invalidate は不要。
+     */
+    s(this, "_canvasRect", null);
+    s(this, "mouse");
+    s(this, "prevMouse");
+    /**
+     * マウスが canvas 矩形の内側に居るか。mousemove イベントごとに更新し、
+     * rAF tick 内の raycaster はこのフラグで実行を決める。
+     * (uMouseUV の更新を完全に rAF 駆動にすることで paint と同期させ、
+     *  「mousemove 非同期発火による uniform のちらつき」を消す)
+     */
+    s(this, "_mouseInside", !1);
+    /** raycaster で使う NDC バッファ (毎フレ allocate を避ける) */
+    s(this, "_ndcBuf", new a.Vector2());
+    /** getMouseDelta の戻り値スクラッチ (毎フレ clone を避ける) */
+    s(this, "_mouseDeltaBuf", new a.Vector2());
+    s(this, "raycaster");
+    s(this, "hoveredPlane");
+    s(this, "domPlaneMeshes", []);
+    s(this, "postEffect", null);
+    s(this, "internalComposer", null);
+    s(this, "effects", []);
+    s(this, "stats", null);
+    /**
+     * lil-gui の root インスタンス。
+     * showGUI が false なら null のまま。最初の `setupGUI` を持つ effect が
+     * `addEffect()` 経由で登録された瞬間に生成する（lazy + dynamic import）。
+     */
+    s(this, "gui", null);
+    /**
+     * lil-gui の dynamic import promise。複数 effect の addEffect が同時に来た時、
+     * 二重 load を防ぐ。一度 resolve したら次回以降は `this.gui` を直接返す。
+     */
+    s(this, "_guiLoadPromise", null);
+    /**
+     * destroy 済みフラグ。animate() 実行中に user callback から destroy() が
+     * 呼ばれると、renderer.dispose() 後の続きで renderer.render() を呼んで
+     * WebGL エラーになる。各段階の冒頭で見て早期 return する。
+     */
+    s(this, "destroyed", !1);
+    s(this, "invalidateCanvasRect", () => {
+      this._canvasRect = null;
+    });
+    /**
+     * ScrollSync の動的 padding clamp で canvas 寸法が変わった時に呼ばれる。
+     *
+     * window resize（onResize）と違い、DOM の位置や element 側の bbox は変わっていない。
+     * 必要なのは「canvas drawing buffer のサイズに依存するもの」だけ:
+     *   - renderer.setSize（drawing buffer + canvas.style.{width,height}）
+     *   - camera の aspect / distance（rect.height に応じて変わる）
+     *   - postEffect の RT サイズ
+     *   - 各 effect の RT サイズ
+     *
+     * DomPlane の DOM 連動 plane は positionCalculator の bbox に依存していて canvas 高さに
+     * 依存しないので触らない（calculateWebGLPosition の数式が padding を相殺するため不変）。
+     * フルスクリーン plane（element=null）は canvasRect.width/height をスケールに使うので、
+     * その分だけ canvasRect 参照を更新する。
+     */
+    s(this, "_onScrollSyncResize", () => {
+      if (this.destroyed || !this.scrollSync || (this.rect = this.scrollSync.logicalRect, this.rect.width <= 0 || this.rect.height <= 0)) return;
+      this.camera.resize(this.rect), this.renderer.setSize(this.rect.width, this.rect.height);
+      for (let t = 0, i = this.domPlanes.length; t < i; t++) {
+        const o = this.domPlanes[t];
+        o.setCanvasRect(this.rect), o.element || o.resize();
+      }
+      for (let t = 0, i = this.dom3DObjects.length; t < i; t++)
+        this.dom3DObjects[t].setCanvasRect(this.rect);
+      this.postEffect?.resize(this.rect.width, this.rect.height);
+      const e = this.effects;
+      for (let t = 0, i = e.length; t < i; t++)
+        e[t].resize?.(this.rect.width, this.rect.height);
+    });
+    s(this, "animate", () => {
+      if (this.destroyed) return;
+      this.rafId = requestAnimationFrame(this.animate), this.stats?.begin(), this.controls && this.controls.update();
+      const e = this.domPlanes, t = this.dom3DObjects, i = window.scrollX, o = window.scrollY;
+      this._updateHoverFromMouse();
+      const r = this.updateCallbacks;
+      for (let n = 0, c = r.length; n < c; n++)
+        r[n]();
+      const h = this.clock.getElapsedTime(), l = this.effects;
+      for (let n = 0, c = l.length; n < c; n++) {
+        const u = l[n];
+        u.enabled && u.update(h, this.mouse);
+      }
+      this.scrollSync?.update(i, o);
+      for (let n = 0, c = e.length; n < c; n++)
+        e[n]._tickRead();
+      for (let n = 0, c = t.length; n < c; n++)
+        t[n]._tickRead();
+      for (let n = 0, c = e.length; n < c; n++)
+        e[n].updateEffects(h, this.mouse, i, o);
+      for (let n = 0, c = e.length; n < c; n++)
+        e[n]._tickApply(h, i, o);
+      for (let n = 0, c = t.length; n < c; n++)
+        t[n]._tickApply(i, o);
+      for (let n = 0, c = e.length; n < c; n++)
+        e[n]._tickRenderComposer();
+      if (this.destroyed) {
+        this.stats?.end();
+        return;
+      }
+      this.postEffect ? this.postEffect.render(this.scene, this.camera.instance) : this.renderer.render(this.scene, this.camera.instance), this.prevMouse.copy(this.mouse), this.stats?.end();
+    });
+    const i = typeof e == "string" ? document.querySelector(e) : e;
+    if (!i)
+      throw new Error(`Container not found: ${e}`);
+    if (this.container = i, this.canvas = document.createElement("canvas"), this.container.appendChild(this.canvas), this.rect = this.container.getBoundingClientRect(), this.scene = new a.Scene(), this.renderer = new a.WebGLRenderer({
+      canvas: this.canvas,
+      antialias: !0,
+      alpha: !0
+    }), this.camera = new C(this.rect), this.light = new B(this.scene), this.controls = null, this.updateCallbacks = [], this.resizeCallbacks = [], this.domPlanes = [], this.dom3DObjects = [], this.clock = new a.Clock(), this.options = { enableMouseTracking: !0, showGUI: !0, ...t }, this.mouse = new a.Vector2(0.5, 0.5), this.prevMouse = new a.Vector2(0.5, 0.5), this.raycaster = new a.Raycaster(), this.hoveredPlane = null, t.scrollSync) {
+      const o = typeof t.scrollSync == "object" ? t.scrollSync : {};
+      this.scrollSync = new Z(this.container, o), this.rect = this.scrollSync.logicalRect, this.scrollSync.setResizeCallback(() => this._onScrollSyncResize());
+    }
+    this.init(), t.showStats && import("stats.js").then(({ default: o }) => {
+      this.destroyed || (this.stats = new o(), this.stats.showPanel(0), (t.statsParent ?? document.body).appendChild(this.stats.dom));
+    }).catch((o) => {
+      console.warn(
+        "[WebGLApp] showStats: true ですが stats.js が読み込めませんでした。npm install stats.js してください。",
+        o
+      );
+    }), this.setupEventListeners(), this.animate();
+  }
+  init() {
+    this.scene.background = null, this.renderer.setSize(this.rect.width, this.rect.height), this.renderer.setPixelRatio(
+      Math.min(window.devicePixelRatio, this.options.maxPixelRatio ?? 2)
+    ), this.camera.resize(this.rect), this.renderer.outputColorSpace = this.options.outputColorSpace ?? a.SRGBColorSpace;
+  }
+  // sceneのgetterを追加
+  getScene() {
+    return this.scene;
+  }
+  // カメラのgetterを追加
+  getCamera() {
+    return this.camera;
+  }
+  // rendererのgetterを追加
+  getRenderer() {
+    return this.renderer;
+  }
+  // lightのgetterを追加
+  getLight() {
+    return this.light;
+  }
+  // canvasサイズを追加
+  getViewPort() {
+    return this.rect;
+  }
+  // マウス座標を取得（UV座標: 0~1）
+  getMouse() {
+    return this.mouse;
+  }
+  // 前回のマウス座標を取得（UV座標: 0~1）
+  getPrevMouse() {
+    return this.prevMouse;
+  }
+  // マウス移動量を取得。内部スクラッチを使い回すので、保持したい場合は呼び出し側で clone する。
+  getMouseDelta() {
+    return this._mouseDeltaBuf.copy(this.mouse).sub(this.prevMouse);
+  }
+  // ScrollSyncを取得
+  getScrollSync() {
+    return this.scrollSync;
+  }
+  // オブジェクトを追加するメソッド
+  addObject(e) {
+    this.scene.add(e);
+  }
+  // オブジェクトを削除するメソッド
+  removeObject(e) {
+    this.scene.remove(e);
+  }
+  // DomPlaneを作成するメソッド
+  createPlane(e, t) {
+    if (this.destroyed)
+      throw new Error("[WebGLApp] createPlane(): destroy 済みのインスタンスでは使えません。");
+    let i = null;
+    if (e != null && (i = typeof e == "string" ? document.querySelector(e) : e, !i))
+      throw new Error(`Element not found: ${e}`);
+    const o = new K(
+      i,
+      this.scene,
+      this.rect,
+      this.renderer,
+      t,
+      this.clock
+    );
+    return this.options.showGUI !== !1 && o._setGuiProvider(() => this._ensureGUIAsync()), this.domPlanes.push(o), i && this.domPlaneMeshes.push(o.getMesh()), o;
+  }
+  // DomPlaneを削除するメソッド
+  removePlane(e) {
+    if (this.destroyed) return;
+    const t = this.domPlanes.indexOf(e);
+    if (t > -1) {
+      this.domPlanes.splice(t, 1);
+      const i = this.domPlaneMeshes.indexOf(e.getMesh());
+      i > -1 && this.domPlaneMeshes.splice(i, 1), e.destroy();
+    }
+  }
+  // Dom3DObject を作成する。
+  // - selector あり (string / HTMLElement): DOM 要素位置に追従。
+  // - selector が null/undefined: scene 原点に固定 (viewport 中心固定の使い方)。
+  //   ScrollSync 有効時でも、Lenis のような virtual scroll で JS rAF と paint の
+  //   scrollY が同一に揃っていれば container は viewport に完璧固定され、scene 原点
+  //   固定 obj も視覚的に viewport 固定として機能する。
+  create3DObject(e, t) {
+    if (this.destroyed)
+      throw new Error("[WebGLApp] create3DObject(): destroy 済みのインスタンスでは使えません。");
+    let i = null;
+    if (e != null && (i = typeof e == "string" ? document.querySelector(e) : e, !i))
+      throw new Error(`Element not found: ${e}`);
+    const o = new J(
+      i,
+      this.scene,
+      this.rect,
+      t
+    );
+    return this.dom3DObjects.push(o), o;
+  }
+  // Dom3DObjectを削除するメソッド
+  remove3DObject(e) {
+    if (this.destroyed) return;
+    const t = this.dom3DObjects.indexOf(e);
+    t > -1 && (this.dom3DObjects.splice(t, 1), e.destroy());
+  }
+  // アニメーションループに更新処理を追加するメソッド（戻り値で削除可能）
+  addUpdateCallback(e) {
+    return this.destroyed ? () => {
+    } : (this.updateCallbacks.push(e), () => {
+      const t = this.updateCallbacks.indexOf(e);
+      t > -1 && this.updateCallbacks.splice(t, 1);
+    });
+  }
+  // リサイズ時の処理を追加するメソッド（戻り値で削除可能）
+  addResizeCallback(e) {
+    return this.destroyed ? () => {
+    } : (this.resizeCallbacks.push(e), () => {
+      const t = this.resizeCallbacks.indexOf(e);
+      t > -1 && this.resizeCallbacks.splice(t, 1);
+    });
+  }
+  // OrbitControlsを有効化するメソッド
+  enableOrbitControls() {
+    if (this.destroyed)
+      throw new Error("[WebGLApp] enableOrbitControls(): destroy 済みのインスタンスでは使えません。");
+    return this.controls || (this.scrollSync && (this.canvas.style.pointerEvents = "auto"), this.controls = new O(this.camera.instance, this.canvas)), this.controls;
+  }
+  // OrbitControlsを取得するメソッド
+  getControls() {
+    return this.controls;
+  }
+  /**
+   * canvas 全体にエフェクトを追加する。
+   * 内部で EffectComposer を自動生成するため、別途 setPostEffect は不要。
+   *
+   * **注意**: `setPostEffect()` でカスタム postEffect を入れている状態でこれを呼ぶと、
+   * 自動生成された EffectComposer で上書きされる（カスタム postEffect の dispose は
+   * 呼ばれない＝呼び出し側の責務）。両 API の併用は避けること。
+   */
+  addEffect(e) {
+    if (this.destroyed)
+      throw new Error("[WebGLApp] addEffect(): destroy 済みのインスタンスでは使えません。");
+    return this.postEffect && this.postEffect !== this.internalComposer && console.warn("[WebGLApp] addEffect() を呼ぶ前に setPostEffect() でカスタム postEffect が設定されています。内部 EffectComposer で上書きします。カスタム postEffect は手動で dispose してください。"), this.internalComposer || (this.internalComposer = new j(
+      this.renderer,
+      this.rect.width,
+      this.rect.height
+    ), this.postEffect = this.internalComposer), e._setRenderer?.(this.renderer), e._register(this.internalComposer), e.resize?.(this.rect.width, this.rect.height), this.options.showGUI && e.setupGUI && this._ensureGUIAsync().then((t) => {
+      this.destroyed || e.setupGUI(t);
+    }).catch((t) => {
+      console.warn(
+        "[WebGLApp] showGUI: true ですが lil-gui が読み込めませんでした。npm install lil-gui してください。",
+        t
+      );
+    }), this.effects.push(e), e;
+  }
+  /**
+   * lil-gui を dynamic import で読み込み、root インスタンスを lazy 生成して返す。
+   * 同時に複数 effect から呼ばれても load promise を共有して 1 インスタンスにまとめる。
+   * @internal DomPlane.addEffect / WebGLApp.addEffect から呼ばれる。
+   */
+  _ensureGUIAsync() {
+    return this.gui ? Promise.resolve(this.gui) : (this._guiLoadPromise || (this._guiLoadPromise = import("lil-gui").then(({ default: e }) => (this.gui || (this.gui = new e({ title: this.options.guiTitle ?? "Effects" })), this.gui))), this._guiLoadPromise);
+  }
+  /**
+   * root の lil-gui インスタンスを取得 (sync)。
+   *
+   * **注意**: lil-gui は dynamic import で読み込むため、初回 effect 登録直後など
+   * load 中の段階では `null` を返す。確実にインスタンスを得たい場合は
+   * `getGUIAsync()` を使う。`showGUI: false` の場合は常に `null`。
+   */
+  getGUI() {
+    return this.options.showGUI === !1 ? null : this.gui;
+  }
+  /**
+   * lil-gui を必要に応じて load し、インスタンスを返す。
+   * `showGUI: false` の場合は `null` を resolve する。
+   */
+  getGUIAsync() {
+    return this.options.showGUI === !1 ? Promise.resolve(null) : this._ensureGUIAsync();
+  }
+  /**
+   * ポストエフェクトを設定（低レベル API）。
+   * 自前で `EffectLike`（render/resize/dispose）を実装したオブジェクトを差し込みたい場合のみ使用。
+   * 通常は `addEffect()` を使うこと。
+   *
+   * **注意**: `addEffect()` で追加済みのエフェクトがある状態で呼ぶと、
+   * 自動 EffectComposer を捨てて引数の postEffect に差し替える。既存 effect の
+   * dispose は呼ばれない（必要なら先に `clearEffects()` を呼ぶこと）。
+   */
+  setPostEffect(e) {
+    if (this.destroyed)
+      throw new Error("[WebGLApp] setPostEffect(): destroy 済みのインスタンスでは使えません。");
+    this.effects.length > 0 && (console.warn("[WebGLApp] setPostEffect() が呼ばれましたが、addEffect() で追加した effect が既に存在します。内部 EffectComposer を破棄してカスタム postEffect に差し替えます。事前に clearEffects() を呼ぶことを推奨します。"), this.clearEffects()), this.postEffect = e;
+  }
+  /**
+   * `addEffect()` で登録した effect を 1 つ取り除く。
+   *
+   * - 内部 EffectComposer から該当 pass を外し、material を dispose する
+   * - effect 自体の `dispose()` も呼ぶ（FluidEffect 等の RT も解放）
+   * - 全 effect が空になった場合、internalComposer はそのまま残す（次の addEffect で再利用）
+   *
+   * 登録されていない effect を渡した時は `false` を返して何もしない。
+   */
+  removeEffect(e) {
+    if (this.destroyed) return !1;
+    const t = this.effects.indexOf(e);
+    if (t < 0) return !1;
+    this.effects.splice(t, 1);
+    const i = e.getPass();
+    return i && this.internalComposer && this.internalComposer.removeEffect(i), e.dispose?.(), !0;
+  }
+  /**
+   * 登録されたエフェクトとポストエフェクトをすべて解除して破棄する。
+   * addEffect で追加した全 effect の dispose() を呼び、内部 EffectComposer も解放する。
+   */
+  clearEffects() {
+    if (!this.destroyed) {
+      for (const e of this.effects)
+        e.dispose?.();
+      this.effects = [], this.postEffect?.dispose(), this.postEffect = null, this.internalComposer = null;
+    }
+  }
+  /**
+   * @deprecated `clearEffects()` を使ってください。挙動は同一です。
+   */
+  removePostEffect() {
+    this.clearEffects();
+  }
+  setupEventListeners() {
+    const e = this.eventAbort.signal;
+    window.addEventListener(
+      "resize",
+      () => {
+        this.resizeTimer && clearTimeout(this.resizeTimer), this.resizeTimer = setTimeout(() => this.onResize(), 100);
+      },
+      { signal: e }
+    ), this.scrollSync || window.addEventListener("scroll", this.invalidateCanvasRect, {
+      signal: e,
+      passive: !0
+    }), this.options.enableMouseTracking && this.setMouseTrackingEnabled(!0);
+  }
+  /**
+   * mousemove tracking の動的な ON/OFF。
+   * - true: 未 attach なら mousemove listener を追加する
+   * - false: attach 済みなら detach する（hover も解除）
+   *
+   * `destroy()` 時は eventAbort と一緒に自動 detach される（_mouseAbort 個別 abort も呼ぶ）。
+   */
+  setMouseTrackingEnabled(e) {
+    if (!this.destroyed)
+      if (this.options.enableMouseTracking = e, e) {
+        if (this._mouseAbort) return;
+        this._mouseAbort = new AbortController(), window.addEventListener(
+          "mousemove",
+          (t) => this.onMouseMove(t),
+          { signal: this._mouseAbort.signal }
+        );
+      } else
+        this._mouseAbort?.abort(), this._mouseAbort = null, this._mouseInside = !1, this.hoveredPlane && (this.hoveredPlane.setHoverInfo(!1, null), this.hoveredPlane = null);
+  }
+  /** mousemove 等で頻繁に必要な canvas viewport rect を遅延 + キャッシュで返す。 */
+  getCanvasRect() {
+    return this._canvasRect || (this._canvasRect = this.canvas.getBoundingClientRect()), this._canvasRect;
+  }
+  onResize() {
+    if (this._canvasRect = null, this.scrollSync ? (this.scrollSync.updateSize(), this.rect = this.scrollSync.logicalRect) : this.rect = this.container.getBoundingClientRect(), this.rect.width <= 0 || this.rect.height <= 0) return;
+    this.camera.resize(this.rect), this.renderer.setSize(this.rect.width, this.rect.height), this.renderer.setPixelRatio(
+      Math.min(window.devicePixelRatio, this.options.maxPixelRatio ?? 2)
+    );
+    const e = this.domPlanes;
+    for (let r = 0, h = e.length; r < h; r++) {
+      const l = e[r];
+      l.setCanvasRect(this.rect), l.resize();
+    }
+    const t = this.dom3DObjects;
+    for (let r = 0, h = t.length; r < h; r++) {
+      const l = t[r];
+      l.setCanvasRect(this.rect), l.resize();
+    }
+    this.postEffect?.resize(this.rect.width, this.rect.height);
+    const i = this.effects;
+    for (let r = 0, h = i.length; r < h; r++)
+      i[r].resize?.(this.rect.width, this.rect.height);
+    const o = this.resizeCallbacks;
+    for (let r = 0, h = o.length; r < h; r++)
+      o[r]();
+  }
+  /**
+   * mousemove は **mouse 座標と canvas 内外フラグだけ** 更新する。
+   * raycaster / setHoverInfo は呼ばない (= uMouseUV を直接書かない)。
+   * uniform 更新は `_updateHoverFromMouse` 経由で rAF tick 内に集約することで、
+   * paint と完全同期させ「mousemove 非同期発火による uMouseUV のちらつき」を防ぐ。
+   */
+  onMouseMove(e) {
+    const t = this.getCanvasRect(), i = e.clientX >= t.left && e.clientX <= t.right && e.clientY >= t.top && e.clientY <= t.bottom;
+    this._mouseInside = i, i && (this.mouse.x = (e.clientX - t.left) / t.width, this.mouse.y = 1 - (e.clientY - t.top) / t.height);
+  }
+  /**
+   * rAF tick 内の Phase A で呼ばれる。最新の `this.mouse` を使って raycaster を投げ、
+   * hover 中の plane を判定 + `setHoverInfo` (= uMouseUV / uIsHovered の更新) する。
+   * mousemove イベントから切り離すことで全 plane の uniform が 1 tick = 1 確定値で
+   * 揃い、paint と同期する。
+   */
+  _updateHoverFromMouse() {
+    if (!this.options.enableMouseTracking || this.domPlaneMeshes.length === 0) return;
+    if (!this._mouseInside) {
+      this.hoveredPlane && (this.hoveredPlane.setHoverInfo(!1, null), this.hoveredPlane = null);
+      return;
+    }
+    this._ndcBuf.set(this.mouse.x * 2 - 1, this.mouse.y * 2 - 1), this.raycaster.setFromCamera(this._ndcBuf, this.camera.instance);
+    const e = this.raycaster.intersectObjects(this.domPlaneMeshes, !1);
+    if (e.length > 0) {
+      const t = e[0];
+      if (t.uv) {
+        const i = t.object, o = this.domPlanes.find((r) => r.getMesh() === i);
+        if (o) {
+          this.hoveredPlane && this.hoveredPlane !== o && this.hoveredPlane.setHoverInfo(!1, null), o.setHoverInfo(!0, t.uv), this.hoveredPlane = o;
+          return;
+        }
+      }
+    }
+    this.hoveredPlane && (this.hoveredPlane.setHoverInfo(!1, null), this.hoveredPlane = null);
+  }
+  destroy() {
+    if (!this.destroyed) {
+      this.destroyed = !0, cancelAnimationFrame(this.rafId), this.resizeTimer && clearTimeout(this.resizeTimer), this.eventAbort.abort(), this._mouseAbort?.abort(), this._mouseAbort = null, this.domPlanes.forEach((e) => e.destroy()), this.dom3DObjects.forEach((e) => e.destroy()), this.domPlanes = [], this.dom3DObjects = [], this.domPlaneMeshes = [], this.updateCallbacks = [], this.resizeCallbacks = [], this.scrollSync?.destroy(), this.scrollSync = null;
+      for (const e of this.effects)
+        e.dispose?.();
+      this.effects = [], this.postEffect?.dispose(), this.postEffect = null, this.internalComposer = null, this.controls?.dispose(), this.controls = null, this.renderer.dispose(), this.canvas.remove(), this.stats && (this.stats.dom.remove(), this.stats = null), this.gui && (this.gui.destroy(), this.gui = null);
+    }
+  }
+}
+const b = 0.01, ee = 50, M = 0.3, x = 1e3 / 60;
+class re {
+  constructor(e = {}) {
+    s(this, "_scrollY");
+    /**
+     * 直近 `window.scrollTo` に渡した値。scrollY が変わっていないフレで
+     * scrollTo を no-op で呼ぶと scroll event が連発して page 側 listener を
+     * 無駄に叩くので、差分があるときだけ呼び出すための diff キャッシュ。
+     */
+    s(this, "_lastAppliedY");
+    s(this, "_maxScroll");
+    s(this, "_rafId", 0);
+    s(this, "_enabled", !0);
+    s(this, "_lineHeight");
+    s(this, "_friction");
+    s(this, "_touchPrevY", 0);
+    s(this, "_touchPrevTime", 0);
+    /** 直近の touch velocity (px/ms)。touchend 後はこの値を初速に慣性が走る。 */
+    s(this, "_velocityY", 0);
+    s(this, "_isTouching", !1);
+    /** tick() の dt 計算用。0 のとき初回 tick (dt は FRAME_MS で初期化)。 */
+    s(this, "_lastTickTime", 0);
+    s(this, "_eventAbort", new AbortController());
+    s(this, "_resizeObserver", null);
+    s(this, "_destroyed", !1);
+    s(this, "onWheel", (e) => {
+      if (!this._enabled) return;
+      e.preventDefault(), this._velocityY = 0;
+      let t = e.deltaY;
+      e.deltaMode === 1 ? t *= this._lineHeight : e.deltaMode === 2 && (t *= window.innerHeight), this._scrollY = this.clamp(this._scrollY + t);
+    });
+    s(this, "onTouchStart", (e) => {
+      this._enabled && e.touches.length !== 0 && (this._velocityY = 0, this._isTouching = !0, this._touchPrevY = e.touches[0].clientY, this._touchPrevTime = performance.now());
+    });
+    s(this, "onTouchMove", (e) => {
+      if (!this._enabled || e.touches.length === 0) return;
+      e.preventDefault();
+      const t = e.touches[0].clientY, i = performance.now(), o = this._touchPrevY - t, r = i - this._touchPrevTime;
+      if (this._scrollY = this.clamp(this._scrollY + o), r > 0) {
+        const h = o / r;
+        this._velocityY = this._velocityY * (1 - M) + h * M;
+      }
+      this._touchPrevY = t, this._touchPrevTime = i;
+    });
+    s(this, "onTouchEnd", () => {
+      this._isTouching = !1, performance.now() - this._touchPrevTime > ee && (this._velocityY = 0);
+    });
+    s(this, "onResize", () => {
+      this._maxScroll = this.calcMaxScroll(), this._scrollY = this.clamp(this._scrollY);
+    });
+    /**
+     * 毎 rAF で `window.scrollTo` を呼ぶ。これが Lenis 方式の核心:
+     * scrollY の更新タイミングを「JS rAF tick 上だけ」に集約することで、
+     * paint 時に見える scrollY と JS が知る scrollY が完全一致する。
+     *
+     * 同値時は no-op で呼ばない (scroll event の連発で page 側 listener を
+     * 叩くのを避ける)。
+     *
+     * touch リリース後の慣性: `_velocityY` が閾値以上ある間、毎 tick で
+     * `scrollY += velocity * dt` を積みつつ `velocity *= friction^(dt/FRAME_MS)` で減衰。
+     */
+    s(this, "tick", (e = performance.now()) => {
+      if (this._destroyed) return;
+      const t = this._lastTickTime === 0 ? x : e - this._lastTickTime;
+      if (this._lastTickTime = e, !this._isTouching && Math.abs(this._velocityY) > b) {
+        const i = this._scrollY, o = this.clamp(this._scrollY + this._velocityY * t);
+        this._scrollY = o, o === i ? this._velocityY = 0 : (this._velocityY *= Math.pow(this._friction, t / x), Math.abs(this._velocityY) < b && (this._velocityY = 0));
+      }
+      this._scrollY !== this._lastAppliedY && (window.scrollTo(0, this._scrollY), this._lastAppliedY = this._scrollY), this._rafId = requestAnimationFrame(this.tick);
+    });
+    this._lineHeight = e.lineHeight ?? 16, this._friction = e.touchFriction ?? 0.95, this._scrollY = window.scrollY, this._lastAppliedY = this._scrollY, this._maxScroll = this.calcMaxScroll(), this.setupEventListeners(), this.setupResizeObserver(), this._rafId = requestAnimationFrame(this.tick);
+  }
+  calcMaxScroll() {
+    return Math.max(
+      0,
+      document.documentElement.scrollHeight - window.innerHeight
+    );
+  }
+  setupEventListeners() {
+    const e = this._eventAbort.signal;
+    window.addEventListener("wheel", this.onWheel, {
+      passive: !1,
+      signal: e
+    }), window.addEventListener("touchstart", this.onTouchStart, {
+      passive: !1,
+      signal: e
+    }), window.addEventListener("touchmove", this.onTouchMove, {
+      passive: !1,
+      signal: e
+    }), window.addEventListener("touchend", this.onTouchEnd, {
+      passive: !0,
+      signal: e
+    }), window.addEventListener("touchcancel", this.onTouchEnd, {
+      passive: !0,
+      signal: e
+    }), window.addEventListener("resize", this.onResize, { signal: e });
+  }
+  /**
+   * document の scrollHeight が動的に変わる場合 (画像 lazy load、SPA でのコンテンツ追加 等)
+   * に maxScroll を追従させる。ResizeObserver で `<html>` を観察する。
+   */
+  setupResizeObserver() {
+    typeof ResizeObserver > "u" || (this._resizeObserver = new ResizeObserver(() => {
+      this._maxScroll = this.calcMaxScroll(), this._scrollY = this.clamp(this._scrollY);
+    }), this._resizeObserver.observe(document.documentElement));
+  }
+  clamp(e) {
+    return Math.min(this._maxScroll, Math.max(0, e));
+  }
+  /** 現在の virtual scrollY。 */
+  get scrollY() {
+    return this._scrollY;
+  }
+  /**
+   * 入力受付の有効/無効。
+   *
+   * disable 中は wheel/touch ハンドラが **preventDefault する前に** early-return するため、
+   * native スクロールが復活する（virtual scroll を一時停止して通常スクロールに戻したい
+   * ケース用）。accumulator (`_scrollY`) も更新されず、慣性も止まる。
+   *
+   * 再 enable 時は `_scrollY` / `_lastAppliedY` を現在の `window.scrollY` に再同期して
+   * disable 中の native scroll とのズレを吸収する（同期しないと次の wheel/touch 入力で
+   * 古い `_scrollY` からの delta になり巨大ジャンプする）。
+   */
+  set enabled(e) {
+    const t = !this._enabled;
+    this._enabled = e, e || (this._velocityY = 0, this._isTouching = !1), e && t && (this._scrollY = window.scrollY, this._lastAppliedY = this._scrollY);
+  }
+  get enabled() {
+    return this._enabled;
+  }
+  destroy() {
+    this._destroyed || (this._destroyed = !0, cancelAnimationFrame(this._rafId), this._eventAbort.abort(), this._resizeObserver?.disconnect(), this._resizeObserver = null);
+  }
+}
+class ne {
+  constructor(e) {
+    s(this, "scene");
+    s(this, "camera");
+    s(this, "rect");
+    this.scene = new a.Scene(), this.camera = new C(e), this.rect = e;
+  }
+  resize(e) {
+    this.rect = e, this.camera.resize(e);
+  }
+  dispose() {
+  }
+}
+class ae {
+  constructor() {
+    s(this, "pass", null);
+    /**
+     * GUI の on/off チェックボックスから操作される。false にすると
+     * EffectComposer がこのパスをスキップする（lil-gui バインド用に public）。
+     */
+    s(this, "_enabled", !0);
+  }
+  get enabled() {
+    return this._enabled;
+  }
+  set enabled(e) {
+    this._enabled = e, this.pass && (this.pass.enabled = e);
+  }
+  /**
+   * addEffect() 呼び出し時に内部で呼ばれる。直接使わない。
+   *
+   * 1 インスタンスを `webgl.addEffect()` と `domPlane.addEffect()` の両方に
+   * 渡すと、`update()` が同一フレームに 2 回走り内部状態が二重進行する
+   * （例: `FluidEffect` の dye が倍速で進む）。DEV では警告を出す。
+   */
+  _register(e) {
+    this.pass;
+    const t = this.getConfig();
+    this.pass = e.addEffect({
+      fragmentShader: t.fragmentShader,
+      uniforms: t.uniforms
+    }), this.pass.enabled = this._enabled;
+  }
+  update(e, t) {
+  }
+  setUniform(e, t) {
+    this.pass?.setUniform(e, t);
+  }
+  getUniform(e) {
+    return this.pass?.getUniform(e);
+  }
+  getPass() {
+    return this.pass;
+  }
+}
+export {
+  F as AMBIENT_LIGHT_COLOR,
+  D as AMBIENT_LIGHT_INTENSITY,
+  ae as BaseEffect,
+  ne as BaseScene,
+  k as CAMERA_FAR,
+  v as CAMERA_FOV,
+  G as CAMERA_NEAR,
+  C as Camera,
+  V as DEFAULT_OFFSET,
+  y as DEFAULT_SCALE,
+  U as DIRECTIONAL_LIGHT_COLOR,
+  H as DIRECTIONAL_LIGHT_INTENSITY,
+  w as DIRECTIONAL_LIGHT_POSITION,
+  J as Dom3DObject,
+  K as DomPlane,
+  P as DomPositionCalculator,
+  j as EffectComposer,
+  R as EffectPass,
+  B as Light,
+  N as PlaneComposer,
+  re as RafScroll,
+  Z as ScrollSync,
+  a as THREE,
+  oe as WebGLApp
+};
+//# sourceMappingURL=index.js.map