/* snow-market —— 与 snow 同源的暗色 + 亮色双主题
 *
 * 配色不是自己配的：token 值抄自 snow 的 vendor/design-platform.css
 * （static 调色板 + alias 语义）。market 是独立项目，不能引用那套文件，
 * 所以这里抄成自有的 :root 变量 —— 将来 snow 换了色，这里要跟着手动同步。
 *
 * ★ 主题由 <html data-theme="dark|light"> 决定，【一定会有值】：
 *   没选过就在 index.html 的内联脚本里按 prefers-color-scheme 算一个写上去。
 *   不留给空值 —— 否则 CSS 得为"跟随系统"再写一遍整套变量。
 *
 * 两个视图（列表 / 画廊）用同一份数据、两套模板：
 *   body[data-view="list"]  紧凑行，一屏能扫很多
 *   body[data-view="grid"]  卡片画廊，三列（默认）
 */

/* 与主题无关的共用变量 */
:root {
  --radius: 10px;
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
          "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}

/* ── 暗色（snow 的原配；也是"没设 data-theme"时的兜底）── */
:root,
html[data-theme="dark"] {
  --bg:      rgb(21, 21, 23);        /* bluish-950 */
  --layer-1: rgb(35, 35, 36);        /* bluish-875 */
  --layer-2: rgb(44, 44, 46);        /* bluish-850 */
  --layer-3: rgb(53, 54, 56);        /* bluish-800 */
  --ink:     rgb(249, 250, 251);     /* bluish-50  */
  --ink-2:   rgb(207, 211, 214);     /* bluish-300 */
  --dim:     rgb(173, 178, 184);     /* bluish-400 */
  --line:    rgba(255, 255, 255, .06);
  --line-2:  rgba(255, 255, 255, .12);
  --hover:   rgba(255, 255, 255, .08);
  --shadow:  0 24px 64px rgba(0, 0, 0, .5);
  --header-bg: rgba(21, 21, 23, .82);

  /* 主色（deepseek 阶）*/
  --brand:     rgb(65, 118, 230);    /* deepseek-500 */
  --brand-4:   rgb(122, 170, 255);   /* deepseek-400 */
  --brand-bg:  rgba(65, 118, 230, .16);

  /* 语义色 */
  --ok:      #7dd3a0;
  --ok-bg:   rgba(76, 175, 125, .16);
  --warn:    rgb(232, 178, 92);
  --warn-bg: rgba(224, 163, 58, .16);
  --bad:     rgb(248, 113, 113);
  --bad-bg:  rgba(220, 38, 38, .16);

  /* 代码 / 引用块（暗色下要"亮一档"，不能拿亮色的 #fafafa） */
  --code-bg:  rgba(255, 255, 255, .06);
  --code-ink: rgb(220, 224, 230);
  --quote-bg: rgba(255, 255, 255, .04);
  /* 「装之前要准备」「怎么装」这类提示块 */
  --note-bg:   rgba(224, 163, 58, .10);
  --note-line: rgba(224, 163, 58, .28);
  --note-ink:  rgb(232, 196, 140);
  --tip-bg:    rgba(65, 118, 230, .10);
  --tip-line:  rgba(65, 118, 230, .26);
  --tip-ink:   rgb(160, 195, 250);
}

/* ── 亮色（token 同样取自 design-platform.css 的 static 阶）── */
html[data-theme="light"] {
  --bg:      rgb(250, 250, 251);     /* bluish-50  */
  --layer-1: rgb(255, 255, 255);     /* bluish-00  */
  --layer-2: rgb(245, 246, 248);
  --layer-3: rgb(235, 238, 242);     /* bluish-100 */
  --ink:     rgb(15, 17, 21);        /* bluish-1000 */
  --ink-2:   rgb(60, 60, 61);        /* neutral-700 */
  --dim:     rgb(101, 103, 107);     /* neutral-550 */
  --line:    rgba(0, 0, 0, .07);
  --line-2:  rgba(0, 0, 0, .13);
  --hover:   rgba(0, 0, 0, .05);
  --shadow:  0 20px 48px rgba(0, 0, 0, .16);
  --header-bg: rgba(250, 250, 251, .82);

  --brand:     rgb(65, 118, 230);    /* deepseek-500 —— 两套主题同一个蓝 */
  --brand-4:   rgb(37, 99, 235);     /* ★ 亮色下链接要用 deepseek/blue-600，
                                          400 那个浅蓝在白底上对比不够 */
  --brand-bg:  rgba(65, 118, 230, .10);

  --ok:      rgb(22, 128, 76);
  --ok-bg:   rgba(34, 197, 94, .12);
  --warn:    rgb(180, 120, 20);
  --warn-bg: rgba(245, 158, 11, .14);
  --bad:     rgb(190, 40, 40);
  --bad-bg:  rgba(220, 38, 38, .09);

  --code-bg:  rgba(0, 0, 0, .05);
  --code-ink: rgb(40, 42, 48);
  --quote-bg: rgba(0, 0, 0, .03);
  --note-bg:   rgb(255, 251, 235);   /* amber-50  */
  --note-line: rgb(253, 230, 138);
  --note-ink:  rgb(146, 64, 14);
  --tip-bg:    rgb(239, 246, 255);   /* blue-50   */
  --tip-line:  rgb(186, 230, 253);
  --tip-ink:   rgb(7, 89, 133);
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: var(--bg); color: var(--ink);
  font: 15px/1.6 var(--font);
  min-height: 100vh; display: flex; flex-direction: column;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--brand-4); text-decoration: none; }
