's'

components/ui/particles.tsx

@@ -0,0 +1,30 @@
+"use client";
+
+const PARTICLES = Array.from({ length: 50 }, (_, i) => ({
+  size: 4 + (i % 6),
+  left: (i * 17.3) % 100,
+  top: (i * 23.7) % 100,
+  duration: 10 + (i % 8),
+  delay: (i * 0.3) % 5,
+}));
+
+export function Particles() {
+  return (
+    <div className="pointer-events-none absolute inset-0 overflow-hidden">
+      {PARTICLES.map((p, i) => (
+        <div
+          key={i}
+          className="absolute rounded-full bg-gradient-to-br from-violet-400/50 via-fuchsia-400/40 to-cyan-400/50 blur-[1px]"
+          style={{
+            width: `${p.size}px`,
+            height: `${p.size}px`,
+            left: `${p.left}%`,
+            top: `${p.top}%`,
+            animation: `float ${p.duration}s ease-in-out infinite`,
+            animationDelay: `${p.delay}s`,
+          }}
+        />
+      ))}
+    </div>
+  );
+}