@driftengine/core 4.12.0 → 4.13.0

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

@@ -99,7 +99,7 @@ export declare class WebGPURenderer implements RendererApi {
      * **Resolved by the caller and held, rather than defaulted per use.** Every shadow term
      * below reads it, and the constants they replaced were `DEFAULT_RENDER_QUALITY` copies —
      * which measured wrong the moment a scene overrode one. `demo/dayClock` resolves
-     * `directionalShadowMaxSlope` to 9 where the default is 3.
+     * `directionalShadowMaxSlope` to 9 where the default was 3 (60 since 4.13.0).
      */
     readonly quality: Readonly<RenderQuality>;
     /** Whether `endFrame` put an image on the canvas. Read by the recorder and the harness. */
@@ -716,6 +716,7 @@ export declare class WebGPURenderer implements RendererApi {
     private readonly mediumUpsampleUniforms;
     private readonly mediumUpsampleStaging;
     private readonly mediumUpsampleFloats;
+    private readonly mediumUpsampleInts;
     private mediumUpsampleGroup;
     /** The inverse projection the composite linearises a depth with, built once per frame. */
     private readonly mediumInvProjection;
@@ -944,6 +945,12 @@ export declare class WebGPURenderer implements RendererApi {
      */
     private readonly skyUniforms;
     private readonly skyFloats;
+    /** The same block's ints: the grade the sky draws with. */
+    private readonly skyInts;
+    /** `clearOf`'s scratch: a clear colour as the open target takes it. */
+    private readonly gradedClear;
+    /** An inset's clear as its quad's uniform, rewritten in place: the colour and an alpha of 1. */
+    private readonly insetClear;
     private readonly skyBindGroup;
     /** The camera's inverse with the clip correction undone, rebuilt once a frame. */
     private readonly skyInvViewProj;
@@ -1026,6 +1033,8 @@ export declare class WebGPURenderer implements RendererApi {
     private decalUniforms;
     private readonly decalStaging;
     private readonly decalFloats;
+    /** The same slots' ints: the grade the frame under the marks was drawn with. */
+    private readonly decalInts;
     private decalBindGroup;
     /** Said once where a mark cannot be drawn at all, rather than dropped in silence. */
     private decalsRefused;
@@ -1546,14 +1555,16 @@ export declare class WebGPURenderer implements RendererApi {
      * array allocated with the batch, so the frame loop still allocates nothing.
      */
     /**
-     * The output transform a forward pass should apply, and the exposure it should apply it at.
-     *
-     * The WebGPU half of `Renderer.gradeCode`, and it has to agree with it draw for draw: this is
-     * one verb with two implementations, and a frame that grades on one backend and not the other
-     * is the silent kind of disagreement. See that method for what the gate is protecting.
+     * The grade a pass applies to what it draws into the target open now, and the exposure it
+     * applies it at: the WebGPU half of `Renderer.passGrade`, and it has to agree with it draw for
+     * draw. The decision is `passGrade.ts`'s, so both halves only gather the state it is taken from.
      */
-    private gradeCode;
-    private gradeExposure;
+    private passGrade;
+    private passGradeExposure;
+    /** Whether the frame's resolve applies the transform, so the passes before it draw linear. */
+    private resolveGrades;
+    /** A clear colour as the open target takes it, graded as a pass would. See `gradeColor.ts`. */
+    private clearOf;
     drawParticles(batch: GpuParticles, data: ParticleInstances, camera: Camera, env: Environment, timeSeconds: number): void;
     /**
      * Draw particles a caller's own compute wrote, where they lie. See `DeviceParticles`.

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

@@ -75,7 +75,9 @@ import { createSdfTextBindGroup, createSdfTextBindGroupLayout, GpuSdfText, sdfTe
 import { createFilmBindGroup, createFilmBindGroupLayout, filmPipeline, FILM_FRAG_FIELDS, FILM_FRAG_SIZE, FILM_VERT_FIELDS, FILM_VERT_SIZE, } from './filmPass.js';
 import { reflectionTargetSize } from '../../planarReflectionDraw.js';
 import { drawingBufferSize } from '../../drawingBuffer.js';
-import { MOTION_BLUR_MAX_UV, OBJECT_BLUR_UNKEPT, OUTPUT_TRANSFORM_CODE, RUSH_REACH_UV, clampMotionShare, forwardTransformCode, } from '../../vertexDefaults.js';
+import { MOTION_BLUR_MAX_UV, OBJECT_BLUR_UNKEPT, OUTPUT_TRANSFORM_CODE, RUSH_REACH_UV, clampMotionShare, } from '../../vertexDefaults.js';
+import { gradeColorInto } from '../../gradeColor.js';
+import { interfaceGrade, passGradeCode, passGradeExposure } from '../../passGrade.js';
 import { FRINGE_FLOATS, resolveFringe } from '../../shaders/fringe.js';
 import { displayHeadroom } from '../../displayRange.js';
 import { DEFAULT_FILMIC_CURVE, FILMIC_CLAMPED, FILMIC_CONSTANTS, FILMIC_WITHOUT_COMPOSITE, resolveFilmicCurve, } from '../../filmicCurve.js';
@@ -834,7 +836,7 @@ export class WebGPURenderer {
      * **Resolved by the caller and held, rather than defaulted per use.** Every shadow term
      * below reads it, and the constants they replaced were `DEFAULT_RENDER_QUALITY` copies —
      * which measured wrong the moment a scene overrode one. `demo/dayClock` resolves
-     * `directionalShadowMaxSlope` to 9 where the default is 3.
+     * `directionalShadowMaxSlope` to 9 where the default was 3 (60 since 4.13.0).
      */
     quality;
     /** Whether `endFrame` put an image on the canvas. Read by the recorder and the harness. */
@@ -1519,6 +1521,7 @@ export class WebGPURenderer {
     mediumUpsampleUniforms;
     mediumUpsampleStaging = new ArrayBuffer(MEDIUM_UPSAMPLE_SIZE);
     mediumUpsampleFloats = new Float32Array(this.mediumUpsampleStaging);
+    mediumUpsampleInts = new Int32Array(this.mediumUpsampleStaging);
     mediumUpsampleGroup = null;
     /** The inverse projection the composite linearises a depth with, built once per frame. */
     mediumInvProjection = mat4.create();
@@ -1764,6 +1767,12 @@ export class WebGPURenderer {
      */
     skyUniforms;
     skyFloats = new Float32Array(SKY_UNIFORM_SIZE / 4);
+    /** The same block's ints: the grade the sky draws with. */
+    skyInts = new Int32Array(this.skyFloats.buffer);
+    /** `clearOf`'s scratch: a clear colour as the open target takes it. */
+    gradedClear = [0, 0, 0];
+    /** An inset's clear as its quad's uniform, rewritten in place: the colour and an alpha of 1. */
+    insetClear = new Float32Array([0, 0, 0, 1]);
     skyBindGroup;
     /** The camera's inverse with the clip correction undone, rebuilt once a frame. */
     skyInvViewProj = new Float32Array(16);
@@ -1847,6 +1856,8 @@ export class WebGPURenderer {
     decalUniforms;
     decalStaging = new ArrayBuffer(DECAL_SLOT * MAX_DRAWN_DECALS);
     decalFloats = new Float32Array(this.decalStaging);
+    /** The same slots' ints: the grade the frame under the marks was drawn with. */
+    decalInts = new Int32Array(this.decalStaging);
     decalBindGroup = null;
     /** Said once where a mark cannot be drawn at all, rather than dropped in silence. */
     decalsRefused = false;
@@ -2017,9 +2028,10 @@ export class WebGPURenderer {
          * still owed.
          */
         this.pass = null;
-        this.mirrorClearColor[0] = clearColor[0];
-        this.mirrorClearColor[1] = clearColor[1];
-        this.mirrorClearColor[2] = clearColor[2];
+        const mirrorClear = this.clearOf(clearColor);
+        this.mirrorClearColor[0] = mirrorClear[0];
+        this.mirrorClearColor[1] = mirrorClear[1];
+        this.mirrorClearColor[2] = mirrorClear[2];
         this.pendingClearMask |= MIRROR_TARGET;
         this.reflectionPassActive = true;
         /* Closed in `endPlanarReflection`, matching `renderer.ts:2054`. */
@@ -2171,6 +2183,8 @@ export class WebGPURenderer {
         i[atF('uClipEnabled')] = this.reflectionPassActive ? 1 : 0;
         f.set(this.reflection?.clipPlane ?? NO_CLIP_PLANE, atF('uClipPlane'));
         f[atF('uSheen')] = sheen;
+        i[atF('uOutputTransform')] = this.passGrade();
+        f[atF('uOutputExposure')] = this.passGradeExposure();
         f[atF('uFilmRoughness')] = Math.min(1, Math.max(0, options.roughness ?? 0));
         f[atF('uFilmRoughnessCycles')] = Math.max(0.01, options.roughnessCyclesPerMetre ?? 60);
         const medium = resolveAtmosphere(env, this.atmosphereHeight(camera), this.quality.underwaterAtmosphere, this.medium);
@@ -3020,6 +3034,9 @@ export class WebGPURenderer {
         const fragAt = (name) => PANEL_FRAG_FIELDS[name]?.offset ?? 0;
         this.panelFrags.writeFloats(fragmentSlot, fragAt('uColor'), color);
         this.panelFrags.writeFloat(fragmentSlot, fragAt('uAlpha'), alpha);
+        /* An interface: the screen encode, never the curve. See `interfaceGrade`. */
+        this.panelFrags.writeInt(fragmentSlot, fragAt('uOutputTransform'), interfaceGrade(this.passGrade()));
+        this.panelFrags.writeFloat(fragmentSlot, fragAt('uOutputExposure'), 1);
         const panelPipe = panelPipeline(this.targetPipelines(), this.surface.device, this.panelLayout);
         /* `allocate` already returns a byte offset, not an index. Multiplying by the stride
             again put the second panel 64 KB into a 16 KB ring — the device said so, in as many
@@ -3127,8 +3144,8 @@ export class WebGPURenderer {
             font.atlasWidth,
             font.atlasHeight,
         ]);
-        this.sdfTextFrags.writeInt(fragmentSlot, fragAt('uOutputTransform'), this.gradeCode());
-        this.sdfTextFrags.writeFloat(fragmentSlot, fragAt('uOutputExposure'), this.gradeExposure());
+        this.sdfTextFrags.writeInt(fragmentSlot, fragAt('uOutputTransform'), this.passGrade());
+        this.sdfTextFrags.writeFloat(fragmentSlot, fragAt('uOutputExposure'), this.passGradeExposure());
         const sdfPipe = sdfTextPipeline(this.blendedPipelines(), this.surface.device, this.sdfTextLayout);
         const sdfGroup = this.sdfTextBindGroupFor(atlas);
         const sdfCommand = this.recordBlended(0);
@@ -3230,6 +3247,9 @@ export class WebGPURenderer {
         this.textFrags.writeFloats(fragmentSlot, fragAt('uColor'), style.color);
         this.textFrags.writeFloat(fragmentSlot, fragAt('uGlow'), style.glow);
         this.textFrags.writeFloat(fragmentSlot, fragAt('uAlpha'), style.alpha);
+        /* An interface: the screen encode, never the curve. See `interfaceGrade`. */
+        this.textFrags.writeInt(fragmentSlot, fragAt('uOutputTransform'), interfaceGrade(this.passGrade()));
+        this.textFrags.writeFloat(fragmentSlot, fragAt('uOutputExposure'), 1);
         const pass = this.openTextPass();
         if (pass === null)
             return;
@@ -3573,19 +3593,26 @@ export class WebGPURenderer {
      * array allocated with the batch, so the frame loop still allocates nothing.
      */
     /**
-     * The output transform a forward pass should apply, and the exposure it should apply it at.
-     *
-     * The WebGPU half of `Renderer.gradeCode`, and it has to agree with it draw for draw: this is
-     * one verb with two implementations, and a frame that grades on one backend and not the other
-     * is the silent kind of disagreement. See that method for what the gate is protecting.
+     * The grade a pass applies to what it draws into the target open now, and the exposure it
+     * applies it at: the WebGPU half of `Renderer.passGrade`, and it has to agree with it draw for
+     * draw. The decision is `passGrade.ts`'s, so both halves only gather the state it is taken from.
      */
-    gradeCode() {
-        return !this.hasComposite || !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);
+    }
+    /** Whether the frame's resolve applies the transform, so the passes before it draw linear. */
+    resolveGrades() {
+        return this.hasComposite && this.quality.hdrScene;
     }
-    gradeExposure() {
-        return !this.hasComposite || !this.quality.hdrScene ? this.exposure : 1;
+    /** A clear colour as the open target takes it, graded as a pass would. See `gradeColor.ts`. */
+    clearOf(color) {
+        return gradeColorInto(this.passGrade(), this.passGradeExposure(), color, this.gradedClear);
     }
     drawParticles(batch, data, camera, env, timeSeconds) {
         if (!this.canDraw() || data.count === 0)
@@ -3687,8 +3714,8 @@ export class WebGPURenderer {
             i[atF('uFogEnabled')] = batch.fog ? 1 : 0;
         /* Every material's fragment stage declares these, so they are unconditional like
            `uCameraPos` rather than guarded like the material-specific fields above. */
-        i[atF('uOutputTransform')] = this.gradeCode();
-        f[atF('uOutputExposure')] = this.gradeExposure();
+        i[atF('uOutputTransform')] = this.passGrade();
+        f[atF('uOutputExposure')] = this.passGradeExposure();
         const spriteGroup = batch.material === 'sprite' ? this.spriteFades(batch, camera, f) : null;
         device.queue.writeBuffer(batch.vertUniforms, 0, batch.vertStaging);
         device.queue.writeBuffer(batch.fragUniforms, 0, batch.fragStaging);
@@ -3894,6 +3921,8 @@ export class WebGPURenderer {
         frags.writeInt(fragmentSlot, atF('uFogMode'), medium.fogMode);
         frags.writeFloat(fragmentSlot, atF('uFogNear'), medium.fogNear);
         frags.writeFloat(fragmentSlot, atF('uFogFar'), medium.fogFar);
+        frags.writeInt(fragmentSlot, atF('uOutputTransform'), this.passGrade());
+        frags.writeFloat(fragmentSlot, atF('uOutputExposure'), this.passGradeExposure());
         /*
          * **Written for every material, not only the one that reads it.** `arcane` is the only
          * plume whose block declares `uTint`, and the slot it lands in is past the end of fire's
@@ -4045,6 +4074,8 @@ export class WebGPURenderer {
         /* No reflection pass yet: the shader's own "off" path, not an improvised one. */
         i[atF('uReflectionEnabled')] = mirror === null ? 0 : 1;
         i[atF('uReflectionFilterTaps')] = water.reflectionFilterTaps;
+        i[atF('uOutputTransform')] = this.passGrade();
+        f[atF('uOutputExposure')] = this.passGradeExposure();
         f[atF('uReflectionTexelSize')] = mirror === null ? 1 : 1 / mirror.width;
         f[atF('uReflectionTexelSize') + 1] = mirror === null ? 1 : 1 / mirror.height;
         /*
@@ -4174,6 +4205,8 @@ export class WebGPURenderer {
         ring.writeFloats(fragmentSlot, at('uDustOffset'), options.driftM ?? NO_DRIFT);
         ring.writeFloat(fragmentSlot, at('uNear'), options.nearM ?? 0);
         ring.writeInt(fragmentSlot, at('uSamples'), this.quality.lightVolumeSamples);
+        ring.writeInt(fragmentSlot, at('uOutputTransform'), this.passGrade());
+        ring.writeFloat(fragmentSlot, at('uOutputExposure'), this.passGradeExposure());
         /*
          * The clamp that makes a beam end on the floor, and the snapshot it reads.
          *
@@ -4348,6 +4381,10 @@ export class WebGPURenderer {
         v[at('uCellSize')] = streaks.cellSize;
         v[at('uTime')] = timeSeconds;
         this.windStreakFragFloats.set(tint, (WIND_STREAK_FRAG_FIELDS.uTint.offset ?? 0) / 4);
+        this.windStreakFragBlock[WIND_STREAK_FRAG_FIELDS.uOutputTransform.offset / 4] =
+            this.passGrade();
+        this.windStreakFragFloats[WIND_STREAK_FRAG_FIELDS.uOutputExposure.offset / 4] =
+            this.passGradeExposure();
         this.windStreakVerts.writeBlock(vertexSlot, this.windStreakVertBlock);
         this.windStreakFrags.writeBlock(fragmentSlot, this.windStreakFragBlock);
         const windPipe = windStreakPipeline(this.blendedPipelines(), this.surface.device, this.windStreakLayout);
@@ -4433,6 +4470,8 @@ export class WebGPURenderer {
         v[at('uWind')] = windX;
         v[at('uWind') + 1] = windZ;
         this.flockFragFloats.set(tint, (FLOCK_FRAG_FIELDS.uTint.offset ?? 0) / 4);
+        this.flockFragBlock[FLOCK_FRAG_FIELDS.uOutputTransform.offset / 4] = this.passGrade();
+        this.flockFragFloats[FLOCK_FRAG_FIELDS.uOutputExposure.offset / 4] = this.passGradeExposure();
         this.flockVerts.writeBlock(vertexSlot, this.flockVertBlock);
         this.flockFrags.writeBlock(fragmentSlot, this.flockFragBlock);
         const flockPipe = flockPipeline(this.pipelines, this.surface.device, this.flockLayout);
@@ -4525,6 +4564,8 @@ export class WebGPURenderer {
         f.set(core, atF('uCoreColor'));
         f.set(edge, atF('uEdgeColor'));
         f[atF('uCoreGain')] = coreGain;
+        i[atF('uOutputTransform')] = this.passGrade();
+        f[atF('uOutputExposure')] = this.passGradeExposure();
         f.set(camera.position, atF('uCameraPos'));
         /* The medium, through the same resolver every other pass here binds from. */
         const medium = resolveAtmosphere(env, camera.position[1] ?? 0, this.quality.underwaterAtmosphere, this.medium);
@@ -4636,8 +4677,8 @@ export class WebGPURenderer {
         this.lineFrags.writeFloat(fragmentSlot, atF('uOpacity'), opacity);
         this.lineFrags.writeFloats(fragmentSlot, atF('uCameraPos'), camera.position);
         this.lineFrags.writeFloat(fragmentSlot, atF('uSoftness'), softness);
-        this.lineFrags.writeInt(fragmentSlot, atF('uOutputTransform'), this.gradeCode());
-        this.lineFrags.writeFloat(fragmentSlot, atF('uOutputExposure'), this.gradeExposure());
+        this.lineFrags.writeInt(fragmentSlot, atF('uOutputTransform'), this.passGrade());
+        this.lineFrags.writeFloat(fragmentSlot, atF('uOutputExposure'), this.passGradeExposure());
         /* The medium, through the same resolver every other pass here binds from. */
         const medium = resolveAtmosphere(env, camera.position[1] ?? 0, this.quality.underwaterAtmosphere, this.medium);
         this.lineFrags.writeFloats(fragmentSlot, atF('uFogColor'), medium.fogColor);
@@ -6734,9 +6775,10 @@ export class WebGPURenderer {
          * at 92 MB a frame at 824x1830. `ensurePass` opens it on the first draw that wants it, which
          * for such a scene is after the last mirror, so it is opened once and cleared once.
          */
-        this.pendingClearColor[0] = clearColor[0];
-        this.pendingClearColor[1] = clearColor[1];
-        this.pendingClearColor[2] = clearColor[2];
+        const frameClear = this.clearOf(clearColor);
+        this.pendingClearColor[0] = frameClear[0];
+        this.pendingClearColor[1] = frameClear[1];
+        this.pendingClearColor[2] = frameClear[2];
         this.pendingClearMask = SCENE_TARGET;
         if (this.quality.deferFramePass) {
             this.pass = null;
@@ -7438,8 +7480,8 @@ export class WebGPURenderer {
          * `screenEffects` off, or on without `hdrScene`, the mesh pass writes what reaches the
          * canvas and grades as it always did.
          */
-        i[at('uOutputTransform')] = this.gradeCode();
-        f[at('uOutputExposure')] = this.gradeExposure();
+        i[at('uOutputTransform')] = this.passGrade();
+        f[at('uOutputExposure')] = this.passGradeExposure();
         /* The projection occlusion needs, settled by the pass that has a camera. */
         this.frameProjection = camera.projection;
         /*
@@ -8157,7 +8199,7 @@ export class WebGPURenderer {
         /* `1` is sRGB alone: the conversion without the curve. `Math.min` rather than a literal, so
            a renderer asked for `none` stays at none. See `TranslucentMeshOptions.toneMapped`. */
         if (!toneMapped) {
-            this.perFrameInts[this.materialField('uOutputTransform')] = Math.min(this.gradeCode(), 1);
+            this.perFrameInts[this.materialField('uOutputTransform')] = Math.min(this.passGrade(), 1);
         }
         /*
          * **Refraction, and the snapshot it reads is taken here or the draw does not refract.**
@@ -8298,7 +8340,7 @@ export class WebGPURenderer {
         if (refracting)
             this.releaseSeeThrough();
         if (!toneMapped) {
-            this.perFrameInts[this.materialField('uOutputTransform')] = this.gradeCode();
+            this.perFrameInts[this.materialField('uOutputTransform')] = this.passGrade();
         }
         if (ditheredBlend) {
             this.perFrameFloats[this.materialField('uCutout') + 1] =
@@ -8655,7 +8697,7 @@ export class WebGPURenderer {
             this.perFrameInts[this.materialField('uFogEnabled')] = fog;
         }
         if (!toneMapped) {
-            this.perFrameInts[this.materialField('uOutputTransform')] = Math.min(this.gradeCode(), 1);
+            this.perFrameInts[this.materialField('uOutputTransform')] = Math.min(this.passGrade(), 1);
         }
         const depthWrite = options.depthWrite ?? true;
         const layer = Math.min(Math.max(Math.round(options.depthLayer ?? 0), 0), MAX_DEPTH_LAYER);
@@ -8738,7 +8780,7 @@ export class WebGPURenderer {
             this.perFrameInts[this.materialField('uFogEnabled')] = this.surfaceFog;
         }
         if (!toneMapped) {
-            this.perFrameInts[this.materialField('uOutputTransform')] = this.gradeCode();
+            this.perFrameInts[this.materialField('uOutputTransform')] = this.passGrade();
         }
         if (refracting)
             this.releaseSeeThrough();
@@ -8837,6 +8879,8 @@ export class WebGPURenderer {
         i[atF('uFogMode')] = medium.fogMode;
         f[atF('uFogNear')] = medium.fogNear;
         f[atF('uFogFar')] = medium.fogFar;
+        i[atF('uOutputTransform')] = this.passGrade();
+        f[atF('uOutputExposure')] = this.passGradeExposure();
         const fragmentSlot = this.scatterFrags.allocate();
         if (fragmentSlot === null)
             return;
@@ -10228,6 +10272,8 @@ export class WebGPURenderer {
         const medium = resolveAtmosphere(env, this.atmosphereHeight(camera), this.quality.underwaterAtmosphere, this.medium);
         f.set(medium.underwaterColor, at('uUnderwaterColor'));
         f[at('uUnderwaterFactor')] = medium.underwaterFactor;
+        this.skyInts[at('uOutputTransform')] = this.passGrade();
+        f[at('uOutputExposure')] = this.passGradeExposure();
         const slot = this.skyUniforms.allocate();
         if (slot === null) {
             if (!this.warnedSkyFull) {
@@ -10392,6 +10438,8 @@ export class WebGPURenderer {
             ? (OUTPUT_TRANSFORM_CODE[this.quality.outputTransform] ?? 0)
             : 0;
         f[at('uOutputExposure')] = graded ? this.exposure : 1;
+        /* The occlusion multiplied in as an encoded pixel takes it, where the passes graded the scene. */
+        i[at('uSceneGraded')] = this.passGrade() !== 0 ? 1 : 0;
         f.set(this.filmA, at('uFilmA'));
         f.set(this.filmB, at('uFilmB'));
         f[at('uDisplayHeadroom')] = this.headroom;
@@ -10926,8 +10974,8 @@ export class WebGPURenderer {
             });
             const context = this.passContext;
             context.pass = pass;
-            context.outputTransform = this.gradeCode();
-            context.outputExposure = this.gradeExposure();
+            context.outputTransform = this.passGrade();
+            context.outputExposure = this.passGradeExposure();
             context.jitter = this.latePassJitter;
             context.format = RECON_HISTORY_FORMAT;
             context.depthFormat = DEPTH_FORMAT;
@@ -11480,6 +11528,7 @@ export class WebGPURenderer {
             f[base + at('uDecalOpacity')] = decal.opacity;
             f[base + at('uDecalFacingCos')] = decal.facingCos;
             f[base + at('uDecalSoftness')] = decal.softness;
+            this.decalInts[base + at('uOutputTransform')] = this.passGrade();
             slot++;
         });
         device.queue.writeBuffer(this.decalUniforms, 0, this.decalStaging, 0, slot * DECAL_SLOT);
@@ -11689,6 +11738,8 @@ export class WebGPURenderer {
         g[upsampleAt('uDepthToViewZ') + 1] = inv[14] ?? 0;
         g[upsampleAt('uDepthToViewZ') + 2] = inv[11] ?? 0;
         g[upsampleAt('uDepthToViewZ') + 3] = inv[15] ?? 1;
+        this.mediumUpsampleInts[upsampleAt('uOutputTransform')] = this.passGrade();
+        g[upsampleAt('uOutputExposure')] = this.passGradeExposure();
         device.queue.writeBuffer(this.mediumUpsampleUniforms, 0, this.mediumUpsampleStaging);
         const march = encoder.beginRenderPass({
             label: 'post.medium',
@@ -12222,7 +12273,7 @@ export class WebGPURenderer {
         this.resolveDepth(encoder);
         mat4.invert(this.skinInverseProjection, projection);
         const multisampled = this.compositeMsaa();
-        skin.spread(encoder, this.pipelines, resolved, multisampled ?? target, multisampled === null ? null : target, this.samples, projection, this.skinInverseProjection, () => this.gpuTimer.writesFor());
+        skin.spread(encoder, this.pipelines, resolved, multisampled ?? target, multisampled === null ? null : target, this.samples, projection, this.skinInverseProjection, () => this.gpuTimer.writesFor(), this.passGrade(), this.passGradeExposure());
         this.pass = encoder.beginRenderPass({
             label: 'skin.scattered',
             timestampWrites: this.gpuTimer.writesFor(),
@@ -13374,8 +13425,8 @@ export class WebGPURenderer {
         const context = this.passContext;
         context.pass = pass;
         /* The frame's grade, so a contributed pass can obey the 2026-08-17 rule. See `PassContext`. */
-        context.outputTransform = this.gradeCode();
-        context.outputExposure = this.gradeExposure();
+        context.outputTransform = this.passGrade();
+        context.outputExposure = this.passGradeExposure();
         context.format = target.format;
         context.samples = target.sampleCount;
         return context;
@@ -13833,8 +13884,11 @@ export class WebGPURenderer {
         const slot = this.insetUniforms.allocate();
         if (slot !== null) {
             /* Only the colour: the quad covers the viewport set above, so it needs no geometry. */
-            const color = clearColor ?? BLACK_CLEAR;
-            this.insetUniforms.writeFloats(slot, 0, [color[0], color[1], color[2], 1]);
+            const color = this.clearOf(clearColor ?? BLACK_CLEAR);
+            this.insetClear[0] = color[0];
+            this.insetClear[1] = color[1];
+            this.insetClear[2] = color[2];
+            this.insetUniforms.writeFloats(slot, 0, this.insetClear);
             const insetPipe = insetPipeline(this.targetPipelines(), this.surface.device, this.insetLayout, clearColor !== null);
             /*
              * Recorded even though the viewport it fills is state on the pass, because it is set
@@ -14427,6 +14481,8 @@ export class WebGPURenderer {
         f[atF('uTime')] = timeSeconds;
         f[atF('uMaxDrop')] = CAUSTICS_MAX_DROP_M;
         f[atF('uStrength')] = strength;
+        i[atF('uOutputTransform')] = this.passGrade();
+        f[atF('uOutputExposure')] = this.passGradeExposure();
         f.set(env.directionalDir, atF('uLightDir'));
         /*
          * What the water is reflecting: the dominant source plus a share of the ambient standing in

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

@@ -21,7 +21,7 @@ export declare const SCATTER_DEPTH_SIZE: 240;
 export declare const SCATTER_VERT_FIELDS: UniformFields;
 export declare const SCATTER_VERT_SIZE: 240;
 export declare const SCATTER_FRAG_FIELDS: UniformFields;
-export declare const SCATTER_FRAG_SIZE: 128;
+export declare const SCATTER_FRAG_SIZE: 144;
 export declare function scatterVertexLayouts(): GPUVertexBufferLayout[];
 /** Geometry and placement on the device, behind the opaque handle the surface hands out. */
 export interface GpuScatter {

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

@@ -7,6 +7,8 @@ export declare class SkinScatterPass {
     private readonly layout;
     private readonly uniforms;
     private readonly staging;
+    /** The same blocks' ints: the frame's grade, which the second axis applies. */
+    private readonly stagingInts;
     private readonly linear;
     private readonly nearest;
     private readonly commands;
@@ -48,7 +50,9 @@ export declare class SkinScatterPass {
      * attachment its pass draws into, `resolve` where a multisampled one resolves, `samples` its
      * count. `projection` is the frame's, `height` the frame's height in pixels.
      */
-    spread(encoder: GPUCommandEncoder, pipelines: PipelineCache, depth: GPUTextureView, frame: GPUTextureView, resolve: GPUTextureView | null, samples: number, projection: ArrayLike<number>, inverseProjection: ArrayLike<number>, timestampWrites: () => GPURenderPassTimestampWrites | undefined): void;
+    spread(encoder: GPUCommandEncoder, pipelines: PipelineCache, depth: GPUTextureView, frame: GPUTextureView, resolve: GPUTextureView | null, samples: number, projection: ArrayLike<number>, inverseProjection: ArrayLike<number>, timestampWrites: () => GPURenderPassTimestampWrites | undefined, 
+    /** 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: the kept draws were this frame's. */
     reset(): void;
     dispose(): void;

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

@@ -36,6 +36,8 @@ export class SkinScatterPass {
     layout;
     uniforms;
     staging = new Float32Array((SLOT * 2) / 4);
+    /** The same blocks' ints: the frame's grade, which the second axis applies. */
+    stagingInts = new Int32Array(this.staging.buffer);
     linear;
     nearest;
     commands = createCommandPool(16);
@@ -182,7 +184,9 @@ export class SkinScatterPass {
      * attachment its pass draws into, `resolve` where a multisampled one resolves, `samples` its
      * count. `projection` is the frame's, `height` the frame's height in pixels.
      */
-    spread(encoder, pipelines, depth, frame, resolve, samples, projection, inverseProjection, timestampWrites) {
+    spread(encoder, pipelines, depth, frame, resolve, samples, projection, inverseProjection, timestampWrites, 
+    /** The frame's grade, which the second axis applies to the light it adds. */
+    outputTransform = 0, outputExposure = 1) {
         const diffuse = this.diffuse;
         if (diffuse === null || this.diffuseView === null || this.acrossView === null)
             return;
@@ -193,7 +197,7 @@ export class SkinScatterPass {
             this.groupDown = this.group('skin.blurDown', this.acrossView, depth);
             this.groupsDepth = depth;
         }
-        this.writeUniforms(diffuse.width, diffuse.height, projection, inverseProjection);
+        this.writeUniforms(diffuse.width, diffuse.height, projection, inverseProjection, outputTransform, outputExposure);
         const across = postPipeline(pipelines, this.device, this.layout, 'skin.blurAcross', SKIN_BLUR_FRAG_WGSL, SKIN_TARGET_FORMAT);
         const down = postPipelineTargets(pipelines, this.device, this.layout, `skin.blurDown:${pipelines.format}:${samples}`, SKIN_BLUR_FRAG_WGSL, [
             {
@@ -261,7 +265,7 @@ export class SkinScatterPass {
         });
     }
     /** Both axes' blocks: the step along each, and what they share. Column-major matrices. */
-    writeUniforms(width, height, projection, inverse) {
+    writeUniforms(width, height, projection, inverse, outputTransform, outputExposure) {
         const f = this.staging;
         const fields = BINDINGS.fields;
         for (let axis = 0; axis < 2; axis += 1) {
@@ -280,6 +284,8 @@ export class SkinScatterPass {
             f.set(this.profiles, base + fields.uProfiles.offset / 4);
             /* The colour is applied once, on the axis that adds into the frame. */
             f[base + fields.uApplyAlbedo.offset / 4] = axis;
+            this.stagingInts[base + fields.uOutputTransform.offset / 4] = outputTransform;
+            f[base + fields.uOutputExposure.offset / 4] = outputExposure;
         }
         this.device.queue.writeBuffer(this.uniforms, 0, f);
     }

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

@@ -88,8 +88,18 @@ export declare const SKY_FIELDS: {
         readonly size: 4;
         readonly type: "float";
     };
+    readonly uOutputTransform: {
+        readonly offset: 224;
+        readonly size: 4;
+        readonly type: "int";
+    };
+    readonly uOutputExposure: {
+        readonly offset: 228;
+        readonly size: 4;
+        readonly type: "float";
+    };
 };
-export declare const SKY_UNIFORM_SIZE: 224;
+export declare const SKY_UNIFORM_SIZE: 240;
 export declare function createSkyBindGroupLayout(device: GPUDevice): GPUBindGroupLayout;
 export declare function createSkyBindGroup(device: GPUDevice, layout: GPUBindGroupLayout, uniforms: GPUBuffer): GPUBindGroup;
 /**

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

@@ -11,7 +11,7 @@ import type { UniformFields } from './scatterPass.ts';
 export declare const WATER_VERT_FIELDS: UniformFields;
 export declare const WATER_VERT_SIZE: 208;
 export declare const WATER_FRAG_FIELDS: UniformFields;
-export declare const WATER_FRAG_SIZE: 1504;
+export declare const WATER_FRAG_SIZE: 1520;
 /** The two meshes and the numbers the grid decided, behind the surface's opaque handle. */
 export interface GpuWater {
     /** The ocean: near sheet and far skirt in one buffer. */

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

@@ -14,7 +14,7 @@ import type { PipelineCache } from './pipelineCache.ts';
 export declare const WIND_STREAK_VERT_FIELDS: UniformFields;
 export declare const WIND_STREAK_VERT_SIZE: 128;
 export declare const WIND_STREAK_FRAG_FIELDS: UniformFields;
-export declare const WIND_STREAK_FRAG_SIZE: 16;
+export declare const WIND_STREAK_FRAG_SIZE: 32;
 /** A lattice on the device, behind the surface's opaque handle. */
 export interface GpuWindStreaks {
     readonly corners: GPUBuffer;

package/dist/render/causticsRenderer.d.ts

@@ -60,6 +60,8 @@ export declare class CausticsRenderer {
      *
      * Answers whether it drew, which the renderer counts on its frame budget.
      */
-    draw(gl: WebGL2RenderingContext, camera: FrameView, timeSeconds: number, directionalDir: Vec3, directionalColor: Vec3, ambient: Vec3, atmosphere: Atmosphere, underwaterEnabled: boolean, windX?: number, windZ?: number, strength?: number): boolean;
+    draw(gl: WebGL2RenderingContext, camera: FrameView, timeSeconds: number, directionalDir: Vec3, directionalColor: Vec3, ambient: Vec3, atmosphere: Atmosphere, underwaterEnabled: boolean, windX?: number, windZ?: number, strength?: number, 
+    /** The renderer's `passGrade`: the frame's, but none in a probe's face or a capture. */
+    outputTransform?: number, outputExposure?: number): boolean;
     dispose(gl: WebGL2RenderingContext): void;
 }

package/dist/render/causticsRenderer.js

@@ -66,11 +66,15 @@ export class CausticsRenderer {
      *
      * Answers whether it drew, which the renderer counts on its frame budget.
      */
-    draw(gl, camera, timeSeconds, directionalDir, directionalColor, ambient, atmosphere, underwaterEnabled, windX = 0, windZ = 0, strength = 1) {
+    draw(gl, camera, timeSeconds, directionalDir, directionalColor, ambient, atmosphere, underwaterEnabled, windX = 0, windZ = 0, strength = 1, 
+    /** The renderer's `passGrade`: the frame's, but none in a probe's face or a capture. */
+    outputTransform = 0, outputExposure = 1) {
         if (this.vertexCount === 0)
             return false;
         const u = this.uniforms;
         gl.useProgram(this.program);
+        gl.uniform1i(u['uOutputTransform'] ?? null, outputTransform);
+        gl.uniform1f(u['uOutputExposure'] ?? null, outputExposure);
         gl.uniformMatrix4fv(u['uViewProj'] ?? null, false, camera.viewProjection);
         gl.uniform3fv(u['uCameraPos'] ?? null, camera.position);
         gl.uniform1f(u['uTime'] ?? null, timeSeconds);

package/dist/render/decalPass.d.ts

@@ -29,6 +29,8 @@ export declare class DecalPass {
      * turns a stored depth back into the clip space that matrix was built in, and pairing it with
      * the corrected one applies the remap twice. `lightVolumeDraw.ts` carries that derivation.
      */
-    drawDecals(queue: DecalQueue, depth: WebGLTexture, viewProjection: ReadonlyMat4, eye: ArrayLike<number>, width: number, height: number): void;
+    drawDecals(queue: DecalQueue, depth: WebGLTexture, viewProjection: ReadonlyMat4, eye: ArrayLike<number>, width: number, height: number, 
+    /** The renderer's `passGrade`: how the frame under the marks was graded, 0 for not yet. */
+    outputTransform?: number): void;
     dispose(): void;
 }

package/dist/render/decalPass.js

@@ -42,7 +42,9 @@ export class DecalPass {
      * turns a stored depth back into the clip space that matrix was built in, and pairing it with
      * the corrected one applies the remap twice. `lightVolumeDraw.ts` carries that derivation.
      */
-    drawDecals(queue, depth, viewProjection, eye, width, height) {
+    drawDecals(queue, depth, viewProjection, eye, width, height, 
+    /** The renderer's `passGrade`: how the frame under the marks was graded, 0 for not yet. */
+    outputTransform = 0) {
         if (queue.length === 0)
             return;
         const { gl } = this;
@@ -50,6 +52,7 @@ export class DecalPass {
         mat4.invert(this.depthToWorld, viewProjection);
         mat4.multiply(this.depthToWorld, this.depthToWorld, DEPTH_01_TO_CLIP);
         gl.useProgram(this.program);
+        gl.uniform1i(u['uOutputTransform'] ?? null, outputTransform);
         gl.bindVertexArray(this.vao);
         gl.disable(gl.DEPTH_TEST);
         gl.depthMask(false);

package/dist/render/flockRenderer.d.ts

@@ -32,6 +32,6 @@ export declare class FlockRenderer {
     private readonly buffers;
     private readonly vertexCount;
     constructor(gl: WebGL2RenderingContext, count: number);
-    draw(gl: WebGL2RenderingContext, camera: FrameView, timeSeconds: number, params: FlockParams, tint: Vec3, windX?: number, windZ?: number): void;
+    draw(gl: WebGL2RenderingContext, camera: FrameView, timeSeconds: number, params: FlockParams, tint: Vec3, windX?: number, windZ?: number, outputTransform?: number, outputExposure?: number): void;
     dispose(gl: WebGL2RenderingContext): void;
 }

package/dist/render/flockRenderer.js

@@ -34,9 +34,12 @@ export class FlockRenderer {
         attach(indices, 2, 1);
         gl.bindVertexArray(null);
     }
-    draw(gl, camera, timeSeconds, params, tint, windX = 0, windZ = 0) {
+    draw(gl, camera, timeSeconds, params, tint, windX = 0, windZ = 0, outputTransform = 0, outputExposure = 1) {
         const u = this.uniforms;
         gl.useProgram(this.program);
+        /* The renderer's `passGrade`: the frame's, but none in a probe's face or a capture. */
+        gl.uniform1i(u['uOutputTransform'] ?? null, outputTransform);
+        gl.uniform1f(u['uOutputExposure'] ?? null, outputExposure);
         gl.uniformMatrix4fv(u['uViewProj'] ?? null, false, camera.viewProjection);
         /*
          * No `uCameraPos` here, and the shader no longer declares one. It fed the banking that