diff --git a/src/api/worldCup.js b/src/api/worldCup.js
index 62c53a3..f309efa 100644
--- a/src/api/worldCup.js
+++ b/src/api/worldCup.js
@@ -21,7 +21,10 @@ export const apiPostWorldCupMatchList = async (data) => {
 // 提交世界杯比赛押注：betOption 为 1 主胜、2 平局、3 客胜。
 export const apiPostWorldCupBet = async (data) => {
   try {
-    const response = await post(`${WORLD_CUP_API_PREFIX}/bet`, data)
+    const response = await post(`${WORLD_CUP_API_PREFIX}/bet`, {
+      ...data,
+      matchId: data?.matchId == null ? '' : String(data.matchId),
+    })
     return response
   } catch (error) {
     logWorldCupApiError('Failed to submit world cup bet:', error)
@@ -32,7 +35,10 @@ export const apiPostWorldCupBet = async (data) => {
 // 获取我的世界杯竞猜记录：matchId 为空时查询全部比赛记录。
 export const apiPostWorldCupMyBetList = async (data) => {
   try {
-    const response = await post(`${WORLD_CUP_API_PREFIX}/my/bet/list`, data)
+    const response = await post(`${WORLD_CUP_API_PREFIX}/my/bet/list`, {
+      ...data,
+      matchId: data?.matchId == null || data.matchId === '' ? data?.matchId : String(data.matchId),
+    })
     return response
   } catch (error) {
     logWorldCupApiError('Failed to get world cup my bet list:', error)
diff --git a/src/views/Activities/WorldCup/EventDetail/index.vue b/src/views/Activities/WorldCup/EventDetail/index.vue
index e311337..89744c2 100644
--- a/src/views/Activities/WorldCup/EventDetail/index.vue
+++ b/src/views/Activities/WorldCup/EventDetail/index.vue
@@ -71,7 +71,7 @@
       >
         <!-- 赛事结果模块：按未开始、进行中、已结束中奖、已结束未中奖/未参与展示不同状态 -->
         <itemCenter
-          style="position: relative; width: 100%; min-height: 53vw"
+          style="position: relative; width: 100%; min-height: 53vw; max-height: 54vw"
           :imgUrl="pngUrl(resultStatusConfig.image)"
           contentStyle=" padding: 9vw 5vw 2vw 5vw; box-sizing: border-box; display: flex; flex-direction: column; align-items: stretch; justify-content: space-between; gap: 0vw;"
         >
@@ -784,7 +784,7 @@ const connectToAppHandler = async () => {
 const submitWorldCupBet = async (betOption, betAmount) => {
   if (!matchId.value) return
   return apiPostWorldCupBet({
-    matchId: Number(matchId.value),
+    matchId: String(matchId.value),
     betOption,
     betAmount,
   })
diff --git a/src/views/Activities/WorldCup/EventDetail/页面创建信息.md b/src/views/Activities/WorldCup/EventDetail/页面创建信息.md
index 0871531..bfd230f 100644
--- a/src/views/Activities/WorldCup/EventDetail/页面创建信息.md
+++ b/src/views/Activities/WorldCup/EventDetail/页面创建信息.md
@@ -21,6 +21,7 @@
 - 路由 name：`world-cup-event-detail`
 - 进入来源：WorldCup 首页赛事列表项下方的 `TOTAL PRIZE POOL` 模块。
 - Query 参数：`matchId`，来自比赛列表接口返回的 `matchId`。
+- `matchId` 必须按字符串处理和传参，禁止使用 `Number(matchId)`；比赛 ID 可能超过 JS 安全整数范围，转数字会丢失精度。
 
 ## 2. 业务规则
 
@@ -42,7 +43,7 @@
 - 第一模块为赛事结果模块，使用 `itemCenter` 组件承载不同状态背景图。
 - 第二模块为押注模块，负责展示押注对象、押注状态和未开赛时的押注金额入口。
 - 第三模块为押注记录模块，负责展示当前赛事内用户押注对象、金额和押注时间。
-- 本页 `itemCenter` 的 `min-height` 按 `Math.ceil(实际展示宽度vw * 图片高度 / 图片宽度)` 计算；赛事结果模块在主内容区左右 `2vw` padding 后实际宽度为 `96vw`，`statusNotStarted` / `statusInProgress` / `statusEndedWin` / `statusEndedfail` 图片比例一致，计算后设置 `min-height: 53vw`。
+- 本页 `itemCenter` 的 `min-height` 按 `Math.ceil(实际展示宽度vw * 图片高度 / 图片宽度)` 计算；赛事结果模块在主内容区左右 `2vw` padding 后实际宽度为 `96vw`，`statusNotStarted` / `statusInProgress` / `statusEndedWin` / `statusEndedfail` 图片比例一致，计算后设置 `min-height: 53vw; max-height: 54vw`，避免图片加载出来之前容器高度异常撑高。
 
 ## 4. 赛事结果模块
 
@@ -68,7 +69,7 @@
 - 已开始或已结束赛事中，押注对象不可点击，选中态用于展示用户已押注过的选项。
 - 已结束赛事中，根据接口 `result` 字段判断胜方或平局结果，`1` 主胜、`2` 平局、`3` 客胜，并在对应押注项图片容器内叠加 `frameWinner`；该用法和首页 `Ended` 列表项保持一致。
 - 押注金额模块只在未开始赛事展示，金额选项为 `100`、`1000`、`10000`、`100000`，每个金额左侧展示 coin 图片。
-- 押注流程为：先选择押注对象，再点击押注金额；点击金额时调用 `apiPostWorldCupBet({ matchId, betOption, betAmount })`。
+- 押注流程为：先选择押注对象，再点击押注金额；点击金额时调用 `apiPostWorldCupBet({ matchId: String(matchId), betOption, betAmount })`。
 - 押注成功后清空当前选中押注对象，并重新拉取 `apiGetWorldCupMatchDetail` 和 `apiPostWorldCupMyBetList` 刷新页面状态。
 
 ## 6. 押注记录模块
diff --git a/src/views/Activities/WorldCup/components/topUser.vue b/src/views/Activities/WorldCup/components/topUser.vue
index 93dcc38..542f701 100644
--- a/src/views/Activities/WorldCup/components/topUser.vue
+++ b/src/views/Activities/WorldCup/components/topUser.vue
@@ -66,7 +66,7 @@
       <itemCenter
         :imgUrl="charmLevelUrl"
         class="level-badge"
-        style="width: 30%; min-height: 4vw"
+        style="width: 30%; min-height: 4vw; max-height: 5vw"
         contentStyle="padding: 0 0 0 42%; align-items: center; justify-content: center; box-sizing: border-box;"
       >
         <span>{{ charmLevel || 0 }}</span>
@@ -74,7 +74,7 @@
       <itemCenter
         :imgUrl="wealthLevelUrl"
         class="level-badge"
-        style="width: 30%; min-height: 4vw"
+        style="width: 30%; min-height: 4vw; max-height: 5vw"
         contentStyle="padding: 0 0 0 36%; align-items: center; justify-content: center; box-sizing: border-box;"
       >
         <span>{{ wealthLevel || 0 }}</span>
diff --git a/src/views/Activities/WorldCup/index.vue b/src/views/Activities/WorldCup/index.vue
index 3611460..5cae33e 100644
--- a/src/views/Activities/WorldCup/index.vue
+++ b/src/views/Activities/WorldCup/index.vue
@@ -61,7 +61,7 @@
 
       <!-- 头部模块：使用 bg 大图承载，内部放置右侧规则按钮 -->
       <itemCenter
-        style="width: 100vw; min-height: 151vw"
+        style="width: 100vw; min-height: 151vw; max-height: 152vw"
         :imgUrl="pngUrl('bg')"
         contentStyle="padding: 87vw 0 0; align-items: flex-start; justify-content: flex-start; box-sizing: border-box;"
       >
@@ -87,7 +87,7 @@
 
           <!-- 排行榜主图区：RankingMain 内展示前三名头像框 -->
           <itemCenter
-            style="width: 100vw; min-height: 92vw"
+            style="width: 100vw; min-height: 92vw; max-height: 93vw"
             :imgUrl="pngUrl('RankingMain')"
             contentStyle="direction: ltr; padding: 0; flex-direction: column; align-items: center; justify-content: space-between; box-sizing: border-box;"
           >
@@ -212,7 +212,7 @@
             <itemCenter
               v-for="(rankingItem, index) in rankingListAfterTop3"
               :key="rankingItem.userId || index"
-              style="width: 100vw; min-height: 23vw; margin-top: -2vw"
+              style="width: 100vw; min-height: 23vw; max-height: 24vw; margin-top: -2vw"
               :imgUrl="pngUrl('RankingItem')"
               contentStyle="padding: 3vw 8vw 0; box-sizing: border-box; justify-content: space-between;"
               @click="handleRankingClick(rankingItem)"
@@ -261,7 +261,7 @@
                     />
                     <itemCenter
                       :imgUrl="pngUrl(getLevelBgImageName('userLevel', rankingItem.charmLevel))"
-                      style="width: 12vw; min-height: 7vw"
+                      style="width: 12vw; min-height: 7vw; max-height: 8vw"
                       contentStyle="direction: ltr;padding: 0 0 0 42%; align-items: center; justify-content: center; box-sizing: border-box;"
                     >
                       <span style="color: #fff; font-size: 1em; font-weight: 700; line-height: 1">
@@ -270,7 +270,7 @@
                     </itemCenter>
                     <itemCenter
                       :imgUrl="pngUrl(getLevelBgImageName('wealthLevel', rankingItem.wealthLevel))"
-                      style="width: 12vw; min-height: 6vw"
+                      style="width: 12vw; min-height: 6vw; max-height: 7vw"
                       contentStyle="direction: ltr;padding: 0 0 0 36%; align-items: center; justify-content: center; box-sizing: border-box;"
                     >
                       <span style="color: #fff; font-size: 1em; font-weight: 700; line-height: 1">
@@ -350,7 +350,7 @@
       <section style="width: 100vw">
         <!-- 赛事列表背景容器：使用 EventlistBg 承载切换按钮和比赛列表 -->
         <itemCenter
-          style="width: 100vw; min-height: 244vw"
+          style="width: 100vw; min-height: 244vw; max-height: 245vw"
           :imgUrl="pngUrl('EventlistBg')"
           contentStyle="display: flex; flex-direction: column; justify-content: flex-start; align-items: center; gap: 2vw; padding: 18vw 8vw 12vw; box-sizing: border-box;"
         >
@@ -409,7 +409,7 @@
                   "
                 >
                   <itemCenter
-                    style="width: 100%; min-height: 52vw"
+                    style="width: 100%; min-height: 52vw; max-height: 53vw"
                     :imgUrl="pngUrl('matchBg')"
                     contentStyle="width: 100%; height: 100%; padding: 0; box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between; align-items: center;"
                   >
@@ -914,7 +914,7 @@
     <!-- 我的排名贴底模块：固定在视口底部，展示当前用户排名信息 -->
     <itemCenter
       v-if="!isLoading"
-      style="position: fixed; left: 0; bottom: 0; z-index: 10; width: 100vw; min-height: 21vw"
+      style="position: fixed; left: 0; bottom: 0; z-index: 10; width: 100vw; min-height: 21vw; max-height: 22vw"
       :imgUrl="pngUrl('myRankingBg')"
       contentStyle="padding: 2vw 8vw; box-sizing: border-box; justify-content: space-between;"
     >
@@ -959,7 +959,7 @@
             />
             <itemCenter
               :imgUrl="pngUrl(getLevelBgImageName('userLevel', myRanking.charmLevel))"
-              style="width: 12vw; min-height: 7vw; margin: 0; padding: 0"
+              style="width: 12vw; min-height: 7vw; max-height: 8vw; margin: 0; padding: 0"
               contentStyle="padding: 0 0 0 5vw; align-items: center; justify-content: center;"
             >
               <div style="color: #fff; font-size: 1em; font-weight: 700; line-height: 1">
@@ -968,7 +968,7 @@
             </itemCenter>
             <itemCenter
               :imgUrl="pngUrl(getLevelBgImageName('wealthLevel', myRanking.wealthLevel))"
-              style="width: 12vw; min-height: 6vw; margin: 0; padding: 0"
+              style="width: 12vw; min-height: 6vw; max-height: 7vw; margin: 0; padding: 0"
               contentStyle="padding: 0 0 0 4vw; align-items: center; justify-content: center;"
             >
               <div style="color: #fff; font-size: 1em; font-weight: 700; line-height: 1">
@@ -1020,7 +1020,7 @@
       >
         <!-- 奖励弹窗内容：rewardBg 靠上展示，上下保留遮罩空白用于点击退出 -->
         <itemCenter
-          style="width: 100vw; min-height: 225vw"
+          style="width: 100vw; min-height: 225vw; max-height: 226vw"
           :imgUrl="pngUrl('rewardBg')"
           contentStyle="display: flex; flex-direction: column;justify-content: flex-start; gap: 12.5vw; padding: 34vw 6vw 0vw; box-sizing: border-box;"
         >
@@ -1172,7 +1172,7 @@
       >
         <!-- 规则弹窗内容：ruleBg 高度较长，宽度占满 100vw，顶部和底部空白用于点击退出 -->
         <itemCenter
-          style="width: 100vw; min-height: 178vw"
+          style="width: 100vw; min-height: 178vw; max-height: 179vw"
           :imgUrl="pngUrl('ruleBg')"
           contentStyle="padding: 0; box-sizing: border-box;"
         />
@@ -1390,7 +1390,7 @@ const normalizeRankingItem = (item = {}) => {
 // 赛事列表字段归一化：只按照 apiPostWorldCupMatchList 当前返回字段生成页面数据。
 const normalizeMatchItem = (item = {}) => {
   return {
-    matchId: item.matchId ?? '',
+    matchId: item.matchId == null ? '' : String(item.matchId),
     homeTeam: item.homeTeam ?? '',
     awayTeam: item.awayTeam ?? '',
     homeFlag: item.homeFlag ?? '',
diff --git a/src/views/Activities/WorldCup/世界杯接口说明.md b/src/views/Activities/WorldCup/世界杯接口说明.md
index b638484..0e2f5a8 100644
--- a/src/views/Activities/WorldCup/世界杯接口说明.md
+++ b/src/views/Activities/WorldCup/世界杯接口说明.md
@@ -119,7 +119,7 @@ Body 参数：
 
 ```json
 {
-  "matchId": 0,
+  "matchId": "0",
   "betOption": 0,
   "betAmount": 0
 }
@@ -129,7 +129,7 @@ Body 参数：
 
 | 字段 | 必填 | 说明 |
 | --- | --- | --- |
-| matchId | 是 | 比赛 ID |
+| matchId | 是 | 比赛 ID，必须使用字符串格式传参，避免大整数精度丢失 |
 | betOption | 是 | 押注选项：`1` 主胜，`2` 平局，`3` 客胜 |
 | betAmount | 是 | 押注金额：`100` / `1000` / `10000` / `100000` |
 
@@ -146,7 +146,7 @@ Body 参数：
 {
   "size": 0,
   "current": 0,
-  "matchId": 0
+  "matchId": "0"
 }
 ```
 
@@ -156,7 +156,7 @@ Body 参数：
 | --- | --- | --- |
 | size | 是 | 每页数量 |
 | current | 是 | 当前页 |
-| matchId | 否 | 比赛 ID，为空查全部 |
+| matchId | 否 | 比赛 ID，为空查全部；有值时必须使用字符串格式传参，避免大整数精度丢失 |
 
 返回示例：
 
diff --git a/src/views/Activities/WorldCup/页面创建信息.md b/src/views/Activities/WorldCup/页面创建信息.md
index dee8189..6ea5c8b 100644
--- a/src/views/Activities/WorldCup/页面创建信息.md
+++ b/src/views/Activities/WorldCup/页面创建信息.md
@@ -76,23 +76,23 @@
 
 页面进入时必须展示统一加载动画，阻塞预加载完成后再展示主内容。
 
-### 3.3 itemCenter 最小高度
+### 3.3 itemCenter 高度约束
 
-`itemCenter` 的 `min-height` 按 `Math.ceil(实际展示宽度vw * 图片高度 / 图片宽度)` 计算，当前页面已补充以下值：
+`itemCenter` 的 `min-height` 按 `Math.ceil(实际展示宽度vw * 图片高度 / 图片宽度)` 计算；为避免图片加载出来之前容器高度异常撑高，同步设置接近的 `max-height`，当前页面默认按 `max-height = min-height + 1vw` 补充：
 
-| 使用位置 | 图片 | 实际展示宽度 | min-height |
-| --- | --- | --- | --- |
-| 头部模块 | `bg` | `100vw` | `151vw` |
-| 排行榜主图区 | `RankingMain` | `100vw` | `92vw` |
-| 第四名以后排行榜项 | `RankingItem` | `100vw` | `23vw` |
-| 首页魅力等级徽章 | `userLevel1Bg-userLevel5Bg` | `12vw` | `7vw` |
-| 首页财富等级徽章 | `wealthLevel1Bg-wealthLevel5Bg` | `12vw` | `6vw` |
-| 赛事列表模块 | `EventlistBg` | `100vw` | `244vw` |
-| Predict Now 赛事卡片 | `matchBg` | `84vw`，来自 `EventlistBg` 内容区左右 `8vw` padding 后的可用宽度 | `52vw` |
-| 我的排名贴底模块 | `myRankingBg` | `100vw` | `21vw` |
-| 奖励弹窗 | `rewardBg` | `100vw` | `225vw` |
-| 规则弹窗 | `ruleBg` | `100vw` | `178vw` |
-| `components/topUser.vue` 等级徽章 | `userLevel*Bg` / `wealthLevel*Bg` | 当前父级最大 `26vw` 的 `30%` | `4vw` |
+| 使用位置 | 图片 | 实际展示宽度 | min-height | max-height |
+| --- | --- | --- | --- | --- |
+| 头部模块 | `bg` | `100vw` | `151vw` | `152vw` |
+| 排行榜主图区 | `RankingMain` | `100vw` | `92vw` | `93vw` |
+| 第四名以后排行榜项 | `RankingItem` | `100vw` | `23vw` | `24vw` |
+| 首页魅力等级徽章 | `userLevel1Bg-userLevel5Bg` | `12vw` | `7vw` | `8vw` |
+| 首页财富等级徽章 | `wealthLevel1Bg-wealthLevel5Bg` | `12vw` | `6vw` | `7vw` |
+| 赛事列表模块 | `EventlistBg` | `100vw` | `244vw` | `245vw` |
+| Predict Now 赛事卡片 | `matchBg` | `84vw`，来自 `EventlistBg` 内容区左右 `8vw` padding 后的可用宽度 | `52vw` | `53vw` |
+| 我的排名贴底模块 | `myRankingBg` | `100vw` | `21vw` | `22vw` |
+| 奖励弹窗 | `rewardBg` | `100vw` | `225vw` | `226vw` |
+| 规则弹窗 | `ruleBg` | `100vw` | `178vw` | `179vw` |
+| `components/topUser.vue` 等级徽章 | `userLevel*Bg` / `wealthLevel*Bg` | 当前父级最大 `26vw` 的 `30%` | `4vw` | `5vw` |
 
 ## 4. 页面结构
 
@@ -148,6 +148,7 @@
 - Predict Now 和 Ended 的单条列表都使用新的 column wrapper：上方是原赛事卡片，下方是总奖池入口，用 `gap` 控制上下间距。
 - 总奖池入口样式为金色描边渐变背景，内部一行展示 `TOTAL PRIZE POOL`、coin 图片、总奖池金额和右侧 `rightBt`；金额优先展示 `totalPoolFormat`，没有格式化字段时回退 `totalPool`。
 - 点击总奖池入口进入 `/activities/world-cup/event-detail?matchId=...`，详情页目录为 `src/views/Activities/WorldCup/EventDetail`。
+- 赛事 `matchId` 必须按字符串保留和传递，禁止使用 `Number(matchId)`；比赛 ID 可能超过 JS 安全整数范围，转数字会丢失精度。
 
 Predict Now 列表项规则：