.task-product-wrap[data-v-97b0b20d] {
    opacity: 1;
    border-radius: var(--card-radius);
    background: var(--bg);
    border: 2px solid rgb(255, 255, 255);
    box-sizing: border-box;
    overflow: hidden
}

:root,
:host {
    --van-progress-height: 4px;
    --van-progress-color: var(--van-primary-color);
    --van-progress-inactive-color: var(--van-gray-5);
    --van-progress-background: var(--van-gray-3);
    --van-progress-pivot-padding: 0 5px;
    --van-progress-pivot-text-color: var(--van-white);
    --van-progress-pivot-font-size: var(--van-font-size-xs);
    --van-progress-pivot-line-height: 1.6;
    --van-progress-pivot-background: var(--van-primary-color)
}

.van-progress {
    position: relative;
    height: var(--van-progress-height);
    background: var(--van-progress-background);
    border-radius: var(--van-progress-height)
}

.van-progress__portion {
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--van-progress-color);
    border-radius: inherit;
    transform-origin: 0;
    transition: all var(--van-duration-base) var(--van-ease-out)
}

.van-progress__portion--inactive {
    background: var(--van-progress-inactive-color)
}

.van-progress__pivot {
    position: absolute;
    top: 50%;
    box-sizing: border-box;
    min-width: 3.6em;
    padding: var(--van-progress-pivot-padding);
    color: var(--van-progress-pivot-text-color);
    font-size: var(--van-progress-pivot-font-size);
    line-height: var(--van-progress-pivot-line-height);
    text-align: center;
    word-break: keep-all;
    background: var(--van-progress-pivot-background);
    border-radius: 1em;
    transition: all var(--van-duration-base) var(--van-ease-out)
}

.van-progress__pivot--inactive {
    background: var(--van-progress-inactive-color)
}

.vip-info-wrap .vip-log[data-v-9b653dd2] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: calc(100% + var(--mg) * 2);
    height: 40px;
    background: var(--bg-weight);
    margin: 0 calc(0px - var(--mg)) var(--mg);
    padding: 0 var(--mg)
}

.vip-info-wrap .vip-wrap .container-card[data-v-9b653dd2] {
    margin-bottom: var(--mg)
}

.vip-info-wrap .vip-wrap .container-card[data-v-9b653dd2]:last-child {
    margin-bottom: 0
}

.vip-info-wrap .vip-wrap .level-name[data-v-9b653dd2] {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    padding: 2px 15px;
    background-image: linear-gradient(to top, #e6b980 0%, #eacda3 100%);
    color: var(--text-black);
    border-radius: var(--card-radius) 0
}

.vip-info-wrap .vip-wrap .level-name .icon[data-v-9b653dd2] {
    margin-right: 2px
}

.vip-info-wrap .vip-wrap .current-status-box[data-v-9b653dd2] {
    position: absolute;
    top: 0;
    right: 0;
    padding: 3px 15px;
    display: flex;
    align-items: center;
    background: linear-gradient(to bottom, #323232 0%, #3f3f3f 40%, #1c1c1c 150%), linear-gradient(to top, rgba(255, 255, 255, .4) 0%, rgba(0, 0, 0, .25) 200%);
    background-blend-mode: multiply;
    border-radius: 0 10px;
    color: var(--text-white)
}

.vip-info-wrap .vip-wrap .current-status-box .icon[data-v-9b653dd2] {
    margin-right: 5px
}

.vip-info-wrap .vip-wrap .level-info[data-v-9b653dd2] {
    display: flex;
    align-items: center
}

.vip-info-wrap .vip-wrap .level-info .left[data-v-9b653dd2] {
    flex-shrink: 0
}

.vip-info-wrap .vip-wrap .level-info .left .vip-img[data-v-9b653dd2] {
    width: 60px;
    height: 60px;
    margin-left: 10px
}

.vip-info-wrap .vip-wrap .level-info .right[data-v-9b653dd2] {
    margin-left: 10px;
    flex: 1;
    max-width: calc(100% - 110px)
}

.vip-info-wrap .vip-wrap .level-info .right .item[data-v-9b653dd2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 0;
    font-size: 13px
}

.vip-info-wrap .vip-wrap .level-info .right .item .title[data-v-9b653dd2] {
    line-height: 15px;
    color: var(--text-gray6)
}

.vip-info-wrap .vip-wrap .level-info .right .item .value[data-v-9b653dd2] {
    max-width: 100%;
    flex-shrink: 0
}

.vip-info-wrap .vip-wrap .level-info .right .item .value .strong[data-v-9b653dd2] {
    font-size: 14px
}

.vip-info-wrap .vip-wrap .level-info .right .item .value .unit[data-v-9b653dd2] {
    font-size: 12px;
    color: var(--text-gray6)
}

.vip-info-wrap .vip-wrap .active-level[data-v-9b653dd2] {
    margin-top: 5px;
    display: flex;
    justify-content: flex-end
}

.vip-info-wrap .vip-wrap .active-level .active-btn[data-v-9b653dd2] {
    position: relative;
    font-size: 13px;
    background: var(--btn-bg3);
    padding: 5px 16px;
    border-radius: var(--btn-radius);
    cursor: pointer;
    overflow: hidden
}

.vip-info-wrap .vip-wrap .active-level .active-btn span[data-v-9b653dd2] {
    position: relative;
    z-index: 1
}

.vip-info-wrap .vip-wrap .active-level .active-btn[data-v-9b653dd2]:before {
    content: "";
    position: absolute;
    display: inline-block;
    top: -180px;
    left: -50px;
    width: 30px;
    height: 100%;
    background-color: #fff
}

@keyframes shiny-btn1-9b653dd2 {
    0% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0
    }
    80% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: .5
    }
    81% {
        -webkit-transform: scale(4) rotate(45deg);
        opacity: 1
    }
    to {
        -webkit-transform: scale(50) rotate(45deg);
        opacity: 0
    }
}

