*{box-sizing:border-box}body{font-family:"Roboto",sans-serif}.app-wrapper{padding:1rem;transition:.2s}.theme-light .app-wrapper{background-color:#f0f0f0;color:#333}.theme-dark .app-wrapper{background-color:#424242;color:#fff}a{transition:.3s;text-decoration:none}.theme-light a{color:#333}.theme-dark a{color:#fff}.theme-light a:visited{color:#333}.theme-dark a:visited{color:#fff}.theme-light a:hover{color:#666}.theme-dark a:hover{color:#ccc}.navbar{display:flex;justify-content:space-between;align-items:center}button,label.cb-label{cursor:pointer;border:0;padding:.5rem;transition:.2s;border-radius:5px}.theme-light button{background-color:#f0f0f0;box-shadow:-3px -3px 5px #fff,3px 3px 5px #ccc;color:#333}.theme-dark button{background-color:#424242;box-shadow:-3px -3px 5px #595959,3px 3px 5px #393939;color:#fff}button.btn-circle{border-radius:50%;display:grid;place-content:center;width:3rem;height:3rem;min-width:3rem}button.btn-circle.large{height:6rem;width:6rem;font-size:2rem}.theme-light button:hover{background-color:#f0f0f0;box-shadow:-1px -1px 3px #fff,1px 1px 3px #ccc}.theme-dark button:hover{background-color:#424242;box-shadow:-1px -1px 3px #595959,1px 1px 3px #393939}.app{flex-direction:column;min-height:calc(100vh - 4rem);max-width:768px;margin:auto}.app,.tempo-input-row{display:flex;justify-content:space-between}.tempo-input-row{align-items:center;padding:3rem 0 1rem}.tempo-input-row .tempo-label span:first-child{font-size:4rem}.play-row{justify-content:center;padding:2rem 0}.play-row,.visualizer{display:flex;align-items:center}.visualizer{flex:1 1;height:100%}.visualizer canvas{width:100%}.settings-row{display:flex;justify-content:space-between;align-items:center}.select-wrapper{position:relative;flex:1 1;min-width:5.5rem}.select-wrapper:nth-child(2){padding-left:2rem;min-width:7.5rem}.select-wrapper select{-webkit-appearance:none;appearance:none;position:relative;cursor:pointer;transition:.2s;border:0;border-radius:5px;padding:1rem;width:100%}.theme-light .select-wrapper select{background-color:#f0f0f0;box-shadow:-3px -3px 5px #fff,3px 3px 5px #ccc;color:#333}.theme-dark .select-wrapper select{background-color:#424242;box-shadow:-3px -3px 5px #595959,3px 3px 5px #393939;color:#fff}.theme-light .select-wrapper select:hover{background-color:#f0f0f0;box-shadow:-1px -1px 3px #fff,1px 1px 3px #ccc}.theme-dark .select-wrapper select:hover{background-color:#424242;box-shadow:-1px -1px 3px #595959,1px 1px 3px #393939}.select-wrapper:after{content:"";position:absolute;right:1rem;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);border-right:5px solid transparent;border-left:5px solid transparent}.theme-light .select-wrapper:after{border-top:5px solid #333}.theme-dark .select-wrapper:after{border-top:5px solid #fff}input[type=range]{-webkit-appearance:none;width:100%;background:transparent;margin:1rem 0 2rem}input[type=range]:focus{outline:none}input[type=range]::-ms-track{background:transparent;color:transparent}input[type=range]::-webkit-slider-runnable-track{width:100%;height:1rem;cursor:pointer;border-radius:5px}.theme-light input[type=range]::-webkit-slider-runnable-track{background-color:#f0f0f0;box-shadow:inset -3px -3px 5px #fff,inset 3px 3px 5px #ccc}.theme-dark input[type=range]::-webkit-slider-runnable-track{background-color:#424242;box-shadow:inset -3px -3px 5px #595959,inset 3px 3px 5px #393939}input[type=range]::-moz-range-track{width:100%;height:1rem;cursor:pointer;border-radius:5px}.theme-light input[type=range]::-moz-range-track{background-color:#f0f0f0;box-shadow:inset -3px -3px 5px #fff,inset 3px 3px 5px #ccc}.theme-dark input[type=range]::-moz-range-track{background-color:#424242;box-shadow:inset -3px -3px 5px #595959,inset 3px 3px 5px #393939}input[type=range]::-ms-track{width:100%;height:1rem;cursor:pointer;border-color:transparent;border-width:0;border-radius:5px}.theme-light input[type=range]::-ms-track{background-color:#f0f0f0;box-shadow:inset -3px -3px 5px #fff,inset 3px 3px 5px #ccc}.theme-dark input[type=range]::-ms-track{background-color:#424242;box-shadow:inset -3px -3px 5px #595959,inset 3px 3px 5px #393939}input[type=range]::-ms-fill-lower{border:0;border-radius:0}.theme-light input[type=range]::-ms-fill-lower{background-color:#f0f0f0}.theme-dark input[type=range]::-ms-fill-lower{background-color:#424242}.theme-light input[type=range]:focus::-ms-fill-lower{background:#f0f0f0}.theme-dark input[type=range]:focus::-ms-fill-lower{background:#424242}input[type=range]::-ms-fill-upper{border:0;border-radius:0}.theme-light input[type=range]::-ms-fill-upper{background-color:#f0f0f0}.theme-dark input[type=range]::-ms-fill-upper{background-color:#424242}.theme-light input[type=range]:focus::-ms-fill-upper{background:#f0f0f0}.theme-dark input[type=range]:focus::-ms-fill-upper{background:#424242}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;border:0;width:3rem;height:1.5rem;border-radius:1rem;cursor:pointer;margin-top:-3px}.theme-light input[type=range]::-webkit-slider-thumb{background:#333;box-shadow:-3px -3px 5px #fff,3px 3px 5px #ccc}.theme-dark input[type=range]::-webkit-slider-thumb{background:#fff;box-shadow:-3px -3px 5px #595959,3px 3px 5px #393939}input[type=range]::-moz-range-thumb{border:0;width:3rem;height:1.5rem;border-radius:1rem;margin-top:-3px}.theme-light input[type=range]::-moz-range-thumb{background:#333;box-shadow:-3px -3px 5px #fff,3px 3px 5px #ccc}.theme-dark input[type=range]::-moz-range-thumb{background:#fff;box-shadow:-3px -3px 5px #595959,3px 3px 5px #393939}input[type=range]::-ms-thumb{border:0;width:3rem;height:1.5rem;border-radius:1rem;margin-top:-3px;cursor:pointer}.theme-light input[type=range]::-ms-thumb{background:#333;box-shadow:-3px -3px 5px #fff,3px 3px 5px #ccc}.theme-dark input[type=range]::-ms-thumb{background:#fff;box-shadow:-3px -3px 5px #595959,3px 3px 5px #393939}footer{width:100%;text-align:center;margin-top:3rem}@media only screen and (min-width:321px){.app-wrapper{padding:2rem}}@media only screen and (min-width:769px){.app-wrapper{padding:5rem 0}.theme-light .app-wrapper{background-color:#ccc}.theme-dark .app-wrapper{background-color:#393939}.app{min-height:calc(100vh - 10rem);max-width:480px;padding:2rem}.theme-light .app{background-color:#f0f0f0}.theme-dark .app{background-color:#424242}}
/*# sourceMappingURL=main.121dff72.chunk.css.map */