@font-face{font-family:Spotify;src:local(Spotify),url(../media/SpotifyMixUI-Regular-cc3b1de388efa4cbca6c75cebc24585e.1ppy4dvsrffxf.woff2?dpl=dpl_9BdXhvV4U69XR6YRDtJbPR28xi9f)format("woff2");font-weight:500}@font-face{font-family:Spotify;src:local(Spotify),url(../media/SpotifyMixUI-Bold-4264b799009b1db5c491778b1bc8e5b7.11tp_37kwzg-j.woff2?dpl=dpl_9BdXhvV4U69XR6YRDtJbPR28xi9f)format("woff2");font-weight:800}*{box-sizing:border-box;--color-black:#000;--color-white:#fff;--background-base:#121212;--light-green:#c3f0c8;--spotify-green:#1ed760;margin:0;padding:0;font-family:Spotify,sans-serif}body{background-color:var(--color-black);color:var(--color-white);min-height:100vh;font-family:Spotify,sans-serif;font-size:16px;line-height:26px}img{aspect-ratio:1;object-fit:cover}h1{margin:0}p{text-align:left;margin:0}button{cursor:pointer;border:1px solid var(--color-white);color:var(--color-white);background:0 0;outline:none;justify-content:center;align-items:center;gap:5px;padding:3px 12px;font-family:Spotify,sans-serif;transition:all .3s ease-in-out;display:flex}button:hover{background:var(--color-black);color:var(--color-white);transition:all .3s ease-in-out}.loader{filter:blur(4px)contrast(12);padding:5px;display:inline-grid}.loader:before{content:"";aspect-ratio:3;--c:#0000 64%,#000 66% 98%,#0000 101%;background:radial-gradient(35% 146% at 50% 159%,var(--c)) 0 0, radial-gradient(35% 146% at 50% -59%,var(--c)) 100% 100%;background-repeat:repeat-x;background-size:66.6667% 50%;height:40px;animation:.8s linear infinite l12;-webkit-mask:repeating-linear-gradient(90deg,#000 0 10%,#0000 0 20%)}.full-wrapper{min-height:100vh}header{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:100;border-bottom:1px solid var(--color-white);width:100%;max-width:1400px;margin:0 auto;padding:17px 40px;position:sticky;top:0}header .header-content{justify-content:space-between;align-items:center;display:flex}header .header-content .logo{justify-content:flex-start;align-items:center;gap:15px;display:flex}.main-login{justify-content:center;align-items:center;width:100vw;min-height:100vh;display:flex}.login-card{color:var(--color-white);background-color:#00000080;flex-direction:column;justify-content:center;align-items:center;gap:25px;width:66%;padding:35px 45px;display:flex}.login-card-header{text-align:center}.login-card-title{letter-spacing:-.04em;justify-content:center;align-items:center;gap:10px;margin-bottom:10px;font-size:100px;line-height:1.08;display:flex}.login-card-description{text-align:center;max-width:70%;margin:0 auto}.login-card-content button{border:1px solid var(--spotify-green);color:var(--spotify-green);text-transform:uppercase;letter-spacing:.1em;background-color:#0000;border-radius:100px;padding:16px 33px 15px;font-size:14px;font-weight:800;line-height:16.5px;transition:color .15s,background-color .15s,border-color .15s}.login-card-content button:hover{background-color:var(--spotify-green);color:var(--color-black)}.container{justify-content:flex-start;align-items:flex-start;gap:25px;width:100%;max-width:1400px;margin:0 auto;display:flex}.container .sidebar-wrapper{-ms-overflow-style:none;scrollbar-width:none;border-right:1px solid var(--color-white);flex:0 0 33%;max-height:calc(100vh - 3em - 44px);transition:all .3s ease-in-out;position:sticky;top:calc(44px + 1.5em);overflow:scroll}.container .sidebar-wrapper::-webkit-scrollbar{display:none}.container .sidebar-wrapper.closed{flex:0 0 25px;transition:all .3s ease-in-out}.container .sidebar-wrapper.closed .sidebar,.container .sidebar-wrapper.closed h2{width:0;overflow:hidden}.sidebar-wrapper.closed .sidebar-trigger{right:0}.sidebar-wrapper .sidebar-header{justify-content:space-between;align-items:center;padding:10px;display:flex}.sidebar-wrapper .sidebar-header svg{cursor:pointer}.container .main-content{flex:75%}.sidebar{flex-direction:column;display:flex;position:relative}.sidebar button{cursor:pointer;border:1px solid #0000;border-bottom:1px solid var(--color-white);background:0 0;outline:none;justify-content:flex-start;align-items:flex-start;padding:25px 10px;font-family:Spotify,sans-serif}.sidebar button:hover{color:var(--color-white);transition:all .3s ease-in-out}.sidebar button:first-of-type:hover{border-top:1px solid var(--color-white)}.sidebar .playlist-item{justify-content:flex-start;align-items:flex-start;gap:15px;display:flex}.sidebar .playlist-item img{width:128px;height:128px}.sidebar .playlist-item .playlist-info{flex-direction:column;justify-content:flex-start;align-items:flex-start;display:flex}.playlist-header{justify-content:space-between;align-items:center;gap:15px;display:flex}.playlist-header .header-right{gap:15px;margin-bottom:15px;display:flex}.playlist-header .header-right img{width:128px;height:128px}.track-lists{flex-direction:column;gap:15px;display:flex}.track-lists .track-item{border-bottom:1px solid var(--color-black);flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:5px;padding-top:10px;padding-bottom:20px;display:flex}.track-lists .track-item:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.track-lists .track-item .track-info{justify-content:flex-start;align-items:flex-start;gap:15px;display:flex}.track-lists .track-item .note-section{flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:5px;width:100%;display:flex;position:relative}.track-lists .track-item .note-section textarea{resize:vertical;width:100%;min-height:80px;padding:10px}.dashboard-sidebar{scrollbar-width:none;height:calc(100vh - 1.5rem - 28px)}.dashboard-sidebar::-webkit-scrollbar-track{opacity:0;display:none}.no-scrollbar::-webkit-scrollbar-track{opacity:0;display:none}.no-scrollbar{scrollbar-color:hotpink blue}@media screen and (min-width:768px){.dashboard-sidebar{height:calc(100vh - 93px)}}@keyframes l12{to{background-position:-200% 0,-100% 100%}}.equalizer{grid-gap:4px;grid-template-columns:repeat(auto-fill,10px);justify-content:center;align-items:center;width:100vw;height:50px;display:flex;overflow:hidden}.equalizer div{background:-webkit-gradient(linear, left bottom, left top, from(black), color-stop(grey), to(transparent));background:linear-gradient(#0000,gray,#000);flex:0 auto;min-width:17px;height:100%;animation:2s infinite equalize}.equalizer div:nth-child(n){animation-delay:-.68333s}.equalizer div:nth-child(2n){animation-delay:-.2s}.equalizer div:nth-child(3n){animation-delay:-.85s}.equalizer div:nth-child(4n){animation-delay:-.4s}.equalizer div:nth-child(5n){animation-delay:-.71667s}.equalizer div:nth-child(6n){animation-delay:-.345s}.equalizer div:nth-child(7n){animation-delay:-.9485s}.equalizer.eq-2 div:nth-child(n){animation-delay:-.68333s}.equalizer.eq-2 div:nth-child(2n){animation-delay:-.2s}.equalizer.eq-2 div:nth-child(3n){animation-delay:-.85s}.equalizer.eq-2 div:nth-child(4n){animation-delay:-.4s}.equalizer.eq-2 div:nth-child(5n){animation-delay:-.71667s}.equalizer.eq-2 div:nth-child(6n){animation-delay:-.345s}.equalizer.eq-2 div:nth-child(7n){animation-delay:-.9485s}@keyframes equalize{0%,to{clip-path:inset(65% 0 0)}10%{clip-path:inset(67% 0 0)}20%{clip-path:inset(40% 0 0)}30%{clip-path:inset(75% 0 0)}40%{clip-path:inset(41% 0 0)}50%{clip-path:inset(20% 0 0)}60%{clip-path:inset(22% 0 0)}70%{clip-path:inset(11% 0 0)}80%{clip-path:inset(57% 0 0)}90%{clip-path:inset(28% 0 0)}}.eq-2{transform:rotate(180deg)}iframe{height:auto;max-height:84px}@media screen and (min-width:768px){iframe{height:calc(100vh - 110px);max-height:100%}}.text-balance{text-wrap:balance}
