/* ============================================================
   深圳教招·备考一站通 —— 全站视觉皮肤（书卷 / 纸感）
   ------------------------------------------------------------
   定位：唯一的「外观层」。以最后加载的覆盖样式统一全站视觉，
        页面本体的内容与结构不动。
   风格：宣纸底 · 墨色字 · 朱砂/赭石/黛青三点强调 · 低圆角 · 轻阴影
   加载：每页 </head> 前以 <link> 引入（须晚于页面自身的 <style>）
   依赖：CSS 变量 + 属性/类选择器，不改 HTML 结构
   ============================================================ */

/* ---------- 一、设计令牌 ---------- */
:root{
  /* 纸与墨 */
  --sk-paper:#fbf8f1;        /* 卡片：宣纸 */
  --sk-paper-2:#f4efe4;      /* 次级面 */
  --sk-bg:#efe9dc;           /* 页面底：更沉的纸 */
  --sk-ink:#2b2621;          /* 正文墨色 */
  --sk-ink-2:#4a4239;        /* 次级文字 */
  --sk-mut:#6b6154;          /* 弱化文字：对 --sk-paper 约 5.3:1 */
  --sk-line:#ddd4c0;         /* 界线 */
  --sk-line-2:#c9bda4;       /* 强界线 */

  /* 三点强调：主色用赭褐（书卷感），朱砂/黛青/赭石为辅 */
  --sk-cn:#a8443a;           /* 朱砂：易错 / 重点 / 警示 */
  --sk-cn-bg:#f9ece9;
  --sk-cn-line:#e6c8c2;
  --sk-dai:#7a4a30;          /* 赭褐：主色 / 链接 / 结构性强调 */
  --sk-dai-bg:#f3e9df;
  --sk-dai-line:#dcc7b1;
  --sk-zhe:#8a6a24;          /* 赭石：星级 / 提示 */
  --sk-zhe-bg:#f8f1de;
  --sk-zhe-line:#e2d0a4;
  --sk-dai-2:#5b6742;        /* 苔绿：正面例证 */
  --sk-dai2-bg:#eef0e4;
  --sk-dai2-line:#ccd4b4;
  --sk-qing:#3c5a6b;         /* 黛青：仅用于需要冷静感的信息块 */

  /* 尺度 */
  --sk-r:6px;                /* 统一圆角：书卷感取小值 */
  --sk-r-lg:10px;
  --sk-shadow:0 1px 2px rgba(58,48,34,.05);
  --sk-shadow-h:0 6px 20px -12px rgba(58,48,34,.32);

  /* 排版 */
  --sk-serif:"Source Han Serif SC","Noto Serif SC","Songti SC","STSong","SimSun",serif;
  --sk-sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
}

/* ---------- 二、令牌桥接：让页面既有变量改用皮肤值 ---------- */
:root{
  --bg:var(--sk-bg);
  --card:var(--sk-paper);
  --paper:var(--sk-paper);
  --line:var(--sk-line);
  --ink:var(--sk-ink);
  --mut:var(--sk-mut);
  --muted:var(--sk-mut);
  --pri:var(--sk-dai);
  --ok:var(--sk-dai-2);
  --err:var(--sk-cn);
  --cn:var(--sk-cn);   --cn-bg:var(--sk-cn-bg);
  --fr:var(--sk-dai);  --fr-bg:var(--sk-dai-bg);
  --gold:var(--sk-zhe);--gold-bg:var(--sk-zhe-bg);
  --grn:var(--sk-dai-2);--grn-bg:var(--sk-dai2-bg);
}

