/* ==========================================================================
   8D 问题解决报告 —— 界面样式
   依赖 style.css 顶部的设计令牌（--c-brand 等）
   ========================================================================== */

/* ---------------- 顶部操作条 ---------------- */
.d8-toolbar{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  margin-bottom:16px;
}
.d8-tb-left{ display:flex; gap:9px; align-items:center; }
.d8-tb-right{ display:flex; gap:7px; align-items:center; margin-left:auto; flex-wrap:wrap; }
.d8-bot{ font-size:15px; }

/* ---------------- 完整性看板 ---------------- */
.d8-board{ margin-bottom:16px; }
.d8-kpis{
  display:grid; gap:10px;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  margin-bottom:12px;
}
.d8-kpi{
  background:var(--c-surface);
  border:1px solid var(--c-border);
  border-left:4px solid var(--c-brand-mid);
  border-radius:var(--radius-sm);
  padding:11px 13px;
  box-shadow:var(--shadow-card);
}
.d8-kpi--ok{ border-left-color:var(--c-ok); }
.d8-kpi--warn{ border-left-color:var(--c-warn); }
.d8-kpi--bad{ border-left-color:var(--c-bad); }
.d8-kpi-v{
  font-size:23px; font-weight:700; font-family:var(--font-mono);
  color:var(--c-brand-dark); line-height:1.15;
}
.d8-kpi--ok .d8-kpi-v{ color:var(--c-ok); }
.d8-kpi--warn .d8-kpi-v{ color:var(--c-warn); }
.d8-kpi--bad .d8-kpi-v{ color:var(--c-bad); }
.d8-kpi-l{ font-size:12px; font-weight:600; color:var(--c-text-mid); margin-top:3px; }
.d8-kpi-s{ font-size:11px; color:var(--c-text-dim); margin-top:2px; line-height:1.4; }

