/* ============================================================
   Textmolt Help Paper Layer — 帮助页纸墨换皮（0813 用户拍板，
   方案 = .tmp/FABLE_DESIGN_LINE_2026-08-13/MEMORY_HELP_RESKIN.md §2）
   形态 = 案 B 先行：壳留 modal（「窗即是纸」判例），内容列换 S9 目录
   点线族（stoc-* 复用 settings-paper.css 既有类，本文件只出帮助专属件）。
   规范：不定义 --tm-*；暗档由 token 翻转承担，零 [data-theme] 补丁。
   加载序在 help.css 之后，同特异性后者胜；help.css 旧规则物理回收另刀。
   ============================================================ */

/* ── 壳：白 modal → 纸页浮出 ── */
.help-overlay {
  background: rgba(42, 39, 51, 0.30);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}
.help-modal {
  background:
    linear-gradient(var(--tm-paper-veil), var(--tm-paper-veil)),
    var(--tm-paper-texture) var(--tm-paper);
  background-size: auto, 300px 300px;
  border: 1px solid var(--tm-paper-hairline);
  border-radius: 12px;
  box-shadow: 0 24px 70px -18px rgba(42, 39, 51, 0.45);
  color: var(--tm-paper-ink);
}

/* ── 页眉：paperhead（2px 墨线横贯窗眉，与付费窗同形） ── */
.help-header {
  background: transparent;
  border-bottom: 2px solid var(--tm-paper-ink);
}
.help-header-title {
  color: var(--tm-paper-ink);
  font-weight: 700;
}
.help-back-btn,
.help-close-btn {
  background: transparent;
  border: none;
  color: var(--tm-paper-ink-mut);
}
.help-back-btn:hover,
.help-close-btn:hover {
  color: var(--tm-ink-purple-strong);
  background: transparent;
}

/* ── hub：FAQ 行（问题可折行，行尾 caret）+ 垂注答案 ── */
.help-hub {
  padding: 6px 18px 16px;
}
.help-toc-row {
  align-items: flex-start;
  gap: 8px;
}
.help-toc-q {
  flex: 1;
  min-width: 0;
  white-space: normal;
  line-height: 1.5;
}
.help-toc-caret {
  flex: none;
  font-size: 10px;
  color: var(--tm-paper-ink-mut);
  transform: translateY(2px);
}
.help-toc-item.is-open .help-toc-caret {
  color: var(--tm-ink-purple-strong);
}
/* 答案垂注：2px 左界线 + 灰墨陈述（断墨注同族） */
.help-faq-note {
  margin: 2px 0 10px 2px;
  padding: 2px 0 2px 11px;
  border-left: 2px solid var(--tm-paper-hairline-2);
  font-size: 12px;
  line-height: 1.75;
  color: var(--tm-paper-ink-2);
  white-space: pre-line;
  /* 长配置项名（extensions.zotero…）需可断词，否则窄栏溢出——该保护原在
     旧 .help-faq-a（0813 换皮后死类）上，0814 回收时迁到现役垂注类 */
  overflow-wrap: anywhere;
}

/* ── 邮件表单入纸：底线字段 + 横线信纸 + 墨底 CTA ── */
.help-mail-form {
  padding: 10px 18px 18px;
}
.help-mail-form-title {
  font-family: var(--tm-serif, serif);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--tm-paper-ink-mut);
}
.help-mail-field-label {
  font-size: 11px;
  color: var(--tm-paper-ink-2);
}
/* 同表单同制式（0813 盲评 P1）：邮箱曾是底线伪装成点线、与盒式 textarea
   分裂——输入控件统一为纸面盒 */
.help-mail-input {
  font: inherit;
  font-size: 12.5px;
  color: var(--tm-paper-ink);
  background: var(--tm-paper-raised);
  border: 1px solid var(--tm-paper-hairline-2);
  border-radius: 4px;
  padding: 6px 9px;
}
.help-mail-input:focus,
.help-mail-input:focus-visible {
  outline: none;
  border-color: var(--tm-ink-purple);
  box-shadow: none;
}
.help-mail-input::placeholder {
  color: var(--tm-paper-ink-mut);
}
/* 正文 = 横线信纸：稿纸线随内容滚动（background-attachment: local） */
.help-mail-textarea {
  border: 1px solid var(--tm-paper-hairline);
  border-radius: 4px;
  background-color: var(--tm-paper-raised);
  background-image: repeating-linear-gradient(
    to bottom,
    transparent 0,
    transparent 27px,
    var(--tm-paper-hairline) 27px,
    var(--tm-paper-hairline) 28px
  );
  background-attachment: local;
  line-height: 28px;
  padding: 0 10px;
}
.help-mail-counter,
.help-mail-file-size {
  font-family: var(--tm-font-mono);
  font-size: 10.5px;
  font-variant-numeric: tabular-nums;
  color: var(--tm-paper-ink-mut);
}
.help-mail-hint {
  font-size: 11px;
  color: var(--tm-paper-ink-mut);
}
.help-mail-file-item {
  color: var(--tm-paper-ink-2);
}
/* file input 彻底入纸（0813 盲评补全）：UA 按钮文字（Choose Files）CSS 改
   不了 → 原生 input 视觉隐形（保留焦点可达），自绘 i18n 按钮承担外观 */
.help-mail-file-pick {
  display: inline-block;
  position: relative;
}
.help-mail-file-pick .help-mail-file-input {
  position: absolute;
  inset: 0;
  width: 1px;
  height: 1px;
  opacity: 0;
  overflow: hidden;
  clip-path: inset(50%);
  pointer-events: none;
}
.help-mail-file-btn {
  display: inline-block;
  font-size: 12px;
  color: var(--tm-ink-purple-strong);
  background: none;
  border: 1px solid var(--tm-paper-hairline-2);
  border-radius: 4px;
  padding: 5px 12px;
  cursor: pointer;
}
.help-mail-file-pick:hover .help-mail-file-btn {
  background: var(--tm-paper-band);
}
.help-mail-file-pick:focus-within .help-mail-file-btn {
  border-color: var(--tm-ink-purple);
  outline: 2px solid var(--tm-ink-purple);
  outline-offset: 1px;
}
.help-mail-file-remove {
  background: none;
  border: none;
  color: var(--tm-paper-ink-mut);
  cursor: pointer;
}
.help-mail-file-remove:hover {
  color: var(--tm-cinnabar);
}
.help-mail-send-btn {
  font-family: var(--tm-serif, serif);
  font-weight: 700;
  letter-spacing: 0.1em;
  font-size: 12.5px;
  color: var(--tm-paper);
  background: var(--tm-paper-ink);
  border: none;
  border-radius: 4px;
  padding: 9px 22px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  cursor: pointer;
}
.help-mail-send-btn:hover {
  background: var(--tm-paper-ink);
  opacity: 0.88;
}
.help-mail-send-btn:disabled {
  opacity: 0.45;
  cursor: default;
}

/* ── ④ 案A（0814 视觉批）：帮助迁设置子页——inline 形态外壳。
      内容样式全数复用上方同名类；这里只中和 overlay 时代的容器内衬
      （子页留白由 settings-scroll/sp-leaf 提供，避免双重内衬）。 ── */
.help-page {
  display: block;
}
.help-page .help-body {
  padding: 0;
  overflow: visible;
}
.help-page .help-hub {
  padding: 2px 0 16px;
}
.help-header--inline {
  display: flex;
  justify-content: flex-start;
  padding: 4px 0 2px;
  border-bottom: none;
}
