/* =====================================================================
   app-v2.css —— 会员端 UI v2 覆盖层（2026-10-18 从 web/ui-v2 合并进主系统）
   ---------------------------------------------------------------------
   定位：**覆盖层**。在 12 个会员端页面里，用 <link> 挂在 /assets/app.css 之后、
   页面私有 <style> **之后**（同特异度靠「后写覆盖」生效），不改 app.css 一个字节。

   覆盖范围（12 页）：login / index / screening / capture / result / booking /
   robot-session / robot-live / feedback / profile / appointments / daily。
   其余页面（后台 admin、chat、masters、shop 等）不引用本文件，视觉保持原样。

   ⚠️ 令牌口径：本节只保留与 app.css :root **不同**的 6 个变量。
      --r-lg 18→16 / --r-md 14→12 / --r-sm 10→8（v2 收小一档，更「工具感」）；
      --shadow / --shadow-lg 换成贴纸卡片式轻阴影；
      --sans 多挂 HarmonyOS Sans SC / MiSans（国产屏显体，命中即用）。
      22 个颜色/字号变量与 app.css 逐值相同，**不再重复定义** —— 重复会让以后
      改色板时出现「改了一处、另一处盖着」的隐形冲突。
   ===================================================================== */

/* ---------------------------------------------------------------------
   1. 设计令牌（仅保留与 app.css 不同的部分）
   --------------------------------------------------------------------- */
:root {
  --r-lg: 16px;
  --r-md: 12px;
  --r-sm: 8px;
  --shadow: 0 1px 2px rgba(46, 43, 38, .04), 0 6px 16px -12px rgba(46, 43, 38, .18);
  --shadow-lg: 0 16px 40px -22px rgba(46, 43, 38, .35);
  --sans: "HarmonyOS Sans SC", "MiSans", "Inter", "PingFang SC", "Noto Sans SC", "Microsoft YaHei", "Hiragino Sans GB", sans-serif;

  /* ---------------------------------------------------------------------
     「智能分析」语义色（2026-10-31 新增，全站可复用）
     ---------------------------------------------------------------------
     紫色 = 系统在思考：辨证因素 / 判断 / 推理结论。
     与暖绿（--primary，健康执行）分工明确 —— 用户看到紫色区域就知道
     「这里是它分析的地方」，不必在页面上到处写「AI」「智能」字样。

     为什么不用霓虹/深色科技风：本产品用户 35~55 岁、场景是中医调理，
     冷色科技感会被读成「花哨、不实在」。智能感靠结构、数据与过程动效传达，
     不靠特效。这组色只承担「这是分析」这一个语义。
     --------------------------------------------------------------------- */
  --smart: #534AB7;          /* 主色：因素点、判断竖线、分析类图标 */
  --smart-deep: #3C3489;     /* 深色：分析类标题文字 */
  --smart-soft: #EEEDFE;     /* 浅底：分析卡背景 */
  --smart-line: #CECBF6;     /* 描边：分析卡边框、引用竖线 */
  --learn: #BA7517;          /* 学习色：已优化标记、记忆/变化提示 */
  --learn-soft: #FAEEDA;     /* 学习色浅底 */
}

/* ---------------------------------------------------------------------
   2. 骨架：外层 / 内容区
   --------------------------------------------------------------------- */
body {
  background: var(--bg-alt);
  color: var(--text);
  /* 数字等宽：灸量、时长、次数都是要纵向对齐的数字列 */
  font-variant-numeric: tabular-nums;
}

.app {
  background: var(--bg);
  box-shadow: 0 0 0 1px rgba(46, 43, 38, .04), 0 24px 60px -40px rgba(46, 43, 38, .5);
}

.content { padding: 16px 16px 132px; }

/* ---------------------------------------------------------------------
   3. 顶栏：米杏半透明毛玻璃 + 常驻细线（v1 只有滚动后才出现线）
   --------------------------------------------------------------------- */
.topbar {
  background: rgba(245, 242, 237, .92);
  backdrop-filter: saturate(180%) blur(14px);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
  border-bottom: 1px solid var(--line);
}

/* 顶部装饰条：unslop（2026-11-05）从绿→金跨色渐变收成单色墨绿（与 app.css 同改） */
.accentbar {
  height: 3px;
  background: var(--primary);
}

