Better make that aura better much better shouldn’t be a border daring you know

index.html

@@ -65,13 +65,13 @@
                     </div>
 <!-- New Chat Button -->
         <div class="mx-4 mb-6 mt-[70px]">
-            <button class="flex items-center gap-2">
-                <div class="w-[30px] h-[30px] rounded-full bg-[#FF6B3A] flex items-center justify-center">
+            <button class="flex items-center gap-2 group">
+                <div class="w-[30px] h-[30px] rounded-full bg-gradient-to-br from-[#FF6B3A] to-[#FF8D5C] flex items-center justify-center shadow-[0_0_15px_-3px_rgba(255,107,58,0.4)] group-hover:shadow-[0_0_20px_-2px_rgba(255,107,58,0.6)] transition-all duration-300">
                     <i data-feather="plus" class="w-3.5 h-3.5 stroke-white stroke-[2.5px]"></i>
                 </div>
-                <span class="text-[13px] font-medium text-[#F5F5F5]">New chat</span>
+                <span class="text-[13px] font-medium text-[#F5F5F5] group-hover:text-white transition-colors">New chat</span>
 </button>
-        </div>
+</div>
         <!-- Enhanced Navigation -->
         <nav class="px-4 space-y-3">
             <div class="border-t border-dark-700 my-2"></div>
@@ -138,7 +138,7 @@
         
         <!-- Input Box -->
         <div class="w-full max-w-2xl">
-            <div class="bg-dark-700 rounded-xl p-1.5 shadow-lg ring-2 ring-accent-500/20 hover:ring-accent-500/40 transition-all duration-200">
+            <div class="bg-dark-700 rounded-xl p-1.5 shadow-lg shadow-accent-500/10 hover:shadow-accent-500/20 transition-all duration-300 backdrop-blur-sm">
 <div class="relative">
                     <p class="text-sm text-gray-400 px-4 pt-3 pb-1">How can I help you today?</p>
                     <div class="absolute left-4 bottom-3 flex items-center space-x-3">
@@ -162,10 +162,10 @@
                             <span class="text-sm text-gray-400">Sonnet 4.5</span>
                             <i data-feather="chevron-down" class="w-4 h-4 stroke-gray-400 ml-1"></i>
                         </div>
-                        <button class="w-8 h-8 rounded-lg bg-accent-500 flex items-center justify-center hover:bg-accent-600">
-                            <i data-feather="arrow-up" class="w-4 h-4 stroke-white"></i>
+                        <button class="w-8 h-8 rounded-lg bg-gradient-to-br from-accent-500 to-accent-600 flex items-center justify-center hover:from-accent-600 hover:to-accent-500 transform hover:scale-105 transition-all duration-200 group">
+                            <i data-feather="arrow-up" class="w-4 h-4 stroke-white group-hover:rotate-45 transition-transform"></i>
                         </button>
-                    </div>
+</div>
 </div>
             </div>
             <p class="text-xs text-gray-500 mt-2 text-center">Upgrade to connect your tools to Claude</p>
@@ -199,21 +199,34 @@ document.addEventListener('DOMContentLoaded', function() {
             anime({
                 targets: star,
                 rotate: [0, 360],
-                duration: 8000,
+                scale: [1, 1.2, 1],
+                duration: 6000,
                 loop: true,
-                easing: 'linear'
+                easing: 'easeInOutSine'
             });
-            
-            // Subtle pulse for the input box
+// Subtle pulse for the input box
             anime({
                 targets: 'input',
-                boxShadow: ['0 0 0 0 rgba(255,87,34,0)', '0 0 0 6px rgba(255,87,34,0.1)'],
-                duration: 3000,
+                boxShadow: [
+                    '0 0 0 0 rgba(255,87,34,0)',
+                    '0 0 10px 2px rgba(255,107,58,0.15)',
+                    '0 0 0 0 rgba(255,87,34,0)'
+                ],
+                duration: 4000,
+                loop: true,
+                easing: 'easeInOutSine'
+            });
+
+            // Add subtle glow to sidebar
+            anime({
+                targets: '#sidebar',
+                boxShadow: ['0 0 0 0 rgba(255,107,58,0)', '-5px 0 15px -5px rgba(255,107,58,0.08)'],
+                duration: 2000,
                 loop: true,
                 direction: 'alternate',
                 easing: 'easeInOutSine'
             });
-        });
+});
     </script>
 </body>
 </html>