body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}*{outline:none;border:none;transition:all .35s ease-out;font-family:"Roboto",sans-serif;text-decoration:none}.home-wrapper{background:#212121;padding-bottom:16px;width:100vw;display:flex;justify-content:center;align-items:center;overflow:hidden;position:relative}.home-wrapper.isPlaying{padding-bottom:100px}.home-wrapper .home-container{height:100%;width:100%;padding:0 16px;position:relative}.home-wrapper .home-container .empty{height:90vh;width:100%;display:flex;justify-content:center;align-items:center}.home-wrapper .home-container .empty h1{font-size:32px;color:#fff;font-weight:400}.home-wrapper .home-container .search-results{position:relative;margin-top:80px;z-index:50;display:-ms-grid;display:grid;-ms-grid-columns:1fr 1fr;grid-template-columns:1fr 1fr;grid-gap:16px;gap:16px;overflow-y:scroll}.home-wrapper .home-container .similar-artists{position:relative;margin-top:30px;-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);height:20%;border-radius:10px;width:100%;z-index:50}.home-wrapper .home-container .similar-artists h1{margin:0;font-size:20px;color:#fff;display:inline-block;padding:4px 8px;border-radius:6px 0 0 6px}.home-wrapper .home-container .similar-artists .artists{margin-top:24px;width:100%;display:-ms-grid;display:grid;-ms-grid-columns:1fr 1fr 1fr;grid-template-columns:1fr 1fr 1fr}.home-wrapper .home-container .query-wrapper{background-color:rgba(0,0,0,.75);z-index:100;position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;height:100vh;width:100vw}.home-wrapper .home-container .query-wrapper.hide{z-index:10;background-color:transparent}.home-wrapper .home-container .query-wrapper.hide .query-container{justify-content:flex-start;-webkit-transform:translateY(0);transform:translateY(0)}.home-wrapper .home-container .query-wrapper .query-container{display:flex;justify-content:center;align-items:flex-end;position:absolute;top:16px;left:16px;width:90%;-webkit-transform:translateY(40vh);transform:translateY(40vh)}.home-wrapper .home-container .query-wrapper .query-container input{height:45px;width:100%;background-color:transparent;font-size:28px;border-bottom:1px solid #c8c8c8;color:#fff;text-align:center}.home-wrapper .home-container .query-wrapper .query-container i{color:#fff;padding:7.5px;font-size:32px;border-bottom:1px solid #c8c8c8}.track-wrapper{z-index:9}.track-wrapper img{height:auto;width:100%;object-fit:cover;border-radius:10px;margin-bottom:8px}.track-wrapper h1{margin:0;width:100%;font-size:16px;color:#fff}.track-wrapper p{margin:4px 0 0;width:100%;font-size:14px;color:#777}.artist-wrapper{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.artist-wrapper img{height:75px;width:75px;border-radius:50%;object-fit:cover}.artist-wrapper h3{text-align:center;margin:8px 0 0;font-size:16px;color:#fff;font-weight:400}.artist-wrapper p{text-align:center;margin:4px 0 0;width:75%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:14px;color:#777}.mp-wrapper{position:fixed;width:85%;background-color:rgba(82,84,86,.5);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-radius:40px;z-index:85;bottom:16px;padding:12px 16px}.mp-wrapper .mp-container{display:flex;justify-content:space-between;align-items:center}.mp-wrapper .mp-container img{width:50px;height:50px;object-fit:cover;border-radius:8px;margin-right:12px}.mp-wrapper .mp-container .mp-si{width:85%;display:flex;overflow:hidden;flex-direction:column;justify-content:flex-start}.mp-wrapper .mp-container .mp-si h2{font-size:24px;font-weight:300px;width:100%;margin:0;color:#c8c8c8;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.mp-wrapper .mp-container .mp-si p{margin:4px 0 0;width:100%;font-size:14px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#bdbdbd}.mp-wrapper .mp-container i{margin-left:16px;font-size:48px;color:#eee}.auth-wrapper{height:100vh;width:100vw;background-image:linear-gradient(180deg,#1db954,#061700)}.auth-wrapper,.auth-wrapper .auth-container{display:flex;justify-content:center;align-items:center}.auth-wrapper .auth-container{flex-direction:column}.auth-wrapper .auth-container.show h1{-webkit-animation:text .5s ease-out 1s both;animation:text .5s ease-out 1s both}.auth-wrapper .auth-container.show .cta{-webkit-animation:cta .35s ease-out 1.75s both;animation:cta .35s ease-out 1.75s both}.auth-wrapper .auth-container.show .guest-cta{-webkit-animation:guest .35s ease-out 2.75s both;animation:guest .35s ease-out 2.75s both}.auth-wrapper .auth-container h1{margin:0;color:#fff;font-size:32px;line-height:40px;width:75%;font-weight:300;text-align:center;letter-spacing:1.75px}.auth-wrapper .auth-container .cta{height:50px;border-radius:30px;background:rgba(0,0,0,.5);display:flex;justify-content:center;position:relative;padding:0 16px 0 0;margin-top:35px;align-items:center;-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);cursor:pointer}.auth-wrapper .auth-container .cta:hover{background:hsla(0,0%,46.7%,.5)}.auth-wrapper .auth-container .cta img{left:0;height:50px;width:50px;border-radius:50%;object-fit:contain}.auth-wrapper .auth-container .cta p{margin:0 0 0 8px;color:#fff;font-size:24px;font-weight:300;text-align:center}.auth-wrapper .auth-container .guest-cta{height:50px;border-radius:30px;background:rgba(0,0,0,.5);display:flex;justify-content:center;padding:0 0 0 16px;position:relative;margin-top:35px;align-items:center;-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);cursor:pointer}.auth-wrapper .auth-container .guest-cta p{margin-right:12px;color:#fff}.auth-wrapper .auth-container .guest-cta i{background-color:#fff;padding:13px;font-size:24px;border-radius:50%}@-webkit-keyframes text{0%{opacity:0;-webkit-transform:translateY(-50px);transform:translateY(-50px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes text{0%{opacity:0;-webkit-transform:translateY(-50px);transform:translateY(-50px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes cta{0%{opacity:0;-webkit-transform:translateY(50px);transform:translateY(50px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes cta{0%{opacity:0;-webkit-transform:translateY(50px);transform:translateY(50px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes guest{0%{opacity:0}to{opacity:1}}@keyframes guest{0%{opacity:0}to{opacity:1}}
/*# sourceMappingURL=main.51745d93.chunk.css.map */