/* ══════════════════════════════════════════════════════════════
   黑柩 Wiki · 跨站检索 + AI 问答  ask.css
   ──────────────────────────────────────────────────────────────
   设计原则（方案 C1：跟随宿主主题、中性）：
   · 所有规则都以 .heijiu-ui 前缀限定 → 嵌进 WordPress 不会污染主题
   · 颜色只用 inherit / currentColor / 半透明灰 → 深色浅色都自适应
   · 只保留一个强调色变量 --ha-accent，宿主可覆盖
   ══════════════════════════════════════════════════════════════ */

.heijiu-ui{
  --ha-accent:#a83b25;
  --ha-line:rgba(128,128,128,.28);
  --ha-line-strong:rgba(128,128,128,.45);
  --ha-soft:rgba(128,128,128,.09);
  --ha-muted:rgba(128,128,128,.95);
  font:inherit;
  color:inherit;
  margin:1.2rem 0;
  line-height:1.7;
}
.heijiu-ui *{box-sizing:border-box}

/* ── 搜索行 ── */
.heijiu-ui .ha-bar{display:flex; gap:.55rem; align-items:center; flex-wrap:wrap}
.heijiu-ui .ha-q{
  flex:1 1 16rem; min-width:0;
  padding:.55rem .8rem;
  font:inherit; color:inherit;
  background:transparent;
  border:1px solid var(--ha-line-strong);
  border-radius:10px;
  -webkit-appearance:none; appearance:none;
}
.heijiu-ui .ha-q:focus{
  outline:none; border-color:var(--ha-accent);
  box-shadow:0 0 0 3px rgba(168,59,37,.12);
}
.heijiu-ui .ha-go{
  flex:0 0 auto; padding:.55rem 1.1rem;
  font:inherit; font-weight:600;
  color:#fff; background:var(--ha-accent);
  border:1px solid var(--ha-accent);
  border-radius:10px; cursor:pointer;
}
.heijiu-ui .ha-go:disabled{opacity:.55; cursor:default}
.heijiu-ui .ha-go:hover:not(:disabled){filter:brightness(1.08)}
.heijiu-ui .ha-clear{
  flex:0 0 auto; padding:.55rem .85rem;
  font:inherit; font-size:.9rem; color:var(--ha-muted);
  background:transparent; border:1px solid var(--ha-line-strong);
  border-radius:10px; cursor:pointer;
}
.heijiu-ui .ha-clear:hover{border-color:var(--ha-accent); color:var(--ha-accent)}

/* ── 状态 ── */
.heijiu-ui .ha-meta{margin:.5rem 0 0; font-size:.84rem; color:var(--ha-muted)}
.heijiu-ui .ha-meta b{color:inherit; font-weight:600}
.heijiu-ui .ha-loading{margin:.9rem 0 0; font-size:.86rem; color:var(--ha-muted)}

/* ── 结果分组 ── */
.heijiu-ui .ha-group{margin:1.1rem 0 0}
.heijiu-ui .ha-group-h{
  display:flex; align-items:baseline; gap:.5rem;
  margin:0 0 .45rem; padding-bottom:.3rem;
  font-size:.86rem; font-weight:700; letter-spacing:.02em;
  border-bottom:1px solid var(--ha-line);
}
.heijiu-ui .ha-group-h .n{font-weight:400; color:var(--ha-muted); font-size:.82rem}

/* ── 结果卡片 ── */
.heijiu-ui .ha-hit{
  display:block; padding:.6rem .75rem; margin:.35rem 0;
  border:1px solid var(--ha-line); border-radius:10px;
  text-decoration:none; color:inherit; background:transparent;
  transition:border-color .12s, background .12s;
}
.heijiu-ui .ha-hit:hover{
  border-color:var(--ha-line-strong); background:var(--ha-soft);
  text-decoration:none;
}
.heijiu-ui .ha-hit-t{font-weight:600; font-size:.96rem; line-height:1.45}
.heijiu-ui .ha-hit-m{margin:.18rem 0 0; font-size:.8rem; color:var(--ha-muted)}
.heijiu-ui .ha-tag{
  display:inline-block; margin:0 .25rem .15rem 0; padding:0 .4rem;
  font-size:.75rem; border-radius:99px;
  border:1px solid var(--ha-line); color:var(--ha-muted);
}
.heijiu-ui .ha-from{
  display:inline-block; margin-right:.4rem; padding:0 .38rem;
  font-size:.74rem; font-weight:600; border-radius:4px;
  border:1px solid currentColor; opacity:.72;
}