a:hover { text-decoration: underline; }
code, pre, .mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 20px; width: 100%; }
.dim { color: var(--dim); }

/* ── 顶栏 ── */
header {
  background: var(--header-bg);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 10;
}
header .wrap { display: flex; align-items: center; gap: 20px; height: 56px; }
.brand { display: flex; align-items: center; gap: 9px; font-weight: 700; color: var(--ink); font-size: 15px; }
.brand:hover { text-decoration: none; }
.brand .mark {
  display: inline-grid; place-items: center; width: 26px; height: 26px;
  border-radius: 8px; background: var(--brand); color: #fff; font-size: 13px;
}
.brand em { color: var(--dim); font-style: normal; font-weight: 400; }
nav { display: flex; gap: 4px; margin-left: auto; align-items: center; }
nav a { color: var(--dim); font-size: 13.5px; padding: 6px 12px; border-radius: 8px; }
nav a:hover { text-decoration: none; background: var(--hover); }
nav a.on { color: var(--ink); background: var(--layer-3); font-weight: 600; }

main { flex: 1; padding: 20px 0 56px; }
.loading { color: var(--dim); padding: 40px 0; }

/* ── 搜索栏 ── */
.search { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; align-items: center; }
.search input[type=search] {
  flex: 1; min-width: 180px; height: 40px; padding: 0 14px;
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--layer-1); color: var(--ink);
  font-size: 15px; font-family: inherit; outline: none;
}
.search input[type=search]::placeholder { color: var(--dim); }
.search input[type=search]:focus { border-color: var(--brand); }
.chip {
  height: 40px; padding: 0 13px; border-radius: var(--radius);
  border: 1px solid var(--line); background: transparent; color: var(--dim);
  cursor: pointer; font-size: 13.5px; font-family: inherit; white-space: nowrap;
}
.chip:hover { background: var(--hover); color: var(--ink-2); }
.chip.on { background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 600; }

/* 视图切换（两个小图标按钮） */
.views { display: flex; gap: 2px; padding: 3px; border-radius: var(--radius);
  border: 1px solid var(--line); background: var(--layer-1); }
.views button {
  width: 34px; height: 32px; border: 0; border-radius: 7px; cursor: pointer;
  background: none; color: var(--dim); display: grid; place-items: center; padding: 0;
}
.views button:hover { background: var(--hover); color: var(--ink-2); }
.views button.on { background: var(--layer-3); color: var(--ink); }
.views svg { width: 15px; height: 15px; }

