:root{--bg-app:#12141a;--bg-panel:#1a1d26;--bg-elevated:#222632;--bg-hover:#2a3040;--border:#2e3444;--text:#e8eaef;--text-muted:#9aa3b5;--accent:#3d8bfd;--danger:#e85d5d;--clip:#2f6fed;--clip-selected:#5b9cff;--playhead:#ff5c5c;--ruler:#6b7385;--track-label-w:52px;--font:"Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;--mono:"Cascadia Code", "Consolas", monospace}*,:before,:after{box-sizing:border-box}html,body,#root{background:var(--bg-app);width:100%;height:100%;color:var(--text);font-family:var(--font);margin:0;overflow:hidden}button,input{font:inherit;color:inherit}button{cursor:pointer;border:1px solid var(--border);background:var(--bg-elevated);white-space:nowrap;border-radius:6px;flex-shrink:0;padding:6px 12px}button:hover:not(:disabled){background:var(--bg-hover)}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:var(--accent);color:#fff;border-color:#0000}button.primary:hover:not(:disabled){filter:brightness(1.08)}button.danger:hover:not(:disabled){border-color:var(--danger);color:var(--danger)}.editor{grid-template-rows:48px minmax(0,1fr) 240px;width:100%;height:100%;display:grid;overflow:hidden}.topbar{border-bottom:1px solid var(--border);background:var(--bg-panel);align-items:center;gap:8px;min-width:0;padding:0 12px;display:flex;overflow:hidden}.topbar .brand{letter-spacing:.02em;flex-shrink:0;font-weight:700}.topbar .project-name{width:120px;min-width:0;color:var(--text-muted);background:0 0;border:1px solid #0000;border-radius:4px;flex-shrink:1;padding:4px 8px}.topbar .project-name:focus{border-color:var(--accent);color:var(--text);outline:none}.spacer{flex:1;min-width:8px}.topbar .hint{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;flex-shrink:1;max-width:220px;font-size:12px;overflow:hidden}.export-status{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;flex-shrink:1;max-width:140px;font-size:12px;overflow:hidden}.main{border-bottom:1px solid var(--border);grid-template-columns:240px minmax(0,1fr);min-width:0;min-height:0;display:grid;overflow:hidden}.panel{background:var(--bg-panel);flex-direction:column;min-width:0;min-height:0;display:flex;overflow:hidden}.panel-header{letter-spacing:.04em;color:var(--text-muted);border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:8px;min-width:0;padding:8px 12px;font-size:12px;display:flex}.library{border-right:1px solid var(--border)}.library-list{flex-direction:column;flex:1;gap:8px;min-height:0;padding:10px;display:flex;overflow:auto}.asset-card{background:var(--bg-elevated);text-align:left;border:1px solid #0000;border-radius:8px;grid-template-columns:72px minmax(0,1fr);gap:8px;width:100%;padding:8px;display:grid}.asset-card:hover{border-color:var(--accent)}.asset-card img,.asset-card .thumb-fallback{object-fit:cover;background:#0d0f14;border-radius:4px;width:72px;height:40px}.asset-card .thumb-fallback{color:var(--text-muted);place-items:center;font-size:11px;display:grid}.asset-card .text-thumb{color:#fff;background:linear-gradient(#2f6fed 0%,#1f4fb8 100%);font-size:18px;font-weight:700}.add-text-btn{border:1px solid var(--border);background:var(--bg-elevated);color:var(--text);cursor:pointer;border-radius:6px;flex-shrink:0;padding:4px 10px;font-size:12px}.add-text-btn:hover{border-color:var(--accent);color:#cfe0ff}.text-prompt-overlay{z-index:95;background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.text-prompt{background:var(--bg-panel);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:10px;width:320px;max-width:90vw;padding:16px;display:flex;box-shadow:0 20px 56px #00000080}.text-prompt-title{font-size:14px;font-weight:600}.text-prompt-input{resize:vertical;background:var(--bg-elevated);border:1px solid var(--border);width:100%;color:var(--text);border-radius:8px;outline:none;padding:8px 10px;font-size:13px;line-height:1.5}.text-prompt-input:focus{border-color:var(--accent);box-shadow:0 0 0 2px #3d8bfd40}.text-prompt-actions{justify-content:flex-end;gap:8px;display:flex}.text-prompt-actions button{border:1px solid var(--border);background:var(--bg-elevated);color:var(--text);cursor:pointer;border-radius:8px;padding:6px 14px;font-size:13px}.text-prompt-actions button:hover{background:var(--bg-hover)}.text-prompt-actions .primary{background:var(--accent);border-color:var(--accent);color:#fff}.asset-meta{min-width:0}.asset-meta .name{white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.asset-meta .sub{color:var(--text-muted);margin-top:2px;font-size:11px}.library-empty,.timeline-empty{color:var(--text-muted);padding:16px;font-size:13px;line-height:1.5}.preview-panel{min-width:0}.preview-stage{background:#0a0b0f;flex:1;justify-content:center;align-items:center;min-width:0;min-height:0;padding:12px;display:flex;position:relative;overflow:hidden}.preview-stage video,.preview-stage .preview-image{object-fit:contain;background:#000;width:100%;max-width:100%;height:100%;max-height:100%;position:absolute;inset:0}.preview-placeholder{color:var(--text-muted);pointer-events:none;text-shadow:0 2px 12px #000000d9;-webkit-user-select:none;user-select:none;z-index:2;place-items:center;padding:0 24px;font-size:14px;display:grid;position:absolute;inset:0}.transport{border-top:1px solid var(--border);background:var(--bg-panel);flex-wrap:wrap;flex-shrink:0;justify-content:center;align-items:center;gap:8px;padding:8px 10px;display:flex}.transport .timecode{font-family:var(--mono);color:var(--text-muted);text-align:center;min-width:160px;font-size:13px}.timeline-panel{background:var(--bg-panel);flex-direction:column;min-width:0;min-height:0;display:flex;overflow:hidden}.timeline-toolbar{border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:8px;min-width:0;padding:6px 12px;display:flex}.timeline-toolbar .title{color:var(--text-muted);letter-spacing:.04em;flex-shrink:0;font-size:12px}.timeline-toolbar label{color:var(--text-muted);flex-shrink:0;font-size:12px}.timeline-toolbar input[type=range]{flex-shrink:0;width:100px}.timeline-body{grid-template-columns:var(--track-label-w) minmax(0, 1fr);flex:1;min-width:0;min-height:0;display:grid;overflow:hidden}.timeline-gutter{scrollbar-width:none;-ms-overflow-style:none;border-right:1px solid var(--border);background:var(--bg-elevated);z-index:2;flex-direction:column;min-height:0;display:flex;overflow:hidden auto}.timeline-gutter::-webkit-scrollbar{display:none}.gutter-ruler{border-bottom:1px solid var(--border);z-index:2;background:var(--bg-elevated);flex-shrink:0;height:28px;position:sticky;top:0}.gutter-track{height:48px;color:var(--text-muted);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:center;align-items:center;gap:4px;font-size:12px;font-weight:600;display:flex;position:relative}.gutter-track-label{pointer-events:none}.gutter-track-remove{color:var(--text-muted);cursor:pointer;background:0 0;border:0;border-radius:4px;justify-content:center;align-items:center;width:18px;height:18px;padding:0;font-size:11px;line-height:1;display:none}.gutter-track:hover .gutter-track-remove{display:inline-flex}.gutter-track-remove:hover{background:var(--danger);color:#fff}.gutter-track-lock{cursor:pointer;background:0 0;border:0;border-radius:4px;justify-content:center;align-items:center;width:20px;height:20px;padding:0;font-size:12px;line-height:1;display:inline-flex}.gutter-track-lock:hover{background:var(--bg-hover)}.gutter-track.locked .gutter-track-label{color:#f0b34a}.track-lane.locked{background:repeating-linear-gradient(45deg,#ffffff08,#ffffff08 8px,#0000 8px 16px),repeating-linear-gradient(90deg,#0000,#0000 39px,#ffffff05 40px)}.track-lane.locked .clip{cursor:default;opacity:.65;filter:saturate(.6)}.track-lane.locked .clip .handle{display:none}.timeline-scroll{scrollbar-width:thin;scrollbar-color:#3a4254 transparent;background:#151821;min-width:0;min-height:0;position:relative;overflow:auto}.timeline-scroll::-webkit-scrollbar{width:10px;height:10px}.timeline-scroll::-webkit-scrollbar-track{background:0 0}.timeline-scroll::-webkit-scrollbar-thumb{background:#3a4254;border:2px solid #151821;border-radius:5px}.timeline-scroll::-webkit-scrollbar-thumb:hover{background:#4a5468}.timeline-scroll::-webkit-scrollbar-corner{background:0 0}.timeline-inner{min-height:100%;position:relative}.ruler{border-bottom:1px solid var(--border);z-index:4;background:var(--bg-elevated);height:28px;color:var(--ruler);font-size:10px;font-family:var(--mono);-webkit-user-select:none;user-select:none;cursor:pointer;touch-action:none;position:sticky;top:0}.ruler-tick{white-space:nowrap;pointer-events:none;border-left:1px solid #2a3142;height:100%;padding-top:6px;padding-left:4px;position:absolute;top:0}.ruler-tick.minor{border-left-color:#ffffff21;height:40%;padding:0;top:auto;bottom:0}.track-lane{cursor:pointer;touch-action:none;border-bottom:1px solid var(--border);background:repeating-linear-gradient(90deg,#0000,#0000 39px,#ffffff05 40px);height:48px;position:relative}.clip{background:linear-gradient(180deg, var(--clip) 0%, #1f4fb8 100%);cursor:grab;-webkit-user-select:none;user-select:none;border:1px solid #ffffff26;border-radius:5px;align-items:stretch;min-width:8px;height:40px;display:flex;position:absolute;top:3px;overflow:hidden}.clip:active{cursor:grabbing}.clip.selected{background:linear-gradient(180deg, var(--clip-selected) 0%, #3d78d6 100%);box-shadow:0 0 0 1px #fff3}.clip .label{white-space:nowrap;text-overflow:ellipsis;pointer-events:none;flex:1;min-width:0;padding:2px 8px;font-size:11px;overflow:hidden}.clip .handle{cursor:ew-resize;background:#00000038;flex-shrink:0;width:8px}.clip .handle:hover{background:#ffffff40}.playhead{background:var(--playhead);pointer-events:none;z-index:5;width:2px;position:absolute;top:0;bottom:0}.playhead:before{content:"";border-left:6px solid #0000;border-right:6px solid #0000;border-top:8px solid var(--playhead);position:absolute;top:0;left:-5px}.error-toast{border:1px solid var(--danger);color:#ffd7d7;z-index:50;background:#3a1f24;border-radius:8px;max-width:360px;padding:10px 14px;font-size:13px;position:fixed;bottom:16px;right:16px}@media (width<=900px){.main{grid-template-columns:180px minmax(0,1fr)}.topbar .hint,.topbar .project-name{display:none}}@media (width<=640px){.editor{grid-template-rows:48px minmax(0,1fr) 200px}.main{grid-template-rows:120px minmax(0,1fr);grid-template-columns:1fr}.library{border-right:none;border-bottom:1px solid var(--border)}}.library.drag-active{background:linear-gradient(180deg, #3d8bfd24 0%, var(--bg-panel) 100%);box-shadow:inset 0 0 0 1px #3d8bfd73}.library.drag-active .panel-header{color:#cfe0ff}.library.drag-active .library-empty{color:#d8e5ff}.asset-card[draggable=true]{cursor:grab}.asset-card[draggable=true]:active{cursor:grabbing}.timeline-panel.asset-drag-active .track-lane,.timeline-panel.asset-drag-active .timeline-empty{background-color:#3d8bfd14;box-shadow:inset 0 0 0 1px #3d8bfd99}.clip-context-menu{z-index:80;border:1px solid var(--border);background:var(--bg-elevated);border-radius:8px;min-width:152px;padding:6px;position:fixed;box-shadow:0 12px 28px #0000005c}.clip-context-menu button{width:100%;color:var(--text);text-align:left;background:0 0;border:0;border-radius:6px;padding:8px 10px;display:block}.clip-context-menu button:hover{background:var(--bg-hover)}.clip .label{flex-direction:column;justify-content:center;gap:2px;display:flex}.clip .label-name{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.clip .label-text{color:#ffffffd9;white-space:nowrap;text-overflow:ellipsis;font-size:10px;overflow:hidden}.drawer-overlay{z-index:90;background:#00000059;position:fixed;inset:0}.clip-drawer{background:var(--bg-panel);border:1px solid var(--border);transform-origin:bottom;border-radius:12px;flex-direction:column;width:380px;max-width:92vw;animation:.22s ease-out drawer-pull-down;display:flex;position:fixed;overflow:hidden;transform:translate(-50%)translateY(calc(-100% - 8px));box-shadow:0 20px 56px #0000008c}@keyframes drawer-pull-down{0%{opacity:0;transform:translate(-50%)translateY(calc(-100% - 8px))scaleY(.55)}to{opacity:1;transform:translate(-50%)translateY(calc(-100% - 8px))scaleY(1)}}.drawer-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:flex-start;gap:8px;padding:16px;display:flex}.drawer-title{flex-direction:column;gap:3px;min-width:0;display:flex}.drawer-title-main{font-size:14px;font-weight:600}.drawer-title-sub{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.drawer-close{color:var(--text-muted);cursor:pointer;background:0 0;border:0;border-radius:6px;flex-shrink:0;width:28px;height:28px;font-size:14px}.drawer-close:hover{background:var(--bg-hover);color:var(--text)}.drawer-body{flex-direction:column;flex:1;gap:8px;min-height:0;padding:16px;display:flex;overflow-y:auto}.drawer-label{color:var(--text-muted);font-size:12px;font-weight:600}.drawer-textarea{resize:vertical;background:var(--bg-elevated);border:1px solid var(--border);min-height:140px;color:var(--text);border-radius:8px;outline:none;flex:1;padding:10px 12px;font-size:13px;line-height:1.6}.drawer-textarea:focus{border-color:var(--accent);box-shadow:0 0 0 2px #3d8bfd40}.drawer-hint{color:var(--text-muted);font-size:11px;line-height:1.5}.drawer-ai{border-top:1px dashed var(--border);flex-direction:column;gap:6px;margin-top:4px;padding-top:12px;display:flex}.drawer-ai-button{border:1px solid var(--accent);cursor:pointer;background:var(--accent);color:#fff;border-radius:8px;padding:9px 14px;font-size:13px;font-weight:600;transition:background .15s,opacity .15s}.drawer-ai-button:hover:not(:disabled){background:var(--accent-hover,#3d8bfd)}.drawer-ai-button:disabled{opacity:.65;cursor:wait}.drawer-ai-error{color:#ff6b6b;font-size:12px;line-height:1.5}.drawer-ai-result{color:#4ade80;font-size:12px;line-height:1.5}.drawer-select{background:var(--bg-elevated);border:1px solid var(--border);color:var(--text);border-radius:8px;outline:none;padding:8px 10px;font-size:13px}.drawer-select:focus{border-color:var(--accent);box-shadow:0 0 0 2px #3d8bfd40}.drawer-footer{border-top:1px solid var(--border);justify-content:flex-end;gap:8px;padding:12px 16px;display:flex}.drawer-footer button{border:1px solid var(--border);cursor:pointer;background:var(--bg-elevated);color:var(--text);border-radius:8px;padding:7px 14px;font-size:13px}.drawer-footer button:hover{background:var(--bg-hover)}.drawer-footer .drawer-save{background:var(--accent);border-color:var(--accent);color:#fff}.drawer-footer .drawer-save:hover{background:var(--accent-hover,#3d8bfd)}