fix(web): fix PaletteOutlined icon import and apply theme config

- Replace non-existent PaletteOutlined with BgColorsOutlined
- Apply user's refined light/dark theme configuration with proper
  color tokens, component overrides, and design system consistency

apps/web/src/App.tsx

@@ -19,20 +19,100 @@ function PrivateRoute({ children }: { children: React.ReactNode }) {
   return isAuthenticated ? <>{children}</> : <Navigate to="/login" replace />;
 }
 
+const themeConfig = {
+  token: {
+    colorPrimary: '#4F46E5',
+    colorSuccess: '#059669',
+    colorWarning: '#D97706',
+    colorError: '#DC2626',
+    colorInfo: '#2563EB',
+    colorBgLayout: '#F1F5F9',
+    colorBgContainer: '#FFFFFF',
+    colorBgElevated: '#FFFFFF',
+    colorBorder: '#E2E8F0',
+    colorBorderSecondary: '#F1F5F9',
+    borderRadius: 8,
+    borderRadiusLG: 12,
+    borderRadiusSM: 6,
+    fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'PingFang SC', 'Microsoft YaHei', 'Hiragino Sans GB', 'Helvetica Neue', Helvetica, Arial, sans-serif",
+    fontSize: 14,
+    fontSizeHeading4: 20,
+    controlHeight: 36,
+    controlHeightLG: 40,
+    controlHeightSM: 28,
+    boxShadow: '0 1px 3px 0 rgba(0, 0, 0, 0.06), 0 1px 2px -1px rgba(0, 0, 0, 0.06)',
+    boxShadowSecondary: '0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.07)',
+  },
+  components: {
+    Button: {
+      primaryShadow: '0 1px 2px 0 rgba(79, 70, 229, 0.3)',
+      fontWeight: 500,
+    },
+    Card: {
+      paddingLG: 20,
+    },
+    Table: {
+      headerBg: '#F8FAFC',
+      headerColor: '#475569',
+      rowHoverBg: '#F5F3FF',
+      fontSize: 14,
+    },
+    Menu: {
+      itemBorderRadius: 8,
+      itemMarginInline: 8,
+      itemHeight: 40,
+    },
+    Modal: {
+      borderRadiusLG: 16,
+    },
+    Tag: {
+      borderRadiusSM: 6,
+    },
+  },
+};
+
+const darkThemeConfig = {
+  ...themeConfig,
+  token: {
+    ...themeConfig.token,
+    colorBgLayout: '#0B0F1A',
+    colorBgContainer: '#111827',
+    colorBgElevated: '#1E293B',
+    colorBorder: '#1E293B',
+    colorBorderSecondary: '#1E293B',
+    boxShadow: '0 1px 3px 0 rgba(0, 0, 0, 0.3)',
+    boxShadowSecondary: '0 4px 6px -1px rgba(0, 0, 0, 0.4)',
+  },
+  components: {
+    ...themeConfig.components,
+    Table: {
+      headerBg: '#1E293B',
+      headerColor: '#94A3B8',
+      rowHoverBg: '#1E293B',
+    },
+  },
+};
+
 export default function App() {
   const loadFromStorage = useAuthStore((s) => s.loadFromStorage);
-  const theme = useAppStore((s) => s.theme);
+  const themeMode = useAppStore((s) => s.theme);
 
-  // Restore auth state from localStorage on app load
   useEffect(() => {
     loadFromStorage();
   }, [loadFromStorage]);
 
+  useEffect(() => {
+    document.documentElement.setAttribute('data-theme', themeMode);
+  }, [themeMode]);
+
+  const isDark = themeMode === 'dark';
+
   return (
     <ConfigProvider
       locale={zhCN}
       theme={{
-        algorithm: theme === 'dark' ? antdTheme.darkAlgorithm : antdTheme.defaultAlgorithm,
+        ...isDark ? darkThemeConfig : themeConfig,
+        algorithm: isDark ? antdTheme.darkAlgorithm : antdTheme.defaultAlgorithm,
       }}
     >
       <HashRouter>