.container.svelte-asb9li{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:100svh;width:100%;overflow:hidden;gap:4rem}.background-image.svelte-asb9li{background-size:cover;background-position:center;background-repeat:no-repeat;position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;opacity:0}.heading.svelte-asb9li{display:flex;align-items:center;gap:1rem}.heading.svelte-asb9li a,.heading.svelte-asb9li button{background-color:transparent;border:none;border-radius:.5rem;padding:.5rem 1rem;cursor:pointer;color:var(--text-color);text-transform:uppercase;font-weight:600;display:flex;align-items:center;gap:.5rem;transition:background-color .2s ease-in-out}.heading.svelte-asb9li a .svg,.heading.svelte-asb9li button .svg{height:auto;width:1rem;color:var(--text-color)}.heading.svelte-asb9li a:hover,.heading.svelte-asb9li button:hover{background-color:var(--secondary)}.heading.svelte-asb9li .disabled{cursor:default}.heading.svelte-asb9li .disabled:hover{background-color:transparent}.heading.svelte-asb9li img{object-fit:contain;height:2rem}.heading.svelte-asb9li .title{display:flex;flex-direction:column;align-items:center;gap:.5rem}.heading.svelte-asb9li .title h1{font-size:var(--font-lg);text-transform:uppercase}.carousel.svelte-asb9li{display:flex;overflow-x:scroll;width:100%;max-width:768px;gap:1rem;scroll-snap-type:x mandatory;scrollbar-width:none;align-items:flex-start;-webkit-mask-image:linear-gradient(to right,transparent,var(--background) 10%,var(--background) 90%,transparent);mask-image:linear-gradient(to right,transparent,var(--background) 10%,var(--background) 90%,transparent)}.carousel.svelte-asb9li::-webkit-scrollbar{display:none}.carousel.svelte-asb9li>div{scroll-snap-align:center;height:fit-content;width:max-content}.carousel.svelte-asb9li>div>img{object-fit:contain;height:12rem;width:auto}.carousel.svelte-asb9li .placeholder{visibility:hidden}.selected-champion.svelte-asb9li{opacity:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem}.selected-champion.svelte-asb9li>h2{font-size:var(--font-xl);text-align:center}.selected-champion.svelte-asb9li>a{background-color:var(--accent);color:var(--text-color);padding:.5rem 1rem;border-radius:.5rem;text-decoration:none;text-transform:uppercase;font-weight:600;transition:background-color .2s}.selected-champion.svelte-asb9li>a:hover{background-color:var(--secondary)}