/* ── 徽章（沿用 .badge 这个类名 —— 别处已经在用）── */
.badge, .bd {
  display: inline-block; padding: 1.5px 7px; border-radius: 6px; font-size: 11.5px;
  background: rgba(255, 255, 255, .07); color: var(--dim); font-weight: 500;
  white-space: nowrap;
}
.badge.ok, .bd.ok { background: var(--ok-bg); color: var(--ok); }
.badge.blue, .bd.blue { background: var(--brand-bg); color: var(--brand-4); }
.badge.warn, .bd.warn { background: var(--warn-bg); color: var(--warn); }
.badge.src, .bd.src { background: rgba(255, 255, 255, .07); color: var(--dim); }

/* tag 容器有两个名字：新模板用 .tags，旧模板用 .meta */
.tags, .meta { display: flex; gap: 6px; flex-wrap: wrap; }

/* 图标块：没有 logo 时用名字首字母，颜色按名字哈希稳定分配 */
.ico {
  flex: none; width: 40px; height: 40px; border-radius: 11px;
  display: grid; place-items: center; font-size: 15px; font-weight: 600;
  letter-spacing: -.5px; text-transform: lowercase;
  background: var(--brand-bg); color: var(--brand-4);
}
.ico.c2 { background: var(--ok-bg); color: var(--ok); }
.ico.c3 { background: var(--warn-bg); color: var(--warn); }
.ico.c4 { background: rgba(180, 120, 220, .16); color: rgb(196, 150, 230); }
.ico.c5 { background: rgba(120, 190, 220, .16); color: rgb(140, 205, 230); }

