diff --git a/pages-game/game/minesweeper/play.scss b/pages-game/game/minesweeper/play.scss
index c5c6ad7..30b8cce 100644
--- a/pages-game/game/minesweeper/play.scss
+++ b/pages-game/game/minesweeper/play.scss
@@ -1182,285 +1182,258 @@
             font-size: 16rpx;
         }
     }
+}
 
-    // =====================================
-    // 底部面板
-    // =====================================
-    .bottom-panel {
-        padding: $spacing-sm;
-        padding-bottom: calc($spacing-sm + env(safe-area-inset-bottom));
-        background: rgba(0, 0, 0, 0.4);
-        display: flex;
-        gap: $spacing-md;
-        border-top: 1px solid $border-dark;
-        height: 180rpx; // 减小高度
+// =====================================
+// 底部面板
+// =====================================
+.bottom-panel {
+    padding: $spacing-sm;
+    padding-bottom: calc($spacing-sm + env(safe-area-inset-bottom));
+    background: rgba(0, 0, 0, 0.4);
+    display: flex;
+    gap: $spacing-md;
+    border-top: 1px solid $border-dark;
+    height: 180rpx; // 减小高度
+}
+
+.game-logs {
+    flex: 1;
+    height: 100%;
+    padding: $spacing-sm;
+    background: rgba(0, 0, 0, 0.3);
+    border-radius: $radius-md;
+}
+
+.log-line {
+    font-size: $font-xxs;
+    line-height: 1.6;
+    color: $text-dark-sub;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+
+    &.log-system {
+        color: $accent-cyan;
     }
 
-    .game-logs {
-        flex: 1;
-        height: 100%;
-        padding: $spacing-sm;
-        background: rgba(0, 0, 0, 0.3);
-        border-radius: $radius-md;
-    }
-
-    .log-line {
-        font-size: $font-xxs;
-        line-height: 1.6;
-        color: $text-dark-sub;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-
-        &.log-system {
-            color: $accent-cyan;
-        }
-
-        &.log-effect {
-            color: $brand-primary;
-        }
-    }
-
-    // =====================================
-    // 弹窗
-    // =====================================
-    .modal-overlay {
-        position: fixed;
-        inset: 0;
-        background: rgba(0, 0, 0, 0.8);
-        backdrop-filter: blur(10rpx);
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        z-index: 1000;
-    }
-
-    .modal-content {
-        width: 520rpx;
-        padding: $spacing-xxl $spacing-xl;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        gap: $spacing-lg;
-    }
-
-    .modal-emoji {
-        font-size: 100rpx;
-    }
-
-    .modal-title {
-        font-size: 40rpx;
-        font-weight: 900;
-        color: $text-dark-main;
-        margin-top: $spacing-md;
-    }
-
-    .result-details {
-        margin: $spacing-lg 0;
-        padding: $spacing-md;
-        background: rgba($bg-dark-card, 0.5);
-        border-radius: $radius-md;
-        width: 100%;
-
-        .detail-text {
-            font-size: $font-md;
-            color: $text-dark-sub;
-            text-align: center;
-            line-height: 1.6;
-        }
-    }
-
-    // =====================================
-    // 玩法说明弹窗
-    // =====================================
-    .guide-modal {
-        width: 90%;
-        max-width: 640rpx;
-        max-height: 80vh;
-        display: flex;
-        flex-direction: column;
-    }
-
-    .guide-header {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        padding: $spacing-lg;
-        border-bottom: 1px solid $border-dark;
-    }
-
-    .guide-title {
-        font-size: $font-lg;
-        font-weight: 800;
-        color: $text-dark-main;
-    }
-
-    .close-btn {
-        width: 56rpx;
-        height: 56rpx;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        font-size: $font-lg;
-        color: $text-dark-sub;
-        background: rgba(255, 255, 255, 0.05);
-        border-radius: 50%;
-    }
-
-    .guide-body {
-        padding: $spacing-lg;
-        max-height: 60vh;
-    }
-
-    .section-title {
-        display: block;
-        font-size: $font-md;
-        font-weight: 700;
+    &.log-effect {
         color: $brand-primary;
-        margin-bottom: $spacing-md;
+    }
+}
+
+
+// =====================================
+// 弹窗 (全屏遮罩)
+// =====================================
+.modal-overlay {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.85);
+    backdrop-filter: blur(12rpx);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 10000; // 确保在最厚层
+}
+
+.modal-content {
+    width: 560rpx;
+    padding: $spacing-xxl $spacing-xl;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: $spacing-lg;
+    animation: zoomIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
+}
+
+@keyframes zoomIn {
+    from {
+        opacity: 0;
+        transform: scale(0.8);
     }
 
-    .guide-grid {
+    to {
+        opacity: 1;
+        transform: scale(1);
+    }
+}
+
+.modal-emoji {
+    font-size: 110rpx;
+    filter: drop-shadow(0 0 20rpx rgba(255, 255, 255, 0.2));
+}
+
+.modal-title {
+    font-size: 44rpx;
+    font-weight: 900;
+    color: $text-dark-main;
+    text-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.5);
+}
+
+.result-details {
+    margin: $spacing-lg 0;
+    padding: $spacing-md;
+    background: rgba(255, 255, 255, 0.05);
+    border: 1px solid rgba(255, 255, 255, 0.1);
+    border-radius: $radius-md;
+    width: 100%;
+
+    .detail-text {
+        font-size: $font-md;
+        color: $text-dark-sub;
+        text-align: center;
+        line-height: 1.6;
+    }
+}
+
+// =====================================
+// 玩法说明弹窗
+// =====================================
+.guide-modal {
+    width: 90%;
+    max-width: 640rpx;
+    max-height: 85vh;
+    display: flex;
+    flex-direction: column;
+    animation: slideUp 0.4s ease-out;
+}
+
+@keyframes slideUp {
+    from {
+        opacity: 0;
+        transform: translateY(100rpx);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+.guide-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: $spacing-lg;
+    border-bottom: 1px solid $border-dark;
+}
+
+.guide-title {
+    font-size: $font-lg;
+    font-weight: 800;
+    color: $text-dark-main;
+}
+
+.close-btn {
+    width: 64rpx;
+    height: 64rpx;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: $font-lg;
+    color: $text-dark-sub;
+    background: rgba(255, 255, 255, 0.08);
+    border-radius: 50%;
+}
+
+.guide-body {
+    padding: $spacing-lg;
+    max-height: 65vh;
+}
+
+.section-title {
+    display: block;
+    font-size: $font-md;
+    font-weight: 700;
+    color: $brand-primary;
+    margin-bottom: $spacing-md;
+}
+
+.guide-grid {
+    display: flex;
+    flex-direction: column;
+    gap: $spacing-md;
+}
+
+.guide-item {
+    display: flex;
+    align-items: flex-start;
+    gap: $spacing-md;
+    padding: $spacing-md;
+    background: rgba(255, 255, 255, 0.04);
+    border-radius: $radius-md;
+
+    .icon {
+        font-size: 36rpx;
+        flex-shrink: 0;
+    }
+
+    .desc {
         display: flex;
         flex-direction: column;
-        gap: $spacing-md;
+        gap: 6rpx;
     }
 
-    .guide-item {
-        display: flex;
-        align-items: flex-start;
-        gap: $spacing-md;
-        padding: $spacing-sm;
-        background: rgba(255, 255, 255, 0.03);
-        border-radius: $radius-md;
-
-        .icon {
-            font-size: 32rpx;
-            flex-shrink: 0;
-        }
-
-        .desc {
-            display: flex;
-            flex-direction: column;
-            gap: 4rpx;
-        }
-
-        .name {
-            font-size: $font-sm;
-            font-weight: 600;
-            color: $text-dark-main;
-        }
-
-        .detail {
-            font-size: $font-xs;
-            color: $text-dark-sub;
-            line-height: 1.5;
-        }
+    .name {
+        font-size: $font-sm;
+        font-weight: 600;
+        color: $text-dark-main;
     }
 
-    // =====================================
-    // 飘字动画
-    // =====================================
-    .float-label {
-        position: absolute;
-        font-size: $font-md;
-        font-weight: 900;
-        pointer-events: none;
-        animation: floatUp 1s ease-out forwards;
-        z-index: 100;
-        text-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.8);
+    .detail {
+        font-size: $font-xs;
+        color: $text-dark-sub;
+        line-height: 1.5;
+    }
+}
 
-        &.global {
-            position: fixed;
-        }
+// 通用辅助类 (全局可用)
+.fadeInUp {
+    animation: fadeInUp 0.5s ease-out both;
+}
 
-        &.text-damage {
-            color: $color-error;
-        }
-
-        &.text-heal {
-            color: $color-success;
-        }
-
-        &.text-effect {
-            color: $accent-cyan;
-        }
+@keyframes fadeInUp {
+    from {
+        opacity: 0;
+        transform: translateY(40rpx);
     }
 
-    @keyframes floatUp {
-        0% {
-            opacity: 1;
-            transform: translateY(0) scale(1);
-        }
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
 
-        100% {
-            opacity: 0;
-            transform: translateY(-60rpx) scale(0.8);
-        }
+.pulse {
+    animation: pulse 2s ease-in-out infinite;
+}
+
+@keyframes pulse {
+
+    0%,
+    100% {
+        transform: scale(1);
+        opacity: 0.9;
     }
 
-    // =====================================
-    // 屏幕震动 & 通用动画
-    // =====================================
-    .screen-shake {
-        animation: screenShake 0.4s ease-in-out;
+    50% {
+        transform: scale(1.03);
+        opacity: 1;
     }
+}
 
-    @keyframes screenShake {
+.bg-red {
+    background-color: $color-error !important;
+}
 
-        0%,
-        100% {
-            transform: translateX(0);
-        }
+.bg-yellow {
+    background-color: $color-warning !important;
+}
 
-        20% {
-            transform: translateX(-8rpx);
-        }
-
-        40% {
-            transform: translateX(8rpx);
-        }
-
-        60% {
-            transform: translateX(-4rpx);
-        }
-
-        80% {
-            transform: translateX(4rpx);
-        }
-    }
-
-    .fadeInUp {
-        animation: fadeInUp 0.5s ease-out both;
-    }
-
-    @keyframes fadeInUp {
-        from {
-            opacity: 0;
-            transform: translateY(40rpx);
-        }
-
-        to {
-            opacity: 1;
-            transform: translateY(0);
-        }
-    }
-
-    .pulse {
-        animation: pulse 2s ease-in-out infinite;
-    }
-
-    @keyframes pulse {
-
-        0%,
-        100% {
-            transform: scale(1);
-            opacity: 0.9;
-        }
-
-        50% {
-            transform: scale(1.03);
-            opacity: 1;
-        }
-    }
+.bg-green {
+    background-color: $color-success !important;
 }
\ No newline at end of file
diff --git a/pages-game/game/minesweeper/play.vue b/pages-game/game/minesweeper/play.vue
index 897bd39..77a5883 100644
--- a/pages-game/game/minesweeper/play.vue
+++ b/pages-game/game/minesweeper/play.vue
@@ -232,25 +232,16 @@
       </view>
     </view>
 
-    <!-- 结算弹窗 -->
-<<<<<<< HEAD
-    <view v-if="shouldShowResultModal" class="modal-overlay">
+    <!-- 结算弹窗 - 移至根级，确保不被 game-screen 的销毁影响 -->
+    <view v-if="showResultModal" class="modal-overlay" style="z-index: 9999;">
       <view class="modal-content glass-card">
         <text class="modal-emoji">{{ getGameResultEmoji() }}</text>
         <text class="modal-title">{{ getGameResultTitle() }}</text>
-        <view class="result-details" v-if="gameState.players">
+        <view class="result-details" v-if="gameState && gameState.players">
           <text class="detail-text">{{ getResultMessage() }}</text>
         </view>
         <view
           class="btn-primary"
-=======
-    <view v-if="showSettlement" class="modal-overlay">
-      <view class="modal-content glass-card">
-        <text class="modal-emoji">{{ settlementWinnerId === 'draw' ? '🤝' : (settlementWinnerId === myUserId ? '🏆' : '💀') }}</text>
-        <text class="modal-title">{{ settlementWinnerId === 'draw' ? '平局' : (settlementWinnerId === myUserId ? '胜利！' : '很遗憾失败了') }}</text>
-        <view 
-          class="btn-primary" 
->>>>>>> 5ec793a (feat: 为扫雷游戏添加房间列表功能，支持加入和围观现有对局。)
           :class="{ disabled: isRefreshing }"
           @tap="refreshAndPlayAgain"
         >
@@ -259,6 +250,8 @@
       </view>
     </view>
 
+
+
     <!-- 玩法说明弹窗 -->
     <view v-if="showGuide" class="modal-overlay" @tap="showGuide = false">
       <view class="guide-modal glass-card" @tap.stop>
@@ -326,6 +319,7 @@ export default {
       isSpectator: false,
       showSettlement: false,
       settlementWinnerId: '',
+      showResultModal: false,
       // Timers
       matchInterval: null,
       turnInterval: null,
@@ -392,6 +386,12 @@ export default {
     }
   },
   watch: {
+    shouldShowResultModal(newVal) {
+      console.log('[WATCH] shouldShowResultModal changed:', newVal);
+      if (newVal) {
+        this.showResultModal = true;
+      }
+    },
     logs() {
        this.$nextTick(() => {
          this.logsScrollTop = 99999 + Math.random();