body,html{
    height:100%;
    overscroll-behavior:none
}
.wrapper{
    position:relative;
    z-index:0;
    width:100%;
    height:100%;
    overflow:hidden;
    background-color:black
}
.bar{
    position:absolute;
    z-index:10;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    width:800px;
    height:207px;
    pointer-events:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
@media (max-width: 2080px){
    .bar{
        -webkit-transform:scale(1);
        -ms-transform:scale(1);
        transform:scale(1)
    }
}
@media (max-width: 1920px){
    .bar{
        -webkit-transform:scale(.915);
        -ms-transform:scale(.915);
        transform:scale(.915)
    }
}
@media (max-width: 1760px){
    .bar{
        -webkit-transform:scale(.83);
        -ms-transform:scale(.83);
        transform:scale(.83)
    }
}
@media (max-width: 1600px){
    .bar{
        -webkit-transform:scale(.745);
        -ms-transform:scale(.745);
        transform:scale(.745)
    }
}
@media (max-width: 1440px){
    .bar{
        -webkit-transform:scale(.66);
        -ms-transform:scale(.66);
        transform:scale(.66)
    }
}
@media (max-width: 1280px){
    .bar{
        -webkit-transform:scale(.575);
        -ms-transform:scale(.575);
        transform:scale(.575)
    }
}
@media (max-width: 1120px){
    .bar{
        -webkit-transform:scale(.49);
        -ms-transform:scale(.49);
        transform:scale(.49)
    }
}
@media (max-width: 960px){
    .bar{
        -webkit-transform:scale(.405);
        -ms-transform:scale(.405);
        transform:scale(.405)
    }
}
@media (max-width: 800px){
    .bar{
        -webkit-transform:scale(.32);
        -ms-transform:scale(.32);
        transform:scale(.32)
    }
}
@media (max-width: 640px){
    .bar{
        -webkit-transform:scale(.235);
        -ms-transform:scale(.235);
        transform:scale(.235)
    }
}
@media (max-width: 480px){
    .bar{
        -webkit-transform:scale(.15);
        -ms-transform:scale(.15);
        transform:scale(.15)
    }
}
.bar_top-left{
    top:0;
    left:0;
    display:grid;
    grid-column-gap:20px;
    grid-template-columns:repeat(3, 134px);
    padding-right:152px;
    padding-bottom:54px
}
@media (max-width: 2080px){
    .bar_top-left{
        left:0px;
        top:0px
    }
}
@media (max-width: 1920px){
    .bar_top-left{
        left:-34px;
        top:-8.7975px
    }
}
@media (max-width: 1760px){
    .bar_top-left{
        left:-68px;
        top:-17.595px
    }
}
@media (max-width: 1600px){
    .bar_top-left{
        left:-102px;
        top:-26.3925px
    }
}
@media (max-width: 1440px){
    .bar_top-left{
        left:-136px;
        top:-35.19px
    }
}
@media (max-width: 1280px){
    .bar_top-left{
        left:-170px;
        top:-43.9875px
    }
}
@media (max-width: 1120px){
    .bar_top-left{
        left:-204px;
        top:-52.785px
    }
}
@media (max-width: 960px){
    .bar_top-left{
        left:-238px;
        top:-61.5825px
    }
}
@media (max-width: 800px){
    .bar_top-left{
        left:-272px;
        top:-70.38px
    }
}
@media (max-width: 640px){
    .bar_top-left{
        left:-306px;
        top:-79.1775px
    }
}
@media (max-width: 480px){
    .bar_top-left{
        left:-340px;
        top:-87.975px
    }
}
.bar_top-right{
    top:0;
    right:0;
    padding-left:152px;
    padding-bottom:54px
}
@media (max-width: 2080px){
    .bar_top-right{
        right:0px;
        top:0px
    }
}
@media (max-width: 1920px){
    .bar_top-right{
        right:-34px;
        top:-8.7975px
    }
}
@media (max-width: 1760px){
    .bar_top-right{
        right:-68px;
        top:-17.595px
    }
}
@media (max-width: 1600px){
    .bar_top-right{
        right:-102px;
        top:-26.3925px
    }
}
@media (max-width: 1440px){
    .bar_top-right{
        right:-136px;
        top:-35.19px
    }
}
@media (max-width: 1280px){
    .bar_top-right{
        right:-170px;
        top:-43.9875px
    }
}
@media (max-width: 1120px){
    .bar_top-right{
        right:-204px;
        top:-52.785px
    }
}
@media (max-width: 960px){
    .bar_top-right{
        right:-238px;
        top:-61.5825px
    }
}
@media (max-width: 800px){
    .bar_top-right{
        right:-272px;
        top:-70.38px
    }
}
@media (max-width: 640px){
    .bar_top-right{
        right:-306px;
        top:-79.1775px
    }
}
@media (max-width: 480px){
    .bar_top-right{
        right:-340px;
        top:-87.975px
    }
}
.bar_top-right .profile{
    margin-left:auto
}
.bar_bottom-left{
    bottom:0;
    left:0;
    padding-right:152px;
    padding-top:54px
}
@media (max-width: 2080px){
    .bar_bottom-left{
        left:0px;
        bottom:0px
    }
}
@media (max-width: 1920px){
    .bar_bottom-left{
        left:-34px;
        bottom:-8.7975px
    }
}
@media (max-width: 1760px){
    .bar_bottom-left{
        left:-68px;
        bottom:-17.595px
    }
}
@media (max-width: 1600px){
    .bar_bottom-left{
        left:-102px;
        bottom:-26.3925px
    }
}
@media (max-width: 1440px){
    .bar_bottom-left{
        left:-136px;
        bottom:-35.19px
    }
}
@media (max-width: 1280px){
    .bar_bottom-left{
        left:-170px;
        bottom:-43.9875px
    }
}
@media (max-width: 1120px){
    .bar_bottom-left{
        left:-204px;
        bottom:-52.785px
    }
}
@media (max-width: 960px){
    .bar_bottom-left{
        left:-238px;
        bottom:-61.5825px
    }
}
@media (max-width: 800px){
    .bar_bottom-left{
        left:-272px;
        bottom:-70.38px
    }
}
@media (max-width: 640px){
    .bar_bottom-left{
        left:-306px;
        bottom:-79.1775px
    }
}
@media (max-width: 480px){
    .bar_bottom-left{
        left:-340px;
        bottom:-87.975px
    }
}
.bar_bottom-right{
    bottom:0;
    right:0;
    padding-left:152px;
    padding-top:54px
}
@media (max-width: 2080px){
    .bar_bottom-right{
        right:0px;
        bottom:0px
    }
}
@media (max-width: 1920px){
    .bar_bottom-right{
        right:-34px;
        bottom:-8.7975px
    }
}
@media (max-width: 1760px){
    .bar_bottom-right{
        right:-68px;
        bottom:-17.595px
    }
}
@media (max-width: 1600px){
    .bar_bottom-right{
        right:-102px;
        bottom:-26.3925px
    }
}
@media (max-width: 1440px){
    .bar_bottom-right{
        right:-136px;
        bottom:-35.19px
    }
}
@media (max-width: 1280px){
    .bar_bottom-right{
        right:-170px;
        bottom:-43.9875px
    }
}
@media (max-width: 1120px){
    .bar_bottom-right{
        right:-204px;
        bottom:-52.785px
    }
}
@media (max-width: 960px){
    .bar_bottom-right{
        right:-238px;
        bottom:-61.5825px
    }
}
@media (max-width: 800px){
    .bar_bottom-right{
        right:-272px;
        bottom:-70.38px
    }
}
@media (max-width: 640px){
    .bar_bottom-right{
        right:-306px;
        bottom:-79.1775px
    }
}
@media (max-width: 480px){
    .bar_bottom-right{
        right:-340px;
        bottom:-87.975px
    }
}
.bar_bottom-right .coins{
    margin-left:auto
}
.bar__background-image{
    position:absolute;
    top:0;
    left:0;
    z-index:-10;
    width:100%;
    -o-object-fit:cover;
    object-fit:cover;
    -o-object-position:center;
    object-position:center
}
.bar__background-image_top-left{
    -webkit-transform:none;
    -ms-transform:none;
    transform:none;
    height:135px
}
.bar__background-image_top-right{
    -webkit-transform:scaleX(-1);
    -ms-transform:scaleX(-1);
    transform:scaleX(-1);
    height:135px
}
.bar__background-image_bottom-left{
    -webkit-transform:scaleY(-1);
    -ms-transform:scaleY(-1);
    transform:scaleY(-1);
    height:200px
}
.bar__background-image_bottom-right{
    -webkit-transform:scale(-1);
    -ms-transform:scale(-1);
    transform:scale(-1);
    height:200px
}
.bar__background-decoration{
    position:absolute;
    z-index:0;
    width:100%;
    height:calc(100% - 54px);
    -o-object-fit:contain;
    object-fit:contain;
    -o-object-position:left;
    object-position:left
}
.bar__background-decoration_bottom-left{
    top:54px;
    left:0;
    -webkit-transform:none;
    -ms-transform:none;
    transform:none
}
.bar__background-decoration_bottom-right{
    top:54px;
    right:0;
    -webkit-transform:scaleX(-1);
    -ms-transform:scaleX(-1);
    transform:scaleX(-1)
}
.bar .button{
    pointer-events:initial
}
.panel{
    position:absolute;
    bottom:0;
    left:calc(50% - 547px);
    z-index:10;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    width:1094px;
    height:190px;
    padding:50px 265px 52px;
    -webkit-transition:height 0.2s;
    -o-transition:height 0.2s;
    transition:height 0.2s;
    pointer-events:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
@media (max-width: 2080px){
    .panel{
        -webkit-transform:scale(1);
        -ms-transform:scale(1);
        transform:scale(1)
    }
}
@media (max-width: 1920px){
    .panel{
        -webkit-transform:scale(.915);
        -ms-transform:scale(.915);
        transform:scale(.915)
    }
}
@media (max-width: 1760px){
    .panel{
        -webkit-transform:scale(.83);
        -ms-transform:scale(.83);
        transform:scale(.83)
    }
}
@media (max-width: 1600px){
    .panel{
        -webkit-transform:scale(.745);
        -ms-transform:scale(.745);
        transform:scale(.745)
    }
}
@media (max-width: 1440px){
    .panel{
        -webkit-transform:scale(.66);
        -ms-transform:scale(.66);
        transform:scale(.66)
    }
}
@media (max-width: 1280px){
    .panel{
        -webkit-transform:scale(.575);
        -ms-transform:scale(.575);
        transform:scale(.575)
    }
}
@media (max-width: 1120px){
    .panel{
        -webkit-transform:scale(.49);
        -ms-transform:scale(.49);
        transform:scale(.49)
    }
}
@media (max-width: 960px){
    .panel{
        -webkit-transform:scale(.405);
        -ms-transform:scale(.405);
        transform:scale(.405)
    }
}
@media (max-width: 800px){
    .panel{
        -webkit-transform:scale(.32);
        -ms-transform:scale(.32);
        transform:scale(.32)
    }
}
@media (max-width: 640px){
    .panel{
        -webkit-transform:scale(.235);
        -ms-transform:scale(.235);
        transform:scale(.235)
    }
}
@media (max-width: 480px){
    .panel{
        -webkit-transform:scale(.15);
        -ms-transform:scale(.15);
        transform:scale(.15)
    }
}
@media (max-width: 2080px){
    .panel{
        bottom:0px
    }
}
@media (max-width: 1920px){
    .panel{
        bottom:-8.075px
    }
}
@media (max-width: 1760px){
    .panel{
        bottom:-16.15px
    }
}
@media (max-width: 1600px){
    .panel{
        bottom:-24.225px
    }
}
@media (max-width: 1440px){
    .panel{
        bottom:-32.3px
    }
}
@media (max-width: 1280px){
    .panel{
        bottom:-40.375px
    }
}
@media (max-width: 1120px){
    .panel{
        bottom:-48.45px
    }
}
@media (max-width: 960px){
    .panel{
        bottom:-56.525px
    }
}
@media (max-width: 800px){
    .panel{
        bottom:-64.6px
    }
}
@media (max-width: 640px){
    .panel{
        bottom:-72.675px
    }
}
@media (max-width: 480px){
    .panel{
        bottom:-80.75px
    }
}
.panel__background-image{
    position:absolute;
    top:0;
    left:0;
    z-index:-10;
    width:100%;
    height:190px;
    -o-object-fit:cover;
    object-fit:cover;
    -o-object-position:left;
    object-position:left
}
.panel__active-game{
    height:150px
}
.panel__text{
    position:relative;
    z-index:0;
    margin:auto;
    font-weight:600;
    font-size:32px;
    line-height:56px;
    color:#bcfffa;
    text-transform:uppercase;
    text-shadow:0 0 8px #bcfffa
}
.game-bar{
    position:absolute;
    right:0;
    top:calc(50% - 257px);
    z-index:10;
    width:343px;
    height:514px;
    pointer-events:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
@media (max-width: 2080px){
    .game-bar{
        -webkit-transform:scale(1);
        -ms-transform:scale(1);
        transform:scale(1)
    }
}
@media (max-width: 1920px){
    .game-bar{
        -webkit-transform:scale(.915);
        -ms-transform:scale(.915);
        transform:scale(.915)
    }
}
@media (max-width: 1760px){
    .game-bar{
        -webkit-transform:scale(.83);
        -ms-transform:scale(.83);
        transform:scale(.83)
    }
}
@media (max-width: 1600px){
    .game-bar{
        -webkit-transform:scale(.745);
        -ms-transform:scale(.745);
        transform:scale(.745)
    }
}
@media (max-width: 1440px){
    .game-bar{
        -webkit-transform:scale(.66);
        -ms-transform:scale(.66);
        transform:scale(.66)
    }
}
@media (max-width: 1280px){
    .game-bar{
        -webkit-transform:scale(.575);
        -ms-transform:scale(.575);
        transform:scale(.575)
    }
}
@media (max-width: 1120px){
    .game-bar{
        -webkit-transform:scale(.49);
        -ms-transform:scale(.49);
        transform:scale(.49)
    }
}
@media (max-width: 960px){
    .game-bar{
        -webkit-transform:scale(.405);
        -ms-transform:scale(.405);
        transform:scale(.405)
    }
}
@media (max-width: 800px){
    .game-bar{
        -webkit-transform:scale(.32);
        -ms-transform:scale(.32);
        transform:scale(.32)
    }
}
@media (max-width: 640px){
    .game-bar{
        -webkit-transform:scale(.235);
        -ms-transform:scale(.235);
        transform:scale(.235)
    }
}
@media (max-width: 480px){
    .game-bar{
        -webkit-transform:scale(.15);
        -ms-transform:scale(.15);
        transform:scale(.15)
    }
}
@media (max-width: 2080px){
    .game-bar{
        right:0px
    }
}
@media (max-width: 1920px){
    .game-bar{
        right:-14.5775px
    }
}
@media (max-width: 1760px){
    .game-bar{
        right:-29.155px
    }
}
@media (max-width: 1600px){
    .game-bar{
        right:-43.7325px
    }
}
@media (max-width: 1440px){
    .game-bar{
        right:-58.31px
    }
}
@media (max-width: 1280px){
    .game-bar{
        right:-72.8875px
    }
}
@media (max-width: 1120px){
    .game-bar{
        right:-87.465px
    }
}
@media (max-width: 960px){
    .game-bar{
        right:-102.0425px
    }
}
@media (max-width: 800px){
    .game-bar{
        right:-116.62px
    }
}
@media (max-width: 640px){
    .game-bar{
        right:-131.1975px
    }
}
@media (max-width: 480px){
    .game-bar{
        right:-145.775px
    }
}
.game-bar__background-image{
    position:absolute;
    top:0;
    left:0;
    z-index:-10;
    width:100%;
    height:100%;
    -o-object-fit:cover;
    object-fit:cover;
    -o-object-position:center;
    object-position:center
}
.game-bar__info{
    position:absolute;
    right:20px;
    top:60px;
    z-index:0;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
    row-gap:10px;
    width:160px;
    pointer-events:initial;
    cursor:pointer
}
.game-bar__icon{
    width:49px;
    height:70px;
    margin-inline:auto;
    fill:#56ddff
}
.game-bar__text-value{
    display:block;
    font-weight:700;
    font-size:28px;
    line-height:30px;
    color:#56ddff;
    text-align:center
}
.game-bar__text-currency{
    display:block;
    font-weight:900;
    font-size:20px;
    line-height:30px;
    color:#56ddff;
    text-align:center
}
.game-bar__button{
    position:absolute;
    bottom:44px;
    right:6px;
    z-index:0;
    display:block;
    width:282px;
    height:252px;
    background-repeat:no-repeat;
    background-position:center;
    -webkit-background-size:cover;
    background-size:cover;
    font-weight:600;
    font-size:44px;
    line-height:48px;
    color:#ffffff;
    pointer-events:initial;
    cursor:pointer;
    -webkit-transition:background-image 0.15s ease;
    -o-transition:background-image 0.15s ease;
    transition:background-image 0.15s ease
}
.game-bar__button__default{
    background-image:url("../images/gui/game-bar-button-background.webp")
}
.game-bar__button__default:hover{
    background-image:url("../images/gui/game-bar-button-hover-background.webp")
}
.game-bar__button__disabled{
    background-image:url("../images/gui/game-bar-button-disabled-background.webp")
}
.button{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    width:184px;
    height:120px;
    padding:20px 25px 39px;
    background-image:url("../images/gui/button-background.webp");
    background-repeat:no-repeat;
    background-position:center;
    -webkit-background-size:cover;
    background-size:cover;
    cursor:pointer;
    -webkit-transition:background-image 0.15s ease;
    -o-transition:background-image 0.15s ease;
    transition:background-image 0.15s ease
}
.button:hover{
    background-image:url("../images/gui/button-hover-background.webp")
}
.button__icon{
    width:48px;
    height:48px;
    margin:auto;
    fill:#ace8ff
}
.bet{
    position:fixed;
    top:0;
    left:0;
    z-index:30;
    display:none;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    width:100%;
    height:100%;
    pointer-events:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.bet_display{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex
}
.bet::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    z-index:0;
    width:100%;
    height:100%;
    background:rgba(25,29,30,0.8)
}
.bet__content{
    position:relative;
    z-index:10;
    width:1406px;
    height:466px;
    margin-bottom:76px;
    padding:80px 140px 0;
    background-image:url("../images/gui/bet-background.webp");
    pointer-events:initial
}
@media screen and (max-width: 960px){
    .bet__content{
        height:380px;
        width:1000px
    }
}
.bet__text{
    font-weight:600;
    font-size:62px;
    line-height:100%;
    color:#ffffff;
    text-align:center
}
@media screen and (max-width: 960px){
    .bet__text{
        font-size:40px
    }
}
.bet__text:not(:last-child){
    margin-bottom:50px
}
@media screen and (max-width: 960px){
    .bet__text:not(:last-child){
        margin-bottom:20px
    }
}
@media screen and (max-height: 360px){
    .bet__text:not(:last-child){
        margin-top:10px;
        margin-bottom:0
    }
}
.bet__selector{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-column-gap:20px;
    -moz-column-gap:20px;
    column-gap:20px
}
.bet__selector:not(:last-child){
    margin-bottom:50px
}
@media screen and (max-height: 360px){
    .bet__selector:not(:last-child){
        margin-bottom:10px
    }
}
.bet__selector-button{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    width:230px;
    height:150px;
    background-repeat:no-repeat;
    background-position:center;
    -webkit-background-size:contain;
    background-size:contain;
    cursor:pointer
}
.bet__selector-button_decrement{
    padding-left:40px;
    background-image:url("../images/gui/button-3-background.webp")
}
.bet__selector-button_decrement .bet__selector-icon{
    -webkit-transform:scaleX(-1);
    -ms-transform:scaleX(-1);
    transform:scaleX(-1)
}
.bet__selector-button_increment{
    padding-right:40px;
    background-image:url("../images/gui/button-4-background.webp")
}
.bet__selector-icon{
    width:68px;
    height:44px;
    margin:auto;
    fill:#ffffff
}
.bet__selector-value{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    width:420px;
    height:150px;
    -webkit-border-radius:20px;
    border-radius:20px;
    background-color:#181c1d;
    font-weight:700;
    font-size:86px;
    line-height:100%;
    color:#ffffff;
    text-align:center
}
@media screen and (max-width: 960px){
    .bet__selector-value{
        font-size:40px;
        height:130px
    }
}
.bet__button{
    display:block;
    width:470px;
    height:150px;
    margin-inline:auto;
    background-image:url("../images/gui/button-2-background.webp");
    background-repeat:no-repeat;
    background-position:center;
    -webkit-background-size:cover;
    background-size:cover;
    font-weight:600;
    font-size:54px;
    line-height:100%;
    color:#ffffff;
    text-transform:uppercase;
    cursor:pointer
}
@media screen and (max-width: 960px){
    .bet__button{
        width:400px;
        height:80px;
        font-size:35px
    }
}
.profile{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-column-gap:20px;
    -moz-column-gap:20px;
    column-gap:20px;
    padding:12px 25px
}
.profile__image{
    width:115px;
    height:105px;
    margin-block:auto;
    -webkit-border-radius:50%;
    border-radius:50%
}
.profile__name{
    max-width:calc(100% - 135px);
    margin-block:auto;
    font-weight:700;
    font-size:32px;
    line-height:38px;
    color:#ffffff
}
.coins{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-column-gap:20px;
    -moz-column-gap:20px;
    column-gap:20px;
    padding:12px 25px
}
.coins__media{
    width:74px;
    height:74px;
    margin-block:auto
}
.coins__text{
    width:calc(100% - 94px);
    margin-block:auto
}
.coins__image{
    width:74px;
    height:74px
}
.coins__title{
    font-weight:700;
    font-size:24px;
    line-height:48px;
    color:#adbbc2
}
.coins__value{
    font-weight:700;
    font-size:48px;
    line-height:40px;
    color:#ffffff
}
.scene{
    position:relative;
    z-index:0;
    width:100%;
    height:100%;
    overflow:hidden
}
.scene__background-image{
    position:absolute;
    top:0;
    left:0;
    z-index:0;
    width:140%;
    pointer-events:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.loading-screen{
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    -webkit-transition:width 0.1s;
    -webkit-transition:width 1.5s;
    -o-transition:width 1.5s;
    transition:width 1.5s;
    position:absolute;
    height:100%;
    z-index:100;
    overflow:hidden;
    background:black
}
.loading-screen img{
    width:auto;
    -o-object-fit:cover;
    object-fit:cover;
    -o-object-position:center;
    object-position:center;
    height:100%;
    max-width:100%
}
.loading-screen__loaded{
    width:0;
    z-index:101;
    -webkit-animation:fade-out 1s;
    animation:fade-out 1s
}
.loading-screen__loaded img{
    max-width:100%;
    width:100%;
    min-width:100vw
}
.loading-screen__loading{
    right:0;
    width:100%
}
.loading-screen__loading img{
    position:absolute;
    width:100%
}
@media (orientation: landscape){
    .rotate-screen{
        display:none
    }
}
@media all and (orientation: portrait){
    .rotate-screen{
        background:black;
        position:absolute;
        width:100%;
        height:100%;
        z-index:15000;
        overflow:hidden
    }
    .rotate-screen .phones{
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack:center;
        -ms-flex-pack:center;
        justify-content:center;
        margin-top:30%
    }
    .rotate-screen .phone-container{
        position:relative;
        width:50px;
        height:100px;
        background-color:#333;
        -webkit-border-radius:5px;
        border-radius:5px;
        padding:5px;
        -webkit-box-sizing:border-box;
        box-sizing:border-box;
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-orient:vertical;
        -webkit-box-direction:normal;
        -ms-flex-direction:column;
        flex-direction:column;
        -webkit-box-align:center;
        -ms-flex-align:center;
        align-items:center;
        -webkit-box-pack:justify;
        -ms-flex-pack:justify;
        justify-content:space-between;
        -webkit-box-shadow:0 0 10px rgba(0,0,0,0.3);
        box-shadow:0 0 10px rgba(0,0,0,0.3);
        margin-left:10%;
        margin-right:10%
    }
    .rotate-screen .phone-container__landscape{
        -webkit-transform:rotate(90deg);
        -ms-transform:rotate(90deg);
        transform:rotate(90deg)
    }
    .rotate-screen .screen{
        -webkit-box-flex:1;
        -ms-flex:1;
        flex:1;
        width:100%;
        background-color:#fff;
        -webkit-border-radius:2.5px;
        border-radius:2.5px
    }
    .rotate-screen .line-top{
        width:150px;
        height:60px;
        z-index:-1;
        background:transparent;
        border:none;
        border-top:dashed 10px white;
        padding:40px 40px;
        -webkit-border-radius:50%;
        border-radius:50%;
        margin:10px -50px 0
    }
    .rotate-screen .hand-container{
        padding-top:32px;
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack:center;
        -ms-flex-pack:center;
        justify-content:center;
        width:100%;
        -webkit-animation:moveAnimation 2s linear infinite;
        animation:moveAnimation 2s linear infinite
    }
    .rotate-screen .hand{
        text-shadow:0 0 0 WHITE;
        color:transparent;
        font-size:50px;
        rotate:145deg;
        margin-right:30%
    }
    @-webkit-keyframes moveAnimation{
        0%{
            -webkit-transform:translateX(0);
            transform:translateX(0)
        }
        100%{
            -webkit-transform:translateX(40%);
            transform:translateX(40%)
        }
    }
    @keyframes moveAnimation{
        0%{
            -webkit-transform:translateX(0);
            transform:translateX(0)
        }
        100%{
            -webkit-transform:translateX(40%);
            transform:translateX(40%)
        }
    }
    .rotate-screen .note-container{
        margin-top:2rem;
        padding:1rem;
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack:center;
        -ms-flex-pack:center;
        justify-content:center
    }
    .rotate-screen .note-container .note{
        color:white;
        font-size:1.5rem
    }
}
.rules{
    display:none;
    background:rgba(0,0,0,0.7);
    position:fixed;
    height:100%;
    width:100%;
    padding:80px;
    top:0;
    left:0;
    z-index:30;
    color:white
}
@media screen and (max-height: 680px){
    .rules{
        padding:16px 16px 30px
    }
}
.rules__background{
    width:100%;
    height:100%;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    padding-left:15%;
    padding-right:15%;
    padding-bottom: 30px;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-background-size:100% 100%;
    background-size:100% 100%;
    background-repeat:no-repeat;
    background-position-x:center;
    background-image:url("../images/gui/rules-background.webp")
}
@media screen and (max-height: 360px){
    .rules__background{
        -webkit-background-size:cover;
        background-size:cover;
    }
}
.rules__header{
    margin-top:5%;
    text-align:center
}
@media screen and (max-height: 520px){
    .rules__header{
        margin-top:3%
    }
    .rules__header h1{
        font-size:1rem
    }
}
.rules__content{
    width:1000px;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    margin-top:10px;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column
}
.rules__text{
    margin-top:10px;
    font-size:1.6rem;
    overflow-y: scroll;
}
@media screen and (max-width: 1280px){
    .rules__text{
        font-size:1.4rem
    }
}
@media screen and (max-width: 1120px){
    .rules__text{
        font-size:1.2rem
    }
}
@media screen and (max-width: 960px){
    .rules__text{
        font-size:1rem
    }
}
.rules__text p{
    margin-top:2rem
}
@media screen and (max-height: 680px){
    .rules__text{
        font-size:0.9rem;
    }
    .rules__text p{
        margin-top:1rem
    }
}
@media screen and (max-height: 360px){
    .rules__text{
        font-size:0.75rem
    }
    .rules__text p{
        margin-top:0.3rem
    }
}
.rules_display{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex
}
.rules__ok-button{
    cursor:pointer;
    height:100px;
    position:absolute;
    width:auto;
    bottom:40px;
    -o-object-fit:cover;
    object-fit:cover;
    -o-object-position:center;
    object-position:center
}
@media screen and (max-height: 680px){
    .rules__ok-button{
        bottom:0
    }
}
@media screen and (max-height: 520px){
    .rules__ok-button{
        bottom:-20px
    }
}
.rules__ok-button img{
    max-width:100%
}
@media screen and (max-height: 520px){
    .rules__ok-button img{
        height:50px !important
    }
}
.lds-ring{
    display:inline-block;
    position:relative;
    width:80px;
    height:80px
}
.lds-ring div{
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
    display:block;
    position:absolute;
    width:64px;
    height:64px;
    margin:8px;
    border:8px solid #fff;
    -webkit-border-radius:50%;
    border-radius:50%;
    -webkit-animation:lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    animation:lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color:#fff transparent transparent transparent
}
.lds-ring div:nth-child(1){
    -webkit-animation-delay:-0.45s;
    animation-delay:-0.45s
}
.lds-ring div:nth-child(2){
    -webkit-animation-delay:-0.3s;
    animation-delay:-0.3s
}
.lds-ring div:nth-child(3){
    -webkit-animation-delay:-0.15s;
    animation-delay:-0.15s
}
@-webkit-keyframes lds-ring{
    0%{
        -webkit-transform:rotate(0deg);
        transform:rotate(0deg)
    }
    100%{
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg)
    }
}
@keyframes lds-ring{
    0%{
        -webkit-transform:rotate(0deg);
        transform:rotate(0deg)
    }
    100%{
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg)
    }
}
.field{
    position:absolute;
    top:20.3vw;
    left:51.1vw;
    -webkit-transform:skew(-63.4deg, 26.3deg);
    -ms-transform:skew(-63.4deg, 26.3deg);
    transform:skew(-63.4deg, 26.3deg);
    z-index:0;
    display:grid;
    grid-template-rows:repeat(13, 3.248vw);
    width:31.5vw;
    height:42.224vw
}
.field_select .field__row:not(.field__row_active) .field__cell::before{
    background-color:rgba(0,0,0,0.25)
}
.field__row{
    position:relative;
    z-index:0;
    display:grid;
    grid-template-columns:repeat(5, 6.3vw)
}
.field__row::before{
    content:attr(data-coefficient);
    position:absolute;
    top:0;
    left:100%;
    -webkit-transform:rotate(-90deg);
    -ms-transform:rotate(-90deg);
    transform:rotate(-90deg);
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    z-index:10;
    width:3.15vw;
    height:3.248vw;
    font-weight:700;
    font-size:1.2rem;
    line-height:100%;
    color:#abb7c1;
    pointer-events:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
@media screen and (max-width: 1440px){
    .field__row::before{
        font-size:1rem
    }
}
@media screen and (max-width: 1280px){
    .field__row::before{
        font-size:0.8rem
    }
}
@media screen and (max-width: 1120px){
    .field__row::before{
        font-size:0.6rem
    }
}
@media screen and (max-width: 800px){
    .field__row::before{
        font-size:0.4rem
    }
}
.field__row::after{
    content:'';
    position:absolute;
    top:0;
    left:100%;
    z-index:0;
    width:3.15vw;
    height:3.248vw;
    background-image:url("../images/gui/coefficient.webp");
    background-repeat:no-repeat;
    background-position:center;
    -webkit-background-size:75% 100%;
    background-size:75% 100%;
    pointer-events:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.field__row_active::after{
    background-image:url("../images/gui/coefficient-active.webp")
}
.field__row_active::before{
    color:#ffffff
}
.field__row_active .field__cell{
    cursor:pointer
}
.field__row_active .field__cell:hover::before{
    -webkit-box-shadow:inset 0 0 8px 4px #2ecef6;
    box-shadow:inset 0 0 8px 4px #2ecef6
}
.field__cell{
    position:relative;
    z-index:0;
    width:6.3vw;
    height:3.248vw;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.field__cell::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    z-index:10;
    width:100%;
    height:100%;
    -webkit-transition:background-color 0.3s ease, -webkit-box-shadow 0.3s ease;
    transition:background-color 0.3s ease, -webkit-box-shadow 0.3s ease;
    -o-transition:background-color 0.3s ease, box-shadow 0.3s ease;
    transition:background-color 0.3s ease, box-shadow 0.3s ease;
    transition:background-color 0.3s ease, box-shadow 0.3s ease, -webkit-box-shadow 0.3s ease;
    pointer-events:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.field__cell-background-image{
    width:100%;
    height:100%;
    pointer-events:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.field__cell-mine{
    position:absolute;
    top:0;
    left:25%;
    -webkit-transform:skew(63.4deg, -26.3deg) translateY(-25%);
    -ms-transform:skew(63.4deg, -26.3deg) translateY(-25%);
    transform:skew(63.4deg, -26.3deg) translateY(-25%);
    z-index:10;
    width:50%;
    height:100%;
    pointer-events:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.field__cell-money{
    position:absolute;
    top:-20%;
    left:0;
    -webkit-transform:skew(63.4deg, -26.3deg) translateY(-25%);
    -ms-transform:skew(63.4deg, -26.3deg) translateY(-25%);
    transform:skew(63.4deg, -26.3deg) translateY(-25%);
    z-index:20;
    width:50%;
    height:100%
}
.mole{
    position:absolute;
    top:62.888vw;
    left:19.698vw;
    -webkit-transform:scaleX(-1) translate(-15px, -50%);
    -ms-transform:scaleX(-1) translate(-15px, -50%);
    transform:scaleX(-1) translate(-15px, -50%);
    z-index:10;
    width:10.948vw;
    height:10.948vw;
    pointer-events:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none
}
@font-face{
    font-family:'Inter';
    font-weight:100;
    font-style:normal;
    src:url("../fonts/inter/latin/thin.woff2") format("woff2")
}
@font-face{
    font-family:'Inter';
    font-weight:200;
    font-style:normal;
    src:url("../fonts/inter/latin/extra-light.woff2") format("woff2")
}
@font-face{
    font-family:'Inter';
    font-weight:300;
    font-style:normal;
    src:url("../fonts/inter/latin/light.woff2") format("woff2")
}
@font-face{
    font-family:'Inter';
    font-weight:400;
    font-style:normal;
    src:url("../fonts/inter/latin/regular.woff2") format("woff2")
}
@font-face{
    font-family:'Inter';
    font-weight:500;
    font-style:normal;
    src:url("../fonts/inter/latin/medium.woff2") format("woff2")
}
@font-face{
    font-family:'Inter';
    font-weight:600;
    font-style:normal;
    src:url("../fonts/inter/latin/semi-bold.woff2") format("woff2")
}
@font-face{
    font-family:'Inter';
    font-weight:700;
    font-style:normal;
    src:url("../fonts/inter/latin/bold.woff2") format("woff2")
}
@font-face{
    font-family:'Inter';
    font-weight:800;
    font-style:normal;
    src:url("../fonts/inter/latin/extra-bold.woff2") format("woff2")
}
@font-face{
    font-family:'Inter';
    font-weight:900;
    font-style:normal;
    src:url("../fonts/inter/latin/black.woff2") format("woff2")
}
*{
    -webkit-box-sizing:border-box;
    box-sizing:border-box
}
body{
    margin:0;
    font-family:'Inter'
}
h1,h2,h3,h4,h5,h6,p{
    margin-block:0
}
button{
    padding:0;
    border:none;
    outline:none;
    background:none;
    font-family:'Inter'
}
img,svg{
    display:block
}
.win_popup{
    display:none;
    background:rgba(0, 0, 0, 0.7);
    position:fixed;
    height: 100%;
    width: 100%;
    padding: 10px;
    top: 0;
    left: 0;
    z-index: 30;
    color: white;
}
.win_popup_display{
    display: block;
}
.win__popup__background{
    height: 93%;
    background-size: 100vh 100%;
    background-repeat: no-repeat;
    background-position-x: center;
    background-image: url(../images/gui/win-take-mole.png);
    position: relative;
}
.win__popup__wrapper{
    display: flex;
    flex-direction: column;
    align-items: center;
    align-content: center;
    justify-content: flex-end;
    position: absolute;
    top: 57%;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center;
}
.win__popup-button{
    cursor: pointer;
    width: auto;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}

.win__popup-button img{
    height: 15vh;
}

.win__text__message{
    font-family: Inter;
    font-size: 5vh;
    font-weight: 600;
    line-height: 5vh;
    text-align: center;
}
.win__text__value{
    font-family:Inter;
    font-size:8vh;
    font-weight:800;
    line-height:8vh;
    text-align:center;
    color:#FFBB05;
    margin-top:10px;
    text-transform:uppercase;
}
.win__popup__text{
    margin-top: 10px;
}

@media (min-height: 600px){
    .win__popup__background{
        height:100%;
        background-size:650px 550px;
        background-repeat:no-repeat;
        background-position-x:center;
        background-position-y: center;
        background-image:url("../images/gui/win-take-mole.png");
        display:flex;
        flex-direction:column;
        align-items:center;
        align-content:center;
        justify-content:center;    
    }    
    .win__popup__wrapper{
        top: calc(50vh + 25px);
    }
    .win__popup-button img{
        height: 100px;
    }
    .win__text__message{
        font-size: 30px;
        line-height: 30px;
    }
    .win__text__value{
        font-size:50px;
        line-height:50px;
    }
}
