:root{--bg:#14161a;--panel:#1d2026;--line:#2c313a;--fg:#e6e8eb;--dim:#8b93a1;--acc:#4f8cff;--ok:#3fb27f;--warn:#e0a23a;--bad:#e5534b}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:14px/1.5 -apple-system,"PingFang SC",sans-serif}
a{color:var(--acc);text-decoration:none}
#bar{display:flex;gap:16px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--line);background:var(--panel)}
#bar #home{font-weight:600;color:var(--fg);display:flex;align-items:center;gap:10px}
.mark{width:26px;height:26px;display:block}.login h2{text-align:center;margin:0}.login .logo{width:120px;height:120px;margin:0 auto}#barinfo{color:var(--dim);flex:1}
button{background:var(--acc);color:#fff;border:0;border-radius:6px;padding:6px 14px;cursor:pointer;font:inherit}
button.ghost{background:transparent;border:1px solid var(--line);color:var(--fg)}
input{background:var(--bg);color:var(--fg);border:1px solid var(--line);border-radius:6px;padding:8px 10px;font:inherit;width:100%}
#app{padding:16px;max-width:1400px;margin:0 auto}
.login{max-width:360px;margin:12vh auto;display:flex;flex-direction:column;gap:12px}.err{color:var(--bad)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px;display:block;color:var(--fg)}
.card:hover{border-color:var(--acc)}.card h3{margin:0 0 6px;font-size:15px}
.badge{display:inline-block;border-radius:10px;padding:1px 8px;font-size:12px;background:var(--line);color:var(--dim)}
.badge.need{background:var(--bad);color:#fff}.dim{color:var(--dim)}
.work{display:grid;grid-template-columns:1fr 380px;gap:16px}@media(max-width:1000px){.work{grid-template-columns:1fr}}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px;margin-bottom:12px}
.panel h4{margin:0 0 8px;font-size:13px;color:var(--dim);font-weight:600}
.board{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.scene{position:relative;border:2px solid transparent;border-radius:6px;overflow:hidden;background:#000;cursor:pointer;aspect-ratio:16/9}
.scene.sel{border-color:var(--acc)}.scene img{width:100%;height:100%;object-fit:cover;display:block}
.scene .no{position:absolute;left:4px;top:4px;background:#000a;border-radius:4px;padding:0 6px;font-size:12px}
.scene .vs{position:absolute;right:4px;bottom:4px;width:10px;height:10px;border-radius:50%;background:var(--line)}
.vs.completed{background:var(--ok)}.vs.pending{background:var(--warn)}.vs.failed,.vs.cancelled{background:var(--bad)}
.timeline{display:flex;height:34px;gap:2px}.tl{min-width:6px;border-radius:3px;background:var(--line);cursor:pointer;position:relative}
.tl.completed{background:#2b6b50}.tl.pending{background:#8a6a24}.tl.failed,.tl.cancelled{background:#8a3a35}.tl.sel{outline:2px solid var(--acc)}
.tl span{position:absolute;left:3px;top:6px;font-size:11px;color:#fff9}
img.big,video.big{width:100%;border-radius:6px;background:#000}
audio{width:100%;margin:2px 0 8px}pre{white-space:pre-wrap;word-break:break-word;margin:0;font:13px/1.5 inherit;color:var(--fg)}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.sel-mark{color:var(--ok)}
button:disabled{opacity:.5;cursor:default}button.primary{background:var(--acc)}button:not(.primary):not(.ghost):not(.step){background:#3a4252}
button.ghost{background:transparent;border:1px solid var(--line);color:var(--fg)}button.ghost:hover{border-color:var(--acc)}
.stepper{display:flex;gap:4px;overflow-x:auto;padding-bottom:6px;margin-bottom:10px}
.step{display:flex;align-items:center;gap:7px;background:var(--panel)!important;border:1px solid var(--line);color:var(--dim);padding:7px 14px;border-radius:18px;white-space:nowrap}
.step .dot{width:9px;height:9px;border-radius:50%;background:var(--line)}
.step.done .dot{background:var(--ok)}.step.done{color:var(--fg)}.step.current .dot,.step.running .dot{background:var(--warn)}
.step.current,.step.running{color:var(--fg);border-color:var(--warn)}.step.gate{border-color:var(--bad)}.step.gate .dot{background:var(--bad)}
.step.skipped{opacity:.5;text-decoration:line-through}.step.on{outline:2px solid var(--acc)}
.gatebar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:8px 12px;margin-bottom:12px}
.gatebar.need{border-color:var(--bad)}.gname{font-weight:600}.spin{color:var(--warn)}
.view{min-width:0}.row{margin:6px 0}.hint{margin:4px 0 8px;font-size:13px}
.fld{width:100%;background:var(--bg);color:var(--fg);border:1px solid var(--line);border-radius:6px;padding:7px 9px;font:inherit;resize:vertical}
select.fld.sm{width:auto}.lab{min-width:84px;color:var(--dim)}.frow{margin:8px 0}.frow .lab{display:block;margin-bottom:3px}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}
.vcard{border:1px solid var(--line);border-radius:8px;padding:10px;background:#181b20}.vcard.sel{border-color:var(--ok)}
.vcard h5,.acard h5,.panel h5{margin:8px 0 4px;font-size:14px}.panel h4+h4,.panel h4{margin-top:14px}
.lyrics{max-height:340px;overflow:auto;border-top:1px solid var(--line);margin:8px 0;padding-top:6px}
.sec{color:var(--acc);font-size:12px;margin-top:6px}.lyr{padding:1px 0}.tag{margin-left:6px;font-size:11px;color:var(--warn);border:1px solid var(--warn);border-radius:8px;padding:0 5px}
.warn{color:var(--warn);font-size:13px}.cand{padding:6px 0;border-bottom:1px solid var(--line)}.cand.sel{background:#1c2a22}
.acards{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:12px}
.acard{display:flex;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px}
.acard>img,.acard>.noimg{width:150px;height:200px;object-fit:cover;border-radius:6px;cursor:zoom-in;flex:none;background:#000}
.candimg{display:inline-block;margin-right:6px;text-align:center}.candimg img{width:64px;height:84px;object-fit:cover;border-radius:4px;display:block;cursor:zoom-in}
.noimg{display:flex;align-items:center;justify-content:center;color:var(--dim);background:#0d0f12;min-height:60px;width:100%;height:100%}
.scene.pk{outline:2px solid var(--warn)}.scene .pick{position:absolute;right:4px;top:4px;width:18px;height:18px}
.i2v{max-height:240px;overflow:auto;background:#0f1114;padding:8px;border-radius:6px}
details{margin:8px 0}summary{cursor:pointer;color:var(--dim)}
#toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);max-width:min(720px,92vw);padding:10px 16px;border-radius:8px;background:#222;color:#fff;box-shadow:0 4px 20px #0008;opacity:0;pointer-events:none;transition:opacity .2s;white-space:pre-wrap;z-index:9}
#toast.show{opacity:1}#toast.ok{background:#1f5c43}#toast.warn{background:#7a5a14}#toast.bad{background:#7a2b27}