:root{
  /* === 中性色阶 11 阶（design/53 清爽专业教育风）===
     明度必须递增不可倒挂：页面 n-200 → 卡片 n-0 → 卡内块 n-50 */
  --n-0:#ffffff;      /* 卡片 / 浮层 / 弹窗 / 输入框 */
  --n-50:#fafbfc;     /* 卡内次级区块、表头 */
  --n-100:#f5f6f8;    /* hover 浅底、禁用底、侧栏 hover */
  --n-200:#f2f3f5;    /* 页面背景（原 #f5f5f7，压深一档与白卡拉开层次） */
  --n-300:#e6e8eb;    /* 常规分割线、卡片边框 */
  --n-400:#d4d7dc;    /* 强调描边、输入框默认边框 */
  --n-500:#a8adb5;    /* 占位文字、次要图标 */
  --n-600:#71767e;    /* 次级文字、说明文字 */
  --n-700:#4a4f57;    /* 正文次级 */
  --n-800:#24272c;    /* 主文字（非纯黑，降低长时间阅读疲劳） */
  --n-900:#14161a;    /* 标题、核心数据强调 */
  /* === 中性层语义映射：全部引用新阶，禁硬编码 === */
  --bg:var(--n-200);
  /* 10/1 UI v2（她定稿示意稿）：光晕恢复极淡 teal（9/26 曾去 teal 染色，本次按新示意稿覆盖） */
  --bg-accent:rgba(58,154,147,.06);   /* 右上 teal 光晕：极淡，只做氛围不抢内容 */
  --surface:var(--n-0);
  --surface-2:var(--n-50);
  --ink:var(--n-800);
  --muted:var(--n-600);
  --line:var(--n-300);
  --ink-2:var(--n-700);
  --neutral:var(--n-400);
  --accent:var(--primary);
  --ink-sub:var(--muted);
  /* === 品牌 teal 十阶（品牌锚点 500 = #3a9a93）===
     使用规则：默认 500 / hover 600 / 按下 700（严格三级）
     渐变一律 400→500（仅小面积）；白底 teal 文字必须用 900（AA ≥4.5:1） */
  --primary-50:#eef7f6;
  --primary-100:#d3ebe8;
  --primary-200:#a8d7d2;
  --primary-300:#7ccac2;
  --primary-400:#56b3ab;
  --primary-500:#3a9a93;
  --primary-600:#2f867f;
  --primary-700:#2c7873;
  --primary-800:#235e5a;
  --primary-900:#1a4542;
  /* 既有变量名映射到新阶（向后兼容，全站 13 页不破） */
  --primary:var(--primary-500);          /* 品牌锚点：teal 保留 */
  --primary-d:var(--primary-700);
  --primary-bright:var(--primary-400);
  --primary-soft:var(--primary-100);     /* 原 rgba(58,154,147,.10) → 实色更稳 */
  --primary-soft-2:var(--primary-50);
  --primary-text:var(--primary-900);     /* 原 #1f6f69 加深，提对比度 */
  /* === 辅助色（低饱和；仅用于「数据与状态」，不用于导航激活 / 主按钮） === */
  --aux-slate-100:#eef2f6;  --aux-slate-400:#8fa9c4;  --aux-slate-500:#6b8caf;  --aux-slate-700:#4a6b8a;
  --aux-clay-100:#f7f0e8;   --aux-clay-400:#dcb78d;   --aux-clay-500:#c89b6a;   --aux-clay-700:#8a6238;
  /* === 身份色（模块区分用） === */
  --med:#46a883;
  --med-soft:rgba(16,185,129,.12);
  --vocab:#007aff;              /* 单词/词汇：blue */
  --vocab-soft:rgba(0,122,255,.10);
  --vocab-text:#0a5bbf;
  --corpus:#5856d6;             /* 语料：indigo（新增） */
  --corpus-soft:rgba(88,86,214,.10);
  --corpus-text:#2e2c8f;
  --speak:#ff2d55;              /* 口语：pink（新增） */
  --speak-soft:rgba(255,45,85,.10);
  --speak-text:#c2003b;
  --timer:#af52de;              /* 计时：purple（新增） */
  --timer-soft:rgba(175,82,222,.10);
  --timer-text:#6f1fa3;
  --warn:#ff9500;               /* 写作：orange（升级） */
  --warn-ink:#a35c00;           /* orange 在白底文字用深一档，保证 AA */
  --warn-soft:rgba(255,149,0,.12);
  --mock:#32ade6;               /* 模考：cyan（升级） */
  --mock-soft:rgba(50,173,230,.12);
  --mock-text:#0a6e96;
  --danger:#d97877;
  --danger-soft:#fde6e4;
  --danger-text:#a14542;
  --arrow-hover:rgba(58,154,147,.08);
  /* === 阴影三档：纯黑低透明，比原 teal 阴影更轻 === */
  /* 两段式轻投影：1px 贴边 + 8px 扩散 → 卡片自然"浮"起又不厚重 */
  --shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px -4px rgba(16,24,40,.06);
  --shadow-md:0 10px 30px rgba(0,0,0,.07);
  --shadow-lg:0 20px 52px rgba(0,0,0,.10);
  --shadow-card-hover:0 2px 4px rgba(16,24,40,.05),0 12px 28px -4px rgba(16,24,40,.10);
  --radius:16px;
  --radius-lg:22px;
  --radius-sm:12px;
  --on-primary:#ffffff;          /* 主色/语义色实底上的反白文字 */
  --on-primary-soft:rgba(255,255,255,.7); /* 主色底上的次级反白（如 fav 星标未选中） */
  /* === P0 反馈语义色：统一 Tailwind 硬编码绿/红 → iOS 系统色 === */
  --ok:       #34c759;              /* 正确/成功：green */
  --ok-bg:    rgba(52,199,89,.12);  /* 正确淡背景 */
  --ok-soft:  rgba(52,199,89,.12);
  --ok-text:  #1d7a3a;              /* 正确文字（白底可读，AA） */
  --err:      #e0342c;              /* 错误/危险：red */
  --err-bg:   rgba(224,52,44,.10);  /* 错误淡背景 */
  --err-soft: rgba(224,52,44,.10);
  --err-text: #a31f18;              /* 错误文字（白底可读，AA） */
  /* === 趣味性反馈（design/54 新增）：连击/XP 复用既有 --warn 橙，不引入新色相 === */
  --streak:      var(--warn);       /* 连击高亮 */
  --streak-bg:   var(--warn-soft);  /* 连击淡背景 */
  --streak-text: var(--warn-ink);   /* 连击文字（AA） */
  --xp:          var(--warn);       /* XP 与连击同源，避免调色盘感 */
  --xp-bg:       var(--warn-soft);
  --xp-text:     var(--warn-ink);
}
[data-theme="dark"]{
  /* 中性阶反向：深色下「背景最深 → 卡片次深」，层次靠明度差 + 加重阴影建立 */
  --n-0:#1a1a1c;
  --n-50:#262629;
  --n-100:#2e2e32;
  --n-200:#0e0e10;
  --n-300:#2e2e32;
  --n-400:#3a3a3c;
  --n-500:#6e6e73;
  --n-600:#9a9aa0;
  --n-700:#c7c7cc;
  --n-800:#f2f2f4;
  --n-900:#f7f7f9;
  --bg:#0e0e10;
  --bg-accent:rgba(255,255,255,.02);
  --surface:#1a1a1c;
  --surface-2:#262629;
  --ink:#f2f2f4;
  --muted:#9a9aa0;
  --line:#2e2e32;
  --ink-2:#aeaeb2;
  --neutral:#3a3a3c;
  /* teal 用 400 档提亮；浅底改半透明 teal，避免深色下出现亮白块 */
  --primary-50:rgba(92,179,171,.14);
  --primary-100:rgba(92,179,171,.22);
  --primary-500:#5cb3ab;
  --primary-700:#7ccac2;
  --primary:#5cb3ab;
  --primary-d:#3f8e87;
  --primary-bright:#7ccac2;
  --primary-soft:rgba(92,179,171,.16);
  --primary-soft-2:rgba(92,179,171,.10);
  --primary-text:#7ccac2;
  --arrow-hover:rgba(92,179,171,.14);
  --med:#46a883;
  --med-soft:rgba(16,185,129,.16);
  --vocab:#0a84ff;
  --vocab-soft:rgba(10,132,255,.18);
  --vocab-text:#5aa6ff;
  --corpus:#7d7aff;
  --corpus-soft:rgba(125,122,255,.16);
  --corpus-text:#b0aeff;
  --speak:#ff6488;
  --speak-soft:rgba(255,100,136,.16);
  --speak-text:#ff9bb0;
  --timer:#c07cf0;
  --timer-soft:rgba(192,124,240,.16);
  --timer-text:#d9a8f5;
  --warn:#ff9500;
  --warn-ink:#e0a85c;
  --warn-soft:rgba(255,149,0,.16);
  --mock:#32ade6;
  --mock-soft:rgba(50,173,230,.18);
  --mock-text:#5cc8f0;
  --danger:#d97877;
  --danger-soft:#3a2626;
  --danger-text:#e7a3a2;
  --shadow:0 1px 2px rgba(0,0,0,.30),0 8px 24px rgba(0,0,0,.24);
  --shadow-md:0 8px 24px rgba(0,0,0,.35);
  --shadow-lg:0 18px 48px rgba(0,0,0,.45);
  --shadow-card-hover:0 2px 4px rgba(0,0,0,.34),0 12px 28px -4px rgba(0,0,0,.30);
  /* === P0 反馈语义色（深色） === */
  --ok:       #34c759;
  --ok-bg:    rgba(52,199,89,.16);
  --ok-soft:  rgba(52,199,89,.16);
  --ok-text:  #5fd98a;
  --err:      #ff453a;
  --err-bg:   rgba(255,69,58,.16);
  --err-soft: rgba(255,69,58,.16);
  --err-text: #ff7a72;
  /* === 趣味性反馈（design/54）：同上，经 var() 别名自动适配暗色 === */
  --streak:      var(--warn);
  --streak-bg:   var(--warn-soft);
  --streak-text: var(--warn-ink);
  --xp:          var(--warn);
  --xp-bg:       var(--warn-soft);
  --xp-text:     var(--warn-ink);
}
/* 全局强制 hidden 生效：防止 display:flex/grid/block 的类覆盖 UA 的 [hidden] 样式 */
[hidden]{display:none !important}
*{box-sizing:border-box}
/* 滚动条槽常驻：切换 tab / 跳页面时内容高度变化不再触发垂直滚动条出现↔消失，避免整页宽度抖动（听写 tab 切换时页面变宽、右上角标签位移） */
html{scrollbar-gutter:stable;}
@supports not (scrollbar-gutter:stable){ html{overflow-y:scroll;} }
body{
  margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  background:var(--bg);
  background-image:radial-gradient(1100px 560px at 100% -8%, var(--bg-accent), transparent 60%);
  background-attachment:fixed;
  color:var(--ink);font-size:15px;line-height:1.62;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}

/* ===== 侧边栏母导航 ===== */
.top-nav{position:fixed;top:0;left:0;bottom:0;width:256px;background:rgba(255,255,255,.78);
  -webkit-backdrop-filter:saturate(180%) blur(24px);backdrop-filter:saturate(180%) blur(24px);
  border-right:1px solid var(--line);z-index:50;display:flex;flex-direction:column;padding:10px 14px;gap:3px;overflow-y:auto;scrollbar-gutter:stable;box-shadow:0 1px 2px rgba(16,24,40,.04);transition:transform .25s, box-shadow .15s;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
[data-theme="dark"] .top-nav{background:rgba(26,26,28,.72)}
.top-nav::-webkit-scrollbar{width:8px}
.top-nav::-webkit-scrollbar-thumb{background:var(--line);border-radius:8px}
.side-head{display:flex;justify-content:flex-start;align-items:center;gap:8px;padding:6px 12px 8px;border-bottom:1px solid var(--line);margin-bottom:2px}
.side-head img{width:40px;height:40px;flex:none}
.side-brand-mark{
  width:40px;height:40px;flex:none;
  border-radius:11px;
  background:linear-gradient(135deg,#56b3ab 0%,#2c7873 100%);
  color:var(--on-primary);
  display:inline-flex;align-items:center;justify-content:center;
  font-size:19px;font-weight:800;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Arial,sans-serif;
  line-height:1;letter-spacing:-.02em;
  box-shadow:0 6px 14px rgba(58,154,147,.32),inset 0 1px 0 rgba(255,255,255,.18);
}
/* 10/3 头像选择：侧栏用户头像（品牌 mark 右侧，点它跳设置页换头像）。
   ⚠️ .side-collapse-in 自带 margin-left:auto，所以这里**不能**也加 margin-left:auto，否则两个被推走。
   头像紧跟在品牌名右侧（margin-left:10px），.side-collapse-in 的 margin-left:auto 仍把收起按钮推到最右。 */
.side-me{flex:none;width:30px;height:30px;border-radius:9px;overflow:hidden;margin-left:10px;
  border:1.5px solid var(--line);background:var(--primary-50);display:block;transition:border-color .15s,transform .12s}
.side-me:hover{border-color:var(--primary);transform:translateY(-1px)}
.side-me img{width:100%;height:100%;object-fit:cover;display:block}
.side-brand{display:flex;flex-direction:column;line-height:1.1;min-width:0}
.side-brand .bn{font-size:15px;font-weight:800;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-brand .bs{font-size:10.5px;font-weight:700;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin-top:3px}
.nav-logo{font-size:24px;filter:drop-shadow(0 2px 6px rgba(58,154,147,.28))}
.side-today{font-size:12.5px;color:var(--muted);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:10px 12px;line-height:1.55}
.side-today b{color:var(--ink);font-weight:700}
.side-today.done{border-color:var(--warn);background:rgba(217,154,78,.12);color:var(--ink);font-weight:600}




.side-g-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-group-title:hover,.side-fav .side-group-title:hover{background:var(--surface-2);color:var(--ink)}
/* 展开状态：柔和渐变浅底 + 轻阴影 + 主题色文字 */
.side-group:not(.collapsed) .side-group-title,.side-fav:not(.collapsed) .side-group-title{
  color:var(--primary);
  background:linear-gradient(135deg, var(--primary-soft) 0%, var(--primary-soft-2) 100%);
  box-shadow:0 1px 3px rgba(15,23,42,0.04);
  margin-bottom:0;
  border-radius:10px;
}
/* 收起状态：淡化 */
.side-group.collapsed .side-group-title,.side-fav.collapsed .side-group-title{opacity:.5}

/* 折叠箭头：≥40×40 可点热区 + 精致外观 */
.side-toggle-arrow{margin-left:auto;flex:none;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;cursor:pointer;color:var(--muted);position:relative;background:transparent;transition:background .18s ease,color .18s ease,transform .25s cubic-bezier(.34,1.56,.64,1);-webkit-tap-highlight-color:transparent}
.side-toggle-arrow:hover{background:var(--arrow-hover);color:var(--primary)}
.side-toggle-arrow:active{transform:scale(.9)}
.side-toggle-arrow:focus-visible{outline:none;box-shadow:0 0 0 3px var(--primary-soft)}
.side-toggle-arrow .chev{width:16px;height:16px;display:block;transition:transform .34s cubic-bezier(.4,0,.2,1)}
.side-group.collapsed .side-toggle-arrow .chev,
.side-fav.collapsed .side-toggle-arrow .chev{transform:rotate(-90deg)}


.side-group:not(.collapsed) .side-group-body,.side-fav:not(.collapsed) .side-group-body{background:var(--primary-soft-2);border-radius:0 0 10px 10px;margin:0 0 6px;padding:4px 6px 6px}

.side-group.collapsed .side-group-body,
.side-fav.collapsed .side-group-body{grid-template-rows:0fr}
.side-group.collapsed .side-group-inner,
.side-fav.collapsed .side-group-inner{opacity:0;visibility:hidden;transform:translateY(-8px)}

.side-item{display:flex;align-items:center;gap:10px;padding:10px 14px;margin:1px 0;border-radius:12px;color:var(--n-700);text-decoration:none;font-size:15px;transition:background .18s,color .18s,opacity .2s ease}
/* 高亮态即时生效：避免“绿色块滑动/跳一下”的观感（点击即落在正确项，不做位置/背景过渡动画） */
.side-item.active{transition:background 0s,color 0s}
.side-group.collapsed .side-item,.side-fav.collapsed .side-item{opacity:0}
.side-item:hover{background:var(--n-100);color:var(--n-800)}
/* teal 只做点睛：浅底 + 左侧 3px 指示条，替换原整条实色渐变块 */
.side-item.active{background:var(--primary-50);color:var(--primary-700);box-shadow:inset 3px 0 0 var(--primary-500);font-weight:600}
.side-item.active:hover{color:var(--primary-700)}
.side-item .nav-icon{width:22px;height:22px;flex:none;display:inline-flex;align-items:center;justify-content:center;color:var(--muted)}
.side-item .nav-icon svg{width:21px;height:21px;display:block}
.side-item.active .nav-icon{color:var(--primary-500)}
.side-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-star{background:none;border:none;cursor:pointer;color:var(--muted);font-size:16px;padding:0 4px;flex:none;line-height:1;transition:color .15s,transform .15s;user-select:none;-webkit-user-select:none}
.side-star:hover{color:var(--danger);transform:scale(1.2)}
.side-star.is-fav{color:var(--danger)}
.side-item.active .side-star{color:rgba(255,255,255,.7)}
.side-item.active .side-star.is-fav{color:var(--on-primary-soft)}

/* 收起/展开：侧栏内顶部按钮（展开时可见）+ 收起后左上角浮动按钮（仅收起时可见） */
.side-collapse-in{margin-left:auto;background:none;border:1px solid var(--line);border-radius:8px;color:var(--muted);cursor:pointer;font-size:14px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;flex:none;line-height:1;transition:.15s}
.side-collapse-in:hover{border-color:var(--primary);color:var(--primary);background:var(--surface-2)}
.side-collapse{position:fixed;top:16px;left:18px;width:40px;height:40px;border-radius:12px;background:var(--primary);color:var(--on-primary);border:none;cursor:pointer;display:none;align-items:center;justify-content:center;font-size:18px;z-index:70;box-shadow:var(--shadow-md);transition:background .15s,transform .15s}
.side-collapse:hover{background:var(--primary-d);transform:scale(1.05)}

/* 侧边栏搜索框与标题、导航视觉统一（与 side-item 12px 圆角/内边距对齐，收紧留白） */
.top-nav .ui-search{width:100%;max-width:none}
/* design/83：升级为 id 特异性——全站表单重置 `input:not():not()` (0,2,1) 曾压过 (0,2,0) 的
   .top-nav .ui-search-input，把左内边距 44px 打回 14px，放大镜图标(left:12px+宽18px=30px)盖住文字 */
#mainNav .ui-search-input{height:36px;padding:0 34px 0 40px;border-radius:12px;font-size:14px;background:var(--surface-2)}   /* 左40=图标占30px+10px间隙；右34=给原生清除×留位 */
.top-nav .ui-search-input:focus,.top-nav .ui-search-input:hover{box-shadow:0 0 0 4px var(--primary-soft)}
#mainNav .ui-search-icon{left:12px;width:18px;height:18px}

/* design/83：查词卡动作（键盘高亮 / 喇叭 / 操作行）——明暗主题一律走 CSS 变量，禁硬编码颜色 */
.ss-item.ss-active{background:var(--primary-soft)}
.sc-speak{flex:none;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border:none;background:transparent;color:var(--primary);padding:2px 4px;border-radius:6px;cursor:pointer;transition:background .15s}
.sc-speak:hover{background:var(--primary-soft)}
.sc-speak svg{width:16px;height:16px}
.sc-speak.playing{color:var(--primary-d)}
.ss-card .sc-head{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.sc-actions{margin-top:8px;display:flex;gap:8px;flex-wrap:wrap}
.ss-item.sc-link{width:auto;padding:4px 10px;font-size:12.5px;border:1px solid var(--line);border-radius:8px}

/* ===== 移动端「更多」弹层（底部导航由全站 dock 接管；旧 tabbar 组件已于 2026-09-08 删除） =====
   14:15 她报「点更多按钮弹不出来、很卡顿」。探针实测（tests/_diag_more.cjs）：功能完全正常
   —— 能弹、7 个条目、transform 到位、点遮罩能关、切组耗时仅 32ms。真实原因是**视觉上分不出来**：
   遮罩只有 .35 黑、弹层背景 var(--surface) 与页面底色太接近，加上 284px 高的面板里 7 个两列项
   排得整整齐齐，看上去「像是原本就长在那儿」。修法（功能一行未动）：
   ① 遮罩加深并加轻微模糊，弹出瞬间世界「沉下去」 ② 弹层顶部加 teal 拖拽条 + 描边强化边界
   ③ 阴影加强。四处全在 CSS，JS 零改动。 */
.sheet-backdrop{display:none;position:fixed;inset:0;background:rgba(15,23,42,.5);
  backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);
  z-index:60;opacity:0;transition:opacity .24s}
body.sheet-open .sheet-backdrop{display:block;opacity:1}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:61;transform:translateY(100%);
  background:var(--surface);border-radius:18px 18px 0 0;
  border:1px solid var(--line);border-bottom:none;
  box-shadow:0 -14px 48px rgba(15,23,42,.32);
  padding:0 14px calc(14px + env(safe-area-inset-bottom));
  transition:transform .28s cubic-bezier(.34,1.3,.64,1);
  max-height:78vh;overflow-y:auto;-webkit-overflow-scrolling:touch}
body.sheet-open .sheet{transform:translateY(0)}
/* 拖拽条：让「这是一层浮上来的面板」有明确视觉锚点 */
.sheet::before{content:'';display:block;width:40px;height:4px;border-radius:999px;
  background:var(--primary);opacity:.5;margin:9px auto 1px}
.sheet-head{display:flex;align-items:center;justify-content:space-between;padding:12px 4px 10px;border-bottom:1px solid var(--line);margin-bottom:6px}
.sheet-head span{font-size:15px;font-weight:800;color:var(--ink)}
.sheet-close{background:none;border:none;color:var(--muted);font-size:18px;cursor:pointer;width:36px;height:36px;border-radius:10px}
.sheet-close:hover{background:var(--surface-2)}
.sheet-list{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.sheet-item{display:flex;align-items:center;gap:10px;padding:12px 12px;border-radius:12px;color:var(--ink);text-decoration:none;font-size:15px;background:none}
.sheet-item:hover{background:var(--surface-2)}
.sheet-item.active{background:var(--primary-soft);color:var(--primary);font-weight:600}
.sheet-item .nav-icon{width:22px;height:22px;flex:none;display:inline-flex;align-items:center;justify-content:center;color:var(--muted)}
.sheet-item.active .nav-icon{color:var(--primary)}
.sheet-item .nav-icon svg{width:21px;height:21px;display:block}

/* 桌面：内容右移（外加镜像 padding-right:32px，使左右缓冲对称） */
@media(min-width:861px){
  body{padding-left:288px;padding-right:32px;transition:padding .25s}
  body.side-collapsed{padding-left:0;padding-right:0}
  body.side-collapsed .top-nav{transform:translateX(-100%)}
  body.side-collapsed .side-collapse{display:flex}
}
/* ── 全局基础：容器/卡片/页题（9/15 从移动端媒体块之后上移到此——原位置同特异性覆盖了
   手机分支的 padding/字号，导致手机左右空隙一直偏大；上移后 @media 内的值才真正生效） ── */
.container{max-width:1160px;margin:0 auto;padding:28px 14px 48px}   /* 10/1：顶部 40→28（她：页面大标题整删后整体再上移一点点）；左右 24→14、max-width 1080→1160（9/15 二修） */
.page-title{margin:0 0 4px;font-size:25px;font-weight:800;letter-spacing:-.02em}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:24px;margin-bottom:24px;box-shadow:var(--shadow);transition:box-shadow .2s ease,transform .2s ease,border-color .2s ease}
.card:hover{box-shadow:var(--shadow-card-hover);border-color:var(--primary-200);transform:translateY(-2px)}
.card h2{margin:0 0 14px;font-size:18px;font-weight:800;letter-spacing:-.02em}
.card h3{margin:0 0 10px;font-size:14.5px;color:var(--muted);font-weight:600}

/* 移动端：抽屉式 */
.side-toggle{display:none}
.side-backdrop{display:none}
.side-collapse{display:none}
@media(max-width:860px){
  .side-collapse-in{display:none}
  .top-nav{transform:translateX(-100%);transition:transform .25s;box-shadow:none;width:200px}
  /* 旧 ☰ 抽屉彻底停用（改用底部 Tab 栏） */
  .side-toggle{display:none!important}
  .side-backdrop{display:none!important}
  /* 内容区底部留白，避免被底部 dock 遮挡（旧 tabbar 已删，净空由 body.has-dock 规则接管） */
  .container{padding:20px 12px calc(96px + env(safe-area-inset-bottom))}   /* 9/15：左右 16→12（之之：缩小两边空隙减少浪费） */
  .card{padding:18px 14px;margin-bottom:16px}
  .page-title{font-size:22px;margin-bottom:6px}

  .hero{padding:0}
  /* 触控优化：保证可点击区域 ≥ 44px（移动端通用触控标准） */
  .btn{min-height:44px}
  .sp-tabs button, .write-tabs button {padding:12px 0}
  .tab-btn{padding:12px 8px}
  .chip{padding:9px 14px}
  .pf-btns button{padding:11px}
}

@media(max-width:560px){
  .container{padding:18px 12px}   /* 10/3：左右 10→12（她拍板：不要那么满、整体美观；实测卡片 x=12 w=366）；与 860 断点的 12px 对齐，全站手机端边距统一 */
  .card{padding:16px 13px;margin-bottom:14px}
  .grid{grid-template-columns:1fr}
  .stat-grid{grid-template-columns:1fr 1fr}
  .side-item{padding:13px 14px}
}


/* 9/15：手机端 .container/.card/.page-title 基础规则已上移到媒体块之前（原位置在其后，
   同特异性按源顺序覆盖了手机分支 padding——手机左右空隙偏大的根因），此处仅留注释占位。 */

/* ===== 计划页简化（2026-08-28） ===== */
.plan-textarea{min-height:88px}
.plan-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;flex-wrap:wrap}
.plan-actions-right{display:flex;gap:8px;flex:none}
.muted{color:var(--muted);font-size:13px}
.empty{color:var(--muted);padding:20px 0;text-align:center}

.word-status{font-size:13px;margin-top:10px;min-height:18px;line-height:1.5}
.word-status.ok{color:var(--primary)}
.word-status.warn{color:var(--warn-ink)}
.word-status.err{color:var(--danger)}
.word-status.loading{color:var(--muted)}
[data-theme="dark"] .word-status.warn{color:var(--warn-ink)}

/* 长难句拆解 */
.quote{border-left:4px solid var(--primary);background:var(--bg);padding:10px 14px;border-radius:0 8px 8px 0;margin:10px 0;color:var(--muted);font-style:italic;line-height:1.6;white-space:pre-wrap}
.rs-sec{margin-top:18px}
.rs-sec h3{margin:0 0 8px;font-size:16px;color:var(--primary);border-bottom:1px solid var(--line);padding-bottom:6px}
.rs-sec p{margin:6px 0;line-height:1.7}
.rs-list{margin:6px 0;padding-left:22px}
.rs-list li{margin:5px 0;line-height:1.65}
.rs-list li b{color:var(--ink);font-weight:700}
[data-theme="dark"] .rs-list li b{color:#fff}

/* buttons —— 按设计系统文档站 2026-10-03 组件规范升级：height 固定 44px、gap 7px、字号 14.5px、过渡 .18s ease、tight 3.5px 聚焦环 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0 20px;height:44px;line-height:1;border-radius:var(--radius-sm);cursor:pointer;font-size:14.5px;font-weight:600;font-family:inherit;text-decoration:none;transition:background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .12s ease}
.btn:hover{border-color:var(--primary);color:var(--primary)}
.btn:focus-visible{outline:none;box-shadow:0 0 0 3.5px var(--primary-soft);border-color:var(--primary)}
.btn-primary{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}
.btn-primary:hover{background:var(--primary-600);color:var(--on-primary);box-shadow:0 6px 16px rgba(58,154,147,.28)}
.btn-primary:active{background:var(--primary-700)}
/* 全站按钮统一过渡 + 点击回弹（质感 + 微交互） */
.btn:active{transform:translateY(0) scale(.97)}
/* 计时"进行中"徽标：柔和呼吸光晕，安静提示正在计时 */
@keyframes breathe{0%,100%{box-shadow:0 0 0 0 var(--primary-soft)}50%{box-shadow:0 0 0 7px rgba(58,154,147,0)}}
.running-badge{animation:breathe 2.6s ease-in-out infinite}

/* 主操作按钮 hover 扫光 + 按钮水波纹：原 Uiverse 参考类 .ui-slide-btn / .ui-ripple-btn 已于 10/2 随死样式清理删除（全站零引用），
   其视觉效果按 design/53 也不再保留，此处仅留说明，勿再找这两个类 */
.btn-primary{position:relative;overflow:hidden}
/* design/53：删除 .btn-primary 扫光与 .btn 水波纹（属"复杂特效"，与克制定性冲突）
   改用色阶 + 1px 位移 + 阴影过渡表达交互 */
.btn{position:relative;overflow:hidden}

/* 方案1 · 侧边栏全局计时徽标（任何页面常驻：正在计时呼吸提示 + 一键结束，解决 P1/P3） */
.side-timer-wrap{margin:0 0 4px}
/* design/53：teal 只做点睛 —— 计时徽标由实色渐变块改浅底 + teal 文字 + 左侧 3px 指示条
   （原实色块会与首页主按钮争夺"屏上唯一 teal 实色"的视觉焦点） */
.side-timer{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:12px;cursor:pointer;background:var(--primary-50);color:var(--primary-700);font-size:13.5px;font-weight:700;box-shadow:inset 3px 0 0 var(--primary-500)}
.side-timer:hover{transform:translateY(-1px)}
.side-timer.paused{background:var(--n-100);color:var(--n-600);box-shadow:inset 3px 0 0 var(--n-400)}
.side-timer[hidden]{display:none}
.side-timer .st-ico{flex:none}
.side-timer .st-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-timer .st-live{font-variant-numeric:tabular-nums;opacity:.95}
.side-timer .st-stop{background:rgba(255,255,255,.18);border:none;color:var(--on-primary);border-radius:8px;padding:3px 9px;font-size:12px;cursor:pointer;flex:none}
.side-timer .st-stop:hover{background:rgba(255,255,255,.3)}
.side-timer.running-badge{animation:breathe 2.6s ease-in-out infinite}
/* 设计系统文档站 2026-10-03：按钮四变体（primary/secondary/ghost/danger）+ success + 尺寸 sm/lg + block + disabled */
.btn-secondary{background:var(--surface);color:var(--primary-text);border-color:var(--primary-200)}
.btn-secondary:hover{background:var(--primary-soft-2);border-color:var(--primary-300)}
.btn-secondary:active{background:var(--primary-soft)}
.btn-success{background:var(--ok);color:#fff;border-color:var(--ok)}
.btn-success:hover{background:var(--ok-text);border-color:var(--ok-text)}
.btn-danger{background:var(--danger);color:var(--on-primary);border-color:var(--danger)}
.btn-danger:hover{background:var(--err-text);border-color:var(--err-text)}
.btn-ghost{background:transparent}
.btn-ghost:hover{background:var(--n-100);color:var(--n-900)}
.btn-sm{height:34px;font-size:13px;padding:0 14px;border-radius:9px;gap:6px}
.btn-lg{height:52px;font-size:16px;padding:0 28px;border-radius:14px;gap:8px}
.btn-block{width:100%}
.btn[disabled],.btn.is-disabled{background:var(--n-100);color:var(--n-500);border-color:var(--line);cursor:not-allowed;box-shadow:none;transform:none;opacity:.85}
/* 站内特有变体（非设计系统四变体，但要保留）：计时/服药/紧急操作色 */
.btn-med{background:var(--med);color:var(--on-primary);border-color:var(--med)}
.btn-med:hover{background:var(--med-ink);border-color:var(--med-ink)}
.btn-warn{background:var(--warn);color:var(--on-primary);border-color:var(--warn)}
.btn-warn:hover{background:var(--warn-ink);border-color:var(--warn-ink)}

/* forms —— 按设计系统文档站 2026-10-03：height 44px tight、3.5px primary-soft-2 聚焦环 */
/* 注意：以下全局 input/select/textarea 规则不作用于 checkbox/radio，避免它们被强制 width:100% 拉成巨型横条（2026-08-21 修复） */
input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{width:100%;padding:0 14px;height:44px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);font-family:inherit;font-size:14.5px;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
input:not([type=checkbox]):not([type=radio]):not([type=range]):focus,select:focus,textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3.5px var(--primary-soft);background:var(--surface)}
input:not([type=checkbox]):not([type=radio]):not([type=range]):hover,select:hover,textarea:hover{border-color:var(--n-500)}
input:not([type=checkbox]):not([type=radio]):not([type=range])::placeholder,textarea::placeholder{color:var(--n-500)}
input[type=checkbox],input[type=radio]{width:16px;height:16px;min-width:16px;flex:none;padding:0;border:0;background:transparent;cursor:pointer;accent-color:var(--primary);vertical-align:middle}
input[type=checkbox]:focus,input[type=radio]:focus{outline:none;box-shadow:0 0 0 3px var(--primary-soft);border-radius:3px}
/* 10/2 iOS 修复（她反馈手机端时间框比正常框「长出来一截」）：iOS Safari 对 date/time
   输入强制内建控件外观（appearance:menulist-button，自带最低高度且不吃外层 height），
   重置外观后与普通文本框同高同框；点击弹系统选择器的行为不受影响 */
input[type=date],input[type=time],input[type=datetime-local]{
  -webkit-appearance:none;
  appearance:none;
  min-height:0;
  -webkit-min-logical-height:0;
  line-height:normal;
}
textarea{height:auto;min-height:88px;padding:12px 14px;line-height:1.6;resize:vertical}
.form-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px;align-items:center}
.form-row > *{flex:1;min-width:140px}
.form-row > label{flex:0 0 auto;min-width:0}
label{display:block;font-size:13px;color:var(--muted);margin-bottom:4px}

/* ============================================================
   设计系统文档站 2026-10-03 —— 新增标准组件类（全站可引用，全用 var token）
   ============================================================ */

/* 徽标 / 药丸 —— 状态、计数、标签 */
.pill{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;padding:4px 11px;border-radius:999px;border:1px solid var(--line);background:var(--n-100);color:var(--ink-2);line-height:1;white-space:nowrap}
.pill-ok{background:var(--ok-bg);color:var(--ok-text);border-color:rgba(52,199,89,.3)}
.pill-err{background:var(--err-bg);color:var(--err-text);border-color:rgba(224,52,44,.28)}
.pill-warn{background:var(--warn-soft);color:var(--warn-ink);border-color:rgba(255,149,0,.3)}
.pill-info{background:var(--primary-soft-2);color:var(--primary-text);border-color:var(--primary-100)}

/* 区块标题 —— 设计站风格编号标题（01/02/03 + 标题 + 可选 desc） */
.sec-head{display:flex;align-items:baseline;gap:10px;margin:32px 0 8px}
.sec-head .sec-num{font-family:var(--mono);font-size:13px;color:var(--primary-600);font-weight:600}
.sec-head h2,.sec-head h3{margin:0;color:var(--n-900);letter-spacing:-.01em}
.sec-desc{font-size:13.5px;color:var(--muted);line-height:1.6;margin:0 0 16px}
.eyebrow{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--primary-600);margin-bottom:6px}

