style: update button variants and layout for consistency across components

app/browse/page.tsx

@@ -91,7 +91,7 @@ export default function BrowsePage() {
   }
 
   return (
-    <div className="container mx-auto p-6 pb-24 max-w-none">
+    <div className="p-6 pb-24 w-full">
       <div className="space-y-2">
         <div className="h-full flex flex-col space-y-6">
           <div className="border-none p-0 outline-hidden flex flex-col grow">

app/components/WhatsNewPopup.tsx

@@ -170,14 +170,14 @@ export function WhatsNewPopup() {
         <>
         <div className="flex gap-2 mb-4">
           <Button
-            variant={tab === 'latest' ? 'default' : 'outline-solid'}
+            variant={tab === 'latest' ? 'default' : 'outline'}
             size="sm"
             onClick={() => setTab('latest')}
           >
             Latest
           </Button>
           <Button
-            variant={tab === 'archive' ? 'default' : 'outline-solid'}
+            variant={tab === 'archive' ? 'default' : 'outline'}
             size="sm"
             onClick={() => setTab('archive')}
             disabled={archiveChangelogs.length === 0}

app/favorites/page.tsx

@@ -118,7 +118,7 @@ const FavoritesPage = () => {
 
   if (!isConnected) {
     return (
-      <div className="container mx-auto p-6 pb-24 max-w-none">
+      <div className="p-6 pb-24 w-full">
         <div className="space-y-6">
           <div className="text-left">
             <h1 className="text-3xl font-semibold tracking-tight">Favorites</h1>
@@ -130,7 +130,7 @@ const FavoritesPage = () => {
   }
 
   return (
-    <div className="container mx-auto p-6 pb-24 max-w-none">
+    <div className="p-6 pb-24 w-full">
       <div className="space-y-6">
         <div className="text-left">
           <h1 className="text-3xl font-semibold tracking-tight">Favorites</h1>

app/library/playlists/page.tsx

@@ -31,7 +31,7 @@ const PlaylistsPage: React.FC = () => {
   }
 
   return (
-    <div className="container mx-auto p-6 pb-24 max-w-none">
+    <div className="p-6 pb-24 w-full">
       <Tabs defaultValue="music" className="h-full space-y-6">
         <TabsContent value="music" className="border-none p-0 outline-hidden">
           <div className="flex items-center justify-between">

app/page.tsx

@@ -181,7 +181,7 @@ export default function MusicPage() {
 
 
   return (
-    <div className="container mx-auto p-6 pb-24 max-w-none">
+    <div className="p-6 pb-24 w-full">
       <div className="relative rounded-lg p-8">
           <div className="relative rounded-sm p-10">
             <div

app/queue/page.tsx

@@ -19,7 +19,7 @@ const QueuePage: React.FC = () => {
   };
 
   return (
-    <div className="container mx-auto p-6 pb-24 max-w-none">
+    <div className="p-6 pb-24 w-full">
       <div className="space-y-6">
         {/* Header */}
         <div className="flex items-center justify-between">

app/radio/page.tsx

@@ -128,14 +128,14 @@ const RadioStationsPage = () => {
 
   if (isLoading) {
     return (
-      <div className="container mx-auto p-6 max-w-4xl">
+      <div className="p-6 w-full max-w-4xl">
         <div className="text-center">Loading radio stations...</div>
       </div>
     );
   }
 
   return (
-    <div className="container mx-auto p-6 pb-24 max-w-none">
+    <div className="p-6 pb-24 w-full">
       <div className="space-y-2">
         <div className="flex items-center justify-between border-b pb-4 mb-4">
           <div>

app/search/page.tsx

@@ -101,7 +101,7 @@ export default function SearchPage() {
   };
 
   return (
-    <div className="container mx-auto p-6 pb-32 max-w-none">
+    <div className="p-6 pb-32 w-full">
       <div className="space-y-6">
         {/* Header */}
         <div className="space-y-1">