.d8-warns{
  background:var(--c-warn-bg); border:1px solid #ecd5ab;
  border-radius:var(--radius-sm); padding:11px 14px;
}
.d8-warn-ttl{
  font-size:12px; font-weight:700; color:#8a5710;
  margin-bottom:6px;
}
.d8-warn-ttl + .d8-warn-ttl{ margin-top:11px; }
.d8-warn-list{ display:flex; flex-wrap:wrap; gap:6px; }
.d8-chip{
  display:inline-block; font-size:11.5px;
  background:#fff; border:1px solid #ecd5ab; color:#8a5710;
  padding:3px 9px; border-radius:11px; cursor:pointer;
  transition:all .14s;
}
.d8-chip:hover{ background:#8a5710; color:#fff; border-color:#8a5710; }
.d8-warn-ul{ margin:0; padding-left:18px; font-size:12px; color:#8a5710; line-height:1.7; }

/* ---------------- 卡片与步骤 ---------------- */
.d8-card{ margin-bottom:16px; }
.d8-step-no{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:32px; height:22px; padding:0 7px;
  background:var(--c-brand); color:#fff;
  border-radius:11px; font-size:11.5px; font-weight:700;
  margin-right:9px; font-family:var(--font-mono);
  flex:none;
}
.d8-step-desc{
  font-size:12.5px; color:var(--c-text-mid);
  margin:0 0 8px; line-height:1.65;
}
.d8-hint{
  font-size:12px; color:var(--c-brand-dark);
  background:var(--c-brand-light);
  border-left:3px solid var(--c-brand-mid);
  padding:8px 12px; border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  margin-bottom:15px; line-height:1.65;
}
.d8-flash{ box-shadow:0 0 0 3px rgba(27,79,138,.35) !important; transition:box-shadow .25s; }

/* ---------------- 字段 ---------------- */
.d8-meta-grid{
  display:grid; gap:11px 14px;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
}
.d8-mf{ min-width:0; }
.d8-mf-wide{ grid-column:1 / -1; }
.d8-mf label{
  display:block; font-size:12px; font-weight:600;
  color:var(--c-text-mid); margin-bottom:4px;
}
.d8-mf input, .d8-mf select, .d8-f input, .d8-f select, .d8-f textarea{
  width:100%; box-sizing:border-box;
  border:1px solid var(--c-border); border-radius:var(--radius-sm);
  padding:7px 10px; font-family:var(--font); font-size:13px;
  color:var(--c-text); background:#fff;
  transition:border-color .14s, box-shadow .14s;
}
.d8-mf input:focus, .d8-mf select:focus,
.d8-f input:focus, .d8-f select:focus, .d8-f textarea:focus{
  outline:0; border-color:var(--c-brand-mid);
  box-shadow:0 0 0 3px rgba(74,127,181,.16);
}
.d8-f textarea{ resize:vertical; line-height:1.65; }

.d8-fields{ display:grid; gap:14px; }
.d8-f{ min-width:0; }
.d8-f label{
  display:block; font-size:12.5px; font-weight:700;
  color:var(--c-brand-dark); margin-bottom:5px;
}
.d8-req{
  display:inline-block; font-size:10px; font-weight:600;
  color:var(--c-bad); background:var(--c-bad-bg);
  border:1px solid #f2c2ba; border-radius:9px;
  padding:0 6px; margin-left:6px; vertical-align:middle;
}
.d8-ph{ font-size:11.5px; color:var(--c-text-dim); margin-top:4px; line-height:1.55; }

/* ---------------- 子区（鱼骨 / 5Why） ---------------- */
.d8-sub{
  margin-top:20px; padding-top:16px;
  border-top:1px dashed var(--c-border);
}
.d8-sub-head{
  display:flex; align-items:baseline; gap:12px; flex-wrap:wrap;
  margin-bottom:12px;
}
.d8-sub-head h3{
  font-size:13.5px; color:var(--c-brand-dark); margin:0;
}
.d8-sub-tip{ font-size:11.5px; color:var(--c-text-dim); }

/* 鱼骨卡片网格 */
.d8-fb-grid{
  display:grid; gap:11px;
  grid-template-columns:repeat(auto-fit,minmax(258px,1fr));
}
.d8-fb-cat{
  border:1px solid var(--c-border); border-radius:var(--radius-sm);
  background:var(--c-surface-2); padding:11px 12px;
  display:flex; flex-direction:column; min-width:0;
}
.d8-fb-cat-head{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  margin-bottom:5px;
}
.d8-fb-cat-name{
  font-size:12.5px; font-weight:700; color:var(--c-brand-dark);
}
.d8-fb-cat-n{
  font-size:11px; color:var(--c-text-dim);
  background:#eef1f4; border-radius:9px; padding:1px 7px; flex:none;
}
.d8-fb-hint{
  font-size:11px; color:var(--c-text-dim);
  margin-bottom:9px; line-height:1.5;
}
.d8-fb-list{ display:flex; flex-direction:column; gap:6px; margin-bottom:9px; flex:1; }
.d8-fb-empty{
  font-size:11.5px; color:var(--c-text-dim); font-style:italic;
  padding:7px 0;
}
.d8-fb-item{
  display:flex; align-items:flex-start; gap:7px;
  background:#fff; border:1px solid var(--c-border-soft);
  border-left:3px solid var(--c-border);
  border-radius:var(--radius-sm);
  padding:6px 8px;
}
.d8-fb-item.d8-fb-root{ border-left-color:var(--c-bad); background:#fffbfa; }
.d8-fb-item.d8-fb-chk{ border-left-color:var(--c-text-dim); opacity:.62; }
.d8-fb-txt{
  flex:1; min-width:0; font-size:12px; line-height:1.55;
  color:var(--c-text); word-break:break-word;
  outline:0; border-radius:2px;
}
.d8-fb-txt:focus{ background:var(--c-brand-light); box-shadow:0 0 0 2px rgba(74,127,181,.2); }
.d8-fb-chk .d8-fb-txt{ text-decoration:line-through; }
.d8-fb-root .d8-fb-txt{ font-weight:700; color:var(--c-bad); }
.d8-fb-acts{ display:flex; gap:3px; flex:none; }
.d8-fb-btn{
  border:1px solid var(--c-border); background:#fff;
  color:var(--c-text-dim); font-size:10.5px; font-family:var(--font);
  padding:2px 6px; border-radius:3px; cursor:pointer;
  transition:all .14s; white-space:nowrap;
}
.d8-fb-btn:hover{ border-color:var(--c-brand-mid); color:var(--c-brand); }
.d8-fb-btn.on-root{ background:var(--c-bad); border-color:var(--c-bad); color:#fff; font-weight:700; }
.d8-fb-btn.on-chk{ background:var(--c-text-dim); border-color:var(--c-text-dim); color:#fff; }
.d8-fb-del{ padding:2px 6px; font-size:13px; line-height:1; }
.d8-fb-del:hover{ background:var(--c-bad); border-color:var(--c-bad); color:#fff; }
.d8-fb-add{ display:flex; gap:6px; }
.d8-fb-add input{
  flex:1; min-width:0; border:1px solid var(--c-border);
  border-radius:var(--radius-sm); padding:5px 9px;
  font-family:var(--font); font-size:12px; background:#fff;
}
.d8-fb-add input:focus{ outline:0; border-color:var(--c-brand-mid); }
.d8-fb-add .btn{ padding:5px 11px; font-size:12px; flex:none; }

/* 鱼骨图预览（SVG） */
.d8-fb-view{ margin-top:15px; }
.d8-fb-view-head{
  font-size:12px; font-weight:700; color:var(--c-text-mid);
  margin-bottom:8px;
}
.d8-fb-svg{
  border:1px solid var(--c-border); border-radius:var(--radius-sm);
  overflow-x:auto; background:#fff; padding:4px;
  -webkit-overflow-scrolling:touch;
}
.d8-fb-svg svg{ display:block; min-width:640px; }

/* 5Why */
.d8-why{ display:flex; flex-direction:column; gap:11px; }
.d8-why-row{
  display:flex; gap:12px; align-items:flex-start;
  padding-left:12px; border-left:2px solid var(--c-border);
}
.d8-why-last{ border-left-color:var(--c-bad); }
.d8-why-no{
  flex:none; width:62px; padding-top:6px;
  font-size:11.5px; font-weight:700; font-family:var(--font-mono);
  color:var(--c-brand);
}
.d8-why-last .d8-why-no{ color:var(--c-bad); }
.d8-why-body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.d8-why-body input, .d8-why-body textarea{
  width:100%; box-sizing:border-box;
  border:1px solid var(--c-border); border-radius:var(--radius-sm);
  padding:7px 10px; font-family:var(--font); font-size:12.5px;
  color:var(--c-text); background:#fff; resize:vertical; line-height:1.6;
}
.d8-why-body input:focus, .d8-why-body textarea:focus{
  outline:0; border-color:var(--c-brand-mid);
  box-shadow:0 0 0 3px rgba(74,127,181,.16);
}
/* 多原因 5Why：原因切换条 + 增删按钮 */
.d8-why-bar{
  display:flex; gap:10px; align-items:flex-start; justify-content:space-between;
  flex-wrap:wrap;
}
.d8-why-tabs{ display:flex; gap:7px; flex-wrap:wrap; flex:1 1 260px; min-width:0; }
.d8-why-tab{
  display:flex; align-items:center; gap:7px; max-width:260px;
  padding:6px 10px; cursor:pointer;
  border:1px solid var(--c-border); border-radius:var(--radius-sm);
  background:#fff; font-family:var(--font); font-size:12px;
  color:var(--c-text); text-align:left; transition:border-color .15s, background .15s;
}
.d8-why-tab:hover{ border-color:var(--c-brand-mid); background:#f7fbfe; }
.d8-why-tab.on{
  border-color:var(--c-brand); background:var(--c-brand-light,#eaf3fa);
  box-shadow:0 0 0 2px rgba(2,90,162,.12);
}
.d8-why-tab-n{ flex:none; font-weight:700; color:var(--c-brand); font-size:11.5px; }
.d8-why-tab-t{
  flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  color:var(--c-text-dim); font-size:11.5px;
}
.d8-why-tab.on .d8-why-tab-t{ color:var(--c-text); }
.d8-why-tab-c{
  flex:none; font-family:var(--font-mono); font-size:10.5px;
  padding:1px 5px; border-radius:8px; background:var(--c-surface-2,#eef3f8); color:var(--c-text-dim);
}
.d8-why-tab.on .d8-why-tab-c{ background:var(--c-brand); color:#fff; }
.d8-why-tools{ display:flex; gap:7px; flex:none; }
.d8-why-tools .btn[disabled]{ opacity:.45; cursor:not-allowed; }
.d8-why-cause{ display:flex; flex-direction:column; gap:5px; }
.d8-why-cause label{ font-size:11.5px; color:var(--c-text-dim); line-height:1.5; }
.d8-why-cause input{
  width:100%; box-sizing:border-box;
  border:1px solid var(--c-border); border-radius:var(--radius-sm);
  padding:8px 11px; font-family:var(--font); font-size:12.5px;
  color:var(--c-text); background:#fff;
}
.d8-why-cause input:focus{
  outline:0; border-color:var(--c-brand-mid);
  box-shadow:0 0 0 3px rgba(74,127,181,.16);
}
.d8-why-rows{ display:flex; flex-direction:column; gap:11px; }

/* ---------------- 导出区 ---------------- */
.d8-exp-grid{
  display:grid; gap:11px;
  grid-template-columns:repeat(auto-fit,minmax(232px,1fr));
}
.d8-exp-btn{
  display:flex; flex-direction:column; align-items:flex-start; gap:4px;
  text-align:left; cursor:pointer;
  border:1px solid var(--c-border); border-radius:var(--radius-sm);
  background:var(--c-surface-2); padding:14px 15px;
  font-family:var(--font); transition:all .16s;
}
.d8-exp-btn:hover{
  border-color:var(--c-brand-mid); background:var(--c-brand-light);
  transform:translateY(-1px); box-shadow:var(--shadow-card);
}
.d8-exp-ico{ font-size:22px; line-height:1; }
.d8-exp-t{ font-size:13.5px; font-weight:700; color:var(--c-brand-dark); }
.d8-exp-d{ font-size:11.5px; color:var(--c-text-dim); line-height:1.55; }

/* ---------------- 弹窗 ---------------- */
.d8-mask{
  position:fixed; inset:0; z-index:900;
  background:rgba(20,32,46,.52);
  display:flex; align-items:center; justify-content:center;
  padding:20px; overflow-y:auto;
}
body.d8-lock{ overflow:hidden; }
.d8-modal{
  background:#fff; border-radius:var(--radius);
  box-shadow:var(--shadow-pop);
  width:100%; max-width:600px; max-height:92vh;
  display:flex; flex-direction:column;
  animation:d8pop .18s ease-out;
}
.d8-modal-wide{ max-width:820px; }
.d8-modal-tall{ max-height:94vh; }
@keyframes d8pop{ from{ opacity:0; transform:translateY(10px) scale(.98); } to{ opacity:1; transform:none; } }
.d8-modal-head{
  display:flex; align-items:center; gap:10px;
  padding:13px 17px; flex:none;
  background:var(--c-brand); color:#fff;
  border-radius:var(--radius) var(--radius) 0 0;
}
.d8-modal-head h3{ margin:0; font-size:14.5px; font-weight:700; flex:1; }
.d8-modal-x{
  border:0; background:rgba(255,255,255,.16); color:#fff;
  width:26px; height:26px; border-radius:50%;
  font-size:17px; line-height:1; cursor:pointer; flex:none;
  display:flex; align-items:center; justify-content:center;
  transition:background .14s;
}
.d8-modal-x:hover{ background:rgba(255,255,255,.3); }
.d8-modal-body{
  padding:16px 18px; overflow-y:auto; flex:1; min-height:0;
}

/* AI 设置 */
.d8-set-warn{
  background:var(--c-warn-bg); border:1px solid #ecd5ab;
  color:#8a5710; font-size:12px; line-height:1.7;
  padding:10px 13px; border-radius:var(--radius-sm);
  margin-bottom:16px;
}
.d8-set-sec{ margin-bottom:17px; }
.d8-set-sec h4{
  font-size:12.5px; font-weight:700; color:var(--c-brand-dark);
  margin:0 0 8px;
}
.d8-set-sec input, .d8-set-sec select, .d8-set-sec textarea{
  width:100%; box-sizing:border-box;
  border:1px solid var(--c-border); border-radius:var(--radius-sm);
  padding:8px 11px; font-family:var(--font); font-size:13px;
  color:var(--c-text); background:#fff;
}
.d8-set-sec textarea{
  resize:vertical; line-height:1.7; min-height:82px;
}
.d8-set-sec input:focus, .d8-set-sec select:focus, .d8-set-sec textarea:focus{
  outline:0; border-color:var(--c-brand-mid);
  box-shadow:0 0 0 3px rgba(74,127,181,.16);
}
.d8-prompt-row{
  display:flex; align-items:center; gap:9px; flex-wrap:wrap;
  margin-top:9px;
}
.d8-prompt-cnt{
  font-size:11.5px; color:var(--c-text-dim);
  margin-left:auto;
}
.d8-set-hint{
  font-size:11.5px; color:var(--c-text-dim);
  margin-top:6px; line-height:1.65; white-space:pre-wrap;
}
.d8-set-hint code{
  background:#eef1f4; padding:1px 5px; border-radius:3px;
  font-family:var(--font-mono); font-size:11px;
}
.d8-preset-grid{
  display:grid; gap:7px;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
}
.d8-preset{
  border:1px solid var(--c-border); background:#fff;
  color:var(--c-text-mid); font-family:var(--font); font-size:12.5px;
  padding:8px 10px; border-radius:var(--radius-sm); cursor:pointer;
  transition:all .15s;
}
.d8-preset:hover{ border-color:var(--c-brand-mid); background:var(--c-brand-light); color:var(--c-brand); }
.d8-preset.on{
  background:var(--c-brand); border-color:var(--c-brand);
  color:#fff; font-weight:600;
}
.d8-key-row, .d8-model-row{ display:flex; gap:7px; }
.d8-key-row input, .d8-model-row input{ flex:1; min-width:0; }
.d8-key-row .btn, .d8-model-row .btn{ flex:none; }
.d8-param-grid{
  display:grid; gap:11px 13px;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
}
.d8-test-row{ display:flex; align-items:center; gap:11px; flex-wrap:wrap; }
.d8-test-msg{
  font-size:12px; color:var(--c-text-dim);
  line-height:1.6; white-space:pre-wrap; flex:1; min-width:180px;
}
.d8-test-ok{ color:var(--c-ok); font-weight:600; }
.d8-test-bad{ color:var(--c-bad); }
.d8-test-warn{ color:var(--c-warn); }
.d8-set-foot{
  display:flex; align-items:center; gap:9px;
  margin-top:19px; padding-top:15px;
  border-top:1px solid var(--c-border-soft);
}

/* AI 助手 */
.d8-ai-warn{
  background:var(--c-info-bg); border:1px solid #c7d9ec;
  color:#173f6e; font-size:12px; line-height:1.7;
  padding:10px 13px; border-radius:var(--radius-sm);
  margin-bottom:15px;
}
/* 默认提示词状态条 */
.d8-ai-pref{
  display:flex; align-items:baseline; gap:8px; flex-wrap:wrap;
  background:var(--c-ok-bg); border:1px solid #b8dfc8; color:#1c6b3c;
  font-size:11.5px; line-height:1.7;
  padding:7px 12px; border-radius:var(--radius-sm);
  margin:-8px 0 15px;
}
.d8-ai-pref a{ color:var(--c-brand); font-weight:600; text-decoration:none; }
.d8-ai-pref a:hover{ text-decoration:underline; }
.d8-ai-pref-off{
  background:#f4f6f8; border-color:var(--c-border); color:var(--c-text-dim);
}
.d8-ai-tasks{
  display:grid; gap:9px;
  grid-template-columns:repeat(auto-fit,minmax(228px,1fr));
  margin-bottom:15px;
}
.d8-ai-task{
  display:grid; gap:2px;
  grid-template-columns:auto 1fr;
  grid-template-rows:auto auto;
  text-align:left; cursor:pointer;
  border:1px solid var(--c-border); border-radius:var(--radius-sm);
  background:#fff; padding:11px 13px;
  font-family:var(--font); transition:all .15s;
}
.d8-ai-task:hover:not(:disabled){
  border-color:var(--c-brand-mid); background:var(--c-brand-light);
  transform:translateY(-1px); box-shadow:var(--shadow-card);
}
.d8-ai-task:disabled{ opacity:.5; cursor:not-allowed; }
.d8-ai-task-ico{ grid-row:1 / 3; font-size:19px; margin-right:9px; align-self:center; }
.d8-ai-task-t{ font-size:13px; font-weight:700; color:var(--c-brand-dark); }
.d8-ai-task-d{ font-size:11px; color:var(--c-text-dim); line-height:1.5; }

.d8-ai-extra{ margin-bottom:13px; }.d8-ai-extra label{
  display:block; font-size:12px; font-weight:600;
  color:var(--c-text-mid); margin-bottom:5px;
}
.d8-ai-extra input{
  width:100%; box-sizing:border-box;
  border:1px solid var(--c-border); border-radius:var(--radius-sm);
  padding:8px 11px; font-family:var(--font); font-size:12.5px;
}
.d8-ai-extra input:focus{
  outline:0; border-color:var(--c-brand-mid);
  box-shadow:0 0 0 3px rgba(74,127,181,.16);
}

.d8-ai-status{
  font-size:12px; color:var(--c-text-dim);
  padding:8px 12px; background:var(--c-surface-2);
  border:1px solid var(--c-border-soft); border-radius:var(--radius-sm);
  margin-bottom:11px;
}
.d8-ai-st-busy{ color:var(--c-brand); font-weight:600; }
.d8-ai-st-ok{ color:var(--c-ok); font-weight:600; background:var(--c-ok-bg); border-color:#b8dfc8; }
.d8-ai-st-bad{ color:var(--c-bad); background:var(--c-bad-bg); border-color:#f2c2ba; white-space:pre-wrap; }
.d8-ai-st-warn{ color:var(--c-warn); background:var(--c-warn-bg); border-color:#ecd5ab; }

.d8-ai-out{
  border:1px solid var(--c-border); border-radius:var(--radius-sm);
  background:#fbfcfd; padding:13px 15px;
  font-family:var(--font); font-size:12.5px; line-height:1.8;
  color:var(--c-text);
  white-space:pre-wrap; word-break:break-word;
  min-height:190px; max-height:44vh; overflow-y:auto;
}
.d8-ai-out:empty::before{
  content:'AI 输出将显示在这里。先选择上方任意一个任务按钮开始。';
  color:var(--c-text-dim); font-style:italic;
}
.d8-ai-foot{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  margin-top:13px;
}
.d8-ai-note{ font-size:11px; color:var(--c-text-dim); }

/* AI 助手：一键写入区（写入清单 + 覆盖开关） */
.d8-ai-write{
  margin-top:11px; border:1px solid var(--c-border); border-radius:var(--radius-sm);
  background:var(--c-surface-2); overflow:hidden;
}
.d8-ai-write[hidden]{ display:none !important; }
.d8-ai-write-h{
  display:flex; align-items:center; gap:9px; flex-wrap:wrap;
  padding:8px 12px; background:var(--c-brand-light);
  border-bottom:1px solid var(--c-border);
  font-size:12px; color:var(--c-brand-dark);
}
.d8-ai-write-scope{ font-size:11px; color:var(--c-text-dim); flex:1; min-width:140px; }
.d8-ai-ov{
  display:inline-flex; align-items:center; gap:5px; cursor:pointer; white-space:nowrap;
  font-size:11.5px; color:var(--c-text);
  padding:2px 9px; border:1px solid var(--c-border); border-radius:12px; background:#fff;
}
.d8-ai-ov input{ margin:0; cursor:pointer; }
.d8-ai-write-list{ max-height:134px; overflow-y:auto; padding:7px 12px 8px; }
.d8-ai-write-f{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:8px 12px; border-top:1px solid var(--c-border); background:#fff;
}
.d8-ai-write-note{ font-size:11px; color:var(--c-text-dim); }

/* Toast */
.d8-toast{
  position:fixed; left:50%; bottom:28px; transform:translate(-50%,16px);
  z-index:1000;
  background:var(--c-brand-dark); color:#fff;
  font-family:var(--font); font-size:12.5px;
  padding:11px 19px; border-radius:22px;
  box-shadow:var(--shadow-pop);
  opacity:0; pointer-events:none;
  transition:opacity .2s, transform .2s;
  max-width:82vw; text-align:center; line-height:1.5;
}
.d8-toast.on{ opacity:1; transform:translate(-50%,0); }

/* ---------------- 响应式 ---------------- */
@media (max-width: 720px){
  .d8-tb-right{ margin-left:0; width:100%; }
  .d8-tb-right .btn{ flex:1; }
  .d8-toolbar .btn{ font-size:12.5px; padding:8px 13px; }
  .d8-kpis{ grid-template-columns:1fr 1fr; }
  .d8-fb-grid{ grid-template-columns:1fr; }
  .d8-exp-grid{ grid-template-columns:1fr; }
  .d8-modal{ max-width:100%; max-height:96vh; }
  .d8-mask{ padding:8px; }
  .d8-modal-body{ padding:14px 14px; }
  .d8-ai-tasks{ grid-template-columns:1fr; }
  .d8-why-row{ gap:9px; padding-left:9px; }
  .d8-why-no{ width:52px; font-size:11px; }
  .d8-param-grid, .d8-meta-grid{ grid-template-columns:1fr; }
  .d8-preset-grid{ grid-template-columns:1fr 1fr; }
  .d8-fb-svg svg{ min-width:560px; }
}
@media (max-width: 420px){
  .d8-kpis{ grid-template-columns:1fr; }
  .d8-preset-grid{ grid-template-columns:1fr; }
  .d8-ai-out{ max-height:38vh; }
}

/* ---------------- AI 设置：连接方式与模型下拉 ---------------- */
.d8-proxy-box{ margin-top:8px; }
.d8-proxy-box[hidden]{ display:none !important; }
/* 代理地址的两个常用候选，一键填入，省得手打整串地址 */
.d8-proxy-quick{ display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; }
.d8-mini{ cursor:pointer; border:1px solid var(--c-border); background:var(--c-surface-2);
  color:var(--c-text-mid); border-radius:3px; padding:3px 8px; font-family:var(--font);
  font-size:11px; line-height:1.6; }
.d8-mini:hover{ border-color:var(--c-brand-mid); background:var(--c-brand-light); color:var(--c-brand); }

/* 模型名下拉：<datalist> 只在手动输入时浮现、点击根本不展开，
   这里自绘一个真正能点开的选择列表。 */
.d8-combo{ position:relative; flex:1; min-width:0; display:flex; }
.d8-combo input{ flex:1; min-width:0; padding-right:64px; }
.d8-combo-tg{ position:absolute; right:1px; top:1px; bottom:1px; width:58px;
  display:flex; align-items:center; justify-content:center; gap:4px;
  border:0; border-left:1px solid var(--c-border); background:var(--c-surface-2);
  color:var(--c-text-mid); cursor:pointer; font-size:12px;
  border-radius:0 3px 3px 0; transition:background .14s, color .14s; }
.d8-combo-tg:hover{ background:var(--c-brand-light); color:var(--c-brand); }
.d8-combo-arw{ font-size:11px; line-height:1; }
.d8-combo-cnt{ font-size:10px; line-height:1.5; background:var(--c-brand); color:#fff;
  border-radius:8px; padding:0 5px; min-width:14px; text-align:center; }
.d8-combo-cnt[hidden]{ display:none !important; }

/* fixed 定位：弹窗自身有 overflow:auto，绝对定位会被裁掉。
   面板改成纵向 flex：头部搜索框常驻不动，只有下面的列表滚动。
   这样即使拉到 80+ 个模型，搜索框也不会被滚出可视区。 */
.d8-combo-pop{ position:fixed; z-index:1100; box-sizing:border-box; display:flex;
  flex-direction:column; padding:0;
  background:#fff; border:1px solid var(--c-border); border-radius:var(--radius-sm);
  box-shadow:var(--shadow-pop); overflow:hidden; }
.d8-combo-pop[hidden]{ display:none !important; }
.d8-combo-hd{ flex:none; padding:5px; background:var(--c-surface-2);
  border-bottom:1px solid var(--c-border-soft); }
.d8-combo-q{ width:100%; box-sizing:border-box; border:1px solid var(--c-border);
  border-radius:3px; padding:5px 8px; font-family:var(--font); font-size:11.5px;
  line-height:1.5; color:var(--c-text); background:#fff; }
.d8-combo-q:focus{ outline:0; border-color:var(--c-brand-mid); box-shadow:0 0 0 2px rgba(74,127,181,.16); }
.d8-combo-list{ flex:1; min-height:0; overflow-y:auto; padding:4px; }
.d8-combo-item{ display:block; width:100%; box-sizing:border-box; text-align:left;
  border:0; background:transparent; padding:7px 9px; border-radius:3px; cursor:pointer;
  color:var(--c-text); font-family:var(--font-mono); font-size:11.5px; line-height:1.5;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.d8-combo-item:hover{ background:var(--c-brand-light); }
.d8-combo-item.hi{ background:var(--c-brand-light); }
.d8-combo-item.on{ background:var(--c-brand); color:#fff; }
.d8-combo-empty{ padding:9px 10px; font-size:11.5px; line-height:1.7; color:var(--c-text-dim); }

/* AI 助手：推理模型的思考过程单独显示，避免长时间空白像是卡死 */
.d8-ai-thinkbox{ border:1px dashed var(--c-border); border-radius:var(--radius-sm);
  background:var(--c-surface-2); padding:8px 11px; margin-bottom:10px; }
.d8-ai-thinkbox[hidden]{ display:none !important; }
.d8-ai-thinkhead{ font-size:11px; color:var(--c-text-dim); margin-bottom:5px; }
.d8-ai-think{ font-size:11.5px; line-height:1.75; color:var(--c-text-dim);
  white-space:pre-wrap; word-break:break-word; max-height:132px;
  overflow-y:auto; font-style:italic; }

/* AI 助手：待确认清单（每条 = 一段内容 + 目标字段，勾选后确认写入） */
.d8-ai-wp-empty{ font-size:11px; color:var(--c-text-dim); line-height:1.75; }
.d8-ai-wr{ display:flex; align-items:flex-start; gap:8px; padding:6px 0;
  border-bottom:1px dashed var(--c-border); }
.d8-ai-wr:last-child{ border-bottom:0; }
.d8-ai-wr-ck{ flex:0 0 auto; padding-top:2px; }
.d8-ai-wr-ck input{ margin:0; cursor:pointer; }
.d8-ai-wr-b{ flex:1; min-width:0; }
.d8-ai-wr-t{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.d8-ai-wr-src{ flex:0 0 auto; font-size:9.5px; padding:1px 5px; border-radius:3px;
  background:var(--c-brand-light); color:var(--c-brand-dark); }
.d8-ai-wr-src.man{ background:var(--c-warn-bg); color:#8a5a12; }
.d8-ai-wr-lb{ flex:0 1 auto; min-width:0; font-size:10px; color:var(--c-text-dim);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.d8-ai-wr-tag{ flex:0 0 auto; font-size:9.5px; padding:1px 5px; border-radius:3px;
  background:var(--c-ok-bg); color:#1c7a45; }
.d8-ai-wr-tag.over{ background:var(--c-warn-bg); color:#8a5a12; }
.d8-ai-wr-tag.skip{ background:#eef1f4; color:var(--c-text-dim); }
.d8-ai-wr-tag.none{ background:#fde8e8; color:#b42318; }
.d8-ai-wr-sel{ flex:1 1 190px; min-width:0; font-size:11px; padding:2px 4px;
  border:1px solid var(--c-border); border-radius:4px; background:#fff; color:inherit; }
.d8-ai-wr-p{ font-size:10.5px; color:var(--c-text-dim); line-height:1.5; margin-top:2px;
  word-break:break-word; }
.d8-ai-wr.on .d8-ai-wr-p{ color:var(--c-text); }
.d8-ai-map-ck{ flex:0 0 auto; }
.d8-ai-map-ck input{ margin:0; cursor:pointer; }

/* AI 助手：手动指派（自动识别失败时的保底通路） */
.d8-ai-map{ border-top:1px solid var(--c-border); background:#fff; }
.d8-ai-map[hidden]{ display:none !important; }
.d8-ai-map-h{ display:flex; align-items:center; gap:9px; flex-wrap:wrap;
  padding:8px 12px; background:var(--c-warn-bg); border-bottom:1px solid var(--c-border);
  font-size:12px; color:#8a5a12; }
.d8-ai-map-tip{ font-size:11px; color:var(--c-text-dim); flex:1; min-width:150px; }
.d8-ai-map-list{ max-height:210px; overflow-y:auto; padding:6px 12px 8px; }
.d8-ai-map-row{ display:flex; align-items:center; gap:8px; padding:5px 0;
  border-bottom:1px dashed var(--c-border); }
.d8-ai-map-row:last-child{ border-bottom:0; }
.d8-ai-map-row.done{ opacity:.5; }
.d8-ai-map-row.done .d8-ai-map-name::after{ content:' ✓ 已写入'; color:#1c7a45; font-size:10px; }
.d8-ai-map-info{ flex:1; min-width:0; }
.d8-ai-map-name{ font-size:11.5px; font-weight:600; color:var(--c-brand-dark);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.d8-ai-map-len{ font-weight:400; color:var(--c-text-dim); font-size:10px; margin-left:6px; }
.d8-ai-map-prev{ font-size:10.5px; color:var(--c-text-dim); line-height:1.45;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.d8-ai-map-sel{ flex:0 0 172px; font-size:11px; padding:3px 4px;
  border:1px solid var(--c-border); border-radius:var(--radius-sm);
  background:#fff; color:var(--c-text); max-width:172px; }
.d8-ai-map-go{ flex:0 0 auto; }

@media (max-width: 560px){
  .d8-ai-write-list{ max-height:110px; }
  .d8-ai-wr-sel{ flex:1 1 100%; }
  .d8-ai-wr{ flex-wrap:nowrap; }
  .d8-ai-write-scope{ display:none; }
  .d8-combo-tg{ width:46px; }
  .d8-ai-think{ max-height:100px; }
  .d8-ai-map-row{ flex-wrap:wrap; }
  .d8-ai-map-sel{ flex:1 1 100%; max-width:none; }
  .d8-ai-map-list{ max-height:180px; }
}

/* ---------------- 打印 ---------------- */
@media print{
  .d8-toolbar, .d8-exp-grid, .d8-fb-acts, .d8-fb-add,
  .d8-toast, .d8-mask, .d8-chip{ display:none !important; }
  .d8-fb-svg{ border:0; padding:0; overflow:visible; }
  .d8-fb-svg svg{ min-width:0; width:100%; }
  .d8-card, .d8-fb-cat{ box-shadow:none; break-inside:avoid; }
  .d8-fb-txt{ box-shadow:none !important; background:transparent !important; }
}