/* ============================================================
   益企魔方 · 政企智能选型（V4.0 设计升级）
   设计语言：Ant Design 浅色风格 + 政企专业蓝
   主色 #1677ff · 浅灰底 #f3f5f9 · 卡片化 · 克制渐变
   说明：本文件仅重绘样式，class 名与交互钩子(data-action)完全保留，
        业务逻辑(app.js / recommend.js / products.js)不变。
   ============================================================ */
:root {
  /* 品牌主色（AntD 浅色风 #1677ff） */
  --primary: #1677ff;
  --primary-hover: #4096ff;
  --primary-active: #0958d9;
  --primary-light: #e6f0ff;   /* 浅蓝底 */
  --primary-soft: #f0f6ff;
  --primary-deep: #0a4dab;
  /* 辅色 */
  --accent: #13c2c2;          /* 科技青 */
  --navy: #0a1f44;            /* 深海军蓝 */
  /* 渐变 */
  --grad-navy: linear-gradient(135deg, #0a1f44 0%, #1677ff 60%, #13c2c2 120%);
  --grad-blue: linear-gradient(135deg, #4096ff 0%, #1677ff 100%);
  --grad-brand: linear-gradient(135deg, #4096ff 0%, #1677ff 100%);
  /* 点缀（克制） */
  --gold: #fa8c16;
  --gold-soft: #fff3e0;
  /* 价格（科技蓝，不用红） */
  --price: #1677ff;
  /* 状态色 */
  --success: #16a34a;
  --success-soft: #ecfdf3;
  --warning: #faad14;
  --warning-soft: #fffbe6;
  --danger: #ff4d4f;
  --danger-soft: #fff1f0;
  /* 背景 / 表面 / 边框 */
  --bg: #f3f5f9;
  --surface: #ffffff;
  --border: #e8edf3;
  --border-strong: #dbe3ee;
  /* 文字三级 */
  --text-1: #1f2733;
  --text-2: #5b6675;
  --text-3: #99a3b2;
  /* 阴影 / 圆角 */
  --shadow-card: 0 1px 2px rgba(16, 24, 40, .04), 0 6px 16px rgba(16, 24, 40, .06);
  --shadow-pop: 0 10px 34px rgba(16, 24, 40, .14);
  --radius: 4px;
  --radius-lg: 8px;
}

* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; color: var(--text-1); font-size: 14px; line-height: 1.5; }
body { background: var(--bg); }
button { font-family: inherit; cursor: pointer; }
input { font-family: inherit; }
.hidden { display: none !important; }

/* ============ 全幅 H5 容器（V4 去手机外壳，桌面端限宽 480px 居中） ============ */
.phone-frame { width: 100%; max-width: 480px; height: 100vh; height: 100dvh; margin: 0 auto; background: var(--bg); position: relative; overflow: hidden; box-shadow: 0 0 40px rgba(16, 24, 40, .08); }
.phone-notch { display: none; }
.phone-screen { width: 100%; height: 100%; position: relative; overflow: hidden; }
/* ============ 视图 ============ */
.view { position: absolute; inset: 0; display: flex; flex-direction: column; background: var(--bg); }
.view:not(.hidden) { animation: viewIn .3s cubic-bezier(.22, 1, .36, 1); }
@keyframes viewIn { from { opacity: 0; } to { opacity: 1; } }

/* ============ 导航 ============ */
.nav { height: 52px; background: var(--surface); display: flex; align-items: center; padding: 0 14px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.nav h1 { font-size: 16px; font-weight: 600; flex: 1; text-align: center; color: var(--navy); }
.nav-back { font-size: 26px; color: var(--text-1); width: 40px; height: 44px; line-height: 44px; cursor: pointer; transition: opacity .15s; }
.nav-back:active { opacity: .5; }
.nav-right { font-size: 13px; color: var(--primary); cursor: pointer; min-width: 40px; text-align: right; transition: opacity .15s; }
.nav-right:active { opacity: .6; }
.avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--primary-soft); display: flex; align-items: center; justify-content: center; font-size: 17px; cursor: pointer; }

/* ============ 页面主体 ============ */
.page-body { flex: 1; min-height: 0; overflow-y: auto; padding: 14px; scroll-behavior: smooth; }
.page-body::-webkit-scrollbar { width: 0; }
.fixed-cta { padding: 12px 14px calc(12px + env(safe-area-inset-bottom)); background: var(--surface); border-top: 1px solid var(--border); flex-shrink: 0; }

/* ============ 按钮 ============ */
.btn-primary { background: var(--grad-brand); color: #fff; border: none; min-height: 46px; padding: 0 22px; border-radius: 10px; font-size: 15px; font-weight: 500; cursor: pointer; transition: filter .15s, box-shadow .15s, transform .12s; box-shadow: 0 4px 14px rgba(22, 119, 255, .28); }
.btn-primary:hover { filter: brightness(1.05); box-shadow: 0 6px 18px rgba(22, 119, 255, .34); }
.btn-primary:active { filter: brightness(.96); transform: translateY(1px); box-shadow: 0 2px 8px rgba(22, 119, 255, .24); }
.btn-primary:disabled { background: #c9d4e3; box-shadow: none; cursor: not-allowed; }
.btn-primary.block { display: block; width: 100%; }
.btn-ghost { background: var(--surface); color: var(--primary); border: 1px solid var(--primary); min-height: 46px; padding: 0 22px; border-radius: 10px; font-size: 15px; cursor: pointer; transition: background .15s, transform .12s; }
.btn-ghost:hover { background: var(--primary-soft); }
.btn-ghost:active { transform: translateY(1px); background: var(--primary-light); }
.btn-ghost.block { display: block; width: 100%; }
.btn-light { background: #fff; color: var(--navy); border: none; min-height: 46px; padding: 0 44px; border-radius: 23px; font-size: 16px; font-weight: 600; cursor: pointer; box-shadow: 0 4px 14px rgba(0, 0, 0, .18); }
.btn-code { background: var(--primary-soft); color: var(--primary); border: none; min-height: 44px; padding: 0 14px; border-radius: 10px; font-size: 13px; cursor: pointer; white-space: nowrap; transition: background .15s; }
.btn-code:hover { background: var(--primary-light); }
.btn-code:disabled { color: var(--text-3); background: #eef1f6; cursor: not-allowed; }
.btn-send { background: var(--grad-brand); color: #fff; border: none; height: 42px; padding: 0 20px; border-radius: 21px; font-size: 14px; cursor: pointer; box-shadow: 0 3px 12px rgba(22, 119, 255, .3); transition: filter .15s, transform .12s; }
.btn-send:hover { filter: brightness(1.06); }
.btn-send:active { transform: scale(.96); filter: brightness(.95); }
/* 语音输入按钮 */
.btn-voice { width: 44px; height: 44px; border: 1px solid var(--border-strong); border-radius: 50%; background: #f7f9fc; font-size: 18px; cursor: pointer; flex-shrink: 0; display: flex; align-items: center; justify-content: center; transition: all .2s; }
.btn-voice:hover { border-color: var(--primary); background: var(--primary-soft); color: var(--primary); }
.btn-voice:active { transform: scale(.94); }
.btn-voice.recording { background: #ffe9e9; border-color: var(--danger); color: var(--danger); animation: voice-pulse 1.2s infinite; }
@keyframes voice-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(255, 77, 79, .35); } 50% { box-shadow: 0 0 0 8px rgba(255, 77, 79, 0); } }

/* ============ 来源标签 ============ */
.splash-source { font-size: 11px; color: var(--text-3); text-align: center; }

/* ============ 登录 ============ */
.login-logo { font-size: 26px; font-weight: 700; text-align: center; margin-top: 36px; color: var(--navy); letter-spacing: 2px; }
.login-sub { font-size: 13px; color: var(--text-2); text-align: center; margin: 8px 0 32px; }
.form-group { margin-bottom: 18px; }
.form-group label { display: block; font-size: 13px; color: var(--text-2); margin-bottom: 8px; }
.form-group input { width: 100%; height: 46px; border: 1px solid var(--border-strong); border-radius: 10px; padding: 0 14px; font-size: 15px; background: var(--surface); transition: border-color .15s, box-shadow .15s; }
.form-group input:focus { border-color: var(--primary); outline: none; box-shadow: 0 0 0 3px rgba(22, 119, 255, .12); }
.form-group input.err { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(255, 77, 79, .12); }
.field-err { font-size: 12px; color: var(--danger); margin-top: 6px; }
.code-row { display: flex; gap: 10px; }
.code-row input { flex: 1; }
.tips { font-size: 12px; color: var(--text-3); text-align: center; margin-top: 18px; line-height: 1.6; }

/* ============ 主容器 ============ */
.main-pages { flex: 1; min-height: 0; position: relative; overflow: hidden; }
.tab-page { position: absolute; inset: 0; display: flex; flex-direction: column; background: var(--bg); }
.tab-page:not(.hidden) { animation: pageIn .3s cubic-bezier(.22, 1, .36, 1); }
@keyframes pageIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* ============ 首页 ============ */

/* 顶部 topbar */
.topbar { height: 56px; padding: 0 16px; display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; position: relative; z-index: 5; background: rgba(255, 255, 255, .86); backdrop-filter: blur(10px); border-bottom: 1px solid var(--border); }
.brand { display: flex; align-items: center; gap: 8px; font-size: 17px; color: var(--navy); }
.brand-logo { width: 28px; height: 28px; object-fit: contain; border-radius: 7px; flex-shrink: 0; }
.brand .tag { font-size: 10px; color: var(--primary); border: 1px solid rgba(22, 119, 255, .35); border-radius: 999px; padding: 3px 8px; }
.topbar-user { display: flex; align-items: center; gap: 6px; background: none; border: none; cursor: pointer; padding: 4px 2px; color: var(--navy); transition: opacity .15s; }
.tu-avatar { width: 30px; height: 30px; border-radius: 50%; background: var(--grad-brand); display: flex; align-items: center; justify-content: center; font-size: 15px; box-shadow: 0 2px 8px rgba(22, 119, 255, .3); }
.tu-label { font-size: 13px; font-weight: 500; }
.topbar-user:active { opacity: .6; }
.topbar-menu { width: 38px; height: 38px; border: none; background: none; cursor: pointer; color: var(--navy); display: flex; align-items: center; justify-content: center; border-radius: 8px; transition: background .15s; }
.topbar-menu:active { background: rgba(22, 119, 255, .1); }
.topbar-menu .ic-svg { width: 24px; height: 24px; }

/* HERO */
.hero { padding: 18px 18px 18px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.cube-wrap { margin: 6px 0 0; }
.cube-scene { width: 104px; height: 104px; perspective: 500px; margin: 0 auto; }
.cube { width: 100%; height: 100%; position: relative; transform-style: preserve-3d; animation: cube-spin 18s linear infinite; }
.cube-face { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); gap: 3px; padding: 3px; border-radius: 12px; }
.cube-cell { border-radius: 3px; }
.cube-front { transform: translateZ(52px); }
.cube-back { transform: rotateY(180deg) translateZ(52px); }
.cube-right { transform: rotateY(90deg) translateZ(52px); }
.cube-left { transform: rotateY(-90deg) translateZ(52px); }
.cube-top { transform: rotateX(90deg) translateZ(52px); }
.cube-bottom { transform: rotateX(-90deg) translateZ(52px); }
.cube-front .cube-cell { background: linear-gradient(135deg, #1677ff, #4096ff); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18); }
.cube-back .cube-cell { background: linear-gradient(135deg, #0958d9, #1677ff); }
.cube-right .cube-cell { background: linear-gradient(135deg, #1677ff, #13c2c2); }
.cube-left .cube-cell { background: linear-gradient(135deg, #13c2c2, #5ce0f5); }
.cube-top .cube-cell { background: linear-gradient(135deg, #ffffff, #e6f0ff); }
.cube-bottom .cube-cell { background: linear-gradient(135deg, #8fb8ff, #4096ff); }
@keyframes cube-spin { 0% { transform: rotateX(-18deg) rotateY(0deg); } 100% { transform: rotateX(-18deg) rotateY(360deg); } }
.hero-title { font-size: 23px; line-height: 1.35; color: var(--navy); margin: 14px 0 6px; font-weight: 700; }
.hero-title-line { display: block; }
.hero-title-static { background: var(--grad-brand); -webkit-background-clip: text; background-clip: text; color: transparent; }
.scroll-container { height: 34px; overflow: hidden; display: inline-block; vertical-align: bottom; }
.scroll-wrap { display: flex; flex-direction: column; animation: vscroll 10s cubic-bezier(.4, 0, .2, 1) infinite; }
.scroll-item { height: 34px; line-height: 34px; white-space: nowrap; }
.hero-sub-scroll { height: 20px; max-width: 340px; }
.hero-sub-scroll .scroll-item { height: 20px; line-height: 20px; font-size: 12px; color: var(--text-2); }
@keyframes vscroll { 0%, 27% { transform: translateY(0); } 33%, 60% { transform: translateY(-25%); } 66%, 93% { transform: translateY(-50%); } 100% { transform: translateY(-75%); } }

/* 三步引导 */
.hero-steps { display: flex; align-items: center; justify-content: center; gap: 4px; margin: 22px auto 0; }
.step { display: flex; align-items: center; gap: 7px; }
.step .dot { width: 26px; height: 26px; border-radius: 50%; background: var(--primary-soft); color: var(--primary-deep); font-size: 12.5px; font-weight: 800; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(22, 119, 255, .2); flex-shrink: 0; }
.step b { font-size: 12.5px; font-weight: 700; color: var(--navy); white-space: nowrap; }
.st-arrow { color: var(--text-3); font-size: 15px; margin: 0 3px; opacity: .55; flex-shrink: 0; }

/* 对话框 + 场景卡 */
.hero-bottom { width: 100%; margin-top: 46px; display: flex; flex-direction: column; align-items: center; }
.hero-box { width: 100%; max-width: 440px; background: var(--surface); border: 1px solid var(--border); border-radius: 20px; padding: 10px 12px 11px; box-shadow: var(--shadow-card); display: flex; flex-direction: column; transition: border-color .2s, box-shadow .2s; }
.hero-box:focus-within { border-color: rgba(22, 119, 255, .45); box-shadow: 0 2px 4px rgba(16, 24, 40, .04), 0 14px 34px rgba(22, 119, 255, .14); }
.hero-box .hb-field { display: flex; align-items: center; gap: 8px; padding: 2px 2px 2px 8px; }
.hero-box .hb-mic { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--text-2); cursor: pointer; transition: all .18s ease; flex-shrink: 0; background: #f1f5fb; }
.hero-box .hb-mic:hover { background: var(--primary-soft); color: var(--primary); }
.hero-box .hb-mic svg { width: 19px; height: 19px; }
.hero-box .hb-input { flex: 1; border: none; outline: none; font-size: 14px; color: var(--text-1); background: transparent; min-height: 52px; line-height: 1.5; font-family: inherit; }
.hero-box .hb-input::placeholder { color: var(--text-3); font-weight: 400; }
.hero-box textarea.hb-input { resize: none; overflow: hidden; padding: 15px 2px; line-height: 1.5; box-sizing: border-box; }
.hero-box .hb-send { width: 44px; height: 44px; border-radius: 50%; background: var(--grad-brand); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 4px 12px rgba(22, 119, 255, .3); transition: all .18s ease; flex-shrink: 0; }
.hero-box .hb-send:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(22, 119, 255, .38); }
.hero-box .hb-send:active { transform: scale(.92); filter: brightness(.95); }
.hero-box .hb-send svg { width: 19px; height: 19px; }
.hero-bottom .hb-scroll { width: 100%; max-width: 440px; display: flex; gap: 8px; overflow-x: auto; margin-top: 12px; padding: 2px 2px 4px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.hero-bottom .hb-scroll::-webkit-scrollbar { display: none; }
.hero-bottom .hb-scroll .hb-card { flex: 0 0 auto; width: 104px; min-height: 64px; text-align: left; background: var(--primary-soft); border: 1px solid rgba(22, 119, 255, .14); border-radius: 14px; padding: 8px 11px; cursor: pointer; transition: all .18s ease; display: flex; flex-direction: column; }
.hero-bottom .hb-scroll .hb-card:hover { background: var(--primary-light); border-color: rgba(22, 119, 255, .3); transform: translateY(-2px); box-shadow: 0 6px 16px rgba(22, 119, 255, .14); }
.hero-bottom .hb-scroll .hb-card:active { transform: scale(.97); }
.hero-bottom .hb-scroll .hb-card .c-top { display: flex; align-items: center; gap: 5px; }
.hero-bottom .hb-scroll .hb-card .c-ic { width: 15px; height: 15px; color: var(--primary); flex-shrink: 0; }
.hero-bottom .hb-scroll .hb-card .c-name { font-size: 12.5px; font-weight: 700; color: var(--primary-deep); white-space: nowrap; }
.hero-bottom .hb-scroll .hb-card .c-txt { font-size: 10px; color: var(--text-2); margin-top: 3px; line-height: 1.3; }
.hero-foot { margin-top: 14px; text-align: center; font-size: 11px; color: var(--text-3); line-height: 1.8; }

/* ============ 通用 ============ */
.mp-tag-main { display: inline-block; font-size: 10px; background: linear-gradient(135deg, #fa8c16, #fa541c); color: #fff; border-radius: 10px; padding: 2px 8px; margin-left: 6px; vertical-align: middle; font-weight: 600; }
.mpt-sub { font-size: 11px; color: var(--text-3); margin-top: 2px; }
.empty-state { text-align: center; padding: 48px 20px; color: var(--text-3); font-size: 13px; }
.es-icon { font-size: 40px; margin-bottom: 10px; }
.empty-state .btn-primary { margin-top: 16px; min-height: 42px; font-size: 14px; }

/* ============ 智能问答 ============ */
.chat-body { background: var(--bg); }
.chat-input-bar { background: var(--surface); border-top: none; box-shadow: 0 -1px 14px rgba(16, 24, 40, .08); flex-shrink: 0; }
.chat-quick { display: flex; gap: 8px; padding: 4px 12px calc(14px + env(safe-area-inset-bottom)); overflow-x: auto; scrollbar-width: none; }
.chat-quick::-webkit-scrollbar { display: none; }
.chat-quick:empty { display: none; }
.cq-chip { white-space: nowrap; font-size: 12px; color: var(--primary); background: var(--primary-soft); border-radius: 14px; padding: 8px 13px; cursor: pointer; min-height: 34px; transition: all .15s; }
.cq-chip:hover { background: var(--primary-light); }
.cq-chip:active { background: var(--primary); color: #fff; }
.chat-input-row { display: flex; gap: 8px; padding: 4px 12px 8px; align-items: flex-end; }
.chat-input-row input, .chat-input-row textarea { flex: 1; height: 48px; min-height: 48px; min-width: 0; border: 1px solid var(--border-strong); border-radius: 24px; padding: 14px 18px; font-size: 14px; line-height: 1.5; background: #f7f9fc; font-family: inherit; resize: none; overflow: hidden; box-sizing: border-box; transition: border-color .15s, box-shadow .15s, background .15s; }
.chat-input-row input:focus, .chat-input-row textarea:focus { border-color: var(--primary); outline: none; background: #fff; box-shadow: 0 0 0 3px rgba(22, 119, 255, .14); }
.chat-input-row button, .chat-input-row .send-btn { flex-shrink: 0; }

/* 修复移动端聚焦自动缩放与输入行溢出 */
@media (max-width: 767px) {
  .chat-input-row input, .chat-input-row textarea, .hero-box .hb-input, .hero-box textarea.hb-input { font-size: 16px; }
  .chat-input-row { padding: 4px 10px 8px; }
}
html, body { touch-action: manipulation; }
input, textarea, button, select { touch-action: manipulation; }

.msg { display: flex; margin-bottom: 14px; animation: msgIn .3s cubic-bezier(.22, 1, .36, 1); }
@keyframes msgIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.msg.bot { align-items: flex-start; }
.msg-bot-avatar { width: 36px; height: 36px; border-radius: 50%; background: transparent; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 17px; margin-right: 8px; flex-shrink: 0; overflow: hidden; }
.msg-bot-avatar img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; background: transparent; }
.msg-bubble { max-width: 78%; padding: 11px 13px; border-radius: 4px 14px 14px 14px; background: var(--surface); font-size: 13.5px; line-height: 1.6; box-shadow: var(--shadow-card); }
.msg.user { justify-content: flex-end; }
.msg.user .msg-bubble { background: var(--grad-brand); color: #fff; border-radius: 14px 4px 14px 14px; box-shadow: 0 2px 10px rgba(22, 119, 255, .22); }

/* typing 三点 */
.typing { display: inline-flex; gap: 4px; padding: 4px 2px; }
.typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--text-3); animation: tp 1s infinite; }
.typing span:nth-child(2) { animation-delay: .18s; }
.typing span:nth-child(3) { animation-delay: .36s; }
@keyframes tp { 0%, 60%, 100% { transform: translateY(0); opacity: .5; } 30% { transform: translateY(-4px); opacity: 1; } }

/* 推理链路卡 */
.chat-thinking { margin: 0 0 14px 44px; background: #f5f8ff; border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; max-width: 80%; animation: msgIn .3s ease; }
.ct-title { font-size: 12px; font-weight: 600; color: var(--navy); margin-bottom: 6px; }
.ct-step { font-size: 12px; color: var(--text-3); line-height: 1.9; transition: color .2s; }
.ct-step.done { color: var(--success); }

/* 需求回执气泡 */
/* 需求回执气泡（美化：左侧主色竖条 + 标题计数徽标 + 标签/值分离 chip） */
.slot-receipt { position: relative; margin: 2px 12px 14px 44px; max-width: calc(100% - 56px); background: linear-gradient(180deg, #f3f8ff, #eaf2ff); border: 1px solid #c9dbff; border-left: 3px solid var(--primary); border-radius: 8px; padding: 10px 12px 10px 13px; box-shadow: 0 2px 8px rgba(22, 119, 255, .06); animation: msgIn .3s ease; }
.sr-title { font-size: 12px; font-weight: 700; color: var(--navy); margin-bottom: 9px; display: flex; align-items: center; gap: 7px; }
.sr-count { font-size: 10.5px; font-weight: 700; color: #fff; background: var(--primary); border-radius: 999px; padding: 1px 7px; line-height: 1.6; }
.sr-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.sr-chip { font-size: 11px; background: #fff; border: 1px solid #dbe6fb; border-radius: 8px; padding: 3px 9px; display: inline-flex; align-items: center; gap: 4px; box-shadow: 0 1px 2px rgba(16, 24, 40, .03); }
.sr-k { color: var(--text-3); font-weight: 500; }
.sr-v { color: var(--primary-deep); font-weight: 700; }

/* 推荐结果卡 */
.chat-reco-card { margin: 4px 0 14px 44px; max-width: 82%; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px; box-shadow: var(--shadow-card); animation: msgIn .34s cubic-bezier(.22, 1, .36, 1); }
.crc-title { font-size: 13px; font-weight: 600; color: var(--navy); margin-bottom: 10px; display: flex; align-items: center; justify-content: center; gap: 6px; text-align: center; }
.chat-reco-item { display: flex; align-items: center; gap: 8px; padding: 9px 0; border-bottom: 1px solid #f0f2f7; }
.chat-reco-item:last-of-type { border-bottom: none; }
.cri-info { flex: 1; min-width: 0; }
.cri-name { font-size: 13px; font-weight: 500; }
.cri-sub { font-size: 11px; color: var(--text-3); margin-top: 2px; }
.cri-price { font-size: 14px; font-weight: 700; color: var(--price); white-space: nowrap; }
.cri-price small { font-size: 10px; color: var(--text-3); font-weight: 400; }
.cri-btn { background: var(--grad-brand); color: #fff; border: none; min-height: 32px; padding: 0 14px; border-radius: 16px; font-size: 12px; cursor: pointer; flex-shrink: 0; transition: filter .15s, transform .12s; }
.cri-btn:hover { filter: brightness(1.06); }
.cri-btn:active { transform: scale(.95); }
.cri-btn.added { background: var(--success); }
.crc-reason { font-size: 11px; color: var(--text-2); background: #f5f8ff; border-radius: 8px; padding: 8px 10px; margin-top: 8px; line-height: 1.6; }
.chat-reco-actions { display: flex; gap: 8px; margin-top: 10px; }
.chat-reco-actions button { flex: 1; min-height: 40px; font-size: 13px; }

/* ============ 意向单车 ============ */
.cart-item { position: relative; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 13px 40px 13px 14px; margin-bottom: 10px; display: flex; align-items: center; flex-wrap: wrap; gap: 12px; box-shadow: var(--shadow-card); }
.ci-icon { width: 42px; height: 42px; border-radius: 11px; background: var(--primary-soft); display: flex; align-items: center; justify-content: center; font-size: 21px; flex-shrink: 0; }
.ci-info { flex: 1; min-width: 0; }
.ci-name { font-size: 14px; font-weight: 600; }
.ci-sub { font-size: 11px; color: var(--text-3); margin-top: 3px; line-height: 1.4; }
/* 价格列：总价（说明行改为整行独立一行，见 .ci-earn-row，避免挤压左侧产品名） */
.ci-right { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; flex-shrink: 0; }
.ci-price { font-size: 15px; font-weight: 700; color: var(--price); white-space: nowrap; }
.ci-price small { font-size: 10px; color: var(--text-3); font-weight: 400; }
/* 保底价/增量收益说明：独占整行右对齐，不与产品名/总价争抢横向空间
   视觉语言与卡片内 .rt-earn 一致（纯文字 / 10px / 500 / 弱化灰 / 等宽数字） */
.ci-earn-row { flex-basis: 100%; margin-top: 2px; }
.ci-earn { font-size: 10px; line-height: 1.5; font-weight: 500; letter-spacing: .2px; color: var(--text-3); text-align: right; word-break: break-all; font-variant-numeric: tabular-nums; }
.ci-del { position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; border-radius: 50%; background: #f0f2f7; color: var(--text-3); display: flex; align-items: center; justify-content: center; font-size: 15px; cursor: pointer; flex-shrink: 0; transition: all .15s; }
.ci-del:hover { background: var(--danger-soft); color: var(--danger); }
.price-note-bar { display: flex; align-items: flex-start; gap: 6px; font-size: 11px; color: var(--warning); background: var(--warning-soft); border-radius: 8px; padding: 8px 12px; margin-bottom: 10px; line-height: 1.5; }
.price-note-bar .ic-svg { width: 14px; height: 14px; flex-shrink: 0; margin-top: 1px; }
.cart-total-row { display: flex; align-items: baseline; justify-content: flex-end; padding: 2px 2px 10px; font-size: 13px; color: var(--text-2); }
.cart-total { font-size: 20px; font-weight: 700; color: var(--price); }
.price-note { font-size: 11px; color: var(--text-3); margin-left: 4px; }

/* ============ 产品构成（意向产品清单） ============ */
.product-composition { margin: 2px 0 14px; }
.product-title { color: var(--navy); }
.product-title::before { background: var(--primary); }

/* ============ 费用构成分层卡片（方案A：周期/一次性分层 + 合计） ============ */
.fee-breakdown { margin: 2px 0 12px; }
.fb-title { font-size: 15px; font-weight: 600; color: var(--navy); margin: 6px 0 10px; display: flex; align-items: center; gap: 6px; }
.fb-title::before { content: ''; width: 4px; height: 14px; border-radius: 2px; background: var(--primary); }
.fee-block { border-radius: var(--radius); padding: 12px 14px; margin-bottom: 10px; box-shadow: var(--shadow-card); }
.fee-block:last-of-type { margin-bottom: 0; }
.fee-periodic { background: #f0f7ff; border: 1px solid #c9dbff; }
.fee-once { background: #fff7f0; border: 1px solid #ffd8b0; }
.fb-head { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
.fb-ic { font-size: 14px; line-height: 1; }
.fb-h { font-size: 13px; font-weight: 700; }
.fee-periodic .fb-h { color: #0958d9; }
.fee-once .fb-h { color: #d46b08; }
.fb-line { display: flex; justify-content: space-between; align-items: baseline; padding: 5px 0; font-size: 13px; }
.fb-line:not(:last-child) { border-bottom: 1px dashed rgba(16, 24, 40, .08); }
.fb-k { color: var(--text-2); }
.fb-v { font-size: 15px; font-weight: 700; color: var(--price); }
.fee-once .fb-v { color: var(--gold); }
.fee-total { display: flex; align-items: baseline; justify-content: space-between; margin-top: 10px; padding: 10px 14px; background: var(--primary-soft); border: 1px solid #c9dbff; border-radius: var(--radius); }
.ft-k { font-size: 13px; font-weight: 600; color: var(--navy); }
.ft-v { font-size: 18px; font-weight: 700; color: var(--price); }
.fee-note { font-size: 11px; color: var(--text-3); line-height: 1.5; margin-top: 8px; }

/* ============ 我的 ============ */
.mine-header { background: var(--grad-navy); border-radius: var(--radius); color: #fff; padding: 18px 16px; margin-bottom: 12px; }
.mine-user { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.mine-avatar { width: 48px; height: 48px; border-radius: 50%; background: rgba(255, 255, 255, .2); display: flex; align-items: center; justify-content: center; font-size: 24px; }
.mine-name { font-size: 16px; font-weight: 600; }
.mine-phone { font-size: 12px; opacity: .85; margin-top: 3px; }
.mine-stat { display: flex; }
.mine-stat-item { flex: 1; text-align: center; }
.msi-num { font-size: 19px; font-weight: 700; }
.msi-label { font-size: 11px; opacity: .8; margin-top: 2px; }
.mine-menu { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-card); margin-bottom: 12px; }
.mine-menu-item { display: flex; align-items: center; gap: 10px; padding: 0 14px; min-height: 50px; border-bottom: 1px solid #f0f2f7; cursor: pointer; font-size: 14px; transition: background .15s; }
.mine-menu-item:last-child { border-bottom: none; }
.mine-menu-item:hover { background: var(--primary-soft); }
.mine-menu-item:active { background: var(--primary-light); }
.mmi-icon { font-size: 18px; }
.mmi-name { flex: 1; }
.mmi-badge { background: var(--primary); color: #fff; font-size: 10px; min-width: 18px; height: 18px; border-radius: 9px; display: flex; align-items: center; justify-content: center; padding: 0 5px; margin-right: 6px; }
.mmi-arrow { color: var(--text-3); }
.section-title { font-size: 15px; font-weight: 600; color: var(--navy); margin: 4px 0 10px; display: flex; align-items: center; gap: 6px; }
.section-title::before { content: ''; width: 4px; height: 14px; border-radius: 2px; background: var(--primary); }

/* 意向单列表项（「我的意向单」/ 意向单进度 共用） */
.order-item { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 13px 14px; margin-bottom: 10px; box-shadow: var(--shadow-card); cursor: pointer; transition: transform .12s, box-shadow .15s; }
.order-item:hover { box-shadow: var(--shadow-pop); }
.order-item:active { transform: scale(.99); }
.oi-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.oi-no { font-size: 12px; color: var(--text-3); }
.oi-status { font-size: 11px; font-weight: 600; padding: 3px 8px; border-radius: 4px; }
.oi-status.warning { background: var(--warning-soft); color: var(--warning); }
.oi-status.primary { background: var(--primary-soft); color: var(--primary); }
.oi-status.gold { background: var(--gold-soft); color: var(--gold); }
.oi-status.success { background: var(--success-soft); color: var(--success); }
.oi-name { font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.oi-meta { font-size: 12px; color: var(--text-3); display: flex; justify-content: space-between; }
.oi-price { color: var(--price); font-weight: 700; }

/* 状态时间线 */
.timeline { display: flex; align-items: flex-start; padding: 16px 4px 6px; }
.tl-node { flex: 1; text-align: center; position: relative; }
.tl-node::before { content: ''; position: absolute; top: 8px; left: -50%; width: 100%; height: 2px; background: var(--border); }
.tl-node:first-child::before { display: none; }
.tl-node.done::before { background: var(--success); }
.tl-dot { width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 2px solid var(--border); margin: 0 auto 6px; position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; font-size: 11px; color: #fff; }
.tl-node.done .tl-dot { background: var(--success); border-color: var(--success); }
.tl-node.current .tl-dot { background: var(--primary); border-color: var(--primary); box-shadow: 0 0 0 4px rgba(22, 119, 255, .15); }
.tl-label { font-size: 11px; color: var(--text-3); }
.tl-node.done .tl-label, .tl-node.current .tl-label { color: var(--navy); font-weight: 600; }
.tl-time { font-size: 10px; color: var(--text-3); margin-top: 2px; }

/* 信息行 */
.info-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 4px 14px; box-shadow: var(--shadow-card); margin-bottom: 12px; }
.info-row { display: flex; justify-content: space-between; align-items: center; padding: 11px 0; border-bottom: 1px solid #f0f2f7; font-size: 13px; }
.info-row:last-child { border-bottom: none; }
.info-row .label { color: var(--text-3); flex-shrink: 0; margin-right: 12px; }
.info-row .val { color: var(--text-1); text-align: right; word-break: break-all; }

/* ============ 产品详情 ============ */
.detail-banner { height: 110px; border-radius: var(--radius); background: var(--grad-navy); display: flex; align-items: center; justify-content: center; font-size: 48px; margin-bottom: 12px; color: #fff; }
.detail-banner.broadband { background: var(--grad-blue); }
.detail-banner.ftto { background: linear-gradient(135deg, #13c2c2, #0958d9); }
.detail-info { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; margin-bottom: 12px; box-shadow: var(--shadow-card); }
.detail-info h2 { font-size: 18px; color: var(--navy); margin-bottom: 6px; }
.detail-sub { font-size: 12px; color: var(--text-2); line-height: 1.6; margin-bottom: 10px; }
.high-tag { display: inline-block; font-size: 11px; color: var(--primary); background: var(--primary-soft); padding: 3px 8px; border-radius: 4px; margin: 0 6px 6px 0; }
.detail-tabs { display: flex; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius) var(--radius) 0 0; overflow: hidden; }
.detail-tab { flex: 1; text-align: center; padding: 13px 0; font-size: 14px; color: var(--text-2); cursor: pointer; position: relative; min-height: 46px; transition: color .15s, background .15s; }
.detail-tab:hover { background: var(--primary-soft); }
.detail-tab.active { color: var(--primary); font-weight: 600; }
.detail-tab.active::after { content: ''; position: absolute; bottom: -1px; left: 30%; right: 30%; height: 3px; border-radius: 2px; background: var(--primary); }
.detail-pane { background: var(--surface); border: 1px solid var(--border); border-top: none; border-radius: 0 0 var(--radius) var(--radius); padding: 14px; margin-bottom: 12px; box-shadow: var(--shadow-card); }
.comp-section { margin-bottom: 14px; }
.comp-section:last-child { margin-bottom: 0; }
.comp-title { font-size: 14px; font-weight: 600; color: var(--navy); margin-bottom: 4px; }
.comp-sub { font-size: 12px; color: var(--text-3); margin-bottom: 8px; }
.comp-item { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid #f0f2f7; font-size: 13px; }
.comp-item:last-child { border-bottom: none; }
.ci-cat { flex-shrink: 0; width: 62px; font-size: 11px; color: var(--primary); background: var(--primary-soft); border-radius: 4px; padding: 2px 0; text-align: center; }
.ci-model { flex: 1; color: var(--text-1); }
.ci-qty { color: var(--text-3); font-size: 12px; white-space: nowrap; }
.price-hidden { font-size: 11px; color: var(--warning); background: var(--warning-soft); border-radius: 8px; padding: 8px 12px; margin-top: 10px; line-height: 1.5; }
.sol-item { padding: 10px 0; border-bottom: 1px solid #f0f2f7; }
.sol-item:last-child { border-bottom: none; }
.sol-name { font-size: 13px; font-weight: 600; color: var(--navy); margin-bottom: 4px; }
.sol-desc { font-size: 12px; color: var(--text-2); line-height: 1.6; }
.case-item { padding: 10px 0; border-bottom: 1px solid #f0f2f7; }
.case-item:last-child { border-bottom: none; }
.case-title { font-size: 13px; font-weight: 600; margin-bottom: 4px; }
.case-desc { font-size: 12px; color: var(--text-2); line-height: 1.6; }

/* ============ 提交页 ============ */
.order-selected { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 14px; margin-bottom: 8px; box-shadow: var(--shadow-card); display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.os-info { flex: 1; min-width: 0; }
.os-name { font-size: 14px; font-weight: 600; }
.os-sub { font-size: 11px; color: var(--text-3); margin-top: 2px; }
.os-price { font-size: 15px; font-weight: 700; color: var(--price); white-space: nowrap; }
/* 确认页价格列：与购物车同构（说明行独占整行右对齐） */
.os-right { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; flex-shrink: 0; }
.os-earn { margin-top: 0; }
.order-form { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 4px 14px 14px; box-shadow: var(--shadow-card); margin-bottom: 12px; }
.of-row { padding: 12px 0; border-bottom: 1px solid #f0f2f7; }
.of-row:last-child { border-bottom: none; }
.of-label { font-size: 13px; color: var(--text-2); margin-bottom: 8px; display: flex; align-items: center; gap: 4px; }
.of-label .req { color: var(--danger); }
.of-input { width: 100%; height: 46px; border: 1px solid var(--border-strong); border-radius: 10px; padding: 0 14px; font-size: 14px; background: #fafbfd; transition: border-color .15s, box-shadow .15s; }
.of-input:focus { border-color: var(--primary); outline: none; background: #fff; box-shadow: 0 0 0 3px rgba(22, 119, 255, .12); }
.of-input.err { border-color: var(--danger); }
.of-verify-ok { font-size: 12px; color: var(--success); margin-top: 6px; }
.of-loc { display: flex; align-items: center; gap: 10px; min-height: 46px; cursor: pointer; padding: 8px 12px; background: #fafbfd; border: 1px solid var(--border-strong); border-radius: 10px; transition: border-color .15s, background .15s; }
.of-loc:hover { border-color: var(--primary); background: #fff; }
.of-loc-text { flex: 1; font-size: 14px; color: var(--text-1); }
.of-loc-text.placeholder { color: var(--text-3); }
.of-loc-geo { font-size: 11px; color: var(--text-3); margin-top: 4px; }
.of-loc-arrow { color: var(--text-3); font-size: 18px; }
.order-total { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; box-shadow: var(--shadow-card); display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.order-total .ot-label { font-size: 13px; color: var(--text-2); }
.order-total .ot-val { font-size: 20px; font-weight: 700; color: var(--price); }
.order-total .ot-val small { font-size: 11px; color: var(--text-3); font-weight: 400; }

/* ============ 弹层 ============ */
.mask { position: absolute; inset: 0; background: rgba(16, 24, 40, .5); display: flex; align-items: center; justify-content: center; z-index: 200; padding: 24px; }
.dialog { background: var(--surface); border-radius: 16px; padding: 22px 18px; width: 100%; max-width: 320px; text-align: center; box-shadow: var(--shadow-pop); animation: popIn .26s cubic-bezier(.34, 1.56, .64, 1); }
@keyframes popIn { from { opacity: 0; transform: scale(.92) translateY(8px); } to { opacity: 1; transform: none; } }
.dialog-icon { width: 46px; height: 46px; border-radius: 50%; background: var(--warning-soft); color: var(--warning); font-size: 22px; display: flex; align-items: center; justify-content: center; margin: 0 auto 12px; }
.dialog-title { font-size: 16px; font-weight: 600; color: var(--navy); margin-bottom: 8px; }
.dialog-content { font-size: 13px; color: var(--text-2); line-height: 1.6; margin-bottom: 18px; }
.dialog-actions { display: flex; gap: 10px; }
.dialog-actions button { flex: 1; min-height: 42px; font-size: 14px; }
.drawer-close { width: 32px; height: 32px; border-radius: 50%; background: #f0f2f7; color: var(--text-2); display: flex; align-items: center; justify-content: center; font-size: 17px; cursor: pointer; }

/* 我的 侧滑抽屉（从右向左滑出） */
.mine-drawer-mask { position: absolute; inset: 0; background: rgba(16, 24, 40, .5); z-index: 205; opacity: 0; visibility: hidden; transition: opacity .28s ease, visibility .28s ease; }
.mine-drawer-mask.open { opacity: 1; visibility: visible; }
.mine-drawer { position: absolute; top: 0; right: 0; height: 100%; width: 80%; max-width: 360px; background: var(--bg); z-index: 210; box-shadow: -8px 0 24px rgba(16, 24, 40, .18); transform: translateX(100%); visibility: hidden; transition: transform .28s cubic-bezier(.4, 0, .2, 1), visibility .28s; display: flex; flex-direction: column; }
.mine-drawer.open { transform: translateX(0); visibility: visible; }
.md-head { height: 56px; flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; padding: 0 12px 0 18px; background: var(--surface); border-bottom: 1px solid var(--border); }
.md-title { font-size: 16px; font-weight: 600; color: var(--navy); }
.md-body { flex: 1; min-height: 0; overflow-y: auto; padding: 12px; }

/* 地图弹层 */
.map-sheet { background: var(--surface); border-radius: 12px; width: 100%; max-width: 340px; overflow: hidden; display: flex; flex-direction: column; box-shadow: var(--shadow-pop); animation: popIn .26s cubic-bezier(.34, 1.56, .64, 1); }
.map-head { display: flex; align-items: center; justify-content: space-between; padding: 14px; border-bottom: 1px solid var(--border); }
.map-title { font-size: 15px; font-weight: 600; color: var(--navy); }
.map-search { padding: 10px 14px 0; position: relative; }
.map-search input { width: 100%; height: 42px; border: 1px solid var(--border-strong); border-radius: 10px; padding: 0 12px; font-size: 13px; background: #f7f9fc; transition: border-color .15s, box-shadow .15s; }
.map-search input:focus { border-color: var(--primary); outline: none; background: #fff; box-shadow: 0 0 0 3px rgba(22, 119, 255, .12); }
.map-suggest { position: absolute; left: 14px; right: 14px; top: 52px; background: #fff; border: 1px solid var(--border); border-radius: 10px; box-shadow: var(--shadow-pop); z-index: 5; overflow: hidden; }
.map-suggest-item { padding: 10px 12px; font-size: 13px; cursor: pointer; border-bottom: 1px solid #f0f2f7; transition: background .15s; }
.map-suggest-item:last-child { border-bottom: none; }
.map-suggest-item:hover { background: var(--primary-soft); }
.map-suggest-item:active { background: var(--primary-light); }
.map-canvas { position: relative; height: 210px; margin: 12px 14px; border-radius: 8px; overflow: hidden; background: #edf1f7; cursor: crosshair; }
.map-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(22, 119, 255, .08) 1px, transparent 1px), linear-gradient(90deg, rgba(22, 119, 255, .08) 1px, transparent 1px); background-size: 26px 26px; }
.map-grid::before { content: ''; position: absolute; left: 0; right: 0; top: 46%; height: 12px; background: rgba(250, 140, 22, .14); transform: rotate(-6deg); }
.map-grid::after { content: ''; position: absolute; top: 0; bottom: 0; left: 38%; width: 10px; background: rgba(22, 119, 255, .1); transform: rotate(4deg); }
.map-pin { position: absolute; font-size: 26px; transform: translate(-50%, -100%); z-index: 2; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .3)); animation: pinDrop .3s cubic-bezier(.34, 1.56, .64, 1); }
@keyframes pinDrop { from { opacity: 0; transform: translate(-50%, -140%); } to { opacity: 1; transform: translate(-50%, -100%); } }
.map-hint { position: absolute; left: 50%; top: 14px; transform: translateX(-50%); font-size: 11px; color: var(--text-2); background: rgba(255, 255, 255, .9); padding: 4px 12px; border-radius: 12px; z-index: 2; }
.map-foot { padding: 0 14px 14px; }
.map-loc-info { font-size: 12px; color: var(--text-2); background: #f5f8ff; border: 1px solid var(--border); border-radius: 10px; padding: 9px 12px; margin-bottom: 10px; line-height: 1.6; }
.map-loc-info b { color: var(--navy); }

/* ============ 成功页 ============ */
.success-wrap { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 32px; }
.success-icon { width: 72px; height: 72px; border-radius: 50%; background: var(--success-soft); color: var(--success); font-size: 36px; display: flex; align-items: center; justify-content: center; margin-bottom: 18px; animation: popIn .34s cubic-bezier(.34, 1.56, .64, 1); }
.success-wrap h2 { font-size: 19px; color: var(--navy); margin-bottom: 8px; }
.success-no { font-size: 13px; color: var(--text-2); margin-bottom: 6px; }
.success-no span { font-weight: 600; color: var(--navy); }
.success-btns { width: 100%; margin-top: 26px; display: flex; flex-direction: column; gap: 10px; }

/* ============ Toast ============ */
.toast { position: absolute; left: 50%; bottom: 110px; transform: translateX(-50%); background: rgba(16, 24, 40, .9); color: #fff; font-size: 13px; padding: 10px 18px; border-radius: 20px; z-index: 300; max-width: 80%; text-align: center; line-height: 1.5; box-shadow: var(--shadow-pop); animation: toastIn .2s ease; }
@keyframes toastIn { from { opacity: 0; transform: translateX(-50%) translateY(8px); } to { opacity: 1; transform: translateX(-50%); } }

/* ============ 首页改版（对话版，科技蓝 + 浅色卡片） ============ */
.home-a { background: var(--surface); }
.home-a-body { flex: 1; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: 0; display: flex; flex-direction: column; }
.hero { position: relative; flex: 0 0 auto; display: flex; flex-direction: column; justify-content: flex-start; padding: 30px 18px 80px; background: linear-gradient(180deg, #eaf2ff 0%, #f7faff 70%, #ffffff 100%); }
.hero .glow { position: absolute; width: 300px; height: 300px; border-radius: 50%; background: radial-gradient(circle, rgba(22, 119, 255, .14) 0%, transparent 66%); top: 28%; left: 50%; transform: translate(-50%, -50%); pointer-events: none; }
.hero-top { display: flex; flex-direction: column; align-items: center; text-align: center; margin-top: 52px; }
.hero-top .cube-wrap { margin: 2px 0; }
.hero-top .cube-scene { width: 108px; height: 108px; }
.hero-top .hero-title { margin: 22px 0 6px; }
.hero-steps { display: flex; align-items: center; justify-content: center; gap: 4px; margin: 22px auto 0; }
.step { display: flex; align-items: center; gap: 7px; }
.step .dot { width: 26px; height: 26px; border-radius: 50%; background: var(--primary-soft); color: var(--primary-deep); font-size: 12.5px; font-weight: 800; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(22, 119, 255, .2); flex-shrink: 0; }
.step b { font-size: 12.5px; font-weight: 700; color: var(--navy); white-space: nowrap; }
.st-arrow { color: var(--text-3); font-size: 15px; margin: 0 3px; opacity: .55; flex-shrink: 0; }
.hero-bottom { flex: 0 0 auto; display: flex; flex-direction: column; justify-content: flex-end; margin-top: 78px; }
.hero-box { background: var(--surface); border: 1px solid var(--border); border-radius: 20px; padding: 10px 12px 11px; box-shadow: var(--shadow-card); display: flex; flex-direction: column; }
.hero-box:focus-within { border-color: rgba(22, 119, 255, .45); box-shadow: 0 2px 4px rgba(16, 24, 40, .04), 0 14px 34px rgba(22, 119, 255, .14); }
.hero-box .hb-field { display: flex; align-items: center; gap: 8px; padding: 2px 2px 2px 8px; }
.hero-box .hb-mic { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--text-2); cursor: pointer; transition: all .18s ease; flex-shrink: 0; background: #f1f5fb; }
.hero-box .hb-mic:hover { background: var(--primary-soft); color: var(--primary); }
.hero-box .hb-mic svg { width: 19px; height: 19px; }
.hero-box .hb-input { flex: 1; border: none; outline: none; font-size: 14px; color: var(--text-1); background: transparent; min-height: 52px; line-height: 1.5; font-family: inherit; }
.hero-box .hb-input::placeholder { color: var(--text-3); font-weight: 400; }
.hero-box textarea.hb-input { resize: none; overflow: hidden; padding: 15px 2px; line-height: 1.5; box-sizing: border-box; }
.hero-box .hb-send { width: 44px; height: 44px; border-radius: 50%; background: var(--grad-brand); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 4px 12px rgba(22, 119, 255, .3); transition: all .18s ease; flex-shrink: 0; }
.hero-box .hb-send:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(22, 119, 255, .38); }
.hero-box .hb-send:active { transform: scale(.92); }
.hero-box .hb-send svg { width: 19px; height: 19px; }
.hero-bottom .hb-scroll { display: flex; gap: 8px; overflow-x: auto; margin-top: 12px; padding: 2px 2px 4px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.hero-bottom .hb-scroll::-webkit-scrollbar { display: none; }
.hero-bottom .hb-scroll .hb-card { flex: 0 0 auto; width: 104px; min-height: 64px; text-align: left; background: var(--primary-soft); border: 1px solid rgba(22, 119, 255, .14); border-radius: 14px; padding: 8px 11px; cursor: pointer; transition: all .18s ease; display: flex; flex-direction: column; }
.hero-bottom .hb-scroll .hb-card:hover { background: var(--primary-light); border-color: rgba(22, 119, 255, .3); transform: translateY(-2px); box-shadow: 0 6px 16px rgba(22, 119, 255, .14); }
.hero-bottom .hb-scroll .hb-card:active { transform: scale(.97); }
.hero-bottom .hb-scroll .hb-card .c-top { display: flex; align-items: center; gap: 5px; }
.hero-bottom .hb-scroll .hb-card .c-ic { width: 15px; height: 15px; color: var(--primary); flex-shrink: 0; }
.hero-bottom .hb-scroll .hb-card .c-name { font-size: 12.5px; font-weight: 700; color: var(--primary-deep); white-space: nowrap; }
.hero-bottom .hb-scroll .hb-card .c-txt { font-size: 10px; color: var(--text-2); margin-top: 3px; line-height: 1.3; }
.hero-foot { margin-top: 14px; text-align: center; font-size: 11px; color: var(--text-3); line-height: 1.8; }

/* 底部聊天抽屉 */
/* 全屏对话框页 #page-chat 复用 header（移除了独立底部抽屉 .sheet，首页发送统一进入此页） */
.sheet-head { background: var(--grad-navy); color: #fff; padding: 14px 16px; display: flex; align-items: center; gap: 11px; flex-shrink: 0; box-shadow: 0 2px 16px rgba(16, 24, 40, .18); }
.sheet-head .ht { flex: 1; }
.sheet-head .ht b { font-size: 15px; font-weight: 700; display: block; }
.sheet-head .ht span { font-size: 11.5px; opacity: .9; }
.sheet-head .close { width: 30px; height: 30px; border-radius: 50%; background: rgba(255, 255, 255, .2); color: #fff; font-size: 16px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; border: none; cursor: pointer; transition: background .15s; }
.sheet-head .close:hover { background: rgba(255, 255, 255, .35); }

/* ============ 全局悬浮助手 ============ */
/* 悬浮按钮：白底 + 浅灰描边（白底需边界才可见），hover 用淡蓝底呼应品牌色 */
.fab { position: absolute; right: 14px; bottom: 20px; width: 52px; height: 52px; border-radius: 50%; border: 1px solid var(--border); cursor: pointer; background: var(--surface); color: var(--text-2); font-size: 24px; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 18px rgba(16, 24, 40, .12); z-index: 40; transition: transform .15s, box-shadow .15s, background .15s, border-color .15s; }
.fab:hover { transform: translateY(-2px); background: var(--primary-soft); border-color: var(--primary-light); box-shadow: 0 10px 24px rgba(16, 24, 40, .16); }
.fab:active { transform: scale(.94); }
.fab.hidden { display: none; }
.fab .fab-icon img { width: 30px; height: 30px; border-radius: 50%; object-fit: contain; background: transparent; }

/* 智能问答页（全屏版对话框，严格复用弹出框设计规范） */
.chat-page-head .nav-home { color: #fff; font-size: 24px; line-height: 1; background: none; border: none; cursor: pointer; padding: 0 4px 0 0; margin-right: 2px; flex-shrink: 0; transition: opacity .15s; }
.chat-page-head .nav-home:active { opacity: .6; }
/* V4.x：对话页顶部品牌图标加白色衬底——红标直接压蓝底对比不足、笔画之间透出蓝底显脏；
   衬片取圆角方形（与首页顶栏 .brand-logo 口径一致，圆形容器会裁掉方形标的四角、圆角 8px 复用设计令牌）。
   消息头像仍保持透明，不加衬底。 */
.chat-page-head .msg-bot-avatar { background: #fff; padding: 4px; border-radius: 8px; }
.chat-page-head .msg-bot-avatar img { border-radius: 4px; }
#page-chat .chat-body { flex: 1; min-height: 0; overflow-y: auto; }

/* 全屏问答页底部标签栏：与首页底部场景卡视觉规格一致，支持横向滑动切换 */
#page-chat .chat-quick { display: flex; gap: 8px; overflow-x: auto; padding: 4px 12px calc(14px + env(safe-area-inset-bottom)); scrollbar-width: none; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; scroll-snap-type: x proximity; }
#page-chat .chat-quick::-webkit-scrollbar { display: none; }
#page-chat .chat-quick .hb-card { flex: 0 0 auto; width: 104px; min-height: 64px; scroll-snap-align: start; text-align: left; background: var(--primary-soft); border: 1px solid rgba(22, 119, 255, .14); border-radius: 14px; padding: 8px 11px; cursor: pointer; transition: all .18s ease; display: flex; flex-direction: column; }
#page-chat .chat-quick .hb-card:hover { background: var(--primary-light); border-color: rgba(22, 119, 255, .3); transform: translateY(-2px); }
#page-chat .chat-quick .hb-card:active { transform: scale(.97); }
#page-chat .chat-quick .hb-card .c-top { display: flex; align-items: center; gap: 5px; }
#page-chat .chat-quick .hb-card .c-ic { width: 15px; height: 15px; color: var(--primary); flex-shrink: 0; }
#page-chat .chat-quick .hb-card .c-name { font-size: 12.5px; font-weight: 700; color: var(--primary-deep); white-space: nowrap; }
#page-chat .chat-quick .hb-card .c-txt { font-size: 10px; color: var(--text-2); margin-top: 3px; line-height: 1.3; }

/* ============ 对话历史入口按钮 ============ */
.topbar-right { display: flex; align-items: center; gap: 6px; }
.chat-page-head .chat-history { width: 30px; height: 30px; border-radius: 50%; background: rgba(255, 255, 255, .2); color: #fff; font-size: 15px; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background .15s; }
.chat-page-head .chat-history:active { background: rgba(255, 255, 255, .35); }
.chat-page-head .chat-new { width: 30px; height: 30px; border-radius: 50%; background: rgba(255, 255, 255, .2); color: #fff; font-size: 17px; font-weight: 700; line-height: 1; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background .15s; }
.chat-page-head .chat-new:active { background: rgba(255, 255, 255, .35); }

/* ============ 响应式 / 等比缩放分层（修复移动端底部被遮挡） ============
   · 移动端（<768px，含手机/移动预览）：.phone-frame 随视口铺满、内部滚动，不做 transform 缩放；
     用 100dvh 规避移动浏览器地址栏导致的底部遮挡，body 不锁死滚动。
   · 桌面端（≥768px）：固定 430×900 设计框等比缩放居中，保留大屏演示能力。 */
/* ============ 推荐套餐卡（需求2：区分一次性费用/月租费；推荐套餐→升级→经济） ============ */
.chat-reco-card.v2 { max-width: 86%; }
.reco-line { margin-bottom: 12px; }
.reco-line:last-child { margin-bottom: 0; }
.reco-line-title { font-size: 12.5px; font-weight: 700; color: var(--navy); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
.reco-tier { background: var(--surface); border: 1px solid var(--border); border-radius: 4px; padding: 12px 14px; margin-bottom: 10px; box-shadow: 0 1px 2px rgba(16, 24, 40, .03); }
.reco-tier.reco-main { border-color: rgba(250, 140, 22, .42); background: linear-gradient(180deg, #fff8f0, #fffaf5); }
.reco-tier.reco-premium { border-color: rgba(22, 119, 255, .22); background: #fff; }
.reco-tier.reco-econ { border-color: rgba(22, 119, 255, .2); }
.reco-tier:last-child { margin-bottom: 0; }
.rt-main { display: flex; flex-direction: column; gap: 5px; }
.rt-row-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.rt-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; flex: 1; min-width: 0; }
.rt-badge { display: inline-flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 700; color: #fff; background: linear-gradient(135deg, #fa8c16, #fa541c); border-radius: 6px; padding: 2px 7px; line-height: 1.2; flex-shrink: 0; }
/* 保底价 + 增量收益说明（数据源：Excel 梳理表）
   设计定位：对上方总价的补充解释 → 纯文字，无底色/描边/内边距；
   右对齐与总价同基线，字号小于总价、颜色弱化，数字等宽对齐。 */
.rt-earn {
  display: block;
  max-width: 100%;
  margin-top: 5px;
  padding: 0;
  border: 0;
  background: none;
  font-size: 10px;
  line-height: 1.5;
  font-weight: 500;
  letter-spacing: .2px;
  color: var(--text-3);
  text-align: right;
  word-break: break-all;
  font-variant-numeric: tabular-nums;
}
.rt-name { font-size: 14px; font-weight: 600; color: var(--text-1); line-height: 1.45; word-break: break-all; }
.rt-sub { font-size: 11px; color: var(--text-3); line-height: 1.5; }
/* 价格区：总价 + 单位小字。两者右对齐同一基线，单位行紧贴总价正下方（不改动展示逻辑与数据）。 */
.rt-price { text-align: right; white-space: nowrap; flex-shrink: 0; display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-start; gap: 3px; }
.rt-price b { font-size: 17px; color: var(--price); font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; }
/* 单位小字：明显小于总价(10px vs 17px)、次级灰调、字重适中、微字间距；tabular-nums 保证与总价数字右边界对齐 */
.rt-price small { font-size: 10px; line-height: 1.2; color: var(--text-3); font-weight: 500; letter-spacing: .2px; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rt-fee { display: inline-flex; align-items: center; font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: 999px; line-height: 1.2; flex-shrink: 0; }
.rt-fee.ft-monthly { background: #e8f0ff; color: #0958d9; }
.rt-fee.ft-contract { background: #e7f7f3; color: #0d9488; }
.rt-fee.ft-once { background: #fff3e0; color: #d46b08; }
.rt-actions { display: flex; gap: 8px; margin-top: 10px; }
.reco-detail-btn { flex: 1; min-height: 34px; font-size: 12.5px; color: var(--text-2); background: #f5f8ff; border: 1px solid var(--border); border-radius: 8px; cursor: pointer; transition: background .15s; }
.reco-detail-btn:hover { background: var(--primary-soft); color: var(--primary); }
.reco-detail-btn:active { background: var(--primary-light); }
/* 推荐卡·追问提示：原卡默认仅展示「推荐套餐」；升级/经济两档通过点选追问，
   由「专属方案」独立新展示（.chat-ask-result）按其选择另行渲染，原卡本身不做任何展开/收起。 */
.reco-ask { margin: 0 0 10px; padding: 10px 12px; background: #f5f8ff; border: 1px dashed rgba(22, 119, 255, .32); border-radius: 4px; }
/* 整个推荐结果的追问提示仅在末尾统一展示一次（不随每个产品重复出现） */
.reco-ask-sole { margin-top: 12px; }
.reco-ask-sole .reco-ask { margin-bottom: 0; }
.ra-hint { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--text-2); margin-bottom: 8px; line-height: 1.5; }
.ra-hint .ic-svg { width: 14px; height: 14px; color: var(--primary); }
.ra-chip { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 38px; padding: 8px 10px; margin-bottom: 6px; background: var(--surface); border: 1px solid rgba(22, 119, 255, .22); border-radius: 4px; font-size: 12.5px; color: var(--navy); text-align: left; cursor: pointer; transition: background .15s, border-color .15s; }
.ra-chip:last-child { margin-bottom: 0; }
.ra-chip:hover { background: var(--primary-soft); border-color: var(--primary); }
.ra-chip:active { background: var(--primary-light); }
.ra-chip .ra-ic { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 20px; height: 20px; border-radius: 50%; background: var(--primary-soft); color: var(--primary); }
.ra-chip .ra-ic .ic-svg { width: 13px; height: 13px; }
.ra-chip .ra-txt { flex: 1; min-width: 0; line-height: 1.45; }
.ra-chip .ra-arrow { flex-shrink: 0; color: var(--primary); font-size: 15px; line-height: 1; }
.ra-chip.ra-down .ra-ic { background: rgba(250, 140, 22, .14); color: var(--warning); }
.reco-detail { margin-top: 10px; border-top: 1px dashed var(--border-strong); padding-top: 10px; }
.reco-detail.hidden { display: none; }
.rd-title { font-size: 11px; font-weight: 700; color: var(--navy); margin: 8px 0 6px; display: flex; align-items: center; gap: 6px; }
.rd-title::before { content: ''; width: 3px; height: 11px; border-radius: 2px; background: var(--primary); display: inline-block; }
.rd-title:first-child { margin-top: 0; }
.rd-row { display: flex; justify-content: space-between; align-items: center; font-size: 12px; padding: 5px 9px; background: #f7f9fc; border-radius: 7px; margin-bottom: 5px; }
.rd-row:last-child { margin-bottom: 0; }
.rd-k { color: var(--text-2); font-weight: 500; }
.rd-v { color: var(--text-1); font-weight: 600; }
.rd-item { display: flex; align-items: center; gap: 8px; font-size: 12px; padding: 6px 9px; background: #f7f9fc; border-radius: 7px; margin-bottom: 5px; }
.rd-item:last-child { margin-bottom: 0; }
.rd-cat { flex-shrink: 0; font-size: 10.5px; font-weight: 600; color: var(--primary-deep); background: var(--primary-soft); border-radius: 5px; padding: 2px 7px; min-width: 56px; text-align: center; }
.rd-model { flex: 1; color: var(--text-1); font-weight: 500; }
.rd-item.rd-svc { color: var(--text-2); background: var(--success-soft); }
.rd-item.rd-svc::before { content: '✓'; color: var(--success); font-weight: 700; margin-right: 2px; }

/* ============ 客户对话历史（需求3） ============ */
.hist-item { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 14px; margin-bottom: 10px; box-shadow: var(--shadow-card); }
.hist-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.hist-note { font-size: 14px; font-weight: 600; color: var(--navy); flex: 1; min-width: 0; word-break: break-all; }
.hist-note-input { flex: 1; font-size: 14px; font-weight: 600; color: var(--navy); border: 1px solid var(--primary); border-radius: 8px; padding: 6px 8px; outline: none; min-width: 0; }
.hist-edit { width: 28px; height: 28px; border-radius: 50%; background: #f0f2f7; color: var(--text-2); border: none; font-size: 13px; cursor: pointer; flex-shrink: 0; transition: background .15s; }
.hist-edit:hover { background: var(--primary-soft); color: var(--primary); }
.hist-meta { font-size: 11.5px; color: var(--text-3); margin-top: 4px; line-height: 1.5; word-break: break-all; }
.hist-msgs { color: var(--primary); font-weight: 600; }
.hist-items { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.hist-tag { font-size: 11px; color: var(--primary-deep); background: var(--primary-soft); border-radius: 6px; padding: 3px 8px; }
.hist-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; gap: 8px; }
.hist-time { font-size: 11px; color: var(--text-3); }
.hist-acts { display: flex; gap: 8px; }
.hist-btn { min-height: 32px; padding: 0 14px; font-size: 12px; border-radius: 16px; cursor: pointer; border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); transition: all .15s; }
.hist-btn:hover { background: #f7f9fc; }
.hist-btn.primary { background: var(--grad-brand); color: #fff; border: none; }

/* ============ 意向单流程推进（需求5） ============ */
.order-advance { display: flex; flex-direction: column; gap: 10px; }

:root {
  --design-w: 430px;        /* 设计基准宽度（逻辑像素） */
  --design-h: 900px;        /* 设计基准高度，与回归测试视口 430×900 一致 */
  --zoom: 1;                /* 统一缩放系数（配置项）：0.5 / 1 / 1.5 / 2（fixed 模式生效） */
  --scale-min: 0.4;         /* 自适应缩小下限 */
  --scale-max: 2.2;         /* 自适应放大上限（支持大屏 2x 演示） */
  /* 视口自适应系数：长度÷长度=无量纲数值（430px 不可省略，否则 100vw/430 为非法长度） */
  --fit-scale: min(calc(100vw / var(--design-w)), calc(100dvh / var(--design-h)));
}
/* 移动端默认：铺满、允许纵向滚动（解除底部遮挡） */
body { overflow-x: hidden; }
.phone-frame { transform: none; }

/* 桌面 / 大屏：固定 430 宽、高度跟随首页真实内容，整屏等比缩放居中。
   关键修复：用 zoom 做「真缩放」（同步缩小文档占位），使整页在 100% 浏览器缩放下即可完整显示，
   不再被 body{overflow:hidden} 裁掉底部（这正是此前 transform:scale 只缩视觉、不缩占位的坑）。 */
@media (min-width: 768px) {
  body {
    display: flex; align-items: center; justify-content: center;
    min-height: 100dvh; overflow: hidden;
    background: radial-gradient(125% 120% at 50% 0%, #EAF2FF 0%, #F3F5F9 52%, #EEF2F8 100%);
  }
  /* 默认（支持 zoom 的浏览器）：zoom 真缩放，布局占位同步缩小，整页 100% 即完整显示 */
  .phone-frame {
    width: var(--design-w);
    height: var(--design-h);
    max-width: none;
    margin: 0;
    border-radius: 30px;
    box-shadow: 0 30px 80px rgba(16, 24, 40, .20), 0 2px 10px rgba(16, 24, 40, .10);
    --scale: clamp(var(--scale-min), var(--fit-scale), var(--scale-max));
    transform: none;
    zoom: var(--scale);
  }
  /* 兜底：不支持 zoom 的浏览器（如旧版 Firefox）——不缩放，改为高度限视口 + 内部滚动，
     保证绝对不裁切（代价：内容很长时需在手机框内轻滚）。 */
  @supports not (zoom: 1) {
    .phone-frame { height: 100dvh; overflow-y: auto; zoom: 1; }
  }
}
/* 显式缩放模式：由 <html data-scale-mode="fixed"> 启用（仅桌面等比舞台生效），直接按 --zoom 放大缩小 */
:root[data-scale-mode="fixed"] .phone-frame { --scale: var(--zoom); }
/* 超宽屏（≥1600px）：提高等比放大上限，充分利用大屏空间 */
@media (min-width: 1600px) { :root { --scale-max: 2.6; } }

/* ============ 设计修复补充样式（全局 1/2/3：图标·圆角·FAB + 逐页关键建议） ============ */
/* 统一内联 SVG 图标基准尺寸（图标均无固有 width/height，必须显式给定） */
.ic-svg { width: 18px; height: 18px; flex-shrink: 0; }
.crc-title .ic-svg, .reco-line-title .ic-svg, .sr-title .ic-svg, .fb-title .ic-svg { width: 15px; height: 15px; }
/* index.html 内联 SVG 显式尺寸 */
.tu-avatar svg { width: 18px; height: 18px; }
.mine-avatar svg { width: 26px; height: 26px; }
.chat-history svg, .chat-new svg { width: 17px; height: 17px; }
.btn-voice svg { width: 20px; height: 20px; }
.dialog-icon svg { width: 22px; height: 22px; }
.map-title svg { width: 18px; height: 18px; vertical-align: -3px; }
.map-pin { color: var(--primary); }
.map-pin svg { width: 26px; height: 26px; }

/* 我的页底部版本信息（收尾空旷） */
.mine-foot { text-align: center; font-size: 11px; color: var(--text-3); padding: 26px 0 14px; line-height: 1.6; }

/* 详情页资费档位场景标签（区分同名档位） */
.tier-scene { display: inline-block; font-size: 10px; font-weight: 600; color: var(--primary-deep); background: var(--primary-soft); border-radius: 4px; padding: 1px 6px; margin-left: 6px; vertical-align: middle; }

/* 删除二次确认（armed 态高亮） */
.ci-del.armed { background: var(--danger); color: #fff; }

/* 生成意向单「已选产品」折叠摘要 */
.order-selected-summary { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 14px; margin-bottom: 8px; display: flex; justify-content: space-between; align-items: center; cursor: pointer; box-shadow: var(--shadow-card); }
.order-selected-summary .oss-info { font-size: 13px; color: var(--text-2); }
.order-selected-summary .oss-toggle { font-size: 12px; color: var(--primary); white-space: nowrap; margin-left: 10px; }
.order-collapse-btn { text-align: center; font-size: 12px; color: var(--primary); cursor: pointer; padding: 6px 0 2px; }

/* 成功页复制单号 */
.copy-no { margin-left: 8px; font-size: 12px; color: var(--primary); background: var(--primary-soft); border: 1px solid var(--primary); border-radius: 6px; padding: 2px 10px; cursor: pointer; vertical-align: 1px; transition: background .15s; }
.copy-no:active { background: var(--primary-light); }

/* 问答页快捷场景卡微提示 */
.chat-quick-hint { font-size: 11px; color: var(--text-3); padding: 2px 12px 0; margin-bottom: 2px; }

/* 地图弹层「当前定位」入口 */
.map-locate { width: 100%; min-height: 38px; margin-bottom: 10px; font-size: 12px; color: var(--primary); background: var(--primary-soft); border: 1px solid var(--primary); border-radius: 6px; cursor: pointer; transition: background .15s; }
.map-locate:active { background: var(--primary-light); }

/* FAB 在意向单页抬升，避免遮挡底部固定 CTA */
.fab-raise { bottom: 88px; }

/* 我的页统计卡改白底卡片 + 蓝色数字（硬朗理性风格） */
.mine-header { padding-bottom: 14px; }
.mine-stat { background: #fff; border-radius: var(--radius); padding: 14px 6px; margin-top: 4px; }
.mine-stat .msi-num { color: var(--primary-deep); }
.mine-stat .msi-label { color: var(--text-2); opacity: 1; }

/* 推荐卡内「未明确配置」提示（SVG 警示图标 + 橙字） */
.crc-warn { color: var(--warning); display: flex; align-items: center; gap: 5px; }
.crc-warn .ic-svg { width: 14px; height: 14px; }

/* 首页场景卡横向滚动暗示（右侧渐变遮罩） */
.hero-bottom .hb-scroll { position: relative; }
.hero-bottom .hb-scroll::after { content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 26px; background: linear-gradient(90deg, rgba(255, 255, 255, 0), var(--surface)); pointer-events: none; }

/* 顶部标签可读性（小幅提升字号 + 留白） */
.brand .tag { font-size: 11px; padding: 3px 9px; }

/* ============ 追问「专属方案」· 独立新展示 ============
   交互：用户在推荐套餐的追问区点选一个方向 → 按其选择生成一份「专属方案」独立新展示。
   约束：升级/经济互斥（一次仅展示被点选的那一档）；每份方案之后有且仅有一个追问；
        方案与追问一一对应；原推荐卡不做任何改动（本展示为全新独立追加节点）。
   视觉：完整复用「推荐套餐」构件（.chat-reco-card/.crc-title/.reco-line/.reco-tier/.reco-ask），
        与既有推荐套餐保持一致，无需重复定义卡片样式。 */
.chat-ask-result .reco-line:last-child { margin-bottom: 0; }
.chat-ask-result .reco-tier { margin-bottom: 10px; }
/* 追问区 → 底部操作区（查看全部产品 / 去意向单结算）之间留出间距 */
.chat-ask-result .reco-ask { margin-top: 2px; margin-bottom: 12px; }

/* ============ 无障碍：尊重 prefers-reduced-motion ============ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  .cube { animation: none !important; }
  .scroll-wrap { animation: none !important; transform: translateY(0) !important; }
  .typing span { animation: none !important; }
  .voice-pulse { animation: none !important; }
}
/* 订单详情行内说明（口径同 .ci-earn / .rt-earn） */
.od-net { display: block; font-size: 10px; font-weight: 500; letter-spacing: .2px; color: var(--text-3); text-align: right; font-variant-numeric: tabular-nums; margin-top: 2px; }