/* 模块卡 —— 统一 hover 动效，用于功能入口/诊断卡/推荐卡 */
.dcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;cursor:pointer;text-align:left;width:100%;display:block}
.dcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-card-hover);border-color:var(--primary-200)}
.dcard-ico{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;margin-bottom:13px}
.dcard h4{margin:0 0 7px;font-size:15.5px;font-weight:660;color:var(--n-900);letter-spacing:-.01em}
.dcard p{margin:0 0 14px;font-size:13.5px;line-height:1.6;color:var(--muted)}
.dcard-foot{display:flex;align-items:center;justify-content:space-between;font-size:12.5px;color:var(--primary-text);font-weight:600}
.dcard-foot span{color:var(--n-500);font-weight:500}

/* 表单容器 —— 统一 label + inp + hint/err 结构 */
.field{display:flex;flex-direction:column;gap:6px;min-width:236px}
.field label{font-size:12.5px;font-weight:600;color:var(--ink-2);margin-bottom:0}
.field .hint{font-size:11.5px;color:var(--muted)}
.field .err-msg{font-size:11.5px;color:var(--err-text);display:flex;align-items:center;gap:5px}

/* stat cards */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-bottom:18px}
.stat-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px 16px;text-align:center;box-shadow:var(--shadow);border-top:3px solid var(--accent);transition:transform .15s,box-shadow .15s}
.stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.stat-value{font-size:28px;font-weight:800;color:var(--accent);line-height:1;letter-spacing:-.02em}
.stat-label{font-size:12px;color:var(--muted);margin-top:8px}

/* bars */
.bar-row{margin:8px 0}
.bar-info{display:flex;justify-content:space-between;font-size:13px;margin-bottom:4px}
.bar-track{height:14px;background:var(--primary-50);border-radius:999px;overflow:hidden}
[data-theme="dark"] .bar-track{background:var(--surface-2)}
.bar-fill{height:100%;border-radius:999px;transition:width .6s cubic-bezier(.4,0,.2,1)}

/* lists */
.list-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px dashed var(--line)}
.list-item:first-child{border-top:none}
.list-actions{margin-left:auto;display:flex;gap:6px;flex:none}
.list-actions .btn-sm{padding:4px 10px;font-size:12px}

/* grid */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}

/* module cards */
.mod-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow);border-top:4px solid var(--primary)}
.mod-card.mock{border-top-color:var(--mock)}
/* ====== 练习模式卡片（重设计，作用域限定练习页 #modeSelect，避免影响计时/词库页复用 .mod-card） ====== */
#modeSelect .mod-card{
  display:flex;align-items:center;gap:16px;
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);padding:18px 20px;
  box-shadow:var(--shadow);
  border-left:4px solid var(--primary);
  border-top:none;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  text-align:left;
}
#modeSelect .mod-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
  border-color:var(--primary-soft);
}
#modeSelect .mod-card:active{ transform:translateY(0); }
@media (max-width:640px){
  #modeSelect .mod-card{ flex-direction:column; align-items:flex-start; }
  .word-drop-zone{ padding:24px 14px; }
}

/* timer live */
.live-timer{font-size:44px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.005em;line-height:1;color:var(--ink-2);margin:2px 0 18px;text-align:center}

/* practice */
.practice-card{text-align:center;padding:30px 20px}
.q-word{font-size:42px;font-weight:800;margin:10px 0}
.q-cn{font-size:22px;color:var(--muted);margin-bottom:20px}
.q-input{font-size:22px;padding:12px;border:2px solid var(--line);border-radius:10px;text-align:center;width:300px;max-width:90%}
.options{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:420px;margin:0 auto}
.opt{padding:14px;border:1px solid var(--line);background:var(--surface);border-radius:10px;cursor:pointer;font-size:15px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.opt:hover{border-color:var(--primary)}
.opt.correct{border-bottom:3px solid var(--med);color:var(--med)}
.opt.wrong{border-bottom:3px solid var(--danger);color:var(--danger)}
.pw-en{font-size:28px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.pw-ipa{font-size:15px;font-style:normal;color:var(--muted);font-family:serif}
.pw-cn{font-size:14px;color:var(--muted)}
/* 已掌握按钮（背词页顶部 word-stats 行，设置齿轮左侧）：绿色描边药丸（与全屏一致） */
.mastered-btn{padding:6px 14px;border-radius:999px;border:1.5px solid var(--med);background:rgba(70,168,131,.08);color:var(--med);font-size:13px;font-weight:700;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all .15s;white-space:nowrap}
.mastered-btn:hover{background:rgba(70,168,131,.16);border-color:#3aa86a;color:#2a8a54}
/* ── 爱听写风格：2×2 大方选项卡 ── */
.opts-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.opt-big{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:18px 16px;border:1.5px solid var(--line);border-radius:14px;background:var(--bg);cursor:pointer;font-size:15px;text-align:left;transition:all .15s ease;min-height:80px;overflow:hidden}
.opt-big:hover{border-color:var(--primary);background:var(--primary-soft)}
.opt-big:active{transform:scale(.97)}
.opt-big-tag{font-size:12px;color:var(--muted);font-weight:500}
.opt-big-cn{font-size:17px;font-weight:600;color:var(--ink);line-height:1.4}
.opt-big.correct{border-color:var(--med);background:var(--ok-bg)}
.opt-big.wrong{border-color:var(--danger);background:var(--err-bg)}
/* ── 单词学习：双按钮（认识/不认识 + 不确定）── */
.answer-btns{display:flex;gap:12px;margin-top:18px}
.abtn{flex:1;min-height:52px;padding:13px 16px;border-radius:14px;border:1.5px solid var(--line);
  font-size:16px;font-weight:700;cursor:pointer;transition:border-color .15s,background .15s,transform .1s,opacity .15s;
  background:var(--bg);color:var(--ink);display:flex;align-items:center;justify-content:center}
.abtn:active{transform:scale(.97)}
.abtn-unknown{border-color:var(--danger);color:var(--danger);background:var(--err-bg)}
.abtn:disabled{opacity:.4;cursor:not-allowed;background:var(--surface-2);color:var(--muted);border-color:var(--line)}
@media(max-height:760px){ .answer-btns{margin-top:12px} .abtn{min-height:46px;padding:10px 14px} }

/* ── 底部工具栏按钮 ── */
.tool-btn{width:52px;height:52px;border-radius:50%;font-size:24px;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--line);background:var(--bg);transition:all .15s}
.tool-btn:hover{border-color:var(--primary);background:var(--primary-soft)}
.tool-btn:active{transform:scale(.92)}
.tool-btn.muted{opacity:.35;pointer-events:none}

/* ===== 单词页：一屏无滚动布局（design/11，design/24 改最小高度防压扁） ===== */
#studyView.study-view-fit{
  display:flex;flex-direction:column;
  min-height:calc(100vh - 158px);   /* 最小高度，内容超出时整个页面滚动 */
}
@media(max-width:860px){
  #studyView.study-view-fit{ min-height:calc(100vh - 130px); }
}


.practice-card.practice-card-fit{
  display:flex;flex-direction:column;gap:6px;   /* 9/15 之之反馈：块间空隙收紧 8→6 */
  padding:18px 22px 16px;margin-bottom:0;
}

.word-stats{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:2px 0;margin:2px 0 4px;font-size:13px;color:var(--ink);flex:none}
.word-stats span{display:flex;align-items:center;gap:4px}
.word-stats .stat-progress{color:var(--primary);font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}
.word-stats b{color:var(--primary);font-size:15px;font-variant-numeric:tabular-nums}

/* ===== 背词练习页：精确照抄爱听写 v5 原型（居中题干 / 无例句 / 无题干词性 / 选项2x2） ===== */
#practiceBody.practice-body-fit{
  flex:1;min-height:0;
  display:flex;flex-direction:column;
  align-items:center;
  width:100%;
}
#practiceBody.practice-body-fit .last-word, #practiceBody.practice-body-fit .practice-topzone, #practiceBody.practice-body-fit .practice-word-area, #practiceBody.practice-body-fit .opts-grid, #practiceBody.practice-body-fit .answer-btns, #practiceBody.practice-body-fit .pw-speaker-wrap, #practiceBody.practice-body-fit .practice-tools-row { width:100%;max-width:960px; }

/* ── 上一词回顾 ── */
#practiceBody.practice-body-fit .last-word{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;
  font-size:13px;color:var(--muted);padding:2px 0;margin-bottom:4px;
}
/* 上一词回顾区：永远占位（空也留同样高的空位），避免第 1 个词 vs 第 2 个词题干整体下移跳动 */
#practiceBody.practice-body-fit .practice-topzone{ min-height:10px; }   /* 9/15 收紧：18→10（上一词回顾空占位） */
#practiceBody.practice-body-fit .lw-en{font-weight:700;color:var(--ink);font-size:15px}

/* ═══ 题干区：单词+音标+中文 全部居中，无例句、无词性（照抄 v5 原型） ═══ */
#practiceBody.practice-body-fit .practice-word-area{
  position:relative;text-align:center;
  padding:2px 4px 8px;margin-bottom:6px;   /* 9/15 收紧：4/8/6 → 2/8/6 */
  /* 9/15 之之：去掉题干区下方分隔线 */
  min-height:120px;   /* 锁死题干区高度：单词+音标+中文恒定占位，换词/答题不再跳动（9/9 随释义占位由 46→24 同步下调 160→120） */
}
#practiceBody.practice-body-fit .pw-en{
  font-size:38px;font-weight:800;letter-spacing:-.02em;line-height:1.25;color:var(--ink);
  white-space:nowrap;   /* 9/9：题干单词强制单行，超长由 practice.js fitWordOneLine() 自动缩字号 */
  min-height:48px;display:flex;align-items:center;justify-content:center;   /* 9/9：盒子高度恒定 48px，字号收缩时题干区不塌、换词不跳动 */
}
#practiceBody.practice-body-fit .pw-ipa{
  font-family:serif;font-style:normal;font-size:15px;color:var(--muted);margin-top:6px;min-height:19px;
}
/* 中文释义（答后才填充）：固定 min-height，答后不撑高 → 布局不跳动 */
#practiceBody.practice-body-fit .pw-cn{
  font-size:15px;color:var(--ink-2);margin-top:5px;min-height:24px;line-height:1.55;overflow:hidden;   /* 9/9：空占位 46→24（1 行），音标→选项的空隙从 84px 降到 46px */
}

/* ── 背词 ETA 剩余时间预估（9/21）：#wordStats 行内，仅答题态且样本足够时显示 ── */
.stat-eta{font-size:12px;color:var(--muted);margin-left:10px;white-space:nowrap}

/* ── 今日清零终结卡（9/21）：完成页统计区上方，todayDue=0 时显示；完成态配色复用 teal 变量 ── */
.finish-zero-card{
  display:flex;align-items:center;justify-content:center;gap:8px;
  margin:0 0 14px;padding:10px 16px;border-radius:12px;
  background:rgba(70,168,131,.1);color:var(--med);
  font-weight:700;font-size:15px;
}
.finish-zero-card svg{width:20px;height:20px;flex:none}
html[data-theme="dark"] .finish-zero-card{background:rgba(70,168,131,.16)}

/* ── 听音选义：音频题题干英文/音标 CSS 隐藏（DOM 原样保留），提示文案原位；判定揭示（.pw-reveal）后恢复 ── *//* 选择器不带 .practice-body-fit（非 fit 布局也要生效）；(1,2,0) 与上方 .pw-en 同级但源序在后 → 稳赢 */
.pw-audio-hint{display:none}
#practiceBody .pw-audio .pw-audio-hint{
  display:flex;align-items:center;justify-content:center;
  margin-top:6px;min-height:73px;   /* 补足被隐藏的 pw-en(48)+pw-ipa(19) 盒高，题干区恒高不塌 */
  font-size:15px;color:var(--muted);
}
#practiceBody .pw-audio .pw-en,
#practiceBody .pw-audio .pw-ipa{ display:none; }
#practiceBody .pw-audio.pw-reveal .pw-en{ display:flex; }
#practiceBody .pw-audio.pw-reveal .pw-ipa{ display:block; }
#practiceBody .pw-audio.pw-reveal .pw-audio-hint{ display:none; }

/* ═══ 选项网格（照抄 v5：第一行=词性，第二行=中文） ═══ */
#practiceBody.practice-body-fit .opts-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:14px;width:100%;
}
#practiceBody.practice-body-fit .opt-big{
  position:relative;height:88px;padding:14px 12px;   /* 9/15 收紧：左右 18→12 */
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
  gap:6px;border:1.5px solid var(--neutral);border-radius:10px;background:var(--surface);cursor:pointer;   /* 9/18 夜间适配：原硬编码 #fff 压过暗色 token → 选项卡白底+浅字洗白；浅色 --surface=#fff 零变化 */
  transition:all .15s ease;overflow:hidden;box-sizing:border-box;
}
#practiceBody.practice-body-fit .opt-big:hover{ border-color:var(--muted); }

/* 第一行：词性标签（"n." / "adj." 灰色小字）；固定 min-height+line-height 18px → 答后加英文不撑高不跳动 */
#practiceBody.practice-body-fit .opt-big-tag{
  font-size:13px;color:var(--muted);font-weight:500;flex:0 0 auto;line-height:18px;min-height:18px;
}
/* 第二行：中文释义 */
#practiceBody.practice-body-fit .opt-big-cn{
  font-size:15px;font-weight:600;color:var(--ink);line-height:1.4;   /* 9/15 收紧：17→15 */
}
/* 英文揭示区改用 tag 显示，这些元素隐藏 */
#practiceBody.practice-body-fit .opt-big-en{ display:none; }
/* ── 答题反馈（照抄 v5：对=绿框+tag英文，错=粉红框+tag英文；英文16px但行高不变→不跳动） ── */
#practiceBody.practice-body-fit .opt-big.correct{
  border-color:var(--ok);background:var(--ok-bg);
}
#practiceBody.practice-body-fit .opt-big.correct .opt-big-tag{
  color:var(--ok-text);font-weight:700;font-size:16px;line-height:18px;
}
#practiceBody.practice-body-fit .opt-big.wrong{
  border-color:var(--err);background:var(--err-bg);
}
#practiceBody.practice-body-fit .opt-big.wrong .opt-big-tag{
  color:var(--err-text);font-weight:700;font-size:16px;line-height:18px;
}

/* ── 不知道按钮（左侧文字按钮） ── */
#practiceBody.practice-body-fit .answer-btns{
  margin-top:12px;display:flex;justify-content:flex-start;   /* 9/9 收紧：20→12 */
}
#practiceBody.practice-body-fit .abtn-unknown{
  width:auto;height:40px;padding:0 22px;border:1.5px solid transparent;border-radius:8px;
  background:var(--primary-soft);color:var(--primary);font-size:14px;font-weight:600;cursor:pointer;   /* 9/16 之之：白底融进卡片看不出是按钮，加 teal 软底 */
  display:flex;align-items:center;justify-content:center;transition:all .15s;
}
#practiceBody.practice-body-fit .abtn-unknown:hover{
  border-color:var(--primary);color:var(--primary);background:var(--primary-soft);
}

/* 底部喇叭大圆按钮（严格还原 v5 原型：居中 48px 圆） */
#practiceBody.practice-body-fit .pw-speaker-wrap{
  margin-top:14px;padding-top:6px;   /* 9/15 之之：去掉喇叭区上方分隔线，padding 10→6 */
  display:flex;justify-content:center;
}
#practiceBody.practice-body-fit .pw-speaker-wrap .tool-btn{
  width:48px;height:48px;padding:0;border-radius:50%;
  border:1.5px solid var(--line);background:var(--surface);color:var(--muted);   /* 9/18 夜间适配：#fff→var(--surface)，浅色零变化 */
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  transition:all .15s;
}
#practiceBody.practice-body-fit .pw-speaker-wrap .tool-btn:hover{
  border-color:var(--primary);color:var(--primary);background:var(--primary-soft);
}
/* 底部 tools-row 在练习页隐藏（喇叭已移到 pw-speaker-wrap） */
#practiceBody.practice-body-fit ~ .practice-tools-row{ display:none !important; }

/* 底部工具栏（只有喇叭，无眼睛 / 无快捷键）——非练习页保留 */
.practice-tools-row{
  flex:none;
  display:flex;justify-content:center;align-items:center;gap:16px;
  padding-top:16px;border-top:1px solid var(--line);margin-top:24px;
}
.practice-tools-row .tool-btn{ margin:0; }

/* 小屏适度压缩（电脑为主，仅做下限保护） */
@media(max-height:760px){
  /* 9/9：与基准保持一致（原 10/14/150 比基准还松，导致矮窗口空隙反弹） */
  #practiceBody.practice-body-fit .practice-word-area{ padding:2px 4px 8px;min-height:120px; }
  #practiceBody.practice-body-fit .pw-en{ font-size:32px; }
  #practiceBody.practice-body-fit .opts-grid{ gap:12px; }
  #practiceBody.practice-body-fit .opt-big{ height:82px;padding:12px 12px; }
  #practiceBody.practice-body-fit .opt-big-cn{ font-size:15px; }
}

/* design/24：左上角上一题回顾 */
.last-word{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;
  margin-bottom:6px;font-size:13px;color:var(--muted)
}
.last-word .lw-en{font-weight:700;color:var(--ink);font-size:15px}
.last-word .lw-ipa{font-family:serif;color:var(--muted)}
.last-word .lw-cn{color:var(--muted)}


/* meds */
.meds-bar-wrap{margin-top:12px}
.meds-bar{height:24px;border-radius:8px;background:linear-gradient(90deg,var(--med),var(--warn));position:relative;overflow:hidden;transition:width .5s}
.meds-bar.low{background:linear-gradient(90deg,var(--warn),var(--danger))}
.meds-bar::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(45deg,rgba(255,255,255,.18),rgba(255,255,255,.18) 8px,transparent 8px,transparent 16px)}

/* history calendar */
.cal-heatmap{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;max-width:320px}
.cal-day{aspect-ratio:1;border-radius:6px;background:var(--line);font-size:11px;display:flex;align-items:center;justify-content:center;color:var(--muted)}
.cal-day.has{background:var(--primary);color:var(--on-primary)}
.cal-day.today{box-shadow:0 0 0 2px var(--warn)}

/* 学习轨迹 · 每日记录（美化卡片，照抄原型 v20260829-record） */
#dayList .day-card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:10px;
  padding:14px 18px;
  margin-bottom:10px;
  transition:border-color .15s;
}
#dayList .day-card:hover{ border-color:var(--primary-soft); }
#dayList .day-header{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:10px;
}
#dayList .day-date{
  font-size:14px;font-weight:600;color:var(--ink);letter-spacing:.3px;
}
#dayList .day-date .weekday{
  font-weight:400;color:var(--muted);font-size:12px;margin-left:6px;
}
#dayList .day-total{
  font-size:13px;font-weight:600;color:#fff;
  background:linear-gradient(135deg,var(--primary),var(--primary-d));
  padding:3px 12px;border-radius:20px;white-space:nowrap;
}
#dayList .day-chips{
  display:flex;flex-wrap:wrap;gap:6px;align-items:center;
}
#dayList .chip{
  display:inline-flex;align-items:center;gap:4px;
  font-size:12px;padding:4px 10px;border-radius:6px;
  background:var(--surface-2);color:var(--ink);font-weight:500;white-space:nowrap;line-height:1.4;
}
#dayList .chip .chip-name{ color:var(--muted); }
#dayList .chip .chip-val{ color:var(--ink);font-weight:600; }
#dayList .chip.chip-long{ background:var(--primary-soft); }
#dayList .chip.chip-long .chip-name{ color:var(--primary-d); }
#dayList .chip.chip-long .chip-val{ color:var(--primary);font-weight:700; }
#dayList .chip-focus{
  font-size:11px;color:var(--muted);padding:4px 10px;border-radius:6px;
  background:var(--surface-2);border:1px dashed var(--line);margin-left:2px;
}
#dayList .chip-focus b{ color:var(--primary); }

/* toast */
/* 10/9 批①：toast 是纯提示（common.js toast() 工厂创建，无任何按钮/点击交互），
   2.4s 存续期 fixed 定位在底部 24px 会挡住 dock 等底部点击（10/8 探针实抓）→ 不接收指针事件 */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--surface);padding:10px 18px;border-radius:10px;z-index:200;font-size:14px;box-shadow:var(--shadow);pointer-events:none}

