/* =========================================
   卫生间 - 复刻样式
   ========================================= */

:root {
  --paper: #f7f0df;
  --ink: #283c42;
  --red: #e76354;
  --yellow: #f4c64f;
  --mint: #9bcdb4;
  --blue: #84a7b9;
  --line: 2px solid var(--ink);
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  /* 底部导航栏 .cq-bottom 的实占高度 —— **实测固定 65px**。
     ⚠ 2026-09-21 订正归因：旧注释写「8 + 48(导航项) + 8 + 1(边框)」，**三项全不对**。
       实测 = 8(上内边距) + 47(.cq-nav 实高) + 8(下内边距) + 2(--line 边框) = 65（65 是巧合对上的）。
       其中 .cq-nav 的 47px 是**内容驱动**（12px 标签行高决定，min-height:44px 根本没生效），
       **推不出来** —— 所以别按公式算，改完必须实测回填。
     ⚠ 任何要"吸在导航栏上方"的元素都必须用它做偏移，否则会被导航条盖住。
     ⚠ 2026-09-20：80 → 65。SOS(.cq-urgent) 改用负 margin 上探，不再计入栏高。 */
  --bottomnav-h: 65px;

  /* ============================================================
     语义色 Token（2026-09-21 重构：收敛 styles.css 内 200+ 散色）
     核心规则：① 同一"语义角色"只用同一 token；② 品类身份靠图标/文字，
     颜色只表达"状态/选中/方向/信息"，不再用色相区分男/女/无障碍/母婴，
     从根上消除"绿=无障碍"撞"绿=有"这类色相碰撞。
     ============================================================ */
  --c-ink: #283c42;          /* 唯一文字/描边黑（收口 var(--c-ink)/#5e7774/#6c807d 等近亲） */
  --c-ink-soft: #6b6256;     /* 辅助文字 / 次要说明（棕灰） */
  --c-select: #f4c64f;       /* 统一"选中 / 激活"（黄，与警示红彻底分开） */
  --c-select-ink: #5a3e00;   /* 黄底上的深色文字 */
  --c-select-bd: #d9a800;    /* 黄底描边 */
  --c-pos: #247756;          /* 唯一"有 / 可用 / 正常"（绿）。2026-09-21 由 #2F8F68 加深：
                                旧值在 pos-bg/纸底/卡底/白 *全部* 只有 3.5~4.0:1，未达 AA；
                                新值四种底色 4.80~5.46:1 全过。同时并入第二个绿 #3F8A63。 */
  --c-pos-bg: #eaf4ef;       /* 浅绿底（原 #E3F0E7/#D9F0E0/#E1F5EE/#EAF3DE 四值收口于此） */
  --c-pos-bd: #a9d6c0;       /* 浅绿底上的软描边（原 #9FC8A8/#97C459 收口于此） */
  --c-pos-bg-hover: #dceee6; /* 浅绿底 hover 加深（其上 --c-pos 文字仍 ≥4.5:1） */
  --c-neg: #c0392b;          /* 唯一"无 / 关闭 / 警示"（红） */
  --c-neg-bg: #fdeceb;
  --c-warn: #b45309;         /* 唯一"注意 / 待办"（琥珀） */
  --c-warn-bg: #fff6e8;
  --c-info: #1f5fa6;         /* 唯一"信息 / 数据缺失 / 反向方向"（蓝） */
  --c-info-bg: #eef4fb;
  --c-info-bd: #bcd6f2;
  --c-rating: #bd7016;       /* 评分**星标图形**专用深金（原 #e99b37 在卡底仅 2.24:1，
                                连图形 3:1 门槛都不过）。⚠️ 评分**数字**不走此色 —— 数字是
                                数据、用 --c-ink 墨（11.37:1）；一色两用是最严场景必不达标的根因。 */
  --c-act: var(--red);       /* 唯一「主行动」红（确认 / 下一站 / 我下地铁了 / SOS）：大面积实底 + 白字 + 墨描边 */
  --c-select-bg: #fff7e6;    /* 黄底「选中」的浅填充（与 --c-select / --c-select-ink 配套） */
  /* 圆角 / 阴影刻度（收口散落字面量） */
  --radius-pill: 999px;
  --radius-card: 12px;
  --radius-sm: 8px;
  --shadow-1: 2px 2px 0;
  --shadow-2: 4px 4px 0;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  -webkit-text-size-adjust: 100%;
  font-family: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  background: #dfe7e2;
  color: var(--ink);
  min-height: 100dvh;
  line-height: 1.5;
}

button {
  font-family: inherit;
  cursor: pointer;
  border: 0;
  background: transparent;
  color: inherit;
}

body {
  touch-action: manipulation;
}

/* ========== App Shell ========== */

.cq {
  min-height: 100dvh;
  background: #dfe7e2;
}

.cq-app {
  max-width: 720px;
  min-height: 100dvh;
  margin: auto;
  /* 底部避让：底栏实占 + 16px 余量。原为硬编码 96px（=80+16），与 --bottomnav-h 重复且易脱钩。 */
  padding: calc(var(--safe-top) + 8px) 16px calc(var(--bottomnav-h) + 16px + var(--safe-bottom));
  background: var(--paper);
  background-image: radial-gradient(#d8cba9 .7px, transparent .8px);
  background-size: 10px 10px;
  position: relative;
  /* ⚠ 原为 overflow:hidden —— 它会把自己变成 sticky 的"滚动容器"，而它从不滚动，
     导致内部任何 position:sticky（如推荐页主行动「我下地铁了」）全部失效。
     overflow:clip 视觉裁剪效果一致，但**不创建滚动容器**，sticky 才回落到视口生效。
     先写 hidden 再写 clip：支持 clip 的浏览器用 clip，太老不支持的退回 hidden
     （此时 sticky 失效，按钮仍可滚动到，只是不吸底）。clip 不支持程序化 scrollTop，本页无此用法。 */
  overflow: hidden;
  overflow: clip;
}

/* ========== Top Bar ========== */

.cq-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.cq-top-left {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1;
}

/* 地铁模式下出现的模式胶囊：允许收缩并省略，绝不挤压 logo */
#modePillWrap {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
}

.cq-top-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.cq-logo {
  font: 30px "Ma Shan Zheng", "Noto Sans SC", "PingFang SC", cursive;
  letter-spacing: 1px;
  transform: rotate(-2deg);
  flex: 0 0 auto;
  white-space: nowrap;
}

.cq-logo b {
  color: var(--c-act);
}

.cq-city {
  border: var(--line);
  color: var(--ink);
  background: #fffdf7;
  border-radius: 999px;
  padding: 8px 11px;
  font-size: 13px;
  font-weight: 700;
}
.cq-city .cq-caret {
  font-size: 12px;
  font-weight: 700;
  margin-left: 1px;
  opacity: 0.65;
  line-height: 1;
}

/* ========== Hero ========== */

/* ★ 2026-09-21 竖向压缩 ~19px（实测 176.1 → 157 量级）。两点动因：
   ① 用户反馈「hero 占主页空间有点多」——它是首屏最大的一块；
   ② 「想去」页不显示筛选行，标题行会贴到 hero 底边（见 .cq-app.filters-off 规则）。
   压缩只动**内外边距**，`.cq-search` 仍有 49px 高（≥44px 触摸基线），文案与字号全未动。 */
.cq-hero {
  border: var(--line);
  background: #b9d8cd;
  border-radius: 25px 21px 27px 19px;
  padding: 14px 18px 16px;
  position: relative;
  overflow: hidden;
  box-shadow: 5px 5px #283c42;
}

/* ★ 2026-09-20 移除原 `.cq-hero:after { content:"✦  ✦  ✦" }` 装饰。两点原因：
   ① 它绝对定位在 hero 首行右侧（top:7px right:12px，约 88px 宽），而首行已改为真实
      收录数「已收录 13,462 个卫生间」（约 275px）—— 在 390px 屏上两者会重叠十余像素；
   ② ✦ 已被底部导航用作「帮忙」的**功能图标**（index.html 的 .cq-nav[data-tab=help]），
      同一个符号一处当装饰、一处当功能，会削弱图标的识别度。 */

/* ── hero 页脚：收录徽标（→ 关于本应用页）+ 补录入口 ──
   ⚠ 左对齐，**不给右对齐**：hero 右下角被 .cq-doodle 占着
   （absolute bottom:11px right:22px、字号 45px → 实占右侧约 22–67px 一条），
   徽标右对齐就会与它压在一起。左排则天然空出右下角。 */
.cq-hero-foot {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 12px;
  /* 2026-09-21：10 → 8（省 2px）。 */
  margin-top: 8px;
}

/* 收录徽标。用 <button> 而非 <div>：它有真实点击行为（打开关于页），
   键盘与读屏要能识别 —— 旧版是纯展示 div，内容从「背景信息」升级为「入口」后
   必须换语义标签，否则会变成一个只有鼠标能用的假按钮。 */
.cq-hero-badge {
  position: relative;              /* ::after 撑触摸区的定位基准 */
  display: inline-flex;
  align-items: center;
  gap: 3px;
  min-height: 26px;                /* 视觉高度；真实触摸区由 ::after 撑到 44px */
  padding: 2px 10px;
  border: 1.5px solid rgba(40, 60, 66, .38);
  border-radius: 999px;
  background: rgba(255, 253, 247, .72);
  color: var(--ink);
  font: 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  cursor: pointer;
}

/* 数字用等宽数字（tabular-nums）：13,462 → 20,134 时字宽一致，徽标不会抽动。
   用 <b> 只为让它略重于周围文案，不用 600/700（本项目字重只到 500）。 */
