/* 保持原有暖铜配色与紧凑字号；新增组件（进度总览/分页/模态/toast）
   的形状与间距参照 pic.areu.pro 的设计尺度。 */
*{box-sizing:border-box}
:root{--bg:#12110f;--panel:#1c1a17;--card:#1f1c18;--line:#2f2b26;--fg:#e8e3da;
  --dim:#9a9187;--soft:#7d7568;--accent:#c8a45c;--ok:#6fae6f;--warn:#d8b45e;--err:#c96a5a;
  color-scheme:dark}
body{margin:0;background:var(--bg);color:var(--fg);
  font:14px/1.6 -apple-system,"PingFang SC","Microsoft YaHei",system-ui,sans-serif}
a{color:var(--accent)}
header{display:flex;align-items:center;gap:16px;padding:14px 20px;border-bottom:1px solid var(--line);
  background:var(--panel);position:sticky;top:0;z-index:9;flex-wrap:wrap}
header h1{font-size:16px;margin:0;font-weight:600;letter-spacing:.04em}
header .eyebrow{font-size:11px;letter-spacing:.12em;color:var(--soft);display:block;margin-bottom:2px}
header nav{display:flex;gap:14px;margin-left:auto;flex-wrap:wrap;align-items:center}
header nav a{text-decoration:none;color:var(--dim);font-size:13px}
header nav a.on,header nav a:hover{color:var(--accent)}
.wrap{max-width:1360px;margin:0 auto;padding:20px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:18px;margin-bottom:16px}
.card h2{font-size:14px;margin:0 0 14px;color:var(--accent);font-weight:600}
label{display:block;font-size:12px;color:var(--dim);margin:12px 0 5px}
input,select,textarea{width:100%;background:#151310;border:1px solid var(--line);color:var(--fg);
  border-radius:7px;padding:9px 11px;font:13px/1.5 inherit;font-family:ui-monospace,"SF Mono",Menlo,monospace}
textarea{min-height:170px;resize:vertical;line-height:1.75}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent)}
button{background:var(--accent);color:#1a1509;border:0;border-radius:7px;padding:9px 18px;
  font:600 13px inherit;cursor:pointer}
button:hover{filter:brightness(1.12)}
button:disabled{opacity:.4;cursor:not-allowed;filter:none}
button.ghost{background:transparent;border:1px solid var(--line);color:var(--fg)}
button.ghost:hover{border-color:var(--accent);filter:none}
button.danger{background:transparent;border:1px solid #5a3330;color:var(--err)}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.row>*{flex:1;min-width:150px}
.msg{padding:9px 12px;border-radius:7px;font-size:13px;margin-top:12px;display:none}
.msg.ok{display:block;background:#1d2a1d;color:var(--ok)}
.msg.err{display:block;background:#2d1b18;color:var(--err)}
.hint{font-size:12px;color:var(--dim);margin-top:6px;line-height:1.7}

/* 进度总览 */
.ov{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
.ov .big{font-size:38px;font-weight:600;line-height:1;margin:0}
.ov .big small{font-size:17px;color:var(--soft);font-weight:400}
.ov .pct{font-size:26px;color:var(--accent)}
progress{width:100%;height:8px;margin-top:14px;accent-color:var(--accent);
  border:0;border-radius:4px;background:#151310}
progress::-webkit-progress-bar{background:#151310;border-radius:4px}
progress::-webkit-progress-value{background:var(--accent);border-radius:4px}
#stats{display:flex;gap:18px;flex-wrap:wrap;margin-top:14px;color:var(--dim);font-size:12px}
#stats b{color:var(--fg);font-weight:600}
#worker{font-size:13px;color:var(--fg);margin:12px 0 0}

/* 筛选与网格 */
.filters{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.filters input{flex:2;min-width:180px}
.filters select{flex:1;min-width:130px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:12px}
.tile{background:var(--card);color:var(--fg);border:1px solid var(--line);border-radius:9px;overflow:hidden;
  cursor:pointer;position:relative;transition:border-color .15s;text-align:left;padding:0}
.tile:hover{border-color:var(--accent)}
.tile.sel{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.tile .im{aspect-ratio:3/4;background:#0d0c0a center/contain no-repeat;display:flex;
  align-items:center;justify-content:center;color:#4a453e;font-size:11px}
.tile img{width:100%;height:100%;object-fit:cover;display:block}
.tile .bd{padding:9px 10px}
.tile h3{font-size:13px;margin:0 0 5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile .meta{font-size:11px;color:var(--soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pick{position:absolute;top:7px;right:7px;width:20px;height:20px;border-radius:5px;
  border:1px solid var(--line);background:#000000a0;display:flex;align-items:center;
  justify-content:center;font-size:12px;color:transparent}
.tile.sel .pick{background:var(--accent);border-color:var(--accent);color:#1a1509}
.badge{display:inline-block;margin-top:7px;font-size:10px;padding:2px 7px;border-radius:4px;
  background:#2a2620;color:var(--dim)}
.badge.done{color:var(--ok);background:#1d2a1d}
.badge.running{color:var(--warn);background:#2b2513}
.badge.queued{color:var(--accent);background:#312917}
.badge.failed{color:var(--err);background:#2d1b18}
.pager{display:flex;justify-content:center;align-items:center;gap:18px;margin-top:18px;color:var(--dim);font-size:13px}

/* 运行记录 */
#events{padding:0;list-style:none;margin:0}
#events li{padding:9px 0;border-bottom:1px solid var(--line);color:var(--dim);font-size:12px}
#events li:last-child{border:0}
#events time{color:var(--soft);margin-right:14px;font-family:ui-monospace,monospace}

/* 模态 */
dialog{width:min(960px,94vw);max-height:88vh;border:1px solid var(--line);border-radius:12px;
  background:var(--panel);padding:22px;color:var(--fg)}
dialog::backdrop{background:#000000c0}
dialog h2{margin:0}
.compare{display:flex;gap:16px;flex-wrap:wrap;margin-top:12px}
.compare figure{flex:1;min-width:180px;margin:0}
.compare figcaption{font-size:11px;color:var(--soft);margin-bottom:6px}
.compare img{max-width:100%;max-height:320px;display:block;border:1px solid var(--line);border-radius:7px}
.compare img.src{image-rendering:pixelated}
#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);padding:11px 22px;
  background:#2b2513;border:1px solid var(--accent);border-radius:8px;display:none;z-index:99;font-size:13px}
.login{max-width:340px;margin:16vh auto;text-align:center;padding:0 20px}
.login h1{font-size:19px;letter-spacing:.06em;margin-bottom:6px}
.login p{color:var(--dim);font-size:12px;margin-bottom:22px}

@media(max-width:600px){
  .wrap{padding:14px}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .ov .big{font-size:30px}
  .filters input,.filters select{flex-basis:100%}
}