.container {
    width: 100%;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    background-color: var(--widget-bg);
    overflow-x: hidden;
}
.content {
    display: flex;
    flex-direction: column;
    position: relative;
    width: 100%;

    .topArea {
        width: 100%;
        position: relative;

        .bg {
            width: 100%;
        }

        .cashArea {
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);

            span {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                color: #ffe839;
                font-size: 1.47rem;
                font-weight: 700;
                text-align: center;
                text-wrap: nowrap;
            }
        }
    }
    .btnArea {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        margin-top: 1.1rem;
        padding: 0 3.9rem;
        .remainTip {
            position: relative;
            font-family: Roboto;
            img {
                width: 19.26rem;
            }

            .need_cash {
                position: absolute;
                top: 38%;
                left: 50%;
                transform: translate(-50%, -50%);
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 0.2rem;
                //font-size: 1rem;
                color: var(--header);
                .need_txt {
                    color: #6ddf39;
                    color: rgba(255, 197, 45, 1);
                    // font-family: "SWISSC-BT";
                }
            }
        }
        .btns {
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-top: 0.1rem;
            font-family: Roboto;

            .withdrawBtn {
                position: relative;
                span {
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    text-wrap: nowrap;
                    transform: translate(-50%, -50%);
                    color: rgba(106, 124, 116, 1);
                    font-weight: 700;
                }
            }
            .recordBtn {
                position: relative;
                span {
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    text-wrap: nowrap;
                    transform: translate(-50%, -50%);
                    color: rgba(106, 124, 116, 1);
                    font-weight: 700;
                }
            }

            .enableBtn {
                span {
                    color: rgba(148, 186, 202, 1);
                }
            }
        }
    }
    .shareBtn {
        width: 80%;
        height: 3.82rem;
        border-radius: 90px;
        box-shadow: inset 0rem 2px 4px 0rem rgba(0, 0, 0, 0.1);
        background: linear-gradient(
            180deg,
            rgba(8, 199, 115, 1) 10%,
            rgba(0, 150, 84, 1) 100%
        );
        margin: 0 auto;
        margin-top: 1.54rem;
        margin-bottom: 1.54rem;

        display: flex;
        justify-content: center;
        align-items: center;
        color: rgba(255, 255, 255, 1);

        font-family: Roboto;
        font-size: 1.18rem;
        font-weight: 700;

        img {
            width: 2.06rem;
            margin-left: -0.5rem;
        }

        .text {
            display: flex;
            justify-content: flex-start;
            align-items: flex-end;
            flex-direction: column;
            text-align: right;
            margin-left: 1.5rem;
            .line1 {
                font-size: 1.4rem;
                line-height: 1.4rem;
                font-family: Roboto;
            }
            .line2 {
                line-height: 1.18rem;
                font-size: 1.18rem;
                font-family: Roboto;
            }
        }
    }

    .tips {
        margin-top: 1.4rem;
        width: 100%;
        padding: 0 2.57rem;
        padding-right: 0;
        display: flex;
        align-items: flex-start;
        justify-content: flex-start;
        flex-direction: column;

        .item {
            display: flex;
            align-items: flex-start;
            justify-content: flex-start;
            margin-bottom: 0.88rem;
            img {
                width: 1.76rem;
                margin-right: 0.8rem;
                flex-shrink: 0;
            }

            span {
                color: rgba(255, 255, 255, 1);

                font-family: Roboto;
                font-size: 1.18rem;
                font-weight: 500;
                line-height: 1.4rem;
            }
        }
    }
}

