@aardworx/wombat.rendering 0.9.14 → 0.9.16

package/dist/runtime/heapScene.js

@@ -49,797 +49,13 @@ import { buildShaderFamily, compileShaderFamily, } from "./heapShaderFamily.js";
 import { ATLAS_PAGE_FORMATS, atlasFormatIndex, } from "./textureAtlas/atlasPool.js";
 import { ATLAS_ARRAY_SIZE, ATLAS_LINEAR_BINDING_BASE, ATLAS_SRGB_BINDING_BASE, ATLAS_SAMPLER_BINDING, } from "./heapEffect.js";
 import { DerivedUniformsScene, registerRoDerivations, deregisterRoDerivations, isDerivedRule, STANDARD_DERIVED_RULES, STANDARD_TRAFO_LEAVES, inputsOf, } from "./derivedUniforms/index.js";
-// ---------------------------------------------------------------------------
-// Per-allocation arena layout
-// ---------------------------------------------------------------------------
-// Per-allocation header: (u32 typeId, u32 length). typeId is
-// (semantic << 16) | encoding. The data region follows the header
-// aligned up to 16 bytes (so positions/normals/etc. line up for
-// future vec4 reads).
-const ALLOC_HEADER_BYTES = 8;
-const ALLOC_HEADER_PAD_TO = 16; // data starts header_offset + 16
-// Encoding-tag enum (low 16 bits of typeId).
-const ENC_V3F_TIGHT = 1; // tightly-packed array of vec3<f32> (12 B/elt)
-// Semantic-tag enum (high 16 bits of typeId). Optional metadata —
-// the shader doesn't branch on this.
-const SEM_POSITIONS = 1;
-const SEM_NORMALS = 2;
-const ALIGN16 = (n) => (n + 15) & ~15;
-function packMat44(m, dst, off) {
-    // Zero-alloc flat copy (row-major) straight into the f32 staging
-    // buffer — `copyTo` does `dst.set(m._data, off)` which narrows f64→f32
-    // on store, no throwaway `number[]` per call.
-    m.copyTo(dst, off);
-}
-const PACKER_MAT4 = {
-    dataBytes: 64, typeId: 0,
-    pack: (val, dst, off) => {
-        // Accept Trafo3d (uses .forward) or M44d directly.
-        const m = val.forward !== undefined
-            ? val.forward
-            : val;
-        packMat44(m, dst, off);
-    },
-};
-const PACKER_VEC4 = {
-    dataBytes: 16, typeId: 0,
-    pack: (val, dst, off) => {
-        const v = val;
-        dst[off + 0] = v.x;
-        dst[off + 1] = v.y;
-        dst[off + 2] = v.z;
-        dst[off + 3] = v.w;
-    },
-};
-const PACKER_VEC3 = {
-    dataBytes: 12, typeId: 0,
-    pack: (val, dst, off) => {
-        // V3f or V3d both expose .x/.y/.z; cast through a common shape.
-        const v = val;
-        dst[off + 0] = v.x;
-        dst[off + 1] = v.y;
-        dst[off + 2] = v.z;
-    },
-};
-const PACKER_VEC2 = {
-    dataBytes: 8, typeId: 0,
-    pack: (val, dst, off) => {
-        const v = val;
-        dst[off + 0] = v.x;
-        dst[off + 1] = v.y;
-    },
-};
-const PACKER_F32 = {
-    dataBytes: 4, typeId: 0,
-    pack: (val, dst, off) => { dst[off] = val; },
-};
-// Integer scalars / vectors. The arena is fronted by a `Float32Array`,
-// so writing raw bits has to go through a same-buffer Uint32/Int32 view
-// to avoid the lossy `i32 → f32` coercion you'd get from a direct
-// `dst[off] = ...` assignment.
-function makeIntPacker(ctor, dim) {
-    const bytes = dim * 4;
-    if (dim === 1) {
-        return {
-            dataBytes: bytes, typeId: 0,
-            pack: (val, dst, off) => {
-                new ctor(dst.buffer, dst.byteOffset + off * 4, 1)[0] = val;
-            },
-        };
-    }
-    // Vector: accept {x,y,z,w} components.
-    return {
-        dataBytes: bytes, typeId: 0,
-        pack: (val, dst, off) => {
-            const view = new ctor(dst.buffer, dst.byteOffset + off * 4, dim);
-            const v = val;
-            view[0] = v.x;
-            view[1] = v.y;
-            if (dim >= 3)
-                view[2] = v.z;
-            if (dim >= 4)
-                view[3] = v.w;
-        },
-    };
-}
-const PACKER_U32 = makeIntPacker(Uint32Array, 1);
-const PACKER_UVEC2 = makeIntPacker(Uint32Array, 2);
-const PACKER_UVEC3 = makeIntPacker(Uint32Array, 3);
-const PACKER_UVEC4 = makeIntPacker(Uint32Array, 4);
-const PACKER_I32 = makeIntPacker(Int32Array, 1);
-const PACKER_IVEC2 = makeIntPacker(Int32Array, 2);
-const PACKER_IVEC3 = makeIntPacker(Int32Array, 3);
-const PACKER_IVEC4 = makeIntPacker(Int32Array, 4);
-function packerForWgslType(wgslType) {
-    switch (wgslType) {
-        case "mat4x4<f32>": return PACKER_MAT4;
-        case "vec4<f32>": return PACKER_VEC4;
-        case "vec3<f32>": return PACKER_VEC3;
-        case "vec2<f32>": return PACKER_VEC2;
-        case "f32": return PACKER_F32;
-        case "u32": return PACKER_U32;
-        case "vec2<u32>": return PACKER_UVEC2;
-        case "vec3<u32>": return PACKER_UVEC3;
-        case "vec4<u32>": return PACKER_UVEC4;
-        case "i32": return PACKER_I32;
-        case "vec2<i32>": return PACKER_IVEC2;
-        case "vec3<i32>": return PACKER_IVEC3;
-        case "vec4<i32>": return PACKER_IVEC4;
-        default:
-            throw new Error(`heapScene: no JS-side packer for WGSL type '${wgslType}'`);
-    }
-}
-// ---------------------------------------------------------------------------
-// Resizable buffer (pow2 grow + GPU-side copy on resize)
-// ---------------------------------------------------------------------------
-const MIN_BUFFER_BYTES = 64 * 1024;
-const POW2 = (n) => {
-    let p = 1;
-    while (p < n)
-        p <<= 1;
-    return p;
-};
-/**
- * A GPUBuffer that can grow to next power-of-two on demand. On grow,
- * a fresh buffer is created at the new size, the live tail copied
- * over via copyBufferToBuffer, and dependents (bind groups, mostly)
- * are notified to rebuild via the `onResize` callback.
- *
- * `usedBytes` is the high-water mark — the runtime advances this as
- * it allocates, and `ensureCapacity` grows when required. This
- * separates allocation policy from grow policy.
- */
-class GrowBuffer {
-    device;
-    label;
-    usage;
-    buf;
-    cap;
-    used = 0;
-    listeners = new Set();
-    constructor(device, label, usage, initialBytes) {
-        this.device = device;
-        this.label = label;
-        this.usage = usage;
-        this.cap = Math.max(MIN_BUFFER_BYTES, POW2(initialBytes));
-        this.buf = device.createBuffer({ size: this.cap, usage: usage | GPUBufferUsage.COPY_DST | GPUBufferUsage.COPY_SRC, label });
-    }
-    get buffer() { return this.buf; }
-    get capacity() { return this.cap; }
-    get usedBytes() { return this.used; }
-    setUsed(n) { this.used = n; }
-    onResize(cb) {
-        this.listeners.add(cb);
-        return { dispose: () => { this.listeners.delete(cb); } };
-    }
-    /** Ensure the buffer is at least `bytes` capacity. Grows by pow2 + copies live tail. */
-    ensureCapacity(bytes) {
-        if (bytes <= this.cap)
-            return;
-        const newCap = POW2(bytes);
-        const newBuf = this.device.createBuffer({
-            size: newCap, usage: this.usage | GPUBufferUsage.COPY_DST | GPUBufferUsage.COPY_SRC, label: this.label,
-        });
-        if (this.used > 0) {
-            const enc = this.device.createCommandEncoder({ label: `${this.label}: grow-copy` });
-            enc.copyBufferToBuffer(this.buf, 0, newBuf, 0, ALIGN16(this.used));
-            this.device.queue.submit([enc.finish()]);
-        }
-        this.buf.destroy();
-        this.buf = newBuf;
-        this.cap = newCap;
-        for (const cb of this.listeners)
-            cb();
-    }
-    destroy() { this.buf.destroy(); }
-}
-/**
- * Aval-keyed pool of arena allocations. One allocation per unique
- * aval (object identity). Two draws referencing the same aval share
- * the allocation; their DrawHeaders carry the same u32 ref. Holds
- * uniforms (fixed-size scalars/vectors/matrices) AND attribute arrays
- * (variable-size). The caller decides `dataBytes` + `length` per
- * acquisition — the pool just keys on aval identity and refcounts.
- *
- * Sharing emerges from aval identity — no separate "frequency"
- * declaration needed. A `cval` shared by all draws → 1 alloc.
- * A static positions array shared across instanced draws → 1 alloc.
- * Same code path either way.
- */
-class UniformPool {
-    // Keyed by `aval<unknown>` *by reference* (a plain JS `Map`). These
-    // keys are overwhelmingly reactive `cval`s (per-object trafos,
-    // colours, …) and the hot path is `acquire`/`release` ~once per
-    // drawHeader field per RO. A content-keyed `HashTable` would buy
-    // nothing here — reactive avals never compare content-equal — and
-    // would cost: reactive avals have no `equals`/`getHashCode`, so a
-    // `HashTable` falls back to a WeakMap-counter identity hash per
-    // lookup, measurably slower than `Map`'s native hashing. (Constant-
-    // aval dedup matters where keys are *texture* avals — there the
-    // `AtlasPool` is content-keyed; constant avals there carry a cached
-    // hash and a fast `equals`.)
-    byAval = new Map();
-    has(aval) { return this.byAval.has(aval); }
-    entry(aval) { return this.byAval.get(aval); }
-    /**
-     * Acquire (or share) an allocation for `aval`. Caller passes the
-     * pre-read `value` (so the pool doesn't need a token) plus the
-     * (`dataBytes`, `typeId`, `length`, `pack`) describing how to lay
-     * it out. If a new allocation is made, the value is packed and
-     * uploaded immediately.
-     */
-    acquire(device, arena, aval, value, dataBytes, typeId, length, pack) {
-        const existing = this.byAval.get(aval);
-        if (existing !== undefined) {
-            existing.refcount++;
-            return existing.ref;
-        }
-        const ref = arena.alloc(dataBytes);
-        const allocBytes = ALIGN16(ALLOC_HEADER_PAD_TO + dataBytes);
-        const buf = new ArrayBuffer(allocBytes);
-        const u32 = new Uint32Array(buf);
-        const f32 = new Float32Array(buf);
-        u32[0] = typeId;
-        u32[1] = length;
-        // stride_bytes (offset 8): bytes per element. Lets the VS decode
-        // pick V3- vs V4-tight load expressions for vec4 attributes
-        // (and is informative for everything else).
-        u32[2] = length > 0 ? Math.floor(dataBytes / length) : 0;
-        pack(value, f32, ALLOC_HEADER_PAD_TO / 4);
-        arena.write(ref, new Uint8Array(buf));
-        void device;
-        this.byAval.set(aval, { ref, dataBytes, typeId, pack, refcount: 1 });
-        return ref;
-    }
-    /** Decrement refcount; if zero, free the arena allocation. */
-    release(arena, aval) {
-        const e = this.byAval.get(aval);
-        if (e === undefined)
-            return;
-        e.refcount--;
-        if (e.refcount > 0)
-            return;
-        arena.release(e.ref, ALIGN16(ALLOC_HEADER_PAD_TO + e.dataBytes));
-        this.byAval.delete(aval);
-    }
-    /** Re-pack one entry's data region into the arena's CPU shadow. */
-    repack(device, arena, aval, val) {
-        const e = this.byAval.get(aval);
-        if (e === undefined)
-            return;
-        const dst = new Float32Array(e.dataBytes / 4);
-        e.pack(val, dst, 0);
-        arena.write(e.ref + ALLOC_HEADER_PAD_TO, new Uint8Array(dst.buffer, dst.byteOffset, e.dataBytes));
-        void device;
-    }
-}
-/**
- * Aval-keyed pool over the `IndexAllocator`. Two draws referencing
- * the same `Uint32Array` (or aval thereof) share an index range —
- * 19K instanced clones of the same mesh share one allocation, one
- * upload. Index data is treated as immutable for the aval's
- * lifetime: an aval mark won't repack (we'd have to free + re-alloc
- * since size changes are likely). Use a fresh aval to swap meshes.
- *
- * **Value-equality dedup for constant avals (§5b):** when an
- * incoming aval has `isConstant === true`, the pool also keys by
- * the underlying `ArrayBuffer` tuple `(buffer, byteOffset,
- * byteLength)`. Two distinct constant avals wrapping the same
- * `Uint32Array` view (or two views over the same backing buffer
- * with matching offsets) collapse to one allocation. Hashing
- * kilobytes of indices on every acquire would be wasteful; the
- * tuple key catches the realistic "one ArrayBuffer shared across
- * many aval wrappers" pattern, which is the only one that matters
- * for the heap path. Reactive (non-constant) avals fall through
- * to identity-only — their content can change and the pool can't
- * silently merge them.
- */
-class IndexPool {
-    // Per-aval binding. `perAvalCount` tracks acquire/release balance
-    // for THIS aval; `entry` is the shared allocation (one entry can be
-    // referenced by many aliasing avals via §5b dedup).
-    byAval = new Map();
-    byValueKey = new Map();
-    // Stable per-ArrayBuffer numeric id for value-key composition.
-    // WeakMap-backed so buffers GC'd elsewhere drop their entry too.
-    bufferIds = new WeakMap();
-    nextBufferId = 1;
-    bufferIdOf(buf) {
-        let id = this.bufferIds.get(buf);
-        if (id === undefined) {
-            id = this.nextBufferId++;
-            this.bufferIds.set(buf, id);
-        }
-        return id;
-    }
-    acquire(device, indices, aval, arr) {
-        const bound = this.byAval.get(aval);
-        if (bound !== undefined) {
-            bound.perAvalCount++;
-            bound.entry.totalRefcount++;
-            return { firstIndex: bound.entry.firstIndex, count: bound.entry.count };
-        }
-        let valueKey;
-        if (aval.isConstant) {
-            valueKey = `${this.bufferIdOf(arr.buffer)}:${arr.byteOffset}:${arr.byteLength}`;
-            const shared = this.byValueKey.get(valueKey);
-            if (shared !== undefined) {
-                shared.totalRefcount++;
-                this.byAval.set(aval, { entry: shared, perAvalCount: 1 });
-                return { firstIndex: shared.firstIndex, count: shared.count };
-            }
-        }
-        const firstIndex = indices.alloc(arr.length);
-        indices.write(firstIndex * 4, new Uint8Array(arr.buffer, arr.byteOffset, arr.byteLength));
-        void device;
-        const entry = { firstIndex, count: arr.length, totalRefcount: 1, valueKey };
-        this.byAval.set(aval, { entry, perAvalCount: 1 });
-        if (valueKey !== undefined)
-            this.byValueKey.set(valueKey, entry);
-        return { firstIndex, count: arr.length };
-    }
-    release(indices, aval) {
-        const bound = this.byAval.get(aval);
-        if (bound === undefined)
-            return;
-        bound.perAvalCount--;
-        bound.entry.totalRefcount--;
-        if (bound.perAvalCount === 0)
-            this.byAval.delete(aval);
-        if (bound.entry.totalRefcount > 0)
-            return;
-        indices.release(bound.entry.firstIndex, bound.entry.count);
-        if (bound.entry.valueKey !== undefined) {
-            this.byValueKey.delete(bound.entry.valueKey);
-        }
-    }
-}
-// ---------------------------------------------------------------------------
-// DrawHeap (slot-indexed) and AttributeArena (byte-bump) allocators
-// ---------------------------------------------------------------------------
-/**
- * Slot-indexed allocator over a GrowBuffer. `slotBytes` is set per-
- * instance — each bucket sizes its DrawHeader from its effect's
- * schema, so a bucket whose layout is e.g. 96 B / slot uses a
- * DrawHeap with `slotBytes=96`.
- */
-class DrawHeap {
-    buf;
-    slotBytes;
-    free = [];
-    nextSlot = 0;
-    constructor(buf, slotBytes) {
-        this.buf = buf;
-        this.slotBytes = slotBytes;
-    }
-    get buffer() { return this.buf.buffer; }
-    /** Bytes per slot — caller multiplies by slot index for byte offsets. */
-    get bytesPerSlot() { return this.slotBytes; }
-    /** High-water mark in bytes (used to size bind-group entry on rebuild). */
-    get usedBytes() { return this.nextSlot * this.slotBytes; }
-    alloc() {
-        const slot = this.free.length > 0 ? this.free.pop() : this.nextSlot++;
-        this.buf.ensureCapacity((slot + 1) * this.slotBytes);
-        this.buf.setUsed(Math.max(this.buf.usedBytes, (slot + 1) * this.slotBytes));
-        return slot;
-    }
-    release(slot) { this.free.push(slot); }
-    onResize(cb) { return this.buf.onResize(cb); }
-    destroy() { this.buf.destroy(); }
-}
-/**
- * Byte-bump allocator over a GrowBuffer for variable-size attribute
- * allocations. Each allocation gets a 16-byte aligned start (8-byte
- * (typeId, length) header at the start, data 16 bytes in). Frees go
- * onto a list keyed by size for simple first-fit reuse later — for
- * now `release` just records the gap and the bump cursor never
- * shrinks.
- */
-class AttributeArena {
-    buf;
-    cursor = 0;
-    // (offset, size) free entries; first-fit reuse not yet implemented.
-    freeList = [];
-    // CPU shadow of the entire GPU buffer. Writes go here first; a
-    // single `device.queue.writeBuffer` per dirty contiguous range
-    // lifts them to the GPU at flush time. At the cost of doubling
-    // host memory we collapse N small writeBuffer calls (10K+ at
-    // initial population) to 1 per frame.
-    shadow;
-    dirtyMin = Infinity;
-    dirtyMax = 0;
-    constructor(buf) {
-        this.buf = buf;
-        this.shadow = new Uint8Array(buf.capacity);
-        buf.onResize(() => {
-            const grown = new Uint8Array(buf.capacity);
-            grown.set(this.shadow);
-            this.shadow = grown;
-        });
-    }
-    get buffer() { return this.buf.buffer; }
-    get capacity() { return this.buf.capacity; }
-    get usedBytes() { return this.cursor; }
-    /**
-     * Stage `data` to the shadow at byte offset `dst`. Tracks the
-     * dirty range so `flush(device)` can emit a single writeBuffer
-     * covering everything dirty since the last flush.
-     */
-    write(dst, data) {
-        this.shadow.set(data, dst);
-        if (dst < this.dirtyMin)
-            this.dirtyMin = dst;
-        const end = dst + data.byteLength;
-        if (end > this.dirtyMax)
-            this.dirtyMax = end;
-    }
-    flush(device) {
-        if (this.dirtyMax <= this.dirtyMin)
-            return;
-        device.queue.writeBuffer(this.buf.buffer, this.dirtyMin, this.shadow.buffer, this.shadow.byteOffset + this.dirtyMin, this.dirtyMax - this.dirtyMin);
-        this.dirtyMin = Infinity;
-        this.dirtyMax = 0;
-    }
-    /**
-     * Allocate space for one attribute. Returns the byte ref (offset
-     * to the header — data lives at ref + 16).
-     */
-    alloc(dataBytes) {
-        const allocBytes = ALIGN16(ALLOC_HEADER_PAD_TO + dataBytes);
-        // First-fit reuse from free list.
-        for (let i = 0; i < this.freeList.length; i++) {
-            const f = this.freeList[i];
-            if (f.size >= allocBytes) {
-                const ref = f.off;
-                if (f.size === allocBytes)
-                    this.freeList.splice(i, 1);
-                else {
-                    f.off += allocBytes;
-                    f.size -= allocBytes;
-                }
-                return ref;
-            }
-        }
-        const ref = this.cursor;
-        this.cursor += allocBytes;
-        this.buf.ensureCapacity(this.cursor);
-        this.buf.setUsed(this.cursor);
-        return ref;
-    }
-    release(ref, dataBytes) {
-        const allocBytes = ALIGN16(ALLOC_HEADER_PAD_TO + dataBytes);
-        insertSortedFreeBlock(this.freeList, ref, allocBytes);
-    }
-    onResize(cb) { return this.buf.onResize(cb); }
-    destroy() { this.buf.destroy(); }
-}
-/**
- * Insert `{off, size}` into a free-list kept sorted by `off`, then
- * coalesce with the two immediate neighbours.
- *
- * The list invariant — sorted, non-overlapping, never-adjacent — is
- * preserved across allocs (which take from the front or split a
- * block) and releases (this function). The previous implementation
- * did `push + Array.prototype.sort + linear coalesce scan`, which is
- * O(N log N) per release. Under a 500-RO bulk-remove the sort
- * dominated `removeDraw` (~41 ms of self-time in the heap-demo-sg
- * toggle profile). Binary-search insert + 2-neighbour merge collapses
- * that to O(log N + N-shift), and is principled — the sort never
- * actually mattered since we already had the sorted prefix as an
- * invariant.
- */
-function insertSortedFreeBlock(freeList, off, size) {
-    // Binary-search for the insertion index (first entry whose off > new).
-    let lo = 0, hi = freeList.length;
-    while (lo < hi) {
-        const mid = (lo + hi) >>> 1;
-        if (freeList[mid].off <= off)
-            lo = mid + 1;
-        else
-            hi = mid;
-    }
-    // lo is the index where the new entry would be inserted.
-    // Try merging with the predecessor first; if successful, the merged
-    // block may now be adjacent to its (former) successor too.
-    const prev = lo > 0 ? freeList[lo - 1] : undefined;
-    if (prev !== undefined && prev.off + prev.size === off) {
-        prev.size += size;
-        // Check forward-merge with what was freeList[lo].
-        const next = freeList[lo];
-        if (next !== undefined && prev.off + prev.size === next.off) {
-            prev.size += next.size;
-            freeList.splice(lo, 1);
-        }
-        return;
-    }
-    const next = freeList[lo];
-    if (next !== undefined && off + size === next.off) {
-        next.off = off;
-        next.size += size;
-        return;
-    }
-    freeList.splice(lo, 0, { off, size });
-}
-/**
- * Element-bump allocator over an index GrowBuffer (units = u32). Each
- * draw's index range is allocated as one block; on release the block
- * is returned to a free list and can be reused first-fit.
- */
-class IndexAllocator {
-    buf;
-    cursor = 0; // in u32s, not bytes
-    freeList = [];
-    // CPU shadow + dirty range, same shape as AttributeArena. Index
-    // uploads (one per drawn mesh's index buffer) get coalesced to a
-    // single writeBuffer per dirty range at flush time.
-    shadow;
-    dirtyMin = Infinity;
-    dirtyMax = 0;
-    constructor(buf) {
-        this.buf = buf;
-        this.shadow = new Uint8Array(buf.capacity);
-        buf.onResize(() => {
-            const grown = new Uint8Array(buf.capacity);
-            grown.set(this.shadow);
-            this.shadow = grown;
-        });
-    }
-    get buffer() { return this.buf.buffer; }
-    get usedElements() { return this.cursor; }
-    /** Stage `data` (bytes) at the given byte offset; tracks dirty range. */
-    write(dstByteOffset, data) {
-        this.shadow.set(data, dstByteOffset);
-        if (dstByteOffset < this.dirtyMin)
-            this.dirtyMin = dstByteOffset;
-        const end = dstByteOffset + data.byteLength;
-        if (end > this.dirtyMax)
-            this.dirtyMax = end;
-    }
-    flush(device) {
-        if (this.dirtyMax <= this.dirtyMin)
-            return;
-        device.queue.writeBuffer(this.buf.buffer, this.dirtyMin, this.shadow.buffer, this.shadow.byteOffset + this.dirtyMin, this.dirtyMax - this.dirtyMin);
-        this.dirtyMin = Infinity;
-        this.dirtyMax = 0;
-    }
-    alloc(elements) {
-        for (let i = 0; i < this.freeList.length; i++) {
-            const f = this.freeList[i];
-            if (f.size >= elements) {
-                const off = f.off;
-                if (f.size === elements)
-                    this.freeList.splice(i, 1);
-                else {
-                    f.off += elements;
-                    f.size -= elements;
-                }
-                return off;
-            }
-        }
-        const off = this.cursor;
-        this.cursor += elements;
-        this.buf.ensureCapacity(this.cursor * 4);
-        this.buf.setUsed(this.cursor * 4);
-        return off;
-    }
-    release(off, elements) {
-        insertSortedFreeBlock(this.freeList, off, elements);
-    }
-    onResize(cb) { return this.buf.onResize(cb); }
-    destroy() { this.buf.destroy(); }
-}
-function buildArenaState(device, attrBytesHint, idxBytesHint, label, idxExtraUsage = 0) {
-    const attrs = new AttributeArena(new GrowBuffer(device, `${label}/attrs`, GPUBufferUsage.STORAGE, attrBytesHint));
-    const indices = new IndexAllocator(new GrowBuffer(device, `${label}/idx`, GPUBufferUsage.INDEX | idxExtraUsage, idxBytesHint));
-    return { attrs, indices };
-}
-function arenaBytes(arena) {
-    return arena.attrs.usedBytes + arena.indices.usedElements * 4;
-}
-/** Upload a single attribute — header (typeId, length) + data — into the arena at byte offset `ref`. */
-function writeAttribute(device, buf, ref, typeId, length, data) {
-    const allocBytes = ALIGN16(ALLOC_HEADER_PAD_TO + data.byteLength);
-    const staging = new ArrayBuffer(allocBytes);
-    const u32 = new Uint32Array(staging);
-    const f32 = new Float32Array(staging);
-    u32[0] = typeId;
-    u32[1] = length;
-    f32.set(data, ALLOC_HEADER_PAD_TO / 4);
-    device.queue.writeBuffer(buf, ref, staging, 0, allocBytes);
-}
-function asAval(v) {
-    return (typeof v === "object" && v !== null && typeof v.getValue === "function")
-        ? v
-        : AVal.constant(v);
-}
-/** Heuristic predicate — BufferView has `buffer: aval<IBuffer>` + elementType. */
-function isBufferView(v) {
-    if (typeof v !== "object" || v === null)
-        return false;
-    const o = v;
-    return typeof o.buffer === "object" && o.buffer !== null
-        && typeof o.buffer.getValue === "function"
-        && typeof o.elementType === "object" && o.elementType !== null;
-}
-/**
- * Float32 view over a host-side buffer source. Used by the BufferView
- * packer to hand the pool a typed array it can `set()` from.
- */
-function asFloat32(data) {
-    if (data instanceof Float32Array)
-        return data;
-    if (ArrayBuffer.isView(data)) {
-        return new Float32Array(data.buffer, data.byteOffset, data.byteLength / 4);
-    }
-    return new Float32Array(data); // ArrayBuffer
-}
-// ---------------------------------------------------------------------------
-// Megacall GPU prefix-sum compute shader
-// ---------------------------------------------------------------------------
-const SCAN_TILE_SIZE = 512;
-const SCAN_WG_SIZE = 256;
-const SCAN_MAX_RECORDS = SCAN_TILE_SIZE * SCAN_TILE_SIZE; // numBlocks ≤ TILE_SIZE
-const TILE_K = 64;
-/** drawTable record width: (firstEmit, drawIdx, indexStart, indexCount, instanceCount). */
-const RECORD_U32 = 5;
-const RECORD_BYTES = RECORD_U32 * 4;
-const HEAP_SCAN_WGSL = `
-struct Params {
-  numRecords: u32,
-  numBlocks:  u32,
-  _pad0:      u32,
-  _pad1:      u32,
-};
-
-struct Record {
-  firstEmit:     u32,
-  drawIdx:       u32,
-  indexStart:    u32,
-  indexCount:    u32,
-  instanceCount: u32,
-};
-
-@group(0) @binding(0) var<storage, read_write> drawTable:        array<Record>;
-@group(0) @binding(1) var<storage, read_write> blockSums:        array<u32>;
-@group(0) @binding(2) var<storage, read_write> blockOffsets:     array<u32>;
-@group(0) @binding(3) var<storage, read_write> indirect:         array<u32>;
-@group(0) @binding(4) var<uniform>             params:           Params;
-@group(0) @binding(5) var<storage, read_write> firstDrawInTile:  array<u32>;
-
-const TILE_SIZE: u32 = 512u;
-const WG_SIZE:   u32 = 256u;
-const TILE_K:    u32 = 64u;
-
-var<workgroup> sdata: array<u32, 512>;
-
-fn blellochScan(tid: u32) {
-  var offset: u32 = 1u;
-  for (var d: u32 = TILE_SIZE >> 1u; d > 0u; d = d >> 1u) {
-    workgroupBarrier();
-    if (tid < d) {
-      let ai = offset * (2u * tid + 1u) - 1u;
-      let bi = offset * (2u * tid + 2u) - 1u;
-      sdata[bi] = sdata[bi] + sdata[ai];
-    }
-    offset = offset * 2u;
-  }
-  if (tid == 0u) { sdata[TILE_SIZE - 1u] = 0u; }
-  for (var d: u32 = 1u; d < TILE_SIZE; d = d * 2u) {
-    offset = offset >> 1u;
-    workgroupBarrier();
-    if (tid < d) {
-      let ai = offset * (2u * tid + 1u) - 1u;
-      let bi = offset * (2u * tid + 2u) - 1u;
-      let t = sdata[ai];
-      sdata[ai] = sdata[bi];
-      sdata[bi] = sdata[bi] + t;
-    }
-  }
-  workgroupBarrier();
-}
-
-@compute @workgroup_size(WG_SIZE)
-fn scanTile(@builtin(local_invocation_id) lid: vec3<u32>, @builtin(workgroup_id) wgid: vec3<u32>) {
-  let tid = lid.x;
-  let blockOff = wgid.x * TILE_SIZE;
-  let n = params.numRecords;
-  let i0 = blockOff + tid;
-  let i1 = blockOff + tid + WG_SIZE;
-  var v0: u32 = 0u;
-  var v1: u32 = 0u;
-  if (i0 < n) { v0 = drawTable[i0].indexCount * drawTable[i0].instanceCount; }
-  if (i1 < n) { v1 = drawTable[i1].indexCount * drawTable[i1].instanceCount; }
-  sdata[tid]           = v0;
-  sdata[tid + WG_SIZE] = v1;
-  workgroupBarrier();
-  blellochScan(tid);
-  if (i0 < n) { drawTable[i0].firstEmit = sdata[tid]; }
-  if (i1 < n) { drawTable[i1].firstEmit = sdata[tid + WG_SIZE]; }
-  if (tid == WG_SIZE - 1u) {
-    blockSums[wgid.x] = sdata[tid + WG_SIZE] + v1;
-  }
-}
-
-@compute @workgroup_size(WG_SIZE)
-fn scanBlocks(@builtin(local_invocation_id) lid: vec3<u32>) {
-  let tid = lid.x;
-  let n = params.numBlocks;
-  let i0 = tid;
-  let i1 = tid + WG_SIZE;
-  var v0: u32 = 0u;
-  var v1: u32 = 0u;
-  if (i0 < n) { v0 = blockSums[i0]; }
-  if (i1 < n) { v1 = blockSums[i1]; }
-  sdata[tid]           = v0;
-  sdata[tid + WG_SIZE] = v1;
-  workgroupBarrier();
-  blellochScan(tid);
-  if (i0 < n) { blockOffsets[i0] = sdata[tid]; }
-  if (i1 < n) { blockOffsets[i1] = sdata[tid + WG_SIZE]; }
-  workgroupBarrier();
-  if (tid == 0u) {
-    if (n > 0u) {
-      let lastIdx = n - 1u;
-      let total = blockOffsets[lastIdx] + blockSums[lastIdx];
-      indirect[0] = total;
-    } else {
-      indirect[0] = 0u;
-    }
-    indirect[1] = 1u;
-    indirect[2] = 0u;
-    indirect[3] = 0u;
-  }
-}
-
-@compute @workgroup_size(WG_SIZE)
-fn addOffsets(@builtin(local_invocation_id) lid: vec3<u32>, @builtin(workgroup_id) wgid: vec3<u32>) {
-  let tid = lid.x;
-  let blockOff = wgid.x * TILE_SIZE;
-  let n = params.numRecords;
-  let off = blockOffsets[wgid.x];
-  let i0 = blockOff + tid;
-  let i1 = blockOff + tid + WG_SIZE;
-  if (i0 < n) { drawTable[i0].firstEmit = drawTable[i0].firstEmit + off; }
-  if (i1 < n) { drawTable[i1].firstEmit = drawTable[i1].firstEmit + off; }
-}
-
-@compute @workgroup_size(WG_SIZE)
-fn buildTileIndex(@builtin(global_invocation_id) gid: vec3<u32>) {
-  let tileIdx = gid.x;
-  // totalEmit is computed by scanBlocks into indirect[0]; reading it
-  // from indirect avoids a separate uniform/storage round-trip.
-  let totalEmit = indirect[0];
-  let numTiles = (totalEmit + TILE_K - 1u) / TILE_K;
-  if (tileIdx > numTiles) { return; }
-  if (params.numRecords == 0u) {
-    if (tileIdx == 0u) { firstDrawInTile[0] = 0u; }
-    return;
-  }
-  if (tileIdx == numTiles) {
-    // Sentinel for the open upper bound — the LAST VALID SLOT, not
-    // numRecords. The render VS uses
-    //     hi = firstDrawInTile[_tileIdx + 1u]
-    // and the binary search treats hi as INCLUSIVE. If the sentinel
-    // were numRecords (one past last), the search would drag lo into
-    // the OOB slot for emits in the last tile, since drawTable reads
-    // past recordCount return 0 (binding size clamping) and 0 ≤ emit
-    // is always true. Visible symptom: the LAST few emits in the
-    // bucket land on slot=numRecords (drawIdx=0, indexCount=0 → /-by-
-    // zero) → degenerate / cross-RO triangle stitched to slot 0.
-    firstDrawInTile[tileIdx] = params.numRecords - 1u;
-    return;
-  }
-  let tileStart = tileIdx * TILE_K;
-  var lo: u32 = 0u;
-  var hi: u32 = params.numRecords - 1u;
-  loop {
-    if (lo >= hi) { break; }
-    let mid = (lo + hi + 1u) >> 1u;
-    if (drawTable[mid].firstEmit <= tileStart) { lo = mid; } else { hi = mid - 1u; }
-  }
-  firstDrawInTile[tileIdx] = lo;
-}
-`;
+import { packerForWgslType, PACKER_MAT4 } from "./heapScene/packers.js";
+import { HEAP_SCAN_WGSL, SCAN_TILE_SIZE, SCAN_WG_SIZE, SCAN_MAX_RECORDS, TILE_K, RECORD_U32, RECORD_BYTES, } from "./heapScene/scanKernel.js";
+import { GrowBuffer, MIN_BUFFER_BYTES, POW2, ALIGN16, } from "./heapScene/growBuffer.js";
+import { UniformPool, IndexPool, DrawHeap, AttributeArena, IndexAllocator, insertSortedFreeBlock, buildArenaState, arenaBytes, writeAttribute, asAval, isBufferView, asFloat32, ALLOC_HEADER_BYTES, ALLOC_HEADER_PAD_TO, ENC_V3F_TIGHT, SEM_POSITIONS, SEM_NORMALS, } from "./heapScene/pools.js";
+import { encodeModeKey } from "./pipelineCache/index.js";
+import { snapshotDescriptor, ModeKeyTracker } from "./derivedModes/modeKeyCpu.js";
+import { addMarkingCallback } from "@aardworx/wombat.adaptive";
 export function buildHeapScene(device, sig, initialDraws, opts = {}) {
     const atlasPool = opts.atlasPool;
     const colorAttachmentName = sig.colorNames[0];
@@ -872,6 +88,55 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
     const drawIdToLocalSlot = [];
     /** Per-draw index aval — for `indexPool.release` on removeDraw. */
     const drawIdToIndexAval = [];
+    /**
+     * Original spec retained per drawId so we can re-add the RO into a
+     * new bucket when its PipelineState modeKey changes (reactive
+     * cullmode flip, etc.). Cheap to retain — specs are mostly aval
+     * references.
+     */
+    const drawIdToSpec = [];
+    /** Per-draw ModeKeyTracker — recomputes the modeKey on demand. Does
+     *  NOT install per-instance marking callbacks; subscriptions are
+     *  scene-level (deduped by aval identity below). */
+    const drawIdToModeTracker = [];
+    /** drawIds whose PS marked since last update; drained by `update`. */
+    const dirtyModeKeyDrawIds = new Set();
+    /**
+     * Scene-level mode-aval subscription dedupe. One IDisposable per
+     * unique leaf aval, plus a Set of dependent drawIds. When the aval
+     * marks, all drawIds in the set become dirty in O(1) per RO instead
+     * of installing N separate addMarkingCallbacks. The big win for the
+     * shared-cullCval case (20k ROs subscribing to one cval → 1 callback
+     * instead of 20k).
+     */
+    const modeAvalToDrawIds = new Map();
+    const modeAvalCallbacks = new Map();
+    function subscribeModeLeaf(av, drawId) {
+        let set = modeAvalToDrawIds.get(av);
+        if (set === undefined) {
+            set = new Set();
+            modeAvalToDrawIds.set(av, set);
+            modeAvalCallbacks.set(av, addMarkingCallback(av, () => {
+                for (const id of set)
+                    dirtyModeKeyDrawIds.add(id);
+            }));
+        }
+        set.add(drawId);
+    }
+    function unsubscribeModeLeaf(av, drawId) {
+        const set = modeAvalToDrawIds.get(av);
+        if (set === undefined)
+            return;
+        set.delete(drawId);
+        if (set.size === 0) {
+            modeAvalToDrawIds.delete(av);
+            const cb = modeAvalCallbacks.get(av);
+            if (cb !== undefined) {
+                cb.dispose();
+                modeAvalCallbacks.delete(av);
+            }
+        }
+    }
     let nextDrawId = 0;
     /**
      * Unwrap an aval to its inner value, or pass through a plain value.
@@ -1246,12 +511,12 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             label: `heapScene/${bucket.label}/scanBg`,
             layout: scanBgl,
             entries: [
-                { binding: 0, resource: { buffer: bucket.drawTableBuf.buffer } },
-                { binding: 1, resource: { buffer: bucket.blockSumsBuf.buffer } },
-                { binding: 2, resource: { buffer: bucket.blockOffsetsBuf.buffer } },
-                { binding: 3, resource: { buffer: bucket.indirectBuf } },
-                { binding: 4, resource: { buffer: bucket.paramsBuf } },
-                { binding: 5, resource: { buffer: bucket.firstDrawInTileBuf.buffer } },
+                { binding: 0, resource: { buffer: bucket.slots[0].drawTableBuf.buffer } },
+                { binding: 1, resource: { buffer: bucket.slots[0].blockSumsBuf.buffer } },
+                { binding: 2, resource: { buffer: bucket.slots[0].blockOffsetsBuf.buffer } },
+                { binding: 3, resource: { buffer: bucket.slots[0].indirectBuf } },
+                { binding: 4, resource: { buffer: bucket.slots[0].paramsBuf } },
+                { binding: 5, resource: { buffer: bucket.slots[0].firstDrawInTileBuf.buffer } },
             ],
         });
     }
@@ -1458,31 +723,6 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
         avalIds.set(av, vid);
         return `c${vid}`;
     };
-    const psContentIds = new WeakMap();
-    const psIdOf = (ps) => {
-        if (ps === undefined)
-            return "ps#default";
-        const cached = psContentIds.get(ps);
-        if (cached !== undefined)
-            return cached;
-        const r = ps.rasterizer;
-        const parts = [
-            avalIdOf(r.topology),
-            avalIdOf(r.cullMode),
-            avalIdOf(r.frontFace),
-            avalIdOf(r.depthBias),
-            ps.depth !== undefined
-                ? `d:${avalIdOf(ps.depth.write)}:${avalIdOf(ps.depth.compare)}:${avalIdOf(ps.depth.clamp)}`
-                : "d:_",
-            ps.stencil !== undefined ? "s:1" : "s:_",
-            avalIdOf(ps.blends),
-            avalIdOf(ps.alphaToCoverage),
-            avalIdOf(ps.blendConstant),
-        ];
-        const key = `ps#${parts.join("|")}`;
-        psContentIds.set(ps, key);
-        return key;
-    };
     function resolvePipelineState(ps) {
         if (ps === undefined) {
             return {
@@ -1521,7 +761,7 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             { binding: 3, resource: { buffer: arena.attrs.buffer } }, // heapV4f
         ];
         {
-            if (bucket.drawTableBuf === undefined) {
+            if (bucket.slots[0].drawTableBuf === undefined) {
                 throw new Error("heapScene: megacall bucket without drawTableBuf");
             }
             // Bind drawTable with size = recordCount * RECORD_BYTES so the VS
@@ -1529,9 +769,9 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             // the live record count — keeps stale tail entries out of the
             // binary search. Minimum one zero-record to satisfy WebGPU non-
             // zero size constraint when the bucket is empty.
-            const dtBytes = Math.max(RECORD_BYTES, bucket.recordCount * RECORD_BYTES);
-            entries.push({ binding: 4, resource: { buffer: bucket.drawTableBuf.buffer, offset: 0, size: dtBytes } }, { binding: 5, resource: { buffer: arena.indices.buffer } }, { binding: 6, resource: { buffer: bucket.firstDrawInTileBuf.buffer } });
-            bucket.renderBoundRecordCount = bucket.recordCount;
+            const dtBytes = Math.max(RECORD_BYTES, bucket.slots[0].recordCount * RECORD_BYTES);
+            entries.push({ binding: 4, resource: { buffer: bucket.slots[0].drawTableBuf.buffer, offset: 0, size: dtBytes } }, { binding: 5, resource: { buffer: arena.indices.buffer } }, { binding: 6, resource: { buffer: bucket.slots[0].firstDrawInTileBuf.buffer } });
+            bucket.slots[0].renderBoundRecordCount = bucket.slots[0].recordCount;
         }
         // Schema-driven texture + sampler entries. v1 user surface still
         // accepts a single (texture, sampler) pair via HeapTextureSet —
@@ -1656,8 +896,17 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             throw new Error("heapScene: findOrCreateBucket called before family build");
         }
         const fam = familyFor(effect);
-        const psKey = psIdOf(pipelineState);
-        const bk = `family#${fam.schema.id}|${psKey}`;
+        // ─── PS keying — VALUE based, not identity based ───────────────
+        // psIdOf used to hash by aval identity. That meant 20k ROs each
+        // constructed with `cval("back")` for cullMode hashed to 20k
+        // distinct keys → 20k buckets, all rendering with bitwise-
+        // identical state. Now the key is the bitfield-encoded modeKey
+        // (the actual value-set in the descriptor), so identical-value
+        // cvals collapse to ONE bucket. See docs/derived-modes.md and
+        // tests/heap-multi-pipeline-bucket.test.ts.
+        const psDescriptor = snapshotDescriptor(pipelineState, sig);
+        const psModeKey = encodeModeKey(psDescriptor);
+        const bk = `family#${fam.schema.id}|mk#${psModeKey.toString(16)}`;
         const existing = bucketByKey.get(bk);
         if (existing !== undefined)
             return existing;
@@ -1686,13 +935,21 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
         // refs).
         const drawHeapBuf = new GrowBuffer(device, `heapScene/${bk}/drawHeap`, GPUBufferUsage.STORAGE, Math.max(layout.drawHeaderBytes, 64));
         const drawHeap = new DrawHeap(drawHeapBuf, layout.drawHeaderBytes);
+        const slot0 = {
+            pipeline,
+            drawTableDirtyMin: Infinity, drawTableDirtyMax: 0,
+            recordCount: 0, slotToRecord: [], recordToSlot: [],
+            totalEmitEstimate: 0,
+            scanDirty: false,
+        };
         const bucket = {
             // §6 family-merge: family buckets aren't keyed on a specific
             // texture set — atlas placements are addressed per-RO via
             // drawHeader fields (`pageRef` + `formatBits` + `origin` +
             // `size`), and the bucket's atlas-binding ladder is driven by
             // `atlasPool.pagesFor(format)`. Leave `textures` undefined.
-            label: bk, textures: undefined, layout, pipeline,
+            label: bk, textures: undefined, layout,
+            slots: [slot0],
             bindGroup: null,
             drawHeap,
             drawHeaderStaging: new Float32Array(drawHeapBuf.capacity / 4),
@@ -1701,10 +958,6 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             localEntries: [], localToDrawId: [],
             localPerDrawAvals: [], localPerDrawRefs: [], localLayoutIds: [],
             drawSlots: new Set(), dirty: new Set(),
-            drawTableDirtyMin: Infinity, drawTableDirtyMax: 0,
-            recordCount: 0, slotToRecord: [], recordToSlot: [],
-            totalEmitEstimate: 0,
-            scanDirty: false,
             isAtlasBucket,
             localAtlasReleases: [],
             localAtlasTextures: [],
@@ -1728,30 +981,30 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
                 label: `heapScene/${bk}/params`, size: 16,
                 usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,
             });
-            bucket.drawTableBuf = dtBuf;
-            bucket.drawTableShadow = new Uint32Array(dtBuf.capacity / 4);
-            bucket.blockSumsBuf = blockSumsBuf;
-            bucket.blockOffsetsBuf = blockOffsetsBuf;
-            bucket.firstDrawInTileBuf = firstDrawInTileBuf;
-            bucket.indirectBuf = indirectBuf;
-            bucket.paramsBuf = paramsBuf;
+            bucket.slots[0].drawTableBuf = dtBuf;
+            bucket.slots[0].drawTableShadow = new Uint32Array(dtBuf.capacity / 4);
+            bucket.slots[0].blockSumsBuf = blockSumsBuf;
+            bucket.slots[0].blockOffsetsBuf = blockOffsetsBuf;
+            bucket.slots[0].firstDrawInTileBuf = firstDrawInTileBuf;
+            bucket.slots[0].indirectBuf = indirectBuf;
+            bucket.slots[0].paramsBuf = paramsBuf;
             const ensureScanBuffers = () => {
-                const needBlocks = Math.max(1, Math.ceil(bucket.recordCount / SCAN_TILE_SIZE));
+                const needBlocks = Math.max(1, Math.ceil(bucket.slots[0].recordCount / SCAN_TILE_SIZE));
                 blockSumsBuf.ensureCapacity(needBlocks * 4);
                 blockOffsetsBuf.ensureCapacity(needBlocks * 4);
             };
             const rebuildScanBg = () => {
-                bucket.scanBindGroup = buildScanBindGroup(bucket);
+                bucket.slots[0].scanBindGroup = buildScanBindGroup(bucket);
             };
             dtBuf.onResize(() => {
                 const grown = new Uint32Array(dtBuf.capacity / 4);
-                grown.set(bucket.drawTableShadow);
-                bucket.drawTableShadow = grown;
+                grown.set(bucket.slots[0].drawTableShadow);
+                bucket.slots[0].drawTableShadow = grown;
                 ensureScanBuffers();
                 bucket.bindGroup = buildBucketBindGroup(bucket);
                 rebuildScanBg();
-                bucket.drawTableDirtyMin = 0;
-                bucket.drawTableDirtyMax = bucket.recordCount * RECORD_BYTES;
+                bucket.slots[0].drawTableDirtyMin = 0;
+                bucket.slots[0].drawTableDirtyMax = bucket.slots[0].recordCount * RECORD_BYTES;
             });
             blockSumsBuf.onResize(rebuildScanBg);
             blockOffsetsBuf.onResize(rebuildScanBg);
@@ -1759,7 +1012,7 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
                 rebuildScanBg();
                 bucket.bindGroup = buildBucketBindGroup(bucket);
             });
-            bucket.scanBindGroup = buildScanBindGroup(bucket);
+            bucket.slots[0].scanBindGroup = buildScanBindGroup(bucket);
         }
         bucket.bindGroup = buildBucketBindGroup(bucket);
         drawHeap.onResize(() => {
@@ -2059,8 +1312,8 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
         if (end > bucket.headerDirtyMax)
             bucket.headerDirtyMax = end;
         {
-            const dtBuf = bucket.drawTableBuf;
-            const recIdx = bucket.recordCount;
+            const dtBuf = bucket.slots[0].drawTableBuf;
+            const recIdx = bucket.slots[0].recordCount;
             if (recIdx >= SCAN_MAX_RECORDS) {
                 throw new Error(`heapScene: bucket exceeds SCAN_MAX_RECORDS (${SCAN_MAX_RECORDS}); ` +
                     `extend the scan to multi-level if you need more`);
@@ -2070,30 +1323,43 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             dtBuf.setUsed(Math.max(dtBuf.usedBytes, byteOff + RECORD_BYTES));
             // Grow scan-side buffers if recordCount crosses a tile boundary.
             const needBlocks = Math.max(1, Math.ceil((recIdx + 1) / SCAN_TILE_SIZE));
-            bucket.blockSumsBuf.ensureCapacity(needBlocks * 4);
-            bucket.blockOffsetsBuf.ensureCapacity(needBlocks * 4);
-            const shadow = bucket.drawTableShadow;
+            bucket.slots[0].blockSumsBuf.ensureCapacity(needBlocks * 4);
+            bucket.slots[0].blockOffsetsBuf.ensureCapacity(needBlocks * 4);
+            const shadow = bucket.slots[0].drawTableShadow;
             // firstEmit is GPU-overwritten by the prefix-sum pass; 0 is fine.
             shadow[recIdx * RECORD_U32 + 0] = 0;
             shadow[recIdx * RECORD_U32 + 1] = localSlot;
             shadow[recIdx * RECORD_U32 + 2] = idxAlloc.firstIndex;
             shadow[recIdx * RECORD_U32 + 3] = idxAlloc.count;
             shadow[recIdx * RECORD_U32 + 4] = instanceCount;
-            bucket.recordCount = recIdx + 1;
-            bucket.slotToRecord[localSlot] = recIdx;
-            bucket.recordToSlot[recIdx] = localSlot;
-            if (byteOff < bucket.drawTableDirtyMin)
-                bucket.drawTableDirtyMin = byteOff;
-            if (byteOff + RECORD_BYTES > bucket.drawTableDirtyMax)
-                bucket.drawTableDirtyMax = byteOff + RECORD_BYTES;
-            bucket.totalEmitEstimate += idxAlloc.count * instanceCount;
-            const newNumTiles = Math.max(1, Math.ceil(bucket.totalEmitEstimate / TILE_K));
-            bucket.firstDrawInTileBuf.ensureCapacity((newNumTiles + 1) * 4);
-            bucket.scanDirty = true;
+            bucket.slots[0].recordCount = recIdx + 1;
+            bucket.slots[0].slotToRecord[localSlot] = recIdx;
+            bucket.slots[0].recordToSlot[recIdx] = localSlot;
+            if (byteOff < bucket.slots[0].drawTableDirtyMin)
+                bucket.slots[0].drawTableDirtyMin = byteOff;
+            if (byteOff + RECORD_BYTES > bucket.slots[0].drawTableDirtyMax)
+                bucket.slots[0].drawTableDirtyMax = byteOff + RECORD_BYTES;
+            bucket.slots[0].totalEmitEstimate += idxAlloc.count * instanceCount;
+            const newNumTiles = Math.max(1, Math.ceil(bucket.slots[0].totalEmitEstimate / TILE_K));
+            bucket.slots[0].firstDrawInTileBuf.ensureCapacity((newNumTiles + 1) * 4);
+            bucket.slots[0].scanDirty = true;
         }
         drawIdToBucket[drawId] = bucket;
         drawIdToLocalSlot[drawId] = localSlot;
         drawIdToIndexAval[drawId] = indicesAval;
+        // ─── Reactive rebucket: track PS-modeKey changes ────────────────
+        // When any mode-axis aval marks (e.g. cullCval.value = 'front'),
+        // schedule this RO for rebucket on the next update(). Today's
+        // bucket key is the modeKey VALUE (Phase 5b), so changing the
+        // value must move the RO to a different bucket. Without this
+        // tracker the cval flip would be silently ignored.
+        drawIdToSpec[drawId] = spec;
+        // skipSubscribe: this tracker doesn't install its own callbacks.
+        // The scene-level `modeAvalToDrawIds` does it once per unique aval
+        // (the 20k-ROs-share-one-cullCval optimization).
+        const tracker = new ModeKeyTracker(spec.pipelineState, sig, () => { dirtyModeKeyDrawIds.add(drawId); }, { skipSubscribe: true });
+        drawIdToModeTracker[drawId] = tracker;
+        tracker.forEachLeaf((av) => subscribeModeLeaf(av, drawId));
         // ─── §7 derived-uniforms registration ────────────────────────────
         // A uniform binding on this RO is either a value (aval/constant) or a rule —
         // collect the rules (explicit `derivedUniform(...)` values + standard trafo
@@ -2173,13 +1439,13 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             const removedCount = removedEntry !== undefined
                 ? removedEntry.indexCount * removedEntry.instanceCount
                 : 0;
-            bucket.totalEmitEstimate = Math.max(0, bucket.totalEmitEstimate - removedCount);
+            bucket.slots[0].totalEmitEstimate = Math.max(0, bucket.slots[0].totalEmitEstimate - removedCount);
             // Swap-pop: move the last record into the freed slot, decrement
             // recordCount. firstEmit is GPU-rewritten by the next scan, so
             // we only fix (drawIdx, indexStart, indexCount, instanceCount).
-            const recIdx = bucket.slotToRecord[localSlot];
-            const lastRecIdx = bucket.recordCount - 1;
-            const shadow = bucket.drawTableShadow;
+            const recIdx = bucket.slots[0].slotToRecord[localSlot];
+            const lastRecIdx = bucket.slots[0].recordCount - 1;
+            const shadow = bucket.slots[0].drawTableShadow;
             if (recIdx !== lastRecIdx) {
                 const dst = recIdx * RECORD_U32;
                 const src = lastRecIdx * RECORD_U32;
@@ -2188,19 +1454,19 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
                 shadow[dst + 2] = shadow[src + 2];
                 shadow[dst + 3] = shadow[src + 3];
                 shadow[dst + 4] = shadow[src + 4];
-                const movedSlot = bucket.recordToSlot[lastRecIdx];
-                bucket.slotToRecord[movedSlot] = recIdx;
-                bucket.recordToSlot[recIdx] = movedSlot;
+                const movedSlot = bucket.slots[0].recordToSlot[lastRecIdx];
+                bucket.slots[0].slotToRecord[movedSlot] = recIdx;
+                bucket.slots[0].recordToSlot[recIdx] = movedSlot;
                 const byteOff = recIdx * RECORD_BYTES;
-                if (byteOff < bucket.drawTableDirtyMin)
-                    bucket.drawTableDirtyMin = byteOff;
-                if (byteOff + RECORD_BYTES > bucket.drawTableDirtyMax)
-                    bucket.drawTableDirtyMax = byteOff + RECORD_BYTES;
+                if (byteOff < bucket.slots[0].drawTableDirtyMin)
+                    bucket.slots[0].drawTableDirtyMin = byteOff;
+                if (byteOff + RECORD_BYTES > bucket.slots[0].drawTableDirtyMax)
+                    bucket.slots[0].drawTableDirtyMax = byteOff + RECORD_BYTES;
             }
-            bucket.slotToRecord[localSlot] = -1;
-            bucket.recordToSlot[lastRecIdx] = -1;
-            bucket.recordCount = lastRecIdx;
-            bucket.scanDirty = true;
+            bucket.slots[0].slotToRecord[localSlot] = -1;
+            bucket.slots[0].recordToSlot[lastRecIdx] = -1;
+            bucket.slots[0].recordCount = lastRecIdx;
+            bucket.slots[0].scanDirty = true;
         }
         // Release pool entries — refcount drops; if zero, allocation freed.
         const avals = bucket.localPerDrawAvals[localSlot];
@@ -2254,8 +1520,19 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
         drawIdToBucket[drawId] = undefined;
         drawIdToLocalSlot[drawId] = undefined;
         drawIdToIndexAval[drawId] = undefined;
+        drawIdToSpec[drawId] = undefined;
+        const oldTracker = drawIdToModeTracker[drawId];
+        if (oldTracker !== undefined) {
+            oldTracker.forEachLeaf((av) => unsubscribeModeLeaf(av, drawId));
+            oldTracker.dispose();
+        }
+        drawIdToModeTracker[drawId] = undefined;
+        dirtyModeKeyDrawIds.delete(drawId);
         stats.totalDraws--;
         stats.geometryBytes = arenaBytes(arena);
+        // GC the bucket if it just emptied (common after reactive
+        // PS rebucket leaves the source bucket with zero live ROs).
+        gcBucket(bucket);
     }
     // ─── Aset reader (pull-driven on each frame) ──────────────────────
     let asetReader;
@@ -2345,6 +1622,114 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
         let totalDirtyBytes = 0;
         sceneObj.evaluateAlways(token, (tok) => {
             drainAsetWith(tok);
+            // 0. Reactive rebucket: any RO whose PipelineState modeKey
+            //    changed since last frame moves to its new bucket.
+            //    `dirtyModeKeyDrawIds` was populated by ModeKeyTracker's
+            //    onDirty callbacks (one per leaf aval per RO). Calling
+            //    `recompute()` here re-snapshots the descriptor and tells
+            //    us whether the modeKey actually changed (vs the aval just
+            //    being marked-but-equal). If the key changed, we remove +
+            //    re-add the RO via the retained spec; addDraw routes it to
+            //    the correct (new) bucket via the value-keyed lookup.
+            if (dirtyModeKeyDrawIds.size > 0) {
+                const dirty = [...dirtyModeKeyDrawIds];
+                dirtyModeKeyDrawIds.clear();
+                // Bucket-level fast path: group dirty drawIds by bucket. If
+                // ALL of a bucket's ROs are dirty (typical SG case where one
+                // shared aval drives every leaf — e.g. <Sg CullMode={cullC}>
+                // wrapping 20k leaves), the whole bucket transitions together.
+                // Rebuild the bucket's pipeline + rename in bucketByKey,
+                // O(1) work instead of N remove+add cycles.
+                const byBucket = new Map();
+                for (const drawId of dirty) {
+                    const b = drawIdToBucket[drawId];
+                    if (b === undefined)
+                        continue; // RO removed since mark
+                    let arr = byBucket.get(b);
+                    if (arr === undefined) {
+                        arr = [];
+                        byBucket.set(b, arr);
+                    }
+                    arr.push(drawId);
+                }
+                for (const [bucket, ids] of byBucket) {
+                    // First recompute every dirty tracker so .modeKey is fresh.
+                    // Filter out ones whose value didn't actually change.
+                    const changed = [];
+                    for (const drawId of ids) {
+                        const tracker = drawIdToModeTracker[drawId];
+                        if (tracker === undefined)
+                            continue;
+                        const oldKey = tracker.modeKey;
+                        if (!tracker.recompute())
+                            continue;
+                        if (tracker.modeKey === oldKey)
+                            continue;
+                        changed.push(drawId);
+                    }
+                    if (changed.length === 0)
+                        continue;
+                    // Try the all-together fast path.
+                    const wholeBucket = changed.length === bucket.drawSlots.size;
+                    if (wholeBucket) {
+                        const repId = changed[0];
+                        const repTracker = drawIdToModeTracker[repId];
+                        const newKey = repTracker.modeKey;
+                        // Compute the new bucketByKey string; we need the family.
+                        const sample = drawIdToSpec[repId];
+                        const fam = familyFor(sample.effect);
+                        const newBk = `family#${fam.schema.id}|mk#${newKey.toString(16)}`;
+                        const existing = bucketByKey.get(newBk);
+                        if (existing === undefined) {
+                            // No conflict — rename + rebuild pipeline in place.
+                            // Find this bucket's current key by linear scan
+                            // (buckets ≤ ~100 typically, so this is cheap).
+                            let oldBk;
+                            for (const [k, v] of bucketByKey) {
+                                if (v === bucket) {
+                                    oldBk = k;
+                                    break;
+                                }
+                            }
+                            if (oldBk !== undefined)
+                                bucketByKey.delete(oldBk);
+                            bucketByKey.set(newBk, bucket);
+                            // Build the new pipeline with the snapshotted PS.
+                            const desc = repTracker.descriptor;
+                            const { pipelineLayout } = getBgl(bucket.layout, bucket.isAtlasBucket);
+                            const newPipeline = device.createRenderPipeline({
+                                label: `heapScene/${newBk}/pipeline`,
+                                layout: pipelineLayout,
+                                vertex: { module: familyFor(sample.effect).vsModule, entryPoint: familyFor(sample.effect).vsEntryName, buffers: [] },
+                                fragment: { module: familyFor(sample.effect).fsModule, entryPoint: familyFor(sample.effect).fsEntryName, targets: colorTargets },
+                                primitive: { topology: desc.topology, cullMode: desc.cullMode, frontFace: desc.frontFace },
+                                ...(depthFormat !== undefined && desc.depth !== undefined
+                                    ? { depthStencil: { format: depthFormat, depthWriteEnabled: desc.depth.write, depthCompare: desc.depth.compare } }
+                                    : depthFormat !== undefined
+                                        ? { depthStencil: { format: depthFormat, depthWriteEnabled: false, depthCompare: "always" } }
+                                        : {}),
+                            });
+                            // Swap pipeline reference on the bucket's single slot.
+                            // (Multi-slot Phase 5c would update one slot at a time.)
+                            bucket.slots[0].pipeline = newPipeline;
+                            continue; // done with this bucket
+                        }
+                        // Conflict: another bucket already owns newBk. Fall through
+                        // to per-RO rebucket below, which will merge into `existing`.
+                    }
+                    // Slow path — per-RO rebucket (used when partial transition
+                    // OR when a merge with an existing destination bucket is
+                    // required).
+                    for (const drawId of changed) {
+                        const spec = drawIdToSpec[drawId];
+                        if (spec === undefined)
+                            continue;
+                        removeDraw(drawId);
+                        const newId = addDrawImpl(spec, tok);
+                        void newId;
+                    }
+                }
+            }
             // 1. Pool: re-pack any aval whose value changed since last frame.
             //    One writeBuffer per dirty aval, regardless of how many draws
             //    reference it — sharing pays off here.
@@ -2441,11 +1826,11 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
                 bucket.headerDirtyMin = Infinity;
                 bucket.headerDirtyMax = 0;
             }
-            if (bucket.drawTableDirtyMax > bucket.drawTableDirtyMin) {
-                const shadow = bucket.drawTableShadow;
-                device.queue.writeBuffer(bucket.drawTableBuf.buffer, bucket.drawTableDirtyMin, shadow.buffer, shadow.byteOffset + bucket.drawTableDirtyMin, bucket.drawTableDirtyMax - bucket.drawTableDirtyMin);
-                bucket.drawTableDirtyMin = Infinity;
-                bucket.drawTableDirtyMax = 0;
+            if (bucket.slots[0].drawTableDirtyMax > bucket.slots[0].drawTableDirtyMin) {
+                const shadow = bucket.slots[0].drawTableShadow;
+                device.queue.writeBuffer(bucket.slots[0].drawTableBuf.buffer, bucket.slots[0].drawTableDirtyMin, shadow.buffer, shadow.byteOffset + bucket.slots[0].drawTableDirtyMin, bucket.slots[0].drawTableDirtyMax - bucket.slots[0].drawTableDirtyMin);
+                bucket.slots[0].drawTableDirtyMin = Infinity;
+                bucket.slots[0].drawTableDirtyMax = 0;
             }
         }
     }
@@ -2461,9 +1846,9 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
                 pass.setBindGroup(0, b.bindGroup);
                 curBg = b.bindGroup;
             }
-            pass.setPipeline(b.pipeline);
-            if (b.recordCount > 0)
-                pass.drawIndirect(b.indirectBuf, 0);
+            pass.setPipeline(b.slots[0].pipeline);
+            if (b.slots[0].recordCount > 0)
+                pass.drawIndirect(b.slots[0].indirectBuf, 0);
         }
     }
     /**
@@ -2505,7 +1890,7 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
         }
         let anyDirty = false;
         for (const b of buckets) {
-            if (b.scanDirty) {
+            if (b.slots[0].scanDirty) {
                 anyDirty = true;
                 break;
             }
@@ -2514,17 +1899,17 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             return;
         const pass = enc.beginComputePass({ label: "heapScene/scan" });
         for (const b of buckets) {
-            if (!b.scanDirty)
+            if (!b.slots[0].scanDirty)
                 continue;
             // Rebuild render bind group if recordCount changed — its
             // drawTable binding is sized to recordCount * 16.
-            if (b.renderBoundRecordCount !== b.recordCount) {
+            if (b.slots[0].renderBoundRecordCount !== b.slots[0].recordCount) {
                 b.bindGroup = buildBucketBindGroup(b);
             }
-            const numRecords = b.recordCount;
+            const numRecords = b.slots[0].recordCount;
             const numBlocks = Math.max(1, Math.ceil(numRecords / SCAN_TILE_SIZE));
-            device.queue.writeBuffer(b.paramsBuf, 0, new Uint32Array([numRecords, numBlocks, 0, 0]));
-            pass.setBindGroup(0, b.scanBindGroup);
+            device.queue.writeBuffer(b.slots[0].paramsBuf, 0, new Uint32Array([numRecords, numBlocks, 0, 0]));
+            pass.setBindGroup(0, b.slots[0].scanBindGroup);
             pass.setPipeline(scanPipeTile);
             pass.dispatchWorkgroups(numBlocks, 1, 1);
             pass.setPipeline(scanPipeBlocks);
@@ -2535,11 +1920,11 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             // must cover the worst-case totalEmit. Each WG handles WG_SIZE
             // tiles; +1 for the sentinel slot.
             const SCAN_WG_SIZE = 256;
-            const numTilesCap = Math.max(1, Math.ceil(b.totalEmitEstimate / TILE_K));
+            const numTilesCap = Math.max(1, Math.ceil(b.slots[0].totalEmitEstimate / TILE_K));
             const tileWgs = Math.max(1, Math.ceil((numTilesCap + 1) / SCAN_WG_SIZE));
             pass.setPipeline(scanPipeBuildTileIndex);
             pass.dispatchWorkgroups(tileWgs, 1, 1);
-            b.scanDirty = false;
+            b.slots[0].scanDirty = false;
         }
         pass.end();
     }
@@ -2572,29 +1957,53 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
         pass.end();
         device.queue.submit([enc.finish()]);
     }
+    function destroyBucketResources(b) {
+        b.drawHeap.destroy();
+        for (const slot of b.slots) {
+            slot.drawTableBuf?.destroy();
+            slot.blockSumsBuf?.destroy();
+            slot.blockOffsetsBuf?.destroy();
+            slot.firstDrawInTileBuf?.destroy();
+            slot.indirectBuf?.destroy();
+            slot.paramsBuf?.destroy();
+        }
+    }
+    /**
+     * Remove an empty bucket from the scene's bucket list + key index +
+     * destroy its GPU resources. Called from removeDraw when an RO's
+     * removal leaves the bucket with zero live slots — common after
+     * reactive PS rebucket leaves the source bucket empty.
+     */
+    function gcBucket(b) {
+        if (b.drawSlots.size !== 0)
+            return;
+        const idx = buckets.indexOf(b);
+        if (idx >= 0)
+            buckets.splice(idx, 1);
+        for (const [k, v] of bucketByKey) {
+            if (v === b) {
+                bucketByKey.delete(k);
+                break;
+            }
+        }
+        destroyBucketResources(b);
+    }
     function dispose() {
         arena.attrs.destroy();
         arena.indices.destroy();
-        for (const b of buckets) {
-            b.drawHeap.destroy();
-            b.drawTableBuf?.destroy();
-            b.blockSumsBuf?.destroy();
-            b.blockOffsetsBuf?.destroy();
-            b.firstDrawInTileBuf?.destroy();
-            b.indirectBuf?.destroy();
-            b.paramsBuf?.destroy();
-        }
+        for (const b of buckets)
+            destroyBucketResources(b);
     }
     // Test-only escape hatch for inspecting megacall bucket state. Not
     // part of the public API surface — keep cast at use-site.
     const _debug = {
         bucketsForTest() {
             return buckets.map(b => ({
-                indirectBuf: b.indirectBuf,
-                drawTableBuf: b.drawTableBuf?.buffer,
-                firstDrawInTileBuf: b.firstDrawInTileBuf?.buffer,
-                totalEmitEstimate: b.totalEmitEstimate,
-                recordCount: b.recordCount,
+                indirectBuf: b.slots[0].indirectBuf,
+                drawTableBuf: b.slots[0].drawTableBuf?.buffer,
+                firstDrawInTileBuf: b.slots[0].firstDrawInTileBuf?.buffer,
+                totalEmitEstimate: b.slots[0].totalEmitEstimate,
+                recordCount: b.slots[0].recordCount,
                 layout: b.layout,
             }));
         },
@@ -2639,19 +2048,19 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             const TILE_K_LOCAL = 64;
             const dcs = [];
             for (const b of buckets) {
-                const dhSize = Math.min(b.drawHeap.buffer.size, b.recordCount * b.layout.drawHeaderBytes);
+                const dhSize = Math.min(b.drawHeap.buffer.size, b.slots[0].recordCount * b.layout.drawHeaderBytes);
                 if (dhSize === 0)
                     continue;
                 const dh = stage(b.drawHeap.buffer, dhSize);
-                const dt = b.drawTableBuf !== undefined && b.recordCount > 0
-                    ? stage(b.drawTableBuf.buffer, b.recordCount * RECORD_BYTES)
+                const dt = b.slots[0].drawTableBuf !== undefined && b.slots[0].recordCount > 0
+                    ? stage(b.slots[0].drawTableBuf.buffer, b.slots[0].recordCount * RECORD_BYTES)
                     : undefined;
-                const totalEmit = b.totalEmitEstimate;
+                const totalEmit = b.slots[0].totalEmitEstimate;
                 const numTiles = totalEmit > 0 ? Math.ceil(totalEmit / TILE_K_LOCAL) : 0;
-                const fdt = b.firstDrawInTileBuf !== undefined && numTiles > 0
-                    ? stage(b.firstDrawInTileBuf.buffer, Math.min(b.firstDrawInTileBuf.buffer.size, (numTiles + 1) * 4))
+                const fdt = b.slots[0].firstDrawInTileBuf !== undefined && numTiles > 0
+                    ? stage(b.slots[0].firstDrawInTileBuf.buffer, Math.min(b.slots[0].firstDrawInTileBuf.buffer.size, (numTiles + 1) * 4))
                     : undefined;
-                const ind = b.indirectBuf !== undefined ? stage(b.indirectBuf, 16) : undefined;
+                const ind = b.slots[0].indirectBuf !== undefined ? stage(b.slots[0].indirectBuf, 16) : undefined;
                 dcs.push({
                     bucket: b, drawHeap: dh, numTiles,
                     ...(dt !== undefined ? { drawTable: dt } : {}),
@@ -2684,7 +2093,7 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             for (const dc of dcs) {
                 const u32 = new Uint32Array(dc.drawHeap.getMappedRange());
                 const stride = dc.bucket.layout.drawHeaderBytes;
-                const recordCount = dc.bucket.recordCount;
+                const recordCount = dc.bucket.slots[0].recordCount;
                 for (let slot = 0; slot < recordCount; slot++) {
                     const slotOff = slot * stride;
                     for (const f of dc.bucket.layout.drawHeaderFields) {
@@ -2836,7 +2245,7 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
                 // ── 6. indirect[0] (totalEmit) must match CPU prefix sum.
                 if (dc.indirect !== undefined) {
                     const ind = new Uint32Array(dc.indirect.getMappedRange());
-                    const expectedTotal = dc.bucket.totalEmitEstimate;
+                    const expectedTotal = dc.bucket.slots[0].totalEmitEstimate;
                     const got = ind[0];
                     if (got !== expectedTotal) {
                         push(`bucket#${bucketIdx} indirect[0]=${got} ≠ expected totalEmit=${expectedTotal}`);
@@ -2926,11 +2335,11 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             const indicesCopy = indicesSize > 0 ? stage(arena.indices.buffer, indicesSize) : undefined;
             const dcs = [];
             for (const b of buckets) {
-                if (b.recordCount === 0 || b.totalEmitEstimate === 0)
+                if (b.slots[0].recordCount === 0 || b.slots[0].totalEmitEstimate === 0)
                     continue;
-                const dh = stage(b.drawHeap.buffer, Math.min(b.drawHeap.buffer.size, b.recordCount * b.layout.drawHeaderBytes));
-                const dt = stage(b.drawTableBuf.buffer, b.recordCount * RECORD_BYTES);
-                dcs.push({ bucket: b, drawHeap: dh, drawTable: dt, firstEmit: [], totalEmit: b.totalEmitEstimate });
+                const dh = stage(b.drawHeap.buffer, Math.min(b.drawHeap.buffer.size, b.slots[0].recordCount * b.layout.drawHeaderBytes));
+                const dt = stage(b.slots[0].drawTableBuf.buffer, b.slots[0].recordCount * RECORD_BYTES);
+                dcs.push({ bucket: b, drawHeap: dh, drawTable: dt, firstEmit: [], totalEmit: b.slots[0].totalEmitEstimate });
             }
             device.queue.submit([enc.finish()]);
             await arenaCopy.mapAsync(GPUMapMode.READ);
@@ -2954,7 +2363,7 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
                 const dt = new Uint32Array(dc.drawTable.getMappedRange());
                 bucketDt.push(dt);
                 bucketHdr.push(new Uint32Array(dc.drawHeap.getMappedRange()));
-                for (let r = 0; r < dc.bucket.recordCount; r++) {
+                for (let r = 0; r < dc.bucket.slots[0].recordCount; r++) {
                     dc.firstEmit.push(dt[r * RECORD_U32 + 0]);
                 }
                 bucketCumEmit.push(totalEmitGlobal);
@@ -3003,7 +2412,7 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
                 }
                 emitsChecked++;
                 // Binary search for slot.
-                const recCount = dc.bucket.recordCount;
+                const recCount = dc.bucket.slots[0].recordCount;
                 let lo = 0, hi = recCount - 1;
                 while (lo < hi) {
                     const mid = (lo + hi + 1) >>> 1;
@@ -3199,12 +2608,12 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
                 ? new Uint32Array(indicesCopy.getMappedRange())
                 : new Uint32Array(0);
             for (const target of buckets) {
-                if (target.recordCount === 0 || target.totalEmitEstimate === 0) {
+                if (target.slots[0].recordCount === 0 || target.slots[0].totalEmitEstimate === 0) {
                     bucketIdx++;
                     continue;
                 }
-                const recordCount = target.recordCount;
-                const totalEmit = target.totalEmitEstimate;
+                const recordCount = target.slots[0].recordCount;
+                const totalEmit = target.slots[0].totalEmitEstimate;
                 const totalTris = Math.floor(totalEmit / 3);
                 const remainder = totalEmit % 3;
                 if (remainder !== 0) {
@@ -3221,7 +2630,7 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
                     usage: GPUBufferUsage.COPY_DST | GPUBufferUsage.MAP_READ,
                 });
                 const enc0 = device.createCommandEncoder({ label: "checkTriangleCoherence.dt" });
-                enc0.copyBufferToBuffer(target.drawTableBuf.buffer, 0, dtCopy, 0, recordCount * RECORD_BYTES);
+                enc0.copyBufferToBuffer(target.slots[0].drawTableBuf.buffer, 0, dtCopy, 0, recordCount * RECORD_BYTES);
                 enc0.copyBufferToBuffer(target.drawHeap.buffer, 0, dhCopy, 0, recordCount * target.layout.drawHeaderBytes);
                 device.queue.submit([enc0.finish()]);
                 await dtCopy.mapAsync(GPUMapMode.READ);
@@ -3270,7 +2679,7 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
                 });
                 {
                     const enc1 = device.createCommandEncoder();
-                    enc1.copyBufferToBuffer(target.firstDrawInTileBuf.buffer, 0, fdtCopy, 0, fdtSize);
+                    enc1.copyBufferToBuffer(target.slots[0].firstDrawInTileBuf.buffer, 0, fdtCopy, 0, fdtSize);
                     device.queue.submit([enc1.finish()]);
                     await fdtCopy.mapAsync(GPUMapMode.READ);
                 }
@@ -3425,12 +2834,12 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             // own bytes).
             bucketIdx = 0;
             for (const target of buckets) {
-                if (target.recordCount === 0) {
+                if (target.slots[0].recordCount === 0) {
                     bucketIdx++;
                     continue;
                 }
                 // Re-stage drawHeap for this bucket.
-                const dhBytes = target.recordCount * target.layout.drawHeaderBytes;
+                const dhBytes = target.slots[0].recordCount * target.layout.drawHeaderBytes;
                 const dhCopy = device.createBuffer({
                     size: dhBytes, usage: GPUBufferUsage.COPY_DST | GPUBufferUsage.MAP_READ,
                 });
@@ -3440,7 +2849,7 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
                 await dhCopy.mapAsync(GPUMapMode.READ);
                 const dhU32 = new Uint32Array(dhCopy.getMappedRange());
                 const stride2 = target.layout.drawHeaderBytes;
-                for (let slot = 0; slot < target.recordCount; slot++) {
+                for (let slot = 0; slot < target.slots[0].recordCount; slot++) {
                     for (const f of target.layout.drawHeaderFields) {
                         if (f.kind !== "uniform-ref" && f.kind !== "attribute-ref")
                             continue;
@@ -3500,11 +2909,11 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             let gpuMismatches = 0;
             const push = (s) => { if (issues.length < 30)
                 issues.push(s); };
-            const target = buckets.find(b => b.recordCount > 0 && b.totalEmitEstimate > 0);
+            const target = buckets.find(b => b.slots[0].recordCount > 0 && b.slots[0].totalEmitEstimate > 0);
             if (target === undefined)
                 return { emitsChecked: 0, gpuMismatches: 0, issues };
-            const recordCount = target.recordCount;
-            const totalEmit = target.totalEmitEstimate;
+            const recordCount = target.slots[0].recordCount;
+            const totalEmit = target.slots[0].totalEmitEstimate;
             const sampleCount = Math.min(samples, totalEmit);
             const stride = Math.max(1, Math.floor(totalEmit / sampleCount));
             // CPU's firstEmit is GPU-computed — must read it back from the
@@ -3517,7 +2926,7 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             });
             {
                 const enc0 = device.createCommandEncoder({ label: "probeBinarySearch.dtCopy" });
-                enc0.copyBufferToBuffer(target.drawTableBuf.buffer, 0, dtCopy, 0, recordCount * RECORD_BYTES);
+                enc0.copyBufferToBuffer(target.slots[0].drawTableBuf.buffer, 0, dtCopy, 0, recordCount * RECORD_BYTES);
                 device.queue.submit([enc0.finish()]);
                 await dtCopy.mapAsync(GPUMapMode.READ);
             }
@@ -3621,8 +3030,8 @@ export function buildHeapScene(device, sig, initialDraws, opts = {}) {
             const bg = device.createBindGroup({
                 layout: bgl,
                 entries: [
-                    { binding: 0, resource: { buffer: target.drawTableBuf.buffer } },
-                    { binding: 1, resource: { buffer: target.firstDrawInTileBuf.buffer } },
+                    { binding: 0, resource: { buffer: target.slots[0].drawTableBuf.buffer } },
+                    { binding: 1, resource: { buffer: target.slots[0].firstDrawInTileBuf.buffer } },
                     { binding: 2, resource: { buffer: sampleBuf } },
                     { binding: 3, resource: { buffer: arena.indices.buffer } },
                     { binding: 4, resource: { buffer: outBuf } },