.patch-previews{display:flex;list-style-type:none;margin:0;padding:0;width:100%;flex-wrap:wrap;justify-content:space-around}.patch-previews>li{position:relative;display:block;width:16rem;height:9rem;border:1px solid white;border-radius:.5rem;margin-top:1rem;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIwIiBoZWlnaHQ9IjE0MCIgdmlld0JveD0iLTEwIC0yMCAyNDAgMTgwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxjaXJjbGUgc3Ryb2tlPSIjYjFiMWIxIiBzdHJva2Utd2lkdGg9IjMiIGZpbGw9InRyYW5zcGFyZW50IiBjeD0iNTAiIGN5PSIyMCIgcj0iMjAiLz4KICA8Y2lyY2xlIHN0cm9rZT0iI2IxYjFiMSIgc3Ryb2tlLXdpZHRoPSIzIiBmaWxsPSIjYjFiMWIxIiBjeD0iNTAiIGN5PSIyMCIgcj0iNSIvPgogIDxjaXJjbGUgc3Ryb2tlPSIjYjFiMWIxIiBzdHJva2Utd2lkdGg9IjMiIGZpbGw9InRyYW5zcGFyZW50IiBjeD0iMzAiIGN5PSIxMjAiIHI9IjIwIi8+CiAgPGNpcmNsZSBzdHJva2U9IiNiMWIxYjEiIHN0cm9rZS13aWR0aD0iMyIgZmlsbD0iI2IxYjFiMSIgY3g9IjMwIiBjeT0iMTIwIiByPSI1Ii8+CiAgPGNpcmNsZSBzdHJva2U9IiNiMWIxYjEiIHN0cm9rZS13aWR0aD0iMyIgZmlsbD0idHJhbnNwYXJlbnQiIGN4PSIyMDAiIGN5PSI4MCIgcj0iMjAiLz4KICA8Y2lyY2xlIHN0cm9rZT0iI2IxYjFiMSIgc3Ryb2tlLXdpZHRoPSIzIiBmaWxsPSIjYjFiMWIxIiBjeD0iMjAwIiBjeT0iODAiIHI9IjUiLz4KICA8bGluZSBzdHJva2U9IiNiMWIxYjEiIHN0cm9rZS13aWR0aD0iNCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiB4MT0iNTAiIHkxPSIyMCIgeDI9IjIwMCIgeTI9IjgwIi8+CiAgPGxpbmUgc3Ryb2tlPSIjYjFiMWIxIiBzdHJva2Utd2lkdGg9IjQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgeDE9IjMwIiB5MT0iMTIwIiB4Mj0iMjAwIiB5Mj0iODAiLz4KPC9zdmc+);background-position:center;background-size:contain}.patch-previews>li>.menu{position:absolute;top:.25rem;right:.25rem}.patch-previews>li>.menu>button{background-color:transparent;width:1.75rem;height:1.75rem;border-radius:1rem;display:flex;justify-content:center;align-items:center}.patch-previews .menu-popup{position:absolute;top:1.75rem;right:0;list-style-type:none;padding:0}.patch-previews .menu-popup>li>button{width:4rem;height:1.5rem;border-radius:0;background-color:#fff;color:#000}.patch-previews .menu-popup>li>button:hover{background-color:#aaa;color:#000}.patch-previews>.menu>button:hover{background-color:transparent}.patch-previews>li>a{display:flex;width:100%;height:100%;align-items:center;justify-content:center}.patch-previews>li>a>h3{display:flex;align-items:center;text-align:center;min-height:4rem;margin:1rem;padding:.25rem;border-radius:.25rem;background-color:#000a}.loader{border:16px solid #f3f3f3;border-top:16px solid #3498db;border-radius:50%;width:120px;height:120px;animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}main>section>h2{color:#000!important;text-align:left;width:20rem;max-width:calc(100vw - 1.5rem)}main>section{display:flex;flex-direction:column;justify-content:center;align-items:center}main>section>form{padding:0 auto;display:flex;flex-direction:column;width:20rem;max-width:calc(100vw - 1.5rem)}main>section>h2,main>section>p,main>section>form label,main>section>form button{margin-top:1rem}*,*:before,*:after{box-sizing:border-box}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role=list],ol[role=list]{list-style:none}html:focus-within{scroll-behavior:smooth}body{min-height:100vh;text-rendering:optimizeSpeed;line-height:1.5}a:not([class]){text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}@media (prefers-reduced-motion: reduce){html:focus-within{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}html,body{position:fixed;overflow:hidden}body{background:#ac81b7;-webkit-user-select:none;user-select:none;word-wrap:break-word}body,#root{margin:0;padding:0;font-family:monospace;display:block;width:100vw;height:100vh;color:#000}h1{color:#fff}#root{position:relative}#overview{position:relative;bottom:12.5rem;right:0;width:24rem;height:14rem;border:.1rem solid #ffffff;border-radius:.25rem;animation:all 1s linear;background-color:#6f5e4b;z-index:11}#overview.minimized{height:1.5rem;width:2.667rem;bottom:0}#overview.minimized #scrub-outline{display:none}#overview>span{position:relative;display:block;width:100%;height:100%}#overview>span>button{display:none;position:absolute;top:-.75rem;left:-.75rem;z-index:1000;width:1.5rem;height:1.5rem;border-radius:.75rem}#overview:hover{background-color:#bf82bb}#overview:hover>span>button{display:block}#overview #scrub-area{position:absolute;inset:0;pointer-events:none;background-repeat:no-repeat;background-position:top left;background-size:contain;overflow:hidden}#overview:hover #scrub-area{opacity:.75}#overview #scrub-outline{position:absolute;display:block;border:.1rem solid #ffffff}#status{color:#fff;margin:1rem}main>h1,main>h2{padding:0 .75rem}main section>h2,main ul li a,main ul li a:visited{color:#fff}.visually-hidden:not(:focus):not(:active){border:0;clip:rect(0 0 0 0);height:auto;margin:0;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}nav{position:absolute;top:0;left:0;right:0;background:#182f34;border-bottom:1px white solid;height:2.5rem;padding:.125rem .5rem;display:flex;flex-direction:row;justify-content:space-between;z-index:20;box-sizing:border-box}nav section{display:flex}nav ul.nav-links{display:flex;padding-left:1rem;margin:0;list-style-type:none}nav ul.nav-links li{display:flex;margin-right:1rem;align-items:center}nav ul.nav-links a,nav ul.nav-links a:visited{color:#7cd2e2}.toolbar{position:absolute;left:0;right:0;bottom:0;padding:.5rem;border-top:1px solid black;background-color:#7cd2e2;box-sizing:content-box;height:1.5rem;display:flex;justify-content:space-between;z-index:999}.toolbar button{background-color:#3c6a73;display:flex;justify-content:center;align-items:center;height:1.5rem}.toolbar button[disabled]{background-color:#a6d0d9;cursor:not-allowed}.toolbar img{height:100%}.toolbar>section{display:flex;flex-direction:row;gap:.5rem;padding:0 .5rem}main#init{display:flex;justify-content:center;align-items:center;flex-direction:column}main{position:absolute;top:2.5rem;left:0;right:0;bottom:2.5rem;overflow:scroll}button{background-color:#9142a0;border:1px solid white;border-radius:.5rem;color:#fff;cursor:pointer}#selection{position:absolute;border:solid 1px #fffc;border-radius:3px}#spacer{position:relative;min-width:calc(100vw + 300px);min-height:calc(100vh + 300px - 2.5rem);transition:all linear 10ms}#connections{z-index:10;pointer-events:none;position:fixed;top:2.5rem}#module-canvas{pointer-events:all;overscroll-behavior:contain}.module{background:#aad96c;position:absolute;box-sizing:content-box;display:flex;flex-direction:column;cursor:move;border:.15rem solid #ffffff22;border-bottom-left-radius:.2rem;border-bottom-right-radius:.2rem;padding:0 .5rem .5rem;transition:border linear .1s;width:9rem;transform:translate(-50%,-50%)}.module:before{content:"";display:block;position:absolute;width:calc(100% + .3rem);height:1.4rem;top:-1.4rem;left:-.15rem;background-color:#7bd7f0;transition:border linear .1s;border:.1rem solid #ffffff66;border-top-left-radius:.2rem;border-top-right-radius:.2rem}.module h2,.module h3,.module p,.module input,.module select{position:relative;z-index:11}.module h2{display:inline-block;position:absolute;top:-1.2rem;left:.5rem;margin:0;font-weight:100;font-size:.7rem;cursor:text;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:9rem;z-index:11}.module h2 input{position:relative;top:-.1rem;height:1.2rem;width:9rem}.module .module-menu{position:absolute;top:-1.2rem;right:.1rem}.module .module-menu>button{display:flex;justify-content:center;align-items:center;border-radius:0;padding:0;width:1rem;height:1rem;border:none;background-color:transparent}.module .module-menu>button:hover{background-color:#cbe5ee}.module .module-menu>button svg *{fill:#000!important}.module .module-menu>ul{position:absolute;display:flex;flex-direction:column;top:-.9rem;right:-5.3rem;width:5rem;padding:0;list-style-type:none}.module .module-menu>ul>li{display:block;width:5rem;text-align:center;background-color:#fff}.module .active{background-color:#d9cc6c}.module .connected{background-color:#e86a88}.module .highlight{background-color:#aad96c}.module.selected,.module.selected:before{border:.15rem solid #1c52bc}.module.selected:before{background-color:#fff}.module.selected{background-color:#e2fcc9}.module.selection_pending,.module.selection_pending:before{border:.15rem dashed #ffffff}.module.selected,.module.selection_pending{z-index:1}.module.OSCILLATOR{background-color:#6ee198}.module.FILTER{background-color:#72ddc5}.module.COMPRESSOR{background-color:#74dae1}.module.DELAY{background-color:#9bd2f0}.module.GAIN{background-color:#c1c9f0}.module.SHIFT{background-color:#9fade8}.module.LIMITER{background-color:#dcc0f0}.module.PAN{background-color:#f1bae4}.module.NOISE{background-color:#f1bcce}.module.CLOCK{background-color:#e3acaf}.module.ENVELOPE{background-color:#aec27e}.module.VCA{background-color:#81c8ad}.module.SEQUENCER{background-color:#aabae0}.module.OUTPUT{width:18rem}.connectors{margin-bottom:.5rem;display:flex;justify-content:space-between}.connectors .inputs,.connectors .outputs{display:flex;flex-direction:column}.io{display:flex;flex:1rem}.io:not(:first-child){margin-top:.5rem}.connector{position:relative;width:1.2rem;height:1.2rem;margin:0;border-radius:.6rem;background-color:#b9ffce;border:1px solid #4f4658}.connector:hover:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;border-radius:50%;display:block;background:#3f5efb;background:radial-gradient(circle,#b9ffce,#7aa888);border:1px solid #4f4658;z-index:11}.connector:after{content:"";position:absolute;border-radius:50%;display:block;background:transparent;top:-50%;left:-100%;height:200%;width:300%}.connector:hover:after{top:-50%;height:200%}main.selection-drag .connector:hover:before{display:none}.connector:first-child{margin-right:calc(1rem + 4px);margin-left:calc(-2.2rem - 4px)}.connector:last-child{margin-left:calc(1rem + 4px);margin-right:calc(-2.2rem - 4px)}.numparam:not(:first-child),.radioparam:not(:first-child){margin-top:.1rem}.numparam,.numparam>div,.radioparam{display:flex;height:1.25rem}.numparam label h3,.io p,.radioparam label{font-weight:100;font-size:.75rem}.numparam input,.radioparam select{font-size:.75rem;width:4rem;font-weight:400}#main.selection_drag .module{pointer-events:none}.radioparam select{font-size:.6rem}.numparam input{text-align:right}.numparam button{margin-right:1rem}.numparam>div,.radioparam{justify-content:space-between;flex-grow:1;overflow:hidden}.numparam>h3{font-size:.667rem}#load{display:flex;align-items:center;padding:0 .5rem;color:#fff}input[type=file]{display:none}.ReactModalPortal{position:relative;z-index:30}