:root{
  /* 双主色：蓝＝主色（品牌/导航/结构），橙＝强调（价格/临近/待办）。
     全站只有这两级，不给每个城市一套主题色。 */
  --blue:#1e50ae; --blue-d:#17408c; --blue-m:#4a7ad4; --blue-l:#eef3fc;
  --orange:#e07b30; --orange-d:#c4621c; --orange-l:#fff5ec;
  --ink:#1a1d24; --ink2:#4a5261; --ink3:#7c8698;
  --line:#e3e7ee; --bg:#f5f7fa; --white:#fff;
  --win:#c62828; --win-bg:#fdeaea;
  --ok:#0f9d58; --ok-bg:#eaf7f0;
  --warn:#c2410c; --warn-bg:#fff4ec;
  --err:#d93025; --err-bg:#fdecea;
  --grad:linear-gradient(135deg,#17408c 0%,#2d6bd8 100%);
  --sp2:8px; --sp3:12px; --sp4:16px; --sp6:24px; --sp8:32px; --sp12:48px;
  --r-s:6px; --r-m:9px; --r-l:14px; --r-p:999px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(30,80,174,.10)}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  background:var(--bg); color:var(--ink); line-height:1.7; font-size:15px;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
.wrap{max-width:1080px;margin:0 auto;padding:0 16px}
.narrow{max-width:760px}
h1,h2,h3{line-height:1.4}
h1{font-size:25px;font-weight:700;letter-spacing:.2px}
h2{font-size:19px;font-weight:700;margin-bottom:var(--sp4)}
h3{font-size:16px;font-weight:600}
.muted{color:var(--ink2);font-size:13.5px}
.mini{color:var(--ink3);font-size:12.5px}

/* ---------- 顶栏 ---------- */
.topbar{background:var(--white);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.topbar .wrap{display:flex;align-items:center;gap:var(--sp6);height:60px}
.logo{display:flex;align-items:center;gap:9px;font-weight:700;font-size:16.5px;color:var(--ink)}
.logo:hover{text-decoration:none}
.logo .mk{width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,#1e50ae,#2d6bd8);
  color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}
.nav{display:flex;gap:var(--sp6);font-size:14.5px;margin-left:auto}
.nav a{color:var(--ink2)}
.nav a.on{color:var(--blue);font-weight:600}
.topbar .cta{background:var(--orange-d);color:#fff;border-radius:var(--r-m);padding:8px 15px;font-size:14px;font-weight:600}
.topbar .cta:hover{background:var(--orange);text-decoration:none}

/* ---------- Hero ---------- */
.hero{background:var(--grad);color:#fff;padding:38px 0 44px}
.hero h1{color:#fff;max-width:820px}
.hero .sub{opacity:.92;margin-top:12px;font-size:15px;max-width:760px;line-height:1.8}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.badge{background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.26);
  border-radius:var(--r-p);padding:4px 12px;font-size:12.5px}
.badge.plain{background:rgba(255,255,255,.1)}

/* 快捷查询已并入首页 #tools 第 1 张工具卡（.tool form / .tool .inp），
   原来的 .quick 一套样式随之删除——避免每页内联一段没人用的 CSS。 */
.btn{height:46px;border:0;border-radius:var(--r-m);font-size:15.5px;font-weight:600;font-family:inherit;
  cursor:pointer;padding:0 22px;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.btn.p{background:var(--blue);color:#fff}
.btn.p:hover{background:var(--blue-d)}
.btn.s{background:var(--white);color:var(--ink2);border:1.5px solid var(--line)}
.btn.g{background:transparent;color:var(--blue)}
.btn.b{width:100%}
.btn:disabled{opacity:.6;cursor:not-allowed}
/* 图标按钮（2026-10-07）：`.btn` 已是 inline-flex + gap:6px，加图标不破 46px 行高。
   `.bi` 尺寸写死在 17px 而不是 1em —— 图标要跟**视觉重量**走，不跟字号走，
   否则手机端字号一压图标就跟着缩成一个小点。 */
.btn .bi{width:17px;height:17px;flex:none;display:block}
.btn:active{transform:translateY(1px)}
.btn .bi+span{display:block}

/* 自测折叠条按钮化（2026-10-07 第五批，Ryan 需求 1）
   🔴 背景：自测卡的入口是 <details> 的 <summary>，收起时只显示一行灰字，
      用户看不出「这是个能点的按钮」，反馈是「和立即查询不一样」。
      改法是把 summary 本身穿上 .btn.p.b（蓝底实心 + 放大镜图标），
      与首页「立即查询」完全同源（都出自 btn_label()）。
   🔴 不动 .btn 本身：站上 20+ 处按钮复用同一条规则，给 .btn 加伪元素会全站波及。
   🔴 折叠箭头用 ::after 画边框三角而不是 ::marker：::marker 只能放字符、
      不能定型，且三角要跟 currentColor 走（蓝底白字时得是白三角）。
   🔴 `:active` 的两处反馈：位移来自 .btn:active（translateY(1px)），
      但触屏上 1px 几乎看不见 —— 所以这里额外加背景变深。这才是有感的「点击的感官」，
      也补上了移动端没有 :hover 的缺口。 */
.quiz-cta{list-style:none;display:flex;justify-content:center;width:100%}
.quiz-cta::-webkit-details-marker{display:none}
.quiz-cta::marker{content:none}
.quiz-cta::after{content:"";width:6px;height:6px;margin-left:3px;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-2px);transition:transform .16s}
details[open]>.quiz-cta::after{transform:rotate(225deg) translateY(-2px)}
.quiz-cta:active{background:var(--blue-d)}
.tool>details{margin-top:10px}

/* 🔴🔴 2026-10-08（Ryan：PC 一排四卡的「立即查询 / 立即自测 / 立即计算 / 免费绑定」
   要落在同一条水平线上）——四卡等高由栅格拉伸保证，但卡内内容长短不一，
   按钮各自漂在不同高度。改造前实测错位量：**北京 421px、深圳 129px**。
   机制拆成两半，缺一不可：
   · `.pin`＝主行动区（查询表单 / 折叠条 / 输入组 / 按钮块）margin-top:auto ——
     卡内余量全部吸收在它上方，行动区整体贴住卡脚位（`.tool>details{margin-top:10px}`
     是旧规则，`.tool>.pin` 两条类才压得过它）。
   · `.foot`＝卡脚位（对照表链接 / 免责短句 / 空占位），≥769px 强制 min-height:48px ——
     让「有脚注的卡」与「没脚注的卡」按钮基线严格一致。
   ⚠️ 48 而非 44：绑定卡脚注（免责句两行，实测 45.9px）是全场最高的脚注，
     基准必须罩得住它——44 会让那张卡的按钮高 1.9px（B14 闸门阈值只有 2px）。
   ⚠️ 只在 ≥769px 抬 min-height：手机端单列不需要对齐，白占高度没意义。
   ⚠️ 脚注里的次级按钮压到 38px 高，才装得进脚位（否则把上一行主按钮顶高）。 */
.tool>.pin{margin-top:auto}
.tool .foot{min-height:0}
.tool .foot>:first-child{margin-top:0}
.tool .foot .btn{height:38px}
@media(min-width:769px){
  .tool .foot{min-height:48px}
}

/* ---------- 区块 ---------- */
section{padding:var(--sp8) 0}
.sec-hd{display:flex;align-items:baseline;gap:var(--sp3);margin-bottom:var(--sp4);flex-wrap:wrap}
.sec-hd h2{margin:0;display:flex;align-items:center}
.sec-hd h2:before{content:"";flex:0 0 4px;width:4px;height:.92em;border-radius:2px;
  background:var(--orange);margin-right:9px}
.sec-hd .more{margin-left:auto;font-size:14px}
.card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);padding:var(--sp6)}
.grid{display:grid;gap:var(--sp4)}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}

/* 城市卡 */
.city-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);
  padding:18px;display:flex;flex-direction:column;gap:11px;transition:.16s;position:relative;overflow:hidden}
.city-card:hover{border-color:var(--blue-m);box-shadow:0 6px 22px rgba(24,44,90,.10);text-decoration:none}
.city-card .top{display:flex;align-items:center;gap:9px}
.plate{background:var(--blue);color:#fff;border-radius:var(--r-s);padding:3px 9px;
  font-size:13px;font-weight:700;letter-spacing:.5px}
.city-card .nm{font-size:17px;font-weight:700;color:var(--ink)}
.city-card .mode{font-size:12px;color:var(--ink3);border:1px solid var(--line);border-radius:var(--r-p);padding:1px 8px}
.city-card .line{font-size:13.5px;color:var(--ink2);display:flex;justify-content:space-between;gap:8px}
.city-card .line b{color:var(--ink);font-weight:600}
.city-card .foot{margin-top:auto;padding-top:10px;border-top:1px dashed var(--line);
  display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--ink3)}
.tag{display:inline-block;font-size:12px;border-radius:var(--r-s);padding:2px 8px;white-space:nowrap}
.tag.u{background:var(--orange-l);color:var(--orange-d)}
.tag.n{background:var(--blue-l);color:var(--blue)}
.tag.g{background:var(--ok-bg);color:var(--ok)}
.tag.w{background:var(--win-bg);color:var(--win)}

/* 服务卡 */
.svc-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);padding:18px;
  display:flex;flex-direction:column;gap:9px}
.svc-card .hd{display:flex;align-items:center;gap:9px}
.svc-card .ic{width:32px;height:32px;border-radius:var(--r-m);background:var(--blue-l);color:var(--blue);
  display:flex;align-items:center;justify-content:center;font-size:15px}
.svc-card .nm{font-size:16px;font-weight:700}
.svc-card .pri{margin-left:auto;font-size:13px;color:var(--orange-d);font-weight:600}
.svc-card p{font-size:13.5px;color:var(--ink2)}
.svc-card ul{list-style:none;font-size:13px;color:var(--ink2);display:flex;flex-direction:column;gap:5px}
.svc-card li{padding-left:16px;position:relative}
.svc-card li:before{content:"·";position:absolute;left:5px;color:var(--blue);font-weight:700}
.chips{display:flex;gap:5px;flex-wrap:wrap;margin-top:auto;padding-top:9px;border-top:1px dashed var(--line)}
.chip{font-size:11.5px;border-radius:var(--r-s);padding:2px 7px;background:var(--bg);color:var(--ink3)}
.chip.on{background:var(--blue-l);color:var(--blue);font-weight:600}
.svc-foot{margin-top:10px;padding-top:10px;border-top:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13.5px}
.svc-foot a{font-weight:600;white-space:nowrap}

/* ---------- 服务 / 总览页 ---------- */
.svc-hero{background:var(--grad);color:#fff;padding:30px 0 34px}
.svc-hero h1{color:#fff}
.svc-hero .sub{opacity:.93;margin-top:12px;font-size:15px;line-height:1.82;max-width:800px}
.metabar{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px;align-items:center}
.metabar .price{background:#fff;color:var(--blue-d);border-radius:var(--r-m);
  padding:8px 14px;font-weight:700;font-size:15px}
.metabar .pnote{font-size:12.5px;opacity:.86}
.cityswitch{display:flex;gap:7px;flex-wrap:wrap;margin-top:14px}
.cityswitch a{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.26);
  border-radius:var(--r-p);padding:4px 13px;font-size:13px;color:#fff}
.cityswitch a.on{background:#fff;color:var(--blue-d);font-weight:700;border-color:#fff}
.cityswitch a:hover{text-decoration:none;background:rgba(255,255,255,.24)}
.cityswitch a.on:hover{background:#fff}
.ic-mini{background:var(--blue-l);color:var(--blue);border-radius:var(--r-s);
  padding:2px 8px;font-size:11.5px;font-weight:700}
.panel .ic-mini{background:#fff}
.cols2{display:grid;grid-template-columns:1.18fr .82fr;gap:var(--sp6);align-items:start}
.panel{background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);padding:20px}
.panel.warn{background:var(--warn-bg);border-color:#f6d5b8}
.panel.info{background:var(--blue-l);border-color:#d3e0f7}
.panel h3{display:flex;align-items:center;gap:8px;margin-bottom:12px;font-size:15.5px}
.panel ul{list-style:none;display:flex;flex-direction:column;gap:9px;font-size:13.5px;
  color:var(--ink2);line-height:1.78}
.panel ul li{padding-left:15px;position:relative}
.panel ul li:before{content:"·";position:absolute;left:4px;color:var(--blue);font-weight:700}
.panel.warn ul li:before{color:var(--warn)}
.steps{list-style:none;counter-reset:s;margin-left:14px}
.steps li{counter-increment:s;position:relative;padding:0 0 22px 44px;
  border-left:2px solid var(--line)}
.steps li.last{border-left-color:transparent;padding-bottom:0}
.steps li:before{content:counter(s);position:absolute;left:-15px;top:-3px;width:28px;height:28px;
  border-radius:50%;background:var(--blue);color:#fff;font-size:13px;font-weight:700;
  display:flex;align-items:center;justify-content:center}
.steps .st{font-size:15px;font-weight:600;margin-bottom:3px}
.steps .sd{font-size:13.5px;color:var(--ink2);line-height:1.78}
.nodes-dark{background:var(--blue-d);border-radius:var(--r-l);padding:20px;margin-top:var(--sp8)}
.nodes-dark .nodes{margin-top:0}


/* ---------- 服务页新区块（2026-10-13）：痛点 / 优势 / 材料 ----------
   🔴 移动端优先：断点 1024/768/560 三档，与站点既有口径一致；
      ≤560 全单列 + 内边距收窄 + 触控目标 ≥44px；min-width:0 防栅格撑破。 */
.svc-pains{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp4)}
.svc-pain{background:var(--white);border:1px solid var(--line);border-left:4px solid var(--orange);
  border-radius:var(--r-m);padding:16px;min-width:0}
.svc-pain b{display:block;font-size:14.5px;margin-bottom:5px}
.svc-pain p{font-size:13.5px;color:var(--ink2);line-height:1.75}
.svc-advs{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp6)}
.svc-adv{display:flex;gap:12px;min-width:0}
.svc-adv .n{flex:0 0 32px;height:32px;border-radius:50%;background:var(--blue-l);color:var(--blue);
  font-weight:700;display:flex;align-items:center;justify-content:center;font-size:14px}
.svc-adv h3{font-size:15px;margin-bottom:4px}
.svc-adv p{font-size:13.5px;color:var(--ink2);line-height:1.78}
.svc-mats{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp4)}
.svc-mat{background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);padding:18px;min-width:0}
.svc-mat h3{display:flex;align-items:center;gap:8px;padding-bottom:10px;
  border-bottom:1px solid var(--line);margin-bottom:12px;font-size:15.5px}
.svc-mat h3 .who{font-size:12px;font-weight:600;color:#fff;background:var(--blue-m);
  padding:1px 8px;border-radius:var(--r-p)}
.svc-mat ul{list-style:none;display:flex;flex-direction:column;gap:8px}
.svc-mat li{font-size:13.5px;color:var(--ink2);padding-left:19px;position:relative;line-height:1.75}
.svc-mat li:before{content:"\2713";position:absolute;left:0;color:var(--ok);font-weight:700}
/* 🔴 2026-10-13：原 ≤1024 把「为什么选我们的服务」降成两列 ⇒ 3 张卡排成 2+1。
   Ryan 第 4 条（PC 改一排 3 个）后此覆盖删除：>768 一律 3 列，≤768 单列。 */
/* @media(max-width:1024px){.svc-advs{grid-template-columns:1fr 1fr}} —— 已删 */
@media(max-width:768px){
  .svc-pains{grid-template-columns:1fr 1fr}
  .svc-advs,.svc-mats{grid-template-columns:1fr}
  .svc-advs{gap:var(--sp4)}
}
@media(max-width:560px){
  .svc-pains{grid-template-columns:1fr}
  .svc-pain,.svc-mat{padding:14px}
  .svc-adv{gap:10px}
  .svc-adv .n{flex:0 0 28px;height:28px;font-size:13px}
}

/* ================================================================
   服务页 v3 重设计（2026-10-13 · Ryan：不喜欢现在的设计 → 重新设计一版，兼顾重视移动端）
   设计意图：把「信息罗列」改成「有节奏的转化动线」
     · Hero 信息分层（eyebrow → 价值主张 → 导语 → **主 CTA + 价格** → 事实条）
       —— 原来是「标题→导语→价格→城市」的平铺，首屏没有行动入口。
     · 痛点从「4 列卡片」改成**编号列表** —— 更像用户留言，移动端一屏能扫完。
     · 优势从「编号 + 长描述」改成**图标卡**（图标 + 标题 + 一句话），扫读成本更低。
     · 服务包含从 panel 列表改成**两列紧凑清单**（左标签 + 右说明），信息密度更高。
     · 流程区之后加**中部咨询条**，页中再给一次行动入口。
   ⚠️ 不做吸底 CTA —— 站点已有 .mnav（移动底部导航 58px，fixed）占着底部，
      再加一条会与它打架；body 的 padding-bottom 也已按 .mnav 调好。
   ================================================================ */

/* ① Hero 信息分层 */
.h-eyebrow{display:inline-block;font-size:12px;letter-spacing:.1em;font-weight:600;
  background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25);
  padding:4px 13px;border-radius:var(--r-p);margin-bottom:14px;color:#d8e6ff}
.svc-hero h1{font-size:26px;line-height:1.42;letter-spacing:.2px;margin-bottom:12px}
.h-cta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:20px 0 14px}
.btn-h{background:var(--orange);color:#fff;font-weight:700;padding:14px 28px;
  border-radius:var(--r-p);font-size:15.5px;box-shadow:0 6px 18px rgba(224,123,48,.34);
  display:inline-flex;align-items:center;justify-content:center}
.btn-h:hover{background:var(--orange-d);text-decoration:none;color:#fff}
.h-price{background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.28);
  color:#fff;font-weight:700;padding:8px 17px;border-radius:var(--r-p);font-size:14.5px}
.h-facts{display:flex;gap:20px;flex-wrap:wrap;font-size:13.5px;color:#c4d6f5;
  padding-top:14px;border-top:1px solid rgba(255,255,255,.16)}
.h-facts b{color:#fff;font-size:18px;font-weight:800;margin-right:3px}

/* ② 痛点：编号列表 */
.pains2{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--sp8);
  background:#fff;border:1px solid var(--line);border-radius:var(--r-l);
  padding:6px var(--sp6)}
.p2{display:flex;gap:14px;padding:18px 0;border-bottom:1px solid var(--line);min-width:0}
.p2 .n{flex:0 0 30px;font-size:13px;font-weight:800;color:var(--orange);
  letter-spacing:.06em;padding-top:3px}
.p2 b{display:block;font-size:15px;line-height:1.55;margin-bottom:5px}
.p2 span{font-size:13.5px;color:var(--ink2);line-height:1.7}

/* ③ 优势：纯文字卡（2026-10-14 Ryan：**去图标**，其他服务页同款） */
/* 🔴 2026-10-14 Ryan 两条定调：
   ① **不带图标** —— 数据里的 icon 字段保留（SVC_BLOCKS.advs 三元组不动），渲染层不再输出；
   ② 列数按卡片数量自适应（.cols-N，列数由 `_grid_cols()` 在构建期算）：
      3 个 → 3 列；4 个 → 2 列（2×2）；「不要有缺角缺块」。
   手机（≤768）仍单列，见下方媒体查询。 */
.advs2{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp4)}
.a2{background:#fff;border:1px solid var(--line);
  border-radius:var(--r-l);padding:20px;min-width:0}
.a2:hover{border-color:var(--blue-m)}
.a2 h3{font-size:15.5px;margin-bottom:6px;line-height:1.45}
.a2 p{font-size:13.5px;color:var(--ink2);line-height:1.78}

/* 服务页卡片列数（2026-10-14）：由 `_grid_cols()` 按数量挑选 —— 满排优先，不留缺角。
   · 3 个 → 3 列 · 4 个 → 2 列（Ryan 指定）· 6 个 → 3 列 · 8 个 → 4 列。
   · 材料区（.svc-mats）同用：3 张材料卡（新车 / 二手车 / 外地迁入）→ 一排 3 个。 */
.advs2.cols-2,.svc-grid.cols-2,.svc-mats.cols-2{grid-template-columns:repeat(2,1fr)}
.advs2.cols-3,.svc-grid.cols-3,.svc-mats.cols-3{grid-template-columns:repeat(3,1fr)}
.advs2.cols-4,.svc-grid.cols-4{grid-template-columns:repeat(4,1fr)}

/* ④ 服务包含：两列紧凑清单 */
.svc-list{background:#fff;border:1px solid var(--line);border-radius:var(--r-l);
  padding:6px var(--sp6);list-style:none;display:grid;
  grid-template-columns:1fr 1fr;gap:0 var(--sp8)}
.svc-list li{display:flex;gap:12px;align-items:baseline;padding:14px 0;
  border-bottom:1px solid var(--line);font-size:14px;min-width:0}
.svc-list b{flex:0 0 96px;font-weight:700;color:var(--blue-d)}
.svc-list span{color:var(--ink2);line-height:1.7}

/* ⑤ 中部咨询条 */
.mid-cta{background:var(--blue-l);border:1px solid #d3e0f7;border-radius:var(--r-l);
  padding:20px var(--sp6);display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  margin-top:var(--sp8)}
.mid-cta .t{flex:1;min-width:200px}
.mid-cta .t b{display:block;font-size:16px;margin-bottom:3px}
.mid-cta .t span{font-size:13.5px;color:var(--ink2)}

/* 移动端（优先调） */
@media(max-width:768px){
  .svc-hero{padding:22px 0 26px}
  .svc-hero h1{font-size:21px;line-height:1.45}
  .h-eyebrow{font-size:11.5px;padding:3px 11px;margin-bottom:11px}
  .h-cta{gap:10px;margin:16px 0 12px}
  .btn-h{flex:1 1 100%;padding:14px 18px}
  .h-price{width:100%;text-align:center}
  .h-facts{gap:14px;font-size:13px;padding-top:12px}
  .h-facts b{font-size:16px}
  .pains2{grid-template-columns:1fr;padding:2px var(--sp4)}
  .p2{padding:15px 0}
  .p2:last-child{border-bottom:0}
  .p2 b{font-size:14.5px}
  /* 手机端单列：必须连 cols-N 变体一起覆盖（.advs2.cols-3 的优先级更高） */
  .advs2,.advs2[class*="cols-"]{grid-template-columns:1fr}
  .svc-mats[class*="cols-"]{grid-template-columns:1fr}
  .a2{padding:16px}
  .svc-list{grid-template-columns:1fr;padding:2px var(--sp4)}
  .mid-cta{padding:18px var(--sp4);gap:12px;flex-direction:column;align-items:stretch}
  .mid-cta .btn-h{width:100%}
}
@media(max-width:560px){
  .svc-list li{flex-direction:column;gap:4px;padding:12px 0}
  .svc-list b{flex:none}
}

/* 服务包含（v4）：卡片网格 */
/* 🔴 2026-10-13 Ryan 第 4/7/9/12 条：服务包含什么 PC 端改**一排 3 个**。
   原来 1fr 1fr 两列 ⇒ 三张卡排成 2+1，最后一张孤行，Ryan：「有点奇怪」。
   手机（≤768）仍单列，见下方媒体查询。 */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp3)}
