html, body { margin: 0; padding: 0; background-color: #f4f5f7; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; overflow-x: hidden; width: 100%; -webkit-tap-highlight-color: transparent;}
.page-container { width: 100%; max-width: 450px; padding: 15px; box-sizing: border-box; min-height: 100vh; position: relative; margin: 0 auto; }

/* 基础模块 */
.banner-card { background: linear-gradient(135deg, #4A86FF 0%, #2A5DED 100%); border-radius: 12px; padding: 24px 20px; color: #fff; position: relative; margin-bottom: -40px; padding-bottom: 60px; }
.banner-title { font-size: 22px; font-weight: bold; margin-bottom: 6px; }
.banner-sub { font-size: 13px; opacity: 0.9; margin-bottom: 16px; }
.banner-list p { margin: 4px 0; font-size: 12px; opacity: 0.8; }
.main-content { background-color: #fff; border-radius: 12px; box-shadow: 0 4px 16px rgba(0,0,0,0.04); position: relative; z-index: 2; }
.tabs { display: flex; justify-content: space-around; border-bottom: 1px solid #f0f0f0; }
.tab-item { padding: 16px 0; font-size: 16px; color: #666; position: relative; flex: 1; text-align: center; }
.tab-item.active { color: #3A74FA; font-weight: bold; }
.tab-item .tab-line { display: none; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 24px; height: 3px; background-color: #3A74FA; border-radius: 2px; }
.tab-item.active .tab-line { display: block; }
.form-area { padding: 0 16px; }
.form-list-item { display: flex; align-items: center; padding: 18px 0; border-bottom: 1px solid #f0f0f0; }
.form-list-item.no-border { border-bottom: none; }
.label { font-size: 15px; color: #333; width: 80px; flex-shrink: 0; }
.value-input { flex: 1; font-size: 15px; color: #333; border: none; outline: none; background: transparent; text-align: right; padding: 0; }
.unit { font-size: 15px; color: #333; margin-left: 6px; }
.vin-section { padding: 16px 0; border-bottom: 1px solid #f0f0f0; }
.vin-input-wrap { background-color: #f7f8fa; border-radius: 8px; height: 44px; display: flex; align-items: center; padding: 0 12px; position: relative; }
.vin-input { flex: 1; background: transparent; border: none; outline: none; font-size: 15px; pointer-events: none; }
.camera-btn-wrap { position: absolute; right: 0; top: 0; width: 50px; height: 100%; display: flex; align-items: center; justify-content: center; z-index: 99; }
.camera-icon { font-size: 20px; pointer-events: none; position: relative; z-index: 1; }
#camera-upload { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; z-index: 2; }
.bottom-action { margin-top: 30px; width: 100%; display: flex; flex-direction: column; align-items: center; }
.submit-btn { width: 90%; height: 48px; background-color: #4A86FF; color: #ffffff; font-size: 18px; font-weight: bold; border-radius: 8px; border: none; cursor: pointer; transition: 0.2s; }
.submit-btn:active { transform: scale(0.98); opacity: 0.9; }
.agreement { display: flex; align-items: center; justify-content: center; margin-top: 15px; }
.agree-text { font-size: 12px; color: #999; margin-left: 6px; }
.agreement-link { color: #4A86FF; cursor: pointer; }

/* ==========================================
   🚨 全屏抽屉式大弹窗 (伪装第二页)
   ========================================== */
.full-screen-modal { position: fixed; top: 100%; left: 0; width: 100vw; height: 100vh; background-color:transparent; z-index: 99999; display: flex; flex-direction: column; transition: top 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); }
.full-screen-modal.show { top: 0; }

.modal-nav { height: 50px; background: #fff; display: flex; align-items: center; justify-content: center; position: relative; border-bottom: 1px solid #eee; flex-shrink: 0; }
.nav-back { position: absolute; left: 15px; font-size: 14px; color: #666; cursor: pointer; font-weight: bold; }
.nav-title { font-size: 16px; font-weight: bold; color: #333; }

/* 🚨 底部抽屉样式：顶部透明漏出主页，其他区域铺满背景色 */
.modal-body-scroll { 
    flex: 1; 
    overflow-y: hidden; 
    margin-top: 100px; 
    background-color: #f5f6f8; 
    border-radius: 24px 24px 0 0;
    padding: 20px 15px 40px 15px; 
    box-sizing: border-box; 
    
    /* 👇 加上这两行终极锁死代码 */
    touch-action: none;          /* 彻底禁用这块区域的所有手指滑动和缩放手势 */
    overscroll-behavior: none;   /* 阻断滑动力量往下层传递，防止扯动主页 */
}

/* 弹窗内部：评估卡片 */
.valuation-card { background: #fff; border-radius: 12px; padding: 20px; box-shadow: 0 2px 10px rgba(0,0,0,0.03); margin-bottom: 15px; }
.valuation-card .header-info { font-size: 15px; color: #333; font-weight: bold; border-bottom: 1px solid #f0f0f0; padding-bottom: 12px; margin-bottom: 12px; }
.valuation-card .tabs { display: flex; justify-content: space-around; border: none; }
.valuation-card .tab-item { font-size: 14px; color: #666; padding: 8px 0; cursor: pointer; flex: 1; text-align: center; }
.valuation-card .tab-item.active { color: #3A74FA; font-weight: bold; }
.valuation-card .tab-item.active::after { content: ''; position: absolute; bottom: 0; left: 25%; width: 50%; height: 2px; background-color: #3A74FA; border-radius: 2px; }
.valuation-card .price-display { text-align: center; margin: 25px 0 15px; }
.valuation-card .price-number { font-size: 42px; color: #E86A34; font-weight: bold; font-family: Arial; }
.valuation-card .price-unit { font-size: 16px; color: #E86A34; font-weight: bold; margin-left: 4px; }
.valuation-card .footer-note { text-align: center; font-size: 11px; color: #999; }

/* 弹窗内部：留资表单 */
.lead-section { background: #fff; border-radius: 12px; padding: 20px; box-shadow: 0 2px 10px rgba(0,0,0,0.03); }
.report-box { background: #f7f8fa; padding: 15px; border-radius: 8px; margin-bottom: 20px; }
.report-title { font-size: 14px; font-weight: bold; color: #333; margin-bottom: 10px; }
.report-list span { display: block; font-size: 12px; color: #555; line-height: 1.8; }
.form-desc { text-align: center; font-size: 14px; color: #333; font-weight: bold; margin-bottom: 15px; }
.phone-input { width: 100%; box-sizing: border-box; padding: 15px; background: #f9f9f9; border: 1px solid #ddd; border-radius: 8px; text-align: center; font-size: 16px; margin-bottom: 15px; outline: none; -webkit-appearance: none; }
.phone-input:focus { border-color: #3A74FA; background: #fff; }
.modal-submit-btn { width: 100%; height: 48px; background: #3A74FA; color: #fff; border-radius: 8px; font-size: 16px; font-weight: bold; border: none; cursor: pointer; }
.modal-submit-btn:disabled { background: #999; }
.safe-tip { text-align: center; font-size: 11px; color: #999; margin-top: 15px; }
/* 美化评估报告的三条列表项 */
.report-list {
    display: flex;
    flex-direction: column;
    gap: 12px; /* 控制每一行文字之间的上下间距 */
    margin-top: 0.8px; /* 距离上方标题的距离 */
    padding: 0 5px; /* 左右稍微留一点呼吸感 */
}

/* 专属人工评估包含 - 列表文字加粗加黑 */
.report-list span {
    font-size: 14px; 
    font-weight: bold; /* 🚨 核心代码：让字体变粗 */
    color: #333333;    /* 🚨 颜色加深，变成较深的黑灰色，看着更扎实 */
    line-height: 0.8;  /* 稍微拉开点上下间距，加粗后才不会挤在一起 */
    letter-spacing: 0.5px; 
}

/* 左对齐 tab */
.custom-tabs{
    justify-content: flex-start !important;
    padding-left: 16px;
}

.custom-tab-item{
    flex: none !important;
    padding: 16px 0 !important;
    margin: 0 !important;
    position: relative;
}

.custom-tab-item span{
    font-size: 16px;
    font-weight: bold;
    color: #333;
}

/* 蓝线 */
.custom-tab-item .tab-line{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 28px;
    height: 3px;
    border-radius: 3px;
    background: #3A74FA;
}