fix: 侧边面板恢复原始简洁版 + 星际漫游流星方向修正

- SidePanel: 恢复 commit 46054c8 原始版（左38%暗色品牌区+右62%登录表单）
- 去掉深海鲸歌动画效果，回归简洁专业风格
- AppearanceSettings: 缩略图预览同步更新
- CosmosView: 流星方向从左上→右下改为右上→左下（符合真实流星观感）

frontend/src/pages/AppearanceSettings.tsx

@@ -9,7 +9,7 @@ import { toast } from '@/hooks/useToast';
 const LOGIN_PREVIEW_COLORS: Record<LoginStyle, { bg: string; accent: string; label: string }> = {
   split: { bg: 'linear-gradient(135deg, #080c14 0%, #0c1420 100%)', accent: '#00d4aa', label: '晶格科技' },
   centered: { bg: 'linear-gradient(180deg, #0a0a1a 0%, #1a1035 50%, #2d1810 100%)', accent: '#fbbf24', label: '晨曦微光' },
-  sidepanel: { bg: 'linear-gradient(180deg, #020810 0%, #062030 100%)', accent: '#06b6d4', label: '深海鲸歌' },
+  sidepanel: { bg: 'linear-gradient(180deg, #111827 0%, #1f2937 100%)', accent: '#6366f1', label: '简洁专业' },
   fullimage: { bg: '#0d1117', accent: '#6366f1', label: 'GitHub/AWS' },
   minimal: { bg: 'linear-gradient(160deg, #0a0a1a 0%, #0f0a2a 40%, #150825 70%, #0a0a1a 100%)', accent: '#ec4899', label: 'Premium Dark' },
   aurora: { bg: 'linear-gradient(180deg, #050810 0%, #0a0e1a 30%, #0d1425 60%, #080c14 100%)', accent: '#10b981', label: '极光之境' },
@@ -178,28 +178,27 @@ export default function AppearanceSettings() {
                   )}
                   {opt.id === 'sidepanel' && (
                     <div className="absolute inset-0 flex">
-                      <div className="w-[38%] relative overflow-hidden" style={{ background: 'linear-gradient(180deg, #020810 0%, #062030 100%)' }}>
-                        {/* Wave lines */}
-                        {[25, 40, 55, 70].map(t => (
-                          <div key={t} className="absolute left-1/2 -translate-x-1/2 rounded-full" style={{ width: '120%', height: 20, top: `${t}%`, borderTop: '1px solid rgba(6,182,212,0.1)', borderRadius: '50%' }} />
-                        ))}
-                        {/* Biolum dots */}
-                        {[30, 50, 65].map(t => (
-                          <div key={t} className="absolute rounded-full" style={{ width: 3, height: 3, background: 'rgba(6,182,212,0.5)', top: `${t}%`, left: '30%', boxShadow: '0 0 4px rgba(6,182,212,0.4)' }} />
-                        ))}
-                        <div className="absolute bottom-2 left-2 flex flex-col gap-0.5">
-                          <div className="w-6 h-1 rounded-sm" style={{ background: 'rgba(6,182,212,0.5)' }} />
-                          <div className="flex gap-0.5">
-                            {['审核', '管控'].map(t => (
-                              <span key={t} className="px-1 rounded text-[5px]" style={{ background: 'rgba(6,182,212,0.1)', color: 'rgba(6,182,212,0.5)' }}>{t}</span>
-                            ))}
-                          </div>
+                      <div className="w-[38%] relative overflow-hidden flex flex-col justify-between p-1.5" style={{ background: 'linear-gradient(180deg, #111827 0%, #1f2937 100%)' }}>
+                        {/* Brand area */}
+                        <div className="flex flex-col gap-0.5">
+                          <div className="w-2.5 h-2.5 rounded-sm" style={{ background: 'linear-gradient(135deg, #6366f1, #8b5cf6)' }} />
+                          <div className="w-6 h-1 rounded-sm" style={{ background: 'rgba(255,255,255,0.8)' }} />
+                          <div className="w-8 h-1 rounded-sm" style={{ background: 'rgba(255,255,255,0.8)' }} />
+                          <div className="w-10 h-0.5 rounded-sm" style={{ background: 'rgba(255,255,255,0.3)' }} />
+                        </div>
+                        {/* Feature pills */}
+                        <div className="flex flex-wrap gap-0.5">
+                          {['SQL审核', '变更审批', '监控'].map(t => (
+                            <span key={t} className="px-0.5 rounded text-[4px]" style={{ background: 'rgba(255,255,255,0.06)', color: 'rgba(255,255,255,0.5)' }}>{t}</span>
+                          ))}
                         </div>
                       </div>
-                      <div className="flex-1 p-2 flex flex-col justify-center gap-1" style={{ background: '#060e18' }}>
-                        <div className="h-0.5 rounded-sm" style={{ background: 'rgba(6,182,212,0.1)' }} />
-                        <div className="h-0.5 rounded-sm" style={{ background: 'rgba(6,182,212,0.1)' }} />
-                        <div className="h-1 rounded-sm mt-0.5" style={{ background: '#06b6d4', opacity: 0.5 }} />
+                      <div className="flex-1 p-2 flex flex-col justify-center gap-0.5" style={{ background: 'var(--dg-bg-primary, #0a0a1a)' }}>
+                        <div className="w-4 h-0.5 rounded-sm" style={{ background: 'rgba(255,255,255,0.3)' }} />
+                        <div className="w-8 h-0.5 rounded-sm" style={{ background: 'rgba(255,255,255,0.08)' }} />
+                        <div className="w-full h-0.5 rounded-sm" style={{ background: 'rgba(255,255,255,0.08)' }} />
+                        <div className="w-full h-0.5 rounded-sm" style={{ background: 'rgba(255,255,255,0.08)' }} />
+                        <div className="w-full h-1 rounded-sm mt-0.5" style={{ background: '#6366f1', opacity: 0.5 }} />
                       </div>
                     </div>
                   )}

frontend/src/pages/LoginPage.tsx

@@ -28,7 +28,7 @@ const LOGIN_STYLES: Record<LoginStyle, React.ComponentType> = {
 export const LOGIN_STYLE_OPTIONS: { id: LoginStyle; name: string; desc: string }[] = [
   { id: 'split', name: '经典分屏', desc: '左黑右白，晶格科技感' },
   { id: 'centered', name: '居中卡片', desc: '黎明光柱，金色晨曦氛围' },
-  { id: 'sidepanel', name: '侧边面板', desc: '深海波浪，生物发光粒子' },
+  { id: 'sidepanel', name: '侧边面板', desc: '左品牌右登录，简洁专业' },
   { id: 'fullimage', name: '全屏背景', desc: '科技背景，毛玻璃卡片' },
   { id: 'minimal', name: '深蓝紫曲线', desc: '优雅暗黑，粉紫流动曲线' },
   { id: 'aurora', name: '极光之境', desc: '北极光动态渐变，紫绿流光' },