diff --git a/frontend/src/features/orders/views/MobileOrderDetailView.css b/frontend/src/features/orders/views/MobileOrderDetailView.css
index 7b156bf..0b34651 100644
--- a/frontend/src/features/orders/views/MobileOrderDetailView.css
+++ b/frontend/src/features/orders/views/MobileOrderDetailView.css
@@ -241,11 +241,28 @@
 }
 
 .popup-close {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 36px;
+  height: 36px;
+  margin: -8px -8px -8px 0;
+  padding: 0;
   border: none;
   background: transparent;
-  font-size: 16px;
-  color: #a0aec0;
+  color: #94a3b8;
   cursor: pointer;
+  border-radius: 50%;
+  transition:
+    background-color 0.15s ease,
+    color 0.15s ease;
+  touch-action: manipulation;
+  -webkit-tap-highlight-color: transparent;
+}
+
+.popup-close:active {
+  background-color: #f1f5f9;
+  color: #475569;
 }
 
 .popup-body {
@@ -277,10 +294,91 @@
   margin: 0 0 12px 0;
 }
 
+.counter-input-card {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  margin-bottom: 14px;
+}
+
+.counter-input-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  padding: 2px 0;
+}
+
+.counter-label {
+  font-size: 14px;
+  font-weight: 600;
+  color: #1e293b;
+  white-space: nowrap;
+  flex-shrink: 0;
+}
+
+.counter-input-wrapper {
+  flex: 1;
+  max-width: 170px;
+  display: flex;
+  align-items: center;
+  border: 1.5px solid #cbd5e1;
+  border-radius: 8px;
+  background: #ffffff;
+  padding: 6px 12px;
+  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
+  transition:
+    border-color 0.15s ease,
+    box-shadow 0.15s ease,
+    background-color 0.15s ease;
+}
+
+.counter-input-wrapper:hover {
+  border-color: #94a3b8;
+}
+
+.counter-input-wrapper:focus-within {
+  border-color: #ff6a00;
+  background: #ffffff;
+  box-shadow: 0 0 0 3px rgba(255, 106, 0, 0.15);
+}
+
+.counter-input-control {
+  flex: 1;
+  min-width: 0;
+  border: none;
+  background: transparent;
+  outline: none;
+  font-size: 16px;
+  font-weight: 600;
+  color: #0f172a;
+  text-align: right;
+  padding: 0;
+}
+
+.counter-unit {
+  margin-left: 6px;
+  font-size: 13px;
+  color: #64748b;
+  font-weight: 600;
+  user-select: none;
+}
+
 .popup-field {
-  background: #f7fafc;
+  background: #f8fafc;
+  border: 1.5px solid #e2e8f0;
   border-radius: 8px;
   margin-bottom: 12px;
+  transition:
+    border-color 0.15s ease,
+    box-shadow 0.15s ease,
+    background-color 0.15s ease;
+}
+
+.popup-field:focus-within {
+  border-color: #ff6a00;
+  background: #ffffff;
+  box-shadow: 0 0 0 3px rgba(255, 106, 0, 0.15);
 }
 
 /* iOS Safari：font-size < 16px 时聚焦会自动放大整个页面 */
diff --git a/frontend/src/features/orders/views/MobileOrderDetailView.vue b/frontend/src/features/orders/views/MobileOrderDetailView.vue
index 2d1c0dd..8eb10e2 100644
--- a/frontend/src/features/orders/views/MobileOrderDetailView.vue
+++ b/frontend/src/features/orders/views/MobileOrderDetailView.vue
@@ -114,9 +114,18 @@ const {
   ordersPath: '/m/orders',
   chatPathPrefix: '/m/chats/',
   startCashier: (payment, onPaid) => cashier.openMobilePaymentCashier(payment, onPaid),
-  onCounterCheckoutSuccess: () => (showCounterPopup.value = false),
-  onRejectCheckoutSuccess: () => (showRejectPopup.value = false),
-  onCreateDisputeSuccess: () => (showDisputePopup.value = false),
+  onCounterCheckoutSuccess: () => {
+    markPopupClosed()
+    showCounterPopup.value = false
+  },
+  onRejectCheckoutSuccess: () => {
+    markPopupClosed()
+    showRejectPopup.value = false
+  },
+  onCreateDisputeSuccess: () => {
+    markPopupClosed()
+    showDisputePopup.value = false
+  },
 })
 
 const rentalTerms = computed(() => orderRentalTerms(order.value))