// .cash_main_con{
//   width: 100%;
//   padding: 1rem;
// }
// .cash_main{
//   display: flex;
//   flex-direction: column;
//   padding: 1rem 1.9rem;
//   @media screen and (max-width: 360px) {
//     padding: 1rem 1rem;
//     & .have_cash{
//       & .cash_text{
//         font-size: 2rem !important;
//       }
//     }
//   }
//   align-items: center;
//   justify-content: center;
//   background-color: var(--standard);
//   border-radius: 0.8rem;
//   gap: 1rem;
//   & .have_cash{
//     display: flex;
//     align-items: center;
//     justify-content: space-between;
//     width: 100%;
//     & .cash_img{
//       width: 4rem;
//       height: auto;
//     }
//     & .cash_text{
//       font-size: 2.1rem;
//       font-family: "Roboto";
//       color: #6ddf38;
//     }
//     & .cash_btn{
//       display: flex;
//       align-items: center;
//       justify-content: center;
//       background: #efb423 linear-gradient(90deg, #49a319, #2b8b2f);
//       border-radius: .8rem;
//       padding: 0.4rem 0.7rem;
//       color: var(--header);
//       font-family: "Roboto";
//       gap: 0.25rem;
//       & .icon{
//         width: 1.2rem;
//         height: auto;
//       }
//       &:disabled{
//         opacity: .35;
//         cursor: default;
//       }
//     }
//   }
//   & .progress{
//     display: flex;
//     flex-direction: column;
//     justify-content: center;
//     align-items: flex-end;
//     width: 100%;
//     font-size: 1rem;
//     font-weight: 600;
//     color: var(--header);
//     gap: 0.25rem;
//     & .bar{
//       width: 100%;
//       height: 0.6rem;
//       background: #6ddf39;
//       border-radius: 1rem;
//       position: relative;
//       & .dot{
//         display: flex;
//         flex-direction: row;
//         justify-content: flex-end;
//         align-items: center;
//         height: 100%;
//         & .custor{
//           background: #fff;
//           border-radius: 50%;
//           width: 100%;
//           max-width: 0.6rem;
//           aspect-ratio:1;
//         }
//       }
//     }
//   }
//   & .need_cash{
//     display: flex;
//     align-items: center;
//     justify-content: center;
//     gap: 0.5rem;
//     //font-size: 1rem;
//     color: var(--header);
//     & .need_txt{
//       color: #6ddf39;
//       font-family: "SWISSC-BT";
//     }
//   }
// }
// .record_con{
//   width: 100%;
//   margin-top: -0.5rem;
//   padding: 0rem 1rem;
// }
// .record{
//   display: flex;
//   flex-direction: column;
//   gap: 0.5rem;
//   position: relative;
//   height: 18rem;
//   & .record_tab{
//     display: flex;
//     align-items: center;
//     justify-content: space-around;
//     width: 100%;
//     border-radius: var(--border-radius);
//     background-color: var(--standard);
//     button{
//       display: flex;
//       align-items: center;
//       justify-content: center;
//       color: var(--text);
//       padding: 1rem;
//       font-size: 1.1rem;
//       height: 100%;
//       width: 50%;
//       &:disabled{
//         color: var(--header);
//         font-weight: 600;
//         cursor: default;
//       }
//     }
//   }
//   & .swiper_list{
//     //display: flex;
//     //flex-direction: column;
//     //gap: 1rem;
//     //padding: 1rem;
//     width: 100%;
//     //height: 100%;
//     & .swiper_item{
//       display: flex;
//       align-items: center;
//       justify-content: space-between;
//       width: 100%;
//       height: 100%;
//       color: var(--text);
//       font-size: 1rem;
//       font-weight: 500;
//       & .name{
//         white-space: nowrap;
//         overflow: hidden;
//         text-overflow: ellipsis;
//         max-width: 8rem;
//       }
//       & .coins_con{
//         display: flex;
//         align-items: center;
//         color: #6ddf39;
//         gap: 0.5rem;
//         & .unit{
//           display: flex;
//           align-items: center;
//           justify-content: center;
//           background-color: #6ddf39;
//           width: 1.5rem;
//           height: 1.5rem;
//           border-radius: 50%;
//           font-family: "Roboto";
//           color: var(--header);
//         }
//       }
//     }
//   }
// }
// .rule_con{
//   width: 100%;
//   padding: 1rem;
// }
// .rule{
//   display: flex;
//   gap: 1rem;
//   flex-direction: column;
//   padding: 1rem;
//   color: var(--text);
//   background-color: var(--standard);
//   border-radius: var(--border-radius);
//   position: relative;
//   font-size: 1rem;
//   & .title{
//     display: flex;
//     width: 100%;
//     align-items: center;
//     justify-content: center;
//     font-size: 1.3rem;
//     font-weight: 600;
//   }
// }
// .info_box{
//   display: flex;
//   flex-direction: column;
//   gap: 1rem;
//   & .title{
//     color: var(--header);
//     font-size: 1rem;
//   }
//   & .content{
//     display: flex;
//     flex-direction: column;
//     gap: 1rem;
//     padding: 1rem;
//     border-radius: 0.8rem;
//     width: 100%;
//     background-color: var(--card-bg);
//     & .cash_con{
//       display: flex;
//       flex-direction: column;
//       align-items: center;
//       gap: 1rem;
//       & .tips{
//         font-size: 0.9rem;
//         color: #6ddf39;
//       }
//       & .cash{
//         display: flex;
//         align-items: center;
//         justify-content: center;
//         color: #fd2626;
//         font-size: 2.8rem;
//         font-weight: 700;
//         font-family: "Roboto";
//         height: 2.8rem;
//       }
//     }
//     & .step_con{
//       display: flex;
//       flex-direction: column;
//       gap: 1rem;
//       font-size: 0.9rem;
//       color: var(--header);
//       & .step_content{
//         display: flex;
//         flex-direction: column;
//         position: relative;
//         padding: 1rem;
//         background-color: rgba(0, 0, 0, 0.1);
//         border-radius: 0.8rem;
//         gap: 0.5rem;
//         & .step_item{
//           display: flex;
//           align-items: center;
//           color: #4b4f5d;
//           font-size: 0.8rem;
//           z-index: 2;
//           &:before{
//             display: flex;
//             align-items: center;
//             justify-content: center;
//             content: "";
//             width: 0.5rem;
//             height: 0.5rem;
//             border-radius: 50%;
//             background-color: #4b4f5d;
//             margin-right: 0.8rem;
//           }
//           &.active{
//             color: #6ddf39;
//             &:before{
//               content: "\e937";
//               font-size: 0.5rem;
//               text-align: center;
//               font-family: "icomoon";
//               width: 1rem;
//               height: 1rem;
//               border-radius: 50%;
//               background-color: #6ddf39;
//               margin-left: -0.25rem;
//               color:#fff;
//             }
//           }
//         }
//         &:after{
//           content: "";
//           position: absolute;
//           border-left: 0.08rem dotted #3cc517;
//           top: 1.6rem;
//           bottom: 1.6rem;
//           left: 1.2rem;
//         }
//       }
//     }
//     & .invite_btn{
//       width: 100%;
//       padding: 0.6rem;
//       border-radius: var(--border-radius);
//       color: var(--header);
//       font-size: 1.2rem;
//       font-weight: 600;
//       background: rgb(109, 223, 57);
//     }
//   }
// }
.header {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    background: var(--widget);
    border-bottom: 1px solid var(--border);
    box-shadow: var(--widget-shadow);
    position: relative;
    height: 3.75rem;
    padding: 0px 10px;
    & .top {
        display: flex;
        align-items: center;
        position: absolute;
        justify-content: space-between;
        left: 10px;
        right: 10px;
        & .left {
            display: flex;
            align-items: center;
            gap: 0.25rem;
            & .close {
                display: flex;
                align-items: center;
                height: 3.75rem;
                width: 2rem;
                & .arrow {
                    width: 1.4rem;
                    height: 1.8em;
                    transform: rotate(-180deg);
                    fill: var(--text);
                }
            }
            & .user {
                display: flex;
                align-items: flex-start;
                flex-direction: column;
                justify-content: center;
                & .uid {
                    color: var(--text);
                    font-weight: 600;
                }
                & .gold_con {
                    display: flex;
                    align-items: center;
                    gap: 0.25rem;
                    & .icon_golds {
                        width: 1rem;
                        height: 1rem;
                    }
                    & .golds {
                        font-size: 0.875rem;
                        font-weight: 600;
                        color: #edc349;
                    }
                }
            }
        }
        & .right {
            display: flex;
            align-items: center;
            & .right_btn {
                display: flex;
                align-items: center;
                justify-content: center;
                height: 2.5rem;
                width: 2.5rem;
                & .icon {
                    width: 1.4rem;
                    height: 1.4rem;
                    fill: var(--text);
                }
            }
        }
    }
    & .hcontent {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 1;
        font-size: 1rem;
        font-weight: 600;
        color: var(--header);
    }
}

