updated readme + just

frontend/src/components/CyberFx.astro

@@ -78,18 +78,21 @@
 			}
 		}
 
-		/* ─── Ambient: entrance fade-in (opacity:0 → target via the CSS
-		 * transition on first apply) + scroll-depth recede. Parallax is
-		 * disabled for now — the --cs-px/py/cx/cy vars default to 0px so the
-		 * wire/corner transforms stay put; re-enable by driving those vars
-		 * from scroll/pointer here again. ─── */
+		/* ─── Ambient: entrance fade-in + scroll recede + parallax ─── */
 		if (teardown) teardown();
 		const off: Array<() => void> = [];
 		let depth = 0, raf = 0;
+		let mx = 0, my = 0; // mouse relative (-1..1)
 
 		const apply = () => {
 			raf = 0;
 			fx.style.opacity = String(1 - 0.5 * depth);
+			
+			// subtle parallax drift
+			root.style.setProperty('--cs-px', `${(mx * 15).toFixed(1)}px`);
+			root.style.setProperty('--cs-py', `${(my * 15).toFixed(1)}px`);
+			root.style.setProperty('--cs-cx', `${(mx * -8).toFixed(1)}px`);
+			root.style.setProperty('--cs-cy', `${(my * -8).toFixed(1)}px`);
 		};
 		const schedule = () => { if (!raf) raf = requestAnimationFrame(apply); };
 
@@ -98,10 +101,18 @@
 			depth = Math.max(0, Math.min(1, window.scrollY / vh));
 			schedule();
 		};
+		const onMouseMove = (e: MouseEvent) => {
+			mx = (e.clientX / window.innerWidth) * 2 - 1;
+			my = (e.clientY / window.innerHeight) * 2 - 1;
+			schedule();
+		};
+
 		window.addEventListener('scroll', onScroll, { passive: true });
 		window.addEventListener('resize', onScroll);
+		window.addEventListener('mousemove', onMouseMove, { passive: true });
 		off.push(() => window.removeEventListener('scroll', onScroll));
 		off.push(() => window.removeEventListener('resize', onScroll));
+		off.push(() => window.removeEventListener('mousemove', onMouseMove));
 		onScroll();
 
 		/* Freeze every loop while the tab is hidden — idle-battery win. */