diff --git a/lib/components/artist/artist_card.dart b/lib/components/artist/artist_card.dart
index 57971ada..9c1ee14a 100644
--- a/lib/components/artist/artist_card.dart
+++ b/lib/components/artist/artist_card.dart
@@ -35,6 +35,10 @@ class ArtistCard extends HookConsumerWidget {
 
     final radius = BorderRadius.circular(15);
 
+    final bgColor = useBrightnessValue(
+      theme.colorScheme.surface,
+      theme.colorScheme.surfaceContainerHigh,
+    );
     final double size = useBreakpointValue<double>(
       xs: 130,
       sm: 130,
@@ -46,12 +50,8 @@ class ArtistCard extends HookConsumerWidget {
       width: size,
       margin: const EdgeInsets.symmetric(vertical: 5),
       child: Material(
-        shadowColor: theme.colorScheme.background,
-        color: Color.lerp(
-          theme.colorScheme.surfaceVariant,
-          theme.colorScheme.surface,
-          useBrightnessValue(.9, .7),
-        ),
+        shadowColor: theme.colorScheme.surface,
+        color: bgColor,
         elevation: 3,
         shape: RoundedRectangleBorder(
           borderRadius: radius,
diff --git a/lib/components/home/sections/friends/friend_item.dart b/lib/components/home/sections/friends/friend_item.dart
index 2b575756..096964a6 100644
--- a/lib/components/home/sections/friends/friend_item.dart
+++ b/lib/components/home/sections/friends/friend_item.dart
@@ -30,7 +30,7 @@ class FriendItem extends HookConsumerWidget {
     return Container(
       padding: const EdgeInsets.all(8),
       decoration: BoxDecoration(
-        color: colorScheme.surfaceVariant.withOpacity(0.3),
+        color: colorScheme.surfaceContainer,
         borderRadius: BorderRadius.circular(15),
       ),
       constraints: const BoxConstraints(
diff --git a/lib/components/home/sections/genres.dart b/lib/components/home/sections/genres.dart
index 7dfafd5a..62f462e2 100644
--- a/lib/components/home/sections/genres.dart
+++ b/lib/components/home/sections/genres.dart
@@ -134,7 +134,7 @@ class HomeGenresSection extends HookConsumerWidget {
                       child: Ink(
                         decoration: BoxDecoration(
                           borderRadius: BorderRadius.circular(5),
-                          color: colorScheme.surfaceVariant,
+                          color: colorScheme.surfaceContainerHighest,
                           gradient: categoriesQuery.isLoading ? null : gradient,
                         ),
                         padding: const EdgeInsets.symmetric(horizontal: 16),
diff --git a/lib/components/library/local_folder/local_folder_item.dart b/lib/components/library/local_folder/local_folder_item.dart
index 72032198..6220a967 100644
--- a/lib/components/library/local_folder/local_folder_item.dart
+++ b/lib/components/library/local_folder/local_folder_item.dart
@@ -71,7 +71,7 @@ class LocalFolderItem extends HookConsumerWidget {
         decoration: BoxDecoration(
           borderRadius: BorderRadius.circular(8),
           color: Color.lerp(
-            colorScheme.surfaceVariant,
+            colorScheme.surfaceContainerHighest,
             colorScheme.surface,
             lerpValue,
           ),
diff --git a/lib/components/library/playlist_generate/multi_select_field.dart b/lib/components/library/playlist_generate/multi_select_field.dart
index e54fc2ba..d8e0506d 100644
--- a/lib/components/library/playlist_generate/multi_select_field.dart
+++ b/lib/components/library/playlist_generate/multi_select_field.dart
@@ -71,7 +71,7 @@ class MultiSelectField<T> extends HookWidget {
                   : theme.colorScheme.onSurface.withOpacity(0.1),
             ),
           ),
-          mouseCursor: MaterialStateMouseCursor.textable,
+          mouseCursor: WidgetStateMouseCursor.textable,
           onPressed: !enabled
               ? null
               : () async {
diff --git a/lib/components/player/player_queue.dart b/lib/components/player/player_queue.dart
index 914d7bc9..1665b3dd 100644
--- a/lib/components/player/player_queue.dart
+++ b/lib/components/player/player_queue.dart
@@ -122,7 +122,8 @@ class PlayerQueue extends HookConsumerWidget {
                 top: 5.0,
               ),
               decoration: BoxDecoration(
-                color: theme.colorScheme.surfaceVariant.withOpacity(0.5),
+                color:
+                    theme.colorScheme.surfaceContainerHighest.withOpacity(0.5),
                 borderRadius: borderRadius,
               ),
               child: CallbackShortcuts(
diff --git a/lib/components/player/sibling_tracks_sheet.dart b/lib/components/player/sibling_tracks_sheet.dart
index 99b7b430..0575d8eb 100644
--- a/lib/components/player/sibling_tracks_sheet.dart
+++ b/lib/components/player/sibling_tracks_sheet.dart
@@ -208,7 +208,8 @@ class SiblingTracksSheet extends HookConsumerWidget {
                   : mediaQuery.size.height * .6,
               decoration: BoxDecoration(
                 borderRadius: borderRadius,
-                color: theme.colorScheme.surfaceVariant.withOpacity(.5),
+                color:
+                    theme.colorScheme.surfaceContainerHighest.withOpacity(.5),
               ),
               child: Scaffold(
                 backgroundColor: Colors.transparent,
diff --git a/lib/components/root/bottom_player.dart b/lib/components/root/bottom_player.dart
index 5429e172..b99318df 100644
--- a/lib/components/root/bottom_player.dart
+++ b/lib/components/root/bottom_player.dart
@@ -14,7 +14,6 @@ import 'package:spotube/components/player/volume_slider.dart';
 import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/extensions/image.dart';
-import 'package:spotube/hooks/utils/use_brightness_value.dart';
 import 'package:spotube/models/logger.dart';
 import 'package:flutter/material.dart';
 import 'package:spotube/provider/authentication_provider.dart';
@@ -49,12 +48,6 @@ class BottomPlayer extends HookConsumerWidget {
     );
 
     final theme = Theme.of(context);
-    final bg = theme.colorScheme.surfaceVariant;
-
-    final bgColor = useBrightnessValue(
-      Color.lerp(bg, Colors.white, 0.7),
-      Color.lerp(bg, Colors.black, 0.45)!,
-    );
 
     // returning an empty non spacious Container as the overlay will take
     // place in the global overlay stack aka [_entries]
@@ -67,7 +60,9 @@ class BottomPlayer extends HookConsumerWidget {
       child: BackdropFilter(
         filter: ImageFilter.blur(sigmaX: 15, sigmaY: 15),
         child: DecoratedBox(
-          decoration: BoxDecoration(color: bgColor?.withOpacity(0.8)),
+          decoration: BoxDecoration(
+            color: theme.colorScheme.surfaceContainer.withOpacity(.8),
+          ),
           child: Material(
             type: MaterialType.transparency,
             textStyle: theme.textTheme.bodyMedium!,
diff --git a/lib/components/root/sidebar.dart b/lib/components/root/sidebar.dart
index 0e644a89..4fa14021 100644
--- a/lib/components/root/sidebar.dart
+++ b/lib/components/root/sidebar.dart
@@ -14,7 +14,6 @@ import 'package:spotube/components/shared/image/universal_image.dart';
 import 'package:spotube/extensions/constrains.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/extensions/image.dart';
-import 'package:spotube/hooks/utils/use_brightness_value.dart';
 import 'package:spotube/hooks/controllers/use_sidebarx_controller.dart';
 import 'package:spotube/pages/profile/profile.dart';
 import 'package:spotube/pages/settings/settings.dart';
@@ -70,12 +69,7 @@ class Sidebar extends HookConsumerWidget {
     );
 
     final theme = Theme.of(context);
-    final bg = theme.colorScheme.surfaceVariant;
-
-    final bgColor = useBrightnessValue(
-      Color.lerp(bg, Colors.white, 0.7),
-      Color.lerp(bg, Colors.black, 0.45)!,
-    );
+    final bg = theme.colorScheme.surfaceContainer;
 
     useEffect(() {
       if (!context.mounted) return;
@@ -159,7 +153,7 @@ class Sidebar extends HookConsumerWidget {
               ),
               padding: const EdgeInsets.symmetric(horizontal: 6),
               decoration: BoxDecoration(
-                color: bgColor?.withOpacity(0.8),
+                color: bg,
                 borderRadius: const BorderRadius.only(
                   topRight: Radius.circular(10),
                   bottomRight: Radius.circular(10),
diff --git a/lib/components/root/spotube_navigation_bar.dart b/lib/components/root/spotube_navigation_bar.dart
index e16ad1a8..3d0c7c75 100644
--- a/lib/components/root/spotube_navigation_bar.dart
+++ b/lib/components/root/spotube_navigation_bar.dart
@@ -68,7 +68,7 @@ class SpotubeNavigationBar extends HookConsumerWidget {
             backgroundColor:
                 theme.colorScheme.secondaryContainer.withOpacity(0.72),
             buttonBackgroundColor: buttonColor,
-            color: theme.colorScheme.background,
+            color: theme.colorScheme.surface,
             height: panelHeight,
             animationDuration: const Duration(milliseconds: 350),
             items: navbarTileList.map(
diff --git a/lib/components/settings/color_scheme_picker_dialog.dart b/lib/components/settings/color_scheme_picker_dialog.dart
index 8d098375..579f5a29 100644
--- a/lib/components/settings/color_scheme_picker_dialog.dart
+++ b/lib/components/settings/color_scheme_picker_dialog.dart
@@ -179,9 +179,9 @@ class ColorTile extends StatelessWidget {
       colorScheme.primaryContainer,
       colorScheme.secondary,
       colorScheme.secondaryContainer,
-      colorScheme.background,
       colorScheme.surface,
-      colorScheme.surfaceVariant,
+      colorScheme.surface,
+      colorScheme.surfaceContainerHighest,
       colorScheme.onPrimary,
       colorScheme.onSurface,
     ];
diff --git a/lib/components/shared/adaptive/adaptive_pop_sheet_list.dart b/lib/components/shared/adaptive/adaptive_pop_sheet_list.dart
index 21f56a22..ce7d3b8c 100644
--- a/lib/components/shared/adaptive/adaptive_pop_sheet_list.dart
+++ b/lib/components/shared/adaptive/adaptive_pop_sheet_list.dart
@@ -187,7 +187,7 @@ class AdaptivePopSheetList<T> extends StatelessWidget {
       icon: icon ?? const Icon(SpotubeIcons.moreVertical),
       tooltip: tooltip,
       style: theme.iconButtonTheme.style?.copyWith(
-        shape: MaterialStatePropertyAll(
+        shape: WidgetStatePropertyAll(
           RoundedRectangleBorder(
             borderRadius: borderRadius,
           ),
diff --git a/lib/components/shared/links/anchor_button.dart b/lib/components/shared/links/anchor_button.dart
index d78bbf96..c6f0b889 100644
--- a/lib/components/shared/links/anchor_button.dart
+++ b/lib/components/shared/links/anchor_button.dart
@@ -29,7 +29,7 @@ class AnchorButton<T> extends HookWidget {
       onTapUp: (event) => tap.value = false,
       onTap: onTap,
       child: MouseRegion(
-        cursor: MaterialStateMouseCursor.clickable,
+        cursor: WidgetStateMouseCursor.clickable,
         child: Text(
           text,
           style: style.copyWith(
diff --git a/lib/components/shared/page_window_title_bar.dart b/lib/components/shared/page_window_title_bar.dart
index f19757f3..66709844 100644
--- a/lib/components/shared/page_window_title_bar.dart
+++ b/lib/components/shared/page_window_title_bar.dart
@@ -206,16 +206,16 @@ class WindowTitleBarButtons extends HookConsumerWidget {
       final theme = Theme.of(context);
       final colors = WindowButtonColors(
         normal: Colors.transparent,
-        iconNormal: foregroundColor ?? theme.colorScheme.onBackground,
-        mouseOver: theme.colorScheme.onBackground.withOpacity(0.1),
-        mouseDown: theme.colorScheme.onBackground.withOpacity(0.2),
-        iconMouseOver: theme.colorScheme.onBackground,
-        iconMouseDown: theme.colorScheme.onBackground,
+        iconNormal: foregroundColor ?? theme.colorScheme.onSurface,
+        mouseOver: theme.colorScheme.onSurface.withOpacity(0.1),
+        mouseDown: theme.colorScheme.onSurface.withOpacity(0.2),
+        iconMouseOver: theme.colorScheme.onSurface,
+        iconMouseDown: theme.colorScheme.onSurface,
       );
 
       final closeColors = WindowButtonColors(
         normal: Colors.transparent,
-        iconNormal: foregroundColor ?? theme.colorScheme.onBackground,
+        iconNormal: foregroundColor ?? theme.colorScheme.onSurface,
         mouseOver: Colors.red,
         mouseDown: Colors.red[800]!,
         iconMouseOver: Colors.white,
diff --git a/lib/components/shared/playbutton_card.dart b/lib/components/shared/playbutton_card.dart
index 80a27eb0..807628b3 100644
--- a/lib/components/shared/playbutton_card.dart
+++ b/lib/components/shared/playbutton_card.dart
@@ -53,6 +53,10 @@ class PlaybuttonCard extends HookWidget {
     final mediaQuery = MediaQuery.of(context);
     final radius = BorderRadius.circular(15);
 
+    final bgColor = useBrightnessValue(
+      theme.colorScheme.surface,
+      theme.colorScheme.surfaceContainerHigh,
+    );
     final double size = useBreakpointValue<double>(
       xs: 130,
       sm: 130,
@@ -72,13 +76,9 @@ class PlaybuttonCard extends HookWidget {
       constraints: BoxConstraints(maxWidth: size),
       margin: margin,
       child: Material(
-        color: Color.lerp(
-          theme.colorScheme.surfaceVariant,
-          theme.colorScheme.surface,
-          useBrightnessValue(.9, .7),
-        ),
+        color: bgColor,
         borderRadius: radius,
-        shadowColor: theme.colorScheme.background,
+        shadowColor: theme.colorScheme.surface,
         elevation: 3,
         child: InkWell(
           mouseCursor: SystemMouseCursors.click,
@@ -158,7 +158,7 @@ class PlaybuttonCard extends HookWidget {
                           Skeleton.keep(
                             child: IconButton(
                               style: IconButton.styleFrom(
-                                backgroundColor: theme.colorScheme.background,
+                                backgroundColor: theme.colorScheme.surface,
                                 foregroundColor: theme.colorScheme.primary,
                                 minimumSize: const Size.square(10),
                               ),
diff --git a/lib/components/shared/themed_button_tab_bar.dart b/lib/components/shared/themed_button_tab_bar.dart
index b21ca992..c245e5f4 100644
--- a/lib/components/shared/themed_button_tab_bar.dart
+++ b/lib/components/shared/themed_button_tab_bar.dart
@@ -34,7 +34,7 @@ class ThemedButtonsTabBar extends HookWidget implements PreferredSizeWidget {
         ),
         borderWidth: 0,
         unselectedDecoration: BoxDecoration(
-          color: theme.colorScheme.background,
+          color: theme.colorScheme.surface,
           borderRadius: BorderRadius.circular(15),
         ),
         unselectedLabelStyle: theme.textTheme.labelLarge?.copyWith(
diff --git a/lib/components/stats/common/album_item.dart b/lib/components/stats/common/album_item.dart
index ccc0fa4e..00b1cbfe 100644
--- a/lib/components/stats/common/album_item.dart
+++ b/lib/components/stats/common/album_item.dart
@@ -33,7 +33,7 @@ class StatsAlbumItem extends StatelessWidget {
           Text("${album.albumType?.formatted} • "),
           Flexible(
             child: ArtistLink(
-              artists: album.artists!,
+              artists: album.artists ?? [],
               mainAxisAlignment: WrapAlignment.start,
             ),
           ),
diff --git a/lib/main.dart b/lib/main.dart
index 52d0b141..1693d9d8 100644
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -10,7 +10,6 @@ import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:local_notifier/local_notifier.dart';
 import 'package:media_kit/media_kit.dart';
 import 'package:metadata_god/metadata_god.dart';
-import 'package:shared_preferences/shared_preferences.dart';
 import 'package:spotube/collections/initializers.dart';
 import 'package:spotube/collections/routes.dart';
 import 'package:spotube/collections/intents.dart';
@@ -139,28 +138,11 @@ Future<void> main(List<String> rawArgs) async {
   );
 }
 
-class Spotube extends StatefulHookConsumerWidget {
+class Spotube extends HookConsumerWidget {
   const Spotube({super.key});
 
   @override
-  SpotubeState createState() => SpotubeState();
-
-  static SpotubeState of(BuildContext context) =>
-      context.findAncestorStateOfType<SpotubeState>()!;
-}
-
-class SpotubeState extends ConsumerState<Spotube> {
-  final logger = getLogger(Spotube);
-  SharedPreferences? localStorage;
-
-  @override
-  void initState() {
-    super.initState();
-    SharedPreferences.getInstance().then(((value) => localStorage = value));
-  }
-
-  @override
-  Widget build(BuildContext context) {
+  Widget build(BuildContext context, ref) {
     final themeMode =
         ref.watch(userPreferencesProvider.select((s) => s.themeMode));
     final accentMaterialColor =
@@ -195,6 +177,7 @@ class SpotubeState extends ConsumerState<Spotube> {
       () => theme(paletteColor ?? accentMaterialColor, Brightness.light, false),
       [paletteColor, accentMaterialColor],
     );
+
     final darkTheme = useMemoized(
       () => theme(
         paletteColor ?? accentMaterialColor,
diff --git a/lib/pages/desktop_login/desktop_login.dart b/lib/pages/desktop_login/desktop_login.dart
index 9c9bdddb..c9367e05 100644
--- a/lib/pages/desktop_login/desktop_login.dart
+++ b/lib/pages/desktop_login/desktop_login.dart
@@ -17,7 +17,7 @@ class DesktopLoginPage extends HookConsumerWidget {
   Widget build(BuildContext context, ref) {
     final mediaQuery = MediaQuery.of(context);
     final theme = Theme.of(context);
-    final color = theme.colorScheme.surfaceVariant.withOpacity(.3);
+    final color = theme.colorScheme.surfaceContainerHighest.withOpacity(.3);
 
     return SafeArea(
       child: Scaffold(
diff --git a/lib/pages/lyrics/lyrics.dart b/lib/pages/lyrics/lyrics.dart
index 850eccfa..1d9b383a 100644
--- a/lib/pages/lyrics/lyrics.dart
+++ b/lib/pages/lyrics/lyrics.dart
@@ -100,7 +100,7 @@ class LyricsPage extends HookConsumerWidget {
             child: Container(
               clipBehavior: Clip.hardEdge,
               decoration: BoxDecoration(
-                color: Theme.of(context).colorScheme.background.withOpacity(.4),
+                color: Theme.of(context).colorScheme.surface.withOpacity(.4),
                 borderRadius: const BorderRadius.only(
                   topLeft: Radius.circular(10),
                   topRight: Radius.circular(10),
diff --git a/lib/pages/lyrics/mini_lyrics.dart b/lib/pages/lyrics/mini_lyrics.dart
index 996e190d..a026209c 100644
--- a/lib/pages/lyrics/mini_lyrics.dart
+++ b/lib/pages/lyrics/mini_lyrics.dart
@@ -107,8 +107,7 @@ class MiniLyricsPage extends HookConsumerWidget {
                           : const Icon(SpotubeIcons.lyricsOff),
                       style: ButtonStyle(
                         foregroundColor: showLyrics.value
-                            ? MaterialStateProperty.all(
-                                theme.colorScheme.primary)
+                            ? WidgetStateProperty.all(theme.colorScheme.primary)
                             : null,
                       ),
                       onPressed: () async {
@@ -132,8 +131,7 @@ class MiniLyricsPage extends HookConsumerWidget {
                           : const Icon(SpotubeIcons.hoverOff),
                       style: ButtonStyle(
                         foregroundColor: hoverMode.value
-                            ? MaterialStateProperty.all(
-                                theme.colorScheme.primary)
+                            ? WidgetStateProperty.all(theme.colorScheme.primary)
                             : null,
                       ),
                       onPressed: () async {
@@ -154,7 +152,7 @@ class MiniLyricsPage extends HookConsumerWidget {
                             ),
                             style: ButtonStyle(
                               foregroundColor: snapshot.data == true
-                                  ? MaterialStateProperty.all(
+                                  ? WidgetStateProperty.all(
                                       theme.colorScheme.primary)
                                   : null,
                             ),
@@ -186,12 +184,12 @@ class MiniLyricsPage extends HookConsumerWidget {
                   child: TabBarView(
                     children: [
                       SyncedLyrics(
-                        palette: PaletteColor(theme.colorScheme.background, 0),
+                        palette: PaletteColor(theme.colorScheme.surface, 0),
                         isModal: true,
                         defaultTextZoom: 65,
                       ),
                       PlainLyrics(
-                        palette: PaletteColor(theme.colorScheme.background, 0),
+                        palette: PaletteColor(theme.colorScheme.surface, 0),
                         isModal: true,
                         defaultTextZoom: 65,
                       ),
diff --git a/lib/pages/search/search.dart b/lib/pages/search/search.dart
index d5374786..50ef152b 100644
--- a/lib/pages/search/search.dart
+++ b/lib/pages/search/search.dart
@@ -212,7 +212,7 @@ class SearchPage extends HookConsumerWidget {
                                 Icon(
                                   SpotubeIcons.web,
                                   size: 120,
-                                  color: theme.colorScheme.onBackground
+                                  color: theme.colorScheme.onSurface
                                       .withOpacity(0.7),
                                 ),
                                 const SizedBox(height: 20),
@@ -220,7 +220,7 @@ class SearchPage extends HookConsumerWidget {
                                   context.l10n.search_to_get_results,
                                   style: theme.textTheme.titleLarge?.copyWith(
                                     fontWeight: FontWeight.w900,
-                                    color: theme.colorScheme.onBackground
+                                    color: theme.colorScheme.onSurface
                                         .withOpacity(0.5),
                                   ),
                                 ),
@@ -246,7 +246,7 @@ class SearchPage extends HookConsumerWidget {
                                         style: TextStyle(
                                           fontSize: 20,
                                           fontWeight: FontWeight.w900,
-                                          color: theme.colorScheme.onBackground
+                                          color: theme.colorScheme.onSurface
                                               .withOpacity(0.7),
                                         ),
                                       ),
diff --git a/lib/pages/settings/blacklist.dart b/lib/pages/settings/blacklist.dart
index 6eccab07..4e937922 100644
--- a/lib/pages/settings/blacklist.dart
+++ b/lib/pages/settings/blacklist.dart
@@ -20,7 +20,6 @@ class BlackListPage extends HookConsumerWidget {
     final controller = useScrollController();
     final blacklist = ref.watch(blacklistProvider);
     final searchText = useState("");
-
     final filteredBlacklist = useMemoized(
       () {
         if (searchText.value.isEmpty) {
diff --git a/lib/pages/settings/sections/about.dart b/lib/pages/settings/sections/about.dart
index a8d72cc0..5e5d2377 100644
--- a/lib/pages/settings/sections/about.dart
+++ b/lib/pages/settings/sections/about.dart
@@ -43,10 +43,9 @@ class SettingsAboutSection extends HookConsumerWidget {
           ),
           trailing: (context, update) => FilledButton(
             style: ButtonStyle(
-              backgroundColor: MaterialStatePropertyAll(Colors.red[100]),
-              foregroundColor:
-                  const MaterialStatePropertyAll(Colors.pinkAccent),
-              padding: const MaterialStatePropertyAll(EdgeInsets.all(15)),
+              backgroundColor: WidgetStatePropertyAll(Colors.red[100]),
+              foregroundColor: const WidgetStatePropertyAll(Colors.pinkAccent),
+              padding: const WidgetStatePropertyAll(EdgeInsets.all(15)),
             ),
             onPressed: () {
               launchUrlString(
diff --git a/lib/pages/settings/sections/accounts.dart b/lib/pages/settings/sections/accounts.dart
index 6162aa3d..5acab480 100644
--- a/lib/pages/settings/sections/accounts.dart
+++ b/lib/pages/settings/sections/accounts.dart
@@ -82,7 +82,7 @@ class SettingsAccountSection extends HookConsumerWidget {
                         router.push("/login");
                       },
                       style: ButtonStyle(
-                        shape: MaterialStateProperty.all(
+                        shape: WidgetStateProperty.all(
                           RoundedRectangleBorder(
                             borderRadius: BorderRadius.circular(25.0),
                           ),
diff --git a/lib/pages/settings/sections/downloads.dart b/lib/pages/settings/sections/downloads.dart
index 3092ed03..76ef8e3e 100644
--- a/lib/pages/settings/sections/downloads.dart
+++ b/lib/pages/settings/sections/downloads.dart
@@ -3,7 +3,6 @@ import 'package:file_selector/file_selector.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
-import 'package:go_router/go_router.dart';
 import 'package:spotube/collections/spotube_icons.dart';
 import 'package:spotube/components/settings/section_card_with_heading.dart';
 import 'package:spotube/extensions/context.dart';
diff --git a/lib/themes/theme.dart b/lib/themes/theme.dart
index 51e98269..cf1da7be 100644
--- a/lib/themes/theme.dart
+++ b/lib/themes/theme.dart
@@ -4,13 +4,22 @@ ThemeData theme(Color seed, Brightness brightness, bool isAmoled) {
   final scheme = ColorScheme.fromSeed(
     seedColor: seed,
     shadow: Colors.black12,
-    background: isAmoled ? Colors.black : null,
     surface: isAmoled ? Colors.black : null,
+    surfaceContainer: isAmoled ? const Color(0xFF090909) : null,
+    surfaceContainerHigh: isAmoled ? const Color(0xFF181818) : null,
+    surfaceContainerHighest: isAmoled ? const Color(0xFF282828) : null,
     brightness: brightness,
   );
   return ThemeData(
     useMaterial3: true,
     colorScheme: scheme,
+    scaffoldBackgroundColor: isAmoled ? Colors.black : null,
+    cardTheme: CardTheme(
+      color: scheme.surfaceContainer,
+      shadowColor: scheme.shadow,
+      elevation: 2,
+      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)),
+    ),
     listTileTheme: ListTileThemeData(
       horizontalTitleGap: 5,
       iconColor: scheme.onSurface,
@@ -25,7 +34,7 @@ ThemeData theme(Color seed, Brightness brightness, bool isAmoled) {
     navigationBarTheme: const NavigationBarThemeData(
       labelBehavior: NavigationDestinationLabelBehavior.alwaysHide,
       height: 50,
-      iconTheme: MaterialStatePropertyAll(
+      iconTheme: WidgetStatePropertyAll(
         IconThemeData(size: 18),
       ),
     ),
@@ -52,25 +61,25 @@ ThemeData theme(Color seed, Brightness brightness, bool isAmoled) {
     ),
     sliderTheme: SliderThemeData(overlayShape: SliderComponentShape.noOverlay),
     searchBarTheme: SearchBarThemeData(
-      textStyle: const MaterialStatePropertyAll(TextStyle(fontSize: 15)),
+      textStyle: const WidgetStatePropertyAll(TextStyle(fontSize: 15)),
       constraints: const BoxConstraints(maxWidth: double.infinity),
-      padding: const MaterialStatePropertyAll(EdgeInsets.all(8)),
-      backgroundColor: MaterialStatePropertyAll(
+      padding: const WidgetStatePropertyAll(EdgeInsets.all(8)),
+      backgroundColor: WidgetStatePropertyAll(
         Color.lerp(
-          scheme.surfaceVariant,
+          scheme.surfaceContainerHighest,
           scheme.surface,
           brightness == Brightness.light ? .9 : .7,
         ),
       ),
-      elevation: const MaterialStatePropertyAll(0),
-      shape: MaterialStatePropertyAll(
+      elevation: const WidgetStatePropertyAll(0),
+      shape: WidgetStatePropertyAll(
         RoundedRectangleBorder(
           borderRadius: BorderRadius.circular(10),
         ),
       ),
     ),
     scrollbarTheme: const ScrollbarThemeData(
-      thickness: MaterialStatePropertyAll(14),
+      thickness: WidgetStatePropertyAll(14),
     ),
     checkboxTheme: CheckboxThemeData(
       shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),