Reduce animation intensity and remove distracting scale effects

assets/css/animations.css

@@ -15,7 +15,7 @@
 /* Enhanced glassmorphism hover effects */
 .glass:hover,
 .glass-strong:hover {
-  transform: translateY(-2px) scale(1.01);
+  transform: translateY(-2px);
   box-shadow: 
     var(--shadow-glass),
     0 0 30px rgba(59, 130, 246, 0.15);
@@ -306,6 +306,7 @@
 }
 
 .hover-lift:hover {
+  /* Lift effect kept for subtle movement */
   transform: translateY(-4px);
 }
 
@@ -314,7 +315,7 @@
 }
 
 .hover-scale:hover {
-  transform: scale(1.05);
+  /* Scale effect removed to avoid distracting growth */
 }
 
 .hover-glow {

assets/css/main.css

@@ -196,7 +196,7 @@ body {
 
 .btn-icon:hover {
   background: var(--accent-primary);
-  transform: scale(1.1) translateY(-2px);
+  transform: translateY(-2px);
   box-shadow: 
     0 8px 20px rgba(59, 130, 246, 0.4),
     0 4px 8px rgba(0, 0, 0, 0.2),

components/MusicControls.client.vue

@@ -260,7 +260,7 @@ onMounted(() => {
   max-width: 450px;
   padding: 12px 16px;
   border-radius: 16px;
-  bottom: 5px;
+  bottom: -10px;
 }
 
 /* Collapsed State Styles */

components/TrackListItem.client.vue

@@ -3,7 +3,6 @@
     :class="[
       'track-item',
       'ripple',
-      'hover-lift',
       {
         'active': isActive,
         'loading': isLoading,
@@ -107,7 +106,7 @@ const formatTime = (seconds) => {
 
 .track-item:hover {
   background: var(--bg-glass);
-  transform: translateX(5px) translateY(-2px);
+  transform: translateX(5px);
   box-shadow: 
     0 6px 20px rgba(59, 130, 246, 0.2),
     0 3px 8px rgba(0, 0, 0, 0.1),
@@ -126,7 +125,7 @@ const formatTime = (seconds) => {
 }
 
 .track-item.active:hover {
-  transform: translateX(5px) translateY(-3px) scale(1.02);
+  transform: translateX(5px);
   box-shadow: 
     0 10px 30px rgba(59, 130, 246, 0.5),
     0 5px 12px rgba(0, 0, 0, 0.2),