.app{grid-template-columns:repeat(var(--grid-cols), minmax(0, 1fr));grid-template-rows:auto minmax(0, 1fr) var(--h-control) var(--h-control) auto;column-gap:var(--grid-gutter);row-gap:var(--gap-stack);height:100dvh;padding:var(--grid-margin);background:var(--c-bg);display:grid}.app>.nav{margin-bottom:calc(var(--gap-head) - var(--gap-stack) - var(--cap-lead));grid-area:1/1/auto/-1}.region-bin{min-height:0;padding-top:var(--cap-lead);flex-direction:column;grid-area:2/1/auto/span 6;display:flex;overflow:hidden}.region-viewer{background:var(--c-bg);border-radius:var(--radius);grid-area:2/7/auto/-1;min-height:0;position:relative;overflow:hidden}.region-bin,.region-viewer{margin-bottom:calc(var(--gap-col) - var(--gap-stack))}.region-viz{grid-area:3/1/5/span 6;align-items:stretch;min-height:0;display:flex;position:relative}.levels{width:100%;min-width:0;height:100%;position:relative}.levels canvas{position:absolute;inset:0}.region-timeline{grid-area:3/7/auto/-1;min-width:0}.region-transport{grid-area:4/7/auto/-1;min-width:0}.segbar{gap:var(--gap-ui);height:100%;display:flex}.seg{background:var(--c-divider);min-width:0;height:100%;color:var(--c-fg);border-radius:var(--radius);flex:1 1 0;justify-content:center;align-items:center;transition:background .1s;display:flex}.seg:hover{background:var(--c-hover)}.seg--dl{flex:0 0 var(--h-control)}.foot{grid-area:5/1/auto/-1;grid-template-columns:subgrid;column-gap:var(--grid-gutter);color:var(--c-divider);padding-block:var(--sp-xs);margin-top:calc(var(--gap-foot) - var(--gap-stack));align-items:center;display:grid}.foot__left{align-items:center;gap:var(--sp-l);white-space:nowrap;grid-column:1/span 6;display:flex}.foot__viewer{justify-content:space-between;align-items:center;gap:var(--gap-col);grid-column:7/-1;min-width:0;display:flex}.foot__mid,.foot__right{align-items:center;gap:var(--sp-l);min-width:0;display:flex}.loops{gap:var(--sp-s);display:flex}.loopbtn{aspect-ratio:1;border:var(--line-w) solid var(--c-hover);border-radius:var(--radius);height:1.7em;color:var(--c-hover);justify-content:center;align-items:center;transition:color .1s,background .1s,border-color .1s;display:inline-flex}.loopbtn:hover{color:var(--c-fg);border-color:var(--c-fg)}.loopbtn--active{background:var(--c-fg);border-color:var(--c-fg);color:var(--c-bg)}.loopbtn--pending{border-color:var(--c-fg);color:var(--c-fg)}.muting-cta{align-items:center;gap:var(--sp-s);color:var(--c-fg);animation:2.4s ease-in-out infinite muting-blink;display:inline-flex}.muting-cta:hover{animation:none}@keyframes muting-blink{0%,to{opacity:1}50%{opacity:.55}}.mute-ctrl{flex:none}.icon-btn{color:var(--c-fg);display:inline-flex}.icon-btn:hover{color:var(--c-hover)}.foot__clear{color:var(--c-fg);text-transform:var(--tt-main);transition:color .1s}.foot__clear:hover:not(:disabled){color:var(--c-white)}.foot__clear:disabled{color:var(--c-divider);cursor:default}.foot__pos,.foot__beats,.foot__dur{color:var(--c-divider);white-space:nowrap}.foot__pos,.foot__beats,.foot__dur,.foot__hint,.foot__undo{text-box-trim:trim-both;text-box-edge:cap alphabetic;leading-trim:both;text-edge:cap alphabetic}.foot__hint{color:var(--c-hover);white-space:nowrap;text-overflow:ellipsis;transition:color .15s;overflow:hidden}.foot__hint--flash{color:var(--c-white)}.foot__undo{color:var(--c-hover);text-transform:var(--tt-main);flex:none;transition:color .15s}.foot__undo--hot,.foot__undo:hover{color:var(--c-white)}.stage{position:absolute;inset:0}.stage__canvas,.stage__vid{object-fit:contain;object-position:left top;width:100%;height:100%;position:absolute;inset:0}.stage__canvas{z-index:0}.stage__vid{z-index:1;background:0 0;display:none}@media (width<=860px){:root{--fs-min:11px}.app{column-gap:0;row-gap:var(--gap-stack);padding:var(--sp-l);grid-template-rows:auto auto 44px 44px minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr)}.app>.nav,.region-viewer{margin-bottom:calc(var(--sp-l) - var(--gap-stack))}.region-bin{margin-top:calc(var(--sp-l) - var(--gap-stack));margin-bottom:0}.region-viewer{aspect-ratio:16/9;grid-area:2/1;min-height:0}.region-timeline{grid-area:3/1}.region-transport{grid-area:4/1}.region-bin{grid-area:5/1}.region-viz{display:none}.stage__vid,.stage__canvas{object-position:center}.foot{margin-top:calc(var(--sp-l) - var(--gap-stack));align-items:baseline;gap:var(--sp-m) var(--sp-l);flex-wrap:wrap;grid-area:6/1;display:flex}.foot__left{flex:100%;justify-content:space-between}.foot__viewer{gap:var(--sp-m) var(--sp-l);flex-wrap:wrap;flex:100%}.foot__right{flex:100%;justify-content:space-between}.foot__hint{min-width:0}.app--fullscreen .region-viewer{grid-area:2/1}}.app--fullscreen .region-bin,.app--fullscreen .region-viz,.app--fullscreen .region-transport,.app--fullscreen .region-timeline{display:none}.app--fullscreen .region-viewer{grid-area:2/1/5/-1}.app--fullscreen .foot__left,.app--fullscreen .foot__hint{display:none}.app--fullscreen .stage__vid,.app--fullscreen .stage__canvas{object-position:center}.app--fullscreen .foot__viewer{grid-column:1/-1}.bin{gap:var(--sp-l);scrollbar-width:none;flex-direction:column;flex:auto;align-items:stretch;min-height:0;display:flex;overflow:hidden auto}.bin::-webkit-scrollbar{display:none}.bin--enter .cliprow{animation:row-deal var(--dur-spring) var(--ease-spring) backwards;animation-delay:calc(var(--i,0) * 22ms)}@keyframes row-deal{0%{opacity:0;transform:translateY(-5px)}}.cliprow{transition:padding-bottom var(--dur-reveal) var(--ease-slide);flex-direction:column;flex:none;gap:0;display:flex}.cliprow--open{padding-bottom:0}.cliprow__head{align-items:flex-start;gap:var(--sp-m);color:var(--c-fg);cursor:pointer;display:flex}.cliprow__name{flex:0 auto;min-width:0;transition:color .1s}.cliprow__pm,.cliprow__info,.cliprow__credit{color:var(--brand);visibility:hidden;flex:none}.cliprow__info,.cliprow__credit{margin-left:auto}.cliprow__info{text-underline-offset:.25em;text-decoration:underline}.cliprow__head:hover .cliprow__pm,.cliprow__head:hover .cliprow__info,.cliprow__head:hover .cliprow__credit{visibility:visible}.cliprow__info:hover{color:var(--c-white)}.cliprow__credit{cursor:default}.pill__label{margin-block:-.15em;padding-block:.15em}.cliprow__head{transition:opacity .1s}.cliprow--used .cliprow__head{opacity:.3}.cliprow--used .cliprow__head:hover,.cliprow--used.cliprow--onair .cliprow__head,.cliprow--used.cliprow--paired .cliprow__head,.cliprow--used.cliprow--removing .cliprow__head{opacity:1}.cliprow__head:hover .cliprow__name,.cliprow--paired .cliprow__name,.cliprow--removing .cliprow__name,.cliprow--onair .cliprow__name{color:var(--brand)}.cliprow__x{width:var(--row-h);height:var(--row-h);color:var(--brand);flex:none;display:inline-flex}.cliprow__x svg{width:100%;height:100%}.pill{height:var(--row-h);padding:0 var(--pad-pill-x);border-radius:var(--radius);white-space:nowrap;animation:pill-in var(--dur-pop) var(--ease-spring) backwards;flex:none;justify-content:center;align-items:center;transition:color .1s,background .1s,border-color .1s,filter .1s;display:inline-flex}.pill--add,.pill--remove{animation-delay:calc(var(--dur-pop) / 3)}@keyframes pill-in{0%{opacity:0;transform:translateY(-2px)scale(.96)}}.pill--info{border:var(--line-w) solid var(--c-fg);color:var(--c-fg)}.pill--info:hover{border-color:var(--c-white);color:var(--c-white)}.pill--add{background:var(--brand);color:var(--on-brand)}.pill--add:hover{filter:brightness(1.1)}.pill--remove{border:var(--line-w) solid var(--brand);color:var(--brand)}.pill--remove:hover{filter:brightness(1.15)}.cliprow__reveal{transition:grid-template-rows var(--dur-reveal) var(--ease-slide), padding-top var(--dur-reveal) var(--ease-slide);grid-template-rows:0fr;padding-top:0;display:grid;overflow:hidden}.cliprow--open .cliprow__reveal{padding-top:var(--sp-l);grid-template-rows:1fr}.cliprow__inner{min-height:0}.cliprow__controls{gap:var(--gap-nav);padding-top:var(--sp-s);color:var(--c-hover);align-items:center;display:flex}.cliprow__act{font:inherit;letter-spacing:inherit;text-transform:inherit;color:var(--c-hover);cursor:pointer;background:0 0;border:0;padding:0}.cliprow__act:hover{color:var(--c-fg)}.cliprow__act--remove:hover{color:var(--c-white)}.cliprow__thumb{aspect-ratio:16/9;border-radius:var(--radius);background:var(--c-charcoal);cursor:grab;width:100%;min-height:0;position:relative;overflow:hidden}.cliprow--used .cliprow__thumb{cursor:default}.cliprow__vid{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.cliprow--land .cliprow__name{animation:.4s row-land}.cliprow--land .pill--action{animation:.4s row-land-dot}@keyframes row-land{0%,35%{color:var(--brand)}}@keyframes row-land-dot{0%,35%{background:var(--brand);border-color:var(--brand)}}.pill--action{min-width:var(--row-h);height:var(--row-h);border-radius:var(--radius);pointer-events:none;background:var(--c-fg);border:var(--line-w) solid var(--c-fg);color:var(--on-brand);transition:grid-template-columns var(--dur-reveal) var(--ease-slide), padding var(--dur-reveal) var(--ease-slide), background .12s, border-color .12s, color .12s;flex:none;grid-template-columns:0fr;align-items:center;padding:0;display:grid}.pill__label{white-space:nowrap;opacity:0;min-width:0;transition:opacity var(--dur-pop);overflow:hidden}.cliprow--used .pill--action{background:0 0}.cliprow__head:hover .pill--action,.cliprow--paired .pill--action{background:var(--brand);border-color:var(--brand)}.cliprow--used .cliprow__head:hover .pill--action,.cliprow--used.cliprow--paired .pill--action{background:0 0}.cliprow--onair .pill--action{border-color:var(--brand);background:0 0}.cliprow--open .pill--action{padding:0 var(--pad-pill-x);pointer-events:auto;grid-template-columns:1fr}.cliprow--open .pill__label{opacity:1;transition-delay:calc(var(--dur-reveal) * .35)}.cliprow--open .pill--add{background:var(--brand);border-color:var(--brand);color:var(--on-brand)}.cliprow--open .pill--remove{border-color:var(--brand);color:var(--brand);background:0 0}.stage__hit{z-index:2;cursor:pointer;background:0 0;position:absolute;inset:0}.region-viewer{container-type:size}.stage__fs{right:calc(100cqw - min(100cqw, 100cqh * 16 / 9) + var(--grid-margin));bottom:calc(100cqh - min(100cqh, 100cqw * 9 / 16) + var(--grid-margin));z-index:3;color:var(--c-fg);opacity:0;transition:opacity var(--dur-pop) ease, color .1s;pointer-events:none;display:flex;position:absolute}.stage__fs:hover{color:var(--c-white)}.region-viewer:hover .stage__fs,.stage__fs:focus-visible{opacity:1;pointer-events:auto}.app--fullscreen .stage__fs{right:var(--grid-margin);bottom:var(--grid-margin)}@media (prefers-reduced-motion:reduce){.stage__fs{transition:none}}.timeline{user-select:none;width:100%;height:100%;position:relative}.timeline__clips{gap:var(--gap-ui);height:100%;display:flex}.brick{border-radius:var(--radius);cursor:grab;min-width:0;height:100%;transition:flex-grow var(--dur-spring) var(--ease-spring);background:var(--c-divider);flex:0 1 0;justify-content:center;align-items:center;display:flex;position:relative}.brick:not(.brick--bump):not(.brick--gap):hover,.brick--linked:not(.brick--bump),.brick--live:not(.brick--bump){background:var(--brick-colour,var(--c-divider))}.brick--bump{cursor:default}.brick--bump.brick--live,.brick--bump:hover,.brick--bump:hover+.brick--bump,.brick--bump:has(+.brick--bump:hover),.brick--bump.brick--live+.brick--bump,.brick--bump:has(+.brick--bump.brick--live){background:var(--c-fg)}.brick--bump+.brick--bump{margin-left:calc(-1 * var(--gap-ui));border-top-left-radius:0;border-bottom-left-radius:0}.brick--bump:has(+.brick--bump){border-top-right-radius:0;border-bottom-right-radius:0}.brick--dragging{cursor:grabbing}.brick--gap{pointer-events:none;border-radius:var(--radius);background:var(--c-bg)!important}.brick__handle{gap:var(--sp-xxs);pointer-events:none;display:none}.brick:not(.brick--bump):not(.brick--dragging):hover .brick__handle{display:flex}.brick__handle i{background:var(--brick-ink,var(--c-bg));opacity:.75;width:2px;height:.9em}.brick:hover .brick__handle i,.brick--linked .brick__handle i,.brick--live .brick__handle i{background:var(--brick-ink-lit,var(--brick-ink))}.timeline__clips--deal .brick:not(.brick--gap){animation:brick-deal .4s var(--ease-spring) backwards}@keyframes brick-deal{0%{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:translateY(0)}}.timeline__playhead{width:var(--playhead-size);height:var(--playhead-size);margin-left:calc(var(--playhead-size) / -2);margin-top:calc(var(--playhead-size) / -2);background:var(--c-fg);z-index:3;cursor:ew-resize;will-change:left;opacity:1;transition:opacity .12s;position:absolute;top:50%;left:0}.timeline__playhead--parked{opacity:0;pointer-events:none}.timeline__playhead:before{content:"";position:absolute;inset:-6px -11px}.timeline:hover .timeline__playhead{background:var(--c-white)}.timeline .timeline__playhead--on-bump,.timeline:hover .timeline__playhead--on-bump{background:var(--c-bg)}
