:root{--night:#07131c;--blueprint:#102532;--mist:#dce8ec;--signal:#ff7668;--wave:#73d3df;--tape:#d2b06b;--line:#dce8ec1f;--line-strong:#dce8ec47;--dim:#dce8ec9e;--dimmer:#dce8ec66;--r-s:10px;--r-m:18px;--r-l:28px;--fast:.14s;--std:.26s;--slow:.7s;--display:"Syne", "Manrope", system-ui, sans-serif;--body:"Manrope", system-ui, sans-serif;--mono:"IBM Plex Mono", ui-monospace, monospace}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{background:var(--night);color:var(--mist);font:15px/1.5 var(--body);-webkit-font-smoothing:antialiased;overflow-x:clip}a{color:var(--wave)}button,input,select,textarea{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--wave);outline-offset:2px}h1,h2,h3{font-family:var(--display);letter-spacing:-.01em;margin:0}h1{font-size:clamp(2rem,5vw,4.5rem);font-weight:800;line-height:1}h2{font-size:1.4rem;font-weight:700}.mono{font-family:var(--mono);letter-spacing:.02em;font-size:12px}.dim{color:var(--dim)}.eyebrow{font-family:var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--tape);font-size:11px}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.topbar{z-index:30;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);background:#07131cdb;align-items:center;gap:14px;padding:12px clamp(14px,3vw,32px);display:flex;position:sticky;top:0}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.topbar{background:var(--night)}}.brand{font-family:var(--display);letter-spacing:.04em;color:var(--mist);flex-shrink:0;font-size:20px;font-weight:800;text-decoration:none}.nav-main{flex-wrap:wrap;flex:1;justify-content:center;gap:4px;display:flex}.nav-main a{color:var(--dim);border-radius:999px;padding:8px 14px;font-size:14px;font-weight:600;text-decoration:none}.nav-main a.active,.nav-main a:hover{color:var(--mist);background:#73d3df1f}.nav-tools{flex-wrap:wrap;flex-shrink:0;justify-content:flex-end;align-items:center;gap:8px;display:flex}.iconbtn{border:1px solid var(--line-strong);width:44px;height:44px;color:var(--mist);cursor:pointer;transition:background var(--fast), border-color var(--fast);background:0 0;border-radius:999px;flex-shrink:0;place-items:center;display:inline-grid}.iconbtn:hover{background:#dce8ec14}.iconbtn.on{color:var(--signal);border-color:#ff766899}.btn{border:1px solid var(--line-strong);min-height:40px;color:var(--mist);cursor:pointer;transition:background var(--fast), transform var(--fast);background:0 0;border-radius:999px;align-items:center;gap:8px;padding:8px 16px;font-weight:600;display:inline-flex}.btn:hover{background:#dce8ec14}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--wave);color:var(--night);border-color:var(--wave)}.btn.primary:hover{background:#8fe0ea}.btn.danger{color:var(--signal);border-color:#ff766899}.btn.small{min-height:32px;padding:4px 12px;font-size:13px}.select,.input,.textarea{border-radius:var(--r-s);border:1px solid var(--line-strong);width:100%;color:var(--mist);background:#07131c99;padding:10px 12px}.textarea{resize:vertical;min-height:96px}.textarea.four-lines{height:calc(6em + 22px);min-height:0;overflow:auto}label.field{color:var(--dim);gap:6px;font-size:13px;display:grid}.check{cursor:pointer;align-items:center;gap:8px;display:inline-flex}.page{max-width:1440px;margin:0 auto;padding:clamp(16px,3vw,40px)}.hero{padding:clamp(24px,6vw,72px) 0 24px}.hero h1{text-align:center;text-transform:uppercase}.hero.left h1{text-align:left;text-transform:none}.panel{background:var(--blueprint);border:1px solid var(--line);border-radius:var(--r-m);padding:18px}.panel.tight{padding:12px}.grid{gap:16px;display:grid}.two{grid-template-columns:minmax(0,1fr) minmax(0,420px)}@media (width<=960px){.two{grid-template-columns:minmax(0,1fr)}}.filters{border:1px solid var(--line);border-radius:var(--r-m);background:#10253299;flex-wrap:wrap;align-items:end;gap:10px;padding:12px;display:flex}.filters label.field{flex:1;min-width:140px}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{font-family:var(--mono);border:1px solid var(--line-strong);color:var(--dim);border-radius:999px;padding:3px 9px;font-size:11px}.chip.tape{color:var(--tape);border-color:#d2b06b80}.chip.wave{color:var(--wave);border-color:#73d3df80}.chip.signal{color:var(--signal);border-color:#ff766880}.chip.ok{color:#9be7c4;border-color:#9be7c480}.empty{text-align:center;color:var(--dim);border:1px dashed var(--line-strong);border-radius:var(--r-m);padding:36px}.skeleton{border-radius:var(--r-s);background:linear-gradient(90deg,#dce8ec0f,#dce8ec1f,#dce8ec0f) 0 0/200% 100%;min-height:56px;animation:1.4s infinite shimmer}@keyframes shimmer{to{background-position:-200% 0}}.toasts{z-index:50;gap:8px;display:grid;position:fixed;bottom:18px;left:50%;transform:translate(-50%)}.toast{background:var(--blueprint);border:1px solid var(--line-strong);border-radius:999px;padding:10px 16px;box-shadow:0 10px 40px #0006}.toast.error{border-color:#ff766899}.error-text{color:var(--signal);font-size:13px}.row-list{gap:8px;display:grid}.row{border:1px solid var(--line);border-radius:var(--r-s);cursor:pointer;transition:border-color var(--fast), background var(--fast);background:#102532b3;grid-template-columns:56px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 12px;display:grid}.row:hover{border-color:var(--line-strong)}.row[aria-selected=true],.row.selected{border-color:var(--wave);background:#73d3df1a}.row .art{object-fit:cover;width:56px;height:56px;font-family:var(--display);background:#dce8ec14;border-radius:8px;place-items:center;font-weight:800;display:grid}.row .title{text-overflow:ellipsis;white-space:nowrap;font-weight:700;overflow:hidden}.row .sub{color:var(--dim);text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.detail{scrollbar-width:none;max-height:calc(100vh - 92px);position:sticky;top:76px;overflow:auto}.detail::-webkit-scrollbar{display:none}@media (width<=960px){.detail{max-height:none;position:static}}.player{gap:10px;display:grid}.wave{cursor:pointer;background:#dce8ec0f;border-radius:8px;height:56px;position:relative;overflow:hidden}.wave .fill{background:linear-gradient(90deg,#73d3df73,#73d3df33);width:0;position:absolute;inset:0 auto 0 0}.wave .hook{background:var(--signal);width:2px;position:absolute;top:0;bottom:0}.wave .hook:after{content:"hook";font-family:var(--mono);color:var(--signal);font-size:10px;position:absolute;top:2px;left:4px}.controls{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.seg{border:1px solid var(--line-strong);border-radius:999px;padding:3px;display:inline-flex}.seg button{color:var(--dim);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:6px 14px;font-weight:600}.seg button[aria-pressed=true]{background:var(--wave);color:var(--night)}.drop{border:1px dashed var(--line-strong);border-radius:var(--r-m);text-align:center;color:var(--dim);cursor:pointer;transition:border-color var(--fast), background var(--fast);padding:28px}.drop.over{border-color:var(--wave);background:#73d3df0f}.progress{background:#dce8ec1a;border-radius:3px;height:6px;overflow:hidden}.progress i{background:var(--wave);height:100%;transition:width var(--fast);display:block}.queue-row{border:1px solid var(--line);border-radius:var(--r-s);background:#102532b3;grid-template-columns:34px 48px minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px 10px;display:grid}.queue-row.selected{border-color:var(--wave)}.handle{cursor:grab;color:var(--dimmer);font-family:var(--mono);text-align:center;-webkit-user-select:none;user-select:none}.handle:active{cursor:grabbing}.slot{font-family:var(--mono);color:var(--tape);font-size:12px}.status{font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;font-size:11px}.status.draft{color:var(--tape)}.status.published{color:#9be7c4}.status.archived{color:var(--dimmer)}.status.failed{color:var(--signal)}.status.processing{color:var(--wave)}.multi{position:relative}.multi .menu{z-index:10;background:var(--blueprint);border:1px solid var(--line-strong);border-radius:var(--r-s);gap:2px;min-width:260px;max-height:280px;padding:6px;display:grid;position:absolute;top:calc(100% + 6px);left:0;overflow:auto;box-shadow:0 16px 40px #00000073}.multi .menu label{cursor:pointer;border-radius:6px;align-items:center;gap:8px;padding:8px 10px;display:flex}.multi .menu label:hover{background:#dce8ec0f}.collection-row{border:1px solid var(--line);border-radius:var(--r-m);background:#102532b3;grid-template-columns:200px minmax(0,1fr) auto;align-items:center;gap:12px;min-height:96px;padding:12px;display:grid}.collection-row.over{border-color:var(--wave);background:#73d3df14}.collection-row .tracks{flex-wrap:wrap;gap:8px;display:flex}.track-card{cursor:grab;background:#dce8ec14;border-radius:8px;width:64px;height:64px;position:relative;overflow:hidden}.track-card img{object-fit:cover;width:100%;height:100%}.track-card .play{width:26px;height:26px;color:var(--wave);cursor:pointer;opacity:0;transition:opacity var(--fast);background:#07131ccc;border:0;border-radius:999px;place-items:center;display:grid;position:absolute;inset:auto 4px 4px auto}.track-card:hover .play,.track-card:focus-within .play{opacity:1}.dialog{z-index:40;background:#07131cb3;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.dialog .panel{width:min(520px,100%)}.checklist li{border-bottom:1px solid var(--line);align-items:baseline;gap:10px;padding:6px 0;display:flex;position:relative}.checklist li .why{z-index:5;background:var(--blueprint);border:1px solid var(--line-strong);border-radius:8px;padding:8px 10px;font-size:13px;display:none;position:absolute;top:100%;left:0;right:0}.checklist li:hover .why,.checklist li:focus-within .why{display:block}.coverflow{perspective:1400px;place-items:center;height:min(70vh,640px);display:grid;position:relative;overflow:hidden}.cf-card{aspect-ratio:9/16;border-radius:var(--r-m);width:min(60vw,340px);transition:transform var(--slow) cubic-bezier(.2,.8,.2,1), opacity var(--slow), filter var(--slow);background:#000;position:absolute;overflow:hidden;box-shadow:0 30px 80px #0009}.cf-card.active{z-index:5}.cf-card.active:before{content:"";border-radius:inherit;z-index:-1;opacity:0;transition:opacity var(--std);background:radial-gradient(closest-side,#73d3df59,#0000);position:absolute;inset:-18px}.cf-card.active:hover:before,.cf-card.active:focus-within:before{opacity:1}.cf-card video{object-fit:contain;background:#000;width:100%;height:100%}.cf-nav{z-index:6;position:absolute;top:50%;transform:translateY(-50%)}.cf-nav.prev{left:8px}.cf-nav.next{right:8px}@media (prefers-reduced-motion:reduce){.cf-card,.skeleton,.btn,.progress i{transition:none!important;animation:none!important}}.caption-row{border:1px solid var(--line);border-radius:var(--r-m);background:#102532b3;grid-template-columns:64px minmax(0,1fr) auto;align-items:start;gap:14px;padding:12px;display:grid}.caption-row.highlight{border-color:var(--wave)}.caption-text{white-space:pre-wrap;word-break:break-word;font-size:15px}.font-box{border:1px solid var(--line);color:var(--dim);border-radius:8px;gap:4px;margin-top:8px;padding:8px 10px;font-size:12px;display:grid}.actions{flex-shrink:0;gap:6px;display:flex}.actions .iconbtn{width:40px;height:40px}.frame-preview{z-index:20;border:1px solid var(--line-strong);background:var(--blueprint);border-radius:8px;max-width:320px;padding:6px;position:absolute;box-shadow:0 16px 40px #00000080}.frame-preview img{border-radius:4px;max-width:100%;display:block}.rail{gap:6px;display:grid}.seg-card{border:1px solid var(--line);white-space:nowrap;background:#102532b3;border-radius:8px;grid-template-columns:24px 28px minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:6px 8px;display:grid}.seg-card[aria-current=step]{border-color:var(--wave)}.stage{grid-template-columns:1fr 1fr;gap:12px;display:grid}.frame916{aspect-ratio:9/16;background:#000;border-radius:12px;position:relative;overflow:hidden}.frame916 video{object-fit:contain;width:100%;height:100%}.layer{transform-origin:50%;pointer-events:auto;position:absolute}.layer.label{border:1px solid var(--wave);white-space:nowrap;background:#07131cd9;border-radius:8px;padding:6px 10px;font-size:14px;font-weight:700}.layer.note{color:var(--night);background:#dce8ecf2;border-radius:8px;max-width:220px;padding:8px 10px;font-size:13px}.layer.selected{outline:2px dashed var(--signal);outline-offset:2px}.reveal{animation:reveal var(--std) ease-out both}@keyframes reveal{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.canvas-wrap{border:1px solid var(--line);border-radius:var(--r-m);touch-action:none;background:#0a1a26;position:relative;overflow:hidden}.canvas{transform-origin:0 0;background:repeating-linear-gradient(0deg,#dce8ec08 0 1px,#0000 1px 50px),repeating-linear-gradient(90deg,#dce8ec08 0 1px,#0000 1px 50px),#0d2130;width:1600px;height:1000px;position:absolute;top:0;left:0}.inner-frame{pointer-events:none;border:1px dashed #d2b06bb3;position:absolute}.vlayer{transform-origin:50%;position:absolute}.vlayer.selected{outline:2px solid var(--wave)}.vlayer .hnd{background:var(--wave);border:1px solid var(--night);border-radius:2px;width:12px;height:12px;position:absolute}.vlayer.text{text-align:center;justify-content:center;align-items:center;padding:6px;font-weight:700;display:flex}.vlayer.number{font-family:var(--display);border-radius:999px;place-items:center;font-weight:800;display:grid}.tray{flex-wrap:wrap;gap:8px;display:flex}.tray img{object-fit:cover;cursor:grab;border:1px solid var(--line);border-radius:8px;width:72px;height:72px}.studio{grid-template-columns:280px minmax(0,1fr) 304px;align-items:start;gap:12px;display:grid}@media (width<=1100px){.studio{grid-template-columns:minmax(0,1fr)}}.budget{margin-top:32px}.kbd{font-family:var(--mono);border:1px solid var(--line-strong);border-radius:4px;padding:2px 6px;font-size:11px}
