1

src/components/auth/AccountModal.tsx

@@ -173,7 +173,7 @@ function OverlayPanel({
       onClick={onBack ?? onClose}
     >
       <div
-        className="platform-auth-card flex w-full flex-col overflow-hidden rounded-[28px] p-5 sm:max-w-3xl sm:p-6"
+        className="platform-auth-card flex max-h-full w-full min-h-0 flex-col overflow-hidden rounded-[28px] p-5 sm:max-w-3xl sm:p-6"
         role="dialog"
         aria-modal="true"
         aria-label={title}
@@ -182,20 +182,8 @@ function OverlayPanel({
       >
         <div className="flex items-start justify-between gap-4">
           <div className="min-w-0">
-            <div className="flex flex-wrap items-center gap-2">
-              {onBack ? (
-                <button
-                  type="button"
-                  autoFocus
-                  className="platform-button platform-button--ghost min-h-0 rounded-full px-3 py-1.5 text-xs"
-                  onClick={onBack}
-                >
-                  返回
-                </button>
-              ) : null}
-              <div className="text-xs uppercase tracking-[0.28em] text-[var(--platform-cool-text)]">
-                {eyebrow}
-              </div>
+            <div className="text-xs uppercase tracking-[0.28em] text-[var(--platform-cool-text)]">
+              {eyebrow}
             </div>
             <div className="mt-2 text-2xl font-semibold text-[var(--platform-text-strong)]">
               {title}
@@ -208,7 +196,16 @@ function OverlayPanel({
           </div>
           <div className="flex items-center gap-2">
             {action}
-            {onBack ? null : (
+            {onBack ? (
+              <button
+                type="button"
+                autoFocus
+                className="platform-button platform-button--ghost min-h-0 rounded-full px-3 py-1.5 text-xs"
+                onClick={onBack}
+              >
+                返回
+              </button>
+            ) : (
               <button
                 type="button"
                 className="platform-button platform-button--ghost min-h-0 rounded-full px-3 py-1.5 text-xs"
@@ -420,7 +417,7 @@ export function AccountModal({
       onClick={onClose}
     >
       <div
-        className="platform-auth-card relative flex w-full max-w-5xl flex-col overflow-hidden rounded-[28px] p-5 sm:p-6"
+        className="platform-auth-card relative flex h-[min(100%,calc(100vh-2rem))] w-full max-w-5xl min-h-0 flex-col overflow-hidden rounded-[28px] p-5 sm:p-6"
         role="dialog"
         aria-modal="true"
         aria-label="设置与账号安全"
@@ -443,7 +440,7 @@ export function AccountModal({
         </div>
 
         <div className="mt-5 min-h-0 flex-1 overflow-y-auto overscroll-y-contain pr-1">
-          <div ref={settingsHomeRef} className="space-y-4">
+          <div ref={settingsHomeRef} className="flex min-h-0 flex-col gap-4">
             <div className="grid gap-3 sm:grid-cols-2">
               {SETTINGS_SECTIONS.map((section) => (
                 <SettingsEntryCard
@@ -459,39 +456,6 @@ export function AccountModal({
                 />
               ))}
             </div>
-
-            <div className="platform-subpanel rounded-2xl px-4 py-4">
-              <div className="text-sm font-semibold text-[var(--platform-text-strong)]">
-                当前主题
-              </div>
-              <div className="mt-1 text-sm text-[var(--platform-text-base)]">
-                {platformTheme === 'dark' ? '暗色主题' : '亮色主题'}
-              </div>
-              <span className="platform-pill platform-pill--neutral mt-3 inline-flex px-3 py-1 text-[11px]">
-                {themeStatusText}
-              </span>
-            </div>
-
-            <div className="grid gap-3 sm:grid-cols-2">
-              <button
-                type="button"
-                className="platform-button platform-button--ghost h-11 w-full text-sm"
-                onClick={() => {
-                  void onLogout();
-                }}
-              >
-                退出登录
-              </button>
-              <button
-                type="button"
-                className="platform-button platform-button--danger h-11 w-full text-sm"
-                onClick={() => {
-                  void onLogoutAll();
-                }}
-              >
-                退出全部设备
-              </button>
-            </div>
           </div>
         </div>
 
@@ -503,7 +467,7 @@ export function AccountModal({
             onBack={closeSectionPanel}
             onClose={onClose}
           >
-            <div className="space-y-4">
+            <div className="flex min-h-0 flex-col gap-4">
               <div className="grid gap-3 md:grid-cols-2">
                 <ThemeOptionCard
                   active={platformTheme === 'light'}
@@ -548,7 +512,7 @@ export function AccountModal({
             onBack={closeSectionPanel}
             onClose={onClose}
           >
-            <div className="space-y-4">
+            <div className="flex min-h-0 flex-col gap-4">
               {accountNotice ? (
                 <div className="platform-banner platform-banner--success text-sm">
                   {accountNotice}
@@ -571,6 +535,27 @@ export function AccountModal({
                 ))}
               </div>
 
+              <div className="grid gap-3 sm:grid-cols-2">
+                <button
+                  type="button"
+                  className="platform-button platform-button--ghost h-11 w-full text-sm"
+                  onClick={() => {
+                    void onLogout();
+                  }}
+                >
+                  退出登录
+                </button>
+                <button
+                  type="button"
+                  className="platform-button platform-button--danger h-11 w-full text-sm"
+                  onClick={() => {
+                    void onLogoutAll();
+                  }}
+                >
+                  退出全部设备
+                </button>
+              </div>
+
               <div className="platform-subpanel rounded-2xl px-4 py-4">
                 <div className="flex items-center justify-between gap-3">
                   <div>