Update UI components and styles for improved functionality and aesthetics

- Changed accent color variables in index.css for better visual consistency.
- Added a new voicebox logo to the Sidebar component for branding enhancement.
- Refactored AudioPlayer to utilize CSS variables for wave and progress colors, improving theme adaptability.
- Adjusted HistoryTable column widths for better layout and readability.
- Enhanced ProfileCard layout with improved button positioning and styling.
- Updated button styles to use accent colors for better visual coherence.
- Improved CircleButton styling for consistent appearance across the application.

landing/src/components/ui/hero.tsx

@@ -1,8 +1,8 @@
 'use client';
 
-import { ReactNode } from 'react';
-import { cn } from '@/lib/utils';
 import Image from 'next/image';
+import type { ReactNode } from 'react';
+import { cn } from '@/lib/utils';
 
 interface HeroProps {
   title: ReactNode;
@@ -21,7 +21,7 @@ export function Hero({ title, description, actions, className, showLogo = true }
           {showLogo && (
             <div className="flex lg:justify-start justify-center mb-6">
               <Image
-                src="/voicebox-logo.png"
+                src="/voicebox-logo-2.png"
                 alt="Voicebox Logo"
                 width={1024}
                 height={1024}