diff --git a/app/globals.css b/app/globals.css index 0c36598..28d95a8 100644 --- a/app/globals.css +++ b/app/globals.css @@ -215,6 +215,37 @@ body { } } +/* 9. Particle Constellation A: Continuous smooth orbital drift around orb */ +@keyframes particlesMotionA { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } +} + +/* 10. Particle Constellation B: Continuous counter-orbital drift with gentle shimmer */ +@keyframes particlesMotionB { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(-360deg); + } +} + +/* 11. Particle Constellation C: Continuous floating wave */ +@keyframes particlesMotionC { + 0%, 100% { + transform: translate(0px, 0px); + opacity: 0.7; + } + 50% { + transform: translate(-8px, 10px); + opacity: 1; + } +} /* Animation Utility Classes - Constant velocity & uninterrupted flow */ .animate-orbit-ring { @@ -259,3 +290,24 @@ body { transform-origin: 637.492px 421.5px; will-change: transform, opacity; } + +.animate-particles-a { + animation: particlesMotionA 24s linear infinite; + transform-origin: 637.492px 421.5px; + will-change: transform; +} + +.animate-particles-b { + animation: particlesMotionB 30s linear infinite; + transform-origin: 637.492px 421.5px; + will-change: transform; +} + +.animate-particles-c { + animation: particlesMotionC 6s ease-in-out infinite; + will-change: transform, opacity; +} + + + + diff --git a/components/copilot/AnimatedCopilotOrb.tsx b/components/copilot/AnimatedCopilotOrb.tsx index 07f1981..a4510f8 100644 --- a/components/copilot/AnimatedCopilotOrb.tsx +++ b/components/copilot/AnimatedCopilotOrb.tsx @@ -109,6 +109,115 @@ export function AnimatedCopilotOrb() { + + {/* Constellation of 98 Dynamic Particles */} + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + {/* SVG Filters & Linear Gradients */}