murow 0.1.1 → 0.1.3

package/dist/webgpu/cjs/index.js

@@ -128,8 +128,8 @@ var std = { ..._std };
 // src/2d/renderer.ts
 var import_typegpu6 = __toESM(require("typegpu"), 1);
 var d4 = __toESM(require("typegpu/data"), 1);
-var import_free_list2 = require("murow/core/free-list");
-var import_renderer2 = require("murow/renderer");
+var import_free_list = require("murow/core/free-list");
+var import_renderer3 = require("murow/renderer");
 
 // src/core/constants.ts
 var DYNAMIC_OFFSET_PREV_X = 0;
@@ -283,8 +283,46 @@ var MeshUniforms = d2.struct({
   alpha: d2.f32,
   lightDirX: d2.f32,
   lightDirY: d2.f32,
-  lightDirZ: d2.f32
+  lightDirZ: d2.f32,
+  lightDirR: d2.f32,
+  lightDirG: d2.f32,
+  lightDirB: d2.f32,
+  lightDirIntensity: d2.f32,
+  ambientR: d2.f32,
+  ambientG: d2.f32,
+  ambientB: d2.f32,
+  lightCount: d2.u32
+});
+var MESH_UNIFORM_ALPHA_OFFSET = 16;
+var MESH_UNIFORM_LIGHT_OFFSET = 17;
+var MESH_UNIFORM_FLOATS = 28;
+var Light = d2.struct({
+  kind: d2.f32,
+  currPosX: d2.f32,
+  currPosY: d2.f32,
+  currPosZ: d2.f32,
+  prevPosX: d2.f32,
+  prevPosY: d2.f32,
+  prevPosZ: d2.f32,
+  currDirX: d2.f32,
+  currDirY: d2.f32,
+  currDirZ: d2.f32,
+  prevDirX: d2.f32,
+  prevDirY: d2.f32,
+  prevDirZ: d2.f32,
+  colorR: d2.f32,
+  colorG: d2.f32,
+  colorB: d2.f32,
+  intensity: d2.f32,
+  range: d2.f32,
+  innerCos: d2.f32,
+  outerCos: d2.f32,
+  castsShadow: d2.f32,
+  shadowMapIndex: d2.f32
 });