.nav { padding: 11px 16px; border-bottom: none; }

/* 顶栏已有常驻下边框，滚动时不再重复加线，只做背景加深 */
.nav.scrolled {
  border-bottom-color: transparent;
  background: rgba(245, 242, 237, .78);
}

.brand { font-size: 16px; font-weight: 650; letter-spacing: .1px; }

/* 字标：回到 v1 的「浅绿底 + 墨绿字」（v2 曾做成实心青 + 白字） */
.brand .logo {
  width: 27px; height: 27px; border-radius: 8px;
  background: var(--primary-soft); color: var(--primary);
  font-size: 16px;
}

.nav .back {
  width: 34px; height: 34px; border-radius: 10px;
  background: var(--card); border: 1px solid var(--line);
  color: var(--text-sub);
}

.nav .back:active { background: var(--bg-alt); }

/* 顶栏标题的 .bn 收尾规则在 app.css（基础层）—— 后台页不引本文件也要生效 */

.nav .who {
  background: var(--bg-alt); border: 1px solid transparent;
  color: var(--text-sub); padding: 4px 10px;
}

/* 顶栏「退出登录」（2026-10-18 第四轮：从首页底部搬到页面最右上方）。
   ⚠️ renderNav 把 opts.right 渲染在 .who **之前**，而 .brand 是 flex:1，
   所以只按 DOM 顺序它会落在姓名胶囊左边。要视觉上真正「最右」，
   用 flex order 把它排到最后（.who / .brand 都是默认 order 0）。 */
.nav .nav-logout {
  order: 3; flex: none;
  padding: 9px 9px; border-radius: 999px;
  border: 1px solid var(--line); background: var(--card);
  color: var(--text-sub);
  font-size: 16px; font-family: var(--sans);
  white-space: nowrap; cursor: pointer;
  transition: background .15s, color .15s;
}

.nav .nav-logout:active { background: var(--bg-alt); color: var(--text); }

/* 家庭账号入口（2026-10-19）：与「退出登录」同栏，排在它前面（order 1 < 2） */
/* 大字体开关（2026-10-20）：与「家庭账号 / 退出登录」同一栏，排在它们前面。
   order 依次 1/2/3 —— .who（名字胶囊）是 0，所以视觉顺序是
   [名字] [A⁺] [家庭账号] [退出登录]。 */
.nav .nav-big {
  order: 1; flex: none; min-width: 40px;
  padding: 9px 9px; border-radius: 999px;
  border: 1px solid var(--line); background: var(--card);
  color: var(--text-sub);
  font-size: 16px; font-weight: 700; font-family: var(--sans);
  white-space: nowrap; cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
}
.nav .nav-big[aria-pressed="true"] {
  background: var(--primary-soft); border-color: var(--primary); color: var(--primary-deep);
}
.nav .nav-big:active { background: var(--bg-alt); }

