perf: quantize the opening reading-mask reveal to 24 steps

src/scene/world/sign-stage.ts

@@ -2,6 +2,7 @@ import type { SceneResourceBag } from '@/scene/resources';
 import { usesRoadsideSign } from './sign-layout';
 
 const stageOwners = new WeakMap<HTMLElement, object>();
+const REVEAL_STEPS = 24;
 
 /** Keep the reading-edge mask stationary while native document scrolling
  * moves the content behind it. Changing chapter-sized gradients on every
@@ -50,10 +51,12 @@ export function createSignStage(resources: SceneResourceBag) {
       main.style.transform = `translate3d(0, ${-offset}px, 0)`;
       lastOffset = offset;
     }
-    const reveal = Math.min(
+    // Quantize the opening reveal: the mask image is rebuilt at most
+    // REVEAL_STEPS times on the way in instead of on every scroll event.
+    const reveal = Math.round(Math.min(
       1,
       Math.max(0, window.scrollY / Math.max(240, viewportHeight * 0.58)),
-    );
+    ) * REVEAL_STEPS) / REVEAL_STEPS;
     const top = topEdge * reveal;
     const bottom =
       viewportHeight < 560 && viewportWidth < 768 ? viewportHeight - 164 : null;