/* ══════════════════════════════════════════════════════════════
   奇迹阅读 · 设计令牌与基础样式
   品牌：奇迹能量英语文化工作室
   双主题：常规版（白色简约，参考 theamericanscholar.org）为默认；
   护眼版（淡紫莫兰迪）= html[data-theme="eye"]，右上角按钮切换。
   ══════════════════════════════════════════════════════════════ */
:root{
  /* 常规版：严格对标 theamericanscholar.org
     强调红 #DD4D28 ｜ 发丝线 #E6E6E6（重线 #CCC/#000）｜ 正文 #333 ｜ 灰阶 #7F7F7F/#9B9B9B ｜ 纯白底 */
  --bg:#FFFFFF; --bg-warm:#FCFCFC; --card:#FFFFFF;
  --ink:#000000; --ink-2:#333333; --muted:#7F7F7F; --faint:#9B9B9B;
  --brand:#DD4D28; --brand-d:#B23A18; --brand-l:#FBEAE3;
  --lav:#E6E6E6; --rose:#B96A7B; --rose-l:#F7EDEF;
  --gold:#C9A227; --teal:#5E8B84;
  --line:#E6E6E6; --line-2:#CCCCCC;
  --hdr-bg:rgba(255,255,255,.92);
  --bar-bg:rgba(255,255,255,.96);
  --hero-bg:#FFFFFF;
  --qbox-bg:#FCFCFC;
  --wall-a:#FFEDF2; --wall-b:#F1E6FF;
  --r-s:8px; --r-m:14px; --r-l:22px; --r-xl:32px;
  --sh-s:0 1px 3px rgba(0,0,0,.05);
  --sh-m:0 6px 22px rgba(0,0,0,.08);
  --sh-l:0 18px 50px rgba(0,0,0,.12);
  --glow:rgba(221,77,40,.45);
  --cta-a:#E9704C; --cta-b:#DD4D28; --cta-s:#B23A18; --cta-k:#7A2410; --cta-t1:#FFD9CB;
  --serif:Georgia,"Songti SC","Times New Roman",serif;
  --sans:"Microsoft YaHei","Segoe UI",system-ui,-apple-system,sans-serif;
  --maxw:1240px; --hdr:64px;
  /* 2026-10-01 用户定：常规版不再通体纯白 —— 上方 72% 保持纯白，
     越往下越淡地透出一点主题色（品牌红的极浅调），到页尾自然收住。 */
  /* 2026-10-11 用户令：去掉横向暖色渐变，通体回归纯色；
     模块点缀改由两侧留白的几何装饰承担（见下方“首页模块几何装饰”）。 */
  --bg-grad:#FFFFFF;
}

/* ── 首页模块几何装饰（2026-10-11 用户令，当晚第六次修订）─────────
   Hero：同心轨道环**套在小男孩图片上**（挂在 .hero-art，环心＝图片中心）。
   四模块各有母题（每幅 SVG 内含**上下分散的 2 个完整元素**）：
   · 经典书目 #shelf   =【小卡通书】geo-books.svg（替换原书脊）
   · 轻松短篇 #shorts  =【纸页】geo-papers.svg
   · 不知道读什么 #picks =【卡通问号】geo-ask.svg
   · 读书笔记墙 #wall  =【短粗铅笔】geo-pencil.svg
   · 分级指引 #levels  =【立体小楼梯】geo-stairs.svg（2026-10-12 用户令：凌乱排放两侧）
   均置于模块两侧、**只出现在内容区（1240px）之外的两侧留白里**。
   关键改版：弃用 repeat-x 平铺（平铺宽度固定而条带宽随屏宽变化，
   拼接处必然把元素裁半——用户反馈"半截/只露头尾"的根因），
   改为**每侧恰好一整幅母题图**：contain 完整缩放 + no-repeat，
   任何带宽下元素都完整呈现；右侧条带 scaleX(-1) 镜像 → 左右方向各异。
   内容区内部不出图，窄屏无留白时自动消失。阅读理念不放装饰。
   滚动中装饰淡出（body.scrolling 由 site.js 挂），停止后错峰渐显。仅首页启用。 */
body[data-page="home"] .hero-art{position:relative}
body[data-page="home"] .hero-art::before{
  content:"";position:absolute;right:0;top:50%;width:min(100%,468px);aspect-ratio:1;
  transform:translateY(-50%);pointer-events:none;z-index:0;
  background:url("geo-hero.svg") center/contain no-repeat;
  opacity:.9;transition:opacity .85s ease}
body[data-page="home"] .hero-art img{position:relative;z-index:1}
body[data-page="home"] .sec{position:relative}
/* 两侧留白带：只画在内容区（.wrap 1240px）之外的左右留白里，内容区内不出图。
   垂直位置＝**与模块内横向滚动条对齐**（2026-10-11 用户令）：滚动容器底部距
   section 底 46px（= .sec 的 padding-bottom），滚动条高 8px，
   故条带 bottom = 46 + 4 = 50px（条带底边落在滚动条中线）。
   出现时机＝**滚动进入模块即渐显**：默认 opacity:0，模块露出 12% 时由 site.js
   的 IntersectionObserver 挂 .geo-on 点亮，离场复位、再进再亮。
   注：#shelf 等 section 自身就是 1240px 内容容器，故留白宽须用视口算；
   且 100vw 含滚动条宽，两侧各留 16px 安全边距，**绝不越出视口**（否则整页
   会出横向滚动条、看起来像"比例变了"）。 */
body[data-page="home"] #shelf::before,body[data-page="home"] #shorts::before,
body[data-page="home"] #picks::before,body[data-page="home"] #wall::before,
body[data-page="home"] #levels::before,
body[data-page="home"] #shelf::after,body[data-page="home"] #shorts::after,
body[data-page="home"] #picks::after,body[data-page="home"] #wall::after,
body[data-page="home"] #levels::after{
  content:"";position:absolute;bottom:50px;top:auto;
  width:max(0px, calc((100vw - 100%) / 2 - 16px));
  height:170px;pointer-events:none;z-index:-1;
  background-repeat:no-repeat;background-position:center;background-size:contain;
  opacity:0;transition:opacity .7s ease}
/* 四模块各用各的母题（2026-10-11 用户令） */
body[data-page="home"] #shelf::before,body[data-page="home"] #shelf::after{
  background-image:url("geo-books.svg")}
body[data-page="home"] #shorts::before,body[data-page="home"] #shorts::after{
  background-image:url("geo-papers.svg")}
body[data-page="home"] #picks::before,body[data-page="home"] #picks::after{
  background-image:url("geo-ask.svg")}
body[data-page="home"] #wall::before,body[data-page="home"] #wall::after{
  background-image:url("geo-pencil.svg")}
body[data-page="home"] #levels::before,body[data-page="home"] #levels::after{
  background-image:url("geo-stairs.svg")}
body[data-page="home"] .geo-on#shelf::before,body[data-page="home"] .geo-on#shorts::before,
body[data-page="home"] .geo-on#picks::before,body[data-page="home"] .geo-on#wall::before,
body[data-page="home"] .geo-on#levels::before,
body[data-page="home"] .geo-on#shelf::after,body[data-page="home"] .geo-on#shorts::after,
body[data-page="home"] .geo-on#picks::after,body[data-page="home"] .geo-on#wall::after,
body[data-page="home"] .geo-on#levels::after{opacity:.9}
body[data-page="home"] #shelf::before,body[data-page="home"] #shorts::before,
body[data-page="home"] #picks::before,body[data-page="home"] #wall::before,
body[data-page="home"] #levels::before{
  left:min(0px, calc((100% - 100vw) / 2 + 16px))}
body[data-page="home"] #shelf::after,body[data-page="home"] #shorts::after,
body[data-page="home"] #picks::after,body[data-page="home"] #wall::after,
body[data-page="home"] #levels::after{
  right:min(0px, calc((100% - 100vw) / 2 + 16px));
  transform:scaleX(-1)} /* 右带镜像 → 左右元素方向各异（2026-10-11 用户令） */
/* 错峰渐显延迟 */
body[data-page="home"] #shelf::before,body[data-page="home"] #shelf::after{transition-delay:.06s}
body[data-page="home"] #shorts::before,body[data-page="home"] #shorts::after{transition-delay:.12s}
body[data-page="home"] #picks::before,body[data-page="home"] #picks::after{transition-delay:.18s}
body[data-page="home"] #wall::before,body[data-page="home"] #wall::after{transition-delay:.24s}
body[data-page="home"] #levels::before,body[data-page="home"] #levels::after{transition-delay:.30s}
/* Hero 同心环保留“滚动中淡出、停止渐显”；书脊带改由 .geo-on 控制出现时机，
   不再随页面滚动隐去（否则刚进入模块就被滚动状态抹掉，看不到渐显）。 */
body.scrolling[data-page="home"] .hero-art::before{
  opacity:0;transition-duration:.18s;transition-delay:0s}
@media (prefers-reduced-motion:reduce){
  body[data-page="home"] .hero-art::before,
  body[data-page="home"] #shelf::before,body[data-page="home"] #shelf::after,
  body[data-page="home"] #shorts::before,body[data-page="home"] #shorts::after,
  body[data-page="home"] #picks::before,body[data-page="home"] #picks::after,
  body[data-page="home"] #wall::before,body[data-page="home"] #wall::after,
  body[data-page="home"] #levels::before,body[data-page="home"] #levels::after{transition:none}
}
/* 2026-10-11 用户令：撤销三个模块（分级指引 / 笔记墙 / 阅读理念）的渐变彩底，
   回退到上一版——模块区不留底色、不加边框，回归纯白底 + 发丝线基调。
   注：读书笔记墙**内部**的童趣彩底属上一轮单独需求（第 6 项），此处保留。 */

