@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#090b12;--panel:#111521;--line:rgba(255,255,255,.09);--text:#f4f6fb;--muted:#9299aa;--accent:#b6ff52;--purple:#8a6cff;--danger:#ff7183;--unit:90px}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 15% 0%,#5540a51c,transparent 35%),var(--bg);color:var(--text);font-family:'IBM Plex Sans Arabic',sans-serif;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}.editor-topbar{height:66px;padding:0 4vw;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;background:#090b12e8;position:sticky;top:0;z-index:20;backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);direction:ltr}.brand-mark{width:35px;height:35px;display:grid;place-items:center;border-radius:10px;background:var(--accent);color:#10140b;font:700 22px 'Space Grotesk'}.brand strong,.brand small{display:block;font-family:'Space Grotesk';letter-spacing:.08em}.brand strong{font-size:12px}.brand small{font-size:9px;color:var(--muted)}.editor-title{display:flex;align-items:center;gap:9px;font:700 13px 'Space Grotesk';letter-spacing:.12em}.editor-title small{font-size:9px;color:var(--muted);font-weight:500}.live-dot{width:7px;height:7px;background:var(--accent);border-radius:50%;box-shadow:0 0 12px var(--accent)}.top-actions{display:flex;align-items:center;gap:8px}.tool-button,.back-link,.mini-tool{border:1px solid var(--line);background:#ffffff08;color:#dce1eb;border-radius:8px;padding:8px 11px;font-size:11px;text-decoration:none}.tool-button:disabled,.mini-tool:disabled{opacity:.35;cursor:not-allowed}.tool-button:not(:disabled):hover,.mini-tool:not(:disabled):hover{border-color:#b6ff5277;color:var(--accent)}.editor-shell{width:min(1500px,96vw);margin:22px auto 40px}.project-bar{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:0 4px 17px}.eyebrow{font:600 9px 'Space Grotesk';letter-spacing:.16em;color:var(--accent)}h1{font-size:25px;margin:5px 0 0}h1 span{font-size:14px;color:var(--muted);font-weight:400;margin-right:8px}.project-meta{display:flex;gap:10px}.project-meta label{display:flex;flex-direction:column;gap:5px;color:var(--muted);font-size:10px}.project-meta input,.project-meta select{min-width:150px;background:#111521;border:1px solid var(--line);border-radius:8px;padding:9px;color:var(--text);font-size:11px}.panel{background:linear-gradient(145deg,#151a28f2,#101420f2);border:1px solid var(--line);border-radius:13px;box-shadow:0 12px 35px #0002}.workspace{display:grid;grid-template-columns:minmax(230px, .75fr) minmax(0,2fr);gap:13px}.media-panel,.preview-panel,.timeline-panel{padding:15px;min-width:0}.panel-heading,.timeline-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.panel-heading h2,.timeline-heading h2{font-size:14px;margin:4px 0 0}.count,.preview-state{font:10px 'Space Grotesk';color:var(--accent);background:#b6ff5212;padding:5px 8px;border-radius:20px}.import-zone{appearance:none;-webkit-appearance:none;width:100%;padding:12px;color:var(--text);font-family:inherit;margin-top:15px;border:1px dashed #b6ff5266;border-radius:10px;min-height:115px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:#b6ff5208;cursor:pointer;text-align:center}.import-zone:hover{background:#b6ff5212}.import-icon{font:28px 'Space Grotesk';color:var(--accent)}.import-zone strong{font-size:12px}.import-zone small,.media-foot{font-size:9px;color:var(--muted)}.media-list{display:flex;flex-direction:column;gap:7px;margin-top:12px;max-height:280px;overflow:auto}.media-item{display:flex;align-items:center;gap:9px;padding:8px;background:#ffffff07;border:1px solid #ffffff0b;border-radius:8px;min-width:0}.media-thumb{width:52px;height:38px;object-fit:cover;border-radius:5px;background:#05070b}.media-info{min-width:0;flex:1}.media-info strong{display:block;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr;text-align:right}.media-info small{font:9px 'Space Grotesk';color:var(--muted)}.add-media{border:1px solid #b6ff5244;background:#b6ff5210;color:var(--accent);border-radius:7px;padding:6px 8px;font-size:10px}.empty{padding:18px 5px;text-align:center;color:var(--muted);font-size:10px}.media-foot{line-height:1.7;margin-top:12px}.preview-stage{height:clamp(230px,40vw,420px);margin:13px auto 10px;background:radial-gradient(ellipse,#20283a,#05070c 70%);border:1px solid var(--line);border-radius:9px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;aspect-ratio:16/9;max-width:100%;transition:aspect-ratio .2s}.preview-stage[data-aspect="9:16"]{aspect-ratio:9/16;height:min(62vh,490px);width:auto;max-width:100%}.preview-stage[data-aspect="1:1"]{aspect-ratio:1/1;height:min(48vw,390px);width:auto}.preview-stage video{width:100%;height:100%;object-fit:contain;display:none;position:relative;z-index:1}.preview-stage.has-video video{display:block}.preview-empty{display:flex;position:absolute;inset:0;align-items:center;justify-content:center;flex-direction:column;gap:7px}.preview-empty span{font:700 36px 'Space Grotesk';color:var(--accent);text-shadow:0 0 35px #b6ff5266}.preview-empty strong{font-size:12px}.preview-empty small{font-size:10px;color:var(--muted)}.preview-stage.has-video .preview-empty{display:none}.safe-frame{position:absolute;inset:7%;border:1px dashed #ffffff18;pointer-events:none;z-index:2}.transport{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}.transport-button,.play-button{border:1px solid var(--line);background:#ffffff08;color:white;border-radius:8px;padding:8px 11px}.play-button{background:var(--accent);color:#10140b;border:0;width:38px;font-weight:700}.timecode{font:11px 'Space Grotesk';color:#d6dbea;direction:ltr}.volume-control{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--muted)}.volume-control input{width:70px;accent-color:var(--accent)}.timeline-panel{margin-top:13px}.timeline-tools{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.zoom-control{display:flex;align-items:center;gap:6px;font:9px 'Space Grotesk';color:var(--muted)}.zoom-control input{width:85px;accent-color:var(--accent)}.edit-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:13px 0 9px;font-size:10px;color:var(--muted)}.edit-toolbar>div{display:flex;gap:6px;flex-wrap:wrap}.mini-tool{padding:6px 8px;font-size:9px}.danger{color:var(--danger)}.timeline-scroll{overflow:auto;border:1px solid var(--line);border-radius:8px;background:#080b12;max-height:390px;overscroll-behavior:contain}.timeline-inner{position:relative;min-width:100%;width:max-content;--unit:90px}.ruler-row,.track-row{display:flex;min-height:65px;border-bottom:1px solid #ffffff0d}.track-label{width:105px;min-width:105px;position:sticky;right:0;z-index:5;background:#111725;border-left:1px solid var(--line);display:flex;align-items:center;justify-content:center;font:9px 'Space Grotesk';color:#aab2c4;letter-spacing:.1em}.ruler-label{min-height:36px}.ruler{height:36px;position:relative;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(var(--unit) - 1px),#ffffff20 calc(var(--unit) - 1px),#ffffff20 var(--unit));cursor:pointer}.ruler-mark{position:absolute;top:0;height:100%;border-left:1px solid #ffffff25;padding:4px 0 0 4px;font:9px 'Space Grotesk';color:#818a9d;direction:ltr}.track-lane{height:65px;position:relative;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(var(--unit) - 1px),#ffffff0b calc(var(--unit) - 1px),#ffffff0b var(--unit));min-width:500px}.track-row:nth-child(odd) .track-lane{background-color:#ffffff03}.clip-block{position:absolute;top:8px;height:48px;min-width:18px;border:1px solid #b6ff5277;background:linear-gradient(120deg,#536d2c,#293d20);border-radius:6px;display:flex;align-items:center;overflow:hidden;cursor:grab;user-select:none;touch-action:pan-y}.clip-block.selected{outline:2px solid var(--accent);outline-offset:1px;z-index:4}.clip-block:active{cursor:grabbing}.clip-block span{font:9px 'Space Grotesk';color:#f1f8e9;padding:0 9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr}.trim-handle{position:absolute;top:0;bottom:0;width:9px;background:#d6ff9b55;cursor:ew-resize;z-index:2}.trim-handle.left{left:0}.trim-handle.right{right:0}.playhead{position:absolute;top:36px;bottom:0;width:2px;background:#ff647c;z-index:8;pointer-events:none;left:105px;transform:translateX(-1px)}.playhead i{position:absolute;top:-5px;left:-5px;width:12px;height:12px;background:#ff647c;clip-path:polygon(0 0,100% 0,50% 100%)}.timeline-hint{font-size:9px;color:var(--muted);margin-top:9px;line-height:1.7}.bottom-bar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:13px}.status-message{font-size:10px;color:var(--muted)}.export-button{border:0;border-radius:9px;padding:11px 18px;background:var(--accent);color:#10140b;font-size:11px;font-weight:700}.export-button span{margin-right:8px}.disclaimer{font-size:9px;line-height:1.8;color:#727b8d;margin:12px 2px}.clip-block.audio{background:linear-gradient(120deg,#493b78,#30264f);border-color:#9e88ff77}
@media(max-width:760px){.editor-shell{width:94vw;margin-top:15px}.project-bar{align-items:stretch;flex-direction:column}.project-meta{display:grid;grid-template-columns:1fr 1fr}.project-meta input,.project-meta select{min-width:0;width:100%}.workspace{grid-template-columns:1fr}.media-panel{order:2}.preview-panel{order:1}.preview-stage[data-aspect="9:16"]{height:min(58vh,420px)}.preview-stage[data-aspect="1:1"]{height:min(75vw,340px)}.timeline-heading{align-items:flex-start;flex-direction:column}.timeline-tools{width:100%}.edit-toolbar{align-items:flex-start;flex-direction:column}.track-label{width:82px;min-width:82px}.playhead{left:82px}.editor-title small{display:none}.back-link{font-size:9px;padding:7px}.brand strong{font-size:10px}.brand small{font-size:8px}.transport{gap:7px}.timecode{font-size:10px}.volume-control{display:none}}
@media(max-width:390px){.editor-title{font-size:10px}.tool-button{padding:7px 8px}.project-meta{grid-template-columns:1fr}.bottom-bar{align-items:stretch;flex-direction:column}.export-button{width:100%}}

