*{box-sizing:border-box;margin:0;padding:0}body{color:#e0e0e0;background:#121212;font-family:Inter,system-ui,-apple-system,sans-serif;overflow:hidden}#root{width:100%;height:100vh}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#ffffff40}.app-shell{flex-direction:column;height:100vh;display:flex;overflow:hidden}.top-bar{background:#181818;border-bottom:1px solid #ffffff14;flex-shrink:0;align-items:center;gap:8px;height:48px;padding:0 12px;display:flex}.main-area{flex-direction:column;flex:1;min-height:0;display:flex}.upper-row{flex:1;min-height:0;display:flex}.library-panel{background:#161616;border-right:1px solid #ffffff0f;flex-direction:column;flex-shrink:0;min-width:240px;display:flex;overflow:hidden}.preview-panel{background:#0d0d0d;flex-direction:column;flex:1;min-width:320px;display:flex;position:relative;overflow:hidden}.timeline-panel{background:#1a1a1a;border-top:1px solid #ffffff0f;flex-direction:column;flex-shrink:0;display:flex;overflow:hidden}.v-resizer{cursor:col-resize;background:#ffffff0a;flex-shrink:0;width:6px;transition:background .15s}.v-resizer:hover,.v-resizer:active{background:#ffffff2e}.h-resizer{cursor:row-resize;background:#ffffff0a;flex-shrink:0;height:6px;transition:background .15s}.h-resizer:hover,.h-resizer:active{background:#ffffff2e}.library-list{flex-direction:column;flex:1;gap:6px;padding:8px;display:flex;overflow-y:auto}.library-grid{flex:1;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));align-content:start;gap:8px;padding:8px;display:grid;overflow-y:auto}.library-details-header{color:#888;text-transform:uppercase;letter-spacing:.5px;-webkit-user-select:none;user-select:none;background:#131313;border-bottom:1px solid #ffffff14;flex-shrink:0;padding:4px 8px;font-size:11px;font-weight:600;display:flex}.library-details-header .library-details-cell{cursor:pointer;padding:4px 6px}.library-details-header .library-details-cell:hover{color:#ddd}.library-details-header .library-details-cell.active{color:#ffeb3b}.library-details-body{flex:1;padding:0;overflow-y:auto}.library-details-row{color:#e0e0e0;cursor:pointer;-webkit-user-select:none;user-select:none;border-bottom:1px solid #ffffff0a;padding:4px 8px;font-size:12px;display:flex}.library-details-row:hover{background:#262626}.library-details-row.selected{background:#4fc3f726}.library-details-cell{text-overflow:ellipsis;white-space:nowrap;min-width:0;padding:0 6px;overflow:hidden}.library-details-name{flex:auto}.library-details-dim{text-align:right;color:#999;flex:0 0 84px}.library-details-dur{text-align:right;color:#999;flex:0 0 64px}.library-details-fps{text-align:right;color:#999;flex:0 0 52px}.library-details-type{text-align:right;color:#999;flex:0 0 48px}.library-grid-item{cursor:pointer;-webkit-user-select:none;user-select:none;background:#1f1f1f;border:2px solid #0000;border-radius:6px;flex-direction:column;transition:background .1s,border-color .1s;display:flex;position:relative;overflow:hidden}.library-grid-item:hover{background:#262626}.library-grid-item.selected{border-color:#4fc3f7}.library-grid-thumb{aspect-ratio:16/9;object-fit:contain;background:#000;width:100%;display:block}.library-grid-meta{min-width:0;padding:6px 8px;font-size:11px}.library-grid-name{color:#e0e0e0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.library-grid-sub{color:#888;margin-top:2px;font-size:10px}.library-grid-actions{opacity:0;background:#0009;border-radius:4px;gap:2px;transition:opacity .15s;display:flex;position:absolute;top:4px;right:4px}.library-grid-item:hover .library-grid-actions{opacity:1}.library-item{cursor:pointer;-webkit-user-select:none;user-select:none;background:#1f1f1f;border:2px solid #0000;border-radius:6px;align-items:center;gap:8px;padding:6px;transition:background .1s,border-color .1s;display:flex}.library-item:hover{background:#262626}.library-item.selected{border-color:#4fc3f7}.library-item-thumb{object-fit:contain;background:#000;border-radius:3px;flex-shrink:0;width:84px;height:48px}.library-item-meta{flex:1;min-width:0;font-size:12px}.library-item-name{color:#e0e0e0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.library-item-sub{color:#888;font-size:11px}.timeline-toolbar{background:#161616;border-bottom:1px solid #ffffff0d;flex-shrink:0;align-items:center;gap:8px;padding:4px 8px;display:flex}.timeline-scroll{flex:1;position:relative;overflow:auto hidden}.timeline-track{background:repeating-linear-gradient(90deg,#0000 0 49px,#ffffff05 49px 50px);position:relative}.segment-block{cursor:pointer;-webkit-user-select:none;user-select:none;background:linear-gradient(#2196f3 0%,#1565c0 100%);border:2px solid #0000;border-radius:4px;align-items:flex-end;height:calc(100% - 16px);transition:border-color .1s,transform .1s;display:flex;position:absolute;top:8px;overflow:hidden;box-shadow:0 1px 3px #0006}.segment-block.selected{border-color:#ffeb3b}.segment-block:hover{filter:brightness(1.1)}.segment-effects-btn{z-index:4;color:#888;cursor:pointer;background:#141414b3;border:1px solid #0000;border-radius:4px;justify-content:center;align-items:center;width:24px;height:24px;padding:0;transition:background .1s,color .1s;display:flex;position:absolute;top:4px;left:4px}.segment-effects-btn:hover{color:#ccc;background:#282828e6}.segment-effects-btn.active{color:#ffeb3b;background:#ffeb3b2e;border-color:#ffeb3b66}.segment-effects-btn.active:hover{background:#ffeb3b4d}.segment-effects-count{color:#000;background:#ffeb3b;border-radius:6px;justify-content:center;align-items:center;min-width:12px;height:12px;padding:0 3px;font-size:9px;font-weight:700;line-height:1;display:flex;position:absolute;top:-4px;right:-4px}.segment-thumbs{pointer-events:none;opacity:.85;position:absolute;inset:0}.trim-handle{cursor:col-resize;z-index:2;background:0 0;width:8px;position:absolute;top:0;bottom:0}.trim-handle.left{left:-4px}.trim-handle.right{right:-4px}.trim-handle:hover{background:#ffeb3b66}.playhead{pointer-events:none;z-index:10;background:#f44336;width:2px;position:absolute;top:0;bottom:0;box-shadow:0 0 4px #f4433699}.playhead-handle{cursor:ew-resize;pointer-events:auto;background:#f44336;border-radius:0 0 50% 50%;width:14px;height:14px;position:absolute;top:0;left:-6px}.timeline-ruler{-webkit-user-select:none;user-select:none;cursor:pointer;background:#131313;border-bottom:1px solid #ffffff0f;height:22px;position:relative}.preview-canvas-wrap{flex:1;justify-content:center;align-items:center;min-height:0;padding:8px;display:flex;position:relative}.preview-canvas{background:#000;border:1px solid #ffffff1a;border-radius:6px;max-width:100%;max-height:100%;display:block}.preview-controls{background:#161616;border-top:1px solid #ffffff0d;flex-shrink:0;padding:6px 12px}.preview-tabs{background:#1a1a1a;border-bottom:1px solid #ffffff0f;flex-shrink:0;display:flex}.preview-tab{cursor:pointer;color:#999;-webkit-user-select:none;user-select:none;border-bottom:2px solid #0000;padding:8px 16px;font-size:13px}.preview-tab.active{color:#fff;border-bottom-color:#4fc3f7}.context-menu{z-index:1000;background:#232323;border:1px solid #ffffff1a;border-radius:4px;min-width:180px;padding:4px 0;position:fixed;box-shadow:0 4px 12px #00000080}.context-menu-item{color:#e0e0e0;cursor:pointer;-webkit-user-select:none;user-select:none;padding:6px 14px;font-size:13px}.context-menu-item:hover{background:#2d2d2d}.context-menu-item.disabled{color:#555;cursor:default}.context-menu-item.disabled:hover{background:0 0}.context-menu-divider{background:#ffffff14;height:1px;margin:4px 0}.transition-marker{z-index:3;cursor:pointer;color:#fff;pointer-events:auto;background:linear-gradient(90deg,#9c27b099,#9c27b033);border-left:2px solid #9c27b0cc;border-right:2px solid #9c27b0cc;border-radius:2px;justify-content:center;align-items:center;width:12px;height:calc(100% - 16px);font-size:9px;font-weight:600;display:flex;position:absolute;top:8px}.transition-marker:hover{background:linear-gradient(90deg,#9c27b0cc,#9c27b066)}.drop-indicator{pointer-events:none;z-index:5;background:#ffeb3b;border-radius:2px;width:3px;position:absolute;top:16px;bottom:16px;box-shadow:0 0 6px #ffeb3b}.gap-block{pointer-events:none;background:repeating-linear-gradient(45deg,#ffffff0a 0 8px,#ffffff14 8px 16px);border:1px dashed #fff3;border-radius:4px;height:calc(100% - 16px);position:absolute;top:8px}@media (width<=800px){.library-panel{min-width:200px;width:240px!important}}