/* ── 空 / 图例 ── */
.heijiu-ui .ha-empty{
  margin:.9rem 0 0; padding:.8rem .9rem;
  border:1px dashed var(--ha-line-strong); border-radius:10px;
  font-size:.88rem; color:var(--ha-muted);
}
.heijiu-ui .ha-empty b{color:inherit}
.heijiu-ui .ha-legend{
  margin:1.2rem 0 0; padding-top:.6rem;
  border-top:1px solid var(--ha-line);
  font-size:.8rem; color:var(--ha-muted);
}
.heijiu-ui .ha-legend a{color:var(--ha-accent)}

/* ══════════════════════════════════════════════════════════
   档 2：AI 问答
   ══════════════════════════════════════════════════════════ */

/* 入口 */
.heijiu-ui .ha-ai-bar{
  display:flex; align-items:center; gap:.7rem; flex-wrap:wrap;
  margin:1.2rem 0 0; padding-top:.9rem;
  border-top:1px solid var(--ha-line);
}
.heijiu-ui .ha-aibtn{
  padding:.5rem 1rem; font:inherit; font-weight:600;
  color:var(--ha-accent); background:transparent;
  border:1.5px solid var(--ha-accent); border-radius:10px; cursor:pointer;
}
.heijiu-ui .ha-aibtn:hover{background:rgba(168,59,37,.07)}
.heijiu-ui .ha-ai-note{font-size:.82rem; color:var(--ha-muted)}

/* 面板 */
.heijiu-ui .ha-ai-panel{
  margin:1.1rem 0 0; padding:.9rem 1rem;
  border:1px solid var(--ha-line-strong); border-radius:12px;
  background:var(--ha-soft);
}
.heijiu-ui .ha-warn{
  margin:.35rem 0; padding:.45rem .65rem;
  font-size:.82rem; line-height:1.6; color:var(--ha-muted);
  border-left:3px solid #d98b2b; border-radius:0 6px 6px 0;
  background:rgba(217,139,43,.06);
}
.heijiu-ui .ha-warn b{color:inherit}

/* key 行 */
.heijiu-ui .ha-key-row{
  display:flex; gap:.45rem; align-items:center; flex-wrap:wrap;
  margin:.7rem 0 .2rem;
}
.heijiu-ui .ha-key{
  flex:1 1 15rem; min-width:0;
  padding:.5rem .7rem; font:inherit; font-size:.88rem; color:inherit;
  background:transparent;
  border:1px solid var(--ha-line-strong); border-radius:9px;
  -webkit-appearance:none; appearance:none;
}
.heijiu-ui .ha-key:focus{
  outline:none; border-color:var(--ha-accent);
  box-shadow:0 0 0 3px rgba(168,59,37,.12);
}
.heijiu-ui .ha-start{
  flex:0 0 auto; padding:.5rem 1rem;
  font:inherit; font-weight:600; color:#fff;
  background:var(--ha-accent); border:1px solid var(--ha-accent);
  border-radius:9px; cursor:pointer;
}
.heijiu-ui .ha-start:disabled{opacity:.55; cursor:default}
.heijiu-ui .ha-forget{
  flex:0 0 auto; padding:.5rem .8rem;
  font:inherit; font-size:.86rem; color:var(--ha-muted);
  background:transparent; border:1px solid var(--ha-line-strong);
  border-radius:9px; cursor:pointer;
}
.heijiu-ui .ha-forget:hover{border-color:var(--ha-accent); color:var(--ha-accent)}

/* 回答 */
.heijiu-ui .ha-ans{
  margin:.8rem 0 0; padding:.85rem 1rem;
  border:1px solid var(--ha-line); border-radius:10px;
  background:transparent;
  font-size:.94rem; line-height:1.8;
}
.heijiu-ui .ha-ans p{margin:.5rem 0}
.heijiu-ui .ha-ans p:first-child{margin-top:0}
.heijiu-ui .ha-ans p:last-child{margin-bottom:0}
.heijiu-ui .ha-ans strong{color:inherit; font-weight:700}
.heijiu-ui .ha-cite{font-size:.72em; line-height:0}
.heijiu-ui .ha-cite a{color:var(--ha-accent); text-decoration:none}
.heijiu-ui .ha-cite a:hover{text-decoration:underline}