.save-project{color:var(--accent);border-color:#b6ff5244;white-space:nowrap}

.export-progress-wrap{display:flex;align-items:center;gap:8px;min-width:90px;color:var(--accent);font:10px "Space Grotesk"}#export-progress{width:130px;height:8px;accent-color:var(--accent)}#export-progress[hidden]{display:none}.export-button:disabled{opacity:.65;cursor:wait}

#cancel-export{display:none}body:has(#export:disabled) #cancel-export{display:inline-flex}

.cloud-export-button{border:1px solid #8a6cff88;border-radius:9px;padding:11px 16px;background:linear-gradient(135deg,#29204d,#17152b);color:#c8baff;font-size:11px;font-weight:700;white-space:nowrap}
.cloud-export-button:disabled{opacity:.55;cursor:wait}
.bottom-bar{flex-wrap:wrap}
@media(max-width:760px){.cloud-export-button,.export-button{flex:1}}

/* Use the real, visible native file chooser on iPhone Safari. */
.import-zone{position:static;overflow:visible;display:flex;align-items:center;justify-content:center;gap:7px;padding:14px 12px;}
.media-file-picker{position:static;display:block;inset:auto;width:100%;height:auto;min-height:44px;opacity:1;z-index:auto;font-size:13px;color:var(--text);cursor:pointer;-webkit-appearance:auto;appearance:auto;background:#ffffff08;border:1px solid #b6ff5266;border-radius:8px;padding:8px;direction:ltr;}
.media-file-picker::file-selector-button{margin-right:9px;border:0;border-radius:6px;padding:9px 12px;background:var(--accent);color:#10140b;font-weight:700;cursor:pointer;}