/* ---------- 三、基础排版 ---------- */
body{
  background:var(--sk-bg);
  color:var(--sk-ink);
  font-family:var(--sk-serif);
  line-height:1.9;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* 正文：字号与行距（行长交给 .wrap，元素不再限宽） */
section p,section li,.kd .body p,.ctx p,.jj p{
  font-size:15.5px;
  line-height:1.95;
}

/* 标题：墨色加重，字距放开，层级用色而非仅用号 */
h1{
  font-family:var(--sk-serif);
  font-size:29px;
  font-weight:700;
  letter-spacing:.04em;
  color:var(--sk-ink);
  line-height:1.4;
}
h2{
  font-family:var(--sk-serif);
  font-size:18.5px;
  font-weight:700;
  letter-spacing:.05em;
  color:var(--sk-ink);
  border-left:3px solid var(--sk-cn);
  padding-left:12px;
  margin:0 0 14px;
}
h3{
  font-family:var(--sk-serif);
  font-size:16px;
  font-weight:700;
  color:var(--sk-ink);
  letter-spacing:.03em;
  margin:18px 0 6px;
}
h4{font-size:14.5px;color:var(--sk-ink-2);font-weight:700}

.subtitle{color:var(--sk-ink-2);font-size:14.5px;line-height:1.8}
.meta{color:var(--sk-mut);font-size:12.5px;line-height:1.8}

/* 链接：黛青，下划线改为点线，悬停才显 */
a{color:var(--sk-dai);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}

/* ---------- 四、容器：纸面 + 细界线 + 轻阴影 ---------- */
section,.card,.hero,header.hero{
  background:var(--sk-paper);
  border:1px solid var(--sk-line);
  border-radius:var(--sk-r-lg);
  box-shadow:var(--sk-shadow);
}
section{padding:20px 26px;margin-bottom:16px}
header.hero{padding:30px 32px;margin-bottom:20px}

/* ---- 行长由容器决定，不由元素max-width 决定 ----
   原先给 section p/li、.warn、.quote、.ctx、.fm、.jj、.kd .body p 各自
   加了 max-width:36em（≈558px），而 .wrap 宽 980px → 文字只占左侧六成，
   右侧空出约 370px，视觉上「偏左」。改为：容器收窄到适合阅读的宽度，
   元素不再限宽，文字自然撑满容器。 */
.wrap{
  width:100%;
  max-width:820px;          /* doc 页：正文行长约 34 汉字 */
  margin:0 auto;
  padding:24px 20px 64px;
}
/* 目录/索引页：条目横排，需要更宽 */
body[data-view="list"] .wrap{max-width:1180px;padding:24px 28px 64px}
/* 首页门户：卡片网格 */
body[data-view="home"] .wrap{max-width:960px}
/* 刷题站：题干与选项需要横向空间 */
body[data-view="quiz"] .wrap{max-width:880px}

.foot{
  color:var(--sk-mut);
  border-top:1px solid var(--sk-line);
  font-size:12.5px;
  letter-spacing:.02em;
}

/* ---------- 五、组件 ---------- */

/* 考点块 */
.kd{border-radius:var(--sk-r)}
.kd.s3{background:var(--sk-cn-bg);border:1px solid var(--sk-cn-line);border-left:3px solid var(--sk-cn)}
.kd.s2{background:var(--sk-zhe-bg);border:1px solid var(--sk-zhe-line)}
.kd.s1{background:var(--sk-paper-2);border:1px solid var(--sk-line)}


/* 星级徽标 */
.stars{
  font-family:var(--sk-sans);
  background:var(--sk-zhe-bg);
  color:var(--sk-zhe);
  border:1px solid var(--sk-zhe-line);
  border-radius:4px;
  font-weight:600;
  letter-spacing:.04em;
}
.kd.s3 .stars{background:var(--sk-cn);color:#fff;border-color:var(--sk-cn)}
.kd.s2 .stars{background:var(--sk-zhe-bg);color:var(--sk-zhe);border-color:var(--sk-zhe-line)}
.kd.s1 .stars{background:var(--sk-paper-2);color:var(--sk-mut);border-color:var(--sk-line)}
.kd.s0 .stars{background:transparent;color:var(--sk-mut);border:1px dashed var(--sk-line-2)}

/* 易混辨析：朱砂左边线 */
.warn{
  background:var(--sk-cn-bg);
  border:1px solid var(--sk-cn-line);
  border-left:3px solid var(--sk-cn);
  border-radius:var(--sk-r);
  color:var(--sk-ink);
  padding:12px 18px;
}

/* 原典引文：黛青，衬线，竖线 */
.quote{
  background:var(--sk-dai-bg);
  border:1px solid var(--sk-dai-line);
  border-left:3px solid var(--sk-dai);
  border-radius:var(--sk-r);
  color:var(--sk-ink);
  font-family:var(--sk-serif);
  padding:12px 18px;
}
.quote small{color:var(--sk-mut)}

/* 口诀：赭石底，等宽感 */
.mn{
  background:var(--sk-zhe-bg);
  border:1px solid var(--sk-zhe-line);
  border-radius:var(--sk-r);
  color:var(--sk-ink);
}

/* 背景框（时代背景等） */
.ctx{
  background:var(--sk-paper-2);
  border:1px solid var(--sk-line);
  border-left:3px solid var(--sk-dai);
  border-radius:var(--sk-r);
  color:var(--sk-ink);
  font-size:15px;
  line-height:1.95;
}

/* 核心命题精解 */
.jj{
  background:var(--sk-paper);
  border:1px solid var(--sk-line);
  border-radius:var(--sk-r);
}

/* 章节内小标题 */
.hn{color:var(--sk-cn);font-weight:700;letter-spacing:.04em}
/* 章节溯源 */
.secref{color:var(--sk-mut);font-size:12.5px;letter-spacing:.02em}

/* 上岸笔记徽标 */
.bk{
  color:var(--sk-zhe);
  background:var(--sk-zhe-bg);
  border:1px solid var(--sk-zhe-line);
  border-radius:4px;
  font-family:var(--sk-sans);
}

/* 思想关联 */
.relrow,.gxline{color:var(--sk-ink-2)}
.rel{color:var(--sk-ink-2)}
.rel b,.gxline b{color:var(--sk-ink)}

/* 标签 / 芯片 */
.tag,.part-tag,.sz,.pchip,.heat{
  font-family:var(--sk-sans);
  border-radius:4px;
  letter-spacing:.03em;
}
.sz,.pchip{background:var(--sk-dai-bg);border:1px solid var(--sk-dai-line);color:var(--sk-dai)}
.sz.hot,.pchip.hot{background:var(--sk-cn-bg);border-color:var(--sk-cn-line);color:var(--sk-cn)}
.sz.none{background:transparent;border:1px dashed var(--sk-line-2);color:var(--sk-mut)}
.heat.high{background:var(--sk-cn-bg);border-color:var(--sk-cn-line);color:var(--sk-cn)}

.part-tag.edu{background:var(--sk-cn-bg);color:var(--sk-cn);border:1px solid var(--sk-cn-line)}
.part-tag.psy{background:var(--sk-dai-bg);color:var(--sk-dai);border:1px solid var(--sk-dai-line)}
.part-tag.epy{background:var(--sk-zhe-bg);color:var(--sk-zhe);border:1px solid var(--sk-zhe-line)}
.part-tag.law{background:var(--sk-dai2-bg);color:var(--sk-dai-2);border:1px solid var(--sk-dai2-line)}

/* 图例说明 */
.legend{color:var(--sk-mut);font-size:12.5px}

/* ---------- 六、表格 ---------- */
table{border-collapse:collapse;font-size:14px}
th,td{border:1px solid var(--sk-line);padding:9px 12px}
th{
  background:var(--sk-paper-2);
  color:var(--sk-ink);
  font-family:var(--sk-sans);
  font-weight:600;
  font-size:13px;
  letter-spacing:.03em;
}
tbody tr:nth-child(even) td{background:var(--sk-paper-2)}

/* ---------- 七、理论框架树（.fm）---------- */
.fm{
  background:var(--sk-paper-2);
  border:1px solid var(--sk-line);
  border-left:3px solid var(--sk-dai);
  border-radius:var(--sk-r);
}
.fmroot{color:var(--sk-cn);letter-spacing:.03em}
.fmroot em{color:var(--sk-mut);font-weight:400}
.fm li::before{background:var(--sk-line-2)}
.fm li::after{background:var(--sk-line-2)}
.fm li.hot{color:var(--sk-cn)}
.fmcap{color:var(--sk-mut);border-top:1px dashed var(--sk-line)}

/* ---------- 八、导航 ---------- */
nav.top{
  background:color-mix(in srgb,var(--sk-paper) 92%,transparent);
  backdrop-filter:saturate(1.4) blur(8px);
  border:1px solid var(--sk-line);
  border-radius:var(--sk-r);
  box-shadow:var(--sk-shadow);
}
nav.top a{
  background:var(--sk-paper);
  border:1px solid var(--sk-line);
  border-radius:4px;
  color:var(--sk-ink-2);
  font-family:var(--sk-sans);
  transition:border-color .18s,color .18s,background .18s;
}
nav.top a:hover{
  background:var(--sk-paper-2);
  border-color:var(--sk-dai);
  color:var(--sk-dai);
  text-decoration:none;
}
.backbar{
  background:var(--sk-dai-bg);
  border:1px solid var(--sk-dai-line);
  border-radius:var(--sk-r);
}
.backbar a{color:var(--sk-dai)}
.pager{
  background:var(--sk-paper);
  border:1px solid var(--sk-line);
  border-radius:var(--sk-r-lg);
  box-shadow:var(--sk-shadow);
}
.pglink{color:var(--sk-dai);font-family:var(--sk-sans)}
.pglabel{color:var(--sk-mut);font-family:var(--sk-sans)}

/* ---------- 九、缺陷修复层 + 内联冷色收口 ----------
   ① 修复：原先这批块用内联 style 写死浅底且未写死字色，
      深色模式下浅底压浅字 → 几乎不可读。
   ② 收口：全站内联样式里 476 处 color 只用了 3 个值（#1f5f8b 蓝 228 /
      #5b6472 灰 205 / #b03a2e 红 43），背景 168 处也只有 6 个值。
      与其逐页改 92 个 HTML，不如在皮肤层按「属性值 → 令牌」整体重映射，
      冷蓝一次性换成黛青/朱砂，且深浅两套自动跟随变量。
   内联样式 specificity 高于类规则，故此处一律 !important。 */

/* ① 浅底块可读性（4 类语义） */
/* 顶部返回条 / 目录条 */
[style*="background:#eef3fa"]{
  background:var(--sk-dai-bg)!important;
  border-color:var(--sk-dai-line)!important;
  color:var(--sk-ink)!important;
}
/* 真题命中统计块 */
[style*="background:#eef5fa"]{
  background:var(--sk-paper-2)!important;
  border-color:var(--sk-line)!important;
  color:var(--sk-ink)!important;
}
/* 校招新重点块 */
[style*="background:#eef7f2"]{
  background:var(--sk-dai2-bg)!important;
  border-color:var(--sk-dai2-line)!important;
  color:var(--sk-ink)!important;
}
/* 思想关联尾块 / 通用白底块 */
[style*="background:#fff"]{
  background:var(--sk-paper-2)!important;
  border-color:var(--sk-line)!important;
  color:var(--sk-ink)!important;
}
/* 浅灰块 */
[style*="background:#f5f5f5"],[style*="background:#f7f9fc"]{
  background:var(--sk-paper-2)!important;
  color:var(--sk-ink)!important;
}
/* 命中统计块内的强调色：蓝 → 朱砂 */
[style*="background:#eef5fa"] b{color:var(--sk-cn)!important}
[style*="background:#eef5fa"] span{color:var(--sk-mut)!important}

/* 内联浅底块内的链接按钮：字色需比块内正文更亮一档才够 4.5:1 */
[style*="background:#eef3fa"] a,
[style*="background:#eef5fa"] a,
[style*="background:#eef7f2"] a,
[style*="background:#fff"] a,
[style*="background:#f5f5f5"] a{color:var(--sk-dai)!important}

/* ② 内联冷色 → 皮肤令牌（三组，各自的深浅两态由变量自动接管） */
[style*="color:#1f5f8b"]{color:var(--sk-dai)!important}          /* 蓝 228 处 → 黛青 */
[style*="color:#5b6472"]{color:var(--sk-mut)!important}          /* 灰 205 处 → 弱化字色 */
[style*="color:#b03a2e"]{color:var(--sk-cn)!important}           /* 红  43 处 → 朱砂 */
[style*="border-color:#c5d9e8"],
[style*="border-color:#cfd5dc"]{
  border-color:var(--sk-line)!important;
}
/* 未被上面命中的内联边框色（border:1px solid #xxx 形式） */
[style*="border:1px solid #d5e2f0"],
[style*="border:1px solid #eef5fa"],
[style*="border:1px solid #c5d9e8"]{
  border-color:var(--sk-line)!important;
}

/* ④ 页面自身样式表里的冷色表格/条纹，在皮肤层改回纸面色系 */
table tr{background:transparent}
tbody tr:nth-child(even){background:var(--sk-paper-2)}
tbody tr:nth-child(even) td{background:var(--sk-paper-2)}
th{background:var(--sk-paper-2)}

/* ⑤ 索引页 / 目录页的类级冷色（.cn / .pglink / .ptag / .chlist / .kbnote …） */
.cn{color:var(--sk-dai)}
.pglink{color:var(--sk-dai)}

/* 章节链接：纸面小片，悬停显赭边 */
.chlist a{
  background:var(--sk-paper);
  border:1px solid var(--sk-line);
  border-radius:4px;
  color:var(--sk-ink-2);
  font-family:var(--sk-sans);
  transition:border-color .16s,color .16s,background .16s;
}
.chlist a:hover{border-color:var(--sk-dai);color:var(--sk-dai);text-decoration:none;background:var(--sk-paper-2)}
.chlist a .cn{color:var(--sk-dai)}
.chlist a.site{background:var(--sk-paper-2);border-color:var(--sk-dai-line)}
.chlist a.intro{background:var(--sk-zhe-bg);border-color:var(--sk-zhe-line)}
.chlist a.intro .cn{color:var(--sk-zhe)}
.chlist a.off{background:transparent;border-style:dashed;color:var(--sk-mut)}
.chlist a.off .cn{color:var(--sk-mut)}

/* 学科标签：五行各有归属，统一降饱和以贴合纸面 */
.ptag,.tag{
  font-family:var(--sk-sans);
  border-radius:4px;
  letter-spacing:.03em;
}
.ptag,.tag.edu{background:var(--sk-cn-bg);color:var(--sk-cn);border:1px solid var(--sk-cn-line)}
.ptag.his,.tag.his{background:#f7ece1;color:#8a5524;border:1px solid #e0cbb2}
.ptag.psy,.tag.psy{background:var(--sk-dai-bg);color:var(--sk-dai);border:1px solid var(--sk-dai-line)}
.ptag.epy,.tag.epy{background:#efe9f2;color:#6b4a86;border:1px solid #d9cce2}
.ptag.law,.tag.law{background:var(--sk-dai2-bg);color:var(--sk-dai-2);border:1px solid var(--sk-dai2-line)}
.ptag.fr,.tag.fr{background:var(--sk-dai-bg);color:var(--sk-dai);border:1px solid var(--sk-dai-line)}
.ptag.out,.tag.out,.ptag.persons,.tag.persons{
  background:var(--sk-zhe-bg);color:var(--sk-zhe);border:1px solid var(--sk-zhe-line);
}

/* 说明框 */
.kbnote{
  background:var(--sk-paper-2);
  border:1px solid var(--sk-line);
  border-radius:var(--sk-r);
  color:var(--sk-ink-2);
}
.kbnote code{
  background:var(--sk-bg);
  color:var(--sk-ink);
  border:1px solid var(--sk-line);
  border-radius:3px;
}

/* 篇块分隔：虚线改淡 */
.partblk{border-bottom:1px dashed var(--sk-line)}
.partblk h3{color:var(--sk-ink);font-family:var(--sk-serif);letter-spacing:.04em}
.pmeta,.pbook{color:var(--sk-mut);font-family:var(--sk-sans)}
.mid{background:var(--sk-paper-2);color:var(--sk-mut);border-color:var(--sk-line)}

/* 索引页双 Tab 切换：药丸改方角，选中态用赭褐 */
.tabs{gap:8px}
.tab{
  font-family:var(--sk-sans);
  font-size:13px;
  padding:6px 16px;
  border-radius:4px;
  background:var(--sk-paper);
  border:1px solid var(--sk-line);
  color:var(--sk-ink-2);
  transition:background .16s,color .16s,border-color .16s;
}
.tab:hover{border-color:var(--sk-dai);color:var(--sk-dai)}
.tab.on{background:var(--sk-dai);color:#fff;border-color:var(--sk-dai)}

/* ---------- 十一、悬浮控件（听书 / 返回 / 导航） ---------- */
.fab{
  font-family:var(--sk-sans);
  background:var(--sk-paper);
  border:1px solid var(--sk-line);
  border-radius:4px;
  color:var(--sk-ink-2);
  box-shadow:var(--sk-shadow-h);
  transition:border-color .16s,color .16s,background .16s;
}
.fab:hover{border-color:var(--sk-dai);color:var(--sk-dai);text-decoration:none;background:var(--sk-paper-2)}

.tts-fab{
  background:var(--sk-dai);
  color:#fff;
  border:1px solid var(--sk-dai);
  border-radius:4px;
  font-family:var(--sk-sans);
  box-shadow:var(--sk-shadow-h);
  transition:background .16s,border-color .16s;
}
.tts-fab:hover{background:var(--sk-cn);border-color:var(--sk-cn)}
.tts-panel{
  background:var(--sk-paper);
  border:1px solid var(--sk-line);
  border-radius:var(--sk-r-lg);
  color:var(--sk-ink);
  box-shadow:var(--sk-shadow-h);
}
.tts-panel button{
  background:var(--sk-paper-2);
  border:1px solid var(--sk-line);
  border-radius:4px;
  color:var(--sk-ink-2);
  font-family:var(--sk-sans);
}
.tts-panel button:hover{border-color:var(--sk-dai);color:var(--sk-dai)}

/* ---------- 十、首页门户 ---------- */
/* 这部分样式在 index.html 内联定义，此处按皮肤令牌重述，保证一致 */
.hero{position:relative;overflow:hidden}
.hero h1{
  font-family:var(--sk-serif);
  font-size:34px;
  font-weight:700;
  letter-spacing:.1em;
  color:var(--sk-ink);
}
.hero .sub{color:var(--sk-ink-2);font-size:15px;line-height:1.85}
.hero .tags span{
  background:var(--sk-paper-2);
  border:1px solid var(--sk-line);
  border-radius:4px;
  color:var(--sk-mut);
  font-family:var(--sk-sans);
}
.hero .tags b{color:var(--sk-ink)}
/* 竖排细线，作书卷「界栏」 */
.hero-rule{
  position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg,var(--sk-cn),var(--sk-zhe) 55%,transparent);
}

/* 题库规模四联排 */
.stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin:0 0 20px;
}
@media(max-width:760px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat{
  background:var(--sk-paper);
  border:1px solid var(--sk-line);
  border-radius:var(--sk-r);
  box-shadow:var(--sk-shadow);
  padding:14px 16px;
  text-align:center;
}
.stat b{
  display:block;
  font-family:var(--sk-serif);
  font-size:27px;
  font-weight:700;
  line-height:1.2;
  color:var(--sk-cn);
  letter-spacing:.02em;
}
.stat span{display:block;margin-top:3px;font-size:13px;color:var(--sk-ink);font-family:var(--sk-sans);font-weight:600}
.stat i{display:block;margin-top:2px;font-size:11.5px;color:var(--sk-mut);font-style:normal;font-family:var(--sk-sans)}

.card{
  background:var(--sk-paper);
  border:1px solid var(--sk-line);
  border-radius:var(--sk-r-lg);
  box-shadow:var(--sk-shadow);
  transition:transform .2s,box-shadow .2s,border-color .2s;
}
.card:hover{
  transform:translateY(-2px);
  box-shadow:var(--sk-shadow-h);
  border-color:var(--sk-line-2);
}
.card h2{
  font-family:var(--sk-serif);
  border:0;
  padding:0;
  color:var(--sk-ink);
  letter-spacing:.06em;
}
.card p{color:var(--sk-ink-2)}
.card .cnt{background:var(--sk-dai);border-radius:4px;font-family:var(--sk-sans)}
/* 线性 SVG 图标，替掉彩色 Emoji */
.card .ic{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:46px;height:46px;
  border-radius:var(--sk-r);
  background:var(--sk-paper-2);
  border:1px solid var(--sk-line);
  line-height:0;
}
.card .ic svg{width:24px;height:24px;stroke:var(--sk-dai);fill:none;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.card.sm .ic{width:34px;height:34px}
.card.sm .ic svg{width:18px;height:18px}
.card .cnt{color:#fff}

/* ---------- 十二、刷题站 ---------- */
/* 刷题站样式自成一套冷蓝体系，但全部走 CSS 变量，
   故只需重定义变量即可整体转向，无需逐条改其内联样式。 */
:root{
  --pri:var(--sk-dai);
  --err:var(--sk-cn);
  --ok:var(--sk-dai-2);
  --line-2:var(--sk-line-2);
}
.opt{
  background:var(--sk-paper);
  border:1.5px solid var(--sk-line);
  border-radius:var(--sk-r);
  font-size:15.5px;
  line-height:1.7;
  color:var(--sk-ink);
}
.qbox,.mode,.stat{
  background:var(--sk-paper);
  border:1px solid var(--sk-line);
  border-radius:var(--sk-r-lg);
}
.feed{
  background:var(--sk-paper);
  border:1px solid var(--sk-line);
  border-radius:var(--sk-r);
}
.listrow{border-bottom:1px solid var(--sk-line);color:var(--sk-ink)}
.t1{
  font-family:var(--sk-serif);
  font-size:18px;
  font-weight:700;
  letter-spacing:.05em;
  color:var(--sk-ink);
}
.hotcard{
  background:var(--sk-cn-bg);
  border:1px solid var(--sk-cn-line);
  border-radius:var(--sk-r-lg);
}
.btn{
  font-family:var(--sk-sans);
  border-radius:4px;
  background:var(--sk-paper);
  border:1px solid var(--sk-line);
  color:var(--sk-ink-2);
}
.btn:hover{border-color:var(--sk-dai);color:var(--sk-dai)}
.btn.pri{background:var(--sk-dai);border-color:var(--sk-dai);color:#fff}
.btn.pri:hover{background:var(--sk-cn);border-color:var(--sk-cn);color:#fff}
.chip{
  background:var(--sk-paper-2);
  border:1px solid var(--sk-line);
  border-radius:4px;
  font-family:var(--sk-sans);
}
.chip.on{background:var(--sk-dai);border-color:var(--sk-dai);color:#fff}
.stat b{font-family:var(--sk-serif);color:var(--sk-cn)}

/* ---------- 十四、可读性收尾（WCAG AA） ----------
   以下组件在深色下沿用了浅色主题的深字/深底，实际不可读。
   统一改为「深底浅字」并保证前景与背景对比度 ≥ 4.5:1。 */

/* 星级徽标：原 .kd.s3 .stars 为白字压朱砂底（深色下朱砂变浅 → 白字更糊） */
.kd.s3 .stars{color:#fff}

/* 章节编号（.nn）：原为深蓝压深底 */
.nn{
  color:var(--sk-dai)!important;
  background:var(--sk-dai-bg)!important;
  border-color:var(--sk-dai-line)!important;
}

/* 听书控件：主色底上的文字在深色下必须用深色 */
.tts-secbtn{
  background:var(--sk-paper-2)!important;
  border:1px solid var(--sk-line)!important;
  color:var(--sk-ink-2)!important;
}
.tts-secbtn:hover{border-color:var(--sk-dai)!important;color:var(--sk-dai)!important}

/* 上岸笔记徽标（.bk）：赭石底上的文字 */
.bk{color:var(--sk-zhe)!important;background:var(--sk-zhe-bg)!important;border-color:var(--sk-zhe-line)!important}

/* 知识库参考块（.kbref）：原浅蓝底 + 灰字 */
.kbref{
  background:var(--sk-paper-2)!important;
  border-left:3px solid var(--sk-dai-line)!important;
  border-radius:0 var(--sk-r) var(--sk-r) 0!important;
  color:var(--sk-ink-2)!important;
}

/* 思想关联行（.gxline）：原为浅绿底 + 深绿字，深色下整块不可读 */
.gxline{
  background:var(--sk-dai2-bg)!important;
  border:1px solid var(--sk-dai2-line)!important;
  color:var(--sk-ink-2)!important;
  border-radius:var(--sk-r)!important;
}
.gxline b,.gxline strong{color:var(--sk-dai-2)!important}
.gxline a{color:var(--sk-dai)!important}

/* 考频热度标签（.heat）：四档各有底色，深浅两套都需接管 */
.heat{border-radius:4px!important;font-family:var(--sk-sans)!important}
.heat.must{background:var(--sk-cn)!important;color:#fff!important;border:1px solid var(--sk-cn)!important}
.heat.high{background:var(--sk-zhe-bg)!important;color:var(--sk-zhe)!important;border:1px solid var(--sk-zhe-line)!important}
.heat.mid{background:var(--sk-paper-2)!important;color:var(--sk-ink-2)!important;border:1px solid var(--sk-line)!important}
.heat.none{background:transparent!important;color:var(--sk-mut)!important;border:1px dashed var(--sk-line-2)!important}

/* 缺口说明（.gapnote）*/
.gapnote{color:var(--sk-ink-2)!important}

/* 页内小注（.pglink span 等）*/
.pglink span{color:var(--sk-mut)!important}`（specificity 0,2,1），
   高于单类选择器，故此处必须带上 前缀才能覆盖。 */
.w,
.w{
  background:var(--sk-paper)!important;
  border:1px solid var(--sk-line)!important;
  border-radius:var(--sk-r-lg)!important;
  box-shadow:var(--sk-shadow)!important;
  color:var(--sk-ink)!important;
}
.w p a,
.w p a{
  display:inline-block;
  background:var(--sk-dai)!important;
  color:#fff!important;
  border:1px solid var(--sk-dai)!important;
  border-radius:4px!important;
  padding:8px 16px;
  text-decoration:none;
  font-family:var(--sk-sans);
  font-size:14px;
}
.w p a:hover,
.w p a:hover{background:var(--sk-cn)!important;border-color:var(--sk-cn)!important}

/* 登录页主按钮：深色下原覆盖把字改成近黑（那是为浅蓝底写的） */
.btn.pri,button.btn.pri{background:var(--sk-dai)!important;color:#fff!important;border-color:var(--sk-dai)!important}
.auth .btn,body > .btn{background:var(--sk-dai)!important;color:#fff!important;border:none!important}
button.btn{background:var(--sk-dai)!important;color:#fff!important}

/* 赭石系（.stars / .bk / .mn）在浅底上略低于 4.5:1，字色压深一档 */
:root{--sk-zhe:#7a5c1c}

/* ---------- 十五、移动端疏解 ----------
   390px 屏上原先的问题：
   · .wrap左右各 16px + section 左右各 26px → 内容区仅 302px，一行约 19 汉字
   · h1 29px 在窄屏折成两行，占掉首屏 1/5
   · meta 长串说明无行距，糊成一片
   · nav.top 按钮尺寸不一（主题按钮已移除，现统一）
   对策：外边距收窄、字号降一档、行距略减、点击区不小于 32px。 */
@media (max-width:640px){
  .wrap,
  body[data-view="list"] .wrap,
  body[data-view="home"] .wrap,
  body[data-view="quiz"] .wrap{
    max-width:100%;
    padding:14px 12px 48px;
  }
  section{padding:16px 16px;margin-bottom:12px;border-radius:8px}
  header.hero{padding:18px 16px;margin-bottom:14px;border-radius:8px}
  h1{font-size:23px;line-height:1.35;letter-spacing:.02em}
  h2{font-size:17px;padding-left:10px;margin:0 0 12px}
  h3{font-size:15.5px;margin:16px 0 5px}
  h4{font-size:14px}

  section p,section li,.kd .body p,.ctx p,.jj p{font-size:15px;line-height:1.82}
  .subtitle{font-size:13.5px;line-height:1.7}
  .meta{font-size:12px;line-height:1.75}
  .foot{font-size:11.5px}

  /* 导航条：等高胶囊，横向可滑动，不再换行占高 */
  nav.top{
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    gap:5px;
    padding:5px 6px;
    margin:0 0 10px;
  }
  nav.top::-webkit-scrollbar{display:none}
  nav.top a{
    flex:0 0 auto;
    font-size:12.5px;
    padding:5px 11px;
    white-space:nowrap;
  }

  /* 表格卡片化后行距过紧 */
  table{font-size:13.5px}
  th,td{padding:7px 9px}
  .toc a{font-size:13.5px;padding:9px 4px}

  /* 组件内边距收一档 */
  .warn,.quote,.ctx,.fm,.jj{padding:11px 14px}
  .kd{padding:0}
  .kd.s3,.kd.s2,.kd.s1{padding:8px 10px}
  a.pchip{padding:2px 9px;font-size:11px}
  .stars{padding:2px 7px}
  details{padding:8px 12px}
}

/* 窄屏的悬浮按钮组：缩小并让位，避免遮住正文 */
@media (max-width:640px){
  .fab,.tts-fab{
    font-size:11.5px;
    padding:7px 11px;
    right:8px;
  }
  #fabBack{bottom:calc(10px + env(safe-area-inset-bottom))}
  #fabNav{bottom:calc(46px + env(safe-area-inset-bottom))}
  .navpanel,.tts-panel{
    right:8px;
    left:8px;
    width:auto;
    bottom:calc(88px + env(safe-area-inset-bottom));
    max-height:58vh;
  }
}

/* ---------- 十六、动效与打印 ---------- */
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}
@media print{
  body{background:#fff;color:#000}
  nav.top,.topbar,.foot{display:none}
  section,.card{box-shadow:none;border:1px solid #ccc;break-inside:avoid}
  .warn,.quote,.ctx,.mn,.fm,.kd{break-inside:avoid}
  a{color:#000}
}