/* ===== 通用提示条 alert（4 色：ok/err/warn/info），原生 CSS，走 token，自动适配明暗 ===== */
.alert{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:var(--radius-sm);border:1px solid var(--med);border-left-width:4px;background:var(--med-soft);color:var(--primary-d);font-size:14px;line-height:1.4;transition:transform .18s ease,box-shadow .18s ease}
.alert p{margin:0;font-weight:600}
.alert:hover{transform:scale(1.02);box-shadow:var(--shadow)}
/* ===== 设置页日/夜主题开关 theme-switch（Uiverse 改写：保留日/夜固有配色，接 data-theme 机制；toggle-size 24px 适配设置页行高） ===== */
.theme-switch{--toggle-size:24px;--container-width:5.625em;--container-height:2.5em;--container-radius:6.25em;--container-light-bg:#3D7EAE;--container-night-bg:#1D1F2C;--circle-container-diameter:3.375em;--sun-moon-diameter:2.125em;--sun-bg:#ECCA2F;--moon-bg:#C4C9D1;--spot-color:#959DB1;--circle-container-offset:calc((var(--circle-container-diameter) - var(--container-height)) / 2 * -1);--stars-color:#fff;--clouds-color:#F3FDFF;--back-clouds-color:#AACADF;--transition:.5s cubic-bezier(0,-0.02,.4,1.25);--circle-transition:.3s cubic-bezier(0,-0.02,.35,1.17)}
.theme-switch,.theme-switch *,.theme-switch *::before,.theme-switch *::after{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;font-size:var(--toggle-size)}
.theme-switch__container{width:var(--container-width);height:var(--container-height);background-color:var(--container-light-bg);border-radius:var(--container-radius);overflow:hidden;cursor:pointer;-webkit-box-shadow:0em -0.062em 0.062em rgba(0,0,0,.25),0em 0.062em 0.125em rgba(255,255,255,.94);box-shadow:0em -0.062em 0.062em rgba(0,0,0,.25),0em 0.062em 0.125em rgba(255,255,255,.94);-webkit-transition:var(--transition);-o-transition:var(--transition);transition:var(--transition);position:relative}
.theme-switch__container::before{content:"";position:absolute;z-index:1;inset:0;-webkit-box-shadow:0em 0.05em 0.187em rgba(0,0,0,.25) inset,0em 0.05em 0.187em rgba(0,0,0,.25) inset;box-shadow:0em 0.05em 0.187em rgba(0,0,0,.25) inset,0em 0.05em 0.187em rgba(0,0,0,.25) inset;border-radius:var(--container-radius)}
.theme-switch__checkbox{display:none}
.theme-switch__circle-container{width:var(--circle-container-diameter);height:var(--circle-container-diameter);background-color:rgba(255,255,255,.1);position:absolute;left:var(--circle-container-offset);top:var(--circle-container-offset);border-radius:var(--container-radius);-webkit-box-shadow:inset 0 0 0 3.375em rgba(255,255,255,.1),inset 0 0 0 3.375em rgba(255,255,255,.1),0 0 0 0.625em rgba(255,255,255,.1),0 0 0 1.25em rgba(255,255,255,.1);box-shadow:inset 0 0 0 3.375em rgba(255,255,255,.1),inset 0 0 0 3.375em rgba(255,255,255,.1),0 0 0 0.625em rgba(255,255,255,.1),0 0 0 1.25em rgba(255,255,255,.1);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-transition:var(--circle-transition);-o-transition:var(--circle-transition);transition:var(--circle-transition);pointer-events:none}
.theme-switch__sun-moon-container{pointer-events:auto;position:relative;z-index:2;width:var(--sun-moon-diameter);height:var(--sun-moon-diameter);margin:auto;border-radius:var(--container-radius);background-color:var(--sun-bg);-webkit-box-shadow:0.062em 0.062em 0.062em 0em rgba(254,255,239,.61) inset,0em -0.062em 0.062em 0em #a1872a inset;box-shadow:0.062em 0.062em 0.062em 0em rgba(254,255,239,.61) inset,0em -0.062em 0.062em 0em #a1872a inset;-webkit-filter:drop-shadow(0.062em 0.125em 0.125em rgba(0,0,0,.25)) drop-shadow(0em 0.062em 0.125em rgba(0,0,0,.25));filter:drop-shadow(0.062em 0.125em 0.125em rgba(0,0,0,.25)) drop-shadow(0em 0.062em 0.125em rgba(0,0,0,.25));overflow:hidden;-webkit-transition:var(--transition);-o-transition:var(--transition);transition:var(--transition)}
.theme-switch__moon{-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);width:100%;height:100%;background-color:var(--moon-bg);border-radius:inherit;-webkit-box-shadow:0.062em 0.062em 0.062em 0em rgba(254,255,239,.61) inset,0em -0.062em 0.062em 0em #969696 inset;box-shadow:0.062em 0.062em 0.062em 0em rgba(254,255,239,.61) inset,0em -0.062em 0.062em 0em #969696 inset;-webkit-transition:var(--transition);-o-transition:var(--transition);transition:var(--transition);position:relative}
.theme-switch__spot{position:absolute;top:.75em;left:.312em;width:.75em;height:.75em;border-radius:var(--container-radius);background-color:var(--spot-color);-webkit-box-shadow:0em 0.0312em 0.062em rgba(0,0,0,.25) inset;box-shadow:0em 0.0312em 0.062em rgba(0,0,0,.25) inset}
.theme-switch__spot:nth-of-type(2){width:.375em;height:.375em;top:.937em;left:1.375em}
.theme-switch__spot:nth-last-of-type(3){width:.25em;height:.25em;top:.312em;left:.812em}
.theme-switch__clouds{width:1.25em;height:1.25em;background-color:var(--clouds-color);border-radius:var(--container-radius);position:absolute;bottom:-.625em;left:.312em;-webkit-box-shadow:.937em .312em var(--clouds-color),-.312em -.312em var(--back-clouds-color),1.437em .375em var(--clouds-color),.5em -.125em var(--back-clouds-color),2.187em 0 var(--clouds-color),1.25em -.062em var(--back-clouds-color),2.937em .312em var(--clouds-color),2em -.312em var(--back-clouds-color),3.625em -.062em var(--clouds-color),2.625em 0em var(--back-clouds-color),4.5em -.312em var(--clouds-color),3.375em -.437em var(--back-clouds-color),4.625em -1.75em 0 .437em var(--clouds-color),4em -.625em var(--back-clouds-color),4.125em -2.125em 0 .437em var(--back-clouds-color);box-shadow:.937em .312em var(--clouds-color),-.312em -.312em var(--back-clouds-color),1.437em .375em var(--clouds-color),.5em -.125em var(--back-clouds-color),2.187em 0 var(--clouds-color),1.25em -.062em var(--back-clouds-color),2.937em .312em var(--clouds-color),2em -.312em var(--back-clouds-color),3.625em -.062em var(--clouds-color),2.625em 0em var(--back-clouds-color),4.5em -.312em var(--clouds-color),3.375em -.437em var(--back-clouds-color),4.625em -1.75em 0 .437em var(--clouds-color),4em -.625em var(--back-clouds-color),4.125em -2.125em 0 .437em var(--back-clouds-color);-webkit-transition:.5s cubic-bezier(0,-0.02,.4,1.25);-o-transition:.5s cubic-bezier(0,-0.02,.4,1.25);transition:.5s cubic-bezier(0,-0.02,.4,1.25)}
.theme-switch__stars-container{position:absolute;color:var(--stars-color);top:-100%;left:.312em;width:2.75em;height:auto;-webkit-transition:var(--transition);-o-transition:var(--transition);transition:var(--transition)}
.theme-switch__checkbox:checked + .theme-switch__container{background-color:var(--container-night-bg)}
.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__circle-container{left:calc(100% - var(--circle-container-offset) - var(--circle-container-diameter))}
.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__circle-container:hover{left:calc(100% - var(--circle-container-offset) - var(--circle-container-diameter) - .187em)}
.theme-switch__circle-container:hover{left:calc(var(--circle-container-offset) + .187em)}
.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__moon{-webkit-transform:translate(0);-ms-transform:translate(0);transform:translate(0)}
.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__clouds{bottom:-4.062em}
.theme-switch__checkbox:checked + .theme-switch__container .theme-switch__stars-container{top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}

/* 主题开关小尺寸变体：设置页紧凑排列用 */
/* 10/1 晚：设置页开关整体缩小（她拍板太大）——--sm 仅设置页使用，可放心缩 */
.theme-switch.theme-switch--sm{--toggle-size:12px;--container-width:4.1em;--container-height:1.9em;--circle-container-diameter:2.6em;--sun-moon-diameter:1.6em}

/* 设置页紧凑选项行：主题开关 + 复选框并排，标签紧贴控件 */
.settings-option{display:flex;align-items:center;gap:10px;flex:0 0 auto;min-width:0;white-space:nowrap;font-size:14px;color:var(--ink)}
.settings-option-label{display:block;font-size:13px;color:var(--muted);margin:0;line-height:1.3}
.settings-option-check{display:flex;align-items:center;gap:8px;cursor:pointer}
.settings-option-check input[type=checkbox]{margin:0}
@media (max-width:640px){
  .settings-options{gap:12px !important}
  .settings-option{flex:1 1 100%;white-space:normal;min-height:36px}
}

/* ===== 统一子 Tab：右上角药丸切换（全局） ===== */
.page-head-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.page-head-row .page-title{margin:0;font-size:22px;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
.pill-tabs{display:inline-flex;gap:4px;background:var(--primary-soft);border:1px solid rgba(58,154,147,.18);border-radius:999px;padding:4px;align-items:center;box-shadow:inset 0 1px 2px rgba(58,154,147,.06)}
.pill-tab{display:inline-flex;align-items:center;gap:7px;border:none;background:transparent;color:var(--muted);padding:10px 22px;font-size:14px;font-weight:600;border-radius:999px;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);white-space:nowrap;line-height:1;font-family:inherit}
.pill-tab svg{width:16px;height:16px;flex-shrink:0}
.pill-tab:hover:not(.active){color:var(--ink);background:rgba(58,154,147,.12)}
.pill-tab.active{background:var(--primary);color:var(--on-primary);box-shadow:0 4px 12px rgba(58,154,147,.32)}
.pill-tab:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(58,154,147,.25)}

/* ===== 词库 B：紧凑列表 ===== */
.wl-import{display:flex;align-items:stretch;gap:10px;margin-bottom:14px}
.wl-import.drag-over{border-color:var(--primary);background:var(--primary-soft)}
.wl-import-hint{flex:1;width:100%;min-height:46px;padding:12px 14px;border:1.5px dashed var(--line);border-radius:10px;font:inherit;font-size:14px;line-height:1.5;background:var(--surface);color:var(--ink);resize:vertical;outline:none;transition:border-color .15s}
.wl-import-hint:focus{border-color:var(--primary)}
.wl-search-wrap{margin-bottom:10px}
.wl-search{width:100%;padding:11px 14px;border:1px solid var(--line);border-radius:10px;font:inherit;font-size:14px;background:var(--surface);color:var(--ink);outline:none;transition:border-color .15s,box-shadow .15s}
.wl-search:focus{border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-soft)}
.wl-filter-chips{display:flex;gap:6px;flex-wrap:wrap}
.wl-filter-chips .chip{padding:5px 11px;border-radius:20px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:12.5px;cursor:pointer;transition:all .12s;line-height:1.4}
.wl-filter-chips .chip:hover{border-color:var(--primary);color:var(--primary)}
.wl-filter-chips .chip.active{background:var(--primary);border-color:var(--primary);color:#fff}
.wl-list{list-style:none;display:flex;flex-direction:column;padding:0;margin:0}
.wl-item{display:flex;align-items:flex-start;gap:12px;padding:11px 0;border-radius:10px;transition:background .12s,border-color .12s;border:1px solid transparent}
.wl-item:hover{background:var(--bg);border-color:var(--line);padding-left:10px;padding-right:10px;margin-left:-10px;margin-right:-10px}
.wl-word{font-size:16px;font-weight:700;color:var(--ink);min-width:90px;width:22%;max-width:170px;flex:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.5}
.wl-senses{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;flex:1;min-width:0;padding-top:1px}
.wl-sense{display:inline-flex;align-items:baseline;gap:5px;max-width:100%}
.wl-sense-pos{font-size:13px;font-weight:600;color:var(--vocab);white-space:nowrap;flex:none;font-family:var(--mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace)}
.wl-sense-cn{font-size:14px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.wl-lv{font-size:12px;font-weight:700;color:var(--primary);background:var(--primary-soft);padding:2px 8px;border-radius:6px;flex:none;margin-top:2px}
/* 视觉尺寸 28px 不变，用伪元素把触摸热区撑到 44px（iOS/Android 建议值），不影响列表排版 */
.wl-del{position:relative;width:28px;height:28px;border-radius:7px;border:1.5px solid var(--danger);background:var(--surface);color:var(--danger);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:.12s;flex:none;margin-top:1px}
.wl-del::after{content:'';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:44px;height:44px}
.wl-del:hover{background:var(--danger);color:#fff}
/* 词库分组折叠 + 勾选练习（9/17）：新类名，无层叠冲突 */
.wl-group{border-bottom:1px solid var(--line)}
.wl-group:last-child{border-bottom:none}
.wl-group-head{display:flex;align-items:center;gap:8px;width:100%;padding:10px 6px;background:none;border:none;border-radius:8px;cursor:pointer;font:inherit;text-align:left;transition:background .12s}
.wl-group-head:hover{background:var(--bg)}
.wl-caret{width:14px;height:14px;color:var(--muted);flex:none;transition:transform .15s}
.wl-group.open .wl-caret{transform:rotate(90deg)}
.wl-group-name{font-size:14px;font-weight:700;color:var(--ink)}
.wl-group-count{font-size:12px;font-weight:600;color:var(--muted);background:var(--bg);padding:1px 8px;border-radius:10px}
.wl-group-body{padding:0 2px 6px 20px}
.wl-group-list{list-style:none;display:flex;flex-direction:column;padding:0;margin:0}
.wl-more{display:block;margin:8px auto 2px;padding:6px 18px;border-radius:18px;border:1px solid var(--line);background:var(--surface);color:var(--muted);font:inherit;font-size:12.5px;cursor:pointer;transition:border-color .12s,color .12s}
.wl-more:hover{border-color:var(--primary);color:var(--primary)}
.wl-check{width:16px;height:16px;accent-color:var(--primary);flex:none;margin-top:3px;cursor:pointer}
.wl-err{font-size:11.5px;font-weight:700;color:var(--danger);border:1px solid var(--danger);border-radius:6px;padding:1px 7px;flex:none;margin-top:2px;white-space:nowrap}
.wl-action-bar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:9px 12px;border:1px solid var(--primary);background:var(--primary-soft);border-radius:10px;margin-bottom:10px}
.wl-action-hint{font-size:13px;color:var(--ink)}
.wl-action-hint b{color:var(--primary)}
/* 大分类折叠按钮（9/17 定稿：三个大分类，默认全收起，点哪个展开哪个） */
.wl-cats-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.wl-cat-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:20px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:border-color .12s,color .12s,background .12s}
.wl-cat-btn:hover{border-color:var(--primary);color:var(--primary)}
.wl-cat-btn.open{border-color:var(--primary);color:var(--primary);background:var(--primary-soft)}
.wl-cat-btn.filtered{border-color:var(--primary);color:#fff;background:var(--primary)}
.wl-cat-val{font-size:12px;font-weight:600;color:var(--primary)}
.wl-cat-btn.filtered .wl-cat-val{color:#fff}
.wl-cat-caret{width:13px;height:13px;flex:none;transition:transform .15s}
.wl-cat-btn.open .wl-cat-caret{transform:rotate(180deg)}
.wl-cat-panel{margin:-2px 0 10px}

/* dashboard hero */
.hero{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
@media(max-width:680px){.hero{grid-template-columns:1fr}}

/* plans */
.plan-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.plan-item{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px dashed var(--line)}
.plan-item:first-child{border-top:none}
.plan-item input[type=checkbox]{width:18px;height:18px;flex:none;accent-color:var(--primary);cursor:pointer}
.plan-text{flex:1;font-size:14px;word-break:break-word;cursor:pointer;border-radius:var(--radius-sm);padding:2px 4px;margin:-2px -4px;transition:background .15s,color .15s}
.plan-text:hover{color:var(--primary);background:var(--primary-soft)}
.plan-item.done .plan-text{text-decoration:line-through;color:var(--muted)}
.plan-item.done .plan-text:hover{color:var(--primary)}
.plan-edit,.plan-del{background:none;border:none;cursor:pointer;font-size:16px;flex:none;padding:2px 6px;border-radius:var(--radius-sm);transition:background .15s,color .15s}
.plan-edit{color:var(--primary);margin-right:2px}
.plan-edit:hover{color:var(--on-primary);background:var(--primary)}
.plan-del{color:var(--muted)}
.plan-del:hover{color:var(--danger);background:var(--err-bg)}
.plan-input{flex:1;font-size:14px;padding:6px 8px;border:1px solid var(--primary);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);outline:none;box-shadow:0 0 0 3px var(--primary-soft)}
/* 10/1 晚 v2（她拍板重排）：历史计划「连体行 + 左侧怪点」→ 独立日卡：
   日期块（大数字+月/周）+ 完成度进度条 + 徽章，点开看当天明细 */
.hist-plan{margin:0 0 10px;padding:2px 16px;border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:var(--shadow)}
.hist-plan > summary{display:flex;align-items:center;gap:14px;padding:12px 0;cursor:pointer;list-style:none}
.hist-plan > summary::-webkit-details-marker{display:none}
.hist-date{display:flex;flex-direction:column;line-height:1.15;min-width:64px}
.hist-date b{font-size:20px;font-weight:800;color:var(--n-900);font-variant-numeric:tabular-nums}
.hist-date small{font-size:11.5px;color:var(--muted);white-space:nowrap}
.hist-mid{flex:1;display:flex;align-items:center;gap:8px;min-width:0}
.hist-bar{flex:1;height:6px;border-radius:999px;background:var(--line);overflow:hidden}
.hist-bar i{display:block;height:100%;border-radius:999px;background:var(--primary)}
.hist-bar i.full{background:var(--ok)}
.hist-pct{font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums;width:36px;text-align:right}
.hist-plan > summary:hover .hist-date b{color:var(--primary)}
.hist-chev{color:var(--muted);font-size:12px;transition:transform .2s}
.hist-plan[open] .hist-chev{transform:rotate(90deg)}
/* 10/2 她拍板：展开区从 ul 列表改行式布局——状态圆点 + 文本，底部弱化编辑按钮 */
.hist-body{padding:6px 0 12px;border-top:1px dashed var(--line)}
.hist-item{display:flex;align-items:flex-start;gap:10px;padding:7px 0;font-size:14px;line-height:1.6}
.hist-dot{flex:none;width:19px;height:19px;border-radius:50%;border:1.5px solid var(--line);background:var(--surface);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;margin-top:2px}
.hist-item.done .hist-dot{background:var(--ok);border-color:var(--ok)}
.hist-txt{flex:1;min-width:0;word-break:break-word;color:var(--ink)}
.hist-item.done .hist-txt{color:var(--muted);text-decoration:line-through}
.hist-foot{display:flex;justify-content:flex-end;margin-top:8px;padding-top:8px;border-top:1px dashed var(--line)}
.hist-foot .btn-ghost{color:var(--primary);font-weight:600}
/* 昨日未完成自动延续提示 + 延续项左侧标记 */
.plan-carry-tip{font-size:12.5px;color:var(--primary);background:var(--primary-soft);border-radius:var(--radius-sm);padding:7px 10px;margin-bottom:8px;line-height:1.5}
.plan-item.carried{position:relative;padding-left:10px}
.plan-item.carried::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:2px;background:var(--primary);opacity:.45}
/* 任务行 ↗ 跳转按钮已删（9/24：跳转迁到首页今日任务整行，见下方 .dash-tasks .plan-item.jumpable） */

/* scores */
.score-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 0;border-top:1px dashed var(--line)}
.score-row:first-child{border-top:none}
.badge{display:inline-block;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:700;background:var(--surface-2);color:var(--ink)}
.badge.l{background:rgba(79,159,192,.15);color:#4f9fc0}
.badge.r{background:rgba(95,134,168,.15);color:#5f86a8}
.badge.w{background:rgba(245,158,11,.18);color:var(--warn-ink)}
.badge.s{background:var(--ok-bg);color:var(--ok-text)}
.badge.overall{background:var(--primary);color:var(--on-primary)}
.badge.up{background:var(--ok-bg);color:var(--ok-text)}
.badge.down{background:var(--err-bg);color:var(--err-text)}

/* 最近一次 vs 目标：「差 X 分」对比 */
.gap-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;border:1px solid var(--line);margin-bottom:8px;background:var(--surface)}
.gap-row.gap-worst{border-color:var(--danger);background:rgba(217,120,119,.10);box-shadow:0 2px 8px rgba(217,120,119,.18)}
.action-tip{margin-top:12px;padding:10px 12px;border-radius:10px;background:var(--primary-soft);color:var(--ink);font-size:13px;line-height:1.7}
.tip-link{color:var(--primary);font-weight:700;text-decoration:none}
.tip-link:hover{text-decoration:underline}
.gap-ic{font-size:18px;flex:none}
.gap-name{font-weight:700;min-width:42px}
.gap-val{color:var(--muted);font-size:13px;flex:1}
.gap-tag{margin-left:auto}

/* heat legend */
.cal-legend{display:flex;flex-wrap:wrap;gap:12px;margin-top:12px;font-size:12px;color:var(--muted);align-items:center}
.cal-legend .sw{display:inline-flex;align-items:center;gap:6px}
.cal-legend .dot{width:14px;height:14px;border-radius:4px;display:inline-block}

/* chat (口语GPT) */
.chat{max-height:60vh;overflow:auto;display:flex;flex-direction:column;gap:10px;padding:6px 2px}
.bubble{max-width:85%;padding:10px 14px;border-radius:14px;font-size:14px;line-height:1.6;word-break:break-word}
.bubble.user{align-self:flex-end;background:var(--primary);color:var(--on-primary);border-bottom-right-radius:4px}
.bubble.assistant{align-self:flex-start;background:var(--surface);border:1px solid var(--line);border-bottom-left-radius:4px}
/* corpus */
.corpus-item{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-top:1px dashed var(--line)}
.corpus-item:first-child{border-top:none}
.corpus-text{flex:1;font-size:14px;line-height:1.5}

/* ============ 长难句 + 语料 共用工具/模块类 ============ */
.card-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.flex-none{flex:none}
.mt-10{margin-top:10px}
.row-end{align-items:flex-end}
.ls-hist-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-top:10px}
.hist-card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px;font-size:13px;line-height:1.5;color:var(--ink)}
/* 语料库紧凑表格：第1列序号 / 左列中文 / 右列英文 */
.corpus-table{width:100%;border-collapse:collapse;font-size:13.5px}
.corpus-table th{text-align:left;color:var(--muted);font-size:12px;font-weight:700;padding:7px 10px;border-bottom:2px solid var(--line)}
.corpus-table td{padding:7px 10px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.55}
.corpus-table td.cor-idx{width:34px;text-align:center;color:var(--muted);font-variant-numeric:tabular-nums;font-size:12px}
.corpus-table tbody tr:nth-child(even){background:var(--surface-2)}
.corpus-table td.cor-cn{color:var(--ink-sub);width:40%}
.corpus-table td.cor-en{color:var(--ink);font-weight:600}

/* 默写（看中文写英文）练习 */
.write-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px}
.write-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px dashed var(--line)}
.write-row:first-child{border-top:none}
.write-en{flex:1;min-width:0;padding:9px 12px;border:1.5px solid var(--line);border-radius:10px;font:inherit;font-size:15px;background:var(--bg);color:var(--ink)}
.write-en:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}
.write-play{flex:none;width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:var(--surface);cursor:pointer;color:var(--ink-sub)}
.write-play:hover{border-color:var(--primary);color:var(--primary)}
.write-result-row{margin-top:8px;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:var(--bg)}
.write-result-row.ok{border-color:var(--ok);background:var(--ok-bg)}
.write-result-row.bad{border-color:var(--err);background:var(--err-bg)}
.write-res-line{font-size:13px;margin:3px 0}
/* 表格默写模式：英文列内联输入 + 批改回显 */
.write-table td.cor-en-write{position:relative}
.write-table .write-en{width:100%;box-sizing:border-box;padding:7px 10px;margin:2px 0;border:1.5px solid var(--line);border-radius:8px;font:inherit;font-size:13.5px;background:var(--bg);color:var(--ink)}
.write-table .write-en:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}
.write-table .write-play{margin-left:6px;padding:4px 7px;border:1px solid var(--line);border-radius:7px;background:var(--surface);cursor:pointer;font-size:13px}
.write-table .write-play:hover{border-color:var(--primary);color:var(--primary)}
.write-fb{font-size:12px;margin-top:3px;line-height:1.5}
.write-fb.ok{color:var(--med)}
.write-fb.bad{color:var(--danger)}
.write-res-line .muted{font-size:12px}

/* longsent: 同声传译 + 一键收录 */
.ls-sec{margin-top:18px}
.ls-sec:first-child{margin-top:0}
.ls-sec-title{font-size:13px;font-weight:700;color:var(--muted);margin-bottom:10px;text-transform:uppercase;letter-spacing:.02em}
.ls-wbw-grid{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch}
.ls-wbw-item{display:flex;flex-direction:column;gap:3px;padding:8px 10px;border-radius:10px;background:var(--surface);border:1px solid var(--line);min-width:42px;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s}
.ls-wbw-item:hover,.ls-wbw-item:focus{background:var(--surface-2);border-color:var(--primary);outline:none;box-shadow:0 2px 8px rgba(58,154,147,.12)}
.ls-wbw-en{font-size:14px;font-weight:700;color:var(--ink);line-height:1.3}
.ls-wbw-cn{font-size:12px;color:var(--muted);line-height:1.3}
.ls-natural{padding:14px 16px;border-radius:12px;background:var(--surface);border-left:4px solid var(--primary);font-size:14px;line-height:1.7;color:var(--ink)}
.ls-save-hint{font-size:12px;color:var(--muted);margin-top:8px}
.ls-save-hint kbd{display:inline-block;padding:2px 6px;border-radius:6px;background:var(--surface-2);border:1px solid var(--line);font-family:monospace;font-size:11px}

/* 结构拆解（商业版默认模式） */
.ls-backbone{background:var(--surface-2,var(--bg));border:1px solid var(--line);border-left:3px solid var(--primary);border-radius:8px;padding:9px 12px;font-size:14px;line-height:1.7}
.ls-clause{display:flex;align-items:baseline;gap:8px;padding:6px 0;border-bottom:1px dashed var(--line);flex-wrap:wrap}
.ls-clause:last-child{border-bottom:none}
.ls-clause-type{font-size:11px;padding:1px 8px;border-radius:10px;background:var(--primary-soft);color:var(--med);border:1px solid var(--line);white-space:nowrap;font-weight:600}
.ls-clause-text{font-size:13.5px;line-height:1.6}
.ls-clause-role{font-size:12.5px;color:var(--muted)}
.ls-sig{display:flex;align-items:baseline;gap:8px;padding:6px 0;border-bottom:1px dashed var(--line);flex-wrap:wrap}
.ls-sig:last-child{border-bottom:none}
.ls-sig-word{font-size:13.5px}
.ls-sig-logic{font-size:11px;padding:1px 8px;border-radius:10px;background:rgba(234,140,50,.12);color:#8a5a1a;border:1px solid rgba(234,140,50,.25);white-space:nowrap;font-weight:600}
.ls-sig-exam{font-size:12.5px;color:var(--muted)}
.ls-exam .ls-sec-title{color:var(--primary-d,var(--primary))}
.ls-exam-lens{background:var(--primary-soft);border:1px solid var(--line);border-radius:8px;padding:9px 12px;font-size:13.5px;line-height:1.7}
.ls-kw-list{display:flex;flex-direction:column;gap:8px}
.ls-kw-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:var(--surface);border:1px solid var(--line);transition:background .15s,border-color .15s;cursor:pointer}
.ls-kw-row:hover,.ls-kw-row:focus{background:var(--surface-2);border-color:var(--primary);outline:none}
.ls-kw-main{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;flex:1}
.ls-kw-en{font-weight:700;color:var(--ink);font-size:14px}
.ls-kw-cn{color:var(--primary);font-size:13px}
.ls-kw-note{flex-basis:100%;font-size:12px;color:var(--muted);margin-top:2px}
.ls-kw-save{padding:5px 10px;border-radius:8px;border:1px solid var(--primary);background:var(--primary);color:var(--on-primary);font-size:12px;font-weight:600;cursor:pointer;transition:background .15s;flex:none}
.ls-kw-save:hover{background:var(--primary-d)}

/* weekly suggest */
.suggest-list{margin:0;padding-left:18px;color:var(--ink);font-size:14px;line-height:1.9}
.suggest-list li{margin:2px 0}.badge.local{background:rgba(100,116,139,.15);color:#475569;font-weight:600}

/* ====== dictation (idictation.cn style) ====== */
.dict-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px;text-align:left;box-shadow:0 2px 10px rgba(14,19,31,.04)}
.dict-head{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.dict-meta{flex:1;display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.dict-voice{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);min-width:0}
.dict-voice label{flex:none;font-weight:600;color:var(--ink-sub)}
.dict-voice input[type=range]{width:100px;flex:none}
.dict-voice select{flex:none}
.dict-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:12px}

