:root, :host {
    --van-action-bar-background: var(--van-background-2);
    --van-action-bar-height: 50px
}

.van-action-bar {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    box-sizing: content-box;
    height: var(--van-action-bar-height);
    background: var(--van-action-bar-background)
}

:root, :host {
    --van-button-mini-height: 24px;
    --van-button-mini-padding: 0 var(--van-padding-base);
    --van-button-mini-font-size: var(--van-font-size-xs);
    --van-button-small-height: 32px;
    --van-button-small-padding: 0 var(--van-padding-xs);
    --van-button-small-font-size: var(--van-font-size-sm);
    --van-button-normal-padding: 0 15px;
    --van-button-normal-font-size: var(--van-font-size-md);
    --van-button-large-height: 50px;
    --van-button-default-height: 44px;
    --van-button-default-line-height: 1.2;
    --van-button-default-font-size: var(--van-font-size-lg);
    --van-button-default-color: var(--van-text-color);
    --van-button-default-background: var(--van-background-2);
    --van-button-default-border-color: var(--van-gray-4);
    --van-button-primary-color: var(--van-white);
    --van-button-primary-background: var(--van-primary-color);
    --van-button-primary-border-color: var(--van-primary-color);
    --van-button-success-color: var(--van-white);
    --van-button-success-background: var(--van-success-color);
    --van-button-success-border-color: var(--van-success-color);
    --van-button-danger-color: var(--van-white);
    --van-button-danger-background: var(--van-danger-color);
    --van-button-danger-border-color: var(--van-danger-color);
    --van-button-warning-color: var(--van-white);
    --van-button-warning-background: var(--van-warning-color);
    --van-button-warning-border-color: var(--van-warning-color);
    --van-button-border-width: var(--van-border-width);
    --van-button-radius: var(--van-radius-md);
    --van-button-round-radius: var(--van-radius-max);
    --van-button-plain-background: var(--van-white);
    --van-button-disabled-opacity: var(--van-disabled-opacity);
    --van-button-icon-size: 1.2em;
    --van-button-loading-icon-size: 20px
}

.van-theme-dark {
    --van-button-plain-background: transparent
}

.van-button {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    height: var(--van-button-default-height);
    margin: 0;
    padding: 0;
    font-size: var(--van-button-default-font-size);
    line-height: var(--van-button-default-line-height);
    text-align: center;
    border-radius: var(--van-button-radius);
    cursor: pointer;
    transition: opacity var(--van-duration-fast);
    -webkit-appearance: none;
    -webkit-font-smoothing: auto
}

.van-button:before {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    background: var(--van-black);
    border: inherit;
    border-color: var(--van-black);
    border-radius: inherit;
    transform: translate(-50%, -50%);
    opacity: 0;
    content: " "
}

.van-button:active:before {
    opacity: .1
}

.van-button--loading:before, .van-button--disabled:before {
    display: none
}

.van-button--default {
    color: var(--van-button-default-color);
    background: var(--van-button-default-background);
    border: var(--van-button-border-width) solid var(--van-button-default-border-color)
}

.van-button--primary {
    color: var(--van-button-primary-color);
    background: var(--van-button-primary-background);
    border: var(--van-button-border-width) solid var(--van-button-primary-border-color)
}

.van-button--success {
    color: var(--van-button-success-color);
    background: var(--van-button-success-background);
    border: var(--van-button-border-width) solid var(--van-button-success-border-color)
}

.van-button--danger {
    color: var(--van-button-danger-color);
    background: var(--van-button-danger-background);
    border: var(--van-button-border-width) solid var(--van-button-danger-border-color)
}

.van-button--warning {
    color: var(--van-button-warning-color);
    background: var(--van-button-warning-background);
    border: var(--van-button-border-width) solid var(--van-button-warning-border-color)
}

.van-button--plain {
    background: var(--van-button-plain-background)
}

.van-button--plain.van-button--primary {
    color: var(--van-button-primary-background)
}

.van-button--plain.van-button--success {
    color: var(--van-button-success-background)
}

.van-button--plain.van-button--danger {
    color: var(--van-button-danger-background)
}

.van-button--plain.van-button--warning {
    color: var(--van-button-warning-background)
}

.van-button--large {
    width: 100%;
    height: var(--van-button-large-height)
}

.van-button--normal {
    padding: var(--van-button-normal-padding);
    font-size: var(--van-button-normal-font-size)
}

.van-button--small {
    height: var(--van-button-small-height);
    padding: var(--van-button-small-padding);
    font-size: var(--van-button-small-font-size)
}

.van-button__loading {
    color: inherit;
    font-size: inherit
}

