/* ==========================================================================
   Clash使用教程 · 术语表页专属样式(glossary.css)
   依赖 base.css / components.css 的设计令牌;只写本页独有结构
   ========================================================================== */

/* ---------- 拼音 / 字母速查纸卡 ---------- */
.idx{padding:30px 32px 26px;margin-bottom:14px}
.idx-title{
  font-family:var(--font-display);
  font-size:22px;letter-spacing:2px;
  margin-bottom:16px;
}
.idx-groups{display:flex;flex-direction:column;gap:9px}
.idx-row{
  display:flex;align-items:baseline;gap:14px;
  min-width:0;
}
.idx-letter{
  flex-shrink:0;
  width:26px;
  font-family:var(--font-mono);
  font-size:14px;font-weight:600;
  color:var(--accent-deep);
  text-align:center;
  border-bottom:2px solid var(--accent-dark);
  padding-bottom:1px;
}
.idx-links{
  display:flex;flex-wrap:wrap;gap:6px 16px;
  min-width:0;
  font-size:13.5px;
}
.idx-links a{
  color:var(--ink-soft);
  border-bottom:1px dashed var(--line-ink);
  padding-bottom:1px;
  transition:color .15s,border-color .15s;
}
.idx-links a:hover{
  color:var(--accent-deep);
  border-bottom-color:var(--accent-dark);
  border-bottom-style:solid;
}

/* ---------- 分类小节标题行 ---------- */
.gcat-head{
  display:flex;align-items:baseline;gap:14px;
  margin-bottom:10px;
}
.gcat-title{
  font-family:var(--font-display);
  font-size:clamp(24px,3vw,32px);
  letter-spacing:3px;line-height:1.25;
  color:var(--text);
}
.gcat-count{
  font-family:var(--font-mono);
  font-size:12px;letter-spacing:1px;
  color:var(--text-muted);
  border:1px dashed var(--line-soft);border-radius:var(--radius);
  padding:3px 9px;
  flex-shrink:0;
}
.gcat-note{
  color:var(--text-muted);
  font-size:14px;line-height:1.9;
  max-width:52em;
  margin-bottom:24px;
}

/* ---------- 术语卡内的英文小注 ---------- */
.term-en{
  font-family:var(--font-mono);
  font-size:11.5px;font-weight:400;
  color:var(--ink-faint);
  margin-left:8px;
  letter-spacing:.5px;
}

/* ---------- 页尾引导纸卡 ---------- */
.gnext{padding:32px 34px 30px}
.gnext-title{
  font-family:var(--font-display);
  font-size:24px;letter-spacing:2px;
  margin-bottom:10px;
}
.gnext p{color:var(--ink-soft);line-height:1.9;max-width:44em}
.gnext-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:20px}

/* ---------- 窄屏微调 ---------- */
@media (max-width:640px){
  .idx{padding:24px 20px 20px}
  .idx-row{gap:10px}
  .idx-letter{width:22px;font-size:13px}
  .gcat-head{flex-wrap:wrap;gap:8px}
  .gnext{padding:26px 22px 24px}
}