diff --git a/src/components/workspace/CashManagement.vue b/src/components/workspace/CashManagement.vue
index 10e9d2c..5c401af 100644
--- a/src/components/workspace/CashManagement.vue
+++ b/src/components/workspace/CashManagement.vue
@@ -17,9 +17,9 @@
             <el-icon
                 class="service-icon"
                 style="
-                margin-left: 5px;
+                margin-left: .2604vw;
                 cursor: pointer;
-                font-size: 16px;
+                font-size: .8333vw;
                 transition: all 0.3s ease;">
               <Warning/>
             </el-icon>
@@ -270,12 +270,12 @@ onMounted( async() => {
 <style scoped>
 /* 保留你原来的样式 */
 .cash-management {
-  margin: 10px 5px;
+  margin: .5208vw .2604vw;
   width: 100%;
-  height: 550px;
-  border-radius: 8px;
+  height: 28.6458vw;
+  border-radius: .4167vw;
   background: #E7F4FD;
-  box-shadow: 0 2px 2px 0 #00000040;
+  box-shadow: 0 .1042vw .1042vw 0 #00000040;
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -285,9 +285,9 @@ onMounted( async() => {
   width: 100%;
   height: 5vh;
   flex-shrink: 0;
-  border-radius: 8px;
+  border-radius: .4167vw;
   background: linear-gradient(90deg, #E4F0FC 0%, #C6ADFF 50%, #E4F0FC 100%);
-  box-shadow: 0 2px 2px 0 #00152940;
+  box-shadow: 0 .1042vw .1042vw 0 #00152940;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -296,25 +296,25 @@ onMounted( async() => {
 .text1 {
   color: #040a2d;
   font-family: "PingFang SC";
-  font-size: 28px;
+  font-size: 1.4583vw;
   font-weight: 900;
 }
 
 
 .text1-update-time {
-  margin-left: 10px;
+  margin-left: .5208vw;
   color: #040a2d;
-  font-size: 20px;
+  font-size: 1.0417vw;
   font-weight: 700;
 }
 
 .text2 {
-  margin: 13px;
+  margin: .6771vw;
   width: 95%;
   height: 10vh;
-  border-radius: 8px;
+  border-radius: .4167vw;
   background: linear-gradient(90deg, #E4F0FC 0%, #C1DCF8 50%, #E4F0FC 100%);
-  box-shadow: 0 2px 2px 0 #00152940;
+  box-shadow: 0 .1042vw .1042vw 0 #00152940;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -322,7 +322,7 @@ onMounted( async() => {
 
 .text2-income {
   color: #040a2d;
-  font-size: 40px;
+  font-size: 2.0833vw;
   font-weight: 900;
 }
 
@@ -331,17 +331,17 @@ onMounted( async() => {
   align-items: center;
   width: 100%;
   height: 100%;
-  padding: 10px;
+  padding: .5208vw;
 }
 
 .market-data {
   display: flex;
-  width: 265px;
+  width: 13.8021vw;
   flex-direction: column;
   align-items: flex-start;
-  gap: 20px;
-  padding: 10px;
-  margin-left: 20px;
+  gap: 1.0417vw;
+  padding: .5208vw;
+  margin-left: 1.0417vw;
 }
 
 .market-item {
@@ -349,18 +349,18 @@ onMounted( async() => {
   justify-content: space-between;
   width: 100%;
   font-family: "PingFang SC";
-  font-size: 16px;
+  font-size: .8333vw;
   color: #040a2d;
   white-space: nowrap; /* 禁止换行 */
   overflow: hidden; /* 隐藏溢出内容 */
   text-overflow: ellipsis; /* 溢出显示省略号 */
-  margin-bottom: 8px; /* 增加项间距，提升可读性 */
+  margin-bottom: .4167vw; /* 增加项间距，提升可读性 */
   cursor: pointer;
 }
 
 .market-name {
   flex: 0 0 auto; /* 名称部分自适应宽度 */
-  margin-right: 16px; /* 与金额保持距离 */
+  margin-right: .8333vw; /* 与金额保持距离 */
 }
 
 .market-value {
@@ -370,9 +370,9 @@ onMounted( async() => {
 
 .chart {
   flex: 1;
-  height: 300px;
+  height: 15.625vw;
   width: auto;
-  margin-top: 10px;
+  margin-top: .5208vw;
 }
 
 </style>
diff --git a/src/components/workspace/GoldManagement.vue b/src/components/workspace/GoldManagement.vue
index 140ecf8..1670cac 100644
--- a/src/components/workspace/GoldManagement.vue
+++ b/src/components/workspace/GoldManagement.vue
@@ -20,13 +20,13 @@
               }}</span>&nbsp;&nbsp;&nbsp;&nbsp;{{ t('workbench.compareToPreviousDay') }}
             {{ dailyChange / 100 }}&nbsp;
             <template v-if="dailyChange > 0">
-              <el-image :src="upArrow" style="width: 14px;"/>
+              <el-image :src="upArrow" style="width: .7292vw;"/>
             </template>
             <template v-else-if="dailyChange < 0">
-              <el-image :src="downArrow" style="width: 14px;"/>
+              <el-image :src="downArrow" style="width: .7292vw;"/>
             </template>
             <template v-else>
-              <el-image :src="pingArrow" style="width: 14px; padding-top: 12px"/>
+              <el-image :src="pingArrow" style="width: .7292vw; padding-top: .625vw"/>
             </template>
           </div>
           <div>
@@ -50,8 +50,8 @@
               </el-col>
               <!-- 右边图表 -->
               <el-col :span="12">
-                <!--                <div ref="goldTypeChart" style="width: 100%; height: 100px;"></div>-->
-                <div style="width: 100%; height: 60px;">&nbsp;</div>
+                <!--                <div ref="goldTypeChart" style="width: 100%; height: 5.2083vw;"></div>-->
+                <div style="width: 100%; height: 3.125vw;">&nbsp;</div>
                 <div class="margin-bottom">
                   [{{ t('workbench.goldExpireIn12Months')}}{{ currentFreeDecember / 100 }}]
                 </div>
@@ -68,12 +68,12 @@
           <el-row>
             <el-col :span="12">
               <div class="center-card">{{ t('workbench.convertedSGDCumulativeAmount') }}</div>
-              <el-image :src="svg1" style="width: 88px; display: block;margin: 0 auto;"/>
+              <el-image :src="svg1" style="width: 4.5833vw; display: block;margin: 0 auto;"/>
               <div class="center-card">{{ yearlyMoney / 100 }}{{ t('workbench.SGD') }}</div>
             </el-col>
-            <el-col :span="12" style="border-left: 2px solid #CFE6FE; height: 160px">
+            <el-col :span="12" style="border-left: .1042vw solid #CFE6FE; height: 8.3333vw">
               <div class="center-card" style="white-space: nowrap;">{{ t('workbench.yesterdayNew')}}{{ recharge / 100 }}</div>
-              <div ref="rechargeGoldChart" style="width: 88px; height: 88px; display: block;margin: 0 auto;"></div>
+              <div ref="rechargeGoldChart" style="width: 4.5833vw; height: 4.5833vw; display: block;margin: 0 auto;"></div>
               <div class="center-card" style="white-space: nowrap;">{{ t('workbench.wherePermanentGold')}}{{ money / 100 }}</div>
             </el-col>
           </el-row>
@@ -87,7 +87,7 @@
         <!-- 第三个卡片 -->
         <div class="card-item">
           <div class="card-title">{{ t('workbench.annualCumulativeConsume')}}{{ yearlyReduce / 100 }}</div>
-          <el-row style="height: 200px;">
+          <el-row style="height: 10.4167vw;">
             <el-col :span="12">
               <div ref="consumeChart" style="width:100%; height: 88%;"></div>
             </el-col>
@@ -101,21 +101,21 @@
         <!-- 第四个卡片 -->
         <div class="card-item" >
           <div class="card-title">{{ t('workbench.annualCumulativeRechargePeople')}}{{ yearlyRechargeNum }}</div>
-          <el-row style="height: 200px;">
-            <el-col :span="12" style="border-right: 2px solid #CFE6FE; height: 200px">
+          <el-row style="height: 10.4167vw;">
+            <el-col :span="12" style="border-right: .1042vw solid #CFE6FE; height: 10.4167vw">
               <div class="chart5">
-                <el-image :src="svg2" style="width: 88px; display: block;margin: 0 auto;"/>
+                <el-image :src="svg2" style="width: 4.5833vw; display: block;margin: 0 auto;"/>
                 <div class="margin-bottom">
-                  <div style="display: flex; gap: 10px; font-size: 16px;">{{ t('workbench.weekYearOnYear')}}{{ sumWow }}%
-                    <el-image v-if="sumWow > 0" :src="upArrow" style="width: 10px;"/>
-                    <el-image v-else-if="sumWow < 0" :src="downArrow" style="width: 10px;"/>
-                    <el-image v-else :src="pingArrow" style="width: 10px;"/>
+                  <div style="display: flex; gap: .5208vw; font-size: .8333vw;">{{ t('workbench.weekYearOnYear')}}{{ sumWow }}%
+                    <el-image v-if="sumWow > 0" :src="upArrow" style="width: .5208vw;"/>
+                    <el-image v-else-if="sumWow < 0" :src="downArrow" style="width: .5208vw;"/>
+                    <el-image v-else :src="pingArrow" style="width: .5208vw;"/>
                   </div>
-                  <div style="display: flex; gap: 10px; font-size: 16px;">
+                  <div style="display: flex; gap: .5208vw; font-size: .8333vw;">
                     {{ t('workbench.dayYearOnYear')}}{{ sumDaily }}%
-                    <el-image v-if="sumDaily > 0" :src="upArrow" style="width: 10px;"/>
-                    <el-image v-else-if="sumDaily < 0" :src="downArrow" style="width: 10px;"/>
-                    <el-image v-else :src="pingArrow" style="width: 10px; "/>
+                    <el-image v-if="sumDaily > 0" :src="upArrow" style="width: .5208vw;"/>
+                    <el-image v-else-if="sumDaily < 0" :src="downArrow" style="width: .5208vw;"/>
+                    <el-image v-else :src="pingArrow" style="width: .5208vw; "/>
                   </div>
                 </div>
 
@@ -570,46 +570,46 @@ onMounted(async () => {
 }
 
 .card-item-row1 {
-  height: 200px;
+  height: 10.4167vw;
   width: auto;
   background: #E4F0FC;
-  box-shadow: 0 0 4px 0 #00000040;
-  border-radius: 10px;
-  margin-top: 20px;
-  margin-left: 5px;
-  margin-right: 5px;
-  margin-bottom: -5px;
-  padding-bottom: 10px;
+  box-shadow: 0 0 .2083vw 0 #00000040;
+  border-radius: .5208vw;
+  margin-top: 1.0417vw;
+  margin-left: .2604vw;
+  margin-right: .2604vw;
+  margin-bottom: -0.2604vw;
+  padding-bottom: .5208vw;
 }
 
 
 .card-item {
-  height: 240px;
+  height: 12.5vw;
   width: auto;
   background: #E4F0FC;
-  box-shadow: 0 0 4px 0 #00000040;
-  border-radius: 10px;
-  margin-top: 20px;
-  margin-left: 5px;
-  margin-right: 5px;
-  margin-bottom: -5px;
-  padding-bottom: 10px;
+  box-shadow: 0 0 .2083vw 0 #00000040;
+  border-radius: .5208vw;
+  margin-top: 1.0417vw;
+  margin-left: .2604vw;
+  margin-right: .2604vw;
+  margin-bottom: -0.2604vw;
+  padding-bottom: .5208vw;
 }
 
 .card-title {
   font-weight: bold;
-  height: 36px;
-  font-size: 17px;
+  height: 1.875vw;
+  font-size: .8854vw;
   width: 100%;
   flex-shrink: 0;
-  border-radius: 8px;
+  border-radius: .4167vw;
   background: linear-gradient(90deg, #E4F0FC 0%, #C1DCF8 50%, #E4F0FC 100%);
-  box-shadow: 0 0 2px 0 #00152940;
+  box-shadow: 0 0 .1042vw 0 #00152940;
   display: flex;
   align-items: center;
   justify-content: center;
-  margin-top: -5px;
-  margin-bottom: 10px;
+  margin-top: -0.2604vw;
+  margin-bottom: .5208vw;
 }
 
 .card-item .el-col {
@@ -631,9 +631,9 @@ onMounted(async () => {
   width: 100%;
   height: 5vh;
   flex-shrink: 0;
-  border-radius: 8px;
+  border-radius: .4167vw;
   background: linear-gradient(90deg, #E4F0FC 0%, #FFF178 50%, #E4F0FC 100%);
-  box-shadow: 0 2px 2px 0 #00152940;
+  box-shadow: 0 .1042vw .1042vw 0 #00152940;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -642,47 +642,47 @@ onMounted(async () => {
 .text1 {
   color: #040a2d;
   font-family: " PingFang SC ";
-  font-size: 28px;
+  font-size: 1.4583vw;
   font-style: normal;
   font-weight: 900;
-  line-height: 31.79px;
+  line-height: 1.6557vw;
 }
 
 .text1-update-time {
   width: 100%;
-  height: 26px;
+  height: 1.3542vw;
   flex-shrink: 0;
   color: #040a2d;
   font-family: "PingFang SC";
-  font-size: 20px;
+  font-size: 1.0417vw;
   font-style: normal;
   font-weight: 700;
-  line-height: 31.79px;
+  line-height: 1.6557vw;
 }
 
 /* 背景卡片大小 */
 .gold-management {
-  margin: 10px 5px;
+  margin: .5208vw .2604vw;
   width: 100%;
-  height: 550px;
+  height: 28.6458vw;
   flex-shrink: 0;
-  border-radius: 8px;
+  border-radius: .4167vw;
   background: #E7F4FD;
-  box-shadow: 0 2px 2px 0 #00000040;
+  box-shadow: 0 .1042vw .1042vw 0 #00000040;
   flex-direction: column;
   align-items: center;
 }
 
 .margin-bottom {
-  padding-left: 20px;
+  padding-left: 1.0417vw;
 }
 
 .chart5 {
-  margin-top: 15px;
+  margin-top: .7813vw;
 
   .margin-bottom {
-    margin-top: 10px;
-    padding-left: 20px;
+    margin-top: .5208vw;
+    padding-left: 1.0417vw;
   }
 }
 </style>
\ No newline at end of file