/* 设定库 · 样式
 * 复用 base.css 的设计令牌，与工作台同一套视觉语言。
 */

/* 顶栏一级导航 */
.ws-nav{display:flex;gap:var(--sp-1);flex:0 0 auto}
.ws-nav button{
  min-height:34px;padding:0 var(--sp-4);cursor:pointer;font-family:inherit;
  background:transparent;border:1px solid transparent;border-radius:var(--radius);
  font-size:var(--fs-sm);color:var(--ink-3);
}
.ws-nav button:hover{color:var(--ink-2)}
.ws-nav button.active{
  background:var(--paper-2);border-color:var(--rule);color:var(--ink);font-weight:550;
}

/* 设定库三栏 */
.set-layout{flex:1;display:flex;min-height:0}
.set-layout[hidden]{display:none}

/* 左：分类 + 列表 */
.set-side{
  width:270px;flex:0 0 270px;border-right:1px solid var(--rule);
  display:flex;flex-direction:column;min-height:0;background:var(--paper);
}
.set-tabs{display:flex;gap:var(--sp-1);padding:var(--sp-4) var(--sp-4) var(--sp-3)}
.set-tabs button{
  flex:1;min-height:36px;cursor:pointer;font-family:inherit;
  background:transparent;border:1px solid var(--rule);border-radius:var(--radius);
  font-size:var(--fs-sm);color:var(--ink-3);
}
.set-tabs button.active{background:var(--paper-2);color:var(--ink);font-weight:550}
.set-search{padding:0 var(--sp-4) var(--sp-3)}
.set-search input{
  width:100%;min-height:36px;padding:0 var(--sp-3);
  border:1px solid var(--rule);border-radius:var(--radius);
  background:var(--paper);color:var(--ink);font-family:inherit;font-size:var(--fs-sm);
}
.set-list{flex:1;overflow-y:auto;padding:0 var(--sp-2) var(--sp-3)}
.set-item{
  display:flex;align-items:baseline;gap:var(--sp-2);flex-wrap:wrap;
  width:100%;text-align:left;cursor:pointer;font-family:inherit;
  background:transparent;border:none;border-left:2px solid transparent;
  padding:var(--sp-3) var(--sp-3) var(--sp-3) var(--sp-4);
  border-radius:0;
}
.set-item:hover{background:var(--paper-2)}
.set-item.active{border-left-color:var(--accent);background:var(--paper-2)}
.set-item-name{font-size:var(--fs-sm);color:var(--ink-2)}
.set-item.active .set-item-name{color:var(--ink);font-weight:550}
.set-item-alias{font-size:var(--fs-xs);color:var(--ink-3)}
.set-item-scope{
  font-size:10px;letter-spacing:.06em;padding:1px 5px;
  border:1px solid var(--rule);border-radius:2px;color:var(--ink-3);
  margin-left:auto;flex:0 0 auto;
}
.set-side-foot{padding:var(--sp-3) var(--sp-4) var(--sp-4);border-top:1px solid var(--rule-2)}
.set-side-foot .btn-primary{width:100%}

/* 中：详情 */
.set-detail{flex:1;min-width:0;overflow-y:auto;min-height:0}
.set-card{padding:var(--sp-6) var(--sp-7) var(--sp-7);max-width:820px}
.set-card[hidden]{display:none}
.set-card-head{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:var(--sp-4);border-bottom:1px solid var(--rule);padding-bottom:var(--sp-4);
}
.set-card-title{display:flex;align-items:baseline;gap:var(--sp-3);flex-wrap:wrap}
.set-card-title h2{
  margin:0;font-family:"Songti SC","SimSun",serif;
  font-size:var(--fs-2xl);font-weight:600;letter-spacing:-.01em;
}
.set-badge{
  font-size:var(--fs-xs);letter-spacing:.06em;padding:2px 8px;
  border:1px solid var(--rule);border-radius:2px;color:var(--ink-3);
}
.set-badge[data-scope="world"]{color:var(--ok);border-color:var(--ok)}
.set-card-ops{display:flex;gap:var(--sp-2);flex:0 0 auto}

