main.home{position:relative;display:grid;grid-template-columns:1fr}main.home section{padding:24px}main.home .hero{display:grid;grid-template-columns:1fr;gap:48px;position:relative;margin-bottom:24px}main.home .hero h1{font-size:5.421919375rem}main.home .hero>:last-child{display:flex;flex-wrap:wrap;gap:24px;justify-content:center}main.home .diagonal{height:24px;position:relative;isolation:isolate}main.home .diagonal:after{content:"";background:url(/images/reShuffle-icon-gap.svg) repeat 0 0;position:absolute;z-index:-1;top:0;right:0;bottom:0;left:0;transform:skewY(-6deg);animation:spin 1s linear infinite}@keyframes spin{0%{background-position:0 0}to{background-position:24px 0}}main.home .about{display:grid;grid-template-columns:1fr;gap:24px;margin-top:24px}main.home .about h2,main.home .about p{text-align:center}main.home .about div{justify-items:center}main.home .about div,main.home .algorithms div,main.home .privacy,main.home .faq{display:grid;gap:8px}main.home .algorithms{background:linear-gradient(50deg,#00affe,#1e8080);background-size:200% 200%;animation:gradient 6s ease infinite;mask:radial-gradient(53.67px at 50% 72px,#000 99%,rgba(0,0,0,0) 101%) calc(50% - 48px) 0/96px 51% repeat-x,radial-gradient(53.67px at 50% -48px,rgba(0,0,0,0) 99%,#000 101%) 50% 24px/96px calc(51% - 24px) repeat-x,radial-gradient(53.67px at 50% calc(100% - 72px),#000 99%,rgba(0,0,0,0) 101%) 50% 100%/96px 51% repeat-x,radial-gradient(53.67px at 50% calc(100% + 48px),rgba(0,0,0,0) 99%,#000 101%) calc(50% - 48px) calc(100% - 24px) /96px calc(51% - 24px) repeat-x}main.home .algorithms h2,main.home .algorithms p{text-align:center}@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 100%}to{background-position:0% 50%}}main.home .algorithms div{padding:60px 0}main.home .privacy p{text-align:center}main.home .privacy a{color:#fdfdfd}main.home .faq summary{font-weight:700}main.home .faq p,main.home .faq summary{text-align:center}main.home .faq p{margin-top:8px}ul.list-scroller{display:flex;flex-direction:row;gap:12px;padding:12px 0;overflow-x:scroll;margin:12px 0}ul.list-scroller>:first-child{margin-left:24px}ul.list-scroller>:last-child{margin-right:24px}ul.list-scroller li{list-style-type:none;background-color:#181b1b;padding:12px;border-radius:8px;max-width:144px;transition:all .15s ease-out}ul.list-scroller li.add-more p{text-align:center}ul.list-scroller li>img{object-fit:cover;height:144px;width:144px;background-image:url(/images/reShuffle-icon.svg)}ul.list-scroller li h2{font-size:1.15rem;height:1.5525rem;overflow:hidden;text-align:center}ul.list-scroller li .playlist-buttons{margin-top:8px;display:grid;grid-template-columns:1fr 1fr;justify-items:center}ul.list-scroller li button,ul.list-scroller li a{display:grid;align-items:center;height:36px;width:36px;transition:all .1s ease-out}ul.list-scroller li button:hover:not(:disabled),ul.list-scroller li button:focus:not(:disabled),ul.list-scroller li a:hover:not(:disabled),ul.list-scroller li a:focus:not(:disabled){transform:translateY(2px);cursor:pointer}ul.list-scroller li button:disabled,ul.list-scroller li a:disabled{transform:none}ul.list-scroller li button{background-color:transparent;padding:0;fill:#00affe}ul.list-scroller li:hover{background-color:#242929}ul.list-scroller li:hover button,ul.list-scroller li:hover a{transition:all .15s ease-out;width:36px}ul.list-scroller::-webkit-scrollbar-track{margin:24px}a.skip-button{position:absolute;color:transparent;transform:translate(-100%)}a.skip-button:focus{background-color:#00affe;color:#101212;font-weight:700;text-decoration:none;border-radius:8px;padding:12px 24px;z-index:2;margin:0 24px;transform:translate(0)}.playlists{padding:24px 0;overflow-x:hidden;z-index:0;position:relative}.playlists header{display:flex;flex-direction:row;gap:24px;align-items:center;margin-left:24px;position:absolute}.playlists header button{background-color:transparent;padding:0}.playlists header button:focus,.playlists header button:hover{background-color:transparent}.playlists header img{height:36px}.playlists header svg{fill:#00affe;height:24px}.playlists::-webkit-scrollbar{width:0px}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:36px;gap:24px}.loading>div{display:flex;gap:8px;height:48px;align-items:center}.loading>div :first-child,.loading>div :last-child{animation-delay:.5s}.loading>div :nth-child(2),.loading>div :nth-child(4){animation-delay:.25s}.loading>div div{background-color:#00affe;height:8px;width:8px;border-radius:8px;animation:animate 1s linear infinite}@keyframes animate{0%{height:8px}50%{height:48px}to{height:8px}}.warning{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:36px;gap:24px}.warning svg{height:60px;fill:#00affe}.warning div{display:flex;gap:24px}.controls .shuffle button{position:relative;background-color:transparent;width:36px;height:36px;padding:0}.controls .shuffle button:disabled:after{content:"";position:absolute;height:6px;width:6px;left:calc(50% - 4px);bottom:-6px;border-radius:100%;background-color:#00affe}.controls .shuffle button:before{position:absolute;width:.85rem;height:.85rem;left:0%;bottom:6%;border-radius:100%;background-color:#00affe;font-size:.85rem;line-height:1.105;color:#101212}.controls .shuffle button:nth-child(1):before{content:"1"}.controls .shuffle button:nth-child(2):before{content:"2"}.controls .shuffle button:nth-child(3):before{content:"3"}.controls .shuffle button:nth-child(4):before{content:"4"}.controls .shuffle button:nth-child(5):before{content:"5"}.controls .shuffle button svg{fill:#00affe}.track>*{display:flex;flex-direction:row;align-items:center;gap:12px;padding:12px;color:#fdfdfd;text-decoration:none;background-color:#181b1b;border-radius:8px;transition:all .15s ease-out}.track>*:hover:not(.not-playing),.track>*:focus:not(.not-playing){background-color:#242929}.track>* img{height:48px;width:48px;background-image:url(/images/reShuffle-icon.svg)}.track>* div{display:flex;flex-direction:column;justify-content:center;overflow:hidden}.track>* div p{max-height:1.3rem;overflow:hidden;cursor:pointer}.playback{display:flex;align-items:center}.playback>:first-child,.playback>:last-child{height:48px}.playback button{background-color:transparent;padding:0;height:60px}.playback button svg{height:100%;width:100%;fill:#00affe}.playback button:disabled{background-color:transparent}.playback:first-child button{background-color:red}.controls{display:flex;flex-direction:column;align-items:center;gap:24px;z-index:2;box-shadow:-4px -8px 8px #101212}.controls .shuffle,.controls .playback,.controls .spotify{display:flex;flex-direction:row;justify-content:center;gap:24px}.controls>div{width:100%;display:flex;flex-direction:column;gap:24px;align-items:center;justify-content:space-between}.controls>div>*{width:calc(100% - 48px)}.controls>div .spotify a{align-items:center;display:flex;gap:12px;color:#fdfdfd;text-decoration:none;font-size:1.15rem;font-weight:700}.controls>div .spotify a img{height:40px}@media screen and (min-width: 450px){.controls>div>*{width:312px}}@media screen and (min-width: 900px){.controls{padding:24px}.controls>div{flex-direction:row;gap:0px}.controls>div .spotify{justify-content:right}}.queue{padding:24px 24px 0;box-shadow:-8px -4px 8px #101212;z-index:1}.queue>*{margin-bottom:12px}.queue h2{font-size:1.3225rem}.queue ol{display:flex;flex-direction:column;margin:0;padding:0;overflow-y:scroll;list-style:none}.queue ol li{margin-bottom:12px}@media screen and (min-width: 900px){.queue ol{padding-right:8px;height:calc(100svh - 24px - 2.273708125rem - 3.4385rem - 72px - 48px - 180px)}}@media screen and (min-width: 1300px){.queue ol{height:calc(100svh - 24px - 2.273708125rem - 3.4385rem - 72px - 48px)}}main.error{padding:24px;display:flex;flex-direction:column;gap:24px;align-items:center}main.error img{height:48px}main.error h1{font-size:3.0607609375rem}body{background-color:#101212;color:#fdfdfd;font-family:system-ui,Segoe UI,Roboto,Ubuntu,Oxygen-Sans,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol;margin:0}main.player{-webkit-user-select:none;user-select:none}h1,h2,h3,h4,p{margin:0;line-height:1.3;cursor:default;text-align:center}p{font-size:1rem;text-align:left}h1{font-size:1.74900625rem}h2{font-size:1.520875rem}h3{font-size:1.3225rem}h4{font-size:1.15rem}button{background-color:#00affe;border-radius:8px;border:none;padding:12px 24px;color:#101212;font-weight:700;font-size:1rem;transition:all .1s ease-out}button:hover:not(:disabled),button:focus:not(:disabled){transform:translateY(2px);cursor:pointer}button:disabled{background-color:#008bcc}::-webkit-scrollbar{height:8px;width:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#181b1b;border-radius:8px}::-webkit-scrollbar-thumb:hover{background:#242929}footer{padding:24px}footer p{text-align:center}footer a{color:#fdfdfd}@media screen and (min-width: 900px){main.player{display:grid;grid-template-columns:calc(100vw - 360px) 360px;grid-template-rows:calc(100vh - 180px) 180px;grid-template-areas:"playlists queue" "controls controls"}main.player .playlists{grid-area:playlists}main.player .controls{grid-area:controls}main.player .queue{grid-area:queue}}@media screen and (min-width: 1300px){main.player{grid-template-areas:"playlists queue" "controls queue"}}@-moz-document url-prefix(){body{scrollbar-color:hsl(180,6%,15%) transparent;scrollbar-width:thin}}
