.NOT-home-page {
    position: relative;
    background: url(/imgs/light2.png),url(/imgs/light3.png),linear-gradient(0deg,#1d0574,#830bc2);
    background-repeat: no-repeat,no-repeat,no-repeat;
    background-size: contain,contain,contain;
    background-position: top 1.87rem center,top 2.07rem center,top center;
    padding-bottom: 1.4rem
}

.NOT-home-page-not-notice {
    background-position: top 1.31rem center,top 1.51rem center,top center!important
}

.NOT-home-fixed-btn-reset {
    width: .8rem;
    height: .8rem;
    position: absolute;
    top: .8rem;
    left: .1rem;
    font-size: .3rem
}

.NOT-home-fixed-btn-settings {
    width: .8rem;
    height: .8rem;
    position: absolute;
    top: 3.3rem;
    right: .3rem;
    transform-origin: center;
    transform: rotate(10deg);
    z-index: 1
}

.NOT-home-fixed-btn-settings-not-notices {
    top: 2.74rem
}

.NOT-home-fixed-btn-reward {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    top: 2.8rem;
    left: .15rem;
    z-index: 1
}

.NOT-home-fixed-btn-reward-not-notices {
    top: 2.24rem
}

.NOT-home-icon-reward {
    background-image: url(/imgs/btn_ticket.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 1.08rem;
    height: 1.08rem;
    transform: translate(.06rem,.23rem)
}

.NOT-home-fixed-btn-ad {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    top: 2.55rem;
    right: .15rem;
    z-index: 1
}

.NOT-home-icon-ad {
    background-image: url(/imgs/btn_ad.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 1.08rem;
    height: 1.08rem;
    transform: translate(.06rem,.23rem)
}

.NOT-home-icon-diamond {
    width: .48rem;
    height: .33rem;
    background-image: url(/imgs/diamond.png);
    background-size: contain;
    background-repeat: no-repeat
}

.NOT-home-fixed-btn-earn {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    top: 2.74rem;
    right: .15rem;
    z-index: 1
}

.NOT-home-icon-earn {
    background-image: url(/imgs/btn_earn.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 1.29rem;
    height: .88rem;
    transform: translate(-.15rem,.13rem)
}

.NOT-home-fixed-btn-text {
    line-height: .24rem;
    font-weight: 700;
    font-size: .24rem;
    color: #fff;
    background: #6b1bb1;
    border-radius: .13rem;
    border: 1px solid #d9c1fd;
    padding: .06rem;
    z-index: 1;
    display: flex;
    align-items: center
}

.NOT-home-icon-earn-spin {
    width: .48rem;
    height: .33rem;
    background-image: url(/imgs/spin.png);
    background-size: contain;
    background-repeat: no-repeat
}

.NOT-home-icon-remaining-task-icon {
    background-repeat: no-repeat;
    background-size: contain;
    width: .45rem;
    height: .45rem;
    z-index: 1;
    transform: translate(.2rem,-.2rem)
}

.NOT-home-icon-remaining-task-1-icon {
    background-image: url(/imgs/remaining_task_count1.png)
}

.NOT-home-icon-remaining-task-2-icon {
    background-image: url(/imgs/remaining_task_count2.png)
}

.NOT-home-icon-remaining-task-3-icon {
    background-image: url(/imgs/remaining_task_count3.png)
}

.NOT-home-wheel-container {
    margin-top: .69rem
}

.NOT-home-btn-container {
    margin-top: .57rem;
    padding: 0 .6rem;
    display: flex;
    margin-bottom: .4rem
}

.NOT-home-draw-num-rewards {
    position: absolute;
    right: -0rem;
    color: #fff;
    bottom: -.4rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.NOT-home-draw-num-rewards img {
    width: 1.64rem;
    height: 1.18rem
}

.NOT-home-draw-num-rewards>span {
    margin-top: -.26rem;
    margin-left: .26rem;
    width: .82rem;
    background: linear-gradient(180deg,#7b18bb,#7a1cb0);
    border: .02rem solid #edc2ff;
    border-radius: .12rem;
    height: .36rem;
    min-width: .82rem;
    font-weight: 700;
    font-size: .24rem;
    line-height: .36rem;
    letter-spacing: 0px;
    color: #fff;
    text-align: center
}

.NOT-home-invite-reward {
    position: absolute;
    left: -0rem;
    color: #fff;
    bottom: -.4rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.NOT-home-invite-reward img {
    width: 1.12rem;
    height: 1.12rem
}

.NOT-home-main-btn {
    width: 4.62rem;
    height: .9rem;
    background: linear-gradient(0deg,#219cdb,#305fc2 27%,#a126fa);
    border-radius: .2rem;
    font-weight: 700;
    font-size: .36rem;
    color: #ebd6fd;
    box-shadow: inset 0 0 .1rem #ffffff80
}

.NOT-icon-main-invite {
    width: .53rem;
    height: .61rem;
    background-image: url(/imgs/main_invite.png);
    background-size: contain;
    background-repeat: no-repeat
}

.NOT-home-share-container {
    margin-top: .39rem;
    margin-bottom: .56rem
}

.NOT-gift-push-reward-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    background-color: #000c;
    display: flex;
    justify-content: center;
    align-items: center
}

.NOT-gift-push-reward-modal-content {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center
}

.NOT-gift-push-reward-modal-container {
    display: flex;
    flex-direction: column;
    align-items: center
}

.NOT-gift-push-reward-modal-header {
    width: 6.36rem;
    height: 1rem;
    background-image: url(/imgs/Congratulations.png);
    background-size: contain;
    background-repeat: no-repeat
}

.NOT-gift-push-reward-modal-reward {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    margin-top: -.4rem
}

.NOT-gift-push-reward-modal-reward-icon {
    width: 2.96rem;
    height: 2.96rem;
    transform: translateY(.9rem)
}

.NOT-gift-push-reward-modal-reward-diamond-icon {
    width: 2.56rem;
    transform: translateY(.9rem)
}

.NOT-gift-push-reward-modal-reward-bg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: -1;
    width: 4.96rem;
    height: 4.96rem;
    background-image: url(/imgs/light.png);
    background-size: contain;
    background-repeat: no-repeat
}

.NOT-gift-push-reward-modal-reward-amount {
    line-height: 1.2rem;
    font-weight: 700;
    font-size: 1.2rem;
    color: #fbd815;
    margin-top: 1.1rem
}

.NOT-gift-push-reward-modal-close-btn {
    position: absolute;
    top: -1.2rem;
    right: .3rem
}

.NOT-gift-push-reward-modal-close-icon {
    display: block;
    width: .6rem;
    height: .6rem;
    background-image: url(/imgs/btn_off.png);
    background-size: contain;
    background-repeat: no-repeat
}

.NOT-icon-ticket {
    width: .52rem;
    height: .55rem;
    background-image: url(/imgs/ticket.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-left: .16rem
}

.NOT-icon-ticket:where([dir=rtl],[dir=rtl] *) {
    margin-left: 0;
    margin-right: .16rem
}

.shop-modal {
    position: fixed;
    bottom: 0;
    top: 10vh;
    left: 0;
    right: 0;
    font-size: .24rem;
    z-index: 2
}

.shop-modal .shop-modal-container {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #fff;
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem;
    color: #000;
    font-family: Roboto
}

.shop-modal .shop-modal-container .shop-modal-close {
    position: absolute;
    right: .28rem;
    top: .48rem;
    width: .48rem;
    height: .48rem;
    background: url(/imgs/close.png?v=2) no-repeat center center / contain
}

.shop-modal .shop-modal-container .shop-modal-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 .4rem;
    max-height: 90vh;
    overflow-y: auto
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-tab {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #efeef4;
    border-radius: .16rem;
    height: .76rem;
    margin: 1.3rem 0rem .7rem;
    padding: .02rem;
    width: 100%
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-tab .shop-modal-tab-item {
    flex: 1;
    display: flex;
    align-items: center;
    gap: .06rem;
    justify-content: center
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-tab .shop-modal-tab-item img {
    width: .4rem;
    height: .4rem
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-tab .active {
    padding: .14rem 0;
    background: #fff;
    box-shadow: 0 0 .08rem -.02rem #00000040;
    border-radius: .16rem
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-logo {
    width: 1.6rem;
    height: 1.6rem;
    background: url(/imgs/shop/TON.png?v=2) no-repeat center center / contain;
    margin-bottom: .36rem;
    flex-shrink: 0
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-desc {
    font-size: .48rem;
    line-height: .64rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: .4rem
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    width: 100%;
    margin-bottom: .4rem;
    color: #8231f0;
    font-size: .48rem;
    line-height: .48rem;
    font-weight: 700
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item.shop-modal-item-active {
    background: #8231f0;
    color: #fff
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item.shop-modal-item-active .shop-modal-item-arrow {
    background: url(/imgs/shop/arrow_active.png?v=2) no-repeat center center / contain
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item {
    border: .02rem solid #8231f0;
    background: #8231f026;
    border-radius: .24rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: .3rem 0;
    position: relative
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-loading {
    width: .5rem;
    height: .5rem;
    border: .06rem solid #219cdb;
    border-top: .06rem solid #8231f0;
    border-radius: 50%;
    animation: spin 1s linear infinite
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-icon {
    width: .48rem;
    height: .48rem;
    flex-shrink: 0;
    background: url(/imgs/shop/TON.png?v=2) no-repeat center center / contain;
    margin-left: .04rem
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-icon:where([dir=rtl],[dir=rtl] *) {
    margin-left: 0;
    margin-right: .04rem
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-discount {
    position: absolute;
    right: -.01rem;
    top: -50%;
    transform: translateY(50%);
    font-size: .28rem;
    line-height: .28rem;
    color: #000;
    background: #fcff44;
    padding: .14rem;
    border-top-left-radius: .3rem;
    border-top-right-radius: .3rem;
    border-bottom-left-radius: .3rem
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-discount:after {
    position: absolute;
    right: -.01rem;
    bottom: -.16rem;
    content: "";
    width: 0;
    height: 0;
    border-top: .2rem solid transparent;
    border-bottom: .2rem solid transparent;
    border-right: .1rem solid #fcff44
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-most {
    font-weight: 700;
    font-size: .24rem;
    line-height: .44rem;
    letter-spacing: 0px;
    color: #fff;
    display: flex;
    align-items: center;
    top: -.26rem;
    left: -.02rem;
    position: absolute;
    z-index: 1
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-most .shop-modal-item-most-text {
    padding-left: .12rem;
    padding-right: .22rem;
    border: .02rem solid #8231f0;
    border-right: none;
    width: 100%;
    height: 100%;
    background: linear-gradient(270deg,#ff36ff -35.85%,#932cff 27.56%,#4cbaff)
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-most img {
    height: .48rem;
    position: absolute;
    right: -.02rem;
    top: 0rem;
    z-index: 0
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-left {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: flex-end
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-center {
    display: flex;
    align-items: center;
    justify-content: center
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-right {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: flex-start
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-arrow {
    width: .4rem;
    height: .4rem;
    flex-shrink: 0;
    background: url(/imgs/shop/arrow.png?v=2) no-repeat center center / contain;
    margin: 0 .24rem
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-ticket {
    width: .56rem;
    height: .48rem;
    flex-shrink: 0;
    background: url(/imgs/shop/ticket.png?v=2) no-repeat center center / contain;
    margin-left: .04rem
}

.shop-modal .shop-modal-container .shop-modal-content .shop-modal-list .shop-modal-item .shop-modal-item-ticket:where([dir=rtl],[dir=rtl] *) {
    margin-right: .04rem;
    margin-left: 0rem
}

.shop-modal-mask {
    position: fixed;
    background: #0009;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    z-index: 1
}

.NOT-invite-reward-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    background-color: #000c;
    display: flex;
    justify-content: center;
    align-items: center
}

.NOT-invite-reward-content {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center
}

.NOT-invite-reward-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 6.7rem;
    padding: 0 .2rem .48rem;
    background: linear-gradient(180deg,#9a35f5,#5337d2);
    border-radius: .56rem;
    text-align: center;
    color: #fff
}

.NOT-invite-reward-container .NOT-invite-reward-title {
    width: 4.62rem;
    padding: .16rem .28rem;
    font-family: Roboto;
    font-weight: 700;
    font-size: .28rem;
    color: #fff;
    line-height: .42rem;
    text-align: center;
    background-color: #ad5df6;
    border-bottom-left-radius: .28rem;
    border-bottom-right-radius: .28rem
}

.NOT-invite-reward-container .NOT-invite-reward-title .NOT-invite-num {
    font-family: Alfa Slab One;
    font-weight: 400;
    font-size: .4rem;
    color: #fbd815;
    line-height: .52rem;
    text-align: center
}

.NOT-invite-reward-container .NOT-invite-reward-list {
    margin-top: .48rem;
    position: relative;
    display: flex;
    gap: .16rem;
    width: 100%;
    height: 1.44rem;
    overflow-x: auto
}

.NOT-invite-reward-container .NOT-invite-reward-list .NOT-invite-reward-line {
    position: absolute;
    top: .38rem;
    width: 100%;
    height: .02rem;
    background-color: #000
}

.NOT-invite-reward-container .NOT-invite-reward-list .NOT-invite-reward-item {
    position: relative
}

.NOT-invite-reward-container .NOT-invite-reward-list .NOT-invite-reward-item .NOT-invite-need-num {
    display: flex;
    align-items: center;
    justify-content: center;
    width: .76rem;
    height: .76rem;
    background-color: #914aed;
    border-radius: 50%;
    font-family: Alfa Slab One;
    font-weight: 400;
    font-size: .28rem;
    line-height: .28rem
}

.NOT-invite-reward-container .NOT-invite-reward-list .NOT-invite-reward-item .NOT-invite-need-num.can-claim {
    color: #fbd815;
    background-image: linear-gradient(180deg,#fd2cfa,#5435fd);
    border: .02rem solid #ffffff
}

.NOT-invite-reward-container .NOT-invite-reward-list .NOT-invite-reward-item .NOT-invite-reward-num {
    display: flex;
    align-items: center;
    gap: .02rem;
    font-family: Roboto;
    font-weight: 700;
    font-size: .2rem;
    line-height: .4rem;
    text-align: center;
    color: #fff
}

.NOT-invite-reward-container .NOT-invite-reward-list .NOT-invite-reward-item .NOT-invite-reward-num.claimed {
    color: #ffffff80
}

.NOT-invite-reward-container .NOT-invite-reward-list .NOT-invite-reward-item .NOT-invite-reward-num.can-claim {
    color: #fbd815
}

.NOT-invite-reward-container .NOT-invite-reward-list .NOT-invite-reward-item .NOT-invite-reward-num .NOT-invite-reward-icon {
    width: .18rem;
    height: .14rem;
    background-image: url(/imgs/diamond.png);
    background-size: contain;
    background-repeat: no-repeat
}

.NOT-invite-reward-container .NOT-invite-reward-list .NOT-invite-reward-item .NOT-claimed-mask {
    position: absolute;
    top: 0;
    width: .76rem;
    height: .76rem;
    border-radius: 50%;
    background-color: #000000b2;
    background-image: url(/imgs/invite_claimed.png);
    background-size: .3531rem .26025rem;
    background-repeat: no-repeat;
    background-position: center
}

.NOT-invite-reward-container .NOT-invite-reward-btn-container {
    margin-top: .32rem
}

.NOT-invite-reward-close-btn {
    position: absolute;
    top: -.8rem;
    right: 0rem
}

.NOT-invite-reward-close-icon {
    display: block;
    width: .6rem;
    height: .6rem;
    background-image: url(/imgs/btn_off.png);
    background-size: contain;
    background-repeat: no-repeat
}