feat(ui): restyle core views with Material You

src/features/reader/overlay/mobile/ReaderOverlayHeaderMobile.tsx

@@ -35,6 +35,7 @@ import {
     useReaderStore,
 } from '@/features/reader/stores/ReaderStore.ts';
 import { copyToClipboard } from '@/lib/HelperFunctions.ts';
+import { MATERIAL_YOU_VISUALS } from '@/features/theme/services/MaterialYouVisualTokens.ts';
 
 const DEFAULT_MANGA = { ...FALLBACK_MANGA, title: '' };
 
@@ -61,9 +62,12 @@ const BaseReaderOverlayHeaderMobile = ({ isVisible, ref }: MobileHeaderProps & {
                     right: `${scrollbar.ySize}px`,
                     p: 2,
                     pt: (theme) => `max(env(safe-area-inset-top), ${theme.spacing(2)})`,
-                    backgroundColor: (theme) => theme.alpha(theme.palette.background.paper, 0.95),
+                    backgroundColor: (theme) =>
+                        theme.alpha(theme.palette.background.paper, MATERIAL_YOU_VISUALS.readerChromeOpacity),
+                    backdropFilter: 'blur(20px) saturate(1.15)',
                     pointerEvents: 'all',
-                    boxShadow: 2,
+                    borderBottom: '1px solid',
+                    borderColor: 'divider',
                 }}
             >
                 <ReaderExitButton />