/* ============ LookForge · 造型锻造厂 ============ */
:root{
  --bg:#0e0f12;
  --panel:#17191e;
  --panel2:#1e2128;
  --line:#2a2f38;
  --txt:#e8eaee;
  --dim:#8b93a3;
  --gold:#c8a45c;
  --gold2:#e0c078;
  --ok:#4ec28f;
  --warn:#e0a94a;
  --bad:#e05c5c;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  background:var(--bg);color:var(--txt);
  font-family:-apple-system,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  font-size:14px;line-height:1.6;min-height:100vh;
}

/* ---------- 顶栏 ---------- */
.lf-top{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 24px;border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,#14161b,#0e0f12);position:sticky;top:0;z-index:50;
}
.lf-brand{display:flex;align-items:baseline;gap:12px}
.lf-logo{
  font-size:22px;font-weight:800;letter-spacing:2px;
  background:linear-gradient(120deg,var(--gold2),#fff5d8,var(--gold));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.lf-logo i{font-style:normal;font-weight:300}
.lf-sub{font-size:12px;color:var(--dim);letter-spacing:4px}
.lf-top-right{display:flex;align-items:center;gap:14px;font-size:12px;color:var(--dim)}
.lf-dot{color:var(--dim);font-size:16px;line-height:1}
.lf-dot.on{color:var(--ok)}
.lf-dot.off{color:var(--bad)}

/* ---------- 步骤条 ---------- */
.lf-steps{
  display:flex;gap:8px;padding:14px 24px;border-bottom:1px solid var(--line);
  background:#111318;overflow-x:auto;
}
.lf-step{
  background:transparent;border:1px solid var(--line);color:var(--dim);
  padding:8px 18px;border-radius:999px;cursor:pointer;font-size:13px;
  white-space:nowrap;transition:.18s;
}
.lf-step b{color:var(--gold);margin-right:4px}
.lf-step:hover{border-color:var(--gold);color:var(--txt)}
.lf-step.on{background:linear-gradient(120deg,#2a2418,#1d1a12);border-color:var(--gold);color:var(--gold2)}

/* ---------- 主体 ---------- */
.lf-main{padding:22px 24px 60px;max-width:1560px;margin:0 auto}
.lf-pane{display:none}
.lf-pane.on{display:block;animation:lfFade .22s ease}
@keyframes lfFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.lf-cols{display:grid;grid-template-columns:320px 1fr;gap:18px;align-items:start}
.lf-cols.three{grid-template-columns:300px 300px 1fr}

/* ---------- 卡片 ---------- */
.lf-card{
  background:var(--panel);border:1px solid var(--line);border-radius:14px;
  padding:18px;
}
.lf-card.wide{margin-top:18px}
.lf-card h3{
  font-size:14px;font-weight:600;color:var(--gold2);margin-bottom:14px;
  letter-spacing:1px;display:flex;align-items:center;justify-content:space-between;
}
.lf-card label{
  display:block;margin-bottom:12px;font-size:12px;color:var(--dim);
}
.lf-card label input,.lf-card label select,.lf-card label textarea{
  display:block;width:100%;margin-top:5px;padding:9px 11px;
  background:var(--panel2);border:1px solid var(--line);border-radius:8px;
  color:var(--txt);font-size:13px;font-family:inherit;outline:none;transition:.15s;
}
.lf-card label input:focus,.lf-card label select:focus,.lf-card label textarea:focus{
  border-color:var(--gold);background:#22262e;
}
.lf-hint{color:#5b6272;font-size:11px;font-weight:400}
.lf-card label textarea{resize:vertical;min-height:64px;line-height:1.60}
.lf-ref-preview{margin:-6px 0 12px}
.lf-ref-preview img{width:100%;max-width:150px;border-radius:8px;border:1px solid var(--line);display:block}
.lf-card hr{border:none;border-top:1px solid var(--line);margin:16px 0}

/* ---------- 按钮 ---------- */
.lf-btn{
  padding:9px 18px;border-radius:9px;border:1px solid var(--line);
  background:var(--panel2);color:var(--txt);cursor:pointer;font-size:13px;
  font-family:inherit;transition:.16s;text-decoration:none;display:inline-block;
}
.lf-btn:hover{border-color:var(--gold);color:var(--gold2)}
.lf-btn.primary{
  width:100%;margin-top:6px;
  background:linear-gradient(120deg,var(--gold),var(--gold2));
  border:none;color:#1a1408;font-weight:700;letter-spacing:1px;
}
.lf-btn.primary:hover{filter:brightness(1.12);color:#1a1408}
.lf-btn.sm{padding:5px 12px;font-size:12px}
.lf-btn.ghost{background:transparent;padding:6px 14px;font-size:12px}
.lf-btn:disabled{opacity:.45;cursor:not-allowed}

/* ---------- 槽位 ---------- */
.lf-slot{
  display:grid;grid-template-columns:52px 1fr auto 46px;gap:8px;align-items:center;
  padding:8px;border:1px dashed var(--line);border-radius:9px;margin-bottom:8px;
}
.lf-slot span{font-size:12px;color:var(--dim)}
.lf-slot .lf-thumb{
  width:42px;height:42px;border-radius:6px;background:#0c0d10;
  background-size:cover;background-position:center;border:1px solid var(--line);
}
.lf-slot .lf-thumb.has{background-color:#000}

/* ---------- 列表 ---------- */
.lf-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.lf-empty{
  grid-column:1/-1;color:#5b6272;text-align:center;padding:36px 0;font-size:13px;
}

.lf-mcard{
  background:var(--panel);border:1px solid var(--line);border-radius:14px;
  overflow:hidden;transition:.18s;cursor:pointer;
}
.lf-mcard:hover{border-color:var(--gold);transform:translateY(-2px)}
.lf-mcard .lf-mimg{
  aspect-ratio:3/4;background:#0c0d10 center/cover no-repeat;
  display:flex;align-items:center;justify-content:center;color:#3a4049;font-size:12px;
}
.lf-mcard .lf-mbody{padding:10px 12px}
.lf-mcard .lf-mname{font-size:13px;font-weight:600}
.lf-mcard .lf-mmeta{font-size:11px;color:var(--dim);margin-top:2px}
.lf-badge{
  display:inline-block;padding:1px 8px;border-radius:999px;font-size:10px;
  margin-top:6px;border:1px solid var(--line);color:var(--dim);
}
.lf-badge.ready{border-color:var(--ok);color:var(--ok)}
.lf-badge.generating{border-color:var(--warn);color:var(--warn)}
.lf-badge.failed{border-color:var(--bad);color:var(--bad)}

/* ---------- 选模特 ---------- */
.lf-model-pick{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.lf-mpick{
  border:2px solid var(--line);border-radius:9px;overflow:hidden;cursor:pointer;
  aspect-ratio:3/4;background:#0c0d10 center/cover no-repeat;position:relative;
}
.lf-mpick.on{border-color:var(--gold);box-shadow:0 0 0 2px rgba(200,164,92,.25)}

/* ---------- 表格 ---------- */
.lf-table{width:100%;border-collapse:collapse;font-size:12px}
.lf-table th{
  text-align:left;padding:8px 10px;color:var(--dim);font-weight:500;
  border-bottom:1px solid var(--line);
}
.lf-table td{padding:9px 10px;border-bottom:1px solid #1c1f26}
.lf-table tr:hover td{background:#1a1d24}

/* ---------- 画廊 ---------- */
.lf-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.lf-gitem{
  border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#0c0d10;
}
.lf-gitem img{width:100%;display:block}

/* ---------- 造型卡 ---------- */
.lf-looks{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.lf-look{
  border:1px solid var(--line);border-radius:10px;padding:10px;
  background:var(--panel2);font-size:12px;
}
.lf-look .lf-ltitle{font-weight:600;margin-bottom:4px}
.lf-look .lf-lmeta{color:var(--dim);font-size:11px}

/* ---------- Toast ---------- */
.lf-toast{
  position:fixed;left:50%;bottom:36px;transform:translateX(-50%) translateY(20px);
  background:#232730;border:1px solid var(--gold);color:var(--gold2);
  padding:11px 22px;border-radius:10px;font-size:13px;opacity:0;pointer-events:none;
  transition:.25s;z-index:999;max-width:80vw;text-align:center;
}
.lf-toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
.lf-tip{font-size:11px;color:#5b6272;line-height:1.7;margin-top:10px}

@media(max-width:1100px){
  .lf-cols,.lf-cols.three{grid-template-columns:1fr}
}

/* ===== 视图完成度指示（5 张全检） ===== */
.lf-dots5 { display:flex; gap:4px; margin-top:6px; }
.lf-dot6 { width:8px; height:8px; border-radius:50%; display:inline-block; margin-right:3px; }
.lf-dot6.ok { background:#3fb950; }
.lf-dot6.miss { background:#3a3f4b; }
.lf-badge.warn { background:#5a4a1f; color:#f0c860; }

/* 视图标签 */
.lf-glabel { text-align:center; font-size:12px; color:#8b93a5; padding:6px 0 2px; }

/* ===== 第二步造型台补充样式（2026-10-31 21:22）===== */
.lf-gkind { background:#f6f4f0; border:1px solid #e3ded6; border-radius:10px; padding:10px 12px; margin-bottom:12px; }
.lf-gkind label { margin-bottom:4px; }
.lf-adv { margin-top:4px; }
.lf-adv summary { cursor:pointer; font-size:13px; color:#7a6f63; padding:6px 0; user-select:none; }
.lf-adv summary:hover { color:#3a332c; }
.lf-adv label { margin-top:8px; }
.lf-slot[data-kind="shoes"] { margin-bottom:6px; }
#pickModelTip { margin-top:8px; }

/* ============ 框选抠图（2026-11-01）============ */
.cut-wrap{margin:10px 0}
.cut-stage{position:relative;display:inline-block;max-width:100%;line-height:0}
.cut-stage img{max-width:100%;display:block;user-select:none;-webkit-user-drag:none}
.cut-stage canvas{position:absolute;left:0;top:0;width:100%;height:100%;cursor:crosshair;touch-action:none}
.cut-list{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 12px}
.cut-item{display:flex;align-items:center;gap:6px;background:#f6f6f8;border:1px solid #e2e2e8;
  border-radius:8px;padding:5px 8px;font-size:13px}
.cut-item b{background:#2b2b33;color:#fff;border-radius:50%;width:20px;height:20px;
  display:inline-flex;align-items:center;justify-content:center;font-size:11px}
.cut-item select{border:1px solid #d5d5dd;border-radius:6px;padding:2px 4px;font-size:12px}
.cut-item .del{cursor:pointer;color:#c33;font-weight:700;padding:0 3px}
.cut-done{background:#e8f7ec;border-color:#9ed3ad}

/* 模特卡删除键（2026-11-01） */
.lf-mcard{position:relative}
.lf-mdel{position:absolute;right:6px;top:6px;width:24px;height:24px;border-radius:50%;
  background:rgba(20,20,26,.62);color:#fff;font-size:13px;line-height:24px;text-align:center;
  cursor:pointer;opacity:0;transition:opacity .15s,background .15s;z-index:3;font-weight:700}
.lf-mcard:hover .lf-mdel{opacity:1}
.lf-mdel:hover{background:#d32f2f}
@media (hover:none){.lf-mdel{opacity:.85}}

/* ★ 2026-11-02 10:20 提示词核对框（主人要求⑥） */
.lf-prompt-box{margin:14px 0 10px;border:1px solid #3a4150;border-radius:8px;padding:10px;background:#1b2028}
.lf-prompt-head{display:flex;justify-content:space-between;align-items:center;gap:8px;
  font-size:12px;color:#c9d1e0;margin-bottom:8px;flex-wrap:wrap}
.lf-prompt-sel{background:#232936;color:#dfe6f2;border:1px solid #3a4150;border-radius:5px;
  padding:3px 6px;font-size:12px}
#cPromptText{width:100%;box-sizing:border-box;background:#12161d;color:#9fe8b0;
  border:1px solid #2d3440;border-radius:6px;font-family:ui-monospace,Menlo,monospace;
  font-size:11px;line-height:1.65;padding:8px;resize:vertical}
#cPromptLen{font-size:11px;color:#7d8798;margin-top:6px}