.vx-tl{display:flex;flex-direction:column;gap:4px;width:100%}
.vx-tl__ruler{position:relative;height:22px;border-bottom:1px solid var(--border-1)}
.vx-tl__tick{position:absolute;top:0;bottom:0;border-left:1px solid var(--track-line);padding-left:5px;
  font:var(--type-mono-s);color:var(--text-3);display:flex;align-items:flex-start}
.vx-tl__row{display:flex;align-items:stretch;gap:8px}
.vx-tl__label{width:76px;flex:0 0 auto;font:var(--type-label);letter-spacing:var(--tracking-label);
  text-transform:uppercase;color:var(--text-3);display:flex;align-items:center}
.vx-tl__lane{position:relative;flex:1;height:var(--track-h);background:var(--track-bg);
  border:1px solid var(--border-1);border-radius:var(--radius-sm);box-shadow:var(--inset-sunken);overflow:hidden}
.vx-tl__clip{position:absolute;top:4px;bottom:4px;border-radius:var(--radius-clip);padding:4px 7px;overflow:hidden;
  cursor:pointer;border:1px solid rgba(0,0,0,.35);box-shadow:var(--inset-top-strong),var(--shadow-1);
  transition:filter var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out)}
.vx-tl__clip:hover{filter:brightness(1.12)}
.vx-tl__clip--sel{box-shadow:var(--inset-top-strong),0 0 0 2px var(--playhead)}
.vx-tl__clip-txt{font:600 11px/1.25 var(--font-text);color:rgba(20,14,4,.86);overflow:hidden;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;text-overflow:ellipsis}
.vx-tl__playhead{position:absolute;top:0;bottom:0;width:2px;background:var(--playhead);z-index:5;pointer-events:none;
  box-shadow:0 0 8px rgba(255,243,224,.5)}