feat(ui): CMA前端UI优化P0 - BSC变量+公共类+统一标题+色值替换+内联style替换

frontend/src/style.css

@@ -77,6 +77,12 @@ html, body, #app {
   --bh-breakpoint-md: 992px;
   --bh-breakpoint-lg: 1200px;
   --bh-breakpoint-xl: 1920px;
+
+  /* BSC四层泳道标准色 */
+  --bsc-finance: #F56C6C;
+  --bsc-customer: #409EFF;
+  --bsc-process: #67C23A;
+  --bsc-learning: #E6A23C;
 }
 
 /* 暗黑模式覆盖 — 只影响内容区，侧边栏保持不变 */
@@ -343,6 +349,22 @@ html.dark .el-drawer__header {
   --el-dialog-margin-top: 1vh !important;
 }
 
+/* === 页面标准间距与公共布局类 === */
+.page-view { padding: 16px; }
+.page-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; flex-wrap:wrap; gap:8px; }
+.page-title { font-size:18px; font-weight:600; margin:0; }
+.page-title h3 { margin:0; }
+
+/* 卡片统计数字 */
+.stat-number { font-size:24px; font-weight:600; }
+.stat-label { font-size:12px; color:#909399; margin-top:4px; }
+
+/* 通用flex布局 */
+.flex-row { display:flex; align-items:center; gap:8px; }
+.flex-wrap { flex-wrap:wrap; }
+.flex-between { display:flex; justify-content:space-between; align-items:center; }
+.section-gap { margin-bottom:16px; }
+
 /* 过渡动画 — 明暗切换平滑过渡 */
 html.dark,
 html,