:root{--bg:#131316;--panel:#1b1b1d;--panel2:#202024;--panel3:#28282c;--line:#303035;--muted:#9797a0;--text:#ececed;--cyan:#e28434;--cyan2:#c2410c;--purple:#ef7939;--danger:#ff596d;--track-h:54px}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#101012;color:var(--text);font-family:Inter,"Segoe UI",Arial,sans-serif;font-size:14px}button,input,select{font:inherit}.svg-sprite{position:absolute;width:0;height:0;overflow:hidden}svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.app-shell{height:100vh;min-width:1024px;display:grid;grid-template-rows:46px minmax(320px,56vh) minmax(280px,1fr);background:var(--bg)}button{color:inherit;background:none;border:0;cursor:pointer}.titlebar{display:flex;align-items:center;border-bottom:1px solid #29292d;background:#1a1a1c;padding:0 10px;gap:18px;user-select:none}.brand{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:650;letter-spacing:-.4px}.brand-mark{width:24px;height:24px;position:relative;display:block;transform:rotate(-45deg)}.brand-mark i{position:absolute;width:10px;height:20px;border-radius:1px;background:linear-gradient(180deg,#ed6e29,#984518)}.brand-mark i:first-child{left:1px;top:1px}.brand-mark i:last-child{right:1px;bottom:1px;background:linear-gradient(180deg,#f18d57,#ee6d28)}.menu{display:flex;gap:2px}.menu button{color:#bbbbc1;padding:8px 7px;border-radius:4px;font-size:13px}.menu button:hover{background:#2c2c31;color:#ffffff}.project-name{position:absolute;left:50%;transform:translateX(-50%);font-size:13px;color:#ccccd0}.project-name span{color:#7b7b87;margin-left:5px}.header-actions{display:flex;align-items:center;gap:8px;margin-left:auto}.icon-button{width:30px;height:30px;display:grid;place-items:center;border-radius:5px;color:#b3b3ba;position:relative}.icon-button:hover{background:#2b2b30}.has-dot:after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:#ff5870;right:5px;top:5px}.login-button{height:30px;padding:0 14px;border:1px solid #4c4c55;border-radius:5px;background:#252529;font-size:13px}.export-button{height:32px;padding:0 15px;border-radius:5px;background:linear-gradient(135deg,#e16e30,#ba5a27);color:#1d0f07;font-weight:650;display:flex;align-items:center;gap:7px}.export-button:hover{filter:brightness(1.08)}.top-workspace{min-height:0;display:grid;grid-template-columns:88px minmax(340px,30vw) minmax(420px,1fr) minmax(250px,20vw);border-bottom:1px solid var(--line)}.rail,.media-panel,.preview-panel,.inspector{min-width:0;background:var(--panel);border-right:1px solid var(--line)}.rail{padding:10px 5px;overflow-y:auto}.rail-item{width:100%;height:48px;border-radius:5px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:#a0a0a9;font-size:11px}.rail-item svg{width:19px;height:19px}.rail-item:hover{background:#28282c;color:#f0f0f2}.rail-item.active{color:var(--cyan);background:#28282d}.media-panel{display:flex;flex-direction:column}.panel-heading{height:45px;display:flex;align-items:center;padding:0 13px;border-bottom:1px solid var(--line)}.panel-heading h2{font-size:14px;font-weight:600;margin:0}.dots{margin-left:auto;color:#8e8e98}.media-layout{display:grid;grid-template-columns:122px 1fr;min-height:0;height:100%}.media-tree{padding:8px 5px;border-right:1px solid var(--line);overflow-y:auto}.media-tree button{width:100%;height:30px;display:flex;align-items:center;gap:5px;color:#b3b3ba;text-align:left;padding:0 6px;border-radius:4px;font-size:12px;white-space:nowrap}.media-tree button svg{width:14px;height:14px;color:#898994}.media-tree button span:last-child{margin-left:auto;color:#797986}.media-tree button:hover,.media-tree button.active{background:#2e2e32;color:#ffffff}.tree-child{padding-left:29px!important}.chevron{width:10px}.tree-divider{height:1px;background:#2e2e33;margin:7px}.library{display:flex;flex-direction:column;min-width:0}.library-tools{height:43px;display:flex;align-items:center;gap:6px;padding:0 9px}.library-tools button{height:27px;border-radius:4px;padding:0 9px;background:#2d2d31;color:#c7c7cd;font-size:12px}.library-tools .import-small{background:#3e3e45;color:#f2f2f4;display:flex;align-items:center;gap:4px}.import-small svg{width:12px}.search{margin-left:auto;width:27px;height:27px;border-radius:4px;background:#2d2d31;display:flex;align-items:center;padding:0 7px;transition:.2s}.search:focus-within{width:100px}.search svg{width:13px;flex:0 0 auto;color:#a9a9b2}.search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#e8e8ea;font-size:12px;padding-left:5px}.search:not(:focus-within) input{opacity:0}.asset-grid{display:grid;grid-template-columns:repeat(2,minmax(90px,1fr));gap:8px;padding:2px 9px 12px;overflow:auto}.import-card,.asset-card{min-width:0;aspect-ratio:1.35;border-radius:3px;border:1px dashed #515159;background:#232327;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#b2b2b9}.import-card:hover{border-color:var(--cyan);color:var(--cyan)}.big-plus{font-size:28px;font-weight:200;line-height:1}.import-card strong{font-size:12px;margin-top:5px}.import-card small{font-size:10px;color:#787884;margin-top:2px}.asset-card{border:0;aspect-ratio:auto;align-items:stretch;justify-content:flex-start;text-align:left;background:transparent}.asset-thumb{aspect-ratio:16/9;position:relative;overflow:hidden;border-radius:3px;background:radial-gradient(circle at 73% 30%,#fa78c4 0 6%,transparent 30%),linear-gradient(135deg,#2b2b30,#7f7f8c 42%,#ec589c 70%,#f5a167);box-shadow:inset 0 -12px 30px #1e1e2155}.sky-glow{position:absolute;width:70%;height:45%;left:-15%;bottom:-12%;transform:rotate(-9deg);background:#af4d19;filter:blur(9px);opacity:.7}.duration{position:absolute;right:3px;bottom:3px;font-size:9px;padding:2px 3px;background:#070708cc;color:white}.asset-name{font-size:11px;color:#dfdfe2;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.asset-card small{font-size:9px;color:#72727f;margin-top:1px}.preview-panel{display:flex;flex-direction:column;background:#141417}.preview-tabs{height:42px;display:flex;align-items:center;gap:16px;padding:0 12px;border-bottom:1px solid var(--line)}.preview-tabs button{height:100%;color:#93939d;font-size:12px;position:relative}.preview-tabs button.active{color:#ffffff}.preview-tabs button.active:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--cyan)}.preview-tabs span{flex:1}.viewer-wrap{flex:1;min-height:0;display:grid;place-items:center;padding:12px 22px;background:#131314}.viewer{width:min(100%,640px);aspect-ratio:16/9;max-height:100%;background:#080808;box-shadow:0 0 0 1px #2c2c31,0 10px 35px #00000088;overflow:hidden}.video-art{width:100%;height:100%;position:relative;overflow:hidden;display:grid;place-content:center;text-align:center;background:radial-gradient(circle at 72% 30%,#d9601f 0 5%,transparent 28%),radial-gradient(circle at 20% 80%,#a04413 0 3%,transparent 32%),linear-gradient(135deg,#202023,#c14e10 45%,#ee4c9b 73%,#ff9e62);transition:transform .2s,opacity .2s}.video-art:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 20%,#ffffff11 40%,transparent 58%);transform:translateX(-100%);animation:sheen 5s infinite}.orb{position:absolute;border-radius:50%;filter:blur(4px);mix-blend-mode:screen}.orb.one{width:26%;aspect-ratio:1;left:10%;top:18%;background:#aa4a17;opacity:.45}.orb.two{width:35%;aspect-ratio:1;right:4%;bottom:-15%;background:#ffb358;opacity:.35}.video-title{font-size:clamp(22px,3.4vw,50px);font-weight:800;line-height:.8;letter-spacing:-2px;text-shadow:0 4px 18px #21212488;z-index:1}.video-title em{font-size:.42em;font-weight:400;letter-spacing:4px;font-style:normal;color:#fac0a0}.video-subtitle{margin-top:18px;font-size:clamp(7px,.8vw,12px);letter-spacing:5px;z-index:1}.transport{height:44px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 12px;border-top:1px solid #26262a}.timecode{font-size:11px;color:#797986}.timecode strong{color:#d7d7da;font-weight:500}.play-controls,.viewer-actions{display:flex;align-items:center}.play-controls button,.viewer-actions button{width:30px;height:30px;display:grid;place-items:center;color:#bcbcc3}.play-controls button:hover,.viewer-actions button:hover{color:#ffffff}.main-play svg{width:21px;height:21px}.viewer-actions{justify-content:flex-end}.viewer-actions .quality{width:auto;padding:0 7px;font-size:10px;color:#91919c}.inspector{border-right:0;display:flex;flex-direction:column}.inspector-tabs{height:42px;display:flex;align-items:end;gap:17px;padding:0 12px;border-bottom:1px solid var(--line)}.inspector-tabs button{height:100%;font-size:12px;color:#95959f;position:relative}.inspector-tabs button.active{color:#ffffff}.inspector-tabs button.active:after{content:"";position:absolute;height:2px;left:0;right:0;bottom:0;background:var(--cyan)}.sub-tabs{height:38px;display:flex;align-items:center;gap:8px;padding:0 10px;border-bottom:1px solid #2b2b30}.sub-tabs button{font-size:11px;color:#898995;padding:5px 7px;border-radius:4px}.sub-tabs button.active{color:#ffffff;background:#2f2f33}.inspector-body{overflow:auto;flex:1}.inspector details{border-bottom:1px solid #2d2d31;padding:0 12px}.inspector summary{height:40px;display:flex;align-items:center;font-weight:550;font-size:12px;cursor:pointer;list-style:none}.inspector summary:before{content:"›";margin-right:7px;color:#90909a}.inspector details[open] summary:before{transform:rotate(90deg)}.reset{margin-left:auto;color:#898994;font-size:16px}.inspector label{min-height:35px;display:grid;grid-template-columns:65px 1fr auto;align-items:center;gap:5px;font-size:11px;color:#92929d}.inspector input[type=number],.inspector select{width:100%;height:26px;border:1px solid #38383e;border-radius:3px;background:#27272b;color:#ccccd1;outline:0;padding:0 6px;font-size:11px}.inspector label span{position:relative;display:flex;align-items:center}.inspector label span i{position:absolute;right:5px;font-style:normal;color:#72727e}.inspector label span input{padding-right:18px}.inspector input[type=range],.tool-right input{appearance:none;height:3px;background:linear-gradient(90deg,var(--cyan) 50%,#3d3d44 50%);border-radius:4px}.inspector input[type=range]::-webkit-slider-thumb,.tool-right input::-webkit-slider-thumb{appearance:none;width:10px;height:10px;border-radius:50%;background:#dadade}.inspector output{min-width:45px;text-align:right;font-size:10px;color:#ababb3}.flip-row{height:35px;display:flex;align-items:center;gap:5px;font-size:11px;color:#92929d}.flip-row span{width:65px}.flip-row button{width:35px;height:25px;background:#29292e;border:1px solid #38383e;border-radius:3px}.inspector-footer{height:48px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:flex-end;gap:7px;padding:0 11px}.inspector-footer button{padding:7px 18px;border-radius:4px;background:#2d2d31;font-size:11px}.inspector-footer .apply{background:var(--cyan);color:#221108}.timeline-panel{min-height:0;background:#17171a;display:flex;flex-direction:column}.timeline-toolbar{height:42px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 10px}.tool-left,.tool-right{display:flex;align-items:center;gap:4px}.tool-left button,.tool-right button{width:29px;height:28px;display:grid;place-items:center;border-radius:4px;color:#a9a9b2}.tool-left button:hover,.tool-right button:hover{background:#2c2c31;color:#ffffff}.tool-left i{height:20px;width:1px;background:#37373d;margin:0 4px}.tool-left .text-tool{font:600 17px Georgia}.tool-left .more-tools{letter-spacing:2px}.tool-right .active{color:var(--cyan);background:#2a2a2e}.tool-right input{width:94px}.timeline-scroll{display:grid;grid-template-columns:115px 1fr;min-height:0;flex:1;overflow:auto}.track-heads{position:sticky;left:0;z-index:5;background:#1a1a1c;border-right:1px solid var(--line)}.ruler-head{height:29px;border-bottom:1px solid #2d2d31;display:flex;align-items:center;padding-left:8px}.ruler-head button{color:#aeaeb6}.track-head{height:var(--track-h);display:flex;align-items:center;border-bottom:1px solid #2a2a2f;padding:0 8px;gap:8px;color:#898994}.track-head span{width:29px;font-size:10px}.track-head button{width:19px;color:#767682}.track-head svg{width:13px}.tracks{position:relative;min-width:900px}.ruler{height:29px;position:relative;background:repeating-linear-gradient(90deg,transparent 0 calc(6.25% - 1px),#44444b calc(6.25% - 1px) 6.25%);border-bottom:1px solid #2e2e32;color:#757582}.ruler span{position:absolute;top:7px;font-size:9px;transform:translateX(-3px)}.track{height:var(--track-h);border-bottom:1px solid #29292e;background:linear-gradient(90deg,transparent 49.9%,#212124 50%)}.clip,.audio-clip{position:absolute;left:18px;width:46%;height:calc(var(--track-h) - 8px);margin-top:4px;border-radius:3px;overflow:hidden;text-align:left;border:1px solid var(--cyan);background:#34343a}.clip-mini{position:absolute;inset:0;background:linear-gradient(100deg,#3e3e44,#70707b 43%,#d44d97 72%,#d88963);opacity:.8}.clip-mini:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 43px,#10101255 44px 45px)}.clip-label,.audio-label{position:absolute;left:7px;top:5px;font-size:10px;color:#ffffff;text-shadow:0 1px 3px #000000;z-index:1}.audio-clip{top:var(--track-h);background:#6a371b}.waveform{position:absolute;inset:17px 4px 3px;background:repeating-linear-gradient(90deg,#d9743e 0 1px,transparent 1px 3px);clip-path:polygon(0 45%,2% 10%,4% 80%,6% 30%,8% 70%,10% 45%,12% 15%,14% 80%,16% 30%,18% 55%,20% 15%,22% 85%,24% 20%,26% 70%,28% 35%,30% 65%,32% 25%,34% 80%,36% 10%,38% 60%,40% 35%,42% 80%,44% 25%,46% 70%,48% 15%,50% 85%,52% 20%,54% 70%,56% 35%,58% 75%,60% 15%,62% 65%,64% 25%,66% 85%,68% 35%,70% 75%,72% 10%,74% 60%,76% 25%,78% 85%,80% 35%,82% 70%,84% 20%,86% 80%,88% 15%,90% 65%,92% 30%,94% 75%,96% 20%,98% 60%,100% 45%,100% 55%,0 55%)}.empty-track{position:relative}.empty-hint{font-size:10px;color:#51515a;position:absolute;left:18px;top:19px}.playhead{position:absolute;z-index:4;top:23px;bottom:0;left:21.5%;width:1px;background:#ef5473;pointer-events:none}.playhead span{position:absolute;width:9px;height:8px;top:0;left:-4px;background:#ef5473;clip-path:polygon(0 0,100% 0,100% 65%,50% 100%,0 65%)}.modal-backdrop{position:fixed;inset:0;background:#070708ab;z-index:20;display:grid;place-items:center}.modal-backdrop[hidden]{display:none}.modal{width:min(720px,90vw);background:#202023;border:1px solid #38383e;border-radius:8px;box-shadow:0 24px 80px #000000cc}.modal header{height:50px;display:flex;align-items:center;padding:0 18px;border-bottom:1px solid var(--line)}.modal h2{font-size:16px;margin:0}.modal header button{margin-left:auto;font-size:26px;color:#91919c}.export-tabs{height:43px;display:flex;gap:22px;padding:0 20px;border-bottom:1px solid var(--line)}.export-tabs button{font-size:12px;color:#92929d;position:relative}.export-tabs button.active{color:#ffffff}.export-tabs button.active:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--cyan)}.export-content{display:grid;grid-template-columns:190px 1fr;gap:20px;padding:22px}.export-poster{aspect-ratio:16/12;background:linear-gradient(135deg,#333339,#bd4c0f,#ee6494);display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:4px}.mini-art{font-size:22px;font-weight:800}.mini-art em{display:block;font-size:9px;font-style:normal;letter-spacing:2px;color:#f8c5aa}.export-poster button{margin-top:auto;margin-bottom:8px;background:#17171aa8;border-radius:3px;padding:5px 8px;font-size:10px}.export-form{display:flex;flex-direction:column;gap:11px}.export-form label{display:flex;flex-direction:column;gap:5px;color:#9d9da6;font-size:11px}.export-form input,.export-form select,.input-like{height:31px;background:#2b2b30;border:1px solid #3e3e45;border-radius:4px;color:#e4e4e6;padding:0 9px;outline:0}.input-like{display:flex;align-items:center}.input-like span{margin-left:auto}.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}.export-summary{display:flex;justify-content:space-between;color:#767683;font-size:10px;margin-top:4px}.modal footer{height:56px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 18px}.modal footer button{padding:8px 18px;border-radius:4px;background:#2e2e33}.modal footer div{display:flex;gap:8px}.modal footer .export-now{background:var(--cyan);color:#211108;font-weight:600}.toast{position:fixed;z-index:30;bottom:24px;left:50%;transform:translate(-50%,18px);background:#2e2e32;border:1px solid #45454d;padding:10px 16px;border-radius:5px;box-shadow:0 8px 30px #00000099;opacity:0;pointer-events:none;transition:.25s;color:#e9e9eb;font-size:12px}.toast.show{opacity:1;transform:translate(-50%,0)}@keyframes sheen{0%,30%{transform:translateX(-110%)}55%,100%{transform:translateX(110%)}}@media(max-width:1250px){.top-workspace{grid-template-columns:74px 310px 1fr 245px}.media-layout{grid-template-columns:105px 1fr}.asset-grid{grid-template-columns:1fr}.rail-item{font-size:10px}.menu{display:none}}@media(max-height:720px){.app-shell{grid-template-rows:42px minmax(290px,55vh) minmax(235px,1fr)}.rail-item{height:42px}.viewer-wrap{padding:8px 16px}.inspector details:nth-of-type(n+3){display:none}}
:is(.playhead){pointer-events:auto;cursor:ew-resize;touch-action:none}
.video-stage{width:100%;height:100%;display:grid;place-items:center;background:#070707;overflow:hidden}.video-stage>video,.video-stage>img{width:100%;height:100%;object-fit:contain;transform-origin:center;transition:transform .15s,opacity .15s}.library.drag-over{outline:2px solid var(--cyan);outline-offset:-4px;background:#1e1e22}.asset-card .asset-thumb img,.asset-card .asset-thumb video{width:100%;height:100%;object-fit:cover}.clip,.audio-clip{touch-action:none}.clip.selected,.audio-clip.selected{box-shadow:0 0 0 1px #ffffff88 inset}.clip-part{position:absolute;height:calc(var(--track-h) - 8px);margin-top:4px;border:1px solid #ab5223;border-radius:3px;background:linear-gradient(100deg,#404046,#797986 48%,#dc559a);overflow:hidden;text-align:left}.clip-part.selected{border-color:#ffffff;box-shadow:0 0 0 1px var(--cyan)}.clip-part .clip-label{max-width:calc(100% - 10px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.clip-part:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 44px,#10101255 45px 46px);pointer-events:none}.audio-part{position:absolute;height:calc(var(--track-h) - 8px);margin-top:4px;border:1px solid #ab5223;border-radius:3px;background:#6a371b;overflow:hidden;text-align:left}.audio-part .waveform{inset:17px 4px 3px}.empty-state{grid-column:1/-1;border:1px dashed #515159;padding:18px;text-align:center;color:#868692;border-radius:4px}.export-progress{height:24px;background:#29292d;border-radius:4px;position:relative;overflow:hidden}.export-progress span{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,#9b481b,#e37032);transition:width .1s}.export-progress strong{position:relative;display:grid;place-items:center;height:100%;font-size:10px;color:#ececed;text-shadow:0 1px 2px #000000}.export-now:disabled{opacity:.55;cursor:wait}.viewer.exporting:after{content:"Rendering…";position:absolute;right:8px;top:8px;padding:5px 8px;border-radius:3px;background:#0a0a0ccc;color:#ffffff;font-size:10px}.viewer{position:relative}

.look-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px}
.look-grid button{padding:8px 4px;border-radius:7px;border:1px solid var(--line);background:var(--panel2);color:var(--text);font-size:11.5px;cursor:pointer}
.look-grid button.active{border-color:var(--cyan);color:var(--cyan)}
