reze-engine 0.25.0 → 0.25.2

package/dist/shaders/materials/common.js

@@ -18,148 +18,150 @@
 //   group(0): per-frame scene (camera, lights, shadow map, BRDF LUT via nodes.ts)
 //   group(1): per-model skinning
 //   group(2): per-material (diffuse texture + material uniforms)
-export const COMMON_BINDINGS_WGSL = /* wgsl */ `
-
-struct CameraUniforms {
-  view: mat4x4f,
-  projection: mat4x4f,
-  viewPos: vec3f,
-  _padding: f32,
-};
-
-struct Light {
-  direction: vec4f,
-  color: vec4f,
-};
-
-struct LightUniforms {
-  ambientColor: vec4f,
-  lights: array<Light, 4>,
-};
-
-// Per-material uniforms. Every material binds this layout even if it ignores fields;
-// the engine keeps one bind group layout across all material pipelines. The PMX
-// classic-material fields (ambient/specular/shininess) are carried for graph nodes that
-// want them; most graphs read only diffuseColor + alpha.
-struct MaterialUniforms {
-  diffuseColor: vec3f,   // PMX diffuse rgb — the material_diffuse node reads this
-  alpha: f32,            // 0 → discard; <1 → transparent draw call
-  ambient: vec3f,        // PMX ambient rgb
-  shininess: f32,        // PMX specular power
-  specular: vec3f,       // PMX specular rgb
-  sphereMode: f32,       // 0 none · 1 multiply (sph) · 2 add (spa)
-  // Skeleton index of the 頭 (head) bone, or -1. Lets the eye shader gate
-  // the post-alpha-eye stencil by camera-vs-face hemisphere.
-  headBoneIndex: f32,
-  _pad0: f32,
-  _pad1: f32,
-  _pad2: f32,
-};
-
-struct VertexOutput {
-  @builtin(position) position: vec4f,
-  @location(0) normal: vec3f,
-  @location(1) uv: vec2f,
-  @location(2) worldPos: vec3f,
-  // Bind-pose object-space position (the raw pre-skin vertex attribute). Procedural
-  // textures (noise bump, sparkle, Generated-coord gradients) key off this instead of
-  // worldPos so the pattern rides with the surface — otherwise the mesh swims through a
-  // world-static noise field under any skinning deformation or root (センター) motion.
-  // At rest skinMats are identity so restPos == worldPos, which is why existing noise-
-  // scale constants stay valid without retuning.
-  @location(3) restPos: vec3f,
-};
-
-struct LightVP { viewProj: mat4x4f, };
-
-@group(0) @binding(0) var<uniform> camera: CameraUniforms;
-@group(0) @binding(1) var<uniform> light: LightUniforms;
-@group(0) @binding(2) var diffuseSampler: sampler;
-@group(0) @binding(3) var shadowMap: texture_depth_2d;
-@group(0) @binding(4) var shadowSampler: sampler_comparison;
-@group(0) @binding(5) var<uniform> lightVP: LightVP;
-// binding(9) brdfLut is declared inside NODES_WGSL (nodes.ts).
-@group(1) @binding(0) var<storage, read> skinMats: array<mat4x4f>;
-@group(2) @binding(0) var diffuseTexture: texture_2d<f32>;
-@group(2) @binding(1) var<uniform> material: MaterialUniforms;
-// Reserved for future sphere/toon graph nodes; graphs that don't read them get the
-// 1×1 white fallback bound here.
-@group(2) @binding(2) var toonTexture: texture_2d<f32>;
-@group(2) @binding(3) var sphereTexture: texture_2d<f32>;
-
-// Four-bone blended normals can cancel to ~zero on physics-driven parts
-// (opposing bone rotations at 50/50 weights) — normalize(0) is 0/0 = NaN,
-// which poisons the whole shading stack and flashes through bloom. Fall
-// back to up for degenerate normals instead.
-fn safe_normal(nIn: vec3f) -> vec3f {
-  let l2 = dot(nIn, nIn);
-  if (l2 < 1e-12) { return vec3f(0.0, 1.0, 0.0); }
-  return nIn * inverseSqrt(l2);
-}
-
+export const COMMON_BINDINGS_WGSL = /* wgsl */ `
+
+struct CameraUniforms {
+  view: mat4x4f,
+  projection: mat4x4f,
+  viewPos: vec3f,
+  _padding: f32,
+};
+
+struct Light {
+  direction: vec4f,
+  color: vec4f,
+};
+
+struct LightUniforms {
+  ambientColor: vec4f,
+  lights: array<Light, 4>,
+};
+
+// Per-material uniforms. Every material binds this layout even if it ignores fields;
+// the engine keeps one bind group layout across all material pipelines. The PMX
+// classic-material fields (ambient/specular/shininess) are carried for graph nodes that
+// want them; most graphs read only diffuseColor + alpha.
+struct MaterialUniforms {
+  diffuseColor: vec3f,   // PMX diffuse rgb — the material_diffuse node reads this
+  alpha: f32,            // 0 → discard; <1 → transparent draw call
+  ambient: vec3f,        // PMX ambient rgb
+  shininess: f32,        // PMX specular power
+  specular: vec3f,       // PMX specular rgb
+  sphereMode: f32,       // 0 none · 1 multiply (sph) · 2 add (spa)
+  // Skeleton index of the 頭 (head) bone, or -1. Lets the eye shader gate
+  // the post-alpha-eye stencil by camera-vs-face hemisphere.
+  headBoneIndex: f32,
+  _pad0: f32,
+  _pad1: f32,
+  _pad2: f32,
+};
+
+struct VertexOutput {
+  @builtin(position) position: vec4f,
+  @location(0) normal: vec3f,
+  @location(1) uv: vec2f,
+  @location(2) worldPos: vec3f,
+  // Bind-pose object-space position (the raw pre-skin vertex attribute). Procedural
+  // textures (noise bump, sparkle, Generated-coord gradients) key off this instead of
+  // worldPos so the pattern rides with the surface — otherwise the mesh swims through a
+  // world-static noise field under any skinning deformation or root (センター) motion.
+  // At rest skinMats are identity so restPos == worldPos, which is why existing noise-
+  // scale constants stay valid without retuning.
+  @location(3) restPos: vec3f,
+};
+
+struct LightVP { viewProj: mat4x4f, };
+
+@group(0) @binding(0) var<uniform> camera: CameraUniforms;
+@group(0) @binding(1) var<uniform> light: LightUniforms;
+@group(0) @binding(2) var diffuseSampler: sampler;
+@group(0) @binding(3) var shadowMap: texture_depth_2d;
+@group(0) @binding(4) var shadowSampler: sampler_comparison;
+@group(0) @binding(5) var<uniform> lightVP: LightVP;
+// binding(9) brdfLut is declared inside NODES_WGSL (nodes.ts).
+@group(1) @binding(0) var<storage, read> skinMats: array<mat4x4f>;
+@group(2) @binding(0) var diffuseTexture: texture_2d<f32>;
+@group(2) @binding(1) var<uniform> material: MaterialUniforms;
+// Reserved for future sphere/toon graph nodes; graphs that don't read them get the
+// 1×1 white fallback bound here.
+@group(2) @binding(2) var toonTexture: texture_2d<f32>;
+@group(2) @binding(3) var sphereTexture: texture_2d<f32>;
+
+// Four-bone blended normals can cancel to ~zero on physics-driven parts
+// (opposing bone rotations at 50/50 weights) — normalize(0) is 0/0 = NaN,
+// which poisons the whole shading stack and flashes through bloom. Fall
+// back to up for degenerate normals instead.
+fn safe_normal(nIn: vec3f) -> vec3f {
+  let l2 = dot(nIn, nIn);
+  if (l2 < 1e-12) { return vec3f(0.0, 1.0, 0.0); }
+  return nIn * inverseSqrt(l2);
+}
+
 `;
 // ─── Shadow sampler (3×3 PCF) ───────────────────────────────────────
-// 2048-map, normal-bias 0.08, depth-bias 0.001. Unrolled — Safari's Metal backend
-// doesn't unroll nested shadow loops reliably, and the early out on back-facing
-// fragments saves 9 texture taps per skipped pixel.
-export const SAMPLE_SHADOW_WGSL = /* wgsl */ `
-
-fn sampleShadow(worldPos: vec3f, n: vec3f) -> f32 {
-  if (dot(n, -light.lights[0].direction.xyz) <= 0.0) { return 0.0; }
-  let biasedPos = worldPos + n * 0.08;
-  let lclip = lightVP.viewProj * vec4f(biasedPos, 1.0);
-  let ndc = lclip.xyz / max(lclip.w, 1e-6);
-  let suv = vec2f(ndc.x * 0.5 + 0.5, 0.5 - ndc.y * 0.5);
-  let cmpZ = ndc.z - 0.001;
-  let ts = 1.0 / 2048.0;
-  let s00 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f(-ts, -ts), cmpZ);
-  let s10 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f(0.0, -ts), cmpZ);
-  let s20 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f( ts, -ts), cmpZ);
-  let s01 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f(-ts, 0.0), cmpZ);
-  let s11 = textureSampleCompareLevel(shadowMap, shadowSampler, suv, cmpZ);
-  let s21 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f( ts, 0.0), cmpZ);
-  let s02 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f(-ts,  ts), cmpZ);
-  let s12 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f(0.0,  ts), cmpZ);
-  let s22 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f( ts,  ts), cmpZ);
-  return (s00 + s10 + s20 + s01 + s11 + s21 + s02 + s12 + s22) * (1.0 / 9.0);
-}
-
+// 4096-map (MUST match Engine.SHADOW_MAP_SIZE), normal-bias 0.08, depth-bias
+// 0.001. Unrolled — Safari's Metal backend doesn't unroll nested shadow loops
+// reliably. The texel size was stale at 1/2048 after the map grew to 4096:
+// PCF taps landed TWO texels apart, quantizing self-shadow edges into
+// texel-sized gray/black squares that crawled with the animation.
+export const SAMPLE_SHADOW_WGSL = /* wgsl */ `
+
+fn sampleShadow(worldPos: vec3f, n: vec3f) -> f32 {
+  if (dot(n, -light.lights[0].direction.xyz) <= 0.0) { return 0.0; }
+  let biasedPos = worldPos + n * 0.08;
+  let lclip = lightVP.viewProj * vec4f(biasedPos, 1.0);
+  let ndc = lclip.xyz / max(lclip.w, 1e-6);
+  let suv = vec2f(ndc.x * 0.5 + 0.5, 0.5 - ndc.y * 0.5);
+  let cmpZ = ndc.z - 0.001;
+  let ts = 1.0 / 4096.0;
+  let s00 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f(-ts, -ts), cmpZ);
+  let s10 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f(0.0, -ts), cmpZ);
+  let s20 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f( ts, -ts), cmpZ);
+  let s01 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f(-ts, 0.0), cmpZ);
+  let s11 = textureSampleCompareLevel(shadowMap, shadowSampler, suv, cmpZ);
+  let s21 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f( ts, 0.0), cmpZ);
+  let s02 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f(-ts,  ts), cmpZ);
+  let s12 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f(0.0,  ts), cmpZ);
+  let s22 = textureSampleCompareLevel(shadowMap, shadowSampler, suv + vec2f( ts,  ts), cmpZ);
+  return (s00 + s10 + s20 + s01 + s11 + s21 + s02 + s12 + s22) * (1.0 / 9.0);
+}
+
 `;
 // ─── Skinning vertex shader ─────────────────────────────────────────
 // Four-bone linear blend skinning. Renormalizes weights when they don't sum to 1
 // (PMX models occasionally ship with unnormalized weights on extras like hair tips).
 // VS normalize on the outgoing normal is skipped — interpolation denormalizes it
 // anyway and every fragment shader does `normalize(input.normal)` as its first line.
