style: 全局 UI 主题皮肤重构与样式模块化

引入 Element Plus 主题定制和主题皮肤 composable，将全局
样式拆分为组件级独立 CSS 文件（侧边栏、顶栏、工作台等），
统一色彩变量和间距规范，重构所有视图和组件样式以适配新
主题系统，优化图表和知识图谱组件视觉表现，提取审计和差
旅报销相关子组件。

web/src/components/charts/BudgetTrendChart.vue

@@ -16,6 +16,7 @@ import {
   Tooltip
 } from 'chart.js'
 import { useAnimationProgress } from '../../composables/useAnimationProgress.js'
+import { useThemeColors } from '../../composables/useThemeColors.js'
 
 ChartJS.register(CategoryScale, LinearScale, BarElement, Tooltip, Legend)
 
@@ -34,6 +35,7 @@ const progress = useAnimationProgress([
   () => props.occupied,
   () => props.available
 ], 1000)
+const themeColors = useThemeColors()
 
 const currency = (value) =>
   Number(value || 0).toLocaleString('zh-CN', {
@@ -77,7 +79,7 @@ const chartData = computed(() => ({
     {
       label: '已使用',
       data: scaleSeries(usedPercent.value),
-      backgroundColor: '#13a66b',
+      backgroundColor: themeColors.value.chartPrimary,
       borderRadius: 5,
       borderSkipped: false,
       stack: 'budgetUsage',
@@ -86,7 +88,7 @@ const chartData = computed(() => ({
     {
       label: '已占用',
       data: scaleSeries(occupiedPercent.value),
-      backgroundColor: '#f59e0b',
+      backgroundColor: themeColors.value.warning,
       borderRadius: 5,
       borderSkipped: false,
       stack: 'budgetUsage',