@font-face{font-family:Montserrat;src:url(/fonts/montserrat-v31-latin-500.ttf);font-weight:500}@font-face{font-family:Montserrat;src:url(/fonts/montserrat-v31-latin-700.ttf);font-weight:700}@font-face{font-family:Montserrat;src:url(/fonts/montserrat-v31-latin-900.ttf);font-weight:900}@font-face{font-family:Poppins;src:url(/fonts/poppins-v24-latin-500.ttf);font-weight:500}@font-face{font-family:Poppins;src:url(/fonts/poppins-v24-latin-700.ttf);font-weight:700}@font-face{font-family:Poppins;src:url(/fonts/poppins-v24-latin-900.ttf);font-weight:900}@font-face{font-family:Inter;src:url(/fonts/inter-v20-latin-500.ttf);font-weight:500}@font-face{font-family:Inter;src:url(/fonts/inter-v20-latin-700.ttf);font-weight:700}@font-face{font-family:Inter;src:url(/fonts/inter-v20-latin-900.ttf);font-weight:900}:root{--bg: #0f1115;--bg-2: #171a21;--bg-3: #1f2430;--border: #2a3040;--text: #e7eaf0;--text-dim: #98a0b3;--accent: #6366f1;--accent-2: #818cf8;--green: #22c55e;--amber: #f59e0b;--red: #ef4444;--radius: 8px;font-size:14px}*{box-sizing:border-box}html,body,#root{margin:0;height:100%}body{background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}h1,h2,h3{margin:0;font-weight:700}a{color:var(--accent-2);text-decoration:none}button{font:inherit;border:1px solid var(--border);background:var(--bg-3);color:var(--text);border-radius:var(--radius);padding:7px 14px;cursor:pointer}button:hover{border-color:var(--accent)}button:disabled{opacity:.5;cursor:not-allowed}button.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}button.primary:hover{background:var(--accent-2)}button.danger{color:var(--red)}input,select{font:inherit;background:var(--bg-2);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:7px 10px}input:focus,select:focus{outline:none;border-color:var(--accent)}input[type=checkbox]{accent-color:var(--accent);width:15px;height:15px}input[type=range]{accent-color:var(--accent);padding:0}input[type=color]{padding:2px;width:42px;height:30px;cursor:pointer}label{color:var(--text-dim)}@keyframes cs-pop{0%{transform:scale(.55)}to{transform:scale(1)}}.page{max-width:1200px;margin:0 auto;padding:20px 24px 60px}.topbar{display:flex;align-items:center;gap:16px;margin-bottom:20px}.topbar .brand{font-weight:900;font-size:18px;letter-spacing:.5px}.topbar .spacer{flex:1}.key-prompt{height:100%;display:flex;align-items:center;justify-content:center}.key-card{background:var(--bg-2);border:1px solid var(--border);border-radius:12px;padding:32px;width:340px;display:flex;flex-direction:column;gap:12px}.form-error{color:var(--red);font-size:13px}.filters{display:flex;gap:10px;margin-bottom:18px;flex-wrap:wrap}.filters input[type=search]{flex:1;min-width:180px}.job-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}.job-card{background:var(--bg-2);border:1px solid var(--border);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;transition:border-color .15s}.job-card:hover{border-color:var(--accent)}.job-thumb{position:relative;aspect-ratio:16/10;background:var(--bg-3);display:flex;align-items:center;justify-content:center;color:var(--text-dim)}.job-thumb img{width:100%;height:100%;object-fit:cover}.job-thumb .clips-badge,.job-thumb .dur-badge{position:absolute;bottom:8px;background:#000000b3;color:#fff;border-radius:6px;padding:2px 7px;font-size:12px}.job-thumb .clips-badge{left:8px}.job-thumb .dur-badge{right:8px}.job-card-body{padding:12px;display:flex;flex-direction:column;gap:8px}.job-card-body .name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.job-card-body .meta{color:var(--text-dim);font-size:12px;display:flex;gap:8px}.job-card-actions{display:flex;gap:8px;align-items:center}.status-badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600;width:fit-content;background:var(--bg-3);color:var(--text-dim)}.status-badge.needs_review{background:#f59e0b26;color:var(--amber)}.status-badge.done{background:#22c55e26;color:var(--green)}.status-badge.failed{background:#ef444426;color:var(--red)}.status-badge.rendering{background:#6366f126;color:var(--accent-2)}.progress-track{height:5px;background:var(--bg-3);border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:var(--accent);transition:width .5s}.form-card{background:var(--bg-2);border:1px solid var(--border);border-radius:12px;padding:24px;max-width:560px;display:flex;flex-direction:column;gap:14px}.form-row{display:flex;flex-direction:column;gap:5px}.form-row-inline{display:flex;align-items:center;gap:8px}.checks{display:flex;flex-direction:column;gap:8px}.editor-layout{display:grid;grid-template-columns:1fr 340px;gap:20px;align-items:start}@media(max-width:980px){.editor-layout{grid-template-columns:1fr}}.editor-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}.editor-header input.job-name{font-weight:600;min-width:220px}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-bottom:14px}.tabs button{border:none;background:none;border-radius:8px 8px 0 0;color:var(--text-dim);padding:9px 16px;border-bottom:2px solid transparent}.tabs button.active{color:var(--text);border-bottom-color:var(--accent)}.seg-list{display:flex;flex-direction:column;gap:6px;max-height:65vh;overflow-y:auto}.seg-row{display:flex;gap:10px;align-items:flex-start;background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);padding:9px 12px;cursor:pointer}.seg-row.active{border-color:var(--accent);background:var(--bg-3)}.seg-row .times{font-family:ui-monospace,monospace;color:var(--text-dim);font-size:12px;white-space:nowrap;padding-top:2px}.seg-row .text{flex:1}.seg-edit{display:flex;flex-direction:column;gap:8px;flex:1}.seg-edit .time-inputs{display:flex;gap:8px;align-items:center}.seg-edit .time-inputs input{width:90px;font-family:ui-monospace,monospace}.preset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;margin-bottom:16px}.preset-tile{background:#000;border:2px solid var(--border);border-radius:10px;aspect-ratio:1;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-direction:column;gap:6px;overflow:hidden;padding:6px}.preset-tile.selected{border-color:var(--accent)}.preset-tile .sample{font-size:13px;line-height:1.1;text-align:center;word-break:break-word}.preset-tile .pname{font-size:10px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px}.style-controls{display:flex;flex-direction:column;gap:12px}.style-controls .row{display:grid;grid-template-columns:130px 1fr auto;gap:10px;align-items:center}.style-controls .row .val{font-family:ui-monospace,monospace;color:var(--text-dim);width:42px;text-align:right}.hook-card,.feature-card{background:var(--bg-2);border:1px solid var(--border);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:12px;margin-top:16px}.feature-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--border)}.feature-row:last-child{border-bottom:none}.feature-row .grow{flex:1}.hook-looks{display:flex;gap:8px;flex-wrap:wrap}.hook-look{flex:1;min-width:90px}.hook-look.selected{border-color:var(--accent);background:var(--bg-3);color:var(--text)}.feature-row.disabled{opacity:.45}.soon-chip{font-size:11px;background:var(--bg-3);border-radius:999px;padding:2px 8px;color:var(--text-dim)}.preview-pane{position:sticky;top:20px;display:flex;flex-direction:column;gap:10px}.preview-frame{position:relative;width:100%;aspect-ratio:9/16;background:#000;border-radius:12px;overflow:hidden;border:1px solid var(--border)}.preview-frame video{position:absolute;inset:0;width:100%;height:100%}.preview-overlay{position:absolute;inset:0;overflow:hidden;pointer-events:none}.libassjs-canvas-parent,.libassjs-canvas{pointer-events:none!important}.preview-controls{display:flex;gap:8px;align-items:center;color:var(--text-dim);font-size:12px}.empty-state{color:var(--text-dim);text-align:center;padding:60px 0}.toast{position:fixed;bottom:20px;right:20px;background:var(--bg-3);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:10px 16px;z-index:50}.status-banner{background:var(--bg-2);border:1px solid var(--border);border-radius:12px;padding:12px 16px;display:flex;flex-direction:column;gap:10px;margin-bottom:14px}.status-banner .brow{display:flex;align-items:center;gap:10px}