:root{--night:#0A0E1A;--navy:#102345;--ice:#F4F6FA;--steel:#8892A6;--red:#E10606;--line:rgba(244,246,250,.14)}
*{box-sizing:border-box}[hidden]{display:none!important}
body{margin:0;background:var(--night);color:var(--ice);font:15px/1.4 Inter,system-ui,sans-serif;height:100vh;display:flex;flex-direction:column}
header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;border-bottom:1px solid var(--line)}
.brand{font:600 20px 'Space Grotesk',Inter,sans-serif;letter-spacing:.04em;display:flex;align-items:center;gap:10px}.brand i{width:10px;height:10px;border-radius:50%;background:var(--red)}.brand span{color:var(--steel);font-weight:400}
nav button{background:none;border:0;color:var(--steel);padding:8px 14px;font:inherit;cursor:pointer;border-bottom:2px solid transparent}nav button.on{color:var(--ice);border-color:var(--red)}
main{flex:1;display:flex;min-height:0}
aside{width:380px;flex:none;overflow:auto;padding:20px 24px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:14px}
aside section{display:flex;flex-direction:column;gap:12px}
label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--steel);text-transform:uppercase;letter-spacing:.08em}
label small{text-transform:none;letter-spacing:0;opacity:.7}.row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
input,select,textarea{background:#0f1526;color:var(--ice);border:1px solid var(--line);border-radius:6px;padding:9px 10px;font:14px Inter,sans-serif;text-transform:none;letter-spacing:0;width:100%}
textarea{resize:vertical}input:focus,select:focus,textarea:focus{outline:1px solid var(--red)}
label.chk{flex-direction:row;align-items:center;gap:8px;text-transform:none;letter-spacing:0;font-size:14px;color:var(--ice)}label.chk input{width:auto}
details{border:1px solid var(--line);border-radius:6px;padding:8px 10px}details summary{cursor:pointer;color:var(--steel);font-size:13px}details textarea,details input{margin-top:8px}
.hint{font-size:12px;color:var(--steel);margin:0}
.actions{display:flex;gap:10px}
button{background:var(--red);color:#fff;border:0;border-radius:6px;padding:11px 16px;font:600 14px Inter,sans-serif;cursor:pointer}button:disabled{opacity:.5;cursor:wait}
button.ghost{background:none;border:1px solid var(--line);color:var(--ice);margin-top:0;font-weight:500}
.bar{height:6px;background:#0f1526;border-radius:3px;overflow:hidden}.bar i{display:block;height:100%;width:0;background:var(--red);transition:width .3s}#job span{font-size:12px;color:var(--steel)}
#result a{color:var(--ice)}#result video{width:100%;border-radius:6px;margin-top:8px;background:#000}
#stage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:20px;min-width:0;background:#070a14}
#frame{flex:1;width:100%;min-height:0;position:relative}
#pv{position:absolute;left:50%;top:50%;border:0;transform-origin:0 0;background:#000;box-shadow:0 10px 50px rgba(0,0,0,.6)}
#scrub{display:flex;align-items:center;gap:12px;width:min(560px,100%)}#scrub button{padding:6px 12px}#scrub input{flex:1}#tl{font:13px 'JetBrains Mono',monospace;color:var(--steel);min-width:56px}
#warn{color:#ffb4b4;font-size:13px;margin:0}
aside h3{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--steel,#8892A6);margin-top:6px}
.list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.list li{display:flex;align-items:center;gap:10px;font-size:13px}
.list li.img img{width:56px;height:42px;object-fit:cover;border-radius:4px;background:#000}
.list li.img div{flex:1;min-width:0;display:flex;flex-direction:column}
.list li.img small{color:#8892A6;white-space:normal}
.list li.img.warn small{color:#E0A020}
.list li.img.ok small{color:#4CAF50}
.list li small{margin-left:auto;color:#8892A6}
.list li button{margin-left:auto;flex:none;padding:4px 8px;font-size:12px}
input[type=range]{width:100%}
.brand em{font:400 11px/1 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--steel);border:1px solid var(--line);border-radius:999px;padding:5px 9px;margin-left:6px;white-space:nowrap}.brand em.ok{color:#7fd48a;border-color:rgba(127,212,138,.4)}
nav{display:flex;overflow-x:auto;scrollbar-width:none}nav::-webkit-scrollbar{display:none}nav button{white-space:nowrap}
.help{margin:0;padding-left:18px;font-size:13px;color:var(--ice);display:flex;flex-direction:column;gap:8px}.help b{color:#fff}code{font:12px 'JetBrains Mono',monospace;background:#0f1526;padding:1px 5px;border-radius:4px}
button[disabled].off{opacity:.45;cursor:not-allowed}
@media(max-width:800px){body{height:auto;min-height:100vh}header{flex-wrap:wrap;padding:10px 14px;gap:8px}label.inline{margin-left:0}nav{width:100%;order:3}main{flex-direction:column}aside{width:100%;border:0;order:2;max-height:none;padding:14px}#stage{order:1;min-height:52vh;padding:12px}}
label.inline{flex-direction:row;align-items:center;gap:8px;margin-left:auto}label.inline select{width:auto}
