fix(immersive): increase animation visibility + more blur + debug logs

- Animation params increased: 8% UV drift, 5% zoom, 12% brightness
- Canvas reduced to 8x8 for maximum blur effect
- Added debug logs to verify animation is running

src/lib/immersive/ImmersiveAmbientCanvas.svelte

@@ -253,8 +253,9 @@
     if (isAnimating || !isInitialized) return;
     isAnimating = true;
     lastFrameTime = performance.now();
+    startTime = performance.now(); // Reset time for animation
     animationFrameId = requestAnimationFrame(animationLoop);
-    console.log('[ImmersiveCanvas] Animation started');
+    console.log('[ImmersiveCanvas] Animation started, intensity:', intensity ?? getConfig().ambientIntensity);
   }
 
   /**
@@ -312,6 +313,11 @@
       ? (intensity ?? getConfig().ambientIntensity)
       : 0;
 
+    // Debug: log every 60 frames (~4 sec at 15fps)
+    if (Math.floor(currentTime) % 4 === 0 && Math.floor(currentTime * 15) % 15 === 0) {
+      console.log(`[ImmersiveCanvas] time=${currentTime.toFixed(1)}s, intensity=${motionIntensity}`);
+    }
+
     gl.uniform1f(u_time, currentTime);
     gl.uniform1f(u_intensity, motionIntensity);
 

src/lib/immersive/shaders/ambient.frag

@@ -24,16 +24,16 @@ uniform sampler2D u_texture;
 uniform float u_time;          // Time in seconds
 uniform float u_intensity;     // Motion intensity (0.0 - 1.0)
 
-// Constants for motion parameters
-const float DRIFT_SPEED_X = 0.08;
-const float DRIFT_SPEED_Y = 0.06;
-const float DRIFT_AMOUNT = 0.03;
+// Constants for motion parameters - made MORE visible
+const float DRIFT_SPEED_X = 0.15;
+const float DRIFT_SPEED_Y = 0.12;
+const float DRIFT_AMOUNT = 0.08;  // 8% UV drift
 
-const float ZOOM_SPEED = 0.05;
-const float ZOOM_AMOUNT = 0.02;
+const float ZOOM_SPEED = 0.1;
+const float ZOOM_AMOUNT = 0.05;   // 5% zoom oscillation
 
-const float BREATH_SPEED = 0.12;
-const float BREATH_AMOUNT = 0.06;
+const float BREATH_SPEED = 0.2;
+const float BREATH_AMOUNT = 0.12; // 12% brightness pulse
 
 void main() {
     vec2 uv = v_texCoord;

src/lib/immersive/utils/texture-loader.ts

@@ -203,11 +203,12 @@ export async function loadBlurredTexture(
 
   try {
     // Generate blurred image
-    // Very small canvas (16x16) + heavy blur = smooth gradients when scaled
+    // Extremely small canvas (8x8) = each pixel becomes ~240px when scaled
+    // This creates very smooth color gradients
     const blurredDataUrl = await generateBlurredImage(
       artworkUrl,
-      16,   // Tiny canvas - each pixel becomes ~120px when scaled to 1920
-      8,    // Blur radius (applied twice)
+      8,    // 8x8 canvas - maximum blur through scaling
+      4,    // Small blur radius (image is already tiny)
       controller.signal
     );