:root{--bg: #0f1115;--panel: #171a21;--panel-2: #1e222b;--border: #2a2f3a;--text: #e8eaf0;--text-dim: #9aa3b2;--accent: #4f8cff;--accent-hover: #6b9dff;--green: #34c98e;--red: #f26d6d;--orange: #f5a623;--radius: 10px}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;max-width:960px;margin:0 auto;padding:24px 20px 60px;min-height:100vh}.header{text-align:center;margin-bottom:20px}.header .title{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--accent)}.header h1{font-size:26px;margin:0;color:var(--text);letter-spacing:1px}.tagline{color:var(--text-dim);font-size:13px;margin:8px 0 0}.banner{background:#f26d6d1f;border:1px solid var(--red);color:var(--red);border-radius:var(--radius);padding:12px 16px;margin-bottom:16px;font-size:14px}.toolbar{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;margin-bottom:16px}.field{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--text-dim)}.field b{color:var(--accent)}.field select,.field input[type=range]{accent-color:var(--accent)}.field select{background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:8px 12px;font-size:14px;min-width:130px;cursor:pointer}.field input[type=range]{width:160px}.spacer{flex:1}.btn{background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:8px 18px;font-size:14px;cursor:pointer;transition:background .15s,border-color .15s,opacity .15s;white-space:nowrap}.btn:hover:not(:disabled){border-color:var(--accent)}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn.primary:hover:not(:disabled){background:var(--accent-hover)}.btn.ghost{background:transparent}.btn:disabled{opacity:.4;cursor:not-allowed}.dropzone{border:2px dashed var(--border);border-radius:14px;padding:44px 20px;text-align:center;transition:border-color .15s,background .15s,padding .2s;margin-bottom:16px}.dropzone.dragover{border-color:var(--accent);background:#4f8cff14}.dropzone.compact{padding:18px 20px}.dropzone.compact .dz-icon,.dropzone.compact .dz-hint{display:none}.dropzone.compact .dz-title{font-size:14px;margin:0 0 6px}.dropzone.compact .dz-or{display:none}.dz-icon{color:var(--accent)}.dz-title{font-size:17px;margin:12px 0 4px}.dz-or{color:var(--text-dim);font-size:13px;margin:4px 0 10px}.dz-btns{display:flex;gap:12px;justify-content:center}.dz-hint{color:var(--text-dim);font-size:12px;line-height:1.8;margin:18px 0 0}.summary{display:flex;align-items:center;gap:16px;font-size:13px;color:var(--text-dim);margin-bottom:12px}.summary span{white-space:nowrap}.overall{flex:1;height:6px;background:var(--panel-2);border-radius:3px;overflow:hidden}.overall>i{display:block;height:100%;width:0;background:var(--accent);border-radius:3px;transition:width .3s}.list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.item{display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:10px 14px;animation:fadein .2s ease}@keyframes fadein{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.thumb{width:52px;height:52px;border-radius:8px;background:var(--panel-2);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}.thumb img{width:100%;height:100%;object-fit:cover}.thumb-ph{font-size:10px;color:var(--text-dim);font-weight:600}.meta{flex:1;min-width:0}.name{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sub{font-size:12px;color:var(--text-dim);margin-top:3px}.status{width:150px;flex-shrink:0;display:flex;flex-direction:column;gap:5px}.badge{font-size:12px;align-self:flex-start;padding:2px 8px;border-radius:10px;background:var(--panel-2);color:var(--text-dim)}.badge.st-decoding,.badge.st-encoding{color:var(--accent);background:#4f8cff1f}.badge.st-done{color:var(--green);background:#34c98e1f}.badge.st-error{color:var(--red);background:#f26d6d1f}.badge.st-canceled{color:var(--orange);background:#f5a6231f}.bar{height:4px;background:var(--panel-2);border-radius:2px;overflow:hidden}.bar>i{display:block;height:100%;width:0;background:var(--accent);border-radius:2px;transition:width .3s}.item .st-error~.bar>i,.bar>i.indeterminate{background:var(--accent)}.err{font-size:11px;color:var(--red);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:14px}.actions{display:flex;gap:4px;flex-shrink:0}.icon-btn{background:transparent;border:none;color:var(--text-dim);cursor:pointer;padding:6px;border-radius:6px;display:flex;align-items:center;transition:color .15s,background .15s}.icon-btn:hover:not(:disabled){color:var(--accent);background:var(--panel-2)}.icon-btn:disabled{opacity:.3;cursor:not-allowed}.load-more{display:block;margin:14px auto;padding:10px 30px;background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:8px;font-size:14px;cursor:pointer;transition:border-color .15s,color .15s}.load-more:hover{border-color:var(--accent);color:var(--accent)}.load-more[hidden]{display:none}.toast{position:fixed;left:50%;bottom:32px;transform:translate(-50%) translateY(20px);background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:10px 20px;border-radius:8px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:100}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}.footer{margin-top:28px;text-align:center;color:var(--text-dim);font-size:12px;line-height:1.8}@media (max-width: 640px){.toolbar{gap:10px}.field input[type=range]{width:110px}.status{width:96px}.sub{display:none}.thumb{width:40px;height:40px}}