@call-me-sensei/toonlab 0.1.1

package/src/shaders-tsl/chunks/environment-lighting.js

@@ -0,0 +1,260 @@
+// TSL port of src/shaders/chunks/environment-fragment-lighting.glsl — the
+// wrapped-diffuse light bands, banded Blinn-Phong specular, six-direction
+// ambient-probe irradiance, and the derivative-TBN normal perturbation.
+//
+// Scene light data comes from the shared toonSceneLights uniforms
+// (chunks/character-scene-lights.js) instead of three's <lights_pars_begin>
+// blocks; syncToonSceneLights replicates WebGLLights' view-space conventions,
+// so the light ingredients match what the GLSL loops consumed. The GLSL
+// directionalLights[i] loop is evaluated against the mirrored main light —
+// environment scenes use a single sun, and the NUM_DIR_LIGHTS == 0 fallback
+// (L = normalize(vec3(0.35, 0.75, 0.55)), white color) maps onto
+// hasMainLight = 0 with identical band math.
+//
+// NOTE (preserved GLSL quirk): the wrapped diffuse terms dot the "world"
+// normal — which the vertex stage actually writes in VIEW space — against
+// three's view-space light data. That mismatch is part of the approved
+// baseline look, so it is ported as-is; the specular term additionally
+// re-applies the view matrix to the already-view-space normal, exactly like
+// the GLSL did.
+//
+// GLSL out-parameters (strongestLight) become returned { light, strongest }
+// node-var pairs. Uniform-driven early returns keep their If() shape.
+
+import {
+  clamp,
+  cross,
+  dFdx,
+  dFdy,
+  dot,
+  float,
+  Fn,
+  If,
+  inverseSqrt,
+  length,
+  max,
+  mix,
+  normalize,
+  pow,
+  select,
+  smoothstep,
+  vec3,
+  vec4,
+} from 'three/tsl';
+
+import {
+  getMainLightDirection,
+  MAX_TOON_POINT_LIGHTS,
+  MAX_TOON_SPOT_LIGHTS,
+  toonSceneLights,
+} from './character-scene-lights.js';
+
+function maxComponent3(value) {
+  return max(value.r, max(value.g, value.b));
+}
+
+// three's getDistanceAttenuation (common.glsl) — physically based falloff
+// with the artist cutoff window, matching getPointLightInfo/getSpotLightInfo.
+const distanceAttenuation = /*@__PURE__*/ Fn(([lightDistance, cutoffDistance, decayExponent]) => {
+  const distanceFalloff = float(1.0).div(max(pow(lightDistance, decayExponent), 0.01)).toVar();
+  If(cutoffDistance.greaterThan(0.0), () => {
+    const ratio = lightDistance.div(cutoffDistance);
+    const ratio2 = ratio.mul(ratio);
+    const window1 = ratio2.mul(ratio2).oneMinus().clamp(0.0, 1.0);
+    distanceFalloff.mulAssign(window1.mul(window1));
+  });
+  return distanceFalloff;
+});
+
+export function createEnvironmentLightingChunk({ u, tex, flags, cameraViewMatrixNode }) {
+  const s = toonSceneLights;
+
+  // The wrapped half-Lambert curve (0.16..0.86 smoothstep window) is the
+  // canonical toonlab band; consumers outside this stitched shader must keep
+  // the constants in step (see the GLSL chunk header).
+  const evaluateDirectionalLight = (normal) => {
+    const strongest = float(0.0).toVar();
+    const light = vec3(0.0).toVar();
+    If(u.enableDirectionalLights.greaterThanEqual(0.5), () => {
+      // GLSL NUM_DIR_LIGHTS > 0 uses directionalLights[0]; NUM_DIR_LIGHTS == 0
+      // falls back to the fixed direction with white color. Both cases share
+      // the band formulas, so hasMainLight selects between them at runtime.
+      const L = getMainLightDirection();
+      const lightColor = mix(vec3(1.0), s.mainLightColor, s.hasMainLight);
+      const halfLambert = dot(normal, L).mul(0.5).add(0.5);
+      const wrappedLight = smoothstep(
+        float(0.16).sub(u.shadeSoftness),
+        float(0.86).add(u.shadeSoftness),
+        halfLambert,
+      );
+      const lightBand = mix(1.0, wrappedLight, u.shadeStrength);
+      strongest.assign(wrappedLight);
+      light.assign(lightColor.mul(lightBand));
+    });
+    return { light, strongest };
+  };
+
+  const evaluatePointLights = (normal, geometryPosition) => {
+    const strongest = float(0.0).toVar();
+    const light = vec3(0.0).toVar();
+    If(u.enablePointLights.greaterThanEqual(0.5), () => {
+      for (let i = 0; i < MAX_TOON_POINT_LIGHTS; i += 1) {
+        If(float(i).lessThan(s.pointLightCount), () => {
+          // getPointLightInfo(pointLights[i], geometryPosition, pointLight)
+          const lVector = s.pointLightPositions.element(i).sub(geometryPosition);
+          const lightDistance = length(lVector);
+          const direction = lVector.div(max(lightDistance, 1e-6));
+          const params = s.pointLightParams.element(i);
+          const attenuation = distanceAttenuation(lightDistance, params.x, params.y);
+          const color = s.pointLightColors.element(i).mul(attenuation).toVar();
+          If(maxComponent3(color).greaterThan(0.0), () => { // pointLight.visible
+            const halfLambert = dot(normal, direction).mul(0.5).add(0.5);
+            const wrappedLight = smoothstep(0.08, 0.88, halfLambert);
+            const lightBand = mix(0.18, wrappedLight, u.shadeStrength);
+            strongest.assign(max(strongest, wrappedLight.mul(maxComponent3(color))));
+            light.addAssign(color.mul(lightBand));
+          });
+        });
+      }
+    });
+    return { light, strongest };
+  };
+
+  const evaluateSpotLights = (normal, geometryPosition) => {
+    const strongest = float(0.0).toVar();
+    const light = vec3(0.0).toVar();
+    If(u.enableSpotLights.greaterThanEqual(0.5).and(u.spotLightStrength.greaterThan(0.0)), () => {
+      for (let i = 0; i < MAX_TOON_SPOT_LIGHTS; i += 1) {
+        If(float(i).lessThan(s.spotLightCount), () => {
+          // getSpotLightInfo(spotLights[i], geometryPosition, spotLight)
+          const lVector = s.spotLightPositions.element(i).sub(geometryPosition);
+          const lightDistance = length(lVector);
+          const direction = lVector.div(max(lightDistance, 1e-6));
+          const params = s.spotLightParams.element(i);
+          const angleCos = dot(direction, normalize(s.spotLightDirections.element(i)));
+          const spotAttenuation = smoothstep(params.z, params.w, angleCos);
+          const attenuation = distanceAttenuation(lightDistance, params.x, params.y)
+            .mul(spotAttenuation);
+          const color = s.spotLightColors.element(i).mul(attenuation).toVar();
+          If(maxComponent3(color).greaterThan(0.0), () => { // spotLight.visible
+            const halfLambert = dot(normal, direction).mul(0.5).add(0.5);
+            const wrappedLight = smoothstep(0.08, 0.88, halfLambert);
+            const lightBand = mix(0.12, wrappedLight, u.shadeStrength);
+            strongest.assign(max(strongest, wrappedLight.mul(maxComponent3(color))));
+            light.addAssign(color.mul(lightBand));
+          });
+        });
+      }
+    });
+    return { light, strongest };
+  };
+
+  // Banded Blinn-Phong highlight for glossy interiors. The GLSL transforms
+  // its (already view-space, see quirk note above) normal by viewMatrix again
+  // — ported verbatim for parity.
+  const evaluateEnvironmentSpecular = (worldNormal, geometryPosition, sunlightVisibility) => {
+    const result = vec3(0.0).toVar();
+    const normalView = normalize(cameraViewMatrixNode.mul(vec4(worldNormal, 0.0)).xyz);
+    const viewDir = normalize(geometryPosition.negate());
+
+    const bandedSpecular = (lightDirection) => {
+      const halfDir = normalize(normalize(lightDirection).add(viewDir));
+      const spec = pow(max(dot(normalView, halfDir), 0.0), u.specularShininess);
+      return smoothstep(
+        float(0.5).sub(u.specularSoftness),
+        float(0.5).add(u.specularSoftness),
+        spec,
+      );
+    };
+
+    // Directional loop — main light only, gated on presence (the GLSL
+    // NUM_DIR_LIGHTS == 0 build compiles no directional specular at all).
+    If(s.hasMainLight.greaterThan(0.5), () => {
+      const spec = bandedSpecular(s.mainLightDirection);
+      result.addAssign(s.mainLightColor.mul(spec).mul(sunlightVisibility));
+    });
+
+    for (let i = 0; i < MAX_TOON_POINT_LIGHTS; i += 1) {
+      If(float(i).lessThan(s.pointLightCount), () => {
+        const lVector = s.pointLightPositions.element(i).sub(geometryPosition);
+        const lightDistance = length(lVector);
+        const direction = lVector.div(max(lightDistance, 1e-6));
+        const params = s.pointLightParams.element(i);
+        const attenuation = distanceAttenuation(lightDistance, params.x, params.y);
+        const color = s.pointLightColors.element(i).mul(attenuation).toVar();
+        If(maxComponent3(color).greaterThan(0.0), () => {
+          result.addAssign(color.mul(bandedSpecular(direction)));
+        });
+      });
+    }
+
+    for (let i = 0; i < MAX_TOON_SPOT_LIGHTS; i += 1) {
+      If(float(i).lessThan(s.spotLightCount), () => {
+        const lVector = s.spotLightPositions.element(i).sub(geometryPosition);
+        const lightDistance = length(lVector);
+        const direction = lVector.div(max(lightDistance, 1e-6));
+        const params = s.spotLightParams.element(i);
+        const angleCos = dot(direction, normalize(s.spotLightDirections.element(i)));
+        const spotAttenuation = smoothstep(params.z, params.w, angleCos);
+        const attenuation = distanceAttenuation(lightDistance, params.x, params.y)
+          .mul(spotAttenuation);
+        const color = s.spotLightColors.element(i).mul(attenuation).toVar();
+        If(maxComponent3(color).greaterThan(0.0), () => {
+          result.addAssign(color.mul(bandedSpecular(direction)));
+        });
+      });
+    }
+
+    return result;
+  };
+
+  // Six-direction irradiance from the scene ambient probe (shared uniform
+  // array). Element access on uniform arrays is a pure expression, so the
+  // ternaries stay select()s like the GLSL.
+  const environmentProbeIrradiance = (normal) => {
+    const probe = u.ambientProbe;
+    const weights = normal.mul(normal);
+    const x = select(normal.x.greaterThanEqual(0.0), probe.element(0), probe.element(1));
+    const y = select(normal.y.greaterThanEqual(0.0), probe.element(2), probe.element(3));
+    const z = select(normal.z.greaterThanEqual(0.0), probe.element(4), probe.element(5));
+    return x.mul(weights.x).add(y.mul(weights.y)).add(z.mul(weights.z));
+  };
+
+  // Derivative-TBN normal perturbation (mirrors three's tangentless
+  // normal_fragment_maps path) — only built when the material has a normal
+  // map (the USE_ENV_NORMAL_MAP define analog).
+  const perturbEnvironmentNormal = flags.hasNormalMap
+    ? (normal, worldPosition, uvNode) => {
+      const mapN = tex.normalMapTex.sample(uvNode).xyz.mul(2.0).sub(1.0).toVar();
+      mapN.xy.mulAssign(u.normalMapScale.mul(u.normalMapStrength));
+
+      const q0 = dFdx(worldPosition);
+      const q1 = dFdy(worldPosition);
+      const st0 = dFdx(uvNode);
+      const st1 = dFdy(uvNode);
+
+      const n = normalize(normal);
+      const q1perp = cross(q1, n);
+      const q0perp = cross(n, q0);
+      const tangent = q1perp.mul(st0.x).add(q0perp.mul(st1.x));
+      const bitangent = q1perp.mul(st0.y).add(q0perp.mul(st1.y));
+
+      const det = max(dot(tangent, tangent), dot(bitangent, bitangent));
+      const scale = select(det.equal(0.0), float(0.0), inverseSqrt(det));
+      return normalize(
+        tangent.mul(mapN.x.mul(scale))
+          .add(bitangent.mul(mapN.y.mul(scale)))
+          .add(n.mul(mapN.z)),
+      );
+    }
+    : null;
+
+  return {
+    environmentProbeIrradiance,
+    evaluateDirectionalLight,
+    evaluateEnvironmentSpecular,
+    evaluatePointLights,
+    evaluateSpotLights,
+    perturbEnvironmentNormal,
+  };
+}

