@import url(https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@400;700&display=swap);
.header{position:static;background:#000;height:80px}.header__wrapper{display:flex;align-items:center;justify-content:space-between;height:100%}.header__logo{height:75px}.header__links{display:flex;align-items:center;gap:15px}.header__link{display:flex;justify-content:center;cursor:pointer}.header__link-text{margin-right:10px;color:#fff;line-height:28px}.header__link-icon svg{height:100%;fill:#fff}@media(max-width: 768px){.header__link:not(:last-child) .header__link-text{display:none}.header__links{width:100%;justify-content:flex-end;align-items:center;gap:20px}}@media(max-width: 576px){.header__wrapper{padding:0 10px}.header__links{justify-content:end;gap:10px}.header__link{padding:5px}.header__link-text{display:none}.header__logo{height:50px}}
.icon{width:25px;height:100%;cursor:pointer}@media(max-width: 576px){.icon{width:20px}}
.textWithIcon{display:flex;justify-content:center;align-items:center}.textWithIcon__text{font-size:15px}.textWithIcon__icon{width:40px;margin-left:20px}.coin{display:flex;justify-content:center;align-items:center}.coin__text{color:#ffc107;margin-right:10px}.coin__text:empty{margin-right:0}.coin__img{height:15px;width:15px}.coin__img:not(.animate){animation:rotate 2s linear infinite}@keyframes rotate{0%{transform:rotateY(0deg)}100%{transform:rotateY(360deg)}}@media(max-width: 576px){.coin__text{font-size:12px}.coin__img{height:10px;width:10px}}
.user__form{width:100%;min-height:70px;display:flex;align-items:center;justify-content:space-between;padding:5px 20px;margin:0 0 10px;border:1px dashed #000;border-radius:5px}.user__form select option:before{content:"";display:block;width:5px;height:5px;background-color:green}@media(max-width: 992px){.user__form{min-height:100px;flex-wrap:wrap;justify-content:space-around}}@media(max-width: 576px){.user__form{padding:10px 20px}.user__form .field{margin-bottom:20px}.user__form .field,.user__form .button{width:100%}}
.field{position:relative;width:160px;height:35px}.field__wrapper{position:relative;display:block;height:inherit}.field__label{position:absolute;left:10px;top:50%;transform:translateY(-50%);padding:0 5px;font-size:12px;background:#fff;white-space:nowrap;transition:all 120ms ease-in;line-height:1.2}.field__input{box-sizing:border-box;display:block;width:100%;height:inherit;border:2px solid #000;padding:5px 10px;color:#000;background:rgba(0,0,0,0)}.field__input:focus+.field__label,.field__input:not(:placeholder-shown)+.field__label{top:0;left:5px;transform:translateY(-50%)}.field:has(.field__error) .field__label{color:red}.field:has(.field__error) .field__input{border-color:red}.field__error{position:absolute;color:red;font-size:10px}.field.textarea textarea{resize:none}.field.select .select__options{position:absolute;width:100%;top:40px;left:0;background:#fff;border:1px solid #000;z-index:1;max-height:300px;overflow-y:auto}.field.select .option{padding:4px 8px}.field.select .option.active{background:rgba(0,0,0,.3)}.field.select .option:hover:not(.active){background:rgba(0,0,0,.15)}.field.select .field__input{display:flex;justify-content:space-between;align-items:center}.field.select .select__input-trigger{position:relative;width:16px}.field.select .select__input-trigger span{width:10px;height:1px;display:block;border:1px solid #000}.field.select .select__input-trigger span:first-child{transform:rotate(45deg);position:absolute;left:0}.field.select .select__input-trigger span:last-child{transform:rotate(135deg);position:absolute;right:0}.field.select .open .select__input-trigger{transform:scale(-1)}.img{width:200px;height:200px}.img .field__wrapper{height:100%;overflow:hidden;position:relative;border:4px dashed #000}.img .field__wrapper.error{border-color:red}.img .field__input{opacity:0}.img .field__placeholder,.img .img__thumbnail{position:absolute;top:0;left:0;width:100%;height:100%;display:block}.img .field__placeholder{display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;opacity:0}.img .img__thumbnail:empty~.field__placeholder{opacity:1}.img .img__thumbnail:not(:empty)~.field__placeholder:hover{opacity:1;color:#fff;background:rgba(0,0,0,.5)}.img .img__thumbnail:not(:empty)~.field__placeholder:hover svg path{fill:#fff}.img .img__thumbnail{z-index:-1}.img .img__thumbnail img{width:100%;height:100%;object-fit:cover}@media(max-width: 576px){.field{font-size:10px;height:25px}.field.textarea{height:30px}.field__label{font-size:10px}.field__close{width:35px;height:35px}}
.button{display:flex;cursor:pointer}.button__withoutDefaultStyle{height:100%;background:none;color:inherit;border:none;padding:0;font:inherit;cursor:pointer;outline:inherit}.button__close{width:50px;height:50px;transition:transform .5s}.button__close:hover{cursor:pointer;transform:rotate(90deg)}.button__close svg{width:100%;height:100%;fill:#000}.button__regular{border:2px solid #000;width:160px;height:40px;font-weight:600;font-size:16px;line-height:22px;color:#000;align-items:center;transition:all .6s;background:rgba(0,0,0,0);display:flex;justify-content:space-around;align-items:center}.button__regular:not([disabled]):hover{box-shadow:0 0 20px rgba(0,0,0,.5)}.button__regular svg{width:25px;height:25px}.button__action{border:unset;height:25px;min-width:25px}.button__acceptOrDecline{width:60px;justify-content:space-between}.button__acceptOrDecline .accept svg:hover path{fill:green}.button__acceptOrDecline .decline svg:hover path{fill:red}.button__yesOrNo{justify-content:space-around;margin-top:20px;min-width:270px}.button__yesOrNo .button{width:115px}.button__yesOrNo .button svg path{transition:all .5s}.button__yesOrNo .button.yes:hover svg path{fill:green}.button__yesOrNo .button.no:hover svg path{fill:red}.button__cyberpunk{margin-top:20px;width:250px;list-style-type:none;--primary: hsl( var(--primary-hue), 0%, calc(var(--primary-lightness, 10) * 0.3%) );--shadow-primary: hsl(var(--shadow-primary-hue), 90%, 50%);--primary-hue: 0;--primary-lightness: 50;--color: hsl(0, 0%, 100%);--font-size: 26px;--shadow-primary-hue: 180;--label-size: 9px;--shadow-secondary-hue: 60;--shadow-secondary: hsl(var(--shadow-secondary-hue), 90%, 60%);--clip: polygon( 0 0, 100% 0, 100% 100%, 95% 100%, 95% 90%, 85% 90%, 85% 100%, 8% 100%, 0 70% );--border: 4px;--shimmy-distance: 5;--clip-one: polygon( 0 2%, 100% 2%, 100% 95%, 95% 95%, 95% 90%, 85% 90%, 85% 95%, 8% 95%, 0 70% );--clip-two: polygon( 0 78%, 100% 78%, 100% 100%, 95% 100%, 95% 90%, 85% 90%, 85% 100%, 8% 100%, 0 78% );--clip-three: polygon( 0 44%, 100% 44%, 100% 54%, 95% 54%, 95% 54%, 85% 54%, 85% 54%, 8% 54%, 0 54% );--clip-four: polygon( 0 0, 100% 0, 100% 0, 95% 0, 95% 0, 85% 0, 85% 0, 8% 0, 0 0 );--clip-five: polygon( 0 0, 100% 0, 100% 0, 95% 0, 95% 0, 85% 0, 85% 0, 8% 0, 0 0 );--clip-six: polygon( 0 40%, 100% 40%, 100% 85%, 95% 85%, 95% 85%, 85% 85%, 85% 85%, 8% 85%, 0 70% );--clip-seven: polygon( 0 63%, 100% 63%, 100% 80%, 95% 80%, 95% 80%, 85% 80%, 85% 80%, 8% 80%, 0 70% );color:var(--color);cursor:pointer;background:0 0;text-transform:uppercase;font-size:var(--font-size);outline:rgba(0,0,0,0);letter-spacing:2px;position:relative;font-weight:700;border:0;height:65px;line-height:75px;transition:background .2s}.button__cyberpunk:hover{--primary: hsl( var(--primary-hue), 60%, calc(var(--primary-lightness, 50) * 0.4%) )}.button__cyberpunk:hover .animation{display:flex}.button__cyberpunk::after,.button__cyberpunk::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;clip-path:var(--clip);z-index:-1}.button__cyberpunk::before{background:var(--shadow-primary);transform:translate(var(--border), 0)}.button__cyberpunk::after{background:var(--primary)}.button__cyberpunk:nth-of-type(even){--primary-hue: 260}.button__cyberpunk .animation{position:absolute;top:calc(var(--border)*-1);left:calc(var(--border)*-1);right:calc(var(--border)*-1);bottom:calc(var(--border)*-1);background:var(--shadow-primary);text-shadow:2px 2px var(--shadow-primary),-2px -2px var(--shadow-secondary);clip-path:var(--clip);animation:glitch 2s infinite;justify-content:center;align-items:center;display:none}.button__cyberpunk .animation:before{content:"";position:absolute;top:calc(var(--border)*1);right:calc(var(--border)*1);bottom:calc(var(--border)*1);left:calc(var(--border)*1);clip-path:var(--clip);background:var(--primary);z-index:-1}.button__cyberpunk .sublable{position:absolute;padding:1px;letter-spacing:1px;line-height:1;bottom:-5%;right:4%;font-weight:400;color:#000;font-size:var(--label-size)}.button__cyberpunk.active{--primary: hsl( var(--primary-hue), 70%, calc(var(--primary-lightness, 10) * 0.6%) ) !important}.button__cyberpunk.active .animation{display:flex;animation:glitch 5s infinite}.button__cyberpunk span:first-child{display:block;height:100%;width:100%;display:flex;justify-content:center;align-items:center}.button__cyberpunk img,.button__cyberpunk svg{width:50px;height:50px}@keyframes glitch{0%{clip-path:var(--clip-one)}2%,8%{clip-path:var(--clip-two);transform:translate(calc(var(--shimmy-distance) * -1%), 0)}6%{clip-path:var(--clip-two);transform:translate(calc(var(--shimmy-distance) * 1%), 0)}9%{clip-path:var(--clip-two);transform:translate(0, 0)}10%{clip-path:var(--clip-three);transform:translate(calc(var(--shimmy-distance) * 1%), 0)}13%{clip-path:var(--clip-three);transform:translate(0, 0)}14%,21%{clip-path:var(--clip-four);transform:translate(calc(var(--shimmy-distance) * 1%), 0)}25%{clip-path:var(--clip-five);transform:translate(calc(var(--shimmy-distance) * 1%), 0)}30%{clip-path:var(--clip-five);transform:translate(calc(var(--shimmy-distance) * -1%), 0)}35%,45%{clip-path:var(--clip-six);transform:translate(calc(var(--shimmy-distance) * -1%))}40%{clip-path:var(--clip-six);transform:translate(calc(var(--shimmy-distance) * 1%))}50%{clip-path:var(--clip-six);transform:translate(0, 0)}55%{clip-path:var(--clip-seven);transform:translate(calc(var(--shimmy-distance) * 1%), 0)}60%{clip-path:var(--clip-seven);transform:translate(0, 0)}100%,31%,61%{clip-path:var(--clip-four)}}.button[disabled],.button button[disabled]{opacity:.5;cursor:not-allowed}@media(max-width: 576px){.text.field-name{width:100px}.button{font-size:14px}.button__regular{height:25px;width:100px}.button__close{width:30px;height:30px}.button__action{height:20px;min-width:20px}}
.user-team .team{display:flex;align-items:center}.user-team .team-icon{width:20px;height:20px;margin-right:8px}.user-team .team-icon svg{width:100%;height:100%}.user-team .team-color{display:block;width:10px;height:10px;border-radius:50%;margin-right:8px}.user-team .team p:first-letter{text-transform:uppercase}.user-team .option:not(.user-team-active){color:rgba(128,128,128,.5)}
.skeleton{margin-top:30px}.skeleton__grid-row{margin:5px 0;border-radius:10px;width:100%;height:70px;display:flex;justify-content:space-around;align-items:center;background:rgba(196,196,196,.3)}.skeleton__grid-column{width:150px;height:40%;background:rgba(196,196,196,.5);border-radius:10px}@keyframes shine-lines{0%{background-position:0px}40%,100%{background-position:1170px}}.skeleton__tabs{display:flex;justify-content:space-around;align-items:center}.skeleton__tabs-item{width:200px;height:50px;background:rgba(196,196,196,.3);border:1px solid rgba(196,196,196,.8);border-radius:10px}.skeleton__achievement{margin-bottom:20px}.skeleton__achievement .achievement-img,.skeleton__achievement .achievement-content{background:rgba(196,196,196,.3);border:none;padding:10px}.skeleton__achievement .achievement-title,.skeleton__achievement .achievement-subtitle,.skeleton__achievement .achievement-exp,.skeleton__achievement .achievement-coin{background:rgba(196,196,196,.5);border-radius:5px;height:10px}.skeleton__achievement .achievement-title{width:200px;height:20px;margin-bottom:5px;min-height:unset}.skeleton__achievement .achievement-subtitle{width:300px;height:30px}.skeleton__achievement .achievement-exp,.skeleton__achievement .achievement-coin{width:100px;height:18px;margin-bottom:5px}@media(max-width: 992px){.skeleton__grid-column:nth-child(1){display:none}}@media(max-width: 768px){.skeleton__grid-column:nth-child(2){display:none}}@keyframes pulse{0%{opacity:1}50%{opacity:.4}100%{opacity:1}}
.table{margin-top:40px}.table__filter{display:flex;justify-content:space-around;margin-bottom:20px;flex-wrap:wrap}.table__head{background-color:#000;text-transform:uppercase;font-weight:900;min-height:50px;color:#fff;margin-bottom:10px}.table__head .cell{text-align:center}.table__body a{display:block}.table__body .row{border:2px solid #000;box-shadow:8px 8px 0px #000;min-height:60px;margin-bottom:15px;cursor:pointer;text-align:center}.table__body .row:hover{background:rgba(0,0,0,.05);transform:scale(1.005)}.table .row{display:flex;padding:5px 10px;justify-content:space-between;align-items:center}.table .cell{width:250px}.table .cell:has(input[type=checkbox]){width:20px}.table .cell.action{width:75px}.table .cell.exp,.table .cell.coin{position:relative;display:flex;align-items:center;justify-content:center;width:100px}.table .cell.exp .sort,.table .cell.coin .sort{height:24px}.table .delete{width:25px}.table .delete:disabled{cursor:auto}.user-grid .info{width:100%;display:flex;justify-content:space-around;align-items:center;flex-wrap:wrap}.user-grid .table__body .name{display:flex;justify-content:center;align-items:center;gap:16px}.user-grid .table__body .lvl{padding-right:44px;position:relative}.user-grid .name{padding-right:44px;position:relative}.user-grid .leader-flag{position:absolute;right:0}.user-grid .lvl{width:210px}.user-grid .lvl .textWithIcon{height:40px}.user-grid .lvl .textWithIcon span{display:block}.user-grid .lvl .textWithIcon img{position:absolute;right:0}@media(max-width: 992px){.table{margin-top:20px}.table .cell{width:230px}}@media(max-width: 768px){.user-grid .name{min-height:30px}.user-grid .leader-flag,.user-grid .textWithIcon .icon{transform:scale(0.7)}}@media(max-width: 576px){.table{margin-top:0px}.table .cell{width:170px}.table__head .cell{font-size:14px}.user-grid .row{justify-content:space-between}.user-grid .field.text.field-name{width:100%}.user-grid .cell{width:150px}.user-grid .cell.exp{display:none}.user-grid .cell.lvl{width:60px}.user-grid .cell.lvl .textWithIcon__icon{margin-left:0px}.user-grid .cell.lvl .textWithIcon__text{display:none}.user-grid .button__cyberpunk{margin-top:15px;width:125px;height:50px}.user-grid .button__cyberpunk .sublable{display:none}.user-grid .button__cyberpunk svg{height:35px}}
.action-bar{display:flex;justify-content:space-between;align-items:center;gap:10px}
.window{width:100vw;height:100vh;position:fixed;left:0;top:0;z-index:5}.window.dropDown{padding:40px 0;background-color:#fff;animation-duration:1s;top:-100vh;z-index:5;transition:top .5s;overflow-y:scroll}@keyframes dropDown{0%{top:-100vh}50%{top:calc(0vh + 100px)}100%{top:0vh}}.window.dropDown.active{animation-name:dropDown;top:0}.window.dropDown .dropDown-header{display:flex;justify-content:space-between;align-items:center}.window.dropDown .dropDown-header:not(.window.dropDown .dropDown-header:has(.title)){justify-content:end}.window.dropDown .dropDown-content{margin-top:40px}.window.modal{display:flex;justify-content:center;align-items:center;transition:all .5s;background:rgba(0,0,0,0)}.window.modal .modal-container{background-color:rgba(0,0,0,0);position:relative;max-height:75%;transition:all 1.5s}.window.modal .modal-container svg{opacity:1}.window.modal .modal-container-wrapper{width:100%;height:100%;background:#fff;opacity:0}.window.modal .modal-container-header{height:50px;background:#000;display:flex;align-items:center;justify-content:space-between;padding-left:10px}.window.modal .modal-container-header-text{width:calc(100% - 50px);color:#fff;line-height:50px}.window.modal .modal-container-header .button__close svg{fill:#fff}.window.modal .modal-container-header .button__close svg path{fill:#fff}.window.modal .modal-container-content{padding:10px;max-height:500px;overflow-y:scroll}.window.modal .modal-container ::-webkit-scrollbar-thumb{transition:all 1.5s;background-color:rgba(0,0,0,.05)}.window.modal .modal-container:hover ::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.5)}.window.modal .modal-svg rect{stroke:#fff;stroke-width:3px}.window.modal.active{background:rgba(0,0,0,.5);animation:fadeIn .7s cubic-bezier(0.165, 0.84, 0.44, 1) forwards}.window.modal.active .modal-container,.window.modal.active .modal-container-wrapper{animation:modalFadeIn .9s cubic-bezier(0.165, 0.84, 0.44, 1) forwards}@keyframes fadeIn{to{background:rgba(0,0,0,.7)}}@keyframes fadeOut{to{background:rgba(0,0,0,0)}}@keyframes modalFadeIn{to{opacity:1}}@keyframes sketchIn{to{stroke-dashoffset:0px}}.window.modal .modal__confirm{display:flex;justify-content:space-between;flex-direction:column;height:100%}.window.modal .form__wrapper{justify-content:space-around}@media(max-width: 576px){.window.dropDown{padding:10px 0px}.window.dropDown .title__divider{display:none}.window.dropDown .dropDown-content{margin-top:10px}.window.modal-container{width:90%}}
.loading-mask{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);filter:drop-shadow(2px 4px 6px black);border-radius:5px;z-index:1000;overflow:hidden;display:flex;justify-content:center;align-items:center}.loading-mask.full{width:100%;height:100vh;position:fixed}.loading-mask .preloader{width:10%;display:flex;justify-content:space-between}.loading-mask .loader-dots{width:20px;height:20px;border-radius:50%;animation-fill-mode:both;animation:three-dots-loader-animation 2s infinite ease-in-out;background:#fff}.loading-mask .loader-dots:nth-child(2){animation-delay:-0.16s}.loading-mask .loader-dots:first-child{animation-delay:-0.32s}@keyframes three-dots-loader-animation{0%,80%,100%{background:#fff}40%{background:rgba(0,0,0,0)}}
.error{text-align:center}.error img{width:100%}
.search{height:50px;margin:15px 0;position:relative;display:flex;justify-content:flex-end;width:100%}.search.on{animation:in-out .7s linear}.search .filer,.search__input{width:50px;height:50px;outline:0}.search__input{font-family:"Roboto Condensed",sans-serif;box-sizing:border-box;border:4px solid #000;border-radius:50%;background:none;color:#000;font-size:16px;font-weight:400;transition:width .4s ease-in-out,border-radius .8s ease-in-out,padding .2s;transition-delay:.4s}.search .search_btn{background:none;position:absolute;width:50px;height:50px;top:0px;right:0;padding:0;border-radius:100%;border:0;color:inherit;cursor:pointer;transition:.2s ease-in-out}.search .search_btn:before{content:"";position:absolute;width:20px;height:4px;background-color:#000;transition:.2s ease-in-out;top:100%;transform:translateX(12px) rotate(45deg)}.search .close{transition:.4s ease-in-out;transition-delay:.4s}.search .close:before,.search .close:after{content:"";position:absolute;width:27px;height:4px;background-color:#000;top:50%;left:50%;cursor:pointer}.search .close:before{transform:translate(-50%, -50%) rotate(45deg);transition:.2s ease-in-out}.search .close:after{transform:translate(-50%, -50%) rotate(-45deg)}.search .square{box-sizing:border-box;padding:0 40px 0 10px;width:100%;height:50px;border:4px solid #000;border-radius:0;background:none;color:#000;font-size:16px;font-weight:400;outline:0;transition:width .4s ease-in-out,border-radius .4s ease-in-out,padding .2s;transition-delay:.4s,0s,.4s}
.leader-flag{height:40px;position:relative;animation:pulse 2s ease-in-out infinite}.leader-flag svg{padding:2px 8px;width:40px;height:34px}.leader-flag:after,.leader-flag:before{content:"";background-color:inherit;bottom:1px;display:block;position:absolute;transition:border-bottom-color .2s ease-in-out}.leader-flag:after{left:0;border-top:solid 6px;border-color:inherit;border-right:solid 20px rgba(0,0,0,0)}.leader-flag:before{right:0;border-top:solid 6px;border-color:inherit;border-left:solid 20px rgba(0,0,0,0)}@keyframes pulse{from{scale:1}50%{scale:1.07}to{scale:1}}
.teamflag{position:relative;width:100px;filter:grayscale(0.5)}.teamflag.active,.teamflag:hover{filter:unset;scale:1.025;cursor:pointer}.teamflag>svg{width:100%;height:100%}.teamflag .thumbnail{position:absolute;top:5px;left:50%;translate:-50%;width:91px;height:59px}.teamflag .thumbnail svg{width:100%;height:100%}
.glitch{--clip: polygon(0 0, 100% 0, 100% 100%, 0 100%);--clip-one: polygon(0px 44%, 100% 44%, 100% 54%, 0% 54%);--clip-two: polygon(0 78%, 100% 78%, 100% 100%, 0% 100%);--clip-three: polygon(0 44%, 100% 44%, 100% 54%, 0 54%);--clip-four: polygon(0 0, 100% 0, 100% 0, 0 0);--clip-five: polygon(0 0, 100% 0, 100% 0, 0 0);--clip-six: polygon(0 20%, 100% 20%, 100% 45%, 0 45%);--clip-seven: polygon(0 63%, 100% 63%, 100% 80%, 0 80%);--shimmy-distance: 5;position:relative}.glitch__animation{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;clip-path:var(--clip);filter:invert(0.25);animation:glitch 4s infinite;visibility:hidden}.glitch:hover .glitch__animation{visibility:visible;animation:glitch 2s infinite}.glitch.active .glitch__animation{visibility:visible}@keyframes glitch{0%{clip-path:var(--clip-one)}2%,8%{clip-path:var(--clip-two);transform:translate(calc(var(--shimmy-distance) * -1%), 0)}6%{clip-path:var(--clip-two);transform:translate(calc(var(--shimmy-distance) * 1%), 0)}9%{clip-path:var(--clip-two);transform:translate(0, 0)}10%{clip-path:var(--clip-three);transform:translate(calc(var(--shimmy-distance) * 1%), 0)}13%{clip-path:var(--clip-three);transform:translate(0, 0)}14%,21%{clip-path:var(--clip-four);transform:translate(calc(var(--shimmy-distance) * 1%), 0)}25%{clip-path:var(--clip-five);transform:translate(calc(var(--shimmy-distance) * 1%), 0)}30%{clip-path:var(--clip-five);transform:translate(calc(var(--shimmy-distance) * -1%), 0)}35%,45%{clip-path:var(--clip-six);transform:translate(calc(var(--shimmy-distance) * -1%))}40%{clip-path:var(--clip-six);transform:translate(calc(var(--shimmy-distance) * 1%))}50%{clip-path:var(--clip-six);transform:translate(0, 0)}55%{clip-path:var(--clip-seven);transform:translate(calc(var(--shimmy-distance) * 1%), 0)}60%{clip-path:var(--clip-seven);transform:translate(0, 0)}100%,31%,61%{clip-path:var(--clip-four)}}
.profile{--profile-witdh: 40%;position:fixed;top:0;width:var(--profile-witdh);right:calc(-1*var(--profile-witdh));height:100vh;border-left:1px solid #000;background-color:#fff;transition:all .5s;z-index:3;overflow:auto}.profile.active{right:0}.profile__header{height:176px;width:100%;background-color:#000;display:flex;justify-content:center;align-items:flex-end;position:relative}.profile__header-img{width:225px;height:225px;border:5px solid #fff;border-radius:50%;transform:translateY(50%);background:#fff;object-fit:cover}.profile__header-img img{animation:spin 1.7s linear}.profile__header-img svg,.profile__header-img img{width:100%;height:100%;border-radius:50%}.profile__header-img svg path{stroke:#000;animation:anim-svg-line 2s ease forwards}.profile__header-img svg path:nth-child(1){stroke-dasharray:94px;stroke-dashoffset:94px}.profile__header-img svg path:nth-child(2){stroke-dasharray:91px;stroke-dashoffset:91px}.profile__header-img svg path:nth-child(3){stroke-dasharray:307px;stroke-dashoffset:307px}.profile__header-img svg path:nth-child(4){stroke-dasharray:619px;stroke-dashoffset:619px;animation:anim-svg-line 2s ease forwards .9s}.profile__header-img svg path:nth-child(5){stroke-dasharray:649px;stroke-dashoffset:649px}.profile__header-img svg path:nth-child(6){stroke-dasharray:444px;stroke-dashoffset:444px}.profile__header-img svg path:nth-child(7){stroke-dasharray:575px;stroke-dashoffset:575px}.profile__header-img svg path:nth-child(8){stroke-dasharray:1410px;stroke-dashoffset:1410px;animation:anim-svg-line 2s ease forwards 1s}@keyframes anim-svg-line{to{stroke-dashoffset:0px}}.profile__header-close.btn-close{position:absolute;right:10px;top:10px;width:40px;height:40px;color:#fff}.profile__header-close.btn-close svg{fill:#fff}.profile__content{min-height:380px;margin:125px auto 0;text-align:center}.profile__content-name,.profile__content-achievements-title{font-weight:800;font-size:24px;min-height:31px;line-height:30px}.profile__content-nickname{color:#3d405b;font-size:16px;font-weight:normal;font-size:16px}.profile__content-lvl-rank{display:flex;justify-content:center;align-items:center;margin-top:5px}.profile__content-lvl-circle{margin:20px auto 0;min-height:150px;min-width:240px;position:relative}.profile__edit-btn{position:absolute;right:15px;bottom:15px}.profile__edit .field{height:35px}.profile__edit .field.img{width:100%;height:100%}.profile__edit .field.img .field__wrapper{border-radius:50%}.profile__edit .field.img .field__placeholder{width:70%;height:70%;top:50%;left:50%;transform:translate(-50%, -50%)}.profile__edit .field.img .img__thumbnail{width:100%;height:100%}.profile__edit .field.img .field__error{text-align:center;width:100%}.profile__edit .profile__content{border:1px dashed #000;width:50%;display:flex;flex-direction:column;gap:20px;min-height:100px;padding:15px;align-items:center}.profile__edit .profile__content .field{width:100%}.profile__edit-btns{display:flex;justify-content:space-between;align-items:center;width:100%}@keyframes spin{0%{opacity:0}100%{opacity:1;transform:rotate(360deg)}}.overflow{--profile-witdh: 40%;width:100%;height:100vh;background-color:rgba(0,0,0,.5);position:fixed;top:0;left:-100%;transition:all .5s}.overflow.active{left:calc(-1*var(--profile-witdh))}.achievements__bar{--achievement-size: 70px;--achievement-margin-right: 15px;display:flex;justify-content:flex-start;align-items:center;width:calc(var(--achievement-size)*4 + var(--achievement-margin-right)*3);margin:0 auto}.achievements__bar-item{width:var(--achievement-size);height:var(--achievement-size);position:relative;margin-right:var(--achievement-margin-right)}.achievements__bar-item:last-child{margin-right:0}.achievements__bar-item-lastMask{position:absolute;color:#f4f1de;border-radius:50%;font-size:24px;line-height:var(--achievement-size);top:0;left:0;width:var(--achievement-size);height:var(--achievement-size);cursor:pointer;background-color:rgba(61,64,91,.9)}.achievements__bar-item-img{width:100%;height:100%;border-radius:100%;object-fit:cover}@media(max-width: 1200px){.profile,.overflow{--profile-witdh: 45%}}@media(max-width: 992px){.profile,.overflow{--profile-witdh: 50%}}@media(max-width: 768px){.profile,.overflow{--profile-witdh: 70%}}@media(max-width: 576px){.profile{--profile-witdh: 100%}.profile__header-img{width:150px;height:150px}.profile__content{margin-top:110px}.profile__content-achievements-title{font-size:18px}.profile__edit .profile__content{width:95%;padding:10px 5px}.profile__header-close.btn-close{width:30px;height:30px}.overflow{display:none}.achievements__bar{--achievement-size: 50px;--achievement-margin-right: 5px}.achievements__bar-item-lastMask{font-size:18px}}
.progressBar__circle{margin:0 auto;position:relative}.progressBar__circle-svg{width:170px;height:170px;transform:rotate(-90deg)}.progressBar__circle-svg-track,.progressBar__circle-svg-progress{cx:85px;cy:85px;r:75px;fill:rgba(0,0,0,0);stroke-width:20px}.progressBar__circle-svg-track{stroke:#ddd}.progressBar__circle-svg-progress{stroke:#07c;stroke-dasharray:471px;stroke-dashoffset:471px;stroke-linecap:butt;transition:stroke-dashoffset 2s}@keyframes anim-svg-circle{to{stroke-dashoffset:353.25px}}.progressBar__circle-text{position:absolute;text-align:center;top:50%;left:0;right:0;transform:translate3d(0, -50%, 0);font-size:25px;font-weight:500}
.action{width:100%;height:100%;display:flex;justify-content:space-between;align-items:center;position:relative}.action__checkbox,.action__btn{width:25px}.action__btn{transform:translateY(-50%);background:#ebe7e7;border-radius:50%;opacity:30%;width:30px;z-index:10;cursor:pointer}.action__btn:hover{opacity:100%}.action__children{width:100%}.menu{position:relative}.menu .menu-toggler{position:absolute;display:block;top:0;bottom:0;right:0;left:0;margin:auto;width:15px;height:15px;z-index:2;opacity:0;cursor:pointer}.menu .menu-toggler:hover+label,.menu .menu-toggler:hover+label:before,.menu .menu-toggler:hover+label:after{background:#000}.menu .menu-toggler:checked+label{background:rgba(0,0,0,0)}.menu .menu-toggler:checked+label:before,.menu .menu-toggler:checked+label:after{top:0;width:15px;transform-origin:50% 50%}.menu .menu-toggler:checked+label:before{transform:rotate(45deg)}.menu .menu-toggler:checked+label:after{transform:rotate(-45deg)}.menu .menu-toggler:checked~ul .menu-item{opacity:1}.menu .menu-toggler:checked~ul .menu-item:nth-child(1){transform:rotate(0deg) translateX(-40px)}.menu .menu-toggler:checked~ul .menu-item:nth-child(2){transform:rotate(60deg) translateX(-40px)}.menu .menu-toggler:checked~ul .menu-item:nth-child(3){transform:rotate(120deg) translateX(-40px)}.menu .menu-toggler:checked~ul .menu-item:nth-child(4){transform:rotate(180deg) translateX(-40px)}.menu .menu-toggler:checked~ul .menu-item:nth-child(5){transform:rotate(240deg) translateX(-40px)}.menu .menu-toggler:checked~ul .menu-item:nth-child(6){transform:rotate(300deg) translateX(-40px)}.menu .menu-toggler:checked~ul .menu-item span{pointer-events:auto}.menu .menu-toggler+label{width:15px;height:1.875px;display:block;z-index:1;border-radius:.9375px;background:rgba(0,0,0,.7);transition:transform .5s,top .5s;position:absolute;display:block;top:0;bottom:0;right:0;left:0;margin:auto}.menu .menu-toggler+label:before,.menu .menu-toggler+label:after{width:15px;height:1.875px;display:block;z-index:1;border-radius:.9375px;background:rgba(0,0,0,.7);transition:transform .5s,top .5s;content:"";position:absolute;left:0}.menu .menu-toggler+label:before{top:3.75px}.menu .menu-toggler+label:after{top:-3.75px}.menu .menu-item:nth-child(1) span{transform:rotate(0deg)}.menu .menu-item:nth-child(2) span{transform:rotate(-60deg)}.menu .menu-item:nth-child(3) span{transform:rotate(-120deg)}.menu .menu-item:nth-child(4) span{transform:rotate(-180deg)}.menu .menu-item:nth-child(5) span{transform:rotate(-240deg)}.menu .menu-item:nth-child(6) span{transform:rotate(-300deg)}.menu .menu-item{position:absolute;display:block;top:0;bottom:0;right:0;left:0;margin:auto;width:30px;height:30px;display:block;opacity:0;transition:.5s}.menu .menu-item a,.menu .menu-item span{display:block;width:inherit;height:inherit;line-height:30px;color:rgba(0,0,0,.9);background:rgba(0,0,0,.2);border-radius:50%;text-align:center;text-decoration:none;font-size:15px;pointer-events:none;transition:.2s;display:flex;justify-content:center;align-items:center}.menu .menu-item a svg,.menu .menu-item span svg{width:20px;height:20px;fill:rgba(0,0,0,.9)}.menu .menu-item a:hover,.menu .menu-item span:hover{box-shadow:0 0 0 .75px rgba(255,255,255,.5);color:#000;background:rgba(0,0,0,.9);font-size:16.6666666667px}.menu .menu-item a:hover svg,.menu .menu-item span:hover svg{width:20px;height:20px;fill:rgba(255,255,255,.9)}
.achievements__list{width:100%}.achievements__list>*{margin-bottom:10px}.achievements__list-header,.achievements__list .row{display:flex;justify-content:space-between;gap:15px;align-items:center}.achievements__list-header{background-color:#000;height:50px;padding:10px}.achievements__list .row{padding:0}.achievements__list .row>.action{display:none}.achievements__list .row .achievement__row{width:100%}.achievement{display:flex;justify-content:space-between;height:100px;position:relative}.achievement-img{position:relative;height:100px;width:100px}.achievement-img img{width:100%;height:100%;object-fit:cover}.achievement-content{border:1px solid #000;width:calc(100% - 100px - 25px);height:100%;display:flex;justify-content:space-between;align-items:center;position:relative;gap:30px;padding:0 5px}.achievement-descr{width:100%;height:100%;text-align:left}.achievement-title{font-weight:800;font-size:24px;min-height:31px;line-height:30px}.achievement-subtitle{font-weight:normal;font-size:16px;color:#3d405b}.achievement-cost{width:125px;text-align:center}.achievement-date{text-align:center;width:30%}.achievement.form{flex-wrap:wrap;row-gap:20px}.achievement.form .buttons{width:100%;display:flex;flex-direction:row;justify-content:space-around}.achievement.form .achievement-cost .field{width:100%}.achievement.form{min-height:120px;height:unset;margin:24px 0;border:1px dashed #000;padding:5px}.achievement.form .field.img{margin:0}.achievement.form .textarea{width:100%}.achievement.form .achievement-content{border:none}.achievement.form .achievement-content>div{display:flex;align-items:flex-start;flex-direction:column;justify-content:center;gap:18px}.achievement.form .achievement-difficulty{margin:0 auto}.achievement.form .achievement-difficulty .option .difficulty{position:relative}.achievement.form .achievement-difficulty .option .difficulty-color{position:absolute;width:10px;height:10px;top:50%;transform:translateY(-50%);right:0;border-radius:50%;background-color:red}.achievement.form .achievement-difficulty .option .difficulty-color[data-style=Platinum]{background-color:#d2e0ed}.achievement.form .achievement-difficulty .option .difficulty-color[data-style=Gold]{background-color:#ffe092}.achievement.form .achievement-difficulty .option .difficulty-color[data-style=Silver]{background-color:#b6c0d6}.achievement.form .achievement-difficulty .option .difficulty-color[data-style=Bronze]{background-color:#87704f}.achievement__difficulty{cursor:pointer;width:75px;height:75px}.achievement__difficulty.active{scale:1.2}.achievement__difficulty svg{width:100%;height:100%}.modal .achievement__mini{height:30px;display:flex;gap:10px;margin-bottom:10px}.modal .achievement__mini div{line-height:30px}.modal .achievement__mini img{width:30px;height:30px}@media(max-width: 768px){.achievement__difficulty{width:50px;height:50px}.achievement.form .field:not(.img){width:100%}.achievement.form .achievement-content{flex-wrap:wrap;align-items:start;gap:15px}.achievement.form .achievement-content div{justify-content:unset}.achievement.form .achievement-content .achievement-descr{width:calc(100% - 85px)}.achievement.form .buttons .button{justify-content:center}}@media(max-width: 576px){.achievements__list .row{gap:5px}.achievements__list .row .selection:has(+.achievement__row form){display:none}.achievement-img{width:70px;height:70px}.achievement__difficulty{width:40px;height:40px}.achievement-content{width:calc(100% - 70px - 10px);gap:0}.achievement-cost{position:absolute;width:70px;top:75px;left:-80px;right:unset;font-size:10px}.achievement-cost .coin__img{width:10px;height:10px}.achievement-descr{width:calc(100% - 25px)}.achievement-title{font-size:18px}.achievement-subtitle{font-size:12px}.achievement.form .achievement-cost{position:static}.achievement.form .achievement-descr{min-width:85px}}
.inline-text_copy--active,.inline-text_input--active{font:inherit;color:inherit;text-align:inherit;padding:0;background:none;border:none;border-bottom:1px dashed #999;outline:none}.inline-text_copy--active{cursor:pointer}.inline-text_copy--hidden,.inline-text_input--hidden{display:none}.inline-text_input--active{border-bottom:1px solid #666;text-align:left}
.group-action{display:flex;justify-content:space-around}.group-action .button{color:#fff;height:35px;border-color:#fff}.group-action .button svg,.group-action .button path{fill:#fff}
.locked .achievement img{filter:grayscale(1)}.locked .achievement *{color:gray}.divider{margin-top:50px}
.product{width:250px;min-height:400px;box-shadow:5px 5px 20px 0 rgba(0,0,0,.1);padding:20px;margin-bottom:40px;display:flex;flex-direction:column;gap:15px}.product-header{background-color:#000;height:50px;color:#fff;margin-bottom:10px;width:100%;display:flex;justify-content:space-between;align-items:center;padding:7px}.product__list{display:flex;justify-content:space-around;align-items:center;flex-wrap:wrap;gap:15px}.product-img{height:200px;width:100%}.product-img img{width:100%;height:100%;object-fit:contain}.product-name{font-weight:700;font-size:16px;text-transform:uppercase}.product-descr{font-size:14px}.product-price{display:flex}.product.form{flex-direction:column;min-height:400px;border:none}.product.form .field{width:100%}.product.form .field .img__thumbnail img{object-fit:contain}.product.form .button{margin:0 auto;height:35px}.product.form .button.cancel{margin-top:5px}.product.skeleton{margin-top:0}.product.skeleton .product-img,.product.skeleton .product-content{background:rgba(196,196,196,.3);border:none;padding:10px}.product.skeleton .product-name,.product.skeleton .product-descr,.product.skeleton .product-price{background:rgba(196,196,196,.5);border-radius:5px;height:20px}.product.skeleton .product-price{width:40%}.product .outlet{display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px dashed #000;padding:5px}@media(max-width: 576px){.product{padding:10px;gap:8px;width:160px;min-height:250px}.product-img{height:130px}.product-name{font-size:14px}.product-descr{font-size:12px}.product.form{min-height:250px;gap:15px}.product.form .img{height:130px}.product.form .button{width:100%}}
.lvl__form{margin:0 0 10px;padding:14px;border:1px dashed #000;display:flex;flex-wrap:wrap;justify-content:space-around;align-items:center}.lvl__form .fields{display:flex;align-items:center;gap:15px}.lvl__form .fields .field.img{width:50px;height:unset}.lvl__form .fields .field.img .field__wrapper{width:40px}.lvl__form .fields .field.img .field__placeholder span{display:none}.lvl__form .buttons{display:flex;align-items:center;gap:15px}@media(max-width: 576px){.lvl__form{row-gap:5px;padding:5px}.lvl__form .fields{gap:10px}.lvl__form .lvl__number{width:50px}}
.login{border-radius:8px;width:336px;height:432px;background:#fff;margin:0 auto}.login__icon svg{display:block;margin:0 auto;width:150px;height:100px}.login .form{margin-top:24px}.login .form .user-role{display:flex;justify-content:center;align-items:center;gap:16px;border-bottom:1px solid rgba(29,37,44,.2)}.login .form .user-role .button{height:40px;width:120px;border:none;transition:none}.login .form .user-role .button.active{border-bottom:2px solid #3d7dca;color:#3d7dca}.login .form .user-role .button:hover{box-shadow:none}.login .form .field{width:250px;height:40px}.login .form .field input{height:40px}.login .form .field-login{margin:32px auto 0 auto}.login .form .field-password{margin:24px auto 0 auto}.login .form>.button{width:250px;height:40px;margin:36px auto 0 auto}@media(max-width: 576px){.login{width:100%;height:100%}.login .form{margin-top:10px}.login .form .field{width:100%;height:35px}.login .form .field input{height:35px}.login .form .field-login{margin-top:20px}.login .form>.button{margin-top:25px;width:100%}.login__icon svg{display:block;margin:0 auto;width:125px;height:75px}}
.btn-close{width:50px;height:50px;transition:transform .5s;cursor:pointer}.btn-close:hover{transform:rotate(90deg)}.btn-close svg{width:100%;height:100%}*{font-family:"Roboto Condensed",sans-serif;margin:0;padding:0;box-sizing:border-box}ul,li,dl{list-style-type:none;margin:0;padding:0}h1,h2,h3,h4,h5,h6{margin:0}a{text-decoration:none;color:inherit;display:inline-block}a:hover{text-decoration:none;color:inherit}p{margin:0;padding:0}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.app{width:1100px;margin:0 auto;padding:50px 0 50px 0;position:relative}.app .bg-decoration{position:absolute;right:-174px;bottom:-70px;z-index:-1}main{margin-top:50px;position:relative}.pulse{animation:flashing 1.5s linear infinite}.container{max-width:1170px;margin:0 auto;height:100%}.title{display:flex;align-items:center}.title__text{margin-left:5px;font-size:30px;line-height:44px;font-weight:400;color:#000}.title__divider{width:100px;height:13px;display:flex;margin-right:35px;flex-direction:column;justify-content:space-between;align-items:flex-end}.title__divider .long{width:100%}.title__divider span{width:50%;height:3px;background:#000;display:block}*::-webkit-scrollbar:vertical{width:11px}*::-webkit-scrollbar:horizontal{height:11px}*::-webkit-scrollbar-thumb{border-radius:8px;border:2px solid #fff;background-color:rgba(0,0,0,.5)}*::-webkit-scrollbar-track{background-color:#fff;border-radius:8px}.pulse{animation:flashing 1.5s linear infinite}body:has(.dropDown.active,.profile.active,.modal.active){overflow-y:hidden}@keyframes flashing{0%{opacity:1}50%{opacity:.4}100%{opacity:1}}@media(max-width: 1200px){.container{width:960px}}@media(max-width: 992px){.container{width:720px}}@media(max-width: 768px){.container{width:540px}}@media(max-width: 576px){.container{width:100%;padding:0 5px}.title__text{font-size:20px;line-height:25px}}