/* ═══════════════ 视图 A · 紧凑列表 ═══════════════ */
body[data-view="list"] .list { display: flex; flex-direction: column; gap: 1px; }
body[data-view="list"] .item {
  display: grid; grid-template-columns: minmax(0, 1fr) auto;
  align-items: center; gap: 16px;
  padding: 12px 14px; border-radius: var(--radius);
  border: 1px solid transparent; cursor: pointer;
}
body[data-view="list"] .item:hover { background: var(--hover); border-color: var(--line); }
body[data-view="list"] .ico { display: none; }
body[data-view="list"] .h,
body[data-view="list"] .item h3 {
  margin: 0; font-size: 14.5px; font-weight: 600;
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
body[data-view="list"] .sub { display: none; }
body[data-view="list"] .d,
body[data-view="list"] .item p {
  margin: 3px 0 0; font-size: 12.5px; color: var(--dim);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
body[data-view="list"] .tags,
body[data-view="list"] .meta { margin-top: 7px; }
/* ★ 次数贴底对齐 —— 否则它在整块里垂直居中，标签一多就显得"被顶到一边" */
body[data-view="list"] .item { align-items: end; }
body[data-view="list"] .foot { display: flex; align-items: center; gap: 14px; padding-bottom: 2px; }
body[data-view="list"] .dl-count { font-size: 12px; color: var(--dim); white-space: nowrap; }

/* ═══════════════ 视图 B · 卡片画廊 ═══════════════ */
body[data-view="grid"] .list {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px;
}
body[data-view="grid"] .item {
  display: flex; flex-direction: column; gap: 10px;
  padding: 16px; border-radius: 12px; cursor: pointer;
  border: 1px solid var(--line); background: var(--layer-1);
  transition: border-color .15s, transform .15s;
}
body[data-view="grid"] .item:hover {
  border-color: var(--line-2); transform: translateY(-1px);
}
body[data-view="grid"] .top { display: flex; align-items: flex-start; gap: 11px; }
body[data-view="grid"] .h,
body[data-view="grid"] .item h3 { margin: 0; font-size: 14.5px; font-weight: 600; line-height: 1.4; }
body[data-view="grid"] .sub { font-size: 11.5px; color: var(--dim); margin-top: 2px; }
body[data-view="grid"] .d,
body[data-view="grid"] .item p {
  margin: 0; font-size: 12.5px; color: var(--dim); line-height: 1.55;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; min-height: 39px;
}
body[data-view="grid"] .tags,
body[data-view="grid"] .meta { margin-top: auto; }
body[data-view="grid"] .foot {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  padding-top: 10px; border-top: 1px solid var(--line);
}
/* ★ 真模板把平台/标签放在 .foot 里（不是 .tags）—— 而 .foot 默认 nowrap +
 *   overflow:visible，标签一多就【溢出卡片右边】。764 视口下溢出量还落在页面内，
 *   所以 docW 看不出问题；手机单列时卡片贴着边，就直接撑出横向滚动条
 *   （2026-10-20 实测：foot clientW 322 / scrollW 354，wrap=nowrap） */
body[data-view="grid"] .foot .badge { flex: none; }
body[data-view="grid"] .dl-count { font-size: 11.5px; color: var(--dim); margin-left: auto; }

/* 下载按钮（两套共用） */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 34px; padding: 0 14px; border-radius: 8px;
  background: var(--brand); color: #fff; border: 0; cursor: pointer;
  font-size: 13px; font-weight: 600; font-family: inherit; white-space: nowrap;
}
.btn:hover { filter: brightness(1.08); text-decoration: none; }
.btn.ghost { background: transparent; color: var(--ink-2); border: 1px solid var(--line-2); }
.btn.ghost:hover { background: var(--hover); }
.btn.big { height: 40px; padding: 0 20px; font-size: 14px; }

/* ── 详情 ── */
.back { display: inline-block; margin-bottom: 14px; font-size: 14px; color: var(--dim); }
.detail {
  background: var(--layer-1); border: 1px solid var(--line);
  border-radius: 14px; padding: 24px;
}
.detail h1 { margin: 0 0 6px; font-size: 22px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.detail .desc { color: var(--dim); margin: 0 0 18px; }
dl { display: grid; grid-template-columns: 88px 1fr; gap: 8px 16px; margin: 0 0 20px; font-size: 14px; }
dt { color: var(--dim); }
dd { margin: 0; word-break: break-all; }
.files { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
.file {
  display: flex; align-items: center; gap: 12px; padding: 12px 14px;
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--bg);
}
.file .n { flex: 1; min-width: 0; }
.file .n b { display: block; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file .n span { font-size: 12px; color: var(--dim); }

/* ── 上传 ── */
.form {
  background: var(--layer-1); border: 1px solid var(--line);
  border-radius: 14px; padding: 24px;
}
.field { margin-bottom: 18px; }
.field label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.field label .req { color: var(--bad); }
.field .hint { font-size: 12px; color: var(--dim); margin-top: 4px; line-height: 1.6; }
.field input[type=text], .field input[type=password], .field input[type=file],
.field textarea, .field select {
  width: 100%; padding: 10px 14px; border: 1px solid var(--line);
  border-radius: var(--radius); font-size: 14px; font-family: inherit;
  outline: none; background: var(--bg); color: var(--ink);
}
.field input:focus, .field textarea:focus, .field select:focus { border-color: var(--brand); }
.field input::placeholder { color: var(--dim); }
.row { display: flex; gap: 12px; }
.row > * { flex: 1; min-width: 0; }
.filepair { display: flex; gap: 10px; align-items: center; margin-bottom: 8px; }

/* ── 登录 ── */
.login {
  max-width: 400px; margin: 8vh auto 0; padding: 28px 26px;
  background: var(--layer-1); border: 1px solid var(--line); border-radius: 14px;
}
.login h1 { font-size: 20px; margin: 0 0 6px; }
.login p { margin: 0 0 8px; }
.login input[type=password] {
  width: 100%; margin: 14px 0; padding: 10px 14px;
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--bg); color: var(--ink); font-size: 15px; font-family: inherit; outline: none;
}
.login input[type=password]:focus { border-color: var(--brand); }
.login .btn { width: 100%; }

/* ── 消息 / 空态 ── */
.msg {
  padding: 12px 16px; border-radius: var(--radius); margin-bottom: 16px;
  font-size: 14px; white-space: pre-wrap; line-height: 1.65;
}
.msg.ok { background: var(--ok-bg); color: var(--ok); }
.msg.err { background: var(--bad-bg); color: var(--bad); }
.msg.info { background: var(--brand-bg); color: var(--brand-4); }
.msg code { font-size: 12.5px; }
.msg pre { margin: 8px 0 0; white-space: pre-wrap; font-size: 12px; line-height: 1.55; }
.empty { text-align: center; padding: 70px 20px; color: var(--dim); }
.empty a { color: var(--brand-4); }

/* ── 底栏 ── */
footer { border-top: 1px solid var(--line); padding: 18px 0; font-size: 11.5px; color: var(--dim); }
footer .wrap { display: flex; gap: 8px; flex-wrap: wrap; align-items: baseline; }

/* ── 响应式 ── */
@media (max-width: 900px) {
  body[data-view="grid"] .list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .wrap { padding: 0 15px; }
  main { padding: 14px 0 40px; }
  header .wrap { height: 52px; gap: 12px; }
  .brand { font-size: 14.5px; }
  nav a { padding: 6px 9px; font-size: 13px; }

  /* 手机上两套都退回单列
   * ★ 必须是 minmax(0, 1fr) 不能是 1fr —— 1fr ≡ minmax(auto, 1fr)，
   *   而 auto 的下限是【内容的 min-content】。list 视图的 .d 是 nowrap，
   *   它的 min-content = 整段描述不换行的宽度 → 列被撑开、整页横向滚动
   *   （2026-10-20 实测：484 宽视口，描述把文档撑到 1757px） */
  body[data-view="grid"] .list { grid-template-columns: minmax(0, 1fr); gap: 10px; }

  /* 描述一律两行（手机上更需要 —— 一行连"这个插件是干嘛的"都说不完） */
  body[data-view="grid"] .d,
  body[data-view="grid"] .item p {
    -webkit-line-clamp: 2; min-height: 0;
  }
  body[data-view="list"] .d,
  body[data-view="list"] .item p {
    white-space: normal;              /* 从 nowrap 放开，允许两行 */
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  }

  /* 列表视图：下载/次数换到第二行（同样必须 minmax(0,1fr) —— 见上） */
  body[data-view="list"] .item { grid-template-columns: minmax(0, 1fr); gap: 9px; padding: 12px 12px; }
  /* ★ 只有一个子元素时 space-between 无效 —— 要写 flex-end 才靠右 */
  body[data-view="list"] .foot { justify-content: flex-end; }

  .detail, .form { padding: 18px 16px; border-radius: 12px; }
  .login { margin: 4vh auto 0; padding: 22px 18px; }
  dl { grid-template-columns: 1fr; gap: 4px 0; }
  dt { font-size: 12px; margin-top: 8px; }
  .row { flex-direction: column; gap: 0; }
  .filepair { flex-wrap: wrap; }
}

/* ── 「装之前要准备」（2026-10-20）──
 * ★ 2026-10-20 修：原来是硬编码亮色（#fffbeb / #fde68a / #92400e），
 *   在暗色页面上是一整块刺眼的白 —— 换成语义变量，两套主题各自成立。 */
.requires {
  background: var(--note-bg); border: 1px solid var(--note-line);
  border-radius: 10px; padding: 12px 14px; margin: 14px 0 18px;
}
.requires .rt { font-weight: 600; font-size: 13px; color: var(--note-ink); margin-bottom: 6px; }
.requires ul { margin: 0; padding: 0; list-style: none; }
.requires li { font-size: 13px; padding: 4px 0; line-height: 1.7; }
.req-tag {
  display: inline-block; min-width: 42px; text-align: center;
  font-size: 11px; padding: 1px 6px; border-radius: 4px; margin-right: 8px;
  background: var(--code-bg); color: var(--ink-2);
}
.req-tag.must { background: var(--bad-bg); color: var(--bad); }
.req-tag.opt { background: var(--brand-bg); color: var(--brand-4); }
.req-tag.net { background: var(--warn-bg); color: var(--warn); }
.req-tag.cmd { background: var(--ok-bg); color: var(--ok); }

/* ── README（2026-10-20；同日晚改成 Markdown 渲染）──
 * ★ 原来是一整块 <pre>：#fafafa 底 + #4b5563 字 —— 亮色硬编码，
 *   在暗色页面上是一块白；而且 README 本身是 markdown，一堆 # * ` 原样显示。
 *   现在渲染成 HTML，配色走语义变量。 */
.readme { margin: 16px 0; border: 1px solid var(--line); border-radius: 10px; background: var(--layer-2); }
.readme summary {
  cursor: pointer; padding: 10px 14px; font-size: 13px; font-weight: 600;
  color: var(--ink-2); user-select: none;
}
.readme summary:hover { background: var(--hover); border-radius: 10px 10px 0 0; }
.readme[open] summary { border-bottom: 1px solid var(--line); border-radius: 10px 10px 0 0; }

/* Markdown 正文（README 和详情里的其它 md 共用） */
.md {
  padding: 14px 16px; font-size: 13.5px; line-height: 1.75;
  color: var(--ink-2); max-height: 480px; overflow: auto;
  word-break: break-word;
}
.readme .md { max-height: 460px; }
.md > *:first-child { margin-top: 0; }
.md > *:last-child { margin-bottom: 0; }
.md h1, .md h2, .md h3, .md h4, .md h5, .md h6 {
  color: var(--ink); font-weight: 600; line-height: 1.4;
  margin: 20px 0 8px;
}
.md h1 { font-size: 19px; padding-bottom: 6px; border-bottom: 1px solid var(--line); }
.md h2 { font-size: 16.5px; padding-bottom: 5px; border-bottom: 1px solid var(--line); }
.md h3 { font-size: 15px; }
.md h4, .md h5, .md h6 { font-size: 13.5px; color: var(--ink-2); }
.md p { margin: 10px 0; }
.md ul, .md ol { margin: 10px 0; padding-left: 22px; }
.md li { margin: 4px 0; }
.md li > p { margin: 4px 0; }
.md a { color: var(--brand-4); }
.md strong { color: var(--ink); font-weight: 600; }
.md em { font-style: italic; }
.md del { color: var(--dim); }
.md code {
  background: var(--code-bg); color: var(--code-ink);
  padding: 1.5px 5px; border-radius: 4px; font-size: 12.2px;
}
.md pre {
  background: var(--code-bg); border: 1px solid var(--line);
  border-radius: 8px; padding: 11px 13px; margin: 12px 0;
  overflow-x: auto; line-height: 1.6;
}
/* ★ 代码块里的 <code> 不能再叠一层背景/内边距（会变成双框） */
.md pre code { background: none; padding: 0; border-radius: 0; font-size: 12.2px; color: var(--code-ink); }
.md blockquote {
  margin: 12px 0; padding: 6px 14px; background: var(--quote-bg);
  border-left: 3px solid var(--line-2); color: var(--dim);
}
.md blockquote > *:first-child { margin-top: 0; }
.md blockquote > *:last-child { margin-bottom: 0; }
.md hr { border: 0; border-top: 1px solid var(--line); margin: 18px 0; }
.md table { border-collapse: collapse; margin: 12px 0; font-size: 12.5px; display: block; overflow-x: auto; }
.md th, .md td { border: 1px solid var(--line-2); padding: 5px 10px; text-align: left; }
.md th { background: var(--code-bg); color: var(--ink); font-weight: 600; }
.md img { max-width: 100%; border-radius: 6px; }
/* 截断提示（后端 readmeMaxShow 截断时追加的那句） */
.md .md-cut { color: var(--warn); font-size: 12.5px; }

/* ── 「怎么装」通用说明（2026-10-20）── */
.howto { background: var(--tip-bg); border: 1px solid var(--tip-line); border-radius: 10px; padding: 12px 14px; margin: 14px 0; }
.howto .rt { font-weight: 600; font-size: 13px; color: var(--tip-ink); margin-bottom: 6px; }
.howto ol { margin: 0; padding-left: 20px; }
.howto li { font-size: 13px; line-height: 1.9; color: var(--ink-2); }
.howto code { background: var(--code-bg); color: var(--code-ink); padding: 1px 5px; border-radius: 3px; font-size: 12px; }

/* ── 主题切换按钮（顶部 nav 里）── */
#themebtn {
  background: none; border: 0; cursor: pointer; color: var(--dim);
  width: 30px; height: 30px; border-radius: 8px; padding: 0;
  display: grid; place-items: center;
}
#themebtn:hover { background: var(--hover); color: var(--ink-2); }
#themebtn svg { width: 16px; height: 16px; }