// ZION EmberLayer — fixed-position page-level background layer.
// Subtle film grain + slow-rising ember particles for the whole site.
function EmberLayer({ count = 24 }) {
const embers = React.useMemo(() => {
return Array.from({ length: count }).map((_, i) => {
const seed = i * 7919;
const rand = (n) => ((Math.sin(seed + n) + 1) / 2);
const left = rand(1) * 100; // 0–100 %
const size = 2 + rand(2) * 5; // 2–7 px
const dur = 14 + rand(3) * 16; // 14–30 s
const delay = -rand(4) * dur; // pre-shifted so they start mid-flight
const drift = (rand(5) - 0.5) * 80; // -40 to 40 px horizontal sway
const hue = rand(6) > 0.5 ? '#FF6B35' : '#F7591F';
const opacity = 0.35 + rand(7) * 0.45;
return { i, left, size, dur, delay, drift, hue, opacity };
});
}, [count]);
return (
<>
{embers.map(e => (
))}
);
}
window.EmberLayer = EmberLayer;