/* 批改结果 */
.dict-result-card{background:var(--bg);border-radius:12px;padding:16px;border:1px solid var(--line);margin-top:6px}
.dict-result-card.ok{border-color:var(--ok);background:var(--ok-bg)}
.dict-result-card.bad{border-color:var(--err);background:var(--err-bg)}
.sent-row{font-size:16px;line-height:1.8;padding:10px 12px;background:var(--surface);border-radius:10px;word-break:break-word}
.sent-row .w{display:inline-block;margin:2px 4px 2px 0;padding:2px 6px;border-radius:6px;font-weight:500}
.sent-row .w.correct{background:var(--ok-bg);color:var(--ok-text)}
.sent-row .w.wrong{background:var(--err-bg);color:var(--err-text);text-decoration:line-through}
.sent-row .w.miss{background:var(--err-bg);color:var(--err-text);outline:2px dashed var(--err);outline-offset:1px}
.sent-row .w.ref{background:rgba(16,185,129,.12);color:#065f46}

.dict-result-actions{display:flex;gap:10px;margin-top:14px;align-items:center}

/* ======= 练习设置面板 ======= */
.cfg-head{display:flex;justify-content:space-between;align-items:center;cursor:pointer;user-select:none}
.cfg-chev{font-size:18px;color:var(--muted);transition:transform .2s}
.cfg-body{margin-top:12px}
.cfg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.cfg-item{display:flex;flex-direction:column;gap:4px}
.cfg-item label{font-size:13px;font-weight:600;color:var(--ink-sub)}
.cfg-ctrl{display:flex;align-items:center;gap:8px}
.cfg-ctrl input[type=range]{width:100px;flex:none}
.cfg-ctrl select{flex:none}
.cfg-val{font-size:12px;color:var(--muted);min-width:42px}
/* 进度条 */
.prog-bar-wrap{margin-bottom:14px}
.prog-bar-track{height:6px;background:var(--line);border-radius:3px;overflow:hidden}
.prog-bar-fill{height:100%;background:var(--primary);border-radius:3px;transition:width .3s ease}
/* 大号播放按钮 */
.btn-play-large{font-size:18px;padding:14px 28px;border-radius:14px}
/* 完成页总结 */
.dict-summary{display:flex;gap:22px;align-items:center;flex-wrap:wrap;padding:14px;background:var(--surface);border:1px solid var(--line);border-radius:16px}
.dict-score-ring{--pct:0%;width:120px;height:120px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;background:conic-gradient(var(--med) var(--pct), rgba(148,163,184,.18) 0);position:relative;flex:none}
.dict-score-ring::before{content:'';position:absolute;inset:10px;background:var(--surface);border-radius:50%}
.dict-score-ring > *{position:relative;z-index:1}
.dict-score-num{font-size:34px;font-weight:900;letter-spacing:.5px;line-height:1}
.dict-score-num span{font-size:18px;font-weight:600;margin-left:2px}
.dict-stats{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0}
.stat-row{display:flex;justify-content:space-between;font-size:14px;padding:4px 0;border-bottom:1px dashed var(--line)}
.stat-row:last-child{border-bottom:none}
.stat-row b{font-weight:700;font-size:15px}











/* ====== 练习设置模态弹窗（参考爱听写）====== */
.cfg-modal-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.35);
  display:flex;align-items:center;justify-content:center;z-index:9999;
}
.cfg-modal-overlay[hidden]{display:none} /* 关键：覆盖 .cfg-modal-overlay 的 display:flex，否则 hidden 失效会常驻显示 */
.cfg-modal{
  background:var(--surface);border-radius:16px;
  width:min(600px,92vw);max-height:80vh;
  box-shadow:0 20px 60px rgba(0,0,0,.18);
  display:flex;flex-direction:column;overflow:hidden;
}
.cfg-modal-head{
  display:flex;justify-content:space-between;align-items:center;
  padding:16px 20px;border-bottom:1px solid var(--line);
}
.cfg-modal-close{
  background:none;border:none;font-size:24px;cursor:pointer;
  color:var(--muted);line-height:1;padding:0 4px;
}
.cfg-modal-close:hover{color:var(--ink);}
.cfg-modal-body{overflow-y:auto;padding:0;}

/* 左右分栏 */
.cfg-m-cols{display:flex;min-height:280px;}
.cfg-m-sidebar{width:140px;background:var(--surface-2);border-right:1px solid var(--line);padding:12px 0;flex-shrink:0}
.cfg-m-cat{
  padding:10px 16px;font-size:14px;font-weight:600;color:var(--muted);
  cursor:pointer;border-left:3px solid transparent;
}
.cfg-m-cat:hover,.cfg-m-cat.active{color:var(--ink);background:rgba(58,154,147,.04);border-left-color:var(--primary)}
.cfg-m-main{flex:1;padding:16px 24px;}

/* 设置行 */
.cfg-m-group{display:none;margin-bottom:8px}
.cfg-m-group.active{display:block}
.cfg-m-row{display:flex;justify-content:space-between;align-items:center;
  padding:10px 0;border-bottom:1px solid var(--line)}
.cfg-m-row:last-child{border-bottom:none}
.cfg-m-row.cfg-m-hidden{display:none}
.cfg-m-label{font-size:14px;font-weight:500}
.cfg-m-desc{font-size:12px;color:var(--muted);margin-top:2px}

/* 控件 */
.cfg-m-ctrl{display:flex;align-items:center;gap:8px}
/* Toggle 开关 */
.cfg-toggle{display:none}  /* 隐藏原生 checkbox */
.cfg-toggle+label{
  display:inline-block;width:44px;height:24px;
  background:var(--line);border-radius:12px;position:relative;cursor:pointer;transition:.2s
}
.cfg-toggle+label::after{
  content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;
  background:#fff;border-radius:50%;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.15)
}
.cfg-toggle:checked+label{background:var(--primary)}
.cfg-toggle:checked+label::after{left:23px}
/* Select 下拉 */
.cfg-select{padding:6px 10px;border:1px solid var(--line);border-radius:8px;
  font-size:13px;background:var(--surface);color:var(--ink);cursor:pointer}
/* Range 滑块 */
.cfg-range{width:100px;accent-color:var(--primary)}
.cfg-range-val{font-size:12px;color:var(--muted);min-width:36px;text-align:right}

/* =========================================================================
   AI 输出块视觉统一（口语 .diag-sec / 长难句 .rs-sec / 错题本 .eb-block /
   写作 .score-section .ts-sec）
   这些区块由各页 JS 把 AI 返回的 JSON/section 渲染而成，结构已齐，但原有
   标题是普通小字、区块间无分隔，显得平。这里用 `main` 前缀提升特异性，
   统一覆盖各页内联 <style> 的同名规则，把区块标题改成彩色 pill 标签、
   区块之间加细分隔线，提升可扫读性与精致度。纯样式，不改任何 JS 逻辑。
   ========================================================================= */
main .diag-sec,
main .rs-sec,
main .eb-block,
main .score-section,
main .ts-sec{ margin-bottom:14px }
main .diag-sec:last-child,
main .rs-sec:last-child,
main .eb-block:last-child,
main .score-section:last-child,
main .ts-sec:last-child{ margin-bottom:0 }

/* 区块标题 → 彩色 pill 标签 */
main .diag-sec > b,
main .rs-sec h3,
main .eb-block h4,
main .score-section h4,
main .ts-sec h4{
  display:inline-block;
  font-size:12.5px;font-weight:700;letter-spacing:.03em;
  color:var(--primary);background:var(--primary-soft);
  padding:4px 11px;border-radius:999px;margin:0 0 10px;border:none;
}

/* 区块之间细分隔线，强化层次（避免 card-in-card 的厚重感） */
main .rs-sec + .rs-sec,
main .score-section + .score-section,
main .ts-sec + .ts-sec,
main .diag-sec + .diag-sec,
main .eb-block + .eb-block{
  border-top:1px solid var(--line);padding-top:14px;
}

/* 口语诊断：inline 笔记式纠错（省空间） */
.diag-inline-list{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;
  font-size:14.5px;line-height:1.8;color:var(--ink);
}
.diag-inline-item{
  display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;
}
/* 9/15 之之二定版：只染色不加底块——错词深红删除线、替换词绿色，无背景无 padding，词间正常空格 */
.diag-wrong{
  color:var(--err-text);font-weight:600;
  text-decoration:line-through;text-decoration-color:var(--err-text);text-decoration-thickness:1.5px;
}
.diag-right{
  color:var(--ok-text);font-weight:700;
}
.diag-inline-note{
  color:var(--muted);font-size:12.5px;
}
.diag-sep{
  color:var(--line);font-size:16px;line-height:1;
}
.diag-ok{
  color:var(--primary);font-size:14px;
}
.diag-warn{
  color:var(--warn-ink);font-size:14px;background:var(--warn-soft);border-radius:var(--radius-sm);padding:10px 12px;
}

/* 口语诊断：整句 diff 式纠错（原句放中间，错误词划掉+绿色替换并排；9/15 去箭头改标记式、去底块） */
.diag-sentence-diff{
  font-size:15px;line-height:1.9;color:var(--ink);
  background:var(--surface-2);border-radius:var(--radius-sm);padding:14px 16px;
}
.diag-sentence-diff .diag-wrong{
  color:var(--err-text);font-weight:600;
  text-decoration:line-through;text-decoration-color:var(--err-text);text-decoration-thickness:1.5px;
}
.diag-sentence-diff .diag-right{
  color:var(--ok-text);font-weight:700;
}

/* 长难句原句：从斜体灰字升级为清晰 callout（仍是输入，非 AI 输出，但同页相邻顺手优化） */
main .quote{
  font-style:normal;color:var(--ink);
  background:var(--surface-2);border-left:4px solid var(--primary);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  font-size:15px;line-height:1.8;padding:12px 16px;
}

.hero-cta{display:flex;flex-direction:column;gap:4px;background:linear-gradient(135deg,var(--primary),var(--primary-d));color:var(--on-primary);border-radius:18px;padding:22px 24px;text-decoration:none;box-shadow:var(--shadow-md);transition:transform .15s,box-shadow .15s;text-align:left}
.hero-cta:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);color:var(--on-primary)}
.detail-block{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:0 16px;margin-bottom:14px}
.detail-block summary{cursor:pointer;font-size:15px;font-weight:700;color:var(--ink);padding:14px 0;list-style:none}
.detail-block summary::-webkit-details-marker{display:none}
.detail-block summary::before{content:'▸';color:var(--muted);margin-right:8px;display:inline-block;transition:transform .2s}
.detail-block[open] summary::before{transform:rotate(90deg)}
.detail-block > div{padding:0 0 16px}
/* —— 侧边栏：一级常驻 + 更多▾ —— */
.side-primary{display:flex;flex-direction:column;gap:2px;margin:4px 0}
.side-primary .side-item{font-weight:600}

/* =========================================================================
   回顾页 review（从 review.html 内联 <style> 收口而来 + 扁平化）
   ========================================================================= */
.review-pane{background:transparent;border:none;box-shadow:none;padding:0;margin-bottom:20px}
.review-pane > h2{margin:0 0 14px;font-size:18px;font-weight:800;letter-spacing:-.02em}
.mk-filter-wrap{flex:none;margin-left:auto;display:flex;align-items:center;gap:8px}
/* 9/29 之之：筛选器标签被挤成竖排（「科」「目」各占一行）——全局 label 是 display:block 且无 nowrap，
   在窄 flex 项里会逐字折行。这里强制一行显示（「范围 / 科目 / 粒度」都是 2 字标签，横排才好看）。 */
.mk-filter-wrap > label{flex:none;white-space:nowrap;margin-bottom:0;font-size:13px;font-weight:600;color:var(--muted)}
.inline-h2{margin:0}
/* 旧 .tabs/.tab-btn 全局样式已废弃：全站统一改用 .pill-tabs/.pill-tab（见上方「统一子 Tab」块）。仅 review.html 曾用，现由其 pill 类接管。 */
.tab-panel{display:none}
.tab-panel.active{display:block;animation:fadeIn .25s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

/* design/23 修正：添加分项记录表单紧凑布局 */
.mk-parts{display:flex;gap:10px;margin:12px 0;align-items:flex-end}
.mk-part{flex:1;margin-bottom:0}
/* 听力/阅读 accuracy 模式：P1-P4 一行内紧凑 */
.mk-part-inline{display:flex;align-items:center;gap:6px}
.mk-part-inline .mk-part-label{flex:none;font-weight:700;font-size:14px;color:var(--ink)}
.mk-part-inline input{flex:1;min-width:0}
/* 口语/写作 score 模式：两列网格 */
.mk-parts.mk-parts-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;align-items:stretch}
.mk-part-grid{display:flex;flex-direction:column;gap:6px;align-items:stretch}
.mk-part-label{font-weight:700;font-size:14px;color:var(--ink)}
.mk-part-grid .mk-part-inputs{display:flex;gap:8px}
.mk-part-grid .mk-part-inputs > div{flex:1}
.mk-part-grid .mk-part-inputs input{width:100%}
@media (max-width:480px){
  .mk-parts.mk-parts-grid{grid-template-columns:1fr}
  .mk-parts.mk-parts-inline{flex-wrap:wrap}
  .mk-parts-inline .mk-part{min-width:70px;flex:1 1 20%}
}

.mk-grp{margin-bottom:14px}
.mk-grp-title{font-weight:700;margin:4px 0 6px}
/* =========================================================================
   口语模考（口语页第 4 tab，speaking.html；历史在回顾页）
   ========================================================================= */
.mock-intro{margin:8px 0 0;padding-left:18px;color:var(--ink)}
.mock-intro li{margin:4px 0;font-size:14px}
.mock-precheck{margin:14px 0 4px;display:flex;flex-direction:column;gap:6px}
.mock-precheck-row{font-size:14px;padding:8px 12px;border-radius:10px;background:var(--surface);border:1px solid var(--line)}
.mock-precheck-row.ok{color:var(--ink)}
.mock-precheck-row.warn{color:var(--warn-ink);background:var(--warn-soft);border-color:var(--warn)}
  .mock-precheck-row .mock-need a{color:var(--primary);font-weight:700}
  .btn-lg{font-size:16px;padding:12px 22px}
