*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,sans-serif}body,html{overflow-x:hidden}html{overflow-y:hidden}.home{position:absolute;top:0;width:100%;height:100vh;background-color:#1e1e1e;display:flex;flex-direction:column;align-items:center;overflow-y:scroll}.home .search-wrapper{position:sticky;top:0;width:100%;display:flex;justify-content:center;padding:2rem;z-index:10}.home .search-bar{width:30rem;display:grid;grid-template-columns:1fr;grid-template-rows:min-content;justify-items:flex-end;align-items:center;border-radius:5px}@media screen and (max-width: 900px){.home .search-bar{width:100%;font-size:1rem}}.home .search-bar input{grid-column:1;grid-row:1;width:100%;color:#fff;background-color:#33333390;backdrop-filter:blur(50px);border:1px solid rgba(255,255,255,.062745098);outline:none;border-radius:inherit;padding:1rem;font-size:1.2rem}.home .search-bar input::placeholder{color:#ffffff70}.home .search-bar .cross{grid-column:1;grid-row:1;filter:invert(1);height:2rem;margin-right:1rem;border-radius:5px;opacity:.5;cursor:pointer}.home .search-bar .cross:hover{background-color:#00000030}.home .results-wrapper{padding:4rem 2rem}.home .trending-title{opacity:0;font-weight:500;color:#fff;font-size:2rem;align-self:flex-start}.home .results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;margin-top:2rem}@media screen and (max-width: 1100px){.home .results{grid-template-columns:repeat(2,minmax(0,1fr))}}@media screen and (max-width: 900px){.home .results{padding:0}}@media screen and (max-width: 600px){.home .results{grid-template-columns:minmax(0,1fr)}}.home .results a{isolation:isolate;z-index:0;max-width:300px;color:#fff;text-decoration:none;display:flex;flex-direction:column;gap:1rem;border:1px solid rgba(255,255,255,.062745098);padding:1rem;background-color:#2f2f2f;border-radius:5px}@media screen and (max-width: 900px){.home .results a{max-width:100%}}.home .results a img{width:100%;border-radius:5px;border:1px solid rgba(255,255,255,.062745098);transition:all .1s ease}.home .results a h2{font-weight:600;overflow:hidden;text-overflow:ellipsis}.home .results a h3{font-weight:500;font-size:1rem;opacity:.8;z-index:-10}.home .results a:hover img{filter:brightness(80%)}.poster-generate{background-color:#1e1e1e;height:100vh;overflow-y:auto}.poster-generate>span{position:absolute;font-size:28px;font-weight:600;z-index:-10;width:fit-content;opacity:0}.poster-generate .poster-img-wrapper{min-height:100vh;display:flex;justify-content:center;align-items:center}.poster-generate .poster-img{color:#fff;width:fit-content;display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem;padding:2rem 0}.poster-generate .poster-img p{font-size:1.5rem;font-weight:600;opacity:.8}.poster-generate .poster-img .poster-preview-wrapper{display:flex;flex-direction:column;align-items:center;gap:.5rem}.poster-generate .poster-img .preview-wrapper{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;justify-items:center;align-items:center;border:1px solid rgba(255,255,255,.062745098);border-radius:5px}.poster-generate .poster-img .preview-wrapper .loader-wrapper{grid-column:1;grid-row:1;height:100%;width:100%;display:flex;justify-content:center;align-items:center;background-color:#1e1e1e70;z-index:10}.poster-generate .poster-img .preview-wrapper .loader{height:50px;width:50px;opacity:.4}.poster-generate .poster-img .preview-wrapper .preview{position:relative;min-height:540px;width:360px;grid-column:1;grid-row:1;border-radius:5px;visibility:hidden}.poster-generate .poster-img .preview-wrapper .preview:before{content:"";position:absolute;height:100%;width:100%;display:flex;justify-content:center;align-items:center;background-color:#2f2f2f;color:#ffffff60;border-radius:5px}.poster-generate .right-panel{display:flex;flex-direction:column;align-items:center;gap:.5rem}.poster-generate .options{width:360px;height:min-content;background-color:#2f2f2f;border:1px solid rgba(255,255,255,.062745098);border-radius:5px;padding:.1rem 1rem;display:flex;flex-direction:column;justify-content:center;align-items:center}.poster-generate .options .option-nav{display:grid;width:100%;align-items:center}.poster-generate .options .option-nav>*{grid-column:1;grid-row:1}.poster-generate .options .option-nav h2{position:relative;width:100%;text-align:center;font-size:1.5rem;font-weight:600;opacity:.8}.poster-generate .options .option-nav img{height:1.5rem;width:1.5rem;filter:invert(1);cursor:pointer}.poster-generate .options .option{position:relative;padding:.6rem;color:#fff;font-weight:400;width:100%;display:flex;justify-content:space-between;align-items:center}.poster-generate .options .option+.option:after{content:"";position:absolute;top:0;left:0;height:1px;width:100%;background-color:#ffffff10}.poster-generate .options .option label{font-weight:400;font-size:1.2rem;width:100%;cursor:pointer}.poster-generate .options .option label span{font-size:.8rem;line-height:.8rem;opacity:.7;display:none}.poster-generate .options .option input{position:relative;height:1.5rem;min-width:2.6rem;appearance:none}.poster-generate .options .option input:before{content:"";position:absolute;top:0;left:0;height:1.5rem;width:1.5rem;border-radius:5000px;background-color:#fff;transition:all .15s ease;z-index:1;cursor:pointer}.poster-generate .options .option input:after{content:"";position:absolute;top:-1px;left:-1px;width:calc(100% + 2px);height:calc(100% + 2px);background-color:#ffffff40;border-radius:500rem;box-sizing:content-box;cursor:pointer;transition:all .15s ease}.poster-generate .options .option input:focus{border-radius:500px}.poster-generate .options .option input:checked:before{translate:1.1rem}.poster-generate .options .option input:checked:after{background-color:#3f97ff60}.poster-generate .options .option input[type=color]{border:none;cursor:pointer;border-radius:3px;overflow:hidden}.poster-generate .options .option input[type=color]:after,.poster-generate .options .option input[type=color]:before{display:none}.poster-generate .options .option input[type=color]::-webkit-color-swatch-wrapper{padding:0}.poster-generate .options .option input[type=color]::-webkit-color-swatch{border:2px solid rgba(255,255,255,.2509803922);border-radius:3px}.poster-generate .options .option.custom-image{padding:3rem;margin:1rem;border:1px dashed rgba(255,255,255,.3137254902);background-color:#d8d8d81e;border-radius:3px}.poster-generate .options .option.custom-image.highlight{background-color:#d8d8d83e}.poster-generate .options .option.custom-image .select-button{width:min-content}.poster-generate .options .option.custom-image p{margin:0 auto;font-size:1rem;font-weight:400;text-align:center;opacity:1}.poster-generate .options .option.custom-image p button{border:none;background-color:transparent;font-size:1rem;color:#0d93f3;text-decoration:underline;cursor:pointer}.poster-generate .options .option.custom-image p .file-select{display:none}.poster-generate .options .option.custom-image p .file-select:after,.poster-generate .options .option.custom-image p .file-select:before{display:none}.poster-generate .options .option.custom-image:after{top:-1rem}.poster-generate .options.wallpaper label span{display:block}.poster-generate .download{width:100%;color:#ffffff20;text-decoration:none;font-weight:600;background-color:#2f2f2f;border:1px solid rgba(255,255,255,.062745098);border-radius:5px;padding:1rem;text-align:center;z-index:-1}.poster-generate .new-poster{color:#ffffff60;margin:1rem 0 5rem}.poster{color:var(--accent-color);position:absolute;padding:100px;width:1152px;min-height:1728px;display:flex;flex-direction:column;justify-content:space-between;gap:4rem;z-index:-1;translate:0 -100%;background-color:#fff}.poster.invert{color:#fff;background-color:var(--accent-color)}.poster.justify-title h1{justify-content:space-between}.poster.hidden-title h1,.poster.hidden-artist h2,.poster.hidden-tracks ul{display:none}.poster.hidden-title.hidden-artist{justify-content:center}.poster.hidden-title.hidden-artist>div{display:none}.poster.hidden-tracks{justify-content:center}.poster.wallpaper{justify-content:center;min-height:2496px;padding-top:500px}.poster h2{font-size:48px}.poster h1{width:100%;font-size:120px;line-height:120px;text-transform:uppercase;text-align:justify;display:flex;flex-wrap:wrap;column-gap:.5em}.poster ul{width:100%;list-style:none;display:grid;grid-template-columns:1fr 1fr;grid-auto-flow:column;column-gap:2rem;font-size:28px}.poster ul li{font-weight:600;display:grid;grid-template-columns:min-content 1fr min-content;white-space:nowrap}.poster ul li .separator{width:100%}.poster .overlay{position:absolute;top:0;left:0;height:100%;width:auto;opacity:0}.poster.texture div{display:none}.poster.texture div+img{display:none}.poster.texture ul{display:none}