package/src/shaders-tsl/chunks/environment-sun-shadow.js

@@ -0,0 +1,87 @@
+// Shared sun-shadow sampling for TSL environment + character materials —
+// the node-backend replacement for three's <shadowmask_pars_fragment>
+// getShadowMask() (the classic renderer's shadow system is driven by
+// materials with lights:true, which the toon pipeline never uses on the node
+// backends).
+//
+// A dedicated pass (src/environment/environmentSunShadowPass.js) renders the
+// scene from the shadow-casting sun into a float color target (linear window
+// depth — see docs/tsl-conventions.md on depth-texture sampling) and fills
+// these shared uniforms. Until that pass runs, `ready` stays false and the
+// mask is 1.0 everywhere — identical to a scene with no shadow-casting sun.
+
+import * as THREE from 'three';
+import {
+  clamp,
+  dot,
+  float,
+  Fn,
+  If,
+  mix,
+  smoothstep,
+  step,
+  texture,
+  uniform,
+  vec2,
+  vec4,
+} from 'three/tsl';
+
+export const environmentSunShadow = {
+  bias: uniform(0.0025),
+  map: null, // TextureNode, created lazily below (needs a fallback texture)
+  mapSize: uniform(2048),
+  matrix: uniform(new THREE.Matrix4()),
+  radius: uniform(1),
+  ready: uniform(false, 'bool'),
+};
+
+let fallbackTexture = null;
+
+export function sunShadowMapNode() {
+  if (!environmentSunShadow.map) {
+    if (!fallbackTexture) {
+      const data = new Uint8Array([255, 255, 255, 255]);
+      fallbackTexture = new THREE.DataTexture(data, 1, 1);
+      fallbackTexture.needsUpdate = true;
+    }
+    environmentSunShadow.map = texture(fallbackTexture);
+  }
+  return environmentSunShadow.map;
+}
+
+/**
+ * getShadowMask() replacement: 1 fully lit, 0 fully shadowed. worldPosition
+ * is the fragment's world position node. The matrix is CPU-composed to yield
+ * GL-convention clip coords under the shader's *0.5+0.5 remap on every
+ * backend (see shadowClipAdjust in the pass).
+ */
+export const sampleEnvironmentSunShadow = /*@__PURE__*/ Fn(([worldPosition]) => {
+  const shadow = float(1.0).toVar();
+  If(environmentSunShadow.ready, () => {
+    const shadowNdc = environmentSunShadow.matrix.mul(vec4(worldPosition, 1.0));
+    const coord = shadowNdc.xyz.div(shadowNdc.w).mul(0.5).add(0.5).toVar();
+    const inside = coord.x.greaterThanEqual(0.0).and(coord.x.lessThanEqual(1.0))
+      .and(coord.y.greaterThanEqual(0.0)).and(coord.y.lessThanEqual(1.0))
+      .and(coord.z.lessThanEqual(1.0)).and(coord.z.greaterThanEqual(0.0));
+    If(inside, () => {
+      const texel = float(1.0).div(environmentSunShadow.mapSize);
+      const reference = coord.z.sub(environmentSunShadow.bias);
+      const map = sunShadowMapNode();
+      // 3×3 PCF (classic PCFSoftShadowMap kernel footprint): averages the
+      // 8-bit-quantized self-shadowing into the fine dither the approved
+      // interior look was tuned around; radius scales the spread.
+      const spread = texel.mul(environmentSunShadow.radius);
+      const visibility = float(0.0).toVar();
+      for (let y = -1; y <= 1; y += 1) {
+        for (let x = -1; x <= 1; x += 1) {
+          visibility.addAssign(step(
+            reference,
+            map.sample(coord.xy.add(vec2(x, y).mul(spread))).level(0).x,
+          ));
+        }
+      }
+      shadow.assign(visibility.div(9.0));
+    });
+  });
+  return shadow;
+});

