*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{-moz-text-size-adjust:none;text-size-adjust:none;width:100%;height:100%}body{-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;min-height:100vh;line-height:1.5}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}h1,h2,h3,h4,button,input,label{line-height:1.1}input,button,textarea,select{font:inherit}a{color:inherit;text-decoration:none}ul[role=list],ol[role=list]{list-style:none}table{border-collapse:collapse;border-spacing:0}img,picture,video,canvas,svg{max-width:100%;display:block}section,div{flex-direction:column;display:flex;position:relative}object{pointer-events:none}:root,html[data-theme=light]{--background-color:#efefef;--text-color:#1c1c1c;--border-color:#838383;--border-color-alpha:#8383837e;--shade-color:#fff;--shade-color-alpha:#ffffff7f;--highlight-color:#efd096;--highlight-color-alpha:#efd0967e;--filter:invert(0)}html[data-theme=dark]{--background-color:#1c1c1c;--text-color:#fff;--border-color:#9f9f9f;--border-color-alpha:#9f9f9f7e;--shade-color:#474747;--shade-color-alpha:#2c2c2c78;--highlight-color:#397a95;--highlight-color-alpha:#397a957e;--filter:invert(1)}html,body{background:var(--background-color);color:var(--text-color)}.themeswitch{z-index:9;display:block;position:absolute;top:25px;right:25px}.themeswitch__checkbox{width:50px;height:24px;display:inline-block;position:relative}.themeswitch__checkbox input{display:none}.icon-sun,.icon-moon{mix-blend-mode:difference;display:none}html[data-theme=light] .icon-sun,html[data-theme=dark] .icon-moon{display:inline-block}.slider{cursor:pointer;background:var(--highlight-color);border-radius:34px;transition:all .2s;position:absolute;inset:0}.slider:before{content:"";background:#fff;border-radius:50%;width:18px;height:18px;transition:all .2s;position:absolute;bottom:3px;left:3px}input:checked+.slider:before{transform:translate(26px)}@font-face{font-family:basier square;src:url(basiersquare-regular-webfont.34c6658e.woff2)format("woff2"),url(basiersquare-regular-webfont.d9f0e475.woff)format("woff"),url(basiersquare-regular-webfont.8fabf11e.ttf)format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:basier square;src:url(basiersquare-regularitalic-webfont.1d3036b3.woff2)format("woff2"),url(basiersquare-regularitalic-webfont.3b3e8b19.woff)format("woff"),url(basiersquare-regularitalic-webfont.ad453ecf.ttf)format("truetype");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:basier square;src:url(basiersquare-medium-webfont.4316dc4b.woff2)format("woff2"),url(basiersquare-medium-webfont.6ed17690.woff)format("woff"),url(basiersquare-medium-webfont.66024cc3.ttf)format("truetype");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:basier square;src:url(basiersquare-semibold-webfont.8f6aa468.woff2)format("woff2"),url(basiersquare-semibold-webfont.0f1ec7c2.woff)format("woff"),url(basiersquare-semibold-webfont.3ba2e24f.ttf)format("truetype");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:basier square;src:url(basiersquare-bold-webfont.19e3e2cd.woff2)format("woff2"),url(basiersquare-bold-webfont.00d01ab0.woff)format("woff"),url(basiersquare-bold-webfont.50d23821.ttf)format("truetype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:basier circle;src:url(basiercircle-medium-webfont.956f9f80.woff2)format("woff2"),url(basiercircle-medium-webfont.545cdc30.woff)format("woff"),url(basiercircle-medium-webfont.7ed6f310.ttf)format("truetype");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:basier circle;src:url(basiercircle-semibold-webfont.174241fe.woff2)format("woff2"),url(basiercircle-semibold-webfont.6a595105.woff)format("woff"),url(basiercircle-semibold-webfont.07864c73.ttf)format("truetype");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:basier circle;src:url(basiercircle-bold-webfont.d71eaf66.woff2)format("woff2"),url(basiercircle-bold-webfont.768ba4e7.woff)format("woff"),url(basiercircle-bold-webfont.bd7151e5.ttf)format("truetype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:novela;src:url(novela-regular-webfont.3b9605af.woff2)format("woff2"),url(novela-regular-webfont.bbe839b6.woff)format("woff"),url(novela-regular-webfont.e471d460.ttf)format("truetype");font-weight:400;font-style:normal;font-display:swap}body{font-family:basier square,sans-serif;font-style:normal;font-weight:400}body h1,body h2,body h3,body h4,body h5,body h6{font-family:basier circle,sans-serif}.filter--blur{filter:blur(48px)opacity(.25)}.filter--darken{filter:brightness(.8)}.faded{opacity:.7}.nav{display:flex}.nav__list{z-index:9;background:var(--shade-color-alpha);box-shadow:0 0 2px 0px var(--border-color), 0 0 8px 0px var(--border-color-alpha);background-blend-mode:exclusion;backdrop-filter:blur(24px);border:none;border-radius:10px;align-items:center;transition:all .2s;display:none;position:fixed;top:120px;left:50%;overflow:hidden;transform:translate(-50%,-50%)translateY(0)}@media (width>=768px){.nav__list{display:flex}}.nav__list--sticky{border:1px solid var(--border-color);box-shadow:0 0 14px 4px var(--border-color-alpha);transform:translate(-50%,-50%)translateY(-80px)}.nav__list--sticky>li>a{padding:8px 0!important}.nav__list>li{text-align:center;display:block;position:relative}.nav__list>li>a{min-width:150px;padding:12px 0;font-weight:500;display:inline-block}.nav__list>li:not(:last-child){box-shadow:inset -10px 0 10px -12px var(--border-color-alpha)}.nav__shadow{z-index:7;visibility:visible;opacity:1;background:#0000004d;width:100%;height:100%;transition:all .2s;position:fixed;top:0;left:0}.nav__shadow--visible{visibility:visible;opacity:1}.nav__rect{background:var(--highlight-color);width:150px;height:100%;position:absolute;transform:translate(-100%)}.nav__menu{background-blend-mode:exclusion;backdrop-filter:blur(24px);visibility:hidden;opacity:0;z-index:8;background:var(--shade-color-alpha);flex-flow:wrap;width:100%;padding:60px 0;transition:all .2s;display:flex;position:fixed;top:0;left:0;overflow-x:hidden;transform:translateY(-100%)}@media (width>=768px){.nav__menu{display:none}}.nav__menu>li{justify-content:center;width:100%;padding:12px 0;display:flex}.nav__menu>li>a{text-align:center;min-width:120px;font-size:26px;font-weight:500;line-height:2}.nav__menu--visible{visibility:visible;opacity:1;transform:translateY(0)}.burger{background-blend-mode:exclusion;backdrop-filter:blur(24px);z-index:9;border-radius:10px;justify-content:center;align-items:center;width:30px;height:30px;padding:20px;display:flex;position:fixed;top:15px;left:20px}@media (width>=768px){.burger{display:none}}.burger__inner{background:var(--text-color);width:80%;height:3px;transition:all .2s;position:absolute;left:10%}.burger__inner:before{content:"";background:var(--text-color);width:80%;height:3px;transition:all .2s;position:absolute;top:-10px;left:10%}.burger__inner:after{content:" ";background:var(--text-color);width:80%;height:3px;transition:all .2s;position:absolute;top:10px;left:10%}.burger__inner--active{background-color:#0000}.burger__inner--active:before{top:0;transform:rotate(45deg)}.burger__inner--active:after{top:0;transform:rotate(-45deg)}@keyframes pulse{0%{transform:scale(1);box-shadow:0 0 #424c4c85}30%{transform:scale(1.05);box-shadow:0 0 12px 12px #424c4c85}}.hover-pulse:hover,.hover-pulse:focus{animation:.5s pulse;box-shadow:0 0 0 36px #0000}.hover-fill{--hover-x:50%;--hover-y:50%;position:relative;overflow:hidden}.hover-fill:after{content:" ";top:var(--hover-y);left:var(--hover-x);background-color:var(--highlight-color);z-index:-1;border-radius:50%;width:100%;height:100%;transition:transform .2s linear;position:absolute;transform:scale(0)translate(-50%,-50%)}.hover-fill:hover:after{transform:scale(4)}.hover-fill:active{background-color:var(--highlight-color)}.hover-line{box-shadow:inset 0 -2px 0 0 var(--highlight-color);box-sizing:border-box;padding:0 3px;text-decoration:none;transition:all .2s;display:inline-block}.hover-line:hover{box-shadow:inset 0 -24px 0 0 var(--highlight-color);border:none}.hover-enlarge{transition:transform .2s;transform:scale(1)}.hover-enlarge:hover{transform:scale(1.1)}.hover-glow:before{content:" ";mix-blend-mode:overlay;border-radius:inherit;background:radial-gradient(circle at var(--hover-x,30%) var(--hover-y,30%), var(--shade-color-alpha) 0%, transparent 30%);opacity:0;transition:opacity .2s;position:absolute;inset:0}.hover-glow:hover:before{opacity:1}footer{flex-direction:column;justify-content:center;align-items:center;padding:80px 0;display:flex}footer__attribution{margin-bottom:8px}.social{flex-direction:row;display:flex}.social__link{z-index:0;border-radius:10px;width:50px;height:50px;display:inline-block}.social__link svg{width:100%;height:100%;fill:var(--text-color)}.social__item{margin:0 12px;display:block}@keyframes movement{0%,to{background-position:-80vmax -80vmax,60vmax -30vmax,10vmax 10vmax,-30vmax -10vmax,50vmax 50vmax;background-size:130vmax 130vmax,80vmax 80vmax,90vmax 90vmax,110vmax 110vmax,90vmax 90vmax}25%{background-position:-60vmax -90vmax,50vmax -40vmax,0 -20vmax,-40vmax -20vmax,40vmax 60vmax;background-size:100vmax 100vmax,90vmax 90vmax,100vmax 100vmax,90vmax 90vmax,60vmax 60vmax}50%{background-position:-50vmax -70vmax,40vmax -30vmax,10vmax 0,20vmax 10vmax,30vmax 70vmax;background-size:80vmax 80vmax,110vmax 110vmax,80vmax 80vmax,60vmax 60vmax,80vmax 80vmax}75%{background-position:-50vmax -40vmax,50vmax -30vmax,20vmax 0,-10vmax 10vmax,40vmax 60vmax;background-size:90vmax 90vmax,90vmax 90vmax,100vmax 100vmax,90vmax 90vmax,70vmax 70vmax}}.dynamic-background{background-image:radial-gradient(closest-side,#9e5041,#a74f3b00),radial-gradient(closest-side,#894372,#a33b8000),radial-gradient(closest-side,#857741,#8d834c00),radial-gradient(closest-side,#533e9a,#5536a400),radial-gradient(closest-side,#94683c,#965e3b00),radial-gradient(closest-side,#9a553e,#bb5d3d00);background-position:-80vmax -80vmax,60vmax -30vmax,10vmax 10vmax,-30vmax -10vmax,50vmax 50vmax,-20vmax,-40vmax;background-repeat:no-repeat;background-size:130vmax 130vmax,80vmax 80vmax,90vmax 90vmax,110vmax 110vmax,90vmax 90vmax,100vmax,100vmax;animation:10s linear infinite movement}section{justify-content:center;align-items:center;padding:60px 0;display:flex}@media (width>=768px){section:first-of-type{padding:200px 0 60px}}:root,html[data-theme=light]{--hardware-color:radial-gradient(ellipse at 50% 30%, #fff6 0%, transparent 80%), #f2f2ec;--hardware-shadow:0 8px 32px #0000001f, 0 4px 16px #00000014, 0 2px 8px #0000000f, inset 0 2px 0 #fffc, inset 0 -2px 0 #0000001a;--oscillator-color:radial-gradient(ellipse at 50% 30%, #ffffff40 0%, transparent 80%), #dadada;--oscillator-shadow:0 6px 18px #00000014, 0 3px 8px #0000000f, 0 1px 4px #0000000a, inset 0 2px 0 #fff9, inset 0 -1px 0 #00000014;--oscillator-border:1px solid #00000026;--waveforms-color:radial-gradient(circle at center, #8b45131a 0%, transparent 50%), linear-gradient(145deg, #2d1810 0%, #3d2318 30%, #4a2b1c 50%, #3d2318 70%, #2d1810 100%);--waveforms-shadow:0 0 20px #8b45134d, 0 4px 12px #00000080, inset 0 3px 6px #000000b3, inset 0 -1px 0 #8b451333;--waveforms-border:1px solid #8b45134d;--waveform-button-color:linear-gradient(145deg, #4a2b1c 0%, #3d2318 50%, #2d1810 100%);--waveform-button-border:1px solid #8b451366;--waveform-button-shadow:inset 0 2px 4px #0009, 0 1px 0 #8b451333;--waveform-button-hover-color:linear-gradient(145deg, #5a3b2c 0%, #4d3028 50%, #4a2b1c 100%);--waveform-button-hover-border:#ff8c0099;--waveform-button-hover-shadow:0 0 12px #ff8c004d, inset 0 2px 4px #000000b3;--waveform-button-selected-color:linear-gradient(145deg, #ff8c00 0%, #f70 50%, #f60 100%);--waveform-button-selected-border:#ff8c00;--waveform-button-selected-shadow:0 0 20px #ff8c00b3, 0 0 35px #ff8c0066, inset 0 2px 0 #ffffff4d;--knob-color:radial-gradient(circle at 30% 30%, #f8f8f8, #e9e9e9, #d4d4d4);--knob-border:3px solid #b8b8b8;--knob-shadow:0 8px 16px #00000026, inset 0 2px 4px #fffc, inset 0 -2px 4px #0000001a;--knob-indicator-color:#8b4513;--knob-indicator-shadow:0 0 4px #8b4513;--knob-center-color:linear-gradient(145deg, #e8e8e8, silver);--knob-center-border:1px solid #909090;--knob-label-color:#5a5a52;--text-primary:#2a2a2a;--text-secondary:#5a5a52;--text-muted:#8a8a82;--text-inverse:#fff;--led-display-color:radial-gradient(ellipse at center, #0a0a08 0%, #000 100%), linear-gradient(to bottom, #1a1a15, #0a0a08);--led-display-text-color:#ff8c00;--led-display-border:2px solid #3a3a32;--led-display-shadow:inset 0 3px 6px #000000e6, inset 0 -1px 0 #ff8c001a, 0 2px 0 #fff3;--led-display-text-shadow:0 0 3px #ff8c00, 0 0 1px #ff8c00;--volumemeter-color:#dadada;--visualizer-color:radial-gradient(ellipse at center, #1a1a15 0%, #0a0a08 100%), linear-gradient(to bottom, #2a2a22, #1a1a15);--visualizer-shadow:0 4px 12px #0000004d, 0 2px 6px #0003, inset 0 2px 4px #000c, inset 0 -1px 0 #ff8c001a;--init-button-color:radial-gradient(ellipse at 50% 30%, #ffffff40 0%, transparent 80%), #dadada;--init-button-border:2px solid #a8a395;--init-button-shadow:0 6px 12px #0003, inset 0 2px 4px #fff9, inset 0 -2px 4px #00000026;--init-button-hover-color:radial-gradient(circle at 30% 30%, #ff8c0033 0%, transparent 60%), linear-gradient(145deg, #e8e3db 0%, #d8d3cb 30%, #c8c3bb 50%, #d8d3cb 70%, #e8e3db 100%);--init-button-hover-border:#ff8c00cc;--init-button-hover-shadow:0 0 15px #ff8c0066, 0 6px 12px #00000040, inset 0 2px 4px #ffffffb3, inset 0 -2px 4px #00000026;--init-led-color:#5a4a3a;--init-led-border:2px solid #8a7a6a;--init-led-shadow:inset 0 2px 4px #0009, inset 0 1px 0 #fff3;--init-led-active-color:#ff8c00;--init-led-active-shadow:0 0 12px #ff8c00, 0 0 6px #ff8c00;--init-led-pressed-color:#f60;--init-led-pressed-shadow:0 0 16px #f60, 0 0 8px #f60;--stop-button-color:radial-gradient(ellipse at 50% 30%, #ffffff40 0%, transparent 80%), #dadada;--stop-button-border:2px solid #a8a395;--stop-button-shadow:0 6px 12px #0003, inset 0 2px 4px #fff9, inset 0 -2px 4px #00000026;--stop-button-hover-color:radial-gradient(circle at 30% 30%, #ff454533 0%, transparent 60%), linear-gradient(145deg, #e8e3db 0%, #d8d3cb 30%, #c8c3bb 50%, #d8d3cb 70%, #e8e3db 100%);--stop-button-hover-border:#ff4545cc;--stop-button-hover-shadow:0 0 15px #ff454566, 0 6px 12px #00000040, inset 0 2px 4px #ffffffb3, inset 0 -2px 4px #00000026;--stop-led-color:#5a4a3a;--stop-led-border:2px solid #8a7a6a;--stop-led-shadow:inset 0 2px 4px #0009, inset 0 1px 0 #fff3;--stop-led-active-color:#ff4545;--stop-led-active-shadow:0 0 12px #ff4545, 0 0 6px #ff4545;--stop-led-pressed-color:red;--stop-led-pressed-shadow:0 0 16px red, 0 0 8px red;--border-color:#0003}html[data-theme=dark]{--hardware-color:radial-gradient(circle at 25% 25%, #ffffff05 0%, transparent 50%), linear-gradient(145deg, #2e2e2e 0%, #343434 20%, #3b3939 40%, #343434 60%, #303030 80%, #2c2c2c 100%);--hardware-shadow:0 8px 32px #00000040, 0 4px 16px #0003, 0 2px 8px #00000026, inset 0 1px 0 #ffffff0f, inset 0 -1px 0 #0003;--oscillator-color:linear-gradient(145deg, #303030 0%, #323236 50%, #2c2828 100%);--oscillator-shadow:0 4px 16px #0000002e, 0 2px 8px #0000001f, 0 1px 4px #00000014, inset 0 1px 0 #ffffff08, inset 0 -1px 0 #00000026;--oscillator-border:1px solid #e4e4e433;--waveforms-color:radial-gradient(circle at center, #00ff6414 0%, transparent 50%), linear-gradient(145deg, #000 0%, #0f0f0f 50%, #050505 100%);--waveforms-shadow:0 0 20px #5454544d, 0 3px 12px #0009, inset 0 3px 6px #000000e6;--waveforms-border:1px solid #ffffff14;--waveform-button-color:linear-gradient(145deg, #1a1a1a 0%, #0a0a0a 100%);--waveform-button-border:1px solid #ffffff26;--waveform-button-shadow:inset 0 1px 2px #000c, 0 1px 0 #ffffff08;--waveform-button-hover-color:linear-gradient(145deg, #2a2a2a 0%, #1a1a1a 100%);--waveform-button-hover-border:#00ff8880;--waveform-button-hover-shadow:0 0 10px #00ff884d, inset 0 1px 2px #000000e6;--waveform-button-selected-color:linear-gradient(145deg, #0f8 0%, #0c6 100%);--waveform-button-selected-border:#0f8;--waveform-button-selected-shadow:0 0 20px #0f8c, 0 0 30px #0f86, inset 0 1px 0 #ffffff4d;--knob-color:radial-gradient(circle at 30% 30%, #777, #444, #1a1a1a);--knob-border:3px solid #555;--knob-shadow:0 10px 20px #000c, inset 0 2px 4px #ffffff14, inset 0 -2px 4px #00000080;--knob-indicator-color:#0f8;--knob-indicator-shadow:0 0 6px #0f8;--knob-center-color:linear-gradient(145deg, #666, #333);--knob-center-border:1px solid #777;--knob-label-color:#bbb;--text-primary:#e0e0e0;--text-secondary:#aaa;--text-muted:#777;--text-inverse:#000;--led-display-color:linear-gradient(to bottom, #050505, #000);--led-display-text-color:#0f8;--led-display-border:1px solid #444;--led-display-shadow:inset 0 3px 6px #000000e6, 0 1px 0 #ffffff05;--led-display-text-shadow:0 0 6px #0f8;--volumemeter-color:#0a0a0a;--visualizer-color:#050505;--visualizer-shadow:0 3px 12px #0006, 0 1px 6px #0000004d, inset 0 1px 4px #0009, inset 0 -1px 0 #ffffff05;--init-button-color:linear-gradient(145deg, #3a3a3a 0%, #2a2a2a 50%, #1a1a1a 100%);--init-button-border:1px solid #555;--init-button-shadow:inset 0 2px 4px #0009, inset 0 1px 0 #ffffff1a, inset 0 -1px 0 #0006, 0 1px 0 #ffffff0f;--init-button-hover-color:linear-gradient(145deg, #4a4a4a 0%, #3a3a3a 50%, #2a2a2a 100%);--init-button-hover-border:#ff660080;--init-button-hover-shadow:0 0 8px #f603, inset 0 2px 4px #0009, inset 0 1px 0 #ffffff26, inset 0 -1px 0 #0006;--init-led-color:#444;--init-led-border:1px solid #666;--init-led-shadow:inset 0 1px 0 #ffffff26;--init-led-active-color:#f60;--init-led-active-shadow:0 0 8px #f60;--init-led-pressed-color:#f30;--init-led-pressed-shadow:0 0 12px #f30;--stop-button-color:linear-gradient(145deg, #3a3a3a 0%, #2a2a2a 50%, #1a1a1a 100%);--stop-button-border:1px solid #555;--stop-button-shadow:inset 0 2px 4px #0009, inset 0 1px 0 #ffffff1a, inset 0 -1px 0 #0006, 0 1px 0 #ffffff0f;--stop-button-hover-color:linear-gradient(145deg, #4a4a4a 0%, #3a3a3a 50%, #2a2a2a 100%);--stop-button-hover-border:#ff454580;--stop-button-hover-shadow:0 0 8px #ff454533, inset 0 2px 4px #0009, inset 0 1px 0 #ffffff26, inset 0 -1px 0 #0006;--stop-led-color:#444;--stop-led-border:1px solid #666;--stop-led-shadow:inset 0 1px 0 #ffffff26;--stop-led-active-color:#ff4545;--stop-led-active-shadow:0 0 8px #ff4545;--stop-led-pressed-color:red;--stop-led-pressed-shadow:0 0 12px red;--border-color:#0003}.display-section{flex-direction:row;gap:24px;height:100px;display:flex}.visualizer{background:var(--visualizer-color);width:300px;height:100%;box-shadow:var(--visualizer-shadow);border-radius:10px;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.visualizer:before{content:"";pointer-events:none;z-index:5;background:repeating-linear-gradient(0deg,#0000,#0000 2px,#00ff0008 2px 4px);position:absolute;inset:0}.visualizer:after{content:"";pointer-events:none;z-index:6;background:radial-gradient(#0000 50%,#0000001a 100%);border-radius:6px;position:absolute;inset:2px}.visualizer__text{filter:drop-shadow(0 0 4px #00ff00b3);color:#f5f5f5;letter-spacing:2px;text-transform:uppercase;text-align:center;pointer-events:none;width:100%;margin-bottom:2px;font-size:10px;font-weight:600;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.visualizer .waveform-canvas,.visualizer .spectrum-canvas{width:100%;height:100%}.volumemeter{background:var(--visualizer-color);width:60px;height:100%;box-shadow:var(--visualizer-shadow);border-radius:10px;flex-direction:column;align-items:center;padding:12px 12px 24px;display:flex}.volumemeter__text{color:#f5f5f5;text-transform:uppercase;text-align:center;pointer-events:none;width:100%;margin-bottom:2px;font-size:10px;font-weight:600;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.volume-bar{background:linear-gradient(#111,#000);border:1px solid #444;border-radius:6px;flex-direction:column-reverse;flex:1;gap:1px;width:100%;height:100%;padding:2px;display:flex;position:relative;box-shadow:inset 0 2px 4px #000c}.volume-bar:before{content:"";color:#666;font-family:Arial,sans-serif;font-size:8px;font-weight:700;position:absolute;top:-8px;left:50%;transform:translate(-50%)}.volume-bar .volume-segments{flex-direction:column-reverse;gap:1px;width:100%;height:100%;display:flex}.volume-bar .volume-segment{background:#1a1a1a;border:1px solid #333;border-radius:1px;flex:1;width:100%;transition:all 50ms;box-shadow:inset 0 1px #ffffff1a}.volume-bar .volume-segment.active{border-color:#0000}.volume-bar .volume-segment.active.green{background:linear-gradient(#0f0,#0a0);box-shadow:0 0 4px #0f0,inset 0 1px #ffffff4d}.volume-bar .volume-segment.active.yellow{background:linear-gradient(#fa0,#a60);box-shadow:0 0 4px #fa0,inset 0 1px #ffffff4d}.volume-bar .volume-segment.active.red{background:linear-gradient(red,#a00);box-shadow:0 0 4px red,inset 0 1px #ffffff4d}.init-button-container{background:var(--visualizer-color);width:60px;height:100%;box-shadow:var(--visualizer-shadow);border-radius:10px;flex-direction:column;align-items:center;padding:12px 12px 24px;display:flex;position:relative}.init-button-container .init-button__text{color:#f5f5f5;text-transform:uppercase;text-align:center;pointer-events:none;width:100%;margin-bottom:2px;font-size:10px;font-weight:600;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.init-button{background:var(--init-button-color);border:var(--init-button-border);cursor:pointer;width:100%;box-shadow:var(--init-button-shadow);border-radius:6px;flex:1;justify-content:center;align-items:center;transition:all .15s;display:flex;position:relative}.init-button:before{content:"";pointer-events:none;background:radial-gradient(circle at 25% 25%,#ffffff08 0%,#0000 50%),repeating-linear-gradient(45deg,#0000,#0000 1px,#ffffff03 1px 2px);border-radius:6px;position:absolute;inset:0}.init-button:hover{background:var(--init-button-hover-color);border-color:var(--init-button-hover-border);box-shadow:var(--init-button-hover-shadow)}.init-button:hover .led-indicator{background:var(--init-led-active-color);box-shadow:var(--init-led-active-shadow)}.init-button:active{transform:translateY(1px);box-shadow:inset 0 1px 2px #000000e6,inset 0 -1px #0000004d}.init-button:active .led-indicator{background:var(--init-led-pressed-color);box-shadow:var(--init-led-pressed-shadow)}.init-button.pressed .led-indicator{animation:.3s ease-out simpleLedFlash}.init-button .led-indicator{background:var(--init-led-color);border:var(--init-led-border);width:16px;height:16px;box-shadow:var(--init-led-shadow);border-radius:50%;transition:all .15s;position:relative}.init-button .led-indicator:before{content:"";pointer-events:none;background:#fff3;border-radius:50%;width:4px;height:4px;position:absolute;top:2px;left:2px}@keyframes simpleLedFlash{0%{background:var(--init-led-pressed-color);box-shadow:var(--init-led-pressed-shadow)}to{background:var(--init-led-color);box-shadow:var(--init-led-shadow)}}.oscillator-section{flex-direction:row;align-items:stretch;gap:12px;width:100%;display:flex}.oscillators{background:var(--oscillator-color);width:240px;min-height:200px;box-shadow:var(--oscillator-shadow);border:var(--oscillator-border);border-radius:20px;flex-direction:row;justify-content:space-around;align-items:center;gap:12px;padding:48px 24px 24px;display:flex}.oscillators .knob-groups{flex-flow:row;justify-content:center;align-items:flex-start;gap:8px;display:flex}.oscillators .knob-groups .knob-controller{flex-shrink:0}.oscillators.oscillators--dual .knob-groups{flex-direction:row!important;display:flex!important}.oscillators.oscillators--dual .knob-groups .knob-controller{flex-direction:column!important;display:inline-flex!important}.oscillators__text{width:100%;color:var(--text-color);filter:drop-shadow(0 0 4px #00ff88b3);letter-spacing:2px;text-transform:uppercase;text-align:center;pointer-events:none;margin-top:24px;font-size:12px;font-weight:600;position:absolute;top:0;left:50%;transform:translate(-50%)}.oscillators .waveforms{background:var(--waveforms-color);box-shadow:var(--waveforms-shadow);border:var(--waveforms-border);border-radius:6px;gap:8px;padding:8px;display:flex}.oscillators .waveforms__button{background:var(--waveform-button-color);border:var(--waveform-button-border);color:#f5f5f5;cursor:pointer;text-transform:uppercase;width:35px;height:35px;box-shadow:var(--waveform-button-shadow);border-radius:3px;padding:6px 2px;font-size:10px;font-weight:700;transition:all .2s}.oscillators .waveforms__button svg{pointer-events:none;width:100%;height:100%}.oscillators .waveforms__button:hover{background:var(--waveform-button-hover-color);color:var(--highlight-color);border-color:var(--waveform-button-hover-border);box-shadow:var(--waveform-button-hover-shadow)}.oscillators .waveforms__button.selected{background:var(--waveform-button-selected-color);color:#000;border-color:var(--waveform-button-selected-border);box-shadow:var(--waveform-button-selected-shadow)}.oscillators .waveforms__button.selected svg{filter:drop-shadow(0 1px 2px #00000080)}.oscillators .knob-controller{flex-direction:column;align-items:center;gap:8px;min-width:60px;display:flex}.oscillators .knob-label{color:var(--knob-label-color);text-transform:uppercase;letter-spacing:.5px;text-align:center;width:60px;font-size:8px;font-weight:600}.oscillators .knob-container{width:80px;height:80px;position:relative}@media (width>=992px){.oscillators .knob-container{width:70px;height:70px}}@media (width>=478px){.oscillators .knob-container{width:60px;height:60px}}.oscillators .volume-display,.oscillators .detune-display{background:var(--led-display-color);color:var(--led-display-text-color);text-align:center;border:var(--led-display-border);box-shadow:var(--led-display-shadow);text-shadow:var(--led-display-text-shadow);border-radius:4px;justify-content:center;align-items:center;width:45px;height:18px;padding:4px 6px;font-size:10px;font-weight:700;display:flex}.oscillators input[type=range]{opacity:0;cursor:pointer;z-index:10;width:100%;height:100%;position:absolute}.oscillators input[type=range]:before{content:"";pointer-events:none;background:radial-gradient(circle at 30% 30%,#666,#333,#111);border:3px solid #444;border-radius:50%;width:70px;height:70px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 8px 16px #0009,inset 0 2px 4px #ffffff1a,inset 0 -2px 4px #0000004d}@media (width>=992px){.oscillators input[type=range]:before{width:60px;height:60px}}@media (width>=478px){.oscillators input[type=range]:before{width:50px;height:50px}}.oscillators input[type=range]:after{content:"";pointer-events:none;background:#0f8;border-radius:2px;width:3px;height:20px;position:absolute;top:15px;left:50%;transform:translate(-50%);box-shadow:0 0 4px #0f8}@media (width>=992px){.oscillators input[type=range]:after{width:2px;height:18px;top:12px}}@media (width>=478px){.oscillators input[type=range]:after{width:2px;height:15px;top:10px}}.oscillators .knob{background:var(--knob-color);border:var(--knob-border);width:50px;height:50px;box-shadow:var(--knob-shadow);border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.oscillators .knob .knob-indicator{width:100%;height:100%;transition:transform .1s;position:absolute;top:0;left:0}.oscillators .knob .knob-indicator:before{content:"";background:var(--knob-indicator-color);width:3px;height:20px;box-shadow:var(--knob-indicator-shadow);border-radius:2px;position:absolute;top:5px;left:50%;transform:translate(-50%)}.oscillators .knob:after{content:"";background:var(--knob-center-color);border:var(--knob-center-border);border-radius:50%;width:12px;height:12px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.filter-section{background:var(--oscillator-color);width:360px;min-height:200px;box-shadow:var(--oscillator-shadow);border:var(--oscillator-border);will-change:auto;border-radius:20px;flex-direction:row;justify-content:space-around;align-items:center;gap:8px;padding:48px 24px 24px;display:flex;position:relative;transform:translateZ(0)}.filter-section__text{width:100%;color:var(--text-color);filter:drop-shadow(0 0 4px #ffa500b3);letter-spacing:2px;text-transform:uppercase;text-align:center;pointer-events:none;margin-top:24px;font-size:12px;font-weight:600;position:absolute;top:0;left:50%;transform:translate(-50%)}.filter-section .filter-left{flex-direction:column;justify-content:center;align-items:center;display:flex}.filter-section .filter-right{flex-direction:column;flex:1;justify-content:flex-start;align-items:center;gap:12px;display:flex}.filter-section .filter-visualizer{background:var(--visualizer-color);width:180px;height:80px;box-shadow:var(--visualizer-shadow);border-radius:10px;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.filter-section .filter-visualizer:before{content:"";pointer-events:none;z-index:5;background:repeating-linear-gradient(0deg,#0000,#0000 2px,#ffa50008 2px 4px);position:absolute;inset:0}.filter-section .filter-visualizer:after{content:"";pointer-events:none;z-index:6;background:radial-gradient(#0000 50%,#0000001a 100%);border-radius:6px;position:absolute;inset:2px}.filter-section .filter-visualizer .filter-canvas{width:100%;height:100%}.filter-section .filter-types{background:var(--waveforms-color);box-shadow:var(--waveforms-shadow);border:var(--waveforms-border);border-radius:6px;flex-direction:column;gap:8px;padding:8px;display:flex}.filter-section .filter-types__button{background:var(--waveform-button-color);border:var(--waveform-button-border);color:#f5f5f5;cursor:pointer;text-transform:uppercase;width:35px;height:35px;box-shadow:var(--waveform-button-shadow);border-radius:3px;flex-direction:column;justify-content:center;align-items:center;gap:1px;padding:2px;font-size:10px;font-weight:700;transition:all .2s;display:flex}.filter-section .filter-types__button .filter-icon{pointer-events:none;width:18px;height:8px}.filter-section .filter-types__button span{letter-spacing:.5px;font-size:5px}.filter-section .filter-types__button:hover{background:var(--waveform-button-hover-color);color:var(--highlight-color);border-color:var(--waveform-button-hover-border);box-shadow:var(--waveform-button-hover-shadow)}.filter-section .filter-types__button.selected{background:var(--waveform-button-selected-color);color:#000;border-color:var(--waveform-button-selected-border);box-shadow:var(--waveform-button-selected-shadow)}.filter-section .filter-types__button.selected .filter-icon{filter:drop-shadow(0 1px 2px #00000080)}.filter-section .filter-controls{flex-flow:row;justify-content:center;align-items:flex-start;gap:8px;display:flex}.filter-section .filter-controls .knob-controller{flex-shrink:0}.filter-section .knob-controller{flex-direction:column;align-items:center;gap:8px;min-width:70px;display:flex}.filter-section .knob-label{color:var(--knob-label-color);text-transform:uppercase;letter-spacing:.5px;text-align:center;width:55px;font-size:7px;font-weight:600}.filter-section .knob-container{width:60px;height:60px;position:relative}@media (width>=992px){.filter-section .knob-container{width:55px;height:55px}}@media (width>=478px){.filter-section .knob-container{width:50px;height:50px}}.filter-section .frequency-display,.filter-section .resonance-display{background:var(--led-display-color);color:var(--led-display-text-color);text-align:center;border:var(--led-display-border);box-shadow:var(--led-display-shadow);text-shadow:var(--led-display-text-shadow);border-radius:4px;justify-content:center;align-items:center;width:50px;height:16px;padding:3px 4px;font-size:9px;font-weight:700;display:flex}.filter-section input[type=range]{opacity:0;cursor:pointer;z-index:10;width:100%;height:100%;position:absolute}.filter-section input[type=range]:before{content:"";pointer-events:none;background:radial-gradient(circle at 30% 30%,#666,#333,#111);border:2px solid #444;border-radius:50%;width:50px;height:50px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 6px 12px #0009,inset 0 2px 4px #ffffff1a,inset 0 -2px 4px #0000004d}@media (width>=992px){.filter-section input[type=range]:before{width:45px;height:45px}}@media (width>=478px){.filter-section input[type=range]:before{width:40px;height:40px}}.filter-section input[type=range]:after{content:"";pointer-events:none;background:#0f8;border-radius:2px;width:2px;height:15px;position:absolute;top:12px;left:50%;transform:translate(-50%);box-shadow:0 0 4px #0f8}@media (width>=992px){.filter-section input[type=range]:after{width:2px;height:13px;top:10px}}@media (width>=478px){.filter-section input[type=range]:after{width:2px;height:12px;top:8px}}.filter-section .knob{background:var(--knob-color);border:var(--knob-border);width:50px;height:50px;box-shadow:var(--knob-shadow);border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.filter-section .knob .knob-indicator{width:100%;height:100%;transition:transform .1s;position:absolute;top:0;left:0}.filter-section .knob .knob-indicator:before{content:"";background:var(--knob-indicator-color);width:3px;height:20px;box-shadow:var(--knob-indicator-shadow);border-radius:2px;position:absolute;top:5px;left:50%;transform:translate(-50%)}.filter-section .knob:after{content:"";background:var(--knob-center-color);border:var(--knob-center-border);border-radius:50%;width:12px;height:12px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.keyboard{--keybed-width:818px;--keybed-offset:max(0px, calc((100% - var(--keybed-width)) / 2));background:linear-gradient(#ffffff14 0%,#ffffff05 14%,#fff0 28%),linear-gradient(#3a3a3ae6 0%,#2c2c2c 20%,#1e1e1e 80%,#0f0f0f 100%);border:3px solid #444;border-top:0;border-radius:16px;flex-direction:row;justify-content:center;width:90%;min-width:0;padding:40px 30px 30px;display:flex;position:relative;box-shadow:0 18px 32px #000000a6,inset 0 3px 6px #ffffff1a,inset 0 -3px 6px #0009}@media (width>=992px){.keyboard{max-width:600px}}@media (width>=768px){.keyboard{max-width:750px}}@media (width>=1200px){.keyboard{max-width:950px}}.keyboard:before{content:"MIDI KEYBOARD";color:#888;letter-spacing:2px;text-transform:uppercase;font-family:Arial,sans-serif;font-size:10px;font-weight:700;position:absolute;top:12px;left:50%;transform:translate(-50%)}.keyboard:after{content:"";background:radial-gradient(circle,#666 30%,#333 100%);border-radius:50%;width:8px;height:8px;position:absolute;top:15px;right:20px;box-shadow:0 2px 4px #000c,inset 0 1px #fff3}@media (width>=1200px){.keyboard{padding:35px 25px 25px}}@media (width>=992px){.keyboard{--keybed-width:709px;padding:30px 20px 20px;overflow-x:auto}}@media (width>=478px){.keyboard{--keybed-width:609px;transform-origin:50%;padding:25px 15px 15px;transform:scale(.85)}}.key{cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;flex-direction:column;justify-content:flex-end;align-items:center;font-family:Arial,sans-serif;transition:all .12s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.key__label{text-shadow:0 2px 4px #0009;opacity:.8;margin-bottom:12px;font-size:13px;font-weight:700}@media (width>=992px){.key__label{margin-bottom:10px;font-size:11px}}@media (width>=478px){.key__label{margin-bottom:8px;font-size:9px}}.key__note{opacity:.6;text-shadow:0 1px 2px #0009;margin-bottom:12px;font-size:11px;font-weight:600}@media (width>=992px){.key__note{margin-bottom:10px;font-size:9px}}@media (width>=478px){.key__note{margin-bottom:8px;font-size:8px}}.key.white{color:#444;z-index:1;background:linear-gradient(#fff 0%,#fafafa 10%,#f5f5f5 30%,#eee 70%,#e8e8e8 90%,#e0e0e0 100%);border:2px solid #ddd;border-radius:0 0 10px 10px;width:80px;height:280px;margin-right:2px;position:relative;box-shadow:0 12px 24px #0003,inset 0 3px #ffffffe6,inset 0 -3px #00000026,inset 2px 0 #fff6,inset -2px 0 #0000001a}.key.white:before{content:"";pointer-events:none;background:linear-gradient(145deg,#fffc 0%,#fff6 50%,#ffffff1a 100%);border-radius:0 0 6px 6px;position:absolute;inset:10px 10px 20px}.key.white:hover{background:linear-gradient(#f8f8f8 0%,#f2f2f2 10%,#ececec 30%,#e6e6e6 70%,#e0e0e0 90%,#d8d8d8 100%);transform:translateY(3px);box-shadow:0 9px 18px #00000040,inset 0 3px #ffffffb3,inset 0 -3px #0003,inset 2px 0 #ffffff4d,inset -2px 0 #00000026}.key.white.active{background:linear-gradient(#e8e8e8 0%,#e0e0e0 10%,#d8d8d8 30%,#d0d0d0 70%,#c8c8c8 90%,silver 100%);transform:translateY(6px);box-shadow:0 6px 12px #00000059,inset 0 4px 8px #0003,inset 2px 0 #fff3,inset -2px 0 #0003}.key.white:last-child{margin-right:0}@media (width>=992px){.key.white{width:70px;height:240px;margin-right:1px}}@media (width>=478px){.key.white{width:60px;height:200px}}.key.black{color:#ccc;z-index:2;background:linear-gradient(#4a4a4a 0%,#3a3a3a 15%,#2a2a2a 40%,#1a1a1a 70%,#0f0f0f 90%,#000 100%);border:2px solid #111;border-radius:0 0 8px 8px;width:48px;height:180px;position:absolute;box-shadow:0 15px 30px #0009,inset 0 3px #ffffff26,inset 0 -3px #0009,inset 1px 0 #ffffff1a,inset -1px 0 #0000004d}.key.black:before{content:"";pointer-events:none;background:linear-gradient(145deg,#ffffff1a 0%,#ffffff0d 50%,#0000 100%);border-radius:0 0 4px 4px;position:absolute;inset:8px 6px 15px}.key.black:hover{background:linear-gradient(#5a5a5a 0%,#4a4a4a 15%,#3a3a3a 40%,#2a2a2a 70%,#1a1a1a 90%,#0a0a0a 100%);transform:translateY(2px);box-shadow:0 12px 24px #000000b3,inset 0 3px #fff3,inset 0 -3px #000000b3,inset 1px 0 #ffffff26,inset -1px 0 #0006}.key.black.active{background:linear-gradient(#3a3a3a 0%,#2a2a2a 15%,#1a1a1a 40%,#0f0f0f 70%,#050505 90%,#000 100%);transform:translateY(4px);box-shadow:0 8px 16px #000c,inset 0 4px 8px #0009,inset 1px 0 #ffffff0d,inset -1px 0 #00000080}@media (width>=992px){.key.black{width:42px;height:155px}}@media (width>=478px){.key.black{width:36px;height:130px}}.key.black[data-key=KeyW]{left:calc(var(--keybed-offset) + 59px)}.key.black[data-key=KeyE]{left:calc(var(--keybed-offset) + 141px)}.key.black[data-key=KeyT]{left:calc(var(--keybed-offset) + 305px)}.key.black[data-key=KeyY]{left:calc(var(--keybed-offset) + 387px)}.key.black[data-key=KeyU]{left:calc(var(--keybed-offset) + 469px)}.key.black[data-key=KeyO]{left:calc(var(--keybed-offset) + 633px)}.key.black[data-key=KeyP]{left:calc(var(--keybed-offset) + 715px)}@media (width>=992px){.key.black[data-key=KeyW]{left:calc(var(--keybed-offset) + 52px)}.key.black[data-key=KeyE]{left:calc(var(--keybed-offset) + 123px)}.key.black[data-key=KeyT]{left:calc(var(--keybed-offset) + 266px)}.key.black[data-key=KeyY]{left:calc(var(--keybed-offset) + 337px)}.key.black[data-key=KeyU]{left:calc(var(--keybed-offset) + 408px)}.key.black[data-key=KeyO]{left:calc(var(--keybed-offset) + 551px)}.key.black[data-key=KeyP]{left:calc(var(--keybed-offset) + 622px)}}@media (width>=478px){.key.black[data-key=KeyW]{left:calc(var(--keybed-offset) + 44px)}.key.black[data-key=KeyE]{left:calc(var(--keybed-offset) + 104px)}.key.black[data-key=KeyT]{left:calc(var(--keybed-offset) + 224px)}.key.black[data-key=KeyY]{left:calc(var(--keybed-offset) + 284px)}.key.black[data-key=KeyU]{left:calc(var(--keybed-offset) + 344px)}.key.black[data-key=KeyO]{left:calc(var(--keybed-offset) + 464px)}.key.black[data-key=KeyP]{left:calc(var(--keybed-offset) + 524px)}}.effects-rack{flex-direction:row;gap:24px;width:100%;display:flex}.effects-rack .effect-slot{flex:1;min-width:0}.effect-slot{background:var(--oscillator-color);box-shadow:var(--oscillator-shadow);border:var(--oscillator-border);border-radius:20px;flex-direction:column;align-items:center;gap:12px;padding:48px 24px 24px;display:flex;position:relative}.effect-slot>label{width:100%;color:var(--text-color);filter:drop-shadow(0 0 4px #00ff88b3);letter-spacing:2px;text-transform:uppercase;text-align:center;pointer-events:none;margin-top:24px;font-size:12px;font-weight:600;position:absolute;top:0;left:50%;transform:translate(-50%)}.effect-slot select{background:var(--led-display-color);color:var(--led-display-text-color);border:var(--led-display-border);box-shadow:var(--led-display-shadow);text-shadow:var(--led-display-text-shadow);text-align:center;text-transform:uppercase;cursor:pointer;appearance:none;border-radius:4px;outline:none;align-self:center;width:140px;height:32px;padding:4px 8px;font-family:Courier New,monospace;font-size:11px;font-weight:700}.effect-slot select:focus{box-shadow:var(--led-display-shadow)}@media (width>=992px){.effect-slot select{width:120px;height:28px;font-size:10px}}@media (width>=478px){.effect-slot select{width:100px;height:26px;font-size:9px}}@media (width>=992px){.effect-slot{padding:48px 12px 12px}}@media (width>=478px){.effect-slot{padding:48px 8px 8px}}.effect-controls{flex-flow:wrap;justify-content:center;gap:24px;display:flex}@media (width>=992px){.effect-controls{gap:12px}}.effect-param{flex-direction:column;align-items:center;gap:8px;min-width:60px;display:flex}.effect-param label{color:var(--knob-label-color);text-transform:uppercase;letter-spacing:.5px;text-align:center;font-size:8px;font-weight:600}.effect-param .knob-container{width:70px;height:70px;position:relative}@media (width>=992px){.effect-param .knob-container{width:60px;height:60px}}@media (width>=478px){.effect-param .knob-container{width:55px;height:55px}}.effect-param input[type=range]{opacity:0;cursor:pointer;z-index:10;appearance:none;width:100%;height:100%;position:absolute}.effect-param .knob{background:var(--knob-color);border:var(--knob-border);width:48px;height:48px;box-shadow:var(--knob-shadow);pointer-events:none;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.effect-param .knob .knob-indicator{width:100%;height:100%;transition:transform .1s;position:absolute;top:0;left:0}.effect-param .knob .knob-indicator:before{content:"";background:var(--knob-indicator-color);width:3px;height:16px;box-shadow:var(--knob-indicator-shadow);border-radius:2px;position:absolute;top:5px;left:50%;transform:translate(-50%)}.effect-param .knob:after{content:"";background:var(--knob-center-color);border:var(--knob-center-border);border-radius:50%;width:10px;height:10px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.effect-param .param-display{background:var(--led-display-color);color:var(--led-display-text-color);text-align:center;border:var(--led-display-border);box-shadow:var(--led-display-shadow);text-shadow:var(--led-display-text-shadow);border-radius:4px;justify-content:center;align-items:center;width:45px;height:18px;padding:4px 6px;font-family:Courier New,monospace;font-size:10px;font-weight:700;display:flex}.synth{justify-content:center;align-items:center;width:100%;min-height:100vh;display:flex}.audiobox{background:var(--hardware-color);box-shadow:var(--hardware-shadow);border-radius:20px;flex-direction:column;gap:24px;width:90%;padding:48px;display:flex;position:relative}@media (width>=992px){.audiobox{max-width:600px}}@media (width>=768px){.audiobox{max-width:750px}}@media (width>=1200px){.audiobox{max-width:950px}}.audiobox>.keyboard{border-top-left-radius:0;border-top-right-radius:0;width:calc(100% + 96px);margin:0 -48px -48px}
/*# sourceMappingURL=synth.174fb215.css.map */