/* 配图面板 · 样式
 * 复用 base.css 的设计令牌，与写作台 / 设定库同一套视觉语言。
 * 不新增颜色，全部走 :root 变量。
 */

.ill-layout{flex:1;display:flex;min-height:0}
.ill-layout[hidden]{display:none}
.ill-main{flex:1;min-width:0;overflow-y:auto;min-height:0}
.ill-main > #illustrateRoot{padding:var(--sp-6) var(--sp-7) var(--sp-7);max-width:960px}

/* ---------------- 顶部 ---------------- */

.ill-head{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:var(--sp-4);flex-wrap:wrap;
  border-bottom:1px solid var(--rule);padding-bottom:var(--sp-4);
}
.ill-head-left{display:flex;align-items:baseline;gap:var(--sp-3);flex-wrap:wrap;min-width:0}
.ill-chapter{
  margin:0;font-family:"Songti SC","SimSun",serif;
  font-size:var(--fs-xl);font-weight:600;letter-spacing:-.01em;color:var(--ink);
}
.ill-count{
  font-family:"SF Mono",Consolas,monospace;font-size:var(--fs-xs);color:var(--ink-3);
}
.ill-head-ops{display:flex;align-items:center;gap:var(--sp-3);flex:0 0 auto;flex-wrap:wrap}
.ill-add{min-height:36px}

/* 「自动确认」开关 */
.ill-switch{
  display:inline-flex;align-items:center;gap:var(--sp-2);cursor:pointer;
  min-height:36px;padding:0 var(--sp-3);
  border:1px solid var(--rule);border-radius:var(--radius);
  background:var(--paper);font-size:var(--fs-sm);color:var(--ink-2);
}
.ill-switch:hover{border-color:var(--ink-3);color:var(--ink)}
.ill-switch input{margin:0;cursor:pointer;accent-color:var(--accent)}
.ill-switch-label{user-select:none}

/* ---------------- 提示条 ---------------- */

.ill-hint{font-size:var(--fs-sm);color:var(--ink-3);margin:var(--sp-4) 0}
.ill-note-slot:empty{display:none}
.ill-note{
  display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;
  margin-top:var(--sp-3);padding:var(--sp-2) var(--sp-3);
  border:1px solid var(--rule);border-left-width:3px;border-radius:var(--radius);
  background:var(--paper-2);font-size:var(--fs-sm);color:var(--ink-2);
}
.ill-note-text{flex:1 1 auto;min-width:0;word-break:break-word}
.ill-note.info{border-left-color:var(--ink-3)}
.ill-note.running{border-left-color:var(--warn);color:var(--warn)}
.ill-note.paused{border-left-color:var(--warn);color:var(--warn)}
.ill-note.ok{border-left-color:var(--ok);color:var(--ok)}
.ill-note.error{border-left-color:var(--accent);color:var(--accent)}

/* ---------------- 配图点卡片 ---------------- */

.ill-list{display:flex;flex-direction:column;gap:var(--sp-5);margin-top:var(--sp-5)}
.ill-point{
  border:1px solid var(--rule);border-radius:var(--radius);
  background:var(--paper);padding:var(--sp-4) var(--sp-5) var(--sp-5);
}
.ill-point.is-busy{opacity:.72}
.ill-point-head{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:var(--sp-4);flex-wrap:wrap;
}
.ill-point-title{display:flex;align-items:baseline;gap:var(--sp-2);flex-wrap:wrap;min-width:0}
.ill-point-caption{
  margin:0;font-size:var(--fs-base);font-weight:600;color:var(--ink);
  word-break:break-word;
}
.ill-badge{
  font-size:var(--fs-xs);letter-spacing:.06em;padding:1px 7px;
  border:1px solid var(--rule);border-radius:2px;color:var(--ink-3);flex:0 0 auto;
}
.ill-badge-main{color:var(--accent);border-color:var(--accent)}
.ill-badge-status{color:var(--ink-2)}
.ill-point-ops{display:flex;align-items:center;gap:var(--sp-2);flex:0 0 auto;flex-wrap:wrap}

/* 面板内按钮：比顶栏按钮小一号，但保持 36px 触达高度 */
.ill-btn{
  min-height:36px;padding:0 var(--sp-3);cursor:pointer;font-family:inherit;
  background:transparent;border:1px solid var(--rule);border-radius:var(--radius);
  font-size:var(--fs-sm);color:var(--ink-2);
}
.ill-btn:hover{border-color:var(--ink-3);color:var(--ink)}
.ill-btn:disabled{opacity:.45;cursor:not-allowed}
.ill-btn-ok{color:var(--ok);border-color:var(--ok)}
.ill-btn-ok:hover{color:var(--ok);border-color:var(--ok);opacity:.85}
.ill-danger{color:var(--accent);border-color:var(--accent)}
.ill-danger:hover{color:var(--accent);border-color:var(--accent);opacity:.85}
.ill-point-ops .btn-primary{min-height:36px;padding:0 var(--sp-4)}

/* ---------------- 图片区 ---------------- */