.heijiu-ui .ha-usage{
  margin:.5rem 0 0; font-size:.78rem; color:var(--ha-muted);
}

/* 来源 */
.heijiu-ui .ha-src-h{
  margin:1rem 0 .4rem; padding-top:.7rem;
  font-size:.84rem; font-weight:700;
  border-top:1px dashed var(--ha-line-strong);
}
.heijiu-ui .ha-src{
  display:flex; gap:.5rem; align-items:baseline;
  padding:.4rem .6rem; margin:.25rem 0;
  font-size:.84rem; text-decoration:none; color:inherit;
  border:1px solid var(--ha-line); border-radius:8px;
}
.heijiu-ui .ha-src:hover{
  border-color:var(--ha-line-strong); background:var(--ha-soft);
  text-decoration:none;
}
.heijiu-ui .ha-src .n{color:var(--ha-accent); font-weight:700; flex:0 0 auto}

/* 标题：保底宽度 + 允许词内断行。
   之前的 min-width:0 让它可以被压到 0，桌面端就会被右侧那串
   「出版社 · 日期 · 时长 · 条数」挤成竖排。 */
.heijiu-ui .ha-src .t{
  flex:1 1 auto; min-width:5em;
  font-weight:600; word-break:break-word; overflow-wrap:anywhere;
}

/* 元信息：允许收缩并单行省略。
   原来是 flex:0 0 auto（永不收缩），这是错乱的直接原因。 */
