feat: 5种专业登录页风格 + 外观设置 + 文档全面更新

- 新增 5 种登录页组件: SplitView/CenteredCard/SidePanel/FullImage/MinimalDark
- 提取 useLogin hook 共享登录逻辑
- LoginPage 改为风格分发器, localStorage(login-style) 控制渲染
- SettingsPage 新增外观设置 tab: 主题切换 + 登录风格选择器(含缩略图预览)
- AppearanceSettings 组件: 5 种风格卡片式切换
- 文档全面更新为 Go/Gin 架构:
  - ARCHITECTURE.md: Go 项目结构/handler/GORM 模型/中间件/LDAP/驱动矩阵
  - FEATURES.md: v0.3.1 功能清单含登录主题系统
  - ROADMAP.md: Python→Go 迁移历史 + Sprint 计划

frontend/src/pages/SettingsPage.tsx

@@ -4,11 +4,12 @@ import AuditRulesPage from './AuditRulesPage';
 import AnnouncementPage from './AnnouncementPage';
 import NotificationPage from './NotificationPage';
 import LdapConfigPage from './LdapConfigPage';
+import AppearanceSettings from './AppearanceSettings';
 
 const tabs = [
+  { id: 'appearance', label: '外观设置', icon: '🎨' },
   { id: 'platform', label: '平台配置', icon: '⚙️' },
   { id: 'rules', label: '审核规则', icon: '🛡️' },
-  { id: 'announcement', label: '公告管理', icon: '📢' },
   { id: 'notification', label: '消息推送', icon: '🔔' },
   { id: 'ldap', label: 'LDAP', icon: '🔐' },
 ] as const;
@@ -16,13 +17,13 @@ const tabs = [
 type TabId = typeof tabs[number]['id'];
 
 export default function SettingsPage() {
-  const [activeTab, setActiveTab] = useState<TabId>('platform');
+  const [activeTab, setActiveTab] = useState<TabId>('appearance');
 
   return (
     <div className="space-y-5">
       <div>
         <h1 className="text-xl font-semibold">系统设置</h1>
-        <p className="text-sm text-[var(--dg-text-muted)] mt-1">管理平台配置、审核规则、消息推送和 LDAP 认证</p>
+        <p className="text-sm text-[var(--dg-text-muted)] mt-1">管理平台外观、配置、审核规则、消息推送和 LDAP 认证</p>
       </div>
 
       {/* Tab 导航 */}
@@ -45,9 +46,9 @@ export default function SettingsPage() {
 
       {/* 内容区 */}
       <div>
+        {activeTab === 'appearance' && <AppearanceSettings />}
         {activeTab === 'platform' && <PlatformConfigPage />}
         {activeTab === 'rules' && <AuditRulesPage />}
-        {activeTab === 'announcement' && <AnnouncementPage />}
         {activeTab === 'notification' && <NotificationPage />}
         {activeTab === 'ldap' && <LdapConfigPage />}
       </div>