.nav .nav-family {
  order: 2; flex: none;
  padding: 9px 9px; border-radius: 999px;
  border: 1px solid var(--line); background: var(--primary-soft);
  color: var(--primary-deep);
  font-size: 16px; font-family: var(--sans); font-weight: 600;
  white-space: nowrap; cursor: pointer;
  transition: background .15s, color .15s;
}
.nav .nav-family:active { background: var(--primary); color: #fff; }

/* ---------------------------------------------------------------------
   4. 底栏 / 底部导航
   --------------------------------------------------------------------- */
.bottombar {
  background: rgba(245, 242, 237, .94);
  backdrop-filter: saturate(180%) blur(14px);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
  border-top: 1px solid var(--line);
}

.tabbar button {
  color: var(--text-faint);
  border-radius: 10px;
  transition: color .16s, background .16s;
}

.tabbar button.on {
  color: var(--primary-deep);
  background: var(--primary-soft);
  font-weight: 700;
}

.tabbar button svg { width: 20px; height: 20px; }

/* ---------------------------------------------------------------------
   4-b. 底栏四个图标 + 文字**加粗放大**（2026-10-18 用户口径：
        「首页 / 养护卡商城 / 我的预约 / 我的档案 这四个图标标识突出清晰一些」）

       原来：图标 20px、线宽 1.6、文字 10.5px、未选中色 #A39C92（浅米灰），
       在米杏底上偏淡，中老年会员看着费劲。
       现在：图标 23px、线宽 1.9（**线宽能用 CSS 覆盖**，SVG 上是 presentation
       attribute，优先级低于 CSS）、文字 11.5px / 600、未选中色提到 --text-sub
       （#7D766D），选中态用墨绿加粗 + 浅青底胶囊。
       ⚠️ 「养护卡商城」5 个字，app.css 会给它.t-long 降到 9px，这里一并抬到 10px，
          否则同一排里它明显比别的字小一号。 */
.tabbar button {
  gap: 4px;
  padding: 7px 2px 6px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .2px;
  color: var(--text-sub);
}

.tabbar button svg {
  width: 23px;
  height: 23px;
  stroke-width: 1.9;
}

.tabbar button.on { color: var(--primary-deep); font-weight: 700; }

.tabbar button.on svg { stroke-width: 2.1; }

.tabbar button.t-long { font-size: 13px; }

/* ---------------------------------------------------------------------
   5. 首页 Hero：去掉衬线大字与渐变底盘，换成「应用图标 + 无衬线标题」
   --------------------------------------------------------------------- */
.hero h1 {
  font-family: var(--sans);
  font-size: 24px; font-weight: 700; letter-spacing: .2px;
  color: var(--text); margin-bottom: 6px;
}

.hero .sub { font-size: 16px; color: var(--text-sub); }

.hero .mark {
  width: 72px; height: 72px; border-radius: 22px;
  background: var(--card);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
}

/* ---------------------------------------------------------------------
   6. 卡片 / 面板：细边框 + 极轻阴影（本套视觉的主基调）
   --------------------------------------------------------------------- */
.card,
.panel,
.qcard,
.badge,
.remind-card,
.tbl-wrap {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--shadow);
}

.card { padding: 16px; margin-bottom: 10px; }

.card-title {
  font-size: 16px; font-weight: 700; margin-bottom: 9px;
  color: var(--text);
}

.card ul li::before { color: var(--primary); }

/* 区块标题：竖条从 4px×16px 收成 3px×14px，更像临床文档小标题 */
.section { margin: 20px 0 10px; }

.section .bar { width: 3px; height: 14px; border-radius: 2px; }

.section h2 { font-size: 16px; font-weight: 700; letter-spacing: .1px; }

.sec-t {
  font-size: 16px; font-weight: 700; color: var(--text-faint);
  letter-spacing: 1.2px; margin: 18px 0 8px 2px;
}

/* ---------------------------------------------------------------------
   7. 按钮：去字距、加高度、主按钮实心墨绿
   --------------------------------------------------------------------- */
.btn {
  border-radius: 12px; padding: 14px;
  font-size: 16px; font-weight: 700; letter-spacing: 0;
  transition: transform .15s, box-shadow .15s, background .15s;
}

.btn-primary {
  background: var(--primary);
  box-shadow: 0 6px 16px -10px rgba(46, 43, 38, .4);
}

.btn-primary:active { background: var(--primary-deep); transform: scale(.99); }

.btn-primary:disabled {
  background: #D9D3C9; color: #F7F4EF;
  box-shadow: none;
}

.btn-accent {
  background: var(--accent);
  box-shadow: 0 6px 16px -10px rgba(46, 43, 38, .4);
}

.btn-ghost {
  background: var(--card); color: var(--text-sub);
  border: 1px solid var(--line);
}

.btn-ghost:active { background: var(--bg-alt); }

.btn-sm { padding: 11px; font-size: 16px; }

.btn-xs {
  border-radius: 8px; border: 1px solid var(--line);
  background: var(--card); color: var(--text-sub);
  font-weight: 600;
}

.btn-xs.primary { background: var(--primary); border-color: var(--primary); }

.btn-xs.accent { background: var(--accent); border-color: var(--accent); }