package/src/shaders-tsl/chunks/foliage-fog.js

@@ -0,0 +1,60 @@
+// Manual linear scene fog for the world-anchored foliage cards (grass, tree
+// canopies) on the node backends.
+//
+// Why not `material.fog = true`? Those materials override `vertexNode` with a
+// custom world-space billboard, so their real rendered depth lives in a
+// varying (viewPosition.z). three's built-in node fog instead reads the
+// built-in `positionView` (modelViewMatrix * positionLocal), which is derived
+// independently of the custom vertex — for a distant billboard that view-Z is
+// wrong and the crown over-fogs into the sky (only visible under aggressive
+// near fog like the water lab's). The classic GLSL path never had this: its
+// `fog_vertex` chunk reads the same billboarded mvPosition the vertex outputs.
+//
+// So we mirror the GLSL `fog_fragment` exactly — linear smoothstep(near, far)
+// on the true billboarded view depth — and set `material.fog = false`.
+//
+// Defaults are a no-op (far = 1e9), so a material whose lab never calls
+// syncFoliageFog renders unfogged rather than wrong.
+
+import * as THREE from 'three';
+import { mix, smoothstep, uniform, vec3 } from 'three/tsl';
+
+/** Fog uniform block for a foliage material. Default = effectively no fog. */
+export function createFoliageFogUniforms() {
+  return {
+    uFogColor: uniform(new THREE.Color(0xffffff)),
+    uFogNear: uniform(1),
+    uFogFar: uniform(1e9),
+  };
+}
+
+/**
+ * Applies linear fog to `color` using the billboarded view depth.
+ * @param {*} color   vec3 node (mutated via return)
+ * @param {*} vViewZ  varying float: viewPosition.z (negative forward)
+ * @param {*} u       the fog uniform block
+ * @returns fogged vec3 node
+ */
+export function applyFoliageFog(color, vViewZ, u) {
+  // GLSL fog_fragment uses vFogDepth = -mvPosition.z (positive). viewPosition.z
+  // is negative forward, so depth = -vViewZ.
+  const fogFactor = smoothstep(u.uFogNear, u.uFogFar, vViewZ.negate());
+  return mix(color, vec3(u.uFogColor), fogFactor);
+}
+
+/**
+ * Copies a scene's linear Fog into a foliage material's fog uniforms. Call
+ * once per frame (fog color/range can change with time of day). A null/absent
+ * fog, or a non-linear FogExp2, disables fog (far = 1e9).
+ */
+export function syncFoliageFog(material, fog) {
+  const u = material?.uniforms;
+  if (!u?.uFogFar) return;
+  if (fog && fog.isFog && typeof fog.near === 'number') {
+    u.uFogColor.value.copy(fog.color);
+    u.uFogNear.value = fog.near;
+    u.uFogFar.value = fog.far;
+  } else {
+    u.uFogFar.value = 1e9;
+  }
+}

