.Icon{width:3vw;height:3vw;stroke:currentColor}.Home{display:flex;justify-content:center;align-items:center;flex-direction:column;height:100vh}.Home .logo{width:50vw}.Home .loader{position:relative;margin-bottom:20px;width:10vw;border-radius:1px;height:2px;background-color:hsla(0,0%,80%,.13333333333333333)}.Home .loader:after{content:"";position:absolute;height:2px;left:0;top:0;border-radius:1px;width:calc(var(--progress)*0.1vw);background-color:#ccc;transition:.3s linear}.Home .loading{text-align:center;position:absolute;bottom:60px;display:flex;flex-direction:column;align-items:center}.Home .loading p{margin:0}.Home .start{position:absolute;bottom:60px;margin:0;transition:.5s}.Home .start p{margin:0}.MoodChoice h2{left:3vw;right:3vw;bottom:3vw;text-align:center;position:absolute;font-size:1.8vw;font-weight:400;margin:0}.MoodChoice .choices{display:flex;justify-content:space-evenly;align-items:center;height:100vh}.MoodChoice .choices .choice{text-align:center;width:12vw}.MoodChoice .choices .choice button{height:8vw;width:8vw;border:none;border-radius:50%;padding:0}.MoodChoice .choices .choice button:hover+p{color:#fff}.TempoChoice h2{left:3vw;right:3vw;bottom:3vw;text-align:center;position:absolute;font-size:1.8vw;font-weight:400;margin:0}.TempoChoice .choices{display:flex;justify-content:center;align-items:center;height:100vh}.TempoChoice .choices .choice{text-align:center;width:20vw}.TempoChoice .choices .nav{width:3vw;height:3vw;border-radius:1.5vw;border:1px solid currentColor}.TempoChoice .choices .next{position:absolute;height:3.5vw;width:5vw;border-radius:2vw;border:1px solid currentColor;top:calc(50vh + 4vw);text-align:center;font-size:1.2vw;line-height:3vw}.trackcanvas{width:15vw;height:15vw}.TracksSlider{display:flex;justify-content:center;align-items:center;height:100vh}.TracksSlider h2{left:3vw;right:3vw;bottom:3vw;text-align:center;position:absolute;font-size:1.8vw;font-weight:400;margin:0}.TracksSlider.some-actives .track:not(.active){opacity:.5}.TracksSlider .track{display:flex;align-items:center;margin:0 30px}.TracksSlider .track:not(.active)>button .track-canvas{scale:.6;margin-top:30px}.TracksSlider .track:not(.active)>button p{opacity:0}.TracksSlider .track>button{background:none;border:none}.TracksSlider .track>button .track-canvas{transition:.5s}.TracksSlider .track>button p{text-transform:capitalize;text-align:center}.TracksSlider .track .catalog-wrapper{position:relative;height:calc(100vh - 200px);width:25vw;margin-left:20px;overflow:hidden;transition:.7s cubic-bezier(.075,.82,.165,1);border:1px solid hsla(0,0%,100%,.13333333333333333);border-radius:20px}.TracksSlider .track .catalog-wrapper .catalog{position:absolute;width:25vw;overflow-x:hidden;overflow-y:auto}.TracksSlider .track .catalog-wrapper .catalog .sample{display:inline-block;width:10vw;margin:1.25vw}.TracksSlider .track .catalog-wrapper .catalog .sample p{margin:0}.TracksSlider .track .catalog-wrapper .catalog .sample .loop-canvas{width:10vw;height:10vw}.TracksSlider .grow-x-enter,.TracksSlider .grow-x-leave-to{margin-left:0!important;padding-left:0!important;margin-right:0!important;padding-right:0!important;width:0!important;opacity:0!important}.controls{position:absolute;top:1vw;right:1vw}.controls button{height:3vw;min-width:3vw}.controls .line{width:10vw;height:2px;background-color:hsla(0,0%,80%,.2);position:fixed;top:2.5vw;left:45vw}.controls .line .inner{height:100%;background-color:#ccc;-webkit-animation-name:forward;animation-name:forward;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-play-state:paused;animation-play-state:paused}@-webkit-keyframes forward{0%{width:0}to{width:100%}}@keyframes forward{0%{width:0}to{width:100%}}.Visualizer{height:100vh;display:flex;justify-content:center;align-items:center}.Visualizer .drgmg{position:absolute;display:none}.Visualizer .dancer{position:absolute;cursor:pointer;width:20vw;height:20vw}.Visualizer .dancer--muted{opacity:.5}.Visualizer .dancer--percs{top:calc(35vh - 7.5vw);left:62.5vw}.Visualizer .dancer--woodwinds{top:calc(65vh - 7.5vw);left:42.5vw}.Visualizer .dancer--pad{top:calc(25vh - 7.5vw);left:42.5vw}.Visualizer .dancer--keys{top:calc(45vh - 7.5vw);left:42.5vw}.Visualizer .dancer--vocals{top:calc(55vh - 7.5vw);left:52.5vw}.Visualizer .dancer--fx{top:calc(45vh - 7.5vw);left:62.5vw}.Visualizer .dancer--strings{top:calc(35vh - 7.5vw);left:52.5vw}.Visualizer .dancer--drums{top:calc(35vh - 7.5vw);left:32.5vw}.Visualizer .dancer--brass{top:calc(55vh - 7.5vw);left:32.5vw}.Visualizer .dancer--bass{top:calc(45vh - 7.5vw);left:22.5vw}.Main .back{position:fixed;top:1vw;left:1vw;height:3vw;min-width:3vw}.Main .canvas .buttons{position:absolute;bottom:60px;width:100%;display:flex;justify-content:space-evenly;align-items:center}.Main .canvas .buttons button{margin:0;transition:.5s}.Main .canvas .buttons button p{margin:0}.TempoCanvas{width:100vw;height:100vh;position:fixed;top:0;left:0;right:0;bottom:0;z-index:-1;opacity:.5}body{margin:0;background-color:#000;color:#ccc;overflow:hidden}a,body,button,input,textarea{font-family:Roboto;font-size:1.8vw}a,button,input,textarea{cursor:pointer}.fade-enter-active,.fade-leave-active{transition:opacity .5s}.fade-enter,.fade-leave-to{opacity:0}img.icon{width:28px;height:28px;margin:4px}button{border:none;background:none;color:currentColor}button:hover{color:#fff}button:disabled{cursor:default;opacity:.4}