/* 模考开始卡 CTA（对齐 Dashboard hero-cta 语言） */
.mock-start-rail{display:flex;flex-direction:column;gap:4px;background:linear-gradient(135deg,var(--primary),var(--primary-d));color:var(--on-primary);border-radius:18px;padding:20px 22px;box-shadow:var(--shadow-md)}
.mock-start-rail .ms-title{font-size:19px;font-weight:800;letter-spacing:-.01em}
.mock-start-rail .ms-sub{font-size:13.5px;opacity:.92;margin-bottom:12px}
.mock-start-rail .btn{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.35);color:var(--on-primary);align-self:flex-start}
.mock-start-rail .btn:hover{background:rgba(255,255,255,.28)}
/* 考试舞台 */
.mock-phase{display:inline-block;font-size:13px;font-weight:700;color:var(--on-primary);background:var(--primary);border-radius:999px;padding:4px 14px;margin-bottom:12px}
/* 考试舞台进度步进器（Part 级 + P1 小题计数） */
.mock-steps{display:flex;align-items:center;gap:6px;margin-bottom:14px}
.mock-step{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--muted);white-space:nowrap}
.mock-step .dot{width:24px;height:24px;border-radius:50%;background:var(--surface-2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--muted);font-weight:800}
.mock-step.active{color:var(--primary)}
.mock-step.active .dot{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
.mock-step.done .dot{background:var(--primary-soft);border-color:var(--primary);color:var(--primary)}
.mock-step-sep{flex:1;height:2px;background:var(--line);border-radius:2px;min-width:14px}
.mock-step-sep.done{background:var(--primary)}
.mock-subcount{display:inline-block;font-size:12px;font-weight:700;color:var(--primary);background:var(--primary-soft);border-radius:8px;padding:2px 9px;margin-left:8px;vertical-align:middle}
.mock-qcard{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px}
.mock-q{font-size:18px;font-weight:700;line-height:1.5;color:var(--ink)}
.mock-q-topic{display:inline-block;font-size:12px;font-weight:700;color:var(--primary);background:var(--primary-soft);border-radius:8px;padding:2px 8px;margin-right:8px;vertical-align:middle}
/* 模考题目行：题目文本 + 播放按钮并排 */
.mock-q-row{display:flex;align-items:flex-start;gap:12px}
.mock-q-text{flex:1;min-width:0}

/* === 题目语音播放按钮（全站单色线性 SVG，teal 调性）=== */
.sp-tts{flex:none;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:var(--primary-soft);color:var(--primary);cursor:pointer;transition:transform .12s,border-color .15s,color .15s,background .15s;padding:0;margin-top:1px}
.sp-tts:hover{border-color:var(--primary);transform:scale(1.06)}
.sp-tts.playing{background:var(--primary);color:var(--on-primary);border-color:var(--primary);animation:pulseTts 1s ease-in-out infinite}
@keyframes pulseTts{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}

/* === P2 练习倒计时按钮（2 分钟逼讲满）=== */
.sp-timer-btn{display:inline-flex;align-items:center;gap:4px;padding:6px 11px;font-size:13px;font-weight:600;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:var(--radius-sm);cursor:pointer;transition:background .15s,color .15s,border-color .15s,box-shadow .15s,transform .15s}
.sp-timer-btn:hover{border-color:var(--primary);color:var(--primary)}
.sp-timer-btn.sp-timer-running{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}
.sp-timer-btn:active{transform:translateY(0) scale(.97)}
.sp-timer-display{display:inline-flex;align-items:center;justify-content:center;min-width:52px;font-variant-numeric:tabular-nums;font-feature-settings:"tnum";font-weight:700;font-size:14px;color:var(--primary);background:var(--primary-soft);border-radius:8px;padding:4px 9px;letter-spacing:.5px}
.sp-timer-display.sp-timer-end{color:var(--on-primary);background:var(--danger);animation:timerBlink .6s steps(2,start) infinite}
@keyframes timerBlink{0%,100%{opacity:1}50%{opacity:.45}}


/* === 模考：顶部黄条右半的「退出模考」实体小按钮 + 退出确认对话框 === */
/* 10/2 她拍板：原右下角红色悬浮 FAB（position:fixed + 红底 + 投影）→ 改成挂在整场剩余黄条
   里的实体小按钮。低饱和橙黄（比黄框底色深一档、但不发亮到跟计时数字抢眼），无投影无悬浮。 */
.mock-exit-btn{
  margin-left:auto; align-self:center;
  display:inline-flex; align-items:center; gap:4px;
  padding:5px 11px; border:1px solid var(--warn); border-radius:8px;
  background:rgba(255,149,0,.20); color:var(--warn-ink);
  font-size:12px; font-weight:700; line-height:1.2;
  cursor:pointer; flex:none; white-space:nowrap;
  transition:background .12s, border-color .12s;
}
.mock-exit-btn:hover{ background:rgba(255,149,0,.30); border-color:var(--warn-ink); }
.mock-exit-btn:active{ background:rgba(255,149,0,.38); }
.mock-exit-btn svg{ width:13px; height:13px; flex:none; }
.mock-exit-btn:focus-visible{ outline:2px solid var(--warn-ink); outline-offset:2px; }
/* 黄条被隐藏时按钮跟着消失（按钮是黄条的子元素，无需额外处理） */

.mock-modal-backdrop{
  position:fixed; inset:0; z-index:200;
  background:rgba(15,23,42,.45);
  display:flex; align-items:center; justify-content:center;
  padding:20px;
}
.mock-modal{
  width:100%; max-width:360px;
  background:var(--surface); color:var(--ink);
  border-radius:16px; padding:22px 20px 18px;
  box-shadow:var(--shadow-lg);
}
.mock-modal h3{ margin:0 0 8px; font-size:18px; }
.mock-modal-desc{ margin:0 0 16px; font-size:14px; line-height:1.6; color:var(--muted); }
.mock-modal-actions{ display:flex; flex-direction:column; gap:10px; }
.mock-modal-btn{
  width:100%; padding:12px 14px; border-radius:10px;
  font-size:14.5px; font-weight:600; cursor:pointer; border:1px solid transparent;
}
.mock-modal-btn.save{ background:var(--primary); color:var(--on-primary); }
.mock-modal-btn.save:hover{ filter:brightness(1.05); }
.mock-modal-btn.clear{ background:#fff; color:var(--err); border-color:var(--err); }
.mock-modal-btn.clear:hover{ background:var(--err-bg); }
.mock-modal-btn.cancel{ background:transparent; color:var(--muted); border-color:var(--line); }
.mock-modal-btn.cancel:hover{ background:var(--surface-2); }

/* 开始卡：续考入口（保存进度退出后，同一会话内可直接「继续上次模考」） */
.mock-resume-box{
  margin-top:14px; padding:14px; border:1px dashed var(--primary); border-radius:12px;
  background:var(--primary-soft);
}
.mock-resume-title{ font-size:14px; font-weight:600; color:var(--primary-d); margin-bottom:10px; }
.mock-resume-actions{ display:flex; flex-wrap:wrap; gap:10px; }
.sp-tts:active{transform:scale(.94)}
.sp-tts .tts-icon{width:18px;height:18px}
.sp-tts.playing{background:var(--primary);color:var(--on-primary);border-color:var(--primary);animation:tts-pulse 1.1s ease-in-out infinite}
@keyframes tts-pulse{0%,100%{box-shadow:0 0 0 0 rgba(13,148,136,.45)}50%{box-shadow:0 0 0 6px rgba(13,148,136,0)}}

[data-theme="dark"] .sp-tts{background:rgba(45,212,191,.16)}
.mock-timer{margin-top:10px;font-size:15px;font-weight:700;color:var(--warn-ink)}
.mock-live{margin-top:12px;min-height:42px;padding:10px 12px;border-radius:10px;background:var(--bg);border:1px dashed var(--line);color:var(--ink);font-size:15px;line-height:1.5;white-space:pre-wrap}
/* 10/2（她 10/2 反馈「界面说不上来的奇怪」）：无录音内容时这块空框不占位，答题卡回到「输入框 → 下一题」两段式 */
.mock-live:empty{display:none}
/* 视觉隐藏但保留给读屏（模考答题框 label：placeholder 已说明用途，视觉不再重复一行） */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.mock-manual{margin-top:12px}
.mock-manual label{display:block;font-size:13px;color:var(--muted);margin-bottom:6px}
.mock-manual textarea{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font-size:14px;resize:vertical;font-family:inherit}
/* 10/2 她拍板：「下一题」从左下角挪到右下角（动作行右对齐） */
.mock-controls{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap;justify-content:flex-end}
.mock-hint{margin:10px 0 0;font-size:13px;color:var(--muted);min-height:1px}
.mock-p2-prompt{font-size:18px;font-weight:700;color:var(--ink);line-height:1.5}
.mock-p2-zh{font-size:14px;font-weight:600;color:var(--muted);margin-top:4px}
.mock-p2-say{margin-top:10px;font-size:14px;color:var(--ink)}
.mock-p2-say ul{margin:6px 0 0;padding-left:18px}
.mock-prephint{margin:10px 0 0;font-size:13px;color:var(--muted)}
/* 报告 */
.mock-overall{text-align:center;margin:6px 0 18px}
.mock-overall-score{font-size:52px;font-weight:800;line-height:1}
.mock-overall-label{font-size:13px;color:var(--muted);margin-top:4px}
.mock-dims{display:flex;flex-direction:column;gap:12px}
.mock-dim-top{display:flex;justify-content:space-between;font-size:14px;font-weight:600;color:var(--ink);margin-bottom:5px}
.mock-fixed-tag{font-size:11px;font-weight:700;color:var(--warn-ink);background:var(--warn-soft);border-radius:6px;padding:1px 6px;margin-left:4px}
.mock-dim-track{height:9px;background:var(--bg);border-radius:999px;overflow:hidden}
.mock-dim-fill{height:100%;border-radius:999px;transition:width .4s}
.mock-dim-note{font-size:12px;color:var(--muted);margin-top:3px}
.mock-report-note{margin:16px 0 0;font-size:13px;color:var(--warn-ink);background:var(--warn-soft);border:1px solid var(--warn);border-radius:10px;padding:10px 12px;line-height:1.6}
.mock-summary{margin-top:14px;font-size:14px;line-height:1.7;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.mock-summary-title{font-size:13px;font-weight:700;color:var(--muted);margin-bottom:6px}
.mock-report-actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}
/* 历史模考记录（回顾） */
.mock-hist-count{font-size:13px;font-weight:600}
.mock-hist-card{border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:12px;background:var(--surface)}
.mock-hist-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mock-hist-meta{display:flex;align-items:center;gap:8px;flex:1;min-width:0}
.mock-hist-meta b{font-size:15px;color:var(--ink)}
.mock-hist-ops{display:flex;gap:8px;margin-left:auto}
.mock-hist-body{margin-top:12px;border-top:1px dashed var(--line);padding-top:12px}
.mock-hist-trans{margin-top:14px}
.mock-hist-trans-title{font-weight:700;margin-bottom:6px;color:var(--ink)}
.mock-hist-sec{font-weight:700;margin:10px 0 4px;color:var(--primary);font-size:14px}
/* 10/6 09:27 她反馈：记录行删掉「发音分」（设置里的固定分，不是本次成绩），改显示语法 / 词汇。
   语法词汇是弱信息（辅助判断短板在哪科），所以用中性灰底小字，总分继续用实心主色 —— 层级靠颜色不靠字号。 */
.mock-hist-dim{font-size:12.5px;font-weight:600;color:var(--ink-2);background:var(--bg);border:1px solid var(--line);border-radius:7px;padding:2px 8px;white-space:nowrap}
.mock-hist-dim b{color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
.mock-hist-qa{margin:0;padding-left:18px}
.mock-hist-qa li{margin:4px 0;font-size:13.5px;line-height:1.6;color:var(--ink)}
.btn.sm{padding:5px 10px;font-size:13px;line-height:1.4}
.btn.danger{color:var(--err);border-color:var(--err-bg)}
.btn.danger:hover{background:var(--err-bg);color:var(--err)}
/* 整场计时条（模考总时长 12~15 分钟，用于自控节奏） */
/* 10/2（她 10/2 反馈「三行太占地方」）：整场剩余框收窄——第一行=倒计时，第二行=时长标注（小字一行），手机端不再堆成三行 */
.mock-total-timer{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13.5px;font-weight:700;color:var(--warn-ink);background:var(--warn-soft);border:1px solid var(--warn);border-radius:12px;padding:8px 12px;margin-bottom:12px}
.mock-total-timer svg{width:15px;height:15px;flex:none}
.mock-total-timer b{font-size:17px;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.mock-total-timer-note{font-size:11.5px;font-weight:500;color:var(--muted);line-height:1.35}
@media (max-width:560px){
  .mock-total-timer{font-size:13px;padding:7px 11px;gap:6px}
  .mock-total-timer b{font-size:16px}
  .mock-total-timer-note{font-size:11px}
}
/* 分部分报告卡（P1/P2/P3 各四维 + 逐题纠错明细，2026-08-19 模考改造） */
.mock-part-card{border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:14px;background:var(--surface)}
/* 10/4 00:40：整 Part 未作答的视觉（她 00:38 拍板「给最低分4 并单列」） */
.mock-part-card.is-unanswered{background:var(--n-50);border-style:dashed}
.mock-part-flag{font-size:11.5px;font-weight:700;color:var(--warn-ink);background:var(--warn-soft,#fdf4e3);border-radius:999px;padding:3px 10px}
.mock-part-note{font-size:12.5px;color:var(--muted);line-height:1.65;margin:0 0 10px;padding:8px 11px;background:var(--surface-2,var(--n-50));border-radius:9px}
.mock-part-note b{color:var(--ink-2)}
/* 总分区的作答率提示（她截图那次「P1 全跳过还 5.5」就是缺这一层） */
.mock-ov-warn{margin:10px auto 0;max-width:520px;font-size:12.5px;line-height:1.7;color:var(--warn-ink);background:var(--warn-soft,#fdf4e3);border-radius:10px;padding:9px 12px}
.mock-ov-warn b{font-weight:800}
.mock-part-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.mock-part-name{font-size:14px;font-weight:800;color:var(--primary)}
.mock-part-band{font-size:20px;font-weight:800}
.mock-fix-block{margin-top:14px;border-top:1px dashed var(--line);padding-top:10px}
.mock-fix-title{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:8px}
.mock-fix-q{font-size:13.5px;font-weight:600;color:var(--ink);margin:8px 0 4px}
.mock-fix-list{margin:0;padding-left:18px}
.mock-fix-list li{margin:3px 0;font-size:13.5px;line-height:1.6;color:var(--ink)}
.mock-fix-wrong{color:var(--err-text);text-decoration:line-through;text-decoration-color:var(--err-bg)}
.mock-fix-correct{color:var(--ok-text);font-weight:600}
.mock-fix-note{font-size:12.5px;color:var(--muted)}

/* ====== 首页 Dashboard 简化重构（2026-08-18，teal token，C 窗口方案 v2） ======
   信息架构：8 块 → 4 区（主行动 / 模块导航 / 今日概览 / 常用折叠）。
   不重定义全局 .card / .btn；颜色只走 var(--xxx)；保留所有 JS 用 ID。
   注：#aiReadiness 的 className 由 js/index.js 动态设为 'ai-readiness ok/warn'
   （common.css:824 已定义其胶囊样式），故此处不再用 .dash-ai，仅做状态线内收紧。 */
/* Zone1 主行动（沿用 hero-cta 渐变，内部改行布局） */
.hero-cta{flex-direction:row;align-items:center;justify-content:space-between;margin-bottom:14px}
.hero-cta > div{display:flex;flex-direction:column;gap:2px;min-width:0}




.mod-card{display:flex;flex-direction:column;gap:6px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;color:var(--ink);text-decoration:none;box-shadow:var(--shadow);transition:transform .15s,box-shadow .15s,border-color .15s}
.mod-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--primary)}
.mod-ic{width:42px;height:42px;border-radius:12px;background:var(--primary-soft);color:var(--primary);display:flex;align-items:center;justify-content:center;flex:none}
.mod-ic svg{width:23px;height:23px;display:block}
.mod-name{font-size:15px;font-weight:800;letter-spacing:-.01em}
/* Zone3 今日概览（沿用 .card，仅微调内距） */
/* Zone4 常用（折叠，专用类避免影响其他页） */
.nav-detail{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);overflow:hidden}
.nav-detail > summary{cursor:pointer;padding:14px 18px;font-weight:800;font-size:15px;color:var(--ink);list-style:none;display:flex;align-items:center;gap:8px}
.nav-detail > summary::-webkit-details-marker{display:none}
/* ====== 计时 / 专注（2026-08-18 极简：stage 收紧 + 模块改单行 chip） ======
   所有计时专用样式集中在此（timer.html 内联 style 已删）；
   图标走 .mod-ic 的 teal 线性 SVG；全局 .mod-card/.btn 仅用作用域覆写，不动。 */
/* timer 页面（紧凑居中样式） */
.timer-stage{text-align:center;max-width:460px;margin-left:auto;margin-right:auto;padding:24px 28px 22px}
.timer-goal{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 0 12px}
.timer-goal label{font-size:13px;color:var(--muted);font-weight:600;white-space:nowrap}
.timer-goal input.goal-input{width:56px;height:32px;padding:0 6px;border:none;border-radius:8px;background:var(--primary-soft);color:var(--ink);font:inherit;font-size:13px;text-align:center;outline:none}
.timer-goal input.goal-input:focus{box-shadow:0 0 0 2px var(--primary)}
.timer-progress{margin-top:12px;text-align:left}
.timer-progress:empty{margin-top:0;min-height:0}
.timer-btns{display:flex;gap:10px;justify-content:center;margin-top:0}
.timer-btns .btn{min-width:0;padding:9px 22px;border-radius:999px}
.timer-btns .btn:disabled{opacity:.55;cursor:not-allowed}
.timer-stage .btn-danger{background:var(--danger-soft);color:var(--danger-text);border-color:transparent}
.timer-stage .btn-danger:hover{background:var(--danger-soft);color:var(--danger-text);border-color:transparent}
/* 模块选择：单行紧凑 chip（图标 + 名称 + 小按钮） */
.timer-mods{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:6px}
.timer-mods .mod-card{
  display:inline-flex;flex-direction:row;align-items:center;gap:7px;
  padding:5px 6px 5px 5px;border-radius:20px;cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.timer-mods .mod-card:hover{transform:translateY(-1px);box-shadow:var(--shadow);border-color:var(--primary)}
.timer-mods .mod-card.running{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}
.timer-mods .mod-card:has(.timer-start[disabled]){opacity:.5}
.timer-mods .mod-ic{width:26px;height:26px;border-radius:8px;font-size:15px}
.timer-mods .mod-ic svg{width:16px;height:16px}
.timer-mods .mod-name{font-size:13.5px;font-weight:700}
.timer-mods .timer-start{width:auto;margin:0;padding:4px 10px;font-size:12.5px;border-radius:14px}
/* 正/倒计时切换（从 timer.html 内联迁来） */
.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;height:32px}
.seg-btn{font:inherit;font-size:12.5px;font-weight:700;padding:0 12px;border:none;background:var(--surface);color:var(--muted);cursor:pointer;transition:background .15s,color .15s}
.seg-btn + .seg-btn{border-left:1px solid var(--line)}
.seg-btn.active{background:var(--primary);color:var(--on-primary)}
.seg-btn.active + .seg-btn{border-left-color:transparent}
@media(max-width:560px){ .live-timer{font-size:36px} }


/* ====== 页头（标题+副标题+右侧统计 chip 通用） 2026-08-22 ====== */
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:0 0 18px;padding-left:48px;flex-wrap:wrap;max-width:1160px}
.page-head-l{min-width:0}
.page-head-l .page-title{margin:0}
.page-head-l .page-sub{margin:6px 0 0;font-size:13px;color:var(--muted)}
.page-head-r{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.phr-chip{
  display:inline-flex;align-items:center;gap:5px;
  padding:5px 11px;border-radius:999px;
  background:var(--primary-soft);color:var(--primary);
  font-size:12.5px;font-weight:700;
}
/* 章节小标题（"选择本次任务"等） */
.section-title{
  font-size:13px;font-weight:700;color:var(--muted);
  letter-spacing:.04em;margin:18px 0 8px;
  display:flex;align-items:center;gap:8px;
}
.section-title::before{content:'';width:3px;height:14px;border-radius:2px;background:var(--primary);display:inline-block}
/* 今日学习记录 mini 卡 */
.rec-mini{padding:18px 22px;margin-top:28px}
.rec-mini .rec-h{margin-bottom:14px}
.rec-mini-grid{display:flex;flex-direction:column;gap:8px;margin-bottom:6px}
.rec-mini-item{
  display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:10px;
  background:var(--surface-2);border:1px solid var(--line);border-radius:10px;
  padding:9px 12px 9px 14px;font-size:13px;
}
.rec-mini-item .rec-mini-mod{font-weight:700;color:var(--ink)}
.rec-mini-item .rec-mini-dur{color:var(--primary);font-weight:700;font-variant-numeric:tabular-nums}
.rec-mini-item .rec-mini-time{color:var(--muted);font-variant-numeric:tabular-nums;font-size:12px}
.rec-mini-del{
  width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--line);background:var(--bg);color:var(--muted);border-radius:50%;
  font-size:15px;line-height:1;cursor:pointer;transition:.15s;padding:0;
}
.rec-mini-del:hover{border-color:var(--danger);color:var(--danger);background:var(--danger-soft)}
.rec-empty{font-size:13px;color:var(--muted);margin:8px 0 0;text-align:center}
@media(max-width:720px){ .rec-mini-grid{grid-template-columns:repeat(2,1fr)} }
/* 评分徽标（模块内自配色语义：≥6 绿 / 5–5.5 琥珀 / <5 红，严格用 Token） */
.score-badge{font-size:12px;font-weight:700;border-radius:10px;padding:2px 9px;font-variant-numeric:tabular-nums}
.score-badge.good{background:var(--primary-soft);color:var(--med)}
.score-badge.ok{background:rgba(217,154,78,.16);color:var(--warn)}
.score-badge.low{background:rgba(217,120,119,.16);color:var(--danger)}

/* —— 回顾页「口语日常练习」 —— */
.practice-summary{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin:6px 0 12px}
.practice-summary b{color:var(--ink);font-variant-numeric:tabular-nums}
.practice-list{margin-top:4px}
.practice-item{border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px 14px;margin-bottom:8px;cursor:pointer;transition:background .15s, border-color .15s}
.practice-item:hover{background:var(--surface-2);border-color:var(--primary)}
.pi-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pi-title{font-weight:700;font-size:14.5px;min-width:0}
.pi-q{color:var(--muted);font-size:13px;flex:1;min-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pi-time{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.part-badge{font-size:11px;font-weight:700;color:var(--on-primary);background:var(--mock);border-radius:10px;padding:2px 9px;flex:none}
.pi-body{display:none;margin-top:10px;padding-top:10px;border-top:1px dashed var(--line)}
.practice-item.open .pi-body{display:block}
.pi-ans{font-size:14px;background:var(--surface-2);border-radius:10px;padding:10px 12px;white-space:pre-wrap;margin-bottom:8px;line-height:1.6}
.diag-err{background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:8px 10px;margin-bottom:6px;font-size:13px;line-height:1.6}
.diag-orig{color:var(--muted);text-decoration:line-through}
.diag-fix{color:var(--ink);font-weight:600}
.practice-empty{padding:18px;text-align:center;color:var(--muted);font-size:13.5px}

/* —— 口语页「学习情况」tab —— */
.prog-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
.prog-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow);padding:14px;text-align:center}
.prog-card .n{font-size:26px;font-weight:800;color:var(--primary);font-variant-numeric:tabular-nums;line-height:1.1}
.prog-card .l{font-size:12px;color:var(--muted);margin-top:4px}
.prog-bar-row{display:flex;align-items:center;gap:12px;margin:10px 0}
.freq-badge{font-size:11px;font-weight:700;color:var(--on-primary);border-radius:10px;padding:2px 9px;min-width:54px;text-align:center;flex:none}
.freq-badge.ultra{background:var(--primary)} .freq-badge.high{background:var(--warn)} .freq-badge.medium{background:var(--mock)} .freq-badge.low{background:var(--muted)}
.bar{flex:1;height:10px;border-radius:999px;background:var(--primary-50);overflow:hidden;min-width:0}
.bar > i{display:block;height:100%;background:linear-gradient(90deg,var(--primary-400),var(--primary-500));border-radius:999px;transition:width .6s cubic-bezier(.4,0,.2,1)}
.bar-num{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;min-width:60px;text-align:right}
.prog-part{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.prog-part b{color:var(--ink);font-variant-numeric:tabular-nums}
@media(max-width:640px){.prog-grid{grid-template-columns:repeat(2,1fr)}}


/* =========================================================================
   v5 首页 Dashboard + 导航全面简化（design/30-首页Dashboard+导航全面简化_详细方案v5.md）
   ========================================================================= */

/* 设置/服药 前的分隔线 */
.side-sep{height:1px;background:var(--line);margin:8px 10px;flex:none}

/* 响应式 */


/* ===== v6 首页（design/31 A 版） ===== */
/* 首页主内容区顶部内距收进，与侧栏 logo 上沿对齐，避免左侧孤立空白 */
/* 与 .container 顶部 40px 对齐；原 20px 会覆盖掉首屏呼吸留白，使间距层改动静默失效 */
main.container{padding-top:40px}

/* hero 倒计时主卡（问候/目标/连续天数已收进卡内） */
/* ⭐ 占满主区宽度，去掉 max-width 限制（避免右侧大片空白） */
/* 10/1 UI v2：hero 升级为浅青渐变主视觉（她定稿示意稿）——亮色浅青渐变，暗色深 teal 渐变白字 */
.hero{background:linear-gradient(135deg,var(--primary-50),var(--primary-100));border:1px solid var(--primary-200);border-radius:var(--radius-lg);padding:24px 28px;color:var(--ink);margin:0 0 16px;box-shadow:0 1px 2px rgba(20,60,56,.04),0 10px 30px rgba(58,154,147,.10);position:relative;overflow:hidden;display:block}
[data-theme="dark"] .hero{background:linear-gradient(132deg,var(--primary-800),var(--primary-900) 72%);border-color:rgba(255,255,255,.10);box-shadow:0 14px 40px rgba(0,0,0,.35);color:#f2f7f6}
.hero::before{content:"";position:absolute;right:-70px;top:-90px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(58,154,147,.16),transparent 66%);pointer-events:none}
[data-theme="dark"] .hero::before{background:radial-gradient(circle,rgba(255,255,255,.13),transparent 65%)}
.hero::after{display:none}
/* 问候行：替代原来的独立 .hello 横条 */
.hero-greet{display:grid;grid-template-columns:auto 1fr auto;align-items:center;column-gap:16px;margin-bottom:14px;position:relative;z-index:1}
.hero-user{display:flex;align-items:center;gap:10px;min-width:0;flex:none}
.hero-hi{font-size:15px;font-weight:700;color:var(--ink);white-space:nowrap}
[data-theme="dark"] .hero-hi{color:#fff}
.hero-date{font-size:12.5px;color:var(--muted);white-space:nowrap}
[data-theme="dark"] .hero-date{color:rgba(255,255,255,.66)}
.streak-chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;background:var(--primary-50);color:var(--primary-700);border-radius:999px;padding:4px 10px;white-space:nowrap}
[data-theme="dark"] .hero .streak-chip{background:rgba(255,255,255,.14);color:#fde68a;border:1px solid rgba(255,255,255,.20)}
.streak-chip svg{width:13px;height:13px}
.hero-main{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;position:relative;z-index:1;flex-wrap:wrap}
.hero-left{min-width:0;flex:1}
.hero-right{display:flex;flex-direction:column;align-items:flex-end;gap:10px;flex:none}
.hero-num{display:flex;align-items:baseline;gap:8px;position:relative;z-index:1;margin-bottom:6px}
/* 10/1 UI v2：核心数字换深 teal（示意稿口径，覆盖原「中性最深灰」）；等宽数字更板正 */
.hero-num .big{font-size:64px;font-weight:900;letter-spacing:-.04em;line-height:1;color:var(--primary-900);font-variant-numeric:tabular-nums}
[data-theme="dark"] .hero-num .big{color:#fff}
.hero-num .unit{font-size:20px;font-weight:600;color:var(--primary-500)}
[data-theme="dark"] .hero-num .unit{color:rgba(255,255,255,.78)}
/* 10/1 UI v2：唯一主行动按钮加大加亮（渐变底），点击跳计时页自动开表 */
.hero-cta{display:inline-flex;align-items:center;gap:9px;padding:15px 30px;background:linear-gradient(135deg,var(--primary-400),var(--primary-600));color:var(--on-primary);border-radius:15px;font-weight:800;font-size:16px;text-decoration:none;box-shadow:0 8px 22px rgba(47,134,127,.38);flex:none;transition:transform .15s,box-shadow .15s}
.hero-cta:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(47,134,127,.46);color:var(--on-primary)}
[data-theme="dark"] .hero-cta{background:var(--surface);color:var(--primary-300);box-shadow:0 10px 26px rgba(0,0,0,.35)}
[data-theme="dark"] .hero-cta:hover{color:var(--primary-200)}
.hero-cta svg{width:16px;height:16px}

/* 紧凑三卡（10/1 UI v2：双卡→三卡，新增「剩余 AI 次数」转化卡；首页专属结构） */
.meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:12px}   /* 10/1 晚修：AI 卡删除后只有 2 张卡，3 列遗留规则导致 >1100px 视口下右列空一块（她报的「铺不满」） */
@media(max-width:1100px){ .meta{grid-template-columns:1fr 1fr} }
.meta-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;display:flex;justify-content:space-between;align-items:center;transition:transform .2s,box-shadow .2s,border-color .2s;box-shadow:var(--shadow);text-decoration:none;color:var(--ink);position:relative}
.meta-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-card-hover);border-color:var(--primary-200)}
.meta-left .label{font-size:12.5px;color:var(--muted);font-weight:600;margin-bottom:4px}
.meta-left .val{font-size:22px;font-weight:800;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.meta-left .val .u{font-size:13px;color:var(--muted);font-weight:500;margin-left:2px}
.meta-left .hint{font-size:12px;color:var(--muted);margin-top:2px}
.meta-ico{width:52px;height:52px;border-radius:15px;background:var(--primary-50);color:var(--primary-500);display:inline-flex;align-items:center;justify-content:center;flex:none}
.meta-ico svg{width:24px;height:24px}
.meta-ico.blue{background:var(--vocab-soft);color:var(--vocab-text)}

/* 底部轻量条（10/1 UI v2：PWA 安装小字链接；fs-vip 升级会员入口已整体下线——她拍板会员/非会员都不显示 10/1 晚） */
.foot-strip{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 22px;padding:14px 0 2px;font-size:12.5px;color:var(--n-500)}
.foot-strip a{color:var(--n-600);text-decoration:none;border-bottom:1px dotted var(--n-400);padding-bottom:1px;cursor:pointer;transition:color .16s,border-color .16s}
.foot-strip a:hover{color:var(--primary-600);border-bottom-color:var(--primary-500)}
[data-theme="dark"] .foot-strip a{color:var(--muted);border-bottom-color:var(--line)}

/* 额度/会员轻条（10/1）：底部浮出小提示条 = 文案 + 「开会员」按钮 + 关闭；8s 自动消失 */
#hubLimitStrip{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:99960;
  display:flex;align-items:center;gap:12px;max-width:min(92vw,560px);
  background:var(--surface);border:1px solid #f0e2c8;border-radius:14px;padding:11px 14px 11px 16px;
  box-shadow:0 10px 34px rgba(20,30,40,.16);animation:hubLimitIn .22s ease}
#hubLimitStrip .ls-txt{font-size:13px;font-weight:600;color:var(--ink);line-height:1.5}
#hubLimitStrip .ls-btn{flex:none;font-size:12.5px;font-weight:800;text-decoration:none;color:#fff;
  background:linear-gradient(135deg,var(--primary-400),var(--primary-600));border-radius:999px;padding:6px 14px}
#hubLimitStrip .ls-btn:hover{filter:brightness(1.06)}
#hubLimitStrip .ls-x{flex:none;border:none;background:none;color:var(--n-500);font-size:13px;cursor:pointer;padding:2px 4px}
@keyframes hubLimitIn{from{opacity:0;transform:translateX(-50%) translateY(10px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
[data-theme="dark"] #hubLimitStrip{background:var(--surface-2);border-color:rgba(251,191,36,.30);box-shadow:0 10px 34px rgba(0,0,0,.5)}
@media (prefers-reduced-motion:reduce){ #hubLimitStrip{animation:none} }

/* 6 模块快速入口（首页 .qc 走 6 列；其它页面若用 4 个走 .qc-4） */
.quick{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:12px}
.qc{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 6px 12px;text-align:center;text-decoration:none;color:var(--ink);transition:transform .18s,box-shadow .18s,border-color .18s;display:flex;flex-direction:column;align-items:center;box-shadow:var(--shadow)}
.qc:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--primary)}
/* 48px 极低饱和浅底圆角方 + 单色图标（去厚重、去刺眼） */
.qc-ico{width:48px;height:48px;margin:0 auto 6px;border-radius:14px;background:var(--mod-soft,var(--primary-50));color:var(--mod,var(--primary-500));display:inline-flex;align-items:center;justify-content:center;box-shadow:none}
.qc-ico svg{width:24px;height:24px}
.qc-nm{font-size:13.5px;font-weight:700}
/* 今日学习记录 */
.rec{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px 20px}
.rec-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}
.rec-h h3{margin:0;font-size:15px;font-weight:700}
.rec-total{font-size:13px;color:var(--muted)}
.rec-total b{color:var(--ink);font-weight:800}
.rec-row{display:flex;align-items:center;gap:12px;margin:6px 0;font-size:13.5px}
.rec-row .nm{width:62px;color:var(--ink);font-weight:600;flex:none}
.rec-row .bar{flex:1;height:8px;background:var(--primary-50);border-radius:999px;overflow:hidden}
.rec-row .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--primary-400),var(--primary-500));border-radius:999px;transition:width .6s cubic-bezier(.4,0,.2,1)}
.rec-row .dur{font-size:13px;color:var(--muted);min-width:54px;text-align:right;font-weight:600}

/* ===== 首页 · 今日任务卡（9/20：打开首页就知道今天该做什么）===== */
/* 全部走 token 变量，暗色随 [data-theme="dark"] 自动翻转；任务行复用 .plan-item 勾选框/删除线组件 */
.dash-tasks{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px 20px;margin-bottom:12px}
.dash-tasks-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:6px}
.dash-tasks-h h3{margin:0;font-size:15px;font-weight:700}
.dash-tasks-count{font-size:13px;color:var(--muted);flex:none}
.dash-tasks-count b{color:var(--ink);font-weight:800}
/* 细进度条（百分比） */
.dash-tasks-bar{height:6px;background:var(--primary-50);border-radius:999px;overflow:hidden;margin-bottom:4px}
[data-theme="dark"] .dash-tasks-bar{background:var(--surface-2)}
.dash-tasks-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--primary-400),var(--primary-500));border-radius:999px;transition:width .6s cubic-bezier(.4,0,.2,1)}
/* 系统建议行：非任务、不可勾选；N=0 时无右侧链接 */
.dash-tasks-tip{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 0;font-size:13.5px;color:var(--muted)}
.dash-tasks-tip .txt{flex:1;min-width:0;word-break:break-word}
.dash-tasks-tip a{color:var(--primary);font-weight:700;text-decoration:none;flex:none;white-space:nowrap}
.dash-tasks-tip a:hover{text-decoration:underline}
/* 任务行：复用 .plan-item（勾选框 18px / accent / 完成删除线置灰都在原样式里） */
.dash-tasks .plan-item{padding:8px 0}
/* 超长任务文本换行不撑破布局 */
.dash-tasks .plan-text{flex:1;min-width:0;word-break:break-word;white-space:normal;cursor:default}
/* 9/24：能识别目标的任务整行可点 → 跳转 + 落地自动开计时；识别不出的行保持默认不可点 */
.dash-tasks .plan-item.jumpable{cursor:pointer;border-radius:var(--radius-sm);margin:0 -6px;padding-left:6px;padding-right:6px}
.dash-tasks .plan-item.jumpable:hover{background:var(--primary-soft)}
.dash-tasks .plan-item.jumpable:hover .plan-text{color:var(--primary)}
/* 全部任务完成的正向反馈（不引入 XP/积分字段） */
.dash-tasks-done{padding:8px 0 2px;font-size:13.5px;font-weight:700;color:var(--primary)}
/* 空状态：引导去计划页 */
.dash-tasks-empty{padding:4px 0 2px}
.dash-tasks-empty .tip{font-size:13.5px;color:var(--muted);margin-bottom:10px}
.dash-tasks-empty .btn-row{display:flex;gap:10px;flex-wrap:wrap}
.dash-tasks-empty .btn{padding:8px 14px;font-size:13.5px}

/* 首页去 teal 玻璃化：页面与卡片回退到中性白底，无浅绿渐变、无 hover 光晕 */
.home{
  position:relative;
  background:var(--bg);
  border-radius:var(--radius);
}
/* 响应式 */
@media(max-width:760px){
  main.container{padding-top:18px}
  .meta{grid-template-columns:1fr}
  .quick{grid-template-columns:repeat(3,1fr)}
  .hero-num .big{font-size:48px}
  .hero-greet{flex-wrap:wrap;gap:6px}
  .hero-main{flex-direction:column;align-items:flex-start}
  .hero-right{align-items:flex-start}
}

/* ===== 回顾页 · 口语模考错误总结模块 ===== */
.ms-sum-overall{font-size:14px;line-height:1.7;color:var(--primary-d);font-weight:600;margin:0 0 4px}
.ms-sum-list{display:flex;flex-direction:column;gap:12px;margin-top:6px}
.ms-sum-item{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.ms-sum-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.ms-sum-type{font-weight:600;font-size:15px;color:var(--ink)}
.ms-sum-count{font-size:13px;color:var(--muted);white-space:nowrap}
.ms-sum-bar{height:6px;background:var(--line);border-radius:4px;margin:8px 0 6px;overflow:hidden}
.ms-sum-bar i{display:block;height:100%;border-radius:4px;transition:width .3s ease}
.ms-sum-freq{font-size:13px;color:var(--ink-2);line-height:1.6}
.ms-sum-advice{font-size:13px;color:var(--muted);margin-top:4px;line-height:1.6}
#histPlans{padding:0 20px 18px}

/* ===== 单词 · 全屏沉浸式背词 =====
   9/13 统一视觉语言（之之反馈：非全屏版更好看）：
   保留「全屏」的功能语义 —— 无侧边栏 / 无页头 / 无悬浮物 / 整屏 / 答题态锁死不滚；
   视觉上不再「整页铺灰 + 720 窄列 + vh 放大字号」，改为与非全屏同一套：
   灰底舞台上一张白色圆角卡片（复用 .card 的白底/1px 边/16px 圆角/--shadow），
   卡片宽对齐非全屏容器（1080），卡内所有尺寸·间距·排版一律回落到
   .practice-card-fit / #practiceBody.practice-body-fit 的基础规则 = 两套模式同一份数值。
   ⚠️ 这里只允许写「全屏专属」的事（显隐、舞台、卡片外壳、锁滚），
   凡元素级字号/高度/间距都不要再复制一份，否则又会跟非全屏漂移。 */
body.word-fullscreen{padding-left:0 !important;padding-right:0 !important;overflow-x:hidden !important;overflow-y:auto !important}
body.word-fullscreen .top-nav{display:none !important}
body.word-fullscreen .side-collapse{display:none !important}
body.word-fullscreen .page-title{display:none}
body.word-fullscreen .page-head-row{display:none}   /* 空壳仍占 22px margin，全屏态直接摘掉 */
body.word-fullscreen .word-tabs{display:none}

/* ① 舞台：9/15 之之要求全屏铺满——容器去内边距与居中，白卡直接铺满整个视口（不再灰底留边）。
   上下左右留白全部交给卡片自身 clamp 内边距控制，大屏不散、小屏不贴边。 */
body.word-fullscreen main.container{
  padding:0 !important;max-width:none !important;min-height:100vh;
  display:flex;flex-direction:column;
  background:var(--surface,#fff);
}
body.word-fullscreen #studyView.study-view-fit{
  min-height:0;width:100%;flex:1;background:transparent;
  display:flex;flex-direction:column;
}

/* ② 卡片外壳：铺满整个视口（去描边/圆角/阴影 = 无「框」感），内边距随视口弹性伸缩 */
body.word-fullscreen .practice-card.practice-card-fit{
  flex:1;min-height:100vh;width:100%;max-width:none;margin:0;
  border:none;border-radius:0;box-shadow:none;
  /* 10/2 之之（iOS 26 实测）：viewport-fit=cover 下内容顶进状态栏玻璃淡化区 → 顶部「发淡」；
     padding-top 补 safe-area + 适度上调（36→46px 顶），整体内容下移一点点，底部大空白同步收窄。
     底部 padding 保持不动（剩余空间本来就沉底，无需再喂）。 */
  padding:calc(env(safe-area-inset-top, 0px) + clamp(18px,4.2vh,46px)) clamp(20px,4vw,60px) clamp(16px,3vh,36px);
  justify-content:flex-start;   /* 顶部饱满：内容从视口上方开始（之之 9/17「像秃头」——顶部大空隙否决） */
}

/* ③ 全屏答题态：锁死视口禁止滑动（之之 9/8）。卡片 = 整个视口（height 100vh），内容由 ⑤ 弹性分布。 */
html:has(body.word-fullscreen #practiceBody .opts-grid){overflow:hidden}
body.word-fullscreen:has(#practiceBody .opts-grid){overflow:hidden !important}
body.word-fullscreen:has(#practiceBody .opts-grid) main.container{height:100vh;overflow:hidden}
body.word-fullscreen:has(#practiceBody .opts-grid) .practice-card.practice-card-fit{
  height:100vh;max-height:none;min-height:0;overflow:hidden;
}
body.word-fullscreen .practice-tools-row{ display:none !important; }
/* ④ 全屏沉浸不留任何悬浮物：dock + 底部计时胶囊都要藏。
   ⚠️ 9/13 修：这两条原来只写在 @media(max-width:860px) 里 → 桌面宽度（>860）全屏时
   #floatTimer 不被隐藏（它没有响应式开关，一直 display:flex），会浮在卡片下沿、
   矮窗口直接压在喇叭按钮上。移到全局作用域。 */
body.word-fullscreen #hubDock{ display:none !important; }
/* 10/8 晚：考试全屏（真题/自练）也彻底不显示底栏——她截图实抓 dock 压在真题页上 */
body.exam-fullscreen #hubDock{ display:none !important; }

/* ④b 计时胶囊：全屏态**照常显示**，但换成「右上角极简版」。
   ⚠️ 9/19 之之反馈：全屏背单词时看不到悬浮计时，不知道到底在不在计时 → 不再 display:none。
   ⚠️ 位置不能回到默认的「底部居中」——9/13 实测会压在喇叭/按钮上（矮窗口尤其明显）。
      改挂右上角：全屏态题干区（单词/音标/释义）整体居中、两侧留白，右上角只与
      「居中单行单词」的空白侧边共存，不遮任何内容。
   ⚠️ :not([hidden]) 必须写：`.float-timer[hidden]{display:none!important}` 特异性(0,2,0)
      低于 `body.word-fullscreen #floatTimer`(1,1,1)，不加 :not 会让没在计时时也冒出空胶囊。
   ⚠️ animation:none 必须写：ftIn 关键帧带 translate(-50%,…)，会覆盖上面的 transform:none
      把胶囊拽回屏幕中间。 */
body.word-fullscreen #floatTimer:not([hidden]){
  display:flex !important;
  left:50%; right:auto; top:auto; bottom:8px; transform:translateX(-50%);
  padding:3px 9px; gap:6px; font-size:11px;
  box-shadow:0 2px 8px -3px rgba(58,154,147,.45);
  animation:none;
}
/* 全屏态只留「跳动的点 + 时间」：看见胶囊=在计时。标签文字和结束按钮都收起，
   避免占宽压到题干、也避免全屏里误触结束。 */
body.word-fullscreen #floatTimer .ft-label,
body.word-fullscreen #floatTimer .ft-stop{ display:none !important; }
/* 矮窗口回退档（9/26 实测分界）：视口高 ≤530px 时喇叭按钮底(~483px)会顶进胶囊区，
   底部居中必叠（9/13 挪右上角的根因）→ 矮窗口自动回右上角，正常高度保持底部居中（她 9/26 拍板）。 */
@media (max-height: 530px){
  body.word-fullscreen #floatTimer:not([hidden]){
    left:auto; right:10px; top:8px; bottom:auto; transform:none;
  }
}

/* ④b 内容列：铺满后加宽（960 → min(88vw,1120px)），题目/选项/按钮吃到全屏宽度红利 */
body.word-fullscreen #practiceBody.practice-body-fit .last-word, body.word-fullscreen #practiceBody.practice-body-fit .practice-topzone, body.word-fullscreen #practiceBody.practice-body-fit .practice-word-area, body.word-fullscreen #practiceBody.practice-body-fit .opts-grid, body.word-fullscreen #practiceBody.practice-body-fit .answer-btns, body.word-fullscreen #practiceBody.practice-body-fit .pw-speaker-wrap, body.word-fullscreen #practiceBody.practice-body-fit .practice-tools-row { width:100%;max-width:min(88vw,1120px); }

/* ④c 垂直分布（9/17 五调定稿，之之：普通态构图美观大方，全屏照搬——紧凑贴顶+底部自然留白，禁止把屏幕撑开塞空隙）：
   全屏 = 普通态同一套间距（顶隙 12-20px、题干~选项 12px、按钮组 12px），仅题干区微放大；
   word-area 锁高（≥答后词+音标+2行释义）→ 答题零抖动；剩余空间全部沉底。 */
body.word-fullscreen #practiceBody.practice-body-fit{
  flex:1 1 auto;
  justify-content:flex-start;
  gap:0;
}
body.word-fullscreen #practiceBody.practice-body-fit .practice-topzone{ display:none; }
body.word-fullscreen #practiceBody.practice-body-fit .practice-word-area{
  flex:none;min-height:clamp(135px,17vh,155px);margin-bottom:0;
  margin-top:clamp(12px,2vh,20px);
  display:flex;flex-direction:column;justify-content:flex-start;   /* 顶部对齐：词/音标位置恒定，答后释义向下生长（居中版会因内容变高重算导致词抖动——之之实测反馈） */
}
body.word-fullscreen #practiceBody.practice-body-fit .pw-cn{ min-height:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; }
body.word-fullscreen #practiceBody.practice-body-fit .opts-grid{ margin-top:14px; }   /* 10/2 她反馈「下面空隙太多、整体不协调」：段间距 12→14 微调（9/16 收紧的口径不推翻，只 +2） */
body.word-fullscreen #practiceBody.practice-body-fit .answer-btns{ margin-top:14px; }
body.word-fullscreen #practiceBody.practice-body-fit .pw-speaker-wrap{ margin-top:14px; padding-top:0; }
body.word-fullscreen #practiceBody.practice-body-fit .pw-en{ font-size:clamp(38px,4.6vh,52px); }
body.word-fullscreen #practiceBody.practice-body-fit .pw-ipa{ font-size:clamp(15px,1.9vh,18px); }
body.word-fullscreen #practiceBody.practice-body-fit .pw-cn{ font-size:clamp(15px,1.9vh,18px); }
body.word-fullscreen #practiceBody.practice-body-fit .opts-grid{ gap:clamp(10px,1.6vh,18px); }   /* 10/2 微放宽：1.5vh/16 → 1.6vh/18（她「间隙更协调」；9/16 收紧口径大体保留） */
body.word-fullscreen #practiceBody.practice-body-fit .opt-big{ height:clamp(80px,12.4vh,114px); }   /* 10/2 微放宽：12vh/110 → 12.4vh/114（吃掉底部空白 ~8px） */
body.word-fullscreen #practiceBody.practice-body-fit .opt-big-cn{ font-size:clamp(14px,1.8vh,17px); }   /* 9/16 之之：选项中文字体缩小（原 15/2.2vh/21） */
body.word-fullscreen #practiceBody.practice-body-fit .abtn-unknown{ height:clamp(40px,5.5vh,48px); }
body.word-fullscreen #practiceBody.practice-body-fit .pw-speaker-wrap{ padding-top:0; }
body.word-fullscreen #practiceBody.practice-body-fit .pw-speaker-wrap .tool-btn{ width:clamp(48px,6.2vh,58px); height:clamp(48px,6.2vh,58px); }

