:root{--dark: #121212;--light: #FFFFFF;--accentColor: #1DB954;--discordGrey: #1F1F1F;--softGrey: #747474;--linkBlue: #0EA8F1}*{margin:0;padding:0;box-sizing:border-box;font-family:Roboto Mono,sans-serif}::selection{color:var(--dark);background:var(--linkBlue)}::-moz-selection{color:var(--dark);background:var(--linkBlue)}body{min-height:100vh;height:100%;padding:2rem;display:flex;flex-direction:column;gap:2rem;background:url(/_/background-Br9Jyt3U.webp) no-repeat center center fixed;background-size:cover;color:var(--light)}h1,h2,h3,h4,h5,h6{font-size:1.25rem;font-weight:400}a:focus,input:focus,button:focus{outline:1px solid var(--linkBlue)}a{color:var(--light);text-decoration:none}ul{list-style:none}.grid-wrapper,.grid-wrapper-index{flex:1;display:grid;grid-template-columns:400px minmax(0,1fr);grid-template-areas:"sidebar content";gap:8rem}@media (max-width: 768px){body{padding:1rem;background:var(--dark)}}@media (max-width: calc(868px + 8rem)){.grid-wrapper{grid-template-columns:1fr;grid-template-areas:"content" "sidebar";grid-gap:2rem}.grid-wrapper-index{grid-template-columns:1fr;grid-template-areas:"sidebar" "content";grid-gap:2rem}}aside{grid-area:sidebar}main{grid-area:content}aside,main{display:flex;flex-direction:column;gap:2rem}.about{display:flex;flex-direction:column;gap:1rem;font-size:1rem;text-wrap-style:balance}.tips{display:flex;flex-direction:column;gap:.5rem;font-size:.875rem;text-wrap-style:balance}.tips p a,.error .more-info{position:relative;width:fit-content;color:var(--linkBlue);display:inline-flex;gap:.25rem;text-transform:uppercase}.tips p a:before,.error .more-info:before{content:"";position:absolute;bottom:-.125rem;left:0;width:100%;height:1px;background-color:var(--linkBlue);clip-path:inset(0 100% 0 0);transition:clip-path .3s cubic-bezier(.17,.42,.51,.93)}.tips p a:hover:before,.error .more-info:hover:before{clip-path:inset(0 0 0 0)}.tips p a:after,.error .more-info:after{content:"↗";font-family:Inter,sans-serif}.error{padding:1rem;border:1px solid var(--softGrey);background-color:#121212bf;display:flex;flex-direction:column;gap:1rem}.error p{font-size:.875rem;color:var(--softGrey)}.error .back{width:fit-content;padding:.25rem .75rem;display:flex;flex-direction:row;align-items:center;gap:.5rem;background-color:var(--accentColor);color:var(--dark);text-transform:uppercase;transition:all .5s cubic-bezier(.165,.84,.44,1);overflow:hidden}.error .back:hover{box-shadow:inset 0 0 1px 1px var(--accentColor),inset 1.5rem 0 .625rem 1px var(--accentColor);background-color:var(--dark);color:var(--accentColor)}.error .back:hover:before{color:var(--dark);transform:translate(-.5rem)}.error .back:before{content:"";font-family:Inter,sans-serif;transition:transform .3s cubic-bezier(.165,.84,.44,1)}@keyframes lr{0%{transform:translate(.7rem)}to{transform:translate(-.5rem)}}.error-code{width:100%;height:100%;border:1px solid var(--softGrey);background-color:#12121280;display:flex;flex-direction:column;gap:1rem}.error-code svg{font-size:16rem;font-weight:700;font-style:italic;width:100%;height:100%}.error-code svg text{fill:#12121280;stroke:var(--accentColor);stroke-width:.5px;stroke-linejoin:round;transform:rotate(15deg);transform-origin:center}.error-code svg text:first-child{fill:none;transition:transform .3s cubic-bezier(.075,.82,.165,1)}.error-code svg text:last-child{stroke:var(--light);transition:transform .5s cubic-bezier(.075,.82,.165,1)}.error-code:hover svg text{transform:rotate(-15deg)}.error-code:hover svg text:last-child{transform:rotate(-10deg)}.error-hide{display:flex}@media (max-width: calc(868px + 8rem)){.error-hide{display:none}.error-wrapper{grid-template-areas:"content"}}.coffee{display:flex;flex-direction:column;gap:.5rem;font-size:.875rem;text-transform:uppercase}nav{display:flex;flex-flow:wrap;justify-content:flex-start;align-items:center;gap:2rem}nav .logo{display:flex;justify-content:center;align-items:center;gap:1rem;font-size:2rem}nav .logo h1{font-size:2rem}nav .logo img{width:2rem;height:2rem;aspect-ratio:1/1}nav .nav-menu{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:.5rem}nav .nav-menu .nav-link{display:flex;gap:.25rem;border:1px solid var(--softGrey);padding:.25rem .5rem;font-size:.75rem;text-transform:uppercase;transition:all .3s cubic-bezier(.17,.42,.51,.93);white-space:nowrap}nav .nav-menu .nav-link:hover{background-color:var(--softGrey)}nav .nav-menu li:not(:first-child) .nav-link:after{content:"↗";font-family:Inter,sans-serif}nav .nav-menu .nav-link.active{border:1px solid var(--light);background-color:var(--accentColor);color:var(--light)}nav .ticker{width:fit-content;padding:.125rem .5rem;border:1px solid var(--dark);border-radius:.25rem;background-color:var(--accentColor);color:var(--dark);font-size:.875rem}@media (max-width: 768px){nav{gap:1rem}}.disclaimer{width:fit-content;padding:.125rem .5rem;border:1px solid var(--dark);border-radius:.25rem;background-color:var(--accentColor);color:var(--dark);font-size:.875rem;text-transform:uppercase}.stats{width:100%;display:flex;flex-direction:column;gap:1rem}.stats .stats-title{font-size:1.25rem;text-transform:uppercase}.stats .stats-panel{width:100%;display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"total total" "track album" "last last";grid-gap:2rem;gap:1rem}.stats .stats-panel .stats-total{grid-area:total}.stats .stats-panel .stats-last{grid-area:last}.stats .stats-panel>section{height:fit-content;padding:.5rem;display:flex;flex-direction:column;gap:.125rem;background-color:var(--discordGrey);border:1px solid var(--softGrey);transition:box-shadow .3s cubic-bezier(.17,.42,.51,.93)}.stats .stats-panel>section:hover{box-shadow:inset 0 -2.5rem 2.5rem 0 var(--dark)}.stats .stats-panel>section>.animated-number{display:flex;overflow:hidden;font-size:1.5rem}.stats .stats-panel>section>.animated-number .digit-wrapper{position:relative;height:1lh;width:1ch;display:inline-block;overflow:hidden}.stats .stats-panel>section>.animated-number .digit-wrapper .digit{position:absolute;top:0;left:0;transition:transform .3s cubic-bezier(.165,.84,.44,1);font-family:Kode Mono,monospace}.stats .stats-panel>section>span:last-child,.stats .stats-panel>section>a>span:last-child{z-index:1;color:var(--softGrey);text-transform:uppercase}.stats .stats-panel .stats-last{padding:0;position:relative;width:100%;overflow:hidden}.stats .stats-panel .stats-last:has(a:focus){border:1px solid var(--linkBlue)}.stats .stats-panel .stats-last a{height:fit-content;display:flex;flex-direction:column;gap:.125rem}.stats .stats-panel .stats-last a img{z-index:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;object-fit:cover;aspect-ratio:1 / 1;filter:brightness(.5);animation:fadeIn .2s ease-in}.stats .stats-panel .stats-last a .song-details{padding:.5rem;z-index:1;display:flex;flex-direction:column;gap:.25rem}.stats .stats-panel .stats-last a .song-artist{font-size:.875rem}.stats .stats-panel .stats-last a>span:last-child{z-index:1;margin-top:auto;padding:.5rem;background:linear-gradient(180deg,#12121200,#121212)}.animated-text{display:flex;overflow:hidden}.animated-text .text-wrapper{position:relative;height:1lh;width:100%;display:inline-block;overflow:hidden}.animated-text .text-wrapper .text{position:absolute;top:0;left:0;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-family:Inter,sans-serif;transition:transform .3s cubic-bezier(.165,.84,.44,1)}.item-exit{animation:slideUp .3s forwards}.item-enter{transform:translateY(100%);animation:slideIn .3s forwards}@keyframes slideUp{0%{transform:translateY(0)}to{transform:translateY(-100%)}}@keyframes slideIn{0%{transform:translateY(100%)}50%{transform:translateY(-15%)}to{transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.socials{width:fit-content;display:flex;flex-direction:column;gap:1rem;font-size:.875rem}.socials li a{display:flex;align-items:center;gap:.75rem}.socials li a img{width:1.375rem;height:1.375rem;aspect-ratio:1/1}.socials li a span{position:relative;display:flex;gap:.25rem}.socials li a span:before{content:"";position:absolute;bottom:-.125rem;left:0;width:100%;height:1px;background-color:var(--light);clip-path:inset(0 100% 0 0);transition:clip-path .3s cubic-bezier(.17,.42,.51,.93)}.socials li a:hover span:before{clip-path:inset(0 0 0 0)}.socials li a span:after{content:"↗";font-family:Inter,sans-serif}.discord-embed{width:fit-content;display:flex;flex-direction:column;gap:1rem}.discord-embed>h2{font-size:1.25rem;text-transform:uppercase}.embed{width:100%;padding:1rem;border:1px solid var(--softGrey);border-radius:.5rem;background-color:var(--dark);display:flex;flex-direction:row;gap:1rem;font-size:.875rem}.profile-picture{width:32px;height:32px;aspect-ratio:1/1;border-radius:100%;background-color:var(--accentColor)}.embed>div{width:32px;height:32px;aspect-ratio:1/1;border-radius:100%;background-color:var(--accentColor)}.embed .content{width:100%;display:flex;flex-direction:column;gap:.5rem}.embed .content *{font-family:Inter,sans-serif}.embed .content .infos{width:100%;display:flex;flex-direction:row;align-items:center;gap:.5rem}.embed .content .infos .username{color:var(--accentColor)}.embed .content .infos>span:last-child{color:var(--softGrey);font-size:.875rem}.embed .content p{color:var(--linkBlue);font-size:.875rem;font-weight:300;line-break:anywhere}.embed .content .fixspotify-embed{width:fit-content;padding:1rem;border-left:3px solid var(--accentColor);border-radius:.5rem;background-color:var(--discordGrey);display:flex;flex-direction:row;gap:2rem;font-size:.875rem;font-weight:300}.embed .content .fixspotify-embed .infos{display:flex;flex-direction:column;align-items:flex-start;gap:1rem}.embed .content .fixspotify-embed .infos .track-name{color:var(--linkBlue);font-weight:500}.embed .content .fixspotify-embed .infos .details{display:flex;flex-direction:column}.embed .content .fixspotify-embed img{width:96px;height:96px;aspect-ratio:1/1;border-radius:.25rem}@media (max-width: 768px){.embed .content .fixspotify-embed{font-size:.75rem}}.available-providers,.select-provider{display:flex;flex-direction:column;gap:1rem}.disabled-providers{display:flex;flex-flow:wrap;flex-direction:row;align-items:center;gap:2rem}.available-providers>h2,.disabled-providers>h2,.select-provider>h2{font-size:1.25rem;text-transform:uppercase}.disabled-providers>h2{white-space:nowrap}.available-providers .providers-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(7rem,7rem));gap:1rem}.select-provider .providers-list{height:100%;display:grid;grid-template-columns:repeat(auto-fill,minmax(8rem,8rem));gap:1rem}.disabled-providers .providers-list{display:flex;flex-direction:row;gap:1rem}.available-providers .providers-list .provider-item,.disabled-providers .providers-list .provider-item,.select-provider .providers-list .provider-item{width:100%;height:100%;aspect-ratio:1 / 1;padding:.25rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;font-size:.75rem}.select-provider .providers-list .provider-item{border:1px solid var(--softGrey);background-color:#12121280;color:var(--softGrey);transition:all .3s cubic-bezier(.17,.42,.51,.93);cursor:pointer}.select-provider .providers-list .provider-item:hover{background-color:var(--providerColor);border:1px solid var(--light);color:var(--light)}.select-provider .providers-list .provider-item a{width:100%;height:100%;color:var(--softGrey);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;font-size:.75rem}.select-provider .providers-list .provider-item a:hover{color:var(--light)}.select-provider .providers-list .provider-item:hover img{opacity:1}.available-providers .providers-list .provider-item img{width:2.5rem;height:2.5rem;aspect-ratio:1 / 1}.disabled-providers .providers-list .provider-item img{width:2rem;height:2rem;aspect-ratio:1 / 1;opacity:.5}.select-provider .providers-list .provider-item img{height:4rem;width:4rem;aspect-ratio:1 / 1;opacity:.5}.available-providers .providers-list .provider-item span,.select-provider .providers-list .provider-item span{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}@media (max-width: 768px){.disabled-providers{align-items:flex-start;gap:1rem}.available-providers .providers-list{grid-template-columns:repeat(auto-fill,minmax(3rem,3rem))}.available-providers .providers-list .provider-item img{width:100%;height:100%}.available-providers .providers-list .provider-item span{display:none}}.select-provider .providers-list .provider-item.selected{background-color:var(--providerColor);border:1px solid var(--light);color:var(--light)}.select-provider .providers-list .provider-item.selected img{opacity:1}