@import"https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap";*{margin:0;padding:0;box-sizing:border-box}select{background:#00000063;border:none;color:#fff;padding:.2rem}.card-title,.card-subtitle,.music-player-song-subtitle,.music-player-song-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.search-icon,.card-pause-play-container,.card-subtitle,.artist-card>.card-title,.see-more-btn,.play-pause-container,.topArtists-img,.retry-btn{cursor:pointer}.hide{display:none}.flex{display:flex}.flex-column{display:flex;flex-direction:column}.align-ctr{align-items:center}.flex-center{display:flex;align-items:center;justify-content:center}.img-not-available-artist,.img-not-available,.img-not-available-details-page{background-color:#ffffff0f}.img-not-available-artist{padding:.4rem}.img-not-available{padding:2rem}.img-not-available-details-page{padding:1.5rem;border:none!important;border-radius:15%!important}*::-webkit-scrollbar{display:none}.layout-container{display:grid;position:relative;grid-template-columns:15% 60% 25%;color:#fff;font-family:Roboto,sans-serif;min-height:100vh;background:linear-gradient(130deg,#161652 40%,#1e1e68 60%)}.nav-container{display:flex;flex-direction:column;padding:1.6rem .5rem;position:relative;background-color:#0000006b}.logo-container{margin-top:1rem;margin-bottom:3.5rem}.logo{width:42%;display:block;margin:auto;aspect-ratio:1.5}.nav-items-container{flex-direction:column;font-weight:500}.nav-items-container>a{font-size:.9rem;text-decoration:none;color:#fff;padding-left:.5rem;margin-bottom:1.29rem;display:flex}.nav-items-container>a.active{color:#00fff3d6}.nav-icon{font-size:1.2rem;margin-right:.3rem}.feed{padding:1rem;max-height:100vh;overflow:scroll}.searchBar{width:80%;border:none;background-color:#00000038;color:#fff;margin:0 .5rem;padding:.5rem;border-radius:4px}.search-icon,.hamburger-icon{color:#ffffffba}.search-icon{font-size:1.3rem}.hamburger-icon{font-size:2rem;display:none}.feed-title{font-size:1.7rem;font-weight:600;margin:1.8rem 0}.feed-results-grid{display:grid;gap:1.5rem;grid-template-columns:repeat(3,minmax(9rem,12rem));animation:comeToPosition .8s 1 forwards ease}@keyframes comeToPosition{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.card{padding:1rem;background-color:#ffffff12}.card-header-container{height:10rem;position:relative;margin-bottom:.5rem}.card-img{height:100%;width:100%}.card-pause-play-container{opacity:0;font-size:2rem;position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:1;background-color:#0000007c;transition:opacity .6s ease}.card-pause-play-container:hover{opacity:1}.card-title{font-size:.95rem;font-weight:600}.card-subtitle{margin-top:.2rem;font-size:.7rem;color:#ffffff8c}.song-card-play-err{width:2rem;filter:brightness(.45)}.discover-title{display:flex;justify-content:space-between;width:84%}.charsAndArtist-container{padding-right:1rem}.chartsAndArtist-title{font-size:1.2rem;font-weight:600;margin-bottom:1rem;display:flex;justify-content:space-between}.topCharts-container{max-height:68vh;padding-top:3rem;margin-bottom:2rem;overflow:scroll}.see-more-btn{border:none;background-color:transparent;font-size:.8rem;color:#ffffff8c}.song-list-card{margin-left:1rem;display:flex;margin-bottom:.8rem;transition:background-color .5s ease;padding-right:.5rem;border-radius:5px}.song-list-card:hover{background-color:#9b75b57d}.song-list-img{width:3.2rem;height:3rem;border-radius:5px;margin-right:.5rem}.song-list-details-playPause{display:flex;justify-content:space-between;align-items:center;flex-grow:1}.song-list-details{width:9rem}.song-list-card-play-err{width:1.5rem;filter:brightness(.45)}.play-pause-container{font-size:1.5rem}.topArtists-container div{text-overflow:ellipsis;white-space:nowrap}.topArtists-card{text-align:center;width:5.2rem;font-size:.8rem}.topArtists-img-container{overflow-x:scroll;display:flex;gap:.5rem;padding-bottom:2rem}.topArtists-img{width:5rem;border-radius:50%;margin-right:.8rem}.details-section{margin-top:3.5rem;padding-left:1rem}.details-section-img{width:clamp(8rem,11.5vw,12rem);border-radius:50%;border:2px solid white;margin-right:1.5rem;aspect-ratio:1.03;object-fit:cover}.details-section-title{font-size:clamp(1.1rem,2.3vw,2.6rem);font-weight:700;margin-bottom:.4rem}.details-section-subtitle{margin-bottom:.4rem;font-size:.8rem}.details-section-heading{font-size:1.35rem;font-weight:600;margin-bottom:1rem}.lyrics-container{margin-top:4rem;margin-bottom:2.5rem}.lyrics{font-size:.75rem;color:#ffffffb0;line-height:1.7}.related-song-container{margin-top:3.5rem}.music-player-container{display:grid;grid-template-columns:15% 70% 15%;position:fixed;bottom:0;left:0;padding:.9rem 2rem .5rem;width:100%;border-radius:22px 22px 0 0;background-color:#6262d340;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:comeToPosition_musicPlayer .6s 1 forwards ease}@keyframes comeToPosition_musicPlayer{0%{transform:translateY(100%)}to{transform:translate(0)}}.music-player-container input[type=range]{height:.25rem}.music-player-song-img{border-radius:50%;width:3rem;aspect-ratio:1.02;margin-right:.4rem}.music-player-song-title,.music-player-song-subtitle{max-width:8rem}.music-player-song-title{font-size:.9rem;font-weight:600}.music-player-song-subtitle{font-size:.7rem;color:#ffffff8c}.main-player{width:70%;margin:auto}.music-controls{margin:auto;font-size:1.25rem;margin-bottom:.25rem;display:flex;width:clamp(9rem,17%,14rem);justify-content:space-between}.song-bar>span{padding:0 .5rem;font-size:.82rem}.song-bar input[type=range]{width:min(55%,35rem)}.loading-container,.error-container{width:100%}.default-loading-title,.default-error-title{color:#ffffffc2;text-align:center;font-size:clamp(1.2rem,2vw,2.45rem)}.default-loading-img,.default-error-img{display:block;margin:auto}.default-loading-title{margin-top:5rem;animation:fadeInFadeOut .8s 0s infinite ease forwards alternate}@keyframes fadeInFadeOut{to{color:#ffffff85}}.default-loading-img{width:6.8rem}.default-error-title{margin-top:1rem}.retry-btn{border-radius:4px;border:none;background-color:#ff737d;font-size:1rem;margin-left:.5rem;padding:.4rem .8rem;color:#fff}.default-error-img{width:9.8rem;margin-top:5rem}@media screen and (max-width: 1150px){.hamburger-icon{display:inline}.layout-container{grid-template-columns:65% 35%;padding-left:1rem}.nav-container{min-height:100vh;width:11rem;top:0;left:0;position:fixed;z-index:1;transform:translate(-100%);transition:transform .65s ease;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background-color:#6f2faf75}.show-navBar{transform:translate(0)}}@media screen and (max-width: 900px){.layout-container{grid-template-columns:57% 43%}.feed-results-grid{grid-template-columns:repeat(2,minmax(9rem,11rem));column-gap:2rem}}@media screen and (max-width: 700px){.layout-container{display:flex;flex-direction:column-reverse;padding-bottom:4rem}.details-section{margin-top:1rem}.searchBar-container{position:fixed;top:0;left:0;width:100%;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:.8rem}.searchBar{width:70%}.feed{padding-left:0;max-height:none;overflow:visible}.feed-results-grid{grid-template-columns:repeat(3,minmax(9rem,10rem));column-gap:1.5rem;justify-content:center}.discover-title{padding-right:2rem;width:100%}.card{padding:.5rem}.card-header-container{height:9.5rem}.card-pause-play-container{opacity:.38}.charsAndArtist-container{padding-right:2rem;padding-top:2rem}.chartsAndArtist-title{font-size:1.59rem;margin-bottom:1.25rem}.song-list-card{padding-right:1.5rem}.play-pause-container{font-size:2rem}.music-player-container{border-radius:0%}.music-player-song-title,.music-player-song-subtitle{display:none}.volume-container{position:relative}.volume-btn{font-size:1.2rem}.volume-range{position:absolute;transform-origin:left;transform:rotate(-90deg);top:12px;left:40%;display:none}.show-volume-range{display:block}}@media screen and (max-width: 550px){.feed-results-grid{grid-template-columns:repeat(2,minmax(9rem,11rem))}.music-player-container{padding:1rem 1rem .5rem}.song-bar input[type=range]{position:absolute;top:0;width:100%;left:0}.song-bar>span{font-size:.6rem}.song-bar>span:nth-child(1){border-right:1px solid}select{width:6rem}}