/* 定妆图（第 3 期 ③）—— 嵌在设定库角色卡里 */
.set-portrait{margin-top:var(--sp-6);padding-top:var(--sp-5);border-top:1px solid var(--rule-2)}
.set-portrait-head{display:flex;align-items:baseline;gap:var(--sp-3);margin-bottom:var(--sp-4)}
.set-portrait-head h3{font-size:var(--fs-base);font-weight:600;color:var(--ink);margin:0}
.set-portrait-hint{font-size:var(--fs-xs);color:var(--ink-3)}

.pt-hint{font-size:var(--fs-sm);color:var(--ink-3);padding:var(--sp-2) 0}
.pt-error{font-size:var(--fs-sm);color:var(--accent);padding:var(--sp-2) 0}

.pt-current{display:flex;gap:var(--sp-5);align-items:flex-start}
.pt-thumb{
  flex:0 0 auto;width:150px;height:225px;
  border:1px solid var(--rule);border-radius:var(--radius);
  background:var(--paper-2);overflow:hidden;
  display:flex;align-items:center;justify-content:center;
}
.pt-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.pt-thumb-empty{font-size:var(--fs-xs);color:var(--ink-3);text-align:center;padding:var(--sp-3)}
.pt-side{flex:1;min-width:0}
.pt-src{font-size:var(--fs-sm);color:var(--ink-2);margin-bottom:var(--sp-3)}
.pt-ops{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.pt-file{display:none}

.pt-btn{
  font:inherit;font-size:var(--fs-sm);color:var(--ink-2);
  background:var(--paper);border:1px solid var(--rule);
  border-radius:var(--radius);padding:6px 12px;cursor:pointer;
  min-height:32px;
}
.pt-btn:hover{background:var(--paper-2);color:var(--ink)}
.pt-btn:disabled{opacity:.5;cursor:not-allowed}
.pt-btn-sm{font-size:var(--fs-xs);padding:4px 9px;min-height:26px}
.pt-btn-danger{color:var(--accent)}
.pt-btn-danger:hover{border-color:var(--accent)}

.pt-sub{font-size:var(--fs-sm);font-weight:600;color:var(--ink-2);margin:var(--sp-5) 0 var(--sp-3)}

.pt-stages,.pt-history,.pt-picker{margin-top:var(--sp-4)}
.pt-stage-row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) 0;flex-wrap:wrap}
.pt-stage-name{font-size:var(--fs-sm);color:var(--ink-2)}
.pt-stage-state{font-size:var(--fs-xs);color:var(--ink-3);flex:1}

.pt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:var(--sp-3)}
.pt-cell{position:relative;display:flex;flex-direction:column;gap:var(--sp-1)}
.pt-cell img{
  width:100%;aspect-ratio:2/3;object-fit:cover;display:block;
  border:1px solid var(--rule);border-radius:var(--radius);background:var(--paper-2);
}
.pt-cell-current img{border-color:var(--accent);border-width:2px}
.pt-badge{
  position:absolute;top:4px;left:4px;font-size:10px;line-height:1;
  background:var(--accent);color:var(--paper);padding:3px 5px;border-radius:var(--radius);
}
.pt-badge-stage{top:auto;bottom:32px;left:4px;background:var(--ink-2)}

.pt-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);
}
.pt-modal{
  background:var(--paper);border:1px solid var(--rule);border-radius:var(--radius);
  padding:var(--sp-5);max-width:640px;width:100%;max-height:80vh;overflow-y:auto;
}
.pt-modal-title{font-size:var(--fs-base);font-weight:600;margin-bottom:var(--sp-4)}
.pt-grid-modal{grid-template-columns:repeat(auto-fill,minmax(88px,1fr))}
.pt-grid-modal .pt-cell{cursor:pointer}
.pt-grid-modal .pt-cell:hover img{border-color:var(--accent)}
.pt-processed{
  font-size:var(--fs-xs);color:var(--warn);background:var(--paper-2);
  border:1px solid var(--rule-2);border-radius:var(--radius);
  padding:var(--sp-2) var(--sp-3);margin-bottom:var(--sp-4);
}
@media (max-width:640px){
  .pt-current{flex-direction:column}
  .pt-thumb{width:120px;height:180px}
}