/* 护眼版：即初版淡紫莫兰迪风格 */
html[data-theme="eye"]{
  --bg:#F7F5FB; --bg-warm:#FBF9FD;
  --ink:#2A2340; --ink-2:#4A4266; --muted:#7A7392; --faint:#A9A3BC;
  --brand:#7C6BAE; --brand-d:#5B4B8A; --brand-l:#EDE9F7;
  --lav:#DAD4EA;
  --glow:rgba(124,107,174,.45);
  --cta-a:#9A87CE; --cta-b:#7C6BAE; --cta-s:#5B4B8A; --cta-k:#4A3E73; --cta-t1:#FFE9A8;
  --line:#E7E3F0; --line-2:#D8D2E6;
  --hdr-bg:rgba(247,245,251,.86);
  --bar-bg:rgba(247,245,251,.92);
  --hero-bg:
    radial-gradient(1100px 480px at 78% -12%,#EFEAF9 0%,rgba(239,234,249,0) 62%),
    radial-gradient(760px 380px at 8% 108%,#F8EDF0 0%,rgba(248,237,240,0) 60%),
    var(--bg-warm);
  --qbox-bg:linear-gradient(180deg,#F3EFFA,#FBF9FD);
  --wall-a:#F2EEFB; --wall-b:#E9E3F6;
  --bg-grad:var(--bg);
}
/* 护眼主题：笔记墙维持淡紫莫兰迪（糖果多彩仅常规版） */
html[data-theme="eye"] .wall{
  background:linear-gradient(180deg,var(--wall-a),var(--wall-b));border-color:var(--lav)}
html[data-theme="eye"] .wall::before{background:linear-gradient(90deg,var(--wall-a),rgba(242,238,251,0))}
html[data-theme="eye"] .wall::after{background:linear-gradient(270deg,var(--wall-b),rgba(233,227,246,0))}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bg-grad);color:var(--ink);
  font-family:var(--sans);font-size:16px;line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,select{font:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ── 顶部导航 ───────────────────────────────────────────────── */
.hdr{
  position:sticky;top:0;z-index:60;height:var(--hdr);
  background:var(--hdr-bg);backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line);
}
.hdr-in{max-width:var(--maxw);margin:0 auto;padding:0 22px;height:100%;
  display:flex;align-items:center;gap:20px}
/* 顶栏不放工作室 LOGO：导航直接左起 */
.nav-r{margin-left:auto}
.nav{display:flex;align-items:center;gap:2px;flex:1;min-width:0}
.nav a{padding:8px 13px;border-radius:999px;font-size:14.5px;color:var(--ink-2);white-space:nowrap;
  transition:.18s}
.nav a:hover{background:var(--brand-l);color:var(--brand-d)}
.nav a.on{background:var(--brand);color:#fff}
/* 花体字品牌字：Great Vibes（OFL 开源授权，可商用嵌入；随主题取品牌色） */
@font-face{font-family:"Great Vibes";font-style:normal;font-weight:400;font-display:swap;
  src:url("greatvibes.woff2") format("woff2")}
.wordmark{font-family:"Segoe Script","Brush Script MT","Bradley Hand",cursive;
  font-size:19px;color:var(--brand);white-space:nowrap;margin-right:14px;
  letter-spacing:.4px;text-shadow:0 1px 0 rgba(0,0,0,.04)}
/* v2.125 品牌字统一改图片：手写体导出图代替文字——字体缺失/被改时不再退化成普通文本，
   且天然可点击（外层 a 链回首页）；护眼主题换紫色版导出图（与 .hero-en 同一换图手法） */
.wordmark-img{display:block;height:25px;width:auto;margin-right:14px}
.hdr .wordmark-img{height:27px;margin-right:10px}
html[data-theme="eye"] .hdr .wordmark-img{content:url("wordmark-inline-purple.png")}
@media (max-width:720px){
  .hdr .wordmark-img{height:22px;margin-right:6px}
  /* 2026-10-12 删除过时规则 `#nav a:first-child{display:none}`：
     旧版 nav 首项是“← 返回首页”需隐藏；现 nav 首项是分组菜单里的
     “工作室介绍”，该规则在手机端把它误杀（"目录只呈现3个"的根因）。 */
}
.hero-en{display:inline-block;width:126px;height:15px;vertical-align:-2px}
html[data-theme="eye"] .hero-en{content:url("wordmark-inline-purple.png")}
/* 导航三组：图书馆 / 原版伴读 / 支持（桌面悬停或点击展开） */
.ngroup{position:relative;flex:none}
.ng-top{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:999px;
  font-size:14.5px;color:var(--ink-2);white-space:nowrap;transition:.18s}
.ng-top:hover{background:var(--brand-l);color:var(--brand-d)}
.ng-top .car{width:6px;height:6px;border-right:1.6px solid currentColor;
  border-bottom:1.6px solid currentColor;transform:rotate(45deg) translate(-1px,-2px);
  transition:.2s;opacity:.6}
.ngroup:hover .ng-top,.ngroup.open .ng-top{background:var(--brand-l);color:var(--brand-d)}
.ngroup:hover .car,.ngroup.open .car{transform:rotate(225deg) translate(-2px,-1px)}
.ng-menu{position:absolute;top:100%;left:0;min-width:172px;background:#fff;
  border:1px solid var(--line);border-radius:var(--r-m);box-shadow:var(--sh-m);
  padding:7px;border-top:9px solid transparent;background-clip:padding-box;
  display:none;flex-direction:column;z-index:70}
.ngroup:hover .ng-menu,.ngroup.open .ng-menu{display:flex}
.ng-menu a{padding:9px 12px;border-radius:9px;font-size:14px;color:var(--ink-2)}
.ng-menu a:hover{background:var(--brand-l);color:var(--brand-d)}
.ng-menu a.on{background:var(--brand);color:#fff}
.hdr-act{display:flex;align-items:center;gap:8px;flex:none;margin-left:auto}
.btn{border-radius:999px;padding:9px 18px;font-size:14.5px;transition:.18s;white-space:nowrap;
  border:1px solid transparent}
.btn-ghost{color:var(--ink-2);border-color:var(--line-2)}
.btn-ghost:hover{background:#fff;border-color:var(--brand);color:var(--brand-d)}
.btn-pri{background:var(--brand);color:#fff;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.btn-pri:hover{background:var(--brand-d)}
.btn-sm{padding:6px 13px;font-size:13px}
.icon-btn{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  color:var(--ink-2);border:1px solid transparent;transition:.18s}
.icon-btn:hover{background:var(--brand-l);color:var(--brand-d)}
.menu-btn{display:none}

/* ── 通用节标题（杂志式：上下发丝线 + 品牌红点 + 衬线标题，无底框）── */
/* v2.114：74px→46px，压缩首页相邻模块之间的留白（用户反馈模块间空白过大） */
.sec{padding:46px 0}
#shelf.sec,#picks.sec,#shorts.sec{padding-top:40px}
.sec-h{display:flex;align-items:baseline;gap:14px;margin-bottom:28px;flex-wrap:wrap;
  border-top:1px solid var(--line-2);border-bottom:1px solid var(--line);
  padding:13px 2px}
.sec-h h2{margin:0;font-family:var(--serif);font-size:25px;font-weight:400;letter-spacing:.3px;color:var(--ink)}
.sec-h h2::before{content:"";display:inline-block;width:7px;height:7px;background:var(--brand);
  margin-right:13px;vertical-align:middle}
.sec-h .en{font-size:11.5px;letter-spacing:2.6px;text-transform:uppercase;color:var(--muted)}
.sec-h .more{margin-left:auto;font-size:13.5px;color:var(--brand)}
.sec-h a.more{text-decoration:none;transition:opacity .18s}
.sec-h a.more:hover{opacity:.72}
.sec-h .more:hover{color:var(--brand-d)}
.sec-sub{margin:18px 0 28px;color:var(--muted);font-size:15px;max-width:66ch}

/* ── 网站功能页改版（2026-10-11 用户令：三小标题 + 截图/文字组）──────
   截图取自真实阅读页/会员中心（2x 缩放裁剪，替代原模糊大图）；
   左右交错排布，编号胶囊 + 发丝线列表 + 圆角截图框。 */
.feat-sec{margin:6px 0 8px}
/* .pg 默认 860px 窄列；功能页要放“截图+文字”宽行 → 主列放宽到 1240（同首页内容宽） */
.pg.pg-features{max-width:1240px}
.pg h3.feat-h{display:flex;align-items:center;gap:12px;margin:40px 0 20px;
  font-family:var(--serif);font-size:25px;font-weight:700;color:var(--ink);letter-spacing:.02em}
.feat-h::before{content:"";width:8px;height:26px;border-radius:4px;background:var(--brand);flex:none}
.feat-row{display:grid;grid-template-columns:1.12fr .88fr;gap:36px;align-items:center;margin:0 0 16px}
.feat-row.rev{grid-template-columns:.88fr 1.12fr}
.feat-shot{margin:0;position:relative;border-radius:18px;overflow:hidden;
  border:1px solid var(--line);box-shadow:var(--sh-m);background:#fff}
.feat-shot img{display:block;width:100%;height:auto}
/* 笔记区三联真实截图（2026-10-12 用户令）：列表 + 三面板并排，顶部对齐；
   同日午后用户令“缩空白、放大图片”：按三图实际宽高比重排列（图1竖长通高，
   图2/3横宽上下叠放），列宽 1.18fr:1fr 使三图自然等高、基本填满右侧无大留白 */
.feat-notes{grid-template-columns:minmax(0,.95fr) minmax(0,2.05fr);align-items:start}
.feat-shots{display:grid;grid-template-columns:1.18fr 1fr;grid-template-rows:auto auto;gap:12px;align-items:start}
.feat-shots .feat-shot:first-child{grid-row:1/span 2}
.feat-shots .feat-shot{border:1px solid var(--line);border-radius:12px}
.feat-list{list-style:none;margin:0;padding:6px 22px;background:var(--bg-warm);
  border:1px solid var(--line);border-radius:18px}
.feat-list li{display:flex;align-items:center;gap:14px;padding:14px 2px;border-bottom:1px dashed var(--line)}
.feat-list li:last-child{border-bottom:0}
.feat-list i{font-style:normal;font-family:Georgia,serif;font-size:12.5px;color:var(--brand-d);
  background:var(--brand-l);border-radius:999px;padding:3px 11px;letter-spacing:.5px;flex:none}
.feat-list b{font-size:16.5px;color:var(--ink-2);font-weight:600;line-height:1.5}
.feat-list.alt{background:var(--rose-l)}
.feat-list.alt i{background:#fff;color:var(--rose)}
.feat-side{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:2px 0 6px;font-size:14px}
.feat-side b{color:var(--ink-2)}
.feat-side span{background:#fff;border:1px solid var(--line);border-radius:999px;
  padding:6px 15px;color:var(--muted)}
.feat-more{display:flex;gap:20px;flex-wrap:wrap;margin:4px 0 6px}
.feat-more .fm{display:flex;align-items:center;gap:12px;background:#fff;
  border:1px solid var(--line);border-radius:999px;padding:11px 26px 11px 13px;
  box-shadow:var(--sh-s);font-size:16.5px;font-weight:600;color:var(--ink-2);
  transition:transform .18s,box-shadow .18s}
.feat-more .fm:hover{transform:translateY(-3px);box-shadow:var(--sh-m)}
.feat-more .fm svg{width:36px;height:36px;border-radius:50%;background:var(--brand-l);
  color:var(--brand);padding:8px;flex:none}
@media (max-width:900px){
  .feat-row,.feat-row.rev{grid-template-columns:1fr;gap:16px}
  .feat-row.rev .feat-list{order:2}
  .feat-notes{grid-template-columns:1fr}
  .feat-row.rev.feat-notes .feat-list{order:0}
}
@media (max-width:640px){
  .feat-shots{grid-template-columns:1fr;grid-template-rows:auto;gap:12px}
  .feat-shots .feat-shot:first-child{grid-row:auto}
}
/* 理念页底部引导链接（2026-10-11 用户令）：品牌红 + 下划线，与灰色正文区分。
   原仅用于 idea.html；该页 2026-10-19 已并入 studio.html，样式保留备用（news 详情页不受影响） */
.sec-sub.idea-links a{color:var(--brand);text-decoration:underline;text-underline-offset:3px}
.sec-sub.idea-links a:hover{color:var(--brand-d)}
/* 板块标题下的灰色小字（轻松短篇 · 海明威） */
.sec-motto{margin:-14px 0 24px;padding:0 2px;font-size:13.5px;line-height:2.05;
  letter-spacing:.2px;color:var(--muted)}
/* 分级指引介绍：第一行要放下完整六级路线，不受 66ch 限制 */
#levels .sec-sub{max-width:none}

/* ── 首页 Hero ──────────────────────────────────────────────── */
.hero{position:relative;overflow:hidden;background:var(--hero-bg);
  border-bottom:1px solid var(--line)}
.hero-in{max-width:var(--maxw);margin:0 auto;padding:74px 22px 66px;
  display:grid;grid-template-columns:1.06fr .94fr;gap:52px;align-items:center}
.hero-tag{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;letter-spacing:1.4px;
  text-transform:uppercase;color:var(--brand)}
.hero h1{margin:20px 0 0;font-family:var(--serif);font-weight:400;
  font-size:clamp(38px,5.2vw,62px);line-height:1.12;letter-spacing:.5px}
.hero h1 em{font-style:normal;color:var(--brand-d);position:relative;white-space:nowrap}
.hero h1 em::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:11px;
  background:var(--brand-l);opacity:.6;border-radius:2px;z-index:-1}
.hero p.lead{margin:20px 0 0;font-size:16.5px;color:var(--ink-2);max-width:70ch}
.hero-cta{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap}
.hero-cta .btn{padding:13px 26px;font-size:15.5px}
.hero-stat{display:flex;gap:34px;margin-top:40px;padding-top:26px;border-top:1px solid var(--line)}
.hero-stat div b{display:block;font-family:var(--serif);font-size:26px;color:var(--brand-d);
  line-height:1.2}
.hero-stat div span{font-size:12.5px;color:var(--muted);letter-spacing:.6px}
.hero-art{position:relative}
.hero-art img{display:block;width:100%;height:auto;max-width:468px;margin-left:auto;
  filter:drop-shadow(0 18px 30px rgba(0,0,0,.16))}

/* ── 分级测试文本面板（悬停等级卡片显示） ─────────────────── */
.lad-demo{margin-top:18px;background:var(--bg-warm);border:1px solid var(--line);
  border-radius:14px;padding:20px 24px;min-height:96px}
/* v2.127 用户令：悬停描边 / 进入胶囊 / 试读面板 L 徽标跟随本级别色（--lc） */
.lad-s.lad-hot{border-color:var(--lc,var(--brand));
  box-shadow:0 10px 24px color-mix(in srgb,var(--lc,var(--brand)) 18%,transparent)}
.lad-demo-h{color:var(--muted);font-size:14px;line-height:1.8}
.lad-demo-t{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.lad-demo-t .lv{font-family:var(--serif);font-size:17px;color:#fff;background:var(--lc,var(--brand));
  border-radius:8px;padding:2px 10px}
.lad-demo-t b{font-family:var(--serif);font-size:17px;color:var(--ink)}
.lad-demo-t i{font-style:normal;font-size:13.5px;color:var(--muted)}
.lad-demo-tx{font-family:Georgia,"Times New Roman",serif;font-size:15.5px;line-height:1.92;
  color:var(--ink);margin:0}
.lad{cursor:pointer}

/* ── 书架横滑 ───────────────────────────────────────────────── */
#shelf .sec-h{margin-bottom:14px}
#shelf{position:relative}
.rail-btn{position:absolute;top:calc(50% - 46px);transform:translateY(-50%);width:54px;height:54px;z-index:5;
  border-radius:50%;border:1px solid var(--line-2);background:var(--card);color:var(--brand);
  cursor:pointer;box-shadow:var(--sh-m);display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;transition:transform .18s,box-shadow .18s,background .15s,color .15s,border-color .15s,opacity .22s,visibility .22s;font-family:inherit}
.rail-btn svg{width:22px;height:22px}
#shelf:hover .rail-btn,#shelf:focus-within .rail-btn,.rail-btn:focus-visible,
#picks:hover .rail-btn,#picks:focus-within .rail-btn,
.lv-strip:hover .rail-btn,.lv-strip:focus-within .rail-btn{
  opacity:.62;visibility:visible}
.rail-btn:hover{border-color:var(--brand);background:var(--brand);color:#fff;
  opacity:1;transform:translateY(-50%) scale(1.1);box-shadow:var(--sh-l)}
.rail-btn:active{transform:translateY(-50%) scale(.96)}
.rail-btn.prev{left:-12px}
.rail-btn.next{right:-12px}
@media (hover:none){.rail-btn{opacity:1;visibility:visible}}
.rail{display:flex;gap:22px;overflow-x:auto;padding:6px 22px 26px;margin:0;
  scroll-snap-type:x mandatory;scrollbar-width:thin}
.rail::-webkit-scrollbar{height:8px}
.rail::-webkit-scrollbar-thumb{background:var(--lav);border-radius:99px}
.rail::-webkit-scrollbar-track{background:transparent}
.bk{flex:0 0 232px;scroll-snap-align:start;background:var(--card);border-radius:var(--r-l);
  box-shadow:var(--sh-s);border:1px solid var(--line);overflow:hidden;
  transition:transform .26s cubic-bezier(.2,.7,.3,1),box-shadow .26s;display:flex;flex-direction:column}
.bk:hover{transform:translateY(-6px);box-shadow:var(--sh-l)}
.bk-cover{position:relative;aspect-ratio:2/3;background:var(--lav);overflow:hidden}
.bk-cover svg{width:100%;height:100%}
.bk-badge{position:absolute;top:11px;left:11px;background:rgba(255,255,255,.93);
  color:var(--brand-d);font-size:11.5px;font-weight:600;letter-spacing:.5px;
  padding:4px 10px;border-radius:999px;box-shadow:var(--sh-s)}
/* 徽标在封面叠层内时：落到中文书名上方（v2.113，避开 MIRACLE READING 字样） */
.cv-ov .bk-badge{position:static;align-self:flex-start;margin-top:auto;margin-bottom:9px}
.cv-ov .bk-badge ~ .cv-b{margin-top:0}
.bk-soon{position:absolute;inset:0;background:rgba(42,35,64,.42);color:#fff;
  display:grid;place-items:center;font-size:13px;letter-spacing:2px;backdrop-filter:blur(1.5px)}
.bk-b{padding:15px 16px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.bk-b h3{margin:0;font-family:var(--serif);font-size:18.5px;font-weight:400}
.bk-b .en{font-size:12.5px;color:var(--faint);letter-spacing:.3px;margin-top:-4px}
.bk-b p{margin:0;font-size:13px;color:var(--muted);line-height:1.6;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bk-meta{margin-top:auto;padding-top:11px;border-top:1px solid var(--line);
  display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--muted);flex-wrap:wrap}
.chip{background:var(--brand-l);color:var(--brand-d);padding:2.5px 8px;border-radius:6px;
  font-size:11px;font-weight:600;letter-spacing:.3px}
.chip.rose{background:var(--rose-l);color:var(--rose)}

/* ── 淘宝“教师版批注 PDF”购买入口 ── */
.chip.tb{background:#FBF3DF;color:#8E7420;cursor:pointer;
  transition:background .15s,color .15s;user-select:none}
.chip.tb:hover{background:#F3E4BC;color:#6E5A14}
/* 2026-09-27：.tb-buy 淘宝购买按钮已取消（购买入口站内独占，B5/B7 实现站内购买） */

/* ── 大模块（课程 / 理念）───────────────────────────────────── */
.mods{display:grid;gap:22px}
/* Bridge 阅读法六步条（嵌在红色理念卡内，白字版式；拱形排列：中间高两边低） */
.brg{position:relative;margin-top:26px;max-width:none;padding-bottom:26px}
.brg-arc{position:absolute;left:8.333%;right:8.333%;width:83.334%;top:0;height:62px;display:block;pointer-events:none}
.brg-st{position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:14px;text-align:center}
.brg-i{transition:transform .3s cubic-bezier(.2,.7,.3,1)}
.brg-i:nth-child(1),.brg-i:nth-child(6){transform:translateY(26px)}
.brg-i:nth-child(2),.brg-i:nth-child(5){transform:translateY(9px)}
.brg-i:hover{transform:translateY(2px)}
.brg-i:nth-child(1):hover,.brg-i:nth-child(6):hover{transform:translateY(20px)}
.brg-i:nth-child(2):hover,.brg-i:nth-child(5):hover{transform:translateY(5px)}
.brg-d{width:64px;height:64px;margin:0 auto;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:#fff;font:700 32px Georgia,"Times New Roman",serif;border:3px solid rgba(255,255,255,.92);
  box-shadow:0 5px 16px rgba(70,25,45,.34),inset 0 0 0 1px rgba(255,255,255,.18)}
.brg-en{margin-top:10px;font:700 17px Georgia,serif;color:#fff;letter-spacing:.4px}
.brg-cn{margin-top:2px;font-size:14.5px;font-weight:700;color:#fff;letter-spacing:1px}
.brg-ds{margin:5px auto 0;font-size:12px;color:rgba(255,255,255,.92);line-height:1.55;max-width:170px}
/* v2.38：红卡头部改为三行竖排——主标题 / 破折号句（独立一行、与主标题左对齐）/ Bridge 句；
   卡片随之加高（上下内边距增大） */
.mods .mod-b{padding:54px 44px 50px}
.mod-hrow{display:block}
.mod-hrow h3{white-space:nowrap}
.mod-hrow p{margin-top:14px}
.mods .mod-in.wide .mod-sub{max-width:none}
.mod-sub{margin-top:10px}
/* v2.67 首页红卡改版：左列 LOGO+文案竖排，右列 BRIDGE 环形图（仅首页使用；
   分页页脚走冻结片段 bridge_card.html.fragment，仍是旧弧形横条布局） */
.mod{position:relative;border-radius:var(--r-xl);overflow:hidden;min-height:300px;
  display:flex;align-items:flex-end;padding:40px;color:#fff;
  box-shadow:var(--sh-m);transition:transform .3s cubic-bezier(.2,.7,.3,1)}
.mod:hover{transform:translateY(-4px)}
.mod-a{background:linear-gradient(122deg,#6B5A9E 0%,#8A76BE 46%,#AE9BCE 100%)}
.mod-b{background:linear-gradient(122deg,#A5626E 0%,#C47E8D 52%,#DBA6B1 100%)}
.mod-2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.mod::after{content:"";position:absolute;inset:0;opacity:.5;
  background:radial-gradient(420px 200px at 88% 8%,rgba(255,255,255,.24),transparent 68%),
             radial-gradient(320px 200px at 6% 96%,rgba(255,255,255,.14),transparent 70%)}
.mod-in{position:relative;z-index:1;max-width:56ch}
.mod-in.wide{max-width:none}
.mod-in.wide :is(.mod-k,h3,p){max-width:56ch}
/* 首页 BRIDGE 卡右上角 · 工作室 LOGO（仅首页 home.html 引用，不影响其他页）
   顶部中文已转白；ME_CY_RATIO=0.448（me 中心距图顶占比），top 按左侧大标题垂直居中校准 */
.mods .mod-logo{position:absolute;top:49px;right:40px;width:122px;height:auto;z-index:2;
  filter:drop-shadow(0 6px 18px rgba(56,30,64,.38))}
.mod-k{font-size:11.5px;letter-spacing:2.4px;text-transform:uppercase;opacity:.82}
.mod h3{margin:12px 0 0;font-family:var(--serif);font-size:27px;font-weight:400;line-height:1.3}
.mod p{margin:12px 0 0;font-size:14.5px;line-height:1.72;opacity:.93}
.mod .go{display:inline-flex;align-items:center;gap:7px;margin-top:22px;font-size:14px;
  padding:9px 20px;border-radius:999px;background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.34);transition:.2s}
.mod .go:hover{background:rgba(255,255,255,.28)}
.tbd{margin-top:16px;display:inline-flex;align-items:center;gap:7px;font-size:12px;
  padding:5px 12px;border-radius:999px;background:rgba(255,255,255,.14);
  border:1px dashed rgba(255,255,255,.42)}
.idea-wrap{display:flex;gap:26px;align-items:stretch;margin-top:28px}
.tour-box{flex:1;min-width:0;align-self:stretch;display:flex;flex-direction:column;
  background:transparent;border:none;box-shadow:none;
  padding:4px 0 0}
.tour-dots{display:flex;justify-content:center;gap:10px;padding:12px 0 2px}
.dt{width:12px;height:12px;border-radius:50%;border:none;background:#D8D2E4;cursor:pointer;
  padding:0;transition:background .2s,transform .2s;font-family:inherit}
.dt:hover{background:#B9AFCB}
.dt.on{background:var(--brand);transform:scale(1.18)}
.tour-views{flex:1;position:relative;min-height:0}
.tv{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;
  opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.tv.on{opacity:1;visibility:visible}
.idea{flex:none;width:450px;display:flex;flex-direction:column;gap:16px}
.idea-c{flex:1;display:flex;flex-direction:column;justify-content:center;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-l);
  padding:26px 24px;box-shadow:var(--sh-s);transition:.22s}
.idea-c:hover{box-shadow:var(--sh-m);transform:translateY(-3px)}
.idea-n{width:38px;height:38px;border-radius:12px;background:var(--brand-l);color:var(--brand-d);
  display:grid;place-items:center;font-family:var(--serif);font-size:17px}
.idea-h{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.idea-c h4{margin:0;font-size:16.5px}
.idea-c p{margin:0;font-size:13.5px;color:var(--muted);line-height:1.72}

/* ── 登录态头部 + 个人中心（v2.44 本地演示版）────────────────── */
.hdr-login{display:inline-flex;gap:10px}
.who-wrap{display:flex;align-items:center}
.who-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);
  background:var(--card);border-radius:999px;padding:7px 18px 7px 6px;cursor:pointer;
  font-family:inherit;font-size:14.5px;color:var(--ink);box-shadow:var(--sh-s);transition:.2s}
.who-btn:hover{box-shadow:var(--sh-m);transform:translateY(-1px)}
.who-av{width:28px;height:28px;border-radius:50%;background:var(--brand);color:#fff;
  display:grid;place-items:center;font-size:13px;font-weight:700}
.who-nm{font-weight:600}
.who-badge{font-style:normal;font-size:10.5px;border-radius:999px;padding:2px 8px;white-space:nowrap}
.who-badge.vip{background:#F7EEDB;color:#8A6A2F;border:1px solid #EAD9B4}
.who-badge.adm{background:#EFE7FA;color:#5C4390;border:1px solid #D9CBEF}
/* 登录弹层：演示账号一键填入 */
.qa-fill{margin-top:12px;padding:9px 12px;border:1.5px dashed var(--lav);border-radius:12px;
  font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.qa-fill button{border:1px solid var(--brand);color:var(--brand-d);background:var(--brand-l);
  border-radius:999px;padding:3px 11px;font-size:11.5px;cursor:pointer;font-family:inherit;transition:.15s}
.qa-fill button:hover{background:var(--brand);color:#fff}
/* 个人中心弹层 */
.me-c{max-width:580px;max-height:82vh;overflow:auto}
.me-head{display:flex;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.me-av{flex:none;width:46px;height:46px;border-radius:50%;background:var(--brand);color:#fff;
  display:grid;place-items:center;font-size:20px;font-weight:700;font-family:var(--serif)}
.me-hd{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.me-hd b{font-size:15.5px}
.me-hd span{font-size:12px;color:var(--muted)}
.me-out{flex:none}
.me-sec{margin-top:14px}
.me-sec h5{margin:0 0 8px;font-size:11.5px;letter-spacing:1.6px;text-transform:uppercase;color:var(--faint)}
.me-p{margin:0 0 8px;font-size:12.5px;line-height:1.75;color:var(--muted)}
.me-p b{color:var(--ink-2)}
.me-dim{color:var(--faint)}
.me-buy{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0 4px}
.me-inv{margin-top:10px;padding:10px 12px;border-radius:12px;background:var(--bg-warm);
  border:1px solid var(--line);font-size:12px;color:var(--muted);display:flex;flex-direction:column;gap:6px}
.me-inv b{color:var(--brand-d)}
.me-bar{height:7px;border-radius:99px;background:#E7E2F2;overflow:hidden}
.me-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--brand),#B96A7B)}
.me-t{font-size:11px;color:var(--faint)}
.me-row{display:block;font-size:12.5px;line-height:1.9;color:var(--ink-2)}
.me-row a{color:var(--brand-d)}
.me-note{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px dashed var(--line)}
.me-note img{width:52px;height:38px;object-fit:cover;border-radius:6px;border:1px solid var(--line)}
.me-ntx{flex:1;min-width:0;font-size:12px;color:var(--ink-2);display:flex;flex-direction:column;gap:3px}
.me-ntx .st{font-style:normal;font-size:11px;color:var(--muted)}
.me-act{display:flex;gap:8px}
.me-act .btn{padding:4px 12px;font-size:12px}
.me-adm{border:1.5px solid var(--lav);border-radius:var(--r-l);padding:12px 14px;background:#FAF8FE}
.me-adm-act{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}

/* ── 页脚 ───────────────────────────────────────────────────── */
.ft{background:#2A2340;color:#C9C3DC;margin-top:20px}
.ft-in{max-width:var(--maxw);margin:0 auto;padding:38px 22px 24px}
/* 页脚两栏：品牌（左）+ 二维码（右对齐，2026-10-20 三次令：删“支持”栏） */
.ft-top{display:grid;grid-template-columns:1fr auto;gap:32px;padding-bottom:20px;
  border-bottom:1px solid rgba(255,255,255,.12);align-items:start}
.ft-top>div:first-child p{padding-left:36px}  /* 介绍文字与品牌名（图标后）左对齐 */
.ft-qr{display:grid;grid-template-columns:repeat(3,auto);gap:38px;justify-content:end}
.ft .qr{margin:0;text-align:center;justify-self:center}
.ft .qr img{width:96px;height:96px;display:block;border-radius:10px;background:#fff;padding:6px;box-sizing:border-box}
.ft .qr-ph{width:96px;height:96px;display:flex;align-items:center;justify-content:center;
  border:1.5px dashed rgba(255,255,255,.35);border-radius:10px;color:#B9B2CF;
  font-size:12.5px;letter-spacing:2px;box-sizing:border-box}
.ft .qr figcaption{margin-top:8px;font-size:11.5px;color:#9E97B8;letter-spacing:.5px}
@media (max-width:1200px){
  .ft-top{grid-template-columns:1fr auto;gap:24px}
}
.ft h5{margin:0 0 12px;font-size:12px;letter-spacing:1.8px;text-transform:uppercase;
  color:#fff;opacity:.86}
.ft p,.ft li{font-size:13px;line-height:1.85;margin:0}
.ft ul{list-style:none;padding:0;margin:0}
.ft a:hover{color:#fff}
.ft-brand{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.ft-brand b{color:#fff;font-size:15px}
.disc{margin-top:16px;font-size:12px;line-height:1.95;color:#9E97B8;
  padding:16px 20px;background:rgba(255,255,255,.05);border-radius:var(--r-m);
  border-left:3px solid var(--rose)}
.disc b{color:#D8D2E6}
.ft-btm{margin-top:16px;font-size:11.5px;color:#847DA0;display:flex;gap:16px;flex-wrap:wrap;
  justify-content:space-between;align-items:center}
.ft-btm a{color:#847DA0;transition:.16s}
.ft-btm a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
/* 备案号（工信部要求：页脚展示并链接 beian.miit.gov.cn） */
.ft-icp{margin-top:10px;font-size:11.5px;color:#847DA0;display:flex;gap:16px;flex-wrap:wrap;
  align-items:center}
/* 公安备案行（2026-10-12）：图标 + 京公网安备11010802050618号，与 ICP 同排 */
.ft-btm .ga{display:inline-flex;align-items:center;gap:5px}
/* 2026-10-20 用户令③：备案号旁统一“隐私政策 / 用户协议”小链接（同阅读页 rd-icp） */
.ft-lg a:not(:last-child){margin-right:14px}
.ft-btm .ga img{width:14px;height:14px;display:block}
.ft-icp a{color:#847DA0;transition:.16s}
.ft-icp a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
/* 阅读页正文末尾备案行（发丝线分隔，低对比，不干扰阅读） */
.rd-icp{margin-top:34px;padding-top:14px;border-top:1px solid var(--line);text-align:center;
  font-size:11.5px;color:var(--faint);display:flex;gap:16px;flex-wrap:wrap;justify-content:center}
.rd-icp a{color:var(--faint);transition:.16s}
.rd-icp a:hover{color:var(--brand)}

/* ── 阅读页 ─────────────────────────────────────────────────── */
.rd{display:grid;grid-template-columns:236px minmax(0,1fr);gap:34px;
  max-width:var(--maxw);margin:0 auto;padding:26px 22px 130px;align-items:start}
.toc{position:sticky;top:calc(var(--hdr) + 26px);background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-l);padding:18px 14px;
  box-shadow:var(--sh-s);max-height:calc(100vh - 130px);overflow:auto}
.toc h4{margin:2px 6px 12px;font-size:11.5px;letter-spacing:1.8px;text-transform:uppercase;
  color:var(--faint)}
.toc a{display:flex;align-items:flex-start;gap:9px;padding:9px 11px;border-radius:10px;
  font-size:13.5px;color:var(--ink-2);transition:.16s;line-height:1.3}
.toc a:hover{background:var(--brand-l)}
.toc a.on{background:var(--brand);color:#fff}
.toc a.on .toc-n{background:rgba(255,255,255,.24);color:#fff}
.toc-n{flex:none;width:23px;height:23px;border-radius:7px;background:var(--brand-l);
  color:var(--brand-d);display:grid;place-items:center;font-size:11.5px;font-weight:600;
  margin-top:1px}
.toc a .cn{display:block;font-size:11px;opacity:.7;margin-top:1px}
/* 目录：英文原版目录为主行，中文课次标题作副行小字 */
.toc-tx{min-width:0;display:flex;flex-direction:column}
.toc-en{font-family:var(--serif);font-size:14.5px;font-weight:600;letter-spacing:.5px}
.toc-cn{font-size:11px;opacity:.72;margin-top:3px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.toc a.on .toc-en{color:#fff}
.toc a.on .toc-cn{color:#fff;opacity:.84}

.rd-hd{background:var(--card);border:1px solid var(--line);border-radius:var(--r-l);
  padding:24px 30px;box-shadow:var(--sh-s);margin-bottom:18px}
.rd-hd .hd-top{display:flex;align-items:flex-start;gap:22px}
.rd-hd .hd-ti{flex:1;min-width:0}
/* 眉题行：英文书名 ｜ 中文书名 ｜ CHAPTER 罗马数字（细线分隔） */
.rd-hd .hd-k{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  font-size:11.5px;letter-spacing:2px;text-transform:uppercase}
.rd-hd .hd-k > span + span{border-left:1px solid var(--line);padding-left:12px}
.rd-hd .hd-k .bk-en{color:var(--brand);font-weight:600}
.rd-hd .hd-k .bk-cn{color:var(--ink);font-size:13px;letter-spacing:.8px;text-transform:none}
.rd-hd .hd-k .ch-rom{color:var(--faint)}
.rd-hd h1{margin:11px 0 0;font-family:var(--serif);font-size:27px;font-weight:400;line-height:1.3}
.rd-hd .meta{display:flex;gap:18px;margin-top:14px;flex-wrap:wrap;font-size:12.5px;
  color:var(--muted)}

.qbox{background:var(--qbox-bg);border:1px solid var(--lav);
  border-radius:var(--r-l);padding:20px 24px;margin-bottom:18px;position:relative}
.qbox .qh{display:flex;align-items:center;gap:9px;font-size:12.5px;letter-spacing:1.2px;
  color:var(--brand-d);font-weight:600;text-transform:uppercase}
.qbox ol{margin:13px 0 0;padding-left:20px;font-size:14.5px;color:var(--ink-2);line-height:1.9}
.qbox[contenteditable="true"]{outline:2px dashed var(--brand);outline-offset:4px}

.bar{position:sticky;top:calc(var(--hdr) + 1px);z-index:40;background:var(--bar-bg);
  backdrop-filter:blur(12px);border:1px solid var(--line);border-radius:999px;
  padding:8px 12px;margin-bottom:18px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tg{display:inline-flex;align-items:center;gap:7px;padding:7px 15px;border-radius:999px;
  font-size:13.5px;color:var(--ink-2);border:1px solid transparent;transition:.18s;white-space:nowrap;position:relative}
.tg:hover{background:#fff;border-color:var(--line-2)}
.tg.on{background:var(--brand);color:#fff}
.tg.lock{color:var(--faint);cursor:not-allowed}
.tg.lock:hover{background:var(--rose-l);border-color:#EFD3D9;color:var(--rose)}
/* 悬停进度气泡（中文对照门锁提示） */
.tg[data-tip]:hover::after{content:attr(data-tip);position:absolute;top:calc(100% + 9px);right:0;
  white-space:nowrap;background:#3A2E33;color:#fff;font-size:12px;letter-spacing:.3px;
  padding:7px 12px;border-radius:8px;box-shadow:0 6px 16px rgba(60,30,40,.28);z-index:40;pointer-events:none}
.tg[data-tip]:hover::before{content:"";position:absolute;top:calc(100% + 3px);right:26px;
  border:6px solid transparent;border-bottom-color:#3A2E33;z-index:40;pointer-events:none}
.tg-play{font-weight:600;color:var(--brand-d)}
.tg-play.on{background:var(--brand);color:#fff}
/* “下载全文精讲批注”：淡金琥珀底 + 深琥珀字，与常规白/橙按钮区分 */
.tg-pdf{background:#FFF3DC;color:#9A6B00;border-color:#F0DFAE;font-weight:700}
.tg-pdf:hover{background:#FFEDC4;border-color:#E9CF8C;color:#7E5700}
.bar .sp{margin-left:auto}
.lockmeter{font-size:11.5px;color:var(--muted);letter-spacing:.3px}

/* 章节 PDF 下载弹窗：两张购买选项卡 */
.pdf-ops{display:flex;gap:12px;margin:14px 0 4px;flex-wrap:wrap}
.pdf-op{flex:1;min-width:170px;position:relative;border:1px solid var(--line);border-radius:var(--r-m);
  padding:16px 14px 14px;background:var(--brand-l);text-align:center}
.pdf-op.hot{border-color:var(--brand);box-shadow:0 4px 14px rgba(190,90,60,.14)}
.pdf-op .po-k{position:absolute;top:-9px;left:50%;transform:translateX(-50%);
  background:var(--brand);color:#fff;font-size:10.5px;letter-spacing:2px;padding:2px 10px;border-radius:999px}
.pdf-op b{display:block;font-size:15px;color:var(--ink)}
.pdf-op em{display:block;font-style:normal;margin:6px 0 8px;font:700 22px var(--serif);color:var(--brand)}
.pdf-op p{margin:0 0 12px;font-size:12px;line-height:1.6;color:var(--muted)}
.pdf-op .btn{width:100%}
.pdf-note{margin:10px 0 0;font-size:12px;color:var(--muted);text-align:center}

.para{background:var(--card);border:1px solid var(--line);border-radius:var(--r-m);
  padding:17px 20px 17px 56px;margin-bottom:11px;position:relative;transition:.2s;
  scroll-margin-top:calc(var(--hdr) + 74px)}
.para:hover{border-color:var(--line-2);box-shadow:var(--sh-s)}
.para.on{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-l)}
.para .num{position:absolute;left:16px;top:17px;width:26px;height:26px;border-radius:8px;
  background:var(--brand-l);color:var(--brand-d);display:grid;place-items:center;
  font-size:11.5px;font-weight:600}
.para .play{position:absolute;left:15px;top:47px;width:28px;height:28px;border-radius:50%;
  background:#fff;border:1px solid var(--line-2);color:var(--brand);display:grid;
  place-items:center;transition:.18s}
.para .play:hover{background:var(--brand);color:#fff;border-color:var(--brand)}
.en-tx{font-family:var(--serif);font-size:var(--rd-fs,17.5px);line-height:1.92;color:#231D38;
  letter-spacing:.1px;user-select:text}
.en-tx.lyric{font-family:var(--serif);font-style:italic;color:var(--brand-d);
  text-align:center;line-height:2.05}
.spk{display:inline-flex;align-items:center;gap:5px;font-family:var(--sans);font-size:11px;
  color:var(--muted);background:var(--bg);border:1px solid var(--line);border-radius:999px;
  padding:2px 9px;margin-left:9px;vertical-align:2px;white-space:nowrap}
.spk i{width:7px;height:7px;border-radius:50%;display:block}
/* 原版插图：无底板/无边框，白底扫描以 multiply 融进页面背景，摆在对应文字位置 */
.para .illus{display:flex;flex-direction:column;align-items:center;gap:12px;
  margin:16px 0 2px;padding:0}
.para .illus img{display:block;width:auto;height:auto;max-width:min(100%,360px);
  max-height:420px;border:0;background:none;border-radius:0;
  mix-blend-mode:multiply;transition:.25s}
html[data-theme="eye"] .para .illus img{mix-blend-mode:multiply;filter:sepia(.08)}
@media (max-width:720px){
  .para .illus img{max-width:100%}
}

/* 生词（虚线）与语用（波浪）标记
   2026-10-13 批注按段展开：进入阅读页默认不显示任何划线；
   仅当 ① 本段已展开批注（.para.anno-open）或 ② “展开所有批注”（body.anno-all）时显示。 */
.para.anno-open x-w, body.anno-all x-w{border-bottom:1px dashed #B9AED6;background:linear-gradient(180deg,transparent 64%,#F1EDFA 64%);
  cursor:pointer;padding-bottom:1px;transition:.16s;border-radius:2px}
.para.anno-open x-w:hover, body.anno-all x-w:hover{background:var(--brand-l);border-bottom-color:var(--brand)}
.para.anno-open x-w[data-t="C4"], body.anno-all x-w[data-t="C4"]{border-bottom-color:#9BAED6;background:linear-gradient(180deg,transparent 64%,#EEF1FA 64%)}
.para.anno-open x-w[data-t="C6"], body.anno-all x-w[data-t="C6"]{border-bottom-color:#C2A9D8;background:linear-gradient(180deg,transparent 64%,#F4EFFA 64%)}
.para.anno-open x-w[data-t="X"], body.anno-all x-w[data-t="X"]{border-bottom-color:#C9A227;background:linear-gradient(180deg,transparent 64%,#FBF5E4 64%)}
.para.anno-open x-p, body.anno-all x-p{text-decoration:underline wavy #C98C99;text-decoration-thickness:1px;text-underline-offset:3.5px;
  cursor:pointer;transition:.16s}
.para.anno-open x-p:hover, body.anno-all x-p:hover{background:var(--rose-l)}
x-w.act,x-p.act{background:var(--brand-l)}

/* 段下展开区（批注 / 翻译） */
.sub{margin-top:13px;padding-top:13px;border-top:1px dashed var(--line-2);display:none}
.sub.show{display:block}
.nx-i{display:flex;gap:11px;padding:9px 11px;border-radius:10px;background:var(--bg-warm);
  margin-bottom:7px;font-size:13.5px;align-items:baseline;flex-wrap:wrap}
.nx-i .w{font-family:var(--serif);font-size:15.5px;color:var(--brand-d);font-weight:600}
.nx-i .ph{color:var(--muted);font-size:12.5px;font-family:var(--serif)}
/* 形变词自身查不到音标时的回退括注：原形 + 原形音标（避免把原形读音当形变读音） */
.nx-i .fb{color:var(--faint);font-size:11.5px;font-family:var(--serif);letter-spacing:.1px}
.nx-i .cn{color:var(--ink-2)}
/* 点读发音：录音（assets/words）优先，缺档回退浏览器朗读 */
.nx-i .spk{flex:none;align-self:center;width:25px;height:25px;border-radius:50%;
  display:grid;place-items:center;color:var(--brand);background:#fff;
  border:1px solid var(--line-2);transition:.16s;cursor:pointer;padding:0;margin-left:-2px}
.nx-i .spk:hover{background:var(--brand);color:#fff;border-color:var(--brand)}
.nx-i .spk.on{background:var(--brand);color:#fff;border-color:var(--brand);
  animation:spkPulse .9s ease-out}
@keyframes spkPulse{
  0%{box-shadow:0 0 0 0 var(--glow)}
  100%{box-shadow:0 0 0 9px rgba(0,0,0,0)}
}
.nx-i.py .spk{color:var(--rose)}
.nx-i.py .spk:hover,.nx-i.py .spk.on{background:var(--rose);border-color:var(--rose);color:#fff}
.nx-i .lv{font-size:10.5px;padding:1.5px 7px;border-radius:5px;background:var(--brand-l);
  color:var(--brand-d);letter-spacing:.4px}
.nx-i .lv.C4{background:#E8EDF8;color:#4E6A9E}
.nx-i .lv.C6{background:#F0E9F8;color:#7A5AA8}
.nx-i .lv.X{background:#FBF3DF;color:#8E7420}
.nx-i .lv.man{background:#fff;border:1.5px dashed #B9AED6;color:#8A76B8}

/* ── 管理员批注编辑（?admin=1 进入；普通访客不可见）────────── */
.anno-add{position:absolute;right:14px;top:14px;width:26px;height:26px;border-radius:8px;
  border:1.5px dashed var(--brand);background:var(--brand-l);color:var(--brand);
  font-size:15px;line-height:1;cursor:pointer;display:none;align-items:center;
  justify-content:center;transition:.15s}
body.admin-on .anno-add{display:flex}
.anno-add:hover{background:var(--brand);color:#fff;border-style:solid}
.anno-type{display:flex;gap:10px;margin-top:14px}
.anno-type label{display:flex;align-items:center;gap:6px;margin:0;font-size:13.5px;
  color:var(--ink);border:1.5px solid var(--line);border-radius:999px;padding:7px 15px;
  cursor:pointer;user-select:none}
.anno-type input{width:auto;padding:0;margin:0;accent-color:var(--brand)}
.anno-list{margin-top:18px;border-top:1px dashed var(--line);padding-top:12px}
.anno-list:empty{display:none}
.al-t{font-size:12.5px;color:var(--muted);display:block;margin-bottom:4px}
.al-i{display:flex;align-items:center;gap:10px;padding:7px 0;
  border-bottom:1px dashed var(--line);font-size:13px}
.al-k{flex:none;color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}
.al-tx{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.al-x{flex:none;border:none;background:none;color:#C0616E;cursor:pointer;
  font-size:12.5px;padding:2px 6px}
.al-x:hover{text-decoration:underline}
.anno-foot{margin-top:14px}
.anno-tip{font-size:11.5px;color:var(--muted);margin-top:8px;line-height:1.7}
.nx-i.hit{background:var(--brand-l);box-shadow:inset 0 0 0 1.5px var(--brand)}
/* 批注精准定位：条目滚到粘性头部（顶栏+工具条）下沿，而不是被其遮住 */
.sub-n .nx-i{scroll-margin-top:150px}
@media (max-width:1080px){.sub-n .nx-i{scroll-margin-top:196px}}
.nx-i.py{background:var(--rose-l)}
.nx-i.py .w{color:var(--rose);font-family:var(--sans);font-size:13.5px}
/* v2.125 语用排版：中文讲解不与英文锚点同排，另起一行顶格开始
   （讲解将加深为多句语法讲解，行高放宽到 1.8 保证可读性） */
.nx-i.py .cn{flex-basis:100%;margin-top:3px;padding-left:2px;line-height:1.8}
.nx-i .hook{font-size:12.5px;color:var(--muted);flex-basis:100%;margin-top:2px;
  padding-left:2px;border-left:2px solid var(--lav);padding-left:9px}
.tr-tx{font-size:15px;line-height:1.95;color:var(--ink-2)}
.tr-note{font-size:11.5px;color:var(--faint);margin-top:9px;display:flex;align-items:center;gap:6px}

/* 双击查词卡 */
.wc{position:fixed;z-index:90;background:#fff;border:1px solid var(--line-2);
  border-radius:14px;box-shadow:var(--sh-l);padding:14px 17px;min-width:172px;max-width:300px;
  opacity:0;transform:translateY(6px) scale(.97);pointer-events:none;transition:.16s}
.wc.show{opacity:1;transform:none;pointer-events:auto}
.wc b{font-family:var(--serif);font-size:19px;color:var(--brand-d)}
.wc .ph{font-family:var(--serif);font-size:12.5px;color:var(--muted);margin-left:7px}
.wc p{margin:7px 0 0;font-size:13.5px;color:var(--ink-2);line-height:1.6}
/* 形变标注：lain /leɪn/ 〔过去分词〕 · 原形 lie /laɪ/ */
.wc .pos{font-size:11px;font-weight:600;color:#8E7420;background:#FBF3DF;
  padding:1.5px 6px;border-radius:5px;margin-left:7px;vertical-align:1.5px}
.wc .base{margin-top:5px;font-size:12px;color:var(--muted);
  display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.wc .base b{font-family:var(--serif);font-size:13.5px;color:var(--ink-2)}
.wc .base .ph{margin-left:0;font-size:12px}

/* 悬浮工具箱 */
.fab{position:fixed;right:20px;bottom:118px;z-index:70;display:flex;flex-direction:column-reverse;
  align-items:flex-end;gap:9px}
.fab-main{position:relative;width:52px;height:52px;border-radius:50%;background:var(--brand);color:#fff;
  box-shadow:0 8px 24px var(--glow);display:grid;place-items:center;transition:.22s}
.fab-main:hover{background:var(--brand-d);transform:scale(1.05)}
.fab-main span{position:absolute;width:22px;height:2px;background:#fff;border-radius:2px;
  transition:.24s}
.fab-main span:nth-child(1){transform:translateY(-4px)}
.fab-main span:nth-child(2){transform:translateY(4px)}
.fab.open .fab-main span:nth-child(1){transform:rotate(45deg)}
.fab.open .fab-main span:nth-child(2){transform:rotate(-45deg)}
.fab-list{display:flex;flex-direction:column;gap:9px;align-items:flex-end}
/* 字号滑杆（2026-10-21 用户令：阅读页正文字号自主调节，桌面/手机通用） */
.fab-fs{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);
  border-radius:999px;padding:9px 14px;box-shadow:var(--sh-s);
  font-size:12px;color:var(--ink-2);white-space:nowrap;
  opacity:0;transform:translateY(10px);pointer-events:none;transition:.22s}
.fab.open .fab-fs{opacity:1;transform:none;pointer-events:auto}
.fab.open .fab-fs{transition-delay:.18s}
.fab-fs .lb{font-weight:600;color:var(--ink)}
.fab-fs input[type=range]{-webkit-appearance:none;appearance:none;width:116px;height:3px;
  border-radius:2px;background:var(--line);outline:none;margin:0}
.fab-fs input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;
  width:15px;height:15px;border-radius:50%;background:var(--brand);cursor:pointer;border:2px solid #fff;
  box-shadow:0 0 0 1px var(--brand)}
.fab-fs input[type=range]::-moz-range-thumb{width:13px;height:13px;border-radius:50%;
  background:var(--brand);cursor:pointer;border:2px solid #fff}
.fab-fs b{min-width:28px;text-align:right;font-size:12px;color:var(--brand);font-weight:600}
.fab-i{display:flex;align-items:center;gap:10px;opacity:0;transform:translateY(10px);
  pointer-events:none;transition:.22s}
.fab.open .fab-i{opacity:1;transform:none;pointer-events:auto}
.fab.open .fab-i:nth-child(1){transition-delay:.02s}
.fab.open .fab-i:nth-child(2){transition-delay:.06s}
.fab.open .fab-i:nth-child(3){transition-delay:.1s}
.fab.open .fab-i:nth-child(4){transition-delay:.14s}
.fab-i b{background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 13px;
  font-size:12.5px;color:var(--ink-2);box-shadow:var(--sh-s);white-space:nowrap}
.fab-i em{width:42px;height:42px;border-radius:50%;background:#fff;border:1px solid var(--line);
  color:var(--brand-d);display:grid;place-items:center;box-shadow:var(--sh-m);font-style:normal;
  font-size:16px;transition:.18s}
.fab-i:hover em{background:var(--brand);color:#fff;border-color:var(--brand)}

/* 底部播放条 */
.pl{position:fixed;left:0;right:0;bottom:0;z-index:75;background:rgba(255,255,255,.95);
  backdrop-filter:blur(16px);border-top:1px solid var(--line);box-shadow:0 -6px 26px rgba(0,0,0,.08)}
.pl-in{max-width:var(--maxw);margin:0 auto;padding:10px 22px;display:flex;align-items:center;gap:15px}
.pl-b{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;flex:none;
  transition:.18s}
.pl-b:hover{background:var(--brand-l)}
.pl-b.main{background:var(--brand);color:#fff;width:46px;height:46px}
.pl-b.main:hover{background:var(--brand-d)}
.pl-info{min-width:0;flex:1}
.pl-info .t{font-size:13px;color:var(--ink);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;display:block;max-width:100%}
.pl-info .s{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:8px}
/* 进度条：可拖动（命中区加高到 16px，视觉轨道仍细；悬停/拖动时变粗并露出圆点把手） */
.pl-prog{position:relative;height:16px;margin-top:3px;cursor:pointer;touch-action:none;outline:none}
.pl-prog::before{content:"";position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);
  height:4px;border-radius:99px;background:var(--lav);transition:height .16s}
.pl-prog i{position:absolute;left:0;top:50%;transform:translateY(-50%);display:block;
  height:4px;background:var(--brand);width:0;border-radius:99px;transition:height .16s}
.pl-knob{position:absolute;top:50%;left:0;width:12px;height:12px;border-radius:50%;
  background:#fff;border:2px solid var(--brand);transform:translate(-50%,-50%);
  box-shadow:0 1px 4px rgba(0,0,0,.28);opacity:0;pointer-events:none;
  transition:opacity .16s,width .16s,height .16s}
.pl-prog:hover::before,.pl-prog.drag::before{height:6px}
.pl-prog:hover i,.pl-prog.drag i{height:6px}
.pl-prog:hover .pl-knob,.pl-prog.drag .pl-knob,.pl-prog:focus-visible .pl-knob{opacity:1}
.pl-prog.drag .pl-knob{width:15px;height:15px;box-shadow:0 2px 8px rgba(0,0,0,.32)}
.pl-rate{font-size:12px;color:var(--muted);border:1px solid var(--line-2);border-radius:999px;
  padding:5px 11px;flex:none}
.pl-rate:hover{border-color:var(--brand);color:var(--brand-d)}
/* 收起按钮（条内最右） */
.pl-min{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;flex:none;
  color:var(--muted);transition:.16s;margin-left:2px}
.pl-min:hover{background:var(--brand-l);color:var(--brand-d)}
/* 收起态：整条缩成右下角一个圆钮；展开箭头平时隐形、悬停/触碰时浮现 */
.pl-up{display:none;position:absolute;top:-9px;right:-7px;width:24px;height:24px;border-radius:50%;
  background:#fff;border:1px solid var(--line-2);color:var(--muted);place-items:center;
  box-shadow:0 2px 8px rgba(0,0,0,.16);opacity:0;transition:opacity .16s}
.pl.min{left:auto;right:22px;bottom:22px;width:auto;background:transparent;border-top:none;
  box-shadow:none;backdrop-filter:none}
.pl.min .pl-in{max-width:none;padding:0;gap:0;position:relative}
.pl.min .pl-b:not(.main),.pl.min .pl-info,.pl.min .pl-rate,.pl.min .pl-min{display:none}
.pl.min .pl-up{display:grid}
.pl.min:hover .pl-up,.pl.min:focus-within .pl-up{opacity:1}
.pl.min .pl-b.main{width:56px;height:56px;box-shadow:0 8px 22px rgba(0,0,0,.24)}
body.plmin .rd{padding-bottom:44px}

/* 弹层 */
.sheet{position:fixed;inset:0;z-index:95;background:rgba(42,35,64,.44);backdrop-filter:blur(3px);
  display:none;align-items:center;justify-content:center;padding:22px}
.sheet.show{display:flex}
.sheet-c{background:#fff;border-radius:var(--r-l);box-shadow:var(--sh-l);max-width:440px;
  width:100%;padding:26px 26px 22px;max-height:88vh;overflow:auto}
.sheet-c h3{margin:0 0 6px;font-family:var(--serif);font-size:21px;font-weight:400}
.sheet-c p.d{margin:0 0 18px;font-size:13.5px;color:var(--muted)}
.sheet-c label{display:block;font-size:12.5px;color:var(--muted);margin:14px 0 6px}
.sheet-c input,.sheet-c textarea,.sheet-c select{width:100%;padding:10px 13px;
  border:1px solid var(--line-2);border-radius:10px;font-size:14px;background:var(--bg-warm);
  outline:none;transition:.16s}
.sheet-c input:focus,.sheet-c textarea:focus{border-color:var(--brand);background:#fff}
.sheet-c textarea{min-height:96px;resize:vertical;line-height:1.65}
.sheet-act{display:flex;gap:10px;margin-top:20px;justify-content:flex-end}

/* 学习如何使用指南弹窗 */
.sheet-guide .sheet-c{max-width:620px;padding:30px 32px 24px}
.gd-step{display:flex;gap:16px;align-items:center;margin:13px 0;padding:12px 16px;
  background:var(--bg-warm);border:1px solid var(--line);border-radius:14px}
.gd-step svg{flex:none}
.gd-step p{margin:0;font-size:14px;line-height:1.8;color:#3A3352}
.gd-step a{color:var(--brand);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.gd-sec{margin-top:20px}
.gd-sec h4{margin:0 0 12px;font-size:14px;font-weight:700;color:#3A3352;line-height:1.7}
.gd-lead{margin:0 0 16px;font-size:14px;font-weight:700;color:#3A3352;line-height:1.7}
.gd-link{margin-left:12px;font-size:12.5px;font-weight:700;color:var(--brand);
  text-decoration:none;letter-spacing:.5px}
.gd-link:hover{text-decoration:underline;text-underline-offset:3px}
.gd-b{display:flex;gap:13px;align-items:flex-start;margin:0 0 10px;padding:12px 15px;
  background:#fff;border:1px solid var(--line);border-radius:14px;
  box-shadow:0 2px 10px rgba(60,50,95,.06)}
.gd-l{flex:none;width:36px;height:36px;border-radius:10px;background:var(--brand);color:#fff;
  font-family:Georgia,serif;font-size:19px;font-weight:700;
  display:flex;align-items:center;justify-content:center}
.gd-b p{margin:0;font-size:13.5px;line-height:1.75;color:var(--muted);align-self:center}
.gd-b b{color:#3A3352;font-size:14px}
.gd-more{margin:0;padding:0 0 0 2px;list-style:none}
.gd-more li{position:relative;padding:0 0 9px 26px;font-size:13.5px;line-height:1.75;color:var(--muted)}
.gd-more li:nth-child(1)::before{content:"①"}
.gd-more li:nth-child(2)::before{content:"②"}
.gd-more li:nth-child(3)::before{content:"③"}
.gd-more li:nth-child(4)::before{content:"④"}
.toast{position:fixed;left:50%;bottom:96px;transform:translate(-50%,14px);z-index:99;
  background:#2A2340;color:#fff;font-size:13.5px;padding:11px 20px;border-radius:999px;
  box-shadow:var(--sh-l);opacity:0;transition:.24s;pointer-events:none}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* 分享图预览 */
.share{width:288px;aspect-ratio:9/16;background:#fff;border:1px solid var(--line);
  border-radius:14px;overflow:hidden;display:flex;flex-direction:column;
  box-shadow:var(--sh-m);margin:0 auto}
.share .sh-top{padding:22px 20px 0;display:flex;gap:13px;align-items:center}
.share .sh-cv{position:relative;width:52px;aspect-ratio:2/3;border-radius:5px;overflow:hidden;flex:none;
  background:var(--lav)}
.share .sh-ti b{display:block;font-family:var(--serif);font-size:15px;line-height:1.3}
.share .sh-ti span{font-size:10.5px;color:var(--muted)}
.share .sh-q{flex:1;padding:20px;display:flex;align-items:center}
.share .sh-q p{margin:0;font-family:var(--serif);font-size:14px;line-height:1.85;color:#231D38;
  display:-webkit-box;-webkit-line-clamp:8;-webkit-box-orient:vertical;overflow:hidden}
.share .sh-f{padding:0 20px 20px;display:flex;justify-content:space-between;align-items:flex-end}
.share .sh-f span{font-size:9.5px;color:var(--faint);letter-spacing:1.2px}
.share .sh-f i{width:26px;height:26px;border-radius:8px;background:var(--brand-l);display:block}

/* ── 读书笔记墙 ─────────────────────────────────────────────── */
/* 分级指引：进阶图（v2.13，一张图六阶） */
.lad{display:flex;align-items:flex-end;gap:26px;margin-top:20px}
.lad-s{position:relative;flex:1;min-width:0;
  background:color-mix(in srgb,var(--lc,var(--brand)) var(--c),var(--card));
  border:1px solid var(--line);border-radius:var(--r-m);
  padding:16px 15px 12px;min-height:calc(168px + var(--i) * 24px)}
.lad-s::before{content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:6px;
  border-radius:var(--r-m) var(--r-m) 0 0;
  background:color-mix(in srgb,var(--lc,var(--brand)) var(--c2),#fff)}
.lad-t{display:flex;align-items:baseline;gap:6px;white-space:nowrap}
.lad-l{font-family:var(--serif);font-size:23px;color:var(--lc,var(--brand));line-height:1}
.lad-t b{font-size:14.5px;color:var(--ink)}
.lad-t i{font-style:normal;font-size:13px;color:var(--ink-2)}
.lad-x{display:inline-block;margin-top:9px;font-size:11.5px;
  color:color-mix(in srgb,var(--lc,var(--brand)) 68%,#2A1610);
  background:color-mix(in srgb,var(--lc,var(--brand)) 15%,#fff);
  border-radius:99px;padding:2px 9px;white-space:nowrap}
.lad-m{display:block;font-size:11.5px;color:var(--muted);margin-top:6px;white-space:nowrap}
.lad-b{margin:9px 0 0;font-size:11.5px;line-height:1.65;color:var(--ink-2)}
.lad-cap{margin:16px 0 0;font-size:12px;color:var(--muted);text-align:right}
/* 相邻级别卡之间的 → 箭头（悬停按钮“进入该级别”不带箭头） */
.lad-s:not(:last-child)::after{content:"→";position:absolute;right:-21px;bottom:26px;
  font-size:15px;font-weight:600;color:var(--brand);z-index:2;pointer-events:none}
/* 级别卡为整卡链接；悬停浮现“进入该级别”按钮 */
a.lad-s{text-decoration:none;color:inherit;display:block}
.lad-go{position:absolute;top:-44px;left:50%;transform:translate(-50%,8px);opacity:0;
  pointer-events:none;white-space:nowrap;z-index:3;
  background:var(--lc,var(--brand));color:#fff;font-size:12.5px;font-weight:600;letter-spacing:.5px;
  padding:6px 14px;border-radius:999px;
  box-shadow:0 6px 16px color-mix(in srgb,var(--lc,var(--brand)) 32%,transparent);
  transition:opacity .22s,transform .22s}
.lad-s:hover .lad-go,.lad-s:focus-visible .lad-go{opacity:1;transform:translate(-50%,0)}
/* 级别分页：书目多行平铺 */
.lv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:18px;margin-top:8px}
/* 分级页（pg-books）：横板书卡与全部书目页同宽档，多行平铺不滚动 */
.pg-books .lv-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
/* ── 全部书目页 books.html（2026-09-27）──────────────────────── */
.pg-books{max-width:none}
.bks-wrap{display:grid;grid-template-columns:212px minmax(0,1fr);gap:36px;align-items:start;margin-top:14px}
.bks-nav{position:sticky;top:calc(var(--hdr) + 18px);display:flex;flex-direction:column;gap:5px}
.bks-nav a{display:flex;align-items:baseline;gap:8px;padding:9px 12px;border-radius:10px;
  border:1px solid transparent;text-decoration:none;color:var(--ink-2);font-size:12.5px}
.bks-nav a b{font-family:var(--serif);font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap}
.bks-nav a span{color:var(--muted);font-size:12px}
.bks-nav a i{margin-left:auto;font-style:normal;font-size:11px;color:var(--faint);white-space:nowrap}
.bks-nav a:hover{background:var(--bg-warm);border-color:var(--line)}
.bks-nav a.on{background:var(--brand-l);border-color:var(--line)}
.bks-nav a.on b,.bks-nav a.on span{color:var(--brand-d)}
.lv-sec{margin:0 0 40px;scroll-margin-top:calc(var(--hdr) + 18px)}
.lv-sec:last-child{margin-bottom:8px}
.lv-sec h3{font-size:19px;margin:0 0 6px;color:var(--ink);font-weight:600}
.lv-sec h3 span{font-weight:400;font-size:12.5px;color:var(--muted);margin-left:10px}
.lv-sec .lv-sub{font-size:13px;color:var(--muted);margin:0 0 14px;line-height:1.8}
.lv-strip{position:relative}
/* v2.121 用户令：每个级别固定两排卡片横向滚动，左右按钮常驻（同首页 rail 逻辑） */
.lv-track{display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,auto);
  grid-auto-columns:300px;gap:14px 20px;overflow-x:auto;scroll-behavior:smooth;
  padding:2px 2px 10px;scrollbar-width:none}
.lv-track::-webkit-scrollbar{display:none}
.lv-strip>.rail-btn{display:flex}
.lv-strip>.rail-btn:focus-visible{opacity:.62;visibility:visible}
/* 全部书目页：通栏靠左（不用 .pg 的 860px 居中窄列）+ 紧凑书卡（仅此页生效） */
.pg.pg-books{max-width:var(--maxw);padding-top:30px}
.pg-books .lv-track{gap:14px}
/* 横板书卡：封面左（96×144）+ 信息右，每行 3 张；仅书目页生效，首页竖卡不变 */
.pg-books .bk{flex:0 0 300px;flex-direction:row;align-items:stretch;border-radius:14px}
.pg-books .bk-cover{width:96px;flex:none}
.pg-books .cv-ov .bk-badge{position:absolute;bottom:0;left:0;right:0;margin:0;
  font-size:9.5px;padding:3px 4px;top:auto;width:auto;text-align:center;
  border-radius:0;letter-spacing:.3px;white-space:nowrap}
.pg-books .bk-soon{font-size:0;letter-spacing:0}
.pg-books .bk-b{padding:12px 14px;gap:6px}
.pg-books .bk-b h3{font-size:15.5px;margin:0}
.pg-books .bk-b .en{font-size:11px;margin-top:-3px;
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.pg-books .bk-b p{display:none;margin:0}
/* 封面只留品牌字样，书名/作者/蓝思叠层去掉（信息已在右侧卡体） */
.pg-books .cv-en,.pg-books .cv-b,.pg-books .cv-meta{display:none}
/* 级别页/书目页：级别区上方的杂志式分割带（与主页 .sec-h 同风格的小号版） */
.lv-h{display:flex;align-items:baseline;gap:12px;margin:30px 0 20px;flex-wrap:wrap;
  border-top:1px solid var(--line-2);border-bottom:1px solid var(--line);padding:11px 2px}
.lv-h b{font-family:var(--serif);font-size:17px;font-weight:400;letter-spacing:.3px;color:var(--ink)}
.lv-h b::before{content:"";display:inline-block;width:7px;height:7px;background:var(--brand);
  margin-right:11px;vertical-align:middle}
.lv-h span{font-size:11px;letter-spacing:2.4px;text-transform:uppercase;color:var(--muted)}
.lv-h i{margin-left:auto;font-style:normal;font-size:12.5px;color:var(--muted)}
.pg-books .bk-meta{padding-top:8px;font-size:10.5px;gap:5px}
.pg-books .chip{font-size:10px;padding:2px 6px}
@media (max-width:700px){
  .pg-books .bk{flex:1 1 100%}
  .pg-books .bk-cover{width:84px}
  .lv-track{grid-auto-columns:minmax(260px,1fr)}
}
.lv-empty a{color:var(--brand-d)}
.lv-empty{border:1.5px dashed var(--line);border-radius:var(--r-l);padding:26px 22px;
  color:var(--muted);font-size:13.5px;line-height:1.8;background:var(--bg-warm)}
.lv-empty b{color:var(--ink)}
.ng-cn{color:var(--muted);font-size:.82em;margin-left:5px}
.ng-menu a.on .ng-cn{color:rgba(255,255,255,.85)}
@media (max-width:1180px){.lad{flex-wrap:wrap;gap:14px}
  .lad-s{flex:1 1 30%;min-height:0}
  .lad-s:not(:last-child)::after{display:none}}
@media (max-width:620px){.lad-s{flex:1 1 100%}}

.wall-cta-row{display:flex;align-items:center;gap:16px;margin-bottom:24px;flex-wrap:wrap}
.wall-cta{display:inline-block;padding:0;border-radius:44px;transform:rotate(-1.2deg);
  filter:drop-shadow(0 5px 0 rgba(0,0,0,.22)) drop-shadow(0 14px 24px rgba(0,0,0,.16));
  transition:transform .22s cubic-bezier(.2,.7,.3,1.4)}
.wall-cta:hover{transform:rotate(-2.6deg) scale(1.045)}
.wall-cta:active{transform:rotate(-.6deg) scale(.97)}
.wall-cta svg{width:328px;height:auto;display:block}
.wall-cta .cta-stroke text{font-family:var(--sans);font-weight:700;font-size:29px;
  fill:var(--cta-k);stroke:var(--cta-k);stroke-width:7px;stroke-linejoin:round}
.wall-cta .cta-fill .t1{font-family:var(--sans);font-weight:700;font-size:29px;fill:var(--cta-t1)}
.wall-cta .cta-fill .t2{font-family:var(--sans);font-weight:700;font-size:29px;fill:#fff}
/* 笔记墙：介绍段在滚动条上方居右；右栏仅榜单，与滚动框等高 */
.wall-row{display:grid;grid-template-columns:minmax(0,1fr) 276px;gap:20px;align-items:stretch}
.wall-side{display:flex;flex-direction:column;min-width:0}
.wall-side-sub{margin:14px 296px 0;font-size:12.5px;line-height:1.75;color:var(--muted);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wall-side-sub b{color:var(--ink-2)}
/* 2026-10-11 用户令：笔记墙边框改童趣糖果多彩（原灰 #F7F7F7→#EFEFEF）——
   横向粉→杏→薄荷→天蓝→丁香的多停顿淡彩 + 白色波点纹理，白卡片在其上更跳 */
.wall{position:relative;overflow:hidden;padding:18px 0;border-radius:var(--r-l);
  background:
    radial-gradient(circle at 11px 11px, rgba(255,255,255,.75) 2.6px, transparent 3.2px) 0 0/46px 46px,
    linear-gradient(90deg,#FFEDF2 0%,#FFF1CC 24%,#DCFBEC 50%,#DCEEFF 74%,#F1E6FF 100%);
  border:1px solid #FFD9E4;
  display:flex;align-items:center;min-height:288px}
.wall::before,.wall::after{content:"";position:absolute;top:0;bottom:0;width:58px;z-index:3;
  pointer-events:none}
.wall::before{left:0;background:linear-gradient(90deg,#FFEDF2,rgba(255,237,242,0))}
.wall::after{right:0;background:linear-gradient(270deg,#F1E6FF,rgba(241,230,255,0))}
.wall-track{display:flex;align-items:center;gap:18px;width:max-content;
  animation:wallroll 70s linear infinite}
.wall:hover .wall-track{animation-play-state:paused}
@keyframes wallroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.wcard{position:relative;flex:none;border-radius:12px;background:#fff;padding:7px;
  border:1px solid var(--line);box-shadow:var(--sh-m);
  transition:transform .22s,box-shadow .22s}
.wcard:hover{transform:translateY(-6px) scale(1.03);box-shadow:var(--sh-l);z-index:2}
.wcard img{height:100%;width:auto;display:block;border-radius:8px;pointer-events:none}
.wcard-meta{position:absolute;left:10px;right:10px;bottom:9px;display:flex;align-items:center;
  justify-content:space-between;gap:6px;pointer-events:none}
.wcard-meta .u{font-size:11.5px;font-weight:600;color:#fff;background:rgba(42,35,64,.72);
  padding:2.5px 9px;border-radius:999px;backdrop-filter:blur(2px)}
.wcard-meta .lk{font-size:11px;font-weight:600;font-style:normal;color:#fff;background:var(--rose);
  padding:2.5px 8px;border-radius:999px}
.wcard-rank{position:absolute;top:9px;left:10px;font-size:11px;font-weight:700;color:#fff;
  padding:2.5px 9px;border-radius:999px;background:rgba(42,35,64,.6);pointer-events:none}
.wcard-rank.r1{background:linear-gradient(120deg,#E0B84F,#C9A227)}
.wcard-rank.r2{background:linear-gradient(120deg,#B9B4C4,#98929F)}
.wcard-rank.r3{background:linear-gradient(120deg,#D8A183,#C08657)}
/* 右栏：本月点赞榜（纵向，每条备注上传时间） */
.wall-rank{background:#fff;border:1px solid var(--line);border-radius:var(--r-l);
  padding:16px 15px 14px;box-shadow:var(--sh-s);display:flex;flex-direction:column}
.wall-rank h4{margin:0 0 12px;font-size:11.5px;letter-spacing:1.6px;text-transform:uppercase;
  color:var(--faint)}
#wall{padding-top:28px}
#wallRank{display:flex;flex-direction:column;gap:8px;flex:1}
.wall-rank .rp{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--ink-2);
  padding:8px 10px;border-radius:11px;background:var(--bg-warm);border:1px solid var(--line)}
.wall-rank .rp:first-child{background:#FBF3DF;border-color:#EFE1BC}
.wall-rank .rp .medal{flex:none;font-size:14.5px}
.wall-rank .rp-tx{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.35}
.wall-rank .rp-tx b{font-family:var(--serif);color:var(--brand-d);font-size:13px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wall-rank .rp-tx .tm{color:var(--faint);font-size:10.5px}
.wall-rank .rp .lk{flex:none;color:var(--rose);font-weight:600}
.wall-rank .wr-fine{margin:auto 0 0;font-size:10.5px;line-height:1.7;color:var(--faint);
  text-align:center}

/* 笔记展开大图 */
.sheet-c.nd{max-width:940px;padding:22px}
.nd-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(250px,.85fr);gap:24px}
.nd-imgwrap{background:var(--bg-warm);border:1px solid var(--line);border-radius:var(--r-m);
  display:flex;align-items:center;justify-content:center;padding:14px}
.nd-imgwrap img{max-width:100%;max-height:60vh;border-radius:8px;box-shadow:var(--sh-m)}
.nd-user{display:flex;align-items:center;gap:12px}
.nd-av{width:44px;height:44px;border-radius:50%;background:var(--brand-l);color:var(--brand-d);
  display:grid;place-items:center;font-weight:700;font-size:18px;font-family:var(--serif);flex:none}
.nd-un b{display:block;font-size:16px}
.nd-un span{font-size:12px;color:var(--muted)}
.nd-stats{display:flex;align-items:center;gap:10px;margin-top:14px}
.nd-rank{font-size:12.5px;font-weight:700;color:#8E7420;background:#FBF3DF;
  padding:4px 12px;border-radius:999px}
.nd-likes{font-size:13px;color:var(--muted)}
.nd-likes b{font-family:var(--serif);font-size:19px;color:var(--rose);margin-right:2px}
.nd-like{margin-top:14px;width:100%;padding:11px 0;border-radius:12px;background:#fff;
  border:1.5px solid var(--brand);color:var(--brand-d);font-weight:600;font-size:14.5px;transition:.18s}
.nd-like:hover{background:var(--brand-l)}
.nd-like.done{border-color:var(--line-2);color:var(--faint);background:var(--bg-warm);cursor:default}
.nd-quote{margin-top:16px;font-family:var(--serif);font-style:italic;font-size:14.5px;
  line-height:1.7;color:var(--ink)}
.nd-hand{margin-top:10px;font-size:13.5px;line-height:1.75;color:var(--ink-2)}
.nd-src{margin:12px 0 0;font-size:12px;color:var(--faint)}
.nd-fine{margin:14px 0 0;font-size:11.5px;color:var(--faint)}

/* 上传学习笔记 */
.upzone{border:1.5px dashed var(--line-2);border-radius:var(--r-m);background:var(--bg-warm);
  min-height:112px;display:flex;align-items:center;justify-content:center;cursor:pointer;
  overflow:hidden;transition:.18s}
.upzone:hover{border-color:var(--brand)}
.up-hint{text-align:center;font-size:13.5px;font-weight:600;color:var(--brand-d)}
.up-hint span{display:block;font-size:11px;font-weight:400;color:var(--faint);margin-top:5px}
.upzone img{max-height:190px;margin:0 auto}
.up-disc{margin:16px 0 0;font-size:11.5px;line-height:1.8;color:var(--ink-2);
  background:var(--brand-l);border-radius:10px;padding:10px 13px}
.up-list{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap}
.up-list .upit{width:86px}
.up-list img{width:86px;height:86px;object-fit:cover;border-radius:10px;border:1px solid var(--line)}
.up-list .st{display:block;font-size:10.5px;color:var(--gold);margin-top:4px;text-align:center}
@media (prefers-reduced-motion:reduce){
  .wall{overflow-x:auto}
  .wall-track{animation:none}
}

/* ── 响应式 ─────────────────────────────────────────────────── */
@media (max-width:1080px){
  .hero-in{grid-template-columns:1fr;gap:36px;padding:52px 22px 48px}
  .hero-art{order:-1;max-width:350px}
  .rd{grid-template-columns:1fr;gap:20px}
  .toc{position:static;max-height:none;display:none}
  .toc.show{display:block}
  .mod-2{grid-template-columns:1fr}
  .idea-wrap{flex-direction:column}
  .idea{width:100%}
  .tour-box{width:100%;max-width:430px;margin:0 auto}
  .idea-c p{font-size:13.5px}
  .wall-row{grid-template-columns:1fr}
  .wall-side-sub{margin-right:0}
  .bks-wrap{grid-template-columns:1fr;gap:18px}
  .bks-nav{position:static;flex-direction:row;flex-wrap:wrap;gap:6px}
  .bks-nav a i{margin-left:2px}
  #wallRank{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
  .ft-top{grid-template-columns:1fr;gap:24px}  /* 品牌 / 二维码 / 支持 依序堆叠 */
}
@media (max-width:860px){
  .ft-top{grid-template-columns:1fr;gap:24px}
}
/* ── 响应式修复（2026-10-12 用户令）─────────────────────────────
   头部导航折叠断点 720 → 1080：721–1080 区间五组导航 + 头部按钮挤爆
   （护眼/原版伴读/管理员互相重叠），此区间一律启用汉堡折叠菜单。 */
@media (max-width:1120px){
  .nav{display:none}
  .nav.show{display:flex;position:absolute;top:var(--hdr);left:0;right:0;background:#fff;
    flex-direction:column;align-items:stretch;padding:12px;gap:2px;margin:0;
    border-bottom:1px solid var(--line);box-shadow:var(--sh-m);max-height:calc(100vh - var(--hdr));
    overflow-y:auto;z-index:90}
  .nav.show a{border-radius:10px;padding:12px 14px}
  .nav.show .ngroup{width:100%}
  .nav.show .ng-top{width:100%;justify-content:space-between;padding:12px 14px;
    border-radius:10px;font-size:15px}
  .ng-menu{position:static;border-top:0;padding:2px 0 6px 8px;background:transparent;
    box-shadow:none;min-width:0}
  .ngroup:hover .ng-menu{display:none}
  .ngroup.open .ng-menu{display:flex}
  .menu-btn{display:grid}
  .hdr-act .btn-ghost{display:none}
}
/* 响应式修复（2026-10-12）：书架轮播负边距与外挂箭头在 ≤1300 视口越界
   （.sec 水平无 padding，rail margin:-22px 直接造成整页 22px 横向滚动）。
   窄屏收回负边距、箭头移入内容区内侧，卡片改为 rail 内部滚动。 */
@media (max-width:1300px){
  .rail{margin:0}
  .picks-grid{margin:0}
  .shorts-grid{margin:0}
  .rail-btn.prev{left:6px}
  .rail-btn.next{right:6px}
}
/* BRIDGE 示意图：6 列在 ≤960 视口严重挤压、文字跑版，提前折叠为 3 列 */
@media (max-width:960px){
  .brg-arc{display:none}
  .brg-ds br{display:none}
  .brg-i,.brg-i:hover{transform:none}
  .brg-st{grid-template-columns:repeat(3,1fr);row-gap:22px}
  .brg-ds{max-width:none;padding:0 2px}
}
/* 进阶图（六阶阶梯）：窄屏改横向滚动，卡片固定最小宽，不再挤压错位 */
@media (max-width:1080px){
  .lad{overflow-x:auto;padding:4px 2px 10px;-webkit-overflow-scrolling:touch}
  .lad-s{flex:0 0 auto;min-width:205px}
  .lad-cap{text-align:left}
}
@media (max-width:720px){
  :root{--hdr:56px}
  .sec{padding:34px 0}
  .hero h1{font-size:34px}
  .hero-stat{gap:22px;flex-wrap:wrap}
  .hero-stat div b{font-size:22px}
  .bk{flex-basis:196px}
  .mod{padding:28px 24px;min-height:250px}
  .mods .mod-logo{width:66px;top:16px;right:20px}
  .brg{padding-bottom:0}
  .brg-arc{display:none}
  .brg-ds br{display:none}
  .brg-i,.brg-i:hover{transform:none}
  .brg-st{grid-template-columns:repeat(3,1fr);row-gap:22px}
  .brg-ds{max-width:none;padding:0 2px}
  .mod h3{font-size:22px}
  .para{padding:15px 16px 15px 50px}
  .en-tx{font-size:var(--rd-fs,16px);line-height:1.85}
  .rd{padding-bottom:150px}
  .fab{right:14px;bottom:128px} /* 提离底部音频条，避免与播放钮重叠（2026-10-12） */
  .fab-list{gap:12px;margin-bottom:10px}
  .bar{border-radius:var(--r-m)}
  .pl-in{gap:11px;padding:9px 14px}
  .pl-info .t{font-size:12px}
  .rd-hd{padding:20px 20px}
  .rd-hd h1{font-size:22px}
  .wall-cta svg{width:min(328px,100%)}
  .wall-track{animation-duration:46s;gap:12px}
  .wcard{padding:5px}
  .nd-grid{grid-template-columns:1fr}
  .nd-imgwrap img{max-height:44vh}
}
@media print{.hdr,.fab,.pl,.bar,.toc{display:none!important}.rd{display:block;padding:0}}

/* ── 真实封面图（assets/covers/<id>.png）+ 白字叠层 ── */
.bk-cover .cv-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cv-ov{position:absolute;inset:0;display:flex;flex-direction:column;align-items:flex-start;
  padding:15px 17px;color:#fff;
  background:linear-gradient(180deg,rgba(18,14,32,.42),rgba(18,14,32,0) 30%,rgba(18,14,32,0) 52%,rgba(18,14,32,.68))}
.cv-brand{font-size:8.5px;letter-spacing:2.2px;opacity:.78}
.cv-en{font-family:Georgia,serif;font-size:19px;line-height:1.25;margin-top:8px;
  text-shadow:0 1px 6px rgba(0,0,0,.35)}
.cv-b{margin-top:auto;display:flex;flex-direction:column}
.cv-cn{font-size:17px;font-weight:600;text-shadow:0 1px 6px rgba(0,0,0,.4)}
.cv-au{font-size:10.5px;opacity:.85;margin-top:3px}
.cv-meta{font-size:9.5px;opacity:.72;margin-top:8px}
.sh-cv{overflow:hidden}
.sh-cv .cv-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ── 注册端双通道（v2.13：手机号 + 微信）── */
.reg-tabs{display:flex;gap:8px;margin:2px 0 4px}
.reg-tab{flex:1;padding:9px 0;border:1px solid var(--line);background:var(--card);
  border-radius:var(--r-m);font-size:13.5px;color:var(--muted);cursor:pointer;font-family:inherit}
.reg-tab.on{border-color:var(--brand);color:var(--brand);background:var(--brand-l);font-weight:600}
.reg-row{display:flex;gap:10px}
.reg-row input{flex:1;min-width:0}
.reg-otp{white-space:nowrap;font-size:12.5px;padding:10px 13px}
.reg-qr{display:flex;gap:14px;align-items:center;margin-top:14px}
.reg-qr-box{width:112px;height:112px;flex:none;border:1.5px dashed var(--brand);border-radius:var(--r-m);
  display:flex;align-items:center;justify-content:center;text-align:center;font-size:11.5px;
  line-height:1.6;color:var(--muted);background:var(--brand-l)}
.reg-qr p{margin:0;font-size:12.5px;color:var(--muted);line-height:1.8}
.reg-agree{display:block!important;font-size:11.5px!important;line-height:1.75;
  color:var(--muted)!important;margin:14px 0 0!important}
.reg-agree input{width:auto!important;accent-color:var(--brand);margin-right:6px;
  vertical-align:-2px}
/* 2026-10-17 用户令：勾选处小字不再跳独立长页，改为点开弹窗看要点 —— 链接做成
   下划线小字（与正文同色），悬停才转品牌色，避免在注册框里抢视觉。 */
.reg-agree a{color:var(--muted);text-decoration:underline;text-underline-offset:2px}
.reg-agree a:hover{color:var(--brand)}
/* ── 协议要点弹窗（#sheetLegal，由 site.js 按需注入）─────────────
   注册勾选处的小字链接点开即看，不跳转、不打断注册流程。
   术语：正文要点 11.3px、行高 1.7（2026-10-19 用户令再压小，只要看得见、不必看得清），
   内层滚动（.sheet-c 自身 88vh 仍兜底）。 */
.sheet-c.sheet-legal{max-width:560px;padding:24px 26px 20px}
.sheet-legal h3{font-size:19px;margin-bottom:3px}
.sheet-legal p.d{margin-bottom:12px;font-size:11px}
.legal-scroll{max-height:min(52vh,412px);overflow-y:auto;overscroll-behavior:contain;
  padding:2px 8px 2px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.legal-scroll ol{margin:10px 0;padding:0;list-style:none;counter-reset:lg}
.legal-scroll li{counter-increment:lg;position:relative;padding-left:20px;margin:6px 0;
  font-size:11.3px;line-height:1.7;color:var(--muted)}
.legal-scroll li::before{content:counter(lg) ".";position:absolute;left:2px;
  font-size:10.3px;color:var(--faint);font-variant-numeric:tabular-nums}
.legal-scroll b{color:var(--ink-2);font-weight:600}
.legal-foot{margin:9px 0 0;font-size:10.5px;line-height:1.62;color:var(--faint)}
.legal-foot a{color:var(--muted);text-decoration:underline;text-underline-offset:2px}
.legal-foot a:hover{color:var(--brand)}
@media(max-width:560px){
  .legal-scroll{max-height:50vh}
  .legal-scroll li{font-size:10.8px;line-height:1.66}
}
/* 登录 / 注册拆分弹层（2026-10-11 用户令）：加宽不滚动、通栏大按钮、底部链接 */
.sheet-c.sheet-auth{max-width:500px;padding:28px 30px 24px}
.auth-big{width:100%;justify-content:center;margin-top:20px;font-size:16px;
  letter-spacing:8px;text-indent:8px;padding:13px}
.auth-links{display:flex;justify-content:flex-end;gap:22px;margin-top:14px;font-size:13.5px}
.auth-links a{color:var(--brand);font-weight:600}
.auth-links a:hover{text-decoration:underline;text-underline-offset:3px}
/* 微信通道（2026-10-12）：按钮文案变长（微信授权注册），取消大字号字距 */
.auth-big.wx{letter-spacing:2px;text-indent:2px;font-size:15px}
/* 2026-10-14 用户令：登录/注册/找回密码等 auth 弹层统一为“细横线”输入框
   ——去掉圆角填充框与边框，仅留一条发丝下划线；聚焦时下划线转品牌红 */
.sheet-c.sheet-auth input:not([type="checkbox"]){
  border:0;border-bottom:1px solid var(--line-2);border-radius:0;background:transparent;
  padding:9px 2px;font-size:14.5px;transition:border-color .16s,box-shadow .16s}
.sheet-c.sheet-auth input:not([type="checkbox"]):focus{
  border-bottom-color:var(--brand);background:transparent;box-shadow:0 1px 0 0 var(--brand)}
.sheet-c.sheet-auth input::placeholder{color:var(--faint);letter-spacing:normal}
.sheet-c.sheet-auth label{margin:18px 0 2px}
.sheet-c.sheet-auth .reg-row{align-items:flex-end;gap:16px}
.sheet-c.sheet-auth .reg-otp{border:0;background:transparent;color:var(--brand);font-weight:600;
  border-radius:0;padding:9px 0;letter-spacing:.5px}
.sheet-c.sheet-auth .reg-otp:hover{background:transparent;color:var(--brand-d);
  text-decoration:underline;text-underline-offset:3px}
.sheet-c.sheet-auth .reg-agree input{width:auto!important;accent-color:var(--brand)}

/* ── 静态页（about / news / growth / courses / teachers）── */
.pg{max-width:860px;margin:0 auto;padding:36px 22px 70px}
.pg-k{font-size:11.5px;letter-spacing:2.5px;color:var(--brand);text-transform:uppercase}
.pg-t{font-family:var(--serif);font-size:30px;font-weight:400;margin:8px 0 6px;color:var(--ink)}
.pg h3{font-size:19px;margin:28px 0 8px;color:var(--ink);font-weight:600}
.pg p{line-height:1.9;color:var(--ink-2);font-size:14.5px;margin:10px 0}
/* 工作室介绍 2026-10-19：h3 之下的加粗小论点（“人人都可以读原版”）。
   刻意不复用 .pg h4 —— 全局 h4 会影响 bridge/features/courses 的既有版式。 */
.pg .sub-t{font-size:16.5px;font-weight:600;color:var(--ink);margin:16px 0 4px;
  letter-spacing:.01em;line-height:1.6}
/* 长文页正文内的行内链接（2026-10-15 用户令：需可见）
   全局 a{color:inherit;text-decoration:none} 会让 .pg 段落里的 <a> 变成“隐形链接”，
   故正文内链统一走 .pg-lnk：品牌色 + 下划线 + 悬停加深。 */
.pg-lnk{color:var(--brand);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.pg-lnk:hover{color:var(--brand-d)}
/* 2026-10-20 Emily 令：工作室介绍页的内链“只加下划线、不改颜色” */
.pg-u{color:inherit;font-weight:inherit;text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:1px}
.pg-u:hover{color:inherit;text-decoration-thickness:2px}
/* 法务页（隐私政策 / 用户协议）：版本元信息行 + 章节索引 + 正文列表。
   2026-10-16 新增 —— .pg 原先只有 p/h3，没有 ul/ol 与索引样式。 */
.pg-meta{display:flex;flex-wrap:wrap;gap:6px 20px;margin:14px 0 18px;padding:11px 0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  font-size:12.5px;color:var(--muted)}
.pg-meta b{color:var(--ink-2);font-weight:600;margin-right:2px}
.pg-toc{display:flex;flex-wrap:wrap;gap:9px 18px;margin:0 0 28px}
.pg-toc a{font-size:12.5px;color:var(--muted);padding-bottom:1px;
  border-bottom:1px dashed var(--line-2);transition:color .15s,border-color .15s}
.pg-toc a:hover{color:var(--brand);border-bottom:1px solid var(--brand)}
.pg ul,.pg ol{margin:10px 0;padding-left:20px;color:var(--ink-2);font-size:14.5px}
.pg li{line-height:1.85;margin:7px 0}
.pg li::marker{color:var(--brand)}
.pg h3{scroll-margin-top:calc(var(--hdr) + 16px)}   /* 锚点跳转不被吸顶导航遮挡 */
@media(max-width:640px){
  .pg-meta{gap:4px 14px;font-size:12px}
  .pg-toc{gap:8px 14px;margin-bottom:22px}
  .pg ul,.pg ol{padding-left:17px}
}
/* 法务文档排版（用户协议 / 隐私政策，2026-10-17 改版）
   参照主流门户协议的版式：重要提示块 + 章节索引（带序号）+ 悬挂式条款编号。
   条款编号走 1.1 / 1.2 的章内连续制；条内枚举用 ::before 自动生成（1）（2），
   增删条款时序号自动重排，不必手改正文。 */
.lg-note{border:1px solid var(--line);border-left:3px solid var(--brand);
  background:var(--card);border-radius:0 var(--r-m) var(--r-m) 0;
  padding:15px 18px 14px;margin:0 0 26px}
.lg-note h4{margin:0 0 7px;font-size:12.5px;letter-spacing:1.2px;
  font-weight:600;color:var(--brand)}
.lg-note p{margin:7px 0;font-size:13.5px;line-height:1.85;color:var(--ink-2)}
.lg-note p:last-child{margin-bottom:0}
/* 章节索引：三栏网格，每项前置两位序号 */
.pg .pg-toc--grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px 22px;margin:0 0 30px;padding:13px 0;counter-reset:toc;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pg .pg-toc--grid a{display:grid;grid-template-columns:20px 1fr;align-items:baseline;
  gap:5px;font-size:12.5px;color:var(--muted);padding-bottom:2px;
  border-bottom:1px dashed var(--line-2);transition:color .15s,border-color .15s}
.pg .pg-toc--grid a::before{counter-increment:toc;content:counter(toc,decimal-leading-zero);
  font-size:10.5px;letter-spacing:.3px;color:var(--line-2)}
.pg .pg-toc--grid a:hover{color:var(--brand);border-bottom-color:var(--brand)}
.pg .pg-toc--grid a:hover::before{color:var(--brand)}
/* 悬挂式条款：编号单列右对齐，正文左缘整齐 —— 长文可读性的关键。
   条款块用 div（条内可能含枚举列表，<p> 内不能放块级元素），
   故字体/行高/颜色必须显式声明，不能依赖 .pg p。 */
.pg .cl{display:flex;gap:10px;margin:11px 0}
.pg .cl-n{flex:none;width:32px;text-align:right;padding-top:2px;font-size:12px;
  font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:.2px}
.pg .cl-t{flex:1;min-width:0;line-height:1.9;font-size:14.5px;color:var(--ink-2)}
.pg .cl-t p{margin:0 0 8px}
.pg .cl-t p:last-child{margin-bottom:0}
/* 条内枚举：（1）（2）（3） */
.pg .cl-ol{list-style:none;counter-reset:cli;margin:6px 0 0;padding-left:0}
.pg .cl-ol>li{counter-increment:cli;position:relative;padding-left:31px;margin:5px 0;
  line-height:1.85;font-size:14.5px;color:var(--ink-2)}
.pg .cl-ol>li::before{content:"（" counter(cli) "）";position:absolute;left:0;
  font-size:13px;color:var(--muted)}
@media(max-width:860px){
  .pg .pg-toc--grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .pg .pg-toc--grid{grid-template-columns:1fr;gap:6px 0}
  .pg .cl{gap:8px}
  .pg .cl-n{width:27px;font-size:11px}
  .lg-note{padding:13px 14px 12px}
  .lg-note p{font-size:13px}
}
.pg .cardlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin:16px 0}
.pg .pcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r-m);
  padding:18px 20px;display:block;color:inherit;text-decoration:none;transition:.15s}
.pg a.pcard:hover{border-color:var(--brand);box-shadow:var(--sh-l)}
.pg .pcard h4{margin:0 0 6px;font-size:15.5px;color:var(--ink)}
.pg .pcard .dt{font-size:12px;color:var(--muted);margin:0 0 6px}
.pg .pcard p{margin:0;font-size:13px;color:var(--muted);line-height:1.75}
/* 活动公告：传统逐行标题栏（一行一条 · 日期 + 标题 + 箭头） */
.pg .news-list{list-style:none;margin:20px 0 0;padding:0;border-top:2px solid var(--ink-2)}
.pg .news-list li{border-bottom:1px solid var(--line-2)}
.pg .news-list a{display:flex;align-items:baseline;gap:18px;padding:13px 8px;text-decoration:none;transition:background .15s}
.pg .news-list a:hover{background:var(--bg-warm)}
.pg .news-list .nl-dt{flex:none;font-size:13px;color:var(--muted);font-family:var(--serif);letter-spacing:.02em;min-width:96px}
.pg .news-list .nl-tt{flex:1;font-size:16px;font-weight:600;color:var(--ink-2);line-height:1.65}
.pg .news-list a:hover .nl-tt{color:var(--brand)}
.pg .news-list .nl-go{flex:none;color:var(--faint);font-size:18px;line-height:1}
.pg .news-list .nl-new{flex:none;font-size:11px;color:var(--brand);border:1px solid currentColor;border-radius:4px;padding:1px 6px;letter-spacing:1px}
/* 置顶徽标（2026-10-14 用户令：会员费用与权益公示置顶） */
.pg .news-list .nl-pin{flex:none;font-size:11px;color:#fff;background:var(--brand);border-radius:4px;padding:2px 8px;letter-spacing:2px;align-self:center}
/* 后台发布的公告：页内展开的正文面板（news.html，site.js 注入） */
.pg .news-art{margin-top:34px;padding-top:6px}
.pg .news-art .pg-t{margin-bottom:4px}
.pg .news-art p:not(.sec-sub){line-height:1.9;color:var(--ink-2)}
/* BRIDGE 阅读法：六步台阶列表 */
.pg .brg-steps{margin:22px 0 8px;display:flex;flex-direction:column;gap:14px}
.pg .brg-step{display:flex;gap:18px;align-items:flex-start;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-m);padding:18px 20px;transition:.15s}
.pg .brg-step:hover{border-color:var(--brand);box-shadow:var(--sh-m)}
.pg .bs-l{flex:none;width:46px;height:46px;border-radius:14px;background:var(--brand);color:#fff;
  font-family:var(--serif);font-size:26px;font-weight:700;display:flex;align-items:center;justify-content:center}
.pg .bs-b h4{margin:0 0 6px;font-size:16.5px;color:var(--ink)}
.pg .bs-b h4 i{font-style:normal;font-weight:400;color:var(--muted);font-size:14px;margin-left:8px}
.pg .bs-b p{margin:0;font-size:13.5px;color:var(--ink-2);line-height:1.8}
/* 网站功能页：使用说明区块纵向排布（功能图全宽在上、三卡在下） */
.pg .idea-wrap{flex-direction:column}
.pg .idea{width:100%;flex-direction:column;margin:0 0 22px}
.pg .idea .idea-c{flex:none;min-width:0}
.pg .tour-box{width:100%;min-height:560px}
@media (max-width:720px){
  .pg .tour-box{min-height:420px}
  .pg .brg-step{flex-direction:row;gap:14px;padding:14px 16px}
}
.pg .price{display:flex;gap:14px;margin:18px 0;flex-wrap:wrap}
.pg .price .pr{flex:1;min-width:220px;background:var(--brand-l);border:1px solid var(--line);
  border-radius:var(--r-m);padding:22px;text-align:center;line-height:1.9}
.pg .price .pr b{font-size:26px;font-family:var(--serif);color:var(--brand)}
.pg .mine{border:1px solid var(--brand);background:var(--brand-l);border-radius:var(--r-m);
  padding:14px 18px;margin:14px 0;font-size:14px}

/* ── 书目详情页（book-<slug>.html：封面/基本信息/简介/目录）── */
/* v2.38：详情页占满站点内容列（max-width 交还 .wrap 的 1240px），
   左缘与顶栏/书架对齐，不再是一根居中的窄柱；文字行随之拉长，避免半路折行 */
.pg.bkd{max-width:none}
.bkd-hero{display:flex;gap:40px;align-items:flex-start}
.bkd-cover{flex:none;width:256px;border-radius:var(--r-l);overflow:hidden;
  box-shadow:var(--sh-l);background:var(--lav)}
.bkd-cover .bk-cover{border-radius:0}
.bkd-info{flex:1;min-width:0}
.bkd-info h2{margin:12px 0 5px;font-family:var(--serif);font-weight:400;font-size:34px;color:var(--ink)}
.bkd-en{font-size:14px;color:var(--faint);letter-spacing:.4px}
.bkd-intro{margin:16px 0 0;font-size:15.5px;line-height:1.8;color:var(--ink-2)}
/* 2026-10-20 用户令：简介块前的黑色粗体小标题 */
.bkd-sec{margin:20px 0 0;font-size:14.5px;font-weight:700;color:#000;letter-spacing:.6px}
.bkd-sec+.bkd-intro{margin-top:8px}
.bkd-why{margin:9px 0 0;font-size:13.5px;line-height:1.75;color:var(--muted)}
.bkd-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px 24px;
  margin:20px 0 2px;padding:16px 20px;background:var(--bg-warm);border:1px solid var(--line);
  border-radius:var(--r-m)}
.bkd-facts>div{display:flex;gap:10px;align-items:baseline;font-size:13.5px}
.bkd-facts dt{flex:none;color:var(--faint)}
.bkd-facts dd{margin:0;font-weight:600;color:var(--ink)}
.bkd-act{display:flex;align-items:center;gap:12px;margin-top:18px;flex-wrap:wrap}
.bkd-go{display:inline-block;background:var(--brand);color:#fff;font-weight:600;
  font-size:14.5px;padding:10px 28px;border-radius:999px;text-decoration:none;
  box-shadow:0 6px 16px rgba(221,77,40,.32);transition:.15s}
.bkd-go:hover{background:var(--brand-d);color:#fff}
.bkd-shelf{display:inline-block;padding:9px 24px;border-radius:999px;border:1.5px solid var(--brand);
  background:transparent;color:var(--brand);font-weight:600;font-size:14.5px;cursor:pointer;
  font-family:inherit;transition:.15s}
.bkd-shelf:hover{background:var(--brand-l)}
.bkd-shelf.on{background:var(--brand-l);color:var(--brand-d)}
.bkd-last{margin:12px 0 0;font-size:13px;color:var(--muted)}
.bkd-last a{color:var(--brand);font-weight:600;text-decoration:none}
.bkd-last a:hover{text-decoration:underline}
.bkd-soonbtn{background:var(--lav);color:var(--muted);box-shadow:none;cursor:default}
.bkd-soonbtn:hover{background:var(--lav)}
.bkd-toc{margin-top:38px}
.bkd-toc h3{margin:0 0 14px;font-size:20px;color:var(--ink);display:flex;align-items:baseline;gap:12px}
.bkd-toc h3 span{font-size:12.5px;color:var(--faint);font-weight:400;letter-spacing:.3px}
.bt-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.bt-list a{display:flex;align-items:center;gap:15px;padding:12px 18px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-m);text-decoration:none;color:inherit;transition:.15s}
.bt-list a:hover{border-color:var(--brand);box-shadow:var(--sh-m);transform:translateX(4px)}
.bt-n{flex:none;width:30px;height:30px;border-radius:50%;background:var(--brand-l);color:var(--brand-d);
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13.5px}
.bt-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.bt-tx b{font-family:var(--serif);font-weight:400;font-size:15px;color:var(--ink)}
.bt-tx span{font-size:12px;color:var(--muted)}
.bt-w{flex:none;font-size:12px;color:var(--faint)}
.bt-soon{padding:18px 22px;background:var(--rose-l);border-radius:var(--r-m);
  color:var(--rose);font-size:13.5px;line-height:1.7}
@media (max-width:720px){
  .bkd-hero{flex-direction:column;align-items:flex-start;text-align:left}
  .bkd-cover{width:200px}
  .bkd-info{width:100%}
  .bkd-info h2{font-size:27px}
}

/* PDF 弹窗描述：单行不折行（桌面加宽弹窗；窄屏恢复自动换行） */
#pdfDesc{font-size:12.5px}
#sheetPdf .sheet-c{max-width:600px}
@media (max-width:720px){#pdfDesc{line-height:1.7}}

/* ── 伴读成长体系页（v2.61 阶梯图 + 成长表）── */
.gdw-soon{font-style:normal;font-size:12px;vertical-align:middle;color:var(--brand-d);
  background:var(--brand-l);border:1px solid var(--lav,#D9CBEF);border-radius:999px;
  padding:3px 12px;margin-left:10px;white-space:nowrap}
.gdw-stairs{margin:24px 0 10px;border:1px solid var(--line);border-radius:16px;
  background:var(--card);padding:22px 22px 12px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.gdw-stairs svg{display:block}
.lvtab-wrap{overflow-x:auto;margin:18px 0 8px;-webkit-overflow-scrolling:touch}
.lvtab{border-collapse:separate;border-spacing:0;width:100%;min-width:760px;font-size:13px}
.lvtab th,.lvtab td{border-bottom:1px solid var(--line);padding:11px 10px;text-align:left;
  vertical-align:top;line-height:1.7;color:var(--ink)}
.lvtab thead th{font-size:13.5px;color:var(--brand-d);background:var(--brand-l);
  white-space:nowrap;border-bottom:2px solid var(--lav,#D9CBEF)}
.lvtab thead th:first-child{border-radius:12px 0 0 0}
.lvtab thead th:last-child{border-radius:0 12px 0 0}
.lvtab tbody th{font-weight:700;color:#3A3352;white-space:nowrap;background:#FAF8FD}
.lvtab tbody tr:last-child th,.lvtab tbody tr:last-child td{border-bottom:none}
.lvtab tbody tr:hover td{background:#FBFAFE}
.gdw-close{margin:18px 0 0;font-size:14.5px;line-height:1.9;color:var(--ink)}

/* bridge.html“为什么叫 BRIDGE”节内 · 浅底版六步弧线（无背景板，融入页面底色） */
.brg-lite{margin-top:22px;padding-bottom:8px}
.brg-lite .brg-d{border-color:#fff;box-shadow:0 4px 14px rgba(70,25,45,.15),inset 0 0 0 1px rgba(255,255,255,.2)}
.brg-lite .brg-en,.brg-lite .brg-cn{color:#3A3352}
.brg-lite .brg-st{gap:10px}
.brg-lite .brg-ds{color:#7A7392;font-size:10.5px;max-width:none;letter-spacing:0}
@media (max-width:720px){
  .brg-lite .brg-st{grid-template-columns:repeat(3,1fr);gap:18px 8px}
  .brg-lite .brg-i{transform:none!important}
  .brg-lite .brg-arc{display:none}
}

/* ══ 阅读页批注：收藏到我的笔记（v2.70）══ */
.nx-i .fv{margin-left:auto;flex:none;align-self:center;white-space:nowrap;
  font-size:11px;line-height:1.5;padding:2px 10px;border-radius:20px;
  border:1px solid var(--line-2);background:#fff;color:var(--muted);transition:.16s}
.nx-i .fv:hover{border-color:var(--brand);color:var(--brand-d);background:var(--brand-l)}
.nx-i .fv.on{background:var(--brand-l);border-color:var(--brand);color:var(--brand-d);font-weight:700}

/* ══════════════════════════════════════════════════════════════
   v2.70 会员后台（会员中心 member / VIP 中心 vip / 管理后台 admin）
   配色 A 案“深紫同源加深”：顶栏保持全站一致，
   靠“深紫标识条 + 深紫侧栏 + 淡紫内容底”提示“已进入后台”。
   后台色板独立，不随护眼模式变化 —— 强化场景切换的感知。
   ══════════════════════════════════════════════════════════════ */
:root{
  /* 后台三页沿用主站极简线条令牌：白底 + 发丝线 + 品牌红点缀，随主题（简约/护眼）自动切换 */
  --cs-ink:var(--ink); --cs-ink2:var(--ink-2); --cs-mut:var(--muted); --cs-dim:var(--faint);
  --cs-bg:var(--bg); --cs-card:var(--card); --cs-line:var(--line); --cs-line2:var(--line-2);
  --cs-acc:var(--brand); --cs-acc-d:var(--brand-d); --cs-acc-l:var(--brand-l);
  --cs-ok:#3F8F63; --cs-ok-l:#E8F5EE;
  --cs-warn:#B5822A; --cs-warn-l:#FBF3DF;
  --cs-no:#C2556A; --cs-no-l:#FBEBEF;
  --cs-gold:#C9A227;
}
body[data-page="console"]{background:var(--cs-bg)}
.cs-shell{display:grid;grid-template-columns:218px minmax(0,1fr);gap:22px;align-items:start;padding-top:26px;padding-bottom:56px}

/* ── 顶栏下的标识条：白底发丝线 ── */
.cs-bar{background:var(--card);border-bottom:1px solid var(--line);color:var(--ink-2)}
.cs-bar-in{max-width:var(--maxw);margin:0 auto;padding:0 22px;height:46px;
  display:flex;align-items:center;gap:14px;font-size:13.5px}
.cs-bar .cs-tag{background:var(--card);border:1px solid var(--line-2);color:var(--cs-acc-d);
  border-radius:20px;padding:2px 13px;font-weight:700;letter-spacing:.4px;white-space:nowrap}
.cs-bar .cs-crumb{color:var(--cs-mut)}
.cs-bar .cs-crumb a{color:var(--cs-mut);text-decoration:none;border-bottom:1px solid transparent;transition:color .18s,border-color .18s}
.cs-bar .cs-crumb a:hover{color:var(--cs-acc-d);border-bottom-color:var(--cs-acc)}
.cs-bar .cs-crumb b{font-weight:700;color:var(--cs-ink)}
.cs-bar .cs-back{margin-left:auto;white-space:nowrap;color:var(--cs-acc-d);border-bottom:1px solid transparent}
.cs-bar .cs-back:hover{border-bottom-color:var(--cs-acc)}

/* ── 侧栏：白卡 + 发丝线 ── */
.cs-side{position:sticky;top:80px;background:var(--cs-card);
  border:1px solid var(--line);border-radius:16px;padding:16px 12px 14px;color:var(--cs-ink2)}
.cs-me{display:flex;align-items:center;gap:10px;padding:4px 6px 14px;border-bottom:1px solid var(--line);margin-bottom:12px}
.cs-me .av{width:40px;height:40px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--cs-acc-l);border:1px solid var(--line-2);color:var(--cs-acc-d);font-family:var(--serif);
  font-weight:700;font-size:17px}
.cs-me .nm{font-weight:700;font-size:14.5px;line-height:1.35;word-break:break-all;color:var(--cs-ink)}
.cs-me .rl{font-size:11.5px;color:var(--cs-mut);margin-top:1px;white-space:nowrap}
.cs-me .rl2{font-size:11.5px;color:var(--cs-mut);white-space:nowrap}  /* 到期时间独立一行，不折行 */
.cs-nav{display:flex;flex-direction:column;gap:2px}
.cs-nav-a{display:flex;align-items:center;gap:9px;padding:8px 11px;border-radius:9px;
  font-size:14px;color:var(--cs-ink2);cursor:pointer;transition:color .2s;text-align:left;width:100%;position:relative}
/* 动效：不用底色填充，改为左侧细红线“生长”+ 文字/图标变色（弱化工作台感） */
.cs-nav-a::before{content:'';position:absolute;left:0;top:50%;width:3px;height:0;border-radius:2px;
  background:var(--cs-acc);transform:translateY(-50%);transition:height .22s ease}
.cs-nav-a i{font-style:normal;font-size:15px;width:18px;text-align:center;flex:none;opacity:.85;transition:transform .2s}
.cs-nav-a:hover{background:transparent;color:var(--cs-acc-d)}
.cs-nav-a:hover i{transform:translateX(2px);opacity:1}
.cs-nav-a.on{background:transparent;color:var(--cs-acc-d);font-weight:700}
.cs-nav-a.on::before{height:62%}
.cs-nav-a .n{margin-left:auto;font-size:11px;color:var(--cs-mut);
  border:1px solid var(--line);border-radius:10px;padding:0 7px;min-width:20px;text-align:center;background:var(--cs-card)}
.cs-nav-h{font-size:11px;letter-spacing:1.2px;color:var(--cs-dim);padding:14px 11px 6px;text-transform:uppercase}
.cs-side .cs-out{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.cs-side .cs-out a{display:block;font-size:12.5px;color:var(--cs-mut);padding:5px 11px;border-radius:8px}
.cs-side .cs-out a:hover{background:transparent;color:var(--cs-acc-d)}

/* ── 主区 ── */
.cs-main{min-width:0}
.cs-h{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin:0 0 16px}
.cs-h h1{margin:0;font-size:23px;letter-spacing:.3px;color:var(--cs-ink);display:flex;align-items:center}
.cs-h h1 .h-ico{display:inline-flex;margin-right:10px;flex:none}
.cs-h h1 .cs-tag{margin-left:22px;font-size:12px}
.cs-h .sub{font-size:13px;color:var(--cs-mut);padding-bottom:3px}
.cs-h .cs-h-act{margin-left:auto;display:flex;gap:9px;flex-wrap:wrap}
.cs-card{background:var(--cs-card);border:1px solid var(--line);border-radius:14px;
  padding:18px 20px;margin-bottom:16px}
.cs-card > h3{margin:0 0 12px;font-size:15px;color:var(--cs-ink);display:flex;align-items:center;gap:8px}
.cs-card > h3 .cs-tag{margin-left:auto}
.cs-p{font-size:13.5px;color:var(--cs-ink2);line-height:1.75;margin:6px 0}
.cs-dim{color:var(--cs-mut)}
.cs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;align-items:start}

/* ── 账号设置（无框简洁排版）── */
.ac-wrap{max-width:660px;padding-left:16px}
.ac-sec{padding:20px 0 6px;border-top:1px solid var(--cs-line)}
.ac-sec:first-child{border-top:0;padding-top:0}
.ac-sec h3{margin:0 0 14px;font-size:15.5px;color:var(--cs-ink);display:flex;align-items:center;gap:9px}
.ac-sec .cs-field{max-width:340px}
.ac-sec .cs-row{margin-top:4px}
.ac-cols{display:flex;gap:16px}
.ac-cols .cs-field{flex:1;max-width:none}
@media (max-width:640px){.ac-cols{flex-direction:column;gap:0}.ac-wrap{padding-left:0}}

/* ── 问候卡：白底发丝线，标题用衬线呼应主页 ── */
.cs-greet{background:var(--cs-card);border:1px solid var(--line);border-radius:14px;
  color:var(--cs-ink);padding:20px 22px;margin-bottom:16px;
  display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.cs-greet .hi{font-size:19px;font-weight:700;line-height:1.5}
.cs-greet .sm{font-size:13px;color:var(--cs-mut);margin-top:3px}
.cs-greet .cs-h-act{margin-left:auto;display:flex;gap:9px;flex-wrap:wrap}
.cs-greet .cs-btn{background:var(--cs-card);border-color:var(--line-2);color:var(--cs-ink2)}
.cs-greet .cs-btn:hover{border-color:var(--cs-acc);color:var(--cs-acc-d);background:var(--cs-acc-l)}
.cs-greet .cs-btn.pri{background:var(--cs-acc);border-color:var(--cs-acc);color:#fff}
.cs-greet .cs-btn.pri:hover{background:var(--cs-acc-d);border-color:var(--cs-acc-d);color:#fff}

/* ── 会员引导条 ── */
.cs-strip{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  background:var(--cs-acc-l);border:1px solid var(--line);border-radius:12px;
  padding:12px 16px;margin-bottom:16px;font-size:13.5px;color:var(--cs-ink2)}
.cs-strip > span{flex:1;min-width:220px;line-height:1.8}
.cs-strip .cs-btn{margin-left:auto}
.cs-strip.is-warn{background:var(--cs-warn-l);border-color:#E9D9A8}
.cs-strip.is-ok{background:var(--cs-ok-l);border-color:#C6E4D2}

/* ── 按钮（主站同款胶囊）/ 徽章（描边极简） ── */
.cs-btn{display:inline-flex;align-items:center;gap:6px;font-size:13px;padding:7px 16px;border-radius:999px;
  border:1px solid var(--line-2);background:var(--cs-card);color:var(--cs-ink2);cursor:pointer;transition:.15s;white-space:nowrap}
.cs-btn:hover{border-color:var(--cs-acc);color:var(--cs-acc-d);background:var(--cs-acc-l)}
.cs-btn.pri{background:var(--cs-acc);border-color:var(--cs-acc);color:#fff;font-weight:600}
.cs-btn.pri:hover{background:var(--cs-acc-d);border-color:var(--cs-acc-d);color:#fff}
.cs-btn.danger{border-color:#E9C4CD;color:var(--cs-no)}
.cs-btn.danger:hover{background:var(--cs-no-l);border-color:var(--cs-no);color:var(--cs-no)}
.cs-btn[disabled],.cs-btn.is-off{opacity:.45;cursor:not-allowed;background:var(--cs-bg);color:var(--cs-dim);border-color:var(--line)}
.cs-btn[disabled]:hover,.cs-btn.is-off:hover{background:var(--cs-bg);color:var(--cs-dim);border-color:var(--line)}
.cs-btn.sm{font-size:12px;padding:4px 12px}
.cs-tag{display:inline-block;font-size:11px;padding:1.5px 9px;border-radius:20px;
  border:1px solid var(--line-2);background:var(--cs-card);color:var(--cs-mut);white-space:nowrap}
.cs-tag.ok{border-color:#BFE0CE;background:var(--cs-card);color:var(--cs-ok)}
.cs-tag.warn{border-color:#E9D9A8;background:var(--cs-card);color:var(--cs-warn)}
.cs-tag.no{border-color:#EFC7D1;background:var(--cs-card);color:var(--cs-no)}
.cs-tag.gold{border-color:#E9D9A8;background:var(--cs-card);color:#8E7420}

/* ── 表单 ── */
.cs-field{display:flex;flex-direction:column;gap:6px;margin-bottom:13px;max-width:420px}
.cs-field label{font-size:12.5px;color:var(--cs-mut)}
.cs-field input,.cs-field select,.cs-field textarea{background:var(--cs-card);border:1px solid var(--line-2);
  border-radius:9px;padding:9px 12px;font-size:14px;color:var(--cs-ink);outline:none;width:100%}
.cs-field input:focus,.cs-field select:focus,.cs-field textarea:focus{border-color:var(--cs-acc);box-shadow:0 0 0 3px var(--cs-acc-l)}
.cs-row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}

/* ── 书架行 ── */
.cs-bk{display:flex;align-items:center;gap:13px;padding:11px 0;border-bottom:1px solid var(--line)}
.cs-bk:last-child{border-bottom:0}
.cs-bk img{width:44px;height:60px;object-fit:cover;border-radius:6px;flex:none;border:1px solid var(--line)}
.cs-bk .tx{min-width:0;flex:1}
.cs-bk .tt{font-size:14.5px;font-weight:700;color:var(--cs-ink)}
.cs-bk .mt{font-size:12px;color:var(--cs-mut);margin-top:2px}
.cs-bk .acts{display:flex;gap:7px;flex:none;flex-wrap:wrap;justify-content:flex-end}
.cs-prog{height:5px;border-radius:6px;background:var(--cs-bg);border:1px solid var(--line);overflow:hidden;margin-top:7px;max-width:320px}
.cs-prog i{display:block;height:100%;background:var(--cs-acc);border-radius:6px}

/* ── 邀请 ── */
.cs-inv{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.cs-code{font-family:var(--serif);font-size:21px;font-weight:700;letter-spacing:1.5px;color:var(--cs-ink);
  background:var(--cs-card);border:1px solid var(--line-2);border-radius:10px;padding:8px 16px}
.cs-inv .steps{font-size:12.5px;color:var(--cs-mut);line-height:1.9}

/* ── 笔记行（我的笔记 + 笔记墙投稿）── */
.cs-nt{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;
  background:var(--cs-card);margin-bottom:8px;border:1px solid var(--line);flex-wrap:wrap}
.cs-nt:hover{border-color:var(--line-2);background:var(--cs-bg)}
.cs-nt .kk{font-family:var(--serif);font-size:15px;font-weight:700;color:var(--cs-ink);flex:none}
.cs-nt .ph{font-size:12px;color:var(--cs-mut);font-family:var(--serif);flex:none}
.cs-nt .cn{font-size:13.5px;color:var(--cs-ink2);flex:1;min-width:120px}
.cs-nt .hook{font-size:12px;color:var(--cs-mut);width:100%;padding-left:2px}
.cs-nt .wt{font-size:12px;color:var(--cs-dim);flex:none;white-space:nowrap}
.cs-nt .st{flex:none;font-size:12px;white-space:nowrap}
.cs-nt .st.yes{color:var(--cs-ok);font-weight:700}
.cs-nt .st.no{color:var(--cs-dim)}
/* 我的感悟：卡片 + 全部列表 */
.cs-btn[disabled],.cs-btn[disabled]:hover{opacity:.45;pointer-events:none}
.gw-card{margin-bottom:10px}
.gw-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.gw-top .gw-t{margin-left:auto;font-size:12px}
.gw-card .gw-txt{margin:9px 0 0;font-size:14px;line-height:1.9;color:var(--cs-ink2)}
.gw-row .cn{white-space:normal}
.cs-nt .acts{flex:none;display:flex;gap:6px}
.cs-book-h{display:flex;align-items:center;gap:10px;margin:18px 0 9px;font-size:14px;
  color:var(--cs-ink);font-weight:700;box-shadow:inset 3px 0 0 var(--cs-acc);padding-left:10px}
.cs-book-h .cs-tag{font-weight:400}

/* ── 知识复习 ── */
.cs-rv-bar{display:flex;gap:14px;align-items:center;flex-wrap:wrap;
  background:var(--cs-card);border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin-bottom:16px}
.cs-rv-bar select{background:var(--cs-card);border:1px solid var(--line-2);border-radius:9px;padding:8px 12px;font-size:14px;color:var(--cs-ink);min-width:200px}
.cs-q{background:var(--cs-card);border:1px solid var(--line);border-radius:14px;padding:20px 22px}
.cs-q .qh{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--cs-mut);margin-bottom:12px;flex-wrap:wrap}
.cs-q .qh .cs-tag{margin-left:auto}
.cs-q .qt{font-size:20px;color:var(--cs-ink);line-height:1.75;margin:0 0 6px}
.cs-q .qt em{font-style:normal;font-size:1.2em;color:var(--cs-acc-d);font-weight:700;border-bottom:1px solid var(--line-2);padding:0 3px}
.cs-q .qt .blank{display:inline-block;min-width:82px;border-bottom:2px solid var(--cs-acc);
  color:var(--cs-acc-d);font-weight:700;letter-spacing:3px;text-align:center}
.cs-q .qs{font-size:14.5px;color:var(--cs-dim);margin-bottom:14px}
.cs-opts{display:grid;gap:9px;margin-bottom:15px}
.cs-opt{display:flex;align-items:center;gap:11px;text-align:left;padding:11px 14px;border-radius:10px;
  border:1px solid var(--line);background:var(--cs-card);font-size:16.5px;color:var(--cs-ink);cursor:pointer;transition:.14s;width:100%}
.cs-opt:hover{border-color:var(--cs-acc);background:var(--cs-acc-l)}
.cs-opt .k{flex:none;width:23px;height:23px;border-radius:50%;display:grid;place-items:center;
  background:var(--cs-bg);border:1px solid var(--line);font-size:12px;font-weight:700;color:var(--cs-mut)}
.cs-opt.on{border-color:var(--cs-acc);background:var(--cs-acc-l)}
.cs-opt.on .k{background:var(--cs-acc);border-color:var(--cs-acc);color:#fff}
.cs-opt.ok{border-color:var(--cs-ok);background:var(--cs-ok-l)}
.cs-opt.ok .k{background:var(--cs-ok);border-color:var(--cs-ok);color:#fff}
.cs-opt.no{border-color:var(--cs-no);background:var(--cs-no-l)}
.cs-opt.no .k{background:var(--cs-no);border-color:var(--cs-no);color:#fff}
.cs-opt[disabled]{cursor:default}
.cs-q .fb{margin-top:12px;padding:12px 15px;border-radius:10px;font-size:14.5px;line-height:1.8}
.cs-q .fb.ok{background:var(--cs-ok-l);color:#2E6E4B}
.cs-q .fb.no{background:var(--cs-no-l);color:#9C4356}
.cs-q input.cs-in{background:var(--cs-card);border:1px solid var(--line-2);border-radius:10px;
  padding:11px 15px;font-size:17px;font-family:var(--serif);letter-spacing:2px;color:var(--cs-ink);outline:none;max-width:280px}
.cs-q input.cs-in:focus{border-color:var(--cs-acc);box-shadow:0 0 0 3px var(--cs-acc-l)}
.cs-rv-foot{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:16px}
.cs-rv-foot .cs-dim{font-size:12.5px}
.cs-stat{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:14px;margin-bottom:16px}
.cs-stat .it{background:var(--cs-card);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.cs-stat .it b{display:block;font-family:var(--serif);font-size:24px;color:var(--cs-ink);line-height:1.3}
.cs-stat .it span{font-size:12px;color:var(--cs-mut)}
.cs-rv-dots{display:flex;gap:5px;flex-wrap:wrap}
.cs-rv-dots i{width:9px;height:9px;border-radius:50%;background:var(--cs-card);border:1px solid var(--line-2);display:block}
.cs-rv-dots i.done{background:var(--cs-acc);border-color:var(--cs-acc)}
.cs-rv-dots i.ok{background:var(--cs-ok);border-color:var(--cs-ok)}
.cs-rv-dots i.no{background:var(--cs-no);border-color:var(--cs-no)}
.cs-rv-dots i.cur{background:var(--cs-gold);border-color:var(--cs-gold);box-shadow:0 0 0 3px #F6EAC8}

/* ── 表格 ── */
.cs-tb{width:100%;border-collapse:collapse;font-size:13px}
.cs-tb th,.cs-tb td{padding:9px 11px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.cs-tb th{font-size:12px;color:var(--cs-mut);font-weight:600;background:var(--cs-bg);white-space:nowrap}
.cs-tb tr:hover td{background:var(--cs-acc-l)}
.cs-tb td.acts{white-space:nowrap}

/* ── 统计可点击卡 + 后台分页（v2.122）── */
.cs-stat .it-link{width:100%;text-align:left;cursor:pointer;font:inherit;transition:.16s}
.cs-stat .it-link:hover{border-color:var(--cs-acc);box-shadow:0 0 0 3px var(--cs-acc-l)}
.cs-stat .it-link b{display:block;font-family:var(--serif);font-size:24px;color:var(--cs-ink);line-height:1.3}
.cs-stat .it-link span{font-size:12px;color:var(--cs-mut)}
.cs-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.cs-pager-info{font-size:12px;color:var(--cs-mut)}
.cs-pager-btns{display:flex;align-items:center;gap:8px}
.cs-pgno{font-size:12.5px;color:var(--cs-ink2);min-width:54px;text-align:center;font-weight:600}
.cs-btn[disabled]{opacity:.42;cursor:not-allowed}

/* ── 空态 / 提示 ── */
.cs-empty{text-align:center;padding:34px 18px;color:var(--cs-mut);font-size:13.5px}
.cs-empty .big{font-size:30px;opacity:.5;margin-bottom:8px}
.cs-note{font-size:12px;color:var(--cs-dim);line-height:1.7}

/* ── 手机端 ── */
@media (max-width:900px){
  .cs-shell{grid-template-columns:1fr;gap:14px;padding-top:14px}
  .cs-side{position:static;border-radius:14px;padding:12px}
  .cs-nav{flex-direction:row;overflow-x:auto;gap:7px;padding-bottom:4px}
  .cs-nav-a{width:auto;white-space:nowrap;border-radius:9px;padding:8px 13px}
  .cs-nav-a::before{display:none}
  .cs-nav-a.on{box-shadow:inset 0 -2px 0 var(--cs-acc)}
  .cs-nav-a .n{display:none}
  .cs-nav-h{display:none}
  .cs-me{padding-bottom:10px;margin-bottom:10px}
  .cs-bar-in{height:auto;padding:9px 18px;flex-wrap:wrap;gap:8px}
  .cs-bar .cs-back{margin-left:0;width:100%}
  .cs-h h1{font-size:20px}
  .cs-card{padding:15px 14px}
}

/* ── 后台弹层 ── */
.cs-modal{position:fixed;inset:0;background:rgba(0,0,0,.38);z-index:300;display:grid;place-items:center;padding:18px}
.cs-modal-c{background:var(--cs-card);border:1px solid var(--line);border-radius:14px;max-width:560px;width:100%;max-height:88vh;overflow:auto;box-shadow:var(--sh-m)}
.cs-modal-h{display:flex;align-items:center;gap:10px;padding:15px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--cs-card);border-radius:14px 14px 0 0}
.cs-modal-h b{font-size:15px;color:var(--cs-ink)}
.cs-modal-h .cs-x{margin-left:auto;font-size:22px;line-height:1;color:var(--cs-mut);padding:0 4px}
.cs-modal-h .cs-x:hover{color:var(--cs-no)}
.cs-modal-b{padding:18px}
/* 管理后台内的小列表 */
.cs-li{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;background:var(--cs-card);border:1px solid var(--line);margin-bottom:8px;flex-wrap:wrap}
.cs-li img{width:64px;height:82px;object-fit:cover;border-radius:8px;flex:none;border:1px solid var(--line)}
.cs-li .tx{flex:1;min-width:150px;font-size:13px;color:var(--cs-ink2)}
.cs-li .tx b{color:var(--cs-ink)}
.cs-li .acts{display:flex;gap:6px;flex-wrap:wrap}
.cs-sw{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
.cs-sw:last-child{border-bottom:0}
.cs-sw .nm2{flex:1;font-size:13.5px;color:var(--cs-ink2)}
.cs-sw .tg{width:44px;height:24px;border-radius:20px;background:var(--line-2);position:relative;flex:none;transition:.18s;cursor:pointer}
.cs-sw .tg::after{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:#fff;transition:.18s;box-shadow:0 1px 4px rgba(0,0,0,.18)}
.cs-sw .tg.on{background:var(--cs-acc)}
.cs-sw .tg.on::after{left:22px}

/* ═══ 站点通知横幅（v2.94）：管理后台“通知推送”→ 页顶接收 ═══ */
.notice-bar{
  display:flex;align-items:center;gap:14px;
  max-width:calc(var(--maxw) - 48px);margin:14px auto 0;
  padding:12px 16px;background:var(--brand-l);
  border:1px solid var(--line);border-left:3px solid var(--brand);
  border-radius:var(--r-s);font-size:14.5px;color:var(--ink-2);
}
.notice-bar .nb-tag{
  flex:none;padding:3px 10px;border-radius:999px;
  background:var(--brand);color:#fff;font-size:12.5px;font-weight:700;letter-spacing:2px;
}
.notice-bar .nb-tx{flex:1;min-width:0;line-height:1.55}
.notice-bar .nb-tx b{color:var(--ink)}
.notice-bar .nb-sep{display:inline-block;width:1px;height:12px;background:var(--line-2);margin:0 10px;vertical-align:-1px}
.notice-bar .nb-x{
  flex:none;width:26px;height:26px;border:none;border-radius:50%;cursor:pointer;
  background:transparent;color:var(--muted);font-size:17px;line-height:1;
}
.notice-bar .nb-x:hover{background:var(--line);color:var(--ink)}
@media (max-width:760px){
  .notice-bar{max-width:calc(100% - 32px);flex-wrap:wrap;gap:8px 10px}
}


/* ══════════════════════════════════════════════════════════════
   分节翻页阅读（2026-10-01：彼得兔系列图文小书）
   口径：每 5 句 ≈ 3–5 个自然段为一节，一次只显示一节，不再一整页放完全书；
        左侧目录按节列出（章节条目下的次级列表）。
   ══════════════════════════════════════════════════════════════ */
.pgn{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-l);
  padding:11px 14px;margin-bottom:16px;box-shadow:var(--sh-s)}
.pgn-b{flex:none;border:1px solid var(--line-2);border-radius:999px;padding:7px 16px;
  font-size:13.5px;color:var(--ink-2);transition:.18s;white-space:nowrap}
.pgn-b:hover:not(:disabled){background:var(--brand);border-color:var(--brand);color:#fff}
.pgn-b:disabled{opacity:.38;cursor:not-allowed}
.pgn-c{flex:1;min-width:210px;display:flex;flex-direction:column;gap:7px;align-items:center}
.pgn-i{font-size:12.5px;color:var(--muted);letter-spacing:.3px}
.pgn-i b{color:var(--brand-d)}
.pgn-dots{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.pgn-dots button{width:25px;height:25px;border-radius:8px;font-size:11.5px;font-weight:600;
  background:var(--bg-warm);border:1px solid var(--line);color:var(--muted);transition:.16s}
.pgn-dots button:hover{border-color:var(--brand);color:var(--brand-d)}
.pgn-dots button.on{background:var(--brand);border-color:var(--brand);color:#fff}
/* 非当前节的段落整体隐藏（门锁/朗读/进度仍按整章口径计算） */
.para.sec-off{display:none}
/* 目录：章节条目下的“节”次级列表 */
.toc-sub{display:flex;flex-direction:column;gap:2px;margin:2px 0 6px 14px;
  padding-left:10px;border-left:1px solid var(--line)}
.toc-se{display:flex;align-items:baseline;gap:8px;padding:6px 9px;border-radius:8px;
  font-size:12px;color:var(--muted);line-height:1.35}
.toc-se:hover{background:var(--brand-l);color:var(--brand-d)}
.toc-se.on{background:var(--brand-l);color:var(--brand-d);font-weight:600}
.toc-se-n{flex:none;min-width:15px;font-size:10.5px;font-weight:600;color:var(--brand-d);opacity:.85}
.toc-se-tx{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:760px){
  .pgn-c{align-items:stretch}
  .pgn-dots{justify-content:flex-start}
}

/* ── 系列分册：详情页“分册 · 单篇精读”卡片区 + 卡片系列角标 ── */
.bkd-subs{padding:0 52px}   /* 2026-10-01 用户令：分册区整体内收一点（行内仍左对齐） */
.bkd-subgrid{display:flex;flex-wrap:wrap;gap:18px;padding:4px 0 2px}
.bkd-subgrid .bk{flex:0 0 206px}
.bkd-subgrid .bk-b h3{font-size:16.5px}
.chip.ser{background:#EEF1F6;color:#4E5D78}

/* ── 好书推荐横滑 ───────────────────────────────────────────── */
/* ── 好书推荐（2026-10-04）────────────────────────────── */
#picks{position:relative}
#picks .rail-btn{top:auto;bottom:168px}
.picks-grid{display:flex;gap:18px;overflow-x:auto;padding:6px 22px 12px;margin:0;
  scroll-snap-type:x proximity;scroll-padding-left:22px;scroll-padding-right:22px;
  scrollbar-width:thin;scrollbar-color:#D8D2E4 transparent}
.picks-grid::-webkit-scrollbar{height:8px}
.picks-grid::-webkit-scrollbar-thumb{background:#D8D2E4;border-radius:4px}
.picks-grid::-webkit-scrollbar-track{background:transparent}
.pick-card{flex:0 0 200px;width:200px;scroll-snap-align:start}
.pick-card{display:flex;flex-direction:column;background:var(--card,#fff);border:1px solid var(--line,#E6E6E6);
  border-radius:14px;overflow:hidden;text-decoration:none;color:inherit;transition:transform .18s,box-shadow .18s}
.pick-card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(60,50,90,.10)}
.pick-cv{display:block;height:196px;background:linear-gradient(135deg,#F4F1F8,#ECE7F3);overflow:hidden}
.pick-cv img{width:100%;height:100%;object-fit:cover;display:block}
.pick-tt{padding:12px 14px 4px}
.pick-tt b{display:block;font-size:16px;line-height:1.35;color:var(--ink,#222)}
.pick-src{display:block;margin-top:4px;font-size:12px;color:var(--faint,#999);line-height:1.4}
.pick-ft{display:flex;justify-content:space-between;align-items:baseline;padding:10px 14px 12px}
.pick-ft i{font-style:normal;font-size:12.5px;color:var(--faint,#999)}
.pick-ft em{font-style:normal;font-size:12.5px;color:var(--brand,#B96A7B)}

/* 推荐书单汇总页 lists.html（v2.106）：九榜单多行平铺 */
.lb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(370px,1fr));gap:16px 18px;margin-top:22px}
.lb-card{display:flex;gap:14px;background:var(--card,#fff);border:1px solid var(--line,#E6E6E6);
  border-radius:14px;padding:14px;text-decoration:none;color:inherit;transition:transform .18s,box-shadow .18s}
.lb-card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(60,50,90,.10)}
.lb-cv{flex:0 0 92px;width:92px;height:128px;border-radius:8px;overflow:hidden;
  background:linear-gradient(135deg,#F4F1F8,#ECE7F3)}
.lb-cv img{width:100%;height:100%;object-fit:cover;display:block}
.lb-i{display:flex;flex-direction:column;min-width:0;padding-top:2px}
.lb-i b{font-size:16.5px;line-height:1.35;color:var(--ink,#222)}
.lb-meta{margin-top:5px;font-size:12px;color:var(--faint,#999);line-height:1.5}
.lb-ds{margin-top:7px;font-size:12.5px;line-height:1.7;color:#555;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.lb-go{margin-top:auto;padding-top:8px;font-style:normal;font-size:12.5px;color:var(--brand,#B96A7B)}

/* 书单详情页 */
.pg-list .pg-t{margin-bottom:6px}
.rkl-meta{margin:0 0 12px;font-size:13px;color:var(--faint,#999)}
.rkl-intro{margin:0 0 8px;max-width:760px;font-size:14.5px;line-height:1.8;color:#444}
.rkl-note{margin:0 0 26px;max-width:760px;font-size:12.5px;line-height:1.7;color:var(--faint,#999)}
.rkl{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px 24px}
.rk{display:flex;align-items:flex-start;gap:14px;padding:12px;border:1px solid var(--line,#E6E6E6);
  border-radius:12px;background:var(--card,#fff);cursor:default}

.rk-n{flex:0 0 30px;font-family:Georgia,serif;font-size:24px;color:var(--faint,#C9C2D6);text-align:center}
.rk-cv{flex:0 0 74px;width:74px;height:104px;border-radius:6px;overflow:hidden;background:#F4F1F8;
  box-shadow:0 2px 8px rgba(40,30,60,.14)}
.rk-cv img,.rk-cv svg{width:100%;height:100%;object-fit:cover;display:block}
.rk-i{min-width:0}
.rk-b{display:block;margin-top:7px;font-size:12.5px;line-height:1.75;color:#5A5A5A}
.rk-i b{display:block;font-size:14.5px;line-height:1.45;color:var(--ink,#222)}
.rk-a{display:block;margin-top:6px;font-size:12.5px;color:var(--faint,#999)}


/* ── 轻阅读 · 一天一篇（2026-10-05）────────────────────────── */
/* v2b+ 用户令：左右按钮相对高度与“不知道读什么”保持一致——
   同样锚定模块底边（bottom:168px），不再用默认的 top:50%（模块越高按钮越飘高） */
#shorts .rail-btn{top:auto;bottom:168px}
#shorts:hover .rail-btn,#shorts:focus-within .rail-btn{opacity:.62;visibility:visible}
.shorts-grid{display:flex;gap:20px;overflow-x:auto;padding:6px 22px 14px;margin:0;
  scroll-snap-type:x mandatory;scrollbar-width:thin}
.shorts-grid::-webkit-scrollbar{height:8px}
.shorts-grid::-webkit-scrollbar-thumb{background:var(--lav);border-radius:99px}
.short-card{flex:0 0 172px;scroll-snap-align:start;text-decoration:none;color:inherit;
  display:flex;flex-direction:column;gap:0 8px}
.short-card .sh-cv{display:block;position:relative;border-radius:var(--r-m);overflow:hidden;
  border:1px solid var(--line);box-shadow:var(--sh-s);transition:transform .18s,box-shadow .18s}
.short-card:hover .sh-cv{transform:translateY(-4px);box-shadow:var(--sh-m)}
.short-card .sh-cv img{display:block;width:100%;aspect-ratio:2/3;object-fit:cover}
/* v2.124 白底雪山封面：悬停淡入清晰版（<id>_h.png） */
.sh-cv img.cv-h{position:absolute;inset:0;height:100%;opacity:0;transition:opacity .3s}
.short-card:hover .cv-h{opacity:1}
.short-card b{margin-top:10px;font-size:14px;line-height:1.45;color:var(--ink-2);
  font-family:var(--serif);font-weight:700;letter-spacing:.01em}
.short-card .sh-a{font-size:11.5px;color:var(--muted);margin-top:2px}
.short-card .sh-w{font-size:11.5px;color:var(--faint);margin-top:2px}

/* 轻阅读集合页（公告式文字列表 · 全部左对齐） */
.pg .sh-list{margin:24px 0 0;border-top:2px solid var(--ink-2)}
.pg .sh-row{display:flex;align-items:center;gap:18px;padding:15px 8px;text-decoration:none;
  border-bottom:1px solid var(--line-2);transition:background .15s;text-align:left}
.pg .sh-row:hover{background:var(--bg-warm)}
.pg .sh-l{flex:1;min-width:0;display:block}
.pg .sh-tt{display:block;font-size:19px;font-weight:700;font-family:var(--serif);
  color:var(--ink-2);line-height:1.6;letter-spacing:.01em}
.pg .sh-tt i{font-style:normal;font-family:var(--serif);font-weight:500;color:var(--muted);font-size:13.5px;margin-left:8px}
.pg .sh-tt .sh-by{display:inline;margin-left:9px;font-size:12.5px;font-weight:500;color:var(--muted);
  font-family:var(--serif);letter-spacing:.03em}
.pg .sh-row:hover .sh-tt .sh-by{color:var(--muted)}
.pg .sh-row:hover .sh-tt{color:var(--brand)}
.pg .sh-meta{display:block;font-size:12px;color:var(--brand-d);margin-top:3px;letter-spacing:.02em}
.pg .sh-ds{display:block;font-size:13px;color:var(--ink-2);opacity:.78;margin-top:4px;line-height:1.7}
.pg .sh-go{flex:none;color:var(--faint);font-size:18px}

/* ── 首页横滚尾卡“打开书架”（2026-10-05 v2.112；v2.113 书架底纹）── */
.bk.bk-more{justify-content:center;min-height:340px;background:var(--bg-warm);
  border:1.5px dashed var(--line-3, #d8d2c8)}
.bk-more-in{display:flex;flex-direction:column;align-items:center;gap:10px;
  width:100%;text-align:center;padding:0 18px}
.bk-more-in b{font-size:16.5px;letter-spacing:.14em;color:var(--brand-d)}
.bk-more-in span{font-size:12.5px;color:var(--muted)}
.bk.bk-more:hover{border-color:var(--brand);box-shadow:var(--sh-s)}
.bk.bk-more:hover b{color:var(--brand)}
.short-card.sh-more .sh-more-cv,
.short-card .sh-more-cv{display:flex;align-items:center;justify-content:center;
  width:100%;aspect-ratio:2/3;background:var(--bg-warm);border:1.5px dashed var(--line-3, #d8d2c8);
  border-radius:var(--r-m)}
.sh-more-cv b{margin:0;font-size:15px;letter-spacing:.14em;color:var(--brand-d)}
.short-card.sh-more:hover .sh-more-cv{transform:translateY(-4px);border-color:var(--brand);
  box-shadow:var(--sh-s)}
.short-card.sh-more:hover b{color:var(--brand)}
/* v2.113：极浅书架线稿底纹（若隐若现），悬停加深 */
.bk-more,.sh-more-cv{position:relative}
.bk-more::before,.sh-more-cv::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 168'%3E%3Cg fill='none' stroke='%238B8199' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 58h96M12 108h96M12 158h96'/%3E%3Cpath d='M20 58V28h9v30M31 58V22h10v36M43 58V32h9v26M56 58V26h8v32M68 58V36h10v22'/%3E%3Cpath d='M84 58l9-27 8 2-9 28'/%3E%3Cpath d='M22 108V80h8v28M32 108V74h10v34M44 108V84h9v24M60 108V78h9v30'/%3E%3Cpath d='M78 108l-3-26 9-1 4 27'/%3E%3Cpath d='M26 158v-22h30v22M62 158v-24h34v24'/%3E%3C/g%3E%3C/svg%3E") center 42%/74% no-repeat;
  opacity:.13;transition:opacity .22s ease}
.bk.bk-more:hover::before,.short-card.sh-more:hover .sh-more-cv::before{opacity:.38}
.bk-more-in,.sh-more-cv b{position:relative;z-index:1}

/* ── 轻阅读短篇阅读页：单章无目录，正文拉宽（2026-10-05 v2.112）── */
.solo-read .toc{display:none}
.solo-read .rd{grid-template-columns:minmax(0,1fr);max-width:1080px}
.solo-read #tocBtn{display:none}

/* ── 轻阅读集合页 v2.112：通栏靠左 + 词数难度并入标题行 + 分页 ── */
.pg.pg-sh{max-width:var(--maxw);padding-top:30px}
.pg .sh-tt .sh-meta{display:inline;margin-left:12px;font-size:12.5px;font-weight:500;
  letter-spacing:.02em;white-space:nowrap;vertical-align:1px}
.pg .sh-row{align-items:flex-start}
.pg .sh-go{padding-top:14px}
.sh-pager{display:flex;align-items:center;gap:18px;margin-top:28px}
.sh-pg-a{display:inline-flex;align-items:center;padding:8px 18px;border:1px solid var(--line-2);
  border-radius:99px;font-size:13px;color:var(--ink-2);text-decoration:none;transition:.15s}
.sh-pg-a:hover{border-color:var(--brand);color:var(--brand)}
.sh-pg-n{font-size:12.5px;color:var(--faint);letter-spacing:.06em}

/* 大屏（>1300）恢复轮播负边距铺满效果；≤1300 由上方媒体查询置 0（2026-10-12 溢出修复） */
@media (min-width:1301px){
  .rail{margin:0 -22px}
  .picks-grid{margin:0 -22px}
  .shorts-grid{margin:0 -22px}
}

/* ══════════════════════════════════════════════════════════
   2026-10-12 方案A：手机端“半屏双卡”（仅 ≤720px 生效，桌面端零改动）
   ① 书目页骨架防撑破：.bks-wrap 单列改 minmax(0,1fr)，杜绝
      .lv-track 固定 300px 列 × N 本把最小内容宽撑到 1600px+，
      导致布局视口被扩、手机端媒体查询全部失效、整页缩小拥挤。
   ② 首页三条书架（经典书目/推荐书单/轻阅读）改成精确半屏双卡
      （(100%-12px)/2），滑动一次正好翻过 2 张，不再露半张卡。
   ③ 书卡文字层级同步降一级，卡间距 22px→12px。
   ══════════════════════════════════════════════════════════ */
@media (max-width:720px){
  /* ① 书目页骨架防撑破 */
  .bks-wrap{grid-template-columns:minmax(0,1fr);gap:16px}
  .bks-main{min-width:0}
  .bks-nav{position:static;margin-top:2px}
  .lv-sec,.lv-strip{min-width:0}
  .lv-track{grid-auto-columns:280px}   /* 覆盖 ≤700px 的 minmax(260px,1fr)：固定列宽不再被 max-content 撑爆 */

  /* ② 首页书架：半屏双卡 */
  .rail{gap:12px;padding:6px 14px 20px}
  .rail .bk{flex:0 0 calc((100% - 12px)/2)}

  /* ③ 书卡内容降级（只作用于首页竖卡书架） */
  .rail .bk-b{padding:11px 12px 13px;gap:6px}
  .rail .bk-b h3{font-size:15px}
  .rail .bk-b .en{font-size:11px;letter-spacing:.2px}
  .rail .bk-b p{font-size:12px;line-height:1.55}
  .rail .bk-meta{padding-top:7px;font-size:10.5px}
  .rail .bk-badge{top:8px;left:8px}

  /* ④ 书详情页同类推荐：同样半屏双卡 */
  .bkd-subgrid .bk{flex:0 0 calc((100% - 12px)/2)}
}
/* 手机端：sec-h 的“更多…”链接换行，不贴边裁切 */
@media (max-width:720px){
  .sec-h .more{margin-left:0;flex-basis:100%;white-space:normal}
}

/* ══ 支付二维码区（微信支付 Native v3，2026-10-12）════════════════ */
#payBox{text-align:center;padding:4px 0 2px}
#payBox .pay-qr{display:inline-block;padding:10px;border:1px solid var(--line);border-radius:var(--r-m);
  background:#fff;line-height:0;box-shadow:var(--sh-s)}
#payBox .pay-qr svg{width:208px;height:208px;display:block}
#payBox .pay-amt{margin:12px 0 4px;font-size:15px;color:var(--ink-2)}
#payBox .pay-amt b{color:var(--brand);font-size:19px;margin-left:2px}
#payBox .pay-tip{margin:0 auto 10px;max-width:330px;font-size:12.5px;color:var(--muted);line-height:1.75}
#payBox .pay-st{font-size:13px;color:var(--muted);margin:4px 0 2px}
#payBox .sheet-act{margin-top:10px}

/* 登录弹层：回车提交提示（2026-10-13） */

/* 会员后台支付弹层（与站点弹层同构，2026-10-13） */
.cs-pay-qr{text-align:center;line-height:0;margin:2px 0 12px}
.cs-pay-qr svg{width:200px;height:200px;padding:10px;background:#fff;
  border:1px solid var(--line);border-radius:10px;box-sizing:content-box;box-shadow:var(--sh-s)}
.cs-pay-amt{margin:0 0 4px;font-size:15px;color:var(--ink-2);text-align:center}
.cs-pay-amt b{color:var(--brand);font-size:19px;margin-left:2px}
.cs-pay-tip{margin:0 auto 10px;max-width:330px;font-size:12.5px;color:var(--muted);line-height:1.75;text-align:center}
.cs-pay-st{font-size:13px;color:var(--muted);margin:4px 0 2px;text-align:center}

/* ══════════════════════════════════════════════════════════
   2026-10-12 深夜批次（全部仅 ≤720px 生效，桌面端零改动）
   ① 手机端全局左右留白 18px：根因是 .sec{padding:46px 0} 的
      padding 简写把 .wrap 的 padding:0 22px 覆盖成了左右 0——
      桌面因 1240px 定宽居中掩盖了这一点，手机上内容完全贴边。
      此处用单独的 padding-left/right 声明（在 .sec 之后生效）修复。
   ② 三条横滑书架（经典书目/轻松短篇/好书推荐）与书目页轨道：
      左右留白统一交给 .wrap，内部左右 padding 归零，
      消除 scroll-snap 把首张卡吸附到屏幕最边缘的偏移。
   ③ 首页栏目标题右侧红色小字隐藏（Emily 令，仅首页；
      各栏目入口仍保留在顶部导航与页脚）。
   ④ 进阶阶梯：恢复横滑台阶造型。此前 ≤1180px 的
      flex-wrap:wrap 在手机上未被重置，一行装不下两张 205px
      卡片便逐张换行，呈现为“上下方块”；现改回单行横滑，
      卡片定宽 216px、高度逐级 +20px、底边对齐地面线，
      形成完整的 L1→L6 上升台阶。
   ══════════════════════════════════════════════════════════ */
@media (max-width:720px){
  /* ① 全局左右留白 */
  .wrap{padding-left:18px;padding-right:18px}

  /* ② 横滑容器留白统一 */
  .rail,.shorts-grid,.picks-grid,.lv-track{padding-left:0;padding-right:0}
  .picks-grid{scroll-padding-left:0;scroll-padding-right:0}

  /* ③ 首页栏目红色小字隐藏 */
  body[data-page="home"] .sec-h .more{display:none}

  /* ④ 进阶阶梯：横滑台阶 */
  .lad{flex-wrap:nowrap;overflow-x:auto;padding:2px 0 14px;
    -webkit-overflow-scrolling:touch;
    border-bottom:1px dashed var(--line-2)}
  .lad-s{flex:0 0 216px;min-width:0;width:216px;min-height:150px;
    /* 台阶感来源：底部内边距逐级 +20px（不依赖内容行数，底对齐后顶部自然逐级抬升） */
    padding-bottom:calc(24px + var(--i) * 20px)}
  /* 内容占位统一（手机端）：年级文案与书名行数不一会导致卡高跳变，
     统一最小占位后卡高严格等差 +20px，台阶才均匀 */
  .lad-s .lad-m{min-height:32px}
  .lad-s .lad-b{min-height:57px}
  .lad-s:not(:last-child)::after{right:-19px;bottom:20px}
  .lad-cap{text-align:left;margin-top:10px}
}

/* ══════════════════════════════════════════════════════════
   2026-10-12 深夜批次三（全部仅 ≤720px 生效，桌面端零改动）
   ① 首页理念拱桥（Emily 令）：手机端恢复电脑端“拱桥”造型——
      6 列单行 + 顶部弧线 + 中间高两边低的台阶位移，整体等比缩小。
      描述小字在约 50px 的列宽下会挤成细长条，手机端隐藏
      （六步的名称与中文释义保留，桌面端不受任何影响）。
   ② 页脚四大导航组改横排一行（此前 ≤860px 折成单列纵排）：
      品牌行独立占满整行，关于我们 / 分级阅读 / 原版伴读 / 支持
      四组等分一行，字号同步缩小。
   ══════════════════════════════════════════════════════════ */
@media (max-width:720px){
  /* ① 理念拱桥（限定 .mods，不波及理念页 .brg-lite 等变体） */
  .mods .mod-b{padding:44px 16px 34px}   /* 左右收窄给拱桥留宽度 */
  .mods .brg{margin-top:18px;padding-bottom:10px}
  .mods .brg-arc{display:block;height:36px}
  .mods .brg-st{grid-template-columns:repeat(6,1fr);gap:3px;row-gap:0}
  .mods .brg-i,.mods .brg-i:hover{transform:none}
  .mods .brg-i:nth-child(1),.mods .brg-i:nth-child(6){transform:translateY(13px)}
  .mods .brg-i:nth-child(1):hover,.mods .brg-i:nth-child(6):hover{transform:translateY(10px)}
  .mods .brg-i:nth-child(2),.mods .brg-i:nth-child(5){transform:translateY(5px)}
  .mods .brg-i:nth-child(2):hover,.mods .brg-i:nth-child(5):hover{transform:translateY(3px)}
  .mods .brg-d{width:36px;height:36px;font-size:18px;border-width:2px}
  .mods .brg-en{margin-top:5px;font-size:9.5px;letter-spacing:0}
  .mods .brg-cn{margin-top:1px;font-size:9.5px;letter-spacing:.5px}
  .mods .brg-ds{display:none}

  /* ② 页脚：品牌 / 二维码 / 支持 纵向堆叠 */
  .ft-top{grid-template-columns:1fr;gap:20px;padding-bottom:22px}
  .ft h5{margin-bottom:8px;font-size:11px;letter-spacing:1px}
  .ft p,.ft li{font-size:11px;line-height:1.75}
  .ft-top a{overflow-wrap:break-word}
}

/* ══════════════════════════════════════════════════════════
   2026-10-13 批次四（全部仅 ≤720px 生效，桌面端零改动）
   ① 页脚极简化（Emily 令）：手机端只保留品牌行（工作室名 +
      “十年专业教研，专注原版英语”）与底部版权 & 备案信息，
      四个导航组（关于我们/分级阅读/原版伴读/支持）整组隐藏。
   ② 经典书目左右滑动按钮位置偏低一点（原 top:calc(50% - 46px)
      偏上），并略缩尺寸，减少对书卡的遮挡。
   ③ 阅读理念卡手机端去粉红底：白底 + 黑字 + 发丝线描边，
      弧线/圆标描边/投影同步改深色系；六个圆标的彩色底保留
      （延续 Bridge 六步的渐变识别）。
   ══════════════════════════════════════════════════════════ */
@media (max-width:720px){
  /* ① 页脚极简（2026-10-20 修订：手机端保留品牌行 + 二维码组，
     “支持”列整组隐藏——二维码是新令新增，手机上长按即可识别） */
  .ft-top>div:nth-child(3){display:none}
  .ft-top{grid-template-columns:1fr;padding-bottom:18px}
  .ft-qr{justify-content:center}

  /* ② 书架滑动按钮降低 + 缩小 */
  #shelf .rail-btn{top:calc(50% + 16px);width:42px;height:42px}
  #shelf .rail-btn svg{width:18px;height:18px}

  /* ③ 理念卡白底黑字 */
  .mods .mod-b{background:#fff;color:var(--ink);border:1px solid var(--line);
    box-shadow:var(--sh-s)}
  .mods .mod-b::after{content:none}
  .mods .mod-logo{filter:none}
  .mods .mod-k{color:var(--brand);opacity:1}
  .mods .mod-b h3{color:var(--ink)}
  .mods .mod-b p{color:var(--ink-2);opacity:1}
  .mods .mod-in.wide .mod-sub b{color:var(--ink)}
  .mods .brg-arc path{stroke:rgba(42,35,64,.38)}
  .mods .brg-d{border-color:rgba(0,0,0,.14);
    box-shadow:0 4px 12px rgba(70,25,45,.16),inset 0 0 0 1px rgba(255,255,255,.25)}
  .mods .brg-en,.mods .brg-cn{color:var(--ink)}
}


/* ══════════════════════════════════════════════════════════
   2026-10-13 批次五（全部仅 ≤720px 生效，桌面端零改动）
   ① 分级指引两段式点击：手机端默认收起试读面板，首次点击
      等级卡才展开（.lad-demo.show），便于“先看测试文本 →
      再点一次进入该级别”；同时把面板设为 sticky 置底，
      避免出现在页面下方看不见。
   ② 经典阅读书卡精简：去掉封面上“在架 · 全文可读”徽标；
      图片下方不再重复中英文书名与作者（省两行，卡更短），
      简介直接接在封面之下。
   ③ 阅读页：封面右侧的书目信息去掉灰底框、直接排文字；
      简介与导读字号行距略缩；目录右侧灰色说明文字隐藏。
   ④ 手机端阅读理念只在首页：所有分页（.brg-page）整段隐藏。
   ══════════════════════════════════════════════════════════ */
@media (max-width:720px){
  /* ① 分级指引：两段式点击 + 试读面板置底 */
  .lad-demo{display:none}
  .lad-demo.show{display:block;position:sticky;bottom:8px;z-index:8;
    max-height:52vh;overflow:auto;-webkit-overflow-scrolling:touch;
    box-shadow:var(--sh-l,0 10px 30px rgba(0,0,0,.14))}
  .lad-demo-tx{font-size:14.5px;line-height:1.85}
  .lad-demo-t{font-size:14px}

  /* ② 经典阅读书卡精简 */
  .rail .bk-badge,.bk-badge{display:none}
  .rail .bk-b h3,.rail .bk-b .en{display:none}
  .rail .bk-b{padding-top:12px}
  .rail .bk-b p{margin-top:0}

  /* ③ 书详情页：信息行去灰框直接排文字 + 简介/导读字号行距略缩 + 目录说明字隐藏 */
  .bkd-facts{background:none;border:0;box-shadow:none;padding:0;margin-top:12px}
  .bkd-facts dt{color:var(--muted)}
  /* .pg p 特异性(0,1,1) 高于 .bkd-intro(0,1,0)，须用 p.bkd-xxx 覆盖 */
  p.bkd-intro{font-size:13.5px;line-height:1.75}
  p.bkd-why{font-size:13px;line-height:1.72}
  .bkd-sec{font-size:13.5px;margin-top:16px}
  .bkd-toc h3 span{display:none}
  /* 阅读页目录（正文侧栏）：右侧灰色说明文字隐藏 */
  .toc a .cn,.toc-cn,.toc-se-n{display:none}

  /* ④ 分页不显示阅读理念 */
  .brg-page{display:none}
}

/* ══════════════════════════════════════════════════════════
   2026-10-13 批次六（全部仅 ≤720px 生效，桌面端零改动）
   ① 阶梯图上方灰色说明小字（#levels .sec-sub）删除 —— 上一版
      误理解为删栏目标题（.sec-h），实为删标题下方的 .sec-sub；
      阶梯卡内“年级对标”（.lad-m）保留不动。
   ② 页脚底部版权行 / 备案行字号与行距再缩小（手机端）。
   ③ 隐藏全部左右滑动按钮（rail-btn）：手机端用手指横滑即可，
      常驻按钮遮挡书卡，全站（首页三书架 + 榜单 + 全部书目页）隐藏。
   ══════════════════════════════════════════════════════════ */
@media (max-width:720px){
  /* ① 阶梯图上方灰色说明小字（本期已在源文件删除；此处兜底隐藏） */
  #levels>.sec-sub{display:none}

  /* ② 页脚版权 & 备案：字号、行距再缩一档 */
  .ft-btm{margin-top:14px;gap:10px;font-size:10px;line-height:1.55}
  .ft-btm .ga{gap:4px}
  .ft-btm .ga img{width:12px;height:12px}
  .ft-icp{margin-top:8px;gap:10px;font-size:10px;line-height:1.55}
  .disc{margin-top:16px;padding:14px 14px;font-size:11px;line-height:1.8}

  /* ③ 左右滑动按钮：手机端全部隐藏（横滑手势替代） */
  .rail-btn,.lv-strip>.rail-btn{display:none !important}
}

/* ═══════════════════════════════════════════════════════════════
   移动端简化（2026-10-20 用户令：手机端视觉进一步简化、删多余文字）
   纪律：只追加本块，不改任何存量行；全部规则包在媒体查询内，
   桌面（>720px）不命中，视觉零变化。新增 DOM（安装引导等）默认隐藏。
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){

  /* 0) 安全带：任何元素都不得把页面撑出横向滚动 */
  html,body{max-width:100%;overflow-x:hidden}

  /* 1) 顶栏收紧：护眼按钮收成图标，注册按钮小号，间距减半 */
  .hdr-in{padding:0 12px;gap:8px}
  .hdr .wordmark-img{height:20px;margin-right:0}
  .btn-eye{width:38px;min-width:38px;height:38px;padding:0;font-size:0;justify-content:center}
  .btn-eye span{display:none}
  .btn-eye::before{content:"◐";font-size:17px;line-height:1}
  .hdr-act{gap:6px}
  .hdr-act .btn{padding:8px 13px;font-size:13px}

  /* 2) 首页 hero：图不霸屏，先给标题；lead 只留主句（.m-x 由 JS/CSS 隐藏） */
  .hero-in{padding:26px 16px 26px;gap:14px}
  .hero-art{order:0;max-width:240px;margin:0 auto}
  body[data-page="home"] .hero-art img{max-height:250px;width:auto;margin:0 auto}
  body[data-page="home"] .hero-art::before{display:none}
  .hero .lead{font-size:14.5px;line-height:1.75;margin-top:12px}
  .m-x{display:none}
  .hero-cta{gap:9px;flex-wrap:wrap}
  .hero-cta .btn{padding:12px 18px;font-size:14px}
  .hero-stat{gap:18px}

  /* 3) 阅读页工具条：按钮变短变小（文案由 JS 按断点互换，桌面不变） */
  .bar{gap:6px;flex-wrap:wrap}
  .bar .tg{padding:8px 10px;font-size:12.5px}

  /* 4) 思考题：默认折叠，点标题展开（桌面恒展开，不受影响） */
  .qbox{padding:13px 15px}
  .qbox .qh{cursor:pointer;position:relative;padding-right:52px}
  .qbox .qh::after{content:"展开 ▾";position:absolute;right:0;top:50%;
    transform:translateY(-50%);font-size:11.5px;color:var(--brand);letter-spacing:0}
  .qbox.open .qh::after{content:"收起 ▴"}
  .qbox ol{display:none;margin-top:10px}
  .qbox.open ol{display:block}

  /* 5) 段落卡：留白收紧，仍然保留呼吸感 */
  .para{padding:12px 13px 12px 44px;margin-bottom:8px;border-radius:12px}
  .para .num{left:9px;top:12px;width:22px;height:22px;font-size:10.5px;border-radius:7px}
  .para .play{left:8px;top:40px;width:30px;height:30px}
  .para .spk{font-size:11px;padding:3px 9px}

  /* 6) 底部播放条：去副行、贴安全区；悬浮球不压播放条 */
  .pl-in{padding:8px 12px;gap:10px}
  .pl .s{display:none}
  .pl-info .t{font-size:12.5px}
  .pl{padding-bottom:env(safe-area-inset-bottom)}
  .fab{right:12px;bottom:96px}

  /* 7) 阅读目录（手机上排在正文后）：间距收紧 */
  .toc{padding:14px 12px}
  .rd{padding:16px 14px 120px;gap:20px}
}

/* ── PWA 安装入口（全局类，仅由 JS 在移动端触发；桌面永不显形）──── */
.mri-chip{position:fixed;left:14px;bottom:96px;z-index:120;display:inline-flex;align-items:center;
  gap:6px;padding:10px 14px;border-radius:999px;border:1px solid var(--line-2);
  background:#fff;color:var(--brand-d);font-size:13px;box-shadow:0 8px 22px rgba(60,40,90,.14)}
.mri-chip::before{content:"⤓";font-size:15px}
.mri-wx{position:fixed;top:0;left:0;right:0;z-index:130;display:flex;align-items:center;gap:8px;
  padding:9px 14px;background:#3C3489;color:#fff;font-size:12.5px}
.mri-wx b{color:#F2E4A8}
.mri-wx-x{margin-left:auto;background:none;border:0;color:#fff;font-size:16px;padding:2px 6px}
.mri-guide{position:fixed;inset:0;z-index:140}
.mri-mask{position:absolute;inset:0;background:rgba(30,22,48,.42)}
.mri-card{position:absolute;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));
  background:#fff;border-radius:16px;padding:20px 18px 16px;box-shadow:0 18px 50px rgba(30,22,48,.25)}
.mri-card>b{font-size:16px;color:var(--ink)}
.mri-card ol{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px}
.mri-card li{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ink-2)}
.mri-card li i{font-style:normal;width:22px;height:22px;border-radius:50%;background:var(--brand-l);
  color:var(--brand-d);display:grid;place-items:center;font-size:12px;flex:none}
.mri-card p{margin:12px 0 0;font-size:12px;color:var(--muted)}
.mri-x{position:absolute;right:10px;top:10px;width:30px;height:30px;border:0;background:none;
  color:var(--muted);font-size:18px}
.mri-guide[hidden],.mri-chip[hidden],.mri-wx[hidden]{display:none}

/* 手机端专属 hero 副标题：桌面恒隐藏，只在 ≤720px 显形 */
.hero-sub-m{display:none}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第二轮（2026-10-20 用户令）
   ① 首页 hero：删顶部英文行，副标题落到标题下，小男孩缩成右侧背景
   ② 使用说明面板：整体收紧，减少折行
   ③ 首页栏目可折叠，默认只展开【经典书目】【轻松短篇】
   纪律不变：本块全部包在 (max-width:720px) 内，桌面不命中。
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){

  /* ① hero ------------------------------------------------ */
  body[data-page="home"] .hero-in{position:relative;padding:20px 16px 24px}
  .hero-tag{display:none}
  .hero-sub-m{display:block;margin:8px 0 0;font-size:11.5px;line-height:1.4;
    letter-spacing:2.2px;color:var(--brand);text-transform:uppercase}
  body[data-page="home"] .hero-in > div:first-child{position:relative;z-index:1}
  body[data-page="home"] .hero h1{margin-top:0;font-size:32px}
  body[data-page="home"] .hero .lead{margin-top:22px;max-width:none}
  body[data-page="home"] .hero-art{position:absolute;top:-6px;right:-6px;
    width:104px;max-width:none;margin:0;pointer-events:none;z-index:0;opacity:.92}
  body[data-page="home"] .hero-art img{width:100%;height:auto;max-height:none;
    margin:0;display:block;filter:saturate(.95)}
  body[data-page="home"] .hero-art::before{display:none}

  /* ② 使用说明面板收紧 ------------------------------------ */
  .sheet-guide .sheet-c{padding:20px 15px 16px;border-radius:16px}
  .sheet-guide .sheet-c > h3{font-size:16px;margin:0 0 8px}
  .gd-lead{font-size:12px;line-height:1.55;margin:0 0 10px;font-weight:400;color:var(--muted)}
  .gd-step{gap:9px;padding:7px 9px;margin:7px 0;border-radius:10px}
  .gd-step svg{width:38px;height:28px}
  .gd-step p{font-size:12px;line-height:1.6}
  .gd-sec{margin-top:13px}
  .gd-sec h4{font-size:12px;line-height:1.55;margin:0 0 7px}
  .gd-b{gap:8px;padding:7px 9px;margin:0 0 6px;border-radius:9px}
  .gd-b p{font-size:11.5px;line-height:1.55}
  .gd-b b{font-size:12px}
  .gd-l{font-size:11px;width:20px;height:20px;flex:none}
  .gd-more li{font-size:11.5px;line-height:1.6;padding:0 0 6px 18px}
  .sheet-guide .sheet-act{margin-top:14px}

  /* ③ 首页栏目折叠（高度动画由 site.js 驱动：m-anim 期间 overflow 裁切） */
  body[data-page="home"] .sec{margin-top:6px;padding-top:16px}
  body[data-page="home"] .sec.m-anim{overflow:hidden;
    transition:height .3s cubic-bezier(.4,0,.2,1)}
  body[data-page="home"] .sec > .sec-h{cursor:pointer;padding-right:64px;
    position:relative;-webkit-tap-highlight-color:transparent}
  body[data-page="home"] .sec > .sec-h::after{content:"展开 ▾";position:absolute;
    right:0;top:20px;transform:translateY(-50%);
    display:inline-flex;align-items:center;justify-content:center;text-align:center;
    min-width:54px;padding:6px 9px;font-size:11px;line-height:1;letter-spacing:0;
    color:#8E8899;background:#fff;border:1px solid var(--line-2);border-radius:999px}
  body[data-page="home"] .sec.m-open > .sec-h::after{content:"收起 ▴"}
  body[data-page="home"] .sec > .sec-h .more{font-size:11.5px}
}

/* 移动端 · 折叠态再收紧（标题字号统一到最长标题不折行） */
@media (max-width:720px){
  body[data-page="home"] .sec > .sec-h{gap:1px 8px;padding:9px 2px;
    align-items:baseline;margin-bottom:24px}
  body[data-page="home"] .sec > .sec-h h2{font-size:17px;line-height:1.3}
  body[data-page="home"] .sec > .sec-h h2::before{margin-right:8px;width:6px;height:6px;
    vertical-align:1px}
  body[data-page="home"] .sec > .sec-h .en{line-height:1.25;letter-spacing:2.2px}
  body[data-page="home"] .sec.m-closed{padding-top:12px !important;padding-bottom:0;
    margin-top:12px}
  /* 收起动画播完后隐藏正文（防 1-2px 溢出残影），展开时立即恢复 */
  body[data-page="home"] .sec.m-done > *:not(.sec-h){visibility:hidden}
  body[data-page="home"] .sec.m-closed > .sec-h{margin-bottom:0;border-bottom-color:transparent}
  body[data-page="home"] .sec.m-closed .sec-h .more{display:none}
  /* 经典书目 / 轻松短篇：不提供收起，标题行不可点、无按钮 */
  body[data-page="home"] .sec.no-fold > .sec-h{cursor:default;padding-right:2px}
  body[data-page="home"] .sec.no-fold > .sec-h::after{display:none}
}

/* 移动端 · hero 微调：小男孩完全露出、居中在标题右侧空白，顶部留白加大 */
@media (max-width:720px){
  body[data-page="home"] .hero-in{padding:34px 16px 26px}
  body[data-page="home"] .hero-in > div:first-child{padding-top:18px}
  body[data-page="home"] .hero-sub-m{margin-top:6px}
  body[data-page="home"] .hero .lead{margin-top:40px}
  body[data-page="home"] .hero-art{top:0;right:64px;width:96px}
  body[data-page="home"] .hero-art img{width:100%;height:auto}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第四轮（2026-10-20 用户令 8 条）
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){

  /* 1) 标题“阅读”下方的红色高亮条（视觉上像阴影）——手机端去掉 */
  .hero h1 em::after{display:none}

  /* 2) 首屏留白加大：小男孩头顶更多空气，且首屏不露出下一个栏目标题 */
  body[data-page="home"] .hero-in{--hpad:118px;padding:var(--hpad) 16px 142px}
  body[data-page="home"] .hero-art{top:var(--hpad)}
  body[data-page="home"] .hero .lead{margin-top:54px}
  body[data-page="home"] .hero-cta{margin-top:46px}
  body[data-page="home"] .hero-stat{margin-top:72px;padding-top:38px}

  /* 3) 轻松短篇导语：保留换行，“那么 ——”收在上一行行尾（第十轮用户令回调） */

  /* 4) 展开提示改成纯三角图标（不再显示中文） */
  body[data-page="home"] .sec > .sec-h::after{content:"";right:8px;top:50%;
    width:0;height:0;min-width:0;padding:0;background:none;border:0;border-radius:0;
    border-left:5px solid transparent;border-right:5px solid transparent;
    border-top:6px solid #A9A3B5;transform:translateY(-50%);transition:transform .25s}
  body[data-page="home"] .sec.m-open > .sec-h::after{content:"";
    transform:translateY(-50%) rotate(180deg)}

  /* 5) 英文副题折到第二行时，与上方中文左对齐（.m-wrap 由 JS 判定） */
  body[data-page="home"] .sec > .sec-h .en.m-wrap{margin-left:14px}

  /* 6) 顶部统计数字：三列等宽，间距均匀 */
  body[data-page="home"] .hero-stat{display:grid;grid-template-columns:repeat(3,1fr);
    gap:16px 10px;align-items:start}
  body[data-page="home"] .hero-stat div b{font-size:21px;line-height:1.25}

  /* 7) 轻松短篇书卡缩小 */
  body[data-page="home"] .short-card{flex:0 0 132px}
  body[data-page="home"] .short-card b{font-size:12.5px;line-height:1.4}
  body[data-page="home"] .short-card .sh-a,
  body[data-page="home"] .short-card .sh-w{font-size:10.5px}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第五轮（2026-10-20 用户令 5 条）
   ① 标题与副标题放大、小男孩图放大
   ② 统计数字下方留白收窄
   ③ 首页二维码手机端隐藏（横排三图在窄屏会被压变形）
   ④ 阶梯方块缩小到“一屏两格”，内部字号不缩
   ⑤ 全部书目页：L1–L6 改左侧悬浮可展开侧边栏；级别标题一行放完；
      底部难度等级（分级指引）手机端隐藏
   纪律不变：全部包在 (max-width:720px) 内，桌面不命中。
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){

  /* ① 标题区放大 ------------------------------------------------ */
  body[data-page="home"] .hero h1{font-size:36px}
  body[data-page="home"] .hero-sub-m{font-size:13px;letter-spacing:2.6px;margin-top:8px}
  body[data-page="home"] .hero-art{width:126px;right:46px;top:calc(var(--hpad) + 2px)}
  body[data-page="home"] .hero .lead{margin-top:76px}

  /* ② 统计数字下方留白收窄 -------------------------------------- */
  body[data-page="home"] .hero-in{padding-bottom:104px;--hpad:112px}
  body[data-page="home"] .hero-stat{margin-top:56px;padding-top:30px}

  /* ③ 页脚二维码手机端不展示 ------------------------------------ */
  .ft-qr{display:none !important}

  /* ④ 阶梯方块：一屏两格 ---------------------------------------- */
  .lad{gap:14px;padding:2px 0 12px}
  .lad-s{flex:0 0 168px;width:168px;min-height:126px;
    padding:14px 12px calc(14px + var(--i) * 14px);border-radius:12px}
  .lad-t{gap:5px}
  .lad-m{white-space:normal;line-height:1.45;min-height:32px}
  .lad-b{margin-top:8px;min-height:57px}
  .lad-s:not(:last-child)::after{right:-9px;bottom:16px;font-size:13px}

  /* ⑤ 全部书目页 ------------------------------------------------ */
  .pg-books .bks-wrap{gap:10px;margin-top:6px}
  .pg-books .lv-sec{margin-bottom:26px}
  .pg-books .lv-sec h3{font-size:14px;display:flex;align-items:baseline;
    gap:7px;white-space:nowrap;margin-bottom:5px}
  .pg-books .lv-sec h3 span{font-size:10px;margin-left:0;flex:1;min-width:0;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .pg-books .lv-sec .lv-sub{font-size:12px;line-height:1.65;margin-bottom:10px}
  body[data-page="static"] #levels{display:none !important}

  /* 悬浮侧边栏（.m-bks 由 JS 加上；未加时保持原横排，JS 失效也不会坏） */
  .bks-nav.m-bks{position:fixed;left:0;top:50%;transform:translateY(-50%);
    z-index:108;display:flex;flex-direction:column;gap:2px;
    width:34px;max-height:74vh;overflow:hidden;padding:6px;margin:0;
    background:rgba(255,255,255,.96);backdrop-filter:blur(8px);
    border:1px solid var(--line);border-left:0;border-radius:0 14px 14px 0;
    box-shadow:0 10px 30px rgba(50,36,74,.14);
    transition:width .26s cubic-bezier(.4,0,.2,1),padding .26s}
  .bks-nav.m-bks.open{width:min(192px,58vw);padding:8px;overflow-y:auto}
  .bks-nav.m-bks a{display:none;font-size:12.5px;padding:8px 9px;gap:6px;
    white-space:nowrap;opacity:0;transition:opacity .18s}
  .bks-nav.m-bks.open a{display:flex;opacity:1}
  .bks-nav.m-bks a i{font-size:10.5px}
  .bks-nav.m-bks .bks-toggle{display:flex;align-items:center;justify-content:center;
    gap:4px;width:100%;height:30px;border:0;background:none;color:var(--brand-d);
    font-size:12px;letter-spacing:.5px;padding:0;flex:none;cursor:pointer}
  .bks-nav.m-bks.open .bks-toggle{justify-content:flex-end;padding-right:4px}
  .bks-nav.m-bks:not(.open) .bks-toggle{flex-direction:column;height:auto;gap:2px;
    writing-mode:vertical-rl;text-orientation:mixed;letter-spacing:2px;padding:6px 0}
  .bks-nav.m-bks .bks-toggle svg{flex:none}
  .bks-nav.m-bks.open .bks-toggle svg{transform:rotate(180deg)}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第六轮（2026-10-20 用户令 6 条）
   ① 小男孩再放大，只做背景不挤文字（上移到标题右侧，压在文字下层）
   ② 统计下方留白再收：分割线落进首屏，一滑即见经典书目
   ③ 栏目间距收紧
   ④ 页脚版权声明 10px（同备案信息），且仅首页显示
   ⑤ 全部书目侧边栏起始位置对齐 ALL BOOKS
   ⑥ 全部书目书卡统一为 L2 卡尺寸
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){

  /* ① 男孩图：放大 + 上移，纯背景 */
  body[data-page="home"] .hero-art{width:152px;right:4px;top:calc(var(--hpad) - 46px);opacity:.96}

  /* ② 统计数字下方留白 */
  body[data-page="home"] .hero-in{padding-bottom:54px}

  /* ③ 栏目之间的空白 */
  body[data-page="home"] .sec{margin-top:0;padding-top:12px}
  body[data-page="home"] .sec.m-closed{padding-top:10px;padding-bottom:8px}

  /* ④ 页脚版权声明：与备案信息同字号，且只在首页出现 */
  .ft .disc{font-size:10px;line-height:1.75;margin-top:12px;padding:12px 13px}
  .ft .disc b{font-size:10px}
  body:not([data-page="home"]) .ft .disc{display:none}

  /* ⑤ 侧边栏纵向起点由 JS 按 ALL BOOKS 位置设定（top 已写在行内） */
  .bks-nav.m-bks{transform:none;top:120px}

  /* ⑥ 书卡统一为 L2 尺寸（135px） */
  .pg-books .lv-track .bk{height:135px;overflow:hidden}
  .pg-books .lv-track .bk-b p{display:-webkit-box;-webkit-line-clamp:2;
    -webkit-box-orient:vertical;overflow:hidden}
  .pg-books .lv-track .bk-meta .ser{display:none}
  .pg-books .lv-track .bk-meta{padding-top:6px;gap:6px;flex-wrap:nowrap;overflow:hidden}
  .pg-books .lv-track .bk-meta span{white-space:nowrap;flex:none}
  .pg-books .lv-track .bk-meta span:last-child{flex:1;min-width:0;overflow:hidden;
    text-overflow:ellipsis}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第七轮（2026-10-20 用户令 8 条）
   ① 首页两个按钮上下空白收紧
   ② 计数数字距上方分割线的空白收紧
   ③ “人人都能读原版”与“奇迹阅读”居中对齐（测宽逻辑在 site.js）
   ④ 主标题字号进一步放大
   ⑤ “轻松短篇”上方留白收紧（经典书目栏目底部 padding）
   ⑥ 底部版权免责字号进一步缩小
   ⑦ 全部书目侧边栏“级别”把手整体上移，与 ALL BOOKS 行垂直居中（site.js）
   ⑧ 全部书目书卡：不显示黑字梗概、灰字缩小字号、修复显示不全（不放大书卡）
   纪律不变：全部包在 (max-width:720px) 内，桌面不命中。
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){

  /* ①② hero 留白收紧 -------------------------------------------- */
  body[data-page="home"] .hero-cta{margin-top:24px}
  body[data-page="home"] .hero-stat{margin-top:30px;padding-top:14px}
  body[data-page="home"] .hero-stat div b{font-size:20px}

  /* ④ 主标题再放大；③ 副标题宽度与居中由 site.js 实测标题宽后设定 */
  body[data-page="home"] .hero h1{font-size:40px}
  body[data-page="home"] .hero-sub-m{font-size:12.5px;letter-spacing:3px;margin-top:9px}

  /* ⑤ 首页栏目底部留白（轻松短篇上方的空白来源） ------------------ */
  body[data-page="home"] .sec{padding-bottom:8px}
  body[data-page="home"] .sec.m-closed{padding-bottom:4px}

  /* ⑥ 页脚版权免责进一步缩小 ------------------------------------ */
  .ft .disc{font-size:9px;line-height:1.7;margin-top:10px;padding:10px 12px}
  .ft .disc b{font-size:9px}

  /* ⑧ 书目页书卡：藏黑字梗概、灰字缩字号、允许英文两行、meta 换行不截断 */
  .pg-books .lv-track .bk-b p{display:none}
  .pg-books .lv-track .bk-b{gap:5px;padding:11px 13px}
  .pg-books .lv-track .bk-b h3{font-size:15px}
  .pg-books .lv-track .bk-b .en{font-size:10.5px;line-height:1.45;margin-top:0;
    -webkit-line-clamp:2}
  .pg-books .lv-track .bk-meta{flex-wrap:wrap;gap:3px 8px;padding-top:7px;
    font-size:10px}
  .pg-books .lv-track .bk-meta span{white-space:nowrap;flex:none}
  .pg-books .lv-track .bk-meta span:last-child{flex:0 0 auto;min-width:0;
    overflow:visible;text-overflow:clip}
  .pg-books .lv-track .bk-meta .chip{font-size:9.5px;padding:2px 6px}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第八轮（2026-10-20 用户令 5 条）
   ① 首页“不知道读什么”灰引言与“轻松短篇”统一（13.5px / muted）
   ② 工作室介绍页文字缩小（.pg-studio 由 src/studio.html 加类）
   ③ 导航“分级指引”手机端指向首页 #picks 并自动展开（逻辑在 site.js）
   ④ 推荐书单：汇总页 + 榜单详情页页面加宽、卡片缩小
   ⑤ 活动公告列表：字号整体小一号，标题尽量一行、可整行折第二行
   纪律不变：全部包在 (max-width:720px) 内，桌面不命中。
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){

  /* ① 引言统一 --------------------------------------------------- */
  #picks .sec-sub{font-size:13.5px;line-height:2.05;letter-spacing:.2px;
    color:var(--muted);margin:14px 0 20px}

  /* ② 工作室介绍 -------------------------------------------------- */
  .pg-studio .pg-t{font-size:23px;margin:8px 0 4px}
  .pg-studio h3{font-size:16px;margin:20px 0 6px}
  .pg-studio p{font-size:13px;line-height:1.8;margin:8px 0}

  /* ③ 锚点定位不被吸顶导航遮挡 ------------------------------------ */
  body[data-page="home"] .sec{scroll-margin-top:calc(var(--hdr) + 10px)}

  /* ④ 推荐书单（汇总页 .pg-lists / 榜单详情页 .pg-list）----------- */
  .pg-lists,.pg-list{padding-left:14px;padding-right:14px}
  .pg-lists .lb-grid{gap:12px;margin-top:14px}
  .pg-lists .lb-card{gap:10px;padding:10px 11px;border-radius:12px}
  .pg-lists .lb-cv{flex:0 0 64px;width:64px;height:90px;border-radius:6px}
  .pg-lists .lb-i b{font-size:14.5px}
  .pg-lists .lb-meta{font-size:10.5px;margin-top:4px}
  .pg-lists .lb-ds{font-size:11px;line-height:1.65;margin-top:5px;
    -webkit-line-clamp:2}
  .pg-lists .lb-go{font-size:11.5px;padding-top:6px}
  .pg-list .rkl{grid-template-columns:1fr;gap:10px}
  .pg-list .rk{gap:10px;padding:10px 11px;border-radius:10px}
  .pg-list .rk-n{flex-basis:20px;font-size:17px}
  .pg-list .rk-cv{flex-basis:58px;width:58px;height:82px}
  .pg-list .rk-i b{font-size:13.5px}
  .pg-list .rk-a{font-size:11px;margin-top:3px}
  .pg-list .rk-b{font-size:11.5px;line-height:1.6;margin-top:5px;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .pg-list .rkl-meta{font-size:11.5px;margin-bottom:8px}
  .pg-list .rkl-intro{font-size:12.5px}
  .pg-list .rkl-note{font-size:11px;margin-bottom:16px}

  /* ⑤ 活动公告 ---------------------------------------------------- */
  .pg .news-list{margin-top:14px}
  .pg .news-list a{gap:10px;padding:11px 4px}
  .pg .news-list .nl-dt{min-width:66px;font-size:11px}
  .pg .news-list .nl-tt{font-size:13px;line-height:1.6}
  .pg .news-list .nl-pin{font-size:10px;padding:2px 6px;letter-spacing:1px}
  .pg .news-list .nl-new{font-size:10px;padding:1px 5px}
  .pg .news-list .nl-go{font-size:15px}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第九轮（2026-10-20 用户令 5 条）
   ① 首页副标题恢复与主标题左对齐（居中逻辑已从 site.js 移除）
   ② 轻松短篇 / 不知道读什么 两条灰引言行距收紧
   ③ 工作室介绍字号再降一号；“远方”不折行；小标题与结尾多留白
   ④ 分级指引导航改指 #levels（逻辑在 site.js）
   ⑤ 推荐书单汇总页在手机上右侧被裁——grid 最小列宽 370px 溢出的根因
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){

  /* ① 左对齐（覆盖任何遗留的居中） */
  body[data-page="home"] .hero-sub-m{width:auto;text-align:left;margin-left:0}

  /* ② 两条灰引言行距统一，13px 保证“那么 ——”收在上一行行尾 */
  body[data-page="home"] .sec-motto{line-height:1.75;font-size:13px}
  #picks .sec-sub{line-height:1.75;font-size:13px}

  /* ③ 工作室介绍 */
  .pg-studio .pg-t{font-size:22px}
  .pg-studio h3{font-size:15px;margin:40px 0 6px}
  .pg-studio p{font-size:12.5px;line-height:1.78;margin:8px 0}
  .pg-studio p:last-child{margin-top:32px}
  .pg-studio .no-wrap{white-space:nowrap}

  /* ⑤ 汇总页单列（minmax(370px) 在 390px 屏溢出，右侧文字被裁） */
  .pg-lists .lb-grid{grid-template-columns:1fr}
  .pg-lists .lb-card{max-width:100%}
  .pg-lists .lb-i{min-width:0}
  .pg-lists .lb-i b,.pg-lists .lb-meta,.pg-lists .lb-ds{overflow-wrap:anywhere}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第十轮补（2026-10-20 用户令 4 条）
   ① hero 介绍文字与网页版同文（恢复被隐藏的 .m-x 词条与分隔点）
   ② 计数栏目距下方分割线的空白继续收紧
   ④ 页脚版权声明：加向下展开三角，默认收起，点击展开（JS 折叠）
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){

  /* ① lead 与桌面同文 -------------------------------------------- */
  body[data-page="home"] .hero .lead .m-x{display:inline}

  /* ② 统计 → 下方分割线 ------------------------------------------ */
  body[data-page="home"] .hero-in{padding-bottom:34px}

  /* ④ 版权声明折叠 ------------------------------------------------ */
  .ft .disc{position:relative}
  .ft .disc.m-fold{cursor:pointer;padding-right:30px;overflow:hidden}
  .ft .disc.m-fold.m-anim{transition:max-height .3s cubic-bezier(.4,0,.2,1)}
  .ft .disc.m-fold::after{content:"";position:absolute;right:12px;top:14px;
    width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;
    border-top:6px solid #B9B2CC;transition:transform .25s}
  .ft .disc.m-fold.m-open::after{transform:rotate(180deg)}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第十二轮（2026-10-20 用户令 3 组）
   ① 级别书架页（.pg-level，gen_site 已加类）：标题 22px 不折行、
      介绍文字 12px 单行；meta 行隐藏“按参考蓝思值…排列”尾巴
      （与下方 lv-h 重复）；“共 X 本”行改为左对齐小字
   ② 书详情页：封面 150px、标题 22px、介绍行距 1.6、facts 收紧，
      首屏装下 书卡+介绍+两按钮；章节目录：方框与“章节目录”
      左对齐（去掉 ol 默认缩进）、行距与盒间距缩小
   ③ 首页 hero 介绍行 14.5→13.5px
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){

  /* ① 级别书架页 -------------------------------------------------- */
  .pg-level{padding-top:24px}
  .pg-level .pg-t{font-size:22px;margin:6px 0 4px;white-space:nowrap}
  .pg-level p{font-size:11.5px;letter-spacing:-.25px;line-height:1.62;margin:7px 0 0}
  .pg-level .lv-sort{display:none}
  .pg-level .lv-h{margin:20px 0 12px;gap:6px}
  .pg-level .lv-h i{margin-left:0;flex-basis:100%;font-size:11px;margin-top:-1px}

  /* ② 书详情页（单本阅读总览章节页）-------------------------------- */
  .pg.bkd{padding-top:22px}
  .bkd-hero{gap:14px}
  .bkd-cover{width:150px}
  .bkd-info h2{font-size:22px;margin:8px 0 3px;line-height:1.3}
  .bkd-en{font-size:12px}
  p.bkd-intro{font-size:13px;line-height:1.6;margin-top:10px}
  p.bkd-why{font-size:12.5px;line-height:1.6;margin-top:6px}
  .bkd-facts{margin-top:10px;gap:4px 18px}
  .bkd-facts>div{font-size:12.5px}
  .bkd-act{margin-top:12px}
  .bkd-go{padding:9px 22px;font-size:14px}
  .bkd-shelf{padding:8px 18px;font-size:13.5px}

  /* 章节目录：方框左对齐标题 + 行距收紧 */
  .bkd-toc{margin-top:20px}
  .bkd-toc h3{font-size:17px;margin:0 0 10px}
  .pg .bt-list{padding-left:0;margin:0;gap:5px}
  .pg .bt-list li{margin:0}
  .bt-list a{padding:8px 12px;gap:10px}
  .bt-n{width:26px;height:26px;font-size:12px}
  .bt-tx b{font-size:13.5px}
  .bt-tx span{font-size:11px}
  .bt-w{font-size:10.5px}

  /* ③ 首页介绍行 --------------------------------------------------- */
  body[data-page="home"] .hero .lead{font-size:13.5px}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第十三轮（2026-10-20 用户令 4 条，阅读内页）
   ① 眉题行：长篇隐藏中文书名（JS 打 .bk-cn-long 标记），
      整行强制单行不折行（过长英文书名省略号截断）
   ② 阅读分享卡：固定 288px → 撑满弹层宽度
   ③ 批注条目：收藏按钮改为纯星号（order:-1 置于批注最前），
      字号整体缩小一档，生词批注尽量一行放完
   ④ 批注发音喇叭 25→30px、图标 13→16px
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){

  /* ① 眉题单行 ------------------------------------------------------ */
  .rd-hd .hd-k{flex-wrap:nowrap;white-space:nowrap;overflow:hidden;
    font-size:10px;letter-spacing:1.4px;gap:8px}
  .rd-hd .hd-k > span + span{border-left:1px solid var(--line);padding-left:8px}
  .rd-hd .hd-k .bk-en{overflow:hidden;text-overflow:ellipsis;flex:0 1 auto;min-width:0}
  .rd-hd .hd-k .bk-cn-long{display:none}
  .rd-hd .hd-k .ch-rom{flex:none}

  /* ② 阅读分享卡 ---------------------------------------------------- */
  .share{width:100%;max-width:100%}

  /* ③ 批注条目 ------------------------------------------------------ */
  .nx-i{font-size:12px;gap:7px;padding:7px 9px;margin-bottom:5px}
  .nx-i .w{font-size:13.5px}
  .nx-i .ph{font-size:11px}
  .nx-i .fb{font-size:10.5px}
  .nx-i .cn{font-size:12px}
  .nx-i .lv{font-size:9.5px;padding:1px 5px;letter-spacing:.3px}
  .nx-i .hook{font-size:11px}
  /* 收藏：纯星号，置于批注最前；语用长句改为左侧空白列绝对定位（不多占一行） */
  .nx-i .fv{order:-1;margin-left:0;padding:0;border:0;background:none;
    font-size:0;line-height:1;width:24px;height:24px;flex:none;
    display:inline-flex;align-items:center;justify-content:center;align-self:center}
  .nx-i .fv::before{content:"☆";font-size:16px;color:var(--faint)}
  .nx-i .fv:hover{background:none;border:0;color:var(--brand)}
  .nx-i .fv.on{background:none;border:0;font-weight:400}
  .nx-i .fv.on::before{content:"★";color:var(--brand)}
  .nx-i.py{display:block;position:relative;padding-left:76px}
  .nx-i.py .fv{position:absolute;left:44px;top:7px;order:0}
  .nx-i.py .spk{position:absolute;left:7px;top:6px;margin:0;vertical-align:baseline}
  .nx-i.py .w{margin-right:2px}
  .nx-i.py .lv{margin:0 2px;vertical-align:1px}
  .nx-i.py .cn{margin-right:4px}
  .nx-i.py .hook{display:block;margin-top:3px}

  /* ④ 喇叭放大 ------------------------------------------------------ */
  .nx-i .spk{width:30px;height:30px}
  .nx-i .spk svg{width:16px;height:16px}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第十四轮（2026-10-21 用户令，彼得兔系列专项 + 阅读内页宽度）
   ① 合集“分册 · 单篇精读”：去 52px 桌面内收、gap 12px 与列宽计算
      对齐，卡片统一高度 + 文字截断（原 119px 窄条 ×630px 高）
   ② 阅读内页：第十三轮眉题 nowrap 的长英文书名会把 .rd 单列 grid
      子项（min-width:auto）撑到 411px，整页被横向裁掉 37px ——
      给 grid 子项补 min-width:0（实测 bodySW 427→390）
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){

  /* ② 阅读内页宽度修复 ------------------------------------------- */
  .rd > div{min-width:0}

  /* ① 分册书卡 ----------------------------------------------------- */
  .bkd-subs{padding:0;margin-top:6px}
  .bkd-subgrid{gap:12px;padding:0}
  .bkd-subgrid .bk{flex:0 0 calc((100% - 12px)/2);height:318px;overflow:hidden}
  .bkd-subgrid .bk-b{padding:9px 11px 0}
  .bkd-subgrid .bk-b h3{font-size:14px;line-height:1.35;margin:0}
  .bkd-subgrid .bk-b .en{font-size:10px;line-height:1.5;margin-top:3px;
    display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
  .bkd-subgrid .bk-b p{font-size:10.5px;line-height:1.55;margin:5px 0 0;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .bkd-subgrid .bk-meta{gap:3px 8px;margin-top:7px;font-size:9.5px}
  .bkd-subgrid .bk-meta .ser{display:none}
  .bkd-subgrid .bk-meta .chip{display:none}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第十五轮（2026-10-21 用户令 3 条，阅读内页）
   ① 段落英文字号小一点点：基础层已改 var(--rd-fs,16px)（原 16.5）
   ② 批注更紧凑：字号再降一档争取单行；批注区借用段落左侧序号列
      的空白（-50px）扩宽可用行宽；喇叭 order:-2 前置于星号
   ③ 字号滑杆见基础层 .fab-fs（桌面/手机通用组件，JS 注入 #fab）
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){

  /* ② 批注紧凑 + 喇叭前置 ------------------------------------------ */
  .sub-n{margin-left:-50px;width:calc(100% + 50px)}
  .nx-i{font-size:11.5px;gap:5px;padding:6px 9px;margin-bottom:4px}
  .nx-i .w{font-size:12.5px}
  .nx-i .ph{font-size:10px}
  .nx-i .fb{font-size:9.5px}
  .nx-i .cn{font-size:11.5px}
  .nx-i .lv{font-size:8.5px;padding:1px 4px;letter-spacing:.2px}
  .nx-i .hook{font-size:10.5px}
  .nx-i .spk{order:-2;width:26px;height:26px;align-self:center;margin:0}
  .nx-i .spk svg{width:14px;height:14px}
  .nx-i .fv{order:-1;width:22px;height:22px}
  .nx-i .fv::before{font-size:15px}
  .nx-i.py .fv{left:42px}
  .nx-i.py .spk{width:26px;height:26px}
  .nx-i.py .spk svg{width:14px;height:14px}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第十六轮（2026-10-21 用户令 2 条）
   ① 阅读页分节导航按钮去文字、只留箭头图标（桌面不动）：
      font-size:0 藏掉“上一节/下一节”，伪元素画箭头；
      禁用态 opacity 继承，悬停反白在触屏不触发
   ② 理念横幅工作室图标在 home.html 源头删除（全站唯一引用），无需 CSS
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){
  /* 2026-10-23 用户令：按钮更小 + 禁止换行（→ 不再单独掉到下一排，
     与 ← 分列圆点两侧、垂直居中）；圆点同步收小保证放得下 */
  .pgn{padding:8px 10px;gap:8px;flex-wrap:nowrap}
  .pgn-c{min-width:0}
  .pgn-b{font-size:0;color:transparent;padding:5px 8px;min-width:30px;flex:none;
    display:inline-flex;align-items:center;justify-content:center}
  #pgnPrev::before{content:"←";font-size:15px;line-height:1;color:var(--ink-2)}
  #pgnNext::after{content:"→";font-size:15px;line-height:1;color:var(--ink-2)}
  .pgn-i{font-size:11px}
  .pgn-dots{gap:5px}
  .pgn-dots button{width:22px;height:22px;border-radius:7px;font-size:10.5px}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第十七轮（2026-10-21 用户令，Step 3）：阅读底栏
   ① .mbar 基础层 display:none，仅 720 断点显形（桌面零变化）
   ② 播放条整体抬到底栏上方；安全区由底栏统一承担（.pl 自身 env 清零）
   ③ 相关浮层（工具箱 / toast / PWA 提示条）同步上移，不压底栏
   ═══════════════════════════════════════════════════════════════ */
.mbar{display:none}
@media (max-width:720px){
  .mbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:78;
    background:rgba(255,255,255,.97);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
    border-top:1px solid var(--line);box-shadow:0 -4px 18px rgba(0,0,0,.05);
    padding:5px 4px calc(5px + env(safe-area-inset-bottom))}
  .mbar-b{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
    background:none;border:0;padding:4px 0;min-height:46px;font-size:10px;letter-spacing:.5px;
    color:var(--ink-2);transition:.15s}
  .mbar-b svg{width:19px;height:19px}
  .mbar-b:active{background:var(--brand-l)}
  .mbar-b.on{color:var(--brand-d);font-weight:600}
  .mbar-b:disabled{opacity:.32}
  /* 播放条抬到底栏上方（底栏高 56 = 5+46+5，安全区归底栏） */
  .pl{bottom:calc(56px + env(safe-area-inset-bottom));padding-bottom:0}
  .pl.min{bottom:calc(74px + env(safe-area-inset-bottom))}
  body.plmin .rd{padding-bottom:calc(112px + env(safe-area-inset-bottom))}
  /* 阅读页底部留白：原 120 + 底栏 56 */
  .rd{padding-bottom:calc(176px + env(safe-area-inset-bottom))}
  .fab{bottom:calc(154px + env(safe-area-inset-bottom))}
  .toast{bottom:calc(150px + env(safe-area-inset-bottom))}
  .mri-chip{bottom:calc(154px + env(safe-area-inset-bottom))}
}

/* ═══════════════════════════════════════════════════════════════
   首页栏目折叠 · 桌面态（2026-10-23 用户令：与手机侧逻辑拉齐）
   - 经典书目/轻松短篇恒展开（site.js NOFOLD），其余栏目默认收起
   - 样式与移动端折叠块同款参数，仅断点不同（≥721px）；交互由 site.js 驱动
   - 纪律：追加块，不动上方任何存量行
   ═══════════════════════════════════════════════════════════════ */
@media (min-width:721px){
  body[data-page="home"] .sec.m-anim{overflow:hidden;
    transition:height .3s cubic-bezier(.4,0,.2,1)}
  body[data-page="home"] .sec > .sec-h{cursor:pointer;padding-right:70px;
    position:relative}
  body[data-page="home"] .sec > .sec-h::after{content:"展开 ▾";position:absolute;
    right:0;top:50%;transform:translateY(-50%);
    display:inline-flex;align-items:center;justify-content:center;text-align:center;
    min-width:58px;padding:6px 10px;font-size:12px;line-height:1;letter-spacing:0;
    color:#8E8899;background:#fff;border:1px solid var(--line-2);border-radius:999px}
  body[data-page="home"] .sec.m-open > .sec-h::after{content:"收起 ▴"}
  body[data-page="home"] .sec.m-done > *:not(.sec-h){visibility:hidden}
  body[data-page="home"] .sec.m-closed{padding-top:12px !important;padding-bottom:0}
  body[data-page="home"] .sec.m-closed > .sec-h{margin-bottom:0;border-bottom-color:transparent}
  body[data-page="home"] .sec.m-closed .sec-h .more{display:none}
  body[data-page="home"] .sec.no-fold > .sec-h{cursor:default;padding-right:2px}
  body[data-page="home"] .sec.no-fold > .sec-h::after{display:none}
}

/* ═══════════════════════════════════════════════════════════════
   首页折叠指示 · 两端统一为纯箭头（2026-10-23 用户令第二轮）
   - 去掉「展开/收起」文字与胶囊底，只留 ▾/▴ 三角
   - ::after 作为 .sec-h 的 flex item 参与 baseline 对齐 → 与右侧红字(.more)水平对齐
   - 覆盖上方移动端(2452)与本轮桌面块的胶囊写法；追加块，不动存量行
   ═══════════════════════════════════════════════════════════════ */
body[data-page="home"] .sec > .sec-h{padding-right:2px}
body[data-page="home"] .sec > .sec-h::after{content:"▾";position:static;
  transform:none;min-width:0;padding:0;border:0;background:none;
  display:inline-block;margin-left:0;font-size:13px;line-height:1;
  color:#8E8899;transition:transform .2s}
body[data-page="home"] .sec.m-open > .sec-h::after{content:"▴"}
body[data-page="home"] .sec.m-closed > .sec-h::after{margin-left:auto}

/* ═══ 2026-10-23 用户令：Bridge 卡头部精简（OUR APPROACH / 我们的理念 / 一句小字），
   内边距同步压缩以缩小卡片高度（首页已删该模块，本样式作用于分页页脚上方卡片） ═══ */
.mods .mod-b{padding:34px 44px 38px}
@media (max-width:720px){
  .mods .mod-b{padding:28px 16px 24px}
}
/* 2026-10-23 用户令二次收紧：卡片再缩矮一点 */
.mods .mod-b{padding:24px 44px 28px}
.mods .mod-b .mod-hrow h3{margin-top:8px}
.mods .mod-b .mod-sub{margin-top:8px}
@media (max-width:720px){
  .mods .mod-b{padding:22px 16px 20px}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第十八轮（2026-10-23 用户令）
   ① 折叠三角固定在标题行（top:20px，修「展开后三角移位」——
      根因：展开后 .more 按 flex-basis:100% 换行，.sec-h 变两行，
      原 top:50% 居中跟着下坠）
   ② 「学习如何使用」弹窗手机端改三页横滑：
      页1=上手步骤 / 页2=BRIDGE 阅读法 / 页3=更多功能；
      scroll-snap 吸附 + 圆点指示；桌面基础层 gd-pages 为普通块、
      gd-dots 不显示，版式与改版前一致
   ═══════════════════════════════════════════════════════════════ */
.sheet-guide .gd-dots{display:none}
@media (max-width:720px){
  .sheet-guide .sheet-c{display:flex;flex-direction:column;
    height:min(76vh,660px)}
  .sheet-guide .sheet-c > h3,
  .sheet-guide .sheet-c > .gd-lead{flex:none}
  .sheet-guide .gd-pages{flex:1;min-height:0;display:flex;
    overflow-x:auto;overflow-y:hidden;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
    margin:0 -4px;scrollbar-width:none}
  .sheet-guide .gd-pages::-webkit-scrollbar{display:none}
  .sheet-guide .gd-page{flex:0 0 100%;scroll-snap-align:start;
    overflow-y:auto;padding:2px 4px 12px}
  .sheet-guide .gd-dots{flex:none;display:flex;justify-content:center;
    align-items:center;gap:7px;padding:10px 0 2px}
  .sheet-guide .gd-dots i{width:7px;height:7px;border-radius:50%;
    background:var(--line-2);transition:.22s;cursor:pointer}
  .sheet-guide .gd-dots i.on{background:var(--brand);width:20px;border-radius:4px}
  .sheet-guide .sheet-act{flex:none;padding-top:6px;margin-top:0}
}

/* ═══ 折叠三角移位修复（2026-10-23 用户令）═══
   根因：margin-left:auto 只挂在 .m-closed 态（3026 行块），展开后箭头
   margin-left 回 0、缩到标题文字旁边。手机端 .more 恒隐藏（2167 行），
   两种状态都让箭头 auto 靠右即可；桌面 .more 可见，保持现状不动。 */
@media (max-width:720px){
  body[data-page="home"] .sec > .sec-h::after{margin-left:auto}
}

/* ═══ 学习弹窗三页横滑 · 排版微调（2026-10-23 用户令二轮，仅手机端）═══
   页1：灰框收窄（文字换行更满，消底部大空白）；页3：内容纵向居中 +
   行距放宽，留白适度。桌面长页版式不动。 */
@media (max-width:720px){
  .sheet-guide .gd-page .gd-step{max-width:80%;margin:13px auto}
  .sheet-guide .gd-page .gd-step p{font-size:13.5px}
  .sheet-guide .gd-page:last-child{display:flex;flex-direction:column;justify-content:center;
    padding-right:26px}
  .sheet-guide .gd-page:last-child .gd-sec{margin-top:0}
  .sheet-guide .gd-page:last-child .gd-sec h4{margin-bottom:14px}
  .sheet-guide .gd-more li{padding-bottom:14px;font-size:14px;line-height:1.9}
}

/* ═══════════════════════════════════════════════════════════════
   移动端 · 第十九轮（2026-10-24 用户令，阅读内页）
   ① 内联分节导航（.pgn）退出页面：节号 1~N 改为点【目录】弹窗选择
      （底栏 上一节/下一节 保留）；判定改看 pgn.hidden 属性
   ② 右侧悬浮球退出（与底栏【工具箱】合并）：.fab-list 原样搬进
      #sheetToolbox（监听器随节点走，四大功能 + 字号滑杆不重绑）
   ③ 【对照】图标改「文 / A」双字标（原地球线条图形辨识度差）
   ═══════════════════════════════════════════════════════════════ */
@media (max-width:720px){
  body[data-page="read"] .pgn{display:none!important}
  body[data-page="read"] .fab{display:none!important}

  .mbar-lang{display:flex;flex-direction:column;align-items:center;line-height:1;
    font-weight:700;letter-spacing:0}
  .mbar-lang i{font-style:normal}
  .mbar-lang i:first-child{font-size:12px}
  .mbar-lang i:last-child{font-size:10px;opacity:.85}

  .sheet-sec .ss-info{margin:0 0 12px;font-size:12px;color:var(--muted)}
  .sheet-sec .ss-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
  .sheet-sec .ss-grid button{height:40px;border-radius:10px;border:1px solid var(--line);
    background:var(--bg-warm);font-size:14px;font-weight:600;color:var(--ink-2);transition:.15s}
  .sheet-sec .ss-grid button.on{background:var(--brand);border-color:var(--brand);color:#fff}

  .sheet-toolbox .tb-slot .fab-list{align-items:stretch;gap:10px}
  .sheet-toolbox .tb-slot .fab-i{opacity:1;transform:none;pointer-events:auto;
    justify-content:space-between;transition:none}
  .sheet-toolbox .tb-slot .fab-fs{opacity:1;transform:none;pointer-events:auto;
    flex-wrap:wrap;white-space:normal;transition:none}
}

/* ══ 第二十轮（2026-10-24 晚，用户令）：节号/工具箱弹层改「原地悬浮」══════════
   手机端这两个弹层从垂直居中改为底部动作弹层（bottom sheet）：
   卡片贴在阅读底栏正上方弹出——就在【目录】/【工具箱】按钮的原地。
   仅移动断点追加，桌面基础层（居中弹窗）一行不动。 */
@media (max-width:720px){
  .sheet-sec,.sheet-toolbox{align-items:flex-end;
    padding:0 10px calc(66px + env(safe-area-inset-bottom))}
  .sheet-sec .sheet-c,.sheet-toolbox .sheet-c{max-width:520px;
    border-radius:18px 18px 14px 14px;animation:sheetUp .22s ease-out}
}
@keyframes sheetUp{from{transform:translateY(26px);opacity:.35}to{transform:none;opacity:1}}

/* ══ 桌面首访顶部浮窗（2026-10-25 用户令）：引导添加至桌面，× 关闭后不再出现 ══
   出现与否由 site.js 4d 控制（仅桌面/非微信/非 standalone）；CSS 兜底手机端不显形 */
.dsk-tip{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:130;
  display:flex;align-items:center;gap:8px;max-width:min(92vw,600px);
  background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border:1px solid var(--line);border-radius:10px;
  box-shadow:0 6px 24px rgba(42,35,64,.12);padding:10px 12px 10px 14px;
  font-size:13px;color:var(--ink);line-height:1.55}
html[data-theme="eye"] .dsk-tip{background:rgba(247,245,251,.78)}
.dsk-tip .dsk-ok{color:#C0392B;font-weight:700;flex:none}
.dsk-tip .dsk-tx{min-width:0}
.dsk-tip .dsk-x{flex:none;margin-left:4px;border:0;background:none;cursor:pointer;
  font-size:16px;line-height:1;padding:2px 4px;color:var(--muted)}
.dsk-tip .dsk-x:hover{color:var(--ink)}
@media (max-width:720px){.dsk-tip{display:none!important}}

/* ══ 手机端页脚最后两行（隐私政策/用户协议/备案号 + 公安备案）居中（2026-10-25 用户令）══
   仅移动断点追加；桌面基础层左对齐一行不动 */
@media (max-width:720px){
  .ft-btm .ft-lg,.ft-btm .ga{width:100%;text-align:center;justify-content:center}
}

/* ══ 分享图内嵌显示（2026-10-26 用户令：图片直接生成在第一个弹窗内）══
   两按钮合并为「长按保存图片」；图以真实 <img>（data URL）呈现，手机长按可保存/转发 */
.sh-img{display:none;justify-content:center;margin:6px 0 2px}
.sh-img.on{display:flex}
.sh-img img{width:min(76vw,300px);height:auto;display:block;border-radius:12px;background:#fff;
  box-shadow:0 8px 26px rgba(42,35,64,.16)}

/* ═══════════════════════════════════════════════════════════════
   手机端三项（2026-10-26 用户令）
   ① 登录后右上角：长昵称省略、徽章收窄，不再挤压/溢出
   ② 阅读页目录：点底栏【目录】浮出「悬浮导航卡」，不再在正文顶部新增模块
   ③ 会员后台：手机端改悬浮侧边栏（抽屉）+ 表格/统计简化
   纪律：只追加；媒体查询外零命中，桌面视觉零变化。
   ═══════════════════════════════════════════════════════════════ */

/* ① 登录态账号按钮 ── 全站收窄（桌面仅加省略号保护，尺寸不变） */
.who-wrap{min-width:0;max-width:100%}
.who-btn{min-width:0;max-width:100%}
.who-nm{display:block;min-width:0;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.who-badge{flex:none}

@media (max-width:720px){
  .hdr-in{min-width:0}
  .hdr-act{gap:6px;min-width:0}
  /* 头像 + 昵称省略 + 小徽章，总宽不超过 132px，绝不顶出屏幕 */
  .who-btn{padding:5px 9px 5px 5px;gap:6px;font-size:13px;max-width:132px}
  .who-av{width:26px;height:26px;font-size:12px}
  .who-nm{max-width:56px;font-weight:600}
  .who-badge{font-size:9.5px;padding:1px 6px}
}

/* ② 阅读页目录：悬浮导航卡（≤1080px） ───────────────────────── */
@media (max-width:1080px){
  .toc-mask{position:fixed;inset:0;z-index:118;background:rgba(42,35,64,.34);
    opacity:0;pointer-events:none;transition:opacity .2s}
  .toc-mask.show{opacity:1;pointer-events:auto}
  /* 正文里不再占位（原规则 display:none 保留），点开才是浮层 */
  .rd .toc{display:none}
  .rd .toc.show{display:block;position:fixed;z-index:119;left:12px;right:12px;
    bottom:calc(76px + env(safe-area-inset-bottom));top:auto;
    max-height:min(62vh,520px);overflow:auto;-webkit-overflow-scrolling:touch;
    padding:14px 12px 16px;border-radius:16px;
    background:var(--card);border:1px solid var(--line);
    box-shadow:0 18px 48px rgba(42,35,64,.26);animation:tocUp .2s ease-out}
  .rd .toc.show h4{position:sticky;top:-14px;margin:-14px -12px 10px;padding:13px 16px 9px;
    background:var(--card);border-bottom:1px solid var(--line);border-radius:16px 16px 0 0;z-index:1}
  .rd .toc.show a{padding:11px 12px}
}
@keyframes tocUp{from{transform:translateY(14px);opacity:.35}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){
  .rd .toc.show{animation:none}
  .toc-mask{transition:none}
}

/* ③ 会员后台：悬浮侧边栏 + 手机端简化（≤900px） ─────────────── */
.cs-menu-btn{display:none}
.cs-side-x{display:none}

@media (max-width:900px){
  /* 顶栏：导航按钮 + 面包屑（可省略）+ 返回 */
  .cs-bar-in{height:auto;padding:9px 14px;flex-wrap:nowrap;gap:9px;align-items:center}
  .cs-menu-btn{display:inline-flex;align-items:center;gap:6px;flex:none;
    border:1px solid var(--line);background:var(--cs-card);color:var(--cs-ink);
    border-radius:9px;padding:6px 11px;font-size:13px;font-family:inherit;cursor:pointer}
  .cs-menu-btn .cs-menu-ico{font-size:14px;line-height:1}
  .cs-bar .cs-crumb{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12.5px}
  .cs-bar .cs-back{margin-left:0;width:auto;flex:none;font-size:12.5px}

  /* 侧栏改抽屉：默认移出屏幕，点【导航】滑入 */
  .cs-side{position:fixed;left:0;top:0;bottom:0;width:min(82vw,300px);z-index:320;
    border-radius:0 16px 16px 0;border-left:0;padding:18px 12px calc(18px + env(safe-area-inset-bottom));
    overflow-y:auto;transform:translateX(-104%);transition:transform .26s ease;
    box-shadow:0 0 44px rgba(42,35,64,.22)}
  .cs-side.open{transform:none}
  .cs-side-x{display:grid;place-items:center;position:absolute;top:10px;right:10px;
    width:28px;height:28px;border:1px solid var(--line);border-radius:50%;
    background:var(--cs-card);color:var(--cs-mut);font-size:16px;line-height:1;cursor:pointer}
  .cs-side .cs-me{padding-right:30px}
  .cs-side .cs-me .nm{word-break:break-word;max-height:2.7em;overflow:hidden}
  /* 抽屉内导航恢复竖排（覆盖旧 900px 块的横向滚动条） */
  .cs-side .cs-nav{flex-direction:column;overflow:visible;gap:2px;padding-bottom:0}
  .cs-side .cs-nav-a{width:100%;white-space:normal;border-radius:9px;padding:10px 11px;font-size:13.5px}
  .cs-side .cs-nav-a::before{display:block}
  .cs-side .cs-nav-h{display:block;padding:12px 11px 4px}
  .cs-side .cs-out{padding-top:10px;margin-top:10px}
  .cs-side .cs-out a{padding:9px 11px;font-size:13px}
  .cs-side-mask{position:fixed;inset:0;z-index:310;background:rgba(42,35,64,.42);
    opacity:0;pointer-events:none;transition:opacity .24s}
  .cs-side-mask.show{opacity:1;pointer-events:auto}
  body.cs-drawer-on{overflow:hidden}

  /* 内容区简化 */
  .cs-shell{padding:12px 14px 26px}
  .cs-h{margin-bottom:12px;gap:8px}
  .cs-h h1{font-size:19px}
  .cs-h .sub{font-size:12px;padding-bottom:0}
  .cs-h .cs-h-act{margin-left:0;width:100%;gap:7px}
  .cs-h .cs-h-act .cs-btn{flex:1;justify-content:center}
  .cs-card{padding:14px 13px;overflow-x:auto}
  .cs-card > h3{font-size:14px}
  .cs-stat{grid-template-columns:repeat(2,1fr);gap:9px}
  .cs-stat .it{padding:11px 12px}
  .cs-stat .it b,.cs-stat .it-link b{font-size:20px}
  .cs-grid{grid-template-columns:1fr;gap:12px}
  .cs-tb{font-size:12.5px}
  .cs-tb th,.cs-tb td{padding:8px 9px}
  .cs-p{font-size:13px}
}