.van-button__loading .van-loading__spinner {
    color: currentColor;
    width: var(--van-button-loading-icon-size);
    height: var(--van-button-loading-icon-size)
}

.van-button--mini {
    height: var(--van-button-mini-height);
    padding: var(--van-button-mini-padding);
    font-size: var(--van-button-mini-font-size)
}

.van-button--mini + .van-button--mini {
    margin-left: var(--van-padding-base)
}

.van-button--block {
    display: block;
    width: 100%
}

.van-button--disabled {
    cursor: not-allowed;
    opacity: var(--van-button-disabled-opacity)
}

.van-button--loading {
    cursor: default
}

.van-button--round {
    border-radius: var(--van-button-round-radius)
}

.van-button--square {
    border-radius: 0
}

.van-button__content {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%
}

.van-button__content:before {
    content: " "
}

.van-button__icon {
    font-size: var(--van-button-icon-size);
    line-height: inherit
}

.van-button__icon + .van-button__text, .van-button__loading + .van-button__text, .van-button__text + .van-button__icon, .van-button__text + .van-button__loading {
    margin-left: var(--van-padding-base)
}

.van-button--hairline {
    border-width: 0
}

.van-button--hairline:after {
    border-color: inherit;
    border-radius: calc(var(--van-button-radius) * 2)
}

.van-button--hairline.van-button--round:after {
    border-radius: var(--van-button-round-radius)
}

.van-button--hairline.van-button--square:after {
    border-radius: 0
}

:root, :host {
    --van-action-bar-button-height: 40px;
    --van-action-bar-button-warning-color: var(--van-gradient-orange);
    --van-action-bar-button-danger-color: var(--van-gradient-red)
}

.van-action-bar-button {
    flex: 1;
    height: var(--van-action-bar-button-height);
    font-weight: var(--van-font-bold);
    font-size: var(--van-font-size-md);
    border: none;
    border-radius: 0
}

.van-action-bar-button--first {
    margin-left: 5px;
    border-top-left-radius: var(--van-radius-max);
    border-bottom-left-radius: var(--van-radius-max)
}

.van-action-bar-button--last {
    margin-right: 5px;
    border-top-right-radius: var(--van-radius-max);
    border-bottom-right-radius: var(--van-radius-max)
}

.van-action-bar-button--warning {
    background: var(--van-action-bar-button-warning-color)
}

.van-action-bar-button--danger {
    background: var(--van-action-bar-button-danger-color)
}

@media (max-width: 321px) {
    .van-action-bar-button {
        font-size: 13px
    }
}

:root, :host {
    --van-dialog-width: 320px;
    --van-dialog-small-screen-width: 90%;
    --van-dialog-font-size: var(--van-font-size-lg);
    --van-dialog-transition: var(--van-duration-base);
    --van-dialog-radius: 16px;
    --van-dialog-background: var(--van-background-2);
    --van-dialog-header-font-weight: var(--van-font-bold);
    --van-dialog-header-line-height: 24px;
    --van-dialog-header-padding-top: 26px;
    --van-dialog-header-isolated-padding: var(--van-padding-lg) 0;
    --van-dialog-message-padding: var(--van-padding-lg);
    --van-dialog-message-font-size: var(--van-font-size-md);
    --van-dialog-message-line-height: var(--van-line-height-md);
    --van-dialog-message-max-height: 60vh;
    --van-dialog-has-title-message-text-color: var(--van-gray-7);
    --van-dialog-has-title-message-padding-top: var(--van-padding-xs);
    --van-dialog-button-height: 48px;
    --van-dialog-round-button-height: 36px;
    --van-dialog-confirm-button-text-color: var(--van-primary-color)
}

.van-dialog {
    top: 45%;
    width: var(--van-dialog-width);
    overflow: hidden;
    font-size: var(--van-dialog-font-size);
    background: var(--van-dialog-background);
    border-radius: var(--van-dialog-radius);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transition: var(--van-dialog-transition);
    transition-property: transform, opacity
}

@media (max-width: 321px) {
    .van-dialog {
        width: var(--van-dialog-small-screen-width)
    }
}

.van-dialog__header {
    color: var(--van-text-color);
    padding-top: var(--van-dialog-header-padding-top);
    font-weight: var(--van-dialog-header-font-weight);
    line-height: var(--van-dialog-header-line-height);
    text-align: center
}

.van-dialog__header--isolated {
    padding: var(--van-dialog-header-isolated-padding)
}

.van-dialog__content--isolated {
    display: flex;
    align-items: center;
    min-height: 104px
}

