@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap";:root{color:#e7f0ff;font-synthesis:none;text-rendering:optimizelegibility;background:#061323;font-family:DM Sans,system-ui,sans-serif}*{box-sizing:border-box}body{background:#061323;min-width:320px;margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.42;cursor:not--allowed}.app{background:radial-gradient(at 55% -20%,#15365a 0,#0000 48%),#061323;min-height:100vh}.topbar{background:#091b30f0;border-bottom:1px solid #18304b;justify-content:space-between;align-items:center;gap:20px;height:72px;padding:0 22px;display:flex}.brand{align-items:center;gap:14px;display:flex}.brand-mark{color:#fff;background:linear-gradient(145deg,#20b9f4,#2873ff);border-radius:12px;place-items:center;width:40px;height:40px;display:grid;box-shadow:0 6px 18px #0879e944}.brand strong{letter-spacing:-.6px;font:800 20px Manrope,sans-serif;display:block}.brand span{color:#adc4df;margin-top:2px;font-size:12px;display:block}.top-actions{gap:10px;display:flex}.btn{white-space:nowrap;border:1px solid #0000;border-radius:9px;justify-content:center;align-items:center;gap:8px;padding:10px 14px;font-size:13px;font-weight:700;transition:all .16s;display:inline-flex}.btn.primary{color:#fff;background:linear-gradient(115deg,#147bff,#3b5cf6);box-shadow:0 4px 14px #115fe526}.btn.primary:hover{filter:brightness(1.1)}.btn.ghost,.btn.secondary{color:#d8e8fc;background:#10243a;border-color:#223c58}.btn.ghost:hover,.btn.secondary:hover{border-color:#3985dd}.btn.small{padding:7px 10px;font-size:12px}.btn.full{width:100%;margin-top:8px}.workspace{grid-template-columns:176px minmax(0,1fr);min-height:calc(100vh - 138px);display:grid}.sidebar{background:#071629;border-right:1px solid #1a3049;flex-direction:column;gap:7px;padding:14px 12px;display:flex}.nav-item{color:#b8cce4;text-align:left;background:0 0;border:0;border-radius:8px;align-items:center;gap:13px;padding:12px 11px;font-size:13px;display:flex}.nav-item:hover{background:#10243a}.nav-item.active{color:#fff;background:linear-gradient(100deg,#1168d9,#1556ba);box-shadow:0 5px 15px #006dff20}.sidebar-bottom{border-top:1px solid #1b3048;margin-top:auto;padding:16px 5px 4px}.privacy{color:#55ddb1;align-items:center;gap:8px;font-size:12px;display:flex}.sidebar-bottom small{color:#8099b6;margin-top:8px;font-size:10px;line-height:1.5;display:block}.main-area{min-width:0;padding:12px}.editor-grid{grid-template-columns:minmax(210px,.78fr) minmax(330px,1.25fr) minmax(250px,1fr);align-items:stretch;gap:10px;display:grid}.panel{background:linear-gradient(155deg,#0b1e33fa,#071627fa);border:1px solid #1d3855;border-radius:11px;min-width:0}.upload-panel,.preview-panel,.inspector{min-height:390px}.upload-panel{padding:13px}.panel-title,.preview-heading,.timeline-top,.section-head{justify-content:space-between;align-items:center;gap:10px;display:flex}.panel h2,.panel h3,.projects-view h1{margin:0;font-family:Manrope,sans-serif}.panel h2{font-size:15px}.panel h3{font-size:13px}.panel-title{margin-bottom:13px}.tiny-pill{letter-spacing:.9px;color:#6ce0bc;border:1px solid #20644f;border-radius:5px;padding:3px 6px;font-size:9px}.upload-zone{color:#8db9e8;background:linear-gradient(145deg,#0a1d32,#0b2037);border:1px dashed #345271;border-radius:9px;flex-direction:column;justify-content:center;align-items:center;gap:8px;width:100%;min-height:178px;display:flex}.upload-zone strong{color:#e4efff;font-size:15px}.upload-zone>span:not(.btn){color:#9cb1ca;font-size:11px}.upload-zone small{color:#8da5bf;text-align:center;font-size:10px}.upload-zone .btn{margin:2px 0}.drop-active{background:#102d4a;border-color:#2e93ff}.file-row{background:#0c2037;border:1px solid #264360;border-radius:8px;align-items:center;gap:9px;min-width:0;margin-top:10px;padding:8px;display:flex}.file-thumb{color:#62baff;background:#173c5e;border-radius:6px;flex-shrink:0;place-items:center;width:48px;height:43px;display:grid}.file-info{flex:1;min-width:0}.file-info strong,.file-info small{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.file-info strong{font-size:11px}.file-info small{color:#9eb4ce;margin-top:5px;font-size:10px}.icon-btn{color:#b9d0ea;background:0 0;border:1px solid #0000;border-radius:7px;flex-shrink:0;place-items:center;width:30px;height:30px;display:inline-grid}.icon-btn:hover{background:#183552;border-color:#2b4a6a}.upload-hint{color:#7e9ab8;align-items:center;gap:6px;margin:12px 2px;font-size:10px;display:flex}.suggest-box{border-top:1px solid #1b344e;margin-top:12px;padding-top:13px}.suggest-box h3{color:#cfe1f7;align-items:center;gap:7px;margin-bottom:10px;display:flex}.suggest-box h3 svg{color:#47a6ff}.suggest-box label,.inspector-content label,.clip-settings>label{color:#b3c8e2;margin:9px 0;font-size:11px;display:block}.suggest-box select,.inspector select,.inspector input:not([type=color]):not([type=checkbox]),.inspector textarea,.clip-settings input:not([type=checkbox]),.clip-settings select,.mini-field input{color:#e2eeff;background:#091b2e;border:1px solid #294663;border-radius:7px;outline:none;width:100%;margin-top:5px;padding:9px;font-size:12px;display:block}.preview-panel{flex-direction:column;padding:12px;display:flex}.preview-heading{margin-bottom:10px}.preview-heading h2{margin-bottom:4px}.preview-heading span{color:#90a9c5;text-overflow:ellipsis;white-space:nowrap;max-width:230px;font-size:10px;display:block;overflow:hidden}.preview-ratio{background:#10243a;border:1px solid #28435f;border-radius:6px;align-items:center;gap:5px;padding:6px 9px;font-size:11px;display:flex}.preview-stage{background:#02070c;border-radius:6px;flex:1;justify-content:center;align-items:center;min-height:250px;max-height:330px;display:flex;position:relative;overflow:hidden}.preview-bg{opacity:.8;position:absolute;inset:0}.preview-bg-image{object-fit:cover;filter:blur(10px)brightness(.55);width:100%;height:100%;position:absolute;inset:0}.preview-video{z-index:1;object-fit:contain;background:#02070c;width:auto;max-width:100%;height:100%;max-height:100%;position:relative}.preview-placeholder{color:#4c7199;flex-direction:column;align-items:center;gap:9px;display:flex;position:relative}.preview-placeholder strong{color:#b9d1eb;font-size:13px}.preview-placeholder span{font-size:11px}.overlay-copy{z-index:2;text-align:center;pointer-events:none;background:#0006;flex-direction:column;gap:6px;width:86%;padding:10px 6px;display:flex;position:absolute;left:7%}.overlay-copy strong{text-shadow:0 2px 5px #000;font:800 clamp(12px,1.5vw,22px) Manrope,sans-serif}.overlay-copy span{color:#fff;font-size:clamp(9px,1vw,14px)}.position-top{top:12%}.position-middle{top:50%;transform:translateY(-50%)}.position-bottom{bottom:12%}.player-controls{align-items:center;gap:10px;padding:10px 2px 4px;display:flex}.play-btn{color:#d5eaff;background:0 0;border:0;place-items:center;width:25px;height:30px;display:grid}.seek{accent-color:#278dff;flex:1;min-width:30px}.time-readout{color:#c8d9ee;white-space:nowrap;font-variant-numeric:tabular-nums;font-size:11px}.preview-footer{color:#8ba6c3;border-top:1px solid #1b334d;justify-content:space-between;gap:8px;margin-top:4px;padding-top:9px;font-size:10px;display:flex}.preview-footer span:first-child{color:#44d9a7;align-items:center;gap:5px;display:flex}.tabs{border-bottom:1px solid #213b57;grid-template-columns:repeat(3,1fr);display:grid}.tabs button{color:#a9c0da;background:0 0;border:0;border-bottom:2px solid #0000;justify-content:center;align-items:center;gap:7px;padding:14px 4px;font-size:12px;display:flex}.tabs button.selected{color:#399cff;border-color:#218aff}.tab-t{font-size:19px;font-weight:700}.inspector-content{padding:15px}.inspector-content h3{margin:2px 0 10px}.background-types{grid-template-columns:repeat(4,1fr);gap:7px;margin:9px 0 18px;display:grid}.bg-choice{color:#adc3dd;background:0 0;border:1px solid #0000;border-radius:7px;flex-direction:column;align-items:center;gap:6px;padding:5px 2px;font-size:9px;display:flex}.bg-choice.chosen{color:#fff;background:#112b47;border-color:#218dff}.bg-swatch{background:#10243a;border:1px solid #304b67;border-radius:7px;width:100%;height:55px}.bg-swatch.gradient{background:linear-gradient(135deg,#b300d8,#244cf2)}.bg-swatch.blur{background:linear-gradient(125deg,#d3e2f2,#536a81,#d7e6f5)}.bg-swatch.image{background:linear-gradient(135deg,#78a8db,#e6f0ff,#3a6d48)}.color-row{flex-wrap:wrap;align-items:center;gap:8px;margin:11px 0 16px;display:flex}.color-dot{border:1px solid #46617d;border-radius:50%;width:25px;height:25px}.color-dot.color-active{outline-offset:2px;outline:2px solid #2f91ff}.custom-color{color:#fff;background:conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:50%;place-items:center;width:26px;height:26px;display:grid;position:relative;overflow:hidden}.custom-color input{opacity:0;cursor:pointer;height:100%;width:100%!important;position:absolute!important}.upload-image{color:#9ec6f0;background:#0a1d31;border:1px dashed #345271;border-radius:8px;justify-content:center;align-items:center;gap:12px;width:100%;min-height:70px;display:flex}.upload-image span{font-size:11px}.upload-image small{color:#8ca6c1;margin-top:4px;display:block}.tip{color:#7e9bb8;align-items:flex-start;gap:6px;margin:15px 0 0;font-size:10px;line-height:1.55;display:flex}.tip svg{flex-shrink:0;margin-top:1px}.inspector-content textarea{resize:vertical}.inspector-content input[type=color]{height:34px;padding:3px!important}.ratio-grid{grid-template-columns:repeat(4,1fr);gap:7px;display:grid}.ratio-grid button{color:#9cb7d4;background:#0a1c30;border:1px solid #294663;border-radius:7px;flex-direction:column;align-items:center;gap:5px;padding:8px;display:flex}.ratio-grid button.ratio-active{color:#fff;border-color:#258cff}.ratio-shape{border:1px solid #66b5ff;border-radius:2px;width:18px;height:26px;display:block}.ratio-16-9{width:28px;height:16px}.ratio-1-1{width:20px;height:20px}.ratio-4-5{width:18px;height:23px}.ratio-grid small{font-size:10px}.check-label{align-items:center;gap:7px;display:flex!important}.check-label input{accent-color:#218aff;width:auto!important}.check-label small{color:#7994b2}.empty-inspector{color:#8ba6c3;padding:30px 15px;font-size:12px}.timeline-panel{margin-top:10px;padding:13px 14px 16px}.timeline-top h2{align-items:center;gap:8px;display:flex}.timeline-top h2 svg{color:#4ba8ff}.timeline-top span{color:#88a5c5;margin:4px 0 0 26px;font-size:10px;display:block}.timeline-actions{gap:7px;display:flex}.ruler{color:#a7bdd6;justify-content:space-between;margin:18px 4px 7px;font-size:10px;display:flex}.track{cursor:crosshair;background:repeating-linear-gradient(90deg,#142c45 0 1px,#0000 1px 8%);border:1px solid #243f5d;border-radius:6px;height:53px;position:relative;overflow:hidden}.track-clip{color:#d8edff;background:linear-gradient(130deg,#174c7e,#246db2);border:1px solid #3ca5ff;border-radius:4px;align-items:flex-start;min-width:8px;padding:3px 5px;display:flex;position:absolute;top:4px;bottom:4px;overflow:hidden}.track-clip span{font-size:9px}.track-1{background:linear-gradient(130deg,#116348,#1c9e7b);border-color:#24d4a3}.track-2{background:linear-gradient(130deg,#5430a4,#8b5cf6);border-color:#9e83ff}.track-3{background:linear-gradient(130deg,#804416,#dc8136);border-color:#ffa044}.track-4{background:linear-gradient(130deg,#135c73,#08a3bd);border-color:#27d4e7}.track-5{background:linear-gradient(130deg,#7d284e,#d64780);border-color:#f66ca2}.track-active{outline-offset:-2px;z-index:2;outline:2px solid #d5efff}.playhead{pointer-events:none;z-index:3;background:#36a1ff;width:2px;position:absolute;top:0;bottom:0}.playhead:before{content:"";background:#278bff;border-radius:50%;width:12px;height:12px;position:absolute;top:0;left:-5px}.clips-section{grid-template-columns:220px minmax(0,1fr) 245px;align-items:stretch;gap:10px;margin-top:10px;display:grid}.clip-list{overflow:hidden}.clip-list-head{border-bottom:1px solid #203a55;justify-content:space-between;align-items:center;padding:10px 12px;display:flex}.clip-list-head h3{font-size:13px}.clip-list-item{cursor:pointer;border-bottom:1px solid #172e47;align-items:center;gap:8px;padding:7px 9px;display:flex}.clip-list-item.current{background:#102943}.clip-list-item>input,.clip-card-top input{accent-color:#278bff}.clip-number{color:#fff;background:#177cf3;border-radius:6px;flex-shrink:0;place-items:center;width:22px;height:22px;font-size:11px;font-weight:700;display:grid}.n-1{background:#08a879}.n-2{background:#873cf5}.n-3{background:#ff811c}.n-4{background:#06afc3}.n-5{background:#f04485}.clip-list-name{color:#d4e5f8;flex:1;min-width:0;font-size:10px}.clip-list-name small{color:#8fa8c4;margin-top:3px;font-size:9px;display:block}.clip-list-item .icon-btn{width:23px;height:23px}.clip-cards{grid-template-columns:repeat(auto-fit,minmax(155px,1fr));align-content:start;gap:10px;min-width:0;display:grid}.clip-card{cursor:pointer;background:linear-gradient(155deg,#0b2037,#08182a);border:1px solid #264360;border-radius:9px;min-width:0;padding:8px}.clip-card.card-active{border-color:#168cff;box-shadow:0 0 0 1px #168cff44}.clip-card-top{align-items:center;gap:7px;margin-bottom:8px;display:flex}.clip-card-top>span:nth-child(2){color:#bed1e8;flex:1;font-size:10px}.clip-card-top .clip-number{width:22px;height:22px}.clip-thumbnail{background-size:cover;border-radius:6px;justify-content:center;align-items:center;height:126px;display:flex;position:relative;overflow:hidden}.thumb-ratio{background:linear-gradient(#0000 40%,#020a16b8);position:absolute;inset:0}.thumb-title{text-align:center;text-shadow:0 2px 4px #000;font-size:12px;font-weight:800;line-height:1.3;position:absolute;bottom:12px;left:6px;right:6px}.thumb-title small{color:#fff;margin-top:4px;font-size:9px;font-weight:500;display:block}.clip-card-meta{color:#a7bfd9;gap:6px;margin:9px 2px;font-size:9px;display:grid}.clip-card-meta span{align-items:center;gap:6px;display:flex}.mini-dot{border:1px solid #6f90ad;border-radius:50%;width:9px;height:9px;display:inline-block}.mini-dot.color{background:#157cf5}.mini-dot.gradient{background:linear-gradient(135deg,#2676f6,#8b2cf5)}.mini-dot.blur{background:#9bb1c7}.mini-dot.image{background:#7ca4db}.mini-field{color:#9db4cf;justify-content:space-between;align-items:center;gap:8px;margin:7px 0;font-size:10px;display:flex}.mini-field input{width:85px;margin:0!important;padding:6px!important;font-size:10px!important}.card-buttons{border-top:1px solid #203a55;justify-content:space-between;align-items:center;gap:2px;margin-top:8px;padding-top:7px;display:flex}.card-buttons .icon-btn{width:25px;height:25px}.card-buttons .btn{padding:6px 8px}.clip-settings{height:max-content;padding:13px}.clip-settings h3{margin-bottom:15px}.field-row{grid-template-columns:1fr 1fr;gap:8px;display:grid}.field-row label{color:#a9c0db;font-size:10px}.clip-settings label{color:#adc2dc;font-size:11px}.clip-settings input{font-variant-numeric:tabular-nums}.clip-settings .check-label{margin:12px 0}.export-progress{border-top:1px solid #203a55;margin-top:18px;padding-top:13px}.progress-label{color:#a6bdd7;justify-content:space-between;font-size:10px;display:flex}.progress-track{background:#142c44;border-radius:5px;height:5px;margin:8px 0 12px;overflow:hidden}.progress-track span{background:#258bff;height:100%;transition:width .2s;display:block}.statusbar{background:#081a2d;border-top:1px solid #1b344d;align-items:center;gap:16px;min-height:66px;padding:10px 22px;display:flex}.status-message{color:#56dcb0;flex:1;align-items:center;gap:9px;min-width:0;font-size:11px;display:flex}.status-message:after{content:""}.status-light{background:#20ca90;border-radius:50%;flex-shrink:0;width:10px;height:10px;box-shadow:0 0 0 4px #20ca901a}.status-stats{color:#9bb4cf;white-space:nowrap;align-items:center;gap:12px;font-size:10px;display:flex}.status-stats i{background:#2c4763;width:1px;height:14px}.statusbar>.btn{min-width:170px}.projects-view{max-width:1100px;margin:0 auto;padding:16px 6px}.projects-view h1{font-size:24px}.projects-view p{color:#8fa9c5;font-size:13px}.section-head{margin-bottom:20px}.empty-state{color:#7596b9;text-align:center;border:1px dashed #2a4867;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;min-height:240px;display:flex}.empty-state h3{color:#d9e8f9;margin:12px 0 0}.empty-state p{font-size:12px}.project-row{background:#0b1f34;border:1px solid #213d59;border-radius:9px;align-items:center;gap:12px;margin-bottom:9px;padding:13px;display:flex}.project-icon{color:#62b6ff;background:#15395c;border-radius:8px;place-items:center;width:40px;height:40px;display:grid}.project-meta{flex:1}.project-meta strong,.project-meta small{display:block}.project-meta strong{font-size:13px}.project-meta small{color:#8fa8c3;margin-top:5px;font-size:10px}.settings-card{background:#0b1f34;border:1px solid #203c59;border-radius:10px;max-width:720px;padding:20px}.settings-card h3{margin:16px 0 7px;font-size:14px}.settings-card h3:first-child{margin-top:0}.settings-card p{line-height:1.6}.muted{color:#8fa9c5}.audio-hidden{display:none}.render-canvas{pointer-events:none;width:1px;height:1px;position:fixed;top:0;left:-99999px}.toast{color:#c7ddf5;z-index:10;pointer-events:none;opacity:.98;background:#102a44;border:1px solid #2b4d70;border-radius:8px;max-width:min(90vw,700px);padding:9px 14px;font-size:11px;position:fixed;bottom:76px;left:50%;transform:translate(-50%);box-shadow:0 8px 30px #0005}.spinner{border:2px solid #4b7095;border-top-color:#4ca8ff;border-radius:50%;width:10px;height:10px;margin-right:7px;animation:.8s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}@media (width>=1500px){.main-area{padding:14px 16px}.editor-grid{grid-template-columns:minmax(250px,.82fr) minmax(420px,1.35fr) minmax(300px,1fr)}.upload-panel,.preview-panel,.inspector{min-height:405px}.preview-stage{max-height:350px}.clips-section{grid-template-columns:240px minmax(0,1fr) 255px}.clip-cards{grid-template-columns:repeat(5,minmax(140px,1fr))}}@media (width<=1150px){.workspace{grid-template-columns:65px minmax(0,1fr)}.sidebar{padding:12px 8px}.nav-item{justify-content:center;padding:12px 4px}.nav-item span,.sidebar-bottom{display:none}.editor-grid{grid-template-columns:minmax(220px,.8fr) minmax(300px,1.2fr)}.inspector{grid-column:1/-1;min-height:0}.inspector-content{padding:12px}.background-types{grid-template-columns:repeat(4,minmax(70px,110px))}.clips-section{grid-template-columns:190px minmax(0,1fr)}.clip-settings{grid-column:1/-1}.clip-settings .field-row{max-width:400px}.clip-cards{grid-template-columns:repeat(auto-fit,minmax(155px,1fr))}}@media (width<=700px){.topbar{gap:8px;height:auto;min-height:66px;padding:10px 12px}.brand{gap:8px}.brand-mark{width:34px;height:34px}.brand strong{font-size:15px}.brand span{font-size:10px}.top-actions{gap:5px}.top-actions .btn{gap:0;padding:8px;font-size:0}.top-actions .btn svg{width:18px;height:18px}.workspace{min-height:calc(100vh - 130px);display:block}.sidebar{z-index:5;border-bottom:1px solid #1b344d;border-right:0;flex-direction:row;gap:4px;padding:6px;display:flex;position:sticky;top:0;overflow-x:auto}.nav-item{flex:none;justify-content:center;padding:9px 11px}.nav-item span{font-size:10px;display:inline}.main-area{padding:8px}.editor-grid{grid-template-columns:1fr}.upload-panel,.preview-panel,.inspector{min-height:0}.upload-zone{min-height:155px}.preview-stage{min-height:290px;max-height:58vh}.inspector{grid-column:auto}.tabs button{padding:11px 4px}.timeline-panel{padding:11px 9px}.timeline-actions .btn{gap:0;padding:7px;font-size:0}.timeline-actions svg{width:16px;height:16px}.track{height:46px}.clips-section{grid-template-columns:1fr}.clip-list{max-height:230px;overflow:auto}.clip-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.clip-thumbnail{height:125px}.clip-settings{grid-column:auto}.statusbar{flex-wrap:wrap;gap:8px;padding:9px 10px}.status-message{flex-basis:100%;font-size:10px}.status-stats{flex:1}.statusbar>.btn{min-width:0;padding:9px;font-size:11px}.toast{bottom:92px}.projects-view{padding:10px 2px}.section-head{align-items:flex-start}.section-head h1{font-size:20px}.project-row{gap:7px;padding:9px}.project-meta small{max-width:180px;line-height:1.4}.field-row{grid-template-columns:1fr 1fr}}@media (width<=390px){.nav-item{gap:5px;padding:9px 8px}.nav-item span{font-size:9px}.clip-cards{grid-template-columns:1fr}.clip-thumbnail{height:180px}.status-stats{font-size:9px}.brand strong{font-size:14px}}