.set-fields{
  display:grid;grid-template-columns:7em 1fr;gap:var(--sp-2) var(--sp-4);
  margin:var(--sp-5) 0 0;
}
.set-fields dt{font-size:var(--fs-xs);color:var(--ink-3);letter-spacing:.06em}
.set-fields dd{margin:0;font-size:var(--fs-base);color:var(--ink-2);line-height:1.6}

.set-stages,.set-preview{
  margin-top:var(--sp-6);padding-top:var(--sp-5);border-top:1px solid var(--rule-2);
}
.set-stages-head,.set-preview-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:var(--sp-4);flex-wrap:wrap;
}
.set-stages-head h3,.set-preview-head h3{
  margin:0;font-size:var(--fs-xs);letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-3);font-weight:600;
}
.set-hint{font-size:var(--fs-sm);color:var(--ink-3);margin:var(--sp-3) 0}
.set-preview-input{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-sm);color:var(--ink-3)}
.set-preview-input input{
  width:5em;min-height:34px;padding:0 var(--sp-2);text-align:center;
  border:1px solid var(--rule);border-radius:var(--radius);
  background:var(--paper);color:var(--ink);font-family:inherit;
}

.set-timeline{list-style:none;margin:var(--sp-4) 0 0;padding:0}
.set-stage{
  position:relative;padding:0 0 var(--sp-5) var(--sp-5);
  border-left:2px solid var(--rule);
}
.set-stage:last-child{border-left-color:transparent;padding-bottom:0}
.set-stage::before{
  content:"";position:absolute;left:-6px;top:5px;width:10px;height:10px;
  border-radius:50%;background:var(--paper);border:2px solid var(--accent);
}
.set-stage-head{display:flex;align-items:baseline;gap:var(--sp-3);flex-wrap:wrap}
.set-stage-head strong{font-size:var(--fs-base);color:var(--ink)}
.set-stage-range{
  font-family:"SF Mono",Consolas,monospace;font-size:var(--fs-xs);color:var(--ink-3);
}
.set-stage-body{margin-top:var(--sp-2);font-size:var(--fs-sm);color:var(--ink-2)}
.set-stage-body p{margin:0 0 var(--sp-2)}
.set-stage-body ul{margin:0;padding-left:1.2em}
.set-stage-ops{margin-top:var(--sp-2)}

/* 编辑表单 */
.set-edit{margin-top:var(--sp-5)}
.set-edit-grid{
  display:grid;grid-template-columns:7em 1fr;gap:var(--sp-3) var(--sp-4);
  align-items:start;
}
.set-edit-grid > label,.set-edit-label{
  font-size:var(--fs-xs);color:var(--ink-3);letter-spacing:.06em;
  padding-top:10px;
}
.set-edit-grid input[type="text"],
.set-edit-grid textarea{
  width:100%;min-height:40px;padding:var(--sp-2) var(--sp-3);
  border:1px solid var(--rule);border-radius:var(--radius);
  background:var(--paper);color:var(--ink);font-family:inherit;font-size:var(--fs-sm);
  resize:vertical;
}
.set-edit-grid input:focus,.set-edit-grid textarea:focus{
  outline:none;border-color:var(--ink-3);
}
.set-edit-radio{display:flex;gap:var(--sp-4);align-items:center;min-height:40px;flex-wrap:wrap}
.set-edit-radio label{
  display:inline-flex;align-items:center;gap:var(--sp-2);
  font-size:var(--fs-sm);color:var(--ink-2);cursor:pointer;
}
.set-edit-custom{margin-top:var(--sp-5);padding-top:var(--sp-4);border-top:1px solid var(--rule-2)}
.set-edit-custom-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:var(--sp-3);margin-bottom:var(--sp-3);
}
.set-custom-row{display:flex;gap:var(--sp-2);margin-bottom:var(--sp-2);align-items:center}
.set-custom-row input{
  flex:1;min-width:0;min-height:40px;padding:var(--sp-2) var(--sp-3);
  border:1px solid var(--rule);border-radius:var(--radius);
  background:var(--paper);color:var(--ink);font-family:inherit;font-size:var(--fs-sm);
}
.set-custom-key{flex:0 0 30%}
.set-custom-row input:focus{outline:none;border-color:var(--ink-3)}
.set-edit-actions{
  display:flex;justify-content:flex-end;gap:var(--sp-3);
  margin-top:var(--sp-5);padding-top:var(--sp-4);border-top:1px solid var(--rule-2);
}

