fix: 统一主题色彩系统，优化底部导航栏间距

- 新建 theme.css 定义 CSS 变量，统一亮色/暗色主题色彩
- 新建 layout.css 优化底部导航栏布局
- 在 App.vue 中添加 Vant UI 主题变量映射
- 修复底部导航栏与屏幕底部间距过大问题
- 添加安全区域（safe-area-inset）处理

Web/src/App.vue

@@ -1,6 +1,7 @@
 <template>
   <van-config-provider
     :theme="theme"
+    :theme-vars="themeVars"
     class="app-provider"
   >
     <div class="app-root">
@@ -153,6 +154,23 @@ const showTabbar = computed(() => {
 const active = ref('')
 const theme = ref('light')
 
+// Vant UI 主题变量映射
+const themeVars = computed(() => {
+  const vars = {
+    navBarBackground: 'var(--bg-primary)',
+    navBarTextColor: 'var(--text-primary)',
+    cardBackground: 'var(--bg-secondary)',
+    cellBackground: 'var(--bg-secondary)',
+    background: 'var(--bg-primary)',
+    background2: 'var(--bg-secondary)',
+    textColor: 'var(--text-primary)',
+    textColor2: 'var(--text-secondary)',
+    borderColor: 'var(--bg-tertiary)',
+    tabbarBackground: 'var(--bg-primary)'
+  }
+  return vars
+})
+
 // 检测系统深色模式
 const updateTheme = () => {
   const isDark = window.matchMedia('(prefers-color-scheme: dark)').matches
@@ -257,12 +275,19 @@ const handleAddTransactionSuccess = () => {
   height: auto !important;
   min-height: 50px !important;
   box-sizing: content-box !important;
+  background: var(--bg-primary) !important;
+  border-top: 1px solid var(--bg-tertiary);
 }
 
 /* 确保 TabBar 项目居中 */
 :deep(.van-tabbar-item) {
   padding: 0 !important;
   height: 50px !important;
+  color: var(--text-secondary);
+}
+
+:deep(.van-tabbar-item--active) {
+  color: var(--color-primary);
 }
 
 .debug-overlay {