Mobile scroll perf: cut paint cost and re-render rate

Mobile scrolling was janky from a stack of expensive paint passes
running every frame. This pass:

- CSS: hide .grain (SVG feTurbulence is the single biggest cost),
  drop mix-blend-mode on .haze/.smoke-puff, drop backdrop-filter on
  .cmd-box, hide the blurred arm-glow, and remove blur filters from
  chip-glow / conveyor-pulse / scan-tear under <=760px.
- JSX: capture an IS_MOBILE flag once at boot. On mobile, halve
  smoke puffs / chimneys / sparks / chip-pulse dots / embers, and
  switch GSAP scrub from 0.6 (rAF interpolation) to true (direct
  scroll-tied) — which is cheaper and more responsive.
- HUD: gate setProgress() on a changed integer depth (0..100) so we
  re-render at most ~100 times per full scroll instead of every frame.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

styles.css

@@ -910,6 +910,21 @@ a { color: inherit; text-decoration: none; }
      still plays out, just over a shorter total scroll distance. */
   .scroll-track { height: 480vh; }
 
+  /* Perf: kill the heaviest paint work on mobile GPUs.
+     - SVG feTurbulence in .grain is the single most expensive thing
+       on the page; dropping it gives the biggest scroll-jank win.
+     - mix-blend-mode and backdrop-filter both force off-screen
+       compositing passes per frame. */
+  .grain { display: none; }
+  .haze, .haze-deep, .smoke-puff { mix-blend-mode: normal; }
+  .cmd-box { backdrop-filter: none; }
+  /* The blurred arm-glow and chip-glow are decorative — drop the
+     blurs that force a re-rasterization on every scrub frame. */
+  .arm-pivot { display: none; }
+  .conveyor-pulse { filter: none; }
+  .chip-glow { filter: none; }
+  .logo-wrap::before { filter: none; }
+
   /* Re-aim the camera so the meaningful part of each landscape image
      stays roughly in frame on a portrait viewport. */
   .bg-wrap { transform-origin: 70% 60% !important; }