.set-resolved{margin-top:var(--sp-4)}
.set-resolved-line{display:flex;align-items:center;gap:var(--sp-3);margin:0 0 var(--sp-3);font-size:var(--fs-sm)}
.set-resolved-tag{
  font-size:var(--fs-xs);letter-spacing:.06em;padding:2px 8px;
  border:1px solid currentColor;border-radius:2px;flex:0 0 auto;
}
.set-resolved-tag.stage{color:var(--ok)}
.set-resolved-tag.base{color:var(--ink-3)}

/* 关系 / 提及 / 设定网 */
.set-rel,.set-mention{
  margin-top:var(--sp-6);padding-top:var(--sp-5);border-top:1px solid var(--rule-2);
}
.set-rel-head,.set-mention-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:var(--sp-4);flex-wrap:wrap;margin-bottom:var(--sp-3);
}
.set-rel-head h3,.set-mention-head h3,.set-net-head h3{
  margin:0;font-size:var(--fs-xs);letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-3);font-weight:600;
}
.set-rel-list,.set-mention-list{list-style:none;margin:0;padding:0}
.set-rel-item,.set-mention-item{
  padding:var(--sp-3) 0;border-bottom:1px solid var(--rule-2);
}
.set-rel-item:last-child,.set-mention-item:last-child{border-bottom:none}
.set-rel-line{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;font-size:var(--fs-sm)}
.set-rel-type{
  font-size:var(--fs-xs);letter-spacing:.04em;padding:1px 7px;
  border:1px solid var(--rule);border-radius:2px;color:var(--ink-2);
}
.set-rel-arrow{color:var(--ink-3)}
.set-rel-other{color:var(--ink);font-weight:550}
.set-rel-range{
  font-family:"SF Mono",Consolas,monospace;font-size:var(--fs-xs);
  color:var(--ink-3);margin-left:var(--sp-2);
}
.set-rel-desc{font-size:var(--fs-sm);color:var(--ink-3);margin-top:var(--sp-2)}
.set-rel-ops{margin-top:var(--sp-2)}
.set-mention-item{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-3)}
.set-mention-item span:first-child{font-size:var(--fs-sm);color:var(--ink-2)}
.set-mention-count{
  font-family:"SF Mono",Consolas,monospace;font-size:var(--fs-xs);color:var(--ink-3);
}

/* 设定网（关系 tab） */
.set-net{flex:1;min-width:0;overflow-y:auto;min-height:0}
.set-net[hidden]{display:none}
.set-net-head{
  display:flex;align-items:baseline;gap:var(--sp-4);
  padding:var(--sp-5) var(--sp-7) var(--sp-3);border-bottom:1px solid var(--rule-2);
}
.set-net-body{
  padding:var(--sp-5) var(--sp-7) var(--sp-7);
  display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--sp-4);
}
.set-net-node{
  border:1px solid var(--rule);border-radius:var(--radius);
  padding:var(--sp-4);background:var(--paper);
}
.set-net-name{font-size:var(--fs-base);color:var(--ink);font-weight:550;margin-bottom:var(--sp-3)}
.set-net-rels{list-style:none;margin:0;padding:0}
.set-net-rels li{
  display:flex;align-items:baseline;gap:var(--sp-2);flex-wrap:wrap;
  font-size:var(--fs-sm);color:var(--ink-2);padding:var(--sp-2) 0;
}

/* 选择器弹窗 */
.pick-list{max-height:50vh;overflow-y:auto;margin:var(--sp-3) 0}
.pick-item{
  display:block;width:100%;text-align:left;cursor:pointer;font-family:inherit;
  background:transparent;border:none;border-bottom:1px solid var(--rule-2);
  padding:var(--sp-3) var(--sp-2);font-size:var(--fs-sm);color:var(--ink-2);
}
.pick-item:hover{background:var(--paper-2);color:var(--ink)}

