*,*::before,*::after{box-sizing:border-box}html{font-size:100%;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#1864ae rgba(0,0,0,0)}html::-webkit-scrollbar{width:8px}html::-webkit-scrollbar-track{background:rgba(0,0,0,0)}html::-webkit-scrollbar-thumb{background:#1864ae;border-radius:999px}html::-webkit-scrollbar-thumb:hover{background:rgba(0,115,247,.55)}body{margin:0;min-height:100vh;height:100%;background:#010206;color:#fffede;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:1rem;line-height:1.5}body button,body input,body select,body textarea{font:inherit}body button,body select{cursor:pointer}body img,body svg{display:block;max-width:100%}body button{border:0}body h1,body h2,body h3,body p{margin:0}body a{color:inherit}body main{min-height:calc(100vh - 303px);background-image:linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.3)),url("../../assets/background.webp");background-size:cover;background-position:top 100px center;background-attachment:fixed;background-repeat:no-repeat}body.modal-open{overflow:hidden}.container{width:100%;margin:0 auto;padding:0 1rem;transition:width 300ms ease}@media(min-width: 576px){.container{padding:0;max-width:540px}}@media(min-width: 768px){.container{max-width:720px}}@media(min-width: 992px){.container{max-width:960px}}@media(min-width: 1200px){.container{max-width:1140px}}@media(min-width: 1440px){.container{max-width:1360px}}.header{display:flex;flex-direction:column;gap:.5rem;text-align:center;background:#010206}.header .header__wrapper{padding:1.875rem 0;display:flex;flex-direction:column;gap:.75rem}.header .header__wrapper .title{display:flex;flex-direction:column;gap:2px;font-size:2.25rem;font-weight:700;line-height:1.2}.header .header__wrapper .title span{display:block}.header .header__wrapper .title span:nth-child(1){position:relative;font-family:"Roboto Condensed",sans-serif;font-weight:900;letter-spacing:.02em;font-size:3rem;text-transform:uppercase;line-height:.9;background:linear-gradient(to bottom, #ffffff 0%, #ececec 25%, #b6b3b3 85%, #9e9e9e 100%);-webkit-background-clip:text;background-clip:text;color:rgba(0,0,0,0)}.header .header__wrapper .title span:nth-child(2){font-family:"Roboto Condensed",sans-serif;font-size:3.5rem;font-weight:900;letter-spacing:.02em;line-height:.9;text-transform:uppercase;background-image:linear-gradient(to bottom, #ff8a2a 0%, #f06a18 25%, #d94a0d 50%, #a92805 78%, #7f1b03 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0);color:rgba(0,0,0,0)}.header .header__wrapper .subtitle{color:#9da5b3;font-size:1rem}.calculator{display:flex;justify-content:center}.calculator .calculator__wrapper{display:flex;flex-direction:column;gap:1.75rem;padding:2rem 0}.calculator .calculator__wrapper .champions{display:flex;flex-direction:column;gap:2rem}.calculator .calculator__wrapper .champions .champions__header{display:flex;align-items:center;gap:1.125rem}.calculator .calculator__wrapper .champions .champions__header h3{max-width:241px}.calculator .calculator__wrapper .champions .champions__header .card-counter{display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.625rem;background-color:rgba(0,0,0,.5);border:1px solid rgba(157,165,179,.78);border-radius:.25rem;width:2.25rem;height:2.25rem}.calculator .calculator__wrapper .champions .champions__header button{background:#3ad0f8;transition:250ms ease;border-radius:4px;color:#000207;flex-shrink:0}.calculator .calculator__wrapper .champions .champions__header button:hover{background:#30ace6}.calculator .calculator__wrapper .champions .champions__header button:disabled{background:rgba(255,255,255,.5);pointer-events:none;box-shadow:none}.calculator .calculator__wrapper .champions .champions__header button{display:flex;align-items:center;justify-content:center;width:145px;white-space:nowrap;border-radius:4px;padding:.375rem 1.125rem;font-weight:700;box-shadow:2px 2px rgba(20,36,52,.75)}.calculator .calculator__wrapper .champions .champions__header button:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(20,36,52,.75)}.calculator .calculator__wrapper .champions .champions__list{display:flex;flex-direction:column;align-self:center;gap:1.25rem}@media(min-width: 768px){.calculator .calculator__wrapper .champions .champions__list{align-self:self-start;display:grid;grid-template-columns:repeat(2, 1fr);gap:1rem}}@media(min-width: 1200px){.calculator .calculator__wrapper .champions .champions__list{grid-template-columns:repeat(3, 1fr);gap:1.25rem}}@media(min-width: 992px){.calculator .calculator__wrapper .champions{align-items:start}}.calculator .calculator__wrapper .champion-empty-state{display:none;flex-direction:column;align-items:center;justify-content:center;gap:1rem;font-size:1.25rem;padding:20px;border:1px solid rgba(255,255,255,.5);border-radius:.5rem}.calculator .calculator__wrapper .champion-empty-state .champion-empty-state__text{text-align:center}.calculator .calculator__wrapper .champion-empty-state:not([hidden]){display:flex}.calculator .calculator__wrapper .team-settings{width:100%;display:flex;flex-direction:column;gap:1rem;max-width:744px}.calculator .calculator__wrapper .team-settings .team-settings__fields{display:flex;flex-direction:column;gap:1.25rem}.calculator .calculator__wrapper .team-settings .team-settings__fields .team-settings__fields-wrapper{display:flex;flex-direction:column;gap:.75rem}.calculator .calculator__wrapper .team-settings .team-settings__fields .team-settings__fields-wrapper label{display:flex;gap:8px;align-items:baseline}.calculator .calculator__wrapper .team-settings .team-settings__fields .team-settings__fields-wrapper label span{width:6.5rem}.calculator .calculator__wrapper .team-settings .team-settings__fields .team-settings__fields-wrapper label select{width:12rem;border-radius:2px;padding:4px;height:32px;border:none}.calculator .calculator__wrapper .team-settings .team-settings__fields .team-settings__aura-info{max-width:366px;flex-direction:column}.calculator .calculator__wrapper .team-settings .team-settings__fields .team-settings__aura-info .team-settings__aura-button{display:flex;align-items:baseline;gap:1rem}.calculator .calculator__wrapper .team-settings .team-settings__fields .team-settings__aura-info .team-settings__aura-button button{background:rgba(0,0,0,0);color:#9da5b3;border:1px solid #9da5b3;display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;border-radius:50%;flex-shrink:0;transition:300ms ease}.calculator .calculator__wrapper .team-settings .team-settings__fields .team-settings__aura-info .team-settings__aura-button button:hover{color:#fff;border-color:#fff}@media(min-width: 768px){.calculator .calculator__wrapper .team-settings .team-settings__fields .team-settings__aura-info{max-width:fit-content}}@media(min-width: 1200px){.calculator .calculator__wrapper .team-settings .team-settings__fields{flex-direction:row;align-items:end;gap:1.25rem}}@media(min-width: 992px){.calculator .calculator__wrapper .team-settings{align-items:start}}@media(min-width: 1200px){.calculator .calculator__wrapper .team-settings{max-width:1138px}}.calculator .calculator__wrapper:has(.champion-empty-state:not([hidden])){gap:40px}@media(min-width: 1200px){.calculator .calculator__wrapper{padding:3.5rem 0}}.champion-card{display:flex;max-width:380px;height:stretch;flex-direction:column;justify-content:space-between;gap:.75rem;padding:1.125rem;background:linear-gradient(#b23804 5%, #500000);border:1px solid #343b48;border-radius:.75rem;color:#fff;outline:2px solid rgba(0,0,0,.8);outline-offset:1px;border:2px solid rgba(150,160,165,.55);box-shadow:0 0 0 4px rgba(0,0,0,.8),0 0 0 6px rgba(210,215,215,.25),0 5px 10px rgba(0,0,0,.6)}.champion-card .champion-card__header{display:flex;align-items:center;justify-content:space-between;max-width:328px;gap:.25rem}.champion-card .champion-card__header h3{font-size:2rem;white-space:nowrap;overflow-x:hidden;text-overflow:ellipsis}.champion-card .champion-card__header .champion-card__remove{background:#efdb8c;transition:250ms ease;border-radius:4px;color:#000207;flex-shrink:0}.champion-card .champion-card__header .champion-card__remove:hover{background:#f5c56d}.champion-card .champion-card__header .champion-card__remove:disabled{background:rgba(255,255,255,.5);pointer-events:none;box-shadow:none}.champion-card .champion-card__header .champion-card__remove{padding:4px 12px;box-shadow:2px 2px rgba(118,22,1,.4)}.champion-card .champion-card__header .champion-card__remove:active{transform:translateY(1px);box-shadow:0 1px rgba(118,22,1,.4)}.champion-card .champion-card__fields{display:flex;flex-direction:column;gap:.5rem}.champion-card .champion-card__fields label{position:relative;width:fit-content;display:flex;gap:.5rem;align-items:baseline;z-index:10}.champion-card .champion-card__fields label span{width:7.5rem}.champion-card .champion-card__fields label input,.champion-card .champion-card__fields label select{width:12.5rem;border-radius:2px;padding:4px;margin:0;height:2rem;border:none}.champion-card .champion-card__fields label .champion-card__suggestions{position:absolute;z-index:20;top:100%;left:128px;width:calc(100% - 128px);background:#fff;border:1px solid #ccc;border-radius:4px;box-sizing:border-box;overflow:hidden;max-height:200px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#a8a8a8 rgba(0,0,0,0)}.champion-card .champion-card__fields label .champion-card__suggestions .champion-card__option{display:block;width:100%;padding:8px 10px;border:0;background:#f5f4f1;color:#0d181d;text-align:left;cursor:pointer}.champion-card .champion-card__fields label .champion-card__suggestions .champion-card__option:hover{background:#fddbb2}.champion-card .champion-card__fields label .champion-card__suggestions .champion-card__option.is-selected{background-color:#fdd39f}.champion-card .champion-card__fields label .champion-card__suggestions::-webkit-scrollbar-track{background:rgba(0,0,0,0)}.champion-card .champion-card__fields label .champion-card__suggestions::-webkit-scrollbar-thumb{border-radius:100px}.champion-card .champion-card__fields label .champion-card__suggestions::-webkit-scrollbar-button{display:none}.champion-card .champion-card__fields label:has(.champion-card__suggestions){z-index:20}.champion-card .champion-card__result{font-size:1.5rem;font-weight:400;flex:stretch;align-content:end;display:flex;align-items:baseline;gap:1rem;flex-wrap:balance}.champion-card .champion-card__result .champion-card__speed{font-size:3rem}.champion-card .champion-card__result .champion-card__speed .decimal{font-size:2.125rem;font-weight:500}.footer{padding:2.25rem 0;margin-top:auto;background:#010206}.footer .footer__wrapper{display:flex;justify-content:center;align-items:center;gap:1.75rem}.footer .footer__wrapper p{font-size:1rem;color:#9da5b3}.footer .footer__wrapper .footer__info{display:flex;align-items:center;gap:1rem}.footer .footer__wrapper .footer__info button.info-list{background:rgba(0,0,0,0);border:1px solid #9da5b3;border-radius:4px;padding:.25rem 1rem;color:#9da5b3;transition:300ms ease}.footer .footer__wrapper .footer__info button.info-list:hover{background:#1a1c23;border-color:#fff;color:#fff}.footer .footer__wrapper .footer__support{display:flex;align-items:center;justify-content:center;gap:.625rem;padding:.375rem .625rem;color:#9da5b3;text-decoration:none;transition:300ms ease}.footer .footer__wrapper .footer__support img{max-width:2.125rem;transition:200ms ease-in-out;opacity:.8}.footer .footer__wrapper .footer__support:hover{border:1px solidw #fff;color:#fff}.footer .footer__wrapper .footer__support:hover img{transform:scale(1.1) rotateZ(-38deg);opacity:1}.info-modal{width:80%;height:70%;border:none;border-radius:.5rem;padding:1.875rem 2.5rem;scrollbar-color:auto;scrollbar-width:thin}.info-modal .info-modal__content{display:flex;flex-direction:column;gap:1rem;text-underline-offset:2px}.info-modal .info-modal__content .modal-img{padding:.375rem 0}.info-modal .info-modal__content .info-modal__close{position:absolute;right:1rem;top:1.125rem;width:1.875rem;height:1.875rem;display:flex;align-items:center;justify-content:center;background-color:#fcf9f6;border:2px solid #f5eee7;border-radius:4px}.info-modal .info-modal__content .info-modal__close:hover{border-color:#dcdcdc}.info-modal .info-modal__content .info-modal__title{font-size:1.875rem}.info-modal .info-modal__content .info-modal__champions h3{text-transform:capitalize}.info-modal .info-modal__content .info-modal__champions .info-modal__champions-list{padding-top:1.25rem;display:grid;gap:1rem}.info-modal .info-modal__content .info-modal__champions .info-modal__champions-list .factionWrapper{background-color:#fcf9f6;border:2px solid #f5eee7;border-radius:.375rem;padding:.75rem 1rem}.info-modal .info-modal__content .info-modal__champions .info-modal__champions-list .factionWrapper ul{padding-left:1.875rem}@media(min-width: 992px){.info-modal .info-modal__content .info-modal__champions .info-modal__champions-list{grid-template-columns:repeat(2, 1fr)}}@media(min-width: 1440px){.info-modal .info-modal__content .info-modal__champions .info-modal__champions-list{grid-template-columns:repeat(4, 1fr)}}.info-modal::backdrop{background:rgba(0,0,0,.55)}@media(min-width: 768px){.info-modal{width:70%;height:70%}}@media(min-width: 1440px){.info-modal{width:60%}}
