@driftengine/core 4.12.0 → 4.13.1

package/dist/render/backend/webgl2/renderer.js

@@ -119,7 +119,9 @@ import { FlockRenderer } from '../../flockRenderer.js';
 import { TextRenderer } from '../../textRenderer.js';
 import { SdfTextRenderer } from '../../sdfTextRenderer.js';
 import { MOTION_BLUR_MAX_UV, OBJECT_BLUR_UNKEPT, RUSH_REACH_UV, clampMotionShare, } from '../../vertexDefaults.js';
-import { OUTPUT_TRANSFORM_CODE, forwardTransformCode } from '../../vertexDefaults.js';
+import { OUTPUT_TRANSFORM_CODE } from '../../vertexDefaults.js';
+import { gradeColorInto } from '../../gradeColor.js';
+import { interfaceGrade, passGradeCode, passGradeExposure } from '../../passGrade.js';
 import { DEFAULT_FILMIC_CURVE, FILMIC_CLAMPED, FILMIC_CONSTANTS, FILMIC_WITHOUT_COMPOSITE, resolveFilmicCurve, } from '../../filmicCurve.js';
 import { deviceSnappedCellSize } from '../../textLayout.js';
 import { WindStreakRenderer } from '../../windStreakRenderer.js';
@@ -978,6 +980,8 @@ export class WebGL2Renderer {
     warnedOverlayBlocks = false;
     /** Whether a probe is being baked, so the passes that would recurse into one can tell. */
     probePassActive = false;
+    /** `clearOf`'s scratch: a clear colour as the open target takes it. */
+    gradedClear = [0, 0, 0];
     /**
      * Whether a scene capture is being drawn (`captureScene`): an off-screen pass like a bake, so the
      * frame's own view, its refraction copy and skin's spread are left alone, but lit as the frame is.
@@ -1691,8 +1695,8 @@ export class WebGL2Renderer {
             sceneDepth: null,
         };
         const context = this.passContext;
-        context.outputTransform = this.gradeCode();
-        context.outputExposure = this.gradeExposure();
+        context.outputTransform = this.passGrade();
+        context.outputExposure = this.passGradeExposure();
         /*
          * The copies a pass declared it reads, taken here with everything drawn before it: colour
          * afresh at each reading pass, as WebGPU's `takePassColour` does, so a full-screen effect drawn
@@ -2821,11 +2825,11 @@ export class WebGL2Renderer {
         finally {
             target.end(gl);
             gl.frontFace(gl.CCW);
+            this.capturePassActive = false;
             this.useFlatProgram();
-            gl.uniform1i(this.flatUniforms['uOutputTransform'] ?? null, this.gradeCode());
-            gl.uniform1f(this.flatUniforms['uOutputExposure'] ?? null, this.gradeExposure());
+            gl.uniform1i(this.flatUniforms['uOutputTransform'] ?? null, this.passGrade());
+            gl.uniform1f(this.flatUniforms['uOutputExposure'] ?? null, this.passGradeExposure());
             this.materials.dirty();
-            this.capturePassActive = false;
             this.temporalJittering = jittering;
             this.restoreViewport();
         }
@@ -4105,7 +4109,7 @@ export class WebGL2Renderer {
         if (fog !== this.surfaceFog)
             gl.uniform1i(u['uFogEnabled'] ?? null, fog);
         if (!toneMapped)
-            gl.uniform1i(u['uOutputTransform'] ?? null, Math.min(this.gradeCode(), 1));
+            gl.uniform1i(u['uOutputTransform'] ?? null, Math.min(this.passGrade(), 1));
         if (blend) {
             gl.enable(gl.BLEND);
             if (options.additive === true)
@@ -4176,7 +4180,7 @@ export class WebGL2Renderer {
         if (fog !== this.surfaceFog)
             gl.uniform1i(u['uFogEnabled'] ?? null, this.surfaceFog);
         if (!toneMapped)
-            gl.uniform1i(u['uOutputTransform'] ?? null, this.gradeCode());
+            gl.uniform1i(u['uOutputTransform'] ?? null, this.passGrade());
         if (own)
             this.materials.dirty();
         this.useFlatProgram();
@@ -4328,7 +4332,7 @@ export class WebGL2Renderer {
         // raining dust into the sea.
         const surface = env.underwater?.surfaceY;
         const submerged = surface !== undefined && (camera.position[1] ?? 0) < surface;
-        if (streaks.draw(this.gl, this.frameViewFor(camera), wind, timeSeconds, tint, submerged)) {
+        if (streaks.draw(this.gl, this.frameViewFor(camera), wind, timeSeconds, tint, submerged, this.passGrade(), this.passGradeExposure())) {
             this.windStreakBudget.ask();
         }
     }
@@ -4356,7 +4360,7 @@ export class WebGL2Renderer {
      */
     drawText(text, viewportWidth, viewportHeight, originX, originY, style, timeSec) {
         this.scatterSkin();
-        if (text.draw(viewportWidth, viewportHeight, originX, originY, style, timeSec)) {
+        if (text.draw(viewportWidth, viewportHeight, originX, originY, style, timeSec, interfaceGrade(this.passGrade()), 1)) {
             this.textBudget.ask();
         }
     }
@@ -4423,7 +4427,9 @@ export class WebGL2Renderer {
      * real draw call touches the unit in the first place.
      */
     /**
-     * The output transform a forward pass should apply, and the exposure it should apply it at.
+     * The grade a pass applies to what it draws into the target open now, and the exposure it
+     * applies it at. The decision is `passGrade.ts`'s, for both backends; this only gathers the
+     * state it is taken from.
      *
      * **Only where that pass is genuinely the last one to touch the frame.** With a scene target
      * the resolve grades, so a pass that graded as well would be applying a curve to its own
@@ -4431,20 +4437,34 @@ export class WebGL2Renderer {
      * `screenEffects` off there is no resolve at all and every pass writes straight to the canvas,
      * so each one has to grade itself or the frame comes out half converted: linear values in an
      * eight-bit buffer read as display values, which is a saturated, clipped version of the colour
-     * the caller asked for rather than a slightly different one.
+     * the caller asked for rather than a slightly different one. A probe's face or a capture is
+     * never graded, and past the present every pass grades itself, composite or not.
      *
      * One pair of accessors rather than the expression written out at each site, because that is
      * how the mesh pass and the particle pass came to disagree in the first place: the mesh pass
      * gated, and the particle pass uploaded the transform unconditionally to a stage that did not
      * yet declare it.
      */
-    gradeCode() {
-        return this.sceneTarget === null || !this.quality.hdrScene
-            ? forwardTransformCode(this.quality.outputTransform)
-            : 0;
+    passGrade() {
+        const storing = this.probePassActive || this.capturePassActive;
+        const transform = this.quality.outputTransform;
+        return passGradeCode(storing, this.framePresented, this.resolveGrades(), transform);
+    }
+    passGradeExposure() {
+        const storing = this.probePassActive || this.capturePassActive;
+        return passGradeExposure(storing, this.framePresented, this.resolveGrades(), this.exposure);
     }
-    gradeExposure() {
-        return this.sceneTarget === null || !this.quality.hdrScene ? this.exposure : 1;
+    /** Whether the frame's resolve applies the transform, so the passes before it draw linear. */
+    resolveGrades() {
+        return this.sceneTarget !== null && this.quality.hdrScene;
+    }
+    /**
+     * A clear colour as the target open now takes it: graded as a pass would grade it, so a colour
+     * handed to the renderer is linear wherever it lands — the clear too, which the resolve grades
+     * with everything else under `hdrScene`. See `gradeColor.ts`. Into one scratch, read at once.
+     */
+    clearOf(color) {
+        return gradeColorInto(this.passGrade(), this.passGradeExposure(), color, this.gradedClear);
     }
     drawSdfText(handle, model, color, opacity) {
         this.scatterSkin();
@@ -4454,7 +4474,7 @@ export class WebGL2Renderer {
         if (viewProj === null)
             return;
         /* Geometry, so the remapped matrix: `frameViewProj` itself stays raw for the motion blur. */
-        if (handle.draw(this.sceneMatrix(viewProj), model, color, opacity, this.gradeCode(), this.gradeExposure())) {
+        if (handle.draw(this.sceneMatrix(viewProj), model, color, opacity, this.passGrade(), this.passGradeExposure())) {
             this.sdfTextBudget.ask();
             this.restoreSurfaceTextureUnit();
         }
@@ -4468,7 +4488,7 @@ export class WebGL2Renderer {
     }
     drawFlock(flock, camera, timeSeconds, params, tint, windX = 0, windZ = 0) {
         this.flockBudget.ask();
-        flock.draw(this.gl, this.frameViewFor(camera), timeSeconds, params, tint, windX, windZ);
+        flock.draw(this.gl, this.frameViewFor(camera), timeSeconds, params, tint, windX, windZ, this.passGrade(), this.passGradeExposure());
     }
     /**
      * Build a scatter batch and fill it. Takes the data rather than handing back
@@ -4552,8 +4572,8 @@ export class WebGL2Renderer {
            the uniform at all, so it was a write to a location that did not exist; now that the
            stage grades itself it has to obey the same "only where this pass is last" rule the mesh
            pass does, or a scene with a composite grades its particles twice. */
-        gl.uniform1i(u['uOutputTransform'] ?? null, this.gradeCode());
-        gl.uniform1f(u['uOutputExposure'] ?? null, this.gradeExposure());
+        gl.uniform1i(u['uOutputTransform'] ?? null, this.passGrade());
+        gl.uniform1f(u['uOutputExposure'] ?? null, this.passGradeExposure());
         gl.uniform3fv(u['uAmbient'] ?? null, env.ambient);
         gl.uniform3fv(u['uAmbientGround'] ?? null, env.ambientGround ?? env.ambient);
         gl.uniform1i(u['uNoiseOctaves'] ?? null, this.quality.plumeNoiseOctaves);
@@ -4631,6 +4651,8 @@ export class WebGL2Renderer {
         gl.uniform3fv(u['uCoreColor'] ?? null, core);
         gl.uniform3fv(u['uEdgeColor'] ?? null, edge);
         gl.uniform1f(u['uCoreGain'] ?? null, coreGain);
+        gl.uniform1i(u['uOutputTransform'] ?? null, this.passGrade());
+        gl.uniform1f(u['uOutputExposure'] ?? null, this.passGradeExposure());
         bindAtmosphere(gl, u, env, this.reflectionPassActive ? this.reflectionAtmosphereY : (camera.position[1] ?? 0), this.quality.underwaterAtmosphere);
         batch.drawTo(gl, count);
     }
@@ -4688,8 +4710,8 @@ export class WebGL2Renderer {
         gl.uniform3fv(u['uColor'] ?? null, color);
         gl.uniform1f(u['uOpacity'] ?? null, opacity);
         gl.uniform1f(u['uSoftness'] ?? null, softness);
-        gl.uniform1i(u['uOutputTransform'] ?? null, this.gradeCode());
-        gl.uniform1f(u['uOutputExposure'] ?? null, this.gradeExposure());
+        gl.uniform1i(u['uOutputTransform'] ?? null, this.passGrade());
+        gl.uniform1f(u['uOutputExposure'] ?? null, this.passGradeExposure());
         bindAtmosphere(gl, u, env, this.reflectionPassActive ? this.reflectionAtmosphereY : (camera.position[1] ?? 0), this.quality.underwaterAtmosphere);
         lines.drawTo(gl, count, additive);
     }
@@ -4722,6 +4744,8 @@ export class WebGL2Renderer {
         gl.uniform3fv(u['uDirectionalColor'] ?? null, env.directionalColor);
         gl.uniform3fv(u['uAmbient'] ?? null, env.ambient);
         gl.uniform3fv(u['uCameraPos'] ?? null, camera.position);
+        gl.uniform1i(u['uOutputTransform'] ?? null, this.passGrade());
+        gl.uniform1f(u['uOutputExposure'] ?? null, this.passGradeExposure());
         bindAtmosphere(gl, u, env, this.reflectionPassActive ? this.reflectionAtmosphereY : (camera.position[1] ?? 0), this.quality.underwaterAtmosphere);
         // Foliage is thin and seen from both faces; culling it loses half of it.
         gl.disable(gl.CULL_FACE);
@@ -4855,13 +4879,13 @@ export class WebGL2Renderer {
     // --- Draws that own their context ----------------------------------------
     drawPlumes(plumes, camera, timeSeconds, env, windX = 0, windZ = 0, originX = 0, originY = 0, originZ = 0) {
         this.scatterSkin();
-        plumes.draw(this.gl, this.frameViewFor(camera), timeSeconds, env, this.quality.underwaterAtmosphere, this.reflectionPassActive ? this.reflectionAtmosphereY : (camera.position[1] ?? 0), this.reflectionPassActive ? (this.planarReflection?.clipPlane ?? null) : null, windX, windZ, originX, originY, originZ);
+        plumes.draw(this.gl, this.frameViewFor(camera), timeSeconds, env, this.quality.underwaterAtmosphere, this.reflectionPassActive ? this.reflectionAtmosphereY : (camera.position[1] ?? 0), this.reflectionPassActive ? (this.planarReflection?.clipPlane ?? null) : null, windX, windZ, originX, originY, originZ, this.passGrade(), this.passGradeExposure());
     }
     drawWater(water, camera, timeSeconds, settings, env, windX = 0, windZ = 0) {
         if (!this.quality.water)
             return;
         this.waterBudget.ask();
-        water.draw(this.gl, this.frameViewFor(camera), timeSeconds, settings, env.directionalDir, env.directionalColor, env.ambient, env, this.quality.underwaterAtmosphere, this.reflectionReadyThisFrame ? this.planarReflection : null, env, this.quality.pointLightFalloff, windX, windZ);
+        water.draw(this.gl, this.frameViewFor(camera), timeSeconds, settings, env.directionalDir, env.directionalColor, env.ambient, env, this.quality.underwaterAtmosphere, this.reflectionReadyThisFrame ? this.planarReflection : null, env, this.quality.pointLightFalloff, windX, windZ, this.passGrade(), this.passGradeExposure());
     }
     /**
      * Draw after the opaque scene: this is light added to surfaces already shaded,
@@ -4871,7 +4895,7 @@ export class WebGL2Renderer {
         this.scatterSkin();
         if (caustics === null || !this.quality.water)
             return;
-        const drew = caustics.draw(this.gl, this.frameViewFor(camera), timeSeconds, env.directionalDir, env.directionalColor, env.ambient, env, this.quality.underwaterAtmosphere, windX, windZ, strength);
+        const drew = caustics.draw(this.gl, this.frameViewFor(camera), timeSeconds, env.directionalDir, env.directionalColor, env.ambient, env, this.quality.underwaterAtmosphere, windX, windZ, strength, this.passGrade(), this.passGradeExposure());
         if (drew)
             this.causticsBudget.ask();
     }
@@ -4908,7 +4932,7 @@ export class WebGL2Renderer {
             return null;
         this.reflectionReadyThisFrame = false;
         this.reflectionAtmosphereY = source.position[1] ?? 0;
-        const camera = reflection.begin(this.gl, this.canvas.width, this.canvas.height, source, planeY, clearColor);
+        const camera = reflection.begin(this.gl, this.canvas.width, this.canvas.height, source, planeY, this.clearOf(clearColor));
         this.gpuTimer.begin('reflection');
         this.reflectionPassActive = true;
         return camera;
@@ -6046,7 +6070,8 @@ export class WebGL2Renderer {
             gl.clear(gl.DEPTH_BUFFER_BIT);
         }
         else {
-            gl.clearColor(clearColor[0], clearColor[1], clearColor[2], 1);
+            const clear = this.clearOf(clearColor);
+            gl.clearColor(clear[0], clear[1], clear[2], 1);
             gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
         }
         /*
@@ -6140,6 +6165,9 @@ export class WebGL2Renderer {
         gl.uniformMatrix4fv(this.panelUniforms['uClipCorrection'] ?? null, false, IDENTITY_MAT4);
         gl.uniform3fv(this.panelUniforms['uColor'] ?? null, color);
         gl.uniform1f(this.panelUniforms['uAlpha'] ?? null, alpha);
+        /* An interface: the screen encode, never the curve. See `interfaceGrade`. */
+        gl.uniform1i(this.panelUniforms['uOutputTransform'] ?? null, interfaceGrade(this.passGrade()));
+        gl.uniform1f(this.panelUniforms['uOutputExposure'] ?? null, 1);
         gl.drawArrays(gl.TRIANGLES, 0, 6);
         gl.bindVertexArray(null);
         gl.depthMask(true);
@@ -6822,7 +6850,8 @@ export class WebGL2Renderer {
         this.sceneTarget?.begin(this.canvas.width, this.canvas.height);
         /* The materials' maps on the scene's framebuffer, cleared and disabled: `reflectionKeeps`. */
         this.reflectionTargets?.begin(this.canvas.width, this.canvas.height);
-        gl.clearColor(clearColor[0], clearColor[1], clearColor[2], 1);
+        const clear = this.clearOf(clearColor);
+        gl.clearColor(clear[0], clear[1], clear[2], 1);
         gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
     }
     /**
@@ -6957,7 +6986,7 @@ export class WebGL2Renderer {
                 exposure: this.exposure,
                 film: this.filmConstants,
             }
-            : { transform: 0, exposure: 1 };
+            : { transform: 0, exposure: 1, sceneGraded: this.passGrade() !== 0 };
         /*
          * Depth of field, on the same ceiling-and-dial split as bloom above: `depthOfField` decides
          * how far a defocused point may spread and this frame's `setDepthOfField` decides where the
@@ -7007,7 +7036,7 @@ export class WebGL2Renderer {
             else if (this.sceneTarget !== null) {
                 this.decals ??= new DecalPass(this.gl);
                 this.sceneTarget.bind();
-                this.decals.drawDecals(this.decalQueue, marks, this.frameViewProj, this.frameEye, this.canvas.width, this.canvas.height);
+                this.decals.drawDecals(this.decalQueue, marks, this.frameViewProj, this.frameEye, this.canvas.width, this.canvas.height, this.passGrade());
             }
         }
         /*
@@ -7159,7 +7188,7 @@ export class WebGL2Renderer {
                     /* The march finished on the default framebuffer, which is not where the frame is being
                        drawn. See `resolveReflections`, which is the same two-step for the same reason. */
                     this.sceneTarget.bind();
-                    this.medium.compositeMedium(depthCopy, this.canvas.width, this.canvas.height);
+                    this.medium.compositeMedium(depthCopy, this.canvas.width, this.canvas.height, this.passGrade(), this.passGradeExposure());
                 }
             }
         }
@@ -7580,12 +7609,11 @@ export class WebGL2Renderer {
          * exists to keep. With `screenEffects` off there is no resolve at all and the mesh pass
          * writes straight to the canvas, so it stays where it always was.
          *
-         * The consequence worth stating: full grading needs the composite. Without it the sky, the
-         * particles, the film and the water are still ungraded beside a world that is, which is the
-         * inconsistency that existed everywhere before this moved.
+         * Every other pass grades through the same gate, `passGrade`, so a frame without a composite
+         * is graded pass by pass to the curve a composite would have applied once.
          */
-        gl.uniform1i(u['uOutputTransform'] ?? null, this.gradeCode());
-        gl.uniform1f(u['uOutputExposure'] ?? null, this.gradeExposure());
+        gl.uniform1i(u['uOutputTransform'] ?? null, this.passGrade());
+        gl.uniform1f(u['uOutputExposure'] ?? null, this.passGradeExposure());
         gl.uniform3fv(u['uCameraPos'] ?? null, camera.position);
         /*
          * Solid, every frame, before anything asks otherwise. A GL uniform starts at
@@ -8038,7 +8066,7 @@ export class WebGL2Renderer {
             return;
         const depth = scene.snapshotDepth(true);
         mat4.invert(this.skinInverseProjection, projection);
-        skin.spread(scene, depth, this.emptyTexture2D, projection, this.skinInverseProjection);
+        skin.spread(scene, depth, this.emptyTexture2D, projection, this.skinInverseProjection, this.passGrade(), this.passGradeExposure());
         this.useFlatProgram();
     }
     /** One draw of a mesh, as `drawMesh` describes, of the half of a skin `half` names. */
@@ -8361,7 +8389,7 @@ export class WebGL2Renderer {
            means rather than dropping the whole transform. `Math.min` rather than a literal, so a
            renderer asked for `none` stays at none and one asked for `srgb` is already there. */
         if (!toneMapped)
-            gl.uniform1i(u['uOutputTransform'] ?? null, Math.min(this.gradeCode(), 1));
+            gl.uniform1i(u['uOutputTransform'] ?? null, Math.min(this.passGrade(), 1));
         /* Scoped and handed back like every other state here, so a tinted draw cannot leak its
            colour onto the next one. See `TranslucentMeshOptions.tint`. */
         const tint = options.tint ?? null;
@@ -8446,7 +8474,7 @@ export class WebGL2Renderer {
         if (fog !== this.surfaceFog)
             gl.uniform1i(u['uFogEnabled'] ?? null, this.surfaceFog);
         if (!toneMapped)
-            gl.uniform1i(u['uOutputTransform'] ?? null, this.gradeCode());
+            gl.uniform1i(u['uOutputTransform'] ?? null, this.passGrade());
         if (own)
             this.materials.dirty();
     }
@@ -8535,7 +8563,7 @@ export class WebGL2Renderer {
         /*
          * **A probe stores radiance, not display pixels.**
          *
-         * `gradeCode()` is the ACES curve and the sRGB encode whenever the frame has no HDR target,
+         * `passGrade()` is the ACES curve and the sRGB encode whenever the frame has no HDR target,
          * so every face was baked through the whole output transform and the shader then sampled the
          * result as though it were light. Two things came of that and both read as "the reflection is
          * dull": the curve pulls everything bright toward 1 *before* it reaches the cube, so no
@@ -8585,16 +8613,17 @@ export class WebGL2Renderer {
         }
         finally {
             this.gl.frontFace(this.gl.CCW);
-            this.useFlatProgram();
-            this.gl.uniform1i(this.flatUniforms['uOutputTransform'] ?? null, this.gradeCode());
-            this.gl.uniform1f(this.flatUniforms['uOutputExposure'] ?? null, this.gradeExposure());
-            this.materials.dirty();
             /*
              * Cleared even if a caller's own draw threw, because leaving this set would keep every
-             * later frame reading the placeholder and quietly reflecting nothing.
+             * later frame reading the placeholder and quietly reflecting nothing. Before the grade is
+             * put back, which asks it.
              */
             this.probePassActive = false;
             this.probeBounce = false;
+            this.useFlatProgram();
+            this.gl.uniform1i(this.flatUniforms['uOutputTransform'] ?? null, this.passGrade());
+            this.gl.uniform1f(this.flatUniforms['uOutputExposure'] ?? null, this.passGradeExposure());
+            this.materials.dirty();
             /* Back to the canvas, or to the frame's own target if one is bound. See `SceneTarget`. */
             if (this.sceneTarget !== null && !this.framePresented)
                 this.sceneTarget.bind();
@@ -8778,6 +8807,8 @@ export class WebGL2Renderer {
         gl.uniformMatrix4fv(u['uModel'] ?? null, false, model);
         gl.uniform3fv(u['uCameraPos'] ?? null, camera.position);
         gl.uniform1f(u['uStrength'] ?? null, Math.min(shown, 1));
+        gl.uniform1i(u['uOutputTransform'] ?? null, this.passGrade());
+        gl.uniform1f(u['uOutputExposure'] ?? null, this.passGradeExposure());
         gl.uniform1f(u['uLength'] ?? null, length);
         gl.uniform1f(u['uSpread'] ?? null, spread);
         gl.uniform1f(u['uDust'] ?? null, clamp(options.dust ?? 0, 0, 1));
@@ -8910,6 +8941,8 @@ export class WebGL2Renderer {
         gl.uniform3fv(u['uCameraPos'] ?? null, camera.position);
         gl.uniform1f(u['uTime'] ?? null, timeSeconds);
         gl.uniform1f(u['uSheen'] ?? null, sheen);
+        gl.uniform1i(u['uOutputTransform'] ?? null, this.passGrade());
+        gl.uniform1f(u['uOutputExposure'] ?? null, this.passGradeExposure());
         gl.uniform1f(u['uFilmRoughness'] ?? null, Math.min(1, Math.max(0, options.roughness ?? 0)));
         gl.uniform1f(u['uFilmRoughnessCycles'] ?? null, Math.max(0.01, options.roughnessCyclesPerMetre ?? 60));
         gl.uniform1i(u['uClipEnabled'] ?? null, this.reflectionPassActive ? 1 : 0);
@@ -8953,6 +8986,8 @@ export class WebGL2Renderer {
         gl.uniform1f(u['uMoonPhase'] ?? null, sky.moonPhase);
         gl.uniform1f(u['uNightFactor'] ?? null, sky.nightFactor);
         gl.uniform2f(u['uCloudOffset'] ?? null, sky.cloudOffsetX, sky.cloudOffsetZ);
+        gl.uniform1i(u['uOutputTransform'] ?? null, this.passGrade());
+        gl.uniform1f(u['uOutputExposure'] ?? null, this.passGradeExposure());
         bindAtmosphere(gl, u, env, this.reflectionPassActive ? this.reflectionAtmosphereY : (camera.position[1] ?? 0), this.quality.underwaterAtmosphere);
         gl.bindVertexArray(this.skyVao);
         gl.depthMask(false);

package/dist/render/backend/webgl2/skinScatter.d.ts

@@ -46,7 +46,9 @@ export declare class GlSkinScatter {
      * is the frame's depth as a single-sampled texture, or null where none could be had — and then
      * the diffuse goes back unspread rather than not at all, so the skin keeps its light.
      */
-    spread(scene: SceneTarget, depth: WebGLTexture | null, empty: WebGLTexture, projection: ArrayLike<number>, inverse: ArrayLike<number>): void;
+    spread(scene: SceneTarget, depth: WebGLTexture | null, empty: WebGLTexture, projection: ArrayLike<number>, inverse: ArrayLike<number>, 
+    /** The frame's grade, which the second axis applies to the light it adds. */
+    outputTransform?: number, outputExposure?: number): void;
     /** Spent at the frame's start: what was drawn into the target was last frame's. */
     reset(): void;
     /** A multisampled target into its single-sampled texture. */

package/dist/render/backend/webgl2/skinScatter.js

@@ -123,7 +123,9 @@ export class GlSkinScatter {
      * is the frame's depth as a single-sampled texture, or null where none could be had — and then
      * the diffuse goes back unspread rather than not at all, so the skin keeps its light.
      */
-    spread(scene, depth, empty, projection, inverse) {
+    spread(scene, depth, empty, projection, inverse, 
+    /** The frame's grade, which the second axis applies to the light it adds. */
+    outputTransform = 0, outputExposure = 1) {
         const { gl } = this;
         if (this.multisampled !== null) {
             this.resolve(this.drawFramebuffer, this.resolveFramebuffer);
@@ -139,6 +141,8 @@ export class GlSkinScatter {
         gl.uniform1i(u['uSkin'] ?? null, SKIN_BLUR_TEXTURE_UNIT);
         gl.uniform1i(u['uDepth'] ?? null, SKIN_BLUR_DEPTH_UNIT);
         gl.uniform1i(u['uAlbedo'] ?? null, SKIN_BLUR_ALBEDO_UNIT);
+        gl.uniform1i(u['uOutputTransform'] ?? null, outputTransform);
+        gl.uniform1f(u['uOutputExposure'] ?? null, outputExposure);
         gl.activeTexture(gl.TEXTURE0 + SKIN_BLUR_ALBEDO_UNIT);
         gl.bindTexture(gl.TEXTURE_2D, this.albedo ?? empty);
         /* The four terms that carry a depth back to view-space metres: the occlusion blur's own. */

package/dist/render/backend/webgpu/boltPass.d.ts

@@ -11,7 +11,7 @@ import type { PipelineCache } from './pipelineCache.ts';
 export declare const BOLT_VERT_FIELDS: UniformFields;
 export declare const BOLT_VERT_SIZE: 96;
 export declare const BOLT_FRAG_FIELDS: UniformFields;
-export declare const BOLT_FRAG_SIZE: 128;
+export declare const BOLT_FRAG_SIZE: 144;
 /** A batch of arcs on the device, behind the surface's opaque handle. */
 export interface GpuBolts {
     readonly fromBuffer: GPUBuffer;

package/dist/render/backend/webgpu/causticsPass.d.ts

@@ -10,7 +10,7 @@ import type { PipelineCache } from './pipelineCache.ts';
 export declare const CAUSTICS_VERT_FIELDS: UniformFields;
 export declare const CAUSTICS_VERT_SIZE: 64;
 export declare const CAUSTICS_FRAG_FIELDS: UniformFields;
-export declare const CAUSTICS_FRAG_SIZE: 144;
+export declare const CAUSTICS_FRAG_SIZE: 160;
 /** A lit surface on the device, behind the API's opaque handle. */
 export interface GpuCaustics {
     readonly vertexBuffers: readonly GPUBuffer[];

package/dist/render/backend/webgpu/filmPass.d.ts

@@ -14,7 +14,7 @@ import type { PipelineCache } from './pipelineCache.ts';
 export declare const FILM_VERT_FIELDS: UniformFields;
 export declare const FILM_VERT_SIZE: 128;
 export declare const FILM_FRAG_FIELDS: UniformFields;
-export declare const FILM_FRAG_SIZE: 144;
+export declare const FILM_FRAG_SIZE: 160;
 export declare function createFilmBindGroupLayout(device: GPUDevice): GPUBindGroupLayout;
 /** Bound once against both rings; a dynamic offset per film. See `createPanelBindGroup`. */
 export declare function createFilmBindGroup(device: GPUDevice, layout: GPUBindGroupLayout, vertices: GPUBuffer, fragments: GPUBuffer, reflection: GPUTextureView, sampler: GPUSampler): GPUBindGroup;

package/dist/render/backend/webgpu/flockPass.d.ts

@@ -10,7 +10,7 @@ import type { PipelineCache } from './pipelineCache.ts';
 export declare const FLOCK_VERT_FIELDS: UniformFields;
 export declare const FLOCK_VERT_SIZE: 112;
 export declare const FLOCK_FRAG_FIELDS: UniformFields;
-export declare const FLOCK_FRAG_SIZE: 16;
+export declare const FLOCK_FRAG_SIZE: 32;
 /** A flock on the device, behind the surface's opaque handle. */
 export interface GpuFlock {
     readonly corners: GPUBuffer;

package/dist/render/backend/webgpu/giFieldPass.d.ts

@@ -19,7 +19,9 @@ import type { PassContext, PassDefinition, PassDevice, PrepareContext } from '..
  * can look at, and looking is what a number cannot replace: if the geometry is in the right places
  * at the right sizes the composition is right, and if a cascade boundary shows as a seam the fade
  * is wrong. Wave 4A's own recorded failure — a phantom surface that passed 111,907 parity samples
- * and was found by looking at a picture — is why this exists at all.
+ * and was found by looking at a picture — is why this exists at all. **So it is not graded**, alone
+ * of the passes that draw into a frame: what it shows are the field's values, which a curve would
+ * bend into a picture of something else.
  *
  * **The field it marches is one frame old**, because the renderer composes at `endFrame` and
  * `prepare` runs at `beginFrame`. `PrepareContext.distanceField` says why that is right rather

package/dist/render/backend/webgpu/gpuDrivenPass.d.ts

@@ -660,7 +660,16 @@ export declare class GpuDrivenPass implements PassDefinition {
     private readonly scheduled;
     private readonly graphScratch;
     private readonly shape;
-    private gradeWarned;
+    /**
+     * The frame's grade for the blit, `PassContext.outputTransform` and its exposure, and the code it
+     * was last written with, so a frame writes it only when it changes. See `present.wgsl.ts`.
+     */
+    private gradeBuffer;
+    private readonly gradeStaging;
+    private readonly gradeInts;
+    private readonly gradeFloats;
+    private gradeWrittenCode;
+    private gradeWrittenExposure;
     constructor(scene: StreamingScene, materials: readonly GpuDrivenMaterial[], shadow?: GpuDrivenShadowOptions);
     /** How many clusters the scene holds, which every per-cluster dispatch is sized by. */
     get clusterCount(): number;

package/dist/render/backend/webgpu/gpuDrivenPass.js

@@ -646,7 +646,16 @@ export class GpuDrivenPass {
         shadowed: true,
         blended: false,
     };
-    gradeWarned = false;
+    /**
+     * The frame's grade for the blit, `PassContext.outputTransform` and its exposure, and the code it
+     * was last written with, so a frame writes it only when it changes. See `present.wgsl.ts`.
+     */
+    gradeBuffer = null;
+    gradeStaging = new ArrayBuffer(16);
+    gradeInts = new Int32Array(this.gradeStaging);
+    gradeFloats = new Float32Array(this.gradeStaging);
+    gradeWrittenCode = Number.NaN;
+    gradeWrittenExposure = Number.NaN;
     constructor(scene, materials, shadow = {}) {
         if (materials.length > MATERIAL_SLOTS) {
             throw new Error(`[driftengine] the gpu-driven pass holds ${MATERIAL_SLOTS} materials and was given ` +
@@ -1937,10 +1946,17 @@ export class GpuDrivenPass {
                 { binding: 21, resource: this.glassSamplerFor(device) },
             ],
         });
+        this.gradeBuffer ??= device.createBuffer({
+            label: 'gpu-driven blit grade',
+            size: this.gradeStaging.byteLength,
+            usage: UNIFORM | COPY_DST,
+        });
+        this.gradeWrittenCode = Number.NaN;
         this.blitGroup = device.createBindGroup({
             layout: this.blitPipeline.getBindGroupLayout(0),
             entries: [
                 { binding: 0, resource: this.colourView },
+                { binding: 2, resource: { buffer: this.gradeBuffer } },
                 /* The depth the raster wrote, sampled so the blit can hand it to the frame. */
                 ...(this.presentDepth
                     ? [
@@ -2867,16 +2883,15 @@ export class GpuDrivenPass {
             return;
         if (this.blitPipeline === null || this.blitGroup === null)
             return;
-        if (ctx.outputTransform !== 0 && !this.gradeWarned) {
-            this.gradeWarned = true;
-            /*
-             * The pass writes linear light and expects a composite to grade it. A frame with no
-             * composite grades per pass, and applying the curve here would be a second copy of it —
-             * which is the thing `SHADE_MATERIAL_WGSL` is built to avoid. Said once, out loud, because
-             * a silently ungraded frame is a difference somebody would attribute to the pipeline.
-             */
-            console.warn('[driftengine] the gpu-driven pass writes linear light and this frame has no composite ' +
-                'to grade it, so the picture will be flat. Use a quality profile with a scene target.');
+        /* The frame's grade, written when it changes: 0 where the resolve grades. See present.wgsl.ts. */
+        const changed = ctx.outputTransform !== this.gradeWrittenCode ||
+            ctx.outputExposure !== this.gradeWrittenExposure;
+        if (changed && this.device !== null && this.gradeBuffer !== null) {
+            this.gradeWrittenCode = ctx.outputTransform;
+            this.gradeWrittenExposure = ctx.outputExposure;
+            this.gradeInts[0] = ctx.outputTransform;
+            this.gradeFloats[1] = ctx.outputExposure;
+            this.device.queue.writeBuffer(this.gradeBuffer, 0, this.gradeStaging);
         }
         ctx.pass.setPipeline(this.blitPipeline);
         ctx.pass.setBindGroup(0, this.blitGroup);
@@ -2888,6 +2903,8 @@ export class GpuDrivenPass {
         if (device.backend !== 'webgpu')
             return;
         this.disposeTargets();
+        this.gradeBuffer?.destroy();
+        this.gradeBuffer = null;
         this.shadowTexture?.destroy();
         this.glassTintTexture?.destroy();
         this.glassTintNone?.destroy();

package/dist/render/backend/webgpu/panelPass.d.ts

@@ -13,7 +13,7 @@ import type { PipelineCache } from './pipelineCache.ts';
 export declare const PANEL_VERT_FIELDS: UniformFields;
 export declare const PANEL_VERT_SIZE: 96;
 export declare const PANEL_FRAG_FIELDS: UniformFields;
-export declare const PANEL_FRAG_SIZE: 16;
+export declare const PANEL_FRAG_SIZE: 32;
 export declare const PANEL_VERTEX_COUNT: number;
 export declare function createPanelCorners(device: GPUDevice): GPUBuffer;
 export declare function createPanelBindGroupLayout(device: GPUDevice): GPUBindGroupLayout;

package/dist/render/backend/webgpu/postPass.d.ts

@@ -26,7 +26,7 @@ import type { PipelineCache } from './pipelineCache.ts';
  * float target the generated shaders can sample as an ordinary texture.
  */
 export declare const RUSH_FRAG_FIELDS: UniformFields;
-export declare const RUSH_FRAG_SIZE: 272;
+export declare const RUSH_FRAG_SIZE: 288;
 declare const RUSH_UNIFORMS: 1;
 declare const RUSH_TEXTURES: {
     readonly uScene: {
@@ -77,7 +77,7 @@ export declare const AO_BLUR_SIZE: 48;
 export declare const MEDIUM_FRAG_FIELDS: UniformFields;
 export declare const MEDIUM_FRAG_SIZE: 304;
 export declare const MEDIUM_UPSAMPLE_FIELDS: UniformFields;
-export declare const MEDIUM_UPSAMPLE_SIZE: 32;
+export declare const MEDIUM_UPSAMPLE_SIZE: 48;
 export declare const BLOOM_PREFILTER_FIELDS: UniformFields;
 /**
  * The other two stages' blocks, read by name like every other block here.