+var LIGHT_FLOATS = 22;
+var LIGHT_KIND_POINT = 1;
+var LIGHT_KIND_SPOT = 2;
 var InstanceAnimStateGPU = d2.struct({
   clipId: d2.i32,
   time: d2.f32,
@@ -307,15 +345,19 @@ var import_sparse_batcher = require("murow/core/sparse-batcher");
 
 // src/2d/sprite-accessor.ts
 var SpriteAccessor = class {
-  constructor(dynamicData, staticData, slot, sheetId, onStaticDirty) {
+  constructor(dynamicData, staticData, id, slot, sheetId, onStaticDirty) {
     this.dynamicData = dynamicData;
     this.staticData = staticData;
+    this._id = id;
     this._slot = slot;
     this._sheetId = sheetId;
     this.dynamicBase = slot * DYNAMIC_FLOATS_PER_SPRITE;
     this.staticBase = slot * STATIC_FLOATS_PER_SPRITE;
     this._onStaticDirty = onStaticDirty;
   }
+  get id() {
+    return this._id;
+  }
   get slot() {
     return this._slot;
   }
@@ -439,6 +481,88 @@ var SpriteAccessor = class {
   }
 };
 
+// src/2d/raycast.ts
+var import_raycast = require("murow/core/raycast");
+var import_renderer = require("murow/renderer");
+var WebGPURaycast2D = class extends import_renderer.Raycast {
+  constructor(renderer) {
+    super();
+    this.renderer = renderer;
+    this.state = new import_raycast.HitBuffer(2);
+    this.resultBuffer = [];
+    this.memos = /* @__PURE__ */ new Set();
+  }
+  update(input) {
+    this.state.reset();
+    this.renderer._collectRaycastHitsInto(input.mouse.position.x, input.mouse.position.y, this.state);
+    for (const m of this.memos)
+      m._invalidate();
+  }
+  /**
+   * Topmost sprite under the cursor, or null. The returned object is
+   * pool-backed and valid only until the next `update()` -- copy what
+   * you need, or use `memo` for results that persist across frames.
+   */
+  hit(opts) {
+    return this.state.nearest(opts?.filter, opts?.maxDistance ?? Infinity);
+  }
+  /**
+   * Every sprite under the cursor, topmost first. The array and its
+   * entries are reused and overwritten by the next `update()`.
+   */
+  hitAll(opts) {
+    this.state.collectInto(this.resultBuffer, opts?.filter, opts?.maxDistance ?? Infinity);
+    return this.resultBuffer;
+  }
+  memo(opts) {
+    const m = new WebGPURaycastMemo2D(this.state, opts, () => this.memos.delete(m));
+    this.memos.add(m);
+    return m;
+  }
+  clearMemos() {
+    for (const m of this.memos)
+      m._detach();
+    this.memos.clear();
+  }
+};
+var WebGPURaycastMemo2D = class extends import_renderer.RaycastMemo {
+  constructor(state, opts, onDispose) {
+    super();
+    this.state = state;
+    this.opts = opts;
+    this.onDispose = onDispose;
+    this.dirty = true;
+    this.detached = false;
+    this.cached = [];
+  }
+  get hits() {
+    if (this.detached)
+      return this.cached;
+    if (this.dirty) {
+      this.state.collectInto(this.cached, this.opts.filter, this.opts.maxDistance ?? Infinity);
+      this.dirty = false;
+    }
+    return this.cached;
+  }
+  get first() {
+    const arr = this.hits;
+    return arr.length > 0 ? arr[0] : null;
+  }
+  dispose() {
+    if (this.detached)
+      return;
+    this.onDispose();
+    this._detach();
+  }
+  _invalidate() {
+    this.dirty = true;
+  }
+  _detach() {
+    this.detached = true;
+    this.cached.length = 0;
+  }
+};
+
 // src/camera/camera-2d.ts
 var import_lerp = require("murow/core/lerp");
 var Camera2D = class {
@@ -648,7 +772,7 @@ function createSpriteFragment(_spriteLayout, textureLayout) {
 }
 
 // src/spritesheet/spritesheet.ts
-var import_renderer = require("murow/renderer");
+var import_renderer2 = require("murow/renderer");
 var Spritesheet = class {
   constructor(id, texture, textureView, sampler, uvs, width, height) {
     this.id = id;
@@ -688,7 +812,7 @@ function createTextureFromBitmap(device, bitmap) {
 }
 
 // src/2d/renderer.ts
-var import_renderer3 = require("murow/renderer");
+var import_renderer4 = require("murow/renderer");
 
 // src/geometry/geometry-builder.ts
 var import_typegpu2 = __toESM(require("typegpu"), 1);
@@ -1201,7 +1325,7 @@ function resolveBuiltInGeometry(name) {
 }
 
 // src/geometry/geometry-builder.ts
-var import_free_list = require("murow/core/free-list");
+var import_slot_map = require("murow/core/slot-map");
 
 // src/shaders/runtime-transpile.ts
 var acorn = __toESM(require("acorn"), 1);
@@ -1379,7 +1503,6 @@ var CustomGeometry = class {
     this._uniformDirty = true;
     this._isComputeSourced = false;
     this._drawCount = 0;
-    this.activeCount = 0;
     this.name = name;
     this.root = root;
     this.maxInstances = maxInstances;
@@ -1393,7 +1516,7 @@ var CustomGeometry = class {
     this.staticFloatsPerInstance = 0;
     for (const n of this.staticFieldNames)
       this.staticFloatsPerInstance += getFieldFloats(layoutConfig.static[n]);
-    this.freeList = new import_free_list.FreeList(maxInstances);
+    this.slots = new import_slot_map.SlotMap(maxInstances);
     this.dynamicData = new Float32Array(maxInstances * this.dynamicFloatsPerInstance);
     this.staticData = new Float32Array(maxInstances * this.staticFloatsPerInstance);
     this.uniformValues = { ...uniformValues };
@@ -1404,8 +1527,6 @@ var CustomGeometry = class {
     this.dataBindGroup = dataBindGroup;
     this.canvas = canvas;
     this.clearColor = clearColor;
-    this.activeSlots = new Uint32Array(maxInstances);
-    this.slotToActive = new Int32Array(maxInstances).fill(-1);
     this._ctx = new InstanceContext();
     this._isComputeSourced = isComputeSourced;
     if (isComputeSourced)
@@ -1419,34 +1540,20 @@ var CustomGeometry = class {
     this._drawCount = count;
   }
   addInstance(data) {
-    const slot = this.freeList.allocate();
+    const slot = this.slots.add();
     if (slot === -1)
       throw new Error(`Max instances (${this.maxInstances}) reached for "${this.name}"`);
     this.setInstanceData(slot, data);
-    this.activeSlots[this.activeCount] = slot;
-    this.slotToActive[slot] = this.activeCount;
-    this.activeCount++;
     return slot;
   }
   removeInstance(slot) {
-    this.freeList.free(slot);
     const dynBase = slot * this.dynamicFloatsPerInstance;
     const statBase = slot * this.staticFloatsPerInstance;
     this.dynamicData.fill(0, dynBase, dynBase + this.dynamicFloatsPerInstance);
     this.staticData.fill(0, statBase, statBase + this.staticFloatsPerInstance);
     this._dynamicDirty = true;
     this._staticDirty = true;
-    const activeIdx = this.slotToActive[slot];
-    if (activeIdx !== -1) {
-      const lastIdx = this.activeCount - 1;
-      if (activeIdx !== lastIdx) {
-        const lastSlot = this.activeSlots[lastIdx];
-        this.activeSlots[activeIdx] = lastSlot;
-        this.slotToActive[lastSlot] = activeIdx;
-      }
-      this.slotToActive[slot] = -1;
-      this.activeCount--;
-    }
+    this.slots.remove(slot);
   }
   setInstanceData(slot, data) {
     const rawData = data;
@@ -1519,7 +1626,7 @@ var CustomGeometry = class {
     this._uniformDirty = true;
   }
   getActiveCount() {
-    return this.freeList.getAllocatedCount();
+    return this.slots.size;
   }
   updateAll(callback) {
     this._ctx._bind(
@@ -1531,8 +1638,8 @@ var CustomGeometry = class {
       this.staticFieldNames,
       this.layoutConfig
     );
-    const count = this.activeCount;
-    const slots = this.activeSlots;
+    const count = this.slots.size;
+    const slots = this.slots.activeSlots;
     for (let i = 0; i < count; i++) {
       const slot = slots[i];
       this._ctx._setSlot(slot);
@@ -1543,7 +1650,7 @@ var CustomGeometry = class {
   }
   render() {
     const device = this.root.device;
-    const count = this._isComputeSourced ? this._drawCount : this.freeList.getAllocatedCount();
+    const count = this._isComputeSourced ? this._drawCount : this.slots.size;
     if (count === 0)
       return;
     const context = this.canvas.getContext("webgpu");
@@ -2168,6 +2275,7 @@ var ComputeBuilder = class {
 };
 
 // src/2d/renderer.ts
+var import_hitbox = require("murow/core/hitbox");
 var prefab2DHandles = /* @__PURE__ */ new WeakMap();
 function isPrefab2D(value) {
   return value.type === "spritesheet";
@@ -2181,7 +2289,7 @@ function resolveSpritePrefabHandle(prefab) {
   }
   return h;
 }
-var WebGPU2DRenderer = class extends import_renderer2.Base2DRenderer {
+var WebGPU2DRenderer = class extends import_renderer3.Base2DRenderer {
   constructor(canvas, options) {
     const resolvedMaxSprites = options.maxSprites ?? options.maxInstances ?? 1024;
     super(canvas, { ...options, maxSprites: resolvedMaxSprites });
@@ -2191,15 +2299,19 @@ var WebGPU2DRenderer = class extends import_renderer2.Base2DRenderer {
     this.sheets = /* @__PURE__ */ new Map();
     this.nextSheetId = 0;
     this.uniformData = new Float32Array(20);
+    this.nextSpriteId = 0;
     this.resizeObserver = null;
     this.resizeCallbacks = [];
     this._prefabs = options.prefabs ?? null;
     this.camera = new Camera2D(canvas.width || 800, canvas.height || 600);
-    this.freeList = new import_free_list2.FreeList(resolvedMaxSprites);
+    this.raycast = new WebGPURaycast2D(this);
+    this.freeList = new import_free_list.FreeList(resolvedMaxSprites);
     this.batcher = new import_sparse_batcher.SparseBatcher(resolvedMaxSprites);
     this.dynamicData = new Float32Array(resolvedMaxSprites * DYNAMIC_FLOATS_PER_SPRITE);
     this.staticData = new Float32Array(resolvedMaxSprites * STATIC_FLOATS_PER_SPRITE);
     this.slotIndexData = new Uint32Array(resolvedMaxSprites);
+    this.spriteHandles = new Array(resolvedMaxSprites).fill(null);
+    this.spriteHitboxes = new Array(resolvedMaxSprites).fill(null);
   }
   get device() {
     return this._device;
@@ -2325,7 +2437,7 @@ var WebGPU2DRenderer = class extends import_renderer2.Base2DRenderer {
     this.resizeCallbacks.push(callback);
   }
   async loadSpritesheet(source) {
-    const parsed = await (0, import_renderer3.parseSpritesheet)(source);
+    const parsed = await (0, import_renderer4.parseSpritesheet)(source);
     return this.uploadParsedSpritesheet(parsed);
   }
   /**
@@ -2359,6 +2471,9 @@ var WebGPU2DRenderer = class extends import_renderer2.Base2DRenderer {
     const dynBase = slot * DYNAMIC_FLOATS_PER_SPRITE;
     const statBase = slot * STATIC_FLOATS_PER_SPRITE;
     const sheet = isPrefab2D(opts.sheet) ? resolveSpritePrefabHandle(opts.sheet) : opts.sheet;
+    const hitboxName = isPrefab2D(opts.sheet) ? opts.sheet.hitbox : void 0;
+    const lib = this._prefabs?.hitboxLibrary ?? null;
+    const hitbox = hitboxName && lib ? lib.get(hitboxName) : null;
     const [px, py] = opts.position ?? [0, 0];
     this.dynamicData[dynBase + DYNAMIC_OFFSET_PREV_X] = px;
     this.dynamicData[dynBase + DYNAMIC_OFFSET_PREV_Y] = py;
@@ -2387,15 +2502,19 @@ var WebGPU2DRenderer = class extends import_renderer2.Base2DRenderer {
     this.staticData[statBase + STATIC_OFFSET_TINT_A] = tint[3];
     this.staticDirty = true;
     this.batcher.add(opts.layer ?? 0, sheet.id, slot);
-    return new SpriteAccessor(
+    const accessor = new SpriteAccessor(
       this.dynamicData,
       this.staticData,
+      this.nextSpriteId++,
       slot,
       sheet.id,
       () => {
         this.staticDirty = true;
       }
     );
+    this.spriteHandles[slot] = accessor;
+    this.spriteHitboxes[slot] = hitbox;
+    return accessor;
   }
   removeSprite(sprite) {
     const accessor = sprite;
@@ -2405,8 +2524,47 @@ var WebGPU2DRenderer = class extends import_renderer2.Base2DRenderer {
     const statBase = accessor.slot * STATIC_FLOATS_PER_SPRITE;
     this.dynamicData.fill(0, dynBase, dynBase + DYNAMIC_FLOATS_PER_SPRITE);
     this.staticData.fill(0, statBase, statBase + STATIC_FLOATS_PER_SPRITE);
+    this.spriteHandles[accessor.slot] = null;
+    this.spriteHitboxes[accessor.slot] = void 0;
     this.staticDirty = true;
   }
+  /**
+   * Point-test every sprite against the unprojected cursor and push the
+   * hits into the buffer. Sort key is `-layer` so the topmost sprite is
+   * "nearest". A declared hitbox overrides the default rendered quad.
+   */
+  _collectRaycastHitsInto(screenX, screenY, rc) {
+    const [wx, wy] = this.camera.screenToWorld(screenX, screenY);
+    const dyn = this.dynamicData;
+    const stat = this.staticData;
+    this.batcher.each((_sheetId, instances, count) => {
+      for (let i = 0; i < count; i++) {
+        const slot = instances[i];
+        const handle = this.spriteHandles[slot];
+        if (handle === null)
+          continue;
+        const dynBase = slot * DYNAMIC_FLOATS_PER_SPRITE;
+        const statBase = slot * STATIC_FLOATS_PER_SPRITE;
+        const cx = dyn[dynBase + DYNAMIC_OFFSET_CURR_X];
+        const cy = dyn[dynBase + DYNAMIC_OFFSET_CURR_Y];
+        const rot = dyn[dynBase + DYNAMIC_OFFSET_CURR_ROTATION];
+        const sx = stat[statBase + STATIC_OFFSET_SCALE_X];
+        const sy = stat[statBase + STATIC_OFFSET_SCALE_Y];
+        const layer = stat[statBase + STATIC_OFFSET_LAYER];
+        const hb = this.spriteHitboxes[slot];
+        let part = null;
+        if (hb) {
+          const hit = (0, import_hitbox.testHitbox2D)(hb, cx, cy, sx, sy, rot, wx, wy);
+          if (!hit)
+            continue;
+          part = hit.part;
+        } else if (!(0, import_hitbox.pointInQuad2D)(cx, cy, sx, sy, rot, wx, wy)) {
+          continue;
+        }
+        rc.push(handle, -layer, wx, wy, 0, layer, part);
+      }
+    });
+  }
   storePreviousState() {
     this.camera.storePrevious();
     const dyn = this.dynamicData;
@@ -2617,311 +2775,127 @@ var AnimationController = class {
 };
 
 // src/3d/renderer.ts
-var import_typegpu9 = __toESM(require("typegpu"), 1);
-var import_renderer4 = require("murow/renderer");
-var import_free_list3 = require("murow/core/free-list");
+var import_typegpu10 = __toESM(require("typegpu"), 1);
+var import_renderer6 = require("murow/renderer");
+var import_free_list2 = require("murow/core/free-list");
 var import_sparse_batcher2 = require("murow/core/sparse-batcher");
 
-// src/camera/camera-3d.ts
-var import_lerp2 = require("murow/core/lerp");
-var import_ray = require("murow/core/ray");
-var Camera3D = class {
-  constructor() {
-    this.position = [0, 5, -10];
-    this.target = [0, 0, 0];
-    this.up = [0, 1, 0];
-    this.fov = 60;
-    this.near = 0.1;
-    this.far = 1e3;
-    this.aspect = 1;
-    this.movement = "local";
-    // Previous state for interpolation (stored before each tick)
-    this._prevPosition = [0, 5, -10];
-    this._prevTarget = [0, 0, 0];
-    // Interpolated state used for rendering
-    this._renderPosition = [0, 5, -10];
-    this._renderTarget = [0, 0, 0];
-    this._viewMatrix = new Float32Array(16);
-    this._projMatrix = new Float32Array(16);
-    this._vpMatrix = new Float32Array(16);
-    this._ray = new import_ray.Ray3D();
-    this._width = 1;
-    this._height = 1;
-  }
-  /**
-   * Store current position/target as previous. Call before each tick.
-   */
-  storePrevious() {
-    this._prevPosition[0] = this.position[0];
-    this._prevPosition[1] = this.position[1];
-    this._prevPosition[2] = this.position[2];
-    this._prevTarget[0] = this.target[0];
-    this._prevTarget[1] = this.target[1];
-    this._prevTarget[2] = this.target[2];
-  }
-  /**
-   * Smoothly move the camera toward a target point.
-   * Call each tick. The camera and its look-at target lerp toward the given position.
-   * @param targetX  World X to follow
-   * @param targetY  World Y to follow
-   * @param targetZ  World Z to follow
-   * @param smoothing  0-1. 1 = snap instantly, 0.1 = lazy follow. Default 1.
-   */
-  follow(targetX, targetY, targetZ, smoothing = 1) {
-    const dx = targetX - this.target[0];
-    const dy = targetY - this.target[1];
-    const dz = targetZ - this.target[2];
-    const mx = dx * smoothing;
-    const my = dy * smoothing;
-    const mz = dz * smoothing;
-    this.target[0] += mx;
-    this.target[1] += my;
-    this.target[2] += mz;
-    this.position[0] += mx;
-    this.position[1] += my;
-    this.position[2] += mz;
-  }
-  /**
-   * Interpolate between previous and current state. Call before rendering.
-   */
-  interpolate(alpha) {
-    this._renderPosition[0] = (0, import_lerp2.lerp)(this._prevPosition[0], this.position[0], alpha);
-    this._renderPosition[1] = (0, import_lerp2.lerp)(this._prevPosition[1], this.position[1], alpha);
-    this._renderPosition[2] = (0, import_lerp2.lerp)(this._prevPosition[2], this.position[2], alpha);
-    this._renderTarget[0] = (0, import_lerp2.lerp)(this._prevTarget[0], this.target[0], alpha);
-    this._renderTarget[1] = (0, import_lerp2.lerp)(this._prevTarget[1], this.target[1], alpha);
-    this._renderTarget[2] = (0, import_lerp2.lerp)(this._prevTarget[2], this.target[2], alpha);
-  }
-  /**
-   * Build the view matrix (lookAt) using interpolated state.
-   */
-  getViewMatrix() {
-    lookAt(this._viewMatrix, this._renderPosition, this._renderTarget, this.up);
-    return this._viewMatrix;
-  }
-  /**
-   * Build the perspective projection matrix.
-   */
-  getProjectionMatrix() {
-    perspective(this._projMatrix, this.fov * (Math.PI / 180), this.aspect, this.near, this.far);
-    return this._projMatrix;
+// src/3d/shader.ts
+var import_typegpu8 = __toESM(require("typegpu"), 1);
+var d6 = __toESM(require("typegpu/data"), 1);
+var std4 = __toESM(require("typegpu/std"), 1);
+
+// src/shaders/utils.ts
+var import_typegpu7 = __toESM(require("typegpu"), 1);
+var d5 = __toESM(require("typegpu/data"), 1);
+var std3 = __toESM(require("typegpu/std"), 1);
+var rotate2d = import_typegpu7.default.fn([d5.vec2f, d5.f32], d5.vec2f)(
+  function rotate2d2(point, angle) {
+    "use gpu";
+    const c = std3.cos(angle);
+    const s = std3.sin(angle);
+    return d5.vec2f(
+      point.x * c - point.y * s,
+      point.x * s + point.y * c
+    );
   }
-  /**
-   * Build the combined view-projection matrix.
-   */
-  getViewProjectionMatrix() {
-    this.getViewMatrix();
-    this.getProjectionMatrix();
-    mat4Multiply(this._vpMatrix, this._projMatrix, this._viewMatrix);
-    return this._vpMatrix;
+);
+var worldToClip2d = import_typegpu7.default.fn([d5.vec2f, d5.mat3x3f], d5.vec4f)(
+  function worldToClip2d2(worldPos, cameraMatrix) {
+    "use gpu";
+    const clip = cameraMatrix * d5.vec3f(worldPos.x, worldPos.y, 1);
+    return d5.vec4f(clip.x, clip.y, 0, 1);
   }
-  setAspect(width, height) {
-    this.aspect = width / height;
-    this._width = width;
-    this._height = height;
+);
+var worldToClip3d = import_typegpu7.default.fn([d5.vec3f, d5.mat4x4f], d5.vec4f)(
+  function worldToClip3d2(worldPos, vpMatrix) {
+    "use gpu";
+    return vpMatrix * d5.vec4f(worldPos.x, worldPos.y, worldPos.z, 1);
   }
-  setPosition(x, y, z) {
-    this.position[0] = x;
-    this.position[1] = y;
-    this.position[2] = z;
+);
+var remap = import_typegpu7.default.fn([d5.f32, d5.f32, d5.f32, d5.f32, d5.f32], d5.f32)(
+  function remap2(value, inMin, inMax, outMin, outMax) {
+    "use gpu";
+    const t = (value - inMin) / (inMax - inMin);
+    return outMin + t * (outMax - outMin);
   }
-  /**
-   * Unproject a screen coordinate into a world-space ray.
-   * Requires `setAspect(width, height)` to have been called first.
-   * Returns a pre-allocated Ray3D — copy origin/direction if you need to store it.
-   */
-  screenToRay(screenX, screenY) {
-    this.getViewMatrix();
-    const m = this._viewMatrix;
-    const ndcX = 2 * screenX / this._width - 1;
-    const ndcY = 1 - 2 * screenY / this._height;
-    const t = Math.tan(this.fov * Math.PI / 180 * 0.5);
-    const rightX = m[0], rightY = m[4], rightZ = m[8];
-    const upX = m[1], upY = m[5], upZ = m[9];
-    const fwdX = -m[2], fwdY = -m[6], fwdZ = -m[10];
-    const dx = fwdX + rightX * ndcX * t * this.aspect + upX * ndcY * t;
-    const dy = fwdY + rightY * ndcX * t * this.aspect + upY * ndcY * t;
-    const dz = fwdZ + rightZ * ndcX * t * this.aspect + upZ * ndcY * t;
-    this._ray.set(this.position[0], this.position[1], this.position[2], dx, dy, dz);
-    return this._ray;
+);
+var scaleRotate2d = import_typegpu7.default.fn([d5.vec2f, d5.f32], d5.mat2x2f)(
+  function scaleRotate2d2(scale, angle) {
+    "use gpu";
+    const c = std3.cos(angle);
+    const s = std3.sin(angle);
+    return d5.mat2x2f(
+      scale.x * c,
+      scale.x * s,
+      -(scale.y * s),
+      scale.y * c
+    );
   }
-  setTarget(x, y, z) {
-    this.target[0] = x;
-    this.target[1] = y;
-    this.target[2] = z;
+);
+var inverseLerp = import_typegpu7.default.fn([d5.f32, d5.f32, d5.f32], d5.f32)(
+  function inverseLerp2(min, max3, value) {
+    "use gpu";
+    return std3.saturate((value - min) / (max3 - min));
   }
-  /**
-   * Move the camera. Behaviour is determined by the `movement` property:
-   * - `'local'`    — along camera axes, pitch included (free-fly / spectator)
-   * - `'grounded'` — yaw-projected XZ + world Y (FPS)
-   * - `'global'`   — world axes directly (isometric / platformer)
-   */
-  move(right, up, forward) {
-    if (this.movement === "grounded")
-      this._moveGrounded(right, up, forward);
-    else if (this.movement === "global")
-      this._moveGlobal(right, up, forward);
-    else
-      this._moveLocal(right, up, forward);
+);
+var lightContribution = import_typegpu7.default.fn(
+  [d5.vec3f, d5.vec3f, d5.vec3f, d5.vec4f, d5.vec3f, d5.vec3f],
+  d5.vec3f
+)(
+  function lightContribution2(pos, axis, color, params, normal, worldPos) {
+    "use gpu";
+    const intensity = params.x;
+    const range = params.y;
+    const innerCos = params.z;
+    const outerCos = params.w;
+    const toLight = d5.vec3f(pos.x - worldPos.x, pos.y - worldPos.y, pos.z - worldPos.z);
+    const dist = std3.length(toLight);
+    const dir = std3.normalize(toLight);
+    const lambert = std3.max(std3.dot(normal, dir), 0);
+    const atten = std3.saturate(1 - dist / std3.max(range, 1e-4));
+    const falloff = atten * atten;
+    const axisLen = std3.length(axis);
+    const isSpot = axisLen > 1e-4;
+    const safeAxis = std3.select(d5.vec3f(0, 0, 1), axis, isSpot);
+    const cosAngle = std3.dot(std3.normalize(safeAxis), d5.vec3f(-dir.x, -dir.y, -dir.z));
+    const spotCone = std3.smoothstep(outerCos, innerCos, cosAngle);
+    const cone = std3.select(1, spotCone, isSpot);
+    const shadowFactor = 1;
+    const scale = lambert * falloff * cone * intensity * shadowFactor;
+    return d5.vec3f(color.x * scale, color.y * scale, color.z * scale);
   }
-  _moveLocal(right, up, forward) {
-    this.getViewMatrix();
-    const m = this._viewMatrix;
-    const dx = m[0] * right + m[1] * up - m[2] * forward;
-    const dy = m[4] * right + m[5] * up - m[6] * forward;
-    const dz = m[8] * right + m[9] * up - m[10] * forward;
-    this.position[0] += dx;
-    this.position[1] += dy;
-    this.position[2] += dz;
-    this.target[0] += dx;
-    this.target[1] += dy;
-    this.target[2] += dz;
+);
+var tonemap = import_typegpu7.default.fn([d5.vec3f], d5.vec3f)(
+  function tonemap2(c) {
+    "use gpu";
+    return d5.vec3f(c.x / (1 + c.x), c.y / (1 + c.y), c.z / (1 + c.z));
   }
-  _moveGrounded(right, up, forward) {
-    const yaw = Math.atan2(this.target[0] - this.position[0], this.target[2] - this.position[2]);
-    const dx = Math.sin(yaw) * forward + Math.cos(yaw) * right;
-    const dz = Math.cos(yaw) * forward - Math.sin(yaw) * right;
-    this.position[0] += dx;
-    this.position[1] += up;
-    this.position[2] += dz;
-    this.target[0] += dx;
-    this.target[1] += up;
-    this.target[2] += dz;
-  }
-  _moveGlobal(right, up, forward) {
-    this.position[0] += right;
-    this.position[1] += up;
-    this.position[2] += forward;
-    this.target[0] += right;
-    this.target[1] += up;
-    this.target[2] += forward;
-  }
-  /**
-   * Orbit around the target point. Zero allocations.
-   * @param yawDelta   Horizontal rotation in radians (positive = rotate right)
-   * @param pitchDelta Vertical rotation in radians (positive = rotate up)
-   */
-  orbit(yawDelta, pitchDelta) {
-    let ox = this.position[0] - this.target[0];
-    let oy = this.position[1] - this.target[1];
-    let oz = this.position[2] - this.target[2];
-    const dist = Math.sqrt(ox * ox + oy * oy + oz * oz);
-    let yaw = Math.atan2(ox, oz);
-    let pitch = Math.asin(oy / dist);
-    yaw += yawDelta;
-    pitch += pitchDelta;
-    pitch = Math.max(-Math.PI * 0.49, Math.min(Math.PI * 0.49, pitch));
-    this.position[0] = this.target[0] + Math.sin(yaw) * Math.cos(pitch) * dist;
-    this.position[1] = this.target[1] + Math.sin(pitch) * dist;
-    this.position[2] = this.target[2] + Math.cos(yaw) * Math.cos(pitch) * dist;
-  }
-  /**
-   * Zoom by adjusting distance to target. Zero allocations.
-   * @param delta Positive = zoom in, negative = zoom out
-   */
-  zoom(delta) {
-    let ox = this.position[0] - this.target[0];
-    let oy = this.position[1] - this.target[1];
-    let oz = this.position[2] - this.target[2];
-    const dist = Math.sqrt(ox * ox + oy * oy + oz * oz);
-    const newDist = Math.max(0.1, dist - delta);
-    const scale = newDist / dist;
-    this.position[0] = this.target[0] + ox * scale;
-    this.position[1] = this.target[1] + oy * scale;
-    this.position[2] = this.target[2] + oz * scale;
-  }
-};
-function lookAt(out, eye, center, up) {
-  let fx = center[0] - eye[0];
-  let fy = center[1] - eye[1];
-  let fz = center[2] - eye[2];
-  let len = 1 / Math.sqrt(fx * fx + fy * fy + fz * fz);
-  fx *= len;
-  fy *= len;
-  fz *= len;
-  let sx = fy * up[2] - fz * up[1];
-  let sy = fz * up[0] - fx * up[2];
-  let sz = fx * up[1] - fy * up[0];
-  len = Math.sqrt(sx * sx + sy * sy + sz * sz);
-  if (len > 0) {
-    len = 1 / len;
-    sx *= len;
-    sy *= len;
-    sz *= len;
-  }
-  const ux = sy * fz - sz * fy;
-  const uy = sz * fx - sx * fz;
-  const uz = sx * fy - sy * fx;
-  out[0] = sx;
-  out[1] = ux;
-  out[2] = -fx;
-  out[3] = 0;
-  out[4] = sy;
-  out[5] = uy;
-  out[6] = -fy;
-  out[7] = 0;
-  out[8] = sz;
-  out[9] = uz;
-  out[10] = -fz;
-  out[11] = 0;
-  out[12] = -(sx * eye[0] + sy * eye[1] + sz * eye[2]);
-  out[13] = -(ux * eye[0] + uy * eye[1] + uz * eye[2]);
-  out[14] = fx * eye[0] + fy * eye[1] + fz * eye[2];
-  out[15] = 1;
-}
-function perspective(out, fovRad, aspect, near, far) {
-  const f = 1 / Math.tan(fovRad * 0.5);
-  const rangeInv = 1 / (near - far);
-  out[0] = f / aspect;
-  out[1] = 0;
-  out[2] = 0;
-  out[3] = 0;
-  out[4] = 0;
-  out[5] = f;
-  out[6] = 0;
-  out[7] = 0;
-  out[8] = 0;
-  out[9] = 0;
-  out[10] = (near + far) * rangeInv;
-  out[11] = -1;
-  out[12] = 0;
-  out[13] = 0;
-  out[14] = 2 * near * far * rangeInv;
-  out[15] = 0;
-}
-function mat4Multiply(out, a, b) {
-  for (let i = 0; i < 4; i++) {
-    const ai0 = a[i], ai1 = a[i + 4], ai2 = a[i + 8], ai3 = a[i + 12];
-    out[i] = ai0 * b[0] + ai1 * b[1] + ai2 * b[2] + ai3 * b[3];
-    out[i + 4] = ai0 * b[4] + ai1 * b[5] + ai2 * b[6] + ai3 * b[7];
-    out[i + 8] = ai0 * b[8] + ai1 * b[9] + ai2 * b[10] + ai3 * b[11];
-    out[i + 12] = ai0 * b[12] + ai1 * b[13] + ai2 * b[14] + ai3 * b[15];
-  }
-}
+);
 
 // src/3d/shader.ts
-var import_typegpu7 = __toESM(require("typegpu"), 1);
-var d5 = __toESM(require("typegpu/data"), 1);
-var std3 = __toESM(require("typegpu/std"), 1);
+var MAX_LIGHTS = 64;
 function createMeshLayout(maxInstances) {
-  return import_typegpu7.default.bindGroupLayout({
+  return import_typegpu8.default.bindGroupLayout({
     uniforms: { uniform: MeshUniforms },
-    dynamicInstances: { storage: d5.arrayOf(DynamicMesh, maxInstances) },
-    staticInstances: { storage: d5.arrayOf(StaticMesh, maxInstances) },
-    slotIndices: { storage: d5.arrayOf(d5.u32, maxInstances) }
+    dynamicInstances: { storage: d6.arrayOf(DynamicMesh, maxInstances) },
+    staticInstances: { storage: d6.arrayOf(StaticMesh, maxInstances) },
+    slotIndices: { storage: d6.arrayOf(d6.u32, maxInstances) },
+    lights: { storage: d6.arrayOf(Light, MAX_LIGHTS) }
   });
 }
 function createMeshVertex(meshLayout) {
-  return import_typegpu7.default.vertexFn({
+  return import_typegpu8.default.vertexFn({
     in: {
-      position: d5.location(0, d5.vec3f),
-      normal: d5.location(1, d5.vec3f),
-      instanceIndex: d5.builtin.instanceIndex
+      position: d6.location(0, d6.vec3f),
+      normal: d6.location(1, d6.vec3f),
+      instanceIndex: d6.builtin.instanceIndex
     },
     out: {
-      pos: d5.builtin.position,
-      vNormal: d5.vec3f,
-      vColor: d5.vec3f
+      pos: d6.builtin.position,
+      vNormal: d6.vec3f,
+      vColor: d6.vec3f,
+      vWorldPos: d6.vec3f
     }
   })(function(input) {
     const instanceIndex = input.instanceIndex;
@@ -2929,115 +2903,144 @@ function createMeshVertex(meshLayout) {
     const dyn = meshLayout.$.dynamicInstances[slot];
     const stat = meshLayout.$.staticInstances[slot];
     const alpha = meshLayout.$.uniforms.alpha;
-    const px = std3.mix(dyn.prevPosX, dyn.currPosX, alpha);
-    const py = std3.mix(dyn.prevPosY, dyn.currPosY, alpha);
-    const pz = std3.mix(dyn.prevPosZ, dyn.currPosZ, alpha);
-    const rx = std3.mix(dyn.prevRotX, dyn.currRotX, alpha);
-    const ry = std3.mix(dyn.prevRotY, dyn.currRotY, alpha);
-    const rz = std3.mix(dyn.prevRotZ, dyn.currRotZ, alpha);
+    const px = std4.mix(dyn.prevPosX, dyn.currPosX, alpha);
+    const py = std4.mix(dyn.prevPosY, dyn.currPosY, alpha);
+    const pz = std4.mix(dyn.prevPosZ, dyn.currPosZ, alpha);
+    const rx = std4.mix(dyn.prevRotX, dyn.currRotX, alpha);
+    const ry = std4.mix(dyn.prevRotY, dyn.currRotY, alpha);
+    const rz = std4.mix(dyn.prevRotZ, dyn.currRotZ, alpha);
     const sx = stat.scaleX;
     const sy = stat.scaleY;
     const sz = stat.scaleZ;
-    const scaled = d5.vec3f(
-      std3.mul(input.position.x, sx),
-      std3.mul(input.position.y, sy),
-      std3.mul(input.position.z, sz)
+    const scaled = d6.vec3f(
+      std4.mul(input.position.x, sx),
+      std4.mul(input.position.y, sy),
+      std4.mul(input.position.z, sz)
     );
-    const czr = std3.cos(rz);
-    const szr = std3.sin(rz);
-    const rz1 = d5.vec3f(
-      std3.sub(std3.mul(scaled.x, czr), std3.mul(scaled.y, szr)),
-      std3.add(std3.mul(scaled.x, szr), std3.mul(scaled.y, czr)),
+    const czr = std4.cos(rz);
+    const szr = std4.sin(rz);
+    const rz1 = d6.vec3f(
+      std4.sub(std4.mul(scaled.x, czr), std4.mul(scaled.y, szr)),
+      std4.add(std4.mul(scaled.x, szr), std4.mul(scaled.y, czr)),
       scaled.z
     );
-    const cyr = std3.cos(ry);
-    const syr = std3.sin(ry);
-    const ry1 = d5.vec3f(
-      std3.add(std3.mul(rz1.x, cyr), std3.mul(rz1.z, syr)),
+    const cyr = std4.cos(ry);
+    const syr = std4.sin(ry);
+    const ry1 = d6.vec3f(
+      std4.add(std4.mul(rz1.x, cyr), std4.mul(rz1.z, syr)),
       rz1.y,
-      std3.sub(std3.mul(rz1.z, cyr), std3.mul(rz1.x, syr))
+      std4.sub(std4.mul(rz1.z, cyr), std4.mul(rz1.x, syr))
     );
-    const cxr = std3.cos(rx);
-    const sxr = std3.sin(rx);
-    const rx1 = d5.vec3f(
+    const cxr = std4.cos(rx);
+    const sxr = std4.sin(rx);
+    const rx1 = d6.vec3f(
       ry1.x,
-      std3.sub(std3.mul(ry1.y, cxr), std3.mul(ry1.z, sxr)),
-      std3.add(std3.mul(ry1.y, sxr), std3.mul(ry1.z, cxr))
+      std4.sub(std4.mul(ry1.y, cxr), std4.mul(ry1.z, sxr)),
+      std4.add(std4.mul(ry1.y, sxr), std4.mul(ry1.z, cxr))
     );
-    const worldPos = d5.vec4f(
-      std3.add(rx1.x, px),
-      std3.add(rx1.y, py),
-      std3.add(rx1.z, pz),
+    const worldPos = d6.vec4f(
+      std4.add(rx1.x, px),
+      std4.add(rx1.y, py),
+      std4.add(rx1.z, pz),
       1
     );
     const nScaled = input.normal;
-    const nRz = d5.vec3f(
-      std3.sub(std3.mul(nScaled.x, czr), std3.mul(nScaled.y, szr)),
-      std3.add(std3.mul(nScaled.x, szr), std3.mul(nScaled.y, czr)),
+    const nRz = d6.vec3f(
+      std4.sub(std4.mul(nScaled.x, czr), std4.mul(nScaled.y, szr)),
+      std4.add(std4.mul(nScaled.x, szr), std4.mul(nScaled.y, czr)),
       nScaled.z
     );
-    const nRy = d5.vec3f(
-      std3.add(std3.mul(nRz.x, cyr), std3.mul(nRz.z, syr)),
+    const nRy = d6.vec3f(
+      std4.add(std4.mul(nRz.x, cyr), std4.mul(nRz.z, syr)),
       nRz.y,
-      std3.sub(std3.mul(nRz.z, cyr), std3.mul(nRz.x, syr))
+      std4.sub(std4.mul(nRz.z, cyr), std4.mul(nRz.x, syr))
     );
-    const nRx = d5.vec3f(
+    const nRx = d6.vec3f(
       nRy.x,
-      std3.sub(std3.mul(nRy.y, cxr), std3.mul(nRy.z, sxr)),
-      std3.add(std3.mul(nRy.y, sxr), std3.mul(nRy.z, cxr))
+      std4.sub(std4.mul(nRy.y, cxr), std4.mul(nRy.z, sxr)),
+      std4.add(std4.mul(nRy.y, sxr), std4.mul(nRy.z, cxr))
     );
-    const clipPos = std3.mul(meshLayout.$.uniforms.viewProjection, worldPos);
+    const clipPos = std4.mul(meshLayout.$.uniforms.viewProjection, worldPos);
     return {
       pos: clipPos,
       vNormal: nRx,
-      vColor: d5.vec3f(stat.colorR, stat.colorG, stat.colorB)
+      vColor: d6.vec3f(stat.colorR, stat.colorG, stat.colorB),
+      vWorldPos: d6.vec3f(worldPos.x, worldPos.y, worldPos.z)
     };
   });
 }
 function createMeshFragment(meshLayout) {
-  return import_typegpu7.default.fragmentFn({
+  return import_typegpu8.default.fragmentFn({
     in: {
-      vNormal: d5.vec3f,
-      vColor: d5.vec3f
+      vNormal: d6.vec3f,
+      vColor: d6.vec3f,
+      vWorldPos: d6.vec3f
     },
-    out: d5.vec4f
+    out: d6.vec4f
   })(function(input) {
-    const normal = std3.normalize(input.vNormal);
-    const lightDir = std3.normalize(d5.vec3f(
-      meshLayout.$.uniforms.lightDirX,
-      meshLayout.$.uniforms.lightDirY,
-      meshLayout.$.uniforms.lightDirZ
-    ));
-    const diff = std3.max(std3.dot(normal, lightDir), 0);
-    const ambient = std3.mul(input.vColor, 0.3);
-    const diffuse = std3.mul(input.vColor, diff);
-    return d5.vec4f(
-      std3.add(ambient.x, diffuse.x),
-      std3.add(ambient.y, diffuse.y),
-      std3.add(ambient.z, diffuse.z),
-      1
+    const u = meshLayout.$.uniforms;
+    const baseColor = input.vColor;
+    const worldPos = input.vWorldPos;
+    const normal = std4.normalize(input.vNormal);
+    const lightDir = std4.normalize(d6.vec3f(u.lightDirX, u.lightDirY, u.lightDirZ));
+    const diff = std4.max(std4.dot(normal, lightDir), 0) * u.lightDirIntensity;
+    let acc = d6.vec3f(
+      baseColor.x * (u.ambientR + u.lightDirR * diff),
+      baseColor.y * (u.ambientG + u.lightDirG * diff),
+      baseColor.z * (u.ambientB + u.lightDirB * diff)
     );
+    const count = u.lightCount;
+    const a = u.alpha;
+    for (let i = d6.u32(0); i < count; i++) {
+      const L = meshLayout.$.lights[i];
+      const pos = d6.vec3f(
+        std4.mix(L.prevPosX, L.currPosX, a),
+        std4.mix(L.prevPosY, L.currPosY, a),
+        std4.mix(L.prevPosZ, L.currPosZ, a)
+      );
+      const axis = d6.vec3f(
+        std4.mix(L.prevDirX, L.currDirX, a),
+        std4.mix(L.prevDirY, L.currDirY, a),
+        std4.mix(L.prevDirZ, L.currDirZ, a)
+      );
+      const c = lightContribution(
+        pos,
+        axis,
+        d6.vec3f(L.colorR, L.colorG, L.colorB),
+        d6.vec4f(L.intensity, L.range, L.innerCos, L.outerCos),
+        normal,
+        worldPos
+      );
+      acc = d6.vec3f(
+        acc.x + baseColor.x * c.x,
+        acc.y + baseColor.y * c.y,
+        acc.z + baseColor.z * c.z
+      );
+    }
+    const mapped = tonemap(acc);
+    return d6.vec4f(mapped.x, mapped.y, mapped.z, 1);
   });
 }
 function createTextureBindGroupLayout() {
-  return import_typegpu7.default.bindGroupLayout({
+  return import_typegpu8.default.bindGroupLayout({
     modelTexture: { texture: "float" },
     modelSampler: { sampler: "filtering" }
   });
 }
 function createTexturedMeshVertex(meshLayout) {
-  return import_typegpu7.default.vertexFn({
+  return import_typegpu8.default.vertexFn({
     in: {
-      position: d5.location(0, d5.vec3f),
-      normal: d5.location(1, d5.vec3f),
-      uv: d5.location(2, d5.vec2f),
-      instanceIndex: d5.builtin.instanceIndex
+      position: d6.location(0, d6.vec3f),
+      normal: d6.location(1, d6.vec3f),
+      uv: d6.location(2, d6.vec2f),
+      instanceIndex: d6.builtin.instanceIndex
     },
     out: {
-      pos: d5.builtin.position,
-      vNormal: d5.vec3f,
-      vColor: d5.vec3f,
-      vUV: d5.vec2f
+      pos: d6.builtin.position,
+      vNormal: d6.vec3f,
+      vColor: d6.vec3f,
+      vUV: d6.vec2f,
+      vWorldPos: d6.vec3f
     }
   })(function(input) {
     const instanceIndex = input.instanceIndex;
@@ -3045,128 +3048,157 @@ function createTexturedMeshVertex(meshLayout) {
     const dyn = meshLayout.$.dynamicInstances[slot];
     const stat = meshLayout.$.staticInstances[slot];
     const alpha = meshLayout.$.uniforms.alpha;
-    const px = std3.mix(dyn.prevPosX, dyn.currPosX, alpha);
-    const py = std3.mix(dyn.prevPosY, dyn.currPosY, alpha);
-    const pz = std3.mix(dyn.prevPosZ, dyn.currPosZ, alpha);
-    const rx = std3.mix(dyn.prevRotX, dyn.currRotX, alpha);
-    const ry = std3.mix(dyn.prevRotY, dyn.currRotY, alpha);
-    const rz = std3.mix(dyn.prevRotZ, dyn.currRotZ, alpha);
+    const px = std4.mix(dyn.prevPosX, dyn.currPosX, alpha);
+    const py = std4.mix(dyn.prevPosY, dyn.currPosY, alpha);
+    const pz = std4.mix(dyn.prevPosZ, dyn.currPosZ, alpha);
+    const rx = std4.mix(dyn.prevRotX, dyn.currRotX, alpha);
+    const ry = std4.mix(dyn.prevRotY, dyn.currRotY, alpha);
+    const rz = std4.mix(dyn.prevRotZ, dyn.currRotZ, alpha);
     const sx = stat.scaleX;
     const sy = stat.scaleY;
     const sz = stat.scaleZ;
-    const scaled = d5.vec3f(
-      std3.mul(input.position.x, sx),
-      std3.mul(input.position.y, sy),
-      std3.mul(input.position.z, sz)
+    const scaled = d6.vec3f(
+      std4.mul(input.position.x, sx),
+      std4.mul(input.position.y, sy),
+      std4.mul(input.position.z, sz)
     );
-    const czr = std3.cos(rz);
-    const szr = std3.sin(rz);
-    const rz1 = d5.vec3f(
-      std3.sub(std3.mul(scaled.x, czr), std3.mul(scaled.y, szr)),
-      std3.add(std3.mul(scaled.x, szr), std3.mul(scaled.y, czr)),
+    const czr = std4.cos(rz);
+    const szr = std4.sin(rz);
+    const rz1 = d6.vec3f(
+      std4.sub(std4.mul(scaled.x, czr), std4.mul(scaled.y, szr)),
+      std4.add(std4.mul(scaled.x, szr), std4.mul(scaled.y, czr)),
       scaled.z
     );
-    const cyr = std3.cos(ry);
-    const syr = std3.sin(ry);
-    const ry1 = d5.vec3f(
-      std3.add(std3.mul(rz1.x, cyr), std3.mul(rz1.z, syr)),
+    const cyr = std4.cos(ry);
+    const syr = std4.sin(ry);
+    const ry1 = d6.vec3f(
+      std4.add(std4.mul(rz1.x, cyr), std4.mul(rz1.z, syr)),
       rz1.y,
-      std3.sub(std3.mul(rz1.z, cyr), std3.mul(rz1.x, syr))
+      std4.sub(std4.mul(rz1.z, cyr), std4.mul(rz1.x, syr))
     );
-    const cxr = std3.cos(rx);
-    const sxr = std3.sin(rx);
-    const rx1 = d5.vec3f(
+    const cxr = std4.cos(rx);
+    const sxr = std4.sin(rx);
+    const rx1 = d6.vec3f(
       ry1.x,
-      std3.sub(std3.mul(ry1.y, cxr), std3.mul(ry1.z, sxr)),
-      std3.add(std3.mul(ry1.y, sxr), std3.mul(ry1.z, cxr))
+      std4.sub(std4.mul(ry1.y, cxr), std4.mul(ry1.z, sxr)),
+      std4.add(std4.mul(ry1.y, sxr), std4.mul(ry1.z, cxr))
     );
-    const worldPos = d5.vec4f(
-      std3.add(rx1.x, px),
-      std3.add(rx1.y, py),
-      std3.add(rx1.z, pz),
+    const worldPos = d6.vec4f(
+      std4.add(rx1.x, px),
+      std4.add(rx1.y, py),
+      std4.add(rx1.z, pz),
       1
     );
     const nScaled = input.normal;
-    const nRz = d5.vec3f(
-      std3.sub(std3.mul(nScaled.x, czr), std3.mul(nScaled.y, szr)),
-      std3.add(std3.mul(nScaled.x, szr), std3.mul(nScaled.y, czr)),
+    const nRz = d6.vec3f(
+      std4.sub(std4.mul(nScaled.x, czr), std4.mul(nScaled.y, szr)),
+      std4.add(std4.mul(nScaled.x, szr), std4.mul(nScaled.y, czr)),
       nScaled.z
     );
-    const nRy = d5.vec3f(
-      std3.add(std3.mul(nRz.x, cyr), std3.mul(nRz.z, syr)),
+    const nRy = d6.vec3f(
+      std4.add(std4.mul(nRz.x, cyr), std4.mul(nRz.z, syr)),
       nRz.y,
-      std3.sub(std3.mul(nRz.z, cyr), std3.mul(nRz.x, syr))
+      std4.sub(std4.mul(nRz.z, cyr), std4.mul(nRz.x, syr))
     );
-    const nRx = d5.vec3f(
+    const nRx = d6.vec3f(
       nRy.x,
-      std3.sub(std3.mul(nRy.y, cxr), std3.mul(nRy.z, sxr)),
-      std3.add(std3.mul(nRy.y, sxr), std3.mul(nRy.z, cxr))
+      std4.sub(std4.mul(nRy.y, cxr), std4.mul(nRy.z, sxr)),
+      std4.add(std4.mul(nRy.y, sxr), std4.mul(nRy.z, cxr))
     );
-    const clipPos = std3.mul(meshLayout.$.uniforms.viewProjection, worldPos);
+    const clipPos = std4.mul(meshLayout.$.uniforms.viewProjection, worldPos);
     return {
       pos: clipPos,
       vNormal: nRx,
-      vColor: d5.vec3f(stat.colorR, stat.colorG, stat.colorB),
-      vUV: input.uv
+      vColor: d6.vec3f(stat.colorR, stat.colorG, stat.colorB),
+      vUV: input.uv,
+      vWorldPos: d6.vec3f(worldPos.x, worldPos.y, worldPos.z)
     };
   });
 }
 function createTexturedMeshFragment(meshLayout, texLayout) {
-  return import_typegpu7.default.fragmentFn({
+  return import_typegpu8.default.fragmentFn({
     in: {
-      vNormal: d5.vec3f,
-      vColor: d5.vec3f,
-      vUV: d5.vec2f
+      vNormal: d6.vec3f,
+      vColor: d6.vec3f,
+      vUV: d6.vec2f,
+      vWorldPos: d6.vec3f
     },
-    out: d5.vec4f
+    out: d6.vec4f
   })(function(input) {
-    const normal = std3.normalize(input.vNormal);
-    const lightDir = std3.normalize(d5.vec3f(
-      meshLayout.$.uniforms.lightDirX,
-      meshLayout.$.uniforms.lightDirY,
-      meshLayout.$.uniforms.lightDirZ
-    ));
-    const texColor = std3.textureSample(texLayout.$.modelTexture, texLayout.$.modelSampler, input.vUV);
-    const baseColor = d5.vec3f(
-      std3.mul(texColor.x, input.vColor.x),
-      std3.mul(texColor.y, input.vColor.y),
-      std3.mul(texColor.z, input.vColor.z)
+    const u = meshLayout.$.uniforms;
+    const worldPos = input.vWorldPos;
+    const normal = std4.normalize(input.vNormal);
+    const texColor = std4.textureSample(texLayout.$.modelTexture, texLayout.$.modelSampler, input.vUV);
+    const baseColor = d6.vec3f(
+      std4.mul(texColor.x, input.vColor.x),
+      std4.mul(texColor.y, input.vColor.y),
+      std4.mul(texColor.z, input.vColor.z)
     );
-    const diff = std3.max(std3.dot(normal, lightDir), 0);
-    const ambient = std3.mul(baseColor, 0.3);
-    const diffuse = std3.mul(baseColor, diff);
-    return d5.vec4f(
-      std3.add(ambient.x, diffuse.x),
-      std3.add(ambient.y, diffuse.y),
-      std3.add(ambient.z, diffuse.z),
-      std3.mul(texColor.w, 1)
+    const lightDir = std4.normalize(d6.vec3f(u.lightDirX, u.lightDirY, u.lightDirZ));
+    const diff = std4.max(std4.dot(normal, lightDir), 0) * u.lightDirIntensity;
+    let acc = d6.vec3f(
+      baseColor.x * (u.ambientR + u.lightDirR * diff),
+      baseColor.y * (u.ambientG + u.lightDirG * diff),
+      baseColor.z * (u.ambientB + u.lightDirB * diff)
     );
+    const count = u.lightCount;
+    const a = u.alpha;
+    for (let i = d6.u32(0); i < count; i++) {
+      const L = meshLayout.$.lights[i];
+      const pos = d6.vec3f(
+        std4.mix(L.prevPosX, L.currPosX, a),
+        std4.mix(L.prevPosY, L.currPosY, a),
+        std4.mix(L.prevPosZ, L.currPosZ, a)
+      );
+      const axis = d6.vec3f(
+        std4.mix(L.prevDirX, L.currDirX, a),
+        std4.mix(L.prevDirY, L.currDirY, a),
+        std4.mix(L.prevDirZ, L.currDirZ, a)
+      );
+      const c = lightContribution(
+        pos,
+        axis,
+        d6.vec3f(L.colorR, L.colorG, L.colorB),
+        d6.vec4f(L.intensity, L.range, L.innerCos, L.outerCos),
+        normal,
+        worldPos
+      );
+      acc = d6.vec3f(
+        acc.x + baseColor.x * c.x,
+        acc.y + baseColor.y * c.y,
+        acc.z + baseColor.z * c.z
+      );
+    }
+    const mapped = tonemap(acc);
+    return d6.vec4f(mapped.x, mapped.y, mapped.z, texColor.w);
   });
 }
 function createSkinnedMeshLayout(maxInstances, maxBones) {
-  return import_typegpu7.default.bindGroupLayout({
+  return import_typegpu8.default.bindGroupLayout({
     uniforms: { uniform: MeshUniforms },
-    dynamicInstances: { storage: d5.arrayOf(DynamicMesh, maxInstances) },
-    staticInstances: { storage: d5.arrayOf(SkinnedStaticMesh, maxInstances) },
-    slotIndices: { storage: d5.arrayOf(d5.u32, maxInstances) },
-    boneMatrices: { storage: d5.arrayOf(d5.mat4x4f, maxBones) }
+    dynamicInstances: { storage: d6.arrayOf(DynamicMesh, maxInstances) },
+    staticInstances: { storage: d6.arrayOf(SkinnedStaticMesh, maxInstances) },
+    slotIndices: { storage: d6.arrayOf(d6.u32, maxInstances) },
+    boneMatrices: { storage: d6.arrayOf(d6.mat4x4f, maxBones) },
+    lights: { storage: d6.arrayOf(Light, MAX_LIGHTS) }
   });
 }
 function createSkinnedMeshVertex(layout) {
-  return import_typegpu7.default.vertexFn({
+  return import_typegpu8.default.vertexFn({
     in: {
-      position: d5.location(0, d5.vec3f),
-      normal: d5.location(1, d5.vec3f),
-      uv: d5.location(2, d5.vec2f),
-      joints: d5.location(3, d5.vec4u),
-      weights: d5.location(4, d5.vec4f),
-      instanceIndex: d5.builtin.instanceIndex
+      position: d6.location(0, d6.vec3f),
+      normal: d6.location(1, d6.vec3f),
+      uv: d6.location(2, d6.vec2f),
+      joints: d6.location(3, d6.vec4u),
+      weights: d6.location(4, d6.vec4f),
+      instanceIndex: d6.builtin.instanceIndex
     },
     out: {
-      pos: d5.builtin.position,
-      vNormal: d5.vec3f,
-      vColor: d5.vec3f,
-      vUV: d5.vec2f
+      pos: d6.builtin.position,
+      vNormal: d6.vec3f,
+      vColor: d6.vec3f,
+      vUV: d6.vec2f,
+      vWorldPos: d6.vec3f
     }
   })(function(input) {
     const slot = layout.$.slotIndices[input.instanceIndex];
@@ -3186,69 +3218,69 @@ function createSkinnedMeshVertex(layout) {
     const m1 = layout.$.boneMatrices[boneOffset + j1];
     const m2 = layout.$.boneMatrices[boneOffset + j2];
     const m3 = layout.$.boneMatrices[boneOffset + j3];
-    const p = d5.vec4f(input.position.x, input.position.y, input.position.z, 1);
+    const p = d6.vec4f(input.position.x, input.position.y, input.position.z, 1);
     const sp0 = m0 * p;
     const sp1 = m1 * p;
     const sp2 = m2 * p;
     const sp3 = m3 * p;
-    const skinnedPos = d5.vec3f(
+    const skinnedPos = d6.vec3f(
       sp0.x * w0 + sp1.x * w1 + sp2.x * w2 + sp3.x * w3,
       sp0.y * w0 + sp1.y * w1 + sp2.y * w2 + sp3.y * w3,
       sp0.z * w0 + sp1.z * w1 + sp2.z * w2 + sp3.z * w3
     );
-    const n = d5.vec4f(input.normal.x, input.normal.y, input.normal.z, 0);
+    const n = d6.vec4f(input.normal.x, input.normal.y, input.normal.z, 0);
     const sn0 = m0 * n;
     const sn1 = m1 * n;
     const sn2 = m2 * n;
     const sn3 = m3 * n;
-    const skinnedNormal = d5.vec3f(
+    const skinnedNormal = d6.vec3f(
       sn0.x * w0 + sn1.x * w1 + sn2.x * w2 + sn3.x * w3,
       sn0.y * w0 + sn1.y * w1 + sn2.y * w2 + sn3.y * w3,
       sn0.z * w0 + sn1.z * w1 + sn2.z * w2 + sn3.z * w3
     );
-    const px = std3.mix(dyn.prevPosX, dyn.currPosX, alpha);
-    const py = std3.mix(dyn.prevPosY, dyn.currPosY, alpha);
-    const pz = std3.mix(dyn.prevPosZ, dyn.currPosZ, alpha);
-    const rx = std3.mix(dyn.prevRotX, dyn.currRotX, alpha);
-    const ry = std3.mix(dyn.prevRotY, dyn.currRotY, alpha);
-    const rz = std3.mix(dyn.prevRotZ, dyn.currRotZ, alpha);
+    const px = std4.mix(dyn.prevPosX, dyn.currPosX, alpha);
+    const py = std4.mix(dyn.prevPosY, dyn.currPosY, alpha);
+    const pz = std4.mix(dyn.prevPosZ, dyn.currPosZ, alpha);
+    const rx = std4.mix(dyn.prevRotX, dyn.currRotX, alpha);
+    const ry = std4.mix(dyn.prevRotY, dyn.currRotY, alpha);
+    const rz = std4.mix(dyn.prevRotZ, dyn.currRotZ, alpha);
     const sx = stat.scaleX;
     const sy = stat.scaleY;
     const sz = stat.scaleZ;
-    const scaled = d5.vec3f(skinnedPos.x * sx, skinnedPos.y * sy, skinnedPos.z * sz);
-    const czr = std3.cos(rz);
-    const szr = std3.sin(rz);
-    const rz1 = d5.vec3f(
+    const scaled = d6.vec3f(skinnedPos.x * sx, skinnedPos.y * sy, skinnedPos.z * sz);
+    const czr = std4.cos(rz);
+    const szr = std4.sin(rz);
+    const rz1 = d6.vec3f(
       scaled.x * czr - scaled.y * szr,
       scaled.x * szr + scaled.y * czr,
       scaled.z
     );
-    const cyr = std3.cos(ry);
-    const syr = std3.sin(ry);
-    const ry1 = d5.vec3f(
+    const cyr = std4.cos(ry);
+    const syr = std4.sin(ry);
+    const ry1 = d6.vec3f(
       rz1.x * cyr + rz1.z * syr,
       rz1.y,
       rz1.z * cyr - rz1.x * syr
     );
-    const cxr = std3.cos(rx);
-    const sxr = std3.sin(rx);
-    const rx1 = d5.vec3f(
+    const cxr = std4.cos(rx);
+    const sxr = std4.sin(rx);
+    const rx1 = d6.vec3f(
       ry1.x,
       ry1.y * cxr - ry1.z * sxr,
       ry1.y * sxr + ry1.z * cxr
     );
-    const worldPos = d5.vec4f(rx1.x + px, rx1.y + py, rx1.z + pz, 1);
-    const nRz = d5.vec3f(
+    const worldPos = d6.vec4f(rx1.x + px, rx1.y + py, rx1.z + pz, 1);
+    const nRz = d6.vec3f(
       skinnedNormal.x * czr - skinnedNormal.y * szr,
       skinnedNormal.x * szr + skinnedNormal.y * czr,
       skinnedNormal.z
     );
-    const nRy = d5.vec3f(
+    const nRy = d6.vec3f(
       nRz.x * cyr + nRz.z * syr,
       nRz.y,
       nRz.z * cyr - nRz.x * syr
     );
-    const nRx = d5.vec3f(
+    const nRx = d6.vec3f(
       nRy.x,
       nRy.y * cxr - nRy.z * sxr,
       nRy.y * sxr + nRy.z * cxr
@@ -3257,14 +3289,629 @@ function createSkinnedMeshVertex(layout) {
     return {
       pos: clipPos,
       vNormal: nRx,
-      vColor: d5.vec3f(stat.colorR, stat.colorG, stat.colorB),
-      vUV: input.uv
+      vColor: d6.vec3f(stat.colorR, stat.colorG, stat.colorB),
+      vUV: input.uv,
+      vWorldPos: d6.vec3f(worldPos.x, worldPos.y, worldPos.z)
     };
   });
 }
+function createSkinnedMeshFragment(meshLayout) {
+  return import_typegpu8.default.fragmentFn({
+    in: {
+      vNormal: d6.vec3f,
+      vColor: d6.vec3f,
+      vUV: d6.vec2f,
+      vWorldPos: d6.vec3f
+    },
+    out: d6.vec4f
+  })(function(input) {
+    const u = meshLayout.$.uniforms;
+    const baseColor = input.vColor;
+    const worldPos = input.vWorldPos;
+    const normal = std4.normalize(input.vNormal);
+    const lightDir = std4.normalize(d6.vec3f(u.lightDirX, u.lightDirY, u.lightDirZ));
+    const diff = std4.max(std4.dot(normal, lightDir), 0) * u.lightDirIntensity;
+    let acc = d6.vec3f(
+      baseColor.x * (u.ambientR + u.lightDirR * diff),
+      baseColor.y * (u.ambientG + u.lightDirG * diff),
+      baseColor.z * (u.ambientB + u.lightDirB * diff)
+    );
+    const count = u.lightCount;
+    const a = u.alpha;
+    for (let i = d6.u32(0); i < count; i++) {
+      const L = meshLayout.$.lights[i];
+      const pos = d6.vec3f(
+        std4.mix(L.prevPosX, L.currPosX, a),
+        std4.mix(L.prevPosY, L.currPosY, a),
+        std4.mix(L.prevPosZ, L.currPosZ, a)
+      );
+      const axis = d6.vec3f(
+        std4.mix(L.prevDirX, L.currDirX, a),
+        std4.mix(L.prevDirY, L.currDirY, a),
+        std4.mix(L.prevDirZ, L.currDirZ, a)
+      );
+      const c = lightContribution(
+        pos,
+        axis,
+        d6.vec3f(L.colorR, L.colorG, L.colorB),
+        d6.vec4f(L.intensity, L.range, L.innerCos, L.outerCos),
+        normal,
+        worldPos
+      );
+      acc = d6.vec3f(
+        acc.x + baseColor.x * c.x,
+        acc.y + baseColor.y * c.y,
+        acc.z + baseColor.z * c.z
+      );
+    }
+    const mapped = tonemap(acc);
+    return d6.vec4f(mapped.x, mapped.y, mapped.z, 1);
+  });
+}
+
+// src/3d/lights.ts
+var import_slot_map2 = require("murow/core/slot-map");
+var KIND = 0;
+var CURR_POS_X = 1;
+var CURR_POS_Y = 2;
+var CURR_POS_Z = 3;
+var PREV_POS_X = 4;
+var PREV_POS_Y = 5;
+var PREV_POS_Z = 6;
+var CURR_DIR_X = 7;
+var CURR_DIR_Y = 8;
+var CURR_DIR_Z = 9;
+var PREV_DIR_X = 10;
+var PREV_DIR_Y = 11;
+var PREV_DIR_Z = 12;
+var COL_R = 13;
+var COL_G = 14;
+var COL_B = 15;
+var INTENSITY = 16;
+var RANGE = 17;
+var INNER_COS = 18;
+var OUTER_COS = 19;
+var CASTS_SHADOW = 20;
+var SHADOW_INDEX = 21;
+var LightSystem = class {
+  constructor(maxLights) {
+    this.maxLights = maxLights;
+    // Global directional + ambient terms (the classic fixed look; now configurable).
+    this.dirDir = [0.3, 0.8, 0.5];
+    this.dirColor = [1, 1, 1];
+    this.dirIntensity = 1;
+    this.ambient = [0.3, 0.3, 0.3];
+    this.data = new Float32Array(maxLights * LIGHT_FLOATS);
+    this.slots = new import_slot_map2.SlotMap(maxLights);
+    this.enabled = new Uint8Array(maxLights).fill(1);
+    this.handles = new Array(maxLights).fill(null);
+    this.uploadData = new Float32Array(maxLights * LIGHT_FLOATS);
+    this.angle = new Float32Array(maxLights);
+    this.smoothness = new Float32Array(maxLights);
+  }
+  /** Add a dynamic point or spot light. Throws past `maxLights`. */
+  add(spec) {
+    const slot = this.slots.add();
+    if (slot === -1)
+      throw new Error(`Max lights (${this.maxLights}) reached`);
+    this.enabled[slot] = 1;
+    this.writeSlot(slot, spec);
+    const data = this.data;
+    const enabledArr = this.enabled;
+    const slots = this.slots;
+    const handles = this.handles;
+    const angleArr = this.angle;
+    const smoothArr = this.smoothness;
+    const base = slot * LIGHT_FLOATS;
+    let destroyed = false;
+    const posOut = [0, 0, 0];
+    const dirOut = [0, 0, 0];
+    const colOut = [0, 0, 0];
+    const handle = {
+      slot,
+      setPosition(x, y, z) {
+        data[base + CURR_POS_X] = x;
+        data[base + CURR_POS_Y] = y;
+        data[base + CURR_POS_Z] = z;
+      },
+      setDirection(x, y, z) {
+        data[base + CURR_DIR_X] = x;
+        data[base + CURR_DIR_Y] = y;
+        data[base + CURR_DIR_Z] = z;
+      },
+      teleport(x, y, z) {
+        data[base + CURR_POS_X] = x;
+        data[base + CURR_POS_Y] = y;
+        data[base + CURR_POS_Z] = z;
+        data[base + PREV_POS_X] = x;
+        data[base + PREV_POS_Y] = y;
+        data[base + PREV_POS_Z] = z;
+      },
+      setColor(r, g, b) {
+        data[base + COL_R] = r;
+        data[base + COL_G] = g;
+        data[base + COL_B] = b;
+      },
+      get position() {
+        posOut[0] = data[base + CURR_POS_X];
+        posOut[1] = data[base + CURR_POS_Y];
+        posOut[2] = data[base + CURR_POS_Z];
+        return posOut;
+      },
+      get direction() {
+        dirOut[0] = data[base + CURR_DIR_X];
+        dirOut[1] = data[base + CURR_DIR_Y];
+        dirOut[2] = data[base + CURR_DIR_Z];
+        return dirOut;
+      },
+      get color() {
+        colOut[0] = data[base + COL_R];
+        colOut[1] = data[base + COL_G];
+        colOut[2] = data[base + COL_B];
+        return colOut;
+      },
+      get intensity() {
+        return data[base + INTENSITY];
+      },
+      set intensity(v) {
+        data[base + INTENSITY] = v;
+      },
+      get range() {
+        return data[base + RANGE];
+      },
+      set range(v) {
+        data[base + RANGE] = v;
+      },
+      get angle() {
+        return angleArr[slot];
+      },
+      set angle(v) {
+        angleArr[slot] = v;
+        const { innerCos, outerCos } = coneCosines(v, smoothArr[slot]);
+        data[base + INNER_COS] = innerCos;
+        data[base + OUTER_COS] = outerCos;
+      },
+      get smoothness() {
+        return smoothArr[slot];
+      },
+      set smoothness(v) {
+        const s = v < 0 ? 0 : v > 1 ? 1 : v;
+        smoothArr[slot] = s;
+        const { innerCos, outerCos } = coneCosines(angleArr[slot], s);
+        data[base + INNER_COS] = innerCos;
+        data[base + OUTER_COS] = outerCos;
+      },
+      get enabled() {
+        return enabledArr[slot] === 1;
+      },
+      set enabled(v) {
+        enabledArr[slot] = v ? 1 : 0;
+      },
+      destroy() {
+        if (destroyed)
+          return;
+        destroyed = true;
+        data.fill(0, base, base + LIGHT_FLOATS);
+        handles[slot] = null;
+        slots.remove(slot);
+      }
+    };
+    this.handles[slot] = handle;
+    return handle;
+  }
+  /**
+   * Set the global directional light (the "sun"). `direction` points from the
+   * surface toward the light. Defaults to `(0.3, 0.8, 0.5)`, white, intensity 1.
+   */
+  setDirectional(direction, color = [1, 1, 1], intensity = 1) {
+    this.dirDir = [direction[0], direction[1], direction[2]];
+    this.dirColor = [color[0], color[1], color[2]];
+    this.dirIntensity = intensity;
+  }
+  /** Set the global ambient term. Defaults to `(0.3, 0.3, 0.3)`. */
+  setAmbient(color) {
+    this.ambient = [color[0], color[1], color[2]];
+  }
+  /** Number of live dynamic lights. */
+  get count() {
+    return this.slots.size;
+  }
+  /**
+   * Pack enabled lights into a dense run for upload. Disabled lights are
+   * skipped so the shader loop only walks contributing lights. Returns the
+   * shared scratch buffer, the light count, and the byte length to upload
+   * (so the caller never needs the record layout).
+   */
+  pack() {
+    const active = this.slots.activeSlots;
+    const size = this.slots.size;
+    const src = this.data;
+    const dst = this.uploadData;
+    let count = 0;
+    for (let i = 0; i < size; i++) {
+      const slot = active[i];
+      if (this.enabled[slot] === 0)
+        continue;
+      const sBase = slot * LIGHT_FLOATS;
+      dst.set(src.subarray(sBase, sBase + LIGHT_FLOATS), count * LIGHT_FLOATS);
+      count++;
+    }
+    return { data: dst, count, byteLength: count * LIGHT_FLOATS * 4 };
+  }
+  /**
+   * Stamp the directional + ambient terms and the light count into the
+   * renderer's uniform array, starting at `offset` (the float index after the
+   * VP matrix + alpha). Layout: lightDir(3), dirColor(3), dirIntensity(1),
+   * ambient(3), then lightCount as a u32 reinterpret at `offset + 10`.
+   */
+  writeUniforms(uniformData, offset, count) {
+    uniformData[offset + 0] = this.dirDir[0];
+    uniformData[offset + 1] = this.dirDir[1];
+    uniformData[offset + 2] = this.dirDir[2];
+    uniformData[offset + 3] = this.dirColor[0];
+    uniformData[offset + 4] = this.dirColor[1];
+    uniformData[offset + 5] = this.dirColor[2];
+    uniformData[offset + 6] = this.dirIntensity;
+    uniformData[offset + 7] = this.ambient[0];
+    uniformData[offset + 8] = this.ambient[1];
+    uniformData[offset + 9] = this.ambient[2];
+    new Uint32Array(uniformData.buffer)[offset + 10] = count;
+  }
+  /**
+   * Snapshot every live light's current position/direction into its prev
+   * slot. Called from the renderer's `storePreviousState()` in `pre-tick`, so
+   * the shader can `mix(prev, curr, alpha)` and moving lights interpolate at
+   * render rate instead of snapping at the tick boundary.
+   */
+  storePrevious() {
+    const active = this.slots.activeSlots;
+    const size = this.slots.size;
+    const data = this.data;
+    for (let i = 0; i < size; i++) {
+      const base = active[i] * LIGHT_FLOATS;
+      data[base + PREV_POS_X] = data[base + CURR_POS_X];
+      data[base + PREV_POS_Y] = data[base + CURR_POS_Y];
+      data[base + PREV_POS_Z] = data[base + CURR_POS_Z];
+      data[base + PREV_DIR_X] = data[base + CURR_DIR_X];
+      data[base + PREV_DIR_Y] = data[base + CURR_DIR_Y];
+      data[base + PREV_DIR_Z] = data[base + CURR_DIR_Z];
+    }
+  }
+  /** Write a light spec into its CPU slot. Prev is seeded to curr (no spawn lerp). */
+  writeSlot(slot, spec) {
+    const base = slot * LIGHT_FLOATS;
+    const data = this.data;
+    const color = spec.color ?? [1, 1, 1];
+    const [px, py, pz] = spec.position;
+    data[base + KIND] = spec.type === "spot" ? LIGHT_KIND_SPOT : LIGHT_KIND_POINT;
+    data[base + CURR_POS_X] = px;
+    data[base + PREV_POS_X] = px;
+    data[base + CURR_POS_Y] = py;
+    data[base + PREV_POS_Y] = py;
+    data[base + CURR_POS_Z] = pz;
+    data[base + PREV_POS_Z] = pz;
+    data[base + COL_R] = color[0];
+    data[base + COL_G] = color[1];
+    data[base + COL_B] = color[2];
+    data[base + INTENSITY] = spec.intensity ?? 1;
+    data[base + RANGE] = spec.range ?? 10;
+    data[base + CASTS_SHADOW] = 0;
+    data[base + SHADOW_INDEX] = -1;
+    if (spec.type === "spot") {
+      const [dx, dy, dz] = spec.direction;
+      data[base + CURR_DIR_X] = dx;
+      data[base + PREV_DIR_X] = dx;
+      data[base + CURR_DIR_Y] = dy;
+      data[base + PREV_DIR_Y] = dy;
+      data[base + CURR_DIR_Z] = dz;
+      data[base + PREV_DIR_Z] = dz;
+      const angle = spec.angle ?? 0.5;
+      const smoothness = Math.min(1, Math.max(0, spec.smoothness ?? 0.5));
+      this.angle[slot] = angle;
+      this.smoothness[slot] = smoothness;
+      const { innerCos, outerCos } = coneCosines(angle, smoothness);
+      data[base + INNER_COS] = innerCos;
+      data[base + OUTER_COS] = outerCos;
+    } else {
+      data[base + CURR_DIR_X] = 0;
+      data[base + PREV_DIR_X] = 0;
+      data[base + CURR_DIR_Y] = 0;
+      data[base + PREV_DIR_Y] = 0;
+      data[base + CURR_DIR_Z] = 0;
+      data[base + PREV_DIR_Z] = 0;
+      this.angle[slot] = 0;
+      this.smoothness[slot] = 0;
+      data[base + INNER_COS] = 1;
+      data[base + OUTER_COS] = -1;
+    }
+  }
+};
+function coneCosines(angle, smoothness) {
+  const outerCos = Math.cos(angle);
+  const innerCos = Math.cos(angle * (1 - smoothness));
+  return { innerCos, outerCos };
+}
+
+// src/camera/camera-3d.ts
+var import_lerp2 = require("murow/core/lerp");
+var import_ray = require("murow/core/ray");
+var Camera3D = class {
+  constructor() {
+    this.position = [0, 5, -10];
+    this.target = [0, 0, 0];
+    this.up = [0, 1, 0];
+    this.fov = 60;
+    this.near = 0.1;
+    this.far = 1e3;
+    this.aspect = 1;
+    this.movement = "local";
+    // Previous state for interpolation (stored before each tick)
+    this._prevPosition = [0, 5, -10];
+    this._prevTarget = [0, 0, 0];
+    // Interpolated state used for rendering
+    this._renderPosition = [0, 5, -10];
+    this._renderTarget = [0, 0, 0];
+    this._viewMatrix = new Float32Array(16);
+    this._projMatrix = new Float32Array(16);
+    this._vpMatrix = new Float32Array(16);
+    this._ray = new import_ray.Ray3D();
+    this._width = 1;
+    this._height = 1;
+  }
+  /**
+   * Store current position/target as previous. Call before each tick.
+   */
+  storePrevious() {
+    this._prevPosition[0] = this.position[0];
+    this._prevPosition[1] = this.position[1];
+    this._prevPosition[2] = this.position[2];
+    this._prevTarget[0] = this.target[0];
+    this._prevTarget[1] = this.target[1];
+    this._prevTarget[2] = this.target[2];
+  }
+  /**
+   * Smoothly move the camera toward a target point.
+   * Call each tick. The camera and its look-at target lerp toward the given position.
+   * @param targetX  World X to follow
+   * @param targetY  World Y to follow
+   * @param targetZ  World Z to follow
+   * @param smoothing  0-1. 1 = snap instantly, 0.1 = lazy follow. Default 1.
+   */
+  follow(targetX, targetY, targetZ, smoothing = 1) {
+    const dx = targetX - this.target[0];
+    const dy = targetY - this.target[1];
+    const dz = targetZ - this.target[2];
+    const mx = dx * smoothing;
+    const my = dy * smoothing;
+    const mz = dz * smoothing;
+    this.target[0] += mx;
+    this.target[1] += my;
+    this.target[2] += mz;
+    this.position[0] += mx;
+    this.position[1] += my;
+    this.position[2] += mz;
+  }
+  /**
+   * Interpolate between previous and current state. Call before rendering.
+   */
+  interpolate(alpha) {
+    this._renderPosition[0] = (0, import_lerp2.lerp)(this._prevPosition[0], this.position[0], alpha);
+    this._renderPosition[1] = (0, import_lerp2.lerp)(this._prevPosition[1], this.position[1], alpha);
+    this._renderPosition[2] = (0, import_lerp2.lerp)(this._prevPosition[2], this.position[2], alpha);
+    this._renderTarget[0] = (0, import_lerp2.lerp)(this._prevTarget[0], this.target[0], alpha);
+    this._renderTarget[1] = (0, import_lerp2.lerp)(this._prevTarget[1], this.target[1], alpha);
+    this._renderTarget[2] = (0, import_lerp2.lerp)(this._prevTarget[2], this.target[2], alpha);
+  }
+  /**
+   * Build the view matrix (lookAt) using interpolated state.
+   */
+  getViewMatrix() {
+    lookAt(this._viewMatrix, this._renderPosition, this._renderTarget, this.up);
+    return this._viewMatrix;
+  }
+  /**
+   * Build the perspective projection matrix.
+   */
+  getProjectionMatrix() {
+    perspective(this._projMatrix, this.fov * (Math.PI / 180), this.aspect, this.near, this.far);
+    return this._projMatrix;
+  }
+  /**
+   * Build the combined view-projection matrix.
+   */
+  getViewProjectionMatrix() {
+    this.getViewMatrix();
+    this.getProjectionMatrix();
+    mat4Multiply(this._vpMatrix, this._projMatrix, this._viewMatrix);
+    return this._vpMatrix;
+  }
+  setAspect(width, height) {
+    this.aspect = width / height;
+    this._width = width;
+    this._height = height;
+  }
+  setPosition(x, y, z) {
+    this.position[0] = x;
+    this.position[1] = y;
+    this.position[2] = z;
+  }
+  /**
+   * Unproject a screen coordinate into a world-space ray.
+   * Requires `setAspect(width, height)` to have been called first.
+   * Returns a pre-allocated Ray3D — copy origin/direction if you need to store it.
+   */
+  screenToRay(screenX, screenY) {
+    this.getViewMatrix();
+    const m = this._viewMatrix;
+    const ndcX = 2 * screenX / this._width - 1;
+    const ndcY = 1 - 2 * screenY / this._height;
+    const t = Math.tan(this.fov * Math.PI / 180 * 0.5);
+    const rightX = m[0], rightY = m[4], rightZ = m[8];
+    const upX = m[1], upY = m[5], upZ = m[9];
+    const fwdX = -m[2], fwdY = -m[6], fwdZ = -m[10];
+    const dx = fwdX + rightX * ndcX * t * this.aspect + upX * ndcY * t;
+    const dy = fwdY + rightY * ndcX * t * this.aspect + upY * ndcY * t;
+    const dz = fwdZ + rightZ * ndcX * t * this.aspect + upZ * ndcY * t;
+    this._ray.set(this.position[0], this.position[1], this.position[2], dx, dy, dz);
+    return this._ray;
+  }
+  setTarget(x, y, z) {
+    this.target[0] = x;
+    this.target[1] = y;
+    this.target[2] = z;
+  }
+  /**
+   * Move the camera. Behaviour is determined by the `movement` property:
+   * - `'local'`    — along camera axes, pitch included (free-fly / spectator)
+   * - `'grounded'` — yaw-projected XZ + world Y (FPS)
+   * - `'global'`   — world axes directly (isometric / platformer)
+   */
+  move(right, up, forward) {
+    if (this.movement === "grounded")
+      this._moveGrounded(right, up, forward);
+    else if (this.movement === "global")
+      this._moveGlobal(right, up, forward);
+    else
+      this._moveLocal(right, up, forward);
+  }
+  _moveLocal(right, up, forward) {
+    this.getViewMatrix();
+    const m = this._viewMatrix;
+    const dx = m[0] * right + m[1] * up - m[2] * forward;
+    const dy = m[4] * right + m[5] * up - m[6] * forward;
+    const dz = m[8] * right + m[9] * up - m[10] * forward;
+    this.position[0] += dx;
+    this.position[1] += dy;
+    this.position[2] += dz;
+    this.target[0] += dx;
+    this.target[1] += dy;
+    this.target[2] += dz;
+  }
+  _moveGrounded(right, up, forward) {
+    const yaw = Math.atan2(this.target[0] - this.position[0], this.target[2] - this.position[2]);
+    const dx = Math.sin(yaw) * forward + Math.cos(yaw) * right;
+    const dz = Math.cos(yaw) * forward - Math.sin(yaw) * right;
+    this.position[0] += dx;
+    this.position[1] += up;
+    this.position[2] += dz;
+    this.target[0] += dx;
+    this.target[1] += up;
+    this.target[2] += dz;
+  }
+  _moveGlobal(right, up, forward) {
+    this.position[0] += right;
+    this.position[1] += up;
+    this.position[2] += forward;
+    this.target[0] += right;
+    this.target[1] += up;
+    this.target[2] += forward;
+  }
+  /**
+   * Orbit around the target point. Zero allocations.
+   * @param yawDelta   Horizontal rotation in radians (positive = rotate right)
+   * @param pitchDelta Vertical rotation in radians (positive = rotate up)
+   */
+  orbit(yawDelta, pitchDelta) {
+    let ox = this.position[0] - this.target[0];
+    let oy = this.position[1] - this.target[1];
+    let oz = this.position[2] - this.target[2];
+    const dist = Math.sqrt(ox * ox + oy * oy + oz * oz);
+    let yaw = Math.atan2(ox, oz);
+    let pitch = Math.asin(oy / dist);
+    yaw += yawDelta;
+    pitch += pitchDelta;
+    pitch = Math.max(-Math.PI * 0.49, Math.min(Math.PI * 0.49, pitch));
+    this.position[0] = this.target[0] + Math.sin(yaw) * Math.cos(pitch) * dist;
+    this.position[1] = this.target[1] + Math.sin(pitch) * dist;
+    this.position[2] = this.target[2] + Math.cos(yaw) * Math.cos(pitch) * dist;
+  }
+  /**
+   * Zoom by adjusting distance to target. Zero allocations.
+   * @param delta Positive = zoom in, negative = zoom out
+   */
+  zoom(delta) {
+    let ox = this.position[0] - this.target[0];
+    let oy = this.position[1] - this.target[1];
+    let oz = this.position[2] - this.target[2];
+    const dist = Math.sqrt(ox * ox + oy * oy + oz * oz);
+    const newDist = Math.max(0.1, dist - delta);
+    const scale = newDist / dist;
+    this.position[0] = this.target[0] + ox * scale;
+    this.position[1] = this.target[1] + oy * scale;
+    this.position[2] = this.target[2] + oz * scale;
+  }
+};
+function lookAt(out, eye, center, up) {
+  let fx = center[0] - eye[0];
+  let fy = center[1] - eye[1];
+  let fz = center[2] - eye[2];
+  let len = 1 / Math.sqrt(fx * fx + fy * fy + fz * fz);
+  fx *= len;
+  fy *= len;
+  fz *= len;
+  let sx = fy * up[2] - fz * up[1];
+  let sy = fz * up[0] - fx * up[2];
+  let sz = fx * up[1] - fy * up[0];
+  len = Math.sqrt(sx * sx + sy * sy + sz * sz);
+  if (len > 0) {
+    len = 1 / len;
+    sx *= len;
+    sy *= len;
+    sz *= len;
+  }
+  const ux = sy * fz - sz * fy;
+  const uy = sz * fx - sx * fz;
+  const uz = sx * fy - sy * fx;
+  out[0] = sx;
+  out[1] = ux;
+  out[2] = -fx;
+  out[3] = 0;
+  out[4] = sy;
+  out[5] = uy;
+  out[6] = -fy;
+  out[7] = 0;
+  out[8] = sz;
+  out[9] = uz;
+  out[10] = -fz;
+  out[11] = 0;
+  out[12] = -(sx * eye[0] + sy * eye[1] + sz * eye[2]);
+  out[13] = -(ux * eye[0] + uy * eye[1] + uz * eye[2]);
+  out[14] = fx * eye[0] + fy * eye[1] + fz * eye[2];
+  out[15] = 1;
+}
+function perspective(out, fovRad, aspect, near, far) {
+  const f = 1 / Math.tan(fovRad * 0.5);
+  const rangeInv = 1 / (near - far);
+  out[0] = f / aspect;
+  out[1] = 0;
+  out[2] = 0;
+  out[3] = 0;
+  out[4] = 0;
+  out[5] = f;
+  out[6] = 0;
+  out[7] = 0;
+  out[8] = 0;
+  out[9] = 0;
+  out[10] = (near + far) * rangeInv;
+  out[11] = -1;
+  out[12] = 0;
+  out[13] = 0;
+  out[14] = 2 * near * far * rangeInv;
+  out[15] = 0;
+}
+function mat4Multiply(out, a, b) {
+  for (let i = 0; i < 4; i++) {
+    const ai0 = a[i], ai1 = a[i + 4], ai2 = a[i + 8], ai3 = a[i + 12];
+    out[i] = ai0 * b[0] + ai1 * b[1] + ai2 * b[2] + ai3 * b[3];
+    out[i + 4] = ai0 * b[4] + ai1 * b[5] + ai2 * b[6] + ai3 * b[7];
+    out[i + 8] = ai0 * b[8] + ai1 * b[9] + ai2 * b[10] + ai3 * b[11];
+    out[i + 12] = ai0 * b[12] + ai1 * b[13] + ai2 * b[14] + ai3 * b[15];
+  }
+}
 
 // src/3d/renderer.ts
-var import_renderer5 = require("murow/renderer");
+var import_renderer7 = require("murow/renderer");
+var import_hitbox3 = require("murow/core/hitbox");
 
 // src/3d/skeletal-animation-compute/packer.ts
 function packAnimationData(packed) {
@@ -3464,8 +4111,8 @@ function buildAnimationKernel(root, packed, maxInstances, maxTotalBones, budgets
             let by = animF32[offB + 1];
             let bz = animF32[offB + 2];
             let bw = animF32[offB + 3];
-            const dot2 = ax * bx + ay * by + az * bz + aw * bw;
-            if (dot2 < 0) {
+            const dot3 = ax * bx + ay * by + az * bz + aw * bw;
+            if (dot3 < 0) {
               bx = -bx;
               by = -by;
               bz = -bz;
@@ -3740,6 +4387,327 @@ var GltfClipResyncCoordinator = class {
   }
 };
 
+// src/3d/raycast.ts
+var import_raycast3 = require("murow/core/raycast");
+var import_renderer5 = require("murow/renderer");
+var WebGPURaycast3D = class extends import_renderer5.Raycast {
+  constructor(renderer) {
+    super();
+    this.renderer = renderer;
+    this.state = new import_raycast3.HitBuffer(3);
+    this.resultBuffer = [];
+    this.memos = /* @__PURE__ */ new Set();
+  }
+  update(input) {
+    this.state.reset();
+    this.renderer._collectRaycastHitsInto(input.mouse.position.x, input.mouse.position.y, this.state);
+    for (const m of this.memos)
+      m._invalidate();
+  }
+  /**
+   * Nearest hit, or null. The returned object is pool-backed and valid
+   * only until the next `update()` -- copy what you need, or use `memo`
+   * for results that persist across frames.
+   */
+  hit(opts) {
+    return this.state.nearest(opts?.filter, opts?.maxDistance ?? Infinity);
+  }
+  /**
+   * All hits, nearest first. The array and its entries are reused across
+   * calls and overwritten by the next `update()`; do not retain them.
+   */
+  hitAll(opts) {
+    this.state.collectInto(this.resultBuffer, opts?.filter, opts?.maxDistance ?? Infinity);
+    return this.resultBuffer;
+  }
+  memo(opts) {
+    const m = new WebGPURaycastMemo3D(this.state, opts, () => this.memos.delete(m));
+    this.memos.add(m);
+    return m;
+  }
+  clearMemos() {
+    for (const m of this.memos)
+      m._detach();
+    this.memos.clear();
+  }
+};
+var WebGPURaycastMemo3D = class extends import_renderer5.RaycastMemo {
+  constructor(state, opts, onDispose) {
+    super();
+    this.state = state;
+    this.opts = opts;
+    this.onDispose = onDispose;
+    this.dirty = true;
+    this.detached = false;
+    this.cached = [];
+  }
+  get hits() {
+    if (this.detached)
+      return this.cached;
+    if (this.dirty) {
+      this.state.collectInto(this.cached, this.opts.filter, this.opts.maxDistance ?? Infinity);
+      this.dirty = false;
+    }
+    return this.cached;
+  }
+  get first() {
+    const arr = this.hits;
+    return arr.length > 0 ? arr[0] : null;
+  }
+  dispose() {
+    if (this.detached)
+      return;
+    this.onDispose();
+    this._detach();
+  }
+  _invalidate() {
+    this.dirty = true;
+  }
+  _detach() {
+    this.detached = true;
+    this.cached.length = 0;
+  }
+};
+
+// src/3d/hitbox.ts
+var import_hitbox2 = require("murow/core/hitbox");
+function buildUnitSphereWireframe(segments = 16) {
+  const out = [];
+  const step2 = Math.PI * 2 / segments;
+  for (let axis = 0; axis < 3; axis++) {
+    for (let i = 0; i < segments; i++) {
+      const a = i * step2;
+      const b = (i + 1) * step2;
+      const ca = Math.cos(a), sa = Math.sin(a);
+      const cb = Math.cos(b), sb = Math.sin(b);
+      if (axis === 0) {
+        out.push(0, ca, sa, 0, cb, sb);
+      } else if (axis === 1) {
+        out.push(ca, 0, sa, cb, 0, sb);
+      } else {
+        out.push(ca, sa, 0, cb, sb, 0);
+      }
+    }
+  }
+  return new Float32Array(out);
+}
+function buildUnitBoxWireframe() {
+  const h = 0.5;
+  const corners = [
+    [-h, -h, -h],
+    [h, -h, -h],
+    [h, h, -h],
+    [-h, h, -h],
+    [-h, -h, h],
+    [h, -h, h],
+    [h, h, h],
+    [-h, h, h]
+  ];
+  const edges = [
+    [0, 1],
+    [1, 2],
+    [2, 3],
+    [3, 0],
+    [4, 5],
+    [5, 6],
+    [6, 7],
+    [7, 4],
+    [0, 4],
+    [1, 5],
+    [2, 6],
+    [3, 7]
+  ];
+  const out = [];
+  for (const [a, b] of edges) {
+    out.push(...corners[a], ...corners[b]);
+  }
+  return new Float32Array(out);
+}
+function buildUnitCylinderWireframe(segments = 24) {
+  const h = 0.5;
+  const step2 = Math.PI * 2 / segments;
+  const out = [];
+  for (let i = 0; i < segments; i++) {
+    const a = i * step2, b = (i + 1) * step2;
+    const ca = Math.cos(a), sa = Math.sin(a);
+    const cb = Math.cos(b), sb = Math.sin(b);
+    out.push(ca, -h, sa, cb, -h, sb);
+    out.push(ca, h, sa, cb, h, sb);
+  }
+  for (let i = 0; i < 4; i++) {
+    const a = i * (Math.PI * 0.5);
+    const ca = Math.cos(a), sa = Math.sin(a);
+    out.push(ca, -h, sa, ca, h, sa);
+  }
+  return new Float32Array(out);
+}
+var IDLE = [1, 0, 1, 1];
+var HOVERED = [0.2, 1, 0.4, 1];
+var UNIFORM_STRIDE = 256;
+var MIN_BINDING_SIZE = 80;
+var CAPACITY = 4096;
+var HitboxDebugRenderer = class {
+  constructor() {
+    this.device = null;
+    this.pipeline = null;
+    this.bindGroup = null;
+    this.uniformBuffer = null;
+    this.sphereBuffer = null;
+    this.sphereVertexCount = 0;
+    this.boxBuffer = null;
+    this.boxVertexCount = 0;
+    this.cylinderBuffer = null;
+    this.cylinderVertexCount = 0;
+    this.stage = new Float32Array(0);
+    this.entries = [];
+    this.vp = new Float32Array(16);
+  }
+  init(device, format) {
+    this.device = device;
+    const upload = (data) => {
+      const buf = device.createBuffer({
+        size: data.byteLength,
+        usage: GPUBufferUsage.VERTEX | GPUBufferUsage.COPY_DST
+      });
+      device.queue.writeBuffer(buf, 0, data.buffer, data.byteOffset, data.byteLength);
+      return buf;
+    };
+    const sphereData = buildUnitSphereWireframe();
+    const boxData = buildUnitBoxWireframe();
+    const cylinderData = buildUnitCylinderWireframe();
+    this.sphereBuffer = upload(sphereData);
+    this.sphereVertexCount = sphereData.length / 3;
+    this.boxBuffer = upload(boxData);
+    this.boxVertexCount = boxData.length / 3;
+    this.cylinderBuffer = upload(cylinderData);
+    this.cylinderVertexCount = cylinderData.length / 3;
+    this.uniformBuffer = device.createBuffer({
+      size: UNIFORM_STRIDE * CAPACITY,
+      usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST
+    });
+    this.stage = new Float32Array(UNIFORM_STRIDE * CAPACITY / 4);
+    const bindGroupLayout = device.createBindGroupLayout({
+      entries: [{
+        binding: 0,
+        visibility: GPUShaderStage.VERTEX | GPUShaderStage.FRAGMENT,
+        buffer: { type: "uniform", hasDynamicOffset: true, minBindingSize: MIN_BINDING_SIZE }
+      }]
+    });
+    this.bindGroup = device.createBindGroup({
+      layout: bindGroupLayout,
+      entries: [{ binding: 0, resource: { buffer: this.uniformBuffer, offset: 0, size: MIN_BINDING_SIZE } }]
+    });
+    const shaderModule = device.createShaderModule({
+      code: `
+                struct Uniforms {
+                    mvp: mat4x4<f32>,
+                    color: vec4<f32>,
+                };
+                @group(0) @binding(0) var<uniform> u: Uniforms;
+                @vertex
+                fn vs(@location(0) p: vec3<f32>) -> @builtin(position) vec4<f32> {
+                    return u.mvp * vec4<f32>(p, 1.0);
+                }
+                @fragment
+                fn fs() -> @location(0) vec4<f32> {
+                    return u.color;
+                }
+            `
+    });
+    this.pipeline = device.createRenderPipeline({
+      layout: device.createPipelineLayout({ bindGroupLayouts: [bindGroupLayout] }),
+      vertex: {
+        module: shaderModule,
+        entryPoint: "vs",
+        buffers: [{
+          arrayStride: 12,
+          attributes: [{ shaderLocation: 0, offset: 0, format: "float32x3" }]
+        }]
+      },
+      fragment: { module: shaderModule, entryPoint: "fs", targets: [{ format }] },
+      primitive: { topology: "line-list" },
+      depthStencil: {
+        format: "depth24plus",
+        depthWriteEnabled: false,
+        depthCompare: "less-equal"
+      }
+    });
+  }
+  begin(vp) {
+    this.entries.length = 0;
+    this.vp = vp;
+  }
+  emit(hb, hovered, px, py, pz, sx, sy, sz) {
+    const p = (0, import_hitbox2.placePart3D)(hb, px, py, pz, sx, sy, sz);
+    const color = hovered ? HOVERED : IDLE;
+    if (hb.shape === "sphere") {
+      this.collect(this.sphereBuffer, this.sphereVertexCount, p.cx, p.cy, p.cz, p.hx, p.hx, p.hx, color);
+    } else if (hb.shape === "box") {
+      this.collect(this.boxBuffer, this.boxVertexCount, p.cx, p.cy, p.cz, p.hx * 2, p.hy * 2, p.hz * 2, color);
+    } else {
+      this.collect(this.cylinderBuffer, this.cylinderVertexCount, p.cx, p.cy, p.cz, p.hx, p.hy * 2, p.hz, color);
+    }
+  }
+  flush(pass) {
+    const { pipeline, bindGroup, uniformBuffer, entries } = this;
+    if (!pipeline || !bindGroup || !uniformBuffer || entries.length === 0)
+      return;
+    this.device.queue.writeBuffer(
+      uniformBuffer,
+      0,
+      this.stage.buffer,
+      0,
+      entries.length * UNIFORM_STRIDE
+    );
+    pass.setPipeline(pipeline);
+    let currentVbo = null;
+    for (const e of entries) {
+      if (e.vbo !== currentVbo) {
+        pass.setVertexBuffer(0, e.vbo);
+        currentVbo = e.vbo;
+      }
+      pass.setBindGroup(0, bindGroup, [e.offset]);
+      pass.draw(e.vertexCount, 1, 0, 0);
+    }
+  }
+  /**
+   * The model matrix is pure scale-then-translate, so `MVP = VP * M`
+   * collapses to scaling VP's first three columns by the extents and
+   * replacing the fourth with `VP * (center, 1)` -- no matrix multiply.
+   */
+  collect(vbo, vertexCount, cx, cy, cz, ex, ey, ez, color) {
+    if (!vbo || vertexCount === 0)
+      return;
+    if (this.entries.length >= CAPACITY)
+      return;
+    const idx = this.entries.length;
+    const base = idx * UNIFORM_STRIDE >>> 2;
+    const f324 = this.stage;
+    const vp = this.vp;
+    f324[base + 0] = vp[0] * ex;
+    f324[base + 1] = vp[1] * ex;
+    f324[base + 2] = vp[2] * ex;
+    f324[base + 3] = vp[3] * ex;
+    f324[base + 4] = vp[4] * ey;
+    f324[base + 5] = vp[5] * ey;
+    f324[base + 6] = vp[6] * ey;
+    f324[base + 7] = vp[7] * ey;
+    f324[base + 8] = vp[8] * ez;
+    f324[base + 9] = vp[9] * ez;
+    f324[base + 10] = vp[10] * ez;
+    f324[base + 11] = vp[11] * ez;
+    f324[base + 12] = vp[0] * cx + vp[4] * cy + vp[8] * cz + vp[12];
+    f324[base + 13] = vp[1] * cx + vp[5] * cy + vp[9] * cz + vp[13];
+    f324[base + 14] = vp[2] * cx + vp[6] * cy + vp[10] * cz + vp[14];
+    f324[base + 15] = vp[3] * cx + vp[7] * cy + vp[11] * cz + vp[15];
+    f324[base + 16] = color[0];
+    f324[base + 17] = color[1];
+    f324[base + 18] = color[2];
+    f324[base + 19] = color[3];
+    this.entries.push({ vbo, vertexCount, offset: idx * UNIFORM_STRIDE });
+  }
+};
+
 // src/3d/renderer.ts
 var DYN_PREV_PX = 0;
 var DYN_PREV_PY = 1;
@@ -3801,7 +4769,7 @@ function computeBucketStats(bucket) {
   }
   return { maxSkinnedParts, maxJointCount };
 }
-var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
+var WebGPU3DRenderer = class extends import_renderer6.Base3DRenderer {
   constructor(canvas, options) {
     const resolvedMaxInstances = options.maxInstances ?? (options.prefabs ? options.prefabs.size + 16 : 32);
     super(canvas, { ...options, maxInstances: resolvedMaxInstances });
@@ -3809,6 +4777,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     this.resizeCallbacks = [];
     // layer=0, sheetId=modelId
     this.staticDirty = false;
+    this.nextInstanceId = 0;
     // Models (vertex + index buffers)
     this.models = [];
     this.nextModelId = 0;
@@ -3818,7 +4787,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     this.clipResync = null;
     this.boneMatrixDirty = true;
     // GPU animation compute
-    this.packedAnimData = (0, import_renderer5.createPackedAnimationData)();
+    this.packedAnimData = (0, import_renderer7.createPackedAnimationData)();
     this.animComputeKernel = null;
     this.animComputeNeedsRebuild = false;
     // Capacities the active kernel was built with — used to gate the in-place upload path on resync.
@@ -3834,10 +4803,15 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     this.freedBoneOffsets = /* @__PURE__ */ new Map();
     // Frustum planes (6 planes × 4 floats each), extracted from VP matrix
     this.frustumPlanes = new Float32Array(24);
-    this.uniformData = new Float32Array(24);
-    // mat4x4 (16) + alpha (1) + lightDir (3) + padding (4)
+    // Dynamic lights — CPU state (SoA, slots, globals) lives in LightSystem;
+    // the renderer owns only the GPU buffer it packs into each frame.
+    this.lights = new LightSystem(MAX_LIGHTS);
+    this.uniformData = new Float32Array(MESH_UNIFORM_FLOATS);
     this.lastRenderTime = 0;
+    this.debug = { hitboxes: false };
+    this.hitboxDebug = new HitboxDebugRenderer();
     this.camera = new Camera3D();
+    this.raycast = new WebGPURaycast3D(this);
     this._prefabs = options.prefabs ?? null;
     const SKINNED_PARTS_PER_INSTANCE_DEFAULT_CAP = 3;
     const bucketStats = this._prefabs ? computeBucketStats(this._prefabs) : null;
@@ -3849,14 +4823,15 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     this.updatedBoneOffsets = new Uint8Array(this.maxTotalBones);
     this.boneOffsetRefcount = new Uint32Array(this.maxTotalBones);
     this.boneOffsetSkinIndex = new Uint32Array(this.maxTotalBones);
-    this.freeList = new import_free_list3.FreeList(resolvedMaxInstances);
+    this.freeList = new import_free_list2.FreeList(resolvedMaxInstances);
     this.batcher = new import_sparse_batcher2.SparseBatcher(resolvedMaxInstances);
     this.dynamicData = new Float32Array(resolvedMaxInstances * DYNAMIC_MESH_FLOATS);
     this.staticData = new Float32Array(resolvedMaxInstances * STATIC_MESH_FLOATS);
     this.slotIndexData = new Uint32Array(resolvedMaxInstances);
     this.instanceModelIds = new Uint8Array(resolvedMaxInstances);
+    this.instanceHandles = new Array(resolvedMaxInstances).fill(null);
     const msi = this.maxSkinnedInstances;
-    this.skinnedFreeList = new import_free_list3.FreeList(msi);
+    this.skinnedFreeList = new import_free_list2.FreeList(msi);
     this.skinnedBatcher = new import_sparse_batcher2.SparseBatcher(msi);
     this.skinnedDynamicData = new Float32Array(msi * DYNAMIC_MESH_FLOATS);
     this.skinnedStaticData = new Float32Array(msi * SKINNED_STATIC_MESH_FLOATS);
@@ -3865,6 +4840,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     this.skinnedInstanceModelIds = new Uint8Array(msi);
     this.skinnedInstanceBoneOffsets = new Uint32Array(msi);
     this.skinnedAnimStates = new Array(msi).fill(null);
+    this.skinnedInstanceHandles = new Array(msi).fill(null);
     this.boneMatrixData = new Float32Array(this.maxTotalBones * 16);
     const instBufSize = msi * 8;
     this.gpuInstData = new Float32Array(instBufSize);
@@ -3883,7 +4859,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
       maxComputeInvocationsPerWorkgroup: a.maxComputeInvocationsPerWorkgroup
     };
     const device = await adapter.requestDevice({ requiredLimits });
-    this.root = import_typegpu9.default.initFromDevice({ device });
+    this.root = import_typegpu10.default.initFromDevice({ device });
     this.device = this.root.device;
     this.context = this.canvas.getContext("webgpu");
     this.format = navigator.gpu.getPreferredCanvasFormat();
@@ -3894,7 +4870,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     });
     this._width = this.canvas.width;
     this._height = this.canvas.height;
-    this.camera.aspect = this._width / this._height;
+    this.camera.setAspect(this.canvas.clientWidth || this._width, this.canvas.clientHeight || this._height);
     this.depthTexture = this.device.createTexture({
       size: [this._width, this._height],
       format: "depth24plus",
@@ -3924,7 +4900,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     };
     const vertex = createMeshVertex(this.meshLayout);
     const fragment = createMeshFragment(this.meshLayout);
-    const { code: wgslCode } = import_typegpu9.default.resolveWithContext([vertex, fragment]);
+    const { code: wgslCode } = import_typegpu10.default.resolveWithContext([vertex, fragment]);
     const shaderModule = this.device.createShaderModule({ code: wgslCode });
     const rawBGL = this.root.unwrap(this.meshLayout);
     this.rawPipeline = this.device.createRenderPipeline({
@@ -3937,7 +4913,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     const texLayout = createTextureBindGroupLayout();
     const texVertex = createTexturedMeshVertex(this.meshLayout);
     const texFragment = createTexturedMeshFragment(this.meshLayout, texLayout);
-    const { code: texWgslCode } = import_typegpu9.default.resolveWithContext([texVertex, texFragment]);
+    const { code: texWgslCode } = import_typegpu10.default.resolveWithContext([texVertex, texFragment]);
     const texShaderModule = this.device.createShaderModule({ code: texWgslCode });
     const rawTexBGL = this.root.unwrap(texLayout);
     this.rawTexturedPipeline = this.device.createRenderPipeline({
@@ -3951,17 +4927,20 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     this.staticBuffer = this.root.createBuffer(d.arrayOf(StaticMesh, this.maxInstances)).$usage("storage");
     this.uniformBuffer = this.root.createBuffer(MeshUniforms).$usage("uniform");
     this.slotIndexBuffer = this.root.createBuffer(d.arrayOf(d.u32, this.maxInstances)).$usage("storage");
+    this.lightBuffer = this.root.createBuffer(d.arrayOf(Light, MAX_LIGHTS)).$usage("storage");
     this.rawDynamicBuffer = this.root.unwrap(this.dynamicBuffer);
     this.rawStaticBuffer = this.root.unwrap(this.staticBuffer);
     this.rawUniformBuffer = this.root.unwrap(this.uniformBuffer);
     this.rawSlotIndexBuffer = this.root.unwrap(this.slotIndexBuffer);
+    this.rawLightBuffer = this.root.unwrap(this.lightBuffer);
     this.rawBindGroup = this.device.createBindGroup({
       layout: rawBGL,
       entries: [
         { binding: 0, resource: { buffer: this.rawUniformBuffer } },
         { binding: 1, resource: { buffer: this.rawDynamicBuffer } },
         { binding: 2, resource: { buffer: this.rawStaticBuffer } },
-        { binding: 3, resource: { buffer: this.rawSlotIndexBuffer } }
+        { binding: 3, resource: { buffer: this.rawSlotIndexBuffer } },
+        { binding: 4, resource: { buffer: this.rawLightBuffer } }
       ]
     });
     const msi = this.maxSkinnedInstances;
@@ -3983,8 +4962,8 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
       ]
     };
     const skinnedVertex = createSkinnedMeshVertex(this.skinnedMeshLayout);
-    const skinnedFragment = createMeshFragment(this.skinnedMeshLayout);
-    const { code: skinnedWgsl } = import_typegpu9.default.resolveWithContext([skinnedVertex, skinnedFragment]);
+    const skinnedFragment = createSkinnedMeshFragment(this.skinnedMeshLayout);
+    const { code: skinnedWgsl } = import_typegpu10.default.resolveWithContext([skinnedVertex, skinnedFragment]);
     const skinnedShaderModule = this.device.createShaderModule({ code: skinnedWgsl });
     const rawSkinnedBGL = this.root.unwrap(this.skinnedMeshLayout);
     this.rawSkinnedPipeline = this.device.createRenderPipeline({
@@ -3996,7 +4975,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     });
     const skinnedTexVertex = createSkinnedMeshVertex(this.skinnedMeshLayout);
     const skinnedTexFragment = createTexturedMeshFragment(this.skinnedMeshLayout, texLayout);
-    const { code: skinnedTexWgsl } = import_typegpu9.default.resolveWithContext([skinnedTexVertex, skinnedTexFragment]);
+    const { code: skinnedTexWgsl } = import_typegpu10.default.resolveWithContext([skinnedTexVertex, skinnedTexFragment]);
     const skinnedTexShaderModule = this.device.createShaderModule({ code: skinnedTexWgsl });
     this.rawSkinnedTexturedPipeline = this.device.createRenderPipeline({
       layout: this.device.createPipelineLayout({ bindGroupLayouts: [rawSkinnedBGL, rawTexBGL] }),
@@ -4020,12 +4999,14 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
         { binding: 1, resource: { buffer: this.rawSkinnedDynamicBuffer } },
         { binding: 2, resource: { buffer: this.rawSkinnedStaticBuffer } },
         { binding: 3, resource: { buffer: this.rawSkinnedSlotIndexBuffer } },
-        { binding: 4, resource: { buffer: this.rawBoneMatrixBuffer } }
+        { binding: 4, resource: { buffer: this.rawBoneMatrixBuffer } },
+        { binding: 5, resource: { buffer: this.rawLightBuffer } }
       ]
     });
     if (this._prefabs) {
       this.uploadPrefabBucket(this._prefabs);
     }
+    this.hitboxDebug.init(this.device, this.format);
     this.setupResizeObserver();
     this._initialized = true;
   }
@@ -4095,7 +5076,10 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
             alphaMode: "premultiplied"
           });
         }
-        this.camera.aspect = w / h;
+        const cssBox = entry.contentBoxSize?.[0];
+        const cssW = cssBox ? cssBox.inlineSize : w;
+        const cssH = cssBox ? cssBox.blockSize : h;
+        this.camera.setAspect(cssW, cssH);
         this.depthTexture.destroy();
         this.depthTexture = this.device.createTexture({
           size: [w, h],
@@ -4149,6 +5133,33 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
   get maxSkinned() {
     return this.maxSkinnedInstances;
   }
+  /**
+   * Add a dynamic point or spot light. Returns a live handle whose position,
+   * color, intensity, range, and enabled state can all be changed every frame.
+   * Up to `MAX_LIGHTS` (64) lights may be live at once; throws past that.
+   *
+   * The global directional + ambient terms are separate — see
+   * `setDirectionalLight` / `setAmbient`.
+   */
+  addLight(spec) {
+    return this.lights.add(spec);
+  }
+  /**
+   * Set the global directional light (the "sun"). `direction` points from the
+   * surface toward the light. Defaults to `(0.3, 0.8, 0.5)`, white, intensity 1
+   * — the engine's classic fixed look.
+   */
+  setDirectionalLight(direction, color = [1, 1, 1], intensity = 1) {
+    this.lights.setDirectional(direction, color, intensity);
+  }
+  /** Set the global ambient term. Defaults to `(0.3, 0.3, 0.3)`. */
+  setAmbient(color) {
+    this.lights.setAmbient(color);
+  }
+  /** Number of live dynamic lights. */
+  get lightCount() {
+    return this.lights.count;
+  }
   /**
    * Create a flat grid mesh on the XZ plane at Y=0.
    *
@@ -4439,13 +5450,30 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     const uvs = data.uvs ?? new Float32Array(vertexCount * 2);
     const hasTexture = !!texture;
     let maxRadiusSq = 0;
+    let minX = Infinity, minY = Infinity, minZ = Infinity;
+    let maxX = -Infinity, maxY = -Infinity, maxZ = -Infinity;
     for (let i = 0; i < vertexCount; i++) {
       const px = positions[i * 3], py = positions[i * 3 + 1], pz = positions[i * 3 + 2];
       const rSq = px * px + py * py + pz * pz;
       if (rSq > maxRadiusSq)
         maxRadiusSq = rSq;
+      if (px < minX)
+        minX = px;
+      if (px > maxX)
+        maxX = px;
+      if (py < minY)
+        minY = py;
+      if (py > maxY)
+        maxY = py;
+      if (pz < minZ)
+        minZ = pz;
+      if (pz > maxZ)
+        maxZ = pz;
     }
     const boundingRadius = Math.sqrt(maxRadiusSq);
+    const halfX = vertexCount ? (maxX - minX) * 0.5 : 0;
+    const halfY = vertexCount ? (maxY - minY) * 0.5 : 0;
+    const halfZ = vertexCount ? (maxZ - minZ) * 0.5 : 0;
     const interleaved = new Float32Array(vertexCount * 8);
     for (let i = 0; i < vertexCount; i++) {
       const o = i * 8;
@@ -4506,6 +5534,9 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
       indexCount,
       indexFormat: indices instanceof Uint32Array ? "uint32" : "uint16",
       boundingRadius,
+      halfX,
+      halfY,
+      halfZ,
       hasTexture,
       textureBindGroup,
       skinned: false,
@@ -4524,13 +5555,30 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     const uvs = data.uvs ?? new Float32Array(vertexCount * 2);
     const hasTexture = !!texture;
     let maxRadiusSq = 0;
+    let minX = Infinity, minY = Infinity, minZ = Infinity;
+    let maxX = -Infinity, maxY = -Infinity, maxZ = -Infinity;
     for (let i = 0; i < vertexCount; i++) {
       const px = positions[i * 3], py = positions[i * 3 + 1], pz = positions[i * 3 + 2];
       const rSq = px * px + py * py + pz * pz;
       if (rSq > maxRadiusSq)
         maxRadiusSq = rSq;
+      if (px < minX)
+        minX = px;
+      if (px > maxX)
+        maxX = px;
+      if (py < minY)
+        minY = py;
+      if (py > maxY)
+        maxY = py;
+      if (pz < minZ)
+        minZ = pz;
+      if (pz > maxZ)
+        maxZ = pz;
     }
     const boundingRadius = Math.sqrt(maxRadiusSq);
+    const halfX = vertexCount ? (maxX - minX) * 0.5 : 0;
+    const halfY = vertexCount ? (maxY - minY) * 0.5 : 0;
+    const halfZ = vertexCount ? (maxZ - minZ) * 0.5 : 0;
     const buf = new ArrayBuffer(vertexCount * 56);
     const floatView = new Float32Array(buf);
     const u16View = new Uint16Array(buf);
@@ -4602,6 +5650,9 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
       indexCount,
       indexFormat: indices instanceof Uint32Array ? "uint32" : "uint16",
       boundingRadius,
+      halfX,
+      halfY,
+      halfZ,
       hasTexture,
       textureBindGroup,
       skinned: true,
@@ -4660,7 +5711,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
    * ```
    */
   async loadGltf(url, opts) {
-    const parsed = await (0, import_renderer5.parseGltf)(url, opts);
+    const parsed = await (0, import_renderer7.parseGltf)(url, opts);
     return this.uploadParsedGltf(parsed);
   }
   /**
@@ -4673,7 +5724,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     let skinnedModelSkinIndex = -1;
     if (parsed.skin) {
       const { data: skinData, animClips } = parsed.skin;
-      const animation = new import_renderer5.SkeletalAnimation(skinData, animClips);
+      const animation = new import_renderer7.SkeletalAnimation(skinData, animClips);
       const ibm = skinData.inverseBindMatrices;
       let maxRadSq = 0;
       for (let j = 0; j < skinData.jointCount; j++) {
@@ -4690,7 +5741,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
         boundingRadius: skinnedRadius,
         parsedSkin: parsed.skin
       });
-      (0, import_renderer5.packSkinAndAnimations)(this.packedAnimData, skinData, animClips);
+      (0, import_renderer7.packSkinAndAnimations)(this.packedAnimData, skinData, animClips);
       this.animComputeNeedsRebuild = true;
     }
     const handles = [];
@@ -4781,7 +5832,9 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     const posOut = [0, 0, 0];
     const rotOut = [0, 0, 0];
     const sclOut = [0, 0, 0];
+    const id = ++this.nextInstanceId;
     const handle = {
+      id,
       slot,
       modelId: modelHandle.id,
       skinned: false,
@@ -4835,9 +5888,11 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
         self.freeList.free(slot);
         dynamicData.fill(0, dynBase, dynBase + DYNAMIC_MESH_FLOATS);
         staticData.fill(0, statBase, statBase + STATIC_MESH_FLOATS);
+        self.instanceHandles[slot] = null;
         self.staticDirty = true;
       }
     };
+    this.instanceHandles[slot] = handle;
     return handle;
   }
   addGltfInstance(opts, gltf, prefabId) {
@@ -4859,6 +5914,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     const skinnedHandle = childHandles.find((h) => h.skinned);
     const lead = childHandles[0];
     return {
+      id: lead.id,
       skinned: gltf.skinned,
       prefabId,
       setPosition(x, y, z) {
@@ -4946,6 +6002,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
       childHandles.push(this.addInstance(partOpts));
     }
     return {
+      id: childHandles[0].id,
       skinned: childHandles.some((h) => h.skinned),
       prefabId: composite.id,
       setPosition(x, y, z) {
@@ -5069,7 +6126,9 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
     const posOut = [0, 0, 0];
     const rotOut = [0, 0, 0];
     const sclOut = [0, 0, 0];
-    return {
+    const id = ++this.nextInstanceId;
+    const handle = {
+      id,
       slot,
       modelId: modelHandle.id,
       skinned: true,
@@ -5134,6 +6193,7 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
         dynamicData.fill(0, dynBase, dynBase + DYNAMIC_MESH_FLOATS);
         staticData.fill(0, statBase, statBase + SKINNED_STATIC_MESH_FLOATS);
         animStates[slot] = null;
+        self.skinnedInstanceHandles[slot] = null;
         self.skinnedStaticDirty = true;
         if (--self.boneOffsetRefcount[capturedBoneOffset] === 0) {
           let pool = self.freedBoneOffsets.get(capturedSkinIndex);
@@ -5145,6 +6205,8 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
         }
       }
     };
+    this.skinnedInstanceHandles[slot] = handle;
+    return handle;
   }
   /**
    * Drain pending resyncs from the coordinator. Per affected skin: rebuild
@@ -5191,9 +6253,9 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
         animState.prevClipId = remap3[animState.prevClipId];
       }
     }
-    this.packedAnimData = (0, import_renderer5.createPackedAnimationData)();
+    this.packedAnimData = (0, import_renderer7.createPackedAnimationData)();
     for (const sm of this.skinnedModels) {
-      (0, import_renderer5.packSkinAndAnimations)(this.packedAnimData, sm.parsedSkin.data, sm.parsedSkin.animClips);
+      (0, import_renderer7.packSkinAndAnimations)(this.packedAnimData, sm.parsedSkin.data, sm.parsedSkin.animClips);
     }
     if (this.tryUploadInPlace())
       return;
@@ -5280,7 +6342,8 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
           { binding: 1, resource: { buffer: this.rawSkinnedDynamicBuffer } },
           { binding: 2, resource: { buffer: this.rawSkinnedStaticBuffer } },
           { binding: 3, resource: { buffer: this.rawSkinnedSlotIndexBuffer } },
-          { binding: 4, resource: { buffer: rawBoneBuffer } }
+          { binding: 4, resource: { buffer: rawBoneBuffer } },
+          { binding: 5, resource: { buffer: this.rawLightBuffer } }
         ]
       });
       this.device.queue.writeBuffer(
@@ -5416,6 +6479,113 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
         sDyn[base + DYN_PREV_RZ] = sDyn[base + DYN_CURR_RZ];
       }
     });
+    this.lights.storePrevious();
+  }
+  /** Resolve an instance's declared hitbox name to its Hitbox via the bucket's library. */
+  resolveHitbox(handle) {
+    if (!this._prefabs || !handle.prefabId)
+      return null;
+    const lib = this._prefabs.hitboxLibrary;
+    if (!lib)
+      return null;
+    const prefab = this._prefabs.get(handle.prefabId);
+    const name = prefab?.hitbox;
+    return name ? lib.get(name) : null;
+  }
+  /**
+   * Pick test for a single instance. Returns the ray-`t` and the struck
+   * part name, or `null`. Uses the prefab's declared hitbox when
+   * available; falls back to the model's axis-aligned bounding box.
+   */
+  testInstanceRay(ray, handle, cx, cy, cz, sx, sy, sz, halfX, halfY, halfZ) {
+    const hitbox = this.resolveHitbox(handle);
+    if (hitbox) {
+      const hit = (0, import_hitbox3.testHitbox3D)(ray, hitbox, cx, cy, cz, sx, sy, sz);
+      return hit ? { distance: hit.distance, part: hit.part } : null;
+    }
+    const t = ray.entryBox(cx, cy, cz, halfX * sx, halfY * sy, halfZ * sz);
+    return t === null ? null : { distance: t, part: null };
+  }
+  /** Push every instance the screen ray hits within [near, far] into the hit buffer. Unsorted. */
+  _collectRaycastHitsInto(screenX, screenY, rc) {
+    const ray = this.camera.screenToRay(screenX, screenY);
+    const ox = ray.origin[0], oy = ray.origin[1], oz = ray.origin[2];
+    const dx = ray.direction[0], dy = ray.direction[1], dz = ray.direction[2];
+    const minDistance = this.camera.near;
+    const maxDistance = this.camera.far;
+    const dyn = this.dynamicData;
+    const stat = this.staticData;
+    const models = this.models;
+    this.batcher.each((_, instances, count) => {
+      for (let i = 0; i < count; i++) {
+        const slot = instances[i];
+        const handle = this.instanceHandles[slot];
+        if (handle === null)
+          continue;
+        const model = models[handle.modelId];
+        if (!model)
+          continue;
+        const dynBase = slot * DYNAMIC_MESH_FLOATS;
+        const statBase = slot * STATIC_MESH_FLOATS;
+        const hit = this.testInstanceRay(
+          ray,
+          handle,
+          dyn[dynBase + DYN_CURR_PX],
+          dyn[dynBase + DYN_CURR_PY],
+          dyn[dynBase + DYN_CURR_PZ],
+          stat[statBase + STAT_SX],
+          stat[statBase + STAT_SY],
+          stat[statBase + STAT_SZ],
+          model.halfX,
+          model.halfY,
+          model.halfZ
+        );
+        if (hit === null)
+          continue;
+        const t = hit.distance;
+        if (t < minDistance || t > maxDistance)
+          continue;
+        rc.push(handle, t, ox + dx * t, oy + dy * t, oz + dz * t, t, hit.part);
+      }
+    });
+    const sDyn = this.skinnedDynamicData;
+    const sStat = this.skinnedStaticData;
+    const skinned = this.skinnedModels;
+    this.skinnedBatcher.each((_, instances, count) => {
+      for (let i = 0; i < count; i++) {
+        const slot = instances[i];
+        const handle = this.skinnedInstanceHandles[slot];
+        if (handle === null)
+          continue;
+        const model = models[handle.modelId];
+        if (!model)
+          continue;
+        const skin = skinned[model.skinIndex];
+        if (!skin)
+          continue;
+        const dynBase = slot * DYNAMIC_MESH_FLOATS;
+        const statBase = slot * SKINNED_STATIC_MESH_FLOATS;
+        const hit = this.testInstanceRay(
+          ray,
+          handle,
+          sDyn[dynBase + DYN_CURR_PX],
+          sDyn[dynBase + DYN_CURR_PY],
+          sDyn[dynBase + DYN_CURR_PZ],
+          sStat[statBase + SSTAT_SX],
+          sStat[statBase + SSTAT_SY],
+          sStat[statBase + SSTAT_SZ],
+          model.halfX,
+          model.halfY,
+          model.halfZ
+        );
+        if (hit === null)
+          continue;
+        const t = hit.distance;
+        if (t < minDistance || t > maxDistance)
+          continue;
+        rc.push(handle, t, ox + dx * t, oy + dy * t, oz + dz * t, t, hit.part);
+      }
+    });
   }
   render(alpha) {
     if (!this._initialized)
@@ -5444,18 +6614,26 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
       );
       this.staticDirty = false;
     }
+    const packed = this.lights.pack();
+    if (packed.count > 0) {
+      this.device.queue.writeBuffer(
+        this.rawLightBuffer,
+        0,
+        packed.data.buffer,
+        packed.data.byteOffset,
+        packed.byteLength
+      );
+    }
     const vpMatrix = this.camera.getViewProjectionMatrix();
     this.uniformData.set(vpMatrix, 0);
-    this.uniformData[16] = alpha;
-    this.uniformData[17] = 0.3;
-    this.uniformData[18] = 0.8;
-    this.uniformData[19] = 0.5;
+    this.uniformData[MESH_UNIFORM_ALPHA_OFFSET] = alpha;
+    this.lights.writeUniforms(this.uniformData, MESH_UNIFORM_LIGHT_OFFSET, packed.count);
     this.device.queue.writeBuffer(
       this.rawUniformBuffer,
       0,
       this.uniformData.buffer,
       this.uniformData.byteOffset,
-      80
+      this.uniformData.byteLength
     );
     this.extractFrustumPlanes(vpMatrix);
     let indexOffset = 0;
@@ -5631,9 +6809,76 @@ var WebGPU3DRenderer = class extends import_renderer4.Base3DRenderer {
         pass.draw(model.vertexCount, batch.count, 0, batch.offset);
       }
     }
+    if (this.debug.hitboxes) {
+      this.drawDebugHitboxes(pass, vpMatrix);
+    }
     pass.end();
     this.device.queue.submit([encoder.finish()]);
   }
+  drawDebugHitboxes(pass, vp) {
+    if (!this._prefabs)
+      return;
+    const debug = this.hitboxDebug;
+    const state = this.raycast.state;
+    debug.begin(vp);
+    const dyn = this.dynamicData;
+    const stat = this.staticData;
+    this.batcher.each((_, instances, count) => {
+      for (let i = 0; i < count; i++) {
+        const slot = instances[i];
+        const handle = this.instanceHandles[slot];
+        if (handle === null)
+          continue;
+        const hb = this.resolveHitbox(handle);
+        if (!hb)
+          continue;
+        const dynBase = slot * DYNAMIC_MESH_FLOATS;
+        const statBase = slot * STATIC_MESH_FLOATS;
+        const hovered = state.containsId(handle.id);
+        for (const part of hb.parts) {
+          debug.emit(
+            part,
+            hovered,
+            dyn[dynBase + DYN_CURR_PX],
+            dyn[dynBase + DYN_CURR_PY],
+            dyn[dynBase + DYN_CURR_PZ],
+            stat[statBase + STAT_SX],
+            stat[statBase + STAT_SY],
+            stat[statBase + STAT_SZ]
+          );
+        }
+      }
+    });
+    const sDyn = this.skinnedDynamicData;
+    const sStat = this.skinnedStaticData;
+    this.skinnedBatcher.each((_, instances, count) => {
+      for (let i = 0; i < count; i++) {
+        const slot = instances[i];
+        const handle = this.skinnedInstanceHandles[slot];
+        if (handle === null)
+          continue;
+        const hb = this.resolveHitbox(handle);
+        if (!hb)
+          continue;
+        const dynBase = slot * DYNAMIC_MESH_FLOATS;
+        const statBase = slot * SKINNED_STATIC_MESH_FLOATS;
+        const hovered = state.containsId(handle.id);
+        for (const part of hb.parts) {
+          debug.emit(
+            part,
+            hovered,
+            sDyn[dynBase + DYN_CURR_PX],
+            sDyn[dynBase + DYN_CURR_PY],
+            sDyn[dynBase + DYN_CURR_PZ],
+            sStat[statBase + SSTAT_SX],
+            sStat[statBase + SSTAT_SY],
+            sStat[statBase + SSTAT_SZ]
+          );
+        }
+      }
+    });
+    debug.flush(pass);
+  }
   /**
    * Extract 6 frustum planes from a column-major VP matrix.
    * Each plane is [a, b, c, d] where ax + by + cz + d >= 0 means inside.
@@ -5814,12 +7059,12 @@ var ParticleEmitter = class {
     this.renderer = renderer;
     this.config = config;
     this.rng = new import_simple_rng.SimpleRNG(config.seed);
-    const max2 = config.max;
-    this.sprites = new Array(max2).fill(null);
-    this.lifetimes = new Float32Array(max2);
-    this.maxLifetimes = new Float32Array(max2);
-    this.velocitiesX = new Float32Array(max2);
-    this.velocitiesY = new Float32Array(max2);
+    const max3 = config.max;
+    this.sprites = new Array(max3).fill(null);
+    this.lifetimes = new Float32Array(max3);
+    this.maxLifetimes = new Float32Array(max3);
+    this.velocitiesX = new Float32Array(max3);
+    this.velocitiesY = new Float32Array(max3);
   }
   emit(x, y, count = 1) {
     for (let i = 0; i < count; i++) {
@@ -5895,58 +7140,3 @@ var ParticleEmitter = class {
     this.head = 0;
   }
 };
-
-// src/shaders/utils.ts
-var import_typegpu11 = __toESM(require("typegpu"), 1);
-var d6 = __toESM(require("typegpu/data"), 1);
-var std4 = __toESM(require("typegpu/std"), 1);
-var rotate2d = import_typegpu11.default.fn([d6.vec2f, d6.f32], d6.vec2f)(
-  function rotate2d2(point, angle) {
-    "use gpu";
-    const c = std4.cos(angle);
-    const s = std4.sin(angle);
-    return d6.vec2f(
-      point.x * c - point.y * s,
-      point.x * s + point.y * c
-    );
-  }
-);
-var worldToClip2d = import_typegpu11.default.fn([d6.vec2f, d6.mat3x3f], d6.vec4f)(
-  function worldToClip2d2(worldPos, cameraMatrix) {
-    "use gpu";
-    const clip = cameraMatrix * d6.vec3f(worldPos.x, worldPos.y, 1);
-    return d6.vec4f(clip.x, clip.y, 0, 1);
-  }
-);
-var worldToClip3d = import_typegpu11.default.fn([d6.vec3f, d6.mat4x4f], d6.vec4f)(
-  function worldToClip3d2(worldPos, vpMatrix) {
-    "use gpu";
-    return vpMatrix * d6.vec4f(worldPos.x, worldPos.y, worldPos.z, 1);
-  }
-);
-var remap = import_typegpu11.default.fn([d6.f32, d6.f32, d6.f32, d6.f32, d6.f32], d6.f32)(
-  function remap2(value, inMin, inMax, outMin, outMax) {
-    "use gpu";
-    const t = (value - inMin) / (inMax - inMin);
-    return outMin + t * (outMax - outMin);
-  }
-);
-var scaleRotate2d = import_typegpu11.default.fn([d6.vec2f, d6.f32], d6.mat2x2f)(
-  function scaleRotate2d2(scale, angle) {
-    "use gpu";
-    const c = std4.cos(angle);
-    const s = std4.sin(angle);
-    return d6.mat2x2f(
-      scale.x * c,
-      scale.x * s,
-      -(scale.y * s),
-      scale.y * c
-    );
-  }
-);
-var inverseLerp = import_typegpu11.default.fn([d6.f32, d6.f32, d6.f32], d6.f32)(
-  function inverseLerp2(min, max2, value) {
-    "use gpu";
-    return std4.saturate((value - min) / (max2 - min));
-  }
-);