:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;padding:0;min-height:100vh}a{color:inherit;text-decoration:none}button{color:inherit}.block-btn{display:block;width:100%;border:none;background-color:#252525;color:#a2a2a2;padding:15px;border-radius:3px;cursor:pointer;font-size:1.1em;font-weight:600}.mb-10{margin-bottom:10px}.bottom-bar{position:fixed;bottom:0;left:0;right:0}.bottom-bar__buttons{display:flex;justify-content:center;padding-bottom:1.4em;gap:1em}.tabs{display:flex;border-top:1px solid #ccc}.tabs__tab{padding:.8em 1.2em;font-size:1em;font-weight:600;background-color:#1a1a1a;cursor:pointer;transition:background-color .25s;flex:1;text-align:center;text-transform:uppercase}.tabs__tab:first-child{border-right:1px solid #ccc}.tabs__tab--active>span{border-bottom:2px solid #646cff}.round-button{border:1px solid transparent;width:60px;height:60px;border-radius:50%;background-color:#1a1a1a;display:flex;justify-content:center;align-items:center;cursor:pointer}.empty-state{width:130px;margin:30vh auto 0;text-align:center;opacity:.5;text-wrap:balance}.main-section{padding-bottom:120px}.audio-waveform[data-v-e30d751b]{width:100%;height:var(--9eeddd82)}.sound-container{background-color:#303030;border-radius:3px;border:1px solid #4c4c4c;position:relative}.sound-container__flex{display:flex}.sound-container__duration{position:absolute;top:0;left:0;padding:2px 5px;background-color:#303030cc;color:#fff;font-size:12px;border-bottom-right-radius:3px}.sound-container__wave{flex:1}.sound-container__tools{display:flex;justify-content:center;align-items:center}.sound-container__tools>*{display:flex;justify-content:center;align-items:center;width:50px;border-left:1px solid #4c4c4c}.sample-regions{padding-left:10%;padding-bottom:20px}.sample-regions__region{margin-bottom:10px}.modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;z-index:1000}.modal-dialog{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#2f2f2fe6;padding:1em;z-index:1001;border-radius:3px}.modal-dialog__content{min-width:300px;max-width:500px;margin:0 auto}.samples-list{max-width:500px;margin:1em auto;padding:0 1em}.samples-list__sample{margin-bottom:10px}.round-button--record:before{content:"";display:block;width:25px;height:25px;border-radius:50%;background-color:#ff3b30;line-height:0}.round-button--record.active{animation:pulse 1.5s infinite;background-color:#ff3b30}.round-button--record.active:before{background-color:#fff}@keyframes pulse{0%{box-shadow:0 0 #ff3b3066}70%{box-shadow:0 0 0 15px #ff3b3000}to{box-shadow:0 0 #ff3b3000}}.round-button--upload{position:relative}.round-button--upload .inner{position:absolute;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.round-button--upload .inner svg{margin-top:3px;margin-left:3px}.round-button--upload input{display:block;width:100%;height:100%;opacity:0}.sequencer-list{width:80vw;max-width:800px;margin:2rem auto}.sequencer-list__layer{display:grid;grid-template-columns:repeat(9,1fr);margin-bottom:10px;gap:10px}.sequencer-list__step{width:100%;aspect-ratio:1 / 1;background-color:#ffffff1a}.sequencer-list__step.filled{background-color:#ffffffb3}.sequencer-list__step.active{background-color:#765cec33}.sequencer-list__step.filled.active{background-color:#6e22fb}.sequencer-list__step--delete{width:100%;aspect-ratio:1 / 1;position:relative;background-color:#fff0}.sequencer-list__step--delete:before,.sequencer-list__step--delete:after{content:"";position:absolute;left:calc(50% - 1px);width:2px;height:100%;background-color:#ffffff80}.sequencer-list__step--delete:before{transform:rotate(45deg)}.sequencer-list__step--delete:after{transform:rotate(-45deg)}.round-button--play:after{content:"";position:absolute;width:0px;height:0px;border-style:solid;border-width:10px 0 10px 20px;border-color:transparent transparent transparent currentColor;transform:rotate(0)}.round-button--pause:before{content:"";position:absolute;width:6px;height:20px;background-color:currentColor;transform:translate(-4px)}.round-button--pause:after{content:"";position:absolute;width:6px;height:20px;background-color:currentColor;transform:translate(5px)}.round-button--plus{position:relative}.round-button--plus:before,.round-button--plus:after{content:"";position:absolute;top:50%;left:50%;background-color:currentColor}.round-button--plus:after{width:24px;height:2px;margin-left:-12px;margin-top:-1px}.round-button--plus:before{width:2px;height:24px;margin-top:-12px;margin-left:-1px}