/* ---------------------------------------------------------------------
   8. 首页功能入口：主入口实心墨绿，其余白底细边
   ---------------------------------------------------------------------
   unslop（2026-11-05 用户确认）：2026-10-18 的「3D 立体块」（跨色渐变 +
   5px 实心厚边 + rotateX 俯仰 + perspective）整体收敛为平面卡 ——
     · 主入口 = 纯色墨绿 + 白字，靠色块本身做主次，不靠伪 3D；
     · 其余三块 = 白底细边 + 常规轻阴影；
     · 按下反馈保留：轻微 scale + 阴影收紧，手感仍在。
   立体块的旧参数（--tiltX/--lift/--sc、perspective、5px 厚边）全部退役，
   ⚠️ 别再往回加 —— 回加就会同时破坏 accentbar/按钮已收敛好的色面口径。
   --------------------------------------------------------------------- */
.entry-grid { perspective: none; }

.entry {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: 15px 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: var(--card);
  box-shadow: var(--shadow);
  transition: transform .15s, box-shadow .15s, border-color .15s;
}

/* 2026-10-18 第十轮的 3D 对称说明已随立体块一起退役（unslop 2026-11-05）。 */

@media (hover: hover) {
  .entry:hover { border-color: var(--primary); }
}

/* 按下：轻微下压 + 阴影收紧（保留手感，去掉伪 3D 厚度压缩） */
.entry:active {
  transform: scale(.985);
  border-color: var(--primary);
  box-shadow: 0 2px 8px -6px rgba(46, 43, 38, .45);
  transition-duration: .06s;
}

/* 主入口（实心墨绿）：用 --primary-deep 而不是 --primary ——
   白字小字（.e-s 13px）在 #6B8E7F 上只有 3.6:1，深一档才过 4.5:1（unslop 对比度规则） */
.entry.primary {
  background: var(--primary-deep);
  border-color: var(--primary-deep);
  box-shadow: var(--shadow);
}

.entry.primary:active {
  transform: scale(.985);
  box-shadow: 0 2px 8px -6px rgba(46, 43, 38, .45);
}

/* 主次拉开（2026-10-18 用户口径）：功能名要「跳出来」，释义要「退回去」。
   v1 是 14 / 11.5 两级只差 2.5px，扫一眼分不出主次。现在 16 / 10.5 差 5.5px，
   再叠一层字重（700 → 800）与色阶（正文色 → 弱化色）。
   ⚠️ 居中后 margin-top: 6px 原为「图标下方留白」（v1 有 .e-ico），现无图标，
   留着会把整块文字压偏下 → 归零，靠 justify-content 居中。 */
/* 2026-10-20 用户口径：四个模块主字体**先用 20px，当天又要求改回 16px** ——
   现在就是 16px，别再往上加。居中显式写死（.entry 本身已是 center），
   免得以后有人给 .entry 加左对齐时把标题带走。
   想看更大的字，走「大字体模式」（顶栏 A⁺），不要动这里。 */
.entry .e-t {
  /* 2026-11-03 用户口径：主字体放大 16 → 18（四字标题，卡片宽度装得下） */
  font-size: 18px; font-weight: 800; letter-spacing: .3px;
  line-height: 1.35; width: 100%; text-align: center;
}

/* R1 字号整改（2026-11-01）：释义小字属「次要类」—— 卡片里的图注，不是正文句子。
   按白名单口径取 13px（次要下限），不再往 16 抬：卡片文本宽只有 ≈129px，
   16px 一行只放得下 6 个汉字，四条会全部折成两行、四块高度不齐。
   想看更大的字走「大字体模式」（顶栏 A⁺），不要动这里。 */
.entry .e-s {
  font-size: 13px; line-height: 1.5; color: var(--text-faint);
  margin-top: 5px; letter-spacing: .1px;
}

.entry.primary .e-s { opacity: .82; }

/* 首块小字比其余长（10 字），13px 在 360 屏会折行（可用宽 ≈129px，10 汉字 ≈130px）。
   这块按用户 2026-10-31 定的「单行预算」压到 12px（= 全站 12px 硬底线，不再往下），
   并去掉字距 → 单行；其余三块仍 13px。
   🔴 别为了「统一字号」把这行删掉 —— 删了就折行；要统一就改文案（≤9 字）。 */
.entry.primary .e-s { font-size: 13px; letter-spacing: 0; }

/* ---------------------------------------------------------------------
   9. 表单：浅底输入框 + 聚焦光环（比 v1 的纯白 + 边框切换更清楚）
   --------------------------------------------------------------------- */