-export const COMMON_VS_WGSL = /* wgsl */ `
-
-@vertex fn vs(
-  @location(0) position: vec3f,
-  @location(1) normal: vec3f,
-  @location(2) uv: vec2f,
-  @location(3) joints0: vec4<u32>,
-  @location(4) weights0: vec4<f32>
-) -> VertexOutput {
-  var output: VertexOutput;
-  let pos4 = vec4f(position, 1.0);
-  let weightSum = weights0.x + weights0.y + weights0.z + weights0.w;
-  let invWeightSum = select(1.0, 1.0 / weightSum, weightSum > 0.0001);
-  let nw = select(vec4f(1.0, 0.0, 0.0, 0.0), weights0 * invWeightSum, weightSum > 0.0001);
-  var skinnedPos = vec4f(0.0);
-  var skinnedNrm = vec3f(0.0);
-  for (var i = 0u; i < 4u; i++) {
-    let m = skinMats[joints0[i]];
-    let w = nw[i];
-    skinnedPos += (m * pos4) * w;
-    skinnedNrm += (mat3x3f(m[0].xyz, m[1].xyz, m[2].xyz) * normal) * w;
-  }
-  output.position = camera.projection * camera.view * vec4f(skinnedPos.xyz, 1.0);
-  output.normal = skinnedNrm;
-  output.uv = uv;
-  output.worldPos = skinnedPos.xyz;
-  output.restPos = position;
-  return output;
-}
-
+export const COMMON_VS_WGSL = /* wgsl */ `
+
+@vertex fn vs(
+  @location(0) position: vec3f,
+  @location(1) normal: vec3f,
+  @location(2) uv: vec2f,
+  @location(3) joints0: vec4<u32>,
+  @location(4) weights0: vec4<f32>
+) -> VertexOutput {
+  var output: VertexOutput;
+  let pos4 = vec4f(position, 1.0);
+  let weightSum = weights0.x + weights0.y + weights0.z + weights0.w;
+  let invWeightSum = select(1.0, 1.0 / weightSum, weightSum > 0.0001);
+  let nw = select(vec4f(1.0, 0.0, 0.0, 0.0), weights0 * invWeightSum, weightSum > 0.0001);
+  var skinnedPos = vec4f(0.0);
+  var skinnedNrm = vec3f(0.0);
+  for (var i = 0u; i < 4u; i++) {
+    let m = skinMats[joints0[i]];
+    let w = nw[i];
+    skinnedPos += (m * pos4) * w;
+    skinnedNrm += (mat3x3f(m[0].xyz, m[1].xyz, m[2].xyz) * normal) * w;
+  }
+  output.position = camera.projection * camera.view * vec4f(skinnedPos.xyz, 1.0);
+  output.normal = skinnedNrm;
+  output.uv = uv;
+  output.worldPos = skinnedPos.xyz;
+  output.restPos = position;
+  return output;
+}
+
 `;
 // ─── FS output struct ───────────────────────────────────────────────
 // Location 0: final radiance+alpha (blended into rg11b10ufloat; the HDR target
@@ -180,13 +182,13 @@ export const COMMON_VS_WGSL = /* wgsl */ `
 // src-alpha blending enabled:
 //   out.r = mask_r · src.a + dst.r · (1-src.a)   (bloom mask, weighted by alpha)
 //   out.g = 1.0    · src.a + dst.g · (1-src.a)   (canonical premultiplied alpha-over)