.heijiu-ui .ha-src .m{
  flex:0 1 auto; min-width:0; max-width:46%;
  color:var(--ha-muted); font-size:.78rem;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
/* 被引用跳转时高亮一下 */
.heijiu-ui .ha-src:target{border-color:var(--ha-accent); background:rgba(168,59,37,.06)}

/* ── key 输入区（检索与问答共用，只填一次）── */
.heijiu-ui .ha-keybox{
  margin:.75rem 0 0; padding:.6rem .7rem;
  border:1px solid var(--ha-line); border-radius:10px;
  background:var(--ha-soft);
}
.heijiu-ui .ha-keybox .ha-key-row{margin:0}
.heijiu-ui .ha-keybox .ha-key{font-size:.86rem}

/* ══════════════════════════════════════════════════════════
   两个区块：搜索（免费） / 问答（需 API）
   ══════════════════════════════════════════════════════════ */
.heijiu-ui .ha-block{
  margin:1.1rem 0; padding:1rem 1.1rem;
  border:1px solid var(--ha-line); border-radius:12px;
}
.heijiu-ui .ha-blk-chat{border-color:var(--ha-line-strong)}

.heijiu-ui .ha-block-h{
  display:flex; align-items:baseline; gap:.6rem; flex-wrap:wrap;
  margin:0 0 .85rem; padding-bottom:.5rem;
  font-size:1rem; font-weight:700;
  border-bottom:1px solid var(--ha-line);
}
.heijiu-ui .ha-free,
.heijiu-ui .ha-need{
  font-size:.75rem; font-weight:400; letter-spacing:.02em;
  padding:.06rem .5rem; border-radius:99px;
  border:1px solid var(--ha-line-strong); color:var(--ha-muted);
}
.heijiu-ui .ha-need{border-color:var(--ha-accent); color:var(--ha-accent)}
.heijiu-ui .ha-setkey{
  margin-left:auto; padding:.1rem .55rem;
  font-size:.76rem; font-weight:400;
  color:var(--ha-accent); background:transparent;
  border:1px solid var(--ha-accent); border-radius:99px;
  cursor:pointer;
}
.heijiu-ui .ha-setkey:hover{background:rgba(168,59,37,.08)}

/* ── 一次性解读结果（搜索区内，独立于下方问答）── */
.heijiu-ui .ha-oneshot{
  margin:1rem 0 0; padding:.85rem 1rem;
  border:1px solid var(--ha-accent); border-radius:12px;
  background:rgba(168,59,37,.04);
}
/* 这个容器有边框，空着就会露出一个难看的空框：
   除了 [hidden]，再兜一层 :empty。 */
.heijiu-ui .ha-oneshot[hidden],
.heijiu-ui .ha-oneshot:empty{display:none}
.heijiu-ui .ha-oneshot-head{
  display:flex; align-items:center; justify-content:space-between; gap:.6rem;
  margin:0 0 .6rem; padding-bottom:.45rem;
  font-size:.86rem; font-weight:700; color:var(--ha-accent);
  border-bottom:1px dashed var(--ha-line-strong);
}
.heijiu-ui .ha-oneshot-close{
  flex:0 0 auto; width:1.6rem; height:1.6rem; line-height:1;
  font-size:1.1rem; color:var(--ha-muted);
  background:transparent; border:1px solid var(--ha-line);
  border-radius:8px; cursor:pointer;
}
.heijiu-ui .ha-oneshot-close:hover{border-color:var(--ha-accent); color:var(--ha-accent)}
.heijiu-ui .ha-oneshot-body{font-size:.94rem; line-height:1.8}
.heijiu-ui .ha-oneshot-body .ha-ans{margin:0; padding:0; border:0; background:transparent}
.heijiu-ui .ha-oneshot-src{margin:.6rem 0 0}

/* ── 问答：聊天气泡，AI 在左、用户在右 ── */
.heijiu-ui .ha-chat{
  margin:0 0 .9rem;
  max-height:34rem; overflow-y:auto;
  padding-right:.2rem;
}
.heijiu-ui .ha-msg{display:flex; margin:.6rem 0}
.heijiu-ui .ha-msg.ai{justify-content:flex-start}
.heijiu-ui .ha-msg.user{justify-content:flex-end}

.heijiu-ui .ha-bubble{
  max-width:84%; min-width:2rem;
  padding:.62rem .9rem;
  border-radius:14px;
  font-size:.93rem; line-height:1.78;
  word-break:break-word;
}
.heijiu-ui .ha-msg.ai .ha-bubble{
  background:var(--ha-soft);
  border:1px solid var(--ha-line);
  border-top-left-radius:5px;
}
.heijiu-ui .ha-msg.user .ha-bubble{
  background:rgba(168,59,37,.10);
  border:1px solid rgba(168,59,37,.30);
  border-top-right-radius:5px;
}
.heijiu-ui .ha-bubble p{margin:.42rem 0}
.heijiu-ui .ha-bubble p:first-child{margin-top:0}
.heijiu-ui .ha-bubble p:last-child{margin-bottom:0}
.heijiu-ui .ha-bubble .ha-ans{margin:0; padding:0; border:0; background:transparent}
.heijiu-ui .ha-greet-tip{
  margin-top:.5rem !important; padding-top:.45rem;
  border-top:1px dashed var(--ha-line-strong);
  font-size:.82rem; color:var(--ha-muted);
}
.heijiu-ui .ha-msg-usage{
  margin:.5rem 0 0 !important; padding-top:.4rem;
  border-top:1px dashed var(--ha-line);
  font-size:.75rem; color:var(--ha-muted);
}
.heijiu-ui .ha-turn-src{margin:.55rem 0 0}
.heijiu-ui .ha-turn-src .ha-src{font-size:.8rem}

/* ── 内联 key 输入（只在需要时出现在被点击处）── */
.heijiu-ui .ha-keyinline{
  margin:0 0 .7rem; padding:.7rem .8rem;
  border:1px solid var(--ha-accent); border-radius:10px;
  background:rgba(168,59,37,.05);
}
.heijiu-ui .ha-keytip{
  margin:0 0 .5rem; font-size:.82rem; line-height:1.6; color:var(--ha-muted);
}
.heijiu-ui .ha-keyinline .ha-key-row{margin:0}

/* ── 对话流（追问）── */
.heijiu-ui .ha-chat{margin:.9rem 0 0}
.heijiu-ui .ha-turn{
  margin:0 0 1rem; padding:0 0 .8rem;
  border-bottom:1px dashed var(--ha-line);
}
.heijiu-ui .ha-turn:last-child{border-bottom:0; padding-bottom:0}

.heijiu-ui .ha-q-line{
  display:flex; gap:.5rem; align-items:baseline;
  margin:0 0 .5rem; font-weight:600; font-size:.95rem;
}
.heijiu-ui .ha-a-line{display:flex; gap:.5rem; align-items:baseline}
.heijiu-ui .who{
  flex:0 0 auto; padding:0 .38rem; border-radius:4px;
  font-size:.72rem; font-weight:700; line-height:1.5;
  border:1px solid var(--ha-line-strong); color:var(--ha-muted);
}
.heijiu-ui .who.ai{border-color:var(--ha-accent); color:var(--ha-accent)}
.heijiu-ui .ha-body{flex:1 1 auto; min-width:0}
.heijiu-ui .ha-body .ha-ans{
  margin:0; padding:.7rem .85rem;
  border:1px solid var(--ha-line); border-radius:10px;
  font-size:.94rem; line-height:1.8;
}
.heijiu-ui .ha-body .ha-ans p{margin:.45rem 0}
.heijiu-ui .ha-body .ha-ans p:first-child{margin-top:0}
.heijiu-ui .ha-body .ha-ans p:last-child{margin-bottom:0}
.heijiu-ui .ha-turn-src{margin:.5rem 0 0 2.1rem}
.heijiu-ui .ha-turn-src .ha-src-h{display:none}   /* 每轮不必重复标题 */

/* 追问输入行 */
.heijiu-ui .ha-ask-row{
  display:flex; gap:.45rem; align-items:center; flex-wrap:wrap;
  margin:.9rem 0 0; padding-top:.8rem;
  border-top:1px solid var(--ha-line);
}
.heijiu-ui .ha-follow{
  flex:1 1 14rem; min-width:0;
  padding:.5rem .7rem; font:inherit; font-size:.9rem; color:inherit;
  background:transparent;
  border:1px solid var(--ha-line-strong); border-radius:9px;
  -webkit-appearance:none; appearance:none;
}
.heijiu-ui .ha-follow:focus{
  outline:none; border-color:var(--ha-accent);
  box-shadow:0 0 0 3px rgba(168,59,37,.12);
}
.heijiu-ui .ha-send{
  flex:0 0 auto; padding:.5rem 1rem;
  font:inherit; font-weight:600; color:#fff;
  background:var(--ha-accent); border:1px solid var(--ha-accent);
  border-radius:9px; cursor:pointer;
}
.heijiu-ui .ha-send:disabled{opacity:.55; cursor:default}
/* display:flex 的优先级高于 [hidden] 的默认 display:none，
   不显式写这一条，追问框会在还没开始问答时就露出来。 */
.heijiu-ui .ha-ask-row[hidden]{display:none}

.heijiu-ui .ha-end{
  flex:0 0 auto; padding:.5rem .8rem;
  font:inherit; font-size:.86rem; color:var(--ha-muted);
  background:transparent; border:1px solid var(--ha-line-strong);
  border-radius:9px; cursor:pointer;
}
.heijiu-ui .ha-end:hover{border-color:var(--ha-accent); color:var(--ha-accent)}

.heijiu-ui .ha-status{
  margin:.55rem 0 0; font-size:.8rem; color:var(--ha-muted);
}

/* ── 窄屏 ── */
@media (max-width:640px){
  .heijiu-ui .ha-q{flex:1 1 100%}
  .heijiu-ui .ha-go{flex:1 1 auto}
  .heijiu-ui .ha-clear{flex:1 1 auto}
  .heijiu-ui .ha-key{flex:1 1 100%}
  .heijiu-ui .ha-start,.heijiu-ui .ha-forget{flex:1 1 auto}
  .heijiu-ui .ha-src{flex-wrap:wrap}
  /* 桌面端的 max-width:46% 在这里必须解除，否则移动端 .m 想独占一行却只到 46% */
  .heijiu-ui .ha-src .m{
    flex:1 1 100%; max-width:100%;
    padding-left:1.6rem; white-space:normal;
  }
  .heijiu-ui .ha-src .t{min-width:0}
  .heijiu-ui .ha-follow{flex:1 1 100%}
  .heijiu-ui .ha-send,.heijiu-ui .ha-end{flex:1 1 auto}
  .heijiu-ui .ha-turn-src{margin-left:0}
}