.cq-hero-badge b {
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

/* 右端小箭头：暗示「可点开」。与补录链接同用 --red，页脚只出现两种颜色。 */
.cq-hero-badge-go {
  margin-left: 2px;
  color: var(--c-act);
  font-weight: 700;
}

/* 补录入口。★ 文案由「附近缺哪间？补一个」缩短为「＋ 补一间」——**不是随手改的**：
   实测文案原样时整行宽 279px（徽标 159 + 间距 12 + 链接 108），右端到 x=315，
   而右下装饰位从 x≈300 起 —— **🚽 会压住最后一个字**，且（未加 pointer-events 时）
   偷走那一截的点击。缩短后可留 40px 余量。
   语义上也不算损失：紧挨着「已收录 N 个卫生间」，读起来就是"给这个数添一个"。 */
.cq-hero-add {
  position: relative;
  color: var(--c-act);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

/* 两个触摸区：徽标视觉高 26px、补录链接是 12px 内联，**都低于 44px 下限**。
   沿用 .cq-report 的范式 —— 透明 ::after 把**可点区域**撑到 44px，不改布局高度。
   ⚠ 两者横向相邻（间距 12px）且各自 ::after 只在本元素左右边界内，故不互相偷点击；
   上下各撑约 9px 也碰不到 h1 / 搜索框（两者都不可点）。
   ⚠ 不用 opacity 做弱化：opacity 在父元素上会把整个子树当整体渲染，
   子元素再设 opacity:1 也恢复不了不透明（链接会跟着发灰）。故徽标直接用半透明底色。 */
.cq-hero-badge::after,
.cq-hero-add::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 44px;
  transform: translateY(-50%);
}

.cq-hero h1 {
  /* 2026-09-21：5/13 → 3/9（省 6px）。标题与搜索框仍留 9px，不贴。 */
  margin: 3px 0 9px;
  font-family: "Ma Shan Zheng", "Noto Sans SC", "PingFang SC", cursive;
  font-weight: 400;
  font-size: clamp(20px, 6vw, 27px);
  line-height: 1.2;
  letter-spacing: 0.5px;
  white-space: nowrap;
}

.cq-search {
  border: var(--line);
  color: #50666b;
  text-align: left;
  background: #fffdf7;
  border-radius: 15px;
  width: 100%;
  /* 2026-09-21：12 → 10（省 4px）。实测高 53 → 49px，仍远高于 44px 触摸基线。 */
  padding: 10px 14px;
  font-size: 15px;
  font-family: inherit;
}

/* 顶部搜索框：button 改为真正的 input，就地输入搜索 */
.cq-search-input { appearance: none; -webkit-appearance: none; outline: none; cursor: text; }
.cq-search-input::placeholder { color: #9aa9ab; }

/* 搜索激活时：隐藏首页“附近”区块，原地展示结果面板 */
.cq-search-panel { display: none; margin: 10px 0 4px; }
body.searching .cq-search-panel { display: block; }
body.searching .cq-filters,
body.searching .cq-section-head,
body.searching #list,
body.searching #emptyState { display: none; }

.cq-search-bar { display: flex; align-items: center; justify-content: space-between; padding: 2px 4px 8px; }
.cq-search-count { font-size: 12px; color: var(--c-ink-soft); }
.cq-search-clear { border: none; background: none; color: var(--c-ink); font: 500 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; cursor: pointer; padding: 4px 2px; }

/* 模糊匹配提示条：只在「一条完全匹配都没有、全靠近似匹配救回来」时出现，
   明说“拿哪几段拼出来的”，别让用户猜结果为什么冒出来。 */
.cq-search-note {
  font-size: 12px;
  line-height: 1.65;
  color: var(--c-ink-soft);
  background: #fff6e2;
  border: 1.5px dashed #e3cba4;
  border-radius: 12px;
  padding: 8px 11px;
  margin: 0 0 10px;
}
.cq-search-note b { color: var(--ink); font-weight: 700; }

.cq-doodle {
  font-size: 45px;
  position: absolute;
  bottom: 11px;
  right: 22px;
  transform: rotate(10deg);
  /* ★ 2026-09-20：纯装饰元素**绝不能吃点击**。实测它实占 hero 右下 x≈300–345 / y≈156–201，
     而移到底部的页脚行（徽标 + 补录链接）右端会伸进这个矩形 —— 不设 pointer-events:none
     时，`elementFromPoint` 在链接右端返回的就是这个 span，链接有一截点不动。 */
  pointer-events: none;
}

/* ========== Filters ========== */

.cq-filters {
  display: flex;
  gap: 6px;
  /* ★ 2026-09-21 布局 review：19/15 → 10/8，省 16px 竖向空间（首屏节奏优化）。
     按钮 min-height 40px **未动** —— 压缩靠行内边距，不靠缩小触摸目标。 */
  padding: 10px 2px 8px;
  overflow: auto;
  scrollbar-width: none;
}

.cq-filters::-webkit-scrollbar { display: none; }

/* ★ 2026-09-21 布局 review（P1-1）：筛选项数量是**数据自适应**的（minHits 命中不足即隐藏），
   7 项全出时必然溢出。而上面两行把滚动条藏掉了 —— 结果「还能滚」完全不可见：
   实测首屏第 5 项被裁成半个字「母…」，用户不知道右边还有内容。
   故溢出时给右缘渐隐遮罩（被裁的那枚药丸 + 渐隐 = 「后面还有」的视觉信号），
   滚到末尾取消遮罩。类名由 app.js 的 updateFilterOverflow() 维护 ——
   纯遮罩，不改布局、不占宽度、不动 DOM 结构。 */
.cq-filters.is-overflow {
  -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 20px), transparent 100%);
  mask-image: linear-gradient(to right, #000 calc(100% - 20px), transparent 100%);
}
.cq-filters.is-overflow.at-end {
  -webkit-mask-image: none;
  mask-image: none;
}

.cq-filters button {
  border: var(--line);
  white-space: nowrap;
  color: var(--ink);
  background: #fffaf0;
  border-radius: 999px;
  min-height: 40px;
  /* 13→10：横向每枚省 6px。实测「全都看/商场里的/地铁站/无障碍/母婴室」5 项
     内容宽 398 → 356px，**已能排进 358px 可视宽**，默认 5 项不再被裁。
     （筛选项是数据自适应的，7 项全出时仍会溢出 → 由 .is-overflow 渐隐提示兜底） */
  padding: 8px 10px;
  font: 500 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

.cq-filters button.active {
  background: var(--yellow);
  box-shadow: 2px 2px 0 var(--ink);
}

/* ========== Section Head ========== */

.cq-section-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  /* ★ 2026-09-21 布局 review：上外边距 7 → 0（省 7px）。上方筛选行自身有 8px 下内边距，
     两处相加后标题与筛选行仍留 8px 视觉间隔，不贴边。 */
  margin: 0 2px 12px;
}

/* ★ 2026-09-21：筛选行只归「附近」页（见 app.js renderList 的 showFilters）。
   它在时，自身 8px 下内边距天然隔开了 hero 与标题行；它被隐藏后（「想去」页）
   标题行会**直接贴死 hero 底边**（实测间距 0px，用户报的就是这个）→ 这里补一段等价间距。
   焦点模式页（地铁/公交在途）hero 与标题行整块都隐藏，不受影响。 */
.cq-app.filters-off .cq-section-head { margin-top: 14px; }

.cq-section-head h2 {
  margin: 0;
  font: 24px "Ma Shan Zheng", "Noto Sans SC", "PingFang SC", cursive;
}

.cq-near-btn {
  color: var(--c-ink);
  background: #fff;
  border: 2px solid var(--c-ink);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 700;
  box-shadow: 2px 2px var(--c-ink);
}

.cq-near-btn.active {
  background: var(--c-select);
}

.cq-near-btn:disabled {
  opacity: 0.6;
}

/* ========== Place List ========== */

.cq-list {
  display: grid;
  gap: 14px;
}

/* 网格项默认 min-width:auto 会拒绝收缩到 min-content 以下 → 子项比轨道宽时撑破容器。
   实测：地铁推荐块 min-content 348px、公交推荐块 400px（`.cq-rec-dir` 线路名一项就 270px），
   在 320/360/375px 窄屏下会超出轨道并被祖先 overflow:hidden 裁掉右侧控件
   （表现为「女卫/母婴室」按钮、线路名被切一半，且无法横向滚动）。
   min-width:0 让子项收缩到轨道宽，内容改为正常换行。 */
.cq-list > * {
  min-width: 0;
}

.cq-place {
  border: var(--line);
  cursor: pointer;
  text-align: left;
  color: inherit;
  background: #fffdf7;
  border-radius: 16px 23px 18px 22px;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 12px;
  width: 100%;
  padding: 14px;
  position: relative;
  box-shadow: 3px 3px #e4d7b7;
  font-family: inherit;
}

.cq-place:active {
  transform: translate(2px, 2px);
  box-shadow: 1px 1px #e4d7b7;
}

.cq-icon {
  border: var(--line);
  background: var(--blue);
  border-radius: 46% 54% 43% 57%;
  display: grid;
  place-items: center;
  width: 70px;
  height: 72px;
  font-size: 37px;
  transform: rotate(-3deg);
}

.cq-icon.i1 { background: var(--blue); }
.cq-icon.i2 { background: #f6d977; }
.cq-icon.i3 { background: #e7aaa1; }

.cq-place h3 {
  white-space: normal;
  overflow: visible;
  margin: 1px 0 5px;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.cq-meta {
  color: #667a78;
  margin-bottom: 8px;
  font-size: 12px;
}

.cq-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.cq-tag {
  border: 1.5px solid var(--ink);
  background: var(--c-pos-bg);
  border-radius: 8px;
  padding: 2px 7px;
  font-size: 11px;
}

/* ===== ② 现场细节：带证言计数 + 就地纠错的标签（2026-09-19）=====
   与普通 .cq-tag 的差别只在"多了一句可信度说明 + 一个纠错入口"。
   设计取舍：
   · 计数文案（「据 2 位用户」/「还差 1 位」）用 10px 弱化色 —— 它是**佐证**，不该
     和标签名争注意力；但仍是正文级对比度（--c-ink-soft #6b6256 对 --c-pos-bg #eaf4ef 约 5.33:1），不靠降低可读性来弱化。
   · 「不对？」做成**下划线小链接**（复用 .cq-note-cta 的语言），不做成按钮：
     它的层级低于"写评价"，但必须看得出来能点 —— 不然纠错通道等于没有。 */
.cq-tag-ev {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 7px;
}
.cq-tag-t { line-height: 1.35; }
.cq-tag-note {
  font-size: 11px;
  font-weight: 500;
  color: #6b6256;
  line-height: 1.35;
  white-space: nowrap;
}
/* 负票足量 → 灰化。**只灰化，不物理移除**：没看到 ≠ 没有（§7.3）
   ⚠ 刻意**不加删除线**：删除线的语义是"这个不存在"，而 `no≥3` 只说明"有 3 人没看到" ——
     没注意挂在哪 / 当天没补货 / 走错了一层都会产生它。灰化 + 如实写出票数，才是对的。
     （这也是本项目「宁缺毋错」在展示层的落地：不把"没人看到"渲染成"没有"。） */
.cq-tag-ev.off {
  background: #f2efe6;
  border-color: #c9c2b2;
  border-style: dashed;
}
.cq-tag-ev.off .cq-tag-t { color: #6b6256; }
.cq-tag-fix {
  padding: 0;
  background: none;
  border: 0;
  font: 500 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-info);
  text-decoration: underline;
  cursor: pointer;
}
.cq-tag-fixbox:not([hidden]) { margin-top: 8px; width: 100%; }
.cq-tag-fixbox .cq-ugc-block {
  margin: 0;
  background: #fffdf7;
  border-color: #f1d68b;
}

/* 附近列表卡片：4 大分类统一文字标签（on=可选 / off=不可选，与详情页口径一致） */
/* 右下角「待探索」印章会让出右侧空间，标签行右侧留白避免被压 */
.cq-cats { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 5px; padding-right: 46px; }
.cq-cat-chip {
  font: 500 10.5px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  padding: 2px 7px;
  border-radius: 999px;
  border: 1px solid #dcdcdc;
  background: #f4f4f4;
  color: var(--c-ink-soft);
  white-space: nowrap;
}
.cq-cat-chip.on {
  border-color: var(--ink);
  background: #fffdf7;
  color: var(--ink);
}

/* 机构内卫生间开放时间（社区中心专项，2026-09-19）
   这类卫生间随机构开放、普遍比路边公厕短，用暖色警示区别于普通设施标签 */
.cq-oh-chip {
  display: inline-block;
  max-width: 148px;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: bottom;
  border-color: #e8c9a0;
  background: #fff6e8;
  color: #a06a2c;
  font-weight: 700;
}

/* 此刻已关闭（2026-09-19）：推荐排序会把这类点排后，列表上也要一眼看出来，
   否则用户按距离点进去才发现关门。仅当开放时间可解析且判定 closed 才出现。 */
.cq-oh-closed {
  border-color: var(--c-neg);
  background: var(--c-neg-bg);
  color: var(--c-neg);
  font-weight: 700;
}
/* 详情卡开放时间块里的"此刻"结论行 */
.cq-note-warn {
  margin-top: 3px;
  font-size: 11px;
  font-weight: 700;
  color: var(--c-neg);
}
.cq-note-ok {
  margin-top: 3px;
  font-size: 11px;
  font-weight: 700;
  color: var(--c-pos);
}

.cq-stamp {
  border: 1.5px dashed var(--c-act);
  color: var(--c-act);
  white-space: nowrap;
  background: #fff9ed;
  border-radius: 999px;
  padding: 1px 6px;
  font: 12px "Ma Shan Zheng", "Noto Sans SC", "PingFang SC", cursive;
  position: absolute;
  bottom: 8px;
  right: 8px;
  transform: rotate(-8deg);
}

/* 驾车模式：页脚行 = 分类标签（左）+ 导航按钮（右），整卡宽度内同行排布，标签不再被按钮挤压换行 */
.cq-car-foot {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 2px;
}

.cq-car-foot .cq-cats {
  padding-right: 0;
  flex-wrap: nowrap;
  margin-top: 0;
  flex: 1;
  min-width: 0;
}

.cq-card-nav {
  flex-shrink: 0;
  margin-left: auto;
  border: 1.5px solid var(--c-act);
  background: var(--c-act);
  color: #fff9ed;
  border-radius: 999px;
  /* 手机端触摸目标：竖向 padding 13px → 总高约 44px（iOS HIG 44pt / Material 48dp 下限）。
     驾车场景多在车内单手误触成本高，必须给足可点面积；横向 padding 保持不变，
     以免窄屏（320px）下与左侧分类芯片并排时溢出。 */
  padding: 13px 13px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  font-family: inherit;
  cursor: pointer;
  box-shadow: 2px 2px #e4d7b7;
}

.cq-card-nav:active {
  transform: translate(1px, 1px);
  box-shadow: 1px 1px #e4d7b7;
}

.cq-stamp.warn {
  color: var(--c-ink-soft);
  border-color: var(--c-ink-soft);
}

.cq-stamp.good {
  color: var(--c-pos);
  border-color: var(--c-pos);
}

/* ========== Bottom Nav ========== */

.cq-bottom {
  max-width: 720px;
  /* 2026-09-20：10px → 8px。栏高不再由 SOS 决定（见 .cq-urgent 的 margin-top）。
     ⚠ 2026-09-21 订正：实为 8 + 47(.cq-nav 实测) + 8 + 2(边框) = 65px（旧注释的 48/1 是错的）。
     改这里必须**实测回填** --bottomnav-h，勿按公式推（见 :root 注释）。 */
  padding: 8px 16px calc(8px + var(--safe-bottom));
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  border-top: var(--line);
  z-index: 5;
  background: #f7f0dfed;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: auto;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
}

.cq-nav {
  color: #5b706e;
  background: none;
  border: 0;
  min-width: 48px;
  font-size: 12px;
  min-height: 44px;            /* 手机触摸下限：原仅 ~33px，易误触 */
  padding: 4px 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
}

.cq-nav strong {
  font-size: 21px;
  line-height: 21px;
  display: block;
}

.cq-add {
  border: var(--line);
  background: var(--c-act);
  color: #fffdf7;
  width: 54px;
  height: 54px;
  box-shadow: 2px 2px 0 var(--ink);
  border-radius: 50%;
  font-size: 28px;
}

/* ===== 底部中央"急找卫生间"按钮 ===== */
/* ★ 2026-09-20：内容由 🚽 改为 SOS 字样（hero 装饰同符号双义，见 index.html 注释）。
   字号随内容调整：30px 是 emoji 的尺寸，三个字母用 900 重 + 微字距，仍撑满视觉重心。 */
.cq-urgent {
  border: var(--line);
  background: var(--c-act);
  color: #fffdf7;
  width: 58px;
  height: 58px;
  /* ★ 负 margin：让 SOS 的 margin-box(58-24=34) 低于 .cq-nav(48)，不再决定底栏高度；
     圆形按钮因此上探越过栏顶边框约 8px，充当悬浮主按钮（急找本该最醒目；
     实测 2px 的上探量会被误读成"错位"，8px 才读得出是刻意悬浮）。
     ⚠ 上探会挤占栏顶上方 8px，任何"吸在导航栏上方"的元素必须额外让出这段
       —— 见 .cq-rec-exit 的 bottom 偏移（+6px → +12px）。 */
  margin-top: -24px;
  box-shadow: 3px 3px 0 var(--ink);
  border-radius: 50%;
  font: 900 19px/1 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  letter-spacing: 0.5px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: transform 0.15s;
}
.cq-urgent::after {
  content: "急找";
  position: absolute;
  /* ★ 2026-09-21：-3px → 0。原来标签下沿溢出按钮盒 3px，而溢出部分**不接收点击**
     （elementFromPoint 实测 831px 起落到固定底栏 .cq-bottom，无 handler）→
     「看得见、点不到」的死区。归零后标签完全落在按钮盒内，3px 死区消失。 */
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  background: var(--yellow);
  color: var(--ink);
  border: 1.5px solid var(--ink);
  border-radius: 999px;
  padding: 1px 7px;
  font: 900 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  letter-spacing: 0.5px;
  white-space: nowrap;
}
.cq-urgent:active {
  transform: translate(2px, 2px);
  box-shadow: 1px 1px 0 var(--ink);
}

/* ===== 顶栏"在途模式" pill（与 #cityBtn 同形制）===== */
.cq-mode-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  background: #fffdf7;
  border: var(--line);
  border-radius: 999px;
  padding: 7px 7px 7px 12px;
  font: 700 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  white-space: nowrap;
  max-width: 200px;
  overflow: hidden;
}
.cq-mode-pill .cq-mode-pill-icon { font-size: 15px; line-height: 1; }
.cq-mode-pill .cq-mode-pill-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cq-mode-pill button {
  background: var(--yellow);
  border: 1px solid var(--ink);
  border-radius: 50%;
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  line-height: 1;
  color: var(--ink);
  cursor: pointer;
  padding: 0;
  margin-left: 2px;
  flex-shrink: 0;
}
.cq-mode-pill button:hover { background: var(--c-ink); color: #fffdf7; }
@media (max-width: 380px) {
  .cq-mode-pill { max-width: 150px; }
}

/* ========== Sheet / Modal ========== */

.cq-sheet {
  z-index: 10;
  background: #283c4259;
  display: none;
  justify-content: center;
  align-items: end;
  position: fixed;
  inset: 0;
}

.cq-sheet.show {
  display: flex;
}

/* 嵌套 sheet 层级 */
.cq-sheet[data-level="2"] { z-index: 20; background: #283c4278; }
.cq-sheet[data-level="3"] { z-index: 30; background: #283c4298; }
.cq-sheet[data-level="4"] { z-index: 40; background: #283c42b8; }

.cq-panel {
  background: var(--paper);
  border: var(--line);
  width: min(720px, 100%);
  max-height: 90dvh;
  padding: 20px 16px calc(24px + var(--safe-bottom));
  border-bottom: 0;
  border-radius: 26px 26px 0 0;
  animation: cq-up .2s ease-out;
  overflow: auto;
  /* 关键：让 .cq-close (position:absolute) 锚定到 panel 角，而不是视窗 */
  position: relative;
}

@keyframes cq-up {
  from { transform: translateY(30px); }
  to   { transform: none; }
}

.cq-close {
  /* 绝对定位右上角 —— 兼容 flex/普通布局，不依赖 float */
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 5;
  border: var(--line);
  background: #fffdf7;
  border-radius: 50%;
  width: 44px;
  height: 44px;
  font-size: 20px;
}

.cq-detail-title {
  margin: 5px 48px 5px 0;
  /* ★ 2026-09-20：手写体 Ma Shan Zheng 在详情页长标题上不好辨识，改回列表卡同款
     Noto Sans SC 粗体（用户反馈）。字号保持标题级，仅换字体族。 */
  font: 700 24px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
/* 长名字一律不缩写/不截断（市域机场线「…（往浦东1号2号航站楼方向·车头）」，方向+车头车尾是找厕所的关键信息），
   改为按长度降字号承载，保证完整可读又不把下方评分挤下去 */
.cq-detail-title-m { font-size: 22px; }
.cq-detail-title-l { font-size: 20px; }

.cq-score {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 14px 0;
}

.cq-score b {
  color: var(--c-ink);
  font-size: 32px;
  font-weight: 900;
}

/* ============ 子类型 tab（男卫/女卫/通用/无障碍/母婴室）============ */
.cq-subtabs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin: 10px 0 6px;
}
.cq-subtab {
  display: flex;
  flex-direction: column;
  align-items: center;
  /* ★ 1px 太挤，图标几乎贴着文字（2026-09-18 用户反馈）；4px 让三行各归其位 */
  gap: 4px;
  padding: 8px 4px;
  border: var(--line);
  background: var(--bg-card, #fffdf7);
  border-radius: 10px;
  font-size: 11px;
  color: var(--ink, #5e7774);
  cursor: pointer;
  transition: all 0.15s;
  font-family: inherit;
}
.cq-subtab.on {
  /* 类别切换器"当前查看"态 = 选中语义，用统一选中黄（与筛选/询问钮一致）。
     注意：下方 .cq-subtab.on,.cq-subtab.unk.on,.cq-subtab.off.on 复合规则优先级更高、
     同样为黄，本条仅作兜底；类别的"有/无/待核实"状态色由 tab 内部元素表达，不在此处。 */
  background: var(--c-select);
  border-color: var(--c-select-bd);
  color: var(--c-select-ink);
  font-weight: 700;
}
.cq-subtab-icon { font-size: 20px; line-height: 1; position: relative; }
/* 男卫/女卫内部有无障碍隔间 → 图标右上角的小角标（仅在确认有数据时出现） */
.cq-subtab-badge {
  position: absolute;
  top: -4px;
  right: -9px;
  font-size: 11px;
  font-style: normal;
  line-height: 1;
  background: #fffdf7;
  border: 1px solid #b3aa97;
  border-radius: 999px;
  padding: 1px;
}
.cq-subtab-text {
  /* ★ 与 .cq-subtab-status 同理的等高插槽：标签名长短不一（「第三卫生间 / 无障碍卫生间」
     会折两行），若让它自由撑高，底部标记就被顶下去十几像素 —— 这正是用户看到的
     「? 和『无』位置不统一」的根因。锁 2 行高度并居中，四个标签底部标记才会齐平。 */
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  font-size: 11px;
  line-height: 1.2;
  text-align: center;
  overflow-wrap: anywhere;   /* 中文按字换行，"不分性别卫生间" 折两行 */
}
/* ★ 底部状态位统一插槽（2026-09-18 用户反馈：「?」和「无」位置不统一、看着不齐）。
   「无 / ? / 平均分+条数 / 暂无人评分」四种形态全部装进这个等高插槽并垂直居中，
   于是四个标签的底部标记永远落在同一条水平线上，卡片高度也一致。
   26px ≈ 评分行(约15px)+条数行(约11px) 的实占高度，短标记靠居中补白不会上下飘。 */
.cq-subtab-status {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 26px;
}
/* 「无」与「?」共用同一个字框：字号/行高/高宽完全一致，只差异颜色 —— 位置统一靠这条保证 */
.cq-subtab-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 18px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
}
/* 行高收紧到 1.15/1.1：评分(≈15px)+条数(≈10px) 合计 ≤ 插槽的 26px，
   于是「有评分」的标签不会把插槽撑高，四种状态位始终齐平。 */
.cq-subtab-score { font-size: 13px; font-weight: 700; line-height: 1.2; color: var(--c-ink); }
.cq-subtab.off {
  background: #ece7da;
  border-style: dashed;
  border-color: #b3aa97;
  color: #a89e8c;
  cursor: not-allowed;
  position: relative;
}
/* 注意：这里不能用 filter: grayscale(1)，会把右下角红色的「无」字一起滤成灰色 */
.cq-subtab.off .cq-subtab-icon,
.cq-subtab.off .cq-subtab-text { opacity: .45; }
/* 「无」占住原来评分数字的位置（图标 → 文字 → 无）：正红、不倾斜。
   字框/位置交给 .cq-subtab-mark 统一，这里只保留颜色与手写体特征。 */
.cq-subtab-none {
  font-family: "Ma Shan Zheng", "Noto Sans SC", "PingFang SC", cursive;
  font-weight: 400;
  color: var(--c-neg);
}
.cq-subtab-count { font-size: 11px; line-height: 1.2; color: var(--c-ink-soft); }
/* 该配置暂无人评分：不裸显示「0」（会被读成 0 隔间/0 分），改用明确的中文说明。
   5 个汉字放在四等分的小 tab 里，故取 10px（与 tab 文字同档）并允许窄屏折行。 */
.cq-subtab-norate {
  font-size: 11px;
  line-height: 1.2;
  text-align: center;
  color: var(--c-ink-soft);
}
/* 四大分类标签下方的「?」说明块：解释「?」= 还没核实过（不是没有），并给确认入口。
   视觉沿用蓝信息框（配色语义表 B6：蓝 = 信息/数据），与 .cq-rec-ask 同一语言。 */
.cq-subtabs-note {
  margin: 7px 0 8px;
  padding: 8px 10px;
  background: var(--c-info-bg);
  border: 1px solid var(--c-info-bd);
  border-left: 3px solid var(--c-info);
  border-radius: var(--radius-sm);
}
.cq-note-t {
  font: 500 12px/1.5 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-info);
}
.cq-note-d {
  margin-top: 3px;
  font-size: 11px;
  line-height: 1.65;
  color: #6b6256;
}
/* ★ 说明块里的「?」徽章（2026-09-18）：原先用 ❔ 字形，它是**空心细线**字符，
   虽然色值对比度达标（5.8:1）但视觉极虚、在浅蓝底上几乎看不见（用户反馈）。
   → 改成实心圆形徽章：深蓝底 + 白字，白/蓝 5.8:1、徽章/块底 5.8:1，两头都稳。 */
.cq-note-q {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  margin-right: 5px;
  border-radius: 50%;
  background: var(--c-info);
  color: #fff;
  font: 700 11px/1 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  vertical-align: -2px;
}
/* 内联确认区：展开后就地填写，不跳评价页。区块本体用浅底白卡压在蓝框上，层次清楚 */
.cq-unk-verify { margin-top: 8px; }
.cq-unk-verify .cq-ugc-block {
  margin: 0;
  background: #fffdf7;
  border-color: var(--c-info-bd);
}
/* 展开区内部的「收起」入口：与提交按钮分开一行，层级低于主行动 */
.cq-unk-collapse {
  margin-top: 8px;
  text-align: center;
}
.cq-unk-collapse .cq-note-cta {
  font-size: 12px;
  font-weight: 400;
  color: #6b6256;
}
.cq-unk-empty {
  padding: 8px 2px;
  font-size: 12px;
  color: #6b6256;
}
/* 行内行动入口：链接式下划线，不抢主按钮（写评价）的层级 */
.cq-note-cta {
  padding: 0 2px;
  background: none;
  border: 0;
  font: inherit;
  font-weight: 700;
  color: var(--c-info);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
/* 「待核实」态（unknown）：与 off(确认没有) 明确区分——实线边框+浅实底，标「?」而非「无」。
   修复 2026-09-18 用户反馈：旧版 unknown 与 no 共用置灰样式 + 文案"该卫生间没有这个配置"，
   把「未采集」误导成「确定没有」（用户原话：那它还是厕所吗）。 */
.cq-subtab.unk {
  /* ★ 2026-09-18 用户反馈：原先是"实线 + 浅实底"（#f7f4ec），跟「正常可用」的标签几乎一个形制，
     容易被读成"这间有这个配置"。→ 改为与 .off（确认没有）**同形制**：虚线框 + 灰底，
     语义是"这条还没定论"，不再像一张可用标签。
     ⚠ 但不能与 .off 完全同色同款，否则「未核实」=「确定没有」——那是反方向的误导（之前专门修过）。
       区分保留三处：① 底部标记 蓝「?」vs 红「无」；② 图标/文字透明度 .62（.off 是 .45，明显更灰）；
       ③ 仍可点选（.off 是 not-allowed）。 */
  background: #ece7da;
  border-color: #b3aa97;
  border-style: dashed;
  color: #6b6256;
}
.cq-subtab.unk .cq-subtab-icon,
.cq-subtab.unk .cq-subtab-text { opacity: .62; }
.cq-subtab-unk {
  /* ★ 深蓝 #1f5fa6：配色语义表 B6「蓝 = 信息/数据（缺失）」，且与下方说明块里的
     蓝底白「?」徽章 .cq-note-q 同色 —— 标签上的 ? 和下面那段解释形成呼应。
     在灰底 #ece7da 上对比度 5.33:1，达 AA。（原深金 #7a5c22 是为浅实底配的，换底后偏暖、语义也弱） */
  color: var(--c-info);
}
/* ★ 选中态优先级必须最高：.off / .unk 的灰虚线是"没有 / 还没定论"的底色，
   它们定义在 .on 之后（同特异度、后来者胜），会把选中项的黄色高亮整块盖掉 ——
   点选一个待核实项时看不出"我正看着这一项"。这里在最后重新声明一次并还原实线+满透明度。 */
.cq-subtab.on,
.cq-subtab.unk.on,
.cq-subtab.off.on {
  background: var(--yellow, #ffe27a);
  border-color: #d9a800;
  border-style: solid;
  color: #5a3e00;
  font-weight: 700;
}
.cq-subtab.on .cq-subtab-icon,
.cq-subtab.on .cq-subtab-text { opacity: 1; }
/* 详情页标题内的同款徽章：标题是「Ma Shan Zheng」手写体 28px，
   徽章必须显式还原成界面正文字体，否则会被手写体带着走、字形发飘。
   同理字号锁 11px，不随标题的 28/22/18px 降字号档位缩放。 */
.cq-detail-title .cq-name-kind {
  font-family: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 11px;
  letter-spacing: 0;
  vertical-align: middle;
}
/* 列表卡片：公厕名后紧跟的场所身份标识（仅当名字本身不含"厕所"等词时才加）。
   ⚠ 用中性墨色，不用绿色——绿在配色语义表(B6)中已归属「无障碍」，会撞语义。 */
.cq-name-kind {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  font-size: 11px;
  font-weight: 700;
  color: #283c42;
  background: #f6f3ec;
  border: 1px solid #d8d0c0;
  border-radius: 999px;
  vertical-align: middle;
  white-space: nowrap;
}

.cq-substats {
  margin: 4px 0 12px;
  padding: 10px;
  border: var(--line);
  border-radius: 10px;
  background: #fffdf7;
}
.cq-substats-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 6px;
  font-size: 15px;
}
.cq-substats-rate { font-size: 13px; color: var(--c-ink); font-weight: 700; }

/* 母婴室"私密性"4 档：纵向展示 + 描述长 */
.cq-privacy-vertical {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cq-privacy-vertical button {
  text-align: left;
  padding: 10px 12px;
  line-height: 1.5;
  display: block;
}
.cq-privacy-vertical button b {
  display: block;
  margin-bottom: 4px;
  font-size: 13px;
}
.cq-privacy-vertical button small {
  display: block;
  color: var(--c-ink-soft);
  font-weight: 400;
  font-size: 11px;
  white-space: normal;
}

.cq-stars {
  color: var(--c-rating);
  font-size: 20px;
}

/* ===== "急找"模式 sheet ===== */
.cq-mode-options {
  display: grid;
  gap: 10px;
  margin: 14px 0 4px;
}
.cq-mode-opt {
  display: grid;
  grid-template-columns: 56px 1fr auto;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 14px 14px;
  border: var(--line);
  background: #fffdf7;
  border-radius: 16px;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
  color: inherit;
  box-shadow: 3px 3px 0 var(--ink);
  transition: transform 0.12s, box-shadow 0.12s, background 0.12s;
}
.cq-mode-opt:hover { background: #fff7e0; }
.cq-mode-opt:active {
  transform: translate(2px, 2px);
  box-shadow: 1px 1px 0 var(--ink);
}
.cq-mode-opt.on {
  background: var(--yellow);
}
.cq-mode-opt-icon {
  font-size: 30px;
  line-height: 1;
  text-align: center;
}
.cq-mode-opt-body strong {
  display: block;
  font: 700 17px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  margin-bottom: 2px;
}
.cq-mode-opt-body small {
  display: block;
  color: #6c807d;
  font: 400 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}
.cq-mode-opt-check {
  color: var(--ink);
  font-size: 22px;
  font-weight: 900;
  opacity: 0;
}
.cq-mode-opt.on .cq-mode-opt-check { opacity: 1; }

.cq-mode-quick {
  width: 100%;
  margin-top: 14px;
  padding: 13px;
  border: 2px dashed var(--ink);
  background: #fffdf7;
  border-radius: 14px;
  font: 700 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  cursor: pointer;
  text-align: center;
  font-family: inherit;
}
.cq-mode-quick:hover { background: #fff7e0; }

.cq-mode-current {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 13px;
  margin-bottom: 4px;
  border: var(--line);
  background: var(--mint);
  border-radius: 14px;
  font: 700 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}
.cq-mode-current small {
  font-weight: 400;
  font-size: 11px;
  color: #3a5a4a;
}
.cq-mode-current button {
  border: 1.5px solid var(--ink);
  background: #fffdf7;
  border-radius: 999px;
  padding: 3px 9px;
  font: 700 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  cursor: pointer;
  font-family: inherit;
}

.cq-notice {
  border: var(--line);
  background: #fff4b9;
  border-radius: 14px;
  margin: 13px 0;
  padding: 11px 12px;
  font-size: 13px;
}

.cq-review {
  border-top: 2px dashed #9da9a2;
  padding: 13px 2px;
}

.cq-review b {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
}

.cq-review p {
  margin: 6px 0;
  font-size: 15px;
  line-height: 1.65;
}

.cq-review small {
  color: #70817e;
}

.cq-wide {
  border: var(--line);
  background: var(--mint);
  width: 100%;
  color: var(--ink);
  border-radius: 14px;
  margin-top: 10px;
  padding: 13px;
  font-size: 15px;
  font-weight: 900;
}

.cq-wide:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

/* ========== Forms ========== */

.cq-form label {
  margin: 15px 0 8px;
  font-weight: 700;
  display: block;
}

.cq-form textarea, .cq-range-row {
  width: 100%;
}

.cq-input, .cq-select {
  border: var(--line);
  width: 100%;
  color: var(--ink);
  background: #fffdf7;
  border-radius: 13px;
  padding: 12px;
  font: 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-family: inherit;
}

.cq-form textarea {
  border: var(--line);
  width: 100%;
  color: var(--ink);
  resize: none;
  background: #fffdf7;
  border-radius: 13px;
  height: 100px;
  padding: 12px;
  font: 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

.cq-range-row {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 700;
}

.cq-range-row input[type="range"] {
  accent-color: var(--c-act);
  flex: 1;
}

.cq-faces {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.cq-face {
  border: var(--line);
  cursor: pointer;
  background: #fffdf7;
  border-radius: 12px;
  flex: 1;
  min-height: 54px;
  font-size: 25px;
}

.cq-face.pick {
  background: var(--yellow);
  transform: rotate(-3deg);
}

.cq-tagpick {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.cq-tagpick button {
  min-height: 44px;    /* 手机触摸下限（原 31px） */
  border: 1.5px solid var(--ink);
  color: var(--ink);
  background: #fffdf7;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 12px;
}

.cq-tagpick button.on {
  background: var(--yellow, #ffe27a);
  border-color: #d9a800;
  color: #5a3e00;
  font-weight: 700;
  box-shadow: 2px 2px #e9c060;
}

.cq-tagpick .cq-tag-add {
  background: #fff7e0;
  border: 1.5px dashed var(--ink);
  color: var(--ink);
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 12px;
  cursor: pointer;
  font-weight: 700;
}
.cq-tagpick .cq-tag-add:hover {
  background: var(--yellow);
  border-style: solid;
}

.cq-empty {
  text-align: center;
  color: #5e7774;
  padding: 26px 8px;
  font-weight: 700;
}
.cq-empty a {
  color: var(--c-act);
  text-decoration: underline;
  font-weight: 900;
  margin-left: 4px;
}
.cq-empty a:active { opacity: 0.7; }

.cq-skel {
  border: var(--line);
  background: repeating-linear-gradient(100deg, #fffdf7 0 20px, #efe6cd 20px 40px);
  border-radius: 16px 23px 18px 22px;
  height: 100px;
  animation: cq-shimmer 1.4s linear infinite;
  background-size: 200% 100%;
}

@keyframes cq-shimmer {
  from { background-position: 0% 0; }
  to   { background-position: 200% 0; }
}

/* ========== Detail Photo ========== */

.cq-detail-photo {
  margin: 12px 0;
}

.cq-detail-photo img {
  object-fit: contain;
  background: #fffdf5;
  border: 2px solid #2b2b2b;
  border-radius: 14px;
  width: 100%;
  max-height: 300px;
}

.cq-detail-photo small {
  color: #6b6b6b;
  margin-top: 4px;
  display: block;
}

.cq-tag-paid {
  background: #ffd7a8 !important;
}

.cq-tag-free {
  background: #c8f0c8 !important;
}

.cq-nav-btn {
  color: var(--c-ink);
  background: #8fe3c8;
  border: 2px solid var(--c-ink);
  border-radius: 14px;
  width: 100%;
  margin: 10px 0 4px;
  padding: 12px;
  font: 20px "Ma Shan Zheng", "Noto Sans SC", "PingFang SC", cursive;
  box-shadow: 3px 3px var(--c-ink);
}

.cq-nav-btn:active {
  transform: translate(2px, 2px);
  box-shadow: 1px 1px var(--c-ink);
}

.cq-geo-row {
  margin: 4px 0 10px;
  font-size: 13px;
}

.cq-geo-ok {
  color: #1f7a5a;
  font-weight: 700;
}

.cq-geo-wait {
  color: #5e7774;
}

/* 「📍 取当前位置」按钮：此前只在 app.js 写了类名、styles.css 漏写规则，
   实际渲染成浏览器默认按钮，实测仅 87×22 —— 远低于 44px 触摸基线。
   2026-09-18 补录走查补齐。 */
.cq-geo-btn {
  display: block;
  width: 100%;
  min-height: 44px;
  margin: 4px 0 10px;
  padding: 10px 14px;
  border: 2px solid var(--ink);
  border-radius: 12px;
  background: #fffdf7;
  font: 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif, -apple-system, "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif, sans-serif;
  color: var(--ink);
  cursor: pointer;
  box-shadow: 2px 2px 0 var(--ink);
}

.cq-geo-btn:active {
  transform: translate(2px, 2px);
  box-shadow: none;
}

/* ========== Toasts ========== */

.cq-toast-wrap {
  position: fixed;
  top: calc(var(--safe-top) + 18px);
  left: 50%;
  transform: translateX(-50%);
  z-index: 99;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}

.cq-toast {
  border: 2px solid var(--ink);
  background: var(--paper);
  border-radius: 14px;
  padding: 10px 14px;
  font-size: 15px;
  font-weight: 700;
  box-shadow: 3px 3px 0 var(--ink);
  animation: cq-up .2s ease-out;
  max-width: 88vw;
}

.cq-toast.error {
  background: var(--c-neg-bg);
  border-color: var(--c-neg);
  color: var(--c-neg);
}

.cq-toast.ok {
  background: var(--c-pos-bg);
  border-color: var(--c-pos);
  color: var(--c-pos);
}

/* ========== Profile / Me ========== */

.cq-me-card {
  border: var(--line);
  background: #fffdf7;
  border-radius: 18px;
  padding: 16px;
  margin: 12px 0;
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 12px;
  align-items: center;
}

.cq-me-avatar {
  width: 64px;
  height: 64px;
  border: var(--line);
  border-radius: 50%;
  background: var(--yellow);
  display: grid;
  place-items: center;
  font-size: 30px;
}

.cq-me-card h4 {
  font: 22px "Ma Shan Zheng", "Noto Sans SC", "PingFang SC", cursive;
}

.cq-me-card small {
  color: #667a78;
}

.cq-stat-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 10px 0 18px;
}

.cq-stat {
  border: var(--line);
  background: #fffdf7;
  border-radius: 14px;
  text-align: center;
  padding: 12px 6px;
}

.cq-stat b {
  display: block;
  font-size: 22px;
  color: var(--c-act);
}

.cq-stat small {
  color: #5e7774;
  font-size: 12px;
}

/* ========== Vote Row ========== */

.cq-vote-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
}

.cq-vote {
  border: 1.5px solid var(--ink);
  background: #fffdf7;
  border-radius: 8px;
  padding: 3px 9px;
  font: 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

.cq-vote.on {
  background: var(--yellow);
  border-color: var(--ink);
  box-shadow: 1px 1px 0 var(--ink);
}

/* 举报按钮（2026-09-18）：仅在署名开关 SHOW_REVIEW_AUTHOR 打开时才渲染。
   视觉沿用 .cq-vote 的小标签款（避免破坏投票行的节奏），但用透明 ::after 把
   **可点区域**撑到 44px 触摸下限 —— 不改布局高度，也就不影响既有卡片排布。 */
.cq-report {
  position: relative;
  border: 1.5px solid var(--ink);
  background: #fffdf7;
  border-radius: 8px;
  padding: 3px 9px;
  font: 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
  margin-left: auto;   /* 推到行尾，与 👍/👎 明显区分，降低误触 */
}
.cq-report::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 44px;
  transform: translateY(-50%);
}

.cq-flagged {
  color: var(--c-ink-soft);
  font-size: 12px;
  font-weight: 700;
}

/* ========== Mode Badge ========== */

.cq-mode-badge {
  border: 1.5px solid var(--ink);
  background: #fffdf7;
  border-radius: 999px;
  padding: 3px 9px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.cq-mode-badge.server { color: var(--c-pos); border-color: var(--c-pos); }
.cq-mode-badge.local  { color: var(--c-ink-soft); border-color: var(--c-ink-soft); }

/* ========== Trust Bar ========== */

.cq-trust {
  border: var(--line);
  background: #fffdf7;
  border-radius: 14px;
  padding: 12px;
  margin: 8px 0 14px;
}

.cq-trust-bar {
  height: 10px;
  background: var(--c-pos-bg);
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: 6px;
}

.cq-trust-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--yellow), var(--c-act));
  transition: width 0.4s ease;
}

.cq-trust small {
  color: #5e7774;
  font-size: 12px;
}

code {
  font-family: ui-monospace, "SFMono-Regular", Menlo, monospace;
  background: #f4ecd4;
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 13px;
}

/* ========== Photo Upload ========== */

.cq-photo-btn {
  cursor: pointer;
  background: #fffdf7;
  border: 2px dashed var(--ink);
  border-radius: 14px;
  width: 100%;
  padding: 14px;
  font: 700 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
}

.cq-photo-btn:hover { background: #fff7e0; }

.cq-photo-preview {
  border-radius: 14px;
  overflow: hidden;
  position: relative;
}

.cq-photo-preview img {
  object-fit: contain;
  background: #fffdf5;
  border: 2px solid var(--ink);
  border-radius: 14px;
  width: 100%;
  max-height: 260px;
  display: block;
}

.cq-photo-preview small {
  display: block;
  margin-top: 6px;
  font-size: 12px;
}

/* ========== Responsive ========== */

@media (min-width: 740px) {
  .cq-app { box-shadow: 0 0 30px #9ca9a3; }
  .cq-list { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  input, textarea, select {
    font-size: 17px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cq *, .cq-panel {
    transition: none !important;
    animation: none !important;
  }
}

/* ===== 付费区徽章（地铁厕所）===== */
.cq-paid-badge {
  display: inline-block;
  margin-top: 6px;
  padding: 3px 9px;
  font: 700 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  background: #fff0e0;
  color: #b8651b;
  border: 1.5px solid #f5b97a;
  border-radius: 999px;
}
.cq-paid-badge.free {
  background: var(--c-pos-bg);
  color: var(--c-pos);
  border-color: var(--c-pos-bd);
}
.cq-paid-badge.strict {
  background: var(--c-neg-bg);
  color: var(--c-neg);
  border-color: #e2b6b0;
}
.cq-paid-badge.unk {
  background: #f0f0e8;
  color: #888;
  border-color: #ccc;
  font-weight: 500;
}

/* ===== 地铁位置 3 选 1 选择器 ===== */
.cq-zone {
  display: flex;
  gap: 6px;
}
.cq-zone button {
  flex: 1;
  border: 1.5px solid var(--ink);
  background: #fffdf7;
  color: var(--ink);
  border-radius: 10px;
  padding: 8px 4px;
  font: 700 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  line-height: 1.35;
}
.cq-zone button small {
  display: block;
  font-weight: 400;
  font-size: 11px;
  color: #888;
  margin-top: 2px;
}
.cq-zone button.on {
  background: #ffe27a;
  box-shadow: 2px 2px var(--ink);
}
.cq-zone button.on small { color: var(--ink); }

/* ===== 详情页"事实行"（付费区/蹲位数）===== */
.cq-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0 4px;
}
.cq-fact {
  display: inline-block;
  padding: 5px 10px;
  font: 500 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  background: #fffdf7;
  color: var(--ink);
  border: 1.5px solid var(--ink);
  border-radius: 8px;
}
.cq-fact.ok { background: var(--c-pos-bg); border-color: var(--c-pos-bd); color: var(--c-pos); }
.cq-fact.bad { background: var(--c-neg-bg); border-color: #e2b6b0; color: var(--c-neg); }

/* ===== 蹲位数步进器 ===== */
.cq-stalls-row {
  display: flex;
  gap: 10px;
  margin-bottom: 6px;
}
.cq-stall-cell {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 6px;
  background: #fffdf7;
  border: 2px solid var(--ink);
  border-radius: 12px;
  padding: 6px;
}
.cq-stall-icon { font-size: 20px; }
.cq-stall-cell input[type=number] {
  flex: 1;
  width: 100%;
  /* 触摸基线：input 此前实际高约 24px，手机上很难点中（虽有 +/− 按钮兜底，
     但直接改数字是最高频操作）。补 44px 后与 .cq-step 等高，cell 总高不变。
     2026-09-18 补录走查补齐。 */
  min-height: 44px;
  text-align: center;
  border: none;
  background: transparent;
  font: 700 17px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  outline: none;
  -moz-appearance: textfield;
}
.cq-stall-cell input[type=number]::-webkit-outer-spin-button,
.cq-stall-cell input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.cq-step {
  width: 44px;
  height: 44px;
  border: 1.5px solid var(--ink);
  background: #fff;
  border-radius: 50%;
  font: 900 17px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  cursor: pointer;
}
.cq-step:active {
  background: #ffe27a;
}

/* ===== 评价照片 ===== */
.cq-review-photo {
  margin: 8px 0;
  border-radius: 10px;
  overflow: hidden;
  border: 2px solid var(--ink);
  background: #fffdf5;
}
.cq-review-photo img {
  width: 100%;
  max-height: 280px;
  /* 完整显示原图画幅：竖图/横图都不裁切，比例不符时留白补底 */
  object-fit: contain;
  display: block;
}

/* ===== 链接按钮（"🚫 不改" 之类）===== */
.cq-link-btn {
  min-height: 44px;    /* 手机触摸下限（原 26px） */
  background: none;
  border: 1.5px dashed var(--ink);
  color: var(--ink);
  border-radius: 999px;
  padding: 3px 10px;
  font: 500 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  cursor: pointer;
}
.cq-link-btn:hover { background: #fff7e0; }
.cq-link-btn.on {
  background: #ffe27a;
  border-style: solid;
  font-weight: 700;
}

/* ===== 锁定态（用户选"不改"）===== */
.cq-stalls-row.locked .cq-stall-cell {
  opacity: 0.45;
  background: #f5f5f0;
}
.cq-stalls-row.locked .cq-stall-cell input { pointer-events: none; }
.cq-stalls-row.locked .cq-step { display: none; }

/* ===== 厕所类别选择（你去的是？） ===== */
.cq-kind-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin-bottom: 8px;
}
.cq-kind-row button {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 10px 4px;
  background: #fffdf7;
  border: 2px solid var(--ink);
  border-radius: 12px;
  cursor: pointer;
  font: 500 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  transition: all 0.12s;
}
.cq-kind-row button.on {
  background: var(--yellow);
  border-color: var(--c-select-bd);
  color: var(--c-select-ink);
  transform: translateY(-1px);
}
.cq-kind-row button.off {
  position: relative;
  background: #ece7da;
  border-style: dashed;
  border-color: #b3aa97;
  color: #a89e8c;
  cursor: not-allowed;
}
.cq-kind-row button.off .cq-kind-icon,
.cq-kind-row button.off .cq-kind-text { opacity: .45; }
/* unknown = 暂未核实：不同于 off（确认没有）——保持可点选，用「?」角标提示"没采集过"。
   2026-09-19 修复：旧版 unknown 也走 off，文案却写"该卫生间没有这个配置"，
   既把"未采集"误导成"确定没有"，也堵死了用户上报补充的通道。 */
.cq-kind-row button.unk {
  position: relative;
  background: #fdfaf0;
  border-color: #d9cfb4;
  color: #7a7263;
  cursor: pointer;
}
.cq-kind-row button.unk.on {
  background: var(--yellow);
  border-color: var(--c-select-bd);
  color: var(--c-select-ink);
}
.cq-kind-unk {
  position: absolute;
  top: 2px;
  right: 5px;
  font: 400 13px/1 "Ma Shan Zheng", "Noto Sans SC", "PingFang SC", cursive;
  font-style: normal;
  color: #b09a63;
}
.cq-kind-none {
  font: 400 19px/1 "Ma Shan Zheng", "Noto Sans SC", "PingFang SC", cursive;
  color: var(--c-neg);
}
.cq-kind-icon { font-size: 22px; line-height: 1; }
.cq-kind-text {
  white-space: normal;
  line-height: 1.2;
  text-align: center;
  overflow-wrap: anywhere;
}

/* ===== 标签空状态 ===== */
.cq-tags-empty {
  display: inline-block;
  padding: 4px 10px;
  font: 500 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
  background: #fff7e0;
  border: 1.5px dashed #d4b89c;
  border-radius: 8px;
}

/* ===== 标签折叠提示（2026-09-19）=====
   标签超过 8 个时收成「还有 N 个」。**刻意做成非交互的弱化 chip**：
   目前没有"点开看全部"的实现，就不该有按钮外观 —— 否则又是一个点了
   不动的空头入口（与 tagHelpCta 同类问题的静止形态）。
   文字色仍取 #6b6256（对 #f7f3e9 底 5.4:1），弱化靠虚线边与底色，不靠降低对比度。 */
.cq-tags-more {
  display: inline-block;
  padding: 4px 10px;
  font: 500 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #6b6256;
  background: #f7f3e9;
  border: 1.5px dashed #e0d6c0;
  border-radius: 8px;
}

/* ===== 信息可信度一行（2026-09-19）=====
   回答的是「我能不能信这条数据」，不是「谁写的」。**刻意做得安静**：
   不套底框、不用强调色，只有比正文更淡的灰褐 + 上下细虚线。
   理由：这一行上方就是「? 待核实」蓝信息框（配色语义表：蓝 = 信息/数据），
   同页再放一个彩色信息框会互相稀释；可信度应当是"氛围"而不是"又一则通知"。
   文字 #6b6256 对 #fffdf7 底 5.9:1，11px 小字仍达标。 */
.cq-trust-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  margin: 8px 0 2px;
  padding: 6px 0;
  border-top: 1px dashed #e6dcc8;
  border-bottom: 1px dashed #e6dcc8;
  font: 500 11px/1.5 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #6b6256;
}
.cq-trust-i { font-size: 12px; line-height: 1; }
.cq-trust-t { overflow-wrap: anywhere; }

/* ===== 「帮个忙」回执（2026-09-19）=====
   从任务台答完题、点回本点位 → 顶部一行"收到了"的因果闭环。
   颜色直接复用 .cq-toast.ok 的同一套成功绿（底 --c-pos-bg / 边 --c-pos-bd），
   让"成功"在全站只有一种绿；文字用 --c-pos（对 --c-pos-bg 底 4.86:1）以过小字对比度。 */
.cq-help-ack {
  margin: 8px 0 2px;
  padding: 7px 10px;
  background: var(--c-pos-bg);
  border: 1px solid var(--c-pos-bd);
  border-radius: 10px;
  font: 700 12px/1.5 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-pos);
}

/* 顶部核验行（位置/开放时间确认，2026-09-20）：请求态一行收起；达标态转绿徽标 */
.cq-verify-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0 2px;
  padding: 7px 10px;
  background: var(--c-pos-bg);
  border: 1px solid var(--c-pos-bd);
  border-radius: 10px;
  font: 700 12px/1.5 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-pos);
}
/* 达标态：底色沿用基础态的 --c-pos-bg，靠**深绿描边**（vs 基础态软描边 --c-pos-bd）表达"已确认"，
   不再另起一套 lime 绿（原 #EAF3DE/#97C459 是偏离色板的孤值）。 */
.cq-verify-row.ok { border-color: var(--c-pos); }
.cq-verify-row .cq-note-cta { flex: none; }
.cq-verify-ok {
  font: 700 12px/1.5 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-pos);
}

/* 基础信息反馈警告条（2026-09-20）：位置没找到 / 开放时间不属实 达 2 人时亮 */
.cq-basic-warn {
  margin: 8px 0 2px;
  padding: 7px 10px;
  background: #fdeeea;
  border: 1px solid #e0a896;
  border-radius: 10px;
  font: 700 12px/1.5 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #a0432e;
}

/* ================================================
   乘地铁模式：4 张推荐卡 + 选站 sheet
   ================================================ */
.cq-rec-block {
  margin: 0 0 14px;
  padding: 12px 12px 10px;
  background: linear-gradient(135deg, #fff8d8 0%, #fff 100%);
  border: 1.5px solid #f1d68b;
  border-radius: 14px;
}
#metroRecBlock {
  grid-column: 1 / -1;  /* 横跨所有列 */
}
.cq-rec-state {
  display: flex;
  align-items: center;
  gap: 8px;
  font: 700 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  margin-bottom: 8px;
}
.cq-rec-line { color: var(--c-ink); }
/* 站名不截断（产品规则：名字不缩写不截断）。原先 nowrap+ellipsis 会在 ≤375px 把站名整段吞成「…」，
   而「即将到达（下一站）」前缀反而占满宽度。改为允许换行：宽度够时仍是一行，不够时整名落到第二行。 */
.cq-rec-dir { flex: 1; min-width: 0; color: var(--c-ink-soft); line-height: 1.35; }
.cq-rec-dir b { color: var(--c-ink); font-weight: 700; }
.cq-rec-change {
  border: 1.5px solid var(--c-ink);
  background: #fffdf7;
  color: var(--c-ink);
  padding: 4px 12px;
  min-height: 44px;
  min-width: 44px;
  border-radius: 14px;
  font: 700 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  cursor: pointer;
}
.cq-rec-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
/* 同上：卡片也是网格项，min-width:auto 会让长名字/长徽标把卡片撑破轨道（320px 实测 316 vs 264）。
   卡片内各行（卡片是 flex 列）同样需要放开 min-content 下限，才能正常换行而非溢出。 */
.cq-rec-cards > *,
.cq-rec-card > *,
.cq-rec-top,
.cq-rec-name,
.cq-rec-loc,
.cq-rec-foot {
  min-width: 0;
}
/* ===== A1 逐站推进（◂ 上一站 / ▸ 下一站）===== */
.cq-rec-steps {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 6px;
}
.cq-rec-step {
  padding: 9px 8px;
  min-height: 44px;
  border: 1.5px solid var(--ink);
  border-radius: 10px;
  background: #fffdf7;
  color: var(--ink);
  font: 700 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  cursor: pointer;
  transition: transform .1s;
}
.cq-rec-step:last-child {
  background: var(--c-act);
  color: #fff;
  border-color: var(--c-ink);
}
.cq-rec-step:active { transform: scale(.98); }
.cq-rec-step[disabled] {
  opacity: .45;
  cursor: not-allowed;
  background: #f1ece0;
  color: #a0937c;
  border-color: #ded0ae;
}
.cq-rec-stephint {
  margin-bottom: 8px;
  font: 500 11px/1.4 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
}
/* ===== B3 无数据站聚合行 ===== */
.cq-rec-nodata {
  margin-bottom: 8px;
  padding: 8px 10px;
  background: #f1ece0;
  border: 1px dashed #ded0ae;
  border-radius: 10px;
  font: 500 12px/1.45 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
}
/* ===== 强制前置：未选类型时的占位提示 ===== */
.cq-rec-pickhint {
  margin-bottom: 8px;
  padding: 16px 12px;
  background: #fbf6ea;
  border: 1px dashed #e3d3ad;
  border-radius: 12px;
  font: 500 13px/1.6 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #8a6d3b;
  text-align: center;
}
/* ===== B4 步行量图例 ===== */
.cq-rec-legend {
  margin: 2px 0 8px;
  font: 400 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
}
/* ===== G1' 卫生间类型确认（给出推荐前的必备前置条件，对所有站都弹）===== */
.cq-rec-ask {
  margin-bottom: 8px;
  padding: 9px 10px;
  background: var(--c-info-bg);
  border: 1px solid var(--c-info-bd);
  border-left: 3px solid var(--c-info);
  border-radius: 10px;
}
.cq-rec-ask-t {
  margin-bottom: 7px;
  font: 500 12px/1.5 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-info);
}
.cq-rec-ask-t b { color: var(--c-info); }
.cq-rec-ask-btns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
.cq-rec-ask-btn {
  padding: 7px 6px;
  min-height: 44px;
  border: 1.5px solid var(--c-ink);
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--c-ink);
  font: 700 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  cursor: pointer;
  transition: transform .1s;
}
.cq-rec-ask-btn:active { transform: scale(.98); }
/* 品类身份靠图标/文字表达（🚹🚺♿🍼），不再用色相区分，避免与状态色碰撞。
   选中态统一走 --c-select（黄），与 .cq-filters / .cq-cat-chip 同一套"选中语言"。 */
.cq-rec-ask-btn.a { }
.cq-rec-ask-btn.n { }
/* 当前选中的类型（切换条常驻、随时可改，选中态要一眼可见） */
.cq-rec-ask-btn.on { background: var(--c-select); color: var(--c-select-ink); border-color: var(--c-select-bd); }
.cq-rec-ask-btn.a.on { background: var(--c-select); color: var(--c-select-ink); border-color: var(--c-select-bd); }
.cq-rec-ask-btn.n.on { background: var(--c-select); color: var(--c-select-ink); border-color: var(--c-select-bd); }

/* ===== 母婴室空缺时的「最近母婴室」推荐 ===== */
.cq-rec-nursing-pre {
  font-size: 13px; color: #5b6470; margin: 0 2px 8px; line-height: 1.5;
}
.cq-rec-nursing {
  margin: 0 2px 12px; padding: 12px;
  border: 1px solid #f3c9a8; border-radius: 12px;
  background: #fffaf5;
}
.cq-rec-nursing-empty { background: #fbf7f2; border-color: #e7ddd2; }
.cq-rec-nursing-h {
  font-size: 15px; font-weight: 700; color: #9a3412; margin-bottom: 8px;
}
.cq-rec-nursing-tip { font-size: 13px; color: var(--c-ink-soft); line-height: 1.65; margin-bottom: 8px; }
.cq-rec-nursing-expand {
  display: inline-block; cursor: pointer;
  border: 1px solid #c2410c; color: #c2410c; background: #fff;
  border-radius: 999px; padding: 6px 14px; font-size: 13px; font-weight: 700;
}
.cq-rec-nursing-expand:active { transform: scale(.98); }
.cq-rec-ncards { display: flex; flex-direction: column; gap: 8px; }
.cq-rec-ncard {
  border: 1px solid #f0d9c4; border-radius: 10px; padding: 10px 12px; background: #fff;
}
/* 卡片可点选（button 化）：手动点选目标，选中态高亮 */
button.cq-rec-ncard { cursor: pointer; text-align: left; width: 100%; font: inherit; }
button.cq-rec-ncard.on { border-color: #c2410c; background: #fff7ed; box-shadow: inset 0 0 0 1px #c2410c; }
/* 「母婴室前往指引」弹层（商场/站外目标带一键导航） */
/* ============ 乘公交中模式（P0）============ */
/* 选线 sheet：搜索框 + 列表（线路多，滚轮列不下，改搜索式） */
.cq-bussel-sheet .cq-bussel-h { display: flex; align-items: center; justify-content: space-between; font-size: 17px; font-weight: 700; color: #9a3412; margin-bottom: 4px; }
.cq-bussel-sheet .cq-close { border: none; background: none; font-size: 17px; color: #283c42; cursor: pointer; padding: 2px 6px; }
.cq-bussel-sheet .cq-close:hover { color: #9a3412; }
/* 数据加载中占位（公交选站 sheet、公交推荐块共用）——2026-09-19：拓扑改为「先弹层、后填充」，
   避免用户对着"点了没反应"干等。 */
.cq-sheet-loading { padding: 28px 12px; text-align: center; font: 500 15px/1.6 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; color: #8a6d3b; }
.cq-bussel-sub { font-size: 12px; color: #6b6256; margin-bottom: 10px; }
.cq-bussel-q {
  width: 100%; box-sizing: border-box; padding: 10px 12px; margin-bottom: 10px;
  border: 1.5px solid #e4d7b7; border-radius: 10px; font-size: 15px; font-family: inherit;
  background: #fffdf7; outline: none;
}
.cq-bussel-q:focus { border-color: var(--c-ink); }
.cq-bussel-list { max-height: 46vh; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; }
.cq-bussel-item {
  text-align: left; border: 1.5px solid #f0d9c4; border-radius: 10px; padding: 10px 12px;
  background: #fff; cursor: pointer; font-family: inherit; display: flex; flex-direction: column; gap: 2px;
}
.cq-bussel-item b { font-size: 15px; color: var(--c-ink); }
.cq-bussel-item.on { border-color: var(--c-select-bd); background: var(--c-select-bg); }
.cq-bussel-meta { font-size: 12px; color: #6b6256; }
.cq-bussel-alias { font-size: 11px; color: #b45309; margin-top: 1px; }
.cq-bussel-empty { font-size: 13px; color: #6b6256; padding: 14px 4px; text-align: center; }
.cq-bussel-back { margin-top: 10px; border: none; background: none; color: #b45309; font-size: 13px; cursor: pointer; font-family: inherit; padding: 4px 0; }
/* 推荐卡上的方向徽标（即将到达 / 再坐 N 站） */
.cq-bus-off {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px;
  font-size: 11px; font-weight: 700; background: #fef3c7; color: #92400e; vertical-align: middle;
}
/* 「稍远」徽标：标准 400m 内无候选、放宽至 700m 的兜底候选 */
.cq-bus-far {
  display: inline-block; margin-left: 5px; padding: 1px 7px; border-radius: 999px;
  font-size: 11px; font-weight: 700; background: #ece3d0; color: var(--c-ink-soft); vertical-align: middle;
}
/* 稍远卡用虚线边框与标准候选区分 */
.cq-bus-card.far { border-style: dashed; }
/* 郊区空白站：一键跳到前方最近有厕的站 */
.cq-rec-jump {
  margin-bottom: 8px; padding: 9px 10px;
  background: #eef7f0; border: 1px solid #bfe0c9; border-left: 3px solid var(--c-pos);
  border-radius: 10px; font: 500 12px/1.5 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; color: #1d6b4c;
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.cq-rec-jump b { color: #17583c; }
.cq-rec-jumpbtn {
  margin-left: auto; padding: 6px 12px; border: 1.5px solid var(--c-pos); border-radius: 9px;
  background: #fff; color: #1d6b4c; font: 700 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  cursor: pointer; white-space: nowrap;
}
.cq-rec-jumpbtn:active { transform: scale(.98); }

.cq-nursing-guide-h { font-size: 17px; font-weight: 700; color: var(--c-warn); margin-bottom: 10px; }
.cq-nursing-guide-target { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.cq-nursing-guide-name { font-size: 15px; color: var(--c-ink); }
.cq-nursing-guide-steps { margin: 0 0 12px; padding-left: 20px; color: #374151; font-size: 15px; line-height: 1.9; }
.cq-rec-nchip {
  display: inline-block; font-size: 12px; font-weight: 700;
  padding: 2px 8px; border-radius: 999px; margin-bottom: 6px;
}
.cq-rec-nchip.m { background: var(--c-info-bg); color: var(--c-info); }
.cq-rec-nchip.s { background: var(--c-warn-bg); color: var(--c-warn); }
.cq-rec-nchip.o { background: var(--c-neg-bg); color: var(--c-neg); border: 1px solid var(--c-neg); }
.cq-rec-nname { font-size: 15px; font-weight: 700; color: var(--c-ink); line-height: 1.35; }
.cq-rec-nmeta { font-size: 12px; color: var(--c-ink-soft); margin-top: 3px; }
.cq-rec-nhint { font-size: 12px; color: var(--c-warn); margin-top: 3px; }
/* 母婴室配置徽标（2026-09-18）：可哺乳 / 仅换洗台。仅在有证据时由 JS 渲染 */
.cq-nroom { font-size: 12px; font-weight: 700; padding: 1px 7px; border-radius: 999px; margin-left: 6px; }
.cq-nroom.yes { background: var(--c-pos-bg); color: var(--c-pos); border: 1px solid var(--c-pos); }
.cq-nroom.no  { background: var(--c-warn-bg); color: var(--c-warn); border: 1px solid var(--c-warn); }
/* 详情页母婴室配置行 */
.cq-nroom-line { font-size: 13px; font-weight: 700; margin: 8px 0 2px; padding: 7px 10px; border-radius: 10px; }
.cq-nroom-line.yes { background: var(--c-pos-bg); color: var(--c-pos); border: 1px solid var(--c-pos); }
.cq-nroom-line.no  { background: var(--c-warn-bg); color: var(--c-warn); border: 1px solid var(--c-warn); }
.cq-rec-nursing-foot { font-size: 12px; color: #6b6256; margin-top: 10px; line-height: 1.5; }
/* 「站外补公厕前瞻」面板（地铁模式推荐卡下方补充，蓝色调区别于母婴室橙色面板） */
.cq-rec-pubtoilet {
  margin: 10px 2px 12px; padding: 12px;
  border: 1px solid var(--c-info-bd); border-radius: var(--radius-card);
  background: var(--c-info-bg);
}
.cq-rec-pubtoilet-h {
  font-size: 15px; font-weight: 700; color: var(--c-info); margin-bottom: 8px;
}
.cq-pt-cards { display: flex; flex-direction: column; gap: 8px; }
.cq-pt-card {
  border: 1px solid var(--c-info-bd); border-radius: 10px; padding: 10px 12px; background: #fff;
  cursor: pointer; text-align: left; width: 100%; font: inherit;
}
.cq-pt-card:active { transform: scale(.99); }
.cq-pt-name { font-size: 15px; font-weight: 700; color: var(--c-ink); line-height: 1.35; }
.cq-pt-meta { font-size: 12px; color: var(--c-ink-soft); margin-top: 3px; }
.cq-pt-stalls { margin-top: 5px; display: flex; gap: 8px; }
.cq-pt-stall {
  font-size: 12px; font-weight: 700; padding: 1px 8px; border-radius: 999px;
  background: var(--c-info-bg); color: var(--c-info);
}
.cq-rec-pubtoilet-foot { font-size: 12px; color: #6b6256; margin-top: 10px; line-height: 1.5; }
/* 方向指引弹层里的同款区块 */
.cq-nursing-sheet-h { font-size: 17px; font-weight: 700; color: #9a3412; margin-bottom: 10px; }
/* "不限"：取消筛选回到全部可选，仅在已选时出现 */
.cq-rec-ask-clear {
  grid-column: 1 / -1;
  padding: 4px;
  border: none;
  background: transparent;
  color: var(--c-ink-soft);
  font: 500 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  text-decoration: underline;
  cursor: pointer;
}
/* ===== G2 类型徽标（🚹 仅男卫 / 🚺 仅女卫 / ♿ 无障碍在费区外）===== */
.cq-rec-gender {
  display: inline-block;
  padding: 1px 6px;
  margin-right: 4px;
  border-radius: 6px;
  font: 700 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  white-space: nowrap;
}
.cq-rec-gender.g-m { background: #dfeafd; color: var(--c-info); }
.cq-rec-gender.g-f { background: #fbe0ee; color: #a3237a; }
.cq-rec-gender.g-a { background: #e4f2ea; color: #1d6b4c; }
.cq-rec-gender.g-n { background: #fde8d8; color: #9a3412; }
.cq-rec-card {
  display: block;
  position: relative;
  padding: 10px 12px;
  border: var(--line);
  background: #fffdf7;
  border-radius: 14px 18px 16px 20px;
  box-shadow: 3px 3px #e4d7b7;
  cursor: pointer;
  text-align: left;
  transition: transform .1s, box-shadow .1s, background .12s, border-color .12s;
}
.cq-rec-card:hover { transform: translateY(-1px); }
/* ★ 卡内折叠「本站还有 N 处」：替代原「N 处」纯数字（它承诺选择权却不给）。
   展开后逐条列出落位 + 位置描述，纯知情；真正的切换入口在下车后的指引页。 */
.cq-rec-alts-t {
  display: block;
  width: 100%;
  margin-top: 8px;
  padding: 6px 0;
  background: none;
  border: none;
  border-top: 1px dashed #d8cdb2;
  color: var(--c-ink-soft);
  font: 700 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  text-align: center;
  cursor: pointer;
}
.cq-rec-alts-t:active { opacity: .7; }
.cq-rec-alts {
  margin-top: 4px;
  padding: 2px 0 4px;
}
.cq-rec-alt {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  padding: 4px 0;
  font: 400 11px/1.5 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #6b6256;
}
.cq-rec-alt .cq-rec-tag { flex: none; margin-top: 1px; }
.cq-rec-alt-d { flex: 1; overflow-wrap: anywhere; }
.cq-rec-card:active { transform: translate(2px,2px); box-shadow: 1px 1px #e4d7b7; }
.cq-rec-card.hl {
  border-color: var(--yellow);
  background: #fff9ed;
  box-shadow: 3px 3px #e4d7b7;
}
.cq-rec-card.selected {
  border-color: var(--c-select);
  border-width: 3px;
  background: #fff7e6;
  box-shadow: 4px 4px 0 var(--ink), 0 0 0 3px rgba(244,198,79,.45);
  z-index: 2;
}
.cq-rec-card.selected::after {
  content: "✓ 已选";
  position: absolute;
  top: -11px;
  right: 12px;
  background: var(--c-select);
  color: var(--c-select-ink);
  font: 700 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  padding: 2px 9px;
  border: 1.5px solid var(--ink);
  border-radius: 999px;
  box-shadow: 1px 1px 0 var(--ink);
  z-index: 3;
}
.cq-rec-card.rank-1 { grid-column: span 2; }
/* 只有 2 张正向前卡时，第 2 张也占满整行，避免半宽空一格 */
.cq-rec-cards.n2 .cq-rec-card.rank-2 { grid-column: span 2; }
/* 反向 1 站卡：整行、蓝色系，与正向暖色卡区分，明确"在你身后" */
.cq-rec-card.rev {
  grid-column: span 2;
  border-color: var(--c-info-bd);
  background: var(--c-info-bg);
  box-shadow: 3px 3px var(--c-info-bd);
}
.cq-rec-card.rev:hover { box-shadow: 3px 3px var(--c-info-bd); }
.cq-rec-card.rev.selected {
  border-color: var(--c-select);
  border-width: 3px;
  background: #fff7e6;
  box-shadow: 4px 4px 0 var(--ink), 0 0 0 3px rgba(244,198,79,.45);
  z-index: 2;
}
.cq-rec-card.rev.selected::after {
  content: "↩ 已选";
  background: var(--c-select);
}
.cq-rec-prox.rev { background: var(--c-info); color: #fff; }
.cq-rec-prio.prio-rev {
  background: var(--c-info-bg);
  color: var(--c-info);
  border: 0.5px solid var(--c-info-bd);
}
.cq-rec-prio {
  font: 700 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  padding: 2px 9px;
  border-radius: 8px;
  white-space: nowrap;
  flex-shrink: 0;
}
.cq-rec-prio.prio-1 { background: var(--c-ink); color: #fff; }
.cq-rec-prio.prio-2 { background: transparent; color: var(--c-ink); border: 1px solid var(--c-ink); }
.cq-rec-prio.prio-3 { background: #ece5d2; color: var(--c-ink-soft); }
.cq-rec-body { flex: 1; min-width: 0; }
.cq-rec-name {
  font: 700 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink);
  margin-bottom: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cq-rec-meta {
  font: 500 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
  margin-top: 2px;
}
.cq-rec-tag {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 6px;
  font: 700 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  margin-right: 4px;
}
.cq-rec-tag.plat    { background: var(--c-pos-bg); color: var(--c-pos); }
.cq-rec-tag.conc    { background: var(--c-pos-bg); color: var(--c-pos); }
.cq-rec-tag.concout { background: var(--c-warn-bg); color: var(--c-warn); }
.cq-rec-tag.out     { background: #ece5d2; color: var(--c-ink-soft); }
.cq-rec-tag.unk     { background: #ece5d2; color: var(--c-ink-soft); }
.cq-rec-arrow { color: var(--c-ink-soft); font-size: 20px; flex-shrink: 0; }
.cq-rec-top { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
.cq-rec-prox {
  background: var(--yellow); color: var(--c-select-ink);
  font: 700 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; padding: 2px 8px; border-radius: 8px;
  white-space: nowrap;
}
.cq-rec-right { margin-left: auto; display: flex; align-items: center; gap: 5px; }
.cq-rec-reason {
  font: 500 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
  line-height: 1.5;
  margin-bottom: 4px;
}
.cq-rec-loc {
  font: 400 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
  margin-bottom: 6px;
}
.cq-rec-foot {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-bottom: 6px;
}
.cq-rec-effort {
  display: inline-flex; align-items: center; gap: 3px;
  font: 500 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; color: var(--c-ink-soft);
}
.cq-rec-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: #e4d7b7; display: inline-block;
}
.cq-rec-dot.on { background: var(--c-ink); }
.cq-rec-source {
  font: 400 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; color: var(--c-ink-soft);
  border-top: 0.5px solid #e4d7b7; padding-top: 6px; margin-top: 2px;
}
.cq-rec-transfer {
  font: 500 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-info);
  background: #e8f1fb;
  border: 0.5px solid var(--c-info-bd);
  border-left: 3px solid var(--c-info);
  border-radius: 8px;
  padding: 6px 9px;
  margin-bottom: 6px;
  line-height: 1.5;
}
/* ===== B2 排序说明（可折叠）· 2026-09-21 降权 =====
   原形：**独立一行**的 #fff4b9 黄底按钮（border + 圆角 + 700 字重 + 44px 高），
   排在推荐块末尾、主行动按钮正上方 —— 视觉上与主行动同量级，且孤零零占一整行。
   但「排序说明」只是补充信息，不该抢注意力。现改：
     ① 位置：并入「步行量」图例行右侧（`.cq-rec-legend-row`），不再独占一行；
     ② 形式：黄底实心按钮 → 纯文字按钮（无边框无底色 + 下划线），与图例同为 11px/灰。
   ⚠ 与 `.cq-rec-legend` 其它两处用法（公交候选说明、动态图例）解耦：
   行内 flex 只在 `.cq-rec-legend-row` 上开，不污染 `.cq-rec-legend` 基础样式。 */
.cq-rec-legend-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.cq-rec-legend-row > span { min-width: 0; }   /* 长文本先压缩自身，不挤走右侧按钮 */
.cq-rec-logic-t {
  flex: none;
  display: inline-flex;
  align-items: center;
  border: 0;
  background: none;
  padding: 0 2px;
  min-height: 44px;              /* 触摸下限；视觉上是小灰字，不占视觉重量 */
  color: var(--c-ink-soft);
  text-decoration: underline;
  text-underline-offset: 2px;
  font: 500 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  cursor: pointer;
}
.cq-rec-logic-d {
  margin: 0 0 8px;
  padding: 7px 10px;
  background: #fffdf7;           /* 原 #fff4b9 黄底 → 安静米白（与 .cq-help-card/.cq-rec-change 同色） */
  border: var(--line);
  border-radius: 10px;
  font: 500 12px/1.5 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
}
/* ★ 主行动"我下地铁了"吸底可见（2026-09-18 用户实测反馈）：
   推荐块很长，按钮排在末尾（实测首屏下 1082px，视口 844），用户点完推荐卡只看到卡片高亮，
   看不到下一步入口 —— 会以为"点了没反应、应用坏了"。
   sticky bottom 让它始终贴在底部导航栏正上方：自然位置在视口内时不动，滚出去就吸底，
   纯 CSS、无需 JS。偏移量必须含 --bottomnav-h，否则被固定底栏盖住。
   C1（同日用户反馈）：按钮默认隐藏，选中推荐卡后才由 JS 插入（使用顺序：先选目标 → 再下地铁）；
   未选中时 DOM 里不存在该按钮。sticky 样式对动态插入的按钮同样生效。 */
.cq-rec-exit {
  display: block;
  width: 100%;
  margin-top: 10px;
  padding: 9px;
  min-height: 48px;
  background: var(--c-act);
  color: #fff;
  border: var(--line);
  border-radius: 10px;
  font: 700 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  cursor: pointer;
  position: sticky;
  /* 2026-09-20：+6px → +12px。--bottomnav-h 由 80 降到 65，但 SOS 同时改为上探栏顶 8px，
     故吸底元素必须让出这段（65+12=77 → 距栏顶 12px > SOS 上探 8px，留 4px 余量）。 */
  bottom: calc(var(--bottomnav-h) + var(--safe-bottom) + 12px);
  z-index: 3;                                  /* 低于 .cq-bottom 的 5，不与底栏抢层级 */
  box-shadow: 0 -3px 10px rgba(31, 43, 42, 0.12);
}
.cq-rec-exit:active { transform: scale(.98); }
/* ===== A2 选站 sheet 锚点提示（"选即将抵达的那一站"）===== */
.cq-pick-tip {
  margin: 0 0 10px;
  padding: 7px 10px;
  background: #fff4b9;
  border: var(--line);
  border-radius: 10px;
  font: 500 12px/1.45 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
}
.cq-pick-tip b { color: var(--c-ink); }

/* ===== 出站后步行方向指引 sheet ===== */
/* ===== "下车后怎么走"：L1 前提条（信息性，浅薄荷）===== */
.cq-walk-premise {
  display: flex;
  gap: 7px;
  align-items: flex-start;
  padding: 9px 12px;
  margin-bottom: 10px;
  background: #eaf4ef;
  border: 1px solid var(--mint);
  border-radius: 10px;
  font: 500 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #2f6b52;
  line-height: 1.5;
}
/* ===== L2 主指令 Hero（全页唯一"动作"块，视觉最强）===== */
.cq-walk-hero {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 13px 15px;
  margin-bottom: 10px;
  background: #fffdf7;
  border: var(--line);
  border-radius: 16px 22px 14px 20px;
  box-shadow: 3px 3px #e4d7b7;
}
.cq-hero-ico {
  flex: 0 0 auto;
  width: 40px;
  text-align: center;
  font: 900 32px/1.15 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-act);
}
.cq-hero-txt { flex: 1; min-width: 0; }
.cq-hero-main { font: 700 15px/1.5 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; color: var(--c-ink); }
.cq-hero-sub { margin-top: 4px; font: 500 12px/1.45 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; color: #8a7448; }
/* ===== L3 位置参考（降级小字，供复核）===== */
.cq-walk-ref {
  padding: 8px 12px;
  margin-bottom: 8px;
  background: #fbf7ec;
  border: 1px dashed #ded0ae;
  border-radius: 10px;
  font: 500 12px/1.5 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
}
/* ♿ 无障碍电梯指引块（仅"找无障碍"用户可见）：薄荷绿系，与无障碍徽标同族 */
.cq-walk-elev {
  padding: 9px 12px;
  margin-bottom: 8px;
  background: #eaf4ef;
  border: 1px solid var(--mint, #79c2a0);
  border-radius: 10px;
  font: 500 12.5px/1.65 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #2f6b52;
}
.cq-walk-elev b { color: #1d5b41; }
.cq-walk-elev-lead { font-weight: 700; }
.cq-walk-elev-step { margin-top: 3px; }
/* ===== L4 上下文（站点 → 厕所，降级）===== */
.cq-walk-context {
  padding-top: 10px;
  margin-bottom: 4px;
  border-top: 1px dashed #ded0ae;
  font: 500 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
  text-align: center;
}
.cq-walk-context b { color: var(--c-ink); }
.cq-walk-steps {
  display: flex;
  flex-direction: column;
  gap: 0;
  max-height: 50vh;
  overflow-y: auto;
  border: var(--line);
  border-radius: 14px 18px 16px 20px;
  background: #fffdf7;
  box-shadow: 3px 3px #e4d7b7;
}
.cq-walk-step {
  display: grid;
  grid-template-columns: 24px 28px 1fr;
  gap: 10px;
  align-items: start;
  padding: 10px 12px;
  border-bottom: 2px dashed #9da9a2;
}
.cq-walk-step:last-child { border-bottom: none; }
.cq-walk-step-idx {
  font: 700 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
  text-align: center;
  padding-top: 1px;
}
.cq-walk-step-icon {
  font: 700 20px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-act);
  text-align: center;
}
.cq-walk-step-instr {
  font: 500 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  line-height: 1.5;
}
.cq-walk-step-meta {
  font: 400 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #667a78;
  margin-top: 2px;
}
.cq-walk-loading, .cq-walk-error {
  padding: 20px;
  text-align: center;
  font: 500 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #667a78;
}
.cq-walk-error { color: var(--c-neg); }

/* ===== "下车后怎么走" 页反馈按钮（找到了/信息有误）===== */
.cq-walk-feedback {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 12px;
}
.cq-fb-btn {
  padding: 12px 8px;
  border: var(--line);
  border-radius: 12px;
  background: #fffdf7;
  font: 700 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  cursor: pointer;
  transition: transform .1s ease, box-shadow .15s ease, background .15s ease;
}
.cq-fb-btn:active { transform: scale(.97); }
.cq-fb-ok  { color: var(--c-pos); border-color: var(--ink); background: var(--c-pos-bg); }
.cq-fb-ok:hover  { background: var(--c-pos-bg-hover); }
.cq-fb-bad { color: var(--c-neg); border-color: var(--c-neg); background: #fff9ed; }
.cq-fb-bad:hover { background: #fbeede; }
/* ===== A3 救济出口：站不对 / 坐过站 → 返回调整 ===== */
.cq-walk-back {
  display: block;
  width: 100%;
  margin-top: 10px;
  padding: 9px;
  min-height: 44px;
  background: transparent;
  border: 1px dashed #c9bda0;
  border-radius: 10px;
  color: var(--c-ink-soft);
  font: 500 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  cursor: pointer;
  transition: transform .1s;
}
.cq-walk-back:active { transform: scale(.98); }

/* ===== 指引页「本站其他选择」折叠块 =====
   场景：下车后发现首选不可用（没开/排长队）→ 展开换一处，一键重新指路。 */
.cq-walk-alts-t {
  display: block;
  width: 100%;
  margin-top: 12px;
  padding: 8px 0;
  background: none;
  border: none;
  border-top: 1px dashed #d8cdb2;
  color: var(--c-ink-soft);
  font: 700 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  text-align: center;
  cursor: pointer;
}
.cq-walk-alts-t:active { opacity: .7; }
.cq-walk-alts {
  margin-top: 4px;
  padding: 2px 0;
}
.cq-walk-alt {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 0;
  border-bottom: 1px dashed #ece4cd;
}
.cq-walk-alt:last-child { border-bottom: none; }
.cq-walk-alt-l {
  flex: 1;
  display: flex;
  align-items: flex-start;
  gap: 6px;
  font: 400 11px/1.5 "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #6b6256;
}
.cq-walk-alt-l .cq-rec-tag { flex: none; margin-top: 1px; }
.cq-walk-alt-d { flex: 1; overflow-wrap: anywhere; }
.cq-walk-alt-go {
  flex: none;
  padding: 6px 10px;
  min-height: 32px;
  background: var(--yellow, #ffd54a);
  border: 1.5px solid var(--c-act);
  border-radius: 8px;
  font: 700 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-act);
  cursor: pointer;
  white-space: nowrap;
}
.cq-walk-alt-go:active { transform: scale(.96); }

/* ===== 找到了/信息有误的反馈页 ===== */
.cq-walk-found {
  display: flex;
  flex-direction: column;
  align-items: center;       /* 强制所有子元素水平居中 */
  align-self: center;        /* 容器自身在父 panel 里也居中（防止 panel 收缩时偏左） */
  width: 100%;               /* 撑满 panel 宽度，确保 text-align: center 真正生效 */
  gap: 10px;
  padding: 16px 4px 8px;
  text-align: center;
  box-sizing: border-box;
}
.cq-walk-found-emoji { font-size: 64px; line-height: 1; }
.cq-walk-found-title {
  font: 900 22px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  margin-top: 4px;
}
.cq-walk-found-sub {
  font: 500 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #667a78;
  margin-top: 2px;
  line-height: 1.5;
}
.cq-walk-found-sub b { color: var(--c-ink); }
.cq-walk-found-tip {
  font: 500 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
  background: #fff4b9;
  border: var(--line);
  border-radius: 14px;
  padding: 8px 12px;
  margin-top: 4px;
}
.cq-found-write {
  width: 100%;
  margin-top: 10px;
  background: var(--c-act);
  color: #fff;
  border: var(--line);
  border-radius: 12px;
  font: 700 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  box-shadow: 3px 3px #e4d7b7;
}
.cq-found-write:active { transform: translate(2px,2px); box-shadow: 1px 1px #e4d7b7; }
.cq-found-skip {
  width: 100%;
  margin-top: 6px;
  background: #fffdf7;
  color: #667a78;
  border: var(--line);
  border-radius: 12px;
  font: 500 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}
.cq-found-skip:hover { background: #f3ece0; }
.cq-feedback-text {
  width: 100%;
  min-height: 88px;
  resize: vertical;
  border: var(--line);
  border-radius: 12px;
  padding: 10px 12px;
  font: 500 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  background: #fffdf7;
  box-sizing: border-box;
  margin-top: 4px;
}
.cq-feedback-text:focus {
  outline: none;
  border-color: var(--c-ink);
  background: #fffdf7;
}

/* ===== 选站 sheet（iOS 三列滚轮 picker） ===== */
.cq-panel.cq-msl-panel {
  /* 让 panel 内 flex 布局生效 */
  display: flex;
  flex-direction: column;
  /* 紧凑 padding：标题 ~36+6 + 预览 ~46 + service ~50 + wrap + 按钮 ~49 + safe ≈ 200 + wrap */
  padding: 12px 14px calc(12px + var(--safe-bottom));
  /* 内容多时 panel 内部可以滚；picker 自己已 overflow，外部无需滚 */
  overflow: hidden;
  /* 高度优先跟内容走；max-height 只在超高屏幕兜底（不抢满屏） */
  height: auto;
  max-height: min(82dvh, 640px);
  min-height: 0;
}

/* 顶部 header：标题 + 关闭按钮同一行 */
.cq-msl-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-shrink: 0;
  margin-bottom: 6px;
}
.cq-msl-header .cq-detail-title {
  margin: 0;
  /* 跟随全局 .cq-detail-title 换字体（2026-09-20 手写体 → Noto Sans SC 粗体），不被 flex 容器覆盖 */
  font: 700 22px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  line-height: 1.2;
}
.cq-msl-header .cq-close {
  /* 覆盖全局绝对定位：现在是 flex 内的正常流元素 */
  position: static;
  width: 36px;
  height: 36px;
  font-size: 20px;
  flex-shrink: 0;
}
.cq-msl-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.cq-pick-sound {
  width: 36px;
  height: 36px;
  font-size: 18px;
  line-height: 1;
  border: 1px solid var(--line, #d8c9a5);
  border-radius: 9px;
  background: #fffdf7;
  color: var(--ink);
  cursor: pointer;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.cq-pick-sound:active { background: #f0e9d8; }

.cq-pick-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 4px 4px 10px;
  padding: 8px 10px;
  background: linear-gradient(135deg, #f5efe3 0%, #ebe1cf 100%);
  border: 1px solid #d8c9a5;
  border-radius: 10px;
  font: 700 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #2b3340;
  flex-wrap: wrap;
  text-align: center;
  width: fit-content;
  max-width: 100%;
  flex-shrink: 0;
  align-self: center;
}
.cq-pick-preview-line {
  display: inline-flex; align-items: center; gap: 5px;
  color: var(--ink);
  font-size: 17px;
  font-weight: 700;
}
.cq-pick-preview-arrow {
  color: #a05a17;
  font-size: 13px;
}
.cq-pick-preview-st {
  color: var(--c-select-ink);
  font-weight: 700;
  font-size: 17px;
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cq-pick-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.cq-pick-wrap {
  display: grid;
  /* 三列：线路（容纳"16 号线" + 圆点） / 方向 / 车站（名字可能最长） */
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.85fr) minmax(0, 1.3fr);
  gap: 8px;
  margin: 0 0 8px;
  /* flex: 1 1 360 → 充裕时展开到 360（窗口 ~336 ≈ 中心 1 + 完整 4 + 部分 1 = 5 个 item 可见），
     空间不足时收到 min-height */
  flex: 1 1 360px;
  min-height: 130px;
  max-height: 44dvh;
}

/* 单列 */
.cq-pick-col {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
}
.cq-pick-label {
  font: 700 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-ink-soft);
  text-align: center;
  margin-bottom: 4px;
  letter-spacing: 0.5px;
  flex-shrink: 0;
}

/* 滚动窗口：占满列容器减去 label，中心高亮带固定 44px */
.cq-pick-window {
  position: relative;
  flex: 1;
  min-height: 0;
  background: #f7f4ec;
  border: 1px solid #d8c9a5;
  border-radius: 12px;
  overflow: hidden;
}

/* 中心高亮带（视觉锚点）—— 垂直居中，不依赖 window 高度 */
.cq-pick-highlight {
  position: absolute;
  left: 6px; right: 6px;
  top: 50%;
  height: 44px;
  transform: translateY(-50%);
  background: linear-gradient(180deg, rgba(244,198,79,0.16), rgba(244,198,79,0.32) 50%, rgba(244,198,79,0.16));
  border-top: 1.5px solid var(--c-select-bd);
  border-bottom: 1.5px solid var(--c-select-bd);
  pointer-events: none;
  z-index: 1;
  border-radius: 8px;
}

/* 上下渐变蒙版，让非选中项"淡入淡出" —— 高度 50% - 22px（中心高亮带高度一半） */
.cq-pick-fade {
  position: absolute;
  left: 0; right: 0;
  pointer-events: none;
  z-index: 2;
}
.cq-pick-fade-top {
  top: 0;
  height: calc(50% - 22px);
  background: linear-gradient(180deg, #f7f4ec 30%, rgba(247,244,236,0));
}
.cq-pick-fade-bot {
  bottom: 0;
  height: calc(50% - 22px);
  background: linear-gradient(0deg, #f7f4ec 30%, rgba(247,244,236,0));
}

/* 上下"占位行"——视觉上让中心高亮带不会顶到边缘 */
.cq-pick-row {
  display: none;
}

/* 滚动列表（JS 全权控制滚动 + 惯性 + snap，不要 CSS scroll-snap 抢控制权） */
.cq-pick-list {
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
  /* 禁用浏览器的 snap 和 smooth，由 JS 自己控制位置 */
  scroll-snap-type: none;
  scroll-behavior: auto;
  /* 禁用浏览器默认 touch 行为（横向滚动、刷新等），保证我们 JS touchmove 不被抢 */
  touch-action: pan-y;
  -ms-touch-action: pan-y;
  /* 占位用 0；JS 在 attachWheel 第一次 rAF 中会按 clientHeight/2 动态写入 */
  padding: 0;
  position: relative;
  z-index: 3;
  /* 硬件加速 */
  will-change: transform;
  transform: translateZ(0);
  /* 阻止 iOS 上的橡皮筋效果影响 picker（外层 panel 是 sheet 已有 overflow 控制） */
  overscroll-behavior: contain;
}
.cq-pick-list::-webkit-scrollbar { display: none; }

/* 单行 item */
.cq-pick-item {
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 6px;
  font: 500 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #6b7480;
  cursor: pointer;
  user-select: none;
  scroll-snap-align: center;
  scroll-snap-stop: always;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
/* 文字节点：flex 子项必须 min-width:0 + overflow:hidden + text-overflow:ellipsis 才会真正省略号截断
   （flex 容器自身的 text-overflow 对匿名文字块无效） */
.cq-pick-item-text {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cq-pick-item.on {
  color: var(--c-select-ink);
  font-weight: 700;
  font-size: 15px;
}
.cq-pick-empty {
  height: 44px;
  display: flex; align-items: center; justify-content: center;
  color: #667a78;
  font: 500 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
}

/* 班次（仅 16 号线等多班次线路显示） */
.cq-pick-service {
  display: flex;
  gap: 6px;
  justify-content: center;
  margin: 6px 0 12px;
  flex-wrap: wrap;
}
.cq-pick-svc {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  padding: 6px 12px;
  border: var(--line);
  background: #fffdf7;
  border-radius: 10px;
  cursor: pointer;
  font: 500 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
}
.cq-pick-svc b { font: 700 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; }
.cq-pick-svc small {
  font: 400 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #667a78;
  margin-top: 2px;
}
.cq-pick-svc.on {
  border-color: var(--c-select-bd);
  background: var(--c-select-bg);
  color: var(--c-select-ink);
}

.cq-msl-done {
  display: block;
  width: 100%;
  margin-top: 12px;
  padding: 12px;
  background: var(--c-act);
  color: #fff;
  border: var(--line);
  border-radius: 14px;
  font: 700 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  letter-spacing: 2px;
  cursor: pointer;
  box-shadow: 3px 3px #e4d7b7;
  transition: transform .08s ease, box-shadow .08s ease;
}
.cq-msl-done:active { transform: translate(2px,2px); box-shadow: 1px 1px #e4d7b7; }

/* 「告诉我你在哪儿」sheet 内的「确认」按钮：
   关键：必须是普通 flex 流（不 sticky），让 wrap 用 flex: 1 1 0 自动伸缩，
   否则在矮 viewport（横屏/split-view）下 sticky + overflow:hidden 会让按钮压在 picker 上 */
.cq-panel.cq-msl-panel .cq-msl-done {
  margin-top: 12px;
  flex-shrink: 0;
}

/* 矮屏（横屏 / iPad split-view / 小浏览器窗口）：紧凑布局避免按钮被裁 */
@media (max-height: 500px) {
  .cq-panel.cq-msl-panel {
    padding: 8px 12px calc(8px + var(--safe-bottom));
    max-height: 100dvh;
  }
  .cq-msl-header { margin-bottom: 2px; }
  .cq-msl-header .cq-detail-title { font-size: 22px; }
  .cq-pick-preview { margin: 2px 4px 6px; padding: 5px 10px; font-size: 12px; }
  .cq-pick-wrap { margin: 0 0 4px; flex-basis: 200px; min-height: 130px; max-height: none; }
  .cq-panel.cq-msl-panel .cq-msl-done { margin-top: 6px; padding: 8px; font-size: 15px; }
}

/* ============ 商场：同楼层其他卫生间 ============ */
.cq-section-h {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin: 14px 0 8px;
  font: 700 20px "Ma Shan Zheng", "Noto Sans SC", "PingFang SC", cursive;
  color: var(--ink);
}
.cq-section-h small {
  font: 400 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #5e7774;
}

/* --- 同楼层其他卫生间 --- */
.cq-siblings { margin: 6px 0 14px; }
.cq-sibling-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 8px;
}
.cq-sibling {
  background: #fffdf7;
  border: 2px solid var(--ink);
  border-radius: 12px;
  padding: 8px 10px;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
  display: flex;
  flex-direction: column;
  gap: 4px;
  box-shadow: 0 2px 0 var(--ink);
  transition: transform .08s ease, box-shadow .08s ease;
}
.cq-sibling:active {
  transform: translateY(1px);
  box-shadow: 0 1px 0 var(--ink);
}
.cq-sibling-gender { font-size: 16px; line-height: 1; }
.cq-sibling-name {
  font: 700 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.cq-sibling-genderlabel {
  font: 500 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #5e7774;
}
.cq-sibling-fac {
  display: flex; flex-wrap: wrap; gap: 4px;
}
.cq-sibling-fac .cq-tag {
  font-size: 11px;
  padding: 1px 5px;
}

/* --- 列表卡片：商场楼层 chip --- */
.cq-floor-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #fff;
  border: 1.5px solid var(--ink);
  border-radius: 8px;
  padding: 1px 7px;
  margin-right: 4px;
  font: 700 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
}
.cq-floor-chip i { font-style: normal; font-weight: 700; }
.cq-floor-chip i.g-m { color: var(--c-info); }
.cq-floor-chip i.g-f { color: #e26d8b; }
.cq-floor-chip i.g-x { color: #555; font-size: 11px; }
.cq-sibling-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px; height: 30px;
  border-radius: 50%;
  border: 1.5px solid var(--ink);
  font: 700 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  line-height: 1;
  flex-shrink: 0;
  gap: 1px;
}
.cq-sibling-icon.m { background: var(--c-info-bg); color: var(--c-info); }
.cq-sibling-icon.f { background: #ffe1ea; color: #e26d8b; }
.cq-sibling-icon.x { background: #ece7dc; color: #555; }
.cq-sibling-icon.x i { font-style: normal; line-height: 1; }
.cq-sibling-icon.x i:first-child { color: #e26d8b; font-size: 11px; }
.cq-sibling-icon.x i:last-child  { color: var(--c-info); font-size: 11px; }
.cq-sibling-gender { display: flex; align-items: center; justify-content: center; }

/* 同层卡片：头部行（图标 + 名称 + 性别标签）与 4 大分类 chip 行 */
.cq-sibling-head { display: flex; align-items: center; gap: 6px; }
.cq-sibling-gender { font-size: 18px; line-height: 1; flex-shrink: 0; }
.cq-sibling-name { flex: 1; min-width: 0; }
.cq-sibling-genderlabel { font: 500 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif; color: #5e7774; flex-shrink: 0; }
.cq-sibling-chips { display: flex; gap: 4px; }
.cq-kind-chip {
  width: 22px; height: 22px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 13px; line-height: 1;
  border-radius: 6px;
  border: 1.5px solid #cfcfcf;
  background: #f1f1f1;
  filter: grayscale(1);
  opacity: .4;
}
.cq-kind-chip.on {
  border-color: var(--ink);
  background: #fffdf7;
  filter: none;
  opacity: 1;
}

/* ===== UGC 设施确认区块（帮后来的人确认：有 / 没有 / 不清楚） ===== */
.cq-ugc-block {
  margin: 12px 0 4px;
  padding: 10px 12px;
  background: #f6f2e6;
  border: 2px dashed #c9c0ab;
  border-radius: 14px;
}
.cq-ugc-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px dashed #ddd4bf;
}
.cq-ugc-row:last-of-type { border-bottom: none; }
.cq-ugc-addrow {
  padding: 8px 0 2px;
  display: flex;
  justify-content: flex-end;
}
.cq-ugc-name {
  font: 700 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.cq-ugc-name small {
  font: 400 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #8a8171;
}
.cq-ugc-pick { display: flex; gap: 8px; flex: none; }
.cq-ugc-pick button {
  min-height: 44px;    /* 手机触摸下限（原 33px） */
  padding: 6px 14px;
  background: #fffdf7;
  border: 2px solid var(--ink);
  border-radius: 10px;
  cursor: pointer;
  font: 500 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  transition: all 0.12s;
}
.cq-ugc-pick button.on {
  background: var(--yellow);
  border-color: var(--c-select-bd);
  color: var(--c-select-ink);
  transform: translateY(-1px);
}
.cq-ugc-tip {
  display: block;
  margin-top: 6px;
  font-size: 11px;
  color: #8a8171;
  line-height: 1.5;
}

/* ============ 「帮个忙」任务台卡片（2026-09-19）============ */
/* 一级入口从「打卡」换成任务台：一屏 3 张卡，每张只问一个是非题。
   答题控件**不新造** —— 是非题复用 .cq-ugc-pick，楼层题复用 .cq-floor-pick，
   保证与详情页的设施确认区视觉同源（用户在两个入口看到的是同一套交互）。
   卡片外框沿用 .cq-ugc-block 的"实线加粗 + 圆角"语言，但背景更亮以突出"待办"感。 */
.cq-help-card {
  margin: 10px 0;
  padding: 12px 14px;
  background: #fffdf7;
  border: 2px solid var(--ink);
  border-radius: 14px;
}
/* 答过的卡片转为"已完成"的淡绿，形成进度感（一屏 3 题答完一眼可见） */
.cq-help-card.done {
  background: #f1f7ee;
  border-color: #8bb98a;
}
.cq-help-head {
  display: flex;
  /* 2026-09-21：baseline → center。卡头右侧新增 44px 高的导航 pill，
     baseline 对齐会让名字/距离跟着 pill 的文字基线一起漂移。 */
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
/* 卡头右簇：距离 + 导航 pill（名字可换行占满左侧，这一簇 flex:none 不参与压缩） */
.cq-help-tail {
  flex: none;
  display: flex;
  align-items: center;
  gap: 8px;
}
/* ★ 卡内导航（2026-09-21 用户反馈）：帮个忙只列名字与距离，用户无法判断点位在哪 →
   给一个能直接走的入口。视觉沿用 .cq-rec-change 的「墨描边 + 米白底 + 14px 圆角」
   小按钮语言（同一套「次级动作」外观），触摸下限 44px。
   ⚠ 只有「地铁建筑之外」的点位才渲染本按钮（门控见 helpCardHtml 的 canNav）。 */
.cq-help-nav {
  flex: none;
  min-height: 44px;
  min-width: 44px;
  padding: 4px 10px;
  border: 1.5px solid var(--c-ink);
  background: #fffdf7;
  color: var(--c-ink);
  border-radius: 14px;
  font: 700 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  cursor: pointer;
}
.cq-help-nav:active { transform: scale(.97); }
.cq-help-name {
  font: 700 15px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  word-break: break-word;
}
.cq-help-dist {
  flex: none;
  font: 500 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #a8763a;
}
.cq-help-q {
  margin-top: 6px;
  font: 500 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
}
.cq-help-hint {
  margin-top: 2px;
  font: 400 11px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: #8a8171;
  line-height: 1.5;
}
.cq-help-answer { margin-top: 10px; }
.cq-help-done {
  margin-top: 8px;
  font: 500 12px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--c-pos);
}

/* ============ UGC 楼层选择（2026-09-19）============ */
/* 商场室内卫生间在几层：地图源全部拿不到（高德 indoor_map 普查全 0、百度/腾讯/OSM 无商场
   内部 POI），网络搜索只有业态分布 → 楼层只能由到店的人补。
   形制沿用 .cq-ugc-pick（同色系、同 44px 触摸下限），保证与"有没有"确认区视觉同源。 */
.cq-floor-pick {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-top: 8px;
}
.cq-floor-pick button {
  min-height: 44px;    /* 手机触摸下限，与 .cq-ugc-pick 同 */
  padding: 6px 4px;
  background: #fffdf7;
  border: 2px solid var(--ink);
  border-radius: 10px;
  cursor: pointer;
  font: 500 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  color: var(--ink);
  transition: all 0.12s;
}
.cq-floor-pick button.on {
  background: var(--yellow);
  border-color: var(--c-select-bd);
  color: var(--c-select-ink);
  transform: translateY(-1px);
}
/* 窄屏下 8 个楼层按钮挤成 4 列会太窄，2 行 ×4 已是最优；再窄则降为 3 列 */
@media (max-width: 340px) {
  .cq-floor-pick { grid-template-columns: repeat(3, 1fr); }
}

/* ============ 「想去榜」区块（2026-09-18）============ */
/* 放在「我的想去」tab 顶部。窄屏 390 下与列表卡片同宽（左右各 12px），
   条目用 flex + min-width:0 + 省略号，保证长点位名不撑破容器。 */
.cq-wish-rank {
  margin: 0 12px 14px;
  background: #fffdf7;
  border: 1px solid rgba(168, 118, 58, 0.28);
  border-radius: 14px;
  overflow: hidden;
}
.cq-wish-rank-head {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
  padding: 10px 12px 8px;
  font: 20px "Ma Shan Zheng", "Noto Sans SC", "PingFang SC", cursive;
  color: var(--c-act);
  border-bottom: 1px dashed rgba(168, 118, 58, 0.25);
}
.cq-wish-rank-head small {
  font: 11px var(--font-ui, -apple-system, sans-serif);
  color: #8a8171;
}
.cq-wish-rank-body { padding: 4px 0; }
.cq-wish-empty {
  padding: 14px 12px;
  font-size: 12px;
  color: #8a8171;
  line-height: 1.65;
}
.cq-wish-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  cursor: pointer;
}
.cq-wish-row:last-child { border-bottom: none; }
.cq-wish-row:active { background: rgba(255, 226, 122, 0.22); }
.cq-wish-no {
  flex: 0 0 20px;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  color: #a8763a;
}
.cq-wish-main { flex: 1 1 auto; min-width: 0; }
.cq-wish-name {
  font-size: 13px;
  color: var(--ink);
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cq-wish-meta {
  font-size: 11px;
  color: #8a8171;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cq-wish-gap { color: var(--c-neg); font-weight: 700; }
.cq-wish-cnt {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 15px;
  font-weight: 700;
  color: #a8763a;
  line-height: 1.2;
}
.cq-wish-cnt small {
  font-size: 11px;
  font-weight: 400;
  color: #8a8171;
}

/* ========== 关于本应用（info 页，2026-09-20）==========
   定位是「不显眼但要有」，所以刻意**不用** hero 那种重边框卡片，全走「安静的文档」质感：
   小节标题沿用「我的」页的 18px 楷体，正文 13px，列表项两行 = 粗体结论 + 弱化说明。
   这样它和「我的」页看起来是一套，而不像一个临时塞进来的页面。
   ⚠ 唯一的「重」元素是收录总数（20px）—— 因为用户点进来多半就是想看它。 */
.cq-about-lead {
  font-size: 13px;
  line-height: 1.65;
  color: #3d5a5f;
  margin: 2px 0 4px;
}
.cq-about-h {
  margin: 18px 0 6px;
  font: 20px "Ma Shan Zheng", "Noto Sans SC", "PingFang SC", cursive;
}
.cq-about-total {
  font-size: 13px;
  color: var(--ink);
}
.cq-about-total b {
  font-size: 20px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;   /* 与 hero 徽标同一考虑：数字变宽时不抽动 */
}
.cq-about-sub {
  margin-top: 3px;
  font-size: 12px;
  color: #6c807d;
}

/* 列表项用 <ul>/<li> 而非 div：这是并列条目，语义上就该是列表（读屏会念出条目数）。
   分隔线走 li 的上边框（不用 :not(:last-child) 的下边框）—— 第一项无上边框，
   末项不会拖一条悬空的线。 */
.cq-about-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.cq-about-list li {
  padding: 7px 0;
  border-top: 1px solid rgba(40, 60, 66, .14);
  font-size: 13px;
  line-height: 1.65;
}
.cq-about-list li:first-child { border-top: none; }
.cq-about-list li > b {
  font-weight: 500;
  color: var(--ink);
}
.cq-about-list li > span {
  display: block;
  margin-top: 1px;
  font-size: 12px;
  color: #6c807d;
}

.cq-about-note {
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.65;
  color: #6c807d;
}
.cq-about-note a {
  color: var(--c-act);
  font-weight: 700;
  word-break: break-all;   /* 邮箱是长串无空格文本，窄屏必须允许断行 */
}
.cq-about-foot {
  margin: 20px 0 4px;
  padding-top: 10px;
  border-top: 1px solid rgba(40, 60, 66, .14);
  text-align: center;
  font-size: 12px;
  color: #9aa9ab;
}

/* info 页入口（在「我的」页底部）。做成"设置项"样子而不是卡片或高亮链接 ——
   它是兜底入口，越像一行设置越好、越不像推广越好。左对齐 + 右端 › 是设置行的通用语汇。 */
.cq-about-entry {
  display: block;
  width: 100%;
  min-height: 44px;                 /* 直接给足，不需要 ::after 撑 */
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(40, 60, 66, .2);
  border-radius: 10px;
  background: none;
  color: #4f6b6f;
  font: 13px "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  text-align: left;
  cursor: pointer;
}

/* ★ 2026-09-20：急找卫生间 / 帮个忙 / 我的卫生间 三个弹层标题，
   字体与「想去」列表标题（.cq-section-head h2，手写体 Ma Shan Zheng）保持一致。
   仅作用于这三个短标题，详情页长标题仍用 Noto Sans SC 粗体（长名辨识度优先）。 */
.cq-detail-title.cq-ttl-hand {
  font: 24px "Ma Shan Zheng", "Noto Sans SC", "PingFang SC", cursive;
}
