/* ==========================================================================
   标智搜 —— 样式表
   纯手写 CSS，不依赖任何外部资源，可离线运行
   ========================================================================== */

:root {
  --bg:        #f4f6fb;
  --surface:   #ffffff;
  --surface-2: #fafbfe;
  --ink:       #1a2233;
  --ink-2:     #5a6b87;
  --ink-3:     #8a99b3;
  --line:      #e4e9f2;
  --line-2:    #eef1f7;

  --brand:      #2b57d6;
  --brand-dark: #1e44b3;
  --brand-soft: #eef2ff;

  --gb:  #2563eb;
  --hy:  #0d9488;
  --df:  #b45309;
  --tt:  #7c3aed;
  --iso: #be185d;
  /* 法律法规：党政公文的红头色，与五种标准来源色都拉开距离 */
  --law: #b91c1c;
  --jl:  #0369a1;
  --sec: #4f46e5;
  /* 第三方检索（搜索引擎）：中性石板灰 —— 与「标准来源色」刻意区分开，
     免得看起来像又一个官方平台 */
  --search: #475569;

  --radius:   12px;
  --radius-s: 8px;
  --shadow:   0 1px 2px rgba(20, 32, 60, .04), 0 8px 24px rgba(20, 32, 60, .06);
  --shadow-s: 0 1px 2px rgba(20, 32, 60, .05);

  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
          "Liberation Mono", "Courier New", monospace;
}

* { box-sizing: border-box; }

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

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font: 15px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
        "Hiragino Sans GB", "Microsoft YaHei", "Source Han Sans SC",
        "Noto Sans CJK SC", sans-serif;
  -webkit-font-smoothing: antialiased;
  /* 让页脚贴底：body 撑满视口高度，page-main 吃掉中间的剩余空间 */
  display: flex; flex-direction: column; min-height: 100vh;
}

/* 内容区（顶栏与页脚之间的部分）。flex:1 使内容不足一屏时页脚仍落在视口底部，
   内容超出一屏时正常随文档流下移 —— 不需要 position:fixed。
   这里刻意不做 display:flex：里面的 <main class="wrap"> 靠 margin:auto 居中，
   一旦变成 flex 容器，align-items:stretch 会把它顶到左边、居中失效。 */
.page-main { flex: 1 0 auto; }

.wrap { width: 100%; max-width: 1080px; margin: 0 auto; padding: 0 20px; }

a { color: var(--brand); text-decoration: none; }

.mono { font-family: var(--mono); font-size: .92em; }

.is-hidden { display: none !important; }