@@ -125,6 +134,48 @@ const rentalTerms = computed(() => orderRentalTerms(order.value))
 const showDisputePopup = ref(false)
 const showCounterPopup = ref(false)
 const showRejectPopup = ref(false)
+
+// 弹窗防穿透/防抖冷却：防止移动端/iOS Safari 点击关闭时 300ms 穿透触发底层按钮重新唤起
+const POPUP_COOLDOWN_MS = 450
+let lastPopupClosedAt = 0
+
+function markPopupClosed() {
+  lastPopupClosedAt = Date.now()
+}
+
+function canOpenPopup(): boolean {
+  return Date.now() - lastPopupClosedAt >= POPUP_COOLDOWN_MS
+}
+
+function openCounterPopup() {
+  if (!canOpenPopup()) return
+  showCounterPopup.value = true
+}
+
+function closeCounterPopup() {
+  markPopupClosed()
+  showCounterPopup.value = false
+}
+
+function openRejectPopup() {
+  if (!canOpenPopup()) return
+  showRejectPopup.value = true
+}
+
+function closeRejectPopup() {
+  markPopupClosed()
+  showRejectPopup.value = false
+}
+
+function openDisputePopup() {
+  if (!canOpenPopup()) return
+  showDisputePopup.value = true
+}
+
+function closeDisputePopup() {
+  markPopupClosed()
+  showDisputePopup.value = false
+}
 const isOwnerCheckoutPending = computed(() => {
   if (!order.value || !isOwner.value) return false
   return (
@@ -443,7 +494,7 @@ async function copyListingCode() {
             block
             plain
             round
-            @click="showCounterPopup = true"
+            @click="openCounterPopup"
           >
             修改结账方案
           </van-button>
@@ -481,11 +532,11 @@ async function copyListingCode() {
             block
             plain
             round
-            @click="showCounterPopup = true"
+            @click="openCounterPopup"
           >
             还价修改方案
           </van-button>
-          <van-button type="danger" block plain round @click="showRejectPopup = true">
+          <van-button type="danger" block plain round @click="openRejectPopup">
             发起结账争议
           </van-button>
         </div>
@@ -493,7 +544,7 @@ async function copyListingCode() {
 
       <!-- Universal Action: File a Dispute -->
       <section v-if="canOpenDispute" class="card-section action-card">
-        <van-button type="warning" block plain round @click="showDisputePopup = true">
+        <van-button type="warning" block plain round @click="openDisputePopup">
           {{ isCheckoutDisputeStage ? '对结账发起申诉争议' : '发起订单申诉争议' }}
         </van-button>
       </section>
@@ -536,10 +587,23 @@ async function copyListingCode() {
     />
 
     <!-- POPUP: Counter Checkout Adjustments（号主/租客） -->
-    <van-popup v-model:show="showCounterPopup" position="bottom" round class="mobile-popup-form">
+    <van-popup
+      v-model:show="showCounterPopup"
+      position="bottom"
+      round
+      class="mobile-popup-form"
+      @close="markPopupClosed"
+    >
       <header class="popup-header">
         <h3>修改结账方案</h3>
-        <button class="popup-close" @click="showCounterPopup = false">✕</button>
+        <button
+          type="button"
+          class="popup-close"
+          aria-label="关闭"
+          @click.stop.prevent="closeCounterPopup"
+        >
+          <van-icon name="cross" :size="18" />
+        </button>
       </header>
       <div class="popup-body">
         <p class="form-hint-info">
@@ -547,35 +611,47 @@ async function copyListingCode() {
             checkoutRoundLabel
           }}。可填实际哈夫币消耗（允许超过发布量），打超按比例从押金扣。提案将交给对方确认。
         </p>
-        <van-cell-group :border="false">
-          <van-field label="物资/损耗金额">
-            <template #input>
+        <div class="counter-input-card">
+          <div class="counter-input-row">
+            <label class="counter-label" for="counter-consumable">物资/损耗金额</label>
+            <div class="counter-input-wrapper">
               <input
+                id="counter-consumable"
                 v-model.number="counterForm.consumableAmountYuan"
                 type="number"
-                class="custom-inline-input"
+                placeholder="0"
+                class="counter-input-control"
               />
-            </template>
-          </van-field>
-          <van-field label="实际消耗哈夫币 M">
-            <template #input>
+              <span class="counter-unit">元</span>
+            </div>
+          </div>
+          <div class="counter-input-row">
+            <label class="counter-label" for="counter-coin">实际消耗哈夫币</label>
+            <div class="counter-input-wrapper">
               <input
+                id="counter-coin"
                 v-model.number="counterForm.coin_consumed_m"
                 type="number"
-                class="custom-inline-input"
+                placeholder="0"
+                class="counter-input-control"
               />
-            </template>
-          </van-field>
-          <van-field label="押金赔付(损坏等)">
-            <template #input>
+              <span class="counter-unit">M</span>
+            </div>
+          </div>
+          <div class="counter-input-row">
+            <label class="counter-label" for="counter-deposit-deduct">押金赔付(损坏等)</label>
+            <div class="counter-input-wrapper">
               <input
+                id="counter-deposit-deduct"
                 v-model.number="counterForm.depositDeductAmountYuan"
                 type="number"
-                class="custom-inline-input"
+                placeholder="0"
+                class="counter-input-control"
               />
-            </template>
-          </van-field>
-        </van-cell-group>
+              <span class="counter-unit">元</span>
+            </div>
+          </div>
+        </div>
 
         <!-- 实时结算试算预览（仅展示当前角色自身收支，完全屏蔽平台服务费） -->
         <CheckoutTrialPreview :simulation="checkoutSimulation" variant="mobile" />
@@ -583,6 +659,7 @@ async function copyListingCode() {
           v-model="counterForm.reason"
           rows="2"
           autosize
+          required
           label="修改原因"
           type="textarea"
           placeholder="请说明调整原因（必填）"
@@ -618,10 +695,23 @@ async function copyListingCode() {
     </van-popup>
 
     <!-- POPUP: Renter Reject Counter Proposal Reason -->
-    <van-popup v-model:show="showRejectPopup" position="bottom" round class="mobile-popup-form">
+    <van-popup
+      v-model:show="showRejectPopup"
+      position="bottom"
+      round
+      class="mobile-popup-form"
+      @close="markPopupClosed"
+    >
       <header class="popup-header">
         <h3>拒绝修正扣款说明</h3>
-        <button class="popup-close" @click="showRejectPopup = false">✕</button>
+        <button
+          type="button"
+          class="popup-close"
+          aria-label="关闭"
+          @click.stop.prevent="closeRejectPopup"
+        >
+          <van-icon name="cross" :size="18" />
+        </button>
       </header>
       <div class="popup-body">
         <p class="form-hint-info">
@@ -653,10 +743,23 @@ async function copyListingCode() {
     </van-popup>
 
     <!-- POPUP: Create Generic Order Dispute -->
-    <van-popup v-model:show="showDisputePopup" position="bottom" round class="mobile-popup-form">
+    <van-popup
+      v-model:show="showDisputePopup"
+      position="bottom"
+      round
+      class="mobile-popup-form"
+      @close="markPopupClosed"
+    >
       <header class="popup-header">
         <h3>发起申诉争议</h3>
-        <button class="popup-close" @click="showDisputePopup = false">✕</button>
+        <button
+          type="button"
+          class="popup-close"
+          aria-label="关闭"
+          @click.stop.prevent="closeDisputePopup"
+        >
+          <van-icon name="cross" :size="18" />
+        </button>
       </header>
       <div class="popup-body">
         <van-field v-if="!isCheckoutDisputeStage" label="申诉类型" class="popup-field">