@layer components{.atd-root{color:var(--muted-foreground)}.atd-root[data-drag-over=true]{color:var(--brand)}}.atd-root{overflow:visible}.atd-lanes{opacity:.3}.atd-fix{opacity:0}.atd-raw,.atd-fix,.atd-stairs,.atd-arrow{transition:opacity .2s cubic-bezier(.32,.72,0,1),color .2s cubic-bezier(.32,.72,0,1)}.atd-w1,.atd-w2,.atd-w3{transform-box:view-box}.atd-w1{transform-origin:0 29px}.atd-w2{transform-origin:0 19px}.atd-w3{transform-origin:0 29px}.atd-ga,.atd-gd,.atd-arrow{transform-box:fill-box;transform-origin:50%}:is(.atd-root:hover,:is([data-autotune-motion-trigger]:hover,[data-autotune-motion-trigger]:focus-visible,[data-autotune-motion-trigger]:has(:focus-visible)) .atd-root):not([data-drag-over=true]) :is(.atd-stairs,.atd-fix,.atd-arrow){color:var(--foreground)}:is(.atd-root:hover,:is([data-autotune-motion-trigger]:hover,[data-autotune-motion-trigger]:focus-visible,[data-autotune-motion-trigger]:has(:focus-visible)) .atd-root):not([data-drag-over=true]) .atd-raw{animation:.9s cubic-bezier(.32,.72,0,1) atd-raw}:is(.atd-root:hover,:is([data-autotune-motion-trigger]:hover,[data-autotune-motion-trigger]:focus-visible,[data-autotune-motion-trigger]:has(:focus-visible)) .atd-root):not([data-drag-over=true]) :is(.atd-w1,.atd-w2,.atd-w3){animation:.9s cubic-bezier(.32,.72,0,1) atd-wobble}:is(.atd-root:hover,:is([data-autotune-motion-trigger]:hover,[data-autotune-motion-trigger]:focus-visible,[data-autotune-motion-trigger]:has(:focus-visible)) .atd-root):not([data-drag-over=true]) .atd-ga{animation:.9s cubic-bezier(.32,.72,0,1) atd-glide-up}:is(.atd-root:hover,:is([data-autotune-motion-trigger]:hover,[data-autotune-motion-trigger]:focus-visible,[data-autotune-motion-trigger]:has(:focus-visible)) .atd-root):not([data-drag-over=true]) .atd-gd{animation:.9s cubic-bezier(.32,.72,0,1) atd-glide-down}:is(.atd-root:hover,:is([data-autotune-motion-trigger]:hover,[data-autotune-motion-trigger]:focus-visible,[data-autotune-motion-trigger]:has(:focus-visible)) .atd-root):not([data-drag-over=true]) .atd-fix{animation:.9s cubic-bezier(.32,.72,0,1) atd-fix}:is(.atd-root:hover,:is([data-autotune-motion-trigger]:hover,[data-autotune-motion-trigger]:focus-visible,[data-autotune-motion-trigger]:has(:focus-visible)) .atd-root):not([data-drag-over=true]) .atd-arrow{animation:.9s cubic-bezier(.34,1.56,.64,1) atd-arrow}@keyframes atd-raw{0%,26%{opacity:1}48%,70%{opacity:0}to{opacity:1}}@keyframes atd-wobble{0%,12%{transform:scaleY(1)}48%,70%{transform:scaleY(.12)}to{transform:scaleY(1)}}@keyframes atd-glide-up{0%,12%{transform:skew(0)}48%,70%{transform:skew(26.57deg)}to{transform:skew(0)}}@keyframes atd-glide-down{0%,12%{transform:skew(0)}48%,70%{transform:skew(-26.57deg)}to{transform:skew(0)}}@keyframes atd-fix{0%,22%{opacity:0}48%,70%{opacity:1}to{opacity:0}}@keyframes atd-arrow{0%,44%{transform:translateY(0)}66%{transform:translateY(-2.5px)}to{transform:translateY(0)}}.atd-root[data-drag-over=true] .atd-lanes{opacity:.45}.atd-root[data-drag-over=true] .atd-raw{opacity:0}.atd-root[data-drag-over=true] .atd-fix{opacity:1}.atd-root[data-drag-over=true] .atd-arrow{animation:1.1s cubic-bezier(.37,0,.63,1) infinite alternate atd-arrow-float}@keyframes atd-arrow-float{0%{transform:translateY(0)}to{transform:translateY(-2.5px)}}@media (prefers-reduced-motion:reduce){.atd-root :is(.atd-raw,.atd-w1,.atd-w2,.atd-w3,.atd-ga,.atd-gd,.atd-fix,.atd-arrow){animation:none!important}}
.autotune-dropzone:before{content:"";pointer-events:none;background-image:repeating-linear-gradient(to bottom, transparent 0, transparent 15px, color-mix(in srgb, var(--foreground) 6%, transparent) 15px, color-mix(in srgb, var(--foreground) 6%, transparent) 16px);transition:opacity .2s var(--ease-standard);background-position:0 8px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(70% 80% at 50% 45%,#000 20%,#0000 80%);mask-image:radial-gradient(70% 80% at 50% 45%,#000 20%,#0000 80%)}.autotune-dropzone[data-drag-over]:before{opacity:.4}.autotune-dropzone>:not(input){position:relative}