.timeline-panel{--timeline-label-width:140px;min-width:0}
.timeline-toolbar{flex-wrap:wrap;gap:7px}
.timeline-play-btn{min-width:68px;min-height:36px;font-weight:600}
.timeline-play-btn.playing{background:#ff432b;border-color:#ff432b}
.timeline-reset-btn{display:grid;place-items:center;width:34px;height:36px;flex-shrink:0;padding:0;border:1px solid #dfe4e8;border-radius:7px;background:#fff;color:#53616c;cursor:pointer}
.timeline-reset-btn svg{width:17px;height:17px}
.timeline-clock{min-width:0;font-size:11px;font-variant-numeric:tabular-nums}
.timeline-duration-control{gap:6px;font-size:11px}
.timeline-duration-control input{width:58px;height:36px;font-size:12px}
.timeline-area{max-height:214px;overscroll-behavior:contain}
.timeline-inner{min-width:0}
.timeline-ruler,.timeline-row{grid-template-columns:var(--timeline-label-width) minmax(0,1fr)}
.timeline-ruler{position:sticky;top:0;z-index:5;background:#fbfbfb}
.timeline-ruler-track,.timeline-track{touch-action:none}
.timeline-ruler-label{z-index:6}
.timeline-tick-label:first-child{transform:none;padding-left:3px}
.timeline-tick-label:last-child{transform:translateX(-100%);padding-right:3px}
.timeline-label{gap:6px;font-size:11px;user-select:none}
.timeline-label>span:last-child{overflow:hidden;text-overflow:ellipsis}
.timeline-label>span:nth-child(2){display:none}
.timeline-type-dot{width:6px;height:6px;flex-shrink:0}
.timeline-row,.timeline-track{min-height:38px}
.timeline-block{top:5px;height:28px;line-height:28px;min-width:4px;border-radius:5px;touch-action:none;user-select:none;box-shadow:none}
.timeline-block.active{background:var(--timeline-color);box-shadow:inset 0 0 0 2px #172c3a,0 0 0 1px #fff}
.timeline-block-handle{width:10px}
.timeline-block-handle::after{content:"";position:absolute;left:4px;top:8px;width:2px;height:12px;border-radius:1px;background:#ffffffb3}
.timeline-block-label{font-size:10px;padding:0 12px}
.timeline-playhead{background:#ff432b;box-shadow:none;z-index:4}
.timeline-playhead::before{background:#ff432b}
.timeline-selection{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-top:1px solid #e8ecef;background:#fff}
.timeline-selected-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#46525d;font-size:11px}
.timeline-time-fields{display:flex;flex-shrink:0;gap:8px}
.timeline-time-fields[hidden]{display:none}
.timeline-time-fields label{display:flex;align-items:center;gap:5px;font-size:11px;color:#66717b;white-space:nowrap}
.timeline-time-fields input{width:62px;height:32px;padding:5px 6px;font-size:12px}
.timeline-hint{margin:0;padding:0 12px 10px;font-size:10px;line-height:1.5;color:#697580}
.timeline-panel button:focus-visible{outline:2px solid #e84730;outline-offset:2px}
@media(max-width:720px){
  .timeline-panel{--timeline-label-width:110px}
  .timeline-toolbar{padding:9px!important;gap:6px}
  .timeline-duration-control{margin-left:auto}
  .timeline-selection{flex-wrap:wrap;gap:8px;padding:10px}
  .timeline-selected-label{flex-basis:100%}
  .timeline-time-fields{width:100%;justify-content:space-between}
  .timeline-time-fields label{gap:8px}
  .timeline-time-fields input{width:70px;height:36px}
  .timeline-hint{padding-inline:10px}
}