.q-share-picture {
    color: #666
}

.q-share-picture__img {
    position: absolute;
    width: 253px
}

.q-share-picture__panel {
    background-color: var(--bg_top_light,#fff)
}

.q-share-picture__title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    padding-right: 10px;
    text-align: center;
    font-size: 14px;
    color: var(--text_primary,#000)
}

.q-share-picture__title .q-icon {
    padding: 6px;
    font-weight: 700;
    color: var(--icon_secondary,#999)
}

.q-share-picture__list {
    display: flex;
    flex-wrap: wrap;
    padding: 0 12px;
    margin: 0;
    list-style: none
}

.q-share-picture__item {
    text-align: center;
    font-size: 12px;
    margin-bottom: 16px
}

.q-share-picture__item:not(:nth-child(5n)) {
    margin-right: 11px
}

.q-share-picture__icon-wrap {
    width: 60px;
    height: 60px;
    background-color: var(--bg_bottom_standard,#f5f5f5);
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 6px
}

.q-share-picture__icon-wrap:active {
    background-color: var(--button_bg_secondary_pressed,#e6e6e6)
}

.q-share-picture__icon {
    width: 24px;
    height: 24px;
    background-size: contain;
    background-position: 50%;
    background-repeat: no-repeat
}

.q-share-picture .q-popup__content_bottom {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    overflow: hidden;
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom)
}

.q-loading__icon {
    font-size: 16px;
    display: inline-block;
    margin: 0 auto;
    width: 1em;
    height: 1em;
    vertical-align: middle;
    background-image: url(https://qq-web.cdn-go.cn/im.qq.com_new/863ecfe8/img/loading-gray.afdc72ba.png);
    background-size: cover
}

.q-loading__icon-white {
    background-image: url(https://qq-web.cdn-go.cn/im.qq.com_new/863ecfe8/img/loading-white.efabce5e.png)
}

.q-loading__icon-red {
    background-image: url(https://qq-web.cdn-go.cn/im.qq.com_new/863ecfe8/img/loading-red.32e0dc7e.png)
}

.q-loading_normal,.q-loading_normal .q-loading__inner {
    display: inline-block
}

.q-loading_normal .q-loading__txt-tips {
    margin-left: 6px;
    font-size: 14px;
    color: var(--text_secondary,#8c8c8c);
    vertical-align: middle
}

.q-loading_float {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 10002;
    transform: translate(-50%,-50%)
}

.q-loading_float .q-loading__inner {
    padding: 20px 12px;
    min-width: 100px;
    min-height: 100px;
    background-color: rgba(0,0,0,.65);
    border-radius: 6px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.q-loading_float .q-loading__icon {
    display: block;
    font-size: 24px
}

.q-loading_float .q-loading__txt-tips {
    display: block;
    text-align: center;
    color: var(--text_white,#fff);
    font-size: 14px
}

.q-loading_circle {
    color: var(--brand_standard,#09f)
}

.q-loading_circle-inner {
    transform-origin: 50% 50%;
    transform: rotate(-90deg);
    transition: stroke-dasharray .2s ease-in
}

.q-loading_circle-text {
    text-anchor: middle;
    dominant-baseline: middle;
    font-size: 16px;
    line-height: 24px;
    font-weight: 300;
    stroke: var(--text_secondary,#8c8c8c);
    fill: var(--text_secondary,#8c8c8c)
}

.q-loading_float-circle_text {
    color: var(--text_secondary,#8c8c8c);
    text-align: center;
    font-size: 17px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-top: 12px
}

.loading-fade-enter-active {
    animation: QFadeIn .15s linear
}

.loading-fade-leave-active {
    animation: QFadeOut .15s linear
}

.q-toast {
    position: fixed;
    top: 42px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10001
}

.q-toast__inner {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 328px;
    padding: 12px 24px 12px 16px;
    background-color: var(--bg_top_light,#fff);
    border-radius: 12px;
    box-shadow: 0 3px 20px 0 rgba(0,0,0,.15);
    -webkit-backdrop-filter: blur(25px);
    backdrop-filter: blur(25px)
}

.q-toast__inner.clickable {
    width: 331.5px;
    padding: 15px 16px 15px 15.5px;
    display: flex;
    flex-direction: row;
    justify-content: space-between
}

.q-toast-success {
    color: var(--feedback_success,#15d173)!important
}

.q-toast-error {
    color: var(--feedback_error,#f74c30)!important
}

.q-toast-info {
    color: var(--feedback_normal,#09f)!important
}

.q-toast__txt {
    color: var(--text_primary,#000);
    font-size: 16px;
    padding-left: 4px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 400;
    line-height: 22px
}

.q-toast__txt.clickable {
    max-width: 196px;
    padding-left: 8px
}

.q-toast__action-tip {
    color: var(--text_link,#2d77e5);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    max-width: 80px;
    margin-left: auto;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.q-toast__action-tip.clickable {
    margin-left: 16px
}

.q-toast.clickable {
    top: unset;
    margin-bottom: 12px;
    justify-content: space-between;
    bottom: constant(safe-area-inset-bottom);
    bottom: env(safe-area-inset-bottom)
}

.pop-enter-active {
    animation: popAppearIn .15s ease;
    transform-origin: 50% 0
}

.pop-leave-active {
    animation: popAppearOut .15s ease;
    transform-origin: 50% 0
}

.popclickable-enter-active {
    animation: popclickableAppearIn .15s ease;
    transform-origin: 50% 0
}

.popclickable-leave-active {
    animation: popclickableAppearOut .15s ease;
    transform-origin: 50% 0
}

@keyframes popAppearIn {
    0% {
        opacity: 0;
        transform: translateX(-50%);
        top: 0
    }

    to {
        opacity: 1;
        transform: translateX(-50%);
        top: 42px
    }
}

@keyframes popAppearOut {
    0% {
        opacity: 1;
        transform: translateX(-50%);
        top: 42px
    }

    to {
        opacity: 0;
        transform: translateX(-50%);
        top: 0
    }
}

@keyframes popclickableAppearIn {
    0% {
        opacity: 0;
        transform: translateX(-50%);
        bottom: 0
    }

    to {
        opacity: 1;
        transform: translateX(-50%);
        bottom: 12px
    }
}

@keyframes popclickableAppearOut {
    0% {
        opacity: 1;
        transform: translateX(-50%);
        bottom: 12px
    }

    to {
        opacity: 0;
        transform: translateX(-50%);
        bottom: 0
    }
}

:root {
    --background-white: #fff;
    --background-dialogue: #fff;
    --background-dialogue-pressed: #e6e6e6;
    --background-list: #fff;
    --background-list-pressed: #e6e6e6;
    --background-stick: #f5f5f5;
    --background-textfield: #f5f5f5;
    --background-chat-bg: #f1f1f1;
    --black-1: #fff;
    --black-2: #fafafa;
    --black-3: #f5f5f5;
    --black-4: #e6e6e6;
    --black-5: #dbdbdb;
    --black-6: #ccc;
    --black-7: #999;
    --black-8: grey;
    --black-9: #666;
    --black-10: #4d4d4d;
    --black-11: #333;
    --black-12: #292929;
    --black-13: #242424;
    --black-14: #1f1f1f;
    --black-15: #1a1a1a;
    --black-16: #000;
    --blue-1: #e6f5ff;
    --blue-2: #c2e7ff;
    --blue-3: #91d3ff;
    --blue-4: #5ebfff;
    --blue-5: #2eabff;
    --blue-6: #09f;
    --blue-7: #0082d9;
    --blue-8: #006db5;
    --blue-9: #005791;
    --blue-10: #004573;
    --dark-blue-1: #e6f0fa;
    --dark-blue-2: #c2daf3;
    --dark-blue-3: #91bde9;
    --dark-blue-4: #5e9fdf;
    --dark-blue-5: #2e82d5;
    --dark-blue-6: #06c;
    --dark-blue-7: #0057ad;
    --dark-blue-8: #004891;
    --dark-blue-9: #003a74;
    --dark-blue-10: #002e5c;
    --indigo-1: #f3f0ff;
    --indigo-2: #e3dbff;
    --indigo-3: #cbbdff;
    --indigo-4: #b19eff;
    --indigo-5: #9980ff;
    --indigo-6: #8566ff;
    --indigo-7: #7259d9;
    --indigo-8: #5f49b6;
    --indigo-9: #4c3a92;
    --indigo-10: #3d2f75;
    --green-1: #e8faf1;
    --green-2: #c7f4dd;
    --green-3: #9aebc3;
    --green-4: #6ce2a7;
    --green-5: #3fd98c;
    --green-6: #15d173;
    --green-7: #12b262;
    --green-8: #0f9452;
    --green-9: #0c7742;
    --green-10: #095e34;
    --pink-1: #fff0f7;
    --pink-2: #ffdaed;
    --pink-3: #ffbdde;
    --pink-4: #ff9fcf;
    --pink-5: #ff82c1;
    --pink-6: #ff66b3;
    --pink-7: #d95798;
    --pink-8: #b5487f;
    --pink-9: #913a66;
    --pink-10: #732e51;
    --red-1: #ffeef0;
    --red-2: #ffd7db;
    --red-3: #ffb8be;
    --red-4: #ff969f;
    --red-5: #ff7782;
    --red-6: #ff5967;
    --red-7: #d94c58;
    --red-8: #b53f49;
    --red-9: #91333b;
    --red-10: #73282e;
    --orange-1: #fff4ec;
    --orange-2: #ffe4d1;
    --orange-3: #ffcead;
    --orange-4: #ffb787;
    --orange-5: #ffa262;
    --orange-6: #ff8d40;
    --orange-7: #d97836;
    --orange-8: #b5642d;
    --orange-9: #915024;
    --orange-10: #733f1d;
    --yellow-1: #fff7e6;
    --yellow-2: #ffedc2;
    --yellow-3: #ffde91;
    --yellow-4: #ffcf5e;
    --yellow-5: #ffc12e;
    --yellow-6: #ffb300;
    --yellow-7: #d99800;
    --yellow-8: #b57f00;
    --yellow-9: #916600;
    --yellow-10: #735100
}

.dark,.default-dark,.system-theme-darkmode {
    --background-white: #000;
    --background-dialogue: #262626;
    --background-dialogue-pressed: #1a1a1a;
    --background-list: #262626;
    --background-list-pressed: #1a1a1a;
    --background-stick: #1a1a1a;
    --background-chat-bg: #000;
    --background-textfield: #1a1a1a
}

.qui-checked .q-action-sheet,.qui-checked .q-authorization,.qui-checked .q-avatar,.qui-checked .q-avatar-line,.qui-checked .q-badge,.qui-checked .q-blank-page__content,.qui-checked .q-bottom-sheet,.qui-checked .q-button,.qui-checked .q-checkbox,.qui-checked .q-dialog,.qui-checked .q-divider,.qui-checked .q-index,.qui-checked .q-input,.qui-checked .q-list,.qui-checked .q-loading,.qui-checked .q-navbar,.qui-checked .q-notice,.qui-checked .q-notification,.qui-checked .q-picker,.qui-checked .q-popup__content,.qui-checked .q-progress,.qui-checked .q-radio,.qui-checked .q-search-bar,.qui-checked .q-share-picture,.qui-checked .q-slip-drawer,.qui-checked .q-swiper,.qui-checked .q-switch,.qui-checked .q-tab,.qui-checked .q-tabbar,.qui-checked .q-tag,.qui-checked .q-toast,.qui-checked .q-tooltips__inner,.qui-checked .q-video-toast {
    border: 1px solid #f74c30!important
}

.qui-checked .q-avatar-line:after,.qui-checked .q-avatar:after,.qui-checked .q-blank-page__content:after,.qui-checked .q-bottom-sheet__content_bottom:after,.qui-checked .q-button:after,.qui-checked .q-input:after,.qui-checked .q-list:after,.qui-checked .q-notice:after,.qui-checked .q-notification:after,.qui-checked .q-picker-box:after,.qui-checked .q-popup__content:after,.qui-checked .q-search-bar:after,.qui-checked .q-toast:after {
    position: absolute;
    top: 0;
    font-size: 11px;
    height: 11px;
    line-height: 11px;
    right: 0;
    color: red;
    transform: scale(.81)
}

.qui-checked .q-blank-page__content:after {
    content: "QUIEmptyState"
}

.qui-checked .q-notification:after {
    content: "QUINotification"
}

.qui-checked .q-notice:after {
    content: "QUINoticeBar"
}

.qui-checked .q-toast:after {
    content: "QUIToast"
}

.qui-checked .q-input:after {
    content: "QUIInput"
}

.qui-checked .q-popup__content:after {
    content: "QUIPopup"
}

.qui-checked .q-picker-box:after {
    content: "QUIPicker"
}

.qui-checked .q-dialog .q-popup__content:after {
    content: "QUIDialog"
}

.qui-checked .q-authorization .q-popup__content:after {
    content: "QUIAuthorization"
}

.qui-checked .q-action-sheet .q-popup__content:after {
    content: "QUIActionSheet"
}

.qui-checked .q-share-picture .q-popup__content:after {
    content: "QUIShareSheet"
}

.qui-checked .q-bottom-sheet__content_bottom:after {
    content: "QUIBottomSheet"
}

.qui-checked .q-datetime-picker .q-picker-box:after {
    content: "QUIDatetimePicker"
}

.qui-checked .q-area .q-picker-box:after {
    content: "QUIAreaPicker"
}

.qui-checked .q-button:after {
    content: "QUIButton"
}

.qui-checked .q-list-group {
    border-radius: 0
}

.qui-checked .q-list:after {
    content: "QUIList"
}

.qui-checked .q-avatar,.qui-checked .q-avatar-line,.qui-checked .q-blank-page__content,.qui-checked .q-notice,.qui-checked .q-notification,.qui-checked .q-search-bar,.qui-checked .q-tag {
    position: relative
}

.qui-checked .q-avatar-line:after,.qui-checked .q-avatar:after {
    content: "QUIAvatar"
}

.qui-checked .q-search-bar:after {
    content: "QUISearchBar"
}

@keyframes QFadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes QFadeOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.fade-enter-active {
    animation: QFadeIn .3s
}

.fade-leave-active {
    animation: QFadeOut .3s
}

@keyframes QFadeZoomIn {
    0% {
        opacity: 0;
        transform: scale(.8)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes QFadeZoomOut {
    0% {
        opacity: 1;
        transform: scale(1)
    }

    to {
        opacity: 0;
        transform: scale(.8)
    }
}

.fade-zoom-enter-active {
    animation: QFadeZoomIn .35s
}

.fade-zoom-leave-active {
    animation: QFadeZoomOut .35s
}

@keyframes QSlideTopIn {
    0% {
        transform: translate3d(0,-100%,0)
    }

    to {
        transform: translateZ(0)
    }
}

@keyframes QSlideTopOut {
    0% {
        transform: translateZ(0)
    }

    to {
        transform: translate3d(0,-100%,0)
    }
}

@keyframes QSlideBottomIn {
    0% {
        transform: translate3d(0,100%,0)
    }

    to {
        transform: translateZ(0)
    }
}

@keyframes QSlideBottomOut {
    0% {
        transform: translateZ(0)
    }

    to {
        transform: translate3d(0,100%,0)
    }
}

@keyframes QSlideRightIn {
    0% {
        transform: translate3d(100%,0,0)
    }

    to {
        transform: translateZ(0)
    }
}

@keyframes QSlideRightOut {
    0% {
        transform: translateZ(0)
    }

    to {
        transform: translate3d(100%,0,0)
    }
}

@keyframes QSlideLeftIn {
    0% {
        transform: translate3d(-100%,0,0)
    }

    to {
        transform: translateZ(0)
    }
}

@keyframes QSlideLeftOut {
    0% {
        transform: translateZ(0)
    }

    to {
        transform: translate3d(-100%,0,0)
    }
}

.slide-top-enter-active {
    animation: QSlideTopIn .3s
}

.slide-top-leave-active {
    animation: QSlideTopOut .3s
}

.slide-right-enter-active {
    animation: QSlideRightIn .3s
}

.slide-right-leave-active {
    animation: QSlideRightOut .3s
}

.slide-bottom-enter-active {
    animation: QSlideBottomIn .3s
}

.slide-bottom-leave-active {
    animation: QSlideBottomOut .3s
}

.slide-left-enter-active {
    animation: QSlideLeftIn .3s
}

.slide-left-leave-active {
    animation: QSlideLeftOut .3s
}

.q-overflow-hidden {
    overflow: hidden
}

.q-popup__mask {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    height: 100%;
    z-index: 1000;
    background-color: rgba(0,0,0,.5)
}

.q-popup__mask-content {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1001
}

.q-popup__content {
    position: fixed;
    z-index: 1001;
    border-radius: 8px 8px 0 0;
    background-color: var(--bg_top_light,#fff)
}

.q-popup__content_top {
    top: 0;
    left: 0;
    right: 0;
    border-radius: 0 0 8px 8px
}

.q-popup__content_right {
    top: 0;
    right: 0;
    bottom: 0;
    border-radius: 8px 0 0 8px
}

.q-popup__content_bottom {
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 8px 8px 0 0
}

.q-popup__content_left {
    top: 0;
    left: 0;
    bottom: 0;
    border-radius: 0 8px 8px 0
}

.q-popup__content_center {
    width: -webkit-fit-content;
    width: fit-content;
    height: -webkit-fit-content;
    height: fit-content;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    border-radius: 8px
}

.q-dialog__box {
    width: 296px;
    background-color: var(--bg_top_light,#fff);
    border-radius: 6px;
    box-sizing: border-box;
    overflow: hidden
}

.q-dialog__content {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px 28px
}

.q-dialog__content:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background-color: var(--border_standard,rgba(0,0,0,.1));
    transform-origin: 0 0;
    transform: scaleY(.5)
}

.q-dialog__title {
    max-width: 100%;
    font-weight: 500;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.q-dialog__description,.q-dialog__title {
    font-size: 17px;
    line-height: 20px;
    color: var(--text_primary,#000)
}

.q-dialog__description {
    display: inline-block;
    font-weight: 400
}

.q-dialog__title+.q-dialog__description {
    margin-top: 12px
}

.q-dialog__footer {
    display: flex;
    flex-direction: row;
    align-items: center
}

.q-dialog__btn {
    display: block;
    flex: 1;
    min-width: 0;
    padding: 17px 0;
    text-align: center;
    font-size: 17px;
    line-height: 20px;
    font-weight: 500;
    color: var(--text_primary,#000);
    box-sizing: border-box;
    border: 0;
    margin: 0;
    background-color: transparent
}

.q-dialog__btn:active {
    background-color: var(--button_bg_secondary_pressed,#e6e6e6)
}

.q-dialog__footer.q-dialog__btn_vertical {
    flex-direction: column;
    align-items: stretch
}

.q-dialog__footer.q-dialog__btn_vertical .q-dialog__btn {
    position: relative
}

.q-dialog__footer.q-dialog__btn_vertical .q-dialog__btn:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    background-color: var(--border_standard,rgba(0,0,0,.1));
    transform-origin: 0 0;
    transform: scaleY(.5)
}