.c_modal_bg {
    background: rgba(0,0,0,.1);
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 1000
}

.c_modal_bg,.c_popup {
    display: none;
    position: fixed;
    transition-duration: .2s
}

.c_popup {
    border-radius: .8rem;
    bottom: 15rem;
    box-shadow: 0 1.6px 3.6px rgba(0,0,0,.03);
    left: 50%;
    max-width: 38.2rem;
    padding: 1.2rem 1.6rem;
    -webkit-transform: translate3d(-50%,-50%,0);
    transform: translate3d(-50%,-50%,0);
    -webkit-transform-origin: center;
    transform-origin: center;
    width: calc(100% - 3.2rem);
    z-index: 2001
}

.c_popup.show {
    display: block;
    opacity: .01;
    -webkit-transform: translate3d(-50%,-50%,0);
    transform: translate3d(-50%,-50%,0)
}

.c_popup.show.modal {
    -webkit-transform: translate3d(-50%,0,0);
    transform: translate3d(-50%,0,0)
}

.c_popup.show+.c_modal_bg {
    display: block;
    opacity: .01
}

.c_popup.show.visible {
    opacity: 1;
    -webkit-transform: translate3d(-50%,0,0);
    transform: translate3d(-50%,0,0)
}

.c_popup.show.visible+.c_modal_bg {
    opacity: 1
}

.c_popup.show.visible.modal {
    -webkit-transform: translate3d(-50%,50%,0);
    transform: translate3d(-50%,50%,0)
}

.c_popup.info {
    background-color: var(--info-message-background);
    color: var(--info-message-color)
}

.c_popup.error,.c_popup.info {
    font-size: 1.4rem;
    line-height: 2rem
}

.c_popup.error {
    background-color: var(--error-message-background);
    color: var(--error-message-color)
}

.c_popup.warn {
    background-color: var(--warn-message-background);
    color: var(--warn-message-color);
    font-size: 1.4rem;
    line-height: 2rem
}

.c_popup.modal {
    bottom: 50%;
    padding: 0;
    width: calc(100% - 5.6rem)
}

.c_popup button {
    border-radius: .4rem
}

.pc .c_popup:not(.modal) {
    border-radius: 0;
    bottom: 6.5rem;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    max-width: 100%;
    padding: .8rem 1.6rem;
    top: auto;
    width: 100%
}

.pc .c_popup:not(.modal).warn {
    background-color: var(--warn-message-background);
    color: var(--warn-message-color-pc);
    font-size: 1.4rem;
    line-height: 2rem
}

.android .c_popup,.ios .c_popup {
    -webkit-transform: translate3d(-50%,0,0)!important;
    transform: translate3d(-50%,0,0)!important
}

.c_popup_msg_box {
    align-items: center;
    display: flex;
    font-size: 1.5rem;
    line-height: 2rem
}

.c_popup_msg_icon {
    flex-shrink: 0
}

.c_popup_msg_icon,.c_popup_msg_icon>svg {
    height: 2.4rem;
    width: 2.4rem
}

.pc .c_popup_msg_icon,.pc .c_popup_msg_icon>svg {
    height: 2rem;
    width: 2rem
}

.info .c_popup_msg_close>svg>path,.info .c_popup_msg_icon>svg>path {
    fill: var(--info-message-color)
}

.error .c_popup_msg_close>svg>path,.error .c_popup_msg_icon>svg>path {
    fill: var(--error-message-color)
}

.warn .c_popup_msg_close>svg>path,.warn .c_popup_msg_icon>svg>path {
    fill: var(--warn-message-color)
}

.pc .warn .c_popup_msg_close>svg>path,.pc .warn .c_popup_msg_icon>svg>path {
    fill: var(--warn-message-color-pc)
}

.c_popup_msg_content {
    flex: 1 1;
    padding-left: 1.6rem
}

.c_popup_msg_content_inner {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    display: -webkit-box;
    max-width: 26rem;
    overflow: hidden;
    white-space: break-spaces;
    word-break: break-all
}

.pc .c_popup_msg_content_inner {
    max-width: 100%
}

.c_popup_msg_close {
    cursor: pointer;
    flex-shrink: 0;
    height: 4rem;
    margin-right: -.1rem;
    padding: 1rem;
    width: 4rem
}

.c_popup_msg_close:hover {
    opacity: .5
}

.pc .c_popup_msg_close {
    border-radius: .4rem;
    height: 3.2rem;
    margin-left: .8rem;
    margin-right: -.7rem;
    padding: .8rem;
    width: 3.2rem
}

.pc .c_popup_msg_close>svg {
    pointer-events: none
}

html[data-tab="1"] .pc .c_popup_msg_close:focus-visible {
    box-shadow: 0 0 0 1px var(--acc-focus-border-color)
}

.c_modal {
    background: var(--modal-background);
    border: 1px solid var(--modal-border-color);
    border-radius: .5rem;
    color: var(--modal-color);
    padding: 2.4rem;
    width: 100%
}

.c_modal_content {
    border-radius: .3em;
    font-size: 1.4rem;
    line-height: 2rem;
    padding-bottom: 1.6rem
}

.c_modal_content:focus-visible {
    box-shadow: 0 0 0 1PX var(--acc-focus-border-color)
}

.c_modal_confirm_desc {
    max-height: calc(50vh - 6rem);
    overflow: auto
}

.c_modal_footer {
    display: flex;
    justify-content: center
}

.c_modal_footer fluent-button {
    flex: 1 1;
    -webkit-user-select: none;
    user-select: none
}

.c_modal_close {
    cursor: pointer;
    height: 2rem;
    position: absolute!important;
    right: 2.4rem;
    top: 2.4rem;
    transition-duration: .3s;
    width: 2rem
}

.c_modal_close>svg {
    height: 100%;
    width: 100%
}

.c_modal_close>svg>path {
    fill: var(--modal-color)
}

.c_modal_close:hover {
    background-color: var(--default-button-hover-background)
}

.c_modal_close:focus-visible {
    background-color: var(--default-button-hover-background)
}

.android .c_modal_bg,.ios .c_modal_bg {
    background: rgba(0,0,0,.4)
}

.android .c_modal_close,.ios .c_modal_close {
    display: none
}

.c_modal_confirm_tit {
    color: var(--modal-color);
    font-size: 2rem;
    font-weight: 600;
    line-height: 2.6rem;
    margin-bottom: 1.6rem
}

.c_modal_confirm_img_content {
    display: block;
    margin: 0 auto;
    max-height: 30rem;
    max-width: 100%
}

.android .c_popup.modal {
    border-radius: .4rem;
    box-shadow: 0 12.8PX 28.8PX rgba(0,0,0,.22);
    width: 28rem
}

.android .c_modal {
    background: var(--modal-background-android);
    border: 0;
    border-radius: .4rem;
    padding: 2.4rem
}

.android .c_modal_confirm_tit {
    font-size: 2rem;
    font-weight: 500;
    line-height: 2.4rem;
    margin-bottom: .8rem
}

.android .c_modal_confirm_desc {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 2.4rem;
    opacity: .665
}

.android .c_modal_footer {
    justify-content: flex-end;
    margin: 0 -1.5rem -1.2rem 0
}

.android .c_modal_footer fluent-button {
    border-radius: 0;
    flex: none
}

.android .c_modal_footer fluent-button::part(control) {
    background: transparent
}

.android .c_modal_footer fluent-button::part(control):hover {
    background: transparent
}

.android .c_modal_footer fluent-button::part(control):active {
    background: hsla(0,0%,74%,.2)
}

.android .c_modal_footer fluent-button::part(control):focus,.android .c_modal_footer fluent-button::part(control):focus-visible {
    border-color: transparent
}

.android .c_modal_footer fluent-button::part(content) {
    color: var(--modal-button-color-ios);
    font-weight: 500
}

.ios .c_popup.modal {
    -webkit-backdrop-filter: blur(54.37PX);
    backdrop-filter: blur(54.37PX);
    border-radius: 1.4rem;
    box-shadow: none;
    overflow: hidden;
    width: 25rem
}

.ios .c_modal {
    background: var(--modal-background-ios);
    border: 0;
    border-radius: 1.4rem;
    padding: 0
}

.ios .c_modal_content {
    padding: 1.6rem
}

.ios .c_modal_confirm_tit {
    color: var(--modal-color-ios);
    font-size: 1.7rem;
    font-weight: 600;
    letter-spacing: -.0408rem;
    line-height: 2.2rem;
    margin-bottom: 0;
    text-align: center
}

.ios .c_modal_confirm_desc {
    color: var(--modal-color-ios);
    font-size: 1.3rem;
    font-weight: 400;
    letter-spacing: -.008rem;
    line-height: 1.8rem;
    text-align: center
}

.ios .c_modal_footer {
    padding: 0;
    position: relative
}

.ios .c_modal_footer:before {
    height: 1PX;
    left: 0;
    -webkit-transform: scaleY(.5);
    transform: scaleY(.5);
    -webkit-transform-origin: top;
    transform-origin: top;
    width: 100%
}

.ios .c_modal_footer:after,.ios .c_modal_footer:before {
    background: var(--modal-border-color-ios);
    content: "";
    display: block;
    position: absolute;
    top: 0
}

.ios .c_modal_footer:after {
    height: 100%;
    left: 50%;
    -webkit-transform: scaleX(.5);
    transform: scaleX(.5);
    -webkit-transform-origin: left;
    transform-origin: left;
    width: 1PX
}

.ios .c_modal_footer fluent-button {
    border-radius: 0;
    height: 4.4rem
}

.ios .c_modal_footer fluent-button::part(control) {
    background: transparent
}

.ios .c_modal_footer fluent-button::part(control):hover {
    background: transparent
}

.ios .c_modal_footer fluent-button::part(control):focus,.ios .c_modal_footer fluent-button::part(control):focus-visible {
    border-color: transparent
}

.ios .c_modal_footer fluent-button::part(control):active {
    background: hsla(0,0%,74%,.2)
}

.ios .c_modal_footer fluent-button::part(content) {
    color: var(--modal-button-color-ios);
    font-weight: 500
}

.ios .c_modal_footer fluent-button.cancel::part(content) {
    font-weight: 400
}

.ios .c_modal_footer fluent-button.confirm::part(content) {
    font-weight: 600
}

.c_drag_mask {
    align-items: center;
    -webkit-animation: DragMaskFadeIn .3s ease-out forwards;
    animation: DragMaskFadeIn .3s ease-out forwards;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    left: 0;
    position: fixed;
    top: 0;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100%;
    z-index: 1000
}