/* 🔴 2026-10-14 Ryan：标题（b）放**第一排**——原 flex 三列并排会把标题挤成竖排窄列，乱且不美。
   现在：序号 + 标题同在第一行，说明独占第二行（对齐标题列）。 */
.sgc{background:#fff;border:1px solid var(--line);border-radius:var(--r-m);
  padding:15px 17px;display:grid;grid-template-columns:26px minmax(0,1fr);
  column-gap:10px;row-gap:4px;min-width:0}
.sgc .n{grid-area:1/1/2/2;font-size:12.5px;font-weight:800;color:var(--orange);
  letter-spacing:.05em;padding-top:2px}
.sgc b{grid-area:1/2/2/3;font-size:14.5px;color:var(--blue-d);line-height:1.5}
.sgc p{grid-area:2/2/3/3;font-size:13.5px;color:var(--ink2);line-height:1.7;margin:0}

/* 本期关键日期 */
.kfs{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp4)}
.kf{background:var(--blue-l);border:1px solid #d3e0f7;border-radius:var(--r-m);
  padding:18px;text-align:center;min-width:0}
.kf .k{font-size:13px;color:var(--ink2);margin-bottom:6px}
.kf .v{font-size:21px;font-weight:800;color:var(--blue-d);line-height:1.3}
.kf .n{font-size:12px;color:var(--ink3);margin-top:6px;line-height:1.6}
@media(max-width:768px){
  .svc-grid,.svc-grid[class*="cols-"]{grid-template-columns:1fr}
  .sgc{padding:14px 16px}
  .kfs{grid-template-columns:1fr;gap:var(--sp3)}
  .kf{padding:15px}
  .kf .v{font-size:19px}
}

/* 文章列表 */
.art-block{background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);padding:16px 18px}
.art-block .bh{display:flex;align-items:center;gap:8px;margin-bottom:10px;padding-bottom:9px;border-bottom:1px solid var(--line)}
.art-block .bh .nm{font-weight:700;font-size:15.5px}
.art-block .bh .cnt{margin-left:auto;font-size:12px;color:var(--ink3)}
.art-list{list-style:none;display:flex;flex-direction:column}
.art-list li{border-bottom:1px dashed var(--line)}
.art-list li:last-child{border-bottom:0}
.art-list a{display:block;padding:8px 0;font-size:14px;color:var(--ink2);line-height:1.6}
.art-list a:hover{color:var(--blue);text-decoration:none}
.art-list .dt{font-size:12px;color:var(--ink3);margin-left:6px;white-space:nowrap}
.art-list .art-plain{display:block;padding:8px 0;font-size:14px;color:var(--ink2);line-height:1.6}
/* 2026-10-22：文章页信息条改四项等宽（发布 / 栏目 / 小程序 / 全平台同名） */
.art-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;font-size:13px;
  color:var(--ink3);padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:18px}
@media(max-width:768px){ .art-meta{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  /* 2026-10-22（Ryan）：手机端也一排三项，不折两排；长了就省略号 */
  .art-meta span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis} }
.art-meta b{color:var(--ink2);font-weight:600}
/* 2026-10-21：文章页统一「蓝橙」排版 —— 蓝为主色（结构），橙只做三个点缀：
   H1 短线 / 导读标签 / 常见问题的 Q 标记。全站 153 篇共用这一套。 */
.lede{position:relative;font-size:16.5px;line-height:1.95;color:var(--ink2);
  background:#f4f7fd;border-left:4px solid var(--blue);border-radius:0 10px 10px 0;
  padding:18px 20px 16px;margin-bottom:var(--sp6)}
.lede:before{content:"导读";position:absolute;top:-9px;left:16px;background:var(--orange);color:#fff;
  font-size:11px;font-weight:700;letter-spacing:.5px;padding:1px 7px;border-radius:4px}
.art-h1-rule{display:block;width:48px;height:3px;background:var(--orange);border-radius:2px;margin:10px 0 16px}
.art-body .faq h3:before{content:"Q";display:inline-block;margin-right:6px;color:var(--orange);
  font-size:12px;font-weight:800;vertical-align:2px}
.proto-note{background:var(--warn-bg);border:1px dashed #f0c08f;border-radius:var(--r-m);
  padding:12px 15px;font-size:13px;color:var(--warn);line-height:1.75;margin-bottom:var(--sp6)}
.proto-note b{color:#9a3412}

/* ============================================================================
   文章正文区（2026-10-12 新增 · 承接 articles_v*/body_html/{aid}.html）
   🔴 凡科导出的正文带内联 style，共 12 种固定值；渲染前已全部剥掉，
      改由这里的作用域选择器统一渲染 —— 颜色/边框走站点变量，改版只改一处。
      逐条对应关系（原内联值 → 此处规则）：
        p        margin:0 0 16px;font-size:15px;line-height:1.9;color:#000  → .art-body p
        h2       margin:26px 0 14px;font-size:19px;font-weight:700         → .art-body h2
        h3       margin:18px 0 10px;font-size:16px;font-weight:700         → .art-body h3
        strong   font-weight:700;color:#000000                            → 浏览器默认即可
        table    width:100%;border-collapse:collapse;font-size:14px        → .art-body table
        td/th    border:1px solid #d0d0d0;padding:8px 10px                → .art-body td/th
        th       + background:#f7f7f7;font-weight:700                      → .art-body th
        a        color:#0563C1;text-decoration:underline                   → .art-body a
        blockquote margin:0 0 16px;padding:10px 14px;border-left:3px       → .art-body blockquote
        ul/li    padding-left:24px / margin:0 0 6px                        → .art-body ul/li
        小字      font-size:13px;line-height:1.7                            → .art-body .sm（极小字放宽到 13.5px）
   🔴 字号一律 ≥15px（原值即 15px），不要往下压：手机端正文本就是 15px，
      这里压小会直接破掉「正文 ≥14px」这条百度落地页规范。
   ============================================================================ */
.art-body{margin-bottom:var(--sp8)}
/* 2026-10-21：文章正文字号 / 行距 / 标题层级整体上调一档（Ryan：清晰、直观、大气） */
.art-body p{margin:0 0 18px;font-size:16.5px;line-height:1.95;color:var(--ink2)}
.art-body h2{margin:34px 0 14px;padding-left:12px;border-left:4px solid var(--blue);
  font-size:21px;line-height:1.45;font-weight:700;color:var(--ink)}
.art-body h3{margin:24px 0 10px;font-size:17.5px;line-height:1.5;font-weight:700;color:var(--ink)}
.art-body ul,.art-body ol{margin:0 0 18px;padding-left:22px}
.art-body li{margin:6px 0;font-size:16px;line-height:1.9;color:var(--ink2)}
.art-body .direct{position:relative;margin:0 0 26px;padding:18px 20px 16px;background:#f4f7fd;
  border-left:4px solid var(--blue);border-radius:0 10px 10px 0;
  font-size:16.5px;line-height:1.95;color:var(--ink)}
.art-body .direct:before{content:"要点";position:absolute;top:-9px;left:16px;background:var(--orange);
  color:#fff;font-size:11px;font-weight:700;letter-spacing:.5px;padding:1px 7px;border-radius:4px}
.art-body .src{margin:30px 0 0;padding-top:12px;border-top:1px dashed var(--line);
  font-size:13px;line-height:1.8;color:var(--ink3)}
/* 2026-10-22（Ryan）：文章里的表格一律居中，文字也居中（PC 与移动同一套） */
.art-body table{margin-left:auto;margin-right:auto;max-width:640px}
.art-body th,.art-body td{text-align:center}
.art-body blockquote{margin:0 0 20px;padding:14px 18px;background:#f7f9fc;
  border-left:4px solid var(--line);border-radius:0 8px 8px 0;color:var(--ink2);font-size:16px;line-height:1.9}
.art-body table{font-size:15px}
.art-body td,.art-body th{padding:10px 12px}
@media(max-width:768px){
  .art-body p{font-size:16px;line-height:1.9;margin-bottom:16px}
  .art-body h2{font-size:19px;margin:28px 0 12px}
  .art-body h3{font-size:17px;margin:20px 0 8px}
  .art-body li{font-size:15.5px}
}
.art-body strong{font-weight:700;color:var(--ink)}
.art-body em{font-style:italic}
.art-body a{color:var(--blue);text-decoration:underline}
.art-body a:hover{color:var(--blue-d)}
.art-body ul{margin:0 0 16px;padding-left:24px}
.art-body li{margin:0 0 6px;font-size:15px;line-height:1.9;color:var(--ink2)}
.art-body blockquote{margin:0 0 16px;padding:10px 14px;border-left:3px solid var(--orange);
  background:var(--orange-l);font-size:15px;line-height:1.9;color:var(--ink2)}
.art-body blockquote p:last-child{margin-bottom:0}
.art-body code{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-s);
  padding:1px 5px;font-size:13.5px}
.art-body table{width:auto;max-width:100%;border-collapse:collapse;margin:0 auto 18px;font-size:15px}
.art-body td,.art-body th{border:1px solid var(--line);padding:8px 10px;line-height:1.6;color:var(--ink2)}
.art-body th{background:#eef3fc;border-top:2px solid var(--orange);font-weight:700;color:var(--ink)}
.art-body a:hover{color:var(--orange)}
@media(max-width:768px){
  /* 手机端：表格横向可滚（页面本身不横滚）。2026-10-21 修：原来只有 display:block，
     列被压扁、右边一列直接被切掉；加 width:max-content + max-width:100% 才真的能滑。 */
  /* 数据表在手机上优先「挤进屏宽」：字号与内边距收一档、允许换行；
     真的列太多（≥6 列）时才横向滚动，避免一屏塞不下还看不出在滚。 */
  .art-body table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;
    width:100%;font-size:13px}
  .art-body td,.art-body th{padding:7px 8px}
  .art-body h2{font-size:19px;margin:28px 0 12px}
  .art-body h3{font-size:17px;margin:20px 0 8px}
  .art-body p,.art-body li{line-height:1.9}
}
.ilinks{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp3)}
.ilink{background:var(--white);border:1px solid var(--line);border-radius:var(--r-m);
  padding:14px;display:flex;flex-direction:column;gap:5px}
.ilink .t{font-size:14.5px;font-weight:600}
.ilink .d{font-size:12px;color:var(--ink3)}

/* 节点 */
.nodes{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp3);margin-top:var(--sp4)}
.node{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.24);border-radius:var(--r-m);padding:13px}
.node .k{font-size:12.5px;opacity:.85}
.node .v{font-size:16px;font-weight:700;margin:3px 0 3px}
.node .n{font-size:12px;opacity:.82;line-height:1.55}
.node.urgent{background:#fff;color:var(--ink);border-color:#fff}
.node.urgent .v{color:var(--orange-d)}
.node.urgent .k{color:var(--ink3)}
.node.urgent .n{color:var(--ink2)}

/* 统计条 */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp3);margin-top:var(--sp4)}
.stat{background:var(--white);border:1px solid var(--line);border-radius:var(--r-m);padding:14px}
.stat .k{font-size:12.5px;color:var(--ink3)}
.stat .v{font-size:20px;font-weight:700;color:var(--blue);margin:3px 0}
.stat.hot .v{color:var(--orange-d)}
.stat .n{font-size:12px;color:var(--ink2)}

/* 面包屑 */
.crumb{background:var(--white);border-bottom:1px solid var(--line);padding:11px 0;font-size:13.5px;color:var(--ink3)}
.crumb a{color:var(--ink2)}

/* 城市页头 —— 2026-10-06 重构（Ryan 提：手机端太长、要聚焦核心数据与日期）
   改动：① 四个徽章合并成一行小字；② 去掉与本城节点重复的横幅（横幅 CTA 还是个
   指回本页的死链），其提示文案并入下方折叠说明；③ 节点网格与数据条合成一块看板；
   ④ 原来那段 60+ 字的推算说明收进 <details>，默认折叠。
   🔴 2026-10-07 第五批（Ryan 需求 3）：整区由「深蓝渐变 + 白字」改浅色底。
      原方案是 --grad 深蓝底，时间轴与数据条再各盖一层半透明白卡，实测观感「太蓝」。
      改白底 + 极浅灰卡后：蓝只做品牌与结构（车牌块、数值），橙做强调（当前节点）。
   🔴 深浅切换最危险的不是底色，是**深底专用的白字覆盖**：原 L603/605/606/607 用
      rgba(255,255,255,.85)/#fff/#FFD9A8 把 .stat 的字刷白，其中 #FFD9A8 是浅橙
      （为深底设计）——底色一改浅，这四条会让数值几乎不可见。已整段删除，
      回落到 .stat 的默认配色（白底 / --blue 值 / --orange-d 强调）。 */
.city-hero{background:var(--white);color:var(--ink);padding:26px 0 30px}
.city-hero .sub{margin-top:10px;font-size:15px;line-height:1.78;max-width:820px;
  color:var(--ink2)}

/* 一行元信息（车牌 · 城 · 业务 · 数据基准）——替代原来的四个胶囊 */
.hero-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:12px;
  font-size:12.5px;line-height:1;color:var(--ink3)}