/* ---------- 顶栏 ---------- */
.topbar {
  background: rgba(255, 255, 255, .88);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 20;
}
.topbar-inner {
  height: 62px; display: flex; align-items: center; justify-content: space-between;
}
.brand { display: flex; align-items: center; gap: 10px; color: var(--ink); }
.brand-mark {
  width: 32px; height: 32px; border-radius: 9px;
  background: linear-gradient(135deg, var(--brand), #4f7cf0);
  color: #fff; font-weight: 700; font-size: 16px;
  display: grid; place-items: center;
  box-shadow: 0 3px 10px rgba(43, 87, 214, .28);
}
.brand-text { display: flex; flex-direction: column; line-height: 1.2; }
.brand-text strong { font-size: 15.5px; letter-spacing: .2px; }
.brand-text em {
  font-style: normal; font-size: 11px; color: var(--ink-3);
  letter-spacing: .2px; margin-top: 1px;
}
.topnav {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px;
  font-size: 12.5px; color: var(--ink-2);
}
/* 原先这里有一枚「五大标准库实时检索」的实时状态胶囊（.nav-live / .dot-live），
   按需求从首页撤下，样式一并删掉，不留无用规则。 */
.nav-link {
  color: var(--ink-2); padding: 5px 9px; border-radius: 8px;
  transition: color .15s, background .15s;
  display: inline-flex; align-items: center; gap: 5px;
}
.nav-link:hover { color: var(--brand); background: var(--brand-soft); }
.nav-link-quiet { color: var(--ink-3); }
.nav-link-primary {
  color: #fff; background: var(--brand);
  box-shadow: 0 2px 8px rgba(43, 87, 214, .24);
}
.nav-link-primary:hover { color: #fff; background: var(--brand-dark); }
.nav-user {
  display: inline-flex; align-items: center; gap: 5px;
  color: var(--ink); font-weight: 600; padding: 0 2px;
}
.nav-badge {
  display: inline-grid; place-items: center; min-width: 16px; height: 16px;
  padding: 0 4px; border-radius: 999px;
  background: var(--brand-soft); color: var(--brand);
  font-size: 10.5px; font-weight: 700;
}
.vip-badge {
  display: inline-block; padding: 1px 6px; border-radius: 999px;
  background: linear-gradient(135deg, #b8860b, #e0a51c); color: #fff;
  font-size: 10px; font-weight: 700; letter-spacing: .5px;
  vertical-align: middle;
}


/* ---------- 搜索区 ---------- */
.hero { padding: 44px 0 6px; text-align: center; }
.hero-title {
  margin: 0 0 12px; font-size: 30px; letter-spacing: -.4px; font-weight: 700;
  display: inline-flex; align-items: center; gap: 10px;
  color: var(--ink);
}
.ai-badge {
  display: inline-grid; place-items: center;
  font-size: 15px; font-weight: 700; letter-spacing: .5px;
  color: #fff; background: linear-gradient(135deg, #2b57d6, #7c3aed);
  padding: 4px 11px; border-radius: 9px;
  box-shadow: 0 4px 12px rgba(43, 87, 214, .28);
}
.hero-sub { margin: 0 0 26px; color: var(--ink-2); font-size: 14.5px; }
.hero-sub b { color: var(--ink); font-weight: 600; }

.searchbar {
  display: flex; align-items: center; gap: 8px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: 14px; padding: 7px 7px 7px 16px;
  box-shadow: var(--shadow);
  max-width: 720px; margin: 0 auto;
  transition: border-color .18s, box-shadow .18s;
}
.searchbar:focus-within {
  border-color: #b9c8f5;
  box-shadow: 0 0 0 4px rgba(43, 87, 214, .1), var(--shadow);
}
.searchbar-icon {
  width: 16px; height: 16px; flex: 0 0 16px;
  border: 1.8px solid var(--ink-3); border-radius: 50%;
  position: relative;
}
.searchbar-icon::after {
  content: ''; position: absolute; right: -5px; bottom: -4px;
  width: 8px; height: 1.8px; background: var(--ink-3);
  transform: rotate(45deg); border-radius: 2px;
}
.searchbar input {
  flex: 1 1 auto; min-width: 0; border: 0; outline: 0; background: transparent;
  font-size: 15px; color: var(--ink); padding: 9px 2px; font-family: inherit;
}
.searchbar input::placeholder { color: var(--ink-3); }
.searchbar input::-webkit-search-cancel-button { cursor: pointer; }
.searchbar button {
  flex: 0 0 auto; border: 0; cursor: pointer;
  background: var(--brand); color: #fff;
  font-size: 14.5px; font-weight: 600; font-family: inherit;
  padding: 10px 24px; border-radius: 10px;
  transition: background .18s, transform .06s;
}
.searchbar button:hover { background: var(--brand-dark); }
.searchbar button:active { transform: translateY(1px); }


/* ---------- 筛选栏 ---------- */
.filters {
  margin: 24px auto 0; max-width: 860px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow-s);
  padding: 14px 18px;
}
.filter-row { display: flex; align-items: flex-start; gap: 12px; padding: 5px 0; }
.filter-row + .filter-row { border-top: 1px dashed var(--line-2); margin-top: 5px; padding-top: 11px; }
.filter-label {
  flex: 0 0 62px; font-size: 13px; color: var(--ink-3);
  line-height: 30px; white-space: nowrap;
}
.chips { display: flex; flex-wrap: wrap; gap: 7px; flex: 1 1 auto; }
.chip {
  font: inherit; font-size: 13px; cursor: pointer;
  color: var(--ink-2); background: var(--surface);
  border: 1px solid var(--line); border-radius: 999px;
  padding: 5px 14px; line-height: 1.5; transition: all .16s;
}
.chip:hover { color: var(--brand); border-color: #c7d3f8; }
.chip.is-active {
  background: var(--brand); border-color: var(--brand); color: #fff;
  box-shadow: 0 3px 10px rgba(43, 87, 214, .2);
}
.chip-status.is-active { background: #0f766e; border-color: #0f766e; box-shadow: 0 3px 10px rgba(15, 118, 110, .2); }
.chip-all.is-active { background: var(--ink); border-color: var(--ink); box-shadow: none; }


/* ---------- 汇总条 ---------- */
.summary {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
  margin: 22px 0 12px; padding: 12px 16px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow-s);
  font-size: 13.5px; color: var(--ink-2);
}
.summary .sum-item { display: inline-flex; align-items: center; gap: 6px; }
.summary .sum-item + .sum-item::before {
  content: ''; width: 1px; height: 14px; background: var(--line); margin-right: 3px;
}
.summary b { color: var(--ink); font-weight: 600; }
.summary .sum-kw { color: var(--brand); font-weight: 600; }
.summary .sum-err { color: #b4453c; }
/* 被来源上限截断时显示「已加载/总量」，提示没拿全 */
.summary .sum-cut {
  font-style: normal; font-size: 12px; color: #8a5a09;
  background: #fef7e8; border: 1px solid #f7e6c1;
  border-radius: 5px; padding: 1px 5px;
}

.notice {
  margin: 0 0 12px; padding: 10px 14px; font-size: 13px;
  color: #8a5a09; background: #fef7e8; border: 1px solid #f7e6c1;
  border-radius: var(--radius-s);
}


/* ---------- 旧进程检测条 ---------- */
/* 带 --noreload 起的服务改了 .py 不会重载，出现「新前端 + 旧后端」时给出明确指认 */
.code-warn {
  margin: 14px 0 0; padding: 11px 15px;
  background: #fdf2f1; border: 1px solid #f3cfcb; border-left: 3px solid #c4453c;
  border-radius: var(--radius-s);
  font-size: 13px; line-height: 1.7; color: #7d322c;
}
.code-warn b { display: block; margin-bottom: 2px; color: #a93b33; font-weight: 600; }
.code-warn code {
  font-family: ui-monospace, Consolas, monospace; font-size: 12px;
  background: #f7e2df; border-radius: 4px; padding: 1px 5px;
}
.foot-code {
  margin-left: 6px; padding: 1px 6px;
  font-family: ui-monospace, Consolas, monospace; font-size: 11px;
  color: var(--ink-3); background: var(--bg); border: 1px solid var(--line);
  border-radius: 4px;
}


/* ---------- 结果区（单列表） ---------- */
.results { padding-bottom: 40px; }

.panel {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow-s); overflow: hidden;
  animation: rise .22s ease both;
}
@keyframes rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.panel-body { padding: 2px 0; }


/* ---------- 单条结果：左内容 + 右按钮 ---------- */
.item {
  position: relative;
  display: flex; align-items: flex-start; gap: 16px;
  padding: 16px 18px 16px 19px;
  border-bottom: 1px solid var(--line-2);
  transition: background .15s;
}
.item:last-child { border-bottom: 0; }
.item:hover { background: #f8fafd; }
.item::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: transparent; transition: background .15s;
}
.item:hover::before { background: var(--brand); }

.item-main { flex: 1 1 auto; min-width: 0; }

.item-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 6px; }
.item-code {
  font-family: var(--mono); font-size: 13px; font-weight: 600;
  color: var(--brand-dark); background: var(--brand-soft);
  padding: 2px 9px; border-radius: 6px; white-space: nowrap;
}
.item-name {
  margin: 0 0 8px; font-size: 15.5px; font-weight: 600; line-height: 1.5;
  color: var(--ink); word-break: break-word;
}
.item-sub {
  margin: -4px 0 8px; font-size: 12.5px; color: var(--ink-3);
  line-height: 1.5; word-break: break-word;
}
.item-meta {
  display: flex; flex-wrap: wrap; gap: 6px 16px;
  font-size: 12.5px; color: var(--ink-2);
}
.item-meta span { display: inline-flex; align-items: center; gap: 5px; }
.item-meta .lbl { color: var(--ink-3); }

.item-side {
  flex: 0 0 auto; display: flex; flex-direction: column;
  align-items: flex-end; gap: 8px; padding-top: 2px;
}

.tag {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 12px; font-weight: 600; line-height: 1;
  padding: 4px 9px; border-radius: 999px; white-space: nowrap;
  border: 1px solid transparent;
}
.st-active    { background: #e7f6ef; color: #0b7a56; border-color: #c9ecdd; }
.st-pending   { background: #fef4e2; color: #a35d09; border-color: #f6e2bd; }
.st-revised   { background: #eef2ff; color: #3b52a8; border-color: #d9e1fb; }
.st-abolished { background: #f2f4f7; color: #6b7688; border-color: #e3e7ee; }
.st-unknown   { background: #f2f4f7; color: #6b7688; border-color: #e3e7ee; }
.tag-nature  { background: #f0f3fa; color: #4a5b78; border-color: #e0e6f2; }

.tag-src { border-width: 1px; }
.src-gb  { background: #eff5ff; color: #1e4fbe; border-color: #d5e3fd; }
.src-hy  { background: #eafaf7; color: #0a6f64; border-color: #cdeee9; }
.src-df  { background: #fdf5e9; color: #94500a; border-color: #f5e3c7; }
.src-tt  { background: #f5f0fe; color: #6531c4; border-color: #e4d8fb; }
.src-iso { background: #fdeef4; color: #a2154c; border-color: #f8d5e3; }

.btn-view {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 600; white-space: nowrap;
  color: var(--brand); background: var(--surface);
  border: 1px solid #c7d3f8; border-radius: 8px;
  padding: 8px 16px; transition: all .16s; cursor: pointer;
}
.btn-view:hover { background: var(--brand); border-color: var(--brand); color: #fff; }
.btn-view::after { content: '↗'; font-size: 12px; }
.btn-view.is-disabled {
  color: var(--ink-3); border-color: var(--line);
  background: var(--surface-2); cursor: not-allowed; pointer-events: none;
}
.btn-view.is-disabled::after { content: ''; }
/* 下载原文：原文公开的国标直达 openstd 官网阅读/下载页 */
.btn-dl {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 600; white-space: nowrap;
  color: #1c7a3d; background: #edf9f0;
  border: 1px solid #d3eeda; border-radius: 8px;
  padding: 8px 16px; transition: all .16s; cursor: pointer;
}
.btn-dl::after { content: '⤓'; font-size: 13px; }
.btn-dl:hover { background: #1c7a3d; border-color: #1c7a3d; color: #fff; }
/* 需要原文：原文不公开的标准，弹窗给人工代查渠道 */
.btn-need {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 600; white-space: nowrap;
  color: #94500a; background: #fdf5e9;
  border: 1px solid #f5e3c7; border-radius: 8px;
  padding: 8px 16px; transition: all .16s; cursor: pointer;
}
.btn-need::before { content: '✋'; font-size: 12px; }
.btn-need:hover { background: #94500a; border-color: #94500a; color: #fff; }
.item-idx { font-size: 11.5px; color: var(--ink-3); font-family: var(--mono); }


/* ---------- 「需要原文」弹窗 ---------- */
.need-mask {
  position: fixed; inset: 0; z-index: 999;
  display: none; align-items: center; justify-content: center;
  background: rgba(17, 24, 39, .55);
  padding: 20px;
}
.need-mask.is-open { display: flex; }
.need-dialog {
  position: relative; max-width: 420px; width: 100%;
  background: var(--surface); border-radius: 14px;
  padding: 30px 28px 26px; text-align: center;
  box-shadow: 0 18px 50px rgba(17, 24, 39, .3);
}
.need-close {
  position: absolute; top: 10px; right: 12px;
  font-size: 22px; line-height: 1; color: var(--ink-3);
  background: none; border: none; cursor: pointer; padding: 4px 8px;
}
.need-close:hover { color: var(--ink); }
.need-icon { font-size: 34px; margin-bottom: 8px; }
.need-title { font-size: 17px; font-weight: 700; color: var(--ink); margin: 0 0 10px; }
.need-desc { font-size: 13.5px; line-height: 1.7; color: var(--ink-2); margin: 0 0 16px; }
.need-item {
  background: var(--surface-2); border: 1px solid var(--line);
  border-radius: 10px; padding: 12px 14px; margin-bottom: 16px; text-align: left;
}
.need-lbl { font-size: 12px; color: var(--ink-3); margin-bottom: 5px; }
.need-std { font-size: 13.5px; line-height: 1.6; color: var(--ink); word-break: break-all; }
.need-std code {
  font-family: var(--mono); font-weight: 700; color: var(--brand);
}
.need-copy-row { display: flex; gap: 8px; justify-content: center; }
.need-copy {
  margin-top: 8px; font-size: 12px; font-weight: 600;
  color: var(--brand); background: var(--brand-soft);
  border: 1px solid #c7d3f8; border-radius: 6px;
  padding: 4px 10px; cursor: pointer; transition: all .16s;
}
.need-copy:hover { background: var(--brand); border-color: var(--brand); color: #fff; }
.need-contact { font-size: 14px; color: var(--ink-2); line-height: 1.6; }
.need-wx {
  font-family: var(--mono); font-size: 16px; font-weight: 700;
  color: #1c7a3d; background: #edf9f0;
  border: 1px dashed #a8dcb6; border-radius: 8px;
  padding: 3px 12px; margin: 0 4px;
  cursor: pointer; user-select: all; transition: all .16s;
}
.need-wx:hover { background: #1c7a3d; border-color: #1c7a3d; color: #fff; }


/* ---------- AI 检索中提示 ---------- */
.ai-loading {
  display: flex; align-items: center; gap: 9px;
  padding: 13px 18px; font-size: 13px; color: var(--brand);
  background: var(--brand-soft); border-bottom: 1px solid #e2e8fb;
}
.ai-spin {
  width: 13px; height: 13px; flex: 0 0 13px; border-radius: 50%;
  border: 2px solid #c3d0f7; border-top-color: var(--brand);
  animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }


/* ---------- 骨架屏 / 空态 / 错误态 ---------- */
.skel { padding: 15px 18px; border-bottom: 1px solid var(--line-2); }
.skel:last-child { border-bottom: 0; }
.skel-bar {
  height: 11px; border-radius: 6px; margin-bottom: 9px;
  background: linear-gradient(90deg, #eef1f7 25%, #e3e8f2 37%, #eef1f7 63%);
  background-size: 400% 100%;
  animation: shimmer 1.35s ease-in-out infinite;
}
.skel-bar.w-30 { width: 30%; }
.skel-bar.w-70 { width: 70%; height: 14px; }
.skel-bar.w-50 { width: 50%; }
@keyframes shimmer { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }

.state {
  padding: 46px 20px; text-align: center; color: var(--ink-3); font-size: 14px;
}
.state .state-icon { font-size: 26px; display: block; margin-bottom: 8px; opacity: .5; }
.state .state-title { color: var(--ink-2); font-weight: 600; margin-bottom: 4px; }
.state .state-desc { font-size: 13px; }
.state.is-error .state-title { color: #b4453c; }


/* ---------- 分页 ---------- */
.pager {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  padding: 14px 18px; border-top: 1px solid var(--line-2);
  background: var(--surface-2);
}
.pager:empty { display: none; }
.pager button {
  font: inherit; font-size: 13px; cursor: pointer;
  min-width: 34px; height: 32px; padding: 0 10px;
  color: var(--ink-2); background: var(--surface);
  border: 1px solid var(--line); border-radius: 8px;
  transition: all .15s;
}
.pager button:hover:not([disabled]):not(.is-active) {
  color: var(--brand); border-color: #c7d3f8; background: #f7f9ff;
}
.pager button[disabled] { opacity: .45; cursor: not-allowed; }
.pager button.is-active {
  background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 600;
}
.pager .pg-gap { color: var(--ink-3); padding: 0 2px; user-select: none; }
.pager .pg-info { margin-left: auto; font-size: 12.5px; color: var(--ink-3); }

/* 每页条数切换。数据全在本地，所以切页大小不需要联网 —— 做成纯本地按钮。
   margin-left:auto 让「每页 N 条」这一组自己和右侧对齐；
   若前面已有 .pg-info 抢走了 auto，这一组就自然跟在它后面。 */
.pager .pg-size {
  display: inline-flex; align-items: center; gap: 4px;
  margin-left: 14px; font-size: 12.5px; color: var(--ink-3);
}
.pager .pg-size button {
  min-width: 30px; height: 26px; padding: 0 7px; font-size: 12px;
  border-radius: 6px; color: var(--ink-3); background: transparent;
  border-color: transparent;
}
/* 未登录时后三档（20/50/100）是 disabled：不参与 hover 高亮，
   也不带任何锁点 / 悬停文案 —— 分页条上不做注册引导（2026-09-22）。
   灰化效果复用上面 .pager button[disabled] 那条。 */
.pager .pg-size button:hover:not(.is-active):not([disabled]) {
  color: var(--brand); background: var(--surface); border-color: var(--line);
}
.pager .pg-size button.is-active {
  color: var(--brand); font-weight: 600;
  background: var(--surface); border-color: #c7d3f8;
}


/* ---------- 过渡页 ---------- */
.page-leave { background: var(--bg); }
.leave-wrap { padding: 52px 20px 60px; }
.leave-card {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: 16px; box-shadow: var(--shadow);
  max-width: 660px; margin: 0 auto; padding: 38px 36px 30px; text-align: center;
  animation: rise .26s ease both;
}
.leave-icon {
  width: 54px; height: 54px; margin: 0 auto 18px; border-radius: 16px;
  display: grid; place-items: center; font-size: 24px; font-weight: 700;
  background: var(--brand-soft); color: var(--brand); border: 1px solid #d8e1fb;
}
.leave-icon.is-warn { background: #fdf2f2; color: #b4453c; border-color: #f5dcd9; }
.leave-title { margin: 0 0 12px; font-size: 21px; font-weight: 700; letter-spacing: -.2px; }
.leave-desc { margin: 0 0 22px; color: var(--ink-2); font-size: 14px; text-align: left; line-height: 1.75; }
.leave-desc b { color: var(--ink); }

.leave-target {
  margin: 0 0 24px; padding: 14px 18px; text-align: left;
  background: var(--surface-2); border: 1px solid var(--line-2); border-radius: var(--radius-s);
}
.leave-target > div { display: flex; gap: 14px; padding: 5px 0; font-size: 13.5px; }
.leave-target dt { flex: 0 0 68px; color: var(--ink-3); margin: 0; }
.leave-target dd { margin: 0; color: var(--ink); word-break: break-word; }

.leave-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.btn-primary {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  background: var(--brand); color: #fff; font-size: 14.5px; font-weight: 600;
  padding: 12px 30px; border-radius: 10px; border: 0; cursor: pointer; font-family: inherit;
  transition: background .18s, transform .06s, opacity .18s;
  box-shadow: 0 4px 14px rgba(43, 87, 214, .26);
}
.btn-primary:hover { background: var(--brand-dark); color: #fff; }
.btn-primary:active { transform: translateY(1px); }

/* 倒计时未结束时：不可点击 */
.btn-primary.is-locked {
  background: #97a6c4; color: #f2f5fa; cursor: not-allowed;
  box-shadow: none; pointer-events: none;
}
.btn-primary.is-locked .cd-num {
  display: inline-block; min-width: 22px; text-align: center;
  font-family: var(--mono); font-weight: 700;
  background: rgba(255, 255, 255, .22); border-radius: 6px; padding: 0 5px;
}
.btn-primary .cd-bar {
  display: none; width: 74px; height: 4px; border-radius: 2px;
  background: rgba(255, 255, 255, .28); overflow: hidden;
}
.btn-primary.is-locked .cd-bar { display: block; }
.btn-primary .cd-bar i {
  display: block; height: 100%; width: 0; background: #fff; border-radius: 2px;
  transition: width 1s linear;
}
.btn-ghost {
  background: var(--surface); color: var(--ink-2); font-size: 14.5px; font-weight: 600;
  padding: 12px 24px; border-radius: 10px; border: 1px solid var(--line);
  cursor: pointer; font-family: inherit; transition: all .16s;
}
.btn-ghost:hover { color: var(--ink); border-color: #cfd7e6; background: var(--surface-2); }
.leave-note { margin: 16px 0 0; font-size: 12.5px; color: var(--ink-3); }
.leave-note.is-ready { color: #0b7a56; }

.leave-qr {
  margin: 28px auto 0; padding: 18px;
  display: flex; align-items: center; gap: 18px; text-align: left;
  background: linear-gradient(180deg, #f7f9ff, var(--surface));
  border: 1px solid #e6ecfa; border-radius: var(--radius);
}
.leave-qr img {
  width: 116px; height: 116px; flex: 0 0 116px; object-fit: contain;
  background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 5px;
}
.leave-qr-text { display: flex; flex-direction: column; gap: 5px; }
.leave-qr-text strong { font-size: 14.5px; color: var(--ink); }
.leave-qr-text span { font-size: 12.5px; color: var(--ink-2); line-height: 1.6; }
.leave-qr.qr-failed img { display: none; }
.leave-qr.qr-failed::before {
  content: '二维码加载失败，请刷新页面重试';
  font-size: 12.5px; color: var(--ink-3); flex: 0 0 116px; text-align: center;
}


/* ---------- 页脚 ---------- */
/* 两条规则配合，保证页脚**永远贴在视口底部**、不随内容多少上下浮动：
   1) `margin-top:auto` —— 内容不足一屏时，被 body 的 flex 剩余空间推到最底下；
   2) `position:sticky; bottom:0` —— 内容超出一屏时，页脚跟着视口走，
      滚到哪里都停在底部，而不会滑出视野（这是 fixed 做不到「不遮挡正文」的地方：
      sticky 在文档最末尾会回到自己的自然位置，正文末尾不会被永久盖住）。
   背景必须不透明，否则滚动时能透出下面的文字。 */
.foot {
  margin-top: auto;
  border-top: 1px solid var(--line); background: var(--surface); padding: 22px 0 26px;
}
/* 原先这里是 `position: sticky; bottom: 0`（页脚常驻视口底部）。
   2026-09-22 加了二维码之后去掉了：页脚从一行字变成 90 多像素高的区块，
   常驻会把长列表的可视区一直压掉一截。`margin-top: auto` 已经能保证
   内容不足一屏时页脚依然贴在底部（靠的是 .page-main 的 flex），
   所以去掉 sticky 不丢「贴底」这个效果，只丢了「常驻」。 */
.foot p { margin: 0; font-size: 12.5px; color: var(--ink-3); line-height: 1.8; }
.foot p:first-child { color: var(--ink-2); }
.foot-sub { margin-top: 6px !important; }

/* ---------- 页脚二维码（官方微信交流群 + 站长微信） ---------- */
/* 文字在左、二维码在右；窄屏时上下堆叠。
   二维码是**竖排**的（图在上、说明在下）：横排时说明文字会把码挤得很窄，
   而码的尺寸直接决定能不能扫 —— 2026-09-22 用户反馈 92px「太小无法扫描」，
   所以尺寸固定 150px 并改成竖排，把横向空间全留给码本身。
   同一轮里从两张码减到一张（问题反馈群并进交流群），
   所以 `.foot-qr` 虽然还是 flex 容器，实际只会有一个子项。 */
.foot-inner { display: flex; align-items: center; justify-content: space-between; gap: 26px; }
.foot-text { min-width: 0; }
.foot-qr { display: flex; align-items: flex-start; gap: 26px; flex: 0 0 auto; }
.foot-qr-item {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  text-align: center;
}
.foot-qr-item img {
  width: 150px; height: 150px; flex: 0 0 150px; object-fit: contain;
  background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 5px;
}
.foot-qr-text { display: flex; flex-direction: column; gap: 2px; max-width: 150px; }
.foot-qr-text strong { font-size: 13px; color: var(--ink-2); font-weight: 600; }
.foot-qr-text span { font-size: 11.5px; color: var(--ink-3); line-height: 1.55; }
/* 站长微信号：比说明文字更「要照着敲」，所以给足对比度并单独一行。 */
.foot-qr-note {
  font-size: 12px; color: var(--ink-2); font-weight: 600;
  font-family: var(--mono, ui-monospace, Menlo, Consolas, monospace);
  letter-spacing: .2px;
  user-select: all;          /* 一键全选，方便复制去加好友 */
}
/* 图床挂了不留破图：整块换成一句人话 */
.foot-qr-item.qr-failed img { display: none; }
.foot-qr-item.qr-failed::before {
  content: '二维码加载失败\n请刷新页面重试';
  white-space: pre-line;
  width: 150px; min-height: 92px; display: flex; align-items: center; justify-content: center;
  text-align: center; font-size: 11.5px; line-height: 1.5; color: var(--ink-3);
  background: var(--bg); border: 1px dashed var(--line); border-radius: 10px;
}

/* ---------- 回到顶部（长页面右侧浮动按钮） ---------- */
/* 固定在最右侧、垂直居中略偏下：不挡内容（内容区有 max-width 居中），
   也不和右侧滚动条抢位置。长列表翻到第 5 页时不用一路滚回去。 */
.to-top {
  position: fixed; right: 18px; bottom: 88px; z-index: 40;
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  padding: 9px 8px; min-width: 46px;
  font-size: 11.5px; line-height: 1; color: var(--ink-2);
  background: var(--surface); border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 6px 18px rgba(16, 24, 40, .1);
  cursor: pointer;
  transition: opacity .18s ease, transform .18s ease, color .18s ease, border-color .18s ease;
}
.to-top:hover { color: var(--brand); border-color: var(--brand); transform: translateY(-2px); }
.to-top:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.to-top-arrow { font-size: 15px; line-height: 1; }
/* 隐藏用 opacity + pointer-events，而不是 display:none —— 保留过渡动画，
   同时确保隐藏时点不到（否则会出现「看不见但能点到」的幽灵按钮）。 */
.to-top.is-hidden { opacity: 0; pointer-events: none; transform: translateY(6px); }

@media (prefers-reduced-motion: reduce) {
  .to-top { transition: none; }
  .to-top:hover { transform: none; }
}


/* ---------- 响应式 ---------- */
@media (max-width: 720px) {
  .hero { padding: 30px 0 4px; }
  .hero-title { font-size: 22px; gap: 8px; }
  .ai-badge { font-size: 13px; padding: 3px 9px; }
  .hero-sub { font-size: 13.5px; }
  .searchbar { flex-wrap: wrap; padding: 10px 12px 12px; gap: 10px; }
  .searchbar-icon { display: none; }
  .searchbar input { flex: 1 1 100%; padding: 8px 2px; }
  .searchbar button { flex: 1 1 100%; padding: 11px 20px; }
  /* 顶栏不再整体隐藏 —— 它现在承载登录 / 用户中心入口，隐藏等于手机上无法登录。
     交给文件后面那段窄屏规则去收窄字号（见「新增组件的响应式」）。 */

  .filters { padding: 12px 14px; }
  .filter-row { flex-direction: column; gap: 4px; }
  .filter-label { flex: none; line-height: 1.6; }
  .chip { padding: 5px 12px; font-size: 12.5px; }

  .item { flex-direction: column; gap: 12px; padding: 14px 14px 14px 15px; }
  .item-side { flex-direction: row; align-items: center; justify-content: space-between; width: 100%; }
  .btn-view { padding: 8px 14px; }
  .item-idx { order: -1; }

  .pager { padding: 12px 14px; }
  .pager .pg-info { flex: 1 1 100%; margin-left: 0; text-align: center; padding-top: 6px; }
  .leave-card { padding: 28px 20px 24px; }
  .leave-qr { flex-direction: column; text-align: center; }
  .leave-actions { flex-direction: column; }
  .btn-primary, .btn-ghost { width: 100%; }
}


/* ==========================================================================
   以下为「分组排序 + 单选计数筛选 + 用户体系 / VIP 权益」新增的样式
   ========================================================================== */

/* ---------- 筛选胶囊上的分面计数 ---------- */
.chip-n {
  opacity: .62; font-weight: 500; margin-left: 1px;
  font-variant-numeric: tabular-nums;
}
.chip.is-active .chip-n { opacity: .85; }

/* ---------- 结果动作条（导出 / 收藏夹） ---------- */
.actions {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin: 0 0 12px;
}
.actions-info { font-size: 12.5px; color: var(--ink-3); }
.actions-btns { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.btn-act {
  display: inline-flex; align-items: center; gap: 6px;
  font: inherit; font-size: 13px; font-weight: 600;
  padding: 7px 14px; border-radius: 9px;
  border: 1px solid var(--line); background: var(--surface); color: var(--ink-2);
  cursor: pointer; transition: all .16s; white-space: nowrap;
}
.btn-act:hover { color: var(--brand); border-color: #c7d3f8; background: #f7f9ff; }
/* 非 VIP：按钮可见但带锁定徽标，点击引导到权益页 */
.btn-act.is-locked { color: var(--ink-3); background: var(--surface-2); }
.act-badge {
  font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 999px;
  background: linear-gradient(135deg, #b8860b, #e0a51c); color: #fff;
}

/* ---------- 收藏星标 ---------- */
.btn-star {
  display: inline-grid; place-items: center;
  width: 32px; height: 32px; border-radius: 9px;
  border: 1px solid var(--line); background: var(--surface); color: var(--ink-3);
  font-size: 16px; line-height: 1; cursor: pointer; font-family: inherit;
  transition: all .15s;
}
.btn-star:hover { color: #c98a00; border-color: #f0dcae; background: #fffaf0; }
.btn-star.is-on { color: #e0a51c; border-color: #f0dcae; background: #fffaf0; }
.btn-star.is-locked { color: var(--ink-3); background: var(--surface-2); }
.btn-star.is-locked:hover { color: #b8860b; border-color: #f0dcae; background: #fffaf0; }

/* ---------- 国标「强制 / 推荐」标签 ---------- */
.tag-nature.is-mandatory { background: #fdeeee; color: #9b3226; border-color: #f6d9d5; }
.tag-nature.is-recommended { background: #eef4ff; color: #2f4d9e; border-color: #dbe5fb; }

/* ---------- 国标「原文是否公开」标签 ----------
   数据来自 tools/scan_gb_fulltext.py 的离线扫描（detail2/gb 详情页快照），
   绿色 = 详情页有全文入口；灰色 = 无全文入口（原文不公开）。 */
.tag-ft.is-open   { background: #edf9f0; color: #1c7a3d; border-color: #d3eeda; }
/* 「原文不公开」标签已下线（判定不准）；.tag-ft.is-closed 样式保留但不再使用 */

/* ---------- 每页条数：移除锁定态样式（2026-09-22） ----------
   这里原本有一条 `.pg-size button.is-locked`（灰字 + 金色 hover）和 `.lock-dot`
   （4px 小黄点）。分页条上的注册引导撤掉后，两个类都不再出现在 DOM 里，
   样式一并删掉 —— 留着就是下一次「为什么这个类是死的」的疑问来源。
   现在不可选的档位走原生 `disabled`，灰化由 .pager button[disabled] 统一负责。 */
/* ---------- 汇总条新增项 ---------- */
.summary .sum-filter { color: var(--ink-2); }
.summary .sum-order { color: var(--ink-3); }

/* ---------- 过渡页的 VIP 提示 ---------- */
.leave-tip { margin: 14px 0 0; font-size: 12.5px; color: var(--ink-3); }
.leave-tip a { font-weight: 600; }

/* ---------- 登录 / 注册 ---------- */
.auth-wrap { padding: 46px 20px 70px; }
.auth-card {
  max-width: 420px; margin: 0 auto; padding: 32px 30px 26px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: 16px; box-shadow: var(--shadow);
}
.auth-title { margin: 0 0 8px; font-size: 21px; font-weight: 700; }
.auth-sub { margin: 0 0 20px; font-size: 13px; color: var(--ink-2); line-height: 1.7; }
.auth-errors {
  margin: 0 0 16px; padding: 10px 14px 10px 30px;
  border-radius: 10px; background: #fdf2f2; border: 1px solid #f5dcd9;
  color: #a93b33; font-size: 13px;
}
.auth-errors li + li { margin-top: 4px; }
.auth-form { display: flex; flex-direction: column; gap: 14px; }
.auth-field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--ink-2); }
.auth-field input {
  font: inherit; padding: 10px 12px; border: 1px solid var(--line);
  border-radius: 9px; background: var(--surface-2); color: var(--ink);
}
.auth-field input:focus {
  outline: none; border-color: #c7d3f8; background: #fff;
  box-shadow: 0 0 0 3px rgba(43, 87, 214, .10);
}
.auth-field em { font-style: normal; font-size: 11.5px; color: var(--ink-3); }
.btn-block {
  font: inherit; font-size: 14.5px; font-weight: 600; color: #fff;
  background: var(--brand); border: 0; border-radius: 10px;
  padding: 12px; cursor: pointer; transition: background .16s;
}
.btn-block:hover { background: var(--brand-dark); }
.auth-switch { margin: 18px 0 0; font-size: 13px; color: var(--ink-3); text-align: center; }
.auth-sep { margin: 0 6px; }

/* ---------- 用户中心（左侧菜单 + 右侧内容） ---------- */
/* 两列网格：左 244px 菜单列固定不动，右内容列自适应。
   桌面宽度下**始终保持左右两栏**（收窄到 720px 才折叠，与全站断点一致）：
   之前 900px 就折叠，笔记本开个开发者工具、或者窗口拖小一点，
   菜单就会跑到内容上方变成一行横排，看起来就像「排版错乱」。 */
.uc-wrap {
  padding: 30px 20px 60px;
  display: grid; grid-template-columns: 244px minmax(0, 1fr); gap: 24px;
  align-items: start;
}
.uc-main { min-width: 0; }          /* 允许长标准名换行而不撑破网格 */

/* 侧边栏：整条吸顶。右侧内容再长，菜单也一直停在视野里 */
.uc-side {
  position: sticky; top: 78px;      /* 顶栏高 62px，留点余量 */
  display: flex; flex-direction: column; gap: 12px;
  align-self: start;
}
.uc-user {
  display: flex; align-items: center; gap: 11px;
  padding: 13px 14px; border-radius: 13px;
  background: var(--surface); border: 1px solid var(--line);
}
.uc-avatar {
  width: 40px; height: 40px; border-radius: 11px; flex: 0 0 40px;
  display: grid; place-items: center; font-size: 17px; font-weight: 700;
  color: #fff; background: linear-gradient(135deg, var(--brand), #4f7cf0);
  box-shadow: 0 3px 10px rgba(43, 87, 214, .22);
}
.uc-user-text { display: flex; flex-direction: column; min-width: 0; }
.uc-name { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uc-role { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }

/* 菜单做成一张卡片，一眼能看出「这是一列可点的功能菜单」，
   而不是几条散落的链接 */
.uc-menu {
  display: flex; flex-direction: column; gap: 2px;
  padding: 9px; border-radius: 13px;
  background: var(--surface); border: 1px solid var(--line);
}
.uc-menu-title {
  font-size: 11.5px; color: var(--ink-3); letter-spacing: .4px;
  padding: 3px 9px 7px;
}
.uc-item {
  display: flex; align-items: center; gap: 9px;
  padding: 10px 10px; border-radius: 9px;
  /* 左侧竖条只在选中时着色；平时保留 3px 透明边框，避免选中时文字左右跳动 */
  border-left: 3px solid transparent;
  color: var(--ink-2); font-size: 13.5px;
  transition: background .15s, color .15s, border-color .15s;
}
.uc-item:hover { background: var(--surface-2); color: var(--ink); }
.uc-item.is-active {
  background: var(--brand-soft); color: var(--brand); font-weight: 700;
  border-left-color: var(--brand);
}
.uc-ico { font-size: 13px; width: 15px; text-align: center; opacity: .85; }
.uc-label { flex: 1 1 auto; }
.uc-badge {
  font-size: 10.5px; font-weight: 700; padding: 1px 6px; border-radius: 999px;
  background: var(--surface-2); color: var(--ink-3); border: 1px solid var(--line);
}
.uc-badge.is-ok { background: #fdf3d8; color: #8a6400; border-color: #eddcae; }
.uc-badge.is-warn { background: #fdf0ee; color: #a93b33; border-color: #f0d4cf; }

/* 侧边栏里的「当前系统权限」卡片 */
.uc-perm {
  display: flex; flex-direction: column; gap: 5px;
  padding: 13px 14px; border-radius: 13px;
  background: var(--surface); border: 1px solid var(--line);
}
.uc-perm-label { font-size: 11.5px; color: var(--ink-3); letter-spacing: .3px; }
.uc-perm-value { font-size: 14px; font-weight: 700; display: flex; align-items: center; gap: 6px; }
.uc-perm-sub { font-size: 11.5px; color: var(--ink-3); line-height: 1.6; }
.uc-perm .btn-block { margin-top: 6px; }
.uc-side-back { font-size: 12.5px; color: var(--ink-3); padding: 4px 2px; }
.uc-side-back:hover { color: var(--brand); }

/* 右侧内容 */
.uc-head { margin-bottom: 18px; }
.uc-title { margin: 0; font-size: 21px; font-weight: 700; letter-spacing: -.2px; }
.uc-sub { margin: 7px 0 0; font-size: 13.5px; color: var(--ink-2); line-height: 1.75; }

/* auto-fit + minmax：自动决定一列还是多列，不用为每个宽度段各写一条断点。
   右侧内容列被菜单挤窄时，三张卡会自己折成两列/一列。 */
.uc-cards {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px; margin-bottom: 20px;
}
.uc-card {
  display: flex; flex-direction: column; gap: 5px;
  padding: 15px 16px; border-radius: 13px;
  background: var(--surface); border: 1px solid var(--line);
}
.uc-card-k { font-size: 11.5px; color: var(--ink-3); }
.uc-card-v { font-size: 17px; font-weight: 700; display: flex; align-items: center; gap: 6px; }
.uc-card-d { font-size: 11.5px; color: var(--ink-3); line-height: 1.6; }

.uc-cta-card {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  flex-wrap: wrap; margin-bottom: 22px;
  padding: 17px 19px; border-radius: 13px;
  background: linear-gradient(135deg, #f4f7ff, #fbf7ff);
  border: 1px solid #dfe6fb;
}
.uc-cta-card h2 { margin: 0 0 5px; font-size: 15.5px; font-weight: 700; }
.uc-cta-card p { margin: 0; font-size: 12.5px; color: var(--ink-2); line-height: 1.75; }

.uc-block { margin-top: 22px; }
.uc-block-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; margin-bottom: 10px;
}
.uc-block-head h2 { margin: 0; font-size: 16px; font-weight: 700; }
.uc-more { font-size: 12.5px; }
.uc-notes { margin: 0; padding-left: 20px; font-size: 12.5px; color: var(--ink-2); line-height: 1.9; }
.uc-notes b { color: var(--ink); }
.uc-inline-cta { margin-top: 14px; display: flex; gap: 10px; flex-wrap: wrap; }

/* 「我的权益」顶部的权限卡 */
.uc-perm-card {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  flex-wrap: wrap; padding: 17px 19px; border-radius: 13px;
  background: var(--surface); border: 1px solid var(--line);
}
.uc-perm-card.is-ok { background: linear-gradient(135deg, #fffdf5, #fff9ec); border-color: #eddcae; }
.uc-perm-card-main { display: flex; flex-direction: column; gap: 5px; }
.uc-perm-card-k { font-size: 11.5px; color: var(--ink-3); }
.uc-perm-card-v { font-size: 18px; font-weight: 700; display: flex; align-items: center; gap: 6px; }
.uc-perm-card-d { font-size: 12.5px; color: var(--ink-2); }
.uc-perm-card-act { display: flex; gap: 8px; }

.btn-sm { padding: 9px 18px; font-size: 13.5px; }

.center-count { font-size: 12.5px; color: var(--ink-3); }

/* ---------- 会员权益对比页 ---------- */
.vip-wrap { padding: 40px 20px 80px; }
.vip-hero { max-width: 720px; margin: 0 auto 30px; text-align: center; }
.vip-title { margin: 0 0 12px; font-size: 27px; font-weight: 700; letter-spacing: -.3px; }
.vip-sub { margin: 0 0 14px; color: var(--ink-2); font-size: 14.5px; line-height: 1.8; }
.vip-state { margin: 0; font-size: 13px; color: var(--ink-3); }
.vip-state.is-ok { color: #0b7a56; font-weight: 600; }
.vip-table-wrap {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: 14px; box-shadow: var(--shadow); overflow: hidden;
}
.vip-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.vip-table th, .vip-table td {
  padding: 14px 18px; text-align: left; vertical-align: top;
  border-bottom: 1px solid var(--line-2);
}
.vip-table thead th {
  background: var(--surface-2); font-size: 13px; color: var(--ink-2);
  border-bottom: 1px solid var(--line); white-space: nowrap;
}
.vip-table thead .col-func { width: 46%; }
.vip-table thead .col-normal { background: #f7f9fd; }
.vip-table thead .col-vip { background: #fdf6e6; color: #8a6300; }
.vip-table tbody th { font-weight: 600; color: var(--ink); }
.vip-table tbody th em {
  display: block; font-style: normal; font-weight: 400;
  font-size: 12.5px; color: var(--ink-3); margin-top: 4px; line-height: 1.6;
}
.vip-table tbody td { color: var(--ink-2); }
.vip-table tbody td:nth-child(2) { background: #fcfdff; }
.vip-table tbody td:nth-child(3) { background: #fffcf3; }
.vip-table td.yes { color: #0b7a56; font-weight: 600; }
.vip-table td.no { color: var(--ink-3); }
.vip-table tbody tr:last-child th, .vip-table tbody tr:last-child td { border-bottom: 0; }
.vip-notes { margin: 26px 0 0; }
.vip-notes h2 { margin: 0 0 10px; font-size: 15.5px; font-weight: 700; }
.vip-notes ul { margin: 0; padding-left: 20px; }
.vip-notes li { font-size: 13.5px; color: var(--ink-2); line-height: 1.85; margin-bottom: 8px; }
.vip-notes b { color: var(--ink); }
.vip-cta { margin-top: 26px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.vip-cta-note { font-size: 13px; color: var(--ink-3); }

/* ---------- 新增组件的响应式 ---------- */
/* 用户中心不到「真·窄屏」不折叠：保持左侧菜单，只把三张卡收成两列 */
@media (max-width: 900px) {
  .uc-cards { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
}

@media (max-width: 720px) {
  /* 用户中心：真·窄屏才把侧边栏折到内容上方，菜单改成一行横排 */
  .uc-wrap { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .uc-side { position: static; }
  .uc-menu { flex-direction: row; flex-wrap: wrap; gap: 6px; }
  .uc-menu-title { display: none; }
  .uc-item { padding: 8px 11px; border-left: 0; }
  .uc-item.is-active { border-left: 0; }

  /* 顶栏承载登录/会员入口，必须留着 */
  .topnav { justify-content: flex-end; gap: 4px; font-size: 12px; }
  .nav-link { padding: 4px 7px; }

  .actions { flex-direction: column; align-items: stretch; }
  .actions-btns { margin-left: 0; }
  .btn-act { flex: 1 1 auto; justify-content: center; }

  /* 页脚：窄屏改成上下堆叠。二维码只从 150 收到 132 ——
     **不要跟着屏幕一起缩到几十像素**：手机上正是要扫码的时候，
     缩小的码就等于没有。 */
  .foot-inner { flex-direction: column; align-items: flex-start; gap: 16px; }
  .foot-qr { gap: 16px; }
  .foot-qr-item { gap: 6px; }
  .foot-qr-item img { width: 132px; height: 132px; flex-basis: 132px; }
  .foot-qr-text { max-width: 132px; }
  /* 窄屏省掉宣传性的说明文字，但**站长微信号必须留着** ——
     那正是手机用户最可能要用的一条信息（复制去加好友）。 */
  .foot-qr-text span:not(.foot-qr-note) { display: none; }
  .foot-qr-note { display: block; }

  /* 回到顶部：手机上缩小并贴近右下，避免压住结果卡片右侧 */
  .to-top { right: 10px; bottom: 74px; padding: 8px 6px; min-width: 40px; }
  .to-top-text { display: none; }         /* 小屏只留箭头，省横向空间 */

  .vip-table { font-size: 13px; }
  .vip-table th, .vip-table td { padding: 11px 12px; }
  .vip-table thead .col-func { width: auto; }
  .vip-table tbody th { font-size: 13px; }
  .vip-table thead th { white-space: normal; }

  /* 用户中心：窄屏下三张卡压成一列（auto-fit 已能自动处理，这里兜个底） */
  .uc-cards { grid-template-columns: minmax(0, 1fr); }
  .uc-wrap { padding: 22px 20px 56px; }
  .uc-title { font-size: 19px; }
  .uc-perm-card { flex-direction: column; align-items: flex-start; }

  .auth-card { padding: 26px 20px 22px; }
}

/* ==========================================================================
   开通 VIP 入口 / 价格标识
   --------------------------------------------------------------------------
   价格文案一律由 settings.VIP_PRICE_TEXT 注入（模板里是 {{ vip_price }}，
   前端是 USER.vip_price），样式只管显示，不写死价格字符串 ——
   调价时只改 settings 一行。
   ========================================================================== */

/* 价格小胶囊：跟在「会员权益」后面 / 跟在卡片标题后面 */
.price-chip {
  display: inline-block; margin-left: 6px; padding: 1px 7px;
  font-size: 11px; font-weight: 700; border-radius: 999px;
  background: linear-gradient(135deg, #b8860b, #e0a51c); color: #fff;
  white-space: nowrap; vertical-align: 1px;
}
.vip-price-strong { color: #b8860b; }

/* 开通按钮本身包在 <form> 里（POST 提交，带 CSRF），所以表单不能是块级撑满 */
.upgrade-form { display: inline-block; margin: 0; }
.btn-upgrade {
  display: inline-flex; align-items: center; gap: 9px;
  text-decoration: none; white-space: nowrap;
}
/* 按钮里的价格牌：半透明白，压在品牌蓝上仍然清楚 */
.price-tag {
  font-size: 12px; font-weight: 700; padding: 2px 9px; border-radius: 999px;
  background: rgba(255, 255, 255, .22); color: #fff; white-space: nowrap;
}
.btn-upgrade:hover .price-tag { background: rgba(255, 255, 255, .32); }

/* 权益页顶部的开通区 */
.vip-hero-cta {
  display: flex; align-items: center; justify-content: center;
  gap: 12px; flex-wrap: wrap; margin-top: 16px;
}
.vip-hero-note { font-size: 12.5px; color: var(--ink-3); }

/* 首页 hero 下的数据量说明 */
.hero-stat {
  margin: -14px 0 24px; font-size: 13px; color: var(--ink-2);
}
.hero-stat b { color: var(--brand); font-weight: 700; }

/* 首页非 VIP 的常驻引导条（放在结果动作条下方） */
.vip-hint {
  margin: 0 0 14px; padding: 10px 14px; font-size: 13px;
  color: #8a5a09; background: linear-gradient(180deg, #fffaf0, #fef7e8);
  border: 1px solid #f7e6c1; border-radius: var(--radius-s);
}
.vip-hint b { color: #a8610a; }
.vip-hint a { color: var(--brand); text-decoration: none; font-weight: 600; white-space: nowrap; }
.vip-hint a:hover { text-decoration: underline; }

/* 用户中心「开通 VIP」卡片的补充说明行 */
.uc-cta-sub { margin: 6px 0 0 !important; font-size: 12.5px !important; color: var(--ink-3) !important; }

/* 侧栏里的开通按钮：撑满侧栏宽度（原来靠 .btn-block，现在按钮在表单里） */
.uc-perm .upgrade-form { display: block; }
.uc-perm .btn-upgrade { width: 100%; flex-direction: column; gap: 4px; padding: 9px 14px; font-size: 13.5px; }
.uc-perm .btn-upgrade .price-tag { font-size: 11px; }

/* 权益对比表的「价格」行：整张表里用户最先找的就是这一行，给它一点底色 */
.vip-table tr.row-price th,
.vip-table tr.row-price td { background: #fffaf0; }
.vip-table tr.row-price td { font-weight: 700; }

/* ==========================================================================
   本地标准库 · 高级检索（/advanced/）
   —— VIP 专属页面。自带表单 + 分面筛选 + 服务端渲染结果，不依赖 JS。
   ========================================================================== */

/* ---------- 顶部说明 ---------- */
.adv-hero { padding: 30px 0 18px; }
.adv-title {
  margin: 0 0 12px; font-size: 25px; font-weight: 700; letter-spacing: -.2px;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.adv-sub {
  margin: 0; max-width: 860px; font-size: 14px; line-height: 1.8; color: var(--ink-2);
}
.adv-sub b { color: var(--ink); font-weight: 600; }

.adv-stats {
  display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px;
}
.adv-stat {
  flex: 0 0 auto; min-width: 128px;
  padding: 12px 16px; background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--radius-s);
  box-shadow: var(--shadow-s);
}
.adv-stat b {
  display: block; font-size: 19px; font-weight: 700; color: var(--brand-dark);
  font-family: var(--mono); letter-spacing: -.3px;
}
.adv-stat span { display: block; margin-top: 2px; font-size: 12px; color: var(--ink-3); }
.adv-stat-quiet b { font-size: 13.5px; color: var(--ink-2); }

/* ---------- 检索表单 ---------- */
.adv-form {
  margin: 16px 0 0; padding: 16px 18px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow-s);
}
.adv-form-row {
  display: flex; flex-wrap: wrap; gap: 12px 14px; align-items: flex-end;
}
.adv-form-row + .adv-form-row { margin-top: 13px; }
.adv-field { display: flex; flex-direction: column; gap: 5px; flex: 1 1 180px; min-width: 0; }
.adv-field-wide { flex: 1 1 300px; }
.adv-field-sort { flex: 0 0 auto; }
.adv-field-label { font-size: 12px; font-weight: 600; color: var(--ink-3); }
.adv-field input[type="text"],
.adv-field input[type="search"],
.adv-field input[type="date"],
.adv-field select {
  font: inherit; font-size: 13.5px; color: var(--ink);
  padding: 8px 11px; width: 100%;
  border: 1px solid var(--line); border-radius: var(--radius-s);
  background: var(--surface-2); transition: border-color .15s, background .15s;
}
.adv-field input:focus, .adv-field select:focus {
  outline: none; border-color: #b9c8f5; background: var(--surface);
  box-shadow: 0 0 0 3px rgba(43, 87, 214, .08);
}
.adv-form-foot { align-items: center; justify-content: space-between; }
.adv-check {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 13px; color: var(--ink-2); cursor: pointer; user-select: none;
}
.adv-check input { width: 15px; height: 15px; accent-color: var(--brand); }
.adv-form-actions { display: flex; gap: 9px; align-items: center; margin-left: auto; }
.btn-act-primary {
  background: var(--brand); border-color: var(--brand); color: #fff;
}
.btn-act-primary:hover {
  background: var(--brand-dark); border-color: var(--brand-dark); color: #fff;
}
.btn-act-quiet { color: var(--ink-3); }

/* ---------- 分面筛选 ---------- */
.adv-facets {
  margin: 14px 0 0; padding: 14px 18px 4px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow-s);
}
.adv-facet-row {
  display: flex; align-items: flex-start; gap: 12px; padding: 6px 0;
  border-bottom: 1px dashed var(--line-2);
}
.adv-facet-row:last-of-type { border-bottom: 0; }
.adv-facet-label {
  flex: 0 0 62px; padding-top: 5px;
  font-size: 12px; font-weight: 600; color: var(--ink-3); white-space: nowrap;
}
.adv-chips { display: flex; flex-wrap: wrap; gap: 6px; flex: 1 1 auto; min-width: 0; }
.adv-chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12.5px; line-height: 1; padding: 6px 10px;
  border: 1px solid var(--line); border-radius: 999px;
  background: var(--surface-2); color: var(--ink-2);
  transition: all .15s; white-space: nowrap;
}
.adv-chip:hover { color: var(--brand); border-color: #c7d3f8; background: #f7f9ff; }
.adv-chip.is-on {
  background: var(--brand); border-color: var(--brand); color: #fff;
  box-shadow: 0 3px 10px rgba(43, 87, 214, .2);
}
.adv-chip-n { font-size: 11px; opacity: .62; font-family: var(--mono); }
.adv-chip.is-on .adv-chip-n { opacity: .88; }
.adv-facet-reset { margin: 2px 0 12px; font-size: 12.5px; text-align: right; }

/* ---------- 结果动作条 ---------- */
.adv-actions {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap; margin: 18px 0 10px;
}
.adv-actions-info { font-size: 13px; color: var(--ink-2); }
.adv-actions-info b { color: var(--brand); font-weight: 700; }

/* ---------- 结果列表 ---------- */
.adv-results {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow);
  overflow: hidden;
}
.item-adv { padding-bottom: 14px; }
.item-adv .adv-field-line {
  display: flex; align-items: flex-start; gap: 8px;
  margin-top: 8px; font-size: 12.5px; line-height: 1.75;
}
.item-adv .adv-field-line .lbl {
  flex: 0 0 auto; color: var(--ink-3); padding-top: 1px;
}
.adv-tags { display: flex; flex-wrap: wrap; gap: 5px 7px; }
.adv-org {
  display: inline-block; padding: 2px 8px; border-radius: 999px;
  background: var(--brand-soft); color: var(--brand-dark);
  border: 1px solid #dde5fb; font-size: 12px;
  transition: all .14s;
}
.adv-org:hover { background: var(--brand); color: #fff; border-color: var(--brand); }
.adv-writers { color: var(--ink-2); word-break: break-word; }
.adv-val { color: var(--ink); font-weight: 600; font-family: var(--mono); font-size: 12px; }

/* ---------- 分页 ---------- */
.adv-pager {
  display: flex; align-items: center; justify-content: center; gap: 14px;
  margin: 18px 0 6px;
}
.adv-pg {
  display: inline-block; padding: 7px 15px; font-size: 13px; font-weight: 600;
  border: 1px solid var(--line); border-radius: var(--radius-s);
  background: var(--surface); color: var(--ink-2);
}
.adv-pg:hover { color: var(--brand); border-color: #c7d3f8; background: #f7f9ff; }
.adv-pg.is-disabled { color: var(--ink-3); background: var(--surface-2); opacity: .7; }
.adv-pg-info { font-size: 12.5px; color: var(--ink-3); }
.adv-empty {
  margin: 26px 0; padding: 30px 20px; text-align: center;
  font-size: 13.5px; color: var(--ink-3);
  background: var(--surface); border: 1px dashed var(--line);
  border-radius: var(--radius);
}

/* ---------- 未开通 / 未建库的引导块 ---------- */
.adv-lock {
  margin: 18px 0 8px; padding: 24px 26px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow);
}
.adv-lock-title { margin: 0 0 10px; font-size: 18px; font-weight: 700; }
.adv-lock-text {
  margin: 0 0 14px; font-size: 13.5px; line-height: 1.85; color: var(--ink-2);
  max-width: 820px;
}
.adv-lock-text b { color: var(--brand); font-weight: 700; }
.adv-code {
  margin: 0; padding: 12px 14px; overflow-x: auto;
  font-family: var(--mono); font-size: 12.5px; line-height: 1.75;
  color: var(--ink-2); background: var(--surface-2);
  border: 1px solid var(--line); border-radius: var(--radius-s);
}

/* 索引过期告警。这类「静默少结果」的故障必须显眼，不能只写进日志。 */
.adv-fts-warn {
  margin: 14px 0 0; padding: 11px 14px;
  font-size: 12.5px; line-height: 1.8;
  color: #8a5a00; background: #fff9ec;
  border: 1px solid #f2e0b8; border-radius: var(--radius-s);
}
.adv-fts-warn b { color: #6d4700; font-weight: 700; }
.adv-fts-warn code {
  padding: 1px 6px; font-family: var(--mono); font-size: 12px;
  background: #fff; border: 1px solid #f2e0b8; border-radius: 4px;
}


/* ---------- 注册即送 / 打磨中 / 过渡页引导（2026-09-22） ---------- */

/* 用户中心：注册送 VIP 的落地提示。送出去的东西要让用户第一眼看见，
   所以用「成功态」的配色，而不是和普通说明文字一个样子。 */
.uc-welcome {
  margin: 0 0 18px; padding: 14px 18px;
  font-size: 13.5px; line-height: 1.85; color: #14532d;
  background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: var(--radius);
}
.uc-welcome b { color: #166534; font-weight: 700; }
.uc-welcome a { color: #166534; font-weight: 600; }

/* 「打磨中」小标签：挂在权益对比表的行标题上。
   比删掉整行好 —— 删了以后要恢复就得重写，不标又变成对未开放功能的承诺。 */
.soon-tag {
  display: inline-block; margin-top: 6px; padding: 1px 7px;
  font-size: 11px; font-weight: 600; font-style: normal;
  color: #8a5a00; background: #fff9ec;
  border: 1px solid #f2e0b8; border-radius: 999px;
}
.vip-table tbody tr.row-soon th { color: var(--ink-2); }
.vip-table tbody tr.row-soon td.yes { color: var(--ink-2); }

/* 表格下方对「打磨中」的统一交代 */
.vip-table-note {
  margin: 14px 0 0; font-size: 12.5px; line-height: 1.85; color: var(--ink-3);
}
.vip-table-note b { color: var(--ink-2); }

/* 过渡页：二维码已统一到页脚，这里只留一句引导 */
.leave-qr-hint {
  margin: 24px auto 0; font-size: 12.5px; line-height: 1.8;
  text-align: center; color: var(--ink-3);
}


/* ---------- 标准导航页（/nav/，2026-09-24） ---------- */

/* 首页 hero 变体：导航页的标题更小、说明更短，不抢卡片的风头 */
.hero-nav { padding-bottom: 10px; }

/* 首页 hero 下的导航入口行：低调，不与搜索框抢注意力 */
.hero-navlink {
  margin: 14px 0 0; font-size: 13px; color: var(--ink-2);
}
.hero-navlink a { font-weight: 600; }

/* 分区标题：左侧色点区分「国内 / 国际」两大类 */
.nav-section { margin: 26px 0 8px; }
.nav-section-title {
  display: flex; align-items: center; gap: 8px;
  margin: 0 0 4px; font-size: 19px; font-weight: 800; color: var(--ink);
}
.nav-section-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--brand); flex: none;
}
.nav-dot-international { background: var(--iso); }
.nav-dot-law { background: var(--law); }
.nav-dot-compliance { background: var(--sec); }
.nav-dot-thirdparty { background: var(--search); }

/* 必应直达搜索框（/nav/gb/ 页顶）：纯 GET 表单，提交后新标签页出结果 */
.nav-qsearch {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  margin: 0 0 22px; padding: 14px 16px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow-s);
}
.nav-qsearch-label {
  font-size: 13px; font-weight: 700; color: var(--ink-2); white-space: nowrap;
}
.nav-qsearch input[type=search] {
  flex: 1; min-width: 220px; padding: 8px 12px;
  border: 1px solid var(--line); border-radius: var(--radius-s);
  background: var(--surface-2); color: var(--ink); font-size: 14px;
}
.nav-qsearch input[type=search]:focus {
  outline: none; border-color: var(--brand); background: #fff;
}
.nav-qsearch-btn {
  padding: 8px 16px; border: 0; border-radius: var(--radius-s);
  background: var(--brand); color: #fff;
  font-size: 14px; font-weight: 600; cursor: pointer;
}
.nav-qsearch-btn:hover { background: var(--brand-dark); }
/* 提示文字独占一行：flex-basis 100% 比改结构省事 */
.nav-qsearch-hint { flex: 1 0 100%; margin: 0; font-size: 12px; color: var(--ink-3); }
.nav-section-sub {
  margin: 0 0 14px; font-size: 13px; line-height: 1.7; color: var(--ink-2);
}

/* 卡片网格：手机 1 列，≥640px 2 列，≥980px 3 列 */
.nav-grid {
  display: grid; gap: 12px;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) { .nav-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 980px) { .nav-grid { grid-template-columns: repeat(3, 1fr); } }

/* 卡片本体：整卡可点（就是 <a>），hover 抬升 + 品牌色描边 */
.nav-card {
  display: flex; flex-direction: column; gap: 8px;
  padding: 16px 16px 13px;
  background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-s);
  color: var(--ink);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.nav-card:hover {
  transform: translateY(-2px);
  border-color: var(--brand);
  box-shadow: var(--shadow);
}
.nav-card-head {
  display: flex; align-items: baseline; gap: 6px;
}
.nav-card-name { font-size: 15px; font-weight: 700; }
.nav-card-ext {
  margin-left: auto; font-size: 12px; color: var(--ink-3);
  transition: color .15s ease;
}
.nav-card:hover .nav-card-ext { color: var(--brand); }

/* 标签：颜色键复用检索页五种来源色变量，与全站视觉一致 */
.nav-card-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.nav-tag {
  padding: 1px 8px; font-size: 11px; font-weight: 600; font-style: normal;
  border-radius: 999px;
}
.nav-tag-gb  { color: var(--gb);  background: #eff6ff; }
.nav-tag-hy  { color: var(--hy);  background: #f0fdfa; }
.nav-tag-df  { color: var(--df);  background: #fffbeb; }
.nav-tag-tt  { color: var(--tt);  background: #f5f3ff; }
.nav-tag-iso { color: var(--iso); background: #fdf2f8; }
.nav-tag-law { color: var(--law); background: #fef2f2; }
.nav-tag-jl  { color: var(--jl);  background: #f0f9ff; }
.nav-tag-sec { color: var(--sec); background: #eef2ff; }
.nav-tag-search { color: var(--search); background: #f1f5f9; }

.nav-card-desc {
  font-size: 12.8px; line-height: 1.75; color: var(--ink-2);
}

/* 卡片底部：裸域名灰字 + 「站内检索」链接（后者只在国内条目出现） */
.nav-card-foot {
  margin-top: auto; padding-top: 9px;
  border-top: 1px solid var(--line-2);
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.nav-card-site { font-size: 11.5px; color: var(--ink-3); word-break: break-all; }
.nav-card-local {
  flex: none; font-size: 12px; font-weight: 600; color: var(--brand);
  cursor: pointer;
}
.nav-card-local:hover { color: var(--brand-dark); text-decoration: underline; }

/* 页尾说明 */
.nav-note {
  margin: 26px 0 8px; padding-top: 14px;
  border-top: 1px solid var(--line-2);
  font-size: 12px; line-height: 1.8; color: var(--ink-3);
}

/* 「目录尚未就位」提示里打出来的投放目录：等宽 + 可换行，
   方便直接照抄 / 复制这个路径去放文件。 */
.nav-note .catalog-dir {
  display: inline-block; margin: 0; padding: 3px 9px;
  border: 1px solid var(--line); border-radius: var(--radius-s);
  background: var(--surface-2);
  font-family: var(--mono); font-size: 12px; color: var(--ink-2);
  word-break: break-all;
}


/* ---------- 行标目录：代号目录（2026-10-05） ---------- */
.hy-catalog {
  display: grid; grid-template-columns: 1fr; gap: 8px;
  margin-top: 14px;
}
@media (min-width: 640px) { .hy-catalog { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 980px) { .hy-catalog { grid-template-columns: repeat(3, 1fr); } }
.hy-item {
  display: flex; align-items: center; gap: 10px;
  border: 1px solid var(--line); border-radius: 10px;
  padding: 8px 12px; background: #fff;
}
.hy-code {
  flex: none; min-width: 40px; text-align: center;
  font-family: var(--mono); font-size: 12.5px; font-weight: 700;
  color: var(--hy); background: #f0fdfa;
  border: 1px solid #99f6e4; border-radius: 7px; padding: 2px 0;
}
.hy-name { font-size: 13.5px; font-weight: 600; color: var(--ink); flex: none; }
.hy-dept {
  font-size: 11.5px; color: var(--ink-3);
  margin-left: auto; text-align: right;
}

/* ---------- 文件处理：PDF 工具页（2026-10-05） ---------- */
.tool-card {
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 6px 20px rgba(16, 32, 71, .06);
  padding: 22px; max-width: 640px; margin: 0 auto 26px;
  display: flex; flex-direction: column; gap: 18px;
}
.tool-field { display: flex; flex-direction: column; gap: 7px; }
.tool-label { font-size: 13px; font-weight: 700; color: var(--ink); }
.tool-input {
  width: 100%; box-sizing: border-box;
  border: 1px solid var(--line); border-radius: 9px;
  padding: 9px 12px; font-size: 14px; color: var(--ink);
  background: #fff; transition: border-color .15s, box-shadow .15s;
}
.tool-input:focus {
  outline: none; border-color: var(--brand);
  box-shadow: 0 0 0 3px var(--brand-soft);
}
.tool-hint { margin: 0; font-size: 12px; color: var(--ink-3); line-height: 1.55; }
.tool-check {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13.5px; color: var(--ink-2);
  margin-right: 18px; cursor: pointer;
}
.tool-check input { accent-color: var(--brand); width: 15px; height: 15px; }
.tool-actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.tool-btn {
  border: none; border-radius: 9px; cursor: pointer;
  background: var(--brand); color: #fff;
  font-size: 14px; font-weight: 600; padding: 10px 26px;
  box-shadow: 0 2px 8px rgba(43, 87, 214, .24);
  transition: background .15s, transform .1s;
}
.tool-btn:hover { background: var(--brand-dark); }
.tool-btn:active { transform: translateY(1px); }
.tool-btn:disabled { opacity: .6; cursor: not-allowed; }
.tool-status { font-size: 13px; color: var(--ink-2); }
.tool-status.is-err { color: #d92d20; font-weight: 600; }

/* ---------- 标准服务：工具布局（左侧菜单，2026-10-05 下午） ---------- */
.tool-layout {
  display: grid; grid-template-columns: 168px 1fr; gap: 28px;
  padding-top: 30px; align-items: start;
}
.tool-side {
  position: sticky; top: 78px;
  display: flex; flex-direction: column; gap: 2px;
  padding: 12px 10px;
  background: #fff; border: 1px solid var(--line); border-radius: 12px;
}
.tool-side-title {
  margin: 0 0 8px; font-size: 13px; font-weight: 700;
}
.tool-side-title a { color: var(--ink); }
.tool-side-title a:hover { color: var(--brand); }
/* 一级菜单 = <details> 折叠组，标题大字号；二级 = 小字号链接（2026-10-05 晚） */
.tool-side-group { margin: 6px 0 0; }
.tool-side-head {
  display: flex; align-items: center;
  list-style: none; cursor: pointer;
  font-size: 15.5px; font-weight: 700; color: var(--ink);
  padding: 7px 8px; margin: 0 -8px; border-radius: 8px;
  user-select: none;
  transition: background .15s;
}
.tool-side-head::-webkit-details-marker { display: none; }
.tool-side-head:hover { background: var(--brand-soft); }
.tool-side-caret {
  margin-left: auto; font-size: 10px; color: var(--ink-3);
  transition: transform .18s;
}
.tool-side-group[open] .tool-side-head .tool-side-caret { transform: rotate(180deg); }
.tool-side-items { display: flex; flex-direction: column; padding: 2px 0 6px 10px; }
.tool-side-link {
  color: var(--ink-2); font-size: 12.5px;
  padding: 5px 9px; margin: 0 -9px; border-radius: 8px;
  transition: color .15s, background .15s;
}
.tool-side-link:hover { color: var(--brand); background: var(--brand-soft); }
.tool-side-link.is-active {
  color: var(--brand); background: var(--brand-soft); font-weight: 600;
}
@media (max-width: 760px) {
  .tool-layout { grid-template-columns: 1fr; gap: 16px; padding-top: 20px; }
  .tool-side {
    position: static; flex-direction: row; flex-wrap: wrap; gap: 2px 4px;
  }
  .tool-side-title { width: 100%; margin-bottom: 2px; }
  .tool-side-group { width: 100%; margin: 6px 0 0; }
  .tool-side-head { font-size: 14px; padding: 5px 8px; }
  .tool-side-items { flex-direction: row; flex-wrap: wrap; padding-left: 0; }
  .tool-side-link { padding: 4px 8px; margin: 0; }
}

/* 工具页标题（比首页 hero 紧凑） */
.tool-main .hero { padding: 4px 0 10px; text-align: left; }
.tool-main .hero-title { font-size: 22px; }
.tool-main .hero-sub { font-size: 13.5px; margin-bottom: 14px; }

/* 汇总页工具卡网格 */
.tool-grid { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 14px; }
@media (min-width: 640px) { .tool-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 980px) { .tool-grid { grid-template-columns: repeat(3, 1fr); } }
.tool-grid-card {
  display: flex; flex-direction: column; gap: 6px;
  background: #fff; border: 1px solid var(--line); border-radius: 12px;
  padding: 14px 16px;
  transition: border-color .15s, box-shadow .15s, transform .1s;
}
.tool-grid-card:hover {
  border-color: var(--brand);
  box-shadow: 0 8px 22px rgba(43, 87, 214, .12);
  transform: translateY(-1px);
}
.tool-grid-name { font-size: 15px; font-weight: 700; color: var(--ink); }
.tool-grid-card:hover .tool-grid-name { color: var(--brand); }
.tool-grid-desc { font-size: 12.5px; color: var(--ink-2); line-height: 1.55; }

/* 表单内联行 / 小按钮 / 次级按钮 */
.tool-inline { flex-direction: row; flex-wrap: wrap; gap: 8px 18px; }
.tool-inline-item { display: inline-flex; align-items: center; gap: 8px; }
.tool-input-auto { width: auto; }
.tool-card-wide { max-width: 860px; }
.tool-btn-ghost {
  background: #fff; color: var(--brand);
  border: 1px solid var(--brand); box-shadow: none;
}
.tool-btn-ghost:hover { background: var(--brand-soft); }
.btn-mini {
  border: 1px solid var(--line); background: #fff; color: var(--ink-2);
  border-radius: 6px; padding: 1px 8px; margin-left: 6px;
  cursor: pointer; font-size: 12px;
}
.btn-mini:hover:not(:disabled) { color: var(--brand); border-color: var(--brand); }
.btn-mini:disabled { opacity: .4; cursor: not-allowed; }
.tool-file-list {
  list-style: none; margin: 4px 0 0; padding: 0;
  display: flex; flex-direction: column; gap: 4px;
}
.tool-file-item {
  display: flex; align-items: center; gap: 8px;
  border: 1px solid var(--line); border-radius: 8px;
  padding: 5px 10px; font-size: 13px; color: var(--ink);
}
.tool-file-name { flex: 1; word-break: break-all; }

/* ---------- 行标全量目录（iframe 内嵌，2026-10-05 晚） ---------- */
.catalog-frame-box {
  background: #fff; border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 6px 20px rgba(16, 32, 71, .06);
  overflow: hidden;
}
.catalog-frame {
  display: block; width: 100%;
  height: calc(100vh - 230px); min-height: 560px;
  border: none; background: #fff;
}
@media (max-width: 760px) {
  .catalog-frame { height: calc(100vh - 150px); min-height: 420px; }
}

/* ---------- 标准知识页（2026-10-05 晚） ---------- */
.kb-main { max-width: 900px; }
.kb-sec { margin: 0 0 26px; }
.kb-h2 {
  margin: 0 0 10px; font-size: 17px; font-weight: 700; color: var(--ink);
  padding-left: 11px; border-left: 4px solid var(--brand); line-height: 1.35;
}
.kb-h3 { margin: 16px 0 8px; font-size: 14.5px; font-weight: 700; color: var(--ink); }
.kb-p { margin: 0 0 10px; font-size: 13.8px; line-height: 1.85; color: var(--ink-2); }
.kb-p b { color: var(--ink); }
.kb-list {
  margin: 0 0 10px; padding-left: 20px;
  font-size: 13.8px; line-height: 1.85; color: var(--ink-2);
}
.kb-list li { margin-bottom: 5px; }
.kb-list b, .kb-list code, .kb-p code {
  color: var(--ink); background: #f2f4f8;
  border-radius: 4px; padding: 0 4px; font-family: var(--mono); font-size: 12.5px;
}
.kb-table {
  width: 100%; border-collapse: collapse; margin: 0 0 12px;
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  overflow: hidden; font-size: 13px;
}
.kb-table th, .kb-table td {
  padding: 9px 12px; border-bottom: 1px solid var(--line);
  text-align: left; vertical-align: top; line-height: 1.7;
}
.kb-table th { background: #eef1f5; font-weight: 700; color: var(--ink); white-space: nowrap; }
.kb-table tr:last-child td { border-bottom: none; }
.kb-table td:first-child { color: var(--ink); font-weight: 600; }
.kb-cards { display: grid; grid-template-columns: 1fr; gap: 10px; margin: 0 0 12px; }
@media (min-width: 640px) { .kb-cards { grid-template-columns: repeat(2, 1fr); } }
.kb-card {
  display: flex; flex-direction: column; gap: 3px;
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  padding: 12px 14px;
}
.kb-k { font-size: 11.5px; color: var(--ink-3); }
.kb-v { font-size: 15px; font-weight: 700; color: var(--brand); font-family: var(--mono); }
.kb-d { font-size: 12.5px; color: var(--ink-2); line-height: 1.6; }
.kb-tags { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0 0 12px; padding: 0; }
.kb-tags li {
  font-size: 12.5px; color: var(--brand); background: var(--brand-soft);
  border-radius: 999px; padding: 3px 12px;
}
.kb-note {
  background: #fef7e0; border: 1px solid #fde68a; border-radius: 10px;
  padding: 11px 14px; font-size: 13px; line-height: 1.75; color: #8a5a00;
}
.kb-faq { margin: 0; font-size: 13.8px; line-height: 1.85; }
.kb-faq dt { font-weight: 700; color: var(--ink); margin-top: 12px; }
.kb-faq dd { margin: 4px 0 0; color: var(--ink-2); }
.kb-source {
  margin: 8px 0 0; padding-top: 12px; border-top: 1px dashed var(--line);
  font-size: 12px; line-height: 1.7; color: var(--ink-3);
}
/* 封面分类号示意 */
.kb-badge-demo {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: #fff; border: 1px solid var(--line); border-radius: 10px;
  padding: 14px 16px; margin: 0 0 10px;
}
.kb-badge {
  font-family: var(--mono); font-size: 13px; font-weight: 700;
  border-radius: 7px; padding: 3px 12px;
}
.kb-badge-ics { background: #eef2ff; color: #3730a3; border: 1px solid #c7d2fe; }
.kb-badge-ccs { background: #f0fdfa; color: #0f766e; border: 1px solid #99f6e4; }
.kb-badge-note { font-size: 12.5px; color: var(--ink-3); }
/* CCS 24 类网格 */
.kb-ccs { display: grid; grid-template-columns: 1fr; gap: 8px; }
@media (min-width: 560px) { .kb-ccs { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) { .kb-ccs { grid-template-columns: repeat(3, 1fr); } }
.kb-ccs-item {
  display: flex; align-items: center; gap: 10px;
  border: 1px solid var(--line); border-radius: 10px;
  padding: 7px 11px; background: #fff;
}
.kb-ccs-name { font-size: 13px; font-weight: 600; color: var(--ink); }
