.spinner{display:grid;height:200px;place-items:center}.spinner__item{width:17.6px;height:17.6px;border-radius:17.6px;box-shadow:44px 0 #474bff33,35.6px 26px #474bff66,13.64px 41.8px #474bff99,-13.64px 41.8px #474bffcc,-35.6px 26px #474bff;animation:spinner 1.2s infinite linear}@keyframes spinner{to{transform:rotate(360deg)}}.profile{margin-block:1rem}.profile__inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:1rem 3rem;margin-inline:auto;width:fit-content;color:inherit;text-decoration:none}.profile__avatar{max-width:min(15vw,6rem);border-radius:50%}.profile__name{text-align:center;margin:0;font-size:clamp(1.875rem,1.152rem + 3.854vw,3rem)}.average-stat{margin-block:1rem;display:flex;gap:1rem;flex-wrap:wrap}.average-stat__category{display:flex;flex:1 1 auto;gap:1rem;flex-direction:column}.average-stat__list{display:flex;gap:1rem;flex-wrap:wrap}.average-stat__list-item{display:flex;align-items:center;gap:1rem}._lost{background-color:#fbe7e9}._win{background-color:#d4f8d3}.gray{color:#decd88}.green{color:#33f32d}.ashen{color:#444}.red{color:#f82e42}.userLaneStat{padding-block:1rem}.userLaneStat__form{display:flex;flex-wrap:wrap;align-items:center;gap:1rem}.userLaneStat__form input[type=number]::-webkit-inner-spin-button,.userLaneStat__form input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.userLaneStat__form input[type=number]{-moz-appearance:textfield}.userLaneStat__form input{padding:8px 16px;font-family:DM Sans,sans-serif}.userLaneStat__form button{cursor:pointer;padding:8px 16px;font-family:DM Sans,sans-serif}.userLaneStat__form-label{display:flex;gap:.25rem}.userLaneStat__table-wrapper{overflow-x:auto;padding:.5rem}.userLaneStat__table{text-align:center;text-transform:capitalize;border-collapse:collapse;width:100%}.userLaneStat__table tr{border-bottom:1px solid #D1D1D1}.userLaneStat__table th{font-weight:700;font-size:.875rem;color:#333;padding:1rem .75rem}.userLaneStat__table td{font-size:.875rem;color:#333;padding:.5rem}.userLaneStat__table tbody tr{cursor:pointer}.userLaneStat__table tbody tr:hover{outline:1px solid rgba(0,0,0,.75);z-index:10;box-shadow:0 0 6px 6px #a8a8a866}.userLaneStat__th-inner{display:grid;grid-auto-columns:auto;grid-auto-flow:column;align-items:center;justify-content:center;gap:.5rem;cursor:pointer;transition:.5s ease-in-out}.userLaneStat__th-inner-svg{transition:.25s ease-in-out}.userLaneStat__th-inner-svg.ascending{transform:rotate(90deg)}.userLaneStat__th-inner-svg.descending{transform:rotate(-90deg)}.userLaneStat__td-image-inner{display:grid;grid-template-columns:2rem auto;align-items:center;justify-content:start;gap:1rem;text-align:justify}.userLaneStat__td-lane>span{font-weight:600;font-size:1rem}.userLaneStat__td-result>span{display:block;padding:4px 12px;border-radius:20px}.userLaneStat__td-ranks{max-width:3rem;margin-inline:auto}:root{--font-family-base: "DM Sans", sans-serif;--font-family-base-line-height: 1.6;--font-family-heading: "DM Sans", sans-serif;--font-family-heading-line-height: 1.1;--font-family-code: monospace;--body-max-width: 75ch}*,*:before,*:after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none;font-family:var(--font-family-base);interpolate-size:allow-keywords}body{margin:0;min-height:100vh}h1,h2,h3,h4,button,input,label{line-height:var(--font-family-heading-line-height)}input,button,textarea,select{font-family:inherit;font-size:inherit}:is(ul,ol)[class]{list-style:"";margin:0;padding:0}h1,h2,h3,h4{text-wrap:balance;font-family:var(--font-family-heading)}p,li,figcaption{text-wrap:pretty}code{font-family:var(--font-family-code)}:first-child{margin-block-start:0}h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin-block-end:0}img,picture{max-width:100%;display:block}.grid-container{--padding-inline: 24px;--content-max-width: 1440px;--breakout-max-width: 1600px;--breakout-size: calc( (var(--breakout-max-width) - var(--content-max-width)) / 2 );display:grid;grid-template-columns:[full-width-start] minmax(var(--padding-inline),1fr) [breakout-start] minmax(0,var(--breakout-size)) [content-start] min(100% - var(--padding-inline) * 2,var(--content-max-width)) [content-end] minmax(0,var(--breakout-size)) [breakout-end] minmax(var(--padding-inline),1fr) [full-width-end]}@media (width < 768px){.grid-container{--padding-inline: 16px}}.grid-content{grid-column:content}.grid-content-full{grid-column:full-width}.grid-breakout{grid-column:breakout}.tint{background:#b58e7440}