.field label { font-size: 16px; font-weight: 650; color: var(--text); margin-bottom: 6px; }

.field .hint { font-size: 16px; color: var(--text-faint); }

.field input,
.field textarea,
.field select {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 13px;
  font-size: 16px;
  transition: border-color .16s, background .16s, box-shadow .16s;
}

.field input:focus,
.field textarea:focus,
.field select:focus {
  background: var(--card);
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(107, 142, 127, .16);
}

.field input::placeholder,
.field textarea::placeholder { color: var(--text-faint); }

/* 原生勾选/单选统一成主色，省掉自绘控件 */
input[type="checkbox"],
input[type="radio"],
input[type="range"] { accent-color: var(--primary); }

/* ---------------------------------------------------------------------
   10. 分段切换（登录/注册、后台标签）
   --------------------------------------------------------------------- */
.seg {
  background: var(--bg-alt);
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: 3px;
  gap: 3px;
}

.seg button {
  border-radius: 8px; font-size: 16px; font-weight: 600;
  color: var(--text-sub);
}

.seg button.on {
  background: var(--card);
  color: var(--primary-deep);
  box-shadow: 0 1px 2px rgba(46, 43, 38, .06);
}

/* ---------------------------------------------------------------------
   11. 标签 chip
   --------------------------------------------------------------------- */
.chip {
  background: var(--bg-alt); color: var(--text-sub);
  border-radius: 6px; padding: 3px 8px;
  font-weight: 600;
}

.chip.green { background: var(--primary-soft); color: var(--primary-deep); }

.chip.orange { background: var(--accent-soft); color: var(--accent-deep); }

.chip.pick {
  border: 1px solid var(--line); background: var(--card);
  border-radius: 999px; padding: 7px 12px; font-size: 13px;
  color: var(--text-sub); font-weight: 500;
}

.chip.pick.on {
  background: var(--primary-soft);
  border-color: var(--primary);
  color: var(--primary-deep);
  font-weight: 700;
}

/* ---------------------------------------------------------------------
   12. 提示块：左侧 3px 色条取代整圈边框
   ⚠️ 这里的 .info/.warn/.danger 三个变体必须**连同 border 一起重写**。
      app.css 里 `.alert.danger { border: 1px solid … }` 特异度（0,2,0）高于
      裸 `.alert`（0,1,0），只写 `.alert { border: none }` 压不住它 ——
      结果是三种提示块长得不一样。
   --------------------------------------------------------------------- */
.alert {
  border-radius: 10px;
  padding: 12px 14px;
  border: none;
  border-left: 3px solid var(--accent);
  background: var(--accent-soft);
  color: var(--accent-deep);
  font-size: 16px;
}

.alert.info,
.alert.warn,
.alert.danger {
  border: none;
  border-left: 3px solid var(--accent);
}

.alert.info { background: var(--primary-soft); color: var(--primary-deep); border-left-color: var(--primary); }

.alert.warn { background: var(--warn-soft); color: var(--warn-text); border-left-color: var(--accent); }

.alert.danger { background: var(--danger-soft); color: var(--danger); border-left-color: var(--danger); }

.alert strong { font-size: 16px; letter-spacing: .2px; }

/* ---------------------------------------------------------------------
   13. 结果页：结论卡
   --------------------------------------------------------------------- */
/* unslop（2026-11-05 遗留建议执行）：跨色渐变收纯色 —— 深绿底白字本来就是「时刻」卡，
   纯色更稳；主色用 --primary-deep（白字小字对比达标），阴影换中性 */
.verdict {
  background: var(--primary-deep);
  border-radius: var(--r-lg);
  padding: 24px 18px;
  box-shadow: var(--shadow-lg);
}

/* 2026-10-31 用户报障：「为您推荐的方案」里其他颜色的字看不清。
   这里是**深绿渐变底 + 白字**，原来靠 opacity 弱化（.lab .8 / .pct .92），
   12.5px 的小字再降到 8 成不透明，手机上对比度就不够了。
   深色底上的弱化应该靠字号与字重，不靠压低透明度 —— 两者都提到 13px，
   .lab 升到 .92 仍保留层级差、.pct 直接不压。 */
.verdict .lab { font-size: 16px; letter-spacing: 0; opacity: .92; }

