feat: polish motion with stronger easing, press feedback and reduced motion (#73)

- Override Tailwind ease-out/ease-in-out with stronger curves, add ease-drawer
- hoverOnlyWhenSupported so hover styles never stick on touch devices
- Replace transition-all with explicit properties across the public UI
- Press feedback via active:scale-[0.97] instead of hover:scale-105
- Global prefers-reduced-motion handling (CSS + MotionConfig reducedMotion="user")
- Mobile menu is a real drawer: stays mounted, inert when closed, Escape closes
- Progress and music bars animate scaleX/scaleY instead of width/height
- Fix undefined animate-spin-slow, contain hero CTA shine with overflow-hidden

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

app/components/ActivityFeed.tsx

@@ -130,8 +130,8 @@ export default function ActivityFeed({
               key={quoteIndex}
               initial={{ opacity: 0, y: 10 }}
               animate={{ opacity: 1, y: 0 }}
-              exit={{ opacity: 0, y: -10 }}
-              transition={{ duration: 0.5 }}
+              exit={{ opacity: 0, y: -6, filter: "blur(2px)", transition: { duration: 0.2, ease: [0.23, 1, 0.32, 1] } }}
+              transition={{ duration: 0.4, ease: [0.23, 1, 0.32, 1] }}
               className="space-y-4"
             >
               <p className="text-base sm:text-lg md:text-xl lg:text-2xl font-light leading-tight text-stone-400 dark:text-stone-400 italic">
@@ -207,14 +207,14 @@ export default function ActivityFeed({
               {[0, 1, 2].map((i) => (
                 <motion.div
                   key={i}
-                  animate={{ height: ["20%", "100%", "20%"] }}
+                  animate={{ scaleY: [0.2, 1, 0.2] }}
                   transition={{ 
                     duration: 0.8, 
                     repeat: Infinity, 
                     delay: i * 0.2,
                     ease: "easeInOut" 
                   }}
-                  className="w-[2px] bg-[#1DB954] rounded-full"
+                  className="w-[2px] h-full origin-bottom bg-[#1DB954] rounded-full"
                 />
               ))}
             </div>
@@ -225,12 +225,12 @@ export default function ActivityFeed({
             rel="noopener noreferrer"
             className="flex gap-4 relative z-10"
           >
-            <div className="w-16 h-16 rounded-lg overflow-hidden shrink-0 shadow-md relative group-hover:shadow-xl transition-shadow duration-500">
+            <div className="w-16 h-16 rounded-lg overflow-hidden shrink-0 shadow-md relative group-hover:shadow-xl transition-shadow duration-300">
               <Image
                 src={data.music.albumArt}
                 alt="Album Art"
                 fill
-                className="object-cover transition-transform duration-700 group-hover:scale-110"
+                className="object-cover transition-transform duration-500 ease-out group-hover:scale-105"
                 sizes="64px"
               />
             </div>