/* ============================================================
   仲夏晴空建站工具 · 主题样式 (style.css) v3
   设计语言：晴空报 · 编辑部（Editorial Newspaper）
   区别于普通卡片博客：报头刊头 / 头条版面 / 编号目录行 / 规则线 / 文学宋体
   关键词：纸感 / 克制 / 通透 / 一体化 / 清新蓝
   ============================================================ */

/* ---------- 隐藏滚动条（全局） ---------- */
html { scrollbar-width: none; -ms-overflow-style: none; }
html::-webkit-scrollbar { display: none; width: 0; height: 0; }
* { scrollbar-width: none; }
*::-webkit-scrollbar { display: none; width: 0; height: 0; }

/* ---------- 图标（唯一一套） ----------
   全站图标都是内联 SVG 线性图标：尺寸跟着字号走（1em），颜色跟着文字走（currentColor）。
   模板里用 {{ico "名称"}} 调用，不要在页面里散写 emoji 或几何字符。 */
.ico {
  width: 1em; height: 1em;
  flex: none;
  vertical-align: -0.145em;
  overflow: visible;
}

:root {
  --bg: #f6f7fb;
  --bg-soft: #eef2fa;
  --surface: #ffffff;
  --ink: #1c2536;
  --ink-soft: #46536b;
  --muted: #8b95a8;
  --brand: #2f6fed;
  --brand-strong: #1d4fc0;
  --brand-soft: #e9f1fe;
  --brand-line: #c7dcfc;
  --line: #e4e8f0;
  --hairline: #edf0f6;
  /* 表单字段描边：--line 是分隔线色，铺在白底上几乎看不见，
     输入框需要一层「看得见但不重」的边（含悬停 / 聚焦分层） */
  --field-line: #a3b8d6;
  --field-line-hover: #7f97bf;
  --danger: #e5484d;
  --ok: #16a34a;
  /* 提醒黄：徽章「热」「待解」等用它，缺了会掉回继承色，白底黄块上的字直接看不见 */
  --warn: #d97706;
  --shadow-sm: none;
  --shadow: none;
  --radius: 12px;
  --radius-sm: 8px;
  /* ---------- 按钮统一规范（前后台共用同一套数值，改这一处即全局生效） ----------
     全站按钮只有两档：常规 40px、小号 32px；任何页面都不准再写 height 特例，
     否则又会出现「同样两个按钮，有的大有的小」。 */
  --btn-h: 40px;
  --btn-h-sm: 32px;
  --btn-px: 18px;
  --btn-px-sm: 12px;
  --btn-gap: 7px;
  --btn-fs: 14px;
  --btn-fs-sm: 12.5px;
  --btn-r: var(--r-md);
  --btn-dur: .18s;
  --font-serif: "Noto Serif SC", "Source Han Serif SC", "Songti SC", STSong, SimSun, "Times New Roman", Georgia, serif;
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", "Cascadia Code", Consolas, monospace;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body {
  margin: 0;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.8;
  color: var(--ink);
  background:
    radial-gradient(1100px 460px at 84% -12%, rgba(47, 111, 237, .06), transparent 62%),
    radial-gradient(760px 380px at -6% 2%, rgba(56, 189, 248, .05), transparent 55%),
    var(--bg);
  -webkit-font-smoothing: antialiased;
}

/* 主内容撑满剩余高度，页脚始终吸附在底部 */
main {
  flex: 1 0 auto;
}

/* 前台内容区底部与页脚之间留出呼吸间距（后台 main 不带 .container，不受影响） */
main.container {
  padding-bottom: 56px;
}

a { color: var(--brand); text-decoration: none; transition: color .18s; }
a:hover { color: var(--brand-strong); }

img { max-width: 100%; height: auto; }

.container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 clamp(16px, 4vw, 28px);
  padding-left: max(clamp(16px, 4vw, 28px), env(safe-area-inset-left));
  padding-right: max(clamp(16px, 4vw, 28px), env(safe-area-inset-right));
}

/* ================= 顶部导航（通透玻璃 + 报头细线） ================= */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  height: calc(64px + env(safe-area-inset-top));
  padding-top: env(safe-area-inset-top);
  background: rgba(255, 255, 255, .74);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--hairline);
  animation: headerIn .5s ease both;
}

@keyframes headerIn {
  from { opacity: 0; transform: translateY(-12px); }
  to   { opacity: 1; transform: none; }
}

.header-inner {
  display: flex; align-items: center; justify-content: space-between;
  height: 64px; gap: 20px;
}

.brand { display: inline-flex; align-items: center; gap: 11px; flex-shrink: 0; color: var(--ink); }

.brand-mark {
  width: 32px; height: 32px;
  border-radius: var(--r-sm);
  display: grid; place-items: center;
  background: linear-gradient(140deg, #5aa2ff, var(--brand));
  color: #fff;
  font-family: var(--font-serif);
  font-size: 17px; font-weight: 700;
}

/* 图片 LOGO：去掉底色与投影，让图自己的形状说话；只约束高度，宽度按原比例走 */
.brand-mark-img {
  background: none;
  padding: 0;
  overflow: hidden;
}
.brand-mark-img img { max-height: 32px; max-width: 120px; width: auto; height: auto; display: block; }

.brand-name {
  font-family: var(--font-serif);
  font-size: 17px; font-weight: 700;
  letter-spacing: .6px;
  display: inline-flex; flex-direction: column; align-items: flex-start; gap: 0;
  line-height: 1.15;
  white-space: nowrap;
}

.brand-name em {
  font-style: normal; font-family: var(--font);
  font-size: 9.5px; font-weight: 700;
  color: var(--brand); letter-spacing: 1px; text-transform: uppercase;
}

.main-nav {
  display: flex; align-items: center; justify-content: center;
  gap: 4px; flex: 1; min-width: 0;
}

.main-nav a {
  position: relative;
  padding: 8px 14px;
  color: var(--ink-soft);
  font-size: 14.5px; font-weight: 500;
  white-space: nowrap;
  transition: color .18s;
}

.main-nav a::after {
  content: "";
  position: absolute; left: 14px; right: 14px; bottom: 2px;
  height: 2px; border-radius: var(--r-sm);
  background: var(--brand);
  transform: scaleX(0); transform-origin: left;
  transition: transform .22s ease;
}

.main-nav a:hover { color: var(--brand-strong); }
.main-nav a:hover::after { transform: scaleX(1); }
.main-nav a.active { color: var(--brand-strong); }
.main-nav a.active::after { transform: scaleX(1); }

/* 导航「模块」下拉（收纳除博客外的业务模块，避免导航占位过多） */
.nav-dd { position: relative; }
.nav-dd-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 8px 14px;
  color: var(--ink-soft);
  font-size: 14.5px; font-weight: 500;
  white-space: nowrap;
  transition: color .18s;
}
.nav-dd-btn:hover { color: var(--brand-strong); }
.nav-dd-caret { font-size: 11px; color: var(--muted); transition: transform .2s; }
.nav-dd.open .nav-dd-caret { transform: rotate(180deg); }
.nav-dd-menu {
  position: absolute; top: calc(100% + 8px); left: 8px;
  min-width: 152px;
  display: flex; flex-direction: column; gap: 2px;
  padding: 8px;
  background: rgba(255, 255, 255, .92);
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: var(--r-md);
  backdrop-filter: blur(18px) saturate(175%);
  -webkit-backdrop-filter: blur(18px) saturate(175%);
  opacity: 0; visibility: hidden;
  transform: translateY(8px);
  transition: opacity .18s, transform .18s, visibility .18s;
  z-index: 70;
}
.nav-dd.open .nav-dd-menu { opacity: 1; visibility: visible; transform: none; }
.nav-dd-menu a {
  display: block;
  padding: 9px 13px;
  border-radius: var(--r-sm);
  font-size: 14px;
  color: var(--ink-soft);
  transition: background .15s, color .15s;
}
.nav-dd-menu a::after { display: none; }
/* 悬停用渐变高亮，与「当前模块」实底区分开，互不粘连 */
.nav-dd-menu a:hover {
  background: linear-gradient(90deg, var(--brand-soft), rgba(233, 241, 254, .35));
  color: var(--brand-strong);
}
.nav-dd-menu a.active { background: var(--brand-soft); color: var(--brand-strong); font-weight: 600; }

/* ---- 「模块」大面板：改为中心弹窗（磨砂实底 + 遮罩） ----
   顶栏「模块」不再向下展开多列面板，而是弹出一个居中的浮层卡片；
   桌面 / 平板 / 手机 / 折叠屏表现一致。
   卡片整体由 JS 挂到 body 下——顶栏有 backdrop-filter，
   会为 fixed 后代生成包含块，留在顶栏里就没法真正相对视口居中。 */
body.mega-open { overflow: hidden; }

.nav-mega {
  position: fixed; inset: 0; z-index: 80;
  display: flex; align-items: center; justify-content: center;
  padding: clamp(16px, 4vw, 40px);
  opacity: 0; visibility: hidden;
  transition: opacity .2s ease, visibility .2s ease;
}
.nav-mega.open { opacity: 1; visibility: visible; }

.nav-mega-scrim {
  position: absolute; inset: 0;
  background: rgba(15, 23, 42, .34);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

.nav-mega-card {
  position: relative; z-index: 1;
  display: flex; flex-direction: column;
  width: max-content;
  max-width: min(880px, 100%);
  max-height: 100%;
  padding: 16px 18px 18px;
  background: rgba(255, 255, 255, .985);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  backdrop-filter: blur(26px) saturate(190%);
  -webkit-backdrop-filter: blur(26px) saturate(190%);
  transform: translateY(12px) scale(.985);
  transition: transform .22s ease;
  overflow: hidden;
}
.nav-mega.open .nav-mega-card { transform: none; }

.nav-mega-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px;
  padding: 0 4px 12px;
  margin-bottom: 12px;
  border-bottom: 1px solid var(--hairline);
}
.nav-mega-head-t {
  font-family: var(--font-serif);
  font-size: 15px; font-weight: 700;
  letter-spacing: .5px;
  color: var(--ink);
}
.nav-mega-close {
  display: grid; place-items: center;
  width: 32px; height: 32px;
  border: 0; border-radius: var(--r-sm);
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  transition: background .15s, color .15s;
}
.nav-mega-close svg { width: 18px; height: 18px; }
.nav-mega-close:hover { background: var(--brand-soft); color: var(--brand-strong); }

.nav-mega-body {
  display: flex; flex-wrap: wrap; align-items: flex-start;
  gap: 16px 22px;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 2px;
  -webkit-overflow-scrolling: touch;
}

.nav-mega-trigger .nav-dd-btn { font-weight: 600; }
.nav-mega-trigger.open .nav-dd-caret { transform: rotate(180deg); }

.nav-mega .mega-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 0 1 auto;
  min-width: 208px;
}
.nav-mega .mega-group-t {
  padding: 0 6px 2px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--muted);
}
.nav-mega .mega-grid { display: flex; flex-direction: column; gap: 2px; }

.nav-mega .mega-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: var(--r-sm);
  transition: background .15s;
}
.nav-mega .mega-ico {
  width: 30px; height: 30px; flex: none;
  display: grid; place-items: center;
  border-radius: 9px;
  background: linear-gradient(135deg, var(--brand-soft), rgba(233, 241, 254, .35));
  color: var(--brand-strong);
  font-size: 15px;
}
.nav-mega .mega-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.nav-mega .mega-name { font-size: 14px; font-weight: 600; color: var(--ink); white-space: nowrap; }
.nav-mega .mega-desc {
  max-width: 196px;
  font-size: 12px;
  line-height: 1.35;
  color: var(--muted);
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.nav-mega .mega-item:hover {
  background: linear-gradient(135deg, var(--brand-soft), rgba(233, 241, 254, .3));
}
.nav-mega .mega-item:hover .mega-name { color: var(--brand-strong); }
.nav-mega .mega-item.active { background: var(--brand-soft); }
.nav-mega .mega-item.active .mega-name { color: var(--brand-strong); }

.header-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }

.search-box { position: relative; display: flex; align-items: center; width: 190px; }

.search-box input {
  width: 100%; height: 36px;
  padding: 0 12px 0 34px;
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .85);
  font-size: 13.5px; color: var(--ink);
  outline: none;
  transition: border .18s, background .18s;
}

.search-box input:focus {
  border-color: var(--brand-line);
  background: #fff;
}

.search-box .search-ico {
  position: absolute; left: 12px;
  font-size: 13px; line-height: 1;
  opacity: .72;
  pointer-events: none;
}
.search-box input:focus { border-color: var(--brand-line); background: #fff; }
.nav-toggle-ico { font-size: 16px; line-height: 1; }

.nav-toggle {
  display: none;
  width: 38px; height: 38px;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: #fff;
  cursor: pointer;
  place-items: center;
  padding: 0;
}

.nav-toggle svg { width: 20px; height: 20px; stroke: var(--ink); }

/* ================= 主体布局 =================
   双栏：正文 + 右栏（300px）。首页使用 layout-single 取消侧栏，避免右侧空白。
   注意：这里只设上下内边距，左右内边距交给 .container（用 padding 简写会把它清零，导致正文贴边）。 */
.layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 44px;
  padding-top: 34px;
  padding-bottom: 64px;
  align-items: start;
}

.layout-single {
  grid-template-columns: minmax(0, 1fr);
  max-width: 1180px;
}

.main-col { min-width: 0; }

/* ================= 博客首页 · 报头刊头 ================= */
.masthead {
  padding: 26px 0 28px;
  margin-bottom: 8px;
  border-top: 3px double var(--ink);
  border-bottom: 3px double var(--line);
  text-align: center;
  animation: rise .5s ease both;
}

.masthead-top {
  display: flex; align-items: center; justify-content: space-between;
  font-family: var(--mono);
  font-size: 11px; letter-spacing: 2.5px;
  color: var(--muted);
  text-transform: uppercase;
  margin-bottom: 20px;
}

.masthead-issue::before { content: "◆ "; color: var(--brand); }

.masthead-title {
  font-family: var(--font-serif);
  font-size: clamp(30px, 4.6vw, 44px);
  font-weight: 700; line-height: 1.4;
  letter-spacing: 2px;
  color: var(--ink);
  margin: 0 0 14px;
}

.masthead-sub {
  font-family: var(--font-serif);
  font-size: 15px; color: var(--muted);
  letter-spacing: .5px; margin: 0;
  max-width: 620px; margin-left: auto; margin-right: auto;
}

.masthead-rule {
  display: block;
  height: 0;
  border-bottom: 1px solid var(--brand-line);
  margin-top: 24px;
}

/* ================= 头条（本期焦点） ================= */
.post-feature {
  position: relative;
  padding: 40px 6px 36px;
  border-bottom: 1px solid var(--line);
  animation: rise .5s ease both;
}

@keyframes rise {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}

.post-feature::before {
  content: "01";
  position: absolute;
  top: 18px; right: 6px;
  font-family: var(--font-serif);
  font-size: 84px; line-height: 1;
  font-weight: 700;
  color: rgba(47, 111, 237, .10);
  pointer-events: none;
  user-select: none;
}

.pf-mark {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--mono);
  font-size: 11px; font-weight: 700;
  letter-spacing: 2.5px; color: var(--brand-strong);
  text-transform: uppercase;
  margin-bottom: 14px;
}

.pf-mark::before { content: ""; width: 26px; height: 1px; background: var(--brand); }

.pf-title {
  margin: 0 0 14px;
  font-family: var(--font-serif);
  font-size: clamp(26px, 3.4vw, 34px);
  font-weight: 700; line-height: 1.45;
  letter-spacing: .5px;
  max-width: 720px;
}

.pf-title a { color: var(--ink); }
.pf-title a:hover { color: var(--brand-strong); }

.pf-summary {
  color: var(--ink-soft);
  font-size: 15.5px; line-height: 1.95;
  margin: 0 0 18px;
  max-width: 640px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.pf-meta {
  display: flex; align-items: center; gap: 16px;
  color: var(--muted); font-size: 12.5px;
  letter-spacing: .4px;
  flex-wrap: wrap;
}

.pf-meta a { color: var(--muted); }
.pf-meta a:hover { color: var(--brand); }

.pf-read {
  margin-left: auto;
  color: var(--brand-strong);
  font-weight: 600;
}

.pf-tags { margin-top: 16px; display: flex; gap: 8px; flex-wrap: wrap; }

.tag {
  display: inline-block;
  padding: 2.5px 11px;
  border-radius: var(--r-pill);
  border: 1px solid var(--brand-line);
  background: var(--brand-soft);
  color: var(--brand-strong);
  font-size: 12px; font-weight: 500;
  white-space: nowrap;
}

/* ================= 目录索引行（刊物目录） ================= */
.index-head {
  display: flex; align-items: center; gap: 14px;
  margin: 34px 0 6px;
}

.index-head span {
  font-family: var(--mono);
  font-size: 11px; font-weight: 700;
  letter-spacing: 3px; color: var(--brand-strong);
  text-transform: uppercase;
  white-space: nowrap;
}

.index-head::after { content: ""; flex: 1; border-bottom: 1px solid var(--line); }

.post-index {
  display: flex; align-items: baseline; gap: 22px;
  padding: 20px 4px;
  border-bottom: 1px solid var(--hairline);
  transition: background .18s, padding-left .18s;
  animation: rise .5s ease both;
}

.post-index:hover { padding-left: 10px; background: linear-gradient(90deg, var(--bg-soft), transparent 70%); }

.post-index:nth-child(2) { animation-delay: .04s; }
.post-index:nth-child(3) { animation-delay: .08s; }
.post-index:nth-child(4) { animation-delay: .12s; }
.post-index:nth-child(5) { animation-delay: .16s; }

.pi-num {
  flex-shrink: 0;
  width: 46px;
  font-family: var(--font-serif);
  font-size: 15px; font-weight: 700;
  letter-spacing: .1em;
  color: var(--brand);
  text-align: right;
}

.pi-body { flex: 1; min-width: 0; }

.pi-body h2 {
  margin: 0 0 7px;
  font-family: var(--font-serif);
  font-size: 20px; font-weight: 700; line-height: 1.5;
  letter-spacing: .3px;
}

.pi-body h2 a { color: var(--ink); }
.pi-body h2 a:hover { color: var(--brand-strong); }

.pi-meta {
  display: flex; align-items: center; gap: 14px;
  color: var(--muted); font-size: 12.5px;
  letter-spacing: .3px; flex-wrap: wrap;
}

.pi-meta a { color: var(--muted); }
.pi-meta a:hover { color: var(--brand); }

.pi-arrow {
  flex-shrink: 0;
  color: var(--brand);
  font-size: 15px;
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity .18s, transform .18s;
}

.post-index:hover .pi-arrow { opacity: 1; transform: none; }

/* ================= 文章详情（版面式） ================= */
.post-article {
  padding: 8px 4px 10px;
}

.article-eyebrow {
  font-family: var(--mono);
  font-size: 11px; font-weight: 700;
  letter-spacing: 3px; color: var(--brand-strong);
  text-transform: uppercase;
  display: block;
  margin-bottom: 16px;
}

.article-eyebrow a { color: var(--brand-strong); }
.article-eyebrow a:hover { color: var(--brand); }

.post-article h1 {
  font-family: var(--font-serif);
  font-size: clamp(28px, 4vw, 38px);
  font-weight: 700; line-height: 1.42;
  letter-spacing: .6px;
  margin: 0 0 20px;
}

.article-meta {
  display: flex; flex-wrap: wrap; align-items: center; gap: 16px;
  color: var(--muted); font-size: 12.5px; letter-spacing: .4px;
  padding-bottom: 20px; margin-bottom: 34px;
  border-bottom: 3px double var(--line);
}

.article-meta a { color: var(--muted); }
.article-meta a:hover { color: var(--brand); }

.article-body {
  max-width: 780px;
  font-family: var(--font-serif);
  font-size: 16.5px; color: var(--ink-soft);
  line-height: 2.05; letter-spacing: .2px;
}

.article-body h1 {
  font-size: 26px; font-weight: 800; color: var(--ink);
  letter-spacing: 1px;
  margin: 6px 0 26px;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--line);
  scroll-margin-top: 84px;
}

.article-body h2 {
  font-size: 23px; font-weight: 700; color: var(--ink);
  letter-spacing: .5px;
  margin: 40px 0 16px;
  scroll-margin-top: 84px;
}

.article-body h3 { font-size: 19px; color: var(--ink); margin: 30px 0 14px; scroll-margin-top: 84px; }
.article-body p { margin: 0 0 20px; }
.article-body ul, .article-body ol { padding-left: 26px; margin: 0 0 20px; }
.article-body li { margin-bottom: 8px; }

.article-body blockquote {
  margin: 26px 0; padding: 16px 24px;
  border-left: 3px double var(--brand);
  background: linear-gradient(90deg, var(--brand-soft), transparent 72%);
  border-radius: 0 12px 12px 0;
  font-family: var(--font-serif);
  font-size: 16px; color: var(--ink-soft);
}

.article-body code {
  font-family: var(--mono);
  font-size: .9em;
  background: var(--bg-soft);
  padding: 2px 7px;
  border-radius: var(--r-sm);
}

.article-body pre {
  background: #1e2735; color: #e2e8f0;
  padding: 20px 22px; border-radius: var(--r-md);
  overflow-x: auto; margin: 0 0 20px;
  line-height: 1.65;
}

.article-body pre code { background: transparent; color: inherit; padding: 0; }
.article-body a { text-decoration: underline; text-underline-offset: 3px; }
.article-body table { border-collapse: collapse; width: 100%; margin: 0 0 20px; font-size: 14.5px; }
.article-body th, .article-body td { border: 1px solid var(--line); padding: 9px 12px; text-align: left; }
.article-body th { background: var(--bg-soft); }
.article-body img { border-radius: var(--r-md); margin: 12px 0; }

/* ---------- 落地页 callout ---------- */
.article-body .prose-callout {
  margin: 24px 0;
  padding: 16px 20px;
  border-radius: var(--r-md);
  background: var(--brand-soft);
  border: 1px solid var(--brand-line);
  color: var(--ink-soft);
}

/* ---------- 富格式化：重点卡片 / 版本标签 / 分类标签 / 最新标识 ---------- */
.article-body .callout {
  margin: 24px 0;
  padding: 18px 22px;
  border-radius: var(--r-md);
  background: var(--brand-soft);
  border: 1px solid var(--brand-line);
  border-left: 4px solid var(--brand);
  color: var(--ink-soft);
  font-family: var(--font-serif);
}
.article-body .callout p { margin: 0; }
.article-body .callout-hot {
  background: linear-gradient(120deg, var(--brand-soft), rgba(255, 255, 255, .7));
  border-left: 4px solid var(--brand-strong);
}
.article-body .callout-hot p::before {
  content: "★ ";
  color: var(--brand-strong);
}

/* 全站统一版本号标签（{{verTag}} 统一调用）：页脚、主站、后台等任何位置都是标签样式 */
.ver-tag {
  display: inline-block;
  font-family: var(--mono);
  font-size: .78em;
  font-weight: 700;
  color: #fff;
  background: var(--brand);
  padding: 2px 10px;
  border-radius: var(--r-pill);
  margin-right: 6px;
  vertical-align: 2px;
  letter-spacing: .3px;
  line-height: 1.7;
  white-space: nowrap;
}

/* 构建号标签（{{buildTag}} 统一调用）：与版本号并肩站着，但退一档
   ——它是「第几次发布」，不是版本本身，安静一点更合适。 */
.ver-tag.ver-build {
  color: var(--ink-soft);
  background: #eef2fa;
  border: 1px solid var(--line);
  font-weight: 600;
  letter-spacing: .6px;
}

.article-body .ver-tag {
  display: inline-block;
  font-family: var(--mono);
  font-size: .78em;
  font-weight: 700;
  color: #fff;
  background: var(--brand);
  padding: 2px 10px;
  border-radius: var(--r-pill);
  margin-right: 6px;
  vertical-align: 2px;
  letter-spacing: .3px;
}

.ver-badge {
  display: inline-block;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, var(--brand), var(--brand-strong));
  padding: 3px 11px;
  border-radius: var(--r-pill);
  margin-left: 8px;
  vertical-align: 3px;
  letter-spacing: 1.5px;
  animation: badgePulse 2.2s ease-in-out infinite;
}
/* 目录里的「最新」标识：保持醒目标签形态，同时收窄以适配侧栏宽度 */
.doc-toc .ver-badge { margin: 0; font-size: 10px; padding: 2px 8px; letter-spacing: 1px; }
@keyframes badgePulse {
  0%, 100% { }
  50%      { }
}

/* ================= 日志页：版本区块卡片 ================= */
/* 每个版本独立成卡片：通透明快、与主题一体化，hover 轻微浮起 */
.ver-block {
  position: relative;
  margin: 26px 0;
  padding: 22px 26px 26px;
  border: 1px solid var(--hairline);
  border-radius: var(--r-lg);
  background: linear-gradient(180deg, var(--surface), rgba(240, 244, 252, .5));
  transition: transform .2s ease, border-color .2s ease;
}
.ver-block:hover {
  transform: translateY(-2px);
  border-color: var(--brand-line);
}
.ver-block h3 {
  margin: 0 0 14px !important;
  padding: 0 0 12px;
  border-bottom: 1px dashed var(--hairline);
}
.ver-block > p:last-child,
.ver-block > ul:last-child,
.ver-block > ol:last-child,
.ver-block > blockquote:last-child { margin-bottom: 0; }
.ver-block .ver-badge { margin-left: 10px; }
.ver-block + .ver-block { margin-top: 18px; }

/* ================= v0.0.1 元旦首版：完全新年风格 ================= */
/* 元旦徽标：金字红底变红字金底，更贴合新年喜庆 */
.newyear-badge {
  display: inline-block;
  font-family: var(--font-serif);
  font-size: 11px; font-weight: 700;
  color: #8a1a2b;
  background: linear-gradient(135deg, #f2c14e, #ffe08a);
  padding: 3px 12px;
  border-radius: var(--r-pill);
  margin-left: 10px;
  vertical-align: 3px;
  letter-spacing: 2px;
}

/* 整块：大红喜庆渐变 + 漫天金屑，白字金字，完全新年 */
.ver-newyear {
  border: 1px solid #e8b04b;
  background:
    radial-gradient(2.5px 2.5px at 8% 16%, #ffe08a, transparent 65%),
    radial-gradient(2px 2px at 18% 6%, #ffd98a, transparent 65%),
    radial-gradient(2.5px 2.5px at 30% 22%, #f2c14e, transparent 65%),
    radial-gradient(2px 2px at 86% 10%, #ffe08a, transparent 65%),
    radial-gradient(2.5px 2.5px at 94% 26%, #ffd98a, transparent 65%),
    radial-gradient(2px 2px at 72% 5%, #f2c14e, transparent 65%),
    radial-gradient(2.5px 2.5px at 46% 90%, #ffd98a, transparent 65%),
    radial-gradient(2px 2px at 60% 96%, #ffe08a, transparent 65%),
    linear-gradient(180deg, #a51c2c 0%, #c8102e 40%, #d43b34 72%, #e0493a 100%);
  color: #fff;
  overflow: hidden;
}
/* 顶部金边锦纹 */
.ver-newyear::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 6px;
  background: repeating-linear-gradient(90deg, #f2c14e 0 10px, #ffe08a 10px 14px, #d99b2b 14px 24px);
}

/* 两侧 CSS 红灯笼（由脚本注入 span，挂在区块顶部两侧） */
.ny-lantern {
  position: absolute;
  top: 12px;
  width: 26px; height: 30px;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 46%, #ffe08a 0 4px, #e0493a 4.5px 12px, #a51c2c 12.5px 100%);
  pointer-events: none;
}
.ny-lantern.ny-l { left: 12px; }
.ny-lantern.ny-r { right: 12px; }
.ny-lantern::before {
  content: "";
  position: absolute;
  top: -6px; left: 50%;
  transform: translateX(-50%);
  width: 12px; height: 7px;
  background: linear-gradient(180deg, #f2c14e, #d99b2b);
  border-radius: var(--r-sm);
}
.ny-lantern::after {
  content: "";
  position: absolute;
  bottom: -9px; left: 50%;
  transform: translateX(-50%);
  width: 2px; height: 9px;
  background: #f2c14e;
}

/* 新年区块内容整体反色：白字金字，保持可读与喜庆 */
.ver-newyear h3 { color: #fff; border-bottom-color: rgba(255, 224, 138, .35); }
.ver-newyear h3 .ver-tag { background: #f2c14e; color: #8a1a2b; }
.ver-newyear p,
.ver-newyear ul,
.ver-newyear ol,
.ver-newyear li { color: #ffe9ee; }
.ver-newyear.ver-block strong,
.ver-newyear.ver-block strong.hl,
.ver-newyear.ver-block li strong,
.ver-newyear.ver-block li strong.hl,
.ver-newyear.ver-block li > strong.hl {
  color: #ffd98a;
  font-weight: 700;
  background: rgba(255, 224, 138, .14);
  border-color: rgba(255, 224, 138, .45);
}
.ver-newyear blockquote {
  background: rgba(255, 255, 255, .12);
  border-left-color: #f2c14e;
  color: #fff6e0;
}
.ver-newyear .hl { color: #ffd98a; }
.ver-newyear .newyear-badge { }

.article-body .tag {
  display: inline-block;
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 600;
  color: var(--brand-strong);
  background: var(--brand-soft);
  border: 1px solid var(--brand-line);
  border-radius: var(--r-sm);
  padding: 1px 8px;
  margin-right: 6px;
  white-space: nowrap;
}

/* 重点内容：markdown 的 **加粗** 升级为醒目的高亮标记，不只加粗 */
.article-body strong.hl {
  font-weight: 700;
  color: var(--brand-strong);
  background: linear-gradient(90deg, rgba(47, 111, 237, .12), rgba(56, 189, 248, .14));
  border: 1px solid var(--brand-line);
  border-radius: var(--r-sm);
  padding: 1px 8px;
  margin: 0 2px;
  white-space: nowrap;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.article-body li strong.hl {
  display: inline-block;
  min-width: 1em;
}

.article-body li > strong.hl {
  background: var(--brand-soft);
  border-color: var(--brand-line);
}

/* ---------- 文末 ---------- */
.article-end {
  margin: 42px 0 0;
  padding-top: 26px;
  border-top: 1px solid var(--line);
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  flex-wrap: wrap;
}

.article-tags { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.article-tags b { font-weight: 600; color: var(--muted); font-size: 13px; letter-spacing: 1px; }

.article-finis {
  color: var(--muted);
  font-family: var(--font-serif);
  font-size: 13px; letter-spacing: 3px;
}

/* ================= 评论 ================= */
.comments { margin-top: 34px; }

.comments h2 {
  font-family: var(--font-serif);
  font-size: 20px; margin: 0 0 20px;
  padding-bottom: 12px; border-bottom: 3px double var(--line);
}

.comment-item {
  padding: 16px 18px;
  background: rgba(255, 255, 255, .72);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  margin-bottom: 12px;
}

.comment-item .c-name { font-weight: 600; font-size: 14.5px; }
.comment-item .c-time { color: var(--muted); font-size: 12.5px; margin-left: 8px; }
.comment-item .c-content { margin-top: 6px; color: var(--ink-soft); font-size: 14.5px; }

.comment-form { margin-top: 24px; }
.comment-form .field, .momo-comment-form .field, .note-form .field { margin-bottom: 12px; }

.comment-form input, .comment-form textarea,
.momo-comment-form input, .momo-comment-form textarea,
.note-form input, .note-form textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: 10px 14px;
  font-size: 14.5px;
  font-family: var(--font);
  background: #fff;
  outline: none;
  transition: border .18s;
}

.comment-form input:focus, .comment-form textarea:focus,
.momo-comment-form input:focus, .momo-comment-form textarea:focus,
.note-form input:focus, .note-form textarea:focus {
  border-color: var(--brand-line);
}

.comment-form textarea, .momo-comment-form textarea, .note-form textarea { min-height: 96px; resize: vertical; }
.comment-form .hp { display: none; }

/* ================= 侧边栏（去盒化的右栏） ================= */
.sidebar { position: sticky; top: 88px; display: flex; flex-direction: column; gap: 22px; }

.widget { padding: 0 0 20px; }
.widget + .widget { border-top: 1px solid var(--line); padding-top: 22px; }

.widget h3 {
  display: flex; align-items: center; gap: 8px;
  margin: 0 0 14px;
  font-size: 12px; font-weight: 700;
  letter-spacing: 2.5px; color: var(--brand);
  text-transform: uppercase;
}

.widget h3::before { content: ""; width: 16px; height: 2px; background: var(--brand); }

.widget ul { list-style: none; margin: 0; padding: 0; }
.widget li { margin-bottom: 10px; font-size: 14px; }

.widget a {
  color: var(--ink-soft);
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  transition: color .18s, padding-left .18s;
}

.widget a:hover { color: var(--brand-strong); padding-left: 4px; }

.widget .count { color: var(--muted); font-size: 12px; font-family: var(--mono); }

.widget-intro {
  font-family: var(--font-serif);
  font-size: 14px; color: var(--muted);
  line-height: 1.95; margin: 0;
}

.widget-sub {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12.5px; color: var(--muted);
}

.widget-sub:hover { color: var(--brand-strong); }

/* ================= 分页 ================= */
.pagination {
  display: flex; justify-content: center; align-items: center; gap: 10px;
  margin-top: 40px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}

.pagination a, .pagination span {
  display: inline-grid; place-items: center;
  min-width: 38px; height: 38px;
  padding: 0 14px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink-soft);
  font-size: 14px; font-family: var(--font-serif);
  white-space: nowrap;
  transition: all .18s;
}

.pagination a:hover { border-color: var(--brand-line); color: var(--brand-strong); }
.pagination .disabled { opacity: .45; pointer-events: none; }

/* ================= 列表页标题（栏目页头） ================= */
.page-heading {
  margin-bottom: 10px; padding: 8px 0 22px;
  border-bottom: 3px double var(--line);
}

.ph-kicker {
  font-family: var(--mono);
  font-size: 11px; font-weight: 700;
  letter-spacing: 3px; color: var(--brand);
  text-transform: uppercase;
  display: block; margin-bottom: 10px;
}

.ph-title {
  font-family: var(--font-serif);
  font-size: 28px; font-weight: 700; letter-spacing: .5px;
  margin: 0 0 8px;
}

.ph-note { color: var(--muted); margin: 0; font-size: 14px; }

/* ================= 页脚（紧凑单行） ================= */
.site-footer {
  border-top: 1px solid var(--line);
  background: rgba(255, 255, 255, .55);
}

.footer-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px 20px;
  min-height: 64px;
  padding-top: 16px; padding-bottom: 16px;
}

/* 左：版权一行、口号一行；右：版本标签一行、导航一行 */
.footer-left { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.footer-right { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }

.footer-copy {
  color: var(--muted); font-size: 13px;
  font-family: var(--font-serif); letter-spacing: .3px;
}

.footer-slogan {
  color: var(--muted); font-size: 12.5px; line-height: 1.6;
  font-family: var(--font-serif); letter-spacing: .2px;
}

/* 品牌署名链接：任何时候都不带下划线，靠颜色变化提示可点 */
.brand-link, .brand-link:visited, .brand-link:hover, .brand-link:active { text-decoration: none; color: inherit; }
.brand-link:hover { color: var(--brand); }

.footer-links { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; justify-content: flex-end; }
.footer-links a { color: var(--ink-soft); font-size: 13px; white-space: nowrap; }
.footer-links a:hover { color: var(--brand-strong); }

.footer-ver { color: var(--muted); font-size: 12.5px; font-family: var(--mono); }

/* 窄屏：两栏改一栏，右侧靠左对齐，避免链接串被挤成竖条 */
@media (max-width: 620px) {
  .footer-inner { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .footer-right { align-items: flex-start; }
  .footer-links { justify-content: flex-start; gap: 14px; }
}

/* ================= 更新日志：双轨页签（站点版 / Win本地版） =================
   站点版与 Win本地版的版本号各编各的，所以各给一棵目录树：
   切页签时整块（目录 + 正文）一起换，不把两条线混在一棵树上。 */
.cl-tabs {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin: 0 0 26px;
}
.cl-tab {
  font: inherit; font-size: 14px; font-weight: 600;
  padding: 9px 20px; cursor: pointer; white-space: nowrap;
  color: var(--ink-soft); background: #fff;
  border: 1.5px solid var(--field-line); border-radius: var(--r-pill);
  transition: color .16s, border-color .16s, background .16s;
}
.cl-tab:hover { border-color: var(--brand); color: var(--brand-strong); }
.cl-tab.is-on { color: #fff; border-color: transparent; background: var(--brand); }
.doc-wrap.is-off, .changelog-wrap.is-off { display: none; }
.cl-empty { color: var(--muted); font-size: 14px; line-height: 1.9; }

/* ================= 空状态 ================= */
.empty {
  text-align: center;
  padding: 70px 20px;
  color: var(--muted);
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.empty h3 { font-family: var(--font-serif); color: var(--ink-soft); margin: 0 0 8px; font-size: 18px; }

/* ================= 通用按钮（全站唯一来源，数值见 :root 里的 --btn-*） ================= */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--btn-gap);
  height: var(--btn-h);
  padding: 0 var(--btn-px);
  border-radius: var(--btn-r);
  border: 1.5px solid transparent;
  font-size: var(--btn-fs); font-weight: 500; line-height: 1;
  font-family: var(--font);
  cursor: pointer;
  white-space: nowrap;
  transition: all var(--btn-dur);
  text-decoration: none;
}

.btn-primary { background: var(--brand); color: #fff; }
.btn-primary:hover { background: var(--brand-strong); color: #fff; }

.btn-ghost { background: #fff; border-color: var(--field-line); color: var(--ink-soft); }
.btn-ghost:hover { border-color: var(--brand); color: var(--brand-strong); }

/* 克制红系：白底红字，hover 才转红底白字，避免大面积粉底喧宾夺主 */
.btn-danger { background: #fff; border-color: #f0b6b8; color: var(--danger); }
.btn-danger:hover { background: var(--danger); border-color: var(--danger); color: #fff; }

.btn-sm { height: var(--btn-h-sm); padding: 0 var(--btn-px-sm); font-size: var(--btn-fs-sm); }

/* ================= 应用中心（前台 /apps） ================= */
.apps-page { padding: 8px 0 64px; }

.apps-hero {
  padding: 34px 36px;
  margin: 8px 0 30px;
  border-radius: var(--radius);
  background:
    radial-gradient(600px 220px at 92% -10%, rgba(47, 111, 237, .10), transparent 60%),
    linear-gradient(160deg, #ffffff, #f3f7ff);
  border: 1px solid var(--hairline);
  animation: rise .5s ease both;
}
.apps-hero h1 { margin: 0 0 10px; font-family: var(--font-serif); font-size: 28px; letter-spacing: 1px; }
.apps-hero p { margin: 0 0 6px; color: var(--ink-soft); line-height: 1.9; }
.apps-hero .apps-hint { color: var(--muted); font-size: 14px; }

.apps-alert {
  padding: 13px 18px;
  margin: 0 0 22px;
  border-radius: var(--radius-sm);
  background: #fdecec;
  border: 1px solid #f6c6c7;
  color: var(--danger);
  font-size: 14px;
  animation: rise .4s ease both;
}

.apps-section { margin: 0 0 34px; }
.apps-section h2 {
  display: flex; align-items: center; gap: 9px;
  font-family: var(--font-serif);
  font-size: 19px; letter-spacing: .5px;
  margin: 0 0 16px; padding-bottom: 10px;
  border-bottom: 1px solid var(--hairline);
}
.apps-sec-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: linear-gradient(140deg, #5aa2ff, var(--brand));
}

/* 应用中心 TAB 分区（模块 / 插件 / 主题） */
.apps-tabs {
  display: flex;
  gap: 6px;
  margin: 0 0 22px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--hairline);
  overflow-x: auto;
}
.apps-tab {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 20px;
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  background: var(--surface);
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 600;
  font-family: var(--font);
  cursor: pointer;
  white-space: nowrap;
  transition: all .18s;
}
.apps-tab:hover { border-color: var(--brand-line); color: var(--brand-strong); }
.apps-tab.active {
  background: linear-gradient(140deg, #5aa2ff, var(--brand));
  border-color: transparent;
  color: #fff;
}
.apps-tab-count {
  display: inline-grid;
  place-items: center;
  min-width: 19px; height: 19px;
  padding: 0 5px;
  border-radius: var(--r-pill);
  font-size: 11px;
  font-weight: 700;
  background: var(--brand-soft);
  color: var(--brand-strong);
}
.apps-tab.active .apps-tab-count { background: rgba(255, 255, 255, .22); color: #fff; }

.apps-panel { display: none; }
.apps-panel.active { display: block; animation: rise .4s ease both; }

.apps-empty {
  grid-column: 1 / -1;
  padding: 26px 20px;
  text-align: center;
  color: var(--muted);
  font-size: 14px;
  background: var(--surface);
  border: 1px dashed var(--line);
  border-radius: var(--radius);
}

.apps-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 18px;
}

.app-card {
  display: flex; flex-direction: column;
  padding: 22px 22px 18px;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
  transition: transform .2s, border-color .2s;
  animation: rise .5s ease both;
}
.app-card:hover { transform: translateY(-3px); border-color: var(--brand-line); }

.app-card-head { display: flex; align-items: center; gap: 13px; margin-bottom: 12px; }
.app-icon {
  flex-shrink: 0;
  width: 42px; height: 42px;
  display: grid; place-items: center;
  font-size: 20px;
  border-radius: var(--r-md);
  background: var(--brand-soft);
  border: 1px solid var(--brand-line);
  color: var(--brand-strong);
}
.app-icon-lg { width: 58px; height: 58px; font-size: 28px; border-radius: var(--r-lg); }

.app-card-title { min-width: 0; }
.app-card-name-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.app-name { font-family: var(--font-serif); font-size: 17px; font-weight: 700; color: var(--ink); }
.app-name:hover { color: var(--brand-strong); }
.app-meta { display: block; margin-top: 3px; color: var(--muted); font-size: 12.5px; }
.app-meta .ver-tag { margin-right: 0; }

/* 应用徽标（默认模块 / 内置） */
.app-badge {
  display: inline-block;
  font-size: 11px; font-weight: 700;
  padding: 2px 9px;
  border-radius: var(--r-pill);
  background: linear-gradient(140deg, #5aa2ff, var(--brand));
  color: #fff;
  white-space: nowrap;
}

/* 应用卡信息条：更新日志 / 作者 / 版本号（位于介绍文字下方） */
.app-card-info {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  margin: 0 0 16px;
  padding: 9px 13px;
  border-radius: var(--radius-sm);
  background: var(--brand-soft);
  border: 1px solid var(--brand-line);
}
.app-card-info .info-item {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 12.5px;
  color: var(--ink-soft);
}
.app-card-info .info-item .ver-tag { margin: 0; font-size: .9em; }
.app-card-info .info-cl {
  color: var(--brand-strong);
  font-weight: 600;
}
.app-card-info .info-cl:hover { text-decoration: underline; }

.app-desc { margin: 0 0 16px; color: var(--ink-soft); font-size: 14px; line-height: 1.85; flex: 1; }
.app-desc-lg { font-size: 15.5px; }

.app-card-foot {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 13px; border-top: 1px dashed var(--hairline);
}
.app-state {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12.5px; font-weight: 600;
  padding: 3px 11px; border-radius: var(--r-pill);
}
.app-state::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.app-state.on { color: var(--ok); background: #e8f8ee; }
.app-state.off { color: var(--muted); background: #f1f3f8; }
.app-state-lg { font-size: 14px; padding: 5px 14px; }

.app-acts { display: flex; align-items: center; gap: 8px; flex-wrap: nowrap; }
.app-act { display: inline-block; margin: 0; }

.app-builtin {
  display: inline-block;
  font-size: 11.5px; font-weight: 600;
  color: var(--muted);
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  padding: 2px 10px;
}
.app-builtin-tag { color: var(--brand-strong); font-size: 12.5px; }

/* 应用详情页 */
.app-detail {
  padding: 34px 36px;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
  animation: rise .5s ease both;
}
.app-detail-head { display: flex; align-items: center; gap: 18px; margin-bottom: 18px; }
.app-detail-title { flex: 1; min-width: 0; }
.app-detail-title h1 { margin: 0 0 6px; font-family: var(--font-serif); font-size: 26px; }
.app-detail-title .app-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.app-dot { color: var(--line); }

.app-detail-acts { display: flex; align-items: center; gap: 10px; margin: 22px 0 8px; flex-wrap: wrap; }

.app-tip {
  margin: 10px 0 22px;
  padding: 12px 16px;
  border-radius: var(--radius-sm);
  background: var(--brand-soft);
  border: 1px solid var(--brand-line);
  color: var(--ink-soft);
  font-size: 13.5px;
  line-height: 1.8;
}

/* 应用独立更新日志 */
.app-changelog { margin-top: 30px; }
.app-cl-item {
  padding: 18px 20px;
  margin-bottom: 14px;
  background: #fbfcff;
  border: 1px solid var(--hairline);
  border-radius: var(--radius-sm);
}
.app-cl-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.app-cl-ver .ver-tag { margin: 0; font-size: .82em; }
.app-cl-date { color: var(--muted); font-size: 13px; }
.app-cl-item ul { margin: 0; padding-left: 20px; color: var(--ink-soft); }
.app-cl-item li { margin: 6px 0; line-height: 1.8; }

.apps-empty { color: var(--muted); font-size: 14px; }

.app-detail-back { margin-top: 26px; }

/* ================= 落地页布局（左目录 + 正文，自适应） =================
   只设上下内边距，左右留给 .container，避免正文贴边。 */
.doc-main {
  padding-top: 8px;
  padding-bottom: 64px;
}

.doc-wrap {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  gap: 48px;
  align-items: start;
}

/* 无目录时正文独占一栏，避免右侧留白 */
.doc-wrap.no-toc {
  grid-template-columns: minmax(0, 1fr);
  max-width: 860px;
}

.doc-toc {
  position: sticky;
  top: 88px;
  max-height: calc(100vh - 108px);
  overflow-y: auto;
  padding: 6px 14px 14px 0;
  border-right: 1px solid var(--hairline);
  animation: rise .45s ease both;
}

.doc-toc h4 {
  display: flex; align-items: center; gap: 8px;
  margin: 0 0 14px;
  font-size: 11px; font-weight: 700;
  letter-spacing: 2.5px; color: var(--brand);
  text-transform: uppercase;
}

.doc-toc h4::before { content: ""; width: 16px; height: 2px; background: var(--brand); }

.doc-toc ul { list-style: none; margin: 0; padding: 0; }

.doc-toc a {
  position: relative;
  display: block;
  padding: 6px 10px;
  color: var(--ink-soft);
  font-size: 13.5px; line-height: 1.5;
  border-left: 2px solid transparent;
  transition: color .16s, border-color .16s, background .16s;
}

.doc-toc a:hover { color: var(--brand-strong); background: var(--brand-soft); border-left-color: var(--brand-line); }

.doc-toc a.active { color: var(--brand-strong); border-left-color: var(--brand); background: linear-gradient(90deg, var(--brand-soft), transparent 70%); font-weight: 600; }

.doc-toc .toc-1 > li > a { font-weight: 600; }

/* 目录条目不折行：让「最新」标签与版本号保持在同一行 */
.doc-toc li { white-space: nowrap; }

/* 二级目录（系列）：缩进一级，块级排布 */
.doc-toc .toc-2 { padding: 2px 0 8px 12px; }
.doc-toc .toc-2 a { font-size: 12.8px; color: var(--muted); padding: 4px 10px; }
/* 三级目录（具体版本）：再缩进一级，字号更小、更浅；徽章与版本号同一行 */
.doc-toc .toc-3 { padding: 2px 0 8px 24px; }
.doc-toc .toc-3 li { display: flex; align-items: center; gap: 6px; }
.doc-toc .toc-3 a { font-size: 12.3px; color: var(--muted); padding: 3px 10px; }

/* ================= 语义化版本规则 ================= */
/* 精致卡片：品牌色浅底描边 + 术语等宽小标签 + 铁律警示条，与侧栏一体化，无滚动条 */
.doc-semver {
  position: sticky;
  bottom: 0;
  margin-top: 16px;
  padding: 15px 14px 13px;
  border: 1px solid var(--brand-line);
  border-radius: var(--r-md);
  background: linear-gradient(180deg, #fff, var(--brand-soft) 150%);
}
.doc-semver h5 {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0 0 12px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--brand-strong);
  text-transform: uppercase;
  white-space: nowrap;
}
.doc-semver h5::before {
  content: "";
  align-self: center;
  width: 16px; height: 2px;
  border-radius: var(--r-sm);
  background: var(--brand);
  flex-shrink: 0;
}
.doc-semver h5 em {
  font-family: var(--mono);
  font-style: normal;
  font-size: 9.5px;
  letter-spacing: 1px;
  color: var(--muted);
}
.doc-semver ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 7px;
}
.doc-semver li {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  font-size: 12px;
  line-height: 1.55;
  color: var(--ink-soft);
  white-space: normal;
}
.doc-semver li .sv-key {
  flex-shrink: 0;
  margin-top: 1px;
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .5px;
  color: var(--brand-strong);
  background: var(--brand-soft);
  border: 1px solid var(--brand-line);
  border-radius: var(--r-pill);
  padding: 0 7px;
  line-height: 1.8;
  white-space: nowrap;
}
.doc-semver li b { color: var(--brand-strong); font-weight: 700; }
.doc-semver .doc-semver-key {
  margin-top: 3px;
  padding: 9px 11px;
  border: 1px solid #f3d3a8;
  border-left: 3px solid #e8852d;
  border-radius: var(--r-sm);
  background: linear-gradient(90deg, #fff6ec, #fff 78%);
  color: var(--ink);
  font-size: 11.5px;
  line-height: 1.6;
  display: block;
}
.doc-semver .doc-semver-key b { color: #d4551d; }

.doc-body { min-width: 0; }

/* ================= 前台注册（多用户） ================= */
.auth-card {
  max-width: 440px;
  margin: 48px auto 72px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 34px 34px 30px;
  animation: rise .45s ease both;
}
.auth-card-head { text-align: center; margin-bottom: 22px; }
.auth-mark {
  width: 46px; height: 46px; border-radius: var(--r-md);
  display: grid; place-items: center;
  margin: 0 auto 14px;
  background: linear-gradient(135deg, #4f9bff, #2f6fed);
  color: #fff; font-size: 22px;
}
.auth-card h1 { margin: 0 0 6px; font-size: 21px; }
.auth-card-head p { margin: 0; color: var(--muted); font-size: 13.5px; }
.auth-form .form-row { margin-bottom: 16px; }
.auth-form .form-row label { display: block; margin-bottom: 7px; font-size: 13.5px; font-weight: 600; color: var(--ink-soft); }
.auth-form input[type=text], .auth-form input[type=email], .auth-form input[type=password] {
  width: 100%; padding: 11px 14px;
  border: 1px solid var(--line); border-radius: var(--r-sm);
  font-size: 14.5px; font-family: var(--font); color: var(--ink);
  outline: none; background: #fff;
  transition: border .16s;
}
.auth-form input:focus {
  border-color: var(--brand-line);
}
.auth-form .hint { color: var(--muted); font-size: 12.5px; margin-top: 5px; }
.auth-submit { width: 100%; margin-top: 6px; padding: 12px 18px; font-size: 15px; }
.auth-alert {
  padding: 12px 16px; border-radius: var(--r-sm); margin-bottom: 16px;
  font-size: 14px;
}
.auth-ok { background: #e6f7ec; color: #15803d; border: 1px solid #bbf0cc; }
.auth-err { background: #fdecec; color: #c53030; border: 1px solid #f5c2c2; }
.auth-link-line { text-align: center; color: var(--muted); font-size: 13.5px; margin: 18px 0 0; }

/* ================= 主站主页（单栏全宽，无侧边栏） =================
   只设上下内边距，左右留给 .container，避免内容贴边。 */
.home-main {
  padding-top: 16px;
  padding-bottom: 70px;
  max-width: 940px;
}

/* ================= 主站首页（主页） ================= */
.off-hero { text-align: center; padding: 56px 0 30px; }

.off-mark {
  display: inline-flex; align-items: center; justify-content: center;
  width: 76px; height: 76px; margin-bottom: 20px;
  font-size: 34px; font-weight: 700; color: #fff;
  background: linear-gradient(135deg, #5aa2ff, var(--brand));
  border-radius: var(--r-lg);
}

.off-name {
  font-family: var(--font-serif);
  font-size: 42px; margin: 0 0 10px; letter-spacing: 1px;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
}

.off-name em { font-style: normal; color: var(--brand); }

/* 中文名与英文名分两行：英文作注脚，明显小一号、字距拉开居中 */
.off-name .off-name-en {
  font-family: var(--font);
  font-size: 15px; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase;
}

/* 主页标题下的版本角标（{{verTag}} 统一调用，随版本自动更新），独占一行居中 */
.off-name .off-ver { display: block; margin: 10px 0 0; text-align: center; }

/* 首页置顶公告条：标题、摘要、日期各归各位，窄屏自动折行 */
.off-ann {
  display: flex; flex-direction: column; gap: 8px;
  margin: 0 0 22px; padding: 14px 18px;
  border: 1px solid var(--line); border-left: 4px solid var(--brand);
  border-radius: 10px; background: var(--surface);
}
.off-ann-head {
  display: flex; align-items: center; gap: 8px;
  color: var(--brand-strong); font-weight: 700;
  font-size: 13px; letter-spacing: 1px;
}
.off-ann-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-width: 0; }
.off-ann-pin { flex-shrink: 0; background: #fff3e0; color: #b45309; }
.off-ann-title { font-weight: 600; color: var(--ink); text-decoration: none; }
.off-ann-title:hover { color: var(--brand-strong); }
.off-ann-sum { color: var(--muted); font-size: 13px; }
.off-ann-date { color: var(--muted); font-size: 12px; margin-left: auto; }

/* ================= 悬浮刷新钮（Win本地版专属） =================
   刷新 + 清空缓存，但不动登录状态：会话在 HttpOnly Cookie 里，脚本一个 cookie 都没碰。
   放在右下角，不挡正文；前台与后台各接一套样式，长得一样。 */
.cache-fab {
  position: fixed; right: 22px; bottom: 24px; z-index: 86;
  display: grid; place-items: center;
  width: 46px; height: 46px; padding: 0;
  border: 1.5px solid var(--field-line); border-radius: 50%;
  background: #fff; color: var(--brand-strong);
  font: inherit; cursor: pointer;
  transition: transform .16s, border-color .16s, color .16s;
}
.cache-fab:hover { transform: translateY(-2px); border-color: var(--brand); color: var(--brand); }
.cache-fab .ico { width: 18px; height: 18px; }
.cache-fab.is-busy { opacity: .6; pointer-events: none; }
.cache-fab.is-busy .ico { animation: cacheSpin .9s linear infinite; }
@keyframes cacheSpin { to { transform: rotate(360deg); } }

/* ================= 联系作者（悬停显示微信二维码） ================= */
.contact-fab {
  position: fixed; right: 22px; bottom: 24px; z-index: 80;
  display: block; text-decoration: none;
}
.contact-fab-btn {
  display: grid; place-items: center;
  width: 52px; height: 52px;
  border: none; border-radius: 50%;
  background: linear-gradient(135deg, #5aa2ff, var(--brand));
  color: #fff; font-size: 21px; line-height: 1;
  transition: transform .18s;
}
.contact-fab:hover .contact-fab-btn { transform: translateY(-3px); }

.contact-qr-pop {
  position: absolute; right: 0; bottom: 64px;
  width: 212px; box-sizing: border-box;
  padding: 12px 12px 10px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  text-align: center;
  opacity: 0; visibility: hidden;
  transform: translateY(8px);
  transition: opacity .18s, transform .18s, visibility .18s;
}
.contact-fab:hover .contact-qr-pop,
.contact-entry:hover .contact-qr-pop,
.contact-link:hover .contact-qr-pop {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.contact-qr-pop img { width: 100%; height: auto; display: block; border-radius: 6px; }
.contact-qr-tip { display: block; margin-top: 9px; font-size: 12.5px; color: var(--ink-soft); line-height: 1.55; }

/* 首页底部「联系作者」入口卡：弹层居中于卡片上方 */
.contact-entry { position: relative; }
.contact-entry .contact-qr-pop {
  right: auto; left: 50%; bottom: calc(100% + 14px);
  transform: translateX(-50%) translateY(8px);
}
.contact-entry:hover .contact-qr-pop { transform: translateX(-50%) translateY(0); }

/* 页脚「联系作者」链接：弹层居中于链接上方 */
.contact-link {
  position: relative;
  color: var(--ink-soft); font-size: 13px; white-space: nowrap;
  cursor: pointer;
}
.contact-link:hover { color: var(--brand-strong); }
.contact-link .contact-qr-pop {
  right: auto; left: 50%; bottom: calc(100% + 10px);
  transform: translateX(-50%) translateY(8px);
}
.contact-link:hover .contact-qr-pop { transform: translateX(-50%) translateY(0); }
@media (max-width: 760px) {
  .contact-fab { right: 14px; bottom: 16px; }
  .contact-qr-pop { width: 188px; }
}

.off-slogan { font-family: var(--font-serif); font-size: 21px; color: var(--ink-soft); margin: 0 0 12px; }
.off-desc { color: var(--muted); max-width: 620px; margin: 0 auto 28px; font-size: 15px; }

.off-cta { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

.off-stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
  max-width: 620px; margin: 0 auto 30px;
}
.off-stat {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px 14px;
}
.off-stat strong { display: block; font-size: 16px; color: var(--brand-strong); margin-bottom: 4px; }
.off-stat span { color: var(--muted); font-size: 13px; }

.off-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.off-step {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 22px 24px;
  transition: transform .18s, border-color .18s;
}
.off-step:hover { transform: translateY(-2px); border-color: var(--brand-line); }
.off-step-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; margin-bottom: 12px;
  border-radius: 50%; background: var(--brand); color: #fff; font-weight: 700;
}
.off-step h3 { font-family: var(--font-serif); margin: 0 0 6px; font-size: 17px; }
.off-step p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.85; }

.off-section { margin-top: 56px; }

.off-heading {
  font-family: var(--font-serif);
  font-size: 22px; text-align: center; margin: 0 0 8px;
  letter-spacing: 1px;
}

.off-heading-sub {
  text-align: center; color: var(--muted); font-size: 14px; margin: 0 0 28px;
}

.off-features { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }

.off-card {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 22px 24px;
  transition: transform .18s, border-color .18s;
}

.off-card:hover { transform: translateY(-2px); border-color: var(--brand-line); }

.off-card-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; margin-bottom: 12px;
  border-radius: var(--r-md); background: var(--brand-soft); color: var(--brand-strong);
  font-weight: 700; font-size: 20px; line-height: 1;
}

.off-card h3 { font-family: var(--font-serif); margin: 0 0 8px; font-size: 17px; }
.off-card p { margin: 0; color: var(--muted); font-size: 14.5px; line-height: 1.85; }

.off-download {
  display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 24px 28px;
}

.off-version { display: flex; align-items: baseline; gap: 14px; }
.off-version-tag { color: var(--muted); font-size: 14px; }
.off-version-num { font-size: 30px; color: var(--brand-strong); font-family: var(--mono); }
.off-version-meta { display: flex; gap: 12px; flex-wrap: wrap; }
/* 版本下载区的「本版新增」摘要：整行铺开，排在版本与按钮下方 */
.off-version-note { flex: 1 1 100%; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.85; }

/* 首页底部三张入口卡：横排三列——关于我们 / 更新日志 / 联系作者，一站排开 */
.off-entries { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }

/* 窄屏退一档：三列快挤成竖条之前先收成两列（620px 以下再收成单列，见下方响应式） */
@media (max-width: 760px) { .off-entries { grid-template-columns: repeat(2, 1fr); } }

.off-entry {
  display: flex; flex-direction: column; gap: 6px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 20px 24px; color: var(--ink);
  transition: transform .18s, border-color .18s;
}

.off-entry:hover { transform: translateY(-2px); border-color: var(--brand-line); color: var(--ink); }

.off-entry .oe-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.off-entry strong { font-family: var(--font-serif); font-size: 17px; }
.off-entry .oe-arrow { color: var(--brand); }
.off-entry span { color: var(--muted); font-size: 13.5px; line-height: 1.8; }

.off-quote {
  margin-top: 48px;
  text-align: center;
  font-family: var(--font-serif);
  font-size: 17px; color: var(--ink-soft);
  padding: 28px 0;
  border-top: 3px double var(--line);
  border-bottom: 3px double var(--line);
}

.off-quote em { font-style: normal; color: var(--brand-strong); }

.off-quote span {
  display: block;
  margin-top: 16px;
  font-family: var(--font);
  font-size: 12.5px; font-weight: 500;
  letter-spacing: 2px; color: var(--muted);
}

/* ================= 响应式 ================= */
@media (max-width: 1080px) {
  .header-actions .search-box { width: 150px; }
  .main-nav a { padding: 8px 10px; font-size: 14px; }
}

@media (max-width: 900px) {
  html, body { overflow-x: hidden; }
  .layout { grid-template-columns: 1fr; gap: 28px; }
  .layout-single { max-width: none; }
  .sidebar { position: static; }

  /* 顶部导航收成抽屉：汉堡展开，点外部 / Esc / 链接自动收起 */
  .main-nav {
    display: none;
    position: absolute;
    top: calc(64px + env(safe-area-inset-top)); left: 0; right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    max-height: calc(100vh - 64px - env(safe-area-inset-top));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background: var(--surface);
    border-bottom: 1px solid var(--line);
    padding: 12px clamp(16px, 4vw, 28px) 18px;
  }
  .main-nav.open { display: flex; }
  .main-nav a { padding: 13px 12px; font-size: 15.5px; border-radius: var(--r-sm); }
  .main-nav a.active { background: var(--brand-soft); }
  .main-nav a::after { display: none; }

  /* 抽屉里的「模块」下拉：就地展开，不再浮层遮挡 */
  .main-nav .nav-dd { width: 100%; }
  .main-nav .nav-dd-btn { display: flex; justify-content: space-between; padding: 13px 12px; font-size: 15.5px; }
  .main-nav .nav-dd-menu {
    position: static; min-width: 0; padding: 0 0 6px 14px;
    opacity: 1; visibility: visible; transform: none;
    background: transparent; border: 0;
    backdrop-filter: none; -webkit-backdrop-filter: none;
    display: none;
  }
  .main-nav .nav-dd.open .nav-dd-menu { display: flex; }
  .main-nav .nav-dd-menu a { padding: 11px 12px; font-size: 14.5px; }

  /* 「模块」大面板现在是全局居中弹窗（见 .nav-mega），
     抽屉里只留触发按钮：整行铺满、与相邻抽屉项同样的行高与字号，更易点按。 */
  .main-nav .nav-mega-trigger { width: 100%; }
  .main-nav .nav-mega-trigger .nav-dd-btn { display: flex; justify-content: space-between; padding: 13px 12px; font-size: 15.5px; border-radius: var(--r-sm); }

  /* 搜索框移入抽屉（JS 负责迁移），整行铺满更易点 */
  .header-actions .search-box { display: none; }
  .main-nav .search-box { display: flex; width: 100%; margin: 2px 0 8px; }
  .main-nav .search-box input { height: 44px; font-size: 15px; border-radius: var(--r-md); padding-left: 40px; }
  .main-nav .search-box .search-ico { left: 14px; font-size: 15px; }

  /* 抽屉打开：背板 + 锁屏滚动 */
  body.nav-open::before {
    content: ""; position: fixed; inset: 0; z-index: 40;
    background: rgba(15, 23, 42, .34);
    backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px);
  }
  body.nav-open { overflow: hidden; }
  /* 抽屉展开时顶栏改实底：半透明顶栏会把底下的暗色背板透上来，
     整条报头糊成一条发灰的“透明条”，观感正是用户反馈的“翻车”。 */
  body.nav-open .site-header {
    background: #fff;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .nav-toggle { display: grid; width: 44px; height: 44px; }
  .nav-toggle svg { width: 22px; height: 22px; }
  .hdr-bell { width: 42px; height: 42px; }

  /* 移动端表单控件字号 ≥16px，避免 iOS 聚焦时自动放大页面 */
  input[type=text], input[type=email], input[type=password], input[type=search],
  input[type=number], input[type=tel], input[type=url], textarea, select {
    font-size: 16px;
  }

  .footer-inner { justify-content: center; text-align: center; }
  .post-article h1 { font-size: 26px; }
  .masthead-title { font-size: 28px; }
  .pf-title { font-size: 26px; }
  .pi-num { width: 40px; }

  /* 落地页：目录改为顶部横向滚动条 */
  .doc-wrap { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .doc-toc {
    position: static;
    max-height: none;
    border-right: 0;
    border-bottom: 1px solid var(--hairline);
    padding: 2px 0 12px;
  }
  .doc-toc h4 { margin-bottom: 8px; }
  .doc-toc ul.toc-1 {
    display: flex; flex-wrap: nowrap;
    overflow-x: auto;
    gap: 8px;
    padding-bottom: 4px;
    scrollbar-width: none;
  }
  .doc-toc ul.toc-1::-webkit-scrollbar { display: none; }
  .doc-toc ul.toc-1 > li { flex-shrink: 0; }
  .doc-toc .toc-2 { display: flex; flex-wrap: nowrap; gap: 6px; padding: 0; margin-left: 4px; }
  .doc-toc .toc-2 li { flex-shrink: 0; }
  .doc-toc .toc-3 { display: flex; flex-wrap: nowrap; gap: 6px; padding: 0; margin-left: 4px; }
  .doc-toc .toc-3 li { flex-shrink: 0; }
  .doc-toc a { display: inline-block; white-space: nowrap; border-left: 0; border-radius: var(--r-sm); padding: 5px 11px; background: var(--bg-soft); }
  .doc-toc a.active { border-left: 0; background: var(--brand-soft); }
  .doc-toc .toc-2 a { background: transparent; font-size: 12.5px; }
  .doc-toc .toc-3 a { background: transparent; font-size: 12.3px; }
  /* 移动端：规则块回到文档流，保留卡片样式，位于横向目录条下方 */
  .doc-semver {
    position: static;
    margin-top: 12px;
  }

  /* 落地页：标题字号收敛、步骤栅格降档，留白收窄、控件更好点 */
  .off-hero { padding: 36px 0 22px; }
  .off-mark { width: 62px; height: 62px; font-size: 28px; margin-bottom: 16px; }
  .off-name { font-size: clamp(30px, 7vw, 38px); }
  .off-slogan { font-size: 18px; }
  .off-desc { font-size: 14.5px; margin-bottom: 24px; }
  .off-section { margin-top: 40px; }
  .off-heading { font-size: 20px; }
  .off-heading-sub { margin-bottom: 22px; }
  .off-steps { grid-template-columns: repeat(2, 1fr); }
  .off-download { padding: 20px; }
  .off-quote { margin-top: 36px; }
}

@media (max-width: 620px) {
  .off-features, .off-entries, .off-stats, .off-steps { grid-template-columns: 1fr; }
  .off-name { font-size: 30px; }
  .off-name .off-name-en { font-size: 13px; letter-spacing: 2px; }
  .off-download { flex-direction: column; align-items: stretch; text-align: center; }
  .off-version { justify-content: center; }
  .off-version-meta { justify-content: center; }
  /* 落地页控件统一：CTA 按钮整行等高，卡片内边距对齐 */
  .off-ann { padding: 12px 14px; }
  .off-ann-sum { flex-basis: 100%; }
  .off-ann-date { margin-left: 0; }
  .off-cta { flex-direction: column; align-items: stretch; }
  .off-cta .btn { width: 100%; }
  .off-version-meta .btn { flex: 1 1 auto; }
  .off-step, .off-card, .off-entry { padding: 18px; }
  .off-step-num { width: 30px; height: 30px; }
  /* 登录 / 注册 / 安装向导：卡片收边，提交按钮拉满更好点 */
  .auth-card { padding: 26px 22px 24px; margin: 30px auto 56px; }
  .auth-card h1 { font-size: 20px; }
  .auth-submit { min-height: 46px; }
  .masthead-top { font-size: 10px; gap: 8px; }
  .post-index { gap: 14px; }
  .pi-arrow { display: none; }

  /* 应用中心 */
  .apps-hero, .app-detail { padding: 22px 18px; }
  .apps-hero h1 { font-size: 23px; }
  .apps-grid { grid-template-columns: 1fr; }
  .app-detail-head { flex-wrap: wrap; gap: 14px; }
  .app-detail-title h1 { font-size: 22px; }
  .app-card-foot { flex-wrap: wrap; gap: 10px; }
  .app-detail-acts { width: 100%; }
  .app-detail-acts .btn { flex: 1 1 auto; }
}

@media (prefers-reduced-motion: reduce) {
  .post-feature, .post-index, .masthead, .site-header, .doc-toc { animation: none; }
}

/* ================= 电商 · 晴空小铺 ================= */
.tag-active { background: var(--brand); border-color: var(--brand); color: #fff; }
.tag-active:hover { color: #fff; }
.tag-count { font-style: normal; font-size: 11px; margin-left: 4px; opacity: .75; }

.shop-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 26px; }

.shop-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 18px;
  animation: rise .5s ease both;
}

.shop-card {
  display: flex; flex-direction: column; gap: 10px;
  padding: 20px 20px 16px;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
  color: var(--ink);
  transition: transform .2s, border-color .2s;
}
.shop-card:hover { transform: translateY(-3px); border-color: var(--brand-line); color: var(--ink); }

.shop-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.shop-cat { font-size: 12px; font-weight: 600; letter-spacing: .5px; color: var(--brand-strong); }

.shop-badge {
  font-size: 11.5px; font-weight: 600;
  padding: 2px 9px; border-radius: var(--r-pill);
  background: var(--brand-soft); color: var(--brand-strong);
  white-space: nowrap;
}
.shop-badge-out { background: #fdecec; color: var(--danger); }

.shop-title { margin: 0; font-family: var(--font-serif); font-size: 17px; line-height: 1.5; color: var(--ink); }

.shop-summary {
  margin: 0;
  color: var(--muted); font-size: 13.5px; line-height: 1.7;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

.shop-card-foot {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
  margin-top: auto; padding-top: 11px;
  border-top: 1px dashed var(--hairline);
}

.shop-price { color: var(--danger); font-weight: 700; font-size: 18px; font-family: var(--mono); }
.shop-price-lg { font-size: 30px; }

.shop-sales { color: var(--muted); font-size: 12.5px; white-space: nowrap; }

/* 商品详情 */
.shop-detail-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 24px; flex-wrap: wrap;
  padding: 6px 0 22px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 26px;
}
.shop-detail-info { min-width: 0; }
.shop-detail-info h1 { margin: 8px 0 10px; font-family: var(--font-serif); font-size: 28px; line-height: 1.45; }
.shop-detail-buy { text-align: right; flex-shrink: 0; }
.shop-stock { font-size: 13.5px; color: var(--ok); margin: 6px 0 14px; }
.shop-stock-out { color: var(--danger); }
.shop-detail .btn[disabled] { opacity: .55; cursor: not-allowed; }
.shop-cover { width: 100%; border-radius: var(--r-md); margin: 0 0 26px; }

@media (max-width: 620px) {
  .shop-grid { grid-template-columns: 1fr; }
  .shop-detail-buy { text-align: left; width: 100%; }
  .shop-detail-info h1 { font-size: 23px; }
}

/* ============================================================
   晴空书架（文库模块）· 三栏：左书架分类 / 中藏本卡片流 / 右馆藏温度
   设计语言：开放式图书馆 —— 书脊导航 / 封面感藏本卡片 / 热读榜
   反对付费墙、广告轰炸与下载繁琐，全文即点即读
   ============================================================ */

/* ---------- 书架页头 ---------- */
.shelf-hero {
  padding: 30px 4px 6px;
  border-bottom: 1px solid var(--hairline);
  margin-bottom: 8px;
}
.shelf-kicker {
  display: inline-block;
  font-size: 12px;
  letter-spacing: 2px;
  color: var(--brand);
  background: var(--brand-soft);
  border: 1px solid var(--brand-line);
  border-radius: var(--r-pill);
  padding: 4px 13px;
  margin-bottom: 12px;
}
.shelf-title {
  margin: 0 0 8px;
  font-family: var(--font-serif);
  font-size: 30px;
  line-height: 1.4;
  color: var(--ink);
}
.shelf-sub {
  margin: 0 0 18px;
  color: var(--ink-soft);
  font-size: 14.5px;
  line-height: 1.9;
}

/* ---------- 三栏布局 ---------- */
.shelf-layout {
  display: grid;
  grid-template-columns: 205px minmax(0, 1fr) 262px;
  gap: 26px;
  align-items: start;
  padding: 18px 0 46px;
}

/* ---------- 左栏：书架分类（书脊） ---------- */
.shelf-side { position: sticky; top: 88px; }
.shelf-side-title {
  margin: 0 0 12px;
  font-size: 13px;
  letter-spacing: 1.5px;
  color: var(--muted);
  font-weight: 700;
}
.shelf-nav { display: flex; flex-direction: column; gap: 9px; }
.shelf-spine {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 13px 10px 16px;
  border-radius: var(--r-md);
  background: linear-gradient(90deg, #dfe7f6, #eef2fa);
  border-left: 5px solid #a9c3ee;
  color: var(--ink-soft);
  font-size: 13.5px;
  transition: transform .15s, background .15s;
}
.shelf-spine:hover {
  transform: translateX(3px);
  color: var(--brand-strong);
  border-left-color: var(--brand);
  background: linear-gradient(90deg, #d6e4fb, #e9f1fe);
}
.shelf-spine.on {
  border-left-color: var(--brand);
  background: linear-gradient(90deg, var(--brand), #5a9bff);
  color: #fff;
}
.shelf-spine .spine-count {
  font-size: 11.5px;
  background: rgba(47, 111, 237, .1);
  color: var(--brand-strong);
  border-radius: var(--r-pill);
  padding: 1px 8px;
}
.shelf-spine.on .spine-count { background: rgba(255, 255, 255, .22); color: #fff; }
.shelf-side-note {
  margin: 16px 0 0;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.8;
  border-top: 1px dashed var(--line);
  padding-top: 12px;
}

/* ---------- 中栏：藏本卡片流 ---------- */
.shelf-main { min-width: 0; }
.shelf-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(238px, 1fr));
  gap: 20px;
}
.shelf-empty { grid-column: 1 / -1; }

.book-card {
  border: 1px solid var(--line);
  background: var(--surface);
  border-radius: var(--r-md);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform .18s;
}
.book-card:hover {
  transform: translateY(-4px);
}

/* 封面（色相按藏本 id 轮换） */
.book-cover {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  aspect-ratio: 5 / 3;
  padding: 15px 16px;
  color: #fff;
  text-decoration: none;
  background:
    radial-gradient(120% 90% at 85% -10%, rgba(255, 255, 255, .28), transparent 55%),
    linear-gradient(165deg, hsl(var(--book-hue) 72% 64%), hsl(var(--book-hue) 76% 42%));
}
.book-cover:hover { color: #fff; }
.book-spine-tag {
  align-self: flex-start;
  font-size: 11px;
  letter-spacing: .5px;
  background: rgba(255, 255, 255, .24);
  border-radius: var(--r-pill);
  padding: 3px 10px;
}
.book-cover-title {
  font-family: var(--font-serif);
  font-size: 18.5px;
  font-weight: 700;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.book-cover-meta {
  font-size: 10.5px;
  letter-spacing: 2.5px;
  opacity: .85;
}

/* 卡片内容 */
.book-body {
  padding: 13px 15px 15px;
  display: flex;
  flex-direction: column;
  gap: 7px;
  flex: 1;
}
.book-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.book-cat {
  font-size: 11.5px;
  color: var(--brand);
  background: var(--brand-soft);
  border-radius: var(--r-pill);
  padding: 2px 9px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.book-stars {
  color: #f5a623;
  letter-spacing: 1px;
  font-size: 12.5px;
  white-space: nowrap;
}
.book-title {
  margin: 0;
  font-family: var(--font-serif);
  font-size: 16px;
  line-height: 1.55;
}
.book-title a { color: var(--ink); }
.book-title a:hover { color: var(--brand); }
.book-summary {
  margin: 0;
  color: var(--ink-soft);
  font-size: 12.5px;
  line-height: 1.75;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.book-foot {
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px dashed var(--hairline);
  display: flex;
  align-items: center;
  gap: 11px;
  font-size: 12px;
  color: var(--muted);
}
.book-heat { color: #e07b39; }
.book-read {
  margin-left: auto;
  color: var(--brand);
  font-weight: 700;
  font-size: 12.5px;
}

/* ---------- 右栏：馆藏温度 ---------- */
.shelf-temp { position: sticky; top: 88px; }
.temp-heat {
  background: linear-gradient(180deg, #fff7ef, #fffdfa);
  border: 1px solid #ffe3c8;
  border-radius: var(--r-lg);
  padding: 18px;
}
.temp-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  text-align: center;
}
.temp-stats b {
  display: block;
  font-family: var(--font-serif);
  font-size: 19px;
  color: #d9621c;
  line-height: 1.3;
}
.temp-stats span { font-size: 11px; color: var(--muted); }
.temp-sub {
  margin: 16px 0 10px;
  font-size: 13.5px;
  color: #a44a10;
}
.temp-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.temp-item a {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 9px;
  border-radius: var(--r-sm);
  text-decoration: none;
}
.temp-item a:hover { background: #fff3e6; }
.temp-rank {
  flex-shrink: 0;
  width: 21px;
  height: 21px;
  border-radius: var(--r-sm);
  display: grid;
  place-items: center;
  font-size: 11.5px;
  font-weight: 700;
  color: #fff;
  background: #f5b36e;
}
.temp-item:nth-child(1) .temp-rank { background: #f0712f; }
.temp-item:nth-child(2) .temp-rank { background: #f2924a; }
.temp-item:nth-child(3) .temp-rank { background: #f5b36e; }
.temp-title {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  color: var(--ink);
}
.temp-views { flex-shrink: 0; font-size: 11px; color: var(--muted); }
.temp-empty {
  padding: 12px 4px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
}
.temp-poem {
  margin: 14px 0 0;
  padding-top: 12px;
  border-top: 1px dashed #ffe3c8;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.8;
}

/* ---------- 阅读页：藏本全文 ---------- */
.read-crumb {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 12.5px;
  color: var(--muted);
  padding: 20px 0 6px;
}
.read-crumb a { color: var(--muted); }
.read-crumb a:hover { color: var(--brand); }
.read-crumb span:last-child { color: var(--ink-soft); }

.read-article {
  border: 1px solid var(--line);
  max-width: 780px;
  margin: 0 auto;
  background: var(--surface);
  border-radius: var(--r-lg);
  padding: 34px 42px 30px;
}
.read-head { margin-bottom: 18px; }
.read-badges {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.read-title {
  margin: 0 0 12px;
  font-family: var(--font-serif);
  font-size: 29px;
  line-height: 1.45;
  color: var(--ink);
}
.read-meta {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 12.5px;
  color: var(--muted);
}
.read-summary {
  margin: 0 0 20px;
  padding: 13px 17px;
  border-left: 3px solid var(--brand);
  background: var(--bg-soft);
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.9;
  border-radius: 0 10px 10px 0;
}
.read-toc {
  margin: 0 0 22px;
  padding: 13px 17px;
  background: #f8fafd;
  border: 1px solid var(--hairline);
  border-radius: var(--r-md);
  font-size: 13px;
}
.read-toc summary {
  cursor: pointer;
  font-weight: 700;
  color: var(--ink-soft);
  margin-bottom: 6px;
}
.read-toc ul.toc-1 { list-style: none; margin: 6px 0 0; padding: 0; }
.read-toc ul.toc-1 > li { margin: 4px 0; }
.read-toc .toc-2 { list-style: none; margin: 2px 0 2px 16px; padding: 0; }
.read-toc .toc-2 li { margin: 2px 0; }
.read-toc a { color: var(--ink-soft); }
.read-toc a:hover { color: var(--brand); }
.read-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 26px;
  padding-top: 16px;
  border-top: 1px dashed var(--hairline);
}
.read-foot-note { font-size: 12px; color: var(--muted); }

/* ---------- 温书人批注 ---------- */
.note-zone {
  max-width: 780px;
  margin: 26px auto 46px;
}
.note-zone-title {
  margin: 0 0 14px;
  font-family: var(--font-serif);
  font-size: 19px;
  color: var(--ink);
}
.note-zone-title small { font-size: 12.5px; color: var(--muted); font-weight: 400; }
.note-item {
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--r-md);
  padding: 13px 16px;
  margin-bottom: 10px;
}
.note-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}
.note-author {
  font-weight: 700;
  font-size: 13.5px;
  color: var(--brand-strong);
}
.note-author::before { content: "温书人 "; font-weight: 400; color: var(--muted); font-size: 11.5px; }
.note-time { font-size: 11.5px; color: var(--muted); }
.note-content {
  font-size: 14px;
  line-height: 1.85;
  color: var(--ink);
  white-space: pre-wrap;
}
.note-empty {
  background: var(--surface);
  border: 1px dashed var(--line);
  border-radius: var(--r-md);
  padding: 22px;
  text-align: center;
  color: var(--muted);
  font-size: 13.5px;
  margin-bottom: 14px;
}
.note-form {
  background: linear-gradient(180deg, #f8fafd, var(--surface));
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: 18px 20px;
  margin-top: 6px;
}
.note-form h3 { margin: 0 0 12px; font-size: 15px; color: var(--ink); }
.note-form .hp { display: none; }

/* ---------- 书架响应式 ---------- */
@media (max-width: 1060px) {
  .shelf-layout { grid-template-columns: 1fr; gap: 22px; }
  .shelf-side, .shelf-temp { position: static; }
  .shelf-nav { flex-direction: row; flex-wrap: wrap; }
  .shelf-spine { flex: 1 1 150px; }
  .temp-stats { max-width: 420px; }
}
@media (max-width: 620px) {
  .shelf-grid { grid-template-columns: 1fr; }
  .shelf-hero { padding-top: 20px; }
  .read-article { padding: 22px 18px 24px; }
  .read-title { font-size: 23px; }
  .shelf-title { font-size: 24px; }
}

/* ================= 论坛 · 共鸣板 ================= */
/* 三栏版式需要更宽的画布：单栏容器放宽到主题全宽 */
.layout-single:has(.echo-layout) { max-width: 1280px; }

.echo-hero { padding: 6px 0 26px; }
.echo-hero .ph-note { max-width: 640px; }
.echo-hero .ph-note b { color: var(--brand-strong); }

.echo-layout {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr) 250px;
  gap: 22px;
  align-items: start;
  margin-bottom: 42px;
}

.echo-left, .echo-right { position: sticky; top: 88px; display: flex; flex-direction: column; gap: 16px; }

.echo-panel {
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
  padding: 16px 18px;
}
.echo-panel-title {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
  margin: 0 0 14px;
  font-size: 12px; font-weight: 700; letter-spacing: 1.5px;
  color: var(--brand);
  text-transform: uppercase;
}
.echo-panel-title::before { content: ""; width: 16px; height: 2px; background: var(--brand); margin-right: 2px; }
.echo-title-note { font-weight: 400; letter-spacing: 0; color: var(--muted); font-size: 11.5px; text-transform: none; }

/* —— 热度气泡：大=热、红=争议、灰=沉底 —— */
.echo-dot {
  display: inline-block; flex-shrink: 0;
  border-radius: 50%;
  vertical-align: middle;
  background: #c3cbd9;
}
.echo-dot-hot { background: #4f7ef7; }
/* —— 论坛「共鸣板」专属主题色：紫系（.thm-forum scoped 覆盖，全站蓝 → 紫） —— */
.thm-forum {
  --accent: #7c3aed;
  --accent-strong: #6d28d9;
  --accent-soft: #ede9fe;
  --accent-line: #ddd6fe;
}
.thm-forum .ph-kicker { color: var(--accent); }
.thm-forum .echo-hero .ph-note b { color: var(--accent-strong); }
.thm-forum .echo-panel-title { color: var(--accent); }
.thm-forum .echo-panel-title::before { background: var(--accent); }
.thm-forum .echo-dot-hot { background: var(--accent); }
.thm-forum .echo-dot-mild { background: #a78bfa; } /* 浅紫，对应原浅蓝 */
.thm-forum .echo-badge-hot { background: var(--accent-soft); color: var(--accent-strong); }
.thm-forum .echo-badge-echo { background: var(--accent-soft); color: var(--accent-strong); border: 1px solid var(--accent-line); }
.thm-forum .echo-pin { background: var(--accent); }
.thm-forum .echo-nav-item:hover { background: var(--bg-soft); color: var(--accent-strong); }
.thm-forum .echo-card-title a:hover { color: var(--accent-strong); }
.thm-forum .echo-score-num { color: var(--accent); }
.thm-forum .echo-top a:hover { color: var(--accent-strong); }
.thm-forum .echo-top li em { color: var(--accent); }
.thm-forum .echo-voice-avatar { background: var(--accent-soft); color: var(--accent-strong); }
.thm-forum .echo-reply-avatar { background: var(--accent-soft); color: var(--accent-strong); }
.thm-forum .echo-sec-card:hover { border-color: var(--accent-line); }
.thm-forum .echo-sec-mood { color: var(--accent-strong); background: var(--accent-soft); }
.thm-forum .echo-stat { background: linear-gradient(160deg, rgba(255, 255, 255, .92), rgba(237, 233, 254, .66)); }
.thm-forum .echo-stat b { color: var(--accent-strong); }
.thm-forum .echo-post { background: linear-gradient(160deg, rgba(255, 255, 255, .95), rgba(237, 233, 254, .72)); }
.thm-forum .echo-post select:focus, .thm-forum .echo-post input[type="text"]:focus, .thm-forum .echo-post textarea:focus { border-color: var(--accent-line); }
.thm-forum .echo-post-who b { color: var(--accent-strong); }
.thm-forum .echo-post-login { background: var(--accent-soft); border-color: var(--accent-line); }
.thm-forum .mod-back a:hover { border-color: var(--accent-line); color: var(--accent-strong); background: var(--accent-soft); }
.echo-dot-mild { background: #8fb0fb; }
.echo-dot-quiet { background: #d5dbe5; }
.echo-dot-fire { background: #e5484d; }
.echo-dot-cold { background: #c3cbd9; }

/* —— 状态徽标 —— */
.echo-badge {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11px; font-weight: 600; line-height: 1;
  padding: 4px 9px; border-radius: var(--r-pill); white-space: nowrap;
}
.echo-badge-hot { background: #e7efff; color: #2f5fe0; }
.echo-badge-cold { background: #eef1f6; color: #7a8598; }
.echo-badge-fire { background: #fdeaea; color: #d13438; }
.echo-badge-echo { background: #eef4ff; color: #3a6df0; border: 1px solid #d5e4ff; }
.echo-badge-deep { background: #eafaf1; color: #1f9d55; }

.echo-pin {
  display: inline-flex; align-items: center;
  font-size: 10.5px; font-weight: 700; letter-spacing: .5px;
  color: #fff; background: var(--brand);
  padding: 3px 8px; border-radius: var(--r-sm);
  vertical-align: 2px;
}

/* —— 左栏 · 版块导航 —— */
.echo-nav { display: flex; flex-direction: column; gap: 2px; padding: 12px 10px; }
.echo-nav-item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; border-radius: var(--r-sm);
  color: var(--ink-soft); font-size: 13.5px;
  transition: background .15s, color .15s;
}
.echo-nav-item:hover { background: var(--bg-soft); color: var(--brand-strong); }
.echo-nav-item .echo-dot { flex-shrink: 0; }
.echo-nav-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.echo-nav-item em {
  font-style: normal; font-family: var(--mono); font-size: 11px; color: var(--muted);
  background: var(--bg-soft); border-radius: var(--r-pill); padding: 1px 7px;
}
.echo-nav-all { font-weight: 600; }
.echo-nav-tip { margin: 10px 6px 0; font-size: 11.5px; line-height: 1.75; color: var(--muted); }

/* —— 中栏 · 帖子卡片流 —— */
.echo-mid { min-width: 0; }
.echo-mid > .echo-panel { padding: 6px 10px 14px; }
.echo-card {
  display: flex; align-items: flex-start; gap: 14px;
  padding: 15px 12px 13px;
  border-bottom: 1px solid var(--hairline);
  transition: background .15s;
}
.echo-card:last-of-type { border-bottom: 0; }
.echo-card:hover { background: linear-gradient(90deg, var(--bg-soft), transparent 72%); }
.echo-card-bubble { width: 46px; display: flex; justify-content: center; padding-top: 7px; }
.echo-card-body { flex: 1; min-width: 0; }
.echo-card-title { margin: 0 0 7px; font-size: 15.5px; font-weight: 600; line-height: 1.55; }
.echo-card-title a { color: var(--ink); }
.echo-card-title a:hover { color: var(--brand-strong); }
.echo-card-title .echo-pin { margin-right: 6px; }
.echo-card-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; color: var(--muted); font-size: 12.5px; }
.echo-card-score {
  flex-shrink: 0; text-align: center; min-width: 62px;
  padding: 2px 0 0 12px; border-left: 1px dashed var(--hairline);
}
.echo-score-num { display: block; font-family: var(--mono); font-size: 19px; font-weight: 700; color: var(--brand); line-height: 1.2; }
.echo-score-label { font-size: 10.5px; color: var(--muted); }

/* —— 右栏 · 回声榜 + 活跃发声人 —— */
.echo-top { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.echo-top li { display: flex; align-items: center; gap: 8px; padding: 7px 8px; border-radius: var(--r-sm); transition: background .15s; }
.echo-top li:hover { background: var(--bg-soft); }
.echo-top a { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1; color: var(--ink-soft); font-size: 13px; }
.echo-top a:hover { color: var(--brand-strong); }
.echo-top-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.echo-top li em { font-style: normal; font-family: var(--mono); font-size: 12px; font-weight: 700; color: var(--brand); }
.echo-voices { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
.echo-voices li { display: flex; align-items: center; gap: 10px; }
.echo-voice-avatar {
  width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0;
  background: var(--brand-soft); color: var(--brand-strong);
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 700;
}
.echo-voice-name { flex: 1; min-width: 0; font-size: 13.5px; color: var(--ink-soft); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.echo-voices em { font-style: normal; font-size: 11px; color: var(--muted); white-space: nowrap; }
.echo-empty { color: var(--muted); font-size: 12.5px; padding: 8px 2px; line-height: 1.7; }

/* —— 帖子详情 —— */
.echo-thread-head { padding: 6px 0 22px; border-bottom: 1px solid var(--line); margin-bottom: 26px; }
.echo-thread-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.echo-thread-title { margin: 0 0 12px; font-family: var(--font-serif); font-size: 28px; line-height: 1.45; }
.echo-thread-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; color: var(--muted); font-size: 13px; }
.echo-thread-body { font-size: 15.5px; line-height: 1.95; color: var(--ink-soft); }
.echo-thread-body p { margin: 0 0 1em; }
.echo-thread-body pre {
  background: var(--bg-soft); border: 1px solid var(--hairline);
  border-radius: var(--radius-sm); padding: 14px 16px; overflow-x: auto;
  font-size: 13.5px; line-height: 1.7;
}
.echo-replies { margin-top: 42px; }
.echo-replies-title { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; margin: 0 0 6px; font-size: 19px; }
.echo-reply { padding: 18px 0; border-bottom: 1px solid var(--hairline); }
.echo-reply-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.echo-reply-avatar {
  width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0;
  background: var(--brand-soft); color: var(--brand-strong);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 700;
}
.echo-reply-name { font-weight: 600; font-size: 13.5px; color: var(--ink); }
.echo-reply-time { color: var(--muted); font-size: 12px; }
.echo-reply-content { color: var(--ink-soft); font-size: 14.5px; line-height: 1.9; white-space: pre-wrap; word-break: break-word; }
.echo-reply-hint { margin: 2px 0 12px; font-size: 12.5px; color: var(--muted); line-height: 1.7; }
.echo-reply-form { margin-top: 26px; }

/* —— 版块 · 共鸣卡片墙 —— */
.echo-sections { margin-top: 6px; }
.echo-wall-title { margin: 0 0 18px; font-size: 20px; font-family: var(--font-serif); }
.echo-wall { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 18px; }
.echo-sec-card {
  padding: 20px 22px;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
  transition: transform .2s, border-color .2s;
}
.echo-sec-card:hover { transform: translateY(-3px); border-color: var(--brand-line); }
.echo-sec-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 9px; }
.echo-sec-name { font-family: var(--font-serif); font-size: 19px; color: var(--ink); }
.echo-sec-count { font-size: 11.5px; color: var(--muted); background: var(--bg-soft); border-radius: var(--r-pill); padding: 2px 9px; white-space: nowrap; }
.echo-sec-desc { margin: 0 0 12px; color: var(--muted); font-size: 13px; line-height: 1.75; }
.echo-sec-mood {
  margin: 0; font-size: 12.5px; line-height: 1.7; color: var(--brand-strong);
  background: var(--brand-soft); border-radius: var(--radius-sm); padding: 9px 12px;
}

/* —— 响应式 —— */
@media (max-width: 980px) {
  .echo-layout { grid-template-columns: minmax(0, 1fr); }
  .echo-left, .echo-right { position: static; }
  .echo-left { order: 1; }
  .echo-mid { order: 2; }
  .echo-right { order: 3; }
  .echo-nav { flex-direction: row; flex-wrap: wrap; }
  .echo-nav-item em { display: none; }
}
@media (max-width: 620px) {
  .echo-wall { grid-template-columns: 1fr; }
  .echo-card-score { display: none; }
  .echo-thread-title { font-size: 23px; }
  .echo-card-meta { gap: 5px 12px; }
}

/* ================= 招聘 · 晴空职栈 ================= */
/* 设计语言延续「晴空报」：纸感卡片 + 规则线 + 清新蓝，三栏布局自成一版 */

/* 页头 */
.job-hero { padding: 30px 0 26px; animation: rise .5s ease both; }
.job-hero-kicker {
  display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: 2.5px;
  color: var(--brand-strong); background: var(--brand-soft);
  border: 1px solid var(--brand-line); border-radius: var(--r-pill);
  padding: 4px 14px; margin-bottom: 14px;
}
.job-hero-title { margin: 0 0 8px; font-family: var(--font-serif); font-size: 34px; letter-spacing: 1px; }
.job-hero-note { margin: 0; color: var(--ink-soft); font-size: 14.5px; line-height: 1.9; max-width: 640px; }

/* 三栏主布局 */
.job-layout {
  display: grid;
  grid-template-columns: 196px minmax(0, 1fr) 252px;
  gap: 22px;
  align-items: start;
  padding-bottom: 36px;
}
.job-col { min-width: 0; }

/* 左栏：筛选 */
.job-filter {
  position: sticky; top: 84px;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
  padding: 16px 16px 12px;
  animation: rise .5s ease both;
}
.job-filter-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.job-filter h3, .job-wall h3 {
  margin: 0 0 4px; font-size: 12px; font-weight: 700;
  letter-spacing: 2px; color: var(--brand); text-transform: uppercase;
}
.job-filter-reset { font-size: 12px; color: var(--muted); }
.job-filter-reset:hover { color: var(--danger); }
.job-filter-group { padding: 10px 0 4px; border-top: 1px dashed var(--hairline); margin-top: 10px; }
.job-filter-group:first-of-type { border-top: 0; margin-top: 0; }
.job-filter-group h4 { margin: 0 0 6px; font-size: 13px; color: var(--ink-soft); font-weight: 600; }
.job-filter-link {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 6px 10px; margin-bottom: 3px; border-radius: var(--r-sm);
  font-size: 13.5px; color: var(--ink-soft);
  transition: background .16s, color .16s;
}
.job-filter-link:hover { background: var(--bg-soft); color: var(--brand-strong); }
.job-filter-link.active { background: var(--brand-soft); color: var(--brand-strong); font-weight: 600; }
.job-filter-link em {
  font-style: normal; font-size: 11.5px; color: var(--muted);
  background: var(--bg-soft); border-radius: var(--r-pill); padding: 1px 8px;
}
.job-filter-link.active em { background: var(--surface); color: var(--brand-strong); }

/* 中栏：职位卡片清单 */
.job-list-head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  font-size: 13px; color: var(--muted);
  padding: 2px 4px 12px;
}
.job-list-head strong { color: var(--brand-strong); font-size: 15px; }
.job-list-filtered { color: var(--brand-strong); background: var(--brand-soft); border-radius: var(--r-pill); padding: 3px 12px; }

.job-card {
  display: block;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
  padding: 18px 20px 15px;
  margin-bottom: 14px;
  transition: transform .2s, border-color .2s;
  animation: rise .5s ease both;
}
.job-card:hover { transform: translateY(-3px); border-color: var(--brand-line); }

.job-card-top { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }

/* 岗位状态灯：招聘中（绿）/ 暂停（黄）/ 已满（红） */
.status-light {
  display: inline-block; flex-shrink: 0;
  width: 11px; height: 11px; border-radius: 50%;
  background: #22c55e;
  animation: pulseLight 2.4s ease-in-out infinite;
}
.status-light.paused { background: #eab308; animation: none; }
.status-light.filled { background: #ef4444; animation: none; }
@keyframes pulseLight {
  0%, 100% { }
  50% { }
}

.status-pill {
  font-size: 12px; font-weight: 600; line-height: 1;
  padding: 4px 10px; border-radius: var(--r-pill); white-space: nowrap;
  color: #15803d; background: #f0fdf4; border: 1px solid #bbf7d0;
}
.status-pill.paused { color: #a16207; background: #fefce8; border-color: #fde68a; }
.status-pill.filled { color: #b91c1c; background: #fef2f2; border-color: #fecaca; }

/* 新鲜度标签 */
.job-fresh {
  margin-left: auto;
  font-size: 12px; color: var(--muted);
  background: var(--bg-soft); border-radius: var(--r-pill); padding: 3px 10px; white-space: nowrap;
}
.job-fresh.fresh-new { color: #15803d; background: #f0fdf4; border: 1px solid #bbf7d0; font-weight: 600; }

.job-card-title { margin: 0 0 8px; font-family: var(--font-serif); font-size: 18.5px; line-height: 1.5; }
.job-card-title a { color: var(--ink); }
.job-card-title a:hover { color: var(--brand-strong); }

.job-card-meta { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 10px; }
.job-chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 12px; color: var(--ink-soft);
  background: var(--bg-soft); border: 1px solid var(--hairline);
  border-radius: var(--r-pill); padding: 3px 10px; white-space: nowrap;
}

.job-card-salary {
  font-family: var(--mono); font-weight: 700; font-size: 17px;
  color: var(--brand-strong);
}
.job-card-salary::before { content: "薪资 "; font-family: var(--font); font-size: 12px; font-weight: 600; color: var(--muted); margin-right: 4px; }

.job-summary {
  margin: 10px 0 0; color: var(--ink-soft); font-size: 13.5px; line-height: 1.8;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

.job-card-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin-top: 13px; padding-top: 11px;
  border-top: 1px dashed var(--hairline);
}
.job-card-date { font-size: 12px; color: var(--muted); }
.job-more { font-size: 12.5px; font-weight: 600; color: var(--brand); }
.job-card:hover .job-more { color: var(--brand-strong); }

/* 右栏：在招企业墙 */
.job-wall { position: sticky; top: 84px; }
.job-wall-intro { font-size: 12.5px; color: var(--muted); margin: 4px 0 12px; }
.job-wall-card {
  display: block;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
  padding: 15px 16px;
  margin-bottom: 12px;
  color: var(--ink);
  transition: transform .2s, border-color .2s;
  animation: rise .5s ease both;
}
.job-wall-card:hover { transform: translateY(-2px); border-color: var(--brand-line); color: var(--ink); }
.job-wall-card h4 { margin: 0 0 4px; font-family: var(--font-serif); font-size: 16px; }
.job-wall-count { display: inline-block; font-size: 12px; color: var(--brand-strong); font-weight: 600; margin-bottom: 8px; }
.job-wall-types { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.job-wall-latest {
  margin: 0; font-size: 12px; color: var(--muted); line-height: 1.6;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;
}

/* ---------- 详情页 ---------- */
/* 靠谱提示：给求职者的安心话术 */
.job-trust {
  display: flex; gap: 13px; align-items: flex-start;
  background: linear-gradient(120deg, #eff8ff, #f0fdf4);
  border: 1px solid var(--brand-line);
  border-radius: var(--radius);
  padding: 15px 18px;
  margin: 6px 0 24px;
  animation: rise .5s ease both;
}
.job-trust-mark {
  flex-shrink: 0; width: 34px; height: 34px; border-radius: var(--r-sm);
  display: grid; place-items: center;
  background: linear-gradient(140deg, #5aa2ff, var(--brand));
  color: #fff; font-family: var(--font-serif); font-weight: 700; font-size: 16px;
}
.job-trust strong { display: block; font-size: 13.5px; color: var(--brand-strong); margin-bottom: 3px; }
.job-trust p { margin: 0; font-size: 13px; color: var(--ink-soft); line-height: 1.8; }

.job-detail-head { padding: 8px 0 20px; border-bottom: 1px solid var(--line); margin-bottom: 22px; }
.job-detail-flags { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.job-detail-flags .job-fresh { margin-left: 0; }
.job-detail-head h1 { margin: 0 0 12px; font-family: var(--font-serif); font-size: 30px; line-height: 1.45; }
.job-detail-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.job-detail-date { font-size: 12.5px; color: var(--muted); }

/* 薪资带宽条 */
.job-salary-band {
  display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap;
  background: var(--brand-soft);
  border: 1px solid var(--brand-line);
  border-radius: var(--radius);
  padding: 14px 20px;
  margin-bottom: 14px;
}
.job-salary-label { font-size: 12.5px; font-weight: 700; letter-spacing: 2px; color: var(--brand-strong); }
.job-salary-amount { font-family: var(--mono); font-size: 26px; font-weight: 700; color: var(--brand-strong); }

/* 福利清单 */
.job-benefits {
  display: flex; align-items: flex-start; gap: 14px;
  border: 1px dashed var(--brand-line);
  border-radius: var(--radius);
  padding: 13px 18px;
  margin-bottom: 20px;
}
.job-benefits-label { flex-shrink: 0; font-size: 12.5px; font-weight: 700; letter-spacing: 2px; color: var(--brand-strong); padding-top: 5px; }
.job-benefits-list { display: flex; flex-wrap: wrap; gap: 8px; }
.job-benefit-chip {
  font-size: 12.5px; font-weight: 600; color: var(--brand-strong);
  background: var(--surface); border: 1px solid var(--brand-line);
  border-radius: var(--r-pill); padding: 4px 13px;
}

.job-detail-summary {
  margin: 0 0 20px; color: var(--ink-soft); font-size: 15px; line-height: 1.9;
  padding-left: 14px; border-left: 3px solid var(--brand-line);
}

/* 响应式：三栏 → 单栏堆叠 */
@media (max-width: 1100px) {
  .job-layout { grid-template-columns: 1fr; gap: 20px; }
  .job-filter, .job-wall { position: static; }
  .job-filter-group { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; border-top: 0; padding: 0; margin: 0 0 10px; }
  .job-filter-group h4 { margin: 0 4px 0 0; }
  .job-filter-link { margin-bottom: 0; }
  .job-wall { order: 3; }
  .job-wall-types, .job-wall-latest { display: none; }
}

@media (max-width: 620px) {
  .job-hero { padding: 20px 0 18px; }
  .job-hero-title { font-size: 26px; }
  .job-detail-head h1 { font-size: 23px; }
  .job-salary-amount { font-size: 21px; }
  .job-benefits { flex-direction: column; gap: 6px; }
}

/* ============================================================
   电商 · 晴空小铺 v2 · 透明小铺（差异化设计）
   透明三件套：库存条看得见 / 售后承诺置顶 / 到货时效写明白
   「安心购」徽标 + 「买前须知」区块 + 橱窗陈列 / 展示台版面
   ============================================================ */

/* 首页「透明三件套」信任条 */
.shop-trust {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 0 0 26px;
}
.shop-trust-item {
  background: linear-gradient(180deg, var(--surface), #fafbff);
  border: 1px solid var(--brand-line);
  border-radius: var(--radius);
  padding: 13px 16px;
}
.shop-trust-item b { display: block; color: var(--brand-strong); font-size: 14.5px; margin-bottom: 3px; }
.shop-trust-item span { display: block; color: var(--muted); font-size: 12.5px; line-height: 1.6; }

/* 橱窗陈列：商品大卡（双列） */
.shop-window {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  animation: rise .5s ease both;
}
.shop-card {
  display: flex; flex-direction: column;
  padding: 0;
  overflow: hidden;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--r-lg);
  color: var(--ink);
  transition: transform .2s, border-color .2s;
}
.shop-card:hover { transform: translateY(-4px); border-color: var(--brand-line); color: var(--ink); }

/* 文字封面：没有大图也有一眼记住的「门面」 */
.shop-card-cover {
  position: relative;
  height: 172px;
  display: grid; place-items: center;
  background:
    radial-gradient(120px 90px at 82% 18%, rgba(255, 255, 255, .5), transparent 60%),
    linear-gradient(150deg, #6ab0ff 0%, var(--brand) 55%, var(--brand-strong) 100%);
}
.shop-cover-char {
  font-family: var(--font-serif);
  font-size: 76px; font-weight: 700; line-height: 1;
  color: rgba(255, 255, 255, .92);
}
.shop-cat-tag {
  position: absolute; top: 12px; left: 12px;
  font-size: 11.5px; font-weight: 600; letter-spacing: .5px;
  padding: 3px 10px; border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .92); color: var(--brand-strong);
}
.shop-tag-price {
  position: absolute; right: 12px; bottom: 12px;
  font-family: var(--mono); font-weight: 700; font-size: 16px;
  padding: 4px 12px; border-radius: var(--r-pill);
  background: #fff; color: var(--danger);
}
.shop-card-body { display: flex; flex-direction: column; gap: 10px; padding: 16px 18px 18px; flex: 1; }
.shop-title { margin: 0; font-family: var(--font-serif); font-size: 18px; line-height: 1.5; color: var(--ink); }
.shop-summary {
  margin: 0; color: var(--muted); font-size: 13.5px; line-height: 1.7;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.shop-stock-row {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-top: auto; padding-top: 12px;
  border-top: 1px dashed var(--hairline);
}

/* 库存条（透明三件套之一）：10 格，每格约 10 件，亮格 = 剩余库存看得见 */
.shelf-bar {
  display: flex; gap: 3px; flex: 1; min-width: 96px;
}
.shelf-bar i {
  flex: 1; height: 7px; border-radius: var(--r-pill);
  background: #e6ebf4;
  transition: background .2s;
}
.shelf-bar i.on { background: var(--brand); }
.shop-remain { font-size: 12px; color: var(--muted); white-space: nowrap; font-family: var(--mono); }

/* 「安心购」徽标：紧张红 / 充足绿 / 缺货灰 */
.shop-badge {
  font-size: 11.5px; font-weight: 600;
  padding: 2px 10px; border-radius: var(--r-pill);
  white-space: nowrap;
}
.shop-badge-low { background: #fdecec; color: var(--danger); border: 1px solid #f6c9cb; }
.shop-badge-ok  { background: #e7f6ec; color: var(--ok); border: 1px solid #bce6c9; }
.shop-badge-out { background: #eef0f4; color: var(--muted); border: 1px solid #dde1ea; }

/* —— 详情页 · 展示台 —— */

/* 售后承诺条（透明三件套之二）：详情页顶部固定，买前就把售后说清楚 */
.shop-after-sales {
  position: sticky; top: 64px; z-index: 40;
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
  background: linear-gradient(90deg, var(--brand-soft), #f4f8ff);
  border: 1px solid var(--brand-line);
  border-radius: var(--radius);
  padding: 10px 18px;
  margin-bottom: 22px;
}
.shop-after-sales-title { font-weight: 700; color: var(--brand-strong); font-size: 14px; white-space: nowrap; }
.shop-after-sales ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 16px; flex-wrap: wrap; }
.shop-after-sales li { font-size: 13px; color: var(--ink-soft); }
.shop-after-sales li::before { content: "✓ "; color: var(--ok); font-weight: 700; }

/* 展示台：左参数卡 + 右说明文 */
.shop-stage {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 26px;
  align-items: start;
}
.shop-param {
  position: sticky; top: 140px;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--r-lg);
  padding: 20px;
  display: flex; flex-direction: column; gap: 14px;
}
.shop-param-head {
  display: flex; flex-direction: column; gap: 8px;
  padding-bottom: 14px;
  border-bottom: 1px dashed var(--hairline);
}
.shop-param-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 12px; }
.shop-param-list > div { display: flex; flex-direction: column; gap: 4px; }
.shop-param-list dt { font-size: 12px; color: var(--muted); letter-spacing: .5px; }
.shop-param-list dd { margin: 0; font-size: 14px; color: var(--ink); line-height: 1.6; }
.shop-param-list dd .shelf-bar { margin: 6px 0 2px; }

.shop-desc { min-width: 0; }
.shop-desc-title { margin: 4px 0 10px; font-family: var(--font-serif); font-size: 30px; line-height: 1.45; }

/* 买前须知（透明三件套之四…其实是给小白的贴心清单） */
.shop-guide {
  margin-top: 30px;
  background: linear-gradient(180deg, #fdfbf3, #fbf9f1);
  border: 1px solid #f0e6c8;
  border-radius: var(--r-lg);
  padding: 20px 24px 22px;
}
.shop-guide h2 { margin: 0 0 10px; font-family: var(--font-serif); font-size: 19px; color: #8a6d1d; }

/* 响应式 */
@media (max-width: 860px) {
  .shop-stage { grid-template-columns: 1fr; }
  .shop-param { position: static; }
}
@media (max-width: 620px) {
  .shop-window { grid-template-columns: 1fr; }
  .shop-trust { grid-template-columns: 1fr; }
  .shop-after-sales { top: 56px; }
  .shop-desc-title { font-size: 24px; }
  .shop-card-cover { height: 150px; }
}

/* ============================================================
   动态 · 晴空瞬语（一页没有算法的心情日记）
   设计语言：日记纸 / 竖线时间轴 / 手写感时刻标记 / 治愈系暖调
   反对信息茧房与同质化刷屏：没有推荐流、没有转发、没有焦虑倒计时
   前缀类：.momo-*
   ============================================================ */

/* —— 刊头 —— */
.momo-hero { padding: 34px 0 6px; animation: rise .5s ease both; }
.momo-kicker {
  font-size: 12px; font-weight: 700; letter-spacing: 3px;
  color: var(--brand); text-transform: uppercase;
}
.momo-title { margin: 8px 0 10px; font-family: var(--font-serif); font-size: 34px; line-height: 1.3; }
.momo-note { margin: 0; color: var(--ink-soft); font-size: 14.5px; line-height: 1.9; }

/* —— 静静模式说明条：一进门就先看见这句承诺 —— */
.momo-quiet {
  display: flex; align-items: center; gap: 13px;
  background: linear-gradient(120deg, #f0f7ff, #f7fbf4);
  border: 1px solid var(--brand-line);
  border-radius: var(--r-md);
  padding: 13px 18px;
  margin: 16px 0 20px;
  animation: rise .5s ease both;
}
.momo-quiet-mark {
  flex-shrink: 0; width: 32px; height: 32px; border-radius: 50%;
  display: grid; place-items: center;
  background: linear-gradient(140deg, #6fb1ff, var(--brand));
  color: #fff; font-family: var(--font-serif); font-weight: 700; font-size: 15px;
}
.momo-quiet-text { margin: 0; font-size: 13.5px; color: var(--ink-soft); line-height: 1.8; }
.momo-quiet-text b { color: var(--brand-strong); }

/* —— 今日 · 一句话 卡片 —— */
.momo-today {
  position: relative;
  background: linear-gradient(180deg, #fffdf5, #fdf9ea);
  border: 1px solid #f0e3bd;
  border-radius: var(--r-lg);
  padding: 18px 22px 16px;
  margin-bottom: 22px;
  animation: rise .5s ease both;
}
.momo-today::before {
  content: "❝";
  position: absolute; top: -6px; right: 16px;
  font-family: var(--font-serif); font-size: 46px; line-height: 1;
  color: #e8d49a;
}
.momo-today-head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  margin-bottom: 10px;
}
.momo-today-tag {
  font-size: 11.5px; font-weight: 700; letter-spacing: 2px;
  color: #8a6d1d; background: #faf3d8;
  border: 1px solid #ecdfae; border-radius: var(--r-pill); padding: 3px 11px;
}
.momo-today-date { font-size: 12px; color: var(--muted); }
.momo-today-quote {
  margin: 0; padding: 0 26px 0 0;
  font-family: var(--font-serif); font-size: 16.5px; line-height: 1.9;
  color: var(--ink);
}
.momo-today-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  margin-top: 12px; padding-top: 10px;
  border-top: 1px dashed #e9dcb2;
}
.momo-today-author { font-size: 13px; color: #8a6d1d; }
.momo-today-link { font-size: 12.5px; font-weight: 600; color: var(--brand); }
.momo-today-link:hover { color: var(--brand-strong); }
.momo-today-empty { color: var(--muted); font-size: 14px; text-align: center; padding: 20px; }
.momo-today-empty p { margin: 0; }

/* —— 中右两栏布局 —— */
.momo-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 24px;
  align-items: start;
}

/* —— 中栏：日记纸时间线 —— */
.momo-mid { min-width: 0; }
.momo-paper {
  position: relative;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--r-lg);
  padding: 20px 24px 12px;
  animation: rise .5s ease both;
}
.momo-panel-title {
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
  margin: 0 0 6px; font-size: 15.5px; font-weight: 700;
}
.momo-title-note { font-size: 12px; font-weight: 400; color: var(--muted); }

/* 时间线条目：左侧竖线 + 小圆点 */
.momo-item {
  position: relative;
  display: flex; gap: 16px;
  padding: 16px 0 18px 4px;
}
.momo-item::before { /* 竖线时间轴 */
  content: "";
  position: absolute; left: 8px; top: 26px; bottom: -2px;
  width: 1px;
  background: repeating-linear-gradient(180deg, #d8dce6 0 4px, transparent 4px 8px);
}
.momo-item:last-child::before { display: none; }
.momo-dot {
  flex-shrink: 0; width: 17px; height: 17px; border-radius: 50%;
  margin-top: 5px;
  background: radial-gradient(circle at 35% 30%, #fff, #bfd7ff 55%, var(--brand) 100%);
  border: 2px solid var(--surface);
}
.momo-item-body { flex: 1; min-width: 0; }
.momo-item-meta {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-bottom: 6px;
}
.momo-when {
  font-size: 12px; font-weight: 700; letter-spacing: 1.5px;
  color: var(--brand-strong);
  background: var(--brand-soft);
  border: 1px solid var(--brand-line);
  border-radius: var(--r-pill); padding: 2px 10px;
  white-space: nowrap;
}
.momo-date { font-size: 12px; color: var(--muted); white-space: nowrap; }
.momo-author { font-size: 12.5px; color: var(--ink-soft); }
.momo-pin {
  font-size: 11px; font-weight: 700; color: #8a6d1d;
  background: #faf3d8; border: 1px solid #ecdfae;
  border-radius: var(--r-pill); padding: 2px 8px; white-space: nowrap;
}
.momo-content {
  margin: 0 0 10px;
  font-family: var(--font-serif); font-size: 15.5px; line-height: 1.95;
  color: var(--ink);
  white-space: pre-wrap;
  word-break: break-word;
}
.momo-item-foot {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  padding-top: 10px;
  border-top: 1px dashed var(--hairline);
}
.momo-like button {
  display: inline-flex; align-items: center; gap: 6px;
  font: inherit; font-size: 13px; font-weight: 600; cursor: pointer;
  color: var(--brand-strong);
  background: transparent; border: 0; padding: 4px 2px;
  transition: transform .15s, color .15s;
}
.momo-like button:hover { color: #e5484d; transform: translateY(-1px); }
.momo-like button:active { transform: scale(.94); }
.momo-heart { font-size: 15px; line-height: 1; }
.momo-comments {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 13px; color: var(--muted);
}
.momo-comments:hover { color: var(--brand); }
.momo-read { margin-left: auto; font-size: 12.5px; font-weight: 600; color: var(--brand); }
.momo-read:hover { color: var(--brand-strong); }

/* 空状态 */
.momo-empty { text-align: center; padding: 40px 20px; }
.momo-empty h3 { margin: 0 0 6px; font-family: var(--font-serif); }
.momo-empty p { margin: 0; color: var(--muted); font-size: 13.5px; }

/* —— 右栏 —— */
.momo-right { position: sticky; top: 84px; }
.momo-panel {
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--r-md);
  padding: 16px 18px;
  margin-bottom: 16px;
  animation: rise .5s ease both;
}
.momo-panel .momo-panel-title { margin-bottom: 12px; }

.momo-hot { list-style: none; margin: 0; padding: 0; }
.momo-hot li {
  padding: 10px 0;
  border-bottom: 1px dashed var(--hairline);
}
.momo-hot li:last-child { border-bottom: 0; }
.momo-hot a { display: block; color: var(--ink); }
.momo-hot a:hover { color: var(--brand-strong); }
.momo-hot-when {
  display: block; font-size: 11.5px; font-weight: 700; letter-spacing: 1px;
  color: var(--brand-strong); margin-bottom: 3px;
}
.momo-hot-text {
  display: block; font-size: 13px; line-height: 1.65;
  color: var(--ink-soft);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.momo-hot li em {
  display: block; margin-top: 5px; font-style: normal;
  font-size: 11.5px; color: #e5484d; font-weight: 600;
}
.momo-hot li em::before { content: "♡ "; }

.momo-echoes { list-style: none; margin: 0; padding: 0; }
.momo-echoes li { padding: 10px 0; border-bottom: 1px dashed var(--hairline); }
.momo-echoes li:last-child { border-bottom: 0; }
.momo-echo-text {
  margin: 0 0 6px; font-size: 13.5px; line-height: 1.7; color: var(--ink);
}
.momo-echo-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.momo-echo-name { font-size: 12.5px; font-weight: 700; color: var(--brand-strong); }
.momo-echo-about { font-size: 12px; color: var(--muted); }
.momo-echo-time { display: block; margin-top: 4px; font-size: 11.5px; color: var(--muted); }

.momo-empty-sm { color: var(--muted); font-size: 13px; padding: 6px 0; }

/* —— 详情页 —— */
.momo-back { margin: 18px 0 14px; font-size: 13.5px; }
.momo-back a { color: var(--muted); }
.momo-back a:hover { color: var(--brand-strong); }

/* 单条动态详情页：一页日记的阅读宽度，不让卡片撑满整个版心 */
.layout-single:has(.momo-page) { max-width: 860px; }

.momo-page {
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--r-lg);
  padding: 26px 28px 20px;
  animation: rise .5s ease both;
}
.momo-page-meta {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-bottom: 12px;
}
.momo-page-author { margin: 0 0 12px; font-family: var(--font-serif); font-size: 22px; line-height: 1.5; }
.momo-page-content {
  margin: 0 0 18px; font-family: var(--font-serif); font-size: 16.5px; line-height: 2;
  white-space: pre-wrap; word-break: break-word;
}
.momo-page-foot {
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
  padding-top: 14px; border-top: 1px dashed var(--hairline);
}
.momo-page-echo-count { font-size: 13px; color: var(--muted); }

.momo-echo-section {
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--r-lg);
  padding: 20px 24px;
  margin-top: 18px;
  animation: rise .5s ease both;
}
.momo-echo-title { margin: 0 0 14px; font-size: 16px; font-weight: 700; }
.momo-echo-item { padding: 12px 0; border-bottom: 1px dashed var(--hairline); }
.momo-echo-item:last-of-type { border-bottom: 0; }
.momo-echo-head {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-bottom: 6px;
}
.momo-echo-avatar {
  flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%;
  display: grid; place-items: center;
  background: linear-gradient(140deg, #ffd9a8, #ffb36b);
  color: #7a4a10; font-size: 12.5px; font-weight: 700;
}
.momo-echo-content { margin: 0; font-size: 14.5px; line-height: 1.85; color: var(--ink); }

.momo-comment-form { margin-top: 18px; padding-top: 16px; border-top: 1px dashed var(--hairline); }
.momo-comment-head { margin-bottom: 10px; }
.momo-comment-hint { font-size: 12.5px; font-weight: 700; color: var(--brand-strong); }

/* —— 动态·晴空瞬语 专属主题色：玫红系（.thm-moments scoped 覆盖，全站蓝 → 玫红） —— */
.thm-moments {
  --accent: #e11d48;
  --accent-strong: #be123c;
  --accent-soft: #ffe4e6;
  --accent-line: #fecdd3;
}
.thm-moments .momo-kicker { color: var(--accent); }
.thm-moments .momo-quiet {
  background: linear-gradient(120deg, var(--accent-soft), #fdf6f8);
  border-color: var(--accent-line);
}
.thm-moments .momo-quiet-mark {
  background: linear-gradient(140deg, #fb7185, var(--accent));
}
.thm-moments .momo-quiet-text b { color: var(--accent-strong); }
.thm-moments .momo-today-link { color: var(--accent); }
.thm-moments .momo-today-link:hover { color: var(--accent-strong); }
.thm-moments .momo-dot {
  background: radial-gradient(circle at 35% 30%, #fff, #ffc6d3 55%, var(--accent) 100%);
}
.thm-moments .momo-when {
  color: var(--accent-strong);
  background: var(--accent-soft);
  border-color: var(--accent-line);
}
.thm-moments .momo-like button { color: var(--accent-strong); }
.thm-moments .momo-comments:hover { color: var(--accent); }
.thm-moments .momo-read { color: var(--accent); }
.thm-moments .momo-read:hover { color: var(--accent-strong); }
.thm-moments .momo-hot a:hover { color: var(--accent-strong); }
.thm-moments .momo-hot-when { color: var(--accent-strong); }
.thm-moments .momo-echo-name { color: var(--accent-strong); }
.thm-moments .momo-back a:hover { color: var(--accent-strong); }
.thm-moments .momo-comment-hint { color: var(--accent-strong); }
.thm-moments .momo-comment-form input:focus,
.thm-moments .momo-comment-form textarea:focus {
  border-color: var(--accent-line);
}
.thm-moments .momo-post {
  background: linear-gradient(160deg, rgba(255, 255, 255, .95), rgba(255, 228, 230, .62));
  border-color: var(--accent-line);
}
.thm-moments .momo-post textarea:focus {
  outline: none; border-color: var(--accent-line);
}
.thm-moments .momo-post-hint b { color: var(--accent-strong); }
.thm-moments .momo-post-login {
  background: var(--accent-soft);
  border-color: var(--accent-line);
}

/* ============================================================
   动态·晴空瞬语「沉浸式场景」升级（.thm-moments.momo-scene 作用域）
   场景：飘落纸屑的日记本 —— 玫红玻璃 hero + 纸屑/纸飞机 + 便签纸条时间线
   玫红主题色不变（--accent:#e11d48），语义色保留（共鸣红、金色日记纸暖调）
   ============================================================ */

/* —— 场景 hero：玫红渐变玻璃 + 飘落纸屑 / 纸飞机 —— */
.thm-moments.momo-scene .momo-scene-hero {
  position: relative; overflow: hidden;
  margin: 0 0 26px; padding: 46px 34px 40px;
  border-radius: 18px;
  border: 1px solid rgba(253, 164, 175, .55);
  background:
    radial-gradient(1100px 420px at 82% -10%, rgba(225, 29, 72, .16), transparent 58%),
    radial-gradient(760px 360px at 4% 118%, rgba(251, 113, 133, .12), transparent 55%),
    linear-gradient(158deg, #fff1f2 0%, #ffe4e6 55%, #fff7f8 100%);
}
.thm-moments.momo-scene .momo-hero-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.thm-moments.momo-scene .momo-scene-hero > *:not(.momo-hero-bg) { position: relative; z-index: 1; }

.thm-moments.momo-scene .momo-scene-kicker {
  display: inline-block; margin-bottom: 14px; padding: 5px 14px;
  border: 1px solid rgba(225, 29, 72, .35); border-radius: 999px;
  font-size: 12px; letter-spacing: 1px; color: var(--accent-strong);
  background: rgba(255, 255, 255, .6); backdrop-filter: blur(6px);
}
.thm-moments.momo-scene .momo-scene-title {
  margin: 0 0 12px; font-size: 40px; line-height: 1.18;
  font-family: var(--font-serif); letter-spacing: 2px; color: #881337;
}
.thm-moments.momo-scene .momo-scene-note { max-width: 640px; font-size: 14.5px; line-height: 2; color: #6d2831; }
.thm-moments.momo-scene .momo-scene-note b { color: var(--accent-strong); }

/* 徽章行 */
.thm-moments.momo-scene .momo-scene-feet {
  display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: 20px;
}
.thm-moments.momo-scene .momo-scene-feet span {
  padding: 5px 13px; border-radius: 999px;
  background: rgba(255, 255, 255, .6); border: 1px solid rgba(253, 164, 175, .55);
  font-size: 12.5px; color: #881337; backdrop-filter: blur(6px);
}

/* 飘落纸屑：小纸条 / 小方块，玫红与金色交替 */
.thm-moments.momo-scene .momo-confetti {
  position: absolute; top: -32px; display: block;
  opacity: .55; animation: momo-fall linear infinite;
}
.thm-moments.momo-scene .momo-confetti-1 { left: 8%; width: 10px; height: 14px; border-radius: 2px; background: linear-gradient(140deg, #fb7185, #e11d48); animation-duration: 7s; }
.thm-moments.momo-scene .momo-confetti-2 { left: 24%; width: 12px; height: 8px; border-radius: 1px; background: linear-gradient(140deg, #fbbf24, #f59e0b); animation-duration: 9s; animation-delay: 1.6s; }
.thm-moments.momo-scene .momo-confetti-3 { left: 56%; width: 8px; height: 11px; border-radius: 50%; background: linear-gradient(140deg, #fda4af, #f43f5e); animation-duration: 8s; animation-delay: 2.8s; }
.thm-moments.momo-scene .momo-confetti-4 { left: 78%; width: 11px; height: 9px; border-radius: 1px; background: linear-gradient(140deg, #fde68a, #fbbf24); animation-duration: 10s; animation-delay: .8s; }
.thm-moments.momo-scene .momo-confetti-5 { left: 92%; width: 9px; height: 12px; border-radius: 2px; background: linear-gradient(140deg, #fb7185, #be123c); animation-duration: 7.5s; animation-delay: 3.6s; }
@keyframes momo-fall {
  0% { transform: translateY(-40px) rotate(0deg); }
  100% { transform: translateY(360px) rotate(320deg); }
}

/* 纸飞机：在 hero 右上角轻轻滑翔 */
.thm-moments.momo-scene .momo-plane {
  position: absolute; right: 34px; top: 34px;
  font-size: 30px; opacity: .8; line-height: 1;
  animation: momo-plane 9s ease-in-out infinite;
}
@keyframes momo-plane {
  0%, 100% { transform: translateY(0) rotate(-14deg); }
  50% { transform: translateY(-12px) rotate(6deg); }
}

/* —— 静静模式说明条：玻璃化，融入场景 —— */
.thm-moments.momo-scene .momo-scene-quiet {
  background: linear-gradient(120deg, rgba(255, 255, 255, .7), rgba(255, 228, 230, .5));
  border-color: var(--accent-line);
  backdrop-filter: blur(6px);
  border-radius: 14px;
}

/* —— 发布框：玫红玻璃（结构不变） —— */
.thm-moments.momo-scene .momo-scene-post {
  border-radius: 16px;
}

/* —— 今日 · 一句话：金色日记纸暖调（语义色保留） —— */
.thm-moments.momo-scene .momo-scene-today {
  border-radius: 16px;
  background:
    radial-gradient(420px 140px at 90% -20%, rgba(251, 191, 36, .16), transparent 60%),
    linear-gradient(180deg, #fffdf5, #fdf6e3);
  border-color: #f0e3bd;
}

/* —— 中栏：日记本内页（横格纸） —— */
.thm-moments.momo-scene .momo-scene-paper {
  background:
    linear-gradient(rgba(225, 29, 72, .035) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, .97), rgba(255, 248, 250, .93));
  background-size: 100% 30px, 100% 100%;
  border-color: var(--accent-line);
  border-radius: 16px;
}
.thm-moments.momo-scene .momo-scene-panel-title { color: var(--accent-strong); }

/* —— 便签纸条：胶带斜贴 + 错落旋转 + hover 微浮起 —— */
.thm-moments.momo-scene .momo-scene-note {
  position: relative;
  margin: 0 0 18px; padding: 18px 18px 14px;
  background: #fffdf9;
  border: 1px solid #f3e6ce; border-radius: 4px;
  transition: transform .2s ease;
}
.thm-moments.momo-scene .momo-scene-note::before { display: none; } /* 收起竖线时间轴 */
.thm-moments.momo-scene .momo-scene-note .momo-dot { display: none; }
.thm-moments.momo-scene .momo-scene-note:nth-of-type(odd) { transform: rotate(-.8deg); }
.thm-moments.momo-scene .momo-scene-note:nth-of-type(even) { transform: rotate(1.1deg) translateX(6px); }
.thm-moments.momo-scene .momo-scene-note:hover {
  transform: rotate(0deg) translateY(-5px);
  z-index: 5;
}
.thm-moments.momo-scene .momo-scene-note .momo-item-foot { border-top-color: #efe0c0; }

/* 胶带：斜贴在便签上沿 */
.thm-moments.momo-scene .momo-scene-tape {
  position: absolute; top: -12px; left: 50%; z-index: 2;
  width: 92px; height: 24px; margin-left: -46px;
  background: rgba(251, 191, 36, .45);
  border-left: 1px dashed rgba(180, 130, 30, .5);
  border-right: 1px dashed rgba(180, 130, 30, .5);
  transform: rotate(-2deg);
}
.thm-moments.momo-scene .momo-scene-note:nth-of-type(even) .momo-scene-tape { transform: rotate(3deg); }
.thm-moments.momo-scene .momo-scene-note:nth-of-type(3n) .momo-scene-tape { transform: rotate(-4deg) translateX(10px); }

/* —— 右栏：玻璃面板融入场景 —— */
.thm-moments.momo-scene .momo-scene-panel {
  border: 1px solid var(--line);
  background: linear-gradient(170deg, rgba(255, 255, 255, .96), rgba(255, 241, 242, .8));
  border-color: var(--accent-line);
  border-radius: 16px;
}

/* —— 场景响应式 —— */
@media (max-width: 720px) {
  .thm-moments.momo-scene .momo-scene-hero { padding: 30px 20px 26px; }
  .thm-moments.momo-scene .momo-scene-title { font-size: 30px; }
  .thm-moments.momo-scene .momo-plane { right: 18px; top: 24px; font-size: 22px; }
  .thm-moments.momo-scene .momo-confetti-3,
  .thm-moments.momo-scene .momo-confetti-5 { display: none; }
}
@media (max-width: 620px) {
  .thm-moments.momo-scene .momo-scene-note { padding: 16px 14px 12px; }
  .thm-moments.momo-scene .momo-scene-tape { width: 74px; margin-left: -37px; }
}

/* —— 响应式 —— */
@media (max-width: 980px) {
  .momo-layout { grid-template-columns: 1fr; }
  .momo-right { position: static; order: 3; }
}
@media (max-width: 620px) {
  .momo-hero { padding: 22px 0 4px; }
  .momo-title { font-size: 27px; }
  .momo-paper { padding: 16px 16px 8px; }
  .momo-item { gap: 12px; }
  .momo-read { display: none; }
  .momo-today-quote { padding: 0; font-size: 15px; }
}

/* ============================================================
   圈子 · 晴空部落（差异化设计）
   部落广场（大卡封面优先）/ 部落营地（双栏：留言流 + 公约）
   圈味 chip / 部落热力 / 部落公约 / 新人谷（.tribe-* 前缀）
   ============================================================ */

/* 部落广场需要更宽的画布：双列大卡像两面旗并排展开 */
.layout-single:has(.tribe-plaza) { max-width: 1280px; }
.layout-single:has(.tribe-camp) { max-width: 1240px; }

/* —— 广场页头 —— */
.tribe-hero { padding: 8px 0 26px; animation: rise .5s ease both; }
.tribe-kicker {
  font-family: var(--mono);
  font-size: 11px; font-weight: 700;
  letter-spacing: 3px; color: var(--brand);
  text-transform: uppercase;
  display: block; margin-bottom: 10px;
}
.tribe-title { margin: 0 0 10px; font-family: var(--font-serif); font-size: 32px; letter-spacing: 1px; }
.tribe-note { margin: 0; color: var(--ink-soft); font-size: 14.5px; line-height: 1.9; max-width: 700px; }
.tribe-note b { color: var(--brand-strong); }

/* —— 部落大卡：旗帜（封面视觉优先） —— */
.tribe-plaza {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin: 6px 0 8px;
  animation: rise .5s ease both;
}
.tribe-card {
  display: flex; flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--r-lg);
  overflow: hidden;
  transition: transform .22s, border-color .22s;
}
.tribe-card:hover { transform: translateY(-5px); border-color: var(--brand-line); }

/* 旗帜：大色块封面 + 部落首字 + 圈味 chip + 热力旗标 */
.tribe-cover {
  position: relative;
  height: 150px;
  display: grid; place-items: center;
  text-decoration: none;
  overflow: hidden;
}
.tribe-cover::after {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(140px 100px at 82% 16%, rgba(255, 255, 255, .38), transparent 62%);
}
.tribe-cover-char {
  font-family: var(--font-serif);
  font-size: 62px; font-weight: 700; line-height: 1;
  color: rgba(255, 255, 255, .94);
}
.tribe-mood {
  display: inline-flex; align-items: center;
  font-size: 11.5px; font-weight: 700; letter-spacing: .5px;
  padding: 3px 11px; border-radius: var(--r-pill); white-space: nowrap;
}
.tribe-cover .tribe-mood {
  position: absolute; top: 12px; left: 12px; z-index: 2;
  background: rgba(255, 255, 255, .93); color: var(--brand-strong);
}
/* 圈味 chip 五色：热闹红橙 / 安静蓝灰 / 专业靛蓝 / 松弛青绿 / 脑洞紫 */
.tribe-mood-hot   { background: #fdecec; color: #d13438; border: 1px solid #f6c9cb; }
.tribe-mood-quiet { background: #eef1f6; color: #5b6b85; border: 1px solid #dde3ec; }
.tribe-mood-pro   { background: #e7efff; color: #2f5fe0; border: 1px solid #c9dcff; }
.tribe-mood-chill { background: #e7f6ec; color: #15803d; border: 1px solid #bce6c9; }
.tribe-mood-brain { background: #f1ecff; color: #6d28d9; border: 1px solid #dccdfa; }

/* 热力旗标：右上角的小旗子 */
.tribe-heat-flag {
  position: absolute; right: 12px; bottom: 12px; z-index: 2;
  font-family: var(--mono); font-size: 11.5px; font-weight: 700;
  padding: 3px 11px; border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .92); color: var(--ink);
}

.tribe-card-body { display: flex; flex-direction: column; gap: 9px; padding: 16px 18px 17px; flex: 1; }
.tribe-card-name { margin: 0; font-family: var(--font-serif); font-size: 19px; line-height: 1.45; display: flex; align-items: center; gap: 8px; }
.tribe-card-name a { color: var(--ink); text-decoration: none; }
.tribe-card-name a:hover { color: var(--brand-strong); }

/* 头图：有图用图，没图回退到旗帜渐变；有图时压一层由浅到深的遮罩，
   让圈味 chip 与热力旗标在照片上照样读得清 */
.tribe-cover.has-img, .tribe-camp-banner.has-img { background-size: cover; background-position: center; }
.tribe-cover.has-img::after { background: linear-gradient(180deg, rgba(15, 22, 38, .06), rgba(15, 22, 38, .38)); }
.tribe-camp-banner.has-img::after { background: linear-gradient(180deg, rgba(15, 22, 38, .02), rgba(15, 22, 38, .34)); }

/* 部落头像：有图用图，没图用部落首字徽章兜底 */
.tribe-name-avatar, .tribe-camp-avatar {
  display: inline-grid; place-items: center; flex: none;
  border-radius: 50%; overflow: hidden;
  background: var(--brand-soft); color: var(--brand-strong);
  font-family: var(--font-serif); font-weight: 700;
  object-fit: cover;
}
.tribe-name-avatar { width: 30px; height: 30px; font-size: 15px; }
.tribe-camp-avatar { width: 46px; height: 46px; font-size: 22px; border: 2px solid #fff; }
.tribe-name-avatar.is-char, .tribe-camp-avatar.is-char { border: 0; }
.tribe-card-intro {
  margin: 0; color: var(--muted); font-size: 13px; line-height: 1.75;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.tribe-card-foot {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin-top: auto; padding-top: 12px;
  border-top: 1px dashed var(--hairline);
}
.tribe-stat { font-size: 12.5px; color: var(--ink-soft); white-space: nowrap; }
.tribe-enter {
  margin-left: auto;
  font-size: 12.5px; font-weight: 700; color: var(--brand-strong);
  text-decoration: none;
}
.tribe-enter:hover { text-decoration: underline; }

/* —— 三种不一样（理念条） —— */
.tribe-tout {
  margin-top: 30px;
  border-top: 3px double var(--line);
  padding-top: 24px;
}
.tribe-tout h3 { margin: 0 0 14px; font-family: var(--font-serif); font-size: 18px; }
.tribe-tout-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.tribe-tout-item {
  background: linear-gradient(180deg, var(--surface), #fafbff);
  border: 1px solid var(--brand-line);
  border-radius: var(--radius);
  padding: 14px 16px;
}
.tribe-tout-item b { display: block; color: var(--brand-strong); font-size: 14px; margin-bottom: 4px; }
.tribe-tout-item span { display: block; color: var(--muted); font-size: 12.5px; line-height: 1.7; }

/* ================= 部落营地（详情页） ================= */

/* 营地旗帜横幅 */
.tribe-camp-head { margin-bottom: 22px; animation: rise .5s ease both; }
.tribe-camp-banner {
  position: relative;
  height: 128px;
  display: grid; place-items: center;
  border-radius: var(--r-lg) var(--r-lg) 0 0;
  overflow: hidden;
}
.tribe-camp-banner::after {
  content: "";
  position: absolute; inset: 0;
  background: radial-gradient(150px 110px at 82% 18%, rgba(255, 255, 255, .34), transparent 62%);
}
.tribe-banner-char {
  font-family: var(--font-serif);
  font-size: 54px; font-weight: 700; line-height: 1;
  color: rgba(255, 255, 255, .94);
}
.tribe-camp-titlebar {
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-top: 0;
  border-radius: 0 0 16px 16px;
  padding: 16px 22px 18px;
}
.tribe-camp-tags { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.tribe-camp-tag { font-size: 12px; color: var(--muted); }
.tribe-camp-name { margin: 0 0 6px; font-family: var(--font-serif); font-size: 28px; line-height: 1.4; display: flex; align-items: center; gap: 12px; }
.tribe-camp-intro { margin: 0; color: var(--ink-soft); font-size: 14px; line-height: 1.8; }

/* 营地双栏 */
.tribe-camp {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 26px;
  align-items: start;
}
.tribe-stream { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.tribe-stream-title {
  margin: 0; font-family: var(--font-serif); font-size: 18px;
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
}
.tribe-title-note { font-weight: 400; color: var(--muted); font-size: 12px; letter-spacing: 0; }

/* 发帖表单 */
.tribe-post-form {
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--r-md);
  padding: 14px 16px 15px;
  display: flex; flex-direction: column; gap: 10px;
}
.tribe-post-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.tribe-post-fields input {
  width: 100%; padding: 9px 12px;
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: var(--bg); font-size: 13.5px; color: var(--ink);
  font-family: var(--font);
}
.tribe-post-fields input:focus { outline: none; border-color: var(--brand); background: #fff; }

/* —— 圈子「晴空部落」专属主题色（暖橙/篝火系）· 仅 .thm-circles 作用域 ——
   把本模块主视觉强调色从全站蓝替换为暖橙；热度红、成员数等语义色保留 */
.thm-circles {
  --accent: #f97316;
  --accent-strong: #ea580c;
  --accent-soft: #ffedd5;
  --accent-line: #fed7aa;
}
/* hero：kicker 标签 / note 强调 b / 统计数字 */
.thm-circles .mod-kicker {
  color: var(--accent-strong);
  background: linear-gradient(120deg, var(--accent-soft), rgba(255, 237, 213, .5));
  border-color: var(--accent-line);
}
.thm-circles .mod-note b { color: var(--accent-strong); }
.thm-circles .mod-stat b { color: var(--accent-strong); }
/* 部落旗帜：封面圈味 chip 字色 / 旗帜首字阴影转暖 */
.thm-circles .tribe-cover .tribe-mood { color: var(--accent-strong); }
.thm-circles .tribe-cover-char,
.thm-circles .tribe-banner-char { }
/* 部落卡片：hover 描边 / 标题 hover / 进部落链接 */
.thm-circles .tribe-card:hover { border-color: var(--accent-line); }
.thm-circles .tribe-card-name a:hover { color: var(--accent-strong); }
.thm-circles .tribe-enter { color: var(--accent-strong); }
/* 理念条与面板：强调描边 / 标题竖条 / 卡片 hover / 标题 hover */
.thm-circles .tribe-tout-item { border-color: var(--accent-line); }
.thm-circles .tribe-tout-item b { color: var(--accent-strong); }
.thm-circles .mod-panel-title::before { background: var(--accent); }
.thm-circles .mod-card:hover { border-color: var(--accent-line); }
.thm-circles .mod-card-title a:hover { color: var(--accent-strong); }
/* 详情页：返回链接 hover / 发帖框聚焦光晕 / 身份提示与 hint b */
.thm-circles .mod-back a:hover {
  border-color: var(--accent-line);
  color: var(--accent-strong);
  background: var(--accent-soft);
}
.thm-circles .tribe-post-fields input:focus,
.thm-circles .tribe-post-form textarea:focus {
  border-color: var(--accent);
}
.thm-circles .tribe-post-who b,
.thm-circles .tribe-post-hint b { color: var(--accent-strong); }
/* 部落徽标：面板标题字色与竖条 / 留言头像 */
.thm-circles .tribe-panel-title { color: var(--accent); }
.thm-circles .tribe-panel-title::before { background: var(--accent); }
.thm-circles .tribe-post-avatar { background: var(--accent-soft); color: var(--accent-strong); }
/* 部落公约框：强调描边 / 底部分隔线 */
.thm-circles .tribe-rule-panel { border-color: var(--accent-line); }
.thm-circles .tribe-rule-foot { border-top-color: var(--accent-line); }
/* 新人谷：暖橙软底 */
.thm-circles .tribe-valley { background: linear-gradient(180deg, var(--accent-soft), var(--surface)); border-color: var(--accent-line); }

/* ============================================================
   圈子「晴空部落」· 部落广场场景升级（.thm-circles 作用域）
   篝火营地 hero（帐篷剪影 + 篝火光点）+ 营帐式部落卡片 + 营地守则条
   ============================================================ */

/* 部落广场需要更宽的画布：营帐双列大卡并排展开 */
.layout-single:has(.camp-grid) { max-width: 1280px; }

/* —— 场景 hero：暖橙渐变玻璃 + 帐篷 / 篝火剪影 —— */
.thm-circles .camp-hero {
  position: relative; overflow: hidden;
  margin: 0 0 26px; padding: 44px 34px 40px;
  border-radius: 18px;
  border: 1px solid rgba(253, 186, 116, .55);
  background:
    radial-gradient(1100px 420px at 82% -10%, rgba(249, 115, 22, .16), transparent 58%),
    radial-gradient(760px 360px at 4% 118%, rgba(234, 88, 12, .10), transparent 55%),
    linear-gradient(158deg, #fff7ed 0%, #ffedd5 55%, #fffaf5 100%);
}
.thm-circles .camp-hero-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.thm-circles .camp-silhouette { position: absolute; left: 0; right: 0; bottom: -4px; width: 100%; height: 168px; }
.thm-circles .camp-silhouette .camp-hill-1 { fill: rgba(249, 115, 22, .10); }
.thm-circles .camp-silhouette .camp-hill-2 { fill: rgba(234, 88, 12, .08); }
.thm-circles .camp-silhouette .camp-tents path { fill: rgba(154, 52, 18, .22); }
.thm-circles .camp-silhouette .camp-fire .fire-core { fill: #fb923c; opacity: .95; animation: camp-flicker 1.6s ease-in-out infinite; }
.thm-circles .camp-silhouette .camp-fire .fire-ember { fill: #fdba74; animation: camp-ember 2.2s ease-in-out infinite; }
.thm-circles .camp-silhouette .camp-fire .fire-ember.e2 { animation-delay: .45s; }
.thm-circles .camp-silhouette .camp-fire .fire-ember.e3 { animation-delay: .9s; }
.thm-circles .camp-silhouette .camp-fire .fire-ember.e4 { animation-delay: 1.3s; }
@keyframes camp-flicker { 0%, 100% { opacity: 1; } 50% { opacity: .5; } }
@keyframes camp-ember { 0%, 100% { opacity: .35; transform: translateY(2px); } 50% { opacity: 1; transform: translateY(-2px); } }
.thm-circles .camp-hero > *:not(.camp-hero-bg) { position: relative; z-index: 1; }
.thm-circles .camp-hero-note {
  position: absolute; right: 26px; bottom: 22px; z-index: 1;
  font-size: 11.5px; letter-spacing: 2px; color: rgba(154, 52, 18, .85);
  background: rgba(255, 247, 237, .78); border: 1px solid rgba(253, 186, 116, .7);
  border-radius: 999px; padding: 5px 14px; backdrop-filter: blur(6px);
  animation: camp-flicker 2.6s ease-in-out infinite;
}
.thm-circles .camp-kicker {
  display: inline-block; margin-bottom: 14px; padding: 5px 14px;
  border: 1px solid rgba(249, 115, 22, .35); border-radius: 999px;
  font-size: 12px; letter-spacing: 1px; color: var(--accent-strong);
  background: rgba(255, 255, 255, .6); backdrop-filter: blur(6px);
}
.thm-circles .camp-title {
  margin: 0 0 12px; font-size: 40px; line-height: 1.18;
  font-family: var(--font-serif); letter-spacing: 2px; color: #9a3412;
}
.thm-circles .camp-sub { margin: 0 0 20px; max-width: 640px; font-size: 14.5px; line-height: 2; color: #9a5a35; }
.thm-circles .camp-sub b { color: var(--accent-strong); }
.thm-circles .camp-feet { display: flex; flex-wrap: wrap; gap: 8px 14px; }
.thm-circles .camp-feet span {
  padding: 5px 13px; border-radius: 999px;
  background: rgba(255, 255, 255, .6); border: 1px solid rgba(253, 186, 116, .5);
  font-size: 12.5px; color: rgba(124, 45, 18, .85);
}

/* —— 营帐式部落卡片：帐篷顶檐 + 旗杆小旗 + 篝火 hover —— */
.thm-circles .camp-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  margin: 6px 0 8px;
  animation: rise .5s ease both;
}
.thm-circles .tribe-card {
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #fffaf3, var(--surface) 34%);
  border-color: var(--accent-line);
}
.thm-circles .tribe-card:hover {
  border-color: var(--accent);
}
/* 帐篷顶：三角檐压在封面顶部（透光帐篷布） */
.thm-circles .tribe-cover::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 42px; z-index: 2;
  background: linear-gradient(180deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, 0));
  clip-path: polygon(50% 0%, 100% 100%, 0 100%);
  pointer-events: none;
}
/* 旗杆 + 三角小旗（帐篷顶中央） */
.thm-circles .tribe-pole {
  position: absolute; top: 16px; left: 50%; z-index: 3;
  width: 3px; height: 30px; margin-left: -1.5px;
  border-radius: 2px; pointer-events: none;
  background: linear-gradient(180deg, #e7b47c, #9c6230);
}
.thm-circles .tribe-pole::before {
  content: ""; position: absolute; top: -14px; left: 2px;
  width: 22px; height: 13px;
  background: linear-gradient(135deg, var(--accent), #fdba74);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
/* 进部落：火焰胶囊按钮 */
.thm-circles .tribe-enter {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 6px 13px; border-radius: 999px;
  color: #fff; background: linear-gradient(135deg, var(--accent), #ea580c);
  transition: transform .18s;
}
.thm-circles .tribe-enter:hover { text-decoration: none; transform: translateY(-1px); }

/* —— 营地守则 / 新人谷：篝火营地玻璃条 —— */
.thm-circles .camp-tout {
  margin-top: 30px; padding: 22px 22px 24px;
  border-radius: 16px;
  border: 1px solid var(--accent-line);
  background:
    radial-gradient(600px 200px at 90% -30%, rgba(249, 115, 22, .10), transparent 60%),
    linear-gradient(180deg, rgba(255, 247, 237, .92), rgba(255, 255, 255, .78));
}
.thm-circles .camp-tout-title {
  margin: 0 0 16px;
  font-family: var(--font-serif); font-size: 20px; letter-spacing: 1px; color: #9a3412;
}
.thm-circles .camp-tout-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.thm-circles .camp-tout-item {
  background: rgba(255, 255, 255, .8);
  border: 1px solid var(--accent-line); border-radius: 12px;
  padding: 15px 16px;
}
.thm-circles .camp-tout-head {
  margin: 0 0 7px;
  font-family: var(--font-serif); font-size: 15px; color: var(--accent-strong);
}
.thm-circles .camp-tout-desc { margin: 0; color: var(--ink-soft); font-size: 12.5px; line-height: 1.75; }

/* —— 响应式：小屏收成单列 / 收起装饰 —— */
@media (max-width: 860px) {
  .thm-circles .camp-grid { grid-template-columns: 1fr; }
  .thm-circles .camp-tout-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .thm-circles .camp-hero { padding: 30px 20px 26px; }
  .thm-circles .camp-title { font-size: 30px; }
  .thm-circles .camp-hero-note { display: none; }
  .thm-circles .camp-silhouette { height: 120px; }
}
.tribe-post-form textarea {
  width: 100%; min-height: 96px; resize: vertical; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: var(--bg); font-size: 14px; line-height: 1.8; color: var(--ink);
  font-family: var(--font);
}
.tribe-post-form textarea:focus { outline: none; border-color: var(--brand); background: #fff; }
/* 营地留言的文本 / 链接输入框：此前这里只样式化了 textarea，标题框与商品 / 视频
   链接框会掉回浏览器默认外观（灰底 inset 边框），这里补齐，与 textarea 同款 */
.tribe-post-form input[type="text"], .tribe-post-form input[type="url"], .tribe-post-form input[type="search"],
.tribe-post-form input[type="email"], .tribe-post-form input[type="tel"], .tribe-post-form input[type="number"] {
  width: 100%; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: var(--bg); font-size: 14px; color: var(--ink);
  font-family: var(--font);
}
.tribe-post-form input[type="text"]:focus, .tribe-post-form input[type="url"]:focus,
.tribe-post-form input[type="search"]:focus, .tribe-post-form input[type="email"]:focus,
.tribe-post-form input[type="tel"]:focus, .tribe-post-form input[type="number"]:focus {
  outline: none; border-color: var(--brand); background: #fff;
}
.tribe-post-foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.tribe-post-hint { flex: 1; min-width: 200px; font-size: 12px; color: var(--muted); }
/* 蜜罐字段：给机器人看的，真人看不见 */
.tribe-honeypot { display: none !important; }

/* 留言流 */
.tribe-post {
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--r-md);
  padding: 15px 17px 16px;
}
.tribe-post-head { display: flex; align-items: center; gap: 9px; margin-bottom: 9px; }
.tribe-post-avatar {
  flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--brand-soft); color: var(--brand-strong);
  font-weight: 700; font-size: 13px;
}
.tribe-post-author { font-size: 13.5px; font-weight: 600; color: var(--ink); }
.tribe-post-time { margin-left: auto; font-size: 12px; color: var(--muted); font-family: var(--mono); }
.tribe-post-content { font-size: 14.5px; line-height: 1.85; color: var(--ink-soft); overflow-wrap: break-word; }
.tribe-post-content p { margin: 0 0 8px; }
.tribe-post-content p:last-child { margin-bottom: 0; }
.tribe-post-time:hover { color: var(--brand); }
/* 留言自带标题时单独起一行（留空则不显示，保持营地流的干净） */
.tribe-post-title { margin: 1px 0 0; font-family: var(--font-serif); font-size: 17px; line-height: 1.55; overflow-wrap: break-word; }
.tribe-post-title a { color: var(--ink); text-decoration: none; }
.tribe-post-title a:hover { color: var(--brand-strong); }

/* 营地流收起态：长文与超长留言只留一段摘要 + 「查看详情」，
   营地是用来逛的——五万字的连载平铺在这里，谁都得划到底 */
.tribe-post-folded {
  display: flex; flex-direction: column; gap: 7px;
  padding: 13px 15px; border-radius: var(--r-md);
  border: 1px dashed var(--brand-line);
  background: linear-gradient(160deg, rgba(255, 255, 255, .92), rgba(233, 241, 254, .5));
  transition: border-color .18s, background .18s;
}
.tribe-post-folded:hover { border-color: var(--brand); background: linear-gradient(160deg, #fff, var(--brand-soft)); }
.tribe-post-folded-tag { font-size: 11.5px; font-weight: 700; letter-spacing: .4px; color: var(--brand-strong); }
.tribe-post-folded-text { font-size: 14px; line-height: 1.85; color: var(--ink-soft); overflow-wrap: break-word; }
.tribe-post-folded-more { font-size: 12.5px; font-weight: 700; color: var(--brand); }

/* 右栏 */
.tribe-side { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 88px; }
.tribe-panel {
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--r-md);
  padding: 15px 17px 16px;
}
.tribe-panel-title {
  margin: 0 0 11px; font-size: 12px; font-weight: 700;
  letter-spacing: 2.5px; color: var(--brand); text-transform: uppercase;
  display: flex; align-items: center; gap: 8px;
}
.tribe-panel-title::before { content: ""; width: 16px; height: 2px; background: var(--brand); }

/* 部落公约：公开规则，保留换行，像刻在木牌上的家规 */
.tribe-rule-panel { border-color: var(--brand-line); background: linear-gradient(180deg, #fffdf5, var(--surface)); }
.tribe-rule {
  font-size: 13.5px; line-height: 1.95; color: var(--ink-soft);
  white-space: pre-line; overflow-wrap: break-word;
}
.tribe-rule-foot {
  margin: 12px 0 0; padding-top: 10px;
  border-top: 1px dashed var(--brand-line);
  font-size: 12px; color: var(--muted);
}

/* 圈内成员统计 */
.tribe-stats { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.tribe-stats li { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: var(--ink-soft); }
.tribe-stat-ico { width: 22px; text-align: center; }

/* 新人谷 */
.tribe-valley { background: linear-gradient(180deg, #f4f8ff, var(--surface)); border-color: var(--brand-line); }
.tribe-valley p { margin: 0 0 8px; font-size: 13px; line-height: 1.85; color: var(--ink-soft); }
.tribe-valley p:last-child { margin-bottom: 0; }
.tribe-valley-note { color: var(--muted) !important; font-size: 12.5px !important; }

/* 部落营地响应式 */
@media (max-width: 980px) {
  .tribe-camp { grid-template-columns: 1fr; }
  .tribe-side { position: static; }
}
@media (max-width: 720px) {
  .tribe-plaza { grid-template-columns: 1fr; }
  .tribe-tout-grid { grid-template-columns: 1fr; }
  .tribe-title { font-size: 26px; }
  .tribe-camp-name { font-size: 23px; }
  .tribe-post-fields { grid-template-columns: 1fr; }
}

/* 模块详情页返回主页面 */
.mod-back { margin: 6px 0 18px; }
.mod-back a {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  background: var(--surface);
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 600;
  transition: all .16s;
}
.mod-back a:hover { border-color: var(--brand-line); color: var(--brand-strong); background: var(--brand-soft); }

/* 模块主页 · 版本与更新日志 */
.mod-meta {
  margin: 34px 0 8px;
  padding: 20px 24px;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
}
.mod-meta-head {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  padding-bottom: 14px;
  border-bottom: 1px dashed var(--hairline);
}
.mod-meta-name { font-family: var(--font-serif); font-size: 16px; font-weight: 700; }
.mod-meta-author { color: var(--muted); font-size: 13px; }
.mod-meta-log { margin-left: auto; font-size: 13px; font-weight: 600; color: var(--brand-strong); }
.mod-meta-log:hover { text-decoration: underline; }
.mod-meta-list { margin-top: 12px; display: flex; flex-direction: column; gap: 10px; }
.mod-meta-item { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; font-size: 13.5px; color: var(--ink-soft); }
.mod-meta-item .mod-meta-ver { flex-shrink: 0; }
.mod-meta-item .mod-meta-ver .ver-tag { margin: 0; font-size: .85em; }
.mod-meta-item .mod-meta-date { flex-shrink: 0; color: var(--muted); font-size: 12.5px; }
.mod-meta-item .mod-meta-items { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.mod-meta-item .mod-meta-items em { color: var(--brand-line); font-style: normal; }

/* ============================================================
   晴空快报（资讯模块）
   ============================================================ */
.news-head { padding: 6px 0 4px; }
.news-head-rule {
  display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  font-size: 12px; letter-spacing: 2px; color: var(--muted);
  border-top: 2px solid var(--ink, #1f2937); border-bottom: 1px solid var(--line);
  padding: 5px 2px; margin-bottom: 18px; font-family: var(--font-serif);
}
.news-head-title { margin: 0 0 8px; font-family: var(--font-serif); font-size: 30px; letter-spacing: 2px; }
.news-head-sub { margin: 0 0 18px; color: var(--ink-soft); font-size: 14px; font-family: var(--font-serif); }

.news-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.news-tab {
  padding: 5px 14px; border-radius: var(--r-pill); font-size: 13px;
  border: 1px solid var(--line); color: var(--ink-soft); background: #fff;
}
.news-tab em { font-style: normal; font-size: 11px; color: var(--muted); margin-left: 4px; }
.news-tab.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.news-tab.on em { color: rgba(255,255,255,.8); }

.news-list { display: flex; flex-direction: column; gap: 14px; }
.news-card {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 18px 20px; transition: transform .18s;
}
.news-card:hover { transform: translateY(-2px); }
.news-card-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.news-cat {
  font-size: 11.5px; font-weight: 700; color: var(--brand-strong);
  background: var(--brand-soft); padding: 2px 10px; border-radius: var(--r-pill);
}
.news-badge { font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: var(--r-sm); }
.news-badge-new { background: #fdecec; color: var(--danger); }
.news-badge-hot { background: #fdf3e3; color: var(--warn); }
.news-time { font-size: 12px; color: var(--muted); margin-left: auto; }
.news-title { margin: 0 0 6px; font-size: 18px; line-height: 1.5; }
.news-title a { color: var(--ink); }
.news-title a:hover { color: var(--brand-strong); }
.news-summary { margin: 0 0 10px; color: var(--ink-soft); font-size: 13.5px; line-height: 1.85; }
.news-foot { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 12.5px; color: var(--muted); }
.news-source { color: var(--ink-soft); }
.news-more { margin-left: auto; color: var(--brand); }

.news-article { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 30px 34px; }
.news-article-kicker { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.news-article-title { margin: 0 0 12px; font-family: var(--font-serif); font-size: 28px; line-height: 1.5; }
.news-article-meta {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 12.5px; color: var(--muted);
  padding-bottom: 16px; margin-bottom: 20px; border-bottom: 1px solid var(--line);
}
.news-article-body { font-size: 15.5px; line-height: 2; color: var(--ink); }
.news-article-body p { margin: 0 0 1.2em; }
.news-article-end {
  text-align: center; color: var(--muted); font-size: 13px; letter-spacing: 2px;
  border-top: 1px dashed var(--line); margin-top: 26px; padding-top: 16px;
}

/* ============================================================
   晴空问路（问答模块）
   ============================================================ */
.qa-head { padding: 6px 0 4px; }
.qa-head-rule {
  display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  font-size: 12px; letter-spacing: 2px; color: var(--muted);
  border-top: 2px solid var(--ink, #1f2937); border-bottom: 1px solid var(--line);
  padding: 5px 2px; margin-bottom: 18px; font-family: var(--font-serif);
}
.qa-head-title { margin: 0 0 8px; font-family: var(--font-serif); font-size: 30px; letter-spacing: 2px; }
.qa-head-sub { margin: 0 0 18px; color: var(--ink-soft); font-size: 14px; font-family: var(--font-serif); }

.qa-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.qa-tab {
  padding: 5px 14px; border-radius: var(--r-pill); font-size: 13px;
  border: 1px solid var(--line); color: var(--ink-soft); background: #fff;
}
.qa-tab em { font-style: normal; font-size: 11px; color: var(--muted); margin-left: 4px; }
.qa-tab.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.qa-tab.on em { color: rgba(255,255,255,.8); }

.qa-list { display: flex; flex-direction: column; gap: 14px; }
.qa-card {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 18px 20px; transition: transform .18s;
}
.qa-card:hover { transform: translateY(-2px); }
.qa-card-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.qa-tag {
  font-size: 11.5px; font-weight: 700; color: var(--brand-strong);
  background: var(--brand-soft); padding: 2px 10px; border-radius: var(--r-pill);
}
.qa-badge { font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: var(--r-sm); }
.qa-badge-done { background: #e6f7ec; color: var(--ok); }
.qa-badge-open { background: #fdf3e3; color: var(--warn); }
.qa-time { font-size: 12px; color: var(--muted); margin-left: auto; }
.qa-title { margin: 0 0 6px; font-size: 17px; line-height: 1.5; }
.qa-title a { color: var(--ink); }
.qa-title a:hover { color: var(--brand-strong); }
.qa-summary { margin: 0 0 10px; color: var(--ink-soft); font-size: 13.5px; line-height: 1.85; }
.qa-foot { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 12.5px; color: var(--muted); }
.qa-author { color: var(--ink-soft); }
.qa-more { margin-left: auto; color: var(--brand); }

.qa-article { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 28px 32px; }
.qa-article-kicker { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.qa-article-title { margin: 0 0 12px; font-family: var(--font-serif); font-size: 26px; line-height: 1.5; }
.qa-article-meta {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 12.5px; color: var(--muted);
  padding-bottom: 16px; margin-bottom: 20px; border-bottom: 1px solid var(--line);
}
.qa-article-body { font-size: 15px; line-height: 2; color: var(--ink); }
.qa-article-body p { margin: 0 0 1.2em; }
.qa-answers { margin-top: 22px; }
.qa-answers-title { font-size: 16px; font-weight: 700; margin: 0 0 12px; }
.qa-answer {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 16px 20px; margin-bottom: 12px;
}
.qa-answer-accepted { border-color: #b8e6c8; background: #f3fbf5; }
.qa-answer-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.qa-answer-avatar {
  width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center;
  background: linear-gradient(140deg, #ffd9a8, #ffb36b); color: #7a4a10; font-size: 11.5px; font-weight: 700;
}
.qa-answer-name { font-weight: 700; font-size: 13.5px; }
.qa-answer-time { font-size: 12px; color: var(--muted); }
.qa-answer-content { font-size: 14.5px; line-height: 1.9; color: var(--ink); }
.qa-answer-content p { margin: 0 0 1em; }
.qa-accept-form { margin-top: 10px; }

/* ============================================================
   晴空帮手（服务模块）
   ============================================================ */
.svc-hero { padding: 6px 0 4px; }
.svc-hero-kicker { font-size: 12px; letter-spacing: 2px; color: var(--brand); font-weight: 700; }
.svc-hero-title { margin: 8px 0 10px; font-family: var(--font-serif); font-size: 30px; letter-spacing: 2px; }
.svc-hero-note { margin: 0 0 18px; color: var(--ink-soft); font-size: 14px; line-height: 1.9; max-width: 720px; }

.svc-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.svc-tab {
  padding: 5px 14px; border-radius: var(--r-pill); font-size: 13px;
  border: 1px solid var(--line); color: var(--ink-soft); background: #fff;
}
.svc-tab em { font-style: normal; font-size: 11px; color: var(--muted); margin-left: 4px; }
.svc-tab.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.svc-tab.on em { color: rgba(255,255,255,.8); }

.svc-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
.svc-card {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 18px 20px; display: flex; flex-direction: column; gap: 6px;
  transition: transform .18s;
}
.svc-card:hover { transform: translateY(-2px); }
.svc-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
.svc-cat {
  font-size: 11.5px; font-weight: 700; color: var(--brand-strong);
  background: var(--brand-soft); padding: 2px 10px; border-radius: var(--r-pill);
}
.svc-rating { color: #f5a623; font-size: 13px; font-weight: 700; }
.svc-rating em { font-style: normal; font-size: 11px; color: var(--muted); font-weight: 500; }
.svc-title { margin: 0; font-size: 17px; line-height: 1.5; }
.svc-title a { color: var(--ink); }
.svc-title a:hover { color: var(--brand-strong); }
.svc-price { font-size: 24px; font-weight: 800; color: var(--brand-strong); font-family: var(--mono); }
.svc-price .svc-unit { font-size: 13px; color: var(--muted); font-weight: 500; font-family: var(--font); }
.svc-summary { margin: 0; color: var(--ink-soft); font-size: 13px; line-height: 1.8; }
.svc-foot {
  margin-top: auto; display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  font-size: 12px; color: var(--muted); padding-top: 8px;
}
.svc-meta { white-space: nowrap; }
.svc-more { margin-left: auto; color: var(--brand); white-space: nowrap; }

/* ============================================================
   液态玻璃设计程序（Squircle + Liquid Glass）
   超椭圆轮廓：SVG 拉梅曲线近似（n≈5），G2 曲率连续、无拼接断点
   液态玻璃：backdrop 模糊 + 环境饱和 + 菲涅尔边缘高光 + 贴合阴影
   ============================================================ */

:root {
  /* 液态玻璃令牌 */
  --glass-blur: 18px;
  --glass-sat: 175%;
  --glass-high: rgba(255, 255, 255, .85);   /* 顶部菲涅尔高光 */
  --glass-line: rgba(255, 255, 255, .68);   /* 玻璃内缘线 */
  --glass-shadow: 0 14px 40px rgba(31, 60, 120, .11), 0 2px 10px rgba(31, 60, 120, .05);
}

/* 液态玻璃材质基类：通透渐变 + 背景模糊饱和 + 内缘线 + 菲涅尔高光 */
.glass {
  position: relative;
  background: linear-gradient(150deg, rgba(255, 255, 255, .78), rgba(255, 255, 255, .42) 48%, rgba(236, 244, 255, .55));
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
}
.glass::before {
  content: "";
  position: absolute; inset: 0;
  border-radius: inherit;
  background:
    radial-gradient(130% 55% at 50% 0%, rgba(255, 255, 255, .5), transparent 52%),
    linear-gradient(180deg, rgba(255, 255, 255, .3), transparent 26%),
    radial-gradient(130% 45% at 50% 100%, rgba(255, 255, 255, .2), transparent 60%);
  pointer-events: none;
}

/* ---- 顶部导航：通透液态玻璃（滚动内容在下方流动） ---- */
.site-header {
  background: rgba(255, 255, 255, .58);
  backdrop-filter: blur(26px) saturate(190%);
  -webkit-backdrop-filter: blur(26px) saturate(190%);
  border-bottom: 0;
}

/* ---- 通用按钮：玻璃高光（圆角与尺寸由 :root 的 --btn-* 统一管，不在这里重复写） ---- */
.btn {
  backdrop-filter: blur(12px) saturate(160%);
  -webkit-backdrop-filter: blur(12px) saturate(160%);
}
.btn-primary {
  background: linear-gradient(140deg, #4a8dff, var(--brand) 62%);
}
.btn-ghost { background: rgba(255, 255, 255, .66); }
.btn-ghost:hover { background: rgba(255, 255, 255, .92); }

/* ---- 日志页版本卡片：适合圆角 + 液态玻璃 ---- */
.ver-block {
  border: 0;
  border-radius: var(--r-lg);
  background: linear-gradient(150deg, rgba(255, 255, 255, .88), rgba(255, 255, 255, .5) 46%, rgba(238, 246, 255, .58));
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
}
.ver-block:hover {
  transform: translateY(-3px);
}

/* 元旦首版：红色液态玻璃 + 金线内缘 + 红金锦纹流光 */
.ver-newyear {
  border: 0;
  border-radius: var(--r-lg);
  background:
    radial-gradient(2.5px 2.5px at 8% 16%, #ffe08a, transparent 65%),
    radial-gradient(2px 2px at 18% 6%, #ffd98a, transparent 65%),
    radial-gradient(2.5px 2.5px at 30% 22%, #f2c14e, transparent 65%),
    radial-gradient(2px 2px at 86% 10%, #ffe08a, transparent 65%),
    radial-gradient(2.5px 2.5px at 94% 26%, #ffd98a, transparent 65%),
    radial-gradient(2px 2px at 72% 5%, #f2c14e, transparent 65%),
    radial-gradient(2.5px 2.5px at 46% 90%, #ffd98a, transparent 65%),
    radial-gradient(2px 2px at 60% 96%, #ffe08a, transparent 65%),
    linear-gradient(180deg, #a51c2c 0%, #c8102e 40%, #d43b34 72%, #e0493a 100%);
  color: #fff;
}
.ver-newyear:hover { }
/* 元旦锦纹：红金流光流动 */
.ver-newyear::before {
  background-size: 300% 100%;
  animation: glassFlow 6s linear infinite;
}

/* ---- 6月16日周年：仲夏成立十载、程序新生（金色液态玻璃） ---- */
.anniversary-badge {
  display: inline-block;
  font-family: var(--font-serif);
  font-size: 11px; font-weight: 700;
  color: #7a4f00;
  background: linear-gradient(135deg, #f6d48a, #e8a33d);
  padding: 3px 12px;
  border-radius: var(--r-pill);
  margin-left: 10px;
  vertical-align: 3px;
  letter-spacing: 2px;
}
.ver-anniversary {
  border: 0;
  border-radius: var(--r-lg);
  overflow: hidden;
  background:
    radial-gradient(2.5px 2.5px at 12% 18%, #f6d48a, transparent 62%),
    radial-gradient(2px 2px at 86% 12%, #e8a33d, transparent 62%),
    linear-gradient(150deg, rgba(255, 251, 240, .94), rgba(253, 243, 221, .6) 50%, rgba(250, 235, 210, .55));
  color: var(--ink);
}
.ver-anniversary::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 5px;
  background: linear-gradient(90deg, #d99b2b, #f6d48a, #e8a33d, #f6d48a);
  background-size: 300% 100%;
  animation: glassFlow 6s linear infinite;
}
.ver-anniversary h3 { color: var(--ink); border-bottom-color: rgba(217, 155, 43, .35); }
.ver-anniversary h3 .ver-tag { background: linear-gradient(135deg, #d99b2b, #e8a33d); color: #fff; }
.ver-anniversary p,
.ver-anniversary ul,
.ver-anniversary ol,
.ver-anniversary li { color: var(--ink-soft); }
.ver-anniversary strong,
.ver-anniversary.ver-block strong.hl,
.ver-anniversary.ver-block li strong.hl {
  color: #a96f10;
  background: rgba(217, 155, 43, .12);
  border-color: rgba(217, 155, 43, .3);
}
.ver-anniversary blockquote {
  background: linear-gradient(90deg, rgba(232, 163, 61, .14), transparent 72%);
  border-left-color: #e8a33d;
  color: var(--ink-soft);
}
.ver-anniversary .anniversary-badge { }

/* ---- SemVer 规则卡片：品牌蓝液态玻璃 ---- */
.doc-semver {
  background: linear-gradient(160deg, rgba(255, 255, 255, .94), rgba(233, 241, 254, .72));
  backdrop-filter: blur(16px) saturate(170%);
  -webkit-backdrop-filter: blur(16px) saturate(170%);
}

/* ---- 服务卡片等通用卡片：统一液态玻璃 ---- */
.svc-card {
  background: linear-gradient(150deg, rgba(255, 255, 255, .82), rgba(255, 255, 255, .5) 55%, rgba(238, 246, 255, .55));
  backdrop-filter: blur(16px) saturate(170%);
  -webkit-backdrop-filter: blur(16px) saturate(170%);
}

/* ---- 页脚：轻玻璃 ---- */
.site-footer {
  background: rgba(255, 255, 255, .52);
  backdrop-filter: blur(20px) saturate(170%);
  -webkit-backdrop-filter: blur(20px) saturate(170%);
  border-top: 1px solid rgba(255, 255, 255, .55);
}

/* 流光动画：锦纹/文字渐变横向流动 */
@keyframes glassFlow {
  0%   { background-position: 0% 0; }
  100% { background-position: 300% 0; }
}

/* ---- 目录树特殊版本：元旦红流光 / 周年金流光 / 里程碑蓝强调 ---- */
.doc-toc .toc-k-ny a,
.changelog-toc .toc-k-ny a {
  font-weight: 700;
  color: #c8102e;
  background: linear-gradient(90deg, #c8102e, #ff7a5c, #c8102e);
  background-size: 300% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: glassFlow 3.6s linear infinite;
}
.doc-toc .toc-k-ann a,
.changelog-toc .toc-k-ann a {
  font-weight: 700;
  color: #c8871a;
  background: linear-gradient(90deg, #c8871a, #f6c95e, #c8871a);
  background-size: 300% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: glassFlow 3.6s linear infinite;
}
.doc-toc .toc-k-major a,
.changelog-toc .toc-k-major a {
  font-weight: 700;
  color: var(--brand);
  background: linear-gradient(90deg, var(--brand), #7db4ff, var(--brand));
  background-size: 300% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: glassFlow 4.5s linear infinite;
}
/* 流光文字在 hover / active 时保持渐变（覆盖普通悬停变色的背景干扰） */
.doc-toc .toc-k-ny a:hover,
.doc-toc .toc-k-ann a:hover,
.doc-toc .toc-k-major a:hover { background-color: transparent; }
.doc-toc .toc-k-ny a.active { background-image: linear-gradient(90deg, #c8102e, #ff7a5c, #c8102e); }
.doc-toc .toc-k-ann a.active { background-image: linear-gradient(90deg, #c8871a, #f6c95e, #c8871a); }
.doc-toc .toc-k-major a.active { background-image: linear-gradient(90deg, var(--brand), #7db4ff, var(--brand)); }

/* ---- 关于页：品牌区 + 问题卡片（液态玻璃） ---- */
.about-hero {
  display: flex; align-items: center; gap: 22px;
  padding: 26px 28px;
  border-radius: var(--r-lg);
  background: linear-gradient(150deg, rgba(255, 255, 255, .88), rgba(236, 244, 255, .6));
  backdrop-filter: blur(18px) saturate(175%);
  -webkit-backdrop-filter: blur(18px) saturate(175%);
  margin: 0 0 30px;
}
.about-brand {
  flex-shrink: 0;
  width: 64px; height: 64px;
  border-radius: var(--r-lg);
  display: grid; place-items: center;
  background: linear-gradient(140deg, #5aa2ff, var(--brand));
  color: #fff;
  font-family: var(--font-serif);
  font-size: 30px; font-weight: 700;
}
.about-hero-text { min-width: 0; }
.about-lead {
  margin: 0 0 10px;
  font-size: 18px; font-weight: 700; color: var(--ink);
  line-height: 1.7;
}
.about-hero-text > p:last-child { margin: 0; }
.about-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 16px;
  margin: 4px 0 26px;
}
.about-item {
  border: 1px solid var(--line);
  padding: 20px 22px;
  border-radius: var(--r-lg);
  background: linear-gradient(150deg, rgba(255, 255, 255, .82), rgba(255, 255, 255, .5) 55%, rgba(238, 246, 255, .55));
  backdrop-filter: blur(16px) saturate(170%);
  -webkit-backdrop-filter: blur(16px) saturate(170%);
  transition: transform .18s;
}
.about-item:hover { transform: translateY(-2px); }
.about-item-tag {
  display: inline-block;
  font-family: var(--font-serif);
  font-size: 13px; font-weight: 700;
  color: var(--brand-strong);
  background: var(--brand-soft);
  border: 1px solid var(--brand-line);
  padding: 2px 12px;
  border-radius: var(--r-pill);
  margin-bottom: 10px;
  letter-spacing: 1px;
}
.about-item p { margin: 0; font-size: 14px; line-height: 1.9; }
@media (max-width: 620px) {
  .about-hero { flex-direction: column; align-items: flex-start; padding: 22px; }
  .about-grid { grid-template-columns: 1fr; }
}

/* ---- 前台右下角：发现新版本提醒（仅管理员登录可见） ---- */
.up-toast {
  position: fixed;
  right: 22px; bottom: 22px;
  z-index: 300;
  max-width: 340px;
  border-radius: var(--r-lg);
  padding: 14px 16px;
  background: linear-gradient(150deg, rgba(255, 255, 255, .94), rgba(236, 244, 255, .84));
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(255, 255, 255, .7);
  animation: rise .4s ease both;
}
.up-toast-inner { display: flex; align-items: flex-start; gap: 11px; }
.up-toast-dot {
  flex-shrink: 0; width: 9px; height: 9px; margin-top: 7px;
  border-radius: 50%;
  background: var(--brand);
}
.up-toast-body { min-width: 0; }
.up-toast-body strong { display: block; font-size: 14.5px; color: var(--ink); margin-bottom: 3px; }
.up-toast-body p {
  margin: 0; font-size: 12.5px; color: var(--ink-soft); line-height: 1.6;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.up-toast-acts { display: flex; align-items: center; gap: 10px; margin-left: auto; flex-shrink: 0; }
.up-toast-acts a { font-size: 13px; font-weight: 600; color: var(--brand-strong); white-space: nowrap; }
.up-toast-acts a:hover { text-decoration: underline; }
.up-toast-acts button { border: 0; background: none; cursor: pointer; color: var(--muted); font-size: 13px; padding: 2px 4px; line-height: 1; }
.up-toast-acts button:hover { color: var(--ink); }
@media (max-width: 620px) {
  .up-toast { left: 14px; right: 14px; bottom: 14px; max-width: none; }
}

/* ============================================================
   扁平化 · 通透液态玻璃（取消阴影、弱化磨砂、提升通透）
   ============================================================ */
/* 全站取消阴影（阴影交给细边线与通透底色表达层次） */
.ver-block, .doc-semver, .about-hero, .about-brand, .about-item, .svc-card,
.up-toast, .admin-up-toast, .cm-dialog, .glass, .brand-mark,
.site-header, .site-footer, .nav-dd-menu, .btn, .panel, .app-icon,
.login-card, .admin-side, .post-card, .mod-card {
  filter: none !important;
}
/* 磨砂感来源是大面积模糊——降到极轻，保留通透玻璃的「透」 */
.ver-block, .doc-semver, .about-hero, .about-item, .svc-card, .glass,
.up-toast, .admin-up-toast, .cm-dialog, .panel, .login-card {
  backdrop-filter: blur(5px) saturate(150%);
  -webkit-backdrop-filter: blur(5px) saturate(150%);
}
.site-header, .site-footer, .admin-side {
  backdrop-filter: blur(6px) saturate(160%);
  -webkit-backdrop-filter: blur(6px) saturate(160%);
}
/* 更透的底色：让背景透过来，而非蒙一层白纱 */
.ver-block, .glass {
  background: linear-gradient(150deg, rgba(255, 255, 255, .60), rgba(238, 246, 255, .32));
}
.site-header { background: rgba(255, 255, 255, .48); }
.site-footer { background: rgba(255, 255, 255, .44); }
.panel, .login-card { background: rgba(255, 255, 255, .62); }
.doc-semver { background: linear-gradient(160deg, rgba(255, 255, 255, .72), rgba(233, 241, 254, .5)); }
.about-item, .svc-card { background: rgba(255, 255, 255, .55); }
/* 下拉面板：浮在内容之上、又要读字，一律磨砂、不透内容。
   （「模块」大面板已改为居中弹窗 .nav-mega-card，磨砂参数就地定义。） */
.nav-dd-menu {
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(22px) saturate(185%);
  -webkit-backdrop-filter: blur(22px) saturate(185%);
}
.up-toast, .admin-up-toast { background: linear-gradient(150deg, rgba(255, 255, 255, .78), rgba(236, 244, 255, .6)); }
.cm-dialog { background: linear-gradient(150deg, rgba(255, 255, 255, .86), rgba(236, 244, 255, .68)); }
/* 细边线替代阴影，保持边界清晰（用可见的浅灰线，不用弱白线） */
.ver-block, .doc-semver, .about-hero, .about-item, .svc-card, .panel,
.up-toast, .admin-up-toast, .cm-dialog, .nav-dd-menu {
  border: 1px solid var(--line);
}
.site-header { border-bottom: 1px solid var(--line); }
.site-footer { border-top: 1px solid var(--line); }
/* hover 提升改为轻微位移 + 边线变品牌色（无阴影） */
.ver-block:hover, .about-item:hover, .svc-card:hover {
  transform: translateY(-2px);
  border-color: var(--brand-line);
}
.btn-primary {
  background: linear-gradient(140deg, #4a8dff, var(--brand) 62%);
}
.btn-ghost { background: rgba(255, 255, 255, .55); }



/* 圆角大中小规范（全站统一） */
:root {
  --r-lg: 18px;
  --r-md: 14px;
  --r-sm: 10px;
  --r-pill: 999px;
}


/* 版本号标签大小统一规范（全站：任何页面、任何位置一律相同） */
.ver-tag { font-size: 12px !important; padding: 2px 10px !important; line-height: 1.7 !important; vertical-align: 2px !important; letter-spacing: .3px !important; }
.ver-badge { font-size: 10px !important; padding: 2px 9px !important; letter-spacing: 1px !important; line-height: 1.6 !important; }


/* 跨版本升级说明（如 v0.2.x → v0.3.x） */
.ver-cross { display: block; margin: 8px 0 16px; padding: 10px 14px 10px 16px; border-radius: var(--r-sm); background: linear-gradient(90deg, var(--brand-soft), rgba(233,241,254,.35)); border-left: 3px solid var(--brand); font-size: 13px; color: var(--ink-soft); line-height: 1.8; }
.ver-cross strong { color: var(--brand-strong); }


/* ===== 元旦 / 周年主题样式补回（位于扁平化通用覆盖之后，确保不被冲掉） ===== */
.ver-block.ver-newyear {
  border: 0 !important;
  background:
    radial-gradient(2.5px 2.5px at 8% 16%, #ffe08a, transparent 65%),
    radial-gradient(2px 2px at 18% 6%, #ffd98a, transparent 65%),
    radial-gradient(2.5px 2.5px at 30% 22%, #f2c14e, transparent 65%),
    radial-gradient(2px 2px at 86% 10%, #ffe08a, transparent 65%),
    radial-gradient(2.5px 2.5px at 94% 26%, #ffd98a, transparent 65%),
    radial-gradient(2px 2px at 72% 5%, #f2c14e, transparent 65%),
    radial-gradient(2.5px 2.5px at 46% 90%, #ffd98a, transparent 65%),
    radial-gradient(2px 2px at 60% 96%, #ffe08a, transparent 65%),
    linear-gradient(180deg, #a51c2c 0%, #c8102e 40%, #d43b34 72%, #e0493a 100%) !important;
  color: #fff !important;
}
.ver-block.ver-newyear:hover {
}
.ver-block.ver-anniversary {
  border: 0 !important;
  background:
    radial-gradient(2.5px 2.5px at 12% 18%, #f6d48a, transparent 62%),
    radial-gradient(2px 2px at 86% 12%, #e8a33d, transparent 62%),
    linear-gradient(150deg, rgba(255, 251, 240, .94), rgba(253, 243, 221, .6) 50%, rgba(250, 235, 210, .55)) !important;
}
.ver-block.ver-anniversary:hover {
}
.ver-block.ver-newyear .newyear-badge { }
.ver-block.ver-anniversary .anniversary-badge { }

/* ============================================================
   模块现代布局 · 统一组件（论坛/文库/电商/招聘/圈子/动态/资讯/问答/服务/影集）
   设计语言：透明玻璃卡片 / 大栅格留白 / 胶囊徽标 / 无阴影扁平通透
   与全站液态玻璃、清新蓝、圆角规范一脉相承
   ============================================================ */

/* —— 模块页头 —— */
.mod-hero { padding: 10px 0 30px; max-width: 880px; }
.mod-kicker {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 700; letter-spacing: 2px;
  color: var(--brand-strong);
  background: linear-gradient(120deg, var(--brand-soft), rgba(233, 241, 254, .5));
  border: 1px solid var(--brand-line);
  padding: 5px 14px; border-radius: var(--r-pill);
}
.mod-title { margin: 18px 0 12px; font-family: var(--font-serif); font-size: 36px; line-height: 1.25; color: var(--ink); letter-spacing: 1px; }
.mod-note { margin: 0; max-width: 660px; color: var(--ink-soft); font-size: 15px; line-height: 1.9; }
.mod-note b { color: var(--brand-strong); }
.mod-stats { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.mod-stat {
  display: inline-flex; align-items: baseline; gap: 7px;
  background: linear-gradient(160deg, rgba(255, 255, 255, .9), rgba(238, 246, 255, .65));
  border: 1px solid var(--line); border-radius: var(--r-pill);
  padding: 7px 16px; font-size: 13px; color: var(--ink-soft);
}
.mod-stat b { font-size: 17px; color: var(--brand-strong); font-family: var(--mono); }

/* —— 筛选标签条 —— */
.mod-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 26px; }
.mod-tab {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 18px; border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .72); border: 1px solid var(--line);
  color: var(--ink-soft); font-size: 13.5px; font-weight: 500;
  transition: all .18s;
}
.mod-tab:hover { border-color: var(--brand-line); color: var(--brand-strong); }
.mod-tab.active { background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 600; }
.mod-tab em { font-style: normal; font-size: 11.5px; opacity: .75; }

/* —— 现代卡片栅格 —— */
.mod-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; margin-bottom: 34px; }
.mod-grid.narrow { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }

/* 折叠隐喻之一：影集「跨缝双联画」
   把照片摊成一本打开的书——左右各一页，中间留出折痕缝；
   只在够宽（展开态）时成立，窄屏自动回到普通网格，不影响单图浏览。 */
.mod-grid.fold-spread { position: relative; }
@media (min-width: 861px) {
  .mod-grid.fold-spread { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 46px; row-gap: 20px; }
  .mod-grid.fold-spread::before {
    content: "";
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 50%;
    width: 24px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, transparent, rgba(28, 37, 54, .1), transparent);
    pointer-events: none;
  }
}
.mod-card {
  display: flex; flex-direction: column;
  background: linear-gradient(160deg, rgba(255, 255, 255, .92), rgba(238, 246, 255, .62));
  border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 22px 22px 18px;
  transition: transform .2s, border-color .2s;
}
.mod-card:hover { transform: translateY(-3px); border-color: var(--brand-line); }
.mod-card-top { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.mod-chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11.5px; font-weight: 600; line-height: 1;
  padding: 4px 10px; border-radius: var(--r-pill);
  background: var(--brand-soft); color: var(--brand-strong);
}
.mod-chip.alt { background: #eef1f6; color: #6b7688; }
.mod-chip.ok { background: #eafaf1; color: #17914c; }
.mod-chip.warn { background: #fdf3e3; color: #b57a12; }
.mod-chip.hot { background: #fdeaea; color: #d13438; }
.mod-chip.time { background: #eef4ff; color: #3a6df0; }
.mod-card-title { margin: 0 0 8px; font-size: 17px; font-weight: 700; line-height: 1.5; }
.mod-card-title a { color: var(--ink); }
.mod-card-title a:hover { color: var(--brand-strong); }
.mod-card-desc {
  margin: 0 0 16px; flex: 1;
  color: var(--ink-soft); font-size: 14px; line-height: 1.85;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.mod-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 4px; }
.mod-meta { display: flex; flex-wrap: wrap; gap: 5px 14px; color: var(--muted); font-size: 12.5px; }
.mod-meta span { display: inline-flex; align-items: center; gap: 4px; }
.mod-more { font-size: 13px; font-weight: 600; color: var(--brand-strong); white-space: nowrap; }
.mod-more:hover { text-decoration: underline; }
.mod-price { font-family: var(--mono); font-size: 18px; font-weight: 700; color: var(--brand-strong); }

/* —— 详情页骨架 —— */
.mod-back { margin: 6px 0 22px; }
.mod-detail-head { padding: 6px 0 22px; }
.mod-detail-title { margin: 14px 0 12px; font-family: var(--font-serif); font-size: 30px; line-height: 1.35; }
.mod-detail-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; color: var(--muted); font-size: 13px; }
.mod-panel {
  background: linear-gradient(160deg, rgba(255, 255, 255, .92), rgba(238, 246, 255, .62));
  border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 24px 26px; margin: 0 0 22px;
}
.mod-panel-title {
  display: flex; align-items: center; gap: 10px;
  margin: 0 0 16px; font-size: 15px; font-weight: 700; color: var(--ink);
}
.mod-panel-title::before { content: ""; width: 4px; height: 16px; border-radius: 2px; background: var(--brand); }
.mod-trust {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
  background: linear-gradient(90deg, var(--brand-soft), rgba(233, 241, 254, .4));
  border: 1px solid var(--brand-line); border-radius: var(--r-md);
  padding: 12px 18px; margin: 0 0 22px; font-size: 13.5px; color: var(--ink-soft);
}
.mod-trust b { color: var(--brand-strong); }

/* —— 列表行 / 信息行（详情页常用） —— */
.mod-list { display: flex; flex-direction: column; }
.mod-row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 13px 2px; border-bottom: 1px solid var(--hairline);
}
.mod-row:last-child { border-bottom: 0; }
.mod-row-label { font-size: 13px; color: var(--muted); flex-shrink: 0; }
.mod-row-val { font-size: 14px; color: var(--ink); text-align: right; font-weight: 500; }
.mod-row-val b { color: var(--brand-strong); }

/* —— 空态 —— */
.mod-empty { text-align: center; padding: 56px 20px; color: var(--muted); }
.mod-empty h3 { margin: 0 0 6px; font-size: 17px; color: var(--ink-soft); }
.mod-empty p { margin: 0; font-size: 14px; }

/* —— 多栏容器（列表/详情） —— */
.mod-cols { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 22px; align-items: start; margin-bottom: 34px; }
.mod-cols.side-left { grid-template-columns: 240px minmax(0, 1fr); }
.mod-cols.side-both { grid-template-columns: 200px minmax(0, 1fr) 250px; }
.mod-cols > .mod-sticky { position: sticky; top: 88px; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.mod-cols .mod-main { min-width: 0; }
.layout-single:has(.mod-cols.side-both) { max-width: 1280px; }
@media (max-width: 980px) {
  .mod-cols, .mod-cols.side-left, .mod-cols.side-both { grid-template-columns: 1fr; }
  .mod-cols > .mod-sticky { position: static; }
  .mod-title { font-size: 30px; }
  .mod-detail-title { font-size: 25px; }
}

/* —— 论坛「共鸣板」专属：页头统计 + 前台发帖 —— */
.echo-stats { display: flex; gap: 10px; margin-top: 18px; flex-wrap: wrap; }
.echo-stat {
  display: flex; flex-direction: column; align-items: center; min-width: 92px;
  background: linear-gradient(160deg, rgba(255, 255, 255, .92), rgba(238, 246, 255, .66));
  border: 1px solid var(--line); border-radius: var(--r-pill);
  padding: 8px 18px;
}
.echo-stat b { font-size: 18px; color: var(--brand-strong); font-family: var(--mono); line-height: 1.3; }
.echo-stat span { font-size: 12px; color: var(--muted); }
.echo-post {
  background: linear-gradient(160deg, rgba(255, 255, 255, .95), rgba(236, 244, 255, .72));
  border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 20px 22px; margin: 0 0 26px;
}
.echo-post-title { margin: 0 0 14px; font-size: 15px; font-weight: 700; color: var(--ink); }
/* 发帖区：左侧定「发到哪儿、发什么」，右侧专心写正文，别拉成一条长竖条 */
.echo-post-grid { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 22px; align-items: start; }
.echo-post-side { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.echo-post-side .echo-post-who { margin: 0 0 2px; }
.echo-post-label { font-size: 12px; font-weight: 600; letter-spacing: .04em; color: var(--muted); }
/* 类型标签在侧栏改排成两列方格，省一截高度 */
.echo-post-side .pt-type-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; }
.echo-post-side .pt-type-tab span { width: 100%; justify-content: center; }
.echo-post-main { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.echo-post select,
.echo-post input[type="text"], .echo-post input[type="url"], .echo-post input[type="search"],
.echo-post input[type="email"], .echo-post input[type="tel"], .echo-post input[type="number"],
.echo-post textarea {
  width: 100%; border: 1px solid var(--line); border-radius: var(--r-sm);
  padding: 10px 14px; font-size: 14px; background: rgba(255, 255, 255, .88); color: var(--ink);
}
.echo-post textarea { resize: vertical; min-height: 88px; line-height: 1.7; }
.echo-post select:focus,
.echo-post input[type="text"]:focus, .echo-post input[type="url"]:focus, .echo-post input[type="search"]:focus,
.echo-post input[type="email"]:focus, .echo-post input[type="tel"]:focus, .echo-post input[type="number"]:focus,
.echo-post textarea:focus { outline: none; border-color: var(--brand-line); }
.echo-post-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.echo-post-hint { font-size: 12.5px; color: var(--muted); }
.echo-post-err {
  background: #fdeaea; color: #c0392b; border: 1px solid #f5c6c6; border-radius: var(--r-sm);
  padding: 8px 12px; margin-bottom: 10px; font-size: 13px;
}
.echo-post-who { margin: 0 0 10px; font-size: 13px; color: var(--ink-soft); }
.echo-post-who b { color: var(--brand-strong); }
.echo-post-login {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  background: var(--brand-soft); border: 1px dashed var(--brand-line); border-radius: var(--r-md);
  padding: 14px 16px; font-size: 13.5px; color: var(--ink-soft);
}
/* 窄屏：侧栏回到正文上方，类型标签也回到横向铺开 */
@media (max-width: 900px) {
  .echo-post-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .echo-post-side .pt-type-tabs { display: flex; flex-wrap: wrap; }
}

/* —— 模块前台发布框（问答/动态等登录后发布） —— */
.qa-post, .momo-post {
  background: linear-gradient(160deg, rgba(255, 255, 255, .95), rgba(236, 244, 255, .72));
  border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 20px 22px; margin: 0 0 24px;
}
.qa-post-title, .momo-post-label { margin: 0 0 12px; font-size: 15px; font-weight: 700; color: var(--ink); }
.qa-post form, .momo-post form { display: flex; flex-direction: column; gap: 10px; }
.qa-post-row { display: flex; gap: 10px; }
.qa-post select, .qa-post input[type="text"], .qa-post textarea,
.momo-post textarea {
  width: 100%; border: 1px solid var(--line); border-radius: var(--r-sm);
  padding: 10px 14px; font-size: 14px; background: rgba(255, 255, 255, .88); color: var(--ink);
}
.qa-post textarea, .momo-post textarea { resize: vertical; min-height: 88px; line-height: 1.7; }
.qa-post-foot, .momo-post-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.qa-post-hint, .momo-post-hint { font-size: 12.5px; color: var(--muted); }
.qa-post-hint b, .momo-post-hint b, .qa-answer-form-who b { color: var(--brand-strong); }
.qa-post-err, .momo-post-err {
  background: #fdeaea; color: #c0392b; border: 1px solid #f5c6c6; border-radius: var(--r-sm);
  padding: 8px 12px; margin-bottom: 12px; font-size: 13px;
}
.qa-post-login, .momo-post-login {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  background: var(--brand-soft); border: 1px dashed var(--brand-line); border-radius: var(--r-md);
  padding: 14px 16px; font-size: 13.5px; color: var(--ink-soft);
}
.qa-answer-form-who { font-size: 13px; color: var(--ink-soft); margin-bottom: 2px; }

/* —— 问答·晴空问路 专属主题色（天青/青空系） ——
   仅作用于 qa_index / qa_detail 模板内的 .thm-qa scoped 容器，
   把模块主视觉强调色从全站蓝替换为天青系；语义色（采纳绿/热度红/错误红）保留不动。 */
.thm-qa {
  --accent: #0ea5e9;
  --accent-strong: #0284c7;
  --accent-soft: #e0f2fe;
  --accent-line: #bae6fd;
}
/* 方向胶囊选中态 */
.thm-qa .qa-tab.on { background: var(--accent); border-color: var(--accent); }
/* help_tag 方向标签 */
.thm-qa .qa-tag { color: var(--accent-strong); background: var(--accent-soft); }
/* 列表标题链接 hover */
.thm-qa .qa-title a:hover { color: var(--accent-strong); }
/* 去回答 → */
.thm-qa .qa-more { color: var(--accent); }
/* qa-post 提问框提示 / hint b / 回答者身份 */
.thm-qa .qa-post-hint b, .thm-qa .qa-answer-form-who b { color: var(--accent-strong); }
/* qa-post 提问框聚焦（含详情页回答框 textarea） */
.thm-qa .qa-post select:focus, .thm-qa .qa-post input[type="text"]:focus, .thm-qa .qa-post textarea:focus,
.thm-qa .qa-answer-form textarea:focus {
  outline: none; border-color: var(--accent-line);
}
/* qa-post 未登录提示条 */
.thm-qa .qa-post-login { background: var(--accent-soft); border-color: var(--accent-line); }
@media (max-width: 620px) { .qa-post-row { flex-direction: column; } }

/* ============================================================
   问答「晴空问路」· 岔路口/路牌 沉浸式场景（.thm-qa 作用域追加）
   天青主题色：--accent #0ea5e9；语义色（采纳绿 var(--ok)/求助黄 var(--warn)）保留不动
   结构：岔路口 hero + 方向路牌胶囊 + 路标卡（qa_index 首页专用）
   ============================================================ */

/* —— 场景 hero：天青渐变玻璃 + 岔路 SVG 背景 —— */
.thm-qa .qa-hero {
  position: relative; overflow: hidden;
  margin: 0 0 26px; padding: 22px 30px 20px;
  border-radius: 18px;
  border: 1px solid rgba(14, 165, 233, .45);
  background:
    radial-gradient(1100px 430px at 84% -12%, rgba(14, 165, 233, .18), transparent 58%),
    radial-gradient(780px 380px at 2% 118%, rgba(2, 132, 199, .12), transparent 55%),
    linear-gradient(158deg, #f0f9ff 0%, #e0f2fe 52%, #f8fcff 100%);
}
.thm-qa .qa-hero-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.thm-qa .qa-hero > *:not(.qa-hero-bg):not(.qa-hero-sign) { position: relative; z-index: 1; }
.thm-qa .qa-fork-bg { position: absolute; left: 0; right: 0; bottom: -8px; width: 100%; height: 150px; opacity: .85; }
.thm-qa .qa-fork-bg .rd { fill: none; stroke-linecap: round; }
.thm-qa .qa-fork-bg .rd-main { stroke: rgba(2, 132, 199, .4); stroke-width: 7; }
.thm-qa .qa-fork-bg .rd-left1, .thm-qa .qa-fork-bg .rd-right1 { stroke: rgba(14, 165, 233, .6); stroke-width: 5; stroke-dasharray: 10 7; }
.thm-qa .qa-fork-bg .rd-left2, .thm-qa .qa-fork-bg .rd-right2 { stroke: rgba(14, 165, 233, .3); stroke-width: 3; stroke-dasharray: 4 8; }
.thm-qa .qa-fork-bg .qa-fork-post { fill: rgba(2, 132, 199, .5); }
.thm-qa .qa-fork-bg .qa-fork-cap { fill: #fff; stroke: rgba(2, 132, 199, .65); stroke-width: 3; }
/* 右上角「前方分岔」木牌 */
.thm-qa .qa-hero-sign {
  position: absolute; right: 28px; top: 30px; z-index: 1;
  width: 124px; height: 76px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  background: linear-gradient(180deg, #0b6fae, #0284c7);
  border: 2px solid rgba(255, 255, 255, .88);
  border-radius: 8px 8px 5px 5px;
  color: #fff; font-weight: 700; letter-spacing: 1px;
  transform: rotate(2deg);
}
.thm-qa .qa-hero-sign::before {
  content: ""; position: absolute; left: 50%; bottom: -46px; transform: translateX(-50%);
  width: 6px; height: 46px; border-radius: 3px; background: rgba(2, 132, 199, .5);
}
.thm-qa .qa-hero-sign .sig-cn { font-size: 15px; }
.thm-qa .qa-hero-sign .sig-en { font-size: 8px; letter-spacing: 2px; opacity: .85; }
/* hero 内容 */
.thm-qa .qa-hero-label {
  display: flex; align-items: center; gap: 10px;
  margin: 0 0 14px; font-size: 12px; letter-spacing: 1px; color: var(--accent-strong);
}
.thm-qa .qa-hero-label span {
  padding: 2px 9px; border-radius: 4px; background: #0284c7;
  color: #fff; font-family: var(--mono); font-size: 10px; font-weight: 600; letter-spacing: 2.5px;
}
.thm-qa .qa-hero-label::after {
  content: ""; flex: 0 0 72px; height: 1px;
  background: linear-gradient(90deg, rgba(2, 132, 199, .4), transparent);
}
.thm-qa .qa-hero-title {
  margin: 0 0 14px; font-size: 30px; line-height: 1.2;
  font-family: var(--font-serif); font-weight: 800; letter-spacing: 1px;
  color: #0c4a6e;
}
/* 岔路口四块路牌：横排一行，各带方向箭头 */
.thm-qa .qa-hero-signs {
  display: flex; flex-wrap: wrap; gap: 8px;
  max-width: 640px; margin: 0; padding: 0; list-style: none;
}
.thm-qa .qa-hero-signs li {
  display: inline-flex; align-items: center; gap: 8px;
  max-width: 100%;
  padding: 6px 13px; border-radius: 6px;
  background: rgba(255, 255, 255, .66);
  border: 1px solid rgba(14, 165, 233, .35);
  font-size: 12.5px;
}
.thm-qa .qs-arrow { font-size: 14px; line-height: 1; color: var(--accent-strong); }
.thm-qa .qa-hero-signs b { color: #0c4a6e; font-weight: 700; }
.thm-qa .qa-hero-signs em { font-style: normal; color: #155e75; opacity: .82; }
.thm-qa .qa-hero-feet { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 0; }
.thm-qa .qa-hero-feet span {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12.5px; color: var(--accent-strong);
}
.thm-qa .qa-hero-feet span + span { margin-left: 16px; padding-left: 16px; border-left: 1px solid rgba(14, 165, 233, .3); }
.thm-qa .qa-hero-note {
  position: absolute; right: 26px; bottom: 20px; z-index: 1;
  font-size: 11.5px; letter-spacing: 2px; color: var(--accent-strong);
  background: rgba(255, 255, 255, .7); border: 1px solid rgba(14, 165, 233, .45);
  border-radius: 999px; padding: 5px 14px; backdrop-filter: blur(6px);
  animation: qa-fork-pulse 2.8s ease-in-out infinite;
}
@keyframes qa-fork-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .55; } }

/* —— 方向路牌：经验 / 方法 / 数据 / 推荐（保留链接与选中态） —— */
.thm-qa .qa-tabs { gap: 10px; margin-bottom: 22px; }
.thm-qa .qa-tab {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 16px 7px 13px;
  border: 2px solid rgba(14, 165, 233, .38);
  border-radius: 10px 16px 10px 16px;
  background: rgba(255, 255, 255, .85);
  color: var(--accent-strong); font-weight: 700;
  backdrop-filter: blur(6px);
  transition: transform .15s, border-color .15s;
}
.thm-qa .qa-tab:hover {
  border-color: var(--accent);
  transform: translateY(-2px);
}
.thm-qa .qa-tab.on {
  background: linear-gradient(140deg, var(--accent), var(--accent-strong));
  border-color: var(--accent-strong);
  color: #fff;
}
.thm-qa .qa-tab-arrow { font-size: 12px; line-height: 1; color: var(--accent); }
.thm-qa .qa-tab.on .qa-tab-arrow { color: #fff; }
.thm-qa .qa-tab.on em { color: rgba(255, 255, 255, .85); }

/* —— 路标卡：每条问题一块路牌（左侧方向色条 + 圆点路标） —— */
.thm-qa .qa-list { gap: 16px; }
.thm-qa .qa-card {
  position: relative; overflow: hidden;
  padding: 18px 22px 18px 26px;
  border: 1px solid rgba(14, 165, 233, .22);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .97), rgba(240, 249, 255, .92));
}
.thm-qa .qa-card:hover {
  transform: translateY(-2px);
  border-color: var(--accent-line);
}
/* 四个方向各自的路线色（路牌语义，小面积功能色，主强调仍为天青） */
.thm-qa .qa-card[data-dir="经验"] { --dir: #0ea5e9; }
.thm-qa .qa-card[data-dir="方法"] { --dir: #2563eb; }
.thm-qa .qa-card[data-dir="数据"] { --dir: #0d9488; }
.thm-qa .qa-card[data-dir="推荐"] { --dir: #d97706; }
.thm-qa .qa-card::before {
  content: ""; position: absolute; left: 0; top: 14px; bottom: 14px;
  width: 5px; border-radius: 0 5px 5px 0;
  background: var(--dir, var(--accent));
}
.thm-qa .qa-card::after {
  content: ""; position: absolute; left: 8px; top: 9px;
  width: 13px; height: 13px; border-radius: 50%;
  background: var(--dir, var(--accent));
  border: 2px solid #fff;
}
/* 路标大字标题 + 方向箭头标签 */
.thm-qa .qa-title {
  margin: 0 0 6px; font-size: 18px; line-height: 1.5;
  font-family: var(--font-serif); font-weight: 700; letter-spacing: .3px;
}
.thm-qa .qa-title a { color: #0c4a6e; }
.thm-qa .qa-tag {
  display: inline-flex; align-items: center; gap: 4px;
  border: 1px solid var(--accent-line);
}
.thm-qa .qa-tag::before { content: "➤"; font-size: 9px; color: var(--accent-strong); }

/* —— 发布框：玻璃路亭（结构 / name 字段不变） —— */
.thm-qa .qa-post {
  border: 1px solid rgba(14, 165, 233, .28);
  border-radius: 16px;
  background: linear-gradient(160deg, rgba(255, 255, 255, .94), rgba(224, 242, 254, .72));
  backdrop-filter: blur(8px);
}

/* —— 响应式 —— */
@media (max-width: 720px) {
  .thm-qa .qa-hero { padding: 32px 20px 30px; }
  .thm-qa .qa-hero-title { font-size: 31px; letter-spacing: 2px; }
  .thm-qa .qa-hero-sign, .thm-qa .qa-hero-note { display: none; }
  .thm-qa .qa-fork-bg { height: 120px; opacity: .6; }
  .thm-qa .qa-card { padding-left: 20px; }
}
@media (max-width: 480px) {
  .thm-qa .qa-hero { padding: 26px 16px 24px; }
  .thm-qa .qa-hero-signs { max-width: 100%; }
  .thm-qa .qa-hero-signs li { width: 100%; }
  .thm-qa .qa-tabs { gap: 8px; }
  .thm-qa .qa-tab { padding: 6px 12px 6px 10px; }
}

/* —— 文库「晴空书架」书友投稿框 book-post（与全站发布框同款玻璃样式） —— */
.book-post {
  background: rgba(255, 255, 255, .72);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
  backdrop-filter: blur(10px);
  padding: 20px 22px; margin: 0 0 24px;
}
.book-post-title { margin: 0 0 12px; font-size: 15px; font-weight: 700; color: var(--ink); }
.book-post form { display: flex; flex-direction: column; gap: 10px; }
.book-post-row { display: flex; gap: 10px; }
.book-post select, .book-post input[type="text"], .book-post textarea {
  width: 100%; border: 1px solid var(--line); border-radius: var(--r-sm);
  padding: 10px 14px; font-size: 14px; background: rgba(255, 255, 255, .88); color: var(--ink);
}
.book-post textarea { resize: vertical; min-height: 88px; line-height: 1.7; }
.book-post input:focus, .book-post select:focus, .book-post textarea:focus { outline: none; border-color: var(--brand); }
.book-post-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.book-post-hint { font-size: 12.5px; color: var(--muted); }
.book-post-hint b, .book-post-who b { color: var(--brand-strong); }
.book-post-who { font-size: 13px; color: var(--ink-soft); margin-bottom: 2px; }
.book-post-err {
  background: #fdeaea; color: #c0392b; border: 1px solid #f5c6c6; border-radius: var(--r-sm);
  padding: 8px 12px; margin-bottom: 12px; font-size: 13px;
}
.book-post-login {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  background: var(--brand-soft); border: 1px dashed var(--brand-line); border-radius: var(--r-md);
  padding: 14px 16px; font-size: 13.5px; color: var(--ink-soft);
}
@media (max-width: 620px) { .book-post-row { flex-direction: column; } }

/* —— 文库「晴空书架」专属主题色（靛蓝系）· 仅 .thm-docs 作用域 ——
   把本模块主视觉强调色从全站蓝替换为靛蓝；质量星标、热读橙红等语义色保留 */
.thm-docs {
  --accent: #4f46e5;
  --accent-strong: #4338ca;
  --accent-soft: #eef2ff;
  --accent-line: #c7d2fe;
}
/* hero：kicker 标签、统计数字 */
.thm-docs .mod-kicker {
  color: var(--accent-strong);
  background: linear-gradient(120deg, var(--accent-soft), rgba(238, 242, 255, .5));
  border-color: var(--accent-line);
}
.thm-docs .mod-stat b { color: var(--accent-strong); }
/* 筛选 tab：hover 与选中态 */
.thm-docs .mod-tab:hover { border-color: var(--accent-line); color: var(--accent-strong); }
.thm-docs .mod-tab.active { background: var(--accent); border-color: var(--accent); }
/* 藏本卡片：分类标签 / 书名链接 hover / 取阅链接 */
.thm-docs .book-cat { color: var(--accent); background: var(--accent-soft); }
.thm-docs .book-title a:hover { color: var(--accent); }
.thm-docs .book-read { color: var(--accent); }
/* 书友投稿框：聚焦光晕 / 提示 b / 登录提示框 */
.thm-docs .book-post input:focus, .thm-docs .book-post select:focus, .thm-docs .book-post textarea:focus {
  border-color: var(--accent);
}
.thm-docs .book-post-hint b, .thm-docs .book-post-who b { color: var(--accent-strong); }
.thm-docs .book-post-login {
  background: var(--accent-soft);
  border-color: var(--accent-line);
}
/* 面板标题竖条（热读榜 / 随手记） */
.thm-docs .mod-panel-title::before { background: var(--accent); }
/* 阅读页：返回书架 hover / 分类 chip / 摘要竖条 / 目录链接 hover / 温书人 / 随手记聚焦 */
.thm-docs .mod-back a:hover {
  border-color: var(--accent-line);
  color: var(--accent-strong);
  background: var(--accent-soft);
}
.thm-docs .mod-chip { background: var(--accent-soft); color: var(--accent-strong); }
.thm-docs .mod-chip.time { background: #eef4ff; color: #3a6df0; } /* 质量星标语义色保留 */
.thm-docs .read-summary { border-left-color: var(--accent); }
.thm-docs .read-toc a:hover { color: var(--accent); }
.thm-docs .note-author { color: var(--accent-strong); }
.thm-docs .note-form input:focus, .thm-docs .note-form textarea:focus {
  border-color: var(--accent-line);
}

/* ============================================================
   文库「晴空书架」· 沉浸式书架墙场景升级（.thm-docs 作用域追加）
   靛蓝渐变玻璃书架墙 hero + 从架上抽出的书（抽书式藏本卡）
   + 融入场景的分类筛选 / 热读榜 / 投稿框；语义色（金色星标、热读橙红）保留
   ============================================================ */

/* —— 场景 hero：整面书架墙（靛蓝渐变玻璃 + 书脊剪影 + 层板线） —— */
.thm-docs .shelf-hero {
  position: relative; overflow: hidden;
  margin: 0 0 26px; padding: 46px 34px 66px;
  border-radius: 18px;
  border: 1px solid rgba(165, 180, 252, .5);
  color: #eef2ff;
  background:
    radial-gradient(1100px 420px at 84% -12%, rgba(99, 102, 241, .45), transparent 58%),
    radial-gradient(760px 380px at 2% 118%, rgba(79, 70, 229, .35), transparent 55%),
    linear-gradient(158deg, #1e1b4b 0%, #312e81 46%, #1e1b4b 100%);
}
/* 玻璃高光与纵向栅格线 */
.thm-docs .shelf-hero::before {
  content: "";
  position: absolute; inset: 0; z-index: 0;
  background:
    linear-gradient(115deg, rgba(255, 255, 255, .16) 0%, transparent 34%),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, .045) 0 2px, transparent 2px 92px);
  pointer-events: none;
}
.thm-docs .shelf-hero-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.thm-docs .shelf-hero > *:not(.shelf-hero-bg) { position: relative; z-index: 1; }

/* 一排半透明书脊剪影（立在层板线上） */
.thm-docs .shelf-stack {
  position: absolute; left: 0; right: 0; bottom: 21px;
  height: 96px;
  display: flex; align-items: flex-end; justify-content: center;
  gap: 9px;
}
.thm-docs .shelf-stack i {
  flex-shrink: 0;
  width: 15px;
  height: var(--sh, 70%);
  border-radius: 3px 3px 0 0;
  background:
    repeating-linear-gradient(180deg, transparent 0 7px, rgba(255, 255, 255, .09) 7px 8px),
    linear-gradient(180deg, rgba(199, 210, 254, .34), rgba(129, 140, 248, .12));
  border: 1px solid rgba(199, 210, 254, .3);
  border-bottom: 0;
  transform: skewY(-6deg);
  transform-origin: bottom;
}
.thm-docs .shelf-stack i:nth-child(3n) { opacity: .72; }
.thm-docs .shelf-stack i:nth-child(4n) { opacity: .55; }
/* 书架层板线 */
.thm-docs .shelf-ledge {
  position: absolute; left: 0; right: 0; bottom: 15px;
  height: 7px;
  background: linear-gradient(180deg, rgba(199, 210, 254, .55), rgba(129, 140, 248, .22));
  border-radius: 2px;
}
.thm-docs .shelf-ledge::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: -6px; height: 3px;
  background: rgba(12, 9, 52, .55);
}

/* 右上角漂浮徽章（呼吸动效） */
.thm-docs .shelf-float {
  position: absolute; top: 20px; right: 24px;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 999px;
  font-size: 12px; letter-spacing: .5px;
  color: rgba(238, 242, 255, .92);
  background: rgba(255, 255, 255, .10);
  border: 1px solid rgba(199, 210, 254, .35);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  animation: shelf-bob 3.4s ease-in-out infinite;
}
@keyframes shelf-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }

/* hero 文案 */
.thm-docs .shelf-kicker {
  display: inline-block; margin-bottom: 14px; padding: 5px 14px;
  border: 1px solid rgba(199, 210, 254, .4); border-radius: 999px;
  font-size: 12px; letter-spacing: 1px; color: #c7d2fe;
  background: rgba(255, 255, 255, .07);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.thm-docs .shelf-title {
  margin: 0 0 12px;
  font-family: var(--font-serif);
  font-size: 40px; line-height: 1.18;
  letter-spacing: 2px;
  color: #f5f6ff;
}
.thm-docs .shelf-note {
  max-width: 660px;
  margin: 0;
  font-size: 14.5px; line-height: 2;
  color: rgba(224, 231, 255, .82);
}
.thm-docs .shelf-note b { color: #a5b4fc; font-weight: 600; }
/* 统计：玻璃数显 */
.thm-docs .shelf-stats { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 20px; }
.thm-docs .shelf-stat {
  display: flex; flex-direction: column; align-items: center;
  min-width: 104px; padding: 10px 20px;
  border-radius: 14px;
  background: linear-gradient(160deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .05));
  border: 1px solid rgba(199, 210, 254, .28);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.thm-docs .shelf-stat b { font-size: 21px; line-height: 1.3; color: #e0e7ff; font-family: var(--mono); }
.thm-docs .shelf-stat span { font-size: 12px; color: rgba(199, 210, 254, .85); }

/* —— 分类筛选：融入书架场景的标签 —— */
.thm-docs .mod-tab {
  background: rgba(255, 255, 255, .72);
  border: 1px solid var(--accent-line);
  color: var(--accent-strong);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: all .18s;
}
.thm-docs .mod-tab:hover { border-color: var(--accent); background: var(--accent-soft); transform: translateY(-1px); }
.thm-docs .mod-tab.active {
  background: linear-gradient(140deg, #6366f1, var(--accent));
  border-color: var(--accent);
  color: #fff;
}

/* —— 投稿框：融入书架墙的玻璃面板（结构/name 字段不变） —— */
.thm-docs .book-post {
  background: linear-gradient(160deg, rgba(255, 255, 255, .94), rgba(238, 242, 255, .74));
  border: 1px solid var(--accent-line);
  border-left: 4px solid var(--accent);
  border-radius: 14px;
}
.thm-docs .book-post-title { color: var(--accent-strong); }

/* —— 书架墙网格：架顶铭牌 + 板身内衬（仅首页 .thm-docs .mod-grid） —— */
.thm-docs .shelf-grid-head {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  margin: 0 0 12px; padding: 12px 18px;
  font-size: 13px; font-weight: 600; color: var(--accent-strong);
  background: linear-gradient(120deg, var(--accent-soft), rgba(238, 242, 255, .4));
  border: 1px solid var(--accent-line);
  border-bottom: 2px solid #c7d2fe;
  border-radius: 12px 12px 0 0;
}
.thm-docs .shelf-grid-head-note { font-size: 12px; font-weight: 400; color: var(--muted); }
.thm-docs .mod-grid {
  background: linear-gradient(180deg, rgba(238, 242, 255, .55), rgba(238, 242, 255, .22));
  border: 1px solid #e3e9ff;
  border-radius: 0 0 16px 16px;
  padding: 26px 22px 34px;
  margin-bottom: 40px;
}

/* —— 藏本卡片：从书架上抽出的书（保留 --book-hue 封面色相） —— */
.thm-docs .book-card {
  position: relative;
  background: linear-gradient(170deg, #f8faff, #eef2ff 70%, #e0e7ff);
  border: 1px solid #dbe3ff;
  border-radius: 10px 10px 14px 14px;
  transition: transform .22s cubic-bezier(.2, .8, .3, 1.15);
}
/* 抽出动效：向左前方抽出一本书 */
.thm-docs .book-card:hover {
  transform: translateX(-8px) translateY(-5px) rotate(-2deg);
  z-index: 3;
}
/* 底座层板：书立着的隔板 */
.thm-docs .book-card::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: 0; height: 7px;
  background: linear-gradient(180deg, #c7d2fe, #a5b4fc);
  border-radius: 0 0 12px 12px;
}
/* 书封：竖版封面 + 左侧书脊厚度 */
.thm-docs .book-cover {
  position: relative;
  aspect-ratio: 1 / 1.12;
  padding: 16px 16px 14px;
  background:
    radial-gradient(130% 90% at 82% -12%, rgba(255, 255, 255, .32), transparent 52%),
    linear-gradient(160deg, hsl(var(--book-hue) 62% 62%), hsl(var(--book-hue) 70% 34%));
}
.thm-docs .book-cover::before {
  content: "";
  position: absolute; left: 0; top: 0; bottom: 0; width: 9px;
  background: linear-gradient(90deg, rgba(15, 10, 60, .34), rgba(15, 10, 60, .10) 70%, transparent);
  border-radius: 10px 0 0 0;
}
.thm-docs .book-cover-title {
  font-size: 21px; font-weight: 800; line-height: 1.45;
  text-align: center;
  display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
}
.thm-docs .book-spine-tag {
  font-size: 10.5px; letter-spacing: .5px;
  color: #fff;
  background: rgba(255, 255, 255, .2);
  border: 1px solid rgba(255, 255, 255, .3);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.thm-docs .book-cover-meta {
  align-self: center;
  text-align: center;
  font-size: 10px; letter-spacing: 2.5px; opacity: .9;
}
/* 书页信息区 */
.thm-docs .book-body {
  padding: 14px 16px 15px;
  background: linear-gradient(180deg, #ffffff, #f5f7ff);
}
.thm-docs .book-cat {
  display: inline-flex; align-items: center; max-width: 150px;
  color: var(--accent); background: var(--accent-soft);
  border-radius: var(--r-pill); padding: 2px 9px;
  font-size: 11.5px; text-decoration: none;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.thm-docs .book-cat:hover { background: var(--accent-line); color: var(--accent-strong); }
.thm-docs .book-title a:hover { color: var(--accent); }
.thm-docs .book-stars { color: #f5a623; } /* 金色星标语义色保留 */
.thm-docs .book-foot { border-top: 1px dashed #d9e1ff; }
.thm-docs .book-heat { color: #e07b39; } /* 热读橙红语义色保留 */
.thm-docs .book-read {
  padding: 3px 10px; border-radius: 999px;
  background: var(--accent-soft); color: var(--accent);
  font-size: 12px; transition: all .18s;
}
.thm-docs .book-read:hover { background: var(--accent); color: #fff; }

/* —— 热读榜：融入场景的靛蓝玻璃面板（.shelf-panel 限定首页，不影响阅读页） —— */
.thm-docs .mod-panel.shelf-panel {
  background: linear-gradient(170deg, #f6f8ff, #eef2ff 70%, #f5f7ff);
  border: 1px solid #dde5ff;
  border-radius: 16px;
  padding: 22px 24px;
}
.thm-docs .mod-panel.shelf-panel .mod-panel-title { color: var(--accent-strong); }
.thm-docs .mod-panel.shelf-panel .mod-panel-title::before { background: var(--accent); }
.thm-docs .temp-list { gap: 4px; }
.thm-docs .temp-item a {
  padding: 9px 10px;
  background: rgba(255, 255, 255, .66);
  border: 1px solid transparent;
  border-radius: 10px;
  transition: all .18s;
}
.thm-docs .temp-item a:hover {
  background: #fff;
  border-color: var(--accent-line);
}
.thm-docs .temp-item a:hover .temp-title { color: var(--accent-strong); }
.thm-docs .temp-rank {
  background: linear-gradient(145deg, #6366f1, var(--accent));
  border-radius: 8px;
  color: #fff;
}
/* 榜一榜二榜三保留热读橙红语义色 */
.thm-docs .temp-item:nth-child(1) .temp-rank { background: linear-gradient(145deg, #f97316, #ea580c); }
.thm-docs .temp-item:nth-child(2) .temp-rank { background: linear-gradient(145deg, #fb923c, #f97316); }
.thm-docs .temp-item:nth-child(3) .temp-rank { background: linear-gradient(145deg, #fbbf24, #f59e0b); }
.thm-docs .temp-poem { border-top: 1px dashed var(--accent-line); }

/* —— 空态 / 分页：同场景基调 —— */
.thm-docs .mod-empty {
  background: linear-gradient(160deg, rgba(255, 255, 255, .8), rgba(238, 242, 255, .5));
  border: 1px dashed var(--accent-line);
  border-radius: 14px;
}
.thm-docs .pagination a:hover { border-color: var(--accent-line); color: var(--accent-strong); }

/* —— 响应式 —— */
@media (max-width: 760px) {
  .thm-docs .shelf-hero { padding: 34px 22px 56px; }
  .thm-docs .shelf-title { font-size: 30px; }
  .thm-docs .shelf-float { display: none; }
  .thm-docs .shelf-stack { height: 72px; gap: 6px; }
  .thm-docs .shelf-stack i { width: 11px; }
  .thm-docs .mod-grid { padding: 18px 14px 26px; }
}
@media (max-width: 620px) {
  .thm-docs .shelf-hero { padding: 28px 18px 48px; }
  .thm-docs .shelf-title { font-size: 26px; }
  .thm-docs .shelf-stack { height: 58px; gap: 5px; opacity: .65; }
  .thm-docs .shelf-stack i { width: 9px; }
  .thm-docs .shelf-stat { min-width: 88px; padding: 8px 12px; }
  .thm-docs .shelf-stat b { font-size: 18px; }
  .thm-docs .shelf-grid-head-note { display: none; }
  .thm-docs .book-card:hover { transform: translateY(-4px); }
  .thm-docs .book-cover-title { font-size: 18px; }
}

/* ============================================================
   影集「宝丽来照片墙」· pol-* 系（暗房红灯 + 软木墙 + 胶带拍立得）
   与全站 mod-* 骨架并行，仅用于 gallery_index 前台首页
   ============================================================ */

/* —— 暗房 / 画廊 hero —— */
.pol-hero {
  position: relative; overflow: hidden;
  margin: 0 0 26px; padding: 46px 34px 40px;
  background:
    radial-gradient(1200px 460px at 80% -12%, rgba(204, 62, 50, .38), transparent 60%),
    radial-gradient(900px 400px at 6% 112%, rgba(204, 62, 50, .16), transparent 55%),
    linear-gradient(158deg, #23262f 0%, #2c303b 52%, #191c23 100%);
  border-radius: 18px;
  color: #f4efe4;
}
.pol-hero::after {
  content: "";
  position: absolute; right: -40px; top: -40px; width: 200px; height: 200px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 190, 120, .16), transparent 62%);
  pointer-events: none;
}
.pol-hero-kicker {
  display: inline-block; margin-bottom: 12px; padding: 4px 12px;
  border: 1px solid rgba(244, 239, 228, .28); border-radius: 999px;
  font-size: 12px; letter-spacing: 1px; color: rgba(244, 239, 228, .82);
  background: rgba(255, 255, 255, .05);
}
.pol-hero-title {
  margin: 0 0 10px; font-size: 34px; line-height: 1.3;
  font-family: var(--font-serif); letter-spacing: 1px; color: #fdf6e9;
}
.pol-hero-sub {
  margin: 0 0 20px; max-width: 640px; font-size: 14.5px; line-height: 2; color: rgba(244, 239, 228, .78);
}
.pol-hero-sub b { color: #ffd9a8; }
.pol-hero-feet { display: flex; flex-wrap: wrap; gap: 8px 14px; }
.pol-hero-feet span {
  padding: 5px 13px; border-radius: 999px;
  background: rgba(255, 255, 255, .07); border: 1px solid rgba(244, 239, 228, .2);
  font-size: 12.5px; color: rgba(244, 239, 228, .9);
}

/* —— 发布框（登录后开相册） —— */
.pol-post {
  background: linear-gradient(160deg, rgba(255, 255, 255, .96), rgba(243, 235, 218, .74));
  border: 1px solid #e3d6ba; border-radius: 14px;
  padding: 20px 22px; margin: 0 0 26px;
}
.pol-post-title { margin: 0 0 12px; font-size: 15px; font-weight: 700; color: var(--ink); }
.pol-post form { display: flex; flex-direction: column; gap: 10px; }
.pol-post-row { display: flex; gap: 10px; }
.pol-post input[type="text"], .pol-post textarea {
  width: 100%; border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 10px 14px; font-size: 14px; background: rgba(255, 255, 255, .9); color: var(--ink);
}
.pol-post input[readonly] { background: rgba(240, 244, 250, .85); color: var(--muted); cursor: not-allowed; }
.pol-post textarea { resize: vertical; min-height: 78px; line-height: 1.7; }
.pol-post input:focus, .pol-post textarea:focus { outline: none; border-color: var(--brand-line); }
.pol-post-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.pol-post-hint { font-size: 12.5px; color: var(--muted); }
.pol-post-hint b { color: var(--brand-strong); }
.pol-post-err {
  background: #fdeaea; color: #c0392b; border: 1px solid #f5c6c6; border-radius: var(--radius-sm);
  padding: 8px 12px; margin-bottom: 12px; font-size: 13px;
}
.pol-post-login {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  background: rgba(255, 255, 255, .75); border: 1px dashed #d9c49a; border-radius: var(--radius-sm);
  padding: 14px 16px; font-size: 13.5px; color: var(--ink-soft);
}

/* —— 软木墙（照片墙容器） —— */
.pol-wall {
  display: flex; flex-wrap: wrap; align-items: flex-start; gap: 28px 24px;
  padding: 34px 24px 38px; margin: 0 0 26px;
  background:
    radial-gradient(rgba(146, 112, 63, .18) 1.4px, transparent 1.6px),
    linear-gradient(152deg, #f2e7cf, #e8d5b2 58%, #f0e0c3);
  background-size: 24px 24px, 100% 100%;
  border: 1px solid #d9c49a; border-radius: 16px;
}

/* —— 拍立得卡片（胶带斜贴 + 错落旋转） —— */
.pol-card {
  border: 1px solid var(--line);
  position: relative; width: 242px;
  padding: 10px 10px 12px;
  background: #fffdf7; border-radius: 3px;
}
.pol-card:nth-child(odd) { transform: rotate(-2.4deg); }
.pol-card:nth-child(even) { transform: rotate(1.9deg) translateY(14px); }
.pol-card:nth-child(3n) { transform: rotate(3deg) translateY(6px); }
.pol-card:nth-child(4n) { transform: rotate(-1.4deg) translateY(22px); }
.pol-card:hover {
  transform: rotate(0deg) translateY(-6px) scale(1.03); z-index: 5;
}
.pol-tape {
  position: absolute; top: -13px; left: 50%; width: 88px; height: 25px; margin-left: -44px;
  background: rgba(245, 214, 128, .88);
  border-left: 1px dashed rgba(178, 138, 58, .55);
  border-right: 1px dashed rgba(178, 138, 58, .55);
  transform: rotate(-4deg); z-index: 2;
}
.pol-card:nth-child(even) .pol-tape { transform: rotate(5deg); }
.pol-card:nth-child(3n) .pol-tape { transform: rotate(-1deg) translateX(8px); }
.pol-photo {
  display: block; aspect-ratio: 4/3; overflow: hidden;
  background: #e9e1cf; border-radius: 2px;
}
.pol-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pol-card-body { padding: 10px 4px 2px; text-align: center; }
.pol-card-title {
  margin: 0 0 6px; font-size: 16px; line-height: 1.5;
  font-family: var(--font-serif); font-weight: 600; color: #2a2a24;
}
.pol-card-title a { color: inherit; }
.pol-card-title a:hover { color: var(--brand-strong); }
.pol-card-desc {
  margin: 0 auto 8px; max-width: 210px; font-size: 12px; line-height: 1.7;
  color: #7c7361;
}
.pol-card-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  padding-top: 7px; border-top: 1px dashed #e2d8c2;
  font-size: 11px; color: #a2967c;
}
.pol-card-author { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pol-card-meta { flex-shrink: 0; }

/* —— 空态 —— */
.pol-empty {
  text-align: center; padding: 60px 20px; margin-bottom: 26px;
  background: linear-gradient(160deg, rgba(255, 255, 255, .92), rgba(240, 233, 218, .7));
  border: 1px dashed #d9c49a; border-radius: 16px; color: var(--muted);
}
.pol-empty h3 { margin: 0 0 6px; font-size: 17px; color: var(--ink-soft); }
.pol-empty p { margin: 0; font-size: 14px; }

/* —— 响应式 —— */
@media (max-width: 760px) {
  .pol-hero { padding: 34px 22px 30px; }
  .pol-hero-title { font-size: 27px; }
  .pol-wall { justify-content: center; padding: 26px 16px 30px; }
  .pol-card { width: 210px; }
  .pol-card:nth-child(n) { transform: none; }
  .pol-card:nth-child(even) { transform: translateY(8px); }
}
@media (max-width: 480px) {
  .pol-card, .pol-card:nth-child(n) { width: 100%; transform: none; }
  .pol-post-row { flex-direction: column; }
}

/* ============================================================
   资讯「报纸头版」· press-* 系（清新蓝液态玻璃 #2f6fed / #4f9bff）
   报头刊头 + 头条放大 + 剪报卡片 + 读者来稿发布框
   与全站 mod-* 骨架并行，仅用于 news_index 前台首页
   ============================================================ */

/* —— 报头刊头：晴空快报 —— */
.press-masthead {
  position: relative;
  margin: 0 0 24px;
  padding: 28px 26px 18px;
  text-align: center;
  background: linear-gradient(135deg, #eef4ff, #e2ecfe);
  border: 1px solid var(--brand-line);
  border-top: 4px double var(--brand);
  border-bottom: 3px double var(--brand);
  border-radius: var(--r-md);
}
.press-masthead-top {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  font-size: 12px; letter-spacing: .12em; color: var(--muted);
}
.press-slogan { font-weight: 700; color: var(--brand); }
.press-tagline { color: var(--muted); }
.press-name {
  margin: 10px 0 6px;
  font-family: var(--font-serif);
  font-size: 52px; font-weight: 900; line-height: 1.1;
  letter-spacing: 12px; text-indent: 12px;
  color: var(--ink);
}
.press-rule { width: 100%; border-top: 1px solid var(--brand-line); margin: 6px 0 10px; }
.press-dateline {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  font-size: 13px; color: var(--ink-soft);
}
.press-date, .press-issue { font-family: var(--mono); letter-spacing: .06em; }
.press-motto { font-size: 12px; color: var(--muted); letter-spacing: .18em; }

/* —— 读者来稿发布框（登录后前台投稿） —— */
.press-post {
  background: linear-gradient(165deg, #fffdf7, #fdf3e0 60%, #fbebd0);
  border: 1px solid #e8d5b3;
  border-left: 4px solid #b91c1c;
  border-radius: var(--r-md);
  padding: 20px 22px; margin: 0 0 26px;
}
.press-post-title {
  display: flex; align-items: center; gap: 8px;
  margin: 0 0 14px; font-size: 16px; font-weight: 700;
  font-family: var(--font-serif); color: #7c2d12;
}
.press-post-title::before { content: ""; width: 4px; height: 18px; border-radius: 2px; background: #b91c1c; }
.press-post form { display: flex; flex-direction: column; gap: 10px; }
.press-post-row { display: flex; gap: 10px; }
.press-post input[type="text"], .press-post select, .press-post textarea {
  width: 100%; border: 1px solid #e6d5b4; border-radius: var(--r-sm);
  padding: 10px 14px; font-size: 14px;
  background: #fffdf8; color: var(--ink);
  transition: border-color .18s;
}
.press-post input[type="text"]:focus, .press-post select:focus, .press-post textarea:focus {
  outline: none; border-color: #b91c1c;
}
.press-post textarea { resize: vertical; min-height: 120px; line-height: 1.7; }
.press-post-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.press-post-hint { font-size: 12.5px; color: #8a6d45; }
.press-post-hint b { color: #b91c1c; }
.press-post-err {
  background: #fdeaea; color: #b91c1c; border: 1px solid #f5c6c6; border-radius: var(--r-sm);
  padding: 10px 14px; margin: 0 0 14px; font-size: 13.5px;
}
.press-post-login {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  background: #fdf6e9; border: 1px dashed #d9b57f; border-radius: var(--r-md);
  padding: 14px 16px; font-size: 13.5px; color: #7c3a1d;
}

/* —— 投稿按钮 —— */
.press-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border: 0; cursor: pointer; text-decoration: none;
  border-radius: var(--r-sm); padding: 10px 20px;
  font-size: 14px; font-weight: 600; line-height: 1.4;
  transition: all .18s;
}
.press-btn-primary {
  background: linear-gradient(140deg, #dc2626, #b91c1c 62%);
  color: #fff;
}
.press-btn-primary:hover { filter: brightness(1.06); transform: translateY(-1px); }

/* —— 栏目筛选：报眉 —— */
.press-sections {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin: 0 0 20px; padding-bottom: 12px;
  border-bottom: 3px double #b91c1c;
}
.press-section {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 16px; border-radius: var(--r-pill);
  background: #fffdf8; border: 1px solid #ead8b8;
  color: #8a6d45; font-size: 13.5px; font-weight: 500;
  letter-spacing: .04em;
  transition: all .18s;
}
.press-section:hover { border-color: #b91c1c; color: #b91c1c; }
.press-section.on {
  background: linear-gradient(140deg, #dc2626, #b91c1c);
  border-color: #b91c1c; color: #fff; font-weight: 600;
}
.press-section em { font-style: normal; font-size: 11.5px; opacity: .75; }

/* —— 头版版面：头条放大 + 剪报卡片流 —— */
.press-flow {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  background: linear-gradient(180deg, #fffdf7, #fdf6e9);
  border: 1px solid #e8d9bd;
  border-radius: var(--r-md);
  margin: 0 0 26px;
  overflow: hidden;
}
.press-lead {
  grid-column: 1 / -1;
  padding: 26px 28px 20px;
  background: linear-gradient(180deg, #fffaf1, #fdf3e0);
  border-bottom: 3px double #b91c1c;
}
.press-lead-kicker { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.press-lead-title {
  margin: 0 0 10px;
  font-family: var(--font-serif);
  font-size: 30px; line-height: 1.32; color: #7c2d12;
}
.press-lead-title a { color: inherit; }
.press-lead-title a:hover { color: #b91c1c; }
.press-lead-summary {
  margin: 0 0 14px; max-width: 760px;
  color: #7c3a1d; font-size: 15px; line-height: 1.9;
}
.press-lead-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
}
.press-lead-meta { display: flex; flex-wrap: wrap; gap: 5px 14px; color: #a07c4c; font-size: 12.5px; }
.press-lead-meta span { display: inline-flex; align-items: center; gap: 4px; }
.press-lead-more { font-size: 13.5px; font-weight: 700; color: #b91c1c; }
.press-lead-more:hover { text-decoration: underline; }

/* —— 剪报卡片 —— */
.press-clip { display: flex; flex-direction: column; padding: 18px 22px 16px; border-top: 1px solid #eadfc4; }
.press-flow .press-clip:nth-child(-n+3) { border-top: 0; }
.press-clip:nth-child(even) { border-right: 1px solid #eadfc4; }
.press-clip-top { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.press-chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11.5px; font-weight: 700; line-height: 1; letter-spacing: .08em;
  padding: 4px 10px; border-radius: 4px;
  background: #fdeaea; color: #b91c1c; border: 1px solid #f5c6c6;
  text-decoration: none;
}
.press-chip:hover { background: #fbe0e0; color: #991b1b; }
.press-badge { font-size: 11px; font-weight: 700; line-height: 1; padding: 4px 9px; border-radius: 4px; }
.press-badge-new { background: #fdeaea; color: #b91c1c; border: 1px solid #f5c6c6; }
.press-badge-hot { background: #fef3c7; color: #b45309; border: 1px solid #f5d78a; }
.press-clip-title {
  margin: 0 0 8px;
  font-family: var(--font-serif);
  font-size: 17.5px; line-height: 1.5; color: #7c2d12;
}
.press-clip-title a { color: inherit; }
.press-clip-title a:hover { color: #b91c1c; }
.press-clip-summary {
  margin: 0 0 12px; flex: 1;
  color: #8a6d45; font-size: 13.5px; line-height: 1.8;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.press-clip-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  border-top: 1px dashed #eadfc4; padding-top: 10px;
}
.press-clip-meta { display: flex; flex-wrap: wrap; gap: 5px 12px; color: #a07c4c; font-size: 12px; }
.press-clip-meta span { display: inline-flex; align-items: center; gap: 4px; }
.press-clip-more { font-size: 13px; font-weight: 700; color: #b91c1c; white-space: nowrap; }
.press-clip-more:hover { text-decoration: underline; }

/* —— 空态 —— */
.press-empty {
  text-align: center; padding: 52px 20px;
  background: linear-gradient(180deg, #fffdf7, #fdf6e9);
  border: 1px dashed #d9b57f; border-radius: var(--r-md);
  color: #a07c4c; margin: 0 0 26px;
}
.press-empty h3 { margin: 0 0 6px; font-size: 17px; color: #7c3a1d; font-family: var(--font-serif); }
.press-empty p { margin: 0; font-size: 14px; }

/* —— 响应式 —— */
@media (max-width: 820px) {
  .press-flow { grid-template-columns: 1fr; }
  .press-clip:nth-child(even) { border-right: 0; }
  .press-lead { padding: 20px 18px 16px; }
  .press-lead-title { font-size: 24px; }
}
@media (max-width: 620px) {
  .press-masthead { padding: 22px 12px 16px; }
  .press-name { font-size: 36px; letter-spacing: 6px; text-indent: 6px; }
  .press-post { padding: 16px 14px; }
  .press-post-row { flex-direction: column; }
  .press-post-foot { align-items: stretch; text-align: center; }
  .press-lead-title { font-size: 21px; }
  .press-clip { padding: 15px 16px 14px; }
  .press-clip-title { font-size: 16px; }
}

/* ============================================================
   资讯「报纸头版」· 印刷中场景升级（press-* 作用域追加）
   报纸头版场景 hero（米纸 + 网点 + 红双线 + 脉动徽章）
   + 剪报卡片（裁切感）—— 覆盖既有 press-* 样式
   ============================================================ */

/* —— 场景 hero：印刷中的报纸头版 —— */
.press-hero {
  position: relative; overflow: hidden;
  margin: 0 0 26px;
  padding: 30px 34px 36px;
  border-radius: 18px;
  border: 1px solid rgba(185, 28, 28, .25);
  border-top: 4px double #b91c1c;
  border-bottom: 4px double #b91c1c;
  background:
    radial-gradient(1000px 420px at 86% -8%, rgba(194, 65, 12, .10), transparent 58%),
    radial-gradient(760px 360px at 2% 116%, rgba(185, 28, 28, .08), transparent 55%),
    linear-gradient(158deg, #fbf3e2 0%, #f6ead1 55%, #fdf7ea 100%);
}
.press-hero-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
/* 印刷网点 */
.press-dotgrid {
  position: absolute; inset: 0;
  background-image: radial-gradient(rgba(120, 70, 30, .13) 1px, transparent 1.7px);
  background-size: 14px 14px;
  -webkit-mask-image: radial-gradient(720px 380px at 90% 10%, #000, transparent 74%);
  mask-image: radial-gradient(720px 380px at 90% 10%, #000, transparent 74%);
  opacity: .65;
}
/* 纸张纹理 */
.press-grain {
  position: absolute; inset: 0;
  background-image: repeating-linear-gradient(0deg, rgba(120, 70, 30, .04) 0 1px, transparent 1px 3px);
  mix-blend-mode: multiply; opacity: .6;
}
/* 红墨晕染 */
.press-ink {
  position: absolute; right: -70px; top: -70px; width: 280px; height: 280px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(185, 28, 28, .13), transparent 64%);
}
/* 套准标记（装饰） */
.press-guide {
  position: absolute; left: 20px; bottom: 18px;
  width: 18px; height: 18px;
  border: 1px solid rgba(185, 28, 28, .4); border-radius: 50%;
}
.press-guide::before,
.press-guide::after { content: ""; position: absolute; background: rgba(185, 28, 28, .4); }
.press-guide::before { left: 50%; top: -7px; bottom: -7px; width: 1px; transform: translateX(-50%); }
.press-guide::after { top: 50%; left: -7px; right: -7px; height: 1px; transform: translateY(-50%); }
.press-hero > *:not(.press-hero-bg) { position: relative; z-index: 1; }

/* —— 报头刊头（置于场景内，覆盖既有样式） —— */
.press-hero .press-masthead {
  margin: 0 0 22px;
  padding: 0 0 16px;
  background: transparent;
  border: 0;
  border-bottom: 3px double #b91c1c;
  border-radius: 0;
}
.press-hero .press-masthead-top { font-size: 12px; letter-spacing: .14em; color: #8a6d45; }
.press-hero .press-slogan { color: #b91c1c; }
.press-hero .press-tagline { color: #8a6d45; }
.press-hero .press-name {
  margin: 8px 0 4px;
  font-size: 56px; letter-spacing: 14px; text-indent: 14px;
  color: #7f1d1d;
}
.press-hero .press-rule { border-top-color: rgba(185, 28, 28, .45); margin: 4px 0 8px; }
.press-hero .press-dateline { font-size: 12.5px; color: #7c3a1d; }
.press-hero .press-date,
.press-hero .press-issue { color: #b91c1c; font-weight: 600; }
.press-hero .press-motto { color: #8a6d45; }

/* —— 头条特大标题区 —— */
.press-kicker {
  display: inline-block; margin-bottom: 14px; padding: 5px 14px;
  border: 1px solid rgba(185, 28, 28, .38); border-radius: 999px;
  font-size: 12px; letter-spacing: 1px; color: #b91c1c;
  background: rgba(255, 255, 255, .68); backdrop-filter: blur(6px);
}
.press-hero-title {
  margin: 0 0 12px; font-size: 42px; line-height: 1.22;
  font-family: var(--font-serif); letter-spacing: 2px; color: #7f1d1d;
}
.press-hero-note {
  margin: 0 0 18px; max-width: 660px;
  font-size: 14.5px; line-height: 2; color: #7c3a1d;
}
.press-hero-note b { color: #b91c1c; }
/* 统计（场景内） */
.press-stats { display: flex; gap: 10px; flex-wrap: wrap; }
.press-stat {
  display: flex; flex-direction: column; gap: 2px;
  padding: 10px 16px; border-radius: 12px;
  background: rgba(255, 255, 255, .72);
  border: 1px solid rgba(185, 28, 28, .18);
}
.press-stat b { font-size: 19px; color: #b91c1c; font-family: var(--mono); line-height: 1.3; }
.press-stat span { font-size: 12px; color: #8a6d45; }
/* 右下角脉动徽章：印刷中 */
.press-hero-badge {
  position: absolute; right: 24px; bottom: 20px; z-index: 1;
  font-size: 11.5px; letter-spacing: 2px; color: #7f1d1d;
  background: rgba(255, 255, 255, .8);
  border: 1px solid rgba(185, 28, 28, .42);
  border-radius: 999px; padding: 5px 14px;
  animation: press-pulse 2.4s ease-in-out infinite;
}
@keyframes press-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .55; transform: scale(1.04); }
}

/* —— 头版版面：整版报纸底（覆盖既有 press-flow） —— */
.press-flow {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 14px;
  background:
    radial-gradient(800px 320px at 92% -6%, rgba(194, 65, 12, .07), transparent 60%),
    linear-gradient(180deg, #f2e7cd, #efe2c4);
  border: 1px solid #e2d2ae;
  border-radius: 16px;
  margin: 0 0 26px;
}
/* 头条：头版头条见报 */
.press-lead {
  grid-column: 1 / -1;
  padding: 24px 26px 20px;
  background: linear-gradient(180deg, #fffef8, #fdf3e0);
  border: 1px solid #eadfc4;
  border-left: 4px solid #b91c1c;
  border-bottom: 3px double #b91c1c;
  border-radius: 10px;
}
.press-lead-kicker { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.press-lead-title {
  margin: 0 0 10px;
  font-family: var(--font-serif);
  font-size: 30px; line-height: 1.32; color: #7c2d12;
}
.press-lead-title a { color: inherit; }
.press-lead-title a:hover { color: #b91c1c; }
.press-lead-summary { margin: 0 0 14px; max-width: 760px; color: #7c3a1d; font-size: 15px; line-height: 1.9; }
.press-lead-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.press-lead-meta { display: flex; flex-wrap: wrap; gap: 5px 14px; color: #a07c4c; font-size: 12.5px; }
.press-lead-meta span { display: inline-flex; align-items: center; gap: 4px; }
.press-lead-more { font-size: 13.5px; font-weight: 700; color: #b91c1c; }
.press-lead-more:hover { text-decoration: underline; }

/* —— 剪报卡片：报纸裁切感（覆盖既有 press-clip） —— */
.press-flow .press-clip {
  position: relative;
  display: flex; flex-direction: column;
  padding: 20px 22px 18px;
  background: linear-gradient(180deg, #fffef9, #fdf5e3);
  border: 1px solid #eadfc4;
  border-radius: 8px;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%);
}
.press-flow .press-clip:nth-child(-n+3) { border-top: 1px solid #eadfc4; }
.press-flow .press-clip:nth-child(even) { border-right: 1px solid #eadfc4; }
/* 红色报头角标：左上红头条 */
.press-flow .press-clip::before {
  content: "";
  position: absolute; left: 0; top: 0;
  width: 42px; height: 5px;
  background: linear-gradient(90deg, #b91c1c, #c2410c);
  border-radius: 0 0 5px 0;
}
/* 针脚线（底部信息条） */
.press-flow .press-clip-foot {
  border-top: 1px dashed #dcc9a2;
  padding-top: 10px;
}
.press-flow .press-clip-top { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.press-flow .press-clip-title {
  margin: 0 0 8px;
  font-family: var(--font-serif);
  font-size: 17.5px; line-height: 1.5; color: #7c2d12;
}
.press-flow .press-clip-title a { color: inherit; }
.press-flow .press-clip-title a:hover { color: #b91c1c; }
.press-flow .press-clip-summary {
  margin: 0 0 12px; flex: 1;
  color: #8a6d45; font-size: 13.5px; line-height: 1.8;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.press-flow .press-clip-meta { display: flex; flex-wrap: wrap; gap: 5px 12px; color: #a07c4c; font-size: 12px; }
.press-flow .press-clip-meta span { display: inline-flex; align-items: center; gap: 4px; }
.press-flow .press-clip-more { font-size: 13px; font-weight: 700; color: #b91c1c; white-space: nowrap; }
.press-flow .press-clip-more:hover { text-decoration: underline; }

/* —— 响应式 —— */
@media (max-width: 720px) {
  .press-hero { padding: 24px 20px 30px; }
  .press-hero-title { font-size: 31px; }
  .press-hero-badge { right: 14px; bottom: 14px; }
  .press-guide { display: none; }
  .press-flow { padding: 10px; gap: 10px; }
}
@media (max-width: 620px) {
  .press-hero { padding: 20px 16px 26px; }
  .press-hero .press-name { font-size: 34px; letter-spacing: 6px; text-indent: 6px; }
  .press-hero-title { font-size: 26px; }
  .press-hero-note { font-size: 13.5px; }
  .press-flow { grid-template-columns: 1fr; }
  .press-flow .press-clip { padding: 16px 16px 15px; }
  .press-flow .press-clip-title { font-size: 16px; }
  .press-flow .press-lead { padding: 18px 16px 15px; }
  .press-flow .press-lead-title { font-size: 21px; }
  .press-hero-badge { display: none; }
}

/* —— 「服务工具箱」tool-* 专属：工具箱格层设计（品牌蓝 #2f6fed，不套 mod-* 骨架） —— */
/* 工具箱式页头：浅蓝液态玻璃箱盖 + 蓝色标识 */
.tool-hero {
  position: relative;
  background: linear-gradient(135deg, #eef4ff, #e2ecfe);
  border: 1px solid rgba(79, 155, 255, .30);
  border-radius: var(--r-lg);
  padding: 30px 30px 26px;
  margin: 0 0 22px;
  overflow: hidden;
}
.tool-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(560px 190px at 88% -22%, rgba(79, 155, 255, .18), transparent 62%),
    repeating-linear-gradient(90deg, transparent 0 46px, rgba(47, 111, 237, .04) 46px 47px);
  pointer-events: none;
}
.tool-kicker {
  display: inline-block;
  font-size: 12.5px;
  letter-spacing: .1em;
  color: #1d4fc0;
  background: rgba(47, 111, 237, .10);
  border: 1px solid rgba(79, 155, 255, .40);
  border-radius: var(--r-pill);
  padding: 4px 12px;
  margin-bottom: 14px;
}
.tool-title {
  margin: 0 0 10px;
  font-size: 30px;
  font-weight: 800;
  color: var(--ink);
  font-family: var(--font-serif);
  letter-spacing: .02em;
}
.tool-note {
  max-width: 720px;
  margin: 0 0 18px;
  font-size: 14.5px;
  line-height: 1.9;
  color: var(--muted);
}
.tool-note b { color: #1d4fc0; font-weight: 600; }
.tool-stats { display: flex; gap: 10px; flex-wrap: wrap; }
.tool-stat {
  display: flex; flex-direction: column; align-items: center; min-width: 96px;
  background: rgba(255, 255, 255, .55);
  border: 1px solid rgba(47, 111, 237, .14);
  border-radius: var(--r-md);
  padding: 8px 18px;
  font-size: 12px;
  color: var(--muted);
}
.tool-stat b { font-size: 20px; color: #4f9bff; font-family: var(--mono); line-height: 1.3; margin-bottom: 2px; }

/* 登录态发布框：草绿描边的「添一格」面板 */
.tool-post {
  background: linear-gradient(160deg, rgba(255, 255, 255, .97), rgba(240, 248, 242, .92));
  border: 1px solid #bfe3c9;
  border-radius: var(--r-lg);
  padding: 20px 22px;
  margin: 0 0 24px;
}
.tool-post-title { margin: 0 0 12px; font-size: 15px; font-weight: 700; color: var(--ink); }
.tool-post form { display: flex; flex-direction: column; gap: 10px; }
.tool-post-row { display: flex; gap: 10px; }
.tool-post select, .tool-post input[type="text"], .tool-post textarea {
  width: 100%; border: 1px solid #d8e7dc; border-radius: var(--r-sm);
  padding: 10px 14px; font-size: 14px; background: #fff; color: var(--ink);
}
.tool-post textarea { resize: vertical; min-height: 120px; line-height: 1.7; }
.tool-post select:focus, .tool-post input[type="text"]:focus, .tool-post textarea:focus {
  outline: none; border-color: #16a34a;
}
.tool-post-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.tool-post-hint { font-size: 12.5px; color: var(--muted); }
.tool-post-err {
  background: #fdeaea; color: #c0392b; border: 1px solid #f5c6c6; border-radius: var(--r-sm);
  padding: 8px 12px; margin-bottom: 10px; font-size: 13px;
}
.tool-post-who { margin: 0 0 10px; font-size: 13px; color: var(--ink-soft); }
.tool-post-who b { color: #15803d; }
.tool-post-login {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  background: #f0f9f2; border: 1px dashed #9fd8ae; border-radius: var(--r-md);
  padding: 14px 16px; font-size: 13.5px; color: var(--ink-soft);
}

/* 门类筛选：工具箱抽屉标签 */
.tool-drawers { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 20px; }
.tool-drawer {
  display: inline-flex; align-items: center; gap: 6px;
  background: #f1f4f2; border: 1px solid var(--line); border-radius: var(--r-pill);
  padding: 7px 14px; font-size: 13.5px; color: var(--ink-soft);
  text-decoration: none; transition: all .18s ease;
}
.tool-drawer em { font-style: normal; font-size: 12px; color: var(--muted); font-family: var(--mono); }
.tool-drawer:hover { border-color: #16a34a; color: #15803d; background: #f0f9f2; }
.tool-drawer.active { background: #16a34a; border-color: #16a34a; color: #fff; }
.tool-drawer.active em { color: rgba(255, 255, 255, .85); }

/* 服务格层：每张卡片像工具箱的一格 */
.tool-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 18px; margin: 0 0 10px;
}
.tool-cell {
  position: relative;
  display: flex; flex-direction: column;
  background: linear-gradient(165deg, #fff 0%, #f6faf7 100%);
  border: 1px solid #dde7e0;
  border-radius: var(--r-lg);
  padding: 18px 18px 16px;
  transition: transform .18s ease, border-color .18s ease;
  overflow: hidden;
}
/* 格层顶部的「把手」装饰条 */
.tool-cell::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #16a34a, #4ade80 60%, #16a34a);
}
.tool-cell:hover {
  transform: translateY(-3px);
  border-color: #a8d9b4;
}
.tool-cell-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.tool-tag {
  background: #e8f7ec; color: #15803d;
  border: 1px solid #bfe3c9;
  border-radius: var(--r-pill);
  padding: 3px 10px; font-size: 12px; font-weight: 600;
}
.tool-rating { font-size: 12px; color: #b45309; white-space: nowrap; }
.tool-cell-title { margin: 0 0 6px; font-size: 18px; font-weight: 700; line-height: 1.45; }
.tool-cell-title a { color: var(--ink); text-decoration: none; }
.tool-cell-title a:hover { color: #15803d; }
/* 明码标价：像贴在格层上的价签 */
.tool-price {
  display: inline-block;
  align-self: flex-start;
  background: #16a34a; color: #fff;
  font-family: var(--mono); font-weight: 700; font-size: 17px;
  border-radius: var(--r-sm);
  padding: 4px 12px; margin: 4px 0 10px;
}
.tool-price-unit { font-size: 12px; font-weight: 400; opacity: .85; }
.tool-cell-desc {
  margin: 0 0 12px; font-size: 13.5px; line-height: 1.75; color: var(--ink-soft);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.tool-cell-meta {
  list-style: none; margin: auto 0 14px; padding: 10px 12px;
  background: #f3f7f4; border: 1px dashed #d3e3d7; border-radius: var(--r-sm);
  display: flex; flex-direction: column; gap: 6px;
}
.tool-cell-meta li { display: flex; align-items: baseline; gap: 8px; font-size: 13px; color: var(--ink-soft); }
.tool-cell-meta li span { flex: none; font-size: 12px; color: var(--muted); min-width: 52px; }
.tool-open {
  align-self: flex-end;
  font-size: 13.5px; font-weight: 600; color: #15803d;
  text-decoration: none;
}
.tool-open:hover { color: #16a34a; }
.tool-empty {
  text-align: center; padding: 40px 20px;
  background: rgba(255, 255, 255, .6); border: 1px dashed var(--line); border-radius: var(--r-lg);
}
.tool-empty h3 { margin: 0 0 6px; font-size: 16px; color: var(--ink); }
.tool-empty p { margin: 0; font-size: 13.5px; color: var(--muted); }
@media (max-width: 620px) {
  .tool-hero { padding: 24px 18px 20px; }
  .tool-title { font-size: 24px; }
  .tool-post-row { flex-direction: column; }
  .tool-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   服务·晴空帮手「维修工具箱」沉浸式场景升级（tool-* 作用域追加）
   打开的维修工具箱 hero：钢灰渐变 + 掀开的箱盖 + 工具剪影 + 脉动徽章
   工具格卡片 + 抽屉筛选 + 发布框，保持草绿主题（#16a34a / #4ade80）
   ============================================================ */

/* —— 场景 hero：打开的维修工具箱 —— */
.tool-hero {
  position: relative; overflow: hidden;
  background:
    radial-gradient(1100px 420px at 82% -10%, rgba(74, 222, 128, .16), transparent 58%),
    radial-gradient(760px 360px at 4% 118%, rgba(34, 197, 94, .10), transparent 55%),
    linear-gradient(158deg, #3a4150 0%, #2b313d 52%, #1d212a 100%);
  border: 1px solid rgba(148, 163, 184, .38);
  border-radius: 18px;
  padding: 42px 34px 36px;
  margin: 0 0 26px;
  color: #eef2ec;
}
/* 箱体内部：格层分隔线（分层线）+ 纵向光源 */
.tool-hero::before {
  content: "";
  position: absolute; inset: 0;
  background:
    repeating-linear-gradient(180deg, transparent 0 46px, rgba(255, 255, 255, .05) 46px 47px),
    linear-gradient(90deg, transparent 0 72%, rgba(74, 222, 128, .05) 72% 73.5%, transparent 73.5%);
  pointer-events: none;
}
/* 掀开的箱盖：右上角旋转的钢灰盖板（层次感） */
.tool-hero::after {
  content: "";
  position: absolute; top: -84px; right: -44px;
  width: 360px; height: 200px;
  border-radius: 16px;
  background: linear-gradient(150deg, rgba(120, 132, 154, .50), rgba(60, 66, 82, .34));
  border: 2px solid rgba(148, 163, 184, .42);
  transform: rotate(15deg);
  pointer-events: none;
}
.tool-hero-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.tool-scene-svg {
  position: absolute; left: 0; right: 0; bottom: -2px;
  width: 100%; height: 210px; opacity: .9;
}
/* 工具剪影：白 / 草绿交替的浅透明显影 */
.tool-sil { fill: rgba(255, 255, 255, .08); }
.tool-sil:nth-child(2n) { fill: rgba(74, 222, 128, .12); }
.tool-hero > *:not(.tool-hero-bg) { position: relative; z-index: 1; }
/* 脉动徽章：右下角「随时接单」 */
.tool-hero-badge {
  position: absolute; right: 26px; bottom: 20px; z-index: 2;
  font-size: 11.5px; letter-spacing: 1px; color: #86efac;
  background: rgba(22, 163, 74, .18); border: 1px solid rgba(74, 222, 128, .55);
  border-radius: 999px; padding: 5px 14px; backdrop-filter: blur(6px);
  animation: tool-pulse 2.6s ease-in-out infinite;
}
@keyframes tool-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: .72; }
}
/* 深色场景下的 kicker / 标题 / 文案 / 统计（覆盖原浅底样式） */
.tool-kicker {
  display: inline-block; margin-bottom: 14px; padding: 5px 14px;
  border: 1px solid rgba(74, 222, 128, .45); border-radius: 999px;
  font-size: 12px; letter-spacing: 1px; color: #86efac;
  background: rgba(22, 163, 74, .14); backdrop-filter: blur(6px);
}
.tool-title {
  margin: 0 0 12px; font-size: 40px; line-height: 1.18;
  font-family: var(--font-serif); letter-spacing: 2px; color: #f0fdf4;
}
.tool-note { max-width: 660px; margin: 0 0 18px; font-size: 14.5px; line-height: 2; color: rgba(228, 238, 230, .80); }
.tool-note b { color: #4ade80; font-weight: 600; }
.tool-stats { display: flex; gap: 10px; flex-wrap: wrap; }
.tool-stat {
  display: flex; flex-direction: column; align-items: center; min-width: 96px;
  background: rgba(255, 255, 255, .06); border: 1px solid rgba(148, 163, 184, .28);
  border-radius: var(--r-md); padding: 8px 18px;
  font-size: 12px; color: rgba(228, 238, 230, .72);
}
.tool-stat b { font-size: 20px; color: #4ade80; font-family: var(--mono); line-height: 1.3; margin-bottom: 2px; }

/* —— 发布框：草绿描边的「添一格」面板（表单 name 字段不变） —— */
.tool-post {
  background: linear-gradient(160deg, rgba(255, 255, 255, .97), rgba(240, 248, 242, .92));
  border: 1px solid #bfe3c9; border-top: 3px solid #16a34a;
  border-radius: var(--r-lg); padding: 20px 22px; margin: 0 0 24px;
}
.tool-post select:focus, .tool-post input[type="text"]:focus, .tool-post textarea:focus {
  outline: none; border-color: #16a34a;
}
.tool-post-who b { color: #15803d; }
.tool-post-login {
  background: #f0f9f2; border: 1px dashed #9fd8ae; color: var(--ink-soft);
}

/* —— 门类筛选：工具箱抽屉标签 —— */
.tool-drawer {
  background: #f1f4f2; border: 1px solid var(--line); border-radius: var(--r-pill);
  padding: 7px 14px; font-size: 13.5px; color: var(--ink-soft);
  text-decoration: none; transition: all .18s ease;
}
.tool-drawer:hover { border-color: #16a34a; color: #15803d; background: #f0f9f2; }
.tool-drawer.active {
  background: #16a34a; border-color: #16a34a; color: #fff;
}
.tool-drawer.active em { color: rgba(255, 255, 255, .85); }

/* —— 工具格卡片：每一格像工具箱里的一个格层 —— */
.tool-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 18px; margin: 0 0 10px;
}
.tool-cell {
  position: relative;
  display: flex; flex-direction: column;
  background:
    radial-gradient(120px 60px at 100% 0%, rgba(74, 222, 128, .07), transparent 70%),
    linear-gradient(165deg, #fdfefd 0%, #f1f6f2 100%);
  border: 1px solid #d3e0d6;
  border-radius: var(--r-lg);
  padding: 18px 18px 16px;
  transition: transform .18s ease, border-color .18s ease;
  overflow: hidden;
}
/* 格层把手条 */
.tool-cell::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, #16a34a, #4ade80 55%, #16a34a);
}
.tool-cell:hover {
  transform: translateY(-3px);
  border-color: #9fd8ae;
}
.tool-cell-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
/* 格层标签：左缘加粗的贴条样式 */
.tool-tag {
  display: inline-flex; align-items: center; gap: 5px;
  background: #e8f7ec; color: #15803d;
  border: 1px solid #bfe3c9; border-left: 3px solid #16a34a;
  border-radius: var(--r-pill); padding: 3px 10px; font-size: 12px; font-weight: 600;
}
/* 口碑分：琥珀语义色保留 */
.tool-rating {
  font-size: 12px; color: #b45309; white-space: nowrap;
  background: rgba(245, 158, 11, .10); border: 1px solid rgba(217, 119, 6, .22);
  border-radius: var(--r-pill); padding: 2px 9px;
}
.tool-cell-title { margin: 0 0 6px; font-size: 18px; font-weight: 700; line-height: 1.45; }
.tool-cell-title a { color: var(--ink); text-decoration: none; }
.tool-cell-title a:hover { color: #15803d; }
/* 价签样式价格：右侧撕口，像贴在格层上的价签 */
.tool-price {
  display: inline-block;
  align-self: flex-start;
  background: #16a34a; color: #fff;
  font-family: var(--mono); font-weight: 700; font-size: 17px;
  border-radius: 6px 0 0 6px;
  clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 50%, calc(100% - 9px) 100%, 0 100%);
  padding: 4px 14px 4px 12px; margin: 4px 0 10px;
}
.tool-price-unit { font-size: 12px; font-weight: 400; opacity: .85; }
.tool-cell-desc {
  margin: 0 0 12px; font-size: 13.5px; line-height: 1.75; color: var(--ink-soft);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
/* 响应时效与服务方 meta：格层上的两条小签 */
.tool-cell-meta {
  list-style: none; margin: auto 0 14px; padding: 10px 12px;
  background: #f3f7f4; border: 1px dashed #cfe0d4; border-radius: var(--r-sm);
  display: flex; flex-direction: column; gap: 7px;
}
.tool-cell-meta li { display: flex; align-items: baseline; gap: 8px; font-size: 13px; color: var(--ink-soft); }
.tool-cell-meta li span {
  flex: none; font-size: 11px; font-weight: 700; letter-spacing: .5px;
  color: #15803d; background: #e8f7ec; border: 1px solid #d0e8d6;
  border-radius: var(--r-pill); padding: 2px 8px;
}
.tool-open { align-self: flex-end; font-size: 13.5px; font-weight: 600; color: #15803d; text-decoration: none; }
.tool-open:hover { color: #16a34a; }
.tool-empty { text-align: center; padding: 40px 20px; background: rgba(255, 255, 255, .6); border: 1px dashed var(--line); border-radius: var(--r-lg); }
.tool-empty h3 { margin: 0 0 6px; font-size: 16px; color: var(--ink); }
.tool-empty p { margin: 0; font-size: 13.5px; color: var(--muted); }

/* —— 响应式适配 —— */
@media (max-width: 720px) {
  .tool-hero { padding: 30px 20px 26px; }
  .tool-hero::after { width: 210px; height: 120px; top: -54px; right: -80px; }
  .tool-title { font-size: 30px; }
  .tool-scene-svg { height: 150px; }
  .tool-hero-badge { display: none; }
}
@media (max-width: 620px) {
  .tool-title { font-size: 26px; }
  .tool-post-row { flex-direction: column; }
  .tool-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   电商「橱窗陈列」· win- 系（清新蓝液态玻璃 · 品牌蓝点缀 #2f6fed）
   店铺门面 hero + 上架发布框 + 分类货架 + 展品式商品卡
   与全站 mod-* 骨架并行，仅用于 shop_index 前台首页
   ============================================================ */

/* —— 店铺门面 hero（浅蓝玻璃质感） —— */
.win-storefront {
  position: relative;
  margin: 0 0 26px;
  padding: 34px 32px 30px;
  border-radius: var(--r-lg);
  background:
    radial-gradient(2px 2px at 12% 22%, rgba(79, 155, 255, .30), transparent 65%),
    radial-gradient(1.5px 1.5px at 30% 68%, rgba(79, 155, 255, .24), transparent 65%),
    radial-gradient(2px 2px at 62% 18%, rgba(79, 155, 255, .26), transparent 65%),
    radial-gradient(1.5px 1.5px at 84% 70%, rgba(79, 155, 255, .22), transparent 65%),
    linear-gradient(135deg, #eef4ff, #e2ecfe);
  border: 1px solid rgba(199, 220, 252, .85);
  overflow: hidden;
}
.win-store-lamp {
  position: absolute; top: 18px; right: 22px;
  font-size: 34px; line-height: 1;
  animation: winGlow 3.2s ease-in-out infinite;
}
@keyframes winGlow {
  0%, 100% { transform: scale(1); opacity: .85; }
  50% { transform: scale(1.12); opacity: 1; }
}
.win-store-kicker {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 700; letter-spacing: 2px;
  color: #1d4fc0;
  background: rgba(255, 255, 255, .75);
  border: 1px solid rgba(199, 220, 252, .9);
  padding: 5px 14px; border-radius: var(--r-pill);
}
.win-store-title {
  margin: 16px 0 10px;
  font-family: var(--font-serif);
  font-size: 38px; line-height: 1.2;
  color: var(--ink); letter-spacing: 2px;
}
.win-store-note {
  margin: 0; max-width: 680px;
  color: var(--muted); font-size: 15px; line-height: 1.9;
}
.win-store-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.win-store-meta span {
  display: inline-flex; align-items: baseline; gap: 6px;
  background: rgba(255, 255, 255, .8);
  border: 1px solid rgba(199, 220, 252, .9); border-radius: var(--r-pill);
  padding: 7px 16px; font-size: 13px; color: var(--muted);
}
.win-store-meta b { font-size: 17px; color: #2f6fed; font-family: var(--mono); }

/* —— 上架发布框（登录后前台发布，玻璃质感） —— */
.win-post {
  background: rgba(255, 255, 255, .72);
  backdrop-filter: saturate(180%) blur(16px);
  -webkit-backdrop-filter: saturate(180%) blur(16px);
  border: 1px solid rgba(199, 220, 252, .85); border-radius: var(--r-lg);
  padding: 20px 22px; margin: 0 0 24px;
}
.win-post-title { margin: 0 0 14px; font-size: 15px; font-weight: 700; color: var(--ink); }
.win-post form { display: flex; flex-direction: column; gap: 10px; }
.win-post-row { display: flex; gap: 10px; }
.win-post input[type="text"], .win-post input[type="number"], .win-post select, .win-post textarea {
  width: 100%; border: 1px solid rgba(199, 220, 252, .9); border-radius: var(--r-sm);
  padding: 10px 14px; font-size: 14px;
  background: rgba(255, 255, 255, .92); color: var(--ink);
}
.win-post textarea { resize: vertical; min-height: 96px; line-height: 1.7; }
.win-post input:focus, .win-post select:focus, .win-post textarea:focus { outline: none; border-color: #2f6fed; }
.win-post-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.win-post-hint { font-size: 12.5px; color: var(--muted); }
.win-post-hint b { color: #2f6fed; }
.win-post-err {
  background: #fdeaea; color: #c0392b; border: 1px solid #f5c6c6; border-radius: var(--r-sm);
  padding: 8px 12px; margin-bottom: 12px; font-size: 13px;
}
.win-post-login {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  background: rgba(255, 255, 255, .7); border: 1px dashed rgba(47, 111, 237, .45); border-radius: var(--r-md);
  padding: 14px 16px; font-size: 13.5px; color: var(--muted);
}
.win-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border: 0; cursor: pointer; text-decoration: none;
  border-radius: var(--r-sm); padding: 10px 20px;
  font-size: 14px; font-weight: 600; line-height: 1.4;
  transition: all .18s;
}
.win-btn-primary {
  background: linear-gradient(140deg, #4f9bff, #2f6fed 62%);
  color: #fff;
}
.win-btn-primary:hover { filter: brightness(1.06); transform: translateY(-1px); }
.win-btn-ghost {
  background: rgba(255, 255, 255, .8); color: #1d4fc0;
  border: 1px solid rgba(199, 220, 252, .9);
}
.win-btn-ghost:hover { border-color: #2f6fed; color: #2f6fed; }

/* —— 分类货架筛选 —— */
.win-cats { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 24px; }
.win-cat {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 18px; border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .8); border: 1px solid rgba(199, 220, 252, .9);
  color: var(--muted); font-size: 13.5px; font-weight: 500;
  transition: all .18s;
}
.win-cat:hover { border-color: #2f6fed; color: #2f6fed; }
.win-cat.on { background: linear-gradient(140deg, #4f9bff, #2f6fed); border-color: #2f6fed; color: #fff; font-weight: 600; }
.win-cat em { font-style: normal; font-size: 11.5px; opacity: .75; }

/* —— 橱窗陈列：展品式商品卡 —— */
.win-showcase {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; margin-bottom: 34px;
}
.win-item {
  display: flex; flex-direction: column;
  background: linear-gradient(165deg, #fffdf8, #fdf3e0 58%, #fbeed2);
  border: 1px solid #eedcbd; border-radius: var(--r-lg);
  overflow: hidden;
  transition: transform .2s, border-color .2s;
}
.win-item:hover {
  transform: translateY(-4px); border-color: #d97706;
}
.win-item-cover {
  position: relative;
  display: grid; place-items: center;
  height: 168px;
  background:
    radial-gradient(2px 2px at 18% 24%, rgba(217, 119, 6, .25), transparent 65%),
    radial-gradient(1.5px 1.5px at 76% 20%, rgba(217, 119, 6, .22), transparent 65%),
    radial-gradient(2px 2px at 40% 82%, rgba(217, 119, 6, .20), transparent 65%),
    linear-gradient(160deg, #fef6e7, #f9e6c0);
}
.win-item-char {
  font-family: var(--font-serif);
  font-size: 56px; font-weight: 700;
  color: #b45309;
}
.win-item-cat {
  position: absolute; top: 12px; left: 12px;
  font-size: 11.5px; font-weight: 600;
  padding: 4px 10px; border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .85); color: #b45309;
  border: 1px solid #eed9b4;
}
/* 价格吊牌：像挂在展品上的价签，琥珀渐变 + 穿绳孔 */
.win-tag-price {
  position: absolute; top: 12px; right: 12px;
  font-family: var(--mono); font-size: 14px; font-weight: 700;
  color: #fff;
  background: linear-gradient(150deg, #f59e0b, #d97706);
  padding: 6px 12px;
  border-radius: 4px 4px 10px 4px;
}
.win-tag-price::after {
  content: ""; position: absolute; left: 5px; top: 50%;
  width: 5px; height: 5px; margin-top: -2.5px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .9);
}
.win-item-body { display: flex; flex-direction: column; gap: 10px; padding: 16px 18px 18px; flex: 1; }
.win-item-title { margin: 0; font-family: var(--font-serif); font-size: 18px; line-height: 1.5; color: #7c3a1d; }
.win-item:hover .win-item-title { color: #d97706; }
.win-item-summary {
  margin: 0; flex: 1;
  color: #8a6d45; font-size: 14px; line-height: 1.85;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.win-item-stock { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.win-item-remain { font-size: 12px; color: #a07c4c; white-space: nowrap; font-family: var(--mono); }
/* 库存条与安心购徽标沿用全站组件，仅把点亮色换成琥珀（暖色主题统一） */
.win-item-stock .shelf-bar i.on { background: #d97706; }
.win-item-stock .shop-badge { margin-left: auto; }

/* —— 空态 —— */
.win-empty { text-align: center; padding: 56px 20px; color: #a07c4c; }
.win-empty h3 { margin: 0 0 6px; font-size: 17px; color: #8a6d45; }
.win-empty p { margin: 0; font-size: 14px; }

/* ============================================================
   电商「夜色橱窗街景」场景升级（win- 作用域追加，暖琥珀 #d97706/#f59e0b）
   夜色橱窗 hero + 橱窗展柜商品卡：覆盖原 win-* 蓝色液态玻璃为暖琥珀夜间主题
   ============================================================ */

/* —— 场景 hero：夜色橱窗街景 —— */
.win-hero {
  position: relative; overflow: hidden;
  margin: 0 0 26px; padding: 46px 36px 42px;
  border-radius: 18px;
  border: 1px solid rgba(245, 158, 11, .28);
  color: #f6ead2;
  background:
    radial-gradient(1100px 460px at 84% -16%, rgba(124, 140, 220, .28), transparent 58%),
    radial-gradient(860px 400px at 10% 118%, rgba(245, 158, 11, .18), transparent 60%),
    linear-gradient(168deg, #0d1430 0%, #181f3d 42%, #2b2444 74%, #44273a 100%);
}
.win-hero-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.win-hero > *:not(.win-hero-bg) { position: relative; z-index: 1; }

/* 星星点点：夜空里一明一灭 */
.win-hero-stars { position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 200px; }
.win-star { fill: #ffe8bd; animation: win-twinkle 3.6s ease-in-out infinite; }
.win-star:nth-child(3n) { animation-delay: .8s; }
.win-star:nth-child(4n) { animation-delay: 1.6s; }
.win-star:nth-child(5n) { animation-delay: 2.4s; }
@keyframes win-twinkle {
  0%, 100% { opacity: .25; }
  50% { opacity: 1; }
}

/* 店铺灯带：暖光横贯街面 */
.win-hero-strip {
  position: absolute; left: 0; right: 0; bottom: 118px; height: 3px;
  background: linear-gradient(90deg, transparent, rgba(251, 191, 36, .9) 16%, rgba(217, 119, 6, .9) 50%, rgba(251, 191, 36, .9) 84%, transparent);
  opacity: .9;
}

/* 暖光橱窗框：三扇沿街亮着的窗 */
.win-hero-window {
  position: absolute; bottom: 30px;
  width: 148px; height: 84px;
  border: 3px solid rgba(255, 199, 112, .9);
  border-radius: 8px;
  background:
    radial-gradient(80px 46px at 50% 62%, rgba(255, 224, 172, .85), transparent 70%),
    linear-gradient(180deg, rgba(255, 170, 66, .55), rgba(148, 74, 10, .5));
}
.win-hero-window::after {
  content: ""; position: absolute; left: 6px; right: 6px; bottom: 6px; height: 14px;
  border-radius: 2px;
  background: rgba(70, 36, 6, .5);
}
.win-hero-window-1 { left: 9%; }
.win-hero-window-2 { left: 38%; }
.win-hero-window-3 { right: 9%; }

/* 街灯：立柱 + 暖光灯泡 + 光晕 */
.win-hero-lamp {
  position: absolute; bottom: 24px;
  width: 7px; height: 150px;
  border-radius: 4px;
  background: linear-gradient(180deg, #333a56, #1a2038);
}
.win-hero-lamp::before {
  content: ""; position: absolute; top: -12px; left: 50%; transform: translateX(-50%);
  width: 26px; height: 9px; border-radius: 9px;
  background: linear-gradient(90deg, #fbbf24, #f59e0b);
}
.win-hero-lamp::after {
  content: ""; position: absolute; top: -64px; left: 50%; transform: translateX(-50%);
  width: 96px; height: 96px; border-radius: 50%;
  background: radial-gradient(circle, rgba(245, 158, 11, .4), transparent 66%);
  animation: win-lamp-breathe 4.2s ease-in-out infinite;
}
.win-hero-lamp-l { left: 4%; }
.win-hero-lamp-r { right: 4%; }
@keyframes win-lamp-breathe {
  0%, 100% { opacity: .75; }
  50% { opacity: 1; }
}

/* 街角小字：风铃还在响 */
.win-hero-note {
  position: absolute; left: 26px; bottom: 18px;
  font-size: 11.5px; letter-spacing: 2px;
  color: rgba(255, 224, 172, .8);
}

/* kicker 徽章 */
.win-hero-kicker {
  display: inline-block; margin-bottom: 16px; padding: 6px 16px;
  border: 1px solid rgba(245, 158, 11, .5); border-radius: 999px;
  font-size: 12px; font-weight: 700; letter-spacing: 2px;
  color: #ffd9a1;
  background: rgba(20, 14, 8, .4);
  backdrop-filter: blur(6px);
}

/* 大号衬线标题 */
.win-hero-title {
  margin: 0 0 14px;
  font-family: var(--font-serif);
  font-size: 42px; line-height: 1.22; letter-spacing: 3px;
  color: #ffe9c4;
}

/* 沉浸文案 */
.win-hero-note-copy {
  margin: 0; max-width: 660px;
  font-size: 15px; line-height: 2;
  color: #d9c9ac;
}
.win-hero-note-copy b { color: #ffd9a1; }

/* 统计保留：在售件数 / 分类数 / 承诺 */
.win-hero-stats { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.win-hero-stats span {
  display: inline-flex; align-items: baseline; gap: 6px;
  padding: 7px 16px; border-radius: 999px;
  font-size: 13px; color: #e7d5b4;
  background: rgba(24, 18, 12, .45);
  border: 1px solid rgba(245, 158, 11, .35);
  backdrop-filter: blur(6px);
}
.win-hero-stats b { font-size: 17px; color: #fbbf24; font-family: var(--mono); }

/* 右下角脉动徽章：🛍 营业中 */
.win-open-badge {
  position: absolute; right: 26px; bottom: 20px; z-index: 2;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 16px; border-radius: 999px;
  font-size: 12px; font-weight: 700; letter-spacing: 1px;
  color: #3f2406;
  background: linear-gradient(140deg, #fcd34d, #f59e0b 72%);
  animation: win-open-pulse 2.6s ease-in-out infinite;
}
@keyframes win-open-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.06); }
}

/* —— 上架发布框 / 按钮：暖琥珀玻璃（覆盖原蓝色） —— */
.win-post {
  background: rgba(255, 252, 244, .85);
  border: 1px solid rgba(217, 119, 6, .32);
  backdrop-filter: saturate(170%) blur(14px);
}
.win-post-title { color: #6b3f10; }
.win-post input[type="text"], .win-post input[type="number"], .win-post select, .win-post textarea {
  border-color: rgba(217, 119, 6, .35);
  background: rgba(255, 255, 255, .95);
}
.win-post input:focus, .win-post select:focus, .win-post textarea:focus { border-color: #d97706; }
.win-post-hint b { color: #b45309; }
.win-post-login { border-color: rgba(217, 119, 6, .5); }
.win-btn-primary {
  background: linear-gradient(140deg, #fbbf24, #d97706 66%);
}
.win-btn-ghost {
  background: rgba(255, 252, 244, .9); color: #b45309;
  border: 1px solid rgba(217, 119, 6, .45);
}
.win-btn-ghost:hover { border-color: #d97706; color: #d97706; }

/* —— 分类货架筛选：暖琥珀药丸（覆盖原蓝色） —— */
.win-cat {
  background: rgba(255, 252, 244, .92);
  border: 1px solid rgba(217, 119, 6, .3);
  color: #8a6d45;
}
.win-cat:hover { border-color: #d97706; color: #d97706; }
.win-cat.on {
  background: linear-gradient(140deg, #fbbf24, #d97706);
  border-color: #d97706; color: #fff;
}

/* —— 橱窗展柜商品卡：玻璃橱窗框 + 顶部灯带 + 台面 —— */
.win-showcase { gap: 22px; }
.win-item {
  position: relative;
  background: linear-gradient(175deg, #32230f, #241a0e 62%, #1c1409);
  border: 1px solid rgba(217, 119, 6, .55);
  border-radius: 14px;
  overflow: hidden;
}
.win-item:hover {
  transform: translateY(-5px); border-color: #f59e0b;
}
/* 顶部灯带：挂在橱窗上沿 */
.win-item-light {
  position: absolute; top: 0; left: 0; right: 0; height: 4px; z-index: 3;
  background: linear-gradient(90deg, rgba(245, 158, 11, 0), rgba(252, 211, 77, .95) 18%, rgba(245, 158, 11, .95) 50%, rgba(252, 211, 77, .95) 82%, rgba(245, 158, 11, 0));
}
/* 橱窗内部：暖光从店里泄出来 */
.win-item-cover {
  height: 186px;
  background:
    radial-gradient(120px 70px at 50% 58%, rgba(255, 228, 179, .9), transparent 72%),
    radial-gradient(2px 2px at 20% 30%, rgba(255, 214, 145, .5), transparent 65%),
    radial-gradient(2px 2px at 78% 26%, rgba(255, 214, 145, .45), transparent 65%),
    linear-gradient(180deg, rgba(255, 182, 84, .5), rgba(158, 82, 12, .55) 58%, rgba(92, 44, 6, .78));
}
/* 玻璃反光 */
.win-item-cover::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(115deg, rgba(255, 255, 255, .3) 0%, rgba(255, 255, 255, .05) 24%, transparent 36%);
}
/* 展台台面：展品立在台子上 */
.win-item-cover::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 24px; z-index: 1;
  background: linear-gradient(180deg, rgba(255, 214, 145, .4), rgba(217, 119, 6, .3));
  border-top: 1px solid rgba(245, 158, 11, .5);
}
.win-item-char {
  position: relative; z-index: 2;
  color: #ffedcc;
  transform: translateY(-4px);
}
.win-item-cat {
  z-index: 2;
  background: rgba(24, 15, 6, .55); color: #ffd9a1;
  border: 1px solid rgba(245, 158, 11, .45);
  backdrop-filter: blur(4px);
}
.win-tag-price { z-index: 2; }
/* 灯牌信息区：橱窗下的价目签 */
.win-item-body {
  background: linear-gradient(180deg, #fff9ec, #fdf1d8);
  border-top: 1px solid rgba(217, 119, 6, .4);
}
.win-item-title { color: #5c2d12; }
.win-item-stock .shop-badge { margin-left: auto; }

/* —— 响应式：夜色街景小屏收敛 —— */
@media (max-width: 820px) {
  .win-hero-window-2 { display: none; }
}
@media (max-width: 720px) {
  .win-hero { padding: 32px 20px 34px; }
  .win-hero-title { font-size: 30px; }
  .win-hero-strip { bottom: 96px; }
  .win-hero-window { width: 108px; height: 66px; bottom: 22px; }
  .win-hero-lamp { height: 118px; }
  .win-hero-note { display: none; }
}
@media (max-width: 560px) {
  .win-hero-window-1, .win-hero-window-3 { display: none; }
  .win-open-badge { right: 16px; bottom: 16px; padding: 5px 12px; font-size: 11px; }
  .win-hero-stats span { padding: 6px 12px; font-size: 12px; }
  .win-showcase { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .win-storefront { padding: 26px 20px 24px; }
  .win-store-title { font-size: 30px; }
  .win-post-row { flex-direction: column; }
  .win-item-cover { height: 150px; }
}

/* ============================================================
   招聘 · 招贤布告栏（bill-*）
   设计：布告板 / 启事纸 / 清新蓝液态玻璃 #2f6fed
   ============================================================ */
/* —— 布告栏 hero：「招」字招牌 —— */
.bill-hero {
  position: relative;
  margin: 0 0 26px;
  padding: 34px 30px 30px;
  border-radius: 18px;
  color: var(--ink);
  background:
    radial-gradient(560px 200px at 88% -20%, rgba(79, 155, 255, .28), transparent 60%),
    radial-gradient(420px 180px at -8% 110%, rgba(47, 111, 237, .18), transparent 55%),
    linear-gradient(135deg, #eef4ff 0%, #e2ecfe 100%);
  border: 1px solid rgba(199, 220, 252, .85);
}
/* 布告板图钉装饰 */
.bill-hero::before,
.bill-hero::after {
  content: "";
  position: absolute;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #eef4ff, #b9cff5 60%, #5a76ab);
}
.bill-hero::before { top: 12px; left: 18px; }
.bill-hero::after { top: 12px; right: 18px; }
.bill-hero-inner { display: flex; align-items: center; gap: 26px; }
/* 「招」字招牌（印章） */
.bill-seal {
  flex-shrink: 0;
  width: 96px; height: 96px;
  display: grid; place-items: center;
  font-family: var(--font-serif);
  font-size: 58px; font-weight: 900; line-height: 1;
  color: #fff;
  background: linear-gradient(145deg, #4f9bff, #2f6fed 60%, #1d4fc0);
  border-radius: 16px;
  border: 3px solid rgba(255, 255, 255, .85);
  transform: rotate(-4deg);
  user-select: none;
}
.bill-hero-text { flex: 1; min-width: 0; }
.bill-kicker {
  display: inline-block;
  font-size: 12.5px; letter-spacing: .14em;
  color: #1d4fc0;
  background: rgba(255, 255, 255, .6);
  border: 1px solid rgba(199, 220, 252, .9);
  border-radius: 999px;
  padding: 3px 12px;
  margin-bottom: 10px;
}
.bill-hero-title {
  margin: 0 0 8px;
  font-size: 30px; line-height: 1.25;
  color: var(--ink);
  font-family: var(--font-serif);
}
.bill-hero-note { margin: 0 0 16px; font-size: 14.5px; color: var(--muted); max-width: 640px; }
.bill-hero-note b { color: #2f6fed; }
.bill-stats { display: flex; gap: 10px; flex-wrap: wrap; }
.bill-stat {
  background: rgba(255, 255, 255, .65);
  border: 1px solid rgba(199, 220, 252, .9);
  border-radius: 999px;
  padding: 4px 14px;
  font-size: 13px; color: var(--ink-soft);
}
.bill-stat b { color: #2f6fed; font-size: 15px; margin-right: 3px; }

/* —— 登录态发布框：贴一张招贤启事 —— */
.bill-post {
  margin: 0 0 26px;
  padding: 20px 22px;
  background: linear-gradient(160deg, #ffffff, #f0fdfa);
  border: 1px solid #99f6e4;
  border-left: 4px solid #0d9488;
  border-radius: 14px;
}
.bill-post-title { margin: 0 0 14px; font-size: 16px; font-weight: 700; color: #134e4a; }

/* ============================================================
   召回底座（v0.6.0）：登录区 / 关注 / 收藏 / 消息中心 / 用户主页
   风格约定：扁平 + 液态玻璃，无阴影
   ============================================================ */

/* —— 顶部登录区 —— */
.hdr-bell { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: var(--r-pill, 999px); border: 1px solid var(--line); background: rgba(255, 255, 255, .55); color: var(--ink-soft); text-decoration: none; }
.hdr-bell:hover { border-color: var(--brand-line); background: var(--brand-soft); }
.hdr-bell-ico { font-size: 15px; line-height: 1; }
.hdr-dot { position: absolute; top: -4px; right: -4px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; background: #e5484d; color: #fff; font-size: 10px; font-style: normal; font-weight: 700; line-height: 16px; text-align: center; }
.hdr-dot-inline { margin-left: 6px; padding: 0 6px; border-radius: 999px; background: #e5484d; color: #fff; font-size: 10px; font-style: normal; font-weight: 700; }
.hdr-me .nav-dd-btn { display: inline-flex; align-items: center; gap: 7px; }
.hdr-avatar { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 999px; background: linear-gradient(140deg, var(--brand-soft), #dbe9ff); border: 1px solid var(--brand-line); color: var(--brand-strong); font-size: 12px; font-weight: 700; }
.hdr-name { max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hdr-me .nav-dd-menu { left: auto; right: 0; min-width: 168px; }

/* —— 通用动作小表单 / 按钮选中态 —— */
.act-form { display: inline-block; margin: 0; }
.act-form .btn { white-space: nowrap; }
.btn.is-on { border-color: var(--brand-line); background: var(--brand-soft); color: var(--brand-strong); }

/* —— 页头 —— */
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin: 6px 0 18px; }
.page-title { margin: 0; font-family: var(--font-serif); font-size: 24px; color: var(--ink); }
.page-desc { margin: 6px 0 0; max-width: 62ch; font-size: 13.5px; line-height: 1.9; color: var(--muted); }
/* 标题与说明上下排（搜索这类页面说明较长，横排会被甩到右边去） */
.page-head-stack { display: block; }

/* —— 全站搜索 · 搜索框 ——
   此前这里直接借用了顶栏的 .search-box（宽 190px 的胶囊），
   放到正文里又窄又被顶栏样式带偏；这里给它一套独立的、正文尺度的样式。 */
.page-search { display: flex; align-items: stretch; gap: 10px; max-width: 680px; margin: 0 0 22px; }
.page-search-field { position: relative; display: flex; align-items: center; flex: 1 1 auto; min-width: 0; }
.page-search-field .page-search-ico { position: absolute; left: 16px; display: inline-flex; font-size: 15px; line-height: 1; opacity: .72; pointer-events: none; }
.page-search-field input {
  width: 100%; height: var(--btn-h); padding: 0 18px 0 44px;
  border: 1px solid var(--line); border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .9); font-size: 15px; color: var(--ink); outline: none;
  transition: border .18s, background .18s;
}
.page-search-field input:focus { border-color: var(--brand-line); background: #fff; }
/* 搜索按钮的高度与内边距交给 .btn 基座（--btn-h / --btn-px），
   这里只保留「不压缩、窄屏占满一行」的排布，尺寸不自立一套 */
.page-search-btn { flex: none; }
@media (max-width: 560px) {
  .page-search { flex-wrap: wrap; }
  .page-search-btn { width: 100%; }
}

/* —— 全站搜索 · 结果分组 —— */
.search-count {
  flex: none; padding: 1px 9px; border: 1px solid var(--line); border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .6); color: var(--muted); font-size: 12px; line-height: 1.9;
}
.search-hit { display: block; padding: 11px 12px; margin: 0 -12px; border-top: 1px dashed var(--line); border-radius: var(--r-sm); text-decoration: none; transition: background .16s; }
.search-hit:first-of-type { border-top: 0; }
.search-hit:hover { background: rgba(233, 241, 254, .62); }
.search-hit-title { font-size: 15px; color: var(--ink); }
.search-hit:hover .search-hit-title { color: var(--brand-strong); }
.search-hit-sum { margin-top: 3px; font-size: 13px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-hit-meta { display: flex; gap: 14px; margin-top: 4px; font-size: 12px; color: var(--muted); }

.search-groups { display: flex; flex-direction: column; gap: 18px; }
.search-group { padding: 18px 22px; }
.search-group-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.search-group-title { margin: 0; font-size: 16px; }
.search-group-title a { color: var(--ink); text-decoration: none; }
.search-group-title a:hover { color: var(--brand-strong); }
.search-group-list { display: flex; flex-direction: column; }

.search-empty { padding: 60px 0; text-align: center; color: var(--muted); font-size: 14px; }
.search-empty-ico { margin-bottom: 10px; font-size: 40px; opacity: .8; }

/* —— 用户主页 —— */
.profile-hero { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 22px 24px; border: 1px solid var(--line); border-radius: var(--r-lg, 18px); background: linear-gradient(150deg, rgba(255, 255, 255, .8), rgba(233, 241, 254, .55)); }
.profile-avatar { display: flex; align-items: center; justify-content: center; width: 62px; height: 62px; border-radius: 999px; background: linear-gradient(140deg, #e9f1fe, #d6e6ff); border: 1px solid var(--brand-line); color: var(--brand-strong); font-size: 24px; font-weight: 700; font-family: var(--font-serif); }
.profile-id { flex: 1 1 220px; min-width: 180px; }
.profile-name { margin: 0; font-family: var(--font-serif); font-size: 23px; color: var(--ink); }
.profile-handle { margin: 6px 0 0; font-size: 13px; color: var(--muted); }
.profile-sep { margin: 0 6px; }
.profile-badge { margin-left: 8px; padding: 1px 9px; border-radius: 999px; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand-strong); font-size: 11px; }
.profile-acts { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.stat-strip { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0 18px; }
.stat-cell { flex: 1 1 110px; min-width: 96px; padding: 12px 16px; border: 1px solid var(--line); border-radius: var(--r-md, 14px); background: rgba(255, 255, 255, .62); }
.stat-num { display: block; font-size: 20px; font-weight: 700; color: var(--ink); line-height: 1.3; }
.stat-lbl { display: block; margin-top: 2px; font-size: 12.5px; color: var(--muted); }

.sub-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.sub-tab { padding: 6px 14px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255, 255, 255, .55); color: var(--ink-soft); font-size: 13px; text-decoration: none; white-space: nowrap; }
.sub-tab:hover { border-color: var(--brand-line); color: var(--brand-strong); }
.sub-tab.active { border-color: var(--brand-line); background: var(--brand-soft); color: var(--brand-strong); font-weight: 600; }

.panel-box { padding: 18px 20px; border: 1px solid var(--line); border-radius: var(--r-lg, 18px); background: rgba(255, 255, 255, .62); }

/* —— 内容流 —— */
.feed-list { display: flex; flex-direction: column; gap: 12px; }
.feed-item { padding: 16px 18px; border: 1px solid var(--line); border-radius: var(--r-md, 14px); background: rgba(255, 255, 255, .64); transition: border-color .18s, background .18s; }
.feed-item:hover { border-color: var(--brand-line); background: rgba(255, 255, 255, .82); }
.feed-meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 12.5px; color: var(--muted); }
.feed-label { padding: 1px 9px; border-radius: 999px; background: var(--brand-soft); border: 1px solid var(--brand-line); color: var(--brand-strong); font-size: 11.5px; }
.feed-title { margin: 8px 0 0; font-size: 17px; line-height: 1.6; }
.feed-title a { color: var(--ink); text-decoration: none; }
.feed-title a:hover { color: var(--brand-strong); }
.feed-excerpt { margin: 6px 0 0; font-size: 13.5px; line-height: 1.9; color: var(--ink-soft); }
.feed-likes { display: inline-block; margin-top: 8px; font-size: 12.5px; color: #e11d48; }

/* —— 关注列表 —— */
.follow-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.follow-item { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-sm, 10px); background: rgba(255, 255, 255, .6); }
.follow-type { flex: 0 0 auto; padding: 1px 9px; border-radius: 999px; background: var(--bg-soft); color: var(--ink-soft); font-size: 11.5px; }
.follow-title { flex: 1 1 200px; min-width: 140px; color: var(--ink); font-size: 14.5px; text-decoration: none; }
.follow-title:hover { color: var(--brand-strong); }
.follow-time { font-size: 12.5px; color: var(--muted); }

/* —— 我的收藏 —— */
.fav-list { display: flex; flex-direction: column; gap: 10px; }
.fav-item { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r-md, 14px); background: rgba(255, 255, 255, .62); }
.fav-body { flex: 1 1 240px; min-width: 180px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.fav-type { padding: 1px 9px; border-radius: 999px; background: var(--bg-soft); color: var(--ink-soft); font-size: 11.5px; }
.fav-title { color: var(--ink); font-size: 15px; text-decoration: none; }
.fav-title:hover { color: var(--brand-strong); }
.fav-time { font-size: 12.5px; color: var(--muted); }

/* —— 消息中心 —— */
.msg-list { display: flex; flex-direction: column; gap: 10px; }
.msg-item { display: flex; align-items: flex-start; gap: 12px; flex-wrap: wrap; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r-md, 14px); background: rgba(255, 255, 255, .58); }
.msg-item.unread { border-color: var(--brand-line); background: linear-gradient(120deg, rgba(233, 241, 254, .75), rgba(255, 255, 255, .6)); }
.msg-kind { flex: 0 0 auto; padding: 2px 10px; border-radius: 999px; font-size: 11.5px; border: 1px solid var(--line); background: var(--bg-soft); color: var(--ink-soft); }
.msg-k-system { background: #eef2ff; border-color: #dbe4ff; color: #3b4cca; }
.msg-k-mention { background: #fff7e6; border-color: #ffe0a3; color: #b45309; }
.msg-k-reply { background: #e9f1fe; border-color: var(--brand-line); color: var(--brand-strong); }
.msg-k-like { background: #ffe9ef; border-color: #ffc9d8; color: #be123c; }
.msg-k-follow { background: #e8f8f1; border-color: #b7ecd6; color: #0f7a52; }
.msg-body { flex: 1 1 260px; min-width: 200px; }
.msg-title { display: block; color: var(--ink); font-size: 14.5px; font-weight: 600; text-decoration: none; }
.msg-title:hover { color: var(--brand-strong); }
.msg-text { margin: 5px 0 0; font-size: 13px; line-height: 1.85; color: var(--ink-soft); }
.msg-time { display: block; margin-top: 6px; font-size: 12px; color: var(--muted); }

@media (max-width: 640px) {
  .profile-hero { padding: 18px; }
  .hdr-me .nav-dd-btn { padding: 6px 8px; }
  .hdr-me .nav-dd-menu { right: -8px; }
}

/* ============================================================
   折叠屏友好（iPhone Duo 等双屏 / 折叠设备）
   真机两种状态：闭合 ≈466 × 678pt（比常规手机更宽、更矮）、展开 ≈890 × 626pt（够宽但很矮）。
   策略：不去询问浏览器折痕在哪，只保证任何宽度与宽高比都活得下来；
        真正能感知分段的浏览器（Chromium 系）再用 Viewport Segments 做渐进增强，Safari 走兜底。
   ============================================================ */
/* 1) 动态视口：展开态只有 626pt 高，100vh 会把内容顶到工具栏后面；不支持 dvh 的浏览器自动沿用上面的 100vh */
body { min-height: 100dvh; }
.doc-toc { max-height: calc(100dvh - 108px); }

/* 2) 闭合态更窄更方：所有「一行排开」的地方就地换行，避免横向溢出（466pt 正好压在常见手机断点边缘） */
@media (max-width: 520px) {
  .app-acts { flex-wrap: wrap; row-gap: 8px; }
  .doc-toc li { white-space: normal; }
  .footer-links { flex-wrap: wrap; row-gap: 6px; }
}

/* 3) 展开态够宽但矮：短屏上取消长粘性，别让侧栏把正文挤得看不见 */
@media (min-width: 861px) and (max-height: 720px) {
  .sidebar, .doc-toc, .doc-semver, .shelf-side, .shelf-temp,
  .echo-left, .echo-right, .job-filter, .job-wall {
    position: static;
    max-height: none;
  }
  .shop-after-sales { top: 56px; }
}

/* 4) 渐进增强：能感知分段的设备把内容让开折痕，绝不让文字骑在缝上 */
@media (horizontal-viewport-segments: 2) {
  .wrap, .layout, .layout-single { max-width: env(viewport-segment-width 0 0); }
  .doc-wrap { column-gap: calc(24px + (env(viewport-segment-left 1 0) - env(viewport-segment-right 0 0))); }
}
.bill-post form { display: flex; flex-direction: column; gap: 10px; }
.bill-post-row { display: flex; gap: 10px; }
.bill-post input[type="text"], .bill-post select, .bill-post textarea {
  width: 100%;
  border: 1px solid #c7e6df;
  border-radius: 9px;
  padding: 10px 14px;
  font-size: 14px;
  background: #fff;
  color: var(--ink);
  transition: border-color .18s;
}
.bill-post input[type="text"]:focus, .bill-post select:focus, .bill-post textarea:focus {
  outline: none;
  border-color: #0d9488;
}
.bill-post textarea { resize: vertical; min-height: 110px; line-height: 1.7; }
.bill-post-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.bill-post-hint { font-size: 12.5px; color: var(--muted); }
.bill-post-hint b { color: #0d9488; }
.bill-post-err {
  background: #fdeaea; color: #c0392b; border: 1px solid #f5c6c6; border-radius: 10px;
  padding: 9px 14px; margin-bottom: 14px; font-size: 13.5px;
}
.bill-post-login {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  background: #f0fdfa; border: 1px dashed #5eead4; border-radius: 10px;
  padding: 14px 16px; font-size: 13.5px; color: var(--ink-soft);
}

/* —— 布告筛选标签：部门 / 城市 / 类型 —— */
.bill-tagrow {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin: 0 0 12px;
}
.bill-tagrow-label {
  font-size: 12.5px; color: var(--muted); letter-spacing: .05em;
  flex-shrink: 0; margin-right: 2px;
}
.bill-tag {
  position: relative;
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; color: #0f766e;
  background: #ffffff;
  border: 1px dashed #5eead4;
  border-radius: 999px;
  padding: 4px 13px;
  transition: all .18s;
}
.bill-tag em {
  font-style: normal; font-size: 11.5px;
  background: #ccfbf1; color: #0f766e;
  border-radius: 999px; padding: 0 7px; line-height: 1.6;
}
.bill-tag:hover { border-style: solid; border-color: #0d9488; color: #115e59; background: #f0fdfa; }
.bill-tag.on {
  background: #0d9488; color: #fff; border-style: solid; border-color: #0d9488;
}
.bill-tag.on em { background: rgba(255, 255, 255, .22); color: #fff; }
.bill-tag-clear { color: var(--muted); border-color: var(--line); border-style: solid; }
.bill-tag-clear:hover { color: var(--danger); border-color: var(--danger); background: #fff; }

/* —— 两栏：启事卡片 + 企业墙 —— */
.bill-cols {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 290px;
  gap: 24px;
  align-items: start;
  margin-top: 18px;
}
.bill-main { min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.bill-card {
  position: relative;
  background: linear-gradient(180deg, #fffef9, #fffdf5);
  border: 1px solid #f0e7d0;
  border-radius: 14px;
  padding: 20px 22px 16px;
  transition: transform .2s;
}
.bill-card:hover { transform: translateY(-2px); }
/* 启事纸图钉 */
.bill-card::before {
  content: "";
  position: absolute;
  top: -7px; right: 26px;
  width: 16px; height: 16px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fef3c7, #f59e0b 70%, #b45309);
}
.bill-card-top {
  display: flex; align-items: center; gap: 9px; flex-wrap: wrap;
  margin-bottom: 8px;
}
.bill-light {
  width: 9px; height: 9px; border-radius: 50%;
  background: #16a34a;
}
.bill-light.paused { background: #d97706; }
.bill-light.filled { background: #e5484d; }
.bill-status {
  font-size: 12px; font-weight: 600; color: #15803d;
  background: #dcfce7; border-radius: 999px; padding: 2px 10px;
}
.bill-status.paused { color: #b45309; background: #fef3c7; }
.bill-status.filled { color: #be123c; background: #ffe4e6; }
.bill-fresh {
  font-size: 12px; color: var(--muted);
  background: #f4f6fa; border-radius: 999px; padding: 2px 10px;
}
.bill-fresh.new { color: #0f766e; background: #ccfbf1; }
.bill-card-title { margin: 0 0 8px; font-size: 19px; line-height: 1.4; font-family: var(--font-serif); }
.bill-card-title a { color: var(--ink); }
.bill-card-title a:hover { color: #0d9488; }
.bill-card-meta { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.bill-chip {
  font-size: 12.5px; color: var(--ink-soft);
  background: #f4f6fa; border: 1px solid var(--hairline); border-radius: 8px;
  padding: 2px 10px;
}
.bill-salary {
  display: inline-block;
  font-size: 15.5px; font-weight: 700; color: #0f766e;
  background: linear-gradient(90deg, #ccfbf1, #f0fdfa);
  border: 1px solid #99f6e4;
  border-radius: 10px;
  padding: 3px 12px;
  margin-bottom: 10px;
}
.bill-summary { margin: 0 0 12px; font-size: 14px; color: var(--ink-soft); line-height: 1.75; }
.bill-card-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  border-top: 1px dashed #eadfc4; padding-top: 10px;
}
.bill-date { font-size: 12.5px; color: var(--muted); }
.bill-more { font-size: 13px; font-weight: 600; color: #0d9488; }
.bill-card:hover .bill-more { color: #115e59; }
.bill-empty {
  background: #fff; border: 1px dashed var(--line); border-radius: 14px;
  padding: 34px 20px; text-align: center; color: var(--muted);
}
.bill-empty h3 { margin: 0 0 6px; font-size: 16px; color: var(--ink-soft); }

/* —— 右栏：在招企业墙 —— */
.bill-wall-panel {
  background: linear-gradient(180deg, #ffffff, #f6fdfb);
  border: 1px solid #c7e6df;
  border-radius: 14px;
  padding: 18px 16px;
  position: sticky; top: 84px;
}
.bill-wall-title { margin: 0 0 6px; font-size: 15.5px; font-weight: 700; color: #134e4a; }
.bill-wall-note { margin: 0 0 12px; font-size: 12.5px; color: var(--muted); }
.bill-wall-row {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 11px 2px; border-bottom: 1px dashed #d9f3ec;
  color: var(--ink);
}
.bill-wall-row:last-of-type { border-bottom: none; }
.bill-wall-info { min-width: 0; }
.bill-wall-info strong { display: block; font-size: 14px; color: var(--ink); }
.bill-wall-info small {
  display: block;
  font-size: 12px; color: var(--muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.bill-wall-row:hover .bill-wall-info strong { color: #0d9488; }
.bill-wall-count {
  flex-shrink: 0;
  font-size: 11.5px; color: #0f766e;
  background: #ccfbf1; border-radius: 999px; padding: 2px 9px;
}

/* —— 响应式 —— */
@media (max-width: 960px) {
  .bill-cols { grid-template-columns: 1fr; }
  .bill-wall-panel { position: static; }
}
@media (max-width: 620px) {
  .bill-hero { padding: 26px 18px 22px; }
  .bill-hero-inner { flex-direction: column; text-align: center; gap: 14px; }
  .bill-seal { width: 74px; height: 74px; font-size: 44px; }
  .bill-hero-title { font-size: 23px; }
  .bill-hero-note { margin-inline: auto; }
  .bill-stats { justify-content: center; }
  .bill-post-row { flex-direction: column; }
  .bill-post-foot { align-items: stretch; text-align: center; }
  .bill-card-title { font-size: 17px; }
  .bill-tagrow { gap: 6px; }
}

/* ============================================================
   招聘 · 街角布告栏场景升级（bill-* 追加 · 青绿主题）
   软木布告板 hero + 斜贴启事纸 + 图钉 + 纸感启事卡片 + 便签筛选
   ============================================================ */

/* —— 场景 hero：软木布告板 —— */
.bill-hero {
  overflow: hidden;
  background:
    radial-gradient(620px 260px at 88% -12%, rgba(13, 148, 136, .16), transparent 60%),
    radial-gradient(520px 240px at -6% 116%, rgba(15, 118, 110, .14), transparent 55%),
    radial-gradient(rgba(146, 112, 63, .26) 1.3px, transparent 1.5px),
    radial-gradient(rgba(146, 112, 63, .16) 1.3px, transparent 1.5px),
    linear-gradient(152deg, #f6ecd6 0%, #ecdcbc 55%, #f2e4c8 100%);
  background-size: auto, auto, 22px 22px, 22px 22px, 100% 100%;
  background-position: 0 0, 0 0, 0 0, 11px 11px, 0 0;
  border: 1px solid #d9c49a;
}
.bill-hero-inner { position: relative; z-index: 1; }
.bill-hero-text { max-width: 62%; }
.bill-hero-title { color: #134e4a; font-size: 36px; }
.bill-hero-note { color: #6b5d4a; }
.bill-hero-note b { color: #0d9488; }
.bill-kicker { color: #0f766e; background: rgba(255, 255, 255, .74); border: 1px solid rgba(13, 148, 136, .35); }
.bill-stat { background: rgba(255, 255, 255, .74); border: 1px solid rgba(13, 148, 136, .3); color: #6b5d4a; }
.bill-stat b { color: #0d9488; }
.bill-seal {
  background: linear-gradient(145deg, #14b8a6, #0d9488 60%, #0f766e);
  border: 3px solid rgba(255, 255, 255, .9);
}

/* 装饰层：斜贴的启事纸（带头条） */
.bill-board { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.bill-board-paper {
  position: absolute;
  display: flex; flex-direction: column; gap: 4px;
  padding: 12px 16px;
  background: linear-gradient(160deg, #fffef8, #fdf6e6);
  border: 1px solid #e6d9b8;
  border-radius: 3px;
}
.bill-board-paper--a { top: 24px; right: 30px; transform: rotate(5deg); }
.bill-board-paper--b { top: 118px; right: 46px; transform: rotate(-4deg); }
.bill-paper-headline {
  font-size: 13px; font-weight: 800;
  font-family: var(--font-serif); letter-spacing: .04em;
  color: #134e4a;
}
.bill-paper-sub { font-size: 11px; letter-spacing: .02em; color: #0f766e; }

/* 图钉：CSS 圆点 + 阴影 */
.bill-pin {
  position: absolute;
  width: 16px; height: 16px;
  border-radius: 50%;
  background: radial-gradient(circle at 32% 28%, #ffe9b0, #f59e0b 62%, #b45309);
}
.bill-board-paper .bill-pin { top: -9px; left: 50%; margin-left: -8px; }
.bill-pin--loose { top: 34px; right: 40px; }

/* 右下角脉动徽章 */
.bill-pulse {
  position: absolute; right: 22px; bottom: 18px; z-index: 2;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 999px;
  font-size: 12px; letter-spacing: .06em; font-weight: 600;
  color: #0f766e;
  background: rgba(255, 255, 255, .9);
  border: 1px solid rgba(13, 148, 136, .4);
  animation: bill-pulse 2.4s ease-in-out infinite;
}
@keyframes bill-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.07); }
}

/* —— 发布框融入场景：暖纸感 + 青绿左条 —— */
.bill-post {
  background: linear-gradient(160deg, #fffef9, #f6ecd6);
  border: 1px solid #e6d9b8;
  border-left: 4px solid #0d9488;
}

/* —— 便签标签（筛选） —— */
.bill-tagrow-label { color: #6b5d4a; }
.bill-tag {
  background: #fffdf4;
  border: 1px solid #e6d9b8;
  border-radius: 4px;
  transform: rotate(-1.2deg);
  transition: transform .16s, background .16s, color .16s, border-color .16s;
}
.bill-tag:nth-of-type(even) { transform: rotate(1deg); }
.bill-tag:hover {
  transform: rotate(0deg) scale(1.03);
  border-color: #0d9488; color: #115e59; background: #f0fdfa;
}
.bill-tag.on {
  background: #0d9488; color: #fff;
  border-color: #0d9488; transform: rotate(0deg);
}

/* —— 中栏：软木板 + 纸感启事卡片 —— */
.bill-main {
  background:
    radial-gradient(rgba(146, 112, 63, .2) 1.3px, transparent 1.5px),
    radial-gradient(rgba(146, 112, 63, .13) 1.3px, transparent 1.5px),
    linear-gradient(152deg, #f1e5cb, #e9d7b4);
  background-size: 22px 22px, 22px 22px, 100% 100%;
  background-position: 0 0, 11px 11px, 0 0;
  border: 1px solid #d9c49a;
  border-radius: 16px;
  padding: 24px 20px 28px;
}
.bill-card {
  background: linear-gradient(165deg, #fffef9, #fdf6e7);
  border: 1px solid #e8dcc0;
  border-radius: 4px;
  transform: rotate(-.4deg);
}
.bill-card:nth-child(even) { transform: rotate(.5deg); }
.bill-card:hover {
  transform: rotate(0deg) translateY(-3px);
}
/* 启事纸右上角图钉强化 */
.bill-card::before {
  width: 18px; height: 18px;
  background: radial-gradient(circle at 32% 28%, #fff3cf, #f59e0b 64%, #b45309);
}
.bill-empty { background: #fffdf4; border: 1px dashed #d9c49a; border-radius: 6px; }

/* —— 福利 chips —— */
.bill-perks { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.bill-perk {
  font-size: 11.5px; color: #0f766e;
  background: #f0fdfa; border: 1px solid #99f6e4;
  border-radius: 999px; padding: 2px 9px;
}

/* —— 右栏企业墙：纸感面板 —— */
.bill-wall-panel {
  background: linear-gradient(180deg, #fffef9, #f7f0de);
  border: 1px solid #e2d3ae;
}

/* —— 响应式：小屏收起装饰 —— */
@media (max-width: 1100px) {
  .bill-board-paper--b { display: none; }
  .bill-hero-text { max-width: 72%; }
}
@media (max-width: 860px) {
  .bill-board { display: none; }
  .bill-pulse { display: none; }
  .bill-hero-text { max-width: 100%; }
}
@media (max-width: 620px) {
  .bill-main { padding: 18px 12px 22px; }
  .bill-card { padding: 18px 16px 14px; }
  .bill-hero { padding: 26px 18px 22px; }
  .bill-hero-title { font-size: 23px; }
}

/* ============================================================
   论坛「共鸣板」· 声浪场场景升级（.thm-forum 作用域）
   把普通三栏论坛升级为「声浪装置」：波形 hero + 音轨式帖子 + 音量计
   ============================================================ */

/* —— 场景 hero：声浪在脚下涌动 —— */
.thm-forum .echo-hero {
  position: relative; overflow: hidden;
  margin: 0 0 26px; padding: 40px 34px 34px;
  border-radius: 18px;
  border: 1px solid rgba(196, 181, 253, .55);
  background:
    radial-gradient(1100px 420px at 82% -10%, rgba(124, 58, 237, .16), transparent 58%),
    radial-gradient(760px 360px at 4% 118%, rgba(139, 92, 246, .12), transparent 55%),
    linear-gradient(158deg, #f4f1ff 0%, #ede9fe 55%, #faf8ff 100%);
}
.thm-forum .echo-hero-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.thm-forum .echo-wave-bg { position: absolute; left: 0; right: 0; bottom: -6px; width: 100%; height: 130px; opacity: .55; }
.thm-forum .echo-wave-bg .w1 { fill: rgba(124, 58, 237, .10); }
.thm-forum .echo-wave-bg .w2 { fill: rgba(124, 58, 237, .16); }
.thm-forum .echo-wave-bg .w3 { fill: rgba(139, 92, 246, .10); }
.thm-forum .echo-hero > *:not(.echo-hero-bg) { position: relative; z-index: 1; }
.thm-forum .echo-hero .ph-kicker {
  display: inline-block; margin-bottom: 14px; padding: 5px 14px;
  border: 1px solid rgba(124, 58, 237, .35); border-radius: 999px;
  font-size: 12px; letter-spacing: 1px; color: var(--accent-strong);
  background: rgba(255, 255, 255, .6); backdrop-filter: blur(6px);
}
.thm-forum .echo-hero .ph-title {
  margin: 0 0 12px; font-size: 40px; line-height: 1.18;
  font-family: var(--font-serif); letter-spacing: 2px; color: #4c1d95;
}
.thm-forum .echo-hero .ph-note { max-width: 640px; font-size: 14.5px; line-height: 2; color: #5b4a7a; }
.thm-forum .echo-hero-note {
  position: absolute; right: 26px; bottom: 20px; z-index: 1;
  font-size: 11.5px; letter-spacing: 2px; color: rgba(109, 40, 217, .8);
  background: rgba(255, 255, 255, .65); border: 1px solid rgba(196, 181, 253, .65);
  border-radius: 999px; padding: 5px 14px; backdrop-filter: blur(6px);
  animation: echo-pulse 2.6s ease-in-out infinite;
}
@keyframes echo-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .5; } }
.thm-forum .echo-hero .echo-stats { position: relative; z-index: 1; }

/* —— 频道旋钮（左栏导航） —— */
.thm-forum .echo-knob {
  width: 24px; height: 24px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; background: var(--bg-soft);
  transition: background .15s;
}
.thm-forum .echo-nav-item:hover .echo-knob { background: var(--accent-soft); }

/* —— 声浪舞台（中栏） —— */
.thm-forum .echo-stage {
  background: linear-gradient(180deg, rgba(255, 255, 255, .97), rgba(247, 244, 255, .92));
  border-color: rgba(196, 181, 253, .4);
}
.thm-forum .echo-card { align-items: center; gap: 16px; margin: 0 0 6px; border-radius: 12px; }
.thm-forum .echo-card:hover { background: linear-gradient(90deg, rgba(237, 233, 254, .6), transparent 78%); }

/* 波形：随回声指数（--amp）起伏，越高声浪越猛 */
.thm-forum .echo-wave {
  flex-shrink: 0; width: 46px; height: 46px;
  display: flex; align-items: flex-end; justify-content: center; gap: 3px;
  transform-origin: bottom;
  transform: scaleY(clamp(.3, calc(var(--amp) / 52), 1.6));
  opacity: clamp(.55, calc(var(--amp) / 70), 1);
}
.thm-forum .echo-wave i {
  flex: 1; border-radius: 2px 2px 0 0;
  background: linear-gradient(180deg, #c4b5fd, #7c3aed);
}
.thm-forum .echo-wave i:nth-child(odd) { height: 34%; }
.thm-forum .echo-wave i:nth-child(3n) { height: 58%; }
.thm-forum .echo-wave i:nth-child(4n+2) { height: 82%; }
.thm-forum .echo-wave i:nth-child(5n+1) { height: 46%; }
.thm-forum .echo-wave i:nth-child(6n+4) { height: 66%; }
.thm-forum .echo-wave i:nth-child(7n+5) { height: 90%; }

/* 音量计：回声指数越长，点亮越满 */
.thm-forum .echo-meter {
  display: block; width: 46px; height: 5px; border-radius: 999px;
  background: #ede9fe; overflow: hidden; margin: 7px auto 0;
}
.thm-forum .echo-meter i {
  display: block; height: 100%;
  width: clamp(8%, calc(var(--lv) * 1%), 100%);
  border-radius: 999px;
  background: linear-gradient(90deg, #c4b5fd, #7c3aed);
}

/* 置顶徽标跟随主题色 */
.thm-forum .echo-pin { background: var(--accent); }

/* —— 频道音轨卡片墙（版块） —— */
.thm-forum .echo-sec-card { overflow: hidden; }
.thm-forum .echo-sec-track {
  height: 36px; display: flex; align-items: center; padding: 0 16px; margin: 0 0 14px;
  background: linear-gradient(90deg, rgba(124, 58, 237, .08), rgba(196, 181, 253, .3), rgba(124, 58, 237, .08));
}
.thm-forum .echo-sec-freq {
  flex: 1; height: 15px; border-radius: 4px;
  background: repeating-linear-gradient(90deg, rgba(124, 58, 237, .5) 0 2px, transparent 2px 7px);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent);
}

/* —— 响应式：小屏收起波形与音量计 —— */
@media (max-width: 720px) {
  .thm-forum .echo-hero { padding: 30px 20px 26px; }
  .thm-forum .echo-hero .ph-title { font-size: 30px; }
  .thm-forum .echo-hero-note { display: none; }
  .thm-forum .echo-wave { display: none; }
  .thm-forum .echo-meter { width: 100%; margin-top: 6px; }
}
@media (max-width: 620px) {
  .thm-forum .echo-card-score { min-width: 52px; padding-left: 8px; }
  .thm-forum .echo-sec-track { display: none; }
}

/* ============================================================
   表单控件描边：可见性统一收口
   背景：全站十几处发帖 / 投稿框的边框各写各的，且大多用了 --line（那是
   分隔线色，铺在白底上几乎看不见）；有的还带一点极浅的主题色，一样糊。
   做法：这里用一组 :not() 把权重抬到各模块规则之上，统一换成「看得见但不重」
   的字段边，并给出悬停与聚焦的分层；:not(:focus) 保证聚焦态仍归各模块自己的
   聚焦样式管（蓝色描边 + 光圈那一套不受影响）。
   ============================================================ */
input[type="text"]:not(:focus):not([disabled]),
input[type="search"]:not(:focus):not([disabled]),
input[type="url"]:not(:focus):not([disabled]),
input[type="email"]:not(:focus):not([disabled]),
input[type="password"]:not(:focus):not([disabled]),
input[type="number"]:not(:focus):not([disabled]),
input[type="tel"]:not(:focus):not([disabled]),
input[type="date"]:not(:focus):not([disabled]),
input[type="datetime-local"]:not(:focus):not([disabled]),
select:not(:focus):not([disabled]),
textarea:not(:focus):not([disabled]) {
  border: 1.5px solid var(--field-line);
}
input[type="text"]:hover:not(:focus):not([disabled]),
input[type="search"]:hover:not(:focus):not([disabled]),
input[type="url"]:hover:not(:focus):not([disabled]),
input[type="email"]:hover:not(:focus):not([disabled]),
input[type="password"]:hover:not(:focus):not([disabled]),
input[type="number"]:hover:not(:focus):not([disabled]),
input[type="tel"]:hover:not(:focus):not([disabled]),
input[type="date"]:hover:not(:focus):not([disabled]),
input[type="datetime-local"]:hover:not(:focus):not([disabled]),
select:hover:not(:focus):not([disabled]),
textarea:hover:not(:focus):not([disabled]) {
  border-color: var(--field-line-hover);
}
/* 占位文字也提一档对比度：边看得见了，里面的提示字不该还是灰雾 */
::placeholder { color: #9aa6ba; opacity: 1; }

/* 职栈「布告栏」认自己的颜色：字段描边回一档看得见的青绿（原来是 #c7e6df，太浅），
   悬停与聚焦仍走原有青绿系；放在收口规则之后，同权重靠顺序取胜。 */
.bill-post input[type="text"]:not(:focus),
.bill-post select:not(:focus),
.bill-post textarea:not(:focus) {
  border-color: #8ecfc2;
}
.bill-post input[type="text"]:hover:not(:focus),
.bill-post select:hover:not(:focus),
.bill-post textarea:hover:not(:focus) {
  border-color: #14b8a6;
}

/* ============================================================
   下载页（/download）
   观感取向：「上架清单」。版本是货号，自检是点货，校验值是封条。
   扁平 + 液态玻璃，不靠投影堆厚度；信息先于按钮，让人看完再点。
   ============================================================ */
.dl-page { max-width: 900px; margin: 0 auto; }

.dl-head { padding: 34px 0 8px; }
.dl-eyebrow {
  display: inline-block; font-size: 12px; letter-spacing: .16em;
  color: var(--brand-strong); background: var(--brand-soft);
  border: 1px solid var(--brand-line); border-radius: 999px; padding: 4px 14px;
}
.dl-h1 {
  margin: 16px 0 12px; font-family: var(--font-serif);
  font-size: 34px; line-height: 1.32; letter-spacing: .01em;
}
.dl-lead { margin: 0 0 10px; max-width: 44em; font-size: 15px; line-height: 2; color: var(--ink-soft); }
.dl-lead-sm { font-size: 13.5px; color: var(--muted); }

.dl-block { margin: 32px 0 0; }
.dl-h2 {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin: 0 0 14px; font-size: 18px; font-family: var(--font-serif);
}
.dl-h2-mark {
  font-family: var(--mono); font-size: 12.5px; font-weight: 600; letter-spacing: .06em;
  color: var(--brand-strong); background: var(--brand-soft);
  border: 1px solid var(--brand-line); border-radius: 8px; padding: 2px 9px;
}
.dl-sub { margin: 0 0 14px; max-width: 46em; font-size: 14px; line-height: 2; color: var(--ink-soft); }

.dl-card {
  padding: 20px 22px;
  border: 1px solid var(--line); border-radius: 16px;
  background: linear-gradient(160deg, rgba(255, 255, 255, .84), rgba(238, 243, 252, .62));
  backdrop-filter: blur(10px);
}
.dl-card.is-latest {
  border-color: var(--brand-line);
  background: linear-gradient(160deg, rgba(255, 255, 255, .92), rgba(233, 241, 254, .72));
}
.dl-card + .dl-card { margin-top: 14px; }

.dl-card-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.dl-badge { font-size: 12px; font-weight: 600; border-radius: 999px; padding: 3px 12px; }
.dl-badge-new { color: #0f7a52; background: #e8f8f1; border: 1px solid #b7ecd6; }
.dl-badge-back { color: #b45309; background: #fff7e6; border: 1px solid #ffe0a3; }
.dl-card-name { font-family: var(--mono); font-size: 12.5px; color: var(--muted); word-break: break-all; }

.dl-meta {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px 16px; margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid var(--hairline);
}
.dl-meta-i { min-width: 0; margin: 0; }
.dl-meta-i dt { font-size: 12px; color: var(--muted); letter-spacing: .06em; }
.dl-meta-i dd { margin: 3px 0 0; font-size: 14.5px; font-weight: 600; color: var(--ink); }

.dl-act { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 18px 0 0; }
.dl-btn { font-size: 15px; padding: 11px 24px; }
.dl-act-note { font-size: 12.5px; color: var(--muted); }

.dl-checks {
  margin: 18px 0 0; padding: 14px 16px;
  border: 1px dashed var(--brand-line); border-radius: 12px; background: rgba(255, 255, 255, .5);
}
.dl-checks-title {
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  margin: 0 0 10px; font-size: 13.5px; font-weight: 600; color: var(--ink);
}
.dl-checks-note { font-size: 12px; font-weight: 400; color: var(--muted); }
.dl-checks-list {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 6px 16px; margin: 0; padding: 0; list-style: none;
}
.dl-checks-list li { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ink-soft); }
.dl-check-ico {
  flex: 0 0 auto; width: 18px; height: 18px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; font-size: 11px; font-weight: 700;
}
.dl-checks-list li.ok .dl-check-ico { color: #0f7a52; background: #e8f8f1; border: 1px solid #b7ecd6; }
.dl-checks-list li.bad { color: var(--danger); font-weight: 600; }
.dl-checks-list li.bad .dl-check-ico { color: #fff; background: var(--danger); border: 1px solid var(--danger); }

.dl-hash { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin: 14px 0 0; }
.dl-hash-k { font-size: 11.5px; letter-spacing: .1em; color: var(--muted); }
.dl-hash-v { font-family: var(--mono); font-size: 12px; line-height: 1.8; color: var(--ink-soft); word-break: break-all; }

.dl-steps {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px; margin: 0; padding: 0; list-style: none; counter-reset: dlstep;
}
.dl-steps li {
  position: relative; padding: 16px 18px 16px 46px;
  border: 1px solid var(--line); border-radius: 14px; background: rgba(255, 255, 255, .6);
}
.dl-steps li::before {
  counter-increment: dlstep; content: counter(dlstep);
  position: absolute; left: 16px; top: 17px;
  width: 20px; height: 20px; display: flex; align-items: center; justify-content: center;
  border-radius: 50%; font-size: 11.5px; font-weight: 700;
  color: var(--brand-strong); background: var(--brand-soft); border: 1px solid var(--brand-line);
}
.dl-steps strong { display: block; margin-bottom: 4px; font-size: 14.5px; }
.dl-steps span { font-size: 13px; line-height: 1.9; color: var(--ink-soft); }

.dl-cmd {
  margin: 0; padding: 14px 16px; overflow-x: auto;
  font-family: var(--mono); font-size: 12.5px; line-height: 1.9; color: var(--ink-soft);
  background: rgba(255, 255, 255, .62); border: 1px solid var(--line); border-radius: 12px;
}
.dl-tip { margin: 14px 0 0; font-size: 13px; line-height: 1.95; color: var(--muted); }
.dl-tip a { color: var(--brand-strong); }

@media (max-width: 620px) {
  .dl-head { padding: 22px 0 4px; }
  .dl-h1 { font-size: 25px; }
  .dl-card { padding: 16px 15px; }
  .dl-btn { width: 100%; text-align: center; }
  .dl-act-note { width: 100%; }
}

/* ============================================================
   前台通用：提示条与徽标
   （发文报错、公告列表、公告详情都用这一套；全站无投影，只靠 1px 描边分层次）
   ============================================================ */
.alert {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 16px;
  margin: 0 0 18px;
  border: 1px solid var(--line); border-left: 3px solid var(--brand);
  border-radius: var(--r-md);
  background: rgba(255, 255, 255, .72);
  color: var(--ink-soft);
  font-size: 13.5px; line-height: 1.8;
  overflow-wrap: anywhere;
}
.alert-err { border-color: #f5c2c2; border-left-color: var(--danger); background: #fdecec; color: #c53030; }
.alert-ok { border-color: #bbf0cc; border-left-color: var(--ok); background: #e6f7ec; color: #15803d; }
.alert-warn { border-color: #f2ddb4; border-left-color: var(--warn); background: #fff4e0; color: #b45309; }

.badge {
  display: inline-block;
  padding: 2px 9px;
  border-radius: var(--r-pill);
  font-size: 12px; font-weight: 500; line-height: 1.7;
  white-space: nowrap;
}
.badge-pub { background: #e6f7ec; color: #15803d; }
.badge-draft { background: #fff4e0; color: #b45309; }
.badge-pin { background: #fff4e0; color: #b45309; }
.badge-info { background: var(--brand-soft); color: var(--brand-strong); }

/* ============================================================
   前台发文（/publish）
   写作页该有的样子：安静、少打扰、字够大；
   正文在左、发布设置在右，宽屏一屏看完，窄屏自动叠成一列。
   ============================================================ */
.pub-page { max-width: 1080px; margin: 0 auto; }
.pub-head { margin: 0 0 22px; padding: 0 0 18px; border-bottom: 3px double var(--line); }
.pub-kicker {
  display: inline-block; font-size: 12px; letter-spacing: .16em;
  color: var(--brand-strong); background: var(--brand-soft);
  border: 1px solid var(--brand-line); border-radius: 999px; padding: 4px 14px;
}
.pub-title { margin: 12px 0 8px; font-family: var(--font-serif); font-size: 27px; line-height: 1.35; }
.pub-note { margin: 0; max-width: 46em; font-size: 13.5px; line-height: 1.9; color: var(--ink-soft); }
.pub-note code { font-size: 12.5px; background: var(--brand-soft); padding: 1px 6px; border-radius: 6px; }

/* 左：正文与摘要；右：封面、状态、分类等发布设置 */
.pub-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 316px;
  gap: 22px;
  align-items: start;
}
.pub-main { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.pub-side { display: flex; flex-direction: column; gap: 16px; min-width: 0; position: sticky; top: 84px; }

/* 每一块设置都是一张安静的玻璃卡，与正文区同一套语言 */
.pub-card {
  display: flex; flex-direction: column; gap: 16px;
  padding: 20px 22px;
  border: 1px solid var(--line); border-radius: var(--r-lg);
  background: rgba(255, 255, 255, .62);
  backdrop-filter: blur(16px) saturate(170%);
  -webkit-backdrop-filter: blur(16px) saturate(170%);
}

.pub-field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.pub-field > label { font-size: 13px; font-weight: 600; color: var(--ink); }
.pub-field input[type="text"], .pub-field select, .pub-field input[type="datetime-local"] {
  width: 100%; padding: 11px 14px; font-size: 14.5px; color: var(--ink);
  background: rgba(255, 255, 255, .72); border-radius: 12px;
}
.pub-field textarea {
  width: 100%; padding: 11px 14px; resize: vertical;
  font-size: 14px; color: var(--ink);
  background: rgba(255, 255, 255, .72); border-radius: 12px;
}
.pub-field textarea.pub-editor {
  min-height: 420px; padding: 16px 18px;
  font-family: var(--mono); font-size: 14px; line-height: 1.95; border-radius: 14px;
}
.pub-field textarea.pub-small { min-height: 84px; }
.pub-hint { font-size: 12.5px; color: var(--muted); line-height: 1.7; }
/* .pub-field 自带 display:flex，会压过浏览器对 [hidden] 的默认隐藏，这里补一条 */
.pub-field[hidden], .pub-card[hidden] { display: none; }

/* 点名共创：这一页最容易被忽略的字段，单独框出来，别让它混在普通输入里 */
.pub-card.pub-coauthor { border-color: var(--brand-line); background: var(--brand-soft); }

.pub-more {
  border: 1px dashed var(--brand-line); border-radius: 14px;
  padding: 14px 16px; background: rgba(255, 255, 255, .5);
}
.pub-more > summary { cursor: pointer; font-size: 13.5px; font-weight: 600; color: var(--brand-strong); }
.pub-more[open] > summary { margin-bottom: 12px; }
.pub-more .pub-field + .pub-field { margin-top: 12px; }

/* 提交区固定在右栏底部，写多长都不用回头找按钮 */
.pub-actions { display: flex; flex-direction: column; gap: 10px; }
.pub-actions .btn { width: 100%; }

@media (max-width: 900px) {
  .pub-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .pub-side { position: static; }
  .pub-actions { flex-direction: row; flex-wrap: wrap; }
  .pub-actions .btn { width: auto; flex: 1 1 auto; }
}
@media (max-width: 620px) {
  .pub-title { font-size: 23px; }
  .pub-card { padding: 18px 16px; }
  .pub-field textarea.pub-editor { min-height: 300px; }
}

/* ============================================================
   公告（/announce 列表 + /announce/{slug} 详情）
   列表把「置顶 / 类型 / 时间 / 阅读」收进一条安静的卡片，
   别再用内联样式东拼西凑；详情页正文走 .article-body。
   ============================================================ */
.ann-list { display: flex; flex-direction: column; gap: 12px; }
.ann-item {
  padding: 18px 22px;
  border: 1px solid var(--line); border-radius: var(--r-lg);
  background: rgba(255, 255, 255, .62);
  backdrop-filter: blur(16px) saturate(170%);
  -webkit-backdrop-filter: blur(16px) saturate(170%);
  transition: border-color .16s, transform .16s;
}
.ann-item:hover { border-color: var(--brand-line); transform: translateY(-1px); }
.ann-item.is-pinned { border-color: var(--brand-line); background: var(--brand-soft); }
.ann-tags { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 9px; }
.ann-title { margin: 0 0 6px; font-family: var(--font-serif); font-size: 19px; line-height: 1.5; }
.ann-title a { color: var(--ink); text-decoration: none; transition: color .16s; }
.ann-title a:hover { color: var(--brand-strong); }
.ann-summary { margin: 0 0 12px; font-size: 14px; line-height: 1.9; color: var(--ink-soft); overflow-wrap: anywhere; }
.ann-meta { display: flex; gap: 16px; flex-wrap: wrap; font-size: 12.5px; color: var(--muted); }
.ann-meta span { display: inline-flex; align-items: center; gap: 5px; }

/* 详情 */
.ann-article { max-width: 860px; margin: 0 auto; }
.ann-article-head { padding: 0 0 16px; margin-bottom: 22px; border-bottom: 1px solid var(--line); }
.ann-article-title { margin: 12px 0; font-family: var(--font-serif); font-size: 27px; line-height: 1.4; color: var(--ink); }
.ann-back { text-align: center; margin-top: 26px; }

@media (max-width: 620px) {
  .ann-item { padding: 16px; }
  .ann-article-title { font-size: 22px; }
}

/* ---------- 评论验证码 ---------- */
.captcha-field {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.captcha-field .captcha-img {
  height: 46px; width: auto; border-radius: 10px; cursor: pointer;
  border: 1px solid var(--brand-line); background: #fff;
}
.captcha-field input[type="text"] { flex: 1 1 180px; min-width: 140px; }
@media (max-width: 560px) {
  .captcha-field { align-items: stretch; }
  .captcha-field .captcha-img { height: 42px; }
}

/* ============================================================
   移动端适配总纲（手机 / 平板 / 折叠屏）
   说明：本文件前面散落的断点规则会因「源码顺序」互相覆盖
        （例如 .hdr-bell 的 44px 版本写在前面，被文件后段的基础规则反压）。
        这里统一在文件末尾收口，保证移动端规则最终生效、不靠顺序碰运气。
   覆盖：顶栏收缩与省略、隐藏元素不再撑破横向、正文高亮可换行、
        联系作者二维码不出屏、超窄屏兜底。
   ============================================================ */

/* —— 顶栏：品牌区可收缩，操作区永不被挤出屏幕 —— */
@media (max-width: 900px) {
  .header-inner { gap: 12px; }
  .brand { flex-shrink: 1; min-width: 0; }
  .brand-name { min-width: 0; }
  .brand-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .hdr-name { max-width: 110px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .header-actions { flex-shrink: 0; gap: 8px; }
  .hdr-bell { width: 42px; height: 42px; }
  .hdr-bell-ico { font-size: 17px; }
  .hdr-me .nav-dd-btn { padding: 6px 8px; }

  /* 正文重点高亮：窄屏允许换行，长句不再撑出横向滚动（折叠屏闭合态 466pt 尤其明显） */
  .article-body strong.hl { white-space: normal; }
  .article-body li strong.hl { display: inline; }
}

/* —— 超窄屏（手机竖屏 / 折叠屏闭合态）：只留图标与头像，文字省略 —— */
@media (max-width: 480px) {
  .brand-name em { display: none; }
  .hdr-name { display: none; }
}

/* —— 正文：长英文路径 / 命令行 / URL 断行 ——
   .article-body 里常出现 /www/wwwroot/xxx、bash /xxx/start.sh 这类「无空格长词」，
   在窄屏（手机竖屏、折叠屏闭合态）会整块顶出视口，产生横向滚动。
   overflow-wrap: break-word 只在「这个词单独放一行也放不下」时才断词，
   不影响正常排版，也不会改变元素的最小内容宽度，因此对桌面端零副作用。 —— */
.article-body { overflow-wrap: break-word; }

/* —— 文档页（doc_layout：/docs、/page/* 等）：长代码 / 长路径断行 ——
   .doc-body 与 .article-body 同属正文，但此前没有断行处理：
   changelog 一类页面里的 `bash /www/wwwroot/x/start.sh` 这种无空格长词，
   会把整块 <code> 顶出视口（320px 实测溢出 48px）。
   这里给文档正文兜底，且只做「整词放不下才断」的处理，桌面端零副作用：
   - 正文 / 列表：overflow-wrap: break-word
   - <code> 内联：overflow-wrap: anywhere（可参与收缩，长命令/路径必断）
   - <pre> 代码块：保持自身横向滚动，不反向撑破页面 —— */
.doc-body { overflow-wrap: break-word; }
.doc-body li, .doc-body p { overflow-wrap: break-word; }
.doc-body code { overflow-wrap: anywhere; }
.doc-body pre { max-width: 100%; overflow-x: auto; }
.doc-body pre code { overflow-wrap: normal; }

@media (max-width: 900px) {
  /* 窄屏收窄列表缩进：一级 26px → 20px，二级再降一档，避免逐层缩进吃掉可用宽度 */
  .article-body ul, .article-body ol { padding-left: 20px; }
  .article-body ul ul, .article-body ol ol,
  .article-body ul ol, .article-body ol ul { padding-left: 18px; }
}

/* —— 页脚「联系作者」弹层：该弹层 visibility:hidden 时仍占据布局空间，
       居中定位会随链接靠近哪一侧而稳定撑出 7~8px（桌面）乃至几十 px（窄屏）横向滚动。
       统一改为「贴齐链接所在行右边界」的锚定方式，右边界永不超过容器内容区右边界，
       因此任何视口都不会向右越界；容器左侧留白 ≥16px 且弹层仅 188px，也不会向左越界。 —— */
@media (min-width: 901px) {
  .contact-link .contact-qr-pop { right: 0; left: auto; transform: translateY(8px); }
  .contact-link:hover .contact-qr-pop { transform: translateY(0); }
}
@media (max-width: 900px) {
  /* 触屏 / 窄屏：页脚二维码弹层默认不参与布局（display:none），
     彻底消除「隐藏弹层仍撑宽文档」的横向溢出；
     仅在悬停 / 键盘聚焦时临时显示，并贴齐行右边界，避免越出容器。 */
  .footer-links { position: relative; }
  .footer-links .contact-link { position: static; }
  .footer-links .contact-link .contact-qr-pop { display: none; }
  .footer-links .contact-link:hover .contact-qr-pop,
  .footer-links .contact-link:focus-within .contact-qr-pop {
    display: block;
    left: auto; right: 0; bottom: calc(100% + 8px);
    transform: none;
  }
}

/* 弹层宽度按视口兜底，避免极窄屏 / 折叠屏上越界 */
.contact-qr-pop { max-width: calc(100vw - 24px); }

/* ============================================================
   触控目标与输入体验（手机 / 平板 / 折叠屏）
   触屏设备（hover:none 且 pointer:coarse）在任何宽度都按 44×44 下限；
   同时兼顾平板宽度区间（≤1180px：iPad 竖屏 768 / 横屏 1024、
   iPad Air/Pro 1180、Surface 触控 1180 等），
   避免大平板上出现「按钮有大有小、图标点不中」。
   桌面鼠标环境（>1180px 且 fine pointer）保持原有紧凑尺寸，零影响。
   注：min-height 会压过基础规则里的固定 height（含 --btn-h:40px），
       因此统一抬到 44，无需改动各处按钮基础样式。
   ============================================================ */
@media (hover: none) and (pointer: coarse), (max-width: 1180px) {
  /* —— 顶栏图标 / 用户菜单：方形热区一律 ≥44×44 —— */
  .hdr-bell { width: 44px; height: 44px; }
  .hdr-bell-ico { font-size: 18px; }
  .nav-toggle { width: 44px; height: 44px; }
  .nav-toggle svg { width: 22px; height: 22px; }

  /* —— 文字 / 图标按钮：统一最小热区，消除「有大有小」 —— */
  .nav-dd-btn { min-height: 44px; }
  .hdr-me .nav-dd-btn { padding: 8px 10px; }
  .main-nav a { min-height: 44px; display: inline-flex; align-items: center; }
  .btn { min-height: 44px; }
  .btn-sm { min-height: 44px; }

  /* —— 站点 Logo 与场景化按钮 / 选项卡（资讯报头、落地页）同高 —— */
  .brand { min-height: 44px; }
  .press-btn, .press-section, .off-tab { min-height: 44px; }

  /* —— 资讯页「分类小标签 / 读全文」、「应用卡片」底部动作链接：
        它们都是独立可点控件（非正文内联链接），窄屏上 21~24px 高极易误触，
        统一抬到 44px 热区；所在行均为 align-items:center 的横向弹性行，形变安全。 —— */
  .press-chip,
  .press-lead-more, .press-clip-more,
  .press-flow .press-clip-more,
  .mod-meta-log { display: inline-flex; align-items: center; min-height: 44px; }

  /* —— 页脚导航（下载 / Win本地版 / 关于 / 订阅 / 后台等）：都是独立导航项 —— */
  .footer-links a { display: inline-flex; align-items: center; min-height: 44px; }
  .footer-links .contact-link { display: inline-flex; align-items: center; min-height: 44px; }

  /* —— 顶栏下拉菜单（用户菜单等）：展开后每一项 ≥44 —— */
  .nav-dd-menu a { min-height: 44px; display: flex; align-items: center; }

  /* —— 资讯标题链接：标题是「行内 <a>」，行内元素的纵向 padding
        只扩大点击热区、不改变行高与周围排版，因此视觉零变化，
        却把 23px 的细条变成 ~43px 的可点区域。 —— */
  .press-lead-title a, .press-clip-title a,
  .press-flow .press-clip-title a { padding: 11px 0; }

  /* —— 表单控件（含顶栏搜索）：最小高度 44，触屏更易聚焦与点按 —— */
  .search-box input,
  input[type=text], input[type=email], input[type=password], input[type=search],
  input[type=number], input[type=tel], input[type=url], select { min-height: 44px; }

  /* —— 正文内联链接：触屏上给足垂向热区，降低与相邻文字误触 —— */
  .article-body a { padding: 2px 0; }

  /* —— 多行输入：给足高度，触屏不易误触 —— */
  textarea { min-height: 44px; }
}

/* —— 触屏设备（不受宽度限制，含 901~1180 的平板）：
      表单控件字号 ≥16px，避免 iOS / iPadOS 聚焦时自动放大整页。
      只对粗指针设备生效，桌面鼠标环境零影响。 —— */
@media (hover: none) and (pointer: coarse) {
  input[type=text], input[type=email], input[type=password], input[type=search],
  input[type=number], input[type=tel], input[type=url], textarea, select {
    font-size: 16px;
  }
}

/* —— 折叠屏分屏（双屏 / 展开态）：两段视口时避免跨折叠线排布 —— */
@media (horizontal-viewport-segments: 2) {
  .container { padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); }
  .layout, .doc-wrap { gap: 20px; }
}

/* ============================================================
   移动端加固（手机 / 平板 / 折叠屏）—— 追加于文件末尾，确保不被后续规则覆盖
   1) 触屏点按反馈：去掉 iOS 默认灰色高亮块，并取消 300ms 双击缩放判定，
      让每次点按都即时响应（仅粗指针设备，桌面鼠标零影响）。
   2) 正文 / 文档宽表：窄屏改为「表格自身横向滚动」，
      多列宽表再也不会把整页顶出视口（电脑端保持原有表格布局，零变化）。
   ============================================================ */
@media (hover: none) and (pointer: coarse) {
  a, button, .btn, [role="button"], input[type=submit], input[type=button],
  label, summary, .nav-toggle, .hdr-bell, .nav-dd-btn {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }
}

@media (max-width: 900px) {
  .article-body table, .doc-body table, .page-body table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* 3) 触屏设备没有「悬停」：联系作者的二维码弹层在手机 / 平板上根本点不出来。
      改为「点按开合」——由 app.js 给触发元素加 .open，桌面端继续用悬停，两套互不干扰。 */
.contact-fab.open .contact-qr-pop,
.contact-entry.open .contact-qr-pop,
.contact-link.open .contact-qr-pop {
  opacity: 1; visibility: visible;
}
.contact-fab.open .contact-qr-pop { transform: translateY(0); }
.contact-entry.open .contact-qr-pop { transform: translateX(-50%) translateY(0); }
.contact-link.open .contact-qr-pop { transform: translateX(-50%) translateY(0); }

@media (min-width: 901px) {
  .contact-link.open .contact-qr-pop { transform: translateY(0); }
}
@media (max-width: 900px) {
  .footer-links .contact-link.open .contact-qr-pop {
    display: block;
    left: auto; right: 0; bottom: calc(100% + 8px);
    transform: none;
  }
}

/* 4) 触屏无悬停时，文章列表卡片右侧的「→」指示箭头常显，避免「可点」提示丢失 */
@media (hover: none) and (pointer: coarse) {
  .post-index .pi-arrow { opacity: 1; transform: none; }
}

/* 5) 触屏热区补漏：文章列表里的分类链接、应用卡片里的标题链接，本身字就小
      （实测 26×22 / 34×31），直接撑高会顶乱元信息行与卡片抬头。
      改用「隐形热区」——绝对定位的伪元素把可点范围扩到约 44px，
      不占布局、不改视觉，且只在粗指针设备或窄屏生效，桌面鼠标零影响。 */
@media (hover: none) and (pointer: coarse), (max-width: 1180px) {
  .pi-meta a, .app-name { position: relative; }
  .pi-meta a::after {
    content: ""; position: absolute;
    left: -9px; right: -9px; top: -11px; bottom: -11px;
  }
  .app-name::after {
    content: ""; position: absolute;
    left: -10px; right: -10px; top: -9px; bottom: -9px;
  }
}

/* 6) 移动端收口（第二遍 · 深度加固）—— 手机 / 平板 / 折叠屏 通吃
      · 顶部抽屉高度改用动态视口（dvh）：移动浏览器地址栏收起 / 展开时不再裁掉底部菜单；
      · 右下角悬浮件与「发现新版本」提示条避让手势条与横屏安全区；
      · env() 在无安全区的桌面环境回退原值，鼠标环境零视觉影响。 */
@media (max-width: 900px) {
  .main-nav { max-height: calc(100dvh - 64px - env(safe-area-inset-top)); }
}

.cache-fab,
.contact-fab {
  right: max(22px, env(safe-area-inset-right));
  bottom: max(24px, calc(env(safe-area-inset-bottom) + 10px));
}
.up-toast {
  right: max(22px, env(safe-area-inset-right));
  bottom: max(22px, calc(env(safe-area-inset-bottom) + 10px));
}
@media (max-width: 620px) {
  .up-toast {
    left: max(14px, env(safe-area-inset-left));
    right: max(14px, env(safe-area-inset-right));
    bottom: max(14px, env(safe-area-inset-bottom));
  }
}

/* ============================================================
   模块页头 · 2.0 ·「紧凑统一 + 一模块一形」
   A 统一基线：高度归一 / 留白收紧 / 标题同号；
   B 每个模块改用专属结构元素，替换千篇一律的
     kicker → 两行大标题 → 长段落 → 统计药丸 骨架；
   C 统一移动端收口。
   说明：此处仅追加覆盖，不动既有选择器；events / forms / media
   三个模块的自有样式在其本身 css 文件中同步收紧。
   ============================================================ */

/* ---------- A. 统一基线 ---------- */
.press-hero,
.pol-hero,
.bill-hero,
.tool-hero,
.win-hero,
.thm-forum .echo-hero,
.thm-circles .camp-hero,
.thm-docs .shelf-hero,
.thm-moments.momo-scene .momo-scene-hero,
.thm-qa .qa-hero {
  min-height: 200px;
  box-sizing: border-box;
  padding: 22px 30px 20px;
}

/* 标题收到同一档，去掉「要么 30 要么 42」的忽大忽小 */
.pol-hero-title,
.bill-hero-title,
.tool-title,
.win-hero-title,
.thm-forum .echo-hero .ph-title,
.thm-circles .camp-hero .camp-title,
.thm-docs .shelf-hero .shelf-title,
.thm-moments.momo-scene .momo-title.momo-scene-title,
.thm-qa .qa-hero .qa-hero-title {
  font-size: 30px;
  line-height: 1.2;
  margin: 0 0 14px;
}

/* ---------- B1. 资讯 · 晴空快报：报头 + 本版导读条 ---------- */
.press-hero .press-masthead { margin: 0 0 6px; padding: 0 0 6px; }
.press-hero .press-name { margin: 6px 0 4px; font-size: 28px; letter-spacing: 8px; text-indent: 8px; }
.press-hero .press-masthead-top { font-size: 11.5px; }
.press-hero .press-rule { margin: 3px 0 6px; }
.press-desk {
  position: relative; z-index: 1;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding-top: 6px;
}
.press-desk-tag {
  font-family: var(--mono); font-size: 11px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase; color: #b91c1c;
  padding: 3px 9px; border: 1px solid rgba(185, 28, 28, .4); border-radius: 4px;
}
.press-desk-cols { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.press-desk-cols li {
  display: inline-flex; align-items: baseline; gap: 6px;
  padding: 4px 10px; border: 1px solid rgba(185, 28, 28, .22); border-radius: 999px;
  font-size: 12.5px; color: #7f1d1d; background: rgba(255, 255, 255, .6);
}
.press-desk-cols li b { font-weight: 700; }
.press-desk-cols li em { font-style: normal; font-family: var(--mono); font-size: 11px; color: #b91c1c; }
.press-desk-note { margin-left: auto; font-size: 12.5px; color: #8a6d45; }
.press-desk-note b { color: #b91c1c; }
.press-desk-empty { font-size: 12.5px; color: #8a6d45; }

/* ---------- B2. 影集 · 晴空影集：胶带相纸三连（钉墙） ---------- */
.pol-hero-title { margin: 0 0 18px; }
.pol-tacks { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 16px; margin: 0; padding: 6px 0 0; list-style: none; }
.pol-tacks li {
  position: relative; flex: 0 1 190px;
  padding: 13px 15px 12px; border-radius: 3px;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(244, 239, 228, .24);
  transform: rotate(-2deg);
}
.pol-tacks li:nth-child(2) { transform: rotate(1.6deg); }
.pol-tacks li:nth-child(3) { transform: rotate(-1deg); }
.pol-tack {
  position: absolute; top: -7px; left: 50%; width: 36px; height: 13px; margin-left: -18px;
  background: rgba(226, 214, 186, .5); border-radius: 1px;
}
.pol-tacks b { display: block; font-family: var(--font-serif); font-size: 15px; color: #fdf6e9; }
.pol-tacks em { display: block; margin-top: 4px; font-style: normal; font-size: 12px; color: rgba(244, 239, 228, .68); }

/* ---------- B3. 职栈 · 晴空职栈：招聘状态灯图例 ---------- */
.bill-signs { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.bill-signs li {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 5px 11px; border-radius: 999px; border: 1px solid;
  background: rgba(255, 255, 255, .55); font-size: 12.5px;
}
.bill-signs i { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; }
.bill-signs b { font-weight: 700; }
.bill-signs em { font-style: normal; font-size: 12px; color: #6b5d4a; }
.bill-signs .s-go { border-color: #86efac; color: #166534; }
.bill-signs .s-go i { background: #22c55e; }
.bill-signs .s-wait { border-color: #fcd34d; color: #92400e; }
.bill-signs .s-wait i { background: #f59e0b; }
.bill-signs .s-stop { border-color: #fca5a5; color: #991b1b; }
.bill-signs .s-stop i { background: #ef4444; }

/* ---------- B4. 服务 · 晴空帮手：工具箱格（公示价 / 时效 / 实名） ---------- */
.tool-title { margin: 0 0 18px; }
.tool-slots { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.tool-slots li {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 8px 13px; border-radius: 8px;
  background: rgba(255, 255, 255, .06);
  border: 1px solid rgba(240, 253, 244, .2);
}
.ts-slot { flex: 0 0 auto; width: 14px; height: 14px; border: 1.5px solid #4ade80; border-radius: 3px; }
.tool-slots b { font-size: 13px; color: #f0fdf4; }
.tool-slots em { font-style: normal; font-size: 11.5px; color: #86efac; }

/* ---------- B5. 小铺 · 晴空小铺：橱窗价签三连 ---------- */
.win-hero-title { margin: 0 0 12px; }
.win-tags { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 9px; margin: 0; padding: 0; list-style: none; }
.win-tags li {
  position: relative; padding: 8px 12px 7px; border-radius: 4px;
  background: rgba(255, 255, 255, .1);
  border: 1px dashed rgba(246, 234, 210, .42);
}
.wt-hole {
  position: absolute; top: 5px; left: 50%; width: 6px; height: 6px; margin-left: -3px;
  border-radius: 50%; background: rgba(0, 0, 0, .35);
}
.win-tags b { display: block; font-size: 13px; color: #ffe9c4; }
.win-tags em { display: block; margin-top: 3px; font-style: normal; font-size: 11.5px; color: rgba(246, 234, 210, .72); }
.win-orders { margin-left: auto; }

/* ---------- B6. 论坛 · 共鸣板：回声层级（一层层传开） ---------- */
.thm-forum .echo-hero .ph-title { margin: 0 0 10px; }
.echo-thread { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 4px; max-width: 560px; }
.echo-thread p {
  display: flex; align-items: center; gap: 10px;
  margin: 0; padding: 4px 10px; border-radius: 8px;
  font-size: 12.5px; color: #4c1d95;
  background: rgba(124, 58, 237, .06);
  border: 1px solid rgba(124, 58, 237, .18);
}
.echo-thread p span {
  flex: 0 0 auto; padding: 2px 8px; border-radius: 999px;
  background: #7c3aed; color: #fff; font-size: 11px; letter-spacing: .5px;
}
.echo-thread .et-r1 { margin-left: 26px; }
.echo-thread .et-r2 { margin-left: 52px; }

/* ---------- B7. 部落 · 晴空部落：旗帜列（旗帜 / 公约 / 新人谷） ---------- */
.thm-circles .camp-hero .camp-title { margin: 0 0 16px; }
.camp-flags { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 12px; margin: 0; padding: 0; list-style: none; }
.camp-flags li {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 13px; border-radius: 8px;
  background: rgba(255, 255, 255, .55);
  border: 1px solid rgba(154, 52, 18, .2);
}
.cf-flag { position: relative; flex: 0 0 auto; width: 15px; height: 17px; }
.cf-flag::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; background: #9a3412; }
.cf-flag::after { content: ""; position: absolute; left: 2px; top: 0; width: 12px; height: 10px; background: var(--accent-strong, #ea580c); }
.camp-flags b { font-size: 13px; color: #7c2d12; }
.camp-flags em { font-style: normal; font-size: 11.5px; color: #9a3412; }

/* ---------- B8. 书架 · 晴空书架：借阅卡（在架 / 翻阅 / 随手记） ---------- */
.thm-docs .shelf-hero .shelf-title { margin: 0 0 10px; }
.shelf-line { position: relative; z-index: 1; margin: 0 0 6px; max-width: 620px; font-size: 12.5px; line-height: 1.45; color: rgba(238, 242, 255, .78); }
.shelf-line b { color: #a5b4fc; }
.shelf-card {
  position: relative; z-index: 1;
  max-width: 400px; padding: 7px 14px 8px; border-radius: 10px;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(199, 210, 254, .42);
}
.sc-head {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
  padding-bottom: 4px; border-bottom: 1px dashed rgba(165, 180, 252, .4);
}
.sc-head span { font-size: 13px; font-weight: 700; letter-spacing: 3px; color: #eef2ff; }
.sc-head em { font-style: normal; font-family: var(--mono); font-size: 10.5px; letter-spacing: 2px; color: #a5b4fc; }
.sc-rows { display: flex; flex-wrap: wrap; gap: 16px; margin: 4px 0 0; }
.sc-rows > div { display: flex; flex-direction: column; gap: 1px; }
.sc-rows dt { font-size: 11px; color: #c7d2fe; }
.sc-rows dd { margin: 0; font-family: var(--font-serif); font-size: 14px; line-height: 1.1; color: #f5f6ff; }

/* ---------- B9. 瞬语 · 晴空瞬语：心情时间线 ---------- */
.thm-moments.momo-scene .momo-title.momo-scene-title { margin: 0 0 10px; }
.momo-timeline { position: relative; z-index: 1; display: flex; flex-direction: column; margin: 0; padding: 0 0 0 4px; list-style: none; }
.momo-timeline li {
  position: relative; display: flex; align-items: center; gap: 12px;
  padding: 4px 0 4px 22px; font-size: 13px; color: #881337;
}
.momo-timeline li::before {
  content: ""; position: absolute; left: 4px; top: 50%; width: 7px; height: 7px; margin-top: -4px;
  border-radius: 50%; background: #e11d48;
}
.momo-timeline li::after {
  content: ""; position: absolute; left: 7px; top: 50%; bottom: -7px; width: 1px;
  background: rgba(225, 29, 72, .28);
}
.momo-timeline li:last-child::after { display: none; }
.mt-time { flex: 0 0 auto; font-family: var(--mono); font-size: 11px; color: #be123c; }
.mt-mood { flex: 0 0 auto; font-size: 14px; }
.momo-timeline b { font-weight: 700; }

/* ---------- C. 统一移动端收口（覆盖各模块更早的断点） ---------- */
@media (max-width: 720px) {
  .press-hero,
  .pol-hero,
  .bill-hero,
  .tool-hero,
  .win-hero,
  .thm-forum .echo-hero,
  .thm-circles .camp-hero,
  .thm-docs .shelf-hero,
  .thm-moments.momo-scene .momo-scene-hero,
  .thm-qa .qa-hero {
    min-height: 0;
    padding: 20px 18px 18px;
  }
  .pol-hero-title,
  .bill-hero-title,
  .tool-title,
  .win-hero-title,
  .thm-forum .echo-hero .ph-title,
  .thm-circles .camp-hero .camp-title,
  .thm-docs .shelf-hero .shelf-title,
  .thm-moments.momo-scene .momo-title.momo-scene-title,
  .thm-qa .qa-hero .qa-hero-title { font-size: 25px; }
  .press-hero .press-masthead { margin: 0 0 12px; padding: 0 0 10px; }
  .press-hero .press-name { font-size: 30px; letter-spacing: 6px; text-indent: 6px; }
  .press-desk-note { display: none; }
  .pol-tacks li { flex-basis: 100%; transform: none; }
  .echo-thread .et-r1 { margin-left: 14px; }
  .echo-thread .et-r2 { margin-left: 28px; }
  .shelf-card { max-width: 100%; }
}
@media (max-width: 480px) {
  .press-hero,
  .pol-hero,
  .bill-hero,
  .tool-hero,
  .win-hero,
  .thm-forum .echo-hero,
  .thm-circles .camp-hero,
  .thm-docs .shelf-hero,
  .thm-moments.momo-scene .momo-scene-hero,
  .thm-qa .qa-hero { padding: 18px 15px 16px; }
  .press-desk-cols li { padding: 3px 8px; }
  .sc-rows { gap: 14px; }
}