.van-dialog__message {
    color: var(--van-text-color);
    flex: 1;
    max-height: var(--van-dialog-message-max-height);
    padding: 26px var(--van-dialog-message-padding);
    overflow-y: auto;
    font-size: var(--van-dialog-message-font-size);
    line-height: var(--van-dialog-message-line-height);
    white-space: pre-wrap;
    text-align: center;
    word-wrap: break-word;
    -webkit-overflow-scrolling: touch
}

.van-dialog__message--has-title {
    padding-top: var(--van-dialog-has-title-message-padding-top);
    color: var(--van-dialog-has-title-message-text-color)
}

.van-dialog__message--left {
    text-align: left
}

.van-dialog__message--right {
    text-align: right
}

.van-dialog__message--justify {
    text-align: justify
}

.van-dialog__footer {
    display: flex;
    overflow: hidden;
    -webkit-user-select: none;
    user-select: none
}

.van-dialog__confirm, .van-dialog__cancel {
    flex: 1;
    height: var(--van-dialog-button-height);
    margin: 0;
    border: 0;
    border-radius: 0
}

.van-dialog__confirm, .van-dialog__confirm:active {
    color: var(--van-dialog-confirm-button-text-color)
}

.van-dialog--round-button .van-dialog__footer {
    position: relative;
    height: auto;
    padding: var(--van-padding-xs) var(--van-padding-lg) var(--van-padding-md)
}

.van-dialog--round-button .van-dialog__message {
    padding-bottom: var(--van-padding-md);
    color: var(--van-text-color)
}

.van-dialog--round-button .van-dialog__confirm, .van-dialog--round-button .van-dialog__cancel {
    height: var(--van-dialog-round-button-height)
}

.van-dialog--round-button .van-dialog__confirm {
    color: var(--van-white)
}

.van-dialog--round-button .van-action-bar-button--first {
    border-top-left-radius: var(--van-radius-max);
    border-bottom-left-radius: var(--van-radius-max)
}

.van-dialog--round-button .van-action-bar-button--last {
    border-top-right-radius: var(--van-radius-max);
    border-bottom-right-radius: var(--van-radius-max)
}

.van-dialog-bounce-enter-from {
    transform: translate3d(0, -50%, 0) scale(.7);
    opacity: 0
}

.van-dialog-bounce-leave-active {
    transform: translate3d(0, -50%, 0) scale(.9);
    opacity: 0
}

:root, :host {
    --van-skeleton-title-width: 40%
}

.van-skeleton-title {
    height: var(--van-skeleton-paragraph-height);
    background: var(--van-skeleton-paragraph-background)
}

.van-skeleton-title--round {
    border-radius: var(--van-radius-max)
}

.van-skeleton-title {
    width: var(--van-skeleton-title-width);
    margin: 0
}

.van-skeleton-title + .van-skeleton-paragraph {
    margin-top: 20px
}

:root, :host {
    --van-skeleton-avatar-size: 32px;
    --van-skeleton-avatar-background: var(--van-active-color)
}

.van-skeleton-avatar {
    flex-shrink: 0;
    width: var(--van-skeleton-avatar-size);
    height: var(--van-skeleton-avatar-size);
    margin-right: var(--van-padding-md);
    background: var(--van-skeleton-avatar-background)
}

.van-skeleton-avatar--round {
    border-radius: var(--van-radius-max)
}

.van-skeleton-avatar + .van-skeleton__content {
    padding-top: var(--van-padding-xs)
}

:root, :host {
    --van-skeleton-paragraph-height: 16px;
    --van-skeleton-paragraph-background: var(--van-active-color);
    --van-skeleton-paragraph-margin-top: var(--van-padding-sm)
}

.van-skeleton-paragraph {
    height: var(--van-skeleton-paragraph-height);
    background: var(--van-skeleton-paragraph-background)
}

.van-skeleton-paragraph--round {
    border-radius: var(--van-radius-max)
}

.van-skeleton-paragraph:not(:first-child) {
    margin-top: var(--van-skeleton-paragraph-margin-top)
}

:root, :host {
    --van-skeleton-duration: 1.2s
}

.van-skeleton {
    display: flex;
    padding: 0 var(--van-padding-md)
}

.van-skeleton__content {
    width: 100%
}

.van-skeleton--animate {
    animation: van-skeleton-blink var(--van-skeleton-duration) ease-in-out infinite
}

@keyframes van-skeleton-blink {
    50% {
        opacity: .6
    }
}

:root, :host {
    --van-skeleton-image-size: 96px;
    --van-skeleton-image-radius: 24px
}

.van-skeleton-image {
    display: flex;
    width: var(--van-skeleton-image-size);
    height: var(--van-skeleton-image-size);
    align-items: center;
    justify-content: center;
    background: var(--van-active-color)
}