.ill-images{
  margin-top:var(--sp-4);padding-top:var(--sp-4);border-top:1px solid var(--rule-2);
}
.ill-current{display:block}
.ill-figure{
  margin:0;display:flex;flex-direction:column;gap:var(--sp-2);
  max-width:420px;
}
.ill-figure img{
  display:block;width:100%;height:auto;
  border:1px solid var(--rule);border-radius:var(--radius);background:var(--paper-2);
}
.ill-figcap{display:flex;align-items:baseline;gap:var(--sp-3);flex-wrap:wrap}
.ill-figcap-label{font-size:var(--fs-xs);letter-spacing:.08em;color:var(--ok)}
.ill-figcap-meta{
  font-family:"SF Mono",Consolas,monospace;font-size:var(--fs-xs);color:var(--ink-3);
}
.ill-figops{display:flex;gap:var(--sp-2);flex-wrap:wrap}

.ill-history{margin-top:var(--sp-5)}
.ill-subtitle{
  margin:0 0 var(--sp-3);font-size:var(--fs-xs);letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-3);font-weight:600;
}
.ill-thumbs{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--sp-3);
}
.ill-thumb{
  display:flex;flex-direction:column;gap:var(--sp-2);
  border:1px solid var(--rule);border-radius:var(--radius);
  padding:var(--sp-2);background:var(--paper);
}
.ill-thumb.is-deleted{background:var(--paper-2);border-style:dashed}
.ill-thumb img{
  display:block;width:100%;aspect-ratio:2/3;object-fit:cover;
  border-radius:2px;background:var(--paper-2);
}
.ill-thumb.is-deleted img{opacity:.5}
.ill-thumb-meta{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.ill-thumb-time{
  font-family:"SF Mono",Consolas,monospace;font-size:10px;color:var(--ink-3);
}
.ill-tag{
  font-size:10px;letter-spacing:.06em;padding:1px 5px;
  border:1px solid currentColor;border-radius:2px;
}
.ill-tag-trash{color:var(--warn)}
.ill-thumb-ops{display:flex;gap:var(--sp-1);flex-wrap:wrap}
.ill-thumb-ops .ill-btn{
  min-height:30px;padding:0 var(--sp-2);font-size:var(--fs-xs);flex:1 1 auto;
}

/* ---------------- F2 提示词编辑弹层 ---------------- */

.ill-mask{
  position:fixed;inset:0;background:rgba(27,25,23,.55);
  display:flex;align-items:center;justify-content:center;z-index:60;padding:var(--sp-5);
}
.ill-modal{
  background:var(--paper);border:1px solid var(--rule);border-radius:var(--radius);
  padding:var(--sp-5);max-width:680px;width:100%;max-height:86vh;overflow-y:auto;
  display:flex;flex-direction:column;gap:var(--sp-2);
}
.ill-modal-title{font-size:var(--fs-base);font-weight:600;margin-bottom:var(--sp-2)}
.ill-modal-label{font-size:var(--fs-xs);color:var(--ink-3);margin-top:var(--sp-2)}
.ill-modal-text{
  width:100%;min-height:150px;resize:vertical;font:inherit;font-size:var(--fs-sm);
  color:var(--ink);background:var(--paper-2);border:1px solid var(--rule);
  border-radius:var(--radius);padding:var(--sp-3);line-height:1.55;
}
.ill-modal-text-sm{min-height:70px}
.ill-modal-ops{display:flex;gap:var(--sp-2);justify-content:flex-end;margin-top:var(--sp-4);flex-wrap:wrap}
.ill-char-list{display:flex;flex-direction:column;gap:var(--sp-1);max-height:180px;overflow-y:auto}
.ill-char-row{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-sm);color:var(--ink-2)}
.ill-char-name{color:var(--ink)}
.ill-hint{font-size:var(--fs-xs);color:var(--ink-3)}

/* ---------------- 窄屏 ---------------- */

@media (max-width:900px){
  .ill-main > #illustrateRoot{padding:var(--sp-5) var(--sp-4) var(--sp-6)}
  .ill-head{flex-direction:column;align-items:stretch}
  .ill-head-ops{justify-content:flex-start}
  .ill-point{padding:var(--sp-4)}
  .ill-point-head{flex-direction:column;align-items:stretch}
  .ill-point-ops{justify-content:flex-start}
  .ill-figure{max-width:none}
}


/* ---------------- 未挂配图点的图（兜底区） ---------------- */
.ill-orphans { margin-top: var(--sp-6); padding-top: var(--sp-5);
  border-top: 1px solid var(--rule-2); }
.ill-orphans-title { font-size: var(--fs-lg); margin: 0 0 var(--sp-2); }
.ill-orphan-grid { display: grid; gap: var(--sp-3);
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); margin-top: var(--sp-3); }
.ill-orphan-cell { border: 1px solid var(--rule); border-radius: var(--radius);
  overflow: hidden; background: var(--paper-2); }
.ill-orphan-img { width: 100%; height: 180px; object-fit: cover; display: block; }
.ill-orphan-ops { display: flex; gap: var(--sp-1); padding: var(--sp-2); }
.ill-orphan-ops .ill-btn { flex: 1; font-size: var(--fs-xs); }
.ill-btn-danger { color: var(--accent); border-color: var(--accent); }