refactor(ui): unify dialog styles and improve layout consistency

Standardize dialog and panel components across the application.
- Update dialog background to use semantic color tokens
- Adjust FullScreenPanel max-width to 56rem for better alignment
- Add drag region and prevent body scroll in full-screen panels
- Optimize button sizes and spacing in panel headers
- Apply consistent styling to all dialog-based components

src/components/settings/SettingsPage.tsx

@@ -168,7 +168,7 @@ export function SettingsPage({
   const isBusy = useMemo(() => isLoading && !settings, [isLoading, settings]);
 
   return (
-    <div className="mx-auto max-w-[60rem] flex flex-col h-[calc(100vh-8rem)] px-6">
+    <div className="mx-auto max-w-[56rem] flex flex-col h-[calc(100vh-8rem)] px-6">
       {isBusy ? (
         <div className="flex flex-1 items-center justify-center">
           <Loader2 className="h-8 w-8 animate-spin text-muted-foreground" />
@@ -272,7 +272,7 @@ export function SettingsPage({
       >
         <DialogContent
           zIndex="alert"
-          className="max-w-md glass-card border-white/10"
+          className="max-w-md glass border-white/10"
         >
           <DialogHeader>
             <DialogTitle>{t("settings.restartRequired")}</DialogTitle>