/* 窄屏（手机）：铺满态下只收窄卡片左右内边距。
   ⚠️ 10/2 她实测（iOS 26）：这条原来写死 padding:16px 16px，把桌面版新顶隙（safe-area+4.2vh）
   整个盖掉 → 内容贴死浏览器顶栏玻璃淡化区「连击行发淡」。改为与桌面同一套上下顶隙、只保留左右 16。 */
@media(max-width:860px){
  body.word-fullscreen .practice-card.practice-card-fit{
    padding:calc(env(safe-area-inset-top, 0px) + clamp(18px,4.2vh,46px)) 16px clamp(16px,3vh,36px);
  }
}

/* ===== 写作真题 · 全屏沉浸式练习页 ===== */
body.exam-fullscreen{padding-left:0 !important;padding-right:0 !important}
body.exam-fullscreen .top-nav{display:none !important}
body.exam-fullscreen .side-collapse{display:none !important}
body.exam-fullscreen main.container{padding:0 !important;max-width:none !important}
body.exam-fullscreen{overflow:hidden !important;height:100dvh}
body.exam-fullscreen main.container{height:100dvh;overflow:hidden;display:flex;flex-direction:column}
body.exam-fullscreen main.container > *{min-height:0;overflow:auto}
body.exam-fullscreen .page-title{display:none}
body.exam-fullscreen #writeTabs{display:none}
/* 9/10 之之：全屏答题界面要固定住不滑动。.page-head-row 两子元素 hide 后空壳仍占 margin（同背词页 63f2007 坑）
   → 整行 display:none；body 锁滚动，页面总高=100vh 整屏，长题目走 .exam-q 内部滚动 */
body.exam-fullscreen .page-head-row{display:none !important}
body.exam-fullscreen{overflow:hidden !important}

#examPractice{display:flex;flex-direction:column;height:100vh;background:var(--bg);box-sizing:border-box}

.exam-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 32px 14px;border-bottom:1px solid var(--line);background:var(--surface)}
.exam-part{margin:0;font-size:22px;font-weight:800;color:var(--ink);letter-spacing:-.01em}
.exam-instr{margin:4px 0 0;font-size:13.5px;color:var(--muted);line-height:1.5}
.exam-exit-full{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--bg);color:var(--muted);border-radius:9px;padding:7px 12px;font-size:13px;cursor:pointer;flex:none;transition:.15s}
.exam-exit-full:hover{color:var(--primary);border-color:var(--primary)}

.exam-split{flex:1;display:flex;min-height:0}
.exam-q{width:50%;overflow-y:auto;padding:0;background:var(--surface);border-right:1px solid var(--line);box-sizing:border-box}
.exam-q-body-wrap{padding:24px 28px 28px}
.exam-q-lead{font-size:14px;color:var(--ink);margin:0 0 14px;font-weight:600}
.exam-q-body{font-size:15.5px;line-height:1.85;color:var(--ink)}
.exam-q-body .ei-zh{font-size:16px;font-weight:700;line-height:1.7;margin-bottom:10px}
.exam-q-body .ei-en{font-size:14px;color:var(--ink);line-height:1.8}
.exam-q-note{margin:16px 0 0;font-size:13px;color:var(--muted);line-height:1.7}

.exam-a{width:50%;display:flex;flex-direction:column;min-height:0;padding:28px 32px 0;box-sizing:border-box}
/* 写作真题 · 作文输入框（Uiverse Jaareet .input 改写，深色内胆 + skyblue 聚焦光环）
   ⚠️ 原稿全用 vw（.8vw 字号在 1440 窗口=11.5px、手机 375=3px 不可读）→ 按桌面观感换算为固定 px：
   font .8vw→15px / radius·padding .4vw→8px·14-16px / 光环 .15vw→3px / 阴影 .4vw→8px。
   去掉原稿 max-width:190px（作文框需铺满）。 */
.exam-textarea{flex:1;width:100%;border:1px solid var(--line);border-radius:12px;padding:18px;font:inherit;font-size:15.5px;line-height:1.85;background:var(--bg);color:var(--ink);resize:none;box-sizing:border-box;outline:none;transition:border-color .15s}
.exam-textarea:focus{border-color:var(--primary)}
.exam-textarea::placeholder{color:var(--muted)}
.exam-a-foot{display:flex;justify-content:flex-end;padding:10px 2px 14px}
.exam-wc{font-size:13px;color:var(--muted);font-weight:600}

.exam-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 32px;border-top:1px solid var(--line);background:var(--surface)}
.exam-bar-left{display:flex;align-items:center;gap:14px}
.exam-step{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:7px;background:var(--primary);color:var(--on-primary);font-size:13px;font-weight:800;flex:none}
.exam-step-label{font-size:14px;font-weight:700;color:var(--ink)}
.exam-bar-right{display:flex;align-items:center;gap:10px}
.btn-exam-ghost{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--primary);background:var(--surface);color:var(--primary);border-radius:9px;padding:9px 16px;font-size:14px;font-weight:600;cursor:pointer;transition:.15s}
.btn-exam-ghost:hover{background:var(--primary-soft)}
.btn-exam-exit{background:var(--err-bg);color:var(--err-text);border:1px solid var(--err);border-radius:9px;padding:9px 18px;font-size:14px;font-weight:600;cursor:pointer;transition:.15s}
.btn-exam-exit:hover{background:var(--err);color:var(--surface)}

@media(max-width:860px){
  .exam-split{flex-direction:column;overflow-y:auto}
  .exam-q,.exam-a{width:100%;border-right:none}
  .exam-q{border-bottom:1px solid var(--line)}
  .exam-a{min-height:300px}
  .exam-head,.exam-bar{padding-left:16px;padding-right:16px}
  .exam-q,.exam-a{padding-left:16px;padding-right:16px}
}

/* ===== 模板默写面板：功能条 / 句子勾选 / 常错标记 ===== */
.dict-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.dict-switch{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;cursor:pointer;user-select:none}
.dict-switch input{width:16px;height:16px;accent-color:var(--primary);cursor:pointer}
.dict-sent-pick{font-size:13.5px;line-height:1.6}
.dict-sent-pick .dict-sent-item{display:block;margin:3px 0;cursor:pointer}
.dict-sent-pick .dict-sent-item input{width:15px;height:15px;accent-color:var(--primary);margin-right:4px;cursor:pointer}
.dict-weak-tag{color:var(--warn-ink);font-weight:700;font-size:12px;margin-left:4px}

/* ===== 全站跳转加载遮罩（IELTS 逐字淡入 · Type Reveal · 全英文） ===== */
.hub-loader{
  position:fixed; inset:0; z-index:9999;
  display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(1100px 560px at 100% -8%, rgba(58,154,147,.05), transparent 60%),
    var(--bg);
  opacity:0;
  transition:opacity .16s ease;
  pointer-events:none;
}
.hub-loader.show{ opacity:1; pointer-events:auto; }
.hub-loader .ui-loader{ margin-bottom:8px; }
@media (prefers-reduced-motion: reduce){
  .hub-loader .ui-loader-dot,
  .hub-loader .ui-loader-shadow{ animation:none; }
  .hub-loader .ui-loader-dot{ top:20px; height:20px; border-radius:50%; transform:none; }
  .hub-loader .ui-loader-shadow{ opacity:.5; transform:scaleX(1); }
  /* design/53 动效铁律：开启减弱动效后关闭一切位移与过渡 */
  .card:hover,.meta-card:hover,.qc:hover,.side-timer:hover,.btn:hover,.hero-cta:hover{ transform:none !important; transition:none !important; }
}

/* ===== 全站计时悬浮标签（底部居中 · 跨页常驻）——design/55 紧凑化（2026-09-07） ===== */
.float-timer{
  position:fixed; left:50%; bottom:14px; transform:translateX(-50%);
  z-index:8000; display:flex; align-items:center; gap:8px;
  padding:5px 6px 5px 12px; border-radius:999px;
  background:var(--primary); color:#fff;
  box-shadow:0 4px 14px -4px rgba(58,154,147,.5);
  font-size:12px; max-width:92vw;
  animation:ftIn .18s ease;
}
.float-timer[hidden]{ display:none !important; }
.ft-dot{ width:7px; height:7px; border-radius:50%; background:#fff; flex:0 0 auto; animation:ftPulse 1.2s ease-in-out infinite; }
.ft-label{ font-weight:600; white-space:nowrap; opacity:.95; max-width:40vw; overflow:hidden; text-overflow:ellipsis; }
.ft-time{ font-variant-numeric:tabular-nums; font-weight:700; letter-spacing:.3px; }
.ft-stop{ margin-left:2px; border:none; background:rgba(255,255,255,.22); color:#fff;
  font-size:11px; font-weight:700; padding:4px 11px; border-radius:999px; cursor:pointer; flex:0 0 auto; }
.ft-stop:active{ background:rgba(255,255,255,.36); }
@keyframes ftPulse{ 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.35;transform:scale(.7)} }
@keyframes ftIn{ from{opacity:0;transform:translate(-50%,12px)} to{opacity:1;transform:translate(-50%,0)} }
@media (prefers-reduced-motion: reduce){
  .ft-dot{ animation:none; }
  .float-timer{ animation:none; }
}

/* ===================================================================
   移动端适配增强（手机竖屏 ≤640px）
   表单行默认 flex 并排会在窄屏挤压 → 改为纵向堆叠、输入框占满、按钮全宽
   =================================================================== */
@media (max-width:640px){
  /* 表单行：纵向堆叠 */
  .form-row{ display:block; }
  .form-row > div{ width:100% !important; flex:none !important; margin-bottom:12px; }
  .form-row > div:last-child{ margin-bottom:0; }
  .form-row > label{ display:block; margin-bottom:5px; font-size:13px; }
  .form-row > span{ display:block; margin-top:6px; }

  /* 输入框 / 下拉 / 文本域占满；16px 防止 iOS 聚焦缩放 */
  .form-row input:not([type=checkbox]):not([type=radio]),
  .form-row select,
  .form-row textarea{
    width:100% !important; max-width:100% !important;
    box-sizing:border-box; font-size:16px; min-height:44px;
  }
  .form-row input[type=checkbox],
  .form-row input[type=radio]{ width:18px; height:18px; }

  /* 行内组合（日期+徽章 / key+显示按钮）也纵向堆叠 */
  .form-row div[style*="display:flex"]{
    flex-direction:column !important; align-items:stretch !important; gap:8px;
  }
  .form-row div[style*="display:flex"] > *{ width:100% !important; }

  /* 按钮行：按钮全宽竖排，更易点 */
  .form-row .btn,
  .form-row button.btn{ width:100%; margin:0 0 8px; }
  .form-row button.btn:last-child{ margin-bottom:0; }
  .form-row button[style*="margin-left:auto"]{ margin-left:0 !important; }

  /* 计划页今日计划日期行（label 直接子 + 说明 span） */
  .form-row input[type=date]{ width:100% !important; max-width:100% !important; flex:none !important; }

  /* 10/2 删旧补丁「#sExam 压 38px/14px」：date 输入已在全局重置 appearance（根因修复），
     且 14px < 16px 会触发 iOS 聚焦自动放大，回归移动端统一规格（16px + min-height 44） */

  /* 卡片内联 sticky 保存条：竖排、按钮全宽置底 */
  section.card[style*="position:sticky"]{
    flex-direction:column-reverse !important; align-items:stretch !important; gap:10px;
  }
  section.card[style*="position:sticky"] .btn{ min-width:0 !important; width:100%; }

  /* pill 标签页窄屏允许换行，避免溢出 */
  .tabs.pill-tabs{ flex-wrap:wrap; }
  /* review 页 4 个 tab 强制一行，去除图标后仍可容纳 */
  .tabs.pill-tabs.review-pill-tabs{ flex-wrap:nowrap; }
  .tabs.pill-tabs.review-pill-tabs .pill-tab{ padding:8px 14px; font-size:13px; }

  /* 计划页「计划」区按钮行：堆叠后居中 */
  .plan-actions{ flex-direction:column; align-items:stretch; gap:10px; }
  .plan-actions-right{ display:flex; flex-direction:column; gap:10px; }
  .plan-actions-right .btn{ width:100%; }

  /* 词库列表窄屏：只保留英文+中文，隐藏词性/读音/等级 */
  .wl-lv { display:none; }
  .wl-word{ max-width:45%; }
  }

/* ===== 通用错误提示卡片 ui-err-*（Uiverse kennyotsu 改写：Tailwind 红 #F87171/#991B1B/#B91C1C/rgb(254 242 242) → teal --err/--err-bg/--err-text；通用类 .flex/.error-alert/.error-svg 重命名为 .ui-err-* 防冲突） ===== */
.ui-err-box{ display:flex; flex-direction:column; gap:12px; width:100%; max-width:420px; font-family:inherit; }
.ui-err-card{
  display:flex; align-items:flex-start; gap:12px;
  background:var(--err-bg);
  border:1px solid var(--err);
  border-left:4px solid var(--err);
  border-radius:var(--radius-sm);
  padding:14px 14px 14px 12px;
  color:var(--err-text);
  box-shadow:0 2px 8px color-mix(in srgb, var(--err) 12%, transparent);
}
.ui-err-icon{ flex:none; width:22px; height:22px; margin-top:1px; color:var(--err); }
.ui-err-icon svg{ width:100%; height:100%; display:block; }
.ui-err-body{ flex:1; min-width:0; }
.ui-err-title{ margin:0 0 6px; font-size:14px; font-weight:700; color:var(--err-text); line-height:1.4; }
.ui-err-list{ margin:0; padding-left:18px; display:flex; flex-direction:column; gap:3px; }
.ui-err-list li{ font-size:13px; line-height:1.5; color:var(--err-text); }
.ui-err-close{
  flex:none; align-self:flex-start; border:none; background:transparent; cursor:pointer;
  width:24px; height:24px; border-radius:6px; display:flex; align-items:center; justify-content:center;
  color:var(--err-text); font-size:18px; line-height:1; transition:background .15s;
}
.ui-err-close:hover{ background:color-mix(in srgb, var(--err) 16%, transparent); }

/* ===== 通用 AI 唤起按钮 ai-btn（Uiverse ilkhoeri 改写：Tailwind 黄 #efad21/#ffd60f/#ffea50 → teal --primary-d/--primary-bright；sparkle 脉冲 + 悬停放大/文字淡出交互保留；原 .group/.relative 等 Tailwind 工具类无站点冲突，改名 .ai-btn 零冲突） ===== */
.ai-btn{
  --sz-btn:48px;
  --space:calc(var(--sz-btn) / 5.5);
  --gen-sz:calc(var(--space) * 2);
  --sz-text:calc(var(--sz-btn) - var(--gen-sz));
  position:relative;
  width:var(--sz-btn); height:var(--sz-btn);
  border:1px solid transparent; border-radius:var(--radius-sm);
  display:flex; align-items:center; justify-content:center;
  aspect-ratio:1 / 1; cursor:pointer; outline:none;
  background:linear-gradient(45deg, var(--primary-d), var(--primary-bright));
  box-shadow:rgba(60,64,67,.30) 0 1px 2px 0, rgba(60,64,67,.15) 0 2px 6px 2px, rgba(0,0,0,.30) 0 30px 60px -30px, rgba(52,52,52,.35) 0 -2px 6px 0 inset;
  transition:transform .2s;
  font-family:inherit;
}
.ai-btn:active{ transform:scale(.95); }
.ai-btn-spark{
  position:absolute; z-index:10; overflow:visible;
  color:var(--on-primary);
  top:calc(var(--sz-text) / 7); left:calc(var(--sz-text) / 7);
  width:var(--gen-sz); height:var(--gen-sz);
  transition:all .3s;
  animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite;
}
.ai-btn:hover .ai-btn-spark{
  color:var(--on-primary);
  width:var(--sz-text); height:var(--sz-text);
  left:calc(var(--sz-text) / 4); top:calc(var(--gen-sz) / 2);
}
.ai-btn-label{
  font-size:var(--sz-text);
  font-weight:800; line-height:1; color:var(--on-primary);
  transition:opacity .2s;
}
.ai-btn:hover .ai-btn-label{ opacity:0; }
@keyframes pulse{ 50%{ opacity:.5 } }

/* ===== 通用玻璃拟态底栏导航 ui-menu（Uiverse mymiamo 改写：Apple 蓝 rgba(0,122,255,…) → teal 半透明 --primary；未定义变量 --glass-border/--ease-spring 本地化为 --glass-border/--ease-spring；原 .menu 超通用改名 .ui-menu 防冲突；fixed 定位按源注释保留为可选项，不加避免误盖内容） ===== */
.ui-menu{
  --glass-border:rgba(255,255,255,.28);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  position:relative;
  width:calc(100% - 20px);
  max-width:520px;
  backdrop-filter:blur(12px) saturate(180%) contrast(200%);
  -webkit-backdrop-filter:blur(12px) saturate(180%) contrast(200%);
  background:color-mix(in srgb, var(--primary-d) 88%, #08201d); /* 深 teal 近实色，保证浅色页面上白字/白图标清晰可辨（原 40% 主色+透明在白底下几乎隐形） */
  border:1px solid var(--glass-border);
  box-shadow:0 10px 30px rgba(0,0,0,.06);
  padding:8px;
  border-radius:99rem;
  display:flex;
  justify-content:center;
  gap:8px;
  z-index:50;
}
.ui-menu::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  box-shadow:
    inset 2px 2px 5px -2px rgba(255,255,255,.4),
    inset -2px -2px 5px 2px rgba(255,255,255,.4),
    inset 0 -2px 0 rgba(255,255,255,.2);
  pointer-events:none;
  z-index:-1;
}
.ui-menu a{
  display:flex;
  flex-direction:column;
  align-items:center;
  flex:1 1 0;
  min-width:0;
  color:rgba(255,255,255,1);
  text-shadow:0 1px 2px rgba(0,0,0,.3);
  text-decoration:none;
  padding:10px 6px;
  border-radius:999rem;
  -webkit-tap-highlight-color:transparent;
  transition:background .18s var(--ease-spring), color .18s var(--ease-spring), transform .18s var(--ease-spring), box-shadow .3s ease-in-out;
}
.ui-menu a:hover{
  background-color:rgba(255,255,255,.3);
  box-shadow:
    inset 2px 2px 5px -2px rgba(255,255,255,.4),
    inset -2px -1px 5px 0 rgba(255,255,255,.4),
    inset 0 -2px 0 rgba(255,255,255,.2);
  transform:rotate(2.2deg);
  color:var(--primary-d);
}
.ui-menu a svg{ width:1.4rem; height:1.4rem; }
.ui-menu a span{ font-size:.8rem; font-weight:600; line-height:1; margin-top:4px; }
.ui-menu a.active{ background:rgba(255,255,255,.55); color:var(--primary-d); }
.ui-menu a:active{ transform:scale(.98); }
/* dock 的「更多」用 <button>（非 <a>），补一套等价样式使其与导航项视觉一致 */
.ui-menu button.ui-menu-item{
  display:flex;flex-direction:column;align-items:center;flex:1 1 0;min-width:0;
  color:rgba(255,255,255,1);text-shadow:0 1px 2px rgba(0,0,0,.3);text-decoration:none;padding:10px 6px;border-radius:999rem;
  background:none;border:none;cursor:pointer;font-family:inherit;font-size:inherit;-webkit-tap-highlight-color:transparent;
}
.ui-menu button.ui-menu-item svg{ width:1.4rem; height:1.4rem; }
.ui-menu button.ui-menu-item span{ font-size:.8rem; font-weight:600; line-height:1; margin-top:4px; }
.ui-menu button.ui-menu-item:active{ transform:scale(.98); }

/* ===== 通用搜索输入 ui-search（Uiverse ozgeozkaraa01 改写：indigo rgba(129,140,248)→teal --primary；slate #f8fafc/#94a3b8/#0d0c22→--surface-2/--muted/--ink；原 .group/.input/.icon 超通用改名 .ui-search*，且原 input:hover 裸元素选择器会污染全站输入框 → 改 .ui-search-input:hover 作用域） ===== */
.ui-search{
  display:flex;
  line-height:30px;
  align-items:center;
  position:relative;
  max-width:200px;
}
.ui-search-input{
  width:100%;
  height:45px;
  line-height:30px;
  padding:0 5rem;
  padding-left:3rem;
  border:2px solid transparent;
  border-radius:10px;
  outline:none;
  background-color:var(--surface-2);
  color:var(--ink);
  font-family:inherit;
  transition:.5s ease;
}
.ui-search-input::placeholder{ color:var(--muted); }
.ui-search-input:focus,
.ui-search-input:hover{
  outline:none;
  border-color:var(--primary);
  background-color:var(--surface);
  box-shadow:0 0 0 5px color-mix(in srgb, var(--primary) 30%, transparent);
}
.ui-search-icon{
  position:absolute;
  left:1rem;
  fill:none;
  width:1rem;
  height:1rem;
  color:var(--muted);
  pointer-events:none;
}

/* ===== 通用加载跳动点 ui-loader（Uiverse mobinkakei 改写：白球 #fff→teal --primary；黑影 rgba(0,0,0,.9)→color-mix(--ink 30%) 明暗自适应；原 .wrapper/.circle/.shadow 改名 .ui-loader*；⚠️ 原用 :nth-child(2/3/4/5) 定位/延时，DOM 顺序错一点就崩 → 改 .m2/.m3 修饰类，顺序无关；keyframes circle7124/shadow046 加 uiLoader 前缀） ===== */
.ui-loader{
  width:200px;
  height:60px;
  position:relative;
  z-index:1;
}
.ui-loader-dot{
  width:20px;
  height:20px;
  position:absolute;
  border-radius:50%;
  background-color:var(--primary);
  left:15%;
  transform-origin:50%;
  animation:uiLoaderDot .5s alternate infinite ease;
}
.ui-loader-dot.m2{ left:45%; animation-delay:.2s; }
.ui-loader-dot.m3{ left:auto; right:15%; animation-delay:.3s; }
.ui-loader-shadow{
  width:20px;
  height:4px;
  border-radius:50%;
  background-color:color-mix(in srgb, var(--ink) 30%, transparent);
  position:absolute;
  top:62px;
  transform-origin:50%;
  z-index:-1;
  left:15%;
  filter:blur(1px);
  animation:uiLoaderShadow .5s alternate infinite ease;
}
.ui-loader-shadow.m2{ left:45%; animation-delay:.2s; }
.ui-loader-shadow.m3{ left:auto; right:15%; animation-delay:.3s; }

@keyframes uiLoaderDot{
  0%{ top:60px; height:5px; border-radius:50px 50px 25px 25px; transform:scaleX(1.7); }
  40%{ height:20px; border-radius:50%; transform:scaleX(1); }
  100%{ top:0%; }
}
@keyframes uiLoaderShadow{
  0%{ transform:scaleX(1.5); }
  40%{ transform:scaleX(1); opacity:.7; }
  100%{ transform:scaleX(.2); opacity:.4; }
}

/* ===== 通用圆角输入框 ui-box-input（Uiverse ErzenXz 改写：lightgrey/grey 命名色→teal token；原 .input 改名 .ui-box-input 防与通用 .input 混淆（.ui-input 下划线动画系列已于 10/2 随死样式清理删除）；border 宽 1.5→2px 改为恒定 2px 仅变色，避免聚焦时 0.5px 布局抖动） ===== */
.ui-box-input{
  width:100%;
  max-width:220px;
  height:45px;
  padding:12px;
  border-radius:12px;
  border:2px solid var(--line);
  outline:none;
  color:var(--ink);
  background:var(--surface);
  font-family:inherit;
  transition:all .3s cubic-bezier(.19,1,.22,1);
  box-shadow:0 0 20px -18px;
}
.ui-box-input:hover{ border-color:var(--muted); box-shadow:0 0 20px -17px; }
.ui-box-input:active{ transform:scale(.95); }
.ui-box-input:focus{ border-color:var(--primary); }

