.navigation{background-color:var(--black-lv1);justify-content:space-between;align-items:center;width:100%;padding:8px;display:flex;position:relative}.navigation .navigation-left .logo{padding:0 20px}.navigation .navigation-right{justify-content:space-between;align-items:center;gap:20px;font-size:14px;font-weight:600;display:flex}.navigation .navigation-right .isHomeActive{background-color:var(--black-lv3);tranform:translate(-50%, -50%);border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;display:flex}.navigation .navigation-right .search{background-color:var(--black-lv3);border-radius:50px;justify-content:space-between;align-items:center;gap:10px;width:480px;margin-right:40px;padding:10px;display:flex}.navigation .navigation-right .search .icon-search{flex-shrink:0;padding:0 5px;position:relative}.navigation .navigation-right .search .input-search{flex:1;justify-content:space-between;align-items:center;display:flex;position:relative}.navigation .navigation-right .search .input-search input{width:100%;color:var(--white-lv1);background-color:#0000;border:none;outline:none;font-size:16px;line-height:24px}.navigation .navigation-right .search .input-search .closeIcon{cursor:pointer;transition:opacity .3s}.navigation .navigation-right .search .browser{cursor:pointer;flex-shrink:0;padding:0 10px;position:relative}.navigation .navigation-right .search .browser:before{content:"";background-color:var(--white-lv1);width:.5px;height:24px;position:absolute;top:0;left:0}.navigation .navigation-right .explore-premium{background-color:var(--white-lv1);cursor:pointer;border-radius:50px;padding:8px 20px}.navigation .navigation-right .premium,.navigation .navigation-right .support,.navigation .navigation-right .download,.navigation .navigation-right .sign-up{cursor:pointer;white-space:nowrap;color:var(--black-lv4)}.navigation .navigation-right .premium:hover,.navigation .navigation-right .support:hover,.navigation .navigation-right .download:hover,.navigation .navigation-right .sign-up:hover{color:var(--white-lv1)}.navigation .navigation-right .login{background-color:var(--white-lv1);border:3px solid var(--black-lv1);white-space:nowrap;color:var(--black-lv1);border-radius:50px;padding:14px 28px;text-decoration:none;transition:background-color .3s}.navigation .navigation-right .login:hover{border:3px solid var(--white-lv1)}.navigation .navigation-right .download{position:relative}.navigation .navigation-right .download:before{content:"";background-color:var(--white-lv1);width:2px;height:24px;position:absolute;top:-5px;right:-10px}.navigation .navigation-right .install-app{color:var(--black-lv4);white-space:nowrap;cursor:pointer;justify-content:space-between;align-items:center;gap:5px;margin-right:40px;font-weight:600;display:flex}.navigation .navigation-right .install-app:hover{color:var(--white-lv1)}.navigation .navigation-right .icon-install,.navigation .navigation-right .icon-notification,.navigation .navigation-right .icon-friends{padding-top:10px}.navigation .navigation-right .profile{background-color:var(--black-lv3);border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;padding:8px;display:flex}.navigation .navigation-right .profile img{object-fit:cover;border-radius:50%;width:100%;height:100%}.navigation .navigation-left{justify-content:space-between;align-items:center;gap:20px;font-size:14px;font-weight:600;display:flex}.navigation .navigation-left .isHomeActive{background-color:var(--black-lv3);tranform:translate(-50%, -50%);border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;display:flex}.navigation .navigation-left .search{background-color:var(--black-lv3);border-radius:50px;justify-content:space-between;align-items:center;gap:10px;width:480px;margin-right:40px;padding:10px;display:flex}.navigation .navigation-left .search .icon-search{flex-shrink:0;padding:0 5px;position:relative}.navigation .navigation-left .search .input-search{flex:1;justify-content:space-between;align-items:center;display:flex;position:relative}.navigation .navigation-left .search .input-search input{width:100%;color:var(--white-lv1);background-color:#0000;border:none;outline:none;font-size:16px;line-height:24px}.navigation .navigation-left .search .input-search .closeIcon{cursor:pointer;transition:opacity .3s}.navigation .navigation-left .search .browser{flex-shrink:0;padding:0 10px;position:relative}.navigation .navigation-left .search .browser:before{content:"";background-color:var(--white-lv1);width:.5px;height:24px;position:absolute;top:0;left:0}.navigation .navigation-left .explore-premium{background-color:var(--white-lv1);border-radius:50px;padding:8px 20px}.navigation .navigation-left .install-app{color:var(--black-lv4);white-space:nowrap;justify-content:space-between;align-items:center;gap:5px;margin-right:40px;font-weight:600;display:flex}.navigation .navigation-left .icon-install,.navigation .navigation-left .icon-notification,.navigation .navigation-left .icon-friends{padding-top:10px}.navigation .navigation-left .profile{background-color:var(--black-lv3);border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;padding:8px;display:flex}.navigation .navigation-left .profile img{object-fit:cover;border-radius:50%;width:100%;height:100%}.navigation .settings{background-color:var(--black-lv3);color:var(--white-lv1);z-index:1000;border-radius:8px;min-width:200px;position:absolute;top:60px;right:20px}.navigation .settings .setting{cursor:pointer;border-radius:8px;padding:12px 16px;transition:background-color .3s}.navigation .settings .setting:hover{background-color:var(--gray-lv1)}@media (width<=1280px){.navigation .navigation-right .explore-premium,.navigation .navigation-right .install-app,.navigation .navigation-right .premium,.navigation .navigation-right .support,.navigation .navigation-right .download{display:none}}@media (width<=960px){.navigation .navigation-left .search{width:320px}}.leftHomePage{width:calc(27% - 10px);height:100%;padding:var(--padding-lv2);color:var(--white-lv1);background-color:var(--black-lv2);z-index:2;border-radius:5px;font-size:14px;font-weight:700;transition:width .3s linear;position:absolute;top:0;left:10px;overflow-y:scroll}.leftHomePage .leftHeader{justify-content:space-between;align-items:center;display:flex}.leftHomePage .leftHeader .titleShrink{align-items:center;display:flex;position:relative}.leftHomePage .leftHeader .titleShrink .shrinkBtn{opacity:0;cursor:pointer;border-radius:50%;padding:8px;transition:opacity .3s linear,transform .3s linear;transform:translate(-20px)}.leftHomePage .leftHeader .titleShrink .shrinkBtn:hover{background-color:var(--black-lv3)}.leftHomePage .leftHeader .titleShrink .title{transition:opacity .15s linear,transform .15s linear}.leftHomePage .leftHeader .actions{align-items:center;display:flex}.leftHomePage .leftHeader .actions .createBtn{background-color:var(--black-lv3);cursor:pointer;border-radius:30px;padding:10px 20px;font-size:14px;transition:background-color .2s}.leftHomePage .leftHeader .actions .createBtn:hover{background-color:var(--black-lv4)}.leftHomePage .leftHeader .actions .widenBtn{color:var(--white-lv1);cursor:pointer;border-radius:50%;margin-left:10px;padding:10px;transition:background-color .2s}.leftHomePage .leftHeader .actions .widenBtn:hover{background-color:var(--black-lv3)}.leftHomePage:hover .shrinkBtn{opacity:1;transform:translate(0)}.filters{align-items:center;gap:10px;margin-top:20px;display:flex}.filters .filterItem{background-color:var(--black-lv3);cursor:pointer;border-radius:20px;padding:8px 20px;font-size:14px;transition:background-color .2s}.filters .filterItem:hover{background-color:var(--gray-lv1)}.filters .filterItem.active{background-color:var(--white-lv1);color:var(--black-lv1)}.searchList{justify-content:space-between;align-items:center;gap:10px;margin-top:20px;display:flex}.searchList .searchBox{background-color:var(--black-lv2);border-radius:4px;flex:1;align-items:center;padding:5px 10px;display:flex;position:relative;overflow:hidden}.searchList .searchBox .searchIcon{z-index:2;justify-content:center;align-items:center;display:flex;position:relative}.searchList .searchBox .searchInput{color:var(--white-lv1);z-index:2;opacity:0;background:0 0;border:none;outline:none;width:100%;margin-left:10px;font-size:14px;transition:opacity .3s linear,transform .3s linear;position:relative;transform:translate(-20px)}.searchList .searchBox .searchInput::placeholder{color:var(--white-lv2)}.searchList .searchBox .clearSearchBtn{z-index:2;cursor:pointer;opacity:0;border-radius:50%;justify-content:center;align-items:center;padding:4px;transition:opacity .2s,transform .2s,background-color .2s;display:flex;position:relative;transform:scale(.8)}.searchList .searchBox .clearSearchBtn:hover{background-color:var(--black-lv4)}.searchList .searchBox .searchOverlay{background-color:var(--black-lv3);z-index:1;pointer-events:none;width:100%;height:100%;transition:transform .3s ease-in-out;position:absolute;top:0;left:0;transform:translate(-100%)}.searchList .searchBox:hover .searchOverlay,.searchList .searchBox.hasText .searchOverlay{transform:translate(0)}.searchList .searchBox:hover .searchInput,.searchList .searchBox.hasText .searchInput{opacity:1;transform:translate(0)}.searchList .searchBox.hasText .clearSearchBtn{opacity:1;transform:scale(1)}.searchList .recentList{cursor:pointer;border-radius:4px;align-items:center;gap:10px;padding:8px;transition:background-color .2s;display:flex}.searchList .recentList:hover{background-color:var(--black-lv3)}.searchList .recentList .recentTitle{font-size:14px;font-weight:600}.followedContent{margin-top:20px}.followedContent .emptyState{text-align:center;color:var(--white-lv2);padding:40px 20px;font-size:14px;font-weight:400}.followedContent .followedSection{margin-bottom:16px}.followedContent .followedSection .sectionTitle{color:var(--white-lv2);text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px;font-size:12px;font-weight:600}.followedContent .followedSection .followedList{flex-direction:column;gap:8px;display:flex}.followedContent .followedSection .followedList .followedItem{cursor:pointer;border-radius:4px;align-items:center;padding:8px;transition:background-color .2s;display:flex}.followedContent .followedSection .followedList .followedItem:hover{background-color:var(--black-lv3)}.followedContent .followedSection .followedList .followedItem .itemImage{background-color:var(--black-lv3);border-radius:4px;width:48px;min-width:48px;height:48px;margin-right:12px;overflow:hidden}.followedContent .followedSection .followedList .followedItem .itemImage.artistImage{border-radius:50%}.followedContent .followedSection .followedList .followedItem .itemImage img{object-fit:cover;width:100%;height:100%;display:block}.followedContent .followedSection .followedList .followedItem .itemInfo{flex:1;overflow:hidden}.followedContent .followedSection .followedList .followedItem .itemInfo .itemName{color:var(--white-lv1);white-space:nowrap;text-overflow:ellipsis;margin-bottom:4px;font-size:14px;font-weight:600;overflow:hidden}.followedContent .followedSection .followedList .followedItem .itemInfo .itemDetails{color:var(--white-lv2);white-space:nowrap;text-overflow:ellipsis;font-size:12px;font-weight:400;overflow:hidden}.leftHomePage::-webkit-scrollbar{width:8px}.leftHomePage::-webkit-scrollbar-track{background:0 0}.leftHomePage::-webkit-scrollbar-thumb{background:var(--black-lv3);border-radius:4px}.leftHomePage::-webkit-scrollbar-thumb:hover{background:var(--black-lv4)}.listWrapper{align-items:center;width:100%;padding:10px 0;display:flex;position:relative;overflow:hidden}.listWrapper .list{white-space:nowrap;scroll-behavior:smooth;gap:10px;transition:transform .3s;display:flex;overflow-x:auto}.listWrapper .scrollBtn{z-index:2;background:var(--black-lv3);color:#fff;cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;font-size:18px;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.listWrapper .scrollBtn.btnSliderLeft{left:0}.listWrapper .scrollBtn.btnSliderRight{right:0}.listWrapper .list::-webkit-scrollbar{display:none}.listWrapper .list{overflow:hidden}.controlListSong{align-items:center;gap:10px;display:flex}.controlListSong .controls{justify-content:space-between;align-items:center;width:100%;display:flex}.controlListSong .controls .left{align-items:center;gap:20px;display:flex}.controlListSong .controls .left .playButton{width:50px;height:50px;color:var(--black-lv1);background:var(--green-lv1);border-radius:50%;justify-content:center;align-items:center;font-size:18px;display:flex}.controlListSong .controls .left .plusCircle,.controlListSong .controls .left .clockCircle,.controlListSong .controls .left .moreCircle{width:24px;height:24px}.controlListSong .controls .left .plusCircle:hover svg,.controlListSong .controls .left .clockCircle:hover svg,.controlListSong .controls .left .moreCircle:hover svg{fill:var(--white-lv1)}.controlListSong .controls .right{align-items:center;gap:10px;display:flex}.albumContainer .albumHeader{background:var(--black-lv3);border-radius:10px;padding:15px;display:flex}.albumContainer .albumHeader .albumPicture img{border-radius:5px;width:150px;height:150px}.albumContainer .albumHeader .albumInfo{flex-direction:column;justify-content:space-between;margin-left:30px;display:flex}.albumContainer .albumHeader .albumInfo .albumTitle{font-size:64px;font-weight:700}.albumContainer .albumHeader .albumInfo .albumDetails{align-items:center;gap:5px;display:flex}.albumContainer .albumHeader .albumInfo .albumDetails .albumUserAvatar{border-radius:50%;width:20px;height:20px}.albumContainer .albumHeader .albumInfo .albumDetails .albumUserName,.albumContainer .albumHeader .albumInfo .albumDetails .albumSongCount,.albumContainer .albumHeader .albumInfo .albumDetails .albumTotalTime{color:var(--white-lv1)}.albumContainer .albumBody{margin-top:10px}.albumContainer .albumBody .songList{margin-top:20px}.albumContainer .albumBody .songList .songItem{justify-content:space-between;display:flex}.albumContainer .albumBody .songList .songItem .songRow{align-items:center;gap:25px;display:flex}.albumContainer .albumBody .songList .songItem .songRow .songIndex{color:var(--white-lv2);line-height:70px}.albumContainer .albumBody .songList .songItem .songRow .songIndex .playButton{width:20px;height:20px;color:var(--while-lv1);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:14px;display:flex}.albumContainer .albumBody .songList .songItem .songRow .songImage img{object-fit:cover;border-radius:5px;width:40px;height:50px}.albumContainer .albumBody .songList .songItem .songRow .songInfo{flex-direction:column;justify-content:center;display:flex}.albumContainer .albumBody .songList .songItem .songRow .songInfo .songArtist{color:var(--white-lv2);font-size:12px}.albumContainer .albumBody .songList .songItem .songDuration{line-height:70px}.albumContainer .albumBody .songList .songItem.active .songRow .playButton,.albumContainer .albumBody .songList .songItem.active .songRow .songTitle{color:var(--green-lv1)}.artistContainer .artistHeader{background:var(--black-lv3);border-radius:10px;padding:15px;display:flex}.artistContainer .artistHeader .artistPicture img{border-radius:5px;width:150px;height:150px}.artistContainer .artistHeader .artistInfo{flex-direction:column;justify-content:space-between;margin-left:30px;display:flex}.artistContainer .artistHeader .artistInfo .artistTitle{font-size:64px;font-weight:700}.artistContainer .artistHeader .artistInfo .artistDetails{align-items:center;gap:5px;display:flex}.artistContainer .artistHeader .artistInfo .artistDetails .artistUserAvatar{border-radius:50%;width:20px;height:20px}.artistContainer .artistHeader .artistInfo .artistDetails .artistUserName,.artistContainer .artistHeader .artistInfo .artistDetails .artistSongCount,.artistContainer .artistHeader .artistInfo .artistDetails .artistTotalTime{color:var(--white-lv1)}.artistContainer .artistBody,.artistContainer .artistBody .title{margin-top:10px}.artistContainer .artistBody .artistSongList .artistSongItem{justify-content:space-between;display:flex}.artistContainer .artistBody .artistSongList .artistSongItem .artistSongRow{align-items:center;gap:25px;display:flex}.artistContainer .artistBody .artistSongList .artistSongItem .artistSongRow .artistSongIndex{color:var(--white-lv2);line-height:70px}.artistContainer .artistBody .artistSongList .artistSongItem .artistSongRow .artistSongIndex .artistPlayButton{width:20px;height:20px;color:var(--while-lv1);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:14px;display:flex}.artistContainer .artistBody .artistSongList .artistSongItem .artistSongRow .artistSongIndex .artistPlayButton .artistEqualizerGif{width:16px;height:16px}.artistContainer .artistBody .artistSongList .artistSongItem .artistSongRow .artistSongImage img{object-fit:cover;border-radius:5px;width:40px;height:50px}.artistContainer .artistBody .artistSongList .artistSongItem .artistSongRow .artistSongInfo{flex-direction:column;justify-content:center;display:flex}.artistContainer .artistBody .artistSongList .artistSongItem .artistSongRow .artistSongInfo .artistSongArtist{color:var(--white-lv2);font-size:12px}.artistContainer .artistBody .artistSongList .artistSongItem .artistSongDuration{line-height:70px}.artistContainer .artistBody .artistSongList .artistSongItem.active .artistSongRow .artistPlayButton,.artistContainer .artistBody .artistSongList .artistSongItem.active .artistSongRow .artistSongTitle{color:var(--green-lv1)}.artistContainer .artistAlbumList .artistAlbumTabs{flex-wrap:wrap;gap:10px;padding:8px 0;display:flex}.artistContainer .artistAlbumList .artistAlbumTabs .albumTab{cursor:pointer;flex-direction:column;align-items:center;margin-top:10px;padding:4px;transition:transform .2s,box-shadow .2s;display:flex}.artistContainer .artistAlbumList .artistAlbumTabs .albumTab:hover{transform:scale(1.05);box-shadow:0 2px 6px #00000026}.artistContainer .artistAlbumList .artistAlbumTabs .albumTab img{object-fit:cover;border-radius:6px;width:150px;height:150px;margin-bottom:4px}.artistContainer .artistAlbumList .artistAlbumTabs .albumTab span{text-align:center;color:var(--text-normal);text-overflow:ellipsis;white-space:nowrap;max-width:70px;font-size:12px;overflow:hidden}.playlistContainer .playlistHeader{background:var(--black-lv3);border-radius:10px;padding:15px;display:flex}.playlistContainer .playlistHeader .playlistPicture img{border-radius:5px;width:150px;height:150px}.playlistContainer .playlistHeader .playlistInfo{flex-direction:column;justify-content:space-between;margin-left:30px;display:flex}.playlistContainer .playlistHeader .playlistInfo .playlistTitle{font-size:64px;font-weight:700}.playlistContainer .playlistHeader .playlistInfo .playlistDetails{align-items:center;gap:5px;display:flex}.playlistContainer .playlistHeader .playlistInfo .playlistDetails .playlistUserAvatar{border-radius:50%;width:20px;height:20px}.playlistContainer .playlistHeader .playlistInfo .playlistDetails .playlistUserName,.playlistContainer .playlistHeader .playlistInfo .playlistDetails .playlistSongCount,.playlistContainer .playlistHeader .playlistInfo .playlistDetails .playlistTotalTime{color:var(--white-lv1)}.playlistContainer .playlistBody{margin-top:10px}.playlistContainer .playlistBody .songList{margin-top:20px}.playlistContainer .playlistBody .songList .songItem{justify-content:space-between;display:flex}.playlistContainer .playlistBody .songList .songItem .songRow{align-items:center;gap:25px;display:flex}.playlistContainer .playlistBody .songList .songItem .songRow .songIndex{color:var(--white-lv2);line-height:70px}.playlistContainer .playlistBody .songList .songItem .songRow .songIndex .playButton{width:20px;height:20px;color:var(--white-lv1);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:14px;display:flex}.playlistContainer .playlistBody .songList .songItem .songRow .songImage img{object-fit:cover;border-radius:5px;width:40px;height:50px}.playlistContainer .playlistBody .songList .songItem .songRow .songInfo{flex-direction:column;justify-content:center;display:flex}.playlistContainer .playlistBody .songList .songItem .songRow .songInfo .songArtist{color:var(--white-lv2);font-size:12px}.playlistContainer .playlistBody .songList .songItem .songDuration{line-height:70px}.playlistContainer .playlistBody .songList .songItem.active .songRow .playButton,.playlistContainer .playlistBody .songList .songItem.active .songRow .songTitle{color:var(--green-lv1)}.searchContainer{width:100%;height:100%;color:var(--white-lv1);background-color:var(--black-lv2);border-radius:8px;overflow-y:auto}.searchContainer .searchHeader{margin-bottom:25px;font-size:26px;font-weight:700}.searchContainer .searchSection .searchTitle{margin-bottom:15px;font-size:22px;font-weight:700}.searchContainer .searchSection .artistItem{text-align:center;border-radius:10px;padding:10px;transition:background .3s;position:relative}.searchContainer .searchSection .artistItem:hover{background:var(--black-lv3)}.searchContainer .searchSection .artistItem .artistImage{margin-bottom:10px}.searchContainer .searchSection .artistItem .artistImage img{object-fit:cover;border-radius:50%;width:150px;height:150px}.searchContainer .searchSection .artistItem .artistName{color:var(--white-lv1);font-size:18px;font-weight:600}.searchContainer .searchSection .albumItem{text-align:left;border-radius:10px;padding:10px;transition:background .3s;position:relative}.searchContainer .searchSection .albumItem:hover{background:var(--black-lv3)}.searchContainer .searchSection .albumItem .albumImage img{object-fit:cover;border-radius:10px;width:150px;height:150px}.searchContainer .searchSection .albumItem .albumName{color:var(--white-lv1);text-overflow:ellipsis;white-space:nowrap;margin-top:10px;font-size:18px;font-weight:600;overflow:hidden}.searchContainer .searchSection .albumItem .albumArtist{color:var(--white-lv2);font-size:14px}.searchContainer .searchSection .songItem{text-align:left;border-radius:10px;padding:10px;transition:background .3s;position:relative}.searchContainer .searchSection .songItem:hover{background:var(--black-lv3)}.searchContainer .searchSection .songItem .songImage img{object-fit:cover;border-radius:10px;width:150px;height:150px}.searchContainer .searchSection .songItem .songTitle{color:var(--white-lv1);text-overflow:ellipsis;white-space:nowrap;max-width:150px;margin-top:10px;font-size:20px;font-weight:600;overflow:hidden}.searchContainer .searchSection .songItem .songArtist{color:var(--white-lv2);font-size:14px}.searchContainer .searchSection .songItem .songPlayButton{width:50px;height:50px;color:var(--black-lv1);opacity:0;background-color:#1ed760;border-radius:50%;justify-content:center;align-items:center;font-size:20px;transition:all .3s;display:flex;position:absolute;bottom:50px;right:10px;transform:translateY(40px)}.searchContainer .searchSection .songItem:hover .songPlayButton{opacity:1;transform:translateY(0)}.searchContainer .noResults{text-align:center;color:var(--white-lv2);margin-top:40px;font-size:18px}@keyframes popupFadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.popupOverlay{z-index:1000;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#000000a6;justify-content:center;align-items:center;animation:.25s ease-out popupFadeIn;display:flex;position:fixed;inset:0}.popupOverlay .popupBox{color:#fff;background:#181818;border-radius:16px;flex-direction:column;gap:24px;width:900px;height:500px;padding:28px;animation:.25s ease-out forwards popupFadeIn;display:flex;box-shadow:0 10px 25px #0009}.popupOverlay .popupBox h2{text-align:center;margin:0;font-size:22px;font-weight:600}.popupOverlay .popupBox .popupContent{flex:1;gap:24px;display:flex;overflow:hidden}.popupOverlay .popupBox .popupContent .leftSection{background:#000;border-radius:10px;flex:1;justify-content:center;align-items:center;display:flex;overflow:hidden}.popupOverlay .popupBox .popupContent .leftSection .coverUpload{cursor:pointer;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.popupOverlay .popupBox .popupContent .leftSection .coverUpload img{object-fit:cover;background:#000;border-radius:10px;width:100%;height:100%}.popupOverlay .popupBox .popupContent .leftSection .coverUpload input{display:none}.popupOverlay .popupBox .popupContent .rightSection{flex-direction:column;flex:1;gap:12px;display:flex}.popupOverlay .popupBox .popupContent .rightSection .inputGroup{flex-direction:column;display:flex}.popupOverlay .popupBox .popupContent .rightSection .inputGroup label{margin-bottom:6px;font-size:15px;font-weight:500}.popupOverlay .popupBox .popupContent .rightSection .inputGroup input{color:#fff;background:#242424;border:1px solid #333;border-radius:8px;padding:10px;font-size:15px;transition:border-color .2s,background .2s}.popupOverlay .popupBox .popupContent .rightSection .inputGroup input:focus{background:#202020;border-color:#1db954;outline:none}.popupOverlay .popupBox .popupContent .rightSection .inputGroup:last-child{flex-direction:column;flex-grow:1;display:flex}.popupOverlay .popupBox .popupContent .rightSection .inputGroup:last-child textarea{color:#fff;resize:none;background:#242424;border:1px solid #333;border-radius:8px;flex-grow:1;padding:10px;font-size:15px;transition:border-color .2s,background .2s}.popupOverlay .popupBox .popupContent .rightSection .inputGroup:last-child textarea:focus{background:#202020;border-color:#1db954;outline:none}.popupOverlay .popupBox .popupActions{justify-content:flex-end;gap:12px;display:flex}.popupOverlay .popupBox .popupActions .cancelBtn,.popupOverlay .popupBox .popupActions .createBtn{cursor:pointer;border:none;border-radius:8px;padding:10px 20px;font-size:15px;font-weight:600;transition:transform .15s,background .2s}.popupOverlay .popupBox .popupActions .cancelBtn:hover,.popupOverlay .popupBox .popupActions .createBtn:hover{transform:translateY(-2px)}.popupOverlay .popupBox .popupActions .cancelBtn{color:#fff;background:#333}.popupOverlay .popupBox .popupActions .cancelBtn:hover{background:#444}.popupOverlay .popupBox .popupActions .createBtn{color:#fff;background:#1db954}.popupOverlay .popupBox .popupActions .createBtn:hover{background:#1ed760}.yourMusicContainer{width:100%;height:100%;color:var(--white-lv1);background-color:var(--black-lv2);border-radius:8px;padding:20px;overflow-y:auto}.yourMusicContainer .header{justify-content:space-between;align-items:center;display:flex}.yourMusicContainer .header .yourMusicHeader{margin-bottom:25px;font-size:26px;font-weight:700}.yourMusicContainer .header .uploadButton{color:var(--black-lv1);cursor:pointer;background-color:#1ed760;border:none;border-radius:25px;margin-bottom:20px;padding:10px 20px;font-size:16px;font-weight:600;transition:background-color .3s,transform .2s;display:inline-block}.yourMusicContainer .header .uploadButton:hover{background-color:#28e66e;transform:scale(1.05)}.yourMusicContainer .yourMusicSection{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:20px;display:grid}.yourMusicContainer .yourMusicSection .yourMusicStatsButton{color:#fff;cursor:pointer;background-color:#4a90e2;border:none;border-radius:6px;margin-top:8px;padding:6px 12px;font-size:13px;transition:all .2s}.yourMusicContainer .yourMusicSection .yourMusicStatsButton:hover{background-color:#357abd}.yourMusicContainer .yourMusicSection .yourMusicCard{text-align:left;cursor:pointer;background-color:#0000;border-radius:10px;padding:10px;transition:background .3s;position:relative}.yourMusicContainer .yourMusicSection .yourMusicCard:hover{background:var(--black-lv3)}.yourMusicContainer .yourMusicSection .yourMusicCard .yourMusicImage img{object-fit:cover;border-radius:10px;width:100%;height:150px}.yourMusicContainer .yourMusicSection .yourMusicCard .yourMusicTitle{color:var(--white-lv1);text-overflow:ellipsis;white-space:nowrap;max-width:150px;margin-top:10px;font-size:18px;font-weight:600;overflow:hidden}.yourMusicContainer .yourMusicSection .yourMusicCard .yourMusicArtist{color:var(--white-lv2);cursor:pointer;font-size:14px;transition:color .3s}.yourMusicContainer .yourMusicSection .yourMusicCard .yourMusicArtist:hover{color:var(--white-lv1)}.yourMusicContainer .yourMusicSection .yourMusicCard .yourMusicPlayButton{width:50px;height:50px;color:var(--black-lv1);opacity:0;background-color:#1ed760;border-radius:50%;justify-content:center;align-items:center;font-size:20px;transition:all .3s;display:flex;position:absolute;bottom:50px;right:10px;transform:translateY(40px)}.yourMusicContainer .yourMusicSection .yourMusicCard:hover .yourMusicPlayButton{opacity:1;transform:translateY(0)}.yourMusicContainer .noResults{text-align:center;color:var(--white-lv2);margin-top:40px;font-size:18px}.feedback-popup-container{z-index:9999;background:#0000004d;border-radius:12px;padding:6px;animation:.3s fadeIn;position:fixed;bottom:20px;right:20px}.feedback-popup-container .feedback-popup{background:var(--black-lv3);border-radius:10px;width:260px;padding:16px;font-family:sans-serif;transition:padding .2s}.feedback-popup-container .feedback-popup.thankyou-active{padding:10px 12px}.feedback-popup-container .feedback-popup h3{text-align:center;margin-bottom:10px;font-size:15px}.feedback-popup-container .feedback-popup .rating-buttons{flex-direction:column;gap:6px;margin-bottom:10px;display:flex}.feedback-popup-container .feedback-popup .rating-buttons .rating-btn{background:var(--black-lv3);cursor:pointer;text-align:left;color:var(--white-lv1);border-radius:6px;padding:6px 8px;font-size:13px;transition:all .2s}.feedback-popup-container .feedback-popup .rating-buttons .rating-btn:hover{background:var(--white-lv1);border-color:var(--black-lv2);color:var(--black-lv2)}.feedback-popup-container .feedback-popup .rating-buttons .rating-btn:disabled{opacity:.6;cursor:not-allowed}.feedback-popup-container .feedback-popup .thankyou{text-align:center;color:var(--white-lv1);font-weight:700}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.profilePage .profileHeader{background:linear-gradient(135deg,#4408f2,#bee8d7);border-radius:20px;justify-content:left;align-items:center;gap:20px;padding:40px 20px;display:flex}.profilePage .profileHeader .profileAvatar{border-radius:50%;width:150px;height:150px}.profilePage .profileHeader .profileUsername{color:#fff;font-size:64px;font-weight:700}.profilePage .listeningChartContainer h2{margin-top:20px}.profilePage .listeningChartContainer .daysButtonGroup{gap:12px;margin:20px 0;display:flex}.profilePage .listeningChartContainer .daysButtonGroup .dayButton{color:#eee;cursor:pointer;background:#2a2a2a;border:none;border-radius:10px;padding:10px 20px;font-size:14px;transition:all .2s}.profilePage .listeningChartContainer .daysButtonGroup .dayButton:hover{background:#3a3a3a}.profilePage .listeningChartContainer .daysButtonGroup .dayButton.active{color:#000;background:#1db954}.centerHomePage{width:calc(73% - 20px);height:100%;color:var(--white-lv1);background-color:var(--black-lv2);padding:var(--padding-lv2);border-radius:8px;transition:width .3s linear;position:absolute;top:0;left:calc(27% + 10px);overflow-y:scroll}.centerHomePage.rightActive{width:46%}.centerHomePage .listeningHistoryContainer .listeningHistoryTitle{margin-bottom:20px;font-size:24px;font-weight:700}.centerHomePage .listeningHistoryContainer .listeningHistoryList{cursor:pointer;border-radius:10px;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:15px;padding:10px;display:flex;position:relative}.centerHomePage .listeningHistoryContainer .listeningHistoryList .historyItem{background:var(--black-lv3);border-radius:8px;align-items:center;gap:10px;width:24%;height:50px;padding:3px;display:flex;position:relative;overflow:hidden}.centerHomePage .listeningHistoryContainer .listeningHistoryList .historyItem .historyImage{position:absolute;top:0;left:0}.centerHomePage .listeningHistoryContainer .listeningHistoryList .historyItem .historyImage img{object-fit:cover;border-radius:5px;width:50px;height:50px}.centerHomePage .listeningHistoryContainer .listeningHistoryList .historyItem .nameHistorySong{color:var(--white-lv1);margin-left:70px;font-size:16px;font-weight:600}.centerHomePage .listeningHistoryContainer .listeningHistoryList .historyItem .playHistoryButton{opacity:0;width:35px;height:35px;color:var(--black-lv1);background-color:#1ed760;border-radius:50%;justify-content:center;align-items:center;font-size:12px;transition:all .3s linear;display:flex;position:absolute;right:10px}.centerHomePage .listeningHistoryContainer .listeningHistoryList .historyItem:hover .playHistoryButton{opacity:1}.centerHomePage .listeningHistoryContainer .listeningHistoryList .historyItem.rightActive{width:49%}.centerHomePage .trendingContainer .trendingTitle{font-size:24px;font-weight:700}.centerHomePage .trendingContainer .trendingSongItem{border-radius:10px;padding:10px;position:relative}.centerHomePage .trendingContainer .trendingSongItem .trendingSongImage img{object-fit:cover;border-radius:10px;width:150px;height:150px}.centerHomePage .trendingContainer .trendingSongItem:hover{background:var(--black-lv3)}.centerHomePage .trendingContainer .trendingSongItem .trendingSongTitle{color:var(--white-lv1);text-overflow:ellipsis;white-space:nowrap;max-width:150px;font-size:20px;font-weight:600;overflow:hidden}.centerHomePage .trendingContainer .trendingSongItem .trendingSongArtist{color:var(--white-lv2);font-size:14px}.centerHomePage .trendingContainer .trendingSongItem .trendingPlayButton{width:50px;height:50px;color:var(--black-lv1);opacity:0;background-color:#1ed760;border-radius:50%;justify-content:center;align-items:center;font-size:20px;transition:all .3s;display:flex;position:absolute;bottom:50px;right:10px;transform:translateY(40px)}.centerHomePage .trendingContainer .trendingSongItem:hover .trendingPlayButton{opacity:1;transform:translateY(0)}.centerHomePage .topAlbumsContainer,.centerHomePage .topArtistController{margin-top:50px}.centerHomePage .topAlbumsContainer .topAlbumsHeader,.centerHomePage .topAlbumsContainer .topArtsHeader,.centerHomePage .topArtistController .topAlbumsHeader,.centerHomePage .topArtistController .topArtsHeader{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.centerHomePage .topAlbumsContainer .topAlbumsHeader .topAlbumsTitle,.centerHomePage .topAlbumsContainer .topAlbumsHeader .topArtistTitle,.centerHomePage .topAlbumsContainer .topArtsHeader .topAlbumsTitle,.centerHomePage .topAlbumsContainer .topArtsHeader .topArtistTitle,.centerHomePage .topArtistController .topAlbumsHeader .topAlbumsTitle,.centerHomePage .topArtistController .topAlbumsHeader .topArtistTitle,.centerHomePage .topArtistController .topArtsHeader .topAlbumsTitle,.centerHomePage .topArtistController .topArtsHeader .topArtistTitle{font-size:24px;font-weight:700}.centerHomePage .topAlbumsContainer .albumItem .albumImage img,.centerHomePage .topArtistController .albumItem .albumImage img{object-fit:cover;border-radius:10px;width:150px;height:150px}.centerHomePage .topAlbumsContainer .albumItem .albumName,.centerHomePage .topArtistController .albumItem .albumName{color:var(--white-lv1);margin-top:10px;font-size:18px;font-weight:600}.centerHomePage .topAlbumsContainer .albumItem .albumArtist,.centerHomePage .topArtistController .albumItem .albumArtist{color:var(--white-lv2);font-size:14px}.centerHomePage .artistItem .artistImage img{object-fit:cover;border-radius:50%;width:150px;height:150px}.centerHomePage .artistItem .artistName{text-align:center;margin-top:10px;font-size:18px;font-weight:600}.centerHomePage .recommendContainer{margin-top:30px}.centerHomePage .recommendContainer .recommendTitle{font-size:24px;font-weight:700}.centerHomePage .recommendContainer .recommendSongItem{border-radius:10px;padding:10px;position:relative}.centerHomePage .recommendContainer .recommendSongItem .recommendSongImage img{object-fit:cover;border-radius:10px;width:150px;height:150px}.centerHomePage .recommendContainer .recommendSongItem:hover{background:var(--black-lv3)}.centerHomePage .recommendContainer .recommendSongItem .recommendSongTitle{color:var(--white-lv1);text-overflow:ellipsis;white-space:nowrap;max-width:150px;font-size:20px;font-weight:600;overflow:hidden}.centerHomePage .recommendContainer .recommendSongItem .recommendSongArtist{color:var(--white-lv2);font-size:14px}.centerHomePage .recommendContainer .recommendSongItem .recommendPlayButton{width:50px;height:50px;color:var(--black-lv1);opacity:0;background-color:#1ed760;border-radius:50%;justify-content:center;align-items:center;font-size:20px;transition:all .3s;display:flex;position:absolute;bottom:50px;right:10px;transform:translateY(40px)}.centerHomePage .recommendContainer .recommendSongItem:hover .recommendPlayButton{opacity:1;transform:translateY(0)}.comments{flex-direction:column;gap:15px;width:100%;margin-top:20px;margin-bottom:30px;display:flex}.comments .commentInput{box-sizing:border-box;background:#111;border-radius:6px;flex-direction:column;align-items:center;width:100%;padding:8px 12px;animation:.3s ease-out fadeInUp;display:flex}.comments .commentInput .header{align-items:center;width:100%;display:flex}.comments .commentInput .header img{object-fit:cover;border-radius:50%;width:36px;height:36px;margin-right:10px;transition:transform .2s}.comments .commentInput .header img:hover{transform:scale(1.05)}.comments .commentInput .header input{color:#fff;background:0 0;border:none;border-bottom:1px solid #333;outline:none;flex:1;padding:8px 0;font-size:14px;transition:border-color .3s}.comments .commentInput .header input:focus{border-bottom-color:#3ea6ff}.comments .commentInput .header input::placeholder{color:#aaa}.comments .commentInput .bottom{justify-content:flex-end;align-items:center;width:100%;margin-top:10px;display:flex}.comments .commentInput .bottom button{color:var(--white-lv1);cursor:pointer;border:none;border-radius:30px;padding:10px 20px;font-size:12px;transition:all .2s}.comments .commentInput .bottom button:hover{background:var(--black-lv3);transform:translateY(-1px)}.comments .commentInput .bottom .sendCommentButton{background:var(--black-lv3);color:var(--white-lv2);margin-left:10px;font-weight:600}.comments .commentInput .bottom .sendCommentButton.send{color:var(--black-lv3);background:#3ea6ff}.comments .commentInput .bottom .sendCommentButton.send:hover{background:#349cf5;box-shadow:0 4px 8px #3ea6ff4d}.comments .title{color:var(--white-lv1);font-size:22px;font-weight:700;animation:.4s ease-out fadeIn}.comments .listComments{border-top:1px solid var(--white-lv2);flex-direction:column;gap:15px;padding-top:10px;display:flex}.comments .listComments .noComment{text-align:center;color:var(--white-lv2);opacity:.7;padding:40px 0;font-size:14px;animation:.5s ease-out fadeIn}.comments .listComments .comment{border-radius:10px;align-items:flex-start;gap:10px;padding:10px 0;transition:background .2s;animation:.3s ease-out slideInLeft;display:flex;position:relative}.comments .listComments .comment:hover{background:#ffffff05}.comments .listComments .comment.replyItem{margin-left:35px;position:relative}.comments .listComments .comment.replyItem:after{content:"";border-bottom:1.5px solid #ffffff1f;border-left:1.5px solid #ffffff1f;border-radius:0 0 0 6px;width:16px;height:16px;position:absolute;top:20px;left:-22px}.comments .listComments .comment.replyItem[data-depth="2"]{margin-left:70px}.comments .listComments .comment.replyItem[data-depth="2"]:after{left:-57px}.comments .listComments .comment.replyItem[data-depth="3"]{margin-left:105px}.comments .listComments .comment.replyItem[data-depth="3"]:after{left:-92px}.comments .listComments .comment .leftComment .userAvatar{border-radius:50%;width:40px;height:40px;transition:transform .2s;overflow:hidden}.comments .listComments .comment .leftComment .userAvatar:hover{transform:scale(1.1)}.comments .listComments .comment .leftComment .userAvatar img{object-fit:cover;width:100%;height:100%}.comments .listComments .comment .rightComment{flex-direction:column;flex:1;gap:5px;min-width:0;display:flex;overflow:hidden}.comments .listComments .comment .rightComment .titleComment{white-space:nowrap;text-overflow:ellipsis;justify-content:start;align-items:center;display:flex;overflow:hidden}.comments .listComments .comment .rightComment .titleComment .username{color:var(--white-lv1);font-size:12px;font-weight:600}.comments .listComments .comment .rightComment .titleComment .commentTime{color:var(--white-lv1);opacity:.7;margin-left:10px;font-size:12px}.comments .listComments .comment .rightComment .text{color:var(--white-lv1);word-wrap:break-word;word-break:break-word;overflow-wrap:break-word;margin:0;font-size:14px;line-height:1.4;animation:.4s ease-out fadeIn}.comments .listComments .comment .rightComment .commentActions{gap:10px;margin-top:2px;display:flex}.comments .listComments .comment .rightComment .commentActions button{color:var(--white-lv1);opacity:.9;cursor:pointer;background:0 0;border:none;padding:0;font-size:12px;transition:all .2s;position:relative}.comments .listComments .comment .rightComment .commentActions button:after{content:"";background:var(--white-lv1);width:0;height:1px;transition:width .2s;position:absolute;bottom:-2px;left:0}.comments .listComments .comment .rightComment .commentActions button:hover{opacity:1}.comments .listComments .comment .rightComment .commentActions button:hover:after{width:100%}.comments .listComments .comment .rightComment .repliesContainer{transform-origin:top;flex-direction:column;gap:6px;margin-top:8px;animation:.3s ease-out expandDown;display:flex;position:relative}.comments .listComments .comment .rightComment .repliesContainer.fadeOut{opacity:0;max-height:0;margin:0;padding:0;transition:all .3s}.comments .listComments .comment .rightComment .repliesContainer:before{content:"";background:#ffffff1f;width:1.5px;position:absolute;top:-8px;bottom:23px;left:-22px}.comments .listComments .comment .rightComment .repliesContainer[data-depth="1"]:before{left:-22px}.comments .listComments .comment .rightComment .repliesContainer[data-depth="2"]:before{left:-57px}.comments .listComments .comment .rightComment .repliesContainer[data-depth="3"]:before{left:-92px}.comments .listComments .comment .rightComment .replyInputContainer{align-items:flex-start;gap:8px;margin-top:8px;animation:.3s ease-out fadeInUp;display:flex}.comments .listComments .comment .rightComment .replyInputContainer.fadeOut{opacity:0;transition:all .25s;transform:translateY(-10px)}.comments .listComments .comment .rightComment .replyInputContainer .replyAvatar{object-fit:cover;border-radius:50%;flex-shrink:0;width:32px;height:32px;transition:transform .2s}.comments .listComments .comment .rightComment .replyInputContainer .replyAvatar:hover{transform:scale(1.05)}.comments .listComments .comment .rightComment .replyInputContainer .replyInputWrapper{flex-direction:column;flex:1;gap:8px;display:flex}.comments .listComments .comment .rightComment .replyInputContainer .replyInputWrapper input{width:100%;color:var(--white-lv1);box-sizing:border-box;background:#ffffff08;border:1px solid #fff3;border-radius:20px;outline:none;padding:8px 12px;font-size:13px;transition:all .2s}.comments .listComments .comment .rightComment .replyInputContainer .replyInputWrapper input:focus{background:#ffffff0d;border-color:#3ea6ff;box-shadow:0 0 0 3px #3ea6ff1a}.comments .listComments .comment .rightComment .replyInputContainer .replyInputWrapper input::placeholder{color:#ffffff80}.comments .listComments .comment .rightComment .replyInputContainer .replyInputWrapper .replyActions{justify-content:flex-end;gap:8px;display:flex}.comments .listComments .comment .rightComment .replyInputContainer .replyInputWrapper .replyActions button{cursor:pointer;border:none;border-radius:16px;padding:6px 16px;font-size:12px;font-weight:600;transition:all .2s}.comments .listComments .comment .rightComment .replyInputContainer .replyInputWrapper .replyActions button:first-child{color:var(--white-lv1);opacity:.8;background:0 0}.comments .listComments .comment .rightComment .replyInputContainer .replyInputWrapper .replyActions button:first-child:hover{opacity:1;background:#ffffff0d}.comments .listComments .comment .rightComment .replyInputContainer .replyInputWrapper .replyActions button.sendReplyButton{color:var(--white-lv1);opacity:.5;background:#ffffff1a}.comments .listComments .comment .rightComment .replyInputContainer .replyInputWrapper .replyActions button.sendReplyButton.active{color:#fff;opacity:1;background:#3ea6ff}.comments .listComments .comment .rightComment .replyInputContainer .replyInputWrapper .replyActions button.sendReplyButton.active:hover{background:#349cf5;transform:translateY(-1px);box-shadow:0 4px 8px #3ea6ff4d}.comments .listComments .comment .rightComment .replyInputContainer .replyInputWrapper .replyActions button.sendReplyButton:disabled{cursor:not-allowed;opacity:.5}.comments.rightActive .title{margin-left:10px}.comments.rightActive .listComments{width:90%;margin:auto}.comments.rightActive .commentInput{width:90%;margin:auto;padding:0}.comments.rightActive .comment.replyItem{margin-left:20px}.comments.rightActive .comment.replyItem:after{width:11px;height:11px;left:-14px}.comments.rightActive .comment.replyItem[data-depth="2"]{margin-left:40px}.comments.rightActive .comment.replyItem[data-depth="2"]:after{left:-34px}.comments.rightActive .comment.replyItem[data-depth="3"]{margin-left:60px}.comments.rightActive .comment.replyItem[data-depth="3"]:after{left:-54px}.comments.rightActive .comment .repliesContainer:before,.comments.rightActive .comment .repliesContainer[data-depth="1"]:before{left:-14px}.comments.rightActive .comment .repliesContainer[data-depth="2"]:before{left:-34px}.comments.rightActive .comment .repliesContainer[data-depth="3"]:before{left:-54px}.comments.extendedFull .comment.replyItem{margin-left:24px}.comments.extendedFull .comment.replyItem:after{width:11px;height:13px;left:-16px}.comments.extendedFull .comment.replyItem[data-depth="2"]{margin-left:48px}.comments.extendedFull .comment.replyItem[data-depth="2"]:after{left:-40px}.comments.extendedFull .comment.replyItem[data-depth="3"]{margin-left:72px}.comments.extendedFull .comment.replyItem[data-depth="3"]:after{left:-64px}.comments.extendedFull .comment .repliesContainer:before{width:1.5px;left:-16px}.comments.extendedFull .comment .repliesContainer[data-depth="1"]:before{left:-16px}.comments.extendedFull .comment .repliesContainer[data-depth="2"]:before{left:-40px}.comments.extendedFull .comment .repliesContainer[data-depth="3"]:before{left:-64px}.comments.extendedFull .comment .leftComment .userAvatar{width:32px;height:32px}.comments.extendedFull .comment .replyInputContainer .replyAvatar{width:28px;height:28px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes expandDown{0%{opacity:0;max-height:0;transform:scaleY(.8)}to{opacity:1;max-height:2000px;transform:scaleY(1)}}.rightHomePage{background-color:var(--black-lv2);z-index:10;border-radius:8px;width:calc(27% - 30px);height:100%;transition:transform .3s ease-in-out,width .3s ease-in-out;position:absolute;top:0;right:0;overflow:hidden auto;transform:translate(100%)}.rightHomePage::-webkit-scrollbar{display:none}.rightHomePage{-ms-overflow-style:none;scrollbar-width:none}.rightHomePage .currentSongContainer .headerSong{display:none;position:static}.rightHomePage .noSongPlaying{text-align:center;color:var(--white-lv1);padding:40px 20px;font-size:16px;font-weight:500}.rightHomePage .currentSongContainer{width:100%;position:relative}.rightHomePage .currentSongContainer .mediaContainer{background-color:var(--black-lv3);width:100%;position:relative}.rightHomePage .currentSongContainer .mediaContainer:after{content:"";background:linear-gradient(to bottom, transparent 0%, var(--black-lv2) 80%);pointer-events:none;z-index:1;height:120px;position:absolute;bottom:-1px;left:0;right:0}.rightHomePage .currentSongContainer .mediaContainer .mediaElement{object-fit:cover;width:100%;height:400px;display:block}.rightHomePage .currentSongContainer .songInfoContainer{z-index:2;width:100%;position:relative}.rightHomePage .currentSongContainer .songInfoContainer.video{margin-top:-80px}.rightHomePage .currentSongContainer .songInfoContainer.audio{margin-top:-100px}.rightHomePage .currentSongContainer .songInfoContainer .songTitleContainer{color:var(--white-lv1);text-shadow:0 2px 8px #0000004d;margin-bottom:16px;font-size:20px;font-weight:700;line-height:1.3}.rightHomePage .currentSongContainer .songInfoContainer .artistContainer{background-color:var(--black-lv3);color:var(--white-lv1);border-radius:16px;margin-bottom:16px;overflow:hidden;box-shadow:0 4px 12px #0000004d}.rightHomePage .currentSongContainer .songInfoContainer .artistContainer .artistAvatar{object-fit:cover;width:100%;height:180px;display:block}.rightHomePage .currentSongContainer .songInfoContainer .artistContainer .artistInfo{padding:20px}.rightHomePage .currentSongContainer .songInfoContainer .artistContainer .artistInfo .artistName{margin-bottom:16px;font-size:16px;font-weight:700}.rightHomePage .currentSongContainer .songInfoContainer .artistContainer .artistInfo .artistActions{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.rightHomePage .currentSongContainer .songInfoContainer .artistContainer .artistInfo .artistActions .monthlyListeners{color:var(--white-lv2);font-size:12px;font-weight:400}.rightHomePage .currentSongContainer .songInfoContainer .artistContainer .artistInfo .artistActions .followButton{border:2px solid var(--white-lv1);color:var(--white-lv1);cursor:pointer;white-space:nowrap;background:0 0;border-radius:24px;padding:8px 20px;font-size:13px;font-weight:600;transition:all .2s}.rightHomePage .currentSongContainer .songInfoContainer .artistContainer .artistInfo .artistActions .followButton:hover{background:var(--white-lv1);color:var(--black-lv3);transform:scale(1.05)}.rightHomePage .currentSongContainer .nextSongContainer{background-color:var(--black-lv3);color:var(--white-lv1);border-radius:16px;margin:0 20px 20px;padding:20px;box-shadow:0 4px 12px #0000004d}.rightHomePage .currentSongContainer .nextSongContainer .nextSongHeader{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.rightHomePage .currentSongContainer .nextSongContainer .nextSongHeader .nextSongLabel{font-size:15px;font-weight:700}.rightHomePage .currentSongContainer .nextSongContainer .nextSongHeader .openQueueButton{color:var(--white-lv2);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:13px;font-weight:500;transition:color .2s,background-color .2s}.rightHomePage .currentSongContainer .nextSongContainer .nextSongHeader .openQueueButton:hover{color:var(--white-lv1);background-color:#ffffff1a}.rightHomePage .currentSongContainer .nextSongContainer .nextSongContent{align-items:center;gap:16px;display:flex}.rightHomePage .currentSongContainer .nextSongContainer .nextSongContent .nextSongCover{object-fit:cover;border-radius:8px;flex-shrink:0;width:50px;height:50px;box-shadow:0 2px 8px #0000004d}.rightHomePage .currentSongContainer .nextSongContainer .nextSongContent .nextSongDetails{flex:1;min-width:0}.rightHomePage .currentSongContainer .nextSongContainer .nextSongContent .nextSongDetails .nextSongTitle,.rightHomePage .currentSongContainer .nextSongContainer .nextSongContent .nextSongDetails .nextSongArtist{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.rightHomePage .currentSongContainer .nextSongContainer .nextSongContent .nextSongDetails .nextSongTitle{margin-bottom:6px;font-size:14px;font-weight:600}.rightHomePage .currentSongContainer .nextSongContainer .nextSongContent .nextSongDetails .nextSongArtist{color:var(--white-lv2);font-size:12px;font-weight:400}.rightHomePage .currentSongContainer .nextSongContainer .nextSongContent .noNextSong{color:var(--white-lv2);padding:12px 0;font-size:14px;font-weight:400}.rightHomePage.rightActive{right:10px;transform:translate(0)}.rightHomePage.rightActive .currentSongContainer .headerSong{z-index:3;justify-content:space-between;align-items:center;gap:10px;display:flex;position:absolute;top:20px;left:20px;right:20px}.rightHomePage.rightActive .currentSongContainer .headerSong .left,.rightHomePage.rightActive .currentSongContainer .headerSong .right{align-items:center;gap:10px;display:flex}.rightHomePage.rightActive .currentSongContainer .headerSong .left .imageTitle,.rightHomePage.rightActive .currentSongContainer .headerSong .right .imageTitle{color:var(--white-lv1);white-space:nowrap;text-overflow:ellipsis;max-width:200px;font-size:14px;overflow:hidden}.rightHomePage.rightActive .currentSongContainer .mediaContainer{border-radius:0}.rightHomePage.rightActive .currentSongContainer .mediaContainer .mediaElement{border-radius:0;height:500px}.rightHomePage.rightActive .currentSongContainer .songInfoContainer{margin-top:20px;padding:0 20px}.rightHomePage.rightActive .currentSongContainer .songInfoContainer.video{margin-top:-80px}.rightHomePage.rightActive .currentSongContainer .songInfoContainer.audio{margin-top:-100px}.rightHomePage.rightActive .currentSongContainer .songInfoContainer .songTitleContainer{font-size:24px}.rightHomePage.rightActive .currentSongContainer .songInfoContainer .artistContainer .artistAvatar{height:220px}.rightHomePage.rightActive .currentSongContainer .songInfoContainer .artistContainer .artistInfo .artistName{font-size:18px}.rightHomePage.rightActive .currentSongContainer .songInfoContainer .artistContainer .artistInfo .artistActions .monthlyListeners{font-size:13px}.rightHomePage.rightActive .currentSongContainer .songInfoContainer .artistContainer .artistInfo .artistActions .followButton{padding:10px 24px;font-size:14px}.rightHomePage.rightActive .currentSongContainer .nextSongContainer{margin:20px}.rightHomePage.rightActive .currentSongContainer .nextSongContainer .nextSongHeader .nextSongLabel{font-size:16px}.rightHomePage.rightActive .currentSongContainer .nextSongContainer .nextSongHeader .openQueueButton{font-size:14px}.rightHomePage.rightActive .currentSongContainer .nextSongContainer .nextSongContent .nextSongCover{width:56px;height:56px}.rightHomePage.rightActive .currentSongContainer .nextSongContainer .nextSongContent .nextSongDetails .nextSongTitle{font-size:15px}.rightHomePage.rightActive .currentSongContainer .nextSongContainer .nextSongContent .nextSongDetails .nextSongArtist{font-size:13px}.rightHomePage.rightActive .description{background:var(--black-lv3);border-radius:10px;flex-direction:column;gap:8px;width:90%;margin:0 auto;padding:20px;display:flex;box-shadow:0 1px 3px #00000014}.rightHomePage.rightActive .description .titleDescription{color:var(--white-lv2);padding-bottom:5px;font-size:18px;font-weight:600}.rightHomePage.rightActive .description .textDescription{color:#555;white-space:pre-line;font-size:14px;line-height:1.6}.rightHomePage.extendedFull{z-index:200;border-radius:0;width:100%;transform:translate(0)}.rightHomePage.extendedFull .currentSongContainer{flex-direction:column;max-width:1400px;margin:0 auto;display:flex}.rightHomePage.extendedFull .currentSongContainer .mediaContainer{border-radius:80px;width:100%;margin:0 auto}.rightHomePage.extendedFull .currentSongContainer .mediaContainer:after{display:none}.rightHomePage.extendedFull .currentSongContainer .mediaContainer .headerSong{z-index:3;background:var(--black-lv2);justify-content:space-between;align-items:center;gap:10px;width:100%;display:flex}.rightHomePage.extendedFull .currentSongContainer .mediaContainer .headerSong .left,.rightHomePage.extendedFull .currentSongContainer .mediaContainer .headerSong .right{align-items:center;gap:10px;display:flex}.rightHomePage.extendedFull .currentSongContainer .mediaContainer .headerSong .closeButton,.rightHomePage.extendedFull .currentSongContainer .mediaContainer .headerSong .imageTitle{display:none}.rightHomePage.extendedFull .currentSongContainer .mediaContainer .headerSong .viewFullButton{margin:10px 0}.rightHomePage.extendedFull .currentSongContainer .mediaContainer .headerSong .viewFullButton svg{width:20px;height:20px}.rightHomePage.extendedFull .currentSongContainer .mediaContainer .mediaElement{border-radius:12px;height:60vh;max-height:700px;box-shadow:0 8px 24px #0006}.rightHomePage.extendedFull .currentSongContainer .songTitleContainer{text-align:center;color:var(--white-lv2);margin-top:50px;margin-bottom:24px;font-size:32px}.rightHomePage.extendedFull .currentSongContainer .songInfo{justify-content:space-between;align-items:center;display:flex}.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer{width:100%;max-width:900px;margin-top:30px;position:relative;top:0;left:0;transform:none}.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.video,.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.audio{margin-top:30px}.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.video .artistContainer,.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.audio .artistContainer{flex-direction:row;align-items:center;gap:30px;width:600px;padding:30px;display:flex}.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.video .artistContainer .artistAvatar,.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.audio .artistContainer .artistAvatar{border-radius:50%;flex-shrink:0;width:100px;height:100px}.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.video .artistContainer .artistInfo,.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.audio .artistContainer .artistInfo{flex:1;padding:0}.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.video .artistContainer .artistInfo .artistName,.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.audio .artistContainer .artistInfo .artistName{margin-bottom:20px;font-size:28px}.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.video .artistContainer .artistInfo .artistActions,.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.audio .artistContainer .artistInfo .artistActions{flex-direction:column;align-items:flex-start;gap:16px}.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.video .artistContainer .artistInfo .artistActions .monthlyListeners,.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.audio .artistContainer .artistInfo .artistActions .monthlyListeners{font-size:15px}.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.video .artistContainer .artistInfo .artistActions .followButton,.rightHomePage.extendedFull .currentSongContainer .songInfo .songInfoContainer.audio .artistContainer .artistInfo .artistActions .followButton{padding:12px 32px;font-size:16px}.rightHomePage.extendedFull .currentSongContainer .songInfo .nextSongContainer{width:100%;max-width:900px;margin:30px auto;padding:24px 30px}.rightHomePage.extendedFull .currentSongContainer .songInfo .nextSongContainer .nextSongHeader{margin-bottom:20px}.rightHomePage.extendedFull .currentSongContainer .songInfo .nextSongContainer .nextSongHeader .nextSongLabel{font-size:18px}.rightHomePage.extendedFull .currentSongContainer .songInfo .nextSongContainer .nextSongHeader .openQueueButton{font-size:15px}.rightHomePage.extendedFull .currentSongContainer .songInfo .nextSongContainer .nextSongContent{gap:20px}.rightHomePage.extendedFull .currentSongContainer .songInfo .nextSongContainer .nextSongContent .nextSongCover{border-radius:10px;width:70px;height:70px}.rightHomePage.extendedFull .currentSongContainer .songInfo .nextSongContainer .nextSongContent .nextSongDetails .nextSongTitle{margin-bottom:8px;font-size:17px}.rightHomePage.extendedFull .currentSongContainer .songInfo .nextSongContainer .nextSongContent .nextSongDetails .nextSongArtist{font-size:14px}.rightHomePage.extendedFull .description{background:var(--black-lv3);border-radius:10px;flex-direction:column;gap:8px;padding:20px;display:flex;box-shadow:0 1px 3px #00000014}.rightHomePage.extendedFull .description .titleDescription{color:var(--white-lv2);padding-bottom:5px;font-size:18px;font-weight:600}.rightHomePage.extendedFull .description .textDescription{color:#555;white-space:pre-line;font-size:14px;line-height:1.6}.ratingSection{border-radius:12px;flex-direction:column;gap:20px;margin-top:20px;display:flex}.ratingSection .ratingOverview{background:var(--black-lv3);color:#fff;border-radius:12px;gap:32px;padding:24px;display:flex}.ratingSection .ratingOverview .leftBlock{flex-direction:column;justify-content:center;align-items:center;min-width:120px;display:flex}.ratingSection .ratingOverview .leftBlock .bigAvg{color:var(--white-lv1);margin-bottom:8px;font-size:56px;font-weight:700;line-height:1}.ratingSection .ratingOverview .leftBlock .starsRow{gap:2px;margin-bottom:8px;display:flex}.ratingSection .ratingOverview .leftBlock .starsRow .smallStar{color:#333;font-size:18px}.ratingSection .ratingOverview .leftBlock .starsRow .smallStar.active{color:#5b8def}.ratingSection .ratingOverview .leftBlock .starsRow .smallStar.half{color:#5b8def;opacity:.5}.ratingSection .ratingOverview .leftBlock .ratingCount{color:#999;font-size:14px;font-weight:400}.ratingSection .ratingOverview .barsBlock{flex-direction:column;flex:1;justify-content:center;gap:10px;display:flex}.ratingSection .ratingOverview .barsBlock .barRow{align-items:center;gap:12px;display:flex}.ratingSection .ratingOverview .barsBlock .barRow .starNumber{color:#ddd;text-align:center;width:12px;font-size:15px;font-weight:500}.ratingSection .ratingOverview .barsBlock .barRow .barOuter{background:#2a2a2a;border-radius:20px;flex:1;height:12px;overflow:hidden}.ratingSection .ratingOverview .barsBlock .barRow .barOuter .barInner{border-radius:inherit;background:linear-gradient(90deg,#5b8def 0%,#4a7dd8 100%);height:100%;transition:width .4s cubic-bezier(.4,0,.2,1)}.ratingSection .userRatingSection{background:var(--black-lv3);border-radius:12px;padding:20px 24px}.ratingSection .userRatingSection .ratingHeader{margin-bottom:16px}.ratingSection .userRatingSection .ratingHeader .ratingTitle{color:var(--white-lv1);font-size:16px;font-weight:600}.ratingSection .userRatingSection .starsContainer{gap:8px;margin-bottom:16px;display:flex}.ratingSection .userRatingSection .starsContainer .star{color:#333;cursor:pointer;-webkit-user-select:none;user-select:none;font-size:16px;transition:all .2s}.ratingSection .userRatingSection .starsContainer .star:hover{transform:scale(1.1)}.ratingSection .userRatingSection .starsContainer .star.active{color:gold}.ratingSection .userRatingSection .ratingActions{align-items:center;gap:12px;display:flex}.ratingSection .userRatingSection .ratingActions .unrateBtn{color:var(--white-lv1);cursor:pointer;background:0 0;border:1px solid #444;border-radius:20px;padding:8px 16px;font-size:14px;transition:all .2s}.ratingSection .userRatingSection .ratingActions .unrateBtn:hover{border-color:#666}.ratingSection .userRatingSection .ratingActions .unrateBtn:disabled{opacity:.5;cursor:not-allowed}.ratingSection .userRatingSection .ratingActions .notRatedText{color:#888;font-size:14px;font-style:italic}.ratingSection.rightActive .ratingOverview{width:90%;margin:auto;padding:20px}.ratingSection.rightActive .ratingOverview .leftBlock{min-width:100px}.ratingSection.rightActive .ratingOverview .leftBlock .bigAvg{font-size:48px}.ratingSection.rightActive .ratingOverview .leftBlock .starsRow .smallStar{font-size:16px}.ratingSection.rightActive .ratingOverview .leftBlock .ratingCount{font-size:13px}.ratingSection.rightActive .ratingOverview .barsBlock{gap:8px}.ratingSection.rightActive .ratingOverview .barsBlock .barRow .starNumber{font-size:14px}.ratingSection.rightActive .ratingOverview .barsBlock .barRow .barOuter{height:10px}.ratingSection.rightActive .userRatingSection{width:90%;margin:10px auto;padding:16px 20px}.ratingSection.rightActive .userRatingSection .ratingHeader{margin-bottom:14px}.ratingSection.rightActive .userRatingSection .ratingHeader .ratingTitle{font-size:15px}.ratingSection.rightActive .userRatingSection .starsContainer{gap:6px;margin-bottom:14px}.ratingSection.rightActive .userRatingSection .starsContainer .star{font-size:14px}.ratingSection.rightActive .userRatingSection .ratingActions{gap:10px}.ratingSection.rightActive .userRatingSection .ratingActions .unrateBtn{padding:7px 14px;font-size:13px}.ratingSection.rightActive .userRatingSection .ratingActions .notRatedText{font-size:13px}.ratingSection.extendedFull .ratingContent{justify-content:center;align-items:center;gap:20px;display:flex}.ratingSection.extendedFull .ratingContent .ratingOverview{width:70%;height:150px;padding:18px}.ratingSection.extendedFull .ratingContent .ratingOverview .leftBlock{min-width:90px}.ratingSection.extendedFull .ratingContent .ratingOverview .leftBlock .bigAvg{font-size:42px}.ratingSection.extendedFull .ratingContent .ratingOverview .leftBlock .starsRow .smallStar{font-size:14px}.ratingSection.extendedFull .ratingContent .ratingOverview .leftBlock .ratingCount{font-size:12px}.ratingSection.extendedFull .ratingContent .ratingOverview .barsBlock{gap:7px}.ratingSection.extendedFull .ratingContent .ratingOverview .barsBlock .barRow .starNumber{font-size:13px}.ratingSection.extendedFull .ratingContent .ratingOverview .barsBlock .barRow .barOuter{height:9px}.ratingSection.extendedFull .ratingContent .userRatingSection{width:30%;height:150px;padding:14px 18px}.ratingSection.extendedFull .ratingContent .userRatingSection .ratingHeader{margin-bottom:12px}.ratingSection.extendedFull .ratingContent .userRatingSection .ratingHeader .ratingTitle{font-size:14px}.ratingSection.extendedFull .ratingContent .userRatingSection .starsContainer{gap:5px;margin-bottom:12px}.ratingSection.extendedFull .ratingContent .userRatingSection .starsContainer .star{font-size:13px}.ratingSection.extendedFull .ratingContent .userRatingSection .ratingActions{gap:8px}.ratingSection.extendedFull .ratingContent .userRatingSection .ratingActions .unrateBtn{padding:6px 12px;font-size:12px}.ratingSection.extendedFull .ratingContent .userRatingSection .ratingActions .notRatedText{font-size:12px}.musicPlayerBar{background-color:var(--black-lv1);justify-content:space-between;align-items:center;gap:20px;height:80px;padding:0 20px;display:flex}.musicPlayerBar .left{align-items:center;gap:10px;width:27%;display:flex}.musicPlayerBar .left .currentSongImage{width:60px;height:60px}.musicPlayerBar .left .currentSongImage img{object-fit:cover;border-radius:4px;width:100%;height:100%}.musicPlayerBar .left .currentSongInfo{color:#fff;margin-left:10px}.musicPlayerBar .left .currentSongInfo .title{font-size:14px;font-weight:700}.musicPlayerBar .left .currentSongInfo .artist{color:var(--black-lv4);font-size:12px}.musicPlayerBar .center{flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex}.musicPlayerBar .center .controls{flex-direction:column;align-items:center;gap:0;display:flex}.musicPlayerBar .center .controls .topControl{align-items:center;gap:35px;display:flex}.musicPlayerBar .center .controls .topControl button{color:#fff;cursor:pointer;background:0 0;border:none;font-size:20px}.musicPlayerBar .center .controls .topControl .playPause{background-color:var(--white-lv1);border-radius:50%;width:32px;height:32px;line-height:32px}.musicPlayerBar .center .controls .bottomControll{color:var(--black-lv4);align-items:center;gap:10px;margin-top:5px;font-size:12px;display:flex}.musicPlayerBar .center .controls .bottomControll .progress input{cursor:pointer;outline:none;width:500px;height:8px}.musicPlayerBar .center .listenMusic video,.musicPlayerBar .center .listenMusic audio{opacity:0;width:0;height:0;position:absolute}.musicPlayerBar .right{justify-content:flex-end;align-items:center;gap:10px;width:27%;display:flex}.musicPlayerBar .right .volume{align-items:center;gap:10px;width:120px;display:flex}input[type=range]{appearance:none;background:0 0;outline:none;width:100%}input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--white-lv1) var(--progress,0%), gray var(--progress,0%));border-radius:2px;height:4px}input[type=range]:hover::-webkit-slider-runnable-track{background:linear-gradient(to right, #1cc759 var(--progress,0%), gray var(--progress,0%))}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;border-radius:50%;width:12px;height:12px;margin-top:-4px}input[type=range]:hover::-webkit-slider-thumb{background:var(--white-lv1)}input[type=range]::-moz-range-track{background:linear-gradient(to right, var(--white-lv1) var(--progress,0%), gray var(--progress,0%));border-radius:2px;height:4px}input[type=range]:hover::-moz-range-track{background:linear-gradient(to right, #1cc759 var(--progress,0%), gray var(--progress,0%))}input[type=range]::-moz-range-thumb{cursor:pointer;background:0 0;border:none;border-radius:50%;width:12px;height:12px}input[type=range]:hover::-moz-range-thumb{background:var(--white-lv1)}.homePage{flex-direction:column;height:100%;display:flex}.homePage .content{padding:var(--padding-lv1);background-color:var(--black-lv1);flex:1;position:relative;overflow:hidden scroll}.sign-up-page{background-color:var(--black-lv1);flex-direction:column;align-items:center;min-height:100vh;display:flex}.sign-up-page .sign-up{background-color:var(--black-lv1);width:350px;margin-top:50px}.sign-up-page .sign-up .sign-up-header{flex-direction:column;align-items:center;margin-bottom:20px;display:flex}.sign-up-page .sign-up .sign-up-header .sign-up-title{color:var(--white-lv1);text-align:center;font-size:40px;font-weight:800}.sign-up-page .sign-up .sign-up-email .email-label,.sign-up-page .sign-up .sign-up-email .password-label{color:var(--white-lv1);margin-bottom:10px;font-size:12px;font-weight:600}.sign-up-page .sign-up .sign-up-email #email-input,.sign-up-page .sign-up .sign-up-email #password-input{border:none;border:1px solid var(--black-lv4);background-color:var(--black-lv1);width:100%;height:40px;color:var(--white-lv1);border-radius:4px;margin-bottom:10px;padding:20px 10px;font-weight:600}.sign-up-page .sign-up .sign-up-email .error-message{color:#f3727f;margin-bottom:10px;font-size:14px;font-weight:600}.sign-up-page .sign-up .sign-up-email .btn-next{color:#000;cursor:pointer;background-color:#1ed760;border:none;border-radius:50px;width:100%;height:40px;margin-bottom:20px;font-size:16px;font-weight:700}.sign-up-page .sign-up .sign-up-email .btn-next:hover{background-color:#1feb68}.sign-up-page .sign-up .divider{color:var(--white-lv1);align-items:center;margin-bottom:20px;font-size:14px;display:flex}.sign-up-page .sign-up .divider:before,.sign-up-page .sign-up .divider:after{content:"";border-bottom:1px solid #ccc;flex:1}.sign-up-page .sign-up .divider:before{margin-right:10px}.sign-up-page .sign-up .divider:after{margin-left:10px}.sign-up-page .sign-up .dividerFull{background-color:var(--black-lv4);width:100%;height:1px;margin-bottom:30px}.sign-up-page .sign-up .sign-up-footer .have-account{color:var(--black-lv4);justify-content:center;align-items:center;gap:5px;margin-bottom:40px;font-size:14px;display:flex}.sign-up-page .sign-up .sign-up-footer .have-account a{color:var(--white-lv1);text-decoration:underline}.sign-up-page .sign-up .sign-up-footer .policy{color:var(--black-lv4);text-align:center;margin-bottom:20px;font-size:12px}.sign-up-page .sign-up .sign-up-footer .policy a{color:var(--white-lv1);text-decoration:underline}.sign-up-vertify-page{background-color:var(--black-lv1);height:100vh;position:relative}.sign-up-vertify-page .sign-up-vertify{background-color:var(--black-lv1);width:350px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.sign-up-vertify-page .sign-up-vertify .verification-successfully{color:var(--white-lv1);text-align:center;font:24px;margin-bottom:30px;font-weight:700}.sign-up-vertify-page .sign-up-vertify .sign-up-header{flex-direction:column;align-items:center;margin-bottom:50px;display:flex}.sign-up-vertify-page .sign-up-vertify .verification .verification-lable{color:var(--white-lv1);margin-bottom:10px;font-size:12px;font-weight:600}.sign-up-vertify-page .sign-up-vertify .verification #verification-code{border:none;border:1px solid var(--black-lv4);background-color:var(--black-lv1);width:100%;height:40px;color:var(--white-lv1);border-radius:4px;margin-bottom:10px;padding:20px 10px;font-weight:600}.sign-up-vertify-page .sign-up-vertify .verification .error-message{color:#f3727f;margin-bottom:10px;font-size:14px;font-weight:600}.sign-up-vertify-page .sign-up-vertify .verification .btn-complete{color:#000;cursor:pointer;background-color:#1ed760;border:none;border-radius:50px;width:100%;height:40px;margin-bottom:20px;font-size:16px;font-weight:700}.sign-up-vertify-page .sign-up-vertify .verification .btn-complete:hover{background-color:#1feb68}.sign-up-vertify-page .sign-up-vertify .divider{color:var(--white-lv1);align-items:center;margin-bottom:40px;font-size:14px;display:flex}.sign-up-vertify-page .sign-up-vertify .divider:before,.sign-up-vertify-page .sign-up-vertify .divider:after{content:"";border-bottom:1px solid #ccc;flex:1}.sign-up-vertify-page .sign-up-vertify .divider:before{margin-right:10px}.sign-up-vertify-page .sign-up-vertify .divider:after{margin-left:10px}.sign-up-vertify-page .sign-up-vertify .social-login{flex-direction:column;align-items:center;gap:10px;margin-bottom:50px;display:flex}.sign-up-vertify-page .sign-up-vertify .social-login .google-login,.sign-up-vertify-page .sign-up-vertify .social-login .apple-login{width:100%;color:var(--white-lv1);border:1px solid #ccc;border-radius:50px;place-content:center space-between;align-items:center;padding:6px 0;display:flex}.sign-up-vertify-page .sign-up-vertify .social-login .google-login .icon-google,.sign-up-vertify-page .sign-up-vertify .social-login .google-login .icon-apple,.sign-up-vertify-page .sign-up-vertify .social-login .apple-login .icon-google,.sign-up-vertify-page .sign-up-vertify .social-login .apple-login .icon-apple{padding-left:20px}.sign-up-vertify-page .sign-up-vertify .social-login .google-login .signUpGoogle,.sign-up-vertify-page .sign-up-vertify .social-login .google-login .signUpApple,.sign-up-vertify-page .sign-up-vertify .social-login .apple-login .signUpGoogle,.sign-up-vertify-page .sign-up-vertify .social-login .apple-login .signUpApple{text-align:center;flex:1;margin-right:30px;font-weight:600}.sign-up-vertify-page .sign-up-vertify .dividerFull{background-color:var(--black-lv4);width:100%;height:1px;margin-bottom:30px}.sign-up-vertify-page .sign-up-vertify .sign-up-footer .have-account{color:var(--black-lv4);justify-content:center;align-items:center;gap:5px;margin-bottom:40px;font-size:14px;display:flex}.sign-up-vertify-page .sign-up-vertify .sign-up-footer .have-account a{color:var(--white-lv1);text-decoration:underline}.sign-up-vertify-page .sign-up-vertify .sign-up-footer .policy{color:var(--black-lv4);text-align:center;margin-bottom:20px;font-size:12px}.sign-up-vertify-page .sign-up-vertify .sign-up-footer .policy a{color:var(--white-lv1);text-decoration:underline}.google-login{width:100%;color:var(--white-lv1);border:1px solid #ccc;border-radius:50px;justify-content:space-between;align-items:center;margin-bottom:20px;padding:6px 0;display:flex}.google-login .icon-google{padding-left:20px}.google-login .signUpGoogle{text-align:center;flex:1;margin-right:30px;font-weight:600}.login-page{background:linear-gradient(to bottom, #2a2a2a, var(--black-lv1));flex-direction:column;align-items:center;min-height:100vh;display:flex}.login-page .sign-up{background-color:var(--black-lv1);border-radius:8px;width:650px;margin-top:50px;padding:50px 150px}.login-page .sign-up .sign-up-header{flex-direction:column;align-items:center;margin-bottom:20px;display:flex}.login-page .sign-up .sign-up-header .sign-up-title{color:var(--white-lv1);text-align:center;font-size:40px;font-weight:800}.login-page .sign-up .sign-up-email .email-label,.login-page .sign-up .sign-up-email .password-label{color:var(--white-lv1);margin-bottom:10px;font-size:12px;font-weight:600}.login-page .sign-up .sign-up-email #email-input,.login-page .sign-up .sign-up-email #password-input{border:none;border:1px solid var(--black-lv4);background-color:var(--black-lv1);width:100%;height:40px;color:var(--white-lv1);border-radius:4px;margin-bottom:10px;padding:20px 10px;font-weight:600}.login-page .sign-up .sign-up-email .error-message{color:#f3727f;margin-bottom:10px;font-size:14px;font-weight:600}.login-page .sign-up .sign-up-email .btn-login{color:#000;cursor:pointer;background-color:#1ed760;border:none;border-radius:50px;width:100%;height:40px;margin-bottom:20px;font-size:16px;font-weight:700}.login-page .sign-up .sign-up-email .btn-login:hover{background-color:#1feb68}.login-page .sign-up .divider{color:var(--white-lv1);align-items:center;margin-bottom:20px;font-size:14px;display:flex}.login-page .sign-up .divider:before,.login-page .sign-up .divider:after{content:"";border-bottom:1px solid #ccc;flex:1}.login-page .sign-up .divider:before{margin-right:10px}.login-page .sign-up .divider:after{margin-left:10px}.login-page .sign-up .dividerFull{background-color:var(--black-lv4);width:100%;height:1px;margin-bottom:30px}.login-page .sign-up .sign-up-footer .have-account{color:var(--black-lv4);justify-content:center;align-items:center;gap:5px;margin-bottom:40px;font-size:14px;display:flex}.login-page .sign-up .sign-up-footer .have-account a{color:var(--white-lv1);text-decoration:underline}.login-page .sign-up .sign-up-footer .policy{color:var(--black-lv4);text-align:center;margin-bottom:20px;font-size:12px}.login-page .sign-up .sign-up-footer .policy a{color:var(--white-lv1);text-decoration:underline}.upload-song-page{background:var(--black-lv2);flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding-bottom:50px;display:flex;position:relative}.upload-song-page .title{color:var(--white-lv1);margin-bottom:20px}.page-center{z-index:1;justify-content:center;align-items:center;width:100%;max-width:1200px;display:flex}.card{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);color:#fff;background:#1e1e28b3;border:1px solid #ffffff14;border-radius:20px;width:100%;padding:30px;box-shadow:0 20px 60px #0006,0 0 0 1px #ffffff0d}.upload-song-form .form-content{grid-template-columns:650px 1fr;align-items:start;gap:30px;display:grid}.upload-song-form .left{flex-direction:column;gap:16px;display:flex}.upload-song-form .media-box,.upload-song-form .image-box{background:var(--black-lv3);cursor:pointer;border:2px solid #ffffff1a;border-radius:12px;justify-content:center;align-items:center;width:100%;height:260px;transition:all .3s;display:flex;position:relative;overflow:hidden}.upload-song-form .media-box:hover,.upload-song-form .image-box:hover{border-color:var(--gray-lv1);background:linear-gradient(135deg,#1f1f1f 0%,#2f2f2f 100%)}.upload-song-form .media-box.drag-over,.upload-song-form .image-box.drag-over{background:#4caf501a;border-style:solid;border-color:#4caf50}.upload-song-form .media-box video,.upload-song-form .media-box audio,.upload-song-form .image-box video,.upload-song-form .image-box audio{border-radius:12px;width:100%;height:100%}.upload-song-form .media-box video,.upload-song-form .media-box img,.upload-song-form .image-box video,.upload-song-form .image-box img{object-fit:cover}.upload-song-form .media-box .placeholder,.upload-song-form .image-box .placeholder{opacity:.5;text-align:center;color:#88a;padding:20px;font-size:13px}.upload-song-form .right{flex-direction:column;gap:16px;display:flex}.upload-song-form .field{flex-direction:column;gap:6px;padding-bottom:18px;display:flex;position:relative}.upload-song-form .field label{color:#aaa;text-transform:uppercase;letter-spacing:.5px;font-size:13px;font-weight:600}.upload-song-form .field input{color:#fff;background:#ffffff08;border:2px solid #ffffff14;border-radius:10px;outline:none;padding:12px 14px;font-size:14px;transition:all .3s}.upload-song-form .field input:focus{border-color:var(--gray-lv2);background:#ffffff0d;box-shadow:0 0 0 3px #8a2be21a}.upload-song-form .field input::placeholder{color:#555}.upload-song-form .field input.error{border-color:#ff4d4f}.upload-song-form .field .error-text{color:#ff4d4f;pointer-events:none;opacity:0;font-size:12px;transition:all .25s;position:absolute;bottom:0;left:0;transform:translateY(5px)}.upload-song-form .field input.error+.error-text{opacity:1;transform:translateY(0)}.upload-song-form .multi-select{background:#ffffff05;border:2px solid #ffffff14;border-radius:10px;max-height:270px;padding:10px;overflow-y:auto}.upload-song-form .multi-select .options{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px;display:grid}.upload-song-form .multi-select .options .option{cursor:pointer;text-align:center;background:#ffffff0d;border:2px solid #0000;border-radius:8px;padding:8px 0;font-size:11px;font-weight:600;transition:all .2s;overflow:hidden}.upload-song-form .multi-select .options .option:hover{background:#ffffff14;transform:translateY(-1px)}.upload-song-form .multi-select .options .option.active{color:var(--black-lv1);background:var(--white-lv1)}.upload-song-form .multi-select::-webkit-scrollbar{width:8px}.upload-song-form .multi-select::-webkit-scrollbar-button{display:none}.upload-song-form .multi-select::-webkit-scrollbar-track{background:var(--gray-lv1)}.upload-song-form .multi-select::-webkit-scrollbar-thumb{background:var(--gray-lv2);border-radius:4px}.upload-song-form .multi-select::-webkit-scrollbar-thumb:hover{background:var(--gray-lv3)}.upload-song-form .submit-btn{background:var(--black-lv3);color:#fff;cursor:pointer;border:none;border-radius:10px;width:100%;margin-top:6px;padding:14px 28px;font-size:15px;font-weight:700;transition:all .3s;position:relative}.upload-song-form .submit-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea80}.upload-song-form .submit-btn:active{transform:translateY(0)}.upload-song-form .submit-btn.success{color:#fff;background-color:#4caf50}.upload-song-form .submit-btn.success span{z-index:1;position:relative}.upload-song-form .submit-btn.error{color:#fff;background-color:#f44336}.upload-song-form .submit-btn.loading{cursor:not-allowed}.upload-song-form .submit-btn.loading:after{content:"";z-index:0;border-radius:inherit;background-color:#4caf5080;width:0;height:100%;animation:3s forwards successFill;position:absolute;top:0;left:0}.upload-song-form .submit-btn .error,.upload-song-form .submit-btn .success{border:2px solid;border-radius:10px;padding:12px 16px;font-size:13px;font-weight:500;animation:.3s slideIn}.upload-song-form .submit-btn .error{color:#fca5a5;background:#dc26261a;border-color:#dc26264d}.upload-song-form .submit-btn .success{color:#86efac;background:#22c55e1a;border-color:#22c55e4d}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes successFill{0%{width:0%}to{width:100%}}@media (width<=1024px){.upload-song-form .form-content{grid-template-columns:1fr;gap:24px}.media-box,.image-box{height:200px!important}.multi-select{max-height:140px}}@media (width<=600px){.card{padding:20px}.media-box,.image-box{height:180px!important}.multi-select .options{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:6px}}.paginationContainer{justify-content:center;align-items:center;gap:15px;margin-top:auto;padding-bottom:10px;display:flex}.paginationContainer button{background-color:var(--black-lv3);color:var(--white-lv2);cursor:pointer;border:none;border-radius:6px;padding:6px 14px;transition:all .2s}.paginationContainer button:active{transform:scale(.92)}.paginationContainer button:disabled{opacity:.4;cursor:not-allowed}.paginationContainer button:not(:disabled):hover{color:var(--black-lv1);background-color:#1ed760}.paginationContainer span{color:var(--white-lv2);font-size:14px}.userListContainer{flex-direction:column;height:100%;display:flex}.userListContainer .userListHeader{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.userListContainer .userListHeader h2{color:var(--white-lv1);font-size:24px;font-weight:700}.userListContainer .userListTable{background-color:var(--black-lv3);border-radius:10px;flex-direction:column;flex:1;min-height:0;margin-bottom:20px;display:flex;overflow:hidden}.userListContainer .userListTable table{border-collapse:collapse;table-layout:fixed;flex-direction:column;width:100%;height:100%;display:flex}.userListContainer .userListTable table thead tr th:first-child,.userListContainer .userListTable table tbody tr td:first-child{width:7%}.userListContainer .userListTable table thead tr th:nth-child(2),.userListContainer .userListTable table tbody tr td:nth-child(2){width:23%}.userListContainer .userListTable table thead tr th:nth-child(3),.userListContainer .userListTable table tbody tr td:nth-child(3){width:30%}.userListContainer .userListTable table thead tr th:nth-child(4),.userListContainer .userListTable table tbody tr td:nth-child(4),.userListContainer .userListTable table thead tr th:nth-child(5),.userListContainer .userListTable table tbody tr td:nth-child(5){width:20%}.userListContainer .userListTable table thead{flex-shrink:0}.userListContainer .userListTable table thead tr{table-layout:fixed;width:100%;display:table}.userListContainer .userListTable table thead tr th{text-align:left;color:var(--white-lv2);background-color:var(--black-lv3);border-bottom:1px solid var(--black-lv2);cursor:pointer;-webkit-user-select:none;user-select:none;padding:14px;font-size:14px;font-weight:700;transition:all .2s}.userListContainer .userListTable table thead tr th:hover{color:var(--white-lv1);background-color:var(--black-lv1)}.userListContainer .userListTable table thead tr th.active{color:#1ed760;background-color:#1ed76014}.userListContainer .userListTable table thead tr th .thContent{justify-content:space-between;align-items:center;gap:8px;display:flex}.userListContainer .userListTable table thead tr th .thContent .sortIcon{opacity:.5;font-size:10px;transition:opacity .2s}.userListContainer .userListTable table thead tr th:hover .sortIcon,.userListContainer .userListTable table thead tr th.active .sortIcon{opacity:1}.userListContainer .userListTable table tbody{flex:1;width:100%;display:block;overflow:hidden auto}.userListContainer .userListTable table tbody.loadingRows{opacity:.4;pointer-events:none;transition:opacity .25s}.userListContainer .userListTable table tbody tr{table-layout:fixed;border-bottom:1px solid var(--black-lv3);width:100%;transition:background-color .2s;display:table}.userListContainer .userListTable table tbody tr:hover{background-color:var(--black-lv1)}.userListContainer .userListTable table tbody tr td{color:var(--white-lv1);padding:14px;font-size:14px}.userListContainer .userListTable table tbody tr td .statusBadge{text-transform:uppercase;border-radius:12px;padding:4px 12px;font-size:12px;font-weight:600;display:inline-block}.userListContainer .userListTable table tbody tr td .statusBadge.active{color:#34c759;background-color:#34c7592e}.userListContainer .userListTable table tbody tr td .statusBadge.banned{color:#ff9500;background-color:#ff950033}.userListContainer .userListTable table tbody tr td .statusBadge.locked{color:#ff3b30;background-color:#ff3b3033}.userListContainer .userListTable table tbody tr td .viewBtn{background-color:var(--black-lv2);color:var(--white-lv1);border:1px solid var(--black-lv1);cursor:pointer;border-radius:6px;padding:6px 18px;font-size:13px;transition:all .2s}.userListContainer .userListTable table tbody tr td .viewBtn:hover{color:var(--black-lv1);background-color:#1ed760;border-color:#1ed760}.songListContainer{flex-direction:column;height:100%;display:flex}.songListContainer .songListHeader{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.songListContainer .songListHeader h2{color:var(--white-lv1);font-size:24px;font-weight:700}.songListContainer .songListTable{background-color:var(--black-lv3);border-radius:10px;flex-direction:column;flex:1;min-height:0;margin-bottom:20px;display:flex;overflow:hidden}.songListContainer .songListTable table{border-collapse:collapse;table-layout:fixed;flex-direction:column;width:100%;height:100%;display:flex}.songListContainer .songListTable table thead tr th:first-child,.songListContainer .songListTable table tbody tr td:first-child{width:7%}.songListContainer .songListTable table thead tr th:nth-child(2),.songListContainer .songListTable table tbody tr td:nth-child(2){width:23%}.songListContainer .songListTable table thead tr th:nth-child(3),.songListContainer .songListTable table tbody tr td:nth-child(3){width:30%}.songListContainer .songListTable table thead tr th:nth-child(4),.songListContainer .songListTable table tbody tr td:nth-child(4),.songListContainer .songListTable table thead tr th:nth-child(5),.songListContainer .songListTable table tbody tr td:nth-child(5){width:20%}.songListContainer .songListTable table thead{flex-shrink:0}.songListContainer .songListTable table thead tr{table-layout:fixed;width:100%;display:table}.songListContainer .songListTable table thead tr th{text-align:left;color:var(--white-lv2);background-color:var(--black-lv3);border-bottom:1px solid var(--black-lv2);cursor:pointer;-webkit-user-select:none;user-select:none;padding:14px;font-size:14px;font-weight:700;transition:all .2s}.songListContainer .songListTable table thead tr th:hover{color:var(--white-lv1);background-color:var(--black-lv1)}.songListContainer .songListTable table thead tr th.active{color:#1ed760;background-color:#1ed76014}.songListContainer .songListTable table thead tr th .thContent{justify-content:space-between;align-items:center;gap:8px;display:flex}.songListContainer .songListTable table thead tr th .thContent .sortIcon{opacity:.5;font-size:10px;transition:opacity .2s}.songListContainer .songListTable table thead tr th:hover .sortIcon,.songListContainer .songListTable table thead tr th.active .sortIcon{opacity:1}.songListContainer .songListTable table tbody{flex:1;width:100%;display:block;overflow:hidden auto}.songListContainer .songListTable table tbody.loadingRows{opacity:.4;pointer-events:none;transition:opacity .25s}.songListContainer .songListTable table tbody tr{table-layout:fixed;border-bottom:1px solid var(--black-lv3);width:100%;transition:background-color .2s;display:table}.songListContainer .songListTable table tbody tr:hover{background-color:var(--black-lv1)}.songListContainer .songListTable table tbody tr td{color:var(--white-lv1);padding:14px;font-size:14px}.songListContainer .songListTable table tbody tr td .statusBadge{text-transform:uppercase;border-radius:12px;padding:4px 12px;font-size:12px;font-weight:600;display:inline-block}.songListContainer .songListTable table tbody tr td .statusBadge.active{color:#34c759;background-color:#34c7592e}.songListContainer .songListTable table tbody tr td .statusBadge.banned{color:#ff9500;background-color:#ff950033}.songListContainer .songListTable table tbody tr td .statusBadge.locked{color:#ff3b30;background-color:#ff3b3033}.songListContainer .songListTable table tbody tr td .viewBtn{background-color:var(--black-lv2);color:var(--white-lv1);border:1px solid var(--black-lv1);cursor:pointer;border-radius:6px;padding:6px 18px;font-size:13px;transition:all .2s}.songListContainer .songListTable table tbody tr td .viewBtn:hover{color:var(--black-lv1);background-color:#1ed760;border-color:#1ed760}.userDetailContainer{flex-direction:column;gap:20px;display:flex}.userDetailContainer .userDetailAvatar{justify-content:center;display:flex}.userDetailContainer .userDetailAvatar img{object-fit:cover;border:4px solid var(--black-lv3);border-radius:50%;width:120px;height:120px}.userDetailContainer .userDetailInfo h3{text-align:center;margin-bottom:8px;font-size:22px;font-weight:700}.userDetailContainer .userDetailInfo .userDetailEmail{text-align:center;color:var(--white-lv2);margin-bottom:24px}.userDetailContainer .userDetailInfo .userDetailSection{background-color:var(--black-lv3);border-radius:8px;margin-bottom:12px;padding:12px;position:relative}.userDetailContainer .userDetailInfo .userDetailSection label{text-transform:uppercase;color:var(--white-lv2);margin-bottom:6px;font-size:12px;display:block}.userDetailContainer .userDetailInfo .userDetailSection span{border-radius:12px;padding:4px 12px;font-size:14px;font-weight:600}.userDetailContainer .userDetailInfo .userDetailSection .roleList{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.userDetailContainer .userDetailInfo .userDetailSection .roleList .roleBadge{border-radius:12px;align-items:center;gap:6px;padding:4px 12px;font-size:12px;font-weight:600;transition:background .2s;display:flex;position:relative}.userDetailContainer .userDetailInfo .userDetailSection .roleList .roleBadge .removeRoleBtn{opacity:0;color:#fff;cursor:pointer;background:0 0;border:none;transition:opacity .2s}.userDetailContainer .userDetailInfo .userDetailSection .roleList .roleBadge:hover .removeRoleBtn{opacity:1}.userDetailContainer .userDetailInfo .userDetailSection .roleList .roleBadge.admin{color:#30ffee;background-color:#2fd3bf33}.userDetailContainer .userDetailInfo .userDetailSection .roleList .roleBadge.artist{color:#5856d6;background-color:#5856d633}.userDetailContainer .userDetailInfo .userDetailSection .roleList .roleBadge.user{color:#34c759;background-color:#34c75933}.userDetailContainer .userDetailInfo .userDetailSection .roleList .roleBadge.none{color:#8e8e93;background-color:#8e8e9333}.userDetailContainer .userDetailInfo .userDetailSection .toggleAddRoleBtn{cursor:pointer;border:1px solid var(--white-lv2);width:100%;color:var(--white-lv1);border-radius:20px;margin:15px 0;padding:10px 20px;font-size:14px;font-weight:600;transition:all .2s}.userDetailContainer .userDetailInfo .userDetailSection .toggleAddRoleBtn.open{color:#ff3b30;background:#ff3b3033;border-color:#ff3b30}.userDetailContainer .userDetailInfo .userDetailSection .toggleAddRoleBtn.open:hover{background:#ff3b3059}.userDetailContainer .userDetailInfo .userDetailSection .dropdownRoleBox{border-radius:6px;flex-direction:column;margin-top:10px;animation:.18s forwards dropdownFadeSlide;display:flex;overflow:hidden}.userDetailContainer .userDetailInfo .userDetailSection .dropdownRoleBox .dropdownRoleItem{cursor:pointer;color:var(--white-lv1);background:var(--gray-lv1);padding:10px;font-size:14px;transition:all .15s}.userDetailContainer .userDetailInfo .userDetailSection .dropdownRoleBox .dropdownRoleItem:hover{background:var(--gray-lv2)}.userDetailContainer .userDetailInfo .userDetailSection .dropdownRoleBox .dropdownRoleItem.disabled{color:var(--white-lv3);cursor:default}.userDetailContainer .userDetailInfo .userDetailSection .statusBadge{border-radius:12px;padding:4px 12px;font-size:12px;font-weight:600}.userDetailContainer .userDetailInfo .userDetailSection .statusBadge.active{color:#34c759}.userDetailContainer .userDetailInfo .userDetailSection .statusBadge.locked{color:#ff3b30}.userDetailContainer .userDetailInfo .userDetailSection .statusBadge.banned{color:#ff9500}.userDetailContainer .userDetailInfo .userDetailSection .userMetric{justify-content:space-between;align-items:center;padding:6px 0;font-size:14px;display:flex}.userDetailContainer .userDetailInfo .userDetailSection .userMetric .metricLabel{color:var(--white-lv2);text-transform:uppercase;font-size:12px}.userDetailContainer .userDetailInfo .userDetailSection .userMetric .metricValue{color:var(--white-lv1);font-weight:600}.userDetailContainer .userDetailActions{flex-direction:column;gap:10px;margin-top:20px;display:flex}.userDetailContainer .userDetailActions button{cursor:pointer;border:none;border-radius:8px;padding:12px;font-weight:600}.userDetailContainer .userDetailActions button.banBtn{color:#fff;background:#ff9500}.userDetailContainer .userDetailActions button.banBtn:hover{box-shadow:0 4px 12px #ff95004d}.userDetailContainer .userDetailActions button.blockBtn{color:#fff;background:#ff3b30}.userDetailContainer .userDetailActions button.blockBtn:hover{box-shadow:0 4px 12px #ff3b304d}.userDetailContainer .userDetailActions button.unblockBtn{color:#000;background:#1ed760}.userDetailContainer .userDetailActions button.unblockBtn:hover{box-shadow:0 4px 12px #1ed76059}.userDetailContainer .userDetailActions button.closeBtn{background:var(--black-lv3);color:#fff}.userDetailContainer .userDetailActions button.closeBtn:hover{background:var(--black-lv4)}@keyframes dropdownFadeSlide{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.songDetailContainer{flex-direction:column;gap:20px;display:flex}.songDetailContainer .songDetailThumbnail{justify-content:center;display:flex}.songDetailContainer .songDetailThumbnail img{object-fit:cover;border:4px solid var(--black-lv3);border-radius:12px;width:150px;height:150px}.songDetailContainer .songDetailInfo h3{text-align:center;margin-bottom:8px;font-size:22px;font-weight:700}.songDetailContainer .songDetailInfo .songDetailAuthor{text-align:center;color:var(--white-lv2);margin-bottom:24px;font-size:14px}.songDetailContainer .songDetailInfo .songDetailSection{background-color:var(--black-lv3);border-radius:8px;margin-bottom:12px;padding:12px;position:relative}.songDetailContainer .songDetailInfo .songDetailSection label{text-transform:uppercase;color:var(--white-lv2);margin-bottom:6px;font-size:12px;display:block}.songDetailContainer .songDetailInfo .songDetailSection span{border-radius:12px;padding:4px 12px;font-size:14px;font-weight:600}.songDetailContainer .songDetailInfo .songDetailSection .genreList{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.songDetailContainer .songDetailInfo .songDetailSection .genreList .genreBadge{color:#dedede;background-color:#8e8e9333;border-radius:12px;padding:4px 12px;font-size:12px;font-weight:600}.songDetailContainer .songDetailInfo .songDetailSection .genreList .genreBadge.none{opacity:.5}.songDetailContainer .songDetailInfo .songDetailSection .statusBadge{border-radius:12px;padding:4px 12px;font-size:12px;font-weight:600}.songDetailContainer .songDetailInfo .songDetailSection .statusBadge.active{color:#34c759}.songDetailContainer .songDetailInfo .songDetailSection .statusBadge.banned{color:#ff9500}.songDetailContainer .songDetailInfo .songDetailSection .songMetric{justify-content:space-between;align-items:center;padding:6px 0;font-size:14px;display:flex}.songDetailContainer .songDetailInfo .songDetailSection .songMetric .metricLabel{color:var(--white-lv2);text-transform:uppercase;font-size:12px}.songDetailContainer .songDetailInfo .songDetailSection .songMetric .metricValue{color:var(--white-lv1);font-weight:600}.songDetailContainer .songDetailActions{flex-direction:column;gap:10px;margin-top:20px;display:flex}.songDetailContainer .songDetailActions button{cursor:pointer;border:none;border-radius:8px;padding:12px;font-size:14px;font-weight:600}.songDetailContainer .songDetailActions button.banBtn{color:#fff;background:#ff9500}.songDetailContainer .songDetailActions button.banBtn:hover{box-shadow:0 4px 12px #ff3b304d}.songDetailContainer .songDetailActions button.unblockBtn{color:#000;background:#1ed760}.songDetailContainer .songDetailActions button.unblockBtn:hover{box-shadow:0 4px 12px #1ed76059}.songDetailContainer .songDetailActions button.closeBtn{background:var(--black-lv3);color:#fff}.songDetailContainer .songDetailActions button.closeBtn:hover{background:var(--black-lv4)}.adminWrapper{background-color:var(--black-lv1);width:100%;height:calc(100vh - 80px);color:var(--white-lv1);padding:10px;position:relative}.adminWrapper .adminLeft{width:calc(16% - 10px);height:100%;padding:var(--padding-lv2);background-color:var(--black-lv2);z-index:3;border-radius:8px;transition:width .3s ease-in-out;position:absolute;top:0;left:10px;overflow-y:auto}.adminWrapper .adminLeft::-webkit-scrollbar{width:6px}.adminWrapper .adminLeft::-webkit-scrollbar-track{background:0 0}.adminWrapper .adminLeft::-webkit-scrollbar-thumb{background:var(--black-lv3);border-radius:4px}.adminWrapper .adminLeft::-webkit-scrollbar-thumb:hover{background:var(--black-lv4)}.adminWrapper .adminLeft .adminLogo{color:var(--white-lv1);text-align:center;border-bottom:2px solid var(--black-lv3);margin-bottom:10px;padding:10px 0;font-size:28px;font-weight:700}.adminWrapper .adminLeft .adminNav{color:var(--white-lv2);cursor:pointer;border-radius:8px;margin-bottom:8px;padding:14px 20px;font-size:16px;font-weight:600;text-decoration:none;transition:all .2s;display:block;position:relative}.adminWrapper .adminLeft .adminNav:hover,.adminWrapper .adminLeft .adminNav.active{background-color:var(--black-lv3);color:var(--white-lv1)}.adminWrapper .adminLeft .adminNav.active:before{content:"";background-color:#1ed760;border-radius:4px;width:4px;height:100%;position:absolute;top:50%;left:0;transform:translateY(-50%)}.adminWrapper .adminMiddle{width:calc(82% - 20px);height:100%;padding:var(--padding-lv2);background-color:var(--black-lv2);z-index:2;border-radius:8px;transition:width .3s ease-in-out,left .3s ease-in-out;position:absolute;top:0;left:calc(16% + 10px);overflow-y:auto}.adminWrapper .adminMiddle::-webkit-scrollbar{width:8px}.adminWrapper .adminMiddle::-webkit-scrollbar-track{background:0 0}.adminWrapper .adminMiddle::-webkit-scrollbar-thumb{background:var(--black-lv3);border-radius:4px}.adminWrapper .adminMiddle::-webkit-scrollbar-thumb:hover{background:var(--black-lv4)}.adminWrapper .adminMiddle.rightActive{width:calc(57% - 10px)}.adminWrapper .adminRight{width:calc(27% - 20px);height:100%;padding:var(--padding-lv2);background-color:var(--black-lv2);opacity:0;z-index:10;border-radius:8px;transition:transform .3s ease-in-out,opacity .3s ease-in-out;position:absolute;top:0;right:10px;overflow-y:auto;transform:translate(calc(100% + 20px))}.adminWrapper .adminRight::-webkit-scrollbar{width:8px}.adminWrapper .adminRight::-webkit-scrollbar-track{background:0 0}.adminWrapper .adminRight::-webkit-scrollbar-thumb{background:var(--black-lv3);border-radius:4px}.adminWrapper .adminRight::-webkit-scrollbar-thumb:hover{background:var(--black-lv4)}.adminWrapper .adminRight.rightActive{opacity:1;transform:translate(0)}.adminWrapper .adminRight .rightPanelHeader{border-bottom:2px solid var(--black-lv3);justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;display:flex}.adminWrapper .adminRight .rightPanelHeader .rightPanelTitle{color:var(--white-lv1);font-size:20px;font-weight:700}.adminWrapper .adminRight .rightPanelHeader .closeRightPanel{cursor:pointer;width:32px;height:32px;color:var(--white-lv2);border-radius:50%;justify-content:center;align-items:center;transition:background-color .2s;display:flex}.adminWrapper .adminRight .rightPanelHeader .closeRightPanel:hover{background-color:var(--black-lv3);color:var(--white-lv1)}.appStats{flex-direction:column;gap:25px;height:100%;padding:10px;display:flex}.appStats h2{color:var(--white-lv1);margin-bottom:10px;font-size:26px;font-weight:700}.appStats .timeRangeButtons{gap:10px;margin-bottom:20px;display:flex}.appStats .timeRangeButtons button{border:1px solid var(--black-lv2);background-color:var(--black-lv3);color:var(--white-lv2);cursor:pointer;border-radius:8px;padding:8px 20px;font-size:14px;transition:all .2s}.appStats .timeRangeButtons button:hover{background-color:var(--black-lv2)}.appStats .timeRangeButtons button.activeRange{color:var(--black-lv1);background-color:#1ed760;border-color:#1ed760}.appStats .statsChartWrapper{background-color:var(--black-lv3);border-radius:10px;padding:20px}.appStats .topSongsTable{border-collapse:collapse;background-color:var(--black-lv3);border-radius:10px;width:100%;overflow:hidden}.appStats .topSongsTable thead{background-color:var(--black-lv3);border-bottom:2px solid var(--black-lv2)}.appStats .topSongsTable thead th{color:var(--white-lv2);text-align:left;border-bottom:1px solid var(--black-lv3);padding:14px;font-size:14px;font-weight:700}.appStats .topSongsTable tbody tr{transition:background-color .2s}.appStats .topSongsTable tbody tr:hover{background-color:var(--black-lv1)}.appStats .topSongsTable tbody tr td{color:var(--white-lv1);border-bottom:1px solid var(--black-lv3);padding:14px;font-size:14px}.appStats .topSongsTable th:first-child,.appStats .topSongsTable td:first-child{width:10%}.appStats .topSongsTable th:nth-child(2),.appStats .topSongsTable td:nth-child(2),.appStats .topSongsTable th:nth-child(3),.appStats .topSongsTable td:nth-child(3){width:25%}.appStats .topSongsTable th:nth-child(4),.appStats .topSongsTable td:nth-child(4),.appStats .topSongsTable th:nth-child(5),.appStats .topSongsTable td:nth-child(5){width:20%}.chartBtn{color:#fff;cursor:pointer;background-color:#4a90e2;border:none;border-radius:6px;padding:6px 14px;font-size:13px;transition:background .2s}.chartBtn:hover{background-color:#357abd}.songStatsContainer{color:#fff;height:100%;padding:30px;overflow-y:auto}.songStatsContainer .backBtn{cursor:pointer;color:#fff;background:#333;border:none;border-radius:6px;margin-bottom:20px;padding:8px 15px;transition:all .2s}.songStatsContainer .backBtn:hover{background:#444}.songStatsContainer .title{margin-bottom:4px;font-size:28px;font-weight:700}.songStatsContainer .subtitle{color:#bbb;margin-bottom:20px;font-size:16px}.songStatsContainer .rangeSelector{gap:12px;margin:16px 0;display:flex}.songStatsContainer .rangeSelector .rangeButton{cursor:pointer;background:#f7f7f7;border:1px solid #ccc;border-radius:6px;padding:8px 14px;transition:all .2s}.songStatsContainer .rangeSelector .rangeButton:hover{background:#eaeaea}.songStatsContainer .rangeSelector .rangeButton.active{color:#fff;background:#4a90e2;border-color:#4a90e2}.songStatsContainer .chartWrapper{background:#1e1e1e;border-radius:12px;padding:20px;box-shadow:0 0 10px #0000004d}.notification{color:#fff;z-index:1200;opacity:0;background-color:#000c;border-radius:5px;padding:15px 25px;font-size:16px;transition:opacity .5s ease-in-out;position:fixed;bottom:100px;left:50%;transform:translate(-50%);box-shadow:0 2px 10px #0000004d}.notification.show{opacity:1}.playlist-panel{z-index:9999;color:#fff;background-color:#333;border-radius:6px;flex-direction:column;width:300px;padding:8px;display:flex;position:fixed}.playlist-panel .header{border-bottom:1px solid var(--gray-lv2);padding-bottom:5px;font-size:16px}.playlist-panel .header .search{background:var(--gray-lv2);border:none;border-radius:4px;align-items:center;gap:10px;width:100%;margin-bottom:10px;padding:6px 10px;display:flex}.playlist-panel .header .search .icon{font-size:16px}.playlist-panel .header .search input{color:#fff;background:0 0;border:none;outline:none;width:100%;font-size:14px}.playlist-panel .header .new-playlist{cursor:pointer;border-radius:2px;align-items:center;gap:5px;padding:8px 10px;font-size:14px;display:flex}.playlist-panel .header .new-playlist:hover{background-color:var(--gray-lv2)}.playlist-panel .playlist-list{cursor:pointer;border-radius:4px;outline:none;flex-direction:column;gap:5px;height:200px;margin-top:5px;font-size:14px;transition:background-color .2s;display:flex;overflow-y:auto}.playlist-panel .playlist-list:focus{outline:none}.playlist-panel .playlist-list::-webkit-scrollbar{width:8px}.playlist-panel .playlist-list::-webkit-scrollbar-track{background:var(--gray-lv1)}.playlist-panel .playlist-list::-webkit-scrollbar-thumb{background:var(--gray-lv2);border-radius:4px}.playlist-panel .playlist-list::-webkit-scrollbar-thumb:hover{background:var(--gray-lv3)}.playlist-panel .playlist-list .playlist-item{border-radius:2px;padding:8px 10px}.playlist-panel .playlist-list .playlist-item:hover{background-color:var(--gray-lv2)}.album-panel{z-index:9999;color:#fff;background-color:#333;border-radius:6px;flex-direction:column;width:300px;padding:8px;display:flex;position:fixed}.album-panel .header{border-bottom:1px solid var(--gray-lv2);padding-bottom:5px;font-size:16px}.album-panel .header .search{background:var(--gray-lv2);border:none;border-radius:4px;align-items:center;gap:10px;width:100%;margin-bottom:10px;padding:6px 10px;display:flex}.album-panel .header .search .icon{font-size:16px}.album-panel .header .search input{color:#fff;background:0 0;border:none;outline:none;width:100%;font-size:14px}.album-panel .album-list{cursor:pointer;border-radius:4px;outline:none;flex-direction:column;gap:5px;height:200px;margin-top:5px;font-size:14px;transition:background-color .2s;display:flex;overflow-y:auto}.album-panel .album-list:focus{outline:none}.album-panel .album-list::-webkit-scrollbar{width:8px}.album-panel .album-list::-webkit-scrollbar-track{background:var(--gray-lv1)}.album-panel .album-list::-webkit-scrollbar-thumb{background:var(--gray-lv2);border-radius:4px}.album-panel .album-list::-webkit-scrollbar-thumb:hover{background:var(--gray-lv3)}.album-panel .album-list .album-item{border-radius:2px;padding:8px 10px;transition:background-color .2s}.album-panel .album-list .album-item:hover{background-color:var(--gray-lv2)}.library-song-menu{z-index:9999;color:#fff;background-color:#333;border-radius:4px;flex-direction:column;gap:5px;width:200px;padding:4px;font-size:14px;display:flex;position:fixed}.library-song-menu .library-song-menu-item{border-radius:4px;padding:6px 10px}.library-song-menu .library-song-menu-item:hover{background:var(--gray-lv2)}*{box-sizing:border-box;margin:0;padding:0;font-family:Helvetica Neue,Helvetica,Arial,Hiragino Kaku Gothic ProN,Meiryo,MS Gothic,sans-serif;text-decoration:none}button{cursor:pointer;background:0 0;border:none;outline:none}select{appearance:none}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}html,body{-webkit-user-select:none;user-select:none;width:100%;height:100%;margin:0;padding:0;overflow:hidden}::-webkit-scrollbar{width:0}::-webkit-scrollbar-track{background:#2a2a2a;border-radius:6px}::-webkit-scrollbar-thumb{background:var(--gray-lv2);border-radius:6px}:root{--black-lv1:#000;--black-lv2:#121212;--black-lv3:#1f1f1f;--black-lv4:#b3b3b3;--gray-lv1:#282828;--gray-lv2:#3e3e3e;--white-lv1:#fafafa;--white-lv2:#b0b0b0;--green-lv1:#1ed760;--blue-lv1:#2a3339;--padding-lv1:8px;--padding-lv2:20px}
