#timeline-panel{display:flex;flex-direction:column;background:var(--bg-panel);border-top:1px solid var(--border-dark);color:var(--text-primary);font-size:var(--font-size-sm);z-index:50;user-select:none;--tl-body-height: 64px}#timeline-panel[data-view=layers]{--tl-body-height: 136px}#timeline-panel.hidden{display:none!important}.tl-bar{display:flex;align-items:center;gap:var(--space-xs);height:28px;min-height:28px;padding:0 var(--space-sm);background:var(--bg-panel-header);border-bottom:1px solid var(--border-dark);overflow-x:auto;overflow-y:hidden;scrollbar-width:none}.tl-bar::-webkit-scrollbar{display:none}.tl-group{display:flex;gap:1px}.tl-spacer{flex:1;min-width:var(--space-sm)}.tl-btn{display:inline-flex;align-items:center;justify-content:center;width:24px;height:22px;padding:0;background:transparent;border:1px solid transparent;border-radius:3px;color:var(--text-secondary);cursor:pointer;flex-shrink:0}.tl-btn svg{width:14px;height:14px}.tl-btn:hover:not(:disabled){background:var(--bg-hover);color:var(--text-bright)}.tl-btn.active{background:var(--bg-selected);color:var(--text-bright)}.tl-btn:disabled{opacity:.35;cursor:default}.tl-caret{width:14px;font-size:10px;margin-left:-4px}.tl-counter{min-width:54px;text-align:center;font-variant-numeric:tabular-nums;color:var(--text-secondary);flex-shrink:0}.tl-scrub{width:120px;min-width:60px;flex-shrink:1;accent-color:var(--accent-primary)}.tl-fps{display:inline-flex;align-items:center;gap:4px;color:var(--text-secondary);flex-shrink:0}.tl-fps input{width:44px}.tl-view-switch{display:flex;border:1px solid var(--border-medium);border-radius:3px;overflow:hidden;flex-shrink:0}.tl-view{background:transparent;border:none;color:var(--text-secondary);font-size:var(--font-size-xs);padding:2px 8px;cursor:pointer}.tl-view.active{background:var(--bg-active);color:var(--text-bright)}.tl-body{height:calc(var(--tl-body-height) + var(--tl-tag-lanes, 0) * 15px + min(var(--tl-tag-lanes, 0) * 2px,2px));overflow:hidden}.tl-strip{position:relative;display:flex;align-items:center;gap:4px;height:100%;padding:calc(var(--tl-tag-lanes, 0) * 15px) var(--space-sm) 0;overflow-x:auto;overflow-y:hidden}.tl-tag{position:absolute;height:13px;padding:0 4px;border-radius:2px;font-size:9px;line-height:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;box-sizing:border-box;z-index:1}.tl-tag:hover{filter:brightness(1.12)}.tl-tag.picked{box-shadow:0 0 0 1px var(--text-bright),0 0 0 2px #0009}.tl-tag-cells{position:relative;flex-shrink:0;height:100%}.tl-frame{position:relative;flex-shrink:0;padding:3px 3px 12px;border:1px solid var(--border-medium);border-radius:3px;background:var(--bg-dark);cursor:pointer}.tl-frame:hover{border-color:var(--border-light)}.tl-frame.selected{background:#263548;border-color:#3d5f87}.tl-frame.current{border-color:var(--accent-primary);box-shadow:0 0 0 1px var(--accent-primary)}.tl-frame.playing{border-color:var(--accent-success);box-shadow:0 0 0 1px var(--accent-success)}.tl-frame.drop-before{box-shadow:-3px 0 0 var(--accent-warning)}.tl-frame.drop-after{box-shadow:3px 0 0 var(--accent-warning)}.tl-thumb{background:conic-gradient(#c8c8c8 25%,#fff 0 50%,#c8c8c8 0 75%,#fff 0) 0 0 / 8px 8px;overflow:hidden}.tl-thumb canvas{display:block}.tl-num,.tl-dur{position:absolute;bottom:0;font-size:9px;line-height:12px;color:var(--text-secondary);font-variant-numeric:tabular-nums}.tl-num{left:4px}.tl-dur{right:4px;color:var(--accent-warning)}.tl-add-frame{flex-shrink:0;width:28px;height:44px;border:1px dashed var(--border-light);border-radius:3px;background:transparent;color:var(--text-secondary);cursor:pointer}.tl-add-frame:hover{color:var(--text-bright);border-color:var(--text-secondary)}.tl-add-frame svg{width:14px;height:14px}.tl-grid{height:100%;overflow:auto}.tl-row{display:flex;min-width:max-content;height:20px;border-bottom:1px solid var(--bg-dark)}.tl-row.active{background:#2b3644}.tl-row.hidden-layer .tl-layer-name{color:var(--text-muted)}.tl-head{position:sticky;top:0;z-index:2;background:var(--bg-panel)}.tl-layer-col{position:sticky;left:0;z-index:1;display:flex;align-items:center;gap:2px;width:150px;min-width:150px;background:var(--bg-panel);border-right:1px solid var(--border-dark);overflow:hidden}.tl-row.active .tl-layer-col{background:#2b3644}.tl-head .tl-layer-col{color:var(--text-muted);padding:0 2px 0 8px;font-size:var(--font-size-xs)}.tl-head-label{flex:1;text-transform:uppercase}.tl-layer-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tl-rename{width:100%;height:16px;padding:0 3px}.tl-mini{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;padding:0;background:transparent;border:none;border-radius:2px;color:var(--text-muted);cursor:pointer;flex-shrink:0}.tl-mini svg{width:12px;height:12px}.tl-mini:hover:not(:disabled){color:var(--text-bright);background:var(--bg-hover)}.tl-mini:disabled{opacity:.35;cursor:default}.tl-mini.active{color:var(--accent-primary)}.tl-mini-gap{width:18px;flex-shrink:0}.tl-cells{display:flex}.tl-head-cell,.tl-cell{position:relative;flex-shrink:0;height:20px;border-right:1px solid var(--bg-dark);cursor:pointer}.tl-head-cell{font-size:9px;line-height:20px;text-align:center;color:var(--text-muted);overflow:visible;white-space:nowrap}.tl-head-cell.current{background:var(--accent-primary);color:#fff}.tl-cell.key,.tl-cell.hold{background:#3b3b3b}.tl-cell.span-end{border-right-color:var(--border-light)}.tl-cell.shared{background:#34404d;border-right-color:#34404d}.tl-cell.selected,.tl-head-cell.selected{background-color:#263548}.tl-cell.current{box-shadow:inset 1px 0 #5294e273,inset -1px 0 #5294e273}.tl-row.active .tl-cell.current{box-shadow:inset 0 0 0 2px var(--accent-primary)}.tl-cell.playing,.tl-head-cell.playing{box-shadow:inset 0 0 0 1px var(--accent-success)}.tl-dot{position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:var(--text-primary)}.tl-dot.empty{background:transparent;border:1.5px solid var(--text-secondary)}.tl-cell.tween{background:#423a5c}.tl-cell.tween:not(.tween-start):before{content:"";position:absolute;left:0;right:0;top:50%;border-top:1px solid #a99be0}.tl-cell.tween-start:before{content:"";position:absolute;left:50%;right:0;top:50%;border-top:1px solid #a99be0}.tl-cell.tween-last:before{right:4px}.tl-cell.tween-last:after{content:"";position:absolute;right:1px;top:50%;margin-top:-3.5px;border-left:5px solid #a99be0;border-top:3.5px solid transparent;border-bottom:3.5px solid transparent}.tl-cell.tween.selected{background-color:#3b4566}.tl-cell.tween.picked{background-color:#5b4d8f}.tl-cell.tween.picked:before{border-top-color:#d6ccff}.tl-cell.tween.picked.tween-last:after{border-left-color:#d6ccff}.tag-dialog .fw-dialog-row label{min-width:70px}.tag-hint{color:var(--text-secondary);font-size:var(--font-size-sm)}.tag-swatches{display:flex;flex-wrap:wrap;align-items:center;gap:5px}.tag-swatch{width:18px;height:18px;padding:0;border:1px solid rgba(0,0,0,.4);border-radius:3px;cursor:pointer}.tag-swatch.active{box-shadow:0 0 0 2px var(--bg-panel),0 0 0 3px var(--text-bright)}.tag-swatches input[type=color]{width:26px;height:20px;padding:0;border:none;background:none;cursor:pointer}.tl-onion-menu{padding:var(--space-sm) var(--space-md);min-width:220px}.tl-onion-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);padding:3px 0;font-size:var(--font-size-sm);color:var(--text-primary)}.tl-onion-row input[type=checkbox]{margin-right:auto}.tl-onion-row input[type=range]{width:100px}body.layout-compact #timeline-panel{--tl-body-height: 58px}body.layout-compact .tl-view-switch,body.layout-compact .tl-fps,body.layout-compact .tl-caret,body.layout-compact .tl-btn[data-act="anim:first"],body.layout-compact .tl-btn[data-act="anim:last"],body.layout-compact .tl-btn[data-toggle=pingPong],body.layout-compact .tl-btn[data-act="tl:tween"]{display:none}body.layout-compact .tl-scrub{width:80px}.export-dialog.anim-export-dialog{width:820px;min-width:0;max-width:calc(100vw - 32px);height:560px}.anim-export-size{display:flex;align-items:center;gap:var(--space-sm)}.anim-export-size select{width:90px}.anim-export-dims{color:var(--text-secondary);font-size:var(--font-size-sm);font-variant-numeric:tabular-nums}.anim-export-quality{display:flex;align-items:center;gap:var(--space-sm)}.anim-export-quality input[type=range]{flex:1;min-width:0}.anim-export-quality .export-field-val{min-width:52px;text-align:right;font-variant-numeric:tabular-nums}.anim-export-stage{cursor:default}.anim-export-stage img,.anim-export-stage video{max-width:100%;max-height:100%;background:conic-gradient(#c8c8c8 25%,#fff 0 50%,#c8c8c8 0 75%,#fff 0) 0 0 / 12px 12px;box-shadow:0 2px 12px #00000080}.anim-export-stage img:not([src]){visibility:hidden}.anim-export-stage img.pixelated,.anim-export-stage video.pixelated{image-rendering:pixelated}@media(max-width:760px){.export-dialog.anim-export-dialog .export-body{flex-direction:column;overflow-y:auto}.export-dialog.anim-export-dialog .export-left{width:auto;min-width:0;border-right:none}.export-dialog.anim-export-dialog{height:auto;max-height:92vh}}.anim-export-pair{display:flex;gap:var(--space-sm)}.anim-export-pair .export-field{flex:1;min-width:0}.anim-export-pair input.fw-input{width:100%}.export-dialog.sheet-import-dialog{width:820px;min-width:0;max-width:calc(100vw - 32px);height:560px}.sheet-import-note{margin:0;color:var(--text-secondary);font-size:var(--font-size-sm);overflow-wrap:anywhere}.sheet-import-note strong{color:var(--text-primary);font-weight:600}.sheet-mode{align-self:flex-start}.sheet-pair{display:flex;gap:var(--space-sm)}.sheet-pair .sheet-num{flex:1;min-width:0}.sheet-num>label{min-width:0}.sheet-num input.fw-input{width:64px;min-width:0}.sheet-radio{display:flex;align-items:center;gap:6px;color:var(--text-primary);font-size:var(--font-size-sm);cursor:pointer}.sheet-import-stage{cursor:default}.sheet-import-stage canvas{max-width:100%;max-height:100%;image-rendering:pixelated;background:conic-gradient(#c8c8c8 25%,#fff 0 50%,#c8c8c8 0 75%,#fff 0) 0 0 / 12px 12px;box-shadow:0 2px 12px #00000080}@media(max-width:760px){.export-dialog.sheet-import-dialog .export-body{flex-direction:column;overflow-y:auto}.export-dialog.sheet-import-dialog .export-left{width:auto;min-width:0;border-right:none}.export-dialog.sheet-import-dialog{height:auto;max-height:92vh}}body.timeline-open .panel-tab-properties{bottom:calc(var(--properties-panel-height, 180px) + var(--timeline-panel-height, 0px))}body.timeline-open .panel-tab-properties.is-hidden{bottom:calc(var(--status-bar-height, 22px) + var(--timeline-panel-height, 0px))!important}