/* ===== 通用深色描边药丸按钮 ui-dark-btn（Uiverse elijahgummer 改写：黑渐变 #171717/#242424/#292929/#000000/#252525 → teal 渐变 --primary-d/--primary；白字→--on-primary；原 .styled-button/.inner-button/.icon 改名 .ui-dark-btn*，drop-shadow 中性黑保留） ===== */
.ui-dark-btn{
  position:relative;
  padding:1rem 2rem;
  font-size:1.1rem;
  font-weight:bold;
  color:var(--on-primary);
  background:linear-gradient(to bottom, var(--primary-d), var(--primary));
  border-radius:9999px;
  cursor:pointer;
  box-shadow:0 2px 4px rgba(0,0,0,1), 0 10px 20px rgba(0,0,0,.4);
  transition:all .2s ease;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--primary-d);
  font-family:inherit;
}
.ui-dark-btn::before{
  content:"";
  position:absolute;
  top:-2px; right:-1px; bottom:-1px; left:-1px;
  background:linear-gradient(to bottom, var(--primary), var(--primary-d));
  z-index:-1;
  border-radius:9999px;
  transition:all .2s ease;
  opacity:1;
}
.ui-dark-btn:active{
  transform:translateY(2px);
  box-shadow:0 1px 2px rgba(0,0,0,1), 0 5px 10px rgba(0,0,0,.4);
}
/* 小号变体：用于计时页等次要操作，避免原版 padding 过大撑满 */
.ui-dark-btn--sm{ padding:.5rem 1.25rem; font-size:.95rem;
  box-shadow:0 1px 2px rgba(0,0,0,.5), 0 6px 12px rgba(0,0,0,.25); }

/* ===== 全站玻璃底栏 dock（移动端主导航；桌面隐藏，用侧栏） + 新增浮动按钮 ===== */
#hubDock{ position:fixed; left:50%; bottom:18px; transform:translateX(-50%); z-index:45; display:none; }
/* 10/1 晚（她拍板）：全站禁止左右滑动 */
html,body{overflow-x:clip}
body.has-dock main.container{ padding-bottom:0; }
@media (max-width:860px) and (hover:none) and (pointer:coarse){
  #hubDock{ display:flex; }
  /* 10/2：净空统一由 design/56 块（沉浸态 118px）与末尾 App Shell 块（非沉浸态 --dock-h）接管，
     这里删除写死的 88px —— 三个魔法数字互相覆盖是旧 bug 的根源。 */
}
/* 10/8 晚她反馈：电脑端把页面放大到 150%（等效 CSS 宽 720px）时，这个手机专用底栏弹出来压住考试界面。
   根因 = 只按「宽度」判断手机。修法 = 加 (hover:none)+(pointer:coarse) 双条件（业界标准做法：
   用指针类型而非宽度区分触屏设备）→ 鼠标/触控板设备无论怎么缩放、窗口多窄，永不显示。
   camelCase 的 hover:hover/pointer:fine 设备（含 iPad+妙控键盘场景以粗指针为准）走侧栏导航。 */
@media (max-width:860px) and (hover:hover) and (pointer:fine){
  #hubDock{ display:none !important; }
}
/* ===== 手机端浮层/完成页适配（之之 9/8：完成页按钮点不到、排版乱、dock 优化）===== */
@media (max-width:860px){
  /* 9/15：dock 净空/计时胶囊/hubFab 的底部位置已统一移到下方 design/56 块（贴底通栏新版），此处不再重复 */
  /* 全屏沉浸时隐藏全局 dock 与计时胶囊，不留悬浮物（验收 12：dock 与计时胶囊都不出现；
     9/13：已上移到 .word-fullscreen 全局块——原来放这里导致桌面宽度全屏时胶囊照旧显示） */
}
@media (max-width:640px){
  /* 完成页勋章行窄屏竖排：勋章居中在上，大标题不再 42px 换三行 */
  .finish-medal-row{ flex-direction:column; text-align:center; gap:10px; }
  .finish-medal-row .q-word{ font-size:24px; line-height:1.35; }
  .finish-medal-row > div:last-child{ width:100%; }
  .finish-medal-row .q-cn, .finish-medal-row div[style*="font-size:14px"]{ text-align:center; }
  /* 完成页动作按钮窄屏全宽竖排，远离误触 */
  .dict-result-actions .btn{ min-width:46%; }
}
#hubFab{
  position:fixed; right:18px; bottom:18px; z-index:60;
  border-radius:50%; cursor:pointer; padding:0;
  box-shadow:0 8px 20px rgba(0,0,0,.28);
}
@media (max-width:860px){
  /* 10/2：#hubFab 的移动端锚点已统一到 design/56 块（var(--dock-h) + 18px），
     这里删除写死的 96px，避免第二个魔法数字。 */
}

/* ===== 苹果极简 · Layer③ 模块色驱动：[data-mod] 决定每页身份色 --mod ===== */
[data-mod="teal"]{--mod:var(--primary);--mod-soft:var(--primary-soft)}
[data-mod="vocab"]{--mod:var(--vocab);--mod-soft:var(--vocab-soft)}
[data-mod="corpus"]{--mod:var(--corpus);--mod-soft:var(--corpus-soft)}
[data-mod="speak"]{--mod:var(--speak);--mod-soft:var(--speak-soft)}
[data-mod="write"]{--mod:var(--warn);--mod-soft:var(--warn-soft)}
[data-mod="mock"]{--mod:var(--mock);--mod-soft:var(--mock-soft)}
[data-mod="timer"]{--mod:var(--timer);--mod-soft:var(--timer-soft)}
[data-mod="ok"]{--mod:var(--ok);--mod-soft:var(--ok-soft)}
[data-mod="err"]{--mod:var(--err);--mod-soft:var(--err-soft)}
[data-mod] .prog-bar-fill{background:var(--mod)}
[data-mod] .page-title{color:var(--mod);border-left:4px solid var(--mod);padding-left:12px}
[data-mod] .pill-tab.active,
[data-mod] .wtab.active,
[data-mod] .chip.active{background:var(--mod);border-color:var(--mod);color:#fff}
[data-mod] .meta-ico,
[data-mod] .qc-ico{color:var(--mod)}
[data-mod] .hero-num .big{color:var(--mod)}
[data-mod] .hero-cta{background:var(--mod);border-color:var(--mod)}
[data-mod] .streak-chip{color:var(--mod)}
[data-mod] .section-title{border-left:3px solid var(--mod);padding-left:10px}


/* ── 写作真题·提交后「我的作文」折叠块（左栏题目下方，默认收起） ── */
.exam-essay-fold{border-top:1px solid var(--line)}
.exam-essay-fold-sum{list-style:none;cursor:pointer;padding:14px 28px;font-size:14.5px;font-weight:700;color:var(--ink);user-select:none}
.exam-essay-fold-sum::-webkit-details-marker{display:none}
.exam-essay-fold-sum::before{content:'▸ ';color:var(--muted)}
.exam-essay-fold[open] .exam-essay-fold-sum::before{content:'▾ '}
.exam-essay-fold-sum:hover{background:var(--primary-soft)}
.exam-essay-orig{padding:4px 28px 24px;white-space:pre-wrap;line-height:1.9;font-size:15px;color:var(--ink)}

/* ── 侧边栏 AI 智能搜索下拉 ── */
.side-search-wrap{position:relative;margin:0 0 2px}   /* 9/15 收紧：4/6 → 0/2（之之：搜索栏上下空隙多） */
.side-search-wrap .ui-search{margin:0}
.ss-panel{position:absolute;top:calc(100% + 4px);left:0;right:0;min-width:230px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);z-index:80;max-height:60vh;overflow:auto;padding:6px}
.ss-item{display:flex;align-items:center;gap:8px;width:100%;padding:9px 10px;border:none;background:transparent;border-radius:8px;font:inherit;font-size:13.5px;color:var(--ink);cursor:pointer;text-align:left}
.ss-item:hover{background:var(--primary-soft)}
.ss-item .ss-ico{width:16px;height:16px;flex:none;display:inline-flex;color:var(--muted)}
.ss-item .ss-ico svg{width:16px;height:16px}
.ss-item .ss-name{font-weight:600;flex:none}
.ss-item .ss-desc{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.ss-ai{color:var(--primary);font-weight:600}
.ss-hint{margin-left:auto;font-size:11px;color:var(--muted);border:1px solid var(--line);border-radius:6px;padding:1px 6px}
.ss-empty{padding:10px;color:var(--muted);font-size:12.5px}
.ss-card{margin-top:6px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2)}
.ss-card .sc-en{font-weight:700;font-size:15px;color:var(--ink)}
.ss-card .sc-ipa{color:var(--muted);font-size:12.5px;margin-left:6px}
.ss-card .sc-cn{margin-top:4px;font-size:13.5px;color:var(--ink);line-height:1.6}
.ss-card .sc-tag{margin-top:6px;font-size:12px;color:var(--ok)}
.ss-card .sc-err{font-size:12.5px;color:var(--err);line-height:1.6}

/* ═════════ 背单词页趣味性 + 正向反馈（design/54 · 2026-09-07） ═════════
   之之 9/7 11:03 定版：答对/答错气泡与流转条模块撤掉不显示；
   保留 streak chip（含答错红心态）+ 选项勾叉图标 + 完成页勋章三宫格 */

/* ── 连击 chip（word-stats 行，stat-progress 右侧；≥1 才显示） ── */
.streak-chip{
  display:inline-flex;align-items:center;gap:4px;flex:none;
  background:var(--ok-bg);color:var(--ok-text);
  padding:4px 12px;border-radius:999px;font-size:12px;font-weight:700;line-height:1;
  transition:background .15s ease,color .15s ease;
}
.streak-chip[hidden]{display:none}
.streak-chip .streak-ico{width:14px;height:14px;flex:none}
.streak-chip.boost{
  background:var(--streak-bg);color:var(--streak-text);
  border:1.5px solid var(--streak);
  box-shadow:0 0 0 4px var(--streak-bg);          /* 呼吸光晕底 */
  animation:streakPop .6s cubic-bezier(.4,0,.2,1); /* scale 1→1.06→1，≤600ms */
}
@keyframes streakPop{0%{transform:scale(1)}35%{transform:scale(1.06)}100%{transform:scale(1)}}
/* 答错红心态（原型状态3）：♥「再认一次就记住」，无任何惩罚文案 */
.streak-chip.heart{background:var(--err-bg);color:var(--err-text)}
.streak-chip.heart .streak-ico{display:none}
.streak-chip.heart::before{
  content:'';width:13px;height:13px;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7-4.5-9.3-9c-1.4-2.7 0-6 3.3-6 2 0 3.5 1 4 2 .5-1 2-2 4-2 3.3 0 4.7 3.3 3.3 6C19 16.5 12 21 12 21z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7-4.5-9.3-9c-1.4-2.7 0-6 3.3-6 2 0 3.5 1 4 2 .5-1 2-2 4-2 3.3 0 4.7 3.3 3.3 6C19 16.5 12 21 12 21z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.streak-chip .x2-badge{
  background:var(--streak);color:#fff;
  font-size:10px;font-weight:800;padding:1px 6px;border-radius:999px;margin-left:2px;
}
.streak-chip .x2-badge[hidden]{display:none}

/* 之之 9/7 14:17：勾/叉圆底图标撤掉（觉得多余）——保留绿/红框高亮 + 词性旁补英文 + 红心 chip */

/* ── 头部布局对齐 design/54 原型（之之 14:22/14:37 定版）：头部行只有 chip+数字，
   已掌握/设置/全屏按钮整体下移到进度条下方一行；全屏缩成纯图标小方块 ── */
.word-stats .stat-progress{ margin-left:auto; }
.word-tools-row{
  display:flex;justify-content:flex-end;align-items:center;gap:8px;
  margin:6px 0 2px;flex:none;
}
.word-tools-row[hidden]{ display:none; }
.word-tools-row .icon-square-btn{
  width:30px;height:30px;min-height:0;   /* min-height:0 抵掉移动端 .btn{min-height:44px}（331 行），否则 28/30 宽被撑成 44 高长方形（之之 9/8 晚反馈） */
  padding:0;border-radius:9px;
  display:inline-flex;align-items:center;justify-content:center;flex:none;
}
.word-tools-row .icon-square-btn svg{ width:15px;height:15px; }

/* ── 完成页：勋章 + 三宫格 + 复习激励条 ── */
.finish-medal-row{display:flex;align-items:center;gap:16px}
.finish-medal{
  width:80px;height:80px;border-radius:50%;flex:none;
  background:linear-gradient(135deg,#ffd470,var(--warn));  /* 全页唯一暖色渐变焦点 */
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 16px rgba(255,149,0,.4);
  animation:medalIn .4s cubic-bezier(.4,0,.2,1);
}
@keyframes medalIn{from{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}
.finish-medal .finish-medal-in{
  width:64px;height:64px;border-radius:50%;background:#fff9ed;
  display:flex;align-items:center;justify-content:center;
  font-size:28px;font-weight:800;color:var(--warn-ink);font-variant-numeric:tabular-nums;
}
/* ── 动效开关：系统层面减弱动态效果时全部关闭 ── */
@media (prefers-reduced-motion: reduce){
  .streak-chip.boost,.finish-medal{animation:none !important}
}

/* ===== design/56 · 移动端底部 dock（B 通栏扁平 · 之之 10/2 拍板）=====
   改造前：68px 浮空玻璃卡片（左右各 8px 缝 + 20px 上圆角 + 大投影），而内容区净空写死 88px
           → dock 上方恒定 20px 幽灵白带，且「贴底 + 留边距 + 圆角 + 投影」四重自相矛盾。
   改造后：56px 通栏 tab bar（iOS/微信原生观感）：无圆角、1px 顶分隔线、active 只染色不加药丸。
   净空与所有浮层锚点统一读 --dock-h（common.js injectGlobalDock 实测写入），不再有魔法数字。 */
#hubDock{
  width:100%; max-width:none;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(20px) saturate(180%);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  border-top:1px solid var(--line);
  border-left:none; border-right:none; border-bottom:none;
  box-shadow:0 -1px 2px rgba(16,24,40,.04);
  padding:4px 0;
  border-radius:0;
  gap:0;
}
#hubDock::after{ display:none; }
/* 5 槽同构（9/15 起中央凸起已撤）；active 只染主色、不给药丸底 —— iOS Tab Bar 观感 */
#hubDock .ui-menu-item{
  color:var(--n-500); text-shadow:none;
  padding:7px 0 6px; border-radius:0;
}
#hubDock .ui-menu-item svg{ width:22px; height:22px; }
#hubDock .ui-menu-item > span{ font-size:11px; font-weight:500; margin-top:3px; }
#hubDock .ui-menu-item:hover{ background:rgba(20,22,26,.04); box-shadow:none; transform:none; color:var(--n-800); }
#hubDock .ui-menu-item.active{ background:none; color:var(--primary-600); }
#hubDock .ui-menu-item.active > span{ font-weight:700; }
#hubDock .ui-menu-item:active{ background:rgba(20,22,26,.05); }
/* 暗色：浅玻璃是浅色专属，同构图换深玻璃；顶线用白 10% 维持 1px 分隔可辨 */
[data-theme="dark"] #hubDock{
  background:rgba(22,24,28,.9);
  border-top-color:rgba(255,255,255,.1);
  box-shadow:0 -1px 2px rgba(0,0,0,.3);
}
[data-theme="dark"] #hubDock .ui-menu-item:hover{ background:rgba(255,255,255,.06); color:var(--n-800); }

@media (max-width:860px){
  /* 10/2 B 方案：真通栏。left/right 归 0、transform 撤掉、圆角归 0；
     safe-area 只并入内部 padding 一次（9/15 修过的双重叠加坑不要再犯）。 */
  #hubDock{
    left:0; right:0; transform:none;
    width:auto; max-width:none;
    bottom:0;
    border-radius:0;
    padding:4px 0 calc(4px + env(safe-area-inset-bottom, 0px));
  }
  /* 浮钮 / 吐司 / 额度轻条锚点：一律 = dock 实测高 + 各自呼吸值。
     safe-area 已含在 --dock-h 里（实测的是含 padding 的 border-box 高），此处严禁再叠加。 */
  .float-timer{
    bottom:calc(var(--dock-h, 56px) + 10px);
    background:var(--primary-700);
    padding:5px 6px 5px 11px;
    font-size:11.5px;
  }
  #hubFab{ bottom:calc(var(--dock-h, 56px) + 18px); }
  .toast{ bottom:calc(var(--dock-h, 56px) + 16px); }
  #hubLimitStrip{ bottom:calc(var(--dock-h, 56px) + 14px); }
  /* 沉浸态（模考 mock-immerse / 背词全屏）维持原 118px 不动；
     非沉浸态由文件末尾 App Shell 块接管（那里才用 --dock-h）。 */
  body.has-dock main.container{ padding-bottom:118px; }
}

/* ===== 背词完成页「想再认一次的词」紧凑卡（之之 2026-09-09 反馈重设计：粉卡+提示条合一） ===== */
/* min-width:0 必须：本卡是 .practice-body-fit（flex 列）的子项，默认 min-width:auto 时不许收缩，
   会被 .rw-cn（nowrap 长释义）的固有宽度撑破父容器 → 手机窄屏整卡左右溢出、左侧切出屏幕外（9/9 实测 360px 复现） */
.rw-card{
  background:var(--err-bg); border:1px solid var(--err); border-radius:14px;
  padding:12px 14px; margin-top:14px;
  min-width:0; max-width:100%;
}
.rw-head{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; margin-bottom:2px; }
.rw-t{ font-size:14px; font-weight:800; color:var(--danger); }
.rw-n{ font-size:12.5px; font-weight:700; color:var(--danger); opacity:.85; }
.rw-s{ font-size:11.5px; color:var(--muted); margin-left:auto; }
.rw-row{ display:flex; align-items:baseline; gap:10px; padding:6px 0; }
.rw-row + .rw-row{ border-top:1px dashed rgba(0,0,0,.07); }
.rw-row b{ font-size:14px; color:var(--ink); flex:none; }
.rw-row .rw-cn{ font-size:12.5px; color:var(--ink-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }

/* ===== 回顾·分项记录列表 紧凑化（9/10 方案 A：单行高密度，Part 明细跟标题同行）===== */
#mkList .mk-row{align-items:center;gap:8px;padding:10px 14px;border-bottom:1px dashed var(--n-100,#eaeef2)}
#mkList .mk-row:last-child{border-bottom:none}
#mkList .mk-parts-inline{display:inline-flex;flex-wrap:wrap;gap:6px;flex:1 1 auto;min-width:0}
#mkList .mk-parts-inline .badge{font-weight:400;opacity:.82}
#mkList .mk-note{flex:0 1 100%;font-size:12px;opacity:.7;margin-top:2px}
#mkList .mk-del{margin-left:auto;opacity:.4;transition:opacity .15s ease}
#mkList .mk-row:hover .mk-del{opacity:1}
/* 10/2（她 10/2 反馈）：①筛选框并排贴到「记录列表」标题右边，一行解决（不再一上一下）
   ②记录条移动端收紧空隙（日期行/徽章行/Part 行挤成更少行、更矮） */
.mk-list-head{flex-wrap:nowrap;align-items:center;gap:10px}
.mk-list-head .inline-h2{flex:none;margin:0}
.mk-filter-wrap{gap:6px}
.mk-filter-wrap select{width:auto;min-width:0}
.mk-date{font-size:14px}
@media (max-width:640px){
  /* 豁免 ≤640 的 .form-row 纵向堆叠（display:block + width:100%!important 就是「两个框一上一下」的根因） */
  .form-row.mk-list-head{display:flex;flex-wrap:nowrap}
  .form-row.mk-list-head > div{width:auto !important;flex:none !important;margin-bottom:0}
  .mk-list-head{gap:6px}
  .mk-list-head .inline-h2{font-size:15px}
  /* 「科目/粒度」label 手机端让位（视觉隐藏，读屏保留）——下拉选项本身语义可辨 */
  .mk-filter-wrap{position:relative}   /* sr-only label 的包含块必须收回本容器（否则逃逸到 html 层撑出 166px 幽灵滚动区） */
  .mk-filter-wrap > label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .mk-filter-wrap select{font-size:12.5px;padding:4px 24px 4px 8px}
  #mkList .mk-row{gap:5px;padding:8px 26px 8px 10px;position:relative}
  #mkList .mk-row .mk-date{font-size:13px;min-width:0}
  #mkList .mk-row .badge{font-size:10.5px;padding:2px 6px}
  #mkList .mk-del{position:absolute;top:8px;right:10px;margin-left:0}
  #mkList .mk-parts-inline{gap:4px}
  #mkList .mk-parts-inline .badge{font-size:10.5px;padding:2px 6px}
  #mkList .mk-note{font-size:11px}
}
@media (max-width:560px){#mkList .mk-row{flex-wrap:wrap}#mkList .mk-parts-inline{flex:1 1 100%}}

/* ===== design/58 间隔重复算法可视化（之之 2026-09-18 · 纯只读展示层，零算法改动）=====
   注：块 1 答题页记忆状态条已按之之 9/18 要求整体撤除（背词页保持定版样子）；
   复习计划入口从答题页日历按钮改为词库卡「复习计划」按钮。 */
/* 块 2 · 记忆曲线排程面板（默认收起；条形宽度按当日最大值等比缩放，非绝对词数） */
.plan-panel{background:var(--n-50);border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:14px 16px;margin:0 0 12px}
.plan-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.plan-title{font-size:13px;font-weight:700;color:var(--ink)}
.plan-sec{font-size:12px;font-weight:600;color:var(--ink-2);margin:10px 0 6px}
.plan-row{display:flex;align-items:center;gap:8px;margin:5px 0}
.plan-lbl{width:74px;flex:0 0 74px;font-size:11px;color:var(--ink-2);white-space:nowrap}
.plan-lbl em{font-style:normal;color:var(--n-500)}
.plan-track{flex:1;height:8px;background:var(--n-200);border-radius:4px;overflow:hidden}
.plan-bar{display:block;height:100%;background:var(--primary-300);border-radius:4px;
  transition:width .24s ease-out}
.plan-bar.today{background:var(--primary-500)}
.plan-bar.box{background:var(--primary-200)}
.plan-num{width:52px;flex:0 0 52px;text-align:right;font-size:11px;color:var(--ink);
  font-variant-numeric:tabular-nums}
.plan-foot{margin-top:10px;font-size:11px;color:var(--muted)}
.plan-empty{padding:6px 0;font-size:12.5px;color:var(--muted)}
/* 块 3 · 词库列表「下次复习」（Lv N · 日期；逾期 warn 色） */
.wl-due{color:var(--n-500);margin-left:4px;font-size:11px}
.wl-due.overdue{color:var(--warn-ink)}
/* design/59 · 词库掌握度统计条（纯只读；--muted-light 不存在 → 按 :root 就近用 --muted） */
.wl-stats{margin-top:8px}
.wl-stats-bar{display:flex;height:4px;border-radius:2px;overflow:hidden;background:var(--line)}
.wl-stats-seg{display:block;height:100%}
.wl-stats-seg.s-ok{background:var(--primary-500)}
.wl-stats-seg.s-mid{background:var(--primary-200)}
.wl-stats-seg.s-new{background:var(--line)}
.wl-stats-txt{display:block;margin-top:4px;font-size:12px;color:var(--muted)}

/* =========================================================================
   首次进入引导（9/19）：账号选择遮罩 + 三步设置 + 首页提示条
   - 只用 token（--surface/--line/--ink/--primary…），暗色随主题自动翻转，组件层不写死白底；
   - 移动优先：默认单列铺满，≥560px 才收成 420px 居中卡片；
   - 层级 99990：低于首屏 #bootLoader(99999)、高于 dock 与悬浮计时。
   ========================================================================= */
.onb-overlay{position:fixed;inset:0;z-index:99990;display:flex;align-items:center;justify-content:center;padding:16px;background:var(--n-900);background:rgba(16,20,24,.55);backdrop-filter:blur(3px);overflow:auto;cursor:pointer}
.onb-overlay > *{cursor:default}   /* 只有空白遮罩区是 pointer；dialog 内部按钮/输入恢复 default */
.onb-overlay[hidden]{display:none}
/* 首页引导提示条 */
.onb-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;margin-bottom:12px;border:1px solid var(--line);border-radius:12px;background:var(--primary-soft)}
.onb-bar-title{font-size:13px;font-weight:700;color:var(--ink)}
.onb-chip{font-size:12px;padding:6px 10px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;min-height:0}
.onb-chip:hover{border-color:var(--primary);color:var(--primary)}
.onb-chip.ok{background:var(--surface-2);color:var(--muted)}
.onb-chip.ghost{background:transparent;color:var(--muted)}

html[data-theme="dark"] .onb-overlay{background:rgba(0,0,0,.62)}

/* ===== design/78 · 双词库切换 =====
   学习页 #wbStudyTag：紧凑段控件（「词库」标签 + 我的/AWL 两段）；
   词库页 #wbSwitcher：分段切换条（我的词库（N）/ AWL（x/570））。
   视觉对齐 .pill-tab：teal 实底激活 + 透明底未激活，token 全翻转、暗色不硬编码。 */
#wbStudyTag{display:inline-flex;align-items:center;gap:6px;min-width:0}
.wb-tag-label{font-size:12px;font-weight:600;color:var(--muted);white-space:nowrap}
.wb-seg{display:inline-flex;align-items:center;gap:2px;padding:2px;border:1px solid var(--line);border-radius:999px;background:var(--surface)}
.wb-seg-btn{border:none;background:transparent;color:var(--muted);font-family:inherit;font-size:12.5px;font-weight:600;line-height:1;padding:6px 12px;border-radius:999px;cursor:pointer;white-space:nowrap;transition:all .18s cubic-bezier(.4,0,.2,1)}
.wb-seg-btn:hover:not(.active){color:var(--ink);background:rgba(58,154,147,.12)}
.wb-seg-btn.active{background:var(--primary);color:var(--on-primary);box-shadow:0 2px 8px rgba(58,154,147,.28)}
.wb-seg-btn:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(58,154,147,.25)}
#wbSwitcher{display:flex;margin-bottom:12px}
.wb-seg-bank{padding:3px}
.wb-seg-bank .wb-seg-btn{font-size:13px;padding:8px 16px}
/* design/78：官方词库「重置进度」两步确认武装态（3 秒未复点由 words.js 还原） */
.wb-danger-armed{background:var(--danger)!important;border-color:var(--danger)!important;color:var(--on-primary)!important}
@media (max-width:390px){
  .wb-tag-label{display:none}
  .wb-seg-btn{padding:6px 10px;font-size:12px}
  #wbSwitcher .wb-seg{width:100%}
  .wb-seg-bank .wb-seg-btn{flex:1;padding:8px 10px;font-size:12.5px}
}

/* ===== design/79 离线状态灯（common.js 的 online/offline 监听驱动，SW 不参与） =====
   离线不是错误 → warn 圆点 + 中性底，不用 danger 红；全 token 化，暗色自动跟随。
   层级 99980：高于侧栏(50)/dock/悬浮计时，低于引导遮罩(99990)与首屏 loader(99999)
   —— 引导遮罩必须能盖住它，它也绝不抢首屏。
   顶部居中胶囊（不是整条横幅）：本站桌面是 256px 固定左栏，整条横幅会横跨侧栏顶部。 */
.offline-bar{position:fixed;top:10px;left:50%;transform:translateX(-50%);z-index:99980;
  display:inline-flex;align-items:center;gap:8px;max-width:calc(100vw - 32px);
  padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:var(--surface);
  color:var(--ink);font-size:13px;font-weight:600;line-height:1.4;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;box-shadow:var(--shadow-md);pointer-events:none}
.offline-bar::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--warn);flex:none}
@media (max-width:860px){
  .offline-bar{top:8px;font-size:12px;padding:6px 12px}
}

/* ===== 同步指示器（10/5 14:52 她要：打开立刻看本机内容 + 一个转圈提示还在更新 + 更新完自动覆盖）=====
   ⚠️ 现状澄清：首屏拉取**本来就是非阻塞的**（initCloudSync 用 requestIdleCallback + 800ms 兜底），
      她看到的 4 秒等待 = 已经在看本机内容了，只是**没有任何"正在更新"的提示**，
      像是卡住。所以本批只加提示，**不动同步时序**（动时序风险大且没必要）。
   ⚠️ z 值取 99940：**低于额度条 99960 / 离线条 99980 / 引导 99990** ——
      它只是个"正在同步"的小提示，绝不该盖住真正需要用户操作的浮层。
   ⚠️ 离线条 99980 会遮住它（同位置 top:10px）→ 离线时同步本来也做不了，不冲突。 */