.van-skeleton-image--round {
    border-radius: var(--van-skeleton-image-radius)
}

.van-skeleton-image__icon {
    width: calc(var(--van-skeleton-image-size) / 2);
    height: calc(var(--van-skeleton-image-size) / 2);
    font-size: calc(var(--van-skeleton-image-size) / 2);
    color: var(--van-gray-5)
}

[data-v-8ba69987] .van-popup, .van-popup--center[data-v-8ba69987], .van-dialog[data-v-8ba69987] {
    background: red !important
}

.video_box[data-v-8ba69987] {
    width: 600rem;
    background: #181a22;
    border-radius: 32rem;
    background-image: url(../images/video_bg@2x-DjMqZPy4.png);
    background-size: 100%;
    padding: 32rem 32rem 48rem;
    box-sizing: border-box;
    background-repeat: no-repeat
}

.video_box .top_box[data-v-8ba69987] {
    display: flex;
    gap: 16rem
}

.video_box .top_box .img_box[data-v-8ba69987] {
    width: 144rem;
    height: 144rem;
    border-radius: 14rem;
    border: 4rem solid #FFFFFF
}

.video_box .top_box .content_box[data-v-8ba69987] {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-around
}

.video_box .top_box .content_box .title_text[data-v-8ba69987] {
    font-family: Gilroy, Gilroy;
    font-weight: 500;
    font-size: 36rem;
    color: #fff;
    text-align: left;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1
}

.video_box .top_box .content_box .tag_box[data-v-8ba69987]::-webkit-scrollbar {
    display: none
}

.video_box .top_box .content_box .tag_box[data-v-8ba69987] {
    width: 376rem;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    overflow-x: auto
}

.video_box .sketch_box[data-v-8ba69987] {
    margin-top: 24rem
}

.video_box .sketch_box .content[data-v-8ba69987] {
    font-family: Gilroy, Gilroy;
    font-size: 26rem;
    color: #ffffffb3;
    line-height: 33rem;
    text-align: left
}

.video_box .loading_box[data-v-8ba69987] {
    margin-top: 48rem
}

.video_box .loading_box .out_box[data-v-8ba69987] {
    height: 4rem;
    background: #ff9d0f1a;
    border-radius: 2rem
}

.video_box .loading_box .out_box .inner_box[data-v-8ba69987] {
    height: 4rem;
    background: #ff9d0f;
    border-radius: 2rem
}

.video_box .loading_box .tip[data-v-8ba69987] {
    height: 28rem;
    margin-top: 24rem;
    font-family: Gilroy, Gilroy;
    font-size: 24rem;
    color: #ffffff80;
    line-height: 28rem;
    text-align: center
}

.video_box .btn_box[data-v-8ba69987] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16rem;
    margin-top: 48rem
}

.video_box .btn_box .mute_btn[data-v-8ba69987] {
    width: 260rem;
    height: 72rem;
    background: #ff9d0f1a;
    border-radius: 16rem
}

.video_box .btn_box .play_btn[data-v-8ba69987] {
    width: 260rem;
    height: 72rem;
    background: #ff9d0f;
    border-radius: 16rem
}

.video_box .btn_box .btn_tag[data-v-8ba69987] {
    width: 32rem;
    height: 32rem
}

.video_box .btn_box .btn_mute_text[data-v-8ba69987] {
    height: 34rem;
    font-family: Gilroy, Gilroy;
    font-weight: 700;
    font-size: 28rem;
    color: #ff9d0f;
    line-height: 34rem
}

.video_box .btn_box .btn_tag_text[data-v-8ba69987] {
    height: 38rem;
    font-family: Gilroy, Gilroy;
    font-weight: 700;
    font-size: 32rem;
    color: #262321;
    line-height: 38rem
}

.flex_center[data-v-8ba69987] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16rem;
    cursor: pointer
}

.text[data-v-8ba69987] {
    max-height: 44rem;
    font-family: Gilroy, Gilroy;
    font-size: 27rem;
    color: #fff;
    line-height: 28rem;
    white-space: pre-wrap
}

.tag_text[data-v-8ba69987] {
    padding: 10rem 16rem;
    box-sizing: border-box;
    background: #f7af2d1a;
    border-radius: 26rem;
    font-family: Gilroy, Gilroy;
    font-weight: 500;
    font-size: 26rem;
    color: #f7af2d;
    margin-right: 8rem;
    max-width: 300rem;
    white-space: nowrap
}

[data-v-8ba69987] .van-skeleton-paragraph {
    background: #777c84
}

[data-v-8ba69987] .van-skeleton-image {
    background: #787b81
}
