diff --git a/AGENTS.md b/AGENTS.md
index 275cf09f..5e8f73a8 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -40,7 +40,7 @@ Strategies are ordered cheapest → most expensive. The mesher's job is to maxim
 
 Callers can opt out of specific strategies via `strategies: { disable: ["b" | "i" | "u"] }` on `RenderTextureAtlasOptions`. Disabled or unsupported strategies fall through the chain (`b → i → s`, `u → i → s`, `i → s`). `<s>` is the universal fallback and cannot be disabled.
 
-The `.vox` fast path emits plain `<b>` elements directly inside the mesh wrapper. They intentionally reuse the cheap quad tag, but they are exact voxel quads on a canonical 1px primitive with one `matrix3d(...)` per visible quad, ordered by projected tile4 scanline order.
+The `.vox` fast path emits plain `<b>` elements directly inside the mesh wrapper. They intentionally reuse the cheap quad tag, but they are exact voxel quads with one `matrix3d(...)` per visible quad, ordered by projected tile4 scanline order. Desktop-class documents use a canonical 1px primitive for the cheapest transform shape; mobile-class documents (`pointer: coarse` or `hover: none`) use an 8px primitive and divide the in-plane matrix scale by 8 to preserve identical CSS-space geometry while avoiding large GPU filtering gaps.
 
 ### Lighting modes (`PolyTextureLightingMode = "baked" | "dynamic"`)
 
diff --git a/bench/NON_VOXEL_ROTATION_HYPOTHESES.md b/bench/NON_VOXEL_ROTATION_HYPOTHESES.md
new file mode 100644
index 00000000..f5c8181f
--- /dev/null
+++ b/bench/NON_VOXEL_ROTATION_HYPOTHESES.md
@@ -0,0 +1,151 @@
+# Non-Voxel Rotation Hypotheses
+
+Actionable ledger for non-voxel rotation performance work. This tracks
+bench-only experiments first; product renderer changes need visual validation
+and API/cross-package review before they move out of `bench/`.
+
+## Corpus
+
+The first pass uses eight representative non-voxel models:
+
+| ID | Model | Why it is in the set |
+| --- | --- | --- |
+| `chicken` | OBJ + MTL | Small flat-color mesh, mostly merged quads. |
+| `rock1` | OBJ + MTL | Small UV-textured atlas-heavy mesh. |
+| `saucer` | OBJ | Larger untextured rotation stress case. |
+| `teapot` | OBJ | Smooth curved solid mesh with many quads. |
+| `ducky` | GLB | Small GLB with many solid triangles. |
+| `elephant` | GLB | Organic low-poly shape. |
+| `policecar` | GLB | Mechanical rectilinear shape. |
+| `bicycle` | GLB | Thin separated geometry with many parts. |
+
+Run the corpus with:
+
+```sh
+node bench/nonvoxel-rotation-bench.mjs
+```
+
+Use targeted variants while iterating:
+
+```sh
+node bench/nonvoxel-rotation-bench.mjs \
+  --models teapot,bicycle,elephant,policecar \
+  --variants baseline,force-atlas,no-stable-tri,order-tile4,no-will-change \
+  --warmup 2000 --sample 3000 \
+  --run-order round-robin \
+  --json bench/results/nonvoxel-rotation-a2-confirm.json
+```
+
+Use frame buckets when whole-run p95 is ambiguous:
+
+```sh
+node bench/nonvoxel-frame-buckets.mjs \
+  --mesh glb:Elephant.glb \
+  --variant baseline \
+  --warmup 2000 \
+  --sample 5000 \
+  --no-trace \
+  --label nonvoxel-buckets-elephant-baseline
+```
+
+Check visual parity before treating transform-topology variants as candidates:
+
+```sh
+node bench/nonvoxel-visual-compare.mjs \
+  --mode baked \
+  --models bicycle,elephant,policecar \
+  --variants scene-split-target,scene-host-perspective,scene-transform-perspective,no-will-change,scene-matrix3d \
+  --json bench/results/nonvoxel-visual-a12-baked-transform-topology.json
+```
+
+## Current Read
+
+- Current active scope is baked rotation. Dynamic-mode probes remain in the
+  history below, but they are paused while the baked path is being isolated.
+- Do not generalize voxel DOM-order wins directly to non-voxel meshes. The
+  corrected post-render DOM-order probes preserve tag counts, and Tile4 still
+  regresses or flattens on most non-voxel meshes under interleaved repeats.
+- Force-atlas is rejected as a general rotation optimization. A short-window
+  Teapot win disappeared with a normal warmup; confirmed runs lose on Teapot,
+  Bicycle, Elephant, and Policecar.
+- Disabling stable CSS triangles is not a broad win. Short Bicycle movement
+  flattened under longer confirmation; Teapot regressed and Elephant/Policecar
+  were flat.
+- Removing scene `will-change` is mixed/flat, matching the voxel conclusion
+  that root transform flags are not the missing browser path.
+- Baked transform-topology probes produced large p95 wins only when they
+  changed projection. `split-target`, `host-perspective`, and
+  `transform-perspective` fail static visual parity on GLBs and are invalid as
+  optimization candidates in their current form.
+- The visual-safe transform variants (`matrix3d`, `no-will-change`) are not
+  broad wins. A full eight-model baked random run rejected them: Saucer
+  regressed hard, Teapot/Bicycle/Rock/Ducky/Elephant were flat, and Policecar
+  was seed/bucket sensitive.
+- Fixed-size baked leaf buckets are visually safe but not broad. They regress
+  Saucer, flatten Bicycle/Elephant/Policecar, and produce a repeatable Teapot
+  win. Treat that as a targeted clue about dense curved solid meshes, not a
+  default renderer change.
+- CSS keyframe rotation remains an auto-rotate-only probe. It can change p50 in
+  short windows, but p95 does not consistently improve for interactive-style
+  rotation comparisons.
+- Older `polygonOrder` results changed render planning as well as DOM order,
+  because basis-hint selection depends on polygon array order. The runner now
+  uses `domOrder` for order variants so strategy tag counts stay stable.
+- The next useful work is lower-level attribution for the remaining slow
+  baked buckets, not more broad strategy toggles. Whole-run p95 alone is too
+  noisy near cadence thresholds.
+
+## Measurement Notes
+
+- Generic gallery meshes now support `glb:path`, `obj:path`, and `vox:path`.
+  Numeric URL params use explicit fallback parsing; older direct generic-mesh
+  runs before this fix are invalid if they omitted `zoom`, `targetSize`,
+  `rotX`, or `rotY`.
+- The new non-voxel scripts also use explicit numeric fallback parsing. Missing
+  `--warmup` and `--sample` now resolve to the documented defaults instead of
+  `0`.
+- `nonvoxel-rotation-bench.mjs` supports `--run-order grouped|round-robin|random`
+  and `--seed`. Use `round-robin` or `random` for any near-threshold comparison;
+  grouped runs are only for quick triage.
+- `nonvoxel-frame-buckets.mjs --no-trace` is the least perturbing cadence
+  view. Trace mode is still useful for event attribution, but it changed the
+  cadence enough in early Elephant runs that no-trace bucket counts should be
+  checked first.
+- `nonvoxel-visual-compare.mjs` compares static baked screenshots against the
+  baseline with the FPS overlay hidden. Treat any performance win that fails
+  this parity gate as invalid until the transform math is made equivalent.
+
+## Experiments
+
+| ID | Status | Hypothesis | Result | Next |
+| --- | --- | --- | --- | --- |
+| NV-A1 | Tested | Voxel-inspired variants may produce immediate non-voxel rotation wins. | Short 8-model pass (`700ms` warmup, `1500ms` sample) found apparent wins, but also obvious counterexamples: Tile4 order hurt Chicken/Rock, force-atlas hurt most models, and Teapot force-atlas was likely an atlas warmup artifact. Results in `bench/results/nonvoxel-rotation-a1-short.json`. | Treat only as a triage pass. Confirm any large signal with normal warmup. |
+| NV-A2 | Rejected | Force-atlas, no-stable-triangle, Tile4 order, or no-will-change are broad wins. | Normal-warmup confirmation on Teapot/Bicycle/Elephant/Policecar rejected force-atlas hard (`-37%` to `-40%` on GLBs, `-10%` on Teapot). No-stable-triangle and no-will-change were flat/mixed. Tile4 was flat except a one-run Elephant p95 bump. Results in `bench/results/nonvoxel-rotation-a2-confirm.json`. | Keep strategy toggles as diagnostics, not product candidates. |
+| NV-A3 | Flat | Elephant Tile4 order is a real organic-mesh ordering win. | Three repeats at `2000ms` warmup / `5000ms` sample flattened p95 (`23.9 -> 24.0 fps`) but improved median p99 tail (`58.3 -> 50.0ms`). Results in `bench/results/nonvoxel-rotation-a3-elephant-order.json`. | Reopen order only with frame-bucket evidence showing a repeatable tail reduction without p95 loss. |
+| NV-A4 | Tested | Frame buckets can explain the Elephant Tile4 p99 tail. | Added `bench/nonvoxel-frame-buckets.mjs`. No-trace baked Elephant baseline had 616 leaves (`b/i/s/u/q=445/0/1/170/0`) with `x4_plus:47`, `dt p95=83.5ms`; Tile4 had the same tag mix with `x4_plus:41`, but `dt p95=100.2ms`. Results in `bench/results/nonvoxel-buckets-elephant-*-a6-notrace-fixed-defaults.json`. | Tile4 is not a clean Elephant win. Use buckets to find slow cadence classes before adding new variants. |
+| NV-A5 | Rejected | Dynamic mode changes the winner set for GLB strategy/order probes. | Single-run dynamic GLBs showed large apparent wins, but three repeats rejected them: Bicycle Tile4 was flat and no-stable/no-will-change were `-19%`; Elephant and Policecar were flat within about `1%`. Results in `bench/results/nonvoxel-rotation-dynamic-a2-glb-repeats.json`. | Do not ship dynamic-specific strategy toggles from this signal. |
+| NV-A6 | Inconclusive | Teapot dynamic Tile4/no-stable/no-will-change are real wins. | Three repeats showed `+17%` to `+19%` p95, but an order-sanity run produced baseline p95 values from `10.8` to `23.4` fps in the same process while identical-tag `no-will-change` was also positive. Results in `bench/results/nonvoxel-rotation-dynamic-a3-teapot-repeats.json` and `bench/results/nonvoxel-rotation-dynamic-a4-teapot-order-sanity.json`. | Add randomized/interleaved order or frame-bucket attribution before using Teapot dynamic p95 for decisions. |
+| NV-A7 | Fixed | Ordering probes should test DOM order, not render-planning order. | Added dedicated `nonvoxel-vanilla.html` with `domOrder` and moved runner order variants to post-render DOM reordering, leaving the shared `perf-vanilla.html` clean. Teapot smoke confirmed Tile4 now keeps baseline tags (`3071/0/40/10/0`). Results in `bench/results/nonvoxel-rotation-smoke-dom-order.json`. | Treat earlier `polygonOrder` results as diagnostic only; use corrected `domOrder` results for decisions. |
+| NV-A8 | Rejected | Corrected Teapot dynamic Tile4 is a stable win. | Round-robin corrected Tile4 showed `+11%` p95 with identical tags, but deterministic random ordering flattened Tile4 to `-0.3%`. `no-stable-tri` and `no-will-change` also failed randomized confirmation. Results in `bench/results/nonvoxel-rotation-dynamic-a7-teapot-domorder-round-robin.json` and `bench/results/nonvoxel-rotation-dynamic-a8-teapot-domorder-random.json`. | Do not move Tile4 into product from Teapot dynamic alone. |
+| NV-A9 | Mostly rejected | Corrected Tile4 DOM order helps representative GLBs. | Baked/dynamic GLB pass with identical tags rejected Tile4 on Bicycle, flattened Elephant, and only showed a one-pass Policecar baked bump. Results in `bench/results/nonvoxel-rotation-a9-glb-domorder-both.json`. | Check any isolated positive with randomized repeats and buckets. |
+| NV-A10 | Rejected | Policecar baked Tile4 is a stable corrected DOM-order win. | A no-trace bucket pair showed fewer very slow frames for Tile4, but randomized five-repeat rotation flattened to `+0.6%` p95 with identical tags. Results in `bench/results/nonvoxel-buckets-policecar-baked-*-a10-domorder.json` and `bench/results/nonvoxel-rotation-a11-policecar-baked-domorder-random.json`. | Leave Tile4 as a diagnostic variant, not a product rule. |
+| NV-A11 | Invalid | Baked scene transform topology can improve GLB rotation without changing DOM leaves. | `split-target`, `host-perspective`, and `transform-perspective` gave large p95 wins on Bicycle/Elephant/Policecar with identical tag counts, but static visual parity failed badly (`meanDelta` about `0.04-0.09`, `24-48%` changed pixels). `matrix3d` and `no-will-change` passed visual parity. Results in `bench/results/nonvoxel-rotation-a12-baked-transform-topology.json` and `bench/results/nonvoxel-visual-a12-baked-transform-topology.json`. | Do not use projection-changing topology variants as candidates until equivalence is proven. |
+| NV-A12 | Rejected | Visual-safe baked topology variants are broad wins. | Five-repeat random on Teapot/Bicycle/Elephant/Policecar showed `matrix3d` flat except one Policecar run and `no-will-change` positive on Elephant/Policecar, but three-run no-trace buckets showed Policecar was cadence-noisy. A full eight-model random pass then rejected both broadly: Chicken `-2%`, Saucer `-12%` to `-19%`, Teapot/Bicycle/Rock/Ducky/Elephant flat, Policecar `matrix3d +0.9%` and `no-will-change -22.8%`. Results in `bench/results/nonvoxel-rotation-a13-baked-visual-safe-topology-random.json`, `bench/results/nonvoxel-buckets-*-a14-visualsafe.json`, and `bench/results/nonvoxel-rotation-a16-baked-visual-safe-full-corpus-random.json`. | Leave `matrix3d` and `no-will-change` as diagnostics, not defaults. |
+| NV-A13 | Tested | Trace can explain the Elephant `no-will-change` no-trace p95 bump. | No-trace buckets showed Elephant baseline at `20.0-20.2 fps` p95 with `x4_plus=61-66`, and `no-will-change` at `24.0 fps` with `x4_plus=54-58`; however trace mode flattened both variants back to about `20 fps` p95 with the same `x4_plus=69`. Results in `bench/results/nonvoxel-buckets-elephant-baked-*-a14-visualsafe.json` and `bench/results/nonvoxel-buckets-elephant-baked-*-a15-trace.json`. | Prefer no-trace cadence for decision-making; use trace only after a signal survives multiple seeds. |
+| NV-A14 | Mixed | Fixed-size baked leaf buckets improve compositor subtree shape without changing pixels. | Added `leafBucketSize` and `leaf-buckets-64/128/256`. Static visual parity passed with zero pixel delta on Saucer, Teapot, Bicycle, Elephant, and Policecar. Rotation was mixed: Saucer regressed (`-13%` to `-15%`), Bicycle/Elephant/Policecar were flat, and Teapot improved about `+12%`. Results in `bench/results/nonvoxel-visual-a17-baked-leaf-buckets.json` and `bench/results/nonvoxel-rotation-a18-baked-leaf-buckets-random.json`. | Not a broad default. Confirm Teapot separately before treating it as a mesh-class clue. |
+| NV-A15 | Confirmed narrow | Teapot's fixed leaf-bucket win is repeatable. | Teapot-only five-repeat random confirmed `leaf-buckets-64/128/256` at `+10.0%/+11.2%/+11.9%` p95. No-trace buckets show the same 3121 leaves and tags; `leaf-buckets-256` removes the rare `x4_plus` frame and shifts some frames from `x3` to `x2`, but does not help other representative meshes. Results in `bench/results/nonvoxel-rotation-a19-teapot-baked-leaf-buckets-random.json` and `bench/results/nonvoxel-buckets-teapot-baked-*-a20*.json`. | Investigate why dense solid curved quads react to shallow wrapper chunking; keep the variant bench-only. |
+
+## Candidate Next Tests
+
+1. Use `nonvoxel-frame-buckets.mjs --no-trace` on the remaining slow cases
+   first, then trace only the buckets that stay reproducible.
+2. Look for baked-only non-order hypotheses on the slow classes: per-normal
+   grouping shape, stable triangle vs atlas only on triangle-heavy meshes,
+   atlas/solid mixed scenes, and whether compositor cadence correlates with
+   leaf transform magnitude or projected depth span.
+3. For Teapot-like dense solid quad meshes, compare fixed leaf chunks against
+   normal/area/depth-preserving chunks to find whether the benefit is wrapper
+   count, local spatial coherence, or a Chrome scheduling threshold.
+4. Test active CSS keyframes only as an auto-rotate feature path, separate from
+   interactive camera rotation, because JS-scrubbed transform changes still
+   dirty the 3D subtree in the voxel probes.
diff --git a/bench/README.md b/bench/README.md
index 73f68da9..34803b38 100644
--- a/bench/README.md
+++ b/bench/README.md
@@ -20,6 +20,9 @@ pnpm bench:lossy            # compare lossless / previous lossy / auto lossy cou
 pnpm bench:visual           # screenshot diff against bench/baselines/*.png
 pnpm bench:visual --record  # capture new baselines (after intentional renderer changes)
 pnpm bench:build            # just rebuild the bench bundles (rarely needed alone)
+node bench/nonvoxel-rotation-bench.mjs  # non-voxel vanilla rotation probe
+node bench/nonvoxel-frame-buckets.mjs --no-trace  # non-voxel rAF cadence buckets
+node bench/nonvoxel-visual-compare.mjs  # non-voxel variant visual parity
 ```
 
 All scripts also work directly:
@@ -30,6 +33,9 @@ node bench/perf-bench.mjs --mesh chicken --renderer react,vue
 node bench/lossy-optimizer-bench.mjs --json bench/results/lossy-optimizer.json
 node bench/lossy-optimizer-bench.mjs --models ducky,shark,bicycle
 node bench/perf-visual.mjs --mesh chicken --tolerance 0.005
+node bench/nonvoxel-rotation-bench.mjs --models teapot,bicycle --variants baseline,order-tile4 --run-order round-robin
+node bench/nonvoxel-frame-buckets.mjs --mesh glb:Elephant.glb --variant baseline --no-trace
+node bench/nonvoxel-visual-compare.mjs --models bicycle,elephant,policecar --variants scene-split-target,scene-transform-perspective
 ```
 
 ---
@@ -53,6 +59,26 @@ For each scenario, the FPS sampler captures per-frame `dt` for 5 seconds
 after a 2-second warmup, then computes p50, p95, p99 frame times.
 Sampling lives in `perf-shared.mjs` so every page records identically.
 
+## Browser backend
+
+Headless Playwright can run the same DOM through different compositor
+backends. Perf-facing bench scripts default to the GPU lane by adding
+`--use-angle=metal` on macOS and `--enable-gpu-rasterization` for Chromium.
+The bundled browser can otherwise fall back to `SoftwareRenderer`, which is
+useful as a stress lane but can understate real Chrome GPU performance.
+
+Default GPU-path check:
+
+```sh
+node bench/perf-bench.mjs --mesh obj-house3 --renderer vanilla --scenario baked.camera_rotate
+```
+
+Run the old software/stress lane explicitly:
+
+```sh
+node bench/perf-bench.mjs --mesh obj-house3 --renderer vanilla --scenario baked.camera_rotate --software-backend
+```
+
 ---
 
 ## The four pages
@@ -89,7 +115,7 @@ The pages share a URL contract via `parseUrlParams()` in `perf-shared.mjs`:
 
 ```
 /perf-{html|vanilla|react|vue}.html
-  ?mesh=<id>      saucer|chicken|coliseum|castle|teapot|rock1|synth-Nk
+  ?mesh=<id>      saucer|chicken|coliseum|castle|teapot|rock1|synth-Nk|glb:path|obj:path|vox:path
   &mode=<m>       dynamic|baked    (textureLighting)
   &motion=<m>     light|rot|none   (light direction | camera rotY | idle)
   &az=<deg>       initial light azimuth (default 50)
@@ -102,6 +128,15 @@ preset, follow the existing shape — `url`, `mtlUrl?`, `options`,
 `synth-50k`) are generated in-browser by `synth-mesh.mjs` for stress
 tests above what the gallery's OBJs cover.
 
+`nonvoxel-vanilla.html` also accepts bench-only experiment params:
+`domOrder=source|initial-depth|tile4-screen|area-desc|area-asc|normal-z`,
+`polygonOrder=source|initial-depth|tile4-screen|area-desc|area-asc|normal-z`,
+`disableStrategies=b,i,u`, `leafBucketSize=64|128|256`,
+`rotationDriver=css-keyframes`, and
+`sceneTransformMode=default|matrix3d|split-target|host-perspective|transform-perspective|no-will-change`.
+Use `domOrder` for pure post-render DOM-order probes; `polygonOrder` changes
+the polygon array before render planning and is only for diagnostics.
+
 ---
 
 ## Files
@@ -113,6 +148,8 @@ bench/
                          createPerfRecorder() (FPS counter + window.__perf__)
   perf-html.html         declarative <poly-scene> + <poly-controls>
   perf-vanilla.html      imperative createPolyScene + createPolyOrbitControls
+  nonvoxel-vanilla.html  dedicated vanilla page for non-voxel experiments
+                         with strategy/order/transform diagnostics
   perf-react.html        loads polycss-react.js (JSX entry)
   perf-vue.html          loads polycss-vue.js (Vue entry)
   entries/
@@ -134,6 +171,16 @@ bench/
                          links the four perf-*.html with example params.
   perf-visual.mjs        Screenshot diff guardrail (chicken + rock1 ×
                          3 light azimuths, vanilla path only).
+  nonvoxel-rotation-bench.mjs
+                         Vanilla-only non-voxel rotation corpus runner.
+                         See NON_VOXEL_ROTATION_HYPOTHESES.md.
+  nonvoxel-frame-buckets.mjs
+                         Non-voxel vanilla rAF bucket profiler. Reports
+                         static leaf tag mix by cadence bucket, with optional
+                         Chromium trace attribution.
+  nonvoxel-visual-compare.mjs
+                         Static screenshot parity check for non-voxel bench
+                         variants against the baked baseline.
 
   baselines/             chicken-* / rock1-* PNGs the visual diff compares against.
   results/               (gitignored) per-run JSON output from bench scripts.
@@ -238,6 +285,12 @@ node bench/perf-bench.mjs \
   --chromium-arg "--enable-blink-features=CSSBorderShape"
 ```
 
+`nonvoxel-rotation-bench.mjs --json <path>` writes structured output without
+also dumping the full JSON to stdout. Add `--print-json` when you need both.
+Use `--run-order round-robin` or `--run-order random --seed <label>` for
+near-threshold comparisons so one variant does not own a warm/cold browser
+state band.
+
 ---
 
 ## How the visual guardrail works (`perf-visual.mjs`)
diff --git a/bench/VOXEL_FAST_PATH_HYPOTHESES.md b/bench/VOXEL_FAST_PATH_HYPOTHESES.md
index 765b8d80..05ddd7bd 100644
--- a/bench/VOXEL_FAST_PATH_HYPOTHESES.md
+++ b/bench/VOXEL_FAST_PATH_HYPOTHESES.md
@@ -34,16 +34,18 @@ Current accepted voxel fast path:
 | --- | --- |
 | Scene | One transform/perspective scene root. |
 | Mesh | One `.polycss-mesh` wrapper. |
-| Voxel hosts | Three axis hosts: `x`, `y`, `z`. |
-| Leaves | Plain `<b>` brush rectangles. |
-| Positioning | `left/top/width/height` plus one leaf `translateZ(...)`. |
+| Voxel hosts | None. |
+| Leaves | Plain hostless `<b>` direct-matrix voxel quads. |
+| Primitive | Desktop-class documents use 1px; mobile-class documents use 8px with divided matrix scale to avoid GPU filtering gaps. |
+| Positioning | One canonical `matrix3d(...)` per mounted voxel quad. |
+| DOM order | Projected screen-space `tile4-scanline-forward`. |
 | Culling | Only camera-facing face directions are mounted. |
 
 Current read:
 
 - Extra 3D wrappers are expensive.
 - Lower DOM count alone is not a reliable cost model.
-- Brush leaves need `transform-style: preserve-3d` and visible overflow.
+- Direct-matrix voxel leaves still need `transform-style: preserve-3d`.
 - A1 traces show the current polycss-vs-voxcss delta is compositor/layerization
   work, especially `PaintArtifactCompositor::Update`, `Layerize`, and
   `LayerTreeImpl::UpdateDrawProperties`. Raster is zero in these samples.
@@ -86,35 +88,43 @@ Current read:
 - Synthetic classes are useful. Dense cubes and thin slabs are flat, sparse
   separated voxels favor voxcss, and noisy/high-color scenes are mostly flat;
   this exposes thresholds that the gallery corpus alone hides.
-- Matrix-vs-slice fallback selection is real but only partly predictable. An
-  86-model cadence corpus has matrix p95 wins on `desert2`, `scene_hazmat`,
-  `scene_house`, `scene_mechanic2`, `scene_sidewalk`, and `Treasure`; slice
-  p95 wins on `AncientCrashSite`, `armchair`, `christmas_tree`, `ff1`,
-  `mailbox`, `obj_house3`, `obj_house8`, `obj_trashcan4`, `pyramid`, and
-  `scene_park`; 66 models are flat or capped. Active leaves, local area,
-  visible planes, raw source color count, and screen fill each have
-  counterexamples.
-- Visible shaded brush color count is a useful partial selector, and it is
-  different from raw source color count. `visibleShadedColors >= 52`, computed
-  from the current polygon brush plan and baked lighting, captures four
+- Pre-default matrix-vs-slice selection work is now historical evidence, not a
+  routing plan. The 86-model cadence corpus found matrix p95 wins on
+  `desert2`, `scene_hazmat`, `scene_house`, `scene_mechanic2`,
+  `scene_sidewalk`, and `Treasure`; slice p95 wins on `AncientCrashSite`,
+  `armchair`, `christmas_tree`, `ff1`, `mailbox`, `obj_house3`, `obj_house8`,
+  `obj_trashcan4`, `pyramid`, and `scene_park`; 66 models are flat or capped.
+  Active leaves, local area, visible planes, raw source color count, and screen
+  fill each have counterexamples, so do not revive this as a gate without new
+  GPU-hard proof.
+- Visible shaded brush color count was a useful partial historical selector,
+  and it is different from raw source color count. `visibleShadedColors >= 52`,
+  computed from the current polygon brush plan and baked lighting, captures four
   validated strong matrix wins (`scene_hazmat`, `scene_house`,
   `scene_mechanic2`, `Treasure`) and no validated strong slice wins, but it
   misses `desert2` and `scene_sidewalk`, hits many flat/capped scenes, and
   creates one p99 regression on `scene_house3` if used by itself. Adding
   `visiblePlanes < 200` keeps the same p95 wins and removes that p99 loss in
-  the current corpus.
+  the old corpus, so it remains a diagnostic only.
 - Browser probes on Chrome 148 and Canary 150 keep the refined high-shaded
   gate safe but not universally profitable: `scene_house`, `scene_mechanic2`,
   `Treasure`, and `desert2` stay matrix; `scene_hazmat` can flatten in Chrome;
   `scene_sidewalk`, `pyramid`, and `obj_house3` are browser-ceiling sensitive.
 - Headed Chrome tightens that warning: `scene_house` flattens in headed mode
-  even though it is a headless matrix win. Treat the selector as a guard
-  against known slice slow paths, not a guaranteed speedup.
-- A bench-only adaptive route (`polycss-adaptive-shaded`) proves the
-  high-shaded gate can be computed before mount and route the renderer. It
+  even though it is a headless matrix win. Treat the old selector as diagnostic
+  evidence, not a reason to add a router.
+- The browser compositor backend is first-order. Bundled Playwright Chromium
+  can fall onto `SoftwareRenderer::DoDrawQuad`; the perf-facing bench scripts
+  now default to the GPU lane (`--use-angle=metal` on macOS plus
+  `--enable-gpu-rasterization`) because that removes the software renderer and
+  can move medium voxel scenes from the 60fps bucket to the 110+fps bucket
+  without changing DOM.
+- A bench-only adaptive route (`polycss-adaptive-shaded`) proved the
+  high-shaded gate could be computed before mount and route the renderer. It
   catches `Treasure`, keeps `AncientCrashSite` and `scene_house3` on slices,
   and routes capped high-shaded models as expected. It still misses `desert2`,
-  which remains a large low-color matrix win, so the selector is incomplete.
+  which remains a large low-color matrix win, so the selector is incomplete
+  and superseded by the one-strategy direct-matrix baseline.
 - Target-size sweeps on `desert2` and `scene_mechanic2` rule out CSS cell size
   and local brush area as the cause of the matrix wins. Slice area changed by
   several multiples while p95 stayed in the same cadence bucket.
@@ -135,29 +145,28 @@ Current read:
   scroll-timeline scrubbed by JS `scrollLeft` both fall back into PAC. Treat
   declarative animation as an auto-rotate-only candidate until a browser probe
   proves otherwise.
-- Synthetic depth-group probes reopen depth wrappers only under a very strict
-  gate. Moving leaf `translateZ(...)` into one wrapper per depth plane is a big
-  win at 17 wrappers and 5000 leaves, but 50 wrappers already loses cadence and
-  250 wrappers collapses. Most important real models sit well above the clean
-  range (`AncientCrashSite` 191 visible planes, `Treasure` 132, `desert2` 102,
-  `pyramid` 68, `ff1` 54, `scene_sidewalk` 47), so depth wrappers remain
-  rejected as the default renderer shape.
-- A bench-only real-model depth-group variant confirms there is no current
-  product payoff. Available sub-30-plane models (`armchair`,
-  `obj_trashcan4`, `mailbox`) are already capped/flat, `scene_sidewalk` at 47
-  planes is slight regression/noise, and `ff1` at 54 planes collapses to ~30
-  FPS p95.
+- Software-lane synthetic depth-group probes originally suggested only a very
+  strict low-wrapper gate: 17 wrappers could win, 50 already lost cadence, and
+  250 collapsed. A218 supersedes the absolute threshold for the default bench
+  lane: GPU keeps grouped 2D children clean to roughly 112 wrappers, then
+  falls around 128+ and collapses by 136/192.
+- A bench-only real-model depth-group variant still does not justify a default
+  product path. The old sub-30-plane gate was too conservative for GPU, but
+  the currently hard high-leaf models still exceed the clean GPU wrapper range.
+  Use exact depth wrappers only if a real model is GPU-hard, visually exact,
+  and at or below the validated wrapper threshold.
 - A corrected hostless direct-matrix voxel prototype identifies the portable
   part of matrix wins. `polycss-polybox` showed that parsed polygons inside
   axis hosts still fall to slice cadence on `desert2`; `polycss-voxlocal-
   direct-matrix` folds the axis host into each leaf's canonical `matrix3d`
-  with a normal column and transfers the `desert2` win. It still regresses
-  `AncientCrashSite`, `pyramid`, and `scene_park`, and splitting large source
-  rectangles loses the win, so this is not a default renderer yet.
-- Exact direct matrix remains the strongest one-leaf-shape candidate, but the
-  hard part is DOM/paint order. Global projected-depth order transfers matrix
-  wins to `desert2`, `house`, `scene_mechanic2`, `Treasure`, and `army`, while
-  fixed face order rescues `obj_house3` and stays neutral on
+  with a normal column and transfers the `desert2` win. That shape became the
+  current default after visual checks, cleanup, and tile4 order validation; the
+  remaining question is no longer slice-vs-matrix routing, but why high-leaf
+  GPU-hard scenes still fall below the cap.
+- Exact direct matrix is now the one-leaf-shape baseline, and the hard part is
+  DOM/paint order. Global projected-depth order transfers matrix wins to
+  `desert2`, `house`, `scene_mechanic2`, `Treasure`, and `army`, while fixed
+  face order rescues `obj_house3` and stays neutral on
   `AncientCrashSite`/`skyscraper`.
 - Hybrid order attempts did not produce a universal rule. Face-depth sorting
   and depth bands with face locality regress key cases; alternate static face
@@ -166,6 +175,69 @@ Current read:
   PAC/DrawProps/Draw cost per frame, but radically different vsync cadence.
   That points at Chromium's 3D compositor sorting/overlap critical path rather
   than normal style, layout, paint, or node-count costs.
+- Scene-shell transform decomposition does not appear to be the missing fast
+  path. Bench-only A112-A114 variants serialized the root transform to
+  `matrix3d(...)`, moved target translation to an inner shell, moved
+  `perspective` to the host, folded `perspective(...)` into the transform
+  list, and removed the scene `will-change` pin. The only apparent win was a
+  short Desert2 cadence artifact; longer default-vs-no-will-change validation
+  was flat across Garden, `obj_house3`, Desert2, and `scene_house3`.
+- Synthetic A115-A128 sharpen the compositor model. With a fixed synthetic
+  scene of identical `matrix3d` leaves, DOM order can flip p95 near a cadence
+  threshold, especially when projected leaf boxes overlap and adjacent DOM
+  entries jump across Z planes. But the effect is threshold-only: flat-Z scenes
+  are fast, 5000-leaf mixed-depth scenes are unstable across fresh browsers,
+  and heavier 6000-8000-leaf scenes are governed by total dirty 3D leaf load
+  regardless of spatial/depth/random order. Active CSS transform animation
+  still skips PAC/layerize in traces, but no-trace heavy synthetic cadence is
+  not rescued once draw-property/draw work dominates.
+- Synthetic A129-A137 rule out several nearby browser API shortcuts. Leaf
+  `transform-style: flat` catastrophically collapses the synthetic 3D case;
+  backface hiding, leaf `will-change`, leaf containment, root
+  `will-change:auto`, and transform-function spelling are flat/noisy. Larger
+  root scale and primitive/screen footprint increase the share of 3x+ frames;
+  rotation delta is mostly flat, confirming that dirtying the 3D subtree is the
+  cost, not how far it rotates. Static root with the same 7000 leaves stays
+  near the 120fps bucket; JS transform mutation falls to 30-40 p95. Updating a
+  CSS var used in `transform`, registering that var, or updating the individual
+  `rotate` property still hits PAC/layerize around 3.5ms/frame. Active CSS
+  keyframes remain the only tested path that skips PAC.
+- Synthetic A138-A146 identify the cleanest lower-level cost model so far:
+  dirty transformed 3D descendant count dominates, and the fast shape is fewer
+  3D wrappers with many 2D children. In the original software-lane run, the
+  clean wrapper range was very small: 8-12 wrappers were all 1x frames, 16
+  leaked a few 2x frames, 17-28 landed in the 60fps p95 bucket, 32-34 fell to
+  30-40, and 50+ collapsed. Trace confirmed DrawProps dropped from
+  ~4.8ms/frame with per-leaf 3D transforms to ~0.03-0.06ms/frame with grouped
+  2D children. A218 reran the same browser shape on the GPU lane and moved the
+  clean threshold to roughly 112 wrappers, so the old "low teens" number was a
+  backend threshold, not a renderer law. Wrapper `transform-style: flat` is
+  worse, wrapper `will-change` is flat, and valid boxed paint containment is
+  flat; invalid 0x0 paint containment clips all children and only looks fast
+  because it paints nothing. With wrapper count fixed at 8, 2D child count
+  becomes the secondary limit: 10k children stay 120fps, 20k falls to ~60, and
+  30k collapses, with PAC/layerize scaling from ~1.6ms/frame to ~2.6ms/frame
+  between 10k and 20k.
+- A147 checked the real-model feasibility of the software-lane grouped shape.
+  A218 updates the threshold upward for GPU, but the conclusion stays: the
+  hardest visible-plane models still sit beyond the clean exact-wrapper range
+  (`Treasure` 132, `obj_house3` 142, `scene_mechanic2` 163,
+  `scene_house` 182, AncientCrashSite and `scene_park` 191). So the grouped
+  shape is real, but exact depth wrappers are not a universal renderer path
+  for current gallery scenes.
+- GPU-lane reread: every software-only p95 conclusion is now evidence, not a
+  promotion gate. Visual-invalid rejections still stand. Medium direct-matrix
+  scenes that jump to 100+ on GPU (`obj_house3`, `scene_mechanic2`, `treasure`,
+  `desert2`) should be treated as capped/tie cases unless a variant improves
+  p99 without hurting high-plane models. The live optimization target is the
+  GPU-hard class: high visible exact-plane count and high active leaf count
+  (`AncientCrashSite`, `skyscraper`, long-window `army`, plus nearby
+  high-plane scenes).
+- GPU-lane reread of depth wrappers: the old low-teens wrapper threshold was a
+  software-backend result. On ANGLE/Metal, grouped 2D children stay fast until
+  roughly 112 exact depth wrappers, then fall at 128+ and collapse by 136/192.
+  This reopens wrappers only as a narrow GPU-lane special case; it still does
+  not cover the hard models whose exact visible planes sit above that range.
 - A31's first compositor-order metric closes the naive version of that idea.
   `bench/voxel-order-metrics.mjs` now samples visible exact-matrix voxel leaves
   over rotation and counts projected AABB overlaps, depth-order inversions,
@@ -193,10 +265,11 @@ Current read:
   tile policy remains model-specific, but `tile4-scanline-forward` is the first
   plausible single policy: it rescues `obj_house3`, stays in the high bucket on
   `obj_house5`, `desert2`, `house`, `scene_mechanic2`, `Treasure`, and
-  `AncientCrashSite`, and improves `army` over A31 exact. It needs validation
-  before becoming a renderer direction.
-- A34 validates `tile4-scanline-forward` as a broad default candidate versus
-  the current slice shape, but not as the full solution. With five repeats and
+  `AncientCrashSite`, and improves `army` over A31 exact. Later validation made
+  this the D3 baseline order; remaining order work must improve GPU-hard
+  intervals rather than re-prove tile4.
+- A34 validated `tile4-scanline-forward` as the broad direct-matrix default
+  order before it became D3, but not as the full solution. With five repeats and
   only the minimum comparator set, it produces large p95 wins on
   `obj_house3`, `obj_house5`, `desert2`, `house`, `scene_mechanic2`, and
   `Treasure`, is neutral on `AncientCrashSite`, modest on `skyscraper`, and
@@ -217,6 +290,160 @@ Current read:
   both lose `obj_house3`; serpentine also loses `house`, and both have lower
   hard-set averages than row-major `tile4-scanline-forward`. The incumbent
   remains the only broad one-strategy candidate.
+- Probe A38 rejects direct-matrix voxel leaf `transform-style: flat`. This was
+  not just an old slice-host requirement: on the current hostless matrix shape
+  it collapsed every hard-set model (`AncientCrashSite` p95 39.9 -> 5.7,
+  `desert2` 107.0 -> 14.5, `MechaGolem` 112.3 -> 23.8). Preserve-3d on each
+  leaf appears to be part of Chromium's valid 3D compositor path.
+- Probe A39 rejects `backface-visibility: hidden` on direct voxel leaves. The
+  FPS result is tempting (`Treasure` 40.0 -> 59.6, `army` 39.9 -> 57.8,
+  `scene_mechanic2` 60.8 -> 109.8), but static screenshot diffs are visually
+  invalid: 21-96% of pixels changed on the checked hard-set models. Hidden
+  backface is a different render, not a perf win.
+- Probe A40 rejects `contain: layout style` on `.polycss-voxel-mesh`. It is
+  mostly flat and helps `skyscraper`, but it collapses `desert2` p95
+  107.0 -> 60.1. Wrapper containment changes the same hidden compositor
+  ordering class we are trying to exploit, so it is not a general renderer
+  boundary.
+- Probe A41 rejects the corrected version of hidden backfaces: orienting each
+  direct matrix so the CSS front face matches the voxel normal restores visual
+  parity (mean screenshot deltas around 0.00002-0.00007), but the perf win
+  disappears and `desert2` regresses 107.0 -> 60.7 p95. A39's speedup came
+  from dropping real faces, not from a safe backface compositor fast path.
+- Probes A42-A46 reject changing the off-plane normal-column magnitude. Static
+  screenshots stay visually equivalent because local `z=0`, but any tested
+  non-unit normal scale (`0.1`, `2`, `50`, side-only, or z-only) collapses
+  `desert2` from ~107 p95 into the ~60 cadence class. Some variants improve
+  `scene_mechanic2`, so this is a real compositor classification lever, but
+  the current exact `±1` normal column is the only broadly safe single policy.
+  Paired traces did not show a proportional PAC/Layerize/DrawProps reduction
+  when cadence changed (`scene_mechanic2` normal `0.1` jumped p95 while those
+  buckets stayed within roughly 1%), reinforcing that the win/loss is hidden
+  compositor scheduling or property-tree classification rather than measured
+  style, paint, or compositor CPU.
+- Probes A47-A66 reject moving visible scale out of the direct matrix as a
+  default strategy. Fixed 64px canonical quads, CSS `width/height` plus an
+  orient/translate matrix, fixed `BASE_TILE` quads, and one mesh-global max
+  primitive all regress or flatten the split models. Per-leaf square
+  normalization (`primitive = max(width,height)`, matrix columns <= 1) looked
+  like the only real signal in early short-window runs, but cleanly rebuilding
+  the bench bundles from source and re-running with 100+ p95 treated as a
+  capped tie changes the read: exact square and `<=600px` fallback do not
+  reliably move `desert2` or `scene_mechanic2`, axis-only and face-only splits
+  are flat, and inverse `>600px` / `>300px` bands are flat. A narrow
+  `300-600px` band briefly put `scene_mechanic2` into the 100+ bucket in a
+  3s two-run sample, but an 8s confirmation returned to baseline. The
+  actionable conclusion is that primitive-size normalization is a noisy
+  cadence lever, not a shippable single renderer shape.
+- Probe A67 adds `bench/trace-frame-buckets.mjs`, which aligns raw Chromium
+  trace events with rAF frame intervals using `performance.mark`/`timeStamp`
+  markers. The key read is per-cadence-bucket, not whole-run totals:
+  `Garden.vox` slow buckets have PAC/layerize/draw-props/draw several times
+  higher than x1 frames, while `desert2.vox` and `scene_mechanic2.vox` sit near
+  a steady 8.3ms budget edge with only small compositor deltas between x1 and
+  x2 frames. Optional `--dom-samples` child-count sampling shows those buckets
+  are not explained by face-cull swaps: Garden stayed at 6572 mounted leaves,
+  Desert2 at 1984, and scene_mechanic2 at 2216 in the checked windows.
+- Probes A70-A86 confirm DOM order phase is a real hidden compositor lever,
+  but reject the tested forms as a default. Fixed `rotY` order lookahead
+  offsets found large wins (`+30deg`: Garden ~30 -> ~39 p95, Desert2 ~60 ->
+  100+, Treasure ~40 -> ~58), but `obj_house3` regressed ~60 -> ~40. Centering
+  the order within the current visible-face interval kept the Garden/Desert2/
+  Treasure wins and avoided the worst `obj_house3` p95 drop, but introduced an
+  `obj_house3` p99 tail loss and left Skyscraper borderline. Interval
+  fractions and per-item huge-rectangle fallback did not remove that
+  counterexample. Boundary screen-span anchors and adaptive 3x3/5x5 tile
+  density then produced the best short-window result so far, but the 8s
+  confirmation rejected it as a universal rule: it won Garden/Treasure and
+  helped `scene_mechanic2`, but regressed AncientCrashSite and `obj_house3`.
+  Slot-churn analysis showed the phase wins are not from fewer pooled-element
+  style rewrites at cull boundaries. The actionable conclusion is that order
+  phase is still the most promising lever, but aggregate p95 is now too blunt:
+  the next metric must bucket frames by visible-face interval and identify
+  which interval/order pair causes each win or loss.
+- Probe A87 adds `bench/voxel-interval-profiler.mjs` and compares baseline
+  against the rejected adaptive screen-span order by visible-face interval.
+  The result explains why the global rule failed: Garden's `t|br|fr` interval
+  improves ~30 -> ~39.5 p95, Treasure's `t|br|fr` improves ~40 -> ~60, and
+  `scene_mechanic2` improves in `t|br|fr`/`t|fr|fl`; but AncientCrashSite's
+  `t|bl|br` interval drops ~39 -> ~30 and `obj_house3` drops hard in
+  `t|br|fr` and `t|fr|fl`. Signature alone is not enough because the same
+  signature can be a win on one geometry distribution and a loss on another.
+  The next useful test is per-interval geometry correlation, not another
+  whole-model aggregate order sweep.
+- Probes A88-A91 add per-interval geometry/face-pair correlation and reject
+  two derived order variants. Top-face anchoring was meant to protect the
+  harmful top/top or top/side changed pairs, but it also removed the useful
+  Garden/Scene/Treasure wins. Reversing scanline traversal inside the same
+  adaptive phase rule regressed the hard set, especially `obj_house3`. The
+  face-pair read is still valuable: losses are not explained by count or
+  span alone, but the tested pair-level fixes are too blunt.
+- Probes A92-A93 add exact interval order replay. A92 was discarded because
+  it computed order at interval midpoint; A93 corrects this by computing order
+  at visible-face interval entry, matching when the renderer actually patches
+  DOM order. The corrected diff shows two different failure modes:
+  `obj_house3` losses are dominated by huge top leaves spanning ~1.45 coarse
+  tiles, while AncientCrashSite's loss comes from massive all-leaf rank motion
+  among much smaller primitives and only ~11% changed overlap area. That rules
+  out a signature-only or count-only order policy.
+- Probes A94-A95 reject the first structural guards derived from A93. A94 kept
+  product tile4 slots, phased movable leaves toward the interval center, and
+  pinned very large top occluders; it regressed `obj_house3` hard and did not
+  recover Garden/Treasure. A95 removed the top pinning and only enabled
+  centered order when an interval had a large projected blocker; it still
+  regressed `obj_house3` and stayed flat elsewhere. The lesson is that coarse
+  "large blocker present" and "large top occluder" predicates are too blunt;
+  the useful order signal is lower-level than per-face/per-span guards.
+- Probes A96-A103 reopen plain tile granularity under a matched current
+  baseline. Tile3 current-screen order improves AncientCrashSite in a short
+  window but collapses `obj_house3`; tile6 current-screen order is flat/worse.
+  Tile5 current-screen order is the only adjacent single-shape candidate that
+  survived 8s two-run validation: `garden` improves ~30 -> ~39.5 p95, no
+  checked model loses more than 8 p95, `obj_house3`/`mecha-golem` stay in their
+  high buckets, and Treasure/Skyscraper p99 tails improve. It is not a broad
+  breakthrough because Ancient/Army p99 tails worsen by ~3ms and most models
+  are flat, but it is cleaner than phase/guard attempts and worth one more
+  traversal-direction probe.
+- Probes A104-A105 reject tile5 traversal-direction variants. Tile5
+  serpentine loses `obj_house3`, Skyscraper, and the Garden win. Tile5 reverse
+  scanline finds a large short-window Desert2 win, but also loses `obj_house3`
+  and does not keep Garden. The surviving single-shape candidate remains
+  tile5 scanline-forward, not a traversal change.
+- Probes A106-A107 trace Garden tile4 vs tile5-forward. Tracing perturbs the
+  FPS enough that the p95 win does not reproduce directly, but both runs keep
+  the same 7186 mounted leaves and the same compositor-cost class. Tile5
+  reduces the sampled x4+ bucket count in the trace window, which supports the
+  current read: tile count is changing Chromium's cadence/scheduling threshold,
+  not reducing style, paint, DOM count, or raster work.
+- Probes A108-A111 reject tile5 scanline-forward as the default after a broader
+  corpus pass. A108/A109 add generic `vox:filename.vox` bench IDs and run 24
+  additional files. The filter finds no strong p95 wins, one strong p95 loss
+  (`scene_house3` ~40 -> ~30), and p99 tail regressions on capped-looking
+  models (`mailbox`, `scene_house`, `scene_house5`, `scene_army`). A110/A111
+  confirm the risk set at 8s: `scene_house3` loses ~9.8 p95, `mailbox` p99
+  worsens by ~7.5ms, `scene_house` p99 worsens by ~5.5ms, and `scene_army`
+  p99 worsens by ~3.7ms. Tile5 remains a useful diagnostic for Garden, but it
+  is not the one-shape policy.
+
+Latest A66 long-window square-band confirmation, p95 FPS medians:
+
+| Model | Baseline | `300-600px` square band | Read |
+| --- | ---: | ---: | --- |
+| `Garden.vox` | 30.0 / 57.8ms p99 | 30.0 / 60.5ms p99 | Flat, slight tail noise. |
+| `desert2.vox` | 60.1 / 16.8ms p99 | 60.1 / 16.8ms p99 | Flat. |
+| `scene_mechanic2.vox` | 60.1 / 16.8ms p99 | 60.1 / 16.8ms p99 | Short 100+ win did not hold. |
+| `skyscraper.vox` | 29.9 / 43.2ms p99 | 29.9 / 45.9ms p99 | Flat, slight tail noise. |
+
+Latest A74 centered-interval order validation, p95 FPS medians:
+
+| Model | Baseline | Centered interval order | Read |
+| --- | ---: | ---: | --- |
+| `Garden.vox` | 30.1 / 47.8ms p99 | 39.8 / 39.4ms p99 | Win. |
+| `desert2.vox` | 60.4 / 16.7ms p99 | 100+ / 9.3ms p99 | Win to capped bucket. |
+| `Treasure.vox` | 40.1 / 25.4ms p99 | 57.3 / 28.4ms p99 | Win. |
+| `scene_mechanic2.vox` | 61.6 / 16.7ms p99 | 59.9 / 16.9ms p99 | Flat. |
+| `obj_house3.vox` | 60.1 / 16.9ms p99 | 57.5 / 28.8ms p99 | Tail loss. |
+| `skyscraper.vox` | 34.5 / 41.8ms p99 | 29.4 / 44.5ms p99 | Borderline/flat. |
 
 Latest hard-split validation, p95 FPS medians:
 
@@ -335,12 +562,13 @@ Probe A37 tile4 traversal sweep, p95 FPS medians:
 | ID | Status | Decision | Why it stays |
 | --- | --- | --- | --- |
 | D1 | ✅ Accepted | Preserve raw `PolyVoxelSource` and render eligible `.vox` meshes through a dedicated fast path. | This produced the major win over polygon `matrix3d` leaves. |
-| D2 | ✅ Accepted | Keep the shallow three-axis-host DOM shape. | It beat every wrapper-heavy variant tested. |
-| D3 | ✅ Accepted | Keep one leaf `translateZ(...)` per brush as the default renderer. | Real high-plane models regressed with depth wrappers, and synthetic probes show wrapper count becomes unstable around 50 planes. Only a strict low-plane benchmark gate is still open. |
+| D2 | ✅ Accepted | Keep the hostless direct-matrix DOM shape as the default. | It removes voxel hosts, uses one canonical `<b>` matrix per visible quad, and is the only one-shape baseline that survives the GPU reread. |
+| D3 | ✅ Accepted | Keep `tile4-scanline-forward` as the default DOM order. | Most order alternatives were either model-specific or software-lane artifacts; tile4 row-major remains the broadest single policy while medium GPU cases are now capped/ties. |
 | D4 | ✅ Accepted | Prefer exact parsed voxel quads over source overpaint for default rendering. | The exact path preserves visual correctness; lower-node source variants did not reliably win. |
 | D5 | ✅ Accepted | Keep camera-facing culling. | Mounting all faces regressed hard. |
 | D6 | ✅ Accepted | Keep integer CSS cell snapping for `.vox` normalization. | It avoids a scale wrapper and keeps brush coordinates on integer pixels. |
 | D7 | ✅ Accepted | Normalize visual fit before comparing voxel renderer FPS. | Fixed zoom can crop or resize large voxel scenes enough to change the benchmark question. |
+| D8 | ✅ Accepted | Treat GPU as the default bench lane and software as an explicit stress lane. | A211-A217 show the default bundled software renderer can manufacture 60fps ceilings that disappear under normal GPU compositing. |
 
 ## Active Hypotheses
 
@@ -366,20 +594,50 @@ Probe A37 tile4 traversal sweep, p95 FPS medians:
 | A18 | ❌ Rejected | Existing non-product prototypes establish a valid ceiling. | Ran `polycss-slice-proto` and `polycss-polybox` on `AncientCrashSite`, `Garden`, and synthetic sparse grid. `slice-proto` can be faster but fails visual checks; `polybox` is not a consistent win. | Reopen only with a render-correct ceiling prototype. | Current prototypes change the visual render or do not beat the fast path. |
 | A19 | ✅ Accepted | Benchmark instrumentation can perturb results. | `LayerTree.enable` changed the AncientCrashSite FPS path, especially for polycss; keep layer-tree capture opt-in and separate from FPS traces. | Use low-intrusion traces for FPS comparisons and isolated diagnostic runs for layer counts. | Reopen if a cheaper layer-shape probe is found. |
 | A20 | ✅ Accepted | Synthetic model classes are needed to expose thresholds. | Generated dense cube, sparse grid, thin slab, and noisy/high-color `.vox` models. Dense/thin cases are flat; sparse separated voxels favor voxcss; noisy/high-color is mostly flat. | Keep synthetic classes in future benchmark sweeps. | Reopen only if synthetic behavior diverges from future real-model findings. |
-| A21 | ⚠️ Conditional | Some `.vox` models should route to the matrix fallback instead of voxel slices. | 86-model cadence corpus with `bench/voxel-cadence-summary.mjs`, static plan metrics from `bench/voxel-static-metrics.mjs`, Chrome/Canary probes from `bench/voxel-browser-summary.mjs`, and bench-only `polycss-adaptive-shaded`. | Mark accepted only if a cheap static predicate predicts validated matrix wins without hurting slice-favored models. Current partial gate: `visibleShadedColors >= 52 && visiblePlanes < 200`; `desert2` remains unexplained. | Reject if the winner remains unstable after validation or if a predicate that catches `desert2` also routes strong slice winners to matrix. |
+| A21 | ❌ Rejected | Route only some `.vox` models between voxel slices and matrix fallback. | 86-model cadence corpus plus the bench-only `polycss-adaptive-shaded` route proved selectors are partial and browser-sensitive. D2/D3 supersede this direction: hostless direct matrix plus tile4 order is now the one-strategy baseline, and GPU reread makes many old medium-scene routing wins capped/tie evidence. | Reopen only if a future second renderer is visually exact and wins the GPU-hard class behind a cheap static predicate. | Do not use old slice-vs-matrix selector data to add a router. |
 | A22 | 🧪 Test next | Declarative camera animation can skip PAC for auto-rotate scenes, but cannot solve interactive JS rotation by itself. | Chromium source read plus `apocalypse/car.glb` probes: JS rotation hit PAC every sample frame; CSS keyframe and running WAAPI hit zero PAC; paused WAAPI `currentTime` and JS `scrollLeft` scroll-timeline probes still hit PAC. Build a bench-only WAAPI/CSS camera mode and run voxel + non-voxel traces without treating trace FPS as final. | Accept a separate auto-rotate path if validated runs show lower PAC and better cadence without visual drift or API contortions. | Reject as a general renderer fix if interactive pointer-driven controls still require JS transform mutation and draw-property cost remains dominant. |
 | A23 | ✅ Accepted | Dirty 3D transform-node count is the next lower-level cost model after active DOM leaves. | `bench/compositor-topology-probe.mjs` confirmed the source read: at equal 2500 leaves, `left/top` and 2D `translate` were near-free in draw properties, while `translateZ(0)`, real `translateZ`, and `matrix3d` were ~40-60x higher. | Use this as the browser-shape benchmark for future topology ideas. | Reopen only if another Chromium version makes 3D leaves decompose cheaply. |
 | A24 | ⚠️ Conditional | Projected distribution/overlap may explain model variance that leaf count misses. | One longer synthetic distribution probe at equal 1200 `matrix3d` leaves moved DrawProps/Draw by about 20%, but PAC/layerize stayed similar; a shorter rerun was noisier. | Promote if controlled screen-coverage runs and real-model pairs show the same separation. | Reject if the effect collapses under controlled repeats. |
-| A25 | 🟡 Flat | Depth-plane wrappers may help only tiny visible-plane voxel scenes. | `bench/compositor-topology-probe.mjs --mode=depth-groups` kept leaf count fixed and moved Z from leaves to depth wrappers. At 5000 leaves, 17 wrappers improved p95/p99 and almost erased draw-property cost; 50 wrappers had cheap trace events but worse cadence; 250 wrappers collapsed. The bench-only `polycss-voxlocal-depth-groups` variant then found no useful real-model win: sub-30-plane models are capped/flat and `ff1` at 54 planes regresses to ~30 FPS p95. | Reopen only if a high-leaf, sub-30-visible-plane real model appears. | Current real corpus has no shippable depth-wrapper gate. |
-| A26 | ⚠️ Conditional | Hostless direct canonical matrix brushes are the transferable part of matrix wins. | `polycss-polybox` uses parsed polygons but keeps axis hosts and falls to slice cadence; `polycss-voxlocal-direct-matrix` removes hosts, uses 1px leaves, folds scale/orientation/depth into `matrix3d`, and transfers the `desert2` win while lowering PAC/draw-props. | Accept only if a visual-gated direct-matrix renderer improves a validated model class without regressing slice-favored models. Candidate subtests: source-plan predicate, exact parsed polygon granularity, and visual diff against current slices. | Reject if direct matrices only win when visually different, or if the safe version is just the existing polygon matrix fallback. |
-| A27 | ⚠️ Conditional | Exact direct matrix leaves can be the single voxel leaf shape, but order must be solved at the compositor/overlap level. | Same exact `<b>` matrix leaves, same active nodes, and same culling produce opposite cadence depending only on DOM order. Global depth wins `desert2`, `house`, `scene_mechanic2`, `Treasure`, and `army`; face/top-first order rescues `obj_house3` and keeps `AncientCrashSite` neutral. | Promote if a cheap geometry/order policy is neutral-or-better than slices on validated p95/p99 while keeping the same direct matrix leaf shape. | Reject if the policy must become benchmark-feedback routing or if visual checks fail. |
+| A25 | ⚠️ Conditional | Exact depth-plane wrappers are backend-specific and only useful under a visible-plane gate. | Software-lane `depth-groups` made 17 wrappers fast and 50+ unstable; A218 updates the GPU-lane threshold to roughly <=112 wrappers before cadence falls. The bench-only real-model variant found no default product payoff, and current GPU-hard models exceed the clean range. | Reopen only for a high-leaf GPU-hard real model at or below the validated exact-plane threshold. | Reject as a default renderer; it cannot cover the high-plane hard class. |
+| A26 | ✅ Accepted | Hostless direct canonical matrix brushes are the transferable part of matrix wins. | `polycss-polybox` uses parsed polygons but keeps axis hosts and falls to slice cadence; `polycss-voxlocal-direct-matrix` removes hosts, folds scale/orientation/depth into `matrix3d`, and transfers the `desert2` win while lowering PAC/draw-props. The baseline is 1px on desktop and 8px on mobile-class documents to avoid mobile GPU filtering gaps while preserving the same CSS-space quad. | Keep direct matrix as the baseline leaf shape while testing only changes that target GPU-hard residual cost. | Reopen only if a visual-equivalent shape beats it on high-leaf GPU-hard scenes without adding routing. |
+| A27 | ✅ Accepted | Exact direct matrix leaves are the single voxel leaf shape; order is the optimization layer. | Same exact `<b>` matrix leaves, same active nodes, and same culling produced opposite cadence depending only on DOM order. Tile4 scanline-forward became the baseline because it was the broadest validated one-strategy order; later GPU reread changes which old wins matter, not the baseline DOM shape. | Keep order experiments isolated from leaf shape changes and judge them on GPU-hard intervals. | Reopen only if a different leaf shape changes GPU-hard compositor pressure without visual drift. |
 | A28 | ❌ Rejected | A single static or face-normal order can replace model routing. | Tested fixed side-first, side-reverse, top-reverse, face-normal-front/back, face-depth, face-block, and depth-band variants on the hard split set. `obj_house3` rejects side-first/reverse and depth; `desert2` rejects top/normal-front; `house` rejects normal-front; `AncientCrashSite` rejects normal sorting and bands; `Treasure` still needs per-leaf depth for the high bucket. | Reopen only with a new order derived from Chromium sorting behavior, not another static face permutation. | Current static/normal permutations all have hard counterexamples. |
 | A29 | ❌ Rejected | Depth bands with face locality bridge face order and projected-depth order. | 4- and 8-band variants reduce mounted nodes but regress `obj_house3`, `army`, `AncientCrashSite`, and `skyscraper`; `Treasure` still stays below global depth. | Reopen only if a different banding rule is tied to measured compositor overlap/sorting, not node count. | Fewer active nodes performed worse, so this is not the missing invariant. |
 | A30 | ✅ Accepted | Order-sensitive wins are cadence/scheduler threshold effects, not lower per-frame main-thread compositor work. | One-run traces on `scene_mechanic2` and `obj_house3` with same leaves/nodes show PAC, DrawProps, Draw, paint, raster, and script per inferred frame are nearly identical between fast and slow orders. The difference is the share of 1x-vsync vs 2x/3x-vsync frames. | Next work should inspect overlap/sorting/damage/GPU critical path, not style/layout/PAC totals. | Reopen only if low-intrusion traces on more models show per-frame compositor groups diverging materially. |
 | A31 | ❌ Rejected | Projected overlap/order inversions predict when depth order is required. | Added `bench/voxel-order-metrics.mjs` and ran the hard split set with two repeats per strategy. Overlap count, crossing rate, and depth-inversion rate are useful diagnostics, but the naive inversion predictor fails: zero-inversion depth order can be slow, and parsed order can be fast with many inversions. | Reopen only with a more specific Chromium/BSP metric than AABB overlap and average-depth inversion. | Current metric does not correlate with validated or exploratory p95/p99 by order. |
 | A32 | ❌ Rejected | Source/spatial locality plus coarse depth ordering may beat pure face and pure depth order. | Tested source-order blocks of 32, 64, 128, and 256 leaves, sorted by average projected depth front/back, on the hard split set with two repeats. | Reopen only if the block definition is derived from a new browser/compositor metric rather than fixed source chunks. | Fixed source chunks are model-specific: they transfer some wins but fail `obj_house3`, miss `army`/`skyscraper`, and do not beat the A31 Pareto frontier. |
-| A33 | ⚠️ Conditional | Projected screen-space grouping may match Chromium's 3D overlap/sorting work better than source-order blocks. | Tested 4x4 and 8x8 projected screen tiles with depth-front/back and scanline-forward/reverse ordering on the hard split set with two repeats. A34 then validated `tile4-scanline-forward` against slices with five repeats; A35 rejects `tile4-depth-front` as the one strategy. | Promote only if one deterministic tile policy validates with screenshots and remains neutral-or-better than slices across the hard set. | Reject if the remaining win requires routing/gates or if visual checks fail. |
+| A33 | ✅ Accepted | Projected screen-space grouping is the current direct-matrix order baseline. | Tested 4x4 and 8x8 projected screen tiles with depth-front/back and scanline-forward/reverse ordering on the hard split set. A34 validated `tile4-scanline-forward`, A35 rejected `tile4-depth-front`, and A96-A111 rejected nearby tile-count replacements. | Keep `tile4-scanline-forward` until a deterministic order improves GPU-hard intervals without p99 regressions. | Reopen only with a browser/compositor metric that explains a better universal order. |
 | A34 | ❌ Rejected | Tile4 spatial locality is useful, but row-major traversal may not be the best one-strategy order. | Tested single-strategy tile4 serpentine and Morton/Z-order traversals as new strategy IDs only. | Reopen only with a new traversal justified by a browser/compositor model. | Serpentine and Morton both lose `obj_house3` and remain below tile4 row-major average. |
+| A35 | ⚠️ Conditional | Order phase within a visible-face interval is a real lever, but the phase rule is unsolved. | A70-A95: fixed lookahead offsets, centered intervals, fractions, huge/local anchors, boundary screen-span anchors, tile-count sweeps, adaptive 3x3/5x5 tile density, interval-profiler comparison, exact interval order replay, large-blocker guards, and large-top pinning. Short windows found major wins, but validation rejected the best one-strategy candidates. A87/A93 show the same signature can win or lose depending on interval geometry, and A94/A95 show coarse per-face/per-span guards are insufficient. | Promote only if a browser/overlap-derived phase rule keeps the wins and removes the AncientCrashSite/`obj_house3` long-window losses without preset gates. | Reject if every deterministic phase rule collapses to model routing or blunt geometry guards. |
+| A112-A114 | ❌ Rejected | Scene-root transform decomposition can recover a compositor fast path. | Tested root `matrix3d(...)`, inner target-translation shell, host-level perspective, transform-function perspective, and removing scene `will-change`. The decomposition variants were flat or worse; the only `no-will-change` 3s signal disappeared in 8s confirmation. | Reopen only with a Chromium-source-backed reason that changes which transform node is dirtied, not another equivalent CSS transform spelling. | Current variants keep the same dirty 3D subtree cost and do not improve validated p95/p99. |
+| A115-A128 | ✅ Accepted | Synthetic order wins are threshold/cadence effects, not a stable lower-cost order primitive. | Extended `bench/compositor-topology-probe.mjs` with fixed-leaf order mode, depth patterns, per-order metrics, frame buckets, and no-trace runs. 5000 high-overlap leaves can flip between ~60 and 110+ p95 by DOM order, but repeats show the test is near an unstable scheduler threshold. At 6000/7000/8000 leaves, all orders converge to ~60/~40/~30 p95. Flat-Z controls are fast. CSS root animation still skips PAC under trace but does not solve no-trace heavy-load cadence. | Use synthetic order probes to identify thresholds and trace causes, not to justify another model router or global order rule. | Reopen only if a synthetic variant changes heavy-load p95 while preserving identical leaf count and visual-equivalent 3D topology. |
+| A129-A137 | ✅ Accepted | Interactive root mutation is the dominant synthetic dirty-subtree trigger; nearby CSS APIs do not bypass it. | Added synthetic controls for leaf CSS flags, transform spelling, root scale, rotation delta, static root, CSS variables, registered variables, and individual `rotate`. Static 7000-leaf scenes remain near the 120fps bucket. JS transform, registered var, and `rotate` property updates all hit PAC/layerize; active CSS keyframes skip PAC but remain draw-bound at heavier loads. | Treat interactive rotation as dirtying the full 3D property tree unless Chromium exposes a true compositor-driven scrub path. Use root scale/screen footprint as a secondary pressure metric. | Reopen only if a new browser API updates the transform node without PAC during JS/pointer-driven scrubbing. |
+| A138-A146 | ✅ Accepted | The browser fast shape is fewer dirty 3D wrappers with many 2D children, not many 3D leaves. | Extended depth-group synthetic sweeps across wrapper counts, wrapper CSS flags, boxed wrappers, JS/CSS roots, and child-count scaling. Software-lane threshold was very low (8-12 clean, 50+ collapsed); A218 shows GPU keeps the same shape clean to roughly 112 wrappers. Valid containment does not help. Child count is secondary once wrappers are low. | Use this as the target browser shape only when exact visual depth can be represented within the GPU-lane wrapper threshold. | Reject grouped renderers that require per-leaf residual Z, clipping, quantized depth, or wrapper counts above the validated backend threshold. |
+| A147 | ✅ Accepted | Exact depth-wrapper fast paths are only viable below the GPU wrapper threshold, which still misses the hard high-plane class. | `bench/voxel-static-metrics.mjs` showed important models with 47-191 visible planes; A218 raises the clean GPU threshold to about 112, but `Treasure` 132, `obj_house3` 142, `scene_mechanic2` 163, `scene_house` 182, and AncientCrashSite/`scene_park` 191 still exceed it. | Use exact depth wrappers only as a special-case ceiling for GPU-hard, <=112-plane assets. | Reopen if a high-active-leaf real model appears below the GPU threshold and is not already capped on direct matrix. |
+| A148-A149 | ❌ Rejected | Coarse depth wrappers plus exact residual leaf `translateZ(...)` can preserve visual depth and keep the grouped fast path. | Added synthetic `hybrid-z8-d136`, `hybrid-z16-d136`, and `hybrid-z8-d250` variants. `group-z8` stays near 111 p95 with PAC/layerize about 1.1ms/f and draw about 0.13ms/f. `hybrid-z8-d136` falls to about 24 p95 with PAC/layerize about 3.7ms/f and draw about 6.7ms/f, matching per-leaf 3D cost. | Reopen only if exact residual depth can be expressed without putting a 3D transform on each leaf. | A residual leaf Z transform poisons the grouped shape; the browser treats it like many 3D leaves again. |
+| A150 | ❌ Rejected | Quantizing real-model depth into a low wrapper count is a plausible visual approximation. | Added `bench/voxel-depth-quantization-error.mjs` and wrote `bench/results/a150-depth-quantization-error.md`. With 2/4/8/12/16 bucket centers per axis, hard models still have huge projected center displacement. At 16 buckets/axis, already 48 wrappers, p95 center error remains 69.7px on `AncientCrashSite`, 64.3px on `desert2`, 85.2px on `Treasure`, 79.2px on `obj_house3`, 72.4px on `scene_mechanic2`, and 73.2px on `scene_house`. | Reopen only for a non-visual diagnostic mode or an explicitly lossy renderer. | Coarse wrapper counts are visibly wrong, and visually closer bucket counts still do not cover the high-plane GPU-hard class exactly. |
+| A151 | ❌ Rejected | Replace per-leaf 3D depth with per-leaf 2D projected offsets driven by scene-level CSS variables. | Added synthetic projection variants. At 7000 leaves, static 2D leaves stay cheap, but `var-transform` and registered `var-transform` fall to about 24 p95 with about 25ms/f of `UpdateLayoutTree` and about 4ms/f of PAC/layerize. `var-left-top` is worse at about 20 p95. | Reopen only if a compositor-driven projection API avoids style recalc for dependent leaf transforms. | Inherited camera variables make every dependent leaf style dirty; this moves the bottleneck rather than removing it. |
+| A152 | ❌ Rejected | Many smaller spatially bounded depth wrappers can avoid the high-wrapper collapse. | Added tiled depth-wrapper variants. With 7000 children, `group-z16` stays around 107-110 p95, while `tiled-z16-t2` creates 64 smaller wrappers and drops to about 59 p95. `group-z32` and `tiled-z32-t2` both remain slow, with tiled usually worse. Trace draw-property cost stays low, so the loss is cadence/threshold rather than a big per-frame main-thread event. | Reopen only with a tiling form that reduces transformed wrapper count, not one that multiplies it. | Bounds/overlap reduction does not compensate for multiplying dirty transformed wrappers. |
+| A153 | ⚠️ Conditional | Projected overlap/footprint can dominate per-leaf 3D cadence even when DOM count and transform topology are unchanged. | Added `--depth-step` and `--perspective` to the synthetic probe. Under near-orthographic perspective, `leaf-z250` at depth-step 6 is about 17 p95 with draw about 6.6ms/f; depth-step 72 spreads projected leaves and rises to about 111 p95 with draw about 4.1ms/f. This is not a renderer trick because the visual footprint changes, but it explains why equal DOM/topology cases can land in different cadence buckets. | Use this to design overlap/footprint diagnostics and real-model interval analysis. | Reject only if normalized-screen-footprint probes show the effect disappears. |
+| A154 | ✅ Accepted | The depth-step win is primarily a projected-footprint win, not magic from larger Z values. | Added compensated depth variants that offset local Y by the root tilt so large-Z leaves project back into a compact footprint. At depth-step 72, `leaf-z250` is near 110+ p95 with screen fill about 0.01; `leaf-z250-comp` drops to about 60 p95 with screen fill about 0.55 and overlap about 0.40 pairs/leaf. The fast case has the same per-leaf Z topology but much lower projected density. | Treat screen density and overlap as first-class diagnostics. | Reopen only if another large-Z same-footprint test stays in the 100+ bucket. |
+| A155 | ⚠️ Conditional | Real-model interval drops are overlap/order-shape effects, not a single scalar like active leaves or fill. | Added `bench/voxel-interval-screen-metrics.mjs` and ran current renderer intervals for `ancient-crash-site`, `obj-house3`, and `scene-mechanic2`. `AncientCrashSite` is uniformly bad with about 5.2k active leaves and 6-9 overlap pairs/leaf. `obj_house3` has high-fill/high-overlap intervals that are still 100+ p95 and one similar interval at about 60 p95, so scalar density alone is insufficient. | Next tests should attribute overlap by face pair, depth direction, and tile-local source order. | Reject if a broader interval corpus shows a simple threshold cleanly predicts drops. |
+| A156 | ❌ Rejected | 2D spatial wrappers around exact per-leaf 3D leaves can give Chromium smaller subtrees without changing visuals. | Added synthetic `tile2d-z250-t2/t4/t8` variants. At depth-step 6, 7000 leaves stayed in the same slow class: baseline `leaf-z250` was around 10-17 p95 and tile2d variants topped out around 17 p95. At depth-step 12 they were flat at about 30 p95. | Reopen only if a real-model implementation shows a win not visible in the high-overlap synthetic class. | Spatial 2D wrappers do not remove per-leaf 3D draw-property pressure or projected overlap cost. |
+| A157-A159 | ❌ Rejected | Standalone dense-tile face ordering predicts a product win. | Added `bench/voxel-dom-order-probe.mjs` to render real voxel DOM with exact direct-matrix leaves and swap only tile-local ordering. The first standalone hard-set sweep looked promising, but A160-A161 product validation killed it: the apparent `obj_house3` win disappeared, fast intervals regressed, and the renderer patch was reverted. Under the GPU-lane reread, these medium-scene p95 moves are also capped/stress-lane evidence unless they improve p99 or a high-plane GPU-hard model. | Reopen only with a browser-source-backed tile-local metric that survives product validation on GPU-hard intervals. | The dense-tile face rule was a harness/window artifact, not a renderer direction. |
+| A160-A161 | ❌ Rejected | Product renderer dense-tile face ordering is a real candidate. | A160 patched `packages/polycss/src/render/voxelRenderer.ts` so the existing tile4 scanline order remained, but dense tiles (`sum projected bbox area / tile bbox area >= 4`) sorted by `FACE_ORDER`. A one-run window looked promising (`obj_house3` p95 59.9 -> 98.3), but A161 two-repeat validation killed it: `obj_house3` landed at 59.9/59.9 p95, `scene_mechanic2` at 59.2/59.5, and `AncientCrashSite` at 28.8/29.4. The patch also dragged previously fast `obj_house3` intervals down to ~60. Product renderer was reverted. | Reopen only with an interval-stable rule that improves `obj_house3` without moving its fast intervals into the 60 bucket. | Dense tile face order was a sample-window artifact, not a robust renderer win. |
+| A162 | ✅ Accepted | The residual cost is compositor-side, not DOM mutation, style, layout, or raster. | Added `bench/trace-frame-buckets.mjs` runs for current direct-matrix `obj_house3`, `scene_mechanic2`, and `AncientCrashSite`. Leaf counts stayed constant inside fast/slow buckets; style, layout, prepaint, and raster stayed tiny. The specific `SoftwareRenderer::DoDrawQuad` spike was a software-backend artifact later corrected by A211-A217, but GPU-hard traces still point at 3D property/draw-pass pressure rather than style/layout/raster. | Focus next tests on GPU-hard compositor shape: dirty 3D descendants, projected density, order, wrapper count, and per-pass visible quad work. | Reopen only if a low-intrusion GPU trace shows style/layout/raster taking over after a renderer change. |
+| A163-A164 | ❌ Rejected | Direct inline `background` color is a cheaper DrawQuad state than `currentColor`. | Added `--paints` to `bench/voxel-dom-order-probe.mjs`. Standalone `inline-background-shorthand` looked promising on `obj_house3` (`current-color` ~30-34 p95, shorthand ~56 p95), but the real renderer rejected it. Temporary product patch `el.style.background = color` dropped `obj_house3` to 30.2/32.5 p95 and `scene_mechanic2` to 30.0/30.1 p95; `AncientCrashSite` stayed around 17-20 p95. Product renderer was reverted and bench bundles rebuilt. | Reopen only if a trace proves a different paint declaration changes DrawQuad type without hurting product cadence. | The standalone paint signal was harness-specific; product `currentColor` stays. |
+| A165 | ❌ Rejected | Direct-matrix leaves do not need `transform-style: preserve-3d` because they have no children. | Extended `bench/voxel-dom-order-probe.mjs` with `--leaf-transform-styles`. On the current hostless direct-matrix shape, `flat` was catastrophic: `obj_house3` fell from ~40 p95 in the standalone window to ~11-12, `scene_mechanic2` to ~8-10, and `AncientCrashSite` to ~4. Product renderer was not patched. | Reopen only if a different DOM shape removes leaf 3D transforms entirely. | `preserve-3d` remains necessary for the current direct-matrix leaves. |
+| A166-A167 | ❌ Rejected | `backface-visibility: hidden` can cheaply discard already camera-culled direct voxel leaves. | Extended `bench/voxel-dom-order-probe.mjs` with `--leaf-backfaces`. Standalone was split: hidden helped `AncientCrashSite` and `scene_mechanic2`, but hurt `obj_house3`. Product validation rejected it as a default: hidden put `obj_house3` at 39.8/40.0 p95, `scene_mechanic2` at 38.0/30.0, and `AncientCrashSite` at 20.2/20.0 with bad p99 tails. Product CSS was reverted. | Reopen only for a visually validated non-default diagnostic or if a new culling rule proves hidden is safe for all intervals. | `visible` remains the default voxel leaf backface state. |
+| A168 | ❌ Rejected | Move brush size from `matrix3d` scale columns into the CSS box and keep the transform as a unit-orientation matrix. | Extended `bench/voxel-dom-order-probe.mjs` with `--transform-shapes=matrix-scale,css-size-unit-matrix`. The real CSS rect + unit matrix shape was flat on `obj_house3` (~40 p95 both), noisy/flat on `AncientCrashSite`, and worse on `scene_mechanic2` (baseline repeat reached 38.5 p95; unit-matrix repeats stayed ~30). Product renderer was not patched. | Reopen only if a different browser trace shows scaled local rects specifically causing DrawQuad cost. | Moving scale out of the matrix does not unlock a cheaper compositor path. |
+| A169 | 🟡 Flat | Leaf containment changes paint/property-tree isolation enough to affect DrawQuad cadence. | Extended `bench/voxel-dom-order-probe.mjs` with `--leaf-contains=none,paint,strict`. On `obj_house3`, all modes stayed at ~40 p95. `AncientCrashSite` stayed around 17-18 p95. `scene_mechanic2` stayed around 39 p95 with noisy p50. Product renderer was not patched. | Reopen only if a renderer shape makes style/layout or invalidation visible in trace. | Current direct-matrix leaves are draw-bound, not containment-bound. |
+| A170-A173 | ⚠️ Conditional | Reducing GPU-visible quad work may matter only for high-leaf GPU-hard models. | Added `bench/trace-event-args.mjs` and `bench/voxel-occlusion-potential.mjs`. Trace args show `NumberOfQuads` is basically mounted leaf count; Chromium is not automatically dropping occluded voxel quads. A coarse occlusion estimator found large potential hidden-leaf ratios, but the naive grid-cull p95 wins were software-lane/capped-medium evidence and A174-A210 later rejected sampled culling as a product path. | Reopen only with an exact or conservative interval-stable proof that removes material leaves on `AncientCrashSite`, `skyscraper`, or long-window `army` while preserving order and screenshots. | Do not count capped-medium wins or sampled-mask wins as evidence for this lever. |
+| A174-A188 | ❌ Rejected | A simple sampled screen-coverage cull can be made visual-safe with only higher resolution or a minimum projected size. | Added `--visual-diff`, fixed the static screenshot harness, and tested grid resolutions plus `--occlusion-min-cells`. Higher resolution did not fix visual failures. `min-cells=64` passed the hard-set visual diff but culled too little and was flat/worse in perf. `min-cells=48` also passed the hard set, but was similarly flat and regressed `scene_mechanic2` cadence. | Reopen only as a debugging baseline for a better culling proof. | Sampled coverage alone has a bad visual/perf tradeoff. |
+| A189-A199 | ⚠️ Conditional | Interior-neighbor guarded occlusion keeps silhouettes while preserving useful culling. | Added `--occlusion-interior-radius`. Radius 1 and 2 passed the hard-set fixed-angle visual diff and removed substantial leaves there. On the broader set, radius 1/2 still failed `treasure` and one `army` angle. Adding a sampled z-buffer and depth margin did not fix `treasure`, so the failure is not just average-depth sorting. | Continue only if a global conservative rule passes the broad visual set, or if the next implementation uses exact geometry rather than sampled masks. | Reject the current radius-only rule as a default because `treasure` fails visual checks. |
+| A200-A206 | ⚠️ Conditional | Visual-safe conservative occlusion is possible, but the observed FPS win is entangled with DOM order. | `interior-radius=1` plus `min-cells=20` passed 56 fixed-angle screenshots across `obj_house3`, `scene_mechanic2`, `AncientCrashSite`, `treasure`, `army`, `skyscraper`, and `desert2`. Perf without preserving source order showed some wins (`obj_house3` ~60 -> ~109, `desert2` ~110 -> ~112, `treasure` p50 improved), but also a `scene_mechanic2` regression. After adding `--occlusion-preserve-order`, most wins vanished: `obj_house3` became flat, `scene_mechanic2` stayed flat, `AncientCrashSite` stayed flat, while `desert2` still improved. | Next isolate order and culling separately. A shippable version needs either exact culling that helps while preserving the current order, or a separately validated order rule that does not regress `scene_mechanic2`/`treasure`. | Do not port the current sampled cull to product; the best-looking win is partly a front-to-back order artifact. |
+| A207 | ❌ Rejected | A single alternate tile-local DOM order can make the visual-safe sampled cull shippable. | Held the broad visual-safe cull fixed (`interior-radius=1`, `min-cells=20`, preserved source order through cull) and compared `tile4-source`, depth-front/back, face, top-first, and top-last on the hard set. Winners conflict: `obj_house3` needs depth-front/face/top-first (~108-111 p95), `scene_mechanic2` needs source/top-last (~108-110 p95), and `AncientCrashSite` stays around 30 p95 with only p99 churn. | Stop trying to rescue sampled cull by picking another universal order. If cull returns, it needs exact/conservative geometry or an order rule derived from compositor behavior and validated visually. | Reopen only if a new cull changes the candidate set rather than reordering the same sampled survivors. |
+| A208-A210 | ❌ Rejected | Interval-stable sampled culling can be product-real and still profitable. | Added `--occlusion-interval-samples` so a cull keeps any leaf needed at sampled angles across the whole visible-face interval, matching the renderer's no-per-frame-remount constraint. It passed the seven-model visual set, but removed too little at p50: `obj_house3` 1057 -> 1050 leaves, `scene_mechanic2` 2216 -> 2212, Ancient effectively unchanged, `skyscraper` 5766 -> 5694. A cached/long-warmup control reduced the cull-computation p99 artifact, but did not change the core leaf-count problem. | Do not pursue sampled culling as a renderer path unless it becomes exact, interval-stable, and removes materially more leaves while preserving order. | Reopen only with a different proof that can cull across a full visible interval rather than at one angle. |
+| A211-A217 | ✅ Accepted | The benchmark compositor backend changes the apparent bottleneck. | Default bundled Playwright Chromium on `obj_house3` emitted `SoftwareRenderer::DoDrawQuad` and measured about 60 p95; system Chrome and bundled Chromium with `--use-angle=metal --enable-gpu-rasterization` emitted zero `SoftwareRenderer::DoDrawQuad`, dropped `DirectRenderer::DrawRenderPass` from ~6-16ms to ~1.3ms in the fast bucket, and measured ~112-114 p95. A seven-model GPU sweep put `obj_house3`, `scene_mechanic2`, `treasure`, and `desert2` near 112 p95, while 5k+ leaf models (`AncientCrashSite`, `skyscraper`) remained around 58-59 p95 and `army` stayed window-sensitive. The bench harness now makes this GPU lane the default and exposes `--software-backend` for the old stress lane. | Report browser executable/args/backend for future runs. Treat software-renderer-only wins/losses as bench-environment findings until confirmed on the GPU path. The remaining true renderer target is still reducing dirty 3D descendant/draw-property pressure for 5k+ leaves. | Reopen only if the default bench browser starts emitting `SoftwareRenderer::DoDrawQuad` again or GPU-path traces show the same medium-scene 60fps ceiling. |
+| A218 | ✅ Accepted | GPU backend raises the grouped-depth-wrapper threshold, but not enough for the hard high-plane models. | Re-ran synthetic depth groups with ANGLE/Metal. With 7000 leaves under JS root rotation, exact grouped Z wrappers stayed near 112 p95 through `group-z112`, fell to ~60 p95 at `group-z128`, collapsed at `group-z136`, and became unusable by `group-z192`; per-leaf 3D depth stayed slow. Current visible exact-plane counts for hard models are still above the clean GPU threshold: `AncientCrashSite` 191, `skyscraper` 173, `army` 187, `obj_house3` 142, `scene_mechanic2` 163, `treasure` 132; only `desert2` at 102 is under it and is already fast on GPU. | Keep grouped-depth wrappers as a GPU-lane special-case ceiling for <=112 visible planes, not as the universal voxel renderer. | Reopen if a real high-leaf model has <=112 exact visible planes and is not already capped on direct matrix. |
 
 ## Closed Rejections
 
@@ -387,7 +645,7 @@ Probe A37 tile4 traversal sweep, p95 FPS medians:
 | --- | --- | --- | --- |
 | R1 | ❌ Rejected | Naive scene/mesh/host boxes without visual-preserving transform compensation. | Some scene-box variants hit a fast compositor path, but screenshots were blank, cropped, or off-center; not acceptable as a renderer change. |
 | R2 | ❌ Rejected | Matrix atom split for voxel scenes. | Did not beat the dedicated voxel slice renderer. |
-| R3 | ❌ Rejected | Inner depth hosts or sibling `(axis, depth)` wrappers as a default renderer. | Extra transformed 3D hierarchy was much slower on real high-plane models. Synthetic probes reopen only a strict low-visible-plane benchmark gate. |
+| R3 | ❌ Rejected | Inner depth hosts or sibling `(axis, depth)` wrappers as a default renderer. | Extra transformed 3D hierarchy was much slower on real high-plane models. Synthetic probes reopen only a narrow GPU-lane exact-plane special case, not a default renderer. |
 | R4 | ❌ Rejected | Nested cartesian coordinate wrappers. | Incompatible with merged rectangles and expected wrapper explosion. |
 | R5 | ❌ Rejected | `matrix3d` inside brush leaves while keeping the three voxel hosts. | Host+brush matrix did not beat `left/top/width/height + translateZ`; the promising version removes the axis hosts entirely and uses a non-degenerate normal column. |
 | R6 | ❌ Rejected | Mount all six face directions. | Extra active DOM dominated any mutation savings. |
@@ -406,17 +664,90 @@ Probe A37 tile4 traversal sweep, p95 FPS medians:
 | R19 | ❌ Rejected | Opacity culling for hidden faces. | Keeps paint/composite work alive; contradicts all-faces result. |
 | R20 | ❌ Rejected | CSS paint worklet face generation. | Violates no-JS/render-loop direction and is unlikely to be reliable. |
 | R21 | ❌ Rejected | JS-scrubbed compositor animation as an interactive camera fix. | Paused WAAPI `currentTime` and JS-driven scroll-timeline `scrollLeft` probes both hit PAC once per frame, matching the normal JS transform mutation path. |
+| R22 | ❌ Rejected | Per-leaf square primitive normalization as the default voxel direct-matrix shape. | Clean-rebuild A63-A66 runs show exact square, capped square, axis/face splits, and size bands are flat or short-window cadence artifacts; the 8s confirmation kept `scene_mechanic2` at baseline. |
+| R23 | ❌ Rejected | Constant order lookahead or centered-interval order as the default. | A70-A76 found real wins, but every tested phase rule kept hard counterexamples: fixed `+30deg` regressed `obj_house3`, centered/fractional interval order left `obj_house3` p99 tails, and per-item huge-rectangle fallback did not fix it. |
+| R24 | ❌ Rejected | Boundary screen-span anchors or adaptive 3x3/5x5 tile density as the default order rule. | A80-A86 found strong 3s wins, including `scene_mechanic2` near the cap and Garden/Treasure improvements. The 8s validation rejected the rule: AncientCrashSite fell ~38 -> ~30 p95 and `obj_house3` fell ~98 -> ~60 p95. |
+| R25 | ❌ Rejected | Protecting top faces or reversing scanline traversal fixes the interval-order losses. | A88-A91 showed why the adaptive phase rule failed, then tested two derived fixes. Top-face anchoring killed Garden/Scene/Treasure wins; reverse scanline traversal was broadly worse and collapsed `obj_house3`. |
+| R26 | ❌ Rejected | Large-blocker guards or large-top pinning make centered interval order safe. | A94 pinned large top occluders while filling product tile4 slots from centered order; A95 used centered order only when a projected leaf spanned more than one coarse tile. A94 regressed `obj_house3` ~60 -> ~40 p95 and A95 kept the same `obj_house3` loss while providing no broad win. |
+| R27 | ❌ Rejected | Plain tile3 or tile6 current-screen order replaces tile4. | A97 tile3-current improves AncientCrashSite in a short window but regresses `obj_house3` ~60 -> ~40 p95. A101 tile6-current is flat/worse than tile5 in the matched 8s hard set. |
+| R28 | ❌ Rejected | Tile5 serpentine or reverse scanline traversal improves on tile5 forward. | A104 tile5-serpentine collapses `obj_house3` and Skyscraper and loses the Garden win. A105 tile5-reverse gives Desert2 a large short-window win but also collapses `obj_house3`; traversal direction is not the clean win. |
+| R29 | ❌ Rejected | Tile5 scanline-forward is a safer default than tile4. | A99/A102 looked clean on the hard set, but A108-A111 broad corpus validation found no broad win, a confirmed `scene_house3` p95 loss, and p99 tail regressions on `mailbox`, `scene_house`, and `scene_army`. |
+| R30 | ❌ Rejected | Re-spelling or splitting the scene transform chain fixes direct-matrix rotation cadence. | A112-A114 show root `matrix3d(...)`, inner target shell, host perspective, transform-function perspective, and scene `will-change: auto` are flat or worse after longer validation. |
+| R31 | ❌ Rejected | Depth-sort only projected high-overlap real-model tiles. | A119 translated the synthetic overlap/depth result into the real voxel renderer as a bench-only mode. It avoided `obj_house3` collapse but produced no useful win and regressed `scene_house3` by ~10 p95; `Garden`, `Treasure`, and `army` picked up p99 tail losses. |
+| R32 | ❌ Rejected | CSS custom properties, registered properties, or individual `rotate` avoid interactive root-transform PAC. | A135-A137 show all three still hit PAC/layerize like normal JS transform mutation. Unregistered transform vars also add large style cost in trace. |
+| R33 | ❌ Rejected | Paint containment on 0x0 depth wrappers is a valid speedup. | A142 looked fast with `contain: paint`/`strict`, but hit-testing showed children were clipped out. A143 boxed the wrappers so containment was visually valid and the win disappeared. |
+| R34 | ❌ Rejected | Exact residual per-leaf `translateZ(...)` under coarse wrappers. | A148-A149 show this collapses back to per-leaf 3D transform cost. Coarse grouping only wins when children stay 2D. |
+| R35 | ❌ Rejected | Depth quantization to force hard real models under the clean wrapper threshold. | A150 shows the visual error is far too large. Even 48 wrappers per view is still visibly displaced, and approximation is not acceptable for the default renderer. |
+| R36 | ❌ Rejected | CSS-variable 2D projection as the interactive renderer shape. | A151 shows dependent leaf transforms cause whole-subtree style recalc, around 25ms/f at 7000 leaves. |
+| R37 | ❌ Rejected | Spatially tiled depth wrappers as a way around the wrapper-count ceiling. | A152 shows more bounded wrappers are slower than fewer broad wrappers at the same child count. |
+| R38 | ❌ Rejected | Exact per-leaf 3D leaves inside 2D spatial wrappers. | A156 shows 2D tile wrappers are flat or only marginal in synthetic high-overlap cases; they do not change the core browser cost shape. |
+| R39 | ❌ Rejected | Full face order or full depth order as the replacement for tile4 source order. | A157-A161 show full face order rescues `obj_house3` but collapses `scene_mechanic2`; full depth variants are also model/interval-specific, and dense-tile face order did not survive product validation. |
+| R40 | ❌ Rejected | Dense-tile face order as the product default. | A160-A161 show the apparent win disappears under two-repeat interval validation and can regress fast intervals. |
+| R41 | ❌ Rejected | Inline `background`/`background-color` instead of `currentColor` for direct voxel leaves. | A163-A164 show a standalone paint-state win did not transfer to the product renderer and caused major p95 regressions on `obj_house3` and `scene_mechanic2`. |
+| R42 | ❌ Rejected | Leaf `transform-style: flat` on hostless direct-matrix voxel leaves. | A165 shows this is catastrophically slower even though leaves have no children. |
+| R43 | ❌ Rejected | `backface-visibility: hidden` for direct voxel leaves. | A166-A167 show a split standalone result and product regressions on `obj_house3` and `scene_mechanic2`; it is not a single default strategy. |
+| R44 | ❌ Rejected | CSS width/height plus unit-orientation matrix instead of scaled 1px matrix leaves. | A168 shows the visual-equivalent transform shape is flat or worse in the standalone real-model harness. |
+| R45 | 🟡 Flat | Leaf `contain: paint` or `contain: strict` on direct voxel leaves. | A169 shows containment does not move the hard set meaningfully. |
+| R46 | ❌ Rejected | Naive sampled screen-coverage occlusion as a default. | A174-A188 show the raw grid cull either fails screenshots or becomes too conservative to help. |
+| R47 | ❌ Rejected | Interior-neighbor sampled occlusion alone explains the win. | A200-A206 show the visual-safe cull mostly goes flat when source order is preserved; the large wins are mixed with front-to-back DOM order. |
+| R48 | ❌ Rejected | Pairing visual-safe sampled occlusion with one alternate tile-local order. | A207 shows the same cull needs opposite order phases for `obj_house3` and `scene_mechanic2`; no single tested order is safe across the hard set. |
+| R49 | ❌ Rejected | Product-real interval-stable sampled occlusion. | A208-A210 pass screenshots but remove almost no p50 DOM once the mounted set must be valid across the whole face interval; caching boundary computation does not change that. |
 
 ## Next Concrete Order
 
 1. Do not rerun the whole A31/A32 table for every small idea. Run only new
    strategy IDs; rerun the full hard split set only when the DOM shape,
    culling, or measurement harness changes.
-2. Screenshot-check `tile4-scanline-forward` against the current voxel slice
-   renderer on the hard split set. If visuals pass, keep it as the broad
-   direct-matrix prototype baseline.
-3. If screenshots pass, port `tile4-scanline-forward` as the direct-matrix
-   prototype order and compare it against the current voxel slice renderer in
-   the gallery manually.
-4. Keep declarative auto-rotate work separate from pointer-driven rotation; it
+2. Keep the committed hostless direct-matrix renderer as the baseline shape:
+   1px desktop / 8px mobile canonical leaves, exact `±1` normal column, and
+   tile4 scanline order.
+3. Treat 100+ FPS as a capped tie. Promote a variant only when it moves an
+   uncapped model in longer samples without introducing a p99 tail loss.
+4. For order-phase work, segment frames by visible-face interval before
+   testing another global rule. The same strategy can win one interval and
+   lose another, which short aggregate windows hide.
+5. Do not add another coarse per-face/per-span guard without a new trace-backed
+   reason. A93-A95 already reject signature-only routing, top-face protection,
+   large-blocker presence, and large-top pinning as sufficient predictors.
+6. Treat scene-shell transform changes as closed unless the new variant changes
+   dirty transform-node topology rather than CSS spelling.
+7. Use the synthetic harness for threshold finding with frame buckets, but do
+   not promote a synthetic order result unless it survives heavier-load
+   validation, not just a near-threshold 5000-leaf flip.
+8. For interactive rotation, stop testing transform spelling/API aliases unless
+   they can be proven to update the compositor transform node without PAC.
+9. Prioritize renderer ideas that reduce exact transformed 3D descendants on
+   the GPU-hard class. The old low-teens wrapper ceiling was software-lane; on
+   GPU, exact wrappers stay clean to about 112, but hard models still exceed
+   that range. Do not pursue residual per-leaf Z or depth quantization.
+10. Keep declarative auto-rotate work separate from pointer-driven rotation; it
    may still be useful for demos, but it is not the interactive renderer fix.
+11. Treat projected overlap/footprint as a GPU-hard explanatory variable, not
+    a reason to chase capped medium scenes. The next useful tests should
+    measure or normalize projected overlap on `AncientCrashSite`, `skyscraper`,
+    and long-window `army`, not add more transform spellings.
+12. For real models, inspect interval-level overlap attribution before another
+    ordering change, but focus it on uncapped GPU-hard intervals. Earlier
+    `obj_house3`/`scene_mechanic2` order results are now mostly capped/tie
+    evidence unless they reveal p99 regressions.
+13. Do not promote a candidate from one partial rotation window. A160 looked
+    like a breakthrough and A161 showed it was phase/window-sensitive. Future
+    order candidates need at least two repeats across a full interval mix.
+14. Treat software `DoDrawQuad` cost as a stress-lane bottleneck, not the
+    default optimization target. On GPU, the hard cases still show dirty 3D
+    descendant, draw-property, and draw-pass pressure; new ideas should explain
+    how they reduce that pressure without depending on software renderer
+    behavior.
+15. Keep occlusion on the table only as an exact/geometric proof. A207 rejects
+    rescuing the sampled mask with one alternate tile-local order, and
+    A208-A210 show interval-stable sampled culling removes too little to pay
+    for itself under the renderer's no-per-frame-remount constraint.
+16. Future perf runs default to the GPU lane. Use `--software-backend` only
+    when intentionally stress-testing the old SoftwareRenderer path.
+17. Do not reopen exact depth wrappers as the default just because the GPU
+    threshold is higher. The unresolved models still exceed the clean wrapper
+    range; use wrappers only as a validated GPU-lane special case.
+18. Rerun old candidates only when they target the GPU-hard class. Software-
+    only wins on `obj_house3`, `scene_mechanic2`, `treasure`, or `desert2`
+    should not drive new renderer work unless they also improve GPU p99 or a
+    high-plane model.
diff --git a/bench/build.mjs b/bench/build.mjs
index 0ab59915..93148111 100644
--- a/bench/build.mjs
+++ b/bench/build.mjs
@@ -1,5 +1,5 @@
 /**
- * Bundle the four bench renderer paths into self-contained browser ESM
+ * Bundle bench renderer paths and helper entries into self-contained browser ESM
  * files that the perf-*.html pages can `import` directly:
  *
  *   bench/polycss.js          ← imperative API (createPolyScene + controls
diff --git a/bench/chromium-defaults.mjs b/bench/chromium-defaults.mjs
new file mode 100644
index 00000000..3c2a15f4
--- /dev/null
+++ b/bench/chromium-defaults.mjs
@@ -0,0 +1,11 @@
+export const BENCH_GPU_CHROMIUM_ARGS = [
+  ...(process.platform === "darwin" ? ["--use-angle=metal"] : []),
+  "--enable-gpu-rasterization",
+];
+
+export function chromiumArgsWithGpuDefault(extraArgs = [], { softwareBackend = false } = {}) {
+  return [
+    ...(softwareBackend ? [] : BENCH_GPU_CHROMIUM_ARGS),
+    ...extraArgs,
+  ];
+}
diff --git a/bench/compositor-topology-probe.mjs b/bench/compositor-topology-probe.mjs
index d64e3b52..d5a22712 100644
--- a/bench/compositor-topology-probe.mjs
+++ b/bench/compositor-topology-probe.mjs
@@ -6,16 +6,21 @@
  * behavior under a rotating preserve-3d root:
  *   - topology: equal leaf count, different leaf transform topology
  *   - distribution: equal matrix3d leaves, different projected distribution
+ *   - order: equal matrix3d leaves, same positions, different DOM order
  *   - depth-groups: per-leaf translateZ versus depth-plane wrappers
+ *   - projection: per-leaf depth folded into 2D projected offsets
  *
  * Usage:
  *   node bench/compositor-topology-probe.mjs
  *   node bench/compositor-topology-probe.mjs --mode=topology --leaves=5000
  *   node bench/compositor-topology-probe.mjs --mode=distribution --headed
+ *   node bench/compositor-topology-probe.mjs --mode=order --leaves=2500 --spacing=3
  *   node bench/compositor-topology-probe.mjs --mode=depth-groups --leaves=5000
+ *   node bench/compositor-topology-probe.mjs --mode=projection --leaves=7000
  *   node bench/compositor-topology-probe.mjs --mode=depth-groups --root=js
  */
 import { chromium } from "playwright";
+import { chromiumArgsWithGpuDefault } from "./chromium-defaults.mjs";
 
 const args = new Map(
   process.argv.slice(2).map((arg) => {
@@ -31,12 +36,44 @@ const WARMUP_MS = Number(args.get("warmup-ms") ?? 700);
 const HEADED = args.has("headed");
 const JSON_OUT = args.has("json");
 const EXECUTABLE = args.get("browser");
+const SOFTWARE_BACKEND = args.has("software-backend");
+const EXTRA_CHROMIUM_ARGS = (args.get("chromium-args") ?? "")
+  .split(/\s+/)
+  .map((value) => value.trim())
+  .filter(Boolean);
 const ROOT = args.get("root");
+const TRACE = !args.has("no-trace");
+const SPACING = Number(args.get("spacing") ?? 3);
+const LEAF_SIZE = Number(args.get("size") ?? 6);
+const DEPTHS = Math.max(1, Number(args.get("depths") ?? 17));
+const DEPTH_STEP = Number(args.get("depth-step") ?? 6);
+const DEPTH_PATTERN = args.get("depth-pattern") ?? "mixed";
+const LEAF_TRANSFORM_STYLE = args.get("leaf-transform-style") ?? "preserve-3d";
+const LEAF_BACKFACE = args.get("leaf-backface") ?? "visible";
+const LEAF_WILL_CHANGE = args.get("leaf-will-change") ?? "";
+const LEAF_CONTAIN = args.get("leaf-contain") ?? "";
+const SCENE_WILL_CHANGE = args.get("scene-will-change") ?? "transform";
+const ORDER_TRANSFORM = args.get("order-transform") ?? "matrix3d";
+const DEPTH_TRANSFORM_STYLE = args.get("depth-transform-style") ?? "preserve-3d";
+const DEPTH_WILL_CHANGE = args.get("depth-will-change") ?? "";
+const DEPTH_CONTAIN = args.get("depth-contain") ?? "";
+const DEPTH_BOX = args.has("depth-box");
+const ROOT_SCALE = Number(args.get("root-scale") ?? 0.7);
+const ROOT_ROT_X = Number(args.get("root-rot-x") ?? 65);
+const ROOT_ROT_STEP = Number(args.get("root-rot-step") ?? 0.5);
+const PERSPECTIVE = Number(args.get("perspective") ?? 8000);
+const VARIANT_FILTER = new Set(
+  (args.get("variants") ?? "")
+    .split(",")
+    .map((value) => value.trim())
+    .filter(Boolean),
+);
 
 const CHROMIUM_ARGS = [
   "--disable-background-timer-throttling",
   "--disable-renderer-backgrounding",
   "--disable-backgrounding-occluded-windows",
+  ...chromiumArgsWithGpuDefault(EXTRA_CHROMIUM_ARGS, { softwareBackend: SOFTWARE_BACKEND }),
 ];
 
 const TRACE_CATEGORIES = [
@@ -66,6 +103,13 @@ function summarizeFrameTimes(dts) {
     fps_p50: +(1000 / p50).toFixed(1),
     fps_p95: +(1000 / p95).toFixed(1),
     p99_ms: +p99.toFixed(1),
+    buckets: {
+      x1: sorted.filter((value) => value < 10).length,
+      x2: sorted.filter((value) => value >= 10 && value < 18).length,
+      x3: sorted.filter((value) => value >= 18 && value < 26).length,
+      x4: sorted.filter((value) => value >= 26 && value < 34).length,
+      slow: sorted.filter((value) => value >= 34).length,
+    },
   };
 }
 
@@ -163,35 +207,259 @@ function distributionStyle(variant, i) {
   return `width:1px;height:1px;transform:matrix3d(6,0,0,0,0,6,0,0,0,0,1,0,${x},${y},${z},1);`;
 }
 
+function hashIndex(i) {
+  let value = Math.imul(i + 0x9e3779b9, 0x85ebca6b);
+  value ^= value >>> 16;
+  value = Math.imul(value, 0xc2b2ae35);
+  value ^= value >>> 16;
+  return value >>> 0;
+}
+
+function makeOrderItems(leaves) {
+  const cols = Math.max(1, Math.ceil(Math.sqrt(leaves)));
+  const rows = Math.ceil(leaves / cols);
+  const items = [];
+  for (let i = 0; i < leaves; i++) {
+    const col = i % cols;
+    const row = Math.floor(i / cols);
+    const centeredCol = col - (cols - 1) / 2;
+    const centeredRow = row - (rows - 1) / 2;
+    const depthIndex = orderDepthIndex({ i, col, row, cols, rows });
+    const z = (depthIndex - (DEPTHS - 1) / 2) * 6;
+    items.push({
+      i,
+      col,
+      row,
+      x: centeredCol * SPACING,
+      y: centeredRow * SPACING,
+      z,
+      depthIndex,
+      hash: hashIndex(i),
+    });
+  }
+  return items;
+}
+
+function orderDepthIndex({ i, col, row, cols, rows }) {
+  if (DEPTHS <= 1) return 0;
+  switch (DEPTH_PATTERN) {
+    case "flat":
+      return 0;
+    case "column":
+      return Math.floor((col / Math.max(1, cols - 1)) * (DEPTHS - 1));
+    case "row":
+      return Math.floor((row / Math.max(1, rows - 1)) * (DEPTHS - 1));
+    case "checker":
+      return (col + row) % DEPTHS;
+    case "random":
+      return hashIndex(i) % DEPTHS;
+    case "mixed":
+      return (col * 7 + row * 11) % DEPTHS;
+    default:
+      throw new Error(`Unknown depth pattern "${DEPTH_PATTERN}"`);
+  }
+}
+
+function sortOrderItems(items, variant) {
+  const sorted = [...items];
+  const tileCols = 4;
+  const maxCol = Math.max(1, ...items.map((item) => item.col));
+  const maxRow = Math.max(1, ...items.map((item) => item.row));
+  const tileIndex = (item) => {
+    const tx = Math.min(tileCols - 1, Math.floor((item.col / (maxCol + 1)) * tileCols));
+    const ty = Math.min(tileCols - 1, Math.floor((item.row / (maxRow + 1)) * tileCols));
+    return ty * tileCols + tx;
+  };
+  switch (variant) {
+    case "spatial":
+      return sorted.sort((a, b) => a.i - b.i);
+    case "depth-front":
+      return sorted.sort((a, b) => b.z - a.z || a.i - b.i);
+    case "depth-back":
+      return sorted.sort((a, b) => a.z - b.z || a.i - b.i);
+    case "random":
+      return sorted.sort((a, b) => a.hash - b.hash);
+    case "tile4-spatial":
+      return sorted.sort((a, b) => tileIndex(a) - tileIndex(b) || a.row - b.row || a.col - b.col);
+    case "tile4-depth":
+      return sorted.sort((a, b) => tileIndex(a) - tileIndex(b) || b.z - a.z || a.i - b.i);
+    case "tile4-depth-back":
+      return sorted.sort((a, b) => tileIndex(a) - tileIndex(b) || a.z - b.z || a.i - b.i);
+    case "block64-depth":
+      return sorted.sort((a, b) => {
+        const blockA = Math.floor(a.i / 64);
+        const blockB = Math.floor(b.i / 64);
+        return blockA - blockB || b.z - a.z || a.i - b.i;
+      });
+    default:
+      throw new Error(`Unknown order variant "${variant}"`);
+  }
+}
+
+function orderStyle(item) {
+  switch (ORDER_TRANSFORM) {
+    case "matrix3d":
+      return `width:1px;height:1px;transform:matrix3d(${LEAF_SIZE},0,0,0,0,${LEAF_SIZE},0,0,0,0,1,0,${item.x},${item.y},${item.z},1);`;
+    case "translate3d-scale":
+      return `width:1px;height:1px;transform:translate3d(${item.x}px,${item.y}px,${item.z}px) scale(${LEAF_SIZE});`;
+    case "translate3d-scale3d":
+      return `width:1px;height:1px;transform:translate3d(${item.x}px,${item.y}px,${item.z}px) scale3d(${LEAF_SIZE},${LEAF_SIZE},1);`;
+    case "translate3d-size":
+      return `width:${LEAF_SIZE}px;height:${LEAF_SIZE}px;transform:translate3d(${item.x}px,${item.y}px,${item.z}px);`;
+    case "left-top-translateZ":
+      return `left:${item.x}px;top:${item.y}px;width:${LEAF_SIZE}px;height:${LEAF_SIZE}px;transform:translateZ(${item.z}px);`;
+    default:
+      throw new Error(`Unknown order transform "${ORDER_TRANSFORM}"`);
+  }
+}
+
+function orderMetrics(items) {
+  const bounds = items.reduce((acc, item) => ({
+    minX: Math.min(acc.minX, item.x),
+    minY: Math.min(acc.minY, item.y),
+    maxX: Math.max(acc.maxX, item.x + LEAF_SIZE),
+    maxY: Math.max(acc.maxY, item.y + LEAF_SIZE),
+  }), { minX: Infinity, minY: Infinity, maxX: -Infinity, maxY: -Infinity });
+  const boundsArea = (bounds.maxX - bounds.minX) * (bounds.maxY - bounds.minY);
+  const localArea = items.length * LEAF_SIZE * LEAF_SIZE;
+  const estimatedPairOverlap = SPACING >= LEAF_SIZE
+    ? 0
+    : Math.max(0, LEAF_SIZE - SPACING) * LEAF_SIZE * 2 * items.length;
+  return {
+    spacing: SPACING,
+    leafSize: LEAF_SIZE,
+    depths: DEPTHS,
+    depthPattern: DEPTH_PATTERN,
+    orderTransform: ORDER_TRANSFORM,
+    localArea,
+    boundsArea: +boundsArea.toFixed(1),
+    fillRatio: boundsArea ? +(localArea / boundsArea).toFixed(3) : 0,
+    estimatedPairOverlap: +estimatedPairOverlap.toFixed(1),
+  };
+}
+
+function orderedMetrics(ordered) {
+  let sourceJump = 0;
+  let depthJump = 0;
+  let directionChanges = 0;
+  let depthRunCount = ordered.length ? 1 : 0;
+  let lastDepthDirection = 0;
+  const depthCounts = new Map();
+  for (const item of ordered) {
+    depthCounts.set(item.depthIndex, (depthCounts.get(item.depthIndex) ?? 0) + 1);
+  }
+  for (let i = 1; i < ordered.length; i += 1) {
+    const prev = ordered[i - 1];
+    const next = ordered[i];
+    sourceJump += Math.abs(prev.i - next.i);
+    const dz = next.z - prev.z;
+    depthJump += Math.abs(dz);
+    if (Math.abs(dz) > 1e-9) depthRunCount += 1;
+    const depthDirection = Math.sign(dz);
+    if (depthDirection !== 0) {
+      if (lastDepthDirection !== 0 && depthDirection !== lastDepthDirection) directionChanges += 1;
+      lastDepthDirection = depthDirection;
+    }
+  }
+  const denom = Math.max(1, ordered.length - 1);
+  return {
+    sourceJumpMean: +(sourceJump / denom).toFixed(2),
+    depthJumpMean: +(depthJump / denom).toFixed(2),
+    depthDirectionChanges: directionChanges,
+    depthRunCount,
+    depthBucketCount: depthCounts.size,
+  };
+}
+
+function makeOrderCells(variant, leaves) {
+  const items = makeOrderItems(leaves);
+  const ordered = sortOrderItems(items, variant);
+  return {
+    metrics: { ...orderMetrics(items), ...orderedMetrics(ordered) },
+    cells: ordered.map((item) => `<b style="${orderStyle(item)}"></b>`).join(""),
+  };
+}
+
 function parseDepthVariant(variant) {
-  const match = /^(leaf|group)-z(\d+)$/.exec(variant);
+  const match = /^(leaf|group)-z(\d+)(-comp)?$/.exec(variant);
+  if (match) {
+    return {
+      kind: match[1],
+      depthCount: Math.max(1, Number(match[2])),
+      actualDepthCount: Math.max(1, Number(match[2])),
+      compensateDepth: Boolean(match[3]),
+    };
+  }
+  const hybridMatch = /^hybrid-z(\d+)-d(\d+)$/.exec(variant);
+  if (hybridMatch) {
+    return {
+      kind: "hybrid",
+      depthCount: Math.max(1, Number(hybridMatch[1])),
+      actualDepthCount: Math.max(1, Number(hybridMatch[2])),
+    };
+  }
+  const tiledMatch = /^tiled-z(\d+)-t(\d+)$/.exec(variant);
+  if (tiledMatch) {
+    return {
+      kind: "tiled",
+      depthCount: Math.max(1, Number(tiledMatch[1])),
+      actualDepthCount: Math.max(1, Number(tiledMatch[1])),
+      tileCount: Math.max(1, Number(tiledMatch[2])),
+    };
+  }
+  const tile2dMatch = /^tile2d-z(\d+)-t(\d+)$/.exec(variant);
+  if (tile2dMatch) {
+    return {
+      kind: "tile2d",
+      depthCount: Math.max(1, Number(tile2dMatch[1])),
+      actualDepthCount: Math.max(1, Number(tile2dMatch[1])),
+      tileCount: Math.max(1, Number(tile2dMatch[2])),
+    };
+  }
   if (!match) throw new Error(`Unknown depth-groups variant "${variant}"`);
   return {
-    kind: match[1],
-    depthCount: Math.max(1, Number(match[2])),
+    kind: "group",
+    depthCount: 1,
+    actualDepthCount: 1,
   };
 }
 
 function depthPosition(i, leaves) {
   const cols = Math.max(1, Math.ceil(Math.sqrt(leaves)));
+  const rows = Math.max(1, Math.ceil(leaves / cols));
+  const col = i % cols;
+  const row = Math.floor(i / cols);
   return {
-    x: (i % cols) * 8 - 200,
-    y: Math.floor(i / cols) * 8 - 200,
+    col,
+    row,
+    cols,
+    rows,
+    x: col * 8 - 200,
+    y: row * 8 - 200,
   };
 }
 
 function depthValue(depthIndex, depthCount) {
-  return (depthIndex - (depthCount - 1) / 2) * 6;
+  return (depthIndex - (depthCount - 1) / 2) * DEPTH_STEP;
+}
+
+function compensateDepthPosition(position, z) {
+  return {
+    ...position,
+    y: position.y + z * Math.tan((ROOT_ROT_X * Math.PI) / 180),
+  };
 }
 
 function makeDepthGroupCells(variant, leaves) {
-  const { kind, depthCount } = parseDepthVariant(variant);
+  const { kind, depthCount, actualDepthCount, tileCount = 1, compensateDepth = false } = parseDepthVariant(variant);
   if (kind === "leaf") {
     const cells = [];
     for (let i = 0; i < leaves; i++) {
       const depthIndex = i % depthCount;
-      const { x, y } = depthPosition(i, leaves);
       const z = depthValue(depthIndex, depthCount);
+      const { x, y } = compensateDepth
+        ? compensateDepthPosition(depthPosition(i, leaves), z)
+        : depthPosition(i, leaves);
       cells.push(
         `<b style="left:${x}px;top:${y}px;width:6px;height:6px;transform:translateZ(${z}px);"></b>`,
       );
@@ -200,26 +468,146 @@ function makeDepthGroupCells(variant, leaves) {
   }
 
   const buckets = Array.from({ length: depthCount }, () => []);
+  const tiledBuckets = new Map();
+  const tile2dBuckets = new Map();
   for (let i = 0; i < leaves; i++) {
-    const depthIndex = i % depthCount;
-    const { x, y } = depthPosition(i, leaves);
-    buckets[depthIndex].push(
-      `<b style="left:${x}px;top:${y}px;width:6px;height:6px;"></b>`,
-    );
+    const actualDepthIndex = i % actualDepthCount;
+    const depthIndex = kind === "hybrid"
+      ? Math.min(depthCount - 1, Math.floor((actualDepthIndex / actualDepthCount) * depthCount))
+      : i % depthCount;
+    const actualZ = depthValue(actualDepthIndex, actualDepthCount);
+    const position = compensateDepth
+      ? compensateDepthPosition(depthPosition(i, leaves), actualZ)
+      : depthPosition(i, leaves);
+    const { x, y, col, row, cols, rows } = position;
+    if (kind === "tiled") {
+      const tx = Math.min(tileCount - 1, Math.floor((col / cols) * tileCount));
+      const ty = Math.min(tileCount - 1, Math.floor((row / rows) * tileCount));
+      const key = `${depthIndex}:${tx}:${ty}`;
+      const bucket = tiledBuckets.get(key) ?? { depthIndex, children: [] };
+      bucket.children.push({ x, y, actualZ });
+      tiledBuckets.set(key, bucket);
+      continue;
+    }
+    if (kind === "tile2d") {
+      const tx = Math.min(tileCount - 1, Math.floor((col / cols) * tileCount));
+      const ty = Math.min(tileCount - 1, Math.floor((row / rows) * tileCount));
+      const key = `${tx}:${ty}`;
+      const bucket = tile2dBuckets.get(key) ?? { children: [] };
+      bucket.children.push({ x, y, actualZ });
+      tile2dBuckets.set(key, bucket);
+      continue;
+    }
+    buckets[depthIndex].push({ x, y, actualZ });
+  }
+
+  const renderBoxedDepth = (children, z, renderChild) => {
+    const minX = Math.min(...children.map(({ x }) => x));
+    const minY = Math.min(...children.map(({ y }) => y));
+    const maxX = Math.max(...children.map(({ x }) => x + 6));
+    const maxY = Math.max(...children.map(({ y }) => y + 6));
+    const width = Math.max(0, maxX - minX);
+    const height = Math.max(0, maxY - minY);
+    const childHtml = children
+      .map((child) => renderChild(child, minX, minY))
+      .join("");
+    return `<div class="depth" style="left:${minX}px;top:${minY}px;width:${width}px;height:${height}px;transform:translateZ(${z}px)">${childHtml}</div>`;
+  };
+
+  if (kind === "tiled") {
+    return [...tiledBuckets.values()]
+      .map(({ depthIndex, children }) =>
+        renderBoxedDepth(
+          children,
+          depthValue(depthIndex, depthCount),
+          ({ x, y }, offsetX, offsetY) => `<b style="left:${x - offsetX}px;top:${y - offsetY}px;width:6px;height:6px;"></b>`,
+        )
+      )
+      .join("");
+  }
+
+  if (kind === "tile2d") {
+    return [...tile2dBuckets.values()]
+      .map(({ children }) => {
+        const minX = Math.min(...children.map(({ x }) => x));
+        const minY = Math.min(...children.map(({ y }) => y));
+        const maxX = Math.max(...children.map(({ x }) => x + 6));
+        const maxY = Math.max(...children.map(({ y }) => y + 6));
+        const width = Math.max(0, maxX - minX);
+        const height = Math.max(0, maxY - minY);
+        const childHtml = children
+          .map(({ x, y, actualZ }) =>
+            `<b style="left:${x - minX}px;top:${y - minY}px;width:6px;height:6px;transform:translateZ(${actualZ}px);"></b>`)
+          .join("");
+        return `<div class="tile2d" style="left:${minX}px;top:${minY}px;width:${width}px;height:${height}px;">${childHtml}</div>`;
+      })
+      .join("");
   }
 
   return buckets
     .map((children, depthIndex) => {
-      const z = depthValue(depthIndex, depthCount);
-      return `<div class="depth" style="transform:translateZ(${z}px)">${children.join("")}</div>`;
+      const z = kind === "hybrid"
+        ? depthValue(depthIndex + 0.5, depthCount)
+        : depthValue(depthIndex, depthCount);
+      const childStyle = ({ x, y, actualZ }, offsetX = 0, offsetY = 0) => {
+        const residual = kind === "hybrid" ? actualZ - z : 0;
+        const transform = Math.abs(residual) > 1e-9 ? `transform:translateZ(${residual}px);` : "";
+        return `<b style="left:${x - offsetX}px;top:${y - offsetY}px;width:6px;height:6px;${transform}"></b>`;
+      };
+      if (!DEPTH_BOX) {
+        return `<div class="depth" style="transform:translateZ(${z}px)">${
+          children.map((child) => childStyle(child)).join("")
+        }</div>`;
+      }
+      return renderBoxedDepth(children, z, childStyle);
     })
     .join("");
 }
 
+function makeProjectionCells(variant, leaves) {
+  const cols = Math.max(1, Math.ceil(Math.sqrt(leaves)));
+  const cells = [];
+  for (let i = 0; i < leaves; i++) {
+    const x = (i % cols) * 8 - 200;
+    const y = Math.floor(i / cols) * 8 - 200;
+    const z = ((i % 136) - 67.5) * 6;
+    const vars = `--x:${x}px;--y:${y}px;--z:${z}px;`;
+    switch (variant) {
+      case "static-left-top":
+        cells.push(`<b style="left:${x}px;top:${y}px;width:6px;height:6px;"></b>`);
+        break;
+      case "static-transform":
+        cells.push(`<b style="width:6px;height:6px;transform:translate(${x}px,${y}px);"></b>`);
+        break;
+      case "var-transform":
+      case "registered-var-transform":
+        cells.push(`<b style="${vars}width:6px;height:6px;transform:translate(calc(var(--x) + var(--z) * var(--kx)),calc(var(--y) + var(--z) * var(--ky)));"></b>`);
+        break;
+      case "var-left-top":
+      case "registered-var-left-top":
+        cells.push(`<b style="${vars}left:calc(var(--x) + var(--z) * var(--kx));top:calc(var(--y) + var(--z) * var(--ky));width:6px;height:6px;"></b>`);
+        break;
+      case "translate3d-reference":
+        cells.push(`<b style="width:6px;height:6px;transform:translate3d(${x}px,${y}px,${z}px);"></b>`);
+        break;
+      default:
+        throw new Error(`Unknown projection variant "${variant}"`);
+    }
+  }
+  return cells.join("");
+}
+
 function makeHtml({ mode, variant, leaves, root }) {
   let cells = "";
+  let caseMetrics = null;
   if (mode === "depth-groups") {
     cells = makeDepthGroupCells(variant, leaves);
+  } else if (mode === "projection") {
+    cells = makeProjectionCells(variant, leaves);
+  } else if (mode === "order") {
+    const result = makeOrderCells(variant, leaves);
+    cells = result.cells;
+    caseMetrics = result.metrics;
   } else {
     const leafHtml = [];
     for (let i = 0; i < leaves; i++) {
@@ -232,41 +620,137 @@ function makeHtml({ mode, variant, leaves, root }) {
     cells = leafHtml.join("");
   }
 
+  const projectionMode = mode === "projection";
   const rootMotion =
-    root === "css"
+    projectionMode
+      ? `--kx:0;--ky:0;transform:scale(${ROOT_SCALE});`
+      : root === "css"
       ? "animation:spin 10s linear infinite;"
-      : "transform:scale(.7) rotateX(65deg) rotate(0deg);";
+      : root === "var" || root === "var-registered"
+        ? `--rot:0deg;transform:scale(${ROOT_SCALE}) rotateX(${ROOT_ROT_X}deg) rotate(var(--rot));`
+      : root === "rotate-prop"
+        ? `rotate:0deg;transform:scale(${ROOT_SCALE}) rotateX(${ROOT_ROT_X}deg);`
+      : `transform:scale(${ROOT_SCALE}) rotateX(${ROOT_ROT_X}deg) rotate(0deg);`;
+  const sceneWillChange = SCENE_WILL_CHANGE === "auto" ? "auto" : SCENE_WILL_CHANGE;
+  const leafExtra = [
+    `transform-style:${LEAF_TRANSFORM_STYLE}`,
+    `backface-visibility:${LEAF_BACKFACE}`,
+    LEAF_WILL_CHANGE ? `will-change:${LEAF_WILL_CHANGE}` : "",
+    LEAF_CONTAIN ? `contain:${LEAF_CONTAIN}` : "",
+  ].filter(Boolean).join(";");
+  const depthExtra = [
+    `transform-style:${DEPTH_TRANSFORM_STYLE}`,
+    DEPTH_WILL_CHANGE ? `will-change:${DEPTH_WILL_CHANGE}` : "",
+    DEPTH_CONTAIN ? `contain:${DEPTH_CONTAIN}` : "",
+  ].filter(Boolean).join(";");
   const script =
-    root === "css"
+    projectionMode
+      ? `const root=document.querySelector('.scene');const samples=[];let last=performance.now(),frame=0;function tick(now){samples.push(now-last);last=now;frame++;const a=frame*0.03;root.style.setProperty('--kx',(Math.sin(a)*0.9).toFixed(6));root.style.setProperty('--ky',(Math.cos(a)*0.6).toFixed(6));requestAnimationFrame(tick)}requestAnimationFrame(tick);window.__probe={samples};`
+      : root === "css"
       ? "const samples=[];let last=performance.now();function tick(now){samples.push(now-last);last=now;requestAnimationFrame(tick)}requestAnimationFrame(tick);window.__probe={samples};"
-      : "const root=document.querySelector('.scene');const samples=[];let last=performance.now(),frame=0;function tick(now){samples.push(now-last);last=now;frame++;root.style.transform='scale(.7) rotateX(65deg) rotate('+((frame*.5)%360)+'deg)';requestAnimationFrame(tick)}requestAnimationFrame(tick);window.__probe={samples};";
+      : root === "static"
+        ? "const samples=[];let last=performance.now();function tick(now){samples.push(now-last);last=now;requestAnimationFrame(tick)}requestAnimationFrame(tick);window.__probe={samples};"
+        : root === "var" || root === "var-registered"
+          ? `const root=document.querySelector('.scene');const samples=[];let last=performance.now(),frame=0;function tick(now){samples.push(now-last);last=now;frame++;root.style.setProperty('--rot',((frame*${ROOT_ROT_STEP})%360)+'deg');requestAnimationFrame(tick)}requestAnimationFrame(tick);window.__probe={samples};`
+        : root === "rotate-prop"
+          ? `const root=document.querySelector('.scene');const samples=[];let last=performance.now(),frame=0;function tick(now){samples.push(now-last);last=now;frame++;root.style.rotate=((frame*${ROOT_ROT_STEP})%360)+'deg';requestAnimationFrame(tick)}requestAnimationFrame(tick);window.__probe={samples};`
+        : `const root=document.querySelector('.scene');const samples=[];let last=performance.now(),frame=0;function tick(now){samples.push(now-last);last=now;frame++;root.style.transform='scale(${ROOT_SCALE}) rotateX(${ROOT_ROT_X}deg) rotate('+((frame*${ROOT_ROT_STEP})%360)+'deg)';requestAnimationFrame(tick)}requestAnimationFrame(tick);window.__probe={samples};`;
+  const registeredProperty = root === "var-registered"
+    ? "@property --rot { syntax: '<angle>'; inherits: false; initial-value: 0deg; }"
+    : variant.startsWith("registered-var-")
+      ? "@property --kx { syntax: '<number>'; inherits: true; initial-value: 0; } @property --ky { syntax: '<number>'; inherits: true; initial-value: 0; }"
+    : "";
 
   return `<!doctype html><meta charset="utf-8"><style>
+${registeredProperty}
 body{margin:0;background:#111;overflow:hidden}
-#host{position:relative;width:1280px;height:800px;perspective:8000px;transform-style:preserve-3d}
-.scene{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d;will-change:transform;${rootMotion}}
-.depth{position:absolute;left:0;top:0;width:0;height:0;transform-origin:0 0;transform-style:preserve-3d}
-b{position:absolute;display:block;background:#5eead4;transform-origin:0 0;transform-style:preserve-3d;backface-visibility:visible;margin:0;padding:0}
-@keyframes spin{from{transform:scale(.7) rotateX(65deg) rotate(0deg)}to{transform:scale(.7) rotateX(65deg) rotate(360deg)}}
-</style><div id="host"><div class="scene">${cells}</div></div><script>${script}</script>`;
+#host{position:relative;width:1280px;height:800px;perspective:${PERSPECTIVE}px;transform-style:preserve-3d}
+.scene{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d;will-change:${sceneWillChange};${rootMotion}}
+.depth{position:absolute;left:0;top:0;width:0;height:0;transform-origin:0 0;${depthExtra}}
+.tile2d{position:absolute;left:0;top:0;transform-origin:0 0;transform-style:preserve-3d}
+b{position:absolute;display:block;background:#5eead4;transform-origin:0 0;${leafExtra};margin:0;padding:0}
+@keyframes spin{from{transform:scale(${ROOT_SCALE}) rotateX(${ROOT_ROT_X}deg) rotate(0deg)}to{transform:scale(${ROOT_SCALE}) rotateX(${ROOT_ROT_X}deg) rotate(360deg)}}
+</style><div id="host"><div class="scene">${cells}</div></div><script>window.__caseMetrics=${JSON.stringify(caseMetrics)};${script}</script>`;
 }
 
 async function runCase(browser, config) {
   const page = await browser.newPage({ viewport: { width: 1280, height: 800 } });
   await page.setContent(makeHtml(config), { waitUntil: "load" });
+  const screenMetrics = await page.evaluate(() => {
+    const rects = [...document.querySelectorAll("b")].map((el) => {
+      const rect = el.getBoundingClientRect();
+      return {
+        left: rect.left,
+        top: rect.top,
+        right: rect.right,
+        bottom: rect.bottom,
+        width: rect.width,
+        height: rect.height,
+      };
+    }).filter((rect) => rect.width > 0 && rect.height > 0);
+    if (!rects.length) return null;
+    const bounds = rects.reduce((acc, rect) => ({
+      left: Math.min(acc.left, rect.left),
+      top: Math.min(acc.top, rect.top),
+      right: Math.max(acc.right, rect.right),
+      bottom: Math.max(acc.bottom, rect.bottom),
+    }), { left: Infinity, top: Infinity, right: -Infinity, bottom: -Infinity });
+    const screenArea = Math.max(1, (bounds.right - bounds.left) * (bounds.bottom - bounds.top));
+    const sumArea = rects.reduce((sum, rect) => sum + rect.width * rect.height, 0);
+    const sampleLimit = 8000;
+    const stride = Math.max(1, Math.floor(rects.length / sampleLimit));
+    const sampled = rects.filter((_, index) => index % stride === 0).slice(0, sampleLimit);
+    const sorted = sampled.map((rect, index) => ({ ...rect, index })).sort((a, b) => a.left - b.left);
+    const active = [];
+    let overlapPairs = 0;
+    let overlapArea = 0;
+    for (const current of sorted) {
+      for (let i = active.length - 1; i >= 0; i -= 1) {
+        if (active[i].right <= current.left) active.splice(i, 1);
+      }
+      for (const other of active) {
+        if (other.bottom <= current.top || other.top >= current.bottom) continue;
+        const x0 = Math.max(current.left, other.left);
+        const x1 = Math.min(current.right, other.right);
+        const y0 = Math.max(current.top, other.top);
+        const y1 = Math.min(current.bottom, other.bottom);
+        if (x1 <= x0 || y1 <= y0) continue;
+        overlapPairs += 1;
+        overlapArea += (x1 - x0) * (y1 - y0);
+      }
+      active.push(current);
+    }
+    return {
+      leaves: rects.length,
+      boundsWidth: +(bounds.right - bounds.left).toFixed(1),
+      boundsHeight: +(bounds.bottom - bounds.top).toFixed(1),
+      boundsArea: +screenArea.toFixed(1),
+      sumArea: +sumArea.toFixed(1),
+      fillRatio: +(sumArea / screenArea).toFixed(3),
+      sampled: sampled.length,
+      overlapPairs,
+      overlapPairsPerLeaf: +(overlapPairs / Math.max(1, sampled.length)).toFixed(3),
+      overlapArea: +overlapArea.toFixed(1),
+      overlapAreaPerLeaf: +(overlapArea / Math.max(1, sampled.length)).toFixed(3),
+    };
+  });
   await page.waitForTimeout(WARMUP_MS);
-  const cdp = await page.context().newCDPSession(page);
-  const events = await startTrace(cdp);
+  const cdp = TRACE ? await page.context().newCDPSession(page) : null;
+  const events = cdp ? await startTrace(cdp) : null;
   const start = await page.evaluate(() => window.__probe.samples.length);
   await page.waitForTimeout(SAMPLE_MS);
   const dts = await page.evaluate(
     (from) => window.__probe.samples.slice(from),
     start,
   );
-  const trace = await stopTrace(cdp, events);
+  const caseMetrics = await page.evaluate(() => window.__caseMetrics ?? null);
+  const trace = cdp ? await stopTrace(cdp, events) : null;
   await page.close();
   return {
     ...config,
+    chromiumArgs: CHROMIUM_ARGS,
+    softwareBackend: SOFTWARE_BACKEND,
+    caseMetrics: { ...(caseMetrics ?? {}), screen: screenMetrics },
     ...summarizeFrameTimes(dts),
     trace,
   };
@@ -283,6 +767,7 @@ function printRows(rows) {
     "PAC/frame",
     "DrawProps/frame",
     "Draw/frame",
+    "case",
   ];
   console.log(header.join("\t"));
   for (const row of rows) {
@@ -293,9 +778,18 @@ function printRows(rows) {
       row.fps_p50.toFixed(1),
       row.fps_p95.toFixed(1),
       row.p99_ms.toFixed(1),
-      row.trace.pac.per_frame_ms.toFixed(3),
-      row.trace.drawProps.per_frame_ms.toFixed(3),
-      row.trace.draw.per_frame_ms.toFixed(3),
+      row.trace ? row.trace.pac.per_frame_ms.toFixed(3) : "",
+      row.trace ? row.trace.drawProps.per_frame_ms.toFixed(3) : "",
+      row.trace ? row.trace.draw.per_frame_ms.toFixed(3) : "",
+      row.caseMetrics
+        ? [
+            Number.isFinite(row.caseMetrics.fillRatio) ? `fill=${row.caseMetrics.fillRatio}` : "",
+            Number.isFinite(row.caseMetrics.estimatedPairOverlap) ? `overlap=${row.caseMetrics.estimatedPairOverlap}` : "",
+            row.caseMetrics.screen ? `screenFill=${row.caseMetrics.screen.fillRatio}` : "",
+            row.caseMetrics.screen ? `screenOverlap=${row.caseMetrics.screen.overlapPairsPerLeaf}` : "",
+            row.caseMetrics.screen ? `screen=${row.caseMetrics.screen.boundsWidth}x${row.caseMetrics.screen.boundsHeight}` : "",
+          ].filter(Boolean).join(" ")
+        : "",
     ].join("\t"));
   }
 }
@@ -312,13 +806,79 @@ if (MODE === "all" || MODE === "distribution") {
     configs.push({ mode: "distribution", root: ROOT ?? "js", variant, leaves });
   }
 }
+if (MODE === "all" || MODE === "order") {
+  const leaves = MODE === "all" ? Math.min(LEAVES, 2500) : LEAVES;
+  for (const variant of ["spatial", "tile4-spatial", "tile4-depth", "tile4-depth-back", "block64-depth", "depth-front", "depth-back", "random"]) {
+    if (VARIANT_FILTER.size > 0 && !VARIANT_FILTER.has(variant)) continue;
+    configs.push({ mode: "order", root: ROOT ?? "js", variant, leaves });
+  }
+}
 if (MODE === "all" || MODE === "depth-groups") {
-  for (const variant of ["leaf-z17", "group-z17", "leaf-z50", "group-z50", "leaf-z250", "group-z250"]) {
+  const depthVariants = [
+    "leaf-z17",
+    "leaf-z50",
+    "leaf-z250",
+    "leaf-z250-comp",
+    "group-z1",
+    "group-z2",
+    "group-z4",
+    "group-z8",
+    "group-z12",
+    "group-z16",
+    "group-z16-comp",
+    "group-z17",
+    "group-z20",
+    "group-z24",
+    "group-z28",
+    "group-z32",
+    "group-z32-comp",
+    "group-z34",
+    "group-z50",
+    "group-z68",
+    "group-z80",
+    "group-z96",
+    "group-z112",
+    "group-z128",
+    "group-z136",
+    "group-z160",
+    "group-z192",
+    "group-z250",
+    "hybrid-z8-d136",
+    "hybrid-z16-d136",
+    "hybrid-z8-d250",
+    "tiled-z16-t2",
+    "tiled-z32-t2",
+    "tiled-z50-t2",
+    "tiled-z68-t2",
+    "tiled-z32-t4",
+    "tiled-z50-t4",
+    "tiled-z68-t4",
+    "tiled-z136-t4",
+    "tile2d-z250-t2",
+    "tile2d-z250-t4",
+    "tile2d-z250-t8",
+  ];
+  for (const variant of depthVariants) {
+    if (VARIANT_FILTER.size > 0 && !VARIANT_FILTER.has(variant)) continue;
     configs.push({ mode: "depth-groups", root: ROOT ?? "css", variant, leaves: LEAVES });
   }
 }
+if (MODE === "all" || MODE === "projection") {
+  for (const variant of [
+    "static-left-top",
+    "static-transform",
+    "var-transform",
+    "registered-var-transform",
+    "var-left-top",
+    "registered-var-left-top",
+    "translate3d-reference",
+  ]) {
+    if (VARIANT_FILTER.size > 0 && !VARIANT_FILTER.has(variant)) continue;
+    configs.push({ mode: "projection", root: ROOT ?? "vars", variant, leaves: LEAVES });
+  }
+}
 if (configs.length === 0) {
-  throw new Error(`Unknown --mode=${MODE}; use all, topology, distribution, or depth-groups`);
+  throw new Error(`Unknown --mode=${MODE}; use all, topology, distribution, order, depth-groups, or projection`);
 }
 
 const launchOptions = { headless: !HEADED, args: CHROMIUM_ARGS };
diff --git a/bench/entries/normalize.ts b/bench/entries/normalize.ts
index ee6adc4a..ae75f0a7 100644
--- a/bench/entries/normalize.ts
+++ b/bench/entries/normalize.ts
@@ -1,11 +1,16 @@
 /**
- * Bundled entry that re-exports the in-tree normalize and a small
+ * Bundled entry that exposes the current mesh optimizer and a small
  * "paint everything one color" helper. Used by the crack-finder bench
- * page (`bench/perf-cracks.html`) so it can import the same normalize
- * code the workbench uses, without bypassing the bench build pipeline.
+ * page (`bench/perf-cracks.html`) without depending on website-only debug
+ * files.
  */
-export { preprocessModelPolygons } from "../../website/src/debug/meshDomNormalize";
-import type { Polygon, Vec3 } from "@layoutit/polycss";
+import { optimizeMeshPolygons, type Polygon, type Vec3 } from "@layoutit/polycss";
+
+export function preprocessModelPolygons(polygons: Polygon[], normalizeGeometry: boolean): Polygon[] {
+  return optimizeMeshPolygons(polygons, {
+    meshResolution: normalizeGeometry ? "lossy" : "lossless",
+  });
+}
 
 /**
  * Replace every polygon's color with the given hex string and strip the
diff --git a/bench/nonvoxel-frame-buckets.mjs b/bench/nonvoxel-frame-buckets.mjs
new file mode 100644
index 00000000..622ed513
--- /dev/null
+++ b/bench/nonvoxel-frame-buckets.mjs
@@ -0,0 +1,626 @@
+#!/usr/bin/env node
+/**
+ * Trace/rAF bucket profiler for non-voxel rotation experiments.
+ *
+ * This is intentionally separate from trace-frame-buckets.mjs because that
+ * script samples voxel direct-renderer DOM. Here we sample the real polycss
+ * leaf tag mix (`b/i/s/u/q`) so slow frame buckets can be compared against the
+ * strategy mix emitted by normal GLB/OBJ rendering.
+ *
+ * Usage:
+ *   node bench/nonvoxel-frame-buckets.mjs --mesh glb:Elephant.glb --variant order-tile4
+ *   node bench/nonvoxel-frame-buckets.mjs --mesh glb:Elephant.glb --variant order-tile4 --no-trace
+ *   node bench/nonvoxel-frame-buckets.mjs --mesh glb:Elephant.glb --variant order-tile4 --dom-samples
+ *   node bench/nonvoxel-frame-buckets.mjs --mesh teapot --variant force-atlas --label nv-teapot-atlas
+ */
+import { createServer } from "node:http";
+import { mkdirSync, writeFileSync } from "node:fs";
+import { readFile } from "node:fs/promises";
+import { dirname, extname, resolve } from "node:path";
+import { fileURLToPath } from "node:url";
+import { chromium } from "playwright";
+import { chromiumArgsWithGpuDefault } from "./chromium-defaults.mjs";
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const repoRoot = resolve(__dirname, "..");
+const benchDir = resolve(repoRoot, "bench");
+const galleryDir = resolve(repoRoot, "website/public/gallery");
+
+const argv = process.argv.slice(2);
+const flag = (name) => argv.indexOf(`--${name}`);
+const optStr = (name, dflt = "") => {
+  const i = flag(name);
+  if (i >= 0) return argv[i + 1] ?? dflt;
+  const prefixed = argv.find((arg) => arg.startsWith(`--${name}=`));
+  return prefixed ? prefixed.slice(name.length + 3) : dflt;
+};
+const optNum = (name, dflt) => {
+  const raw = optStr(name);
+  if (raw.trim() === "") return dflt;
+  const value = Number(raw);
+  return Number.isFinite(value) ? value : dflt;
+};
+const optAll = (name) => {
+  const values = [];
+  for (let i = 0; i < argv.length; i += 1) {
+    const arg = argv[i];
+    if (arg === `--${name}` && argv[i + 1]) {
+      values.push(argv[i + 1]);
+      i += 1;
+    } else if (arg.startsWith(`--${name}=`)) {
+      values.push(arg.slice(name.length + 3));
+    }
+  }
+  return values;
+};
+const hasFlag = (name) => flag(name) >= 0 || argv.includes(`--${name}=true`);
+
+const MESH = optStr("mesh", "glb:Elephant.glb");
+const MODE = optStr("mode", "baked");
+const MOTION = optStr("motion", "rot");
+const VARIANT = optStr("variant", "baseline");
+const WARMUP_MS = optNum("warmup", 2000);
+const SAMPLE_MS = optNum("sample", 5000);
+const RUNS = Math.max(1, optNum("runs", 1));
+const LABEL = optStr("label");
+const HEADED = hasFlag("headed");
+const JSON_ONLY = hasFlag("json");
+const TRACE = !hasFlag("no-trace");
+const DOM_SAMPLES = hasFlag("dom-samples");
+const BROWSER_EXECUTABLE = optStr("browser-executable");
+const SOFTWARE_BACKEND = hasFlag("software-backend");
+const CHROMIUM_ARGS = chromiumArgsWithGpuDefault([
+  ...optAll("chromium-arg"),
+  ...optAll("chromium-args").flatMap((value) => value.split(/\s+/).filter(Boolean)),
+], { softwareBackend: SOFTWARE_BACKEND });
+
+const VARIANT_PARAMS = {
+  baseline: {},
+  "css-keyframes": { rotationDriver: "css-keyframes" },
+  "order-depth": { domOrder: "initial-depth" },
+  "order-tile4": { domOrder: "tile4-screen" },
+  "order-area": { domOrder: "area-desc" },
+  "no-border-shape": { disableStrategies: "i" },
+  "no-stable-tri": { disableStrategies: "u" },
+  "force-atlas": { disableStrategies: "b,i,u" },
+  "no-will-change": { sceneTransformMode: "no-will-change" },
+  "leaf-buckets-64": { leafBucketSize: "64" },
+  "leaf-buckets-128": { leafBucketSize: "128" },
+  "leaf-buckets-256": { leafBucketSize: "256" },
+  "scene-matrix3d": { sceneTransformMode: "matrix3d" },
+  "scene-split-target": { sceneTransformMode: "split-target" },
+  "scene-host-perspective": { sceneTransformMode: "host-perspective" },
+  "scene-transform-perspective": { sceneTransformMode: "transform-perspective" },
+};
+
+const MIME = {
+  ".html": "text/html; charset=utf-8",
+  ".js": "application/javascript; charset=utf-8",
+  ".mjs": "application/javascript; charset=utf-8",
+  ".css": "text/css; charset=utf-8",
+  ".json": "application/json; charset=utf-8",
+  ".obj": "text/plain; charset=utf-8",
+  ".mtl": "text/plain; charset=utf-8",
+  ".png": "image/png",
+  ".jpg": "image/jpeg",
+  ".jpeg": "image/jpeg",
+  ".gltf": "application/json; charset=utf-8",
+  ".glb": "model/gltf-binary",
+  ".vox": "application/octet-stream",
+};
+
+const TRACE_CATEGORIES = [
+  "devtools.timeline",
+  "disabled-by-default-devtools.timeline",
+  "blink",
+  "blink.user_timing",
+  "cc",
+  "gpu",
+  "viz",
+  "renderer.scheduler",
+].join(",");
+
+const EVENT_GROUPS = {
+  style: ["UpdateLayoutTree", "RecalculateStyles"],
+  layout: ["Layout"],
+  prePaint: ["PrePaint"],
+  paint: ["Paint"],
+  raster: ["RasterTask", "ImageDecodeTask", "Decode Image"],
+  script: ["FunctionCall", "EvaluateScript", "EventDispatch", "TimerFire", "FireAnimationFrame"],
+  compositorMain: [
+    "ProxyMain::BeginMainFrame",
+    "WebFrameWidgetImpl::UpdateLifecycle",
+    "PaintArtifactCompositor::Update",
+    "Layerize",
+    "Commit",
+    "ProxyImpl::ReadyToCommit",
+  ],
+  compositorImpl: [
+    "LayerTreeImpl::UpdateDrawProperties",
+    "LayerTreeImpl::UpdateDrawProperties::CalculateDrawProperties",
+    "draw_property_utils::ComputeDrawPropertiesOfVisibleLayers",
+    "LayerTreeHostImpl::PrepareToDraw",
+    "MainFrame.Draw",
+    "SubmitCompositorFrame",
+  ],
+};
+
+const KEY_EVENTS = [
+  "FireAnimationFrame",
+  "FunctionCall",
+  "UpdateLayoutTree",
+  "PrePaint",
+  "PaintArtifactCompositor::Update",
+  "Layerize",
+  "LayerTreeImpl::UpdateDrawProperties",
+  "LayerTreeImpl::UpdateDrawProperties::CalculateDrawProperties",
+  "draw_property_utils::ComputeDrawPropertiesOfVisibleLayers",
+  "LayerTreeHostImpl::PrepareToDraw",
+  "MainFrame.Draw",
+  "SubmitCompositorFrame",
+  "RasterTask",
+];
+
+function startServer() {
+  return new Promise((resolveStart, rejectStart) => {
+    const server = createServer(async (req, res) => {
+      try {
+        const u = new URL(req.url, "http://localhost");
+        const safe = u.pathname.replace(/\/+/g, "/");
+        if (safe.includes("..")) {
+          res.writeHead(403);
+          res.end();
+          return;
+        }
+        const abs = safe.startsWith("/gallery/")
+          ? resolve(galleryDir, safe.slice("/gallery/".length))
+          : resolve(benchDir, safe === "/" ? "nonvoxel-vanilla.html" : safe.slice(1));
+        const data = await readFile(abs);
+        res.writeHead(200, {
+          "Content-Type": MIME[extname(abs).toLowerCase()] || "application/octet-stream",
+          "Cache-Control": "no-store",
+        });
+        res.end(data);
+      } catch (error) {
+        res.writeHead(404);
+        res.end(String(error?.message ?? error));
+      }
+    });
+    server.on("error", rejectStart);
+    server.listen(0, "127.0.0.1", () => {
+      const addr = server.address();
+      resolveStart({ server, port: typeof addr === "object" ? addr.port : 0 });
+    });
+  });
+}
+
+function stopServer(server) {
+  return new Promise((resolveStop) => server.close(resolveStop));
+}
+
+function quantile(values, q) {
+  const sorted = values.filter(Number.isFinite).sort((a, b) => a - b);
+  if (sorted.length === 0) return null;
+  const i = (sorted.length - 1) * q;
+  const lo = Math.floor(i);
+  const hi = Math.ceil(i);
+  if (lo === hi) return sorted[lo];
+  return sorted[lo] + (sorted[hi] - sorted[lo]) * (i - lo);
+}
+
+function median(values) {
+  return quantile(values, 0.5);
+}
+
+function fmt(value, digits = 2) {
+  return Number.isFinite(value) ? Number(value).toFixed(digits) : "";
+}
+
+function bucketName(dt, baseFrameMs) {
+  const ratio = Math.max(1, Math.round(dt / baseFrameMs));
+  return ratio >= 4 ? "x4_plus" : `x${ratio}`;
+}
+
+function estimateBaseFrameMs(dts) {
+  const p10 = quantile(dts, 0.1) ?? 16.667;
+  return p10 < 12 ? 8.333 : 16.667;
+}
+
+function summarizeFrameTimes(frames) {
+  const dts = frames.map((frame) => frame.dt);
+  const p50 = median(dts) ?? 0;
+  const p95 = quantile(dts, 0.95) ?? 0;
+  const p99 = quantile(dts, 0.99) ?? 0;
+  return {
+    count: frames.length,
+    fps_p50: p50 > 0 ? +(1000 / p50).toFixed(2) : 0,
+    fps_p95: p95 > 0 ? +(1000 / p95).toFixed(2) : 0,
+    frame_time_p50_ms: +p50.toFixed(3),
+    frame_time_p95_ms: +p95.toFixed(3),
+    frame_time_p99_ms: +p99.toFixed(3),
+  };
+}
+
+function findTraceMark(events, name) {
+  return events.find((event) => event?.name === name && Number.isFinite(event?.args?.data?.startTime)) ??
+    events.find((event) => event?.name === "TimeStamp" && event?.args?.data?.message === name);
+}
+
+function makeFrames(samples, startPerfNow, endPerfNow) {
+  const frames = samples
+    .filter((sample) => Number.isFinite(sample?.dt) && sample.dt > 0 && sample.dt < 2000)
+    .filter((sample) => sample.t - sample.dt >= startPerfNow && sample.t <= endPerfNow)
+    .map((sample, index) => ({
+      index,
+      start: sample.t - sample.dt,
+      end: sample.t,
+      dt: sample.dt,
+    }));
+  const baseFrameMs = estimateBaseFrameMs(frames.map((frame) => frame.dt));
+  for (const frame of frames) frame.bucket = bucketName(frame.dt, baseFrameMs);
+  return { frames, baseFrameMs };
+}
+
+function attachDomSamples(frames, domSamples) {
+  if (!Array.isArray(domSamples) || domSamples.length === 0) return;
+  let sampleIndex = 0;
+  for (const frame of frames) {
+    while (sampleIndex + 1 < domSamples.length && domSamples[sampleIndex + 1].t <= frame.end) {
+      sampleIndex += 1;
+    }
+    const sample = domSamples[sampleIndex];
+    if (sample && sample.t >= frame.start - 1 && sample.t <= frame.end + 1) {
+      frame.tags = sample.tags;
+      frame.leafCount = sample.leafCount;
+      frame.bucketCount = sample.bucketCount;
+      frame.inlineStyleChars = sample.inlineStyleChars;
+    }
+  }
+}
+
+function frameIndexAt(frames, perfNow) {
+  let lo = 0;
+  let hi = frames.length - 1;
+  while (lo <= hi) {
+    const mid = (lo + hi) >> 1;
+    const frame = frames[mid];
+    if (perfNow < frame.start) hi = mid - 1;
+    else if (perfNow > frame.end) lo = mid + 1;
+    else return mid;
+  }
+  return -1;
+}
+
+function emptyBucket(bucket) {
+  return {
+    bucket,
+    frameCount: 0,
+    frame_time_p50_ms: null,
+    frame_time_p95_ms: null,
+    leafCount_p50: null,
+    bucketCount_p50: null,
+    tags_p50: { b: null, i: null, s: null, u: null, q: null },
+    inlineStyleChars_p50: null,
+    groups_ms_per_frame: {},
+    events_ms_per_frame: {},
+    topEvents: [],
+  };
+}
+
+function addDuration(map, name, durationMs) {
+  const entry = map.get(name) ?? { count: 0, duration_ms: 0 };
+  entry.count += 1;
+  entry.duration_ms += durationMs;
+  map.set(name, entry);
+}
+
+function summarizeBuckets(events, frames, tracePerfOffsetMs, renderStats) {
+  const fallbackTags = renderStats?.dom?.tags ?? null;
+  const fallbackLeafCount = renderStats?.dom?.leafCount ?? null;
+  const fallbackBucketCount = renderStats?.dom?.buckets ?? null;
+  const fallbackInlineStyleChars = renderStats?.dom?.inlineStyleChars ?? null;
+  const buckets = new Map();
+  for (const frame of frames) {
+    const bucket = buckets.get(frame.bucket) ?? {
+      ...emptyBucket(frame.bucket),
+      frameDts: [],
+      leafCounts: [],
+      bucketCounts: [],
+      inlineStyleChars: [],
+      tagCounts: { b: [], i: [], s: [], u: [], q: [] },
+      eventTotals: new Map(),
+      groupTotals: new Map(),
+    };
+    bucket.frameCount += 1;
+    bucket.frameDts.push(frame.dt);
+    if (Number.isFinite(frame.leafCount)) bucket.leafCounts.push(frame.leafCount);
+    if (Number.isFinite(frame.bucketCount)) bucket.bucketCounts.push(frame.bucketCount);
+    if (Number.isFinite(frame.inlineStyleChars)) bucket.inlineStyleChars.push(frame.inlineStyleChars);
+    for (const tag of ["b", "i", "s", "u", "q"]) {
+      if (Number.isFinite(frame.tags?.[tag])) bucket.tagCounts[tag].push(frame.tags[tag]);
+    }
+    buckets.set(frame.bucket, bucket);
+  }
+
+  const groupByEvent = new Map();
+  for (const [group, names] of Object.entries(EVENT_GROUPS)) {
+    for (const name of names) groupByEvent.set(name, group);
+  }
+
+  for (const event of events) {
+    if (event?.ph !== "X" || typeof event.dur !== "number" || !Number.isFinite(event.ts)) continue;
+    const durationMs = event.dur / 1000;
+    const midpointPerfNow = ((event.ts + event.dur / 2) / 1000) - tracePerfOffsetMs;
+    const index = frameIndexAt(frames, midpointPerfNow);
+    if (index < 0) continue;
+    const bucket = buckets.get(frames[index].bucket);
+    if (!bucket) continue;
+    addDuration(bucket.eventTotals, event.name, durationMs);
+    const group = groupByEvent.get(event.name);
+    if (group) addDuration(bucket.groupTotals, group, durationMs);
+  }
+
+  return ["x1", "x2", "x3", "x4_plus"].map((name) => {
+    const bucket = buckets.get(name);
+    if (!bucket) return emptyBucket(name);
+    const frameCount = bucket.frameCount || 1;
+    const events_ms_per_frame = {};
+    for (const event of KEY_EVENTS) {
+      events_ms_per_frame[event] = +((bucket.eventTotals.get(event)?.duration_ms ?? 0) / frameCount).toFixed(4);
+    }
+    const groups_ms_per_frame = {};
+    for (const group of Object.keys(EVENT_GROUPS)) {
+      groups_ms_per_frame[group] = +((bucket.groupTotals.get(group)?.duration_ms ?? 0) / frameCount).toFixed(4);
+    }
+    const tags_p50 = {};
+    for (const tag of ["b", "i", "s", "u", "q"]) {
+      tags_p50[tag] = bucket.tagCounts[tag].length ? +(median(bucket.tagCounts[tag]) ?? 0).toFixed(0) : null;
+    }
+    const topEvents = [...bucket.eventTotals.entries()]
+      .map(([event, total]) => ({
+        event,
+        count: total.count,
+        ms_per_frame: +(total.duration_ms / frameCount).toFixed(4),
+      }))
+      .sort((a, b) => b.ms_per_frame - a.ms_per_frame)
+      .slice(0, 12);
+    const out = {
+      bucket: name,
+      frameCount: bucket.frameCount,
+      frame_time_p50_ms: +(median(bucket.frameDts) ?? 0).toFixed(3),
+      frame_time_p95_ms: +(quantile(bucket.frameDts, 0.95) ?? 0).toFixed(3),
+      leafCount_p50: bucket.leafCounts.length ? +(median(bucket.leafCounts) ?? 0).toFixed(0) : fallbackLeafCount,
+      bucketCount_p50: bucket.bucketCounts.length ? +(median(bucket.bucketCounts) ?? 0).toFixed(0) : fallbackBucketCount,
+      tags_p50,
+      inlineStyleChars_p50: bucket.inlineStyleChars.length ? +(median(bucket.inlineStyleChars) ?? 0).toFixed(0) : fallbackInlineStyleChars,
+      groups_ms_per_frame,
+      events_ms_per_frame,
+      topEvents,
+    };
+    if (fallbackTags && Object.values(tags_p50).every((value) => value === null)) {
+      out.tags_p50 = fallbackTags;
+    }
+    return out;
+  });
+}
+
+async function startTrace(cdp) {
+  const events = [];
+  cdp.on("Tracing.dataCollected", (payload) => {
+    if (Array.isArray(payload.value)) events.push(...payload.value);
+  });
+  await cdp.send("Performance.enable");
+  await cdp.send("Tracing.start", {
+    transferMode: "ReportEvents",
+    categories: TRACE_CATEGORIES,
+  });
+  return events;
+}
+
+async function stopTrace(cdp) {
+  await new Promise(async (resolveStop) => {
+    cdp.once("Tracing.tracingComplete", resolveStop);
+    await cdp.send("Tracing.end");
+  });
+}
+
+function pageUrl(port) {
+  const params = new URLSearchParams({
+    mesh: MESH,
+    mode: MODE,
+    motion: MOTION,
+    ...VARIANT_PARAMS[VARIANT],
+  });
+  if (!VARIANT_PARAMS[VARIANT]) {
+    throw new Error(`Unknown --variant "${VARIANT}". Known: ${Object.keys(VARIANT_PARAMS).join(", ")}`);
+  }
+  return `http://127.0.0.1:${port}/nonvoxel-vanilla.html?${params.toString()}`;
+}
+
+async function runOnce(port, repeat) {
+  const launchOptions = { headless: !HEADED, args: CHROMIUM_ARGS };
+  if (BROWSER_EXECUTABLE) launchOptions.executablePath = BROWSER_EXECUTABLE;
+  const browser = await chromium.launch(launchOptions);
+  try {
+    const ctx = await browser.newContext({ viewport: { width: 1280, height: 800 } });
+    const page = await ctx.newPage();
+    const cdp = TRACE ? await ctx.newCDPSession(page) : null;
+    await page.goto(pageUrl(port), { waitUntil: "load" });
+    await page.waitForFunction(() => window.__perf__?.ready === true, null, { timeout: 30000 });
+    await page.waitForTimeout(WARMUP_MS);
+
+    const events = TRACE ? await startTrace(cdp) : [];
+    const startIdx = await page.evaluate(() => window.__perf__.samples.length);
+    const startPerfNow = await page.evaluate(({ traceEnabled, domSamples }) => {
+      if (domSamples) {
+        window.__polycssDomSamples = [];
+        window.__polycssDomSampling = true;
+        const sampleDom = (now) => {
+          const sceneRoot = document.querySelector(".polycss-scene");
+          const tags = { b: 0, i: 0, s: 0, u: 0, q: 0 };
+          let inlineStyleChars = 0;
+          if (sceneRoot) {
+            for (const tag of Object.keys(tags)) tags[tag] = sceneRoot.querySelectorAll(tag).length;
+            for (const el of sceneRoot.querySelectorAll("b,i,s,u,q")) {
+              inlineStyleChars += el.getAttribute("style")?.length ?? 0;
+            }
+          }
+          window.__polycssDomSamples.push({
+            t: now,
+            tags,
+            leafCount: tags.b + tags.i + tags.s + tags.u,
+            shadowCount: tags.q,
+            bucketCount: sceneRoot?.querySelectorAll(".polycss-bucket").length ?? 0,
+            inlineStyleChars,
+          });
+          if (window.__polycssDomSampling) requestAnimationFrame(sampleDom);
+        };
+        requestAnimationFrame(sampleDom);
+      } else {
+        window.__polycssDomSamples = [];
+        window.__polycssDomSampling = false;
+      }
+      if (traceEnabled) {
+        performance.mark("__polycss_nonvoxel_bucket_start__");
+        console.timeStamp("__polycss_nonvoxel_bucket_start__");
+      }
+      return performance.now();
+    }, { traceEnabled: TRACE, domSamples: DOM_SAMPLES });
+    await page.waitForTimeout(SAMPLE_MS);
+    const endPerfNow = await page.evaluate((traceEnabled) => {
+      if (traceEnabled) {
+        performance.mark("__polycss_nonvoxel_bucket_end__");
+        console.timeStamp("__polycss_nonvoxel_bucket_end__");
+      }
+      window.__polycssDomSampling = false;
+      return performance.now();
+    }, TRACE);
+    if (TRACE) await stopTrace(cdp);
+
+    const pageResult = await page.evaluate((from) => ({
+      samples: window.__perf__.samples.slice(from),
+      polyCount: window.__perf__.polyCount,
+      renderStats: window.__perf__.renderStats ?? null,
+      domSamples: window.__polycssDomSamples ?? [],
+    }), startIdx);
+    await ctx.close();
+
+    let tracePerfOffsetMs = 0;
+    let alignedStartPerfNow = startPerfNow;
+    let alignedEndPerfNow = endPerfNow;
+    if (TRACE) {
+      const startMark = findTraceMark(events, "__polycss_nonvoxel_bucket_start__");
+      const endMark = findTraceMark(events, "__polycss_nonvoxel_bucket_end__");
+      if (!startMark?.args?.data?.startTime || !endMark?.args?.data?.startTime) {
+        throw new Error("Trace markers were not captured; cannot align trace to rAF samples.");
+      }
+      tracePerfOffsetMs = (startMark.ts / 1000) - startMark.args.data.startTime;
+      alignedStartPerfNow = startMark.args.data.startTime;
+      alignedEndPerfNow = endMark.args.data.startTime;
+    }
+    const { frames, baseFrameMs } = makeFrames(pageResult.samples, alignedStartPerfNow, alignedEndPerfNow);
+    if (DOM_SAMPLES) attachDomSamples(frames, pageResult.domSamples);
+    const frameStats = summarizeFrameTimes(frames);
+    const buckets = summarizeBuckets(events, frames, tracePerfOffsetMs, pageResult.renderStats);
+
+    return {
+      repeat,
+      mesh: MESH,
+      variant: VARIANT,
+      mode: MODE,
+      motion: MOTION,
+      trace: TRACE,
+      domSamples: DOM_SAMPLES,
+      warmup_ms: WARMUP_MS,
+      sample_ms: SAMPLE_MS,
+      baseFrameMs: +baseFrameMs.toFixed(3),
+      ...frameStats,
+      polyCount: pageResult.polyCount,
+      renderStats: pageResult.renderStats,
+      buckets,
+    };
+  } finally {
+    await browser.close();
+  }
+}
+
+function tagText(tags) {
+  if (!tags) return "";
+  return `b/i/s/u/q=${tags.b ?? ""}/${tags.i ?? ""}/${tags.s ?? ""}/${tags.u ?? ""}/${tags.q ?? ""}`;
+}
+
+function printRun(run) {
+  const bucketText = run.buckets
+    .filter((bucket) => bucket.frameCount > 0)
+    .map((bucket) => `${bucket.bucket}:${bucket.frameCount}`)
+    .join(" ");
+  console.log(
+    `[nv-buckets] ${run.mesh} ${run.variant} r${run.repeat} p50=${fmt(run.fps_p50, 1)} p95=${fmt(run.fps_p95, 1)} p99=${fmt(run.frame_time_p99_ms, 1)}ms base=${fmt(run.baseFrameMs, 3)}ms ${bucketText}`,
+  );
+  console.log("| Bucket | Frames | Leaves | Tags p50 | dt p50 | dt p95 | style | prePaint | PAC | layerize | drawProps | visible | prepareDraw | draw | raster | script |");
+  console.log("| --- | ---: | ---: | --- | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: |");
+  for (const bucket of run.buckets) {
+    if (bucket.frameCount === 0) continue;
+    const e = bucket.events_ms_per_frame;
+    const g = bucket.groups_ms_per_frame;
+    console.log([
+      `| ${bucket.bucket}`,
+      bucket.frameCount,
+      bucket.leafCount_p50 ?? "",
+      tagText(bucket.tags_p50),
+      fmt(bucket.frame_time_p50_ms),
+      fmt(bucket.frame_time_p95_ms),
+      fmt(g.style, 4),
+      fmt(g.prePaint, 4),
+      fmt(e["PaintArtifactCompositor::Update"], 4),
+      fmt(e.Layerize, 4),
+      fmt(e["LayerTreeImpl::UpdateDrawProperties"], 4),
+      fmt(e["draw_property_utils::ComputeDrawPropertiesOfVisibleLayers"], 4),
+      fmt(e["LayerTreeHostImpl::PrepareToDraw"], 4),
+      fmt(e["MainFrame.Draw"], 4),
+      fmt(g.raster, 4),
+      `${fmt(g.script, 4)} |`,
+    ].join(" | "));
+  }
+}
+
+const { server, port } = await startServer();
+try {
+  if (!JSON_ONLY) {
+    console.log(`[nv-buckets] server :${port}`);
+    console.log(`[nv-buckets] mesh=${MESH} variant=${VARIANT} mode=${MODE} motion=${MOTION} trace=${TRACE ? "on" : "off"} domSamples=${DOM_SAMPLES ? "on" : "off"} runs=${RUNS} warmup=${WARMUP_MS}ms sample=${SAMPLE_MS}ms`);
+    if (SOFTWARE_BACKEND) console.log("[nv-buckets] software backend=on");
+    if (CHROMIUM_ARGS.length > 0) console.log(`[nv-buckets] chromium args=${CHROMIUM_ARGS.join(" ")}`);
+  }
+  const runs = [];
+  for (let repeat = 1; repeat <= RUNS; repeat += 1) {
+    const run = await runOnce(port, repeat);
+    runs.push(run);
+    if (!JSON_ONLY) printRun(run);
+  }
+  const out = {
+    kind: "nonvoxel-frame-buckets",
+    mesh: MESH,
+    variant: VARIANT,
+    mode: MODE,
+    motion: MOTION,
+    trace: TRACE,
+    domSamples: DOM_SAMPLES,
+    browserExecutable: BROWSER_EXECUTABLE || null,
+    chromiumArgs: CHROMIUM_ARGS,
+    softwareBackend: SOFTWARE_BACKEND,
+    warmup_ms: WARMUP_MS,
+    sample_ms: SAMPLE_MS,
+    runs,
+  };
+  if (LABEL) {
+    const dir = resolve(repoRoot, "bench/results");
+    mkdirSync(dir, { recursive: true });
+    const file = resolve(dir, `${LABEL}.json`);
+    writeFileSync(file, JSON.stringify(out, null, 2) + "\n");
+    if (!JSON_ONLY) console.log(`[nv-buckets] wrote ${file}`);
+  }
+  if (JSON_ONLY) console.log(JSON.stringify(out, null, 2));
+} finally {
+  await stopServer(server);
+}
diff --git a/bench/nonvoxel-rotation-bench.mjs b/bench/nonvoxel-rotation-bench.mjs
new file mode 100644
index 00000000..e2fb895b
--- /dev/null
+++ b/bench/nonvoxel-rotation-bench.mjs
@@ -0,0 +1,618 @@
+#!/usr/bin/env node
+/**
+ * Bench-only non-voxel rotation probe.
+ *
+ * Runs the vanilla renderer against a representative non-voxel corpus and a
+ * small set of browser-shape ideas borrowed from the voxel investigation.
+ * This intentionally routes through nonvoxel-vanilla.html so each variant still
+ * uses the real renderer and the same FPS recorder as bench/perf-bench.mjs.
+ *
+ * Usage:
+ *   node bench/nonvoxel-rotation-bench.mjs
+ *   node bench/nonvoxel-rotation-bench.mjs --models saucer,rock1 --variants baseline,css-keyframes
+ *   node bench/nonvoxel-rotation-bench.mjs --mode dynamic --sample 5000 --repeats 3
+ *   node bench/nonvoxel-rotation-bench.mjs --run-order round-robin --repeats 5
+ *   node bench/nonvoxel-rotation-bench.mjs --json bench/results/nonvoxel-rotation.json
+ */
+import { createServer } from "node:http";
+import { mkdirSync, writeFileSync } from "node:fs";
+import { readFile } from "node:fs/promises";
+import { dirname, extname, resolve } from "node:path";
+import { fileURLToPath } from "node:url";
+import { chromium } from "playwright";
+import { chromiumArgsWithGpuDefault } from "./chromium-defaults.mjs";
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const repoRoot = resolve(__dirname, "..");
+const benchDir = resolve(repoRoot, "bench");
+const galleryDir = resolve(repoRoot, "website/public/gallery");
+
+const argv = process.argv.slice(2);
+const flag = (name) => argv.indexOf(`--${name}`);
+const optStr = (name, dflt = "") => {
+  const i = flag(name);
+  if (i >= 0) return argv[i + 1] ?? dflt;
+  const prefixed = argv.find((arg) => arg.startsWith(`--${name}=`));
+  return prefixed ? prefixed.slice(name.length + 3) : dflt;
+};
+const optNum = (name, dflt) => {
+  const raw = optStr(name);
+  if (raw.trim() === "") return dflt;
+  const value = Number(raw);
+  return Number.isFinite(value) ? value : dflt;
+};
+const optAll = (name) => {
+  const values = [];
+  for (let i = 0; i < argv.length; i += 1) {
+    const arg = argv[i];
+    if (arg === `--${name}` && argv[i + 1]) {
+      values.push(argv[i + 1]);
+      i += 1;
+    } else if (arg.startsWith(`--${name}=`)) {
+      values.push(arg.slice(name.length + 3));
+    }
+  }
+  return values;
+};
+const hasFlag = (name) => flag(name) >= 0 || argv.includes(`--${name}=true`);
+
+const WARMUP_MS = optNum("warmup", 2000);
+const SAMPLE_MS = optNum("sample", 3000);
+const REPEATS = Math.max(1, optNum("repeats", 1));
+const MODE = optStr("mode", "baked");
+const RUN_ORDER_INPUT = optStr("run-order", "grouped");
+const SEED = optStr("seed", "polycss-nonvoxel");
+const JSON_PATH = optStr("json");
+const PRINT_JSON = hasFlag("print-json") || !JSON_PATH;
+const HEADED = hasFlag("headed");
+const BROWSER_EXECUTABLE = optStr("browser-executable");
+const SOFTWARE_BACKEND = hasFlag("software-backend");
+const CHROMIUM_ARGS = chromiumArgsWithGpuDefault([
+  ...optAll("chromium-arg"),
+  ...optAll("chromium-args").flatMap((value) => value.split(/\s+/).filter(Boolean)),
+], { softwareBackend: SOFTWARE_BACKEND });
+
+const MODEL_CORPUS = [
+  {
+    id: "chicken",
+    label: "Chicken OBJ",
+    mesh: "chicken",
+    reason: "Small flat-color OBJ; mostly merged quads.",
+  },
+  {
+    id: "rock1",
+    label: "Rock OBJ",
+    mesh: "rock1",
+    reason: "Small UV-textured OBJ; atlas-heavy baseline.",
+  },
+  {
+    id: "saucer",
+    label: "Saucer OBJ",
+    mesh: "saucer",
+    reason: "Large untextured OBJ; known rotation stress case.",
+  },
+  {
+    id: "teapot",
+    label: "Teapot OBJ",
+    mesh: "teapot",
+    reason: "Smooth curved solid OBJ.",
+  },
+  {
+    id: "ducky",
+    label: "Ducky GLB",
+    mesh: "ducky",
+    reason: "Small GLB with solid color swatches.",
+  },
+  {
+    id: "elephant",
+    label: "Elephant GLB",
+    mesh: "glb:Elephant.glb",
+    params: { zoom: "0.35", targetSize: "60" },
+    reason: "Organic low-poly GLB.",
+  },
+  {
+    id: "policecar",
+    label: "Policecar GLB",
+    mesh: "glb:Policecar.glb",
+    params: { zoom: "0.35", targetSize: "60" },
+    reason: "Mechanical GLB with many rectilinear parts.",
+  },
+  {
+    id: "bicycle",
+    label: "Bicycle GLB",
+    mesh: "glb:Bicycle.glb",
+    params: { zoom: "0.35", targetSize: "60" },
+    reason: "Thin-structure GLB with many separated parts.",
+  },
+];
+
+const VARIANTS = [
+  {
+    id: "baseline",
+    label: "Baseline",
+    params: {},
+    hypothesis: "Current vanilla JS scene-root rotation.",
+  },
+  {
+    id: "css-keyframes",
+    label: "CSS Keyframes",
+    params: { rotationDriver: "css-keyframes" },
+    hypothesis: "Active declarative transform animation may skip PAC during auto-rotate.",
+  },
+  {
+    id: "order-depth",
+    label: "Initial Depth Order",
+    params: { domOrder: "initial-depth" },
+    hypothesis: "One-time depth locality may reduce compositor sort pressure.",
+  },
+  {
+    id: "order-tile4",
+    label: "Tile4 Screen Order",
+    params: { domOrder: "tile4-screen" },
+    hypothesis: "Voxel tile-order lesson may transfer to static non-voxel polygon order.",
+  },
+  {
+    id: "order-area",
+    label: "Area Desc Order",
+    params: { domOrder: "area-desc" },
+    hypothesis: "Large projected primitives grouped earlier may improve overlap cadence.",
+  },
+  {
+    id: "no-border-shape",
+    label: "No Border Shape",
+    params: { disableStrategies: "i" },
+    hypothesis: "Force irregular solids to atlas slices instead of border-shape leaves.",
+  },
+  {
+    id: "no-stable-tri",
+    label: "No Stable Triangles",
+    params: { disableStrategies: "u" },
+    hypothesis: "Avoid CSS border-triangle compositing for solid triangles.",
+  },
+  {
+    id: "force-atlas",
+    label: "Force Atlas",
+    params: { disableStrategies: "b,i,u" },
+    hypothesis: "Fewer CSS shape strategies may beat extra atlas memory for rotation.",
+  },
+  {
+    id: "no-will-change",
+    label: "No Scene Will-Change",
+    params: { sceneTransformMode: "no-will-change" },
+    hypothesis: "Confirm voxel result that root will-change is not the missing path.",
+  },
+  {
+    id: "leaf-buckets-64",
+    label: "Leaf Buckets 64",
+    params: { leafBucketSize: "64" },
+    hypothesis: "Wrap baked leaves into fixed-size preserve-3D subtrees without changing leaf order.",
+  },
+  {
+    id: "leaf-buckets-128",
+    label: "Leaf Buckets 128",
+    params: { leafBucketSize: "128" },
+    hypothesis: "Test a coarser fixed-size baked subtree shape.",
+  },
+  {
+    id: "leaf-buckets-256",
+    label: "Leaf Buckets 256",
+    params: { leafBucketSize: "256" },
+    hypothesis: "Test a low-wrapper baked subtree shape.",
+  },
+  {
+    id: "scene-matrix3d",
+    label: "Scene Matrix3d",
+    params: { sceneTransformMode: "matrix3d" },
+    hypothesis: "Use explicit matrix3d() on the scene root instead of transform functions.",
+  },
+  {
+    id: "scene-split-target",
+    label: "Split Target",
+    params: { sceneTransformMode: "split-target" },
+    hypothesis: "Split translate3d target compensation onto an inner shell.",
+  },
+  {
+    id: "scene-host-perspective",
+    label: "Host Perspective",
+    params: { sceneTransformMode: "host-perspective" },
+    hypothesis: "Move perspective off the scene root and onto the host.",
+  },
+  {
+    id: "scene-transform-perspective",
+    label: "Transform Perspective",
+    params: { sceneTransformMode: "transform-perspective" },
+    hypothesis: "Encode perspective in transform instead of the perspective property.",
+  },
+];
+
+const RUN_ORDER_ALIASES = new Map([
+  ["grouped", "grouped"],
+  ["sequential", "grouped"],
+  ["round-robin", "round-robin"],
+  ["roundrobin", "round-robin"],
+  ["interleaved", "round-robin"],
+  ["random", "random"],
+  ["shuffle", "random"],
+]);
+
+const MIME = {
+  ".html": "text/html; charset=utf-8",
+  ".js": "application/javascript; charset=utf-8",
+  ".mjs": "application/javascript; charset=utf-8",
+  ".css": "text/css; charset=utf-8",
+  ".json": "application/json; charset=utf-8",
+  ".obj": "text/plain; charset=utf-8",
+  ".mtl": "text/plain; charset=utf-8",
+  ".png": "image/png",
+  ".jpg": "image/jpeg",
+  ".jpeg": "image/jpeg",
+  ".gltf": "application/json; charset=utf-8",
+  ".glb": "model/gltf-binary",
+};
+
+function splitList(value) {
+  return value
+    .split(",")
+    .map((item) => item.trim())
+    .filter(Boolean);
+}
+
+function selectedModels() {
+  const requested = splitList(optStr("models"));
+  if (requested.length === 0) return MODEL_CORPUS;
+  const byId = new Map(MODEL_CORPUS.map((model) => [model.id, model]));
+  const selected = requested.map((id) => {
+    const known = byId.get(id);
+    if (known) return known;
+    if (id.startsWith("glb:") || id.startsWith("obj:")) {
+      return { id: id.replace(/[^a-z0-9]+/gi, "-").replace(/^-|-$/g, ""), label: id, mesh: id };
+    }
+    throw new Error(`Unknown model "${id}". Known: ${MODEL_CORPUS.map((m) => m.id).join(", ")}`);
+  });
+  return selected;
+}
+
+function selectedVariants() {
+  const requested = splitList(optStr("variants"));
+  if (requested.length === 0) return VARIANTS;
+  const byId = new Map(VARIANTS.map((variant) => [variant.id, variant]));
+  return requested.map((id) => {
+    const variant = byId.get(id);
+    if (!variant) throw new Error(`Unknown variant "${id}". Known: ${VARIANTS.map((v) => v.id).join(", ")}`);
+    return variant;
+  });
+}
+
+function selectedRunOrder() {
+  const normalized = RUN_ORDER_ALIASES.get(RUN_ORDER_INPUT);
+  if (!normalized) {
+    throw new Error(`--run-order must be grouped, round-robin, or random; got "${RUN_ORDER_INPUT}"`);
+  }
+  return normalized;
+}
+
+function selectedModes() {
+  if (MODE === "both") return ["baked", "dynamic"];
+  if (MODE !== "baked" && MODE !== "dynamic") throw new Error("--mode must be baked, dynamic, or both");
+  return [MODE];
+}
+
+function startServer() {
+  return new Promise((resolveStart, rejectStart) => {
+    const server = createServer(async (req, res) => {
+      try {
+        const u = new URL(req.url, "http://localhost");
+        const safe = u.pathname.replace(/\/+/g, "/");
+        if (safe.includes("..")) {
+          res.writeHead(403);
+          res.end("forbidden");
+          return;
+        }
+        const abs = safe.startsWith("/gallery/")
+          ? resolve(galleryDir, safe.slice("/gallery/".length))
+          : resolve(benchDir, safe === "/" ? "nonvoxel-vanilla.html" : safe.slice(1));
+        const data = await readFile(abs);
+        res.writeHead(200, {
+          "Content-Type": MIME[extname(abs).toLowerCase()] || "application/octet-stream",
+          "Cache-Control": "no-store",
+        });
+        res.end(data);
+      } catch (error) {
+        res.writeHead(404);
+        res.end(String(error?.message ?? error));
+      }
+    });
+    server.on("error", rejectStart);
+    server.listen(0, "127.0.0.1", () => {
+      const addr = server.address();
+      resolveStart({ server, port: typeof addr === "object" ? addr.port : 0 });
+    });
+  });
+}
+
+function stopServer(server) {
+  return new Promise((resolveStop) => server.close(() => resolveStop()));
+}
+
+function quantile(sorted, q) {
+  if (sorted.length === 0) return 0;
+  const i = (sorted.length - 1) * q;
+  const lo = Math.floor(i);
+  const hi = Math.ceil(i);
+  if (lo === hi) return sorted[lo];
+  return sorted[lo] + (sorted[hi] - sorted[lo]) * (i - lo);
+}
+
+function summarizeFrameTimes(dts, rawCount = dts.length) {
+  const sorted = [...dts].sort((a, b) => a - b);
+  const p50 = quantile(sorted, 0.5);
+  const p95 = quantile(sorted, 0.95);
+  const p99 = quantile(sorted, 0.99);
+  return {
+    fps_p50: p50 > 0 ? 1000 / p50 : 0,
+    fps_p95: p95 > 0 ? 1000 / p95 : 0,
+    frame_time_p50_ms: p50,
+    frame_time_p95_ms: p95,
+    frame_time_p99_ms: p99,
+    sample_count: sorted.length,
+    sample_count_raw: rawCount,
+    sample_count_filtered: rawCount - sorted.length,
+  };
+}
+
+function median(values) {
+  const sorted = values.filter(Number.isFinite).sort((a, b) => a - b);
+  return quantile(sorted, 0.5);
+}
+
+function hashString(value) {
+  let hash = 2166136261;
+  for (let i = 0; i < value.length; i += 1) {
+    hash ^= value.charCodeAt(i);
+    hash = Math.imul(hash, 16777619);
+  }
+  return hash >>> 0;
+}
+
+function seededRandom(seed) {
+  let state = hashString(seed) || 1;
+  return () => {
+    state += 0x6d2b79f5;
+    let t = state;
+    t = Math.imul(t ^ (t >>> 15), t | 1);
+    t ^= t + Math.imul(t ^ (t >>> 7), t | 61);
+    return ((t ^ (t >>> 14)) >>> 0) / 4294967296;
+  };
+}
+
+function shuffle(items, seed) {
+  const rng = seededRandom(seed);
+  const out = [...items];
+  for (let i = out.length - 1; i > 0; i -= 1) {
+    const j = Math.floor(rng() * (i + 1));
+    [out[i], out[j]] = [out[j], out[i]];
+  }
+  return out;
+}
+
+function instantiateVariants(selected) {
+  const totals = new Map();
+  for (const variant of selected) totals.set(variant.id, (totals.get(variant.id) ?? 0) + 1);
+  const seen = new Map();
+  return selected.map((variant) => {
+    const occurrence = (seen.get(variant.id) ?? 0) + 1;
+    seen.set(variant.id, occurrence);
+    const duplicate = (totals.get(variant.id) ?? 0) > 1;
+    return {
+      ...variant,
+      occurrence,
+      runKey: duplicate ? `${variant.id}#${occurrence}` : variant.id,
+    };
+  });
+}
+
+function variantName(variant) {
+  return variant.occurrence > 1 ? `${variant.id}#${variant.occurrence}` : variant.id;
+}
+
+function buildRunPlan(variants, repeats, runOrder, seedParts) {
+  const plan = [];
+  if (runOrder === "round-robin") {
+    for (let repeat = 1; repeat <= repeats; repeat += 1) {
+      for (const variant of variants) plan.push({ variant, repeat });
+    }
+  } else {
+    for (const variant of variants) {
+      for (let repeat = 1; repeat <= repeats; repeat += 1) plan.push({ variant, repeat });
+    }
+  }
+  const ordered = runOrder === "random" ? shuffle(plan, seedParts.join(":")) : plan;
+  return ordered.map((entry, index) => ({ ...entry, runIndex: index + 1 }));
+}
+
+function aggregateRuns(runs) {
+  return {
+    fps_p50: median(runs.map((run) => run.fps_p50)),
+    fps_p95: median(runs.map((run) => run.fps_p95)),
+    frame_time_p99_ms: median(runs.map((run) => run.frame_time_p99_ms)),
+    sample_count: median(runs.map((run) => run.sample_count)),
+    sample_count_raw: median(runs.map((run) => run.sample_count_raw)),
+    sample_count_filtered: median(runs.map((run) => run.sample_count_filtered)),
+    polyCount: runs[0]?.polyCount ?? 0,
+    renderStats: runs[0]?.renderStats ?? null,
+    runs,
+  };
+}
+
+function urlFor(port, model, variant, mode) {
+  const params = new URLSearchParams({
+    mesh: model.mesh,
+    mode,
+    motion: "rot",
+    ...(model.params ?? {}),
+    ...(variant.params ?? {}),
+  });
+  return `http://127.0.0.1:${port}/nonvoxel-vanilla.html?${params.toString()}`;
+}
+
+async function runOnce(port, model, variant, mode) {
+  const launchOptions = { headless: !HEADED, args: CHROMIUM_ARGS };
+  if (BROWSER_EXECUTABLE) launchOptions.executablePath = BROWSER_EXECUTABLE;
+  const browser = await chromium.launch(launchOptions);
+  try {
+    const ctx = await browser.newContext({ viewport: { width: 1280, height: 800 } });
+    const page = await ctx.newPage();
+    await page.goto(urlFor(port, model, variant, mode), { waitUntil: "load" });
+    await page.waitForFunction(() => window.__perf__?.ready === true, null, { timeout: 30000 });
+    await page.waitForTimeout(WARMUP_MS);
+    const startIdx = await page.evaluate(() => window.__perf__.samples.length);
+    await page.waitForTimeout(SAMPLE_MS);
+    const pageResult = await page.evaluate((from) => ({
+      samples: window.__perf__.samples.slice(from),
+      polyCount: window.__perf__.polyCount,
+      renderStats: window.__perf__.renderStats ?? null,
+    }), startIdx);
+    await ctx.close();
+
+    const rawDts = pageResult.samples.map((sample) => sample.dt).filter((dt) => dt > 0);
+    const dts = rawDts.filter((dt) => dt < 2000);
+    return {
+      ...summarizeFrameTimes(dts, rawDts.length),
+      polyCount: pageResult.polyCount,
+      renderStats: pageResult.renderStats,
+    };
+  } finally {
+    await browser.close();
+  }
+}
+
+function formatNumber(value, digits = 1) {
+  return Number.isFinite(value) ? value.toFixed(digits) : "0.0";
+}
+
+function tagSummary(renderStats) {
+  const tags = renderStats?.dom?.tags;
+  if (!tags) return "";
+  return `${tags.b}/${tags.i}/${tags.s}/${tags.u}/${tags.q}`;
+}
+
+function pctDelta(value, baseline) {
+  if (!baseline) return 0;
+  return ((value - baseline) / baseline) * 100;
+}
+
+const models = selectedModels();
+const variants = instantiateVariants(selectedVariants());
+const modes = selectedModes();
+const runOrder = selectedRunOrder();
+const rows = [];
+
+console.log(`[nonvoxel] models=${models.map((model) => model.id).join(",")}`);
+console.log(`[nonvoxel] variants=${variants.map(variantName).join(",")}`);
+console.log(`[nonvoxel] mode=${modes.join(",")} repeats=${REPEATS} runOrder=${runOrder} seed=${SEED} warmup=${WARMUP_MS}ms sample=${SAMPLE_MS}ms`);
+if (BROWSER_EXECUTABLE) console.log(`[nonvoxel] browser=${BROWSER_EXECUTABLE}`);
+if (SOFTWARE_BACKEND) console.log("[nonvoxel] software backend=on");
+if (CHROMIUM_ARGS.length > 0) console.log(`[nonvoxel] chromium args=${CHROMIUM_ARGS.join(" ")}`);
+
+const { server, port } = await startServer();
+console.log(`[nonvoxel] server :${port}`);
+
+try {
+  for (const mode of modes) {
+    console.log("");
+    console.log(`mode: ${mode}`);
+    for (const model of models) {
+      console.log(`  ${model.id} - ${model.reason ?? model.label}`);
+      const runsByVariant = new Map(variants.map((variant) => [variant.runKey, []]));
+      const plan = buildRunPlan(variants, REPEATS, runOrder, [SEED, mode, model.id]);
+      const planWidth = String(plan.length).length;
+      const nameWidth = Math.max(17, ...variants.map((variant) => variantName(variant).length + 1));
+      for (const entry of plan) {
+        process.stdout.write(
+          `    [${String(entry.runIndex).padStart(planWidth)}/${plan.length}] ` +
+          `${variantName(entry.variant).padEnd(nameWidth)}r${entry.repeat} `,
+        );
+        const run = await runOnce(port, model, entry.variant, mode);
+        const annotatedRun = {
+          ...run,
+          repeat: entry.repeat,
+          runIndex: entry.runIndex,
+          runOrder,
+        };
+        runsByVariant.get(entry.variant.runKey).push(annotatedRun);
+        process.stdout.write(
+          `p50=${formatNumber(run.fps_p50).padStart(5)} p95=${formatNumber(run.fps_p95).padStart(5)} ` +
+          `p99=${formatNumber(run.frame_time_p99_ms).padStart(5)}ms ` +
+          `polys=${String(run.polyCount).padStart(5)} tags=${tagSummary(run.renderStats)}\n`,
+        );
+      }
+
+      let baselineP95 = 0;
+      for (const variant of variants) {
+        const runs = runsByVariant.get(variant.runKey) ?? [];
+        const result = aggregateRuns(runs);
+        if (variant.id === "baseline") baselineP95 = result.fps_p95;
+        const delta = variant.id === "baseline" ? 0 : pctDelta(result.fps_p95, baselineP95);
+        const row = {
+          mode,
+          modelId: model.id,
+          modelLabel: model.label,
+          modelMesh: model.mesh,
+          variantKey: variant.runKey,
+          variantId: variant.id,
+          variantLabel: variant.label,
+          hypothesis: variant.hypothesis,
+          runOrder,
+          seed: SEED,
+          fps_p50: +result.fps_p50.toFixed(2),
+          fps_p95: +result.fps_p95.toFixed(2),
+          frame_time_p99_ms: +result.frame_time_p99_ms.toFixed(2),
+          p95_delta_pct: +delta.toFixed(1),
+          sample_count: result.sample_count,
+          sample_count_raw: result.sample_count_raw,
+          sample_count_filtered: result.sample_count_filtered,
+          polyCount: result.polyCount,
+          renderStats: result.renderStats,
+          runs: result.runs,
+        };
+        rows.push(row);
+        const deltaText = variant.id === "baseline" ? "base" : `${delta >= 0 ? "+" : ""}${delta.toFixed(1)}%`;
+        process.stdout.write(
+          `    ${variantName(variant).padEnd(nameWidth)}summary p50=${formatNumber(result.fps_p50).padStart(5)} p95=${formatNumber(result.fps_p95).padStart(5)} ` +
+          `p99=${formatNumber(result.frame_time_p99_ms).padStart(5)}ms ${deltaText.padStart(8)} ` +
+          `polys=${String(result.polyCount).padStart(5)} tags=${tagSummary(result.renderStats)}\n`,
+        );
+      }
+    }
+  }
+
+  const output = {
+    kind: "nonvoxel-rotation",
+    warmup_ms: WARMUP_MS,
+    sample_ms: SAMPLE_MS,
+    repeats: REPEATS,
+    runOrder,
+    seed: SEED,
+    browserExecutable: BROWSER_EXECUTABLE || null,
+    chromiumArgs: CHROMIUM_ARGS,
+    softwareBackend: SOFTWARE_BACKEND,
+    models,
+    variants,
+    rows,
+  };
+
+  if (JSON_PATH) {
+    const outputPath = resolve(repoRoot, JSON_PATH);
+    mkdirSync(dirname(outputPath), { recursive: true });
+    writeFileSync(outputPath, `${JSON.stringify(output, null, 2)}\n`);
+    console.log("");
+    console.log(`[nonvoxel] wrote ${outputPath}`);
+  }
+
+  if (PRINT_JSON) {
+    console.log("");
+    console.log(JSON.stringify(output, null, 2));
+  }
+} finally {
+  await stopServer(server);
+}
diff --git a/bench/nonvoxel-vanilla.html b/bench/nonvoxel-vanilla.html
new file mode 100644
index 00000000..da25670e
--- /dev/null
+++ b/bench/nonvoxel-vanilla.html
@@ -0,0 +1,371 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <title>polycss perf - non-voxel vanilla JS</title>
+  <style id="overlay-css"></style>
+</head>
+<body>
+  <div id="host"></div>
+
+  <script type="module">
+    import { createPolyScene, createPolyOrbitControls, loadMesh } from "./polycss.js";
+    import { getSynthMesh } from "./synth-mesh.mjs";
+    import {
+      parseUrlParams, dirFromAzEl, createPerfRecorder,
+      PERF_OVERLAY_HTML, PERF_OVERLAY_CSS,
+    } from "./perf-shared.mjs";
+
+    document.getElementById("overlay-css").textContent = PERF_OVERLAY_CSS;
+    document.body.insertAdjacentHTML("beforeend", PERF_OVERLAY_HTML);
+
+    const { meshId, mode, motion, az, el, isSynth, preset } = parseUrlParams();
+    const benchParams = new URLSearchParams(window.location.search);
+    const sceneTransformMode = benchParams.get("sceneTransformMode") || "default";
+    const rotationDriver = benchParams.get("rotationDriver") || "js";
+    const polygonOrder = benchParams.get("polygonOrder") || "source";
+    const domOrder = benchParams.get("domOrder") || "source";
+    const leafBucketSize = Number(benchParams.get("leafBucketSize") || 0);
+    const disabledStrategies = (benchParams.get("disableStrategies") || "")
+      .split(",")
+      .map((value) => value.trim())
+      .filter(Boolean);
+    let azimuth = az;
+
+    const host = document.getElementById("host");
+    const scene = createPolyScene(host, {
+      rotX: preset.rotX, rotY: preset.rotY, zoom: preset.zoom,
+      directionalLight: { direction: dirFromAzEl(azimuth, el), color: "#ffffff", intensity: 1 },
+      ambientLight: { color: "#ffffff", intensity: 0.4 },
+      textureLighting: mode,
+      autoCenter: true,
+      ...(disabledStrategies.length > 0 ? { strategies: { disable: disabledStrategies } } : {}),
+    });
+    createPolyOrbitControls(scene, { drag: true, wheel: true });
+
+    const sceneEl = host.querySelector(".polycss-scene");
+    let splitShell = null;
+
+    function formatMatrixTransform(transform) {
+      const matrix = new DOMMatrix(transform || "none");
+      return matrix.toString();
+    }
+
+    function scenePerspective() {
+      return sceneEl?.style.perspective || getComputedStyle(sceneEl).perspective || "8000px";
+    }
+
+    function ensureSplitShell() {
+      if (splitShell || !sceneEl) return splitShell;
+      splitShell = document.createElement("div");
+      splitShell.style.cssText = [
+        "position:absolute",
+        "top:0",
+        "left:0",
+        "width:0",
+        "height:0",
+        "transform-style:preserve-3d",
+        "will-change:transform",
+      ].join(";");
+      while (sceneEl.firstChild) splitShell.appendChild(sceneEl.firstChild);
+      sceneEl.appendChild(splitShell);
+      return splitShell;
+    }
+
+    function applySceneTransformMode() {
+      if (!sceneEl || sceneTransformMode === "default") return;
+      const transform = sceneEl.style.transform || "";
+      if (sceneTransformMode === "matrix3d") {
+        sceneEl.style.transform = formatMatrixTransform(transform);
+        return;
+      }
+      if (sceneTransformMode === "split-target") {
+        const shell = ensureSplitShell();
+        const match = transform.match(/\s*translate3d\([^)]*\)\s*$/);
+        if (!match) return;
+        sceneEl.style.transform = transform.slice(0, match.index).trim();
+        shell.style.transform = match[0].trim();
+        return;
+      }
+      if (sceneTransformMode === "host-perspective") {
+        host.style.perspective = scenePerspective();
+        host.style.transformStyle = "preserve-3d";
+        sceneEl.style.perspective = "none";
+        return;
+      }
+      if (sceneTransformMode === "transform-perspective") {
+        const perspective = scenePerspective();
+        sceneEl.style.perspective = "none";
+        sceneEl.style.transform = `perspective(${perspective}) ${transform}`;
+        return;
+      }
+      if (sceneTransformMode === "no-will-change") {
+        sceneEl.style.willChange = "auto";
+      }
+    }
+
+    function centroid(polygon) {
+      const out = [0, 0, 0];
+      for (const vertex of polygon.vertices) {
+        out[0] += vertex[0];
+        out[1] += vertex[1];
+        out[2] += vertex[2];
+      }
+      const n = polygon.vertices.length || 1;
+      out[0] /= n;
+      out[1] /= n;
+      out[2] /= n;
+      return out;
+    }
+
+    function polygonArea(polygon) {
+      const vertices = polygon.vertices;
+      if (vertices.length < 3) return 0;
+      const v0 = vertices[0];
+      let area = 0;
+      for (let i = 1; i + 1 < vertices.length; i++) {
+        const a = vertices[i];
+        const b = vertices[i + 1];
+        const ax = a[0] - v0[0], ay = a[1] - v0[1], az = a[2] - v0[2];
+        const bx = b[0] - v0[0], by = b[1] - v0[1], bz = b[2] - v0[2];
+        const cx = ay * bz - az * by;
+        const cy = az * bx - ax * bz;
+        const cz = ax * by - ay * bx;
+        area += Math.hypot(cx, cy, cz) / 2;
+      }
+      return area;
+    }
+
+    function polygonNormalZ(polygon) {
+      const vertices = polygon.vertices;
+      if (vertices.length < 3) return 0;
+      const v0 = vertices[0];
+      let nz = 0;
+      for (let i = 1; i + 1 < vertices.length; i++) {
+        const v1 = vertices[i];
+        const v2 = vertices[i + 1];
+        const e1x = v1[1] - v0[1], e1y = v1[0] - v0[0], e1z = v1[2] - v0[2];
+        const e2x = v2[1] - v0[1], e2y = v2[0] - v0[0], e2z = v2[2] - v0[2];
+        nz -= e1x * e2y - e1y * e2x;
+      }
+      return nz;
+    }
+
+    function projectedCentroid(polygon) {
+      const c = centroid(polygon);
+      let x = c[1];
+      let y = c[0];
+      let z = c[2];
+      const rz = (preset.rotY * Math.PI) / 180;
+      const cosZ = Math.cos(rz);
+      const sinZ = Math.sin(rz);
+      const zx = x * cosZ - y * sinZ;
+      const zy = x * sinZ + y * cosZ;
+      x = zx;
+      y = zy;
+      const rx = (preset.rotX * Math.PI) / 180;
+      const cosX = Math.cos(rx);
+      const sinX = Math.sin(rx);
+      return {
+        x,
+        y: y * cosX - z * sinX,
+        z: y * sinX + z * cosX,
+      };
+    }
+
+    function orderedPolygonIndexes(polygons, orderName) {
+      if (orderName === "source") return polygons.map((_polygon, index) => index);
+      const items = polygons.map((polygon, index) => ({
+        polygon,
+        index,
+        area: polygonArea(polygon),
+        normalZ: polygonNormalZ(polygon),
+        projected: projectedCentroid(polygon),
+      }));
+
+      if (orderName === "area-desc") {
+        items.sort((a, b) => b.area - a.area || a.index - b.index);
+      } else if (orderName === "area-asc") {
+        items.sort((a, b) => a.area - b.area || a.index - b.index);
+      } else if (orderName === "normal-z") {
+        items.sort((a, b) => b.normalZ - a.normalZ || a.index - b.index);
+      } else if (orderName === "initial-depth") {
+        items.sort((a, b) => b.projected.z - a.projected.z || a.index - b.index);
+      } else if (orderName === "tile4-screen") {
+        let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
+        for (const item of items) {
+          minX = Math.min(minX, item.projected.x);
+          minY = Math.min(minY, item.projected.y);
+          maxX = Math.max(maxX, item.projected.x);
+          maxY = Math.max(maxY, item.projected.y);
+        }
+        const spanX = Math.max(1e-6, maxX - minX);
+        const spanY = Math.max(1e-6, maxY - minY);
+        for (const item of items) {
+          item.tileX = Math.max(0, Math.min(3, Math.floor(((item.projected.x - minX) / spanX) * 4)));
+          item.tileY = Math.max(0, Math.min(3, Math.floor(((item.projected.y - minY) / spanY) * 4)));
+        }
+        items.sort((a, b) =>
+          a.tileY - b.tileY ||
+          a.tileX - b.tileX ||
+          b.projected.z - a.projected.z ||
+          a.index - b.index
+        );
+      }
+
+      return items.map((item) => item.index);
+    }
+
+    function orderedPolygons(polygons) {
+      return orderedPolygonIndexes(polygons, polygonOrder).map((index) => polygons[index]);
+    }
+
+    function applyPolygonBenchIndexes(parseResult) {
+      parseResult.polygons.forEach((polygon, index) => {
+        polygon.data = {
+          ...(polygon.data ?? {}),
+          "bench-index": index,
+        };
+      });
+      return parseResult;
+    }
+
+    function applyPolygonOrder(parseResult) {
+      if (polygonOrder === "source" || parseResult.voxelSource) return parseResult;
+      return {
+        ...parseResult,
+        polygons: orderedPolygons(parseResult.polygons),
+      };
+    }
+
+    function elementDomOrderRank(element, ranks) {
+      if (element.classList.contains("polycss-bucket")) {
+        let best = Infinity;
+        for (const child of Array.from(element.children)) {
+          const rank = elementDomOrderRank(child, ranks);
+          if (rank < best) best = rank;
+        }
+        return best;
+      }
+      const index = element.getAttribute("data-bench-index");
+      return index === null ? Infinity : (ranks.get(Number(index)) ?? Infinity);
+    }
+
+    function sortDirectRenderableChildren(parent, ranks) {
+      const sortable = Array.from(parent.children).filter((child) => {
+        if (!(child instanceof HTMLElement)) return false;
+        if (child.classList.contains("polycss-shadow")) return false;
+        if (child.classList.contains("polycss-bucket")) return true;
+        return ["b", "i", "s", "u"].includes(child.tagName.toLowerCase());
+      });
+      sortable.sort((a, b) =>
+        elementDomOrderRank(a, ranks) - elementDomOrderRank(b, ranks)
+      );
+      for (const child of sortable) parent.appendChild(child);
+    }
+
+    function applyDomOrder(parseResult) {
+      if (domOrder === "source" || parseResult.voxelSource) return;
+      const ranks = new Map();
+      orderedPolygonIndexes(parseResult.polygons, domOrder)
+        .forEach((polygonIndex, rank) => ranks.set(polygonIndex, rank));
+      for (const wrapper of host.querySelectorAll(".polycss-mesh")) {
+        for (const child of Array.from(wrapper.children)) {
+          if (child instanceof HTMLElement && child.classList.contains("polycss-bucket")) {
+            sortDirectRenderableChildren(child, ranks);
+          }
+        }
+        sortDirectRenderableChildren(wrapper, ranks);
+      }
+    }
+
+    function isRenderableLeaf(element) {
+      return element instanceof HTMLElement &&
+        ["b", "i", "s", "u"].includes(element.tagName.toLowerCase());
+    }
+
+    function applyLeafBuckets() {
+      if (!Number.isFinite(leafBucketSize) || leafBucketSize < 2) return;
+      for (const wrapper of host.querySelectorAll(".polycss-mesh")) {
+        const leaves = Array.from(wrapper.children).filter(isRenderableLeaf);
+        if (leaves.length <= leafBucketSize) continue;
+        for (let i = 0; i < leaves.length; i += leafBucketSize) {
+          const bucket = document.createElement("div");
+          bucket.className = "polycss-bucket polycss-bench-leaf-bucket";
+          bucket.style.cssText = "position:absolute;transform-style:preserve-3d";
+          wrapper.insertBefore(bucket, leaves[i]);
+          for (const leaf of leaves.slice(i, i + leafBucketSize)) bucket.appendChild(leaf);
+        }
+      }
+    }
+
+    function offsetRotate(transform, offsetDeg) {
+      return transform.replace(
+        /(^|\s)rotate\((-?\d+(?:\.\d+)?)deg\)/,
+        (_match, prefix, value) => `${prefix}rotate(${Number(value) + offsetDeg}deg)`,
+      );
+    }
+
+    function installCssKeyframeRotation() {
+      if (!sceneEl || motion !== "rot" || rotationDriver !== "css-keyframes") return false;
+      const startTransform = sceneEl.style.transform || getComputedStyle(sceneEl).transform;
+      const endTransform = offsetRotate(startTransform, 360);
+      if (startTransform === endTransform) return false;
+      const name = `polycss-perf-rotate-${Math.random().toString(36).slice(2)}`;
+      const style = document.createElement("style");
+      style.textContent = `@keyframes ${name}{from{transform:${startTransform}}to{transform:${endTransform}}}`;
+      document.head.appendChild(style);
+      sceneEl.style.animation = `${name} 12000ms linear infinite`;
+      return true;
+    }
+
+    const meshPromise = isSynth
+      ? Promise.resolve(getSynthMesh(meshId))
+      : loadMesh(preset.url, {
+          ...(preset.mtlUrl ? { mtlUrl: preset.mtlUrl } : {}),
+          objOptions: preset.options,
+        });
+
+    meshPromise.then((rawParseResult) => {
+      if (!rawParseResult) throw new Error(`Unknown synth mesh: ${meshId}`);
+      const indexedParseResult = applyPolygonBenchIndexes(rawParseResult);
+      const parseResult = applyPolygonOrder(indexedParseResult);
+      scene.add(parseResult);
+      applyDomOrder(indexedParseResult);
+      applyLeafBuckets();
+      applySceneTransformMode();
+      const cssDrivenRotation = installCssKeyframeRotation();
+
+      const recorder = createPerfRecorder({
+        rendererLabel: "nonvoxel-vanilla",
+        meshId, mode, motion,
+        polyCount: parseResult.polygons.length,
+        polygons: parseResult.polygons,
+      });
+
+      let frameCount = 0;
+      function tick(now) {
+        recorder.onFrame(now);
+        frameCount += 1;
+        if (motion === "light") {
+          azimuth = (azimuth + 0.5) % 360;
+          scene.setOptions({
+            directionalLight: { direction: dirFromAzEl(azimuth, el), color: "#ffffff", intensity: 1 },
+          });
+        } else if (motion === "rot") {
+          const newRotY = ((preset.rotY + frameCount * 0.5) + 360) % 360;
+          if (!cssDrivenRotation) {
+            scene.setOptions({ rotY: newRotY });
+            applySceneTransformMode();
+          }
+        }
+        requestAnimationFrame(tick);
+      }
+      requestAnimationFrame(tick);
+    }).catch((err) => {
+      console.error("nonvoxel-vanilla mesh load failed", err);
+      document.getElementById("fps-now").textContent = "ERR";
+    });
+  </script>
+</body>
+</html>
diff --git a/bench/nonvoxel-visual-compare.mjs b/bench/nonvoxel-visual-compare.mjs
new file mode 100644
index 00000000..ee0c2afb
--- /dev/null
+++ b/bench/nonvoxel-visual-compare.mjs
@@ -0,0 +1,335 @@
+#!/usr/bin/env node
+/**
+ * Visual parity check for non-voxel bench variants.
+ *
+ * This compares nonvoxel-vanilla.html variants against the baked baseline at
+ * a static camera pose. It is intentionally bench-only: the goal is to reject
+ * performance leads that alter projection before they reach product code.
+ */
+import { createServer } from "node:http";
+import { mkdirSync, writeFileSync } from "node:fs";
+import { readFile } from "node:fs/promises";
+import { dirname, extname, resolve } from "node:path";
+import { fileURLToPath } from "node:url";
+import { chromium } from "playwright";
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const repoRoot = resolve(__dirname, "..");
+const benchDir = resolve(repoRoot, "bench");
+const galleryDir = resolve(repoRoot, "website/public/gallery");
+const resultsDir = resolve(benchDir, "results");
+
+const argv = process.argv.slice(2);
+const flag = (name) => argv.indexOf(`--${name}`);
+const optStr = (name, dflt = "") => {
+  const i = flag(name);
+  if (i >= 0) return argv[i + 1] ?? dflt;
+  const prefixed = argv.find((arg) => arg.startsWith(`--${name}=`));
+  return prefixed ? prefixed.slice(name.length + 3) : dflt;
+};
+const optNum = (name, dflt) => {
+  const raw = optStr(name);
+  if (raw.trim() === "") return dflt;
+  const value = Number(raw);
+  return Number.isFinite(value) ? value : dflt;
+};
+const optAll = (name) => {
+  const values = [];
+  for (let i = 0; i < argv.length; i += 1) {
+    const arg = argv[i];
+    if (arg === `--${name}` && argv[i + 1]) {
+      values.push(argv[i + 1]);
+      i += 1;
+    } else if (arg.startsWith(`--${name}=`)) {
+      values.push(arg.slice(name.length + 3));
+    }
+  }
+  return values;
+};
+const hasFlag = (name) => flag(name) >= 0 || argv.includes(`--${name}=true`);
+
+const MODE = optStr("mode", "baked");
+const MOTION = optStr("motion", "none");
+const THRESHOLD = optNum("threshold", 0.01);
+const WIDTH = optNum("width", 1280);
+const HEIGHT = optNum("height", 800);
+const SETTLE_MS = optNum("settle", 250);
+const JSON_PATH = optStr("json");
+const SCREENSHOT_DIR = optStr("screenshots");
+const HEADED = hasFlag("headed");
+const BROWSER_EXECUTABLE = optStr("browser-executable");
+const CHROMIUM_ARGS = [
+  ...optAll("chromium-arg"),
+  ...optAll("chromium-args").flatMap((value) => value.split(/\s+/).filter(Boolean)),
+];
+
+const MODELS = [
+  { id: "chicken", mesh: "chicken" },
+  { id: "rock1", mesh: "rock1" },
+  { id: "saucer", mesh: "saucer" },
+  { id: "teapot", mesh: "teapot" },
+  { id: "ducky", mesh: "ducky" },
+  { id: "bicycle", mesh: "glb:Bicycle.glb", params: { zoom: "0.35", targetSize: "60" } },
+  { id: "elephant", mesh: "glb:Elephant.glb", params: { zoom: "0.35", targetSize: "60" } },
+  { id: "policecar", mesh: "glb:Policecar.glb", params: { zoom: "0.35", targetSize: "60" } },
+];
+
+const VARIANT_PARAMS = {
+  baseline: {},
+  "scene-matrix3d": { sceneTransformMode: "matrix3d" },
+  "scene-split-target": { sceneTransformMode: "split-target" },
+  "scene-host-perspective": { sceneTransformMode: "host-perspective" },
+  "scene-transform-perspective": { sceneTransformMode: "transform-perspective" },
+  "no-will-change": { sceneTransformMode: "no-will-change" },
+  "leaf-buckets-64": { leafBucketSize: "64" },
+  "leaf-buckets-128": { leafBucketSize: "128" },
+  "leaf-buckets-256": { leafBucketSize: "256" },
+};
+
+const MIME = {
+  ".html": "text/html; charset=utf-8",
+  ".js": "application/javascript; charset=utf-8",
+  ".mjs": "application/javascript; charset=utf-8",
+  ".css": "text/css; charset=utf-8",
+  ".json": "application/json; charset=utf-8",
+  ".obj": "text/plain; charset=utf-8",
+  ".mtl": "text/plain; charset=utf-8",
+  ".png": "image/png",
+  ".jpg": "image/jpeg",
+  ".jpeg": "image/jpeg",
+  ".gltf": "application/json; charset=utf-8",
+  ".glb": "model/gltf-binary",
+  ".vox": "application/octet-stream",
+};
+
+function splitList(value) {
+  return value
+    .split(",")
+    .map((item) => item.trim())
+    .filter(Boolean);
+}
+
+function selectedModels() {
+  const requested = splitList(optStr("models"));
+  if (requested.length === 0) return MODELS;
+  const byId = new Map(MODELS.map((model) => [model.id, model]));
+  return requested.map((id) => {
+    const known = byId.get(id);
+    if (known) return known;
+    if (id.startsWith("glb:") || id.startsWith("obj:")) {
+      return { id: id.replace(/[^a-z0-9]+/gi, "-").replace(/^-|-$/g, ""), mesh: id };
+    }
+    throw new Error(`Unknown model "${id}". Known: ${MODELS.map((model) => model.id).join(", ")}`);
+  });
+}
+
+function selectedVariants() {
+  const requested = splitList(optStr("variants", "scene-split-target,scene-transform-perspective"));
+  return requested.map((id) => {
+    const params = VARIANT_PARAMS[id];
+    if (!params) throw new Error(`Unknown variant "${id}". Known: ${Object.keys(VARIANT_PARAMS).join(", ")}`);
+    if (id === "baseline") throw new Error("Baseline is implicit; do not include it in --variants.");
+    return { id, params };
+  });
+}
+
+function startServer() {
+  return new Promise((resolveStart, rejectStart) => {
+    const server = createServer(async (req, res) => {
+      try {
+        const u = new URL(req.url, "http://localhost");
+        const safe = u.pathname.replace(/\/+/g, "/");
+        if (safe.includes("..")) {
+          res.writeHead(403);
+          res.end();
+          return;
+        }
+        const abs = safe.startsWith("/gallery/")
+          ? resolve(galleryDir, safe.slice("/gallery/".length))
+          : resolve(benchDir, safe === "/" ? "nonvoxel-vanilla.html" : safe.slice(1));
+        const data = await readFile(abs);
+        res.writeHead(200, {
+          "Content-Type": MIME[extname(abs).toLowerCase()] || "application/octet-stream",
+          "Cache-Control": "no-store",
+        });
+        res.end(data);
+      } catch (error) {
+        res.writeHead(404);
+        res.end(String(error?.message ?? error));
+      }
+    });
+    server.on("error", rejectStart);
+    server.listen(0, "127.0.0.1", () => {
+      const addr = server.address();
+      resolveStart({ server, port: typeof addr === "object" ? addr.port : 0 });
+    });
+  });
+}
+
+function stopServer(server) {
+  return new Promise((resolveStop) => server.close(resolveStop));
+}
+
+function queryString(model, params = {}) {
+  const search = new URLSearchParams({
+    mesh: model.mesh,
+    mode: MODE,
+    motion: MOTION,
+    ...model.params,
+    ...params,
+  });
+  return search.toString();
+}
+
+async function waitForReady(page) {
+  await page.waitForFunction(() => window.__perf__?.ready === true, null, { timeout: 30000 });
+  await page.waitForFunction(() => document.querySelectorAll(".polycss-scene b,.polycss-scene i,.polycss-scene s,.polycss-scene u").length > 0, null, { timeout: 30000 });
+  await page.addStyleTag({ content: "#fps{display:none!important}" });
+  await page.waitForTimeout(SETTLE_MS);
+}
+
+async function screenshotVariant(page, port, model, variant) {
+  const url = `http://127.0.0.1:${port}/nonvoxel-vanilla.html?${queryString(model, variant.params)}`;
+  await page.goto(url, { waitUntil: "load" });
+  await waitForReady(page);
+  return {
+    buffer: await page.screenshot({ fullPage: false }),
+    url,
+    renderStats: await page.evaluate(() => window.__perf__?.renderStats ?? null),
+    sceneTransform: await page.evaluate(() => {
+      const scene = document.querySelector(".polycss-scene");
+      const host = document.getElementById("host");
+      return {
+        scene: scene instanceof HTMLElement ? scene.style.transform : "",
+        scenePerspective: scene instanceof HTMLElement ? scene.style.perspective : "",
+        hostPerspective: host instanceof HTMLElement ? host.style.perspective : "",
+        shell: document.querySelector(".polycss-scene > div") instanceof HTMLElement
+          ? document.querySelector(".polycss-scene > div").style.transform
+          : "",
+      };
+    }),
+  };
+}
+
+async function compareBuffers(page, baseline, candidate) {
+  return await page.evaluate(async ({ baselineB64, candidateB64 }) => {
+    async function loadImageData(b64) {
+      const img = new Image();
+      img.src = `data:image/png;base64,${b64}`;
+      await img.decode();
+      const canvas = document.createElement("canvas");
+      canvas.width = img.naturalWidth;
+      canvas.height = img.naturalHeight;
+      const ctx = canvas.getContext("2d");
+      ctx.drawImage(img, 0, 0);
+      return ctx.getImageData(0, 0, canvas.width, canvas.height);
+    }
+
+    const [a, b] = await Promise.all([loadImageData(baselineB64), loadImageData(candidateB64)]);
+    if (a.width !== b.width || a.height !== b.height) {
+      return { ok: false, reason: "size", baselineSize: [a.width, a.height], candidateSize: [b.width, b.height] };
+    }
+
+    let sum = 0;
+    let max = 0;
+    let changedPixels = 0;
+    const pixelCount = a.width * a.height;
+    for (let i = 0; i < a.data.length; i += 4) {
+      const dr = Math.abs(a.data[i] - b.data[i]);
+      const dg = Math.abs(a.data[i + 1] - b.data[i + 1]);
+      const db = Math.abs(a.data[i + 2] - b.data[i + 2]);
+      const pixel = Math.max(dr, dg, db);
+      if (pixel > 0) changedPixels += 1;
+      max = Math.max(max, pixel);
+      sum += dr + dg + db;
+    }
+
+    return {
+      ok: true,
+      meanDelta: (sum / (pixelCount * 3)) / 255,
+      maxDelta: max / 255,
+      changedPixelRatio: changedPixels / pixelCount,
+    };
+  }, {
+    baselineB64: baseline.toString("base64"),
+    candidateB64: candidate.toString("base64"),
+  });
+}
+
+function screenshotPath(modelId, variantId) {
+  return resolve(SCREENSHOT_DIR, `${modelId}-${MODE}-${variantId}.png`);
+}
+
+async function main() {
+  const models = selectedModels();
+  const variants = selectedVariants();
+  const { server, port } = await startServer();
+  let browser;
+  try {
+    browser = await chromium.launch({
+      headless: !HEADED,
+      ...(BROWSER_EXECUTABLE ? { executablePath: BROWSER_EXECUTABLE } : {}),
+      args: CHROMIUM_ARGS,
+    });
+    const context = await browser.newContext({ viewport: { width: WIDTH, height: HEIGHT } });
+    const page = await context.newPage();
+    if (SCREENSHOT_DIR) mkdirSync(SCREENSHOT_DIR, { recursive: true });
+
+    const results = [];
+    for (const model of models) {
+      const baseline = await screenshotVariant(page, port, model, { id: "baseline", params: {} });
+      if (SCREENSHOT_DIR) writeFileSync(screenshotPath(model.id, "baseline"), baseline.buffer);
+      for (const variant of variants) {
+        const candidate = await screenshotVariant(page, port, model, variant);
+        if (SCREENSHOT_DIR) writeFileSync(screenshotPath(model.id, variant.id), candidate.buffer);
+        const comparison = await compareBuffers(page, baseline.buffer, candidate.buffer);
+        const meanDelta = comparison.ok ? comparison.meanDelta : Infinity;
+        const pass = comparison.ok && meanDelta <= THRESHOLD;
+        results.push({
+          model: model.id,
+          mesh: model.mesh,
+          variant: variant.id,
+          pass,
+          threshold: THRESHOLD,
+          ...comparison,
+          meanDelta: Number.isFinite(meanDelta) ? +meanDelta.toFixed(6) : meanDelta,
+          maxDelta: comparison.ok ? +comparison.maxDelta.toFixed(6) : null,
+          changedPixelRatio: comparison.ok ? +comparison.changedPixelRatio.toFixed(6) : null,
+          renderStats: candidate.renderStats,
+          transforms: {
+            baseline: baseline.sceneTransform,
+            candidate: candidate.sceneTransform,
+          },
+          url: candidate.url,
+        });
+      }
+    }
+
+    const report = {
+      generatedAt: new Date().toISOString(),
+      mode: MODE,
+      motion: MOTION,
+      viewport: { width: WIDTH, height: HEIGHT },
+      threshold: THRESHOLD,
+      pass: results.every((result) => result.pass),
+      results,
+    };
+
+    if (JSON_PATH) {
+      mkdirSync(dirname(resolve(JSON_PATH)), { recursive: true });
+      writeFileSync(resolve(JSON_PATH), `${JSON.stringify(report, null, 2)}\n`);
+    }
+
+    console.log(JSON.stringify(report, null, 2));
+    await context.close();
+    process.exitCode = report.pass ? 0 : 1;
+  } finally {
+    if (browser) await browser.close();
+    await stopServer(server);
+  }
+}
+
+main().catch((error) => {
+  console.error(error);
+  process.exit(1);
+});
diff --git a/bench/perf-bench.mjs b/bench/perf-bench.mjs
index 24ea400d..e51830e2 100644
--- a/bench/perf-bench.mjs
+++ b/bench/perf-bench.mjs
@@ -25,6 +25,7 @@ import { chromium } from "playwright";
 import { createServer } from "node:http";
 import { readFile } from "node:fs/promises";
 import { extname } from "node:path";
+import { chromiumArgsWithGpuDefault } from "./chromium-defaults.mjs";
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
 const repoRoot = resolve(__dirname, "..");
@@ -64,10 +65,11 @@ const MESH = optStr("mesh", "saucer");
 const HEADED = hasFlag("headed");
 const TRACE = hasFlag("trace");
 const BROWSER_EXECUTABLE = optStr("browser-executable");
-const CHROMIUM_ARGS = [
+const SOFTWARE_BACKEND = hasFlag("software-backend");
+const CHROMIUM_ARGS = chromiumArgsWithGpuDefault([
   ...optAll("chromium-arg"),
   ...optAll("chromium-args").flatMap((value) => value.split(/\s+/).filter(Boolean)),
-];
+], { softwareBackend: SOFTWARE_BACKEND });
 // Filter renderer paths via --renderer html,vanilla,react,vue (default: all).
 const RENDERERS = optStr("renderer", "html,vanilla,react,vue").split(",").map((s) => s.trim()).filter(Boolean);
 // Filter scenarios via --scenario dynamic.camera_rotate,baked.camera_rotate
@@ -371,6 +373,7 @@ async function runScenario(port, scenario) {
 (async () => {
   console.log(`[bench] mesh=${MESH} warmup=${WARMUP_MS}ms sample=${SAMPLE_MS}ms`);
   if (BROWSER_EXECUTABLE) console.log(`[bench] browser=${BROWSER_EXECUTABLE}`);
+  if (SOFTWARE_BACKEND) console.log("[bench] software backend=on");
   if (CHROMIUM_ARGS.length > 0) console.log(`[bench] chromium args=${CHROMIUM_ARGS.join(" ")}`);
   if (SCENARIO_FILTER.size > 0) console.log(`[bench] scenarios=${[...SCENARIO_FILTER].join(",")}`);
   if (TRACE) console.log("[bench] trace=on");
@@ -430,6 +433,7 @@ async function runScenario(port, scenario) {
       polyCount,
       browserExecutable: BROWSER_EXECUTABLE || null,
       chromiumArgs: CHROMIUM_ARGS,
+      softwareBackend: SOFTWARE_BACKEND,
       warmup_ms: WARMUP_MS, sample_ms: SAMPLE_MS,
       ...results,
     };
diff --git a/bench/perf-shared.mjs b/bench/perf-shared.mjs
index f75024bb..756b68f5 100644
--- a/bench/perf-shared.mjs
+++ b/bench/perf-shared.mjs
@@ -62,6 +62,56 @@ export const PRESETS = {
     options: { targetSize: 60 },
     zoom: 0.4, rotX: 65, rotY: 45,
   },
+  "ancient-crash-site": {
+    url: "/gallery/vox/AncientCrashSite.vox",
+    options: { targetSize: 70, gridShift: 0 },
+    zoom: 0.35, rotX: 65, rotY: 45,
+  },
+  "desert2": {
+    url: "/gallery/vox/desert2.vox",
+    options: { targetSize: 60, gridShift: 0 },
+    zoom: 0.4, rotX: 65, rotY: 45,
+  },
+  "garden": {
+    url: "/gallery/vox/Garden.vox",
+    options: { targetSize: 60, gridShift: 0 },
+    zoom: 0.4, rotX: 65, rotY: 45,
+  },
+  "mecha-golem": {
+    url: "/gallery/vox/MechaGolem.vox",
+    options: { targetSize: 60, gridShift: 0 },
+    zoom: 0.4, rotX: 65, rotY: 45,
+  },
+  "army": {
+    url: "/gallery/vox/army.vox",
+    options: { targetSize: 60, gridShift: 0 },
+    zoom: 0.4, rotX: 65, rotY: 45,
+  },
+  "obj-house3": {
+    url: "/gallery/vox/obj_house3.vox",
+    options: { targetSize: 60, gridShift: 0 },
+    zoom: 0.4, rotX: 65, rotY: 45,
+  },
+  "obj-house5": {
+    url: "/gallery/vox/obj_house5.vox",
+    options: { targetSize: 60, gridShift: 0 },
+    zoom: 0.4, rotX: 65, rotY: 45,
+  },
+  "scene-mechanic2": {
+    url: "/gallery/vox/scene_mechanic2.vox",
+    options: { targetSize: 60, gridShift: 0 },
+    zoom: 0.4, rotX: 65, rotY: 45,
+  },
+  "skyscraper": {
+    url: "/gallery/vox/skyscraper.vox",
+    options: { targetSize: 60, gridShift: 0 },
+    zoom: 0.4, rotX: 65, rotY: 45,
+  },
+  "treasure": {
+    url: "/gallery/vox/Treasure.vox",
+    options: { targetSize: 60, gridShift: 0 },
+    zoom: 0.4, rotX: 65, rotY: 45,
+  },
   crate: {
     url: "/gallery/obj/opengameart/crate/Box.obj",
     mtlUrl: "/gallery/obj/opengameart/crate/Box.mtl",
@@ -70,9 +120,78 @@ export const PRESETS = {
   },
 };
 
+function parseNumberParam(params, name, fallback) {
+  const raw = params.get(name);
+  if (raw === null || raw.trim() === "") return fallback;
+  const value = Number(raw);
+  return Number.isFinite(value) ? value : fallback;
+}
+
+function galleryAssetPath(value, extension) {
+  const cleaned = value
+    .replace(/\\/g, "/")
+    .replace(/^\/+/, "")
+    .replace(/^gallery\//, "")
+    .replace(/^vox\//, "")
+    .replace(/^glb\//, "")
+    .replace(/^obj\//, "");
+  if (!cleaned || cleaned.includes("..")) return null;
+  return cleaned.toLowerCase().endsWith(extension) ? cleaned : `${cleaned}${extension}`;
+}
+
+function genericGalleryPreset(params, meshId) {
+  if (meshId.startsWith("vox:")) {
+    const file = galleryAssetPath(meshId.slice("vox:".length), ".vox");
+    if (!file) return null;
+    return {
+      url: `/gallery/vox/${file}`,
+      options: {
+        targetSize: parseNumberParam(params, "targetSize", 60),
+        gridShift: 0,
+      },
+      zoom: parseNumberParam(params, "zoom", 0.4),
+      rotX: parseNumberParam(params, "rotX", 65),
+      rotY: parseNumberParam(params, "rotY", 45),
+    };
+  }
+
+  if (meshId.startsWith("glb:")) {
+    const file = galleryAssetPath(meshId.slice("glb:".length), ".glb");
+    if (!file) return null;
+    return {
+      url: `/gallery/glb/${file}`,
+      options: { targetSize: parseNumberParam(params, "targetSize", 60) },
+      zoom: parseNumberParam(params, "zoom", 0.35),
+      rotX: parseNumberParam(params, "rotX", 65),
+      rotY: parseNumberParam(params, "rotY", 45),
+    };
+  }
+
+  if (meshId.startsWith("obj:")) {
+    const file = galleryAssetPath(meshId.slice("obj:".length), ".obj");
+    if (!file) return null;
+    const mtl = params.get("mtl");
+    const mtlFile = mtl ? galleryAssetPath(mtl, ".mtl") : null;
+    return {
+      url: `/gallery/obj/${file}`,
+      ...(mtlFile ? { mtlUrl: `/gallery/obj/${mtlFile}` } : {}),
+      options: {
+        targetSize: parseNumberParam(params, "targetSize", 60),
+        defaultColor: params.get("defaultColor") || "#cccccc",
+      },
+      zoom: parseNumberParam(params, "zoom", 0.25),
+      rotX: parseNumberParam(params, "rotX", 65),
+      rotY: parseNumberParam(params, "rotY", 45),
+    };
+  }
+
+  return null;
+}
+
 export function parseUrlParams() {
   const params = new URLSearchParams(window.location.search);
   const meshId = params.get("mesh") || "saucer";
+  const genericPreset = genericGalleryPreset(params, meshId);
   return {
     meshId,
     mode: params.get("mode") === "baked" ? "baked" : "dynamic",
@@ -80,9 +199,9 @@ export function parseUrlParams() {
     az: parseFloat(params.get("az")) || 50,
     el: parseFloat(params.get("el")) || 45,
     isSynth: meshId.startsWith("synth-"),
-    preset: meshId.startsWith("synth-")
+    preset: genericPreset ?? (meshId.startsWith("synth-")
       ? { url: null, options: {}, zoom: 0.2, rotX: 65, rotY: 45 }
-      : (PRESETS[meshId] ?? PRESETS.saucer),
+      : (PRESETS[meshId] ?? PRESETS.saucer)),
   };
 }
 
diff --git a/bench/polycss-normalize.js b/bench/polycss-normalize.js
index 845f6059..434b8559 100644
--- a/bench/polycss-normalize.js
+++ b/bench/polycss-normalize.js
@@ -1,7 +1,12 @@
+// packages/core/src/math/quaternion.ts
+var DEG_TO_RAD = Math.PI / 180;
+var RAD_TO_DEG = 180 / Math.PI;
+
 // packages/core/src/merge/mergePolygons.ts
 var EPS_NORMAL = 1e-3;
 var EPS_DISTANCE = 0.05;
 var EPS_TEXTURE_DISTANCE = 1e-3;
+var EPS_RENDER_DISTANCE = 1e-3;
 var sub = (a, b) => [a[0] - b[0], a[1] - b[1], a[2] - b[2]];
 var cross = (a, b) => [
   a[1] * b[2] - a[2] * b[1],
@@ -95,7 +100,7 @@ function mergeAlongEdge(a, b, e0, e1) {
     }
   }
   if (cleaned.length < 3) return null;
-  return { vertices: cleaned, uvs: cleanedUvs };
+  return rotateToNonCollinearStart(cleaned, cleanedUvs);
 }
 function isConvex(vertices, normal) {
   const n = vertices.length;
@@ -114,12 +119,12 @@ function isConvex(vertices, normal) {
   }
   return true;
 }
-function texturedMergeIsPlanar(vertices) {
+function mergeIsPlanar(vertices, epsilon) {
   if (vertices.length < 3) return false;
   const plane = planeOf(vertices);
   if (!plane) return false;
   for (const vertex of vertices) {
-    if (Math.abs(dot(plane.normal, vertex) - plane.d) > EPS_TEXTURE_DISTANCE) {
+    if (Math.abs(dot(plane.normal, vertex) - plane.d) > epsilon) {
       return false;
     }
   }
@@ -240,7 +245,7 @@ function mergePolygons(input) {
       const [e0, e1] = shared;
       const merged = mergeAlongEdge(a, b, e0, e1);
       if (!merged) continue;
-      if (hasTexture && !texturedMergeIsPlanar(merged.vertices)) continue;
+      if (!mergeIsPlanar(merged.vertices, hasTexture ? EPS_TEXTURE_DISTANCE : EPS_RENDER_DISTANCE)) continue;
       if (!isConvex(merged.vertices, a.normal)) continue;
       a.vertices = merged.vertices;
       a.uvs = merged.uvs;
@@ -267,6 +272,813 @@ function mergePolygons(input) {
   return out;
 }
 
+// packages/core/src/merge/dedupeOverlappingPolygons.ts
+var DEFAULT_NORMAL_TOLERANCE = 1e-3;
+var DEFAULT_DISTANCE_TOLERANCE = 0.05;
+var DEFAULT_OVERLAP_FRACTION = 0.7;
+var BUCKET_NORMAL_STEP = 0.05;
+var sub2 = (a, b) => [a[0] - b[0], a[1] - b[1], a[2] - b[2]];
+var cross2 = (a, b) => [
+  a[1] * b[2] - a[2] * b[1],
+  a[2] * b[0] - a[0] * b[2],
+  a[0] * b[1] - a[1] * b[0]
+];
+var dot2 = (a, b) => a[0] * b[0] + a[1] * b[1] + a[2] * b[2];
+function computeMeta(polygon, index) {
+  const v = polygon.vertices;
+  if (!v || v.length < 3) return null;
+  let nx = 0, ny = 0, nz = 0;
+  for (let i = 0; i < v.length; i++) {
+    const a = v[i];
+    const b = v[(i + 1) % v.length];
+    nx += (a[1] - b[1]) * (a[2] + b[2]);
+    ny += (a[2] - b[2]) * (a[0] + b[0]);
+    nz += (a[0] - b[0]) * (a[1] + b[1]);
+  }
+  const nLen = Math.hypot(nx, ny, nz);
+  if (nLen < 1e-12) return null;
+  const normal = [nx / nLen, ny / nLen, nz / nLen];
+  let cx = 0, cy = 0, cz = 0;
+  for (const p of v) {
+    cx += p[0];
+    cy += p[1];
+    cz += p[2];
+  }
+  const inv = 1 / v.length;
+  const centroid = [cx * inv, cy * inv, cz * inv];
+  const d = dot2(normal, centroid);
+  const area = nLen * 0.5;
+  return {
+    index,
+    polygon,
+    normal,
+    d,
+    centroid,
+    area,
+    local2D: null,
+    bbox2D: null,
+    basis: null
+  };
+}
+function planeBasis(normal) {
+  const axis = Math.abs(normal[0]) < 0.9 ? [1, 0, 0] : [0, 1, 0];
+  let ux = axis[0] - normal[0] * dot2(axis, normal);
+  let uy = axis[1] - normal[1] * dot2(axis, normal);
+  let uz = axis[2] - normal[2] * dot2(axis, normal);
+  const uLen = Math.hypot(ux, uy, uz);
+  ux /= uLen;
+  uy /= uLen;
+  uz /= uLen;
+  const u = [ux, uy, uz];
+  const v = cross2(normal, u);
+  return { u, v };
+}
+function ensure2D(meta) {
+  if (meta.local2D) return;
+  const basis2 = planeBasis(meta.normal);
+  const local2D = [];
+  let minU = Infinity, minV = Infinity;
+  let maxU = -Infinity, maxV = -Infinity;
+  for (const p of meta.polygon.vertices) {
+    const u = dot2(p, basis2.u);
+    const v = dot2(p, basis2.v);
+    local2D.push([u, v]);
+    if (u < minU) minU = u;
+    if (u > maxU) maxU = u;
+    if (v < minV) minV = v;
+    if (v > maxV) maxV = v;
+  }
+  meta.local2D = local2D;
+  meta.bbox2D = { min: [minU, minV], max: [maxU, maxV] };
+  meta.basis = basis2;
+}
+function projectInto(polygon, basis2) {
+  const local2D = [];
+  let minU = Infinity, minV = Infinity;
+  let maxU = -Infinity, maxV = -Infinity;
+  for (const p of polygon.vertices) {
+    const u = dot2(p, basis2.u);
+    const v = dot2(p, basis2.v);
+    local2D.push([u, v]);
+    if (u < minU) minU = u;
+    if (u > maxU) maxU = u;
+    if (v < minV) minV = v;
+    if (v > maxV) maxV = v;
+  }
+  return { local2D, bbox2D: { min: [minU, minV], max: [maxU, maxV] } };
+}
+function bboxOverlap2D(a, b) {
+  return a.max[0] >= b.min[0] && a.min[0] <= b.max[0] && a.max[1] >= b.min[1] && a.min[1] <= b.max[1];
+}
+function pointInPolygon2D(p, poly) {
+  let inside = false;
+  for (let i = 0, j = poly.length - 1; i < poly.length; j = i++) {
+    const a = poly[i], b = poly[j];
+    const intersect = a[1] > p[1] !== b[1] > p[1] && p[0] < (b[0] - a[0]) * (p[1] - a[1]) / (b[1] - a[1] + 1e-30) + a[0];
+    if (intersect) inside = !inside;
+  }
+  return inside;
+}
+function centroid2D(poly) {
+  let cx = 0, cy = 0;
+  for (const p of poly) {
+    cx += p[0];
+    cy += p[1];
+  }
+  return [cx / poly.length, cy / poly.length];
+}
+function overlapScore2D(a, b) {
+  const aC = centroid2D(a);
+  const bC = centroid2D(b);
+  const inset = 1e-4;
+  let hitsAinB = 0;
+  for (const p of a) {
+    const testP = [
+      p[0] + (aC[0] - p[0]) * inset,
+      p[1] + (aC[1] - p[1]) * inset
+    ];
+    if (pointInPolygon2D(testP, b)) hitsAinB++;
+  }
+  let hitsBinA = 0;
+  for (const p of b) {
+    const testP = [
+      p[0] + (bC[0] - p[0]) * inset,
+      p[1] + (bC[1] - p[1]) * inset
+    ];
+    if (pointInPolygon2D(testP, a)) hitsBinA++;
+  }
+  const aIn = hitsAinB / a.length;
+  const bIn = hitsBinA / b.length;
+  return Math.max(aIn, bIn);
+}
+function bucketKey(meta, distanceTolerance) {
+  let nx = meta.normal[0], ny = meta.normal[1], nz = meta.normal[2];
+  const absX = Math.abs(nx), absY = Math.abs(ny), absZ = Math.abs(nz);
+  let dominant = nx;
+  if (absY > absX && absY > absZ) dominant = ny;
+  else if (absZ > absX && absZ > absY) dominant = nz;
+  if (dominant < 0) {
+    nx = -nx;
+    ny = -ny;
+    nz = -nz;
+  }
+  const qx = Math.round(nx / BUCKET_NORMAL_STEP);
+  const qy = Math.round(ny / BUCKET_NORMAL_STEP);
+  const qz = Math.round(nz / BUCKET_NORMAL_STEP);
+  const dAbs = meta.d * (meta.normal[0] === nx && meta.normal[1] === ny && meta.normal[2] === nz ? 1 : -1);
+  const qd = Math.round(dAbs / (distanceTolerance * 2));
+  return `${qx},${qy},${qz}|${qd}`;
+}
+function coplanar(a, b, normalTolerance, distanceTolerance) {
+  const d = dot2(a.normal, b.normal);
+  if (Math.abs(d) < 1 - normalTolerance) return false;
+  const sign = d > 0 ? 1 : -1;
+  return Math.abs(a.d - sign * b.d) < distanceTolerance;
+}
+function facesInward(meta, meshCentroid) {
+  const toCenter = sub2(meshCentroid, meta.centroid);
+  return dot2(meta.normal, toCenter) > 0;
+}
+function findOverlappingPolygonDuplicates(input, options) {
+  if (!input || input.length < 2) return /* @__PURE__ */ new Set();
+  const normalTolerance = options?.normalTolerance ?? DEFAULT_NORMAL_TOLERANCE;
+  const distanceTolerance = options?.distanceTolerance ?? DEFAULT_DISTANCE_TOLERANCE;
+  const overlapFraction = options?.overlapFraction ?? DEFAULT_OVERLAP_FRACTION;
+  const metas = [];
+  for (let i = 0; i < input.length; i++) {
+    const m = computeMeta(input[i], i);
+    if (m) metas.push(m);
+  }
+  if (metas.length < 2) return /* @__PURE__ */ new Set();
+  let mcx = 0, mcy = 0, mcz = 0, totalArea = 0;
+  for (const m of metas) {
+    mcx += m.centroid[0] * m.area;
+    mcy += m.centroid[1] * m.area;
+    mcz += m.centroid[2] * m.area;
+    totalArea += m.area;
+  }
+  const meshCentroid = totalArea > 0 ? [mcx / totalArea, mcy / totalArea, mcz / totalArea] : [0, 0, 0];
+  const buckets = /* @__PURE__ */ new Map();
+  for (const m of metas) {
+    const key = bucketKey(m, distanceTolerance);
+    let arr = buckets.get(key);
+    if (!arr) {
+      arr = [];
+      buckets.set(key, arr);
+    }
+    arr.push(m);
+  }
+  const dropped = /* @__PURE__ */ new Set();
+  for (const arr of buckets.values()) {
+    if (arr.length < 2) continue;
+    for (let i = 0; i < arr.length; i++) {
+      const a = arr[i];
+      if (dropped.has(a.index)) continue;
+      for (let j = i + 1; j < arr.length; j++) {
+        const b = arr[j];
+        if (dropped.has(b.index)) continue;
+        if (!coplanar(a, b, normalTolerance, distanceTolerance)) continue;
+        ensure2D(a);
+        const bProj = projectInto(b.polygon, a.basis);
+        if (!bboxOverlap2D(a.bbox2D, bProj.bbox2D)) continue;
+        const score = overlapScore2D(a.local2D, bProj.local2D);
+        if (score < overlapFraction) continue;
+        const aInward = facesInward(a, meshCentroid);
+        const bInward = facesInward(b, meshCentroid);
+        let drop;
+        if (aInward && !bInward) drop = a;
+        else if (bInward && !aInward) drop = b;
+        else drop = a.area < b.area ? a : b;
+        dropped.add(drop.index);
+        if (drop === a) break;
+      }
+    }
+  }
+  return dropped;
+}
+
+// packages/core/src/merge/coverPlanarPolygons.ts
+var DEFAULT_MIN_GROUP = 4;
+var DEFAULT_MAX_AXES = 8;
+var DEFAULT_PLANE_EPSILON = 1e-3;
+var EPS = 1e-9;
+var LOCAL_ROUND = 1e6;
+var WORLD_ROUND = 1e6;
+var sub3 = (a, b) => [a[0] - b[0], a[1] - b[1], a[2] - b[2]];
+var add = (a, b) => [a[0] + b[0], a[1] + b[1], a[2] + b[2]];
+var scale = (v, n) => [v[0] * n, v[1] * n, v[2] * n];
+var dot3 = (a, b) => a[0] * b[0] + a[1] * b[1] + a[2] * b[2];
+var cross3 = (a, b) => [
+  a[1] * b[2] - a[2] * b[1],
+  a[2] * b[0] - a[0] * b[2],
+  a[0] * b[1] - a[1] * b[0]
+];
+var length = (v) => Math.hypot(v[0], v[1], v[2]);
+function normalize(v) {
+  const len = length(v);
+  if (len <= EPS) return null;
+  return [v[0] / len, v[1] / len, v[2] / len];
+}
+function round(value, factor) {
+  return Math.round(value * factor) / factor;
+}
+function roundLocal(value) {
+  return round(value, LOCAL_ROUND);
+}
+function roundWorld(value) {
+  return round(value, WORLD_ROUND);
+}
+function eq2(a, b) {
+  return Math.abs(a[0] - b[0]) <= 1e-7 && Math.abs(a[1] - b[1]) <= 1e-7;
+}
+function pointKey(point) {
+  return `${roundLocal(point[0])},${roundLocal(point[1])}`;
+}
+function undirectedSegmentKey(segment) {
+  const ak = pointKey(segment.a);
+  const bk = pointKey(segment.b);
+  return ak < bk ? `${ak}|${bk}` : `${bk}|${ak}`;
+}
+function vecKey(v) {
+  return `${v[0]},${v[1]},${v[2]}`;
+}
+function edgeKey2(a, b) {
+  const ak = vecKey(a);
+  const bk = vecKey(b);
+  return ak < bk ? `${ak}|${bk}` : `${bk}|${ak}`;
+}
+function dataKey(data) {
+  if (!data) return "";
+  return Object.keys(data).sort().map((key) => `${key}:${String(data[key])}`).join("|");
+}
+function materialKey(polygon) {
+  return [
+    polygon.color ?? "#cccccc",
+    polygon.texture ?? "",
+    polygon.uvs ? "uv" : "plain",
+    dataKey(polygon.data)
+  ].join("|");
+}
+function planeOf2(polygon) {
+  const vertices = polygon.vertices;
+  if (!vertices || vertices.length < 3) return null;
+  const origin = vertices[0];
+  let normalSum = [0, 0, 0];
+  for (let i = 1; i < vertices.length - 1; i++) {
+    normalSum = add(normalSum, cross3(sub3(vertices[i], origin), sub3(vertices[i + 1], origin)));
+  }
+  const normal = normalize(normalSum);
+  if (!normal) return null;
+  return { normal, d: dot3(normal, origin) };
+}
+function samePlane2(a, b, epsilon) {
+  return dot3(a.normal, b.normal) > 1 - epsilon && Math.abs(a.d - b.d) <= epsilon;
+}
+function canCover(polygon) {
+  return !polygon.texture && !polygon.uvs && !polygon.textureTriangles;
+}
+function sharedData(group, polygons) {
+  const first = polygons[group[0]]?.data;
+  const firstKey = dataKey(first);
+  for (const index of group) {
+    if (dataKey(polygons[index].data) !== firstKey) return void 0;
+  }
+  return first ? { ...first } : void 0;
+}
+function buildGroups(polygons, planeEpsilon) {
+  const planes = polygons.map((polygon) => canCover(polygon) ? planeOf2(polygon) : null);
+  const eligible = planes.map(Boolean);
+  const edgeOwners = /* @__PURE__ */ new Map();
+  for (let i = 0; i < polygons.length; i++) {
+    if (!planes[i]) continue;
+    const vertices = polygons[i].vertices;
+    for (let edge = 0; edge < vertices.length; edge++) {
+      const key = edgeKey2(vertices[edge], vertices[(edge + 1) % vertices.length]);
+      const owners = edgeOwners.get(key);
+      const owner = { polygon: i, edge };
+      if (owners) owners.push(owner);
+      else edgeOwners.set(key, [owner]);
+    }
+  }
+  const adjacency = polygons.map(() => /* @__PURE__ */ new Set());
+  for (const owners of edgeOwners.values()) {
+    if (owners.length < 2) continue;
+    for (let i = 0; i < owners.length; i++) {
+      for (let j = i + 1; j < owners.length; j++) {
+        const a = owners[i].polygon;
+        const b = owners[j].polygon;
+        const planeA = planes[a];
+        const planeB = planes[b];
+        if (!planeA || !planeB) continue;
+        if (materialKey(polygons[a]) !== materialKey(polygons[b])) continue;
+        if (!samePlane2(planeA, planeB, planeEpsilon)) continue;
+        adjacency[a].add(b);
+        adjacency[b].add(a);
+      }
+    }
+  }
+  const visited = /* @__PURE__ */ new Set();
+  const groups = [];
+  for (let i = 0; i < polygons.length; i++) {
+    if (!eligible[i] || visited.has(i)) continue;
+    const group = [];
+    const queue = [i];
+    visited.add(i);
+    while (queue.length > 0) {
+      const current = queue.shift();
+      group.push(current);
+      for (const next of adjacency[current]) {
+        if (visited.has(next)) continue;
+        visited.add(next);
+        queue.push(next);
+      }
+    }
+    groups.push(group);
+  }
+  return { groups };
+}
+function boundaryEdgesForGroup(group, polygons) {
+  const groupSet = new Set(group);
+  const owners = /* @__PURE__ */ new Map();
+  for (const polygonIndex of group) {
+    const vertices = polygons[polygonIndex].vertices;
+    for (let edge = 0; edge < vertices.length; edge++) {
+      const key = edgeKey2(vertices[edge], vertices[(edge + 1) % vertices.length]);
+      const list = owners.get(key);
+      const owner = { polygon: polygonIndex, edge };
+      if (list) list.push(owner);
+      else owners.set(key, [owner]);
+    }
+  }
+  const boundary = [];
+  for (const list of owners.values()) {
+    const localOwners = list.filter((owner) => groupSet.has(owner.polygon));
+    if (localOwners.length === 1) {
+      const owner = localOwners[0];
+      const vertices = polygons[owner.polygon].vertices;
+      boundary.push({
+        a: vertices[owner.edge],
+        b: vertices[(owner.edge + 1) % vertices.length]
+      });
+    } else if (localOwners.length !== 2) {
+      return null;
+    }
+  }
+  return boundary;
+}
+function boundaryIsClosed(boundary) {
+  const degree = /* @__PURE__ */ new Map();
+  for (const edge of boundary) {
+    degree.set(vecKey(edge.a), (degree.get(vecKey(edge.a)) ?? 0) + 1);
+    degree.set(vecKey(edge.b), (degree.get(vecKey(edge.b)) ?? 0) + 1);
+  }
+  for (const count of degree.values()) {
+    if (count % 2 !== 0) return false;
+  }
+  return true;
+}
+function canonicalAxis(axis) {
+  const out = [axis[0], axis[1], axis[2]];
+  const major = Math.abs(out[0]) >= Math.abs(out[1]) && Math.abs(out[0]) >= Math.abs(out[2]) ? 0 : Math.abs(out[1]) >= Math.abs(out[2]) ? 1 : 2;
+  if (out[major] < 0) return [-out[0], -out[1], -out[2]];
+  return out;
+}
+function axisKey(axis) {
+  const canonical = canonicalAxis(axis);
+  return `${round(canonical[0], 1e3)},${round(canonical[1], 1e3)},${round(canonical[2], 1e3)}`;
+}
+function fallbackAxis(normal) {
+  const seed = Math.abs(normal[0]) < 0.9 ? [1, 0, 0] : [0, 1, 0];
+  const projected = sub3(seed, scale(normal, dot3(seed, normal)));
+  return normalize(projected) ?? [1, 0, 0];
+}
+function candidateAxes(boundary, normal, maxAxes) {
+  const byKey = /* @__PURE__ */ new Map();
+  for (const edge of boundary) {
+    const edgeVector = sub3(edge.b, edge.a);
+    const projected = sub3(edgeVector, scale(normal, dot3(edgeVector, normal)));
+    const axis = normalize(projected);
+    if (!axis) continue;
+    const canonical = canonicalAxis(axis);
+    const key = axisKey(canonical);
+    const weight = length(projected);
+    const current = byKey.get(key);
+    if (current) current.weight += weight;
+    else byKey.set(key, { axis: canonical, weight });
+  }
+  const axes = [...byKey.values()].sort((a, b) => b.weight - a.weight).slice(0, maxAxes).map((candidate) => candidate.axis);
+  if (axes.length === 0) axes.push(fallbackAxis(normal));
+  return axes;
+}
+function projectPoint(point, origin, xAxis, yAxis) {
+  const local = sub3(point, origin);
+  return [roundLocal(dot3(local, xAxis)), roundLocal(dot3(local, yAxis))];
+}
+function uniqueSorted(values) {
+  const sorted = [...values].sort((a, b) => a - b);
+  const out = [];
+  for (const value of sorted) {
+    if (out.length === 0 || Math.abs(value - out[out.length - 1]) > 1e-7) {
+      out.push(value);
+    }
+  }
+  return out;
+}
+function segmentYAt(segment, x) {
+  const [x0, y0] = segment.a;
+  const [x1, y1] = segment.b;
+  const t = (x - x0) / (x1 - x0);
+  return roundLocal(y0 + (y1 - y0) * t);
+}
+function cleanLocalPolygon(points) {
+  const dedup = [];
+  for (const point of points) {
+    if (dedup.length === 0 || Math.abs(point[0] - dedup[dedup.length - 1][0]) > 1e-7 || Math.abs(point[1] - dedup[dedup.length - 1][1]) > 1e-7) {
+      dedup.push(point);
+    }
+  }
+  if (dedup.length > 1 && Math.abs(dedup[0][0] - dedup[dedup.length - 1][0]) <= 1e-7 && Math.abs(dedup[0][1] - dedup[dedup.length - 1][1]) <= 1e-7) {
+    dedup.pop();
+  }
+  const cleaned = [];
+  for (let i = 0; i < dedup.length; i++) {
+    const prev = dedup[(i - 1 + dedup.length) % dedup.length];
+    const current = dedup[i];
+    const next = dedup[(i + 1) % dedup.length];
+    const cross22 = (current[0] - prev[0]) * (next[1] - current[1]) - (current[1] - prev[1]) * (next[0] - current[0]);
+    if (Math.abs(cross22) > 1e-8) cleaned.push(current);
+  }
+  return cleaned;
+}
+function signedArea(points) {
+  let area = 0;
+  for (let i = 0; i < points.length; i++) {
+    const a = points[i];
+    const b = points[(i + 1) % points.length];
+    area += a[0] * b[1] - b[0] * a[1];
+  }
+  return area / 2;
+}
+function localBBox(points) {
+  let minX = Infinity;
+  let minY = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  for (const [x, y] of points) {
+    minX = Math.min(minX, x);
+    minY = Math.min(minY, y);
+    maxX = Math.max(maxX, x);
+    maxY = Math.max(maxY, y);
+  }
+  return { minX, minY, maxX, maxY };
+}
+function localBBoxesCanTouch(ab, bb) {
+  return !(ab.maxX < bb.minX - 1e-7 || bb.maxX < ab.minX - 1e-7 || ab.maxY < bb.minY - 1e-7 || bb.maxY < ab.minY - 1e-7);
+}
+function localAreaAbs(points) {
+  return Math.abs(signedArea(points));
+}
+function isConvexLocal(points) {
+  if (points.length < 3) return false;
+  let sign = 0;
+  for (let i = 0; i < points.length; i++) {
+    const a = points[i];
+    const b = points[(i + 1) % points.length];
+    const c = points[(i + 2) % points.length];
+    const turn = (b[0] - a[0]) * (c[1] - b[1]) - (b[1] - a[1]) * (c[0] - b[0]);
+    if (Math.abs(turn) <= 1e-8) continue;
+    const nextSign = turn > 0 ? 1 : -1;
+    if (sign === 0) sign = nextSign;
+    else if (sign !== nextSign) return false;
+  }
+  return true;
+}
+function pointOnSegment(point, a, b) {
+  const abx = b[0] - a[0];
+  const aby = b[1] - a[1];
+  const apx = point[0] - a[0];
+  const apy = point[1] - a[1];
+  const cross22 = abx * apy - aby * apx;
+  const len = Math.hypot(abx, aby);
+  if (len <= 1e-9 || Math.abs(cross22) > Math.max(1e-8, len * 1e-8)) return false;
+  const dot22 = apx * abx + apy * aby;
+  return dot22 >= -1e-8 && dot22 <= abx * abx + aby * aby + 1e-8;
+}
+function pointParameterOnSegment(point, a, b) {
+  const dx = b[0] - a[0];
+  const dy = b[1] - a[1];
+  const denom = dx * dx + dy * dy;
+  if (denom <= 1e-12) return 0;
+  return ((point[0] - a[0]) * dx + (point[1] - a[1]) * dy) / denom;
+}
+function colinearSegmentsOverlap(a0, a1, b0, b1) {
+  const ax = a1[0] - a0[0];
+  const ay = a1[1] - a0[1];
+  const bx = b1[0] - b0[0];
+  const by = b1[1] - b0[1];
+  const aLen = Math.hypot(ax, ay);
+  const bLen = Math.hypot(bx, by);
+  if (aLen <= 1e-9 || bLen <= 1e-9) return false;
+  const crossB0 = ax * (b0[1] - a0[1]) - ay * (b0[0] - a0[0]);
+  const crossB1 = ax * (b1[1] - a0[1]) - ay * (b1[0] - a0[0]);
+  const crossAxes = ax * by - ay * bx;
+  const tolerance = Math.max(1e-8, Math.max(aLen, bLen) * 1e-8);
+  if (Math.abs(crossB0) > tolerance || Math.abs(crossB1) > tolerance || Math.abs(crossAxes) > tolerance) {
+    return false;
+  }
+  const useX = Math.abs(ax) >= Math.abs(ay);
+  const aMin = Math.min(useX ? a0[0] : a0[1], useX ? a1[0] : a1[1]);
+  const aMax = Math.max(useX ? a0[0] : a0[1], useX ? a1[0] : a1[1]);
+  const bMin = Math.min(useX ? b0[0] : b0[1], useX ? b1[0] : b1[1]);
+  const bMax = Math.max(useX ? b0[0] : b0[1], useX ? b1[0] : b1[1]);
+  return Math.min(aMax, bMax) - Math.max(aMin, bMin) > 1e-8;
+}
+function polygonsMayShareBoundary(a, b) {
+  for (let i = 0; i < a.length; i++) {
+    const a0 = a[i];
+    const a1 = a[(i + 1) % a.length];
+    for (let j = 0; j < b.length; j++) {
+      if (colinearSegmentsOverlap(a0, a1, b[j], b[(j + 1) % b.length])) {
+        return true;
+      }
+    }
+  }
+  return false;
+}
+function splitDirectedEdges(polygon, splitPoints) {
+  const segments = [];
+  for (let i = 0; i < polygon.length; i++) {
+    const a = polygon[i];
+    const b = polygon[(i + 1) % polygon.length];
+    const splits = [
+      { t: 0, point: a },
+      { t: 1, point: b }
+    ];
+    for (const point of splitPoints) {
+      if (eq2(point, a) || eq2(point, b)) continue;
+      if (!pointOnSegment(point, a, b)) continue;
+      splits.push({
+        t: pointParameterOnSegment(point, a, b),
+        point
+      });
+    }
+    splits.sort((left, right) => left.t - right.t);
+    const unique = [];
+    for (const split of splits) {
+      if (unique.some((item) => Math.abs(item.t - split.t) <= 1e-8 || eq2(item.point, split.point))) continue;
+      unique.push(split);
+    }
+    for (let j = 0; j < unique.length - 1; j++) {
+      const start = unique[j].point;
+      const end = unique[j + 1].point;
+      if (Math.hypot(end[0] - start[0], end[1] - start[1]) <= 1e-8) continue;
+      segments.push({
+        a: [roundLocal(start[0]), roundLocal(start[1])],
+        b: [roundLocal(end[0]), roundLocal(end[1])]
+      });
+    }
+  }
+  return segments;
+}
+function unionConvexLocalPair(a, b, aBBox = localBBox(a), bBBox = localBBox(b)) {
+  if (!localBBoxesCanTouch(aBBox, bBBox) || !polygonsMayShareBoundary(a, b)) return null;
+  const pieces = [
+    ...splitDirectedEdges(a, b),
+    ...splitDirectedEdges(b, a)
+  ];
+  const grouped = /* @__PURE__ */ new Map();
+  for (const segment of pieces) {
+    const key = undirectedSegmentKey(segment);
+    const current = grouped.get(key);
+    if (current) current.push(segment);
+    else grouped.set(key, [segment]);
+  }
+  let hadSharedEdge = false;
+  const boundary = [];
+  for (const group of grouped.values()) {
+    if (group.length === 1) {
+      boundary.push(group[0]);
+      continue;
+    }
+    hadSharedEdge = true;
+    const forward = group.filter((segment) => pointKey(segment.a) < pointKey(segment.b)).length;
+    const backward = group.length - forward;
+    if (forward !== backward) return null;
+  }
+  if (!hadSharedEdge || boundary.length < 3) return null;
+  const outgoing = /* @__PURE__ */ new Map();
+  for (const segment of boundary) {
+    const key = pointKey(segment.a);
+    if (outgoing.has(key)) return null;
+    outgoing.set(key, segment);
+  }
+  const start = boundary[0];
+  const startKey = pointKey(start.a);
+  const loop = [];
+  const used = /* @__PURE__ */ new Set();
+  let currentKey = startKey;
+  for (let guard = 0; guard <= boundary.length; guard++) {
+    const segment = outgoing.get(currentKey);
+    if (!segment) return null;
+    const edgeKey22 = `${pointKey(segment.a)}>${pointKey(segment.b)}`;
+    if (used.has(edgeKey22)) return null;
+    used.add(edgeKey22);
+    loop.push(segment.a);
+    currentKey = pointKey(segment.b);
+    if (currentKey === startKey) break;
+  }
+  if (currentKey !== startKey || used.size !== boundary.length) return null;
+  const cleaned = cleanLocalPolygon(loop);
+  if (cleaned.length < 3 || !isConvexLocal(cleaned)) return null;
+  const area = localAreaAbs(cleaned);
+  const expectedArea = localAreaAbs(a) + localAreaAbs(b);
+  if (Math.abs(area - expectedArea) > Math.max(1e-5, expectedArea * 1e-5)) return null;
+  return signedArea(cleaned) >= 0 ? cleaned : [...cleaned].reverse();
+}
+function mergeLocalCells(cells) {
+  const polygons = cells.map(cleanLocalPolygon).filter((polygon) => polygon.length >= 3 && localAreaAbs(polygon) > 1e-8);
+  const bboxes = polygons.map(localBBox);
+  let changed = true;
+  while (changed) {
+    changed = false;
+    for (let i = 0; i < polygons.length; i++) {
+      for (let j = i + 1; j < polygons.length; j++) {
+        const merged = unionConvexLocalPair(polygons[i], polygons[j], bboxes[i], bboxes[j]);
+        if (!merged) continue;
+        polygons[i] = merged;
+        bboxes[i] = localBBox(merged);
+        polygons.splice(j, 1);
+        bboxes.splice(j, 1);
+        changed = true;
+        break;
+      }
+      if (changed) break;
+    }
+  }
+  return polygons;
+}
+function localToWorldFactory(origin, xAxis, yAxis) {
+  const snap = /* @__PURE__ */ new Map();
+  return (point) => {
+    const x = roundLocal(point[0]);
+    const y = roundLocal(point[1]);
+    const key = `${x},${y}`;
+    const existing = snap.get(key);
+    if (existing) return [existing[0], existing[1], existing[2]];
+    const world = add(origin, add(scale(xAxis, x), scale(yAxis, y)));
+    const rounded = [roundWorld(world[0]), roundWorld(world[1]), roundWorld(world[2])];
+    snap.set(key, rounded);
+    return [rounded[0], rounded[1], rounded[2]];
+  };
+}
+function decomposeWithAxis(group, polygons, boundary, normal, xAxisInput) {
+  const origin = boundary[0]?.a;
+  if (!origin) return null;
+  const xAxisProjected = normalize(sub3(xAxisInput, scale(normal, dot3(xAxisInput, normal))));
+  if (!xAxisProjected) return null;
+  const yAxis = normalize(cross3(normal, xAxisProjected));
+  if (!yAxis) return null;
+  const segments = [];
+  const xs = [];
+  for (const edge of boundary) {
+    const a = projectPoint(edge.a, origin, xAxisProjected, yAxis);
+    const b = projectPoint(edge.b, origin, xAxisProjected, yAxis);
+    if (Math.hypot(a[0] - b[0], a[1] - b[1]) <= 1e-7) continue;
+    segments.push({ a, b });
+    xs.push(a[0], b[0]);
+  }
+  const sortedXs = uniqueSorted(xs);
+  if (segments.length < 3 || sortedXs.length < 2) return null;
+  const color = polygons[group[0]].color;
+  const data = sharedData(group, polygons);
+  const localCells = [];
+  for (let i = 0; i < sortedXs.length - 1; i++) {
+    const x0 = sortedXs[i];
+    const x1 = sortedXs[i + 1];
+    if (x1 - x0 <= 1e-7) continue;
+    const xm = (x0 + x1) / 2;
+    const active = segments.filter((segment) => {
+      const minX = Math.min(segment.a[0], segment.b[0]);
+      const maxX = Math.max(segment.a[0], segment.b[0]);
+      return minX < xm && xm < maxX && Math.abs(segment.a[0] - segment.b[0]) > 1e-7;
+    }).map((segment) => ({
+      segment,
+      yMid: segmentYAt(segment, xm)
+    })).sort((a, b) => a.yMid - b.yMid);
+    if (active.length === 0) continue;
+    if (active.length % 2 !== 0) return null;
+    for (let j = 0; j < active.length; j += 2) {
+      const low = active[j].segment;
+      const high = active[j + 1].segment;
+      const low0 = segmentYAt(low, x0);
+      const low1 = segmentYAt(low, x1);
+      const high0 = segmentYAt(high, x0);
+      const high1 = segmentYAt(high, x1);
+      const local = cleanLocalPolygon([
+        [x0, low0],
+        [x1, low1],
+        [x1, high1],
+        [x0, high0]
+      ]);
+      if (local.length < 3 || Math.abs(signedArea(local)) <= 1e-8) continue;
+      const oriented = signedArea(local) > 0 ? local : [...local].reverse();
+      localCells.push(oriented);
+    }
+  }
+  if (localCells.length === 0) return null;
+  const toWorld = localToWorldFactory(origin, xAxisProjected, yAxis);
+  const cells = mergeLocalCells(localCells).map((local) => ({
+    vertices: local.map(toWorld),
+    ...color ? { color } : {},
+    ...data ? { data } : {}
+  }));
+  return mergePolygons(cells);
+}
+function optimizeGroup(group, polygons, maxCandidateAxes) {
+  const boundary = boundaryEdgesForGroup(group, polygons);
+  if (!boundary || boundary.length < 3 || !boundaryIsClosed(boundary)) return null;
+  const plane = planeOf2(polygons[group[0]]);
+  if (!plane) return null;
+  let best = null;
+  for (const axis of candidateAxes(boundary, plane.normal, maxCandidateAxes)) {
+    const result = decomposeWithAxis(group, polygons, boundary, plane.normal, axis);
+    if (!result) continue;
+    if (!best || result.length < best.length) best = result;
+  }
+  if (!best || best.length >= group.length) return null;
+  return best;
+}
+function coverPlanarPolygons(input, options = {}) {
+  const minGroupPolygons = options.minGroupPolygons ?? DEFAULT_MIN_GROUP;
+  const maxCandidateAxes = options.maxCandidateAxes ?? DEFAULT_MAX_AXES;
+  const planeEpsilon = options.planeEpsilon ?? DEFAULT_PLANE_EPSILON;
+  const polygons = input ?? [];
+  if (polygons.length < minGroupPolygons) return polygons;
+  const { groups } = buildGroups(polygons, planeEpsilon);
+  if (groups.length === 0) return polygons;
+  const replacements = /* @__PURE__ */ new Map();
+  const replaced = /* @__PURE__ */ new Set();
+  for (const group of groups) {
+    if (group.length < minGroupPolygons) continue;
+    const optimized = optimizeGroup(group, polygons, maxCandidateAxes);
+    if (!optimized) continue;
+    replacements.set(group[0], optimized);
+    for (const index of group) replaced.add(index);
+  }
+  if (replacements.size === 0) return polygons;
+  const output = [];
+  for (let i = 0; i < polygons.length; i++) {
+    const replacement = replacements.get(i);
+    if (replacement) {
+      output.push(...replacement);
+      continue;
+    }
+    if (replaced.has(i)) continue;
+    output.push(polygons[i]);
+  }
+  return output;
+}
+
 // packages/core/src/cull/cullInteriorPolygons.ts
 var DEFAULT_HEMISPHERE_SAMPLES = 8;
 var RAY_ORIGIN_OFFSET = 1e-3;
@@ -468,7 +1280,7 @@ function buildBVH(meta) {
       const ext = axis === 0 ? extX : axis === 1 ? extY : extZ;
       if (ext === 0) continue;
       const centArr = axis === 0 ? centX : axis === 1 ? centY : centZ;
-      const scale = SAH_BUCKETS / ext;
+      const scale2 = SAH_BUCKETS / ext;
       bMinX.fill(Infinity);
       bMinY.fill(Infinity);
       bMinZ.fill(Infinity);
@@ -477,7 +1289,7 @@ function buildBVH(meta) {
       bMaxZ.fill(-Infinity);
       bCnt.fill(0);
       for (let i = start; i < end; i++) {
-        let b = (centArr[i] - cMin) * scale | 0;
+        let b = (centArr[i] - cMin) * scale2 | 0;
         if (b >= SAH_BUCKETS) b = SAH_BUCKETS - 1;
         const m = meta[polyIndices[i]];
         if (m.minX < bMinX[b]) bMinX[b] = m.minX;
@@ -523,7 +1335,7 @@ function buildBVH(meta) {
         if (cost < bestCost) {
           bestCost = cost;
           bestAxis = axis;
-          bestSplitVal = cMin + (k + 1) / scale;
+          bestSplitVal = cMin + (k + 1) / scale2;
         }
       }
     }
@@ -705,83 +1517,1556 @@ function cullInteriorPolygons(polygons, options) {
   return kept;
 }
 
-// packages/polycss/src/render/textureAtlas.ts
-var ATLAS_MAX_SIZE = 4096;
-var AUTO_ATLAS_LOW_AREA = ATLAS_MAX_SIZE * ATLAS_MAX_SIZE;
-var AUTO_ATLAS_MEDIUM_AREA = AUTO_ATLAS_LOW_AREA * 3;
-var AUTO_ATLAS_MAX_DECODED_BYTES = 16 * 1024 * 1024;
-
-// website/src/debug/meshDomNormalize.ts
+// packages/core/src/merge/optimizePolygons.ts
 var NORMALIZE_MAX_ANGLE_DEG = 3;
 var NORMALIZE_MAX_PLANE_DISPLACEMENT = 0.03;
 var NORMALIZE_MAX_BOUNDARY_DISPLACEMENT = 0.02;
-function preprocessModelPolygons(polygons, normalizeGeometry) {
-  const baseline = mergePolygons(cullInteriorPolygons(polygons));
-  if (!normalizeGeometry) return baseline;
-  const normalized = mergePolygons(cullInteriorPolygons(normalizeGeometryForMerge(polygons)));
-  return normalized.length < baseline.length ? normalized : baseline;
-}
-function normalizeGeometryForMerge(polygons) {
-  const snapped = snapGeometryForMerge(polygons);
-  const planeEpsilon = planeFitEpsilon(snapped);
-  if (planeEpsilon <= 0) return snapped;
-  const metas = snapped.map((polygon) => {
-    const plane = planeOfPolygon(polygon);
-    if (!plane) return null;
-    return {
-      polygon,
-      normal: plane.normal,
-      area: plane.area,
-      materialKey: materialKeyForPolygon(polygon)
-    };
-  });
-  const adjacency = buildMergeAdjacency(snapped, metas);
-  const assigned = /* @__PURE__ */ new Set();
-  const output = Array(snapped.length);
-  const writeOutput = (index, polygon) => {
-    output[index] = polygon;
+var DEFAULT_NORMALIZE_OPTIONS = {
+  maxAngleDeg: NORMALIZE_MAX_ANGLE_DEG,
+  maxPlaneDisplacement: NORMALIZE_MAX_PLANE_DISPLACEMENT,
+  maxBoundaryDisplacement: NORMALIZE_MAX_BOUNDARY_DISPLACEMENT,
+  isolatedPairs: false
+};
+var DEFAULT_LOSSY_APPROXIMATE_OPTIONS = {
+  maxAngleDeg: 15,
+  maxPlaneDisplacement: 0.35,
+  maxBoundaryDisplacement: 0.0725,
+  isolatedPairs: true
+};
+var LOSSY_BUDGET_SWEEP = [
+  {
+    maxAngleDeg: 15,
+    maxPlaneDisplacement: 0.35,
+    maxBoundaryDisplacement: 0.02
+  },
+  {
+    maxAngleDeg: 15,
+    maxPlaneDisplacement: 0.35,
+    maxBoundaryDisplacement: 0.0725
+  },
+  {
+    maxAngleDeg: 45,
+    maxPlaneDisplacement: 1,
+    maxBoundaryDisplacement: 0.0725
+  }
+];
+var LOSSY_COLOR_QUANTIZE_STEPS = [4, 8, 12];
+var LOSSY_RECTANGULATED_MIN_POLYGONS = 300;
+var LOSSY_RECTANGULATED_MAX_TRIANGLE_RATIO = 0.3;
+var LOSSY_AUTOMATIC_GROUP_MAX_POLYGONS = 300;
+var LOSSY_CRACK_COST_SLACK = 16;
+var LOSSY_CRACK_RELATIVE_COST_SLACK = 0.015;
+var LOSSY_CRACK_QUALITY_SEARCH_MULTIPLIER = 2.6;
+var LOSSY_POLYGON_PAIR_MAX_PASSES = 3;
+var RECT_COVER_MOSTLY_QUAD_TRIANGLE_LIMIT = 96;
+var AUTOMATIC_RECT_COVER_MAX_POLYGONS = 1800;
+var AUTOMATIC_RECT_COVER_MIN_TRIANGLE_RATIO = 0.65;
+var LOSSY_RECTANGULATED_FAST_EXIT_MIN_POLYGONS = 900;
+var AUTOMATIC_GEOMETRY_SKIP_MIN_POLYGONS = 300;
+var CARDINAL_NORMAL_EPSILON = 1e-5;
+var DEFAULT_RECT_COVER_OPTIONS = {
+  minGroupPolygons: 2,
+  maxCandidateAxes: 24
+};
+var AUTOMATIC_LOSSY_RECT_COVER_OPTIONS = {
+  ...DEFAULT_RECT_COVER_OPTIONS,
+  maxCandidateAxes: 1
+};
+var EMPTY_CRACK_METRICS = {
+  maxGap: 0,
+  internalBoundaryLength: 0,
+  excessBoundaryLength: 0
+};
+function optimizeMeshPolygons(polygons, options = {}) {
+  const meshResolution = options.meshResolution ?? "lossy";
+  const preprocessCache = {};
+  const baseline = preprocessModelPolygons(polygons, false, preprocessCache);
+  let best = baseline;
+  let bestCost = polygonRenderCost(baseline);
+  const acceptCandidate = (candidate, cost = polygonRenderCost(candidate)) => {
+    if (cost >= bestCost) return false;
+    best = candidate;
+    bestCost = cost;
+    return true;
   };
-  for (let i = 0; i < snapped.length; i++) {
-    const meta = metas[i];
-    if (assigned.has(i)) continue;
-    if (!meta) {
-      writeOutput(i, snapped[i]);
-      continue;
+  const initialRectCover = meshResolution === "lossy" && options.rectCover === void 0 ? automaticLossyRectCoverOptions(baseline) : options.rectCover;
+  const rectCovered = applyRectCoverCandidate(baseline, initialRectCover);
+  if (rectCovered !== baseline) acceptCandidate(rectCovered);
+  if (meshResolution === "lossy" && options.approximateMerge !== false) {
+    const qualityCandidates = [];
+    const referenceCandidate = best;
+    let crackSource = null;
+    let referenceCracks = null;
+    const getCrackSource = () => {
+      crackSource ?? (crackSource = createCrackSourceContext(polygons));
+      return crackSource;
+    };
+    const getReferenceCracks = () => {
+      referenceCracks ?? (referenceCracks = candidateCrackQualityMetrics(
+        getCrackSource(),
+        referenceCandidate,
+        DEFAULT_LOSSY_APPROXIMATE_OPTIONS.maxBoundaryDisplacement
+      ).metrics);
+      return referenceCracks;
+    };
+    const automaticApproximate = options.approximateMerge === void 0 || options.approximateMerge === true;
+    const passesLossyCrackBudget = (sample, allowReferenceCracks = true) => !crackMetricsExceed(
+      getCrackSource(),
+      sample.metrics,
+      sample.tolerance,
+      allowReferenceCracks ? getReferenceCracks() : null
+    );
+    const sampleCandidateCracks = (candidate, maxBoundaryDisplacement, allowReferenceCracks = true) => {
+      const source = getCrackSource();
+      const tolerance = crackToleranceForSource(source, maxBoundaryDisplacement);
+      return candidateCrackQualityMetrics(
+        source,
+        candidate,
+        maxBoundaryDisplacement,
+        crackMetricLimits(
+          source,
+          tolerance,
+          allowReferenceCracks ? getReferenceCracks() : null
+        )
+      );
+    };
+    const acceptLossyCandidate = (candidate, cost) => {
+      acceptCandidate(candidate, cost);
+    };
+    const considerQualityCandidate = (candidate, cost, maxBoundaryDisplacement = DEFAULT_LOSSY_APPROXIMATE_OPTIONS.maxBoundaryDisplacement, metrics) => {
+      if (!automaticApproximate || cost > bestCost + lossyCrackCostSlack(bestCost)) return;
+      qualityCandidates.push({
+        polygons: candidate,
+        cost,
+        maxBoundaryDisplacement,
+        metrics
+      });
+    };
+    const coverLossyCandidates = options.rectCover !== void 0 && options.rectCover !== false;
+    const skipAutomaticGeometryApproximation = automaticApproximate && shouldSkipAutomaticGeometryApproximation(baseline);
+    const approximateCandidates = skipAutomaticGeometryApproximation ? [] : lossyApproximateCandidates(
+      options.approximateMerge,
+      automaticApproximate ? baseline : void 0
+    );
+    const colorQuantizeCandidates = automaticApproximate ? lossyColorQuantizeCandidates(polygons) : [];
+    for (let approximateIndex = 0; approximateIndex < approximateCandidates.length; approximateIndex++) {
+      const approximateOptions = approximateCandidates[approximateIndex];
+      const approximate = preprocessModelPolygons(polygons, approximateOptions, preprocessCache);
+      const approximateCost = polygonRenderCost(approximate);
+      let approximateCracks = null;
+      let approximateMetrics;
+      const sampleApproximateCracks = (allowReferenceCracks) => {
+        approximateCracks ?? (approximateCracks = sampleCandidateCracks(
+          approximate,
+          approximateOptions.maxBoundaryDisplacement,
+          allowReferenceCracks
+        ));
+        return approximateCracks;
+      };
+      const approximateAllowsReferenceCracks = !!approximateOptions.allowReferenceCracks;
+      let approximatePassesCrackBudget = true;
+      if (automaticApproximate || approximateOptions.guard) {
+        const sample = sampleApproximateCracks(approximateAllowsReferenceCracks);
+        approximateMetrics = sample.metrics;
+        approximatePassesCrackBudget = passesLossyCrackBudget(sample, approximateAllowsReferenceCracks);
+      }
+      if (!approximatePassesCrackBudget && approximateCost < bestCost) {
+        continue;
+      }
+      if (approximatePassesCrackBudget) {
+        acceptLossyCandidate(approximate, approximateCost);
+        considerQualityCandidate(
+          approximate,
+          approximateCost,
+          approximateOptions.maxBoundaryDisplacement,
+          approximateMetrics
+        );
+      }
+      if (coverLossyCandidates) {
+        const coveredApproximate = applyRectCoverCandidate(approximate, options.rectCover);
+        const coveredApproximateCost = polygonRenderCost(coveredApproximate);
+        let coveredApproximateCracks = null;
+        let coveredApproximateMetrics;
+        const sampleCoveredApproximateCracks = (allowReferenceCracks) => {
+          coveredApproximateCracks ?? (coveredApproximateCracks = sampleCandidateCracks(
+            coveredApproximate,
+            approximateOptions.maxBoundaryDisplacement,
+            allowReferenceCracks
+          ));
+          return coveredApproximateCracks;
+        };
+        if (coveredApproximate !== approximate && coveredApproximateCost < bestCost) {
+          let coveredPassesCrackGuard = true;
+          if (automaticApproximate || approximateOptions.guard) {
+            const sample = sampleCoveredApproximateCracks(approximateAllowsReferenceCracks);
+            coveredApproximateMetrics = sample.metrics;
+            coveredPassesCrackGuard = passesLossyCrackBudget(sample, approximateAllowsReferenceCracks);
+          }
+          if (coveredPassesCrackGuard) {
+            acceptLossyCandidate(coveredApproximate, coveredApproximateCost);
+            considerQualityCandidate(
+              coveredApproximate,
+              coveredApproximateCost,
+              approximateOptions.maxBoundaryDisplacement,
+              coveredApproximateMetrics
+            );
+          }
+        }
+      }
     }
-    const group = growPlaneGroup(i, metas, adjacency, assigned, planeEpsilon);
-    for (const index of group) assigned.add(index);
-    if (group.length < 2) {
-      writeOutput(i, snapped[i]);
-      continue;
+    if (automaticApproximate && colorQuantizeCandidates.length === 0 && shouldUseRectangulatedFastExit(baseline)) {
+      return best;
     }
-    const fit = fitPlaneForGroup(group, metas);
-    if (!fit || !groupWithinPlaneBudget(group, metas, fit, planeEpsilon)) {
-      for (const index of group) writeOutput(index, snapped[index]);
-      continue;
+    if (automaticApproximate) {
+      for (const colorPolygons of colorQuantizeCandidates) {
+        const colorCache = createColorPreprocessCache(colorPolygons, preprocessCache);
+        const colorBaseline = colorCache.baseline;
+        const colorCost = polygonRenderCost(colorBaseline);
+        let colorPassesCrackBudget = true;
+        let colorCracks = null;
+        let colorMetrics;
+        const sampleColorCracks = () => {
+          colorCracks ?? (colorCracks = sampleCandidateCracks(
+            colorBaseline,
+            DEFAULT_LOSSY_APPROXIMATE_OPTIONS.maxBoundaryDisplacement
+          ));
+          return colorCracks;
+        };
+        if (colorCost < bestCost) {
+          const sample = sampleColorCracks();
+          colorMetrics = sample.metrics;
+          colorPassesCrackBudget = passesLossyCrackBudget(sample);
+        }
+        if (colorPassesCrackBudget) {
+          acceptLossyCandidate(colorBaseline, colorCost);
+          considerQualityCandidate(colorBaseline, colorCost, void 0, colorMetrics);
+        }
+        if (coverLossyCandidates) {
+          const coveredColor = applyRectCoverCandidate(colorBaseline, options.rectCover);
+          if (coveredColor !== colorBaseline) {
+            const coveredColorCost = polygonRenderCost(coveredColor);
+            let coveredColorCracks = null;
+            let coveredColorMetrics;
+            const sampleCoveredColorCracks = () => {
+              coveredColorCracks ?? (coveredColorCracks = sampleCandidateCracks(
+                coveredColor,
+                DEFAULT_LOSSY_APPROXIMATE_OPTIONS.maxBoundaryDisplacement
+              ));
+              return coveredColorCracks;
+            };
+            const coveredColorPassesCrackBudget = () => {
+              const sample = sampleCoveredColorCracks();
+              coveredColorMetrics = sample.metrics;
+              return passesLossyCrackBudget(sample);
+            };
+            if (coveredColorCost >= bestCost || coveredColorPassesCrackBudget()) {
+              acceptLossyCandidate(coveredColor, coveredColorCost);
+              considerQualityCandidate(coveredColor, coveredColorCost, void 0, coveredColorMetrics);
+            }
+          }
+        }
+        const colorApproximateCandidates = skipAutomaticGeometryApproximation ? [] : lossyApproximateCandidates(
+          options.approximateMerge,
+          colorCache.baseline
+        );
+        for (const approximateOptions of colorApproximateCandidates) {
+          const approximate = preprocessModelPolygons(colorPolygons, approximateOptions, colorCache);
+          const approximateCost = polygonRenderCost(approximate);
+          let approximateCracks = null;
+          let approximateMetrics;
+          const sampleApproximateCracks = (allowReferenceCracks) => {
+            approximateCracks ?? (approximateCracks = sampleCandidateCracks(
+              approximate,
+              approximateOptions.maxBoundaryDisplacement,
+              allowReferenceCracks
+            ));
+            return approximateCracks;
+          };
+          const approximateAllowsReferenceCracks = !!approximateOptions.allowReferenceCracks;
+          let approximatePassesCrackBudget = true;
+          if (automaticApproximate || approximateOptions.guard) {
+            const sample = sampleApproximateCracks(approximateAllowsReferenceCracks);
+            approximateMetrics = sample.metrics;
+            approximatePassesCrackBudget = passesLossyCrackBudget(sample, approximateAllowsReferenceCracks);
+          }
+          if (!approximatePassesCrackBudget && approximateCost < bestCost) {
+            continue;
+          }
+          if (approximatePassesCrackBudget) {
+            acceptLossyCandidate(approximate, approximateCost);
+            considerQualityCandidate(
+              approximate,
+              approximateCost,
+              approximateOptions.maxBoundaryDisplacement,
+              approximateMetrics
+            );
+          }
+          if (coverLossyCandidates) {
+            const coveredApproximate = applyRectCoverCandidate(approximate, options.rectCover);
+            const coveredApproximateCost = polygonRenderCost(coveredApproximate);
+            let coveredApproximateCracks = null;
+            let coveredApproximateMetrics;
+            const sampleCoveredApproximateCracks = (allowReferenceCracks) => {
+              coveredApproximateCracks ?? (coveredApproximateCracks = sampleCandidateCracks(
+                coveredApproximate,
+                approximateOptions.maxBoundaryDisplacement,
+                allowReferenceCracks
+              ));
+              return coveredApproximateCracks;
+            };
+            if (coveredApproximate !== approximate && coveredApproximateCost < bestCost) {
+              let coveredPassesCrackGuard = true;
+              if (automaticApproximate || approximateOptions.guard) {
+                const sample = sampleCoveredApproximateCracks(approximateAllowsReferenceCracks);
+                coveredApproximateMetrics = sample.metrics;
+                coveredPassesCrackGuard = passesLossyCrackBudget(sample, approximateAllowsReferenceCracks);
+              }
+              if (coveredPassesCrackGuard) {
+                acceptLossyCandidate(coveredApproximate, coveredApproximateCost);
+                considerQualityCandidate(
+                  coveredApproximate,
+                  coveredApproximateCost,
+                  approximateOptions.maxBoundaryDisplacement,
+                  coveredApproximateMetrics
+                );
+              }
+            }
+          }
+        }
+      }
     }
-    const projected2 = group.map((index) => projectPolygonToPlane(snapped[index], fit));
-    const source = group.map((index) => snapped[index]);
-    const chosen = projectedGroupWins(source, projected2) ? projected2 : source;
-    for (let groupIndex = 0; groupIndex < group.length; groupIndex++) {
-      writeOutput(group[groupIndex], chosen[groupIndex]);
+    if (automaticApproximate && !skipAutomaticGeometryApproximation) {
+      for (const budget of LOSSY_BUDGET_SWEEP) {
+        const polygonPairOptions = resolveNormalizeOptions({ ...budget, isolatedPairs: true });
+        const polygonPaired = mergeAdjacentApproximatePolygonPairs(best, polygonPairOptions);
+        if (polygonPaired === best) continue;
+        const polygonPairCost = polygonRenderCost(polygonPaired);
+        if (polygonPairCost >= bestCost) continue;
+        const polygonPairCracks = sampleCandidateCracks(
+          polygonPaired,
+          polygonPairOptions.maxBoundaryDisplacement
+        );
+        if (!passesLossyCrackBudget(polygonPairCracks)) continue;
+        acceptLossyCandidate(polygonPaired, polygonPairCost);
+        considerQualityCandidate(
+          polygonPaired,
+          polygonPairCost,
+          polygonPairOptions.maxBoundaryDisplacement,
+          polygonPairCracks.metrics
+        );
+      }
+    }
+    const qualityBest = chooseLossyQualityCandidate(
+      qualityCandidates,
+      best,
+      bestCost,
+      (candidate) => {
+        candidate.metrics ?? (candidate.metrics = candidateCrackQualityMetrics(
+          getCrackSource(),
+          candidate.polygons,
+          candidate.maxBoundaryDisplacement
+        ).metrics);
+        return candidate.metrics;
+      },
+      () => candidateCrackQualityMetrics(
+        getCrackSource(),
+        best,
+        DEFAULT_LOSSY_APPROXIMATE_OPTIONS.maxBoundaryDisplacement
+      ).metrics
+    );
+    if (qualityBest) {
+      best = qualityBest.polygons;
+      bestCost = qualityBest.cost;
     }
   }
-  const projected = output.flatMap((polygon) => polygon ? [polygon] : []);
-  return snapGeometryForMerge(projected);
+  return best;
 }
-function snapGeometryForMerge(polygons) {
-  const geometryEpsilon = geometrySnapEpsilon(polygons);
-  const uvEpsilon = 1e-4;
-  if (geometryEpsilon <= 0) return polygons;
-  const vertices = createVec3Snapper(geometryEpsilon);
+function lossyColorQuantizeCandidates(polygons) {
+  const profile = solidHexColorProfile(polygons);
+  if (profile.eligiblePolygons < 24 || profile.colorCount < 8) return [];
+  const candidates = [];
+  const seen = /* @__PURE__ */ new Set();
+  for (const step of LOSSY_COLOR_QUANTIZE_STEPS) {
+    const quantized = quantizeSolidHexColors(polygons, step, profile.colorCount);
+    if (!quantized) continue;
+    const signature = colorSignature(quantized);
+    if (seen.has(signature)) continue;
+    seen.add(signature);
+    candidates.push(quantized);
+  }
+  return candidates;
+}
+function solidHexColorProfile(polygons) {
+  const colors = /* @__PURE__ */ new Set();
+  let eligiblePolygons = 0;
+  for (const polygon of polygons) {
+    if (polygon.texture || polygon.material?.texture || polygon.uvs || polygon.textureTriangles?.length) {
+      continue;
+    }
+    if (!parseHexColor(polygon.color)) continue;
+    eligiblePolygons += 1;
+    colors.add(polygon.color ?? "#cccccc");
+  }
+  return { eligiblePolygons, colorCount: colors.size };
+}
+function quantizeSolidHexColors(polygons, step, originalColorCount) {
+  let changed = false;
+  const quantizedColors = /* @__PURE__ */ new Set();
+  const output = polygons.map((polygon) => {
+    if (polygon.texture || polygon.material?.texture || polygon.uvs || polygon.textureTriangles?.length) {
+      return polygon;
+    }
+    const color = parseHexColor(polygon.color);
+    if (!color) return polygon;
+    const nextColor = formatHexColor([
+      Math.round(color[0] / step) * step,
+      Math.round(color[1] / step) * step,
+      Math.round(color[2] / step) * step
+    ]);
+    quantizedColors.add(nextColor);
+    if (nextColor === polygon.color) return polygon;
+    changed = true;
+    return { ...polygon, color: nextColor };
+  });
+  if (!changed || quantizedColors.size >= originalColorCount) return null;
+  return output;
+}
+function parseHexColor(color) {
+  const value = color ?? "#cccccc";
+  const short = /^#([0-9a-f])([0-9a-f])([0-9a-f])$/i.exec(value);
+  if (short) {
+    return [
+      parseInt(short[1] + short[1], 16),
+      parseInt(short[2] + short[2], 16),
+      parseInt(short[3] + short[3], 16)
+    ];
+  }
+  const full = /^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})$/i.exec(value);
+  if (!full) return null;
+  return [
+    parseInt(full[1], 16),
+    parseInt(full[2], 16),
+    parseInt(full[3], 16)
+  ];
+}
+function formatHexColor(color) {
+  return `#${color.map(
+    (channel) => Math.max(0, Math.min(255, Math.round(channel))).toString(16).padStart(2, "0")
+  ).join("")}`;
+}
+function colorSignature(polygons) {
+  return polygons.map((polygon) => polygon.color ?? "").join("|");
+}
+function lossyApproximateCandidates(setting, baseline) {
+  if (setting && setting !== true) {
+    if (typeof setting.isolatedPairs === "boolean") {
+      return [{ ...setting, guard: setting.isolatedPairs === false }];
+    }
+    return [
+      { ...setting, isolatedPairs: true, guard: false },
+      { ...setting, isolatedPairs: false, guard: true }
+    ];
+  }
+  if (baseline && shouldUseRectangulatedLossyPath(baseline)) {
+    return [{
+      ...LOSSY_BUDGET_SWEEP[0],
+      isolatedPairs: true,
+      guard: false,
+      allowReferenceCracks: true
+    }];
+  }
+  const candidates = [];
+  const seen = /* @__PURE__ */ new Set();
+  const isolatedPairModes = baseline && baseline.length > LOSSY_AUTOMATIC_GROUP_MAX_POLYGONS ? [true] : [true, false];
+  for (let budgetIndex = 0; budgetIndex < LOSSY_BUDGET_SWEEP.length; budgetIndex++) {
+    const budget = LOSSY_BUDGET_SWEEP[budgetIndex];
+    for (const isolatedPairs of isolatedPairModes) {
+      const candidate = {
+        ...budget,
+        isolatedPairs,
+        guard: budgetIndex > 0 || isolatedPairs === false,
+        allowReferenceCracks: true
+      };
+      const key = [
+        candidate.maxAngleDeg,
+        candidate.maxPlaneDisplacement,
+        candidate.maxBoundaryDisplacement,
+        candidate.isolatedPairs
+      ].join("|");
+      if (seen.has(key)) continue;
+      seen.add(key);
+      candidates.push(candidate);
+    }
+  }
+  if (candidates.length === 0) {
+    return [{ ...DEFAULT_LOSSY_APPROXIMATE_OPTIONS, guard: false }];
+  }
+  return candidates;
+}
+function shouldUseRectangulatedLossyPath(baseline) {
+  if (baseline.length < LOSSY_RECTANGULATED_MIN_POLYGONS) return false;
+  const triangles = polygonTriangleCount(baseline);
+  return triangles / baseline.length <= LOSSY_RECTANGULATED_MAX_TRIANGLE_RATIO;
+}
+function shouldUseRectangulatedFastExit(baseline) {
+  return baseline.length >= LOSSY_RECTANGULATED_FAST_EXIT_MIN_POLYGONS && shouldUseRectangulatedLossyPath(baseline);
+}
+function shouldSkipAutomaticGeometryApproximation(baseline) {
+  if (baseline.length < AUTOMATIC_GEOMETRY_SKIP_MIN_POLYGONS) return false;
+  for (const polygon of baseline) {
+    if (polygon.vertices.length !== 4) return false;
+    if (polygon.texture || polygon.material?.texture || polygon.textureTriangles?.length) return false;
+    const plane = planeOfPolygon(polygon);
+    if (!plane || !isCardinalNormal(plane.normal)) return false;
+  }
+  return true;
+}
+function isCardinalNormal(normal) {
+  const ax = Math.abs(normal[0]);
+  const ay = Math.abs(normal[1]);
+  const az = Math.abs(normal[2]);
+  const dominant = Math.max(ax, ay, az);
+  return dominant >= 1 - CARDINAL_NORMAL_EPSILON && ax + ay + az - dominant <= CARDINAL_NORMAL_EPSILON;
+}
+function polygonRenderCost(polygons) {
+  let cost = 0;
+  for (const polygon of polygons) {
+    const vertexCount = polygon.vertices.length;
+    const irregularPenalty = vertexCount <= 4 ? 0 : Math.min(4, vertexCount - 4) * 0.12;
+    const texturePenalty = polygon.texture || polygon.material?.texture || polygon.textureTriangles?.length ? 0.15 : 0;
+    cost += 1 + irregularPenalty + texturePenalty;
+  }
+  return cost;
+}
+function lossyCrackCostSlack(cost) {
+  return Math.max(LOSSY_CRACK_COST_SLACK, cost * LOSSY_CRACK_RELATIVE_COST_SLACK);
+}
+function chooseLossyQualityCandidate(candidates, best, bestCost, candidateMetrics, bestMetrics) {
+  if (candidates.length === 0) return null;
+  const slack = lossyCrackCostSlack(bestCost);
+  const currentCandidate = candidates.find((candidate) => candidate.polygons === best);
+  let currentMetrics = null;
+  let selected = null;
+  let selectedMetrics = null;
+  for (const candidate of candidates) {
+    if (candidate.polygons === best || candidate.cost > bestCost + slack) continue;
+    const metrics = candidateMetrics(candidate);
+    currentMetrics ?? (currentMetrics = currentCandidate ? candidateMetrics(currentCandidate) : bestMetrics());
+    if (!crackMetricsMateriallyBetter(metrics, currentMetrics)) continue;
+    if (!selected || !selectedMetrics || compareLossyQualityCandidates(candidate, metrics, selected, selectedMetrics) < 0) {
+      selected = candidate;
+      selectedMetrics = metrics;
+    }
+  }
+  return selected;
+}
+function compareLossyQualityCandidates(a, aMetrics, b, bMetrics) {
+  return aMetrics.maxGap - bMetrics.maxGap || aMetrics.internalBoundaryLength - bMetrics.internalBoundaryLength || aMetrics.excessBoundaryLength - bMetrics.excessBoundaryLength || a.cost - b.cost;
+}
+function crackMetricsMateriallyBetter(candidate, current) {
+  const gapSlack = Math.max(5e-4, current.maxGap * 0.02);
+  if (candidate.maxGap < current.maxGap - gapSlack) return true;
+  if (candidate.maxGap > current.maxGap + gapSlack) return false;
+  const lengthSlack = Math.max(8, current.internalBoundaryLength * 0.01);
+  if (candidate.internalBoundaryLength < current.internalBoundaryLength - lengthSlack) return true;
+  if (candidate.internalBoundaryLength > current.internalBoundaryLength + lengthSlack) return false;
+  const excessSlack = Math.max(8, current.excessBoundaryLength * 0.01);
+  return candidate.excessBoundaryLength < current.excessBoundaryLength - excessSlack;
+}
+function crackMetricsExceed(source, metrics, tolerance, reference = null) {
+  return crackMetricsExceedLimits(metrics, crackMetricLimits(source, tolerance, reference));
+}
+function crackMetricLimits(source, tolerance, reference = null) {
+  if (!reference) {
+    return {
+      maxGap: Infinity,
+      internalBoundaryLength: 0,
+      excessBoundaryLength: tolerance
+    };
+  }
+  const gapSlack = Math.max(tolerance * 0.1, 1e-6);
+  const referenceGapLimit = reference.maxGap + gapSlack;
+  const gapLimit = tolerance <= 0.08 ? Math.max(referenceGapLimit, Math.min(tolerance * 0.75, 0.04)) : referenceGapLimit;
+  const lengthSlack = Math.max(tolerance * 2, reference.internalBoundaryLength * 0.15);
+  const excessSlack = Math.max(tolerance * 2, reference.excessBoundaryLength * 0.15);
+  return {
+    maxGap: gapLimit,
+    internalBoundaryLength: reference.internalBoundaryLength + lengthSlack,
+    excessBoundaryLength: reference.excessBoundaryLength + excessSlack
+  };
+}
+function crackMetricsExceedLimits(metrics, limits) {
+  return metrics.maxGap > limits.maxGap || metrics.internalBoundaryLength > limits.internalBoundaryLength || metrics.excessBoundaryLength > limits.excessBoundaryLength;
+}
+function candidateCrackMetrics(source, candidate, maxBoundaryDisplacement = 0, searchTolerance = crackToleranceForSource(source, maxBoundaryDisplacement), stopLimits) {
+  const sourceEdges = source.edges;
+  const candidateEdges = collectEdgeStats(candidate);
+  const tolerance = crackToleranceForSource(source, maxBoundaryDisplacement);
+  const internalIndex = searchTolerance > 0 ? internalSegmentIndexForSource(source, searchTolerance) : null;
+  const metrics = {
+    ...EMPTY_CRACK_METRICS,
+    excessBoundaryLength: Math.max(0, candidateEdges.boundaryLength - sourceEdges.boundaryLength)
+  };
+  if (stopLimits && crackMetricsExceedLimits(metrics, stopLimits)) {
+    return { metrics, tolerance };
+  }
+  for (const edge of candidateEdges.boundarySegments) {
+    const key = edgeKey3(edge.a, edge.b);
+    if (sourceEdges.boundaryKeys.has(key)) continue;
+    if (sourceEdges.internalKeys.has(key)) {
+      metrics.internalBoundaryLength += distanceVec(edge.a, edge.b);
+      if (stopLimits && crackMetricsExceedLimits(metrics, stopLimits)) break;
+      continue;
+    }
+    const gap = internalIndex ? indexedInternalEdgeGap(edge, internalIndex, searchTolerance) : null;
+    if (gap !== null) {
+      metrics.maxGap = Math.max(metrics.maxGap, gap);
+      metrics.internalBoundaryLength += distanceVec(edge.a, edge.b);
+      if (stopLimits && crackMetricsExceedLimits(metrics, stopLimits)) break;
+    }
+  }
+  return { metrics, tolerance };
+}
+function candidateCrackQualityMetrics(source, candidate, maxBoundaryDisplacement = 0, stopLimits) {
+  return candidateCrackMetrics(
+    source,
+    candidate,
+    maxBoundaryDisplacement,
+    crackQualitySearchToleranceForSource(source, maxBoundaryDisplacement),
+    stopLimits
+  );
+}
+function createCrackSourceContext(polygons) {
+  const diagonal = modelDiagonal(polygons);
+  const baseTolerance = diagonal > 0 ? Math.min(0.08, Math.max(1e-3, diagonal * 1e-3)) : 0;
+  return {
+    edges: collectEdgeStats(polygons),
+    baseTolerance,
+    polygonCount: polygons.length,
+    indexes: /* @__PURE__ */ new Map()
+  };
+}
+function crackToleranceForSource(source, maxBoundaryDisplacement = 0) {
+  return Math.max(source.baseTolerance, maxBoundaryDisplacement * 1.05);
+}
+function crackQualitySearchToleranceForSource(source, maxBoundaryDisplacement = 0) {
+  return Math.max(
+    crackToleranceForSource(source, maxBoundaryDisplacement),
+    source.baseTolerance * LOSSY_CRACK_QUALITY_SEARCH_MULTIPLIER,
+    maxBoundaryDisplacement * LOSSY_CRACK_QUALITY_SEARCH_MULTIPLIER
+  );
+}
+function internalSegmentIndexForSource(source, tolerance) {
+  const key = tolerance.toFixed(6);
+  const current = source.indexes.get(key);
+  if (current) return current;
+  const index = buildSegmentIndex(source.edges.internalSegments, tolerance);
+  source.indexes.set(key, index);
+  return index;
+}
+function collectEdgeStats(polygons) {
+  const edges = /* @__PURE__ */ new Map();
+  for (const polygon of polygons) {
+    for (let i = 0; i < polygon.vertices.length; i++) {
+      const a = polygon.vertices[i];
+      const b = polygon.vertices[(i + 1) % polygon.vertices.length];
+      const key = edgeKey3(a, b);
+      const current = edges.get(key);
+      if (current) current.count += 1;
+      else edges.set(key, { count: 1, a, b });
+    }
+  }
+  const boundaryKeys = /* @__PURE__ */ new Set();
+  const internalKeys = /* @__PURE__ */ new Set();
+  const boundarySegments = [];
+  const internalSegments = [];
+  let boundaryLength = 0;
+  for (const [key, edge] of edges) {
+    const segment = { a: edge.a, b: edge.b };
+    if (edge.count === 1) {
+      boundaryKeys.add(key);
+      boundarySegments.push(segment);
+      boundaryLength += distanceVec(segment.a, segment.b);
+    } else {
+      internalKeys.add(key);
+      internalSegments.push(segment);
+    }
+  }
+  return { boundaryKeys, internalKeys, boundarySegments, internalSegments, boundaryLength };
+}
+function modelDiagonal(polygons) {
+  let minX = Infinity;
+  let minY = Infinity;
+  let minZ = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  let maxZ = -Infinity;
+  for (const polygon of polygons) {
+    for (const [x, y, z] of polygon.vertices) {
+      minX = Math.min(minX, x);
+      minY = Math.min(minY, y);
+      minZ = Math.min(minZ, z);
+      maxX = Math.max(maxX, x);
+      maxY = Math.max(maxY, y);
+      maxZ = Math.max(maxZ, z);
+    }
+  }
+  return Number.isFinite(minX) ? Math.hypot(maxX - minX, maxY - minY, maxZ - minZ) : 0;
+}
+function buildSegmentIndex(segments, tolerance) {
+  const cellSize = Math.max(tolerance * 2, 1e-6);
+  const cells = /* @__PURE__ */ new Map();
+  for (const segment of segments) {
+    const [cx, cy, cz] = segmentCell(segment, cellSize);
+    const key = cellKey(cx, cy, cz);
+    const bucket = cells.get(key);
+    if (bucket) bucket.push(segment);
+    else cells.set(key, [segment]);
+  }
+  return { cellSize, cells };
+}
+function indexedInternalEdgeGap(segment, index, tolerance) {
+  const [cx, cy, cz] = segmentCell(segment, index.cellSize);
+  let best = null;
+  for (let dx = -1; dx <= 1; dx++) {
+    for (let dy = -1; dy <= 1; dy++) {
+      for (let dz = -1; dz <= 1; dz++) {
+        const bucket = index.cells.get(cellKey(cx + dx, cy + dy, cz + dz));
+        if (!bucket) continue;
+        for (const candidate of bucket) {
+          const gap = segmentEndpointGap(segment, candidate);
+          if (gap <= tolerance) best = best === null ? gap : Math.min(best, gap);
+        }
+      }
+    }
+  }
+  return best;
+}
+function segmentCell(segment, cellSize) {
+  return [
+    Math.floor((segment.a[0] + segment.b[0]) / 2 / cellSize),
+    Math.floor((segment.a[1] + segment.b[1]) / 2 / cellSize),
+    Math.floor((segment.a[2] + segment.b[2]) / 2 / cellSize)
+  ];
+}
+function cellKey(x, y, z) {
+  return `${x},${y},${z}`;
+}
+function segmentEndpointGap(a, b) {
+  return Math.min(
+    Math.max(distanceVec(a.a, b.a), distanceVec(a.b, b.b)),
+    Math.max(distanceVec(a.a, b.b), distanceVec(a.b, b.a))
+  );
+}
+function applyRectCoverCandidate(polygons, setting) {
+  if (setting === false) return polygons;
+  const options = resolveRectCoverOptions(polygons, setting);
+  if (!options) return polygons;
+  const covered = coverPlanarPolygons(polygons, options);
+  return covered.length < polygons.length ? covered : polygons;
+}
+function resolveRectCoverOptions(polygons, setting) {
+  if (setting && setting !== true) return setting;
+  const polygonCount = polygons.length;
+  if (polygonCount > 2200) return null;
+  if (polygonCount > 1200) {
+    return {
+      ...DEFAULT_RECT_COVER_OPTIONS,
+      maxCandidateAxes: Math.min(DEFAULT_RECT_COVER_OPTIONS.maxCandidateAxes ?? 24, 2)
+    };
+  }
+  if (polygonCount > 300 && polygonTriangleCount(polygons) <= RECT_COVER_MOSTLY_QUAD_TRIANGLE_LIMIT) {
+    return {
+      ...DEFAULT_RECT_COVER_OPTIONS,
+      maxCandidateAxes: Math.min(DEFAULT_RECT_COVER_OPTIONS.maxCandidateAxes ?? 24, 2)
+    };
+  }
+  if (polygonCount > 900) {
+    return {
+      ...DEFAULT_RECT_COVER_OPTIONS,
+      maxCandidateAxes: Math.min(DEFAULT_RECT_COVER_OPTIONS.maxCandidateAxes ?? 24, 4)
+    };
+  }
+  return DEFAULT_RECT_COVER_OPTIONS;
+}
+function automaticLossyRectCoverOptions(polygons) {
+  if (polygons.length > AUTOMATIC_RECT_COVER_MAX_POLYGONS) return false;
+  if (polygons.length === 0) return false;
+  if (polygonTriangleCount(polygons) / polygons.length < AUTOMATIC_RECT_COVER_MIN_TRIANGLE_RATIO) {
+    return false;
+  }
+  return AUTOMATIC_LOSSY_RECT_COVER_OPTIONS;
+}
+function polygonTriangleCount(polygons) {
+  let triangles = 0;
+  for (const polygon of polygons) {
+    if (polygon.vertices.length === 3) triangles += 1;
+  }
+  return triangles;
+}
+function applyIndexFilter(polygons, filter) {
+  if (filter === void 0 || filter === null) return polygons;
+  return filter.map((index) => polygons[index]).filter((polygon) => !!polygon);
+}
+function keptIndexFilter(input, kept) {
+  if (kept === input) return null;
+  if (kept.length === input.length && kept.every((polygon, index) => polygon === input[index])) {
+    return null;
+  }
+  const keptSet = new Set(kept);
+  const indices = [];
+  for (let i = 0; i < input.length; i++) {
+    if (keptSet.has(input[i])) indices.push(i);
+  }
+  return indices.length === input.length ? null : indices;
+}
+function dedupedPolygonsForMerge(polygons, cache) {
+  if (cache?.deduped) return cache.deduped;
+  let filter = cache?.dedupedIndices;
+  if (filter === void 0) {
+    const dropped = findOverlappingPolygonDuplicates(polygons);
+    if (dropped.size === 0) {
+      filter = null;
+    } else {
+      filter = [];
+      for (let i = 0; i < polygons.length; i++) {
+        if (!dropped.has(i)) filter.push(i);
+      }
+    }
+    if (cache) cache.dedupedIndices = filter;
+  }
+  const deduped = applyIndexFilter(polygons, filter);
+  if (cache) cache.deduped = deduped;
+  return deduped;
+}
+function interiorPolygonsForMerge(polygons, cache) {
+  if (cache?.interior) return cache.interior;
+  let filter = cache?.interiorIndices;
+  if (filter === void 0) {
+    const kept = cullInteriorPolygons(polygons);
+    filter = keptIndexFilter(polygons, kept);
+    if (cache) cache.interiorIndices = filter;
+  }
+  const interior = applyIndexFilter(polygons, filter);
+  if (cache) cache.interior = interior;
+  return interior;
+}
+function createColorPreprocessCache(polygons, source) {
+  const cache = {
+    dedupedIndices: source.dedupedIndices,
+    interiorIndices: source.interiorIndices,
+    snappedInteriorIndices: source.snappedInteriorIndices
+  };
+  const deduped = dedupedPolygonsForMerge(polygons, cache);
+  if (source.snapped && source.snapped.length === deduped.length) {
+    cache.snapped = applyGeometryTemplate(deduped, source.snapped);
+  }
+  const interior = interiorPolygonsForMerge(deduped, cache);
+  cache.baseline = mergePolygons(interior);
+  return cache;
+}
+function applyGeometryTemplate(polygons, template) {
+  return polygons.map((polygon, index) => {
+    const geometry = template[index];
+    if (!geometry) return polygon;
+    return {
+      ...polygon,
+      vertices: geometry.vertices,
+      ...geometry.uvs ? { uvs: geometry.uvs } : {},
+      ...geometry.textureTriangles ? { textureTriangles: geometry.textureTriangles } : {}
+    };
+  });
+}
+function preprocessModelPolygons(polygons, normalizeGeometry, cache) {
+  const deduped = dedupedPolygonsForMerge(polygons, cache);
+  const interior = interiorPolygonsForMerge(deduped, cache);
+  const baseline = cache?.baseline ?? mergePolygons(interior);
+  if (cache && !cache.baseline) cache.baseline = baseline;
+  if (!normalizeGeometry) return baseline;
+  const options = normalizeGeometry === true ? DEFAULT_NORMALIZE_OPTIONS : resolveNormalizeOptions(normalizeGeometry);
+  if (options.isolatedPairs) {
+    const paired = mergeIsolatedTrianglePairs(snappedInteriorPolygonsForMerge(deduped, cache), options);
+    const mergedPaired = mergePolygons(paired);
+    return mergedPaired.length < baseline.length ? mergedPaired : baseline;
+  }
+  const normalized = mergePolygons(cullInteriorPolygons(normalizeGeometryForMerge(deduped, options, cache)));
+  return normalized.length < baseline.length ? normalized : baseline;
+}
+function snappedPolygonsForMerge(polygons, cache) {
+  if (!cache) return snapGeometryForMerge(polygons);
+  if (!cache.snapped) cache.snapped = snapGeometryForMerge(polygons);
+  return cache.snapped;
+}
+function snappedInteriorPolygonsForMerge(polygons, cache) {
+  if (!cache) return cullInteriorPolygons(snapGeometryForMerge(polygons));
+  if (!cache.snappedInterior) {
+    const snapped = snappedPolygonsForMerge(polygons, cache);
+    if (cache.snappedInteriorIndices === void 0) {
+      const kept = cullInteriorPolygons(snapped);
+      cache.snappedInteriorIndices = keptIndexFilter(snapped, kept);
+      cache.snappedInterior = kept;
+    } else {
+      cache.snappedInterior = applyIndexFilter(snapped, cache.snappedInteriorIndices);
+    }
+  }
+  return cache.snappedInterior;
+}
+function resolveNormalizeOptions(options) {
+  return {
+    maxAngleDeg: options.maxAngleDeg ?? DEFAULT_NORMALIZE_OPTIONS.maxAngleDeg,
+    maxPlaneDisplacement: options.maxPlaneDisplacement ?? DEFAULT_NORMALIZE_OPTIONS.maxPlaneDisplacement,
+    maxBoundaryDisplacement: options.maxBoundaryDisplacement ?? DEFAULT_NORMALIZE_OPTIONS.maxBoundaryDisplacement,
+    isolatedPairs: options.isolatedPairs ?? DEFAULT_NORMALIZE_OPTIONS.isolatedPairs
+  };
+}
+function mergeIsolatedTrianglePairs(polygons, options) {
+  const metas = polygons.map((polygon) => {
+    const plane = planeOfPolygon(polygon);
+    if (!plane) return null;
+    return {
+      polygon,
+      normal: plane.normal,
+      area: plane.area,
+      materialKey: materialKeyForPolygon(polygon)
+    };
+  });
+  const edgeOwners = /* @__PURE__ */ new Map();
+  for (let i = 0; i < polygons.length; i++) {
+    const polygon = polygons[i];
+    if (polygon.vertices.length !== 3 || !metas[i]) continue;
+    for (let j = 0; j < polygon.vertices.length; j++) {
+      const key = edgeKey3(polygon.vertices[j], polygon.vertices[(j + 1) % polygon.vertices.length]);
+      const owners = edgeOwners.get(key);
+      if (owners) owners.push(i);
+      else edgeOwners.set(key, [i]);
+    }
+  }
+  const candidates = [];
+  for (const owners of edgeOwners.values()) {
+    if (owners.length !== 2) continue;
+    const [a, b] = owners;
+    const candidate = approximateTrianglePairCandidate(a, b, polygons, metas, options);
+    if (candidate) candidates.push(candidate);
+  }
+  const used = /* @__PURE__ */ new Set();
+  const replacements = /* @__PURE__ */ new Map();
+  const skipped = /* @__PURE__ */ new Set();
+  const selected = choosePairCandidates(candidates);
+  const vertexMoves = averagedVertexPositionMoves(selected.flatMap((candidate) => candidate.vertexMoves));
+  for (const candidate of selected) {
+    used.add(candidate.a);
+    used.add(candidate.b);
+    const outputIndex = Math.min(candidate.a, candidate.b);
+    replacements.set(outputIndex, candidate.polygon);
+    skipped.add(Math.max(candidate.a, candidate.b));
+  }
+  const output = [];
+  for (let i = 0; i < polygons.length; i++) {
+    const replacement = replacements.get(i);
+    if (replacement) {
+      output.push(replacement);
+      continue;
+    }
+    if (skipped.has(i)) continue;
+    output.push(polygons[i]);
+  }
+  return vertexMoves.size > 0 ? applyVertexPositionMoves(output, vertexMoves) : output;
+}
+function choosePairCandidates(candidates) {
+  if (candidates.length > 3e3) return choosePairCandidatesStatic(candidates);
+  return choosePairCandidatesDynamic(candidates);
+}
+function choosePairCandidatesStatic(candidates) {
+  const pairDegrees = /* @__PURE__ */ new Map();
+  for (const candidate of candidates) {
+    pairDegrees.set(candidate.a, (pairDegrees.get(candidate.a) ?? 0) + 1);
+    pairDegrees.set(candidate.b, (pairDegrees.get(candidate.b) ?? 0) + 1);
+  }
+  const sorted = [...candidates].sort((a, b) => {
+    const degreeA = (pairDegrees.get(a.a) ?? 0) + (pairDegrees.get(a.b) ?? 0);
+    const degreeB = (pairDegrees.get(b.a) ?? 0) + (pairDegrees.get(b.b) ?? 0);
+    return degreeA - degreeB || a.score - b.score;
+  });
+  const used = /* @__PURE__ */ new Set();
+  const selected = [];
+  for (const candidate of sorted) {
+    if (used.has(candidate.a) || used.has(candidate.b)) continue;
+    used.add(candidate.a);
+    used.add(candidate.b);
+    selected.push(candidate);
+  }
+  return selected;
+}
+function choosePairCandidatesDynamic(candidates) {
+  const incident = /* @__PURE__ */ new Map();
+  for (let i = 0; i < candidates.length; i++) {
+    const candidate = candidates[i];
+    const aIncident = incident.get(candidate.a);
+    if (aIncident) aIncident.push(i);
+    else incident.set(candidate.a, [i]);
+    const bIncident = incident.get(candidate.b);
+    if (bIncident) bIncident.push(i);
+    else incident.set(candidate.b, [i]);
+  }
+  const selected = [];
+  const live = new Array(candidates.length).fill(true);
+  const liveIncidentCount = /* @__PURE__ */ new Map();
+  const heap = new PairCandidateRankHeap();
+  for (const [polygon, list] of incident) liveIncidentCount.set(polygon, list.length);
+  const liveDegree = (candidate) => (liveIncidentCount.get(candidate.a) ?? 0) + (liveIncidentCount.get(candidate.b) ?? 0);
+  const pushRank = (index) => {
+    const candidate = candidates[index];
+    heap.push({
+      degree: liveDegree(candidate),
+      score: candidate.score,
+      index
+    });
+  };
+  const invalidate = (index, changedPolygons) => {
+    if (!live[index]) return;
+    live[index] = false;
+    const candidate = candidates[index];
+    for (const polygon of [candidate.a, candidate.b]) {
+      liveIncidentCount.set(polygon, (liveIncidentCount.get(polygon) ?? 0) - 1);
+      changedPolygons.add(polygon);
+    }
+  };
+  for (let i = 0; i < candidates.length; i++) pushRank(i);
+  while (heap.size() > 0) {
+    const rank = heap.pop();
+    if (!live[rank.index]) continue;
+    const candidate = candidates[rank.index];
+    const degree = liveDegree(candidate);
+    if (degree !== rank.degree) {
+      pushRank(rank.index);
+      continue;
+    }
+    selected.push(candidate);
+    const changedPolygons = /* @__PURE__ */ new Set();
+    for (const polygon of [candidate.a, candidate.b]) {
+      for (const index of incident.get(polygon) ?? []) {
+        invalidate(index, changedPolygons);
+      }
+    }
+    for (const polygon of changedPolygons) {
+      for (const index of incident.get(polygon) ?? []) {
+        if (live[index]) pushRank(index);
+      }
+    }
+  }
+  return selected;
+}
+var PairCandidateRankHeap = class {
+  constructor() {
+    this.items = [];
+  }
+  size() {
+    return this.items.length;
+  }
+  push(item) {
+    this.items.push(item);
+    let index = this.items.length - 1;
+    while (index > 0) {
+      const parent = index - 1 >> 1;
+      if (comparePairCandidateRanks(this.items[parent], this.items[index]) <= 0) break;
+      [this.items[parent], this.items[index]] = [this.items[index], this.items[parent]];
+      index = parent;
+    }
+  }
+  pop() {
+    if (this.items.length === 0) return null;
+    const top = this.items[0];
+    const last = this.items.pop();
+    if (this.items.length > 0) {
+      this.items[0] = last;
+      let index = 0;
+      for (; ; ) {
+        const left = index * 2 + 1;
+        const right = left + 1;
+        let best = index;
+        if (left < this.items.length && comparePairCandidateRanks(this.items[left], this.items[best]) < 0) best = left;
+        if (right < this.items.length && comparePairCandidateRanks(this.items[right], this.items[best]) < 0) best = right;
+        if (best === index) break;
+        [this.items[index], this.items[best]] = [this.items[best], this.items[index]];
+        index = best;
+      }
+    }
+    return top;
+  }
+};
+function comparePairCandidateRanks(a, b) {
+  return a.degree - b.degree || a.score - b.score || a.index - b.index;
+}
+function mergeAdjacentApproximatePolygonPairs(polygons, options) {
+  let current = polygons;
+  let currentCost = polygonRenderCost(current);
+  let origins = vertexOriginsForPolygons(current);
+  for (let pass = 0; pass < LOSSY_POLYGON_PAIR_MAX_PASSES; pass++) {
+    const result = mergeAdjacentApproximatePolygonPairPass(current, options, origins);
+    if (!result) break;
+    const nextCost = polygonRenderCost(result.polygons);
+    if (nextCost >= currentCost) break;
+    current = result.polygons;
+    currentCost = nextCost;
+    origins = result.origins;
+  }
+  return current === polygons ? polygons : current;
+}
+function mergeAdjacentApproximatePolygonPairPass(polygons, options, origins) {
+  const metas = polygons.map((polygon) => {
+    const plane = planeOfPolygon(polygon);
+    if (!plane) return null;
+    return {
+      polygon,
+      normal: plane.normal,
+      area: plane.area,
+      materialKey: materialKeyForPolygon(polygon)
+    };
+  });
+  const edgeOwners = /* @__PURE__ */ new Map();
+  for (let i = 0; i < polygons.length; i++) {
+    const polygon = polygons[i];
+    if (!metas[i] || polygon.vertices.length < 3) continue;
+    for (let edge = 0; edge < polygon.vertices.length; edge++) {
+      const key = edgeKey3(polygon.vertices[edge], polygon.vertices[(edge + 1) % polygon.vertices.length]);
+      const owners = edgeOwners.get(key);
+      if (owners) owners.push({ polygon: i, edge });
+      else edgeOwners.set(key, [{ polygon: i, edge }]);
+    }
+  }
+  const candidates = [];
+  for (const owners of edgeOwners.values()) {
+    if (owners.length !== 2) continue;
+    const [a, b] = owners;
+    const candidate = approximatePolygonPairCandidate(a.polygon, a.edge, b.polygon, b.edge, polygons, metas, options);
+    if (candidate) candidates.push(candidate);
+  }
+  if (candidates.length === 0) return null;
+  candidates.sort((a, b) => b.score - a.score);
+  const used = /* @__PURE__ */ new Set();
+  const selected = [];
+  for (const candidate of candidates) {
+    if (used.has(candidate.a) || used.has(candidate.b)) continue;
+    used.add(candidate.a);
+    used.add(candidate.b);
+    selected.push(candidate);
+  }
+  if (selected.length === 0) return null;
+  const vertexMoves = averagedVertexPositionMoves(selected.flatMap((candidate) => candidate.vertexMoves));
+  if (!vertexPositionMovesWithinOriginBudget(vertexMoves, origins, options.maxBoundaryDisplacement)) {
+    return null;
+  }
+  const moved = applyVertexPositionMoves(polygons, vertexMoves);
+  const movedOrigins = applyVertexPositionMovesToOrigins(polygons, vertexMoves, origins);
+  const merged = mergePolygons(moved);
+  return polygonRenderCost(merged) < polygonRenderCost(polygons) ? { polygons: merged, origins: pruneVertexOriginsToPolygons(merged, movedOrigins) } : null;
+}
+function approximatePolygonPairCandidate(aIndex, aEdge, bIndex, bEdge, polygons, metas, options) {
+  const a = polygons[aIndex];
+  const b = polygons[bIndex];
+  const aMeta = metas[aIndex];
+  const bMeta = metas[bIndex];
+  if (!aMeta || !bMeta) return null;
+  if (a.vertices.length === 3 && b.vertices.length === 3) return null;
+  if (!canApproximatePairMerge(a, b, aMeta, bMeta)) return null;
+  const normalDot = Math.abs(dotVec(aMeta.normal, bMeta.normal));
+  const minNormalDot = Math.cos(options.maxAngleDeg * Math.PI / 180);
+  if (normalDot < minNormalDot) return null;
+  const ring = boundaryRingForAdjacentPair(a, b, aEdge) ?? boundaryRingForAdjacentPair(b, a, bEdge);
+  if (!ring || ring.length < 4 || ring.length > 10) return null;
+  const fit = fitPlaneForVertices(ring);
+  if (!fit) return null;
+  let maxDistance = 0;
+  let squaredDistance = 0;
+  for (const vertex of ring) {
+    const distance = Math.abs(signedPlaneDistance(vertex, fit));
+    maxDistance = Math.max(maxDistance, distance);
+    squaredDistance += distance * distance;
+  }
+  if (maxDistance > Math.min(options.maxPlaneDisplacement, options.maxBoundaryDisplacement)) return null;
+  const projected = ring.map((vertex) => projectVecToPlane(vertex, fit));
+  if (!isConvexPolygon(projected, fit.normal)) return null;
+  const projectedPlane = planeOfPolygon({ vertices: projected });
+  if (!projectedPlane || dotVec(projectedPlane.normal, aMeta.normal) < 0.2 || dotVec(projectedPlane.normal, bMeta.normal) < 0.2) {
+    return null;
+  }
+  const vertexMoves = [
+    ...ring.map((vertex, index) => ({
+      key: vertexKey(vertex),
+      target: projected[index]
+    })),
+    ...textureTriangleVertexProjectionMoves([a, b], fit)
+  ];
+  const projectedPair = applyVertexPositionMoves([a, b], averagedVertexPositionMoves(vertexMoves));
+  const sourceCost = polygonRenderCost([a, b]);
+  const projectedCost = polygonRenderCost(mergePolygons(projectedPair));
+  if (projectedCost >= sourceCost) return null;
+  const score = sourceCost - projectedCost - (squaredDistance / ring.length + maxDistance * 0.25 + (1 - normalDot) * 0.1);
+  if (score <= 0) return null;
+  return {
+    a: aIndex,
+    b: bIndex,
+    vertexMoves,
+    score
+  };
+}
+function boundaryRingForAdjacentPair(a, b, aEdge) {
+  const aVertices = a.vertices;
+  const bVertices = b.vertices;
+  const a0 = aVertices[aEdge];
+  const a1 = aVertices[(aEdge + 1) % aVertices.length];
+  let bEdge = -1;
+  for (let i = 0; i < bVertices.length; i++) {
+    if (eqVec2(bVertices[i], a1) && eqVec2(bVertices[(i + 1) % bVertices.length], a0)) {
+      bEdge = i;
+      break;
+    }
+  }
+  if (bEdge < 0) return null;
+  const ring = [];
+  let index = (aEdge + 1) % aVertices.length;
+  ring.push(aVertices[index]);
+  while (index !== aEdge) {
+    index = (index + 1) % aVertices.length;
+    ring.push(aVertices[index]);
+  }
+  index = (bEdge + 2) % bVertices.length;
+  while (index !== bEdge) {
+    const vertex = bVertices[index];
+    if (!eqVec2(vertex, ring[ring.length - 1])) ring.push(vertex);
+    index = (index + 1) % bVertices.length;
+  }
+  if (ring.length > 1 && eqVec2(ring[0], ring[ring.length - 1])) ring.pop();
+  return ring;
+}
+function vertexPositionMovesWithinOriginBudget(moves, origins, budget) {
+  for (const [key, target] of moves) {
+    const fallback = vertexFromKey(key);
+    const candidates = origins.get(key) ?? (fallback ? [fallback] : []);
+    if (candidates.length === 0) return false;
+    for (const source of candidates) {
+      if (distanceVec(source, target) > budget + 1e-6) return false;
+    }
+  }
+  return true;
+}
+function vertexOriginsForPolygons(polygons) {
+  const origins = /* @__PURE__ */ new Map();
+  for (const polygon of polygons) {
+    for (const vertex of polygon.vertices) {
+      addVertexOrigin(origins, vertexKey(vertex), vertex);
+    }
+    for (const triangle of polygon.textureTriangles ?? []) {
+      for (const vertex of triangle.vertices) {
+        addVertexOrigin(origins, vertexKey(vertex), vertex);
+      }
+    }
+  }
+  return origins;
+}
+function applyVertexPositionMovesToOrigins(polygons, moves, origins) {
+  const moved = /* @__PURE__ */ new Map();
+  for (const polygon of polygons) {
+    const vertices = [
+      ...polygon.vertices,
+      ...(polygon.textureTriangles ?? []).flatMap((triangle) => triangle.vertices)
+    ];
+    for (const vertex of vertices) {
+      const sourceKey = vertexKey(vertex);
+      const target = moves.get(sourceKey) ?? vertex;
+      const targetKey = vertexKey(target);
+      for (const origin of origins.get(sourceKey) ?? [vertex]) {
+        addVertexOrigin(moved, targetKey, origin);
+      }
+    }
+  }
+  return moved;
+}
+function pruneVertexOriginsToPolygons(polygons, origins) {
+  const pruned = /* @__PURE__ */ new Map();
+  for (const polygon of polygons) {
+    const vertices = [
+      ...polygon.vertices,
+      ...(polygon.textureTriangles ?? []).flatMap((triangle) => triangle.vertices)
+    ];
+    for (const vertex of vertices) {
+      const key = vertexKey(vertex);
+      for (const origin of origins.get(key) ?? [vertex]) {
+        addVertexOrigin(pruned, key, origin);
+      }
+    }
+  }
+  return pruned;
+}
+function addVertexOrigin(origins, key, origin) {
+  const values = origins.get(key);
+  if (!values) {
+    origins.set(key, [origin]);
+    return;
+  }
+  const originKey = vertexKey(origin);
+  if (!values.some((value) => vertexKey(value) === originKey)) values.push(origin);
+}
+function vertexFromKey(key) {
+  const parts = key.split(",").map(Number);
+  return parts.length === 3 && parts.every(Number.isFinite) ? [parts[0], parts[1], parts[2]] : null;
+}
+function averagedVertexPositionMoves(moves) {
+  const totals = /* @__PURE__ */ new Map();
+  for (const move of moves) {
+    const total = totals.get(move.key);
+    if (total) {
+      total.x += move.target[0];
+      total.y += move.target[1];
+      total.z += move.target[2];
+      total.count += 1;
+    } else {
+      totals.set(move.key, {
+        x: move.target[0],
+        y: move.target[1],
+        z: move.target[2],
+        count: 1
+      });
+    }
+  }
+  const averaged = /* @__PURE__ */ new Map();
+  for (const [key, total] of totals) {
+    averaged.set(key, [
+      total.x / total.count,
+      total.y / total.count,
+      total.z / total.count
+    ]);
+  }
+  return averaged;
+}
+function vertexPositionMovesForProjection(source, projected) {
+  const moves = [];
+  for (let i = 0; i < source.length; i++) {
+    const sourceVertices = source[i].vertices;
+    const projectedVertices = projected[i]?.vertices;
+    if (!projectedVertices || projectedVertices.length !== sourceVertices.length) continue;
+    for (let j = 0; j < sourceVertices.length; j++) {
+      moves.push({
+        key: vertexKey(sourceVertices[j]),
+        target: projectedVertices[j]
+      });
+    }
+    const sourceTriangles = source[i].textureTriangles ?? [];
+    const projectedTriangles = projected[i]?.textureTriangles ?? [];
+    for (let j = 0; j < sourceTriangles.length; j++) {
+      const projectedTriangle = projectedTriangles[j];
+      if (!projectedTriangle) continue;
+      for (let k = 0; k < sourceTriangles[j].vertices.length; k++) {
+        moves.push({
+          key: vertexKey(sourceTriangles[j].vertices[k]),
+          target: projectedTriangle.vertices[k]
+        });
+      }
+    }
+  }
+  return moves;
+}
+function textureTriangleVertexProjectionMoves(polygons, fit) {
+  const moves = [];
+  for (const polygon of polygons) {
+    for (const triangle of polygon.textureTriangles ?? []) {
+      for (const vertex of triangle.vertices) {
+        moves.push({
+          key: vertexKey(vertex),
+          target: projectVecToPlane(vertex, fit)
+        });
+      }
+    }
+  }
+  return moves;
+}
+function applyVertexPositionMoves(polygons, moves) {
+  return polygons.map((polygon) => {
+    let changed = false;
+    const moveVertex = (vertex) => {
+      const target = moves.get(vertexKey(vertex));
+      if (!target) return vertex;
+      changed = true;
+      return target;
+    };
+    const vertices = polygon.vertices.map(moveVertex);
+    const textureTriangles = mapTextureTriangleVertices(polygon.textureTriangles, moveVertex);
+    return changed ? {
+      ...polygon,
+      vertices,
+      ...textureTriangles ? { textureTriangles } : {}
+    } : polygon;
+  });
+}
+function approximateTrianglePairCandidate(aIndex, bIndex, polygons, metas, options) {
+  const a = polygons[aIndex];
+  const b = polygons[bIndex];
+  const aMeta = metas[aIndex];
+  const bMeta = metas[bIndex];
+  if (!aMeta || !bMeta) return null;
+  if (a.vertices.length !== 3 || b.vertices.length !== 3) return null;
+  if (!canApproximatePairMerge(a, b, aMeta, bMeta)) return null;
+  const shared = sharedEdgeIndices(a, b);
+  if (!shared) return null;
+  const [ai0, ai1, bi0, bi1] = shared;
+  const bGoesSameDirection = (bi0 + 1) % b.vertices.length === bi1;
+  if (bGoesSameDirection) return null;
+  const normalDot = Math.abs(dotVec(aMeta.normal, bMeta.normal));
+  const minNormalDot = Math.cos(options.maxAngleDeg * Math.PI / 180);
+  if (normalDot < minNormalDot) return null;
+  const aThird = (ai1 + 1) % a.vertices.length;
+  const bThird = 3 - bi0 - bi1;
+  const ring = [
+    a.vertices[ai1],
+    a.vertices[aThird],
+    a.vertices[ai0],
+    b.vertices[bThird]
+  ];
+  const fit = fitPlaneForVertices(ring);
+  if (!fit) return null;
+  let maxDistance = 0;
+  let squaredDistance = 0;
+  for (const vertex of ring) {
+    const distance = Math.abs(signedPlaneDistance(vertex, fit));
+    maxDistance = Math.max(maxDistance, distance);
+    squaredDistance += distance * distance;
+  }
+  if (maxDistance > Math.min(options.maxPlaneDisplacement, options.maxBoundaryDisplacement)) return null;
+  const projected = ring.map((vertex) => projectVecToPlane(vertex, fit));
+  if (!isConvexPolygon(projected, fit.normal)) return null;
+  const projectedPlane = planeOfPolygon({ vertices: projected });
+  if (!projectedPlane || dotVec(projectedPlane.normal, aMeta.normal) < 0.2 || dotVec(projectedPlane.normal, bMeta.normal) < 0.2) {
+    return null;
+  }
+  const polygon = {
+    vertices: ring,
+    color: a.color,
+    ...a.data ? { data: { ...a.data } } : {}
+  };
+  if (canUseTexturedLossyMerge(a, b) && a.uvs && b.uvs && a.texture) {
+    polygon.texture = a.texture;
+    polygon.uvs = [
+      [...a.uvs[ai1]],
+      [...a.uvs[aThird]],
+      [...a.uvs[ai0]],
+      [...b.uvs[bThird]]
+    ];
+    const textureTriangles = textureTrianglesForPolygons([a, b]);
+    if (textureTriangles?.length) polygon.textureTriangles = textureTriangles;
+  }
+  return {
+    a: aIndex,
+    b: bIndex,
+    polygon,
+    vertexMoves: [
+      ...ring.map((vertex, index) => ({
+        key: vertexKey(vertex),
+        target: projected[index]
+      })),
+      ...textureTriangleVertexProjectionMoves([a, b], fit)
+    ],
+    score: squaredDistance / ring.length + maxDistance * 0.25 + (1 - normalDot) * 0.1
+  };
+}
+function fitPlaneForVertices(vertices) {
+  if (vertices.length < 3) return null;
+  let nx = 0;
+  let ny = 0;
+  let nz = 0;
+  let px = 0;
+  let py = 0;
+  let pz = 0;
+  for (let i = 0; i < vertices.length; i++) {
+    const current = vertices[i];
+    const next = vertices[(i + 1) % vertices.length];
+    nx += (current[1] - next[1]) * (current[2] + next[2]);
+    ny += (current[2] - next[2]) * (current[0] + next[0]);
+    nz += (current[0] - next[0]) * (current[1] + next[1]);
+    px += current[0];
+    py += current[1];
+    pz += current[2];
+  }
+  const normal = normalizeVec([nx, ny, nz]);
+  if (!normal) return null;
+  return {
+    normal,
+    point: [px / vertices.length, py / vertices.length, pz / vertices.length]
+  };
+}
+function isConvexPolygon(vertices, normal) {
+  let sign = 0;
+  for (let i = 0; i < vertices.length; i++) {
+    const a = vertices[i];
+    const b = vertices[(i + 1) % vertices.length];
+    const c = vertices[(i + 2) % vertices.length];
+    const turn = dotVec(crossVec(subVec(b, a), subVec(c, b)), normal);
+    if (Math.abs(turn) <= 1e-9) continue;
+    const nextSign = turn > 0 ? 1 : -1;
+    if (sign === 0) sign = nextSign;
+    else if (sign !== nextSign) return false;
+  }
+  return true;
+}
+function normalizeGeometryForMerge(polygons, options, cache) {
+  const snapped = snappedPolygonsForMerge(polygons, cache);
+  const planeEpsilon = planeFitEpsilon(snapped, options);
+  if (planeEpsilon <= 0) return snapped;
+  const metas = snapped.map((polygon) => {
+    const plane = planeOfPolygon(polygon);
+    if (!plane) return null;
+    return {
+      polygon,
+      normal: plane.normal,
+      area: plane.area,
+      materialKey: materialKeyForPolygon(polygon)
+    };
+  });
+  const adjacency = buildMergeAdjacency(snapped, metas);
+  const assigned = /* @__PURE__ */ new Set();
+  const output = Array(snapped.length);
+  const vertexMoves = [];
+  const writeOutput = (index, polygon) => {
+    output[index] = polygon;
+  };
+  for (let i = 0; i < snapped.length; i++) {
+    const meta = metas[i];
+    if (assigned.has(i)) continue;
+    if (!meta) {
+      writeOutput(i, snapped[i]);
+      continue;
+    }
+    const group = growPlaneGroup(i, metas, adjacency, assigned, planeEpsilon, options);
+    for (const index of group) assigned.add(index);
+    if (group.length < 2) {
+      writeOutput(i, snapped[i]);
+      continue;
+    }
+    const replacements = choosePlaneGroupReplacements(group, snapped, metas, adjacency, planeEpsilon, options);
+    vertexMoves.push(...replacements.vertexMoves);
+    for (const index of group) {
+      writeOutput(index, replacements.polygons.get(index) ?? snapped[index]);
+    }
+  }
+  const projected = output.flatMap((polygon) => polygon ? [polygon] : []);
+  const moved = vertexMoves.length > 0 ? applyVertexPositionMoves(projected, averagedVertexPositionMoves(vertexMoves)) : projected;
+  return snapGeometryForMerge(moved);
+}
+function snapGeometryForMerge(polygons) {
+  const geometryEpsilon = geometrySnapEpsilon(polygons);
+  const uvEpsilon = 1e-4;
+  if (geometryEpsilon <= 0) return polygons;
+  const vertices = createVec3Snapper(geometryEpsilon);
   const uvs = createVec2Snapper(uvEpsilon);
   return polygons.map((polygon) => {
-    const snappedVertices = polygon.vertices.map((vertex) => vertices.snap(vertex));
+    const snapVertex = (vertex) => vertices.snap(vertex);
+    const snappedVertices = polygon.vertices.map(snapVertex);
     const snappedUvs = polygon.uvs && polygon.uvs.length === polygon.vertices.length ? polygon.uvs.map((uv) => uvs.snap(uv)) : void 0;
+    const snappedTextureTriangles = mapTextureTriangleVertices(polygon.textureTriangles, snapVertex);
     const snappedPolygon = {
       ...polygon,
       vertices: snappedVertices,
-      ...snappedUvs ? { uvs: snappedUvs } : {}
+      ...snappedUvs ? { uvs: snappedUvs } : {},
+      ...snappedTextureTriangles ? { textureTriangles: snappedTextureTriangles } : {}
     };
     return {
       ...snappedPolygon,
@@ -791,12 +3076,16 @@ function snapGeometryForMerge(polygons) {
 }
 function textureTrianglesForPolygon(polygon) {
   if (!polygon.texture) return void 0;
+  if (polygon.textureTriangles?.length) return cloneTextureTriangles2(polygon.textureTriangles);
   if (polygon.uvs && polygon.uvs.length === polygon.vertices.length) {
     return fanTextureTriangles2(polygon.vertices, polygon.uvs);
   }
-  if (polygon.textureTriangles?.length) return cloneTextureTriangles2(polygon.textureTriangles);
   return void 0;
 }
+function textureTrianglesForPolygons(polygons) {
+  const triangles = polygons.flatMap((polygon) => textureTrianglesForPolygon(polygon) ?? []);
+  return triangles.length > 0 ? triangles : void 0;
+}
 function fanTextureTriangles2(vertices, uvs) {
   const triangles = [];
   for (let i = 1; i < vertices.length - 1; i++) {
@@ -821,13 +3110,70 @@ function cloneTextureTriangles2(triangles) {
     uvs: triangle.uvs.map((uv) => [...uv])
   }));
 }
-function projectedGroupWins(source, projected) {
-  return mergePolygons(projected).length < mergePolygons(source).length;
+function mapTextureTriangleVertices(triangles, mapVertex) {
+  if (!triangles?.length) return void 0;
+  return triangles.map((triangle) => ({
+    vertices: triangle.vertices.map(mapVertex),
+    uvs: triangle.uvs.map((uv) => [...uv])
+  }));
+}
+function choosePlaneGroupReplacements(group, polygons, metas, adjacency, planeEpsilon, options) {
+  const fullGroup = projectedPlanePatchCandidate(group, polygons, metas, planeEpsilon, options);
+  if (fullGroup) return replacementsForPlanePatch(fullGroup);
+  return splitPlaneGroupIntoWinningPatches(group, polygons, metas, adjacency, planeEpsilon, options);
+}
+function splitPlaneGroupIntoWinningPatches(group, polygons, metas, adjacency, planeEpsilon, options) {
+  const groupSet = new Set(group);
+  const candidates = [];
+  for (const a of group) {
+    for (const b of adjacency.get(a) ?? []) {
+      if (a >= b || !groupSet.has(b)) continue;
+      const candidate = projectedPlanePatchCandidate([a, b], polygons, metas, planeEpsilon, options);
+      if (candidate) candidates.push(candidate);
+    }
+  }
+  candidates.sort((a, b) => b.score - a.score);
+  const used = /* @__PURE__ */ new Set();
+  const replacements = /* @__PURE__ */ new Map();
+  const vertexMoves = [];
+  for (const candidate of candidates) {
+    if (candidate.indices.some((index) => used.has(index))) continue;
+    vertexMoves.push(...candidate.vertexMoves);
+    for (let i = 0; i < candidate.indices.length; i++) {
+      const index = candidate.indices[i];
+      used.add(index);
+      replacements.set(index, polygons[index]);
+    }
+  }
+  return { polygons: replacements, vertexMoves };
+}
+function replacementsForPlanePatch(candidate) {
+  const replacements = /* @__PURE__ */ new Map();
+  for (let i = 0; i < candidate.indices.length; i++) {
+    replacements.set(candidate.indices[i], candidate.source[i]);
+  }
+  return { polygons: replacements, vertexMoves: candidate.vertexMoves };
+}
+function projectedPlanePatchCandidate(group, polygons, metas, planeEpsilon, options) {
+  const fit = fitPlaneForGroup(group, metas);
+  if (!fit || !groupWithinPlaneBudget(group, metas, fit, planeEpsilon, options)) return null;
+  const source = group.map((index) => polygons[index]);
+  const projected = source.map((polygon) => projectPolygonToPlane(polygon, fit));
+  const sourceCost = polygonRenderCost(mergePolygons(source));
+  const projectedCost = polygonRenderCost(mergePolygons(projected));
+  if (projectedCost >= sourceCost) return null;
+  return {
+    indices: group,
+    source,
+    projected,
+    vertexMoves: vertexPositionMovesForProjection(source, projected),
+    score: sourceCost - projectedCost
+  };
 }
-function planeFitEpsilon(polygons) {
+function planeFitEpsilon(polygons, options) {
   const geometryEpsilon = geometrySnapEpsilon(polygons);
   if (geometryEpsilon <= 0) return 0;
-  return Math.min(geometryEpsilon * 3, NORMALIZE_MAX_PLANE_DISPLACEMENT);
+  return options.maxPlaneDisplacement;
 }
 function geometrySnapEpsilon(polygons) {
   let minX = Infinity;
@@ -874,10 +3220,10 @@ function createVec3Snapper(epsilon) {
         }
       }
       const snapped = [input[0], input[1], input[2]];
-      const bucketKey = key(cx, cy, cz);
-      const bucket = buckets.get(bucketKey);
+      const bucketKey2 = key(cx, cy, cz);
+      const bucket = buckets.get(bucketKey2);
       if (bucket) bucket.push(snapped);
-      else buckets.set(bucketKey, [snapped]);
+      else buckets.set(bucketKey2, [snapped]);
       return snapped;
     }
   };
@@ -902,10 +3248,10 @@ function createVec2Snapper(epsilon) {
         }
       }
       const snapped = [input[0], input[1]];
-      const bucketKey = key(cx, cy);
-      const bucket = buckets.get(bucketKey);
+      const bucketKey2 = key(cx, cy);
+      const bucket = buckets.get(bucketKey2);
       if (bucket) bucket.push(snapped);
-      else buckets.set(bucketKey, [snapped]);
+      else buckets.set(bucketKey2, [snapped]);
       return snapped;
     }
   };
@@ -923,10 +3269,10 @@ function planeOfPolygon(polygon) {
   for (let i = 1; i < vertices.length - 1; i++) {
     const a = subVec(vertices[i], origin);
     const b = subVec(vertices[i + 1], origin);
-    const cross2 = crossVec(a, b);
-    nx += cross2[0];
-    ny += cross2[1];
-    nz += cross2[2];
+    const cross4 = crossVec(a, b);
+    nx += cross4[0];
+    ny += cross4[1];
+    nz += cross4[2];
   }
   const len = Math.hypot(nx, ny, nz);
   if (len <= 1e-10) return null;
@@ -942,7 +3288,7 @@ function buildMergeAdjacency(polygons, metas) {
     const polygon = polygons[i];
     if (!metas[i] || polygon.vertices.length < 3) continue;
     for (let j = 0; j < polygon.vertices.length; j++) {
-      const key = edgeKey2(polygon.vertices[j], polygon.vertices[(j + 1) % polygon.vertices.length]);
+      const key = edgeKey3(polygon.vertices[j], polygon.vertices[(j + 1) % polygon.vertices.length]);
       const owners = edgeOwners.get(key);
       if (owners) owners.push(i);
       else edgeOwners.set(key, [i]);
@@ -966,19 +3312,37 @@ function canShareMergePatch(a, b, aMeta, bMeta) {
   if (!aMeta || !bMeta) return false;
   if (aMeta.materialKey !== bMeta.materialKey) return false;
   if (!!a.uvs !== !!b.uvs) return false;
-  if (a.texture || b.texture) return !!a.uvs && !!b.uvs;
+  if (hasTextureMergeState(a) || hasTextureMergeState(b)) return canUseTexturedLossyMerge(a, b);
   if (!a.uvs || !b.uvs) return true;
   const shared = sharedEdgeIndices(a, b);
   if (!shared) return false;
   const [ai0, ai1, bi0, bi1] = shared;
   return eqUv(a.uvs[ai0], b.uvs[bi0]) && eqUv(a.uvs[ai1], b.uvs[bi1]);
 }
+function canApproximatePairMerge(a, b, aMeta, bMeta) {
+  if (aMeta.materialKey !== bMeta.materialKey) return false;
+  if (hasTextureMergeState(a) || hasTextureMergeState(b)) return canUseTexturedLossyMerge(a, b);
+  return !a.uvs && !b.uvs && !a.textureTriangles?.length && !b.textureTriangles?.length;
+}
+function hasTextureMergeState(polygon) {
+  return Boolean(polygon.texture || polygon.material?.texture || polygon.textureTriangles?.length);
+}
+function canUseTexturedLossyMerge(a, b) {
+  if (!a.texture || !b.texture || a.texture !== b.texture) return false;
+  if (a.material?.texture || b.material?.texture) return false;
+  if (!a.uvs || !b.uvs) return false;
+  if (a.uvs.length !== a.vertices.length || b.uvs.length !== b.vertices.length) return false;
+  const shared = sharedEdgeIndices(a, b);
+  if (!shared) return false;
+  const [ai0, ai1, bi0, bi1] = shared;
+  return eqUv(a.uvs[ai0], b.uvs[bi0]) && eqUv(a.uvs[ai1], b.uvs[bi1]);
+}
 function addAdjacency(adjacency, from, to) {
   const values = adjacency.get(from);
   if (values) values.add(to);
   else adjacency.set(from, /* @__PURE__ */ new Set([to]));
 }
-function growPlaneGroup(seed, metas, adjacency, assigned, planeEpsilon) {
+function growPlaneGroup(seed, metas, adjacency, assigned, planeEpsilon, options) {
   const group = [seed];
   const queued = /* @__PURE__ */ new Set([seed]);
   const queue = [seed];
@@ -990,7 +3354,7 @@ function growPlaneGroup(seed, metas, adjacency, assigned, planeEpsilon) {
       const seedMeta = metas[seed];
       if (!nextMeta || !seedMeta) continue;
       if (nextMeta.materialKey !== seedMeta.materialKey) continue;
-      if (!canJoinPlaneGroup([...group, next], metas, planeEpsilon)) continue;
+      if (!canJoinPlaneGroup([...group, next], metas, planeEpsilon, options)) continue;
       group.push(next);
       queued.add(next);
       queue.push(next);
@@ -998,9 +3362,9 @@ function growPlaneGroup(seed, metas, adjacency, assigned, planeEpsilon) {
   }
   return group;
 }
-function canJoinPlaneGroup(group, metas, planeEpsilon) {
+function canJoinPlaneGroup(group, metas, planeEpsilon, options) {
   const fit = fitPlaneForGroup(group, metas);
-  return !!fit && groupWithinPlaneBudget(group, metas, fit, planeEpsilon);
+  return !!fit && groupWithinPlaneBudget(group, metas, fit, planeEpsilon, options);
 }
 function fitPlaneForGroup(group, metas) {
   const seed = metas[group[0]];
@@ -1058,15 +3422,15 @@ function planeOffsetRangeForVertices(group, metas, normal, vertexKeys) {
   }
   return Number.isFinite(min) && Number.isFinite(max) ? { min, max } : null;
 }
-function groupWithinPlaneBudget(group, metas, fit, planeEpsilon) {
-  const normalDotMin = Math.cos(NORMALIZE_MAX_ANGLE_DEG * Math.PI / 180);
+function groupWithinPlaneBudget(group, metas, fit, planeEpsilon, options) {
+  const normalDotMin = Math.cos(options.maxAngleDeg * Math.PI / 180);
   const boundaryVertices = groupBoundaryVertexKeys(group, metas);
   for (const index of group) {
     const meta = metas[index];
     if (!meta) return false;
     if (Math.abs(dotVec(meta.normal, fit.normal)) < normalDotMin) return false;
     for (const vertex of meta.polygon.vertices) {
-      const limit = boundaryVertices.has(vertexKey(vertex)) ? NORMALIZE_MAX_BOUNDARY_DISPLACEMENT : planeEpsilon;
+      const limit = boundaryVertices.has(vertexKey(vertex)) ? options.maxBoundaryDisplacement : planeEpsilon;
       if (Math.abs(signedPlaneDistance(vertex, fit)) > limit) return false;
     }
   }
@@ -1081,7 +3445,7 @@ function groupBoundaryVertexKeys(group, metas) {
     for (let i = 0; i < vertices.length; i++) {
       const a = vertices[i];
       const b = vertices[(i + 1) % vertices.length];
-      const key = edgeKey2(a, b);
+      const key = edgeKey3(a, b);
       const current = edgeCounts.get(key);
       if (current) current.count += 1;
       else edgeCounts.set(key, { count: 1, a, b });
@@ -1096,9 +3460,12 @@ function groupBoundaryVertexKeys(group, metas) {
   return boundary;
 }
 function projectPolygonToPlane(polygon, fit) {
+  const projectVertex = (vertex) => projectVecToPlane(vertex, fit);
+  const textureTriangles = mapTextureTriangleVertices(polygon.textureTriangles, projectVertex);
   return {
     ...polygon,
-    vertices: polygon.vertices.map((vertex) => projectVecToPlane(vertex, fit))
+    vertices: polygon.vertices.map(projectVertex),
+    ...textureTriangles ? { textureTriangles } : {}
   };
 }
 function sharedEdgeIndices(a, b) {
@@ -1116,7 +3483,7 @@ function sharedEdgeIndices(a, b) {
   }
   return null;
 }
-function edgeKey2(a, b) {
+function edgeKey3(a, b) {
   const ak = vertexKey(a);
   const bk = vertexKey(b);
   return ak < bk ? `${ak}|${bk}` : `${bk}|${ak}`;
@@ -1147,9 +3514,9 @@ function distanceVec(a, b) {
   return Math.hypot(a[0] - b[0], a[1] - b[1], a[2] - b[2]);
 }
 function normalizeVec(value) {
-  const length = Math.hypot(value[0], value[1], value[2]);
-  if (length <= 1e-10) return null;
-  return [value[0] / length, value[1] / length, value[2] / length];
+  const length2 = Math.hypot(value[0], value[1], value[2]);
+  if (length2 <= 1e-10) return null;
+  return [value[0] / length2, value[1] / length2, value[2] / length2];
 }
 function signedPlaneDistance(vertex, fit) {
   return dotVec(subVec(vertex, fit.point), fit.normal);
@@ -1163,7 +3530,27 @@ function projectVecToPlane(vertex, fit) {
   ];
 }
 
+// packages/core/src/parser/solidTextureSamples.ts
+var DEFAULT_MAX_TEXTURE_PIXELS = 16 * 1024 * 1024;
+
+// packages/core/src/voxel/voxelSlicePlanner.ts
+var CUBE_FACES = ["t", "b", "bl", "br", "fr", "fl"];
+var FACE_ORDER = new Map(CUBE_FACES.map((face, index) => [face, index]));
+
+// packages/polycss/src/render/textureAtlas.ts
+var ATLAS_MAX_SIZE = 4096;
+var AUTO_ATLAS_LOW_AREA = ATLAS_MAX_SIZE * ATLAS_MAX_SIZE;
+var AUTO_ATLAS_MEDIUM_AREA = AUTO_ATLAS_LOW_AREA * 3;
+var AUTO_ATLAS_MAX_DECODED_BYTES_MOBILE = 4 * 1024 * 1024;
+var AUTO_ATLAS_MAX_DECODED_BYTES_DESKTOP = 16 * 1024 * 1024;
+var PROJECTIVE_QUAD_MAX_WEIGHT_RATIO = Number.POSITIVE_INFINITY;
+
 // bench/entries/normalize.ts
+function preprocessModelPolygons2(polygons, normalizeGeometry) {
+  return optimizeMeshPolygons(polygons, {
+    meshResolution: normalizeGeometry ? "lossy" : "lossless"
+  });
+}
 function paintPolygonsSolid(polygons, color) {
   return polygons.map((p) => ({
     ...p,
@@ -1227,5 +3614,5 @@ function computePolygonNormal(vertices) {
 export {
   paintPolygonsSolid,
   polygonsToWireframe,
-  preprocessModelPolygons
+  preprocessModelPolygons2 as preprocessModelPolygons
 };
diff --git a/bench/trace-event-args.mjs b/bench/trace-event-args.mjs
new file mode 100644
index 00000000..a04e933a
--- /dev/null
+++ b/bench/trace-event-args.mjs
@@ -0,0 +1,162 @@
+#!/usr/bin/env node
+import { createServer } from "node:http";
+import { readFile } from "node:fs/promises";
+import { dirname, extname, resolve } from "node:path";
+import { fileURLToPath } from "node:url";
+import { chromium } from "playwright";
+import { chromiumArgsWithGpuDefault } from "./chromium-defaults.mjs";
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const repoRoot = resolve(__dirname, "..");
+const benchDir = resolve(repoRoot, "bench");
+const galleryDir = resolve(repoRoot, "website/public/gallery");
+
+const args = new Map(process.argv.slice(2).map((arg) => {
+  const [key, ...rest] = arg.replace(/^--/, "").split("=");
+  return [key, rest.length ? rest.join("=") : "true"];
+}));
+
+const MESH = args.get("mesh") ?? "obj-house3";
+const RENDERER = args.get("renderer") ?? "vanilla";
+const MODE = args.get("mode") ?? "baked";
+const MOTION = args.get("motion") ?? "rot";
+const WARMUP_MS = Number(args.get("warmup") ?? 1200);
+const SAMPLE_MS = Number(args.get("sample") ?? 2500);
+const HEADED = args.has("headed");
+const SOFTWARE_BACKEND = args.has("software-backend");
+const CHROMIUM_ARGS = chromiumArgsWithGpuDefault((args.get("chromium-args") ?? "")
+  .split(/\s+/)
+  .map((value) => value.trim())
+  .filter(Boolean), { softwareBackend: SOFTWARE_BACKEND });
+const EVENT_NAMES = (args.get("events") ??
+  "SoftwareRenderer::DoDrawQuad,DirectRenderer::DrawRenderPass,MainFrame.Draw,LayerTreeHostImpl::PrepareToDraw")
+  .split(",")
+  .map((value) => value.trim())
+  .filter(Boolean);
+
+const MIME = {
+  ".html": "text/html; charset=utf-8",
+  ".js": "application/javascript; charset=utf-8",
+  ".mjs": "application/javascript; charset=utf-8",
+  ".css": "text/css; charset=utf-8",
+  ".json": "application/json; charset=utf-8",
+  ".obj": "text/plain; charset=utf-8",
+  ".mtl": "text/plain; charset=utf-8",
+  ".png": "image/png",
+  ".jpg": "image/jpeg",
+  ".jpeg": "image/jpeg",
+  ".gltf": "application/json; charset=utf-8",
+  ".glb": "model/gltf-binary",
+  ".vox": "application/octet-stream",
+};
+
+const TRACE_CATEGORIES = [
+  "devtools.timeline",
+  "disabled-by-default-devtools.timeline",
+  "blink",
+  "cc",
+  "disabled-by-default-cc.debug",
+  "gpu",
+  "viz",
+  "disabled-by-default-viz.debug",
+  "renderer.scheduler",
+].join(",");
+
+function startServer() {
+  return new Promise((resolveStart, rejectStart) => {
+    const server = createServer(async (req, res) => {
+      try {
+        const u = new URL(req.url, "http://localhost");
+        const safe = u.pathname.replace(/\/+/g, "/");
+        if (safe.includes("..")) {
+          res.writeHead(403);
+          res.end();
+          return;
+        }
+        const abs = safe === "/" || safe === ""
+          ? resolve(benchDir, "perf.html")
+          : safe.startsWith("/gallery/")
+            ? resolve(galleryDir, safe.slice("/gallery/".length))
+            : resolve(benchDir, safe.slice(1));
+        const data = await readFile(abs);
+        res.writeHead(200, {
+          "Content-Type": MIME[extname(abs).toLowerCase()] || "application/octet-stream",
+          "Cache-Control": "no-store",
+        });
+        res.end(data);
+      } catch (err) {
+        res.writeHead(404);
+        res.end(String(err?.message ?? err));
+      }
+    });
+    server.on("error", rejectStart);
+    server.listen(0, "127.0.0.1", () => {
+      const addr = server.address();
+      resolveStart({ server, port: typeof addr === "object" ? addr.port : 0 });
+    });
+  });
+}
+
+function stopServer(server) {
+  return new Promise((resolveStop) => server.close(resolveStop));
+}
+
+function collectArgShape(value, depth = 0) {
+  if (value == null || depth > 2) return value;
+  if (typeof value !== "object") return typeof value;
+  if (Array.isArray(value)) return [`array(${value.length})`, collectArgShape(value[0], depth + 1)];
+  return Object.fromEntries(Object.entries(value).slice(0, 12).map(([key, item]) => [
+    key,
+    collectArgShape(item, depth + 1),
+  ]));
+}
+
+const { server, port } = await startServer();
+const browser = await chromium.launch({
+  headless: !HEADED,
+  args: [
+    "--disable-background-timer-throttling",
+    "--disable-renderer-backgrounding",
+    "--disable-backgrounding-occluded-windows",
+    ...CHROMIUM_ARGS,
+  ],
+});
+
+try {
+  const ctx = await browser.newContext({ viewport: { width: 1280, height: 800 } });
+  const page = await ctx.newPage();
+  const cdp = await ctx.newCDPSession(page);
+  const events = [];
+  cdp.on("Tracing.dataCollected", (payload) => {
+    if (Array.isArray(payload.value)) events.push(...payload.value);
+  });
+  const url = `http://127.0.0.1:${port}/perf-${RENDERER}.html?mesh=${encodeURIComponent(MESH)}&mode=${encodeURIComponent(MODE)}&motion=${encodeURIComponent(MOTION)}`;
+  await page.goto(url, { waitUntil: "load" });
+  await page.waitForFunction(() => window.__perf__?.ready === true, null, { timeout: 30000 });
+  await page.waitForTimeout(WARMUP_MS);
+  await cdp.send("Tracing.start", {
+    transferMode: "ReportEvents",
+    categories: TRACE_CATEGORIES,
+  });
+  await page.waitForTimeout(SAMPLE_MS);
+  await new Promise(async (resolveStop) => {
+    cdp.once("Tracing.tracingComplete", resolveStop);
+    await cdp.send("Tracing.end");
+  });
+  for (const eventName of EVENT_NAMES) {
+    const matches = events.filter((event) => event.name === eventName);
+    console.log(`\n## ${eventName} (${matches.length})`);
+    const samples = matches.slice(0, 8).map((event) => ({
+      ph: event.ph,
+      dur_us: event.dur,
+      cat: event.cat,
+      argsShape: collectArgShape(event.args),
+      args: event.args,
+    }));
+    console.dir(samples, { depth: 8, colors: false, maxArrayLength: 20 });
+  }
+  await ctx.close();
+} finally {
+  await browser.close();
+  await stopServer(server);
+}
diff --git a/bench/trace-frame-buckets.mjs b/bench/trace-frame-buckets.mjs
new file mode 100644
index 00000000..f41650b5
--- /dev/null
+++ b/bench/trace-frame-buckets.mjs
@@ -0,0 +1,538 @@
+#!/usr/bin/env node
+import { createServer } from "node:http";
+import { mkdirSync, writeFileSync } from "node:fs";
+import { readFile } from "node:fs/promises";
+import { dirname, extname, resolve } from "node:path";
+import { fileURLToPath } from "node:url";
+import { chromium } from "playwright";
+import { chromiumArgsWithGpuDefault } from "./chromium-defaults.mjs";
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const repoRoot = resolve(__dirname, "..");
+const benchDir = resolve(repoRoot, "bench");
+const galleryDir = resolve(repoRoot, "website/public/gallery");
+
+const argv = process.argv.slice(2);
+const flag = (name) => argv.indexOf(`--${name}`);
+const optStr = (name, dflt = "") => {
+  const i = flag(name);
+  return i >= 0 ? argv[i + 1] : dflt;
+};
+const optAll = (name) => {
+  const values = [];
+  for (let i = 0; i < argv.length; i += 1) {
+    const arg = argv[i];
+    if (arg === `--${name}` && argv[i + 1]) {
+      values.push(argv[i + 1]);
+      i += 1;
+    } else if (arg.startsWith(`--${name}=`)) {
+      values.push(arg.slice(name.length + 3));
+    }
+  }
+  return values;
+};
+const optNum = (name, dflt) => {
+  const v = optStr(name);
+  return v ? Number(v) : dflt;
+};
+const hasFlag = (name) => flag(name) >= 0;
+
+const MESH = optStr("mesh", "garden");
+const MODE = optStr("mode", "baked");
+const MOTION = optStr("motion", "rot");
+const RENDERER = optStr("renderer", "vanilla");
+const WARMUP_MS = optNum("warmup", 1500);
+const SAMPLE_MS = optNum("sample", 6000);
+const RUNS = optNum("runs", 1);
+const LABEL = optStr("label");
+const HEADED = hasFlag("headed");
+const JSON_ONLY = hasFlag("json");
+const DOM_SAMPLES = hasFlag("dom-samples");
+const BROWSER_EXECUTABLE = optStr("browser-executable");
+const SOFTWARE_BACKEND = hasFlag("software-backend");
+const CHROMIUM_ARGS = chromiumArgsWithGpuDefault([
+  ...optAll("chromium-arg"),
+  ...optAll("chromium-args").flatMap((value) => value.split(/\s+/).filter(Boolean)),
+], { softwareBackend: SOFTWARE_BACKEND });
+
+const MIME = {
+  ".html": "text/html; charset=utf-8",
+  ".js": "application/javascript; charset=utf-8",
+  ".mjs": "application/javascript; charset=utf-8",
+  ".css": "text/css; charset=utf-8",
+  ".json": "application/json; charset=utf-8",
+  ".obj": "text/plain; charset=utf-8",
+  ".mtl": "text/plain; charset=utf-8",
+  ".png": "image/png",
+  ".jpg": "image/jpeg",
+  ".jpeg": "image/jpeg",
+  ".gltf": "application/json; charset=utf-8",
+  ".glb": "model/gltf-binary",
+  ".vox": "application/octet-stream",
+};
+
+const TRACE_CATEGORIES = [
+  "devtools.timeline",
+  "disabled-by-default-devtools.timeline",
+  "blink",
+  "blink.user_timing",
+  "cc",
+  "gpu",
+  "viz",
+  "renderer.scheduler",
+].join(",");
+
+const EVENT_GROUPS = {
+  style: ["UpdateLayoutTree", "RecalculateStyles"],
+  layout: ["Layout"],
+  prePaint: ["PrePaint"],
+  paint: ["Paint"],
+  raster: ["RasterTask", "ImageDecodeTask", "Decode Image"],
+  script: ["FunctionCall", "EvaluateScript", "EventDispatch", "TimerFire", "FireAnimationFrame"],
+  compositorMain: [
+    "ProxyMain::BeginMainFrame",
+    "WebFrameWidgetImpl::UpdateLifecycle",
+    "PaintArtifactCompositor::Update",
+    "Layerize",
+    "Commit",
+    "ProxyImpl::ReadyToCommit",
+  ],
+  compositorImpl: [
+    "LayerTreeImpl::UpdateDrawProperties",
+    "LayerTreeImpl::UpdateDrawProperties::CalculateDrawProperties",
+    "draw_property_utils::ComputeDrawPropertiesOfVisibleLayers",
+    "LayerTreeHostImpl::PrepareToDraw",
+    "MainFrame.Draw",
+    "SubmitCompositorFrame",
+  ],
+};
+
+const KEY_EVENTS = [
+  "FireAnimationFrame",
+  "FunctionCall",
+  "UpdateLayoutTree",
+  "PrePaint",
+  "PaintArtifactCompositor::Update",
+  "Layerize",
+  "LayerTreeImpl::UpdateDrawProperties",
+  "LayerTreeImpl::UpdateDrawProperties::CalculateDrawProperties",
+  "draw_property_utils::ComputeDrawPropertiesOfVisibleLayers",
+  "LayerTreeHostImpl::PrepareToDraw",
+  "MainFrame.Draw",
+  "SubmitCompositorFrame",
+  "Graphics.Pipeline",
+  "DisplayScheduler::DrawAndSwap",
+  "DirectRenderer::DrawFrame",
+  "DirectRenderer::DrawRenderPass",
+  "SoftwareRenderer::DoDrawQuad",
+  "RunTask",
+  "RasterTask",
+];
+
+function startServer() {
+  return new Promise((resolveStart, rejectStart) => {
+    const server = createServer(async (req, res) => {
+      try {
+        const u = new URL(req.url, "http://localhost");
+        const safe = u.pathname.replace(/\/+/g, "/");
+        if (safe.includes("..")) {
+          res.writeHead(403);
+          res.end();
+          return;
+        }
+        const abs = safe === "/" || safe === ""
+          ? resolve(benchDir, "perf.html")
+          : safe.startsWith("/gallery/")
+            ? resolve(galleryDir, safe.slice("/gallery/".length))
+            : resolve(benchDir, safe.slice(1));
+        const data = await readFile(abs);
+        res.writeHead(200, {
+          "Content-Type": MIME[extname(abs).toLowerCase()] || "application/octet-stream",
+          "Cache-Control": "no-store",
+        });
+        res.end(data);
+      } catch (err) {
+        res.writeHead(404);
+        res.end(String(err?.message ?? err));
+      }
+    });
+    server.on("error", rejectStart);
+    server.listen(0, "127.0.0.1", () => {
+      const addr = server.address();
+      resolveStart({ server, port: typeof addr === "object" ? addr.port : 0 });
+    });
+  });
+}
+
+function stopServer(server) {
+  return new Promise((resolveStop) => server.close(resolveStop));
+}
+
+function quantile(values, q) {
+  const sorted = values.filter(Number.isFinite).sort((a, b) => a - b);
+  if (sorted.length === 0) return null;
+  const i = (sorted.length - 1) * q;
+  const lo = Math.floor(i);
+  const hi = Math.ceil(i);
+  if (lo === hi) return sorted[lo];
+  return sorted[lo] + (sorted[hi] - sorted[lo]) * (i - lo);
+}
+
+function median(values) {
+  return quantile(values, 0.5);
+}
+
+function fmt(value, digits = 2) {
+  return Number.isFinite(value) ? Number(value).toFixed(digits) : "";
+}
+
+function bucketName(dt, baseFrameMs) {
+  const ratio = Math.max(1, Math.round(dt / baseFrameMs));
+  return ratio >= 4 ? "x4_plus" : `x${ratio}`;
+}
+
+function estimateBaseFrameMs(dts) {
+  const p10 = quantile(dts, 0.1) ?? 16.667;
+  return p10 < 12 ? 8.333 : 16.667;
+}
+
+function summarizeFrameTimes(frames) {
+  const dts = frames.map((frame) => frame.dt);
+  const p50 = median(dts) ?? 0;
+  const p95 = quantile(dts, 0.95) ?? 0;
+  const p99 = quantile(dts, 0.99) ?? 0;
+  return {
+    count: frames.length,
+    fps_p50: p50 > 0 ? +(1000 / p50).toFixed(2) : 0,
+    fps_p95: p95 > 0 ? +(1000 / p95).toFixed(2) : 0,
+    frame_time_p50_ms: +p50.toFixed(3),
+    frame_time_p95_ms: +p95.toFixed(3),
+    frame_time_p99_ms: +p99.toFixed(3),
+  };
+}
+
+function findTraceMark(events, name) {
+  return events.find((event) => event?.name === name && Number.isFinite(event?.args?.data?.startTime)) ??
+    events.find((event) => event?.name === "TimeStamp" && event?.args?.data?.message === name);
+}
+
+function makeFrames(samples, startPerfNow, endPerfNow) {
+  const raw = samples
+    .filter((sample) => Number.isFinite(sample?.dt) && sample.dt > 0 && sample.dt < 2000)
+    .filter((sample) => sample.t - sample.dt >= startPerfNow && sample.t <= endPerfNow)
+    .map((sample, index) => ({
+      index,
+      start: sample.t - sample.dt,
+      end: sample.t,
+      dt: sample.dt,
+    }));
+  const baseFrameMs = estimateBaseFrameMs(raw.map((frame) => frame.dt));
+  for (const frame of raw) frame.bucket = bucketName(frame.dt, baseFrameMs);
+  return { frames: raw, baseFrameMs };
+}
+
+function attachDomSamples(frames, domSamples) {
+  if (!Array.isArray(domSamples) || domSamples.length === 0) return;
+  let sampleIndex = 0;
+  for (const frame of frames) {
+    while (sampleIndex + 1 < domSamples.length && domSamples[sampleIndex + 1].t <= frame.end) {
+      sampleIndex += 1;
+    }
+    const sample = domSamples[sampleIndex];
+    if (sample && sample.t >= frame.start - 1 && sample.t <= frame.end + 1) {
+      frame.leaves = sample.leaves;
+    }
+  }
+}
+
+function frameIndexAt(frames, perfNow) {
+  let lo = 0;
+  let hi = frames.length - 1;
+  while (lo <= hi) {
+    const mid = (lo + hi) >> 1;
+    const frame = frames[mid];
+    if (perfNow < frame.start) hi = mid - 1;
+    else if (perfNow > frame.end) lo = mid + 1;
+    else return mid;
+  }
+  return -1;
+}
+
+function emptyBucket(bucket) {
+  return {
+    bucket,
+    frameCount: 0,
+    frame_time_p50_ms: null,
+    frame_time_p95_ms: null,
+    leaves_p50: null,
+    leaves_p95: null,
+    groups_ms_per_frame: {},
+    events_ms_per_frame: {},
+    topEvents: [],
+  };
+}
+
+function addDuration(map, name, durationMs) {
+  const entry = map.get(name) ?? { count: 0, duration_ms: 0 };
+  entry.count += 1;
+  entry.duration_ms += durationMs;
+  map.set(name, entry);
+}
+
+function summarizeBuckets(events, frames, tracePerfOffsetMs) {
+  const buckets = new Map();
+  for (const frame of frames) {
+    const bucket = buckets.get(frame.bucket) ?? {
+      ...emptyBucket(frame.bucket),
+      frameDts: [],
+      leaves: [],
+      eventTotals: new Map(),
+      groupTotals: new Map(),
+    };
+    bucket.frameCount += 1;
+    bucket.frameDts.push(frame.dt);
+    if (Number.isFinite(frame.leaves)) bucket.leaves.push(frame.leaves);
+    buckets.set(frame.bucket, bucket);
+  }
+
+  const groupByEvent = new Map();
+  for (const [group, names] of Object.entries(EVENT_GROUPS)) {
+    for (const name of names) groupByEvent.set(name, group);
+  }
+
+  for (const event of events) {
+    if (event?.ph !== "X" || typeof event.dur !== "number" || !Number.isFinite(event.ts)) continue;
+    const durationMs = event.dur / 1000;
+    const midpointPerfNow = ((event.ts + event.dur / 2) / 1000) - tracePerfOffsetMs;
+    const index = frameIndexAt(frames, midpointPerfNow);
+    if (index < 0) continue;
+    const bucket = buckets.get(frames[index].bucket);
+    if (!bucket) continue;
+    addDuration(bucket.eventTotals, event.name, durationMs);
+    const group = groupByEvent.get(event.name);
+    if (group) addDuration(bucket.groupTotals, group, durationMs);
+  }
+
+  return ["x1", "x2", "x3", "x4_plus"]
+    .map((name) => {
+      const bucket = buckets.get(name);
+      if (!bucket) return emptyBucket(name);
+      const frameCount = bucket.frameCount || 1;
+      const events_ms_per_frame = {};
+      for (const event of KEY_EVENTS) {
+        events_ms_per_frame[event] = +((bucket.eventTotals.get(event)?.duration_ms ?? 0) / frameCount).toFixed(4);
+      }
+      const groups_ms_per_frame = {};
+      for (const group of Object.keys(EVENT_GROUPS)) {
+        groups_ms_per_frame[group] = +((bucket.groupTotals.get(group)?.duration_ms ?? 0) / frameCount).toFixed(4);
+      }
+      const topEvents = [...bucket.eventTotals.entries()]
+        .map(([event, total]) => ({
+          event,
+          count: total.count,
+          ms_per_frame: +(total.duration_ms / frameCount).toFixed(4),
+        }))
+        .sort((a, b) => b.ms_per_frame - a.ms_per_frame)
+        .slice(0, 12);
+      return {
+        bucket: name,
+        frameCount: bucket.frameCount,
+        frame_time_p50_ms: +(median(bucket.frameDts) ?? 0).toFixed(3),
+        frame_time_p95_ms: +(quantile(bucket.frameDts, 0.95) ?? 0).toFixed(3),
+        leaves_p50: bucket.leaves.length ? +(median(bucket.leaves) ?? 0).toFixed(0) : null,
+        leaves_p95: bucket.leaves.length ? +(quantile(bucket.leaves, 0.95) ?? 0).toFixed(0) : null,
+        groups_ms_per_frame,
+        events_ms_per_frame,
+        topEvents,
+      };
+    });
+}
+
+function aggregateEventTotals(events, tracePerfOffsetMs, startPerfNow, endPerfNow) {
+  const totals = new Map();
+  for (const event of events) {
+    if (event?.ph !== "X" || typeof event.dur !== "number" || !Number.isFinite(event.ts)) continue;
+    const midpointPerfNow = ((event.ts + event.dur / 2) / 1000) - tracePerfOffsetMs;
+    if (midpointPerfNow < startPerfNow || midpointPerfNow > endPerfNow) continue;
+    addDuration(totals, event.name, event.dur / 1000);
+  }
+  return [...totals.entries()]
+    .map(([event, total]) => ({ event, count: total.count, duration_ms: +total.duration_ms.toFixed(3) }))
+    .sort((a, b) => b.duration_ms - a.duration_ms)
+    .slice(0, 40);
+}
+
+async function startTrace(cdp) {
+  const events = [];
+  cdp.on("Tracing.dataCollected", (payload) => {
+    if (Array.isArray(payload.value)) events.push(...payload.value);
+  });
+  await cdp.send("Performance.enable");
+  await cdp.send("Tracing.start", {
+    transferMode: "ReportEvents",
+    categories: TRACE_CATEGORIES,
+  });
+  return events;
+}
+
+async function stopTrace(cdp) {
+  await new Promise(async (resolveStop) => {
+    cdp.once("Tracing.tracingComplete", resolveStop);
+    await cdp.send("Tracing.end");
+  });
+}
+
+async function runOnce(port, repeat) {
+  const launchOptions = { headless: !HEADED, args: CHROMIUM_ARGS };
+  if (BROWSER_EXECUTABLE) launchOptions.executablePath = BROWSER_EXECUTABLE;
+  const browser = await chromium.launch(launchOptions);
+  try {
+    const ctx = await browser.newContext({ viewport: { width: 1280, height: 800 } });
+    const page = await ctx.newPage();
+    const cdp = await ctx.newCDPSession(page);
+    const url = `http://127.0.0.1:${port}/perf-${RENDERER}.html?mesh=${encodeURIComponent(MESH)}&mode=${encodeURIComponent(MODE)}&motion=${encodeURIComponent(MOTION)}`;
+    await page.goto(url, { waitUntil: "load" });
+    await page.waitForFunction(() => window.__perf__?.ready === true, null, { timeout: 30000 });
+    await page.waitForTimeout(WARMUP_MS);
+
+    const events = await startTrace(cdp);
+    const startIdx = await page.evaluate(() => window.__perf__.samples.length);
+    if (DOM_SAMPLES) {
+      await page.evaluate(() => {
+        window.__polycssDomSamples = [];
+        window.__polycssDomSampling = true;
+        const tick = (now) => {
+          const mesh = document.querySelector(".polycss-voxel-mesh");
+          window.__polycssDomSamples.push({
+            t: now,
+            leaves: mesh?.childElementCount ?? 0,
+          });
+          if (window.__polycssDomSampling) requestAnimationFrame(tick);
+        };
+        requestAnimationFrame(tick);
+      });
+    }
+    await page.evaluate(() => {
+      performance.mark("__polycss_frame_bucket_start__");
+      console.timeStamp("__polycss_frame_bucket_start__");
+    });
+    await page.waitForTimeout(SAMPLE_MS);
+    await page.evaluate(() => {
+      performance.mark("__polycss_frame_bucket_end__");
+      console.timeStamp("__polycss_frame_bucket_end__");
+      window.__polycssDomSampling = false;
+    });
+    await stopTrace(cdp);
+
+    const pageResult = await page.evaluate((from) => ({
+      samples: window.__perf__.samples.slice(from),
+      polyCount: window.__perf__.polyCount,
+      renderStats: window.__perf__.renderStats ?? null,
+      domSamples: window.__polycssDomSamples ?? null,
+    }), startIdx);
+    await ctx.close();
+
+    const startMark = findTraceMark(events, "__polycss_frame_bucket_start__");
+    const endMark = findTraceMark(events, "__polycss_frame_bucket_end__");
+    if (!startMark?.args?.data?.startTime || !endMark?.args?.data?.startTime) {
+      throw new Error("Trace markers were not captured; cannot align trace to rAF samples.");
+    }
+    const tracePerfOffsetMs = (startMark.ts / 1000) - startMark.args.data.startTime;
+    const startPerfNow = startMark.args.data.startTime;
+    const endPerfNow = endMark.args.data.startTime;
+    const { frames, baseFrameMs } = makeFrames(pageResult.samples, startPerfNow, endPerfNow);
+    attachDomSamples(frames, pageResult.domSamples);
+    const frameStats = summarizeFrameTimes(frames);
+    const buckets = summarizeBuckets(events, frames, tracePerfOffsetMs);
+    const eventTotals = aggregateEventTotals(events, tracePerfOffsetMs, startPerfNow, endPerfNow);
+
+    return {
+      repeat,
+      mesh: MESH,
+      renderer: RENDERER,
+      mode: MODE,
+      motion: MOTION,
+      warmup_ms: WARMUP_MS,
+      sample_ms: SAMPLE_MS,
+      baseFrameMs: +baseFrameMs.toFixed(3),
+      ...frameStats,
+      polyCount: pageResult.polyCount,
+      renderStats: pageResult.renderStats,
+      domSamples: DOM_SAMPLES ? pageResult.domSamples : undefined,
+      buckets,
+      eventTotals,
+    };
+  } finally {
+    await browser.close();
+  }
+}
+
+function printRun(run) {
+  const bucketText = run.buckets
+    .filter((bucket) => bucket.frameCount > 0)
+    .map((bucket) => `${bucket.bucket}:${bucket.frameCount}`)
+    .join(" ");
+  console.log(
+    `[trace-buckets] ${run.mesh} r${run.repeat} p50=${fmt(run.fps_p50, 1)} p95=${fmt(run.fps_p95, 1)} p99=${fmt(run.frame_time_p99_ms, 1)}ms base=${fmt(run.baseFrameMs, 3)}ms ${bucketText}`,
+  );
+  console.log("| Bucket | Frames | Leaves p50 | dt p50 | dt p95 | style | prePaint | PAC | layerize | drawProps | visible | prepareDraw | draw | raster | script |");
+  console.log("| --- | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: |");
+  for (const bucket of run.buckets) {
+    if (bucket.frameCount === 0) continue;
+    const e = bucket.events_ms_per_frame;
+    const g = bucket.groups_ms_per_frame;
+    console.log([
+      `| ${bucket.bucket}`,
+      bucket.frameCount,
+      fmt(bucket.leaves_p50, 0),
+      fmt(bucket.frame_time_p50_ms),
+      fmt(bucket.frame_time_p95_ms),
+      fmt(g.style, 4),
+      fmt(g.prePaint, 4),
+      fmt(e["PaintArtifactCompositor::Update"], 4),
+      fmt(e.Layerize, 4),
+      fmt(e["LayerTreeImpl::UpdateDrawProperties"], 4),
+      fmt(e["draw_property_utils::ComputeDrawPropertiesOfVisibleLayers"], 4),
+      fmt(e["LayerTreeHostImpl::PrepareToDraw"], 4),
+      fmt(e["MainFrame.Draw"], 4),
+      fmt(g.raster, 4),
+      `${fmt(g.script, 4)} |`,
+    ].join(" | "));
+  }
+}
+
+const { server, port } = await startServer();
+try {
+  if (!JSON_ONLY) {
+    console.log(`[trace-buckets] server :${port}`);
+    console.log(`[trace-buckets] mesh=${MESH} renderer=${RENDERER} mode=${MODE} motion=${MOTION} runs=${RUNS} warmup=${WARMUP_MS}ms sample=${SAMPLE_MS}ms`);
+  }
+  const runs = [];
+  for (let repeat = 1; repeat <= RUNS; repeat += 1) {
+    const run = await runOnce(port, repeat);
+    runs.push(run);
+    if (!JSON_ONLY) printRun(run);
+  }
+  const out = {
+    mesh: MESH,
+    renderer: RENDERER,
+    mode: MODE,
+    motion: MOTION,
+    browserExecutable: BROWSER_EXECUTABLE || null,
+    chromiumArgs: CHROMIUM_ARGS,
+    softwareBackend: SOFTWARE_BACKEND,
+    warmup_ms: WARMUP_MS,
+    sample_ms: SAMPLE_MS,
+    runs,
+  };
+  if (LABEL) {
+    const dir = resolve(repoRoot, "bench/results");
+    mkdirSync(dir, { recursive: true });
+    const file = resolve(dir, `${LABEL}.json`);
+    writeFileSync(file, JSON.stringify(out, null, 2) + "\n");
+    if (!JSON_ONLY) console.log(`[trace-buckets] wrote ${file}`);
+  }
+  if (JSON_ONLY) console.log(JSON.stringify(out, null, 2));
+} finally {
+  await stopServer(server);
+}
diff --git a/bench/voxel-depth-quantization-error.mjs b/bench/voxel-depth-quantization-error.mjs
new file mode 100644
index 00000000..0e954373
--- /dev/null
+++ b/bench/voxel-depth-quantization-error.mjs
@@ -0,0 +1,290 @@
+#!/usr/bin/env node
+import { mkdir, readFile, writeFile } from "node:fs/promises";
+import { basename, resolve } from "node:path";
+import {
+  BASE_TILE,
+  normalFacesCamera,
+  parseVox,
+  rotateVec3,
+} from "../packages/core/dist/index.js";
+
+const repoRoot = resolve(import.meta.dirname, "..");
+const galleryVoxDir = resolve(repoRoot, "website/public/gallery/vox");
+const resultDir = resolve(repoRoot, "bench/results");
+
+const FACE_NORMALS = {
+  t: [0, 0, 1],
+  b: [0, 0, -1],
+  fl: [0, 1, 0],
+  br: [0, -1, 0],
+  fr: [1, 0, 0],
+  bl: [-1, 0, 0],
+};
+
+const FACE_BY_NORMAL = new Map([
+  ["0,0,1", "t"],
+  ["0,0,-1", "b"],
+  ["0,1,0", "fl"],
+  ["0,-1,0", "br"],
+  ["1,0,0", "fr"],
+  ["-1,0,0", "bl"],
+]);
+
+const DEFAULT_MODELS = [
+  "AncientCrashSite.vox",
+  "desert2.vox",
+  "Treasure.vox",
+  "obj_house3.vox",
+  "scene_mechanic2.vox",
+  "scene_house.vox",
+  "scene_sidewalk.vox",
+];
+
+const args = parseArgs(process.argv.slice(2));
+const models = args.models.length ? args.models : DEFAULT_MODELS;
+const bucketCounts = args.buckets.length ? args.buckets : [2, 4, 8, 12, 16];
+const rotation = {
+  rotX: Number(args.rotX ?? 65),
+  rotY: Number(args.rotY ?? 45),
+};
+const targetSize = Number(args.targetSize ?? 70);
+const outPath = args.out ?? resolve(resultDir, "a150-depth-quantization-error.md");
+const jsonPath = args.json ?? resolve(resultDir, "a150-depth-quantization-error.json");
+
+function parseArgs(argv) {
+  const parsed = {
+    buckets: [],
+    models: [],
+  };
+  for (const arg of argv) {
+    if (arg.startsWith("--buckets=")) {
+      parsed.buckets = arg.slice("--buckets=".length).split(",").map(Number).filter(Number.isFinite);
+    } else if (arg.startsWith("--models=")) {
+      parsed.models = arg.slice("--models=".length).split(",").filter(Boolean);
+    } else if (arg.startsWith("--rotX=")) {
+      parsed.rotX = arg.slice("--rotX=".length);
+    } else if (arg.startsWith("--rotY=")) {
+      parsed.rotY = arg.slice("--rotY=".length);
+    } else if (arg.startsWith("--targetSize=")) {
+      parsed.targetSize = arg.slice("--targetSize=".length);
+    } else if (arg.startsWith("--out=")) {
+      parsed.out = resolve(arg.slice("--out=".length));
+    } else if (arg.startsWith("--json=")) {
+      parsed.json = resolve(arg.slice("--json=".length));
+    } else if (!arg.startsWith("--")) {
+      parsed.models.push(arg);
+    }
+  }
+  return parsed;
+}
+
+function cssNormalForPolygon(polygon) {
+  const vertices = polygon.vertices;
+  if (vertices.length < 3) return null;
+  const v0 = vertices[0];
+  let nx = 0;
+  let ny = 0;
+  let nz = 0;
+  for (let i = 1; i + 1 < vertices.length; i += 1) {
+    const v1 = vertices[i];
+    const v2 = vertices[i + 1];
+    const e1x = v1[1] - v0[1];
+    const e1y = v1[0] - v0[0];
+    const e1z = v1[2] - v0[2];
+    const e2x = v2[1] - v0[1];
+    const e2y = v2[0] - v0[0];
+    const e2z = v2[2] - v0[2];
+    nx -= e1y * e2z - e1z * e2y;
+    ny -= e1z * e2x - e1x * e2z;
+    nz -= e1x * e2y - e1y * e2x;
+  }
+  const len = Math.hypot(nx, ny, nz);
+  if (len <= 1e-9) return null;
+  return [
+    Math.round(nx / len),
+    Math.round(ny / len),
+    Math.round(nz / len),
+  ];
+}
+
+function polygonItem(polygon, sourceIndex) {
+  if (polygon.vertices.length !== 4) return null;
+  const normal = cssNormalForPolygon(polygon);
+  const face = normal ? FACE_BY_NORMAL.get(normal.join(",")) : undefined;
+  if (!face) return null;
+
+  let minX = Infinity;
+  let minY = Infinity;
+  let minZ = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  let maxZ = -Infinity;
+  for (const v of polygon.vertices) {
+    minX = Math.min(minX, v[0]);
+    minY = Math.min(minY, v[1]);
+    minZ = Math.min(minZ, v[2]);
+    maxX = Math.max(maxX, v[0]);
+    maxY = Math.max(maxY, v[1]);
+    maxZ = Math.max(maxZ, v[2]);
+  }
+
+  const base = { face, sourceIndex };
+  const eps = 1e-6;
+  if (Math.abs(maxZ - minZ) <= eps) {
+    return {
+      ...base,
+      axis: "z",
+      left: minY * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: minZ * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxX - minX) <= eps) {
+    return {
+      ...base,
+      axis: "x",
+      left: minY * BASE_TILE,
+      top: minZ * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      z: -minX * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxY - minY) <= eps) {
+    return {
+      ...base,
+      axis: "y",
+      left: minZ * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: -minY * BASE_TILE,
+    };
+  }
+  return null;
+}
+
+function itemCenter(item) {
+  if (item.axis === "x") return [item.left + item.width / 2, -item.z, item.top + item.height / 2];
+  if (item.axis === "y") return [-item.z, item.top + item.height / 2, item.left + item.width / 2];
+  return [item.left + item.width / 2, item.top + item.height / 2, item.z];
+}
+
+function project(point) {
+  const [x, y] = rotateVec3(point, rotation.rotX, 0, rotation.rotY);
+  return { x, y };
+}
+
+function quantile(values, q) {
+  const sorted = [...values].sort((a, b) => a - b);
+  if (sorted.length === 0) return 0;
+  const i = (sorted.length - 1) * q;
+  const lo = Math.floor(i);
+  const hi = Math.ceil(i);
+  if (lo === hi) return sorted[lo];
+  return sorted[lo] + (sorted[hi] - sorted[lo]) * (i - lo);
+}
+
+function quantizedZ(item, axisStats, bucketCount) {
+  if (bucketCount <= 1) return axisStats.min;
+  const span = axisStats.max - axisStats.min;
+  if (Math.abs(span) <= 1e-9) return axisStats.min;
+  const unit = span / bucketCount;
+  const bucket = Math.max(0, Math.min(bucketCount - 1, Math.floor((item.z - axisStats.min) / unit)));
+  return axisStats.min + (bucket + 0.5) * unit;
+}
+
+function errorForBuckets(items, bucketCount) {
+  const statsByAxis = new Map();
+  for (const axis of ["x", "y", "z"]) {
+    const axisItems = items.filter((item) => item.axis === axis);
+    statsByAxis.set(axis, {
+      min: Math.min(...axisItems.map((item) => item.z)),
+      max: Math.max(...axisItems.map((item) => item.z)),
+    });
+  }
+
+  const errors = items.map((item) => {
+    const exact = project(itemCenter(item));
+    const q = project(itemCenter({ ...item, z: quantizedZ(item, statsByAxis.get(item.axis), bucketCount) }));
+    return Math.hypot(exact.x - q.x, exact.y - q.y);
+  });
+
+  return {
+    bucketCount,
+    wrappers: bucketCount * 3,
+    p50: quantile(errors, 0.5),
+    p95: quantile(errors, 0.95),
+    max: Math.max(...errors),
+  };
+}
+
+async function analyzeModel(model) {
+  const file = model.endsWith(".vox") ? model : `${model}.vox`;
+  const path = resolve(galleryVoxDir, file);
+  const bytes = await readFile(path);
+  const parsed = parseVox(
+    bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength),
+    { targetSize, gridShift: 0 },
+  );
+  const items = parsed.polygons
+    .map((polygon, sourceIndex) => polygonItem(polygon, sourceIndex))
+    .filter(Boolean)
+    .filter((item) => item.width > 0 && item.height > 0);
+  const visibleFaces = new Set(
+    Object.entries(FACE_NORMALS)
+      .filter(([, normal]) => normalFacesCamera(normal, rotation))
+      .map(([face]) => face),
+  );
+  const active = items.filter((item) => visibleFaces.has(item.face));
+  const exactPlanes = new Set(active.map((item) => `${item.axis}:${item.z.toFixed(3)}`));
+  return {
+    model: file,
+    active: active.length,
+    exactPlanes: exactPlanes.size,
+    rows: bucketCounts.map((bucketCount) => errorForBuckets(active, bucketCount)),
+  };
+}
+
+function fmt(value) {
+  return value.toFixed(1);
+}
+
+const results = [];
+for (const model of models) {
+  results.push(await analyzeModel(model));
+}
+
+const lines = [
+  "# Depth Quantization Error",
+  "",
+  `Rotation: rotX=${rotation.rotX}, rotY=${rotation.rotY}`,
+  `Target size: ${targetSize}`,
+  "",
+  "| Model | Active | Exact planes | Buckets/axis | Total wrappers | p50 err | p95 err | max err |",
+  "| --- | ---: | ---: | ---: | ---: | ---: | ---: | ---: |",
+];
+
+for (const result of results) {
+  for (const row of result.rows) {
+    lines.push([
+      `| ${basename(result.model, ".vox")}`,
+      result.active,
+      result.exactPlanes,
+      row.bucketCount,
+      row.wrappers,
+      fmt(row.p50),
+      fmt(row.p95),
+      `${fmt(row.max)} |`,
+    ].join(" | "));
+  }
+}
+
+await mkdir(resultDir, { recursive: true });
+await writeFile(outPath, `${lines.join("\n")}\n`);
+await writeFile(jsonPath, `${JSON.stringify({ rotation, targetSize, results }, null, 2)}\n`);
+console.log(lines.join("\n"));
+console.log(`\nWrote ${outPath}`);
+console.log(`Wrote ${jsonPath}`);
diff --git a/bench/voxel-dom-order-probe.mjs b/bench/voxel-dom-order-probe.mjs
new file mode 100644
index 00000000..d7d24732
--- /dev/null
+++ b/bench/voxel-dom-order-probe.mjs
@@ -0,0 +1,996 @@
+#!/usr/bin/env node
+import { readFile, writeFile, mkdir } from "node:fs/promises";
+import { resolve, join } from "node:path";
+import { chromium } from "playwright";
+import {
+  BASE_TILE,
+  normalFacesCamera,
+  parseVox,
+  rotateVec3,
+} from "../packages/core/dist/index.js";
+import { chromiumArgsWithGpuDefault } from "./chromium-defaults.mjs";
+import { PRESETS } from "./perf-shared.mjs";
+
+const repoRoot = resolve(import.meta.dirname, "..");
+const galleryDir = resolve(repoRoot, "website/public");
+const resultDir = resolve(repoRoot, "bench/results");
+
+const args = new Map(process.argv.slice(2).map((arg) => {
+  const [key, ...rest] = arg.replace(/^--/, "").split("=");
+  return [key, rest.length ? rest.join("=") : "true"];
+}));
+
+const MESHES = (args.get("meshes") ?? "obj-house3,ancient-crash-site,scene-mechanic2")
+  .split(",")
+  .map((value) => value.trim())
+  .filter(Boolean);
+const STRATEGIES = (args.get("strategies") ?? "tile4-source,tile4-depth-front,tile4-depth-back,tile4-face,tile4-top-first,tile4-top-last")
+  .split(",")
+  .map((value) => value.trim())
+  .filter(Boolean);
+const PAINTS = (args.get("paints") ?? "current-color")
+  .split(",")
+  .map((value) => value.trim())
+  .filter(Boolean);
+const LEAF_TRANSFORM_STYLES = (args.get("leaf-transform-styles") ?? "preserve-3d")
+  .split(",")
+  .map((value) => value.trim())
+  .filter(Boolean);
+const LEAF_BACKFACES = (args.get("leaf-backfaces") ?? "visible")
+  .split(",")
+  .map((value) => value.trim())
+  .filter(Boolean);
+const TRANSFORM_SHAPES = (args.get("transform-shapes") ?? "matrix-scale")
+  .split(",")
+  .map((value) => value.trim())
+  .filter(Boolean);
+const LEAF_CONTAINS = (args.get("leaf-contains") ?? "none")
+  .split(",")
+  .map((value) => value.trim())
+  .filter(Boolean);
+const OCCLUSIONS = (args.get("occlusions") ?? "none")
+  .split(",")
+  .map((value) => value.trim())
+  .filter(Boolean);
+const OCCLUSION_GRID_W = Number(args.get("occlusion-grid-w") ?? 240);
+const OCCLUSION_GRID_H = Number(args.get("occlusion-grid-h") ?? 160);
+const OCCLUSION_MIN_CELLS = Number(args.get("occlusion-min-cells") ?? 1);
+const OCCLUSION_INTERIOR_RADIUS = Number(args.get("occlusion-interior-radius") ?? 0);
+const OCCLUSION_DEPTH_BUFFER = args.has("occlusion-depth-buffer");
+const OCCLUSION_DEPTH_EPS = Number(args.get("occlusion-depth-eps") ?? 0.01);
+const OCCLUSION_PRESERVE_ORDER = args.has("occlusion-preserve-order");
+const OCCLUSION_INTERVAL_SAMPLES = Math.max(1, Math.floor(Number(args.get("occlusion-interval-samples") ?? 1)));
+const WARMUP_MS = Number(args.get("warmup") ?? 1000);
+const SAMPLE_MS = Number(args.get("sample") ?? 5000);
+const RUNS = Number(args.get("runs") ?? 1);
+const HEADED = args.has("headed");
+const BROWSER_EXECUTABLE = args.get("browser-executable") ?? args.get("browser") ?? "";
+const SOFTWARE_BACKEND = args.has("software-backend");
+const CHROMIUM_ARGS = chromiumArgsWithGpuDefault((args.get("chromium-args") ?? "")
+  .split(/\s+/)
+  .map((value) => value.trim())
+  .filter(Boolean), { softwareBackend: SOFTWARE_BACKEND });
+const LABEL = args.get("label") ?? "";
+const VISUAL_DIFF = args.has("visual-diff");
+const VISUAL_TOLERANCE = Number(args.get("visual-tolerance") ?? 0.005);
+const VISUAL_OFFSETS = (args.get("visual-offsets") ?? "0,45,90,135,180,225,270,315")
+  .split(",")
+  .map((value) => Number(value.trim()))
+  .filter(Number.isFinite);
+const VISUAL_SAVE = args.has("visual-save");
+
+const FACE_NORMALS = {
+  t: [0, 0, 1],
+  b: [0, 0, -1],
+  fl: [0, 1, 0],
+  br: [0, -1, 0],
+  fr: [1, 0, 0],
+  bl: [-1, 0, 0],
+};
+
+const FACE_ORDER = ["t", "b", "bl", "br", "fr", "fl"];
+const FACE_INDEX = Object.fromEntries(FACE_ORDER.map((face, index) => [face, index]));
+const FACE_BY_NORMAL = new Map([
+  ["0,0,1", "t"],
+  ["0,0,-1", "b"],
+  ["0,1,0", "fl"],
+  ["0,-1,0", "br"],
+  ["1,0,0", "fr"],
+  ["-1,0,0", "bl"],
+]);
+
+function quantile(values, q) {
+  const sorted = values.filter(Number.isFinite).sort((a, b) => a - b);
+  if (!sorted.length) return 0;
+  const i = (sorted.length - 1) * q;
+  const lo = Math.floor(i);
+  const hi = Math.ceil(i);
+  if (lo === hi) return sorted[lo];
+  return sorted[lo] + (sorted[hi] - sorted[lo]) * (i - lo);
+}
+
+function median(values) {
+  return quantile(values, 0.5);
+}
+
+function summarizeDts(dts) {
+  const sorted = dts.filter((value) => value > 0 && value < 2000).sort((a, b) => a - b);
+  const p50 = quantile(sorted, 0.5);
+  const p95 = quantile(sorted, 0.95);
+  const p99 = quantile(sorted, 0.99);
+  return {
+    frames: sorted.length,
+    fps_p50: 1000 / p50,
+    fps_p95: 1000 / p95,
+    frame_time_p99_ms: p99,
+    buckets: {
+      x1: sorted.filter((value) => value < 10).length,
+      x2: sorted.filter((value) => value >= 10 && value < 18).length,
+      x3: sorted.filter((value) => value >= 18 && value < 26).length,
+      x4_plus: sorted.filter((value) => value >= 26).length,
+    },
+  };
+}
+
+function visibleFaceSignature(rotation) {
+  const visible = [];
+  for (const face of FACE_ORDER) {
+    if (normalFacesCamera(FACE_NORMALS[face], rotation)) visible.push(face);
+  }
+  return visible.join("|");
+}
+
+function cssNormalForPolygon(polygon) {
+  const vertices = polygon.vertices;
+  if (vertices.length < 3) return null;
+  const v0 = vertices[0];
+  let nx = 0;
+  let ny = 0;
+  let nz = 0;
+  for (let i = 1; i + 1 < vertices.length; i += 1) {
+    const v1 = vertices[i];
+    const v2 = vertices[i + 1];
+    const e1x = v1[1] - v0[1];
+    const e1y = v1[0] - v0[0];
+    const e1z = v1[2] - v0[2];
+    const e2x = v2[1] - v0[1];
+    const e2y = v2[0] - v0[0];
+    const e2z = v2[2] - v0[2];
+    nx -= e1y * e2z - e1z * e2y;
+    ny -= e1z * e2x - e1x * e2z;
+    nz -= e1x * e2y - e1y * e2x;
+  }
+  const len = Math.hypot(nx, ny, nz);
+  if (len <= 1e-9) return null;
+  return [
+    Math.round(nx / len),
+    Math.round(ny / len),
+    Math.round(nz / len),
+  ];
+}
+
+function itemForPolygon(polygon, sourceIndex) {
+  if (polygon.texture || polygon.material || polygon.uvs || polygon.textureTriangles) return null;
+  if (polygon.vertices.length !== 4) return null;
+  const normal = cssNormalForPolygon(polygon);
+  const face = normal ? FACE_BY_NORMAL.get(normal.join(",")) : undefined;
+  if (!face) return null;
+
+  let minX = Infinity;
+  let minY = Infinity;
+  let minZ = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  let maxZ = -Infinity;
+  for (const v of polygon.vertices) {
+    minX = Math.min(minX, v[0]);
+    minY = Math.min(minY, v[1]);
+    minZ = Math.min(minZ, v[2]);
+    maxX = Math.max(maxX, v[0]);
+    maxY = Math.max(maxY, v[1]);
+    maxZ = Math.max(maxZ, v[2]);
+  }
+
+  const eps = 1e-6;
+  const base = { face, sourceIndex, color: polygon.color || "#cccccc" };
+  if (Math.abs(maxZ - minZ) <= eps) {
+    return {
+      ...base,
+      axis: "z",
+      left: minY * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: minZ * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxX - minX) <= eps) {
+    return {
+      ...base,
+      axis: "x",
+      left: minY * BASE_TILE,
+      top: minZ * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      z: -minX * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxY - minY) <= eps) {
+    return {
+      ...base,
+      axis: "y",
+      left: minZ * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: -minY * BASE_TILE,
+    };
+  }
+  return null;
+}
+
+function itemCenter(item) {
+  if (item.axis === "x") return [item.left + item.width / 2, -item.z, item.top + item.height / 2];
+  if (item.axis === "y") return [-item.z, item.top + item.height / 2, item.left + item.width / 2];
+  return [item.left + item.width / 2, item.top + item.height / 2, item.z];
+}
+
+function itemCorners(item) {
+  if (item.axis === "x") {
+    return [
+      [item.left, -item.z, item.top],
+      [item.left + item.width, -item.z, item.top],
+      [item.left + item.width, -item.z, item.top + item.height],
+      [item.left, -item.z, item.top + item.height],
+    ];
+  }
+  if (item.axis === "y") {
+    return [
+      [-item.z, item.top, item.left],
+      [-item.z, item.top, item.left + item.width],
+      [-item.z, item.top + item.height, item.left + item.width],
+      [-item.z, item.top + item.height, item.left],
+    ];
+  }
+  return [
+    [item.left, item.top, item.z],
+    [item.left + item.width, item.top, item.z],
+    [item.left + item.width, item.top + item.height, item.z],
+    [item.left, item.top + item.height, item.z],
+  ];
+}
+
+function projectedCenter(item, rotation) {
+  const [x, y, z] = rotateVec3(itemCenter(item), rotation.rotX, 0, rotation.rotY);
+  return { x, y, z };
+}
+
+function directMatrix(item, transformShape = "matrix-scale") {
+  const { axis, left, top, width, height, z } = item;
+  const sx = transformShape === "css-size-unit-matrix" ? 1 : width;
+  const sy = transformShape === "css-size-unit-matrix" ? 1 : height;
+  const values = axis === "x"
+    ? [
+        sx, 0, 0, 0,
+        0, 0, sy, 0,
+        0, -1, 0, 0,
+        left, -z, top, 1,
+      ]
+    : axis === "y"
+      ? [
+          0, 0, sx, 0,
+          0, sy, 0, 0,
+          -1, 0, 0, 0,
+          -z, top, left, 1,
+        ]
+      : [
+          sx, 0, 0, 0,
+          0, sy, 0, 0,
+          0, 0, 1, 0,
+          left, top, z, 1,
+        ];
+  return `matrix3d(${values.map((value) => Number(value.toFixed(6))).join(",")})`;
+}
+
+function sceneCenter(items) {
+  let minX = Infinity;
+  let minY = Infinity;
+  let minZ = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  let maxZ = -Infinity;
+  for (const item of items) {
+    for (const [x, y, z] of itemCorners(item)) {
+      minX = Math.min(minX, x);
+      minY = Math.min(minY, y);
+      minZ = Math.min(minZ, z);
+      maxX = Math.max(maxX, x);
+      maxY = Math.max(maxY, y);
+      maxZ = Math.max(maxZ, z);
+    }
+  }
+  return {
+    x: (minX + maxX) / 2,
+    y: (minY + maxY) / 2,
+    z: (minZ + maxZ) / 2,
+  };
+}
+
+function orderedItems(items, signature, rotation, strategy) {
+  const faces = new Set(signature.split("|").filter(Boolean));
+  const entries = items
+    .filter((item) => faces.has(item.face))
+    .map((item) => ({ item, ...projectedCenter(item, rotation) }));
+  if (!entries.length) return [];
+
+  const minX = Math.min(...entries.map((entry) => entry.x));
+  const maxX = Math.max(...entries.map((entry) => entry.x));
+  const minY = Math.min(...entries.map((entry) => entry.y));
+  const maxY = Math.max(...entries.map((entry) => entry.y));
+  const spanX = Math.max(1e-6, maxX - minX);
+  const spanY = Math.max(1e-6, maxY - minY);
+  const tiles = new Map();
+  for (const entry of entries) {
+    const tx = Math.min(3, Math.max(0, Math.floor(((entry.x - minX) / spanX) * 4)));
+    const ty = Math.min(3, Math.max(0, Math.floor(((entry.y - minY) / spanY) * 4)));
+    const key = `${tx}:${ty}`;
+    const tile = tiles.get(key) ?? { tx, ty, sourceIndex: entry.item.sourceIndex, entries: [] };
+    tile.entries.push(entry);
+    tile.sourceIndex = Math.min(tile.sourceIndex, entry.item.sourceIndex);
+    tiles.set(key, tile);
+  }
+
+  const tileEntries = [...tiles.values()].sort((a, b) =>
+    (a.ty - b.ty) || (a.tx - b.tx) || a.sourceIndex - b.sourceIndex
+  );
+
+  return tileEntries.flatMap((tile) => {
+    const local = [...tile.entries];
+    if (strategy === "tile4-depth-front") {
+      local.sort((a, b) => b.z - a.z || a.item.sourceIndex - b.item.sourceIndex);
+    } else if (strategy === "tile4-depth-back") {
+      local.sort((a, b) => a.z - b.z || a.item.sourceIndex - b.item.sourceIndex);
+    } else if (strategy === "tile4-face") {
+      local.sort((a, b) => FACE_INDEX[a.item.face] - FACE_INDEX[b.item.face] || a.item.sourceIndex - b.item.sourceIndex);
+    } else if (strategy === "tile4-top-first") {
+      local.sort((a, b) =>
+        Number(a.item.face !== "t") - Number(b.item.face !== "t") ||
+        a.item.sourceIndex - b.item.sourceIndex
+      );
+    } else if (strategy === "tile4-top-last") {
+      local.sort((a, b) =>
+        Number(a.item.face === "t") - Number(b.item.face === "t") ||
+        a.item.sourceIndex - b.item.sourceIndex
+      );
+    }
+    return local.map((entry) => entry.item);
+  });
+}
+
+async function loadItems(meshId) {
+  const preset = PRESETS[meshId];
+  if (!preset) throw new Error(`Unknown preset ${meshId}`);
+  const path = resolve(galleryDir, preset.url.replace(/^\//, ""));
+  const bytes = await readFile(path);
+  const parsed = parseVox(
+    bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength),
+    { targetSize: preset.options?.targetSize ?? 70, gridShift: 0 },
+  );
+  const items = parsed.polygons
+    .map((polygon, sourceIndex) => itemForPolygon(polygon, sourceIndex))
+    .filter((item) => item && item.width > 0 && item.height > 0);
+  if (items.length !== parsed.polygons.length) throw new Error(`${meshId} has non-exact voxel polygons`);
+  return { preset, items };
+}
+
+function buildHtml({ items, preset, strategy, paint, leafTransformStyle, leafBackface, transformShape, leafContain, occlusion, staticRotY = null }) {
+  const center = sceneCenter(items);
+  const itemData = JSON.stringify(items.map((item) => ({
+    ...item,
+    transform: directMatrix(item, transformShape),
+    cssWidth: transformShape === "css-size-unit-matrix" ? item.width : 1,
+    cssHeight: transformShape === "css-size-unit-matrix" ? item.height : 1,
+  })));
+  const backgroundRule = paint === "current-color" ? "background:currentColor;" : "";
+  const containRule = leafContain === "none" ? "" : `contain:${leafContain};`;
+  return `<!doctype html><meta charset="utf-8"><style>
+body{margin:0;background:#111;overflow:hidden}
+#host{position:relative;width:1280px;height:800px;transform-style:preserve-3d}
+.scene{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d;perspective:8000px;will-change:transform}
+.mesh{position:absolute;left:0;top:0;width:0;height:0;transform-style:preserve-3d;transform-origin:var(--origin)}
+b{position:absolute;display:block;top:0;left:0;width:1px;height:1px;${backgroundRule}transform-origin:0 0;transform-style:${leafTransformStyle};${containRule}margin:0;padding:0;font:inherit;font-weight:normal;font-style:normal;line-height:0;text-decoration:none;backface-visibility:${leafBackface};background-repeat:no-repeat;pointer-events:none}
+</style><div id="host"><div class="scene"><div class="mesh"></div></div></div><script>
+const items=${itemData};
+const strategy=${JSON.stringify(strategy)};
+const paint=${JSON.stringify(paint)};
+const transformShape=${JSON.stringify(transformShape)};
+const occlusion=${JSON.stringify(occlusion)};
+const occlusionGridW=${OCCLUSION_GRID_W};
+const occlusionGridH=${OCCLUSION_GRID_H};
+const occlusionMinCells=${OCCLUSION_MIN_CELLS};
+const occlusionInteriorRadius=${OCCLUSION_INTERIOR_RADIUS};
+const occlusionDepthBuffer=${JSON.stringify(OCCLUSION_DEPTH_BUFFER)};
+const occlusionDepthEps=${OCCLUSION_DEPTH_EPS};
+const occlusionPreserveOrder=${JSON.stringify(OCCLUSION_PRESERVE_ORDER)};
+const occlusionIntervalSamples=${OCCLUSION_INTERVAL_SAMPLES};
+const staticRotY=${staticRotY == null ? "null" : JSON.stringify(staticRotY)};
+const faceNormals=${JSON.stringify(FACE_NORMALS)};
+const faceOrder=${JSON.stringify(FACE_ORDER)};
+const preset=${JSON.stringify({ rotX: preset.rotX, rotY: preset.rotY, zoom: preset.zoom })};
+const center=${JSON.stringify(center)};
+const els=new Map();
+const samples=[];
+const frames=[];
+let frame=0;
+let last=performance.now();
+let lastSignature="";
+const scene=document.querySelector(".scene");
+const mesh=document.querySelector(".mesh");
+const intervalCullCache=new Map();
+function normalFacesCamera(normal, rotX, rotY){
+  const rz=rotY*Math.PI/180;
+  const rx=rotX*Math.PI/180;
+  const cosZ=Math.cos(rz), sinZ=Math.sin(rz);
+  const cosX=Math.cos(rx), sinX=Math.sin(rx);
+  const x1=normal[0]*cosZ-normal[1]*sinZ;
+  const y1=normal[0]*sinZ+normal[1]*cosZ;
+  const z2=y1*sinX+normal[2]*cosX;
+  return z2>0.001;
+}
+function signature(rotX, rotY){
+  const faces=[];
+  for(const face of faceOrder) if(normalFacesCamera(faceNormals[face],rotX,rotY)) faces.push(face);
+  return faces.join("|");
+}
+function rotatePoint(point, rotX, rotY){
+  const rz=rotY*Math.PI/180;
+  const rx=rotX*Math.PI/180;
+  const cosZ=Math.cos(rz), sinZ=Math.sin(rz);
+  const cosX=Math.cos(rx), sinX=Math.sin(rx);
+  const x1=point[0]*cosZ-point[1]*sinZ;
+  const y1=point[0]*sinZ+point[1]*cosZ;
+  return {x:x1,y:y1*cosX-point[2]*sinX,z:y1*sinX+point[2]*cosX};
+}
+function itemCenter(item){
+  if(item.axis==="x") return [item.left+item.width/2,-item.z,item.top+item.height/2];
+  if(item.axis==="y") return [-item.z,item.top+item.height/2,item.left+item.width/2];
+  return [item.left+item.width/2,item.top+item.height/2,item.z];
+}
+function itemCorners(item){
+  if(item.axis==="x") return [[item.left,-item.z,item.top],[item.left+item.width,-item.z,item.top],[item.left+item.width,-item.z,item.top+item.height],[item.left,-item.z,item.top+item.height]];
+  if(item.axis==="y") return [[-item.z,item.top,item.left],[-item.z,item.top,item.left+item.width],[-item.z,item.top+item.height,item.left+item.width],[-item.z,item.top+item.height,item.left]];
+  return [[item.left,item.top,item.z],[item.left+item.width,item.top,item.z],[item.left+item.width,item.top+item.height,item.z],[item.left,item.top+item.height,item.z]];
+}
+function pointInConvex(point, poly){
+  let sign=0;
+  for(let i=0;i<poly.length;i++){
+    const a=poly[i], b=poly[(i+1)%poly.length];
+    const cross=(b.x-a.x)*(point.y-a.y)-(b.y-a.y)*(point.x-a.x);
+    const next=Math.sign(cross);
+    if(next===0) continue;
+    if(sign===0) sign=next;
+    else if(sign!==next) return false;
+  }
+  return true;
+}
+function occlusionCullSingle(entries, rotX, rotY){
+  if(occlusion!=="grid"||entries.length===0) return entries;
+  function depthAt(points,x,y){
+    const p0=points[0], p1=points[1], p2=points[2];
+    const ux=p1.x-p0.x, uy=p1.y-p0.y, uz=p1.z-p0.z;
+    const vx=p2.x-p0.x, vy=p2.y-p0.y, vz=p2.z-p0.z;
+    const nx=uy*vz-uz*vy;
+    const ny=uz*vx-ux*vz;
+    const nz=ux*vy-uy*vx;
+    if(Math.abs(nz)<1e-9) return points.reduce((sum,point)=>sum+point.z,0)/points.length;
+    return p0.z-(nx*(x-p0.x)+ny*(y-p0.y))/nz;
+  }
+  const projected=entries.map((entry)=>{
+    const points=itemCorners(entry.item).map((point)=>rotatePoint(point,rotX,rotY));
+    return {
+      ...entry,
+      points,
+      depth:points.reduce((sum,point)=>sum+point.z,0)/points.length,
+      minX:Math.min(...points.map((point)=>point.x)),
+      maxX:Math.max(...points.map((point)=>point.x)),
+      minY:Math.min(...points.map((point)=>point.y)),
+      maxY:Math.max(...points.map((point)=>point.y)),
+    };
+  });
+  const minX=Math.min(...projected.map((entry)=>entry.minX));
+  const maxX=Math.max(...projected.map((entry)=>entry.maxX));
+  const minY=Math.min(...projected.map((entry)=>entry.minY));
+  const maxY=Math.max(...projected.map((entry)=>entry.maxY));
+  const spanX=Math.max(1e-6,maxX-minX), spanY=Math.max(1e-6,maxY-minY);
+  const occupied=new Uint8Array(occlusionGridW*occlusionGridH);
+  const depths=new Float64Array(occlusionGridW*occlusionGridH);
+  depths.fill(-Infinity);
+  const kept=[];
+  const keptSourceIndexes=new Set();
+  for(const entry of projected.sort((a,b)=>b.depth-a.depth||a.item.sourceIndex-b.item.sourceIndex)){
+    const gx0=Math.max(0,Math.floor(((entry.minX-minX)/spanX)*occlusionGridW));
+    const gx1=Math.min(occlusionGridW-1,Math.ceil(((entry.maxX-minX)/spanX)*occlusionGridW));
+    const gy0=Math.max(0,Math.floor(((entry.minY-minY)/spanY)*occlusionGridH));
+    const gy1=Math.min(occlusionGridH-1,Math.ceil(((entry.maxY-minY)/spanY)*occlusionGridH));
+    let hasPixel=false;
+    const cells=[];
+    for(let gy=gy0;gy<=gy1;gy++){
+      const y=minY+((gy+0.5)/occlusionGridH)*spanY;
+      for(let gx=gx0;gx<=gx1;gx++){
+        const x=minX+((gx+0.5)/occlusionGridW)*spanX;
+        if(!pointInConvex({x,y},entry.points)) continue;
+        const index=gy*occlusionGridW+gx;
+        const z=depthAt(entry.points,x,y);
+        cells.push([index,z]);
+        const covered=occupied[index]&&(!occlusionDepthBuffer||depths[index]>z+occlusionDepthEps);
+        if(!covered) hasPixel=true;
+      }
+    }
+    let hasOpenNeighbor=false;
+    if(!hasPixel&&occlusionInteriorRadius>0){
+      for(const [index] of cells){
+        const cx=index%occlusionGridW;
+        const cy=Math.floor(index/occlusionGridW);
+        for(let dy=-occlusionInteriorRadius;dy<=occlusionInteriorRadius&&!hasOpenNeighbor;dy++){
+          for(let dx=-occlusionInteriorRadius;dx<=occlusionInteriorRadius;dx++){
+            const nx=cx+dx, ny=cy+dy;
+            if(nx<0||nx>=occlusionGridW||ny<0||ny>=occlusionGridH||!occupied[ny*occlusionGridW+nx]){
+              hasOpenNeighbor=true;
+              break;
+            }
+          }
+        }
+        if(hasOpenNeighbor) break;
+      }
+    }
+    if(cells.length===0||cells.length<occlusionMinCells||hasPixel||hasOpenNeighbor){
+      kept.push(entry);
+      keptSourceIndexes.add(entry.item.sourceIndex);
+      for(const [index,z] of cells){
+        occupied[index]=1;
+        if(z>depths[index]) depths[index]=z;
+      }
+    }
+  }
+  return occlusionPreserveOrder
+    ? entries.filter((entry)=>keptSourceIndexes.has(entry.item.sourceIndex))
+    : kept;
+}
+function occlusionIntervalAngles(rotX, rotY, sig){
+  if(occlusionIntervalSamples<=1) return [rotY];
+  const step=0.5;
+  let start=rotY;
+  let end=rotY;
+  for(let i=0;i<720&&signature(rotX,start-step)===sig;i++) start-=step;
+  for(let i=0;i<720&&signature(rotX,end+step)===sig;i++) end+=step;
+  if(occlusionIntervalSamples===1||Math.abs(end-start)<1e-6) return [rotY];
+  const angles=[rotY];
+  for(let i=0;i<occlusionIntervalSamples;i++){
+    angles.push(start+((end-start)*i)/(occlusionIntervalSamples-1));
+  }
+  return [...new Set(angles.map((angle)=>Math.round(angle*1000)/1000))];
+}
+function occlusionCull(entries, rotX, rotY, sig){
+  if(occlusion!=="grid"||entries.length===0||occlusionIntervalSamples<=1){
+    return occlusionCullSingle(entries,rotX,rotY);
+  }
+  let keep=intervalCullCache.get(sig);
+  if(!keep){
+    keep=new Set();
+    for(const angle of occlusionIntervalAngles(rotX,rotY,sig)){
+      const sampleEntries=entries.map((entry)=>{
+        const projected=rotatePoint(itemCenter(entry.item),rotX,angle);
+        return {item:entry.item,...projected};
+      });
+      for(const entry of occlusionCullSingle(sampleEntries,rotX,angle)){
+        keep.add(entry.item.sourceIndex);
+      }
+    }
+    intervalCullCache.set(sig,keep);
+  }
+  return entries.filter((entry)=>keep.has(entry.item.sourceIndex));
+}
+function order(rotX, rotY, sig){
+  const faces=new Set(sig.split("|").filter(Boolean));
+  let entries=items.filter((item)=>faces.has(item.face)).map((item)=>{
+    const projected=rotatePoint(itemCenter(item),rotX,rotY);
+    return {item,...projected};
+  });
+  entries=occlusionCull(entries,rotX,rotY,sig);
+  if(!entries.length) return [];
+  let minX=Infinity,maxX=-Infinity,minY=Infinity,maxY=-Infinity;
+  for(const entry of entries){minX=Math.min(minX,entry.x);maxX=Math.max(maxX,entry.x);minY=Math.min(minY,entry.y);maxY=Math.max(maxY,entry.y);}
+  const spanX=Math.max(1e-6,maxX-minX), spanY=Math.max(1e-6,maxY-minY);
+  const tiles=new Map();
+  for(const entry of entries){
+    const tx=Math.min(3,Math.max(0,Math.floor(((entry.x-minX)/spanX)*4)));
+    const ty=Math.min(3,Math.max(0,Math.floor(((entry.y-minY)/spanY)*4)));
+    const key=tx+":"+ty;
+    let tile=tiles.get(key);
+    if(!tile){tile={tx,ty,sourceIndex:entry.item.sourceIndex,entries:[]};tiles.set(key,tile);}
+    tile.entries.push(entry);
+    tile.sourceIndex=Math.min(tile.sourceIndex,entry.item.sourceIndex);
+  }
+  const faceIndex=Object.fromEntries(faceOrder.map((face,index)=>[face,index]));
+  function projectedBounds(item){
+    const points=itemCorners(item).map((point)=>rotatePoint(point,rotX,rotY));
+    const minX=Math.min(...points.map((point)=>point.x));
+    const maxX=Math.max(...points.map((point)=>point.x));
+    const minY=Math.min(...points.map((point)=>point.y));
+    const maxY=Math.max(...points.map((point)=>point.y));
+    return {minX,maxX,minY,maxY,area:Math.max(0,maxX-minX)*Math.max(0,maxY-minY)};
+  }
+  function tileFill(entries){
+    if(!entries.length) return 0;
+    const rects=entries.map((entry)=>projectedBounds(entry.item));
+    const minX=Math.min(...rects.map((rect)=>rect.minX));
+    const maxX=Math.max(...rects.map((rect)=>rect.maxX));
+    const minY=Math.min(...rects.map((rect)=>rect.minY));
+    const maxY=Math.max(...rects.map((rect)=>rect.maxY));
+    const area=Math.max(1e-6,(maxX-minX)*(maxY-minY));
+    return rects.reduce((sum,rect)=>sum+rect.area,0)/area;
+  }
+  return [...tiles.values()].sort((a,b)=>a.ty-b.ty||a.tx-b.tx||a.sourceIndex-b.sourceIndex).flatMap((tile)=>{
+    const local=[...tile.entries];
+    const dense4=tileFill(local)>=4;
+    const dense8=tileFill(local)>=8;
+    const useDense4=strategy.startsWith("tile4-dense4-")&&dense4;
+    const useDense8=strategy.startsWith("tile4-dense8-")&&dense8;
+    const effective=(useDense4||useDense8)?strategy.replace(/^tile4-dense[48]-/,"tile4-"):strategy;
+    if(effective==="tile4-depth-front") local.sort((a,b)=>b.z-a.z||a.item.sourceIndex-b.item.sourceIndex);
+    else if(effective==="tile4-depth-back") local.sort((a,b)=>a.z-b.z||a.item.sourceIndex-b.item.sourceIndex);
+    else if(effective==="tile4-face") local.sort((a,b)=>faceIndex[a.item.face]-faceIndex[b.item.face]||a.item.sourceIndex-b.item.sourceIndex);
+    else if(effective==="tile4-top-first") local.sort((a,b)=>Number(a.item.face!=="t")-Number(b.item.face!=="t")||a.item.sourceIndex-b.item.sourceIndex);
+    else if(effective==="tile4-top-last") local.sort((a,b)=>Number(a.item.face==="t")-Number(b.item.face==="t")||a.item.sourceIndex-b.item.sourceIndex);
+    return local.map((entry)=>entry.item);
+  });
+}
+function remount(ordered){
+  const fragment=document.createDocumentFragment();
+  for(const item of ordered){
+    let el=els.get(item.sourceIndex);
+    if(!el){
+      el=document.createElement("b");
+      if(paint==="inline-background") el.style.backgroundColor=item.color;
+      else if(paint==="inline-background-shorthand") el.style.background=item.color;
+      else el.style.color=item.color;
+      if(transformShape==="css-size-unit-matrix"){
+        el.style.width=item.cssWidth+"px";
+        el.style.height=item.cssHeight+"px";
+      }
+      el.style.transform=item.transform;
+      els.set(item.sourceIndex,el);
+    }
+    fragment.appendChild(el);
+  }
+  mesh.replaceChildren(fragment);
+}
+function tick(now){
+  samples.push(now-last);
+  last=now;
+  frame++;
+  const rotY=(preset.rotY+frame*0.5)%360;
+  const rotX=preset.rotX;
+  scene.style.transform="scale("+preset.zoom+") rotateX("+rotX+"deg) rotate("+rotY+"deg) translate3d("+(-center.x)+"px,"+(-center.y)+"px,"+(-center.z)+"px)";
+  const sig=signature(rotX,rotY);
+  if(sig!==lastSignature){
+    remount(order(rotX,rotY,sig));
+    lastSignature=sig;
+  }
+  frames.push({index:frame,rotY,signature:sig,dt:samples[samples.length-1],leaves:mesh.childElementCount});
+  requestAnimationFrame(tick);
+}
+window.__probe={samples,frames,ready:true};
+if(staticRotY===null){
+  requestAnimationFrame(tick);
+}else{
+  const rotX=preset.rotX;
+  const rotY=staticRotY;
+  scene.style.transform="scale("+preset.zoom+") rotateX("+rotX+"deg) rotate("+rotY+"deg) translate3d("+(-center.x)+"px,"+(-center.y)+"px,"+(-center.z)+"px)";
+  const sig=signature(rotX,rotY);
+  remount(order(rotX,rotY,sig));
+  lastSignature=sig;
+  frames.push({index:0,rotY,signature:sig,dt:0,leaves:mesh.childElementCount});
+}
+</script>`;
+}
+
+function segmentFrames(frames) {
+  const segments = [];
+  let current = null;
+  for (const frame of frames) {
+    if (!current || current.signature !== frame.signature) {
+      current = { signature: frame.signature, startRotY: frame.rotY, endRotY: frame.rotY, frames: [] };
+      segments.push(current);
+    }
+    current.frames.push(frame);
+    current.endRotY = frame.rotY;
+  }
+  return segments.map((segment) => ({
+    signature: segment.signature,
+    startRotY: segment.startRotY,
+    endRotY: segment.endRotY,
+    leaves: median(segment.frames.map((frame) => frame.leaves)),
+    ...summarizeDts(segment.frames.map((frame) => frame.dt)),
+  }));
+}
+
+async function runCase(browser, meshId, strategy, paint, leafTransformStyle, leafBackface, transformShape, leafContain, occlusion, repeat) {
+  const { preset, items } = await loadItems(meshId);
+  const page = await browser.newPage({ viewport: { width: 1280, height: 800 } });
+  await page.setContent(buildHtml({ items, preset, strategy, paint, leafTransformStyle, leafBackface, transformShape, leafContain, occlusion }), { waitUntil: "load" });
+  await page.waitForFunction(() => window.__probe?.ready === true, null, { timeout: 30000 });
+  await page.waitForTimeout(WARMUP_MS);
+  const start = await page.evaluate(() => window.__probe.samples.length);
+  await page.waitForTimeout(SAMPLE_MS);
+  const result = await page.evaluate((from) => ({
+    samples: window.__probe.samples.slice(from),
+    frames: window.__probe.frames.slice(from),
+  }), start);
+  await page.close();
+  return {
+    mesh: meshId,
+    strategy,
+    paint,
+    leafTransformStyle,
+    leafBackface,
+    transformShape,
+    leafContain,
+    occlusion,
+    repeat,
+    warmup_ms: WARMUP_MS,
+    sample_ms: SAMPLE_MS,
+    leaves_p50: median(result.frames.map((frame) => frame.leaves)),
+    ...summarizeDts(result.samples),
+    segments: segmentFrames(result.frames),
+  };
+}
+
+function fmt(value, digits = 1) {
+  return Number.isFinite(value) ? value.toFixed(digits) : "";
+}
+
+function printRows(rows) {
+  console.log("| Mesh | Strategy | Paint | Leaf transform-style | Backface | Transform shape | Contain | Occlusion | Leaves p50 | p50 FPS | p95 FPS | p99 ms | Frames | x1 | x2 | x3 | x4+ |");
+  console.log("| --- | --- | --- | --- | --- | --- | --- | --- | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: |");
+  for (const row of rows) {
+    console.log([
+      `| ${row.mesh}`,
+      row.strategy,
+      row.paint,
+      row.leafTransformStyle,
+      row.leafBackface,
+      row.transformShape,
+      row.leafContain,
+      row.occlusion,
+      fmt(row.leaves_p50, 0),
+      fmt(row.fps_p50),
+      fmt(row.fps_p95),
+      fmt(row.frame_time_p99_ms),
+      row.frames,
+      row.buckets.x1,
+      row.buckets.x2,
+      row.buckets.x3,
+      `${row.buckets.x4_plus} |`,
+    ].join(" | "));
+  }
+}
+
+async function compareScreenshots(page, baseline, candidate) {
+  return await page.evaluate(async ({ baselineB64, candidateB64 }) => {
+    async function loadPng(b64) {
+      const img = new Image();
+      img.src = `data:image/png;base64,${b64}`;
+      await img.decode();
+      const canvas = document.createElement("canvas");
+      canvas.width = img.naturalWidth;
+      canvas.height = img.naturalHeight;
+      const ctx = canvas.getContext("2d");
+      ctx.drawImage(img, 0, 0);
+      return ctx.getImageData(0, 0, canvas.width, canvas.height);
+    }
+    const [a, b] = await Promise.all([loadPng(baselineB64), loadPng(candidateB64)]);
+    if (a.width !== b.width || a.height !== b.height) {
+      return { ok: false, reason: "size", a: [a.width, a.height], b: [b.width, b.height] };
+    }
+    let sum = 0;
+    let maxPixelDelta = 0;
+    let changedPixels = 0;
+    const pixels = a.width * a.height;
+    for (let i = 0; i < a.data.length; i += 4) {
+      const dr = Math.abs(a.data[i] - b.data[i]);
+      const dg = Math.abs(a.data[i + 1] - b.data[i + 1]);
+      const db = Math.abs(a.data[i + 2] - b.data[i + 2]);
+      const pixelDelta = (dr + dg + db) / (3 * 255);
+      sum += dr + dg + db;
+      maxPixelDelta = Math.max(maxPixelDelta, pixelDelta);
+      if (pixelDelta > 8 / 255) changedPixels += 1;
+    }
+    return {
+      ok: true,
+      mean_delta: sum / (pixels * 3 * 255),
+      max_pixel_delta: maxPixelDelta,
+      changed_ratio: changedPixels / pixels,
+    };
+  }, {
+    baselineB64: baseline.toString("base64"),
+    candidateB64: candidate.toString("base64"),
+  });
+}
+
+async function captureStatic(browser, config) {
+  const page = await browser.newPage({ viewport: { width: 1280, height: 800 } });
+  try {
+    await page.setContent(buildHtml(config), { waitUntil: "load" });
+    await page.waitForFunction(() => window.__probe?.ready === true, null, { timeout: 30000 });
+    await page.waitForTimeout(150);
+    const meta = await page.evaluate(() => ({
+      leaves: document.querySelector(".mesh")?.childElementCount ?? 0,
+      frame: window.__probe?.frames?.[0] ?? null,
+    }));
+    const screenshot = await page.screenshot({ fullPage: false });
+    return { screenshot, meta };
+  } finally {
+    await page.close();
+  }
+}
+
+async function runVisualDiff(browser) {
+  const rows = [];
+  const screenshotDir = join(resultDir, "occlusion-visual");
+  if (VISUAL_SAVE) await mkdir(screenshotDir, { recursive: true });
+  const comparePage = await browser.newPage({ viewport: { width: 1280, height: 800 } });
+  try {
+    for (const mesh of MESHES) {
+      const { preset, items } = await loadItems(mesh);
+      for (const offset of VISUAL_OFFSETS) {
+        const rotY = (preset.rotY + offset + 360) % 360;
+        const baseConfig = {
+          items,
+          preset,
+          strategy: STRATEGIES[0] ?? "tile4-source",
+          paint: PAINTS[0] ?? "current-color",
+          leafTransformStyle: LEAF_TRANSFORM_STYLES[0] ?? "preserve-3d",
+          leafBackface: LEAF_BACKFACES[0] ?? "visible",
+          transformShape: TRANSFORM_SHAPES[0] ?? "matrix-scale",
+          leafContain: LEAF_CONTAINS[0] ?? "none",
+          occlusion: "none",
+          staticRotY: rotY,
+        };
+        const candidateConfig = { ...baseConfig, occlusion: "grid" };
+        const baseline = await captureStatic(browser, baseConfig);
+        const candidate = await captureStatic(browser, candidateConfig);
+        const cmp = await compareScreenshots(comparePage, baseline.screenshot, candidate.screenshot);
+        const row = {
+          mesh,
+          offset,
+          rotY,
+          baselineLeaves: baseline.meta.leaves,
+          candidateLeaves: candidate.meta.leaves,
+          removedLeaves: baseline.meta.leaves - candidate.meta.leaves,
+          removedRatio: baseline.meta.leaves ? (baseline.meta.leaves - candidate.meta.leaves) / baseline.meta.leaves : 0,
+          ...cmp,
+          pass: Boolean(cmp.ok && cmp.mean_delta <= VISUAL_TOLERANCE),
+        };
+        rows.push(row);
+        if (VISUAL_SAVE) {
+          await writeFile(join(screenshotDir, `${mesh}-${offset}-none.png`), baseline.screenshot);
+          await writeFile(join(screenshotDir, `${mesh}-${offset}-grid.png`), candidate.screenshot);
+        }
+      }
+    }
+  } finally {
+    await comparePage.close();
+  }
+
+  console.log("| Mesh | Offset | Removed | Mean Δ | Changed | Max pixel Δ | Pass |");
+  console.log("| --- | ---: | ---: | ---: | ---: | ---: | --- |");
+  for (const row of rows) {
+    console.log([
+      `| ${row.mesh}`,
+      row.offset,
+      `${row.removedLeaves} (${(row.removedRatio * 100).toFixed(1)}%)`,
+      row.ok ? row.mean_delta.toFixed(5) : row.reason,
+      row.ok ? `${(row.changed_ratio * 100).toFixed(2)}%` : "",
+      row.ok ? row.max_pixel_delta.toFixed(3) : "",
+      `${row.pass ? "yes" : "no"} |`,
+    ].join(" | "));
+  }
+  const pass = rows.every((row) => row.pass);
+  if (LABEL) {
+    await mkdir(resultDir, { recursive: true });
+    const path = join(resultDir, `${LABEL}.json`);
+      await writeFile(path, `${JSON.stringify({
+        generatedAt: new Date().toISOString(),
+        tolerance: VISUAL_TOLERANCE,
+        browserExecutable: BROWSER_EXECUTABLE || null,
+        chromiumArgs: CHROMIUM_ARGS,
+        softwareBackend: SOFTWARE_BACKEND,
+        visualOffsets: VISUAL_OFFSETS,
+      occlusionGrid: [OCCLUSION_GRID_W, OCCLUSION_GRID_H],
+      occlusionMinCells: OCCLUSION_MIN_CELLS,
+      occlusionInteriorRadius: OCCLUSION_INTERIOR_RADIUS,
+      occlusionDepthBuffer: OCCLUSION_DEPTH_BUFFER,
+      occlusionDepthEps: OCCLUSION_DEPTH_EPS,
+      occlusionPreserveOrder: OCCLUSION_PRESERVE_ORDER,
+      occlusionIntervalSamples: OCCLUSION_INTERVAL_SAMPLES,
+      pass,
+      rows,
+    }, null, 2)}\n`);
+    console.log(`Wrote ${path}`);
+  }
+  return pass;
+}
+
+const browser = await chromium.launch({
+  headless: !HEADED,
+  args: [
+    "--disable-background-timer-throttling",
+    "--disable-renderer-backgrounding",
+    "--disable-backgrounding-occluded-windows",
+    ...CHROMIUM_ARGS,
+  ],
+  ...(BROWSER_EXECUTABLE ? { executablePath: BROWSER_EXECUTABLE } : {}),
+});
+
+try {
+  if (VISUAL_DIFF) {
+    const pass = await runVisualDiff(browser);
+    if (!pass) process.exitCode = 1;
+  } else {
+    const rows = [];
+    for (const mesh of MESHES) {
+      for (const strategy of STRATEGIES) {
+        for (const paint of PAINTS) {
+          for (const leafTransformStyle of LEAF_TRANSFORM_STYLES) {
+            for (const leafBackface of LEAF_BACKFACES) {
+              for (const transformShape of TRANSFORM_SHAPES) {
+                for (const leafContain of LEAF_CONTAINS) {
+                  for (const occlusion of OCCLUSIONS) {
+                    for (let repeat = 1; repeat <= RUNS; repeat += 1) {
+                      rows.push(await runCase(browser, mesh, strategy, paint, leafTransformStyle, leafBackface, transformShape, leafContain, occlusion, repeat));
+                    }
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+
+    printRows(rows);
+
+    if (LABEL) {
+      await mkdir(resultDir, { recursive: true });
+      const path = join(resultDir, `${LABEL}.json`);
+      await writeFile(path, `${JSON.stringify({
+        generatedAt: new Date().toISOString(),
+        browserExecutable: BROWSER_EXECUTABLE || null,
+        chromiumArgs: CHROMIUM_ARGS,
+        softwareBackend: SOFTWARE_BACKEND,
+        meshes: MESHES,
+        strategies: STRATEGIES,
+        paints: PAINTS,
+        leafTransformStyles: LEAF_TRANSFORM_STYLES,
+        leafBackfaces: LEAF_BACKFACES,
+        transformShapes: TRANSFORM_SHAPES,
+        leafContains: LEAF_CONTAINS,
+        occlusions: OCCLUSIONS,
+        occlusionGrid: [OCCLUSION_GRID_W, OCCLUSION_GRID_H],
+        occlusionMinCells: OCCLUSION_MIN_CELLS,
+        occlusionInteriorRadius: OCCLUSION_INTERIOR_RADIUS,
+        occlusionDepthBuffer: OCCLUSION_DEPTH_BUFFER,
+        occlusionDepthEps: OCCLUSION_DEPTH_EPS,
+        occlusionPreserveOrder: OCCLUSION_PRESERVE_ORDER,
+        occlusionIntervalSamples: OCCLUSION_INTERVAL_SAMPLES,
+        warmup_ms: WARMUP_MS,
+        sample_ms: SAMPLE_MS,
+        runs: rows,
+      }, null, 2)}\n`);
+      console.log(`Wrote ${path}`);
+    }
+  }
+} finally {
+  await browser.close();
+}
diff --git a/bench/voxel-interval-geometry-correlation.mjs b/bench/voxel-interval-geometry-correlation.mjs
new file mode 100644
index 00000000..2ae83afe
--- /dev/null
+++ b/bench/voxel-interval-geometry-correlation.mjs
@@ -0,0 +1,611 @@
+#!/usr/bin/env node
+import { readFile, writeFile } from "node:fs/promises";
+import { join, resolve } from "node:path";
+import {
+  BASE_TILE,
+  normalFacesCamera,
+  parseVox,
+  rotateVec3,
+} from "../packages/core/dist/index.js";
+import { PRESETS } from "./perf-shared.mjs";
+
+const repoRoot = resolve(import.meta.dirname, "..");
+const resultDir = resolve(repoRoot, "bench/results");
+
+const FACE_NORMALS = {
+  t: [0, 0, 1],
+  b: [0, 0, -1],
+  fl: [0, 1, 0],
+  br: [0, -1, 0],
+  fr: [1, 0, 0],
+  bl: [-1, 0, 0],
+};
+
+const FACE_ORDER = ["t", "b", "bl", "br", "fr", "fl"];
+const FACE_BY_NORMAL = new Map([
+  ["0,0,1", "t"],
+  ["0,0,-1", "b"],
+  ["0,1,0", "fl"],
+  ["0,-1,0", "br"],
+  ["1,0,0", "fr"],
+  ["-1,0,0", "bl"],
+]);
+
+const DEFAULT_MODELS = [
+  "ancient-crash-site",
+  "garden",
+  "scene-mechanic2",
+  "obj-house3",
+  "treasure",
+];
+
+const args = parseArgs(process.argv.slice(2));
+const models = args.models.length ? args.models : DEFAULT_MODELS;
+const baselinePrefix = args.baselinePrefix ?? "a87-interval-baseline";
+const candidatePrefix = args.candidatePrefix ?? "a87-interval-auto";
+const angleStep = Number(args.angleStep ?? 5);
+const outLabel = args.label ?? "a88-interval-geometry-correlation";
+const maxOverlapItems = Number(args.maxOverlapItems ?? 1200);
+
+function parseArgs(argv) {
+  const out = { models: [] };
+  for (const arg of argv) {
+    if (arg.startsWith("--models=")) {
+      out.models.push(...arg.slice("--models=".length).split(",").map((value) => value.trim()).filter(Boolean));
+    } else if (arg.startsWith("--baseline-prefix=")) out.baselinePrefix = arg.slice("--baseline-prefix=".length);
+    else if (arg.startsWith("--candidate-prefix=")) out.candidatePrefix = arg.slice("--candidate-prefix=".length);
+    else if (arg.startsWith("--angle-step=")) out.angleStep = arg.slice("--angle-step=".length);
+    else if (arg.startsWith("--label=")) out.label = arg.slice("--label=".length);
+    else if (arg.startsWith("--max-overlap-items=")) out.maxOverlapItems = arg.slice("--max-overlap-items=".length);
+    else if (!arg.startsWith("--")) out.models.push(arg);
+  }
+  return out;
+}
+
+function quantile(values, q) {
+  const sorted = values.filter(Number.isFinite).sort((a, b) => a - b);
+  if (sorted.length === 0) return null;
+  const i = (sorted.length - 1) * q;
+  const lo = Math.floor(i);
+  const hi = Math.ceil(i);
+  if (lo === hi) return sorted[lo];
+  return sorted[lo] + (sorted[hi] - sorted[lo]) * (i - lo);
+}
+
+function median(values) {
+  return quantile(values, 0.5);
+}
+
+function fmt(value, digits = 2) {
+  return Number.isFinite(value) ? value.toFixed(digits) : "";
+}
+
+function visibleFaceSignature(rotation) {
+  const visible = [];
+  for (const face of FACE_ORDER) {
+    if (normalFacesCamera(FACE_NORMALS[face], rotation)) visible.push(face);
+  }
+  return visible.join("|");
+}
+
+function intervalPhase(rotation, signature, fraction = 0.5) {
+  const matches = [];
+  for (let offset = -180; offset <= 180; offset += 1) {
+    const candidate = { ...rotation, rotY: rotation.rotY + offset };
+    if (visibleFaceSignature(candidate) === signature) matches.push(offset);
+  }
+  const zeroIndex = matches.indexOf(0);
+  if (zeroIndex < 0) return rotation;
+  let start = zeroIndex;
+  let end = zeroIndex;
+  while (start > 0 && matches[start] - matches[start - 1] === 1) start -= 1;
+  while (end + 1 < matches.length && matches[end + 1] - matches[end] === 1) end += 1;
+  const offset = matches[start] + (matches[end] - matches[start]) * fraction;
+  return { ...rotation, rotY: rotation.rotY + offset };
+}
+
+function rotationsForSignature(signature) {
+  const rotations = [];
+  for (let rotY = 0; rotY < 360; rotY += angleStep) {
+    const rotation = { rotX: 65, rotY };
+    if (visibleFaceSignature(rotation) === signature) rotations.push(rotation);
+  }
+  return rotations.length ? rotations : [{ rotX: 65, rotY: 45 }];
+}
+
+function cssNormalForPolygon(polygon) {
+  const vertices = polygon.vertices;
+  if (vertices.length < 3) return null;
+  const v0 = vertices[0];
+  let nx = 0;
+  let ny = 0;
+  let nz = 0;
+  for (let i = 1; i + 1 < vertices.length; i += 1) {
+    const v1 = vertices[i];
+    const v2 = vertices[i + 1];
+    const e1x = v1[1] - v0[1];
+    const e1y = v1[0] - v0[0];
+    const e1z = v1[2] - v0[2];
+    const e2x = v2[1] - v0[1];
+    const e2y = v2[0] - v0[0];
+    const e2z = v2[2] - v0[2];
+    nx -= e1y * e2z - e1z * e2y;
+    ny -= e1z * e2x - e1x * e2z;
+    nz -= e1x * e2y - e1y * e2x;
+  }
+  const len = Math.hypot(nx, ny, nz);
+  if (len <= 1e-9) return null;
+  return [
+    Math.round(nx / len),
+    Math.round(ny / len),
+    Math.round(nz / len),
+  ];
+}
+
+function matrixItemForPolygon(polygon, sourceIndex) {
+  if (polygon.texture || polygon.material || polygon.uvs || polygon.textureTriangles) return null;
+  if (polygon.vertices.length !== 4) return null;
+  const normal = cssNormalForPolygon(polygon);
+  const face = normal ? FACE_BY_NORMAL.get(normal.join(",")) : undefined;
+  if (!face) return null;
+
+  let minX = Infinity;
+  let minY = Infinity;
+  let minZ = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  let maxZ = -Infinity;
+  for (const v of polygon.vertices) {
+    minX = Math.min(minX, v[0]);
+    minY = Math.min(minY, v[1]);
+    minZ = Math.min(minZ, v[2]);
+    maxX = Math.max(maxX, v[0]);
+    maxY = Math.max(maxY, v[1]);
+    maxZ = Math.max(maxZ, v[2]);
+  }
+
+  const base = { face, sourceIndex };
+  const eps = 1e-6;
+  if (Math.abs(maxZ - minZ) <= eps) {
+    return {
+      ...base,
+      axis: "z",
+      left: minY * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: minZ * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxX - minX) <= eps) {
+    return {
+      ...base,
+      axis: "x",
+      left: minY * BASE_TILE,
+      top: minZ * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      z: -minX * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxY - minY) <= eps) {
+    return {
+      ...base,
+      axis: "y",
+      left: minZ * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: -minY * BASE_TILE,
+    };
+  }
+  return null;
+}
+
+function itemCenter(item) {
+  if (item.axis === "x") return [item.left + item.width / 2, -item.z, item.top + item.height / 2];
+  if (item.axis === "y") return [-item.z, item.top + item.height / 2, item.left + item.width / 2];
+  return [item.left + item.width / 2, item.top + item.height / 2, item.z];
+}
+
+function itemCorners(item) {
+  if (item.axis === "x") {
+    return [
+      [item.left, -item.z, item.top],
+      [item.left + item.width, -item.z, item.top],
+      [item.left + item.width, -item.z, item.top + item.height],
+      [item.left, -item.z, item.top + item.height],
+    ];
+  }
+  if (item.axis === "y") {
+    return [
+      [-item.z, item.top, item.left],
+      [-item.z, item.top, item.left + item.width],
+      [-item.z, item.top + item.height, item.left + item.width],
+      [-item.z, item.top + item.height, item.left],
+    ];
+  }
+  return [
+    [item.left, item.top, item.z],
+    [item.left + item.width, item.top, item.z],
+    [item.left + item.width, item.top + item.height, item.z],
+    [item.left, item.top + item.height, item.z],
+  ];
+}
+
+function projectPoint(point, rotation) {
+  const [x, y, z] = rotateVec3(point, rotation.rotX, 0, rotation.rotY);
+  return { x, y, z };
+}
+
+function projectedPoint(item, rotation) {
+  const [x, y] = rotateVec3(itemCenter(item), rotation.rotX, 0, rotation.rotY);
+  return { x, y };
+}
+
+function projectedBounds(item, rotation) {
+  const points = itemCorners(item).map((point) => projectPoint(point, rotation));
+  return {
+    minX: Math.min(...points.map((point) => point.x)),
+    maxX: Math.max(...points.map((point) => point.x)),
+    minY: Math.min(...points.map((point) => point.y)),
+    maxY: Math.max(...points.map((point) => point.y)),
+    depth: points.reduce((sum, point) => sum + point.z, 0) / points.length,
+    area: Math.abs(item.width * item.height),
+    primitive: Math.max(item.width, item.height),
+  };
+}
+
+function visibleItems(items, signature) {
+  const faces = new Set(signature.split("|").filter(Boolean));
+  return items.filter((item) => faces.has(item.face));
+}
+
+function sceneBounds(projected) {
+  return {
+    minX: Math.min(...projected.map((item) => item.minX)),
+    maxX: Math.max(...projected.map((item) => item.maxX)),
+    minY: Math.min(...projected.map((item) => item.minY)),
+    maxY: Math.max(...projected.map((item) => item.maxY)),
+  };
+}
+
+function tileSpanScore(item, rotation, bounds, tileCount) {
+  const projected = projectedBounds(item, rotation);
+  const tileW = Math.max(1e-6, (bounds.maxX - bounds.minX) / tileCount);
+  const tileH = Math.max(1e-6, (bounds.maxY - bounds.minY) / tileCount);
+  return Math.max(
+    (projected.maxX - projected.minX) / tileW,
+    (projected.maxY - projected.minY) / tileH,
+  );
+}
+
+function tileOrder(items, orderRotation, tileCount) {
+  const entries = items.map((item) => ({ item, ...projectedPoint(item, orderRotation) }));
+  if (entries.length === 0) return [];
+  let minX = Infinity;
+  let maxX = -Infinity;
+  let minY = Infinity;
+  let maxY = -Infinity;
+  for (const entry of entries) {
+    minX = Math.min(minX, entry.x);
+    maxX = Math.max(maxX, entry.x);
+    minY = Math.min(minY, entry.y);
+    maxY = Math.max(maxY, entry.y);
+  }
+  const spanX = Math.max(1e-6, maxX - minX);
+  const spanY = Math.max(1e-6, maxY - minY);
+  const tiles = new Map();
+  for (const entry of entries) {
+    const tx = Math.min(tileCount - 1, Math.max(0, Math.floor(((entry.x - minX) / spanX) * tileCount)));
+    const ty = Math.min(tileCount - 1, Math.max(0, Math.floor(((entry.y - minY) / spanY) * tileCount)));
+    const key = `${tx}:${ty}`;
+    let tile = tiles.get(key);
+    if (!tile) {
+      tile = { tx, ty, sourceIndex: entry.item.sourceIndex, items: [] };
+      tiles.set(key, tile);
+    }
+    tile.items.push(entry.item);
+    tile.sourceIndex = Math.min(tile.sourceIndex, entry.item.sourceIndex);
+  }
+  return [...tiles.values()]
+    .sort((a, b) => (a.ty - b.ty) || (a.tx - b.tx) || a.sourceIndex - b.sourceIndex)
+    .flatMap((tile) => tile.items);
+}
+
+function ranksForOrder(ordered) {
+  const ranks = new Map();
+  ordered.forEach((item, index) => ranks.set(item.sourceIndex, index));
+  return ranks;
+}
+
+function overlapSummary(items, rotation, baselineRanks, candidateRanks) {
+  const sampledItems = sampleItems(items, maxOverlapItems);
+  const projected = sampledItems.map((item) => ({ item, ...projectedBounds(item, rotation) }));
+  const sorted = projected
+    .map((entry, index) => ({ ...entry, index }))
+    .sort((a, b) => a.minX - b.minX);
+  const active = [];
+  let pairs = 0;
+  let overlapArea = 0;
+  let changedPairs = 0;
+  let changedArea = 0;
+  let sameFacePairs = 0;
+  let sameFaceArea = 0;
+  const pairAreas = new Map();
+  const changedPairAreas = new Map();
+  for (const current of sorted) {
+    for (let i = active.length - 1; i >= 0; i -= 1) {
+      if (active[i].maxX <= current.minX) active.splice(i, 1);
+    }
+    for (const other of active) {
+      if (other.maxY <= current.minY || other.minY >= current.maxY) continue;
+      const x0 = Math.max(current.minX, other.minX);
+      const x1 = Math.min(current.maxX, other.maxX);
+      const y0 = Math.max(current.minY, other.minY);
+      const y1 = Math.min(current.maxY, other.maxY);
+      if (x1 <= x0 || y1 <= y0) continue;
+      const area = (x1 - x0) * (y1 - y0);
+      pairs += 1;
+      overlapArea += area;
+      if (current.item.face === other.item.face) {
+        sameFacePairs += 1;
+        sameFaceArea += area;
+      }
+      const pairKey = facePairKey(current.item.face, other.item.face);
+      pairAreas.set(pairKey, (pairAreas.get(pairKey) ?? 0) + area);
+      const aBase = baselineRanks.get(current.item.sourceIndex);
+      const bBase = baselineRanks.get(other.item.sourceIndex);
+      const aCand = candidateRanks.get(current.item.sourceIndex);
+      const bCand = candidateRanks.get(other.item.sourceIndex);
+      if (
+        Number.isFinite(aBase) &&
+        Number.isFinite(bBase) &&
+        Number.isFinite(aCand) &&
+        Number.isFinite(bCand) &&
+        Math.sign(aBase - bBase) !== Math.sign(aCand - bCand)
+      ) {
+        changedPairs += 1;
+        changedArea += area;
+        changedPairAreas.set(pairKey, (changedPairAreas.get(pairKey) ?? 0) + area);
+      }
+    }
+    active.push(current);
+  }
+  return {
+    pairs,
+    sampledLeaves: sampledItems.length,
+    overlapArea,
+    overlapPairsPerLeaf: sampledItems.length ? pairs / sampledItems.length : 0,
+    changedPairRate: pairs ? changedPairs / pairs : 0,
+    changedAreaRate: overlapArea ? changedArea / overlapArea : 0,
+    sameFacePairRate: pairs ? sameFacePairs / pairs : 0,
+    sameFaceAreaRate: overlapArea ? sameFaceArea / overlapArea : 0,
+    topOverlapPair: topPair(pairAreas, overlapArea),
+    topChangedPair: topPair(changedPairAreas, changedArea),
+  };
+}
+
+function facePairKey(a, b) {
+  return FACE_ORDER.indexOf(a) <= FACE_ORDER.indexOf(b) ? `${a}/${b}` : `${b}/${a}`;
+}
+
+function topPair(map, totalArea) {
+  let bestPair = "";
+  let bestArea = 0;
+  for (const [pair, area] of map) {
+    if (area > bestArea) {
+      bestPair = pair;
+      bestArea = area;
+    }
+  }
+  return {
+    pair: bestPair,
+    areaRate: totalArea ? bestArea / totalArea : 0,
+  };
+}
+
+function sampleItems(items, maxItems) {
+  if (!Number.isFinite(maxItems) || maxItems <= 0 || items.length <= maxItems) return items;
+  const sampled = [];
+  const stride = items.length / maxItems;
+  for (let i = 0; i < maxItems; i += 1) {
+    sampled.push(items[Math.floor(i * stride)]);
+  }
+  return sampled;
+}
+
+function summarizeValues(values) {
+  return {
+    median: median(values),
+    p95: quantile(values, 0.95),
+    p99: quantile(values, 0.99),
+    max: values.length ? Math.max(...values) : null,
+  };
+}
+
+function mergeRows(rows) {
+  const numberKeys = Object.keys(rows[0] ?? {}).filter((key) => typeof rows[0][key] === "number");
+  const merged = {};
+  for (const key of numberKeys) merged[key] = median(rows.map((row) => row[key]));
+  const pairKeys = ["topOverlapPair", "topChangedPair"];
+  for (const key of pairKeys) merged[key] = mostCommonPair(rows.map((row) => row[key]));
+  return merged;
+}
+
+function mostCommonPair(pairs) {
+  const counts = new Map();
+  for (const pair of pairs) {
+    if (!pair?.pair) continue;
+    const current = counts.get(pair.pair) ?? { pair: pair.pair, count: 0, rates: [] };
+    current.count += 1;
+    current.rates.push(pair.areaRate);
+    counts.set(pair.pair, current);
+  }
+  const best = [...counts.values()].sort((a, b) => b.count - a.count || (median(b.rates) ?? 0) - (median(a.rates) ?? 0))[0];
+  return best ? { pair: best.pair, areaRate: median(best.rates) ?? 0 } : { pair: "", areaRate: 0 };
+}
+
+async function loadItems(model) {
+  const preset = PRESETS[model];
+  if (!preset) throw new Error(`Unknown preset ${model}`);
+  const path = resolve(repoRoot, "website/public", preset.url.replace(/^\/gallery\//, "gallery/"));
+  const bytes = await readFile(path);
+  const parsed = parseVox(
+    bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength),
+    preset.options,
+  );
+  return parsed.polygons
+    .map((polygon, sourceIndex) => matrixItemForPolygon(polygon, sourceIndex))
+    .filter((item) => item && item.width > 0 && item.height > 0);
+}
+
+function readProfilerRun(prefix, model) {
+  return readFile(join(resultDir, `${prefix}-${model}.json`), "utf8")
+    .then((text) => JSON.parse(text).runs[0]);
+}
+
+function signatureMap(run) {
+  const map = new Map();
+  for (const row of run.signatures) map.set(row.signature, row);
+  return map;
+}
+
+function intervalDelta(baseline, candidate, signature) {
+  const base = signatureMap(baseline).get(signature);
+  const cand = signatureMap(candidate).get(signature);
+  if (!base || !cand || base.frames < 16 || cand.frames < 16) return null;
+  return {
+    signature,
+    baseFrames: base.frames,
+    candidateFrames: cand.frames,
+    baseP95: base.fps_p95,
+    candidateP95: cand.fps_p95,
+    deltaP95: cand.fps_p95 - base.fps_p95,
+    baseP99: base.frame_time_p99_ms,
+    candidateP99: cand.frame_time_p99_ms,
+    deltaP99: cand.frame_time_p99_ms - base.frame_time_p99_ms,
+    baseX4: base.buckets.x4_plus,
+    candidateX4: cand.buckets.x4_plus,
+  };
+}
+
+function analyzeSignature(items, signature) {
+  const visible = visibleItems(items, signature);
+  const rows = [];
+  for (const rotation of rotationsForSignature(signature)) {
+    const centered = intervalPhase(rotation, signature, 0.5);
+    const projected = visible.map((item) => projectedBounds(item, rotation));
+    const centeredProjected = visible.map((item) => projectedBounds(item, centered));
+    const bounds = sceneBounds(projected);
+    const centeredBounds = sceneBounds(centeredProjected);
+    const screenArea = Math.max(1e-6, (bounds.maxX - bounds.minX) * (bounds.maxY - bounds.minY));
+    const projectedAreas = projected.map((item) => Math.max(0, item.maxX - item.minX) * Math.max(0, item.maxY - item.minY));
+    const tile3Scores = visible.map((item) => Math.max(
+      tileSpanScore(item, rotation, bounds, 3),
+      tileSpanScore(item, centered, centeredBounds, 3),
+    ));
+    const tile5Scores = visible.map((item) => Math.max(
+      tileSpanScore(item, rotation, bounds, 5),
+      tileSpanScore(item, centered, centeredBounds, 5),
+    ));
+    const localPrimitives = visible.map((item) => Math.max(item.width, item.height));
+    const baselineOrder = tileOrder(visible, rotation, 4);
+    const candidateTileCount = quantile(tile3Scores, 0.95) > 1 ? 5 : 3;
+    const candidateOrder = tileOrder(visible, centered, candidateTileCount);
+    const overlap = overlapSummary(
+      visible,
+      rotation,
+      ranksForOrder(baselineOrder),
+      ranksForOrder(candidateOrder),
+    );
+    const faceCounts = Object.fromEntries(FACE_ORDER.map((face) => [face, visible.filter((item) => item.face === face).length]));
+    rows.push({
+      leaves: visible.length,
+      topShare: visible.length ? faceCounts.t / visible.length : 0,
+      sideBalance: visible.length
+        ? Math.max(faceCounts.fl, faceCounts.br, faceCounts.fr, faceCounts.bl) / visible.length
+        : 0,
+      projectedAreaOverScreen: projectedAreas.reduce((sum, area) => sum + area, 0) / screenArea,
+      localPrimitiveP95: quantile(localPrimitives, 0.95) ?? 0,
+      localPrimitiveP99: quantile(localPrimitives, 0.99) ?? 0,
+      tile3SpanP95: quantile(tile3Scores, 0.95) ?? 0,
+      tile3SpanP99: quantile(tile3Scores, 0.99) ?? 0,
+      tile3SpanGt1Rate: visible.length ? tile3Scores.filter((score) => score > 1).length / visible.length : 0,
+      tile5SpanP95: quantile(tile5Scores, 0.95) ?? 0,
+      tile5SpanGt1Rate: visible.length ? tile5Scores.filter((score) => score > 1).length / visible.length : 0,
+      candidateTileCount,
+      ...overlap,
+    });
+  }
+  return mergeRows(rows);
+}
+
+function renderMarkdown(rows) {
+  const lines = [];
+  lines.push("# Voxel Interval Geometry Correlation");
+  lines.push("");
+  lines.push(`Baseline prefix: \`${baselinePrefix}\``);
+  lines.push(`Candidate prefix: \`${candidatePrefix}\``);
+  lines.push(`Angle step: ${angleStep}`);
+  lines.push(`Max overlap items: ${maxOverlapItems}`);
+  lines.push("");
+  lines.push("| Model | Signature | Delta p95 | Delta p99 ms | Leaves | Tile3 span p95 | Tile3 >1 % | Overlap/leaf | Changed overlap % | Top overlap pair | Top changed pair | Area/screen | Top % | Candidate tiles |");
+  lines.push("| --- | --- | ---: | ---: | ---: | ---: | ---: | ---: | ---: | --- | --- | ---: | ---: | ---: |");
+  for (const row of rows) {
+    lines.push([
+      `| ${row.model}`,
+      row.signature,
+      fmt(row.deltaP95, 1),
+      fmt(row.deltaP99, 1),
+      fmt(row.geometry.leaves, 0),
+      fmt(row.geometry.tile3SpanP95, 2),
+      fmt(row.geometry.tile3SpanGt1Rate * 100, 1),
+      fmt(row.geometry.overlapPairsPerLeaf, 2),
+      fmt(row.geometry.changedAreaRate * 100, 1),
+      `${row.geometry.topOverlapPair?.pair ?? ""} ${fmt((row.geometry.topOverlapPair?.areaRate ?? 0) * 100, 0)}%`,
+      `${row.geometry.topChangedPair?.pair ?? ""} ${fmt((row.geometry.topChangedPair?.areaRate ?? 0) * 100, 0)}%`,
+      fmt(row.geometry.projectedAreaOverScreen, 2),
+      fmt(row.geometry.topShare * 100, 1),
+      `${fmt(row.geometry.candidateTileCount, 0)} |`,
+    ].join(" | "));
+  }
+  return `${lines.join("\n")}\n`;
+}
+
+const rows = [];
+for (const model of models) {
+  console.log(`[interval-geometry] ${model}`);
+  const items = await loadItems(model);
+  const baseline = await readProfilerRun(baselinePrefix, model);
+  const candidate = await readProfilerRun(candidatePrefix, model);
+  const signatures = new Set([
+    ...baseline.signatures.map((row) => row.signature),
+    ...candidate.signatures.map((row) => row.signature),
+  ]);
+  for (const signature of [...signatures].sort()) {
+    const delta = intervalDelta(baseline, candidate, signature);
+    if (!delta) continue;
+    rows.push({
+      model,
+      ...delta,
+      geometry: analyzeSignature(items, signature),
+    });
+  }
+}
+
+const output = {
+  generatedAt: new Date().toISOString(),
+  baselinePrefix,
+  candidatePrefix,
+  angleStep,
+  rows,
+};
+const jsonPath = join(resultDir, `${outLabel}.json`);
+const mdPath = join(resultDir, `${outLabel}.md`);
+await writeFile(jsonPath, JSON.stringify(output, null, 2));
+await writeFile(mdPath, renderMarkdown(rows));
+
+console.log(`[interval-geometry] wrote ${jsonPath}`);
+console.log(`[interval-geometry] wrote ${mdPath}`);
+console.log(renderMarkdown(rows));
diff --git a/bench/voxel-interval-order-diff.mjs b/bench/voxel-interval-order-diff.mjs
new file mode 100644
index 00000000..05387fcd
--- /dev/null
+++ b/bench/voxel-interval-order-diff.mjs
@@ -0,0 +1,646 @@
+#!/usr/bin/env node
+import { readFile, writeFile } from "node:fs/promises";
+import { join, resolve } from "node:path";
+import {
+  BASE_TILE,
+  normalFacesCamera,
+  parseVox,
+  rotateVec3,
+} from "../packages/core/dist/index.js";
+import { PRESETS } from "./perf-shared.mjs";
+
+const repoRoot = resolve(import.meta.dirname, "..");
+const resultDir = resolve(repoRoot, "bench/results");
+
+const FACE_NORMALS = {
+  t: [0, 0, 1],
+  b: [0, 0, -1],
+  fl: [0, 1, 0],
+  br: [0, -1, 0],
+  fr: [1, 0, 0],
+  bl: [-1, 0, 0],
+};
+
+const FACE_ORDER = ["t", "b", "bl", "br", "fr", "fl"];
+const FACE_BY_NORMAL = new Map([
+  ["0,0,1", "t"],
+  ["0,0,-1", "b"],
+  ["0,1,0", "fl"],
+  ["0,-1,0", "br"],
+  ["1,0,0", "fr"],
+  ["-1,0,0", "bl"],
+]);
+
+const DEFAULT_TARGETS = [
+  "garden:t|br|fr",
+  "treasure:t|br|fr",
+  "ancient-crash-site:t|bl|br",
+  "obj-house3:t|br|fr",
+];
+
+const args = parseArgs(process.argv.slice(2));
+const targets = args.targets.length ? args.targets : DEFAULT_TARGETS;
+const outLabel = args.label ?? "a92-interval-order-diff";
+const maxOverlapItems = Number(args.maxOverlapItems ?? 1800);
+
+function parseArgs(argv) {
+  const out = { targets: [] };
+  for (const arg of argv) {
+    if (arg.startsWith("--targets=")) {
+      out.targets.push(...arg.slice("--targets=".length).split(",").map((value) => value.trim()).filter(Boolean));
+    } else if (arg.startsWith("--label=")) out.label = arg.slice("--label=".length);
+    else if (arg.startsWith("--max-overlap-items=")) out.maxOverlapItems = arg.slice("--max-overlap-items=".length);
+    else if (!arg.startsWith("--")) out.targets.push(arg);
+  }
+  return out;
+}
+
+function quantile(values, q) {
+  const sorted = values.filter(Number.isFinite).sort((a, b) => a - b);
+  if (sorted.length === 0) return null;
+  const i = (sorted.length - 1) * q;
+  const lo = Math.floor(i);
+  const hi = Math.ceil(i);
+  if (lo === hi) return sorted[lo];
+  return sorted[lo] + (sorted[hi] - sorted[lo]) * (i - lo);
+}
+
+function fmt(value, digits = 2) {
+  return Number.isFinite(value) ? value.toFixed(digits) : "";
+}
+
+function visibleFaceSignature(rotation) {
+  const visible = [];
+  for (const face of FACE_ORDER) {
+    if (normalFacesCamera(FACE_NORMALS[face], rotation)) visible.push(face);
+  }
+  return visible.join("|");
+}
+
+function signatureRanges(signature) {
+  const ranges = [];
+  let current = null;
+  for (let halfStep = 0; halfStep < 720; halfStep += 1) {
+    const rotY = halfStep * 0.5;
+    if (visibleFaceSignature({ rotX: 65, rotY }) === signature) {
+      if (!current) current = { start: rotY, end: rotY, count: 0 };
+      current.end = rotY;
+      current.count += 1;
+    } else if (current) {
+      ranges.push(current);
+      current = null;
+    }
+  }
+  if (current) ranges.push(current);
+  return ranges.sort((a, b) => b.count - a.count);
+}
+
+function representativeInterval(signature) {
+  const range = signatureRanges(signature)[0];
+  if (!range) throw new Error(`No camera interval for signature ${signature}`);
+  return {
+    start: { rotX: 65, rotY: range.start },
+    midpoint: { rotX: 65, rotY: (range.start + range.end) / 2 },
+    end: { rotX: 65, rotY: range.end },
+  };
+}
+
+function intervalCenterRotation(rotation, signature) {
+  const matches = [];
+  for (let offset = -180; offset <= 180; offset += 1) {
+    const candidate = { ...rotation, rotY: rotation.rotY + offset };
+    if (visibleFaceSignature(candidate) === signature) matches.push(offset);
+  }
+  const zeroIndex = matches.indexOf(0);
+  if (zeroIndex < 0) return rotation;
+  let start = zeroIndex;
+  let end = zeroIndex;
+  while (start > 0 && matches[start] - matches[start - 1] === 1) start -= 1;
+  while (end + 1 < matches.length && matches[end + 1] - matches[end] === 1) end += 1;
+  const offset = (matches[start] + matches[end]) / 2;
+  return { ...rotation, rotY: rotation.rotY + offset };
+}
+
+function cssNormalForPolygon(polygon) {
+  const vertices = polygon.vertices;
+  if (vertices.length < 3) return null;
+  const v0 = vertices[0];
+  let nx = 0;
+  let ny = 0;
+  let nz = 0;
+  for (let i = 1; i + 1 < vertices.length; i += 1) {
+    const v1 = vertices[i];
+    const v2 = vertices[i + 1];
+    const e1x = v1[1] - v0[1];
+    const e1y = v1[0] - v0[0];
+    const e1z = v1[2] - v0[2];
+    const e2x = v2[1] - v0[1];
+    const e2y = v2[0] - v0[0];
+    const e2z = v2[2] - v0[2];
+    nx -= e1y * e2z - e1z * e2y;
+    ny -= e1z * e2x - e1x * e2z;
+    nz -= e1x * e2y - e1y * e2x;
+  }
+  const len = Math.hypot(nx, ny, nz);
+  if (len <= 1e-9) return null;
+  return [
+    Math.round(nx / len),
+    Math.round(ny / len),
+    Math.round(nz / len),
+  ];
+}
+
+function matrixItemForPolygon(polygon, sourceIndex) {
+  if (polygon.texture || polygon.material || polygon.uvs || polygon.textureTriangles) return null;
+  if (polygon.vertices.length !== 4) return null;
+  const normal = cssNormalForPolygon(polygon);
+  const face = normal ? FACE_BY_NORMAL.get(normal.join(",")) : undefined;
+  if (!face) return null;
+
+  let minX = Infinity;
+  let minY = Infinity;
+  let minZ = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  let maxZ = -Infinity;
+  for (const v of polygon.vertices) {
+    minX = Math.min(minX, v[0]);
+    minY = Math.min(minY, v[1]);
+    minZ = Math.min(minZ, v[2]);
+    maxX = Math.max(maxX, v[0]);
+    maxY = Math.max(maxY, v[1]);
+    maxZ = Math.max(maxZ, v[2]);
+  }
+
+  const base = { face, sourceIndex };
+  const eps = 1e-6;
+  if (Math.abs(maxZ - minZ) <= eps) {
+    return {
+      ...base,
+      axis: "z",
+      left: minY * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: minZ * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxX - minX) <= eps) {
+    return {
+      ...base,
+      axis: "x",
+      left: minY * BASE_TILE,
+      top: minZ * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      z: -minX * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxY - minY) <= eps) {
+    return {
+      ...base,
+      axis: "y",
+      left: minZ * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: -minY * BASE_TILE,
+    };
+  }
+  return null;
+}
+
+function itemCenter(item) {
+  if (item.axis === "x") return [item.left + item.width / 2, -item.z, item.top + item.height / 2];
+  if (item.axis === "y") return [-item.z, item.top + item.height / 2, item.left + item.width / 2];
+  return [item.left + item.width / 2, item.top + item.height / 2, item.z];
+}
+
+function itemCorners(item) {
+  if (item.axis === "x") {
+    return [
+      [item.left, -item.z, item.top],
+      [item.left + item.width, -item.z, item.top],
+      [item.left + item.width, -item.z, item.top + item.height],
+      [item.left, -item.z, item.top + item.height],
+    ];
+  }
+  if (item.axis === "y") {
+    return [
+      [-item.z, item.top, item.left],
+      [-item.z, item.top, item.left + item.width],
+      [-item.z, item.top + item.height, item.left + item.width],
+      [-item.z, item.top + item.height, item.left],
+    ];
+  }
+  return [
+    [item.left, item.top, item.z],
+    [item.left + item.width, item.top, item.z],
+    [item.left + item.width, item.top + item.height, item.z],
+    [item.left, item.top + item.height, item.z],
+  ];
+}
+
+function projectPoint(point, rotation) {
+  const [x, y, z] = rotateVec3(point, rotation.rotX, 0, rotation.rotY);
+  return { x, y, z };
+}
+
+function projectedPoint(item, rotation) {
+  const [x, y] = rotateVec3(itemCenter(item), rotation.rotX, 0, rotation.rotY);
+  return { x, y };
+}
+
+function projectedBounds(item, rotation) {
+  const points = itemCorners(item).map((point) => projectPoint(point, rotation));
+  return {
+    minX: Math.min(...points.map((point) => point.x)),
+    maxX: Math.max(...points.map((point) => point.x)),
+    minY: Math.min(...points.map((point) => point.y)),
+    maxY: Math.max(...points.map((point) => point.y)),
+    depth: points.reduce((sum, point) => sum + point.z, 0) / points.length,
+    projectedArea: Math.max(0, Math.max(...points.map((point) => point.x)) - Math.min(...points.map((point) => point.x))) *
+      Math.max(0, Math.max(...points.map((point) => point.y)) - Math.min(...points.map((point) => point.y))),
+    localArea: Math.abs(item.width * item.height),
+    primitive: Math.max(item.width, item.height),
+  };
+}
+
+function visibleItems(items, signature) {
+  const faces = new Set(signature.split("|").filter(Boolean));
+  return items.filter((item) => faces.has(item.face));
+}
+
+function sceneBounds(projected) {
+  return {
+    minX: Math.min(...projected.map((item) => item.minX)),
+    maxX: Math.max(...projected.map((item) => item.maxX)),
+    minY: Math.min(...projected.map((item) => item.minY)),
+    maxY: Math.max(...projected.map((item) => item.maxY)),
+  };
+}
+
+function tileSpanScore(item, rotation, bounds, tileCount) {
+  const projected = projectedBounds(item, rotation);
+  const tileW = Math.max(1e-6, (bounds.maxX - bounds.minX) / tileCount);
+  const tileH = Math.max(1e-6, (bounds.maxY - bounds.minY) / tileCount);
+  return Math.max(
+    (projected.maxX - projected.minX) / tileW,
+    (projected.maxY - projected.minY) / tileH,
+  );
+}
+
+function tileOrder(items, orderRotation, tileCount) {
+  const entries = items.map((item) => ({ item, ...projectedPoint(item, orderRotation) }));
+  if (entries.length === 0) return [];
+  let minX = Infinity;
+  let maxX = -Infinity;
+  let minY = Infinity;
+  let maxY = -Infinity;
+  for (const entry of entries) {
+    minX = Math.min(minX, entry.x);
+    maxX = Math.max(maxX, entry.x);
+    minY = Math.min(minY, entry.y);
+    maxY = Math.max(maxY, entry.y);
+  }
+  const spanX = Math.max(1e-6, maxX - minX);
+  const spanY = Math.max(1e-6, maxY - minY);
+  const tiles = new Map();
+  for (const entry of entries) {
+    const tx = Math.min(tileCount - 1, Math.max(0, Math.floor(((entry.x - minX) / spanX) * tileCount)));
+    const ty = Math.min(tileCount - 1, Math.max(0, Math.floor(((entry.y - minY) / spanY) * tileCount)));
+    const key = `${tx}:${ty}`;
+    let tile = tiles.get(key);
+    if (!tile) {
+      tile = { tx, ty, sourceIndex: entry.item.sourceIndex, items: [] };
+      tiles.set(key, tile);
+    }
+    tile.items.push(entry.item);
+    tile.sourceIndex = Math.min(tile.sourceIndex, entry.item.sourceIndex);
+  }
+  return [...tiles.values()]
+    .sort((a, b) => (a.ty - b.ty) || (a.tx - b.tx) || a.sourceIndex - b.sourceIndex)
+    .flatMap((tile) => tile.items);
+}
+
+function ranksForOrder(ordered) {
+  const ranks = new Map();
+  ordered.forEach((item, index) => ranks.set(item.sourceIndex, index));
+  return ranks;
+}
+
+function adaptiveScreenOrder(visible, rotation, signature) {
+  const centered = intervalCenterRotation(rotation, signature);
+  const currentProjected = visible.map((item) => projectedBounds(item, rotation));
+  const centeredProjected = visible.map((item) => projectedBounds(item, centered));
+  const currentBounds = sceneBounds(currentProjected);
+  const centeredBounds = sceneBounds(centeredProjected);
+  const tile3Scores = visible.map((item) => Math.max(
+    tileSpanScore(item, rotation, currentBounds, 3),
+    tileSpanScore(item, centered, centeredBounds, 3),
+  ));
+  const tileCount = (quantile(tile3Scores, 0.95) ?? 0) > 1 ? 5 : 3;
+  const baselineSlots = tileOrder(visible, rotation, tileCount);
+  const phaseOrder = tileOrder(visible, centered, tileCount);
+  const scoreBySource = new Map();
+  visible.forEach((item, index) => scoreBySource.set(item.sourceIndex, tile3Scores[index] ?? 0));
+  const isAnchor = (item) => (scoreBySource.get(item.sourceIndex) ?? 0) > 1;
+  const movablePhase = phaseOrder.filter((item) => !isAnchor(item));
+  let next = 0;
+  return {
+    order: baselineSlots.map((item) => {
+      if (isAnchor(item)) return item;
+      return movablePhase[next++] ?? item;
+    }),
+    tileCount,
+    centeredRotY: centered.rotY,
+    anchoredCount: visible.filter(isAnchor).length,
+    scoreBySource,
+  };
+}
+
+function sampleItemsByProjectedArea(items, rotation, maxItems) {
+  if (!Number.isFinite(maxItems) || maxItems <= 0 || items.length <= maxItems) return items;
+  return items
+    .map((item) => ({ item, area: projectedBounds(item, rotation).projectedArea }))
+    .sort((a, b) => b.area - a.area || a.item.sourceIndex - b.item.sourceIndex)
+    .slice(0, maxItems)
+    .map((entry) => entry.item)
+    .sort((a, b) => a.sourceIndex - b.sourceIndex);
+}
+
+function facePairKey(a, b) {
+  return FACE_ORDER.indexOf(a) <= FACE_ORDER.indexOf(b) ? `${a}/${b}` : `${b}/${a}`;
+}
+
+function signForPair(pair, ranks) {
+  const a = ranks.get(pair.a.item.sourceIndex);
+  const b = ranks.get(pair.b.item.sourceIndex);
+  if (!Number.isFinite(a) || !Number.isFinite(b) || a === b) return 0;
+  return a < b ? -1 : 1;
+}
+
+function addMetric(map, key, value) {
+  map.set(key, (map.get(key) ?? 0) + value);
+}
+
+function changedOverlapDiff(items, rotation, baselineRanks, candidateRanks, candidateScoreBySource) {
+  const sampled = sampleItemsByProjectedArea(items, rotation, maxOverlapItems);
+  const projected = sampled
+    .map((item) => ({ item, ...projectedBounds(item, rotation) }))
+    .sort((a, b) => a.minX - b.minX);
+  const active = [];
+  const pairArea = new Map();
+  const changedPairArea = new Map();
+  const changedDepthArea = new Map();
+  const itemChangedArea = new Map();
+  let pairs = 0;
+  let changedPairs = 0;
+  let overlapArea = 0;
+  let changedArea = 0;
+
+  for (const current of projected) {
+    for (let i = active.length - 1; i >= 0; i -= 1) {
+      if (active[i].maxX <= current.minX) active.splice(i, 1);
+    }
+    for (const other of active) {
+      if (other.maxY <= current.minY || other.minY >= current.maxY) continue;
+      const x0 = Math.max(current.minX, other.minX);
+      const x1 = Math.min(current.maxX, other.maxX);
+      const y0 = Math.max(current.minY, other.minY);
+      const y1 = Math.min(current.maxY, other.maxY);
+      if (x1 <= x0 || y1 <= y0) continue;
+      const area = (x1 - x0) * (y1 - y0);
+      pairs += 1;
+      overlapArea += area;
+      const key = facePairKey(current.item.face, other.item.face);
+      addMetric(pairArea, key, area);
+
+      const pair = { a: current, b: other };
+      const baseSign = signForPair(pair, baselineRanks);
+      const candidateSign = signForPair(pair, candidateRanks);
+      if (baseSign === candidateSign || candidateSign === 0 || baseSign === 0) continue;
+
+      changedPairs += 1;
+      changedArea += area;
+      addMetric(changedPairArea, key, area);
+      const depthKey = Math.abs(current.depth - other.depth) < 1e-6
+        ? "same-depth"
+        : candidateSign < 0 === current.depth < other.depth
+          ? "candidate-low-depth-first"
+          : "candidate-high-depth-first";
+      addMetric(changedDepthArea, depthKey, area);
+      addChangedItem(itemChangedArea, current.item, area, baselineRanks, candidateRanks, candidateScoreBySource);
+      addChangedItem(itemChangedArea, other.item, area, baselineRanks, candidateRanks, candidateScoreBySource);
+    }
+    active.push(current);
+  }
+
+  return {
+    sampledLeaves: sampled.length,
+    pairs,
+    changedPairs,
+    overlapArea,
+    changedArea,
+    changedPairRate: pairs ? changedPairs / pairs : 0,
+    changedAreaRate: overlapArea ? changedArea / overlapArea : 0,
+    topPairAreas: topEntries(pairArea, overlapArea, 8),
+    topChangedPairAreas: topEntries(changedPairArea, changedArea, 8),
+    changedDepthAreas: topEntries(changedDepthArea, changedArea, 4),
+    topChangedItems: [...itemChangedArea.values()]
+      .sort((a, b) => b.changedArea - a.changedArea)
+      .slice(0, 10),
+  };
+}
+
+function addChangedItem(map, item, area, baselineRanks, candidateRanks, candidateScoreBySource) {
+  const entry = map.get(item.sourceIndex) ?? {
+    sourceIndex: item.sourceIndex,
+    face: item.face,
+    primitive: Math.max(item.width, item.height),
+    localArea: item.width * item.height,
+    baselineRank: baselineRanks.get(item.sourceIndex),
+    candidateRank: candidateRanks.get(item.sourceIndex),
+    movedDistance: Math.abs((candidateRanks.get(item.sourceIndex) ?? 0) - (baselineRanks.get(item.sourceIndex) ?? 0)),
+    tile3SpanScore: candidateScoreBySource.get(item.sourceIndex) ?? 0,
+    changedArea: 0,
+  };
+  entry.changedArea += area;
+  map.set(item.sourceIndex, entry);
+}
+
+function topEntries(map, denominator, count) {
+  return [...map.entries()]
+    .map(([key, value]) => ({
+      key,
+      value,
+      rate: denominator ? value / denominator : 0,
+    }))
+    .sort((a, b) => b.value - a.value)
+    .slice(0, count);
+}
+
+async function loadItems(model) {
+  const preset = PRESETS[model];
+  if (!preset) throw new Error(`Unknown preset ${model}`);
+  const path = resolve(repoRoot, "website/public", preset.url.replace(/^\/gallery\//, "gallery/"));
+  const bytes = await readFile(path);
+  const parsed = parseVox(
+    bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength),
+    preset.options,
+  );
+  return parsed.polygons
+    .map((polygon, sourceIndex) => matrixItemForPolygon(polygon, sourceIndex))
+    .filter((item) => item && item.width > 0 && item.height > 0);
+}
+
+function movedSummary(visible, baselineRanks, candidateRanks) {
+  const byFace = new Map();
+  const distances = [];
+  for (const item of visible) {
+    const baselineRank = baselineRanks.get(item.sourceIndex);
+    const candidateRank = candidateRanks.get(item.sourceIndex);
+    if (!Number.isFinite(baselineRank) || !Number.isFinite(candidateRank)) continue;
+    const distance = Math.abs(candidateRank - baselineRank);
+    if (distance === 0) continue;
+    distances.push(distance);
+    const current = byFace.get(item.face) ?? { face: item.face, count: 0, totalDistance: 0 };
+    current.count += 1;
+    current.totalDistance += distance;
+    byFace.set(item.face, current);
+  }
+  return {
+    movedCount: distances.length,
+    movedRate: visible.length ? distances.length / visible.length : 0,
+    movedDistanceP50: quantile(distances, 0.5) ?? 0,
+    movedDistanceP95: quantile(distances, 0.95) ?? 0,
+    movedByFace: [...byFace.values()]
+      .map((entry) => ({
+        ...entry,
+        averageDistance: entry.count ? entry.totalDistance / entry.count : 0,
+      }))
+      .sort((a, b) => b.count - a.count),
+  };
+}
+
+function analyzeTarget(target) {
+  const splitAt = target.indexOf(":");
+  if (splitAt < 0) throw new Error(`Target must be model:signature, got ${target}`);
+  return {
+    model: target.slice(0, splitAt),
+    signature: target.slice(splitAt + 1),
+  };
+}
+
+async function analyze({ model, signature }) {
+  const items = await loadItems(model);
+  const visible = visibleItems(items, signature);
+  const interval = representativeInterval(signature);
+  const orderRotation = interval.start;
+  const overlapRotation = interval.midpoint;
+  const baselineOrder = tileOrder(visible, orderRotation, 4);
+  const candidate = adaptiveScreenOrder(visible, orderRotation, signature);
+  const baselineRanks = ranksForOrder(baselineOrder);
+  const candidateRanks = ranksForOrder(candidate.order);
+  const moved = movedSummary(visible, baselineRanks, candidateRanks);
+  const changed = changedOverlapDiff(visible, overlapRotation, baselineRanks, candidateRanks, candidate.scoreBySource);
+  return {
+    model,
+    signature,
+    orderRotation,
+    overlapRotation,
+    visibleLeaves: visible.length,
+    candidateTileCount: candidate.tileCount,
+    candidateCenteredRotY: candidate.centeredRotY,
+    candidateAnchoredCount: candidate.anchoredCount,
+    candidateAnchoredRate: visible.length ? candidate.anchoredCount / visible.length : 0,
+    ...moved,
+    changedOverlap: changed,
+  };
+}
+
+function renderMarkdown(rows) {
+  const lines = [];
+  lines.push("# Voxel Interval Order Diff");
+  lines.push("");
+  lines.push("Baseline: current tile4 row-major order. Candidate: adaptive screen-span phase order from A85/A87.");
+  lines.push("Orders are computed at the interval entry boundary; overlap contribution is measured at the interval midpoint.");
+  lines.push(`Max overlap items: ${maxOverlapItems}`);
+  lines.push("");
+  lines.push("| Model | Signature | RotY | Leaves | Cand tiles | Anchored % | Moved % | Moved p95 | Changed overlap % | Top changed pairs |");
+  lines.push("| --- | --- | ---: | ---: | ---: | ---: | ---: | ---: | ---: | --- |");
+  for (const row of rows) {
+    lines.push([
+      `| ${row.model}`,
+      row.signature,
+      fmt(row.orderRotation.rotY, 1),
+      row.visibleLeaves,
+      row.candidateTileCount,
+      fmt(row.candidateAnchoredRate * 100, 1),
+      fmt(row.movedRate * 100, 1),
+      fmt(row.movedDistanceP95, 0),
+      fmt(row.changedOverlap.changedAreaRate * 100, 1),
+      `${row.changedOverlap.topChangedPairAreas.slice(0, 3).map((entry) => `${entry.key} ${fmt(entry.rate * 100, 0)}%`).join(", ")} |`,
+    ].join(" | "));
+  }
+
+  for (const row of rows) {
+    lines.push("");
+    lines.push(`## ${row.model} ${row.signature}`);
+    lines.push("");
+    lines.push(`Order rotation: rotX=${fmt(row.orderRotation.rotX, 1)}, rotY=${fmt(row.orderRotation.rotY, 1)}; overlap rotation: rotY=${fmt(row.overlapRotation.rotY, 1)}; candidate centered rotY=${fmt(row.candidateCenteredRotY, 1)}.`);
+    lines.push("");
+    lines.push("Moved by face:");
+    lines.push("");
+    lines.push("| Face | Count | Avg distance |");
+    lines.push("| --- | ---: | ---: |");
+    for (const face of row.movedByFace) {
+      lines.push(`| ${face.face} | ${face.count} | ${fmt(face.averageDistance, 1)} |`);
+    }
+    lines.push("");
+    lines.push("Changed depth area:");
+    lines.push("");
+    lines.push("| Direction | Area share |");
+    lines.push("| --- | ---: |");
+    for (const entry of row.changedOverlap.changedDepthAreas) {
+      lines.push(`| ${entry.key} | ${fmt(entry.rate * 100, 1)}% |`);
+    }
+    lines.push("");
+    lines.push("Top changed leaves:");
+    lines.push("");
+    lines.push("| Source | Face | Primitive | Move | Tile span | Changed area |");
+    lines.push("| ---: | --- | ---: | ---: | ---: | ---: |");
+    for (const item of row.changedOverlap.topChangedItems) {
+      lines.push([
+        `| ${item.sourceIndex}`,
+        item.face,
+        fmt(item.primitive, 0),
+        fmt(item.movedDistance, 0),
+        fmt(item.tile3SpanScore, 2),
+        `${fmt(item.changedArea, 0)} |`,
+      ].join(" | "));
+    }
+  }
+  return `${lines.join("\n")}\n`;
+}
+
+const rows = [];
+for (const target of targets.map(analyzeTarget)) {
+  console.log(`[order-diff] ${target.model} ${target.signature}`);
+  rows.push(await analyze(target));
+}
+
+const output = {
+  generatedAt: new Date().toISOString(),
+  maxOverlapItems,
+  targets,
+  rows,
+};
+const jsonPath = join(resultDir, `${outLabel}.json`);
+const mdPath = join(resultDir, `${outLabel}.md`);
+await writeFile(jsonPath, JSON.stringify(output, null, 2));
+await writeFile(mdPath, renderMarkdown(rows));
+
+console.log(`[order-diff] wrote ${jsonPath}`);
+console.log(`[order-diff] wrote ${mdPath}`);
+console.log(renderMarkdown(rows));
diff --git a/bench/voxel-interval-profiler.mjs b/bench/voxel-interval-profiler.mjs
new file mode 100644
index 00000000..4000d61a
--- /dev/null
+++ b/bench/voxel-interval-profiler.mjs
@@ -0,0 +1,374 @@
+#!/usr/bin/env node
+import { createServer } from "node:http";
+import { mkdirSync, writeFileSync } from "node:fs";
+import { readFile } from "node:fs/promises";
+import { dirname, extname, resolve } from "node:path";
+import { fileURLToPath } from "node:url";
+import { chromium } from "playwright";
+import { normalFacesCamera } from "../packages/core/dist/index.js";
+import { PRESETS } from "./perf-shared.mjs";
+import { chromiumArgsWithGpuDefault } from "./chromium-defaults.mjs";
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const repoRoot = resolve(__dirname, "..");
+const benchDir = resolve(repoRoot, "bench");
+const galleryDir = resolve(repoRoot, "website/public/gallery");
+
+const argv = process.argv.slice(2);
+const flag = (name) => argv.indexOf(`--${name}`);
+const optStr = (name, dflt = "") => {
+  const i = flag(name);
+  return i >= 0 ? argv[i + 1] : dflt;
+};
+const optAll = (name) => {
+  const values = [];
+  for (let i = 0; i < argv.length; i += 1) {
+    const arg = argv[i];
+    if (arg === `--${name}` && argv[i + 1]) {
+      values.push(argv[i + 1]);
+      i += 1;
+    } else if (arg.startsWith(`--${name}=`)) {
+      values.push(arg.slice(name.length + 3));
+    }
+  }
+  return values;
+};
+const optNum = (name, dflt) => {
+  const v = optStr(name);
+  return v ? Number(v) : dflt;
+};
+const hasFlag = (name) => flag(name) >= 0;
+
+const MESH = optStr("mesh", "garden");
+const MODE = optStr("mode", "baked");
+const MOTION = optStr("motion", "rot");
+const RENDERER = optStr("renderer", "vanilla");
+const WARMUP_MS = optNum("warmup", 1500);
+const SAMPLE_MS = optNum("sample", 8000);
+const RUNS = optNum("runs", 1);
+const LABEL = optStr("label");
+const PAGE_QUERY = optStr("page-query");
+const STRATEGY = optStr("strategy", PAGE_QUERY ? "candidate" : "baseline");
+const HEADED = hasFlag("headed");
+const JSON_ONLY = hasFlag("json");
+const BROWSER_EXECUTABLE = optStr("browser-executable");
+const SOFTWARE_BACKEND = hasFlag("software-backend");
+const CHROMIUM_ARGS = chromiumArgsWithGpuDefault([
+  ...optAll("chromium-arg"),
+  ...optAll("chromium-args").flatMap((value) => value.split(/\s+/).filter(Boolean)),
+], { softwareBackend: SOFTWARE_BACKEND });
+
+const MIME = {
+  ".html": "text/html; charset=utf-8",
+  ".js": "application/javascript; charset=utf-8",
+  ".mjs": "application/javascript; charset=utf-8",
+  ".css": "text/css; charset=utf-8",
+  ".json": "application/json; charset=utf-8",
+  ".obj": "text/plain; charset=utf-8",
+  ".mtl": "text/plain; charset=utf-8",
+  ".png": "image/png",
+  ".jpg": "image/jpeg",
+  ".jpeg": "image/jpeg",
+  ".gltf": "application/json; charset=utf-8",
+  ".glb": "model/gltf-binary",
+  ".vox": "application/octet-stream",
+};
+
+const FACE_NORMALS = {
+  t: [0, 0, 1],
+  b: [0, 0, -1],
+  fl: [0, 1, 0],
+  br: [0, -1, 0],
+  fr: [1, 0, 0],
+  bl: [-1, 0, 0],
+};
+
+const FACE_ORDER = ["t", "b", "bl", "br", "fr", "fl"];
+
+function startServer() {
+  return new Promise((resolveStart, rejectStart) => {
+    const server = createServer(async (req, res) => {
+      try {
+        const u = new URL(req.url, "http://localhost");
+        const safe = u.pathname.replace(/\/+/g, "/");
+        if (safe.includes("..")) {
+          res.writeHead(403);
+          res.end();
+          return;
+        }
+        const abs = safe === "/" || safe === ""
+          ? resolve(benchDir, "perf.html")
+          : safe.startsWith("/gallery/")
+            ? resolve(galleryDir, safe.slice("/gallery/".length))
+            : resolve(benchDir, safe.slice(1));
+        const data = await readFile(abs);
+        res.writeHead(200, {
+          "Content-Type": MIME[extname(abs).toLowerCase()] || "application/octet-stream",
+          "Cache-Control": "no-store",
+        });
+        res.end(data);
+      } catch (err) {
+        res.writeHead(404);
+        res.end(String(err?.message ?? err));
+      }
+    });
+    server.on("error", rejectStart);
+    server.listen(0, "127.0.0.1", () => {
+      const addr = server.address();
+      resolveStart({ server, port: typeof addr === "object" ? addr.port : 0 });
+    });
+  });
+}
+
+function stopServer(server) {
+  return new Promise((resolveStop) => server.close(resolveStop));
+}
+
+function quantile(values, q) {
+  const sorted = values.filter(Number.isFinite).sort((a, b) => a - b);
+  if (sorted.length === 0) return null;
+  const i = (sorted.length - 1) * q;
+  const lo = Math.floor(i);
+  const hi = Math.ceil(i);
+  if (lo === hi) return sorted[lo];
+  return sorted[lo] + (sorted[hi] - sorted[lo]) * (i - lo);
+}
+
+function median(values) {
+  return quantile(values, 0.5);
+}
+
+function fmt(value, digits = 1) {
+  return Number.isFinite(value) ? value.toFixed(digits) : "";
+}
+
+function visibleFaceSignature(rotX, rotY) {
+  const visible = [];
+  for (const face of FACE_ORDER) {
+    if (normalFacesCamera(FACE_NORMALS[face], { rotX, rotY })) visible.push(face);
+  }
+  return visible.join("|");
+}
+
+function bucketName(dt, baseFrameMs) {
+  const ratio = Math.max(1, Math.round(dt / baseFrameMs));
+  return ratio >= 4 ? "x4_plus" : `x${ratio}`;
+}
+
+function estimateBaseFrameMs(dts) {
+  const p10 = quantile(dts, 0.1) ?? 16.667;
+  return p10 < 12 ? 8.333 : 16.667;
+}
+
+function summarizeFrames(frames) {
+  const dts = frames.map((frame) => frame.dt);
+  const p50 = median(dts) ?? 0;
+  const p95 = quantile(dts, 0.95) ?? 0;
+  const p99 = quantile(dts, 0.99) ?? 0;
+  const buckets = { x1: 0, x2: 0, x3: 0, x4_plus: 0 };
+  for (const frame of frames) buckets[frame.bucket] = (buckets[frame.bucket] ?? 0) + 1;
+  return {
+    frames: frames.length,
+    fps_p50: p50 > 0 ? +(1000 / p50).toFixed(2) : 0,
+    fps_p95: p95 > 0 ? +(1000 / p95).toFixed(2) : 0,
+    frame_time_p50_ms: +p50.toFixed(3),
+    frame_time_p95_ms: +p95.toFixed(3),
+    frame_time_p99_ms: +p99.toFixed(3),
+    buckets,
+  };
+}
+
+function normalizeRotY(rotY) {
+  const normalized = rotY % 360;
+  return normalized < 0 ? normalized + 360 : normalized;
+}
+
+function frameRotation(preset, absoluteSampleIndex) {
+  if (MOTION !== "rot") return { rotX: preset.rotX, rotY: preset.rotY };
+  return {
+    rotX: preset.rotX,
+    rotY: normalizeRotY(preset.rotY + absoluteSampleIndex * 0.5),
+  };
+}
+
+function frameRows(samples, startIdx, preset) {
+  const raw = samples
+    .map((sample, index) => ({ sample, absoluteSampleIndex: startIdx + index }))
+    .filter(({ sample }) => Number.isFinite(sample?.dt) && sample.dt > 0 && sample.dt < 2000);
+  const baseFrameMs = estimateBaseFrameMs(raw.map(({ sample }) => sample.dt));
+  return {
+    baseFrameMs,
+    frames: raw.map(({ sample, absoluteSampleIndex }, index) => {
+      const rotation = frameRotation(preset, absoluteSampleIndex);
+      return {
+        index,
+        absoluteSampleIndex,
+        t: sample.t,
+        dt: sample.dt,
+        bucket: bucketName(sample.dt, baseFrameMs),
+        rotX: rotation.rotX,
+        rotY: rotation.rotY,
+        signature: visibleFaceSignature(rotation.rotX, rotation.rotY),
+      };
+    }),
+  };
+}
+
+function segmentFrames(frames) {
+  const segments = [];
+  let current = null;
+  for (const frame of frames) {
+    if (!current || current.signature !== frame.signature) {
+      current = {
+        id: segments.length,
+        signature: frame.signature,
+        startFrame: frame.index,
+        endFrame: frame.index,
+        startRotY: frame.rotY,
+        endRotY: frame.rotY,
+        frames: [],
+      };
+      segments.push(current);
+    }
+    current.frames.push(frame);
+    current.endFrame = frame.index;
+    current.endRotY = frame.rotY;
+  }
+  return segments.map((segment) => ({
+    id: segment.id,
+    signature: segment.signature,
+    startFrame: segment.startFrame,
+    endFrame: segment.endFrame,
+    startRotY: +segment.startRotY.toFixed(3),
+    endRotY: +segment.endRotY.toFixed(3),
+    ...summarizeFrames(segment.frames),
+  }));
+}
+
+function groupBySignature(frames) {
+  const groups = new Map();
+  for (const frame of frames) {
+    const group = groups.get(frame.signature) ?? [];
+    group.push(frame);
+    groups.set(frame.signature, group);
+  }
+  return [...groups.entries()]
+    .map(([signature, group]) => ({ signature, ...summarizeFrames(group) }))
+    .sort((a, b) => FACE_ORDER.indexOf(a.signature) - FACE_ORDER.indexOf(b.signature));
+}
+
+function buildUrl(port) {
+  const params = new URLSearchParams({
+    mesh: MESH,
+    mode: MODE,
+    motion: MOTION,
+  });
+  const extra = PAGE_QUERY ? `&${PAGE_QUERY.replace(/^\?/, "")}` : "";
+  return `http://127.0.0.1:${port}/perf-${RENDERER}.html?${params.toString()}${extra}`;
+}
+
+async function runOnce(port, repeat) {
+  const preset = PRESETS[MESH];
+  if (!preset) throw new Error(`Unknown bench preset: ${MESH}`);
+
+  const launchOptions = { headless: !HEADED, args: CHROMIUM_ARGS };
+  if (BROWSER_EXECUTABLE) launchOptions.executablePath = BROWSER_EXECUTABLE;
+  const browser = await chromium.launch(launchOptions);
+  try {
+    const ctx = await browser.newContext({ viewport: { width: 1280, height: 800 } });
+    const page = await ctx.newPage();
+    await page.goto(buildUrl(port), { waitUntil: "load" });
+    await page.waitForFunction(() => window.__perf__?.ready === true, null, { timeout: 30000 });
+    await page.waitForTimeout(WARMUP_MS);
+    const startIdx = await page.evaluate(() => window.__perf__.samples.length);
+    await page.waitForTimeout(SAMPLE_MS);
+    const pageResult = await page.evaluate((from) => ({
+      samples: window.__perf__.samples.slice(from),
+      polyCount: window.__perf__.polyCount,
+      renderStats: window.__perf__.renderStats ?? null,
+    }), startIdx);
+    await ctx.close();
+
+    const { frames, baseFrameMs } = frameRows(pageResult.samples, startIdx, preset);
+    return {
+      repeat,
+      strategy: STRATEGY,
+      mesh: MESH,
+      renderer: RENDERER,
+      mode: MODE,
+      motion: MOTION,
+      pageQuery: PAGE_QUERY || null,
+      warmup_ms: WARMUP_MS,
+      sample_ms: SAMPLE_MS,
+      baseFrameMs: +baseFrameMs.toFixed(3),
+      ...summarizeFrames(frames),
+      polyCount: pageResult.polyCount,
+      renderStats: pageResult.renderStats,
+      segments: segmentFrames(frames),
+      signatures: groupBySignature(frames),
+    };
+  } finally {
+    await browser.close();
+  }
+}
+
+function printRun(run) {
+  console.log(
+    `[intervals] ${run.strategy} ${run.mesh} r${run.repeat} p50=${fmt(run.fps_p50)} p95=${fmt(run.fps_p95)} p99=${fmt(run.frame_time_p99_ms)}ms base=${fmt(run.baseFrameMs, 3)}ms`,
+  );
+  console.log("| Segment | Signature | RotY | Frames | p95 FPS | p99 ms | x1 | x2 | x3 | x4+ |");
+  console.log("| ---: | --- | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: |");
+  for (const segment of run.segments) {
+    if (segment.frames < 8) continue;
+    console.log([
+      `| ${segment.id}`,
+      segment.signature,
+      `${fmt(segment.startRotY)}-${fmt(segment.endRotY)}`,
+      segment.frames,
+      fmt(segment.fps_p95),
+      fmt(segment.frame_time_p99_ms),
+      segment.buckets.x1,
+      segment.buckets.x2,
+      segment.buckets.x3,
+      `${segment.buckets.x4_plus} |`,
+    ].join(" | "));
+  }
+}
+
+const { server, port } = await startServer();
+try {
+  if (!JSON_ONLY) {
+    console.log(`[intervals] server :${port}`);
+    console.log(`[intervals] mesh=${MESH} renderer=${RENDERER} mode=${MODE} motion=${MOTION} strategy=${STRATEGY} runs=${RUNS} warmup=${WARMUP_MS}ms sample=${SAMPLE_MS}ms`);
+  }
+  const runs = [];
+  for (let repeat = 1; repeat <= RUNS; repeat += 1) {
+    const run = await runOnce(port, repeat);
+    runs.push(run);
+    if (!JSON_ONLY) printRun(run);
+  }
+  const out = {
+    mesh: MESH,
+    strategy: STRATEGY,
+    renderer: RENDERER,
+    mode: MODE,
+    motion: MOTION,
+    pageQuery: PAGE_QUERY || null,
+    browserExecutable: BROWSER_EXECUTABLE || null,
+    chromiumArgs: CHROMIUM_ARGS,
+    softwareBackend: SOFTWARE_BACKEND,
+    warmup_ms: WARMUP_MS,
+    sample_ms: SAMPLE_MS,
+    runs,
+  };
+  if (LABEL) {
+    const dir = resolve(repoRoot, "bench/results");
+    mkdirSync(dir, { recursive: true });
+    const file = resolve(dir, `${LABEL}.json`);
+    writeFileSync(file, JSON.stringify(out, null, 2) + "\n");
+    if (!JSON_ONLY) console.log(`[intervals] wrote ${file}`);
+  }
+  if (JSON_ONLY) console.log(JSON.stringify(out, null, 2));
+} finally {
+  await stopServer(server);
+}
diff --git a/bench/voxel-interval-screen-metrics.mjs b/bench/voxel-interval-screen-metrics.mjs
new file mode 100644
index 00000000..ddf8be5c
--- /dev/null
+++ b/bench/voxel-interval-screen-metrics.mjs
@@ -0,0 +1,452 @@
+#!/usr/bin/env node
+import { readFile, writeFile } from "node:fs/promises";
+import { basename, join, resolve } from "node:path";
+import {
+  BASE_TILE,
+  normalFacesCamera,
+  parseVox,
+  rotateVec3,
+} from "../packages/core/dist/index.js";
+import { PRESETS } from "./perf-shared.mjs";
+
+const repoRoot = resolve(import.meta.dirname, "..");
+const resultDir = resolve(repoRoot, "bench/results");
+const galleryDir = resolve(repoRoot, "website/public");
+
+const FACE_NORMALS = {
+  t: [0, 0, 1],
+  b: [0, 0, -1],
+  fl: [0, 1, 0],
+  br: [0, -1, 0],
+  fr: [1, 0, 0],
+  bl: [-1, 0, 0],
+};
+
+const FACE_BY_NORMAL = new Map([
+  ["0,0,1", "t"],
+  ["0,0,-1", "b"],
+  ["0,1,0", "fl"],
+  ["0,-1,0", "br"],
+  ["1,0,0", "fr"],
+  ["-1,0,0", "bl"],
+]);
+
+const args = parseArgs(process.argv.slice(2));
+const labels = args.labels.length ? args.labels : [
+  "a155-interval-current-ancient-crash-site",
+  "a155-interval-current-obj-house3",
+  "a155-interval-current-scene-mechanic2",
+];
+const angleStep = Number(args.angleStep ?? 5);
+const outLabel = args.out ?? "a155-interval-screen-metrics";
+
+function parseArgs(argv) {
+  const out = { labels: [] };
+  for (const arg of argv) {
+    if (arg.startsWith("--labels=")) {
+      out.labels.push(...arg.slice("--labels=".length).split(",").map((value) => value.trim()).filter(Boolean));
+    } else if (arg.startsWith("--angle-step=")) {
+      out.angleStep = arg.slice("--angle-step=".length);
+    } else if (arg.startsWith("--out=")) {
+      out.out = arg.slice("--out=".length);
+    } else if (!arg.startsWith("--")) {
+      out.labels.push(arg);
+    }
+  }
+  return out;
+}
+
+function quantile(values, q) {
+  const sorted = values.filter(Number.isFinite).sort((a, b) => a - b);
+  if (!sorted.length) return 0;
+  const i = (sorted.length - 1) * q;
+  const lo = Math.floor(i);
+  const hi = Math.ceil(i);
+  if (lo === hi) return sorted[lo];
+  return sorted[lo] + (sorted[hi] - sorted[lo]) * (i - lo);
+}
+
+function median(values) {
+  return quantile(values, 0.5);
+}
+
+function fmt(value, digits = 1) {
+  return Number.isFinite(value) ? value.toFixed(digits) : "";
+}
+
+function cssNormalForPolygon(polygon) {
+  const vertices = polygon.vertices;
+  if (vertices.length < 3) return null;
+  const v0 = vertices[0];
+  let nx = 0;
+  let ny = 0;
+  let nz = 0;
+  for (let i = 1; i + 1 < vertices.length; i += 1) {
+    const v1 = vertices[i];
+    const v2 = vertices[i + 1];
+    const e1x = v1[1] - v0[1];
+    const e1y = v1[0] - v0[0];
+    const e1z = v1[2] - v0[2];
+    const e2x = v2[1] - v0[1];
+    const e2y = v2[0] - v0[0];
+    const e2z = v2[2] - v0[2];
+    nx -= e1y * e2z - e1z * e2y;
+    ny -= e1z * e2x - e1x * e2z;
+    nz -= e1x * e2y - e1y * e2x;
+  }
+  const len = Math.hypot(nx, ny, nz);
+  if (len <= 1e-9) return null;
+  return [
+    Math.round(nx / len),
+    Math.round(ny / len),
+    Math.round(nz / len),
+  ];
+}
+
+function itemForPolygon(polygon, sourceIndex) {
+  if (polygon.texture || polygon.material || polygon.uvs || polygon.textureTriangles) return null;
+  if (polygon.vertices.length !== 4) return null;
+  const normal = cssNormalForPolygon(polygon);
+  const face = normal ? FACE_BY_NORMAL.get(normal.join(",")) : undefined;
+  if (!face) return null;
+
+  let minX = Infinity;
+  let minY = Infinity;
+  let minZ = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  let maxZ = -Infinity;
+  for (const v of polygon.vertices) {
+    minX = Math.min(minX, v[0]);
+    minY = Math.min(minY, v[1]);
+    minZ = Math.min(minZ, v[2]);
+    maxX = Math.max(maxX, v[0]);
+    maxY = Math.max(maxY, v[1]);
+    maxZ = Math.max(maxZ, v[2]);
+  }
+
+  const base = { face, sourceIndex };
+  const eps = 1e-6;
+  if (Math.abs(maxZ - minZ) <= eps) {
+    return {
+      ...base,
+      axis: "z",
+      left: minY * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: minZ * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxX - minX) <= eps) {
+    return {
+      ...base,
+      axis: "x",
+      left: minY * BASE_TILE,
+      top: minZ * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      z: -minX * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxY - minY) <= eps) {
+    return {
+      ...base,
+      axis: "y",
+      left: minZ * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: -minY * BASE_TILE,
+    };
+  }
+  return null;
+}
+
+function itemCorners(item) {
+  if (item.axis === "x") {
+    return [
+      [item.left, -item.z, item.top],
+      [item.left + item.width, -item.z, item.top],
+      [item.left + item.width, -item.z, item.top + item.height],
+      [item.left, -item.z, item.top + item.height],
+    ];
+  }
+  if (item.axis === "y") {
+    return [
+      [-item.z, item.top, item.left],
+      [-item.z, item.top, item.left + item.width],
+      [-item.z, item.top + item.height, item.left + item.width],
+      [-item.z, item.top + item.height, item.left],
+    ];
+  }
+  return [
+    [item.left, item.top, item.z],
+    [item.left + item.width, item.top, item.z],
+    [item.left + item.width, item.top + item.height, item.z],
+    [item.left, item.top + item.height, item.z],
+  ];
+}
+
+function itemCenter(item) {
+  if (item.axis === "x") return [item.left + item.width / 2, -item.z, item.top + item.height / 2];
+  if (item.axis === "y") return [-item.z, item.top + item.height / 2, item.left + item.width / 2];
+  return [item.left + item.width / 2, item.top + item.height / 2, item.z];
+}
+
+function projectedCenter(item, rotation) {
+  const [x, y] = rotateVec3(itemCenter(item), rotation.rotX, 0, rotation.rotY);
+  return { x, y };
+}
+
+function tileScanlineOrder(items, rotation) {
+  const entries = items.map((item) => ({ item, ...projectedCenter(item, rotation) }));
+  if (!entries.length) return [];
+  const minX = Math.min(...entries.map((entry) => entry.x));
+  const maxX = Math.max(...entries.map((entry) => entry.x));
+  const minY = Math.min(...entries.map((entry) => entry.y));
+  const maxY = Math.max(...entries.map((entry) => entry.y));
+  const spanX = Math.max(1e-6, maxX - minX);
+  const spanY = Math.max(1e-6, maxY - minY);
+  const tiles = new Map();
+  for (const entry of entries) {
+    const tx = Math.min(3, Math.max(0, Math.floor(((entry.x - minX) / spanX) * 4)));
+    const ty = Math.min(3, Math.max(0, Math.floor(((entry.y - minY) / spanY) * 4)));
+    const key = `${tx}:${ty}`;
+    const tile = tiles.get(key) ?? { tx, ty, sourceIndex: entry.item.sourceIndex, items: [] };
+    tile.items.push(entry.item);
+    tile.sourceIndex = Math.min(tile.sourceIndex, entry.item.sourceIndex);
+    tiles.set(key, tile);
+  }
+  return [...tiles.values()]
+    .sort((a, b) => (a.ty - b.ty) || (a.tx - b.tx) || a.sourceIndex - b.sourceIndex)
+    .flatMap((tile) => tile.items);
+}
+
+function polygonArea(points) {
+  let sum = 0;
+  for (let i = 0; i < points.length; i += 1) {
+    const a = points[i];
+    const b = points[(i + 1) % points.length];
+    sum += a.x * b.y - b.x * a.y;
+  }
+  return Math.abs(sum) / 2;
+}
+
+function projectedBounds(item, rotation, order) {
+  const points = itemCorners(item).map((point) => {
+    const [x, y, z] = rotateVec3(point, rotation.rotX, 0, rotation.rotY);
+    return { x, y, z };
+  });
+  const minX = Math.min(...points.map((point) => point.x));
+  const maxX = Math.max(...points.map((point) => point.x));
+  const minY = Math.min(...points.map((point) => point.y));
+  const maxY = Math.max(...points.map((point) => point.y));
+  return {
+    face: item.face,
+    order,
+    minX,
+    maxX,
+    minY,
+    maxY,
+    depth: points.reduce((sum, point) => sum + point.z, 0) / points.length,
+    boundsArea: Math.max(0, maxX - minX) * Math.max(0, maxY - minY),
+    quadArea: polygonArea(points),
+  };
+}
+
+function visibleFaceSignature(rotation) {
+  return Object.entries(FACE_NORMALS)
+    .filter(([, normal]) => normalFacesCamera(normal, rotation))
+    .map(([face]) => face)
+    .join("|");
+}
+
+function rotationsForSignature(signature) {
+  const rotations = [];
+  for (let rotY = 0; rotY < 360; rotY += angleStep) {
+    const rotation = { rotX: 65, rotY };
+    if (visibleFaceSignature(rotation) === signature) rotations.push(rotation);
+  }
+  return rotations.length ? rotations : [{ rotX: 65, rotY: 45 }];
+}
+
+function overlapMetrics(projected) {
+  const sorted = projected.map((rect, index) => ({ ...rect, index })).sort((a, b) => a.minX - b.minX);
+  const active = [];
+  let pairs = 0;
+  let area = 0;
+  let invAsc = 0;
+  let invDesc = 0;
+  let ties = 0;
+  const facePairAreas = new Map();
+  for (const current of sorted) {
+    for (let i = active.length - 1; i >= 0; i -= 1) {
+      if (active[i].maxX <= current.minX) active.splice(i, 1);
+    }
+    for (const other of active) {
+      if (other.maxY <= current.minY || other.minY >= current.maxY) continue;
+      const x0 = Math.max(current.minX, other.minX);
+      const x1 = Math.min(current.maxX, other.maxX);
+      const y0 = Math.max(current.minY, other.minY);
+      const y1 = Math.min(current.maxY, other.maxY);
+      if (x1 <= x0 || y1 <= y0) continue;
+      const overlapArea = (x1 - x0) * (y1 - y0);
+      pairs += 1;
+      area += overlapArea;
+      const pair = [current.face, other.face].sort().join("+");
+      facePairAreas.set(pair, (facePairAreas.get(pair) ?? 0) + overlapArea);
+      const orderDelta = current.order - other.order;
+      const depthDelta = current.depth - other.depth;
+      if (Math.abs(depthDelta) <= 0.5) {
+        ties += 1;
+      } else {
+        if ((orderDelta < 0) !== (depthDelta < 0)) invAsc += 1;
+        if ((orderDelta < 0) !== (depthDelta > 0)) invDesc += 1;
+      }
+    }
+    active.push(current);
+  }
+  const topPair = [...facePairAreas.entries()].sort((a, b) => b[1] - a[1])[0] ?? null;
+  return {
+    pairs,
+    area,
+    invAsc,
+    invDesc,
+    ties,
+    topPair: topPair ? { pair: topPair[0], areaRate: area ? topPair[1] / area : 0 } : null,
+  };
+}
+
+function mergeRows(rows) {
+  return {
+    active: median(rows.map((row) => row.active)),
+    boundsFill: median(rows.map((row) => row.boundsFill)),
+    quadFill: median(rows.map((row) => row.quadFill)),
+    overlapPairsPerLeaf: median(rows.map((row) => row.overlapPairsPerLeaf)),
+    overlapAreaPerLeaf: median(rows.map((row) => row.overlapAreaPerLeaf)),
+    invAscRate: median(rows.map((row) => row.invAscRate)),
+    invDescRate: median(rows.map((row) => row.invDescRate)),
+    minInvRate: median(rows.map((row) => Math.min(row.invAscRate, row.invDescRate))),
+    screenArea: median(rows.map((row) => row.screenArea)),
+    topPair: topPair(rows.map((row) => row.topPair)),
+  };
+}
+
+function topPair(pairs) {
+  const scores = new Map();
+  for (const pair of pairs) {
+    if (!pair) continue;
+    scores.set(pair.pair, (scores.get(pair.pair) ?? 0) + pair.areaRate);
+  }
+  const best = [...scores.entries()].sort((a, b) => b[1] - a[1])[0];
+  return best ? { pair: best[0], areaRate: best[1] / Math.max(1, pairs.filter(Boolean).length) } : null;
+}
+
+function geometryForSignature(items, signature) {
+  const faces = new Set(signature.split("|").filter(Boolean));
+  const visible = items.filter((item) => faces.has(item.face));
+  const rows = rotationsForSignature(signature).map((rotation) => {
+    const ordered = tileScanlineOrder(visible, rotation);
+    const ranks = new Map(ordered.map((item, index) => [item.sourceIndex, index]));
+    const projected = visible.map((item) => projectedBounds(item, rotation, ranks.get(item.sourceIndex) ?? item.sourceIndex));
+    const minX = Math.min(...projected.map((rect) => rect.minX));
+    const maxX = Math.max(...projected.map((rect) => rect.maxX));
+    const minY = Math.min(...projected.map((rect) => rect.minY));
+    const maxY = Math.max(...projected.map((rect) => rect.maxY));
+    const screenArea = Math.max(1e-6, (maxX - minX) * (maxY - minY));
+    const boundsArea = projected.reduce((sum, rect) => sum + rect.boundsArea, 0);
+    const quadArea = projected.reduce((sum, rect) => sum + rect.quadArea, 0);
+    const overlap = overlapMetrics(projected);
+    return {
+      active: visible.length,
+      screenArea,
+      boundsFill: boundsArea / screenArea,
+      quadFill: quadArea / screenArea,
+      overlapPairsPerLeaf: visible.length ? overlap.pairs / visible.length : 0,
+      overlapAreaPerLeaf: visible.length ? overlap.area / visible.length : 0,
+      invAscRate: overlap.pairs ? overlap.invAsc / overlap.pairs : 0,
+      invDescRate: overlap.pairs ? overlap.invDesc / overlap.pairs : 0,
+      topPair: overlap.topPair,
+    };
+  });
+  return mergeRows(rows);
+}
+
+async function loadItems(mesh) {
+  const preset = PRESETS[mesh];
+  if (!preset) throw new Error(`No preset for ${mesh}`);
+  const path = resolve(galleryDir, preset.url.replace(/^\//, ""));
+  const bytes = await readFile(path);
+  const parsed = parseVox(
+    bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength),
+    { targetSize: preset.options?.targetSize ?? 70, gridShift: 0 },
+  );
+  return parsed.polygons
+    .map((polygon, sourceIndex) => itemForPolygon(polygon, sourceIndex))
+    .filter((item) => item && item.width > 0 && item.height > 0);
+}
+
+async function analyzeLabel(label) {
+  const data = JSON.parse(await readFile(resolve(resultDir, `${label}.json`), "utf8"));
+  const items = await loadItems(data.mesh);
+  const run = data.runs[0];
+  return run.signatures.map((signatureRow) => ({
+    label,
+    mesh: data.mesh,
+    signature: signatureRow.signature,
+    fpsP95: signatureRow.fps_p95,
+    p99: signatureRow.frame_time_p99_ms,
+    x1: signatureRow.buckets.x1,
+    x2: signatureRow.buckets.x2,
+    x3: signatureRow.buckets.x3,
+    x4Plus: signatureRow.buckets.x4_plus,
+    geometry: geometryForSignature(items, signatureRow.signature),
+  }));
+}
+
+function renderMarkdown(rows) {
+  const lines = [
+    "# Voxel Interval Screen Metrics",
+    "",
+    `Angle step: ${angleStep}`,
+    "",
+    "| Mesh | Signature | p95 FPS | p99 ms | Active | Bounds fill | Overlap/leaf | Asc inv % | Desc inv % | Top pair | Pair % | x1 | x2 | x3 | x4+ |",
+    "| --- | --- | ---: | ---: | ---: | ---: | ---: | ---: | ---: | --- | ---: | ---: | ---: | ---: | ---: |",
+  ];
+  for (const row of rows) {
+    lines.push([
+      `| ${row.mesh}`,
+      row.signature,
+      fmt(row.fpsP95),
+      fmt(row.p99),
+      fmt(row.geometry.active, 0),
+      fmt(row.geometry.boundsFill, 2),
+      fmt(row.geometry.overlapPairsPerLeaf, 2),
+      fmt(row.geometry.invAscRate * 100, 1),
+      fmt(row.geometry.invDescRate * 100, 1),
+      row.geometry.topPair?.pair ?? "",
+      fmt((row.geometry.topPair?.areaRate ?? 0) * 100, 0),
+      row.x1,
+      row.x2,
+      row.x3,
+      `${row.x4Plus} |`,
+    ].join(" | "));
+  }
+  return `${lines.join("\n")}\n`;
+}
+
+const rows = (await Promise.all(labels.map((label) => analyzeLabel(label)))).flat();
+const output = {
+  generatedAt: new Date().toISOString(),
+  labels,
+  angleStep,
+  rows,
+};
+const jsonPath = join(resultDir, `${outLabel}.json`);
+const mdPath = join(resultDir, `${outLabel}.md`);
+await writeFile(jsonPath, JSON.stringify(output, null, 2));
+await writeFile(mdPath, renderMarkdown(rows));
+console.log(renderMarkdown(rows));
+console.log(`Wrote ${jsonPath}`);
+console.log(`Wrote ${mdPath}`);
diff --git a/bench/voxel-occlusion-potential.mjs b/bench/voxel-occlusion-potential.mjs
new file mode 100644
index 00000000..796f9042
--- /dev/null
+++ b/bench/voxel-occlusion-potential.mjs
@@ -0,0 +1,333 @@
+#!/usr/bin/env node
+import { readFile, writeFile, mkdir } from "node:fs/promises";
+import { resolve, join } from "node:path";
+import {
+  BASE_TILE,
+  normalFacesCamera,
+  parseVox,
+  rotateVec3,
+} from "../packages/core/dist/index.js";
+import { PRESETS } from "./perf-shared.mjs";
+
+const repoRoot = resolve(import.meta.dirname, "..");
+const galleryDir = resolve(repoRoot, "website/public");
+const resultDir = resolve(repoRoot, "bench/results");
+
+const args = new Map(process.argv.slice(2).map((arg) => {
+  const [key, ...rest] = arg.replace(/^--/, "").split("=");
+  return [key, rest.length ? rest.join("=") : "true"];
+}));
+
+const MESHES = (args.get("meshes") ?? "obj-house3,ancient-crash-site,scene-mechanic2,Treasure,army,skyscraper")
+  .split(",")
+  .map((value) => value.trim())
+  .filter(Boolean);
+const ANGLE_STEP = Number(args.get("angle-step") ?? 10);
+const GRID_W = Number(args.get("grid-w") ?? 240);
+const GRID_H = Number(args.get("grid-h") ?? 160);
+const LABEL = args.get("label") ?? "";
+
+const FACE_NORMALS = {
+  t: [0, 0, 1],
+  b: [0, 0, -1],
+  fl: [0, 1, 0],
+  br: [0, -1, 0],
+  fr: [1, 0, 0],
+  bl: [-1, 0, 0],
+};
+
+const FACE_ORDER = ["t", "b", "bl", "br", "fr", "fl"];
+const FACE_BY_NORMAL = new Map([
+  ["0,0,1", "t"],
+  ["0,0,-1", "b"],
+  ["0,1,0", "fl"],
+  ["0,-1,0", "br"],
+  ["1,0,0", "fr"],
+  ["-1,0,0", "bl"],
+]);
+
+function quantile(values, q) {
+  const sorted = values.filter(Number.isFinite).sort((a, b) => a - b);
+  if (!sorted.length) return 0;
+  const i = (sorted.length - 1) * q;
+  const lo = Math.floor(i);
+  const hi = Math.ceil(i);
+  if (lo === hi) return sorted[lo];
+  return sorted[lo] + (sorted[hi] - sorted[lo]) * (i - lo);
+}
+
+function cssNormalForPolygon(polygon) {
+  const vertices = polygon.vertices;
+  if (vertices.length < 3) return null;
+  const v0 = vertices[0];
+  let nx = 0;
+  let ny = 0;
+  let nz = 0;
+  for (let i = 1; i + 1 < vertices.length; i += 1) {
+    const v1 = vertices[i];
+    const v2 = vertices[i + 1];
+    const e1x = v1[1] - v0[1];
+    const e1y = v1[0] - v0[0];
+    const e1z = v1[2] - v0[2];
+    const e2x = v2[1] - v0[1];
+    const e2y = v2[0] - v0[0];
+    const e2z = v2[2] - v0[2];
+    nx -= e1y * e2z - e1z * e2y;
+    ny -= e1z * e2x - e1x * e2z;
+    nz -= e1x * e2y - e1y * e2x;
+  }
+  const len = Math.hypot(nx, ny, nz);
+  if (len <= 1e-9) return null;
+  return [
+    Math.round(nx / len),
+    Math.round(ny / len),
+    Math.round(nz / len),
+  ];
+}
+
+function itemForPolygon(polygon, sourceIndex) {
+  if (polygon.texture || polygon.material || polygon.uvs || polygon.textureTriangles) return null;
+  if (polygon.vertices.length !== 4) return null;
+  const normal = cssNormalForPolygon(polygon);
+  const face = normal ? FACE_BY_NORMAL.get(normal.join(",")) : undefined;
+  if (!face) return null;
+
+  let minX = Infinity;
+  let minY = Infinity;
+  let minZ = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  let maxZ = -Infinity;
+  for (const v of polygon.vertices) {
+    minX = Math.min(minX, v[0]);
+    minY = Math.min(minY, v[1]);
+    minZ = Math.min(minZ, v[2]);
+    maxX = Math.max(maxX, v[0]);
+    maxY = Math.max(maxY, v[1]);
+    maxZ = Math.max(maxZ, v[2]);
+  }
+
+  const eps = 1e-6;
+  const base = { face, sourceIndex };
+  if (Math.abs(maxZ - minZ) <= eps) {
+    return {
+      ...base,
+      axis: "z",
+      left: minY * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: minZ * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxX - minX) <= eps) {
+    return {
+      ...base,
+      axis: "x",
+      left: minY * BASE_TILE,
+      top: minZ * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      z: -minX * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxY - minY) <= eps) {
+    return {
+      ...base,
+      axis: "y",
+      left: minZ * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: -minY * BASE_TILE,
+    };
+  }
+  return null;
+}
+
+function itemCorners(item) {
+  if (item.axis === "x") {
+    return [
+      [item.left, -item.z, item.top],
+      [item.left + item.width, -item.z, item.top],
+      [item.left + item.width, -item.z, item.top + item.height],
+      [item.left, -item.z, item.top + item.height],
+    ];
+  }
+  if (item.axis === "y") {
+    return [
+      [-item.z, item.top, item.left],
+      [-item.z, item.top, item.left + item.width],
+      [-item.z, item.top + item.height, item.left + item.width],
+      [-item.z, item.top + item.height, item.left],
+    ];
+  }
+  return [
+    [item.left, item.top, item.z],
+    [item.left + item.width, item.top, item.z],
+    [item.left + item.width, item.top + item.height, item.z],
+    [item.left, item.top + item.height, item.z],
+  ];
+}
+
+function visibleFaceSignature(rotX, rotY) {
+  const visible = [];
+  for (const face of FACE_ORDER) {
+    if (normalFacesCamera(FACE_NORMALS[face], { rotX, rotY })) visible.push(face);
+  }
+  return visible.join("|");
+}
+
+async function loadItems(meshId) {
+  const preset = PRESETS[meshId];
+  if (!preset) throw new Error(`Unknown preset ${meshId}`);
+  const path = resolve(galleryDir, preset.url.replace(/^\//, ""));
+  const bytes = await readFile(path);
+  const parsed = parseVox(
+    bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength),
+    { targetSize: preset.options?.targetSize ?? 70, gridShift: 0 },
+  );
+  const items = parsed.polygons
+    .map((polygon, sourceIndex) => itemForPolygon(polygon, sourceIndex))
+    .filter((item) => item && item.width > 0 && item.height > 0);
+  if (items.length !== parsed.polygons.length) throw new Error(`${meshId} has non-exact voxel polygons`);
+  return { preset, items };
+}
+
+function pointInConvex(point, poly) {
+  let sign = 0;
+  for (let i = 0; i < poly.length; i += 1) {
+    const a = poly[i];
+    const b = poly[(i + 1) % poly.length];
+    const cross = (b.x - a.x) * (point.y - a.y) - (b.y - a.y) * (point.x - a.x);
+    const nextSign = Math.sign(cross);
+    if (nextSign === 0) continue;
+    if (sign === 0) sign = nextSign;
+    else if (sign !== nextSign) return false;
+  }
+  return true;
+}
+
+function estimateAtAngle(items, rotX, rotY) {
+  const signature = visibleFaceSignature(rotX, rotY);
+  const visibleFaces = new Set(signature.split("|").filter(Boolean));
+  const projected = items
+    .filter((item) => visibleFaces.has(item.face))
+    .map((item) => {
+      const points = itemCorners(item).map((corner) => {
+        const [x, y, z] = rotateVec3(corner, rotX, 0, rotY);
+        return { x, y, z };
+      });
+      return {
+        item,
+        points,
+        depth: points.reduce((sum, point) => sum + point.z, 0) / points.length,
+        minX: Math.min(...points.map((point) => point.x)),
+        maxX: Math.max(...points.map((point) => point.x)),
+        minY: Math.min(...points.map((point) => point.y)),
+        maxY: Math.max(...points.map((point) => point.y)),
+      };
+    });
+  if (!projected.length) return { signature, active: 0, kept: 0, culled: 0, cullRatio: 0 };
+
+  const minX = Math.min(...projected.map((entry) => entry.minX));
+  const maxX = Math.max(...projected.map((entry) => entry.maxX));
+  const minY = Math.min(...projected.map((entry) => entry.minY));
+  const maxY = Math.max(...projected.map((entry) => entry.maxY));
+  const spanX = Math.max(1e-6, maxX - minX);
+  const spanY = Math.max(1e-6, maxY - minY);
+  const occupied = new Uint8Array(GRID_W * GRID_H);
+  let kept = 0;
+  let culled = 0;
+
+  const sorted = projected.sort((a, b) => b.depth - a.depth || a.item.sourceIndex - b.item.sourceIndex);
+  for (const entry of sorted) {
+    const gx0 = Math.max(0, Math.floor(((entry.minX - minX) / spanX) * GRID_W));
+    const gx1 = Math.min(GRID_W - 1, Math.ceil(((entry.maxX - minX) / spanX) * GRID_W));
+    const gy0 = Math.max(0, Math.floor(((entry.minY - minY) / spanY) * GRID_H));
+    const gy1 = Math.min(GRID_H - 1, Math.ceil(((entry.maxY - minY) / spanY) * GRID_H));
+    let hasPixel = false;
+    const cells = [];
+    for (let gy = gy0; gy <= gy1; gy += 1) {
+      const y = minY + ((gy + 0.5) / GRID_H) * spanY;
+      for (let gx = gx0; gx <= gx1; gx += 1) {
+        const x = minX + ((gx + 0.5) / GRID_W) * spanX;
+        if (!pointInConvex({ x, y }, entry.points)) continue;
+        const index = gy * GRID_W + gx;
+        cells.push(index);
+        if (!occupied[index]) hasPixel = true;
+      }
+    }
+    if (!hasPixel) {
+      culled += 1;
+      continue;
+    }
+    kept += 1;
+    for (const index of cells) occupied[index] = 1;
+  }
+
+  return {
+    signature,
+    active: projected.length,
+    kept,
+    culled,
+    cullRatio: projected.length ? culled / projected.length : 0,
+  };
+}
+
+function summarize(rows) {
+  const active = rows.map((row) => row.active);
+  const kept = rows.map((row) => row.kept);
+  const culled = rows.map((row) => row.culled);
+  const ratios = rows.map((row) => row.cullRatio);
+  return {
+    active_p50: quantile(active, 0.5),
+    kept_p50: quantile(kept, 0.5),
+    culled_p50: quantile(culled, 0.5),
+    cullRatio_p50: quantile(ratios, 0.5),
+    cullRatio_p95: quantile(ratios, 0.95),
+  };
+}
+
+const results = [];
+for (const mesh of MESHES) {
+  const { preset, items } = await loadItems(mesh);
+  const angles = [];
+  for (let offset = 0; offset < 360; offset += ANGLE_STEP) {
+    angles.push((preset.rotY + offset) % 360);
+  }
+  const rows = angles.map((rotY) => ({
+    mesh,
+    rotX: preset.rotX,
+    rotY,
+    ...estimateAtAngle(items, preset.rotX, rotY),
+  }));
+  const summary = summarize(rows);
+  results.push({ mesh, grid: [GRID_W, GRID_H], angleStep: ANGLE_STEP, summary, rows });
+}
+
+console.log("| Mesh | Active p50 | Kept p50 | Culled p50 | Cull p50 | Cull p95 |");
+console.log("| --- | ---: | ---: | ---: | ---: | ---: |");
+for (const result of results) {
+  console.log([
+    `| ${result.mesh}`,
+    result.summary.active_p50.toFixed(0),
+    result.summary.kept_p50.toFixed(0),
+    result.summary.culled_p50.toFixed(0),
+    `${(result.summary.cullRatio_p50 * 100).toFixed(1)}%`,
+    `${(result.summary.cullRatio_p95 * 100).toFixed(1)}% |`,
+  ].join(" | "));
+}
+
+if (LABEL) {
+  await mkdir(resultDir, { recursive: true });
+  const path = join(resultDir, `${LABEL}.json`);
+  await writeFile(path, `${JSON.stringify({
+    generatedAt: new Date().toISOString(),
+    meshes: MESHES,
+    angleStep: ANGLE_STEP,
+    grid: [GRID_W, GRID_H],
+    results,
+  }, null, 2)}\n`);
+  console.log(`Wrote ${path}`);
+}
diff --git a/bench/voxel-order-metrics.mjs b/bench/voxel-order-metrics.mjs
index 1f240644..35baca38 100644
--- a/bench/voxel-order-metrics.mjs
+++ b/bench/voxel-order-metrics.mjs
@@ -52,7 +52,44 @@ function sourceBlockDepthOrder(items, rotY, blockSize, front) {
     .flatMap((block) => block.items);
 }
 
+function projectedCenter(item, rotY) {
+  const point = projectPoint(itemCenter(item), rotY);
+  return { x: point.x, y: point.y };
+}
+
+function tileScanlineOrder(items, rotY, tileCount) {
+  const entries = items.map((item) => ({ item, ...projectedCenter(item, rotY) }));
+  if (entries.length === 0) return [];
+  const minX = Math.min(...entries.map((entry) => entry.x));
+  const maxX = Math.max(...entries.map((entry) => entry.x));
+  const minY = Math.min(...entries.map((entry) => entry.y));
+  const maxY = Math.max(...entries.map((entry) => entry.y));
+  const spanX = Math.max(1e-6, maxX - minX);
+  const spanY = Math.max(1e-6, maxY - minY);
+  const tiles = new Map();
+  for (const entry of entries) {
+    const tx = Math.min(tileCount - 1, Math.max(0, Math.floor(((entry.x - minX) / spanX) * tileCount)));
+    const ty = Math.min(tileCount - 1, Math.max(0, Math.floor(((entry.y - minY) / spanY) * tileCount)));
+    const key = `${tx}:${ty}`;
+    const tile = tiles.get(key) ?? { tx, ty, sourceIndex: entry.item.sourceIndex, items: [] };
+    tile.items.push(entry.item);
+    tile.sourceIndex = Math.min(tile.sourceIndex, entry.item.sourceIndex);
+    tiles.set(key, tile);
+  }
+  return [...tiles.values()]
+    .sort((a, b) => (a.ty - b.ty) || (a.tx - b.tx) || a.sourceIndex - b.sourceIndex)
+    .flatMap((tile) => tile.items);
+}
+
 const STRATEGIES = [
+  {
+    key: "tile4",
+    caseId: "polycss-voxlocal-direct-matrix-tile4-scanline-forward",
+    label: "Tile4 scanline",
+    order(items, rotY) {
+      return tileScanlineOrder(items, rotY, 4);
+    },
+  },
   {
     key: "exact",
     caseId: "polycss-voxlocal-direct-matrix-exact",
@@ -403,6 +440,7 @@ function projectedItem(item, order, rotY) {
     maxY,
     depth,
     area2d: polygonArea2(points),
+    boundsArea2d: Math.max(0, maxX - minX) * Math.max(0, maxY - minY),
     plane: planeFromProjected(points),
   };
 }
@@ -490,6 +528,14 @@ function analyzeProjected(projected) {
     active.push(current);
   }
 
+  const minX = Math.min(...projected.map((item) => item.minX));
+  const maxX = Math.max(...projected.map((item) => item.maxX));
+  const minY = Math.min(...projected.map((item) => item.minY));
+  const maxY = Math.max(...projected.map((item) => item.maxY));
+  const screenArea = Math.max(1e-6, (maxX - minX) * (maxY - minY));
+  const boundsAreaSum = projected.reduce((sum, item) => sum + item.boundsArea2d, 0);
+  const quadAreaSum = projected.reduce((sum, item) => sum + item.area2d, 0);
+
   let largestComponent = 0;
   const componentSizes = new Map();
   for (let i = 0; i < projected.length; i += 1) {
@@ -513,6 +559,11 @@ function analyzeProjected(projected) {
 
   return {
     activeLeaves: projected.length,
+    screenArea,
+    boundsAreaSum,
+    quadAreaSum,
+    projectedBoundsFill: boundsAreaSum / screenArea,
+    projectedQuadFill: quadAreaSum / screenArea,
     overlapPairs,
     overlapArea,
     invAsc,
@@ -531,6 +582,9 @@ function mergeMetricRows(rows) {
   const total = {
     samples: rows.length,
     activeLeaves: 0,
+    screenAreaMedian: median(rows.map((row) => row.screenArea)),
+    projectedBoundsFillMedian: median(rows.map((row) => row.projectedBoundsFill)),
+    projectedQuadFillMedian: median(rows.map((row) => row.projectedQuadFill)),
     overlapPairs: 0,
     overlapArea: 0,
     invAsc: 0,
@@ -664,8 +718,8 @@ function renderMarkdown(rows) {
     lines.push("");
     lines.push(`Polygons: ${row.polygons}; exact matrix items: ${row.exactItems}`);
     lines.push("");
-    lines.push("| Strategy | Runs | FPS p95 | Frame p99 | Active | Overlap/leaf | Min inv % | Asc inv % | Desc inv % | Cross % | Tie % | Max comp | Face switches | Depth jump |");
-    lines.push("| --- | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: |");
+    lines.push("| Strategy | Runs | FPS p95 | Frame p99 | Active | Bounds fill | Quad fill | Overlap/leaf | Min inv % | Asc inv % | Desc inv % | Cross % | Tie % | Max comp | Face switches | Depth jump |");
+    lines.push("| --- | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: |");
     for (const strategy of row.strategies) {
       const m = strategy.metrics;
       const b = strategy.bench;
@@ -675,6 +729,8 @@ function renderMarkdown(rows) {
         fmt(b?.fpsP95),
         fmt(b?.frameP99),
         fmt(m.activeLeavesMedian, 0),
+        fmt(m.projectedBoundsFillMedian, 2),
+        fmt(m.projectedQuadFillMedian, 2),
         fmt(m.overlapPairsPerLeaf, 2),
         fmt(m.minDepthInvRate * 100, 2),
         fmt(m.invAscRate * 100, 2),
diff --git a/bench/voxel-order-phase-metrics.mjs b/bench/voxel-order-phase-metrics.mjs
new file mode 100644
index 00000000..8c816a4c
--- /dev/null
+++ b/bench/voxel-order-phase-metrics.mjs
@@ -0,0 +1,598 @@
+#!/usr/bin/env node
+import { readFile, readdir, writeFile } from "node:fs/promises";
+import { basename, join, resolve } from "node:path";
+import {
+  BASE_TILE,
+  normalFacesCamera,
+  parseVox,
+  rotateVec3,
+} from "../packages/core/dist/index.js";
+
+const repoRoot = resolve(import.meta.dirname, "..");
+const galleryVoxDir = resolve(repoRoot, "website/public/gallery/vox");
+const resultDir = resolve(repoRoot, "bench/results");
+
+const FACE_NORMALS = {
+  t: [0, 0, 1],
+  b: [0, 0, -1],
+  fl: [0, 1, 0],
+  br: [0, -1, 0],
+  fr: [1, 0, 0],
+  bl: [-1, 0, 0],
+};
+
+const FACE_ORDER = ["t", "b", "bl", "br", "fr", "fl"];
+const FACE_BY_NORMAL = new Map([
+  ["0,0,1", "t"],
+  ["0,0,-1", "b"],
+  ["0,1,0", "fl"],
+  ["0,-1,0", "br"],
+  ["1,0,0", "fr"],
+  ["-1,0,0", "bl"],
+]);
+
+const DEFAULT_MODELS = [
+  "Garden.vox",
+  "desert2.vox",
+  "scene_mechanic2.vox",
+  "obj_house3.vox",
+  "Treasure.vox",
+  "skyscraper.vox",
+  "AncientCrashSite.vox",
+  "army.vox",
+];
+
+const args = parseArgs(process.argv.slice(2));
+const angleStep = Number(args.angleStep ?? 5);
+const targetSize = Number(args.targetSize ?? 60);
+const models = args.models.length ? args.models : DEFAULT_MODELS;
+
+const STRATEGIES = [
+  { key: "baseline", label: "Current", phase(rotation, signature) { return rotation; } },
+  { key: "offset30", label: "+30deg", phase(rotation) { return { ...rotation, rotY: rotation.rotY + 30 }; } },
+  {
+    key: "center",
+    label: "Centered interval",
+    phase(rotation, signature) {
+      return intervalPhase(rotation, signature, 0.5);
+    },
+  },
+  {
+    key: "frac033",
+    label: "Interval 0.33",
+    phase(rotation, signature) {
+      return intervalPhase(rotation, signature, 0.33);
+    },
+  },
+  {
+    key: "frac067",
+    label: "Interval 0.67",
+    phase(rotation, signature) {
+      return intervalPhase(rotation, signature, 0.67);
+    },
+  },
+];
+
+function parseArgs(argv) {
+  const out = { models: [], angleStep: null, targetSize: null };
+  for (const arg of argv) {
+    if (arg.startsWith("--angle-step=")) out.angleStep = arg.slice("--angle-step=".length);
+    else if (arg.startsWith("--target-size=")) out.targetSize = arg.slice("--target-size=".length);
+    else if (arg.startsWith("--models=")) {
+      out.models.push(...arg.slice("--models=".length).split(",").map((value) => value.trim()).filter(Boolean));
+    } else if (!arg.startsWith("--")) {
+      out.models.push(arg);
+    }
+  }
+  return out;
+}
+
+function canonicalModelKey(file) {
+  return basename(file, ".vox").replace(/[^a-z0-9]+/gi, "-").replace(/^-|-$/g, "").toLowerCase();
+}
+
+function quantile(values, q) {
+  const sorted = values.filter(Number.isFinite).sort((a, b) => a - b);
+  if (sorted.length === 0) return null;
+  const i = (sorted.length - 1) * q;
+  const lo = Math.floor(i);
+  const hi = Math.ceil(i);
+  if (lo === hi) return sorted[lo];
+  return sorted[lo] + (sorted[hi] - sorted[lo]) * (i - lo);
+}
+
+function median(values) {
+  return quantile(values, 0.5);
+}
+
+function fmt(value, digits = 2) {
+  return Number.isFinite(value) ? value.toFixed(digits) : "";
+}
+
+function cssNormalForPolygon(polygon) {
+  const vertices = polygon.vertices;
+  if (vertices.length < 3) return null;
+  const v0 = vertices[0];
+  let nx = 0;
+  let ny = 0;
+  let nz = 0;
+  for (let i = 1; i + 1 < vertices.length; i += 1) {
+    const v1 = vertices[i];
+    const v2 = vertices[i + 1];
+    const e1x = v1[1] - v0[1];
+    const e1y = v1[0] - v0[0];
+    const e1z = v1[2] - v0[2];
+    const e2x = v2[1] - v0[1];
+    const e2y = v2[0] - v0[0];
+    const e2z = v2[2] - v0[2];
+    nx -= e1y * e2z - e1z * e2y;
+    ny -= e1z * e2x - e1x * e2z;
+    nz -= e1x * e2y - e1y * e2x;
+  }
+  const len = Math.hypot(nx, ny, nz);
+  if (len <= 1e-9) return null;
+  return [
+    Math.round(nx / len),
+    Math.round(ny / len),
+    Math.round(nz / len),
+  ];
+}
+
+function matrixItemForPolygon(polygon, sourceIndex) {
+  if (polygon.texture || polygon.material || polygon.uvs || polygon.textureTriangles) return null;
+  if (polygon.vertices.length !== 4) return null;
+  const normal = cssNormalForPolygon(polygon);
+  const face = normal ? FACE_BY_NORMAL.get(normal.join(",")) : undefined;
+  if (!face) return null;
+
+  let minX = Infinity;
+  let minY = Infinity;
+  let minZ = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  let maxZ = -Infinity;
+  for (const v of polygon.vertices) {
+    minX = Math.min(minX, v[0]);
+    minY = Math.min(minY, v[1]);
+    minZ = Math.min(minZ, v[2]);
+    maxX = Math.max(maxX, v[0]);
+    maxY = Math.max(maxY, v[1]);
+    maxZ = Math.max(maxZ, v[2]);
+  }
+
+  const base = { face, sourceIndex };
+  const eps = 1e-6;
+  if (Math.abs(maxZ - minZ) <= eps) {
+    return {
+      ...base,
+      axis: "z",
+      left: minY * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: minZ * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxX - minX) <= eps) {
+    return {
+      ...base,
+      axis: "x",
+      left: minY * BASE_TILE,
+      top: minZ * BASE_TILE,
+      width: Math.max(0, (maxY - minY) * BASE_TILE),
+      height: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      z: -minX * BASE_TILE,
+    };
+  }
+  if (Math.abs(maxY - minY) <= eps) {
+    return {
+      ...base,
+      axis: "y",
+      left: minZ * BASE_TILE,
+      top: minX * BASE_TILE,
+      width: Math.max(0, (maxZ - minZ) * BASE_TILE),
+      height: Math.max(0, (maxX - minX) * BASE_TILE),
+      z: -minY * BASE_TILE,
+    };
+  }
+  return null;
+}
+
+function itemCenter(item) {
+  if (item.axis === "x") return [item.left + item.width / 2, -item.z, item.top + item.height / 2];
+  if (item.axis === "y") return [-item.z, item.top + item.height / 2, item.left + item.width / 2];
+  return [item.left + item.width / 2, item.top + item.height / 2, item.z];
+}
+
+function itemCorners(item) {
+  if (item.axis === "x") {
+    return [
+      [item.left, -item.z, item.top],
+      [item.left + item.width, -item.z, item.top],
+      [item.left + item.width, -item.z, item.top + item.height],
+      [item.left, -item.z, item.top + item.height],
+    ];
+  }
+  if (item.axis === "y") {
+    return [
+      [-item.z, item.top, item.left],
+      [-item.z, item.top, item.left + item.width],
+      [-item.z, item.top + item.height, item.left + item.width],
+      [-item.z, item.top + item.height, item.left],
+    ];
+  }
+  return [
+    [item.left, item.top, item.z],
+    [item.left + item.width, item.top, item.z],
+    [item.left + item.width, item.top + item.height, item.z],
+    [item.left, item.top + item.height, item.z],
+  ];
+}
+
+function projectPoint(point, rotation) {
+  const [x, y, z] = rotateVec3(point, rotation.rotX, 0, rotation.rotY);
+  return { x, y, z };
+}
+
+function projectedPoint(item, rotation) {
+  const [x, y] = rotateVec3(itemCenter(item), rotation.rotX, 0, rotation.rotY);
+  return { x, y };
+}
+
+function projectedBounds(item, rotation) {
+  const points = itemCorners(item).map((point) => projectPoint(point, rotation));
+  return {
+    minX: Math.min(...points.map((point) => point.x)),
+    maxX: Math.max(...points.map((point) => point.x)),
+    minY: Math.min(...points.map((point) => point.y)),
+    maxY: Math.max(...points.map((point) => point.y)),
+    depth: points.reduce((sum, point) => sum + point.z, 0) / points.length,
+    area: Math.abs(item.width * item.height),
+    primitive: Math.max(item.width, item.height),
+  };
+}
+
+function visibleFaceSignature(rotation) {
+  const visible = [];
+  for (const face of FACE_ORDER) {
+    if (normalFacesCamera(FACE_NORMALS[face], rotation)) visible.push(face);
+  }
+  return visible.join("|");
+}
+
+function visibleItems(items, rotation) {
+  const visibleFaces = new Set(visibleFaceSignature(rotation).split("|").filter(Boolean));
+  return items.filter((item) => visibleFaces.has(item.face));
+}
+
+function intervalPhase(rotation, signature, fraction) {
+  const matches = [];
+  for (let offset = -180; offset <= 180; offset += 1) {
+    const candidate = { ...rotation, rotY: rotation.rotY + offset };
+    if (visibleFaceSignature(candidate) === signature) matches.push(offset);
+  }
+  const zeroIndex = matches.indexOf(0);
+  if (zeroIndex < 0) return rotation;
+  let start = zeroIndex;
+  let end = zeroIndex;
+  while (start > 0 && matches[start] - matches[start - 1] === 1) start -= 1;
+  while (end + 1 < matches.length && matches[end + 1] - matches[end] === 1) end += 1;
+  const offset = matches[start] + (matches[end] - matches[start]) * fraction;
+  return { ...rotation, rotY: rotation.rotY + offset };
+}
+
+function tileOrder(items, orderRotation) {
+  const entries = items.map((item) => ({ item, ...projectedPoint(item, orderRotation) }));
+  if (entries.length === 0) return [];
+  let minX = Infinity;
+  let maxX = -Infinity;
+  let minY = Infinity;
+  let maxY = -Infinity;
+  for (const entry of entries) {
+    minX = Math.min(minX, entry.x);
+    maxX = Math.max(maxX, entry.x);
+    minY = Math.min(minY, entry.y);
+    maxY = Math.max(maxY, entry.y);
+  }
+  const tileCount = 4;
+  const spanX = Math.max(1e-6, maxX - minX);
+  const spanY = Math.max(1e-6, maxY - minY);
+  const tiles = new Map();
+  for (const entry of entries) {
+    const tx = Math.min(tileCount - 1, Math.max(0, Math.floor(((entry.x - minX) / spanX) * tileCount)));
+    const ty = Math.min(tileCount - 1, Math.max(0, Math.floor(((entry.y - minY) / spanY) * tileCount)));
+    const key = `${tx}:${ty}`;
+    let tile = tiles.get(key);
+    if (!tile) {
+      tile = { tx, ty, sourceIndex: entry.item.sourceIndex, items: [] };
+      tiles.set(key, tile);
+    }
+    tile.items.push(entry.item);
+    tile.sourceIndex = Math.min(tile.sourceIndex, entry.item.sourceIndex);
+  }
+  return [...tiles.values()]
+    .sort((a, b) => (a.ty - b.ty) || (a.tx - b.tx) || a.sourceIndex - b.sourceIndex)
+    .flatMap((tile) => tile.items);
+}
+
+function orderRanks(ordered) {
+  const ranks = new Map();
+  ordered.forEach((item, index) => ranks.set(item.sourceIndex, index));
+  return ranks;
+}
+
+function overlapPairs(items, actualRotation) {
+  const projected = items.map((item) => ({ item, ...projectedBounds(item, actualRotation) }));
+  const sorted = projected
+    .map((entry, index) => ({ ...entry, index }))
+    .sort((a, b) => a.minX - b.minX);
+  const active = [];
+  const pairs = [];
+  for (const current of sorted) {
+    for (let i = active.length - 1; i >= 0; i -= 1) {
+      if (active[i].maxX <= current.minX) active.splice(i, 1);
+    }
+    for (const other of active) {
+      if (other.maxY <= current.minY || other.minY >= current.maxY) continue;
+      const x0 = Math.max(current.minX, other.minX);
+      const x1 = Math.min(current.maxX, other.maxX);
+      const y0 = Math.max(current.minY, other.minY);
+      const y1 = Math.min(current.maxY, other.maxY);
+      if (x1 <= x0 || y1 <= y0) continue;
+      const overlapArea = (x1 - x0) * (y1 - y0);
+      pairs.push({
+        a: current,
+        b: other,
+        overlapArea,
+        maxPrimitive: Math.max(current.primitive, other.primitive),
+        maxArea: Math.max(current.area, other.area),
+        depthDelta: current.depth - other.depth,
+      });
+    }
+    active.push(current);
+  }
+  return pairs;
+}
+
+function pairSign(pair, ranks) {
+  const a = ranks.get(pair.a.item.sourceIndex);
+  const b = ranks.get(pair.b.item.sourceIndex);
+  if (!Number.isFinite(a) || !Number.isFinite(b) || a === b) return 0;
+  return a < b ? -1 : 1;
+}
+
+function summarize(values) {
+  return {
+    median: median(values),
+    p90: quantile(values, 0.9),
+    p95: quantile(values, 0.95),
+    max: values.length ? Math.max(...values) : null,
+  };
+}
+
+function analyzePhaseForAngle(items, actualRotation, strategy) {
+  const signature = visibleFaceSignature(actualRotation);
+  const visible = visibleItems(items, actualRotation);
+  const baselineOrder = tileOrder(visible, actualRotation);
+  const strategyOrder = tileOrder(visible, strategy.phase(actualRotation, signature));
+  const baselineRanks = orderRanks(baselineOrder);
+  const strategyRanks = orderRanks(strategyOrder);
+  const pairs = overlapPairs(visible, actualRotation);
+  let changedPairs = 0;
+  let changedArea = 0;
+  let changedHugePairs = 0;
+  let changedHugeArea = 0;
+  let depthAscBad = 0;
+  let depthDescBad = 0;
+  let depthAscArea = 0;
+  let depthDescArea = 0;
+  let changedDepthAscBad = 0;
+  let changedDepthDescBad = 0;
+  let changedDepthAscArea = 0;
+  let changedDepthDescArea = 0;
+  let totalArea = 0;
+  const movedDistances = [];
+  const movedPrimitives = [];
+  const movedAreas = [];
+
+  for (const item of visible) {
+    const baselineRank = baselineRanks.get(item.sourceIndex);
+    const strategyRank = strategyRanks.get(item.sourceIndex);
+    if (!Number.isFinite(baselineRank) || !Number.isFinite(strategyRank)) continue;
+    const distance = Math.abs(strategyRank - baselineRank);
+    if (distance > 0) {
+      movedDistances.push(distance);
+      movedPrimitives.push(Math.max(item.width, item.height));
+      movedAreas.push(item.width * item.height);
+    }
+  }
+
+  for (const pair of pairs) {
+    totalArea += pair.overlapArea;
+    const baseSign = pairSign(pair, baselineRanks);
+    const strategySign = pairSign(pair, strategyRanks);
+    const changed = baseSign !== strategySign;
+    if (changed) {
+      changedPairs += 1;
+      changedArea += pair.overlapArea;
+      if (pair.maxPrimitive > 600) {
+        changedHugePairs += 1;
+        changedHugeArea += pair.overlapArea;
+      }
+    }
+
+    if (Math.abs(pair.depthDelta) > 0.5 && strategySign !== 0) {
+      if ((strategySign < 0) !== (pair.depthDelta < 0)) {
+        depthAscBad += 1;
+        depthAscArea += pair.overlapArea;
+        if (changed) {
+          changedDepthAscBad += 1;
+          changedDepthAscArea += pair.overlapArea;
+        }
+      }
+      if ((strategySign < 0) !== (pair.depthDelta > 0)) {
+        depthDescBad += 1;
+        depthDescArea += pair.overlapArea;
+        if (changed) {
+          changedDepthDescBad += 1;
+          changedDepthDescArea += pair.overlapArea;
+        }
+      }
+    }
+  }
+
+  return {
+    rotY: actualRotation.rotY,
+    leaves: visible.length,
+    overlapPairs: pairs.length,
+    overlapArea: totalArea,
+    changedPairs,
+    changedPairRate: pairs.length ? changedPairs / pairs.length : 0,
+    changedAreaRate: totalArea ? changedArea / totalArea : 0,
+    changedHugePairs,
+    changedHugePairRate: pairs.length ? changedHugePairs / pairs.length : 0,
+    changedHugeAreaRate: totalArea ? changedHugeArea / totalArea : 0,
+    depthAscBadRate: pairs.length ? depthAscBad / pairs.length : 0,
+    depthDescBadRate: pairs.length ? depthDescBad / pairs.length : 0,
+    depthAscBadAreaRate: totalArea ? depthAscArea / totalArea : 0,
+    depthDescBadAreaRate: totalArea ? depthDescArea / totalArea : 0,
+    changedDepthAscBadRate: changedPairs ? changedDepthAscBad / changedPairs : 0,
+    changedDepthDescBadRate: changedPairs ? changedDepthDescBad / changedPairs : 0,
+    changedDepthAscBadAreaRate: changedArea ? changedDepthAscArea / changedArea : 0,
+    changedDepthDescBadAreaRate: changedArea ? changedDepthDescArea / changedArea : 0,
+    movedCount: movedDistances.length,
+    movedRate: visible.length ? movedDistances.length / visible.length : 0,
+    movedDistance: summarize(movedDistances),
+    movedPrimitive: summarize(movedPrimitives),
+    movedArea: summarize(movedAreas),
+  };
+}
+
+function mergeAngleRows(rows) {
+  const sum = (key) => rows.reduce((total, row) => total + row[key], 0);
+  const weighted = (valueKey, weightKey) => {
+    const weight = sum(weightKey);
+    return weight ? rows.reduce((total, row) => total + row[valueKey] * row[weightKey], 0) / weight : 0;
+  };
+  return {
+    samples: rows.length,
+    leavesMedian: median(rows.map((row) => row.leaves)),
+    overlapPairsPerLeaf: sum("leaves") ? sum("overlapPairs") / sum("leaves") : 0,
+    changedPairRate: weighted("changedPairRate", "overlapPairs"),
+    changedAreaRate: weighted("changedAreaRate", "overlapArea"),
+    changedHugePairRate: weighted("changedHugePairRate", "overlapPairs"),
+    changedHugeAreaRate: weighted("changedHugeAreaRate", "overlapArea"),
+    depthAscBadRate: weighted("depthAscBadRate", "overlapPairs"),
+    depthDescBadRate: weighted("depthDescBadRate", "overlapPairs"),
+    depthAscBadAreaRate: weighted("depthAscBadAreaRate", "overlapArea"),
+    depthDescBadAreaRate: weighted("depthDescBadAreaRate", "overlapArea"),
+    changedDepthAscBadRate: weighted("changedDepthAscBadRate", "changedPairs"),
+    changedDepthDescBadRate: weighted("changedDepthDescBadRate", "changedPairs"),
+    changedDepthAscBadAreaRate: weighted("changedDepthAscBadAreaRate", "changedArea"),
+    changedDepthDescBadAreaRate: weighted("changedDepthDescBadAreaRate", "changedArea"),
+    movedRate: weighted("movedRate", "leaves"),
+    movedDistanceP95Median: median(rows.map((row) => row.movedDistance.p95)),
+    movedPrimitiveP95Median: median(rows.map((row) => row.movedPrimitive.p95)),
+    movedAreaP95Median: median(rows.map((row) => row.movedArea.p95)),
+  };
+}
+
+async function findModelPath(model) {
+  if (model.includes("/") || model.includes("\\")) return resolve(repoRoot, model);
+  const direct = resolve(galleryVoxDir, model);
+  try {
+    await readFile(direct);
+    return direct;
+  } catch {
+    const files = await readdir(galleryVoxDir);
+    const needle = model.toLowerCase().replace(/\.vox$/, "");
+    const match = files.find((file) => file.toLowerCase().replace(/\.vox$/, "") === needle);
+    if (!match) throw new Error(`Could not find model ${model}`);
+    return join(galleryVoxDir, match);
+  }
+}
+
+async function analyzeModel(model) {
+  const path = await findModelPath(model);
+  const bytes = await readFile(path);
+  const parsed = parseVox(
+    bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength),
+    { targetSize, gridShift: 0 },
+  );
+  const items = parsed.polygons
+    .map((polygon, sourceIndex) => matrixItemForPolygon(polygon, sourceIndex))
+    .filter((item) => item && item.width > 0 && item.height > 0);
+  const angles = [];
+  for (let offset = 0; offset < 360; offset += angleStep) {
+    angles.push({ rotX: 65, rotY: 45 + offset });
+  }
+  return {
+    model: basename(path),
+    key: canonicalModelKey(path),
+    polygons: parsed.polygons.length,
+    items: items.length,
+    strategies: STRATEGIES.map((strategy) => {
+      const angleRows = angles.map((rotation) => analyzePhaseForAngle(items, rotation, strategy));
+      return {
+        key: strategy.key,
+        label: strategy.label,
+        metrics: mergeAngleRows(angleRows),
+        angles: angleRows,
+      };
+    }),
+  };
+}
+
+function renderMarkdown(rows) {
+  const lines = [];
+  lines.push("# Voxel Order Phase Metrics");
+  lines.push("");
+  lines.push(`Target size: ${targetSize}`);
+  lines.push(`Angle step: ${angleStep}`);
+  lines.push("");
+  for (const row of rows) {
+    lines.push(`## ${row.model}`);
+    lines.push("");
+    lines.push(`Polygons: ${row.polygons}; matrix items: ${row.items}`);
+    lines.push("");
+    lines.push("| Strategy | Active | Overlap/leaf | Changed pairs % | Changed overlap area % | Changed huge area % | Moved leaves % | Moved dist p95 | Moved primitive p95 | Asc-bad area % | Desc-bad area % |");
+    lines.push("| --- | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: | ---: |");
+    for (const strategy of row.strategies) {
+      const m = strategy.metrics;
+      lines.push([
+        `| ${strategy.label}`,
+        fmt(m.leavesMedian, 0),
+        fmt(m.overlapPairsPerLeaf, 2),
+        fmt(m.changedPairRate * 100, 2),
+        fmt(m.changedAreaRate * 100, 2),
+        fmt(m.changedHugeAreaRate * 100, 2),
+        fmt(m.movedRate * 100, 2),
+        fmt(m.movedDistanceP95Median, 0),
+        fmt(m.movedPrimitiveP95Median, 0),
+        fmt(m.depthAscBadAreaRate * 100, 2),
+        `${fmt(m.depthDescBadAreaRate * 100, 2)} |`,
+      ].join(" | "));
+    }
+    lines.push("");
+  }
+  return `${lines.join("\n")}\n`;
+}
+
+const rows = [];
+for (const model of models) {
+  console.log(`[phase-metrics] analyzing ${model}`);
+  rows.push(await analyzeModel(model));
+}
+
+const out = {
+  generatedAt: new Date().toISOString(),
+  targetSize,
+  angleStep,
+  models: rows,
+};
+const jsonPath = join(resultDir, "voxel-order-phase-metrics.json");
+const mdPath = join(resultDir, "voxel-order-phase-metrics.md");
+await writeFile(jsonPath, JSON.stringify(out, null, 2));
+await writeFile(mdPath, renderMarkdown(rows));
+console.log(`[phase-metrics] wrote ${jsonPath}`);
+console.log(`[phase-metrics] wrote ${mdPath}`);
diff --git a/packages/polycss/src/api/createPolyScene.test.ts b/packages/polycss/src/api/createPolyScene.test.ts
index b7d222a9..71be493e 100644
--- a/packages/polycss/src/api/createPolyScene.test.ts
+++ b/packages/polycss/src/api/createPolyScene.test.ts
@@ -364,6 +364,43 @@ describe("createPolyScene", () => {
       expect(brush!.style.transform).toContain("matrix3d(50,0,0,0,0,50");
     });
 
+    it("uses a larger direct voxel primitive on mobile-class documents", () => {
+      const originalMatchMedia = window.matchMedia;
+      Object.defineProperty(window, "matchMedia", {
+        configurable: true,
+        value: (query: string) => ({
+          matches: query === "(pointer: coarse)" || query === "(hover: none)",
+          media: query,
+          onchange: null,
+          addListener: vi.fn(),
+          removeListener: vi.fn(),
+          addEventListener: vi.fn(),
+          removeEventListener: vi.fn(),
+          dispatchEvent: vi.fn(),
+        }) as MediaQueryList,
+      });
+      try {
+        scene = makeScene(host, {
+          directionalLight: { direction: [0, 0, 1], color: "#ffffff", intensity: 0 },
+          ambientLight: { color: "#ffffff", intensity: 1 },
+        }, { rotX: 65, rotY: 45 });
+        scene.add(makeVoxelExactParseResult(), { merge: false });
+        const wrapper = host.querySelector(".polycss-mesh") as HTMLElement | null;
+        const brush = host.querySelector(".polycss-mesh > b") as HTMLElement | null;
+        expect(wrapper).not.toBeNull();
+        expect(brush).not.toBeNull();
+        expect(wrapper!.style.getPropertyValue("--polycss-voxel-primitive")).toBe("8px");
+        expect(brush!.style.width).toBe("");
+        expect(brush!.style.height).toBe("");
+        expect(brush!.style.transform).toContain("matrix3d(6.25,0,0,0,0,6.25");
+      } finally {
+        Object.defineProperty(window, "matchMedia", {
+          configurable: true,
+          value: originalMatchMedia,
+        });
+      }
+    });
+
     it("falls back to polygon rendering when raw vox polygons are not exact direct quads", () => {
       scene = makeScene(host);
       scene.add(makeVoxelParseResult(), { merge: false });
diff --git a/packages/polycss/src/render/voxelRenderer.ts b/packages/polycss/src/render/voxelRenderer.ts
index ba8846dc..bdabf4ef 100644
--- a/packages/polycss/src/render/voxelRenderer.ts
+++ b/packages/polycss/src/render/voxelRenderer.ts
@@ -59,6 +59,8 @@ const DEFAULT_LIGHT_COLOR = "#ffffff";
 const DEFAULT_LIGHT_INTENSITY = 1;
 const DEFAULT_AMBIENT_COLOR = "#ffffff";
 const DEFAULT_AMBIENT_INTENSITY = 0.4;
+const DESKTOP_PRIMITIVE_SIZE = 1;
+const MOBILE_PRIMITIVE_SIZE = 8;
 
 const FACE_NORMALS: Record<PolyVoxelFace, Vec3> = {
   t: [0, 0, 1],
@@ -270,30 +272,43 @@ function directMatrix(
   width: number,
   height: number,
   zOffset: number,
+  primitiveSize: number,
 ): string {
+  const scaleX = width / primitiveSize;
+  const scaleY = height / primitiveSize;
   const values = axis === "x"
     ? [
-        width, 0, 0, 0,
-        0, 0, height, 0,
+        scaleX, 0, 0, 0,
+        0, 0, scaleY, 0,
         0, -1, 0, 0,
         left, -zOffset, top, 1,
       ]
     : axis === "y"
       ? [
-          0, 0, width, 0,
-          0, height, 0, 0,
+          0, 0, scaleX, 0,
+          0, scaleY, 0, 0,
           -1, 0, 0, 0,
           -zOffset, top, left, 1,
         ]
       : [
-          width, 0, 0, 0,
-          0, height, 0, 0,
+          scaleX, 0, 0, 0,
+          0, scaleY, 0, 0,
           0, 0, 1, 0,
           left, top, zOffset, 1,
         ];
   return `matrix3d(${values.map((value) => Number(value.toFixed(6))).join(",")})`;
 }
 
+function isMobileDocument(doc: Document): boolean {
+  const media = doc.defaultView?.matchMedia;
+  if (!media) return false;
+  return media("(pointer: coarse)").matches || media("(hover: none)").matches;
+}
+
+function primitiveSizeForDocument(doc: Document): number {
+  return isMobileDocument(doc) ? MOBILE_PRIMITIVE_SIZE : DESKTOP_PRIMITIVE_SIZE;
+}
+
 function itemCenter(item: DirectMatrixItem): Vec3 {
   if (item.axis === "x") {
     return [item.left + item.width / 2, -item.z, item.top + item.height / 2];
@@ -375,6 +390,10 @@ export function createPolyVoxelRenderer(
   const directMatrixItems = buildDirectMatrixItems(polygons);
   if (directMatrixItems.length === 0) return null;
   wrapper.classList.add("polycss-voxel-mesh");
+  const primitiveSize = primitiveSizeForDocument(doc);
+  if (primitiveSize !== DESKTOP_PRIMITIVE_SIZE) {
+    wrapper.style.setProperty("--polycss-voxel-primitive", `${primitiveSize}px`);
+  }
 
   const colorCache = new Map<string, string>();
   const shadedColor = (face: PolyVoxelFace, baseColor: string): string => {
@@ -409,7 +428,7 @@ export function createPolyVoxelRenderer(
       applyBrush(
         el,
         shadedColor(item.face, item.baseColor),
-        directMatrix(item.axis, item.left, item.top, item.width, item.height, item.z),
+        directMatrix(item.axis, item.left, item.top, item.width, item.height, item.z, primitiveSize),
       );
       mountedBrushCount += 1;
     }
@@ -432,6 +451,7 @@ export function createPolyVoxelRenderer(
     dispose() {
       for (const el of pool) el.remove();
       wrapper.classList.remove("polycss-voxel-mesh");
+      wrapper.style.removeProperty("--polycss-voxel-primitive");
       pool.length = 0;
       mountedBrushCount = 0;
       lastSignature = "";
diff --git a/packages/polycss/src/styles/styles.ts b/packages/polycss/src/styles/styles.ts
index 24a00d2f..fc238cc3 100644
--- a/packages/polycss/src/styles/styles.ts
+++ b/packages/polycss/src/styles/styles.ts
@@ -101,8 +101,8 @@ const CORE_BASE_STYLES = `
 .polycss-mesh.polycss-voxel-mesh > b {
   top: 0;
   left: 0;
-  width: 1px;
-  height: 1px;
+  width: var(--polycss-voxel-primitive, 1px);
+  height: var(--polycss-voxel-primitive, 1px);
   backface-visibility: visible;
   pointer-events: none;
 }