package/src/shaders-tsl/chunks/pass-depth-color.js

@@ -0,0 +1,89 @@
+// Depth-as-color pass material for the node backends, shared by the
+// character passes (scene depth prepass, self-shadow map) and the
+// environment sun-shadow pass.
+//
+// The node renderer's WGSL and GLSL builders type depth-texture samples
+// differently (float vs vec4 — docs/tsl-conventions.md), so passes write
+// linear window depth into a float COLOR attachment instead: [0,1] window
+// depth is numerically identical on both coordinate systems for perspective
+// and orthographic cameras alike. The select keys off the active camera, so
+// one material serves both projections.
+//
+// Manual samplers of these targets need the GL-convention matrix pre-adjust
+// exported below (node-renderer RTs are written top-down on BOTH backends;
+// WebGPU clip z is additionally already [0,1]).
+
+import * as THREE from 'three';
+import {
+  cameraFar,
+  cameraNear,
+  cameraProjectionMatrix,
+  positionView,
+  select,
+  texture as textureNode,
+  vec3,
+  vec4,
+  viewZToOrthographicDepth,
+  viewZToPerspectiveDepth,
+} from 'three/tsl';
+import { MeshBasicNodeMaterial } from 'three/webgpu';
+
+import { withToonStorageSkinning } from './character-skinning.js';
+
+// Skinned meshes (MMD-scale skeletons included) skin through the storage/PBO
+// path on the WebGL2 backend — see character-skinning.js.
+export const PassBasicNodeMaterial = withToonStorageSkinning(MeshBasicNodeMaterial);
+
+export function createPassDepthColorMaterial({
+  alphaTest = 0,
+  map = null,
+  side = THREE.DoubleSide,
+  // The classic sun shadow map stored packed-RGBA8 depth; its ~1/255
+  // quantization produces the dithered self-shadowing the environment look
+  // was tuned around. The sun pass opts in to reproduce that exact
+  // mechanism; the character passes keep full float precision (classic used
+  // 24-bit depth textures there).
+  quantize256 = false,
+} = {}) {
+  const material = new PassBasicNodeMaterial({ side });
+  // three's shadow-pass exemption: keeps the render-object cache key free of
+  // per-frame scene state (background/environment toggled around the pass),
+  // which otherwise disposes+recreates every depth render object each frame —
+  // destroying object uniform buffers that in-flight submits still reference.
+  material.isShadowPassMaterial = true;
+  const orthographic = cameraProjectionMatrix.element(3).w.equal(1.0);
+  let depth01 = select(
+    orthographic,
+    viewZToOrthographicDepth(positionView.z, cameraNear, cameraFar),
+    viewZToPerspectiveDepth(positionView.z, cameraNear, cameraFar),
+  );
+  if (quantize256) depth01 = depth01.mul(255.0).floor().div(255.0);
+  const alpha = map && alphaTest > 0 ? textureNode(map).a : 1.0;
+  material.colorNode = vec4(vec3(depth01), alpha);
+  if (alphaTest > 0) material.alphaTest = alphaTest;
+  return material;
+}
+
+// Pre-multiply onto proj * viewInverse so a shader using the GL-convention
+// `clip.xyz * 0.5 + 0.5` remap samples the right texel and compares the right
+// depth on each backend.
+export const shadowClipAdjustWebGPU = new THREE.Matrix4().set(
+  1, 0, 0, 0,
+  0, -1, 0, 0,
+  0, 0, 2, -1,
+  0, 0, 0, 1,
+);
+export const shadowClipAdjustGL = new THREE.Matrix4().set(
+  1, 0, 0, 0,
+  0, -1, 0, 0,
+  0, 0, 1, 0,
+  0, 0, 0, 1,
+);
+
+export function applyShadowClipAdjust(matrix, renderer) {
+  return matrix.premultiply(
+    renderer.coordinateSystem === THREE.WebGPUCoordinateSystem
+      ? shadowClipAdjustWebGPU
+      : shadowClipAdjustGL,
+  );
+}