-export const COMMON_FS_OUT_WGSL = /* wgsl */ `
-
-struct FSOut {
-  @location(0) color: vec4f,
-  @location(1) mask: vec4f,
-};
-
+export const COMMON_FS_OUT_WGSL = /* wgsl */ `
+
+struct FSOut {
+  @location(0) color: vec4f,
+  @location(1) mask: vec4f,
+};
+
 `;
 // ─── Convenience: full shared prelude ───────────────────────────────
 // Material files compose this as `${NODES_WGSL}${COMMON_MATERIAL_PRELUDE_WGSL}` to

package/dist/shaders/passes/composite.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"composite.d.ts","sourceRoot":"","sources":["../../../src/shaders/passes/composite.ts"],"names":[],"mappings":"AASA;;;;;;;;;;;;;yEAayE;AACzE,MAAM,MAAM,qBAAqB,GAAG;IAClC,wEAAwE;IACxE,IAAI,EAAE,MAAM,CAAA;IACZ,8EAA8E;IAC9E,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AA8HD,wBAAgB,oBAAoB,CAAC,MAAM,CAAC,EAAE,qBAAqB,GAAG,IAAI,GAAG,MAAM,CAWlF;AAED,iFAAiF;AACjF,eAAO,MAAM,qBAAqB,QAA6B,CAAA"}
+{"version":3,"file":"composite.d.ts","sourceRoot":"","sources":["../../../src/shaders/passes/composite.ts"],"names":[],"mappings":"AASA;;;;;;;;;;;;;yEAayE;AACzE,MAAM,MAAM,qBAAqB,GAAG;IAClC,wEAAwE;IACxE,IAAI,EAAE,MAAM,CAAA;IACZ,8EAA8E;IAC9E,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AA8ID,wBAAgB,oBAAoB,CAAC,MAAM,CAAC,EAAE,qBAAqB,GAAG,IAAI,GAAG,MAAM,CAelF;AAED,iFAAiF;AACjF,eAAO,MAAM,qBAAqB,QAA6B,CAAA"}

package/dist/shaders/passes/composite.js

@@ -94,7 +94,7 @@ const COMPOSITE_BODY = /* wgsl */ `
   var bgA = select(0.0, 1.0, bg.w > 0.5);
   var bgPm = bg.rgb * bgA;  // premultiplied accumulator
   let fxOn = viewU[6].y > 0.5;