.hero-meta b{background:var(--blue);border:1px solid var(--blue-d);
  border-radius:5px;padding:3px 8px;font-weight:700;letter-spacing:.4px;color:#fff}
.hero-meta span{background:var(--blue-l);border:1px solid #d3e0f7;
  border-radius:5px;padding:3px 8px}
.hero-meta .sep{background:none;border:0;padding:0;opacity:.45}

/* 看板：关键数据（时间轴已于 2026-10-07 第五批移到 .flow-sec 独立成区） */
/* 🔴 grid-template-columns 必须写 minmax(0,1fr)：默认的 1fr 会让网格项的
   `min-width:auto` 取到内容的最小宽度，窄屏下会把整个 .hb-row 撑宽、
   页面直接横向溢出（实测 docW 686 > 视口 390）。 */
.hero-board{margin-top:14px;display:grid;grid-template-columns:minmax(0,1fr);gap:9px}
.hb-row{background:var(--bg);border:1px solid var(--line);
  border-radius:var(--r-l);padding:12px 14px;min-width:0}
.hb-lab{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;
  font-size:12.5px;font-weight:700;color:var(--ink);margin-bottom:9px}
.hb-lab em{font-style:normal;font-weight:400;font-size:12px;color:var(--ink3)}
.hb-row .nodes,.hb-row .stats{margin-top:0;min-width:0}
/* auto-fit + minmax(0,1fr)：有几条节点就铺几列。深圳/广州/北京只有 3 条，
   用固定的 repeat(4,1fr) 会空出一格，看着像少了一块。 */
.hb-row .nodes{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}
/* 🔴 必须加 :not(.urgent)：`.hb-row .nodes .node`(3 个类) 会盖掉
   `.node.urgent`(2 个类) 的样式，把「最要紧的那条日期」渲染成看不出的样子。
   浅底后不再需要「白底 vs 半透明白」的区分，普通格用 --bg 即可。 */
.hb-row .nodes .node:not(.urgent){background:var(--bg);border-color:var(--line)}

/* 本期流程时间轴（2026-10-07 增；同日第五批从 hero 迁出到 .flow-sec）
   🔴 脊线是**每个节点自己画一段**（`.tl-s::before`），不是整条 .tl 上的一条绝对定位线：
      桌面横排时线跟着每个节点的宽度走，手机端竖排时又要变竖线——逐段画天然两套都能用。
   🔴 选择器前缀是 `.flow-sec`，不再是 `.hb-row`。这组共 13 条规则，
      **迁区时漏一条就掉一条样式**，这是本次改动最容易出的错。 */
.flow-sec .tl{display:flex;gap:0;list-style:none;margin:0;padding:0;min-width:0}
.flow-sec .tl-s{flex:1 1 0;min-width:118px;padding:0 9px 0 0;position:relative}
.flow-sec .tl-s::before{content:"";position:absolute;left:0;right:0;top:4px;height:1px;
  background:var(--line)}
.flow-sec .tl-s:last-child::before{right:9px}
.flow-sec .tl-dot{position:relative;display:block;width:9px;height:9px;border-radius:50%;
  background:var(--blue-m);box-shadow:0 0 0 3px var(--blue-l)}
.flow-sec .tl-s.hot .tl-dot{background:var(--orange);box-shadow:0 0 0 3px var(--orange-l)}
.flow-sec .tl-lb{display:block;margin-top:7px;font-size:12.5px;font-weight:700;
  color:var(--ink);line-height:1.35}
.flow-sec .tl-v{display:block;margin-top:2px;font-size:14.5px;color:var(--ink2);line-height:1.35}
.flow-sec .tl-s.hot .tl-v{color:var(--orange-d);font-weight:700}
.flow-sec .tl-n{display:block;margin-top:2px;font-size:12px;
  color:var(--ink3);line-height:1.4}

/* 本期流程独立区（2026-10-07 第五批，Ryan 需求 3）
   🔴 为什么不留在 hero 里：hero 有一条手机首屏预算（verify_all 的 B6），
      而时间轴纵向全展开后单城最长 8 个节点 ≈530px，两者数学上不可能同时成立。
      独立成区后各有各的预算，hero 只负责「这是哪个城市 + 本期关键数据」。 */
.flow-sec{background:var(--white);border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);padding:var(--sp8) 0}
.flow-sec .sec-hd{margin-bottom:14px}

/* 推算口径：默认折叠，点开才看 */
.hero-note{margin-top:10px;border:0;padding:0;background:none}
.hero-note>summary{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;
  border:1px solid var(--line);border-radius:999px;font-size:12.5px;
  color:var(--ink2);cursor:pointer;background:var(--bg);list-style:none}
.hero-note>summary::-webkit-details-marker{display:none}
.hero-note>summary:after{content:"▼";font-size:9px;opacity:.75}
.hero-note[open]>summary:after{content:"▲"}
.hero-note .hn-bd{margin-top:10px;background:var(--bg);
  border:1px solid var(--line);border-radius:var(--r-m);padding:12px 14px}
.hero-note .hn-bd p{margin:0 0 8px;font-size:12.5px;line-height:1.75;color:var(--ink2)}
.hero-note .hn-bd p:last-child{margin-bottom:0}

/* 竞价走势图（见 bid_chart.py：服务端生成内联 SVG，零 JS 依赖） */
.bidcard{background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);
  padding:16px 16px 14px}
.bid-hd h3{font-size:16.5px}
.bid-sub{font-size:13px;color:var(--ink2);margin-top:5px;line-height:1.7}
.bidsvg{width:100%;height:auto;display:block;margin-top:12px}
/* 🔴 一张图两个尺寸：桌面版 viewBox 1016（2026-10-07 第六批由 680 加宽，与 .wrap 满宽对齐），
   窄屏版 344。桌面图塞进手机宽度会被等比压到 0.46 倍，11px 的字变 5.4px——不是「小」，是读不了。
   两张图都由服务端生成，靠媒体查询切换，不用 JS、不用 UA 嗅探。 */
.bidsvg.c{display:none}
/* 🔴 手机端明细表比屏幕宽（最右两列默认在屏幕外），横滑本身没有提示 ⇒ 补一行说明。
   只在手机显示：桌面这张表本来就放得下，加一行纯属噪音。 */
.bid-swipe{display:none;margin:10px 0 0;font-size:11.5px;color:var(--ink3)}
.bid-tbl{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:6px}
.bid-tbl table{border-collapse:collapse;width:100%;font-size:12px;white-space:nowrap}
.bid-tbl th,.bid-tbl td{border-bottom:1px solid var(--line);padding:7px 8px;text-align:right}
.bid-tbl th{background:var(--blue-l);color:var(--blue-d);font-weight:600;text-align:right}
.bid-tbl th:first-child,.bid-tbl td:first-child{text-align:left}
.bid-tbl td.na{color:var(--ink3)}
.bid-detail{margin-top:8px;border:1px solid var(--line);border-radius:var(--r-m);
  padding:0 12px;background:var(--bg)}
.bid-detail>summary{padding:10px 0;font-size:12.5px;color:var(--ink2);cursor:pointer}
.bid-src{margin-top:11px;padding-top:10px;border-top:1px dashed var(--line);
  font-size:11.5px;color:var(--ink3);line-height:1.7}
.bid-src a{color:var(--blue)}
.bid-notes{margin:9px 0 0;padding-left:17px;font-size:11.5px;color:var(--ink3);line-height:1.75}
.bid-notes li{margin-bottom:3px}

/* 年份切换：纯 CSS 单选按钮（无 JS 也能切） */
.yb{position:relative}
.yb input{position:absolute;opacity:0;pointer-events:none;width:0;height:0}
/* 🔴 2026-10-13 全史接入：年份页签由最多 3 个变最多 17 个（上海 2010–2026）。
   原 inline-flex 单行会在第 5–6 个之后溢出容器（并被裁掉，看起来「只有几年」）。
   改 flex-wrap 换行排布 —— 全部年份一眼可见，不需要学横滑手势；
   容器圆角 999px 是为单行胶囊设计的，多行下改 14px 矩形圆角。 */
.yb-tabs{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px;background:var(--blue-l);
  border-radius:14px;padding:5px;max-width:100%}
.yb-tabs label{padding:5px 14px;border-radius:999px;font-size:12.5px;cursor:pointer;
  color:var(--ink2);border:1px solid transparent;white-space:nowrap}
.yb-tabs label em{font-style:normal;font-size:11px;color:var(--ink3);margin-left:5px}
.yb-tabs label:hover{color:var(--blue)}
.yb-p{display:none}
/* 🔴 单年份（北京）没有 radio，:checked 规则一条都不会命中，
   所以必须在 CSS 里给 .yb.one 单独放行，否则整张图是空白。 */
.yb.one .yb-p{display:block}

/* 工具卡 */
/* 🔴 默认 3 列。城市页会由构建期在 `.tools` 上再打一个 `tools-N` 类（N = 卡片数），
   让「有 4 张卡就一排 4 个、只有 3 张就一排 3 个」（2026-10-07 第六批 · Ryan 需求 6）——
   原来固定 repeat(3,1fr)，深圳/广州/杭州/天津的**第 4 张卡必然另起一行**，
   底下一排只有一张卡，看起来像排版塌了。
   ⚠️ 必须包在 min-width 里：`.tools-4` 特异性 (0,2,0) 会**压过**手机端那条
      `.tools{grid-template-columns:1fr}` (0,1,0)，不包的话手机上也变成 4 列。 */
.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp4)}
/* 🔴 2026-10-07 晚（Ryan 报「PC 一排四个显示错乱」）：
   tools-4 只在**每卡内容 ≥ ~170px** 时成立——「阶梯摇号·摇号编码计算」标题去空格后
   实测 164px，4 列时卡宽 = (inner−48)/4、内容 = 卡宽−36 ⇒ 标题行需要 inner ≥ 4×203+48。
   实测 1024px（inner 992，标题空间 161 < 164）**仍会拆行** ⇒ 断点定 1060：
   769–1059px（iPad 竖/横屏）改 2×2，≥1060px 才恢复一排四；3 卡城（上海）不受影响。
   🔴 2026-10-08（Ryan 问「一排五个太挤吗」）：答案是不做一排五六——工具区变成
   「六卡（深穗杭津 + 北京）/ 四卡（上海）」后，**六卡走默认 3 列 × 2 排**
   （≥1060 每卡 ~360px，比原来的 250px 还宽），四卡（上海）维持一排四。 */
@media(min-width:769px) and (max-width:1059px){
  .tools-4,.tools-6{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:1060px){
  .tools-4{grid-template-columns:repeat(4,1fr)}
}
.tool{background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);padding:18px;
  display:flex;flex-direction:column;gap:10px;position:relative}
.tool .hd{display:flex;align-items:center;gap:9px;font-weight:700;font-size:16px;
  flex-wrap:wrap;row-gap:2px}
/* 🔴 「免费」角标（同上，Ryan 报错乱）：原来 .pri 在 .hd 里是个**裸 span**——
   全站只有 `.svc-card .pri` 有样式，工具卡里这个没有任何规则 ⇒ 16px 粗体挤在标题行内，
   在 250px 卡里被压成「免/费」竖排、标题也跟着拆行（四卡标题行高 30 vs 54 不齐＝「错乱」）。
   改成骑在卡顶边框上的角标：不占标题行宽度；橙底白字比灰字醒目；
   top:-9px 是拿 9px 去填卡间距（桌面 16px / 手机 11px）都不越界。 */
.tool .hd .pri{position:absolute;top:-9px;right:14px;font-size:11px;line-height:1;
  padding:4px 8px;border-radius:999px;background:var(--orange-d);color:#fff;
  font-weight:600;letter-spacing:.5px}
.tool .ic{width:30px;height:30px;border-radius:var(--r-m);background:var(--blue-l);color:var(--blue);
  display:flex;align-items:center;justify-content:center}
.tool p{font-size:13.5px;color:var(--ink2)}
.tool .act{margin-top:auto;padding-top:10px}
/* 🔴 工具卡次级入口（2026-10-09 · Ryan 需求 1）：指标到期卡原来只有「去小程序设置指标提醒」
   一个动作——而用户多半是「先想算算还剩几天」再决定要不要绑。次级入口把这条路显式化：
   点它直接进本城「指标到期」工具页（录到期日 → 算天数 + 提前 60/30 天是哪天）。
   位置固定在 .act 之前：主按钮仍是卡内最后一个元素，B14 的「按钮同线」量测不受影响。 */
.tool .tool-alt{margin-top:2px}
.tool .tool-alt a{font-size:13.5px;font-weight:600;color:var(--blue);text-decoration:none;
  display:inline-flex;align-items:center;min-height:24px}
.tool .tool-alt a:hover{text-decoration:underline}
.tool .tool-alt em{font-style:normal;color:var(--ink3);font-size:12.5px;margin-left:6px}
.tool form{display:flex;flex-direction:column;gap:8px}
.tool .inp{height:44px;border:1.5px solid var(--line);border-radius:var(--r-m);padding:0 12px;
  font-size:15px;font-family:inherit;width:100%}
.tool .inp:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-l)}

/* 车辆迁入自测卡的内表单（2026-10-08）：移动端紧凑优先——
   折叠态整卡 ~150px；展开后逐项间距 12px、控件触屏高度 ≥36px。 */
.tool .qrf{display:flex;flex-direction:column}
.tool .fl{font-size:12.5px;font-weight:700;color:var(--ink2);margin:12px 0 7px}
.tool .qrl{margin-top:6px;font-size:13px;color:var(--ink2);line-height:1.7}
.tool .qrr b{font-size:15px}

/* -------- 工具页（2026-10-09 · 深圳试点）：正文 / 内链 / 宫格 -------- */
.tp-h{font-size:19px;margin:26px 0 10px;display:flex;align-items:center}
.tp-h:before{content:"";flex:0 0 4px;width:4px;height:.92em;border-radius:2px;
  background:var(--orange);margin-right:9px}
.tp-p{font-size:14.5px;color:var(--ink2);line-height:1.95;margin-bottom:12px}
.tp-p b{color:var(--ink)}
.tp-src{margin-top:26px;padding-top:12px;border-top:1px dashed var(--line);
  font-size:12.5px;color:var(--ink3);line-height:1.8}