package/src/shaders-tsl/chunks/stylized-cloud-shadow.js

@@ -0,0 +1,70 @@
+// TSL port of src/shaders/chunks/stylized-cloud-shadow.glsl — scrolling
+// procedural cloud shadows for outdoor stylized scenes. A cheap 3-octave
+// value-noise fbm (same rotation/lacunarity family as the sky's cloud fbm)
+// sampled in world XZ and drifted by a velocity. Pure functions — callers
+// pass their own uniforms, so grass, tree canopies, terrain, and any future
+// surface share one implementation without colliding uniform names.
+
+import {
+  clamp,
+  dot,
+  float,
+  floor,
+  Fn,
+  fract,
+  If,
+  mix,
+  smoothstep,
+  vec2,
+  vec3,
+} from 'three/tsl';
+
+export const cloudShadowHash = /*@__PURE__*/ Fn(([p]) => {
+  const p3 = fract(vec3(p.x, p.y, p.x).mul(0.1031)).toVar();
+  p3.addAssign(dot(p3, p3.yzx.add(33.33)));
+  return fract(p3.x.add(p3.y).mul(p3.z));
+});
+
+export const cloudShadowNoise = /*@__PURE__*/ Fn(([p]) => {
+  const i = floor(p);
+  const f = fract(p);
+  const u = f.mul(f).mul(f.mul(-2.0).add(3.0));
+  const a = cloudShadowHash(i);
+  const b = cloudShadowHash(i.add(vec2(1.0, 0.0)));
+  const c = cloudShadowHash(i.add(vec2(0.0, 1.0)));
+  const d = cloudShadowHash(i.add(vec2(1.0, 1.0)));
+  return mix(mix(a, b, u.x), mix(c, d, u.x), u.y);
+});
+
+/**
+ * GLSL stylizedCloudShadow(worldXZ, time, strength, coverage, scale,
+ * velocity): sunlight visibility factor in [1 - strength, 1]. strength below
+ * 0.001 short-circuits to fully lit (same If shape as the GLSL early return,
+ * so the fbm costs nothing while disabled).
+ */
+export const stylizedCloudShadow = /*@__PURE__*/ Fn(([worldXZ, time, strength, coverage, scale, velocity]) => {
+  const visibility = float(1.0).toVar();
+  If(strength.greaterThanEqual(0.001), () => {
+    const uv = worldXZ.mul(scale).add(velocity.mul(time)).toVar();
+    const value = float(0.0).toVar();
+    let amplitude = 0.5;
+    let total = 0.0;
+    for (let i = 0; i < 3; i += 1) {
+      value.addAssign(cloudShadowNoise(uv).mul(amplitude));
+      total += amplitude;
+      // GLSL: uv = mat2(0.8, 0.6, -0.6, 0.8) * uv * 2.02 + vec2(17.13, 9.77),
+      // written out component-wise (columns (0.8, 0.6) and (-0.6, 0.8)) —
+      // TSL matN() scalar constructors are row-major (docs/tsl-conventions.md).
+      uv.assign(vec2(
+        uv.x.mul(0.8).add(uv.y.mul(-0.6)),
+        uv.x.mul(0.6).add(uv.y.mul(0.8)),
+      ).mul(2.02).add(vec2(17.13, 9.77)));
+      amplitude *= 0.5;
+    }
+    value.divAssign(Math.max(total, 1e-4));
+    const threshold = mix(0.72, 0.4, clamp(coverage, 0.0, 1.0));
+    const cloud = smoothstep(threshold, threshold.add(0.17), value);
+    visibility.assign(cloud.mul(clamp(strength, 0.0, 1.0)).oneMinus());
+  });
+  return visibility;
+});