-  if (bg.w > 1.5 || fxOn) {
+  if ((bg.w > 1.5 || fxOn) COVERAGE_GATE) {
     // The equirect and any effect both need this pixel's world-space view ray,
     // rebuilt from the camera basis. The dome sits at infinity (no parallax) —
     // PhotoDome-style, display-only.
@@ -126,16 +126,31 @@ const EFFECT_CALL = /* wgsl */ `
       bgA = fx.a + bgA * (1.0 - fx.a);
     }
 `;
+// Derivative builtins are illegal in non-uniform control flow (WGSL uniformity
+// analysis rejects the pipeline), so the coverage gate below can only wrap
+// effect code that doesn't use them. Checked textually at build time.
+const USES_DERIVATIVES = /\b(?:fwidth|dpdx|dpdy)(?:Fine|Coarse)?\s*\(/;
+/** Skip the whole background block (equirect sample + effect) behind pixels the
+ *  model fully covers — the composite multiplies the result by (1 - alpha) = 0
+ *  there anyway, and on a full-screen effect that's a third or more of the frame
+ *  (the cost Safari feels most). The equirect uses explicit-LOD sampling, which
+ *  is always legal in non-uniform flow; only derivative-using effects must keep
+ *  uniform control flow and forgo the gate. */
+function coverageGate(effect) {
+    const gated = !effect || !USES_DERIVATIVES.test(effect.wgsl);
+    return gated ? "&& alpha < 0.999" : "";
+}
 export function buildCompositeShader(effect) {
     if (!effect)
-        return COMPOSITE_HEAD + COMPOSITE_BODY.replace("BG_EFFECT_CALL", NO_EFFECT_CALL);
+        return (COMPOSITE_HEAD +
+            COMPOSITE_BODY.replace("BG_EFFECT_CALL", NO_EFFECT_CALL).replace("COVERAGE_GATE", coverageGate(null)));
     return (COMPOSITE_HEAD +
         "\n// ── user background effect (setBackgroundEffect) ──\n" +
         effect.paramsDecl +
         "\n" +
         effect.wgsl +
         "\n" +
-        COMPOSITE_BODY.replace("BG_EFFECT_CALL", EFFECT_CALL.trim()));
+        COMPOSITE_BODY.replace("BG_EFFECT_CALL", EFFECT_CALL.trim()).replace("COVERAGE_GATE", coverageGate(effect)));
 }
 /** Kept for compatibility with existing imports (the base, no-effect shader). */
 export const COMPOSITE_SHADER_WGSL = buildCompositeShader(null);

package/dist/shaders/passes/depth-prepass.d.ts

@@ -0,0 +1,2 @@
+export declare const TRANSPARENT_DEPTH_PREPASS_WGSL = "\nstruct CameraUniforms { view: mat4x4f, projection: mat4x4f, viewPos: vec3f, _p: f32, };\nstruct MaterialUniforms {\n  diffuseColor: vec3f,\n  alpha: f32,\n};\n\n@group(0) @binding(0) var<uniform> camera: CameraUniforms;\n@group(0) @binding(2) var diffuseSampler: sampler;\n@group(1) @binding(0) var<storage, read> skinMats: array<mat4x4f>;\n@group(2) @binding(0) var diffuseTexture: texture_2d<f32>;\n@group(2) @binding(1) var<uniform> material: MaterialUniforms;\n\nstruct VSOut {\n  @builtin(position) position: vec4f,\n  @location(0) uv: vec2f,\n};\n\n@vertex fn vs(\n  @location(0) position: vec3f,\n  @location(1) normal: vec3f,\n  @location(2) uv: vec2f,\n  @location(3) joints0: vec4<u32>,\n  @location(4) weights0: vec4<f32>,\n) -> VSOut {\n  let pos4 = vec4f(position, 1.0);\n  let weightSum = weights0.x + weights0.y + weights0.z + weights0.w;\n  let invWeightSum = select(1.0, 1.0 / weightSum, weightSum > 0.0001);\n  let w = select(vec4f(1.0, 0.0, 0.0, 0.0), weights0 * invWeightSum, weightSum > 0.0001);\n  var skinned = vec4f(0.0);\n  for (var i = 0u; i < 4u; i++) {\n    skinned += (skinMats[joints0[i]] * pos4) * w[i];\n  }\n  var o: VSOut;\n  o.position = camera.projection * camera.view * vec4f(skinned.xyz, 1.0);\n  o.uv = uv;\n  return o;\n}\n\n@fragment fn fs(in: VSOut) {\n  let a = material.alpha * textureSample(diffuseTexture, diffuseSampler, in.uv).a;\n  if (a < 0.5) { discard; }\n}\n";
+//# sourceMappingURL=depth-prepass.d.ts.map

package/dist/shaders/passes/depth-prepass.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"depth-prepass.d.ts","sourceRoot":"","sources":["../../../src/shaders/passes/depth-prepass.ts"],"names":[],"mappings":"AAaA,eAAO,MAAM,8BAA8B,04CA2C1C,CAAA"}

package/dist/shaders/passes/depth-prepass.js

@@ -0,0 +1,56 @@
+// Depth-only prepass for the TRANSPARENT bucket. Transparent color draws keep
+// depth write OFF so self-overlapping sheer cloth blends both layers instead of
+// a triangle-order patchwork — but that leaves no depth record, so anything
+// drawn later (the outline hulls) shows straight through the fabric as black
+// shapes. This pass re-draws the transparent geometry depth-only AFTER its
+// color pass: solid-enough texels (alpha ≥ 0.5) write depth, so outlines get
+// occluded behind fabric exactly like they are behind opaque cloth, while
+// truly sheer texels (a veil) stay non-occluding.
+//
+// Reuses mainPipelineLayout: camera g0b0, diffuseSampler g0b2, skinMats g1b0,
+// diffuse texture g2b0, material uniforms g2b1 — the same bind groups the
+// color draws already set, so drawing it costs no extra binding work.
+export const TRANSPARENT_DEPTH_PREPASS_WGSL = /* wgsl */ `
+struct CameraUniforms { view: mat4x4f, projection: mat4x4f, viewPos: vec3f, _p: f32, };
+struct MaterialUniforms {
+  diffuseColor: vec3f,
+  alpha: f32,
+};
+
+@group(0) @binding(0) var<uniform> camera: CameraUniforms;
+@group(0) @binding(2) var diffuseSampler: sampler;
+@group(1) @binding(0) var<storage, read> skinMats: array<mat4x4f>;
+@group(2) @binding(0) var diffuseTexture: texture_2d<f32>;
+@group(2) @binding(1) var<uniform> material: MaterialUniforms;
+
+struct VSOut {
+  @builtin(position) position: vec4f,
+  @location(0) uv: vec2f,
+};
+
+@vertex fn vs(
+  @location(0) position: vec3f,
+  @location(1) normal: vec3f,
+  @location(2) uv: vec2f,
+  @location(3) joints0: vec4<u32>,
+  @location(4) weights0: vec4<f32>,
+) -> VSOut {
+  let pos4 = vec4f(position, 1.0);
+  let weightSum = weights0.x + weights0.y + weights0.z + weights0.w;
+  let invWeightSum = select(1.0, 1.0 / weightSum, weightSum > 0.0001);
+  let w = select(vec4f(1.0, 0.0, 0.0, 0.0), weights0 * invWeightSum, weightSum > 0.0001);
+  var skinned = vec4f(0.0);
+  for (var i = 0u; i < 4u; i++) {
+    skinned += (skinMats[joints0[i]] * pos4) * w[i];
+  }
+  var o: VSOut;
+  o.position = camera.projection * camera.view * vec4f(skinned.xyz, 1.0);
+  o.uv = uv;
+  return o;
+}
+
+@fragment fn fs(in: VSOut) {
+  let a = material.alpha * textureSample(diffuseTexture, diffuseSampler, in.uv).a;
+  if (a < 0.5) { discard; }
+}
+`;

package/dist/shaders/passes/outline.d.ts

@@ -1,2 +1,2 @@
-export declare const OUTLINE_SHADER_WGSL = "\nstruct CameraUniforms {\n  view: mat4x4f,\n  projection: mat4x4f,\n  viewPos: vec3f,\n  _padding: f32,\n};\n\nstruct MaterialUniforms {\n  edgeColor: vec4f,\n  edgeSize: f32,\n  _padding1: f32,\n  _padding2: f32,\n  _padding3: f32,\n};\n\n@group(0) @binding(0) var<uniform> camera: CameraUniforms;\n@group(1) @binding(0) var<storage, read> skinMats: array<mat4x4f>;\n@group(2) @binding(0) var<uniform> material: MaterialUniforms;\n\nstruct VertexOutput {\n  @builtin(position) position: vec4f,\n};\n\n@vertex fn vs(\n  @location(0) position: vec3f,\n  @location(1) normal: vec3f,\n  @location(3) joints0: vec4<u32>,\n  @location(4) weights0: vec4<f32>\n) -> VertexOutput {\n  var output: VertexOutput;\n  let pos4 = vec4f(position, 1.0);\n\n  let weightSum = weights0.x + weights0.y + weights0.z + weights0.w;\n  let invWeightSum = select(1.0, 1.0 / weightSum, weightSum > 0.0001);\n  let normalizedWeights = select(vec4f(1.0, 0.0, 0.0, 0.0), weights0 * invWeightSum, weightSum > 0.0001);\n\n  var skinnedPos = vec4f(0.0, 0.0, 0.0, 0.0);\n  var skinnedNrm = vec3f(0.0, 0.0, 0.0);\n  for (var i = 0u; i < 4u; i++) {\n    let j = joints0[i];\n    let w = normalizedWeights[i];\n    let m = skinMats[j];\n    skinnedPos += (m * pos4) * w;\n    let r3 = mat3x3f(m[0].xyz, m[1].xyz, m[2].xyz);\n    skinnedNrm += (r3 * normal) * w;\n  }\n  let worldPos = skinnedPos.xyz;\n  let worldNormal = normalize(skinnedNrm);\n\n  // Screen-space outline extrusion \u2014 MMD-style pixel-stable edge line.\n  // 1. Project position and normal-as-direction to clip space.\n  // 2. Normalize the 2D clip-space normal, aspect-compensated so \"one pixel horizontally\"\n  //    matches \"one pixel vertically\" (otherwise wide viewports squash the outline in X).\n  // 3. Offset clip-space xy by (normal * edgeSize * edgeScale), then multiply by w\n  //    so the perspective divide cancels out \u2192 offset stays constant in NDC regardless\n  //    of depth, matching how MMD / babylon-mmd style outlines look identical when zooming.\n  // 4. edgeScale is in NDC-y units per PMX edgeSize. \u2248 0.006 gives ~3px at 1080p; it's\n  //    tied to viewport HEIGHT so resizing the window keeps pixel thickness stable.\n  let viewProj = camera.projection * camera.view;\n  let clipPos = viewProj * vec4f(worldPos, 1.0);\n  let clipNormal = (viewProj * vec4f(worldNormal, 0.0)).xy;\n  // projection is column-major: proj[0][0] = 1/(aspect\u00B7tan(fov/2)), proj[1][1] = 1/tan(fov/2).\n  // Ratio proj[1][1]/proj[0][0] recovers the viewport aspect (width/height).\n  let aspect = camera.projection[1][1] / camera.projection[0][0];\n  let pixelDir = normalize(vec2f(clipNormal.x * aspect, clipNormal.y));\n  let ndcDir = vec2f(pixelDir.x / aspect, pixelDir.y);\n  let edgeScale = 0.0016;\n  let offset = ndcDir * material.edgeSize * edgeScale * clipPos.w;\n  output.position = vec4f(clipPos.xy + offset, clipPos.z, clipPos.w);\n  return output;\n}\n\nstruct FSOut { @location(0) color: vec4f, @location(1) mask: vec4f };\n@fragment fn fs() -> FSOut {\n  var out: FSOut;\n  out.color = material.edgeColor;\n  out.mask = vec4f(1.0, 1.0, 0.0, out.color.a);\n  return out;\n}\n";
+export declare const OUTLINE_SHADER_WGSL = "\nstruct CameraUniforms {\n  view: mat4x4f,\n  projection: mat4x4f,\n  viewPos: vec3f,\n  // Render-target height in device pixels (engine writes it each frame);\n  // width is recovered via the projection matrix's aspect.\n  viewportHeight: f32,\n};\n\nstruct MaterialUniforms {\n  edgeColor: vec4f,\n  edgeSize: f32,\n  _padding1: f32,\n  _padding2: f32,\n  _padding3: f32,\n};\n\n@group(0) @binding(0) var<uniform> camera: CameraUniforms;\n@group(0) @binding(1) var edgeSampler: sampler;\n@group(1) @binding(0) var<storage, read> skinMats: array<mat4x4f>;\n@group(2) @binding(0) var<uniform> material: MaterialUniforms;\n@group(2) @binding(1) var diffuseTexture: texture_2d<f32>;\n\nstruct VertexOutput {\n  @builtin(position) position: vec4f,\n  @location(0) uv: vec2f,\n};\n\n@vertex fn vs(\n  @location(0) position: vec3f,\n  @location(1) normal: vec3f,\n  @location(2) uv: vec2f,\n  @location(3) joints0: vec4<u32>,\n  @location(4) weights0: vec4<f32>\n) -> VertexOutput {\n  var output: VertexOutput;\n  let pos4 = vec4f(position, 1.0);\n\n  let weightSum = weights0.x + weights0.y + weights0.z + weights0.w;\n  let invWeightSum = select(1.0, 1.0 / weightSum, weightSum > 0.0001);\n  let normalizedWeights = select(vec4f(1.0, 0.0, 0.0, 0.0), weights0 * invWeightSum, weightSum > 0.0001);\n\n  var skinnedPos = vec4f(0.0, 0.0, 0.0, 0.0);\n  var skinnedNrm = vec3f(0.0, 0.0, 0.0);\n  for (var i = 0u; i < 4u; i++) {\n    let j = joints0[i];\n    let w = normalizedWeights[i];\n    let m = skinMats[j];\n    skinnedPos += (m * pos4) * w;\n    let r3 = mat3x3f(m[0].xyz, m[1].xyz, m[2].xyz);\n    skinnedNrm += (r3 * normal) * w;\n  }\n  let worldPos = skinnedPos.xyz;\n  let worldNormal = normalize(skinnedNrm);\n\n  let clipPos = camera.projection * camera.view * vec4f(worldPos, 1.0);\n\n  // babylon-mmd: screenNormal = normalize((view * worldNormal).xy)\n  let viewNormal = (camera.view * vec4f(worldNormal, 0.0)).xyz;\n  let snLen = length(viewNormal.xy);\n  let screenNormal = select(vec2f(0.0, 0.0), viewNormal.xy / snLen, snLen > 1e-5);\n\n  // Reference-height normalization (babylon-mmd ships this variant commented\n  // out as `renderHeight = 1080`): thickness is a constant FRACTION of the\n  // frame \u2014 2\u00B7edgeSize px at 1080p \u2014 so retina DPR and 4K export don't thin\n  // the rims to sub-pixel. Width follows the projection aspect.\n  // projection[1][1]/projection[0][0] = width/height for a symmetric frustum.\n  let aspect = camera.projection[1][1] / camera.projection[0][0];\n  let viewport = vec2f(1080.0 * aspect, 1080.0);\n\n  // NDC offset = edgeSize \u00B7 4/viewport, \u00D7w so the perspective divide cancels:\n  // constant screen thickness at any distance (babylon-mmd parity).\n  let offset = screenNormal * (material.edgeSize * 4.0 / viewport) * clipPos.w;\n  output.position = vec4f(clipPos.xy + offset, clipPos.z, clipPos.w);\n  output.uv = uv;\n  return output;\n}\n\nstruct FSOut { @location(0) color: vec4f, @location(1) mask: vec4f };\n@fragment fn fs(input: VertexOutput) -> FSOut {\n  // Rim alpha FOLLOWS the fabric's texture alpha instead of a hard alpha test:\n  // MMD draws blend-material edges solid (only cutout materials alpha-test), so\n  // a 0.4 discard erased the whole hull on semi-transparent cloth \u2014 stockinged\n  // legs crossing lost their outline entirely. Modulating instead keeps a\n  // proportional rim on sheer weave (never a solid black hull) and still\n  // discards true cut-out margins like hair-card borders.\n  let texA = textureSample(diffuseTexture, edgeSampler, input.uv).a;\n  if (texA < 0.05) {\n    discard;\n  }\n  var out: FSOut;\n  out.color = vec4f(material.edgeColor.rgb, material.edgeColor.a * texA);\n  out.mask = vec4f(1.0, 1.0, 0.0, out.color.a);\n  return out;\n}\n";
 //# sourceMappingURL=outline.d.ts.map

package/dist/shaders/passes/outline.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"outline.d.ts","sourceRoot":"","sources":["../../../src/shaders/passes/outline.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,mBAAmB,klGAgF/B,CAAA"}
+{"version":3,"file":"outline.d.ts","sourceRoot":"","sources":["../../../src/shaders/passes/outline.ts"],"names":[],"mappings":"AAcA,eAAO,MAAM,mBAAmB,ksHAgG/B,CAAA"}

package/dist/shaders/passes/outline.js

@@ -1,11 +1,24 @@
-// MMD-style screen-space outline via normal-extrusion in clip space.
-// Aspect-compensated so pixel thickness stays stable across viewport sizes.
+// MMD-style inverted-hull outline, ported from babylon-mmd's mmdOutline shader
+// (the reference implementation whose output matches MMD):
+//   1. Extrude along the VIEW-SPACE normal's XY, normalized — a pure screen
+//      direction, so rims never smear toward the camera at grazing angles.
+//   2. Offset in clip space by edgeSize · 4/viewport · w. The ×w cancels the
+//      perspective divide → CONSTANT screen thickness of exactly
+//      2·edgeSize device pixels (babylon: `screenNormal / (viewport*0.25) *
+//      offset * projectedPosition.w`). PMX edgeSize ~0.3–1.0 ⇒ fine 0.6–2px
+//      rims, matching MMD instead of our former chunky constants.
+//   3. The FRAGMENT stage samples the material's own diffuse texture and
+//      MODULATES the rim's alpha by it (discarding only near-zero cut-out
+//      margins) — sheer fabric gets a proportional rim, never a solid black
+//      hull, without dropping the author's edge flag.
 export const OUTLINE_SHADER_WGSL = /* wgsl */ `
 struct CameraUniforms {
   view: mat4x4f,
   projection: mat4x4f,
   viewPos: vec3f,
-  _padding: f32,
+  // Render-target height in device pixels (engine writes it each frame);
+  // width is recovered via the projection matrix's aspect.
+  viewportHeight: f32,
 };
 
 struct MaterialUniforms {
@@ -17,16 +30,20 @@ struct MaterialUniforms {
 };
 
 @group(0) @binding(0) var<uniform> camera: CameraUniforms;
+@group(0) @binding(1) var edgeSampler: sampler;
 @group(1) @binding(0) var<storage, read> skinMats: array<mat4x4f>;
 @group(2) @binding(0) var<uniform> material: MaterialUniforms;
+@group(2) @binding(1) var diffuseTexture: texture_2d<f32>;
 
 struct VertexOutput {
   @builtin(position) position: vec4f,
+  @location(0) uv: vec2f,
 };
 
 @vertex fn vs(
   @location(0) position: vec3f,
   @location(1) normal: vec3f,
+  @location(2) uv: vec2f,
   @location(3) joints0: vec4<u32>,
   @location(4) weights0: vec4<f32>
 ) -> VertexOutput {
@@ -50,33 +67,43 @@ struct VertexOutput {
   let worldPos = skinnedPos.xyz;
   let worldNormal = normalize(skinnedNrm);
 
-  // Screen-space outline extrusion — MMD-style pixel-stable edge line.
-  // 1. Project position and normal-as-direction to clip space.
-  // 2. Normalize the 2D clip-space normal, aspect-compensated so "one pixel horizontally"
-  //    matches "one pixel vertically" (otherwise wide viewports squash the outline in X).
-  // 3. Offset clip-space xy by (normal * edgeSize * edgeScale), then multiply by w
-  //    so the perspective divide cancels out → offset stays constant in NDC regardless
-  //    of depth, matching how MMD / babylon-mmd style outlines look identical when zooming.
-  // 4. edgeScale is in NDC-y units per PMX edgeSize. ≈ 0.006 gives ~3px at 1080p; it's
-  //    tied to viewport HEIGHT so resizing the window keeps pixel thickness stable.
-  let viewProj = camera.projection * camera.view;
-  let clipPos = viewProj * vec4f(worldPos, 1.0);
-  let clipNormal = (viewProj * vec4f(worldNormal, 0.0)).xy;
-  // projection is column-major: proj[0][0] = 1/(aspect·tan(fov/2)), proj[1][1] = 1/tan(fov/2).
-  // Ratio proj[1][1]/proj[0][0] recovers the viewport aspect (width/height).
+  let clipPos = camera.projection * camera.view * vec4f(worldPos, 1.0);
+
+  // babylon-mmd: screenNormal = normalize((view * worldNormal).xy)
+  let viewNormal = (camera.view * vec4f(worldNormal, 0.0)).xyz;
+  let snLen = length(viewNormal.xy);
+  let screenNormal = select(vec2f(0.0, 0.0), viewNormal.xy / snLen, snLen > 1e-5);
+
+  // Reference-height normalization (babylon-mmd ships this variant commented
+  // out as \`renderHeight = 1080\`): thickness is a constant FRACTION of the
+  // frame — 2·edgeSize px at 1080p — so retina DPR and 4K export don't thin
+  // the rims to sub-pixel. Width follows the projection aspect.
+  // projection[1][1]/projection[0][0] = width/height for a symmetric frustum.
   let aspect = camera.projection[1][1] / camera.projection[0][0];
-  let pixelDir = normalize(vec2f(clipNormal.x * aspect, clipNormal.y));
-  let ndcDir = vec2f(pixelDir.x / aspect, pixelDir.y);
-  let edgeScale = 0.0016;
-  let offset = ndcDir * material.edgeSize * edgeScale * clipPos.w;
+  let viewport = vec2f(1080.0 * aspect, 1080.0);
+
+  // NDC offset = edgeSize · 4/viewport, ×w so the perspective divide cancels:
+  // constant screen thickness at any distance (babylon-mmd parity).
+  let offset = screenNormal * (material.edgeSize * 4.0 / viewport) * clipPos.w;
   output.position = vec4f(clipPos.xy + offset, clipPos.z, clipPos.w);
+  output.uv = uv;
   return output;
 }
 
 struct FSOut { @location(0) color: vec4f, @location(1) mask: vec4f };
-@fragment fn fs() -> FSOut {
+@fragment fn fs(input: VertexOutput) -> FSOut {
+  // Rim alpha FOLLOWS the fabric's texture alpha instead of a hard alpha test:
+  // MMD draws blend-material edges solid (only cutout materials alpha-test), so
+  // a 0.4 discard erased the whole hull on semi-transparent cloth — stockinged
+  // legs crossing lost their outline entirely. Modulating instead keeps a
+  // proportional rim on sheer weave (never a solid black hull) and still
+  // discards true cut-out margins like hair-card borders.
+  let texA = textureSample(diffuseTexture, edgeSampler, input.uv).a;
+  if (texA < 0.05) {
+    discard;
+  }
   var out: FSOut;
-  out.color = material.edgeColor;
+  out.color = vec4f(material.edgeColor.rgb, material.edgeColor.a * texA);
   out.mask = vec4f(1.0, 1.0, 0.0, out.color.a);
   return out;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "reze-engine",
-    "version": "0.25.0",
+    "version": "0.25.2",
     "description": "A lightweight WebGPU engine for real-time 3D MMD/PMX model rendering",
     "main": "./dist/index.js",
     "types": "./dist/index.d.ts",