.c_drag_mask:after {
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='none' stroke='%230078D4' stroke-width='4' stroke-dasharray='6, 14' stroke-linecap='square'/%3E%3C/svg%3E"),hsla(0,0%,100%,.9);
    border-radius: 4PX;
    box-sizing: border-box;
    content: "";
    display: block;
    height: calc(100% - 1.6rem);
    left: .8rem;
    position: absolute;
    top: .8rem;
    width: calc(100% - 1.6rem)
}

.pc .c_drag_mask:after {
    height: calc(100% - 7.2rem);
    top: 6.4rem
}

.android .c_drag_mask:after {
    height: calc(100% - 8rem);
    top: 7.2rem
}

.ios .c_drag_mask:after {
    height: calc(100% - 7rem);
    top: 6.2rem
}

.c_drag_mask_icon {
    display: block;
    margin-bottom: .8rem;
    pointer-events: none;
    position: relative;
    z-index: 2
}

.c_drag_mask_words {
    color: #6e6e6e;
    font-size: 2rem;
    font-weight: 400;
    letter-spacing: .033rem;
    line-height: 2.8rem;
    pointer-events: none;
    z-index: 2
}

.c_upload_file_item {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    align-items: center;
    display: -webkit-box;
    display: flex;
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 2rem;
    margin-bottom: 1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: break-spaces;
    word-break: break-all
}

.c_upload_file_item:last-child {
    margin-bottom: 0
}

.c_upload_file_item .apk-icon svg {
    display: block;
    height: 3.6rem;
    margin-right: 1.6rem;
    width: 3.6rem
}

.c_upload_file_item .file-name {
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden
}

.c_modal_apk_files {
    background: var(--modal-file-background);
    border-radius: .4rem;
    padding: 1.6rem
}

@media (prefers-color-scheme: dark) {
    .c_drag_mask:after {
        background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='none' stroke='%230078D4' stroke-width='4' stroke-dasharray='6, 14' stroke-linecap='square'/%3E%3C/svg%3E"),rgba(0,0,0,.9)
    }

    .c_drag_mask_words {
        color: #e1e1e1
    }

    .c_drag_mask_icon>path {
        fill: #e1e1e1
    }
}

@-webkit-keyframes DragMaskFadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes DragMaskFadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.c_cell {
    align-items: center;
    background: #fff;
    display: flex;
    line-height: 4.8rem;
    min-height: 4.8rem
}

@media (prefers-color-scheme: dark) {
    .c_cell {
        background:#222
    }
}

.c_cell_head,.c_cell_tail {
    flex-shrink: 0
}

.c_cell_middle {
    flex: 1 1;
    padding: 0 1rem
}

.c_warning {
    align-items: center;
    bottom: 100%;
    display: flex;
    font-size: 1.5rem;
    justify-content: center;
    left: 0;
    line-height: 2rem;
    padding: 1.2rem;
    position: absolute;
    width: 100%;
    z-index: 100
}

.c_warning.error {
    background: var(--error-message-background);
    color: var(--error-message-color)
}

.c_warning.disable {
    background: var(--disable-message-background);
    color: var(--disable-message-color)
}

.c_warning.info {
    background: var(--info-message-background);
    color: var(--info-message-color)
}

.c_warning.warn {
    background: var(--warn-message-background);
    color: var(--warn-message-color)
}

.c_warning.active {
    background: var(--active-message-background);
    color: var(--active-message-color)
}

.pc .c_warning {
    font-size: 1.2rem;
    font-weight: 400;
    justify-content: flex-start;
    line-height: 1.6rem;
    min-height: 4.8rem;
    padding: .8rem 1.6rem
}

.pc .c_warning button {
    border-radius: .4rem
}

.c_warning_icon {
    flex-shrink: 0;
    height: 2.4rem
}

.c_warning_icon>svg {
    height: 2.4rem;
    width: 2.4rem
}

.pc .c_warning_icon {
    height: 2rem
}

.pc .c_warning_icon>svg {
    height: 2rem;
    width: 2rem
}

.info .c_warning_icon>svg>path {
    fill: var(--info-message-color)
}

.warn .c_warning_icon>svg>path {
    fill: var(--warn-message-color)
}

.active .c_warning_icon>svg>path {
    fill: var(--active-message-color)
}

.error .c_warning_icon>svg>path {
    fill: var(--error-message-color)
}

.disable .c_warning_icon>svg>path {
    fill: var(--disable-message-color)
}

.c_warning_show_content {
    align-items: center;
    display: flex;
    justify-content: center
}

.c_warning_content {
    overflow: hidden;
    padding-left: 1.6rem
}

.pc .c_warning_content {
    padding-left: 1.2rem
}

.c_warning_btn {
    margin-left: .8rem
}

.c_sync_config_link {
    color: var(--active-color);
    cursor: pointer;
    font-weight: 500
}

.c_sync_config_link:hover {
    opacity: .7
}

.c_warning_close {
    cursor: pointer;
    flex-shrink: 0;
    height: 3.2rem;
    padding: .8rem;
    width: 3.2rem
}

.c_warning_close:hover {
    opacity: .5
}

.e_drop_file_picker {
    background: var(--input-box-background);
    bottom: -10.4rem;
    display: flex;
    flex-wrap: wrap;
    height: 10.4rem;
    left: 0;
    padding: 0 1.5rem 1rem;
    position: absolute;
    width: 100%
}

.e_drop_picker_item {
    align-items: center;
    border-radius: .6rem;
    display: flex;
    flex-direction: column;
    margin: 0;
    padding-top: 1rem;
    width: 25%
}

.e_drop_picker_item:active {
    background: rgba(0,0,0,.1)
}

.e_drop_picker_item .picker_icon {
    margin-bottom: .8rem
}

.e_drop_picker_item .picker_title {
    color: #6e6e6e;
    font-size: 1.3rem;
    font-weight: 500;
    letter-spacing: -.0078rem;
    line-height: 1.8rem;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    -webkit-user-select: none;
    user-select: none;
    white-space: nowrap;
    width: 100%
}

@media (prefers-color-scheme: dark) {
    .e_drop_picker_item .picker_icon {
        -webkit-filter:brightness(.7);
        filter: brightness(.7)
    }
}

.c_msg_form {
    background: var(--input-box-background);
    border-top: 1px solid var(--input-box-border-color);
    bottom: -.2rem;
    display: block;
    left: 0;
    margin: 0 auto;
    padding: 1.2rem 0;
    position: fixed;
    transition-duration: .2s;
    width: 100%;
    z-index: 100
}

.c_msg_form.c_msg_show_file_pucker {
    -webkit-transform: translateY(-10.4rem);
    transform: translateY(-10.4rem)
}