.verdict .who {
  font-family: var(--sans);
  font-size: 24px; font-weight: 700; letter-spacing: .5px;
}

.verdict .pct { font-size: 16px; opacity: 1; }

/* 危险档纯色：#A8503F（原渐变最深一档）—— #C46A5A 上白字小字只有 3.8:1，深一档过 4.5:1 */
.verdict.danger {
  background: #A8503F;
  box-shadow: var(--shadow-lg);
}

/* ---------------------------------------------------------------------
   14. 表格（方案执行表）：表头改浅灰底，行分隔更轻
   --------------------------------------------------------------------- */
.tbl-wrap { border-radius: var(--r-md); }

table.tbl th {
  background: var(--bg-alt);
  color: var(--text-sub);
  font-size: 13px;
  letter-spacing: .3px;
  padding: 9px 10px;
  border-bottom: 1px solid var(--line);
}

table.tbl td { border-bottom: 1px solid var(--line-soft); padding: 10px; }

table.tbl tr:nth-child(even) td { background: #FBF9F5; }

table.tbl tr:last-child td { background: transparent; }

/* 档案页「完整时间线」折叠后的内边距（2026-10-18 第四轮）
   .tl 自带 26px 左缩进（留给竖线），套进 .acc .body 会变成双重缩进，
   这里压到 18px；最后一条不再留 margin-bottom，免得折叠块底部空一块。 */
.acc .body.tl-fold { padding-top: 2px; }

.acc .body.tl-fold .tl { padding-left: 18px; }

.acc .body.tl-fold .tl-item:last-child { margin-bottom: 0; }

/* ---------------------------------------------------------------------
   15. 信息行 / 时间线 / 方案分段
   --------------------------------------------------------------------- */
.info-row { border-bottom: 1px solid var(--line-soft); padding: 11px 0; font-size: 16px; }

.info-row .k { color: var(--text-sub); }

.info-row .v { color: var(--text); font-weight: 600; }

.tl::before { width: 1px; background: var(--line); }

.plan-sec { border-left: 2px solid var(--accent); border-radius: 0; padding-left: 12px; }

.plan-sec-title { font-family: var(--sans); font-size: 16px; font-weight: 700; }

.plan-sec-step { color: var(--accent); font-weight: 700; }

.point-item { border-bottom: 1px solid var(--line-soft); }

.rank-row .track { height: 6px; background: var(--bg-alt); }

.rank-row .nm { font-size: 16px; }

.rank-row .pc { font-weight: 700; }

/* ---------------------------------------------------------------------
   16. 首页横幅 / 提醒卡 / 找回卡
   --------------------------------------------------------------------- */
/* 横幅回到 v1 的「铜金浅底 + 暖色描边」（v2 曾做成青底） */
.notice-bar {
  background: var(--accent-soft);
  border-bottom: 1px solid #F0E1D2;
}

.notice-bar .nb-text {
  font-family: var(--sans);
  font-size: 16px;
  color: var(--accent-deep);
  font-weight: 500;
}

/* ---------------------------------------------------------------------
   10-b. 倡导横幅：文字滚动播放（2026-10-18 第九轮用户口径）
   ---------------------------------------------------------------------
   结构：`.nb-marquee`（裁切窗口）> `.nb-track`（轨道）> **两份** `.nb-text`。
   为什么要两份：只有 `translateX(-50%)` 才能**无缝**，一份滚完第二份刚好顶上来，
   否则每圈结尾都会「闪一下空档」。第二份带 aria-hidden，读屏不会念两遍。
   间距用每个 `.nb-text` 的 padding-right、**不用** track 的 gap：
   这样轨道总宽正好是 `2 ×（文案 + 间距）`，-50% 恰好等于「一份 + 间距」，长期不漂移。
   速度：文案 27 字 ≈ 338px，11s 走完 ≈ 394px ≈ 36px/s —— 比人眼扫读稍快一点，不催。
   ⚠️ 全局 `prefers-reduced-motion` 会把时长压到 .01ms（等于停在终点）：对动效敏感的用户
      该看到静止的文案，这是有意为之，别为它开特例。
   ⚠️ 条幅整体被小开关隐藏时（display:none）动画自动停，不必额外处理。
   --------------------------------------------------------------------- */
.notice-bar .nb-marquee {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  position: relative;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 14px, #000 calc(100% - 14px), transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 14px, #000 calc(100% - 14px), transparent 100%);
}

.notice-bar .nb-track {
  display: inline-flex;
  white-space: nowrap;
  animation: nb-scroll 11s linear infinite;
}

.notice-bar .nb-track .nb-text {
  flex: none;
  padding-right: 56px;
}

@keyframes nb-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* 2026-10-18 第二轮：条幅右上角 ✕ 已删（改由「提醒与横幅」里的小开关控制显隐），
   原来的 `.nb-close` 覆盖规则一并去掉，免得以后有人照着它把按钮加回来。 */

.remind-card { border-left: 3px solid var(--accent); }

.remind-card .rc-time { background: var(--accent-soft); color: var(--accent-deep); }

/* 找回流卡（首页内联样式在 v2 副本里已改成主色，这里兜一层圆角与阴影） */
.live-card {
  border-radius: var(--r-lg);
  box-shadow: 0 18px 36px -26px rgba(79, 110, 96, .95);
}

/* ---------------------------------------------------------------------
   17. 时段 / 拍照格 / 空态 / 免责声明
   --------------------------------------------------------------------- */
.slot {
  border: 1px solid var(--line);
  border-radius: 10px;
  font-weight: 600;
}

.slot.on { background: var(--primary); border-color: var(--primary); }

.slot:disabled { background: var(--bg); border-color: var(--line-soft); }

.shot { border: 1px dashed #DDD3C4; border-radius: var(--r-md); }

.shot:active { border-color: var(--primary); background: var(--primary-soft); }

.shot.filled { border-style: solid; border-color: var(--primary); }

.empty { color: var(--text-faint); }

.empty .big { opacity: .3; }

.disclaimer {
  background: var(--bg-alt);
  border-radius: 10px;
  color: var(--text-faint);
  font-size: 13px;
}

/* ---------------------------------------------------------------------
   18. 细节：选中色、滚动条、动效收敛
   --------------------------------------------------------------------- */
::selection { background: rgba(107, 142, 127, .22); }

/* ---------------------------------------------------------------------
   19. 单行开关（2026-10-18 第二轮 · 艾灸服务页「首页倡导横幅」）
   ---------------------------------------------------------------------
   app.css 里没有任何「开关」控件，`.rp-switch` 只是 16px 原生 checkbox + 文字。
   这里给一个独立的小拨动开关：**不改 app.css**，只在本覆盖层里新增类名，
   主系统不引用 theme-v2.css，因此不受影响（合并时随覆盖层一起搬走）。
   结构固定为 `<label class="mini-sw"><input type="checkbox"><i></i></label>`，
   input 视觉隐藏但仍可点击（label 包裹）、仍接收键盘焦点。
   --------------------------------------------------------------------- */
.sw-card { padding: 13px 15px; }

.sw-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 24px;
}

.sw-row .sw-label {
  font-family: var(--sans);
  font-size: 16px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: .2px;
}

.mini-sw {
  position: relative;
  flex: none;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.mini-sw input {
  position: absolute;
  opacity: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  cursor: pointer;
}

.mini-sw i {
  position: relative;
  display: block;
  width: 40px;
  height: 23px;
  border-radius: 12px;
  background: #DCD5C9;
  transition: background .2s;
}

.mini-sw i::after {
  content: '';
  position: absolute;
  top: 2.5px;
  left: 2.5px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(46, 43, 38, .22);
  transition: transform .2s;
}

.mini-sw input:checked + i { background: var(--primary); }

.mini-sw input:checked + i::after { transform: translateX(17px); }

.mini-sw input:focus-visible + i { box-shadow: 0 0 0 3px rgba(107, 142, 127, .3); }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}


/* =====================================================================
   大字体模式（2026-10-20 用户要求）
   ---------------------------------------------------------------------
   用法：顶栏的「A⁺」按钮切换，状态存 localStorage（moxa.bigfont.v1）。
         <html class="bigfont"> 时整页按 1.16 倍缩放。

   为什么用 zoom 而不是逐条调字号：
     · 本项目 30+ 个页面各自写了 px 字号，还有不少页面在 <style> 里另写一套；
       逐条改既改不全，也会把标准模式的排版搞乱。
     · zoom 缩放的是**整块版面**：字号、间距、按钮、图片一起放大，页面自己重排，
       等于「一次就把所有用户能看到的页面都适配了」，不用逐页跟进。
   ⚠️ zoom 作用在 body 上（不是 html）：<html> 上缩放会把 100vh 之类的计算也放大，
      出现「底栏被顶出屏幕」这类问题；作用在 body 上，固定定位元素仍贴着视口。
   ⚠️ 改动这里要连带确认：顶栏（.nav）与底部导航（.tabbar）在放大后仍是一行放得下。
      —— .nav 已按 need 收窄内边距；.tabbar 的文字是 10.5px，放大后约 12px，够用。
   ⚠️ 老 Firefox（<126）不认 zoom，会保持标准字号 —— 可读性略差但不会错版，
      这正是选它的原因（不支持的浏览器退化成「什么都不做」而不是破版）。
   ===================================================================== */
html.bigfont { overflow-x: hidden; }
/* 2026-10-31 工单 T4：1.16 → 1.25。正文已抬到 16px，再叠 1.16 对老花眼仍不够；
   1.25 时 16px 实际约 20px，接近适老化阅读下限。 */
html.bigfont body { zoom: 1.25; }

/* 放大后顶栏三颗胶囊仍嫌小 → 只对这三颗单独再抬一档，避免挤压布局 */
html.bigfont .nav .nav-family,
html.bigfont .nav .nav-logout,
html.bigfont .nav .nav-big { padding-top: 4px; padding-bottom: 4px; }

/* 2026-11-02 顶栏一屏修复（大字体档）：
   zoom 1.25 后 .nav 的**布局宽只剩 312px**（390 ÷ 1.25），而里面还要放
   logo + 名字胶囊 + A⁺ + 家人 + 退出 —— 实测差 6px、整页又能横拉。
   这里只收两处不伤可读性的：间距与左右内边距（都是空白，不是字）。
   ⚠️ 别再靠缩字号来腾地方。 */
html.bigfont .nav { gap: 5px; padding-left: 12px; padding-right: 12px; }
html.bigfont .nav .who { padding: 4px 8px; }


/* =====================================================================
   字号抬到 16px 后的版面适配（2026-11-01）
   ---------------------------------------------------------------------
   背景：工单 T4 / R1 把正文统一到 16px，但有一批容器是照 13~14px 画的
   —— 写死 `width: 68px`、`flex: 1` 三等分。字一变大，5 个字就折成
   「灸哪 / 里」、标题被挤成竖排、按钮文字拆成两行。
   原则：**字号不动，改容器**。宁可容器按内容撑开，也不把字缩回去
   （用户本来就是嫌字小才提的）。
   逐条都是实测出来的（见 09-验收/2026-11-01-版面体检）：
   ===================================================================== */

/* ① 结果页窄标签列：「① 灸哪里」5 字要 76px，原写死 68px → 折成两行 */
.qa-k { width: auto !important; min-width: 5.2em; white-space: nowrap; }
.dz-fk { width: auto !important; min-width: 4.4em; white-space: nowrap; }

/* ② 4 档选项（主症变化）：「无明显变化」5 字要 80px，4 等分每格只有 78px。
      改成按内容撑开 + 等分剩余宽度；5 档那排（两字）同样受益且不会变形。
      ⚠️ 2026-11-02：单写 max-content 会让两字档（「加重」）缩到 37px ——
         文字宽度决定一切，等于没有点击面积下限。用 max() 同时守住 40。 */
.sopts .sopt { flex: 1 1 auto; min-width: max(40px, max-content); white-space: nowrap; }

/* ③ 流程步骤条：3 等分各 115px，「① 本周期开始时」8 字要 128px。
      它是导航指示不是正文，按「次要 13px」这一层走，并禁止折行。 */
.steps .stp { font-size: 13px; white-space: nowrap; }

/* ④ 结果页周期表：「正面2穴·40分钟」9 字在 118px 列里被 word-break 拆开。
      数据表按「表格数据 13px」这一层走，并只在词间断行。 */
table.tbl.course-tbl td.c-plan { font-size: 13px; word-break: normal; overflow-wrap: anywhere; }