增加自动亮色/暗色主题切换 + 清理 pyc 文件

- 新建 store/theme.tsx: 亮色/暗色/跟随系统三种模式
- App.tsx: ThemeProvider + ConfigProvider 暗色算法
- MainLayout: 侧边栏主题切换按钮，Sider/Content 随主题变化
- 所有页面硬编码颜色替换为 antd token
- AssignmentsPage: Tag 用预设颜色名适配暗色，未选中背景用 colorBgContainer
- LoginPage: 暗色深色渐变背景
- 从 git 移除所有 __pycache__/*.pyc 文件

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

web/frontend/src/layouts/MainLayout.tsx

@@ -1,13 +1,15 @@
 import { useEffect, useState } from 'react';
-import { Layout, Menu, Avatar, Space, Typography, Button, Modal } from 'antd';
+import { Layout, Menu, Avatar, Space, Typography, Button, Modal, Dropdown } from 'antd';
 import {
   DashboardOutlined, UserOutlined, LogoutOutlined,
   CloudServerOutlined, TeamOutlined, ApiOutlined, KeyOutlined,
   MenuFoldOutlined, MenuUnfoldOutlined, SwapOutlined,
+  SunOutlined, MoonOutlined, DesktopOutlined,
 } from '@ant-design/icons';
 import { useNavigate, useLocation, Outlet } from 'react-router-dom';
 import { getUser, clearAuth, hasPerm, type AuthUser } from '../store/auth';
 import { authApi } from '../api/modules';
+import { useTheme, type ThemeMode } from '../store/theme';
 
 const { Sider, Content } = Layout;
 const { Text } = Typography;
@@ -18,11 +20,18 @@ const ROLE_LABELS: Record<string, string> = {
   support: '客服',
 };
 
+const THEME_OPTIONS: { key: ThemeMode; label: string; icon: React.ReactNode }[] = [
+  { key: 'light', label: '亮色', icon: <SunOutlined /> },
+  { key: 'dark', label: '暗色', icon: <MoonOutlined /> },
+  { key: 'system', label: '跟随系统', icon: <DesktopOutlined /> },
+];
+
 export default function MainLayout({ onLogout }: { onLogout?: () => void }) {
   const navigate = useNavigate();
   const location = useLocation();
   const [user] = useState<AuthUser | null>(getUser());
   const [collapsed, setCollapsed] = useState(false);
+  const { mode, isDark, setMode } = useTheme();
 
   useEffect(() => {
     if (!user) navigate('/login');
@@ -84,17 +93,21 @@ export default function MainLayout({ onLogout }: { onLogout?: () => void }) {
     });
   };
 
+  const siderTheme = isDark ? 'dark' : 'light';
+  const siderTextColor = isDark ? '#fff' : undefined;
+
   return (
     <Layout style={{ height: '100vh', overflow: 'hidden' }}>
-      <Sider trigger={null} collapsed={collapsed} onCollapse={setCollapsed}>
+      <Sider trigger={null} collapsed={collapsed} onCollapse={setCollapsed} theme={siderTheme}>
         <div style={{
           display: 'flex', flexDirection: 'column', height: '100%',
         }}>
           <div style={{
-            height: 48, margin: '12px 12px 0', color: '#fff', fontSize: 16,
+            height: 48, margin: '12px 12px 0', fontSize: 16,
             textAlign: 'center', lineHeight: '48px', fontWeight: 'bold',
             whiteSpace: 'nowrap', overflow: 'hidden', flexShrink: 0,
             display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 8,
+            color: siderTextColor,
           }}>
             <span style={{ overflow: 'hidden', textOverflow: 'ellipsis' }}>
               {collapsed ? '鱼' : '斗鱼登录后台'}
@@ -104,11 +117,11 @@ export default function MainLayout({ onLogout }: { onLogout?: () => void }) {
               size="small"
               icon={collapsed ? <MenuUnfoldOutlined /> : <MenuFoldOutlined />}
               onClick={() => setCollapsed(!collapsed)}
-              style={{ color: '#fff', flexShrink: 0 }}
+              style={{ color: siderTextColor, flexShrink: 0 }}
             />
           </div>
           <Menu
-            theme="dark"
+            theme={siderTheme}
             mode="inline"
             selectedKeys={[location.pathname]}
             items={menuItems}
@@ -116,47 +129,75 @@ export default function MainLayout({ onLogout }: { onLogout?: () => void }) {
             style={{ flex: 1, overflow: 'auto', marginTop: 8 }}
           />
           <div style={{
-            borderTop: '1px solid rgba(255,255,255,0.1)',
+            borderTop: isDark ? '1px solid rgba(255,255,255,0.1)' : '1px solid rgba(0,0,0,0.06)',
             padding: '12px',
             flexShrink: 0,
           }}>
-            <Space style={{ color: '#fff', width: '100%', marginBottom: collapsed ? 0 : 8 }}>
+            <Space style={{ color: siderTextColor, width: '100%', marginBottom: collapsed ? 0 : 8 }}>
               <Avatar icon={<UserOutlined />} size="small" />
               {!collapsed && (
                 <>
-                  <Text style={{ color: '#fff' }}>{user.username}</Text>
-                  <Text style={{ color: 'rgba(255,255,255,0.65)', fontSize: 12 }}>
+                  <Text style={{ color: siderTextColor }}>{user.username}</Text>
+                  <Text style={{ color: isDark ? 'rgba(255,255,255,0.65)' : 'rgba(0,0,0,0.45)', fontSize: 12 }}>
                     ({ROLE_LABELS[user.role] || user.role})
                   </Text>
                 </>
               )}
             </Space>
             {collapsed ? (
-              <Button
-                block
-                type="text"
-                size="small"
-                icon={<LogoutOutlined />}
-                onClick={handleLogout}
-                style={{ color: 'rgba(255,255,255,0.65)' }}
-              />
+              <Space direction="vertical" style={{ width: '100%' }}>
+                <Dropdown
+                  menu={{ items: THEME_OPTIONS.map(o => ({ key: o.key, label: o.label, icon: o.icon, onClick: () => setMode(o.key) })) }}
+                  trigger={['click']}
+                >
+                  <Button
+                    block
+                    type="text"
+                    size="small"
+                    icon={isDark ? <MoonOutlined /> : <SunOutlined />}
+                    style={{ color: isDark ? 'rgba(255,255,255,0.65)' : undefined }}
+                  />
+                </Dropdown>
+                <Button
+                  block
+                  type="text"
+                  size="small"
+                  icon={<LogoutOutlined />}
+                  onClick={handleLogout}
+                  style={{ color: isDark ? 'rgba(255,255,255,0.65)' : undefined }}
+                />
+              </Space>
             ) : (
-              <Button
-                block
-                type="text"
-                size="small"
-                icon={<LogoutOutlined />}
-                onClick={handleLogout}
-                style={{ color: 'rgba(255,255,255,0.65)', justifyContent: 'flex-start' }}
-              >
-                退出登录
-              </Button>
+              <Space style={{ width: '100%', justifyContent: 'space-between' }}>
+                <Dropdown
+                  menu={{ items: THEME_OPTIONS.map(o => ({ key: o.key, label: o.label, icon: o.icon, onClick: () => setMode(o.key) })) }}
+                  trigger={['click']}
+                >
+                  <Button
+                    type="text"
+                    size="small"
+                    icon={isDark ? <MoonOutlined /> : <SunOutlined />}
+                    style={{ color: isDark ? 'rgba(255,255,255,0.65)' : undefined }}
+                  >
+                    {THEME_OPTIONS.find(o => o.key === mode)?.label}
+                  </Button>
+                </Dropdown>
+                <Button
+                  type="text"
+                  size="small"
+                  icon={<LogoutOutlined />}
+                  onClick={handleLogout}
+                  style={{ color: isDark ? 'rgba(255,255,255,0.65)' : undefined }}
+                >
+                  退出
+                </Button>
+              </Space>
             )}
           </div>
         </div>
       </Sider>
       <Layout>
-        <Content style={{ margin: 16, padding: 24, background: '#fff', borderRadius: 8, overflow: 'auto' }}>
+        <Content style={{ margin: 16, padding: 24, borderRadius: 8, overflow: 'auto' }}>
           <Outlet />
         </Content>
       </Layout>