.c_msg_form.c_msg_show_file_pucker .c_msg_upload_svg {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.c_msg_form .c_cell_middle {
    padding: 0;
    position: relative
}

.c_msg_form .c_cell_head {
    padding: 0 .4rem
}

.c_msg_form .c_cell_head,.c_msg_form .c_cell_tail {
    align-items: center;
    display: flex
}

.c_msg_form .input {
    background-color: var(--input-background);
    border: 0!important;
    color: var(--input-color);
    display: block;
    font-size: 1.4rem;
    height: 2rem;
    line-height: 2rem;
    max-height: 8rem;
    padding: 0;
    width: 100%
}

.c_msg_form .input::-webkit-input-placeholder {
    color: #919191
}

.c_msg_form .input::-webkit-scrollbar {
    display: none
}

.c_msg_form .input_back {
    border: 0!important;
    display: block;
    font-size: 1.4rem;
    height: 2rem;
    left: 0;
    line-height: 2rem;
    padding: 0 1rem;
    pointer-events: none;
    position: absolute;
    top: 0;
    visibility: hidden;
    width: 100%;
    z-index: -1
}

.c_msg_form .input_back::-webkit-scrollbar {
    display: none
}

.pc .c_msg_form {
    background: var(--input-box-background);
    padding: 1.2rem 0
}

.c_msg_input {
    background-color: var(--input-background);
    border-radius: .4rem;
    margin-right: 1.2rem;
    min-height: 4rem;
    overflow: hidden
}

.c_msg_input .c_cell_middle {
    padding: 1rem 1rem 1rem 1.2rem;
    position: relative
}

.pc .c_msg_input {
    background-color: var(--input-background);
    border-radius: .4rem;
    margin-right: 1.2rem;
    min-height: 4rem
}

.pc .c_msg_input .c_cell_middle {
    padding: 1rem 1rem 1rem 1.2rem
}

.pc .c_msg_form .input,.pc .c_msg_form .input_back {
    border: 0!important;
    font-size: 1.4rem;
    height: 2rem;
    line-height: 2rem
}

.pc .c_msg_form .input {
    background-color: var(--input-background)
}

.c_msg_input_box {
    background: transparent;
    min-height: 3.6rem
}

.c_msg_form_btn {
    align-items: center;
    background: transparent;
    border: 0;
    cursor: pointer;
    display: flex;
    height: 3.6rem;
    -webkit-user-select: none;
    user-select: none;
    font-size: 18px;
}

.c_msg_form_btn.disabled,.c_msg_form_btn:disabled {
    cursor: auto
}

.c_msg_form_btn:focus-visible .c_msg_screenshot_svg,.c_msg_form_btn:focus-visible .c_msg_upload_svg {
    box-shadow: inset 0 0 0 1PX var(--acc-focus-border-color)
}

.c_msg_form_btn:focus-visible .c_msg_send {
    box-shadow: inset 0 0 0 1PX var(--acc-focus-border-color)
}

.c_msg_form_btn .c_msg_send {
    border-radius: .5rem;
    height: 3.2rem;
    margin-right: .5rem;
    padding: .6rem 0;
    width: 3.2rem
}

.c_msg_form_btn .c_msg_send path {
    fill: var(--input-send-btn-disbale-color)
}

.c_msg_form_btn .c_msg_send.ready path {
    fill: var(--active-color)
}

.c_msg_form_btn .loading {
    -webkit-animation: loadingCircleSpin 1.3s linear infinite;
    animation: loadingCircleSpin 1.3s linear infinite;
    height: 3rem;
    -webkit-transform: scale(.8);
    transform: scale(.8);
    width: 4.2rem
}

.c_msg_screenshot_svg {
    align-items: center;
    border-radius: .5rem;
    display: flex;
    height: 4rem;
    justify-content: center;
    transition-duration: .2s;
    width: 4rem
}

.c_msg_screenshot_svg:hover {
    background-color: var(--submit-button-hover-background)
}

.c_msg_screenshot_svg.disable:hover {
    background-color: initial
}

.c_msg_screenshot_svg>svg {
    -webkit-transform: translateY(.1rem);
    transform: translateY(.1rem);
    width: 2rem
}

.c_msg_screenshot_svg>svg>path {
    fill: var(--input-color)
}

.c_msg_send path:first-child,.c_msg_send.ready path:last-child {
    display: none
}

.c_msg_send.ready path:first-child {
    display: inline;
    display: initial
}

.c_msg_upload {
    height: 2rem;
    line-height: 2rem;
    width: 3.8rem
}

.c_msg_upload.uploading {
    height: auto
}

.c_msg_upload_svg {
    border-radius: .5rem;
    cursor: pointer;
    height: 4rem;
    padding: .8rem;
    -webkit-transform-origin: center;
    transform-origin: center;
    transition-duration: .2s;
    width: 4rem
}

.c_msg_upload_svg.opening {
    cursor: progress
}

.c_msg_upload_svg.disable {
    cursor: normal;
    pointer-events: none
}

.c_msg_upload_svg.disable circle {
    fill: #aaa
}

.pc .c_msg_upload_svg {
    height: 4rem;
    margin: 0;
    padding: .8rem;
    width: 4rem
}

.pc .c_msg_upload_svg:hover {
    background-color: var(--submit-button-hover-background)
}

.android .c_msg_upload_svg:active path,.ios .c_msg_upload_svg:active path {
    opacity: .7
}

.c_msg_upload_view,.c_msg_upload_view_button {
    height: 3.2rem;
    width: 3.8rem
}

.c_msg_upload_view_button {
    align-items: center;
    display: flex;
    justify-content: center;
    position: relative
}

.c_msg_upload_view_bg {
    background-color: var(--upload-bg-backgound);
    height: 100vh;
    left: 0;
    position: fixed;
    top: 0;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100vw;
    z-index: 100
}

.c_msg_upload_list {
    background: var(--upload-backgound);
    border-radius: .6rem;
    box-shadow: 0 .8rem .8rem 0 var(--upload-shadow);
    left: 50%;
    max-height: 50vh;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 1rem;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    width: 90vw
}

.c_msg_upload_file {
    margin-top: .8rem
}

.c_msg_upload_file:first-child {
    margin-top: 0
}

.c_msg_upload_file .f_name {
    color: var(--upload-color);
    font-size: 1.4rem;
    line-height: 1.8rem
}

.c_msg_upload_file .f_total {
    background: var(--upload-proccess);
    border-radius: 40PX;
    height: .6rem;
    width: 100%
}

.c_msg_upload_file .f_done {
    background: var(--active-color);
    border-radius: 40PX;
    height: .6rem;
    width: 100%
}

.c_msg_upload_file .f_done.success {
    background: #07b977
}

.c_msg_upload_file .f_done.fail {
    background: #c90b0b
}

.f_error_desc {
    color: #c90b0b
}

.c_msg_form .input+.focus_border {
    border: 1px solid transparent;
    border-radius: .4rem;
    height: 100%;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%
}

html[data-input=key][data-tab="1"] .c_msg_form .input:focus-visible+.focus_border {
    border: 1px solid var(--acc-focus-border-color)
}

@media screen and (-ms-high-contrast:active) {
    .c_msg_form .input+.focus_border {
        left: 1%;
        width: 98%
    }
}

@media (forced-colors:active) {
    .c_msg_form .input:focus-visible+.focus_border {
        border: 2px solid highlight!important
    }

    .c_msg_form_btn:focus-visible .c_msg_upload_svg {
        box-shadow: none
    }

    .c_msg_form_btn:focus-visible .c_msg_screenshot_svg {
        box-shadow: none
    }

    .c_msg_form_btn:focus-visible .c_msg_send {
        box-shadow: none;
        pointer-events: none
    }
}

.c_msg_item .c_msg_bg.c_welcome_card_new {
    background: var(--msg-background);
    color: var(--msg-content-color);
    font-size: 1.5rem;
    font-weight: 500;
    letter-spacing: -.0078rem;
    line-height: 2rem;
    margin-bottom: .8rem;
    max-width: 32rem;
    padding: 1.6rem
}

.c_msg_item .c_welcome_card_new:last-child {
    margin-bottom: 0
}

.welcome_input_guide {
    background-image: url(https://edge-conumer-static.azureedge.net/static/edropstatic/images/welconme_input_guide2.png);
    height: 9.6rem
}

.c_drag_drop_guide,.welcome_input_guide {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    margin: 1.6rem auto 0;
    max-width: 100%;
    width: 27.8rem
}

.c_drag_drop_guide {
    background-image: url(https://edge-conumer-static.azureedge.net/static/edropstatic/images/welcome_input_guide_bg.png);
    height: 18.1rem;
    position: relative
}

.old-cdn .welcome_input_guide {
    background-image: url(https://static.edge.microsoftapp.net/consumer/edropstatic/images/welconme_input_guide2.png)
}

.old-cdn .c_drag_drop_guide {
    background-image: url(https://static.edge.microsoftapp.net/consumer/edropstatic/images/welcome_input_guide_bg.png)
}

.c_drag_drop_guide_txt {
    color: #6e6e6e;
    font-size: 1.27807rem;
    font-weight: 400;
    left: 0;
    letter-spacing: .01622rem;
    line-height: 1.5rem;
    position: absolute;
    text-align: center;
    text-indent: -3rem;
    top: 12rem;
    width: 100%
}

.c_drag_drop_guide_file {
    pointer-events: none;
    position: absolute;
    right: 2.1rem;
    top: 7.6rem
}

.add_icon {
    height: 1.6rem;
    vertical-align: middle;
    width: 1.6rem
}

.add_icon>path {
    fill: var(--msg-content-color)
}

.c_drag_drop_guide_file_icon {
    display: block;
    height: 9.3rem;
    width: 12rem
}

.c_drag_drop_guide_file_name {
    background: #0078d4;
    border-radius: .33rem;
    color: #fff;
    font-size: 1.34373rem;
    font-weight: 400;
    height: 2.1rem;
    line-height: 2.1rem;
    margin: -2.8rem auto;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 6.8rem
}

@media (prefers-color-scheme: dark) {
    .welcome_input_guide {
        background-image:url(https://edge-conumer-static.azureedge.net/static/edropstatic/images/welconme_input_guide_dark2.png)
    }

    .c_drag_drop_guide {
        background-image: url(https://edge-conumer-static.azureedge.net/static/edropstatic/images/welcome_input_guide_bg_dark.png)
    }

    .old-cdn .welcome_input_guide {
        background-image: url(https://static.edge.microsoftapp.net/consumer/edropstatic/images/welconme_input_guide_dark2.png)
    }

    .old-cdn .c_drag_drop_guide {
        background-image: url(https://static.edge.microsoftapp.net/consumer/edropstatic/images/welcome_input_guide_bg_dark.png)
    }
}

.c_msg_item .c_msg_bg.c_upsell_card_new {
    background: var(--msg-background);
    color: var(--msg-content-color);
    font-size: 1.5rem;
    font-weight: 400;
    letter-spacing: -.0078rem;
    line-height: 2rem;
    margin-bottom: .8rem;
    max-width: 32rem;
    padding: 1.6rem
}

.c_msg_item .c_msg_bg.c_upsell_card_new.a {
    padding-bottom: 0
}

.c_msg_item .c_msg_bg.c_upsell_card_new .mobile_usage {
    height: 13.7rem;
    margin: 0 auto;
    overflow: visible;
    width: 9.5rem
}

.c_msg_item .c_msg_bg.c_upsell_card_new .mobile_usage_img {
    display: block
}

.c_msg_item .c_msg_bg.c_upsell_card_new:last-child {
    margin-bottom: 0
}

.c_upsell_card_new_desc,.c_upsell_no_edge_on_mobile {
    margin-bottom: 1.6rem
}

button.c_upsell_go_download {
    border-radius: 4PX;
    height: 3.2rem;
    max-width: 100%;
    width: 27.5rem
}

.c_popup_menu {
    background-color: var(--menu-background);
    border-radius: .4rem;
    display: none;
    -webkit-filter: drop-shadow(0 1rem 10rem var(--menu-shadow));
    filter: drop-shadow(0 1rem 10rem var(--menu-shadow));
    font-size: 1.4rem;
    line-height: 2rem;
    max-height: 70vh;
    max-width: 90vw;
    position: absolute;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transform-origin: center;
    transform-origin: center;
    transition-duration: 0s;
    z-index: 100
}

.c_popup_menu.show {
    display: block;
    opacity: .01
}

.c_popup_menu.show.visible {
    opacity: 1
}

.c_popup_menu_scroll {
    overflow: auto
}

.android .c_popup_menu,.ios .c_popup_menu {
    border-radius: 1.4rem
}

.pc .c_popup_menu {
    border: 1px solid var(--menu-border-color);
    box-shadow: 0 16px 32px rgba(0,0,0,.14);
    -webkit-filter: none;
    filter: none
}

.c_pop_arrow {
    height: 1.3rem;
    position: absolute;
    width: 4.7rem
}

.c_pop_arrow path {
    fill: var(--menu-background)
}

.c_msg_menu_content_item {
    align-items: center;
    border-radius: 1.4rem;
    color: var(--menu-color);
    cursor: pointer;
    display: flex;
    font-size: 1.2rem;
    line-height: 2.6rem;
    min-width: 15.8rem;
    overflow: hidden;
    padding: .8rem 1.9rem;
    -webkit-user-select: none;
    user-select: none
}

.c_msg_menu_content_item:active {
    background-color: var(--menu-hover-background);
    -webkit-filter: brightness(.8);
    filter: brightness(.8)
}

.c_msg_menu_content_item .icon {
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    margin-right: .8rem;
    text-align: center;
    width: 2rem
}

.c_msg_menu_content_item .icon>svg {
    height: 2rem;
    width: 2rem
}

.c_msg_menu_content_item .icon>svg path {
    fill: var(--menu-color)
}

.c_msg_menu_content_item .name {
    overflow: hidden;
    text-overflow: ellipsis
}

.pc .c_msg_menu_content_item {
    border-radius: .5rem;
    line-height: 1.6rem;
    padding: .8rem 1.4rem
}

.pc .c_msg_menu_content_item:hover {
    background-color: var(--menu-hover-background)
}

.pc .c_msg_menu_content_item:focus-visible {
    background-color: var(--menu-hover-background);
    box-shadow: inset 0 0 0 1px var(--acc-focus-border-color)
}

.c_msg_menu_btn_svg {
    pointer-events: none;
    width: 2.24rem
}

.c_msg_menu_btn_svg>path {
    fill: var(--msg-menu-color)
}

.c_menu_holder {
    display: inline-block;
    height: 0;
    position: relative;
    vertical-align: bottom;
    width: 0
}

.c_msg_state {
    bottom: 0;
    height: 2rem;
    left: -2.8rem;
    position: absolute;
    -webkit-user-select: none;
    user-select: none;
    width: 2rem
}

.c_msg_state.remote {
    left: auto;
    right: -2.8rem
}

fluent-progress-ring.c_msg_upload_progress {
    height: 1.8rem;
    margin: .2rem 0 0 .2rem;
    width: 1.8rem
}

fluent-progress-ring.c_msg_upload_progress::part(indeterminate-indicator-1) {
    stroke: #0f9b3d!important
}

.c_msg_state_icon {
    cursor: pointer;
    height: 2rem;
    width: 2rem
}

.c_msg_state_icon>path {
    fill: var(--error-message-color)
}

.c_msg_shortcut_btn {
    align-items: center;
    border-radius: .4rem;
    cursor: pointer;
    display: inline-flex;
    height: 2.24rem;
    margin-right: .6rem;
    padding: 0 .4rem;
    vertical-align: middle;
    white-space: nowrap
}

.c_msg_shortcut_btn:active {
    background-color: var(--menu-hover-background);
    -webkit-filter: brightness(.8);
    filter: brightness(.8)
}

.c_msg_shortcut_btn .btn {
    height: 1.6rem;
    margin-right: .4rem;
    vertical-align: middle;
    width: 1.6rem
}

.c_msg_shortcut_btn .btn>path {
    fill: var(--msg-menu-color)
}

.c_msg_shortcut_btn .name {
    color: var(--msg-menu-color);
    display: inline-block;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    max-width: 6.8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    white-space: nowrap
}

.pc .c_msg_shortcut_btn:hover {
    background-color: var(--menu-hover-background)
}

.pc .c_msg_shortcut_btn:focus-visible {
    background-color: var(--menu-hover-background)
}

.android .c_msg_shortcut_btn>span,.android .c_msg_shortcut_btn>svg,.android .c_msg_shortcut_state>span,.android .c_msg_shortcut_state>svg,.ios .c_msg_shortcut_btn>span,.ios .c_msg_shortcut_btn>svg,.ios .c_msg_shortcut_state>span,.ios .c_msg_shortcut_state>svg {
    -webkit-transform: translateY(2Px);
    transform: translateY(2Px)
}

.c_msg_shortcut_state {
    display: inline-block;
    margin-right: .6rem;
    padding: 0 .4rem;
    vertical-align: middle
}

fluent-progress-ring.c_msg_download_progress {
    display: inline-block;
    height: 1.6rem!important;
    margin-right: .4rem;
    vertical-align: middle;
    width: 1.6rem
}

fluent-progress-ring.c_msg_download_progress::part(indeterminate-indicator-1) {
    stroke: #0f9b3d!important
}

.c_msg_bg.c_msg_img .c_msg_body {
    align-items: center;
    min-height: 5rem;
    padding: 0;
    position: relative
}

.c_msg_bg.c_msg_img .c_msg_body:active {
    -webkit-filter: brightness(.8);
    filter: brightness(.8)
}

.c_img_content {
    border-radius: .4rem;
    cursor: pointer;
    display: block;
    margin: 0 auto;
    max-height: 16rem;
    max-width: 100%
}

.c_img_content.uploading {
    width: 16rem
}

.c_img_content.failed {
    background: rgba(0,0,0,.75);
    border-radius: .4rem;
    cursor: normal;
    height: 16rem;
    width: 18rem
}

.c_img_content .c_img_failed_image {
    height: 3rem;
    width: 3.6rem
}

.c_img_content .c_msg_failed_desc {
    color: #e1e1e1;
    font-size: 1.2rem;
    line-height: 1.6rem;
    margin-top: 1.4rem
}

.c_img_err_cover {
    align-items: center;
    background: rgba(0,0,0,.5);
    color: #fff;
    display: flex;
    flex-direction: column;
    font-size: 1.2rem;
    font-weight: 400;
    height: 100%;
    justify-content: center;
    left: 0;
    line-height: 1.6rem;
    padding: 1rem 2rem;
    pointer-events: none;
    position: absolute;
    text-align: center;
    top: 0;
    width: 100%
}

.c_img_err_cover>svg {
    height: 2.4rem;
    margin-bottom: .8rem;
    width: 2.4rem
}

.c_img_loading {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 16rem;
    justify-content: center;
    margin: 0 auto;
    width: 7rem
}

.c_img_loading-spin {
    display: block
}

.c_img_loading_words {
    color: var(--msg-content-color);
    font-size: 1.2rem;
    line-height: 1.6rem;
    padding-top: .5rem;
    white-space: nowrap
}

.c_msg_bg.c_msg_file .c_msg_body {
    background-color: var(--msg-file-background);
    cursor: pointer;
    padding: 1.2rem 1.6rem
}

.c_msg_bg.c_msg_file .c_msg_body:active {
    -webkit-filter: brightness(.94);
    filter: brightness(.94)
}

.c_msg_bg.c_msg_file .c_msg_body.failed {
    cursor: normal
}

.c_msg_file_tit {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    color: var(--msg-file-tit-color);
    display: -webkit-box;
    font-size: 1.5rem;
    letter-spacing: -.04rem;
    line-height: 2rem;
    overflow: hidden
}

.c_msg_file_desc {
    color: var(--msg-file-desc-color);
    font-size: 1.2rem;
    letter-spacing: .006rem;
    line-height: 1.6rem;
    margin-top: .4rem
}

.c_msg_file_desc.error {
    color: #d92c2c
}

.c_msg_body>.content .c_msg_url {
    color: var(--active-color)
}

.c_sync_transport_bg {
    align-items: center;
    background: var(--header-background);
    bottom: 0;
    display: flex;
    font-size: 1.5rem;
    height: 6.5rem;
    justify-content: center;
    left: 0;
    line-height: 2rem;
    padding: 1.4rem 1.6rem;
    position: fixed;
    width: 100%;
    z-index: 101
}

.c_sync_transport_bg .anticon-spin {
    -webkit-animation: loadingCircleSpin 1.2s linear infinite;
    animation: loadingCircleSpin 1.2s linear infinite;
    height: 2rem;
    width: 2rem
}

.c_sync_transport_bg .anticon-spin>path {
    fill: #212121
}

.c_sync_transport_icon {
    height: 2rem;
    padding: 0 1.2rem
}

.c_sync_transport {
    align-items: center;
    color: #404040;
    display: flex;
    flex: 1 1;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem
}

@media (prefers-color-scheme: dark) {
    .c_sync_transport_bg {
        border-top-color:#555
    }

    .c_sync_transport_icon svg.anticon-spin>path {
        fill: #efefef
    }

    .c_sync_transport {
        color: #ddd
    }
}

.app>.router-wrapper>.page.c_msg {
    background: var(--page-background);
    overflow-y: hidden;
    padding: 0
}

.c_msg_list {
    /*  left: 0;
    overflow-anchor: none;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 2.6rem 1.6rem 6rem;
    position: fixed;
	top: 60px;
    bottom: 100px;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100%;
    will-change: scroll-position */
    overflow-x: hidden;
    overflow-y: auto;
    padding: 1.6rem .5rem;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0px;
    bottom: 0px;
    will-change: scroll-position;
    background-color: #eeeeee52;
}
.c_msg_list_transcript {
    top: 48vh !important;
}

.c_talk_list {
    /* left: 0;
    overflow-anchor: none;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 2.6rem 1.6rem 6rem;
    position: fixed;
    top: 60px;
    bottom: 53vh;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100%;
    will-change: scroll-position;
    background-color: #fff;
    border-bottom: 1px solid #ccc;
    display:none;*/
    overflow-x: hidden;
    overflow-y: auto;
    padding: 2.6rem 1.6rem 6rem;
    position: fixed;
    top: 0px;
    -webkit-transform: translateZ(0);
    width: 100%;
    will-change: scroll-position;
    background-color: #fff;
}

.c_talk_list_show {
    display: block;
    background-color: white;
    bottom: 53vh;
    border-bottom:1px solid #ccc;
}

.c_msg_loading {
    height: 5rem;
    left: 50%;
    margin: 0 auto;
    padding: 1rem;
    position: absolute;
    top: 7rem;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 5rem;
    z-index: 111
}

.c_msg_loading svg {
    height: 3rem;
    width: 3rem
}

.c_msg_loading svg>circle {
    stroke-width: 1PX!important
}

@supports (height: constant(safe-area-inset-top)) or (height:env(safe-area-inset-top)) {
    .c_msg_list #c_msg_content_list {
        /*padding-bottom:4.2rem*/
    }
}

.pc .c_msg_list::-webkit-scrollbar {
    width: 4PX
}

.pc .c_msg_list::-webkit-scrollbar-thumb {
    background: hsla(0,0%,49%,.3)
}

.pc .c_msg_list::-webkit-scrollbar-track {
    background: hsla(0,0%,49%,.1);
    border-radius: 0
}

.pc .c_msg_list #c_msg_content_list,.pc .c_msg_list .c_msg_placeholder {
    width: calc(100% + 4PX)
}

.pc .c_msg {
    padding: 0 2rem
}

.c_msg_item {
    display: flex;
    padding: 1.6rem 2.4rem 0 3rem;
    position: relative
}

.c_msg_item.type-1,.c_msg_item.type-2,.c_msg_item.type-3,.c_msg_item.type-4 {
    display: block;
    padding-left: 0;
    padding-right: 0
}

.c_msg_item .c_msg_bg {
    max-width: 28.5rem;
    min-width: 12rem;
    position: relative
}

.c_msg_item .c_msg_bg.c_msg_img {
    min-width: 18rem
}

.c_msg_item .c_msg_bg.c_msg_file {
    min-width: 22.4rem
}

.c_msg_item.self {
    justify-content: flex-end;
    padding-left: 3rem;
    padding-right: 0;
    padding-top: 1.6rem
}

.c_msg_item.self .c_msg_bg {
    background-color: rgba(85,177,126,.1)
}

.c_msg_item:first-child {
    padding-top: 1.6rem!important
}

.c_msg_item:first-child .c_today_flag {
    display: none!important
}

.c_msg_item+.type-1 {
    display: none
}

.pc .c_msg_item .c_msg_bg:focus-visible {
    box-shadow: 0 0 0 1PX var(--acc-focus-border-color)
}

.pc .c_msg_item .c_msg_bg.c_msg_file .c_msg_body:hover {
    box-shadow: 0 .3px .9px rgba(0,0,0,.1),0 1.6px 3.6px rgba(0,0,0,.13)
}

.pc .c_msg_item .c_msg_bg.c_msg_img .c_msg_body {
    overflow: visible
}

.pc .c_msg_item .c_msg_bg.c_msg_img .c_img_content:hover {
    box-shadow: 0 .3px .9px rgba(0,0,0,.1),0 1.6px 3.6px rgba(0,0,0,.13)
}

@media (prefers-color-scheme: dark) {
    .pc .c_msg_item .c_msg_bg.c_msg_file .c_msg_body:hover {
        box-shadow:0 .3px .9px rgba(0,0,0,.6),0 1.6px 3.6px rgba(0,0,0,.63)
    }

    .pc .c_msg_item .c_msg_bg.c_msg_img .c_img_content:hover {
        box-shadow: 0 .3px .9px rgba(0,0,0,.1),0 1.6px 3.6px rgba(0,0,0,.13)
    }
}

.c_msg_item.today {
    padding-top: 5rem
}

.c_msg_item.today .c_msg_header_icon {
    top: 5rem
}

.c_msg_item.today .c_today_flag {
    color: var(--msg-time-color);
    display: block;
    font-size: 1.2rem;
    left: 0;
    position: absolute;
    text-align: center;
    top: 2rem;
    width: 100%
}

.c_msg_item.today .c_today_flag:after {
    background: var(--msg-time-color);
    content: "";
    display: block;
    height: 1PX;
    left: 0;
    opacity: .3;
    position: absolute;
    top: .7rem;
    width: 100%
}

.c_msg_item.today .c_msg_today {
    background-color: var(--page-background);
    display: inline-block;
    padding: 0 1rem;
    position: relative;
    z-index: 1
}

.c_msg_item.self.today {
    padding-top: 5rem
}

.c_msg_item.self.today .c_today_flag {
    top: 2rem
}

.c_msg_item.self.today+.c_msg_item.self.today {
    padding-top: 1.6rem
}

.c_msg_item.self.today+.c_msg_item.self.today .c_msg_header_icon {
    top: 1.6rem
}

.c_msg_item.self.today+.c_msg_item.self.today .c_today_flag {
    display: none
}

.c_msg_item.today+.c_msg_item.today {
    padding-top: 1.6rem
}

.c_msg_item.today+.c_msg_item.today .c_msg_header_icon {
    top: 1.6rem
}

.c_msg_item.today+.c_msg_item.today .c_today_flag {
    display: none
}

.c_msg_bg {
    background-color: var(--msg-background);
    border-radius: .4rem
}

.c_msg_content {
    padding: 1.2rem
}

.c_msg_device {
    color: var(--msg-device-name-color);
    font-size: 1.2rem;
    height: 1.6rem;
    left: 2.4rem;
    line-height: 1.6rem;
    overflow: hidden;
    position: absolute;
    text-overflow: ellipsis;
    top: -2.4rem;
    white-space: nowrap;
    width: 80%
}

.self .c_msg_device {
    display: none
}

.c_msg_header {
    display: flex;
    font-size: 1.2rem;
    height: 2.24rem;
    justify-content: space-between;
    line-height: 1.6rem;
    margin-bottom: .6rem
}

.c_msg_header .msg_time {
    color: var(--msg-time-color);
    line-height: 2rem;
    margin-right: 2rem;
    max-width: 10.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.c_msg_header .menu_btn {
    color: var(--menu-color);
    cursor: pointer;
    font-size: 1rem;
    margin-top: -.2rem;
    min-width: 2rem;
    text-align: right;
    white-space: nowrap
}

.c_msg_header .menu_btn .c_msg_menu_btn_ {
    border-radius: .4rem;
    height: 2.24rem;
    vertical-align: middle;
    width: 2.24rem
}

.c_msg_header .menu_btn>.c_msg_menu_btn_:active {
    background-color: var(--menu-hover-background);
    -webkit-filter: brightness(.8);
    filter: brightness(.8)
}

.pc .c_msg_header .menu_btn>.c_msg_menu_btn_:hover {
    background-color: var(--menu-hover-background)
}

html[data-input=key] .pc .c_msg_header .menu_btn>.c_msg_menu_btn_:focus-visible {
    background-color: var(--menu-hover-background)
}

.c_msg_body {
    border-radius: .4rem;
    display: flex;
    overflow: hidden
}

.c_msg_body,.c_msg_body .c_img_content {
    transition-duration: .2s
}

.c_msg_body>.content {
    color: var(--msg-content-color);
    flex: 1 1;
    font-size: 1.5rem;
    line-height: 2rem;
    -webkit-user-select: text;
    user-select: text;
    white-space: break-spaces;
    word-break: break-word
}

.c_msg_body>.file {
    cursor: pointer;
    height: 4rem;
    margin-left: .4rem;
    margin-right: 1.6rem;
    text-align: center;
    width: 4rem
}

.c_msg_body>.file>svg {
    width: 4rem
}

.c_msg_body>.file>svg.unknown path {
    fill: #aaa
}

.c_msg_body>.file>svg.unknown text {
    fill: #888
}

@media (prefers-color-scheme: dark) {
    .c_msg_body>.file>svg:not(.unknown) {
        -webkit-filter:brightness(75%);
        filter: brightness(75%)
    }
}

.c_msg_header_icon {
    height: 2rem;
    left: 0;
    position: absolute;
    top: 1.6rem;
    width: 2rem;
    z-index: 1
}

.c_msg_header_icon path {
    fill: #44a856
}

.c_msg_header_icon circle {
    stroke: #44a856;
    fill: #fff
}

.type-1 .c_msg_header_icon path,.type-2 .c_msg_header_icon path,.type-3 .c_msg_header_icon path,.type-4 .c_msg_header_icon path {
    fill: #fff
}

.type-1 .c_msg_header_icon circle,.type-2 .c_msg_header_icon circle,.type-3 .c_msg_header_icon circle,.type-4 .c_msg_header_icon circle {
    stroke: #e1dfdd;
    fill: #44a856
}

@media (prefers-color-scheme: dark) {
    .c_msg_header_icon path {
        fill:#fff
    }

    .c_msg_header_icon circle {
        fill: transparent;
        stroke: #edebe9
    }

    .type-1 .c_msg_header_icon circle,.type-2 .c_msg_header_icon circle,.type-3 .c_msg_header_icon circle,.type-4 .c_msg_header_icon circle {
        stroke: #f3f2f1;
        fill: #44a856
    }
}

.self .c_msg_header_icon {
    display: none
}

.c_msg_placeholder {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjIwIj48cmVjdCB3aWR0aD0iNjAlIiBoZWlnaHQ9IjkwIiB4PSIzNSIgeT0iMjAiIHJ4PSI0IiByeT0iNCIgZmlsbD0icmdiYSgwLDAsMCwwLjA4KSIvPjxjaXJjbGUgY3g9IjExLjUiIGN5PSIzNCIgcj0iMTEuNSIgZmlsbD0icmdiYSgwLDAsMCwwLjA4KSIvPjxyZWN0IHdpZHRoPSI2MCUiIGhlaWdodD0iOTAiIHg9IjQwJSIgeT0iMTI4IiByeD0iNCIgcnk9IjQiIGZpbGw9InJnYmEoODUsIDE3NywgMTI2LCAwLjEpIi8+PC9zdmc+)
}

.c_setting_select_file_open,.c_setting_select_image_open {
    min-width: 16rem
}

.c_setting_select_file_open button,.c_setting_select_image_open button {
    background: var(--setting-item-background);
    border-radius: .4rem
}

.c_one_drive {
    background: var(--setting-item-background);
    border: 1px solid var(--setting-item-border);
    border-radius: 4PX;
    padding: 1.5rem
}

.c_one_drive a,.c_one_drive a:hover {
    color: var(--active-color)
}

.c_one_drive_tit {
    color: var(--setting-onedrive-tit);
    font-size: 1.7rem;
    font-weight: 600;
    line-height: 2.2rem;
    margin-bottom: 1.7rem
}

.c_one_drive_capacity {
    margin-bottom: 1rem
}

.c_one_drive_capacity .c_capacity_progress {
    height: 1.6rem;
    margin-top: .8rem;
    width: 10rem
}

.c_capacity_total {
    background: #f3f3f3;
    border-radius: 2PX;
    height: .8rem;
    overflow: hidden
}

.c_capacity_used {
    -ms-high-contrast-adjust: none;
    height: 100%
}

@media screen and (-ms-high-contrast:active) {
    .c_capacity_total {
        border: 1px solid transparent
    }
}

.c_capacity_decs {
    color: var(--setting-color);
    font-size: 1.2rem;
    line-height: 1.6rem;
    margin-top: .8rem
}

.c_one_drive_link {
    align-items: center;
    background: transparent;
    display: flex;
    line-height: 4.4rem;
    min-height: 4.5rem;
    position: relative;
    text-align: left;
    width: 100%
}

.c_one_drive_link>a {
    display: block;
    flex: 1 1;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 4.4rem;
    -webkit-transform: all .2s;
    transform: all .2s
}

.pc .c_one_drive_link>a {
    display: inline;
    flex: initial;
    line-height: 1.3;
    text-decoration: underline
}

.pc .c_one_drive_link>a:hover {
    -webkit-filter: brightness(.8);
    filter: brightness(.8)
}

.c_one_drive_capacity_tit {
    color: var(--setting-color);
    font-size: 1.7rem;
    font-weight: 400;
    line-height: 2.2rem;
    margin-bottom: .4rem
}

.pc .c_one_drive_capacity_tit {
    display: none
}

.android .c_one_drive_link,.android .c_one_drive_link:nth-child(2),.ios .c_one_drive_link,.ios .c_one_drive_link:nth-child(2) {
    border-top: 1px solid var(--setting-onedrive-link-border)
}

.android .c_one_drive_link>a,.ios .c_one_drive_link>a {
    font-size: 1.7rem;
    font-weight: 400;
    line-height: 4.5rem
}

.android .c_capacity_decs,.ios .c_capacity_decs {
    color: #6e6e6e
}

.c_msg_bg.c_upsell_card {
    background: transparent;
    padding: 0
}

.c_upsell_item {
    background: var(--setting-item-background);
    border: 1px solid var(--setting-item-border);
    border-radius: 4PX;
    padding: 1.5rem
}

.c_upsell_scan {
    margin-bottom: 1.6rem
}

.c_upsell_illustration_box {
    height: 15rem;
    margin: 0 auto;
    overflow: hidden;
    width: 22.7rem
}

.c_upsell_illustration {
    display: block;
    height: auto;
    margin-left: -2.5rem;
    width: 100%
}

@media (prefers-color-scheme: dark) {
    .c_upsell_illustration_box {
        -webkit-filter:brightness(90%);
        filter: brightness(90%)
    }
}

.c_upsell_desc {
    color: var(--fre-desc-color);
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem
}

.c_upsell_tit {
    color: var(--fre-tit-color);
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 2.2rem;
    padding: 0 0 .8rem
}

.c_welcome_agreement.upsell {
    padding: 0 1.5rem
}

.c_upsell_send_desc {
    color: var(--fre-desc-color);
    font-size: 1.4rem;
    font-weight: 300;
    line-height: 2rem;
    margin-bottom: 1.2rem
}

.c_upsell_form_row {
    display: flex
}

.c_upsell_radio {
    cursor: pointer;
    margin-right: 1rem
}

.c_upsell_select {
    flex-shrink: 0;
    margin: 0 .8rem 0 0;
    overflow: hidden;
    width: 8rem
}

.c_upsell_phone_input {
    flex: 1 1;
    min-width: 0
}

.c_upsell_section_menu_bg {
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1005
}

.c_upsell_section_menu {
    height: 20rem;
    left: 50%;
    overflow-y: auto;
    position: fixed;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    width: 20rem
}

.c_upsell_section_menu_item {
    display: block;
    width: 17rem
}

.c_upsell_send_desc2 {
    color: var(--fre-desc-color);
    font-size: 1.2rem;
    line-height: 1.6rem;
    margin-top: .6rem
}

.c_welcome_agreement.upsell {
    display: inline-block;
    font-size: 1.2rem;
    line-height: 1.6rem;
    margin: 1rem 0 2.4rem;
    padding: 0
}

.c_upsell_select>div[role=listbox] {
    left: 50%;
    position: fixed;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    width: 20rem;
    z-index: 1
}

.c_upsell_contact-section-error {
    color: #e83a3a;
    font-size: 1.2rem;
    line-height: 1.6rem;
    margin-left: 2.6rem
}

.c_upcell_send_link {
    align-items: center;
    background: var(--fre-button-color);
    border: 0;
    border-radius: .2rem;
    color: #fff;
    display: flex;
    font-size: 1.2rem;
    height: 3.2rem;
    justify-content: center;
    line-height: 3.2rem;
    margin: 0 auto;
    width: 17rem
}

.c_upcell_send_link:hover {
    -webkit-filter: brightness(85%);
    filter: brightness(85%)
}

.c_upcell_send_link:focus-visible {
    -webkit-filter: brightness(85%);
    filter: brightness(85%)
}

.c_upcell_send_link.disable {
    background: var(--fre-button-disable-color);
    color: #000
}

.c_upcell_send_link.disable:hover {
    -webkit-filter: brightness(100%);
    filter: brightness(100%)
}

.c_upcell_send_link_ing {
    -webkit-animation: loadingCircleSpin 1.3s linear infinite;
    animation: loadingCircleSpin 1.3s linear infinite;
    height: 2rem;
    -webkit-transform: scale(.8);
    transform: scale(.8);
    width: 2rem
}

.c_upcell_send_link_ing>path {
    fill: #fff
}

.c_setting {
    background: var(--page-background);
    padding: 0 1.6rem
}

.c_setting_tit {
    color: var(--normal-color);
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 2rem;
    margin-bottom: 1.7rem
}

.c_setting_card {
    margin-bottom: 1.8rem
}

.c_setting_card .c_card_content_border {
    background: var(--setting-item-background);
    border: 1px solid var(--setting-item-border);
    border-radius: 4PX;
    padding: 1.5rem
}

.pc .c_setting {
    background: var(--setting-page-background)
}

.c_setting_card_item {
    align-items: center;
    color: var(--setting-color);
    display: flex;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2rem;
    padding: 1.4rem 0
}

.c_setting_card_item:first-child {
    padding-top: 0
}

.c_setting_card_item:last-child {
    padding-bottom: 0
}

.c_setting_card_item_tit {
    flex: 1 1;
    margin-right: 2rem
}

.c_setting_card_item_content,.c_setting_card_item_tit {
    align-items: center;
    display: flex
}

.android .c_setting_tit,.ios .c_setting_tit {
    color: #6e6e6e;
    font-size: 1.3rem;
    font-weight: 400;
    letter-spacing: -.008rem;
    line-height: 1.8rem;
    margin-bottom: .8rem
}

.android .c_setting_card_content,.ios .c_setting_card_content {
    margin-left: -1.6rem;
    width: 100vw
}

.android .c_one_drive,.ios .c_one_drive {
    border: 0;
    border-radius: 0;
    padding: 1.5rem 0 0
}

.android .c_card_content_border,.ios .c_card_content_border {
    border: 0;
    border-radius: 0;
    padding: 0
}

.android .c_one_drive_info,.android .c_one_drive_link,.ios .c_one_drive_info,.ios .c_one_drive_link {
    padding: 0 1.5rem
}

.android .c_setting_card_item,.ios .c_setting_card_item {
    border-top: 1px solid var(--setting-onedrive-link-border);
    padding-left: 1.5rem;
    padding-right: 1.5rem
}

.android .c_setting_card_item:first-child,.ios .c_setting_card_item:first-child {
    border-top: 1px solid transparent;
    padding-top: 1.4rem
}

.android .c_setting_card_item:last-child,.ios .c_setting_card_item:last-child {
    padding-bottom: 1.4rem
}

.android .c_setting_toggle::part(switch),.ios .c_setting_toggle::part(switch) {
    border: 0;
    height: 3.1rem;
    transition: all .2s ease-in-out;
    width: 5.1rem
}

.android .c_setting_toggle span[slot=switch],.ios .c_setting_toggle span[slot=switch] {
    background: #fff;
    border: 1px solid rgba(0,0,0,.04);
    border-radius: 28PX;
    box-shadow: 0 3PX 8PX rgba(0,0,0,.15),0 3PX 1PX rgba(0,0,0,.06);
    height: 2.8rem;
    left: 1PX;
    top: 1PX;
    transition: all .2s ease-in-out;
    width: 2.8rem
}

.android .c_setting_toggle[current-value=on] span[slot=switch] slot[name=switch] svg,.ios .c_setting_toggle[current-value=on] span[slot=switch] slot[name=switch] svg {
    left: 22PX
}

.android .c_setting_toggle::part(status-message),.ios .c_setting_toggle::part(status-message) {
    display: none
}

.c_up_sell {
    background: var(--setting-page-background);
    overflow-x: hidden;
    overflow-y: auto;
    padding: 2.4rem 1.6rem
}

.c_pop_menu_btns {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-size: 1rem;
    height: 100%;
    position: relative;
    -webkit-user-select: none;
    user-select: none
}

.c_head_menu {
    background-color: var(--menu-background);
    border-radius: .5rem;
    box-shadow: 0 .6rem 1rem -1rem var(--menu-shadow);
    display: none;
    line-height: 3.6rem;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 7.5rem;
    transition-duration: .2s;
    width: 16rem
}

.c_head_menu.v1 {
    display: block
}

.c_head_menu.v2 {
    opacity: 1
}

.c_head_menu>li {
    border-bottom: 1px solid var(--menu-border-color);
    border-radius: .5rem;
    font-size: 1.2rem;
    padding: 0 1rem;
    transition-duration: .2s
}

.c_head_menu>li,.c_head_menu>li a,.c_head_menu>li a:hover {
    color: var(--menu-color)
}

.c_head_menu>li:hover {
    background-color: var(--menu-hover-background)
}

.c_head_menu>li:last-child {
    border-bottom: 0
}

.c_head_menu:before {
    background-color: var(--menu-background);
    content: "";
    display: block;
    height: 1rem;
    position: absolute;
    right: .8rem;
    top: -.5rem;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 1rem;
    z-index: -1
}

.c_pop_menu_btn {
    border-radius: .4rem;
    display: inline-block;
    height: 3.2rem;
    margin-right: .4rem;
    padding: .6rem;
    width: 3.2rem;
    font-size: 18px;
}

.c_pop_menu_btn:active {
    background-color: var(--default-button-active-background)
}

.c_pop_menu_btn:last-child {
    margin-right: -.8rem
}

.c_pop_menu_btn.pulling {
    background-color: initial!important;
    cursor: default!important
}

.android .c_pop_menu_btn,.ios .c_pop_menu_btn {
    padding: .4rem
}

.android .c_pop_menu_btn .c_pop_menu_display,.ios .c_pop_menu_btn .c_pop_menu_display {
    width: 2.4rem
}

.pc .c_pop_menu_btn:hover {
    background-color: var(--default-button-hover-background)
}

html[data-input=key] .pc .c_pop_menu_btn:focus-visible {
    background-color: var(--default-button-hover-background);
    box-shadow: none!important
}

.c_pop_menu_close {
    color: var(--active-color);
    display: inline-block;
    font-size: 1.7rem;
    font-weight: 500;
    margin-left: 1.5rem;
    vertical-align: sub
}

.c_pop_menu_display,.c_pop_menu_right_icon {
    display: block;
    width: 2rem
}

.c_pop_menu_display>path,.c_pop_menu_right_icon>path {
    fill: var(--header-title-color)
}

.pc .c_pop_menu_display>path,.pc .c_pop_menu_right_icon>path {
    fill: var(--header-title-pc-color)
}

.icon-loading-circle {
    -webkit-animation: loadingCircleSpin 1s linear infinite;
    animation: loadingCircleSpin 1s linear infinite
}

.c_header {
    background: var(--header-background);
    height: 5.6rem;
    left: 0;
    padding: 0 2rem;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1040
}

.ios .c_header {
    height: 5.4rem;
    padding: 0 1.6rem
}

.android .c_header {
    background: var(--header-background-android);
    box-shadow: 0 .8px 1.8px rgba(0,0,0,.13);
    height: 6.4rem;
    padding: 0 1.6rem
}

.pc .c_header {
    border-bottom: 1px solid rgba(0,0,0,.1)
}

.c_header_back_word {
    color: var(--active-color);
    font-size: 1.7rem;
    -webkit-user-select: none;
    user-select: none
}

.pc .c_header_back_word {
    color: var(--header-title-pc-color);
    font-size: 1.6rem;
    font-weight: 600
}

.c_header_container {
    height: 100%;
    line-height: 5.6rem;
    position: relative
}

.c_header_container .c_pop_menu_close {
    vertical-align: middle
}

.ios .c_header_container {
    line-height: 5.4rem
}

.android .c_header_container {
    line-height: 6.4rem
}

.c_header_left_icon {
    align-items: center;
    display: flex;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0
}

.c_header_left_icon>.c_header_back {
    display: block;
    height: 2.4rem;
    width: 2.4rem
}

.c_header_left_icon>.c_header_back>svg.back {
    cursor: pointer;
    display: block;
    height: 2.4rem;
    width: 2.4rem
}

.c_header_left_icon>.c_header_back>svg path {
    fill: var(--active-color)
}

.pc .c_header_left_icon>.c_header_back {
    display: block;
    height: 3.2rem;
    margin-right: .8rem;
    width: 3.2rem
}

.pc .c_header_left_icon>.c_header_back:hover {
    background-color: var(--default-button-hover-background)
}

.pc .c_header_left_icon>.c_header_back:active {
    background-color: var(--default-button-active-background)
}

.pc .c_header_left_icon>.c_header_back>svg {
    border-radius: .4rem;
    cursor: pointer;
    display: block;
    height: 3.2rem;
    padding: .6rem;
    width: 3.2rem
}

.pc .c_header_left_icon>.c_header_back>svg path {
    fill: var(--header-title-pc-color)
}

.c_header_right_icon {
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

.c_header_right_icon>a {
    display: block;
    padding: 0 1rem
}

.c_header_right_icon>a:active {
    background: var(--default-button-hover-background)
}

.c_header_right_icon>a>svg {
    height: 2.4rem;
    pointer-events: none;
    width: 2.4rem
}

.c_header_title {
    color: var(--header-title-color);
    flex: 1 1;
    font-size: 1.7rem;
    -webkit-user-select: none;
    user-select: none
}

.c_header_title.setting {
    text-align: center
}

.pc .c_header_title {
    color: var(--header-title-pc-color);
    font-size: 1.6rem;
    font-weight: 600
}

.pc .c_header_title.setting {
    display: none
}

.ios .c_header_title {
    text-align: center
}

html[data-input=key] .pc .c_header_left_icon>.c_header_back:focus-visible>svg {
    background-color: var(--default-button-hover-background)
}

.c_msg_bg.c_welcome_card {
    background: var(--fre-card-background);
    border-radius: 1rem;
    padding: 2rem;
    text-align: center
}

.c_welcome_words {
    color: var(--fre-tit-color);
    font-size: 3.2rem;
    font-weight: 700;
    letter-spacing: -.0408rem;
    line-height: 2.2rem;
    position: relative;
    text-align: center;
    z-index: 1
}

.c_welcome_illustration {
    background: url('/images/o365.png');
    background-position: 50%;
    background-size: 105% auto;
    height: 25.5rem;
    margin: 0 auto;
    width: 29.6rem
}

.old-cdn .c_welcome_illustration {
    background-image: url('/images/o365.png')
}

@media (prefers-color-scheme: dark) {
    .c_welcome_illustration {
        background:url('/images/o365.png');
        background-position: 50%;
        background-size: 105% auto
    }

    .old-cdn .c_welcome_illustration {
        background-image: url(https://static.edge.microsoftapp.net/consumer/edropstatic/images/login_welcome_dark2.png)
    }
}

.c_welcome_desc {
    color: var(--fre-desc-color);
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2rem;
    margin-bottom: 2.4rem;
    margin-top: 2.4rem;
    padding: 0 2rem;
    text-align: center
}

.c_welcome_sign_in {
    align-items: center;
    background: var(--fre-button-color);
    border: 0;
    border-radius: .4rem;
    color: #fff;
    display: flex;
    font-size: 1.5rem;
    font-weight: 400;
    height: 4rem;
    justify-content: center;
    letter-spacing: -.0078rem;
    line-height: 2rem;
    margin: 4.7rem auto 2.4rem;
    text-align: center;
    width: 21.8rem
}

.c_welcome_sign_in:active {
    -webkit-filter: brightness(65%)!important;
    filter: brightness(65%)!important
}

.c_welcome_sign_in.signed {
    background: transparent;
    color: #000;
    padding-left: 3rem
}

.c_welcome_sign_in.signed:hover {
    background: brightness(100%)
}

.c_welcome_sign_in.signed>svg {
    margin-left: 1rem;
    width: 1.4rem
}

.c_welcome_statement {
    color: #6e6e6e;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6rem;
    margin: 0 3.4rem 1.6rem;
    text-align: center
}

.c_welcome_agreement,.c_welcome_agreement:hover {
    color: var(--privacy-statement-color);
    font-size: 1.2rem;
    line-height: 1.6rem;
    text-decoration-line: underline
}

.pc .c_welcome_sign_in:hover {
    -webkit-filter: brightness(85%);
    filter: brightness(85%)
}

.pc .c_welcome_sign_in:focus-visible {
    -webkit-filter: brightness(85%);
    filter: brightness(85%)
}

.pc .c_welcome_sign_in.signed:hover {
    background: brightness(100%)
}

.c_login {
    background: var(--page-background)
}

.c_login .c_welcome_card {
    background: transparent;
    margin-top: 1rem
}

.c_login_syncing_tit {
    font-size: 3.2rem;
    font-weight: 700;
    letter-spacing: -.0408rem;
    line-height: 2.2rem;
    margin: 7.2rem auto 2.4rem
}

.c_login_syncing_desc,.c_login_syncing_tit {
    color: var(--modal-color);
    max-width: 33rem;
    text-align: center
}

.c_login_syncing_desc {
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 2rem;
    margin: 0 auto 2.4rem
}

.c_login_sync_progress svg {
    height: 2.8rem;
    width: 2.8rem
}

.c_login_sync_progress svg>circle {
    stroke-width: 1PX!important
}

.c_login_off_record {
    color: var(--normal-color);
    font-size: 1.6rem;
    font-weight: 500;
    left: 50%;
    line-height: 2rem;
    position: fixed;
    text-align: center;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    width: 26.4rem
}

.c_login_off_record_icon {
    display: block;
    height: 14.5rem;
    margin: 0 auto 2.4rem;
    width: 14.5rem
}

#root,.app,body,html {
    height: 100%;
    overflow: hidden
}

.app {
    visibility: hidden
}

.ready .app {
    visibility: visible
}

.something-loading {
    cursor: progress
}

.e-drop-app:focus-visible:before {
    border: 1px solid var(--acc-focus-border-color);
    content: "";
    display: block;
    height: 100%;
    left: 0;
    pointer-events: none;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 2000
}

.app>.router-wrapper {
    height: 100vh;
    overflow: hidden;
    position: relative
}

.app>.router-wrapper>.page {
    height: 100vh;
    left: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding-top: 7.6rem;
    position: absolute;
    top: 0;
    width: 100%
}

.f-ib {
    display: inline-block
}

.page-fade-PUSH-enter {
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
}

.page-fade-PUSH-enter-active {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    transition: all .4s;
    transition-timing-function: ease-in-out
}

.page-fade-PUSH-exit {
    opacity: 1
}

.page-fade-PUSH-exit-active {
    opacity: 0;
    transition: all .4s;
    transition-timing-function: ease-in-out
}

.page-fade-POP-enter {
    opacity: 0
}

.page-fade-POP-enter-active {
    opacity: 1;
    transition: all .4s;
    transition-timing-function: ease-in-out
}

.page-fade-POP-exit {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

.page-fade-POP-exit-active {
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    transition: all .4s;
    transition-timing-function: ease-in-out
}

html[data-input=key] .pc .tab:focus-visible,html[data-input=key] .pc a:focus-visible {
    border-radius: 4PX;
    box-shadow: inset 0 0 0 1PX var(--acc-focus-border-color)
}

@media screen and (-ms-high-contrast:active) {
    [tabindex="-1"]:not([disabled]),[tabindex="0"]:not([disabled]) {
        position: relative
    }

    [tabindex="-1"]:not([disabled]):before,[tabindex="0"]:not([disabled]):before {
        border: 1px solid buttontext;
        border-radius: 4PX;
        content: "";
        display: block;
        height: 100%;
        left: 0;
        pointer-events: none;
        position: absolute;
        top: 0;
        width: 100%
    }

    a[tabindex="-1"]:not(.button):before,a[tabindex="0"]:not(.button):before,p[tabindex="-1"]:not(.button):before,p[tabindex="0"]:not(.button):before,span[tabindex="-1"]:not(.button):before,span[tabindex="0"]:not(.button):before {
        border: 0
    }
}

@media (forced-colors:active) {
    .pc [tabindex="0"]:focus-visible:before {
        border: 2px solid highlight!important;
        content: ""
    }

    .pc [role=button]:not([disabled]):hover,.pc [role=menuitem]:not([disabled]):hover,.pc button:not([disabled]):hover {
        background-color: highlight!important
    }
}

@-webkit-keyframes loadingCircleSpin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes loadingCircleSpin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

:root {
    --normal-color: #212121;
    --page-background: #f3f3f3;
    --setting-page-background: #fff;
    --active-color: #0078d4;
    --shadow-color: rgba(0,0,0,.1);
    --header-title-color: #1a1a1a;
    --header-title-pc-color: #262626;
    --header-background: #fff;
    --header-background-android: #f3f3f3;
    --default-button-hover-background: #efefef;
    --submit-button-hover-background: #e1e1e1;
    --default-button-active-background: #f3f3f3;
    --menu-color: #212121;
    --menu-shadow: rgba(0,0,0,.16);
    --menu-border-color: #f3f3f3;
    --menu-background: #fff;
    --menu-hover-background: rgba(0,0,0,.05);
    --msg-background: #fff;
    --msg-device-name-color: #6e6e6e;
    --msg-time-color: #6e6e6e;
    --msg-menu-color: #6e6e6e;
    --msg-content-color: #212121;
    --msg-file-background: #f8f8f8;
    --msg-file-tit-color: #000;
    --msg-file-desc-color: #6e6e6e;
    --input-box-background: #f3f3f3;
    --input-box-border-color: #d6d6d6;
    --input-background: #fff;
    --input-color: #212121;
    --input-send-btn-disbale-color: #999;
    --upload-bg-backgound: rgba(0,0,0,.2);
    --upload-backgound: #fff;
    --upload-shadow: rgba(0,0,0,.2);
    --upload-proccess: #ddd;
    --upload-color: #212121;
    --setting-color: #1a1a1a;
    --setting-sub-tit-color: #6e6e6e;
    --setting-item-background: #fff;
    --setting-item-border: #ececec;
    --setting-onedrive-tit: #3c788d;
    --setting-onedrive-link-border: #e1e1e1;
    --modal-background: #fff;
    --modal-background-ios: #f2f2f2;
    --modal-background-android: #fff;
    --modal-color: #000;
    --modal-color-ios: #000;
    --modal-shadow: #000;
    --modal-border-color: #ccc;
    --modal-button-color-ios: #0078d4;
    --modal-button-color-android: #0078d4;
    --modal-border-color-ios: rgba(0,0,0,.29);
    --modal-file-background: #f3f3f3;
    --fre-card-background: linear-gradient(0deg,#fff,#fff 40%,#ebebeb 50%,#ebebeb);
    --fre-tit-color: #212121;
    --fre-desc-color: #1a1a1a;
    --fre-button-color: #317ff2;
    --fre-button-disable-color: #f3f3f3;
    --privacy-statement-color: #036ac4;
    --active-message-color: #131313;
    --active-message-background: #fff;
    --error-message-color: #a52121;
    --error-message-background: #f9d9d9;
    --info-message-color: #323130;
    --info-message-background: #f3f2f1;
    --disable-message-color: #212121;
    --disable-message-background: #e1e1e1;
    --warn-message-color-pc: #323130;
    --warn-message-color: #8f761e;
    --warn-message-background: #fff4ce;
    --user-guide-mask-bg: rgba(0,0,0,.6);
    --acc-focus-border-color: rgba(0,0,0,.8)
}

@media (prefers-color-scheme: darkxx) {
    :root {
        --normal-color:#fefefe;
        --page-background: #212121;
        --setting-page-background: #212121;
        --active-color: #52b3ff;
        --shadow-color: hsla(0,0%,100%,.1);
        --header-title-color: #e1e1e1;
        --header-title-pc-color: #fff;
        --header-background: #212121;
        --header-background-android: #212121;
        --default-button-hover-background: #4d4d4d;
        --submit-button-hover-background: #4d4d4d;
        --default-button-active-background: #424242;
        --menu-color: #fff;
        --menu-shadow: #000;
        --menu-border-color: #5e5e5e;
        --menu-background: #555;
        --menu-hover-background: hsla(0,0%,100%,.05);
        --msg-background: #333;
        --msg-device-name-color: #919191;
        --msg-time-color: #919191;
        --msg-menu-color: #919191;
        --msg-content-color: #fefefe;
        --msg-file-background: #383838;
        --msg-file-tit-color: #e1e1e1;
        --msg-file-desc-color: #919191;
        --input-background: #212121;
        --input-box-background: #303030;
        --input-box-border-color: #2e2e2e;
        --input-color: #fff;
        --input-send-btn-disbale-color: #919191;
        --upload-bg-backgound: rgba(0,0,0,.2);
        --upload-backgound: #222;
        --upload-shadow: hsla(0,0%,100%,.2);
        --upload-proccess: #444;
        --upload-color: #bebebe;
        --setting-color: #e1e1e1;
        --setting-sub-tit-color: #818181;
        --setting-item-background: #212121;
        --setting-item-border: #333;
        --setting-onedrive-tit: #fff;
        --setting-onedrive-link-border: #393939;
        --modal-background: #4a4a4a;
        --modal-background-ios: #3a3a3a;
        --modal-background-android: #212121;
        --modal-color: #f0f0f0;
        --modal-color-ios: #fff;
        --modal-shadow: #000;
        --modal-border-color: #666;
        --modal-button-color-ios: #0a84ff;
        --modal-button-color-android: #52b3ff;
        --modal-border-color-ios: hsla(0,0%,100%,.3);
        --modal-file-background: #666;
        --fre-card-background: linear-gradient(0deg,#4e4e4e,#4e4e4e 40%,#292929 50%,#292929);
        --fre-tit-color: #fff;
        --fre-desc-color: #fff;
        --fre-button-color: #006cbe;
        --fre-button-disable-color: #888;
        --privacy-statement-color: #63ade5;
        --active-message-color: #eee;
        --active-message-background: #212121;
        --error-message-color: #f55d5d;
        --error-message-background: #4d1517;
        --info-message-color: #f3f2f1;
        --info-message-background: #323130;
        --disable-message-color: #c9c9c9;
        --disable-message-background: #1a1a1a;
        --warn-message-color: #f3f2f1;
        --warn-message-color-pc: #f3f2f1;
        --warn-message-background: #433519;
        --user-guide-mask-bg: rgba(0,0,0,.8);
        --acc-focus-border-color: hsla(0,0%,100%,.8)
    }

    .android,.ios {
        --header-background: #212121;
        --page-background: #000;
        --msg-background: #212121;
        --input-box-background: #141414
    }
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: SF Pro Text,-apple-system,Roboto,Segoe UI,Helvetica,Verdana,sans-serif,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue;
    margin: 0
}

code {
    font-family: source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace
}

blockquote,body,button,caption,dd,div,dl,dt,fieldset,figure,form,h1,h2,h3,h4,h5,h6,hr,html,input,legend,li,menu,ol,p,pre,table,td,textarea,th,ul {
    margin: 0;
    padding: 0
}

address,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
    display: block
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

caption,th {
    font-weight: 400;
    text-align: left
}

abbr,body,fieldset,html,iframe,img {
    border: 0
}

address,cite,dfn,em,i,var {
    font-style: normal
}

[hidefocus],summary {
    outline: 0
}

li {
   /* list-style: none */
}

h1,h2,h3,h4,h5,h6,small {
    font-size: 100%
}

sub,sup {
    font-size: 83%
}

code,kbd,pre,samp {
    font-family: inherit
}

q:after,q:before {
    content: none
}

textarea {
    overflow: auto;
    resize: none
}

label,summary {
    cursor: default
}

a,button {
    cursor: pointer
}

b,em,h1,h2,h3,h4,h5,h6,strong {
    font-weight: 700
}

a,a:hover,del,ins,s,u {
    text-decoration: none
}

body,button,input,keygen,legend,select,textarea {
    color: #333;
    font: 1.2rem/1.14 SF Pro Text,-apple-system,Roboto,Segoe UI,Helvetica,Verdana,sans-serif,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue;
    outline: 0
}

a,a:hover {
    color: #333
}

*,:after,:before {
    -webkit-tap-highlight-color: transparent;
    box-sizing: border-box;
    outline: none
}

.hide {
    display: none
}

fluent-progress-ring::part(background),fluent-progress-ring::part(indeterminate-indicator-1) {
    stroke-width: 1PX
}

@supports (height: calc(100% + env(safe-area-inset-bottom,0))) {
    html {
        height:calc(100% + env(safe-area-inset-bottom, 0))
    }

    form.c_msg_form {
        padding-bottom: calc(env(safe-area-inset-bottom, 0) + 1.2rem)
    }

    .c_msg_list {
        padding-bottom: calc(1rem + env(safe-area-inset-bottom))
    }

    .c_sync_transport_bg {
        height: calc(6.5rem + env(safe-area-inset-bottom))
    }
}


/*# sourceMappingURL=main.f76a090c.css.map*/

:root {
    --n1000:#000;--n900:#091e42;--n800:#172b4d;--n700:#253858;--n600:#344563;--n500:#42526e;--n400:#505f79;--n300:#5e6c84;--n200:#6b778c;--n100:#7a869a;--n90:#8993a4;--n80:#97a0af;--n70:#a5adba;--n60:#b3bac5;--n50:#c1c7d0;--n40:#dfe1e6;--n30:#ebecf0;--n20:#f4f5f7;--n10:#fafbfc;--n0:#fff;--r50:#ffebe6;--n900-3:rgba(9,30,66,0.03);--n900-4:rgba(9,30,66,0.04);--n900-6:rgba(9,30,66,0.06);--n900-8:rgba(9,30,66,0.08);--n900-10:rgba(9,30,66,0.1);--n900-12:rgba(9,30,66,0.12);--n900-14:rgba(9,30,66,0.14);--n900-15:rgba(9,30,66,0.15);--n900-25:rgba(9,30,66,0.25);--n900-23:rgba(9,30,66,0.35);--n900-50:rgba(9,30,66,0.5);--n900-60:rgba(9,30,66,0.6);--n800-4:rgba(23,43,77,0.04);--n800-5:rgba(23,43,77,0.05);--n800-8:rgba(23,43,77,0.08);--n800-12:rgba(23,43,77,0.12);--n800-20:rgba(23,43,77,0.2);--n800-30:rgba(23,43,77,0.3);--n800-40:rgba(23,43,77,0.4);--n800-50:rgba(23,43,77,0.5);--n800-60:rgba(23,43,77,0.6);--n800-70:rgba(23,43,77,0.7);--n800-80:rgba(23,43,77,0.8);--n100-0:rgba(122,134,154,0);--n100-8:rgba(122,134,154,0.08);--n100-12:rgba(122,134,154,0.12);--n100-16:rgba(122,134,154,0.16);--n100-20:rgba(122,134,154,0.2);--n60-16:rgba(179,186,197,0.16);--n60-24:rgba(179,186,197,0.24);--n50-60:rgba(193,199,208,0.6);--n40-50:rgba(223,225,230,0.5);--n30-0:rgba(235,236,240,0);--n30-50:rgba(235,236,240,0.5);--n20-0:rgba(244,245,247,0);--n20-60:rgba(244,245,247,0.6);--n20-70:rgba(244,245,247,0.7);--n10-0:rgba(250,251,252,0);--n10-1:rgba(250,251,252,0.01);--n10-50:rgba(250,251,252,0.5);--n0-0:hsla(0,0%,100%,0);--n0-4:hsla(0,0%,100%,0.04);--n0-5:hsla(0,0%,100%,0.05);--n0-7:hsla(0,0%,100%,0.07);--n0-10:hsla(0,0%,100%,0.1);--n0-14:hsla(0,0%,100%,0.14);--n0-20:hsla(0,0%,100%,0.2);--n0-30:hsla(0,0%,100%,0.3);--n0-32:hsla(0,0%,100%,0.32);--n0-35:hsla(0,0%,100%,0.35);--n0-40:hsla(0,0%,100%,0.4);--n0-50:hsla(0,0%,100%,0.5);--n0-60:hsla(0,0%,100%,0.6);--n0-70:hsla(0,0%,100%,0.7);--n0-75:hsla(0,0%,100%,0.75);--n0-80:hsla(0,0%,100%,0.8);--n0-90:hsla(0,0%,100%,0.9);--n0-95:hsla(0,0%,100%,0.95);--r50-20:rgba(255,235,230,0.2);--elevation-100:#fff;--elevation-150:#fff;--elevation-200:#fff;--elevation-300:#fff;--elevation-400:#fff;--elevation-500:#fff;--shadow-100:0 0 1px 0 rgba(9,30,66,0.31),0 1px 1px 0 rgba(9,30,66,0.25);--shadow-150:0 0 1px 0 rgba(9,30,66,0.31),0 2px 4px -1px rgba(9,30,66,0.25);--shadow-200:0 0 1px 0 rgba(9,30,66,0.31),0 4px 8px -2px rgba(9,30,66,0.25);--shadow-300:0 0 1px 0 rgba(9,30,66,0.31),0 8px 16px -4px rgba(9,30,66,0.25);--shadow-400:0 0 1px 0 rgba(9,30,66,0.31),0 12px 24px -6px rgba(9,30,66,0.25);--shadow-500:0 0 1px 0 rgba(9,30,66,0.31),0 20px 32px -8px rgba(9,30,66,0.25)}