.golden-icon svg,.golden-icon path{fill:#f9c784}.red-icon svg,.red-icon path{fill:#dc2626}.golden-stroke svg,.golden-stroke path{stroke:#f9c784}.red-stroke svg,.red-stroke path{stroke:#dc2626}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:currentColor}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.container{width:100%}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.left-0{left:0}.right-0{right:0}.top-0{top:0}.z-10{z-index:10}.mb-10{margin-bottom:2.5rem}.mb-11{margin-bottom:2.75rem}.mb-12{margin-bottom:3rem}.mb-14{margin-bottom:3.5rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-7{margin-bottom:1.75rem}.mb-8{margin-bottom:2rem}.mb-9{margin-bottom:2.25rem}.ml-auto{margin-left:auto}.mt-10{margin-top:2.5rem}.mt-20{margin-top:5rem}.flex{display:flex}.grid{display:grid}.aspect-square{aspect-ratio:1 / 1}.h-full{height:100%}.w-20{width:5rem}.w-full{width:100%}.max-w-\[50\%\]{max-width:50%}.flex-shrink-0,.shrink-0{flex-shrink:0}.flex-grow,.grow{flex-grow:1}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-8{gap:2rem}.gap-x-4{-moz-column-gap:1rem;column-gap:1rem}.gap-x-6{-moz-column-gap:1.5rem;column-gap:1.5rem}.rounded{border-radius:.25rem}.border-b{border-bottom-width:1px}.border-solid{border-style:solid}.border-gray{--tw-border-opacity: 1;border-color:rgb(181 181 181 / var(--tw-border-opacity, 1))}.bg-blue-600{--tw-bg-opacity: 1;background-color:rgb(37 99 235 / var(--tw-bg-opacity, 1))}.bg-gradient-to-l{background-image:linear-gradient(to left,var(--tw-gradient-stops))}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.from-black-pure\/80{--tw-gradient-from: rgb(2 1 34 / .8) var(--tw-gradient-from-position);--tw-gradient-to: rgb(2 1 34 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.to-transparent{--tw-gradient-to: transparent var(--tw-gradient-to-position)}.object-contain{-o-object-fit:contain;object-fit:contain}.py-2{padding-top:.5rem;padding-bottom:.5rem}.pb-5{padding-bottom:1.25rem}.pb-6{padding-bottom:1.5rem}.font-quicksand{font-family:Quicksand,serif}.font-bold{font-weight:700}.text-blue-600{--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}.text-red-700{--tw-text-opacity: 1;color:rgb(185 28 28 / var(--tw-text-opacity, 1))}.text-white-pure{--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}*{-webkit-user-select:none;-moz-user-select:none;user-select:none}html,body,#root{height:100%;margin:0;padding:0;box-sizing:border-box}.default-page{height:100%}.has-transitions{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}.has-transitions .has-icon svg,.has-transitions .has-icon svg *{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}.has-icon.aspect-square *:not(svg):not(svg *){display:block;height:100%;width:100%}.has-icon svg{display:block;height:100%;width:100%;transition:filter .3s ease}.hoverable:hover{cursor:pointer}:root{--color-main: #485696;--color-white-pure: #e7e7e7;--color-white-mid: #bfbfbf;--color-orange-weak: #f9c784;--color-orange-mid: #fc7a1e;--color-orange-pure: #f24c00;--color-black-pure: #020122;--color-black-100: #12113d;--color-gray: #b5b5b5}.default-app-page{height:100vh;overflow:hidden;--tw-bg-opacity: 1;background-color:rgb(2 1 34 / var(--tw-bg-opacity, 1));padding:1.5rem 1.25rem}.app-collection-list{display:flex;align-items:center;justify-content:flex-start;-moz-column-gap:.75rem;column-gap:.75rem}.app-artist-small-icon{height:2rem;width:2rem;overflow:hidden;border-radius:9999px;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);--tw-shadow-color: #020122;--tw-shadow: var(--tw-shadow-colored) }.app-artists-groupped-icons{display:flex;align-items:center;justify-content:flex-start}.app-artists-groupped-icons>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(-10px * var(--tw-space-x-reverse));margin-left:calc(-10px * calc(1 - var(--tw-space-x-reverse)))}.app-currated-playlist{position:relative;border-radius:40px;--tw-bg-opacity: 1;background-color:rgb(96 158 175 / var(--tw-bg-opacity, 1));padding:2.5rem 2.75rem}.app-currated-playlist .background{display:block;height:100%;width:100%;-o-object-fit:cover;object-fit:cover}.app-currated-playlist .alt{margin-bottom:6rem;font-family:Quicksand,serif;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-currated-playlist .title{margin-bottom:.5rem;font-family:Quicksand,serif;font-size:2.25rem;line-height:2.5rem;font-weight:700;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-currated-playlist .text{width:270px;max-width:50%;font-family:Quicksand,serif;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-curated-playlist-likes{display:flex;align-items:center;justify-content:flex-start;-moz-column-gap:.75rem;column-gap:.75rem}.app-curated-playlist-likes .icon{display:block;height:1.5rem;width:1.5rem}.app-curated-playlist-likes .likes{font-family:Quicksand,serif;font-size:1.125rem;line-height:1.75rem;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-scroll-list{display:flex;align-items:flex-start;justify-content:flex-start;overflow-x:scroll;scrollbar-width:none;-ms-overflow-style:none}.app-scroll-list::-webkit-scrollbar{display:none}.app-title-wrapper>.title{margin-bottom:1rem;font-family:Quicksand,serif;font-size:1.5rem;line-height:2rem;font-weight:700;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-loading{display:flex;height:100%;width:100%;align-items:center;justify-content:center}.app-loading .loader{transform:rotate(45deg);perspective:1000px;border-radius:50%;width:48px;height:48px;color:var(--color-main)}.app-loading .loader:before,.app-loading .loader:after{content:"";display:block;position:absolute;top:0;left:0;width:inherit;height:inherit;border-radius:50%;transform:rotateX(70deg);animation:1s spin linear infinite}.app-loading .loader:after{color:var(--color-orange-weak);transform:rotateY(70deg);animation-delay:.4s}@keyframes rotate{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes rotateccw{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(-360deg)}}@keyframes spin{0%,to{box-shadow:.2em 0 0 0 currentcolor}12%{box-shadow:.2em .2em 0 0 currentcolor}25%{box-shadow:0 .2em 0 0 currentcolor}37%{box-shadow:-.2em .2em 0 0 currentcolor}50%{box-shadow:-.2em 0 0 0 currentcolor}62%{box-shadow:-.2em -.2em 0 0 currentcolor}75%{box-shadow:0 -.2em 0 0 currentcolor}87%{box-shadow:.2em -.2em 0 0 currentcolor}}.app-album{flex-shrink:0}.app-album .cover{margin-bottom:.5rem;aspect-ratio:1 / 1;width:153px;border-radius:25px}.app-album .title{font-family:Quicksand,serif;font-size:1rem;line-height:1.5rem;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-chart{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-radius:20px;--tw-bg-opacity: 1;background-color:rgb(18 17 61 / var(--tw-bg-opacity, 1));padding:1.25rem}.app-chart .cover{display:block;aspect-ratio:1 / 1;height:4rem;width:4rem;border-radius:10px;-o-object-fit:cover;object-fit:cover}.app-chart .information{flex-grow:1}.app-chart .information .title{font-family:Quicksand,serif;font-size:1.125rem;line-height:1.75rem;font-weight:500;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-chart .information .author{margin-bottom:.25rem;font-family:Quicksand,serif;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1));opacity:.5}.app-chart .information .time{font-family:Quicksand,serif;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-chart .like .icon{display:block;height:1.25rem;width:1.25rem}.app-error-text{font-family:Quicksand,serif;font-size:1.25rem;line-height:1.75rem;font-weight:500;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-playlist-selection{border-radius:5px;padding:.5rem 1.25rem}.app-playlist-selection:hover{--tw-bg-opacity: 1;background-color:rgb(72 86 150 / var(--tw-bg-opacity, 1))}.app-playlist-selection .title{font-family:Quicksand,serif;font-size:.875rem;line-height:1.25rem;font-weight:500;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-select-playlist .select-title{margin-bottom:.75rem;padding-left:1.25rem;padding-right:1.25rem;text-align:center;font-family:Quicksand,serif;font-size:1.25rem;line-height:1.75rem;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-select-playlist .playlist-collection{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:.5rem}.app-favorite-song-button{display:flex;height:2.5rem;width:2.5rem;flex-shrink:0;align-items:center;justify-content:center;border-radius:9999px;border-width:1px;--tw-border-opacity: 1;border-color:rgb(72 86 150 / var(--tw-border-opacity, 1))}.app-favorite-song-button .icon{display:block;height:1.25rem;width:1.25rem}.app-top-charts{width:417px;max-width:40%}.app-search-bar{display:flex;align-items:center;justify-content:flex-start;gap:1.5rem;padding-left:2rem;padding-right:2rem}.app-search-bar .icon{display:block;height:1.75rem;width:1.75rem}.app-search-bar .input{border-width:0px;background-color:transparent;padding:.75rem 1.25rem;font-family:Quicksand,serif;font-weight:600;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-search-bar .input:focus{outline:2px solid transparent;outline-offset:2px}.generic-icon-button{display:block;aspect-ratio:1 / 1;border-radius:9999px;padding:.75rem}.generic-icon-button .icon{display:block;height:1.75rem;width:1.75rem}.generic-icon-button:hover .icon svg{filter:drop-shadow(0 0 10px rgba(255,223,117,.8))}.generic-icon-button:hover .icon svg *{fill:#f9c784}.app-current-track-wrapper{height:100%}.app-current-track-wrapper.playing .current-track{bottom:0;top:auto}.app-current-track-wrapper .current-track{position:fixed;left:0;top:100%;z-index:20;width:100%;border-top-width:1px;border-style:solid;border-color:#f7f7f766;background-color:#f7f7f71a;padding-top:1.75rem;padding-bottom:1rem;display:grid;grid-template-columns:repeat(9,minmax(0,1fr));align-items:center;justify-content:center;gap:2.5rem;padding-left:101px;padding-right:101px}.app-current-track-wrapper .current-track .track-information-container{grid-column-start:1;grid-column-end:3;display:flex;align-items:flex-start;justify-content:flex-start;gap:1rem}.app-current-track-wrapper .current-track .track-information-container .cover{display:block;height:4rem;width:4rem;flex-shrink:0;overflow:hidden;border-radius:14px;--tw-bg-opacity: 1;background-color:rgb(2 1 34 / var(--tw-bg-opacity, 1))}.app-current-track-wrapper .current-track .track-information-container .track-information .title{font-family:Quicksand,serif;font-size:1.25rem;line-height:1.75rem;font-weight:700;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-current-track-wrapper .current-track .track-information-container .track-information .author{font-family:Quicksand,serif;font-size:1rem;line-height:1.5rem;font-weight:500;color:#f7f7f799}.app-current-track-wrapper .current-track .controls-container{grid-column-start:3;grid-column-end:8;display:flex;flex-grow:1;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:.75rem}.app-current-track-wrapper .current-track .controls-container .controls{display:flex;align-items:center;justify-content:center;gap:3rem}.app-current-track-wrapper .current-track .volume{grid-column-start:8;grid-column-end:10;display:flex;align-items:center;justify-content:flex-start;gap:1.5rem}.app-current-track-wrapper .current-track .volume .volume-bar{width:160px;max-width:50%;flex-grow:1}.app-control-button .icon{display:block;aspect-ratio:1 / 1;height:2.25rem;width:2.25rem;padding:.5rem}.app-progress-bar{position:relative;height:.375rem;border-radius:9999px;border-width:1px;border-style:solid;border-color:#48569680;background-color:#02012273}.app-progress-bar .completion-container{position:absolute;left:0;top:0;height:100%;width:100%;overflow:hidden}.app-progress-bar .completion{position:absolute;height:100%;border-radius:9999px;--tw-bg-opacity: 1;background-color:rgb(249 199 132 / var(--tw-bg-opacity, 1))}.app-progress-bar .thumb-container{position:absolute;top:50%;--tw-translate-y: -50%;--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));border-radius:9999px;border-width:1px;border-style:solid;--tw-border-opacity: 1;border-color:rgb(247 247 247 / var(--tw-border-opacity, 1));padding:1px}.app-progress-bar .thumb{height:.5rem;width:.5rem;border-radius:9999px;--tw-bg-opacity: 1;background-color:rgb(249 199 132 / var(--tw-bg-opacity, 1))}.app-current-track-wrapper.playing .app-scrollable-content.has-current-track{padding-bottom:12rem}.app-scrollable-content{display:block;overflow:hidden;transition:scrollbar-color .3s ease-in-out;-webkit-overflow-scrolling:touch}.app-scrollable-content.horizontal,.app-scrollable-content.both{width:100%;overflow-x:scroll}.app-scrollable-content.vertical,.app-scrollable-content.both{height:100%;overflow-y:scroll}.app-scrollable-content.has-scrollbar.horizontal,.app-scrollable-content.has-scrollbar.both{padding-bottom:.75rem}.app-scrollable-content.has-scrollbar.vertical,.app-scrollable-content.has-scrollbar.both{padding-right:.75rem}.app-scrollable-content.has-scrollbar::-webkit-scrollbar{height:7px;width:7px}.app-scrollable-content::-webkit-scrollbar{height:0px;width:0px;background-color:transparent}.app-scrollable-content::-webkit-scrollbar-track{border-radius:10px;background-color:transparent}.app-scrollable-content::-webkit-scrollbar-thumb{border-radius:10px;--tw-bg-opacity: 1;background-color:rgb(72 86 150 / var(--tw-bg-opacity, 1));background-clip:padding-box}.app-scrollable-content::-webkit-scrollbar-button{display:none;height:0px;width:0px}.app-scrollable-content::-webkit-scrollbar-corner{background-color:transparent}.rounded-wrapper{display:flex;width:-moz-fit-content;width:fit-content;flex-direction:column;row-gap:.5rem;border-radius:9999px;--tw-bg-opacity: 1;background-color:rgb(18 17 61 / var(--tw-bg-opacity, 1));padding:1rem .25rem}.app-logo{display:block;aspect-ratio:1 / 1;width:3rem}.app-sidebar{display:flex;height:100%;width:-moz-fit-content;width:fit-content;flex-shrink:0;flex-grow:0;flex-direction:column;align-items:center;justify-content:flex-start}.app-sidebar-wrapper{display:flex;height:100%;align-items:flex-start;justify-content:space-between;-moz-column-gap:1.5rem;column-gap:1.5rem}.app-sidebar-wrapper>.sidebar-wrapper-content{display:flex;height:100%;flex-grow:1;flex-direction:column;align-items:stretch;justify-content:flex-start}.page-login{display:flex;height:100%;justify-content:space-between}.page-login .bigger-side{display:flex;width:50%;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:10%;padding-bottom:2.5rem}.page-login .bigger-side .logo{margin-bottom:1rem;display:block;width:11rem}.page-login .bigger-side .title{margin-bottom:2.25rem;text-align:center;font-family:Quicksand,serif;font-size:2.25rem;line-height:2.5rem;font-weight:700;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.page-login .bigger-side .text{text-align:center;font-family:Quicksand,serif;font-size:1.25rem;line-height:1.75rem;font-weight:700;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.page-login .smaller-side{flex-grow:1}.app-github-project{display:flex;align-items:center;justify-content:center;-moz-column-gap:.75rem;column-gap:.75rem}.app-github-project .github-icon{display:block;width:1.25rem;fill:#f7f7f7;-o-object-fit:contain;object-fit:contain}.app-github-project .project{font-family:Quicksand,serif;font-size:.875rem;line-height:1.25rem;font-weight:600;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-button{display:flex;align-items:center;justify-content:center;gap:1rem;border-radius:5px;padding:1rem 1.5rem}.app-button .icon{display:block;height:.75rem;width:.75rem;flex-shrink:0}.app-spaced-between{display:flex;align-items:center;justify-content:space-between}.app-existing-account{display:flex;align-items:center;justify-content:flex-start;gap:1.75rem;border-radius:4px;border-width:1px;border-style:solid;--tw-border-opacity: 1;border-color:rgb(2 1 34 / var(--tw-border-opacity, 1));padding:1rem 1.25rem}.app-existing-account:hover{--tw-bg-opacity: 1;background-color:rgb(249 199 132 / var(--tw-bg-opacity, 1))}.app-existing-account .button-child{display:flex;flex-grow:1;align-items:center;justify-content:flex-start;gap:1.75rem}.app-existing-account .button-child .avatar{display:block;height:4rem;width:4rem;flex-shrink:0;overflow:hidden;border-radius:9999px}.app-existing-account .button-child .welcome{flex-grow:1;text-align:start;font-family:Quicksand,serif;font-size:1.125rem;line-height:1.75rem;font-weight:500}.app-existing-accounts-list{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:.75rem}.app-auth-form{display:flex;height:100%;flex-direction:column;align-items:stretch;justify-content:center;overflow:hidden;border-radius:10px;--tw-bg-opacity: 1;background-color:rgb(247 247 247 / var(--tw-bg-opacity, 1));padding-left:10%;padding-right:10%;padding-top:3rem;padding-bottom:3rem;padding-bottom:10%}.app-auth-form .title{margin-bottom:.25rem;font-family:Quicksand,serif;font-size:1.5rem;line-height:2rem;font-weight:700;--tw-text-opacity: 1;color:rgb(2 1 34 / var(--tw-text-opacity, 1))}.app-auth-form .short-description{margin-bottom:2rem;font-family:Quicksand,serif;font-weight:500;--tw-text-opacity: 1;color:rgb(2 1 34 / var(--tw-text-opacity, 1))}.app-auth-form .wrapped-text{font-family:Quicksand,serif;font-size:1rem;line-height:1.5rem;font-weight:500;--tw-text-opacity: 1;color:rgb(2 1 34 / var(--tw-text-opacity, 1))}.app-input .container{position:relative}.app-input .container.has-error .input{--tw-border-opacity: 1;border-color:rgb(220 38 38 / var(--tw-border-opacity, 1))}.app-input .container.no-icon .input{padding-left:1.25rem}.app-input .container.no-icon .input-title{left:23px}.app-input .container .input{border-radius:6px;border-width:2px;border-style:solid;border-color:transparent;--tw-bg-opacity: 1;background-color:rgb(231 231 231 / var(--tw-bg-opacity, 1));padding:1.25rem 1.25rem 1.25rem 4rem;outline:2px solid transparent;outline-offset:2px}.app-input .container .input:focus{--tw-border-opacity: 1 !important;border-color:rgb(37 99 235 / var(--tw-border-opacity, 1))!important;--tw-bg-opacity: 1;background-color:rgb(247 247 247 / var(--tw-bg-opacity, 1))}.app-input .container .input{display:block;width:100%;font-family:Quicksand,serif;font-size:1.125rem;line-height:1.75rem;font-weight:500}.app-input .container .centered-icon,.app-input .container .input-title{position:absolute;top:50%;--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.app-input .container .icon{left:1.5rem;display:block;height:1.25rem;width:1.25rem;fill:#b5b5b5}.app-input .container .icon svg,.app-input .container .icon path{fill:#b5b5b5}.app-input .container .input-title{left:65px}.app-input .container .input:not(:-moz-placeholder){--tw-border-opacity: 1;border-color:rgb(22 163 74 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(247 247 247 / var(--tw-bg-opacity, 1))}.app-input .container .input:not(:placeholder-shown){--tw-border-opacity: 1;border-color:rgb(22 163 74 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(247 247 247 / var(--tw-bg-opacity, 1))}.app-input .container .input:not(:-moz-placeholder)~.input-title{top:0;left:1.25rem;border-radius:4px;--tw-bg-opacity: 1;background-color:rgb(247 247 247 / var(--tw-bg-opacity, 1));padding:.25rem .5rem;font-size:.75rem;line-height:1rem}.app-input .container .input:not(:placeholder-shown)~.input-title{top:0;left:1.25rem;border-radius:4px;--tw-bg-opacity: 1;background-color:rgb(247 247 247 / var(--tw-bg-opacity, 1));padding:.25rem .5rem;font-size:.75rem;line-height:1rem}.app-input .container .input:not(:-moz-placeholder)~.icon{fill:#020122}.app-input .container .input:not(:placeholder-shown)~.icon{fill:#020122}.app-input .container .input:not(:-moz-placeholder)~.icon svg,.app-input .container .input:not(:-moz-placeholder)~.icon path{fill:#020122}.app-input .container .input:not(:placeholder-shown)~.icon svg,.app-input .container .input:not(:placeholder-shown)~.icon path{fill:#020122}.app-input .error{margin-top:.25rem;font-family:Quicksand,serif;font-size:.75rem;line-height:1rem;font-weight:500;--tw-text-opacity: 1;color:rgb(220 38 38 / var(--tw-text-opacity, 1))}.app-password-input .input{padding-right:3rem}.app-password-input .toggle-button{right:1.25rem;height:1.25rem;width:1.25rem}.app-password-input .toggle-button .toggle-view-icon{height:100%;width:100%}.app-password-input .toggle-button .toggle-view-icon svg,.app-password-input .toggle-button .toggle-view-icon path{fill:#020122}.app-table-view-chart{display:flex;align-items:center;justify-content:space-between;-moz-column-gap:2.25rem;column-gap:2.25rem;border-radius:15px;background-color:#f7f7f71a;padding:.75rem 1rem}.app-table-view-chart .close-info{display:flex;align-items:center;justify-content:flex-start;gap:1.25rem}.app-table-view-chart .close-info .cover{display:block;height:2.5rem;width:2.5rem;border-radius:9px}.app-table-view-chart .text{text-align:center;font-family:Quicksand,serif;font-size:1rem;line-height:1.5rem;font-weight:500;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-transparent-rounded-button{display:flex;width:-moz-fit-content;width:fit-content;align-items:center;justify-content:center;gap:.75rem;border-radius:9999px;background-color:#f7f7f71a;padding:.75rem 1rem}.app-transparent-rounded-button .image{display:block;height:1rem;width:1rem}.app-transparent-rounded-button .button-text{font-family:Quicksand,serif;font-size:1rem;line-height:1.5rem;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-cover{display:flex;align-items:flex-end;justify-content:flex-start;-moz-column-gap:2rem;column-gap:2rem}.app-cover .image{aspect-ratio:1 / 1;width:300px;max-width:50%;border-radius:35px;-o-object-fit:cover;object-fit:cover}.app-cover .information .title{margin-bottom:.75rem;font-family:Quicksand,serif;font-size:2.25rem;line-height:2.5rem;font-weight:700;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-cover .information .text{margin-bottom:.25rem;font-family:Quicksand,serif;font-size:1.125rem;line-height:1.75rem;font-weight:700;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-collection-button{border-radius:9999px;border-width:1px;border-style:solid;border-color:#f7f7f74d;padding:.75rem 1.25rem}.app-collection-button .button-text{font-family:Quicksand,serif;color:#f7f7f74d}.app-collection-button.selected{--tw-border-opacity: 1;border-color:rgb(249 199 132 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(249 199 132 / var(--tw-bg-opacity, 1))}.app-collection-button.selected .button-text{--tw-text-opacity: 1;color:rgb(2 1 34 / var(--tw-text-opacity, 1))}.app-context-menu{min-width:100px;max-width:300px;border-radius:8px;border-width:1px;border-style:solid;--tw-border-opacity: 1;border-color:rgb(72 86 150 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(18 17 61 / var(--tw-bg-opacity, 1));padding:.25rem;font-family:Quicksand,serif;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1));--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);--tw-shadow-color: #12113d;--tw-shadow: var(--tw-shadow-colored) }.app-context-menu ul{margin:0;display:flex;list-style-type:none;flex-direction:column;gap:.25rem;padding:0}.app-context-menu .context-menu-item{display:flex;align-items:center;justify-content:flex-start;gap:.5rem;border-radius:4px;padding:.25rem .75rem}.app-context-menu .context-menu-item:hover{--tw-bg-opacity: 1;background-color:rgb(72 86 150 / var(--tw-bg-opacity, 1))}.app-context-menu .context-menu-item.disabled{cursor:not-allowed;--tw-bg-opacity: 1;background-color:rgb(2 1 34 / var(--tw-bg-opacity, 1))}.app-context-menu .context-menu-item .context-menu-icon{display:block;height:1rem;width:1rem;-o-object-fit:contain;object-fit:contain}.app-playlist-card .title{font-family:Quicksand,serif;font-size:1.25rem;line-height:1.75rem;font-weight:700;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-playlist-card .author{font-family:Quicksand,serif;font-size:1rem;line-height:1.5rem;font-weight:700;color:#f7f7f780}.app-card{position:relative;height:234px;width:213px;overflow:hidden;border-radius:20px}.app-card .background>*{height:100%;width:100%;-o-object-fit:cover;object-fit:cover}.app-card .background,.app-card .content{position:absolute;left:0;top:0;height:100%;width:100%;-o-object-fit:cover;object-fit:cover}.app-card .content{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;background-image:linear-gradient(to top,var(--tw-gradient-stops));--tw-gradient-from: #000 var(--tw-gradient-from-position);--tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);--tw-gradient-to: rgb(2 1 34 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), rgb(2 1 34 / .6) var(--tw-gradient-via-position), var(--tw-gradient-to);--tw-gradient-to: transparent var(--tw-gradient-to-position);padding:1.5rem 1.25rem}.app-playlist-list{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:flex-start;gap:1rem}.app-playlist-list .create-playlist-content{display:flex;height:100%;width:100%;align-items:center;justify-content:center}.app-playlist-list .create-playlist-content .icon{height:50px;width:50px;-o-object-fit:contain;object-fit:contain}.app-playlist-list .create-playlist-background{--tw-bg-opacity: 1;background-color:rgb(72 86 150 / var(--tw-bg-opacity, 1))}.app-toggle-switch{display:flex;align-items:center;justify-content:flex-start;gap:.75rem}.app-toggle-switch .title{font-family:Quicksand,serif;font-size:1.125rem;line-height:1.75rem;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-toggle-switch .track{display:flex;height:2rem;width:3.5rem;align-items:center;border-radius:9999px;padding:.25rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}.app-toggle-switch .track.active{--tw-bg-opacity: 1;background-color:rgb(34 197 94 / var(--tw-bg-opacity, 1))}.app-toggle-switch .track.deactive{--tw-bg-opacity: 1;background-color:rgb(181 181 181 / var(--tw-bg-opacity, 1))}.app-toggle-switch .track .thumb{height:1.5rem;width:1.5rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));border-radius:9999px;--tw-bg-opacity: 1;background-color:rgb(247 247 247 / var(--tw-bg-opacity, 1));--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s}.app-toggle-switch .track.active .thumb{--tw-translate-x: 1.5rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.app-playlist-creation-form{display:flex;flex-direction:column;gap:1rem;padding:1rem .75rem}.app-playlist-creation-form .form-title{margin-bottom:.75rem;text-align:center;font-family:Quicksand,serif;font-size:1.875rem;line-height:2.25rem;font-weight:700;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-playlist-creation-form .button-text{font-family:Quicksand,serif;font-size:1rem;line-height:1.5rem;font-weight:500;--tw-text-opacity: 1;color:rgb(247 247 247 / var(--tw-text-opacity, 1))}.app-popup{position:fixed;top:0;left:0;z-index:50;display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:#02012233;transition-timing-function:cubic-bezier(0,0,.2,1)}.app-popup .popup-content-wrapper{position:relative;max-height:50vh;max-width:50vw;overflow:hidden;border-radius:8px;border-width:1px;border-style:solid;--tw-border-opacity: 1;border-color:rgb(72 86 150 / var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(18 17 61 / var(--tw-bg-opacity, 1));padding:.75rem .5rem;--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);--tw-shadow-color: rgb(72 86 150 / .2);--tw-shadow: var(--tw-shadow-colored);transition-timing-function:cubic-bezier(0,0,.2,1)}