@import"https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap";@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200";::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{display:none}::-webkit-scrollbar-thumb{background:#ff6bc4;border-radius:10px}*{font-family:Nunito;-webkit-user-select:none;user-select:none}html{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent}body{margin:0;padding:0}.loaderBox{position:fixed;left:0;top:0;width:100%;height:100%;background:#ffffff80;z-index:99}.loader1{position:fixed;left:50%;top:50%;width:80px;height:80px;border-radius:50%;background:#ff3d9b;opacity:.3;transform:translate(-50%,-50%);z-index:99;animation:loaderMaxify .4s ease-in-out}.loader1Reverse{animation:loaderMinify .4s ease-in-out}.loader2{position:fixed;left:50%;top:50%;width:150px;height:150px;border-radius:50%;background:#ff3d9b;opacity:.4;transform:translate(-50%,-50%);z-index:99;animation:loaderMinify .4s ease-in-out}.loader2Reverse{animation:loaderMaxify .4s ease-in-out}.loaderText{position:fixed;left:50%;bottom:0;color:#ff3d9b;opacity:.7;transform:translate(-50%)}.notificationBox{padding:15px 30px;position:fixed;left:50%;top:10%;width:auto;height:auto;text-align:center;font-size:18px;font-weight:700;color:#fff;display:flex;align-items:center;justify-content:center;transform:translate(-50%);border-radius:10px;box-shadow:0 8px 32px #0003;animation:notificationOpen .2s ease-in-out;background:linear-gradient(to bottom right,#ff3d9b,#ff6bc4)}.notificationBoxClose{animation:notificationClose .2s ease-in-out}.alertBoxContainer{width:100%;height:100%;position:fixed;top:0;left:0;background:#ffffff80;display:flex;align-items:center;justify-content:center}.alertBox{padding:50px;position:fixed;width:400px;max-width:60%;height:auto;background:#fff;border-radius:10px;box-shadow:0 8px 32px #0003;display:flex;flex-direction:column;align-items:center;animation:alertOpen .5s cubic-bezier(.68,-1.55,.27,1.55)}.alertBoxClose{animation:alertClose .5s cubic-bezier(.68,-1.55,.27,1.55)}.alertTitle{margin:0;text-align:center;color:#ff6bc4}.alertText{margin:30px 0;text-align:center;font-size:16px}.alertButton{width:150px;height:50px;border-left:0px;border-radius:10px;box-shadow:0 4px 16px #0003;display:flex;align-items:center;justify-content:center;background:linear-gradient(to bottom right,#ff3d9b,#ff6bc4);color:#fff;font-weight:700}.alertButton:hover{cursor:pointer}.alertButton:active{opacity:.7}.app{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center}.header{margin:0;width:100%;height:70px;background:linear-gradient(to bottom right,#ff3d9b,#ff6bc4);box-shadow:0 8px 32px #0003;display:flex;align-items:center}.headerIcon{margin:-3px 0 0 13px;font-size:40px;color:#fff}.headerTitle{margin:0 20px 0 -5px;color:#fff}.searchBox{margin:-8px auto 0;display:flex;align-items:center;justify-content:center}.searchInputBox{width:500px;height:30px}.searchInput{width:100%;height:100%;font-size:16px;outline:3px solid #ffadd5;border:4px solid #ff8fc5;border-radius:10px;text-align:center}.searchInput:focus{outline-width:4px;animation:inputFocus .2s ease-in-out}.searchInput::placeholder{color:#ccc}.searchButton{width:0px;height:0px;margin:7px 0 0 20px;padding:20px;background:#ff8fc5;border:4px solid #ffadd5;border-radius:50%;display:flex;align-items:center;justify-content:center}.searchButton:hover{cursor:pointer}.searchButton:active{opacity:.7}.searchButtonIcon{color:#fff;font-size:20px;font-variation-settings:"wght" 600}.searchContainer{position:fixed;top:0;left:0;width:100%;height:100%;background:#ffffff80;z-index:99}.searchBoxBig{width:100%;height:70px;background:linear-gradient(to bottom right,#ff3d9b,#ff6bc4);display:flex;flex-direction:row;align-items:center;justify-content:center}.searchInputBoxBig{margin:-8px 20px 0 8px;width:60%;height:30px;animation:inputActive .2s ease-in-out}.searchInputBig{width:100%;height:100%;font-size:16px;outline:3px solid #ffadd5;border:4px solid #ff8fc5;border-radius:10px;text-align:center}.searchInputBig:focus{outline-width:4px;animation:inputFocus .2s ease-in-out}.searchInputBig::placeholder{color:#ccc}.searchButtonBig{margin:0 5px 0 0;width:0px;height:0px;padding:20px;background:#ff8fc5;border:4px solid #ffadd5;border-radius:50%;display:flex;align-items:center;justify-content:center}.searchButtonBig:hover{cursor:pointer}.searchButtonBig:active{opacity:.7}.backButtonBig{margin:0 0 0 4px;width:0px;height:0px;padding:20px;background:#ff8fc5;border:4px solid #ffadd5;border-radius:50%;display:flex;align-items:center;justify-content:center}.backButtonBig:hover{cursor:pointer}.backButtonBig:active{opacity:.7}.iconContainer{margin:0 20px 0 auto;display:flex;flex-direction:row;align-items:center;justify-content:center;color:#fff}.searchMiniButton{margin:0 10px 0 0;width:35px;height:35px;background:#ff8fc5;border:4px solid #ffadd5;border-radius:50%;display:flex;align-items:center;justify-content:center}.searchMiniButton:hover{cursor:pointer}.searchMiniButton:active{filter:brightness(1.2)}.searchMiniIcon{font-size:20px;font-variation-settings:"wght" 600}.homeMiniButton{margin:5px 15px 0 0}.homeMiniButton:hover{cursor:pointer}.homeMiniButton:active{opacity:.7}.homeMiniIcon{font-size:27px;font-variation-settings:"FILL" 1}.menuMiniButton{margin:5px 0 0}.menuMiniButton:hover{cursor:pointer}.menuMiniButton:active{opacity:.7}.menuMiniIcon{font-size:30px;font-variation-settings:"wght" 600}.menuBox{position:fixed;top:0;left:0;width:100%;height:100%;background:#ffffff80;z-index:99;display:flex;align-items:center;justify-content:center}.menu{padding:5px;margin:0 0 0 auto;width:300px;max-width:90%;height:100%;background:#fff;box-shadow:0 8px 32px #0003;display:flex;flex-direction:column;align-items:center;animation:menuOpen .2s ease-in-out;overflow-y:auto}.menuClosed{animation:menuClose .2s ease-in-out}.menuCloseButton{padding:0;margin:5px 0 0 auto}.menuCloseButton:hover{cursor:pointer}.menuCloseButton:active{color:#ddd}.menuCloseIcon{font-size:30px}.menuLogo{margin:20px 0 10px;color:#ff6bc4;display:flex;flex-direction:row;align-items:center}.menuLogoIcon{margin:-3px 0 0;font-size:40px}.menuLogoTitle{margin:0 0 0 -5px}.menuButtonBox{width:100%;height:auto;margin:10px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center}.menuButton{padding:10px;margin:5px 0;width:80%;border-radius:10px;display:flex;flex-direction:row;align-items:center;justify-content:center;background:#f9f9f9;box-sizing:border-box}.menuButton:hover{cursor:pointer}.menuButton:active{opacity:.5}.menuButtonIcon{font-size:25px;font-weight:700;color:#ff6bc4;font-variation-settings:"FILL" 1}.menuHomeIcon{margin:-4px 0 0}.menuArtistsIcon{margin:-2px 0 0}.menuTrendingIcon{margin:-2px -2px 0 0}.menuPlaylistIcon{margin:-1px 0 0}.menuAboutIcon{margin:-2px 0 0}.menuButtonText{margin:0 5px;font-size:20px;font-weight:700;color:#ff6bc4}.menuFooter{margin:auto 0 0;color:#ff6bc4}.content{width:100%;height:0px;display:flex;flex-direction:column;flex-grow:1;justify-content:center}.audioResultTitle{margin:0 20px 20px;align-self:center;color:#aaa}.audios{padding:20px;align-self:center;width:1200px;max-width:80%;height:75%;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:30px;overflow-y:auto}.audio{width:350px;height:200px;border:5px solid #ff6bc4;border-radius:10px;box-shadow:0 4px 8px #0003;display:flex;flex-direction:column;align-items:center;background-color:#000}.audio:hover{cursor:pointer;filter:brightness(1.2)}.audioPlayButtonBox{width:100%;height:70%;display:flex;justify-content:center}.audioPlayButton{margin:auto 0 10px;width:70px;height:70px;background:linear-gradient(to bottom right,#ff3d9b,#ff6bc4);display:flex;align-items:center;justify-content:center;border:5px solid #fff;border-radius:50%;opacity:.8}.audioPlayButtonIcon{font-size:35px;font-variation-settings:"FILL" 1;color:#fff}.audioTitleBox{width:100%;height:30%;background:#0009;border-radius:0 0 5px 5px;display:flex;align-items:center;justify-content:center}.audioTitle{margin:20px;font-size:12px;font-weight:700;color:#fff;word-break:break-word}.player{width:100%;height:100%;display:flex;flex-direction:column;align-items:center}.playerData{margin:50px 0;width:400px;max-width:90%;height:0px;border-radius:10px;display:flex;flex-grow:1;flex-direction:column;align-items:center;justify-content:center}.playerThumbnailBox{width:100%;height:80%;max-height:400px;border-radius:10px;background:#000;box-shadow:0 4px 8px #0003;position:relative;overflow:hidden;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.playerThumbnailBox:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:inherit;box-shadow:0 4px 8px #0003;filter:blur(10px);z-index:-1}.playerThumbnail{width:100%;height:100%;object-fit:contain}.playerTitleBox{width:100%;height:auto;display:flex;align-items:center;justify-content:center}.playerTitle{margin:30px 20px;font-size:15px;font-weight:700;color:#000}.playerButtons{margin:0;width:100%;height:5%;display:flex;flex-direction:row;flex-grow:1;justify-content:center}.playerUndoButton,.playerFavoriteButton{margin:0 5px;width:50px;min-width:50px;height:50px;min-height:50px;background:#ff6bc4;border-radius:50%;box-shadow:0 4px 8px #0003;display:flex;align-items:center;justify-content:center}.playerUndoButton:hover,.playerFavoriteButton:hover{cursor:pointer}.playerUndoButton:active,.playerFavoriteButton:active{opacity:.7}.playerUndoButtonIcon{color:#fff;font-size:23px;font-variation-settings:"FILL" 1}.playerFavoriteButtonIcon{color:#fff;font-size:20px;font-variation-settings:"FILL" 1}.playlistOptionsContainer{width:100%;height:100%;position:fixed;top:0;left:0;background:#ffffff80;display:flex;align-items:center;justify-content:center;z-index:99}.playlistOptionsBox{width:400px;max-width:90%;height:400px;max-height:90%;background:#fff;border-radius:10px;box-shadow:0 8px 32px #0003;display:flex;flex-direction:column;align-items:center;opacity:1;animation:playlistOptionsBoxOpen .2s ease-in-out}.playlistOptionsBoxClosed{animation:playlistOptionsBoxClose .2s ease-in-out}.playlistOptions{width:80%;height:55%;border:5px solid #f9f9f9;border-radius:10px;display:flex;align-items:center;justify-content:center}.playlistOptionsWrapper{width:95%;height:90%;display:flex;flex-direction:column;align-items:center;overflow-y:auto}.playlistOption{margin:5px 0;padding:10px 20px;text-align:center;font-size:15px;word-break:break-word;width:70%;height:auto;min-height:30px;background:#f9f9f9;border-radius:10px;display:flex;align-items:center;justify-content:center}.playlistOption:hover{cursor:pointer}.playlistOption:active{opacity:.5}.playlistOptionRemove{color:#fff;background:#ff6bc4}.playlistOptionsCancelButton{margin:20px 5px;width:100px;min-width:100px;height:40px;min-height:40px;background:#ff6bc4;border-radius:10px;box-shadow:0 2px 8px #0003;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}.playlistOptionsCancelButton:hover{cursor:pointer}.playlistOptionsCancelButton:active{opacity:.7}.playerControls{width:100%;height:120px;background:#fff;display:flex;flex-direction:column;align-items:center;box-shadow:0 8px 32px #0003}.playerProgress{margin:0 0 0 auto;width:100%;height:15px;box-shadow:inset 0 2px 4px #0003;display:flex;flex-direction:row}.playerProgress:hover{cursor:pointer}.playerProgressBar{width:1%;height:100%;border-radius:0 10px 10px 0;background:#ff3d9b;box-shadow:0 2px 4px #0003}.playerButtonBox{display:flex;flex-direction:row;align-items:center}.playerPlayButton,.playerForwardButton,.playerBackButton,.playerPlaybackButton,.playerNextButton{margin:15px 0 0;width:70px;height:70px;background:#ff3d9b;border-radius:50%;box-shadow:0 4px 8px #0003;display:flex;align-items:center;justify-content:center}.playerPlayButton:hover,.playerForwardButton:hover,.playerBackButton:hover,.playerPlaybackButton:hover,.playerNextButton:hover{cursor:pointer}.playerPlayButton:active,.playerForwardButton:active,.playerBackButton:active,.playerPlaybackButton:active,.playerNextButton:active{opacity:.7}.playerPlayButtonIcon,.playerForwardButtonIcon,.playerBackButtonIcon,.playerPlaybackButtonIcon,.playerNextButtonIcon{color:#fff;font-size:30px;font-variation-settings:"FILL" 1}.playerForwardButton,.playerNextButton{margin:15px 0 0 5px;width:50px;height:50px}.playerBackButton,.playerPlaybackButton{margin:15px 5px 0 0;width:50px;height:50px}.playerForwardButtonIcon,.playerNextButtonIcon{font-size:25px}.playerPlaybackShuffleButtonIcon{font-size:22px}.playerPlaybackRepeatButtonIcon{font-size:21px}.playerPlaybackStopButtonIcon{font-size:22px}.playlists{padding:20px;align-self:center;width:1200px;max-width:80%;height:80%;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:30px;overflow-y:auto}.playlistAddButton{width:350px;height:200px;border:5px solid #ff3d9b;border-radius:10px;box-shadow:0 4px 8px #0003;display:flex;flex-direction:column;align-items:center;background-color:#ff3d9b}.playlistAddButton:hover{cursor:pointer}.playlistAddButton:active{opacity:.7}.playlistIcon{margin:60px 0 0;color:#fff;font-size:40px}.playlistText{text-align:center;margin:10px 20px;color:#fff;font-size:20px;font-weight:700;word-break:break-word}.playlistNameContainer{width:100%;height:100%;position:fixed;top:0;left:0;background:#ffffff80;display:flex;align-items:center;justify-content:center;z-index:99}.playlistNameBox{width:400px;max-width:90%;height:210px;background:#fff;border-radius:10px;box-shadow:0 8px 32px #0003;display:flex;flex-direction:column;align-items:center}.playlistNameTitle{margin:30px 0 20px;color:#ff6bc4}.playlistInputBox{width:200px;height:20px;display:flex;align-items:center;justify-content:center}.playlistNameInput{padding:5px;text-align:center;width:100%;height:100%;outline:none;border:none;border-bottom:3px solid #ff6bc4;font-size:16px}.playlistNameInput:focus{border-width:4px;animation:miniInputAnimation .2s ease-in-out}.playlistNameInput::placeholder{color:#ccc}.playlistButtons{margin:30px 0 0;display:flex;flex-direction:row;align-items:center;justify-content:center}.playlistNameButton,.playlistNameCancelButton{margin:0 5px;width:100px;height:40px;background:#ff6bc4;border-radius:10px;box-shadow:0 2px 8px #0003;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}.playlistNameButton:hover,.playlistNameCancelButton:hover{cursor:pointer}.playlistNameButton:active,.playlistNameCancelButton:active{opacity:.7}.playlist{width:350px;height:200px;border:5px solid #ff6bc4;border-radius:10px;box-shadow:0 4px 8px #0003;display:flex;flex-direction:column;align-items:center;background-color:#ff6bc4}.playlist:hover{cursor:pointer}.playlist:active{opacity:.7}.upNext{position:fixed;top:50%;left:0;width:300px;height:200px;background:#fff;border-radius:0 10px 10px 0;box-shadow:0 8px 32px #0003;z-index:98;display:flex;flex-direction:column;align-items:center;transform:translateY(-50%);animation:upNextOpen .2s ease-in-out}.upNextClosed{height:60px;transform:translate(-250px,-50%);animation:upNextClose .2s ease-in-out}.upNextHeader{margin:15px 0 5px;width:100%;display:flex;flex-direction:row;align-items:center;justify-content:center}.upNextTitle{margin:0 0 0 15px;color:#ff6bc4}.upNextButton{margin:-5px 15px 0 auto;width:30px;height:30px;background:#ff6bc4;border-radius:10px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px #0003}.upNextButton:hover{cursor:pointer}.upNextButton:active{opacity:.7}.upNextButtonIcon{color:#fff;font-size:20px}.upNextSongBox{margin:0;width:100%;display:flex;flex-grow:1;flex-direction:row;align-items:center;justify-content:center;opacity:1;animation:upNextSongBoxOpen .2s ease-in-out}.upNextSongBoxClosed{opacity:0;animation:upNextSongBoxClose .2s ease-in-out}.upNextThumbnailBox{margin:0 0 0 20px;width:80px;min-width:80px;height:50px;min-height:50px;display:flex;align-items:center;justify-content:center;border-radius:10px;box-shadow:0 4px 16px #0003}.upNextTumbnail{width:100%;height:100%;border-radius:10px}.upNextSongTitle{margin:0 30px 0 20px;font-weight:700;font-size:14px;word-break:break-word}.upNextPlaylist{text-align:center;font-size:14px;font-weight:700;margin:0 0 20px;opacity:1;color:#ff6bc4;animation:upNextSongBoxOpen .2s ease-in-out}.upNextPlaylistClosed{opacity:0;animation:upNextSongBoxClose .2s ease-in-out}@media screen and (max-height: 600px){.playerData{width:70%;margin:20px 0;flex-direction:row}.playerThumbnailBox{width:30%;height:80%}.playerTitleBox{width:60%;height:100%;align-items:center}.playerButtons{width:10%;height:100%;flex-direction:column;align-items:normal;justify-content:center}.playerUndoButton,.playerFavoriteButton{margin:5px 0}}@media screen and (max-width: 1000px){.searchBox{max-width:50%}}@media screen and (max-width: 600px){.searchBox{display:none}}@media screen and (max-width: 700px){.homeMiniButton{display:none}}@media screen and (min-width: 600px){.searchMiniButton{display:none}}@keyframes inputActive{0%{width:0}to{width:60%}}@keyframes inputFocus{0%{outline-width:0}to{outline-width:4px}}@keyframes miniInputAnimation{0%{border-width:0}to{border-width:4px}}@keyframes menuOpen{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes menuClose{0%{transform:translate(0)}to{transform:translate(100%)}}@keyframes upNextOpen{0%{transform:translate(-250px,-50%);height:70px}to{transform:translateY(-50%);height:200px}}@keyframes upNextClose{0%{transform:translateY(-50%);height:200px}to{transform:translate(-250px,-50%);height:70px}}@keyframes upNextSongBoxOpen{0%{opacity:0}to{opacity:1}}@keyframes upNextSongBoxClose{0%{opacity:1}to{opacity:0}}@keyframes playlistOptionsBoxOpen{0%{transform:translateY(100%)}to{transform:translate(0)}}@keyframes playlistOptionsBoxClose{0%{transform:translate(0)}to{transform:translateY(100%)}}@keyframes notificationOpen{0%{transform:translate(-50%,100%);opacity:0}to{transform:translate(-50%);opacity:1}}@keyframes notificationClose{0%{opacity:1}to{opacity:0}}@keyframes alertOpen{0%{transform:translateY(-100%)}to{transform:translate(0)}}@keyframes alertClose{0%{transform:translate(0);opacity:1}to{transform:translateY(-100%);opacity:0}}@keyframes loaderMaxify{0%{width:80px;height:80px}to{width:150px;height:150px}}@keyframes loaderMinify{0%{width:150px;height:150px}to{width:80px;height:80px}}
