@font-face{font-family:Brockmann;src:url(../fonts/brockmann-medium-webfont.woff2)format("woff2");font-weight:400;font-style:normal}html,body{overscroll-behavior-y:contain}html{background:var(--bg-color);color:#fff;font-family:Brockmann,sans-serif;font-size:16px}@media screen and (width<=1023px){html{font-size:12px}}html{scrollbar-width:thin}::-webkit-scrollbar{width:9px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background-color:#9b9b9b80;border:#0000}::selection{color:var(--darkgrey);background-color:#fff}@media screen and (width<=1023px){::selection{font-size:12px}}@media screen and (width<=580px){::selection{font-size:10px}}body{margin:0}a:link,a:visited,a:active{color:inherit}h1,h2,h3{text-transform:uppercase;letter-spacing:.05em;font-weight:400}h1{width:380px;text-shadow:0px 0px 15px var(--bg-color), 0px 0px 15px var(--bg-color);z-index:1;pointer-events:none;margin:0;font-size:3.5rem;position:fixed;bottom:2rem;left:4rem}@media screen and (width<=580px){h1{font-size:3rem;left:2.5rem}}hr{background:#fff;width:1rem;height:3px;margin:2rem 0}input[type=text],input[type=number]{color:inherit;box-shadow:none;background:0 0;border:none;outline:none;padding:.5em;font-family:inherit}select,option{color:inherit;background:var(--bg-color);font-family:inherit}select{border:1px solid #000;width:100%;padding:.5rem}.btn{color:inherit;cursor:pointer;vertical-align:middle;font-family:inherit;font-size:inherit;background:0 0;border:none;padding-left:0;padding-right:0}.btn.has-active:not(.active){opacity:var(--opacity-inactive)}.btn.has-active:hover:not(.active){opacity:var(--opacity-interacted)}.btn.has-hover,.param-title>.btn:not(.raw):last-child,.param-title>.btns .btn{opacity:var(--opacity-inactive)}.btn.has-hover:hover,.param-title>.btn:hover:not(.raw):last-child,.param-title>.btns .btn:hover{opacity:var(--opacity-interacted)}.btn.has-hover:active,.param-title>.btn:active:not(.raw):last-child,.param-title>.btns .btn:active{opacity:var(--opacity-active)}.btn.btn-sm,.param-title>.btn:not(.raw):last-child,.param-title>.btns .btn{font-size:.825em}.btn.btn-xl{font-size:1.75em}.btn:disabled{opacity:var(--opacity-disabled);pointer-events:none}@media screen and (width<=767px){.btn{margin-left:0}}.btn svg{display:block}.slider-target,.slider-target *{-webkit-touch-callout:none;-webkit-tap-highlight-color:#0000;box-sizing:border-box;touch-action:none;-webkit-user-select:none;user-select:none}.slider-target{position:relative}.slider-base,.slider-connects{z-index:1;width:100%;height:100%;position:relative}.slider-connects{z-index:0;overflow:hidden}.slider-connect,.slider-origin{transform-origin:0 0;height:100%;-webkit-transform-style:preserve-3d;transform-style:flat;will-change:transform;z-index:1;width:100%;position:absolute;top:0;right:0}.slider-txt-dir-rtl.slider-horizontal .slider-origin{left:0;right:auto}.slider-vertical .slider-origin{width:0;top:-100%}.slider-horizontal .slider-origin{height:0}.slider-handle{backface-visibility:hidden;position:absolute}.slider-touch-area{width:100%;height:100%}.slider-state-tap .slider-connect,.slider-state-tap .slider-origin{transition:transform .3s}.slider-state-drag *{cursor:inherit!important}.slider-tooltip-drag .slider-tooltip,.slider-tooltip-focus .slider-tooltip{display:none!important}.slider-tooltip-drag .slider-active .slider-tooltip,.slider-tooltip-drag.slider-state-drag .slider-tooltip:not(.slider-tooltip-hidden),.slider-tooltip-focus.slider-focused .slider-tooltip:not(.slider-tooltip-hidden){display:block!important}.slider-horizontal{height:var(--slider-height,6px)}.slider-horizontal .slider-handle{height:var(--slider-handle-height,16px);right:calc(var(--slider-handle-width,16px) / 2 * -1);top:calc((var(--slider-handle-height,16px) - var(--slider-height,6px)) / 2 * -1 - 1px);width:var(--slider-handle-width,16px)}.slider-vertical{height:var(--slider-vertical-height,300px);width:var(--slider-height,6px)}.slider-vertical .slider-handle{bottom:calc(var(--slider-handle-width,16px) / 2 * -1);height:var(--slider-handle-width,16px);right:calc((var(--slider-handle-height,16px) - var(--slider-height,6px)) / 2 * -1 - 1px);width:var(--slider-handle-height,16px)}.slider-txt-dir-rtl.slider-horizontal .slider-handle{left:calc(var(--slider-handle-width,16px) / 2 * -1);right:auto}.slider-base{background-color:var(--slider-bg,#d1d5db)}.slider-base,.slider-connects{border-radius:var(--slider-radius,9999px)}.slider-connect{background:var(--slider-connect-bg,#10b981);cursor:pointer}.slider-draggable{cursor:ew-resize}.slider-vertical .slider-draggable{cursor:ns-resize}.slider-handle{background:var(--slider-handle-bg,#fff);border:var(--slider-handle-border,0);border-radius:var(--slider-handle-radius,9999px);box-shadow:var(--slider-handle-shadow,.5px .5px 2px 1px #00000052);cursor:-webkit-grab;cursor:grab;height:var(--slider-handle-height,16px);width:var(--slider-handle-width,16px)}.slider-handle:focus{box-shadow:0 0 0 var(--slider-handle-ring-width,3px) var(--slider-handle-ring-color,#10b98130), var(--slider-handle-shadow,.5px .5px 2px 1px #00000052);outline:none}.slider-active{box-shadow:var(--slider-handle-shadow-active,.5px .5px 2px 1px #0000006b);cursor:-webkit-grabbing;cursor:grabbing}[disabled] .slider-connect{background:var(--slider-connect-bg-disabled,#9ca3af)}[disabled] .slider-handle,[disabled].slider-handle,[disabled].slider-target{cursor:not-allowed}[disabled] .slider-tooltip{background:var(--slider-tooltip-bg-disabled,#9ca3af);border-color:var(--slider-tooltip-bg-disabled,#9ca3af)}.slider-tooltip{background:var(--slider-tooltip-bg,#10b981);border:1px solid var(--slider-tooltip-bg,#10b981);border-radius:var(--slider-tooltip-radius,5px);color:var(--slider-tooltip-color,#fff);font-size:var(--slider-tooltip-font-size,.875rem);font-weight:var(--slider-tooltip-font-weight,600);line-height:var(--slider-tooltip-line-height,1.25rem);min-width:var(--slider-tooltip-min-width,20px);padding:var(--slider-tooltip-py,2px) var(--slider-tooltip-px,6px);text-align:center;white-space:nowrap;display:block;position:absolute}.slider-horizontal .slider-tooltip-top{bottom:calc(var(--slider-handle-height,16px) + var(--slider-tooltip-arrow-size,5px) + var(--slider-tooltip-distance,3px));left:50%;transform:translate(-50%)}.slider-horizontal .slider-tooltip-top:before{border:var(--slider-tooltip-arrow-size,5px) solid transparent;border-top-color:inherit;bottom:calc(var(--slider-tooltip-arrow-size,5px) * -2);content:"";width:0;height:0;position:absolute;left:50%;transform:translate(-50%)}.slider-horizontal .slider-tooltip-bottom{left:50%;top:calc(var(--slider-handle-height,16px) + var(--slider-tooltip-arrow-size,5px) + var(--slider-tooltip-distance,3px));transform:translate(-50%)}.slider-horizontal .slider-tooltip-bottom:before{border:var(--slider-tooltip-arrow-size,5px) solid transparent;border-bottom-color:inherit;content:"";height:0;left:50%;top:calc(var(--slider-tooltip-arrow-size,5px) * -2);width:0;position:absolute;transform:translate(-50%)}.slider-vertical .slider-tooltip-left{right:calc(var(--slider-handle-height,16px) + var(--slider-tooltip-arrow-size,5px) + var(--slider-tooltip-distance,3px));top:50%;transform:translateY(-50%)}.slider-vertical .slider-tooltip-left:before{border:var(--slider-tooltip-arrow-size,5px) solid transparent;border-left-color:inherit;content:"";height:0;right:calc(var(--slider-tooltip-arrow-size,5px) * -2);width:0;position:absolute;top:50%;transform:translateY(-50%)}.slider-vertical .slider-tooltip-right{left:calc(var(--slider-handle-height,16px) + var(--slider-tooltip-arrow-size,5px) + var(--slider-tooltip-distance,3px));top:50%;transform:translateY(-50%)}.slider-vertical .slider-tooltip-right:before{border:var(--slider-tooltip-arrow-size,5px) solid transparent;border-right-color:inherit;content:"";height:0;left:calc(var(--slider-tooltip-arrow-size,5px) * -2);width:0;position:absolute;top:50%;transform:translateY(-50%)}.slider-horizontal .slider-origin>.slider-tooltip{left:auto;transform:translate(50%)}.slider-horizontal .slider-origin>.slider-tooltip-top{bottom:calc(var(--slider-tooltip-arrow-size,5px) + (var(--slider-handle-height,16px) - var(--slider-height,6px)) / 2 + var(--slider-tooltip-distance,3px) + 1px)}.slider-horizontal .slider-origin>.slider-tooltip-bottom{top:calc(var(--slider-tooltip-arrow-size,5px) + (var(--slider-handle-height,16px) - var(--slider-height,6px)) / 2 + var(--slider-tooltip-distance,3px) + var(--slider-height,6px) - 1px)}.slider-vertical .slider-origin>.slider-tooltip{transform:translateY(calc((var(--slider-tooltip-line-height,1.25rem) - var(--slider-tooltip-py,2px)) * -1 + 1px));top:auto}.slider-vertical .slider-origin>.slider-tooltip-left{right:calc(var(--slider-tooltip-arrow-size,5px) + var(--slider-height,6px) + (var(--slider-handle-height,16px) - var(--slider-height,6px)) / 2 + var(--slider-tooltip-distance,3px) - 1px)}.slider-vertical .slider-origin>.slider-tooltip-right{left:calc(var(--slider-tooltip-arrow-size,5px) + var(--slider-height,6px) + (var(--slider-handle-height,16px) - var(--slider-height,6px)) / 2 + var(--slider-tooltip-distance,3px) - var(--slider-height,6px) + 1px)}#ui{--slider-bg:var(--darkgrey);--slider-handle-bg:var(--bg-color);--slider-handle-radius:50%;--slider-handle-width:1.125rem;--slider-handle-height:1.125rem;--slider-handle-ring-width:1px;--slider-handle-ring-color:white;--slider-handle-border:2px solid white;--param-margin:1.5rem}.section-params{padding:calc(var(--param-margin) * .75) 0}.section-params:not(:first-child){border-top:var(--section-border)}.param-title:not(:last-child){margin-bottom:.75rem}.param-title{letter-spacing:.05em;display:flex}.param-title>.btn:not(.raw):last-child,.param-title>.btns{margin-left:auto}.param-title>.btns .btn{margin-left:.5rem}.sliders-horizontal>.param-slider{flex-direction:column;display:flex}.sliders-horizontal>.param-slider+.param-slider{margin-top:var(--param-margin)}.sliders-horizontal>.param-slider .slider-horizontal{--slider-height:.7rem;margin:.325rem 0}.sliders-vertical{--slider-height:.7rem;touch-action:none;width:100%;height:15rem;margin-top:var(--param-margin);justify-content:space-between;padding-top:.25rem;display:flex;position:relative}.sliders-vertical .param-slider{flex-direction:column;align-items:center;padding-bottom:2rem;display:flex}.sliders-vertical .slider-value{margin-top:.5rem;position:absolute;bottom:0}.sliders-vertical .slider-handle{right:calc((var(--slider-handle-height,16px) - var(--slider-height,6px)) / 2 * -1)}.sliders-vertical .slider-connects{border:1px solid var(--bg-color)}.reset-ul{padding-left:0;list-style:none}.fullscreen-svg{width:100%;height:100%;position:fixed;top:0;left:0}@media (orientation:portrait){.fullscreen-svg{height:118%;top:-18%}}.hidden{visibility:hidden}.flex{display:flex}.ml-auto{margin-left:auto}.ml-0{margin-left:0}.mr-0{margin-right:0}.ml-1{margin-left:.25rem}.mr-1{margin-right:.25rem}@media (orientation:landscape){.humans-svg{z-index:999}}.humans-svg{pointer-events:none}.humans-svg .human{pointer-events:all}.debug{box-sizing:border-box;pointer-events:none;width:100%;max-width:400px;height:100%;padding:2rem 2rem 16rem 4rem;overflow-y:auto}@media screen and (width<=1023px){.debug{display:none}}.text-sm{font-size:.825rem}.text-shy{opacity:var(--opacity-inactive)}.text-body{letter-spacing:.05em;max-width:52em;line-height:1.625}.text-body>:first-child,.text-body :is(h2,h3)+p{margin-top:0}.text-body>:last-child{margin-bottom:0}.text-body h2,.text-body h3{margin-top:3rem;margin-bottom:.5rem}.text-body a:link,.text-body a:visited,.text-body a:active,.colophon a:link,.colophon a:visited,.colophon a:active{-webkit-text-decoration-color:var(--link-underline-color);text-decoration-color:var(--link-underline-color);text-underline-offset:.225em;text-decoration-thickness:2px}.text-body a:hover,.colophon a:hover{text-decoration-color:currentColor}.link{text-decoration:underline;-webkit-text-decoration-color:var(--link-underline-color);text-decoration-color:var(--link-underline-color);text-underline-offset:.225em;text-decoration-thickness:2px}.link:hover{text-decoration-color:currentColor}.arc-bg{cursor:ns-resize;touch-action:none;-webkit-user-select:none;user-select:none;stroke:#000;fill:none;stroke-width:10px;opacity:.5}.arc-fg{stroke:#fff;stroke-width:10px;fill:none;pointer-events:none}.svg-text-slider-group{transform:translate(-26px,3px)}.svg-text-slider-group .arrow{fill:#fff;stroke-width:3px;opacity:.8;transform-origin:10px 6px}.svg-text-slider-group .arrow.up{transform:translate(-18.5px,-28px)rotate(180deg)scale(.4)}.svg-text-slider-group .arrow.down{transform:translate(-18.5px,12px)scale(.4)}.svg-text-slider-group .text{fill:#fff;text-anchor:end;-webkit-user-select:none;user-select:none;cursor:ns-resize;font-family:inherit;font-size:28px}.human{touch-action:none}.human .modifier:not(.active){display:none}.human:hover .modifier{display:block}.human .human-circle{cursor:grab;touch-action:none;fill:#000;stroke:#fff;stroke-width:3px;-webkit-user-select:none;user-select:none}.human .human-circle.pulse{animation-name:pulse;animation-duration:.4s;animation-iteration-count:1;animation-play-state:running}.human .modifier{touch-action:none}.human .arc{transform:translate(4px)}@keyframes pulse{3%{fill:#fff;transform:scale(1.5)}to{transform:scale(1)}}.tranche{fill:url(#trancheGradient);stroke:#141414;stroke-width:8px}.tranche.active{fill:#fff!important}.btn-status{align-items:baseline;width:100%;transition:all .25s;display:flex}.btn-status:after{content:"";background:var(--bg-color);border:1px solid #fff;border-radius:50%;width:.5em;height:.5em;margin-left:auto}.btn-status.active:after{background:#fff}.input-number{line-height:1;display:flex}.input-number input[type=number]{-moz-appearance:textfield;text-align:right;flex-grow:1;width:2em;margin:0;padding:0 .4rem 0 0;font-size:1em}.input-number input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.input-number input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}.input-number .btns{flex-direction:column;display:flex}.input-number .plus,.input-number .minus{height:50%;padding:0 2px;line-height:0;font-size:1em!important}.midi .devices-list{font-size:.75rem}.midi .channel-select{width:min-content;margin-left:auto}.midi .note-container{justify-content:space-between;display:flex}.midi .note-container:not(last){margin-bottom:.25rem}.color-circle{border:1px solid #000;border-radius:50%;flex-grow:0;flex-shrink:0;width:20px;height:20px}.prompt{z-index:99999;box-sizing:border-box;justify-content:center;align-items:center;width:100%;height:100%;padding:2rem;display:flex;position:fixed;top:0;left:0}@media (orientation:portrait){.prompt{padding:0}}.prompt .btn-close{position:absolute;top:1.25rem;right:1.25rem;transform:translate(50%,-50%)}.prompt-mask{background:var(--modal-bg);width:100%;height:100%;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);position:absolute;top:0;left:0}.prompt-content{border:var(--modal-border);background:var(--bg-color);box-sizing:border-box;scrollbar-width:thin;max-height:90vh;padding:2rem;position:relative;overflow:auto}@media (orientation:portrait){.prompt-content{max-height:100%}}.v-enter-active,.v-leave-active{transition-duration:1s}.v-enter-active .prompt-content,.v-leave-active .prompt-content{transition:opacity .6s}.v-enter-active .prompt-mask,.v-leave-active .prompt-mask{pointer-events:none;transition:-webkit-backdrop-filter 1s,backdrop-filter 1s,background 1s}.v-leave-active{pointer-events:none}.v-enter-from .prompt-content,.v-leave-to .prompt-content{opacity:0}.v-enter-from .prompt-mask,.v-leave-to .prompt-mask{-webkit-backdrop-filter:blur();backdrop-filter:blur();background:0 0}.btn[data-v-9ecd7046]{padding-left:0;padding-right:0}.name-input[data-v-856bb3c4]{position:sticky;top:0}.name-input input[data-v-856bb3c4]{background:var(--bg-color);border:1px solid #000;width:100%;padding-right:2rem;display:block}.name-input input[data-v-856bb3c4]:focus{border-color:var(--darkgrey)}.name-input input:not(:focus)+.btn[data-v-856bb3c4]{opacity:var(--opacity-disabled);cursor:default}.name-input .btn[data-v-856bb3c4]{fill:#fff;position:absolute;top:50%;right:0;transform:translateY(-50%)}.name-input[data-v-856bb3c4] svg{width:1.5rem;fill:inherit}.saves-list[data-v-856bb3c4]{margin-top:0;margin-bottom:0}.save-item[data-v-856bb3c4]{word-break:break-word;background:var(--bg-color);border-bottom:1px solid #000;align-items:center;padding:.25rem .125rem}.save-item.selected[data-v-856bb3c4]{background-color:#282828}.save-item .btn-track[data-v-856bb3c4]{text-align:left;flex-grow:1}.save-item .btn-delete[data-v-856bb3c4]{font-size:2em;line-height:1.5rem}.save-item .btn-save[data-v-856bb3c4]{margin-right:.4rem;line-height:1.5rem}.save-item .btn-save.invisible[data-v-856bb3c4]{visibility:hidden}.save-item .btn-save[data-v-856bb3c4] svg{fill:currentColor;width:1.0625rem}.saves-list:not(.trackChanged) .save-item.selected .btn-save[data-v-856bb3c4]{pointer-events:none;opacity:var(--opacity-disabled)}.save-item-btns[data-v-856bb3c4]{flex-direction:row-reverse;margin-left:auto;display:flex}.colophon{transform-origin:0 100%;text-underline-offset:.35em;letter-spacing:.05em;width:100vh;position:fixed;bottom:1.5rem;left:2.5rem;transform:rotate(-90deg)}@media screen and (width<=580px){.colophon{font-size:.7rem;bottom:2.75rem;left:1.325rem}}.switch-container{cursor:pointer}.switch-input{display:none}.switch-input:not(:checked)+.switch-label{opacity:var(--opacity-inactive)}.switch-input:not(:checked)+.switch-label:hover{opacity:var(--opacity-interacted)}.tabs[data-v-2864f52d]{border-top:var(--section-border);padding-top:1rem}.controls[data-v-2864f52d]{text-align:center;border-top:var(--section-border);margin-top:1rem;padding-top:1rem}.controls .btn[data-v-2864f52d]:not(:first-of-type){margin-left:.5rem}.controls .btn[data-v-2864f52d]:not(:last-of-type){margin-right:.5rem}.tab[data-v-90547566]:not(.active){display:none}.get-started{width:25rem;max-width:100%;height:unset;padding:0;left:1rem}@media (orientation:landscape){.get-started{top:1rem;left:1rem}}@media (orientation:portrait){.get-started{top:unset;padding-right:1rem;bottom:0;left:0}}.get-started img{width:auto;height:3.5rem;margin:1rem auto;display:block}.get-started-content{background:var(--modal-bg);width:100%;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}:root{--darkgrey:#3c3c3c;--midgrey:#5a5a5a;--bg-color:#141414;--bg-color-transparent:#141414cc;--link-underline-color:var(--darkgrey);--opacity-disabled:.15;--opacity-inactive:.5;--opacity-interacted:.75;--opacity-active:1;--modal-border:1px solid white;--modal-bg:var(--bg-color-transparent);--blur:blur(20px);--section-border:1px solid var(--darkgrey)}.ui-content{width:16rem;max-width:100%;padding:calc(3rem - var(--param-margin)) 3rem calc(3rem - var(--param-margin)) 1rem;box-sizing:border-box;flex-direction:column;display:flex;position:absolute;top:0;right:0}@media (orientation:portrait){.ui-content{z-index:9;scrollbar-width:thin;background:#141414e6;width:17rem;height:100%;padding-right:5rem;transition:all .25s;position:fixed;overflow-y:auto}#ui:not(.open)>.ui-content{transform:translate(100%)}}#ui .btn-play-container{z-index:10;width:min-content;position:fixed}@media (orientation:landscape){#ui .btn-play-container{top:3rem;right:18rem}}@media (orientation:portrait){#ui .btn-play-container{bottom:5.5rem;right:1rem}}#ui .btn-play{width:3rem}@media (orientation:portrait){#ui .btn-play{width:1.825rem}}@media (orientation:landscape){#ui .btn-play svg{fill:currentColor}}@media (orientation:portrait){#ui .btn-play svg{fill:#0000;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-miterlimit:10;stroke-linejoin:miter}}.color-picker{cursor:pointer;background:0 0;margin-right:.5rem}.color-picker .color-item{border:1px solid #000!important;border-radius:50%!important;margin:0!important}@media (orientation:landscape){.btn-show-ui{display:none}}.btn-show-ui{z-index:10;position:fixed;bottom:2.5rem;right:1rem}.btn-show-ui svg{width:2rem}.btns-info{margin-bottom:1rem;font-size:1rem}.btns-info .btn:not(:first-of-type){margin-left:.5rem}.btns-info .btn:not(:last-of-type){margin-right:.5rem}.btn-info{border-radius:50%}.param-colors .param-title{margin-bottom:0;line-height:1.3}.param-colors .flex{justify-content:space-between}.test{width:5rem;margin:2rem}.test input{border:1px solid #fff}.test img{width:100px;height:100px}