style: optimize page styles

frontend/src/components/workspace/settings/account-settings-page.tsx

@@ -170,11 +170,11 @@ export function AccountSettingsPage() {
         </SettingsCard>
       </SettingsSection>
 
-      <SettingsSection title="Session">
+      <SettingsSection title={t.settings.account.sessionTitle}>
         <SettingsCard>
           <SettingsRow
             label={t.settings.account.signOut}
-            description="Sign out of this device. You can sign back in any time."
+            description={t.settings.account.signOutDescription}
             control={
               <Button
                 variant="destructive"

frontend/src/components/workspace/settings/notification-settings-page.tsx

@@ -47,7 +47,6 @@ export function NotificationSettingsPage() {
         <SettingsRow
           label={t.settings.notification.title}
           description={t.settings.notification.description}
-          align="start"
           control={
             <Switch
               disabled={permission !== "granted"}

frontend/src/components/workspace/settings/settings-section.tsx

@@ -48,7 +48,7 @@ export function SettingsCard({
   return (
     <div
       className={cn(
-        "bg-card divide-border divide-y rounded-lg border",
+        "bg-background divide-border divide-y rounded-lg border",
         className,
       )}
     >

frontend/src/components/workspace/settings/settings-shell.tsx

@@ -72,11 +72,11 @@ export function SettingsShell({ children }: { children: React.ReactNode }) {
 
   return (
     <div className="flex h-full min-h-0 flex-1 flex-col overflow-hidden">
-      <div className="flex-1 overflow-y-auto">
+      <div className="flex-1 overflow-y-auto [scrollbar-gutter:stable]">
         <div className="mx-auto w-full max-w-6xl px-4 py-8 sm:px-6 sm:py-10">
           {/* Page header */}
           <header className="mb-8 space-y-1.5">
-            <h1 className="text-3xl font-semibold tracking-tight">
+            <h1 className="text-base font-semibold tracking-tight">
               {t.settings.title}
             </h1>
             <p className="text-muted-foreground text-sm">

frontend/src/components/workspace/settings/tool-settings-page.tsx

@@ -42,7 +42,6 @@ function MCPServerList({
       {entries.map(([name, config]) => (
         <SettingsRow
           key={name}
-          align="start"
           label={name}
           description={config.description}
           control={

frontend/src/core/i18n/locales/en-US.ts

@@ -494,7 +494,10 @@ export const enUS: Translations = {
       networkError: "Network error. Please try again.",
       updating: "Updating...",
       updatePassword: "Update Password",
+      sessionTitle: "Session",
       signOut: "Sign Out",
+      signOutDescription:
+        "Sign out of this device. You can sign back in any time.",
     },
     acknowledge: {
       emptyTitle: "Acknowledgements",

frontend/src/core/i18n/locales/types.ts

@@ -410,7 +410,9 @@ export interface Translations {
       networkError: string;
       updating: string;
       updatePassword: string;
+      sessionTitle: string;
       signOut: string;
+      signOutDescription: string;
     };
     acknowledge: {
       emptyTitle: string;

frontend/src/core/i18n/locales/zh-CN.ts

@@ -474,7 +474,9 @@ export const zhCN: Translations = {
       networkError: "网络错误，请重试。",
       updating: "更新中...",
       updatePassword: "修改密码",
+      sessionTitle: "会话",
       signOut: "退出登录",
+      signOutDescription: "退出当前设备的登录，你可以随时重新登录。",
     },
     acknowledge: {
       emptyTitle: "致谢",