feat: 全站 PageShell 设计系统与专业 UI 统一

- 新增 PageShell/PageTabs/ContentPanel/PageLoading/PageEmpty 页面骨架
- index.css 设计令牌文档化，布局令牌与纯色主按钮（去除渐变粉彩）
- 全站路由页接入 PageShell，云账单三 Tab 为标杆
- 主题体系：跟随系统 + 主流/开发者分组，新增 Dracula/Tokyo Night，One Dark 暖灰差异化
- 登录页/侧栏/顶栏去渐变光球，企业克制风
- 修复 AIAlertAnalyzer JSX 与构建依赖导入问题

frontend/src/components/deploy/releaseManagerHelpers.tsx

@@ -13,22 +13,22 @@ import {
 
 // 环境配置（值与后端 oneof=dev test staging prod 一致） // Logan.Li
 export const ENVIRONMENTS: Record<string, { label: string; color: string }> = {
-  dev: { label: '开发环境', color: 'border-blue-500/30 text-blue-400 bg-blue-500/10' },
-  test: { label: '测试环境', color: 'border-cyan-500/30 text-cyan-400 bg-cyan-500/10' },
-  staging: { label: '预发环境', color: 'border-amber-500/30 text-amber-400 bg-amber-500/10' },
-  prod: { label: '生产环境', color: 'border-red-500/30 text-red-400 bg-red-500/10' },
+  dev: { label: '开发环境', color: 'border-blue-500/30 dg-text-blue bg-blue-500/10' },
+  test: { label: '测试环境', color: 'border-cyan-500/30 dg-text-cyan bg-cyan-500/10' },
+  staging: { label: '预发环境', color: 'border-amber-500/30 dg-text-yellow bg-amber-500/10' },
+  prod: { label: '生产环境', color: 'border-red-500/30 dg-text-red bg-red-500/10' },
 };
 
 // 发布状态徽章（审批流：待审批/已审批/已驳回/发布中/发布成功/发布失败/已回滚） // Logan.Li
 export function getStatusBadge( status: string) {
   const map: Record<string, { icon: any; label: string; cls: string }> = {
-    pending: { icon: Clock, label: '待审批', cls: 'border-amber-500/30 text-amber-400 bg-amber-500/10' },
-    approved: { icon: Check, label: '已审批', cls: 'border-purple-500/30 text-purple-400 bg-purple-500/10' },
-    rejected: { icon: XCircle, label: '已驳回', cls: 'border-slate-500/30 text-slate-400 bg-slate-500/10' },
-    deploying: { icon: Loader2, label: '发布中', cls: 'border-blue-500/30 text-blue-400 bg-blue-500/10 animate-pulse' },
-    success: { icon: CheckCircle, label: '发布成功', cls: 'border-emerald-500/30 text-emerald-400 bg-emerald-500/10' },
-    failed: { icon: XCircle, label: '发布失败', cls: 'border-red-500/30 text-red-400 bg-red-500/10' },
-    rolled_back: { icon: RotateCcw, label: '已回滚', cls: 'border-slate-500/30 text-slate-400 bg-slate-500/10' },
+    pending: { icon: Clock, label: '待审批', cls: 'border-amber-500/30 dg-text-yellow bg-amber-500/10' },
+    approved: { icon: Check, label: '已审批', cls: 'border-purple-500/30 dg-text-purple bg-purple-500/10' },
+    rejected: { icon: XCircle, label: '已驳回', cls: 'border-[var(--dg-border)] dg-text-secondary bg-[var(--dg-bg-active)]/10' },
+    deploying: { icon: Loader2, label: '发布中', cls: 'border-blue-500/30 dg-text-blue bg-blue-500/10 animate-pulse' },
+    success: { icon: CheckCircle, label: '发布成功', cls: 'border-emerald-500/30 dg-text-green bg-emerald-500/10' },
+    failed: { icon: XCircle, label: '发布失败', cls: 'border-red-500/30 dg-text-red bg-red-500/10' },
+    rolled_back: { icon: RotateCcw, label: '已回滚', cls: 'border-[var(--dg-border)] dg-text-secondary bg-[var(--dg-bg-active)]/10' },
   };
   const cfg = map[status];
   if (!cfg) return null;
@@ -45,7 +45,7 @@ export function getStatusBadge( status: string) {
 export function getEnvironmentBadge( env: string) {
   const cfg = ENVIRONMENTS[env];
   return (
-    <Badge variant="outline" className={cfg?.color || 'border-slate-500/30 text-slate-400'}>
+    <Badge variant="outline" className={cfg?.color || 'border-[var(--dg-border)] dg-text-secondary'}>
       {cfg?.label || env}
     </Badge>
   );