:root{--bg:#0d0f14;--panel:#161922;--panel-2:#1e2230;--border:#2a2f3f;--text:#e8eaf0;--muted:#8b91a5;--accent:#7c5cff;--accent-2:#ff4f9a;--danger:#ff5c6c;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font:15px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.app{max-width:1280px;margin:0 auto;padding:24px 16px 64px}header h1{margin:0;font-size:24px}.topbar{flex-wrap:wrap;align-items:center;gap:24px;margin-bottom:20px;display:flex}.topbar nav{background:var(--panel);border:1px solid var(--border);border-radius:10px;gap:4px;padding:4px;display:flex}.topbar nav button{color:var(--muted);background:0 0;border:0;border-radius:7px;padding:7px 14px;font-weight:600}.topbar nav button.active{background:var(--panel-2);color:var(--text)}.me{color:var(--muted);align-items:center;gap:14px;margin-left:auto;font-size:14px;display:flex}.login{place-items:center;min-height:100vh;padding:16px;display:grid}.login form{background:var(--panel);border:1px solid var(--border);border-radius:14px;flex-direction:column;gap:14px;width:min(380px,100%);padding:28px;display:flex}.login h1{margin:0}.panel{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:18px}.panel h2{margin:0 0 12px;font-size:18px}.panel-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.panel-head label.check{flex:none;padding-top:0}.table-wrap{margin-top:12px;overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:14px}th,td{text-align:left;border-bottom:1px solid var(--border);white-space:nowrap;padding:10px 8px}th{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-size:12px;font-weight:600}td a{color:var(--accent);font-weight:600}.muted,tr.muted td{color:var(--muted)}.actions{gap:14px;display:flex}.link.danger{color:var(--danger)}.badge{background:var(--panel-2);color:var(--muted);border-radius:99px;padding:2px 9px;font-size:12px;font-weight:600;display:inline-block}.badge.done{color:#6fe0a6;background:#1f8f5a33}.badge.rendering,.badge.queued{color:#b9a8ff;background:#7c5cff33}.badge.error{color:#ffb3bb;background:#ff5c6c26}.create-user{align-items:flex-end}.create-user label.check{flex:none;padding-bottom:10px}.primary{background:var(--accent);color:#fff;border:0;border-radius:8px;padding:10px 18px;font-weight:600}.primary:disabled{opacity:.45;cursor:not-allowed}.notice{color:#a6f0c9;background:#1f8f5a26;border:1px solid #1f8f5a66;border-radius:8px;margin-top:12px;padding:10px 12px;font-size:13px}main{grid-template-columns:minmax(0,1fr) minmax(320px,460px);align-items:start;gap:24px;display:grid}@media (width<=900px){main{grid-template-columns:1fr}.preview{position:static!important}}.step{background:var(--panel);border:1px solid var(--border);border-radius:14px;margin-bottom:16px;padding:18px}.step h2{align-items:center;gap:10px;margin:0 0 14px;font-size:17px;display:flex}.step h2 span{background:linear-gradient(135deg, var(--accent), var(--accent-2));border-radius:50%;place-items:center;width:26px;height:26px;font-size:13px;display:inline-grid}label{color:var(--muted);flex-direction:column;flex:1;gap:6px;min-width:0;font-size:13px;display:flex}label.check{color:var(--text);flex-direction:row;align-items:center;padding-top:18px;font-size:14px}input:not([type=checkbox]):not([type=color]):not([type=range]),select{background:var(--panel-2);border:1px solid var(--border);color:var(--text);font:inherit;border-radius:8px;width:100%;padding:9px 11px}input:focus,select:focus{outline:2px solid var(--accent);outline-offset:-1px}input[type=range]{accent-color:var(--accent)}.row{flex-wrap:wrap;gap:14px;margin-bottom:12px;display:flex}.hint{color:var(--muted);margin:6px 0 0;font-size:13px}.hint.bad{color:var(--danger)}.center{text-align:center}button{font:inherit;cursor:pointer}.link{color:var(--accent);background:0 0;border:0;padding:0;text-decoration:underline}.drop{text-align:center;border:2px dashed var(--border);background:var(--panel-2);min-height:110px;color:var(--text);cursor:pointer;border-radius:12px;justify-content:center;align-items:center;padding:16px;font-size:14px;transition:border-color .15s,background .15s;display:flex}.drop:hover,.drop.over{border-color:var(--accent);background:#232842}.templates{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}@media (width<=560px){.templates{grid-template-columns:repeat(2,minmax(0,1fr))}}.tpl{text-align:left;border:2px solid var(--border);background:var(--panel-2);color:var(--text);border-radius:12px;flex-direction:column;gap:6px;padding:8px;display:flex}.tpl.active{border-color:var(--accent);box-shadow:0 0 0 3px #7c5cff33}.tpl small{color:var(--muted);line-height:1.35}.brand{gap:14px;margin-bottom:8px;display:flex}.logo-drop{flex:0 0 110px;width:110px;height:110px;min-height:110px;padding:6px;overflow:hidden}.logo-drop img{object-fit:contain;border-radius:8px;width:100%;height:100%}.brand-fields{flex-direction:column;flex:1;gap:10px;min-width:0;display:flex}.colors{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.colors input[type=color]{border:1px solid var(--border);background:var(--panel-2);border-radius:8px;width:44px;height:36px;padding:2px}.preset{border:2px solid var(--border);border-radius:50%;width:36px;height:36px}.preview{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:16px;position:sticky;top:16px}.player-wrap{background:#000;border-radius:10px;width:100%;max-height:70vh;margin:0 auto;overflow:hidden}.render{background:linear-gradient(135deg, var(--accent), var(--accent-2));color:#fff;border:0;border-radius:12px;width:100%;margin-top:14px;padding:14px;font-size:16px;font-weight:700}.render:disabled{opacity:.45;cursor:not-allowed}.error{color:#ffb3bb;white-space:pre-wrap;word-break:break-word;background:#ff5c6c1f;border:1px solid #ff5c6c66;border-radius:8px;margin-top:12px;padding:10px 12px;font-size:13px}.bar{background:var(--panel-2);border-radius:99px;height:8px;overflow:hidden}.bar div{background:linear-gradient(90deg, var(--accent), var(--accent-2));height:100%;transition:width .3s}.source{background:#000;border-radius:10px;width:100%;max-height:320px;display:block}.timeline{background:var(--panel-2);border:1px solid var(--border);cursor:pointer;border-radius:6px;height:26px;margin-top:8px;position:relative;overflow:hidden}.tl-seg{border-left:2px solid var(--accent);border-right:2px solid var(--accent);pointer-events:none;background:#7c5cff66;place-items:center;font-size:11px;font-weight:700;display:grid;position:absolute;top:0;bottom:0;overflow:hidden}.tl-head{background:var(--accent-2);pointer-events:none;width:2px;margin-left:-1px;position:absolute;top:0;bottom:0}.hint code{background:var(--panel-2);border-radius:4px;padding:0 4px}.segments{flex-direction:column;gap:8px;margin-top:12px;display:flex}.segment{background:var(--panel-2);border-radius:10px;flex-wrap:wrap;align-items:flex-end;gap:10px;padding:10px;display:flex}.segment label{min-width:130px}.seg-n{width:24px;height:38px;color:var(--accent);place-items:center;font-weight:700;display:inline-grid}.time-field{gap:4px;display:flex}.time-field input.bad{outline:2px solid var(--danger);outline-offset:-1px}.time-field button,.seg-actions button{border:1px solid var(--border);background:var(--panel);width:34px;height:38px;color:var(--text);border-radius:8px;flex-shrink:0}.time-field button:hover,.seg-actions button:hover:not(:disabled){border-color:var(--accent)}.seg-actions button:disabled,.seg-foot .link:disabled{opacity:.35;cursor:not-allowed}.seg-len{min-width:42px;color:var(--muted);font-variant-numeric:tabular-nums;font-size:13px;line-height:38px}.seg-actions{gap:4px;margin-left:auto;display:flex}.seg-foot{flex-wrap:wrap;align-items:baseline;gap:14px;margin-top:10px;display:flex}.seg-foot .hint{margin:0}.pill{background:var(--accent);color:#fff;border-radius:99px;place-items:center;min-width:20px;height:20px;margin-left:6px;padding:0 6px;font-size:12px;display:inline-grid}.step-toggle{flex:none;margin-left:auto;padding-top:0;font-weight:500}.step-note{margin:-6px 0 12px}.queue{border-top:1px solid var(--border);margin-top:18px;padding-top:14px}.queue-list{max-height:45vh;overflow-y:auto}.queue h3{margin:0 0 10px;font-size:15px}.queue-item{background:var(--panel-2);border-radius:10px;flex-direction:column;gap:6px;margin-bottom:8px;padding:10px 12px;font-size:13px;display:flex}.queue-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.queue-error{color:#ffb3bb;word-break:break-word}.queue-links{gap:16px;display:flex}.queue-links a{color:var(--accent);font-weight:600}.toasts{z-index:10;flex-direction:column;gap:8px;width:min(380px,100vw - 32px);display:flex;position:fixed;bottom:16px;right:16px}.toast{background:var(--panel);border:1px solid var(--border);border-radius:12px;align-items:center;gap:12px;padding:12px 14px;font-size:14px;display:flex;box-shadow:0 8px 24px #0008}.toast.ok{border-color:#1f8f5a99}.toast.bad{border-color:#ff5c6c99}.toast>div{flex-direction:column;flex:1;min-width:0;display:flex}.toast small{color:var(--muted);word-break:break-word}.toast a{color:#6fe0a6;white-space:nowrap;font-weight:700}.toast .link{color:var(--muted);text-decoration:none}