优化预算管理页面布局，调整导航栏和内容区域，增加底部安全距离

Web/src/views/BudgetView.vue

@@ -1,13 +1,14 @@
 <template>
-  <div class="page-container">
-    <van-nav-bar title="预算管理" placeholder fixed z-index="100">
+  <div class="page-container-flex">
+    <van-nav-bar title="预算管理" placeholder safe-area-inset-top>
       <template #right>
         <van-icon name="plus" size="20" @click="showAddPopup = true" />
       </template>
     </van-nav-bar>
 
+    <div class="scroll-content">
       <div class="page-content">
-      <van-tabs v-model:active="activeTab" sticky offset-top="46" type="card">
+        <van-tabs v-model:active="activeTab" sticky offset-top="0" type="card">
         <van-tab title="支出" :name="BudgetCategory.Expense">
           <div class="summary-card common-card">
             <div class="summary-item">
@@ -293,6 +294,9 @@
         </van-tab>
       </van-tabs>
     </div>
+    <!-- 底部安全距离 -->
+    <div style="height: calc(50px + env(safe-area-inset-bottom, 0px))"></div>
+  </div>
 
     <!-- 添加预算弹窗 -->
     <PopupContainer v-model="showAddPopup" title="新增预算" height="70%">