.tx{position:relative;width:100vw;margin-left:calc(50% - 50vw);user-select:none;-webkit-user-select:none;outline:none;touch-action:pan-y}.tx:focus-visible .tx-ruler{box-shadow:inset 0 -1px 0 var(--cws-fg)}.tx-band{position:relative;padding:192px 0 26px}.tx-lanes,.tx-ruler{-webkit-mask:linear-gradient(90deg,transparent,#000 calc(var(--hl) - 8px),#000 88%,transparent 99%);mask:linear-gradient(90deg,transparent,#000 calc(var(--hl) - 8px),#000 88%,transparent 99%)}.tx-lanes{padding-bottom:4px;transition:opacity .38s}.tx-lanes.dim{opacity:.15}.tx-lanes:after{content:"";position:absolute;left:0;right:0;bottom:-26px;height:40px;background:linear-gradient(transparent,var(--cws-bg));pointer-events:none}.tx-ruler{position:relative;height:40px}.tx-ruler .tk{position:absolute;bottom:0;width:1px;height:4px;background:var(--cws-line2)}.tx-ruler .tk.maj{height:9px;background:var(--cws-faint)}.tx-ruler .tk span{position:absolute;bottom:11px;left:3px;font:500 10.5px var(--cws-mono);color:var(--cws-faint);white-space:nowrap}.tx-mk{position:absolute;top:2px;display:flex;align-items:center;gap:5px;font-size:11px;color:var(--cws-muted);transform:translateX(-5px)}.tx-mk i{width:9px;height:11px;clip-path:polygon(0 0,100% 0,100% 70%,50% 100%,0 70%)}.tx-lane{position:relative;margin-top:5px;background:linear-gradient(90deg,transparent var(--x0),color-mix(in srgb,var(--cws-fg) 4%,transparent) var(--x0))}.tx-head{position:absolute;left:var(--hl);top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--cws-muted);z-index:1}.tx-head b{display:grid;place-items:center;min-width:24px;height:18px;padding:0 4px;border-radius:4px;background:var(--c);color:#fff;font:600 10px var(--cws-mono)}.tx-head .vu{display:flex;gap:2px;align-items:flex-end;height:14px;margin-left:2px}.tx-head .vu i{width:3px;height:14px;border-radius:1px;background:linear-gradient(#f5c54a,#4ade80 40%);transform-origin:bottom;transform:scaleY(.1);transition:transform .08s linear}@media(max-width:700px){.tx-head span{display:none}}.tx-clip{top:0;border-radius:6px;color:#fff;cursor:inherit;transition:filter .25s,box-shadow .25s,transform .22s cubic-bezier(.3,.7,.2,1);box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.08)}.tx-clip,.tx-clip .nm{position:absolute;bottom:0;overflow:hidden}.tx-clip .nm{left:0;right:0;height:14px;padding:0 6px;font:500 10.5px/14px var(--cws-sans);white-space:nowrap;text-overflow:ellipsis;background:rgba(0,0,0,.38)}.tx-clip.v{background:#3b5ea6}.tx-clip .strip{position:absolute;inset:0 0 14px 0;display:flex;overflow:hidden}.tx-clip .strip b{flex:none;width:64px;height:100%;border-right:1px solid rgba(0,0,0,.25)}.tx-clip .sp{position:absolute;top:4px;right:5px;padding:1px 6px;border-radius:999px;background:rgba(0,0,0,.6);font:600 10px var(--cws-mono)}.tx-clip.a{background:#1d5a3c}.tx-clip.a canvas{position:absolute;left:0;top:4px}.tx-clip .played{position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(140,255,190,.14);mix-blend-mode:screen;pointer-events:none}.tx-clip.t{background:#b8892b}.tx-clip.t .nm{background:none;top:0;height:auto;line-height:24px;font-weight:550}.tx-clip.b{background:#4a6fb8}.tx-clip .look{position:absolute;inset:0 0 14px 0;overflow:hidden}.tx-clip .look .sky,.tx-mon-b .sky{position:absolute;left:0;right:0;bottom:0;width:100%;height:46%}.tx-clip .lut{position:absolute;top:4px;right:5px;padding:0 5px;border-radius:4px;background:rgba(0,0,0,.55);font:600 9.5px/15px var(--cws-mono)}.tx-clip.m{background:#1a4d3b;overflow:visible}.tx-clip.m canvas{position:absolute;left:0;top:3px;border-radius:6px}.tx-clip.m .fade{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.tx-clip.m .fade path{fill:none;stroke:#fff;stroke-width:1.3;opacity:.8;vector-effect:non-scaling-stroke}.tx-clip.m .nm{background:none;bottom:auto;top:0;line-height:28px;color:hsla(0,0%,100%,.85)}.tx-clip.m .nm em{font-style:normal;opacity:.6;margin-left:6px;font-family:var(--cws-mono)}.tx-clip .fh{position:absolute;top:1px;width:8px;height:8px;border-radius:2px;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.4);transition:transform .2s}.tx-clip.m.fading .fh.r{transform:scale(1.35)}.tx-clip .eh{position:absolute;top:0;bottom:0;width:4px;background:#fff;opacity:0;transition:opacity .15s}.tx-clip .eh.l{left:0}.tx-clip .eh.r{right:0}.tx-clip.grip-r .eh.r,.tx.live .tx-clip:hover .eh{opacity:.95}.tx-clip.live{filter:brightness(1.14) saturate(1.1);box-shadow:inset 0 0 0 1.5px hsla(0,0%,100%,.55)}.tx.live .tx-clip:hover{filter:brightness(1.08)}.tx-clip.lift{transform:translateY(-4px);box-shadow:0 14px 26px -12px rgba(0,0,0,.6),inset 0 0 0 1.5px hsla(0,0%,100%,.7);z-index:3;transition:filter .25s,box-shadow .25s,transform .22s cubic-bezier(.3,.7,.2,1)}.tx-clip.flash{animation:tx-flash .7s ease-out}@keyframes tx-flash{0%{box-shadow:inset 0 0 0 2px #fff,0 0 0 0 rgba(245,197,74,.8)}to{box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.08),0 0 0 10px rgba(245,197,74,0)}}.tx-clip.born{animation:tx-born .5s cubic-bezier(.3,.7,.2,1)}@keyframes tx-born{0%{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0)}}.tx-blade,.tx-guide,.tx-ph,.tx-stem{position:absolute;left:0;pointer-events:none}.tx-ph{top:192px;bottom:26px;width:0;z-index:4}.tx-ph:before{content:"";top:0;bottom:0;left:-.75px;width:1.5px}.tx-ph i,.tx-ph:before{position:absolute;background:var(--cws-fg)}.tx-ph i{top:-2px;left:-6px;width:12px;height:12px;clip-path:polygon(0 0,100% 0,100% 55%,50% 100%,0 55%)}.tx-stem{top:164px;height:28px;width:0;border-left:1px dashed var(--cws-line2);z-index:1}.tx-guide{top:192px;bottom:26px;width:0;border-left:1.5px dashed #f5c54a;opacity:0;transition:opacity .15s;z-index:5}.tx-guide.on{opacity:1}.tx-blade{top:232px;bottom:26px;width:0;border-left:1.5px solid #ef4444;opacity:0;transition:opacity .2s;z-index:5}.tx-blade.on{opacity:1}.tx-mon{position:absolute;top:0;left:0;width:288px;height:162px;border-radius:12px;overflow:hidden;background:#000;box-shadow:0 22px 48px -22px rgba(0,0,0,.6),0 0 0 1px var(--cws-frame-edge);z-index:3;will-change:transform}.tx-mon>div{position:absolute;inset:0}.tx-mon-b{opacity:0;transition:opacity .35s}.tx-mon-b.on{opacity:1}.tx-mon-t{display:grid;place-items:center;padding:0 18px;text-align:center;font:650 19px/1.15 var(--cws-sans);letter-spacing:-.02em;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.55);opacity:0;transform:translateY(6px);transition:opacity .35s,transform .45s cubic-bezier(.3,.7,.2,1)}.tx-mon-t.on{opacity:1;transform:none}.tx-mon .tx-mon-c{inset:auto 10px 10px;text-align:center;font:600 12px/1.3 var(--cws-sans);color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.8)}.tx-mon .tx-mon-tc{inset:8px auto auto 9px;font:500 10px var(--cws-mono);color:hsla(0,0%,100%,.75)}.tx-cur{position:absolute;top:0;left:0;z-index:8;display:flex;align-items:flex-start;gap:2px;opacity:0;transition:opacity .3s;pointer-events:none}.tx-cur.on{opacity:1}.tx-cur span{margin-top:14px;padding:1px 7px;border-radius:999px;background:#111;color:#fff;font:600 10.5px/16px var(--cws-sans)}.tx-cur.blade:after,.tx-cur.ew:after,.tx-cur.grab:after{position:absolute;left:-10px;top:-14px;padding:0 5px;border-radius:5px;background:#111;color:#fff;font:600 11px/17px var(--cws-mono)}.tx-cur.blade:after{content:"✂"}.tx-cur.ew:after{content:"↔"}.tx-cur.grab:after{content:"✥"}.tx-tip{position:absolute;top:0;left:0;z-index:9;padding:3px 9px;border-radius:7px;background:var(--cws-fg);color:var(--cws-bg);font:550 11.5px/18px var(--cws-sans);white-space:nowrap;opacity:0;transition:opacity .2s;pointer-events:none}.tx-tip.on{opacity:1}.tx-menu{position:absolute;top:0;left:0;z-index:9;min-width:170px;padding:5px;border-radius:10px;background:var(--cws-surface);box-shadow:0 0 0 1px var(--cws-line),0 16px 34px -14px rgba(0,0,0,.45);font-size:12.5px;opacity:0;transform-origin:0 0;transition:opacity .16s;pointer-events:none}.tx-menu.on{opacity:1;animation:tx-pop .18s cubic-bezier(.3,.7,.2,1)}@keyframes tx-pop{0%{transform-origin:0 0;scale:.95}to{scale:1}}.tx-menu div{display:flex;justify-content:space-between;padding:6px 9px;border-radius:6px;color:var(--cws-fg2)}.tx-menu .hi{background:var(--cws-bg2);color:var(--cws-fg)}.tx-menu .hi span{font-family:var(--cws-mono);color:var(--cws-muted)}.tx-hint{margin:8px auto 0;text-align:center;font-size:13px;color:var(--cws-faint)}.tx-hint kbd{font:500 11px var(--cws-mono);padding:1px 6px;border-radius:5px;background:var(--cws-bg2);box-shadow:inset 0 0 0 1px var(--cws-line);color:var(--cws-fg2)}