/* 写作页「本章涉及」 */
.ws-mentions{
  display:flex;align-items:baseline;gap:var(--sp-3);flex-wrap:wrap;
  margin-top:var(--sp-3);font-size:var(--fs-sm);
}
.ws-mentions[hidden]{display:none}
.ws-mentions-label{
  font-size:var(--fs-xs);letter-spacing:.1em;color:var(--ink-3);
  text-transform:uppercase;
}
.ws-mentions-list{display:inline-flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.ws-mention-chip{
  cursor:pointer;font-family:inherit;font-size:var(--fs-xs);
  padding:2px 8px;border:1px solid var(--rule);border-radius:999px;
  background:var(--paper);color:var(--ink-2);
}
.ws-mention-chip:hover{border-color:var(--accent);color:var(--accent)}

/* 窄屏 */
@media (max-width:900px){
  .set-layout{flex-direction:column}
  .set-side{
    width:auto;flex:none;border-right:none;border-bottom:1px solid var(--rule);
    max-height:40vh;
  }
  .set-detail{min-height:60vh}
  .set-card{padding:var(--sp-5) var(--sp-4) var(--sp-6)}
}


/* ---------------- 设定卡版本历史（U-4） ---------------- */

.set-versions { margin-top: var(--sp-5); }
.set-verlist {
  list-style: none; margin: var(--sp-3) 0 0; padding: 0;
  display: flex; flex-direction: column; gap: var(--sp-2);
}
.set-ver {
  border: 1px solid var(--rule); border-radius: var(--radius);
  padding: var(--sp-2) var(--sp-3); background: var(--paper);
}
.set-ver-head {
  display: flex; align-items: baseline; gap: var(--sp-3);
  flex-wrap: wrap; font-size: var(--fs-sm);
}
.set-ver-head strong { color: var(--ink); font-weight: 600; }
.set-ver-time { color: var(--ink-3); font-size: var(--fs-xs); }
.set-ver-snap {
  margin: var(--sp-1) 0 0; color: var(--ink-2);
  font-size: var(--fs-xs); line-height: 1.6;
}
.set-ver-acts { margin-top: var(--sp-2); }
.set-ver-acts .btn-ghost {
  font-size: var(--fs-xs); padding: 3px 10px;
}


/* 块3：按书 / 按世界 切换 + 归属标注 */
.set-scope-mode { display: flex; gap: var(--sp-1); margin-bottom: var(--sp-2); }
.set-scope-mode button {
  flex: 1; font-family: inherit; font-size: var(--fs-sm);
  border: 1px solid var(--rule); border-radius: var(--radius);
  background: transparent; color: var(--ink-2); padding: 5px 8px; cursor: pointer;
}
.set-scope-mode button.active {
  border-color: var(--accent); color: var(--accent); font-weight: 600;
}
.set-item-scope { font-size: var(--fs-xs); padding: 1px 6px; border-radius: var(--radius);
  border: 1px solid var(--rule-2); color: var(--ink-3); margin-left: auto; }
.set-item-scope.is-world { color: var(--accent); border-color: var(--accent); }
.set-item-scope.is-novel { color: var(--ink-3); }


/* ---------------- 关系图（SVG 环形） ---------------- */
.rel-graph-wrap { padding: var(--sp-3) 0; }
.rel-graph { width: 100%; max-width: 760px; height: auto;
  background: var(--paper-2); border: 1px solid var(--rule);
  border-radius: var(--radius); }
.rel-edge { stroke: var(--rule-2); stroke-width: 1.4; }
.rel-edge.hl { stroke: var(--accent); stroke-width: 2.4; }
.rel-edge-label { fill: var(--ink-3); font-size: 11px; }
.rel-edge-label.hl { fill: var(--accent); font-weight: 600; }
.rel-node { cursor: pointer; }
.rel-node-circle { fill: var(--paper); stroke: var(--ink-3); stroke-width: 1.6; }
.rel-node-circle.rel-node-character { stroke: var(--accent); }
.rel-node-circle.rel-node-scene { stroke: var(--ink-2); }
.rel-node.active .rel-node-circle { fill: var(--accent); stroke: var(--accent); }
.rel-node.active .rel-node-label { fill: var(--accent); font-weight: 600; }
.rel-node-label { fill: var(--ink-2); font-size: 12px; }