/* ============================================================
   home3.css · 首页「案头」重构（B 版落地）  v2（2026-09-17 晚：立绘裁切放大 + 背景压暗）
   ------------------------------------------------------------
   作用范围：只作用于 .home-tab（PC 首页），不影响 app.html 手机壳与其它页签。
   摘掉 index.html 里这一行 <link> 即可整体回退到 home2.css 的旧首页版式。

   ⛔ 隔离约定（重要）
   1) 本文件所有类名一律 `ds-` 前缀 + 全部规则限定在 `.home-tab` 之下。
      原因：设计稿用的是 .card/.path/.tools/.step/.note/.no/.s/.m/.l/.c/.ln/.cap
      这类超通用类名，而 style.css / theme.css / ink.css 里已有同名或同义规则，
      直接搬进来必然互相污染（尤其 .c/.s/.m/.no/.main/.on/.w 这些）。
   2) 复用而不重造：搜索框、每日一方、AI 浮窗、.reveal2 入场动画
      沿用 home2.css 里已调好的 `.nx-*` 类与 id，本文件只做必要覆盖。
   3) 首屏场景层复用线上 `.nx-hero` + `.menu-scene / .menu-bg / .menu-veil / .menu-master`
      （底图与立绘由 app.js 的 SCENE_BG / SCENE_MASTER 注入），
      因此本文件不写场景本身，只覆盖立绘的定位与让位间距。
   ============================================================ */