.tp-rel{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.tp-rel a{border:1px solid var(--line);border-radius:999px;padding:7px 15px;font-size:13.5px;
  color:var(--blue);background:var(--white)}
.tp-rel a:hover{border-color:var(--blue-m)}
/* -------- 工具总页 /gongju/（2026-10-10 升级为「城市工作台」）--------
   左侧城市列 + 右侧快捷入口 / 核心工具 / 服务产品三类；按城市切换右侧内容。
   默认深圳；无 JS 时三组只显示深圳块（构建期 .on 写死），照常可点。 */
.th-layout{display:flex;gap:14px;margin-top:16px;align-items:flex-start}
.th-workbench .th-layout{margin-top:0}
.th-workbench h1.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.th-side{flex:0 0 78px;display:flex;flex-direction:column;gap:6px}
.th-citybtn{font-family:inherit;cursor:pointer;padding:10px 4px;border-radius:10px;
  border:1px solid var(--line);background:var(--white);color:var(--ink2);
  font-size:13.5px;font-weight:600;text-align:center}
.th-citybtn.on{background:var(--blue);border-color:var(--blue);color:#fff}
.th-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:20px}
.th-sec-h{margin:0;font-weight:700;font-size:14.5px;font-weight:700;display:flex;align-items:center;gap:8px;
  flex-wrap:wrap;margin-bottom:10px}
.th-sec-h:before{content:"";flex:none;width:4px;height:.9em;border-radius:2px;background:var(--orange)}
.th-sec-h em{font-style:normal;font-size:11.5px;font-weight:400;color:var(--ink3)}
.th-city-block{display:none}
.th-city-block.on{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.th-shortcut-panel{padding:14px;background:#f3faff;border-radius:12px}
.th-subhead{grid-column:1/-1;margin:4px 0 0;font-size:12px;font-weight:700;color:var(--ink2)}
.th-entry{display:flex;align-items:flex-start;gap:8px;min-width:0;min-height:76px;padding:12px 14px;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-m);text-decoration:none;color:var(--ink)}
.th-entry:hover{border-color:var(--blue-m)}
.th-entry:active{background:var(--blue-l)}
.th-entry .bd{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.th-entry .nm{font-size:12.5px;font-weight:600;line-height:1.4}
.th-entry .tg{font-size:12px;line-height:1.5;color:var(--ink3)}
.th-entry .ar{flex:none;color:var(--ink3);font-size:12px}
.th-entry .fr{position:absolute;right:8px;top:6px;font-size:11px;line-height:1.4;color:#a04e0e;
  background:var(--orange-l);border:1px solid #f3d7bd;border-radius:6px;padding:1px 5px;font-weight:600}
.th-entry .pr{flex:none;font-size:11px;color:#a04e0e;background:var(--orange-l);border:1px solid #f3d7bd;
  border-radius:6px;padding:1px 6px;font-weight:600}
@media(min-width:769px) and (max-width:1024px){
  .th-city-block.on{grid-template-columns:repeat(2,minmax(0,1fr))}
  .th-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.th-off{display:flex;gap:8px;align-items:center;padding:10px 12px;background:var(--white);
  border:1px solid var(--line);border-radius:var(--r-m);text-decoration:none;color:var(--ink)}
.th-off:hover{border-color:var(--blue-m)}
.th-off .bd{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.th-off .nm{font-size:13.5px;font-weight:600;line-height:1.45}
.th-off .tg{font-size:11.5px;color:var(--ink3);line-height:1.45;display:-webkit-box;
  -webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.th-off .ar{flex:none;color:var(--ink3);font-size:13px}
.th-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
/* 2026-10-19 首页核心工具：3×2 图标卡（PC 与移动一致；2026-10-20 按 1020-final 对齐） */
.ht-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ht-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  min-height:104px;padding:14px 8px;background:#fff;border:1px solid #EEF2F7;border-radius:14px;
  text-decoration:none;color:var(--ink);font-family:inherit;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.ht-card:hover{border-color:#BFDBFE;box-shadow:0 3px 14px rgba(29,78,216,.08)}
.ht-ic{width:36px;height:36px;border-radius:50%;background:#EFF4FF;color:#3B6FD4;
  display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700}
.ht-nm{font-size:12px;font-weight:600;text-align:center;line-height:1.35}
@media(max-width:480px){
  .ht-tools{gap:9px}
  .ht-card{min-height:92px;padding:10px 4px;gap:8px;border-radius:12px}
  .ht-ic{width:32px;height:32px;font-size:13.5px}
  .ht-nm{font-size:11.5px}
}
/* 🆕 2026-10-18 快捷工具分组（与小程序「快捷工具」四组同源）：
   组标题 + 双列卡片；组与组之间留 14px，读起来是「一盘菜分四格」而不是一长串。 */
.th-group+.th-group{margin-top:16px}
.th-group>.th-subhead{margin:0 0 8px;font-size:12.5px;font-weight:800;color:var(--blue-d);
  display:flex;align-items:center;gap:7px}
.th-group>.th-subhead::before{content:"";width:3px;height:11px;border-radius:2px;background:var(--blue)}
.th-tool-action{width:100%;font:inherit;text-align:left;cursor:pointer}
.th-tool.off,.th-tool-action.off{display:none!important}
/* 🆕 2026-10-20 快捷工具改为**按城块**（后台可逐城增删改）：
   块内是「组标题 + 双列格子」的纵向流，不能再走 .th-city-block 的双列栅格。 */
.th-city-block.on.gtools{display:block}
.gtools .th-group:first-child>.th-subhead{margin-top:0}

/* 🆕 2026-10-21：工具宫格（.mpm-*）提到全局 —— /gongju/ 手机端与城市页手机端共用同一套，
   原来只写在工具页的行内 <style> 里，城市页拿不到，样式就会各写一份、迟早漂。 */
.mpm-h{display:flex;align-items:center;gap:7px;margin:18px 0 10px;font-size:15px;font-weight:700}
.mpm-h:before{content:"";width:4px;height:14px;border-radius:2px;background:var(--orange)}
.mpm-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.mpm-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  min-height:96px;padding:12px 6px;background:#fff;border:1px solid #EEF2F7;border-radius:12px;
  text-decoration:none;color:var(--ink);font-family:inherit;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.mpm-card:hover{border-color:#BFDBFE;box-shadow:0 2px 10px rgba(29,78,216,.08)}
.mpm-ic{width:34px;height:34px;border-radius:50%;background:#EFF4FF;color:#3B6FD4;
  display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}
.mpm-nm{font-size:12px;line-height:1.35;text-align:center;font-weight:600}
.mpm-free{position:absolute;top:4px;right:4px;font-size:10.5px;font-weight:700;color:#B45309;
  background:#FFF7ED;border:1px solid #FDBA74;border-radius:4px;padding:0 3px}
@media(max-width:768px){
  .mpm-h{margin:16px 0 9px;font-size:14.5px}
  .mpm-grid{gap:8px}
  .mpm-card{min-height:86px;padding:10px 4px}
  .mpm-ic{width:30px;height:30px;font-size:13px}
  .mpm-nm{font-size:11.5px}
  .mpm-free{top:3px;right:3px}
}
/* 城市页「快捷工具」区：桌面＝四列卡（.th-*），手机＝四列宫格（.mpm-*），只切显示 */
.ct-mob{display:none}
@media(max-width:768px){ .ct-desk{display:none} .ct-mob{display:block} }
/* 快捷入口：办事指引/公众号——**信息条，不是链接**（很多办事入口在公众号 / App 内，
   没有可引用的 URL；做成说明卡，绝不放假链接） */
.th-qk{display:flex;gap:9px;align-items:flex-start;padding:10px 12px;background:var(--blue-l);
  border:1px solid #cddff7;border-radius:var(--r-m)}
.th-qk .bd{flex:1;min-width:0}
.th-qk .nm{font-size:13.5px;font-weight:700;color:var(--blue-d)}
.th-qk .ds{margin-top:3px;font-size:12px;color:var(--ink2);line-height:1.65}
.th-qk .bdg{flex:none;font-size:10.5px;font-weight:600;color:var(--blue-d);
  background:#fff;border:1px solid #cddff7;border-radius:999px;padding:2px 8px;white-space:nowrap}
.th-list{margin-top:0}
.th-item{display:flex;gap:14px;align-items:flex-start;background:var(--white);
  border:1px solid var(--line);border-radius:var(--r-l);padding:16px 18px}
.th-item .ic{width:38px;height:38px;flex:none;border-radius:var(--r-m);background:var(--blue-l);
  color:var(--blue);display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:16px}
.th-item .bd{flex:1;min-width:0}
.th-item .tt{font-size:16px;font-weight:700;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.th-item .tt .fr{font-size:11px;font-weight:600;color:#a04e0e;background:var(--orange-l);
  border:1px solid #f3d7bd;border-radius:6px;padding:1px 7px}
.th-item .ss{margin-top:6px;font-size:13.5px;color:var(--ink2);line-height:1.8}
.th-item .avail{margin-top:7px;font-size:12px;color:var(--ink3)}
.th-item .go{flex:none;align-self:center}
.th-item .go.off{opacity:.45;pointer-events:none}
@media(max-width:768px){
  .th-layout{gap:7px;align-items:flex-start;margin-top:0}
  .th-side{position:sticky;top:0;align-self:stretch;z-index:5;flex:0 0 88px;width:88px;gap:0;
    min-height:calc(100vh - 112px);background:var(--white);margin-left:-14px}
  .th-citybtn{flex:0 0 52px;padding:8px 2px;font-size:14px;border:0;border-radius:0;background:var(--white)}
  .th-citybtn.on{background:#f3faff;color:var(--blue);border-right:3px solid var(--blue)}
  .th-main{flex:1;min-width:0}
  .th-main{gap:12px}
  .th-sec-h{font-size:12.5px;margin:0 0 5px;gap:6px}
  .th-sec-h em{font-size:10px}
  .th-city-block.on{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .th-shortcut-panel{padding:8px;background:#f3faff;border-radius:10px}
  .th-entry{min-height:68px;padding:8px 9px;gap:5px;border-radius:9px}
  .th-entry .nm{font-size:11.5px;line-height:1.3;white-space:normal}
  .th-entry .tg{display:-webkit-box;font-size:10.5px;line-height:1.35;color:var(--ink3);
    -webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
  .th-off .tg{-webkit-line-clamp:3}
  .th-entry .ar{margin-left:auto}
  .th-entry .pr{font-size:9px;padding:0 4px}
  .th-subhead{margin:2px 0 0;font-size:10.5px}
  .th-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .th-qk{min-height:68px;align-items:flex-start;padding:8px 9px;gap:5px;border-radius:9px}
  .th-qk .nm{font-size:11.5px;line-height:1.3}
  .th-qk .ds,.th-qk .bdg{display:none}
  .th-workbench .tp-src,.th-workbench .tp-rel{display:none}
}
/* 🔴 工具宫格（2026-10-09 · 全城铺开后同日晚改版）：
   城市页 .tgrid 只在移动端取代内容卡；**首页 .hp-tools 反过来**——
   PC 是一排三个的工具卡（3×2，更大气直观），手机端才是宫格。
   两端共用同一份工具清单与同一顺序（Ryan 定：查询 → 绑定 → 自测 → 积分 → 指标 → 迁入）。 */
.tz .tgrid{display:none}
@media(max-width:768px){
  .tz .tools{display:none}
  .tz .tgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
}
.hp-tools .tgrid{display:none}
/* 🆕 2026-10-18：首页手机端「快捷工具」＝分组三列宫格（参考小程序 vHub 排版）。
   .mtools 只在 ≤768px 出现，桌面继续用上面那 6 张大卡。 */
.mtools{display:none}
@media(max-width:768px){
  .hp-tools .tools{display:none}
  .mtools{display:block}
  .mt-h{display:flex;align-items:center;gap:8px;margin:14px 0 8px;
    font-size:13px;font-weight:700;color:var(--ink2)}
  .mt-h::before{content:"";width:3px;height:12px;border-radius:2px;background:var(--blue)}
  .mt-h:first-child{margin-top:2px}
  .mt-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  /* 手机端宫格压到小程序那种紧凑度：图标 34px、上下留白 12/10，9 格两屏内看完 */
  .mt-g .gc,.tgrid .gc{padding:12px 4px 10px;gap:6px}
  .mt-g .gc .gic,.tgrid .gc .gic{width:34px;height:34px;font-size:15px;border-radius:9px}
}
@media(max-width:768px){
  .hp-tools .tgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
}
.tgrid .gc,.mt-g .gc{display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:15px 6px 13px;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-l);text-decoration:none;color:var(--ink);
  font-size:13.5px;font-weight:600;font-family:inherit;cursor:pointer}
.tgrid .gc .gic,.mt-g .gc .gic{width:38px;height:38px;border-radius:var(--r-m);background:var(--blue-l);
  color:var(--blue);display:flex;align-items:center;justify-content:center;
  font-size:16px;font-weight:700}
.tgrid .gc:active,.mt-g .gc:active{background:var(--blue-l);border-color:var(--blue-m)}
/* ============ 🆕 2026-10-18：快捷工具分组 + 新工具控件 ============
   .tgrid-h：宫格分组标题（与小程序 vHub() 的 .sec-h 同款位置：组标题在上、宫格在下）。
   🔴 只在移动端宫格形态出现；PC 大卡形态下 .tools 的卡自己带标题，不再叠一层。 */
.tgrid-h{display:none}
@media(max-width:768px){
  .tgrid-h{display:flex;align-items:center;gap:8px;margin:14px 0 8px;
    font-size:13px;font-weight:700;color:var(--ink2)}
  .tgrid-h::before{content:"";width:3px;height:12px;border-radius:2px;background:var(--blue)}
  .tgrid-h:first-child{margin-top:2px}
}
/* 限行结论卡：ok=绿 / warn=橙 / win=红（红=限行或禁入，与「红涨绿跌」无关，是风险色） */
.xw-vd{display:flex;align-items:flex-start;gap:12px;margin-top:14px;padding:13px 15px;
  border-radius:var(--r-m);border:1px solid var(--line);background:#fbfcfe;font-size:13.5px;font-weight:600}
.xw-vd .big{flex:none;width:38px;height:38px;border-radius:10px;display:flex;align-items:center;
  justify-content:center;font-size:18px;font-weight:800;background:var(--blue-l);color:var(--blue)}
.xw-vd .d{display:block;font-size:12px;font-weight:500;color:var(--ink3);margin-top:3px;line-height:1.6}
.xw-vd.ok{border-color:#bfe3ce;background:var(--green-l)}
.xw-vd.ok .big{background:#cdebd9;color:var(--green)}
.xw-vd.warn{border-color:#f3d7bd;background:var(--orange-l,#fff5ec)}
.xw-vd.warn .big{background:#f7dfc8;color:#a04e0e}
.xw-vd.win{border-color:#f2cfcf;background:#fdeeee}
.xw-vd.win .big{background:#f8d9d9;color:#c23b3b}
.xw-rl{margin-top:10px;border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden;background:var(--white)}
.xw-rl .li{display:flex;gap:10px;padding:9px 12px;font-size:12.5px;color:var(--ink2);line-height:1.6}
.xw-rl .li+.li{border-top:1px solid var(--line)}
.xw-rl .tm{flex:none;width:132px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.xw-note{margin-top:10px;padding:11px 13px;border-radius:var(--r-m);background:var(--blue-l);
  font-size:12.5px;color:var(--ink2);line-height:1.7}
.xw-wheel{width:100%;border-collapse:collapse;margin-top:8px;font-size:12px;background:var(--white);
  border-radius:8px;overflow:hidden}
.xw-wheel th,.xw-wheel td{padding:6px 4px;text-align:center;border:1px solid var(--line)}
.xw-wheel th{background:#f1f5fb;font-size:11.5px;color:var(--ink2);font-weight:700}
.xw-wheel td{font-variant-numeric:tabular-nums;color:var(--ink2)}
.xw-wheel td.wk{text-align:left;padding-left:9px;font-weight:700;color:var(--ink2);white-space:nowrap}
.xw-wheel td.hot{background:var(--orange-l,#fff5ec);color:#a04e0e;font-weight:800}
.xw-bar{height:7px;border-radius:999px;background:#e8edf5;overflow:hidden;margin-top:10px}
.xw-bar span{display:block;height:100%;background:var(--blue);border-radius:999px}
/* 竞价表：窄屏横向滚动，不换行不截断 */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -2px}
.xw-bid{width:100%;min-width:340px;border-collapse:collapse;font-size:12.5px}
.xw-bid th,.xw-bid td{padding:8px 6px;text-align:right;border-bottom:1px solid var(--line);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.xw-bid th:first-child,.xw-bid td:first-child{text-align:left;font-weight:600}
.xw-bid th{font-size:11.5px;color:var(--ink3);font-weight:700;background:#f7f9fc}
.xw-bid tbody tr:first-child td{background:#fbfcfe;font-weight:700}
.hint{margin-left:7px;font-size:11.5px;font-weight:500;color:var(--ink3)}
@media(max-width:768px){
  .xw-vd{padding:11px 12px;gap:10px;font-size:13px}
  .xw-vd .big{width:32px;height:32px;font-size:16px;border-radius:9px}
  .xw-rl .li{display:block;padding:8px 11px}
  .xw-rl .tm{display:block;width:auto;margin-bottom:2px}
}
/* 首页 .home-mid：六城入口在桌面与手机端都排在核心工具前。 */
.home-mid{display:flex;flex-direction:column}
#cities{order:1}
#tools{order:2}
/* 六城紧凑格（手机端专用；桌面这层 display:none、显示原大卡 .grid.g3）。 */
.cities2{display:none}
@media(max-width:768px){
  .cities2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  #cities .grid.g3{display:none}
}
/* 六城紧凑格 v3.2（2026-10-14 · Ryan：与 PC 大卡统一为三行）：
   每格 = 车牌/城市/模式 + 城市页「关键数据」全部三格（city_stats() 同源，构建期算）。
   .c2-row 标签/值两端对齐；.c2-node 保留样式但当前渲染不再输出该行
   （v3.1 的「数据两行 + 本期节点」在六格间或重或缺，已被三行方案取代）。 */
.cities2 a{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:5px;
  padding:9px 11px;min-height:64px;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-m);
  text-decoration:none;color:var(--ink);font-size:13px;font-weight:600}
.cities2 a:active{background:var(--blue-l);border-color:var(--blue-m)}
.cities2 .c2-top{display:flex;align-items:center;gap:6px;min-width:0;white-space:nowrap}
.cities2 .pl{font-size:10.5px;font-weight:700;color:#fff;background:var(--blue);
  border-radius:4px;padding:2px 5px;flex:none}
.cities2 .ct{font-size:13px;overflow:hidden;text-overflow:ellipsis;min-width:0}
.cities2 .mode{margin-left:auto;font-size:11px;color:var(--blue-d);font-weight:600}
.cities2 .c2-row{display:flex;justify-content:space-between;gap:7px;min-width:0;
  font-size:12px;color:var(--ink3);font-weight:500}
.cities2 .c2-row span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.cities2 .c2-row b{flex:none;color:var(--ink);font-size:12px;font-weight:700;white-space:nowrap}
.cities2 .c2-node{display:flex;justify-content:space-between;gap:7px;min-width:0;
  font-size:11px;color:var(--blue-d);font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cities2 .c2-node b{color:inherit;font-weight:800}
.cities2 .c2-node.hot{color:var(--orange-d)}
.svc-card .nm-mobile{display:none}
@media(max-width:768px){
  .svc-card.bind-mobile-name .nm-pc{display:none}
  .svc-card.bind-mobile-name .nm-mobile{display:inline}
}
/* 城市切换条（浅底变体）：.cityswitch 原样式是深底白字（服务页 hero 内），
   工具页是白底，需要一套浅色变体 —— 结构一样、配色相反。 */
.cityswitch.l a{background:var(--white);border:1px solid var(--line);color:var(--ink2)}
.cityswitch.l a:hover{border-color:var(--blue-m);background:var(--blue-l)}
.cityswitch.l a.on{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:700}
.cityswitch.l a.on:hover{background:var(--blue)}

/* 「摇号中签提醒」卡：一句话 + 三个短卖点（2026-10-06 二次精简，见 bind_points） */
.tool .bind-lead{font-size:14px;color:var(--ink);line-height:1.68}
.tool .bind-lead strong{color:var(--blue-d)}
.bv-points{display:grid;gap:6px;margin:1px 0 0;padding:0;list-style:none}
.bv-points li{display:flex;align-items:center;gap:8px;background:var(--blue-l);
  border-radius:var(--r-m);padding:7px 10px;min-width:0}
.bv-points li b{flex:0 0 auto;font-size:12.5px;font-weight:700;color:var(--blue-d);
  border-right:1px solid #cddff7;padding-right:8px}
.bv-points li span{font-size:12px;color:var(--ink2);min-width:0}
/* 🔴 不用 nowrap + ellipsis：这三句是「卖点」，被截掉一半比换行难看，也等于白写。
   宁可在窄屏换到第二行。 */

/* 官方入口 */
.offi{background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);padding:7px 18px}
.offi .row{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px dashed var(--line)}
.offi .row:last-child{border-bottom:0}
.offi .ic{width:34px;height:34px;border-radius:var(--r-m);background:var(--blue-l);color:var(--blue);
  display:flex;align-items:center;justify-content:center;flex:0 0 34px;font-size:15px}
.offi .bd{flex:1;min-width:0}
.offi .nm{font-size:14.5px;font-weight:600;color:var(--ink)}
.offi .host{font-size:12px;color:var(--ink3);word-break:break-all}
.offi .tg{font-size:11.5px;background:var(--bg);color:var(--ink3);border-radius:var(--r-s);padding:2px 7px;white-space:nowrap}
.offi a.go{font-size:13px;flex:0 0 auto}

/* FAQ / details */
details{background:var(--white);border:1px solid var(--line);border-radius:var(--r-m);
  padding:0 16px;margin-bottom:9px}
details[open]{border-color:var(--blue-m)}
summary{cursor:pointer;padding:14px 0;font-weight:600;font-size:15px;list-style:none;
  display:flex;align-items:center;gap:9px}
summary::-webkit-details-marker{display:none}
summary:before{content:"?";flex:0 0 20px;height:20px;border-radius:50%;background:var(--blue-l);
  color:var(--blue);font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}
details .ans{padding:0 0 15px 29px;font-size:14px;color:var(--ink2);line-height:1.8}

/* 🔴 2026-10-14 Ryan：FAQ 区容器改全宽（与上下区块一致）后单条长条留白多 ⇒
   容器做**两列**（与整页网格感一致），展开互不推挤；标题跨列；手机（≤768）单列。 */
.faq-wrap{column-count:2;column-gap:12px}
.faq-wrap>*{break-inside:avoid;-webkit-column-break-inside:avoid}
.faq-wrap>.sec-hd{column-span:all}
@media(max-width:768px){.faq-wrap{column-count:1}}

/* 资格测试 */
.quiz .q{padding:14px 0;border-bottom:1px dashed var(--line)}
.quiz .q:last-of-type{border-bottom:0}
.quiz .ql{font-size:14.5px;font-weight:600;margin-bottom:9px}
.opts{display:flex;gap:8px;flex-wrap:wrap}
.opt{border:1.5px solid var(--line);border-radius:var(--r-m);padding:8px 14px;font-size:14px;
  cursor:pointer;background:var(--white);font-family:inherit;color:var(--ink2)}
.opt:hover{border-color:var(--blue-m)}
.opt.sel{border-color:var(--blue);background:var(--blue-l);color:var(--blue);font-weight:600}
.res{margin-top:16px;border-radius:var(--r-l);padding:16px;border:1px solid var(--line);background:var(--bg)}
.res.ok{background:var(--ok-bg);border-color:#bfe6d1}
.res.no{background:var(--err-bg);border-color:#f6c9c4}
.res.part{background:var(--warn-bg);border-color:#f6d5b8}
.res .rt{font-size:16px;font-weight:700;margin-bottom:8px}
.res ul{list-style:none;display:flex;flex-direction:column;gap:5px;font-size:14px}
.res li:before{margin-right:7px}
.res li.y:before{content:"✓";color:var(--ok);font-weight:700}
.res li.n:before{content:"✗";color:var(--err);font-weight:700}
.disclaim{font-size:12px;color:var(--ink3);margin-top:10px;line-height:1.7}

/* 阶梯摇号 / 家庭积分自测（2026-10-07 增，Ryan 需求 4）
   🔴 复用 .tool 的输入框与 .res 的结果卡，不自造一套——工具区三张卡得看着像一家人。
      这里只补两样它没有的：一行「标签 + 数字 + 单位」的横排，和阶梯对照表。 */
.ladd{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.ladd .row{display:flex;align-items:center;gap:8px}
.ladd .lb{font-size:13.5px;color:var(--ink2);font-weight:600;flex:none}
.ladd .inp{flex:1;min-width:0;text-align:right}
.ladd .unit{font-size:12.5px;color:var(--ink3);flex:none}

/* 🔴🔴 2026-10-07 深夜（Ryan 二次报：「PC 端家庭积分 / 阶梯积分填入后看不到数字」）——
   4 列卡宽 250px、行内容宽只有 212px，而标签 `flex:none` 按文字**全宽**占位：
   杭州「累计参加普通车摇号未中签次数」15 字 ≈ 200px、深圳/广州 11 字 ≈ 148px、
   北京「其他成员积分之和」≈ 108px ⇒ 实测深圳 input 只剩 **35px（内容区 9px）**，
   数字根本画不出来（框里只看得见原生数字箭头）；杭州更窄到负值。
   手机端 / iPad 2×2 是整行宽度所以没暴露 —— 这就是「移动端没问题」的原因。
   修法：只在 4 列档（≥1060 且 .tools-4）把每行改成「标签独占一行、输入框+单位下一行」，
   输入框永远拿到整行宽度（≈191px）；其余断点维持原单行布局，不动。
   🔴 2026-10-08（B10b 逮到的回归）：工具区变 6 卡（.tools-6、3 列）后这条**必须跟进**——
   只写 `.tools-4` 的话 6 卡页退回 flex，深圳实测又掉到 **124px**（闸门如实报红）。
   类名选择器改成 `.tools-4,.tools-6` 两边覆盖。 */
@media(min-width:1060px){
  .tools-4 .ladd .row,.tools-6 .ladd .row{display:grid;grid-template-columns:1fr auto;column-gap:8px;row-gap:5px;align-items:center}
  .tools-4 .ladd .lb,.tools-6 .ladd .lb{grid-column:1 / -1}
}
.tiers{margin-top:10px;display:flex;flex-wrap:wrap;gap:6px}
.tiers span{border:1px solid var(--line);border-radius:6px;padding:2px 8px;
  font-size:12.5px;color:var(--ink2);background:var(--bg)}
.tiers span b{color:var(--blue-d)}

/* 成功态 */
.done{background:var(--ok-bg);border:1px solid #bfe6d1;border-radius:var(--r-l);padding:18px}
.done .h{font-size:16px;font-weight:700;color:var(--ok);display:flex;align-items:center;gap:8px}
.done ol{margin:12px 0 0 20px;font-size:14px;color:var(--ink2);display:flex;flex-direction:column;gap:6px}

/* CTA */
.cta{background:var(--grad);color:#fff;border-radius:var(--r-l);
  padding:26px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.cta .bd{flex:1 1 340px}
.cta h2{color:#fff;margin-bottom:8px}
.cta p{opacity:.92;font-size:14px;line-height:1.8}
.cta .btn{background:#fff;color:var(--blue-d);font-weight:700}

/* 页脚 */
footer{background:#fff;border-top:1px solid var(--line);margin-top:var(--sp8);padding:30px 0 34px}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:var(--sp6)}
footer h3{font-size:14px;margin-bottom:10px}
footer ul{list-style:none;display:flex;flex-direction:column;gap:7px;font-size:13.5px}
footer ul a{color:var(--ink2)}
.foot-bot{margin-top:24px;padding-top:16px;border-top:1px solid var(--line);
  font-size:12.5px;color:var(--ink3);display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
.notice{background:var(--white);border-left:3px solid var(--blue);border-radius:0 var(--r-m) var(--r-m) 0;
  padding:14px 16px;font-size:13.5px;color:var(--ink2);line-height:1.8}
.notice b{color:var(--ink)}

/* ---------- 全站提醒条 ---------- */
.alertbar{background:var(--blue-l);border-bottom:1px solid #d3e0f7;font-size:13.5px;color:var(--ink2)}
.alertbar .wrap{display:flex;align-items:center;gap:10px;padding:9px 16px}
.alertbar .bd{flex:1;min-width:0;line-height:1.65}
.alertbar .bd b{color:var(--ink)}
.alertbar a.more{white-space:nowrap;font-weight:600}
.alertbar .x{border:0;background:transparent;color:var(--ink3);font-size:17px;line-height:1;
  cursor:pointer;padding:4px 6px;font-family:inherit}
.alertbar .x:hover{color:var(--ink)}
.alertbar.warn{background:var(--warn-bg);border-bottom-color:#f6d5b8}
.alertbar.urgent{background:var(--win-bg);border-bottom-color:#f6c9c4}
.alertbar.urgent .lvl{color:var(--win)}
.alertbar .lvl{font-weight:700;white-space:nowrap}

/* ---------- 城市条（六城平铺） ---------- */
.citybar{background:var(--white);border-bottom:1px solid var(--line);
  position:sticky;top:60px;z-index:45}
/* 🔴 桌面端居中（2026-10-06 Ryan 提）：六城是并列关系，没有「第一个」，
   靠左排会让人以为还有更多藏在右边。justify-content:center + margin:auto 一起给，
   窄屏溢出时仍能从两端滚到（单纯 center 会让左端被裁掉）。 */
.citybar .scroll{display:flex;gap:8px;overflow-x:auto;padding:9px 16px;
  max-width:1080px;margin:0 auto;justify-content:center;-webkit-overflow-scrolling:touch;
  scrollbar-width:none}
.citybar .scroll::-webkit-scrollbar{display:none}
.citybar a{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
  border:1px solid var(--line);border-radius:var(--r-p);padding:5px 13px;font-size:13.5px;
  color:var(--ink2);background:var(--white)}
.citybar a:hover{border-color:var(--blue-m);color:var(--blue);text-decoration:none}
.citybar a.on{border-color:var(--blue);background:var(--blue-l);color:var(--blue);font-weight:600}

/* 🆕 2026-10-22：城市条 7 项等宽（桌面）；手机端保持横向滑动、不挤成一团 */
@media(min-width:769px){ .citybar .scroll>a{flex:1 1 0;justify-content:center} }
.citybar a.same{border-color:#f3d7bd;color:#a04e0e;background:#fff9f4}
/* 页脚「全平台同名」（2026-10-22）：城市条 pill 的落点 */
.sameplat{background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);
  padding:16px 18px;margin:0 0 22px}
.sameplat .sp-h{font-size:14px;font-weight:700;margin-bottom:8px}
.sameplat .sp-list{display:flex;flex-wrap:wrap;gap:8px}
.sameplat .sp-list span{font-size:12.5px;color:var(--ink2);background:var(--bg);
  border:1px solid var(--line);border-radius:999px;padding:3px 10px}
/* 城市资讯列表页（2026-10-22）：一页到底，标题 + 日期 + 一句摘要 */
/* 期次数据页 /{city}/{year}-{mm}/（2026-10-22 重做）
   🔴 一屏四个数 + 两张城市页同款走势图 + 一段「这一年里的位置」= 数据页该有的密度。
      宽度用满 .wrap(1080)：走势图与城市页 1:1 同宽，字号才不会被缩成 8px。 */
.issue{padding:6px 0 44px}
.isl-lead{font-size:16px;line-height:1.9;color:var(--ink2);background:#f4f7fd;
  border-left:4px solid var(--blue);border-radius:0 10px 10px 0;
  padding:14px 18px;margin:0 0 14px}
.isl-sub{color:var(--ink3);font-size:13.5px;margin:0 0 20px;line-height:1.75}
.isl-kpi{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 8px}
.isl-kpi>div{flex:1 1 200px;max-width:340px;background:#f4f7fd;border:1px solid #dbe6f8;border-radius:12px;padding:15px 14px}
.isl-kpi span{display:block;font-size:12.5px;color:var(--ink3);margin-bottom:7px}
.isl-kpi b{display:block;font-size:23px;color:var(--blue-d);font-variant-numeric:tabular-nums;line-height:1.2}
.isl-kpi em{display:block;font-style:normal;font-size:12px;color:var(--ink3);margin-top:6px;line-height:1.6}
.issue h2{margin:34px 0 14px;font-size:20px;letter-spacing:-.2px}
.isl-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0 0 16px}
.isl-duo .duo{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.duo span{display:block;font-size:12.5px;color:var(--ink3)}
.duo b{display:block;font-size:26px;color:var(--blue-d);font-variant-numeric:tabular-nums;
  line-height:1.3;margin:3px 0 2px}
.duo em{font-style:normal;font-size:12.5px;color:var(--ink3);line-height:1.6}
.duo i{font-style:normal;font-weight:600;font-size:15px}
.duo i.up{color:#C0392B} .duo i.down{color:#1a7f52}
.isl-cap{font-size:12.5px;color:var(--ink3);margin:0 0 2px}
.isl-chartcard{margin:0 0 22px;padding:15px 17px 12px}
.isl-read{background:#f7f9fc;border:1px solid var(--line);border-left:3px solid var(--orange);
  border-radius:0 10px 10px 0;padding:12px 18px;margin:0 0 20px;font-size:14px;
  color:var(--ink2);line-height:1.9;list-style:none}
.isl-read li{margin:5px 0;padding-left:13px;position:relative}
.isl-read li:before{content:"";position:absolute;left:0;top:9px;width:5px;height:5px;
  border-radius:50%;background:var(--orange)}
.isl-read b{color:var(--ink);font-variant-numeric:tabular-nums}
.isl-note{font-size:12.5px;color:#a04e0e;background:#fff7ed;border:1px solid #f3d7bd;
  border-radius:8px;padding:10px 13px;margin:0 0 18px;line-height:1.8}
.isl-src{font-size:12.5px;color:var(--ink3);margin:18px 0 0;line-height:1.8}
/* 期次页「常见问题」：沿用文章页的 Q 橙标语言，但字号按数据页收紧一档 */
.issue .faq h3{font-size:15.5px;font-weight:700;color:var(--ink);margin:16px 0 6px;line-height:1.6}
.issue .faq h3:before{content:"Q";display:inline-block;margin-right:6px;color:var(--orange);
  font-size:11.5px;font-weight:800;vertical-align:2px}
.issue .faq p{font-size:14.5px;line-height:1.95;color:var(--ink2);margin:0 0 6px}
@media(max-width:768px){
  .issue .faq h3{font-size:14.5px}
  .issue .faq p{font-size:14px}
}
/* 城市页「本年各期数据」入口区（期次页的唯一站内入口，不能只靠 sitemap）
   🔴 一行胶囊，不是卡片矩阵：一年 9 期只花约 90px 高（原 3×3 卡片要 400px），
      往期不堆在城市页，跨年切换由期次页的 .isl-months 承担。 */
.isl-pills{display:flex;flex-wrap:wrap;gap:8px}
.isl-pill{display:inline-flex;align-items:center;gap:8px;background:var(--white);
  border:1px solid var(--line);border-radius:999px;padding:8px 15px;text-decoration:none;
  transition:border-color .15s,background .15s}
.isl-pill:hover{border-color:var(--blue);background:#f7faff}
.isl-pill .m{font-size:13px;font-weight:600;color:var(--ink2)}
.isl-pill b{font-size:13.5px;font-weight:700;color:var(--blue-d);font-variant-numeric:tabular-nums}
.isl-pill em{font-style:normal;font-size:12.5px;color:var(--ink3);font-variant-numeric:tabular-nums}
.isl-pill.more{border-style:dashed;color:var(--blue);font-size:13px;font-weight:600}
/* 城市页「数据明细」：3 列卡片，每张两行（摇号 / 竞价），标签必须显式 */
.isl-grid3{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}
.isl-cell{display:block;background:var(--white);border:1px solid var(--line);
  border-radius:11px;padding:11px 14px 12px;text-decoration:none;transition:border-color .15s}
.isl-cell:hover{border-color:var(--blue)}
.isl-cell .m{display:block;font-size:13px;font-weight:700;color:var(--ink);margin-bottom:5px}
.isl-cell .r{display:flex;justify-content:space-between;align-items:baseline;gap:8px;line-height:1.95}
.isl-cell .r i{font-style:normal;font-size:12px;color:var(--ink3)}
.isl-cell .r b{font-size:13.5px;font-weight:700;color:var(--blue-d);font-variant-numeric:tabular-nums}
.isl-cell .r.na b{color:#b6bcc9}
/* 期次页的年月条：12 格一行，当年内直接跳 —— 往期铺开时这里按年份叠行 */
.isl-yearnav{display:flex;gap:6px;margin:0 0 9px;flex-wrap:wrap}
.isl-yearnav a{font-size:12.5px;padding:4px 15px;border-radius:999px;border:1px solid var(--line);
  background:var(--white);text-decoration:none;color:var(--ink2)}
.isl-yearnav a:hover{border-color:var(--blue);color:var(--blue)}
.isl-yearnav a.on{background:var(--blue-d);border-color:var(--blue-d);color:#fff;font-weight:600}
.isl-months{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px;margin:0 0 22px}
.isl-months a,.isl-months span{display:block;text-align:center;padding:7px 0;border-radius:8px;
  font-size:12.5px;border:1px solid var(--line);background:var(--white);
  text-decoration:none;color:var(--ink2);font-variant-numeric:tabular-nums}
.isl-months a:hover{border-color:var(--blue);color:var(--blue)}
.isl-months a.on{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:700}
.isl-months span{color:#c6ccd8;background:#fafbfd;border-style:dashed}
.isl-months span.has{color:var(--ink3);background:var(--white);border-style:solid}
/* 城市页「往期年度」入口：卡片下方一行，chips 与说明分段 */
.isl-years{margin:12px 0 0;font-size:12.5px;color:var(--ink3);line-height:2.2}
.isl-years span{margin-right:10px}
.isl-years a{display:inline-block;padding:2px 10px;margin-right:6px;border-radius:999px;
  border:1px solid var(--line);background:var(--white);text-decoration:none;color:var(--blue-d)}
.isl-years a:hover{border-color:var(--blue)}
.isl-years em{font-style:normal;margin-left:8px;color:#aab1bd}
@media(max-width:768px){
  .isl-kpi{gap:9px}
  .isl-kpi>div{flex:1 1 40%;max-width:none}
  .isl-kpi b{font-size:19px}
  .isl-kpi>div{padding:12px 11px}
  .issue h2{font-size:17.5px;margin:26px 0 12px}
  .isl-duo{gap:9px}
  .duo b{font-size:22px;padding-right:0}
  .isl-months{grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}
  .isl-pill{padding:7px 12px;gap:6px}
  .isl-pill .m{font-size:12.5px}
  .isl-grid3{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .isl-cell{padding:9px 10px 10px}
  .isl-cell .m{font-size:12px;margin-bottom:3px}
  .isl-cell .r i{font-size:11px}
  .isl-cell .r b{font-size:12px}
  .isl-chartcard{padding:12px 11px 10px}
  .isl-read{font-size:13.5px;padding:11px 13px}
}
/* 🔴 769–1439px：PC 右侧常驻二维码（16+150）会压住走势图右轴的数字（实测 1280 下
   「2,000,00…」被切掉一半）。这一档给 .issue 让出右侧约 96px 过道：
   正文与图一起左移、保持同一列对齐，比把图单独缩窄更像「有意的版式」。 */
@media(min-width:769px) and (max-width:1439px){
  .issue .wrap{padding-right:96px}
}
/* 工具页 / 服务页的「常见问题」（2026-10-22）：讲能解决什么问题，不写"准不准" */
.faq-sec{padding:14px 0 46px;background:var(--white);border-top:1px solid var(--line)}
.faq-sec .wrap{max-width:1080px;margin:0 auto;padding:0 16px}
.faq-sec h2{font-size:19px;margin:0 0 14px;letter-spacing:-.2px}
.faq-blk h3{font-size:15.5px;font-weight:700;color:var(--ink);margin:16px 0 6px;line-height:1.6}
.faq-blk h3:before{content:"Q";display:inline-block;margin-right:6px;color:var(--orange);
  font-size:11.5px;font-weight:800;vertical-align:2px}
.faq-blk p{font-size:14.5px;line-height:1.95;color:var(--ink2);margin:0 0 6px;max-width:860px}
@media(max-width:768px){
  .faq-sec h2{font-size:17px}
  .faq-blk h3{font-size:14.5px}
  .faq-blk p{font-size:14px}
}
.nl-sub{color:var(--ink3);font-size:13px;margin:0 0 16px}
.nl{list-style:none;margin:0 0 20px;border-top:1px solid var(--line)}
.nl li{border-bottom:1px solid var(--line)}
.nl a{display:grid;grid-template-columns:1fr auto;gap:4px 14px;padding:13px 2px;text-decoration:none}
.nl a:hover .nt{color:var(--blue)}
.nl .nt{font-size:15.5px;font-weight:600;color:var(--ink);line-height:1.5}
.nl .nd{font-size:12.5px;color:var(--ink3);white-space:nowrap}
.nl .ns{grid-column:1/-1;font-size:12.5px;color:var(--ink3);line-height:1.7}
.nl-back{padding-bottom:10px}
@media(max-width:768px){
  .nl a{grid-template-columns:1fr;gap:2px}
  .nl .nt{font-size:15px}
}
.sameplat .sp-note{margin-top:8px;font-size:12px;color:var(--ink3);line-height:1.7}
/* 手机端城市条是隐藏的 ⇒ 给「全平台同名」单独一条细带（仅移动端显示） */
.samebar{display:none}
@media(max-width:768px){
  .samebar{display:flex;align-items:center;justify-content:center;gap:6px;
    background:var(--blue-l);border-bottom:1px solid #c9daf6;color:var(--blue-d);
    font-size:12.5px;font-weight:600;padding:7px 12px;text-decoration:none}
  .samebar .ar{font-weight:400}
}.citybar .pl{font-size:11px;font-weight:700;color:#fff;background:var(--pc,var(--blue));
  border-radius:4px;padding:1px 5px;letter-spacing:.4px}
.citybar .lab{font-size:12.5px;color:var(--ink3);flex:0 0 auto;align-self:center;padding-right:2px}

/* ---------- 数据驱动横幅 ---------- */
.banners{display:grid;gap:var(--sp3);margin-top:20px}
.banners.one{grid-template-columns:1fr}
.banners.two{grid-template-columns:1fr 1fr}
.banner{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.28);
  border-radius:var(--r-m);padding:15px 17px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.banner .bd{flex:1 1 300px;min-width:0}
.banner .tt{font-size:16px;font-weight:700;color:#fff;line-height:1.5}
.banner .ss{font-size:13.5px;color:rgba(255,255,255,.88);line-height:1.72;margin-top:6px}
.banner .go{flex:0 0 auto;background:#fff;color:var(--blue-d);border-radius:var(--r-m);
  padding:9px 16px;font-size:14px;font-weight:600;white-space:nowrap}
.banner .go:hover{text-decoration:none;background:#f2f6fd}
.banner.tone-node{background:rgba(255,255,255,.95);border-color:#fff;color:var(--ink)}
.banner.tone-node .tt{color:var(--ink)}
.banner.tone-node .ss{color:var(--ink2)}
.banner.tone-node .go{background:var(--blue);color:#fff}
.banner.tone-node .go:hover{background:var(--blue-d)}
.banner.tone-service{background:rgba(255,255,255,.1)}
/* 首页白底横幅 */
.banners.on-white .banner{background:var(--blue-l);border-color:#d3e0f7}
.banners.on-white .banner .tt{color:var(--ink)}
.banners.on-white .banner .ss{color:var(--ink2)}
.banners.on-white .banner .go{background:var(--blue);color:#fff}

/* ---------- 服务页 hero 横幅 v2（2026-10-13 · Ryan 第 3 条） ----------
   「本期关键时间」三格嵌进横幅（原独立「本期关键日期」区块已删）。
   🔴 不复用 .banner/.node 类：.node 是深色页 hero 用的半透明卡，样式语义不同，
      同名复用早晚在某一端被改坏；这里整套用 .svc-banner / .sb-* 前缀独立命名。
   数据来自 city_nodes()（与城市页 hero 节点卡同源），三格＝申请截止 / 竞价·摇号日 / 结果发布。 */
.svc-banner{background:var(--blue-l);border:1px solid #d3e0f7;border-radius:var(--r-l);
  padding:16px;margin-top:18px}
.svc-banner .sb-hd{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.svc-banner .sb-tt{font-size:15.5px;font-weight:800;color:var(--ink);line-height:1.5}
.svc-banner .sb-go{flex:0 0 auto;background:var(--blue);color:#fff;border-radius:var(--r-m);
  padding:9px 16px;font-size:13.5px;font-weight:700;white-space:nowrap}
.svc-banner .sb-go:hover{background:var(--blue-d);text-decoration:none}
.svc-banner .sb-nodes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.svc-banner .sb-nb{background:#fff;border:1px solid #d3e0f7;border-radius:var(--r-m);padding:11px 12px}
.svc-banner .sb-nb.urgent{background:var(--blue);border-color:var(--blue)}
.svc-banner .sb-k{font-size:12px;font-weight:700;color:var(--ink3)}
.svc-banner .sb-v{font-size:15px;font-weight:800;color:var(--ink);margin-top:3px;line-height:1.4}
.svc-banner .sb-n{font-size:11.5px;color:var(--ink3);margin-top:4px;line-height:1.55}
.svc-banner .sb-nb.urgent .sb-k{color:#bed4f5}
.svc-banner .sb-nb.urgent .sb-v{color:#fff}
.svc-banner .sb-nb.urgent .sb-n{color:#d9e6fa}
.svc-banner .sb-sub{margin-top:11px;font-size:12px;color:var(--ink3);line-height:1.7}
/* v3 追加（2026-10-13 Ryan 第 1 条）：标题与说明段删除后，「查看节点」按钮落在三格下方右对齐 */
.svc-banner .sb-foot{display:flex;justify-content:flex-end;margin-top:11px}

/* 指标到期提醒 · 小转跳卡（2026-10-13 Ryan 第 8 条 · 延期页专用） */
.zb-mini{max-width:560px;margin:0 auto;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-l);padding:20px}
.zb-mini .hd{display:flex;align-items:center;gap:10px;font-size:16px}
.zb-mini .ic{width:30px;height:30px;border-radius:9px;background:var(--blue-l);color:var(--blue);
  display:inline-flex;align-items:center;justify-content:center;font-weight:800;flex:0 0 auto}
.zb-mini p{margin:10px 0 0;font-size:13.5px;color:var(--ink2);line-height:1.75}
.zb-mini .btn-h{margin-top:14px;display:block;text-align:center}

/* ---------- 合作位（默认不输出） ---------- */
.promo{background:var(--white);border:1px solid var(--line);border-left:3px solid var(--ink3);
  border-radius:0 var(--r-l) var(--r-l) 0;padding:18px 20px}
.promo .tt{font-size:16px;font-weight:700;display:flex;align-items:center;gap:9px}
.promo .ss{font-size:13.5px;color:var(--ink2);margin-top:7px;line-height:1.75}
.promo ul{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:13px}
.promo li{background:var(--bg);border-radius:var(--r-m);padding:11px 13px;font-size:13.5px}
.promo li b{display:block;color:var(--ink);margin-bottom:3px}
.promo li span{color:var(--ink3);font-size:12.5px}
.promo .note{font-size:12.5px;color:var(--ink3);margin-top:12px}
.promo .tagline{font-size:11.5px;background:var(--bg);color:var(--ink3);border-radius:var(--r-s);
  padding:2px 8px;font-weight:400}

/* ---------- 小程序桥接 ---------- */
.mpb{background:var(--grad);color:#fff;border-radius:var(--r-l);
  padding:28px;display:flex;gap:28px;flex-wrap:wrap;align-items:center}
.mpb .bd{flex:1 1 380px;min-width:0}
/* 小标签：先给一个「这是什么」的定位，再落主标题 */
.mpb .kicker{display:inline-block;font-size:11.5px;font-weight:600;letter-spacing:.4px;
  background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.26);
  border-radius:var(--r-p);padding:3px 11px;margin-bottom:11px}
.mpb h2{color:#fff;margin-bottom:9px}
.mpb p{opacity:.93;font-size:14px;line-height:1.82}
.mpb .act{display:flex;gap:11px;flex-wrap:wrap;align-items:center;margin-top:16px}
.mpb .tiny{font-size:11.5px;opacity:.75;margin-top:9px}
.btn.solid{background:#fff;color:var(--blue-d);font-weight:700}
.btn.solid:hover{background:var(--blue-l)}
.btn.ghost{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.34)}
.btn.ghost:hover{background:rgba(255,255,255,.24)}
.mpb .codes{display:flex;gap:16px;flex:0 0 auto}
.mpb .code{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);
  border-radius:var(--r-m);padding:12px;text-align:center;width:124px}
.mpb .code .box{width:96px;height:96px;margin:0 auto 8px;background:#fff;border-radius:var(--r-s);
  display:flex;align-items:center;justify-content:center;color:var(--ink3);font-size:11.5px;
  line-height:1.5;padding:7px;text-align:center}
.mpb .code .box img{width:100%;height:100%;object-fit:contain;border-radius:var(--r-s)}
.mpb .code .cap{font-size:12px;opacity:.9}
.mpb .envtip{background:rgba(0,0,0,.16);border-radius:var(--r-m);padding:10px 13px;
  font-size:12.5px;line-height:1.7;margin-top:13px;opacity:.95}
.mpb .placeholder{font-size:11.5px;opacity:.72;margin-top:9px}
/* ---------- 工具页「官网 vs 小程序」差异卡（2026-10-18） ----------
   🔴 与 .mpb 的分工：.mpb 是深色转化块（讲「绑定能得到什么」）；
   .mpd 是浅色对比块（讲「官网做不到什么」）——工具页刚算完一件事，
   用户心里那句“那下次呢”要在这里被回答，所以做成**左右两栏对读**：
   左=官网（灰、弱），右=小程序（蓝、强），二维码单独一列。 */
.mpdiff{padding:20px 0 10px}
.mpd{display:flex;gap:22px;align-items:flex-start;flex-wrap:wrap;background:var(--white);
  border:1px solid var(--line);border-radius:var(--r-l);padding:20px 22px}
.mpd .bd{flex:1 1 420px;min-width:0}
.mpd .kicker{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.4px;
  color:var(--blue-d);background:var(--blue-l);border-radius:999px;padding:2px 10px}
.mpd h2{font-size:19px;font-weight:800;margin:9px 0 7px;line-height:1.45}
.mpd .mlead{font-size:13.5px;color:var(--ink2);line-height:1.8}
.mpd .cmp{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:15px}
.mpd .col{border-radius:var(--r-m);padding:12px 14px;font-size:12.5px;line-height:1.7}
.mpd .col b{display:block;font-size:12px;margin-bottom:7px}
.mpd .col ul{margin:0 0 0 15px}
.mpd .col li{margin:4px 0}
.mpd .webc{background:#f7f9fc;border:1px solid var(--line);color:var(--ink2)}
.mpd .webc b{color:var(--ink3)}
.mpd .mpc{background:var(--blue-l);border:1px solid #cddff7;color:var(--ink2)}
.mpd .mpc b{color:var(--blue-d)}
.mpd .codes{flex:0 0 auto;align-self:center}
.mpd .act .btn{width:auto;display:inline-flex;min-width:264px;justify-content:center}
.mpd .code{text-align:center}
.mpd .code .box{width:106px;height:106px;background:#f7f9fc;border:1px dashed #c8d5e8;
  border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-size:11px;color:var(--ink3);line-height:1.55;text-align:center}
.mpd .code .box img{width:100%;height:100%;object-fit:contain;border-radius:10px}
.mpd .code .cap{margin-top:7px;font-size:11.5px;color:var(--ink2);font-weight:700}
.mpd .act{margin-top:15px}
.mpd .tiny{font-size:11.5px;color:var(--ink3);margin-top:8px;line-height:1.7}
@media(max-width:680px){
  .mpd{padding:16px 15px;gap:14px}
  .mpd h2{font-size:17px}
  .mpd .cmp{grid-template-columns:1fr}
  .mpd .codes{width:100%;display:flex;justify-content:center;align-self:auto}
  .mpd .act .btn{width:100%;min-width:0}
}

/* ---------- 资料待补 ---------- */
.pending{background:var(--warn-bg);border:1px dashed #f0c08f;border-radius:var(--r-l);padding:20px}
.pending h3{color:#9a3412;display:flex;align-items:center;gap:9px;margin-bottom:11px}
.pending ul{list-style:none;display:flex;flex-direction:column;gap:8px;font-size:13.5px;
  color:var(--ink2);line-height:1.75}
.pending li{padding-left:17px;position:relative}
.pending li:before{content:"待补";position:absolute;left:0;top:5px;font-size:10px;font-weight:700;
  color:#fff;background:var(--warn);border-radius:3px;padding:1px 4px;line-height:1.4}
.pending li{padding-left:36px}
.pending .nt{font-size:12.5px;color:var(--warn);margin-top:12px;line-height:1.7}

/* ---------- 指标有效期提醒 ----------
   定位：指标延期的免费前置入口。指标到期是"一次性、不可逆"的事
   （逾期＝放弃指标），所以这个模块先讲清"还剩多少天"，再谈要不要办理。
   指标到期日由用户自填——我们不掌握官方有效期数据库，不猜、不代填。 */
.zb-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);padding:20px;
  border-top:3px solid var(--orange)}
.zb-hd{display:flex;align-items:center;gap:9px}
.zb-hd .ic{width:30px;height:30px;border-radius:var(--r-m);background:var(--orange-l);
  color:var(--orange-d);display:flex;align-items:center;justify-content:center;font-size:15px}
.zb-hd .nm{font-size:16.5px;font-weight:700}
.zb-hd .free{margin-left:auto;font-size:11.5px;background:var(--ok-bg);color:var(--ok);
  border-radius:var(--r-p);padding:2px 10px;font-weight:600;white-space:nowrap}
.zb-lead{font-size:13.5px;color:var(--ink2);line-height:1.78;margin-top:7px}
.zb-cur{margin-top:14px;background:var(--bg);border-radius:var(--r-m);padding:14px 16px}
.zb-cur .r1{display:flex;align-items:center;gap:12px}
.zb-cur .bd{flex:1;min-width:0}
.zb-cur .nm{font-size:15px;font-weight:700;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.zb-cur .meta{font-size:12.5px;color:var(--ink3);margin-top:5px}
.zb-cur .zb-days{margin-left:auto;text-align:right;flex:0 0 auto}
.zb-cur .zb-days b{display:block;font-size:25px;font-weight:700;color:var(--orange-d);line-height:1.1;
  font-variant-numeric:tabular-nums}
.zb-cur .zb-days span{font-size:11.5px;color:var(--ink3)}
.zb-cur.soon .zb-days b{color:var(--win)}
.zb-bar{height:8px;border-radius:var(--r-p);background:#e4e9f2;margin-top:13px;overflow:hidden}
.zb-bar i{display:block;height:100%;border-radius:var(--r-p);
  background:linear-gradient(90deg,#f0a35e,var(--orange-d))}
.zb-bar.soon i{background:linear-gradient(90deg,#e57373,var(--win))}
.zb-marks{display:flex;justify-content:space-between;margin-top:7px;gap:8px}
.zb-marks span{font-size:11.5px;color:var(--ink3);line-height:1.5}
.zb-marks span:last-child{text-align:right}
.zb-marks b{color:var(--ink2);font-weight:600}
.zb-tiers{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:15px}
.zb-tier{border:1.5px solid var(--line);border-radius:var(--r-m);padding:12px 14px;background:var(--white)}
.zb-tier.on{border-color:var(--orange);background:var(--orange-l)}
.zb-tier .t{font-size:14px;font-weight:700;display:flex;align-items:center;gap:7px}
.zb-tier.on .t{color:var(--orange-d)}
.zb-tier .d{font-size:12px;color:var(--ink3);margin-top:4px;line-height:1.62}
.zb-ch{display:flex;gap:7px;flex-wrap:wrap;margin-top:13px}
.zb-ch span{font-size:12px;border:1px solid var(--line);border-radius:var(--r-p);
  padding:4px 11px;color:var(--ink2);background:var(--white);display:inline-flex;align-items:center;gap:5px}
.zb-ch span.on{border-color:var(--blue);background:var(--blue-l);color:var(--blue);font-weight:600}
.zb-ch span em{font-style:normal;font-size:11px;color:var(--ink3)}
.zb-form{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:10px;margin-top:15px;align-items:end}
.zb-form .f label{display:block;font-size:12px;color:var(--ink3);margin-bottom:5px}
.zb-form input,.zb-form select{width:100%;height:44px;border:1.5px solid var(--line);
  border-radius:var(--r-m);padding:0 11px;font-size:14.5px;font-family:inherit;
  background:var(--white);color:var(--ink)}
.zb-form input:focus,.zb-form select:focus{outline:none;border-color:var(--blue);
  box-shadow:0 0 0 3px var(--blue-l)}
.zb-note{font-size:12.5px;color:var(--ink3);margin-top:12px;line-height:1.72;
  border-top:1px dashed var(--line);padding-top:12px}
.zb-note b{color:var(--ink2)}
.zb-res{margin-top:12px;border-radius:var(--r-m);padding:13px 15px;font-size:13.5px;line-height:1.7;
  background:var(--blue-l);color:var(--ink2);border:1px solid #d3e0f7}
.zb-res b{color:var(--blue-d)}
.zb-res.warn{background:var(--orange-l);border-color:#f6d5b8}
.zb-res.warn b{color:var(--orange-d)}
.zb-res.dead{background:var(--win-bg);border-color:#f6c9c4}
.zb-res.dead b{color:var(--win)}

/* ---------- 折叠组（.fold） ----------
   同一个 <details>，桌面默认展开、移动端默认收起（移动端由 JS 去掉 open）。
   用途：页脚链接组、城市页「更多资讯」——这些是每页都有的重复导航，
   移动端展开着纯属占屏，但两端都要能点开，所以不能用 display:none 藏掉。 */
/* 🔴 全局 details 带白底+边框（FAQ 用），.fold 必须整组清掉——否则页脚三组链接
   会被套上三个方框。`details.fold[open]` 的选择器权重必须压过 `details[open]`。 */
.fold,details.fold[open]{background:transparent;border:0;padding:0;margin:0;border-radius:0}
.fold>summary{display:none;list-style:none}
.fold>summary::-webkit-details-marker{display:none}

/* ---------- 移动端底部导航 / 资讯 tab（桌面态默认不显示） ---------- */
.mnav{display:none}
.ntabs{display:none}
.npanes{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp4);align-items:start}

/* ---------- 绑定编码的价值图示（2026-10-07 重排） ----------
   Ryan 提：图标不满意、排面要再精简 / 直观 / 大气 / 明了。
   ① 图标从「单个汉字 + 色块」换成**内联 SVG 线条图标**（见 build_site.svg_icon）——
      汉字放进色块才像图标，一放开就只剩字，而且不同字面大小不一、横排看着忽大忽小；
   ② 五项一行横排，每项只有「图标 + 粗体短语 + 一句短说明」，不再有流程胶囊；
   ③ 这一段整体在深蓝渐变卡（.mpb）里，所以配色走半透明白，不引 light 主题的色值。 */
.feats{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:16px}
.feats li{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.20);
  border-radius:var(--r-m);padding:13px 12px;display:flex;flex-direction:column;gap:5px;min-width:0}
.feats .ic{width:30px;height:30px;border-radius:9px;background:rgba(255,255,255,.18);
  display:flex;align-items:center;justify-content:center;color:#fff}
.feats .ic svg{width:17px;height:17px;display:block}
.feats b{font-size:13px;font-weight:700;line-height:1.4}
.feats .ss{font-size:11.5px;opacity:.82;line-height:1.55}
/* 竖列版 = 同一条数据的另一种排版（窄容器用） */
.bv-list{list-style:none;margin:14px 0 0;padding:0}
.bv-list li{display:flex;gap:9px;align-items:flex-start;padding:8px 0;
  border-top:1px solid var(--line);font-size:12px;line-height:1.55}
.bv-list li:first-child{border-top:0;padding-top:0}
.bv-list svg{width:16px;height:16px;flex:0 0 16px;color:var(--blue);margin-top:2px}
.bv-list .tx{flex:1;min-width:0}
.bv-list .tx b{display:block;font-size:12.5px;color:var(--ink);font-weight:600}
.bv-list .tx i{font-style:normal;color:var(--ink3)}
/* 三步行内流程：替代原来的 <ol> 与四条流程胶囊（那两者说的是同一件事） */
.msteps{list-style:none;display:flex;align-items:center;flex-wrap:wrap;gap:8px;
  margin-top:15px;font-size:13.5px}
.msteps li{display:flex;align-items:center;gap:7px;font-weight:600}
.msteps li i{font-style:normal;flex:none;width:20px;height:20px;border-radius:50%;
  background:rgba(255,255,255,.92);color:var(--blue-d);
  display:flex;align-items:center;justify-content:center;font-size:11.5px;font-weight:700}
.msteps li+li:before{content:"→";font-weight:400;opacity:.55;margin-right:8px}

/* ---------- 企业微信客服（PC 右下角悬浮卡；移动端走底栏，见 @media） ----------
   两个入口、一份内容：PC 用户的视线在右下角，手机用户的拇指在底栏。
   位置不同但要说的话完全一样，所以 DOM 只写一份，由 CSS 决定哪个按钮可见。 */
/* 2026-10-22：PC 右侧常驻二维码（小程序 + 企微），不需要点击 */
.side-qr{position:fixed;right:16px;top:50%;transform:translateY(-50%);z-index:55;
  display:flex;flex-direction:column;gap:10px;width:150px}
.side-qr .sq-item{background:#fff;border:1px solid var(--line);border-radius:14px;
  padding:10px 8px 8px;text-align:center;box-shadow:0 6px 22px rgba(20,40,80,.08)}
.side-qr img{width:132px;height:132px;max-width:100%;display:block;margin:0 auto;border-radius:8px}
.side-qr .sq-ph{width:132px;height:132px;max-width:100%;margin:0 auto;border-radius:8px;
  background:#f4f7fd;display:flex;align-items:center;justify-content:center;
  font-size:12px;color:var(--ink3);line-height:1.5}
.side-qr .sq-t{margin-top:6px;font-size:12px;font-weight:600;color:var(--ink2);line-height:1.35}
@media(max-width:1024px){ .side-qr{display:none} }
@media(min-width:1025px){ .cs-fab{display:none !important} }
.cs-fab{position:fixed;right:22px;bottom:22px;z-index:60;display:flex;flex-direction:column;
  align-items:flex-end;gap:10px}
.cs-fab .btncs{display:inline-flex;align-items:center;gap:8px;background:var(--blue);color:#fff;
  border:0;border-radius:999px;padding:12px 18px;font-size:14.5px;font-weight:600;cursor:pointer;
  font-family:inherit;box-shadow:0 8px 24px rgba(20,60,140,.3)}
.cs-fab .btncs:hover{background:var(--blue-d)}
.cs-fab .btncs .ic{font-size:16px}
.cs-pop{width:206px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:13px;
  box-shadow:0 14px 40px rgba(15,35,80,.2);display:none}
.cs-fab.open .cs-pop{display:block}
.cs-pop .t{font-size:14px;font-weight:700}
.cs-pop .s{font-size:11.5px;color:var(--ink3);line-height:1.6;margin:4px 0 10px}
.cs-qr{width:100%;aspect-ratio:1/1;border-radius:10px;background:var(--bg);
  border:1px dashed var(--line);display:flex;align-items:center;justify-content:center;
  text-align:center;color:var(--ink3);font-size:11.5px;line-height:1.65;padding:8px}
.cs-qr img{width:100%;height:100%;border-radius:10px;display:block}

/* 客服浮层：移动端底栏「客服」触发（PC 上悬浮卡已足够，不自动弹） */
.cs-mask{position:fixed;inset:0;background:rgba(12,22,42,.5);z-index:90;display:none;
  align-items:center;justify-content:center;padding:22px}
.cs-mask.on{display:flex}
.csbox{background:#fff;border-radius:18px;padding:22px 20px 20px;max-width:322px;width:100%;
  text-align:center;position:relative;box-shadow:0 20px 60px rgba(10,25,60,.3)}
.csbox h3{font-size:16px}
.csbox .s{font-size:12.5px;color:var(--ink2);line-height:1.7;margin-top:6px;text-align:left}
.csbox .x{position:absolute;top:8px;right:10px;border:0;background:transparent;font-size:21px;
  color:var(--ink3);cursor:pointer;line-height:1;padding:6px;font-family:inherit}
.csbox .cs-qr{width:196px;height:196px;margin:14px auto 6px}
.csbox ul{margin:12px 0 0;padding:0;list-style:none;text-align:left}
.csbox li{font-size:12.5px;color:var(--ink2);line-height:1.65;padding-left:16px;position:relative}
.csbox li:before{content:"·";position:absolute;left:4px;color:var(--blue);font-weight:700}

/* 通用弹屏（2026-10-20 · 快捷工具「弹屏」类型）：
   与客服浮层同一套遮罩与卡片语言，只是内容来自按钮的 data-qp-*。 */
.qp-mask{position:fixed;inset:0;background:rgba(12,22,42,.5);z-index:95;display:none;
  align-items:center;justify-content:center;padding:22px}
.qp-mask.on{display:flex}
.qpbox{background:#fff;border-radius:18px;padding:22px 20px 18px;max-width:360px;width:100%;
  position:relative;box-shadow:0 20px 60px rgba(10,25,60,.3)}
.qpbox h3{font-size:16px;padding-right:26px}
.qpbox .bd{font-size:13px;color:var(--ink2);line-height:1.8;margin-top:8px;white-space:pre-line}
.qpbox .x{position:absolute;top:8px;right:10px;border:0;background:transparent;font-size:21px;
  color:var(--ink3);cursor:pointer;line-height:1;padding:6px;font-family:inherit}
.qpbox .btn{margin-top:14px}

/* ================================================================
   移动端（≤768px）
   ----------------------------------------------------------------
   官网与手机共用同一份 HTML —— 一套 URL 就是一套收录，这是刻意的。
   所以手机端不能只是"三列塌成一列"（那是把 PC 版竖过来，首页会拉到 20 屏），
   而要按小程序的信息密度重排：卡片 13px 内距、双列网格、列表行、城市 tab。
   原则：第一屏必须能完成「查结果」，任何内容单屏不做超过 2 层嵌套。
   ================================================================ */
@media (max-width:1024px){
  .wrap{max-width:100%}
  .foot-grid{grid-template-columns:1.4fr 1fr 1fr}
  .g4{grid-template-columns:repeat(2,1fr)}
  .cols2{grid-template-columns:1fr}
  .city-hero .stats,.stats{grid-template-columns:repeat(3,1fr)}
  /* 年份页签：≤1024（手机/平板）改横滑单行 —— 上海 17 个年份在 820px 要换 6 行。
     （≤768 块里有同样的声明，此处覆盖平板段；两处同值不冲突。） */
  .yb-tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;
    scrollbar-width:none}
  .yb-tabs::-webkit-scrollbar{display:none}
  .yb-tabs label{flex:0 0 auto}
}
@media (max-width:900px){
  .g4,.g3{grid-template-columns:repeat(2,1fr)}
  .nodes{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr 1fr}
  .cols2{grid-template-columns:1fr}
  .promo ul{grid-template-columns:1fr}
  .banners.two{grid-template-columns:1fr}
  .npanes{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:768px){
  /* —— 1. 节奏令牌整体收紧：节间距 32→17，卡片 24→13 —— */
  :root{--sp4:11px; --sp6:14px; --sp8:17px; --r-l:12px}
  body{font-size:15px;line-height:1.62;padding-bottom:calc(58px + env(safe-area-inset-bottom))}
  .wrap{padding:0 14px}
  section{padding:15px 0}
  h1{font-size:20px;line-height:1.35;letter-spacing:0}
  h2{font-size:16.5px}
  h3{font-size:15px}
  .muted{font-size:12.5px}
  .mini{font-size:11.5px}
  .card{padding:13px;border-radius:12px}
  .sec-hd{gap:6px;margin-bottom:10px}
  .sec-hd .muted{flex:1 1 100%;font-size:12px}   /* 副标题独占一行，不跟标题抢宽度 */

  /* —— 2. 头部只留一行 48px：顶栏 + 城市条合计 86px（原 100px） —— */
  .nav{display:none}
  .topbar .wrap{gap:10px;height:48px}
  .logo{font-size:15px;gap:7px}
  .logo .mk{width:23px;height:23px;border-radius:6px;font-size:12.5px}
  .topbar .cta{padding:6px 11px;font-size:12.5px;border-radius:8px;margin-left:auto}
  /* —— 2b. 城市条：手机端全站隐藏（2026-10-09 晚 · Ryan 改版）——
     「首页已有六城入口、工具页有切换条、页脚有全量入口」⇒ 顶部这条在手机上纯占位。
     做法：display:none **保留 DOM**——A7 的城市条锚文本是静态扫描（断链检测/内链信号
     都靠 HTML），删 DOM 会连带丢掉这条内链资产；隐藏则两者都保住。
     🔴 换城兜底（手机端）：首页六城格 / 工具页城市切换条 / 工具总页顶部选城市 / 页脚。
     原「分两排 2×3」的适配规则随之退役（城市条在手机上不再渲染）。 */
  .citybar{display:none}
  .alertbar .wrap{padding:8px 14px;font-size:12.5px;gap:6px;align-items:flex-start}
  .alertbar .lvl{padding-top:1px}
  .crumb{padding:8px 0;font-size:12.5px}

  /* —— 3. Hero：去掉 34px 顶部空档，字号降到 20 —— */
  .hero,.svc-hero{padding:16px 0 18px}
  .hero .sub,.svc-hero .sub{font-size:13px;margin-top:8px;line-height:1.72;opacity:.9}
  .hero h1{font-size:20px}
  .badges{gap:5px;margin-top:11px}
  .badge{font-size:11.5px;padding:3px 10px}

  /* —— 4. 网格：一律双列（服务格/城市卡/工具/官方行），单列只留给长文本 —— */
  .g3,.g4{grid-template-columns:repeat(2,1fr);gap:10px}
  /* 🔴 .g2 只用在资讯列表上：移动端两列会把标题挤到 3~5 行，整节从 1 屏涨到 4 屏 */
  .g2{grid-template-columns:1fr;gap:10px}
  .tools{grid-template-columns:1fr;gap:10px}
  .tool{padding:13px;gap:9px}
  .tool .hd{font-size:15px}
  .tool .ic{width:26px;height:26px}
  .tool .inp{height:42px}
  .nodes{grid-template-columns:repeat(2,1fr);gap:8px}
  .stats,.city-hero .stats{grid-template-columns:repeat(3,1fr);gap:7px}
  .city-hero .stat{padding:9px 9px}
  .stat{padding:9px 9px}
  .stat .k{font-size:11px}
  .stat .v{font-size:16px;margin:2px 0}
  .stat .n{font-size:10.5px;line-height:1.4}
  .node{padding:10px}
  .node .k{font-size:11px}
  .node .v{font-size:15px;margin:2px 0}
  .node .n{font-size:10.5px;line-height:1.45}

  /* —— 5. 城市卡：**单列五行**（2026-10-07 第六批 · Ryan 需求 5 复核后改）——
     🔴 原来这里是「1fr auto」两列：左列城市身份、右列本月数字。它是**放不下**的，
        只是以前没人量过：
          · 右列是 `auto`，宽度由最长那条 `.line` 的 nowrap 文本决定。上海那条
            「个人额度拍卖 · 预计 10 月 24 日（预计）」= **229px**，杭州/天津 = 203px；
          · 左列是 `1fr`，但它有 min-width:auto 的下限，撑到 `.top` 的 min-content；
          · 390px 下卡内宽只有 336px，而两列 + 列距实测要 **360px**（360px 视口要 361px）
            ⇒ 栅格整体比卡片宽 24–55px，被 `.city-card{overflow:hidden}` 裁掉。
        裁掉的正是**右边的值**：实测 上海「4230 个」只剩「4230」、「10 月 24 日（预计」缺右括号、
        天津「9687 个」只剩「9687」；同时 `.plate` 被挤到 min-content，
        「沪」和「A」折成两行，徽标变成 48px 高的方块。北京/深圳/广州凑巧放得下，所以六张卡
        是一半正常一半破 —— 这就是肉眼看到的「错落」。
     🔴 修法：改成**真单列**，每行独占整卡宽（`.line` 本来就 `justify-content:space-between`，
        标签靠左、数值靠右，数值沿右边缘对齐反而更好扫）。任何宽度都不再溢出。
        同时给 `.plate` 加 nowrap 兜底 —— 不写的话 flex 仍可能把它压成两行。
     ⚠️ 代价（明说）：卡片由 122/143px 变高到 ~136/162px，六城列表 795px → ~946px。
        这是「值不被裁掉」的必然结果；两列版省下的那点高度，本来就是靠裁字换来的。 */
  .city-card{display:grid;grid-template-columns:1fr;gap:6px;padding:12px 13px;
    border-radius:12px;align-items:center}
  .city-card .top{gap:7px;flex-wrap:nowrap}
  .city-card .nm{font-size:15px;white-space:nowrap}
  .city-card .mode{font-size:10px;padding:0 6px;white-space:nowrap}
  .city-card .plate{white-space:nowrap}
  .city-card .line{font-size:12px;white-space:nowrap;gap:7px}
  /* 🔴 只有六城入口要单列——服务卡的 .g3 保持两列反而更省（名称+价格不折行） */
  #cities .grid.g3{grid-template-columns:1fr}
  .city-card .line b{font-size:12.5px}
  .city-card .tag{font-size:11px;padding:1px 7px}
  /* 🔴 2026-10-07（Ryan 提）：手机端此前把 .foot 整个 display:none —— 六城卡片在
     手机上看起来只是一块信息，没有「可以点进去」的提示（PC 端一直有这一行，
     而且整张卡本来就是个链接，缺的只是显式引导）。
     现在补回来并收窄：条目数留小字，右句加粗上蓝，作为明确入口。
     🔴 第六批修正：改单列后 `.foot` 自然落在最后一行、且是满宽——
        不再需要（也**不应该**）写 grid-area：写死行号会在「有的城没有 .l3」时错位。
        原来那个 `.foot` 落 r3c1 只占左半格 / 北京落 r2c2 的错位，根因就是它没有 grid-area
        而其它四个子元素都有；单列之后自动落位本身就不会错。 */
  .city-card .foot{display:flex;padding-top:6px;font-size:12px;gap:6px}
  .city-card .foot span:last-child{color:var(--blue);font-weight:600;white-space:nowrap}

  /* —— 6. 服务卡：照小程序 .svc-cell 的排法——图标＋名称一行、价格一行、
     一句话两行封顶。要点清单与城市 chip 一律进详情页，移动端不铺。 —— */
  .svc-card{padding:12px;gap:5px;border-radius:12px}
  .svc-card .hd{flex-wrap:wrap;row-gap:2px;gap:0}
  .svc-card .ic{width:24px;height:24px;flex:0 0 24px;border-radius:7px;font-size:12.5px;
    margin-right:7px}
  .svc-card .nm{font-size:14px;white-space:nowrap;flex:1 1 auto;min-width:0}
  .svc-card .pri{margin-left:0;flex:1 1 100%;font-size:11.5px;padding-left:31px}
  .svc-card p{display:none}
  .svc-card ul,.svc-card .chips{display:none}
  .svc-card>.mini{font-size:11px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;
    -webkit-box-orient:vertical;overflow:hidden;min-height:33px}
  .svc-foot{padding-top:7px;margin-top:3px;font-size:12px}
  .svc-foot .mini{display:none}
  .svc-foot a{font-size:12px}

  /* —— 7. 资讯区：6 城塌成 1680px ⇒ 改城市 tab，单城 5 篇 —— */
  .ntabs{display:flex;gap:6px;overflow-x:auto;margin:0 -14px 10px;padding:0 14px 2px;
    scrollbar-width:none}
  .ntabs::-webkit-scrollbar{display:none}
  .ntabs button{flex:0 0 auto;border:1px solid var(--line);background:var(--white);
    border-radius:var(--r-p);padding:6px 13px;font-size:13px;color:var(--ink2);
    font-family:inherit;cursor:pointer}
  .ntabs button.on{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:600}
  .npanes{display:block}
  .npanes .npane{display:none}
  .npanes .npane.on{display:block}
  .art-block{padding:13px 14px;border-radius:12px}
  .art-block .bh{margin-bottom:6px;padding-bottom:7px}
  .art-block .bh .nm{font-size:14.5px}
  .art-list a,.art-list .art-plain{padding:9px 0;font-size:13.5px;
    display:flex;justify-content:space-between;gap:10px;align-items:baseline}
  .art-list .dt{margin-left:0}

  /* —— 8. 官方入口：两行压成一行半，去掉分类 tag —— */
  .offi{padding:2px 13px;border-radius:12px}
  .offi .row{gap:9px;padding:11px 0}
  .offi .ic{width:28px;height:28px;flex:0 0 28px;font-size:13px;border-radius:8px}
  .offi .nm{font-size:13.5px}
  .offi .host{font-size:10.5px}
  .offi .tg{display:none}
  .offi a.go{font-size:12.5px}
  .disclaim{font-size:11.5px}

  /* —— 9. 横幅 / CTA / 小程序桥：单列紧凑 —— */
  .banners{gap:9px;margin-top:14px}
  .banner{padding:13px;gap:10px}
  .banner .bd{flex:1 1 100%}
  .banner .tt{font-size:15px}
  .banner .ss{font-size:12.5px;line-height:1.6}
  .banner .go{width:100%;text-align:center;padding:9px 14px;font-size:13.5px;border-radius:9px}
  /* 服务页横幅 手机端（2026-10-14 Ryan 定版式，四城统一）：
     第一格「申请截止日」独占一行，第二行＝竞价日 + 摇号日并排（原第 3 格跨列会留出半行空白）。 */
  .svc-banner{padding:13px;margin-top:14px}
  .svc-banner .sb-hd{gap:9px}
  .svc-banner .sb-tt{font-size:14.5px}
  .svc-banner .sb-go{width:100%;text-align:center;padding:10px 14px;font-size:13.5px;border-radius:9px}
  .svc-banner .sb-nodes{grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
  .svc-banner .sb-nb{padding:10px}
  .svc-banner .sb-nb:nth-child(1){grid-column:1/-1}
  .svc-banner .sb-v{font-size:14.5px}
  .svc-banner .sb-sub{margin-top:9px;font-size:11.5px}
  .cta{padding:16px;gap:12px;border-radius:12px}
  .cta .bd{flex:1 1 100%}
  .cta .btn{width:100%}
  .mpb{padding:15px;gap:12px;border-radius:12px}
  .mpb .bd{flex:1 1 100%}
  .mpb .kicker{font-size:11px;padding:3px 10px;margin-bottom:8px}
  .mpb h2{font-size:19px;margin-bottom:7px}
  .mpb p{font-size:13px;line-height:1.7}
  .mpb .act{margin-top:13px;gap:9px}
  .mpb .tiny{margin-top:7px}
  .mpb .envtip{font-size:11px;padding:8px 11px;line-height:1.68}
  .mpb .placeholder{margin-top:7px}
  .mpb .codes{width:100%;justify-content:center;gap:11px}
  .mpb .code{width:100px;padding:8px}
  .mpb .code .box{width:74px;height:74px;margin-bottom:5px}
  .mpb .code .cap{font-size:11px}
  .panel{padding:14px}
  .panel ul{font-size:13px;gap:7px}
  .notice{padding:12px 13px;font-size:12.5px}
  .pending{padding:15px}
  .lede{font-size:14px;padding:13px 14px}
  .proto-note{padding:11px 13px;font-size:12px}

  /* —— 10. 文章页 —— */
  .art-meta{gap:8px 14px;font-size:12px;padding-bottom:11px;margin-bottom:14px}
  .ilinks{grid-template-columns:repeat(2,1fr);gap:9px}
  .ilink{padding:11px;border-radius:9px}
  .ilink .t{font-size:13.5px}
  .ilink .d{font-size:11.5px}
  .steps{margin-left:10px}
  .steps li{padding:0 0 18px 38px}
  .steps .st{font-size:14px}
  .steps .sd{font-size:12.5px}
  .quiz .q{padding:12px 0}
  .quiz .ql{font-size:13.5px}
  .res{padding:13px}
  .res ul{font-size:13px}

  /* —— 11. 页脚：四组塌成一列太高 ⇒ 双列 + 更紧行距 —— */
  .foot-grid{grid-template-columns:1fr;gap:2px}
  /* 🔴 footer ul 在桌面是 display:flex —— flex 容器上的 columns 直接失效（踩过），
     移动端必须显式改回 block，多列才会生效。 */
  .foot-grid ul{display:block;columns:2;column-gap:16px}
  .foot-grid li{margin-bottom:5px;font-size:12.5px;break-inside:avoid}
  .fold>summary{display:flex;align-items:center;justify-content:space-between;
    padding:13px 0;font-size:14px;font-weight:600;color:var(--ink);
    border-bottom:1px dashed var(--line);cursor:pointer}
  .fold>summary:after{content:"展开";font-size:11.5px;font-weight:400;color:var(--ink3)}
  .fold[open]>summary:after{content:"收起"}
  .fold[open]>summary{border-bottom-color:transparent}
  .fold h3{display:none}
  .fold .fb{padding-bottom:10px}
  footer{padding:18px 0 22px;margin-top:16px}
  .foot-bot{margin-top:14px;padding-top:12px;font-size:11.5px;gap:6px}
  .promo li{padding:10px 12px}

  /* —— 12. 触屏与底部导航 —— */
  .opt{min-height:44px;display:inline-flex;align-items:center;padding:8px 13px}
  .btn{min-height:44px}
  summary{padding:14px 0;font-size:14.5px}
  details{padding:0 14px}
  details .ans{padding:0 0 14px 26px;font-size:13.5px}
  /* 🔴 5 项（2026-10-06 加「客服」）：每项占 1/5，最窄 360px 屏下单项 72px，
     图标 17px ＋ 两字标签 11px 刚好放得下；再多一项就要动字号了。 */
  .mnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;
    z-index:60;background:rgba(255,255,255,.97);border-top:1px solid var(--line);
    padding-bottom:env(safe-area-inset-bottom);backdrop-filter:saturate(180%) blur(8px)}
  .mnav a,.mnav button{display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:2px;min-height:54px;font-size:12px;color:var(--ink3);
    border:0;background:transparent;font-family:inherit;cursor:pointer;padding:0}
  .mnav a:hover,.mnav button:hover{text-decoration:none}
  .mnav a.on,.mnav button.on{color:var(--blue);font-weight:600}
  .mnav .ic{font-size:17px;line-height:1}

  /* —— 客服浮层 + 价值图示在窄屏的折法 —— */
  .cs-fab{display:none}                     /* 手机端走底栏入口，右下角悬浮不重复占位 */
  /* 🔴 2026-10-07（Ryan 提「排面要再精简 / 直观 / 大气」）：原来的 .bv 五格汉字图示 +
     .bv-flow 流程胶囊已从组件里删掉，窄屏这两条规则成了死规则（指向不存在的类）。
     换成新的 .feats（五项权益 SVG）与 .msteps（三步流程）的窄屏折法：
     五项横排 → 两列；第 5 项独占一行，不留半格空位。 */
  .feats{grid-template-columns:repeat(2,1fr);gap:8px;margin-top:12px}
  .feats li:last-child:nth-child(odd){grid-column:1/-1}
  .feats li{padding:11px}
  .feats .ic{width:25px;height:25px;border-radius:8px}
  .feats .ic svg{width:14px;height:14px}
  .feats b{font-size:12.5px}
  .feats .ss{font-size:10.5px;line-height:1.5}
  /* 三步流程：宽屏是「1 → 2 → 3」一行横排，窄屏换成竖排编号列表。
     🔴 为什么必须换：这一行的字符数在 390px 屏上正好卡在换行边界，
        横排会变成「1 → 2 →」+「→ 3」，第二行开头挂着一个孤立的箭头，
        看着像排版事故。竖排每个编号自成一行，读起来就是「先…再…最后…」。 */
  .msteps{display:block;font-size:13px;margin-top:12px}
  .msteps li{margin-top:7px}
  .msteps li+li:before{content:none}
  .msteps li i{width:18px;height:18px;font-size:10.5px}

  /* —— 13. 指标有效期提醒模块（见 .zb-* 组件）—— */
  .zb-card{padding:14px}
  .zb-cur{flex-direction:column;align-items:stretch;gap:10px}
  .zb-cur .zb-days{margin-left:0;text-align:left}
  .zb-bar{height:6px}
  .zb-marks span{font-size:10.5px}
  .zb-tiers{gap:8px}
  .zb-tier{padding:10px 11px}
  .zb-tier .t{font-size:13px}
  .zb-tier .d{font-size:11px}
  .zb-form{grid-template-columns:1fr;gap:9px}

  /* —— 14. 城市页头与走势图：手机端首屏只留「核心数据 + 日期」——
     🔴 2026-10-07 二次压缩（Ryan 提：hero 占满一屏手机首屏）。基线 546–591px，
        目标是 400–450px。逐项省出的高度（实测值，不是估的）：
          · 徽章行整行去掉          −27px（车牌/城市/模式在城市条与 h1 里已有，
                                            「数据基准」并入「关键数据」标注，信息没丢）
          · 两张看板卡合成一张      −12px（少一层内边距与一条边框，改由分隔线区隔）
          · 节点卡行高 107→91       −16px（三行内部的 margin/gap 与时序线高一起收紧）
          · 统计卡行高 101→88       −13px（同上）
          · 内边距 / 外边距 / 标题   −35px
        手机端文案字号只在「非正文」的注释行上减 1px（12.5→11.5 之类），
        h1 / .sub / 节点值 / 统计值这些**要读的数**一律不动或只降 1px。 */
  .city-hero{padding:11px 0 13px}
  .city-hero h1{font-size:19.5px;line-height:1.3}
  .city-hero .sub{font-size:13px;line-height:1.6;margin-top:6px}
  /* 徽章行在手机端整行隐去：这三项在紧邻的城市条与 h1 里都已出现，
     「数据基准」已并入下方「关键数据」的标注——属于搬家，不是删信息。 */
  .hero-meta{display:none}
  /* 看板：手机端只剩「关键数据」一块（时间轴已迁到 .flow-sec），
     所以不再需要「两段之间画分隔线」那套。 */
  .hero-board{margin-top:7px;gap:0;background:var(--bg);
    border:1px solid var(--line);border-radius:var(--r-m);padding:10px}
  .hb-row{background:none;border:0;border-radius:0;padding:0}
  .hb-lab{font-size:11.5px;gap:6px;margin-bottom:5px}
  .hb-lab em{font-size:10.5px}
  /* 节点卡：手机端**一行横滑**，不换行。
     🔴 为什么不是两列网格：天津/杭州/上海都是 4 条节点，两列就是两行（约 190px），
        而这几条本来就是一条「日期时间轴」，横着排才符合阅读顺序；
        横滑后无论 3 条还是 4 条都只占一行，手机端首屏直接省下半屏。
     左右各出血 10px（等于看板内边距），让下一张卡露一角，提示可滑。 */
  .hb-row .nodes{display:flex;gap:7px;overflow-x:auto;-webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;margin:0 -10px;padding:0 10px 3px;
    /* 右缘渐隐：让「还能往右滑」一眼可辨，不用额外加提示文字 */
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 20px),transparent);
    mask-image:linear-gradient(90deg,#000 calc(100% - 20px),transparent)}
  /* 宽度 170px：北京节点值是「8 月 1 日 – 10 月 8 日」这种 15 字日期区间，
     156px 会把它挤到第二行、把整条带高撑起来。 */
  .hb-row .node{flex:0 0 170px;scroll-snap-align:start;padding:8px 10px}
  .hb-row .node .k{line-height:1.4}
  .hb-row .node .v{font-size:15px;line-height:1.35;margin:1px 0}
  .hb-row .node .n{font-size:11px;line-height:1.4;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  /* 本期流程（2026-10-07 第五批，Ryan 需求 3）：已从 hero 独立成区，
     手机端改**纵向全展开**。
     🔴 为什么不再是横滑：横滑时第 4 个节点起就被裁在屏幕外，用户得先
        「发现能滑」再动手；而这是一条有先后顺序的流程，漏看中间一步就是误导。
     🔴 脊线仍是逐段画（::before 定位在每个 li 内），只是方向由横线换竖线：
        改成 .tl 上一条绝对定位竖线的话，将来任何一次「限高 + 内部滚动」都会把线截断。
     🔴 dot 用 absolute 而不是给 li 加 grid：加 grid 会改视觉流，而 A16 闸门认的是
        四个 span 严格相邻的固定顺序——不动 DOM 才不动闸门。 */
  .flow-sec{padding:13px 0 15px}
  .flow-sec .sec-hd{margin-bottom:10px}
  .flow-sec .tl{display:block;padding:2px 0 0}
  /* 🔴 2026-10-07 第六批（Ryan 拍板 a2 方案2）：每个节点从**三行压到两行** ——
     第一行「标签（左）＋ 值（右对齐）」，第二行「依据」夹到 1 行。
     实测每节点 66–88px → ~46px，8 节点 ~530–700px → ~370px。
     为什么不用「2 列栅格」那个方案：2 列下竖脊线会指错顺序（左列到底该接右列还是下一行），
     撤掉脊线就丢了「一期一条线」的时序感；而单列两行**时序感一点没丢**。
     ⚠️ 已知代价：依据从 2 行夹到 1 行，更长的说明要点开 hero 的「日期怎么推算的」看。
     🔴 DOM 一个字节不动（li 仍只有 tl-s / tl-s hot 两种 class、四个 span 严格相邻、ol 无属性）
        ⇒ A16 闸门零改动。 */
  .flow-sec .tl-s{position:relative;display:grid;grid-template-columns:auto 1fr;
    column-gap:10px;align-items:baseline;padding:0 0 9px 20px;min-width:0}
  .flow-sec .tl-s:last-child{padding-bottom:0}
  .flow-sec .tl-s::before{content:"";position:absolute;left:4px;top:0;bottom:0;
    width:1px;height:auto;right:auto;background:var(--line)}
  .flow-sec .tl-s:last-child::before{display:none}
  .flow-sec .tl-dot{position:absolute;left:0;top:4px;width:9px;height:9px}
  .flow-sec .tl-lb{grid-column:1;margin-top:0;font-size:12.5px}
  .flow-sec .tl-v{grid-column:2;margin-top:0;font-size:14px;
    text-align:right;justify-self:end}
  .flow-sec .tl-n{grid-column:1 / -1;margin-top:2px;font-size:11px;
    display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
  .hb-row .stats{gap:6px}
  .hb-row .stat{padding:8px}
  .hb-row .stat .k{line-height:1.4}
  .hb-row .stat .v{font-size:16px;line-height:1.35;margin:1px 0}
  .hb-row .stat .n{font-size:11px;line-height:1.4;
    /* 🔴 安全阀（2026-10-07）：数据条的 note 现在是构建期生成的，
       内容一长就会把整条撑高（实测天津 88px → 134px，hero 直接超预算）。
       夹到 2 行，多的让位给折叠块里的「数据口径」说明。 */
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .hero-note{margin-top:6px}
  .hero-note>summary{font-size:11px;padding:4px 9px}

  .bidcard{padding:13px 12px 12px}
  .bid-hd h3{font-size:15px}
  .bid-sub{font-size:12px;line-height:1.6}
  .bidsvg{margin-top:9px}
  .bidsvg.d{display:none}
  .bidsvg.c{display:block}
  .bid-swipe{display:block}
  /* 手机端年份页签：横滑单行（全史后上海 17 个年份换行要 9 行、占掉大半个屏）。
     默认停在最左＝最新年份，右滑看历史；边缘截断的胶囊本身即是「可滑」提示。 */
  .yb-tabs{margin-top:9px;gap:4px;padding:4px;flex-wrap:nowrap;overflow-x:auto;
    -webkit-overflow-scrolling:touch;scrollbar-width:none}
  .yb-tabs::-webkit-scrollbar{display:none}
  .yb-tabs label{padding:4px 11px;font-size:12px;flex:0 0 auto}
  /* 手机端隐藏「全年 / 1–9 月」小字：只留年份数字更紧凑 */
  .yb-tabs label em{display:none}
  .bid-tbl table,.bid-tbl th,.bid-tbl td{font-size:11.5px}
  .bid-src,.bid-notes{font-size:11px}
}

/* ============================================================================
   城市页「政策与申请条件」正文块（2026-10-11 新增 · 第 1 层关键词落位）
   起因：关键词覆盖对账发现 T0 核心词 1,264 个字面覆盖率仅 4.7%，根因是
        「TDK 骨架（摇号竞价-官网入口-申请条件-结果查询）与用户真实用语（上牌政策 /
          摇号日期每月 / 中签率 / 指标过期）有系统性落差」。
   做法：在城市页新增一个正文小节，把主题词按正常人说话的方式写进 H3 与段落。
   🔴 不设 font-size —— 交给 body 继承（桌面 14px / 手机 15px），
      手机端 15px 正好落在百度「正文推荐 14px」之上，不要在这里压小。
   🔴 只影响 `#policy`，其余版式零改动；不参与 .foot/.pin 的按钮同线（B14）。
   ============================================================================ */
#policy .pb{background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);padding:20px 22px}
#policy .pb h3{font-size:16px;margin:20px 0 8px;padding-top:18px;border-top:1px solid var(--line2)}
#policy .pb h3:first-child{margin-top:0;padding-top:0;border-top:0}
#policy .pb p{color:var(--ink2);line-height:1.85;margin:0 0 10px}
#policy .pb p:last-child{margin-bottom:0}
@media(max-width:768px){#policy .pb{padding:15px 16px}#policy .pb h3{font-size:15.5px}}

/* ============================================================================
   🔴 移动端触控热区补丁（2026-10-11 新增 · 依据百度官方规范，非主观审美）
   百度《Mobile Friendly 标准 V1.0》原文：
     ·「文字链整体可点区域不小于 40px」
     ·「主体内容中的其他可点区域，宽度和高度应大于 40px」
   实测（无头 Chrome，402×874 真机口径）低于该值的元素与实测高度：
     顶栏品牌 a.logo 24px ｜ 顶栏 CTA a.cta 32px ｜ 面包屑 .crumb a 15px ｜
     服务卡脚 .svc-foot a 19px ｜ 文字链 a.mini 13px ｜ 首页筛选 .ntabs button 32px ｜
     走势图年份 .yb-tabs label 29px ｜「前往 →」.offi a.go 20px ｜ hero 折叠条 30px
   做法：只在手机端抬高「被点元素自身」的最小高度并垂直居中，桌面端零改动。
   🔴 动这块必须同批复跑三道闸门：
      B6（城市页 hero 高度预算 ≤350px，城市页含 .cityswitch 与 .hero-note）
      B14（工具卡主按钮每排底边 ≤2px —— .svc-foot 与 .pin/.foot 是不同类，但需确认无连带）
      B10b（PC 输入框 ≥150px，仅 4/6 列卡，理论上不受手机端规则影响）
   🔴 用 a.cta / a.logo / a.mini 做元素限定：.cta 与 .mini 同时被非链接元素使用
      （例：<div class="cta"> 是区块、<span class="mini"> 是文本），不加限定会误伤布局。
   🔴🔴 2026-10-13 Ryan 定「按推荐的统一改」：**全部 40px → 44px**。
      两套标准在这儿并存，改之前先看清用哪一套：
        · **百度**搜索资源平台《移动适配》：可点元素「宽度和高度应大于 **40px**」——本项目原按此设 40px，**已达标**；
        · **Apple HIG / Material**：建议 ≥**44px**（HIG）/ 48px（Material），是更严的一档。
      Ryan 选 44px ⇒ 同时满足两套口径。⚠️ 动这块必须同批复跑 B6 / B14 / B10b 三道闸门（见上）。
   ============================================================================ */
@media(max-width:1024px),(pointer:coarse){
  a.logo,a.cta{display:inline-flex;align-items:center;min-height:44px}
  .crumb a{display:inline-flex;align-items:center;min-height:44px;padding:0 2px}
  .svc-foot a{display:inline-flex;align-items:center;min-height:44px;padding-top:6px}
  a.mini{display:inline-flex;align-items:center;min-height:44px}
  .ntabs button{min-height:44px}
  .yb-tabs label{display:inline-flex;align-items:center;min-height:44px}
  .offi a.go{display:inline-flex;align-items:center;min-height:44px;padding:0 4px}
  .hero-note>summary{min-height:44px}
}

/* 🔴 触控热区补丁 v2（同日首轮复测后补齐残留 5 类）
   首轮漏网（复测实测值）：
     .cityswitch a 54×31 —— 首版漏写（它在 hero 内，会动 B6 高度预算，故单列）
     .crumb a 29×40 —— 高度已达标但**宽度仅 29px**；百度原文是「宽度和高度应大于 40px」，两个维度都要看
     .tp-rel a 144×38 / .banner .go 346×39.x / .bid-src a 79×13 —— 差 2px 与差 27px 两类
   注意 .cta 与 .mini 的歧义已在上块用元素限定处理，本块同理只写元素或带容器限定的选择器。 */
@media(max-width:1024px),(pointer:coarse){
  .cityswitch a{display:inline-flex;align-items:center;min-height:44px}
  .crumb a{min-width:44px;justify-content:center}
  .tp-rel a{display:inline-flex;align-items:center;min-height:44px}
  .banner .go{display:inline-flex;align-items:center;justify-content:center;min-height:44px}
  .svc-banner .sb-go{display:inline-flex;align-items:center;justify-content:center;min-height:44px}
  .bid-src a{display:inline-flex;align-items:center;min-height:44px}
  /* 🔴 2026-10-13 补：页脚 4 个折叠块（.fb：城市入口 / 服务产品 / 跨境事务 / 自助工具）
     里的链接**原来就漏了** —— 上面那 12 条补丁没覆盖到它，实测只有 15px 高（最难点准的一批）。
     祖先链：A ← LI ← UL ← DIV.fb ← DETAILS.fold。 */
  .fb a,footer a{display:inline-flex;align-items:center;min-height:44px}
  .fb li,footer li{display:flex;align-items:center;min-height:44px}
  /* 同日再补两类（城市页实测残留）：文章列表里的城市/文章链、走势图「查看逐月数值」折叠条 */
  .art-list a{display:inline-flex;align-items:center;min-height:44px}
  .bid-detail>summary,.yb-p>summary{display:flex;align-items:center;min-height:44px}
}
/* 🔴 触屏设备统一（2026-10-13 补）：仅按宽度断点会漏掉 iPad 竖屏（820px）。
   用 pointer:coarse 精确命中触屏 —— 触控目标只对触屏有意义，鼠标设备不需要。 */
/* 🔴 2026-10-13 修**既有**缺口（非本次引入）：768–1024px 之间城市页时间轴溢出。
   实测 820px：scrollWidth 960 vs clientWidth 820 ⇒ 溢出 140px。
   原因：桌面版 `.tl-s{flex:1 1 0;min-width:118px}` × 8 个节点 = 944px，820px 容器放不下；
   而移动版纵向样式只在更窄的断点才生效，中间这一段落空。
   修法：该区间让时间轴两列换行 —— 桌面（>1024）与手机（≤768）表现完全不变。 */
@media(min-width:769px) and (max-width:1024px){
  .flow-sec .tl{flex-wrap:wrap;row-gap:16px}
  .flow-sec .tl-s{flex:1 1 calc(50% - 8px);min-width:0;padding-right:0}
}

@media(pointer:coarse){
  a.logo,a.cta,.crumb a,.svc-foot a,a.mini,.ntabs button,.yb-tabs label,
  .offi a.go,.hero-note>summary,.cityswitch a,.tp-rel a,.banner .go,.bid-src a,
  .fb a,footer a,.fb li,footer li,.art-list a,.bid-detail>summary,.yb-p>summary,
  /* 🔴 补：顶栏导航与城市条 —— 手机端城市条是隐藏的，但 iPad 竖屏（820）会显示出来，
     实测只有 25px 高。这两类元素只在「宽度 >768 且触屏」时才会暴露，所以必须放进本块。 */
  .nav a,.citybar a,.scroll a,
  /* 🔴 补：资格自测的选项按钮（.opt，实测 38px）与城市页工具区链接 */
  .opt,p.tool-alt a,.tool a,details>summary,.tool-alt a,.tool .tool-alt a,.tool-alt a{
    display:inline-flex;align-items:center;min-height:44px;
  }
  .crumb a{min-width:44px;justify-content:center}
  .fb li,footer li{display:flex}
  /* 🔴 长标签挤压输入框：实测 360px 下「指标到期日（以上海指标系统显示为准）」标签 245px，
     把日期输入框压到 39px（既触控不达标、也无法输入）。修法与前文 PC 端 .tools-4/.tools-6
     的既有修法同源 —— 装不下时让输入框换行独占整行，装得下则照常并排。 */
  .ladd .row{flex-wrap:wrap}
  .ladd .inp{flex:1 0 120px}
}