.vip-info-wrap .vip-wrap .effect-time[data-v-9b653dd2] {
    margin-top: 4px;
    font-size: 13px;
    line-height: 14px;
    display: flex;
    align-items: center
}

.vip-info-wrap .vip-wrap .effect-time .c-green[data-v-9b653dd2] {
    margin-left: 5px
}

.vip-info-wrap .vip-log[data-v-e2bd5fee] {
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: calc(100% + var(--mg) * 2);
    height: 40px;
    background: var(--bg-weight);
    margin: 0 calc(0px - var(--mg)) var(--mg);
    padding: 0 var(--mg);
    color: var(--btn-text2)
}

.vip-info-wrap .vip-wrap .container-card[data-v-e2bd5fee] {
    overflow: hidden;
    background: var(--bg-card);
    border-radius: var(--card-radius);
    margin-bottom: 12px;
    padding: 30px 10px 12px;
    box-sizing: border-box;
    position: relative;
    box-shadow: var(--box-shadow)
}

.vip-info-wrap .vip-wrap .container-card[data-v-e2bd5fee]:last-child {
    margin-bottom: 0
}

.vip-info-wrap .vip-wrap .level-name[data-v-e2bd5fee] {
    position: absolute;
    display: flex;
    align-items: center;
    top: 0;
    left: 0;
    max-width: 100px;
    padding: 2px 10px;
    border-radius: var(--card-radius) 0 var(--card-radius) 0;
    text-align: center;
    font-size: 12px;
    line-height: 20px;
    color: var(--text-black);
    background-color: #85ffbd;
    background-image: radial-gradient(circle farthest-corner at 10% 20%, rgb(253, 203, 50) 0%, rgb(244, 56, 98) 100.2%);
    font-weight: 700;
    animation: slide-in-bck-center-e2bd5fee .7s cubic-bezier(.25, .46, .45, .94) both
}

