button {
    padding: 0;
    font: inherit;
    color: inherit;
    cursor: pointer;
    background: none;
    border: none;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

body, button, p, pre {
    margin: 0
}

h1, h2, h3 {
    margin: 0;
    font: inherit
}

ol, ul {
    padding: 0;
    margin: 0
}

li {
    list-style-type: none
}

a {
    color: inherit;
    text-decoration: none
}

body {
    font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif
}

.Button {
    display: inline-block;
    padding: 0 16px;
    font-size: 14px;
    line-height: 32px;
    color: #8590a6;
    text-align: center;
    cursor: pointer;
    background: none;
    border: 1px solid;
    border-radius: 3px
}

html[data-theme=dark] .Button {
    color: #606a80
}

.Button::-moz-focus-inner {
    padding: 0;
    border: 0
}

.Button:focus {
    outline: none;
    -webkit-transition: -webkit-box-shadow .3s;
    transition: -webkit-box-shadow .3s;
    transition: box-shadow .3s;
    transition: box-shadow .3s, -webkit-box-shadow .3s
}

html[data-focus-visible] .Button:focus {
    -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0, 132, 255, .3);
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0, 132, 255, .3)
}

html[data-theme=dark][data-focus-visible] .Button:focus {
    -webkit-box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 4px rgba(58, 118, 208, .6);
    box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 4px rgba(58, 118, 208, .6)
}

.Button:disabled {
    cursor: default;
    opacity: .5;
    pointer-events: none
}

.Button--grey {
    color: #8590a6;
    border-color: #8590a6
}

html[data-theme=dark] .Button--grey {
    color: #606a80;
    border-color: #606a80
}

.Button--grey:hover {
    background-color: rgba(133, 144, 166, .06)
}

html[data-theme=dark] .Button--grey:hover {
    background-color: rgba(96, 106, 128, .06)
}

.Button--blue {
    color: #0084ff;
    border-color: #0084ff
}

html[data-theme=dark] .Button--blue {
    color: #3a76d0;
    border-color: #3a76d0
}

.Button--blue:hover {
    background-color: rgba(0, 132, 255, .06)
}

html[data-theme=dark] .Button--blue:hover {
    background-color: rgba(58, 118, 208, .06)
}

.Button--green {
    color: #11a668;
    border-color: #11a668
}

.Button--green:hover {
    background-color: rgba(17, 166, 104, .06)
}

html[data-theme=dark] .Button--green {
    color: #11a668;
    border-color: #11a668
}

html[data-theme=dark] .Button--green:hover {
    background-color: rgba(17, 166, 104, .06)
}

.Button--red {
    color: #f36;
    border-color: #f36
}

html[data-theme=dark] .Button--red {
    color: #d92155;
    border-color: #d92155
}

.Button--red:hover {
    background-color: rgba(255, 51, 102, .06)
}

html[data-theme=dark] .Button--red:hover {
    background-color: rgba(217, 33, 85, .06)
}

.Button--primary.Button--blue {
    color: #fff;
    background-color: #0084ff
}

html[data-theme=dark] .Button--primary.Button--blue {
    color: #ebebeb;
    background-color: #3a76d0
}

.Button--primary.Button--blue:hover {
    border-color: #0077e6;
    background-color: #0077e6
}

html[data-theme=dark] .Button--primary.Button--blue:hover {
    border-color: #2e69c2;
    background-color: #2e69c2
}

.Button--primary.Button--green {
    color: #fff;
    background-color: #12b370
}

html[data-theme=dark] .Button--primary.Button--green {
    color: #ebebeb
}

.Button--primary.Button--green:hover {
    border-color: #109c62;
    background-color: #109c62 !important
}

html[data-theme=dark] .Button--primary.Button--green {
    color: #fff;
    background-color: #12b370
}

html[data-theme=dark] html[data-theme=dark] .Button--primary.Button--green {
    color: #ebebeb
}

html[data-theme=dark] .Button--primary.Button--green:hover {
    border-color: #109c62;
    background-color: #109c62 !important
}

.Button--primary.Button--red {
    color: #fff;
    background-color: #f36
}

html[data-theme=dark] .Button--primary.Button--red {
    color: #ebebeb;
    background-color: #d92155
}

.Button--primary.Button--red:hover {
    border-color: #ff1a53;
    background-color: #ff1a53
}

html[data-theme=dark] .Button--primary.Button--red:hover {
    border-color: #c31e4c;
    background-color: #c31e4c
}

.Button--primary.Button--grey {
    color: #fff;
    background-color: #8590a6
}

html[data-theme=dark] .Button--primary.Button--grey {
    color: #ebebeb;
    background-color: #606a80
}

.Button--primary.Button--grey:hover {
    border-color: #76839b;
    background-color: #76839b
}

html[data-theme=dark] .Button--primary.Button--grey:hover {
    border-color: #555e71;
    background-color: #555e71
}

.Button--secondary, html[data-theme=dark] .Button--secondary {
    border-color: transparent
}

.Button--secondary.Button--blue {
    color: #0084ff;
    background: rgba(0, 132, 255, .1)
}

html[data-theme=dark] .Button--secondary.Button--blue {
    color: #3a76d0;
    background: rgba(58, 118, 208, .1)
}

.Button--secondary.Button--blue:hover {
    background-color: rgba(0, 132, 255, .15)
}

html[data-theme=dark] .Button--secondary.Button--blue:hover {
    background-color: rgba(58, 118, 208, .15)
}

.Button--secondary.Button--green {
    color: #12b370;
    background: rgba(18, 179, 112, .1)
}

.Button--secondary.Button--green:hover {
    background-color: rgba(18, 179, 112, .15)
}

html[data-theme=dark] .Button--secondary.Button--green {
    color: #12b370;
    background: rgba(18, 179, 112, .1)
}

html[data-theme=dark] .Button--secondary.Button--green:hover {
    background-color: rgba(18, 179, 112, .15)
}

.Button--secondary.Button--red {
    color: #f36;
    background: rgba(255, 51, 102, .1)
}

html[data-theme=dark] .Button--secondary.Button--red {
    color: #d92155;
    background: rgba(217, 33, 85, .1)
}

.Button--secondary.Button--red:hover {
    background-color: rgba(255, 51, 102, .15)
}

html[data-theme=dark] .Button--secondary.Button--red:hover {
    background-color: rgba(217, 33, 85, .15)
}

.Button--secondary.Button--grey {
    color: #8590a6;
    background: rgba(133, 144, 166, .1)
}

html[data-theme=dark] .Button--secondary.Button--grey {
    color: #606a80;
    background: rgba(96, 106, 128, .1)
}

.Button--secondary.Button--grey:hover {
    background-color: rgba(133, 144, 166, .15)
}

html[data-theme=dark] .Button--secondary.Button--grey:hover {
    background-color: rgba(96, 106, 128, .15)
}

.Button--link, .Button--plain {
    height: auto;
    padding: 0;
    line-height: inherit;
    background-color: transparent;
    border: none;
    border-radius: 0
}

.Button--link:hover, .Button--plain:hover {
    background-color: transparent
}

html[data-theme=dark] .Button--link, html[data-theme=dark] .Button--plain {
    border: none
}

html[data-theme=dark] .Button--link:hover, html[data-theme=dark] .Button--plain:hover {
    background-color: transparent
}

.Button--plain:hover {
    color: #76839b
}

html[data-theme=dark] .Button--plain:hover {
    color: #555e71
}

.Button--blue.Button--plain:hover {
    color: #0077e6
}

html[data-theme=dark] .Button--blue.Button--plain:hover {
    color: #2e69c2
}

.Button--green.Button--plain:hover, html[data-theme=dark] .Button--green.Button--plain:hover {
    color: #109c62
}

.Button--red.Button--plain:hover {
    color: #ff1a53
}

html[data-theme=dark] .Button--red.Button--plain:hover {
    color: #c31e4c
}

.Button--grey.Button--plain:hover {
    color: #76839b
}

html[data-theme=dark] .Button--grey.Button--plain:hover {
    color: #555e71
}

.Button--link, html[data-theme=dark] .Button--link {
    color: #175199
}

.Button--link:hover, html[data-theme=dark] .Button--link:hover {
    color: #144583
}

.Button--spread {
    width: 100%
}

.Button--withIcon.Button--iconOnly {
    padding: 0 4px
}

.Button--withIcon.Button--link, .Button--withIcon.Button--plain {
    padding: 0
}

.Button--withIcon.Button--withLabel .Button-zi {
    margin-right: 4px
}

.ModalButtonGroup--vertical {
    margin-top: 40px;
    margin-bottom: 16px
}

.ModalButtonGroup--vertical .Button {
    display: block;
    width: 220px;
    margin-right: auto;
    margin-left: auto
}

.ModalButtonGroup--vertical .Button + .Button {
    margin-top: 28px
}

.Modal-content--buttonGroupOnly .ModalButtonGroup--vertical {
    margin-top: 60px
}

.ModalButtonGroup--horizontal {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    margin-top: 48px
}

.ModalButtonGroup--horizontal .Button {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1
}

.ModalButtonGroup--horizontal .Button:last-child:first-child {
    width: 220px;
    margin-right: auto;
    margin-left: auto;
    -webkit-box-flex: initial;
    -ms-flex: initial;
    flex: initial
}

.ModalButtonGroup--horizontal .Button + .Button {
    margin-left: 16px
}

.Modal-wrapper {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 203;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-transition: opacity .3s ease-out;
    transition: opacity .3s ease-out
}

.Modal-wrapper.Modal-enter {
    opacity: .01
}

.Modal-wrapper.Modal-enter-active, .Modal-wrapper.Modal-leave {
    opacity: 1
}

.Modal-wrapper.Modal-leave-active {
    opacity: .01
}

.Modal-backdrop {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 0;
    background-color: rgba(26, 26, 26, .65);
    -webkit-transition: background-color .3s ease-out;
    transition: background-color .3s ease-out
}

html[data-theme=dark] .Modal-backdrop {
    background-color: rgba(0, 0, 0, .65)
}

.Modal-wrapper--transparent .Modal-backdrop {
    background-color: transparent
}

.Modal {
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 400px;
    max-height: calc(100vh - 48px);
    margin-right: auto;
    margin-left: auto;
    -webkit-box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: max-height .8s ease;
    transition: max-height .8s ease
}

html[data-theme=dark] .Modal {
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
}

.Modal:focus {
    outline: none
}

.Modal--large {
    width: 536px
}

.Modal--fullPage {
    width: 688px;
    height: calc(100vh - 48px)
}

.Modal-enter .Modal {
    -webkit-transform: translateY(20px);
    transform: translateY(20px)
}

.Modal-enter-active .Modal {
    transition: opacity .3s ease-out, -webkit-transform .3s ease-out;
    -webkit-transition: opacity .3s ease-out, -webkit-transform .3s ease-out;
    transition: transform .3s ease-out, opacity .3s ease-out;
    transition: transform .3s ease-out, opacity .3s ease-out, -webkit-transform .3s ease-out
}

.Modal-enter-active .Modal, .Modal-leave .Modal {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.Modal-leave-active .Modal {
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
    transition: opacity .3s ease-out, -webkit-transform .3s ease-out;
    -webkit-transition: opacity .3s ease-out, -webkit-transform .3s ease-out;
    transition: transform .3s ease-out, opacity .3s ease-out;
    transition: transform .3s ease-out, opacity .3s ease-out, -webkit-transform .3s ease-out
}

.Modal-inner {
    overflow: auto;
    background: #fff;
    border-radius: 2px
}

html[data-theme=dark] .Modal-inner {
    background: #1a1a1a
}

.Modal--fullPage .Modal-inner {
    height: 100%
}

.Modal-closeButton {
    position: absolute;
    top: 8px;
    right: -60px;
    padding: 12px
}

.Modal-closeIcon {
    vertical-align: top;
    fill: #fff
}

html[data-theme=dark] .Modal-closeIcon {
    fill: #ebebeb
}

.Modal-title {
    margin-top: 40px;
    font-size: 24px;
    font-weight: 500;
    color: #1a1a1a;
    text-align: center
}

html[data-theme=dark] .Modal-title {
    color: #999
}

.Modal-title.Modal-title--simple {
    font-family: inherit;
    font-size: 20px
}

.Modal-subtitle {
    padding: 0 38px;
    margin-top: 4px;
    font-size: 14px;
    line-height: 1.5;
    color: #8590a6;
    text-align: center
}

html[data-theme=dark] .Modal-subtitle {
    color: #606a80
}

.Modal-subtitle a {
    text-decoration: underline
}

.Modal-content {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    padding: 0 24px 32px;
    margin-top: 24px;
    line-height: 1.7;
    opacity: 1
}

.Modal--fullPage .Modal-content {
    padding: 0
}

.Modal-content.Modal-content--spread {
    height: 100%;
    margin-top: 0
}

.Modal-content.Modal-content--hidden {
    opacity: 0;
    -webkit-transition: opacity .3s ease-out;
    transition: opacity .3s ease-out
}

.Modal-footer {
    padding: 16px 24px;
    font-size: 13px;
    line-height: 1.7;
    color: #8590a6;
    background: #f6f6f6;
    border-top: 1px solid #ebebeb
}

html[data-theme=dark] .Modal-footer {
    color: #606a80;
    background: #2e2e2e;
    border-top: 1px solid #444
}

.Modal-footer a {
    text-decoration: underline
}

.MobileModal-wrapper {
    position: relative
}

.MobileModal-wrapper--absoluted {
    position: absolute;
    top: 0;
    max-height: 100vh;
    overflow: hidden;
    z-index: -1
}

.MobileModal {
    background: #fff
}

html[data-theme=dark] .MobileModal {
    background: #1a1a1a
}

.MobileModal-content--default {
    padding-top: 50px;
    padding-bottom: 60px;
    min-height: 100vh;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.MobileModal-closeButton {
    position: fixed;
    top: 4px;
    right: 4px;
    padding: 8px;
    z-index: 100
}

.MobileModal-closeIcon {
    fill: #1a1a1a;
    display: block
}

html[data-theme=dark] .MobileModal-closeIcon {
    fill: #999
}

.MobileModal-title {
    font-weight: 700
}

.MobileModal-title--default {
    position: fixed;
    top: 0;
    width: 100%;
    padding: 0 16px;
    border-bottom: 1px solid #ebebeb;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: 0 1px 3px rgba(26, 26, 26, .05);
    box-shadow: 0 1px 3px rgba(26, 26, 26, .05);
    margin: 0;
    font-size: 16px;
    line-height: 49px;
    background: #fff;
    z-index: 99
}

html[data-theme=dark] .MobileModal-title--default {
    border-bottom: 1px solid #444;
    -webkit-box-shadow: 0 1px 3px hsla(0, 0%, 60%, .05);
    box-shadow: 0 1px 3px hsla(0, 0%, 60%, .05);
    background: #1a1a1a
}

.MobileModal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 100;
    background: rgba(26, 26, 26, .65)
}

html[data-theme=dark] .MobileModal-backdrop {
    background: hsla(0, 0%, 60%, .65)
}

.MobileModal--plain {
    position: fixed;
    top: 50%;
    right: 0;
    left: 0;
    z-index: 100;
    margin: auto;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 87.2%;
    border-radius: 2px;
    overflow: hidden
}

.MobileModal--plain, html[data-theme=dark] .MobileModal--plain {
    -webkit-box-shadow: 0 5px 20px 0 rgba(23, 81, 153, .5);
    box-shadow: 0 5px 20px 0 rgba(23, 81, 153, .5)
}

.MobileModal--plain .MobileModal-closeIcon {
    fill: #8590a6
}

html[data-theme=dark] .MobileModal--plain .MobileModal-closeIcon {
    fill: #606a80
}

.MobileModal-content--plain {
    padding: 16px 20px
}

.MobileModal-title--plain {
    text-align: center;
    padding: 24px 20px 8px;
    font-size: 18px
}

.MobileModal-subtitle {
    font-size: 14px;
    padding: 0 20px;
    color: #8590a6
}

html[data-theme=dark] .MobileModal-subtitle {
    color: #606a80
}

.Notification {
    position: fixed;
    top: 75px;
    left: 50%;
    z-index: 499;
    padding: 14px 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    font-size: 14px;
    color: #1a1a1a;
    pointer-events: all;
    border-radius: 4px;
    -webkit-box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html[data-theme=dark] .Notification {
    color: #999;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
}

@media (max-width: 768px) {
    .Notification {
        width: calc(100vw - 32px)
    }
}

@media (min-width: 769px) {
    .Notification {
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        max-width: 600px;
        min-width: 520px
    }
}

.Notification-textSection {
    width: 100%;
    display: inline-block
}

@media (max-width: 768px) {
    .Notification-textSection {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis
    }
}

.Notification-textSection--withButton {
    text-align: left
}

.Notification-textSection--withoutButton {
    text-align: center
}

.Notification-actionsSection {
    white-space: nowrap;
    height: 100%;
    margin: auto 0 auto 32px
}

.Notification-wrapper {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 503;
    overflow: hidden;
    pointer-events: none
}

.Notification-white {
    color: #1a1a1a;
    background: #fff
}

html[data-theme=dark] .Notification-white {
    color: #999;
    background: #1a1a1a
}

.Notification-red {
    color: #fff;
    background: #f1403c
}

html[data-theme=dark] .Notification-red {
    color: #ebebeb;
    background: #b7302d
}

.Notification-red-ghost {
    color: #f1403c;
    background: #fff
}

html[data-theme=dark] .Notification-red-ghost {
    color: #b7302d;
    background: #1a1a1a
}

@-webkit-keyframes spring-in {
    0% {
        -webkit-transform: translate(-50%, -20px);
        transform: translate(-50%, -20px);
        opacity: .01
    }
    to {
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
        opacity: 1
    }
}

@keyframes spring-in {
    0% {
        -webkit-transform: translate(-50%, -20px);
        transform: translate(-50%, -20px);
        opacity: .01
    }
    to {
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
        opacity: 1
    }
}

@-webkit-keyframes spring-out {
    0% {
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
        opacity: 1
    }
    to {
        -webkit-transform: translate(-50%, -20px);
        transform: translate(-50%, -20px);
        opacity: 0
    }
}

@keyframes spring-out {
    0% {
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
        opacity: 1
    }
    to {
        -webkit-transform: translate(-50%, -20px);
        transform: translate(-50%, -20px);
        opacity: 0
    }
}

.Notification-enter {
    -webkit-animation: spring-in .3s;
    animation: spring-in .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.Notification-leave {
    -webkit-animation: spring-out .3s;
    animation: spring-out .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.Icon {
    vertical-align: text-bottom;
    fill: currentColor
}

.Icon--grey {
    color: #8590a6
}

html[data-theme=dark] .Icon--grey {
    color: #606a80
}

.Icon--left {
    margin-right: 6px
}

.AppAuthentication--appView .Modal-title {
    font-size: 18px;
    margin-top: 24px
}

.AppAuthentication--appView .Modal-content {
    padding-bottom: 16px
}

.AppAuthentication {
    max-width: 87.2%
}

.AppAuthentication-buttonContainer {
    padding: 0 16px
}

.AppAuthentication-button {
    width: 100%;
    margin-bottom: 16px;
    padding: 5px 0
}

.AppAuthentication-closeButton {
    position: absolute;
    right: 16px;
    top: 16px;
    font-size: 0
}

.SignFlow {
    overflow: hidden
}

.SignFlow input[type=number]::-webkit-inner-spin-button, .SignFlow input[type=number]::-webkit-outer-spin-button {
    margin: 0;
    -webkit-appearance: none;
    appearance: none
}

.SignFlow input {
    height: 48px
}

.SignFlow input::-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important
}

.SignFlow input[type=number] {
    -moz-appearance: textfield
}

.SignFlow .SignFlow-accountInput, .SignFlow .SignFlow-smsInput {
    width: auto
}

.SignFlow-submitButton {
    width: 100%;
    margin-top: 30px;
    height: 36px
}

.SignFlow-captchaContainer {
    height: 48px;
    margin-top: 12px;
    -webkit-transition: height .3s ease;
    transition: height .3s ease
}

.SignFlow-snackBar {
    font-size: 13px;
    color: #8590a6
}

html[data-theme=dark] .SignFlow-snackBar {
    color: #606a80
}

.SignFlow-snackBarLink, html[data-theme=dark] .SignFlow-snackBarLink {
    color: #175199
}

.OpenInAppButton {
    position: fixed;
    top: auto;
    bottom: 0;
    left: 50%;
    z-index: 100;
    width: 105px;
    font-size: 15px;
    font-weight: 500;
    line-height: 36px;
    color: #fff;
    text-align: center;
    background: #0084ff;
    border-radius: 18px;
    -webkit-transform: translate(-50%, 200%);
    transform: translate(-50%, 200%);
    -webkit-box-shadow: 0 2px 5px rgba(26, 26, 26, .25);
    box-shadow: 0 2px 5px rgba(26, 26, 26, .25);
    -webkit-transition: -webkit-transform .3s .3s;
    transition: -webkit-transform .3s .3s;
    transition: transform .3s .3s;
    transition: transform .3s .3s, -webkit-transform .3s .3s
}

html[data-theme=dark] .OpenInAppButton {
    color: #1a1a1a;
    background: #3a76d0;
    -webkit-box-shadow: 0 2px 5px hsla(0, 0%, 60%, .25);
    box-shadow: 0 2px 5px hsla(0, 0%, 60%, .25)
}

.OpenInAppButton.is-shown {
    -webkit-transform: translate(-50%, -25px);
    transform: translate(-50%, -25px)
}

.SignInModal .MobileModal-title {
    padding-bottom: 0
}

.SignInModal-openInAppButton {
    margin-bottom: 16px;
    width: 100%;
    line-height: 44px;
    color: #fff;
    background-color: #0084ff
}

html[data-theme=dark] .SignInModal-openInAppButton {
    color: #1a1a1a;
    background-color: #3a76d0
}

.SignInModal-content {
    padding: 0 16px
}

.SignInModal-content button {
    height: 44px;
    width: 100%;
    font-size: 16px;
    border: 1px solid;
    border-radius: 3px
}

.SignInModal-content button:not(:last-child) {
    margin-bottom: 16px
}

.SignInModal-button-zhihu {
    background-color: #fff;
    border-color: #0084ff;
    color: #0084ff
}

html[data-theme=dark] .SignInModal-button-zhihu {
    background-color: #1a1a1a;
    border-color: #3a76d0;
    color: #3a76d0
}

.SignInModal-button-weibo {
    background-color: #f1403c;
    border-color: # #F1403C;
    color: #fff
}

html[data-theme=dark] .SignInModal-button-weibo {
    background-color: #b7302d;
    border-color: # #B7302D;
    color: #1a1a1a
}

.SignInModal-button-wechat {
    background-color: #bfbfbf;
    border-color: #bfbfbf;
    color: #fff
}

html[data-theme=dark] .SignInModal-button-wechat {
    background-color: #444;
    border-color: #444;
    color: #1a1a1a
}

.SignInModal-button-qq {
    background-color: #0084ff;
    border-color: #0084ff;
    color: #fff
}

html[data-theme=dark] .SignInModal-button-qq {
    background-color: #3a76d0;
    border-color: #3a76d0;
    color: #1a1a1a
}

.WechatShareImage {
    display: none
}

.InputLike {
    padding: 4px 10px;
    background: #fff;
    border: 1px solid #ebebeb;
    border-radius: 3px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: background .2s, border .2s;
    transition: background .2s, border .2s
}

html[data-theme=dark] .InputLike {
    background: #1a1a1a;
    border: 1px solid #444
}

.InputLike.is-focus {
    border-color: #8590a6
}

html[data-theme=dark] .InputLike.is-focus {
    border-color: #606a80
}

.InputLike.is-large {
    padding: 6px 12px
}

.InputButton {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0
}

.InputButton.is-large {
    padding-top: 2px;
    padding-bottom: 2px
}

.Popover {
    position: relative;
    display: inline-block
}

.Popover-arrow {
    position: absolute;
    overflow: hidden;
    pointer-events: none
}

.Popover-arrow:after {
    content: "";
    position: absolute;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 24px;
    height: 24px;
    margin: -12px;
    border: 1px solid #ebebeb;
    background: #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    pointer-events: auto
}

html[data-theme=dark] .Popover-arrow:after {
    border: 1px solid #2e2e2e;
    background: #1a1a1a
}

.Popover-arrow--top {
    width: 32px;
    height: 16px;
    margin-top: -2px;
    -webkit-transform: translate(-50%);
    transform: translate(-50%)
}

.Popover-arrow--top:after {
    left: 50%;
    top: -8px
}

.Popover-arrow--bottom {
    width: 32px;
    height: 16px;
    -webkit-transform: translate(-50%, -100%);
    transform: translate(-50%, -100%)
}

.Popover-arrow--bottom:after {
    left: 50%;
    bottom: -8px
}

.Popover-arrow--left {
    width: 16px;
    height: 32px;
    margin-left: -2px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.Popover-arrow--left:after {
    left: -8px;
    top: 50%
}

.Popover-arrow--right {
    width: 16px;
    height: 32px;
    -webkit-transform: translate(-100%, -50%);
    transform: translate(-100%, -50%)
}

.Popover-arrow--right:after {
    right: -8px;
    top: 50%
}

.Popover-content {
    position: absolute;
    background: #fff;
    border: 1px solid #ebebeb;
    border-radius: 4px;
    -webkit-box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    z-index: 203
}

html[data-theme=dark] .Popover-content {
    background: #1a1a1a;
    border: 1px solid #2e2e2e;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
}

.Popover-content-enter {
    opacity: .01
}

.Popover-content-enter-active {
    transition: opacity .2s ease-out, -webkit-transform .2s ease-out;
    -webkit-transition: opacity .2s ease-out, -webkit-transform .2s ease-out;
    transition: transform .2s ease-out, opacity .2s ease-out;
    transition: transform .2s ease-out, opacity .2s ease-out, -webkit-transform .2s ease-out
}

.Popover-content-enter-active, .Popover-content-leave {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.Popover-content-leave-active {
    opacity: .01;
    transition: opacity .2s ease-out, -webkit-transform .2s ease-out;
    -webkit-transition: opacity .2s ease-out, -webkit-transform .2s ease-out;
    transition: transform .2s ease-out, opacity .2s ease-out;
    transition: transform .2s ease-out, opacity .2s ease-out, -webkit-transform .2s ease-out
}

.Popover-content--fixed {
    position: fixed
}

.Popover-content--top {
    -webkit-transform-origin: bottom center;
    transform-origin: bottom center;
    margin-top: -8px
}

.Popover-content--top.Popover-content--arrowed {
    margin-top: -16px
}

.Popover-content--top.Popover-content--enter, .Popover-content--top.Popover-content-leave-active {
    -webkit-transform: translateY(8px);
    transform: translateY(8px)
}

.Popover-content--bottom {
    margin-top: 8px
}

.Popover-content--bottom.Popover-content--arrowed {
    margin-top: 16px
}

.Popover-content--bottom.Popover-content--enter, .Popover-content--bottom.Popover-content-leave-active {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px)
}

.Popover-content--left {
    -webkit-transform-origin: right center;
    transform-origin: right center;
    margin-left: -8px
}

.Popover-content--left.Popover-content--arrowed {
    margin-left: -16px
}

.Popover-content--left.Popover-content--enter, .Popover-content--left.Popover-content-leave-active {
    -webkit-transform: translateX(8px);
    transform: translateX(8px)
}

.Popover-content--right {
    margin-left: 8px
}

.Popover-content--right.Popover-content--arrowed {
    margin-left: 16px
}

.Popover-content--right.Popover-content--enter, .Popover-content--right.Popover-content-leave-active {
    -webkit-transform: translateX(-8px);
    transform: translateX(-8px)
}

.AttentionPopover {
    font-size: 15px;
    background-color: #3a76d0;
    color: #fff;
    padding: 9px 14px;
    border-radius: 8px;
    border: none
}

.AttentionPopover .Popover-arrow {
    border: none
}

.AttentionPopover .Popover-arrow:after {
    border-color: #3a76d0;
    background: #3a76d0
}

.AttentionPopover .Popover-arrow--top:after {
    border-top-color: #3a76d0
}

.AttentionPopover .Popover-arrow--bottom:after {
    border-bottom-color: #3a76d0
}

.AttentionPopover .Popover-arrow--left:after {
    border-left-color: #3a76d0
}

.AttentionPopover .Popover-arrow--right:after {
    border-right-color: #3a76d0
}

.Select-button {
    text-align: left;
    padding-right: 4px
}

.Select-button.is-large {
    padding-right: 6px
}

.Select-plainButton {
    padding: 0;
    border: 1px solid transparent
}

.Select-arrow {
    margin-left: 8px
}

.Select-list {
    overflow: auto;
    position: relative;
    max-height: 500px;
    padding: 8px 0;
    border-radius: 4px
}

.Select-option {
    display: block;
    width: 100%;
    height: 40px;
    padding: 0 20px;
    line-height: 40px;
    color: #8590a6;
    text-align: left;
    background: none;
    border: none
}

html[data-theme=dark] .Select-option {
    color: #606a80
}

.Select-option:focus {
    outline: none;
    -webkit-transition: -webkit-box-shadow .3s;
    transition: -webkit-box-shadow .3s;
    transition: box-shadow .3s;
    transition: box-shadow .3s, -webkit-box-shadow .3s
}

html[data-focus-visible] .Select-option:focus {
    -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0, 132, 255, .3);
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0, 132, 255, .3)
}

html[data-theme=dark][data-focus-visible] .Select-option:focus {
    -webkit-box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 4px rgba(58, 118, 208, .6);
    box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 4px rgba(58, 118, 208, .6)
}

.Select-option:focus {
    background: #f6f6f6
}

html[data-theme=dark] .Select-option:focus {
    background: #2e2e2e
}

.Select-popoverTarget {
    margin-top: 0;
    -webkit-transition: opacity .2s ease-out;
    transition: opacity .2s ease-out
}

.Input-wrapper {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 180px;
    height: 34px;
    padding: 4px 10px;
    font-size: 14px;
    background: #fff;
    border: 1px solid #ebebeb;
    border-radius: 3px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: background .2s, border .2s;
    transition: background .2s, border .2s
}

html[data-theme=dark] .Input-wrapper {
    background: #1a1a1a;
    border: 1px solid #444
}

.Input-wrapper.Input-wrapper--grey {
    background: #f6f6f6
}

html[data-theme=dark] .Input-wrapper.Input-wrapper--grey {
    background: #2e2e2e
}

.Input-wrapper.Input-wrapper--spread {
    width: 100%
}

.Input-wrapper.Input-wrapper--multiline {
    height: inherit
}

.Input-wrapper.Input-wrapper--large {
    height: auto;
    padding: 6px 12px
}

.Input-wrapper.Input-wrapper--noPadding {
    padding: 0
}

.Input-wrapper.is-focus {
    background: #fff;
    border-color: #8590a6
}

html[data-theme=dark] .Input-wrapper.is-focus {
    background: #1a1a1a;
    border-color: #606a80
}

.Input {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    padding: 0;
    overflow: hidden;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    background: transparent;
    border: none;
    resize: none
}

.Input:focus {
    outline: none
}

input.Input {
    color: #1a1a1a;
    height: 24px;
    line-height: 24px
}

html[data-theme=dark] input.Input {
    color: #999
}

textarea.Input {
    color: #1a1a1a
}

html[data-theme=dark] textarea.Input {
    color: #999
}

.Input:not(input) {
    line-height: 24px
}

.Input:-ms-input-placeholder {
    line-height: normal
}

.Input::-webkit-input-placeholder {
    color: #8590a6
}

.Input::-ms-input-placeholder {
    color: #8590a6
}

.Input::placeholder {
    color: #8590a6
}

html[data-theme=dark] .Input::-webkit-input-placeholder {
    color: #606a80
}

html[data-theme=dark] .Input:-ms-input-placeholder {
    color: #606a80
}

html[data-theme=dark] .Input::-ms-input-placeholder {
    color: #606a80
}

html[data-theme=dark] .Input::placeholder {
    color: #606a80
}

.Input--validationError::-webkit-input-placeholder {
    color: #f1403c
}

.Input--validationError:-ms-input-placeholder {
    color: #f1403c
}

.Input--validationError::-ms-input-placeholder {
    color: #f1403c
}

.Input--validationError::placeholder {
    color: #f1403c
}

html[data-theme=dark] .Input--validationError::-webkit-input-placeholder {
    color: #b7302d
}

html[data-theme=dark] .Input--validationError:-ms-input-placeholder {
    color: #b7302d
}

html[data-theme=dark] .Input--validationError::-ms-input-placeholder {
    color: #b7302d
}

html[data-theme=dark] .Input--validationError::placeholder {
    color: #b7302d
}

.Input-wrapper--multiline .Input {
    overflow: auto
}

.VerificationDialogModalHeader {
    text-align: center
}

.VerificationDialogModalHeader-title {
    margin-top: 40px;
    font-size: 24px;
    color: #1a1a1a;
    margin-bottom: 0;
    padding: 0
}

html[data-theme=dark] .VerificationDialogModalHeader-title {
    color: #999
}

.VerificationDialogModalHeader-subTitle {
    margin: 2px auto 24px;
    font-size: 14px;
    color: #8590a6;
    max-width: 240px
}

html[data-theme=dark] .VerificationDialogModalHeader-subTitle {
    color: #606a80
}

.VerificationDialogModalHeader-subTitle:first-child:last-child {
    margin-bottom: 16px;
    max-width: none;
    text-align: left
}

.VerificationDialogModal-select {
    width: 100%;
    border-bottom: 1px solid #ebebeb
}

html[data-theme=dark] .VerificationDialogModal-select {
    border-bottom: 1px solid #444
}

.VerificationDialogModal-selectButton {
    padding: 4px 0;
    width: 100%;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.VerificationDialogModal-selectPopover {
    width: 376px
}

.VerificationDialogModal-code {
    position: relative
}

.VerificationDialogModal-code .CountingDownButton {
    top: 16px !important
}

.VerificationDialogModal-input {
    padding-left: 0;
    margin-top: 16px;
    width: 100%;
    border: none !important;
    border-bottom: 1px solid #ebebeb !important
}

html[data-theme=dark] .VerificationDialogModal-input {
    border-bottom: 1px solid #444 !important
}

.VerificationDialogModal-checkout {
    text-align: center
}

.VerificationDialogModal-button {
    color: #fff;
    background: #0084ff;
    width: 220px;
    height: 36px;
    border: 1px solid #0084ff;
    margin-top: 45px;
    font-size: 14px;
    border-radius: 3px
}

html[data-theme=dark] .VerificationDialogModal-button {
    color: #1a1a1a;
    background: #3a76d0;
    border: 1px solid #3a76d0
}

.VerificationDialogModal-button:hover {
    background: #0084ff
}

html[data-theme=dark] .VerificationDialogModal-button:hover {
    background: #3a76d0
}

.VerificationDialogModal-button:hover:disabled {
    background-color: #0084ff
}

html[data-theme=dark] .VerificationDialogModal-button:hover:disabled {
    background-color: #3a76d0
}

.VerificationDialogModal-tips {
    background: #f6f6f6;
    -webkit-box-shadow: 0 -1px 0 0 #ebebeb;
    box-shadow: 0 -1px 0 0 #ebebeb;
    margin: 30px -24px -32px;
    padding: 16px;
    font-size: 13px;
    line-height: 21px;
    color: #8590a6
}

html[data-theme=dark] .VerificationDialogModal-tips {
    background: #2e2e2e;
    -webkit-box-shadow: 0 -1px 0 0 #444;
    box-shadow: 0 -1px 0 0 #444;
    color: #606a80
}

.VerificationDialogModal-blue {
    color: #0084ff
}

html[data-theme=dark] .VerificationDialogModal-blue {
    color: #3a76d0
}

.VerificationDialogModal-options {
    margin-top: 16px;
    text-align: right
}

.VerificationDialogModal-cutSmsType:hover, html[data-theme=dark] .VerificationDialogModal-cutSmsType:hover {
    color: grey
}

.VerificationDialogModal-HelpWrapper {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-top: 12px
}

.VerificationDialogModal-HelpText {
    color: #8590a6
}

html[data-theme=dark] .VerificationDialogModal-HelpText {
    color: #606a80
}

.VerificationDialogMobileModal-HelpText {
    font-size: 13px;
    color: #8590a6;
    margin-top: 16px
}

html[data-theme=dark] .VerificationDialogMobileModal-HelpText {
    color: #606a80
}

.VerificationDialogModal-oneSelection {
    font-size: 14px
}

.VerificationDialogModal-smsInputButton {
    position: absolute;
    top: 24px;
    right: 0;
    padding: 4px 0;
    color: #175199;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

html[data-theme=dark] .VerificationDialogModal-smsInputButton {
    color: #175199
}

.Sticky.is-fixed {
    position: fixed;
    z-index: 2;
    -webkit-font-smoothing: subpixel-antialiased
}

.Sticky.is-absolute, .Sticky.is-fixed {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.Sticky.is-absolute {
    position: absolute;
    top: auto;
    bottom: 0;
    z-index: 1;
    margin-bottom: 0
}

.Sticky.is-absolute.is-bottom {
    top: 0;
    bottom: auto;
    margin-top: 0
}

.Sticky.Sticky--CSSSticky {
    position: -webkit-sticky;
    position: sticky
}

.Sticky--holder {
    visibility: hidden
}

.MobileAppHeader {
    border-bottom: 1px solid rgba(26, 26, 26, .06);
    -webkit-box-shadow: 0 1px 3px 0 rgba(23, 81, 153, .05);
    box-shadow: 0 1px 3px 0 rgba(23, 81, 153, .05);
    background-color: #fff;
    background-clip: content-box;
    min-width: 100%;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: -webkit-transform .3s .3s;
    transition: -webkit-transform .3s .3s;
    transition: transform .3s .3s;
    transition: transform .3s .3s, -webkit-transform .3s .3s;
    overflow: hidden
}

html[data-theme=dark] .MobileAppHeader {
    border-bottom: 1px solid hsla(0, 0%, 60%, .06);
    -webkit-box-shadow: 0 1px 3px 0 rgba(23, 81, 153, .05);
    box-shadow: 0 1px 3px 0 rgba(23, 81, 153, .05);
    background-color: #1a1a1a
}

.MobileAppHeader + .Sticky--holder {
    background-color: #fff;
    visibility: visible;
    visibility: initial
}

html[data-theme=dark] .MobileAppHeader + .Sticky--holder {
    background-color: #1a1a1a
}

.MobileAppHeader.is-hide {
    min-width: 100%;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%)
}

.MobileAppHeader, .MobileAppHeader.is-fixed {
    z-index: 100
}

.MobileAppHeader .Icon {
    vertical-align: middle
}

.MobileAppHeader-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 52px;
    line-height: 50px;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s
}

.MobileAppHeader.is-hidden .MobileAppHeader-inner {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%)
}

.MobileAppHeader-navItem {
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 12px
}

.MobileAppHeader-navItem .Zi {
    fill: #8590a6
}

html[data-theme=dark] .MobileAppHeader-navItem .Zi {
    fill: #606a80
}

.MobileAppHeader-expandBtn, .MobileAppHeader-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.MobileAppHeader-logo {
    padding-left: 16px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.MobileAppHeader-actions, .MobileAppHeader-logo {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.MobileAppHeader-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    color: #0084ff
}

html[data-theme=dark] .MobileAppHeader-actions {
    color: #3a76d0
}

.MobileAppHeader-authLink {
    padding: 0 20px
}

.MobileAppHeader-downloadLink {
    position: relative;
    padding-right: 16px
}

.MobileAppHeader-downloadLink:after {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    display: block;
    width: 0;
    height: 16px;
    border-left: 1px solid #ebebeb;
    content: ""
}

html[data-theme=dark] .MobileAppHeader-downloadLink:after {
    border-left: 1px solid #444
}

.MobileAppHeader-moreIconWrapper {
    position: relative;
    margin: 0 16px
}

.MobileAppHeader-expandModal {
    width: 100%;
    top: 0;
    -webkit-transform: unset;
    transform: unset
}

.MobileAppHeader-expandModal .MobileModal-content {
    padding: 0
}

.MobileAppHeader-expand {
    background: #fff;
    overflow: hidden
}

html[data-theme=dark] .MobileAppHeader-expand {
    background: #1a1a1a
}

.MobileAppHeader-expand a {
    height: 56px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #444;
    margin: 0 16px
}

html[data-theme=dark] .MobileAppHeader-expand a {
    color: grey
}

.MobileAppHeader-expand svg {
    margin-right: 14px
}

.MobileAppHeader-expand a:not(:first-child) {
    border-top: 1px solid #ebebeb
}

html[data-theme=dark] .MobileAppHeader-expand a:not(:first-child) {
    border-top: 1px solid #444
}

.MobileAppHeader-expand a:last-child {
    color: #8590a6
}

html[data-theme=dark] .MobileAppHeader-expand a:last-child {
    color: #606a80
}

.MobileAppHeader-expandContainer {
    position: fixed;
    top: 52px;
    width: 100%;
    z-index: 100
}

.MobileAppHeader-expandBackdrop {
    position: fixed;
    top: 52px;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
    background-color: rgba(26, 26, 26, .65)
}

html[data-theme=dark] .MobileAppHeader-expandBackdrop {
    background-color: hsla(0, 0%, 60%, .65)
}

.MobileAppHeader-expand-enter {
    height: 0
}

.MobileAppHeader-expand-enter a {
    opacity: 0
}

.MobileAppHeader-expand-enter .MobileAppHeader-expandBackdrop {
    background-color: rgba(26, 26, 26, 0)
}

html[data-theme=dark] .MobileAppHeader-expand-enter .MobileAppHeader-expandBackdrop {
    background-color: hsla(0, 0%, 60%, 0)
}

.MobileAppHeader-expand-enter.MobileAppHeader-expand-enter-active {
    height: 170px;
    -webkit-transition: height .3s ease;
    transition: height .3s ease
}

.MobileAppHeader-expand-enter.MobileAppHeader-expand-enter-active a {
    opacity: 1;
    -webkit-transition: opacity .3s cubic-bezier(1, 0, 1, 0);
    transition: opacity .3s cubic-bezier(1, 0, 1, 0)
}

.MobileAppHeader-expand-enter.MobileAppHeader-expand-enter-active .MobileAppHeader-expandBackdrop {
    background-color: rgba(26, 26, 26, .65);
    -webkit-transition: background-color .3s ease;
    transition: background-color .3s ease
}

html[data-theme=dark] .MobileAppHeader-expand-enter.MobileAppHeader-expand-enter-active .MobileAppHeader-expandBackdrop {
    background-color: hsla(0, 0%, 60%, .65)
}

.MobileAppHeader-expand-leave {
    height: 170px
}

.MobileAppHeader-expand-leave a {
    opacity: 1
}

.MobileAppHeader-expand-leave .MobileAppHeader-expandBackdrop {
    background-color: rgba(26, 26, 26, .65)
}

html[data-theme=dark] .MobileAppHeader-expand-leave .MobileAppHeader-expandBackdrop {
    background-color: hsla(0, 0%, 60%, .65)
}

.MobileAppHeader-expand-leave.MobileAppHeader-expand-leave-active {
    height: 0;
    -webkit-transition: height .3s ease;
    transition: height .3s ease
}

.MobileAppHeader-expand-leave.MobileAppHeader-expand-leave-active a {
    opacity: 0;
    -webkit-transition: opacity .3s cubic-bezier(0, 1, 0, 1);
    transition: opacity .3s cubic-bezier(0, 1, 0, 1)
}

.MobileAppHeader-expand-leave.MobileAppHeader-expand-leave-active .MobileAppHeader-expandBackdrop {
    background-color: rgba(26, 26, 26, 0);
    -webkit-transition: background-color .3s ease;
    transition: background-color .3s ease
}

html[data-theme=dark] .MobileAppHeader-expand-leave.MobileAppHeader-expand-leave-active .MobileAppHeader-expandBackdrop {
    background-color: hsla(0, 0%, 60%, 0)
}

.MobileAppHeader-noScrollBody {
    overflow: hidden
}

.MobileAppHeader-searchBox {
    background-color: hsla(0, 0%, 92.2%, .72);
    border-radius: 16px;
    height: 32px;
    color: #999;
    width: calc(100vw - 245px);
    margin: 0 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 15px;
    padding-right: 0
}

html[data-theme=dark] .MobileAppHeader-searchBox {
    background-color: rgba(68, 68, 68, .72);
    color: #646464
}

.MobileAppHeader-searchBox .Zi--Search {
    margin-right: 4px
}

.MobileAppHeader-searchBox .Input {
    -webkit-appearance: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.MobileAppHeader-searchResultBox {
    width: calc(100vw - 147px)
}

.MobileAppHeader-searchResultBox .Input::-webkit-search-cancel-button {
    display: none
}

.MobileAppHeader-searchBoxWithUnlogin {
    width: calc(100vw - 276px)
}

.MobileAppHeader-innerWithoutSearchHeader {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.CornerButtons {
    position: fixed;
    bottom: 0;
    right: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    transition: -webkit-transform .2s ease;
    -webkit-transition: -webkit-transform .2s ease;
    transition: transform .2s ease;
    transition: transform .2s ease, -webkit-transform .2s ease;
    will-change: transfrom
}

.CornerAnimayedFlex {
    width: 40px;
    height: 52px;
    -webkit-transition: height .2s ease;
    transition: height .2s ease
}

.CornerAnimayedFlex--hidden {
    height: 0
}

.CornerButton {
    background: #fff;
    border-radius: 4px;
    width: 40px;
    height: 40px;
    -webkit-box-shadow: 0 1px 3px rgba(26, 26, 26, .1);
    box-shadow: 0 1px 3px rgba(26, 26, 26, .1)
}

html[data-theme=dark] .CornerButton {
    background: #1a1a1a;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
}

.CornerButton:hover {
    background: #d3d3d3
}

html[data-theme=dark] .CornerButton:hover {
    background: #2e2e2e
}

.CornerButton .Zi {
    fill: #8590a6
}

html[data-theme=dark] .CornerButton .Zi {
    fill: #606a80
}

.CornerButton .Zi:hover {
    fill: #8590a6
}

html[data-theme=dark] .CornerButton .Zi:hover {
    fill: #606a80
}

.Tooltip {
    position: absolute;
    width: 0;
    height: 0
}

.Tooltip-enter, .Tooltip-leave {
    -webkit-transition: opacity .3s;
    transition: opacity .3s
}

.Tooltip-enter {
    opacity: 0
}

.Tooltip-enter-active, .Tooltip-leave {
    opacity: 1
}

.Tooltip-leave-active {
    opacity: 0
}

.TooltipContent-wrapper {
    position: relative;
    width: 0;
    height: 0
}

.TooltipContent {
    position: absolute;
    top: 0;
    left: 0;
    padding: 6px 8px;
    color: #fff;
    white-space: nowrap;
    background-color: rgba(26, 26, 26, .8);
    border-radius: 4px;
    font-size: 13px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

html[data-theme=dark] .TooltipContent {
    color: #1a1a1a;
    background-color: hsla(0, 0%, 60%, .8)
}

.TooltipContent.TooltipContent--white {
    background: #fff;
    border: 1px solid #ebebeb;
    color: #646464;
    -webkit-box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    box-shadow: 0 5px 20px rgba(26, 26, 26, .1)
}

html[data-theme=dark] .TooltipContent.TooltipContent--white {
    background: #1a1a1a;
    border: 1px solid #2e2e2e;
    color: #999;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
}

.TooltipContent.TooltipContent--white .TooltipContent-arrow:after {
    background: #fff;
    border: 1px solid #ebebeb
}

html[data-theme=dark] .TooltipContent.TooltipContent--white .TooltipContent-arrow:after {
    background: #1a1a1a;
    border: 1px solid #2e2e2e
}

.TooltipContent--top {
    -webkit-transform: translate(-50%, -100%) translateY(-8px);
    transform: translate(-50%, -100%) translateY(-8px)
}

.TooltipContent--bottom {
    -webkit-transform: translate(-50%) translateY(8px);
    transform: translate(-50%) translateY(8px)
}

.TooltipContent--left {
    -webkit-transform: translate(-100%, -50%) translateX(-8px);
    transform: translate(-100%, -50%) translateX(-8px)
}

.TooltipContent--right {
    -webkit-transform: translateY(-50%) translateX(8px);
    transform: translateY(-50%) translateX(8px)
}

.TooltipContent-arrow {
    overflow: hidden;
    position: absolute
}

.TooltipContent-arrow:after {
    background: rgba(26, 26, 26, .8);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    content: "";
    height: 32px;
    pointer-events: auto;
    position: absolute;
    width: 32px
}

html[data-theme=dark] .TooltipContent-arrow:after {
    background: hsla(0, 0%, 60%, .8)
}

.TooltipContent--top .TooltipContent-arrow:after {
    -webkit-transform: translate(-8px, -32px) rotate(45deg);
    transform: translate(-8px, -32px) rotate(45deg)
}

.TooltipContent--bottom .TooltipContent-arrow:after {
    -webkit-transform: translate(-8px, 8px) rotate(45deg);
    transform: translate(-8px, 8px) rotate(45deg)
}

.TooltipContent--left .TooltipContent-arrow:after {
    -webkit-transform: translate(-32px, -8px) rotate(45deg);
    transform: translate(-32px, -8px) rotate(45deg)
}

.TooltipContent--right .TooltipContent-arrow:after {
    -webkit-transform: translate(8px, -8px) rotate(45deg);
    transform: translate(8px, -8px) rotate(45deg)
}

.TooltipContent--top .TooltipContent-arrow {
    height: 8px;
    left: 50%;
    bottom: 0;
    -webkit-transform: translate(-50%, 100%);
    transform: translate(-50%, 100%);
    width: 16px
}

.TooltipContent--bottom .TooltipContent-arrow {
    height: 8px;
    left: 50%;
    top: 0;
    -webkit-transform: translate(-50%, -100%);
    transform: translate(-50%, -100%);
    width: 16px
}

.TooltipContent--left .TooltipContent-arrow {
    height: 16px;
    right: 0;
    top: 50%;
    -webkit-transform: translate(100%, -50%);
    transform: translate(100%, -50%);
    width: 8px
}

.TooltipContent--right .TooltipContent-arrow {
    height: 16px;
    left: 0;
    top: 50%;
    -webkit-transform: translate(-100%, -50%);
    transform: translate(-100%, -50%);
    width: 8px
}

.TooltipContent a {
    color: inherit;
    text-decoration: underline
}

.TooltipContent-children--restricted {
    display: block;
    max-width: 250px;
    max-height: 150px;
    overflow: auto;
    word-wrap: break-word;
    white-space: normal;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
}

.GlobalTooltip {
    position: fixed;
    z-index: 9999
}

.StaticCacheBanner {
    position: relative;
    z-index: 100;
    padding: 16px 10px;
    line-height: 28px;
    color: #8590a6;
    text-align: center;
    background-color: #ebebeb
}

html[data-theme=dark] .StaticCacheBanner {
    color: #606a80;
    background-color: #444
}

.StaticCacheBanner a {
    color: #175199;
    -webkit-transition: border-bottom .2s ease-in;
    transition: border-bottom .2s ease-in
}

html[data-theme=dark] .StaticCacheBanner a {
    color: #175199
}

.StaticCacheBanner a:hover, html[data-theme=dark] .StaticCacheBanner a:hover {
    border-bottom: 1px solid rgba(23, 81, 153, .72)
}

.LoadingBar {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 101;
    display: none;
    height: 2px;
    pointer-events: none;
    background: #0084ff;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%)
}

html[data-theme=dark] .LoadingBar {
    background: #3a76d0
}

.LoadingBar.is-active {
    display: block;
    -webkit-animation: LoadingBarForward 1s ease-in-out .8s infinite;
    animation: LoadingBarForward 1s ease-in-out .8s infinite
}

@-webkit-keyframes LoadingBarForward {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
    40% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    60% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    to {
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
}

@keyframes LoadingBarForward {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
    40% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    60% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    to {
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
}

.ShortcutHintModal {
    font-size: 15px;
    width: auto
}

.ShortcutHintModal .Modal-content {
    margin-top: 30px;
    padding: 0 0 32px
}

.ShortcutHintModal-content {
    padding: 0 20px 16px 0
}

.ShortcutHintModal-hintListContainer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ShortcutHintModal-hintList {
    padding: 0 30px
}

.ShortcutHintModal-hintList:first-child {
    border-right: 1px solid #f0f2f7
}

html[data-theme=dark] .ShortcutHintModal-hintList:first-child {
    border-right: 1px solid #2e2e2e
}

.ShortcutHintModal-hintTitle {
    font-weight: 700;
    margin-bottom: 24px;
    text-align: center
}

.KeyHint {
    margin-bottom: 16px
}

.KeyHint, .KeyHint-keyContainer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.KeyHint-keyContainer {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-right: 8px;
    width: 120px
}

.KeyHint-key {
    color: #8590a6;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

html[data-theme=dark] .KeyHint-key {
    color: #606a80
}

.KeyHint-separator {
    margin: 0 8px
}

.KeyHint-separator--space {
    margin: 0 4px
}

.KeyHint-kbd {
    border: 1px solid #f0f2f7;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .06);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: Menlo, Monaco, Consolas, Andale Mono, lucida console, Courier New, monospace;
    font-size: 16px;
    font-weight: 700;
    min-width: 26px;
    height: 26px;
    padding: 0 6px;
    text-align: center
}

html[data-theme=dark] .KeyHint-kbd {
    border: 1px solid #2e2e2e
}

.Tabs {
    border-bottom: 1px solid #f6f6f6
}

html[data-theme=dark] .Tabs {
    border-bottom: 1px solid #2e2e2e
}

.Tabs-item {
    display: inline-block;
    padding: 0 20px
}

.Tabs-link {
    position: relative;
    display: inline-block;
    padding: 14px 0;
    font-size: 16px;
    line-height: 22px;
    color: #1a1a1a;
    text-align: center
}

html[data-theme=dark] .Tabs-link {
    color: #999
}

.Tabs-link.is-active {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .Tabs-link.is-active {
    font-weight: 500
}

html[data-android] .Tabs-link.is-active {
    font-weight: 700
}

.Tabs-link.is-active:after {
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 3px;
    background: #0084ff;
    content: ""
}

html[data-theme=dark] .Tabs-link.is-active:after {
    background: #3a76d0
}

.Tabs-meta {
    margin-left: 6px;
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
    color: #999
}

html[data-theme=dark] .Tabs-meta {
    color: #646464
}

.ZhihuLogo {
    fill: #0084ff
}

html[data-theme=dark] .ZhihuLogo {
    fill: #3a76d0
}

.ZhihuLogo--grey {
    fill: #999
}

html[data-theme=dark] .ZhihuLogo--grey {
    fill: #646464
}

.ZhihuLogo--red {
    fill: #f1403c
}

html[data-theme=dark] .ZhihuLogo--red {
    fill: #b7302d
}

.ZhihuLogo--green, html[data-theme=dark] .ZhihuLogo--green {
    fill: #67c23a
}

.OrgZhihuLogo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 18px
}

.OrgZhihuLogo-appName {
    margin-left: 15px;
    border-left: 1px solid #cfdae6;
    padding-left: 10px;
    line-height: 28px
}

.OrgAppHeader {
    position: relative;
    z-index: 100;
    min-width: 1032px;
    overflow: hidden;
    background: #fff;
    -webkit-box-shadow: 0 1px 3px rgba(26, 26, 26, .1);
    box-shadow: 0 1px 3px rgba(26, 26, 26, .1);
    background-clip: content-box
}

html[data-theme=dark] .OrgAppHeader {
    background: #1a1a1a;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
}

.OrgAppHeader.is-fixed {
    z-index: 100
}

.OrgAppHeader-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    margin: 0 auto;
    padding: 0 16px;
    width: 1000px;
    height: 52px;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s
}

.OrgAppHeader.is-hidden .OrgAppHeader-inner {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%)
}

.OrgAppHeader-userInfo {
    color: #444
}

.OrgAppHeader-userInfo .Button {
    margin-left: 16px
}

.Menu {
    padding: 6px 0
}

.Menu-item {
    display: block;
    width: 100%;
    padding: 0 20px;
    text-align: left;
    cursor: pointer;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.Menu-item.is-active {
    background: #f6f6f6
}

html[data-theme=dark] .Menu-item.is-active {
    background: #2e2e2e
}

.Menu-item--noActive {
    cursor: default
}

.Menu-divider {
    margin: 8px 0;
    border-bottom: 1px solid #ebebeb
}

html[data-theme=dark] .Menu-divider {
    border-bottom: 1px solid #444
}

.BounceLoading {
    position: relative
}

.BounceLoading .BounceLoading-child {
    position: absolute;
    background-color: #0084ff;
    border-radius: 50%;
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-name: Bounce;
    animation-name: Bounce;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

html[data-theme=dark] .BounceLoading .BounceLoading-child {
    background-color: #3a76d0
}

@-webkit-keyframes Bounce {
    0%, to {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
    50% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
}

@keyframes Bounce {
    0%, to {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
    50% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
}

.InfiLoader--bounceShown {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 100px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.PlaceHolder-inner {
    position: relative;
    overflow: hidden;
    background: #f6f6f6;
    color: #fff
}

html[data-theme=dark] .PlaceHolder-inner {
    background: #2e2e2e;
    color: #1a1a1a
}

.PlaceHolder-mask {
    position: relative;
    min-width: 100%;
    vertical-align: top;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.PlaceHolder-bg {
    position: absolute;
    width: 200%;
    height: 100%;
    background: -webkit-gradient(linear, left top, right top, from(#f6f6f6), color-stop(20%, #ebebeb), color-stop(40%, #f6f6f6), to(#f6f6f6));
    background: linear-gradient(90deg, #f6f6f6 0, #ebebeb 20%, #f6f6f6 40%, #f6f6f6);
    -webkit-animation: linear-double 1s linear 1ms infinite forwards;
    animation: linear-double 1s linear 1ms infinite forwards
}

html[data-theme=dark] .PlaceHolder-bg {
    background: -webkit-gradient(linear, left top, right top, from(#2e2e2e), color-stop(20%, #444), color-stop(40%, #2e2e2e), to(#2e2e2e));
    background: linear-gradient(90deg, #2e2e2e 0, #444 20%, #2e2e2e 40%, #2e2e2e)
}

@-webkit-keyframes linear-double {
    0% {
        -webkit-transform: translateX(-56%);
        transform: translateX(-56%)
    }
    to {
        -webkit-transform: translateX(56%);
        transform: translateX(56%)
    }
}

@keyframes linear-double {
    0% {
        -webkit-transform: translateX(-56%);
        transform: translateX(-56%)
    }
    to {
        -webkit-transform: translateX(56%);
        transform: translateX(56%)
    }
}

.ztext {
    word-break: break-word;
    line-height: 1.6
}

.ztext > :first-child {
    margin-top: 0
}

.ztext > :last-child {
    margin-bottom: 0
}

.ztext h1, .ztext h2 {
    clear: left;
    margin-top: 2.33333em;
    margin-bottom: 1.16667em;
    font-size: 1.2em;
    line-height: 1.5;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .ztext h1, html[data-ios] .ztext h2 {
    font-weight: 500
}

html[data-android] .ztext h1, html[data-android] .ztext h2 {
    font-weight: 700
}

.ztext h3, .ztext h4, .ztext h5, .ztext h6 {
    clear: left;
    margin-top: 1.90909em;
    margin-bottom: 1.27273em;
    font-size: 1.1em;
    line-height: 1.5;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .ztext h3, html[data-ios] .ztext h4, html[data-ios] .ztext h5, html[data-ios] .ztext h6 {
    font-weight: 500
}

html[data-android] .ztext h3, html[data-android] .ztext h4, html[data-android] .ztext h5, html[data-android] .ztext h6 {
    font-weight: 700
}

.ztext u {
    text-decoration: none
}

.ztext u, html[data-theme=dark] .ztext u {
    border-bottom: 1px dashed grey
}

.ztext b {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .ztext b {
    font-weight: 500
}

html[data-android] .ztext b {
    font-weight: 700
}

.ztext sup {
    font-size: .8em
}

.ztext sup[data-draft-type=reference], html[data-theme=dark] .ztext sup[data-draft-type=reference] {
    color: #175199
}

.ztext a:focus {
    outline: none;
    -webkit-transition: -webkit-box-shadow .3s;
    transition: -webkit-box-shadow .3s;
    transition: box-shadow .3s;
    transition: box-shadow .3s, -webkit-box-shadow .3s
}

html[data-focus-visible] .ztext a:focus {
    -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0, 132, 255, .3);
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0, 132, 255, .3)
}

html[data-theme=dark][data-focus-visible] .ztext a:focus {
    -webkit-box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 4px rgba(58, 118, 208, .6);
    box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 4px rgba(58, 118, 208, .6)
}

.ztext a.external, .ztext a.internal, .ztext a.ztext-link {
    text-decoration: none;
    cursor: pointer;
    border-bottom: 1px solid grey
}

html[data-theme=dark] .ztext a.external, html[data-theme=dark] .ztext a.internal, html[data-theme=dark] .ztext a.ztext-link {
    border-bottom: 1px solid grey
}

.ztext a.external:hover, .ztext a.internal:hover, .ztext a.ztext-link:hover {
    color: #175199;
    border-bottom: 1px solid #175199
}

html[data-theme=dark] .ztext a.external:hover, html[data-theme=dark] .ztext a.internal:hover, html[data-theme=dark] .ztext a.ztext-link:hover {
    color: #175199;
    border-bottom: 1px solid #175199
}

.ztext a.external > .ellipsis:after, .ztext a.internal > .ellipsis:after, .ztext a.ztext-link > .ellipsis:after {
    content: "..."
}

.ztext a.external > .invisible, .ztext a.internal > .invisible, .ztext a.ztext-link > .invisible {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent
}

.ztext a.external u, .ztext a.internal u, .ztext a.ztext-link u {
    border: none
}

.ztext a.member_mention, html[data-theme=dark] .ztext a.member_mention {
    color: #175199
}

.ztext a.member_mention:hover, html[data-theme=dark] .ztext a.member_mention:hover {
    border-bottom: 1px solid #175199
}

.ztext p {
    margin: 1.4em 0
}

.ztext p.ztext-empty-paragraph {
    margin: -.8em 0
}

.ztext p.ztext-empty-paragraph + .ztext-empty-paragraph {
    margin: 1.4em 0
}

.ztext hr {
    margin: 4em auto;
    width: 240px;
    max-width: 100%;
    border: none;
    border-top: 1px solid #d3d3d3
}

html[data-theme=dark] .ztext hr {
    border-top: 1px solid #2e2e2e
}

.ztext img[eeimg] {
    max-width: 100%;
    vertical-align: middle
}

html[data-theme=dark] .ztext img[eeimg] {
    -webkit-filter: invert(.6) hue-rotate(180deg);
    filter: invert(.6) hue-rotate(180deg)
}

.ztext img[eeimg="1"] {
    margin: 0 3px;
    display: inline-block
}

.ztext img[eeimg="2"] {
    margin: 1.4em auto;
    display: block
}

.ztext blockquote {
    margin: 1.4em 0;
    padding-left: 1em;
    color: #646464;
    border-left: 3px solid #d3d3d3
}

html[data-theme=dark] .ztext blockquote {
    color: #999;
    border-left: 3px solid #2e2e2e
}

.ztext ol, .ztext ul {
    margin: 1.4em 0;
    padding: 0
}

.ztext ol ol, .ztext ol ul, .ztext ul ol, .ztext ul ul {
    margin: 0
}

.ztext ol > ol, .ztext ol > ul, .ztext ul > ol, .ztext ul > ul {
    display: table-row
}

.ztext ol > ol:before, .ztext ol > ul:before, .ztext ul > ol:before, .ztext ul > ul:before {
    display: table-cell;
    content: ""
}

.ztext ul {
    display: table
}

.ztext ul > li {
    display: table-row;
    list-style: none
}

.ztext ul > li:before {
    display: table-cell;
    content: "\2022   ";
    white-space: pre
}

.ztext ol {
    display: table;
    counter-reset: ol
}

.ztext ol > li {
    display: table-row;
    list-style: none
}

.ztext ol > li:before {
    display: table-cell;
    text-align: right;
    counter-increment: ol;
    content: counter(ol) ". ";
    white-space: pre
}

.ztext ol ol {
    counter-reset: ol2
}

.ztext ol ol li:before {
    counter-increment: ol2;
    content: counter(ol2) ". "
}

.ztext ol ol ol {
    counter-reset: ol3
}

.ztext ol ol ol li:before {
    counter-increment: ol3;
    content: counter(ol3) ". "
}

.ztext ol ol ol ol {
    counter-reset: ol4
}

.ztext ol ol ol ol li:before {
    counter-increment: ol4;
    content: counter(ol4) ". "
}

.ztext figure {
    margin: 1.4em 0
}

.ztext figure .content_image, .ztext figure .origin_image {
    margin: 0 auto
}

.ztext figure figcaption {
    margin-top: .66667em;
    padding: 0 1em;
    font-size: .9em;
    line-height: 1.5;
    text-align: center;
    color: #999
}

html[data-theme=dark] .ztext figure figcaption {
    color: #646464
}

.ztext figure + figure {
    margin-top: 2.24em
}

.ztext figure:not([data-size]) > [data-size=small], .ztext figure[data-size=small] {
    clear: both
}

.ztext figure:not([data-size]) > [data-size=left], .ztext figure[data-size=left] {
    float: left;
    margin: 0 20px 20px 0;
    max-width: 33%
}

.ztext figure:not([data-size]) > [data-size=right], .ztext figure[data-size=right] {
    float: right;
    margin: 0 0 20px 20px;
    max-width: 33%
}

.ztext .content_image, .ztext .origin_image {
    display: block;
    max-width: 100%;
    margin: 1.4em auto
}

html[data-theme=dark] .ztext .content_image, html[data-theme=dark] .ztext .origin_image {
    -webkit-filter: brightness(.7);
    filter: brightness(.7)
}

html[data-ios] .ztext .content_image, html[data-ios] .ztext .origin_image {
    -webkit-filter: none;
    filter: none
}

.ztext .content_image[data-size=small], .ztext .origin_image[data-size=small] {
    max-width: 40%
}

.ztext .content_image.zh-lightbox-thumb, .ztext .origin_image.zh-lightbox-thumb {
    cursor: -webkit-zoom-in;
    cursor: zoom-in
}

.ztext code {
    margin: 0 2px;
    padding: 3px 4px;
    border-radius: 3px;
    font-family: Menlo, Monaco, Consolas, Andale Mono, lucida console, Courier New, monospace;
    font-size: .9em;
    background-color: #f6f6f6
}

html[data-theme=dark] .ztext code {
    background-color: #2e2e2e
}

.ztext pre {
    margin: 1.4em 0;
    padding: .88889em;
    font-size: .9em;
    word-break: normal;
    word-wrap: normal;
    white-space: pre;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    background: #f6f6f6;
    border-radius: 4px
}

html[data-theme=dark] .ztext pre {
    background: #2e2e2e
}

.ztext pre code {
    margin: 0;
    padding: 0;
    font-size: inherit;
    border-radius: 0;
    background-color: inherit
}

.ztext li pre {
    white-space: pre-wrap
}

.ztext-referene-tooltip .TooltipContent-children {
    display: block;
    max-width: 250px;
    max-height: 150px;
    overflow: auto;
    word-wrap: break-word;
    white-space: normal;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
}

.ztext .link-box, .ztext .video-box {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 1.4em 0;
    overflow: auto;
    white-space: normal;
    cursor: pointer;
    border: 1px solid #ebebeb;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 3px rgba(26, 26, 26, .1);
    box-shadow: 0 1px 3px rgba(26, 26, 26, .1)
}

html[data-theme=dark] .ztext .link-box, html[data-theme=dark] .ztext .video-box {
    border: 1px solid #444;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
}

.ztext .link-box .thumbnail, .ztext .video-box .thumbnail {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 90px;
    height: 90px;
    -o-object-fit: cover;
    object-fit: cover
}

.ztext .link-box .content, .ztext .video-box .content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    padding: 10px 1em;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: distribute;
    justify-content: space-around
}

.ztext .link-box .title, .ztext .video-box .title {
    font-size: 1.2em;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .ztext .link-box .title, html[data-ios] .ztext .video-box .title {
    font-weight: 500
}

html[data-android] .ztext .link-box .title, html[data-android] .ztext .video-box .title {
    font-weight: 700
}

.ztext .link-box .url, .ztext .video-box .url {
    overflow: hidden;
    color: grey;
    text-overflow: ellipsis;
    word-wrap: normal;
    white-space: nowrap
}

html[data-theme=dark] .ztext .link-box .url, html[data-theme=dark] .ztext .video-box .url {
    color: grey
}

.ztext .link-box .label, .ztext .video-box .label {
    display: none
}

.Avatar {
    background: #fff;
    border-radius: 2px
}

html[data-theme=dark] .Avatar {
    background: #1a1a1a
}

.Avatar--medium {
    border-radius: 3px
}

.Avatar--large {
    border-radius: 4px
}

.Avatar--round {
    border-radius: 50%
}

.NumberBoard {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.NumberBoard--divider .NumberBoard-item + .NumberBoard-item .NumberBoard-itemInner {
    border-left: 1px solid #ebebeb
}

html[data-theme=dark] .NumberBoard--divider .NumberBoard-item + .NumberBoard-item .NumberBoard-itemInner {
    border-left: 1px solid #444
}

.NumberBoard-item {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1
}

.NumberBoard-item.Button {
    border: 0;
    line-height: unset;
    font-size: unset
}

.NumberBoard-item.Button:hover {
    background: none
}

.NumberBoard-item.Button:hover .NumberBoard-itemName, .NumberBoard-item.Button:hover .NumberBoard-itemValue, .NumberBoard-itema:hover .NumberBoard-itemName, .NumberBoard-itema:hover .NumberBoard-itemValue, html[data-theme=dark] .NumberBoard-item.Button:hover .NumberBoard-itemName, html[data-theme=dark] .NumberBoard-item.Button:hover .NumberBoard-itemValue, html[data-theme=dark] .NumberBoard-itema:hover .NumberBoard-itemName, html[data-theme=dark] .NumberBoard-itema:hover .NumberBoard-itemValue {
    color: #175199
}

.NumberBoard-itemInner {
    text-align: center;
    line-height: 1.6
}

.NumberBoard-itemName {
    font-size: 14px;
    color: #8590a6
}

html[data-theme=dark] .NumberBoard-itemName {
    color: #606a80
}

.NumberBoard-itemValue {
    display: inline-block;
    font-size: 18px;
    color: #1a1a1a;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .NumberBoard-itemValue {
    color: #999
}

html[data-ios] .NumberBoard-itemValue {
    font-weight: 500
}

html[data-android] .NumberBoard-itemValue {
    font-weight: 700
}

.HoverCard-coverContainer {
    height: 100px;
    margin: 0 -12px;
    overflow: hidden;
    border-radius: 2px 2px 0 0
}

.HoverCard-cover {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.HoverCard-subtitle, .HoverCard-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.HoverCard-title {
    font-size: 16px;
    font-weight: 500
}

.HoverCard-subtitle {
    margin-top: 4px;
    font-weight: 400
}

.HoverCard-titleContainer {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 8px 0;
    border-bottom: 1px solid #f6f6f6;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

html[data-theme=dark] .HoverCard-titleContainer {
    border-bottom: 1px solid #2e2e2e
}

.HoverCard-titleContainer--noAvatar {
    margin-top: 20px
}

.HoverCard-avatar {
    position: absolute;
    top: -20px;
    border: 2px solid #fff
}

html[data-theme=dark] .HoverCard-avatar {
    border: 2px solid #1a1a1a
}

.HoverCard-titleText {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 42px;
    padding-bottom: 2px;
    margin-left: 84px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1
}

.HoverCard-attrInfo {
    margin-left: 10px;
    color: #8590a6;
    white-space: nowrap
}

html[data-theme=dark] .HoverCard-attrInfo {
    color: #606a80
}

.HoverCard-attrInfo .Icon {
    margin-right: 8px
}

.HoverCard {
    padding: 0 12px 16px;
    font-size: 14px;
    opacity: 1;
    -webkit-transition: opacity .3s ease;
    transition: opacity .3s ease
}

.HoverCard--isLoading {
    opacity: 0
}

.HoverCard, .HoverCard-loading {
    -webkit-box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    background: #fff;
    border-radius: 2px
}

html[data-theme=dark] .HoverCard, html[data-theme=dark] .HoverCard-loading {
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    background: #1a1a1a
}

.HoverCard-container {
    width: 360px;
    max-height: 600px
}

.HoverCard-loading {
    position: absolute;
    width: 120px;
    height: 80px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: auto
}

.HoverCard-loading--reversed {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%)
}

.HoverCard-container--large {
    width: 400px
}

.HoverCard-numberBoard {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.HoverCard-buttons {
    margin-top: 16px
}

.HoverCard-buttons .Button {
    width: 144px
}

.HoverCard-numberGroup {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1
}

.HoverCard-boardKey {
    line-height: 1.7;
    color: #8590a6
}

html[data-theme=dark] .HoverCard-boardKey {
    color: #606a80
}

.HoverCard-boardNumber {
    margin-top: 4px;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.4;
    color: #1a1a1a
}

html[data-theme=dark] .HoverCard-boardNumber {
    color: #999
}

.HoverCard-item {
    padding: 8px 0;
    line-height: 1.75;
    border-bottom: 1px solid #f6f6f6
}

html[data-theme=dark] .HoverCard-item {
    border-bottom: 1px solid #2e2e2e
}

.HoverCard-item:last-child {
    padding: 8px 16px;
    text-align: center;
    border: 0
}

.HoverCard-item .Icon {
    margin-right: 8px
}

.HoverCard-description {
    display: block;
    display: -webkit-box;
    max-height: 73.5px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical
}

.HoverCard-separate {
    color: #ebebeb
}

html[data-theme=dark] .HoverCard-separate {
    color: #444
}

.HoverCard-popoverTarget {
    border-width: 0;
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none
}

.FollowButton {
    min-width: 96px
}

.FollowButton-icon {
    margin-right: 8px;
    fill: currentColor
}

.WalleModal-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 15px
}

.WalleModal-des {
    font-size: 15px;
    line-height: 1.4;
    color: #444
}

html[data-theme=dark] .WalleModal-des {
    color: grey
}

.WalleModal-img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    margin-top: 40px;
    margin-bottom: 15px
}

.WalleModal-open {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.WalleModal-content {
    width: 60%
}

.WalleModal-title {
    font-size: 16px;
    line-height: 1.2;
    color: #444
}

html[data-theme=dark] .WalleModal-title {
    color: grey
}

@media only screen and (min-device-width: 320px) {
    .WalleModal-title {
        font-size: 15px
    }
}

.WalleModal-intro {
    font-size: 13px;
    line-height: 1.38;
    color: #646464;
    margin-top: 3px
}

html[data-theme=dark] .WalleModal-intro {
    color: #999
}

.WalleModal-btn {
    width: 92px;
    height: 32px
}

.Spinner-blade {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px
}

.Spinner-blade--large {
    width: 35px;
    height: 35px
}

.Spinner-blade--large .Spinner-blade-12 {
    width: 8.57143%;
    height: 25.71429%;
    border-radius: 50%/16.67%
}

.Spinner-blade--white .Spinner-blade-12 {
    background-color: #fff
}

html[data-theme=dark] .Spinner-blade--white .Spinner-blade-12 {
    background-color: #1a1a1a
}

@-webkit-keyframes spinnerBladeFade {
    0% {
        opacity: .85
    }
    50% {
        opacity: .25
    }
    to {
        opacity: .25
    }
}

@keyframes spinnerBladeFade {
    0% {
        opacity: .85
    }
    50% {
        opacity: .25
    }
    to {
        opacity: .25
    }
}

.Spinner-blade-12 {
    position: absolute;
    left: 44.5%;
    top: 37%;
    width: 10%;
    height: 25%;
    border-radius: 50%/20%;
    background-color: #999;
    -webkit-animation: spinnerBladeFade 1s linear infinite;
    animation: spinnerBladeFade 1s linear infinite
}

html[data-theme=dark] .Spinner-blade-12 {
    background-color: #646464
}

.Spinner-blade-12:first-child {
    -webkit-animation-delay: -1.66667s;
    animation-delay: -1.66667s;
    -webkit-transform: rotate(30deg) translateY(-150%);
    transform: rotate(30deg) translateY(-150%)
}

.Spinner-blade-12:nth-child(2) {
    -webkit-animation-delay: -1.58333s;
    animation-delay: -1.58333s;
    -webkit-transform: rotate(60deg) translateY(-150%);
    transform: rotate(60deg) translateY(-150%)
}

.Spinner-blade-12:nth-child(3) {
    -webkit-animation-delay: -1.5s;
    animation-delay: -1.5s;
    -webkit-transform: rotate(90deg) translateY(-150%);
    transform: rotate(90deg) translateY(-150%)
}

.Spinner-blade-12:nth-child(4) {
    -webkit-animation-delay: -1.41667s;
    animation-delay: -1.41667s;
    -webkit-transform: rotate(120deg) translateY(-150%);
    transform: rotate(120deg) translateY(-150%)
}

.Spinner-blade-12:nth-child(5) {
    -webkit-animation-delay: -1.33333s;
    animation-delay: -1.33333s;
    -webkit-transform: rotate(150deg) translateY(-150%);
    transform: rotate(150deg) translateY(-150%)
}

.Spinner-blade-12:nth-child(6) {
    -webkit-animation-delay: -1.25s;
    animation-delay: -1.25s;
    -webkit-transform: rotate(180deg) translateY(-150%);
    transform: rotate(180deg) translateY(-150%)
}

.Spinner-blade-12:nth-child(7) {
    -webkit-animation-delay: -1.16667s;
    animation-delay: -1.16667s;
    -webkit-transform: rotate(210deg) translateY(-150%);
    transform: rotate(210deg) translateY(-150%)
}

.Spinner-blade-12:nth-child(8) {
    -webkit-animation-delay: -1.08333s;
    animation-delay: -1.08333s;
    -webkit-transform: rotate(240deg) translateY(-150%);
    transform: rotate(240deg) translateY(-150%)
}

.Spinner-blade-12:nth-child(9) {
    -webkit-animation-delay: -1s;
    animation-delay: -1s;
    -webkit-transform: rotate(270deg) translateY(-150%);
    transform: rotate(270deg) translateY(-150%)
}

.Spinner-blade-12:nth-child(10) {
    -webkit-animation-delay: -.91667s;
    animation-delay: -.91667s;
    -webkit-transform: rotate(300deg) translateY(-150%);
    transform: rotate(300deg) translateY(-150%)
}

.Spinner-blade-12:nth-child(11) {
    -webkit-animation-delay: -.83333s;
    animation-delay: -.83333s;
    -webkit-transform: rotate(330deg) translateY(-150%);
    transform: rotate(330deg) translateY(-150%)
}

.Spinner-blade-12:nth-child(12) {
    -webkit-animation-delay: -.75s;
    animation-delay: -.75s;
    -webkit-transform: rotate(1turn) translateY(-150%);
    transform: rotate(1turn) translateY(-150%)
}

.TextMessage {
    max-width: 388px;
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: .4px;
    position: relative;
    margin-right: 8px;
    margin-left: 8px;
    text-align: left;
    min-height: 40px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    white-space: pre-wrap;
    word-break: break-all
}

.TextMessage img {
    height: 20px;
    width: 20px;
    vertical-align: bottom
}

.TextMessage a {
    text-decoration: underline
}

.TextMessage a::hover {
    cursor: pointer
}

.TextMessage-sender {
    background-color: #f6f6f6;
    color: #444
}

html[data-theme=dark] .TextMessage-sender {
    background-color: #2e2e2e;
    color: grey
}

.TextMessage-sender:after {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    left: -4px;
    top: 14px;
    background: #f6f6f6;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

html[data-theme=dark] .TextMessage-sender:after {
    background: #2e2e2e
}

.TextMessage-sender a, html[data-theme=dark] .TextMessage-sender a {
    color: #175199
}

.TextMessage-receiver {
    background-color: #0084ff;
    color: #fff
}

html[data-theme=dark] .TextMessage-receiver {
    background-color: #3a76d0;
    color: #1a1a1a
}

.TextMessage-receiver:after {
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    right: -4px;
    top: 14px;
    background: #0084ff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

html[data-theme=dark] .TextMessage-receiver:after {
    background: #3a76d0
}

.ImageView {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 101;
    overflow: hidden;
    -webkit-transition: background-color .2s ease-in-out;
    transition: background-color .2s ease-in-out
}

.ImageView.is-active {
    background-color: rgba(26, 26, 26, .65)
}

html[data-theme=dark] .ImageView.is-active {
    background-color: rgba(0, 0, 0, .65)
}

.ImageView-inner {
    height: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.ImageView-img {
    cursor: -webkit-zoom-out;
    cursor: zoom-out;
    transition: -webkit-transform .3s ease-in-out;
    -webkit-transition: -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out
}

.ImageView-transformOrigin {
    -webkit-transform-origin: left top;
    transform-origin: left top;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
    transition-property: -webkit-transform opacity;
    -webkit-transition-property: -webkit-transform opacity;
    transition-property: transform opacity;
    transition-property: transform opacity, -webkit-transform opacity
}

.ImageMessage {
    border-radius: 8px;
    cursor: -webkit-zoom-in;
    cursor: zoom-in
}

.ImageMessage-ImageView {
    z-index: 204
}

.ImageMessage--temp {
    cursor: wait
}

.StickerMessage {
    height: 120px;
    width: 120px
}

.ActionMenu {
    width: 95px;
    text-align: center;
    border-radius: 8px;
    background-color: #fff;
    padding: 8px 0
}

html[data-theme=dark] .ActionMenu {
    background-color: #1a1a1a
}

.ActionMenu-item {
    height: 40px;
    line-height: 40px;
    text-align: center
}

.ActionMenu-item:hover {
    background-color: #f6f6f6;
    cursor: pointer
}

html[data-theme=dark] .ActionMenu-item:hover {
    background-color: #2e2e2e
}

.Message {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 20px
}

.Message--reverse {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.Message-avatar {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -ms-flex-item-align: start;
    align-self: flex-start
}

.Message-content {
    margin: 0 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.Message-content--reverse {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.Message-status {
    margin: 0 8px
}

.Message-status--loading {
    height: 15px;
    width: 15px
}

.Message-status--failure {
    fill: #f1403c;
    height: 20px;
    width: 20px
}

html[data-theme=dark] .Message-status--failure {
    fill: #b7302d
}

.Message-status--more {
    fill: #999;
    height: 16px;
    width: 16px;
    cursor: pointer
}

html[data-theme=dark] .Message-status--more {
    fill: #646464
}

.Message-time {
    padding-top: 15px;
    text-align: center;
    font-size: 12px;
    line-height: 20px;
    color: #999
}

html[data-theme=dark] .Message-time {
    color: #646464
}

.Message-status--wrapper {
    position: relative
}

.Message-actionMenu {
    position: absolute;
    top: 20px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: #fff;
    z-index: 1
}

html[data-theme=dark] .Message-actionMenu {
    background-color: #1a1a1a
}

.Message-actionMenu:before {
    content: "";
    border-left: 7px solid transparent;
    border-bottom: 8px solid #fff;
    border-right: 7px solid transparent;
    position: absolute;
    top: -8px;
    left: 40px
}

html[data-theme=dark] .Message-actionMenu:before {
    border-bottom: 8px solid #1a1a1a
}

.Message-UserLink {
    position: relative
}

.Message-UserLink .UserLink-badge {
    position: absolute;
    top: 24px;
    right: 0
}

.MessagesBox {
    height: 100%;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll
}

.MessagesBox-loading {
    margin: 20px auto 0
}

.UploadPicture-wrapper {
    cursor: pointer
}

.UploadPicture-input {
    display: none
}

.EmoticonsFooter {
    height: 40px;
    background-color: #f6f6f6;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    overflow: hidden;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

html[data-theme=dark] .EmoticonsFooter {
    background-color: #2e2e2e
}

.EmoticonsFooter-items {
    overflow-x: scroll;
    white-space: nowrap;
    height: 100%;
    padding-bottom: 17px;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    overflow-y: hidden
}

.EmoticonsFooter-item {
    display: inline-block;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 50px;
    height: 40px;
    text-align: center;
    vertical-align: bottom
}

.EmoticonsFooter-itemIcon {
    height: 40px
}

.EmoticonsFooter-item--selected {
    background-color: #fff
}

html[data-theme=dark] .EmoticonsFooter-item--selected {
    background-color: #1a1a1a
}

.EmoticonPanel {
    padding: 5px 5px 0
}

.EmoticonPanel-item {
    padding: 5px;
    display: inline-block;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center
}

.EmoticonPanel-item:hover {
    background-color: #f6f6f6;
    cursor: pointer
}

html[data-theme=dark] .EmoticonPanel-item:hover {
    background-color: #2e2e2e
}

.EmoticonPanel-item--big {
    width: 75px;
    height: 80px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.EmoticonPanel-itemImg--small {
    height: 24px;
    width: 24px
}

.EmoticonPanel-itemImg--big {
    height: 58px;
    width: 58px;
    min-height: 58px
}

.EmoticonPanel-itemTitle {
    font-size: 12px;
    line-height: 14px;
    padding-top: 2px;
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    color: #999
}

html[data-theme=dark] .EmoticonPanel-itemTitle {
    color: #646464
}

.EmoticonPanel-spinner {
    margin: 0 auto;
    display: block;
    top: 45%
}

.EmoticonPagination {
    text-align: center
}

.EmoticonPagination-bullet {
    width: 4px;
    height: 4px;
    display: inline-block;
    border-radius: 100%;
    background: #d3d3d3
}

html[data-theme=dark] .EmoticonPagination-bullet {
    background: #2e2e2e
}

.EmoticonPagination-bullet + .EmoticonPagination-bullet {
    margin-left: 5px
}

.EmoticonPagination-bullet--active, html[data-theme=dark] .EmoticonPagination-bullet--active {
    background: grey
}

.Emoticons {
    width: 316px;
    height: 224px;
    border-radius: 8px;
    background-color: #fff;
    border: 1px solid #ebebeb;
    -webkit-box-shadow: 0 0 16px 0 rgba(26, 26, 26, .15);
    box-shadow: 0 0 16px 0 rgba(26, 26, 26, .15);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

html[data-theme=dark] .Emoticons {
    background-color: #1a1a1a;
    border: 1px solid #444;
    -webkit-box-shadow: 0 0 16px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 0 16px 0 rgba(0, 0, 0, .15)
}

.Emoticons-panels {
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    height: 184px
}

.Emoticons-panels-item {
    height: 184px;
    width: 100%;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.swiper-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.Emoticons-panelContainer {
    overflow: hidden
}

.Emoticons-Pagination {
    position: absolute;
    bottom: 44px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    left: 50%
}

.EmoticonTool {
    position: relative
}

.EmoticonTool-panel {
    position: absolute;
    bottom: 35px;
    left: -25px;
    z-index: 102
}

.EmoticonTool-panel:after {
    content: "";
    border-left: 7px solid transparent;
    border-top: 8px solid #fff;
    border-right: 7px solid transparent;
    position: absolute;
    bottom: -8px;
    left: 28px
}

html[data-theme=dark] .EmoticonTool-panel:after {
    border-top: 8px solid #1a1a1a
}

.EmoticonTool--mask {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 101;
    top: 0;
    left: 0
}

.EmoticonTool-icon {
    cursor: pointer
}

.ToolBar {
    border-top: 1px solid #ebebeb;
    margin: 0 14px;
    padding: 11px 0 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: left
}

html[data-theme=dark] .ToolBar {
    border-top: 1px solid #444
}

.ToolBar-item {
    display: inline-block
}

.ToolBar-Icon {
    height: 24px;
    width: 24px;
    fill: #646464
}

html[data-theme=dark] .ToolBar-Icon {
    fill: #999
}

.ToolBar-item + .ToolBar-item {
    margin-left: 10px
}

.InputBox {
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-height: 250px;
    min-height: 180px
}

.InputBox, .InputBox-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.InputBox-footer {
    height: 60px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 20px
}

.InputBox-input {
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    border-width: 0;
    padding-top: 0;
    padding-left: 14px
}

.InputBox-input.is-focus {
    border: none
}

.InputBox-sendBtn {
    border-radius: 6px;
    width: 72px;
    height: 32px;
    font-size: 13px;
    line-height: 16px
}

.InputBox-footerDesc {
    font-size: 14px;
    line-height: 20px;
    color: #bfbfbf;
    text-align: right;
    padding-right: 10px;
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto
}

html[data-theme=dark] .InputBox-footerDesc {
    color: #444
}

.AbnormalAlert {
    display: -webkit-box;
    display: -ms-flexbox;
    width: 448px;
    height: 50px;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff;
    -webkit-box-shadow: 0 5px 20px 0 rgba(26, 26, 26, .2);
    box-shadow: 0 5px 20px 0 rgba(26, 26, 26, .2);
    padding: 0 20px;
    border-radius: 4px;
    z-index: 1
}

html[data-theme=dark] .AbnormalAlert {
    background-color: #1a1a1a;
    -webkit-box-shadow: 0 5px 20px 0 hsla(0, 0%, 60%, .2);
    box-shadow: 0 5px 20px 0 hsla(0, 0%, 60%, .2)
}

.AbnormalAlert-message {
    color: #f1403c;
    font-style: 14px;
    text-align: center;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    font-size: 13px
}

html[data-theme=dark] .AbnormalAlert-message {
    color: #b7302d
}

.AbnormalAlert-message a, html[data-theme=dark] .AbnormalAlert-message a {
    color: grey
}

.AbnormalAlert-icon {
    fill: #d3d3d3;
    width: 18px;
    height: 18px;
    padding: 5px;
    cursor: pointer
}

html[data-theme=dark] .AbnormalAlert-icon {
    fill: #2e2e2e
}

.ChatBox {
    min-width: 710px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    min-height: 600px
}

.ChatBox, .ChatBox-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ChatBox-title {
    font-size: 15px;
    line-height: 20px;
    margin: 0 14px;
    height: 50px;
    padding-bottom: 9px;
    padding-top: 21px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid #ebebeb;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .ChatBox-title {
    border-bottom: 1px solid #444
}

html[data-ios] .ChatBox-title {
    font-weight: 500
}

html[data-android] .ChatBox-title {
    font-weight: 700
}

.ChatBox-titleVipIcon {
    height: 14px;
    width: 14px;
    padding-left: 4px
}

.ChatBox-empty {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    margin: 0 auto;
    position: relative;
    padding-top: 25%
}

.ChatBox-emptyImage {
    height: 120px
}

.ChatBox-emptyDesc {
    font-size: 12px;
    color: rgba(133, 144, 166, .5)
}

html[data-theme=dark] .ChatBox-emptyDesc {
    color: rgba(96, 106, 128, .5)
}

.ChatBox-alert {
    position: absolute;
    top: 50px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.MessagesBox-wrapper {
    height: 362px;
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto
}

.ChatBoxModal {
    width: 718px;
    position: relative
}

.ChatBoxModal .Modal-inner {
    overflow: visible
}

.ChatBoxModal-content {
    padding: 0
}

.ChatBoxModal-closeButton {
    position: absolute;
    top: 12px;
    right: 12px
}

.ChatBoxModal-closeIcon {
    fill: #d3d3d3
}

html[data-theme=dark] .ChatBoxModal-closeIcon {
    fill: #2e2e2e
}

.MemberButtonGroup .Button + .Button {
    margin-left: 16px
}

.MemberButtonGroup-prohibitIcon {
    fill: currentColor;
    margin-right: 4px
}

.FollowStatus {
    display: inline-block;
    padding: 1px 6px;
    margin-left: 8px;
    font-size: 12px;
    color: #8590a6;
    vertical-align: 1px;
    background-color: #f6f6f6;
    border-radius: 3px
}

html[data-theme=dark] .FollowStatus {
    color: #606a80;
    background-color: #2e2e2e
}

.UserHoverCard-infoItem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.UserHoverCard-infoItem:not(:last-child) {
    margin-bottom: 8px
}

.UserHoverCard-infoDivider {
    display: inline-block;
    width: 1px;
    height: 10px;
    margin: 0 8px;
    background: #ebebeb
}

html[data-theme=dark] .UserHoverCard-infoDivider {
    background: #444
}

.UserHoverCard-mutuals {
    color: #8590a6
}

html[data-theme=dark] .UserHoverCard-mutuals {
    color: #606a80
}

.UserHoverCard-orgBadge {
    margin-left: 6px;
    vertical-align: 2px
}

.UserLink-badge {
    margin-left: .3em
}

.UserLink-vipIcon {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 14px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: .3em;
    width: 14px
}

.UserLink-vipIcon img {
    height: 100%;
    width: 100%
}

.AuthorInfo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.AuthorInfo-avatar {
    vertical-align: top
}

.AuthorInfo-content {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    margin-left: 14px;
    overflow: hidden
}

.AuthorInfo-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 15px;
    line-height: 1.1;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.AuthorInfo-name {
    font-weight: 600;
    font-synthesis: style;
    color: #444
}

html[data-ios] .AuthorInfo-name {
    font-weight: 500
}

html[data-android] .AuthorInfo-name {
    font-weight: 700
}

html[data-theme=dark] .AuthorInfo-name {
    color: grey
}

.AuthorInfo-badge {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 2px;
    font-size: 14px
}

.AuthorInfo-badgeText {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #646464
}

html[data-theme=dark] .AuthorInfo-badgeText {
    color: #999
}

.AuthorInfo--plain .AuthorInfo-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 10px
}

.AuthorInfo--plain .AuthorInfo-badge > :first-child {
    margin-top: 0
}

.AuthorInfo--plain .AuthorInfo-badge > :first-child:before {
    content: "\FF0C"
}

.AuthorInfo-detail {
    overflow: hidden
}

.PushNotifications-menu {
    width: 360px;
    padding: 0;
    overflow: hidden
}

.PushNotifications-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 1px solid #ebebeb
}

html[data-theme=dark] .PushNotifications-header {
    border-bottom: 1px solid #444
}

.PushNotifications-tab {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    height: 48px;
    cursor: pointer;
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.PushNotifications-selectedTabIcon {
    fill: #0084ff
}

html[data-theme=dark] .PushNotifications-selectedTabIcon {
    fill: #3a76d0
}

.PushNotifications-tab:not(:last-child):after {
    position: absolute;
    left: 120px;
    top: 14px;
    width: 1px;
    height: 20px;
    margin: auto;
    background: #ebebeb;
    content: ""
}

html[data-theme=dark] .PushNotifications-tab:not(:last-child):after {
    background: #444
}

.PushNotifications-list {
    height: 350px;
    overflow-x: hidden;
    overflow-y: auto
}

.PushNotifications-item {
    position: relative;
    padding: 15px;
    font-size: 14px;
    line-height: 24px;
    color: #1a1a1a
}

html[data-theme=dark] .PushNotifications-item {
    color: #999
}

.PushNotifications-item a, html[data-theme=dark] .PushNotifications-item a {
    color: #175199
}

.PushNotifications-item a:hover, html[data-theme=dark] .PushNotifications-item a:hover {
    color: #144583
}

.PushNotifications-item:after {
    position: absolute;
    right: 0;
    bottom: 100%;
    left: 0;
    height: 1px;
    padding: 0 16px;
    background-color: #ebebeb;
    content: "";
    background-clip: content-box
}

html[data-theme=dark] .PushNotifications-item:after {
    background-color: #444
}

.PushNotifications-newItem {
    background: #f6f6f6
}

html[data-theme=dark] .PushNotifications-newItem {
    background: #2e2e2e
}

.PushNotifications-followTitle {
    position: relative;
    height: 54px;
    font-size: 14px;
    line-height: 54px;
    color: #8590a6;
    text-align: center
}

html[data-theme=dark] .PushNotifications-followTitle {
    color: #606a80
}

.PushNotifications-followTitle:after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0 16px;
    border-bottom: 1px solid #ebebeb;
    content: ""
}

html[data-theme=dark] .PushNotifications-followTitle:after {
    border-bottom: 1px solid #444
}

.PushNotifications-followItem {
    display: block
}

.PushNotifications-followItem:hover {
    background-color: #f6f6f6
}

html[data-theme=dark] .PushNotifications-followItem:hover {
    background-color: #2e2e2e
}

.PushNotifications-followItem .AuthorInfo-name {
    font-family: inherit
}

.PushNotifications-followItem .AuthorInfo-badge {
    color: #8590a6
}

html[data-theme=dark] .PushNotifications-followItem .AuthorInfo-badge {
    color: #606a80
}

.PushNotifications-followItem:after {
    content: none
}

.PushNotifications-followItem a {
    color: #1a1a1a
}

html[data-theme=dark] .PushNotifications-followItem a {
    color: #999
}

.Notifications-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    height: 40px;
    padding: 0 16px;
    line-height: 40px;
    background: #fff;
    border-top: 1px solid #ebebeb;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html[data-theme=dark] .Notifications-footer {
    background: #1a1a1a;
    border-top: 1px solid #444
}

.PushNotifications-redbot {
    position: absolute;
    top: 50%;
    width: 4px;
    height: 4px;
    margin-left: 8px;
    background-color: #f1403c;
    border-radius: 50%;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px)
}

html[data-theme=dark] .PushNotifications-redbot {
    background-color: #b7302d
}

.PushNotifications-count {
    position: absolute;
    bottom: 50%;
    left: 50%;
    padding: 0 4px;
    font-size: 11px;
    color: #fff;
    background-color: #f1403c;
    border: 2px solid #fff;
    border-radius: 20px
}

html[data-theme=dark] .PushNotifications-count {
    color: #ebebeb;
    background-color: #b7302d;
    border: 2px solid #1a1a1a
}

.PushNotifications-actor:not(:last-child):after {
    content: "\3001";
    color: #0084ff
}

html[data-theme=dark] .PushNotifications-actor:not(:last-child):after {
    color: #3a76d0
}

.UnknownError {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 18px;
    padding: 48px
}

.ErrorPage {
    background: #fff;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%
}

html[data-theme=dark] .ErrorPage {
    background: #1a1a1a
}

.ErrorPage-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 180px
}

@media (max-width: 690px) {
    .ErrorPage-container {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        margin-top: 60px
    }
}

.ErrorPage-subtitle, .ErrorPage-title {
    color: #646464;
    line-height: 1.4
}

html[data-theme=dark] .ErrorPage-subtitle, html[data-theme=dark] .ErrorPage-title {
    color: #999
}

.ErrorPage-title {
    font-size: 40px;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .ErrorPage-title {
    font-weight: 500
}

html[data-android] .ErrorPage-title {
    font-weight: 700
}

@media (max-width: 690px) {
    .ErrorPage-title {
        font-size: 30px
    }
}

.ErrorPage-subtitle {
    font-size: 18px;
    margin-top: 10px
}

.ErrorPage-text {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-width: 384px
}

@media (max-width: 690px) {
    .ErrorPage-text {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        min-width: auto
    }
}

.ErrorPage-primaryButton {
    margin-top: 20px
}

.ErrorPage-errorImageContainer {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 250px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: 20px;
    width: 250px
}

@media (max-width: 690px) {
    .ErrorPage-errorImageContainer {
        margin-left: 0
    }
}

.RetryError {
    background: #fff;
    min-height: 160px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.RetryError-title {
    color: #8590a6;
    font-size: 22px;
    margin-bottom: 16px
}

html[data-theme=dark] .RetryError-title {
    color: #606a80
}

.Messages-menu {
    width: 360px;
    padding: 0;
    overflow: hidden
}

.Messages-newItem {
    background: #f6f6f6
}

html[data-theme=dark] .Messages-newItem {
    background: #2e2e2e
}

.Messages-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 1px solid #ebebeb
}

html[data-theme=dark] .Messages-header {
    border-bottom: 1px solid #444
}

.Messages-tab {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    height: 48px;
    font-size: 14px;
    color: #8590a6;
    cursor: pointer
}

html[data-theme=dark] .Messages-tab {
    color: #606a80
}

.Messages-currentTab {
    color: #1a1a1a
}

html[data-theme=dark] .Messages-currentTab {
    color: #999
}

.Messages-currentTab:hover {
    color: currentColor
}

.Messages-myMessageTab {
    width: 360px;
    color: #1a1a1a
}

html[data-theme=dark] .Messages-myMessageTab {
    color: #999
}

.Messages-tab:not(:last-child):after {
    position: absolute;
    left: 180px;
    width: 1px;
    height: 20px;
    margin: auto;
    background: #ebebeb;
    content: ""
}

html[data-theme=dark] .Messages-tab:not(:last-child):after {
    background: #444
}

.Messages-list {
    height: 350px;
    overflow-x: hidden;
    overflow-y: auto
}

.Messages-withNoTabList {
    height: 408px
}

.Messages-item {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 15px;
    font-size: 14px;
    line-height: 24px;
    color: #1a1a1a
}

html[data-theme=dark] .Messages-item {
    color: #999
}

.Messages-item:hover {
    background-color: #f6f6f6
}

html[data-theme=dark] .Messages-item:hover {
    background-color: #2e2e2e
}

.Messages-item .Avatar {
    display: block
}

.Messages-user {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    margin-left: 16px;
    overflow: hidden
}

.Messages-userName {
    font-size: 15px
}

.Messages-itemContent {
    height: 20px;
    overflow: hidden;
    line-height: 20px;
    color: #8590a6;
    text-overflow: ellipsis;
    white-space: nowrap
}

html[data-theme=dark] .Messages-itemContent {
    color: #606a80
}

.Messages-newDialog {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: 274px
}

.Messages-footer, .Messages-newDialog {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.Messages-footer {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 40px;
    padding: 0 16px;
    line-height: 40px;
    background: #fff;
    border-top: 1px solid #ebebeb;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html[data-theme=dark] .Messages-footer {
    background: #1a1a1a;
    border-top: 1px solid #444
}

.Messages-receiver {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 8px
}

.Messages-receiver, .Messages-receiverInfo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 36px;
    line-height: 36px
}

.Messages-receiverInfo {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .Messages-receiverInfo {
    font-weight: 500
}

html[data-android] .Messages-receiverInfo {
    font-weight: 700
}

.Messages-receiverAutoComplete {
    position: relative;
    margin-top: 8px
}

.Messages-records, html[data-theme=dark] .Messages-records {
    color: #175199
}

.Messages-sendContent {
    width: 352px;
    margin: 12px auto 0
}

.Messages-sendContent textarea {
    overflow-y: auto
}

.Messages-modifyButton {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    fill: #8590a6
}

html[data-theme=dark] .Messages-modifyButton {
    fill: #606a80
}

.Messages-warning {
    height: 23px;
    margin: 4px auto 0;
    font-size: 14px;
    color: #f1403c;
    opacity: 0;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

html[data-theme=dark] .Messages-warning {
    color: #b7302d
}

.Messages-warning.is-shown {
    opacity: 1
}

.Messages-input {
    width: 352px
}

.Messages-icon {
    cursor: pointer
}

.Messages-count {
    position: absolute;
    bottom: 50%;
    left: 50%;
    padding: 0 4px;
    font-size: 11px;
    color: #fff;
    background-color: #f1403c;
    border: 2px solid #fff;
    border-radius: 20px
}

html[data-theme=dark] .Messages-count {
    color: #ebebeb;
    background-color: #b7302d;
    border: 2px solid #1a1a1a
}

.Messages-menu {
    z-index: 205
}

.Messages-searchIcon {
    position: absolute;
    top: 50%;
    right: 10px;
    width: 16px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.AutoComplete-UserItem {
    width: 188px;
    height: 50px;
    padding: 9px 0;
    line-height: normal;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.AutoComplete-UserDetail {
    display: inline-block;
    margin-left: 8px;
    vertical-align: middle
}

.AutoComplete-UserHeadline, .AutoComplete-UserName {
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.AutoComplete-UserName {
    font-size: 14px;
    color: #1a1a1a
}

html[data-theme=dark] .AutoComplete-UserName {
    color: #999
}

.AutoComplete-UserHeadline {
    font-size: 12px;
    color: #8590a6
}

html[data-theme=dark] .AutoComplete-UserHeadline {
    color: #606a80
}

.AutoComplete-UserAvatar {
    vertical-align: middle
}

.AutoComplete-DefaultItem {
    line-height: 40px
}

.AutoComplete-menu--hidden {
    visibility: hidden
}

.SearchBar-topSearchItem {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 14px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 4px 0;
    height: 32px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 2px 0
}

.SearchBar-hotIcon {
    margin-left: 5px
}

.SearchBar-historyItem {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 14px;
    padding: 6px 0;
    line-height: 24px
}

.SearchBar-historyItem, .SearchBar-historyItemContent {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.SearchBar-historyItemContent.blueFont, html[data-theme=dark] .SearchBar-historyItemContent.blueFont {
    color: #175199
}

.SearchBar-historyLabel {
    padding: 7px 0;
    margin-right: 16px;
    margin-left: 16px;
    font-size: 14px;
    color: #8590a6;
    border-bottom: 1px solid #ebebeb;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

html[data-theme=dark] .SearchBar-historyLabel {
    color: #606a80;
    border-bottom: 1px solid #444
}

.SearchBar-historyIconWrapper {
    position: relative
}

.SearchBar-historyIconWrapper svg {
    fill: #8590a6
}

html[data-theme=dark] .SearchBar-historyIconWrapper svg {
    fill: #606a80
}

.SearchBar-historyIconWrapper:hover, html[data-theme=dark] .SearchBar-historyIconWrapper:hover {
    color: #175199
}

.SearchBar-historyIconWrapper:hover svg, html[data-theme=dark] .SearchBar-historyIconWrapper:hover svg {
    fill: #175199
}

.SearchBar-historyIconShade {
    position: absolute;
    width: 100%;
    height: 100%;
    cursor: pointer
}

.SearchBar-historyLabelDeleteAll {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.SearchBar-historyDelete {
    display: none
}

.SearchBar-historyItem:hover .SearchBar-historyDelete {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.SearchBar-historyDeleteAll {
    cursor: pointer
}

.AskBrand .Select-button {
    width: 124px;
    padding: 0 4px 0 12px;
    background-color: #fff
}

.AskBrand .AskBrand-text {
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    white-space: nowrap;
    width: 74px;
    vertical-align: middle
}

.AskBrand--list {
    max-height: 300px
}

.Tag {
    position: relative;
    display: inline-block;
    height: 30px;
    padding: 0 12px;
    font-size: 14px;
    line-height: 30px;
    color: #0084ff;
    vertical-align: top;
    border-radius: 100px;
    background: rgba(0, 132, 255, .1)
}

html[data-theme=dark] .Tag {
    color: #3a76d0;
    background: rgba(58, 118, 208, .1)
}

.Tag:hover {
    background-color: rgba(0, 132, 255, .15)
}

html[data-theme=dark] .Tag:hover {
    background-color: rgba(58, 118, 208, .15)
}

.Tag--removable {
    padding-right: 28px
}

.Tag-remove {
    position: absolute;
    top: 0;
    right: 10px;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    cursor: pointer;
    padding: 0;
    background: none;
    border: none;
    color: inherit
}

.Tag-remove:focus {
    outline: none
}

.Tag-remove .Zi {
    display: block
}

.TagInputAlias .Tag {
    margin: 0 8px 8px 0
}

.TopicInputAlias-autocomplete {
    display: inline-block
}

.TopicInputAlias-autocomplete .Popover {
    vertical-align: top
}

.TopicInputAlias-input {
    border-radius: 20px;
    padding: 4px 18px
}

.TopicInputAlias-input.is-focus {
    border-color: #0084ff
}

html[data-theme=dark] .TopicInputAlias-input.is-focus {
    border-color: #3a76d0
}

.TopicInputAlias-placeholderButton {
    background: none !important;
    color: #0084ff !important;
    line-height: 30px
}

html[data-theme=dark] .TopicInputAlias-placeholderButton {
    color: #3a76d0 !important
}

.TopicInputAlias-suggestionContainer {
    max-height: 214px;
    overflow: scroll
}

.AskTopics-input {
    border-radius: 20px;
    border-color: #0084ff;
    color: #0084ff;
    height: 30px;
    padding: 2px 18px
}

html[data-theme=dark] .AskTopics-input {
    border-color: #3a76d0;
    color: #3a76d0
}

.MaxLength {
    font-size: 14px;
    color: #8590a6
}

html[data-theme=dark] .MaxLength {
    color: #606a80
}

.MaxLength.is-error {
    color: #f1403c
}

html[data-theme=dark] .MaxLength.is-error {
    color: #b7302d
}

.AskFieldTip {
    font-size: 15px
}

.AskFieldTip--warning, html[data-theme=dark] .AskFieldTip--warning {
    color: #ff9607
}

.AskFieldTip--error {
    color: #f1403c
}

html[data-theme=dark] .AskFieldTip--error {
    color: #b7302d
}

.AskFieldTip .MaxLength {
    font-size: 15px
}

.AskTitle {
    position: relative;
    font-size: 18px
}

.AskTitle .Popover {
    display: block
}

.AskTitle-text {
    position: absolute;
    z-index: -100;
    opacity: 0;
    width: 100%;
    line-height: 1.34;
    white-space: pre-wrap;
    word-wrap: break-word
}

.AskTitle-input {
    max-height: 48px;
    font-size: 18px;
    padding: 0 !important;
    border: none
}

.AskTitle-input.is-focus {
    border: none;
    line-height: 1.34
}

.AskTitle-input .Input:not(input) {
    line-height: 1.34
}

.AskTitle-suggestionClose {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 8px 12px;
    color: #8590a6
}

html[data-theme=dark] .AskTitle-suggestionClose {
    color: #606a80
}

.AskTitle-suggestionPopover {
    margin-top: 25px
}

.AskTitle-suggestionContainer {
    width: 432px;
    max-height: 164px;
    overflow: auto
}

.AskTitle-suggestionItem .Menu-item {
    padding: 8px 12px
}

.AskTitle-suggestionItemLink {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.AskTitle-suggestionItemDesc {
    padding-left: 14px;
    color: #8590a6;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

html[data-theme=dark] .AskTitle-suggestionItemDesc {
    color: #606a80
}

.Editable-toolbar {
    background: #fff;
    border-bottom: 1px solid #ebebeb;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

html[data-theme=dark] .Editable-toolbar {
    background: #1a1a1a;
    border-bottom: 1px solid #444
}

.isToolbarSticky .Editable-toolbar, .Sticky.is-fixed .Editable-toolbar {
    border-top: none !important;
    border-bottom: none !important
}

.isToolbarSticky .Editable-toolbar:after, .Sticky.is-fixed .Editable-toolbar:after {
    content: " ";
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    pointer-events: none;
    height: 3px;
    background: radial-gradient(ellipse at 50%, at 1%, rgba(26, 26, 26, .1), hsla(0, 0%, 100%, 0) 80%);
    background: radial-gradient(ellipse at 50% 1%, rgba(26, 26, 26, .1), hsla(0, 0%, 100%, 0) 80%)
}

html[data-theme=dark] .isToolbarSticky .Editable-toolbar:after, html[data-theme=dark] .Sticky.is-fixed .Editable-toolbar:after {
    background: radial-gradient(ellipse at 50%, at 1%, hsla(0, 0%, 60%, .1), rgba(26, 26, 26, 0) 80%);
    background: radial-gradient(ellipse at 50% 1%, hsla(0, 0%, 60%, .1), rgba(26, 26, 26, 0) 80%)
}

.Editable-toolbar-controls {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 5px 13px
}

.Editable-toolbar-separator {
    background-color: #ebebeb;
    display: inline-block;
    height: 20px;
    margin: 0 3px;
    vertical-align: middle;
    width: 1px
}

html[data-theme=dark] .Editable-toolbar-separator {
    background-color: #444
}

.Editable-control {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid transparent;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 26px;
    margin: 0 2px;
    white-space: nowrap
}

.Editable-control .Zi {
    fill: #8590a6
}

html[data-theme=dark] .Editable-control .Zi {
    fill: #606a80
}

.Editable-control:not(:disabled):hover {
    background: #f6f6f6;
    border-color: #ebebeb
}

html[data-theme=dark] .Editable-control:not(:disabled):hover {
    background: #2e2e2e;
    border-color: #444
}

.Editable-control.is-active .Zi {
    fill: #0084ff
}

html[data-theme=dark] .Editable-control.is-active .Zi {
    fill: #3a76d0
}

.Editable-control .Zi, .Editable-control span {
    vertical-align: middle
}

.Editable-control .Zi + span {
    margin-left: 6px
}

.Editable-toolbarMenu {
    height: 26px;
    margin-left: auto
}

.Editable-toolbarMenuItem {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    line-height: 36px
}

.Editable-toolbarMenuItem .Zi {
    margin-right: 4px
}

.EditableToolbarMenuCallout {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
    border-top: 1px solid #ebebeb;
    padding: 5px 13px
}

.EditableToolbarMenuCallout-closeButton {
    margin-left: auto;
    width: 26px;
    height: 26px
}

.EditableToolbarMenuCallout-arrowBox {
    position: absolute;
    top: 0;
    left: 0;
    background: #fff;
    pointer-events: none
}

.EditableToolbarMenuCallout-arrowBox:after, .EditableToolbarMenuCallout-arrowBox:before {
    bottom: 100%;
    left: 0;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none
}

.EditableToolbarMenuCallout-arrowBox:after {
    border-color: hsla(0, 0%, 100%, 0) hsla(0, 0%, 100%, 0) #fff;
    border-width: 8px;
    margin-left: -8px
}

.EditableToolbarMenuCallout-arrowBox:before {
    border-color: hsla(0, 0%, 80%, 0) hsla(0, 0%, 80%, 0) #ebebeb;
    border-width: 9px;
    margin-left: -9px
}

.AskDetail {
    min-height: 112px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.AskDetail-input {
    font-size: 15px
}

.AskDetail-inputWrapper {
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.AskDetail-actionsWrapper {
    overflow: hidden;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.AskDetail-actions {
    float: right
}

.AskDetail-placeholder {
    display: inline-block;
    color: #8590a6
}

html[data-theme=dark] .AskDetail-placeholder {
    color: #606a80
}

.AskOptions-label {
    color: #8590a6;
    cursor: pointer
}

html[data-theme=dark] .AskOptions-label {
    color: #606a80
}

.AskOptions-checkbox {
    margin-right: 8px;
    vertical-align: text-top
}

.AskBrandTitle-main {
    color: #1a1a1a;
    font-size: 18px;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .AskBrandTitle-main {
    color: #999
}

html[data-ios] .AskBrandTitle-main {
    font-weight: 500
}

html[data-android] .AskBrandTitle-main {
    font-weight: 700
}

.AskBrandTitle-sub {
    color: #999;
    font-size: 13px
}

html[data-theme=dark] .AskBrandTitle-sub {
    color: #646464
}

.Ask-form {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.Ask-form, .Ask-items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.Ask-items {
    max-height: calc(100vh - 146px);
    min-height: 138px;
    overflow: hidden
}

.Ask-items:first-child {
    padding-top: 8px
}

.Ask-item {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-bottom: 16px;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.Ask-item:nth-child(2) {
    -ms-flex-negative: 1;
    flex-shrink: 1
}

.Ask-titleWrapper {
    display: block
}

.Ask-avatar {
    float: left;
    margin-right: 16px;
    margin-top: 3px
}

.Ask-title {
    overflow: hidden
}

.Ask-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.Ask-footer-buttonWrapper {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    text-align: right
}

.Ask-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #f6f6f6;
    padding: 18px 24px;
    border-bottom: 1px solid #ebebeb;
    margin: -24px -24px 12px
}

html[data-theme=dark] .Ask-header {
    background-color: #2e2e2e;
    border-bottom: 1px solid #444
}

.AskOrgSelect-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #bfbfbf;
    padding-bottom: 15px;
    padding-top: 26px
}

html[data-theme=dark] .AskOrgSelect-item {
    color: grey
}

.AskOrgSelect-item + .AskOrgSelect-item {
    border-top: 1px solid #ebebeb
}

html[data-theme=dark] .AskOrgSelect-item + .AskOrgSelect-item {
    border-top: 1px solid #444
}

.AskOrgSelect-item svg {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.AskOrgSelect-itemTitle {
    font-size: 17px;
    color: #1a1a1a
}

html[data-theme=dark] .AskOrgSelect-itemTitle {
    color: #999
}

.AskOrgSelect-itemDesc {
    margin-top: 10px;
    font-size: 14px;
    color: #8590a6
}

html[data-theme=dark] .AskOrgSelect-itemDesc {
    color: #606a80
}

.SearchBar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.SearchBar-toolWrapper {
    position: relative;
    z-index: 104;
    width: 326px
}

.SearchBar-tool {
    position: relative;
    float: left;
    overflow: hidden
}

.SearchBar-tool .Popover {
    display: block
}

.SearchBar-groupItem--topSearch {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 10px
}

.SearchBar-groupItem--hisotry {
    display: block
}

.SearchBar-menu {
    width: 400px;
    padding-bottom: 0;
    overflow-x: hidden
}

.SearchBar-menu.SearchBar-hasValueMenu .AutoComplete-group:last-child .Menu-item {
    height: 40px;
    padding: 0;
    margin-top: 8px;
    line-height: 40px;
    color: #8590a6
}

html[data-theme=dark] .SearchBar-menu.SearchBar-hasValueMenu .AutoComplete-group:last-child .Menu-item {
    color: #606a80
}

.SearchBar-menu.SearchBar-hasValueMenu .AutoComplete-group:last-child .Menu-item:not(.is-active) {
    background: #f6f6f6
}

html[data-theme=dark] .SearchBar-menu.SearchBar-hasValueMenu .AutoComplete-group:last-child .Menu-item:not(.is-active) {
    background: #2e2e2e
}

.SearchBar-menu.SearchBar-noValueMenu {
    padding-bottom: 8px
}

.SearchBar-menu em {
    color: #8590a6;
    font-style: normal
}

html[data-theme=dark] .SearchBar-menu em {
    color: #606a80
}

.SearchBar-menu .blueFont em, html[data-theme=dark] .SearchBar-menu .blueFont em {
    color: #175199
}

.SearchBar-contentResult, .SearchBar-defaultResult, .SearchBar-peopleResult, .SearchBar-topicResult {
    display: block;
    padding: 10px 0;
    font-size: 14px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.SearchBar-label {
    padding: 7px 0;
    margin-right: 16px;
    margin-left: 16px;
    font-size: 14px;
    color: #8590a6;
    border-bottom: 1px solid #ebebeb
}

html[data-theme=dark] .SearchBar-label {
    color: #606a80;
    border-bottom: 1px solid #444
}

.SearchBar-label--history {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.SearchBar-peopleResult {
    padding: 13px 0
}

.SearchBar-peopleResult .AuthorInfo {
    padding-top: 0
}

.SearchBar-peopleResult .AuthorInfo-name {
    font-weight: 400
}

.SearchBar-peopleResult .AuthorInfo-badge {
    font-size: 13px;
    color: #8590a6
}

html[data-theme=dark] .SearchBar-peopleResult .AuthorInfo-badge {
    color: #606a80
}

.SearchBar-userAvatar {
    border-radius: 3px
}

.SearchBar-user {
    display: inline-block;
    margin-left: 16px
}

.SearchBar-userHeadline {
    margin-top: 2px;
    font-size: 13px;
    color: #8590a6
}

html[data-theme=dark] .SearchBar-userHeadline {
    color: #606a80
}

.SearchBar-contentSuffix, .SearchBar-topicSuffix {
    margin-left: 8px;
    font-size: 13px;
    color: #8590a6;
    white-space: nowrap
}

html[data-theme=dark] .SearchBar-contentSuffix, html[data-theme=dark] .SearchBar-topicSuffix {
    color: #606a80
}

.SearchBar-searchLink {
    display: block;
    font-size: 14px;
    color: #8590a6;
    text-align: center;
    cursor: pointer
}

html[data-theme=dark] .SearchBar-searchLink {
    color: #606a80
}

.SearchBar-askButton {
    z-index: 103;
    padding: 0 14px;
    margin-left: 16px;
    -webkit-transition: opacity .3s ease, -webkit-transform .3s ease;
    transition: opacity .3s ease, -webkit-transform .3s ease;
    transition: opacity .3s ease, transform .3s ease;
    transition: opacity .3s ease, transform .3s ease, -webkit-transform .3s ease;
    line-height: 30px
}

.SearchBar-hiddenAskButton {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0)
}

.SearchBar-input {
    width: 326px;
    padding-left: 12px;
    padding-right: 0;
    -webkit-transition: width .2s ease, background .3s ease;
    transition: width .2s ease, background .3s ease
}

.SearchBar-focusedInput {
    width: 400px
}

.SearchBar-searchButton {
    margin-left: 12px;
    padding: 0 12px;
    background: transparent;
    border-color: transparent;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0
}

.SearchBar-searchIcon {
    -webkit-transition: fill .2s ease;
    transition: fill .2s ease
}

.SearchBar-searchIcon.isFocus {
    fill: #0084ff
}

html[data-theme=dark] .SearchBar-searchIcon.isFocus {
    fill: #3a76d0
}

.SearchBar-searchIcon.hasValue {
    fill: #fff
}

html[data-theme=dark] .SearchBar-searchIcon.hasValue {
    fill: #1a1a1a
}

.SearchBar-menu .Menu-item {
    padding: 0 16px
}

.SimpleSearchBar-wrapper {
    margin: auto 0
}

.SimpleSearchBar-solidSearchButton {
    padding: 0 12px;
    border-radius: 0 3px 3px 0
}

.SimpleSearchBar-plainSearchButton {
    padding: 0 12px;
    border-color: transparent;
    background-color: transparent
}

.SimpleSearchBar-input {
    padding-right: 0;
    width: 296px;
    background-color: #f6f6f6
}

html[data-theme=dark] .SimpleSearchBar-input {
    background-color: #2e2e2e
}

.AppHeaderProfileMenu-item {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 36px
}

.AppHeaderProfileMenu-item .Zi {
    margin-right: 6px
}

.AppHeader-profileEntry {
    display: relative
}

.AppHeader-profileAvatar {
    vertical-align: top
}

.AppHeader-profileAvatarRedDot {
    position: absolute;
    background: #f1403c;
    border: 2px solid #fff;
    border-radius: 50%;
    height: 8px;
    right: -4px;
    top: -4px;
    width: 8px
}

html[data-theme=dark] .AppHeader-profileAvatarRedDot {
    background: #b7302d;
    border: 2px solid #1a1a1a
}

.AppHeaderProfileMenu-redDot {
    background: #f1403c;
    border-radius: 50%;
    margin-left: 6px;
    margin-right: -4px;
    height: 6px;
    width: 6px
}

html[data-theme=dark] .AppHeaderProfileMenu-redDot {
    background: #b7302d
}

.AppHeaderProfileMenu-creatorHintPopover {
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1
}

.AppHeaderProfileMenu-creatorHintToggler {
    height: 30px;
    width: 30px
}

.AppHeaderProfileMenu-creatorHintToggler--small {
    height: 24px;
    width: 24px
}

.AppHeaderProfileMenu-creatorHint {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    min-width: 336px;
    height: 48px;
    padding: 0 12px
}

.AppHeaderProfileMenu-creatorHintCreatorIcon {
    color: #8590a6
}

html[data-theme=dark] .AppHeaderProfileMenu-creatorHintCreatorIcon {
    color: #606a80
}

.AppHeaderProfileMenu-creatorHintText {
    margin-left: 8px
}

.AppHeaderProfileMenu-creatorHintLink {
    color: #175199;
    cursor: pointer;
    outline: none;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .AppHeaderProfileMenu-creatorHintLink {
    color: #175199
}

html[data-ios] .AppHeaderProfileMenu-creatorHintLink {
    font-weight: 500
}

html[data-android] .AppHeaderProfileMenu-creatorHintLink {
    font-weight: 700
}

.AppHeaderProfileMenu-creatorHintCloseContainer {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #d3d3d3;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: 24px
}

html[data-theme=dark] .AppHeaderProfileMenu-creatorHintCloseContainer {
    color: #2e2e2e
}

.AppHeader {
    position: relative;
    z-index: 100;
    min-width: 1032px;
    overflow: hidden;
    background: #fff;
    -webkit-box-shadow: 0 1px 3px rgba(26, 26, 26, .1);
    box-shadow: 0 1px 3px rgba(26, 26, 26, .1);
    background-clip: content-box
}

html[data-theme=dark] .AppHeader {
    background: #1a1a1a;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
}

.AppHeader.is-fixed {
    z-index: 100
}

.AppHeader-inner {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 1000px;
    height: 52px;
    padding: 0 16px;
    margin: 0 auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s
}

.AppHeader.is-hidden .AppHeader-inner {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%)
}

.AppHeader-Tabs {
    border-bottom: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 23px
}

.AppHeader-Tab {
    padding: 0 17px
}

.AppHeader-TabsLink {
    color: #8590a6;
    font-size: 15px
}

html[data-theme=dark] .AppHeader-TabsLink {
    color: #606a80
}

.AppHeader-TabsLink.is-active {
    color: #444
}

html[data-theme=dark] .AppHeader-TabsLink.is-active {
    color: grey
}

.AppHeader-TabsLink:hover {
    color: #444
}

html[data-theme=dark] .AppHeader-TabsLink:hover {
    color: grey
}

.AppHeader-navDivider {
    height: 15px;
    border-right: 1px solid #d3d3d3;
    -ms-flex-item-align: center;
    align-self: center
}

html[data-theme=dark] .AppHeader-navDivider {
    border-right: 1px solid #2e2e2e
}

.AppHeader-input {
    width: 345px
}

.AppHeader-userInfo {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.AppHeader-messages, .AppHeader-notifications {
    margin-right: 40px
}

.AppHeader-profile {
    position: relative
}

.AppHeader-login {
    margin-right: 16px
}

.AppHeader-downloadPopover {
    padding: 16px
}

.AppHeader-downloadPopoverImage {
    width: 120px
}

body {
    color: #1a1a1a;
    background: #f6f6f6;
    -webkit-tap-highlight-color: rgba(26, 26, 26, 0)
}

html[data-theme=dark] body {
    color: #999;
    background: #000;
    -webkit-tap-highlight-color: rgba(153, 153, 153, 0)
}

.WhiteBg-body {
    background: #fff
}

html[data-theme=dark] .WhiteBg-body {
    background: #1a1a1a
}

.GreyBg-body {
    background: #f6f6f6
}

html[data-theme=dark] .GreyBg-body {
    background: #000
}

.LightGreyBg-body {
    background: #fbfcfc
}

.App-main {
    padding-bottom: 46px
}

@media (max-width: 690px) {
    body {
        background: #fff
    }

    html[data-theme=dark] body {
        background: #1a1a1a
    }

    .App-main {
        padding: 0
    }

    .Favlists-content {
        padding: 0 16px
    }
}

.UserStatus {
    width: 100%;
    height: 60px;
    font-size: 15px;
    line-height: 60px;
    color: #1a1a1a;
    text-align: center;
    background-color: rgba(133, 144, 166, .08)
}

html[data-theme=dark] .UserStatus {
    color: #999;
    background-color: rgba(96, 106, 128, .08)
}

.UserStatus .Button {
    font-size: 15px
}

.UserStatus-warnText {
    margin-left: 8px
}

.AdblockBanner {
    position: relative;
    z-index: 100;
    min-width: 1000px;
    padding: 16px;
    line-height: 28px;
    color: #8590a6;
    text-align: center;
    background-color: #ebebeb
}

html[data-theme=dark] .AdblockBanner {
    color: #606a80;
    background-color: #444
}

.AdblockBanner-inner {
    width: 1000px;
    padding: 0 24px;
    margin: 0 auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.AdblockBanner-inner a:hover {
    border-bottom: 1px solid #8590a6
}

html[data-theme=dark] .AdblockBanner-inner a:hover {
    border-bottom: 1px solid #606a80
}

.AdblockBanner-close {
    position: absolute;
    top: 16px;
    right: 16px
}

.AdblockBanner-close .Icon {
    display: block
}

.ColumnPageHeader-Wrapper {
    width: 100%
}

.ColumnPageHeader {
    position: relative;
    width: 100%;
    height: 52px;
    background: #fff;
    background-clip: content-box;
    -webkit-box-shadow: 0 1px 3px rgba(26, 26, 26, .1);
    box-shadow: 0 1px 3px rgba(26, 26, 26, .1)
}

html[data-theme=dark] .ColumnPageHeader {
    background: #1a1a1a;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
}

.ColumnPageHeader-content {
    position: relative;
    width: 1000px;
    padding: 0 16px;
    margin: 0 auto
}

.ColumnPageHeader-content, .ColumnPageHeader-Title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 52px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.ColumnPageHeader-Title {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: 16px
}

.ColumnPageHeader-Line {
    height: 29px;
    width: 1px;
    background-color: #ebebeb;
    margin-left: 17px
}

html[data-theme=dark] .ColumnPageHeader-Line {
    background-color: #444
}

.ColumnPageHeader-Link {
    margin-right: 12px
}

.ColumnPageHeader-LinkImage {
    width: 30px;
    height: 30px;
    margin-top: 5px;
    border-radius: 2px
}

.ColumnPageHeader-TitleName {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column;
    flex-flow: column
}

.ColumnPageHeader-TitleMeta {
    color: #8590a6;
    font-size: 12px
}

html[data-theme=dark] .ColumnPageHeader-TitleMeta {
    color: #606a80
}

.ColumnPageHeader-TitleColumn {
    font-weight: 600;
    font-synthesis: style;
    font-size: 14px
}

html[data-ios] .ColumnPageHeader-TitleColumn {
    font-weight: 500
}

html[data-android] .ColumnPageHeader-TitleColumn {
    font-weight: 700
}

.ColumnPageHeader-Button {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.ColumnPageHeader-FollowButton {
    margin-right: 18px
}

.ColumnPageHeader-WriteButton {
    width: 95px;
    height: 34px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.ColumnPageHeader-WriteButton .Zi--EditSurround {
    margin-left: -7px;
    margin-bottom: 2px
}

.ColumnPageHeader-MenuToggler {
    height: 32px;
    padding: 0 20px
}

.ColumnPageHeader-ColumnList {
    max-height: 237px;
    overflow-y: auto
}

.ColumnPageHeader-Menu {
    line-height: 1.42857;
    font-size: 14px;
    text-align: left;
    color: #8590a6;
    width: 200px;
    outline: 0
}

html[data-theme=dark] .ColumnPageHeader-Menu {
    color: #606a80
}

.ColumnPageHeader-Menu .Menu-item {
    outline: none;
    padding: 13px 16px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    vertical-align: middle
}

.ColumnPageHeader-Menu .Menu-item .Avatar {
    margin: -5px 12px -5px 0;
    vertical-align: middle
}

.ColumnHomeTop {
    background: url("../image/patterns.c72a480c.png.html") 50% no-repeat;
    height: 470px;
    position: relative
}

.ColumnHomeTop:before {
    background: url("../image/patterns.c72a480c.png.html") repeat-x;
    background-size: 20px 450px;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    width: 100%
}

.ColumnHomeTop-logo {
    background: url("../image/patterns.c72a480c.png.html") 50% no-repeat;
    background-size: 129px 179px;
    height: 0;
    left: 50%;
    margin: 0 0 0 -65px;
    overflow: hidden;
    padding-top: 179px;
    position: absolute;
    top: 152px;
    width: 129px
}

.ColumnHomeTop-subTitle {
    color: #1a1a1a;
    font-size: 18px;
    font-weight: 300;
    letter-spacing: .5em;
    line-height: 24px;
    margin: 0;
    position: absolute;
    text-align: center;
    top: 350px;
    width: 100%
}

html[data-theme=dark] .ColumnHomeTop-subTitle {
    color: #999
}

.ColumnHomeTop-writeButton {
    border-color: #444;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #444;
    height: 38px;
    left: 50%;
    line-height: 36px;
    margin-left: -51px;
    position: absolute;
    top: 413px;
    width: 120px
}

html[data-theme=dark] .ColumnHomeTop-writeButton {
    border-color: grey;
    color: grey
}

@media (max-width: 420px) {
    .ColumnHomeTop-writeButton {
        display: none
    }
}

.ColumnHomeTop-requestButton {
    font-size: 14px;
    left: 50%;
    line-height: 12px;
    margin-left: -36px;
    position: absolute;
    top: 466px
}

@media (max-width: 420px) {
    .ColumnHomeTop-requestButton {
        display: none
    }
}

.ColumnHomeTop-PendingModal {
    color: #8590a6;
    text-align: center;
    margin-top: 4px;
    font-size: 14px
}

html[data-theme=dark] .ColumnHomeTop-PendingModal {
    color: #606a80
}

.ColumnHomeTop-PendingModal .Modal-content {
    margin-top: 32px
}

.ColumnHomeTop-MutedModal .Modal-content {
    margin-top: 0;
    padding: 0
}

.ColumnHomeTop-MutedModal .Modal-content .UserStatus {
    background: transparent
}

.ColumnHomeTitle {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 3px 32px;
    width: 100%
}

@media (max-width: 660px) {
    .ColumnHomeTitle {
        margin-bottom: 16px
    }
}

@media (max-width: 420px) {
    .ColumnHomeTitle {
        margin-left: 16px;
        margin-right: 16px
    }
}

.ColumnHomeTitle-text {
    color: #1a1a1a;
    font-size: 14px;
    line-height: 22px;
    margin: 0 16px;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .ColumnHomeTitle-text {
    color: #999
}

html[data-ios] .ColumnHomeTitle-text {
    font-weight: 500
}

html[data-android] .ColumnHomeTitle-text {
    font-weight: 700
}

.ColumnHomeTitle-line {
    background: #d3d3d3;
    display: none;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: 1px
}

html[data-theme=dark] .ColumnHomeTitle-line {
    background: #2e2e2e
}

@media (max-width: 1020px) {
    .ColumnHomeTitle-line {
        display: block
    }
}

.ColumnHomeColumnCard {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0 8px 18px rgba(0, 0, 0, .06);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .06);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 26px 0 23px;
    width: 206px
}

html[data-theme=dark] .ColumnHomeColumnCard {
    background: #1a1a1a
}

@media (max-width: 420px) {
    .ColumnHomeColumnCard {
        background: transparent;
        -webkit-box-shadow: none;
        box-shadow: none;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        height: 88px;
        padding: 0 16px;
        width: 100%
    }
}

.ColumnHomeColumnCard-info {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    padding: 0 16px
}

@media (max-width: 420px) {
    .ColumnHomeColumnCard-info {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        margin-right: auto;
        max-width: 200px;
        padding: 0 12px
    }
}

.ColumnHomeColumnCard-title {
    margin-top: 16px;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .ColumnHomeColumnCard-title {
    font-weight: 500
}

html[data-android] .ColumnHomeColumnCard-title {
    font-weight: 700
}

@media (max-width: 420px) {
    .ColumnHomeColumnCard-title {
        margin-top: 0
    }
}

.ColumnHomeColumnCard-description {
    color: grey;
    font-size: 14px;
    line-height: 21px;
    margin-top: 7px;
    text-align: center;
    word-break: break-all;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

html[data-theme=dark] .ColumnHomeColumnCard-description {
    color: grey
}

@media (max-width: 420px) {
    .ColumnHomeColumnCard-description {
        margin-top: 0;
        text-align: left
    }
}

.ColumnHomeColumnCard-meta {
    color: grey;
    font-size: 14px;
    margin-top: 14px
}

html[data-theme=dark] .ColumnHomeColumnCard-meta {
    color: grey
}

@media (max-width: 420px) {
    .ColumnHomeColumnCard-meta {
        display: none
    }
}

.ColumnHomeColumnCard-followButton {
    margin-top: 15px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

@media (max-width: 420px) {
    .ColumnHomeColumnCard-followButton {
        border: none;
        padding: 0
    }

    .ColumnHomeColumnCard-followButton:hover {
        background: none
    }
}

.ColumnHomeRecommendation {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 48px auto 0;
    width: 888px
}

@media (max-width: 1020px) {
    .ColumnHomeRecommendation {
        width: 666px
    }
}

@media (max-width: 420px) {
    .ColumnHomeRecommendation {
        width: 100%
    }
}

.ColumnHomeRecommendation-cardContainer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.ColumnHomeRecommendation-card {
    margin: 0 8px 16px
}

@media (max-width: 420px) {
    .ColumnHomeRecommendation-card {
        margin: 0
    }
}

.ColumnHomeRecommendation-refreshButton {
    border-color: #444;
    color: #444;
    margin-top: 20px;
    width: 98px
}

html[data-theme=dark] .ColumnHomeRecommendation-refreshButton {
    border-color: grey;
    color: grey
}

.ColumnHomeRecommendation-refreshButton--rotating .Zi {
    -webkit-transition: -webkit-transform .6s ease-in-out;
    transition: -webkit-transform .6s ease-in-out;
    transition: transform .6s ease-in-out;
    transition: transform .6s ease-in-out, -webkit-transform .6s ease-in-out;
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn);
    -webkit-transform-origin: 50% 55%;
    transform-origin: 50% 55%
}

.ColumnHomeBottom {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: url("../image/patterns.c72a480c.png.html") repeat-x;
    background-size: 20px 450px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-top: 134px
}

@media (max-width: 420px) {
    .ColumnHomeBottom {
        padding-top: 46px
    }
}

.ColumnHomeBottom-title {
    border: solid #97ffd8;
    border-width: 1px 0;
    font-size: 18px;
    font-weight: 300;
    letter-spacing: 14px;
    padding: 26px 0;
    text-align: center;
    white-space: nowrap;
    width: 345px
}

.ColumnHomeBottom-requestButton {
    border-color: #444;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #444;
    line-height: 36px;
    margin-top: 40px;
    height: 38px;
    width: 120px
}

html[data-theme=dark] .ColumnHomeBottom-requestButton {
    border-color: grey;
    color: grey
}

@media (max-width: 420px) {
    .ColumnHomeBottom-requestButton {
        display: none
    }
}

.ColumnHomeBottom-footer {
    color: grey;
    font-size: 12px;
    line-height: 22px;
    margin: 80px 0 60px;
    padding: 0 12px;
    text-align: center
}

html[data-theme=dark] .ColumnHomeBottom-footer {
    color: grey
}

.ColumnHomeBottom-footer a > img {
    position: relative;
    top: 4px;
    margin-right: 2px
}

@media (max-width: 420px) {
    .ColumnHomeBottom-footer {
        margin: 40px 0
    }
}

.ColumnHome-HomeBttom {
    margin-top: 48px
}

.Column-SpecialModal .Modal-inner {
    background-image: url("../image/patterns.c72a480c.png.html");
    background-size: 100% auto;
    background-repeat: no-repeat;
    padding-top: 160px
}

@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi) {
    .Column-SpecialModal .Modal-inner {
        background-image: url("../static.zhihu.com/heifetz/assets/open_column_modal_2x.68e43b94.png.html")
    }
}

.Column-SpecialModal .Button {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.Column-RecommendationModal .Modal-content {
    height: 300px;
    overflow-y: scroll
}

.Column-RecommendationModal .Modal-footer button {
    color: #175199;
    cursor: pointer
}

html[data-theme=dark] .Column-RecommendationModal .Modal-footer button {
    color: #175199
}

.Column-RecommendationModal .BounceLoading {
    margin: 150px auto
}

.Column-RecommendationModal .Button {
    width: 80px;
    padding: 0
}

.Column-RecommendationModal .EmptyState {
    font-size: 24px;
    font-weight: 600;
    font-synthesis: style;
    text-align: center;
    color: #bfbfbf
}

html[data-ios] .Column-RecommendationModal .EmptyState {
    font-weight: 500
}

html[data-android] .Column-RecommendationModal .EmptyState {
    font-weight: 700
}

html[data-theme=dark] .Column-RecommendationModal .EmptyState {
    color: #444
}

.Column-RecommendationModal .AutoInvite, .Column-RecommendationModal .PinnedColumns {
    background-color: #f6f6f6;
    padding: 14px 12px;
    margin: 0 -12px;
    border-radius: 8px
}

html[data-theme=dark] .Column-RecommendationModal .AutoInvite, html[data-theme=dark] .Column-RecommendationModal .PinnedColumns {
    background-color: #2e2e2e
}

.Column-RecommendationModal .AutoInvite .Column-ColumnItem, .Column-RecommendationModal .PinnedColumns .Column-ColumnItem {
    margin-bottom: 0
}

.Column-RecommendationModal .AutoInvite li:first-child > .Column-ColumnItem, .Column-RecommendationModal .PinnedColumns li:first-child > .Column-ColumnItem {
    margin-top: 0
}

.Column-RecommendationModal .AutoInvite + ul li:first-child > .Column-ColumnItem {
    margin-top: 12px
}

.Column-RecommendationModal .SectionTitle {
    margin-top: 13px;
    font-size: 14px;
    line-height: 1.71;
    color: #8590a6
}

html[data-theme=dark] .Column-RecommendationModal .SectionTitle {
    color: #606a80
}

.Column-RecommendationModal .CancleButton .cancel {
    display: none
}

.Column-RecommendationModal .CancleButton .status, .Column-RecommendationModal .CancleButton:hover .cancel {
    display: inline
}

.Column-RecommendationModal .CancleButton:hover .status {
    display: none
}

.AutoInvite-folded {
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.AutoInvite-folded .AutoInvite-title {
    display: inline-block;
    vertical-align: top;
    font-size: 15px;
    line-height: 1;
    color: #1a1a1a;
    font-weight: 600;
    font-synthesis: style;
    margin: 0 12px
}

html[data-theme=dark] .AutoInvite-folded .AutoInvite-title {
    color: #999
}

html[data-ios] .AutoInvite-folded .AutoInvite-title {
    font-weight: 500
}

html[data-android] .AutoInvite-folded .AutoInvite-title {
    font-weight: 700
}

.AutoInvite-folded .AutoInvite-badge {
    display: inline-block;
    padding: 2px;
    border-radius: 10px;
    background-color: rgba(103, 194, 58, .1);
    font-size: 12px;
    color: #67c23a;
    line-height: 16px;
    vertical-align: top
}

.AutoInvite-folded .AutoInvite-badge svg {
    vertical-align: top
}

.AutoInvite-folded .AutoInvite-badge .text {
    margin: 0 4px
}

.AutoInvite-folded .AutoInvite-arrow {
    margin-left: auto;
    color: #8590a6
}

html[data-theme=dark] .AutoInvite-folded .AutoInvite-arrow {
    color: #606a80
}

.ColumnContributionInvitationModal .Modal-content {
    padding-bottom: 9px
}

.ColumnContributionInvitationModal h1 {
    font-weight: 600;
    font-synthesis: style;
    color: #1a1a1a;
    font-size: 24px;
    line-height: 1.375;
    margin-top: 40px;
    margin-bottom: 24px;
    text-align: center
}

html[data-ios] .ColumnContributionInvitationModal h1 {
    font-weight: 500
}

html[data-android] .ColumnContributionInvitationModal h1 {
    font-weight: 700
}

html[data-theme=dark] .ColumnContributionInvitationModal h1 {
    color: #999
}

.ColumnContributionInvitationModal .ColumnInfo {
    text-align: center
}

.ColumnContributionInvitationModal .ColumnInfo img {
    width: 75px;
    height: 75px;
    border-radius: 50%;
    display: block;
    margin: 0 auto
}

.ColumnContributionInvitationModal .ColumnInfo .ColumnInfoText {
    margin-top: 12px
}

.ColumnContributionInvitationModal .ColumnInfo .ColumnInfoText h2 {
    font-weight: 600;
    font-synthesis: style;
    color: #1a1a1a;
    font-size: 18px;
    line-height: 1.22222
}

html[data-ios] .ColumnContributionInvitationModal .ColumnInfo .ColumnInfoText h2 {
    font-weight: 500
}

html[data-android] .ColumnContributionInvitationModal .ColumnInfo .ColumnInfoText h2 {
    font-weight: 700
}

html[data-theme=dark] .ColumnContributionInvitationModal .ColumnInfo .ColumnInfoText h2 {
    color: #999
}

.ColumnContributionInvitationModal .ColumnInfo .ColumnInfoText p {
    margin-top: 4px;
    font-weight: 600;
    font-synthesis: style;
    color: #d3d3d3;
    font-size: 14px;
    line-height: 1.28571
}

html[data-ios] .ColumnContributionInvitationModal .ColumnInfo .ColumnInfoText p {
    font-weight: 500
}

html[data-android] .ColumnContributionInvitationModal .ColumnInfo .ColumnInfoText p {
    font-weight: 700
}

html[data-theme=dark] .ColumnContributionInvitationModal .ColumnInfo .ColumnInfoText p {
    color: #2e2e2e
}

.ColumnContributionInvitationModal .InvitationContent {
    text-align: center;
    margin: 16px;
    color: #1a1a1a;
    font-size: 18px;
    line-height: 1.66667
}

html[data-theme=dark] .ColumnContributionInvitationModal .InvitationContent {
    color: #999
}

.ColumnContributionInvitationModal .InvitationContent b {
    font-weight: 400;
    color: #175199
}

html[data-theme=dark] .ColumnContributionInvitationModal .InvitationContent b {
    color: #175199
}

.ColumnContributionInvitationModal .InvitationContent b:after, .ColumnContributionInvitationModal .InvitationContent b:before {
    content: " "
}

.ColumnContributionInvitationModal a.Button {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.ColumnContributionInvitationModal footer {
    color: #999;
    font-size: 14px;
    line-height: 1.78571;
    margin-bottom: 20px
}

html[data-theme=dark] .ColumnContributionInvitationModal footer {
    color: #646464
}

.List .EmptyState {
    padding: 70px 0
}

.List-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 50px;
    margin: 0 20px;
    border-bottom: 1px solid #f6f6f6;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html[data-theme=dark] .List-header {
    border-bottom: 1px solid #2e2e2e
}

.List-headerText {
    margin: 0;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .List-headerText {
    font-weight: 500
}

html[data-android] .List-headerText {
    font-weight: 700
}

.List-headerOptions {
    font-size: 14px
}

.List-loading {
    padding: 200px 0;
    color: #8590a6;
    text-align: center
}

html[data-theme=dark] .List-loading {
    color: #606a80
}

.List-item {
    position: relative;
    padding: 16px 20px
}

.List-item:focus {
    outline: none;
    -webkit-transition: -webkit-box-shadow .3s;
    transition: -webkit-box-shadow .3s;
    transition: box-shadow .3s;
    transition: box-shadow .3s, -webkit-box-shadow .3s
}

html[data-focus-visible] .List-item:focus {
    -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 5px rgba(0, 132, 255, .3);
    box-shadow: 0 0 0 2px #fff, 0 0 0 5px rgba(0, 132, 255, .3)
}

html[data-theme=dark][data-focus-visible] .List-item:focus {
    -webkit-box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 5px rgba(58, 118, 208, .6);
    box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 5px rgba(58, 118, 208, .6)
}

.List-item + .List-item:after {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    margin: 0 20px;
    display: block;
    border-bottom: 1px solid #f6f6f6;
    content: ""
}

html[data-theme=dark] .List-item + .List-item:after {
    border-bottom: 1px solid #2e2e2e
}

.List-item--holder {
    padding: 24px 0
}

.List-itemMeta {
    margin-bottom: 10px;
    color: #8590a6
}

html[data-theme=dark] .List-itemMeta {
    color: #606a80
}

.Holder {
    height: 14px;
    margin-bottom: 16px;
    background: #f6f6f6;
    border-radius: 2px
}

html[data-theme=dark] .Holder {
    background: #2e2e2e
}

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

.Holder--avatar, .Holder--button, .Holder--icon, .Holder--inline {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: bottom
}

.Holder--title {
    height: 18px
}

.Holder--icon {
    width: 14px;
    margin-right: 8px;
    border-radius: 999px
}

.Holder--button {
    width: 96px;
    height: 34px;
    border-radius: 3px
}

.Holder--button + .Holder--button {
    margin-left: 16px
}

.Holder--avatar {
    width: 24px;
    height: 24px
}

.Topbar {
    background: #fff;
    border-bottom: 1px solid #f6f6f6;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 50px;
    padding: 0 20px
}

html[data-theme=dark] .Topbar {
    background: #1a1a1a;
    border-bottom: 1px solid #2e2e2e
}

.Topbar-title {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1
}

.Topbar--mobile .Topbar-title {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .Topbar--mobile .Topbar-title {
    font-weight: 500
}

html[data-android] .Topbar--mobile .Topbar-title {
    font-weight: 700
}

.Topbar--mobile .Topbar-title button {
    font-weight: 400;
    margin-left: 13px
}

.ContentItem-title {
    font-size: 18px;
    font-weight: 600;
    font-synthesis: style;
    line-height: 1.6;
    color: #1a1a1a;
    margin-top: -4px;
    margin-bottom: -4px
}

html[data-ios] .ContentItem-title {
    font-weight: 500
}

html[data-android] .ContentItem-title {
    font-weight: 700
}

html[data-theme=dark] .ContentItem-title {
    color: #999
}

.ContentItem-title + .ContentItem-meta {
    margin-top: 6px
}

.ContentItem-title a:hover, html[data-theme=dark] .ContentItem-title a:hover {
    color: #175199
}

.ContentItem-meta {
    font-size: 15px;
    color: #646464
}

html[data-theme=dark] .ContentItem-meta {
    color: #999
}

.ContentItem-meta .ColumnItem-meta, .ContentItem-meta .TopicItem-meta {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ContentItem-avatar {
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle
}

.ContentItem-avatar .UserLink-avatar {
    width: 38px;
    height: 38px;
    vertical-align: top
}

.ContentItem-author {
    padding-top: 10px
}

.ContentItem-status {
    margin-top: 5px;
    color: #8590a6;
    font-size: 14px
}

html[data-theme=dark] .ContentItem-status {
    color: #606a80
}

.ContentItem-statusItem:not(:first-child):before {
    margin: 0 5px;
    content: "\B7"
}

.ContentItem-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 10px 20px;
    margin: 0 -20px -10px;
    color: #646464;
    background: #fff;
    clear: both
}

html[data-theme=dark] .ContentItem-actions {
    color: #999;
    background: #1a1a1a
}

.ContentItem-actions.is-fixed {
    margin: 0;
    -webkit-box-shadow: 0 -1px 3px rgba(26, 26, 26, .1);
    box-shadow: 0 -1px 3px rgba(26, 26, 26, .1)
}

html[data-theme=dark] .ContentItem-actions.is-fixed {
    -webkit-box-shadow: 0 -1px 3px hsla(0, 0%, 60%, .1);
    box-shadow: 0 -1px 3px hsla(0, 0%, 60%, .1)
}

.ContentItem-actions > * {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.ContentItem-actions > .AnnotationTag {
    white-space: nowrap
}

.ContentItem-action {
    margin-left: 24px;
    font-size: 14px
}

.ContentItem-action:first-child {
    margin-left: 0
}

.ContentItem-rightButton {
    margin-left: auto
}

.ContentItem-rightButton .Icon {
    margin-left: 8px
}

.ContentItem-more {
    padding: 0;
    margin-left: 4px;
    color: #175199
}

html[data-theme=dark] .ContentItem-more {
    color: #175199
}

.ContentItem-more:hover, html[data-theme=dark] .ContentItem-more:hover {
    color: grey
}

.ContentItem-more .Icon {
    fill: currentColor
}

.ContentItem-time {
    margin-top: 10px;
    font-size: 14px;
    color: #8590a6
}

html[data-theme=dark] .ContentItem-time {
    color: #606a80
}

.ContentItem-time a:hover {
    border-bottom: 1px solid rgba(133, 144, 166, .72)
}

html[data-theme=dark] .ContentItem-time a:hover {
    border-bottom: 1px solid rgba(96, 106, 128, .72)
}

.ContentItem-arrowIcon.is-active {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.ContentItem-main {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ContentItem-image {
    float: left;
    margin-right: 16px
}

.ContentItem-head {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    overflow: hidden;
    margin-right: 6px
}

.ContentItem-extra {
    -ms-flex-item-align: center;
    align-self: center
}

.ContentItem-cells {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 10px;
    line-height: 26px
}

.ContentItem-cell:not(:first-child) {
    margin-left: 40px
}

.ContentItem-cell > span:first-child {
    color: #8590a6
}

html[data-theme=dark] .ContentItem-cell > span:first-child {
    color: #606a80
}

.UserItem-avatar .Avatar, .UserItem-avatar .Popover {
    display: block
}

.UserItem-title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.UserItem-name, .UserItem-name .UserLink-badge, .UserItem-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.UserItem-name .UserLink-badge {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.UserItem-headline {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.UserItem-business {
    font-size: 14px;
    color: #1a1a1a
}

html[data-theme=dark] .UserItem-business {
    color: #999
}

.UserItem-company:after {
    margin: 0 5px;
    color: #ebebeb;
    content: "|"
}

html[data-theme=dark] .UserItem-company:after {
    color: #444
}

.ContentItem-rewardDetails {
    margin-top: -10px
}

.ContentItem-rewardAmount {
    font-size: 18px;
    color: #444;
    line-height: 25px
}

html[data-theme=dark] .ContentItem-rewardAmount {
    color: grey
}

.ContentItem-rewardTime {
    margin-top: 6px;
    font-size: 15px;
    color: #8590a6;
    line-height: 21px;
    text-align: right
}

html[data-theme=dark] .ContentItem-rewardTime {
    color: #606a80
}

.VoterList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%
}

.VoterList-content {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    overflow-y: scroll
}

.VoterList-description {
    text-align: center;
    color: #8590a6;
    font-size: 14px;
    background: rgba(133, 144, 166, .1)
}

html[data-theme=dark] .VoterList-description {
    color: #606a80;
    background: rgba(96, 106, 128, .1)
}

.VoterList-description p {
    margin: 12px 24px
}

.Voters {
    color: #8590a6
}

html[data-theme=dark] .Voters {
    color: #606a80
}

.ColumnHeader {
    background-color: #fff;
    -webkit-box-shadow: 0 1px 3px 0 rgba(26, 26, 26, .1);
    box-shadow: 0 1px 3px 0 rgba(26, 26, 26, .1);
    color: #1a1a1a;
    padding: 20px 0 16px
}

html[data-theme=dark] .ColumnHeader {
    background-color: #1a1a1a;
    -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1);
    color: #999
}

@media (max-width: 690px) {
    .ColumnHeader {
        padding: 34px 16px 16px
    }
}

.ColumnHeader .ColumnHeader-inner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-right: 140px;
    position: relative;
    width: 690px;
    margin: 0 auto;
    min-height: 124px
}

@media (max-width: 690px) {
    .ColumnHeader .ColumnHeader-inner {
        width: auto;
        padding-right: 110px;
        min-height: 95px
    }
}

.ColumnHeader .ColumnHeader-Title {
    font-weight: 600;
    font-synthesis: style;
    font-size: 26px;
    line-height: 1.42308
}

html[data-ios] .ColumnHeader .ColumnHeader-Title {
    font-weight: 500
}

html[data-android] .ColumnHeader .ColumnHeader-Title {
    font-weight: 700
}

@media (max-width: 690px) {
    .ColumnHeader .ColumnHeader-Title {
        font-size: 18px
    }
}

.ColumnHeader .ColumnHeader-Desc {
    margin: 8px 0;
    font-size: 17px;
    line-height: 1.47059;
    color: #444
}

html[data-theme=dark] .ColumnHeader .ColumnHeader-Desc {
    color: grey
}

@media (max-width: 690px) {
    .ColumnHeader .ColumnHeader-Desc {
        font-size: 14px
    }
}

.ColumnHeader .ColumnHeader-About {
    color: #8590a6;
    margin: 8px 0;
    font-size: 15px;
    line-height: 1.4
}

html[data-theme=dark] .ColumnHeader .ColumnHeader-About {
    color: #606a80
}

@media (max-width: 690px) {
    .ColumnHeader .ColumnHeader-About {
        font-size: 14px
    }
}

.ColumnHeader .ColumnHeader-Image {
    position: absolute;
    top: 0;
    right: 0;
    width: 124px;
    height: 124px;
    border-radius: 50%
}

@media (max-width: 690px) {
    .ColumnHeader .ColumnHeader-Image {
        width: 95px;
        height: 95px
    }
}

.ColumnHeader .ColumnHeader-ButtonGroup {
    margin-top: 12px
}

.ColumnHeader .ColumnHeader-ButtonGroup .Button {
    margin-right: 16px
}

@media (max-width: 690px) {
    .ColumnHeader .ColumnHeader-ButtonGroup {
        margin-top: 10px
    }

    .ColumnHeader .ColumnHeader-ButtonGroup .Button {
        margin-right: 8px
    }
}

.ColumnHeader .ColumnHeader-InviteButton > span:last-child {
    margin-left: 5px
}

.ColumnHeader .InviteButton-Tootip {
    opacity: .5;
    color: #8590a6;
    font-size: 14px;
    margin-left: -16px;
    display: inline-block
}

html[data-theme=dark] .ColumnHeader .InviteButton-Tootip {
    color: #606a80
}

.ColumnHeader .AutoInviteTip {
    position: absolute;
    text-align: left;
    width: 280px;
    height: 82px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-image: url("../image/patterns.c72a480c.png.html");
    background-repeat: no-repeat;
    background-size: 100%;
    font-size: 15px;
    font-weight: 500;
    line-height: 1;
    padding: 34px 28px;
    color: #fff;
    -webkit-animation-name: AutoInviteTipFadeIn;
    animation-name: AutoInviteTipFadeIn;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    opacity: 0
}

html[data-theme=dark] .ColumnHeader .AutoInviteTip {
    color: #1a1a1a
}

@-webkit-keyframes AutoInviteTipFadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes AutoInviteTipFadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.Editable-VideoTitleInput-container {
    -ms-flex-item-align: stretch;
    align-self: stretch;
    background: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%
}

html[data-theme=dark] .Editable-VideoTitleInput-container {
    background: #1a1a1a
}

.Editable-VideoTitleInput-innerContainer {
    cursor: text;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0 16px
}

.Editable-VideoTitleInput-innerContainer--isBeforeIconShown {
    padding: 0 10px
}

.Editable-VideoTitleInput-beforeIcon, html[data-theme=dark] .Editable-VideoTitleInput-beforeIcon {
    color: grey
}

.Editable-VideoTitleInput-value {
    font-size: 15px;
    line-height: 48px
}

.Editable-VideoTitleInput-value--noContent, html[data-theme=dark] .Editable-VideoTitleInput-value--noContent {
    color: grey
}

.Editable-VideoTitleInput {
    border: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 15px;
    height: 48px;
    padding: 0;
    width: 100%
}

.Editable-VideoTitleInput:focus {
    outline: none
}

.Editable-VideoTitleInput::-webkit-input-placeholder {
    color: grey
}

.Editable-VideoTitleInput:-ms-input-placeholder {
    color: grey
}

.Editable-VideoTitleInput::-ms-input-placeholder {
    color: grey
}

.Editable-VideoTitleInput::placeholder {
    color: grey
}

html[data-theme=dark] .Editable-VideoTitleInput::-webkit-input-placeholder {
    color: grey
}

html[data-theme=dark] .Editable-VideoTitleInput:-ms-input-placeholder {
    color: grey
}

html[data-theme=dark] .Editable-VideoTitleInput::-ms-input-placeholder {
    color: grey
}

html[data-theme=dark] .Editable-VideoTitleInput::placeholder {
    color: grey
}

.VideoCardPlayButton {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 56px;
    height: 56px;
    margin: auto;
    transition: -webkit-transform .3s;
    -webkit-transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s
}

.VideoCardPlayButton-icon {
    display: block;
    -webkit-box-shadow: 0 0 4px 0 rgba(26, 26, 26, .16);
    box-shadow: 0 0 4px 0 rgba(26, 26, 26, .16);
    border-radius: 50%
}

html[data-theme=dark] .VideoCardPlayButton-icon {
    -webkit-box-shadow: 0 0 4px 0 rgba(0, 0, 0, .16);
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, .16);
    -webkit-filter: brightness(.7);
    filter: brightness(.7)
}

.VideoCardPlayButton-withFileSize--outer {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 36px;
    margin: auto;
    text-align: center
}

.VideoCardPlayButton-withFileSize--outer .VideoCardPlayButton-withFileSize {
    font-weight: 600;
    font-synthesis: style;
    height: 36px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 35px;
    padding: 0 14px;
    font-size: 14px;
    border-radius: 18px;
    display: inline-block;
    color: #fff;
    background-color: rgba(18, 18, 18, .6);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    border: .5px solid hsla(0, 0%, 100%, .1)
}

html[data-ios] .VideoCardPlayButton-withFileSize--outer .VideoCardPlayButton-withFileSize {
    font-weight: 500
}

html[data-android] .VideoCardPlayButton-withFileSize--outer .VideoCardPlayButton-withFileSize {
    font-weight: 700
}

@supports not ((-webkit-backdrop-filter:blur(16px)) or (backdrop-filter:blur(16px))) {
    .VideoCardPlayButton-withFileSize--outer .VideoCardPlayButton-withFileSize {
        background-color: rgba(18, 18, 18, .8)
    }
}

.VideoCardPlayButton-withFileSize--outer .Zi {
    margin-left: -2.5px;
    margin-right: 7.5px
}

.VideoCard {
    position: relative;
    overflow: hidden;
    border: 1px solid #ebebeb;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 3px rgba(26, 26, 26, .1);
    box-shadow: 0 1px 3px rgba(26, 26, 26, .1)
}

html[data-theme=dark] .VideoCard {
    border: 1px solid #444;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
}

.VideoCard--converting .VideoCard-thumbnail {
    -webkit-filter: blur(8px);
    filter: blur(8px);
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

.VideoCard--converting .VideoCard-video-content:after {
    content: "\89C6\9891\6B63\5728\8F6C\7801\4E2D";
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

html[data-theme=dark] .VideoCard--converting .VideoCard-video-content:after {
    color: #1a1a1a
}

.VideoCard-link {
    display: block
}

.VideoCard-layout {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.VideoCard-poster {
    width: 120px;
    height: 90px;
    background-color: #ebebeb;
    position: relative
}

html[data-theme=dark] .VideoCard-poster {
    background-color: #444
}

.VideoCard-poster img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.VideoCard-poster .VideoCard-playIcon--nonLens {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 36px;
    height: 36px;
    margin: auto
}

.VideoCard-video {
    position: relative;
    width: 100%
}

.VideoCard-video:before {
    display: block;
    padding-top: 56.25%;
    content: ""
}

.VideoCard-video-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.VideoCard-thumbnail {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #ebebeb
}

html[data-theme=dark] .VideoCard-thumbnail {
    background-color: #444
}

.VideoCard-thumbnail img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.VideoCard-thumbnail--placeholder {
    background-image: url("../image/patterns.c72a480c.jpg.html");
    background-size: cover
}

.VideoCard--interactive .VideoCard-video:hover .VideoCard-play-button {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

.VideoCard-content {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    padding: 10px 16px;
    overflow: hidden;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.VideoCard-VideoTitleInputHolder {
    height: 48px;
    width: 100%
}

.VideoCard-title {
    overflow: hidden;
    height: 28px;
    font-size: 16px;
    line-height: 28px;
    text-overflow: ellipsis;
    white-space: nowrap
}

.VideoCard--interactive .VideoCard-link .VideoCard-content:hover .VideoCard-title, html[data-theme=dark] .VideoCard--interactive .VideoCard-link .VideoCard-content:hover .VideoCard-title {
    color: #175199
}

.VideoCard-description {
    height: 25px;
    margin-top: 5px;
    line-height: 25px
}

.VideoCard-source {
    display: inline-block;
    margin-right: 10px;
    color: #8590a6
}

html[data-theme=dark] .VideoCard-source {
    color: #606a80
}

.VideoCard-badge {
    display: inline-block;
    padding: 0 8px;
    color: #8590a6;
    background-color: #f6f6f6;
    border-radius: 3px
}

html[data-theme=dark] .VideoCard-badge {
    color: #606a80;
    background-color: #2e2e2e
}

.VideoCard-player {
    width: 100%;
    height: 100%;
    background-color: #1a1a1a
}

html[data-theme=dark] .VideoCard-player {
    background-color: #999
}

.VideoCard-player .Embed, .VideoCard-player iframe {
    display: block;
    width: 100%;
    height: 100%
}

.VideoCard-overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: #fff
}

html[data-theme=dark] .VideoCard-overlay {
    background-color: #1a1a1a
}

.VideoCard-overlay.is-loading {
    opacity: 0
}

.VideoCard-mask {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: #1a1a1a;
    -webkit-transition: opacity .3s, visibility .3s;
    transition: opacity .3s, visibility .3s
}

html[data-theme=dark] .VideoCard-mask {
    background-color: #999
}

.VideoCard-mask:not(.is-shown) {
    opacity: 0;
    visibility: hidden
}

.VideoCard--mobile .VideoCard-poster {
    width: 100px;
    height: 75px
}

.VideoCard--mobile .VideoCard-video:hover .VideoCard-play-button {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.VideoCard--mobile .VideoCard-content {
    padding: 10px 12px
}

.VideoCard--mobile .VideoCard-title {
    font-size: 16px
}

.VideoCard--mobile .VideoCard-description {
    margin-top: 0;
    font-size: 12px
}

.VagueImage {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #f6f6f6
}

html[data-theme=dark] .VagueImage {
    background-color: #2e2e2e
}

.VagueImage-mask {
    z-index: 1;
    opacity: 0;
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    -webkit-transition: opacity .3s ease-in;
    transition: opacity .3s ease-in
}

.VagueImage-mask.is-active {
    opacity: 1
}

.VagueImage-mask, .VagueImage-mask:after, .VagueImage-mask:before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.VagueImage-mask:after, .VagueImage-mask:before {
    display: block;
    content: ""
}

.VagueImage-mask:before {
    background-color: #fff;
    opacity: .32
}

html[data-theme=dark] .VagueImage-mask:before {
    background-color: #1a1a1a
}

.VagueImage-mask:after {
    -webkit-filter: blur(16px);
    filter: blur(16px);
    background-image: inherit;
    background-size: cover;
    background-position: 50%
}

.VagueImage-innerLarge {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0)
}

.SharePopover {
    background: #fff;
    border: 1px solid #ebebeb;
    -webkit-box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    z-index: 2;
    padding: 7px 16px 7px 12px;
    border-radius: 4px;
    position: absolute;
    -webkit-transform: translate(-50%, -10px);
    transform: translate(-50%, -10px);
    left: 50%;
    opacity: 0;
    z-index: -1
}

html[data-theme=dark] .SharePopover {
    background: #1a1a1a;
    border: 1px solid #444;
    -webkit-box-shadow: 0 5px 20px rgba(0, 0, 0, .1);
    box-shadow: 0 5px 20px rgba(0, 0, 0, .1)
}

.SharePopover--show {
    opacity: 1;
    z-index: 1;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    -webkit-transition: opacity .16s 30ms, -webkit-transform .16s 30ms;
    transition: opacity .16s 30ms, -webkit-transform .16s 30ms;
    transition: opacity .16s 30ms, transform .16s 30ms;
    transition: opacity .16s 30ms, transform .16s 30ms, -webkit-transform .16s 30ms
}

.SharePopover-arrow {
    position: absolute;
    overflow: hidden;
    pointer-events: none;
    width: 32px;
    height: 16px;
    -webkit-transform: translate(-50%, -100%);
    transform: translate(-50%, -100%);
    left: 50%;
    top: 0
}

.SharePopover-arrow:after {
    left: 50%;
    bottom: -8px;
    content: "";
    position: absolute;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 24px;
    height: 24px;
    margin: -12px;
    border: 1px solid #ebebeb;
    background: #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    pointer-events: auto
}

.SharePopover-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer
}

.SharePopover-content--danger {
    cursor: not-allowed
}

.SharePopover-content--danger .SharePopover-quote {
    color: rgba(133, 144, 166, .3)
}

html[data-theme=dark] .SharePopover-content--danger .SharePopover-quote {
    color: rgba(96, 106, 128, .3)
}

.SharePopover-content--danger .SharePopover-main {
    color: rgba(133, 144, 166, .3)
}

html[data-theme=dark] .SharePopover-content--danger .SharePopover-main {
    color: rgba(96, 106, 128, .3)
}

.SharePopover-content--danger .SharePopover-hint {
    color: #f1403c
}

html[data-theme=dark] .SharePopover-content--danger .SharePopover-hint {
    color: #b7302d
}

.SharePopover-quote {
    color: #8590a6
}

html[data-theme=dark] .SharePopover-quote {
    color: #606a80
}

.SharePopover-main {
    margin-left: 4px;
    color: #8590a6;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .SharePopover-main {
    color: #606a80
}

html[data-ios] .SharePopover-main {
    font-weight: 500
}

html[data-android] .SharePopover-main {
    font-weight: 700
}

.SharePopover-hint {
    color: #8590a6;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .SharePopover-hint {
    color: #606a80
}

html[data-ios] .SharePopover-hint {
    font-weight: 500
}

html[data-android] .SharePopover-hint {
    font-weight: 700
}

.SharePopover-hint:before {
    content: "|";
    margin: 0 8px;
    color: #ebebeb
}

html[data-theme=dark] .SharePopover-hint:before {
    color: #444
}

.AbstractCard {
    border: 1px solid #ebebeb;
    -webkit-box-shadow: 0 1px 3px #ebebeb;
    box-shadow: 0 1px 3px #ebebeb;
    border-radius: 2px
}

html[data-theme=dark] .AbstractCard {
    border: 1px solid #444;
    -webkit-box-shadow: 0 1px 3px #444;
    box-shadow: 0 1px 3px #444
}

.AbstractCard-header {
    background-color: hsla(0, 0%, 96.5%, .5);
    height: 68px;
    border-bottom: 1px solid #ebebeb;
    padding: 10px 16px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
    z-index: 0
}

html[data-theme=dark] .AbstractCard-header {
    background-color: rgba(46, 46, 46, .5);
    border-bottom: 1px solid #444
}

.AbstractCard-header:before {
    left: -6px;
    top: -20px
}

.AbstractCard-header:after, .AbstractCard-header:before {
    content: "";
    display: block;
    position: absolute;
    width: 80px;
    height: 80px;
    background: url("../image/patterns.c72a480c.jpg.html") no-repeat;
    background-size: contain;
    z-index: -1
}

.AbstractCard-header:after {
    right: -10px;
    bottom: -20px;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.AbstractCard-desc {
    color: #8590a6;
    font-size: 14px;
    line-height: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

html[data-theme=dark] .AbstractCard-desc {
    color: #606a80
}

.AbstractCard-title {
    cursor: pointer;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .AbstractCard-title {
    font-weight: 500
}

html[data-android] .AbstractCard-title {
    font-weight: 700
}

.AbstractCard-source {
    margin-left: 6px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.AbstractCard-author {
    margin-top: 5px
}

.AbstractCard-content {
    padding: 12px 10px 12px 16px
}

.AbstractCard-text {
    font-size: 14px;
    color: #646464;
    line-height: 22px;
    white-space: pre-wrap
}

html[data-theme=dark] .AbstractCard-text {
    color: #999
}

.AbstractCard-text--scroll {
    max-height: 66px;
    overflow-y: auto
}

.AbstractCard-text--full {
    max-height: 480px;
    overflow-y: auto
}

.AbstractCard-tip {
    line-height: 20px;
    height: 20px;
    margin-top: 8px;
    font-size: 14px;
    color: #8590a6;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

html[data-theme=dark] .AbstractCard-tip {
    color: #606a80
}

.AbstractCard-info {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.TagInput .Input-wrapper {
    display: block
}

.TagInput .Input {
    -webkit-box-flex: 0;
    -ms-flex: none;
    flex: none;
    height: 30px;
    margin-top: 2px;
    margin-bottom: 2px;
    margin-left: 8px
}

.TagInput.TagInput--empty .Input {
    width: 100%;
    margin-left: 0
}

.TagInput .Tag {
    margin-top: 2px;
    margin-right: 4px;
    margin-bottom: 2px
}

.TagInput .Popover {
    display: block
}

.TopicSelect {
    margin-top: 16px;
    height: 30px;
    line-height: 30px
}

.TopicSelect .Input-wrapper {
    border-radius: 20px;
    border-color: #0084ff;
    color: #0084ff;
    height: 30px;
    line-height: 30px;
    padding: 0 0 0 20px;
    width: 180px
}

html[data-theme=dark] .TopicSelect .Input-wrapper {
    border-color: #3a76d0;
    color: #3a76d0
}

.TopicSelect .Input-wrapper > .Input {
    -webkit-transform: translateY(-4px);
    transform: translateY(-4px);
    width: 82%
}

.TopicSelect .Input-wrapper > .Input::-webkit-input-placeholder {
    color: transparent
}

.TopicSelect .Input-wrapper > .Input:-ms-input-placeholder {
    color: transparent
}

.TopicSelect .Input-wrapper > .Input::-ms-input-placeholder {
    color: transparent
}

.TopicSelect .Input-wrapper > .Input::placeholder {
    color: transparent
}

.TopicSelect .Input-wrapper > .Input:not(:first-child) {
    display: none
}

.TopicSelect .Input-wrapper > .Tag {
    margin-top: 0
}

.TopicSelect .Input-wrapper > .Tag + .Input + .Zi {
    display: none
}

.TopicSelect .Input-wrapper svg.Zi--Search {
    fill: #0084ff !important;
    margin-top: 2px
}

html[data-theme=dark] .TopicSelect .Input-wrapper svg.Zi--Search {
    fill: #3a76d0 !important
}

.TopicSelect--select .Input-wrapper {
    border: none;
    width: 100%;
    padding: 0
}

.TopicSelect--select .Input-after {
    display: none
}

.AbstractForm .Modal-title {
    font-size: 18px;
    line-height: 28px;
    margin-top: 25px;
    padding: 0 24px;
    text-align: left
}

.AbstractForm .Abstract-input {
    margin: 10px
}

.AbstractForm .AbstractForm-footer {
    text-align: right
}

.LinkCard {
    position: relative;
    display: block;
    margin: 1em auto;
    width: 390px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 12px;
    max-width: 100%;
    overflow: hidden
}

.LinkCard, .LinkCard:hover {
    text-decoration: none;
    border: none !important;
    color: inherit !important
}

.LinkCard-content {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 12px;
    border-radius: inherit;
    background-color: hsla(0, 0%, 96.5%, .88)
}

html[data-theme=dark] .LinkCard-content {
    background-color: rgba(46, 46, 46, .88)
}

.LinkCard--noImage .LinkCard-content {
    background-color: #f6f6f6
}

html[data-theme=dark] .LinkCard--noImage .LinkCard-content {
    background-color: #2e2e2e
}

.LinkCard-text {
    overflow: hidden
}

.LinkCard-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 40px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.25;
    color: #1a1a1a
}

html[data-theme=dark] .LinkCard-title {
    color: #999
}

.LinkCard-meta {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 4px;
    font-size: 14px;
    line-height: 20px;
    color: #999;
    white-space: nowrap
}

html[data-theme=dark] .LinkCard-meta {
    color: #646464
}

.LinkCard-textMeta {
    overflow: hidden;
    text-overflow: ellipsis
}

.LinkCard-metaItem:first-child:before {
    content: none
}

.LinkCard-metaItem:before {
    content: " \B7   "
}

@media (max-width: 320px) {
    .LinkCard-metaItem-jobLocation {
        display: none
    }
}

.LinkCard-badge {
    background: #fff;
    border-radius: 5px;
    color: #c2a469;
    display: inline-block;
    margin-left: 8px;
    min-width: 50px;
    padding: 0 4px;
    text-align: center;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .LinkCard-badge {
    background: #1a1a1a;
    color: #806e46
}

html[data-ios] .LinkCard-badge {
    font-weight: 500
}

html[data-android] .LinkCard-badge {
    font-weight: 700
}

.LinkCard-image {
    display: block;
    width: 60px;
    height: 60px;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: inherit
}

.LinkCard-image.LinkCard-image--horizontal {
    width: 90px
}

.LinkCard-image.LinkCard-image--vertical {
    height: 80px
}

.LinkCard-imageCell {
    margin-left: 8px;
    border-radius: 6px
}

html[data-theme=dark] .LinkCard--hasImage .LinkCard-imageCell {
    -webkit-filter: brightness(.7);
    filter: brightness(.7)
}

.LinkCard-backdrop {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-repeat: no-repeat;
    -webkit-filter: blur(20px);
    filter: blur(20px);
    background-size: cover;
    background-position: 50%
}

.LinkCard-image--default {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #ebebeb;
    color: #d3d3d3
}

html[data-theme=dark] .LinkCard-image--default {
    background-color: #444;
    color: #2e2e2e
}

.ReferenceList {
    clear: both;
    font-size: .8em
}

.ReferenceList li:focus {
    outline: none;
    -webkit-transition: background .3s;
    transition: background .3s
}

html[data-focus-visible] .ReferenceList li:focus {
    background: rgba(0, 132, 255, .08)
}

html[data-theme=dark][data-focus-visible] .ReferenceList li:focus {
    background: rgba(58, 118, 208, .3)
}

.ReferenceList .ReferenceList-backHint {
    padding-right: .25em
}

.ReferenceList .ReferenceList-backLink {
    color: #175199;
    padding-right: .25em;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .ReferenceList .ReferenceList-backLink {
    color: #175199
}

html[data-ios] .ReferenceList .ReferenceList-backLink {
    font-weight: 500
}

html[data-android] .ReferenceList .ReferenceList-backLink {
    font-weight: 700
}

@media (hover: hover) {
    .ReferenceList .ReferenceList-backLink:hover {
        text-decoration: underline
    }
}

.MCNLinkCard {
    display: block;
    border-radius: 8px;
    color: inherit;
    margin: 1em auto;
    max-width: 100%;
    position: relative;
    text-decoration: none;
    width: 390px;
    z-index: 0
}

.MCNLinkCard-placeholder {
    background-color: #f6f6f6;
    min-height: 114px
}

html[data-theme=dark] .MCNLinkCard-placeholder {
    background-color: #2e2e2e
}

.MCNLinkCard-card {
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    min-height: 114px;
    overflow: hidden;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 400px;
    border-radius: 8px;
    background-color: #f6f6f6
}

html[data-theme=dark] .MCNLinkCard-card {
    background-color: #2e2e2e
}

.MCNLinkCard-backdrop {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    background-position: 50%;
    background-size: cover;
    -webkit-filter: opacity(12%) blur(20px);
    filter: opacity(12%) blur(20px)
}

.MCNLinkCard-cardContainer {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 12px;
    position: relative;
    width: 100%;
    z-index: 2
}

.MCNLinkCard-imageContainer {
    border-radius: 8px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    height: 82px;
    overflow: hidden;
    position: relative;
    width: 82px
}

html[data-theme=dark] .MCNLinkCard-imageContainer {
    position: relative
}

html[data-theme=dark] .MCNLinkCard-imageContainer:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .3);
    border-radius: inherit;
    pointer-events: none
}

.MCNLinkCard-image {
    height: 100%;
    width: 100%
}

.MCNLinkCard-sourceInImage {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: rgba(0, 0, 0, .4);
    border-radius: 4px;
    bottom: 6px;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 12px;
    font-weight: 400;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    height: 17px;
    padding: 0 4px;
    position: absolute;
    right: 6px
}

html[data-theme=dark] .MCNLinkCard-sourceInImage {
    color: #ebebeb
}

@media (min-width: 360px) {
    .MCNLinkCard-sourceInImage {
        display: none
    }
}

.MCNLinkCard-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin-left: 12px
}

.MCNLinkCard-title {
    color: #1a1a1a;
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

html[data-theme=dark] .MCNLinkCard-title {
    color: #999
}

.MCNLinkCard-tool {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 6px
}

.MCNLinkCard-toolLeft {
    margin-right: auto
}

.MCNLinkCard-price {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #ff9607;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    font-weight: 500;
    line-height: 19px;
    margin-right: auto;
    margin-top: 4px
}

html[data-theme=dark] .MCNLinkCard-price {
    color: #ff9607
}

.MCNLinkCard-tagList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.MCNLinkCard-tag {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: hsla(0, 0%, 100%, .7);
    border-radius: 4px;
    color: #999;
    display: none;
    font-size: 12px;
    font-weight: 400;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    height: 17px;
    margin-right: 8px;
    padding: 0 4px
}

html[data-theme=dark] .MCNLinkCard-tag {
    background: hsla(0, 0%, 92.2%, .7);
    color: #646464
}

@media (min-width: 360px) {
    .MCNLinkCard-tag {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

.MCNLinkCard-button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #0084ff;
    border-radius: 6px;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-size: 13px;
    font-weight: 500;
    height: 32px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0 12px
}

html[data-theme=dark] .MCNLinkCard-button {
    background: #3a76d0;
    color: #ebebeb
}

.MetaLinkCard {
    display: block;
    border-radius: 6px;
    color: inherit;
    margin: 1em auto;
    max-width: 100%;
    position: relative;
    text-decoration: none;
    z-index: 0
}

.MetaLinkCard li {
    list-style: none
}

.MetaLinkCard-placeholder {
    background-color: #f6f6f6;
    min-height: 114px
}

html[data-theme=dark] .MetaLinkCard-placeholder {
    background-color: #2e2e2e
}

.MetaLinkCard-card {
    padding: 16px;
    border-radius: 6px;
    border: 1px solid #ebebeb
}

html[data-theme=dark] .MetaLinkCard-card {
    border: 1px solid #444
}

.MetaLinkCard-card--isMobile {
    border-radius: 10px
}

.App--iOSAppView .MetaLinkCard-card--isMobile {
    border: .5px solid #d3d3d3
}

html[data-theme=dark] .App--iOSAppView .MetaLinkCard-card--isMobile {
    border: .5px solid #2e2e2e
}

.MetaLinkCard-priceSource, .MetaLinkCard-titleLine {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.MetaLinkCard-priceSource {
    line-height: 24px;
    margin-top: 8px
}

.App--appView .MetaLinkCard-priceSource {
    padding-bottom: 7px
}

.App--appView .MetaLinkCard-priceSource--hasBorderBottom {
    padding-bottom: 16px;
    border-bottom: 1px solid #ebebeb
}

html[data-theme=dark] .App--appView .MetaLinkCard-priceSource--hasBorderBottom {
    border-bottom: 1px solid #444
}

.App--iOSAppView .App--appView .MetaLinkCard-priceSource--hasBorderBottom {
    border-bottom: .5px solid #d3d3d3
}

html[data-theme=dark] .App--iOSAppView .App--appView .MetaLinkCard-priceSource--hasBorderBottom {
    border-bottom: .5px solid #2e2e2e
}

.MetaLinkCard-priceWrapper {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.MetaLinkCard-reasons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 16px
}

.MetaLinkCard-reason {
    font-size: 14px;
    padding-right: 12px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-top: 1px;
    margin-bottom: 9px;
    color: #444;
    line-height: 12px
}

html[data-theme=dark] .MetaLinkCard-reason {
    color: grey
}

.App--appView .MetaLinkCard-reason {
    font-size: 12px;
    padding-right: 4px;
    margin-top: 0;
    margin-bottom: 8px
}

.MetaLinkCard-reason:not(:first-child) {
    border-left: 2px solid #ebebeb;
    padding-left: 12px
}

html[data-theme=dark] .MetaLinkCard-reason:not(:first-child) {
    border-left: 2px solid #444
}

.App--appView .MetaLinkCard-reason:not(:first-child) {
    padding-left: 4px
}

.MetaLinkCard-ratings {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 8px
}

.App--appView .MetaLinkCard-ratings {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.App--appView .MetaLinkCard-ratings--noReasons {
    margin-top: 16px
}

.MetaLinkCard-rating {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.App--appView .MetaLinkCard-rating {
    line-height: 16px
}

.App--appView .MetaLinkCard-rating:not(:last-child) {
    margin-bottom: 4px
}

.MetaLinkCard-rating:not(:last-child) {
    margin-right: 16px
}

.MetaLinkCard-ratingName {
    font-size: 14px;
    color: #646464;
    font-weight: 500;
    margin-right: 8px
}

html[data-theme=dark] .MetaLinkCard-ratingName {
    color: #999
}

.App--appView .MetaLinkCard-ratingName {
    font-size: 12px;
    width: 74px
}

.MetaLinkCard-ratingStar {
    color: #d3d3d3
}

html[data-theme=dark] .MetaLinkCard-ratingStar {
    color: #2e2e2e
}

.MetaLinkCard-ratingStar:not(:last-child) {
    margin-right: 4px
}

.MetaLinkCard-ratingStar--rated, html[data-theme=dark] .MetaLinkCard-ratingStar--rated {
    color: #ff9607
}

.MetaLinkCard-images {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 12px auto 0;
    max-width: 544px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.App--appView .MetaLinkCard-images {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    max-width: 100%
}

.App--appView .MetaLinkCard-images--nolyNoRatings {
    margin-top: 7px
}

.MetaLinkCard-imageWrapper {
    width: 120px;
    height: 120px;
    overflow: hidden;
    border-radius: 3px;
    margin: 8px
}

html[data-theme=dark] .MetaLinkCard-imageWrapper {
    position: relative
}

html[data-theme=dark] .MetaLinkCard-imageWrapper:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .3);
    border-radius: inherit;
    pointer-events: none
}

.App--appView .MetaLinkCard-imageWrapper {
    display: inline-block;
    margin: 5px 5px 0 0
}

.App--appView .MetaLinkCard-imageWrapper--1 {
    width: calc((100vw - 62px) / 2);
    height: calc((100vw - 62px) / 2);
    margin-right: 0
}

@media (min-width: 640px) {
    .App--appView .MetaLinkCard-imageWrapper--1 {
        width: 291px;
        height: 291px
    }
}

.App--appView .MetaLinkCard-imageWrapper--2 {
    width: calc((100vw - 67px) / 2);
    height: calc((100vw - 67px) / 2)
}

.App--appView .MetaLinkCard-imageWrapper--2:nth-child(2n) {
    margin-right: 0
}

@media (min-width: 640px) {
    .App--appView .MetaLinkCard-imageWrapper--2 {
        width: 288px;
        height: 288px
    }
}

.App--appView .MetaLinkCard-imageWrapper--7, .App--appView .MetaLinkCard-imageWrapper--8 {
    width: calc((100vw - 77px) / 4);
    height: calc((100vw - 77px) / 4)
}

.App--appView .MetaLinkCard-imageWrapper--7:nth-child(4n), .App--appView .MetaLinkCard-imageWrapper--8:nth-child(4n) {
    margin-right: 0
}

@media (min-width: 640px) {
    .App--appView .MetaLinkCard-imageWrapper--7, .App--appView .MetaLinkCard-imageWrapper--8 {
        width: 141px;
        height: 141px
    }
}

@media (max-width: 320px) {
    .App--appView .MetaLinkCard-imageWrapper--7, .App--appView .MetaLinkCard-imageWrapper--8 {
        width: calc((100vw - 67px) / 2);
        height: calc((100vw - 67px) / 2)
    }

    .App--appView .MetaLinkCard-imageWrapper--7:nth-child(2n), .App--appView .MetaLinkCard-imageWrapper--8:nth-child(2n) {
        margin-right: 0
    }
}

.App--appView .MetaLinkCard-imageWrapper--3, .App--appView .MetaLinkCard-imageWrapper--4, .App--appView .MetaLinkCard-imageWrapper--5, .App--appView .MetaLinkCard-imageWrapper--6 {
    width: calc((100vw - 72px) / 3);
    height: calc((100vw - 72px) / 3)
}

.App--appView .MetaLinkCard-imageWrapper--3:nth-child(3n), .App--appView .MetaLinkCard-imageWrapper--4:nth-child(3n), .App--appView .MetaLinkCard-imageWrapper--5:nth-child(3n), .App--appView .MetaLinkCard-imageWrapper--6:nth-child(3n) {
    margin-right: 0
}

@media (min-width: 640px) {
    .App--appView .MetaLinkCard-imageWrapper--3, .App--appView .MetaLinkCard-imageWrapper--4, .App--appView .MetaLinkCard-imageWrapper--5, .App--appView .MetaLinkCard-imageWrapper--6 {
        width: 190px;
        height: 190px
    }
}

@media (max-width: 320px) {
    .App--appView .MetaLinkCard-imageWrapper--3, .App--appView .MetaLinkCard-imageWrapper--4, .App--appView .MetaLinkCard-imageWrapper--5, .App--appView .MetaLinkCard-imageWrapper--6 {
        width: calc((100vw - 67px) / 2);
        height: calc((100vw - 67px) / 2)
    }

    .App--appView .MetaLinkCard-imageWrapper--3:nth-child(3n), .App--appView .MetaLinkCard-imageWrapper--4:nth-child(3n), .App--appView .MetaLinkCard-imageWrapper--5:nth-child(3n), .App--appView .MetaLinkCard-imageWrapper--6:nth-child(3n) {
        margin-right: 5px
    }

    .App--appView .MetaLinkCard-imageWrapper--3:nth-child(2n), .App--appView .MetaLinkCard-imageWrapper--4:nth-child(2n), .App--appView .MetaLinkCard-imageWrapper--5:nth-child(2n), .App--appView .MetaLinkCard-imageWrapper--6:nth-child(2n) {
        margin-right: 0
    }
}

.MetaLinkCard-imageWrapper img {
    height: 100%;
    width: 100%;
    -o-object-fit: contain;
    object-fit: contain
}

.ztext .MetaLinkCard-imageWrapper img.origin_image {
    margin: 0
}

.RichContent .MetaLinkCard-imageWrapper img {
    cursor: -webkit-zoom-in;
    cursor: zoom-in
}

.MetaLinkCard-title {
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.MetaLinkCard-price {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #ff9607;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 17px;
    font-weight: 500
}

html[data-theme=dark] .MetaLinkCard-price {
    color: #ff9607
}

.MetaLinkCard-priceText {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #f6f6f6;
    border-radius: 4px;
    color: grey;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 12px;
    font-weight: 400;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-left: 8px;
    width: 44px;
    height: 20px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html[data-theme=dark] .MetaLinkCard-priceText {
    background: #2e2e2e;
    color: grey
}

.MetaLinkCard-goToShopping {
    color: #8590a6;
    font-weight: 600;
    font-synthesis: style;
    font-size: 14px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

html[data-theme=dark] .MetaLinkCard-goToShopping {
    color: #606a80
}

html[data-ios] .MetaLinkCard-goToShopping {
    font-weight: 500
}

html[data-android] .MetaLinkCard-goToShopping {
    font-weight: 700
}

.MetaLinkCard-goToShopping:hover a {
    color: #76839b
}

html[data-theme=dark] .MetaLinkCard-goToShopping:hover a {
    color: #555e71
}

.MetaLinkCard-goToShopping--mobile:hover a, .MetaLinkCard-goToShopping--mobile a {
    color: #999
}

html[data-theme=dark] .MetaLinkCard-goToShopping--mobile:hover a, html[data-theme=dark] .MetaLinkCard-goToShopping--mobile a {
    color: #646464
}

.MetaLinkCard-goToShopping--mobile:active a {
    color: #0084ff
}

html[data-theme=dark] .MetaLinkCard-goToShopping--mobile:active a {
    color: #3a76d0
}

.App--AndroidAppView .MetaLinkCard-goToShopping--mobile svg {
    position: relative;
    top: -1px
}

.MetaLinkCard-button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-item-align: center;
    align-self: center;
    color: #0084ff;
    border-radius: 3px;
    background: hsla(0, 0%, 60%, .08);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-size: 14px;
    line-height: 1;
    width: 88px;
    font-weight: 500;
    height: 32px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-left: 10px
}

html[data-theme=dark] .MetaLinkCard-button {
    color: #3a76d0;
    background: hsla(0, 0%, 39.2%, .08)
}

.MetaLinkCard-meta {
    margin-top: 16px;
    font-size: 14px;
    padding: 13px 0 0
}

.MetaLinkCard-meta, .MetaLinkCard-metaMobile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.MetaLinkCard-metaMobile {
    margin-top: 20px;
    padding: 12px 8px 12px 12px;
    background: #f6f6f6;
    border-radius: 6px;
    cursor: pointer
}

html[data-theme=dark] .MetaLinkCard-metaMobile {
    background: #2e2e2e
}

.MetaLinkCard-metaMobile--noRatio {
    padding: 8px 12px
}

.MetaLinkCard-metaMobile:active {
    background: #ebebeb
}

html[data-theme=dark] .MetaLinkCard-metaMobile:active {
    background: #444
}

@media (max-width: 320px) {
    .MetaLinkCard-metaMobile {
        padding: 12px 0 12px 8px
    }
}

.MetaLinkCard-metaInfo {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: grey;
    padding: 2px 0 0
}

html[data-theme=dark] .MetaLinkCard-metaInfo {
    color: grey
}

.MetaLinkCard-metaInfoMobile {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: grey;
    height: 40px
}

html[data-theme=dark] .MetaLinkCard-metaInfoMobile {
    color: grey
}

.MetaLinkCard-metaInfoMobile--noRatio {
    height: 20px
}

.MetaLinkCard-metaScore {
    font-weight: 600;
    font-synthesis: style;
    padding-right: 20px;
    border-right: 1px solid #ebebeb;
    margin-right: 16px
}

html[data-ios] .MetaLinkCard-metaScore {
    font-weight: 500
}

html[data-android] .MetaLinkCard-metaScore {
    font-weight: 700
}

html[data-theme=dark] .MetaLinkCard-metaScore {
    border-right: 1px solid #444
}

.MetaLinkCard-score {
    font-size: 17px;
    color: #0084ff;
    margin-left: 8px;
    font-weight: 500
}

html[data-theme=dark] .MetaLinkCard-score {
    color: #3a76d0
}

.MetaLinkCard-score--mobile {
    margin: 0 12px 0 0;
    font-size: 28px
}

.MetaLinkCard-scoreText {
    color: #646464;
    line-height: 20px;
    font-size: 14px;
    font-weight: 700
}

html[data-theme=dark] .MetaLinkCard-scoreText {
    color: #999
}

.MetaLinkCard-mobileVoteCount {
    color: #999;
    line-height: 16px;
    font-size: 14px;
    font-weight: 500
}

html[data-theme=dark] .MetaLinkCard-mobileVoteCount {
    color: #646464
}

.MetaLinkCard-mobileVoteCount--hasRatio {
    font-size: 12px;
    margin-top: 4px
}

.MetaLinkCard-metaButton {
    line-height: 1;
    padding: 10px 15px;
    border-radius: 3px;
    background: hsla(0, 0%, 60%, .08);
    color: #0084ff
}

html[data-theme=dark] .MetaLinkCard-metaButton {
    background: hsla(0, 0%, 39.2%, .08);
    color: #3a76d0
}

.MetaLinkCard-metaButton:hover {
    background: hsla(0, 0%, 60%, .12)
}

html[data-theme=dark] .MetaLinkCard-metaButton:hover {
    background: hsla(0, 0%, 39.2%, .12)
}

.MetaLinkCard-mobileMetaButton {
    font-size: 14px;
    color: #999;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

html[data-theme=dark] .MetaLinkCard-mobileMetaButton {
    color: #646464
}

.MetaLinkCard-metaLinkText {
    line-height: 18px;
    margin-right: 2px
}

@media (max-width: 320px) {
    .MetaLinkCard-metaLinkText {
        width: 28px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }
}

@-webkit-keyframes fxRichTextFadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes fxRichTextFadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.RichText a.UserLink-link, html[data-theme=dark] .RichText a.UserLink-link {
    color: #175199
}

.RichText a.UserLink-link:hover, html[data-theme=dark] .RichText a.UserLink-link:hover {
    border-bottom: 1px solid #175199
}

.RichText--clearBoth:after, .RichText--clearBoth:before {
    clear: both;
    content: "";
    display: block
}

.RichText .lazy[data-lazy-status] {
    background-color: #f6f6f6
}

html[data-theme=dark] .RichText .lazy[data-lazy-status] {
    background-color: #2e2e2e
}

.RichText .lazy[data-lazy-status=ok] {
    background-color: transparent;
    -webkit-animation: fxRichTextFadeIn .5s ease-in;
    animation: fxRichTextFadeIn .5s ease-in
}

.highlight {
    margin: 1em 0
}

.highlight pre {
    margin: 0
}

.highlight .hll {
    background-color: #fdfdfd
}

html[data-theme=dark] .highlight .hll {
    background-color: #2e2e2e
}

.highlight .c {
    font-style: italic;
    color: #999
}

html[data-theme=dark] .highlight .c {
    color: #646464
}

.highlight .err {
    color: #f1403c
}

html[data-theme=dark] .highlight .err {
    color: #b7302d
}

.highlight .k {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .highlight .k {
    font-weight: 500
}

html[data-android] .highlight .k {
    font-weight: 700
}

.highlight .o {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .highlight .o {
    font-weight: 500
}

html[data-android] .highlight .o {
    font-weight: 700
}

.highlight .cm {
    font-style: italic;
    color: #999
}

html[data-theme=dark] .highlight .cm {
    color: #646464
}

.highlight .cp {
    font-weight: 600;
    font-synthesis: style;
    color: #999
}

html[data-ios] .highlight .cp {
    font-weight: 500
}

html[data-android] .highlight .cp {
    font-weight: 700
}

html[data-theme=dark] .highlight .cp {
    color: #646464
}

.highlight .c1 {
    font-style: italic;
    color: #999
}

html[data-theme=dark] .highlight .c1 {
    color: #646464
}

.highlight .cs {
    font-style: italic;
    font-weight: 600;
    font-synthesis: style;
    color: #999
}

html[data-ios] .highlight .cs {
    font-weight: 500
}

html[data-android] .highlight .cs {
    font-weight: 700
}

html[data-theme=dark] .highlight .cs {
    color: #646464
}

.highlight .gd {
    color: #f36
}

html[data-theme=dark] .highlight .gd {
    color: #d92155
}

.highlight .ge {
    font-style: italic
}

.highlight .gr {
    color: #f1403c
}

html[data-theme=dark] .highlight .gr {
    color: #b7302d
}

.highlight .gh {
    color: #999
}

html[data-theme=dark] .highlight .gh {
    color: #646464
}

.highlight .gi {
    color: #12b370
}

.highlight .go, html[data-theme=dark] .highlight .go {
    color: grey
}

.highlight .gp {
    color: #646464
}

html[data-theme=dark] .highlight .gp {
    color: #999
}

.highlight .gs {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .highlight .gs {
    font-weight: 500
}

html[data-android] .highlight .gs {
    font-weight: 700
}

.highlight .gu {
    color: #999
}

html[data-theme=dark] .highlight .gu {
    color: #646464
}

.highlight .gt {
    color: #f1403c
}

html[data-theme=dark] .highlight .gt {
    color: #b7302d
}

.highlight .kc {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .highlight .kc {
    font-weight: 500
}

html[data-android] .highlight .kc {
    font-weight: 700
}

.highlight .kd {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .highlight .kd {
    font-weight: 500
}

html[data-android] .highlight .kd {
    font-weight: 700
}

.highlight .kn {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .highlight .kn {
    font-weight: 500
}

html[data-android] .highlight .kn {
    font-weight: 700
}

.highlight .kp {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .highlight .kp {
    font-weight: 500
}

html[data-android] .highlight .kp {
    font-weight: 700
}

.highlight .kr {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .highlight .kr {
    font-weight: 500
}

html[data-android] .highlight .kr {
    font-weight: 700
}

.highlight .kt {
    font-weight: 600;
    font-synthesis: style;
    color: #175199
}

html[data-ios] .highlight .kt {
    font-weight: 500
}

html[data-android] .highlight .kt {
    font-weight: 700
}

html[data-theme=dark] .highlight .kt {
    color: #175199
}

.highlight .m {
    color: #0084ff
}

html[data-theme=dark] .highlight .m {
    color: #3a76d0
}

.highlight .s {
    color: #f1403c
}

html[data-theme=dark] .highlight .s {
    color: #b7302d
}

.highlight .na {
    color: #0084ff
}

html[data-theme=dark] .highlight .na {
    color: #3a76d0
}

.highlight .nb {
    color: #0084ff
}

html[data-theme=dark] .highlight .nb {
    color: #3a76d0
}

.highlight .nc {
    font-weight: 600;
    font-synthesis: style;
    color: #175199
}

html[data-ios] .highlight .nc {
    font-weight: 500
}

html[data-android] .highlight .nc {
    font-weight: 700
}

html[data-theme=dark] .highlight .nc {
    color: #175199
}

.highlight .no {
    color: #0084ff
}

html[data-theme=dark] .highlight .no {
    color: #3a76d0
}

.highlight .ni, html[data-theme=dark] .highlight .ni {
    color: #5868d1
}

.highlight .ne {
    font-weight: 600;
    font-synthesis: style;
    color: #f1403c
}

html[data-ios] .highlight .ne {
    font-weight: 500
}

html[data-android] .highlight .ne {
    font-weight: 700
}

html[data-theme=dark] .highlight .ne {
    color: #b7302d
}

.highlight .nf {
    font-weight: 600;
    font-synthesis: style;
    color: #f1403c
}

html[data-ios] .highlight .nf {
    font-weight: 500
}

html[data-android] .highlight .nf {
    font-weight: 700
}

html[data-theme=dark] .highlight .nf {
    color: #b7302d
}

.highlight .nn {
    color: #646464
}

html[data-theme=dark] .highlight .nn {
    color: #999
}

.highlight .nt, html[data-theme=dark] .highlight .nt {
    color: #175199
}

.highlight .nv {
    color: #0084ff
}

html[data-theme=dark] .highlight .nv {
    color: #3a76d0
}

.highlight .ow {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .highlight .ow {
    font-weight: 500
}

html[data-android] .highlight .ow {
    font-weight: 700
}

.highlight .w {
    color: #bfbfbf
}

html[data-theme=dark] .highlight .w {
    color: #444
}

.highlight .mf {
    color: #0084ff
}

html[data-theme=dark] .highlight .mf {
    color: #3a76d0
}

.highlight .mh {
    color: #0084ff
}

html[data-theme=dark] .highlight .mh {
    color: #3a76d0
}

.highlight .mi {
    color: #0084ff
}

html[data-theme=dark] .highlight .mi {
    color: #3a76d0
}

.highlight .mo {
    color: #0084ff
}

html[data-theme=dark] .highlight .mo {
    color: #3a76d0
}

.highlight .sb {
    color: #f1403c
}

html[data-theme=dark] .highlight .sb {
    color: #b7302d
}

.highlight .sc {
    color: #f1403c
}

html[data-theme=dark] .highlight .sc {
    color: #b7302d
}

.highlight .sd {
    color: #f1403c
}

html[data-theme=dark] .highlight .sd {
    color: #b7302d
}

.highlight .s2 {
    color: #f1403c
}

html[data-theme=dark] .highlight .s2 {
    color: #b7302d
}

.highlight .se {
    color: #f1403c
}

html[data-theme=dark] .highlight .se {
    color: #b7302d
}

.highlight .sh {
    color: #f1403c
}

html[data-theme=dark] .highlight .sh {
    color: #b7302d
}

.highlight .si {
    color: #f1403c
}

html[data-theme=dark] .highlight .si {
    color: #b7302d
}

.highlight .sx {
    color: #f1403c
}

html[data-theme=dark] .highlight .sx {
    color: #b7302d
}

.highlight .sr {
    color: #c2a469
}

html[data-theme=dark] .highlight .sr {
    color: #806e46
}

.highlight .s1 {
    color: #f1403c
}

html[data-theme=dark] .highlight .s1 {
    color: #b7302d
}

.highlight .ss {
    color: #f1403c
}

html[data-theme=dark] .highlight .ss {
    color: #b7302d
}

.highlight .bp {
    color: #999
}

html[data-theme=dark] .highlight .bp {
    color: #646464
}

.highlight .vc {
    color: #0084ff
}

html[data-theme=dark] .highlight .vc {
    color: #3a76d0
}

.highlight .vg {
    color: #0084ff
}

html[data-theme=dark] .highlight .vg {
    color: #3a76d0
}

.highlight .vi {
    color: #0084ff
}

html[data-theme=dark] .highlight .vi {
    color: #3a76d0
}

.highlight .il {
    color: #0084ff
}

html[data-theme=dark] .highlight .il {
    color: #3a76d0
}

.highlight::-webkit-scrollbar {
    width: 6px;
    height: 6px
}

.highlight::-webkit-scrollbar-thumb:horizontal {
    background-color: rgba(26, 26, 26, .5);
    border-radius: 6px
}

html[data-theme=dark] .highlight::-webkit-scrollbar-thumb:horizontal {
    background-color: hsla(0, 0%, 60%, .5)
}

.highlight::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: rgba(26, 26, 26, .6)
}

html[data-theme=dark] .highlight::-webkit-scrollbar-thumb:horizontal:hover {
    background-color: hsla(0, 0%, 60%, .6)
}

.GifPlayer {
    display: block;
    margin: 0 auto;
    overflow: hidden;
    max-width: 100%;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    cursor: pointer;
    text-align: center
}

.GifPlayer, html[data-theme=dark] .GifPlayer {
    position: relative
}

html[data-theme=dark] .GifPlayer:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .3);
    border-radius: inherit;
    pointer-events: none
}

.GifPlayer[data-size=small] {
    max-width: 40%
}

.GifPlayer img {
    max-width: 100%;
    vertical-align: top
}

.GifPlayer-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -30px;
    margin-top: -30px;
    pointer-events: none;
    -webkit-transition: .3s ease-out;
    transition: .3s ease-out;
    transition-property: opacity, -webkit-transform;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1
}

.GifPlayer.isPlaying .GifPlayer-icon {
    -webkit-transform: scale(.3);
    transform: scale(.3);
    opacity: 0
}

.ecommerce-ad-container {
    height: 107px;
    padding: 0 6px
}

.ecommerce-ad-container .ecommerce-ad {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    margin: 0 auto;
    background-color: #fff;
    border-radius: 8px;
    overflow: hidden;
    width: auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, .1);
    box-shadow: 0 0 6px rgba(0, 0, 0, .1);
    max-width: 400px;
    cursor: pointer
}

html[data-theme=dark] .ecommerce-ad-container .ecommerce-ad {
    background-color: #1a1a1a
}

.ecommerce-ad-container .ecommerce-ad-img {
    width: 81px;
    background-position: 50%;
    background-repeat: no-repeat;
    overflow: hidden;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    background-size: cover
}

.ecommerce-ad-container .ecommerce-ad-main {
    padding: 10px;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.ecommerce-ad-container .ecommerce-ad-main-content {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    font-size: 13px
}

.ecommerce-ad-container .ecommerce-ad-main-content-price {
    font-size: 12px;
    color: #0084ff;
    margin-top: 3.5px;
    line-height: 13px
}

html[data-theme=dark] .ecommerce-ad-container .ecommerce-ad-main-content-price {
    color: #3a76d0
}

.ecommerce-ad-container .ecommerce-ad-main-content-des {
    margin: 7px 0 0;
    line-height: 18px;
    height: 36px;
    color: #1a1a1a;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

html[data-theme=dark] .ecommerce-ad-container .ecommerce-ad-main-content-des {
    color: #999
}

.ecommerce-ad-container .ecommerce-ad-main-content-title {
    color: #999;
    line-height: 18px
}

html[data-theme=dark] .ecommerce-ad-container .ecommerce-ad-main-content-title {
    color: #646464
}

.ecommerce-ad-container .ecommerce-ad-main-content-title-logo {
    width: 14px;
    height: 14px;
    border-radius: 7px;
    margin-right: 6px;
    vertical-align: sub
}

.ecommerce-ad-container .ecommerce-ad-icon {
    height: 32px;
    width: 72px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    background-color: rgba(0, 132, 255, .08);
    margin-right: 10px;
    color: #0084ff;
    border-radius: 5px;
    font-size: 13px;
    line-height: 32px;
    text-align: center;
    font-weight: 500
}

html[data-theme=dark] .ecommerce-ad-container .ecommerce-ad-icon {
    color: #3a76d0
}

.VideoErrorCard-thumbnail {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 100%
}

.VideoErrorCard-error {
    font-size: 28px;
    line-height: 40px;
    text-align: center;
    color: #8590a6
}

html[data-theme=dark] .VideoErrorCard-error {
    color: #606a80
}

.RichText-video {
    margin: 16px 0
}

.CopyrightRichText-tooltip {
    font-size: 14px
}

.RichContent {
    line-height: 1.67
}

.RichContent b .UserLink-link {
    font-weight: inherit
}

.RichContent.is-collapsed .RichContent-inner {
    max-height: 100px
}

.RichContent--unescapable.is-collapsed {
    position: relative;
    overflow: hidden
}

.RichContent--unescapable.is-collapsed .RichContent-inner {
    position: relative;
    -webkit-transition: max-height .32s cubic-bezier(.95, .05, .795, .035), -webkit-mask-size .22s cubic-bezier(.95, .05, .795, .035);
    transition: max-height .32s cubic-bezier(.95, .05, .795, .035), -webkit-mask-size .22s cubic-bezier(.95, .05, .795, .035);
    transition: mask-size .22s cubic-bezier(.95, .05, .795, .035), max-height .32s cubic-bezier(.95, .05, .795, .035);
    transition: mask-size .22s cubic-bezier(.95, .05, .795, .035), max-height .32s cubic-bezier(.95, .05, .795, .035), -webkit-mask-size .22s cubic-bezier(.95, .05, .795, .035);
    -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(#1a1a1a), to(transparent));
    -webkit-mask-image: linear-gradient(#1a1a1a calc(100% - 8rem), transparent calc(100% - 2.8rem));
    mask-image: -webkit-gradient(linear, left top, left bottom, from(#1a1a1a), to(transparent));
    mask-image: linear-gradient(#1a1a1a calc(100% - 8rem), transparent calc(100% - 2.8rem));
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%
}

html[data-theme=dark] .RichContent--unescapable.is-collapsed .RichContent-inner {
    -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(#999), to(transparent));
    -webkit-mask-image: linear-gradient(#999 calc(100% - 8rem), transparent calc(100% - 2.8rem));
    mask-image: -webkit-gradient(linear, left top, left bottom, from(#999), to(transparent));
    mask-image: linear-gradient(#999 calc(100% - 8rem), transparent calc(100% - 2.8rem))
}

.RichContent--unescapable.is-collapsed .ContentItem-actions {
    position: relative
}

.RichContent--unescapable.is-collapsed .ContentItem-rightButton {
    position: absolute;
    z-index: 1;
    bottom: 75px;
    left: 0;
    width: 100%;
    color: #175199;
    font-size: 15px
}

html[data-theme=dark] .RichContent--unescapable.is-collapsed .ContentItem-rightButton {
    color: #175199
}

@media (min-width: 690px) {
    .RichContent.is-collapsed {
        cursor: pointer;
        -webkit-transition: color .14s ease-out;
        transition: color .14s ease-out
    }

    .RichContent.is-collapsed .CopyrightRichText-richText {
        pointer-events: none
    }

    .RichContent.is-collapsed .RichContent-inner:hover {
        color: #646464
    }

    html[data-theme=dark] .RichContent.is-collapsed .RichContent-inner:hover {
        color: #999
    }
}

.RichContent.is-collapsed:not(.RichContent--unescapable) .CopyrightRichText-richText {
    white-space: normal
}

.RichContent-inner {
    margin-top: 9px;
    margin-bottom: -4px;
    overflow: hidden
}

.RichContent-cover {
    position: relative;
    width: 190px;
    height: 105px;
    margin-top: -2px;
    margin-right: 18px;
    margin-bottom: 4px;
    float: left;
    overflow: hidden;
    background-position: 50%;
    background-size: cover;
    border-radius: 4px;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.RichContent-cover + .RichContent-inner {
    margin-top: 16px
}

.RichContent-cover:after {
    position: absolute;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(26, 26, 26, .02);
    content: ""
}

html[data-theme=dark] .RichContent-cover:after {
    background: hsla(0, 0%, 60%, .02)
}

.RichContent-cover .VagueImage {
    vertical-align: top
}

.RichContent-cover-play {
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 48px;
    height: 48px;
    -webkit-box-shadow: 0 0 4px 0 rgba(26, 26, 26, .16);
    box-shadow: 0 0 4px 0 rgba(26, 26, 26, .16);
    border-radius: 50%
}

html[data-theme=dark] .RichContent-cover-play {
    -webkit-box-shadow: 0 0 4px 0 rgba(0, 0, 0, .16);
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, .16)
}

.RichContent-cover-inner {
    position: absolute;
    top: 50%;
    left: 0;
    height: 100%;
    width: 100%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    overflow: hidden
}

.RichContent-cover-inner img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0)
}

.RichContent-cover > img {
    margin: 0 !important
}

.RichContent-cover .zh-lightbox-thumb {
    cursor: pointer !important
}

.RichContent-cover--mobile {
    float: none;
    width: 100%;
    height: 0;
    padding: 21% 0;
    margin: 10px 0 -8px !important
}

@media (max-width: 320px) {
    .RichContent-collapsedText {
        display: none
    }
}

.RichContent-actions.is-fixed {
    -webkit-animation: slideInUp .2s;
    animation: slideInUp .2s
}

.RichContent-videoMore {
    text-align: center;
    font-size: 14px;
    margin-top: 30px;
    color: #0084ff
}

html[data-theme=dark] .RichContent-videoMore {
    color: #3a76d0
}

@-webkit-keyframes slideInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes slideInUp {
    0% {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.Label-icon {
    height: 20px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 15px;
    margin-right: 4px;
    border-radius: 3px
}

.Label-iconImg {
    width: 20px;
    height: 20px
}

.Label-iconColor--commercial, html[data-theme=dark] .Label-iconColor--commercial {
    color: rgba(23, 81, 153, .72)
}

.Label-iconColor--positive {
    color: #c2a469
}

html[data-theme=dark] .Label-iconColor--positive {
    color: #806e46
}

.Label-iconColor--positiveBackground {
    background: rgba(194, 164, 105, .08)
}

html[data-theme=dark] .Label-iconColor--positiveBackground {
    background: rgba(128, 110, 70, .08)
}

.VoteDownReasonMenu-target {
    z-index: 1
}

.VoteDownReasonMenu-container {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 14px;
    outline: none;
    padding: 16px 20px;
    position: relative;
    width: 350px
}

.VoteDownReasonMenu-header {
    font-weight: 600;
    margin-bottom: 12px
}

.VoteDownReasonMenu-action {
    position: absolute;
    right: 20px;
    top: 16px
}

.VoteDownReasonMenu-ignoreButton {
    color: #8590a6;
    font-size: 13px;
    line-height: 20px
}

html[data-theme=dark] .VoteDownReasonMenu-ignoreButton {
    color: #606a80
}

.VoteDownReasonMenu-spliter {
    background: #d3d3d3;
    display: inline-block;
    height: 12px;
    margin: 4px 6px 0 10px;
    vertical-align: top;
    width: 1px
}

html[data-theme=dark] .VoteDownReasonMenu-spliter {
    background: #2e2e2e
}

.VoteDownReasonMenu-closeButton {
    padding: 4px;
    vertical-align: top
}

.VoteDownReasonMenu-closeIcon {
    display: block
}

.VoteDownReasonMenu-reasonList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.VoteDownReasonMenu-reason {
    background: #f6f6f6;
    border-radius: 3px;
    color: #0084ff;
    display: inline-block;
    line-height: 30px;
    margin-bottom: 10px;
    text-align: center;
    width: 150px
}

html[data-theme=dark] .VoteDownReasonMenu-reason {
    background: #2e2e2e;
    color: #3a76d0
}

.VoteDownReasonMenu-reason:last-child, .VoteDownReasonMenu-reason:nth-last-child(2) {
    margin-bottom: 0
}

.VoteDownReasonMenu-reason:hover {
    background: #f6f6f6;
    color: #0084ff
}

html[data-theme=dark] .VoteDownReasonMenu-reason:hover {
    background: #2e2e2e;
    color: #3a76d0
}

.VoteDownReasonMenu-disableReasonHint {
    margin-bottom: 12px
}

.VoteDownReasonMenu-disableReasonButtonList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.VoteDownReasonMenu-disableReasonButtonList .Button {
    line-height: 28px;
    width: 150px
}

.VoteButton {
    padding: 0 10px;
    color: #0084ff;
    background: rgba(0, 132, 255, .1);
    border-color: transparent
}

html[data-theme=dark] .VoteButton {
    color: #3a76d0;
    background: rgba(58, 118, 208, .1)
}

.VoteButton:not(:disabled):hover {
    background-color: rgba(0, 132, 255, .15)
}

html[data-theme=dark] .VoteButton:not(:disabled):hover {
    background-color: rgba(58, 118, 208, .15)
}

.VoteButton:disabled:hover {
    background: #f6f6f6
}

html[data-theme=dark] .VoteButton:disabled:hover {
    background: #2e2e2e
}

.VoteButton.is-active {
    color: #fff;
    background: #0084ff
}

html[data-theme=dark] .VoteButton.is-active {
    color: #ebebeb;
    background: #3a76d0
}

.VoteButton.is-active:hover {
    background-color: #0084ff
}

html[data-theme=dark] .VoteButton.is-active:hover {
    background-color: #3a76d0
}

.VoteButton-TriangleUp {
    margin-right: 5px
}

.VoteButton--down {
    margin-left: 4px
}

.VoteButton--down.VoteButton--mobileDown {
    margin-left: 8px
}

.LikeButton {
    padding: 0 15px;
    text-align: center;
    color: #0084ff;
    background: rgba(0, 132, 255, .1);
    border-color: transparent;
    border-radius: 3px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html[data-theme=dark] .LikeButton {
    color: #3a76d0;
    background: rgba(58, 118, 208, .1)
}

.LikeButton:not(:disabled):hover {
    background-color: rgba(0, 132, 255, .15)
}

html[data-theme=dark] .LikeButton:not(:disabled):hover {
    background-color: rgba(58, 118, 208, .15)
}

.LikeButton:disabled:hover {
    background: #f6f6f6
}

html[data-theme=dark] .LikeButton:disabled:hover {
    background: #2e2e2e
}

.LikeButton.is-active {
    color: #fff;
    background: #0084ff
}

html[data-theme=dark] .LikeButton.is-active {
    color: #ebebeb;
    background: #3a76d0
}

.LikeButton.is-active:hover {
    background-color: #0084ff
}

html[data-theme=dark] .LikeButton.is-active:hover {
    background-color: #3a76d0
}

.LikeButton .Icon {
    margin-right: 7px;
    fill: currentColor
}

.ShareMenu-button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    height: 40px
}

.ShareMenu-button .ShareMenu-Icon--normal {
    margin-left: -2px;
    margin-right: 6px
}

.ShareMenu-button .ShareMenu-Icon--small {
    margin-right: 7px
}

.ShareMenu-wechat {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-bottom: 12px
}

.ShareMenu-fakeQRCode {
    display: none
}

.ShareMenu-qrCode {
    width: 94px;
    height: 94px
}

.CommentButton-text {
    margin-right: 4px
}

@media (max-width: 320px) {
    .CommentButton-text {
        display: none
    }
}

.RadioButtons {
    font-size: 14px;
    color: #444
}

html[data-theme=dark] .RadioButtons {
    color: grey
}

.RadioButtons-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    padding: 11px 0;
    border-bottom: 1px solid #f6f6f6
}

html[data-theme=dark] .RadioButtons-item {
    border-bottom: 1px solid #2e2e2e
}

@media (max-width: 660px) {
    .RadioButtons-item {
        min-height: 48px;
        line-height: 20px
    }
}

.RadioButtons-text {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1
}

.RadioButtons-input {
    display: inline-block;
    width: 14px;
    height: 14px;
    padding: 2px;
    margin: 0 4px 0 0;
    vertical-align: middle;
    border: 2px solid #ebebeb;
    border-radius: 50%;
    -webkit-transition: background-color, border-color .3s;
    transition: background-color, border-color .3s;
    background-clip: content-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

html[data-theme=dark] .RadioButtons-input {
    border: 2px solid #444
}

.RadioButtons-input:checked {
    background-color: #0084ff;
    border-color: #0084ff
}

html[data-theme=dark] .RadioButtons-input:checked {
    background-color: #3a76d0;
    border-color: #3a76d0
}

.RadioButtons-input:focus {
    outline: none
}

.AddAnnotationModal-description {
    color: #8590a6;
    font-size: 14px;
    margin: 20px 0
}

html[data-theme=dark] .AddAnnotationModal-description {
    color: #606a80
}

.AddAnnotationModal-body {
    max-height: 300px;
    overflow: scroll;
    margin: 0 -20px;
    padding: 0 20px
}

@media (max-width: 660px) {
    .AddAnnotationModal-body {
        margin: 16px;
        padding: 0;
        max-height: inherit
    }
}

@media (max-width: 660px) {
    .AddAnnotationModal-buttonGroup {
        position: absolute;
        bottom: 10px;
        width: 100%;
        height: 36px;
        padding: 0 16px
    }
}

@media (max-width: 660px) {
    .CancelAnnotationModal {
        padding: 16px
    }
}

@media (max-width: 660px) {
    .CancelAnnotationModal-Input {
        min-height: 132px
    }
}

@media (max-width: 660px) {
    .CancelAnnotationModal-CancelButton {
        position: absolute;
        bottom: 10px;
        width: 343px !important;
        height: 36px
    }
}

.CommentPermission-item {
    padding-left: 44px;
    line-height: 40px
}

.CommentPermission-item > span {
    position: absolute;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    margin-left: -8px
}

.CommentDeleteAndReport-extra {
    text-align: center
}

.CommentDeleteAndReport-extra .Button {
    font-size: 13px
}

.Post-ActionMenuButton {
    margin-left: 24px
}

.Post-ActionMenu > .Menu-item {
    padding: 0 20px;
    line-height: 40px;
    position: relative
}

.Post-ActionMenu > .Menu-item .Icon {
    position: absolute;
    top: 10px;
    left: 20px
}

.Post-ActionMenu > .Menu-divider:last-child {
    display: none
}

.Post-ActionMenu--withCommentSettings > .Menu-item {
    padding-left: 44px
}

.RichContent-actions {
    background: #fff;
    width: 100vw;
    bottom: 0;
    left: 0
}

html[data-theme=dark] .RichContent-actions {
    background: #1a1a1a
}

@media (min-width: 690px) {
    .RichContent-actions {
        margin-bottom: 10px
    }
}

.RichContent-actions .ContentItem-actions {
    position: relative
}

.RichContent-actions.is-fixed {
    border-bottom: env(safe-area-inset-bottom) solid transparent;
    color: #646464;
    background: #fff
}

html[data-theme=dark] .RichContent-actions.is-fixed {
    color: #999;
    background: #1a1a1a
}

@media (min-width: 690px) {
    .RichContent-actions.is-fixed {
        -webkit-box-shadow: 0 -1px 3px 0 rgba(26, 26, 26, .1);
        box-shadow: 0 -1px 3px 0 rgba(26, 26, 26, .1);
        margin-bottom: 0;
        width: 100vw !important;
        left: 0 !important
    }

    html[data-theme=dark] .RichContent-actions.is-fixed {
        -webkit-box-shadow: 0 -1px 3px 0 hsla(0, 0%, 60%, .1);
        box-shadow: 0 -1px 3px 0 hsla(0, 0%, 60%, .1)
    }

    .RichContent-actions.is-fixed .ContentItem-actions {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 0;
        max-width: 690px
    }
}

@media (max-width: 690px) {
    .RichContent-actions.is-fixed .ContentItem-actions {
        margin-bottom: 0;
        -webkit-box-shadow: 0 -1px 3px 0 rgba(26, 26, 26, .1);
        box-shadow: 0 -1px 3px 0 rgba(26, 26, 26, .1)
    }
}

@media (max-width: 690px) {
    .RichContent-actions {
        font-weight: 600;
        font-synthesis: style;
        -webkit-box-shadow: none;
        box-shadow: none
    }

    html[data-ios] .RichContent-actions {
        font-weight: 500
    }

    html[data-android] .RichContent-actions {
        font-weight: 700
    }
}

.BottomActions-CommentBtn {
    margin: 0 24px
}

.Column-ArticleList {
    width: 690px;
    margin: 12px auto;
    border-radius: 2px;
    background-color: #fff;
    color: #1a1a1a;
    -webkit-box-shadow: 0 1px 3px 0 rgba(26, 26, 26, .1);
    box-shadow: 0 1px 3px 0 rgba(26, 26, 26, .1)
}

html[data-theme=dark] .Column-ArticleList {
    background-color: #1a1a1a;
    color: #999;
    -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1)
}

@media (max-width: 690px) {
    .Column-ArticleList {
        width: auto
    }
}

.Column-ArticleList .SectionTitle {
    font-weight: 600;
    font-synthesis: style;
    font-size: 16px;
    line-height: 1.375;
    padding: 13px 20px
}

html[data-ios] .Column-ArticleList .SectionTitle {
    font-weight: 500
}

html[data-android] .Column-ArticleList .SectionTitle {
    font-weight: 700
}

.Column-ArticleList .ArticleItem {
    margin: 0 20px;
    overflow: hidden;
    border-top: 1px solid #e7eaf1
}

@media (max-width: 690px) {
    .Column-ArticleList .ArticleItem {
        margin: 0 16px
    }
}

.Column-ArticleList .ArticleItem .ArticleItem-Image {
    display: block;
    width: 650px;
    height: 220px;
    -o-object-fit: cover;
    object-fit: cover;
    margin-top: 20px;
    border-radius: 4px
}

@media (max-width: 690px) {
    .Column-ArticleList .ArticleItem .ArticleItem-Image {
        width: 100%;
        height: 40vw;
        margin-top: 16px
    }
}

.Column-ArticleList .ArticleItem .ArticleItem-Title {
    font-weight: 600;
    font-synthesis: style;
    font-size: 18px;
    line-height: 1.55556;
    margin-top: 16px
}

html[data-ios] .Column-ArticleList .ArticleItem .ArticleItem-Title {
    font-weight: 500
}

html[data-android] .Column-ArticleList .ArticleItem .ArticleItem-Title {
    font-weight: 700
}

.Column-ArticleList .ArticleItem .AuthorInfo {
    margin: 8px 0
}

.Column-ArticleList .ArticleItem .AuthorInfo-detail {
    font-size: 14px;
    margin-left: 10px;
    color: #8590a6
}

html[data-theme=dark] .Column-ArticleList .ArticleItem .AuthorInfo-detail {
    color: #606a80
}

.Column-ArticleList .ArticleItem .ArticleItem-Excerpt {
    display: block;
    margin: 10px 0;
    font-size: 15px;
    line-height: 1.6;
    color: #444
}

html[data-theme=dark] .Column-ArticleList .ArticleItem .ArticleItem-Excerpt {
    color: grey
}

.Column-ArticleList .ArticleItem .ArticleItem-Excerpt .RichContent-cover {
    margin-top: 0;
    margin-bottom: 0;
    width: 172px;
    height: 96px
}

@media (max-width: 690px) {
    .Column-ArticleList .ArticleItem .ArticleItem-Excerpt .RichContent-cover {
        float: none;
        display: block;
        height: 143px;
        width: 100%;
        margin-bottom: 8.5px
    }
}

.Column-ArticleList .ArticleItem .ArticleItem-Excerpt .RichContent-inner {
    margin: 0
}

.Column-ArticleList .ArticleItem .ArticleItem-Excerpt .RichContent-cover + .RichContent-inner {
    min-height: 96px
}

@media (max-width: 690px) {
    .Column-ArticleList .ArticleItem .ArticleItem-Excerpt .RichContent-cover + .RichContent-inner {
        min-height: unset
    }
}

.Column-ArticleList .ArticleItem .ArticleItem-Excerpt .ArticleItem-Excerpt-more {
    font-size: 14px;
    color: #175199;
    white-space: nowrap
}

html[data-theme=dark] .Column-ArticleList .ArticleItem .ArticleItem-Excerpt .ArticleItem-Excerpt-more {
    color: #175199
}

.Column-ArticleList .ArticleItem .ContentItem-actions {
    margin: 10px 0 16px;
    padding: 0
}

.Column-EmptyCard {
    width: 690px;
    height: 450px;
    margin: 12px auto;
    border-radius: 2px;
    background-color: #fff;
    -webkit-box-shadow: 0 1px 3px 0 rgba(26, 26, 26, .1);
    box-shadow: 0 1px 3px 0 rgba(26, 26, 26, .1);
    font-size: 15px;
    line-height: 1;
    color: #8590a6;
    text-align: center
}

html[data-theme=dark] .Column-EmptyCard {
    background-color: #1a1a1a;
    -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1);
    color: #606a80
}

@media (max-width: 690px) {
    .Column-EmptyCard {
        width: auto
    }
}

.Column-EmptyCard .Column-EmptyCard-image {
    margin-top: 175px;
    margin-bottom: 42px
}

.Column-EmptyCard a, html[data-theme=dark] .Column-EmptyCard a {
    color: #175199
}

.Submission-Search-input {
    width: 490px;
    height: 48px
}

.Submission-Search-input .Input {
    height: 38px
}

.Submission-Search-menu {
    width: 490px;
    font-size: 14px
}

.Submission-Search-menu .label {
    color: #8590a6;
    line-height: 20px;
    padding: 8px 12px
}

html[data-theme=dark] .Submission-Search-menu .label {
    color: #606a80
}

.Submission-Search-menu .Menu-item {
    white-space: nowrap;
    height: 40px;
    line-height: 40px
}

.Submission-Search-menu .Menu-item:hover {
    background-color: #f6f6f6
}

html[data-theme=dark] .Submission-Search-menu .Menu-item:hover {
    background-color: #2e2e2e
}

.Submission-Search-menu .Menu-item .title {
    vertical-align: top;
    display: inline-block;
    width: 320px;
    text-overflow: ellipsis;
    overflow: hidden
}

.Submission-Search-menu .Menu-item .time {
    vertical-align: top;
    color: #8590a6;
    display: inline-block;
    text-align: right;
    width: 130px
}

html[data-theme=dark] .Submission-Search-menu .Menu-item .time {
    color: #606a80
}

.ColumnSubmissionDialog-empty {
    text-align: center
}

.ColumnSubmissionDialog-writebtn {
    width: 200px;
    height: 36px;
    line-height: 36px
}

.ColumnSubmissionDialog-selected {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    width: 490px;
    color: #1a1a1a;
    font-size: 14px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 1.42857;
    padding: 14px 48px 14px 16px;
    border-radius: 8px;
    background-color: #f6f6f6
}

html[data-theme=dark] .ColumnSubmissionDialog-selected {
    color: #999;
    background-color: #2e2e2e
}

.ColumnSubmissionDialog-selected .ColumnSubmissionDialog-removeSelected {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 48px
}

.TopRightPanelWrapper {
    position: fixed;
    top: 75px;
    right: 16px;
    width: 281px
}

.TopRightPanel {
    margin-bottom: 16px;
    border-radius: 2px;
    -webkit-box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    border: 1px solid rgba(26, 26, 26, .08);
    background: #fff;
    z-index: 101
}

html[data-theme=dark] .TopRightPanel {
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    border: 1px solid hsla(0, 0%, 60%, .08);
    background: #1a1a1a
}

.TopRightPanel-title {
    padding: 16px;
    font-size: 24px;
    color: #444;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .TopRightPanel-title {
    color: grey
}

html[data-ios] .TopRightPanel-title {
    font-weight: 500
}

html[data-android] .TopRightPanel-title {
    font-weight: 700
}

.TopRightPanel-content {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    padding: 0 16px;
    display: block;
    line-height: 1.6;
    font-size: 14px;
    color: #1a1a1a
}

html[data-theme=dark] .TopRightPanel-content {
    color: #999
}

.TopRightPanel-content a:hover {
    text-decoration: underline
}

.TopRightPanelButtonGroup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 32px 16px 16px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.TopRightPanelButtonGroup .Button {
    height: 36px;
    width: 117px;
    line-height: 30px
}

.HelpMenu-help {
    display: inline-block;
    background: #fff;
    width: 18px;
    height: 18px;
    z-index: 1;
    position: relative;
    text-align: center;
    line-height: 18px;
    color: grey
}

html[data-theme=dark] .HelpMenu-help {
    background: #1a1a1a
}

.HelpMenu-icon {
    display: inline-block;
    cursor: pointer;
    background: #fff;
    margin-bottom: 2px
}

html[data-theme=dark] .HelpMenu-icon {
    background: #1a1a1a
}

.HelpMenu-menu {
    width: 370px;
    margin-left: -198px;
    min-height: auto !important;
    padding: 7px 10px;
    right: auto;
    left: 125px;
    margin-top: 14px;
    color: #1a1a1a;
    font-weight: 400;
    cursor: default;
    bottom: 100%;
    z-index: 40;
    outline: 0;
    position: absolute;
    border: 1px solid rgba(26, 26, 26, .08);
    border-radius: 4px;
    -webkit-box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    background-color: #1a1a1a;
    opacity: .8;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html[data-theme=dark] .HelpMenu-menu {
    color: #999;
    border: 1px solid hsla(0, 0%, 60%, .08);
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    background-color: #999
}

.HelpMenu-menu:after, .HelpMenu-menu:before {
    content: "";
    position: absolute;
    left: 23%;
    width: 0;
    height: 0;
    margin: 0 0 0 -8px;
    font-size: 0;
    border-left: 9px solid transparent;
    border-right: 9px solid transparent;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.HelpMenu-menu:before {
    bottom: -10px;
    border-bottom: 9px solid rgba(26, 26, 26, .08)
}

html[data-theme=dark] .HelpMenu-menu:before {
    border-bottom: 9px solid hsla(0, 0%, 60%, .08)
}

.HelpMenu-menu:after {
    bottom: -9px;
    border-bottom: 9px solid #1a1a1a
}

html[data-theme=dark] .HelpMenu-menu:after {
    border-bottom: 9px solid #999
}

.HelpMenu-menuItem {
    padding: 0;
    font-size: 13px;
    color: #fff
}

html[data-theme=dark] .HelpMenu-menuItem {
    color: #1a1a1a
}

@media screen and (max-width: 660px) {
    .HelpMenu-menu {
        width: auto
    }

    .HelpMenu-menu:after, .HelpMenu-menu:before {
        left: 70%
    }

    .HelpMenu-menuItem {
        height: auto;
        width: 100px
    }
}

.RequestIndex-explain, .RequestIndex-stuff {
    padding: 40px 0
}

.RequestIndex-explainTitle, .RequestIndex-stuffTitle {
    font-size: 26px;
    font-weight: 600;
    font-synthesis: style;
    color: #1a1a1a;
    margin-bottom: 20px
}

html[data-ios] .RequestIndex-explainTitle, html[data-ios] .RequestIndex-stuffTitle {
    font-weight: 500
}

html[data-android] .RequestIndex-explainTitle, html[data-android] .RequestIndex-stuffTitle {
    font-weight: 700
}

html[data-theme=dark] .RequestIndex-explainTitle, html[data-theme=dark] .RequestIndex-stuffTitle {
    color: #999
}

.RequestIndex-explainArticle, .RequestIndex-stuffArticle {
    color: #646464;
    font-size: 14px
}

html[data-theme=dark] .RequestIndex-explainArticle, html[data-theme=dark] .RequestIndex-stuffArticle {
    color: #999
}

@media screen and (max-width: 660px) {
    .RequestIndex-stuff {
        padding-top: 30px
    }
}

.TopicSelector-TopicsSelect {
    margin-right: 24px;
    margin-top: 16px
}

.Select-button span {
    float: right
}

.RequestScopedError-UserError {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    color: #f1403c;
    font-size: 14px;
    line-height: 16px;
    padding: 16px 0;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .RequestScopedError-UserError {
    color: #b7302d
}

html[data-ios] .RequestScopedError-UserError {
    font-weight: 500
}

html[data-android] .RequestScopedError-UserError {
    font-weight: 700
}

.RequestScopedError-UserError .Zi {
    fill: #f1403c;
    margin-right: 8px
}

html[data-theme=dark] .RequestScopedError-UserError .Zi {
    fill: #b7302d
}

.RequestScopedError-UserError a, html[data-theme=dark] .RequestScopedError-UserError a {
    color: #175199
}

.RequestScopedError-NameOrgError {
    color: #f1403c;
    font-size: 14px;
    line-height: 16px
}

html[data-theme=dark] .RequestScopedError-NameOrgError {
    color: #b7302d
}

.RequestScopedError-NameOrgError a {
    color: #175199;
    text-decoration: underline
}

html[data-theme=dark] .RequestScopedError-NameOrgError a {
    color: #175199
}

.RequestIndex-main {
    width: 694px;
    margin: 16px auto 0;
    background-color: #fff;
    -webkit-box-shadow: 0 1px 3px rgba(26, 26, 26, .1);
    box-shadow: 0 1px 3px rgba(26, 26, 26, .1)
}

html[data-theme=dark] .RequestIndex-main {
    background-color: #1a1a1a;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
}

.RequestIndex-content {
    margin: 0 30px
}

.RequestIndex-form, .RequestIndex-stuffForm {
    border-top: 1px solid #f6f6f6;
    padding-top: 40px
}

html[data-theme=dark] .RequestIndex-form, html[data-theme=dark] .RequestIndex-stuffForm {
    border-top: 1px solid #2e2e2e
}

.RequestIndex-stuffForm {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.RequestIndex-stuffForm p {
    font-weight: 600;
    font-synthesis: style;
    color: #444;
    font-size: 15px;
    margin-right: 40px
}

html[data-ios] .RequestIndex-stuffForm p {
    font-weight: 500
}

html[data-android] .RequestIndex-stuffForm p {
    font-weight: 700
}

html[data-theme=dark] .RequestIndex-stuffForm p {
    color: grey
}

.RequestIndex-stuffForm :nth-child(7) {
    margin-left: 100px
}

.RequestIndex-form--disabled .RequestIndex-input {
    background-color: #f6f6f6;
    border: 1px solid #d3d3d3
}

html[data-theme=dark] .RequestIndex-form--disabled .RequestIndex-input {
    background-color: #2e2e2e;
    border: 1px solid #2e2e2e
}

.RequestIndex-form--disabled .RequestIndex-input input, .RequestIndex-form--disabled .RequestIndex-input textarea {
    color: #8590a6;
    opacity: .3
}

html[data-theme=dark] .RequestIndex-form--disabled .RequestIndex-input input, html[data-theme=dark] .RequestIndex-form--disabled .RequestIndex-input textarea {
    color: #606a80
}

.RequestIndex-form--disabled .Select-button {
    background-color: #f6f6f6;
    border: 1px solid #d3d3d3;
    opacity: 1;
    color: rgba(133, 144, 166, .3)
}

html[data-theme=dark] .RequestIndex-form--disabled .Select-button {
    background-color: #2e2e2e;
    border: 1px solid #2e2e2e;
    color: rgba(96, 106, 128, .3)
}

.RequestIndex-form .Select-button {
    font-size: 15px;
    padding: 0 15px
}

.RequestIndex-form .error-tips {
    color: #8590a6
}

html[data-theme=dark] .RequestIndex-form .error-tips {
    color: #606a80
}

.RequestIndex-form > div {
    padding-bottom: 46px;
    position: relative
}

.RequestIndex-formTitle {
    font-size: 18px;
    font-weight: 600;
    font-synthesis: style;
    color: #1a1a1a
}

html[data-ios] .RequestIndex-formTitle {
    font-weight: 500
}

html[data-android] .RequestIndex-formTitle {
    font-weight: 700
}

html[data-theme=dark] .RequestIndex-formTitle {
    color: #999
}

.RequestIndex-input {
    width: 100%;
    padding: 0;
    height: 38px;
    margin-top: 16px;
    -webkit-box-shadow: 0 1px 2px 0 hsla(0, 0%, 100%, .12);
    box-shadow: 0 1px 2px 0 hsla(0, 0%, 100%, .12);
    border: 1px solid #d3d3d3
}

html[data-theme=dark] .RequestIndex-input {
    -webkit-box-shadow: 0 1px 2px 0 rgba(26, 26, 26, .12);
    box-shadow: 0 1px 2px 0 rgba(26, 26, 26, .12);
    border: 1px solid #2e2e2e
}

.RequestIndex-input input {
    height: 38px;
    margin-left: 15px;
    font-size: 15px;
    color: #1a1a1a
}

html[data-theme=dark] .RequestIndex-input input {
    color: #999
}

.RequestIndex-input textarea.Input {
    font-size: 15px
}

.RequestIndex-inputTips {
    position: absolute;
    font-size: 14px;
    bottom: 14px;
    color: grey;
    left: 0;
    width: 100%;
    opacity: 0;
    -webkit-transition: all .2s ease-in;
    transition: all .2s ease-in;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.RequestIndex-inputTips.show {
    opacity: 1
}

.RequestIndex-inputTips .right {
    display: block;
    text-align: right;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1
}

.RequestIndex-formTitleTips {
    font-size: 14px;
    color: grey;
    margin-left: 10px
}

.RequestIndex-backgroundInput, .RequestIndex-backgroundInput .Input {
    height: 180px
}

.RequestIndex-backgroundInput-wrapper {
    padding: 6px 15px
}

.RequestIndex-formSubmit {
    margin-top: 16px;
    position: relative
}

.RequestIndex-link {
    color: #175199;
    font-size: 15px
}

html[data-theme=dark] .RequestIndex-link {
    color: #175199
}

.RequestIndex-formButton {
    position: absolute;
    right: 0;
    top: -6px;
    width: 114px
}

.RequestIndex-message {
    text-align: center;
    margin-top: 16px;
    padding: 120px 0;
    line-height: 1.6
}

.RequestIndex-stuffInput {
    width: 70px;
    height: 70px;
    border-radius: 3px;
    background-color: #f6f6f6;
    border: 1px solid #bfbfbf;
    line-height: 70px;
    text-align: center;
    cursor: pointer;
    margin-bottom: 20px
}

html[data-theme=dark] .RequestIndex-stuffInput {
    background-color: #2e2e2e;
    border: 1px solid grey
}

.RequestIndex-iconPlus {
    fill: #0084ff
}

html[data-theme=dark] .RequestIndex-iconPlus {
    fill: #3a76d0
}

.RequestIndex-stuffImageWrapper {
    margin-right: 26px;
    margin-bottom: 20px;
    position: relative
}

.RequestIndex-stuffImage {
    width: 70px;
    height: 70px;
    -o-object-fit: cover;
    object-fit: cover;
    border: 1px solid #bfbfbf;
    border-radius: 3px
}

html[data-theme=dark] .RequestIndex-stuffImage {
    border: 1px solid grey
}

.RequestIndex-closeIconWrapper {
    cursor: pointer;
    width: 22px;
    height: 22px;
    position: absolute;
    top: -6px;
    right: -6px;
    background: #f1403c;
    border-radius: 100%;
    -webkit-box-shadow: 0 1px 2px 0 rgba(26, 26, 26, .3);
    box-shadow: 0 1px 2px 0 rgba(26, 26, 26, .3);
    text-align: center
}

html[data-theme=dark] .RequestIndex-closeIconWrapper {
    background: #b7302d;
    -webkit-box-shadow: 0 1px 2px 0 hsla(0, 0%, 60%, .3);
    box-shadow: 0 1px 2px 0 hsla(0, 0%, 60%, .3)
}

.RequestIndex-closeIcon {
    fill: #fff;
    margin-left: -1px;
    margin-bottom: -3px
}

html[data-theme=dark] .RequestIndex-closeIcon {
    fill: #ebebeb
}

.RequestIndex-stuffTips {
    line-height: 22px;
    color: #8590a6;
    margin-left: 100px;
    font-size: 14px;
    margin-bottom: 50px
}

html[data-theme=dark] .RequestIndex-stuffTips {
    color: #606a80
}

.RequestIndex-stuffFormButton {
    padding-bottom: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.RequestIndex-formBackButton, .RequestIndex-formConfirmButton {
    margin-left: 24px;
    width: 114px;
    height: 34px
}

.RequestIndex-formTitleHelpMenu {
    margin-left: 10px
}

.RequestIndex-confirmModal {
    text-align: center
}

.RequestIndex-confirmModalTitle {
    text-align: left
}

.RequestIndex-confirmButton {
    width: 220px;
    height: 36px
}

.RequestIndex-Oval {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.RequestIndex-OvalWrapper {
    position: absolute;
    width: 72px;
    height: 72px;
    top: 0;
    -o-object-fit: cover;
    object-fit: cover;
    background-color: rgba(26, 26, 26, .5);
    border-radius: 3px
}

html[data-theme=dark] .RequestIndex-OvalWrapper {
    background-color: hsla(0, 0%, 60%, .5)
}

.RequestIndex-scopedError {
    color: #f1403c;
    font-size: 14px;
    line-height: 16px
}

html[data-theme=dark] .RequestIndex-scopedError {
    color: #b7302d
}

@media screen and (max-width: 660px) {
    .RequestIndex-main {
        width: 100%;
        -webkit-box-shadow: none;
        box-shadow: none
    }

    .RequestIndex-content {
        margin: 0 15px
    }

    .RequestIndex-explain {
        padding: 30px 0 20px
    }

    .RequestIndex-form {
        padding-top: 20px
    }

    .RequestIndex-columnBackgroundContainer {
        padding-bottom: 76px !important
    }

    .RequestIndex-link {
        display: none
    }

    .RequestIndex-formSubmit {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        z-index: 2
    }

    .RequestIndex-formSubmit, .RequestIndex-stuffFormButton {
        position: fixed !important;
        bottom: 0;
        left: 0;
        width: 100%;
        padding-bottom: 10px !important;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-shadow: 0 -.5px 0 0 #ebebeb;
        box-shadow: 0 -.5px 0 0 #ebebeb;
        background: #fff;
        border-radius: 2px;
        opacity: .95
    }

    html[data-theme=dark] .RequestIndex-formSubmit, html[data-theme=dark] .RequestIndex-stuffFormButton {
        -webkit-box-shadow: 0 -.5px 0 0 #444;
        box-shadow: 0 -.5px 0 0 #444;
        background: #1a1a1a
    }

    .RequestIndex-formButton {
        position: static;
        margin-top: 10px;
        width: 90%;
        height: 36px
    }

    .RequestIndex-stuffFormButton {
        padding-top: 10px
    }

    .RequestIndex-stuffForm :nth-child(2n):not(:nth-child(2)) {
        margin-left: 100px
    }

    .RequestIndex-stuffForm :nth-child(7) {
        margin-left: 0
    }

    .RequestIndex-formBackButton, .RequestIndex-formConfirmButton {
        width: 165px;
        height: 36px
    }

    .RequestIndex-formBackButton {
        margin-left: 0
    }

    .RequestIndex-formConfirmButton {
        margin-left: 15px
    }
}

.Annotation-mark {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 16px;
    margin: 16px 0;
    border-radius: 4px;
    position: relative;
    background-color: #f6f6f6
}

html[data-theme=dark] .Annotation-mark {
    background-color: #2e2e2e
}

.Annotation-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.Annotation-alert {
    margin-right: 5px;
    width: 16px;
    height: 16px
}

.Annotation-markTitle {
    color: #444;
    font-size: 15px;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .Annotation-markTitle {
    color: grey
}

html[data-ios] .Annotation-markTitle {
    font-weight: 500
}

html[data-android] .Annotation-markTitle {
    font-weight: 700
}

.Annotation-markSummary {
    margin-top: 4px;
    color: #444;
    font-size: 14px;
    line-height: 20px;
    overflow: auto
}

html[data-theme=dark] .Annotation-markSummary {
    color: grey
}

.Annotation-markSummary a {
    cursor: pointer;
    color: #175199;
    text-decoration: underline
}

html[data-theme=dark] .Annotation-markSummary a {
    color: #175199
}

.CommercialContentAnnotation {
    background-color: rgba(0, 132, 255, .08);
    margin-top: 16px;
    border-radius: 4px;
    color: rgba(23, 81, 153, .72);
    padding: 12px 13px;
    line-height: 1;
    font-size: 14px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html[data-theme=dark] .CommercialContentAnnotation {
    background-color: rgba(58, 118, 208, .08);
    color: rgba(23, 81, 153, .72)
}

.CommercialContentAnnotation .Zi {
    fill: rgba(23, 81, 153, .72);
    margin-right: 5px
}

html[data-theme=dark] .CommercialContentAnnotation .Zi {
    fill: rgba(23, 81, 153, .72)
}

.RewardForm-rewardModal {
    width: 536px;
    font-size: 14px;
    color: #8590a6
}

html[data-theme=dark] .RewardForm-rewardModal {
    color: #606a80
}

.RewardForm-rewardTitle {
    color: #444;
    font-size: 24px;
    margin: 40px auto 24px;
    text-align: center
}

html[data-theme=dark] .RewardForm-rewardTitle {
    color: grey
}

.RewardForm-rewardInput {
    width: 488px;
    height: 48px;
    line-height: 48px;
    border: 1px solid #d3d3d3;
    border-radius: 3px
}

html[data-theme=dark] .RewardForm-rewardInput {
    border: 1px solid #2e2e2e
}

.RewardForm-rewardInput input {
    height: 36px
}

.RewardForm-rewardCheckbox {
    margin-top: 5px;
    margin-right: 8px;
    display: inline-block
}

.RewardForm-rewardLink {
    color: #0084ff
}

html[data-theme=dark] .RewardForm-rewardLink {
    color: #3a76d0
}

.RewardForm-prompting {
    display: inline-block;
    position: absolute;
    right: 22px
}

.RewardForm-remark {
    margin: 16px 0 39px
}

.RewardForm-Protocol, .RewardForm-Protocol p {
    display: inline-block
}

.RewardForm-rewardSubmit {
    width: 220px;
    height: 36px;
    display: block;
    margin: 0 auto;
    background: #0084ff;
    border-radius: 3px;
    border: 1px solid #0084ff;
    color: #fff
}

html[data-theme=dark] .RewardForm-rewardSubmit {
    background: #3a76d0;
    border: 1px solid #3a76d0;
    color: #1a1a1a
}

.RewardForm-rewardSubmit:hover {
    background-color: #0084ff !important;
    color: #fff
}

html[data-theme=dark] .RewardForm-rewardSubmit:hover {
    background-color: #3a76d0 !important;
    color: #1a1a1a
}

.RewardForm-rewardSubmit-disabled {
    border: 1px solid #d3d3d3
}

html[data-theme=dark] .RewardForm-rewardSubmit-disabled {
    border: 1px solid #2e2e2e
}

@media (max-width: 690px) {
    .RewardForm-rewardModal {
        width: 100%
    }

    .RewardForm-rewardInput {
        width: 90%;
        margin: 0 auto
    }

    .RewardForm-remark {
        text-align: center
    }

    .RewardForm-prompting {
        position: static
    }
}

.Reward-activateBtn {
    color: #fff;
    background: #f36;
    width: 80px;
    height: 34px;
    border-radius: 4px;
    margin-bottom: 20px;
    margin-top: 60px
}

html[data-theme=dark] .Reward-activateBtn {
    color: #1a1a1a;
    background: #d92155
}

.Reward-activateHint {
    margin-bottom: 28px
}

.Reward-editButton {
    margin-left: 15px;
    cursor: pointer
}

.Reward-money {
    font-size: 24px;
    margin-top: 20px;
    font-weight: 600;
    font-synthesis: style;
    color: #444
}

html[data-ios] .Reward-money {
    font-weight: 500
}

html[data-android] .Reward-money {
    font-weight: 700
}

html[data-theme=dark] .Reward-money {
    color: grey
}

.Reward-money span {
    cursor: pointer
}

.Reward-User-text {
    -ms-flex-item-align: center;
    align-self: center;
    cursor: pointer;
    margin: 0 auto 10px;
    max-width: 100px
}

.Reward-User-img {
    position: relative
}

.Reward-User-img:hover:after, .Reward-User-img:hover:before {
    visibility: visible;
    opacity: 1;
    -webkit-transition-delay: .3s;
    transition-delay: .3s
}

.Reward-User-img:before {
    -webkit-transform: scale(-1);
    transform: scale(-1);
    width: 0;
    height: 0;
    margin: 0 0 0 -6px;
    font-size: 0;
    color: rgba(26, 26, 26, .8);
    border-bottom: 6px solid;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent
}

html[data-theme=dark] .Reward-User-img:before {
    color: hsla(0, 0%, 60%, .8)
}

.Reward-User-img:after, .Reward-User-img:before {
    content: "";
    position: absolute;
    visibility: hidden;
    opacity: 0;
    left: 38%;
    top: -20px;
    z-index: 10;
    -webkit-transition: visibility .3s, opacity .3s;
    transition: visibility .3s, opacity .3s
}

.Reward-User-img:after {
    content: attr(data-hover-title);
    -webkit-transform: translate(-50%, -100%);
    transform: translate(-50%, -100%);
    font-size: 13px;
    color: #fff;
    background: rgba(26, 26, 26, .8);
    border-radius: 4px;
    white-space: nowrap;
    padding: 3px 8px
}

html[data-theme=dark] .Reward-User-img:after {
    color: #1a1a1a;
    background: hsla(0, 0%, 60%, .8)
}

.Reward-MoreUser, .Reward-User-avatar {
    cursor: pointer;
    border-radius: 100px;
    height: 25px;
    width: 25px;
    margin-right: 9px
}

.Reward-MoreUser {
    text-align: center;
    display: inline-block;
    background: #f6f6f6
}

html[data-theme=dark] .Reward-MoreUser {
    background: #2e2e2e
}

.Reward-MoreUser i {
    width: 3px;
    height: 3px;
    background: #bfbfbf;
    border-radius: 45%;
    position: absolute;
    margin-top: 11px;
    margin-left: -2px
}

html[data-theme=dark] .Reward-MoreUser i {
    background: grey
}

.Reward-MoreUser i:first-child {
    margin-left: -8px
}

.Reward-MoreUser i:last-child {
    margin-left: 4px
}

.Reward-count, .Reward-countZero {
    margin-top: 20px
}

.Reward-rewardBtn {
    color: #fff;
    background: #f36;
    width: 80px;
    height: 34px;
    border-radius: 4px;
    margin-top: 27px
}

html[data-theme=dark] .Reward-rewardBtn {
    color: #1a1a1a;
    background: #d92155
}

.Reward {
    text-align: center;
    font-size: 14px
}

.Reward, html[data-theme=dark] .Reward {
    color: grey
}

.Reward-tagline {
    margin-top: 60px;
    line-height: 18px;
    font-size: 15px
}

.TopicList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.TopicList .Topic:not(:last-child) {
    margin-right: 5px
}

.TopicList .Topic + .Topic {
    vertical-align: middle
}

.Labels-item + .Labels-item {
    margin-top: 8px
}

.ThanksForInvitingLabel {
    padding: 0 12px;
    height: 42px;
    line-height: 42px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: rgba(0, 132, 255, .08);
    color: rgba(23, 81, 153, .72);
    font-size: 14px;
    border-radius: 6px;
    overflow: hidden;
    white-space: nowrap
}

html[data-theme=dark] .ThanksForInvitingLabel {
    background-color: rgba(58, 118, 208, .08);
    color: rgba(23, 81, 153, .72)
}

.ThanksForInvitingLabel a {
    margin: 0 4px;
    overflow: hidden;
    text-overflow: ellipsis
}

.ThanksForInvitingLabel-icon {
    margin-right: 4px;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .ThanksForInvitingLabel-icon {
    font-weight: 500
}

html[data-android] .ThanksForInvitingLabel-icon {
    font-weight: 700
}

.ThanksForInvitingLabel-icon span {
    margin-right: 4px
}

.PositiveLabelLayout-popover--bottom, .PositiveLabelLayout-popover--bottom-left, .PositiveLabelLayout-popover--bottom-right {
    margin-top: 10px !important
}

.PositiveLabelLayout-popover--top, .PositiveLabelLayout-popover--top-left, .PositiveLabelLayout-popover--top-right {
    margin-top: -10px !important
}

.PositiveLabelLayout-popover--top-left .Popover-arrow--top, .PositiveLabelLayout-popover--top-right .Popover-arrow--top, .PositiveLabelLayout-popover--top .Popover-arrow--top {
    margin-top: 0
}

.PositiveLabelLayout-popover.PositiveLabelLayout-popover--none {
    border: none;
    border-radius: 10px;
    -webkit-box-shadow: 0 3px 18px rgba(26, 26, 26, .2);
    box-shadow: 0 3px 18px rgba(26, 26, 26, .2)
}

html[data-theme=dark] .PositiveLabelLayout-popover.PositiveLabelLayout-popover--none {
    -webkit-box-shadow: 0 3px 18px rgba(0, 0, 0, .2);
    box-shadow: 0 3px 18px rgba(0, 0, 0, .2)
}

.PositiveLabelLayout-popover .Popover-arrow:after {
    border: none;
    border-radius: 4px;
    -webkit-box-shadow: 2px 2px 8px rgba(26, 26, 26, .2);
    box-shadow: 2px 2px 8px rgba(26, 26, 26, .2)
}

html[data-theme=dark] .PositiveLabelLayout-popover .Popover-arrow:after {
    -webkit-box-shadow: 2px 2px 8px rgba(0, 0, 0, .2);
    box-shadow: 2px 2px 8px rgba(0, 0, 0, .2)
}

.PositiveLabelLayout-list {
    width: 345px;
    padding: 8px 0
}

.PositiveLabelMembers {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
}

.PositiveLabelMembers-avatar {
    width: 20px;
    height: 20px;
    border-radius: 50% !important;
    -webkit-box-shadow: 0 0 0 1.5px #fff;
    box-shadow: 0 0 0 1.5px #fff
}

html[data-theme=dark] .PositiveLabelMembers-avatar {
    -webkit-box-shadow: 0 0 0 1.5px #1a1a1a;
    box-shadow: 0 0 0 1.5px #1a1a1a;
    -webkit-filter: brightness(.7);
    filter: brightness(.7)
}

.PositiveLabelMembers-avatar + .PositiveLabelMembers-avatar {
    margin-right: -2.5px
}

.PositiveLabelBar {
    height: 42px;
    padding: 0 12px;
    border-radius: 6px;
    font-size: 14px;
    line-height: 20px;
    color: #c2a469;
    background-color: rgba(194, 164, 105, .08)
}

html[data-theme=dark] .PositiveLabelBar {
    color: #806e46;
    background-color: rgba(128, 110, 70, .08)
}

.PositiveLabelBar--link {
    display: block;
    text-decoration: none
}

.PositiveLabelBar--expandable {
    cursor: pointer
}

.PositiveLabelBar-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%
}

.PositiveLabelBar-icon {
    width: 20px;
    height: 20px;
    margin-right: 4px
}

.PositiveLabelBar-main {
    overflow: hidden;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: normal
}

.PositiveLabelBar-side {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 12px;
    line-height: normal
}

.PositiveLabelBar-title {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .PositiveLabelBar-title {
    font-weight: 500
}

html[data-android] .PositiveLabelBar-title {
    font-weight: 700
}

.PositiveLabelBar-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.PositiveLabelBar-linkDescription {
    margin-right: 2px
}

.PositiveLabelBar-linkIcon {
    width: 24px;
    height: 24px;
    margin: -2px
}

.PositiveLabelRoundtableBar {
    height: 60px;
    padding: 0 12px;
    border-radius: 6px;
    font-size: 14px;
    line-height: 20px;
    color: #c2a469;
    background-color: rgba(194, 164, 105, .08)
}

html[data-theme=dark] .PositiveLabelRoundtableBar {
    color: #806e46;
    background-color: rgba(128, 110, 70, .08)
}

.PositiveLabelRoundtableBar--link {
    display: block;
    text-decoration: none
}

.PositiveLabelRoundtableBar-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%
}

.PositiveLabelRoundtableBar-icon {
    width: 48px;
    height: 48px;
    margin-left: -4px;
    margin-right: 4px
}

.PositiveLabelRoundtableBar-main {
    overflow: hidden;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1
}

.PositiveLabelRoundtableBar-side {
    margin-left: 12px
}

.PositiveLabelRoundtableBar-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.PositiveLabelRoundtableBar-title {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .PositiveLabelRoundtableBar-title {
    font-weight: 500
}

html[data-android] .PositiveLabelRoundtableBar-title {
    font-weight: 700
}

.PositiveLabelRoundtableBar-badge {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-left: 8px;
    padding: 0 6px;
    border: 1px solid #c2a469;
    border-radius: 8px;
    font-size: 10px;
    line-height: 14px
}

html[data-theme=dark] .PositiveLabelRoundtableBar-badge {
    border: 1px solid #806e46
}

.PositiveLabelRoundtableBar-description {
    margin-top: 2px;
    font-size: 13px;
    line-height: 16px
}

.PositiveLabelRoundtableBar-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.PositiveLabelRoundtableBar-linkDescription {
    margin-right: 2px
}

.PositiveLabelRoundtableBar-linkIcon {
    width: 24px;
    height: 24px;
    margin: -2px
}

.PositiveLabelItem {
    height: 40px;
    padding: 0 12px;
    font-size: 14px;
    line-height: 20px;
    color: #c2a469
}

html[data-theme=dark] .PositiveLabelItem {
    color: #806e46
}

.PositiveLabelItem--link {
    display: block;
    text-decoration: none
}

.PositiveLabelItem--link:hover {
    background-color: #f6f6f6
}

html[data-theme=dark] .PositiveLabelItem--link:hover {
    background-color: #2e2e2e
}

.PositiveLabelItem-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%
}

.PositiveLabelItem-icon {
    width: 20px;
    height: 20px;
    margin-right: 4px
}

.PositiveLabelItem-main {
    overflow: hidden;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: normal
}

.PositiveLabelItem-side {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 12px;
    line-height: normal
}

.PositiveLabelItem-title {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .PositiveLabelItem-title {
    font-weight: 500
}

html[data-android] .PositiveLabelItem-title {
    font-weight: 700
}

.PositiveLabelItem-linkIcon {
    display: block;
    width: 24px;
    height: 24px;
    margin: -2px
}

.KnowledgePlanLabel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 12px;
    height: 42px;
    border-radius: 6px;
    background-color: rgba(0, 132, 255, .08);
    color: #175199;
    cursor: pointer;
    white-space: nowrap;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .KnowledgePlanLabel {
    background-color: rgba(58, 118, 208, .08);
    color: #175199
}

html[data-ios] .KnowledgePlanLabel {
    font-weight: 500
}

html[data-android] .KnowledgePlanLabel {
    font-weight: 700
}

.KnowledgePlanLabel-main {
    margin-left: 4px;
    overflow: hidden;
    text-overflow: ellipsis
}

.KnowledgePlanLabel-entry {
    margin-left: auto;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 20px
}

.KnowledgePlanLabel-entryText {
    margin-right: 2px
}

@media (max-width: 640px) {
    .KnowledgePlanLabel-wideScreenContent {
        display: none
    }
}

.DisclaimerLabel {
    padding: 16px;
    border-radius: 4px;
    font-size: 14px;
    line-height: 20px;
    background-color: rgba(0, 132, 255, .08)
}

.DisclaimerLabel, html[data-theme=dark] .DisclaimerLabel {
    color: rgba(23, 81, 153, .72)
}

html[data-theme=dark] .DisclaimerLabel {
    background-color: rgba(58, 118, 208, .08)
}

.DisclaimerLabel--mobile {
    padding: 10px;
    border-radius: 6px
}

.DisclaimerLabel-title {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .DisclaimerLabel-title {
    font-weight: 500
}

html[data-android] .DisclaimerLabel-title {
    font-weight: 700
}

.DisclaimerLabel-description {
    margin-top: 4px
}

.CircleLabelBar {
    height: 42px;
    padding: 0 12px;
    border-radius: 6px;
    font-size: 14px;
    line-height: 20px;
    color: #175199;
    background-color: rgba(0, 132, 255, .08)
}

html[data-theme=dark] .CircleLabelBar {
    color: #175199;
    background-color: rgba(58, 118, 208, .08)
}

.CircleLabelBar-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%
}

.CircleLabelBar-icon {
    width: 20px;
    height: 20px;
    margin-right: 4px
}

.CircleLabelBar-main {
    overflow: hidden;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: normal
}

.CircleLabelBar-side {
    margin-left: 12px;
    line-height: normal
}

.CircleLabelBar-title {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .CircleLabelBar-title {
    font-weight: 500
}

html[data-android] .CircleLabelBar-title {
    font-weight: 700
}

.CircleLabelBar-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.CircleLabelBar-linkDescription {
    margin-right: 2px
}

.CircleLabelBar-linkIcon {
    width: 24px;
    height: 24px;
    margin: -2px
}

.PaidContentLabel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 11px 14px;
    font-size: 14px;
    color: #175199;
    opacity: .72;
    border-radius: 6px;
    background: rgba(0, 132, 255, .08);
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .PaidContentLabel {
    color: #175199;
    background: rgba(58, 118, 208, .08)
}

html[data-ios] .PaidContentLabel {
    font-weight: 500
}

html[data-android] .PaidContentLabel {
    font-weight: 700
}

.PaidContentLabel-main {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: normal;
    height: 20px
}

.PaidContentLabel-vipFree {
    position: relative;
    color: #b38d59;
    background: linear-gradient(135deg, rgba(230, 218, 184, .25), rgba(217, 188, 130, .2))
}

html[data-theme=dark] .PaidContentLabel-vipFree {
    color: #735b39;
    background: linear-gradient(135deg, rgba(140, 125, 84, .25), rgba(128, 102, 51, .2))
}

.PaidContentLabel-vipTopCornerIcon {
    position: absolute;
    top: 0;
    left: 0;
    width: 70px;
    height: 24px
}

.PaidContentLabel-vipBottomCornerIcon {
    position: absolute;
    bottom: 0;
    right: 10px;
    width: 70px;
    height: 30px;
    z-index: -1
}

.PaidContentLabel-icon {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin-right: 6px
}

.PaidContentLabel-HelpOutline {
    width: 17px;
    height: 17px
}

.PaidContentLabel-vipLabel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.PaidContentLabel-vipLabel-left {
    width: 62px
}

.PaidContentLabel-vipLabel-right {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    font-weight: 400;
    color: #b38d59;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1
}

html[data-theme=dark] .PaidContentLabel-vipLabel-right {
    color: #735b39
}

.RecognizerListModal {
    padding: 20px
}

.RecognizerListModal .ContentItem {
    padding: 10px
}

.RecognizerListModal-header {
    height: 74px;
    width: 100%;
    font-size: 15px;
    border-bottom: 1px solid #f6f6f6
}

html[data-theme=dark] .RecognizerListModal-header {
    border-bottom: 1px solid #2e2e2e
}

.RecognizerListModal-headerDescription {
    color: #8590a6
}

html[data-theme=dark] .RecognizerListModal-headerDescription {
    color: #606a80
}

.Body--Mobile .RecognizerListModal .ContentItem-meta {
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical
}

.LabelContainer {
    margin: 10px 0
}

.LabelContainer-placeholder {
    height: 42px
}

.LabelContainer .PaidContentLabel-HelpOutline {
    display: none
}

.CreatorRightsNotification .Modal-content {
    margin: 0;
    padding: 0
}

.CreatorRightsNotification-liukanshan {
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 42px
}

.CreatorRightsNotification-title {
    font-size: 24px;
    line-height: 30px;
    margin-top: 40px;
    text-align: center;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .CreatorRightsNotification-title {
    font-weight: 500
}

html[data-android] .CreatorRightsNotification-title {
    font-weight: 700
}

.CreatorRightsNotification-content {
    font-size: 14px;
    margin: 24px 24px 0;
    text-align: center
}

.CreatorRightsNotification-buttonGroup {
    margin: 32px 0 24px
}

.CreatorRightsNotification-buttonGroup .Button {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 280px
}

.CreatorRightsNotification-buttonGroup .CreatorRightsNotification-dismiss.Button {
    margin-top: 12px
}

.PostIndex-showReviewerButton {
    margin-left: 2px
}

.PostIndex-reviewers-userlink-wrapper {
    display: inline-block
}

.TitleImage {
    display: block;
    margin: 16px auto 0;
    width: 690px
}

@media (max-width: 690px) {
    .TitleImage {
        margin-top: 0;
        width: 100%
    }
}

.TitleImage--fullScreen {
    width: 100%;
    padding-bottom: 33.3%;
    background-size: cover;
    background-position: 50%;
    margin-top: 0
}

@media (min-width: 690px) {
    .TitleImage--fullScreen {
        padding-top: 52px
    }
}

.Post-Author {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.Post-Author .AuthorInfo {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    white-space: nowrap;
    overflow: hidden
}

.Post-Author .AuthorInfo-name {
    color: #444
}

html[data-theme=dark] .Post-Author .AuthorInfo-name {
    color: grey
}

.Post-Author .AuthorInfo-detail {
    color: #646464
}

html[data-theme=dark] .Post-Author .AuthorInfo-detail {
    color: #999
}

@media (max-width: 690px) {
    .Post-Author .AuthorInfo-name > .Popover > div {
        max-width: 80px;
        vertical-align: top;
        overflow: hidden;
        text-overflow: ellipsis
    }
}

.Post-Author-Mobile {
    margin: 0;
    padding: 11.5px;
    border-bottom: 1px solid #d3d3d3
}

html[data-theme=dark] .Post-Author-Mobile {
    border-bottom-color: #2e2e2e
}

@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi) {
    .Post-Author-Mobile {
        border-bottom-width: .5px
    }
}

@media (-webkit-min-device-pixel-ratio: 3),(min-resolution: 288dpi) {
    .Post-Author-Mobile {
        border-bottom-width: .33333px
    }
}

@media (-webkit-min-device-pixel-ratio: 4),(min-resolution: 384dpi) {
    .Post-Author-Mobile {
        border-bottom-width: .25px
    }
}

.Post-Author-Mobile .FollowButton {
    font-weight: 600;
    font-synthesis: style;
    padding: 0 12px;
    min-width: 72px;
    line-height: 30px
}

html[data-ios] .Post-Author-Mobile .FollowButton {
    font-weight: 500
}

html[data-android] .Post-Author-Mobile .FollowButton {
    font-weight: 700
}

.Post-SideActions {
    position: fixed;
    left: calc((100vw - 958px) / 2);
    height: 0;
    pointer-events: none;
    margin: auto;
    top: 106px
}

.Post-SideActions button {
    display: block;
    width: 80px;
    color: #8590a6;
    line-height: 1.14286;
    font-size: 14px;
    margin-bottom: 20px;
    pointer-events: auto;
    -webkit-transition: color .3s;
    transition: color .3s
}

html[data-theme=dark] .Post-SideActions button {
    color: #606a80
}

.Post-SideActions button:hover, html[data-theme=dark] .Post-SideActions button:hover {
    color: grey
}

.Post-SideActions button.like {
    color: #0084ff
}

html[data-theme=dark] .Post-SideActions button.like {
    color: #3a76d0
}

.Post-SideActions button.like .Post-SideActions-icon {
    border-radius: 50%;
    height: 48px;
    background-color: rgba(0, 132, 255, .1);
    color: #0084ff;
    will-change: transform;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s
}

html[data-theme=dark] .Post-SideActions button.like .Post-SideActions-icon {
    background-color: rgba(58, 118, 208, .1);
    color: #3a76d0
}

.Post-SideActions button.like .Post-SideActions-icon svg {
    -webkit-transition: .3s;
    transition: .3s;
    position: relative;
    z-index: 2
}

.Post-SideActions button.like .likeCount {
    height: 16px;
    overflow: hidden;
    -webkit-transition: .3s;
    transition: .3s
}

.Post-SideActions button.like:hover > .Post-SideActions-icon {
    background-color: rgba(0, 132, 255, .15)
}

html[data-theme=dark] .Post-SideActions button.like:hover > .Post-SideActions-icon {
    background-color: rgba(58, 118, 208, .15)
}

.Post-SideActions button.like .justLiked .likeCount, .Post-SideActions button.like:hover:not(:disabled):not(.active) .likeCount {
    -webkit-transform: translateY(4px);
    transform: translateY(4px)
}

.Post-SideActions button.like .justLiked .Post-SideActions-icon, .Post-SideActions button.like:hover:not(:disabled):not(.active) .Post-SideActions-icon {
    background: rgba(0, 132, 255, .15);
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

html[data-theme=dark] .Post-SideActions button.like .justLiked .Post-SideActions-icon, html[data-theme=dark] .Post-SideActions button.like:hover:not(:disabled):not(.active) .Post-SideActions-icon {
    background: rgba(58, 118, 208, .15)
}

.Post-SideActions button.like .justLiked .Post-SideActions-icon svg, .Post-SideActions button.like:hover:not(:disabled):not(.active) .Post-SideActions-icon svg {
    -webkit-transform: scale(1.18182);
    transform: scale(1.18182)
}

.Post-SideActions button.like:active:not(:disabled):not(.active) .Post-SideActions-icon {
    background: rgba(0, 132, 255, .1);
    -webkit-transform: scale(.95);
    transform: scale(.95)
}

html[data-theme=dark] .Post-SideActions button.like:active:not(:disabled):not(.active) .Post-SideActions-icon {
    background: rgba(58, 118, 208, .1)
}

.Post-SideActions button.like:active:not(:disabled):not(.active) .Post-SideActions-icon svg {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.Post-SideActions button.like:disabled {
    opacity: .5;
    cursor: default
}

.Post-SideActions button.like:disabled .Post-SideActions-icon {
    background-color: rgba(0, 132, 255, .1)
}

html[data-theme=dark] .Post-SideActions button.like:disabled .Post-SideActions-icon {
    background-color: rgba(58, 118, 208, .1)
}

.Post-SideActions button.like.active .Post-SideActions-icon {
    color: #f6f6f6;
    background-color: #0084ff
}

html[data-theme=dark] .Post-SideActions button.like.active .Post-SideActions-icon {
    color: #2e2e2e;
    background-color: #3a76d0
}

.Post-SideActions button.like.active.justLiked .Post-SideActions-icon:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 50%;
    height: 48px;
    width: 48px;
    background-color: #0084ff;
    color: #0084ff;
    opacity: 0;
    -webkit-animation-name: Post-SideActions-spread;
    animation-name: Post-SideActions-spread;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: forward;
    animation-fill-mode: forward
}

html[data-theme=dark] .Post-SideActions button.like.active.justLiked .Post-SideActions-icon:before {
    background-color: #3a76d0;
    color: #3a76d0
}

.Post-SideActions button.like .likeCount-inner {
    -webkit-transition: .3s;
    transition: .3s
}

.Post-SideActions button.like:not(.active) .likeCount-inner :after {
    content: attr(data-previous);
    display: block
}

.Post-SideActions button.like.active .likeCount-inner {
    -webkit-transform: translateY(-16px);
    transform: translateY(-16px)
}

.Post-SideActions button.like.active .likeCount-inner:before {
    content: attr(data-previous);
    display: block
}

.Post-SideActions-icon {
    width: 48px;
    margin: 0 auto 8px
}

.Post-SideActions-upIcon {
    margin-top: 16px
}

@-webkit-keyframes Post-SideActions-spread {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
    to {
        -webkit-transform: scale(1.8);
        transform: scale(1.8);
        opacity: 0
    }
}

@keyframes Post-SideActions-spread {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
    to {
        -webkit-transform: scale(1.8);
        transform: scale(1.8);
        opacity: 0
    }
}

.NextArticle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: right;
    cursor: pointer;
    max-width: 250px;
    position: absolute;
    right: 20px;
    top: 9px
}

.NextArticle-Next {
    font-size: 12px;
    color: #8590a6
}

html[data-theme=dark] .NextArticle-Next {
    color: #606a80
}

.NextArticle-Title {
    font-weight: 600;
    font-synthesis: style;
    font-size: 14px;
    color: #1a1a1a;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

html[data-ios] .NextArticle-Title {
    font-weight: 500
}

html[data-android] .NextArticle-Title {
    font-weight: 700
}

html[data-theme=dark] .NextArticle-Title {
    color: #999
}

.Post-RichTextContainer {
    position: relative
}

.Post-NormalMain > .Post-RichTextContainer {
    overflow: visible
}

.BlockTitle {
    font-weight: 600;
    font-synthesis: style;
    line-height: 1.375;
    font-size: 16px;
    color: #1a1a1a;
    border-bottom: solid;
    border-width: 1px;
    border-color: #ebebeb;
    padding-bottom: 12px;
    margin-top: 40px
}

html[data-ios] .BlockTitle {
    font-weight: 500
}

html[data-android] .BlockTitle {
    font-weight: 700
}

html[data-theme=dark] .BlockTitle {
    color: #999;
    border-color: #444
}

@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi) {
    .BlockTitle {
        border-width: .5px
    }
}

@media (-webkit-min-device-pixel-ratio: 3),(min-resolution: 288dpi) {
    .BlockTitle {
        border-width: .33333px
    }
}

@media (-webkit-min-device-pixel-ratio: 4),(min-resolution: 384dpi) {
    .BlockTitle {
        border-width: .25px
    }
}

.Post-Button-ViewMore {
    display: block;
    width: 100%;
    line-height: 20px;
    padding: 16px 0;
    font-size: 14px;
    text-align: center;
    color: #8590a6
}

html[data-theme=dark] .Post-Button-ViewMore {
    color: #606a80
}

.MobilePostItem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    border-bottom: solid;
    border-width: 1px;
    border-color: #ebebeb
}

html[data-theme=dark] .MobilePostItem {
    border-color: #444
}

@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi) {
    .MobilePostItem {
        border-width: .5px
    }
}

@media (-webkit-min-device-pixel-ratio: 3),(min-resolution: 288dpi) {
    .MobilePostItem {
        border-width: .33333px
    }
}

@media (-webkit-min-device-pixel-ratio: 4),(min-resolution: 384dpi) {
    .MobilePostItem {
        border-width: .25px
    }
}

.MobilePostItem-TitleImage {
    overflow: hidden;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 4px;
    vertical-align: top;
    width: 113px;
    margin: 16px auto 16px 10px;
    height: 75px
}

.MobilePostItem-Description {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    width: 54%;
    margin: 17.5px 10px 17.5px 0
}

.MobilePostItem-Title {
    font-size: 17px;
    line-height: 1.5;
    font-weight: 600;
    font-synthesis: style;
    color: #1a1a1a;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

html[data-ios] .MobilePostItem-Title {
    font-weight: 500
}

html[data-android] .MobilePostItem-Title {
    font-weight: 700
}

html[data-theme=dark] .MobilePostItem-Title {
    color: #999
}

.MobilePostItem-Summary {
    padding: 4px 0;
    line-height: 18.5px;
    font-size: 14px;
    color: #444;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

html[data-theme=dark] .MobilePostItem-Summary {
    color: grey
}

.MobilePostItem-Footer {
    padding-top: 4px;
    font-size: 13px;
    color: #999;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

html[data-theme=dark] .MobilePostItem-Footer {
    color: #646464
}

.MobilePostItem-edited {
    border: 1px solid #999;
    padding: 1px 5px;
    font-size: 10px;
    margin-right: 7px;
    border-radius: 4px
}

html[data-theme=dark] .MobilePostItem-edited {
    border: 1px solid #646464
}

.PostItem {
    height: 226px;
    width: 245px;
    min-width: 245px;
    border-radius: 5px;
    -webkit-box-shadow: 0 6px 14px 0 rgba(26, 26, 26, .06);
    box-shadow: 0 6px 14px 0 rgba(26, 26, 26, .06);
    background: #fff;
    margin-right: 14px;
    position: relative;
    overflow: hidden;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s
}

html[data-theme=dark] .PostItem {
    -webkit-box-shadow: 0 6px 14px 0 hsla(0, 0%, 60%, .06);
    box-shadow: 0 6px 14px 0 hsla(0, 0%, 60%, .06);
    background: #1a1a1a
}

.PostItem:hover {
    -webkit-transform: scale(1.04);
    transform: scale(1.04)
}

.PostItem-TitleImage {
    height: 123px;
    width: 245px;
    -o-object-fit: cover;
    object-fit: cover;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

.PostItem-Title {
    font-weight: 600;
    font-synthesis: style;
    font-size: 16px;
    min-width: 225px;
    color: #1a1a1a;
    line-height: 22px;
    margin: 12px;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

html[data-ios] .PostItem-Title {
    font-weight: 500
}

html[data-android] .PostItem-Title {
    font-weight: 700
}

html[data-theme=dark] .PostItem-Title {
    color: #999
}

.PostItem-Summary {
    font-size: 14px;
    color: #1a1a1a;
    line-height: 20px;
    margin: 8px 12px;
    max-height: 118px;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical
}

html[data-theme=dark] .PostItem-Summary {
    color: #999
}

.PostItem-Footer {
    position: absolute;
    bottom: 12px;
    left: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    font-size: 14px;
    color: #8590a6;
    line-height: 20px
}

html[data-theme=dark] .PostItem-Footer {
    color: #606a80
}

.PostItem-FooterTitle {
    margin-right: 24px
}

.PagingButton {
    width: 48px;
    height: 48px;
    border-radius: 100px;
    background: #fff;
    -webkit-box-shadow: 0 6px 13px 0 rgba(26, 26, 26, .06);
    box-shadow: 0 6px 13px 0 rgba(26, 26, 26, .06);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    margin-top: 90px
}

html[data-theme=dark] .PagingButton {
    background: #1a1a1a;
    -webkit-box-shadow: 0 6px 13px 0 hsla(0, 0%, 60%, .06);
    box-shadow: 0 6px 13px 0 hsla(0, 0%, 60%, .06)
}

.PagingButton:hover {
    -webkit-transform: scale(1.04);
    transform: scale(1.04);
    z-index: 9
}

.PagingButton:disabled {
    visibility: hidden
}

.PagingButton-Next {
    margin-left: 40px
}

.PagingButton-Previous {
    margin-right: 40px
}

.Recommendations-Main {
    background: #f6f6f6;
    position: relative;
    margin: 24px auto !important
}

html[data-theme=dark] .Recommendations-Main {
    background: #2e2e2e
}

.Recommendations-List {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 32px auto;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media (min-width: 690px) {
    .Recommendations-BlockTitle {
        width: 690px;
        margin: 24px auto 4px
    }
}

.AdvertImg-12-5 {
    position: relative;
    display: block
}

.AdvertImg-12-5 .AdvertImg {
    position: relative;
    z-index: 0
}

.AdvertImg-12-5 .AdvertImg:before {
    display: block;
    width: 100%;
    padding-top: 41.66667%;
    border-radius: inherit;
    content: " ";
    pointer-events: none
}

.AdvertImg-12-5 .AdvertImg img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

.AdvertImg-16-9 {
    position: relative;
    display: block
}

.AdvertImg-16-9 .AdvertImg {
    position: relative;
    z-index: 0
}

.AdvertImg-16-9 .AdvertImg:before {
    display: block;
    width: 100%;
    padding-top: 56.25%;
    border-radius: inherit;
    content: " ";
    pointer-events: none
}

.AdvertImg-16-9 .AdvertImg img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

.AdvertImg-2-1 {
    position: relative;
    display: block
}

.AdvertImg-2-1 .AdvertImg {
    position: relative;
    z-index: 0
}

.AdvertImg-2-1 .AdvertImg:before {
    display: block;
    width: 100%;
    padding-top: 50%;
    border-radius: inherit;
    content: " ";
    pointer-events: none
}

.AdvertImg-2-1 .AdvertImg img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

.PcArticleDownLoad {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 442px;
    height: 106px;
    padding: 0 15px;
    border: 0;
    border-radius: 16px;
    margin: 0 auto;
    background-color: hsla(0, 0%, 96.5%, .92);
    text-decoration: none;
    cursor: pointer;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px)
}

.PcArticleDownLoad-margin {
    margin-left: 4px
}

.PcArticleDownLoad-image {
    width: 76px;
    height: 76px;
    border-radius: 4px
}

.PcArticleDownLoad-des {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    padding-left: 12px
}

.PcArticleDownLoad-appName {
    display: -webkit-box;
    color: #1a1a1a;
    overflow: hidden;
    font-size: 20px;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

html[data-theme=dark] .PcArticleDownLoad-appName {
    color: #999
}

.PcArticleDownLoad-rate {
    color: #999;
    font-size: 18px
}

.PcArticleDownLoad-active {
    position: relative;
    top: 5px;
    left: -16px;
    display: inline-block;
    overflow: hidden
}

.PcArticleDownLoad-button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 72px;
    border-radius: 5px;
    margin-left: 14px;
    color: #fff;
    background: #0084ff;
    font-size: 14px;
    line-height: 32px
}

html[data-theme=dark] .PcArticleDownLoad-button {
    background: #3a76d0
}

.AppArticleDownLoad {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 12px;
    border: 0;
    border-style: solid;
    border-radius: 8px;
    background: #f6f6f6;
    text-decoration: none;
    cursor: pointer
}

html[data-theme=dark] .AppArticleDownLoad {
    background: #2e2e2e
}

.AppArticleDownLoad-image {
    width: 60px;
    height: 60px;
    border-radius: 4px
}

.AppArticleDownLoad-des {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    padding-left: 12px
}

.AppArticleDownLoad-appName {
    display: -webkit-box;
    color: #1a1a1a;
    overflow: hidden;
    font-size: 16px;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.AppArticleDownLoad-rate {
    color: #999;
    font-size: 14px
}

.AppArticleDownLoad-active {
    position: relative;
    top: 5px;
    left: -12px;
    display: inline-block;
    overflow: hidden
}

.AppArticleDownLoad-button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 72px;
    border-radius: 5px;
    margin-left: 8px;
    color: #fff;
    background: #0084ff;
    font-size: 13px;
    line-height: 32px
}

html[data-theme=dark] .AppArticleDownLoad-button {
    background: #3a76d0
}

.CommentTopbar-title {
    display: inline-block;
    font-size: 15px;
    font-weight: 600;
    font-synthesis: style;
    color: #1a1a1a
}

html[data-ios] .CommentTopbar-title {
    font-weight: 500
}

html[data-android] .CommentTopbar-title {
    font-weight: 700
}

html[data-theme=dark] .CommentTopbar-title {
    color: #999
}

.CommentTopbar-back {
    font-size: 16px;
    font-weight: inherit;
    color: #1a1a1a
}

html[data-theme=dark] .CommentTopbar-back {
    color: #999
}

.CommentTopbar-back:hover {
    color: #0084ff
}

html[data-theme=dark] .CommentTopbar-back:hover {
    color: #3a76d0
}

.CommentTopbar-backIcon {
    vertical-align: -2px;
    fill: currentColor
}

.CommentTopbar {
    border-radius: 2px
}

.CommentTopbar-meta {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 50px;
    padding: 0 16px
}

.CommentTopbar-meta, .CommentTopbar-tabsWrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.CommentTopbar-tabsWrapper {
    font-size: 15px
}

.CommentTopbar-tabs {
    padding: 0;
    border-bottom: none
}

.CommentTopbar-tab {
    display: inline-block;
    padding: 0 20px
}

.CommentTopbar-tab:first-child {
    padding-left: 0
}

.CommentTopbar-tabButton {
    position: relative;
    height: 56px;
    border: none
}

.CommentTopbar-tabButton:hover {
    background: none
}

.CommentEditor .RichText {
    min-height: auto !important
}

.CommentEditor--normal {
    position: relative;
    -webkit-transition: padding-right .3s ease;
    transition: padding-right .3s ease
}

.CommentEditor--normal .CommentEditor-input {
    overflow: hidden;
    width: 100%
}

.CommentEditor--normal .Editable-unstyled {
    margin: 0 !important
}

.CommentEditor--normal.CommentEditor--active {
    padding-right: 94px
}

.CommentEditor--normal.CommentEditor--active .CommentEditor-singleButton {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.CommentEditor--inCommentItem .CommentEditor-actions {
    margin-top: 16px;
    text-align: right
}

.CommentEditor--inCommentItem .CommentEditor-actions .Button {
    line-height: 34px
}

.CommentEditor--inCommentItem .CommentEditor-actions .Button + .Button {
    margin-left: 20px
}

.CommentEditor-singleButton {
    position: absolute;
    right: 16px;
    bottom: 12px;
    line-height: 34px !important;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition: opacity .3s ease, -webkit-transform .3s ease;
    transition: opacity .3s ease, -webkit-transform .3s ease;
    transition: opacity .3s ease, transform .3s ease;
    transition: opacity .3s ease, transform .3s ease, -webkit-transform .3s ease
}

.CommentEditor-singleButton:disabled {
    cursor: not-allowed
}

.CommentEditor-input {
    font-size: 15px
}

.CommentEditor-input .Editable {
    background: #f6f6f6
}

html[data-theme=dark] .CommentEditor-input .Editable {
    background: #2e2e2e
}

.CommentEditor-input .Editable--focus {
    background: #fff
}

html[data-theme=dark] .CommentEditor-input .Editable--focus {
    background: #1a1a1a
}

.CommentEditor-input .Dropzone {
    min-height: auto !important
}

.CommentEditor-input .RichText--editable {
    padding: 5px 12px !important
}

.CommentEditor-startCommentButton {
    width: 100%
}

.CommentEditor-hiddenInput {
    position: absolute;
    z-index: -1;
    top: -9999px
}

.CommentEditor-input--mobile {
    min-height: 208px
}

.CommentEditor-input--mobile, .CommentEditor-input--mobile.is-focus {
    border: none
}

.CommentEditor-input--mobile .Editable {
    background: #fff
}

html[data-theme=dark] .CommentEditor-input--mobile .Editable {
    background: #1a1a1a
}

.CommentEditor-modalButtons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 8px 20px;
    border-top: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb
}

html[data-theme=dark] .CommentEditor-modalButtons {
    border-top: 1px solid #444;
    border-bottom: 1px solid #444
}

.CommentEditor-modalButtons .Button {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1
}

.CommentEditor-modalButtons .Button + .Button {
    margin-left: 16px
}

.CommentItem {
    position: relative;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding: 12px 20px 10px;
    font-size: 15px
}

.CommentItem:not(:first-child):after {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    display: block;
    margin: 0 20px;
    border-bottom: 1px solid #f6f6f6;
    content: ""
}

html[data-theme=dark] .CommentItem:not(:first-child):after {
    border-bottom-color: #2e2e2e
}

@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi) {
    .CommentItem:not(:first-child):after {
        border-bottom-width: .5px
    }
}

@media (-webkit-min-device-pixel-ratio: 3),(min-resolution: 288dpi) {
    .CommentItem:not(:first-child):after {
        border-bottom-width: .33333px
    }
}

@media (-webkit-min-device-pixel-ratio: 4),(min-resolution: 384dpi) {
    .CommentItem:not(:first-child):after {
        border-bottom-width: .25px
    }
}

.CommentItem-deletedContent {
    padding: 16px 0;
    font-size: 14px;
    color: #8590a6;
    text-align: center
}

html[data-theme=dark] .CommentItem-deletedContent {
    color: #606a80
}

.CommentItem-meta {
    position: relative;
    height: 27px;
    padding-right: 3px;
    padding-left: 1px;
    margin-bottom: 5px;
    line-height: 24px
}

.CommentItem-avatar {
    margin-right: 8px
}

.CommentItem-avatar .UserLink-avatar {
    vertical-align: top
}

.CommentItem-reply, .CommentItem-roleInfo {
    color: #8590a6
}

html[data-theme=dark] .CommentItem-reply, html[data-theme=dark] .CommentItem-roleInfo {
    color: #606a80
}

.CommentItem-reviewing {
    margin-left: 8px
}

.CommentItem-reply {
    margin-right: 8px;
    margin-left: 8px
}

.CommentItem-roleInfo {
    margin-right: -8px
}

.CommentItem-time {
    float: right;
    font-size: 14px;
    color: #8590a6
}

html[data-theme=dark] .CommentItem-time {
    color: #606a80
}

.CommentItem-content {
    margin-bottom: 6px;
    line-height: 25px
}

.CommentItem-content p {
    margin: 0
}

.CommentItem-editor {
    margin-bottom: 8px
}

.CommentItem-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 24px;
    font-size: 14px;
    line-height: 24px
}

.CommentItem-footer .Button + .Button {
    margin-left: 20px
}

.CommentItem-mobileFooter .Button + .Button {
    margin-left: 0
}

.CommentItem-hoverBtn {
    opacity: 0;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.CommentItem:hover .CommentItem-hoverBtn {
    opacity: 1
}

.CommentItem-walleTag {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 14px;
    color: #8590a6;
    margin-left: 16px;
    margin-right: 16px
}

html[data-theme=dark] .CommentItem-walleTag {
    color: #606a80
}

.CommentItem-walleIcon {
    margin-right: 4px
}

.CommentItem-likeBtn:disabled {
    opacity: 1
}

.CommentItem-likeBtn.is-liked {
    color: #0084ff
}

html[data-theme=dark] .CommentItem-likeBtn.is-liked {
    color: #3a76d0
}

.CommentItem-likeBtn.is-liked:hover, html[data-theme=dark] .CommentItem-likeBtn.is-liked:hover {
    color: #175199
}

.CommentItem-likeBtn.is-liked .Icon, .CommentItem-likeBtn.is-liked:hover .Icon {
    fill: currentColor
}

.CommentItem--highlighted {
    -webkit-animation: highlight 1.6s ease-out;
    animation: highlight 1.6s ease-out
}

@-webkit-keyframes highlight {
    0% {
        background: #ebebeb
    }
html [ data-theme = dark ] 0 %

{
    background: #444
}
to {
    background: transparent none repeat 0 0/auto auto padding-box border-box scroll;
    background: initial
}

}
@keyframes highlight {
    0% {
        background: #ebebeb
    }
html [ data-theme = dark ] 0 %

{
    background: #444
}
to {
    background: transparent none repeat 0 0/auto auto padding-box border-box scroll;
    background: initial
}

}
.IsolationDot {
    margin: 0 6px
}

.CommentItem-replyArrow {
    color: #8590a6;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    margin: 0 5px 0 8px
}

html[data-theme=dark] .CommentItem-replyArrow {
    color: #606a80
}

.CommentItem-userLink {
    max-width: 80px;
    font-weight: 600;
    font-synthesis: style;
    display: inline-block;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    vertical-align: top
}

@media (min-width: 360px) {
    .CommentItem-userLink {
        max-width: 100px
    }
}

html[data-ios] .CommentItem-userLink {
    font-weight: 500
}

html[data-android] .CommentItem-userLink {
    font-weight: 700
}

.CommentItem-menu-item {
    padding-top: 13px;
    padding-bottom: 13px
}

.Post-MobileCommentButton {
    line-height: 1.4;
    border-radius: 3px;
    background-color: #f6f6f6;
    border: 1px solid #ebebeb;
    font-size: 15px;
    color: #8590a6;
    margin-top: 12px;
    padding: 12px
}

html[data-theme=dark] .Post-MobileCommentButton {
    background-color: #2e2e2e;
    border: 1px solid #444;
    color: #606a80
}

.CommentsList {
    margin: 0 -16px
}

.CommentList-divider {
    position: relative;
    margin: 0 24px;
    font-size: 14px;
    color: #8590a6;
    text-align: center
}

html[data-theme=dark] .CommentList-divider {
    color: #606a80
}

.CommentList-divider:first-child {
    margin-top: 16px
}

.CommentList-divider:last-child {
    margin-bottom: 16px
}

.CommentList-divider + .CommentItem:after {
    content: none
}

.CommentList-divider a, html[data-theme=dark] .CommentList-divider a {
    color: #175199
}

.CommentList-divider a:hover, html[data-theme=dark] .CommentList-divider a:hover {
    border-bottom: 1px solid #175199
}

.CommentList-dividerLine {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 0;
    margin: auto;
    border-top: 1px solid #ebebeb
}

html[data-theme=dark] .CommentList-dividerLine {
    border-top: 1px solid #444
}

.CommentList-dividerText {
    position: relative;
    z-index: 2;
    display: inline-block;
    padding: 0 1em;
    background-color: #fff
}

html[data-theme=dark] .CommentList-dividerText {
    background-color: #1a1a1a
}

.CommentList-dividerText .CommentList-questionMark {
    margin-left: 8px
}

.Column-ColumnItem {
    margin: 24px 0
}

.Column-ColumnItem .FollowButton {
    min-width: 90px
}

.Column-ColumnItem .ColumnItem-CancleButton {
    display: inline;
    color: #175199;
    cursor: pointer
}

html[data-theme=dark] .Column-ColumnItem .ColumnItem-CancleButton {
    color: #175199
}

.Column-ColumnItem .ColumnItem-CancleButton .cancel {
    display: none
}

.Column-ColumnItem .ColumnItem-CancleButton .status, .Column-ColumnItem .ColumnItem-CancleButton:hover .cancel {
    display: inline
}

.Column-ColumnItem .ColumnItem-CancleButton:hover .status {
    display: none
}

.Column-ColumnItem .ContentItem-main {
    height: 40px
}

.Column-ColumnItem .ContentItem-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.Column-ColumnItem .ContentItem-title {
    font-weight: 600;
    font-synthesis: style;
    font-size: 15px;
    color: #444;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

html[data-ios] .Column-ColumnItem .ContentItem-title {
    font-weight: 500
}

html[data-android] .Column-ColumnItem .ContentItem-title {
    font-weight: 700
}

html[data-theme=dark] .Column-ColumnItem .ContentItem-title {
    color: grey
}

.Column-ColumnItem .ContentItem-meta {
    margin-top: 0;
    font-size: 14px;
    line-height: 1.5;
    color: #646464;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

html[data-theme=dark] .Column-ColumnItem .ContentItem-meta {
    color: #999
}

.PostIndex-status {
    margin: 48px auto 0 !important;
    line-height: 1.5;
    color: #8590a6;
    background: #e7eaf1;
    border-radius: 4px
}

html[data-theme=dark] .PostIndex-status {
    color: #606a80
}

.PostIndex-status p {
    padding: 16px
}

.Post-content {
    background: #fff
}

html[data-theme=dark] .Post-content {
    background: #1a1a1a
}

@media (max-width: 690px) {
    .Post-content {
        padding-top: 0
    }
}

@media (min-width: 690px) {
    .Post-content {
        min-width: 1000px;
        overflow: hidden
    }
}

.ContentItem-time {
    padding: 16px 0
}

@media (max-width: 690px) {
    .ContentItem-time {
        margin-top: 10px
    }
}

.Post-VideoContentMore {
    text-align: center;
    font-size: 14px;
    margin-top: 30px;
    color: #0084ff
}

html[data-theme=dark] .Post-VideoContentMore {
    color: #3a76d0
}

.Post-NormalMain .Post-Header, .Post-NormalMain > div, .Post-NormalSub > div {
    overflow: hidden;
    max-width: 690px;
    margin: 0 auto
}

.Post-NormalSub .Comments-container {
    border-top: 52px solid transparent;
    margin: -52px auto 0 !important
}

.Post-NormalSub .Comments-pattern-loading {
    height: 100vh
}

.PostIndex-Contributions {
    margin-bottom: -8px !important;
    padding-top: 30px
}

.PostIndex-Contributions .BlockTitle {
    margin-top: 0
}

.Post-Main, .Post-Sub {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: hidden
}

@media (max-width: 690px) {
    .Post-Main, .Post-Sub {
        width: 100%;
        padding: 0 16px 16px
    }
}

.Post-Main .ContentItem-actions.is-fixed, .Post-Sub .ContentItem-actions.is-fixed {
    margin: 0
}

.Post-Main:focus {
    outline: none
}

.Post-Main .Post-topicsAndReviewer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.Post-Main .Post-Title {
    font-weight: 600;
    font-synthesis: style;
    font-size: 24px;
    line-height: 1.22;
    margin: 24px 0;
    word-wrap: break-word
}

html[data-ios] .Post-Main .Post-Title {
    font-weight: 500
}

html[data-android] .Post-Main .Post-Title {
    font-weight: 700
}

@media (max-width: 690px) {
    .Post-Main .Post-Title {
        margin: 16px 0
    }
}

.Post-Main .Post-TimeExtra {
    font-weight: 600;
    font-synthesis: style;
    font-size: 16px;
    line-height: 1.2;
    color: #8590a6
}

html[data-ios] .Post-Main .Post-TimeExtra {
    font-weight: 500
}

html[data-android] .Post-Main .Post-TimeExtra {
    font-weight: 700
}

html[data-theme=dark] .Post-Main .Post-TimeExtra {
    color: #606a80
}

.Post-Main .Post-TimeExtra a {
    color: #0084ff
}

html[data-theme=dark] .Post-Main .Post-TimeExtra a {
    color: #3a76d0
}

.Post-Main .PostIndex-warning {
    position: relative;
    margin-top: 24px;
    -webkit-box-shadow: 0 2px 4px rgba(26, 26, 26, .06);
    box-shadow: 0 2px 4px rgba(26, 26, 26, .06);
    border: 1px solid #d3d3d3;
    border-radius: 4px;
    line-height: 1.5;
    padding: 16px 40px 16px 16px
}

html[data-theme=dark] .Post-Main .PostIndex-warning {
    -webkit-box-shadow: 0 2px 4px hsla(0, 0%, 60%, .06);
    box-shadow: 0 2px 4px hsla(0, 0%, 60%, .06);
    border: 1px solid #2e2e2e
}

.Post-Main .PostIndex-warningTitle {
    font-weight: 600;
    font-synthesis: style;
    margin-bottom: 8px
}

html[data-ios] .Post-Main .PostIndex-warningTitle {
    font-weight: 500
}

html[data-android] .Post-Main .PostIndex-warningTitle {
    font-weight: 700
}

.Post-Main .PostIndex-warningContent, html[data-theme=dark] .Post-Main .PostIndex-warningContent {
    color: grey
}

.Post-Main .PostIndex-warningHelp {
    color: #bfbfbf;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -12px
}

html[data-theme=dark] .Post-Main .PostIndex-warningHelp {
    color: grey
}

.Post-Main .Voters {
    display: block;
    margin-top: 14px;
    font-size: 14px;
    color: #8590a6
}

html[data-theme=dark] .Post-Main .Voters {
    color: #606a80
}

.Post-Main .CommercialContentAnnotation {
    margin: 16px auto 0
}

.Post-Main .Post-RichText {
    margin-top: 20px
}

.Post-Main .Post-TopicsReviewer {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%
}

.Post-Main .Post-Topics {
    margin-bottom: -10px;
    padding: 16px 0
}

.Post-Main .Post-Topics .Topic {
    height: 33px;
    font-size: 13px;
    line-height: 33px;
    overflow: hidden;
    margin-bottom: 10px
}

.Post-Main .PostIndex-reviewers {
    margin-top: 16px;
    margin-bottom: 16px;
    -webkit-box-flex: 50%;
    -ms-flex: 50% 1;
    flex: 50% 1;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    text-align: right;
    color: #8590a6;
    font-size: 14px
}

html[data-theme=dark] .Post-Main .PostIndex-reviewers {
    color: #606a80
}

.Post-Main .PostIndex-reviewers-left {
    text-align: right
}

.Post-Sub .Comments-withPagination {
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin: 0 !important
}

.Post-Sub .OpenInAppButton {
    margin-bottom: env(safe-area-inset-bottom)
}

.Post-Sub .OpenInAppButton.is-shown {
    -webkit-transform: translate(-50%, -75px);
    transform: translate(-50%, -75px)
}

.MobileModal .ModalButtonGroup--horizontal {
    padding: 0 16px
}

.MobileModal .ReportMenu-textarea {
    border: none;
    background: transparent;
    padding: 0 16px
}

.MobileModal .ReportMenu-paragraph {
    margin: 0 16px
}

.MobileModal .ReportMenu-item {
    position: relative;
    padding: 12px 16px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: none
}

.MobileModal .ReportMenu-item:after {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 16px;
    border-bottom: 1px solid #f6f6f6;
    content: ""
}

html[data-theme=dark] .MobileModal .ReportMenu-item:after {
    border-bottom: 1px solid #2e2e2e
}

.Comments-footer {
    border-top: none !important
}

.CommentList-divider {
    margin: 0 16px !important
}

.CommentItem:not(:first-child):after {
    margin: 0 16px
}

.Post-Annotation {
    margin: 16px auto auto;
    max-width: 690px;
    width: 100%
}

.Post-NormalMain .CommentListV2-header-divider {
    background: #fff
}

html[data-theme=dark] .Post-NormalMain .CommentListV2-header-divider {
    background: #1a1a1a
}

.ContentItemV2-time {
    padding: 16px 0
}

@media (max-width: 690px) {
    .ContentItemV2-time {
        margin-top: 10px
    }
}

.Post-NormalMain .CommentsV2-container {
    border-top: 52px solid transparent;
    margin: -52px auto 0 !important
}

.Post-NormalMain .CommentsV2-pattern-loading {
    height: 100vh
}

.Post-Main .ContentItemV2-actions.is-fixed {
    margin: 0
}

.Post-Main .CommentsV2-withPagination {
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin: 0 !important
}

.CommentsV2-footer {
    border-top: none !important
}

.CommentTopbar {
    padding: 0
}

@media (min-width: 690px) {
    .CommentTopbar {
        margin: 0 20px
    }
}

.CommentListV2-divider {
    margin: 0 16px !important
}

.CommentItemV2:not(:first-child):after {
    margin: 0 16px
}

.PreviewComments-EmptyComment {
    text-align: center;
    margin-top: 166px
}

.PreviewComments-EmptyCommentText {
    color: #8590a6;
    font-size: 15px
}

html[data-theme=dark] .PreviewComments-EmptyCommentText {
    color: #606a80
}

.PreviewComments-InputContent {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%
}

.PreviewComments-singleButton {
    width: 72px;
    height: 36px;
    margin-top: 12px;
    float: right
}

.PreviewAuthorInfo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    white-space: nowrap;
    overflow: hidden
}

.PreviewAuthorInfo-content {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    margin-left: 12px;
    overflow: hidden
}

.PreviewAuthorInfo-head {
    font-size: 14px
}

.PreviewAuthorInfo-Author {
    color: rgba(26, 26, 26, .8)
}

html[data-theme=dark] .PreviewAuthorInfo-Author {
    color: hsla(0, 0%, 60%, .8)
}

.PreviewAuthorInfo-Type {
    color: #8590a6;
    margin-left: 8px
}

html[data-theme=dark] .PreviewAuthorInfo-Type {
    color: #606a80
}

.PreviewAuthorInfo-detail {
    font-size: 13px;
    color: #8590a6;
    margin-top: 1px
}

html[data-theme=dark] .PreviewAuthorInfo-detail {
    color: #606a80
}

.PreviewAuthorInfo-DeleteButton {
    cursor: pointer
}

.PreviewContent {
    margin-top: 14px
}

.PreviewContent-RichText {
    color: #444;
    font-size: 14px;
    line-height: 2;
    margin-top: 5px
}

html[data-theme=dark] .PreviewContent-RichText {
    color: grey
}

.PreviewContent-Line {
    margin-top: 0;
    padding: 0
}

.PreviewComments {
    position: fixed;
    top: 68px;
    right: 30px;
    border-radius: 2px;
    background: #fff;
    -webkit-box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    border: 1px solid #ebebeb
}

html[data-theme=dark] .PreviewComments {
    background: #1a1a1a;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    border: 1px solid #444
}

.PreviewComments-content {
    margin: 16px;
    width: 249px;
    height: 518px;
    position: relative;
    background: #fff
}

html[data-theme=dark] .PreviewComments-content {
    background: #1a1a1a
}

.PreviewComments-title {
    font-size: 24px;
    color: #444
}

html[data-theme=dark] .PreviewComments-title {
    color: grey
}

.PreviewComments-description {
    margin-top: 16px;
    color: #8590a6;
    font-size: 14px
}

html[data-theme=dark] .PreviewComments-description {
    color: #606a80
}

.PreviewComments-List {
    overflow-y: scroll;
    height: 400px
}

.PreviewPost-content {
    background: #fff
}

html[data-theme=dark] .PreviewPost-content {
    background: #1a1a1a
}

@media (max-width: 690px) {
    .PreviewPost-content {
        padding-top: 0
    }
}

.PreviewPost-Main {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 690px;
    margin: 0 auto
}

@media (max-width: 690px) {
    .PreviewPost-Main {
        width: 100%;
        padding: 0 16px 16px
    }
}

.PreviewPost-Title {
    font-weight: 600;
    font-synthesis: style;
    font-size: 24px;
    line-height: 1.22;
    margin: 24px 0;
    word-wrap: break-word
}

html[data-ios] .PreviewPost-Title {
    font-weight: 500
}

html[data-android] .PreviewPost-Title {
    font-weight: 700
}

@media (max-width: 690px) {
    .PreviewPost-Title {
        margin: 16px 0
    }
}

.PreviewPost-RichText {
    margin-top: 20px
}

.FakeProgress {
    width: 210px;
    height: 4px;
    background: hsla(0, 0%, 100%, .1);
    position: relative;
    border-radius: 2px
}

html[data-theme=dark] .FakeProgress {
    background: rgba(26, 26, 26, .1)
}

.FakeProgress-inner {
    -webkit-transition: width .2s ease-in;
    transition: width .2s ease-in;
    background: #fff;
    width: 0;
    height: 4px
}

html[data-theme=dark] .FakeProgress-inner {
    background: #1a1a1a
}

.WriteTitleImage, .WriteTitleImage img {
    display: block
}

.Layout-titleImage--normal .WriteTitleImage {
    margin-bottom: 24px
}

.WriteTitleImage-image {
    position: relative;
    background: #999 no-repeat 50%;
    background-size: cover
}

html[data-theme=dark] .WriteTitleImage-image {
    background: #646464 no-repeat 50%
}

.WriteTitleImage-image--full {
    width: 100vw;
    height: calc(100vh - 52px);
    margin-left: calc(330px - 50vw)
}

html[data-theme=dark] .WriteTitleImage-image--full {
    background-size: cover
}

.WriteTitleImage-image--full:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    background: rgba(26, 26, 26, .16);
    height: 100%
}

html[data-theme=dark] .WriteTitleImage-image--full:after {
    background: rgba(0, 0, 0, .16)
}

.WriteTitleImage-imagePure {
    width: 100%
}

@media (max-width: 660px) {
    .WriteTitleImage-imagePure--fixed {
        height: auto !important
    }
}

.WriteCover-wrapper {
    background: #f6f6f6;
    line-height: 192px;
    color: grey;
    min-height: 192px;
    text-align: center
}

html[data-theme=dark] .WriteCover-wrapper {
    background: #2e2e2e;
    color: grey
}

.WriteCover-previewWrapper {
    min-height: 192px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative
}

.Layout-titleImage--full .WriteCover-previewWrapper {
    position: static
}

.Layout-titleImage--normal .WriteCover-previewWrapper .WriteTitleImage {
    margin-bottom: 0
}

.WriteCover-previewWrapper .UploadPicture-wrapper {
    display: block
}

.WriteCover-previewWrapper--empty:after {
    content: "\6DFB\52A0\9898\56FE";
    color: #999;
    position: absolute;
    cursor: pointer;
    width: 100%;
    text-align: center;
    left: 0;
    bottom: 64px;
    line-height: 1;
    opacity: 0;
    z-index: 0;
    -webkit-transform: translateY(-12px);
    transform: translateY(-12px);
    -webkit-transition: all .2s;
    transition: all .2s
}

html[data-theme=dark] .WriteCover-previewWrapper--empty:after {
    color: #646464
}

.WriteCover-previewWrapper--empty:hover:after {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.WriteCover-uploadIcon {
    color: rgba(26, 26, 26, .2)
}

html[data-theme=dark] .WriteCover-uploadIcon {
    color: rgba(0, 0, 0, .2)
}

.WriteCover-previewWrapper--uploading {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.WriteCover-editWrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 42px;
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 1;
    background: rgba(26, 26, 26, .75);
    border-radius: 4px 0 0 0;
    border: 0
}

html[data-theme=dark] .WriteCover-editWrapper {
    background: rgba(0, 0, 0, .75)
}

.WriteCover-editWrapper .Button {
    color: #fff
}

html[data-theme=dark] .WriteCover-editWrapper .Button {
    color: #ebebeb
}

.WriteCover-editWrapper .Button:first-child:active {
    border-radius: 4px 0 0 0
}

.WriteCover-editWrapper .Button:active {
    background: #1a1a1a;
    opacity: .5
}

html[data-theme=dark] .WriteCover-editWrapper .Button:active {
    background: #000
}

.WriteCover-editButton {
    height: 42px;
    width: 48px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 0;
    border-radius: 0;
    padding: 0
}

.WriteIndex-titleInput {
    margin: 16px 0;
    border: 0;
    padding: 0;
    height: auto;
    width: 100%;
    position: relative
}

.WriteIndex-titleInput.is-focus, html[data-theme=dark] .WriteIndex-titleInput, html[data-theme=dark] .WriteIndex-titleInput.is-focus {
    border: 0
}

.WriteIndex-titleInput .Input {
    height: 44px;
    min-height: 44px;
    display: block;
    width: 100%;
    border: 0;
    font-size: 32px;
    line-height: 1.4;
    font-weight: 600;
    font-synthesis: style;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none
}

html[data-ios] .WriteIndex-titleInput .Input {
    font-weight: 500
}

html[data-android] .WriteIndex-titleInput .Input {
    font-weight: 700
}

.WriteIndex-titleInput .Input::-webkit-input-placeholder {
    color: #999
}

.WriteIndex-titleInput .Input:-ms-input-placeholder {
    color: #999
}

.WriteIndex-titleInput .Input::-ms-input-placeholder {
    color: #999
}

.WriteIndex-titleInput .Input::placeholder {
    color: #999
}

html[data-theme=dark] .WriteIndex-titleInput .Input::-webkit-input-placeholder {
    color: #646464
}

html[data-theme=dark] .WriteIndex-titleInput .Input:-ms-input-placeholder {
    color: #646464
}

html[data-theme=dark] .WriteIndex-titleInput .Input::-ms-input-placeholder {
    color: #646464
}

html[data-theme=dark] .WriteIndex-titleInput .Input::placeholder {
    color: #646464
}

.WriteIndex-titleInput .Input:focus {
    outline: none
}

.Layout-titleImage--full .WriteIndex-titleInput, html[data-theme=dark] .Layout-titleImage--full .WriteIndex-titleInput {
    position: absolute;
    margin: 0;
    width: 660px;
    top: calc(100vh - 44px);
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    background: transparent;
    text-shadow: 0 0 10px rgba(26, 26, 26, .18)
}

html[data-theme=dark] .Layout-titleImage--full .WriteIndex-titleInput, html[data-theme=dark] html[data-theme=dark] .Layout-titleImage--full .WriteIndex-titleInput {
    text-shadow: 0 0 10px rgba(0, 0, 0, .18)
}

.Layout-titleImage--full .WriteIndex-titleInput .Input, html[data-theme=dark] .Layout-titleImage--full .WriteIndex-titleInput .Input {
    color: #fff
}

html[data-theme=dark] .Layout-titleImage--full .WriteIndex-titleInput .Input, html[data-theme=dark] html[data-theme=dark] .Layout-titleImage--full .WriteIndex-titleInput .Input {
    color: #ebebeb
}

.Calendar {
    width: 292px;
    padding-bottom: 10px
}

.Calendar--hasBottomTool {
    padding-bottom: 0
}

.Calendar-topTool {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 20px 20px 7px;
    position: relative
}

.Calendar-topToolDate {
    color: #1a1a1a;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    font-size: 20px;
    text-align: center;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .Calendar-topToolDate {
    color: #999
}

html[data-ios] .Calendar-topToolDate {
    font-weight: 500
}

html[data-android] .Calendar-topToolDate {
    font-weight: 700
}

.Calendar-topToolButton {
    border: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    color: #8590a6;
    font-size: 12px;
    position: absolute;
    top: 24px;
    width: 24px
}

html[data-theme=dark] .Calendar-topToolButton {
    color: #606a80
}

.Calendar-topToolButton--prevYear {
    left: 20px
}

.Calendar-topToolButton--prevMonth {
    left: 44px
}

.Calendar-topToolButton--nextMonth {
    right: 44px
}

.Calendar-topToolButton--nextYear {
    right: 20px
}

.Calendar-topToolButton:hover {
    color: #0084ff
}

html[data-theme=dark] .Calendar-topToolButton:hover {
    color: #3a76d0
}

.Calendar-topToolButton button {
    height: 24px
}

.Calendar-table {
    border-collapse: separate;
    border-spacing: 12px 6px;
    padding: 0 20px 10px;
    table-layout: fixed
}

.Calendar-weekName {
    color: #8590a6;
    height: 24px;
    padding: 0;
    font-size: 12px
}

html[data-theme=dark] .Calendar-weekName {
    color: #606a80
}

.Calendar-day {
    border-radius: 4px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    font-size: 14px;
    height: 24px;
    padding: 0;
    position: relative;
    text-align: center;
    width: 24px
}

.Calendar-day.is-hovered {
    background: rgba(0, 132, 255, .1)
}

html[data-theme=dark] .Calendar-day.is-hovered {
    background: rgba(58, 118, 208, .1)
}

.Calendar-day.is-today {
    border: 1px solid #0084ff;
    color: #0084ff
}

html[data-theme=dark] .Calendar-day.is-today {
    border: 1px solid #3a76d0;
    color: #3a76d0
}

.Calendar-day.is-today.is-disabled {
    border-color: #bfbfbf;
    color: #bfbfbf
}

html[data-theme=dark] .Calendar-day.is-today.is-disabled {
    border-color: #444;
    color: #444
}

.Calendar-day.is-disabled {
    color: #bfbfbf;
    cursor: not-allowed
}

html[data-theme=dark] .Calendar-day.is-disabled {
    color: #444
}

.Calendar-day.is-disabled.is-hovered {
    background: none
}

.Calendar-day.is-not-this-month {
    color: #bfbfbf
}

html[data-theme=dark] .Calendar-day.is-not-this-month {
    color: #444
}

.Calendar-day.is-input-date {
    background: #0084ff;
    color: #fff
}

html[data-theme=dark] .Calendar-day.is-input-date {
    background: #3a76d0;
    color: #1a1a1a
}

.Calendar-day.is-in-range:before {
    content: "";
    display: block;
    background: rgba(0, 132, 255, .1);
    position: absolute;
    top: 2px;
    bottom: 2px;
    left: -6px;
    right: -6px
}

html[data-theme=dark] .Calendar-day.is-in-range:before {
    background: rgba(58, 118, 208, .1)
}

.Calendar-bottomTool {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-top: 1px solid #ebebeb;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 46px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0 8px
}

html[data-theme=dark] .Calendar-bottomTool {
    border-top: 1px solid #444
}

.Calendar-todayButton {
    color: #0084ff;
    font-size: 14px
}

html[data-theme=dark] .Calendar-todayButton {
    color: #3a76d0
}

.Calendar-todayButton[disabled] {
    color: #bfbfbf;
    cursor: not-allowed
}

html[data-theme=dark] .Calendar-todayButton[disabled] {
    color: #444
}

.DatePicker {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.DatePicker-Button {
    padding: 0 12px;
    width: 100%
}

.DatePicker-Button .Zi {
    margin-right: 4px
}

.DateTimePicker {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.DateTimePicker-label, .DateTimePicker button {
    margin-right: .6em
}

.DraftHistory {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%
}

.DraftHistory-loading {
    margin: auto
}

.DraftHistory-side {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 210px;
    border-right: 1px solid #ebebeb
}

html[data-theme=dark] .DraftHistory-side {
    border-right: 1px solid #444
}

.DraftHistory-title {
    padding: 18px 16px;
    font-size: 17px;
    line-height: 24px;
    color: #1a1a1a;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .DraftHistory-title {
    color: #999
}

html[data-ios] .DraftHistory-title {
    font-weight: 500
}

html[data-android] .DraftHistory-title {
    font-weight: 700
}

.DraftHistory-history {
    overflow: auto;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1
}

.DraftHistory-version {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 68px;
    padding-left: 40px;
    padding-right: 16px
}

.DraftHistory-version:hover {
    background-color: hsla(0, 0%, 60%, .08)
}

html[data-theme=dark] .DraftHistory-version:hover {
    background-color: hsla(0, 0%, 39.2%, .08)
}

.DraftHistory-version:before {
    content: "";
    position: absolute;
    left: 24px;
    top: 24px;
    width: 2px;
    height: 100%;
    background-color: #ebebeb;
    -webkit-transform: translate(-50%);
    transform: translate(-50%)
}

html[data-theme=dark] .DraftHistory-version:before {
    background-color: #444
}

.DraftHistory-version:last-child:before {
    height: 0
}

.DraftHistory-version:after {
    content: "";
    position: absolute;
    left: 24px;
    top: 24px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background-color: #fff;
    -webkit-box-shadow: 0 0 0 2px #999, 0 0 0 4px #fff;
    box-shadow: 0 0 0 2px #999, 0 0 0 4px #fff;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

html[data-theme=dark] .DraftHistory-version:after {
    background-color: #1a1a1a;
    -webkit-box-shadow: 0 0 0 2px #646464, 0 0 0 4px #1a1a1a;
    box-shadow: 0 0 0 2px #646464, 0 0 0 4px #1a1a1a
}

.DraftHistory-version--selected:after {
    width: 6px;
    height: 6px;
    background-color: #1a1a1a;
    -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 3px #1a1a1a;
    box-shadow: 0 0 0 2px #fff, 0 0 0 3px #1a1a1a
}

html[data-theme=dark] .DraftHistory-version--selected:after {
    background-color: #999;
    -webkit-box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 3px #999;
    box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 3px #999
}

.DraftHistory-versionDate {
    font-size: 15px;
    line-height: 20px;
    color: #1a1a1a
}

html[data-theme=dark] .DraftHistory-versionDate {
    color: #999
}

.DraftHistory-version--selected .DraftHistory-versionDate {
    font-size: 17px;
    line-height: 24px
}

.DraftHistory-versionType {
    margin-top: 4px;
    font-size: 12px;
    line-height: 16px;
    color: #999
}

html[data-theme=dark] .DraftHistory-versionType {
    color: #646464
}

.DraftHistory-main {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow: hidden;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1
}

.DraftHistory-empty {
    margin: auto
}

.DraftHistory-emptyIcon {
    display: block;
    width: 150px;
    height: 120px
}

.DraftHistory-emptyText {
    margin-top: 15px;
    font-size: 15px;
    line-height: 20px;
    text-align: center;
    color: #8590a6
}

html[data-theme=dark] .DraftHistory-emptyText {
    color: #606a80
}

.DraftHistory-draftTitle {
    padding: 40px 24px 0;
    font-size: 32px;
    line-height: 45px;
    color: #1a1a1a;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .DraftHistory-draftTitle {
    color: #999
}

html[data-ios] .DraftHistory-draftTitle {
    font-weight: 500
}

html[data-android] .DraftHistory-draftTitle {
    font-weight: 700
}

.DraftHistory-draft {
    overflow: auto;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    padding: 20px 24px
}

.DraftHistory-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 52px;
    padding: 0 24px;
    border-top: 1px solid #ebebeb
}

html[data-theme=dark] .DraftHistory-actions {
    border-top: 1px solid #444
}

.DraftHistory-meta {
    overflow: hidden;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    margin-right: 20px;
    font-size: 14px;
    line-height: 20px;
    text-align: right;
    color: #999
}

html[data-theme=dark] .DraftHistory-meta {
    color: #646464
}

.DraftHistory-revert {
    padding: 0 10px;
    border: none;
    font-size: 13px;
    color: #0084ff;
    background-color: rgba(0, 132, 255, .08);
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .DraftHistory-revert {
    color: #3a76d0;
    background-color: rgba(58, 118, 208, .08)
}

html[data-ios] .DraftHistory-revert {
    font-weight: 500
}

html[data-android] .DraftHistory-revert {
    font-weight: 700
}

.DraftHistoryModal {
    width: 888px
}

.Checkbox {
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.Checkbox--focused {
    outline: none;
    -webkit-transition: -webkit-box-shadow .3s;
    transition: -webkit-box-shadow .3s;
    transition: box-shadow .3s;
    transition: box-shadow .3s, -webkit-box-shadow .3s
}

html[data-focus-visible] .Checkbox--focused {
    -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0, 132, 255, .3);
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0, 132, 255, .3)
}

html[data-theme=dark][data-focus-visible] .Checkbox--focused {
    -webkit-box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 4px rgba(58, 118, 208, .6);
    box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 4px rgba(58, 118, 208, .6)
}

.Checkbox--disabled {
    cursor: no-drop;
    opacity: .4
}

.Checkbox-iconOn {
    color: #0084ff
}

html[data-theme=dark] .Checkbox-iconOn {
    color: #3a76d0
}

.Checkbox-iconOff {
    color: #999
}

html[data-theme=dark] .Checkbox-iconOff {
    color: #646464
}

.Checkbox-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
    position: absolute
}

.MCNSettingItem {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #f6f6f6;
    border-radius: 6px;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    margin-top: 4px;
    padding: 0 6px 0 8px
}

html[data-theme=dark] .MCNSettingItem {
    background: #2e2e2e
}

.MCNSettingItem-button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #8590a6;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-weight: 500;
    margin-left: auto
}

html[data-theme=dark] .MCNSettingItem-button {
    color: #606a80
}

.MCNSettingItem-button .Zi {
    margin-left: 2px
}

.MCNSettingItem-button--withText {
    color: #0084ff
}

html[data-theme=dark] .MCNSettingItem-button--withText {
    color: #3a76d0
}

.MCNFirstSetting {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 14px;
    margin: 40px 50px
}

.MCNFirstSetting .Button--primary, .MCNFirstSetting .Button--secondary {
    line-height: 34px
}

.MCNFirstSetting-title {
    color: #1a1a1a;
    font-weight: 500;
    font-size: 24px;
    line-height: 30px;
    margin-bottom: 8px;
    text-align: center
}

html[data-theme=dark] .MCNFirstSetting-title {
    color: #999
}

.MCNFirstSetting-titleHint {
    line-height: 20px;
    margin-bottom: 32px
}

.MCNFirstSetting-source {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px
}

.MCNFirstSetting-source--notBind {
    opacity: .3
}

.MCNFirstSetting-sourceLogo {
    height: 24px;
    margin-right: 8px;
    width: 24px
}

html[data-theme=dark] .MCNFirstSetting-sourceLogo {
    -webkit-filter: brightness(.7);
    filter: brightness(.7)
}

.MCNFirstSetting-noCategory {
    opacity: .3
}

.MCNFirstSetting-agree {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 20px;
    margin-bottom: 8px;
    margin-top: 18px
}

.MCNFirstSetting-agreeCheckbox {
    margin-right: 8px
}

.MCNFirstSetting-agreeLink, html[data-theme=dark] .MCNFirstSetting-agreeLink {
    color: #175199
}

.MCNFirstSettingStep {
    margin-bottom: 32px
}

.MCNFirstSettingStep-complete {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #0084ff;
    border-radius: 11px;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    font-weight: 500;
    height: 22px;
    line-height: 20px;
    margin-bottom: 8px;
    width: 80px
}

html[data-theme=dark] .MCNFirstSettingStep-complete {
    background: #3a76d0;
    color: #ebebeb
}

.MCNFirstSettingStep-complete .Zi {
    margin-left: 8px;
    margin-right: 4px
}

.MCNFirstSettingStep-header {
    margin-bottom: 8px
}

.MCNFirstSettingStep-header, .MCNFirstSettingStep-sequence {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.MCNFirstSettingStep-sequence {
    background: rgba(0, 132, 255, .08);
    border-radius: 50%;
    color: #0084ff;
    font-weight: 500;
    height: 24px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 8px;
    width: 24px
}

html[data-theme=dark] .MCNFirstSettingStep-sequence {
    background: rgba(58, 118, 208, .08);
    color: #3a76d0
}

.MCNFirstSettingStep-title {
    font-weight: 500;
    font-size: 14px;
    line-height: 20px
}

.MCNEditSetting {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 14px;
    margin: 40px 32px 50px
}

.MCNEditSetting-title {
    color: #1a1a1a;
    font-weight: 500;
    font-size: 24px;
    line-height: 30px;
    text-align: center
}

html[data-theme=dark] .MCNEditSetting-title {
    color: #999
}

.MCNEditSetting-itemTitle {
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 4px;
    margin-top: 32px;
    font-weight: 500
}

.MCNEditSetting-source {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px
}

.MCNEditSetting-source--notBind {
    opacity: .3
}

.MCNEditSetting-sourceLogo {
    height: 24px;
    margin-right: 8px;
    width: 24px
}

html[data-theme=dark] .MCNEditSetting-sourceLogo {
    -webkit-filter: brightness(.7);
    filter: brightness(.7)
}

.MCNJingdongSetting {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 40px
}

.MCNJingdongSetting, .MCNJingdongSetting-backButton {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px
}

.MCNJingdongSetting-backButton {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    left: 12px;
    position: absolute;
    top: 16px
}

.MCNJingdongSetting-backButton .Zi {
    margin-right: -4px
}

.MCNJingdongSetting-body {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 0 60px 24px
}

.MCNJingdongSetting-title {
    font-weight: 500;
    font-size: 24px;
    line-height: 30px;
    margin-bottom: 36px;
    text-align: center
}

.MCNJingdongSetting-logo {
    height: 80px;
    margin-bottom: 12px;
    width: 80px
}

.MCNJingdongSetting-subTitle {
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .MCNJingdongSetting-subTitle {
    font-weight: 500
}

html[data-android] .MCNJingdongSetting-subTitle {
    font-weight: 700
}

.MCNJingdongSetting-pid {
    color: #999;
    margin-top: 36px
}

html[data-theme=dark] .MCNJingdongSetting-pid {
    color: #646464
}

.MCNJingdongSetting-removeBindOkButton {
    margin-top: 27px
}

.MCNJingdongSetting-input {
    margin-top: 22px
}

.MCNJingdongSetting-inputSample {
    -ms-flex-item-align: start;
    align-self: flex-start;
    color: #8590a6;
    font-size: 12px;
    margin-top: 8px;
    margin-left: 12px;
    line-height: 17px;
    height: 20px
}

html[data-theme=dark] .MCNJingdongSetting-inputSample {
    color: #606a80
}

.MCNJingdongSetting-inputHint {
    -ms-flex-item-align: start;
    align-self: flex-start;
    margin-top: 16px;
    margin-left: 12px;
    height: 20px
}

.MCNJingdongSetting-bindButton {
    margin-top: 16px
}

.MCNJingdongSetting-hint {
    background: #f6f6f6;
    padding: 12px 24px
}

html[data-theme=dark] .MCNJingdongSetting-hint {
    background: #2e2e2e
}

.MCNJingdongSetting-hintTitle {
    color: #444;
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 8px;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .MCNJingdongSetting-hintTitle {
    color: grey
}

html[data-ios] .MCNJingdongSetting-hintTitle {
    font-weight: 500
}

html[data-android] .MCNJingdongSetting-hintTitle {
    font-weight: 700
}

.MCNJingdongSetting-hintText {
    color: #8590a6;
    font-size: 12px
}

html[data-theme=dark] .MCNJingdongSetting-hintText {
    color: #606a80
}

.MCNJingdongSetting-hintTextLink, html[data-theme=dark] .MCNJingdongSetting-hintTextLink {
    color: #175199
}

.MCNTaobaoSetting {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 40px
}

.MCNTaobaoSetting, .MCNTaobaoSetting-backButton {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px
}

.MCNTaobaoSetting-backButton {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    left: 12px;
    position: absolute;
    top: 16px
}

.MCNTaobaoSetting-backButton .Zi {
    margin-right: -4px
}

.MCNTaobaoSetting-body {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 0 60px 36px
}

.MCNTaobaoSetting-title {
    font-weight: 500;
    font-size: 24px;
    line-height: 30px;
    margin-bottom: 36px;
    text-align: center
}

.MCNTaobaoSetting-logo {
    height: 80px;
    margin-bottom: 12px;
    width: 80px
}

.MCNTaobaoSetting-subTitle {
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .MCNTaobaoSetting-subTitle {
    font-weight: 500
}

html[data-android] .MCNTaobaoSetting-subTitle {
    font-weight: 700
}

.MCNTaobaoSetting-pid {
    color: #999;
    margin-top: 36px
}

html[data-theme=dark] .MCNTaobaoSetting-pid {
    color: #646464
}

.MCNTaobaoSetting-removeBindOkButton {
    margin-bottom: 8px;
    margin-top: 28px
}

.MCNTaobaoSetting-bindButton {
    margin-bottom: 64px;
    margin-top: 54px
}

.MCNTaobaoSetting-qrcode {
    height: 200px;
    margin-top: 4px;
    width: 200px
}

.MCNTaobaoSetting-qrcodeHint {
    line-height: 24px;
    margin-top: 16px;
    text-align: center
}

.MCNTaobaoSetting-hint {
    background: #f6f6f6;
    padding: 12px 24px
}

html[data-theme=dark] .MCNTaobaoSetting-hint {
    background: #2e2e2e
}

.MCNTaobaoSetting-hintTitle {
    color: #444;
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 8px;
    font-weight: 600;
    font-synthesis: style
}

html[data-theme=dark] .MCNTaobaoSetting-hintTitle {
    color: grey
}

html[data-ios] .MCNTaobaoSetting-hintTitle {
    font-weight: 500
}

html[data-android] .MCNTaobaoSetting-hintTitle {
    font-weight: 700
}

.MCNTaobaoSetting-hintText {
    color: #8590a6;
    font-size: 12px
}

html[data-theme=dark] .MCNTaobaoSetting-hintText {
    color: #606a80
}

.MCNTaobaoSetting-hintTextLink, html[data-theme=dark] .MCNTaobaoSetting-hintTextLink {
    color: #175199
}

.MCNCategorySetting {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 40px
}

.MCNCategorySetting, .MCNCategorySetting-backButton {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px
}

.MCNCategorySetting-backButton {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    left: 12px;
    position: absolute;
    top: 16px
}

.MCNCategorySetting-backButton .Zi {
    margin-right: -4px
}

.MCNCategorySetting-body {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 0 12px 36px
}

.MCNCategorySetting-title {
    font-weight: 500;
    font-size: 24px;
    line-height: 30px;
    margin-bottom: 36px;
    text-align: center
}

.MCNCategorySetting-categoryContainer {
    margin-bottom: 24px;
    max-height: 240px;
    overflow: auto
}

.MCNCategorySetting-category, .MCNCategorySetting-categoryContainer {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.MCNCategorySetting-category {
    margin: 0 12px
}

.MCNCategorySetting-submitButton {
    width: 300px
}

.MCNCategorySetting-hint {
    background: #f6f6f6;
    padding: 12px 24px
}

html[data-theme=dark] .MCNCategorySetting-hint {
    background: #2e2e2e
}

.MCNCategorySetting-hintText {
    color: #8590a6;
    font-size: 12px
}

html[data-theme=dark] .MCNCategorySetting-hintText {
    color: #606a80
}

.MCNCategoryItem {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    border-bottom: 1px solid #ebebeb;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    height: 60px
}

html[data-theme=dark] .MCNCategoryItem {
    border-bottom: 1px solid #444
}

.MCNCategoryItem-name {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    font-size: 16px;
    font-weight: 500
}

.MCNSetting-Modal .Modal-content {
    margin: 0;
    padding: 0
}

.MCNSourceItem {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 6px;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 56px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 0
}

.MCNSourceItem-logo {
    height: 32px;
    width: 32px;
    margin-right: 16px
}

html[data-theme=dark] .MCNSourceItem-logo {
    -webkit-filter: brightness(.7);
    filter: brightness(.7)
}

.MCNSourceItem-text {
    font-size: 16px;
    font-weight: 500;
    line-height: 22px
}

.MCNSourceItem-logoBlurContainer {
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: -1
}

.MCNSourceItem-logoBlur {
    -webkit-filter: blur(16px);
    filter: blur(16px);
    position: absolute;
    left: -5px;
    top: -137px;
    width: 330px
}

.MCNSourceItem-logoCover {
    background: hsla(0, 0%, 96.5%, .95);
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%
}

html[data-theme=dark] .MCNSourceItem-logoCover {
    background: rgba(46, 46, 46, .95)
}

.MCNSourceItem:hover .MCNSourceItem-logoCover {
    background: #f6f6f6
}

html[data-theme=dark] .MCNSourceItem:hover .MCNSourceItem-logoCover {
    background: #2e2e2e
}

.MCNSourceItem--tapping:hover .MCNSourceItem-logoCover {
    background: hsla(0, 0%, 96.5%, .9)
}

html[data-theme=dark] .MCNSourceItem--tapping:hover .MCNSourceItem-logoCover {
    background: rgba(46, 46, 46, .9)
}

.MCNSourceSelector {
    background: #fff;
    min-height: 100vh
}

html[data-theme=dark] .MCNSourceSelector {
    background: #1a1a1a
}

.MCNSourceSelector-sourceList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 16px 16px 0
}

.MCNSourceSelector-source {
    margin-bottom: 24px
}

.MCNGoodEdit-subTitle {
    font-size: 15px;
    line-height: 21px;
    margin-bottom: 12px;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .MCNGoodEdit-subTitle {
    font-weight: 500
}

html[data-android] .MCNGoodEdit-subTitle {
    font-weight: 700
}

.MCNGoodEdit-goodTitle {
    font-size: 15px;
    line-height: 21px;
    margin-bottom: 32px
}

.MCNGoodEdit-subTitleHint {
    color: #999;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 13px;
    line-height: 18px;
    margin-bottom: 12px
}

html[data-theme=dark] .MCNGoodEdit-subTitleHint {
    color: #646464
}

.MCNGoodEdit-count {
    margin-left: auto
}

.MCNGoodEdit-count--exceed {
    color: #f1403c
}

html[data-theme=dark] .MCNGoodEdit-count--exceed {
    color: #b7302d
}

.MCNGoodEdit-input {
    width: 100%
}

.MCNGoodEdit-input .Zi {
    color: #8590a6
}

html[data-theme=dark] .MCNGoodEdit-input .Zi {
    color: #606a80
}

.MCNGoodEdit-buttonGroup {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 32px
}

.MCNGoodEdit-button {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.MCNGoodEdit-button:last-child {
    margin-left: 16px
}

.MCNGoodSearchCategorySelect {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.MCNGoodSearchCategorySelect-selectButton {
    height: 34px;
    line-height: 32px
}

.MCNGoodSearchCategorySelect-secondaryCategoryArrow {
    color: #999;
    margin: 0 4px
}

html[data-theme=dark] .MCNGoodSearchCategorySelect-secondaryCategoryArrow {
    color: #646464
}

.MCNGoodSearchSortSelect {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.MCNGoodSearchSortSelect-button {
    font-weight: 500;
    margin-left: 12px
}

.MCNGoodSearchEmpty {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.MCNGoodSearchEmpty-image {
    height: 180px;
    width: 225px
}

.MCNGoodSearchEmpty-hint {
    color: #8590a6;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 15px;
    margin-bottom: 70px
}

html[data-theme=dark] .MCNGoodSearchEmpty-hint {
    color: #606a80
}

.MCNGoodSearchEmpty-hintUrlButton {
    font-size: 15px
}

.MCNGoodItem {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 8px 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.MCNGoodItem-image {
    border-radius: 4px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    height: 78px;
    -o-object-fit: cover;
    object-fit: cover;
    width: 78px
}

.MCNGoodItem-info {
    margin-left: 12px;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.MCNGoodItem-title {
    font-size: 14px;
    line-height: 20px
}

.MCNGoodItem-commission {
    color: #ff9607;
    font-size: 12px;
    line-height: 18px
}

html[data-theme=dark] .MCNGoodItem-commission {
    color: #ff9607
}

.MCNGoodItem-price {
    color: #999;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 12px;
    line-height: 18px
}

html[data-theme=dark] .MCNGoodItem-price {
    color: #646464
}

.MCNGoodItem-tag {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
    border: 1px solid #f36;
    border-radius: 5px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #f36;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 18px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: 6px;
    padding: 0 4px
}

html[data-theme=dark] .MCNGoodItem-tag {
    background: #ebebeb
}

.MCNGoodItem-selectButton {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-left: 24px;
    width: 88px
}

.MCNGoodSearch-Modal {
    width: 694px
}

.MCNGoodSearch-Modal .Modal-content {
    margin: 0;
    padding: 0
}

.MCNGoodSearch-searchBar {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #ebebeb;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 64px;
    padding: 0 16px
}

html[data-theme=dark] .MCNGoodSearch-searchBar {
    border-bottom: 1px solid #444
}

.MCNGoodSearch-keywordInput, .MCNGoodSearch-urlInput {
    -webkit-transition: flex-grow .3s, -webkit-box-flex .3s;
    transition: flex-grow .3s, -webkit-box-flex .3s;
    transition: flex-grow .3s;
    transition: flex-grow .3s, -webkit-box-flex .3s, -ms-flex-positive .3s
}

.MCNGoodSearch-keywordInput .Zi, .MCNGoodSearch-urlInput .Zi {
    color: #8590a6
}

html[data-theme=dark] .MCNGoodSearch-keywordInput .Zi, html[data-theme=dark] .MCNGoodSearch-urlInput .Zi {
    color: #606a80
}

.MCNGoodSearch-keywordInput {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin-right: 12px
}

.MCNGoodSearch-searchBar--urlInputing .MCNGoodSearch-keywordInput {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0
}

.MCNGoodSearch-urlInput {
    margin-right: 16px
}

.MCNGoodSearch-searchBar--urlInputing .MCNGoodSearch-urlInput {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.MCNGoodSearch-settingButton {
    font-size: 20px;
    color: #8590a6
}

html[data-theme=dark] .MCNGoodSearch-settingButton {
    color: #606a80
}

.MCNGoodSearch-toolBar {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #ebebeb;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 60px;
    padding: 0 16px
}

html[data-theme=dark] .MCNGoodSearch-toolBar {
    border-bottom: 1px solid #444
}

.MCNGoodSearch-category {
    margin-right: auto
}

.MCNGoodSearch-sort {
    margin-left: auto
}

.MCNGoodSearch-goodListContainer {
    height: 476px;
    overflow-y: auto
}

.MCNGoodSearch-goodList {
    padding: 8px 0
}

.MCNGoodSearch-goodList--noGood {
    padding: 0
}

.MCNGoodSearch-placeHolder {
    padding: 24px
}

.MCNGoodSearch-empty {
    height: 100%
}

.PostEditor, .PostEditor.is-focus, html[data-theme=dark] .PostEditor, html[data-theme=dark] .PostEditor.is-focus {
    border: 0;
    border-top: 1px solid rgba(26, 26, 26, .08)
}

html[data-theme=dark] .PostEditor, html[data-theme=dark] .PostEditor.is-focus, html[data-theme=dark] html[data-theme=dark] .PostEditor, html[data-theme=dark] html[data-theme=dark] .PostEditor.is-focus {
    border-top: 1px solid rgba(0, 0, 0, .08)
}

.PostEditor .Editable {
    overflow: visible
}

.PostEditor .Editable-control:disabled {
    border-color: transparent
}

.PostEditor .Icon {
    fill: #999
}

html[data-theme=dark] .PostEditor .Icon {
    fill: #646464
}

.PostEditor .RichText {
    margin: 30px 0;
    padding: 0 0 200px;
    min-width: 660px
}

.PostEditor .RichText .Editable-VideoTitleInput-innerContainer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.PostEditor .DraftEditor-root {
    padding: 0;
    font-size: 16px;
    min-height: 300px
}

.PostEditor .public-DraftStyleDefault-block {
    max-width: 100%
}

.PostEditor .VideoCard-layout {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.PostEditor .Editable-imageUploader {
    margin: 0 auto
}

.PostEditor .Editable-imageUploader-layout {
    display: inline-block
}

.PostEditor-wrapper .Image-captionInput, .PostEditor-wrapper .Image-resizer {
    display: block
}

.PostEditor-wrapper .Editable-toolbarMenuItem {
    border-radius: 0;
    color: #8590a6
}

html[data-theme=dark] .PostEditor-wrapper .Editable-toolbarMenuItem {
    color: #606a80
}

.PostEditor-wrapper .Editable-toolbarMenuItem:focus {
    outline: 0
}

.PostEditor-wrapper .Editable-docModal .Modal-inner {
    min-height: 0
}

.PostEditor-scheduledPublishCallout, .PostEditor-wrapper .WatermarkHint-modalBody {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.PostEditor-scheduledPublishCallout {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    color: #8590a6
}

html[data-theme=dark] .PostEditor-scheduledPublishCallout {
    color: #606a80
}

.PostEditor-scheduledPublishCallout .DateTimePicker button {
    line-height: 26px
}

.ColumnMenu {
    position: relative;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none
}

.ColumnMenu-dropdown {
    position: absolute;
    border: 1px solid rgba(26, 26, 26, .08);
    border-radius: 4px;
    line-height: 54px;
    font-size: 14px;
    text-align: left;
    color: #1a1a1a;
    background: #fff;
    -webkit-box-shadow: 0 8px 18px rgba(26, 26, 26, .05);
    box-shadow: 0 8px 18px rgba(26, 26, 26, .05);
    -webkit-transform: translateY(-10%);
    transform: translateY(-10%);
    z-index: 100;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all .1s;
    transition: all .1s
}

html[data-theme=dark] .ColumnMenu-dropdown {
    border: 1px solid hsla(0, 0%, 60%, .08);
    color: #999;
    background: #1a1a1a;
    -webkit-box-shadow: 0 8px 18px hsla(0, 0%, 60%, .05);
    box-shadow: 0 8px 18px hsla(0, 0%, 60%, .05)
}

.ColumnMenu-dropdown li {
    padding: 0
}

.ColumnMenu-dropdown li > .Button, .ColumnMenu-dropdown li > a {
    padding: 0 16px;
    width: 100%;
    height: 42px;
    line-height: 42px;
    text-align: left;
    display: block;
    color: #1a1a1a
}

html[data-theme=dark] .ColumnMenu-dropdown li > .Button, html[data-theme=dark] .ColumnMenu-dropdown li > a {
    color: #999
}

.ColumnMenu-dropdown li:hover {
    background: #f6f6f6
}

html[data-theme=dark] .ColumnMenu-dropdown li:hover {
    background: #2e2e2e
}

.ColumnMenu-dropdown li:first-child {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px
}

.ColumnMenu-dropdown li:last-child {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px
}

.ColumnMenu-dropdown a {
    display: block
}

.MenuButton-listen-hover ~ .ColumnMenu-dropdown {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.ColumnMenu--open > .ColumnMenu-dropdown {
    visibility: visible;
    opacity: 1;
    -webkit-transform: none;
    transform: none
}

.ColumnSearchMenu .ColumnMenu-dropdown {
    min-height: 214px;
    overflow: hidden;
    width: 208px;
    left: 50%;
    margin-left: -104px
}

.ColumnSearchMenu .MenuButton-listen-click {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 auto
}

.ColumnSearchMenu .ColumnSearchMenu-selectFriendsButton.Button {
    height: auto;
    line-height: 55px;
    padding: 0
}

.ColumnSearchMenu-searchInput {
    width: 100%;
    height: 52px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.ColumnSearchMenu-searchInput, .ColumnSearchMenu-searchInput.is-focus, html[data-theme=dark] .ColumnSearchMenu-searchInput, html[data-theme=dark] .ColumnSearchMenu-searchInput.is-focus {
    border: none
}

.ColumnSearchMenu-searchInput svg {
    position: absolute;
    top: 18px;
    left: 20px;
    fill: #999
}

html[data-theme=dark] .ColumnSearchMenu-searchInput svg {
    fill: #646464
}

.ColumnSearchMenu-searchInput .Input {
    margin-left: 37px;
    color: #1a1a1a
}

html[data-theme=dark] .ColumnSearchMenu-searchInput .Input {
    color: #999
}

.ColumnSearchMenu-friends {
    border-radius: 0;
    cursor: pointer;
    padding: 5px 16px;
    line-height: 44px;
    white-space: nowrap;
    border: 0;
    color: #1a1a1a;
    text-overflow: ellipsis;
    overflow: hidden
}

html[data-theme=dark] .ColumnSearchMenu-friends {
    color: #999
}

.ColumnSearchMenu-friends span {
    font-size: 15px
}

.ColumnSearchMenu-image {
    width: 36px;
    height: 36px;
    margin-right: 14px;
    border-radius: 50%;
    vertical-align: middle;
    max-width: 100%;
    border: 0
}

.ReviewPanel-popover .Avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%
}

.ReviewPanel-triggerButton {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 10px
}

.ReviewPanel-triggerButton .Zi {
    margin-right: 2px
}

.ReviewPanel-triggerButton:hover {
    color: #1a1a1a
}

html[data-theme=dark] .ReviewPanel-triggerButton:hover {
    color: #999
}

.ReviewPanel-wrapper {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 320px;
    min-height: 277px;
    background: #fff;
    padding: 16px;
    border-radius: 14px;
    font-size: 14px;
    color: grey;
    line-height: 1.7
}

html[data-theme=dark] .ReviewPanel-wrapper {
    background: #1a1a1a;
    color: grey
}

.ReviewPanel-review {
    font-size: 14px;
    color: grey;
    line-height: 1.7;
    padding: 60px 0 30px;
    text-align: center
}

html[data-theme=dark] .ReviewPanel-review {
    color: grey
}

.ReviewPanel-review .Icon {
    fill: #67c23a;
    margin: 0 auto 16px
}

html[data-theme=dark] .ReviewPanel-review .Icon {
    fill: #67c23a
}

.ReviewPanel-section .ColumnMenu {
    border: 0;
    -webkit-box-shadow: 0;
    box-shadow: 0;
    width: auto;
    height: auto
}

.ReviewPanel-title {
    font-size: 18px;
    font-weight: 600;
    font-synthesis: style;
    color: #1a1a1a;
    margin-bottom: 16px
}

html[data-ios] .ReviewPanel-title {
    font-weight: 500
}

html[data-android] .ReviewPanel-title {
    font-weight: 700
}

html[data-theme=dark] .ReviewPanel-title {
    color: #999
}

.ReviewPanel-selectButton {
    display: block;
    height: 40px
}

.ReviewPanel-selectButton .Zi {
    color: #999
}

html[data-theme=dark] .ReviewPanel-selectButton .Zi {
    color: #646464
}

.ReviewPanel-selectButton:hover .Zi, html[data-theme=dark] .ReviewPanel-selectButton:hover .Zi {
    color: grey
}

.ReviewPanel-section + .ReviewPanel-section {
    border-top: 1px solid rgba(26, 26, 26, .1)
}

html[data-theme=dark] .ReviewPanel-section + .ReviewPanel-section {
    border-top: 1px solid hsla(0, 0%, 60%, .1)
}

.ReviewPanel-sectionTitle {
    text-align: center;
    margin-top: 20px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.ReviewPanel-sectionTitle, .ReviewPanel-selectColumnMenu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.ReviewPanel-selectColumnMenu {
    padding: 4px 0
}

.ReviewPanel-selectColumnMenu .ColumnMenu-dropdown {
    width: 200px;
    left: 50%;
    -webkit-transform: translate(-50%, 40px);
    transform: translate(-50%, 40px)
}

.ReviewPanel-selectColumnMenu .ColumnMenu-item .Button {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: inline-block;
    height: 54px
}

.ReviewPanel-selectedColumn {
    height: 36px;
    width: 36px;
    position: relative;
    cursor: pointer;
    margin: 10px auto 16px
}

.ReviewPanel-selectedColumn .Button {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0;
    width: 100%;
    background: rgba(26, 26, 26, .6);
    border-radius: 50%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: none
}

html[data-theme=dark] .ReviewPanel-selectedColumn .Button {
    background: rgba(0, 0, 0, .6)
}

.ReviewPanel-selectedColumn .Zi {
    color: #fff
}

html[data-theme=dark] .ReviewPanel-selectedColumn .Zi {
    color: #ebebeb
}

.ReviewPanel-selectedColumn:hover .Button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ReviewPanel-selectFriends {
    cursor: pointer
}

.ReviewPanel-selectFriends-transform .Zi {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.ReviewPanel-button {
    margin-top: 16px;
    text-align: right
}

.ReviewPanel-button .Button {
    margin-left: 215px;
    width: 72px;
    height: 32px;
    border-color: #0084ff;
    color: #0084ff
}

html[data-theme=dark] .ReviewPanel-button .Button {
    border-color: #3a76d0;
    color: #3a76d0
}

.ReviewPanel-button .Button[disabled] {
    color: #999;
    opacity: 1;
    background-color: transparent;
    border-color: rgba(26, 26, 26, .1)
}

html[data-theme=dark] .ReviewPanel-button .Button[disabled] {
    color: #646464;
    border-color: rgba(0, 0, 0, .1)
}

.ReviewPanel-friend {
    height: 36px;
    margin-right: 8px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ReviewPanel-friend .Avatar {
    margin: 2px 8px 0
}

.ReviewPanel-selectFriend {
    position: relative
}

.ReviewPanel-selectFriend .Button {
    position: absolute;
    top: 0;
    margin-left: 8px;
    margin-top: 2px;
    padding: 0;
    width: 36px;
    height: 36px;
    background: rgba(26, 26, 26, .6);
    border-radius: 50%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: none
}

html[data-theme=dark] .ReviewPanel-selectFriend .Button {
    background: rgba(0, 0, 0, .6)
}

.ReviewPanel-selectFriend .Zi {
    color: #fff
}

html[data-theme=dark] .ReviewPanel-selectFriend .Zi {
    color: #ebebeb
}

.ReviewPanel-selectFriend:hover .Button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ReviewPanel-columnName {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    vertical-align: middle;
    margin-right: 14px
}

.PublishPanel-triggerButton {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 .6em;
    min-width: 82px;
    height: 32px;
    line-height: 30px
}

.PublishPanel-triggerButton:disabled {
    border-color: #bfbfbf;
    color: grey
}

html[data-theme=dark] .PublishPanel-triggerButton:disabled {
    border-color: grey;
    color: grey
}

.PublishPanel-triggerButton .Zi {
    margin-right: -3px;
    pointer-events: none
}

.PublishPanel-wrapper {
    position: relative;
    float: right;
    padding: 0 10px
}

.PublishPanel-popover {
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    position: fixed;
    top: 62px;
    line-height: 1;
    cursor: default;
    width: 320px;
    min-height: 266px;
    height: auto;
    padding-bottom: 64px;
    opacity: 1;
    margin-top: -4px;
    margin-left: -12px;
    z-index: 2;
    outline: 0;
    background: #fff;
    border: 1px solid #ebebeb;
    border-radius: 4px;
    -webkit-box-shadow: 0 5px 20px rgba(26, 26, 26, .1);
    box-shadow: 0 5px 20px rgba(26, 26, 26, .1)
}

html[data-theme=dark] .PublishPanel-popover {
    background: #1a1a1a;
    border: 1px solid #2e2e2e;
    -webkit-box-shadow: 0 5px 20px rgba(0, 0, 0, .1);
    box-shadow: 0 5px 20px rgba(0, 0, 0, .1)
}

.PublishPanel-popover .PublishPanel-popoverArrow, .PublishPanel-popover .PublishPanel-popoverArrow:after {
    display: block;
    width: 0;
    height: 0;
    border-color: transparent transparent #ebebeb;
    border-style: solid;
    border-width: 0 8px 8px;
    position: fixed;
    top: -9px;
    right: 100px
}

html[data-theme=dark] .PublishPanel-popover .PublishPanel-popoverArrow, html[data-theme=dark] .PublishPanel-popover .PublishPanel-popoverArrow:after {
    border-bottom-color: #2e2e2e
}

.PublishPanel-popover .PublishPanel-popoverArrow:after {
    content: "";
    border-bottom-color: #fff;
    top: -8px
}

html[data-theme=dark] .PublishPanel-popover .PublishPanel-popoverArrow:after {
    border-bottom-color: #1a1a1a
}

.PublishPanel-title {
    font-size: 18px;
    padding: 16px;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .PublishPanel-title {
    font-weight: 500
}

html[data-android] .PublishPanel-title {
    font-weight: 700
}

.PublishPanel-content {
    max-height: 270px;
    overflow: auto;
    padding: 0 16px;
    font-size: 14px;
    color: grey;
    line-height: 1.7
}

html[data-theme=dark] .PublishPanel-content {
    color: grey
}

.PublishPanel-tags {
    margin-top: 16px
}

.PublishPanel-tags:before {
    display: table;
    content: ""
}

.PublishPanel-tags:after {
    clear: both;
    display: table;
    content: ""
}

.PublishPanel-tags li {
    position: relative;
    float: left;
    list-style: none;
    margin: 0 15px 10px 0
}

.PublishPanel-tagsWrapper {
    cursor: pointer;
    position: relative
}

.PublishPanel-tagLink, .PublishPanel-tagsWrapper {
    display: inline-block;
    max-width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.PublishPanel-tagLink {
    color: grey;
    border-radius: 15px;
    font-size: 14px;
    line-height: 20px;
    padding: 5px 36px 5px 16px;
    background: #ebebeb
}

html[data-theme=dark] .PublishPanel-tagLink {
    color: grey;
    background: #444
}

.PublishPanel-removeTag {
    cursor: pointer;
    position: absolute;
    width: 18px;
    height: 18px;
    right: 14px;
    top: 50%;
    margin-top: -8px;
    text-align: center;
    line-height: 11px
}

.PublishPanel-removeTag .Icon {
    fill: #999
}

html[data-theme=dark] .PublishPanel-removeTag .Icon {
    fill: #646464
}

.PublishPanel-searchInput {
    margin-top: 16px;
    width: 100%
}

.PublishPanel-searchInput, .PublishPanel-searchInput.is-focus, html[data-theme=dark] .PublishPanel-searchInput, html[data-theme=dark] .PublishPanel-searchInput.is-focus {
    border: none
}

.PublishPanel-searchInput .Icon--search {
    fill: #999;
    position: absolute;
    top: 8px;
    left: 2px
}

html[data-theme=dark] .PublishPanel-searchInput .Icon--search {
    fill: #646464
}

.PublishPanel-searchInput .Input {
    margin-left: 19px
}

.PublishPanel-line {
    display: block;
    width: 100%;
    background: rgba(26, 26, 26, .1);
    height: 1px;
    margin-top: 2px
}

html[data-theme=dark] .PublishPanel-line {
    background: hsla(0, 0%, 60%, .1)
}

.PublishPanel-suggest {
    position: absolute;
    top: 150px;
    z-index: 30;
    border: 1px solid rgba(26, 26, 26, .08);
    border-radius: 4px;
    -webkit-box-shadow: 0 8px 18px rgba(26, 26, 26, .05);
    box-shadow: 0 8px 18px rgba(26, 26, 26, .05);
    background-color: #fff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html[data-theme=dark] .PublishPanel-suggest {
    border: 1px solid rgba(0, 0, 0, .08);
    -webkit-box-shadow: 0 8px 18px rgba(0, 0, 0, .05);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .05);
    background-color: #1a1a1a
}

.PublishPanel-suggest .PublishPanel-row {
    cursor: pointer;
    padding: 0 16px;
    line-height: 44px;
    white-space: nowrap;
    border: 0;
    color: #1a1a1a
}

html[data-theme=dark] .PublishPanel-suggest .PublishPanel-row {
    color: #999
}

.PublishPanel-suggest .PublishPanel-row:first-child, .PublishPanel-suggest .PublishPanel-row:last-child {
    border-radius: 4px 4px 0 0
}

.PublishPanel-normalRow:hover {
    background-color: #f6f6f6
}

html[data-theme=dark] .PublishPanel-normalRow:hover {
    background-color: #2e2e2e
}

.PublishPanel-name {
    font-size: 15px
}

.PublishPanel-empty {
    color: #999
}

html[data-theme=dark] .PublishPanel-empty {
    color: #646464
}

.PublishPanel-stepOneButton {
    position: absolute;
    bottom: 16px;
    right: 16px
}

.PublishPanel-buttonWrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    bottom: 16px
}

.PublishPanel-button {
    width: 72px;
    height: 32px;
    line-height: 30px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 12px
}

.PublishPanel-columns {
    line-height: 18px;
    height: 45px;
    margin-bottom: 20px;
    position: relative;
    color: #1a1a1a
}

html[data-theme=dark] .PublishPanel-columns {
    color: #999
}

.PublishPanel-columnItem {
    line-height: 45px;
    position: relative;
    color: #1a1a1a
}

html[data-theme=dark] .PublishPanel-columnItem {
    color: #999
}

.PublishPanel-columnLabel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.PublishPanel-columnLabel span {
    display: block
}

.PublishPanel-columnInput {
    position: absolute;
    top: 10px;
    right: 0
}

.PublishPanel-description {
    font-size: 13px;
    color: #999;
    display: block
}

html[data-theme=dark] .PublishPanel-description {
    color: #646464
}

.PublishPanel-columnImg {
    height: 36px;
    margin-right: 14px;
    vertical-align: middle;
    border: none;
    border-radius: 50%
}

.PublishPanel-returnButton {
    height: 32px;
    width: 72px;
    font-size: 14px;
    border-color: transparent;
    color: grey
}

html[data-theme=dark] .PublishPanel-returnButton {
    color: grey
}

.PublishPanel-returnButton:hover {
    color: #1a1a1a
}

html[data-theme=dark] .PublishPanel-returnButton:hover {
    color: #999
}

.PublishPanel-stepTwoButton {
    margin-left: 160px;
    font-size: 12px
}

.PublishPanel-searchEmptyInput {
    display: none
}

.PublishPanel-label {
    display: block;
    margin-bottom: 20px
}

.WriteIndexLayout {
    min-height: 660px
}

.WriteIndexLayout-main {
    margin: 47px auto 0;
    width: 660px
}

@media (max-width: 660px) {
    .WriteIndexLayout-main {
        width: 100% !important;
        margin-top: 35px
    }
}

.WriteIndex-pageTitleWrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.WriteIndex-pageTitle {
    font-weight: 600;
    font-synthesis: style;
    color: #1a1a1a;
    margin-right: 20px
}

html[data-ios] .WriteIndex-pageTitle {
    font-weight: 500
}

html[data-android] .WriteIndex-pageTitle {
    font-weight: 700
}

html[data-theme=dark] .WriteIndex-pageTitle {
    color: #999
}

.WriteIndex-pageSubTitle {
    color: #999;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    max-height: 22px;
    overflow: hidden
}

html[data-theme=dark] .WriteIndex-pageSubTitle {
    color: #646464
}

.WriteIndex-LengthStatus {
    margin-bottom: 16px;
    color: #8590a6;
    font-size: 14px;
    text-align: right
}

html[data-theme=dark] .WriteIndex-LengthStatus {
    color: #606a80
}

.WriteIndex-LengthStatus-warning, .WriteIndex-pageTitleError {
    color: #f1403c
}

html[data-theme=dark] .WriteIndex-LengthStatus-warning, html[data-theme=dark] .WriteIndex-pageTitleError {
    color: #b7302d
}

@-webkit-keyframes WriteIndexLoading {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes WriteIndexLoading {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

.WriteIndex-pageTitleLoading {
    -webkit-animation: WriteIndexLoading .9s infinite;
    animation: WriteIndexLoading .9s infinite
}

.WriteIndex-previewWrapper {
    z-index: 1
}

.WriteIndex-closePreview {
    height: 24px;
    width: 24px;
    padding: 0;
    right: 0;
    position: absolute;
    top: 0;
    border: none
}

.WriteIndex .Editable-videoModal-typeButton:active {
    outline: none
}

.WriteIndex .Editable .is-fixed {
    top: 52px !important;
    width: 100%;
    border-top: 1px solid #ebebeb;
    opacity: .97;
    z-index: 1;
    -webkit-box-shadow: 0 1px 3px rgba(26, 26, 26, .1);
    box-shadow: 0 1px 3px rgba(26, 26, 26, .1)
}

html[data-theme=dark] .WriteIndex .Editable .is-fixed {
    border-top: 1px solid #444;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
}

.WriteIndex .LinkCard-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.WriteIndex .LinkCard-content div:first-child {
    -ms-flex-negative: initial;
    flex-shrink: 1
}

.WriteIndex .LinkCard-title {
    display: -webkit-box
}

.WriteIndex .LinkCard-image--default {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.WriteIndex .LinkCard-image {
    max-width: none
}

.ColumnDraftItem {
    border-bottom: 1px solid #ebebeb;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 20px 0
}

html[data-theme=dark] .ColumnDraftItem {
    border-bottom: 1px solid #444
}

.ColumnDraftItem-meta {
    color: grey;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    margin-top: 8px
}

html[data-theme=dark] .ColumnDraftItem-meta {
    color: grey
}

.ColumnDraftItem-separator {
    margin: 0 .5em
}

.ColumnDraftItem-deleteButton {
    color: grey;
    font-size: 14px
}

html[data-theme=dark] .ColumnDraftItem-deleteButton {
    color: grey
}

.ColumnDrafts-title {
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .ColumnDrafts-title {
    font-weight: 500
}

html[data-android] .ColumnDrafts-title {
    font-weight: 700
}

.ColumnDrafts-drafts {
    margin: 48px auto 0;
    max-width: 660px;
    padding: 0 20px
}

@media (max-width: 660px) {
    .ColumnDrafts-drafts {
        margin-top: 0
    }
}

.HelpTooltip {
    color: grey;
    cursor: pointer
}

html[data-theme=dark] .HelpTooltip {
    color: grey
}

.HelpTooltip-tooltip .TooltipContent-children {
    display: block;
    max-width: 250px;
    max-height: 150px;
    overflow: auto;
    word-wrap: break-word;
    white-space: normal;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
}

.ColumnSettingSection {
    margin-top: 48px
}

@media (max-width: 660px) {
    .ColumnSettingSection {
        margin-top: 12px
    }
}

.ColumnSettingSection-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ColumnSettingSection-body--vertical {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.ColumnSettingSection-title {
    font-size: 18px;
    margin-bottom: 32px;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .ColumnSettingSection-title {
    font-weight: 500
}

html[data-android] .ColumnSettingSection-title {
    font-weight: 700
}

.ColumnSettingSection-title--line {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    margin-bottom: 32px;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .ColumnSettingSection-title--line {
    font-weight: 500
}

html[data-android] .ColumnSettingSection-title--line {
    font-weight: 700
}

.ColumnSettingSection-HelpTooltip {
    margin-left: 2px
}

.ColumnSettingSection-titleLine {
    background: #d3d3d3;
    content: "";
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: 1px;
    margin-left: 16px
}

html[data-theme=dark] .ColumnSettingSection-titleLine {
    background: #2e2e2e
}

.ColumnSettingSection-titleLine--withTool {
    margin-right: 16px
}

.ColumnUserItem {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ColumnUserItem-info {
    -ms-flex-item-align: start;
    align-self: flex-start;
    margin-left: 14px
}

.ColumnUserItem-nameContainer {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 25px;
    margin-top: 1px
}

.ColumnUserItem-name {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    line-height: 25px;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .ColumnUserItem-name {
    font-weight: 500
}

html[data-android] .ColumnUserItem-name {
    font-weight: 700
}

.ColumnUserItem-description {
    color: grey;
    height: 25px;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical
}

html[data-theme=dark] .ColumnUserItem-description {
    color: grey
}

.ColumnUserItem-description:before {
    content: "\FF0C"
}

.ColumnUserItem-creatorMark {
    background-color: #f6f6f6;
    border-radius: 4px;
    color: grey;
    font-size: 12px;
    margin-left: 8px;
    padding: 3px 6px
}

html[data-theme=dark] .ColumnUserItem-creatorMark {
    background-color: #2e2e2e;
    color: grey
}

.ColumnUserItem-meta {
    color: grey;
    font-size: 14px;
    margin-top: 3px
}

html[data-theme=dark] .ColumnUserItem-meta {
    color: grey
}

.ColumnAbout-body {
    margin: 0 auto;
    max-width: 660px;
    padding: 0 16px
}

.ColumnAbout-introText {
    margin-left: 16px
}

.ColumnAbout-title {
    font-size: 20px;
    line-height: 22px;
    margin: 16px 0;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .ColumnAbout-title {
    font-weight: 500
}

html[data-android] .ColumnAbout-title {
    font-weight: 700
}

.ColumnAbout-TopicLink {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #ebebeb;
    border-radius: 15px;
    color: grey;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    height: 30px;
    margin-right: 16px;
    padding: 0 16px
}

html[data-theme=dark] .ColumnAbout-TopicLink {
    background: #444;
    color: grey
}

.ColumnAbout-TopicLink:hover {
    background: #f6f6f6
}

html[data-theme=dark] .ColumnAbout-TopicLink:hover {
    background: #2e2e2e
}

.ColumnAbout-description {
    font-size: 15px;
    line-height: 24px
}

.ColumnAbout-UserItem {
    margin-bottom: 48px
}

.ColumnSettings-container {
    margin: 0 auto;
    max-width: 660px;
    padding: 0 16px
}

.ColumnSettings-contributeRequestsCount, .ColumnSettings-tabLink {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ColumnSettings-contributeRequestsCount {
    background: #f36;
    border-radius: 8px;
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    height: 16px;
    margin-left: 4px;
    padding: 0 6px
}

html[data-theme=dark] .ColumnSettings-contributeRequestsCount {
    background: #d92155;
    color: #ebebeb
}

.Mask {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    -webkit-transition: opacity .2s ease-in;
    transition: opacity .2s ease-in
}

.Mask-hidden {
    pointer-events: none;
    opacity: 0
}

.Mask-mask {
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    opacity: .4;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.Mask-mask--black {
    background: #1a1a1a
}

html[data-theme=dark] .Mask-mask--black {
    background: #999
}

.Mask-mask--white {
    background: hsla(0, 0%, 100%, .95)
}

html[data-theme=dark] .Mask-mask--white {
    background: rgba(26, 26, 26, .95)
}

.Mask-content {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 5;
    color: #fff;
    text-align: center;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

html[data-theme=dark] .Mask-content {
    color: #1a1a1a
}

.Mask-content--full {
    width: 100%;
    height: 100%
}

.UserAvatar {
    display: inline-block;
    overflow: hidden;
    vertical-align: top;
    background-color: #fff;
    border: 4px solid #fff;
    border-radius: 8px
}

html[data-theme=dark] .UserAvatar {
    background-color: #1a1a1a;
    border: 4px solid #1a1a1a
}

.UserAvatar-inner {
    vertical-align: top
}

.UserAvatar-holder, .UserAvatar-round {
    width: 160px;
    height: 160px
}

.UserAvatar-round {
    border-radius: 50%
}

input[type=range].RangeInput {
    width: 220px;
    height: 12px;
    padding: 0;
    margin: 0 10px;
    vertical-align: middle;
    background: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

input[type=range].RangeInput:focus {
    outline: none;
    -webkit-transition: -webkit-box-shadow .3s;
    transition: -webkit-box-shadow .3s;
    transition: box-shadow .3s;
    transition: box-shadow .3s, -webkit-box-shadow .3s
}

html[data-focus-visible] input[type=range].RangeInput:focus {
    -webkit-box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0, 132, 255, .3);
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0, 132, 255, .3)
}

html[data-theme=dark][data-focus-visible] input[type=range].RangeInput:focus {
    -webkit-box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 4px rgba(58, 118, 208, .6);
    box-shadow: 0 0 0 2px #1a1a1a, 0 0 0 4px rgba(58, 118, 208, .6)
}

input[type=range].RangeInput::-webkit-slider-runnable-track {
    height: 5px;
    cursor: pointer;
    background: #f6f6f6;
    border-radius: 2px
}

html[data-theme=dark] input[type=range].RangeInput::-webkit-slider-runnable-track {
    background: #2e2e2e
}

input[type=range].RangeInput::-webkit-slider-thumb {
    width: 12px;
    height: 12px;
    margin-top: -4px;
    cursor: pointer;
    background: #d3d3d3;
    border-radius: 50%;
    -webkit-appearance: none;
    appearance: none
}

html[data-theme=dark] input[type=range].RangeInput::-webkit-slider-thumb {
    background: #2e2e2e
}

input[type=range].RangeInput::-moz-range-track {
    height: 5px;
    cursor: pointer;
    background: #f6f6f6;
    border-radius: 2px
}

html[data-theme=dark] input[type=range].RangeInput::-moz-range-track {
    background: #2e2e2e
}

input[type=range].RangeInput::-moz-range-thumb {
    width: 12px;
    height: 12px;
    cursor: pointer;
    background: #d3d3d3;
    border: none;
    border-radius: 50%
}

html[data-theme=dark] input[type=range].RangeInput::-moz-range-thumb {
    background: #2e2e2e
}

input[type=range].RangeInput::-ms-track {
    width: 100%;
    height: 5px;
    color: transparent;
    cursor: pointer;
    background: transparent;
    border-color: transparent
}

input[type=range].RangeInput::-ms-fill-lower, input[type=range].RangeInput::-ms-fill-upper {
    background: #f6f6f6;
    border-radius: 2px
}

html[data-theme=dark] input[type=range].RangeInput::-ms-fill-lower, html[data-theme=dark] input[type=range].RangeInput::-ms-fill-upper {
    background: #2e2e2e
}

input[type=range].RangeInput::-ms-thumb {
    width: 12px;
    height: 12px;
    cursor: pointer;
    background: #d3d3d3;
    border: none;
    border-radius: 50%
}

html[data-theme=dark] input[type=range].RangeInput::-ms-thumb {
    background: #2e2e2e
}

input[type=range].RangeInput::-ms-tooltip {
    display: none
}

input[type=range].RangeInput .Zi {
    vertical-align: middle;
    display: inline-block;
    fill: #8590a6
}

html[data-theme=dark] input[type=range].RangeInput .Zi {
    fill: #606a80
}

.UploadImageModal-modal {
    text-align: center
}

.UploadImageModal-modal div {
    display: block
}

.UploadImageModal-container {
    width: 100%;
    height: 100%;
    margin: 0 auto 30px;
    cursor: move
}

.UploadImageModal-container canvas {
    vertical-align: top
}

.UserAvatarEditor {
    cursor: pointer;
    position: relative
}

.UserAvatarEditor-avatar {
    background: #f6f6f6;
    border: 4px solid #fff;
    border-radius: 8px
}

html[data-theme=dark] .UserAvatarEditor-avatar {
    background: #2e2e2e;
    border: 4px solid #1a1a1a
}

.UserAvatarEditor-title {
    font-size: 24px;
    color: #1a1a1a
}

html[data-theme=dark] .UserAvatarEditor-title {
    color: #999
}

.UserAvatarEditor-subTitle {
    font-size: 14px;
    color: #8590a6
}

html[data-theme=dark] .UserAvatarEditor-subTitle {
    color: #606a80
}

.UserAvatarEditor-range {
    width: 200px;
    margin: 20px 10px
}

.UserAvatarEditor-maskInner {
    z-index: 4;
    border: 4px solid #fff;
    border-radius: 8px
}

html[data-theme=dark] .UserAvatarEditor-maskInner {
    border: 4px solid #1a1a1a
}

.UserAvatarEditor-maskInnerText {
    white-space: nowrap
}

.UserAvatarEditor-cameraIcon {
    margin-bottom: 14px;
    fill: #fff
}

html[data-theme=dark] .UserAvatarEditor-cameraIcon {
    fill: #1a1a1a
}

.UserAvatarEditor-maskRoundInner {
    border-radius: 50%
}

.ColumnInfoFormItem {
    margin-top: 60px
}

.ColumnInfoFormItem, .ColumnInfoFormItem-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ColumnInfoFormItem-title {
    text-align: right;
    line-height: 34px;
    margin-right: 36px;
    width: 90px;
    font-weight: 600;
    font-synthesis: style
}

html[data-ios] .ColumnInfoFormItem-title {
    font-weight: 500
}

html[data-android] .ColumnInfoFormItem-title {
    font-weight: 700
}

.ColumnInfoFormItem-formContainer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative
}

.ColumnInfoFormItem-Input {
    width: 370px
}

.ColumnInfoFormItem--invalid .ColumnInfoFormItem-Input {
    border: 1px solid #f36
}

html[data-theme=dark] .ColumnInfoFormItem--invalid .ColumnInfoFormItem-Input {
    border: 1px solid #d92155
}

.ColumnInfoFormItem--invalid .ColumnInfoFormItem-hint {
    color: #f36
}

html[data-theme=dark] .ColumnInfoFormItem--invalid .ColumnInfoFormItem-hint {
    color: #d92155
}

.ColumnInfoFormItem-checkboxContainer {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 34px
}

.ColumnInfoFormItem-hintForCheckbox {
    margin-left: 4px
}

.ColumnInfoFormItem-formTip {
    color: grey;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    margin-top: 10px;
    position: absolute;
    top: 100%;
    width: 100%
}

html[data-theme=dark] .ColumnInfoFormItem-formTip {
    color: grey
}

.ColumnInfoFormItem-hint {
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1
}

.ColumnInfoFormItem-maxLength {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-left: auto
}

.ColumnInfoFormItem-maxLength--overflowed {
    color: #f36
}

html[data-theme=dark] .ColumnInfoFormItem-maxLength--overflowed {
    color: #d92155
}

.ColumnInfoFormItem-hint + .ColumnInfoFormItem-maxLength {
    margin-left: 5px
}

.ColumnInfoFormItem-HelpTooltip {
    -ms-flex-item-align: center;
    align-self: center
}

.ColumnInfoFormItem-buttonGroup {
    -ms-flex-item-align: start;
    align-self: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ColumnInfoFormItem-button {
    width: 72px
}

.ColumnInfoSettings {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-top: 48px
}

.ColumnInfoSettings-AvatarEditor {
    -ms-flex-item-align: center;
    align-self: center
}

.ColumnInfoSettings-TopicLink, .ColumnInfoSettings-topicLinkContainer {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ColumnInfoSettings-TopicLink {
    background: #ebebeb;
    border-radius: 15px;
    color: grey;
    font-size: 14px;
    height: 30px;
    margin-right: 16px;
    padding: 0 16px
}

html[data-theme=dark] .ColumnInfoSettings-TopicLink {
    background: #444;
    color: grey
}

.ColumnInfoSettings-TopicLink:hover {
    background: #f6f6f6
}

html[data-theme=dark] .ColumnInfoSettings-TopicLink:hover {
    background: #2e2e2e
}

.ColumnInfoSettings-domain {
    line-height: 24px
}

.ColumnInfoSettings-hr {
    background: #ebebeb;
    border: none;
    height: 1px;
    margin-top: 60px;
    width: 100%
}

html[data-theme=dark] .ColumnInfoSettings-hr {
    background: #444
}

.ColumnInfoSettings-removeButton {
    -ms-flex-item-align: start;
    align-self: flex-start;
    margin: 60px 0 60px 116px
}

.ColumnPostsSettingItem {
    border-bottom: 1px solid #ebebeb;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 20px 0
}

html[data-theme=dark] .ColumnPostsSettingItem {
    border-bottom: 1px solid #444
}

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

.ColumnPostsSettingItem-meta {
    color: grey;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    margin-top: 8px
}

html[data-theme=dark] .ColumnPostsSettingItem-meta {
    color: grey
}

.ColumnPostsSettingItem-separator {
    margin: 0 .5em
}

.ColumnPostsSettingItem-button {
    color: grey;
    font-size: 14px
}

html[data-theme=dark] .ColumnPostsSettingItem-button {
    color: grey
}

.ColumnContributesSettingItem {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #ebebeb;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 20px 0
}

html[data-theme=dark] .ColumnContributesSettingItem {
    border-bottom: 1px solid #444
}

.ColumnContributesSettingItem-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.ColumnContributesSettingItem-meta {
    color: grey;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    margin-top: 8px
}

html[data-theme=dark] .ColumnContributesSettingItem-meta {
    color: grey
}

.ColumnContributesSettingItem-separator {
    margin: 0 .5em
}

.ColumnContributesSettingItem-tool {
    margin-left: auto
}

.ColumnContributesSettingItem-button {
    margin: 0 12px
}

.ColumnContributesSettings--empty {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #bfbfbf;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-top: 130px
}

html[data-theme=dark] .ColumnContributesSettings--empty {
    color: #444
}

.ColumnAuhtorsSettings-searchMenu {
    font-weight: 400
}

.ColumnAuhtorsSettings-UserItem {
    margin-bottom: 48px
}

.ColumnAuhtorsSettings-userTool {
    margin-left: auto
}

.ColumnAuhtorsSettings-userToolButton {
    margin-left: 24px
}

.ColumnAuhtorsSettings-changeRoleButton {
    line-height: 40px
}

.ColumnAuhtorsSettings-emptyHint {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: grey;
    font-size: 14px;
    text-align: center
}

html[data-theme=dark] .ColumnAuhtorsSettings-emptyHint {
    color: grey
}