.marquee_con {
    /* 矩形 76 */
    margin: 0 auto;
    width: 21.1rem;
    height: 3.16rem;
    background: linear-gradient(
        270deg,
        rgba(42, 50, 57, 0),
        rgba(42, 50, 57, 1) 30%,
        rgba(42, 50, 57, 1) 74%,
        rgba(42, 50, 57, 0) 100%
    );
}

// /* Swiper容器必须设置高度 */
// .swiper_list_single {
//     height: 100% !important;
//     overflow: hidden;
// }

.marquee_item {
    width: 100%;
    height: 100%;
    text-align: center;
    line-height: 3.16rem;
    display: flex;
    justify-content: center;
    align-items: center;
    .avatar {
        width: 1.4rem;
        height: 1.4rem;
        background: rgba(196, 196, 196, 1);
        border-radius: 50%;
    }

    .phone {
        color: rgba(127, 140, 151, 1);

        font-family: Roboto;
        font-size: 1.03rem;
        font-weight: 500;
        margin-left: 0.36rem;
        line-height: 3.16rem;
    }

    .tip {
        color: rgba(255, 197, 45, 1);

        font-family: Roboto;
        font-size: 1.03rem;
        font-weight: 500;
        margin-left: 1.76rem;
        line-height: 3.16rem;
    }
}

// /* 确保Swiper Slide有高度 */
// .swiper-slide {
//     height: 100% !important;
// }