@keyframes slide-in-bck-center-e2bd5fee {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.vip-info-wrap .vip-wrap .level-name .icon[data-v-e2bd5fee] {
    display: none;
    position: absolute;
    top: -20px;
    left: -10px;
    width: 35px;
    margin-right: 2px
}

.vip-info-wrap .vip-wrap .current-status-box[data-v-e2bd5fee] {
    position: absolute;
    top: 0;
    right: 0;
    padding: 3px 15px;
    display: flex;
    align-items: center;
    background: linear-gradient(to bottom, #323232 0%, #3f3f3f 40%, #1c1c1c 150%), linear-gradient(to top, rgba(255, 255, 255, .4) 0%, rgba(0, 0, 0, .25) 200%);
    background-blend-mode: multiply;
    border-radius: 0 10px;
    color: var(--text-white)
}

.vip-info-wrap .vip-wrap .current-status-box .icon[data-v-e2bd5fee] {
    margin-right: 5px
}

.vip-info-wrap .vip-wrap .level-info[data-v-e2bd5fee] {
    position: relative;
    display: flex;
    align-items: center
}

.vip-info-wrap .vip-wrap .level-info .left[data-v-e2bd5fee] {
    flex-shrink: 0
}

.vip-info-wrap .vip-wrap .level-info .left .vip-img[data-v-e2bd5fee] {
    width: 100px;
    height: 100px;
    border-radius: 5px
}

.vip-info-wrap .vip-wrap .level-info .right[data-v-e2bd5fee] {
    flex: 1;
    margin-left: 10px;
    max-width: calc(100% - 110px);
    background: rgba(0, 0, 0, .05);
    padding: 10px;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-radius: 5px
}

.vip-info-wrap .vip-wrap .level-info .right .item[data-v-e2bd5fee] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 5px;
    font-size: 13px
}

.vip-info-wrap .vip-wrap .level-info .right .item[data-v-e2bd5fee]:last-child {
    margin-bottom: 0
}

.vip-info-wrap .vip-wrap .level-info .right .item .title[data-v-e2bd5fee] {
    line-height: 15px;
    color: var(--text-gray)
}

.vip-info-wrap .vip-wrap .level-info .right .item .value[data-v-e2bd5fee] {
    max-width: 100%;
    flex-shrink: 0
}

.vip-info-wrap .vip-wrap .level-info .right .item .value .strong[data-v-e2bd5fee] {
    font-size: 14px
}

.vip-info-wrap .vip-wrap .level-info .right .item .value .unit[data-v-e2bd5fee] {
    font-size: 12px;
    color: var(--text-gray)
}

.vip-info-wrap .vip-wrap .active-level[data-v-e2bd5fee] {
    position: relative;
    margin-top: 5px;
    display: flex;
    justify-content: flex-end
}

.vip-info-wrap .vip-wrap .active-level .active-btn[data-v-e2bd5fee] {
    position: relative;
    font-size: 13px;
    background: var(--btn-bg);
    padding: 5px 16px;
    border-radius: var(--btn-radius);
    cursor: pointer;
    overflow: hidden;
    color: var(--btn-text)
}

.vip-info-wrap .vip-wrap .active-level .active-btn span[data-v-e2bd5fee] {
    position: relative;
    z-index: 1
}

.vip-info-wrap .vip-wrap .active-level .active-btn[data-v-e2bd5fee]:before {
    content: "";
    position: absolute;
    display: inline-block;
    top: -180px;
    left: -50px;
    width: 30px;
    height: 100%;
    background-color: #fff;
    animation: shiny-btn1-e2bd5fee 3s ease-in-out infinite
}

@keyframes shiny-btn1-e2bd5fee {
    0% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0
    }
    80% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: .5
    }
    81% {
        -webkit-transform: scale(4) rotate(45deg);
        opacity: 1
    }
    to {
        -webkit-transform: scale(50) rotate(45deg);
        opacity: 0
    }
}

.vip-info-wrap .vip-wrap .effect-time[data-v-e2bd5fee] {
    margin-top: 8px;
    font-size: 13px;
    line-height: 14px;
    display: flex;
    align-items: center
}

.vip-info-wrap .vip-wrap .effect-time .c-green[data-v-e2bd5fee] {
    margin-left: 5px
}

.invest-card img[data-v-3ee17a11] {
    overflow-clip-margin: content-box;
    overflow: clip
}

.invest-card .name[data-v-3ee17a11] {
    width: 100%;
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: 700;
    color: #000;
    word-wrap: break-word
}

.invest-card .info[data-v-3ee17a11] {
    background: rgba(0, 0, 0, .05);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    padding: 10px;
    border-radius: var(--card-radius)
}

.invest-card .info .info-item[data-v-3ee17a11] {
    margin-bottom: 12px
}

.invest-card .info .info-item .label[data-v-3ee17a11] {
    width: 100%;
    margin-bottom: 8px;
    font-size: 15px;
    color: #333;
    word-wrap: break-word
}

.invest-card .info .info-item .value[data-v-3ee17a11] {
    width: 100%;
    font-size: 15px;
    font-weight: 700;
    color: #000;
    word-break: break-all
}

.invest-card .buy-btn[data-v-3ee17a11] {
    margin-top: 20px;
    width: 100%;
    height: 45px;
    line-height: 45px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 20px;
    border-radius: 45px;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-image: -webkit-gradient(linear, left top, right top, from(#fe9500), to(#fade88));
    background-image: linear-gradient(90deg, #fe9500, #fade88);
    cursor: pointer
}

.invest-card .buy-btn.disabled[data-v-3ee17a11] {
    background-image: -webkit-gradient(linear, left top, right top, from(#ccc), to(#ccc));
    background-image: linear-gradient(90deg, #ccc, #ccc);
    cursor: not-allowed
}