#hubSyncTip{position:fixed;left:50%;transform:translateX(-50%);bottom:26px;z-index:99940;
  display:inline-flex;align-items:center;gap:8px;max-width:calc(100vw - 32px);
  padding:6px 13px;border-radius:999px;border:1px solid var(--line);background:var(--surface);
  color:var(--ink);font-size:12.5px;font-weight:600;line-height:1.4;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;box-shadow:var(--shadow-md);pointer-events:none;
  opacity:0;visibility:hidden;transition:opacity .18s ease,visibility .18s ease}
#hubSyncTip.on{opacity:1;visibility:visible}
#hubSyncTip::before{content:"";width:11px;height:11px;border-radius:50%;flex:none;
  border:2px solid var(--primary-200);border-top-color:var(--primary-500);
  animation:hubSyncSpin .7s linear infinite}
@keyframes hubSyncSpin{to{transform:rotate(360deg)}}
@media (max-width:860px){
  #hubSyncTip{bottom:14px;font-size:12px;padding:5px 11px}
}
/* 尊重系统「减少动态效果」设置：转圈改成静态点（不该强行动画） */
@media (prefers-reduced-motion: reduce){
  #hubSyncTip::before{animation:none;border-top-color:var(--primary-500)}
}

/* ===== design/78 SW 更新提示条（common.js 驱动，**绝不自动 reload**） =====
   与离线条同族、同一顶部位；层级 99970 低于引导遮罩 99990、高于 hub-loader 9999。
   两者不会同时出现（离线不弹新版提示），因此共用顶部槽位安全。
   配色全 token：neutral 底 + --primary 主按钮（teal 实色单屏 ≤1），暗色自动跟随。 */
.sw-update-bar{position:fixed;top:10px;left:50%;transform:translateX(-50%);z-index:99970;
  display:inline-flex;align-items:center;gap:10px;max-width:calc(100vw - 32px);
  padding:8px 12px;border-radius:999px;border:1px solid var(--line);background:var(--surface);
  box-shadow:var(--shadow-md)}
.sw-update-text{font-size:13px;font-weight:600;line-height:1.4;color:var(--ink);white-space:nowrap}
.sw-update-btn{font-family:inherit;font-size:12.5px;font-weight:600;line-height:1.4;min-height:0;
  padding:5px 12px;border-radius:999px;border:1px solid var(--line);background:transparent;
  color:var(--ink);cursor:pointer;white-space:nowrap}
.sw-update-btn.btn-primary{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
.sw-update-btn:hover{box-shadow:0 0 0 3px rgba(58,154,147,.18)}
@media (max-width:860px){
  .sw-update-bar{top:8px;gap:8px;padding:7px 10px}
  .sw-update-text{font-size:12px}
  .sw-update-btn{font-size:12px;padding:4px 10px}
}

/* ===== 9/30 新版五步引导（Onboarding v2）=====
   骨架：全屏遮罩 + 顶部 3px 细进度条 + 640px 居中卡 + 步骤左右横滑 + 底部导航（返回 / n 步 / 继续）。
   皮肤沿用本站 token：teal 主色 + 白卡 + 细边框，跟「计划/课程卡」同一套观感，不引入新色。 */
.onb2-overlay{background:rgba(16,20,24,.55)}
.onb2-wrap{width:100%;max-width:640px;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 48px rgba(0,0,0,.22);overflow:hidden}
.onb2-bar{height:3px;background:var(--surface-2)}
.onb2-bar > i{display:block;height:100%;background:var(--primary);transition:width .28s ease}
.onb2-stage{padding:26px 26px 6px}
.onb2-step{animation:onb2In .26s cubic-bezier(.16,1,.3,1) both}
.onb2-step.from-l{animation-name:onb2InL}
@keyframes onb2In{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:none}}
@keyframes onb2InL{from{opacity:0;transform:translateX(-40px)}to{opacity:1;transform:none}}
.onb2-kicker{font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--primary);margin-bottom:8px}
.onb2-h{margin:0 0 8px;font-size:19px;font-weight:800;line-height:1.35;color:var(--ink)}
.onb2-note{margin:0 0 14px;font-size:13px;line-height:1.7;color:var(--muted)}
.onb2-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.onb2-list li{display:flex;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2)}
.onb2-list b{flex:none;width:92px;font-size:13px;color:var(--ink)}
.onb2-list span{font-size:12.5px;line-height:1.6;color:var(--muted)}
.onb2-label{display:block;margin:12px 0 6px;font-size:12.5px;font-weight:700;color:var(--ink)}
.onb2-wrap .ui-box-input{width:100%;box-sizing:border-box}
.onb2-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.onb2-chip{font-size:12px;padding:5px 12px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;min-height:0}
.onb2-chip:hover{border-color:var(--primary);color:var(--primary)}
.onb2-err{margin-top:8px;font-size:12.5px;line-height:1.5;color:var(--danger)}
.onb2-block{width:100%;padding:12px 16px;margin-top:10px}
/* 10/10 批④：引导闭环三件套 —— 官方库「已启用」态 / 进站后预告 / 词库页返回提示 */
.onb2-okbox{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border:1px solid var(--primary-200);border-radius:12px;background:var(--primary-50)}
.onb2-okbox b{font-size:13.5px;color:var(--primary-text)}
.onb2-okbox span{font-size:12.5px;line-height:1.6;color:var(--muted)}
.onb2-after{margin:14px 0 0;padding:10px 12px;border-radius:10px;background:var(--primary-50);color:var(--primary-text);font-size:12.5px;line-height:1.65}
.onb-bank-hint{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 12px;padding:11px 14px;border:1px solid var(--primary-200);border-left:3px solid var(--primary);border-radius:10px;background:var(--primary-50);font-size:13px;line-height:1.6;color:var(--ink)}
.onb-bank-hint span{flex:1;min-width:190px}
.onb-bank-hint a{flex:none;text-decoration:none}
.onb2-nav{display:flex;align-items:center;gap:10px;margin-top:10px;padding:12px 26px 18px;border-top:1px solid var(--line)}
.onb2-ind{margin:0 auto;font-size:12px;color:var(--muted)}
.onb2-nav .btn-sm{padding:8px 14px}
@media (max-width:520px){
  .onb2-stage{padding:20px 18px 4px}
  .onb2-nav{padding:10px 18px 16px}
  .onb2-list li{flex-direction:column;gap:4px}
  .onb2-list b{width:auto}
}
html[data-theme="dark"] .onb2-overlay{background:rgba(0,0,0,.62)}
@media (prefers-reduced-motion:reduce){ .onb2-step{animation:none} }

/* ===== 首页 · 考前冲刺卡（9/30 新增，js/sprint.js 渲染）=====
   只在距考试 ≤14 天时出现，考完自动消失。
   10/1 晚改版：琥珀渐变 → teal 渐变（她拍板：整体绿色 UI 里突然一块黄太突兀）；
   二改：去掉左边条（她拍板：其他卡都没有左条，单独一根很怪）——与普通卡片统一边框语言。
   柱色 ok/near/bad 保留三色语义（那是数据警示，不是装饰）。 */
.sprint{background:linear-gradient(135deg,var(--primary-50),var(--n-0));border:1px solid var(--primary-200);border-radius:var(--radius);padding:16px 20px;margin-bottom:12px;box-shadow:var(--shadow)}
[data-theme="dark"] .sprint{background:linear-gradient(135deg,rgba(58,154,147,.14),rgba(58,154,147,.05));border-color:rgba(58,154,147,.30)}
.sprint .sp-card{background:var(--surface)}
.sprint[hidden]{display:none}
.sp-head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.sp-days{font-size:26px;font-weight:800;color:var(--primary-700);line-height:1;font-variant-numeric:tabular-nums}
.sp-days em{font-size:13px;font-style:normal;font-weight:600;margin-left:2px}
.sp-head-t{font-size:14px;font-weight:700;color:var(--ink)}
.sp-head-a{margin-left:auto;font-size:12.5px;color:var(--muted);text-decoration:none}
.sp-head-a:hover{color:var(--primary)}
.sp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(238px,1fr));gap:12px}
.sp-card{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px 14px}
.sp-card-h{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:10px;display:flex;align-items:baseline;gap:8px}
.sp-card-sub{font-size:11.5px;font-weight:400;color:var(--muted);margin-left:auto}
.sp-empty{font-size:12.5px;line-height:1.6;color:var(--muted);margin:0}
.sp-empty a{color:var(--primary);text-decoration:none;font-weight:600}
.sp-tip{font-size:12px;line-height:1.6;color:var(--muted);margin:10px 0 0;padding-top:9px;border-top:1px dashed var(--line)}
.sp-tip b{color:var(--danger-text)}
.sp-gap-row,.sp-sp-row{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:12.5px}
.sp-gap-k,.sp-sp-k{width:32px;flex:none;color:var(--ink)}
.sp-gap-bar,.sp-sp-bar{flex:1;min-width:36px;height:6px;background:var(--line);border-radius:999px;overflow:hidden}
.sp-gap-bar i,.sp-sp-bar i{display:block;height:100%;border-radius:999px;background:var(--primary)}
.sp-gap-bar i.ok{background:var(--ok)}
.sp-gap-bar i.near{background:var(--warn)}
.sp-gap-bar i.bad{background:var(--danger)}
.sp-gap-v{width:58px;flex:none;text-align:right;color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
.sp-gap-v em{font-style:normal;font-weight:400;color:var(--muted)}
.sp-gap-d{width:46px;flex:none;text-align:right;font-size:11.5px;color:var(--muted)}
.sp-gap-d.ok{color:var(--ok-text)}
.sp-gap-d.near{color:var(--warn-ink)}
.sp-gap-d.bad{color:var(--danger-text)}
.sp-sp-v{width:78px;flex:none;text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}
.sp-sp-row.zero .sp-sp-k,.sp-sp-row.zero .sp-sp-v{color:var(--danger-text);font-weight:700}
.sp-today{margin-top:12px;padding:12px 14px;border-radius:var(--radius-sm);background:var(--primary-50);border:1px solid var(--primary-200)}
.sp-today-t{font-size:14px;font-weight:700;color:var(--primary-700)}
.sp-today-p{font-size:12.5px;line-height:1.65;color:var(--ink);margin:6px 0 0}
.sp-today-p b{color:var(--primary-700)}
.sp-today-go{display:inline-block;margin-top:9px;font-size:12.5px;font-weight:700;color:var(--primary-700);text-decoration:none}
.sp-today-go:hover{text-decoration:underline}
.sp-ck{margin-top:12px;border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden}
.sp-ck-sum{padding:11px 14px;font-size:13px;font-weight:700;color:var(--ink);cursor:pointer;display:flex;align-items:center;gap:8px;list-style:none}
.sp-ck-sum::-webkit-details-marker{display:none}
.sp-ck-n{font-size:11.5px;font-weight:400;color:var(--muted);margin-left:auto}
.sp-ck-body{padding:0 14px 12px}
.sp-ck-item{padding:8px 0;border-top:1px dashed var(--line);font-size:12.5px;line-height:1.65}
.sp-ck-item>b{display:block;color:var(--ink);margin-bottom:2px}
.sp-ck-item>span{color:var(--muted)}
.sp-ck-item span b{display:inline;color:var(--ink)}
.sp-ck-note{font-size:11.5px;color:var(--muted);margin:8px 0 0}
@media (max-width:520px){
  .sp-grid{grid-template-columns:1fr}
  .sp-gap-v{width:52px}
  .sp-sp-v{width:66px}
  .sprint{padding:14px 16px}
}

/* 10/1 轨迹折叠（回顾页 record tab：每日记录/口语练习默认折叠，她拍板） */
.rv-fold .rv-fold-head{display:flex;align-items:center;gap:8px;cursor:pointer;user-select:none}
.rv-fold .rv-fold-head:hover{opacity:.85}
.rv-fold .rv-arrow{margin-left:auto;font-size:13px;color:var(--muted);transition:transform .18s ease}
.rv-fold.open .rv-arrow{transform:rotate(90deg)}

/* ===== 10/2 · 移动端 App 化外壳（她拍板：页面固定一屏、禁整页竖滚；内容区内部滚不截断） =====
   适用 = 带 dock 的页面（body.has-dock，common.js 注入）；落地页/登录页无 dock 不锁。
   沉浸态（模考 mock-immerse / 背词全屏 word-fullscreen）有自己的布局体系，不套壳。 */
@media (max-width:860px){
  html,body{height:100%;overflow:hidden;overscroll-behavior:none}
  body.has-dock:not(.mock-immerse):not(.word-fullscreen){
    display:flex;flex-direction:column;
  }
  body.has-dock:not(.mock-immerse):not(.word-fullscreen) main.container{
    flex:1 1 auto;min-height:0;overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    padding-bottom:calc(var(--dock-h, 56px) + 10px);   /* = dock 实测高 + 10px 呼吸；不再写死 88px */
    /* 10/3 她手机端报「每页宽度不一样、切 tab 顶部平移、一会宽一会窄」：
       上面 body 是 flex column，而 .container 基础规则 margin:0 auto——flex 子项的 auto
       侧外边距会吃掉横向剩余空间，align-items:stretch 不再生效，容器宽度退化成内容固有宽
       （实测 14 页 390/352/327/283 四种，plans 最窄 283；异步内容渲染后重算=抖动）。
       width:100% 强制撑满（全站 *{box-sizing:border-box}，padding 含在内不会溢出），
       auto margin 无剩余空间可分即归零，14 页宽度统一；桌面 ≥861 分支零影响。 */
    width:100%;
  }
}

/* 入口按钮（侧栏 + 抽屉里的「意见反馈」是 <button> 不是 <a>：这两个 class 原本只给 a 用，
   button 自带灰底/边框/默认字体/箭头光标，必须重置掉，否则样式比旁边的导航项矮一截） */
button.side-item, button.sheet-item{
  background:none;border:0;font-family:inherit;font-size:15px;cursor:pointer;text-align:left;
  width:100%;-webkit-appearance:none;appearance:none;
}
/* ===== 意见反馈弹层（10/2 她拍板：更多抽屉 + 设置页双入口，同一个表单）=====
   全 token 化 → 暗色主题自动跟随；弹层是 body 直属 fixed 层 + 自带内滚，
   与 ≤860px App Shell 锁壳（禁整页竖滚）互不干扰。z-index 高于 sheet(61)/dock。 */
.fb-overlay{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:20px}
.fb-overlay[hidden]{display:none!important}
.fb-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.42);opacity:0;transition:opacity .2s}
.fb-overlay.on .fb-backdrop{opacity:1}
.fb-panel{position:relative;width:100%;max-width:480px;max-height:min(86vh,720px);
  display:flex;flex-direction:column;background:var(--surface);border-radius:16px;
  box-shadow:0 24px 60px -20px rgba(0,0,0,.4);border:1px solid var(--line);
  opacity:0;transform:translateY(10px) scale(.985);transition:opacity .2s,transform .2s}
.fb-overlay.on .fb-panel{opacity:1;transform:none}
/* 头部 */
.fb-head{display:flex;align-items:center;justify-content:space-between;padding:15px 18px 11px;border-bottom:1px solid var(--line)}
.fb-head b{font-size:15.5px;color:var(--ink)}
.fb-x{width:32px;height:32px;border:0;border-radius:9px;background:none;color:var(--muted);font-size:16px;cursor:pointer}
.fb-x:hover{background:var(--surface-2)}
/* 主体（唯一滚动区） */
.fb-body{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:14px 18px 4px;
  display:flex;flex-direction:column;gap:8px}
.fb-lbl{font-size:12.5px;color:var(--ink-2);font-weight:600}
.fb-req{color:var(--danger);font-weight:500;font-size:11.5px}
.fb-text{width:100%;min-height:88px;resize:vertical;padding:10px 12px;border:1.5px solid var(--line);
  border-radius:11px;background:var(--surface);color:var(--ink);font-size:14px;line-height:1.6;
  font-family:inherit;outline:none}
.fb-text:focus{border-color:var(--primary)}
.fb-meta{display:flex;justify-content:space-between;gap:10px;font-size:11.5px;color:var(--muted)}
.fb-picks{display:flex;gap:8px;flex-wrap:wrap}
.fb-pick{position:relative;width:76px;height:76px;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:var(--surface-2)}
.fb-pick img{width:100%;height:100%;object-fit:cover;display:block}
.fb-pick-kb{position:absolute;left:0;right:0;bottom:0;background:rgba(0,0,0,.55);color:#fff;font-size:10px;
  text-align:center;padding:1px 0;line-height:1.4}
.fb-pick-x{position:absolute;top:2px;right:2px;width:20px;height:20px;border:0;border-radius:99px;
  background:rgba(0,0,0,.55);color:#fff;font-size:11px;cursor:pointer;line-height:1}
.fb-add{height:34px;padding:0 13px;border:1.5px dashed var(--primary-200);border-radius:10px;
  background:var(--primary-50);color:var(--primary-700);font-size:12.5px;font-weight:600;cursor:pointer;font-family:inherit}
.fb-add:hover{background:var(--primary-100)}
/* 10/6 11:40 她要求「轻轻标注一下」——灰字小行，不抢视觉；文案：想多发几张就分多次反馈。 */
.fb-hint{margin:6px 0 2px;font-size:12px;color:var(--muted);line-height:1.6}
.fb-input{height:40px;padding:0 12px;border:1.5px solid var(--line);border-radius:11px;
  background:var(--surface);color:var(--ink);font-size:14px;font-family:inherit;outline:none}
.fb-input:focus{border-color:var(--primary)}
.fb-err{min-height:0;font-size:12px;color:var(--danger)}
.fb-err:empty{display:none}
/* 底部 */
.fb-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 18px;
  border-top:1px solid var(--line);padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}
.fb-tip{font-size:11.5px;color:var(--muted);line-height:1.4}

/* 10/2（她拍板）：意见反馈弹层底部「等不及回复？加站长微信」超链接 + 原位展开的联系方式。
   设计约束：
   · 视觉层级压在 fb-err 之下、fb-foot 之上——不是主操作，用户不该被它抢注意力。
   · 展开块用 primary-soft 浅底 + 左侧主色描边（与全站「串题优势块」同一套语言）。
   · 微信号做成可点即复制的等宽块，命中区 ≥44px（移动端触控标准）。
   · 暗色走同构图换深色，不用纯黑/纯白。 */
.fb-wxwrap{margin-top:4px}
.fb-wxlink{display:inline-flex;align-items:center;gap:5px;min-height:44px;padding:6px 2px;
  background:none;border:none;color:var(--primary-600);font-size:13.5px;font-weight:600;
  font-family:inherit;cursor:pointer;text-align:left;border-radius:8px}
.fb-wxlink:hover{color:var(--primary-700);text-decoration:underline}
.fb-wxlink:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.fb-wxlink::after{content:'▾';font-size:11px;opacity:.7;transition:transform .18s ease}
.fb-wxlink.on::after{transform:rotate(180deg)}

/* 展开块：原位展开在弹层内，不遮挡任何已写内容 */
.fb-wxbox{margin:2px 0 6px;padding:13px 15px;border-radius:13px;
  background:var(--primary-soft);border:none;border-left:3px solid var(--primary);
  animation:fbWxIn .18s ease}
@keyframes fbWxIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.fb-wxbox[hidden]{display:none!important}
.fb-wxbox-lb{font-size:11.5px;color:var(--muted);letter-spacing:.3px;margin-bottom:5px}
.fb-wxbox-id{display:inline-flex;align-items:center;min-height:44px;padding:8px 15px;
  border-radius:11px;background:var(--surface);border:1.5px dashed var(--primary);
  color:var(--ink);font-size:16px;font-weight:700;letter-spacing:.5px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;cursor:pointer}
.fb-wxbox-id:hover{background:var(--primary-soft)}
.fb-wxbox-id:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.fb-wxbox-tip{font-size:12px;color:var(--muted);line-height:1.55;margin-top:8px}
.fb-wxcopy{display:block;min-height:44px;margin-top:9px;padding:0 15px;border-radius:11px;
  background:var(--primary);color:#fff;border:none;font-size:13px;font-weight:600;
  font-family:inherit;cursor:pointer}
.fb-wxcopy:hover{background:var(--primary-700)}
.fb-wxcopy:focus-visible{outline:2px solid var(--primary-600);outline-offset:2px}

/* 暗色：同构图换深玻璃 */
[data-theme="dark"] .fb-wxbox{background:rgba(62,155,232,.1)}
[data-theme="dark"] .fb-wxbox-id{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.28)}
[data-theme="dark"] .fb-wxbox-id:hover{background:rgba(62,155,232,.16)}
[data-theme="dark"] .fb-wxcopy{color:#0b1220}
.fb-foot .btn{height:38px;padding:0 18px}
/* 移动端：贴底抽屉（复用 sheet 观感），顶到 safe-area 之上、避开 dock */
@media (max-width:860px){
  .fb-overlay{padding:0;align-items:flex-end}
  .fb-panel{max-width:none;border-radius:18px 18px 0 0;border-bottom:none;max-height:88vh;
    padding-bottom:0}
  .fb-foot{padding-bottom:calc(14px + env(safe-area-inset-bottom,0px))}
}

/* ===== 10/4 01:45 定价页质感 · 丙方案共享件（她 00:19 选丙）=====
   两件都写成全站可复用类；落地页 index.html 不走 common.css、用自己的动画，不引这两个。 */

/* ① kicker 小标题（会员页/设置页用）——「层级靠字重和颜色拉开，不靠尺寸」 */
.kicker{display:block;font-size:12.5px;font-weight:700;letter-spacing:.09em;
  color:var(--primary-700);text-transform:uppercase;margin:0 0 3px}

/* ② 进场动画。🚨 10/4 10:20 改默认行为（她 10:08 报「会员页四张卡全空白」）：
      原版把 .rv 硬编码成 opacity:0，等 IntersectionObserver 加 .in 才显示 ——
      **脚本稍有差池（放错位置 / 被 CF 301 打断 / 弱网晚跑）内容就永久隐身**，
      而且这类故障极难排查（页面能开、就是空）。
      现在改成【默认可见】：html.js .rv 才隐藏（js 类由页内脚本在 <head> 早期加上），
      没有 js 类、或 observer 没跑 → 内容一律正常显示，动画只是锦上添花。 */
.js .rv{opacity:0;transform:translateY(16px)}
.js .rv.in{opacity:1;transform:none}
.rv{transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.rv[data-d="1"]{transition-delay:.07s}
.rv[data-d="2"]{transition-delay:.14s}
.rv[data-d="3"]{transition-delay:.21s}
@media (prefers-reduced-motion: reduce){.js .rv{opacity:1;transform:none;transition:none}}

/* ==========================================================================
   10/4 17:55 移动端 dock 分组（她 17:12 提 + 17:54 拍板甲版）
   —— 4 格：首页(直达) / 计划 / 学习 / 我的，点后三格从底部滑出组面板
   —— 详见 js/common.js 的 GROUPED_DOCK 注释（结构定义在那里）
   ========================================================================== */
/* 遮罩复用 .sheet-backdrop 的视觉，只多一个 body class 触发 */
body.dgs-open #dockGroupBackdrop{display:block;opacity:1}
/* 组面板：贴底卡片 + 顶部小抓手（微信底部动作面板同款） */
.dock-group-sheet{
  position:fixed;left:0;right:0;bottom:0;z-index:61;
  transform:translateY(100%);
  background:var(--surface);
  border-radius:20px 20px 0 0;
  border:1px solid var(--line);border-bottom:none;
  box-shadow:0 -14px 48px rgba(15,23,42,.32);
  padding:0 0 calc(10px + env(safe-area-inset-bottom));
  transition:transform .28s cubic-bezier(.32,.72,.35,1);
  max-height:76vh;display:flex;flex-direction:column;
  will-change:transform;
}
body.dgs-open .dock-group-sheet{transform:translateY(0)}
.dgs-grab{
  width:38px;height:4px;border-radius:99px;background:var(--n-200);
  margin:9px auto 3px;flex:none;
}
.dgs-head{
  display:flex;align-items:center;gap:10px;
  padding:8px 18px 12px;border-bottom:1px solid var(--line);flex:none;
}
.dgs-head b{font-size:16px;font-weight:800;color:var(--n-900);letter-spacing:-.01em}
.dgs-close{
  margin-left:auto;width:32px;height:32px;flex:none;
  border:1px solid var(--line);background:var(--surface);color:var(--muted);
  border-radius:10px;font-size:13px;cursor:pointer;font-family:inherit;
  transition:border-color .15s,color .15s;
}
.dgs-close:hover{border-color:var(--primary-300);color:var(--primary-700)}
.dgs-list{
  flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding:8px 12px 6px;
}
.dgs-item{
  display:flex;align-items:center;gap:12px;
  min-height:56px;padding:10px 12px;border-radius:13px;
  text-decoration:none;color:inherit;
  transition:background .14s;
}
.dgs-item:active{background:var(--primary-50)}
.dgs-item.cur{background:var(--primary-50)}
/* 44px 触控命中：图标盒 40px + min-height 56px */
.dgs-ic{
  width:40px;height:40px;flex:none;border-radius:12px;
  background:var(--n-100);color:var(--ink-2);
  display:flex;align-items:center;justify-content:center;
  transition:background .15s,color .15s;
}
.dgs-ic svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.dgs-item.cur .dgs-ic{background:var(--primary-200);color:var(--primary-800)}
.dgs-tx{min-width:0;flex:1}
.dgs-tx b{display:block;font-size:15px;font-weight:700;color:var(--n-900);line-height:1.3}
.dgs-tx span{display:block;font-size:12px;color:var(--muted);margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (prefers-reduced-motion: reduce){.dock-group-sheet{transition:none}}

/* dock 4 格：从 4 格+更多 变 4 格，按钮略宽 —— 只在移动端生效 */
.ui-menu-grouped{justify-content:space-between}
.ui-menu-grouped .ui-menu-item{flex:1 1 0;min-width:0}

/* ==========================================================================
   组页（plans-hub / study / me）— 18:42 她拍板「我要一整个界面就行了」
   —— 上一版是底部弹出的浮层，她不喜欢；改成三张完整页面。
   —— 页面内每张卡点进原来的 plans.html / timer.html / …（原页面零改动）。
   ========================================================================== */
#hubGroupRoot{max-width:760px;margin:0 auto}
.hubg-head{padding:4px 2px 18px}
.hubg-head h1{
  margin:0 0 6px;font-size:26px;line-height:1.25;font-weight:800;
  letter-spacing:-.02em;color:var(--n-900);
}
.hubg-head p{margin:0;font-size:13.5px;line-height:1.7;color:var(--muted)}
.hubg-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:520px){.hubg-grid{grid-template-columns:1fr}}
.hubg-card{
  display:flex;align-items:center;gap:13px;
  min-height:78px;padding:15px 16px;
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);text-decoration:none;color:inherit;
  box-shadow:var(--shadow);
  transition:border-color .16s,box-shadow .16s,transform .1s;
}
.hubg-card:active{transform:scale(.985)}
.hubg-card:hover{border-color:var(--primary-200);box-shadow:var(--shadow-md)}
/* 44px 触控命中：图标盒 44 + min-height 78 */
.hubg-ic{
  width:44px;height:44px;flex:none;border-radius:13px;
  background:var(--n-100);color:var(--ink-2);
  display:flex;align-items:center;justify-content:center;
  transition:background .16s,color .16s;
}
.hubg-ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hubg-card.cur{background:var(--primary-50);border-color:var(--primary-200)}
.hubg-card.cur .hubg-ic{background:var(--primary-200);color:var(--primary-800)}
/* 第一张卡（最该去的那个）稍加重 */
.hubg-card.accent{
  background:linear-gradient(135deg,var(--primary-50),var(--surface));
  border-color:var(--primary-200);
}
.hubg-card.accent .hubg-ic{background:var(--primary-200);color:var(--primary-800)}
.hubg-tx{min-width:0;flex:1}
.hubg-tx b{display:block;font-size:16px;font-weight:800;color:var(--n-900);line-height:1.3;letter-spacing:-.01em}
.hubg-tx span{display:block;font-size:12.5px;color:var(--muted);margin-top:3px;line-height:1.5}
.hubg-ar{color:var(--n-300);flex:none}
.hubg-ar svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.hubg-note{
  margin:18px 2px 0;font-size:12.5px;line-height:1.75;color:var(--muted);
}
#hubGroupRoot .empty{padding:40px 0;text-align:center;color:var(--muted);font-size:14px}