/* ---------- 0. 局部令牌 + 容器 ---------- */
.home-tab{
  --ds-gold:#d4a04a;
  --ds-gold-l:#e8b968;
  --ds-line:rgba(232,185,104,.22);
  --ds-line-2:rgba(255,255,255,.09);
  --ds-txt:#f6efe2;
  --ds-txt-2:#cdbf9d;
  --ds-txt-3:#8d8370;
  --ds-cinnabar:#c9553f;
  --ds-jade:#7fae8f;
  --ds-card-bg:linear-gradient(165deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
  /* 首屏立绘的「占位宽度」。文案区让位与立绘本体都用它，避免两处写死后漂移
     （2026-09-17 教训：原来立绘写 clamp(190,16vw,250)、文案让位写 clamp(200,17vw,250)，
     两个 clamp 在 1100~1500 区间不相等，立绘与文案区的间隙全靠运气）。
     ⭐ 2026-09-19 定稿：立绘回到**半身照**（按 alpha 包围盒裁紧的 trim 版，比例 0.5963），
     全身版那套「高度驱动」（--ds-mh + 比例推算）随之整个撤掉——宽度驱动本来就是
     与 trim 版配套的写法，资源比例一变它就自洽。 */
  --ds-mw:clamp(190px,16vw,236px);
}
.home-tab .ds-container{
  /* width:100% 不能省。首屏 .ds-container 是 .menu-scene（column flex）的子项，
     而 `margin:0 auto` 在 flex 交叉轴上会**取消 stretch**、把宽度压成内容宽
     （实测 1440 下只拿到 913px，导致 h1 被挤换行）。显式 width:100% + 居中才行。 */
  width:100%; max-width:1120px; margin:0 auto;
  padding:0 clamp(16px,4vw,32px);
}

/* ---------- 1. 一 · 案头（首屏） ---------- */
/* .nx-hero 已给到全出血 margin:0 calc(50% - 50vw) + overflow:hidden，这里只补内边距与层级 */
.home-tab .ds-desk > .menu-scene > .ds-container{
  position:relative; z-index:5; flex:1;
  display:flex; flex-direction:column; justify-content:center;
  padding-top:clamp(40px,7vh,72px);
  padding-bottom:clamp(36px,6vh,60px);
}
.home-tab .ds-hero-row{ position:relative; }

/* 立绘：home2.css 里 .nx-hero .menu-master 是 bottom:0 贴整个 scene 底部
   （旧结构 scene 只有 hero），现在 scene 含书架+台面，必须改成贴 hero 行顶部。
   特异性 .home-tab .ds-desk .menu-master (0,3,0) > .nx-hero .menu-master (0,2,0)，
   且不写 display，窄屏的 display:none 仍由 home2.css 的媒体查询负责。

   ⛔ 2026-09-17：人物「看起来太小」的真因不是容器小，而是**原图自带大量透明留白**
   （900×1141 的图里人物只占宽 63.7%，左右各留白 166/161px）——容器给 230px 时
   人物实际只显示 146px。解法＝按 alpha bbox 裁到包围盒，成品
   `images/nihaixia_portrait_trim_2026-09-17.png`（585×981，比例 0.5963，留 6px 呼吸边）
   ——**这也是 2026-09-19 定稿后 SCENE_MASTER 指向的图**。
   ⚠️ 这张是当年用临时脚本裁的、脚本没入库；`_gen_master_portrait.py` 产出的是
   `nihaixia_portrait_fade_2026-09-17.png`、`_gen_master_full.py` 产出的是
   `nihaixia_portrait_full_2026-09-17.png`，都不是它。
   要重生成照这条规则：alpha bbox 裁紧 + 四边留 6px 呼吸边。
   同宽下人物 +58%，且**一点不侵占文案区**
   （比加宽容器更划算：加宽会挤掉 h1 的可用宽度）。
   right 偏移同时收紧到 clamp(8px,1.2vw,20px)，给人物多让出十几像素。

   ⛔⛔ 2026-09-17 三次返工，前两次方向都错了，留全案以免再走回头路：
   ①「人物太小」——真因是**原图自带大量透明留白**（900×1141 里人物只占宽 63.7%，
     左右各留白 166/161px），容器给 230px 时人物只显示 146px。→ 按 alpha bbox 裁图。
   ②「下半身被扣没了」——home2.css 那道 `mask-image:...#000 82%,transparent` 把元素盒
     下缘 18% 渐隐；旧图下缘 10% 是留白所以看不出来，裁紧后渐隐正好吃在人物腰腹上。
     → 当时把遮罩推后到 84% 并给资源补了 120px 底部留白（只治了表象）。
   ③「还是没有下半身，没有裤子吗」——量过原图才确认：**`nihaixia_portrait.png` 本来就是
     一张半身照**，人物墨迹在第 1029 行（腰带下约 50px）就结束了，素材里根本没有腿，
     遮罩怎么改都长不出下半身。→ 用图片生成把半身照向下延展成站姿全身
     （深灰西裤 + 黑皮鞋，上半身锁定不变），再过语义抠图拿透明底。成品
     `images/nihaixia_portrait_full_2026-09-17.png`（358×1100，比例 0.3255，
     脚底 40px 是接触阴影的收尾留白），生成脚本 `_gen_master_full.py`。
     ⚠ 换立绘**必须换新文件名**：该 URL 不带版本戳，同名替换会被浏览器与 CF 缓存住。
   ⇒ ②里那道下缘渐隐**整个撤掉**，立绘下缘走硬边。
   ⭐ 2026-09-19 站主定稿：「不要全身，要上半身，手部位置保留，下面渐隐删掉」。
     于是 SCENE_MASTER 从全身版回到裁紧的半身版 trim（585×981，人物底端即盒底，
     手部姿态与原图逐像素一致）；全身版 full 弃用——它的上半身是重新生成的，
     手的姿态与原图有出入，正是站主要保留的那部分。
     渐隐的源头在 home2.css 的 .nx-hero .menu-master，那两行 mask-image 已直接删除
     （不是靠本文件覆盖），本文件的 mask:none 保留作为兜底与意图声明。 */
.home-tab .ds-desk .menu-master{
  top:0; bottom:auto;
  width:var(--ds-mw);
  right:clamp(8px,1.2vw,20px);
  /* 半身像下缘是硬边（渐隐已撤），投影取中间档：比全身版的 10px/22px 重一档，
     比早期的 26px/46px 轻一档，免得硬边下方糊出一圈突兀黑晕。 */
  filter:drop-shadow(0 18px 34px rgba(0,0,0,.55));
  -webkit-mask-image:none;
  mask-image:none;
}
/* 这里**故意不写 .master-img 的尺寸**：style.css 的 .master-img 已是
   width:100% / height:auto，容器宽度由上面的 --ds-mw 给，图片按自身比例出高度。
   2026-09-17 晚全身版曾在此处反锁高度（width:auto;height:var(--ds-mh)），
   09-19 定稿回半身后已撤掉——宽度驱动只用后面那一处令牌，换资源比例不用动这里。 */
/* 底图压暗：home2.css 给的是 saturate(.72) brightness(.9)，匾额照片太亮，
   白字压不住。这里降亮度 + 再降饱和（顺带弱化金色反光对文字的干扰）。
   ⛔ 只作用于 .menu-bg（背景图层）——立绘是独立的 .menu-master>img，且 z-index:1
   高于 veil，所以「压暗背景」不会连带把人物压暗。 */
.home-tab .ds-desk .menu-bg{
  filter:saturate(.52) brightness(.66) contrast(1.04);
}
/* 暗罩：home2.css 那版到底部只到 .92 不透明 → 药铺底图在区块下缘还剩 8% 可见，
   与下一段纯黑之间会出现一条横向硬缝（旧结构 scene 只有 hero，看不出来）。
   这里把最后一段拉满到 1，让首屏与「今日功课」无缝衔接。
   2026-09-17：再叠一层**横向**渐变——文案在左、立绘在右，左侧多压一档，
   既让标题背景干净，又保留右侧立绘区的透亮（不把整屏压死）。
   实测（1440×1000，截图像素；改前＝原 brightness(.9)+单层竖 veil）：
     文案下方纯背景带  36.5 → 18.2 (-50%)
     lede 区背景       (47,43,39) → (27,25,25)，#cdbf9d 对比度 7.7:1 → 9.6:1
     h1   区背景       (35,34,34)，#f6efe2 白色标题对比度 13.9:1
     首屏整体          60.6 → 43.8 (-28%)
     立绘区            91.4 → 130.3（不是变亮，是人物放大后占了更多面积） */
.home-tab .ds-desk .menu-veil{
  background:
    linear-gradient(95deg,
      rgba(8,9,12,.50) 0%,
      rgba(8,9,12,.31) 36%,
      rgba(8,9,12,.10) 64%,
      rgba(8,9,12,.04) 100%),
    linear-gradient(180deg,
      rgba(8,9,12,.54) 0%,
      rgba(8,9,12,.50) 30%,
      rgba(8,9,12,.74) 64%,
      rgba(8,9,12,.94) 85%,
      rgba(8,9,12,1) 100%);
}

/* 首屏主张：痛点 → AI 捷径
   宽度必须给立绘让位。这里与立绘共用 --ds-mw，并额外留一段安全间隙
   clamp(26px,2.7vw,46px)——间隙下限 26 > 立绘 right 偏移上限 20，
   所以在任意宽度下「文案右缘」都不会压到「立绘左缘」。
   （2026-09-17：原写法 gap 只有 14px，而立绘 right 偏移 28.8px，
     文案区其实已经指到立绘容器左缘外侧 1px；旧图左右有透明留白看不出来，
     裁掉留白后这个缺口会露出来，故一并修掉。） */
.home-tab .ds-hook{
  max-width:calc(100% - var(--ds-mw) - clamp(26px,2.7vw,46px));
  margin-bottom:44px;
}
/* 1100 以下 home2.css 会把立绘整个 display:none（@media min-width:1100px 才显示），
   但让位宽度还在白占地方——文案区白白少 190px，h1 被挤多余换行。
   那里立绘不可见，让位宽度归零即可。（2026-09-17 顺手修掉的历史遗留） */
@media (max-width:1099px){
  .home-tab .ds-desk{ --ds-mw:0px }
}
.home-tab .ds-kick{
  display:inline-flex; align-items:center; gap:9px;
  font-size:12.5px; letter-spacing:.9px; color:#9dc0a3;
  border:1px solid rgba(127,214,168,.26); border-radius:999px;
  background:rgba(127,214,168,.06); padding:6px 15px; margin-bottom:22px;
}
.home-tab .ds-kick i{
  width:6px; height:6px; border-radius:50%; background:#7fd6a8;
  box-shadow:0 0 9px #7fd6a8; animation:dsBl 2.2s infinite; flex:0 0 6px;
}
@keyframes dsBl{0%,100%{opacity:1}50%{opacity:.35}}
.home-tab .ds-h1{
  font-family:var(--serif-cn); font-weight:900;
  font-size:clamp(26px,3.05vw,42px); line-height:1.36; letter-spacing:.06em;
  color:var(--ds-txt); margin:0 0 20px;
}
.home-tab .ds-h1 .k{ color:var(--ds-gold-l) }
.home-tab .ds-h1 .ai{ color:var(--ds-jade) }
.home-tab .ds-lede{
  font-size:15px; color:var(--ds-txt-2); line-height:2;
  font-weight:300; max-width:820px; margin:0;
}
.home-tab .ds-lede b{ color:var(--ds-txt); font-weight:600 }
.home-tab .ds-facts{
  display:flex; flex-wrap:wrap; gap:10px 26px; margin-top:20px;
  padding-top:18px; border-top:1px solid var(--ds-line-2);
  font-size:13px; color:var(--ds-txt-3); letter-spacing:.4px;
}
.home-tab .ds-facts span{ display:inline-flex; align-items:center; gap:8px }
.home-tab .ds-facts b{ color:var(--ds-gold-l); font-weight:600 }

/* 书架 + 台面两栏 */
.home-tab .ds-desk-grid{
  display:grid; grid-template-columns:minmax(300px,.78fr) 1.22fr;
  gap:clamp(28px,4vw,56px); align-items:start;
}

/* 六部书脊 */
.home-tab .ds-shelf{ border-right:1px solid var(--ds-line-2); padding-right:clamp(20px,3vw,40px) }
.home-tab .ds-shelf-head{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:10px; margin-bottom:18px;
}
.home-tab .ds-shelf-head h2{
  font-family:var(--serif-cn); font-size:15px; font-weight:700;
  letter-spacing:2px; color:var(--ds-gold-l); margin:0;
}
.home-tab .ds-shelf-head span{ font-size:11.5px; color:var(--ds-txt-3); letter-spacing:.5px }
.home-tab .ds-spines{ display:flex; gap:9px; justify-content:space-between }
.home-tab .ds-spine{
  position:relative; flex:1 1 auto; height:330px; min-width:0;
  display:flex; flex-direction:column; align-items:center;
  padding:13px 0 14px; gap:7px;
  border:1px solid var(--ds-line-2); border-radius:6px 6px 3px 3px;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.012));
  cursor:pointer; overflow:hidden; font-family:inherit;
  transition:transform .3s cubic-bezier(.2,.8,.3,1), box-shadow .3s, border-color .3s;
}
.home-tab .ds-spine::before{ /* 顶端色条 = 该书主题色 */
  content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background:var(--c,#b8483c); opacity:.95; z-index:1;
}
.home-tab .ds-spine::after{ /* 书口阴影 */
  content:""; position:absolute; right:0; top:0; bottom:0; width:5px;
  background:linear-gradient(90deg,transparent,rgba(0,0,0,.35));
}
.home-tab .ds-spine:hover,.home-tab .ds-spine:focus-visible{
  transform:translateY(-12px); border-color:var(--ds-line); outline:none;
  box-shadow:0 22px 40px rgba(0,0,0,.55), 0 0 0 1px rgba(212,160,74,.18);
}
.home-tab .ds-wash{ /* 用主题色给书脊铺一层淡底 */
  position:absolute; inset:0; pointer-events:none; opacity:.13;
  background:linear-gradient(180deg,var(--c,#b8483c),transparent 58%);
}
.home-tab .ds-spine .no{ font-family:var(--serif-cn); font-size:10.5px; color:var(--ds-txt-3); letter-spacing:1px; line-height:1.4 }
.home-tab .ds-spine .ic{
  font-family:var(--serif-cn); font-size:16px; font-weight:700; line-height:1;
  color:var(--c,#b8483c); filter:brightness(1.75) saturate(1.15);
}
.home-tab .ds-spine .nm{
  writing-mode:vertical-rl; text-orientation:upright;
  font-family:var(--serif-cn); font-size:16.5px; font-weight:700;
  letter-spacing:5px; color:var(--ds-txt); flex:1 1 auto; margin-top:2px;
}
.home-tab .ds-spine .cnt{
  font-size:11px; color:var(--ds-gold); letter-spacing:.5px;
  font-variant-numeric:tabular-nums; white-space:nowrap;
}
.home-tab .ds-shelf-note{
  display:flex; align-items:flex-start; gap:7px;
  margin:16px 0 0; font-size:12px; color:var(--ds-txt-3); line-height:1.9;
}
.home-tab .ds-shelf-note b{ color:var(--ds-gold-l); font-weight:600 }

/* 今日台面（右栏） */
.home-tab .ds-board{ min-width:0 }
.home-tab .ds-clockline{
  display:inline-flex; align-items:center; gap:9px; flex-wrap:wrap;
  font-size:12.5px; color:var(--ds-gold-l); letter-spacing:.6px;
  border:1px solid var(--ds-line); border-radius:999px;
  background:rgba(212,160,74,.07); padding:6px 15px; margin-bottom:22px;
}
.home-tab .ds-clockline .dot{
  width:6px; height:6px; border-radius:50%; background:#7fd6a8;
  box-shadow:0 0 9px #7fd6a8; animation:dsBl 2.2s infinite; flex:0 0 6px;
}
.home-tab .ds-clockline b{ font-weight:600; font-variant-numeric:tabular-nums }
.home-tab .ds-clockline em{ font-style:normal; color:var(--ds-txt-3) }
/* 检索框由 home2.css 的 .nx-search/.nx-sbox/... 提供，这里只改成左对齐、吃满本栏 */
.home-tab .ds-board .nx-search{ max-width:none; margin:0 0 22px; width:100% }
.home-tab .ds-cap{
  font-size:12.5px; color:var(--ds-txt-3); letter-spacing:.5px;
  margin:0 0 11px; text-align:left;
}
.home-tab .ds-cap b{ color:var(--ds-gold-l); font-weight:600 }
.home-tab .ds-board .nx-shint{ justify-content:flex-start }
/* 检索结果面板翻转态：搜索框靠页面下方时，homefx.js 的 sPos() 会把面板翻到输入框【上方】
   （否则会整个盖住输入框）。此时 home2.css 那条「顶部朝上」的小三角要改成「底部朝下」指回搜索框。
   特异性 .home-tab .nx-sres.flip (0,3,1) > .nx-sres (0,1,1)，可稳定覆盖。 */
.home-tab .nx-sres.flip::before{
  top:auto; bottom:calc(var(--arrow-size) * -1 + 1px);
  border-bottom:none;
  border-top:var(--arrow-size) solid rgba(232,185,104,.35);
}
.home-tab .nx-sres.flip::after{
  top:auto; bottom:calc(var(--arrow-size) * -1 + 2px);
  border-bottom:none;
  border-top:calc(var(--arrow-size) - 1px) solid #15171e;
}

/* 两个入口 + 医道值 */
.home-tab .ds-entries{
  display:flex; align-items:center; flex-wrap:wrap; gap:12px;
  margin:6px 0 26px;
}
.home-tab .ds-ebtn{
  display:inline-flex; align-items:center; gap:9px;
  font-family:inherit; font-size:15px; font-weight:600;
  border-radius:10px; padding:13px 26px; cursor:pointer;
  border:1px solid transparent; transition:.26s;
}
.home-tab .ds-ebtn.main{
  background:linear-gradient(150deg,#e6bd68,#b98c37); color:#3a2a0c; border:none;
  box-shadow:0 10px 30px rgba(212,160,74,.24);
}
.home-tab .ds-ebtn.main:hover{ transform:translateY(-2px); box-shadow:0 16px 38px rgba(212,160,74,.34) }
.home-tab .ds-ebtn.ghost{ background:rgba(255,255,255,.045); border-color:var(--ds-line); color:var(--ds-txt) }
.home-tab .ds-ebtn.ghost:hover{ border-color:var(--ds-gold); color:var(--ds-gold-l); background:rgba(212,160,74,.09) }
.home-tab .ds-dao{
  display:inline-flex; align-items:baseline; gap:5px; margin-left:auto;
  color:var(--ds-txt-3); font-size:11.5px; letter-spacing:.5px;
}
.home-tab .ds-dao b{ font-family:var(--serif-cn); font-size:20px; font-weight:900; color:var(--ds-gold-l) }

/* 真实规模带（数字由 app.js renderShelfStats 写 home-stat-*） */
.home-tab .ds-scale{
  display:grid; grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--ds-line-2); border-bottom:1px solid var(--ds-line-2);
}
.home-tab .ds-scale > div{ padding:15px 10px 15px 0; border-right:1px solid var(--ds-line-2) }
.home-tab .ds-scale > div:last-child{ border-right:none }
.home-tab .ds-scale b{
  display:inline-block; font-family:var(--serif-cn); font-size:24px; font-weight:900;
  color:var(--ds-gold-l); letter-spacing:.5px; line-height:1.25;
  font-variant-numeric:tabular-nums;
}
.home-tab .ds-scale em{ font-style:normal; font-size:12px; color:var(--ds-gold); margin-left:3px }
.home-tab .ds-scale span{ display:block; font-size:12px; color:var(--ds-txt-3); letter-spacing:.8px }

/* ---------- 2. 通用区块头（方案自绘，不复用 .nx-sectag 的红药丸） ---------- */
.home-tab .ds-sec{ padding:clamp(48px,7vw,76px) 0 0 }
.home-tab .ds-sec-head{ max-width:760px; margin-bottom:clamp(28px,4vw,44px) }
.home-tab .ds-sec-tag{
  display:inline-block; font-size:11.5px; letter-spacing:3px; color:var(--ds-gold);
  border-left:2px solid var(--ds-gold); padding-left:9px; margin-bottom:14px;
}
.home-tab .ds-sec-head h2{
  font-family:var(--serif-cn); font-weight:900;
  font-size:clamp(22px,2.6vw,30px); letter-spacing:.06em; line-height:1.5;
  color:var(--ds-txt); margin:0 0 12px;
}
.home-tab .ds-sec-head p{ font-size:14.5px; color:var(--ds-txt-2); line-height:1.9; margin:0; font-weight:300 }
.home-tab .ds-foot-note{
  margin:34px 0 0; padding-top:20px; text-align:center;
  border-top:1px solid var(--ds-line-2);
  font-size:13.5px; color:var(--ds-txt-3);
}
.home-tab .ds-foot-note b{ color:var(--ds-gold-l); font-weight:600 }

/* ---------- 3. 二 · 今日功课（每日一方 + 此刻时辰） ---------- */
.home-tab .ds-daily-grid{
  display:grid; grid-template-columns:1.35fr 1fr;
  gap:22px; align-items:stretch;
}
.home-tab .ds-card{
  position:relative; overflow:hidden;
  display:flex; flex-direction:column;
  border:1px solid var(--ds-line-2); border-radius:16px;
  background:var(--ds-card-bg); padding:28px 30px;
}
.home-tab .ds-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,transparent,var(--ds-gold),transparent);
}
.home-tab .ds-card-head{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:12px; flex-wrap:wrap; margin-bottom:6px;
}
.home-tab .ds-card-head h3{
  font-family:var(--serif-cn); font-size:19px; font-weight:700;
  letter-spacing:1.4px; color:var(--ds-txt); margin:0;
}
.home-tab .ds-card-date{ font-size:11.5px; color:var(--ds-gold); letter-spacing:.6px }
.home-tab .ds-card-sub{ font-size:12.5px; color:var(--ds-txt-3); letter-spacing:.5px; margin:0 0 20px; line-height:1.85 }

/* 每日一方：复用 home2.css 的 .nx-daily 内部结构，剥掉它自带的外卡壳，改单列 */
.home-tab .ds-card-rx .nx-daily{
  grid-template-columns:auto 1fr; gap:18px;
  background:none; border:none; border-radius:0; padding:0; box-shadow:none;
}
.home-tab .ds-card-rx .nx-daily::before{ display:none }
.home-tab .ds-card-rx .nx-dc-side{
  grid-column:1 / -1; flex-direction:row; flex-wrap:wrap;
  align-items:center; gap:12px; min-width:0;
}
.home-tab .ds-card-rx .nx-dc-streak{ text-align:left }
.home-tab .ds-card-rx .nx-dc-full{ flex-basis:100% }
.home-tab .ds-card-rx .nx-dc-seal{ width:60px; height:60px; font-size:27px; border-radius:11px }
/* .nx-daily 自身的窄屏断点会把它变单列，这里在窄屏把侧栏也放开 */
@media (max-width:720px){
  .home-tab .ds-card-rx .nx-daily{ grid-template-columns:1fr }
}

/* 此刻时辰 */
.home-tab .ds-zw{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; flex:1 1 auto }
.home-tab .ds-zw-svg{ width:146px; height:146px; flex:0 0 146px }
.home-tab .ds-zw-list{ flex:1 1 150px; min-width:0; display:grid; gap:9px }
.home-tab .ds-zw-item{
  display:flex; align-items:baseline; gap:10px;
  border-bottom:1px solid var(--ds-line-2); padding-bottom:8px;
}
.home-tab .ds-zw-item small{ flex:0 0 56px; font-size:11.5px; color:var(--ds-txt-3); letter-spacing:.8px }
.home-tab .ds-zw-item b{ font-family:var(--serif-cn); font-size:16px; font-weight:700; letter-spacing:1px; color:var(--ds-txt) }
.home-tab .ds-zw-item.good b{ color:#8fd4a8 }
.home-tab .ds-zw-item.bad b{ color:#e8826e }
.home-tab .ds-zw-more{
  margin-top:18px; width:100%; font-family:inherit;
  font-size:13px; color:var(--ds-txt-2);
  background:none; border:1px solid var(--ds-line-2); border-radius:8px;
  padding:10px; cursor:pointer; transition:.22s;
}
.home-tab .ds-zw-more:hover{ color:var(--ds-gold-l); border-color:var(--ds-line); background:rgba(212,160,74,.07) }

/* ---------- 4. 三 ·「一条功课」长什么样 ---------- */
.home-tab .ds-anatomy{
  display:grid; grid-template-columns:1.12fr .88fr;
  gap:clamp(24px,3.4vw,38px); align-items:center;
}
.home-tab .ds-mockpage{
  border:1px solid var(--ds-line); border-radius:14px; overflow:hidden;
  background:linear-gradient(170deg,#171814,#101110);
  box-shadow:0 26px 60px rgba(0,0,0,.5);
}
.home-tab .ds-mp-bar{
  display:flex; align-items:center; gap:9px; padding:11px 15px;
  border-bottom:1px solid var(--ds-line-2); background:rgba(255,255,255,.025);
}
.home-tab .ds-mp-bar i{ width:8px; height:8px; border-radius:50%; background:#4a4a44 }
.home-tab .ds-mp-bar i:first-child{ background:#b8483c }
.home-tab .ds-mp-bar span{ margin-left:4px; font-size:11.5px; color:var(--ds-txt-3); letter-spacing:1px }
.home-tab .ds-mp-body{ display:grid; grid-template-columns:1fr 1fr; min-height:248px }
.home-tab .ds-mp-left{
  display:flex; flex-direction:column; gap:10px;
  padding:18px; border-right:1px solid var(--ds-line-2);
}
.home-tab .ds-mp-fig{
  flex:1 1 auto; display:grid; place-items:center; padding:8px;
  border:1px dashed var(--ds-line); border-radius:10px; background:rgba(212,160,74,.045);
}
.home-tab .ds-mp-left .ds-cap2{ font-size:11px; color:var(--ds-txt-3); text-align:center; letter-spacing:.5px }
.home-tab .ds-mp-right{ display:flex; flex-direction:column; gap:9px; padding:18px }
.home-tab .ds-mp-right .ds-ttl{
  font-family:var(--serif-cn); font-size:14.5px; font-weight:700;
  letter-spacing:1px; color:var(--ds-gold-l); margin-bottom:3px;
}
.home-tab .ds-ln{ height:8px; border-radius:4px; background:rgba(255,255,255,.13) }
.home-tab .ds-ln.hi{ background:rgba(212,160,74,.42) }
.home-tab .ds-ln.s{ width:62% } .home-tab .ds-ln.m{ width:86% }
.home-tab .ds-ln.l{ width:100% } .home-tab .ds-ln.xs{ width:44% }
.home-tab .ds-mp-cite{
  margin-top:auto; display:flex; align-items:center; gap:7px;
  border-top:1px dashed var(--ds-line-2); padding-top:10px;
  font-size:11px; color:var(--ds-txt-3);
}
.home-tab .ds-mp-cite b{ color:var(--ds-gold); font-weight:600 }
.home-tab .ds-mp-foot{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:10px 15px; border-top:1px solid var(--ds-line-2);
  font-size:11.5px; color:var(--ds-txt-3);
}
.home-tab .ds-mp-foot .ds-pill2{ border:1px solid var(--ds-line-2); border-radius:999px; padding:2px 10px }
.home-tab .ds-mp-foot .ds-pill2.gold{ border-color:var(--ds-line); color:var(--ds-gold-l) }
.home-tab .ds-notes{ display:grid; gap:16px }
.home-tab .ds-note{
  border-left:2px solid var(--ds-line); padding:2px 0 2px 16px; transition:.26s;
}
.home-tab .ds-note:hover{ border-left-color:var(--ds-gold) }
.home-tab .ds-note h4{
  font-family:var(--serif-cn); font-size:16px; font-weight:700;
  letter-spacing:1px; margin:0 0 5px; color:var(--ds-txt);
}
.home-tab .ds-note p{ font-size:13.5px; color:var(--ds-txt-2); line-height:1.85; margin:0 }
.home-tab .ds-note .ds-idx{ font-family:var(--serif-cn); color:var(--ds-gold); font-size:13px; margin-right:6px }

/* ---------- 5. 四 · 七件工具 ---------- */
.home-tab .ds-tools{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px }
.home-tab .ds-tool{
  position:relative; overflow:hidden; text-align:left;
  font-family:inherit; cursor:pointer; text-decoration:none;
  border:1px solid var(--ds-line-2); border-radius:13px;
  background:rgba(255,255,255,.035); padding:22px 20px; transition:.28s;
}
.home-tab .ds-tool:hover,.home-tab .ds-tool:focus-visible{
  border-color:var(--ds-line); background:rgba(255,255,255,.065);
  transform:translateY(-4px); outline:none;
}
.home-tab .ds-tool .ds-bg-ic{
  position:absolute; right:-8px; bottom:-16px; line-height:1; pointer-events:none;
  font-family:var(--serif-cn); font-size:64px; font-weight:700; color:rgba(212,160,74,.07);
}
.home-tab .ds-tool .ds-k{
  display:block; margin-bottom:10px;
  font-family:var(--serif-cn); font-size:21px; font-weight:700; color:var(--ds-gold);
}
.home-tab .ds-tool strong{ display:block; margin-bottom:6px; font-size:15.5px; font-weight:600; letter-spacing:.5px; color:var(--ds-txt) }
.home-tab .ds-tool small{ display:block; font-size:12.5px; color:var(--ds-txt-3); line-height:1.75 }

/* ---------- 6. 五 · 学习顺序 ---------- */
.home-tab .ds-path{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px }
.home-tab .ds-step{
  position:relative; text-align:left; font-family:inherit; cursor:pointer;
  border:1px solid var(--ds-line-2); border-radius:13px;
  background:rgba(255,255,255,.032); padding:22px 18px; transition:.28s;
}
.home-tab .ds-step:hover,.home-tab .ds-step:focus-visible{
  border-color:var(--ds-line); background:rgba(212,160,74,.07);
  transform:translateY(-4px); outline:none;
}
.home-tab .ds-step .ds-sn{ display:block; margin-bottom:10px; font-family:var(--serif-cn); font-size:12px; color:var(--ds-gold); letter-spacing:2px }
.home-tab .ds-step h4{
  font-family:var(--serif-cn); font-size:18px; font-weight:700;
  letter-spacing:1.4px; margin:0 0 7px; color:var(--ds-txt);
}
.home-tab .ds-step p{ font-size:12.5px; color:var(--ds-txt-2); line-height:1.8; margin:0 }
.home-tab .ds-step .ds-c{
  display:inline-block; margin-top:12px; padding:1px 8px;
  font-size:11.5px; color:var(--ds-gold-l);
  border:1px solid var(--ds-line); border-radius:4px;
}
.home-tab .ds-step:not(:last-child)::after{
  content:"›"; position:absolute; right:-11px; top:50%; transform:translateY(-50%);
  color:var(--ds-line); font-size:20px; z-index:2;
}

/* ---------- 7. 六 · 三种用法 ---------- */
.home-tab .ds-ways{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px }
.home-tab .ds-way{
  border:1px solid var(--ds-line-2); border-radius:14px; padding:26px 24px;
  background:linear-gradient(170deg,rgba(255,255,255,.05),rgba(255,255,255,.012));
  transition:.28s;
}
.home-tab .ds-way:hover{ border-color:var(--ds-line); transform:translateY(-4px) }
.home-tab .ds-way .ds-tm{
  margin-bottom:12px; font-family:ui-monospace,Menlo,monospace;
  font-size:12.5px; color:var(--ds-gold); letter-spacing:1.5px;
}
.home-tab .ds-way h4{
  font-family:var(--serif-cn); font-size:17.5px; font-weight:700;
  letter-spacing:1px; margin:0 0 8px; color:var(--ds-txt);
}
.home-tab .ds-way p{ font-size:13.5px; color:var(--ds-txt-2); line-height:1.85; margin:0 }
.home-tab .ds-way p b{ color:var(--ds-txt); font-weight:600 }

/* ---------- 8. 七 · 费用说明 ---------- */
.home-tab .ds-terms{ display:grid; grid-template-columns:1.15fr .85fr; gap:22px }
.home-tab .ds-terms .ds-card{ padding:28px 30px }
.home-tab .ds-terms h3{ display:flex; align-items:center; gap:10px; margin:0 0 16px }
.home-tab .ds-terms h3 .ds-sf{
  width:26px; height:26px; flex:0 0 26px; border-radius:7px;
  display:grid; place-items:center; font-family:var(--serif-cn);
  font-size:13px; font-weight:700; font-style:normal;
}
.home-tab .ds-card-free h3 .ds-sf{ background:rgba(91,140,90,.24); color:#a8dfa5 }
.home-tab .ds-card-paid h3 .ds-sf{ background:rgba(212,160,74,.22); color:var(--ds-gold-l) }
.home-tab .ds-terms ul{ list-style:none; display:grid; gap:12px; margin:0; padding:0 }
.home-tab .ds-terms li{
  position:relative; padding-left:20px;
  font-size:13.8px; color:var(--ds-txt-2); line-height:1.85;
}
.home-tab .ds-terms li::before{
  content:""; position:absolute; left:2px; top:10px;
  width:6px; height:6px; border-radius:2px; background:var(--ds-gold);
  opacity:.55;
}
.home-tab .ds-card-free li::before{ background:var(--ds-jade); opacity:.85 }
.home-tab .ds-terms li b{ color:var(--ds-txt); font-weight:600 }
.home-tab .ds-terms .ds-link{
  font-family:inherit; font-size:inherit; cursor:pointer;
  background:none; border:none; padding:0;
  color:var(--ds-gold-l); font-weight:600;
  border-bottom:1px dashed rgba(232,185,104,.45);
}
.home-tab .ds-terms .ds-link:hover{ color:#f3d9a0 }
.home-tab .ds-terms .ds-fine{
  margin-top:16px; padding-top:14px; border-top:1px dashed var(--ds-line-2);
  font-size:12px; color:var(--ds-txt-3); line-height:1.8;
}
.home-tab .ds-warn{
  grid-column:1 / -1;
  border:1px solid rgba(201,85,63,.28); border-radius:14px;
  background:linear-gradient(160deg,rgba(201,85,63,.075),rgba(201,85,63,.02));
  padding:26px 30px;
}
.home-tab .ds-warn h3{
  display:flex; align-items:center; gap:10px; margin:0 0 14px;
  font-family:var(--serif-cn); font-size:16.5px; font-weight:700;
  letter-spacing:1px; color:#eda897;
}
.home-tab .ds-warn h3 .ds-w{
  width:26px; height:26px; flex:0 0 26px; border-radius:7px;
  display:grid; place-items:center; font-style:normal;
  background:rgba(201,85,63,.24); font-size:14px; font-weight:800; color:#f0b3a2;
}
.home-tab .ds-warn p{ margin:0; font-size:13.5px; color:#d8c4bd; line-height:1.95 }
.home-tab .ds-warn p b{ color:#fff; font-weight:600 }

/* ---------- 9. 结语 ---------- */
.home-tab .ds-quote{
  max-width:1120px; margin:0 auto;
  padding:clamp(48px,7vw,76px) clamp(16px,4vw,32px) clamp(40px,6vw,64px);
  text-align:center;
}
.home-tab .ds-quote p{
  margin:0 auto; max-width:720px; font-family:var(--serif-cn);
  font-size:clamp(15px,2vw,18px); line-height:2.1; color:var(--ds-txt-2); letter-spacing:.06em;
}
.home-tab .ds-quote p em{ font-style:normal; color:var(--ds-gold-l) }
.home-tab .ds-quote .ds-warnline{
  margin-top:22px; font-family:inherit; font-size:12.5px; line-height:1.95;
  color:var(--ds-txt-3); letter-spacing:0;
}
.home-tab .ds-quote .ds-warnline b{ color:#e0a898; font-weight:600 }

/* ---------- 10. 响应式 ---------- */
@media (max-width:1120px){
  .home-tab .ds-tools{ grid-template-columns:repeat(2,1fr) }
  .home-tab .ds-path{ grid-template-columns:repeat(3,1fr) }
  .home-tab .ds-step:not(:last-child)::after{ display:none }
}
/* 立绘由 home2.css 在 <1100px 隐藏，这里同步放开文案与两栏间距 */
@media (max-width:1080px){
  .home-tab .ds-hook{ max-width:none }
}
@media (max-width:980px){
  .home-tab .ds-desk-grid{ grid-template-columns:1fr; gap:34px }
  .home-tab .ds-shelf{
    border-right:none; padding-right:0;
    border-bottom:1px solid var(--ds-line-2); padding-bottom:28px;
  }
  .home-tab .ds-spine{ height:224px }
  .home-tab .ds-daily-grid,
  .home-tab .ds-anatomy,
  .home-tab .ds-terms{ grid-template-columns:1fr }
  .home-tab .ds-mp-body{ grid-template-columns:1fr }
  .home-tab .ds-mp-left{ border-right:none; border-bottom:1px solid var(--ds-line-2) }
  .home-tab .ds-ways{ grid-template-columns:1fr }
  .home-tab .ds-scale{ grid-template-columns:repeat(2,1fr) }
  .home-tab .ds-scale > div:nth-child(2){ border-right:none }
}
@media (max-width:640px){
  .home-tab .ds-spines{ flex-wrap:wrap; gap:8px; justify-content:flex-start }
  .home-tab .ds-spine{ flex:0 0 calc(33.33% - 6px); height:200px }
  .home-tab .ds-spine .nm{ font-size:14px; letter-spacing:3px }
  .home-tab .ds-tools{ grid-template-columns:1fr }
  .home-tab .ds-path{ grid-template-columns:1fr 1fr }
  .home-tab .ds-h1{ font-size:26px; line-height:1.4 }
  .home-tab .ds-lede{ font-size:14px; line-height:1.92 }
  .home-tab .ds-facts{ gap:8px 16px; font-size:12px }
  .home-tab .ds-card{ padding:22px 18px }
  .home-tab .ds-ebtn{ flex:1 1 100%; justify-content:center }
  .home-tab .ds-dao{ margin-left:0 }
}